:root{
  --pink:#E6007E; --pink2:#FF2E98; --pink-soft:#FFDEEE;
  --violet:#6639EE; --lav:#F2F2FD; --ivory:#F4F4ED;
  --ink:#111; --ink2:#363636; --mute:#666; --line:#E8E8EE;
  --dark:#323232; --bg:#fff;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{margin:0;background:var(--bg);color:var(--ink);font-family:Pretendard,"Apple SD Gothic Neo","Malgun Gothic",sans-serif;font-size:17px;line-height:1.55;word-break:keep-all}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:1180px;margin:0 auto;padding-inline:20px}
b,strong{font-weight:800}
.lt{font-weight:400}
:focus-visible{outline:3px solid var(--violet);outline-offset:2px}

/* 맨 위 혜택 띠 */
.strip{background:var(--pink);color:#fff;text-align:center;font-weight:800;font-size:18px;padding:14px 16px}
.strip{position:relative;padding-right:200px;padding-left:200px}
.strip-x{position:absolute;right:16px;top:50%;transform:translateY(-50%);display:flex;align-items:center;gap:8px;background:none;border:0;color:#fff;font:inherit;font-size:14px;font-weight:600;cursor:pointer;opacity:.92}
.strip-x b{font-size:24px;line-height:1;font-weight:400}
.strip.hide{display:none}
@media (max-width:900px){.strip{padding:12px 44px 12px 14px;font-size:15px;text-align:left}.strip-x span{display:none}.strip-x{right:8px}}
.strip em{font-style:normal;background:#fff;color:var(--pink);border-radius:999px;padding:2px 10px;margin-right:8px;font-size:14px;vertical-align:2px}

/* 머리글 */
header{position:sticky;top:0;z-index:20;background:rgba(255,255,255,.96);backdrop-filter:blur(6px);border-bottom:1px solid var(--line)}
.hd{display:flex;align-items:center;gap:14px;height:70px}
.brand{display:flex;align-items:center;gap:10px}
.brand img{height:32px;width:auto}
.brand span{font-size:22px;font-weight:800;color:#555;letter-spacing:-.02em}
.nav{display:flex;gap:28px;margin-left:auto;font-weight:700;font-size:17px}
.nav{align-items:center}
.dd{position:relative}
.dd-b,.nav-a{font:inherit;font-weight:700;color:inherit;background:none;border:0;cursor:pointer;padding:8px 2px}
.dd-b::after{content:"";display:inline-block;width:7px;height:7px;border:solid currentColor;border-width:0 2px 2px 0;transform:rotate(45deg);margin:0 0 4px 8px}
.dd-b:hover,.nav-a:hover,.dd.open .dd-b{color:var(--pink)}
.dd-m{position:absolute;top:calc(100% + 10px);left:-14px;min-width:250px;background:#fff;border:1px solid var(--line);border-radius:14px;box-shadow:0 16px 40px rgba(30,20,70,.14);padding:8px;display:none;z-index:40}
.dd.open .dd-m{display:grid}
.dd-m button{font:inherit;font-size:16px;font-weight:600;text-align:left;background:none;border:0;border-radius:10px;padding:11px 12px;cursor:pointer;color:var(--ink)}
.dd-m button:hover{background:var(--lav);color:var(--pink)}
.hd-tel{margin-left:18px;background:var(--pink);color:#fff;font-weight:800;border-radius:999px;padding:9px 18px;font-size:17px;white-space:nowrap}

/* 첫 화면 */
.hero{background:linear-gradient(100deg,#FBEAF5 0%,#EFE9FF 60%,#E6F0FF 100%)}
.hstage{display:grid;grid-template-columns:1.1fr .9fr;gap:36px;align-items:center;padding-block:48px}
.hstage.wide{grid-template-columns:1.7fr 1fr;gap:32px}
.hstage.wide .hmedia{order:-1}
.hstage.wide h1{font-size:34px}.hstage.wide h1 .lt{font-size:23px}
.hstage.wide .htext p{font-size:16px}
.hmedia{position:relative;border-radius:22px;overflow:hidden;box-shadow:0 22px 54px rgba(102,57,238,.22);aspect-ratio:16/9;background:#0b1a3a}
.hmedia video{width:100%;height:100%;object-fit:cover;display:block}
.snd{position:absolute;right:12px;bottom:12px;font:inherit;font-size:13px;font-weight:700;border:0;border-radius:999px;padding:7px 12px;background:rgba(255,255,255,.92);cursor:pointer}
.hero h1{margin:0 0 14px;font-size:44px;line-height:1.25;letter-spacing:-.03em;text-wrap:balance}
.hero h1 .lt{display:block;font-size:30px;color:var(--ink2)}
.hero h1 b{color:var(--pink)}
.hero p{margin:0 0 24px;color:var(--ink2);font-size:18px}
.gift{display:inline-flex;align-items:center;gap:12px;background:#fff;border:2px solid var(--pink);border-radius:16px;padding:14px 18px;margin-bottom:22px;box-shadow:0 8px 24px rgba(230,0,126,.12)}
.gift .t{font-size:13px;color:var(--pink);font-weight:800}
.gift .n{font-size:26px;font-weight:900;letter-spacing:-.02em}
.gift .n small{font-size:16px;font-weight:800;color:var(--violet)}
.gift .g{font-size:12px;font-weight:800;color:#fff;background:var(--violet);border-radius:8px;padding:6px 8px;line-height:1.2;text-align:center}
.cta{display:flex;gap:10px;flex-wrap:wrap}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;border-radius:12px;padding:15px 22px;font-weight:800;font-size:16px;border:2px solid var(--pink)}
.btn.fill{background:var(--pink);color:#fff}
.btn.line{background:#fff;color:var(--pink)}
.hero-pic{position:relative;border-radius:24px;overflow:hidden;aspect-ratio:4/3.4;box-shadow:0 20px 50px rgba(102,57,238,.18)}
.hero-pic img{width:100%;height:100%;object-fit:cover}
.hero-pic .shorts{position:absolute;inset:0}
.hero-pic .tag{z-index:4;position:absolute;left:14px;bottom:14px;background:rgba(255,255,255,.92);border-radius:10px;padding:8px 12px;font-size:13px;font-weight:700}

/* 상품 아이콘 줄 */
.cats{display:grid;grid-template-columns:repeat(6,1fr);gap:8px;padding-block:28px;border-bottom:1px solid var(--line)}
.cat{display:flex;flex-direction:column;align-items:center;gap:10px;font-weight:800;font-size:18px;cursor:pointer;background:none;border:0;font-family:inherit;color:inherit;padding:8px 4px;border-radius:14px}
.cat:hover{background:var(--lav)}
.ic{width:124px;height:124px;border-radius:30px;display:grid;place-items:center;background:linear-gradient(145deg,#F4EEFF,#FFE6F3)}
.ic svg{width:66px;height:66px}
.dev{width:124px;height:124px;border-radius:30px;display:grid;place-items:center;background:linear-gradient(145deg,#F4EEFF,#FFE6F3)}
.dev img{width:110px;height:110px;object-fit:contain;filter:drop-shadow(0 6px 8px rgba(60,30,120,.18))}
.set .dev{width:72px;height:72px;border-radius:18px}.set .dev img{width:62px;height:62px}

/* 섹션 공통 */
section{padding-block:72px}
.sec-h{margin:0 0 28px;font-size:32px;letter-spacing:-.03em;line-height:1.3;text-wrap:balance}
.sec-h .dot{color:var(--pink)}
.bg-ivory{background:var(--ivory)}
.bg-lav{background:var(--lav)}

/* 약속 4가지 */
.promise{display:grid;grid-template-columns:repeat(2,1fr);gap:18px}
.pcard{background:#fff;border-radius:20px;padding:22px}
.pcard .ph{border-radius:14px;overflow:hidden;aspect-ratio:16/8;margin-bottom:16px;position:relative}
.pcard .ph .shorts{position:absolute;inset:0}
.pcard .ph img{width:100%;height:100%;object-fit:cover}
.pcard h3{margin:0 0 8px;font-size:21px;font-weight:400;letter-spacing:-.02em}
.pcard p{margin:0;color:var(--mute);font-size:15px}

/* 결합상품 */
.combo{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.ccard{background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px 22px;display:flex;flex-direction:column;gap:14px}
.ccard h3{margin:0;text-align:center;font-size:20px}
.ccard .best{align-self:center;background:var(--pink);color:#fff;font-size:12px;font-weight:800;border-radius:999px;padding:3px 10px;margin-top:-6px}
.set{display:flex;justify-content:center;align-items:flex-start;gap:6px}
.set .it{display:flex;flex-direction:column;align-items:center;gap:6px;font-size:13px;text-align:center;width:72px;line-height:1.3}
.set .plus{color:#bbb;font-size:22px;margin-top:14px}
.price{border-top:1px solid var(--line);padding-top:14px;text-align:right}
.price .lbl{font-size:13px;color:var(--mute)}
.price .v{font-size:28px;font-weight:900;color:var(--pink);font-variant-numeric:tabular-nums}
.price .v small{font-size:16px;color:var(--ink)}
.price .vat{font-size:12px;color:var(--mute)}
.bonus{display:flex;align-items:center;gap:10px;background:var(--lav);border-radius:12px;padding:10px 12px;font-size:14px}
.bonus .b5{flex:none;background:var(--violet);color:#fff;font-weight:900;border-radius:8px;padding:6px 8px;font-size:13px}
.bonus b{color:var(--pink)}
.ccard .cta .btn{flex:1;padding:12px 10px;font-size:15px}

/* 혜택 3칸 */
.perks{display:grid;grid-template-columns:repeat(3,1fr);gap:18px}
.perk{border-radius:20px;padding:28px 24px;color:#fff;min-height:200px;display:flex;flex-direction:column;gap:8px}
.perk h3{margin:0;font-size:26px;letter-spacing:-.02em}
.perk p{margin:0;opacity:.92}
.perk .big{margin-top:auto;font-size:30px;font-weight:900}
.p1{background:linear-gradient(140deg,#7A4BFF,#5228D8)}
.p2{background:linear-gradient(140deg,#4E58E6,#3442C6)}
.p3{background:linear-gradient(140deg,#C21A86,#8E1B9E)}

/* 현장 사례 */
.cases{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}
.case{border-radius:18px;overflow:hidden;background:var(--dark);color:#fff}
.case .ph{aspect-ratio:4/3;overflow:hidden}
.case .ph img{width:100%;height:100%;object-fit:cover}
.case .tx{padding:16px 18px 20px}
.case .chip{display:inline-block;background:var(--violet);border-radius:6px;font-size:12px;font-weight:700;padding:3px 8px;margin-bottom:8px}
.case h3{margin:0;font-size:18px;line-height:1.4}

/* 상담 */
.ask{display:grid;grid-template-columns:1fr 1fr;gap:28px;align-items:start}
.ask h2{margin:0 0 10px}
.ask .tel{font-size:44px;font-weight:900;color:var(--pink);letter-spacing:-.02em;font-variant-numeric:tabular-nums}
.ask .hr{color:var(--mute)}
form{background:#fff;border-radius:20px;padding:24px;display:grid;gap:12px;border:1px solid var(--line)}
label{font-size:14px;font-weight:700}
input,select{width:100%;font:inherit;padding:12px 14px;border:1px solid #D5D5DE;border-radius:10px;background:#fff}
.agree{display:flex;gap:8px;align-items:flex-start;font-size:13px;color:var(--mute);font-weight:400}
.agree input{width:auto;margin-top:3px}

/* 분홍 상담 띠 + 맨 아래 */
.callbar{background:var(--pink);color:#fff}
.callbar .wrap{display:flex;align-items:center;justify-content:space-between;gap:16px;padding-block:22px;flex-wrap:wrap}
.callbar .l{display:flex;align-items:center;gap:12px;font-weight:700;font-size:18px}
.callbar .l img{height:26px}
.callbar .r{text-align:right}
.callbar .r a{font-size:36px;font-weight:900;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.callbar .r div{font-size:14px;opacity:.9}
footer{background:#5E5E5E;color:#E4E4E4;font-size:14px}
footer .wrap{padding-block:30px;display:grid;gap:8px}
footer img{height:30px;width:auto;margin-bottom:6px}
footer .biz{color:#fff;font-weight:700}
footer .note{color:#C8C8C8;font-size:12px}


/* 쇼츠식 사진 넘김 */
.shorts{position:relative;overflow:hidden;background:#222}
.shorts img{position:absolute;inset:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .7s}
.shorts img.on{opacity:1}
.shorts .bars{position:absolute;left:10px;right:10px;top:10px;z-index:3;display:flex;gap:4px}
.shorts .bars i{flex:1;height:3px;border-radius:2px;background:rgba(255,255,255,.4);overflow:hidden}
.shorts .bars i b{display:block;height:100%;width:0;background:#fff}
.shorts .bars i.done b{width:100%}
.shorts .cap{position:absolute;left:0;right:0;bottom:0;z-index:3;padding:40px 16px 16px;color:#fff;background:linear-gradient(transparent,rgba(0,0,0,.72))}
@media (prefers-reduced-motion:no-preference){
  .shorts img.on{animation:kb 3.6s ease-out forwards}
  .shorts img.on.alt{animation-name:kb2}
  .shorts .bars i.now b{animation:fill 3.4s linear forwards}
}
@keyframes kb{from{transform:scale(1.03)}to{transform:scale(1.16) translate(-2%,-1.5%)}}
@keyframes kb2{from{transform:scale(1.16) translate(2%,1%)}to{transform:scale(1.03)}}
@keyframes fill{from{width:0}to{width:100%}}
.reels{display:grid;grid-template-columns:repeat(4,1fr);gap:14px}
.reel{border-radius:18px;aspect-ratio:9/16}
.reel .chip{display:inline-block;background:var(--violet);border-radius:6px;font-size:12px;font-weight:700;padding:3px 8px;margin-bottom:6px}
.reel h3{margin:0;font-size:17px;line-height:1.4}

/* 사무실 전화 상자 펼침 */
.pbox{background:#fff;border:1px solid var(--line);border-radius:20px;padding:24px 22px;cursor:pointer;outline:none;transition:border-color .2s,box-shadow .2s}
.pbox h3{margin:0 0 6px;font-size:21px;display:flex;justify-content:space-between;align-items:center}
.pbox h3 span{font-size:13px;color:var(--violet);font-weight:700}
.pbox .v{font-size:30px;font-weight:900;color:var(--pink);font-variant-numeric:tabular-nums}
.pbox .v small{font-size:16px;color:var(--ink)}
.pbox .s{font-size:14px;color:var(--mute)}
.pbox .more{display:grid;grid-template-rows:0fr;transition:grid-template-rows .3s}
.pbox .more>div{overflow:hidden}
.pbox ul{margin:14px 0 0;padding:14px 0 0;border-top:1px solid var(--line);list-style:none;display:grid;gap:8px;font-size:15px}
.pbox li::before{content:"✓";color:var(--pink);font-weight:900;margin-right:8px}
.pbox:hover,.pbox:focus-within,.pbox:focus{border-color:var(--pink);box-shadow:0 10px 28px rgba(230,0,126,.14)}
.pbox:hover .more,.pbox:focus .more,.pbox:focus-within .more{grid-template-rows:1fr}
.pbox:hover h3 span,.pbox:focus h3 span{visibility:hidden}
@media (max-width:900px){.reels{grid-template-columns:repeat(2,1fr)}}


/* 팝업 */
dialog.pop{border:0;padding:0;border-radius:22px;width:min(720px,calc(100vw - 24px));max-height:calc(100vh - 40px);box-shadow:0 30px 80px rgba(20,10,60,.35);color:var(--ink)}
dialog.pop::backdrop{background:rgba(20,14,40,.55)}
.pop-h{position:sticky;top:0;z-index:2;display:flex;align-items:center;justify-content:space-between;gap:12px;padding:18px 22px;background:#fff;border-bottom:1px solid var(--line)}
.pop-h h2{margin:0;font-size:22px;letter-spacing:-.02em}
.pop-x{width:40px;height:40px;border:0;border-radius:12px;background:var(--lav);font-size:22px;cursor:pointer;line-height:1}
.pop-b{padding:20px 22px 8px;display:grid;gap:16px}
.pop-b p{margin:0;color:var(--ink2)}
.pop-b .note{font-size:13px;color:var(--mute)}
.pt{width:100%;border-collapse:collapse;font-size:15px;font-variant-numeric:tabular-nums}
.pt th,.pt td{padding:10px 8px;border-bottom:1px solid var(--line);text-align:left}
.pt th{font-size:13px;color:var(--mute);font-weight:700}
.pt td.n{text-align:right;font-weight:800;color:var(--pink);white-space:nowrap}
.pt tr.hl td{background:#FFF3F9}
.pop-f{position:sticky;bottom:0;display:flex;gap:10px;padding:14px 22px 18px;background:#fff;border-top:1px solid var(--line)}
.pop-f .btn{flex:1;padding:13px 10px}
.pop-vid{border-radius:14px;overflow:hidden;aspect-ratio:16/9;background:#0b1a3a}.pop-vid video{width:100%;height:100%;display:block;object-fit:cover}
.devrow{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.devrow figure{margin:0;background:var(--lav);border-radius:14px;padding:12px;text-align:center;font-size:14px;font-weight:700}
.devrow img{width:100%;height:110px;object-fit:contain}
.chk{margin:0;padding:0;list-style:none;display:grid;gap:8px}
.chk li::before{content:"✓";color:var(--pink);font-weight:900;margin-right:8px}
.mm{display:grid;gap:6px}.mm b{font-size:13px;color:var(--mute);margin-top:6px}
.mm button{font:inherit;font-size:17px;font-weight:700;text-align:left;border:0;background:var(--lav);border-radius:12px;padding:14px 16px;cursor:pointer}
@media (max-width:420px){.devrow{grid-template-columns:1fr 1fr}.pt{font-size:14px}}


/* 상품 고르기 (본사식 카드) */
.tabs{display:flex;gap:8px;flex-wrap:wrap;margin-bottom:22px}
.tabs button{font:inherit;font-size:16px;font-weight:700;border:1px solid var(--line);background:#fff;border-radius:999px;padding:10px 20px;cursor:pointer;color:var(--ink2)}
.tabs button.on{background:#5E5E66;border-color:#5E5E66;color:#fff}
.tp{display:none}.tp.on{display:block}
.ban{display:grid;grid-template-columns:1.2fr 1fr;border-radius:20px;overflow:hidden;background:#3A3536;color:#fff;margin-bottom:22px;min-height:220px}
.ban-t{padding:30px 34px;display:flex;flex-direction:column;justify-content:center;gap:14px}
.ban-t h3{margin:0;font-size:28px;letter-spacing:-.02em;text-wrap:balance}
.ban-t ul{margin:0;padding:0;list-style:none;display:grid;gap:10px;font-size:16px}
.ban-t li::before{content:"";display:inline-block;width:22px;height:22px;border-radius:7px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12l4 4 8-8' stroke='%236639EE' stroke-width='3' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") center/16px no-repeat;vertical-align:-5px;margin-right:10px}
.ban-i{background-size:cover;background-position:center;position:relative}
.ban-i::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,#3A3536,rgba(58,53,54,0) 45%)}
.tp[data-panel="iptv"] .ban-i{background-size:55%;background-repeat:no-repeat;background-color:#2B2627}
.cards{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.tp[data-panel="cctv"] .cards{grid-template-columns:repeat(3,1fr)}
.tp[data-panel="iptv"] .cards{grid-template-columns:repeat(3,1fr)}
.pcd{background:#fff;border:1px solid var(--line);border-radius:22px;padding:24px 20px 20px;display:flex;flex-direction:column;gap:12px;position:relative}
.pcd:hover{border-color:var(--pink);box-shadow:0 12px 30px rgba(230,0,126,.12)}
.tg{display:flex;gap:4px;min-height:22px}
.tg i{font-style:normal;font-size:12px;font-weight:800;color:#fff;border-radius:999px;padding:3px 9px}
.t-a{background:#3D6BE6}.t-b{background:#E2231A}.t-c{background:#7A3FE4}.t-d{background:#0F8A6A}
.pcd h4{margin:0;font-size:22px;letter-spacing:-.02em}
.pcd .ds{margin:0;font-size:15px;color:var(--ink2);min-height:46px}
.ft{margin:0;padding:14px;list-style:none;background:#F7F7FA;border-radius:14px;display:grid;gap:9px;font-size:14px;font-weight:600}
.ft li{display:flex;gap:8px}.ft li::before{content:"●";color:var(--pink);font-size:9px;margin-top:5px}
.pr{margin-top:auto;display:flex;align-items:baseline;flex-wrap:wrap;gap:6px 8px}
.pr .lb{width:100%;font-size:13px;color:var(--mute)}
.pr .was{font-size:13px;color:var(--mute);text-decoration:line-through;order:2}
.pr b{font-size:24px;color:var(--pink);font-variant-numeric:tabular-nums}
.pcd .cta{display:grid;grid-template-columns:1fr 1fr;gap:8px}.pcd .cta .btn{padding:11px 6px;font-size:14px}
.vat{margin:14px 2px 0;font-size:13px;color:var(--mute)}
/* 직접 고르기 */
.bgrp{margin-top:26px}
.bgrp h3{display:flex;align-items:center;justify-content:space-between;gap:12px;margin:0 0 14px;padding-bottom:12px;border-bottom:1px solid #CFCFD8;font-size:21px}
.bgrp h3 small{display:flex;align-items:center;gap:8px;font-size:15px;font-weight:700}
.qty{width:32px;height:32px;border-radius:9px;border:1px solid #CFCFD8;background:#fff;font-size:18px;cursor:pointer}
.ops{display:grid;grid-template-columns:repeat(auto-fill,minmax(190px,1fr));gap:12px}
.op{position:relative;background:#fff;border:2px solid transparent;border-radius:16px;padding:16px 16px 14px;display:flex;flex-direction:column;gap:6px;cursor:pointer;min-height:132px;box-shadow:0 2px 8px rgba(30,20,70,.05)}
.op input{position:absolute;top:16px;right:16px;width:20px;height:20px;accent-color:var(--pink)}
.op .nm{font-weight:800;font-size:17px;padding-right:28px;line-height:1.3}
.op .pz{margin-top:auto;display:grid;grid-template-columns:auto 1fr;align-items:end;gap:0 8px;font-size:13px;color:var(--mute)}
.op .pz s{grid-column:1/-1;text-align:right}
.op .pz b{text-align:right;font-size:18px;color:var(--ink);font-variant-numeric:tabular-nums}
.op.sel{border-color:var(--pink)}
.op-none .nm{color:var(--mute)}
.xdc{margin-top:30px;display:grid;grid-template-columns:1fr 1fr;gap:16px}
.xd-col{display:grid;gap:16px}
.xd{display:flex;align-items:flex-start;gap:12px;background:#EFEFF3;border:2px solid transparent;border-radius:20px;padding:22px 24px;cursor:pointer}
.xd.sel{border-color:var(--pink);background:#fff}
.xd input{position:absolute;opacity:0;width:1px;height:1px}
.xd .ck{flex:none;width:30px;height:30px;border-radius:50%;border:2px solid #B9B9C4;display:grid;place-items:center;background:#fff}
.xd .ck::after{content:"";width:10px;height:6px;border:solid #B9B9C4;border-width:0 0 2px 2px;transform:rotate(-45deg) translate(1px,-1px)}
.xd.sel .ck{border-color:var(--pink);background:var(--pink)}.xd.sel .ck::after{border-color:#fff}
.xd input:focus-visible+.ck{outline:3px solid var(--violet);outline-offset:2px}
.xd .xt{display:grid;gap:10px;font-size:17px}.xd .xt b{font-weight:700}.xd small{font-size:14px;color:var(--mute);font-weight:400}
.cardrow{display:flex;gap:16px;align-items:center}
.cardimg{flex:none;width:104px;height:66px;border-radius:8px;background:linear-gradient(135deg,#4B3F9E,#2E2774);color:#fff;font-size:10px;display:flex;flex-direction:column;justify-content:center;align-items:center;gap:4px;box-shadow:0 4px 10px rgba(46,39,116,.3)}
.cardimg i{font-style:normal;font-weight:800;font-size:11px;align-self:flex-end;margin-right:8px}
.cardrow .cn{display:block;font-weight:600;padding-bottom:8px;border-bottom:1px solid #CFCFD8;margin-bottom:8px}
.sum{margin-top:16px;background:#fff;border-radius:20px;padding:24px;display:grid;grid-template-columns:repeat(4,1fr);gap:0;border:1px solid var(--line)}
.sum .col{padding:0 18px;border-left:1px solid var(--line)}.sum .col:first-child{border-left:0;padding-left:0}
.sum .hd{display:flex;justify-content:space-between;font-weight:700}.sum .hd b{font-size:20px;font-variant-numeric:tabular-nums}
.sum .ln{margin-top:10px;display:grid;gap:6px;font-size:14px;color:var(--mute)}
.sum .ln div{display:flex;justify-content:space-between;gap:8px}
.sum .tot{grid-column:1/-1;margin-top:20px;padding-top:18px;border-top:1px solid var(--line);display:flex;justify-content:flex-end;align-items:baseline;gap:16px;font-weight:700}
.sum .tot b{font-size:30px;color:var(--pink);font-variant-numeric:tabular-nums}
.bcta{justify-content:center;margin-top:18px}
@media (max-width:900px){
  .ban{grid-template-columns:1fr}.ban-i{min-height:160px;order:-1}.ban-i::before{background:linear-gradient(0deg,#3A3536,rgba(58,53,54,0) 60%)}
  .ban-t{padding:22px}.ban-t h3{font-size:22px}
  .cards,.tp[data-panel="cctv"] .cards,.tp[data-panel="iptv"] .cards{grid-template-columns:1fr 1fr}
  .sum{grid-template-columns:1fr;gap:16px}.sum .col{border-left:0;padding:0}
  .xdc{grid-template-columns:1fr}.cardrow{flex-direction:column;align-items:flex-start}
}
@media (max-width:560px){.cards,.tp[data-panel="cctv"] .cards,.tp[data-panel="iptv"] .cards{grid-template-columns:1fr}.ops{grid-template-columns:1fr 1fr}}

/* 휴대폰 하단 고정 버튼 */
.mbar{display:none}
.hd-menu{display:none;margin-left:auto;width:44px;height:44px;border:0;border-radius:12px;background:var(--lav);cursor:pointer;flex-direction:column;justify-content:center;align-items:center;gap:5px}
.hd-menu span{width:20px;height:2px;background:var(--ink);border-radius:2px}

@media (max-width:900px){
  .nav{display:none}
  .hd-menu{display:flex}
  .hstage,.hstage.wide{grid-template-columns:1fr;padding-block:28px}
  .hstage .hmedia,.hstage.wide .hmedia{order:2;aspect-ratio:9/16;max-height:78vh;margin-inline:auto;width:min(100%,420px)}
  .gift .n small{display:block;margin-top:2px}
  .hero h1{font-size:32px}.hero h1 .lt{font-size:22px}
  .cats{grid-template-columns:repeat(3,1fr)}
  .promise,.combo,.perks,.cases,.ask{grid-template-columns:1fr}
  section{padding-block:48px}
  .sec-h{font-size:25px}
  .callbar .r{text-align:left}
  .hd-tel{display:none}
  .mbar{display:grid;grid-template-columns:1fr 1fr;position:fixed;left:0;right:0;bottom:0;z-index:30;box-shadow:0 -4px 16px rgba(0,0,0,.12)}
  .mbar a{padding:15px 8px;text-align:center;font-weight:800}
  .mbar .a1{background:#fff;color:var(--pink)}.mbar .a2{background:var(--pink);color:#fff}
  body{padding-bottom:54px}
}
@media (max-width:420px){
  .gift .n small{display:block;margin-top:2px}
  .brand span{font-size:17px}.brand img{height:26px}
  .gift .n{font-size:22px}
  .set .it{width:60px;font-size:12px}
}
@media (prefers-reduced-motion:no-preference){.btn,.cat{transition:background .15s,transform .15s}.btn:hover{transform:translateY(-1px)}}

/* ===== 띠 ===== */
.strip-t{display:inline-flex;align-items:center;justify-content:center;flex-wrap:wrap;gap:6px 10px;line-height:1.35}
.strip em{margin-right:0}
.vchs{display:inline-flex;gap:4px}
.vchs i{font-style:normal;background:#fff;color:var(--pink);font-size:11px;font-weight:900;border-radius:4px;padding:3px 6px;line-height:1;position:relative;box-shadow:0 1px 0 rgba(0,0,0,.18)}
.vchs i::before,.vchs i::after{content:"";position:absolute;top:50%;width:5px;height:5px;margin-top:-2.5px;border-radius:50%;background:var(--pink)}
.vchs i::before{left:-3px}.vchs i::after{right:-3px}
.strip b{color:#FFF1A8}
.strip-x{right:46px;font-weight:800;opacity:1;text-shadow:0 1px 2px rgba(0,0,0,.4)}
/* ===== 메뉴 (마우스를 올리면 열린다) ===== */
.dd-b,.nav-a{display:inline-block}
.dd-m{display:grid;visibility:hidden;opacity:0;pointer-events:none;transform:translateY(4px);transition:opacity .15s,transform .15s,visibility .15s;min-width:330px;gap:2px}
.dd-m::before{content:"";position:absolute;left:0;right:0;top:-14px;height:14px}
.dd.open .dd-m{display:grid;visibility:visible;opacity:1;pointer-events:auto;transform:none}
@media (hover:hover){.dd:hover .dd-m,.dd:focus-within .dd-m{visibility:visible;opacity:1;pointer-events:auto;transform:none}.dd:hover .dd-b{color:var(--pink)}}
.dd-m a{display:grid;gap:2px;border-radius:10px;padding:10px 12px;color:var(--ink)}
.dd-m a b{font-size:16px;font-weight:800}
.dd-m a small{font-size:13px;color:var(--mute);font-weight:500;line-height:1.35}
.dd-m a:hover,.dd-m a:focus-visible{background:var(--lav)}.dd-m a:hover b{color:var(--pink)}
.nav-a[aria-current],.dd-b[aria-current]{color:var(--pink)}
.mnav{background:#fff;border-bottom:1px solid var(--line);box-shadow:0 12px 24px rgba(30,20,70,.08)}
.mnav .wrap{display:grid;padding-block:8px 16px}
.mnav a{padding:12px 4px 12px 16px;font-size:16px;border-bottom:1px solid #F1F1F5}
.mnav a.mn-h{padding-left:4px;font-weight:800;font-size:17px;color:var(--ink)}
a.cat{text-decoration:none}
/* ===== 카드 가격 칸 ===== */
.pr-v{display:grid;gap:8px;align-items:stretch}
.vch{display:flex;align-items:center;gap:10px;background:#FFF3F9;border-radius:12px;padding:8px 10px;font-size:14px;font-weight:700;line-height:1.3}
.vch img{width:64px;height:32px;flex:none}.vch b{color:var(--pink)}
.gw{font-size:13px;font-weight:800;color:var(--violet)}
.pp{display:flex;align-items:baseline;gap:8px;flex-wrap:wrap}.pp small{font-size:12px;color:var(--mute)}
.pcd{scroll-margin-top:96px}
.cards.c3{grid-template-columns:repeat(3,1fr)}
.cards.c5{grid-template-columns:repeat(5,1fr);gap:12px}
.cards.c5 .pcd{padding:22px 14px 16px}.cards.c5 .pcd h4{font-size:19px}.cards.c5 .pcd .ds{font-size:14px}.cards.c5 .pr b{font-size:21px}.cards.c5 .pcd .cta .btn{font-size:13px}
@media (max-width:900px){.cards.c3,.cards.c5{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.cards.c3,.cards.c5{grid-template-columns:1fr}}
/* ===== 요금제 둘러보기 (영상 + 카드가 차례로 짚어진다) ===== */
.tour+.tour,.tour+.vat{margin-top:34px}
.tour-box{display:grid;grid-template-columns:1fr 290px;gap:12px;background:#3A3536;color:#fff;border-radius:22px;overflow:hidden;margin-bottom:22px;min-height:440px}
.tour-t{padding:34px 36px;display:flex;flex-direction:column;justify-content:center;gap:16px}
.tour-t h3{margin:0;font-size:30px;letter-spacing:-.02em;text-wrap:balance;line-height:1.3}
.tour-t ul{margin:0;padding:0;list-style:none;display:grid;gap:10px;font-size:16px}
.tour-t li::before{content:"";display:inline-block;vertical-align:-5px;margin-right:10px;width:22px;height:22px;border-radius:7px;background:#fff url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24'%3E%3Cpath d='M6 12l4 4 8-8' stroke='%236639EE' stroke-width='3' fill='none' stroke-linecap='round'/%3E%3C/svg%3E") center/16px no-repeat}
.tour-guide{min-height:92px;margin-top:6px;background:rgba(255,255,255,.1);border-radius:14px;padding:14px 16px;display:grid;gap:4px;align-content:center}
.tour-guide .tg-n{font-size:13px;color:#FFB3DA;letter-spacing:.02em}
.tour-guide .tg-t{font-size:16px;font-weight:600;line-height:1.5}
.tour-v{display:flex;align-items:center;justify-content:center;padding:20px 24px 20px 0}
.tour-v video{height:400px;width:auto;aspect-ratio:9/16;border-radius:16px;object-fit:cover;background:#111;box-shadow:0 16px 36px rgba(0,0,0,.4)}
.tour .pcd{transition:border-color .25s,box-shadow .25s,transform .25s}
.tour .pcd.hl{border-color:var(--pink);box-shadow:0 14px 34px rgba(230,0,126,.2);transform:translateY(-4px)}
.tour.landed .pcd.rec::after{content:attr(data-rb);position:absolute;top:-13px;right:16px;background:var(--pink);color:#fff;font-weight:800;font-size:13px;padding:4px 12px;border-radius:999px;box-shadow:0 4px 10px rgba(230,0,126,.3)}
@media (max-width:900px){
  .tour-box{grid-template-columns:1fr;min-height:0;gap:0}
  .tour-v{order:-1;padding:22px 0 0}
  .tour-v video{height:auto;width:min(70%,260px)}
  .tour-t{padding:22px}.tour-t h3{font-size:22px}
}
/* ===== 직접 고르기: 하나 고르면 나머지는 접힌다 ===== */
.op-reset{display:none;align-items:center;justify-content:center;gap:8px;background:#fff;border:2px dashed #B9B9C4;border-radius:16px;font:inherit;font-weight:800;font-size:16px;color:var(--ink2);cursor:pointer;min-height:132px}
.op-reset:hover{border-color:var(--pink);color:var(--pink)}
.ops.picked{grid-template-columns:2fr 1fr}
.ops.picked .op:not(.sel){display:none}
.ops.picked .op-reset{display:flex}
/* ===== 가입혜택 아이콘 ===== */
.cat-perk .ic{overflow:hidden;position:relative}
.cat-perk .ic::before{content:"";position:absolute;inset:0;background:var(--pink);opacity:0}
.cat-perk .ic svg{position:relative;z-index:1}
@media (prefers-reduced-motion:no-preference){
  .cat-perk .ic{animation:perkglow 1.2s ease-in-out infinite}
  .cat-perk .ic::before{animation:perkflash 1.2s ease-in-out infinite}
  .cat-perk .ic svg{animation:perkgrow 6s ease-in-out infinite}
}
@keyframes perkflash{0%,100%{opacity:0}50%{opacity:.2}}
@keyframes perkglow{0%,100%{box-shadow:0 0 0 0 rgba(230,0,126,0)}50%{box-shadow:0 0 0 7px rgba(230,0,126,.22)}}
@keyframes perkgrow{0%{transform:scale(1)}8%{transform:scale(.3)}80%{transform:scale(1.85)}92%{transform:scale(1.85)}100%{transform:scale(1)}}
.pk{display:grid;gap:12px}
.pk>div{border-radius:16px;padding:18px 20px;color:#fff;display:grid;gap:4px}
.pk>div:nth-child(1){background:linear-gradient(140deg,#7A4BFF,#5228D8)}
.pk>div:nth-child(2){background:linear-gradient(140deg,#4E58E6,#3442C6)}
.pk>div:nth-child(3){background:linear-gradient(140deg,#C21A86,#8E1B9E)}
.pk h3{margin:0;font-size:19px}.pk p{margin:0;opacity:.92;font-size:15px}.pk .big{font-size:26px;font-weight:900}
/* ===== 하위 페이지 ===== */
.phero{background:linear-gradient(100deg,#FBEAF5 0%,#EFE9FF 60%,#E6F0FF 100%)}
.phero .wrap{padding-block:40px 34px}
.crumb{font-size:14px;color:var(--mute);margin-bottom:10px}.crumb a:hover{color:var(--pink)}
.phero h1{margin:0 0 10px;font-size:38px;letter-spacing:-.03em;line-height:1.25;text-wrap:balance}
.phero h1 b{color:var(--pink)}
.phero p{margin:0 0 18px;color:var(--ink2);font-size:18px;max-width:60ch}
.psec{padding-block:48px}
.psec .sec-h{font-size:28px;margin-bottom:20px}
.narrow{max-width:860px}
.pbody{display:grid;gap:18px}
.pbody p{margin:0;color:var(--ink2)}
.pbody .note,.note{font-size:14px;color:var(--mute)}
.pbody .pt{background:#fff;border-radius:14px;overflow:hidden}
.pbody .pt th{background:#F7F7FA}
.tw{overflow-x:auto}
.pbody .devrow{grid-template-columns:repeat(3,minmax(0,220px))}
.pbody .devrow figure{background:#fff}
.pbody .pop-vid{max-width:860px}
/* 하위 페이지 맨 아래: 길 안내 상자 */
.pask{background:var(--ivory)}
.pask .wrap{display:grid;gap:18px;padding-block:36px}
.pask h2{margin:0;font-size:26px}.pask p{margin:6px 0 0;color:var(--mute)}
.pask-box{background:#fff;border:1px solid var(--line);border-radius:20px;padding:20px;display:grid;gap:14px}
.pask-nav{display:flex;gap:8px;flex-wrap:wrap}
.pn{font:inherit;font-size:15px;font-weight:800;display:inline-flex;align-items:center;gap:6px;border:1px solid var(--line);background:var(--lav);border-radius:999px;padding:10px 16px;cursor:pointer;color:var(--ink)}
.pn:hover{border-color:var(--pink);color:var(--pink)}
.pn.tel{background:var(--pink);border-color:var(--pink);color:#fff}
.pask-links{display:flex;gap:8px;flex-wrap:wrap}
.pask-links a{font-size:15px;font-weight:700;border:1px solid var(--line);border-radius:999px;padding:8px 14px;background:#fff}
.pask-links a:hover{border-color:var(--pink);color:var(--pink)}
.pask-go{display:flex;gap:10px;flex-wrap:wrap}
@media (max-width:900px){.phero h1{font-size:28px}.psec{padding-block:34px}.psec .sec-h{font-size:23px}.pbody .devrow{grid-template-columns:1fr 1fr}}
/* ===== 전화기 목록 (카드와 같은 4칸) ===== */
.dvs{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
.dv{background:#fff;border:1px solid var(--line);border-radius:22px;padding:18px 18px 20px;display:flex;flex-direction:column;gap:10px}
.dv .im{height:150px;display:grid;place-items:center;background:var(--lav);border-radius:14px}
.dv .im img{max-width:88%;max-height:132px;object-fit:contain;filter:drop-shadow(0 6px 8px rgba(60,30,120,.18))}
.dv h4{margin:0;font-size:19px}.dv .tg{min-height:0}
.dv ul{margin:0;padding:0;list-style:none;display:grid;gap:6px;font-size:14px;color:var(--ink2)}
.dv li::before{content:"●";color:var(--pink);font-size:8px;margin-right:8px;vertical-align:2px}
.dv.w2{grid-column:span 2}
@media (max-width:900px){.dvs{grid-template-columns:1fr 1fr}}
@media (max-width:560px){.dvs{grid-template-columns:1fr}.dv.w2{grid-column:auto}}
/* ===== 센트릭스 첫 영상 ===== */
.cx-vid{border-radius:22px;overflow:hidden;background:#0b1a3a;box-shadow:0 18px 44px rgba(20,10,60,.22);max-width:960px;margin-inline:auto}
.cx-vid video{display:block;width:100%;height:auto}
.cx-vid .cx-m{display:none}
@media (max-width:900px){.cx-vid{max-width:340px}.cx-vid .cx-w{display:none}.cx-vid .cx-m{display:block}}
/* ===== 오피스넷 ===== */
.om-hero{background:#1b1a3a url(../img/office-hero.jpg) center/cover;color:#fff;border-radius:22px;overflow:hidden;position:relative}
.om-hero::before{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(20,18,50,.9),rgba(20,18,50,.45))}
.om-hero>div{position:relative;padding:34px;display:grid;gap:14px}
.om-hero h2{margin:0;font-size:30px;letter-spacing:-.02em;text-wrap:balance}
.om-tiles{display:grid;grid-template-columns:repeat(3,1fr);gap:10px}
.om-tiles div{background:rgba(255,255,255,.14);border:1px solid rgba(255,255,255,.25);border-radius:14px;padding:12px 14px;display:grid;gap:2px}
.om-tiles span{font-size:13px;opacity:.9}.om-tiles b{font-size:22px}
.om-one{margin:12px 0 0;font-size:15px;line-height:1.6;opacity:.95}
.om-intro{display:grid;grid-template-columns:1.2fr 1fr;gap:24px;align-items:center}
.om-intro img{border-radius:18px;width:100%;height:auto}
.om-diag{display:grid;grid-template-columns:minmax(0,320px) 1fr;gap:24px;align-items:start}
.om-diag img{border-radius:14px;background:#fff;border:1px solid var(--line);width:100%;height:auto}
.steps{display:grid;grid-template-columns:repeat(4,1fr);gap:12px;margin:0;padding:0;list-style:none;counter-reset:s}
.steps li{background:#fff;border:1px solid var(--line);border-radius:16px;padding:16px;display:grid;gap:6px;counter-increment:s}
.steps li::before{content:counter(s);width:28px;height:28px;border-radius:50%;background:var(--pink);color:#fff;font-weight:800;display:grid;place-items:center}
.steps b{font-size:16px}.steps span{font-size:14px;color:var(--mute)}
.chips{display:flex;flex-wrap:wrap;gap:8px}.chips span{background:var(--lav);border-radius:999px;padding:7px 14px;font-weight:700;font-size:15px}
@media (max-width:900px){.om-intro,.om-diag{grid-template-columns:1fr}.om-tiles{grid-template-columns:1fr}.steps{grid-template-columns:1fr 1fr}.om-hero h2{font-size:23px}}
/* ===== 현장 ===== */
.field{background:linear-gradient(#E9F2FF,#fff 70%)}
.field .sub{margin:-14px 0 18px;color:var(--ink2)}
.fld-svg{width:100%;height:auto;display:block;border-radius:18px;background:#EAF3FF}
.fld-van{animation:vanmove 14s linear infinite}
@keyframes vanmove{from{transform:translateX(-140px)}to{transform:translateX(1100px)}}
@media (prefers-reduced-motion:reduce){.fld-van{animation:none;transform:translateX(420px)}}
.fld-tags{display:flex;gap:8px;flex-wrap:wrap;margin-top:16px}.fld-tags span{background:#fff;border:1px solid var(--line);border-radius:999px;padding:8px 16px;font-weight:800}
/* ===== 챗봇 ===== */
.cb-fab{position:fixed;right:20px;bottom:24px;z-index:60;width:62px;height:62px;border-radius:50%;border:0;background:var(--violet);color:#fff;font:inherit;font-weight:800;font-size:12px;cursor:pointer;box-shadow:0 10px 26px rgba(102,57,238,.45);display:grid;place-items:center;line-height:1.1}
.cb-fab svg{width:26px;height:26px;display:block;margin:0 auto 1px}
.cb-panel{position:fixed;right:20px;bottom:98px;z-index:60;width:min(360px,calc(100vw - 24px));max-height:min(560px,calc(100vh - 130px));background:#fff;border-radius:20px;box-shadow:0 24px 60px rgba(20,10,60,.35);display:none;flex-direction:column;overflow:hidden}
.cb-panel.on{display:flex}
.cb-h{background:var(--violet);color:#fff;padding:14px 16px;display:flex;justify-content:space-between;align-items:center;font-weight:800}
.cb-h button{background:none;border:0;color:#fff;font-size:22px;cursor:pointer;line-height:1}
.cb-log{padding:14px;overflow-y:auto;display:grid;gap:10px;align-content:start;flex:1;background:#F7F7FB}
.cb-m{max-width:88%;padding:10px 13px;border-radius:14px;font-size:15px;line-height:1.5;white-space:pre-line}
.cb-m.bot{background:#fff;border:1px solid var(--line);justify-self:start}
.cb-m.me{background:var(--violet);color:#fff;justify-self:end}
.cb-q{display:flex;flex-wrap:wrap;gap:6px;padding:10px 12px;border-top:1px solid var(--line);max-height:112px;overflow-y:auto}
.cb-q button{font:inherit;font-size:13px;font-weight:700;border:1px solid var(--line);background:var(--lav);border-radius:999px;padding:6px 11px;cursor:pointer}
.cb-q button:hover{border-color:var(--violet);color:var(--violet)}
.cb-in{display:flex;gap:6px;padding:10px 12px;border-top:1px solid var(--line)}
.cb-in input{flex:1;padding:10px 12px;font-size:15px}.cb-in button{font:inherit;font-weight:800;border:0;background:var(--pink);color:#fff;border-radius:10px;padding:0 14px;cursor:pointer}
@media (max-width:900px){.cb-fab{bottom:66px;right:14px;width:56px;height:56px}.cb-panel{right:12px;bottom:130px;max-height:calc(100vh - 190px)}.strip-x{right:16px}}

.dv{position:relative}
.dv>.tg{position:absolute;top:30px;left:30px;z-index:1;min-height:0}

.cats{grid-template-columns:repeat(6,minmax(0,1fr))}
@media (max-width:900px){.cats{grid-template-columns:repeat(3,minmax(0,1fr))}}
.cat{min-width:0;text-align:center;word-break:keep-all}

.vchs{gap:0}
.vchs img{width:50px;height:22px;border-radius:3px;box-shadow:0 1px 3px rgba(0,0,0,.25);object-fit:cover;background:#fff}
.vchs img+img{margin-left:-30px}
@media (max-width:560px){.vchs img{width:40px;height:18px}.vchs img+img{margin-left:-26px}}
.vch img{width:64px;height:28px;object-fit:cover;border-radius:3px;box-shadow:0 1px 3px rgba(0,0,0,.2)}

.gift .n{font-size:24px}
.gift .n small{font-size:inherit;font-weight:900;color:var(--pink);white-space:nowrap}
@media (max-width:1199px){.gift .n{font-size:20px}}
.gift .g64{flex:none;align-self:stretch;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--pink);color:#fff;border-radius:12px;padding:8px 14px;font-weight:900;line-height:1.15;text-align:center}
.gift .g64 span{font-size:14px}
.gift .g64 b{font-size:22px;letter-spacing:-.02em;white-space:nowrap}
@media (max-width:420px){
  .gift{gap:10px;padding:12px 12px}
  .gift .n{font-size:19px}
  .gift .g64{padding:6px 10px}
  .gift .g64 b{font-size:19px}
  .gift .g64 span{font-size:12px}
}

.psec[id]{scroll-margin-top:84px}

.cards.c2{grid-template-columns:repeat(2,minmax(0,1fr));max-width:820px;margin-inline:auto}
@media (max-width:560px){.cards.c2{grid-template-columns:minmax(0,1fr)}}
.ai-top{display:grid;grid-template-columns:minmax(0,340px) minmax(0,1fr);gap:40px;align-items:center}
.ai-top .cx-vid{max-width:340px;margin:0}
.ai-top .cx-vid video{aspect-ratio:9/16}
.ai-price{display:flex;align-items:baseline;gap:6px;margin:6px 0 4px}
.ai-price b{font-size:64px;letter-spacing:-.04em;color:var(--pink);line-height:1;font-variant-numeric:tabular-nums}
.ai-price span{font-size:22px;font-weight:800}
.ai-price small{color:var(--mute);font-size:14px;margin-left:6px}
.ai-day{display:inline-block;background:var(--violet);color:#fff;font-weight:800;border-radius:999px;padding:6px 14px;font-size:15px;margin-bottom:14px}
.ai-tags{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:10px;margin:18px 0 22px;padding:0;list-style:none}
.ai-tags li{background:var(--lav);border-radius:14px;padding:12px 14px;font-weight:800;font-size:16px}
.ai-tags li::before{content:"✓";color:var(--violet);margin-right:8px}
.ai-tags li.hl{background:#FFECF6;color:var(--pink)}
.ai-tags li.hl::before{color:var(--pink)}
.ai-vs{width:100%;border-collapse:separate;border-spacing:0 10px}
.ai-vs th{font-size:15px;padding:0 12px 4px;text-align:left;color:var(--mute)}
.ai-vs th.us{color:var(--pink)}
.ai-vs td{background:#fff;padding:16px 14px;font-weight:700;vertical-align:middle}
.ai-vs td:first-child{border-radius:14px 0 0 14px;color:var(--ink2);width:30%}
.ai-vs td:last-child{border-radius:0 14px 14px 0;background:#FFECF6;color:var(--ink)}
.ai-vs td.no{color:#9a9aa8}
.ai-vs td.no::before{content:"✕ ";color:#b4b4c0}
.ai-vs td.ok::before{content:"✓ ";color:var(--pink);font-weight:900}
.ai-steps{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px;margin:0;padding:0;list-style:none;counter-reset:s}
.ai-steps li{background:#fff;border:1px solid var(--line);border-radius:18px;padding:22px 18px;counter-increment:s}
.ai-steps li::before{content:counter(s);display:inline-grid;place-items:center;width:30px;height:30px;border-radius:50%;background:var(--violet);color:#fff;font-weight:900;margin-bottom:10px}
.ai-steps b{display:block;font-size:18px;margin-bottom:6px}
.ai-steps span{color:var(--ink2);font-size:15px;line-height:1.55}
.ai-deal{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
.ai-deal div{background:#fff;border-radius:18px;padding:20px 18px;border:1px solid var(--line)}
.ai-deal b{display:block;font-size:26px;color:var(--pink);letter-spacing:-.02em;margin-bottom:4px}
.ai-deal span{color:var(--ink2);font-size:15px;line-height:1.5}
.ai-shops{display:flex;flex-wrap:wrap;gap:10px;margin:0;padding:0;list-style:none}
.ai-shops li{background:#fff;border:1px solid var(--line);border-radius:999px;padding:10px 16px;font-weight:700}
.ai-promo{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:20px;align-items:center;background:linear-gradient(100deg,#2A1B7A,#6639EE);color:#fff;border-radius:22px;padding:28px 30px}
.ai-promo h3{margin:0 0 6px;font-size:26px;letter-spacing:-.02em}
.ai-promo h3 em{font-style:normal;color:#FFD600}
.ai-promo p{margin:0;color:#E4DEFF;font-size:16px}
.ai-promo .btn{background:#FFD600;border-color:#FFD600;color:#111;white-space:nowrap}
.ai-promo .tg{display:inline-block;background:var(--pink);color:#fff;font-size:13px;font-weight:800;border-radius:999px;padding:4px 10px;margin-bottom:10px}
@media (max-width:900px){
 .ai-top{grid-template-columns:minmax(0,1fr);gap:24px}
 .ai-top .cx-vid{margin-inline:auto;max-width:300px}
 .ai-steps,.ai-deal{grid-template-columns:minmax(0,1fr)}
 .ai-promo{grid-template-columns:minmax(0,1fr);padding:22px 20px}
 .ai-price b{font-size:52px}
}
@media (max-width:560px){ .ai-tags{grid-template-columns:minmax(0,1fr)} .ai-vs td{padding:13px 10px;font-size:14px} }

/* 띠: 가운데, 상품권 사진 크게 */
.strip{text-align:center;padding:10px 120px;font-size:17px}
.strip-t{justify-content:center;gap:8px 14px}
.vchs img{width:84px;height:37px;border-radius:4px}
.vchs img+img{margin-left:-58px}
@media (max-width:900px){.strip{padding:10px 40px 10px 12px;font-size:15px}.vchs img{width:60px;height:26px}.vchs img+img{margin-left:-42px}}
/* 요금 안내 영상: 좌우 2배 */
.tour-box{grid-template-columns:1fr 500px}
.tour-v{padding:24px 28px 24px 0}
.tour-v video{width:450px;height:auto;aspect-ratio:9/16}
@media (max-width:1100px){.tour-box{grid-template-columns:1fr 380px}.tour-v video{width:340px}}
@media (max-width:900px){.tour-box{grid-template-columns:1fr}.tour-v{padding:22px 0 0}.tour-v video{width:min(88%,420px)}}
/* 가로판이 있는 안내 영상: PC 는 가로(16:9)로 넓게, 모바일은 세로 그대로 */
.tour-v .tv-w{display:none}
@media (min-width:901px){
  .tour-box:has(.tour-v.has-w){grid-template-columns:minmax(0,1fr) 680px}
  .tour-v.has-w{padding:24px 24px 24px 0}
  .tour-v.has-w .tv-m{display:none}
  .tour-v.has-w .tv-w{display:block;width:100%;height:auto;aspect-ratio:16/9;border-radius:16px;object-fit:cover;background:#111;box-shadow:0 16px 36px rgba(0,0,0,.4)}
}
@media (min-width:901px) and (max-width:1180px){.tour-box:has(.tour-v.has-w){grid-template-columns:minmax(0,1fr) 520px}}
/* 11/2 대표님 「기업인터넷전화 AI전화 영상 짤림」 — 폴드 펼침(836×697)은 세로 영상(747px)이 화면보다 커서 잘려 보임 → 560~900px 도 가로판(16:9) */
@media (min-width:560px) and (max-width:900px){.tour-v.has-w .tv-m{display:none}.tour-v.has-w .tv-w{display:block;width:min(100%,720px);height:auto;aspect-ratio:16/9;border-radius:16px;object-fit:cover;background:#111;box-shadow:0 16px 36px rgba(0,0,0,.4)}}
/* 아래 바로가기: 오와 열을 맞춘 같은 크기 칸 */
.pask-box{grid-template-columns:repeat(6,1fr);gap:12px;padding:24px}
.pask-nav,.pask-links,.pask-go{display:contents}
.pask-box .pn,.pask-links a,.pask-go .btn{display:flex;align-items:center;justify-content:center;text-align:center;height:60px;padding:0 10px;border-radius:14px;font-size:18px;font-weight:800;margin:0;min-width:0;box-sizing:border-box}
.pask-links a{background:var(--lav)}
@media (max-width:900px){.pask-box{grid-template-columns:repeat(3,1fr);gap:8px;padding:16px}.pask-box .pn,.pask-links a,.pask-go .btn{height:52px;font-size:15px}}
@media (max-width:420px){.pask-box{grid-template-columns:repeat(2,1fr)}}
/* 약속 사진 넘김: 2.2초, 바로 */
.shorts img{transition:opacity .35s}
@media (prefers-reduced-motion:no-preference){.shorts .bars i.now b{animation:fill 3.3s linear forwards}.shorts img.on{animation-duration:3.5s}}
/* 첫 화면 상품 탭 조금 크게 */
.tabs{gap:10px}
.tabs button{font-size:19px;padding:14px 28px}
@media (max-width:900px){.tabs button{font-size:16px;padding:11px 18px}}

/* ===== 최고의 결합상품 · MD 추천 · 직접 고르기 ===== */
.bc-sec{background:#F4F3FA}
.bc-sec .wrap{display:grid;gap:22px}
.bc-hd .sec-h{margin-bottom:6px}.bc-hd p,.md-hd p{margin:0;color:var(--mute);font-size:17px}
.bc-grid,.md-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px;align-items:stretch}
.bc-card,.md-card{padding:30px 28px 24px;gap:16px;border-radius:28px;border:1px solid #E6E4F2;box-shadow:0 10px 30px rgba(40,30,90,.06)}
.bc-card[hidden],.md-card[hidden]{display:none}
.bc-card.hl,.md-card.hl{border:2px solid var(--pink);box-shadow:0 18px 44px rgba(230,0,126,.16)}
.bc-head{margin:6px 0 4px;font-size:27px;font-weight:900;letter-spacing:-.03em;text-align:center;text-wrap:balance}
.bc-sr{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.bc-icons{display:flex;justify-content:center;align-items:flex-start;gap:2px;padding:10px 0 22px;border-bottom:1px solid var(--line)}
.bc-ic{display:grid;justify-items:center;gap:2px;min-width:0;flex:0 1 84px;text-align:center}
.bc-ic img{width:76px;height:76px;object-fit:contain;background:#F3F1FF;border-radius:20px;padding:2px;box-sizing:border-box}
.bc-ic b{font-size:15px;margin-top:8px;color:var(--ink)}
.bc-ic small{font-size:13px;color:var(--ink2);font-weight:600;line-height:1.25}
.bc-plus{font-style:normal;font-size:32px;font-weight:300;color:#BDBBCF;margin-top:20px}
.bc-price{margin-top:auto;display:grid;gap:6px;justify-items:end}
.bc-dcs{display:flex;gap:6px;flex-wrap:wrap;justify-content:flex-end}
.bc-dc{background:#FFF0F7;color:var(--pink);font-size:13px;font-weight:800;padding:4px 10px;border-radius:999px}
.bc-lbl{margin:0;font-size:15px;color:var(--ink2)}.bc-lbl small{font-size:12px;color:var(--mute);margin-left:4px}
.bc-pr{display:flex;align-items:baseline;gap:12px;flex-wrap:wrap;justify-content:flex-end}
.bc-pr s{color:#9A98AC;font-size:17px;font-variant-numeric:tabular-nums}
.bc-pr .pp b{font-size:36px;font-weight:900;color:var(--pink);letter-spacing:-.03em;font-variant-numeric:tabular-nums}
.md-card .bc-pr .pp b{color:var(--ink);font-size:32px}
.bc-gift{display:flex;align-items:center;gap:18px;background:#FFF3F8;border:1px solid #FFD6E9;border-radius:20px;padding:16px 18px}
.bc-vch{flex:none;position:relative;width:112px;height:64px}
.bc-vch img{position:absolute;left:4px;top:12px;width:96px;height:42px;object-fit:cover;border-radius:4px;background:#fff;box-shadow:0 3px 8px rgba(0,0,0,.22)}
.bc-vch img:nth-child(1){transform:rotate(-14deg) translate(-4px,-6px)}
.bc-vch img:nth-child(2){transform:rotate(-6deg) translate(2px,-1px)}
.bc-vch img:nth-child(3){transform:rotate(3deg) translate(8px,6px)}
.bc-tk{flex:none;position:relative;display:grid;place-items:center;width:90px;height:54px;border-radius:8px;background:linear-gradient(135deg,#5A86FF,#2F55E0);color:#fff;font-weight:900;font-size:20px;line-height:1;transform:rotate(-12deg);box-shadow:0 8px 16px rgba(47,85,224,.35)}
.bc-tk small{display:block;font-size:10px;font-weight:700;opacity:.85;margin-bottom:-8px}
.bc-tk::before,.bc-tk::after{content:"";position:absolute;top:50%;width:12px;height:12px;margin-top:-6px;border-radius:50%;background:#E8EFFF}
.bc-tk::before{left:-6px}.bc-tk::after{right:-6px}
.bc-gift p{margin:0;display:grid;min-width:0}.bc-gift p small{font-size:14px;color:var(--ink2)}
.bc-gift b{font-size:17px;color:var(--pink);letter-spacing:-.03em;white-space:nowrap}
.bc-card .cta,.md-card .cta{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.bc-card .cta .btn,.md-card .cta .btn{font-size:16px;padding:14px 6px}
.md-hd{margin-top:34px}.md-hd h3,.md-find h3,.md-count{margin:0 0 6px;font-size:30px;letter-spacing:-.03em;text-wrap:balance}
.md-hd h3 b,.md-find h3 b,.md-count em{color:var(--pink);font-style:normal}
.md-top{display:flex;gap:6px;flex-wrap:wrap;align-items:center}
.md-top i{font-style:normal;font-size:13px;font-weight:800;color:#fff;border-radius:4px;padding:4px 8px;line-height:1.2}
.md-rank{background:#111;color:#fff;font-size:13px;font-weight:800;padding:5px 9px;border-radius:4px}
.md-card.hl .md-rank{background:var(--pink)}
.md-rank2{background:#9A6A00;color:#fff;font-size:13px;font-weight:800;padding:4px 8px;border-radius:4px}
.md-card h4{font-size:25px;margin:0}
.md-rows{list-style:none;margin:0;padding:16px 18px;background:#F7F7FB;border-radius:18px;display:grid;gap:10px;min-height:150px;align-content:start}
.md-rows li{display:flex;align-items:center;gap:12px;font-size:17px;font-weight:700}
.md-rows img{width:34px;height:34px;object-fit:contain;flex:none}
.md-rows span{flex:1}.md-rows em{font-style:normal;color:var(--mute);font-weight:600;font-size:14px;font-variant-numeric:tabular-nums}
.md-who b{font-size:17px}.md-who ul{margin:6px 0 0;padding:0 0 0 18px;font-size:14px;color:var(--ink2);display:grid;gap:2px}
.md-gift{display:flex;justify-content:flex-end;margin-top:auto}
.md-gift span{position:relative;background:#fff;border-radius:999px;padding:9px 18px;font-size:15px;font-weight:800;box-shadow:0 6px 18px rgba(230,0,126,.18)}
.md-gift span b{color:var(--pink)}
.md-gift span::after{content:"";position:absolute;left:50%;bottom:-7px;margin-left:-7px;border:7px solid transparent;border-top-color:#fff;border-bottom:0}
.md-card .bc-price{margin-top:0}
.md-find{margin-top:34px;background:linear-gradient(135deg,#FFE7F3,#F1ECFF);border-radius:32px;padding:40px 36px 34px;text-align:center}
.md-find>p{margin:0;color:var(--ink2);font-size:16px}
.md-find>p.md-q{margin:26px 0 12px;text-align:left;font-size:20px;font-weight:800;color:var(--ink)}
.md-chips{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:14px}
.md-chip{font:inherit;display:flex;align-items:center;gap:12px;background:#fff;border:2px solid transparent;border-radius:22px;padding:18px 20px;cursor:pointer;font-size:19px;font-weight:800;color:var(--ink);box-shadow:0 8px 22px rgba(230,0,126,.08);transition:border-color .2s,transform .2s}
.md-chip img{width:44px;height:44px;object-fit:contain;background:#F3F1FF;border-radius:12px;flex:none}
.md-chip span{flex:1;text-align:left}
.md-chip i{width:26px;height:26px;border-radius:50%;border:2px solid #C9C7D6;position:relative;flex:none}
.md-chip.on{border-color:var(--pink)}
.md-chip.on i{background:var(--pink);border-color:var(--pink)}
.md-chip.on i::after{content:"";position:absolute;left:8px;top:4px;width:6px;height:11px;border:solid #fff;border-width:0 3px 3px 0;transform:rotate(45deg)}
.md-chip:hover{transform:translateY(-2px)}
.md-chip:focus-visible{outline:3px solid var(--violet);outline-offset:2px}
.md-res{text-align:center;display:grid;gap:4px}
.md-res .md-grid{margin-top:18px;text-align:left}
.md-sub{margin:0;color:var(--mute);font-size:17px}
.md-empty{background:#fff;border-radius:20px;padding:26px;font-weight:700;margin:16px 0 0}
.md-empty a{color:var(--pink);text-decoration:underline}
.bc-note{margin:6px 0 0;font-size:13px;color:var(--mute)}
.pv-mob{display:none}.msc.mob .pv-mob{display:grid}.msc.mob .pv-net{display:none}
.msc .bc-price.v{display:none}
.msc:not(.inet):not(.mob) .s-n,.msc.inet .s-i,.msc.mob .s-m{display:grid}
.bc-hd .mobt{justify-content:center}
.bc-pct{font-style:normal;font-weight:900;color:var(--pink);font-size:20px;margin-right:6px}
.md-find>p.md-q small{font-size:15px;font-weight:600;color:var(--mute);margin-left:6px}
.md-wrap{display:grid;gap:22px}.md-sec .md-hd{margin-top:0}
.ai-top:has(.ai-v2){grid-template-columns:minmax(0,720px) minmax(0,1fr);gap:36px}
.ai-top .ai-v2{max-width:720px}
@media (min-width:901px) and (max-width:1180px){.ai-top:has(.ai-v2){grid-template-columns:minmax(0,560px) minmax(0,1fr)}}
.ai-top .ai-v2 .cx-w{aspect-ratio:16/9}
/* 11/2 대표님 「PC에서 AI전화 영상 짤림」 — 고객센터 #ai 용 3/4!important 규칙이 /aicall/ 의 #ai 에도 걸려 가로 영상이 세로 상자에 갇힘 → 더 센 선택자로 16/9 고정 */
html #ai .ai-top .ai-v2 .cx-w{aspect-ratio:16/9!important;object-fit:cover;object-position:50% 50%!important;max-height:none!important}
/* 11/2 대표님 「줄었는데 너무 작은 듯」 — PC 에선 영상 칸을 글 칸보다 넓게(약 57%), 폭 제한 없음 */
@media (min-width:901px){html #ai .ai-top:has(.ai-v2){grid-template-columns:minmax(0,1.35fr) minmax(0,1fr)!important;gap:32px;align-items:center}html #ai .ai-top .ai-v2{max-width:none!important;width:100%}}
@media (max-width:900px){.ai-top:has(.ai-v2){grid-template-columns:minmax(0,1fr)}.ai-top .ai-v2{max-width:300px}}
/* 11/2 대표님 「AI전화 영상 짤림」 — 폴드(560~900px)에선 세로 영상이 16:9 상자에 갇혀 위아래가 잘림 → 이 폭에선 가로판(.cx-w)을 보인다 */
@media (min-width:560px) and (max-width:900px){.ai-top .ai-v2{max-width:720px}.ai-top .ai-v2 .cx-w{display:block;aspect-ratio:16/9}.ai-top .ai-v2 .cx-m{display:none}}
.bc-dc.mob{background:#EAF7EF;color:#0A7A3B}
.mobt{display:flex;align-items:center;justify-content:center;gap:12px;flex-wrap:wrap;margin-top:12px}
.md-hd .mobt{justify-content:flex-start}
.mob-btn{font:inherit;display:inline-flex;align-items:center;gap:6px;background:#fff;border:1px solid #D6D4E2;border-radius:999px;padding:5px 12px 5px 8px;font-size:13px;font-weight:700;cursor:pointer;color:var(--ink)}
.mob-btn i{width:16px;height:16px;border-radius:50%;border:1px solid #C9C7D6;position:relative}
.mob-btn[aria-pressed="true"]{border-color:var(--pink);color:var(--pink)}
.mob-btn[aria-pressed="true"] i{background:var(--pink);border-color:var(--pink)}
.mob-btn[aria-pressed="true"] i::after{content:"";position:absolute;left:4px;top:1px;width:4px;height:8px;border:solid #fff;border-width:0 2px 2px 0;transform:rotate(45deg)}
.mob-btn:focus-visible{outline:3px solid var(--violet);outline-offset:2px}
.mobt-n{font-size:12px;color:var(--mute)}
.mobt{gap:6px;margin-top:8px}
.md-tel{margin:auto 0 0;text-align:right;font-size:14px;color:var(--mute)}
@media (max-width:640px){.mob-btn{font-size:12px;padding:4px 10px 4px 7px}.mobt-n{font-size:11px}}
@media (max-width:1100px){.bc-grid,.md-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.md-chips{grid-template-columns:repeat(2,minmax(0,1fr))}}
@media (max-width:640px){.bc-grid,.md-grid{grid-template-columns:minmax(0,1fr)}.bc-card,.md-card{padding:24px 18px 20px}
  .bc-head{font-size:23px}.bc-ic img{width:58px;height:58px}.bc-ic small{font-size:11px}.bc-plus{font-size:22px;margin-top:16px}
  .bc-gift{gap:10px;padding:12px}.bc-vch{width:92px;height:56px}.bc-vch img{width:80px;height:35px}.bc-gift b{font-size:16px}
  .md-find{padding:26px 16px}.md-hd h3,.md-find h3,.md-count{font-size:23px}.md-chip{font-size:16px;padding:12px}.md-chip img{width:34px;height:34px}}
@media (prefers-reduced-motion:reduce){.md-chip{transition:none}.md-chip:hover{transform:none}}

#build:not(.open) .wrap>:not(.sec-h):not(.hr):not(.bld-more){display:none}
#build.open .bld-more{display:none}
.bld-more{font:inherit;display:flex;align-items:center;justify-content:center;gap:8px;margin:18px auto 0;min-width:240px;padding:15px 28px;border-radius:999px;border:2px solid var(--violet);background:#fff;color:var(--violet);font-size:18px;font-weight:800;cursor:pointer}
.bld-more span{font-size:22px;line-height:.6;margin-top:-6px}
.bld-more:hover{background:var(--violet);color:#fff}
.bld-more:focus-visible{outline:3px solid var(--pink);outline-offset:2px}

/* 센트릭스 요금표: 모든 표의 열을 같은 자리에 */
.pt.al{table-layout:fixed;width:100%}
.pt.al th:nth-child(1),.pt.al td:nth-child(1){width:34%}
.pt.al th:nth-child(2),.pt.al td:nth-child(2){width:18%;text-align:right;padding-right:28px}
.pt.al th:nth-child(3):not(:last-child),.pt.al td:nth-child(3):not(:last-child){width:16%}
.pt.al td{white-space:normal;word-break:keep-all}
@media (max-width:640px){.pt.al th:nth-child(1),.pt.al td:nth-child(1){width:38%}.pt.al th:nth-child(2),.pt.al td:nth-child(2){width:24%;padding-right:12px}.pt.al th:nth-child(3),.pt.al td:nth-child(3){width:auto}}

.pt.al5{table-layout:fixed;width:100%}
.pt.al5 th:first-child,.pt.al5 td:first-child{width:28%}
.pt.al5 th:not(:first-child),.pt.al5 td:not(:first-child){width:18%;text-align:right;padding-right:22px}
@media (max-width:640px){.pt.al5 th:first-child,.pt.al5 td:first-child{width:24%}.pt.al5 th:not(:first-child),.pt.al5 td:not(:first-child){padding-right:8px;font-size:13px}}

/* ===== 가입혜택 창 (10/18 상품권 TOP 4) ===== */
dialog.pk2{width:min(1120px,calc(100vw - 24px));max-height:calc(100vh - 24px);border-radius:28px;overflow:auto;background:#fff}
.pk2-hd{position:relative;display:grid;grid-template-columns:minmax(0,1fr) 240px;align-items:center;gap:12px;padding:24px 40px 20px;color:#fff;background:linear-gradient(135deg,#E6007E 0%,#B0169B 55%,#6639EE 100%);overflow:hidden}
.pk2-hd::after{content:"";position:absolute;right:-60px;top:-80px;width:260px;height:260px;border-radius:50%;background:rgba(255,255,255,.08)}
.pk2-hd .pop-x{position:absolute;right:16px;top:16px;z-index:3;background:rgba(255,255,255,.2);color:#fff}
.pk2-hd .pop-x:hover{background:rgba(255,255,255,.32)}
.pk2-eb{display:inline-block;font-size:13px;font-weight:800;letter-spacing:.04em;background:rgba(255,255,255,.18);padding:5px 12px;border-radius:999px}
.pk2-hd h2{margin:12px 0 8px;font-size:36px;line-height:1.2;letter-spacing:-.03em;font-weight:800}
.pk2-hd h2 b{color:#FFE14D;font-weight:900;font-size:48px}
.pk2-hd p{margin:0;font-size:16px;opacity:.95}.pk2-hd p b{color:#FFE14D}
.pk2-vch{position:relative;height:130px;z-index:2}
.pk2-vch img{position:absolute;left:30px;top:40px;width:160px;height:70px;border-radius:6px;background:#fff;object-fit:cover;box-shadow:0 10px 22px rgba(40,0,40,.35)}
.pk2-vch img:nth-child(1){transform:rotate(-16deg) translate(-10px,-14px)}
.pk2-vch img:nth-child(2){transform:rotate(-6deg) translate(6px,0)}
.pk2-vch img:nth-child(3){transform:rotate(5deg) translate(22px,18px)}
.pk2-b{padding:22px 30px 10px;display:grid;gap:16px}
.pk3-hd{display:flex;align-items:center;justify-content:space-between;gap:12px}
.pk3-hd h3{margin:0;font-size:22px;letter-spacing:-.02em}.pk3-hd h3 b{color:var(--pink)}
.pk3-dots{display:flex;gap:6px;margin:0}.pk3-dots i{width:8px;height:8px;border-radius:50%;background:#E3D7EC;transition:width .3s,background .3s}
.pk3-dots i.on{width:22px;border-radius:999px;background:var(--pink)}
.pk3-track{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;padding:6px 2px 4px;outline:none}
.pk3-c{position:relative;display:flex;flex-direction:column;gap:6px;border:2px solid var(--line);border-radius:20px;padding:16px 16px 14px;background:#FBFAFF;transition:transform .45s,box-shadow .45s,border-color .45s,background .45s;min-width:0}
.pk3-c.on{border-color:var(--pink);background:#FFF5FA;transform:translateY(-6px);box-shadow:0 16px 34px rgba(230,0,126,.2)}
.pk3-rk{margin:0;align-self:flex-start;font-size:12.5px;font-weight:900;color:#fff;background:#1E1117;border-radius:6px;padding:3px 9px}
.pk3-c.on .pk3-rk{background:var(--pink)}
.pk3-c h3{margin:2px 0 0;font-size:16px;line-height:1.35;letter-spacing:-.02em;word-break:keep-all}
.pk3-ic{display:flex;gap:4px}.pk3-ic img{width:34px;height:34px;object-fit:contain;background:#fff;border-radius:10px;padding:3px}
.pk3-nm{margin:0;font-size:12.5px;color:var(--ink2);line-height:1.45;word-break:keep-all;min-height:36px}
.pk3-g{display:grid;gap:0;border-radius:14px;background:#fff;border:1px dashed #FFB3D6;padding:10px 12px;margin-top:2px}
.pk3-g small{font-size:12.5px;font-weight:800;color:var(--ink)}
.pk3-g b{font-size:32px;line-height:1.1;font-weight:900;letter-spacing:-.03em;color:var(--pink)}
.pk3-g span{font-size:12px;font-weight:700;color:var(--ink2)}
.pk3-pr{margin:4px 0 0;display:flex;align-items:baseline;flex-wrap:wrap;gap:4px 6px;justify-content:flex-end}
.pk3-pr s{font-size:13px;color:var(--mute)}.pk3-pr b{font-size:20px;font-weight:900;letter-spacing:-.02em}.pk3-pr small{width:100%;text-align:right;font-size:11.5px;color:var(--mute)}
.pk3-go{margin-top:auto;display:block;text-align:center;text-decoration:none;font-weight:800;font-size:14.5px;border-radius:12px;padding:10px;border:2px solid var(--pink);color:var(--pink);background:#fff}
.pk3-c.on .pk3-go,.pk3-go:hover{background:var(--pink);color:#fff}
.pk3-go:focus-visible{outline:3px solid var(--violet);outline-offset:2px}
.pk2-steps{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:8px;counter-reset:s}
.pk2-steps li{counter-increment:s;position:relative;display:flex;gap:8px;align-items:center;justify-content:center;padding:10px 6px;border-radius:14px;background:var(--lav)}
.pk2-steps li::before{content:counter(s);display:grid;place-items:center;width:22px;height:22px;flex:none;border-radius:50%;background:var(--violet);color:#fff;font-size:12px;font-weight:900}
.pk2-steps li:not(:last-child)::after{content:"›";position:absolute;right:-8px;top:50%;transform:translateY(-50%);color:#B9B3E6;font-size:22px;font-weight:700}
.pk2-steps b{font-size:14px}.pk2-steps span{font-size:12px;color:var(--mute)}
.pk2-note{margin:0;font-size:12px;color:var(--mute)}
@media (max-width:900px){
  .pk2-hd{grid-template-columns:minmax(0,1fr);padding:26px 20px 14px}.pk2-hd h2{font-size:24px}.pk2-hd h2 b{font-size:38px}.pk2-hd p{font-size:14px;padding-right:8px}
  .pk2-vch{display:none}
  .pk2-b{padding:16px 0 8px}.pk3-hd,.pk2-steps,.pk2-note{margin-inline:16px}.pk3-hd h3{font-size:18px}
  .pk3-track{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:10px;padding:8px 16px 6px;scrollbar-width:none;overscroll-behavior-x:contain}
  .pk3-track::-webkit-scrollbar{display:none}
  .pk3-c{flex:0 0 78%;scroll-snap-align:center}
  .pk3-c.on{transform:none}
  .pk2-steps{grid-template-columns:repeat(2,minmax(0,1fr))}.pk2-steps li{flex-wrap:wrap;gap:2px 6px}.pk2-steps li span{width:100%;text-align:center}.pk2-steps li:nth-child(2)::after{display:none}
  .pk2 .pop-f{padding:12px 14px 14px;gap:8px}.pk2 .pop-f .btn{font-size:14px;white-space:nowrap;padding:13px 4px}
}
@media (prefers-reduced-motion:reduce){.pk3-c,.pk3-dots i{transition:none}}
/* 10/20 대표님 「상품권 이미지 같은 크기 6장, 넘치게」 → 「너무 나눠져 있다」 → 「한 줄로 겹치게 조금 키워서」 */
dialog.pk2{overflow-x:hidden}
.pk2-hd{grid-template-columns:minmax(0,1fr) 440px;overflow:visible;z-index:2}
.pk2-hd::after{right:0;top:0;width:200px;height:180px;border-radius:0 28px 0 100%}
.pk2-vch{--cw:190px;height:110px;align-self:end;margin-bottom:-58px;z-index:4}
.pk2-vch img{top:0;width:var(--cw);height:84px}
.pk2-vch img:nth-child(1){left:calc((100% - var(--cw)) * 0);transform:translateY(0px) rotate(-5deg)}
.pk2-vch img:nth-child(2){left:calc((100% - var(--cw)) * 0.2);transform:translateY(8px) rotate(3deg)}
.pk2-vch img:nth-child(3){left:calc((100% - var(--cw)) * 0.4);transform:translateY(2px) rotate(-3deg)}
.pk2-vch img:nth-child(4){left:calc((100% - var(--cw)) * 0.6);transform:translateY(10px) rotate(5deg)}
.pk2-vch img:nth-child(5){left:calc((100% - var(--cw)) * 0.8);transform:translateY(4px) rotate(-4deg)}
.pk2-vch img:nth-child(6){left:calc((100% - var(--cw)) * 1);transform:translateY(12px) rotate(4deg)}
.pk2-b{padding-top:50px}
@media (max-width:900px){
  .pk2-hd{grid-template-columns:minmax(0,1fr)}.pk2-hd::after{width:120px;height:110px}
  .pk2-vch{--cw:124px;display:block;height:72px;margin:12px 0 -40px;align-self:auto}
  .pk2-vch img{height:55px}
  .pk2-b{padding-top:46px}
}

.cb-fab{width:76px;height:76px;padding:0;background:#fff;border:3px solid var(--pink);box-shadow:0 12px 28px rgba(230,0,126,.35);overflow:visible}
.cb-fab img{width:64px;height:64px;border-radius:50%;display:block}
.cb-fab-t{position:absolute;left:50%;bottom:-10px;transform:translateX(-50%);background:var(--pink);color:#fff;font-size:12px;font-weight:900;padding:2px 10px;border-radius:999px;white-space:nowrap}
.cb-panel{bottom:116px;border-radius:22px}
.cb-h{background:linear-gradient(135deg,#E6007E,#B0169B);gap:10px;justify-content:flex-start}
.cb-h img{width:40px;height:40px;border-radius:50%;background:#fff;flex:none}
.cb-ht{display:grid;line-height:1.2;flex:1}.cb-ht b{font-size:17px}.cb-ht small{font-size:12px;font-weight:600;opacity:.85}
.cb-m.me{background:var(--pink)}
.cb-q button:hover{border-color:var(--pink);color:var(--pink)}
.cb-q button.go{background:var(--pink);border-color:var(--pink);color:#fff}
.cb-cta{justify-self:start;font:inherit;font-size:14px;font-weight:800;border:2px solid var(--pink);background:#fff;color:var(--pink);border-radius:999px;padding:8px 14px;cursor:pointer}
.cb-lead{display:grid;gap:8px;background:#fff;border:2px solid var(--pink);border-radius:16px;padding:14px;max-width:92%}
.cb-lead b{font-size:14px}.cb-lead span{font-size:14px;color:var(--ink2)}
.cb-lead input[type=text],.cb-lead input[type=tel]{padding:10px 12px;font-size:15px;border:1px solid var(--line);border-radius:10px}
.cb-lead label{font-size:12px;color:var(--ink2);display:flex;gap:6px;align-items:flex-start;justify-content:flex-start;text-align:left;line-height:1.4}
.cb-lead label input{width:16px;height:16px;flex:none;margin:1px 0 0;padding:0}
.cb-lead button{font:inherit;font-weight:800;border:0;background:var(--pink);color:#fff;border-radius:10px;padding:11px;cursor:pointer}
.cb-lm{margin:0;font-size:13px;color:#d92d3a;min-height:0}
@media (max-width:900px){.cb-fab{width:62px;height:62px;bottom:70px}.cb-fab img{width:52px;height:52px}.cb-panel{bottom:146px}}

/* 맨 아래 한 칸 */
.ft2{background:#2A2730;color:#C9C6D2;font-size:14px}
.ft2 .wrap{padding-block:34px 30px;display:grid;gap:10px}
.ft2-top{display:flex;align-items:center;justify-content:space-between;gap:16px;flex-wrap:wrap;padding-bottom:16px;margin-bottom:6px;border-bottom:1px solid #45414E}
.ft2-brand{display:flex;align-items:center;gap:10px;color:#fff;font-weight:800;font-size:18px}
.ft2-brand img{height:26px;width:auto;margin:0}
.ft2-call{display:grid;justify-items:end}
.ft2-call a{color:#fff;font-size:32px;font-weight:900;letter-spacing:-.01em;font-variant-numeric:tabular-nums}
.ft2-call span{font-size:13px;color:#A9A5B4}
.ft2-co{display:flex;flex-wrap:wrap;gap:4px 18px}
.ft2-co b{color:#fff;margin-right:4px}.ft2-co a{color:#fff}
.ft2-star{color:#FF6FB5;font-weight:800}
.ft2 .biz{color:#E9E7EE;font-weight:700;margin-top:6px}
.ft2 .note{color:#A9A5B4;font-size:12px}
.ft2-cr{color:#8A8694;font-size:12px}
/* 아래 고정: 전화상담 / 견적신청 (PC·모바일 모두) */
body .mbar{display:grid;grid-template-columns:1fr 1fr;position:fixed;left:0;right:0;bottom:0;z-index:30;box-shadow:0 -4px 16px rgba(0,0,0,.12)}
body .mbar a{display:flex;align-items:center;justify-content:center;gap:8px;padding:15px 8px;font-weight:800;font-size:17px}
body .mbar .a1{background:#fff;color:var(--pink)}body .mbar .a2{background:var(--pink);color:#fff}
.mbar .mb-n{display:none;font-variant-numeric:tabular-nums}
@media (min-width:901px){
  body{padding-bottom:60px}
  body .mbar a{padding:16px;font-size:19px}
  .mbar .mb-n{display:inline}
  body .mbar a:hover{filter:brightness(.96)}
  .cb-fab{bottom:84px}
  .cb-panel{bottom:172px;max-height:min(560px,calc(100vh - 200px))}
}
@media (max-width:900px){.ft2-call{justify-items:start}.ft2-call a{font-size:28px}}
/* 하단 낮게 (10/18 「세로로 길어짐」) */
.ft2 .wrap{padding-block:22px 18px;gap:6px}
.ft2-top{padding-bottom:10px;margin-bottom:2px}
.ft2-call{display:flex;align-items:baseline;gap:12px}
.ft2-call a{font-size:24px}
.ft2-co{gap:2px 14px;font-size:13px}
.ft2-bt{display:flex;flex-wrap:wrap;gap:2px 14px;margin-top:4px;font-size:12px}
.ft2-bt .biz{margin:0;font-weight:700;color:#E9E7EE}
@media (max-width:900px){
  .ft2 .wrap{padding-block:18px 14px}
  .ft2-top{gap:6px}
  .ft2-call{flex-wrap:wrap;gap:8px}.ft2-call a{font-size:22px}.ft2-call span{font-size:12px}
  .ft2-co{font-size:12.5px;gap:0 10px}.ft2-co span:first-child{flex-basis:100%}
  .ft2-bt{font-size:11.5px;gap:0 10px}
}
/* 아래 고정 막대 낮게 (10/18 「너무 큼」) */
body .mbar a{padding:11px 8px;font-size:16px}
body .mbar svg{width:18px;height:18px}
@media (min-width:901px){body{padding-bottom:46px}body .mbar a{padding:11px 16px;font-size:17px}.cb-fab{bottom:66px}.cb-panel{bottom:154px}}
@media (max-width:900px){body{padding-bottom:44px}.cb-fab{bottom:56px}}
/* 10/18 2차: 결합·추천 칸 더 낮게 */
.bc-card{padding:20px 22px 16px;gap:10px}
.bc-head{font-size:24px}
.bc-icons{padding:0 0 12px}
.bc-ic img{width:64px;height:64px;border-radius:16px}
.bc-ic b{margin-top:4px}
.bc-plus{margin-top:14px}
.bc-pr .pp b{font-size:32px}
.bc-gift{padding:8px 14px}
.md-card{padding:22px 22px 18px;gap:10px}
.md-card h4{font-size:22px}
.md-rows{padding:12px 16px;gap:6px;min-height:0}
.md-rows li{font-size:16px}
.md-who b{font-size:15px}.md-who ul{margin-top:2px}
.md-card .bc-pr .pp b{font-size:28px}
.md-gift span{padding:6px 14px;font-size:14px}
@media (max-width:640px){.bc-ic img{width:54px;height:54px}}
/* 10/18 휴대폰: 내려간 상태에서 메뉴를 눌러도 바로 보이게(머리줄 아래 고정) */
.mnav{position:fixed;left:0;right:0;top:64px;z-index:25;max-height:calc(100vh - 140px);max-height:calc(100svh - 140px);overflow-y:auto;overscroll-behavior:contain}
/* 10/18 휴대폰 첫 영상 잘림: 화면 높이에 맞춰 영상 칸 폭을 줄인다(9:16 유지) */
@media (max-width:900px){
  .hstage .hmedia,.hstage.wide .hmedia{max-height:none;width:min(100%,420px)}   /* 10/20 대표님 「메인 영상을 아래 영상 크기로」: 화면 높이로 줄이던 것 뺌(아래 둘러보기 영상과 같은 폭) */
}
/* 결합 칸 위아래 줄임 */
.bc-card{padding:22px 24px 18px;gap:12px}
.bc-head{margin:0}
.bc-icons{padding:4px 0 14px}
.bc-dcs{gap:4px}
.bc-gift{padding:10px 16px}
.bc-vch{height:54px}.bc-vch img{top:7px}

/* 10/18 추천 구성·요금제 목록 상품권 칸을 베스트 결합과 같은 꼴로 */
.md-card .md-gb{margin-top:auto;gap:12px;padding:6px 14px}
.md-card .md-tel+.md-gb{margin-top:8px}
.md-card .md-tel{margin-top:auto}
.md-card .md-gb .bc-vch{width:88px;height:46px}
.md-card .md-gb .bc-vch img{width:76px;height:33px;top:6px}
.md-card .md-gb p small{font-size:13px}
.md-card .md-gb b{font-size:16px}

/* 10/18 최종: 본사 상품권 금액은 진하게, 밑에 합계 */
.md-card .md-gb p small{color:var(--ink);font-weight:800}
.md-card .md-gb p em{font-style:normal;font-size:13px;font-weight:700;color:var(--ink);margin-top:2px}
.md-card .md-gb p em strong{font-size:15px;font-weight:900;color:var(--ink)}

.md-close{text-align:left;margin-top:26px;display:grid;grid-template-columns:minmax(0,1.25fr) minmax(0,1fr);gap:22px;align-items:stretch;border-radius:28px;padding:30px;color:#fff;background:linear-gradient(135deg,#E6007E 0%,#B0169B 55%,#6639EE 100%);box-shadow:0 22px 50px rgba(176,22,155,.28)}
.mc-eb{margin:0;display:inline-block;font-size:13px;font-weight:800;letter-spacing:.04em;background:rgba(255,255,255,.18);padding:5px 12px;border-radius:999px}
.mc-l h3{margin:12px 0 16px;font-size:32px;line-height:1.25;letter-spacing:-.03em;text-wrap:balance}
.mc-l h3 b{color:#FFE14D}
.mc-sum{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.mc-sum li{display:grid;grid-template-columns:150px minmax(0,1fr);align-items:baseline;gap:2px 10px;background:rgba(255,255,255,.12);border-radius:14px;padding:11px 16px}
.mc-sum li span{font-size:14px;opacity:.9}
.mc-sum li b{font-size:18px;font-weight:900;letter-spacing:-.02em;word-break:keep-all}
.mc-sum li small{grid-column:2;font-size:12.5px;opacity:.85}
.mc-sum li.g{background:#fff;color:var(--ink)}
.mc-sum li.g b{font-size:30px;color:var(--pink)}
.mc-sum li.g span,.mc-sum li.g small{opacity:1;color:var(--ink2)}
.mc-f{background:#fff;color:var(--ink);border-radius:22px;padding:24px;display:flex;flex-direction:column;gap:10px;justify-content:center}
.mc-lb{font-size:18px;font-weight:900}
.mc-tel{font:inherit;font-size:20px;font-weight:800;padding:14px 16px;border:2px solid var(--line);border-radius:14px;width:100%;box-sizing:border-box;letter-spacing:.02em}
.mc-tel:focus{outline:none;border-color:var(--pink)}
.mc-ag{display:flex;gap:7px;align-items:flex-start;font-size:13px;color:var(--ink2);line-height:1.4}.mc-ag input{margin:2px 0 0;width:16px;height:16px;flex:none}
.mc-go{font:inherit;font-size:19px;font-weight:900;border:0;border-radius:14px;padding:16px 12px;background:var(--pink);color:#fff;cursor:pointer;box-shadow:0 10px 22px rgba(230,0,126,.3);animation:mcPulse 2.4s ease-in-out infinite}
.mc-go:hover{filter:brightness(1.06)}.mc-go:disabled{opacity:.7;cursor:default;animation:none}
.mc-go:focus-visible,.mc-call:focus-visible{outline:3px solid var(--violet);outline-offset:2px}
.mc-call{text-align:center;text-decoration:none;font-weight:800;font-size:16px;color:var(--pink);border:2px solid var(--pink);border-radius:14px;padding:12px}
.mc-msg{margin:0;font-weight:700;font-size:14px;min-height:0}.mc-msg.ok{color:#0a7a3b}.mc-msg.no{color:#d92d3a}
.mc-fine{margin:0;font-size:12px;color:var(--mute);text-align:center}
@keyframes mcPulse{0%,100%{transform:none}50%{transform:scale(1.025)}}
@media (max-width:900px){.md-close{grid-template-columns:minmax(0,1fr);padding:22px 16px;border-radius:22px;gap:16px}.mc-l h3{font-size:25px}
  .mc-sum li{grid-template-columns:minmax(0,1fr);padding:10px 14px}.mc-sum li small{grid-column:1}.mc-sum li.g b{font-size:28px}.mc-f{padding:18px}.mc-go{font-size:17px}}
@media (prefers-reduced-motion:reduce){.mc-go{animation:none}}

/* ===== 챗봇 영업사원 (10/18) ===== */
.cb-ch{display:flex;flex-wrap:wrap;gap:6px}
.cb-ch button{font:inherit;font-size:14px;font-weight:700;border:1.5px solid #E3D7EC;background:#fff;color:var(--ink);border-radius:999px;padding:8px 13px;cursor:pointer}
.cb-ch button:hover{border-color:var(--pink)}
.cb-ch button.on{border-color:var(--pink);background:#FFF0F7;color:var(--pink)}
.cb-ch button.done{background:var(--pink);border-color:var(--pink);color:#fff}
.cb-ch button:focus-visible,.cb-tip button:focus-visible{outline:3px solid var(--violet);outline-offset:2px}
.cb-res{background:#fff;border:2px solid var(--pink);border-radius:16px;padding:14px;display:grid;gap:5px;max-width:94%;font-size:14px}
.cb-res h5{margin:0 0 4px;font-size:15px}
.cb-res .r{display:flex;justify-content:space-between;gap:10px}
.cb-res .r span:last-child{font-variant-numeric:tabular-nums;white-space:nowrap}
.cb-res .d{color:var(--pink);font-weight:700}.cb-res .m{color:#0A7A3B;font-weight:700}
.cb-res .t{display:flex;justify-content:space-between;align-items:baseline;border-top:1px solid var(--line);padding-top:8px;margin-top:3px;font-weight:800}
.cb-res .t b{font-size:22px;color:var(--pink);font-variant-numeric:tabular-nums}
.cb-res small{color:var(--mute);font-size:12px}
.cb-res .g{background:#FFF3F8;border-radius:10px;padding:8px 10px;font-weight:800;color:var(--pink);margin-top:4px}
a.cb-cta{text-decoration:none;display:inline-block}
.cb-tip{position:fixed;right:20px;bottom:154px;z-index:61;width:min(270px,calc(100vw - 40px));background:#fff;border:2px solid var(--pink);border-radius:16px 16px 4px 16px;padding:12px 14px 12px;box-shadow:0 14px 34px rgba(230,0,126,.25);animation:cbTipIn .35s ease-out}
.cb-tip p{margin:0 18px 10px 0;font-size:15px;font-weight:800;line-height:1.45;cursor:pointer;color:var(--ink)}
.cb-tip .go{font:inherit;font-size:14px;font-weight:800;background:var(--pink);color:#fff;border:0;border-radius:999px;padding:8px 14px;cursor:pointer}
.cb-tip .x{position:absolute;top:4px;right:6px;border:0;background:none;font-size:20px;line-height:1;color:var(--mute);cursor:pointer;padding:4px}
.cb-fab.nudge{animation:cbWig 1.2s ease-in-out 2}
@keyframes cbTipIn{from{opacity:0;transform:translateY(10px)}to{opacity:1;transform:none}}
@keyframes cbWig{0%,100%{transform:none}20%{transform:rotate(-10deg)}40%{transform:rotate(9deg)}60%{transform:rotate(-6deg)}80%{transform:rotate(4deg)}}
@media (max-width:900px){.cb-tip{right:12px;bottom:128px}}
@media (prefers-reduced-motion:reduce){.cb-tip,.cb-fab.nudge{animation:none}}

/* ===== 인사하는 로봇 · 깜빡이는 버튼 얼굴 (10/18) ===== */
.cb-fab.hide{opacity:0;pointer-events:none;transform:scale(.6)}
.cb-fab{transition:opacity .3s,transform .3s}
.cb-face{position:relative;display:block;border-radius:50%;overflow:hidden;animation:cbFloat 3.2s ease-in-out infinite}
.cb-lid{position:absolute;background:#1E1117;border-radius:40%;transform:scaleY(0);transform-origin:top;animation:cbBlink 4.6s infinite;pointer-events:none}
.cb-face .l1{left:25%;top:48%;width:13%;height:11%}.cb-face .l2{left:46%;top:52%;width:14%;height:14%}
.cb-hero{position:fixed;right:14px;bottom:62px;z-index:62;display:flex;align-items:flex-end;gap:6px;pointer-events:none}
.cb-hero>*{pointer-events:auto}
.cb-hero-r{position:relative;width:150px;aspect-ratio:288/258;padding:0;border:0;border-radius:28px;background:#fff;box-shadow:0 16px 40px rgba(230,0,126,.3);overflow:hidden;cursor:pointer;transform-origin:50% 90%;
  animation:cbPop .55s cubic-bezier(.2,1.4,.4,1) both,cbWave 1.1s ease-in-out .6s 2}
.cb-hero-r img{width:100%;height:100%;display:block}
.cb-hero-r .h1{left:48.6%;top:32.5%;width:8.6%;height:7.4%}.cb-hero-r .h2{left:62.8%;top:35.3%;width:9%;height:9.6%}
.cb-hero-b{position:relative;margin-bottom:58px;width:min(250px,calc(100vw - 196px));background:#fff;border:2px solid var(--pink);border-radius:16px 16px 4px 16px;padding:12px 14px;box-shadow:0 14px 34px rgba(230,0,126,.22);animation:cbTipIn .35s ease-out .45s both}
.cb-hero-b p{margin:0 16px 0 0;font-size:15px;font-weight:800;line-height:1.45;color:var(--ink);cursor:pointer}
.cb-hero.talk .cb-hero-b p{animation:cbTipIn .3s ease-out}
.cb-hero-b .go{margin-top:10px;font:inherit;font-size:14px;font-weight:800;background:var(--pink);color:#fff;border:0;border-radius:999px;padding:8px 14px;cursor:pointer}
.cb-hero-b .x{position:absolute;top:2px;right:4px;border:0;background:none;font-size:20px;line-height:1;color:var(--mute);cursor:pointer;padding:4px}
.cb-hero.out{transition:opacity .4s,transform .4s;opacity:0;transform:translateY(30px) scale(.7);transform-origin:100% 100%}
@keyframes cbPop{0%{opacity:0;transform:translateY(120px) scale(.5)}100%{opacity:1;transform:none}}
@keyframes cbWave{0%,100%{transform:rotate(0)}20%{transform:rotate(-9deg) translateY(-6px)}45%{transform:rotate(8deg)}70%{transform:rotate(-5deg) translateY(-3px)}}
@keyframes cbBlink{0%,92%,100%{transform:scaleY(0)}95%{transform:scaleY(1)}}
@keyframes cbFloat{0%,100%{transform:translateY(0)}50%{transform:translateY(-3px)}}
@media (min-width:901px){.cb-hero{right:20px;bottom:70px}.cb-hero-r{width:180px}.cb-hero-b{margin-bottom:76px}}
@media (prefers-reduced-motion:reduce){.cb-hero-r,.cb-hero-b,.cb-face,.cb-lid{animation:none}}

body .mbar a{padding:15px 8px;font-size:17px}
@media (min-width:901px){body{padding-bottom:56px}body .mbar a{padding:15px 16px;font-size:18px}.cb-fab{bottom:74px}.cb-panel{bottom:162px}.cb-tip{bottom:162px}.cb-hero{bottom:78px}}
@media (max-width:900px){body{padding-bottom:52px}.cb-fab{bottom:64px}.cb-tip{bottom:136px}.cb-hero{bottom:66px}}

/* ===== 챗봇: 비교넷 「또봇」 꼴 (10/18) ===== */
html body .cb-hero,html body .cb-tip{display:none!important}
html body .cb-panel.bf{right:16px;width:min(350px,calc(100vw - 32px));max-height:min(620px,calc(100vh - 230px));min-height:280px;border:2px solid var(--pink);border-radius:18px;overflow:visible;background:#fff;box-shadow:0 16px 40px rgba(30,17,23,.24)}
html body .cb-panel.bf.on{animation:bfFade .3s ease}
html body .cb-panel.bf .cb-h{position:relative;display:block;text-align:center;background:#fff;color:var(--ink);padding:60px 64px 10px;border-bottom:1px solid var(--line);border-radius:18px 18px 0 0}
.bf-av{position:absolute;left:50%;top:-54px;margin-left:-54px;width:108px;height:108px;border-radius:50%;border:3px solid var(--pink);overflow:hidden;background:#fff;box-shadow:0 8px 20px rgba(230,0,126,.3);z-index:2}
.bf-z{position:absolute;inset:0}
.bf-z img{position:absolute;inset:0;width:100%;height:100%;display:block;max-width:none}
.bf-e{position:absolute;background:#1c0b15;border-radius:46%;box-shadow:0 0 2px 1px #1c0b15}
.bf-e.e1{left:25%;top:48.5%;width:14%;height:12.5%}.bf-e.e2{left:45.5%;top:53.5%;width:14.5%;height:12.5%;transform:rotate(8deg)}
.bf-e::before{content:"";position:absolute;left:18%;top:10%;width:64%;height:80%;border-radius:50%;background:radial-gradient(circle at 34% 30%,#fff 0 18%,transparent 20%),radial-gradient(circle,#ff7ac1 0 45%,#e6007e 100%);box-shadow:0 0 6px 1px rgba(255,90,180,.8);animation:bfLook 6s ease-in-out infinite}
.bf-av.talk .bf-e::before{animation:bfTalk .5s ease-in-out infinite}
.bf-av.happy{animation:bfHop .5s ease-in-out 2}
.bf-av.happy .bf-e{display:none}
.bf-btn.beg .bf-e::before{animation:bfPlead 5.5s ease-in-out infinite}
@keyframes bfLook{0%,100%{transform:translate(0,0) scaleY(1)}16%{transform:translate(-14%,0)}34%{transform:translate(14%,-6%)}52%{transform:translate(0,6%)}78%{transform:translate(0,0) scaleY(1)}82%{transform:scaleY(.08)}86%{transform:scaleY(1)}}
@keyframes bfPlead{0%,100%{transform:translate(0,-6%) scale(1.08)}28%{transform:translate(8%,-8%) scale(1.08)}52%{transform:translate(-8%,-6%) scale(1.08)}68%{transform:translate(0,8%) scale(1.08)}88%{transform:translate(0,-6%) scale(1.08)}92%{transform:translate(0,-6%) scale(1.08,.08)}96%{transform:translate(0,-6%) scale(1.08)}}
@keyframes bfTalk{0%,100%{transform:scaleY(1)}50%{transform:scaleY(.25)}}
@keyframes bfHop{0%,100%{transform:translateY(0)}50%{transform:translateY(-8px)}}
@keyframes bfFade{from{opacity:0;transform:translateY(10px) scale(.97)}to{opacity:1;transform:none}}
@keyframes bfRing{0%,100%{box-shadow:0 8px 22px rgba(230,0,126,.3),0 0 0 0 rgba(230,0,126,.35)}50%{box-shadow:0 8px 22px rgba(230,0,126,.3),0 0 0 9px rgba(230,0,126,0)}}
.bf-n{font-weight:900;font-size:16px;line-height:1.25}.bf-n small{display:block;font-weight:700;font-size:12px;color:var(--mute)}
.cb-panel.bf .cb-h .bf-rs{position:absolute;left:10px;top:10px;border:1.5px solid var(--line);background:#fff;color:var(--ink);font:inherit;font-size:12.5px;font-weight:800;border-radius:999px;padding:5px 10px;cursor:pointer;white-space:nowrap}
.cb-panel.bf .cb-h .bf-rs:hover{border-color:var(--pink);color:var(--pink)}
html body .cb-panel.bf .cb-h .bf-x{position:absolute;right:6px;top:4px;border:0;background:none;color:var(--ink);font:inherit;font-size:26px;line-height:1;padding:4px 10px;cursor:pointer}
html body .cb-panel.bf .cb-log{background:#fff;padding:12px;gap:8px;min-height:150px;overscroll-behavior:contain;border-radius:0}
html body .cb-panel.bf .cb-m{font-size:14.5px;line-height:1.55;font-weight:700;word-break:keep-all;max-width:92%;padding:9px 12px}
html body .cb-panel.bf .cb-m.bot{background:#FDEAF4;border:0;border-radius:14px 14px 14px 4px;color:var(--ink)}
html body .cb-panel.bf .cb-m.me{background:var(--pink);color:#fff;border-radius:14px 14px 4px 14px}
html body .cb-panel.bf .cb-m.wait{color:var(--mute);letter-spacing:3px}
html body .cb-panel.bf .cb-ch button{border-color:var(--pink);font-weight:800;padding:8px 13px}
html body .cb-panel.bf .cb-ch button:hover{background:var(--pink);color:#fff}
html body .cb-panel.bf .cb-lead input[name=n]{display:none}
.bf-call{display:block;text-align:center;text-decoration:none;color:var(--ink);font-weight:800;font-size:14px;padding:10px;border-top:1px solid var(--line);border-radius:0 0 16px 16px;background:#fff}
.bf-call:hover{color:var(--pink)}
html body .cb-fab.bf-btn{width:112px;height:112px;padding:0;border:3px solid var(--pink);background:#fff;border-radius:50%;overflow:hidden;animation:bfRing 2.8s ease-in-out infinite}
html body .cb-fab.bf-btn .bf-av--b{left:0;top:0;margin:0;width:100%;height:100%;border:0;box-shadow:none;border-radius:50%}
html body .cb-fab.bf-btn.nudge{animation:cbWig 1.2s ease-in-out 1}
html body .cb-panel.on~.cb-fab.bf-btn{display:none}
.bf-tip{position:fixed;right:20px;z-index:61;max-width:min(270px,calc(100vw - 40px));background:#fff;border:2px solid var(--pink);border-radius:14px;padding:10px 13px;font-size:14px;line-height:1.5;font-weight:800;color:var(--ink);box-shadow:0 8px 22px rgba(30,17,23,.2);cursor:pointer;animation:cbTipIn .3s ease}
.bf-tip b{color:var(--pink)}
.bf-tip::after{content:"";position:absolute;right:46px;bottom:-9px;width:14px;height:14px;background:#fff;border-right:2px solid var(--pink);border-bottom:2px solid var(--pink);transform:rotate(45deg)}
.bf-tip[hidden]{display:none}
.cb-panel.bf button:focus-visible,.bf-tip:focus-visible,.bf-call:focus-visible{outline:3px solid var(--violet);outline-offset:2px}
@media (min-width:901px){html body .cb-fab.bf-btn{right:20px;bottom:72px}html body .cb-panel.bf{right:20px;bottom:76px}.bf-tip{bottom:198px}}
@media (max-width:900px){html body .cb-fab.bf-btn{right:12px;bottom:64px;width:84px;height:84px}
  html body .cb-panel.bf{right:8px;bottom:64px;width:min(350px,calc(100vw - 16px));max-height:min(70vh,calc(100vh - 170px))}
  html body .cb-panel.bf .cb-h{padding:46px 56px 8px}.bf-h .bf-av,.cb-h .bf-av{top:-40px;margin-left:-40px;width:80px;height:80px}
  .cb-panel.bf .cb-h .bf-rs{left:6px;top:8px;padding:3px 8px;font-size:11.5px}.bf-n{font-size:15px}
  html body .cb-panel.bf .cb-ch button{padding:7px 10px;font-size:13.5px}
  .bf-tip{right:12px;bottom:158px}.bf-tip::after{right:30px}}
@media (prefers-reduced-motion:reduce){.bf-av,.bf-e::before,.cb-fab.bf-btn,.bf-tip,.cb-panel.bf.on{animation:none!important}}

/* ===== 챗봇 물 빠지기 · 웃는 얼굴 · 단추 손짓 (10/18) ===== */
.bf-av{--lv:30%}
.bf-w{position:absolute;left:-10%;right:-10%;bottom:0;height:var(--lv);z-index:3;pointer-events:none;background:linear-gradient(180deg,rgba(150,214,255,.42),rgba(80,170,245,.55));transition:height 1s cubic-bezier(.3,.7,.3,1)}
.bf-w::before,.bf-w::after{content:"";position:absolute;left:0;width:200%;height:12px;top:-6px;background:radial-gradient(ellipse 14px 6px at 50% 50%,rgba(150,214,255,.6) 98%,transparent 100%) 0 0/28px 12px repeat-x;animation:bfWave 2.2s linear infinite}
.bf-w::after{top:-3px;opacity:.6;animation-duration:3.4s;animation-direction:reverse}
@keyframes bfWave{from{transform:translateX(0)}to{transform:translateX(-28px)}}
.bf-mo,.bf-ht{position:absolute;opacity:0;pointer-events:none;z-index:4}
.bf-mo{left:35%;top:61%;width:17%;height:8%;border:0 solid #ff7ac1;border-bottom-width:3px;border-radius:0 0 60% 60%;transform:rotate(7deg);filter:drop-shadow(0 0 3px rgba(255,90,180,.9))}
.bf-ht{color:#ff4fa3;font-style:normal;font-size:18px;line-height:1;text-shadow:0 0 4px #fff}
.bf-ht.h1{left:12%;top:20%}.bf-ht.h2{right:10%;top:12%;font-size:14px}
.bf-av.smile .bf-e{display:none}
.bf-av.smile .bf-mo{opacity:1;transition:opacity .4s .5s}
.bf-av.smile .bf-ht{animation:bfHeart 1.6s ease-out .4s 2}
.bf-av.smile{animation:bfHop .5s ease-in-out .3s 3}
@keyframes bfHeart{0%{opacity:0;transform:translateY(6px) scale(.6)}30%{opacity:1;transform:translateY(0) scale(1.1)}100%{opacity:0;transform:translateY(-18px) scale(.9)}}
html body .cb-panel.bf .cb-log{position:relative;padding-bottom:30px}
html body .cb-panel.bf .cb-log>[hidden]{display:none!important}
html body .cb-panel.bf .cb-ch button.lit{background:linear-gradient(90deg,#FFD9EC 0 50%,#fff 50% 100%) 0 0/200% 100% no-repeat;animation:bfLit .6s ease-out;box-shadow:0 4px 12px rgba(230,0,126,.22)}
@keyframes bfLit{from{background-position:100% 0}to{background-position:0 0}}
.bf-ptr{position:absolute;left:0;top:0;z-index:5;width:24px;height:30px;pointer-events:none;transition:transform .55s cubic-bezier(.3,.8,.3,1);filter:drop-shadow(0 3px 4px rgba(30,17,23,.3))}
.bf-ptr svg{display:block}
.bf-ptr img{position:absolute;left:13px;top:17px;width:26px;height:26px;border-radius:50%;border:2px solid #E6007E;background:#fff;max-width:none}
.bf-ptr.tap svg{animation:bfTap .5s ease-in-out .5s}
@keyframes bfTap{0%,100%{transform:none}45%{transform:translate(1px,2px) scale(.86)}}
@media (prefers-reduced-motion:reduce){.bf-w,.bf-w::before,.bf-w::after,.bf-av.smile,.bf-av.smile .bf-ht,.bf-ptr,.bf-ptr svg{animation:none!important;transition:none}}

/* ===== 개인정보처리방침 (10/19) ===== */
.pv{padding-block:48px 72px;background:#fff}
.pv-w{max-width:820px}
.pv-eb{margin:0;color:var(--pink);font-weight:800;font-size:14px}
.pv h1{margin:6px 0 14px;font-size:34px;letter-spacing:-.03em}
.pv-lead{font-size:16px;line-height:1.7;color:var(--ink2)}
.pv-toc{background:#FBFAFF;border:1px solid var(--line);border-radius:16px;padding:16px 16px 16px 36px;display:grid;gap:4px;font-size:15px}
.pv-toc a{color:var(--ink)}
.pv h2{margin:34px 0 10px;font-size:21px;letter-spacing:-.02em;scroll-margin-top:90px}
.pv p,.pv li{font-size:15px;line-height:1.75;color:var(--ink2)}
.pv ul{padding-left:20px;margin:0}
.pv-t{width:100%;border-collapse:collapse;font-size:14.5px;margin:6px 0 10px}
.pv-t th,.pv-t td{border:1px solid var(--line);padding:10px 12px;text-align:left;vertical-align:top;line-height:1.6}
.pv-t th{background:#F7F5FF;white-space:nowrap;font-weight:800}
.pv-co{margin-top:34px;font-size:13px;color:var(--mute)}
.ft2-pv{color:inherit;font-weight:800;text-decoration:underline;margin-right:12px}
@media (max-width:640px){.pv h1{font-size:27px}.pv-t th{white-space:normal}}

/* ===== 챗봇 위치 맞춤 말풍선: 옮겨 간 칸 반짝 (10/19) ===== */
.bf-flash{animation:bfFlash 2.2s ease-out;border-radius:18px}
/* 10/19 가장 작은 휴대폰(320)에서 페이지가 25px 넘치던 것: 상품권 상자 글자·상품 고르기 단추 */
@media (max-width:360px){
  .bc-gift .bc-vch{display:none}.bc-gift p{min-width:0}.bc-gift b{white-space:normal}
  .md-chip{gap:6px;padding:10px 8px}.md-chip img{width:28px;height:28px}.md-chip span{min-width:0;word-break:keep-all}
  .md-chip i{width:22px;height:22px}.md-chip.on i::after{left:6px;top:2px}
}
/* 지나간 말풍선: 새 말이 나오면 위로 밀려 흐리게 (10/19) */
.bf-mtip{position:absolute;left:0;top:0;z-index:59;max-width:min(300px,calc(100vw - 32px));background:#fff;border:2px solid var(--pink);border-radius:14px;padding:9px 12px;font-size:14px;line-height:1.5;font-weight:800;color:var(--ink);box-shadow:0 8px 20px rgba(30,17,23,.18);cursor:pointer;opacity:0;transform:translateY(6px);transition:opacity .3s ease,transform .3s ease}
.bf-mtip.on{opacity:1;transform:none}.bf-mtip[hidden]{display:none}.bf-mtip b{color:var(--pink)}
.bf-mtip::after{content:"";position:absolute;left:var(--ax,20px);bottom:-8px;width:12px;height:12px;background:#fff;border-right:2px solid var(--pink);border-bottom:2px solid var(--pink);transform:rotate(45deg)}
@media (min-width:901px){.bf-mtip{font-size:16px;padding:11px 14px;max-width:340px}}
@media (prefers-reduced-motion:reduce){.bf-mtip{transition:none;transform:none}}
.bf-mini{position:absolute;left:0;top:0;z-index:58;width:40px;height:40px;border-radius:50%;border:2px solid var(--pink);background:#fff;overflow:hidden;box-shadow:0 6px 16px rgba(230,0,126,.28);opacity:0;pointer-events:none;transition:left .9s cubic-bezier(.4,0,.2,1),top .9s cubic-bezier(.4,0,.2,1),opacity .45s ease}
.bf-mini img{width:100%;height:100%;object-fit:cover;display:block}
@media (prefers-reduced-motion:reduce){.bf-mini{transition:opacity .3s}}
.bf-dns{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.bf-dn{display:inline-block;padding:6px 11px;border-radius:999px;background:#FDE6F2;color:#C2185B;font-weight:800;cursor:pointer;border:1.5px solid #F7B6D8}.bf-dn:hover{background:#E86AAE;color:#fff}
.bf-stk{position:fixed;z-index:60;display:flex;flex-direction:column;align-items:flex-end;gap:8px;pointer-events:none}
.bf-old{background:#fff;border:2px solid #F7B6D8;border-radius:14px;padding:8px 12px;font-size:13px;line-height:1.45;font-weight:700;color:#7D7787;max-width:min(250px,calc(100vw - 40px));box-shadow:0 6px 16px rgba(30,17,23,.12);animation:bfUp .35s ease}   /* 배경은 불투명: 뒤 글자가 비치지 않게, 글자만 흐리게 */
.bf-old:first-child:not(:last-child){color:#A9A3B3;border-color:#FBD9EA}
.bf-old b{color:#E86AAE}
.bf-old:first-child:not(:last-child) b{color:#F1A3CC}
@keyframes bfUp{from{transform:translateY(16px);opacity:0}}
@media (min-width:901px){.bf-old{font-size:15px;padding:10px 14px;max-width:320px}}
.bf-stk.bf-bob{animation:bfBob 2.6s ease-in-out infinite}
@media (prefers-reduced-motion:reduce){.bf-old{animation:none}}
/* 챗봇 둥실 (10/19): transform 대신 translate 를 써서 원래 움직임(톡톡·등장)과 겹쳐도 깨지지 않게 */
html body .cb-fab.bf-btn.bf-bob{animation:bfRing 2.8s ease-in-out infinite,bfBob 2.6s ease-in-out infinite}
html body .cb-fab.bf-btn.bf-bob.nudge{animation:cbWig 1.2s ease-in-out 1,bfBob 2.6s ease-in-out infinite}
.bf-tip.bf-bob{animation:cbTipIn .3s ease,bfBob 2.6s ease-in-out infinite}
@keyframes bfBob{0%,100%{translate:0 0}50%{translate:0 -6px}}
/* 챗봇이 말하는 그 줄·카드 짚기 (10/19 교육) */
.bf-spot:not(tr){outline:3px solid rgba(230,0,126,.9);outline-offset:4px;border-radius:12px;animation:bfSpot 1.3s ease-in-out 2}
tr.bf-spot>td,tr.bf-spot>th{background:#FFE3F1!important;transition:background .3s}
@keyframes bfSpot{50%{outline-color:rgba(230,0,126,.25)}}
@keyframes bfFlash{0%{box-shadow:inset 0 0 0 0 rgba(230,0,126,0)}20%{box-shadow:inset 0 0 0 4px rgba(230,0,126,.85),0 0 0 6px rgba(230,0,126,.18)}100%{box-shadow:inset 0 0 0 0 rgba(230,0,126,0)}}
/* 10/19 대표님: PC 말풍선 1.3배 (오른쪽 아래 모서리 고정 → 위·왼쪽으로 커짐) */
@media (min-width:901px){.bf-tip{font-size:18px;padding:13px 17px;max-width:350px;border-radius:18px}}
@media (prefers-reduced-motion:reduce){.bf-flash{animation:none;box-shadow:inset 0 0 0 4px rgba(230,0,126,.85)}}

/* 10/21 정보 글(guide) */
.gd{padding:34px 0 10px}
.gd .wrap{max-width:820px}
.gd-sum{background:var(--lav);border-radius:16px;padding:20px 22px;margin:0 0 30px}
.gd-sum b.t{display:block;font-size:14px;color:var(--violet);margin-bottom:8px;letter-spacing:.02em}
.gd-sum ul{margin:0;padding-left:20px;line-height:1.75;font-size:16px}
.gd h2{font-size:24px;letter-spacing:-.02em;margin:38px 0 14px;line-height:1.35}
.gd h3{font-size:18px;margin:24px 0 8px}
.gd p,.gd li{font-size:16px;line-height:1.8;color:#2b2f38}
.gd .tw{margin:12px 0 8px}
.gd .note{font-size:13.5px;color:var(--mute);line-height:1.7}
.gd-meta{font-size:13.5px;color:var(--mute);margin:-6px 0 22px}
.gd-faq dt{font-weight:800;margin-top:18px;font-size:16px}
.gd-faq dd{margin:6px 0 0;line-height:1.8;font-size:15.5px;color:#2b2f38}
.gd-cta{display:flex;flex-wrap:wrap;gap:10px;margin:30px 0 10px}
.gd-next{border-top:1px solid var(--line);margin-top:34px;padding-top:18px}
.gd-next a{display:block;padding:8px 0;font-weight:700;color:var(--violet)}
.gd-list{display:grid;gap:14px;margin:10px 0 30px}
.gd-list a{display:block;border:1px solid var(--line);border-radius:14px;padding:18px 20px;text-decoration:none;color:inherit}
.gd-list a b{display:block;font-size:18px;margin-bottom:6px;color:#1b1f27}
.gd-list a span{font-size:14.5px;color:var(--mute);line-height:1.6}
@media (max-width:640px){.gd h2{font-size:21px}.gd-sum{padding:16px 16px}.gd-sum ul{font-size:15px}}

.ql{border:0;padding:0;background:transparent;max-width:420px;width:calc(100% - 32px)}
.ql::backdrop{background:rgba(20,16,40,.55)}
.ql-f{position:relative;box-shadow:0 24px 60px rgba(0,0,0,.25)}
.ql-f h3{margin:0 0 4px;font-size:24px}
.ql-eb{margin:0;font-size:14px;color:var(--mute)}.ql-eb b{color:var(--pink)}
.ql-x{position:absolute;right:12px;top:10px;border:0;background:none;font-size:28px;line-height:1;cursor:pointer;color:var(--mute)}

.rgal{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px;margin:18px 0 6px}
.rgal figure{margin:0;background:#fff;border-radius:14px;overflow:hidden;border:1px solid #ECEAF3}
.rgal img{display:block;width:100%;height:auto;aspect-ratio:5/6;object-fit:cover}
.rgal figcaption{padding:8px 10px;font-size:13px;font-weight:700;line-height:1.4}
@media (max-width:900px){.rgal{grid-template-columns:repeat(2,minmax(0,1fr))}}
.hv{display:grid;grid-template-columns:1fr 1.4fr;gap:18px}
.hv-col{background:#fff;border-radius:18px;padding:20px;border:1px solid #ECEAF3}
.hv-col.off{border:2px solid var(--pink)}
.hv-col h3{margin:0 0 12px;font-size:21px}
.hv-img{display:grid;grid-auto-flow:column;grid-auto-columns:1fr;gap:8px;margin-bottom:12px}
.hv-img img{width:100%;height:170px;object-fit:cover;border-radius:12px;display:block}
@media (max-width:900px){.hv{grid-template-columns:1fr}.hv-img img{height:120px}}
.rsame{background:#FFF0F7;border-radius:14px;padding:14px 18px;margin:0 0 14px;font-size:17px;line-height:1.6}
.rsame b{color:var(--pink)}
.rq{background:#fff;border-radius:16px;padding:16px 20px;margin:0 0 10px;border:1px solid #ECEAF3}
.rq summary{font-weight:800;cursor:pointer;font-size:17px}
.rq p{margin:10px 0 0;color:var(--ink);line-height:1.7}

.rsub{font-size:16px;line-height:2}.rsub a{color:var(--pink);font-weight:700}

:root{--sup-red:#E5162B;color-scheme:only light}
.sup-cards{display:grid;gap:14px}
@media (min-width:900px){.sup-cards{grid-template-columns:repeat(3,1fr)}}
.sup-card{position:relative;display:flex;flex-direction:column;gap:2px;padding:22px 22px 20px;border-radius:22px;background:#fff;border:1.5px solid #ececf1;box-shadow:0 10px 28px rgba(20,16,40,.07);overflow:hidden}
.sup-card::before{content:"";position:absolute;inset:0 0 auto 0;height:5px;background:var(--sup-red)}
.sup-top{display:flex;align-items:center;justify-content:space-between;margin-bottom:10px}
.sup-ico{width:44px;height:44px;border-radius:14px;display:grid;place-items:center;background:#fff1f2}
.sup-ico svg{width:24px;height:24px;fill:var(--sup-red)}
.sup-tag{font-size:13px;font-weight:800;padding:5px 11px;border-radius:999px;background:#fff1f2;color:var(--sup-red)}
.sup-who{font-size:19px;font-weight:800}.sup-org{font-size:13.5px;color:var(--mute)}
.sup-num{font-size:42px;font-weight:900;letter-spacing:-1px;line-height:1.15;margin:8px 0 2px;color:#111;text-decoration:none}
.sup-desc{font-size:14.5px;color:var(--mute);margin-bottom:16px}
.sup-call{margin-top:auto;display:flex;align-items:center;justify-content:center;gap:8px;padding:15px;border-radius:14px;background:var(--sup-red);color:#fff;font-weight:800;font-size:17px;text-decoration:none;box-shadow:0 8px 18px rgba(229,22,43,.28);transition:transform .12s,box-shadow .12s}
.sup-call svg{width:20px;height:20px;fill:#fff}.sup-call:hover{transform:translateY(-1px);box-shadow:0 12px 24px rgba(229,22,43,.36)}
.sup-ours{background:linear-gradient(150deg,#e6007e 0%,#b5006a 100%);border-color:transparent;color:#fff;box-shadow:0 16px 36px rgba(181,0,106,.32)}
.sup-ours::before{background:#ffd23f}
.sup-ours .sup-ico{background:rgba(255,255,255,.18)}.sup-ours .sup-ico svg{fill:#fff}
.sup-ours .sup-tag{background:#ffd23f;color:#3a2a00}
.sup-ours .sup-org,.sup-ours .sup-desc{color:rgba(255,255,255,.85)}.sup-ours .sup-num{color:#fff}
.sup-ours .sup-call{background:#fff;color:#b5006a;box-shadow:0 8px 18px rgba(0,0,0,.18)}.sup-ours .sup-call svg{fill:#b5006a}
.sup-cb{display:grid;gap:18px}
@media (min-width:900px){.sup-cb{grid-template-columns:1fr 1.3fr;align-items:stretch}}
/* 10/30 대표님 「빈칸없이」 — PC 에서 왼쪽 「이런 걸 계산해 드려요」 4줄이 카드 높이를 꽉 채우게 */
@media (min-width:900px){.sup-cb-l h3{font-size:23px;margin-bottom:14px}.sup-cb-l .chk{flex:1;display:flex;flex-direction:column;gap:10px;margin:0}
.sup-cb-l .chk li{flex:1;display:flex;align-items:center;padding:12px 18px;border-radius:14px;background:#fff4f8;font-size:18px;line-height:1.45;word-break:keep-all}
.sup-cb-l .chk li::before{margin-right:10px;font-size:20px}
.sup-cb-n{padding-top:12px}}
.sup-cb-l{background:#fff;border-radius:20px;padding:22px;box-shadow:0 14px 34px rgba(20,16,40,.10);display:flex;flex-direction:column}
.sup-cb-l .chk{gap:12px;font-size:16px}.sup-cb-n{margin-top:auto!important;padding-top:14px}
.sup-cb-l h3{margin:0 0 10px;font-size:20px}.sup-cb-n{margin:12px 0 0;font-size:14px;color:var(--mute)}
.sup-form{display:grid;gap:16px;background:#fff;border-radius:20px;padding:22px;box-shadow:0 14px 34px rgba(20,16,40,.10)}
.sup-row{display:grid;gap:8px}.sup-lb{font-weight:800;font-size:15px}
.sup-tel{font:inherit;font-size:21px;padding:14px;border:1.5px solid #dcdce4;border-radius:12px}
.sup-tel:focus{outline:none;border-color:var(--pink);box-shadow:0 0 0 3px rgba(230,0,126,.15)}
.sup-chips{display:flex;flex-wrap:wrap;gap:8px}
.sup-chip{position:relative}.sup-chip input{position:absolute;inset:0;width:1px;height:1px;margin:0;opacity:0;pointer-events:none}   /* 10/23 숨은 라디오가 width:100%로 화면 밖까지 늘어 휴대폰 페이지 폭 672px·챗봇 화면 밖 → 고침 */
.sup-chip span{display:inline-block;padding:9px 14px;border-radius:999px;border:1.5px solid #dcdce4;font-size:14.5px;cursor:pointer;background:#fff}
.sup-chip input:checked+span{border-color:var(--pink);background:var(--pink);color:#fff;font-weight:700}
.sup-chip input:focus-visible+span{outline:2px solid var(--pink);outline-offset:2px}
.sup-ag{display:flex;align-items:center;gap:8px;font-size:14px;color:var(--mute)}.sup-ag input{width:18px;height:18px;margin:0;flex:none}
.sup-go2{font:inherit;font-weight:800;font-size:18px;background:var(--pink);color:#fff;border:0;border-radius:14px;padding:17px;cursor:pointer;box-shadow:0 10px 22px rgba(230,0,126,.28)}
.sup-go2:disabled{opacity:.6}.sup-msg{margin:0;font-weight:700}.sup-msg.ok{color:#0a7d33}.sup-msg.no{color:var(--sup-red)}
.sup-fine{margin:0;font-size:13px;color:var(--mute)}
.sup-speed{display:grid;gap:14px;align-items:center}
@media (min-width:900px){.sup-speed{grid-template-columns:2fr auto 1fr}}
.sup-sp-bad{display:grid;grid-template-columns:1fr 1fr;gap:12px}
.sup-sp-arrow{font-size:34px;font-weight:900;color:var(--pink);text-align:center}
.sup-speed .sup-fig img{object-fit:contain;background:#fff;padding:6px}
@media (max-width:899px){.sup-sp-arrow{transform:rotate(90deg)}}
.sup-fig{margin:0;border-radius:16px;overflow:hidden;background:#fff;border:1.5px solid #ececf1}
.sup-fig img{display:block;width:100%;height:190px;object-fit:cover}
.sup-fig figcaption{padding:10px 12px;font-size:13.5px;font-weight:700}
.sup-fig.bad{border-color:#ffd0d4}.sup-fig.bad figcaption{color:var(--sup-red)}
.sup-fig.good{border-color:#bfe8cc}.sup-fig.good figcaption{color:#0a7d33}
.sup-steps{margin:18px 0 0;padding-left:22px;display:grid;gap:8px;line-height:1.6}
.sup-down{display:grid;gap:16px;align-items:start}
@media (min-width:900px){.sup-down{grid-template-columns:1.2fr 1fr}}
.sup-down-im{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.sup-down .sup-steps{margin:0}
.sup-vids{display:grid;grid-template-columns:repeat(4,1fr);gap:16px}
@media (max-width:899px){.sup-vids{display:flex;overflow-x:auto;scroll-snap-type:x mandatory;gap:12px;padding-bottom:8px;margin-inline:-16px;padding-inline:16px}.sup-vid{flex:0 0 72%;scroll-snap-align:center}}
.sup-vid{margin:0}
.sup-vid-f{border-radius:22px;overflow:hidden;background:#16163a;aspect-ratio:9/16;box-shadow:0 16px 36px rgba(20,10,60,.22)}
.sup-vid-f video{display:block;width:100%;height:100%;object-fit:cover}
.sup-vid figcaption{display:flex;justify-content:space-between;align-items:center;gap:8px;padding:10px 4px 0;font-size:15px}
.sup-vid figcaption a{font-size:13.5px;color:var(--pink);font-weight:700;text-decoration:none;white-space:nowrap}
.sup-ba{display:grid;gap:16px}
@media (min-width:900px){.sup-ba{grid-template-columns:1fr 1fr}}
.sup-ba-t{display:inline-block;font-weight:900;font-size:14px;padding:6px 14px;border-radius:999px;margin-bottom:10px;color:#fff}
.sup-ba-t.bad{background:var(--sup-red)}.sup-ba-t.good{background:#0a7d33}
.sup-ba-im{display:grid;grid-template-columns:1fr 1fr;gap:10px}
.sup-ba-im .sup-fig img{height:240px}
.sup-pill{display:inline-block;font-weight:800;padding:3px 10px;border-radius:999px;background:#fdeef6;color:var(--pink);text-decoration:none;white-space:nowrap}
.sup-pill.red{background:var(--sup-red);color:#fff}
.sup-tag{font-size:18px;padding:7px 16px;letter-spacing:-.3px}   /* 10/27 대표님 「고장·장애 글씨 키우기, 아래들도」 */
/* 10/27 인터넷이 안 되시나요 — 따라 하기 */
.fx-stage{margin-bottom:24px}.fx-stage:last-child{margin-bottom:0}
.fx-sh{display:flex;align-items:center;gap:10px;font-size:22px;font-weight:900;margin:0 0 12px;line-height:1.3}.fx-sh em{font-style:normal;color:var(--pink)}.fx-sh em.r{color:var(--sup-red)}
.fx-badge{flex:none;font-size:15px;font-weight:900;padding:6px 12px;border-radius:10px;background:var(--pink);color:#fff}.fx-badge.red{background:var(--sup-red)}.fx-badge.dark{background:#111}
.fx-new{background:linear-gradient(150deg,#fdeef6,#fff);border-color:#f7c6e0}.fx-new .fx-n{background:#111}
.fx-cta{display:flex;gap:8px;margin-top:14px}.fx-cta a{flex:1;text-align:center;padding:14px 8px;border-radius:12px;font-weight:900;font-size:16.5px;text-decoration:none}
.fx-c1{background:var(--pink);color:#fff;box-shadow:0 8px 18px rgba(230,0,126,.28)}.fx-c2{background:#fff;color:var(--pink);border:1.5px solid var(--pink)}
.fx-fine{margin:10px 0 0;font-size:13px;color:var(--mute)}
@media (min-width:900px){.fx-stage:not(:first-child){max-width:66%}}
.fx{display:grid;gap:14px}
@media (min-width:900px){.fx{grid-template-columns:repeat(3,1fr)}.fx-wide{grid-column:span 2}}
.fx-step{position:relative;background:#fff;border-radius:20px;padding:20px 18px 18px;box-shadow:0 12px 30px rgba(20,16,40,.08);border:1.5px solid #ececf1}
.fx-step h3{margin:0 0 12px 44px;font-size:20px;line-height:1.35;min-height:34px;display:flex;align-items:center;flex-wrap:wrap;gap:4px}
.fx-step h3 em{font-style:normal;color:var(--pink)}.fx-step h3 small{font-size:20px;color:var(--pink);font-weight:900}   /* 10/27 대표님 「두 개 모두」 글씨 키우기 */
.fx-n{position:absolute;left:16px;top:18px;width:36px;height:36px;border-radius:50%;background:var(--pink);color:#fff;font-weight:900;font-size:19px;display:grid;place-items:center}
.fx-vid{position:relative;border-radius:16px;overflow:hidden;background:#16163a;aspect-ratio:9/16;max-height:520px;margin:0 auto;cursor:pointer}
.fx-vid video{display:block;width:100%;height:100%;object-fit:cover}
.fx-pp{position:absolute;inset:auto auto 12px 12px;width:46px;height:46px;border-radius:50%;border:0;background:rgba(0,0,0,.55);color:#fff;font-size:16px;font-weight:900;cursor:pointer}
.fx-vid.paused::after{content:"▶ 누르면 다시 재생";position:absolute;inset:0;display:grid;place-items:center;background:rgba(0,0,0,.35);color:#fff;font-weight:900;font-size:19px}
.fx-vbar{display:flex;align-items:center;gap:8px;margin-top:10px;font-size:14.5px}.fx-vbar span{flex:1;color:var(--mute)}
.fx-vbar button{font:inherit;font-weight:800;font-size:14px;padding:7px 12px;border-radius:999px;border:1.5px solid #dcdce4;background:#fff;cursor:pointer}
.fx-vbar button.on{background:var(--pink);border-color:var(--pink);color:#fff}
.fx-fig{margin:0;border-radius:14px;overflow:hidden;border:1.5px solid #ececf1;background:#fff}
.fx-fig img{display:block;width:100%;height:auto}.fx-fig figcaption{padding:9px 12px;font-size:14.5px}
.fx-ul{margin:12px 0 0;padding-left:20px;display:grid;gap:6px;font-size:16px;line-height:1.5}
.fx-p{margin:0 0 12px;font-size:16px;line-height:1.6}
.fx-anim{background:#f6f4fb;border-radius:16px;padding:12px 12px 14px;text-align:center}
.fx-svg{display:block;width:100%;max-width:520px;margin:0 auto;height:auto}
.fx-plug{transition:transform 2.6s cubic-bezier(.45,0,.25,1)}.fx-anim.out .fx-plug{transform:translateX(-78px)}
.fx-led{fill:#3a3a44;transition:fill .4s}.fx-anim.on .fx-led{fill:#38d26a}.fx-anim.boot .fx-led{animation:fxb 1s steps(2) infinite}
@keyframes fxb{0%{fill:#38d26a}50%{fill:#3a3a44}}
.fx-ring{opacity:0;transition:opacity .4s}.fx-anim.wait .fx-ring{opacity:1}
.fx-say{margin:6px 0 8px;font-size:21px;font-weight:900;color:#111}
.fx-dots{display:flex;flex-wrap:wrap;justify-content:center;gap:6px;margin-bottom:10px}
.fx-dots span{font-size:13.5px;font-weight:800;padding:5px 10px;border-radius:999px;background:#fff;color:#9a9aa8;border:1.5px solid #ececf1}
.fx-dots span.on{background:var(--pink);border-color:var(--pink);color:#fff}
.fx-go{font:inherit;font-weight:800;font-size:16px;padding:11px 18px;border-radius:12px;border:0;background:#111;color:#fff;cursor:pointer}
.fx-jacks{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-top:12px}
.fx-fig.zoom img{aspect-ratio:1/1;object-fit:cover}
.fx-last{display:block;text-decoration:none;color:inherit;background:linear-gradient(150deg,#fff1f2,#fff);border-color:#ffd0d4}
.fx-last .fx-n{background:var(--sup-red)}.fx-last .fx-p{font-size:17px}.fx-last .fx-p b{color:var(--sup-red)}
.fx-down{display:block;text-align:center;font-size:34px;font-weight:900;color:var(--sup-red);animation:fxd 1.4s ease-in-out infinite}
@keyframes fxd{50%{transform:translateY(6px)}}
@media (max-width:899px){.fx-vid,.fx-gvid{max-height:min(82svh,700px);width:min(100%,calc(min(82svh,700px) * .5625))}}   /* 10/27 대표님 「모바일 영상 좌우로 조금 키우고」 70→82svh */
.fx-gvid{position:relative;border-radius:16px;overflow:hidden;background:#16163a;aspect-ratio:9/16;max-height:620px;margin:0 auto 16px}
.fx-gvid video{display:block;width:100%;height:100%;object-fit:cover}
.fx-new .fx-gvid+.fx-n{top:auto;position:static;display:inline-grid;vertical-align:middle;margin-right:8px}.fx-new .fx-gvid~h3{margin-left:0;display:inline-flex}

/* 10/30 3차 — 요금 영상 박스 위아래로 크게, 신규 홍보 칸 */
#rates .tour-v .tv-m{aspect-ratio:4/5!important;object-fit:cover}#rates .tour-v .tv-w{aspect-ratio:16/9!important;object-fit:cover}   /* 10/31 가로판은 16:9 */
@media (min-width:900px){#rates .tour-box{grid-template-columns:minmax(0,1fr) 560px!important}#rates .tour-v.has-w{padding:28px 28px 28px 0}#rates .tour-box{min-height:420px}#rates .tour-t{padding:64px 48px;gap:26px}#rates .tour-t h3{font-size:42px}#rates .tour-t ul{font-size:20px;gap:16px}#rates .tour-guide{font-size:18px}}
@media (max-width:899px){#rates .tour-t{padding:36px 24px;gap:18px}#rates .tour-t h3{font-size:28px}#rates .tour-t ul{font-size:17px;gap:12px}}
.sup-new{background:radial-gradient(800px 380px at 100% 0%,rgba(255,90,170,.38),rgba(255,90,170,0) 60%),linear-gradient(140deg,#15121f 0%,#3d0a2a 55%,#b0005f 100%);color:#fff;padding:60px 0 66px}
.sup-new-k{margin:0 0 8px;font-weight:800;color:#ffd23f;font-size:16px}
.sup-new-h{margin:0 0 26px;font-size:clamp(26px,6.4vw,40px);line-height:1.3;font-weight:500;word-break:keep-all}.sup-new-h b{font-weight:900}
.sup-new-g{display:grid;gap:14px;grid-template-columns:1fr}
@media (min-width:700px){.sup-new-g{grid-template-columns:1fr 1fr}}
@media (min-width:1100px){.sup-new-g{grid-template-columns:repeat(4,1fr)}}
.sup-new-c{display:flex;flex-direction:column;gap:8px;padding:24px 22px;border-radius:20px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);animation:supNewIn .7s ease-out both}
.sup-new-c:nth-child(2){animation-delay:.15s}.sup-new-c:nth-child(3){animation-delay:.3s}.sup-new-c:nth-child(4){animation-delay:.45s}
.sup-new-i{font-size:34px;animation:supNewBob 2.4s ease-in-out infinite}
.sup-new-c:nth-child(2) .sup-new-i{animation-delay:.3s}.sup-new-c:nth-child(3) .sup-new-i{animation-delay:.6s}.sup-new-c:nth-child(4) .sup-new-i{animation-delay:.9s}
.sup-new-c b{font-size:20px;word-break:keep-all}.sup-new-c span:last-child{font-size:16px;line-height:1.55;color:#f3d9e8;word-break:keep-all}
.sup-new-cta{display:flex;flex-wrap:wrap;gap:12px;margin-top:26px}
.sup-new-cta a{flex:1 1 220px;display:flex;align-items:center;justify-content:center;min-height:60px;border-radius:16px;font-weight:900;font-size:20px;text-decoration:none}
.sup-new-c1{background:#fff;color:#b0005f;animation:supNewGlow 2s ease-in-out infinite}.sup-new-c2{border:2px solid #fff;color:#fff}
.sup-new-f{margin:18px 0 0;font-size:13.5px;line-height:1.6;color:#e7c6d8}
@keyframes supNewIn{from{opacity:0;transform:translateY(14px)}to{opacity:1;transform:none}}
@keyframes supNewBob{50%{transform:translateY(-5px)}}
@keyframes supNewGlow{50%{box-shadow:0 0 0 7px rgba(255,255,255,.22)}}
/* 10/30 4차 — 신규 꼭지 */
.sup-new{padding:64px 0 60px}
.sn-grid{display:grid;gap:26px;align-items:center}
@media (min-width:960px){.sn-grid{grid-template-columns:1.15fr .85fr;gap:44px}}
.sn-k{margin:0 0 12px;display:flex;align-items:center;gap:8px;font-weight:800;color:#ffd23f;font-size:16px}
.sn-dot{width:10px;height:10px;border-radius:50%;background:#ffd23f;animation:snDot 1.2s ease-in-out infinite}
.sn-h{margin:0;font-size:clamp(28px,6.6vw,44px);line-height:1.25;font-weight:600;word-break:keep-all}
.sn-big{display:inline-block;font-size:1.45em;font-weight:900;color:#ffd23f;animation:snPulse 2.2s ease-in-out infinite;transform-origin:left center}
.sn-plus{margin:12px 0 0;display:inline-block;padding:8px 18px;border-radius:999px;background:#fff;color:#b0005f;font-size:20px;font-weight:700;animation:snGlow 2s ease-in-out infinite}
.sn-plus b{font-weight:900}
.sn-b{list-style:none;margin:22px 0 0;padding:0;display:flex;flex-wrap:wrap;gap:10px}
.sn-b li{display:flex;align-items:center;gap:8px;padding:10px 16px;border-radius:14px;background:rgba(255,255,255,.12);border:1px solid rgba(255,255,255,.22);font-size:17px;font-weight:700}
.sn-b li span{font-size:22px;animation:supNewBob 2.4s ease-in-out infinite}.sn-b li:nth-child(2) span{animation-delay:.4s}.sn-b li:nth-child(3) span{animation-delay:.8s}
.sn-q{margin:20px 0 0;font-size:18px;color:#f3d9e8;word-break:keep-all}.sn-q b{color:#fff}
.sn-card{position:relative;background:#fff;color:#1b1530;border-radius:24px;padding:30px 24px 22px;box-shadow:0 24px 60px rgba(0,0,0,.35)}
.sn-gift{position:absolute;right:-10px;top:-46px;width:150px;height:auto;border-radius:12px;box-shadow:0 12px 26px rgba(0,0,0,.3);transform:rotate(8deg);animation:snGift 3s ease-in-out infinite}
.sn-ct{margin:0 0 14px;font-size:22px;font-weight:800;padding-right:110px;word-break:keep-all}.sn-ct b{color:#e6007e}
.sn-card .rn-f{display:grid;gap:10px}
.sn-card .rn-f label[for]{font-size:15px;font-weight:700;color:#4a4560}
.sn-card .rn-f input[type=tel]{font-size:22px;padding:16px 18px;border-radius:14px;border:2px solid #e6007e;width:100%;box-sizing:border-box}
.sn-card .rn-ag{font-size:13px;color:#6b6780;display:flex;gap:6px;align-items:flex-start}
.sn-card .rn-f button{min-height:60px;border:0;border-radius:14px;background:#e6007e;color:#fff;font-size:21px;font-weight:900;cursor:pointer;animation:snBtn 1.8s ease-in-out infinite}
.sn-card .rn-msg{margin:0;font-size:14px;min-height:1em}.sn-card .rn-msg.ok{color:#0a7d33}.sn-card .rn-msg.no{color:#E5162B}
.sn-call{display:flex;flex-direction:column;align-items:center;margin-top:12px;padding:12px;border-radius:14px;border:2px solid #1b1530;color:#1b1530;font-weight:900;font-size:19px;text-decoration:none}
.sn-call small{font-size:12.5px;font-weight:600;color:#6b6780}
.sn-f{margin:26px 0 0;font-size:13px;line-height:1.6;color:#e7c6d8}
@keyframes snDot{50%{opacity:.25}}
@keyframes snPulse{50%{transform:scale(1.05)}}
@keyframes snGlow{50%{box-shadow:0 0 0 8px rgba(255,255,255,.18)}}
@keyframes snGift{50%{transform:rotate(3deg) translateY(-8px)}}
@keyframes snBtn{50%{box-shadow:0 0 0 7px rgba(230,0,126,.22)}}
/* 30초 칸 2단계(번호 안내) · 걸러내기 문구 */
.fx-s2n .sup-cards{margin-top:14px}
.fx-filter{margin:12px 0 0;padding:14px 16px;border-radius:14px;background:#fff1f2;border:1.5px solid #ffc9cf;font-size:16.5px;line-height:1.55;color:#5a1a22;word-break:keep-all}
.fx-filter b{color:#E5162B}
/* 10/30 5차 — 신규 칸 상품 3개 */
.sn-big2{font-weight:900;color:#ffd23f}
.sn-p{display:grid;gap:10px;margin-top:22px}
.sn-pc{display:grid;grid-template-columns:64px 1fr auto;gap:14px;align-items:center;padding:12px 16px;border-radius:18px;background:rgba(255,255,255,.1);border:1px solid rgba(255,255,255,.2);animation:supNewIn .7s ease-out both}
.sn-pc:nth-child(2){animation-delay:.15s}.sn-pc:nth-child(3){animation-delay:.3s}
.sn-pc img{width:64px;height:64px;object-fit:contain;background:#fff;border-radius:14px;padding:4px;animation:supNewBob 2.6s ease-in-out infinite}
.sn-pc:nth-child(2) img{animation-delay:.4s}.sn-pc:nth-child(3) img{animation-delay:.8s}
.sn-pc b{display:block;font-size:19px}.sn-pc span{display:block;font-size:14.5px;color:#f3d9e8;word-break:keep-all}
.sn-pc em{font-style:normal;font-weight:900;font-size:19px;color:#ffd23f;white-space:nowrap}
@media (max-width:560px){.sn-pc{grid-template-columns:52px 1fr}.sn-pc img{width:52px;height:52px}.sn-pc em{grid-column:2;font-size:17px}}
.sn-st{list-style:none;margin:0 0 14px;padding:0;display:flex;gap:6px;flex-wrap:wrap}
.sn-st li{display:flex;align-items:center;gap:6px;padding:6px 10px;border-radius:999px;background:#f6f3fb;font-size:13.5px;font-weight:700;color:#4a4560}
.sn-st b{display:inline-grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#e6007e;color:#fff;font-size:12px}
/* 10/30 7차 — 마지막 두 단추: 둘 중 하나 (번갈아 빛남) */
.sn-pick{margin:-6px 0 16px;padding:12px 14px;border-radius:14px;background:#1b1530;color:#fff;font-size:18px;font-weight:700;text-align:center;word-break:keep-all}
.sn-pick b{color:#ffd23f}.sn-pick span{display:inline-block;animation:snDown 1s ease-in-out infinite}
@keyframes snDown{50%{transform:translateY(4px)}}
.sn-ab{display:inline-grid;place-items:center;width:26px;height:26px;margin-right:8px;border-radius:8px;background:#e6007e;color:#fff;font-size:14px;font-weight:900;vertical-align:2px}
.sn-ab.dk{background:#fff;color:#1b1530;margin:0 0 4px}
.sn-card .rn-f button{animation:snAlt 2.4s ease-in-out infinite}
.sn-or{display:flex;align-items:center;gap:10px;margin:14px 0;color:#9a95ad;font-size:14px;font-weight:700}
.sn-or::before,.sn-or::after{content:"";flex:1;height:1px;background:#e6e3ef}
.sn-call{margin-top:12px;background:#e6007e;color:#fff!important;border:0!important;padding:16px 12px!important;animation:snAlt 2.4s ease-in-out 1.2s infinite}
.sn-call b{font-size:22px}.sn-call small{color:#ffd6ea!important}
/* 10/31 대표님 「바로 전화 분홍」 — 추천받기 단추는 남색으로 */
.sn-card .rn-f button{background:#1b1530!important}@keyframes snBtn{50%{box-shadow:0 0 0 7px rgba(27,21,48,.22)}}
@keyframes snAlt{0%,100%{transform:scale(1);box-shadow:0 0 0 0 rgba(230,0,126,0)}25%{transform:scale(1.03);box-shadow:0 0 0 8px rgba(230,0,126,.25)}50%{transform:scale(1);box-shadow:0 0 0 0 rgba(230,0,126,0)}}
.sn-ok{display:flex;flex-wrap:wrap;justify-content:center;gap:6px 14px;margin:14px 0 0;font-size:13.5px;font-weight:700;color:#0a7d33}
/* 10/30 대표님 「평일/주말 09:00~22:00 조금 찐하게」 */
.sup-hr{font-weight:900;color:#fff;white-space:nowrap}
.sn-call small b{font-weight:900;color:#fff}
/* 10/31 대표님(폴드 화면) 「모바일에서 AI전화 영상 좌우로 키우고, 바쁜 가게 위아래 간격 줄이고, 우리 매장/우리 매장엔 두 화면 각각 한 화면씩」 */
@media (max-width:899px){#ai .ai-top .cx-vid{max-width:none;width:100%}#ai .ai-top{gap:22px}}
@media (min-width:560px) and (max-width:899px){html #ai .ai-top .cx-vid video{aspect-ratio:1/1!important}}   /* 폴드처럼 넓은 휴대폰은 정사각(너무 길어지지 않게). html 붙인 건 아래 3/4 규칙보다 이기려고 */
#aivs.psec{padding-top:24px!important;padding-bottom:24px!important}#aivs .sec-h{margin-bottom:10px!important}
.aiv{gap:6px!important}.aiv-r{padding:7px 12px!important}.aiv-s{margin-bottom:4px!important;font-size:15.5px!important}
.aiv-no,.aiv-ok{padding:5px 10px!important}.aiv-ok b{font-size:15px!important}.aiv-no b{font-size:14px!important}
@media (min-width:900px){.aiv-s{margin-bottom:0!important}}
@media (max-width:959px){.sup-new{padding:34px 0 30px}.sn-grid{gap:18px}.sn-k{margin-bottom:8px;font-size:14.5px}.sn-h{font-size:clamp(24px,5.2vw,34px)}
 .sn-p{margin-top:14px;gap:8px}.sn-pc{padding:9px 14px}.sn-pc img{width:52px;height:52px}.sn-pc b{font-size:17px}.sn-pc span{font-size:13.5px}.sn-pc em{font-size:17px}.sn-q{margin-top:12px;font-size:15.5px}
 .sn-card{padding:20px 18px 16px}.sn-ct{margin-bottom:8px;font-size:19px;padding-right:0}.sn-st{margin-bottom:8px}.sn-card .rn-f{gap:7px}.sn-card .rn-f input[type=tel]{font-size:19px;padding:12px 14px}.sn-card .rn-f button{min-height:50px;font-size:18px}
 .sn-or{margin:8px 0}.sn-call{padding:12px 10px!important}.sn-call b{font-size:19px}.sn-ok{margin-top:8px;font-size:12.5px}.sn-f{margin-top:14px;font-size:12px}}
/* 10/31 대표님(폴드, 약 600~700px 폭) 「한 화면 넘어가지 않게」 — 폴드 띠(560~899px)에서 칸마다 보이는 높이(≈540px) 안에 들어가게 */
@media (min-width:560px) and (max-width:899px){
 html #ai .ai-top .cx-vid video{aspect-ratio:16/9!important;max-height:none;object-position:50% 50%!important}   /* 10/31 3차: 폴드는 가로판(tour-tel-cs-w)을 통째로 — 글씨 안 잘림, 요금 영상과 같은 크기 */
 #rates .tour-v video{aspect-ratio:1/1!important;max-height:440px}                           /* 요금 영상 */
 .ai-phone{width:120px!important;top:-6px!important}.ai-day{margin-bottom:6px!important;font-size:13.5px!important;padding:4px 12px!important}
 #ai .ai-top>div:last-child>h3{font-size:25px!important}.ai-price{margin:2px 0 2px!important}.ai-price b{font-size:42px!important}.ai-price span{font-size:18px!important}
 #ai .ai-top>div:last-child>p{font-size:15px!important;padding-right:110px!important}
 .ai-tags{grid-template-columns:repeat(3,1fr)!important;gap:6px!important;margin:10px 0!important}.ai-tags li{font-size:13.5px!important;padding:8px 8px!important}
 #ai .ai-top .cta{margin-top:4px!important}
 .aiv-r{padding:6px 10px!important}.aiv-s{font-size:14.5px!important;margin-bottom:3px!important}.aiv-s span{font-size:18px!important}.aiv-ok b{font-size:14px!important}.aiv-no b{font-size:13px!important}.aiv-no,.aiv-ok{padding:4px 8px!important}.aiv-f{font-size:14px!important}
 #rates .pcd{padding:16px 16px 14px!important}#rates .pcd .tg{margin-bottom:6px!important;font-size:12.5px!important}#rates .pcd h4{font-size:22px!important;margin:0 0 4px!important}#rates .pcd .ds{font-size:14px!important;line-height:1.4!important;margin:0 0 8px!important}
 #rates .pcd .ft{font-size:13px!important;gap:4px!important;margin:0 0 8px!important}#rates .pcd .ft li{line-height:1.3!important}#rates .pcd .pr{margin:0 0 6px!important}#rates .pcd .pr .gw{font-size:12.5px!important;margin:0!important}#rates .pcd .pr .pp b{font-size:22px!important}#rates .pcd .cta a{padding:10px!important;font-size:14.5px!important;min-height:0!important}
 .sup-card{padding:16px 18px 14px!important;gap:0!important}.sup-top{margin-bottom:4px!important}.sup-ico{width:42px!important;height:42px!important}.sup-ico svg{width:24px!important;height:24px!important}
 .sup-tag{font-size:17px!important;padding:5px 13px!important}.sup-who{font-size:20px!important}.sup-org{font-size:14px!important}.sup-num{font-size:44px!important;margin:2px 0 0!important}
 .sup-desc{font-size:14px!important}.sup-mob{font-size:14px!important;margin:4px 0!important;padding:6px 10px!important}.sup-call{padding:13px!important;font-size:18px!important;margin-top:8px!important}
 /* 10/31 2차(대표님 폴드 화면 6장) — 요금 영상 제목 잘림 → 자르지 않고 통째로 */
 /* 10/31 3차 대표님 「위아래 영상처럼 좌우로 키워 한 화면에」 → 폴드에선 가로판(cs-speed500-w 16:9)을 꽉 채워 보여 준다 */
 #rates .tour-v.has-w .tv-m{display:none!important}
 #rates .tour-v.has-w .tv-w{display:block!important;width:100%;height:auto;aspect-ratio:16/9!important;max-height:none!important;object-fit:cover!important;border-radius:16px;background:#fff}
 /* 1G·500M 두 장 한 화면: 설명 줄·4번째 글머리 숨김 */
 #rates .pcd .ds{display:none!important}#rates .pcd .ft li:nth-child(4){display:none!important}#rates .pcd .ft{font-size:12.5px!important}#rates .pcd h4{font-size:20px!important}#rates .pcd .cta a{padding:8px!important;font-size:14px!important}
 /* 바쁜 가게: 상황 제목 왼쪽 · 비교 오른쪽, 한 줄에 하나 → 5줄이 한 화면 */
 .aiv{gap:5px!important}.aiv-r{display:grid!important;grid-template-columns:180px 1fr!important;gap:8px!important;align-items:center!important;padding:5px 10px!important}.aiv-s{margin:0!important;font-size:14px!important}
 .aiv-no,.aiv-ok{padding:3px 8px!important}.aiv-ok b{font-size:13.5px!important}.aiv-no b{font-size:12.5px!important}.aiv-f{margin-top:4px!important;font-size:13px!important}
 /* 자주 묻는 질문: 4·3개 두 줄로 */
 .sup-faq{grid-template-columns:1fr 1fr!important;gap:8px!important}.sup-faq-c{gap:6px!important}#faq .rq{padding:9px 12px!important}#faq .rq summary{font-size:14px!important;line-height:1.4!important}#faq .rq p{font-size:13.5px!important}
 /* 1단계 모뎀·공유기 찾기 / 전원잭 / 컴퓨터: 사진 왼쪽·글 오른쪽 두 칸으로 접어 각각 한 화면 */
 .fx-step{padding:14px 14px 12px!important}.fx-step h3{font-size:18px!important;margin-bottom:6px!important;min-height:30px!important}
 .fx>.fx-step:nth-child(2),.fx>.fx-step:nth-child(3),.fx>.fx-step:nth-child(4){display:grid;grid-template-columns:1fr 1fr;gap:8px 10px;align-content:start}
 .fx>.fx-step:nth-child(2)>h3,.fx>.fx-step:nth-child(3)>h3,.fx>.fx-step:nth-child(4)>h3{grid-column:1/-1}
 .fx>.fx-step:nth-child(2)>.fx-fig{grid-row:2/4}
 .fx-fig img{max-height:240px;object-fit:contain}.fx-fig figcaption{padding:6px 10px!important;font-size:13px!important}
 .fx-ul{margin-top:0!important;font-size:14px!important;gap:3px!important;line-height:1.4!important}
 .fx-stb{margin-top:0!important;padding:8px!important;grid-template-columns:64px 1fr!important;gap:8px!important;align-self:start}.fx-stb p{font-size:13.5px!important;line-height:1.4!important}
 .fx-anim{padding:8px 10px 10px!important}.fx-svg{max-width:300px!important}.fx-say{font-size:17px!important;margin:4px 0 6px!important}.fx-dots{margin-bottom:6px!important}.fx-dots span{font-size:12px!important;padding:3px 8px!important}.fx-go{font-size:14px!important;padding:8px 14px!important}
 .fx>.fx-step:nth-child(3) .fx-jacks{grid-template-columns:1fr!important;margin-top:0!important;gap:8px!important}.fx-fig.zoom img{max-height:110px;object-fit:cover}
 .fx-pcs{margin-bottom:0!important}.fx-pcs img{max-height:130px}.fx-p{margin:0!important;font-size:14px!important;line-height:1.45!important}.fx-tip{align-self:start}
}
/* U+AI전화 — 영상 좌우로 더 크게, 전화기 그림 */
/* 10/30 대표님 「영상 위아래 조금 줄이고 좌우로 조금 늘려」 — 9:16 → 3:4 로 위아래만 잘라 보여 줌(글씨·전화기 안 잘리게 42% 지점) */
#ai .ai-top .cx-vid video{aspect-ratio:3/4!important;object-fit:cover;object-position:50% 42%}
@media (min-width:900px){#ai .ai-top{grid-template-columns:minmax(0,500px) minmax(0,1fr)}#ai .ai-top .cx-vid{max-width:500px}}
.ai-lead{margin:-4px 0 14px;font-size:17px;line-height:1.6;color:#4a4560;word-break:keep-all}
.ai-lead-cta{margin:0 0 26px}
#ai .ai-top>div:last-child{position:relative}
.ai-phone{position:absolute;right:-16px;top:-70px;width:clamp(150px,26vw,300px);height:auto;filter:drop-shadow(0 14px 22px rgba(20,10,60,.25));transform-origin:50% 55%;animation:aiPhPulse 2.2s ease-in-out infinite}
@keyframes aiPhPulse{0%,100%{transform:scale(1)}50%{transform:scale(.9)}}   /* 10/30 대표님 「현 상태에서 커졌다 조금 작아졌다」 */
@media (max-width:899px){.ai-phone{width:150px;top:-20px;right:-6px}}
@media (min-width:900px){#ai .ai-top>div:last-child>p{padding-right:250px}}
@media (max-width:899px){#ai .ai-top>div:last-child>p{padding-right:120px}}

/* 10/30 2차 — 요금 칸 머리글, 단자함 2×2 크게 */
.sup-rt-lead{margin:0 0 14px;font-size:17px;line-height:1.6;color:#4a4560;word-break:keep-all}
.sup-rt-cta{margin:0 0 22px}
#box .sup-ba{grid-template-columns:1fr!important;gap:22px}
#box .sup-ba-t{font-size:17px;padding:8px 18px}
#box .sup-ba-im{grid-template-columns:1fr 1fr;gap:12px}
#box .sup-ba-im .sup-fig img{height:clamp(170px,36vw,420px);width:100%;object-fit:cover}

/* 10/30 기승전결 — 약정 연결 문장, 접은 셀프점검 */
.sup-bridge{padding:34px 0 10px;text-align:center}
.sup-br{margin:0 auto;max-width:760px;font-size:clamp(19px,4.6vw,24px);line-height:1.6;word-break:keep-all;color:#1b1530}
.sup-br b{color:#E5162B}
.sup-br-k{display:inline-block;margin-right:6px;padding:2px 12px;border-radius:999px;background:#1b1530;color:#fff;font-size:.8em;font-weight:800}
.sup-br-a{display:block;margin-top:8px;font-size:28px;color:#E5162B;animation:supBr 1.4s ease-in-out infinite}
@keyframes supBr{50%{transform:translateY(8px)}}
.sup-more{margin:0;border-top:1px solid #ececf1}
.sup-more>summary{list-style:none;cursor:pointer;display:flex;flex-direction:column;align-items:center;gap:4px;padding:26px 16px;background:#f7f6fb;text-align:center}
.sup-more>summary::-webkit-details-marker{display:none}
.sup-more>summary span{font-size:20px;font-weight:800;color:#1b1530}
.sup-more>summary span::after{content:" ▾";color:#E5162B}
.sup-more[open]>summary span::after{content:" ▴"}
.sup-more>summary small{font-size:15px;color:#6b6780;word-break:keep-all}

/* 10/24 고객센터 마무리(꼭지 따기) — KT기가넷과 같은 구성, 분홍 */
.rn-sec{background:radial-gradient(800px 380px at 100% 0%,rgba(255,90,170,.38),rgba(255,90,170,0) 60%),linear-gradient(140deg,#15121f 0%,#3d0a2a 55%,#b0005f 100%);color:#fff;padding:56px 0 64px}
.rn-head{text-align:center;max-width:720px;margin:0 auto 28px}
.rn-k{display:inline-block;margin:0 0 10px;background:rgba(255,210,63,.14);color:#FFD23F;font-weight:800;font-size:14px;padding:6px 14px;border-radius:999px}
.rn-head h2{color:#fff;font-size:34px;line-height:1.3;margin:0 0 12px;letter-spacing:-.03em}.rn-head h2 b{color:#FFD23F}
.rn-sub{margin:0;color:rgba(255,255,255,.82);font-size:16.5px;word-break:keep-all}.rn-sub b{color:#fff}
.rn-grid{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,420px);gap:26px;align-items:center}
.rn-left{display:flex;flex-direction:column;gap:18px;min-width:0}
.rn-vs{display:grid;grid-template-columns:1fr 1fr;gap:12px;align-items:stretch}
.rn-col{border-radius:20px;padding:20px 18px}.rn-col ul{list-style:none;margin:0;padding:0;display:grid;gap:12px}
.rn-col li{display:flex;gap:9px;align-items:flex-start;font-size:15.5px;line-height:1.45;word-break:keep-all}.rn-col li small{display:block;font-size:12.5px;opacity:.75}
.rn-col svg{flex:0 0 20px;width:20px;height:20px;margin-top:1px}
.rn-ct{margin:0 0 14px;font-weight:800;font-size:17px}
.rn-old{background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.14);color:rgba(255,255,255,.62)}.rn-old svg{fill:rgba(255,255,255,.45)}
.rn-new{background:#fff;color:var(--ink);box-shadow:0 20px 50px rgba(0,0,0,.3);position:relative}.rn-new svg{fill:var(--pink)}.rn-new b{color:var(--pink)}
.rn-new .rn-ct{color:var(--pink)}.rn-new::before{content:"추천";position:absolute;top:-11px;right:16px;background:#FFD23F;color:#3a2a00;font-weight:800;font-size:12.5px;padding:3px 10px;border-radius:999px}
.rn-q{margin:0;padding:18px 20px;border-radius:18px;background:rgba(255,210,63,.1);border:1px solid rgba(255,210,63,.3);text-align:center}
.rn-q b{display:block;color:#FFD23F;font-size:26px;letter-spacing:-.03em}.rn-q span{display:block;margin-top:4px;color:rgba(255,255,255,.8);font-size:14.5px;word-break:keep-all}
.rn-card{background:#fff;color:var(--ink);border-radius:22px;padding:22px 22px 18px;box-shadow:0 30px 70px rgba(0,0,0,.35);min-width:0}
.rn-steps{list-style:none;margin:0 0 16px;padding:0;display:grid;grid-template-columns:repeat(3,1fr);gap:6px}
.rn-steps li{background:#fff0f7;border-radius:12px;padding:9px 4px;text-align:center;font-weight:700;font-size:13.5px;line-height:1.3;word-break:keep-all}
.rn-steps b{display:block;margin:0 auto 4px;width:24px;height:24px;line-height:24px;border-radius:50%;background:var(--pink);color:#fff;font-size:13px}
.rn-f{display:grid;gap:10px}.rn-f label{font-weight:700}
.rn-f input[type=tel]{font:inherit;font-size:20px;padding:14px;border:1.5px solid #e6e4ee;border-radius:12px;min-width:0;width:100%}
.rn-f .rn-ag{font-weight:400;font-size:14px;color:var(--mute)}
.rn-f button{font:inherit;font-weight:800;font-size:18px;padding:16px;border:0;border-radius:12px;color:#fff;cursor:pointer;background:linear-gradient(135deg,#ff3d9a,#E6007E 60%,#b0005f);box-shadow:0 10px 24px rgba(230,0,126,.3)}
.rn-f button:disabled{opacity:.6}.rn-msg{margin:0;font-weight:700}.rn-msg:empty{display:none}.rn-msg.ok{color:#0a7a3b}.rn-msg.no{color:#d92d3a}
.rn-tel{display:flex;align-items:center;justify-content:center;gap:8px;margin-top:12px;padding:13px;border:1.5px solid #e6e4ee;border-radius:12px;color:var(--ink);font-weight:800;font-size:17px;text-decoration:none}
.rn-tel svg{width:18px;height:18px;fill:var(--pink)}
.rn-time{margin:10px 0 0;text-align:center;font-size:13px;color:var(--mute)}
.rn-fn{margin:22px 0 0;text-align:center;font-size:12.5px;color:rgba(255,255,255,.6);word-break:keep-all}
@media (max-width:860px){.rn-grid{grid-template-columns:1fr}}
@media (max-width:560px){.rn-sec{padding:40px 0 48px}.rn-head h2{font-size:26px}.rn-sub{font-size:15px}.rn-col{padding:16px 13px}.rn-col li{font-size:14px}.rn-ct{font-size:15.5px}.rn-card{padding:18px 15px 15px}.rn-q b{font-size:21px}.rn-q span{font-size:13.5px}}

.sup-vsw{display:grid;gap:22px}
.sup-vid-1 .sup-vid-f{aspect-ratio:16/9}
@media (max-width:1024px) and (min-aspect-ratio:3/4){.sup-vid-1{width:100%}.sup-vid-1 .sup-vid-f{aspect-ratio:10/9;width:min(100%,calc((100svh - 200px) * 10 / 9));margin:0 auto}}   /* 10/24 대표님 「폴드 펼친 화면에 맞춰 위아래 넓게」 */
@media (max-width:640px){.sup-vid-1{width:min(100%,calc((100svh - 270px) * .5625));margin:0 auto}.sup-vid-1 .sup-vid-f{aspect-ratio:9/16}}   /* 10/23 대표님 「넓혀」→「한 화면에 맞춰」: 폭은 꽉, 단 화면 높이를 넘지 않게 */
@media (max-width:899px){.sup-vids .sup-vid{flex:0 0 min(62vw,calc((100svh - 300px) * .5625))}}   /* 15초 영상 4편: 휴대폰 한 화면에 다 보이게 */
@media (max-width:640px){#faq .rq{padding:9px 14px;border-radius:12px}#faq .rq summary{font-size:15.5px;line-height:1.45}.sup-faq,.sup-faq-c{gap:6px}#faq .pbody{gap:6px}}   /* FAQ 7개 휴대폰에서 촘촘히 */
.sup-vs-body{display:grid;gap:16px}
@media (min-width:900px){.sup-vs-body{grid-template-columns:1fr 1.5fr;align-items:stretch}.sup-vs-body .sup-ph{display:flex;flex-direction:column;justify-content:center}}
.sup-vsw .vat{margin:0}
.sup-ph{background:#f6f6fb;border-radius:18px;padding:18px;margin:0}
.sup-ph-q{margin:0 0 12px;font-weight:800;font-size:17px}
.sup-ph-c{display:grid;grid-template-columns:1fr auto 1fr;gap:10px;align-items:stretch}
.sup-ph-o,.sup-ph-n{border-radius:14px;padding:14px;display:grid;gap:2px;text-align:center}
.sup-ph-o{background:#ececf1;color:#666}.sup-ph-n{background:linear-gradient(150deg,#e6007e,#b5006a);color:#fff}
.sup-ph-c b{font-size:13px;opacity:.85}.sup-ph-c .t{font-size:18px;font-weight:900}.sup-ph-c .d{font-size:13px;opacity:.85}
.sup-ph-vs{align-self:center;font-weight:900;color:var(--pink)}
.sup-ph-a{margin:12px 0 0;font-size:15px;line-height:1.6}
.sup-vs{border-radius:18px;overflow:hidden;border:1.5px solid #ececf1;background:#fff}
.sup-vs-h,.sup-vs-r{display:grid;grid-template-columns:96px 1fr 1fr}
.sup-vs-h>*{padding:12px;font-size:15px}.sup-vs-h .old{background:#f0f0f4;color:#666}.sup-vs-h .new{background:var(--pink);color:#fff}
.sup-vs-r>*{padding:12px;border-top:1px solid #ececf1;font-size:14.5px;line-height:1.5}
.sup-vs-r .k{font-weight:800;background:#fafafc}
.sup-vs-r .old{color:#777}.sup-vs-r .old::before{content:"✕ ";color:#bbb;font-weight:900}
.sup-vs-r .new{font-weight:700;background:#fff5fa}.sup-vs-r .new::before{content:"✓ ";color:var(--pink);font-weight:900}
@media (max-width:560px){.sup-vs-h,.sup-vs-r{grid-template-columns:70px 1fr 1fr}.sup-vs-r>*{font-size:13.5px;padding:10px 8px}}
.sup-vs-cta{display:flex;gap:12px;flex-wrap:wrap}
.sup-call.ours{background:var(--pink);box-shadow:0 8px 18px rgba(230,0,126,.28);flex:1 1 220px;font-size:19px;padding:18px}
.sup-cbtn{flex:1 1 160px;display:flex;align-items:center;justify-content:center;padding:18px;border-radius:14px;border:2px solid var(--pink);background:#fff;color:var(--pink);font-weight:800;font-size:19px;text-decoration:none}
.sup-vs-cta .sup-call.ours{border:2px solid var(--pink);animation:supBlinkL 1.6s ease-in-out infinite}
.sup-vs-cta .sup-call.ours svg{fill:currentColor}
.sup-vs-cta .sup-cbtn{animation:supBlinkR 1.6s ease-in-out infinite}
@keyframes supBlinkL{0%,45%{transform:scale(1.04);background:var(--pink);color:#fff;border-color:var(--pink);box-shadow:0 0 0 6px rgba(230,0,126,.22),0 12px 26px rgba(230,0,126,.35)}50%,95%{transform:none;background:#fff;color:var(--pink);border-color:var(--pink);box-shadow:none}100%{background:var(--pink);color:#fff}}
@keyframes supBlinkR{0%,45%{transform:none;background:#fff;color:var(--pink);box-shadow:none}50%,95%{transform:scale(1.04);background:var(--pink);color:#fff;box-shadow:0 0 0 6px rgba(230,0,126,.22),0 12px 26px rgba(230,0,126,.35)}100%{background:#fff;color:var(--pink)}}   /* 10/23 대표님: 쉬는 쪽은 둘 다 흰 바탕(왼쪽이 자주색으로 남던 것 고침) */
.sup-vs-cta a:hover{animation-play-state:paused}
.brand img,.callbar .l img,.ft2-brand img{width:auto;border-radius:8px}
.sup-where table{font-size:17px}.sup-where th{font-size:15px;padding:14px 18px}.sup-where td{padding:16px 18px;vertical-align:middle}
.sup-where td:first-child{font-weight:800;width:38%}
.sup-where .sup-pill{font-size:17px;padding:5px 14px;margin-right:4px}
@media (max-width:640px){.sup-where table{font-size:15px}.sup-where td{padding:12px}.sup-where .sup-pill{font-size:15px}}
.sup-faq{display:grid;gap:8px}.sup-faq-c{display:grid;gap:8px;align-content:start}
@media (min-width:900px){.sup-faq{grid-template-columns:1fr 1fr;gap:14px}}
#faq .rq{margin:0;padding:12px 18px}#faq .rq p{margin-top:8px}

@media (max-width:1024px) and (min-aspect-ratio:3/4){.sup-vid-1{width:100%}.sup-vid-1 .sup-vid-f{aspect-ratio:10/9;width:min(100%,calc((100svh - 200px) * 10 / 9));margin:0 auto}}   /* 10/24 폴드판 — 휴대폰 세로판 규칙보다 뒤에 둬야 이긴다 */

@media (min-width:520px) and (max-width:899px){.sup-vids .sup-vid{flex:0 0 calc(50% - 6px)}}   /* 10/24 대표님 「엘지 영상도 기가넷처럼 두 개가 한꺼번에」 */
.brand img,.callbar .l img,.ft2-brand img{border-radius:50%}   /* 10/24 동그란 U+ 로고 */
.rn-sec .rn-f{border:0;padding:0;margin:0;background:none;box-shadow:none;border-radius:0}.rn-f .rn-ag{display:flex;gap:8px;align-items:flex-start;text-align:left;margin:0}.rn-f .rn-ag input{width:auto;height:auto;margin:3px 0 0;flex:none}.rn-f .rn-ag a{color:var(--pink)}

/* 10/27 대표님 「15초 영상 가로 큰 화면 한 개만, 아래 1 찾기 2 전원선 3 컴퓨터」「3단계 영상 가로 키우기」「번호 박스 3개 키우기, 고장·장애 글씨 더」 */
@media (min-width:900px){.fx{grid-template-columns:repeat(3,1fr)}.fx-s1{grid-column:1/-1}.fx-stage:not(:first-child){max-width:none}}
.fx-s1{padding:12px;background:#16163a;border:0}
.fx-vid,.fx-gvid{aspect-ratio:16/9;width:100%!important;max-height:none!important;max-width:1100px;margin:0 auto}
.fx-gvid{margin-bottom:16px}
.fx-s1 .fx-vbar{color:#fff;padding:2px 4px 0}.fx-s1 .fx-vbar span{color:#c9c9e0}.fx-s1 .fx-vbar button{background:transparent;color:#fff;border-color:#55557a}.fx-s1 .fx-vbar button.on{background:var(--pink);border-color:var(--pink)}
@media (min-width:900px){.fx-new{display:grid;grid-template-columns:1.5fr 1fr;column-gap:22px;align-items:start}.fx-new .fx-gvid{grid-row:1/span 5;margin:0}}
.sup-card{padding:28px 26px 24px}
.sup-ico{width:54px;height:54px}.sup-ico svg{width:30px;height:30px}
.sup-tag{font-size:22px;padding:8px 18px}
.sup-who{font-size:24px}.sup-org{font-size:16px}
.sup-num{font-size:54px;margin:10px 0 4px}
.sup-desc{font-size:17px;margin-bottom:20px}
.sup-call{font-size:20px;padding:19px}

/* 10/27 대표님 「아래가 비어 이상해」「3단계 영상 가로로 크게 아래 글씨」 */
.fx-pcs{display:grid;grid-template-columns:1fr 1fr;gap:10px;margin-bottom:12px}.fx-pcs img{aspect-ratio:1/1;object-fit:cover}
.fx-stb{display:grid;grid-template-columns:110px 1fr;gap:12px;align-items:center;margin-top:14px;padding:12px;border-radius:14px;background:#f6f4fb}
.fx-stb .fx-fig img{aspect-ratio:1/1.2;object-fit:cover}.fx-stb p{margin:0;font-size:15.5px;line-height:1.55}
@media (min-width:900px){.fx-new{display:block}.fx-new .fx-gvid{margin:0 auto 18px;max-width:none}}
.fx-new .fx-gvid{width:100%!important}
.fx-tip{grid-template-columns:44px 1fr}.fx-tip-i{font-size:30px;text-align:center}
.fx-new h3{font-size:22px}.fx-new .fx-ul{font-size:17px}

html.pg-sup .bf-tip{font-size:13px!important;line-height:1.3!important;padding:6px 12px!important;max-width:none!important;white-space:nowrap;border-radius:999px!important;border-width:1.5px!important}
html.pg-sup .bf-tip br{display:none}
html.pg-sup .bf-mtip,html.pg-sup .bf-stk{display:none!important}

/* 10/27 대표님 「2단계 박스 내용 키우고, 가정 → 홈 인터넷, 글씨·전화번호 키워」 */
.fx-last h3{font-size:24px}.fx-last .fx-p{font-size:19px!important}
.fx-nums{display:grid;gap:10px;margin:4px 0 6px}
@media (min-width:600px){.fx-nums{grid-template-columns:1fr 1fr}}
.fx-nums span{display:flex;align-items:baseline;justify-content:space-between;gap:10px;background:#fff;border:2px solid #ffd0d4;border-radius:16px;padding:12px 16px}
.fx-nums em{font-style:normal;font-weight:800;font-size:19px;color:#333;white-space:nowrap}
.fx-nums b{font-size:clamp(28px,8.4vw,36px);font-weight:900;color:var(--sup-red);letter-spacing:-.5px;white-space:nowrap}
.fx-nums span{flex-direction:column;align-items:flex-start;gap:2px;padding:12px 16px}   /* 10/27 「홈 인터넷 고장 신고 / 사무실·매장 인터넷 고장 신고」 — 이름 위, 번호 아래 */

.sup-only{display:block;margin:-6px 0 18px;padding:12px 14px;border-radius:14px;background:#ffd23f;color:#3a2a00;line-height:1.35}
.sup-only b{display:block;font-size:20px;font-weight:900}
.sup-only small{display:block;margin-top:4px;font-size:16px;font-weight:800;color:#7a1f00}

.fx-nums span.mob{border-color:#e6e8ec;background:#f8f8fb}.fx-nums span.mob b{color:#111}.fx-nums span.mob em{font-size:17px}.fx-nums small{font-size:14px;color:var(--mute);font-weight:700}
@media (min-width:600px){.fx-nums span.mob{grid-column:1/-1}}
.sup-mob{display:block;margin:-6px 0 16px;padding:10px 12px;border-radius:12px;background:#f6f6f9;font-size:15.5px;font-weight:700;color:#333}
.sup-mob a{color:var(--sup-red);font-weight:900;font-size:18px;text-decoration:none}.sup-mob small{color:var(--mute);font-weight:700}

.fx-s3 .fx-sh{font-size:clamp(26px,7.4vw,38px);line-height:1.25;gap:12px}.fx-s3 .fx-sh em{font-size:1.12em}.fx-s3 .fx-badge{font-size:18px;padding:8px 14px}   /* 10/27 대표님 「3단계 3년~ 글씨 포인트 키워, 핵심」 */

.hm-grid{display:grid;gap:18px}@media (min-width:860px){.hm-grid{grid-template-columns:1fr 1fr}}
.hm-card{background:#fff;border:1.5px solid #ececf1;border-radius:22px;padding:22px;box-shadow:0 10px 28px rgba(20,16,40,.07);position:relative;overflow:hidden}
.hm-card::before{content:"";position:absolute;inset:0 0 auto 0;height:6px;background:#e6007e}.hm-kt::before{background:#111}
.hm-h{display:flex;align-items:baseline;justify-content:space-between;gap:10px;margin-bottom:10px;flex-wrap:wrap}.hm-h b{font-size:22px}.hm-h span{font-size:13px;color:var(--mute)}
.hm-card .pt td small{display:block;font-size:12.5px;color:var(--mute);font-weight:500}
.hm-n{font-size:13.5px;color:var(--mute);margin:10px 0 14px;line-height:1.5;word-break:keep-all}
.hm-card .cta{margin:0}
.hm-ty{display:flex;gap:6px;flex-wrap:wrap;margin:0 0 10px}.hm-ty label{display:inline-block;margin:0}.hm-ty input{display:none}.hm-ty span{display:inline-block;padding:7px 12px;border-radius:999px;border:1.5px solid #d9dde5;background:#f5f6f9;font-size:13.5px;font-weight:700;cursor:pointer;color:#111}.hm-ty input:checked+span{background:#e6007e;border-color:#e6007e;color:#fff}
.mnav{position:fixed;left:auto;right:12px;top:64px;z-index:60;width:230px;max-width:calc(100vw - 24px);background:#fff;border:1px solid rgba(17,19,23,.06);border-radius:16px;box-shadow:0 16px 40px rgba(30,20,70,.16);max-height:calc(100svh - 150px);overflow-y:auto;overscroll-behavior:contain}.mnav[hidden]{display:none!important}.mnav .wrap{display:grid;padding:8px;width:auto;max-width:none;margin:0}.mnav a,.mnav a.mn-h{padding:11px 12px;font-size:16px;font-weight:700;color:var(--ink);border:0;border-radius:10px;text-decoration:none}.mnav a.mn-h:active{background:#F6F4FB}.mnav a.mn-tel{margin-top:6px;background:#E6007E;color:#fff;text-align:center;font-weight:800}