/* 정보 페이지 5종 전용 보충 꾸밈 — 기본 디자인은 seo-main.css(메인 페이지의 꾸밈을 그대로 옮긴 파일)를 씁니다.
   여기에는 메인에 없는 것(화면 목업 · 아이콘 카드 · 가격 막대 · 표)만, 메인의 색 · 둥글기 값(var)을 써서 적습니다. */
body.sp{background:#fff}
body.sp #hd.solid{background:rgba(10,10,20,.82)}
body.sp .hd-nav a[aria-current=page]{color:#fff}
body.sp a.hd-btn,body.sp .hero-ctas a,body.sp .cta-btns a,body.sp .ft-links a.ft-lbtn{text-decoration:none}
body.sp .ft-links a.ft-lbtn{display:inline-block}
body.sp .hpl-collection{margin:0}
/* 푸터: 메인화면으로 가는 큰 버튼 하나 + 나머지 링크는 메인처럼 작은 글씨 */
.sp-ft-home{display:inline-flex;align-items:center;gap:9px;margin-top:22px;padding:15px 30px;border-radius:99px;background:#fff;color:var(--ink);font-size:16px;font-weight:800;letter-spacing:-.02em;text-decoration:none;box-shadow:0 8px 26px rgba(0,0,0,.35);transition:transform .2s,box-shadow .2s}
.sp-ft-home:hover{transform:translateY(-2px);box-shadow:0 12px 32px rgba(47,75,240,.45)}
.sp-ft-home svg{width:17px;height:17px;flex:none}
.sp-ft-guide{margin-top:18px;font-size:11px;line-height:1.8;color:rgba(255,255,255,.26)}
.sp-ft-guide a{color:inherit;text-decoration:none}
.sp-ft-note{margin-top:8px;font-size:11px;color:rgba(255,255,255,.26);text-align:center}
.sp-ft-note a{color:rgba(255,255,255,.42)}

/* ── 첫 화면: 왼쪽 글 · 오른쪽 그림 ── */
.sp-hero{position:relative;overflow:hidden;background:var(--ink);padding:128px 0 64px}
.sp-hero::before{content:'';position:absolute;inset:0;background:radial-gradient(900px 560px at 78% 18%,rgba(47,75,240,.42),transparent 68%),radial-gradient(700px 480px at 8% 0%,rgba(124,144,255,.18),transparent 70%);pointer-events:none}
.sp-hero::after{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(255,255,255,.035) 1px,transparent 1px),linear-gradient(90deg,rgba(255,255,255,.035) 1px,transparent 1px);background-size:64px 64px;-webkit-mask-image:linear-gradient(180deg,#000 55%,transparent);mask-image:linear-gradient(180deg,#000 55%,transparent);pointer-events:none}
.sp-hero>.wrap{position:relative;z-index:1}
.sp-hero-grid{display:grid;grid-template-columns:minmax(0,1.02fr) minmax(0,.98fr);gap:56px;align-items:center}
.sp-crumb{font-size:13px;font-weight:600;color:rgba(255,255,255,.42);margin-bottom:20px}
.sp-crumb a{color:rgba(255,255,255,.62);text-decoration:none}
.sp-hero .hero-kicker{margin-bottom:22px}
.sp-h1{font-size:clamp(36px,4.5vw,64px);font-weight:900;line-height:1.14;letter-spacing:-.045em;color:#fff;word-break:keep-all}
.sp-h1 .hl{color:#8FA6FF}
.sp-h1 .ib{display:inline-block}
/* 첫 화면 '소개 모션 영상 보기' — 눌렀을 때만 재생 */
.sp-play{display:inline-flex;align-items:center;gap:10px;margin-top:20px;padding:6px 16px 6px 6px;border-radius:99px;border:1px solid rgba(255,255,255,.16);background:rgba(255,255,255,.05);font-family:inherit;font-size:14.5px;font-weight:700;color:rgba(255,255,255,.88);cursor:pointer;transition:background .2s,border-color .2s,transform .2s}
.sp-play:hover{background:rgba(124,144,255,.16);border-color:rgba(124,144,255,.5);transform:translateY(-1px)}
.sp-play i{display:grid;place-items:center;width:30px;height:30px;border-radius:50%;background:#fff}
.sp-play i svg{width:12px;height:12px;fill:#0A0A14;margin-left:2px}
.sp-play span{font-size:12.5px;font-weight:600;color:rgba(255,255,255,.45)}
.sp-h1.sm{font-size:clamp(31px,3.55vw,50px)}
@media(min-width:1021px){.sp-h1 .hl.nw{white-space:nowrap;font-size:.86em}}
.sp-lead{max-width:560px;margin-top:22px;font-size:17.5px;line-height:1.85;color:rgba(255,255,255,.78);word-break:keep-all}
.sp-hero .hero-ctas{margin:32px 0 0;justify-content:flex-start}
.sp-hero .hstat{margin-top:56px}
.sp-hero .hs-i{background:rgba(10,10,20,.66)}
.sp-nav{display:flex;flex-wrap:wrap;justify-content:center;gap:8px;margin-top:26px}
.sp-nav a{font-size:14px;font-weight:700;color:rgba(255,255,255,.72);text-decoration:none;border:1px solid rgba(255,255,255,.14);background:rgba(255,255,255,.04);border-radius:99px;padding:8px 16px;transition:border-color .2s,color .2s,background .2s}
.sp-nav a:hover{border-color:rgba(255,255,255,.4);color:#fff}
.sp-nav a[aria-current=page]{background:rgba(47,75,240,.3);border-color:rgba(124,144,255,.6);color:#fff}

/* 화면 목업 (PC 창 + 휴대폰) */
.sp-browser{border-radius:14px;overflow:hidden;background:#12132A;border:1px solid rgba(255,255,255,.14);box-shadow:0 30px 80px rgba(0,0,0,.5),0 0 0 1px rgba(124,144,255,.12)}
.sp-browser-bar{display:flex;align-items:center;gap:6px;height:34px;padding:0 13px;background:#1B1C36;border-bottom:1px solid rgba(255,255,255,.08)}
.sp-browser-bar i{width:9px;height:9px;border-radius:50%;background:#FF5F57}
.sp-browser-bar i:nth-child(2){background:#FEBC2E}
.sp-browser-bar i:nth-child(3){background:#28C840}
.sp-browser-bar span{margin-left:10px;font-size:11.5px;font-weight:600;color:rgba(255,255,255,.45);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.sp-browser img{display:block;width:100%;height:auto}
.sp-phone{border-radius:26px;overflow:hidden;background:#0B0B18;border:5px solid #23243F;box-shadow:0 24px 60px rgba(0,0,0,.55),0 0 0 1px rgba(255,255,255,.12)}
.sp-phone img{display:block;width:100%;height:auto;aspect-ratio:9/17.5;object-fit:cover;object-position:top}
.sp-mock{position:relative;padding:0 0 44px 0}
.sp-mock .sp-browser{transform:perspective(1600px) rotateY(-7deg) rotateX(2deg);transform-origin:left center}
.sp-mock .sp-phone{position:absolute;right:-6px;bottom:0;width:27%;min-width:112px}
.sp-collage{position:relative;height:0;padding-bottom:calc(88% + 40px)}
.sp-collage .sp-browser{position:absolute;width:74%}
.sp-collage .sp-browser:nth-child(1){left:0;top:0;transform:rotate(-3deg)}
.sp-collage .sp-browser:nth-child(2){right:0;top:0;margin-top:18.5%;transform:rotate(2.5deg);z-index:2}
.sp-collage .sp-browser:nth-child(3){left:9%;top:0;margin-top:41%;transform:rotate(-1.5deg);z-index:3}

/* 가격 카드 그림 */
.sp-pv{position:relative;max-width:430px;margin-left:auto}
.sp-pv-card{position:relative;border-radius:26px;padding:30px 30px 58px;background:linear-gradient(160deg,rgba(47,75,240,.34),rgba(20,22,48,.92) 62%);border:1px solid rgba(124,144,255,.5);box-shadow:0 30px 80px rgba(0,0,0,.45),inset 0 1px 0 rgba(255,255,255,.12)}
.sp-pv-badge{display:inline-block;font-size:12.5px;font-weight:800;color:#fff;background:var(--grad);border-radius:99px;padding:6px 14px;box-shadow:0 6px 16px rgba(47,75,240,.4)}
.sp-pv-price{margin-top:16px;font-size:60px;font-weight:900;letter-spacing:-.05em;line-height:1;color:#fff}
.sp-pv-price small{font-size:.4em;font-weight:800;margin-left:3px}
.sp-pv-was{display:flex;flex-wrap:wrap;align-items:center;gap:8px;margin-top:12px;font-size:13.5px}
.sp-pv-was s{color:rgba(255,255,255,.45)}
.sp-pv-was em{font-style:normal;font-weight:800;color:#7FE5C5;background:rgba(16,200,150,.14);border:1px solid rgba(16,200,150,.3);border-radius:99px;padding:3px 10px}
.sp-pv-card ul{list-style:none;margin:22px 0 0;padding:20px 0 0;border-top:1px dashed rgba(255,255,255,.18);display:grid;gap:11px}
.sp-pv-card li{display:flex;align-items:center;gap:10px;font-size:15px;font-weight:700;color:rgba(255,255,255,.9)}
.sp-pv-card li svg{flex:none;width:20px;height:20px;padding:4px;border-radius:50%;background:rgba(124,144,255,.25);color:#C9D3FF;stroke-width:2.6}
.sp-pv-mini{position:absolute;right:26px;bottom:-30px;display:flex;flex-direction:column;gap:2px;padding:14px 20px;border-radius:18px;background:#fff;box-shadow:0 20px 50px rgba(0,0,0,.4)}
.sp-pv-mini span{font-size:12.5px;font-weight:700;color:var(--muted)}
.sp-pv-mini b{font-size:22px;font-weight:900;letter-spacing:-.04em;color:#0a9e69}

/* 체크표 그림 */
.sp-cv{text-align:left;max-width:440px;margin-left:auto;border-radius:20px;overflow:hidden;background:rgba(18,19,42,.9);border:1px solid rgba(255,255,255,.14);box-shadow:0 30px 80px rgba(0,0,0,.5)}
.sp-cv-hd{display:flex;align-items:center;gap:6px;height:38px;padding:0 15px;background:#1B1C36;border-bottom:1px solid rgba(255,255,255,.08)}
.sp-cv-hd i{width:9px;height:9px;border-radius:50%;background:#FF5F57}
.sp-cv-hd i:nth-child(2){background:#FEBC2E}
.sp-cv-hd i:nth-child(3){background:#28C840}
.sp-cv-hd span{margin-left:10px;font-size:12px;font-weight:700;color:rgba(255,255,255,.5)}
.sp-cv ol{list-style:none;margin:0;padding:10px 18px 14px}
.sp-cv li{display:flex;align-items:center;gap:14px;padding:12px 2px;border-bottom:1px solid rgba(255,255,255,.07);font-size:15.5px;font-weight:700;color:#fff}
.sp-cv li:last-child{border-bottom:0}
.sp-cv li b{font-family:"DM Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;font-weight:500;letter-spacing:.1em;color:#8FA6FF}
.sp-cv li span{flex:1}
.sp-cv li em{flex:none;display:grid;place-items:center;width:24px;height:24px;border-radius:50%;background:var(--grad);box-shadow:0 4px 12px rgba(47,75,240,.5)}
.sp-cv li em svg{width:13px;height:13px;color:#fff;stroke-width:3}

/* 회사 소개 그림 */
.sp-av{text-align:left;max-width:440px;margin-left:auto;border-radius:24px;padding:28px 28px 22px;background:linear-gradient(160deg,rgba(47,75,240,.3),rgba(18,19,42,.92) 60%);border:1px solid rgba(124,144,255,.45);box-shadow:0 30px 80px rgba(0,0,0,.45)}
.sp-av-since{display:flex;align-items:baseline;gap:12px;padding-bottom:20px;border-bottom:1px dashed rgba(255,255,255,.18)}
.sp-av-since span{font-family:"DM Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12.5px;letter-spacing:.3em;color:#A8B8FF}
.sp-av-since b{font-size:64px;font-weight:900;letter-spacing:-.05em;line-height:1;color:#fff}
.sp-av ul{list-style:none;margin:8px 0 0;padding:0}
.sp-av li{display:flex;align-items:center;gap:14px;padding:13px 0;border-bottom:1px solid rgba(255,255,255,.07)}
.sp-av li:last-child{border-bottom:0}
.sp-av li svg{flex:none;width:40px;height:40px;padding:9px;border-radius:12px;background:rgba(124,144,255,.18);color:#C9D3FF}
.sp-av li b{display:block;font-size:15.5px;font-weight:800;color:#fff}
.sp-av li span{display:block;font-size:13px;color:rgba(255,255,255,.55);margin-top:1px}

/* ── 아이콘 카드 ── */
.sp-icards{display:grid;gap:18px;max-width:1080px;margin:0 auto;grid-template-columns:repeat(2,minmax(0,1fr))}
.sp-icards.c3{grid-template-columns:repeat(3,minmax(0,1fr))}
.sp-icard{position:relative;overflow:hidden;display:flex;flex-direction:column;align-items:flex-start;background:#fff;border:1px solid var(--rule);border-radius:22px;padding:32px 30px 28px;text-align:left;box-shadow:0 2px 14px rgba(20,20,50,.05);transition:transform .25s,box-shadow .25s,border-color .25s}
.sp-icard::after{content:'';position:absolute;right:-60px;top:-60px;width:180px;height:180px;border-radius:50%;background:radial-gradient(circle,rgba(47,75,240,.09),transparent 70%);pointer-events:none}
.sp-icard:hover{transform:translateY(-4px);border-color:rgba(47,75,240,.35);box-shadow:0 16px 36px rgba(47,75,240,.14)}
.sp-icard-ico{display:grid;place-items:center;width:52px;height:52px;border-radius:15px;background:var(--grad);color:#fff;box-shadow:0 6px 16px rgba(47,75,240,.32);margin-bottom:20px}
.sp-icard-ico svg{width:25px;height:25px}
.sp-icard strong{font-size:19.5px;font-weight:800;letter-spacing:-.03em;line-height:1.4;color:var(--ink);word-break:keep-all}
.sp-icard p{margin:10px 0 0;font-size:15.5px;line-height:1.8;color:#4E5968;word-break:keep-all}
.sp-icard span{margin-top:18px;font-size:13px;font-weight:800;color:#2340C8;background:rgba(47,75,240,.1);border:1px solid rgba(47,75,240,.22);padding:6px 13px;border-radius:99px}

/* ── 어두운 구역 (예시 화면 · 가격 막대) ── */
.sp-show,.sp-dark{position:relative;overflow:hidden;background:var(--ink);padding:104px 0;color:#fff}
.sp-show::before,.sp-dark::before{content:'';position:absolute;inset:0;background:radial-gradient(900px 440px at 50% 0%,rgba(47,75,240,.3),transparent 70%);pointer-events:none}
.sp-show>.wrap,.sp-dark>.wrap{position:relative}
.sp-show-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:22px}
.sp-show-i{display:block;text-decoration:none;transition:transform .3s}
.sp-show-i:hover{transform:translateY(-6px)}
.sp-show-i>span{display:block;margin-top:14px;text-align:center;font-size:14.5px;font-weight:700;color:rgba(255,255,255,.7)}
.sp-show-more{margin-top:38px;text-align:center;font-size:16px;font-weight:800}
.sp-show-more a{color:#A8B8FF;text-decoration:none}

/* 가격 막대 */
.sp-ladder{max-width:920px;margin:0 auto;padding:30px 34px 24px;border-radius:24px;background:rgba(255,255,255,.04);border:1px solid rgba(255,255,255,.12)}
.sp-ladder-scale{display:flex;justify-content:space-between;margin:0 0 16px 290px;font-family:"DM Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:11.5px;letter-spacing:.06em;color:rgba(255,255,255,.4)}
.sp-ladder-row{display:grid;grid-template-columns:270px 1fr;gap:20px;align-items:center;padding:13px 0;border-top:1px solid rgba(255,255,255,.07)}
.sp-ladder-tx b{display:block;font-size:16.5px;font-weight:800;color:#fff;letter-spacing:-.02em}
.sp-ladder-tx span{display:block;font-size:13px;color:rgba(255,255,255,.5);margin-top:2px}
.sp-ladder-track{position:relative;height:38px;border-radius:11px;background:repeating-linear-gradient(90deg,rgba(255,255,255,.05) 0 1px,transparent 1px 25%),rgba(255,255,255,.03)}
.sp-ladder-track i{position:absolute;left:0;top:0;bottom:0;border-radius:11px;background:linear-gradient(90deg,rgba(47,75,240,.55),#5468FF);transform-origin:left;transform:scaleX(0);transition:transform 1s cubic-bezier(.22,1,.36,1) .15s}
.sp-ladder.in .sp-ladder-track i{transform:none}
.sp-ladder-row.hl .sp-ladder-track i{background:linear-gradient(90deg,#2F4BF0,#8FA6FF);box-shadow:0 0 24px rgba(47,75,240,.6)}
.sp-ladder-track em{position:absolute;left:12px;top:50%;transform:translateY(-50%);font-style:normal;font-size:15px;font-weight:900;letter-spacing:-.02em;color:#fff;text-shadow:0 1px 6px rgba(0,0,0,.4)}
.sp-ladder-note{margin-top:16px;font-size:12.5px;color:rgba(255,255,255,.42);text-align:right}

/* ── 기본 포함 10가지 ── */
.sp-bento{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:12px;max-width:1080px;margin:0 auto}
.sp-bento-i{background:var(--bg2);border:1px solid var(--rule);border-radius:18px;padding:22px 18px 20px;text-align:left;transition:transform .25s,border-color .25s,background .25s}
.sp-bento-i:hover{transform:translateY(-3px);border-color:rgba(47,75,240,.35);background:#fff}
.sp-bento-ico{display:grid;place-items:center;width:42px;height:42px;border-radius:12px;background:#fff;border:1px solid var(--rule);color:var(--acc);margin-bottom:14px}
.sp-bento-ico svg{width:21px;height:21px}
.sp-bento-i b{display:block;font-size:15.5px;font-weight:800;letter-spacing:-.03em;line-height:1.4;color:var(--ink);word-break:keep-all}
.sp-bento-i span{display:block;margin-top:5px;font-size:13px;line-height:1.6;color:var(--muted);word-break:keep-all}
.sp-pricebar{display:flex;align-items:center;gap:34px;max-width:1080px;margin:18px auto 0;padding:24px 30px;border-radius:22px;background:var(--ink);color:#fff;text-align:left}
.sp-pricebar>div span{display:block;font-size:13px;font-weight:700;color:#A8B8FF}
.sp-pricebar>div b{display:block;font-size:30px;font-weight:900;letter-spacing:-.04em;line-height:1.2}
.sp-pricebar>div em{display:block;font-style:normal;font-size:12.5px;color:rgba(255,255,255,.5)}
.sp-pricebar>div+div{padding-left:34px;border-left:1px solid rgba(255,255,255,.14)}
.sp-pricebar .gb{margin-left:auto;padding:16px 26px;font-size:15.5px;text-decoration:none;white-space:nowrap}

/* ── 견적 체크 7가지 ── */
.sp-checks{list-style:none;margin:0 auto;padding:0;max-width:1080px;display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.sp-checks li{display:flex;flex-direction:column;background:#fff;border:1px solid var(--rule);border-radius:20px;padding:24px 22px 22px;text-align:left;box-shadow:0 2px 14px rgba(20,20,50,.05)}
.sp-checks-hd{display:flex;align-items:center;justify-content:space-between;margin-bottom:16px}
.sp-checks-hd span{font-size:34px;font-weight:900;letter-spacing:-.05em;line-height:1;background:var(--grad);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent}
.sp-checks-ico{display:grid;place-items:center;width:40px;height:40px;border-radius:12px;background:rgba(47,75,240,.08);color:var(--acc)}
.sp-checks-ico svg{width:20px;height:20px}
.sp-checks h3{font-size:18.5px;font-weight:800;letter-spacing:-.03em;color:var(--ink)}
.sp-checks p{margin:8px 0 16px;font-size:14.5px;line-height:1.75;color:#4E5968;word-break:keep-all}
.sp-checks-ours{margin-top:auto;padding:13px 14px;border-radius:13px;background:rgba(47,75,240,.06);border:1px solid rgba(47,75,240,.16);font-size:13.5px;line-height:1.65;font-weight:700;color:var(--ink);word-break:keep-all}
.sp-checks-ours b{display:block;font-size:11.5px;font-weight:800;color:var(--acc);margin-bottom:2px}
.sp-checks li.sp-checks-cta{background:var(--ink);border-color:var(--ink);color:#fff;justify-content:center}
.sp-checks-cta h3{color:#fff;font-size:20px;line-height:1.4}
.sp-checks-cta p{color:rgba(255,255,255,.62)}
.sp-checks-cta .gb{padding:14px 18px;font-size:15px;text-decoration:none;align-self:flex-start}

/* ── 고객 제작 사례 ── */
.sp-cases{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;max-width:1080px;margin:0 auto}
.sp-case{position:relative;overflow:hidden;display:flex;flex-direction:column;background:#fff;border:1px solid var(--rule);border-radius:22px;padding:26px 28px 24px;text-align:left;box-shadow:0 2px 14px rgba(20,20,50,.05);transition:transform .25s,box-shadow .25s,border-color .25s}
.sp-case::before{content:'';position:absolute;left:0;top:0;bottom:0;width:4px;background:var(--grad);opacity:0;transition:opacity .25s}
.sp-case:hover{transform:translateY(-3px);border-color:rgba(47,75,240,.35);box-shadow:0 14px 32px rgba(47,75,240,.13)}
.sp-case:hover::before{opacity:1}
.sp-case-hd{display:flex;align-items:center;gap:16px}
.sp-case-ico{flex:none;display:grid;place-items:center;width:54px;height:54px;border-radius:16px;background:var(--grad);color:#fff;box-shadow:0 6px 16px rgba(47,75,240,.3)}
.sp-case-ico svg{width:26px;height:26px}
.sp-case-no{font-family:"DM Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:11.5px;letter-spacing:.2em;color:var(--acc)}
.sp-case h3{margin-top:3px;font-size:21px;font-weight:800;letter-spacing:-.035em;line-height:1.3;color:var(--ink);word-break:keep-all}
.sp-case dl{margin:20px 0 0;display:grid;grid-template-columns:1fr 1fr;gap:14px 22px}
.sp-case dl>div:only-child{grid-column:1/-1}
.sp-case dt{font-size:12.5px;font-weight:800;color:var(--subtle)}
.sp-case dd{margin:2px 0 0;font-size:15px;line-height:1.65;font-weight:600;color:#3A3A52;word-break:keep-all}
.sp-case-tags{margin-top:auto;display:flex;flex-wrap:wrap;gap:6px;padding-top:18px}
.sp-case dl+.sp-case-tags{margin-top:20px;border-top:1px solid var(--rule)}
.sp-case-tags i{font-style:normal;font-size:12.5px;font-weight:700;color:#2340C8;background:rgba(47,75,240,.08);border-radius:99px;padding:5px 11px}

/* ── 사업자 정보 ── */
.sp-company{display:grid;grid-template-columns:minmax(0,.9fr) minmax(0,1.1fr);gap:18px;max-width:1080px;margin:0 auto;text-align:left}
.sp-company-brand{position:relative;overflow:hidden;border-radius:24px;padding:36px 34px;background:var(--ink);color:#fff}
.sp-company-brand::before{content:'';position:absolute;inset:0;background:radial-gradient(520px 320px at 100% 0%,rgba(47,75,240,.45),transparent 70%)}
.sp-company-brand>*{position:relative}
.sp-company-brand .logo{font-size:26px}
.sp-company-brand p{margin-top:10px;font-size:15.5px;color:rgba(255,255,255,.7)}
.sp-company-brand>span{display:inline-block;margin-top:18px;font-family:"DM Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:12px;letter-spacing:.3em;color:#A8B8FF}
.sp-company-btns{display:flex;flex-direction:column;gap:10px;margin-top:28px}
.sp-company-btns .gb{padding:15px 20px;font-size:15.5px;text-decoration:none}
.sp-company-info{margin:0;border-radius:24px;background:#fff;border:1px solid var(--rule);box-shadow:0 2px 14px rgba(20,20,50,.05);padding:8px 30px}
.sp-company-info>div{display:grid;grid-template-columns:130px 1fr;gap:16px;padding:16px 0;border-bottom:1px solid var(--rule)}
.sp-company-info>div:last-child{border-bottom:0}
.sp-company-info dt{font-size:14px;font-weight:700;color:var(--muted)}
.sp-company-info dd{margin:0;font-size:15.5px;font-weight:700;color:var(--ink);word-break:break-all}
.sp-company-info a{color:var(--acc);text-decoration:none}

/* ── 표 · 안내 ── */
.sp-table{max-width:1000px;margin:0 auto;background:#fff;border:1px solid var(--rule);border-radius:var(--r2);overflow:hidden;box-shadow:0 4px 20px rgba(20,20,50,.06)}
.sp-table table{width:100%;border-collapse:collapse;text-align:left}
.sp-table caption{position:absolute;width:1px;height:1px;overflow:hidden;clip:rect(0 0 0 0)}
.sp-table thead th{background:var(--bg2);padding:18px 28px;font-size:13.5px;font-weight:800;letter-spacing:.04em;color:var(--muted);border-bottom:1px solid var(--rule)}
.sp-table tbody th,.sp-table tbody td{padding:17px 28px;border-bottom:1px solid var(--rule);font-size:16px;line-height:1.65;vertical-align:top;word-break:keep-all}
.sp-table tbody tr:last-child th,.sp-table tbody tr:last-child td{border-bottom:0}
.sp-table tbody tr:hover{background:rgba(47,75,240,.03)}
.sp-table tbody th{font-weight:700;color:var(--ink)}
.sp-table tbody td{color:var(--muted);font-weight:500}
.sp-table td.price{white-space:nowrap;font-weight:900;color:var(--ink)}
.sp-table tr.hl{background:rgba(47,75,240,.05)}
.sp-table tr.hl th,.sp-table tr.hl td.price{color:var(--acc)}
.sp-note{max-width:1000px;margin:24px auto 0;padding:18px 24px;border-radius:var(--r);background:rgba(47,75,240,.06);border:1px solid rgba(47,75,240,.18);font-size:15px;line-height:1.8;color:#3A4580;text-align:left;word-break:keep-all}
.sp-note b{color:var(--acc);margin-right:6px}
.sp-more{margin-top:32px;text-align:center;font-size:16px;font-weight:800}
.sp-more a{color:var(--acc);text-decoration:none}
.sp-byline{max-width:1000px;margin:26px auto 0;font-size:13.5px;line-height:1.7;color:var(--subtle);text-align:center}

/* 메인과 같은 떠 있는 버튼 — 이 페이지에서는 링크로 */
body.sp .pc-floating-cta button,body.sp .mob-bar button{cursor:pointer}

@media(max-width:1020px){
  .sp-hero-grid{grid-template-columns:1fr;gap:44px;text-align:center}
  .sp-lead{margin-left:auto;margin-right:auto}
  .sp-hero .hero-ctas{justify-content:center}
  .sp-hero-visual{max-width:560px;margin:0 auto;width:100%}
  .sp-pv,.sp-cv,.sp-av{margin:0 auto}
  .sp-bento{grid-template-columns:repeat(3,minmax(0,1fr))}
  .sp-checks{grid-template-columns:repeat(2,minmax(0,1fr))}
  .sp-icards.c3{grid-template-columns:1fr;max-width:560px}
  .sp-company{grid-template-columns:1fr}
}
@media(max-width:760px){
  .sp-icards,.sp-cases{grid-template-columns:1fr;max-width:560px}
  .sp-show-grid{grid-template-columns:1fr;max-width:480px;margin:0 auto}
  .sp-pricebar{flex-wrap:wrap;gap:18px 26px;padding:22px}
  .sp-pricebar>div+div{padding-left:26px}
  .sp-pricebar .gb{margin-left:0;width:100%}
  .sp-ladder{padding:22px 18px 18px}
  .sp-ladder-scale{margin-left:0}
  .sp-ladder-row{grid-template-columns:1fr;gap:8px}
  .sp-ladder-note{text-align:left}
}
@media(max-width:640px){
  body.sp{padding-bottom:84px}
  .sp-hero{padding:100px 0 48px}
  .sp-lead{font-size:16px;margin-top:18px}
  .sp-hero .hero-ctas{flex-direction:column;align-items:stretch}
  .sp-hero .hero-ctas a{justify-content:center}
  .sp-hero .hstat{margin-top:40px}
  .sp-nav{gap:6px;margin-top:22px}
  .sp-nav a{font-size:13px;padding:7px 13px}
  .sp-mock{padding-bottom:34px}
  .sp-mock .sp-browser{transform:none}
  .sp-mock .sp-phone{right:0;width:30%;border-width:4px;border-radius:20px}
  .sp-pv-price{font-size:50px}
  .sp-pv-card{padding-bottom:26px}
  .sp-pv-mini{position:static;margin-top:12px;flex-direction:row;align-items:center;justify-content:space-between}
  .sp-show,.sp-dark{padding:76px 0}
  .sp-icard{padding:26px 22px 24px}
  .sp-icard strong{font-size:18px}
  .sp-bento{grid-template-columns:repeat(2,minmax(0,1fr));gap:10px}
  .sp-bento-i{padding:18px 14px 16px}
  .sp-checks{grid-template-columns:1fr}
  .sp-case{padding:22px 20px 20px}
  .sp-case h3{font-size:19px}
  .sp-case dl{grid-template-columns:1fr;gap:12px}
  .sp-company-brand{padding:28px 24px}
  .sp-company-info{padding:4px 20px}
  .sp-company-info>div{grid-template-columns:1fr;gap:2px;padding:13px 0}
  /* 휴대폰에서는 표를 옆으로 밀지 않고 한 줄씩 쌓아 보여줍니다 */
  .sp-table table,.sp-table tbody{display:block}
  .sp-table thead{display:none}
  .sp-table tbody tr{display:grid;grid-template-columns:1fr auto;gap:4px 12px;padding:16px 18px;border-bottom:1px solid var(--rule)}
  .sp-table tbody tr:last-child{border-bottom:0}
  .sp-table tbody th,.sp-table tbody td{display:block;padding:0;border:0;font-size:15px}
  .sp-table tbody th{grid-column:1}
  .sp-table tbody td.price{grid-column:2;grid-row:1;text-align:right}
  .sp-table tbody td:not(.price){grid-column:1/-1;font-size:13.5px;line-height:1.6}
  .sp-note{padding:15px 18px;font-size:14px}
}
@media(prefers-reduced-motion:reduce){.sp-ladder-track i{transform:none;transition:none}}
