/* 한옥반점 사이트 — 7안.
   원칙
   · 글자 크기는 정해진 계단만 씁니다: 12 / 13.5 / 15 / 16.5 / 18 / 22 / 28 / 36 / 60. 굵기는 400·600(첫 화면 제목만 700).
   · 자간: 본문 0, 제목 -.01em, 첫 화면 제목 .01em. 작은 글·숫자·라벨은 0. 상호는 .16em 로 넉넉히.
   · 색: 검정 바탕, 흰 제목, 모래빛 본문, 회갈 보조. 금색은 코스 옆 작은 한자에만.
   · 장식 없음. 나누는 건 가는 선과 여백. 사진은 틀 안에서 크게, 캡션은 사진 아래.
   · 예약 창(.rv)만 흰 바탕 — 입력은 밝은 데서 합니다. 달력·인원·시간은 직접 그려서 기기마다 같게. */
@font-face{font-family:"Pretendard"; font-weight:400; font-display:swap; src:url(../fonts/Pretendard-Regular.woff2) format("woff2")}
@font-face{font-family:"Pretendard"; font-weight:600; font-display:swap; src:url(../fonts/Pretendard-SemiBold.woff2) format("woff2")}
@font-face{font-family:"Pretendard"; font-weight:700; font-display:swap; src:url(../fonts/Pretendard-Bold.woff2) format("woff2")}
@font-face{font-family:"Noto Serif KR"; font-weight:900; font-display:swap; src:url(../fonts/NotoSerifKR-900.woff2) format("woff2")}

:root{
  --bg:#0E0D0C; --bg-2:#161412;
  --ink:#FFFFFF; --text:#D7D1C8; --sub:#8B8377;
  --line:rgba(255,255,255,.1); --line-2:rgba(255,255,255,.24);
  --gold:#C4A473;
  --serif:"Noto Serif KR","Apple SD Gothic Neo",serif; --sans:"Pretendard","Apple SD Gothic Neo","Malgun Gothic",sans-serif;
  --wrap:1280px; --gut:40px; --nav:88px;
}
*{box-sizing:border-box}
[hidden]{display:none!important}
html{scroll-behavior:smooth; background:var(--bg)}
body{margin:0; background:var(--bg); color:var(--text); font:400 16.5px/1.8 var(--sans); letter-spacing:0; word-break:keep-all; -webkit-font-smoothing:antialiased}
a{color:inherit; text-decoration:none}
img{display:block; max-width:100%}
figure{margin:0}
h1,h2,h3,h4{margin:0; color:var(--ink); font-weight:600; line-height:1.35; letter-spacing:-.01em}
p{margin:0 0 16px} p:last-child{margin-bottom:0}
::selection{background:#fff; color:var(--bg)}
:focus-visible{outline:2px solid var(--gold); outline-offset:3px}
.skip{position:fixed; top:8px; left:8px; z-index:1000; padding:10px 14px; background:#fff; color:var(--bg); font-weight:600; transform:translateY(-140%)}
.skip:focus{transform:translateY(0)}
.wrap{max-width:var(--wrap); margin:0 auto; padding:0 var(--gut)}
.cap{font-size:13.5px; color:var(--sub); letter-spacing:0; line-height:1.7}
.num{font-variant-numeric:tabular-nums; letter-spacing:0}
.more{display:inline-block; font-size:15px; font-weight:600; color:var(--ink); letter-spacing:0; padding-bottom:5px; border-bottom:1px solid var(--line-2); transition:border-color .2s, color .2s}
.more:hover{border-color:#fff}
.btn{display:inline-flex; align-items:center; justify-content:center; height:54px; padding:0 34px; border:1px solid rgba(255,255,255,.5); color:#fff; background:transparent; font:600 15px/1 var(--sans); letter-spacing:.02em; cursor:pointer; transition:background .2s, color .2s, border-color .2s}
.btn:hover{background:#fff; color:var(--bg); border-color:#fff}
.btn.fill{background:#fff; color:var(--bg); border-color:#fff}
.btn.fill:hover{background:#E4DED5; border-color:#E4DED5}

/* ---------- 상단 ---------- */
.nav{position:fixed; top:0; left:0; right:0; z-index:50; height:var(--nav); border-bottom:1px solid transparent; transition:background .3s, border-color .3s}
body[data-page=home] .nav{background:linear-gradient(rgba(0,0,0,.55), rgba(0,0,0,0))}
body .nav.solid, body:not([data-page=home]) .nav{background:rgba(14,13,12,.97); border-bottom-color:var(--line)}
.nav .wrap{height:100%; display:grid; grid-template-columns:1fr auto 1fr; align-items:center}
.brand{justify-self:start; display:flex; flex-direction:column; line-height:1}
.brand-ko{font-family:var(--serif); font-weight:900; font-size:24px; letter-spacing:.16em; color:#fff}
.brand-en{margin-top:8px; font-size:9px; font-weight:600; letter-spacing:.3em; color:rgba(255,255,255,.5)}
.links{display:flex; gap:46px; font-size:16px; font-weight:600; letter-spacing:.02em; color:#fff}
.links a{position:relative; padding:8px 0; opacity:.8; transition:opacity .2s}
.links a:after{content:""; position:absolute; left:0; right:0; bottom:0; height:1px; background:#fff; transform:scaleX(0); transition:transform .25s ease}
.links a:hover{opacity:1} .links a:hover:after, .links a.cur:after{transform:scaleX(1)}
.links a.cur{opacity:1}
.nav-r{justify-self:end; display:flex; align-items:center; gap:18px}
.nav-r .cta{height:44px; padding:0 26px; font-size:14.5px; letter-spacing:.02em; font-weight:600}
.burger{display:none; width:44px; height:44px; background:none; border:0; flex-direction:column; justify-content:center; gap:6px; align-items:center; cursor:pointer}
.burger i{display:block; width:22px; height:1.5px; background:#fff}
.mnav, .fab{display:none}

/* ---------- 홈 · 첫 화면 ---------- */
.hero{position:relative; height:100vh; min-height:640px; overflow:hidden; background:#000}
html.shot .hero{height:900px}
.slide{position:absolute; inset:0; background-size:cover; background-position:center; opacity:0; transition:opacity 1.6s ease}
.slide.on{opacity:1}
.slide:after{content:""; position:absolute; inset:0; background:linear-gradient(rgba(0,0,0,.4), rgba(0,0,0,.2) 40%, rgba(0,0,0,.6))}
.hero-t{position:absolute; inset:0; display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; padding:0 var(--gut); color:#fff}
.hero-t h1{font-size:60px; font-weight:700; letter-spacing:.01em; line-height:1.18; color:#fff; text-shadow:0 2px 30px rgba(0,0,0,.35)}
.hero-t p{margin:24px 0 0; font-size:15px; letter-spacing:.04em; color:rgba(255,255,255,.75)}
.hero .arr{position:absolute; top:50%; transform:translateY(-50%); width:64px; height:96px; background:none; border:0; color:#fff; cursor:pointer; opacity:.6; padding:0; transition:opacity .2s}
.hero .arr:hover{opacity:1}
.hero .arr svg{width:24px; height:48px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.hero .prev{left:24px} .hero .next{right:24px}
.hero .dots{position:absolute; left:0; right:0; bottom:38px; display:flex; justify-content:center; gap:12px}
.hero .dots i{width:5px; height:5px; border-radius:50%; background:rgba(255,255,255,.35); cursor:pointer; transition:background .2s, transform .2s}
.hero .dots i.on{background:#fff; transform:scale(1.4)}
@media (prefers-reduced-motion:reduce){ .slide{transition:none} }

/* ---------- 홈 · 구간 ---------- */
.s{padding-top:160px}
.hd{display:flex; align-items:flex-end; justify-content:space-between; gap:24px; margin-bottom:48px}
.hd h2{font-size:36px}
.hd p{margin:10px 0 0; font-size:15px; color:var(--sub); letter-spacing:0}
.two{display:grid; grid-template-columns:7fr 5fr; gap:100px; align-items:center}
.two.rev{grid-template-columns:5fr 7fr; align-items:start}
.two img{width:100%; aspect-ratio:4/3; object-fit:cover}
.two figcaption{margin-top:14px; font-size:13.5px; color:var(--sub); letter-spacing:0}
.two .t h2{font-size:36px; margin-bottom:30px}
.two .t p{font-size:17px; line-height:1.9}
.two .t .more{margin-top:16px}
/* 홈 코스 목록 — 이름과 가짓수만 */
.clist{border-top:1px solid var(--line-2)}
.clist > a{display:flex; align-items:baseline; justify-content:space-between; gap:24px; padding:22px 2px 22px 0; border-bottom:1px solid var(--line); transition:padding-left .25s ease, border-color .2s}
.clist > a:hover{padding-left:10px; border-bottom-color:var(--line-2)}
.clist b{font-size:22px; font-weight:600; color:var(--ink); letter-spacing:0}
.clist b small{font-family:var(--serif); font-weight:900; font-size:12px; color:var(--gold); margin-left:10px; letter-spacing:.1em; vertical-align:2px}
.clist i{font-style:normal; font-size:0; width:22px; height:9px; position:relative; flex:none; align-self:center}
.clist i:before{content:""; position:absolute; right:0; top:4px; width:20px; height:1px; background:var(--sub); transition:width .25s ease, background .2s}
.clist i:after{content:""; position:absolute; right:0; top:1px; width:7px; height:7px; border-top:1px solid var(--sub); border-right:1px solid var(--sub); transform:rotate(45deg); transition:border-color .2s}
.clist > a:hover i:before{width:26px; background:#fff} .clist > a:hover i:after{border-color:#fff}
.clist + .cap{margin-top:18px}
/* 홈 공간 타일 */
.tiles{display:grid; grid-template-columns:repeat(3,1fr); gap:40px 20px}
.tiles .wide{grid-column:1 / -1}
.tiles img{width:100%; aspect-ratio:4/3; object-fit:cover}
.tiles .wide img{aspect-ratio:21/9}
.tiles figcaption{margin-top:14px; font-size:15px; letter-spacing:0}
.tiles figcaption b{color:var(--ink); font-weight:600; margin-right:10px; letter-spacing:0}
.tiles figcaption span{color:var(--sub); font-size:13.5px}
/* 홈 정보 세 칸 */
.info{display:grid; grid-template-columns:repeat(3,1fr); border-top:1px solid var(--line-2); border-bottom:1px solid var(--line)}
.info > div{padding:40px 40px 40px 0; border-right:1px solid var(--line)}
.info > div + div{padding-left:40px}
.info > div:last-child{border-right:0; padding-right:0}
.info h3{font-size:13.5px; font-weight:600; color:var(--sub); letter-spacing:0; margin-bottom:16px}
.info .v{font-size:18px; color:var(--ink); line-height:1.6; letter-spacing:0}
.info p{font-size:14.5px; color:var(--sub); letter-spacing:0; margin:10px 0 0}
.info .row{display:grid; grid-template-columns:92px 1fr; gap:8px; font-size:16px; color:var(--ink); letter-spacing:0; font-variant-numeric:tabular-nums; line-height:1.95}
.info .row.mute{color:var(--sub); font-size:14px}
.info .lk{display:flex; gap:20px; margin-top:16px}
/* 홈 마지막 예약 띠 */
.band{position:relative; margin-top:160px; height:580px; display:flex; align-items:center; justify-content:center; text-align:center; overflow:hidden; background:#000}
html.shot .band{height:580px}
.band img{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.45}
.band .in{position:relative; color:#fff; padding:0 var(--gut)}
.band h2{font-size:42px; color:#fff}
.band p{margin:20px auto 36px; font-size:16.5px; color:rgba(255,255,255,.8); max-width:520px}
.band .cap{color:rgba(255,255,255,.5); margin-top:24px}

/* ---------- 안쪽 장 ---------- */
.page-head{position:relative; height:460px; margin-top:var(--nav); display:flex; align-items:flex-end; overflow:hidden; background:#000}
.page-head .pic{position:absolute; inset:0; width:100%; height:100%; object-fit:cover; opacity:.55}
.page-head:after{content:""; position:absolute; inset:0; background:linear-gradient(rgba(0,0,0,.1), rgba(0,0,0,.55))}
.page-head .wrap{position:relative; z-index:1; width:100%; padding-bottom:64px; color:#fff}
.page-head h1{font-size:46px; color:#fff; letter-spacing:0}
.page-head p{margin:16px 0 0; font-size:16.5px; color:rgba(255,255,255,.8); max-width:560px}
.page-head .acts{margin-top:28px}
.sec{padding:128px 0}
.sec + .sec{border-top:1px solid var(--line)}
/* 왼쪽 제목 · 오른쪽 내용 */
.ed{display:grid; grid-template-columns:3fr 9fr; gap:72px; align-items:start}
.ed .eh{position:sticky; top:calc(var(--nav) + 48px)}
.ed .eh h2{font-size:28px}
.ed .eh p{margin:12px 0 0; font-size:14.5px; color:var(--sub); letter-spacing:0}
.prose p{font-size:17px; line-height:1.95}
.prose .sign{margin-top:40px; font-size:16.5px; color:var(--ink); font-weight:600; text-align:right}
.pics{display:grid; grid-template-columns:1fr 1fr; gap:20px; margin-top:72px}
.pics img{width:100%; aspect-ratio:4/3; object-fit:cover}
.pics figcaption{margin-top:14px; font-size:13.5px; color:var(--sub); letter-spacing:0}
.sns{display:flex; gap:26px; margin-top:36px}

/* 총주방장 — 배경 없는 사진 + 한마디 */
.chef{display:grid; grid-template-columns:5fr 7fr; gap:72px; align-items:end}
.chef figure{position:relative; padding-top:24px}
.chef figure:before{content:""; position:absolute; left:8%; right:8%; bottom:0; height:60%; background:var(--bg-2); z-index:0}
.chef img{position:relative; z-index:1; width:100%; max-width:440px; margin:0 auto; display:block}
.chef .t{padding-bottom:40px}
.chef .who{font-size:14px; color:var(--sub); letter-spacing:.04em; margin-bottom:12px}
.chef h2{font-size:40px; letter-spacing:.06em; margin-bottom:26px}
.chef .quote{font-size:24px; line-height:1.6; color:var(--ink); letter-spacing:.02em; margin-bottom:26px; font-weight:400}
.chef p{font-size:16.5px; line-height:1.9}
/* 차림 머리 아래 한 줄 */
.chef-band{position:relative; z-index:2; border-bottom:1px solid var(--line); background:var(--bg-2)}
.chef-band .wrap{display:flex; align-items:flex-end; justify-content:space-between; gap:48px; min-height:150px}
.chef-band .t{padding:34px 0; margin-left:auto; text-align:right}
.chef-band .t span{display:block; font-size:13.5px; color:var(--sub); letter-spacing:.04em; margin-bottom:10px}
.chef-band .t b{font-size:22px; font-weight:600; color:var(--ink); letter-spacing:.02em}
.chef-band img{height:190px; width:auto; margin-top:-40px; flex:none}

/* 공간 — 방마다 가장 편한 인원과 최대 인원을 사진 아래에서 바로 비교합니다 */
.rooms{display:grid; grid-template-columns:repeat(4,1fr); gap:48px 20px}
.halls{display:grid; grid-template-columns:1fr 1fr; gap:48px 20px}
.room img{width:100%; aspect-ratio:4/3; object-fit:cover}
.hall img{width:100%; aspect-ratio:16/10; object-fit:cover}
.room figcaption, .hall figcaption{margin-top:16px; font-size:18px; font-weight:600; color:var(--ink); letter-spacing:.02em}
.room figcaption b{font:inherit}
.room figcaption span{display:block; margin-top:5px; color:var(--sub); font-size:13.5px; font-weight:400; letter-spacing:0}

/* ---------- 차림 ---------- */
.course{padding:44px 0; border-top:1px solid var(--line)}
.course:first-child{border-top:0; padding-top:0}
.course:last-child{padding-bottom:0}
.course .ch{display:flex; align-items:baseline; gap:14px; margin-bottom:24px}
.course h3{font-size:28px}
.course h3 small{font-family:var(--serif); font-weight:900; font-size:14px; color:var(--gold); margin-left:12px; letter-spacing:.12em; vertical-align:3px}
.course .ch i{font-style:normal; font-size:13.5px; color:var(--sub); letter-spacing:0; margin-left:auto; font-variant-numeric:tabular-nums}
.course .dishes{display:grid; grid-template-columns:1fr 1fr; gap:0 56px}
.course ul{list-style:none; margin:0; padding:0}
.course li{padding:10px 0; border-bottom:1px solid var(--line); font-size:16px}
.lunch + .lunch{margin-top:72px}
.lunch h3{font-size:24px; margin-bottom:24px}
.lunch h3 small{font-size:13.5px; font-weight:400; color:var(--sub); margin-left:12px; letter-spacing:0}
.set{display:grid; grid-template-columns:170px 1fr; gap:24px; padding:20px 0; border-top:1px solid var(--line)}
.set:last-child{border-bottom:1px solid var(--line)}
.set b{font-size:17px; font-weight:600; color:var(--ink); letter-spacing:0}
.set span{font-size:15.5px; line-height:1.8}
.dish-cols{columns:2; column-gap:72px}
.dgroup{break-inside:avoid; margin-bottom:52px}
.dgroup:last-child{margin-bottom:0}
.dgroup h3{font-size:20px; margin-bottom:10px}
.dgroup h3 small{font-family:var(--serif); font-weight:900; font-size:12px; color:var(--gold); margin-left:10px; letter-spacing:.08em; vertical-align:2px}
.dish, .drink{display:flex; align-items:baseline; gap:16px; padding:14px 0; border-bottom:1px solid var(--line)}
.dish .n, .drink .n{font-size:16.5px; font-weight:600; color:var(--ink); letter-spacing:0}
.dish .opt, .drink .opt{margin-left:auto; text-align:right; font-size:13.5px; color:var(--sub); letter-spacing:0}
.drink-cols{display:grid; grid-template-columns:1fr 1fr; gap:72px}

/* ---------- 오시는 길 ---------- */
.visit{display:grid; grid-template-columns:5fr 7fr; gap:88px; align-items:start}
.visit address{font-style:normal; font-size:16.5px; margin-bottom:22px}
.visit address b{display:block; font-size:28px; font-weight:600; color:var(--ink); letter-spacing:0; line-height:1.35; margin-bottom:12px}
.map-links{display:flex; gap:12px; margin-bottom:52px}
.visit h3{font-size:13.5px; font-weight:600; color:var(--sub); letter-spacing:0; margin:44px 0 14px}
.visit .visit-l h3:first-of-type{margin-top:0}
.sketch h3:first-of-type{margin-top:44px}
.hours div{display:grid; grid-template-columns:112px 1fr; gap:12px; padding:12px 0; border-top:1px solid var(--line); font-size:16px; letter-spacing:0; font-variant-numeric:tabular-nums}
.hours div b{color:var(--ink); font-weight:600}
.hours .note{display:block; padding:5px 0; border-top:0; color:var(--sub); font-size:14px}
.hours .note b{display:none}
.plain{list-style:none; margin:0; padding:0}
.plain li{padding:11px 0; border-bottom:1px solid var(--line); font-size:16px}
.plain li:first-child{border-top:1px solid var(--line)}
.hours div:nth-child(2){padding-bottom:18px; border-bottom:1px solid var(--line)} .hours div:nth-child(3){padding-top:16px}
.sketch svg{width:100%; height:auto; border:1px solid var(--line); background:var(--bg-2); border-radius:6px}
.sketch .road{font-family:var(--sans); font-size:13px; font-weight:600; fill:#9A9186; letter-spacing:.02em}
.sketch .lbl{font-family:var(--sans); font-size:17px; font-weight:700; fill:#fff; letter-spacing:-.01em}
.sketch .lbl.light{fill:#0E0D0C}
.sketch .lbl.mute{fill:#B9AE9C; font-size:13px; font-weight:600}
.sketch .pk{font-weight:800; fill:#B9AE9C}
.steps{counter-reset:s; list-style:none; padding:0; margin:0}
.steps li{counter-increment:s; display:grid; grid-template-columns:28px 1fr; gap:12px; padding:12px 0; border-bottom:1px solid var(--line); font-size:16px}
.steps li:before{content:counter(s); color:var(--sub); letter-spacing:0; font-variant-numeric:tabular-nums}
.prose-s p{font-size:16px; line-height:1.85; margin-bottom:6px}

/* ---------- 예약 장 ---------- */
.reserve{display:grid; grid-template-columns:6fr 5fr; gap:100px; align-items:start}
.notes{list-style:none; padding:0; margin:0; border-top:1px solid var(--line-2)}
.notes li{padding:18px 0; border-bottom:1px solid var(--line); font-size:16px; display:grid; grid-template-columns:96px 1fr; gap:16px; line-height:1.8}
.notes li b{font-weight:600; color:var(--ink); font-size:14.5px; letter-spacing:0}
.res-go{border:1px solid var(--line-2); padding:44px}
.res-go h3{font-size:24px; margin-bottom:14px}
.res-go > p{font-size:16px}
.res-go ol{margin:26px 0 34px; padding:0; list-style:none; counter-reset:s}
.res-go li{counter-increment:s; display:grid; grid-template-columns:28px 1fr; gap:12px; padding:12px 0; border-top:1px solid var(--line); font-size:15.5px}
.res-go li:last-child{border-bottom:1px solid var(--line)}
.res-go li:before{content:counter(s); color:var(--sub); letter-spacing:0}
.res-go .btn{width:100%; height:58px; font-size:16px}
.res-go .cap{margin-top:16px; text-align:center}

/* ==================================================================
   예약 창 — 흰 바탕. 달력·인원·시간 모두 직접 그립니다.
   ================================================================== */
body.rv-open{overflow:hidden}
.rv-ov{position:fixed; inset:0; z-index:110; background:rgba(0,0,0,.66); display:flex; align-items:center; justify-content:center; padding:28px; animation:rv-fade .2s ease}
@keyframes rv-fade{from{opacity:0} to{opacity:1}}
.rv{--ink:#191614; --text:#413A35; --sub:#847B71; --line:#E8E3DB; --line-2:#CFC7BB; --gold:#9A7B46; --soft:#F7F4EF;
    background:#FDFCFA; color:var(--text); width:min(720px,100%); height:min(820px, 92vh); display:flex; flex-direction:column;
    letter-spacing:-.01em; box-shadow:0 30px 80px rgba(0,0,0,.45)}
.rv h2, .rv h3{color:var(--ink)}
.rv a{color:var(--ink); border-bottom:1px solid var(--line-2)}
.rv .btn{height:52px; border-color:var(--ink); color:var(--ink); font-size:15px}
.rv .btn:hover{background:var(--ink); color:#fff}
.rv .btn.ghost{border-color:var(--line-2); color:var(--sub)}
.rv .btn.ghost:hover{background:transparent; border-color:var(--ink); color:var(--ink)}
.rv .btn.fill{background:var(--ink); color:#fff; border-color:var(--ink)}
.rv .btn.fill:hover{background:#000; border-color:#000}
.rv .btn.sm{height:46px; padding:0 20px; font-size:14px}
.rv .btn:disabled{opacity:.3; pointer-events:none}
/* 머리 */
.rv-h{display:flex; align-items:center; gap:20px; padding:24px 32px; border-bottom:1px solid var(--line)}
.rv-ttl{margin-right:auto}
.rv-ttl span{display:block; font-family:var(--serif); font-weight:900; font-size:11px; letter-spacing:.2em; color:var(--sub)}
.rv-ttl h2{font-size:24px; margin-top:6px; letter-spacing:.08em}
.rv-timer{display:flex; align-items:center; gap:12px; font-size:13px; color:var(--sub); letter-spacing:0}
.rv-timer b{display:inline-block; background:var(--ink); color:#fff; font-size:16px; font-weight:600; padding:7px 14px; min-width:68px; text-align:center; font-variant-numeric:tabular-nums; letter-spacing:.02em}
.rv-timer b.warn{background:#B23E28}
.rv-ext{height:32px; padding:0 12px; border:1px solid var(--ink); background:#fff; color:var(--ink); font:600 13px var(--sans); cursor:pointer; letter-spacing:0}
.rv-ext:hover{background:var(--ink); color:#fff}
.rv-x{width:38px; height:38px; margin-right:-8px; background:none; border:0; color:var(--sub); cursor:pointer; padding:0; display:flex; align-items:center; justify-content:center}
.rv-x:hover{color:var(--ink)}
.rv-x svg{width:18px; height:18px; fill:none; stroke:currentColor; stroke-width:1.4; stroke-linecap:round}
/* 단계 */
.rv-steps{display:flex; gap:4px; margin:0; padding:14px 32px; list-style:none; background:#F5F1EA; border-bottom:1px solid #DED5C8; overflow-x:auto; scrollbar-width:none}
.rv-steps::-webkit-scrollbar{display:none}
.rv-steps li{display:flex; align-items:center; gap:6px; font-size:12px; color:var(--sub); letter-spacing:0; white-space:nowrap}
.rv-steps li + li:before{content:""; width:10px; height:1px; background:var(--line-2); margin:0 2px}
.rv-steps i{display:flex; align-items:center; justify-content:center; width:19px; height:19px; border-radius:50%; border:1px solid var(--line-2); font-style:normal; font-size:11px; font-variant-numeric:tabular-nums}
.rv-steps .on{color:#8A402D; font-weight:600} .rv-steps .on i{background:#A84E35; color:#fff; border-color:#A84E35}
.rv-steps .done{color:#71665B}.rv-steps .done i{background:#C6B49E; border-color:#C6B49E; color:#fff}
/* 몸 */
.rv-b{padding:8px 32px 32px; overflow:auto; flex:1}
.rv-sec{padding:24px 0; border-bottom:1px solid var(--line)}
.rv-sec:last-child{border-bottom:0; padding-bottom:4px}
.rv-sec h3{font-size:18px; margin-bottom:18px; letter-spacing:-.025em}
.rv-quiet{font-size:14px; color:var(--sub); letter-spacing:0; line-height:1.7; margin:0 0 14px}
.rv-quiet:last-child{margin:14px 0 0}
.rv-msg{background:#FBEFEA; border-left:2px solid #B23E28; padding:14px 18px; font-size:14.5px; margin:20px 0 0; color:var(--ink)}
.rv-note{margin-top:14px; padding:16px 18px; background:var(--soft); font-size:14.5px; line-height:1.7; color:var(--ink)}
.rv-tel-lnk{display:inline-block; margin-left:8px; font-weight:600; font-variant-numeric:tabular-nums}
/* 요약 줄 */
.rv-sum{display:flex; flex-wrap:wrap; gap:0 14px; align-items:center; padding:14px 18px; background:var(--soft); margin:20px 0 0; font-size:15px; color:var(--ink); font-weight:600; letter-spacing:0}
.rv-sum span + span:before{content:"·"; color:var(--line-2); margin-right:14px}
/* 인원 — 어른 · 어린이 각각 */
.rv-cnt{display:flex; align-items:center; justify-content:space-between; gap:20px; padding:14px 0; border-top:1px solid var(--line)}
.rv-cnt:last-of-type{border-bottom:1px solid var(--line)}
.rv-cnt-l b{display:block; font-size:16.5px; font-weight:600; color:var(--ink); letter-spacing:-.02em}
.rv-cnt-l span{display:block; font-size:13px; color:var(--sub); letter-spacing:0; margin-top:1px}
.rv-cnt-r{display:flex; align-items:center; gap:4px}
.rv-cnt-r button{width:44px; height:44px; border:1px solid var(--line-2); background:transparent; color:var(--ink); cursor:pointer; display:flex; align-items:center; justify-content:center; padding:0; transition:border-color .2s}
.rv-cnt-r button:hover{border-color:var(--ink)}
.rv-cnt-r button:disabled{opacity:.25; pointer-events:none}
.rv-cnt-r button svg{width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round}
.rv-cnt-n{min-width:52px; text-align:center; font-size:22px; font-weight:600; color:var(--ink); letter-spacing:0; font-variant-numeric:tabular-nums}
.rv-hint{font-size:14px; color:var(--sub); line-height:1.7; letter-spacing:0; margin-top:16px}
.rv-hint:empty{display:none}
.rv-hint.warn{padding:14px 16px; background:var(--soft); color:var(--ink)}
/* 달력 */
.rv-cal{border:1px solid var(--line); padding:8px 14px 14px}
.rv-cal-h{display:flex; align-items:center; justify-content:space-between; padding:8px 4px 12px}
.rv-cal-h b{font-size:16.5px; font-weight:600; color:var(--ink); letter-spacing:0; font-variant-numeric:tabular-nums}
.rv-mo{width:36px; height:36px; border:0; background:none; color:var(--ink); cursor:pointer; display:flex; align-items:center; justify-content:center; padding:0}
.rv-mo:disabled{opacity:.2; pointer-events:none}
.rv-mo svg{width:16px; height:16px; fill:none; stroke:currentColor; stroke-width:1.6; stroke-linecap:round; stroke-linejoin:round}
.rv-wd{display:grid; grid-template-columns:repeat(7,1fr); text-align:center; font-size:12px; color:var(--sub); letter-spacing:0; padding-bottom:6px; border-bottom:1px solid var(--line)}
.rv-wd .sun{color:#B23E28} .rv-wd .sat{color:#3F6C9E}
.rv-days{display:grid; grid-template-columns:repeat(7,1fr); gap:2px; padding-top:6px; transition:opacity .15s}
.rv-days.loading{opacity:.4; pointer-events:none}
.rv-days .pad{display:block}
.rv-days button{height:44px; border:0; background:none; color:var(--ink); font:400 15px var(--sans); letter-spacing:0; font-variant-numeric:tabular-nums; cursor:pointer; position:relative; transition:background .15s, color .15s}
.rv-days button:hover{background:var(--soft)}
.rv-days .sun{color:#B23E28} .rv-days .sat{color:#3F6C9E}
.rv-days button:disabled{color:#CFC9C1; pointer-events:none}
.rv-days .today:after{content:""; position:absolute; left:50%; bottom:7px; width:3px; height:3px; margin-left:-1.5px; border-radius:50%; background:currentColor; opacity:.5}
.rv-days button.on{background:var(--ink); color:#fff; font-weight:600}
.rv-days button.on:after{background:#fff}
/* 시간 */
.rv-tgroup + .rv-tgroup{margin-top:20px}
.rv-tgroup > span{display:block; font-size:12.5px; color:var(--sub); letter-spacing:0; margin-bottom:10px}
.rv-times{display:grid; grid-template-columns:repeat(5,1fr); gap:8px}
.rv-times button{height:46px; border:1px solid var(--line); background:transparent; color:var(--ink); font:400 14.5px var(--sans); letter-spacing:0; cursor:pointer; font-variant-numeric:tabular-nums; transition:border-color .15s, background .15s}
.rv-times button:hover{border-color:var(--ink)}
.rv-times button.on{background:var(--ink); color:#fff; border-color:var(--ink); font-weight:600}
/* 고르는 칸(자리·코스) */
.rv-pick{display:grid; gap:8px}
.rv-pick.two{grid-template-columns:1fr 1fr}
.rv-pick button{text-align:left; padding:17px 20px; border:1px solid var(--line); background:transparent; cursor:pointer; display:flex; align-items:baseline; justify-content:space-between; gap:20px; width:100%; transition:border-color .15s, background .15s}
.rv-pick button:hover{border-color:var(--line-2)}
.rv-pick button.on{border-color:var(--ink); background:var(--soft)}
.rv-pick b{font-size:16.5px; font-weight:600; color:var(--ink); letter-spacing:-.02em}
.rv-pick b small{font-family:var(--serif); font-weight:900; font-size:11px; color:var(--gold); margin-left:8px; letter-spacing:.08em}
.rv-pick span{font-size:13.5px; color:var(--sub); letter-spacing:0; text-align:right}
.rv-pick .qty{font-size:13px; color:var(--sub); font-variant-numeric:tabular-nums}
.rv-pick button.on .qty{color:var(--ink)}
.rv-pick-h{font-size:12.5px; color:var(--sub); letter-spacing:0; margin:20px 0 2px}
.rv-pick-h small{display:block; font-size:12px; color:var(--ink); margin-top:2px}   /* 특별 기간 안내 한 줄 */
.rv-pick-h:first-child{margin-top:0}
/* 입력 */
.rv-fld{margin-bottom:24px} .rv-fld:last-child{margin-bottom:0}
.rv-fld label{display:block; font-size:13px; font-weight:600; color:var(--sub); letter-spacing:0; margin-bottom:8px}
.rv-fld label em{font-style:normal; font-weight:400; color:#A69D93; margin-left:6px}
.rv input, .rv textarea{width:100%; font:inherit; font-size:16px; padding:13px 14px; border:1px solid var(--line-2); background:#fff; color:var(--ink); border-radius:0; color-scheme:light; letter-spacing:-.01em}
.rv textarea{line-height:1.7; resize:vertical}
.rv input:focus, .rv textarea:focus{outline:none; border-color:var(--ink)}
.rv input::placeholder, .rv textarea::placeholder{color:#B2ABA2}
.rv input:disabled{background:var(--soft); color:var(--sub)}
.rv-inline{display:grid; grid-template-columns:1fr auto; gap:10px; margin-bottom:10px; align-items:stretch}
.rv-inline{grid-template-columns:1fr 132px}
.rv-inline .btn{height:auto; min-height:50px; padding:0 12px; font-size:14px; white-space:nowrap; width:100%}
.rv-fld-hint{margin:0; font-size:13.5px; color:var(--sub); letter-spacing:0}
.rv-linkbtn{margin-top:6px; background:none; border:0; padding:0; font:inherit; font-size:13.5px; color:var(--sub); text-decoration:underline; cursor:pointer}   /* 인증 요청 뒤 잠긴 번호 고치기 */
.rv-pick button.off{opacity:.38; cursor:not-allowed}   /* 그 시각에 못 받는 좌석 종류 */
.rv-fld-hint.bad{color:#B23E28}
/* 확인표 */
.rv-check{margin:0; border-top:1px solid var(--line)}
.rv-check > div{display:grid; grid-template-columns:120px 1fr; gap:16px; padding:13px 0; border-bottom:1px solid var(--line)}
.rv-check dt{font-size:13.5px; color:var(--sub); letter-spacing:0}
.rv-check dd{margin:0; font-size:15.5px; color:var(--ink); line-height:1.6}
/* 동의 */
.rv-agree{border:1px solid var(--line); margin-bottom:8px}
.rv-agree.on{border-color:var(--ink)}
.rv-agree-h{display:flex; align-items:stretch}
.rv-chk{display:flex; align-items:center; padding:0 14px 0 18px; cursor:pointer; margin:0; position:relative}
.rv-chk input{position:absolute; opacity:0; width:0; height:0}
.rv-chk i{width:20px; height:20px; border:1px solid var(--line-2); display:flex; align-items:center; justify-content:center; font-style:normal; transition:background .15s, border-color .15s}
.rv-chk i:after{content:""; width:9px; height:5px; border-left:1.5px solid #fff; border-bottom:1.5px solid #fff; transform:rotate(-45deg) translate(1px,-1px); opacity:0}
.rv-agree.on .rv-chk i{background:var(--ink); border-color:var(--ink)}
.rv-agree.on .rv-chk i:after{opacity:1}
.rv-agree-t{flex:1; display:flex; align-items:center; gap:12px; justify-content:space-between; padding:16px 16px 16px 0; background:none; border:0; cursor:pointer; text-align:left; font:inherit; color:var(--text)}
.rv-agree-t b{font-size:15px; font-weight:600; color:var(--ink); letter-spacing:-.01em}
.rv-agree-t svg{flex:none; width:16px; height:16px; fill:none; stroke:var(--sub); stroke-width:1.5; stroke-linecap:round; stroke-linejoin:round; transition:transform .2s}
.rv-agree.open .rv-agree-t svg{transform:rotate(180deg)}
.rv-agree .body{display:none; padding:0 18px 18px 52px; font-size:14px; color:var(--text); line-height:1.75; letter-spacing:0}
.rv-agree.open .body{display:block}
.rv-agree ul{margin:0; padding-left:16px} .rv-agree li{margin-bottom:4px}
.rv-agree table{width:100%; border-collapse:collapse; font-size:13.5px; margin-bottom:10px}
.rv-agree th, .rv-agree td{border:1px solid var(--line); padding:8px 10px; text-align:left; vertical-align:top}
.rv-agree th{color:var(--sub); font-weight:600; background:var(--soft)}
/* 발 */
.rv-f{display:flex; justify-content:space-between; gap:12px; padding:18px 32px 24px; border-top:1px solid var(--line); background:#FDFCFA}
.rv-f .btn{min-width:150px}
.rv-call{display:flex; flex-direction:column; justify-content:center; border:0; letter-spacing:0}
.rv-call b{font-size:12.5px; font-weight:600; color:var(--sub)}
.rv-call span{font-size:17px; font-weight:600; color:var(--ink); font-variant-numeric:tabular-nums; letter-spacing:-.01em}
.rv-call:hover span{text-decoration:underline; text-underline-offset:3px}
.rv-warn{align-self:center; font-size:14px; line-height:1.55; color:#B23E28; letter-spacing:0; padding-right:12px}
.rv-warn a{color:inherit; font-weight:600; border-bottom:1px solid currentColor; font-variant-numeric:tabular-nums}

/* 창 안에서 묻는 확인 상자 */
.rv{position:relative}
.rv-ask{position:absolute; top:0; left:0; right:0; bottom:0; z-index:5; background:rgba(25,22,20,.45); display:flex; align-items:center; justify-content:center; padding:24px; animation:rv-fade .15s ease}
.rv-ask-in{background:#FDFCFA; width:min(420px,100%); padding:30px 30px 24px; box-shadow:0 20px 50px rgba(0,0,0,.3)}
.rv-ask-in h4{font-size:19px; margin-bottom:12px; color:var(--ink); letter-spacing:-.025em}
.rv-ask-in p{font-size:15px; line-height:1.75; margin:0}
.rv-ask-in p b{color:var(--ink); font-weight:600}
.rv-ask-f{display:flex; gap:10px; margin-top:26px}
.rv-ask-f .btn{flex:1; height:48px; min-width:0}
/* 완료 */
.rv-done{text-align:center; padding:40px 0 20px}
.rv-tick{width:56px; height:56px; margin:0 auto 24px; display:flex; align-items:center; justify-content:center}
.rv-tick svg{width:30px; height:30px; fill:none; stroke:var(--ink); stroke-width:2; stroke-linecap:round; stroke-linejoin:round}
.rv-done h3{font-size:26px; margin-bottom:16px}
.rv-done p{font-size:15.5px; line-height:1.85}
.rv-done p.big{font-size:17px; color:var(--ink); font-weight:600; letter-spacing:0; margin-bottom:18px}
.rv-done p b{color:var(--ink); font-variant-numeric:tabular-nums}

/* ---------- 팝업창: 왼쪽 위에 여러 개, 아래 줄에 '오늘 하루 보지 않기' ---------- */
/* 여러 장이면 나란히 — 예전엔 32px 씩 비껴 포갰는데 PC 는 옆이 비어 있어 겹칠 이유가 없었음(09-24 재아). 넘치면 다음 줄 */
.pops{position:fixed; top:0; left:0; right:0; bottom:0; z-index:100; pointer-events:none; display:flex; flex-wrap:wrap; align-items:flex-start; align-content:flex-start; gap:20px; padding:110px 40px 40px; overflow:auto}
.pop{position:relative; flex:0 0 auto; max-width:calc(100vw - 80px); pointer-events:auto; background:#FDFCFA; color:#413A35; box-shadow:0 24px 60px rgba(0,0,0,.5); letter-spacing:0; animation:rv-fade .25s ease}
.pop-b{padding:30px 30px 26px}
.pop-b img{width:100%; display:block; margin:-30px -30px 0; width:calc(100% + 60px); max-width:none}
/* 그림만 있는 팝업: 안쪽 여백을 없애 그림이 아래 띠까지 꽉 — 예전엔 아래 26px 여백이 흰 띠로 남았음(09-24 재아) */
.pop-b.only-img{padding:0}
.pop-b.only-img img{margin:0; width:100%}
.pop-b h3{font-size:20px; color:#191614; letter-spacing:-.01em; margin-bottom:14px; line-height:1.4}
.pop-b p{font-size:14.5px; line-height:1.75; margin-bottom:8px}
.pop-b .btn{margin-top:14px; height:46px; padding:0 24px; background:#191614; border-color:#191614; color:#fff; font-size:14px}
.pop-b .btn:hover{background:#000}
.pop-f{display:flex; align-items:center; justify-content:space-between; background:#191614; color:#fff; padding:0 16px; height:44px; font-size:13px}
.pop-f label{display:flex; align-items:center; gap:8px; cursor:pointer; color:rgba(255,255,255,.85)}
.pop-f input{width:15px; height:15px; margin:0; accent-color:#fff}
.pop-f .x{background:none; border:0; color:#fff; font:600 13px var(--sans); cursor:pointer; padding:8px 0 8px 16px; letter-spacing:0}
.pop-f .x:hover{text-decoration:underline; text-underline-offset:3px}
/* 폰: 위에서부터 차례로 쌓임, 뒤는 어둡게 */
@media (max-width:760px){
  .pops{display:block; pointer-events:auto; overflow:auto; background:rgba(0,0,0,.6); padding:calc(var(--nav) + 16px) 16px 80px}
  .pop{position:static; width:auto!important; margin:0 auto 14px; max-width:420px}
  .pop-b{padding:24px 22px 20px}
  .pop-b img{margin:-24px -22px 0; width:calc(100% + 44px)}   /* 폰 안쪽 여백(24/22)에 맞춤 — 예전 -30px 은 그림이 옆으로 삐져나감 */
}

/* ---------- 바닥 ---------- */
.foot{border-top:1px solid var(--line); padding:76px 0 40px}
.band + .foot{border-top:0}
.foot .wrap{display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:40px; padding-bottom:52px; border-bottom:1px solid var(--line)}
.foot-brand{font-family:var(--serif); font-weight:900; font-size:24px; color:#fff; letter-spacing:.16em}
.foot .fb{display:flex; align-items:flex-end; gap:32px}
.foot-logo{height:150px; width:auto; flex:none}
.foot .fb p{margin:0}
.foot h5{font-size:13.5px; color:var(--sub); margin:0 0 14px; font-weight:600; letter-spacing:0}
.foot p, .foot a{font-size:14.5px; line-height:1.95; margin:0; display:block; color:var(--text); letter-spacing:0; font-variant-numeric:tabular-nums}
.foot p.mute{color:var(--sub)}
.foot a{transition:color .2s} .foot a:hover{color:#fff}
.foot-copy{max-width:var(--wrap); margin:0 auto; padding:26px var(--gut) 0; font-size:12.5px; color:var(--sub); display:flex; justify-content:space-between; letter-spacing:0}

/* ---------- 태블릿 ---------- */
@media (max-width:1100px){
  :root{--gut:28px}
  .links{gap:32px; font-size:15px}
  .hero-t h1{font-size:48px}
  .two, .two.rev{gap:56px}
  .rooms{grid-template-columns:repeat(3,1fr)}
}
@media (max-width:960px){
  .links{display:none} .nav-r .cta{display:none}
  .burger{display:flex}
  .nav .wrap{grid-template-columns:1fr auto}
  .mnav{display:none; position:fixed; top:var(--nav); left:0; right:0; z-index:49; background:var(--bg); border-top:1px solid var(--line); border-bottom:1px solid var(--line); flex-direction:column}
  .mnav.open{display:flex}
  .mnav a{padding:18px var(--gut); border-top:1px solid var(--line); font-size:17px; font-weight:600; color:#fff}
  .mnav a:first-child{border-top:0}
  .two, .two.rev{grid-template-columns:1fr; gap:40px}
  .two.rev figure{order:-1}
  .chef{grid-template-columns:1fr 1fr; gap:40px}
  .tiles{grid-template-columns:1fr 1fr}
  .info{grid-template-columns:1fr}
  .info > div{padding:26px 0; border-right:0; border-bottom:1px solid var(--line)} .info > div + div{padding-left:0} .info > div:last-child{border-bottom:0}
  .ed{grid-template-columns:1fr; gap:36px} .ed .eh{position:static}
  .rooms{grid-template-columns:1fr 1fr} .halls{grid-template-columns:1fr}
  .drink-cols{grid-template-columns:1fr; gap:0}
  .dish-cols{columns:1}
  .visit, .reserve{grid-template-columns:1fr; gap:52px}
  .foot .wrap{grid-template-columns:1fr 1fr}
  .s{padding-top:108px} .band{margin-top:108px; height:480px} .sec{padding:92px 0}
}
/* ---------- 폰 ---------- */
@media (max-width:640px){
  :root{--gut:20px; --nav:64px}
  body{font-size:16px}
  .brand-ko{font-size:22px} .brand-en{display:none}
  .fab{display:flex; align-items:center; justify-content:center; position:fixed; right:18px; bottom:calc(18px + env(safe-area-inset-bottom)); z-index:48; width:64px; height:64px; border-radius:50%; background:#fff; color:var(--bg); border:0; font:600 15px var(--sans); letter-spacing:0; box-shadow:0 10px 30px rgba(0,0,0,.45); cursor:pointer}
  body.rv-open .fab{display:none}
  .hero{min-height:540px; height:100svh} html.shot .hero{height:720px}
  .hero-t h1{font-size:34px} .hero-t p{font-size:14px; margin-top:16px}
  .hero .arr{display:none} .hero .dots{bottom:26px}
  .s{padding-top:76px}
  .hd{flex-direction:column; align-items:flex-start; gap:8px; margin-bottom:28px}
  .hd h2, .two .t h2{font-size:28px}
  .two .t h2{margin-bottom:20px}
  .clist b{font-size:19px}
  .tiles{grid-template-columns:1fr; gap:28px} .tiles .wide img{aspect-ratio:4/3}
  .band{margin-top:76px; height:420px} .band h2{font-size:30px}
  .page-head{height:300px} .page-head .wrap{padding-bottom:32px} .page-head h1{font-size:32px} .page-head p{font-size:15px}
  .sec{padding:64px 0}
  .ed .eh h2{font-size:26px}
  .course .dishes{grid-template-columns:1fr} .course ul + ul li:first-child{border-top:0}
  .course h3{font-size:22px}
  .set{grid-template-columns:1fr; gap:6px}
  .rooms{gap:28px 12px} .room figcaption, .hall figcaption{font-size:16px; margin-top:12px}
  .chef{grid-template-columns:1fr; gap:24px} .chef img{max-width:300px} .chef h2{font-size:32px} .chef .quote{font-size:20px} .chef .t{padding-bottom:0}
  .chef-band .wrap{min-height:0} .chef-band img{height:120px; margin-top:-24px} .chef-band .t{padding:24px 0} .chef-band .t b{font-size:17px}
  .foot-logo{height:110px} .foot .fb{align-items:center; gap:20px}
  .pics{grid-template-columns:1fr}
  .visit address b{font-size:22px}
  .map-links{flex-direction:column}
  .res-go{padding:28px 22px}
  .hours div{grid-template-columns:96px 1fr}
  .notice{padding:34px 22px 28px}
  .foot .wrap{grid-template-columns:1fr; gap:28px}
  .foot-copy{flex-direction:column; gap:4px}
  /* 예약 창 — 폰에서는 전체 화면 */
  .rv-ov{padding:0} .rv{height:100%; width:100%; box-shadow:none}
  .rv-h{padding:16px 20px} .rv-ttl h2{font-size:20px; margin-top:4px} .rv-timer span{display:none}
  .rv-steps{padding:12px 20px; gap:6px; overflow-x:auto; scrollbar-width:none; -ms-overflow-style:none}
  .rv-steps::-webkit-scrollbar{display:none}
  .rv-steps li{font-size:11.5px} .rv-steps li + li:before{width:8px}
  .rv-b{padding:4px 20px 24px} .rv-f{padding:14px 20px 18px}
  .rv-f .btn{min-width:0; flex:1} .rv-warn{font-size:13px; flex:1.4}
  .rv-times{grid-template-columns:repeat(3,1fr)}
  .rv-pick.two{grid-template-columns:1fr}
  .rv-days button{height:40px; font-size:14px}
  .rv-check > div{grid-template-columns:88px 1fr; gap:12px}
  .rv-sum{font-size:14px}
  .rv-cnt-n{font-size:20px; min-width:44px}
  .rv-call span{font-size:15px}
  .rv-ask-in{padding:24px 20px 20px}
}

/* ---------- 내용 불러오기(js/content.js) ---------- */
/* 서버 값이 정해질 때까지 본문을 숨김 — 기본 글이 잠깐 보였다 바뀌는 깜빡임 방지. 1.5초 넘으면 content.js 가 그냥 보여줌 */
html.pending body{visibility:hidden}
/* ?preview=1 — 관리 화면의 미리보기. 초안임을 위에 띠로 */
.preview-bar{position:fixed; left:0; right:0; bottom:0; z-index:200; background:#B8432B; color:#fff; font-size:13px; letter-spacing:.02em; text-align:center; padding:8px 12px}   /* 위에 두면 상단 메뉴를 가려서 아래로(검토 2026-09-17) */
body.has-preview .fab{bottom:56px}
/* 접수 중단(관리 화면에서 끔): 단계 없이 안내만 */
.rv-off{padding:40px 0 20px; text-align:center}
.rv-off h3{font-size:20px; margin-bottom:12px}
.rv-off p{font-size:15px; line-height:1.8; color:var(--sub)}
/* 이용 안내 알약 — 콜키지·단체·포장·배달 (홈 소개 아래, 오시는 길) */
.facts{list-style:none; display:flex; flex-wrap:wrap; gap:8px; margin:22px 0 0; padding:0}
.facts:empty{display:none}
.facts li{font-size:13px; letter-spacing:.01em; color:var(--sub); border:1px solid var(--line); border-radius:999px; padding:6px 12px}
.two .t .facts + .more{margin-top:26px}

/* ---------- 소식 (news.html) — 목록(제목·날짜·첫 줄)과 글 한 편(?p=…) 을 같은 자리에 그립니다 ---------- */
.news-wrap{max-width:860px}
.news{border-top:1px solid var(--line-2)}
.news.one{border-top:0}
.news-empty{padding:60px 0; text-align:center; color:var(--sub); font-size:15px}
/* 목록 — 글 하나가 링크 하나(누르면 글 페이지로) */
.post-l{position:relative; display:block; padding:30px 44px 30px 0; border-bottom:1px solid var(--line); color:var(--text); text-decoration:none}
.post-meta{display:flex; align-items:center; gap:10px; font-size:13px; color:var(--sub); letter-spacing:.02em}
.post-meta em{font-style:normal; font-weight:700; color:var(--ink)}   /* '고정' — 알약이 과하다는 평(재아 09-20)이라 흰 글씨만 */
.post-l h2, .post-vh h2{margin:8px 0 0; font-size:22px; font-weight:600; color:var(--ink); letter-spacing:0; line-height:1.4}
.post-first{margin:8px 0 0; font-size:15px; color:var(--sub); line-height:1.7; overflow:hidden; text-overflow:ellipsis; white-space:nowrap}
.post-arrow{position:absolute; right:6px; top:50%; width:9px; height:9px; margin-top:-5px; border-right:1px solid var(--sub); border-bottom:1px solid var(--sub); transform:rotate(-45deg); transition:transform .25s, border-color .2s}
.post-l:hover .post-arrow{border-color:#fff}
.post-l:hover h2{text-decoration:underline; text-underline-offset:4px; text-decoration-color:var(--line-2)}
/* 글 한 편 */
.post-v{padding:8px 0 40px}
.post-vh{padding-bottom:24px; margin-bottom:28px; border-bottom:1px solid var(--line)}
.post-vh h2{font-size:26px}
.post-text p{margin:0 0 1em; font-size:16.5px; line-height:1.85; color:var(--text)}
.post-text p:last-child{margin-bottom:0}
.post-imgs{display:grid; grid-template-columns:repeat(auto-fill, minmax(240px, 1fr)); gap:10px; margin-top:24px}
.post-imgs.one{grid-template-columns:1fr; max-width:640px}
.post-imgs a{display:block; background:#000; overflow:hidden}
.post-imgs img{display:block; width:100%; height:auto; aspect-ratio:4/3; object-fit:cover; transition:opacity .2s}
.post-imgs.one img{aspect-ratio:auto}
.post-imgs a:hover img{opacity:.85}
/* 첨부 — 밑줄·테두리 없이 ↓ 와 이름만(재아 09-20) */
.post-files{list-style:none; margin:22px 0 0; padding:0; display:flex; flex-wrap:wrap; gap:8px 22px}
.post-files a{display:inline-flex; align-items:center; gap:8px; font-size:14px; color:var(--ink); padding:6px 0; text-decoration:none; transition:color .2s}
.post-files a:before{content:"↓"; color:var(--sub)}
.post-files a:hover{color:#fff}
.post-files a:hover:before{color:#fff}
/* 이전 글 / 다음 글 / 목록 — 글 아래. 다음 글이 위(더 새 글), 이전 글이 아래(더 오래된 글) */
.post-nav{display:grid; grid-template-columns:1fr; border-top:1px solid var(--line-2); margin-top:8px}
.post-nav .nx, .post-nav .pv{display:grid; grid-template-columns:64px 1fr; align-items:baseline; gap:14px; padding:18px 0; border-bottom:1px solid var(--line); color:var(--text); text-decoration:none; transition:color .2s}
.post-nav small{font-size:12.5px; color:var(--sub); letter-spacing:.02em}
.post-nav span span, .post-nav a span{overflow:hidden; text-overflow:ellipsis; white-space:nowrap; font-size:15.5px}
.post-nav a:hover{color:var(--ink)}
.post-nav .off{color:var(--sub)}
.post-nav .off span{color:var(--sub)}
.post-nav .all{display:inline-block; margin-top:26px; justify-self:start; font-size:14.5px; font-weight:600; color:var(--ink); text-decoration:none; padding:10px 22px; border:1px solid var(--line-2); border-radius:999px; transition:border-color .2s, background .2s}
.post-nav .all:hover{border-color:#fff; background:rgba(255,255,255,.06)}
@media (max-width:640px){
  .post-l{padding:22px 34px 22px 0}
  .post-l h2{font-size:19px}
  .post-vh h2{font-size:22px}
  .post-text p{font-size:15.5px}
}
.rv-code{margin:6px 0 12px; font-size:15px; color:var(--sub)} .rv-code b{font-size:17px; color:var(--text); letter-spacing:.03em; margin-left:6px; font-weight:600}
/* 소식 사진 크게 보기(덮개) */
.lb{position:fixed; inset:0; z-index:200; background:rgba(0,0,0,.94); display:flex; align-items:center; justify-content:center; cursor:zoom-out}
.lb img{max-width:94vw; max-height:88vh; object-fit:contain; box-shadow:0 20px 60px rgba(0,0,0,.6)}
.lb-nav, .lb-x{position:fixed; border:0; background:rgba(255,255,255,.12); color:#fff; cursor:pointer; font:300 34px/1 var(--sans); width:56px; height:56px; border-radius:50%; transition:background .2s}
.lb-nav:hover, .lb-x:hover{background:rgba(255,255,255,.28)}
.lb-nav.prev{left:16px; top:50%; margin-top:-28px} .lb-nav.next{right:16px; top:50%; margin-top:-28px}
.lb-x{right:16px; top:16px; font-size:30px}
.lb-n{position:fixed; bottom:18px; left:0; right:0; text-align:center; color:rgba(255,255,255,.7); font-size:13px; letter-spacing:.04em}
body.lb-open{overflow:hidden}
@media (max-width:640px){ .lb-nav{width:44px; height:44px; font-size:28px; margin-top:-22px} .lb-nav.prev{left:8px} .lb-nav.next{right:8px} }