/* 정수네 떡볶이 · PIXON 샘플 · 2026-10-02 리디자인(즉석떡볶이 · 밤 식당 무드 + 밝은 정보 구간) */
:root{
  --ink:#141110; --ink-2:#1C1816; --ink-3:#28221E; --ink-line:rgba(245,238,228,.16);
  --paper:#F4EDE2; --paper-2:#ECE3D5; --white:#FCF9F4; --line:rgba(31,26,23,.14);
  --tx:#1F1A17; --tx-2:#4A403A; --on:#F5EEE4; --on-2:#E8E0D6;
  --chili:#A8301F; --chili-d:#8C2617; --chili-hi:#D0503A; --gold:#D9AE63;
  --gut:clamp(20px,4.2vw,64px); --max:1320px; --hd:76px; --demo:34px;
  --ease:cubic-bezier(.16,1,.3,1);
  --f:"Pretendard Variable",Pretendard,-apple-system,BlinkMacSystemFont,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;
}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--hd) + 64px)}
body{margin:0;background:var(--ink);color:var(--on);font-family:var(--f);font-weight:500;font-size:17px;line-height:1.75;letter-spacing:-.01em;word-break:keep-all;overflow-wrap:break-word;-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility}
img,svg,video{display:block;max-width:100%}
picture{display:block}
a{color:inherit;text-decoration:none}
button,input,select,textarea{font:inherit;color:inherit;letter-spacing:inherit}
h1,h2,h3,h4,h5,p,ul,ol,dl,dd,figure,blockquote{margin:0;padding:0}
ul,ol{list-style:none}
table{border-collapse:collapse;width:100%}
.sr{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap}
.sr:focus{position:fixed!important;left:16px;top:16px;width:auto;height:auto;clip:auto;z-index:100;background:var(--white);color:var(--tx);padding:10px 16px}
:focus-visible{outline:2px solid var(--gold);outline-offset:3px}
.num{font-variant-numeric:tabular-nums;font-feature-settings:"tnum"}
.wrap{width:min(var(--max),100% - var(--gut)*2);margin-inline:auto}

/* 구간 색 */
.dark{background:var(--ink);color:var(--on)}
.light{background:var(--white);color:var(--tx)}
.paper{background:var(--paper);color:var(--tx)}
.white{background:#fff;color:var(--tx)}
.sec{padding-block:clamp(88px,11vw,168px)}
.sec.tight{padding-block:clamp(56px,6vw,88px)}

/* 글자 */
.kick{display:inline-block;font-size:13.5px;font-weight:700;letter-spacing:.06em;text-transform:uppercase;color:var(--gold);margin-bottom:22px}
.light .kick,.paper .kick,.white .kick{color:var(--chili)}
.h-hero{font-size:clamp(44px,7.6vw,118px);font-weight:900;line-height:1.02;letter-spacing:-.045em}
.h-xl{font-size:clamp(40px,6.2vw,96px);font-weight:900;line-height:1.06;letter-spacing:-.042em}
.h-lg{font-size:clamp(32px,4.3vw,64px);font-weight:850;line-height:1.12;letter-spacing:-.038em}
.h-md{font-size:clamp(22px,2.1vw,30px);font-weight:800;line-height:1.3;letter-spacing:-.03em}
.h-xl em,.h-lg em{font-style:normal;color:var(--gold)}
.lead{font-size:clamp(17px,1.45vw,21px);line-height:1.7;font-weight:500;color:var(--on-2);max-width:40em}
.light .lead,.paper .lead,.white .lead{color:var(--tx-2)}
.body{font-size:17px;line-height:1.8;color:var(--tx-2);max-width:36em}
.dark .body{color:var(--on-2)}
.note{font-size:14px;line-height:1.65;color:var(--tx-2)}
.dark .note,.note.on-dark{color:#CFC5B8}

/* 버튼 · 글 링크 */
.btn{display:inline-flex;align-items:center;justify-content:center;gap:10px;min-height:56px;padding:0 30px;border:0;border-radius:999px;background:var(--chili);color:#fff;font-weight:700;font-size:17px;letter-spacing:-.01em;cursor:pointer;transition:background .3s var(--ease),transform .3s var(--ease)}
.btn:hover{background:var(--chili-d)}
.btn:active{transform:scale(.98)}
.btn.sm{min-height:42px;padding:0 20px;font-size:15px}
.btn.light{background:var(--white);color:var(--tx)}
.btn.light:hover{background:var(--paper-2)}
.btn.ink{background:var(--ink);color:var(--on)}
.btn.ink:hover{background:var(--ink-3)}
.btn.line{background:transparent;color:var(--tx);box-shadow:inset 0 0 0 1.5px var(--tx)}
.btn.line:hover{background:var(--paper)}
.tlink{display:inline-flex;align-items:center;gap:10px;font-weight:700;font-size:17px;color:var(--on);padding-block:8px;border-bottom:1.5px solid rgba(245,238,228,.5);transition:gap .3s var(--ease),border-color .3s}
.tlink:hover{gap:14px;border-color:currentColor}
.tlink.dark-tx{color:var(--tx);border-color:rgba(31,26,23,.4)}
.tlink .ar{flex:none}

/* 등장(600~800ms) */
.js .rv{opacity:0;transform:translateY(28px);transition:opacity .75s var(--ease),transform .8s var(--ease)}
.js .rv.vis{opacity:1;transform:none}
.js .rv.d1{transition-delay:.08s}.js .rv.d2{transition-delay:.16s}
@media (prefers-reduced-motion:reduce){.js .rv{opacity:1;transform:none;transition:none}html{scroll-behavior:auto}}

/* 샘플 띠 */
.demo-bar{position:relative;z-index:60;height:var(--demo);display:flex;align-items:center;justify-content:center;gap:12px;padding:0 16px;background:#0B0908;color:#DCD2C5;font-size:12.5px;font-weight:500;line-height:1.3;text-align:center;border-bottom:1px solid rgba(245,238,228,.08)}
.demo-bar b{color:var(--gold);font-weight:700;white-space:nowrap}
.demo-bar em{font-style:normal}

/* 머리줄 */
.hd{position:sticky;top:0;z-index:50;height:var(--hd);margin-bottom:calc(var(--hd) * -1);color:var(--on);transition:background .4s var(--ease),box-shadow .4s}
.hd::before{content:"";position:absolute;inset:0;background:linear-gradient(rgba(10,8,7,.55),rgba(10,8,7,0));pointer-events:none;transition:opacity .4s}
.hd.sc{background:rgba(20,17,16,.94);box-shadow:0 1px 0 var(--ink-line)}
.hd.sc::before{opacity:0}
@supports (backdrop-filter:blur(10px)){.hd.sc{background:rgba(20,17,16,.82);backdrop-filter:blur(14px) saturate(1.2)}}
.hd-in{position:relative;height:100%;display:flex;align-items:center;gap:40px}
.logo{display:inline-flex;align-items:center;gap:12px;color:var(--on)}
.logo .mark{flex:none;display:grid;place-items:center;width:36px;height:36px;border-radius:50%;background:var(--chili);color:#FFF6EA;font-size:18px;font-weight:900;letter-spacing:-.04em;line-height:1;box-shadow:inset 0 0 0 1.5px rgba(255,246,234,.25)}
.logo .wm{display:flex;flex-direction:column;line-height:1.1}
.logo b{font-size:19px;font-weight:900;letter-spacing:-.04em}
.logo small{font-size:10.5px;font-weight:600;letter-spacing:.12em;color:#CFC5B8;margin-top:4px}
.nav{display:flex;gap:34px;margin-left:auto}
.nav a{font-size:16px;font-weight:600;color:var(--on-2);padding:8px 0;position:relative;transition:color .25s}
.nav a::after{content:"";position:absolute;left:0;right:0;bottom:2px;height:1.5px;background:var(--gold);transform:scaleX(0);transform-origin:left;transition:transform .4s var(--ease)}
.nav a:hover,.nav a.on{color:#fff}
.nav a:hover::after,.nav a.on::after{transform:none}
.nav .nav-cta{display:none}
.hd-cta{display:flex;align-items:center;gap:20px}
.hd-tel{font-weight:700;font-size:16px;color:var(--on)}
.menu-btn{display:none;width:44px;height:44px;border:0;background:transparent;cursor:pointer;position:relative;margin-right:-10px}
.menu-btn i,.menu-btn i::before,.menu-btn i::after{position:absolute;left:11px;width:22px;height:2px;background:var(--on);border-radius:2px;transition:transform .35s var(--ease),opacity .2s}
.menu-btn i{top:21px}
.menu-btn i::before{content:"";left:0;top:-7px}
.menu-btn i::after{content:"";left:0;top:7px}
.hd.open .menu-btn i{background:transparent}
.hd.open .menu-btn i::before{transform:translateY(7px) rotate(45deg)}
.hd.open .menu-btn i::after{transform:translateY(-7px) rotate(-45deg)}
.sentinel{position:absolute;top:240px;left:0;width:1px;height:1px}

/* 메인 히어로 */
.hero{position:relative;min-height:calc(100svh - var(--demo));display:flex;align-items:flex-end;overflow:hidden;background:var(--ink)}
.hero-media{position:absolute;inset:0}
.hero-media .still,.hero-media picture,.hero-media img,.hero-vid{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.hero-media .still{transition:opacity 1s var(--ease)}
.hero-media .still.m{display:none}
.hero-vid{opacity:0;transition:opacity 1.2s var(--ease)}
.hero-vid.on{opacity:1}
.hero-media::after{content:"";position:absolute;inset:0;background:
  linear-gradient(90deg,rgba(14,11,10,.88) 0%,rgba(14,11,10,.62) 34%,rgba(14,11,10,.08) 64%,rgba(14,11,10,0) 100%),
  linear-gradient(0deg,rgba(14,11,10,.9) 0%,rgba(14,11,10,0) 42%)}
.hero-in{position:relative;z-index:2;padding-block:calc(var(--hd) + 60px) clamp(64px,9vh,120px)}
.hero .kick{margin-bottom:28px;text-shadow:0 1px 12px rgba(0,0,0,.6)}
.hero .h-hero{color:#fff;max-width:9.5em}
.hero .lead{margin-top:30px;max-width:30em;color:var(--on-2)}
.hero-cta{display:flex;flex-wrap:wrap;align-items:center;gap:18px 32px;margin-top:44px}

/* 숫자 띠 */
.facts{border-top:1px solid var(--ink-line)}
.facts-in{display:grid;grid-template-columns:repeat(3,1fr)}
.facts-in>div{padding:44px 0 48px;display:flex;flex-direction:column;gap:10px}
.facts-in>div+div{padding-left:clamp(24px,4vw,56px);border-left:1px solid var(--ink-line)}
.facts b{font-size:clamp(40px,4.6vw,68px);font-weight:850;line-height:1;letter-spacing:-.04em;color:var(--gold)}
.facts b small{font-size:.38em;font-weight:700;margin-left:6px;letter-spacing:-.02em;color:var(--gold)}
.facts span{font-size:16px;font-weight:600;color:var(--on)}
.facts em{display:block;font-style:normal;font-weight:500;font-size:13.5px;color:#CFC5B8;margin-top:2px}

/* 선언 */
.statement{padding-block:clamp(110px,14vw,220px)}
.statement .h-xl{max-width:12em}
.statement .lead{margin-top:40px;max-width:34em;font-size:clamp(18px,1.6vw,22px)}

/* 좌우 나눔(사진이 화면 끝까지) */
.split{display:grid;grid-template-columns:minmax(0,1.12fr) minmax(0,1fr);align-items:stretch}
.split-img{position:relative;min-height:min(78vh,760px)}
.split-img picture,.split-img img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover}
.split-tx{padding:clamp(72px,8vw,140px) var(--gut) clamp(72px,8vw,140px) clamp(48px,6vw,112px);align-self:center;max-width:720px}
.split-tx .h-lg{margin-bottom:28px}
.split.rev .split-img{order:2}
.split.rev .split-tx{padding-left:max(var(--gut),calc((100vw - var(--max))/2));padding-right:clamp(48px,6vw,112px);justify-self:end}
.flow3{margin-top:48px;border-top:1px solid var(--line)}
.flow3 li{display:grid;grid-template-columns:64px 1fr;gap:12px;padding:24px 0;border-bottom:1px solid var(--line)}
.flow3 .num{font-size:15px;font-weight:800;color:var(--chili);padding-top:3px}
.flow3 h3{font-size:20px;font-weight:800;letter-spacing:-.03em;color:var(--tx)}
.flow3 p{font-size:16px;color:var(--tx-2);margin-top:4px}

/* 사진 한 장을 화면 가득 */
.bleed{position:relative;min-height:min(92svh,980px);display:flex;align-items:flex-end;overflow:hidden}
.bleed.tall{min-height:min(100svh,1080px)}
.bleed-img{position:absolute;inset:0}
.bleed-img picture,.bleed-img img{width:100%;height:100%;object-fit:cover}
.bleed-img::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(14,11,10,.92) 0%,rgba(14,11,10,.55) 32%,rgba(14,11,10,0) 62%)}
.bleed-tx{position:relative;z-index:2;padding-block:120px clamp(64px,8vw,120px)}
.bleed-tx .h-lg{color:#fff;max-width:14em}
.bleed-tx .lead{margin-top:24px;max-width:32em}

/* 두 장 */
.duo{padding-block:clamp(80px,9vw,140px)}
.duo-in{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3vw,48px);margin-bottom:56px}
.duo .ph,.dish .ph,.owner .ph,.row .ph,.side .ph{overflow:hidden;border-radius:4px;background:var(--ink-2)}
.duo .ph{aspect-ratio:4/3}
.ph picture{width:100%;height:100%}
.duo .ph img,.dish .ph img,.row .ph img,.side .ph img{width:100%;height:100%;object-fit:cover;transition:transform 1.2s var(--ease)}
.duo article:hover .ph img,.dish:hover .ph img{transform:scale(1.03)}
.duo .h-md{margin-top:28px;color:#fff}
.duo p{margin-top:10px;color:var(--on-2);max-width:32em}

/* 매출 구조 */
.revenue{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:clamp(48px,7vw,120px);align-items:center}
.money-tx .h-lg{margin-bottom:28px;color:var(--tx)}
.money-tx .tlink{margin-top:36px}
.ledger{background:var(--ink);color:var(--on);border-radius:6px;padding:clamp(28px,3.4vw,48px)}
.lg-head{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:baseline;gap:8px 24px;padding-bottom:26px;border-bottom:1px solid var(--ink-line)}
.lg-head span{font-size:15px;font-weight:600;color:var(--on-2)}
.lg-head b{font-size:clamp(40px,4vw,56px);font-weight:850;letter-spacing:-.04em;color:var(--gold);line-height:1}
.lg-head b small{font-size:.4em;margin-left:4px}
.lg-bar{display:flex;gap:3px;height:56px;margin:30px 0 8px}
.lg-bar .seg{display:flex;align-items:flex-end;padding:0 0 8px 8px;font-style:normal;border-radius:2px;min-width:0;overflow:hidden}
.lg-bar .seg span{font-size:12.5px;font-weight:700;color:#141110;white-space:nowrap}
.seg.pan,.dot.pan{background:var(--chili-hi)}
.seg.addon,.dot.addon{background:var(--gold)}
.seg.rice,.dot.rice{background:#B8A58C}
.seg.fry,.dot.fry{background:#E8DCCB}
.seg.pan span{color:#fff}
.lg-rows{margin-top:18px}
.lg-rows li{display:flex;justify-content:space-between;gap:16px;padding:13px 0;border-bottom:1px solid var(--ink-line);font-size:16px}
.lg-rows li span{display:flex;align-items:center;gap:12px;color:var(--on);min-width:0}
.lg-rows li em{font-style:normal}
.lg-rows b{font-weight:700}
.dot{display:inline-block;width:10px;height:10px;border-radius:50%;flex:none}
.ledger .note{margin-top:20px;color:#CFC5B8;font-size:13.5px}

/* 매장 사진 + 떠 있는 카드 */
.room{position:relative;background:var(--white)}
.room-img{height:min(88svh,920px);overflow:hidden}
.room-img picture,.room-img img{width:100%;height:100%;object-fit:cover}
.room-in{z-index:2;position:absolute;left:0;right:0;bottom:clamp(40px,6vw,80px)}
.room-card{background:var(--white);color:var(--tx);max-width:460px;padding:clamp(28px,3vw,44px);border-radius:6px;box-shadow:0 30px 80px -30px rgba(20,17,16,.45)}
.room-card .h-md{margin-bottom:12px}
.room-card p{font-size:16px;color:var(--tx-2);margin-bottom:22px}

/* 비용 맛보기 */
.cost-tease{display:grid;grid-template-columns:minmax(0,1.1fr) minmax(0,.9fr);gap:clamp(48px,7vw,120px);align-items:end}
.mega{font-size:clamp(72px,11vw,176px);font-weight:900;line-height:.95;letter-spacing:-.055em;color:var(--tx)}
.mega small{font-size:.26em;font-weight:800;letter-spacing:-.02em;margin-left:10px}
.cost-tease .note{margin:24px 0 36px;font-size:15px}
.ct-list{border-top:2px solid var(--tx)}
.ct-list li{display:flex;justify-content:space-between;gap:16px;padding:14px 0;border-bottom:1px solid var(--line);font-size:16px;color:var(--tx-2)}
.ct-list b{color:var(--tx);font-weight:700}
.ct-list .unit{border-bottom:0;font-size:13.5px}
.ct-list .unit b{font-weight:600;color:var(--tx-2)}

/* 점주 */
.owner{padding-block:clamp(88px,10vw,160px)}
.owner-in{display:grid;grid-template-columns:minmax(0,1.05fr) minmax(0,1fr);gap:clamp(40px,6vw,104px);align-items:center}
.owner .ph{aspect-ratio:5/4}
.owner .ph img{width:100%;height:100%;object-fit:cover}
.owner blockquote{font-size:clamp(23px,2.3vw,34px);font-weight:700;line-height:1.5;letter-spacing:-.03em;color:#fff}
.owner figcaption{margin-top:28px;font-size:16px;font-weight:600;color:var(--on-2)}
.owner figcaption small{display:block;font-size:13.5px;font-weight:500;color:#CFC5B8;margin-top:4px}
.owner .tlink{margin-top:36px}
.quotes{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,4vw,64px);margin-top:clamp(64px,7vw,112px);padding-top:clamp(48px,5vw,72px);border-top:1px solid var(--ink-line)}
.quotes blockquote{font-size:clamp(18px,1.5vw,21px);font-weight:600;line-height:1.7;color:var(--on)}
.quotes figcaption{margin-top:16px;font-size:14.5px;color:#CFC5B8}
.owner .note.on-dark{margin-top:40px}

/* 매장 사진 */
.store-sec{padding-block:clamp(88px,10vw,160px) clamp(40px,4vw,64px)}
.store-sec.flush{padding:0}
.store-head{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;margin-bottom:clamp(40px,5vw,72px)}
.store-head .h-lg{color:var(--tx)}
.cnt{display:flex;flex-wrap:wrap;gap:12px 36px;align-items:flex-end}
.cnt li{display:flex;flex-direction:column;font-size:14.5px;font-weight:600;color:var(--tx-2)}
.cnt li b{font-size:40px;font-weight:850;color:var(--tx);line-height:1.1;letter-spacing:-.03em}
.cnt li.tot{justify-content:flex-end}
.store-img{aspect-ratio:2752/1536;overflow:hidden}
.store-img picture,.store-img img{width:100%;height:100%;object-fit:cover}
.store-sec .note{margin-top:16px}

/* 마무리 띠 */
.cta-band{background:var(--chili);color:#fff;padding-block:clamp(80px,9vw,140px)}
.cta-in{display:flex;justify-content:space-between;align-items:flex-end;gap:40px;flex-wrap:wrap}
.cta-in .h-lg{color:#fff;max-width:14em}
.cta-acts{display:flex;align-items:center;gap:28px;flex-wrap:wrap}
.cta-tel{font-size:22px;font-weight:800;letter-spacing:-.02em;color:#fff;border-bottom:1.5px solid rgba(255,255,255,.55);padding-bottom:4px}

/* 꼬리 */
.ft{background:#0D0B0A;color:var(--on-2);padding:clamp(72px,8vw,112px) 0 120px;font-size:15px}
.ft-top{display:grid;grid-template-columns:1.6fr 1fr 1fr 1fr;gap:40px;padding-bottom:56px;border-bottom:1px solid var(--ink-line)}
.ft-brand p{margin-top:22px;color:var(--on-2);line-height:1.7}
.ft h5{margin:0 0 16px;font-size:13px;font-weight:700;letter-spacing:.12em;color:var(--gold)}
.ft p{margin:0 0 8px}
.ft a:hover{color:#fff}
.ft .tel{font-size:24px;font-weight:800;color:#fff;letter-spacing:-.02em}
.ft-bot{display:flex;flex-direction:column;gap:10px;padding-top:32px;font-size:13.5px;line-height:1.7;color:#CFC5B8}
.ft-bot .pixon a{color:var(--gold);font-weight:700}

/* 폰 하단 바 */
.mbar{display:none}

/* 서브 첫 화면 */
.phero{position:relative;min-height:min(80svh,860px);display:flex;align-items:flex-end;overflow:hidden;background:var(--ink)}
.phero.short{min-height:min(58svh,620px)}
.phero.noimg{min-height:0}
.phero.noimg .phero-in{padding-top:calc(var(--hd) + 96px)}
.ph-bg{position:absolute;inset:0}
.ph-bg picture,.ph-bg img{width:100%;height:100%;object-fit:cover}
.ph-bg::after{content:"";position:absolute;inset:0;background:linear-gradient(0deg,rgba(14,11,10,.94) 0%,rgba(14,11,10,.62) 38%,rgba(14,11,10,.2) 70%,rgba(14,11,10,.45) 100%)}
.phero-in{position:relative;z-index:2;padding-block:calc(var(--hd) + 80px) clamp(56px,7vw,104px)}
.phero .h-xl{color:#fff}
.phero .kick{text-shadow:0 1px 12px rgba(0,0,0,.7)}
.phero .lead{margin-top:26px;max-width:36em}

/* 섹션 머리 */
.sec-head{margin-bottom:clamp(48px,6vw,88px);max-width:820px}
.sec-head .h-lg{color:inherit}
.sec-head .body,.sec-head .lead{margin-top:22px}

/* 브랜드: 줄 */
.rows{display:flex;flex-direction:column;gap:clamp(72px,9vw,140px)}
.row{display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:clamp(36px,6vw,104px);align-items:center}
.row.flip .ph{order:2}
.row .ph{aspect-ratio:16/11}
.row .idx{display:block;font-size:15px;font-weight:800;color:var(--chili);margin-bottom:18px}
.row .h-md{color:var(--tx);margin-bottom:16px}
.roles{display:grid;grid-template-columns:1.3fr 1fr;gap:clamp(24px,3vw,48px)}
.roles>div{background:var(--white);border-radius:6px;padding:clamp(28px,3.4vw,48px)}
.roles>div:first-child{background:var(--ink);color:var(--on)}
.roles h3{font-size:24px;font-weight:850;letter-spacing:-.03em;margin-bottom:20px}
.roles li{padding:13px 0;border-top:1px solid var(--line);font-size:16.5px;color:var(--tx-2)}
.roles>div:first-child li{border-color:var(--ink-line);color:var(--on-2)}

/* 메뉴 */
.dishes{display:grid;grid-template-columns:1fr 1fr;gap:clamp(24px,3vw,48px)}
.dish .ph{aspect-ratio:16/10}
.dish-h{display:flex;justify-content:space-between;align-items:baseline;gap:16px;margin-top:26px}
.dish-h .h-md{color:#fff}
.dish-h b{font-size:22px;font-weight:800;color:var(--gold);white-space:nowrap}
.dish-h b small{font-size:13px;font-weight:600;color:#CFC5B8;margin-left:4px}
.dish p{margin-top:8px;color:var(--on-2)}
.board{margin-top:clamp(64px,7vw,104px);border-top:2px solid var(--on)}
.mtable caption{caption-side:top;text-align:left;font-size:14px;font-weight:600;color:#CFC5B8;padding:18px 0 4px}
.mtable th,.mtable td{padding:22px 0;border-bottom:1px solid var(--ink-line);text-align:left;vertical-align:top}
.mtable thead th{font-size:13.5px;font-weight:700;color:var(--gold);padding:14px 0;letter-spacing:.04em}
.mtable td,.mtable thead th:not(:first-child){text-align:right;width:12%}
.mtable tbody th b{display:block;font-size:20px;font-weight:800;color:#fff;letter-spacing:-.03em}
.mtable tbody th span{display:block;font-size:15px;font-weight:500;color:var(--on-2);margin-top:4px;padding-right:24px}
.mtable td{font-size:19px;font-weight:700;color:var(--on)}
.sari{margin-top:40px}
.sari h3{font-size:20px;font-weight:800;color:var(--tx);margin-bottom:8px}
.sari h3 small{font-size:13px;font-weight:600;color:var(--tx-2);margin-left:6px}
.sari ul{display:grid;grid-template-columns:1fr 1fr;column-gap:32px}
.sari li,.plist li{display:flex;justify-content:space-between;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);font-size:16px;color:var(--tx)}
.sari b,.plist b{font-weight:700}
.side{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:clamp(40px,6vw,104px);align-items:center}
.side .ph{aspect-ratio:4/3}
.side .h-lg{color:var(--tx);margin-bottom:32px}
.plist{border-top:2px solid var(--tx)}
.plist li span small{display:block;font-size:13.5px;color:var(--tx-2);font-weight:500}
.side .note{margin-top:16px}
.pack{display:grid;grid-template-columns:1fr 1fr;gap:clamp(40px,6vw,104px);align-items:start}
.pack .h-lg{color:var(--tx)}
.facts-list{margin-top:32px;border-top:1px solid var(--line)}
.facts-list li{display:grid;grid-template-columns:120px 1fr;gap:16px;padding:16px 0;border-bottom:1px solid var(--line);font-size:16px}
.facts-list b{font-weight:700;color:var(--tx)}
.facts-list span{color:var(--tx-2)}

/* 창업: 목차 탭 */
.tabs{position:sticky;top:var(--hd);z-index:40;background:var(--white);border-bottom:1px solid var(--line);color:var(--tx)}
.tabs-in{display:flex;gap:32px;overflow-x:auto;scrollbar-width:none}
.tabs-in::-webkit-scrollbar{display:none}
.tabs a{flex:none;padding:18px 0;font-size:15.5px;font-weight:600;color:var(--tx-2);border-bottom:2px solid transparent;margin-bottom:-1px;transition:color .2s,border-color .3s}
.tabs a:hover{color:var(--tx)}
.tabs a.on{color:var(--tx);border-color:var(--chili)}
.promises{display:grid;grid-template-columns:repeat(3,1fr);gap:clamp(24px,3vw,56px)}
.promises li{border-top:2px solid var(--tx);padding-top:26px}
.promises .num{font-size:15px;font-weight:800;color:var(--chili)}
.promises h3{font-size:clamp(21px,1.9vw,26px);font-weight:850;letter-spacing:-.03em;margin:14px 0 10px;color:var(--tx)}
.promises p{font-size:16px;color:var(--tx-2)}

/* 비용표 */
.cost-wrap{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1fr);gap:clamp(32px,4vw,64px);align-items:start}
.fmt{display:inline-flex;padding:4px;background:var(--paper);border-radius:999px;margin-bottom:28px;max-width:100%}
.fmt button{border:0;background:transparent;padding:12px 22px;border-radius:999px;font-weight:700;font-size:15px;color:var(--tx-2);cursor:pointer;transition:background .3s,color .3s}
.fmt button[aria-pressed=true]{background:var(--ink);color:#fff}
table.cost caption{caption-side:top;text-align:left;font-size:15px;font-weight:600;color:var(--tx-2);padding-bottom:12px}
table.cost thead th{font-size:13px;font-weight:700;color:var(--tx-2);text-align:left;padding:12px 0;border-bottom:2px solid var(--tx);letter-spacing:.03em}
table.cost td{padding:18px 0;border-bottom:1px solid var(--line);vertical-align:top;color:var(--tx)}
table.cost .it{font-weight:700;font-size:16.5px;width:28%;padding-right:16px}
table.cost .ds{font-size:15px;color:var(--tx-2);padding-right:16px}
table.cost .am{text-align:right;font-weight:800;font-size:19px;white-space:nowrap}
table.cost thead .am{font-size:13px;font-weight:700}
table.cost .unit{font-size:13px;font-weight:600;color:var(--tx-2);margin-left:3px}
table.cost tfoot td{border-bottom:0;border-top:2px solid var(--tx);padding-top:22px}
table.cost tfoot .am{font-size:30px;color:var(--chili);letter-spacing:-.03em}
.cost-notes{margin-top:22px;display:flex;flex-direction:column;gap:6px}
.cost-side{background:var(--ink);color:var(--on);border-radius:6px;padding:clamp(28px,3vw,40px);position:sticky;top:calc(var(--hd) + 80px)}
.cost-side h3{font-size:20px;font-weight:800;margin-bottom:18px}
.cost-side dl>div{display:flex;justify-content:space-between;gap:16px;padding:13px 0;border-bottom:1px solid var(--ink-line);font-size:15.5px}
.cost-side dt{color:var(--on-2)}
.cost-side dd{font-weight:700;color:#fff;text-align:right}
.cost-side p{margin-top:18px;font-size:13.5px;color:#CFC5B8}

/* 손익 계산기 */
.calc{display:grid;grid-template-columns:minmax(0,1.15fr) minmax(0,1fr);gap:clamp(24px,3vw,48px);align-items:stretch}
.calc-in{display:flex;flex-direction:column;gap:30px;background:var(--paper);border-radius:6px;padding:clamp(24px,3vw,44px)}
.calc-row2{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:20px}
.fld label{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-weight:700;font-size:16px;color:var(--tx);margin-bottom:10px}
.fld output{font-size:22px;font-weight:850;color:var(--chili)}
.fld small{display:block;margin-top:8px;font-size:13.5px;color:var(--tx-2)}
.money,.sel{position:relative;display:flex;align-items:center;background:#fff;border:1.5px solid var(--line);border-radius:6px;transition:border-color .2s}
.money:focus-within,.sel:focus-within{border-color:var(--tx)}
.money input{flex:1;min-width:0;width:100%;border:0;background:transparent;padding:14px 14px;font-size:18px;font-weight:700;text-align:right;color:var(--tx);outline:0}
.money span{padding-right:14px;font-weight:600;color:var(--tx-2);font-size:15px}
.sel select,.f-field select{appearance:none;-webkit-appearance:none;width:100%;border:0;background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%231F1A17' stroke-width='1.8' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 14px center;padding:14px 40px 14px 14px;font-size:17px;font-weight:700;color:var(--tx);outline:0;cursor:pointer}
input[type=range]{-webkit-appearance:none;appearance:none;width:100%;height:28px;background:transparent;cursor:pointer;--p:50%}
input[type=range]::-webkit-slider-runnable-track{height:6px;border-radius:3px;background:linear-gradient(90deg,var(--chili) var(--p),#D9CDBB var(--p))}
input[type=range]::-moz-range-track{height:6px;border-radius:3px;background:#D9CDBB}
input[type=range]::-moz-range-progress{height:6px;border-radius:3px;background:var(--chili)}
input[type=range]::-webkit-slider-thumb{-webkit-appearance:none;width:26px;height:26px;border-radius:50%;background:#fff;border:2px solid var(--chili);margin-top:-10px;box-shadow:0 2px 8px rgba(0,0,0,.18)}
input[type=range]::-moz-range-thumb{width:22px;height:22px;border-radius:50%;background:#fff;border:2px solid var(--chili)}
.calc-out{background:var(--ink);color:var(--on);border-radius:6px;padding:clamp(28px,3vw,44px);display:flex;flex-direction:column}
.calc-out .k{font-size:15px;font-weight:600;color:var(--on-2)}
.calc-out .total{font-size:clamp(44px,4.6vw,68px);font-weight:900;letter-spacing:-.045em;color:var(--gold);line-height:1.1;margin-top:6px}
.calc-out .bar{display:flex;gap:2px;height:14px;margin:24px 0 10px;border-radius:2px;overflow:hidden}
.calc-out .bar i{display:block;min-width:0}
.brk li{display:flex;justify-content:space-between;gap:12px;padding:11px 0;border-bottom:1px solid var(--ink-line);font-size:15px}
.brk li span{display:flex;align-items:center;gap:10px;color:var(--on-2)}
.brk li i{width:10px;height:10px;border-radius:2px;flex:none}
.brk b{font-weight:700;color:var(--on)}
.brk .res{border-bottom:0;padding-top:16px}
.brk .res span{color:#fff;font-weight:700}
.brk .res b{font-size:24px;color:#fff}
.brk .res.neg b{color:#F08A74}
.calc-out .warn{color:#F3A08C;min-height:0;margin-top:4px}
.calc-out .disclaim{font-size:13px;line-height:1.6;color:#CFC5B8;margin:12px 0 24px}
.calc-out .btn{margin-top:auto;align-self:flex-start}

/* 개설 절차 */
.steps{display:grid;grid-template-columns:repeat(3,1fr);gap:0;border-top:2px solid var(--tx)}
.steps li{position:relative;padding:28px clamp(16px,2vw,32px) 40px 0;border-bottom:1px solid var(--line)}
.steps li:not(:nth-child(3n+1)){padding-left:clamp(16px,2vw,32px);border-left:1px solid var(--line)}
.steps .wk{display:block;font-size:13.5px;font-weight:700;color:var(--chili);letter-spacing:.02em}
.steps .n{display:block;font-size:52px;font-weight:900;color:var(--tx);letter-spacing:-.05em;line-height:1;margin:14px 0 18px}
.steps h3{font-size:20px;font-weight:800;letter-spacing:-.03em;color:var(--tx)}
.steps p{font-size:15.5px;color:var(--tx-2);margin-top:8px}

/* 본사 지원 */
.sup{display:grid;grid-template-columns:repeat(3,1fr);border-top:1px solid var(--ink-line)}
.sup article{padding:40px clamp(16px,2.4vw,40px) 48px 0;border-bottom:1px solid var(--ink-line)}
.sup article:not(:nth-child(3n+1)){padding-left:clamp(16px,2.4vw,40px);border-left:1px solid var(--ink-line)}
.sup .big{display:block;font-size:clamp(34px,3.4vw,50px);font-weight:900;letter-spacing:-.045em;color:var(--gold);line-height:1.05;margin-bottom:26px}
.sup h3{font-size:19px;font-weight:800;color:#fff;letter-spacing:-.03em}
.sup p{font-size:15.5px;color:var(--on-2);margin-top:8px}
.voice{display:grid;grid-template-columns:1fr auto;gap:48px;align-items:end;margin-top:clamp(72px,8vw,120px)}
.voice blockquote{font-size:clamp(22px,2.2vw,32px);font-weight:700;line-height:1.5;letter-spacing:-.03em;color:#fff;max-width:24em}
.voice cite{display:block;font-style:normal;font-size:15px;font-weight:600;color:var(--on-2);margin-top:20px;letter-spacing:0}
.voice .n{text-align:right}
.voice .n b{display:block;font-size:clamp(72px,8vw,128px);font-weight:900;color:var(--gold);line-height:.9;letter-spacing:-.05em}
.voice .n span{font-size:15px;font-weight:600;color:var(--on-2)}

/* 설명회 */
.seminar{display:grid;grid-template-columns:auto 1fr auto;gap:clamp(24px,4vw,56px);align-items:center;padding:clamp(28px,3vw,40px);background:var(--paper);border-radius:6px}
.seminar .date{display:flex;flex-direction:column;align-items:center;justify-content:center;width:104px;height:104px;border-radius:50%;background:var(--chili);color:#fff}
.seminar .date b{font-size:40px;font-weight:900;line-height:1;letter-spacing:-.04em}
.seminar .date span{font-size:13px;font-weight:700;margin-top:4px}
.seminar h3{font-size:22px;font-weight:850;letter-spacing:-.03em;color:var(--tx)}
.seminar p{font-size:16px;color:var(--tx-2);margin-top:6px}

/* 자주 묻는 질문 */
.faq-wrap{display:grid;grid-template-columns:minmax(0,.8fr) minmax(0,1.4fr);gap:clamp(40px,6vw,96px);align-items:start}
.faq-wrap .sec-head{position:sticky;top:calc(var(--hd) + 90px)}
.faq{border-top:2px solid var(--tx)}
.faq details{border-bottom:1px solid var(--line)}
.faq summary{list-style:none;display:flex;justify-content:space-between;align-items:center;gap:20px;padding:26px 0;font-size:clamp(18px,1.5vw,21px);font-weight:750;letter-spacing:-.025em;color:var(--tx);cursor:pointer}
.faq summary::-webkit-details-marker{display:none}
.faq summary i{position:relative;flex:none;width:18px;height:18px}
.faq summary i::before,.faq summary i::after{content:"";position:absolute;left:0;top:8px;width:18px;height:2px;background:var(--tx);transition:transform .4s var(--ease)}
.faq summary i::after{transform:rotate(90deg)}
.faq details[open] summary i::after{transform:rotate(0)}
.faq .a{padding:0 0 28px;max-width:40em}
.faq .a p{font-size:16.5px;color:var(--tx-2)}
.faq .a p+p{margin-top:10px}

/* 빠른 상담 */
.quick-wrap{padding-block:clamp(80px,9vw,128px)}
.quick .h-md{color:#fff;font-size:clamp(26px,2.6vw,38px);font-weight:850;max-width:20em}
.quick-f{display:grid;grid-template-columns:1fr 1fr 1fr auto;gap:16px;margin-top:36px;align-items:end}
.quick label span{display:block;font-size:14px;font-weight:600;color:var(--on-2);margin-bottom:8px}
.quick input,.quick select{width:100%;height:56px;border:1.5px solid var(--ink-line);background:var(--ink-2);border-radius:6px;padding:0 16px;font-size:17px;font-weight:600;color:#fff;outline:0;transition:border-color .2s}
.quick select{appearance:none;-webkit-appearance:none;background:var(--ink-2) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%23F5EEE4' stroke-width='1.8' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 16px center;padding-right:40px}
.quick input::placeholder{color:#A99D90}
.quick input:focus,.quick select:focus{border-color:var(--gold)}
.quick .note{margin-top:16px}

/* 매장 찾기 */
.find{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.3fr);gap:clamp(32px,5vw,80px);align-items:start}
.find>div:first-child{position:sticky;top:calc(var(--hd) + 32px)}
.tilemap{display:grid;grid-template-columns:repeat(4,1fr);grid-template-rows:repeat(6,minmax(64px,auto)) auto;gap:6px}
.tile{display:flex;flex-direction:column;justify-content:space-between;align-items:flex-start;gap:6px;padding:12px 14px;border:0;border-radius:4px;background:var(--paper-2);color:var(--tx);text-align:left;cursor:pointer;transition:background .25s,color .25s,transform .25s var(--ease)}
.tile b{font-size:14px;font-weight:750;line-height:1.3;letter-spacing:-.02em}
.tile span{font-size:13px;color:var(--tx-2)}
.tile em{font-style:normal;font-size:22px;font-weight:850;color:var(--tx);margin-right:2px}
.tile.open{background:#F1D9D2}
.tile:hover{transform:translateY(-2px)}
.tile[aria-pressed=true]{background:var(--ink);color:#fff}
.tile[aria-pressed=true] span,.tile[aria-pressed=true] em{color:#fff}
.map-legend{display:flex;flex-wrap:wrap;gap:8px 20px;padding-top:14px;font-size:13.5px;color:var(--tx-2)}
.map-legend span{display:inline-flex;align-items:center;gap:8px}
.map-legend i{width:14px;height:14px;border-radius:3px;background:var(--paper-2)}
.map-legend i.o{background:#F1D9D2}
.chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}
.chips button{border:1.5px solid var(--line);background:#fff;border-radius:999px;padding:9px 16px;font-size:14.5px;font-weight:600;color:var(--tx);cursor:pointer;transition:background .2s,border-color .2s,color .2s}
.chips button:hover{border-color:var(--tx)}
.chips button[aria-pressed=true]{background:var(--ink);border-color:var(--ink);color:#fff}
.list-head{display:flex;justify-content:space-between;align-items:baseline;flex-wrap:wrap;gap:8px 16px;padding-bottom:14px;border-bottom:2px solid var(--tx);color:var(--tx)}
.list-head b{font-size:17px;font-weight:800}
.stores .store{border-bottom:1px solid var(--line)}
.store>button{width:100%;display:grid;grid-template-columns:150px 1fr auto;gap:8px 20px;align-items:center;padding:20px 0;border:0;background:transparent;text-align:left;cursor:pointer;color:var(--tx)}
.store .nm{font-size:18px;font-weight:800;letter-spacing:-.03em}
.store .ad{font-size:15px;color:var(--tx-2)}
.store .tg{display:flex;gap:6px}
.store .tg i{font-style:normal;font-size:12.5px;font-weight:700;padding:4px 10px;border-radius:999px;background:var(--paper);color:var(--tx-2);white-space:nowrap}
.store .tg i.new{background:var(--chili);color:#fff}
.store .more{display:none;padding:0 0 24px}
.store.on .more{display:block}
.store.on>button .nm{color:var(--chili)}
.mini-map{border-radius:4px;overflow:hidden}
.mini-map svg{width:100%;height:auto}
.info{display:flex;flex-wrap:wrap;gap:8px 28px;margin-top:14px;font-size:15px;color:var(--tx-2)}
.info b{color:var(--tx);margin-right:8px}
.empty{padding:32px 0;color:var(--tx-2)}
.region-cta{display:flex;justify-content:space-between;align-items:center;gap:16px 24px;flex-wrap:wrap;margin-top:40px;padding:28px;background:var(--paper);border-radius:6px}
.region-cta p{font-size:18px;font-weight:700;color:var(--tx)}

/* 가맹 상담 */
.contact{display:grid;grid-template-columns:minmax(0,.75fr) minmax(0,1.4fr);gap:clamp(32px,5vw,88px);align-items:start}
.contact-aside{display:flex;flex-direction:column;gap:0;border-top:2px solid var(--tx)}
.contact-aside .blk{padding:24px 0;border-bottom:1px solid var(--line)}
.contact-aside h3{font-size:14px;font-weight:700;letter-spacing:.06em;color:var(--chili);margin-bottom:10px}
.contact-aside p{font-size:16px;color:var(--tx-2)}
.contact-aside p+p{margin-top:6px}
.contact-aside .tel{display:block;font-size:34px;font-weight:900;letter-spacing:-.03em;color:var(--tx);margin-bottom:4px}
.contact-aside .tlink{font-size:16px;padding-block:4px}
.form{background:#fff;border:1px solid var(--line);border-radius:8px;padding:clamp(24px,3.4vw,52px);color:var(--tx);box-shadow:0 30px 80px -50px rgba(20,17,16,.4)}
.demo-note{font-size:14px;line-height:1.6;color:var(--tx-2);padding:14px 16px;background:var(--paper);border-radius:6px;margin-bottom:32px}
.demo-note b{color:var(--chili);margin-right:8px}
.f-body{display:flex;flex-direction:column;gap:24px}
.f-body[hidden]{display:none}
.f-row{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.f-field label,.f-field .lb{display:block;font-size:15px;font-weight:700;color:var(--tx);margin-bottom:10px}
.f-field label i,.f-field .lb i{font-style:normal;color:var(--chili);margin-left:3px}
.f-field input,.f-field textarea,.f-field>select{width:100%;border:1.5px solid var(--line);background:#fff;border-radius:6px;padding:14px 16px;font-size:16.5px;font-weight:500;color:var(--tx);outline:0;transition:border-color .2s}
.f-field>select{padding-right:40px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' stroke='%231F1A17' stroke-width='1.8' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") no-repeat right 16px center;font-weight:600}
.f-field textarea{min-height:130px;resize:vertical;line-height:1.6}
.f-field input::placeholder,.f-field textarea::placeholder{color:#8C8077}
.f-field input:focus,.f-field textarea:focus,.f-field>select:focus{border-color:var(--tx)}
.f-field.bad input,.f-field.bad select{border-color:var(--chili)}
.f-err{font-size:13.5px;color:var(--chili);margin-top:6px;min-height:0}
.f-err:empty{display:none}
.split2{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.split2 label{position:relative;margin:0;cursor:pointer}
.split2 input{position:absolute;opacity:0;pointer-events:none}
.split2 span{display:flex;flex-direction:column;gap:4px;height:100%;padding:18px;border:1.5px solid var(--line);border-radius:6px;transition:border-color .2s,background .2s}
.split2 b{font-size:17px;font-weight:800}
.split2 small{font-size:13.5px;font-weight:500;color:var(--tx-2);line-height:1.5}
.split2 input:checked+span{border-color:var(--ink);background:var(--ink);color:#fff}
.split2 input:checked+span small{color:var(--on-2)}
.split2 input:focus-visible+span{outline:2px solid var(--gold);outline-offset:2px}
.f-agree{display:flex;gap:10px;align-items:flex-start;font-size:15px;color:var(--tx-2);cursor:pointer;line-height:1.55}
.f-agree input{width:20px;height:20px;margin:1px 0 0;flex:none;accent-color:var(--chili)}
.f-agree.bad{color:var(--chili)}
.privacy summary{font-size:14px;color:var(--tx-2);cursor:pointer;text-decoration:underline;text-underline-offset:3px}
.privacy p{font-size:13.5px;color:var(--tx-2);margin-top:10px;line-height:1.65}
.f-btn{width:100%;min-height:60px;font-size:18px}
.f-foot{font-size:13.5px;color:var(--tx-2);text-align:center}
.f-done{display:none}
.f-done.on{display:block}
.f-done .check{width:60px;height:60px;border-radius:50%;background:var(--chili);display:flex;align-items:center;justify-content:center;margin-bottom:22px}
.f-done .check svg{width:30px;height:30px}
.f-done h3{font-size:28px;font-weight:850;letter-spacing:-.03em;margin-bottom:10px}
.f-done .sum{margin:26px 0;border-top:1px solid var(--line)}
.f-done .sum>div{display:flex;gap:16px;padding:12px 0;border-bottom:1px solid var(--line);font-size:15.5px}
.f-done dt{width:100px;flex:none;color:var(--tx-2)}
.f-done dd{font-weight:700}
.f-done .acts{display:flex;gap:10px;flex-wrap:wrap}

/* ───────── 1100 이하 ───────── */
@media (max-width:1100px){
  .nav{gap:24px}
  .hd-tel{display:none}
  .split{grid-template-columns:1fr 1fr}
  .steps,.sup{grid-template-columns:1fr 1fr}
  .steps li:not(:nth-child(3n+1)){padding-left:0;border-left:0}
  .steps li:nth-child(even){padding-left:clamp(16px,2vw,32px);border-left:1px solid var(--line)}
  .sup article:not(:nth-child(3n+1)){padding-left:0;border-left:0}
  .sup article:nth-child(even){padding-left:clamp(16px,2.4vw,40px);border-left:1px solid var(--ink-line)}
  .quick-f{grid-template-columns:1fr 1fr}
  .quick-f .btn{grid-column:1/-1}
  .ft-top{grid-template-columns:1fr 1fr 1fr}
  .ft-brand{grid-column:1/-1}
}

/* ───────── 900 이하(폰 · 작은 태블릿) ───────── */
@media (max-width:900px){
  :root{--hd:64px;--gut:20px}
  body{font-size:16px}
  .menu-btn{display:block}
  .hd-cta .btn{display:none}
  .hd-in{gap:16px;justify-content:space-between}
  .hd-cta{gap:4px}
  .nav{position:fixed;left:0;right:0;top:0;height:100dvh;margin:0;padding:calc(var(--hd) + var(--demo) + 24px) var(--gut) 40px;background:var(--ink);flex-direction:column;gap:0;opacity:0;visibility:hidden;transform:translateY(-8px);transition:opacity .35s var(--ease),transform .45s var(--ease),visibility 0s .45s;z-index:-1}
  .hd.open .nav{opacity:1;visibility:visible;transform:none;transition:opacity .35s var(--ease),transform .45s var(--ease)}
  .hd.open{background:var(--ink)}
  .nav a{font-size:30px;font-weight:800;letter-spacing:-.03em;color:var(--on);padding:14px 0;border-bottom:1px solid var(--ink-line)}
  .nav a::after{display:none}
  .nav a.on{color:var(--gold)}
  .nav .nav-cta{display:flex;margin-top:32px;justify-content:center;min-height:56px;align-items:center;border-radius:999px;background:var(--chili);color:#fff;font-size:18px;border:0}
  .logo b{font-size:17px}
  .logo small{font-size:9.5px}
  .logo .mark{width:32px;height:32px;font-size:16px}
  .demo-bar{font-size:11.5px;gap:8px}
  .demo-bar em{display:none}

  .hero{min-height:calc(100svh - var(--demo));align-items:flex-end}
  .hero-media{bottom:auto;height:72%}
  .hero-media .still.pc{display:none}
  .hero-media .still.m{display:block}
  .hero-media::after{background:linear-gradient(0deg,var(--ink) 0%,rgba(20,17,16,.7) 22%,rgba(20,17,16,0) 52%),linear-gradient(180deg,rgba(14,11,10,.55) 0%,rgba(14,11,10,0) 22%)}
  .hero-in{padding-block:calc(var(--hd) + 40px) 44px}
  .hero .kick{margin-bottom:16px;font-size:12px}
  .h-hero{font-size:clamp(40px,11.4vw,56px)}
  .hero .lead{margin-top:18px;font-size:16.5px}
  .hero-cta{margin-top:28px;gap:14px 24px}
  .hero-cta .btn{flex:1 1 100%}

  .facts-in{grid-template-columns:1fr}
  .facts-in>div{flex-direction:row;align-items:center;gap:20px;padding:22px 0}
  .facts-in>div+div{padding-left:0;border-left:0;border-top:1px solid var(--ink-line)}
  .facts b{min-width:132px;font-size:40px}
  .h-xl{font-size:clamp(36px,10vw,52px)}
  .h-lg{font-size:clamp(30px,8.4vw,42px)}
  .sec{padding-block:88px}
  .statement{padding-block:104px}
  .statement .lead{margin-top:28px}

  .split{grid-template-columns:1fr}
  .split-img{min-height:0;aspect-ratio:4/3.2}
  .split-tx,.split.rev .split-tx{padding:64px var(--gut) 80px;max-width:none}
  .split.rev .split-img{order:0}
  .bleed{min-height:86svh}
  .bleed.tall{min-height:90svh}
  .bleed-tx{padding-bottom:56px}
  .duo-in,.dishes{grid-template-columns:1fr;gap:56px}
  .revenue,.cost-tease,.owner-in,.row,.side,.pack,.roles,.cost-wrap,.calc,.find,.contact,.faq-wrap{grid-template-columns:1fr}
  .row.flip .ph{order:0}
  .room-img{height:auto;aspect-ratio:4/3.4}
  .room-in{position:relative;margin-top:-56px}
  .room-card{max-width:none;padding:28px 24px 32px}
  .room{padding-bottom:56px}
  .mega{font-size:clamp(68px,20vw,96px)}
  .ct-list{margin-top:8px}
  .quotes{grid-template-columns:1fr;gap:40px}
  .store-head{flex-direction:column;align-items:flex-start;gap:28px}
  .store-img{margin-inline:0}
  .cta-in{flex-direction:column;align-items:flex-start}
  .cta-acts{width:100%}
  .cta-acts .btn{flex:1 1 100%}
  .ft{padding-bottom:140px}
  .ft-top{grid-template-columns:1fr 1fr;gap:32px}

  .phero{min-height:76svh}
  .phero.short{min-height:52svh}
  .phero-in{padding-block:calc(var(--hd) + 56px) 48px}
  .phero .lead{margin-top:18px;font-size:16.5px}

  .mtable thead{display:none}
  .mtable caption{padding-top:14px}
  .mtable tr{display:grid;grid-template-columns:repeat(3,1fr);border-bottom:1px solid var(--ink-line);padding:20px 0}
  .mtable tbody th{grid-column:1/-1;border:0;padding:0 0 12px}
  .mtable td{border:0;padding:0;text-align:left;width:auto;font-size:17px}
  .mtable td::before{display:block;font-size:12.5px;font-weight:600;color:#CFC5B8}
  .mtable td:nth-of-type(1)::before{content:"2인"}
  .mtable td:nth-of-type(2)::before{content:"3인"}
  .mtable td:nth-of-type(3)::before{content:"4인"}
  .sari ul{grid-template-columns:1fr}

  .tabs-in{gap:24px}
  .promises{grid-template-columns:1fr;gap:40px}
  .cost-side{position:static}
  table.cost .ds{display:none}
  table.cost .it{width:auto}
  table.cost thead th:nth-child(2){display:none}
  .calc-row2{grid-template-columns:1fr}
  .steps,.sup{grid-template-columns:1fr}
  .steps li,.steps li:nth-child(even){padding:24px 0 28px;border-left:0}
  .steps .n{font-size:40px;margin:8px 0 12px}
  .sup article,.sup article:nth-child(even){padding:32px 0;border-left:0}
  .voice{grid-template-columns:1fr;gap:32px}
  .voice .n{text-align:left}
  .seminar{grid-template-columns:1fr;justify-items:start}
  .seminar .btn{width:100%}
  .faq-wrap .sec-head{position:static;margin-bottom:32px}
  .quick-f{grid-template-columns:1fr}

  .find>div:first-child{position:static}
  .tilemap{grid-template-rows:repeat(6,minmax(58px,auto)) auto}
  .tile{padding:10px}
  .tile b{font-size:12.5px}
  .tile em{font-size:18px}
  .store>button{grid-template-columns:1fr auto;padding:18px 0}
  .store .ad{grid-column:1/-1;grid-row:2}
  .region-cta{padding:22px}
  .region-cta .btn{width:100%}
  .f-row,.split2{grid-template-columns:1fr}
  .form{padding:22px}
  .contact .form{order:-1}
  .contact-aside .tel{font-size:30px}

  .mbar{display:grid;grid-template-columns:1fr 1.6fr;gap:8px;position:fixed;left:0;right:0;bottom:0;z-index:45;padding:10px 16px calc(10px + env(safe-area-inset-bottom));background:rgba(20,17,16,.96);border-top:1px solid var(--ink-line);transform:translateY(110%);transition:transform .45s var(--ease)}
  .mbar.on{transform:none}
  .mbar a{display:flex;align-items:center;justify-content:center;min-height:50px;border-radius:999px;font-weight:700;font-size:16px}
  .mbar .t{box-shadow:inset 0 0 0 1.5px rgba(245,238,228,.5);color:var(--on)}
  .mbar .r{background:var(--chili);color:#fff}
}
@media (max-width:380px){
  .h-hero{font-size:38px}
  .facts b{min-width:116px;font-size:34px}
  .tilemap{gap:4px}
  .tile b{font-size:11.5px}
  .ft-top{grid-template-columns:1fr}
}

/* ───────── 2026-10-02 폰 압축(형: 폰에서 너무 길다) · PC 영향 없음 ───────── */
@media (max-width:900px){
  /* 공통 간격 */
  .sec{padding-block:56px}
  .sec.tight{padding-block:36px}
  .sec-head{margin-bottom:28px}
  .sec-head .body,.sec-head .lead{margin-top:12px}
  .kick{margin-bottom:12px}
  .h-xl{font-size:clamp(34px,9.4vw,46px)}
  .h-lg{font-size:clamp(28px,7.6vw,36px)}
  .h-md{font-size:20px}
  .phero{min-height:56svh}
  .phero.short{min-height:48svh}
  .phero-in{padding-block:calc(var(--hd) + 40px) 32px}
  .phero .lead{margin-top:14px;font-size:16px}
  .cta-band{padding-block:52px}
  .cta-in{gap:24px}
  .ft{padding:44px 0 120px}
  .ft-top{gap:24px;padding-bottom:28px}
  .ft-top>div:nth-child(n+3){display:none}
  .ft-brand p{margin-top:14px}
  .ft h5{margin-bottom:10px}
  .ft-bot{padding-top:20px;gap:8px}

  /* 가로로 넘기는 줄(다음 카드가 살짝 보이게) */
  .duo-in,.dishes,.rows,.steps,.quotes{display:flex;flex-direction:row;overflow-x:auto;overscroll-behavior-x:contain;scroll-snap-type:x mandatory;gap:14px;margin-inline:calc(var(--gut) * -1);padding-inline:var(--gut);scroll-padding-inline:var(--gut);scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .duo-in::-webkit-scrollbar,.dishes::-webkit-scrollbar,.rows::-webkit-scrollbar,.steps::-webkit-scrollbar,.quotes::-webkit-scrollbar{display:none}
  .duo-in>*,.dishes>*,.rows>*,.steps>*,.quotes>*{flex:0 0 calc(100% - 36px);min-width:0;scroll-snap-align:start}
  .duo-in::after,.dishes::after,.rows::after,.steps::after,.quotes::after{content:"";flex:0 0 2px}
  .js .duo-in .rv,.js .dishes .rv,.js .rows .rv,.js .steps .rv,.js .quotes .rv{opacity:1;transform:none;transition:none}

  /* 메인 */
  .facts-in{grid-template-columns:repeat(3,minmax(0,1fr))}
  .facts-in>div{flex-direction:column;align-items:flex-start;gap:6px;padding:20px 0 22px}
  .facts-in>div+div{border-top:0;border-left:1px solid var(--ink-line);padding-left:12px}
  .facts b{min-width:0;font-size:clamp(24px,7vw,30px)}
  .facts span{font-size:15px;line-height:1.4}
  .facts em{display:none}
  .statement{padding-block:56px}
  .statement .lead{margin-top:16px;font-size:16px}
  .split-img{aspect-ratio:16/10}
  .split-tx,.split.rev .split-tx{padding:40px var(--gut) 48px}
  .split-tx .h-lg{margin-bottom:14px}
  .split-tx>.body{display:none}
  .flow3{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:8px;margin-top:20px;border-top:0}
  .flow3 li{display:block;padding:14px 12px;border:1px solid var(--line);border-radius:6px}
  .flow3 .num{display:block;padding:0;font-size:15px}
  .flow3 h3{font-size:17px;margin-top:2px}
  .flow3 p{display:none}
  body[data-page=home] .bleed{display:none}
  .bleed,.bleed.tall{min-height:min(60svh,560px)}
  .bleed-tx{padding-block:72px 36px}
  .bleed-tx .lead{margin-top:12px;font-size:16px}
  .duo{padding-block:56px}
  .duo-in{margin-bottom:20px}
  .duo .ph{aspect-ratio:16/10}
  .duo .h-md{margin-top:16px}
  .duo p{margin-top:6px;font-size:15px}
  .revenue{gap:24px}
  .money-tx .h-lg{margin-bottom:0}
  .money-tx .body{display:none}
  .money-tx .tlink{margin-top:14px}
  .ledger{padding:22px 20px}
  .lg-head{padding-bottom:16px}
  .lg-head b{font-size:34px}
  .lg-bar{height:44px;margin:18px 0 4px}
  .lg-rows{margin-top:8px}
  .lg-rows li{padding:9px 0;font-size:15px}
  .ledger .note{display:none}
  body[data-page=home] .room{display:none}
  .cost-tease{gap:0}
  .mega{font-size:clamp(60px,17vw,84px)}
  .cost-tease .note{margin:12px 0 22px}
  .cost-tease .ct-list{display:none}
  .owner{padding-block:56px}
  .owner-in{gap:22px}
  .owner .ph{aspect-ratio:16/10}
  .owner blockquote{font-size:19px;line-height:1.55}
  .owner figcaption{margin-top:14px;font-size:15px}
  .owner .tlink{margin-top:16px}
  .owner .note.on-dark{margin-top:20px}
  .store-sec{padding-block:56px 24px}
  .store-head{gap:16px;margin-bottom:24px}
  .cnt{gap:8px 24px}
  .cnt li b{font-size:30px}
  .store-img{aspect-ratio:16/9}

  /* 브랜드 */
  .rows{gap:14px}
  .row{gap:14px;align-items:start}
  .row .ph{aspect-ratio:16/10}
  .row .idx{margin-bottom:6px}
  .row .h-md{margin-bottom:8px}
  .row .body{font-size:15px;line-height:1.7}
  .roles{gap:14px}
  .roles>div{padding:22px 20px}
  .roles h3{font-size:20px;margin-bottom:8px}
  .roles li{padding:9px 0;font-size:15.5px;line-height:1.55}
  .quotes{width:auto;margin:28px 0 0;padding-top:24px}
  .quotes figure{padding:18px;border:1px solid var(--ink-line);border-radius:6px}
  .quotes blockquote{font-size:16px;line-height:1.65}
  .quotes figcaption{margin-top:10px}

  /* 메뉴 */
  .dishes{gap:14px}
  .dish .ph{aspect-ratio:16/10}
  .dish-h{margin-top:14px;gap:10px}
  .dish-h b{font-size:19px}
  .dish p{font-size:15px}
  .board{margin-top:32px}
  .mtable tr{padding:14px 0}
  .mtable tbody th{padding-bottom:8px}
  .mtable tbody th b{font-size:18px}
  .mtable tbody th span{display:none}
  .sari{margin-top:20px}
  .sari ul{grid-template-columns:1fr 1fr;column-gap:20px}
  .sari li,.plist li{padding:10px 0;font-size:15.5px}
  .side{gap:22px}
  .side .ph{aspect-ratio:16/9}
  .side .h-lg{margin-bottom:18px}
  .pack{gap:20px}
  .pack .body{display:none}
  .facts-list{margin-top:0}
  .facts-list li{grid-template-columns:88px 1fr;gap:12px;padding:12px 0;font-size:15px}

  /* 창업 안내 */
  .tabs a{padding:14px 0}
  .promises{gap:0;border-top:2px solid var(--tx)}
  .promises li{display:grid;grid-template-columns:36px 1fr;align-items:baseline;border-top:0;border-bottom:1px solid var(--line);padding:14px 0}
  .promises h3{font-size:18px;margin:0}
  .promises p{display:none}
  .cost-notes .note+.note{display:none}
  .cost-notes{margin-top:14px}
  .fmt{margin-bottom:16px}
  .fmt button{padding:11px 16px}
  table.cost td{padding:12px 0}
  table.cost .it{font-size:16px}
  table.cost .am{font-size:17px}
  table.cost tfoot td{padding-top:16px}
  table.cost tfoot .am{font-size:26px}
  .cost-wrap{gap:20px}
  .cost-side{padding:20px}
  .cost-side h3{font-size:18px;margin-bottom:10px}
  .cost-side dl{display:grid;grid-template-columns:1fr 1fr;gap:8px}
  .cost-side dl>div{flex-direction:column;justify-content:flex-start;gap:2px;padding:10px 12px;border:1px solid var(--ink-line);border-radius:4px;font-size:15px;line-height:1.45}
  .cost-side dd{text-align:left}
  .cost-side dl>div:last-child{grid-column:1/-1}
  .cost-side p{display:none}
  #calc .sec-head .body{display:none}
  .calc{gap:14px}
  .calc-in{gap:18px;padding:20px}
  .calc-row2{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px}
  .fld label{font-size:15px;margin-bottom:6px;line-height:1.4}
  .fld small{display:none}
  .money input{padding:12px 10px;font-size:17px}
  .money span{padding-right:10px}
  .sel select{padding:12px 34px 12px 12px;font-size:16px}
  .calc-out{padding:22px 20px}
  .calc-out .bar{margin:16px 0 6px}
  .brk li{padding:8px 0}
  .calc-out .disclaim{margin:10px 0 18px}
  .calc-out .btn{align-self:stretch}
  .steps{border-top:0;gap:12px}
  .steps>li:nth-child(n){padding:18px 18px 20px;border:1px solid var(--line);border-radius:6px;background:var(--white)}
  .steps .n{font-size:32px;margin:6px 0 8px}
  .steps h3{font-size:18px}
  .steps p{font-size:15px;line-height:1.65}
  .sup{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;border-top:0}
  .sup article:nth-child(n){padding:16px 14px;border:1px solid var(--ink-line);border-radius:6px;background:var(--ink-2)}
  .sup .big{font-size:24px;margin-bottom:8px}
  .sup h3{font-size:16px;line-height:1.45}
  .sup p{display:none}
  .voice{margin-top:28px;gap:0}
  .voice blockquote{font-size:18px;line-height:1.6}
  .voice cite{margin-top:10px}
  .voice .n{display:none}
  .seminar{grid-template-columns:64px 1fr;gap:12px 16px;padding:18px;align-items:center}
  .seminar .date{width:64px;height:64px}
  .seminar .date b{font-size:26px}
  .seminar .date span{font-size:11.5px;margin-top:2px}
  .seminar h3{font-size:18px;line-height:1.4}
  .seminar p{display:none}
  .seminar .btn{grid-column:1/-1}
  .faq-wrap{gap:0}
  .faq-wrap .sec-head{margin-bottom:16px}
  .faq summary{padding:17px 0;font-size:17px}
  .faq .a{padding-bottom:18px}
  .faq .a p{font-size:15.5px}
  .quick-wrap{padding-block:52px}
  .quick .h-md{font-size:22px;line-height:1.4}
  .quick-f{grid-template-columns:minmax(0,1fr) minmax(0,1fr);gap:12px;margin-top:20px}
  .quick-f label:nth-child(3),.quick-f .btn{grid-column:1/-1}
  .quick input,.quick select{height:52px}

  /* 2차: .wrap 이 곧 줄인 경우 · 꼬리 · 메인 군더더기 */
  .wrap.duo-in{width:auto;margin-inline:0}
  .ft-top{grid-template-columns:minmax(0,1fr) auto;align-items:start}
  .ft-brand{grid-column:auto}
  .ft-brand p{display:none}
  .ft h5{display:none}
  .ft .tel{font-size:22px}
  .ft p{margin-bottom:4px}
  body[data-page=home] .owner .ph{display:none}
  body[data-page=home] .money-tx .tlink{display:none}
  .duo p{display:none}
  .dish p{display:none}
  .bleed,.bleed.tall{min-height:min(52svh,500px)}
  .split.rev .split-tx{justify-self:stretch}
  .tabs-in{width:auto;margin-inline:0;padding-inline:var(--gut);scroll-padding-inline:var(--gut)}
  .tabs-in::after{content:"";flex:0 0 4px}
}
