@charset "utf-8";  :root{  --paper:#F6F5F1;  --paper-2:#EFF3F4;  --white:#FFFFFF;  --ink:#101827;  --ink-2:#3F4652;  --ink-3:#66707D;  --line:rgba(16,24,39,.10); --line-2:rgba(16,24,39,.06); --navy:#101827;  --navy-2:#1A2434; --navy-3:#232E40; --cobalt:#157A87;  --cobalt-ink:#0E5361;  --cobalt-lite:#6FC3CE;  --brand-navy:#0E5361;   --cta:#BD5924; --cta-2:#A34D1F; --cta-bright:#D86B32;  --kakao:#FEE500; --kakao-ink:#191600; --on-dark:rgba(255,255,255,.74); --on-dark-2:rgba(255,255,255,.5); --on-dark-line:rgba(255,255,255,.15); --shadow-soft:0 16px 45px rgba(16,24,39,.08); --r-s:8px; --r:12px; --r-l:16px; --wrap:1200px; --gutter:clamp(20px, 5vw, 40px); --bar-h:calc(58px + env(safe-area-inset-bottom)); --ease:cubic-bezier(.22,.61,.36,1); }  :root, [data-season="default"]{ --season-bg:#F6F5F1; --season-soft:#E8EEEE; --season-glow:rgba(60,157,163,.15); --season-accent:#157A87; } [data-season="spring"]{ --season-bg:#F5F7F0; --season-soft:#E8EEE2; --season-glow:rgba(180,205,169,.28); --season-accent:#738C68; } [data-season="summer"]{ --season-bg:#F1F8F8; --season-soft:#E1F0F1; --season-glow:rgba(103,190,197,.25); --season-accent:#177D91; } [data-season="autumn"]{ --season-bg:#F8F3EB; --season-soft:#F0E3D2; --season-glow:rgba(194,137,91,.22); --season-accent:#A85D3A; } [data-season="winter"]{ --season-bg:#F3F6F9; --season-soft:#E3EBF2; --season-glow:rgba(132,169,198,.22); --season-accent:#31587A; } *,*::before,*::after{box-sizing:border-box} html{-webkit-text-size-adjust:100%;scroll-behavior:smooth;scroll-padding-top:calc(var(--site-top, var(--hd-h, 76px)) + 12px)} body{ margin:0; background:var(--paper); color:var(--ink); font-family:'Pretendard Variable',Pretendard,-apple-system,BlinkMacSystemFont,'Apple SD Gothic Neo','Segoe UI',Roboto,sans-serif; font-size:17px; font-weight:400; line-height:1.75; letter-spacing:-.011em; -webkit-font-smoothing:antialiased; text-rendering:optimizeLegibility; word-break:keep-all; overflow-x:hidden; padding-bottom:var(--bar-h); } img{max-width:100%;height:auto;display:block} a{color:inherit;text-decoration:none} button{font:inherit;color:inherit;background:none;border:0;padding:0;cursor:pointer} ul,ol,dl,dd,figure{margin:0;padding:0;list-style:none} h1,h2,h3,p{margin:0} address{font-style:normal} table{border-collapse:collapse;width:100%} svg{width:100%;height:100%;display:block} fieldset{margin:0;padding:0;border:0;min-width:0} legend{padding:0} :focus-visible{outline:2px solid var(--cobalt);outline-offset:3px;border-radius:2px} .hero :focus-visible{outline-color:var(--cobalt-lite)} .sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden; clip:rect(0 0 0 0);white-space:nowrap;border:0} .skip{position:absolute;left:-9999px;top:0;z-index:200;background:var(--navy);color:#fff; padding:12px 18px;border-radius:0 0 var(--r-s) 0;font-size:16px} .skip:focus{left:0}  .wrap{width:100%;max-width:var(--wrap);margin-inline:auto;padding-inline:var(--gutter)} .wrap--narrow{max-width:880px} .sec{padding-block:clamp(64px, 9vw, 120px)}  .eyebrow{ font-size:14px;font-weight:600;letter-spacing:.14em;text-transform:uppercase; color:var(--ink-3);margin-bottom:18px; } .hero .eyebrow{color:var(--ink-3)} .h2{ font-size:clamp(25px, 3.6vw, 40px); font-weight:600; line-height:1.3; letter-spacing:-.035em; color:var(--ink); } .lead{ margin-top:20px;max-width:62ch; font-size:clamp(16.5px, 1.3vw, 17.5px); line-height:1.85;color:var(--ink-2);font-weight:400; } .lead b{font-weight:600;color:var(--ink)} .foot-note{ margin-top:24px;font-size:15px;line-height:1.75;color:var(--ink-3);max-width:70ch; } .foot-note a{color:var(--ink-2);text-decoration:underline;text-underline-offset:3px} .dim{color:var(--ink-3)}  .btn{ display:inline-flex;align-items:center;justify-content:center; min-height:52px;padding:0 26px;border-radius:var(--r-s); font-size:17px;font-weight:600;letter-spacing:-.01em; transition:background .2s var(--ease), color .2s var(--ease), border-color .2s var(--ease), transform .15s var(--ease); white-space:nowrap; } .btn:active{transform:translateY(1px)} .btn--cta{background:var(--cta);color:#fff} .btn--cta:hover{background:var(--cta-2)} .btn--line{border:1px solid var(--line);background:var(--bg-elevated);color:var(--ink)} .btn--line:hover{border-color:var(--ink-3);background:rgba(0,0,0,.02)} .hero .btn--onDark{border-color:var(--ink);color:var(--ink)} .hero .btn--onDark:hover{background:var(--ink);color:#fff}  .hd{ position:fixed;top:0;left:0;right:0;z-index:80; background:color-mix(in srgb, var(--bg-page) 78%, transparent); backdrop-filter:saturate(180%) blur(16px); -webkit-backdrop-filter:saturate(180%) blur(16px); border-bottom:1px solid transparent; transition:background .3s var(--ease), border-color .3s var(--ease), box-shadow .3s var(--ease); } .hd__in{display:flex;align-items:center;height:64px;gap:20px} .hd.is-scroll{ background:color-mix(in srgb, var(--bg-section) 92%, transparent); border-bottom-color:var(--line); box-shadow:0 1px 20px color-mix(in srgb, var(--text-primary) 6%, transparent); } .brand{position:relative;display:block;flex:none;height:28px;line-height:0}  .brand::after{content:'';position:absolute;inset:-8px -6px} .brand>img{height:100%;width:auto}  .brand__logo{ display:block;height:100%;aspect-ratio:626/192; background: linear-gradient(var(--brand-primary), var(--brand-primary)), linear-gradient(var(--text-primary), var(--text-primary)); -webkit-mask-image:url(../img/logo-mask-brand.png), url(../img/logo-mask-ink.png); mask-image:url(../img/logo-mask-brand.png), url(../img/logo-mask-ink.png); -webkit-mask-size:contain, contain; mask-size:contain, contain; -webkit-mask-repeat:no-repeat; mask-repeat:no-repeat; -webkit-mask-position:left center; mask-position:left center; transition:background-color .18s var(--ease); }  @supports not ((-webkit-mask-image:url(x)) or (mask-image:url(x))){ .brand__logo{background:none;-webkit-mask:none;mask:none} .brand__logo::after{content:'일선모바일';font-size:17.5px;font-weight:700;color:var(--text-primary)}} .gnb{display:none;align-items:center;gap:30px;margin-right:auto} .gnb a{ font-size:18px;font-weight:600;color:var(--ink-2); letter-spacing:-.015em;transition:color .2s var(--ease); } .gnb a:hover{color:var(--ink)} .hd__act{display:flex;align-items:center;gap:14px;margin-left:auto} .hd__tel{display:none;align-items:center;gap:7px;font-size:19px;font-weight:600; color:var(--ink-2);letter-spacing:-.01em;font-variant-numeric:tabular-nums} .hd__tel svg{width:15px;height:15px;fill:var(--cobalt-ink)} .hd .btn--cta{display:none}  .hd__menu{width:44px;height:44px;margin-right:-10px;display:grid;place-items:center;color:var(--ink)} .hd__menu svg{width:22px;height:22px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round}  .nav{position:fixed;inset:0;z-index:120} .nav[hidden]{display:none} .nav__dim{position:absolute;inset:0;background:rgba(11,19,36,.5);animation:fade .25s var(--ease)} .nav__panel{ position:absolute;top:0;right:0;bottom:0;width:min(340px,86%); background:var(--paper);padding:18px var(--gutter) calc(28px + env(safe-area-inset-bottom)); display:flex;flex-direction:column;overflow-y:auto; animation:slide .32s var(--ease); } @keyframes fade{from{opacity:0}to{opacity:1}} @keyframes slide{from{transform:translateX(100%)}to{transform:none}} .nav__top{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px} .nav__ttl{font-size:14px;font-weight:600;letter-spacing:.14em;text-transform:uppercase;color:var(--ink-3)} .nav__close{width:40px;height:40px;margin-right:-10px;display:grid;place-items:center} .nav__close svg{width:20px;height:20px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round} .nav__list li+li{border-top:1px solid var(--line-2)} .nav__list a{display:block;padding:15px 0;font-size:20px;font-weight:500;letter-spacing:-.02em} .nav__cta{display:grid;gap:9px;margin-top:26px} .nav__hours{margin-top:18px;font-size:14px;line-height:1.7;color:var(--ink-3);text-align:center} .nav__hours span{color:var(--ink-3);opacity:.8}  .hero{ position:relative;color:var(--ink);overflow:hidden; background: radial-gradient(circle at 82% 28%, var(--season-glow), transparent 34%), var(--season-bg); padding-top:calc(64px + clamp(52px, 8vw, 96px)); padding-bottom:clamp(64px, 9vw, 110px); }  .fold{ position:relative;display:block;isolation:isolate; width:100%;max-width:560px;margin-inline:auto; container-type:inline-size; } @keyframes grow{from{transform:scaleX(0)}to{transform:scaleX(1)}}  @media (max-width:899px){ .fold{width:calc(100% + (var(--gutter) - 10px) * 2);margin-inline:calc(10px - var(--gutter));max-width:none}} @media (min-width:600px) and (max-width:899px){ .fold{width:min(100%, 560px);margin-inline:auto}}  .util{border-bottom:1px solid var(--line);background:var(--paper)} .tab{ min-height:44px;padding:0 22px;border-radius:calc(var(--r) - 4px); font-size:16.5px;font-weight:500;color:var(--ink-2);letter-spacing:-.015em; transition:background .2s var(--ease), color .2s var(--ease); } .tab:hover{color:var(--ink)} .tab.is-on{background:var(--navy);color:#fff;font-weight:600}  .law{margin-top:40px;font-size:16.5px} .law th,.law td{padding:16px 14px;text-align:left;border-bottom:1px solid var(--line)} .law thead th{ font-size:15px;font-weight:600;letter-spacing:.08em;text-transform:uppercase; color:var(--ink-3);border-bottom-color:var(--ink);padding-bottom:12px; } .law tbody th{font-weight:500;color:var(--ink);letter-spacing:-.015em;width:34%} .law tbody tr:last-child th,.law tbody tr:last-child td{border-bottom:0} .dv{background:var(--season-soft);padding:26px 10px 22px;display:flex;flex-direction:column;align-items:center;text-align:center} .sec--season .dv{background:var(--white)} .dv__svg{width:auto;height:clamp(150px,22vw,190px);transition:transform .45s var(--ease)} .dv:hover .dv__svg,.dv:hover .dv__media img{transform:translateY(-6px) scale(1.03)} .bd__grid .btn{margin-top:30px} .fm{background:var(--paper);color:var(--ink);border:1px solid var(--line); border-radius:var(--r-l);padding:clamp(24px,3vw,34px)} .req{color:var(--cta);font-weight:400} .fld input.is-err{border-color:var(--cta);box-shadow:0 0 0 3px rgba(216,107,50,.16)} .chip{ min-height:44px;padding:0 16px;border-radius:var(--r-s);border:1px solid var(--line); font-size:16px;font-weight:500;color:var(--ink-2);background:var(--white); transition:.18s var(--ease); } .chip:hover{border-color:var(--ink-3);color:var(--ink)} .chip.is-on{background:var(--navy);border-color:var(--navy);color:#fff;font-weight:600} .agree{display:flex;align-items:flex-start;gap:10px;margin:6px 0 22px; font-size:15px;color:var(--ink-2);line-height:1.7;cursor:pointer} .agree input{width:18px;height:18px;margin:2px 0 0;accent-color:var(--cobalt);flex:none} .agree a{color:var(--ink);text-decoration:underline;text-underline-offset:3px} .fm__msg.ok{color:#1B7A46} .fm__msg.err{color:var(--cta-2)}  .rv{margin-top:44px;display:grid;gap:1px;background:var(--line-2); border-block:1px solid var(--line-2)} .rv__item{background:var(--paper);padding:28px 24px} .rv__tx{font-size:17px;line-height:1.85;letter-spacing:-.015em} .rv__by{margin-top:16px;font-size:14px;color:var(--ink-3)} .rv__by span{margin-left:8px;padding-left:8px;border-left:1px solid var(--line)}  .fq{margin-top:40px;border-top:1px solid var(--line)} .fq__item{border-bottom:1px solid var(--line-2)} .fq__q{ width:100%;display:flex;align-items:flex-start;gap:16px;text-align:left; padding:22px 2px;font-size:17px;font-weight:500;letter-spacing:-.022em;line-height:1.55; } .fq__q span{flex:1} .fq__q::after{ content:'';flex:none;width:11px;height:11px;margin-top:7px; border-right:1.5px solid var(--ink-3);border-bottom:1.5px solid var(--ink-3); transform:rotate(45deg);transition:transform .28s var(--ease); } .fq__item.is-on .fq__q::after{transform:rotate(-135deg)} .fq__item.is-on .fq__q{color:var(--ink);font-weight:600} .fq__a{max-height:0;overflow:hidden;transition:max-height .32s var(--ease)} .fq__a p{padding:0 30px 24px 2px;font-size:16.5px;line-height:1.85;color:var(--ink-2)}  .st__grid{display:grid;gap:clamp(36px,5vw,72px)} .st__btns{display:flex;gap:9px;margin-top:30px;flex-wrap:wrap} .st{border-top:1px solid var(--line)} .st>div{display:grid;grid-template-columns:88px 1fr;gap:16px; padding:16px 0;border-bottom:1px solid var(--line-2);align-items:baseline} .st dt{font-size:15.5px;color:var(--ink-3);font-weight:500} .st dd{font-size:16.5px;letter-spacing:-.015em;line-height:1.65} .st dd a{border-bottom:1px solid var(--line);padding-bottom:1px;font-variant-numeric:tabular-nums}  .ft{background:var(--navy);color:var(--on-dark-2);padding-block:clamp(48px,6vw,72px)} .ft__top{display:flex;flex-wrap:wrap;gap:22px;justify-content:space-between;align-items:center; padding-bottom:28px;border-bottom:1px solid var(--on-dark-line)} .ft__mark{display:flex;align-items:center;gap:16px;margin-top:28px;padding:16px; border:1px solid var(--on-dark-line);border-radius:var(--r);max-width:420px} .ft__mark img{width:64px;height:auto;background:#fff;border-radius:6px;padding:4px} .ft__mark p{font-size:15px;line-height:1.65;color:var(--on-dark)} .ft__biz{display:flex;flex-wrap:wrap;gap:6px 20px;margin-top:30px;font-size:15px;line-height:1.9} .ft__biz a{border-bottom:1px solid var(--on-dark-line)} .ft__legal{margin-top:22px;font-size:15px;line-height:1.75;color:rgba(255,255,255,.34);max-width:78ch} .ft__copy{margin-top:20px;font-size:13.5px;letter-spacing:.06em;color:rgba(255,255,255,.34)}  .bar{ position:fixed;left:0;right:0;bottom:0;z-index:70;display:grid; grid-template-columns:1fr 1fr 1.35fr; background:rgba(247,246,242,.94); backdrop-filter:saturate(180%) blur(14px); -webkit-backdrop-filter:saturate(180%) blur(14px); border-top:1px solid var(--line); padding-bottom:env(safe-area-inset-bottom); } .bar__i{ height:58px;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px; font-size:13px;font-weight:500;color:var(--ink-2);letter-spacing:-.01em; } .bar__i svg{width:19px;height:19px;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linejoin:round} .bar__i+.bar__i{box-shadow:inset 1px 0 0 var(--line-2)} .bar__i--cta{background:var(--cta);color:#fff;font-size:16.5px;font-weight:600;box-shadow:none} .bar__i--cta+.bar__i,.bar__i--cta{box-shadow:none}  .reveal{opacity:0;transform:translateY(16px); transition:opacity .7s var(--ease), transform .7s var(--ease)} .reveal.is-in{opacity:1;transform:none} @media (prefers-reduced-motion:reduce){ *,*::before,*::after{animation-duration:.01ms!important;animation-iteration-count:1!important; transition-duration:.01ms!important;scroll-behavior:auto!important} .reveal{opacity:1;transform:none}}  @media (min-width:600px){ .rv{grid-template-columns:repeat(2,1fr)}} @media (min-width:900px){ body{padding-bottom:0} .bar{display:none} .hd__in{height:76px} .brand{height:34px} .gnb{display:flex;margin-left:38px} .hd__tel{display:flex} .hd .btn--cta{display:inline-flex} .hd__menu{display:none} .hero{padding-top:calc(76px + clamp(60px,6vw,92px)); min-height:clamp(600px, 88vh, 920px); display:flex;align-items:center} .fold{margin-inline:auto 0} .st__grid{grid-template-columns:1fr 1fr;align-items:start} .rv{grid-template-columns:repeat(4,1fr)} .fq__q{padding:26px 2px;font-size:17.5px} .law{font-size:16.5px} .law th,.law td{padding:20px 16px}} @media (min-width:1280px){ :root{--wrap:1240px}}  .doc{max-width:820px;margin-inline:auto;padding:calc(var(--site-top, var(--hd-h, 76px)) + clamp(20px,4vw,44px)) var(--gutter) clamp(64px,8vw,100px)} .doc h1{font-size:clamp(26px,3.4vw,34px);font-weight:600;letter-spacing:-.035em;line-height:1.3} .doc__date{margin-top:10px;margin-bottom:40px;font-size:14px;color:var(--ink-3)} .doc h2{font-size:17.5px;font-weight:600;letter-spacing:-.025em;margin:38px 0 12px} .doc p,.doc li{font-size:16.5px;line-height:1.85;color:var(--ink-2)} .doc ul{list-style:disc;padding-left:20px;margin:8px 0} .doc ol{list-style:decimal;padding-left:20px;margin:8px 0} .doc table{margin:12px 0;font-size:16px} .doc th,.doc td{border-bottom:1px solid var(--line);padding:12px 10px;text-align:left;vertical-align:top} .doc th{font-weight:600;color:var(--ink);width:30%} .doc td{color:var(--ink-2)} .doc .back{display:inline-flex;align-items:center;gap:8px;margin-top:44px; font-size:16.5px;font-weight:500;color:var(--ink); border-bottom:1px solid var(--line);padding-bottom:3px} .tier{display:grid;gap:10px;padding:26px 4px;border-bottom:1px solid var(--line-2)} @media (min-width:900px){ .tier{grid-template-columns:1fr 1fr;gap:32px;align-items:start;padding:30px 6px}}
