:root{--bg:#0b0b0d;--surface:#17171b;--line-tone:#26262c;--ink:#f5f5f5;--muted:#cfccc5;--accent:#ff6a13;--accent-ink:#0b0b0d;--paper:#ecebe6;--paper-ink:#0b0b0d;--paper-soft:#3c3b38;
--font:"Pretendard Variable",Pretendard,-apple-system,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;--display:"Black Han Sans","Pretendard Variable",Pretendard,sans-serif;
--small:.9375rem;--body:clamp(1.0625rem,1rem + .25vw,1.1875rem);--lead:clamp(1.3125rem,1.15rem + .7vw,1.75rem);--head:clamp(2.75rem,1.6rem + 5vw,6rem);
--m:clamp(1.25rem,3.4vw,3.5rem);--g:clamp(1rem,2vw,2rem);--sec:clamp(5rem,10vw,9rem);--ease:cubic-bezier(.16,1,.3,1)}
*,*::before,*::after{box-sizing:border-box}
html{-webkit-text-size-adjust:100%;text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:var(--font);font-size:var(--body);font-weight:500;line-height:1.65;letter-spacing:-.012em;word-break:keep-all;overflow-wrap:break-word;-webkit-font-smoothing:antialiased;overflow-x:clip}
h1,h2,h3,p,figure,ul,ol,dl,dd{margin:0}ul,ol{padding:0;list-style:none}
img{display:block;width:100%;height:auto;background:var(--surface)}
a{color:inherit}button,input,select{font:inherit;color:inherit}
:focus-visible{outline:3px solid var(--accent);outline-offset:3px}
::selection{background:var(--accent);color:var(--accent-ink)}
h1,h2{font-family:var(--display);font-weight:400;letter-spacing:-.01em;line-height:1.05;text-wrap:balance}
h2{font-size:var(--head)}
h3{font-family:var(--display);font-weight:400;font-size:var(--lead);letter-spacing:0;line-height:1.2}
.wrap{padding-inline:var(--m)}
.grid{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));column-gap:var(--g)}
.sec{margin-top:var(--sec)}
.note{color:var(--muted)}.small{font-size:var(--small)}
.ph{font-style:normal;color:var(--accent);text-decoration:underline dotted 2px;text-underline-offset:5px}
.skip{position:absolute;left:-999px}.skip:focus{left:1rem;top:1rem;z-index:50;background:var(--ink);color:var(--bg);padding:.5rem 1rem}

.btn{display:inline-flex;align-items:center;justify-content:center;min-height:56px;padding:.7rem 1.75rem;background:var(--accent);color:var(--accent-ink);font-weight:800;text-decoration:none;border:0;cursor:pointer;transition:background .18s,color .18s,transform .14s}
.btn:hover{background:var(--ink)}.btn:active{transform:scale(.97)}
.btn.alt{background:var(--line-tone);color:var(--ink)}.btn.alt:hover{background:var(--ink);color:var(--bg)}
.field .btn{background:var(--paper-ink);color:var(--ink)}.field .btn:hover{background:var(--accent);color:var(--accent-ink)}
.more{display:inline-block;font-weight:700;text-decoration:underline;text-underline-offset:6px;text-decoration-thickness:2px;text-decoration-color:var(--accent);transition:transform .18s}
.more:hover{transform:translateX(4px)}

/* 누르는 전화 버튼 */
.call{--edge:#a33b00;display:inline-flex;align-items:center;justify-content:center;gap:.6rem;min-height:68px;padding:.8rem 1.75rem;border-radius:14px;background:var(--accent);color:var(--accent-ink);font-size:var(--lead);font-weight:900;line-height:1.1;letter-spacing:-.02em;white-space:nowrap;text-decoration:none;box-shadow:inset 0 2px 0 rgba(255,255,255,.45),0 8px 0 var(--edge),0 14px 22px rgba(0,0,0,.5);transition:transform .08s,box-shadow .08s,background .15s;-webkit-tap-highlight-color:transparent;user-select:none}
.call svg{flex:none}
.call .num{font-size:var(--body);font-weight:800;padding-left:.7rem;font-variant-numeric:tabular-nums}
.call:hover{background:#ff7d30}
.call:active{transform:translateY(6px);box-shadow:inset 0 2px 0 rgba(255,255,255,.3),0 2px 0 var(--edge),0 4px 8px rgba(0,0,0,.5)}
.call.fixed{position:fixed;right:clamp(1rem,2.4vw,2rem);bottom:calc(clamp(1rem,2.4vw,2rem) + 8px + env(safe-area-inset-bottom));z-index:40;outline:3px solid var(--bg);outline-offset:0}
.close .call{--edge:#000;margin-top:1.5rem;background:var(--bg);color:var(--ink)}
.close .call:hover{background:#26262c}

/* 머리글 */
.top{display:flex;align-items:center;justify-content:space-between;gap:1rem;padding:1rem var(--m);position:relative;z-index:5;background:var(--bg)}
.top .mark{font-family:var(--display);font-size:1.75rem;line-height:1;text-decoration:none}
.top nav ul{display:flex;gap:clamp(1.25rem,3vw,2.75rem)}
.top nav a{text-decoration:none;font-weight:700;padding:.5rem 0;transition:color .18s}.top nav a:hover,.top nav a[aria-current]{color:var(--accent)}
.top>.btn{min-height:44px;padding:.4rem 1.25rem}

/* 첫 화면 */
.hero{position:relative;min-height:calc(100svh - 76px);display:flex;align-items:flex-end;overflow:hidden;isolation:isolate}
.strip{position:absolute;inset:0;z-index:-1;display:grid;grid-template-columns:repeat(3,1fr)}
.strip img{width:100%;height:100%;object-fit:cover}
.strip::after{content:"";position:absolute;inset:0;background:linear-gradient(to top,rgba(11,11,13,.92) 8%,rgba(11,11,13,.28) 62%,rgba(11,11,13,.2))}
.over{width:100%;padding:0 var(--m) clamp(1.5rem,3vw,2.5rem)}
.hero h1 .n{display:block;font-size:21.5vw;line-height:.95;white-space:nowrap}
.hero h1 .k{display:block;font-size:clamp(2.25rem,5.4vw,5rem);line-height:1.05;color:var(--accent);margin-top:.15em}
.hero .row{display:flex;align-items:flex-end;justify-content:space-between;gap:2rem;margin-top:1.1rem;flex-wrap:wrap}
.hero .sub{font-size:var(--lead);font-weight:700;line-height:1.35;max-width:26em}

/* 흐르는 글자 띠 */
.ticker{background:var(--accent);color:var(--accent-ink);overflow:hidden;white-space:nowrap}
.ticker div{display:inline-block;padding-block:.5rem;font-family:var(--display);font-size:clamp(1.5rem,2.6vw,2.5rem);line-height:1.2;animation:tick 34s linear infinite}
.ticker span{margin-right:1.6em}
@keyframes tick{to{transform:translateX(-50%)}}

/* 숫자 안내 */
.stats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));column-gap:var(--g);row-gap:2rem;padding-block:clamp(3rem,6vw,5.5rem)}
.stats dt{order:2;margin-top:.4rem;font-size:var(--body);font-weight:700;color:var(--muted)}
.stats div{display:flex;flex-direction:column}
.stats dd{order:1;font-family:var(--display);font-size:clamp(2.5rem,5.6vw,5.25rem);line-height:1;letter-spacing:-.01em}
.stats dd.t{font-size:clamp(1.75rem,3.1vw,2.9rem);line-height:1.1;min-height:1.75em;display:flex;align-items:flex-end}

/* 정찰제 */
.deal{background:var(--accent);color:var(--accent-ink);padding-block:clamp(3.5rem,7vw,6.5rem);margin-bottom:var(--sec)}
.deal h2{font-size:clamp(2.75rem,7.3vw,7rem);line-height:1.08}
.deal .item{font-family:var(--display);font-size:clamp(2rem,4.4vw,4.25rem);line-height:1.1;margin-top:clamp(1.5rem,3vw,2.5rem)}
.prices{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));column-gap:var(--g);margin-top:clamp(1rem,2vw,1.75rem)}
.prices dt{font-size:var(--lead);font-weight:800;line-height:1.2}
.prices dd{font-family:var(--display);font-size:clamp(3rem,11vw,10.5rem);line-height:1.05}
.deal .promise{margin-top:clamp(1.5rem,3vw,2.5rem);padding:clamp(1rem,2vw,1.5rem) clamp(1.1rem,2vw,1.75rem);background:var(--bg);color:var(--ink);font-size:clamp(1.3125rem,2.6vw,2.5rem);font-weight:800;line-height:1.3}

/* 제목줄 */
.sh{display:flex;align-items:flex-end;justify-content:space-between;gap:2rem;flex-wrap:wrap;padding-bottom:clamp(1.5rem,3vw,2.5rem)}
.sh p{max-width:28em;font-size:var(--lead);font-weight:600;line-height:1.4}

/* 룸 모자이크 */
.mosaic{display:grid;grid-template-columns:repeat(12,minmax(0,1fr));gap:6px}
.cell{position:relative;display:block;overflow:hidden;text-decoration:none;isolation:isolate}
.cell img{width:100%;height:100%;object-fit:cover;transition:transform .9s var(--ease)}.cell:hover img{transform:scale(1.04)}
.c-a{grid-column:span 7;aspect-ratio:7/4.6}.c-b{grid-column:span 5;aspect-ratio:5/4.6}
.c-c{grid-column:span 4;aspect-ratio:4/5}

/* 주류 판 */
.field{background:var(--paper);color:var(--paper-ink);padding-block:clamp(4rem,8vw,7.5rem)}
.field .note,.field .cap{color:var(--paper-soft)}
.field .ph{color:var(--paper-ink)}
.field h2.huge{font-size:clamp(3.5rem,13.5vw,12.5rem);line-height:.98}
.field .lead{font-size:var(--lead);font-weight:600;line-height:1.4;margin-top:1.25rem;max-width:32em}
.board{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(5rem,6vw,5.5rem) var(--g);margin-top:clamp(2.5rem,5vw,4.5rem)}
.mg h3{font-size:clamp(1.875rem,3vw,2.75rem);display:flex;justify-content:space-between;gap:1rem;margin-bottom:.7rem}
.mg h3 span{font-family:var(--font);font-size:var(--body);font-weight:800;font-variant-numeric:tabular-nums;align-self:flex-end}
.mg li{padding-block:.28rem;display:flex;justify-content:space-between;align-items:baseline;gap:1rem;font-size:var(--lead);font-weight:700;line-height:1.3}
.mg li b{font-weight:700}.mg li span{font-size:var(--small);font-weight:600;color:var(--paper-soft);text-align:right}

/* 질문 */
.faq .q{grid-column:1/8}
.faq .p{grid-column:9/13}.faq .p img{height:100%;object-fit:cover;max-height:42rem}
details{margin-top:1.25rem}
summary{cursor:pointer;font-size:var(--lead);font-weight:700;line-height:1.35;display:flex;justify-content:space-between;gap:1rem;min-height:44px;align-items:center;list-style:none;transition:color .18s}
summary::-webkit-details-marker{display:none}
summary::after{content:"";flex:none;width:.65rem;height:.65rem;border-right:3px solid var(--accent);border-bottom:3px solid var(--accent);transform:rotate(45deg);transition:transform .24s var(--ease)}
details[open] summary::after{transform:rotate(-135deg)}
summary:hover{color:var(--accent)}
details p{margin-top:.4rem;max-width:38em}
.faq .btn{margin-top:2.25rem}

/* 문의 */
.close{margin-top:var(--sec);background:var(--accent);color:var(--accent-ink);padding-block:clamp(3.5rem,7vw,6.5rem)}
.close h2{font-size:clamp(3rem,10vw,9.5rem);line-height:1}
.close .tel{display:block;margin-top:1rem;font-family:var(--display);font-size:clamp(2.25rem,6vw,5.5rem);line-height:1.1;text-decoration:none}
.close .tel .ph{color:var(--accent-ink);text-decoration-thickness:3px}
.close .info{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--g);margin-top:2.5rem;font-size:var(--body);font-weight:700}
.close .info .ph{color:var(--accent-ink)}.close .more{text-decoration-color:var(--accent-ink)}
.close .info b{display:block;font-weight:800}

/* 바닥글 */
.foot{background:var(--bg);color:var(--ink);padding:3rem var(--m) 1.5rem}
.foot .cols{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:var(--g);font-size:var(--small)}
.foot .cols b{display:block;font-weight:800;margin-bottom:.35rem}
.foot .cols a{text-decoration:none}.foot .cols a:hover{color:var(--accent)}.foot li{padding-block:.14rem}
.foot .word{margin-top:clamp(3rem,6vw,5rem)}.foot .word svg{display:block;width:100%;height:auto;fill:var(--ink)}
.foot .legal{margin-top:1rem;font-size:var(--small);line-height:1.5;color:var(--muted);max-width:70ch}

/* 하위 페이지 */
.pagehead{padding-top:clamp(2rem,5vw,4.5rem)}
.pagehead h1{font-size:clamp(3rem,8.5vw,8rem);line-height:1.02}
.pagehead .ph-t{grid-column:1/8;align-self:end}.pagehead .ph-t p,.pagehead>p{margin-top:1.25rem;font-size:var(--lead);font-weight:600;line-height:1.4}
.pagehead>h1,.pagehead>p{grid-column:1/-1}.pagehead>p{max-width:32em}
.pagehead .ph-i{grid-column:8/13;margin-right:calc(var(--m) * -1)}.pagehead .ph-i img{aspect-ratio:16/11;object-fit:cover}
.frame{overflow:hidden}
.twin .prose{grid-column:1/9}.twin .aside{grid-column:10/13}.aside a{display:block;text-decoration:none;margin-bottom:1.5rem}.cap{display:block;margin-top:.5rem;font-size:var(--small);font-weight:700}
.prose p,.prose details p{max-width:38em}.prose p{margin-top:1rem}
.prose section+section{margin-top:clamp(5rem,8vw,6rem)}.prose h2{font-size:clamp(2.25rem,4.4vw,4rem)}
.crumb{font-size:var(--small);font-weight:600;color:var(--muted);padding-top:1rem}.crumb ol{display:flex;gap:.5rem}.crumb li+li::before{content:"/";margin-right:.5rem}.crumb a{text-decoration:none}.crumb a:hover{color:var(--ink)}
.gallery{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:6px;align-items:start}.gallery figure:nth-child(5){grid-column:span 2}.gallery figure:nth-child(5) img{aspect-ratio:16/9;object-fit:cover;object-position:50% 62%}
table{width:100%;border-collapse:collapse;margin-top:1.5rem}th,td{text-align:left;padding:.75rem 1rem .75rem 0;vertical-align:top}th{font-weight:800;color:var(--muted)}tbody tr:nth-child(odd){background:var(--surface)}tbody td:first-child,thead th:first-child{padding-left:.75rem}
.steps{list-style:decimal;padding-left:1.4rem}.steps li{margin-top:.8rem}.steps li::marker{color:var(--accent);font-weight:800}
.mnav{display:none}

/* 등장 */
.js .rise{opacity:0;transform:translateY(24px);transition:opacity .7s var(--ease),transform .7s var(--ease);transition-delay:var(--d,0ms)}
.js .rise.on{opacity:1;transform:none}
.js .hero h1 .n{animation:up .9s var(--ease) both}.js .hero h1 .k{animation:up .9s var(--ease) .1s both}.js .hero .row{animation:up .9s var(--ease) .2s both}
@keyframes up{from{opacity:0;transform:translateY(28px)}}
@media (prefers-reduced-motion:reduce){.js .rise,.js .hero h1 .n,.js .hero h1 .k,.js .hero .row{opacity:1;transform:none;animation:none;transition:none}.ticker div{animation:none}.cell img{transition:none}}

@media (max-width:900px){
.top{padding-block:.6rem}.top>nav,.top>.btn{display:none}
.mnav{display:block;margin-top:0}
.mnav summary{min-height:44px;min-width:44px;justify-content:flex-end;font-size:var(--body);font-weight:800}
.mnav summary::after{display:none}.mnav[open] summary{color:var(--accent)}
.top .mnav:not([open]) nav{display:none}
.top .mnav[open] nav{display:block;position:absolute;left:0;right:0;top:100%;z-index:30;background:var(--surface);padding:.75rem var(--m) 1.5rem}
.top .mnav nav ul{display:block}
.top .mnav nav li a{display:flex;align-items:center;min-height:56px;font-family:var(--display);font-weight:400;font-size:var(--lead);padding:0}
.top .mnav .btn{display:flex;width:100%;margin-top:1rem}
.mnav .note{margin-top:1rem}
.hero{min-height:calc(100svh - 118px)}
.strip{grid-template-columns:1fr}.strip img:nth-child(n+2){display:none}
.hero .row{display:block}.hero .btn{margin-top:1rem;width:100%}
.stats{grid-template-columns:1fr 1fr}
.c-a,.c-b{grid-column:span 12;aspect-ratio:3/2}.c-c{grid-column:span 12;aspect-ratio:1}
.board{grid-template-columns:1fr 1fr}
.faq .q,.faq .p{grid-column:1/13}.faq .p{grid-row:2;margin-top:2.5rem}.faq .p img{aspect-ratio:3/2;max-height:none}.faq .btn{width:100%}
.close .info{grid-template-columns:1fr;gap:1rem}
.foot .cols{grid-template-columns:1fr 1fr;row-gap:2rem}
.pagehead .ph-t{grid-column:1/13}.pagehead .ph-i{grid-column:1/13;margin:2rem calc(var(--m) * -1) 0}.twin .prose{grid-column:1/13}.twin .aside{grid-column:1/13;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:var(--g);margin-top:3rem}.aside a{margin:0}
.gallery{grid-template-columns:1fr}.gallery figure:nth-child(5){grid-column:auto}.gallery figure:nth-child(5) img{aspect-ratio:auto}
body{padding-bottom:calc(92px + env(safe-area-inset-bottom))}
:target{scroll-margin-top:1rem}
}
@media (max-width:560px){
.board{grid-template-columns:1fr}
.prose table{font-size:var(--small)}.prose th,.prose td{padding-right:.6rem}
.foot .word{margin-top:2.5rem}
}
@media (max-width:900px){
.call.fixed{left:.75rem;right:.75rem;bottom:calc(.75rem + 8px + env(safe-area-inset-bottom))}
.close .call{width:100%}
}
@media (max-width:480px){.call .num{display:none}}
@media (prefers-reduced-motion:reduce){.call{transition:none}}
.hero .call{display:none}
@media (max-width:900px){.over{padding-bottom:calc(100px + env(safe-area-inset-bottom))}.foot{padding-bottom:1rem}}
@media (min-width:901px){.foot{padding-bottom:7rem}}
.sec>.deal{margin-bottom:0}