/* 2026-10-08 blogleft (그록 봇): 블로그 글 '캐쉬노트 · AI 인싸이트' 목록. templates_blog/_cd_blogleft.html
   기본(모바일·태블릿·좁은 데스크톱): 글 아래 카드 목록 (≥700px 은 2칸).
   ≥1440px: .blog-area 를 1392px 로 넓히고 왼쪽 padding 252px → 본문 920px 그대로, 왼쪽 20px 에서 208px sticky 칸 (본문과 24px 간격),
   오른쪽 160x600 광고 레일(cd_adrail.css, 본문과 40px)은 그대로. 고정 헤더 113px → sticky top 133px. :has() 미지원이면 아래 목록 그대로 */
.cd-blogleft{display:block;max-width:920px;width:100%;margin:40px auto 0}
.cd-blogleft__stick{display:grid;grid-template-columns:1fr;gap:14px}
@media (min-width:700px){.cd-blogleft__stick{grid-template-columns:repeat(auto-fit,minmax(280px,1fr))}}
.cd-blogleft__sec{background:#fff;border:1px solid var(--blog-line,#e8ebf3);border-radius:16px;padding:14px 16px 6px;min-width:0}
.cd-blogleft__hd{display:flex;align-items:center;justify-content:space-between;gap:8px;margin:0 0 2px}
.cd-blogleft__h{margin:0;font-size:15px;font-weight:800;line-height:1.4;color:var(--blog-ink,#1e293b);letter-spacing:-.02em}
.cd-blogleft__h::before{content:"";display:inline-block;width:6px;height:6px;border-radius:50%;background:#f59e0b;margin:0 7px 0 0;vertical-align:middle;position:relative;top:-1px}
.cd-blogleft__sec--ai .cd-blogleft__h::before{background:#6366f1}
.cd-blogleft__more{flex:none;font-size:12.5px;font-weight:600;color:var(--blog-sub,#64748b)!important;padding:4px 0}
.cd-blogleft__more:hover{color:var(--blog-accent,#4f6bed)!important}
.cd-blogleft__list{list-style:none;margin:0;padding:0}
.cd-blogleft__list li{margin:0;padding:0}
.cd-blogleft__list li + li{border-top:1px solid #f1f3f8}
.cd-blogleft__item{display:flex;align-items:center;gap:12px;padding:10px 0;color:inherit!important;min-height:44px}
.cd-blogleft__th{flex:none;width:56px;height:56px;border-radius:12px;overflow:hidden;background:#f3f5fb;display:flex;align-items:center;justify-content:center;font-size:22px;line-height:1}
.cd-blogleft__th img{display:block;width:100%;height:100%;max-width:none;margin:0;border-radius:0;object-fit:cover}
.cd-blogleft__tx{min-width:0;display:flex;flex-direction:column;gap:3px}
.cd-blogleft__t{font-size:14px;font-weight:600;line-height:1.45;color:var(--blog-ink,#1e293b);display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;word-break:keep-all;overflow-wrap:anywhere}
.cd-blogleft__item:hover .cd-blogleft__t{color:var(--blog-accent,#4f6bed)}
.cd-blogleft__c{font-size:12px;line-height:1.3;font-weight:500;color:#94a3b8}
@supports selector(:has(*)) {
  @media (min-width:1440px) {
    .blog-area.blog-area:has(> .cd-blogleft--rail){position:relative;max-width:1392px;padding-left:252px}
    .blog-area > .cd-blogleft--rail{position:absolute;top:16px;bottom:64px;left:20px;width:208px;max-width:none;margin:0;z-index:1}
    .cd-blogleft--rail .cd-blogleft__stick{position:-webkit-sticky;position:sticky;top:133px;grid-template-columns:1fr;gap:12px;max-height:calc(100vh - 153px);overflow-y:auto;scrollbar-width:thin}
    .cd-blogleft--rail .cd-blogleft__sec{padding:12px 14px 4px}
    .cd-blogleft--rail .cd-blogleft__h{font-size:14px}
    .cd-blogleft--rail .cd-blogleft__more{font-size:12px}
    .cd-blogleft--rail .cd-blogleft__item{align-items:flex-start;gap:10px;padding:9px 0}
    .cd-blogleft--rail .cd-blogleft__th{width:44px;height:44px;border-radius:10px;font-size:18px}
    .cd-blogleft--rail .cd-blogleft__t{font-size:13px;line-height:1.42}
    .cd-blogleft--rail .cd-blogleft__c{font-size:11.5px}
  }
}
@media print{.cd-blogleft{display:none!important}}