/* RECOVERIC 매거진 · 디테일 공통 부품 (대표 지적 2026-10-24 "명품은 디테일")
   1) 편집 표 .rt        — 원단 지식 표 등 사이트의 읽는 표 전부. PC: 넓은 칸·가는 선 / 휴대폰: 줄마다 카드
   2) 사양 칸 .rs        — 원단 사양(조직·혼용률·폭·중량·1절)을 '작은 이름 / 값' 2열로
   3) 사양 한 줄 .rs-line — 좁은 자리용. 칸마다 줄바꿈 없는 덩어리, 구분점은 앞 칸 끝에 붙어 줄 첫머리에 오지 않는다
   4) 숫자 묶음 .nw      — 숫자와 단위는 절대 떨어지지 않는다
   점검: tests/detail.e2e.js (구분점 줄 첫머리 · 숫자·단위 nowrap · 넘침) */

.nw{white-space:nowrap}

/* ── 1) 편집 표 ───────────────────────────────────────── */
.rt-fig{position:relative;left:50%;width:min(1040px,calc(100cqw - 96px));margin:84px 0 0;transform:translateX(-50%)}
.rt-cap{display:block;margin:0;padding:0 0 22px;border-bottom:1px solid #111111}
.rt-no{display:flex;align-items:center;gap:12px;margin:0;font-family:'Noto Sans KR',sans-serif;font-size:10.5px;line-height:1;letter-spacing:.26em;font-weight:500;color:#1B2438;text-transform:uppercase}
.rt-no::before{content:'';width:28px;height:1px;background:#1B2438}
.rt-no .bod{font-size:14px;letter-spacing:.06em;color:#1B2438}
.rt-title{display:block;margin:14px 0 0;font-family:'Noto Serif KR',serif;font-size:25px;line-height:1.45;font-weight:500;color:#111111;letter-spacing:-.005em}
.rt{width:100%;margin:0;border-collapse:collapse;table-layout:fixed;font-family:'Noto Sans KR',sans-serif;font-size:14.5px;line-height:1.78;font-weight:400;color:#2A2A2A;word-break:keep-all;overflow-wrap:normal}
.rt thead th{padding:18px 24px 14px 0;text-align:left;vertical-align:bottom;font-size:11px;line-height:1.5;letter-spacing:.12em;font-weight:500;color:#6A6A6A;border-bottom:1px solid #D4D4D4;white-space:nowrap}
.rt thead th:first-child{width:17%}
.rt tbody th,.rt td{padding:24px 28px 24px 0;text-align:left;vertical-align:top;border-bottom:1px solid #E8E8E8}
.rt tr>:last-child{padding-right:0}
.rt tbody tr:last-child>*{border-bottom:1px solid #111111}
.rt tbody th{font-family:'Noto Serif KR',serif;font-size:17.5px;line-height:1.45;font-weight:500;color:#111111}
.rt-ko{display:block;white-space:nowrap}
.rt-alt{display:block;margin-top:6px;font-family:'Noto Sans KR',sans-serif;font-size:11.5px;line-height:1.5;font-weight:400;letter-spacing:.02em;color:#6A6A6A}
.rt .nw{font-variant-numeric:lining-nums tabular-nums;color:#111111}
.rt-note{margin:16px 0 0;font-size:12.5px;line-height:1.8;color:#6A6A6A}
@container mg (max-width:960px){
  .rt-fig{left:auto;width:auto;margin-top:60px;transform:none}
  .rt-title{font-size:21px}
  .rt,.rt tbody,.rt tr,.rt th,.rt td{display:block;width:auto}
  .rt thead{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
  .rt tbody tr{padding:24px 0 22px;border-bottom:1px solid #E8E8E8}
  .rt tbody tr:last-child{border-bottom:1px solid #111111}
  .rt tbody tr>th,.rt tbody tr>td,.rt tbody tr:last-child>*{padding:0;border:0}
  .rt tbody th{display:flex;align-items:baseline;flex-wrap:wrap;gap:2px 12px;margin:0 0 14px;font-size:20px}
  .rt-alt{margin:0;font-size:12px}
  .rt tbody tr>td,.rt tbody tr:last-child>td{display:grid;grid-template-columns:76px minmax(0,1fr);gap:14px;padding:8px 0 0;font-size:14.5px;line-height:1.7}
  .rt td::before{content:attr(data-th);padding-top:4px;font-size:11px;line-height:1.5;letter-spacing:.08em;font-weight:500;color:#6A6A6A}
}

/* ── 2) 사양 칸 ──────────────────────────────────────── */
.rs{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));column-gap:24px;margin:18px 0 0;padding:0;border-top:1px solid #D8D8D4}
.rs>div{display:flex;flex-direction:column;gap:5px;min-width:0;padding:13px 0 12px;border-bottom:1px solid #E4E4E0}
.rs>.rs-w{grid-column:1 / -1}
.rs-3{grid-template-columns:repeat(3,minmax(0,1fr));column-gap:20px}
.rs>.rs-w2{grid-column:span 2}
.rs-tbd{font-size:13px;color:#6A6A6A}
.rs dt{margin:0;font-family:'Noto Sans KR',sans-serif;font-size:10.5px;line-height:1.4;letter-spacing:.12em;font-weight:500;color:#6A6A6A}
.rs dd{display:flex;flex-wrap:wrap;align-items:baseline;gap:0;margin:0;font-family:'Noto Sans KR',sans-serif;font-size:14.5px;line-height:1.55;color:#111111}
.rs dd>span{white-space:nowrap}
.rs dd>span:not(:last-child)::after{content:'·';margin:0 .55em;color:#9A9A9A}
.rs .bod{font-size:17px;line-height:1;color:#111111;margin-right:1px}

/* ── 3) 사양 한 줄 ───────────────────────────────────── */
.rs-line{display:inline-flex;flex-wrap:wrap;align-items:baseline;row-gap:2px}
.rs-line>span{white-space:nowrap}
.rs-line>span:not(:last-child)::after{content:'·';margin:0 .5em;color:#9A9A9A}
.nt-rs{align-self:stretch;margin-top:14px}

/* ── 5) 머리표 안 한글 자간 ────────────────────────────
   .k(영문 대문자용 넓은 자간) 안의 한글 묶음 — site/render.py track_hangul · middot.js 가 <span class="kh"> 로 감싼다.
   '행 복 한 소 식' 처럼 한 자씩 떨어져 보이지 않게 한글만 좁힌다 */
.kh{letter-spacing:.06em}
