:root{--pk:#FB037F;--pk2:#ff3a9d;--nv:#0d1b3a;--tx:#14182a;--mu:#6b7285;--ln:#e6e8ef;--bg:#f6f7fa;--ease:cubic-bezier(.7,0,.2,1)}
*{box-sizing:border-box;margin:0;padding:0}html,body{height:100%;overflow:hidden}
body{font-family:"Pretendard Variable",Pretendard,-apple-system,sans-serif;color:var(--tx);background:#fff;-webkit-font-smoothing:antialiased;letter-spacing:-.02em;word-break:keep-all}
a{color:inherit;text-decoration:none;cursor:pointer}img{display:block;max-width:100%}
#fp{height:100%;transition:transform 1s var(--ease);will-change:transform}
.sec{position:relative;height:100vh;height:100dvh;overflow:hidden;display:flex;align-items:center;background:#fff}
.sec .in{position:relative;z-index:2;width:min(1240px,88vw);margin:0 auto;padding-top:60px}
.bg{position:absolute;inset:0;background-size:cover;background-position:center;transform:scale(1.12);transition:transform 6s ease-out}
.sec.on .bg{transform:scale(1)}
.veil{position:absolute;inset:0;background:linear-gradient(100deg,rgba(13,27,58,.82) 0%,rgba(13,27,58,.45) 50%,rgba(13,27,58,.1) 100%)}
.veil.lt{background:linear-gradient(100deg,rgba(255,255,255,.97) 0%,rgba(255,255,255,.9) 45%,rgba(255,255,255,.55) 100%)}
.eyebrow{font-size:13px;font-weight:700;letter-spacing:.22em;color:var(--pk);margin-bottom:22px;display:flex;align-items:center;gap:12px}
.eyebrow:before{content:"";width:28px;height:2px;background:var(--pk)}
h1{font-size:clamp(38px,6.2vw,88px);line-height:1.12;font-weight:300;letter-spacing:-.04em;color:#fff}
h1 strong{font-weight:800;color:#fff;background:linear-gradient(transparent 70%,rgba(251,3,127,.75) 70%)}
h2{font-size:clamp(28px,3.6vw,52px);line-height:1.22;font-weight:300;letter-spacing:-.04em}
h2 em,h2 strong{font-style:normal;font-weight:800;color:var(--pk)}
.lead{color:rgba(255,255,255,.85);font-size:clamp(16px,1.4vw,20px);line-height:1.7;margin:28px 0 40px}
.body{color:var(--mu);font-size:clamp(15px,1.15vw,18px);line-height:1.8;margin:26px 0 34px;max-width:520px}
.cta{display:flex;gap:12px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;height:56px;padding:0 30px;border-radius:999px;font-weight:700;font-size:16px;transition:.3s}
.btn.pk{background:var(--pk);color:#fff;box-shadow:0 12px 30px -10px rgba(251,3,127,.6)}.btn.pk:hover{background:var(--pk2);transform:translateY(-2px)}
.btn.gh{border:1px solid rgba(255,255,255,.5);color:#fff}.btn.gh:hover{background:#fff;color:var(--nv)}
.btn.ol{border:1.5px solid var(--pk);color:var(--pk)}.btn.ol:hover{background:var(--pk);color:#fff}
/* header */
.hd{position:fixed;z-index:50;top:0;left:0;right:0;height:84px;display:flex;align-items:center;gap:40px;padding:0 4vw;transition:.5s}
.brand img{height:38px;width:auto}.brand .lc{display:none}
.gnb{display:flex;gap:36px;margin-left:auto}.gnb a{font-weight:600;font-size:15px;color:#fff;position:relative;padding:6px 0}
.gnb a:after{content:"";position:absolute;left:0;bottom:0;width:0;height:2px;background:var(--pk);transition:.3s}.gnb a:hover:after,.gnb a.act:after{width:100%}
.hcall{display:flex;flex-direction:column;font-weight:800;font-size:20px;color:#fff;line-height:1.1}.hcall span{font-size:11px;font-weight:600;opacity:.7;letter-spacing:.05em}
body.light .hd{background:rgba(255,255,255,.88);backdrop-filter:blur(14px);box-shadow:0 1px 0 var(--ln)}
body.light .brand .lc{display:block}body.light .brand .lw{display:none}body.light .gnb a{color:var(--tx)}body.light .hcall{color:var(--pk)}
.burger{display:none;margin-left:auto;background:none;border:0;width:40px;height:40px;position:relative}
.burger i{position:absolute;left:8px;right:8px;height:2px;background:#fff;transition:.3s}.burger i:first-child{top:15px}.burger i:last-child{top:24px}
body.light .burger i{background:var(--tx)}body.mo .burger i{background:var(--tx)}body.mo .burger i:first-child{top:19px;transform:rotate(45deg)}body.mo .burger i:last-child{top:19px;transform:rotate(-45deg)}
.mnav{position:fixed;inset:0;z-index:40;background:#fff;display:flex;flex-direction:column;justify-content:center;padding:0 10vw;gap:22px;opacity:0;pointer-events:none;transition:.4s}
.mnav a{font-size:28px;font-weight:700}.mnav .mcall{margin-top:20px;color:#fff;background:var(--pk);border-radius:999px;padding:16px 24px;font-size:18px;text-align:center}
body.mo .mnav{opacity:1;pointer-events:auto}body.mo .brand .lc{display:block}body.mo .brand .lw{display:none}
/* dots */
.dots{position:fixed;z-index:30;right:3vw;top:50%;transform:translateY(-50%);display:flex;flex-direction:column;gap:18px}
.dots button{border:0;background:none;display:flex;position:relative;width:12px;height:auto;min-height:8px;padding:0;align-items:center;justify-content:flex-end;gap:12px;cursor:pointer;font:600 11px/1 inherit;letter-spacing:.15em;color:transparent;transition:.3s}.dots button b{position:absolute;right:22px;top:50%;transform:translateY(-50%);white-space:nowrap;font-weight:600;pointer-events:none}
.dots button i{width:8px;height:8px;border-radius:50%;background:rgba(255,255,255,.5);transition:.4s}
.dots button.act i{height:28px;border-radius:6px;background:var(--pk)}.dots button:hover{color:#fff}
body.light .dots button i{background:#c9cdd8}body.light .dots button.act i{background:var(--pk)}body.light .dots button:hover{color:var(--tx)}
.counter{position:fixed;z-index:30;left:4vw;bottom:5vh;display:flex;align-items:center;gap:14px;font-weight:700;color:#fff;font-size:14px}
.counter span{width:60px;height:1px;background:currentColor;opacity:.4}.counter em{font-style:normal;opacity:.5}body.light .counter{color:var(--tx)}
/* anim */
.a{opacity:0;transform:translateY(40px);transition:opacity .9s ease,transform 1s var(--ease)}
.sec.on .a{opacity:1;transform:none}
.sec.on .a:nth-child(2){transition-delay:.15s}.sec.on .a:nth-child(3){transition-delay:.3s}.sec.on .a:nth-child(4){transition-delay:.45s}.sec.on .a:nth-child(5){transition-delay:.6s}
/* hero */
.s-hero{background:var(--nv)}.s-hero .eyebrow{color:#fff}.s-hero .eyebrow:before{background:var(--pk)}
.scrollhint{position:absolute;z-index:3;left:50%;bottom:4vh;transform:translateX(-50%);color:#fff;font-size:11px;letter-spacing:.3em;display:flex;flex-direction:column;align-items:center;gap:10px;opacity:.8}
.scrollhint span{width:1px;height:50px;background:linear-gradient(var(--pk),transparent);animation:sh 2s infinite}
@keyframes sh{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}
/* about */
.grid2{display:grid;grid-template-columns:1fr 1.05fr;gap:6vw;align-items:center}
.s-about{background:linear-gradient(180deg,#fff,var(--bg))}
.kv{list-style:none;display:flex;gap:0;border-top:1px solid var(--ln)}
.kv li{flex:1;padding:22px 0 0;border-right:1px solid var(--ln);padding-left:20px}.kv li:first-child{padding-left:0}.kv li:last-child{border:0}
.kv b{display:block;font-size:clamp(17px,1.6vw,24px);font-weight:800}.kv span{font-size:11px;letter-spacing:.2em;color:var(--pk);font-weight:700}
.media{position:relative;border-radius:28px;overflow:hidden;box-shadow:0 40px 80px -40px rgba(13,27,58,.45)}
.media img{width:100%;aspect-ratio:5/4;object-fit:cover}
.tag{position:absolute;left:0;bottom:0;background:var(--pk);color:#fff;font-weight:800;letter-spacing:.12em;padding:22px 28px;border-top-right-radius:22px;line-height:1.3}.tag small{font-weight:500;letter-spacing:0;opacity:.9}
/* services */
.s-svc{background:var(--bg)}.head{margin-bottom:5vh}
.cards{display:grid;grid-template-columns:repeat(3,1fr);gap:24px}
.card{background:#fff;border-radius:24px;overflow:hidden;box-shadow:0 20px 50px -30px rgba(13,27,58,.3);transition:transform .5s var(--ease),box-shadow .5s}
.card:hover{transform:translateY(-10px);box-shadow:0 40px 70px -30px rgba(251,3,127,.35)}
.ph{height:24vh;background-size:cover;background-position:center;transition:transform 1s var(--ease)}.card:hover .ph{transform:scale(1.06)}
.cb{padding:26px 28px 30px;position:relative}.no{position:absolute;right:26px;top:22px;font-weight:800;color:var(--ln);font-size:40px}
.cb h3{font-size:24px;font-weight:800}.cb .en{font-size:11px;letter-spacing:.2em;color:var(--pk);font-weight:700;margin:6px 0 14px}.cb p:last-child{color:var(--mu);line-height:1.7;font-size:15px}
.sec.on .card:nth-child(1){transition-delay:.2s}.sec.on .card:nth-child(2){transition-delay:.35s}.sec.on .card:nth-child(3){transition-delay:.5s}
/* process */
.steps{list-style:none;display:grid;grid-template-columns:repeat(4,1fr);gap:0;border-top:2px solid var(--tx)}
.steps li{padding:30px 26px 10px 0;position:relative}
.steps li:before{content:"";position:absolute;top:-7px;left:0;width:12px;height:12px;border-radius:50%;background:var(--pk);box-shadow:0 0 0 6px rgba(251,3,127,.15)}
.steps span{font-size:12px;letter-spacing:.2em;font-weight:700;color:var(--pk)}.steps b{display:block;font-size:clamp(20px,1.9vw,28px);margin:10px 0 12px;font-weight:800}.steps p{color:var(--mu);line-height:1.7;font-size:15px}
/* network */
.s-net{background:#fff}.map svg{width:100%;max-height:72vh}
.land path{fill:#e3e6ed;stroke:#fbfcfe;stroke-width:1.3;stroke-linejoin:round}
@keyframes dash{to{stroke-dashoffset:-400}}
.map{display:flex;justify-content:center}.map svg{height:70vh;width:auto;max-width:100%;overflow:visible}
.arc{fill:none;stroke:#FB037F;stroke-width:1.8;stroke-linecap:round;stroke-dasharray:1;stroke-dashoffset:1;opacity:.85}
.sec.on .arc{animation:draw 1.4s var(--ease) forwards;animation-delay:calc(.5s + var(--d))}@keyframes draw{to{stroke-dashoffset:0}}
.mv{fill:#FB037F;opacity:0}.sec.on .mv{animation:fi .4s 2.4s forwards}@keyframes fi{to{opacity:1}}
.city circle{fill:#fff;stroke:#FB037F;stroke-width:2.2}.city text,.hubt{font:700 13px Pretendard,sans-serif;fill:#14182a;paint-order:stroke;stroke:#fff;stroke-width:4px;stroke-linejoin:round}
.hub{fill:#FB037F;stroke:#fff;stroke-width:3}.pulse{fill:#FB037F;transform-origin:center;transform-box:fill-box;animation:pl 2s infinite}@keyframes pl{from{transform:scale(1);opacity:.6}to{transform:scale(3.5);opacity:0}}.hubt{fill:#FB037F;font-size:15px;font-weight:800}
/* contact */
.s-contact{background:linear-gradient(135deg,#fff 0%,#fff 55%,#fff0f7 100%);flex-direction:column;justify-content:center}
.big{display:block;font-size:clamp(48px,6.5vw,96px);font-weight:900;color:var(--pk);letter-spacing:-.03em;line-height:1;margin:30px 0 34px}
.big small{display:block;font-size:14px;color:var(--mu);font-weight:600;letter-spacing:0;margin-bottom:12px}
.info{background:#fff;border-radius:28px;padding:40px 44px;box-shadow:0 30px 70px -40px rgba(13,27,58,.35);border:1px solid var(--ln)}
.info dl>div{display:grid;grid-template-columns:96px 1fr;padding:16px 0;border-bottom:1px solid var(--ln);font-size:16px}.info dl>div:last-child{border:0}
.info dt{color:var(--mu);font-weight:600}.info dd{font-weight:700}.info dd a:hover{color:var(--pk)}
.ft{position:absolute;bottom:0;left:0;right:0;display:flex;align-items:center;justify-content:center;gap:16px;padding:18px;font-size:12px;color:var(--mu);border-top:1px solid var(--ln);background:rgba(255,255,255,.7)}.ft img{height:18px}
.fab{display:none}
/* mobile */
@media (max-width:900px){
.hd{height:64px;padding:0 5vw}.brand img{height:28px}.gnb,.hcall{display:none}.burger{display:block}
.dots{right:3.5vw;gap:12px}.dots button{font-size:0}.dots button i{width:6px;height:6px}.dots button.act i{height:20px}.counter{display:none}
.sec .in{padding-top:64px;width:88vw}
.grid2{grid-template-columns:1fr;gap:3vh}
.body{margin:14px 0 18px;line-height:1.65}.eyebrow{margin-bottom:12px;font-size:11px}
.s-about .media img{aspect-ratio:16/9}.kv li{padding-left:12px}.tag{padding:12px 16px;font-size:13px}
.cards{grid-template-columns:1fr;gap:10px}.card{display:grid;grid-template-columns:110px 1fr;border-radius:18px}.ph{height:auto}.cb{padding:14px 16px}.cb h3{font-size:18px}.cb .en{margin:2px 0 6px;font-size:10px}.cb p:last-child{font-size:13px;line-height:1.5}.no{display:none}
.head{margin-bottom:2.5vh}
.steps{grid-template-columns:1fr 1fr;border:0;gap:22px 14px}.steps li{border-top:2px solid var(--tx);padding:18px 0 0}.steps b{font-size:18px;margin:6px 0}.steps p{font-size:13px;line-height:1.55}
.map svg{height:38vh}
.btn{height:50px;padding:0 22px;font-size:15px}
.big{margin:14px 0 18px}.info{padding:14px 20px;border-radius:18px}.info dl>div{grid-template-columns:72px 1fr;padding:9px 0;font-size:14px}
.s-contact .in{padding-bottom:40px}.ft{font-size:10px;padding:10px}.ft img{display:none}
.scrollhint{display:none}.map svg{height:40vh}.fab{display:flex;position:fixed;z-index:35;right:5vw;bottom:calc(20px + env(safe-area-inset-bottom));background:var(--pk);color:#fff;border-radius:999px;height:52px;padding:0 20px;align-items:center;gap:8px;font-weight:800;box-shadow:0 12px 30px -8px rgba(251,3,127,.6)}
body.last .fab{opacity:0;pointer-events:none}
}
@media (max-width:900px) and (max-height:700px){.s-svc .head h2{font-size:24px}.ph{min-height:80px}.s-net .body{display:none}}
@media (prefers-reduced-motion:reduce){*{transition-duration:.01s!important;animation:none!important}}

html,body{overflow-wrap:break-word}h1,h2,h3,p,dd,li,.btn{word-break:keep-all}
@media (max-width:900px){.dots{right:2.5vw}.sec .in{width:84vw;margin-left:7vw;margin-right:9vw}}
@media (min-width:901px) and (max-width:1100px){.sec .in{width:84vw;margin-left:6vw}.cards{gap:16px}.steps li{padding-right:18px}}
@media (min-width:600px) and (max-width:900px) and (min-height:900px){.grid2{gap:4vh}.s-about .media img{aspect-ratio:16/8}.cards{grid-template-columns:1fr;}.card{grid-template-columns:200px 1fr}}
@media (max-height:560px) and (orientation:landscape){
html,body{height:auto;overflow-x:hidden;overflow-y:auto}#fp{transform:none!important;transition:none;height:auto}
.sec{height:auto;min-height:100vh;min-height:100dvh;padding:76px 0 70px;align-items:center}.sec .in{padding-top:0}
.counter,.scrollhint{display:none}.hd{height:56px}body .hd{background:rgba(255,255,255,.92);backdrop-filter:blur(14px)}body .hd .brand .lc{display:block}body .hd .brand .lw{display:none}body .hd .burger i{background:#14182a}
.grid2{grid-template-columns:1fr 1fr;gap:5vw}.s-about .media img{aspect-ratio:16/10}
.cards{grid-template-columns:repeat(3,1fr)}.card{display:block}.ph{height:90px}.steps{grid-template-columns:repeat(4,1fr)}
.map svg{height:80vh}.s-net .body{display:block}.fab{height:44px;padding:0 16px;bottom:12px}
.s-contact{display:block}.s-contact .in{padding-bottom:20px}.ft{position:static}
h1{font-size:34px}h2{font-size:26px}.big{font-size:44px}}
.nw{white-space:nowrap}
@media (min-width:700px) and (max-width:1100px) and (min-height:1000px){.ph{height:20vh}.cb h3{font-size:22px}h2{font-size:clamp(34px,5vw,48px)}.body,.steps p{font-size:17px}}
@media (max-height:560px) and (orientation:landscape){.fab span{display:none}.fab{width:48px;height:48px;padding:0;justify-content:center;font-size:20px}}
