.col-magazine{position: relative;}.col-magazine__track{margin: 0;padding: 0;list-style: none;}.col-magazine .col-card{height: auto;}.col-grid{list-style: none;margin: 0;padding: 0;display: grid;grid-template-columns: 1fr;gap: 16px;}.col-grid__link{display: flex;flex-direction: column;gap: 12px;text-decoration: none;color: inherit;height: 100%;}.col-grid__thumb{margin: 0;overflow: hidden;border-radius: var(--r-lg);background: var(--navy-100);aspect-ratio: 16 / 10;}.col-grid__thumb img{display: block;width: 100%;height: 100%;object-fit: cover;}.col-grid__thumb--placeholder{display: flex;align-items: center;justify-content: center;color: var(--navy-500);}.col-grid__body{display: flex;flex-direction: column;gap: 6px;}.col-grid__cat{font-size: 12px;font-weight: 600;color: var(--navy-700);letter-spacing: 0.03em;text-transform: uppercase;}.col-grid__title{margin: 0;font-size: 16px;font-weight: 700;line-height: 1.4;color: var(--ink-900);display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}.col-grid__date{font-size: 13px;color: var(--ink-500);}.col-grid__link:hover .col-grid__title{color: var(--navy-700);}.col-grid__link:focus-visible{outline: 2px solid var(--navy-700);outline-offset: 2px;border-radius: var(--r-sm);}.col-list{list-style: none;margin: 0;padding: 0;display: flex;flex-direction: column;gap: 0;}.col-list__item{border-bottom: 1px solid var(--navy-100);}.col-list__item:last-child{border-bottom: 0;}.col-list__link{display: flex;align-items: center;gap: 12px;min-height: 64px;padding: 12px 0;text-decoration: none;color: inherit;}.col-list__thumb{flex: 0 0 60px;width: 60px;height: 60px;margin: 0;overflow: hidden;border-radius: var(--r-sm);background: var(--navy-100);}.col-list__thumb img{display: block;width: 100%;height: 100%;object-fit: cover;}.col-list__body{flex: 1 1 auto;display: flex;flex-direction: column;gap: 4px;min-width: 0;}.col-list__meta{display: flex;gap: 8px;font-size: 12px;color: var(--ink-500);}.col-list__cat{font-weight: 600;color: var(--navy-700);}.col-list__title{margin: 0;font-size: 16px;font-weight: 600;line-height: 1.4;color: var(--ink-900);display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;}.col-list__link:hover .col-list__title{color: var(--navy-700);}.col-list__link:focus-visible{outline: 2px solid var(--navy-700);outline-offset: 2px;}@media (min-width: 768px){.col-grid{grid-template-columns: repeat(2,minmax(0,1fr));gap: 20px;}}@media (min-width: 1024px){.col-grid{grid-template-columns: repeat(3,minmax(0,1fr));gap: 32px 24px;}.col-grid__title{font-size: 17px;}.col-list__link{min-height: 80px;padding: 14px 0;gap: 18px;}.col-list__thumb{flex: 0 0 120px;width: 120px;height: 80px;}.col-list__title{font-size: 17px;}}
/* [feat @yuri 2026-07-07] 칼럼 리스트: 중간폭~태블릿(≥600)에도 데스크톱 리스트 여유 레이아웃 적용 — 컨테이너가 채워지며 60px 썸네일+넓은 빈 행으로 허전하던 것 균형(썸네일 120×80·행 여유). 값은 ≥1024 와 동일이라 충돌 없음, col-grid(다른 변형)는 무영향. */
@media (min-width: 600px){.col-list__link{min-height: 80px;padding: 14px 0;gap: 18px;}.col-list__thumb{flex: 0 0 120px;width: 120px;height: 80px;}.col-list__title{font-size: 17px;}}
/* [feat @yuri 2026-07-08] 위닥스 칼럼 소스 — 자체 칼럼 레이아웃(매거진/격자/리스트) 마크업(.col-card/.col-grid/.col-list)을 그대로 재사용해 3 디자인 유지. 위닥스는 외부 데이터라 썸네일 없음(플레이스홀더 아이콘)+외부 링크. 아래는 하단 '전체 N편 보기' 링크만 추가. */
.col-widoks-more{margin:16px 0 0;text-align:right;}
.col-widoks-more a{display:inline-block;font-size:14px;font-weight:700;color:var(--navy-700);text-decoration:none;padding:8px 4px;}
.col-widoks-more a:hover{color:var(--navy-800);text-decoration:underline;}
/* [feat @yuri 2026-07-08] 위닥스 격자(v2-card-grid): 카드 제목 1줄 고정 — 위닥스 제목은 길이 편차가 커서 2줄 clamp면 카드마다 body 높이가 달라져 날짜/카드 정렬이 어긋났다. 위닥스 소스에만 스코프(자체 칼럼 .col-grid 는 2줄 유지). 넘치면 말줄임(…). */
.is-widoks-source .col-grid__title{-webkit-line-clamp:1;}