/* [생성일] 2026-11-09
   [경위] Mello Korea 제안 시안 v1 — 메인 · 브랜드 스토리 · 상품 상세 · 공지·이벤트 공용 CSS
          (POSK sian.css 구조에서 출발. 토큰 구조는 getdesign.md Airbnb DESIGN.md — 단일 액션색 · 흰 바탕 · 회색 괘선 3단 ·
           버튼 8px · 카드 14px · 4px 간격 사다리 · 제목 500/600 — 를 그대로 쓰고 색만 크림 · 코코아 · 세이지로 치환)
   [변경이력]
     - 2026-11-09: 최초 생성 (컨셉 「소프트 홀드」 — 바탕은 말랑하게, 정보는 단단하게)
   [아임웹 대응] 모든 모양은 _조사자료/아임웹_구현판정_2026-11-09.md 표에서 기본 위젯 또는 상세 설명 안 마커 코드로 확인된 것만 */

/* ── 토큰 ───────────────────────────────────────────── */
:root{
  /* 바탕 (Airbnb canvas / surface-soft / surface-strong 자리) */
  --canvas:#FBF8F3; --soft:#F3EDE4; --strong:#E9E0D3; --white:#FFFFFF;
  /* 글자 (ink / body / muted) — 코코아 계열. 대비: ink 12.9 · body 7.9 · muted 5.3 (크림 바탕 기준) */
  --ink:#3B2A20; --body:#5B4A3F; --muted:#75655A;
  /* 괘선 (hairline / hairline-soft / border-strong) */
  --hair:#E4DBCF; --hair-soft:#EEE7DC; --border-strong:#C6B9A9;
  /* 포인트 색 1개 — 세이지 (제품 색 중 하나). 글자용은 더 짙은 값 */
  --sage:#5E7357; --sage-text:#51664B; --sage-soft:#E1E7DA;
  --error:#B3412B;
  /* 글자 크기 사다리 */
  --f-hero:clamp(32px,4.2vw,52px); --f-1:clamp(26px,2.8vw,36px); --f-2:22px; --f-3:18px; --f-body:16px; --f-small:14px; --f-tiny:13px;
  /* 간격 사다리 4px 기준 (Airbnb xs 4 · sm 8 · md 12 · base 16 · lg 24 · xl 32 · xxl 48 · section 64) */
  --s-1:4px; --s-2:8px; --s-3:12px; --s-4:16px; --s-5:24px; --s-6:32px; --s-7:48px; --s-8:64px; --s-9:96px;
  /* 모서리: 버튼 8 · 사진과 카드 14 · 색 칩 원형 */
  --r-btn:8px; --r-card:14px;
  --wrap:1200px; --gutter:24px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth}
@media (prefers-reduced-motion:reduce){html{scroll-behavior:auto}}
body{margin:0;background:var(--canvas);color:var(--ink);font-family:"Pretendard Variable",Pretendard,-apple-system,"Malgun Gothic",sans-serif;font-size:var(--f-body);line-height:1.65;word-break:keep-all;-webkit-font-smoothing:antialiased}
img{display:block;width:100%;height:auto}
a{color:inherit;text-decoration:none}
h1,h2,h3{margin:0;font-weight:600;line-height:1.25;letter-spacing:-.015em;color:var(--ink)}
p{margin:0}
ul,ol{margin:0;padding:0;list-style:none}
dl,dd{margin:0}
button{font:inherit;color:inherit}
.wrap{max-width:var(--wrap);margin:0 auto;padding-left:var(--gutter);padding-right:var(--gutter)}
.narrow{max-width:820px;margin-left:auto;margin-right:auto}
:focus-visible{outline:2px solid var(--sage);outline-offset:3px;border-radius:4px}
.sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}

/* ── 버튼 (71149 커스텀 색 · 모서리 둥글기 8) ── */
.btn{display:inline-flex;align-items:center;justify-content:center;min-height:52px;padding:0 28px;font-weight:600;font-size:var(--f-body);border:1px solid var(--ink);border-radius:var(--r-btn);background:var(--ink);color:var(--canvas);white-space:nowrap;cursor:pointer;transition:background-color .2s,color .2s,border-color .2s}
.btn:hover{background:#2A1C14;border-color:#2A1C14}
.btn--line{background:transparent;color:var(--ink)}
.btn--line:hover{background:var(--soft);border-color:var(--ink)}
.btn--sm{min-height:42px;padding:0 18px;font-size:var(--f-small)}
.more{font-weight:600;color:var(--sage-text);border-bottom:1px solid transparent;transition:border-color .2s}
.more:hover{border-bottom-color:var(--sage-text)}
.lead{color:var(--body);font-size:var(--f-3);margin-top:var(--s-4);max-width:34em}
.note{color:var(--muted);font-size:var(--f-tiny);margin-top:var(--s-3)}
.ex{color:var(--muted);font-size:var(--f-tiny);font-weight:500}

/* ── 헤더: 크림 불투명 · 로고 글자 · 메뉴 3 · 로그인 장바구니 ── */
.hd{background:var(--canvas);border-bottom:1px solid var(--hair);position:sticky;top:0;z-index:20}
.hd .wrap{display:flex;align-items:center;justify-content:space-between;min-height:68px;gap:var(--s-5)}
.logo{font-weight:700;font-size:26px;letter-spacing:-.04em;line-height:1;color:var(--ink)}
.logo small{display:inline-block;margin-left:10px;font-size:11px;font-weight:500;letter-spacing:.04em;color:var(--muted);vertical-align:middle}
.nav{display:flex;gap:28px;font-size:15px;font-weight:600;color:var(--body)}
.nav a{padding:6px 0;border-bottom:2px solid transparent}
.nav a:hover{color:var(--ink)}
.nav a[aria-current]{color:var(--ink);border-bottom-color:var(--ink)}
.hd-r{display:flex;align-items:center;gap:var(--s-4);font-size:14px;font-weight:600;color:var(--body)}
.hd-r a:hover{color:var(--ink)}
.menu-t{display:none;background:none;border:1px solid var(--border-strong);border-radius:var(--r-btn);padding:8px 14px;font-size:14px;cursor:pointer}
.nav-m{display:none;border-top:1px solid var(--hair);background:var(--canvas)}
.nav-m.open{display:block}
.nav-m a{display:block;padding:14px var(--gutter);border-bottom:1px solid var(--hair-soft);font-size:16px;font-weight:600}

/* ── 섹션 공통 ── */
.sec{padding-top:var(--s-9);padding-bottom:var(--s-9)}
.sec h2{font-size:var(--f-1)}
.sec--soft{background:var(--soft)}
.sec--white{background:var(--white)}
.sec-h{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:end;gap:var(--s-4)}
.sec-h .lead{margin-top:var(--s-2)}
.two{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-7);align-items:center}
.ph{border-radius:var(--r-card);overflow:hidden;background:var(--soft)}
.ph img{aspect-ratio:var(--ar,4/5);object-fit:cover}
.ph--43{--ar:4/3} .ph--11{--ar:1/1} .ph--169{--ar:16/9} .ph--32{--ar:3/2}

/* ── 첫 화면: 2칸 섹션 (왼쪽 글 · 오른쪽 사진) — 글자가 사진을 가리지 않는다 ── */
.hero{padding-top:var(--s-7);padding-bottom:var(--s-8)}
.hero .two{grid-template-columns:5fr 6fr;gap:var(--s-8)}
.hero h1{font-size:var(--f-hero);font-weight:600;line-height:1.15;letter-spacing:-.025em}
.hero .lead{font-size:clamp(17px,1.4vw,20px);max-width:24em}
.hero-b{display:flex;flex-wrap:wrap;gap:var(--s-3);margin-top:var(--s-6)}

/* ── 증거 한 줄: 텍스트 위젯 한 문장 (숫자 띠 대신) ── */
.proof{padding:var(--s-7) 0;border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.proof p.big{font-size:clamp(22px,2.4vw,30px);font-weight:500;line-height:1.35;letter-spacing:-.015em;max-width:30em;margin:0 auto;text-align:center}
.proof .note{text-align:center}

/* ── 부품: 번호를 합성한 사진 1장 + 글 4줄 (카드 4장 금지) ── */
.parts .two{grid-template-columns:7fr 5fr;align-items:start}
.anat{position:relative}
.anat .pin{position:absolute;width:30px;height:30px;border-radius:50%;background:var(--ink);color:var(--canvas);font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;border:2px solid var(--canvas)}
.plist{counter-reset:p}
.plist li{display:grid;grid-template-columns:30px 1fr;gap:var(--s-4);padding:var(--s-5) 0;border-bottom:1px solid var(--hair)}
.plist li:first-child{padding-top:0}
.plist li::before{counter-increment:p;content:counter(p);width:30px;height:30px;border-radius:50%;background:var(--ink);color:var(--canvas);font-size:13px;font-weight:700;display:flex;align-items:center;justify-content:center;margin-top:2px}
.plist b{display:block;font-size:var(--f-3);font-weight:600;margin-bottom:var(--s-1)}
.plist p{color:var(--body);font-size:15px}

/* ── 상품 카드 (쇼핑 위젯 3열): 흰 바탕 사진 · PC 마우스 오버 착용 사진 · 썸네일 아래 컬러칩 (71423) ── */
.shop-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-6);margin-top:var(--s-7)}
.pcard{display:block}
.pcard-img{position:relative;border-radius:var(--r-card);overflow:hidden;background:var(--white);border:1px solid var(--hair-soft)}
.pcard-img img{aspect-ratio:1/1;object-fit:cover}
.pcard-img .over{position:absolute;inset:0;opacity:0;transition:opacity .35s}
@media (hover:hover){.pcard:hover .over{opacity:1}}
.chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:var(--s-3)}
.chip{width:16px;height:16px;border-radius:50%;border:1px solid rgba(59,42,32,.18);background:var(--c)}
.chip--w{border-color:var(--border-strong)}
.pcard-b{margin-top:var(--s-3)}
.pcard-b b{display:block;font-size:var(--f-3);font-weight:600}
.pcard-b small{display:block;color:var(--body);font-size:var(--f-small);margin-top:2px}
.pcard-b .price{display:flex;gap:var(--s-2);align-items:baseline;margin-top:var(--s-2);font-weight:600}

/* ── 착용: 사진 3칸 + 캡션, 동영상 위젯 1개 (16:9 커버 + 재생) ── */
.wear-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-6);margin-top:var(--s-7)}
.wear figure{margin:0}
.wear figcaption{margin-top:var(--s-3);font-size:15px;color:var(--body)}
.wear figcaption b{color:var(--ink);font-weight:600}
.video{position:relative;border-radius:var(--r-card);overflow:hidden;background:var(--ink);margin-top:var(--s-7)}
.video img{aspect-ratio:16/9;object-fit:cover;opacity:.92}
.video .play{position:absolute;left:50%;top:50%;width:72px;height:72px;margin:-36px 0 0 -36px;border-radius:50%;background:var(--canvas);border:0;cursor:pointer;display:flex;align-items:center;justify-content:center;box-shadow:0 8px 24px rgba(59,42,32,.25)}
.video .play::before{content:"";display:block;width:0;height:0;border-style:solid;border-width:11px 0 11px 19px;border-color:transparent transparent transparent var(--ink);margin-left:4px}
.video-cap{margin-top:var(--s-3);color:var(--muted);font-size:var(--f-tiny)}

/* ── 구매평 모아보기 (메인): 최신글 위젯 · 구매평 게시판 타입 · 그리드 (사진 · 제목 · 글쓴이 · 작성일) ── */
.rv-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--s-6);margin-top:var(--s-7)}
.rv{display:block}
.rv b{display:block;margin-top:var(--s-3);font-weight:600;font-size:var(--f-3);line-height:1.4}
.rv small{display:block;color:var(--muted);font-size:var(--f-small);margin-top:var(--s-1)}

/* ── 공지와 이벤트 (메인): 최신글 위젯 리스트 (제목 · 작성일) ── */
.news{margin-top:var(--s-6);border-top:1px solid var(--hair)}
.news a{display:flex;justify-content:space-between;gap:var(--s-5);padding:var(--s-4) 0;border-bottom:1px solid var(--hair)}
.news a:hover b{color:var(--sage-text)}
.news b{font-weight:500}
.news time{color:var(--muted);font-size:var(--f-small);white-space:nowrap}

/* ── 푸터: 3열 사이트맵 + 사업자 정보 + 저작권 ── */
.ft{background:var(--soft);border-top:1px solid var(--hair);padding:var(--s-8) 0 var(--s-6);color:var(--body);font-size:var(--f-small)}
.ft-grid{display:grid;grid-template-columns:2fr 1fr 1fr 1fr;gap:var(--s-6)}
.ft h3{font-size:var(--f-small);font-weight:600;margin-bottom:var(--s-3)}
.ft li{margin-top:6px}
.ft a:hover{color:var(--ink)}
.ft .logo{font-size:22px}
.ft .logo + p{margin-top:var(--s-3);max-width:26em}
.ft-info{margin-top:var(--s-7);padding-top:var(--s-5);border-top:1px solid var(--hair);color:var(--muted);font-size:var(--f-tiny);line-height:1.8}
.ft-info p span{display:inline-block;margin-right:14px}

/* ── 등장 효과: 투명도만 (71169 페이드인) · 모션 줄이기 존중 ── */
.fade{opacity:0;transition:opacity .6s ease}
.fade.in{opacity:1}
@media (prefers-reduced-motion:reduce){.fade{opacity:1;transition:none}.pcard-img .over,.btn,.more,.nav a{transition:none}}

/* ── 제작 메모 (시안 전용, 아임웹에 안 들어감) ── */
.memo-btn{position:fixed;right:16px;bottom:16px;z-index:30;background:var(--ink);color:var(--canvas);border:0;border-radius:999px;padding:12px 18px;font-size:13px;font-weight:600;cursor:pointer;box-shadow:0 8px 24px rgba(59,42,32,.25)}
.memo{display:none;position:fixed;right:16px;bottom:64px;z-index:30;width:min(420px,calc(100vw - 32px));max-height:70vh;overflow:auto;background:var(--white);border:1px solid var(--hair);border-radius:var(--r-card);padding:var(--s-5);font-size:13px;line-height:1.7;color:var(--body);box-shadow:0 16px 40px rgba(59,42,32,.18)}
.memo.open{display:block}
.memo h2{font-size:15px;margin-bottom:var(--s-2)}
.memo li{padding-left:14px;position:relative;margin-top:6px}
.memo li::before{content:"";position:absolute;left:0;top:11px;width:6px;height:1px;background:var(--muted)}

/* ── 브랜드 스토리 ── */
.bhero{padding-top:var(--s-7)}
.bhero .ph img{aspect-ratio:16/9;max-height:560px}
.bhero-t{max-width:720px;margin:var(--s-7) auto 0;text-align:center}
.bhero-t h1{font-size:var(--f-hero);font-weight:600;letter-spacing:-.025em;line-height:1.15}
.bhero-t .lead{margin-left:auto;margin-right:auto;max-width:30em}
.story .two{align-items:center}
.story h2{font-size:var(--f-1)}
.story p{color:var(--body);margin-top:var(--s-4)}
.story p + p{margin-top:var(--s-3)}
.story .two--rev > :first-child{order:2}
.korea{max-width:820px;margin:0 auto}
.korea dl{margin-top:var(--s-6);border-top:1px solid var(--hair)}
.korea dl div{display:grid;grid-template-columns:200px 1fr;gap:var(--s-5);padding:var(--s-5) 0;border-bottom:1px solid var(--hair)}
.korea dt{font-weight:600}
.korea dd{color:var(--body)}

/* ── 상품 상세: 아임웹 기본 틀 (왼쪽 사진 · 오른쪽 옵션 · 버튼) ── */
.pdp{padding-top:var(--s-7);padding-bottom:var(--s-8)}
.pdp .two{grid-template-columns:7fr 5fr;gap:var(--s-8);align-items:start}
.gal-main{border-radius:var(--r-card);overflow:hidden;background:var(--white);border:1px solid var(--hair-soft)}
.gal-main img{aspect-ratio:1/1;object-fit:cover}
.thumbs{display:grid;grid-template-columns:repeat(5,1fr);gap:var(--s-3);margin-top:var(--s-3)}
.thumbs button{padding:0;border:1px solid var(--hair);border-radius:8px;overflow:hidden;background:var(--white);cursor:pointer}
.thumbs button[aria-pressed="true"]{border-color:var(--ink)}
.thumbs img{aspect-ratio:1/1;object-fit:cover}
.buy h1{font-size:28px;font-weight:600;letter-spacing:-.02em}
.buy .sub{color:var(--body);margin-top:var(--s-2)}
.buy .price{margin-top:var(--s-5);font-size:26px;font-weight:600}
.buy .price small{font-size:var(--f-tiny);font-weight:500;color:var(--muted);margin-left:var(--s-2)}
.buy .meta{margin-top:var(--s-4);border-top:1px solid var(--hair);border-bottom:1px solid var(--hair)}
.buy .meta div{display:grid;grid-template-columns:90px 1fr;gap:var(--s-4);padding:10px 0;font-size:var(--f-small);color:var(--body)}
.buy .meta dt{color:var(--muted)}
.opt{margin-top:var(--s-5)}
.opt-l{display:flex;justify-content:space-between;font-size:var(--f-small);font-weight:600}
.opt-l span{font-weight:500;color:var(--body)}
.swatches{display:flex;flex-wrap:wrap;gap:10px;margin-top:var(--s-3)}
.sw{width:34px;height:34px;border-radius:50%;border:1px solid rgba(59,42,32,.18);background:var(--c);cursor:pointer;padding:0;position:relative}
.sw--w{border-color:var(--border-strong)}
.sw[aria-pressed="true"]::after{content:"";position:absolute;inset:-5px;border:2px solid var(--ink);border-radius:50%}
.qty{display:inline-flex;border:1px solid var(--hair);border-radius:var(--r-btn);margin-top:var(--s-3)}
.qty button{width:40px;height:44px;border:0;background:none;cursor:pointer;font-size:18px}
.qty output{width:52px;display:flex;align-items:center;justify-content:center;border-left:1px solid var(--hair);border-right:1px solid var(--hair);font-weight:600}
.sum{display:flex;justify-content:space-between;align-items:baseline;margin-top:var(--s-5);padding-top:var(--s-4);border-top:1px solid var(--hair);font-size:var(--f-small);color:var(--body)}
.sum b{font-size:22px;color:var(--ink)}
.buy-b{display:grid;grid-template-columns:1fr 1fr;gap:var(--s-3);margin-top:var(--s-4)}
.buy-b .btn{padding:0 10px}
.ship{margin-top:var(--s-4);color:var(--muted);font-size:var(--f-tiny);line-height:1.7}

/* 탭 줄 (상세정보 · 구매평 · Q&A · 배송/교환) */
.ptabs{border-top:1px solid var(--hair);border-bottom:1px solid var(--hair);background:var(--canvas)}
.ptabs ul{display:flex;gap:var(--s-6);overflow-x:auto}
.ptabs a{display:block;padding:16px 0;font-weight:600;color:var(--body);border-bottom:2px solid transparent;white-space:nowrap}
.ptabs a[aria-current]{color:var(--ink);border-bottom-color:var(--ink)}

/* 상세 설명 영역 = 마커 방식 상세 틀 (가운데 한 열 820px · 사진 크게 · POINT 번호 · 비교표 · 크기표) */
.detail{padding:var(--s-8) 0}
.detail .intro{text-align:center;max-width:620px;margin:0 auto}
.detail .intro h2{font-size:var(--f-1)}
.detail .intro p{color:var(--body);margin-top:var(--s-4)}
.point{margin-top:var(--s-9)}
.point .ph{margin-bottom:var(--s-5)}
.point .pt{font-size:var(--f-tiny);font-weight:700;letter-spacing:.08em;color:var(--sage-text)}
.point h3{font-size:var(--f-2);margin-top:var(--s-2)}
.point p{color:var(--body);margin-top:var(--s-3);max-width:40em}
.point .evi{margin-top:var(--s-3);color:var(--muted);font-size:var(--f-tiny)}
.dsec{margin-top:var(--s-9)}
.dsec h3{font-size:var(--f-2)}
.dsec .lead{font-size:var(--f-body)}
.cmp{width:100%;border-collapse:collapse;margin-top:var(--s-5);font-size:15px}
.cmp th,.cmp td{padding:14px 12px;text-align:left;border-bottom:1px solid var(--hair);vertical-align:top}
.cmp thead th{font-size:var(--f-small);color:var(--muted);font-weight:600;border-bottom:1px solid var(--border-strong)}
.cmp th:first-child{width:28%;color:var(--body);font-weight:500}
.cmp td.me{font-weight:600;background:var(--sage-soft)}
.sizes{margin-top:var(--s-5);display:grid;grid-template-columns:repeat(3,1fr);gap:var(--s-4)}
.sizes div{background:var(--white);border:1px solid var(--hair);border-radius:var(--r-card);padding:var(--s-5)}
.sizes b{display:block;font-size:var(--f-3);font-weight:600}
.sizes .num{display:block;font-size:30px;font-weight:600;letter-spacing:-.02em;margin-top:var(--s-2);font-variant-numeric:tabular-nums}
.sizes .num small{font-size:var(--f-small);font-weight:500;color:var(--muted);margin-left:4px}
.sizes p{color:var(--body);font-size:var(--f-small);margin-top:var(--s-2)}
.sizes .rec{margin-top:var(--s-3);padding-top:var(--s-3);border-top:1px solid var(--hair);font-size:var(--f-small)}
.sizes .rec b{display:inline;font-size:var(--f-small)}
.colors{margin-top:var(--s-5);display:grid;grid-template-columns:repeat(auto-fill,minmax(88px,1fr));gap:var(--s-4)}
.colors div{text-align:center;font-size:var(--f-tiny);color:var(--body)}
.colors i{display:block;width:44px;height:44px;border-radius:50%;margin:0 auto 6px;background:var(--c);border:1px solid rgba(59,42,32,.18)}
.care{margin-top:var(--s-5);border-top:1px solid var(--hair)}
.care div{display:grid;grid-template-columns:140px 1fr;gap:var(--s-5);padding:var(--s-4) 0;border-bottom:1px solid var(--hair);font-size:15px}
.care dt{font-weight:600}
.care dd{color:var(--body)}
.acc{margin-top:var(--s-5);border-top:1px solid var(--hair)}
.acc details{border-bottom:1px solid var(--hair)}
.acc summary{cursor:pointer;padding:var(--s-4) 0;font-weight:600;list-style:none;display:flex;justify-content:space-between}
.acc summary::-webkit-details-marker{display:none}
.acc summary::after{content:"+";color:var(--muted)}
.acc details[open] summary::after{content:"-"}
.acc .body{padding:0 0 var(--s-4);color:var(--body);font-size:15px}

/* 구매평 (아임웹 기본: 법정 안내 4줄 · 별점 · 사진 · 옵션 · 날짜) */
.reviews{padding:var(--s-8) 0;border-top:1px solid var(--hair)}
.reviews h2{font-size:var(--f-2)}
.reviews h2 small{font-weight:500;color:var(--muted);font-size:var(--f-small);margin-left:var(--s-2)}
.legal{margin-top:var(--s-4);color:var(--muted);font-size:var(--f-tiny);line-height:1.8;padding:var(--s-4);background:var(--soft);border-radius:var(--r-btn)}
.rvlist{margin-top:var(--s-5);border-top:1px solid var(--hair)}
.rvlist article{display:grid;grid-template-columns:1fr 120px;gap:var(--s-5);padding:var(--s-5) 0;border-bottom:1px solid var(--hair)}
.rvlist .stars{color:var(--ink);letter-spacing:2px;font-size:14px}
.rvlist .who{color:var(--muted);font-size:var(--f-tiny);margin-top:var(--s-1)}
.rvlist .who span{margin-right:10px}
.rvlist p{margin-top:var(--s-3);color:var(--body);font-size:15px}
.rvlist .ph img{aspect-ratio:1/1}
.qa{padding:var(--s-8) 0;border-top:1px solid var(--hair)}
.qa h2{font-size:var(--f-2)}
.qa .empty{margin-top:var(--s-4);padding:var(--s-6);text-align:center;border:1px dashed var(--border-strong);border-radius:var(--r-card);color:var(--muted);font-size:15px}

/* ── 게시판: 분류 메뉴 리스트(글자+밑줄) + 리스트형 게시판 ── */
.bd{padding-top:var(--s-7);padding-bottom:var(--s-9)}
.bd h1{font-size:var(--f-1)}
.tabs{display:flex;gap:var(--s-6);margin-top:var(--s-6);border-bottom:1px solid var(--hair)}
.tabs a{display:block;padding:12px 0;font-weight:600;color:var(--body);border-bottom:2px solid transparent;margin-bottom:-1px}
.tabs a[aria-current]{color:var(--ink);border-bottom-color:var(--ink)}
.blist{margin-top:var(--s-2)}
.blist a{display:grid;grid-template-columns:72px 1fr 100px 60px;gap:var(--s-4);align-items:center;padding:18px 0;border-bottom:1px solid var(--hair)}
.blist a:hover .t{color:var(--sage-text)}
.blist .cat{font-size:12px;font-weight:700;letter-spacing:.02em;padding:4px 0;text-align:center;border-radius:4px}
.cat--n{background:var(--strong);color:var(--ink)}
.cat--e{background:var(--sage-soft);color:var(--sage-text)}
.blist .t{font-weight:500}
.blist time,.blist .hit{color:var(--muted);font-size:var(--f-small);text-align:right}
.blist .hit{font-variant-numeric:tabular-nums}
.pager{display:flex;justify-content:center;gap:var(--s-2);margin-top:var(--s-6)}
.pager a{width:36px;height:36px;display:flex;align-items:center;justify-content:center;border-radius:var(--r-btn);color:var(--body);font-size:var(--f-small)}
.pager a[aria-current]{background:var(--ink);color:var(--canvas)}

/* ── 반응형 ── */
@media (max-width:1024px){
  .hero .two{grid-template-columns:1fr 1fr}
  .parts .two,.pdp .two{grid-template-columns:1fr 1fr}
  .ft-grid{grid-template-columns:1fr 1fr}
}
@media (max-width:768px){
  :root{--gutter:20px}
  .sec{padding-top:var(--s-8);padding-bottom:var(--s-8)}
  .nav,.hd-r a{display:none}
  .menu-t{display:inline-block}
  .two,.hero .two,.parts .two,.pdp .two,.story .two{grid-template-columns:1fr;gap:var(--s-6)}
  .hero .two > .ph{order:-1}
  .story .two--rev > :first-child{order:0}
  .shop-grid,.wear-grid,.rv-grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:var(--s-4)}
  .korea dl div{grid-template-columns:1fr;gap:var(--s-1)}
  .sizes{grid-template-columns:1fr}
  .cmp th,.cmp td{padding:12px 8px;font-size:14px}
  .rvlist article{grid-template-columns:1fr 88px}
  .blist a{grid-template-columns:60px 1fr 84px;gap:var(--s-3)}
  .blist .hit{display:none}
  .care div{grid-template-columns:1fr;gap:var(--s-1)}
}
@media (max-width:480px){
  :root{--gutter:16px}
  .shop-grid,.wear-grid,.rv-grid{grid-template-columns:1fr}
  .thumbs{grid-template-columns:repeat(5,1fr);gap:8px}
  .buy-b{grid-template-columns:1fr}
  .blist a{grid-template-columns:52px 1fr;row-gap:4px}
  .blist time{grid-column:2;text-align:left}
  .ft-grid{grid-template-columns:1fr}
  .proof p.big{font-size:21px}
  .hero-b .btn{flex:1 1 100%}
}
