

.gnb-logo{background: url(/images/pointweb_logo_c.svg) no-repeat; width: 160px; height: 35px; background-size: contain;}

.gnbon2 { font-weight: bold; color: #3730A3 !important; position: relative;}
.gnbon2::after { content: ""; border-bottom: 2px solid #3730A3;display: block; width: 100%; margin-top: 5px; position: absolute; left: 0;}

/* ── 히어로 ── */
.hero{min-height:100vh;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:88px 24px 60px;background:#fff;text-align:center;position:relative;overflow:hidden}
.hero::before{content:'';position:absolute;inset:0;background-image:linear-gradient(rgba(79,70,229,.03) 1px,transparent 1px),linear-gradient(90deg,rgba(79,70,229,.03) 1px,transparent 1px);background-size:60px 60px;pointer-events:none}
.hero-kicker{display:inline-flex;align-items:center;gap:8px;font-size:17px;font-weight:700;color:#4F46E5;background:#EEF2FF;padding:10px 22px;border-radius:20px;margin-bottom:28px}
.hero-kicker::before{content:'';width:8px;height:8px;border-radius:50%;background:#4F46E5;animation:pulse 2s infinite}
@keyframes pulse{0%,100%{opacity:1;transform:scale(1)}50%{opacity:.5;transform:scale(.8)}}
.hero-h1{font-size:clamp(42px,5.5vw,68px);font-weight:700;line-height:1.1;letter-spacing:-.04em;color:#0F172A;margin-bottom:20px}
.hero-h1 em{color:#4F46E5;font-style:normal}
.hero-sub{font-size:clamp(17px,2vw,21px);color:#475569;line-height:1.75;max-width:620px;margin:0 auto 36px}
.hero-sub strong{color:#0F172A;font-weight:600}
.hero-stats{display:flex;align-items:center;justify-content:center;background:#F8FAFC;border:1px solid #E2E8F0;border-radius:14px;width:fit-content;margin:0 auto 40px;overflow:hidden}
.hs{padding:16px 28px;text-align:center;border-right:1px solid #E2E8F0}
.hs:last-child{border-right:none}
.hs-n{display:block;font-size:28px;font-weight:700;color:#0F172A;letter-spacing:-.02em;line-height:1}
.hs-n sup{font-size:13px;color:#4F46E5}
.hs-l{display:block;font-size:13px;color:#94A3B8;margin-top:4px}
.hero-btn{display:inline-flex;align-items:center;gap:8px;font-size:16px;font-weight:600;background:#4F46E5;color:#fff;padding:14px 28px;border-radius:24px;transition:all .2s;box-shadow:0 4px 18px rgba(79,70,229,.28)}
.hero-btn:hover{background:#3730A3;transform:translateY(-2px);box-shadow:0 8px 28px rgba(79,70,229,.38)}
.hero-scroll{position:absolute;bottom:32px;left:50%;transform:translateX(-50%);display:flex;flex-direction:column;align-items:center;gap:6px}
.hero-scroll span{font-size:11px;color:#94A3B8;text-transform:uppercase}
.scroll-line{width:1px;height:32px;background:linear-gradient(to bottom,#94A3B8,transparent);animation:sa 1.8s ease-in-out infinite}
@keyframes sa{0%{transform:scaleY(0);transform-origin:top}50%{transform:scaleY(1);transform-origin:top}51%{transform:scaleY(1);transform-origin:bottom}100%{transform:scaleY(0);transform-origin:bottom}}

/* ── 인디케이터 ── */
.ind-sec{background:#F8FAFC;border-bottom:1px solid #E2E8F0;position:sticky;top:80px;z-index:800}
.ind-inner{padding:0;margin: auto;display:flex;justify-content:center;gap:0;overflow-x:auto;scrollbar-width:none; }
.ind-inner::-webkit-scrollbar{display:none}
.ind-btn{flex-shrink:0;font-size:17px;color:#64748B;padding:20px;border-bottom:2px solid transparent;transition:all .2s;cursor:pointer;white-space:nowrap;background:none;border-top:none;border-left:none;border-right:none;font-family:inherit; flex: 1}
.ind-btn:hover{color:#4F46E5}
.ind-btn.active{color:#4F46E5;border-bottom-color:#4F46E5;font-weight:700; color: #fff; background: #4F46E5}



/* ── 인디케이터 ── */
.ind-sec{z-index:9}

/* 로딩 스피너 CSS
.spinner { position:relative; width:36px; height:36px; border:0; border-radius:50%; animation:spin 1s linear infinite; flex-shrink:0; }
.spinner:before { content:""; position:absolute; left:50%; top:50%; width:7px; height:7px; margin:-3.5px 0 0 -3.5px; border-radius:50%; box-shadow:0 -14px 0 #94a3b8, 10px -10px 0 rgba(148,163,184,.85), 14px 0 0 rgba(148,163,184,.7), 10px 10px 0 rgba(148,163,184,.55), 0 14px 0 rgba(148,163,184,.4), -10px 10px 0 rgba(148,163,184,.3), -14px 0 0 rgba(148,163,184,.2), -10px -10px 0 rgba(148,163,184,.1); }*/

.fixed-cont {position:fixed;left:0;bottom:40px;display:flex;justify-content:center;width:100%;transition:all .3s;z-index:10;}
.fixed-cont a {display:flex;align-items:center;justify-content:center;width:400px;height:70px;border-radius:35px;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background-color:#0F172A;box-shadow:0 4px 16px rgba(0,0,0,.25);font-size:24px;font-weight:600;text-align:center;color:#fff;transition:all .3s;}
.fixed-cont a:hover {background-color:rgba(0,0,0,1);}
.fixed-cont.is-stop {position:absolute;bottom:auto;}

.diagnosis_list { width:100%; margin-top: 150px; }
.diagnosis-item { --point:#7C3AED; --point-dark:#3320b8; --mark:rgba(124,53,255,.16); --icon-bg:#f4f0ff; --soft:#f7f8fb; --text:#111827; --gray:#64748b; font-family:inherit; color:var(--text); margin-bottom: 180px}
.diag-head { text-align:center; margin-bottom:60px; }
.diag-head .subtit { display:block; margin-bottom:14px; font-size:20px; font-weight:600; color:var(--point); }
.diag-head h3 { margin:0; font-size:38px; line-height:1.35; font-weight:700; letter-spacing:-0.04em; }

.diag-card-wrap { display:grid; grid-template-columns:repeat(3,1fr); gap:40px; }
.diag-card { position:relative; min-height:420px; padding:30px; border:1px solid #d7dce3; border-radius:16px; background:#fff; box-sizing:border-box; }
.diag-card.solution { border:2px solid var(--point); }

.diag-icon { width:70px; height:70px; margin-bottom:18px; border-radius:10px; overflow:hidden; background:var(--icon-bg); display:flex; align-items:center; justify-content:center; flex-shrink:0; }
.diag-icon img { width:100%; height:100%; object-fit:cover; display:block; }

.card-label { display:block; margin-bottom:8px; font-size:14px; font-weight:600; color:var(--point); }
.diag-card h4 { margin:0 0 40px; font-size:28px; line-height:1.25; font-weight:700; letter-spacing:-0.04em; }
.diag-card ul { margin:0; padding:0; list-style:none; }
.diag-card li { display:flex; gap:14px; padding:18px 20px; border-radius:12px; background:var(--soft); font-size:17px; line-height:1.7; color:#475569; box-sizing:border-box; }
.diag-card li + li { margin-top:12px; }
.diag-card p { margin:0; letter-spacing: -0.5px}
.diag-card strong { font-weight:700; color:#475569; }
.diag-card.solution strong { color:var(--point); }

.diag-titlebox { display:flex; align-items:flex-start; gap:24px; margin-bottom:40px; }
.diag-titlebox .diag-icon { margin-bottom:0; }
.diag-titlebox h4 { margin:0; }

.diag-card.diag-check li { display:block; padding:22px 10px 22px 26px; border-radius:0; border-top:1px dashed #d5dbe3; background:#fff; position:relative;     letter-spacing: -0.5px;}
.diag-card.diag-check li:before { content:""; position:absolute; left:6px; top:32px; width:6px; height:6px; border-radius:50%; background:#cbd5e1; }
.diag-card.diag-check li:last-child { border-bottom:1px dashed #d5dbe3; }
.diag-card .mark { display:inline; padding:0 4px; background:linear-gradient(to top, var(--mark) 45%, transparent 45%); color:#111827; font-weight:600; }

.xmark { flex:0 0 20px; width:20px; height:20px; margin-top:4px; border-radius:4px; background:#cbd5e1; color:#fff; font-size:17px; line-height:20px; text-align:center; font-weight:600; }
.check { flex:0 0 20px; width:20px; height:20px; margin-top:4px; border-radius:4px; background:var(--point); color:#fff; font-size:15px; line-height:20px; text-align:center; font-weight:700; }

.diag-flow { display:grid; grid-template-columns:1fr 40px 1fr 40px 1fr; gap:0; align-items:center; margin-top:20px; }
.flow-box { min-height:112px; padding:24px 38px; border-radius:14px; background:#f7f8fb; box-sizing:border-box; }
.flow-box span { display:block; margin-bottom:14px; font-size:16px; font-weight:600; color:#94a3b8; }
.flow-box strong { display:block; font-size:22px; line-height:1.35; font-weight:600; letter-spacing:-0.03em; }
.flow-box.before span { color:#ff3f72; }
.flow-box.after { background:linear-gradient(135deg,#4F46E5,#3730A3); color:#fff; }
.flow-box.after span { color:#fff; }
.flow-box.process strong { font-weight: 500; color: #555;display: flex; justify-content: space-between;}

.flow-arrow { width:0; height:0; margin:0 auto; border-top:12px solid transparent; border-bottom:12px solid transparent; border-left:12px solid #94a3b8; }
.flow-arrow.active { border-left-color:var(--point); }

.diag-bottom { display:grid; grid-template-columns:170px 1fr 375px; gap:30px; align-items:center; margin-top:30px; padding:32px 40px; border-radius:16px; background:#eef2f7; }
.diag-bottom > strong { font-size:22px; line-height:1.45; font-weight:700; letter-spacing:-0.04em; }
.diag-bottom ul { margin:0; padding:0 0 0 30px; border-left:1px dashed #cbd5e1; list-style:none; }
.diag-bottom li { position:relative; padding-left:16px; font-size:16px; line-height:1.8; color:#475569; }
.diag-bottom li:before { content:""; position:absolute; left:0; top:13px; width:4px; height:4px; border-radius:50%; background:#cbd5e1; }

.diag-btn { display:flex; align-items:center; justify-content:center; gap:40px; height:70px; border-radius:10px; background:var(--point); color:#fff; font-size:21px; font-weight:700; text-decoration:none; letter-spacing:-0.03em; }
.diag-btn span { font-size:28px; line-height:1; }

.assoc { --point:#7C3AED; --point-dark:#5B21B6; --mark:rgba(124,58,237,.16); --icon-bg:#f4f0ff; }
.franchise { --point:#EA580C; --point-dark:#C2410C; --mark:rgba(234,88,12,.16); --icon-bg:#fff1e8; }
.corp { --point:#2563EB; --point-dark:#1D4ED8; --mark:rgba(37,99,235,.16); --icon-bg:#eaf2ff; }
.med { --point:#059669; --point-dark:#047857; --mark:rgba(5,150,105,.16); --icon-bg:#e7f8f1; }
.shopbox { --point:#DB2777; --point-dark:#BE185D; --mark:rgba(219,39,119,.16); --icon-bg:#fff0f6; }
.edu { --point:#E67B00; --point-dark:#C2410C; --mark:rgba(230,123,0,.16); --icon-bg:#fff4e8; }
.commbox { --point:#0891B2; --point-dark:#0E7490; --mark:rgba(8,145,178,.16); --icon-bg:#ebfbff; }
.sol { --point:#0F766E; --point-dark:#115E59; --mark:rgba(15,118,110,.16); --icon-bg:#e9f8f6; }


@media all and (max-width:1280px) {
  .diagnosis-item { padding-bottom:120px; }
  .diag-head { margin-bottom:45px; }
  .diag-head .subtit { font-size:18px; }
  .diag-head h3 { font-size:32px; }

  .diag-card-wrap { gap:24px; }
  .diag-card { min-height:390px; padding:24px; }
  .diag-titlebox { gap:18px; margin-bottom:32px; }
  .diag-icon { width:60px; height:60px; }
  .diag-card h4 { font-size:24px; }
  .diag-card li { padding:16px; font-size:15px; line-height:1.65; }

  .diag-flow { grid-template-columns:1fr 30px 1fr 30px 1fr; }
  .flow-box { min-height:100px; padding:22px 24px; }
  .flow-box span { font-size:15px; }
  .flow-box strong { font-size:19px; }

  .diag-bottom { grid-template-columns:150px 1fr 310px; gap:24px; padding:28px 30px; }
  .diag-bottom > strong { font-size:20px; }
  .diag-btn { height:64px; font-size:18px; gap:24px; }
  .fixed-cont{ bottom: 0px;}
  .fixed-cont a{width:260px;height:50px;font-size:15px;}

}

@media all and (max-width:768px) {
.diagnosis_list  { padding: 10px 20px; word-break: keep-all; margin-top: 50px;}
  .diagnosis-item { padding-bottom:0; }
  .diag-head { margin-bottom:32px; }
  .diag-head .subtit { margin-bottom:10px; font-size:16px; }
  .diag-head h3 { font-size:25px; line-height:1.4; }

  .diag-card-wrap { display:block; }
  .diag-card { min-height:auto; padding:22px 18px; border-radius:14px; }
  .diag-card + .diag-card { margin-top:18px; }
  .diag-card.solution { border-width:1px; }
  .diag-titlebox { gap:14px; margin-bottom:24px; }
  .diag-icon { width:52px; height:52px; border-radius:8px; }
  .card-label { margin-bottom:5px; font-size:13px; }
  .diag-card h4 { font-size:22px; }
  .diag-card li { gap:10px; padding:14px; font-size:14px; line-height:1.65; }
  .diag-card.diag-check li { padding:18px 8px 18px 22px; }
  .diag-card.diag-check li:before { left:5px; top:29px; width:5px; height:5px; }

  .xmark,
  .check { flex-basis:18px; width:18px; height:18px; margin-top:4px; font-size:14px; line-height:18px; }

  .diag-flow { display:block; margin-top:18px; }
  .flow-box { min-height:auto; padding:20px 18px; border-radius:12px; }
  .flow-box + .flow-box { margin-top:12px; }
  .flow-box span { margin-bottom:10px; font-size:14px; }
  .flow-box strong { font-size:18px; }
  .flow-box.process { margin: 10px 0}
  .flow-arrow { display:none; }

  .diag-bottom { display:block; margin-top:18px; padding:24px 18px; border-radius:14px; }
  .diag-bottom > strong { display:block; margin-bottom:18px; font-size:19px; }
  .diag-bottom ul { padding:0; border-left:0; }
  .diag-bottom li { font-size:14px; line-height:1.8; }
  .diag-btn { margin-top:22px; height:58px; gap:18px; font-size:16px; }
  .diag-btn span { font-size:22px; }
}

@keyframes spin {
  100% { transform:rotate(360deg); }
}


.diag-hero { position:relative; overflow:hidden;    display: flex;background:#fff;height: 100vh; }
.diag-hero:before { content:""; position:absolute; inset:0;  background-size:72px 72px; pointer-events:none; }
/* .diag-hero:before { content:""; position:absolute; inset:0; background-image:linear-gradient(rgba(79,70,229,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(79,70,229,.045) 1px, transparent 1px); background-size:72px 72px; pointer-events:none; } */
.diag-hero-wrap { position:relative; z-index:1; display:grid; grid-template-columns:1fr 540px; gap:120px; align-items:center; }

.diag-hero-copy { max-width:760px; }

.diag-hero .layoutbox { width: 1280px}

.hero-chip { display:inline-flex; align-items:center; gap:10px; height:46px; padding:0 26px; margin-bottom:38px; border-radius:999px; background:#eef2ff; color:#4f46e5; font-size:18px; font-weight:700; letter-spacing:-0.03em; }
.hero-chip i { width:8px; height:8px; border-radius:50%; background:#818cf8; }

.diag-hero-copy h2 { margin:0; font-size:80px; line-height:1.02; font-weight:800; letter-spacing:-0.02em; color:#0f172a; }
.diag-hero-copy h2 em { font-style:normal; color:#4f46e5; }

.hero-desc { margin:38px 0 10px; font-size:24px; line-height:1.2; color:#64748b; letter-spacing:-0.04em; }
.hero-sub01 { display:block; font-size:24px; line-height:1.2; font-weight:700; letter-spacing:-0.04em; color:#111827; }
.hero-btns { display:flex; gap:16px; margin-top:48px; }

.hero-btn { display:flex; align-items:center; justify-content:center; min-width:210px; height:64px; padding:0 34px; border:1px solid rgba(79,70,229,.16); border-radius:999px; background:#fff; color:#111827; font-size:18px; font-weight:700; text-decoration:none; transition:.3s ease; }

.hero-btn.primary { background:linear-gradient(135deg,#4F46E5,#7C3AED); border-color:transparent; color:#fff; box-shadow:0 20px 45px rgba(79,70,229,.25); }

.hero-btn:hover { transform:translateY(-4px); }

.diag-hero-visual { position:relative; height:520px; }

.visual-bg { position:absolute; inset:40px; border-radius:42px; background:linear-gradient(180deg,rgba(79,70,229,.06),rgba(79,70,229,.01)); border:1px solid rgba(79,70,229,.08); backdrop-filter:blur(10px); }

.visual-card { position:absolute; left:0; width:150px; height:88px; padding:22px; border-radius:24px; background:rgba(255,255,255,.88); border:1px solid rgba(79,70,229,.12); box-shadow:0 24px 55px rgba(15,23,42,.08); display:flex; flex-direction:column; justify-content:center; gap:8px; animation:floatCard 3.6s ease-in-out infinite; }

.visual-card span { font-size:18px; font-weight:800; color:#4f46e5; letter-spacing:-0.04em; }

.visual-card small { font-size:22px; font-weight:800; color:#111827; letter-spacing:-0.04em; }

.visual-card.card01 { top:60px; }
.visual-card.card02 { top:210px; animation-delay:.4s; }
.visual-card.card03 { top:360px; animation-delay:.8s; }

.visual-core { position:absolute; right:90px; top:50%; width:180px; height:180px; border-radius:42px; background:linear-gradient(135deg,#4F46E5,#7C3AED); transform:translateY(-50%); display:flex; flex-direction:column; align-items:center; justify-content:center; box-shadow:0 40px 80px rgba(79,70,229,.28); animation:corePulse 3s ease-in-out infinite; z-index: 1;}

.visual-core strong { font-size:42px; line-height:1; font-weight:800; color:#fff; letter-spacing:-0.05em; }

.visual-core em { margin-top:12px; font-style:normal; font-size:22px; line-height:1; font-weight:700; color:rgba(255,255,255,.82); }

.visual-result { position:absolute; right:0; top:50%; width:118px; height:118px; border-radius:50%; background:#0f172a; transform:translateY(-50%); display:flex; align-items:center; justify-content:center; box-shadow:0 26px 60px rgba(15,23,42,.22); animation:resultFloat 2.6s ease-in-out infinite; }

.visual-result span { font-size:30px; font-weight:800; color:#fff; letter-spacing:-0.05em; }

.flow-line { position:absolute; left:150px; width:220px; height:2px; background:linear-gradient(90deg,rgba(79,70,229,.08),rgba(79,70,229,.55),rgba(79,70,229,.08)); overflow:hidden; }

.flow-line:after { content:""; position:absolute; left:-45%; top:0; width:45%; height:100%; background:#4f46e5; animation:lineMove 2s ease-in-out infinite; }

.flow-line.line01 { top:104px; }
.flow-line.line02 { top:254px; }
.flow-line.line03 { top:404px; }

.diag-hero-visual:hover .visual-core { transform:translateY(-50%) scale(1.04); }
.diag-hero-visual:hover .visual-result { background:#4f46e5; }


@media (max-width:1280px){
.diag-hero { padding:150px 0 110px; }
.diag-hero-wrap { grid-template-columns:1fr 460px; gap:70px; }
.hero-chip { height:42px; padding:0 22px; margin-bottom:30px; font-size:16px; }
.diag-hero-copy h2 { font-size:64px; }
.hero-desc { margin:30px 0 10px; font-size:22px; }
.hero-sub01 { font-size:22px; }
.diag-hero-visual { height:460px; }
.visual-bg { inset:34px; border-radius:36px; }
.visual-card { width:132px; height:78px; padding:18px; border-radius:20px; }
.visual-card span { font-size:16px; }
.visual-card small { font-size:19px; }
.visual-card.card01 { top:54px; }
.visual-card.card02 { top:190px; }
.visual-card.card03 { top:326px; }
.visual-core { right:62px; width:160px; height:160px; border-radius:36px; }
.visual-core strong { font-size:38px; }
.flow-line { left:132px; width:185px; }
.flow-line.line01 { top:93px; }
.flow-line.line02 { top:229px; }
.flow-line.line03 { top:365px; }
}

@media (max-width:768px){
.diag-hero { padding:110px 0 70px; }
.diag-hero:before { background-size:46px 46px; }
.diag-hero-wrap { display:block; padding: 0 25px}
.diag-hero-copy { max-width:none; }
.hero-chip { height:36px; padding:0 16px; margin-bottom:22px; gap:8px; font-size:14px; }
.hero-chip i { width:6px; height:6px; }
.diag-hero-copy h2 { font-size:42px; line-height:1.08; }
.hero-desc { margin:24px 0 8px; font-size:18px; }
.hero-sub01 { font-size:18px; line-height:1.45; }
.diag-hero-visual { height:390px; margin-top:50px; }
.visual-bg { inset:18px 0 18px 34px; border-radius:30px; }
.visual-card { left:0; width:116px; height:68px; padding:15px; border-radius:18px; gap:5px; }
.visual-card span { font-size:14px; }
.visual-card small { font-size:17px; }
.visual-card.card01 { top:46px; }
.visual-card.card02 { top:164px; }
.visual-card.card03 { top:282px; }
.visual-core { right:8px; width:132px; height:132px; border-radius:30px; }
.visual-core strong { font-size:32px; }
.flow-line { left:116px; width:calc(100% - 238px); min-width:72px; }
.flow-line.line01 { top:80px; }
.flow-line.line02 { top:198px; }
.flow-line.line03 { top:316px; }
}

@media (max-width:480px){
.diag-hero-copy h2 { font-size:36px; }
.hero-desc { font-size:17px; }
.hero-sub01 { font-size:16px; }
.diag-hero-visual { height:350px; }
.visual-core { width:112px; height:112px; right:0; border-radius:26px; }
.visual-core strong { font-size:28px; }
.visual-card { width:104px; height:62px; padding:13px; }
.visual-card small { font-size:15px; }
.flow-line { left:104px; width:calc(100% - 210px); min-width:54px; }
.visual-card.card01 { top:42px; }
.visual-card.card02 { top:146px; }
.visual-card.card03 { top:250px; }
.flow-line.line01 { top:73px; }
.flow-line.line02 { top:177px; }
.flow-line.line03 { top:281px; }
}


@keyframes floatCard {
  0%,100% { transform:translateY(0); }
  50% { transform:translateY(-10px); }
}

@keyframes corePulse {
  0%,100% { transform:translateY(-50%) scale(1); }
  50% { transform:translateY(-50%) scale(1.03); }
}

@keyframes resultFloat {
  0%,100% { transform:translateY(-50%); }
  50% { transform:translateY(calc(-50% - 8px)); }
}

@keyframes lineMove {
  0% { left:-45%; opacity:0; }
  30% { opacity:1; }
  100% { left:100%; opacity:0; }
}





/* ── 케이스 섹션 ── */
.cases-sec{padding:48px 48px 96px}

/* ── 케이스 아코디언 ── */
.case-item{border:2px solid #E2E8F0;border-radius:16px;margin-bottom:60px;transition:border-color .2s}
.case-item
.case-trigger{width:100%;display:flex;flex-direction:row;align-items:center;gap:16px;padding:22px 28px;background:#fff;border:none;cursor:pointer;font-family:inherit;transition:background .2s;text-align:left;border-radius:16px}
.case-trigger:hover{background:#F8FAFC}
.case-item .ct-left{display:flex;flex-direction:row;align-items:center;gap:14px;flex:1;min-width:0}
.ct-icon{width:70px;height:70px;border-radius:12px;display:flex;align-items:center;justify-content:center;font-size:26px;flex-shrink:0}
.ct-badge{font-size:18px;font-weight:700;margin-bottom:4px}
.ct-q{font-size:28px;font-weight:bold;;color:#0F172A;line-height:1.4}
.ct-result{font-size:15px;color:#64748B;flex-shrink:0;text-align:right;line-height:1.5;background:#F8FAFC;border:1px solid #E2E8F0;border-radius:8px;padding:5px 11px}
.ct-arr{font-size:18px;color:#94A3B8;flex-shrink:0;transition:transform .3s}
.case-item.open .case-item.open {}

  .case-item:last-child { margin-bottom: 10px}
  .case-item .case-trigger

/* ── 패널 ── */
.case-panel{max-height:0;overflow:hidden;transition:max-height .5s ease}
.case-panel
.panel-inner{padding:0 28px 28px;display:flex;flex-direction:column;gap:18px;border-top:1px solid #E2E8F0}

/* ── 탭 ── */
.tab-btns{display:flex;gap:0;border-bottom:1px solid #E2E8F0;margin-bottom:4px;padding-top:12px}
.tab-btn{font-size:17px;font-weight:600;color:#94A3B8;padding:10px 10px;border:none;background:none;cursor:pointer;border-bottom:2px solid transparent;font-family:inherit;transition:all .2s;white-space:nowrap}
.tab-btn.tab-btn.tab-btn
.tab-btn:hover{color:#475569}
.tab-pane{display:none;}
.tab-pane.tab-pane.tab-pane { }

/* ── 문제·해결 목록 ── */
.prob-list{display:flex;flex-direction:column;gap:8px}
.prob-item{display:flex;gap:12px;align-items:flex-start;font-size:16px;color:#475569;line-height:1.65}
.prob-dot{width:7px;height:7px;border-radius:50%;background:#F87171;flex-shrink:0;margin-top:8px}
.prob-txt{flex:1}
.sol-list{display:flex;flex-direction:column;gap:12px}
.sol-item{display:flex;gap:12px;align-items:flex-start;font-size:16px;color:#475569;line-height:1.65}
.sol-dot{width:22px;height:22px;border-radius:7px;flex-shrink:0;display:flex;align-items:center;justify-content:center;margin-top:2px}
.sol-txt{flex:1}
.diag-quote{font-size:16px;color:#0F172A;line-height:1.8;padding:18px 20px;border-left:3px solid;border-radius:0 10px 10px 0;background:#F8FAFC}

/* ── Before/After ── */
.ba-row{display:grid;grid-template-columns:1fr 40px 1fr;align-items:center;background:#0F172A;border-radius:12px;overflow:hidden}
.ba-before{padding:20px 24px}
.ba-after{padding:20px 24px}
.ba-label{font-size:14px;font-weight:700;text-transform:uppercase;margin-bottom:8px}
.ba-label-b{color:#ff3d6e}
.ba-label-a{color:#818CF8}
.ba-before .ba-txt{font-size:17px;color:#ddd;line-height:1.6}
.ba-txt-a{font-size:17px;color:rgba(255,255,255,.88);line-height:1.6;font-weight:600}
.ba-arrow{text-align:center;font-size:20px;color:#fff}

/* ── BA 직후 CTA ── */
.ba-cta-btn{display:inline-flex;align-items:center;gap:8px;font-size:15px;font-weight:700;color:#fff;background:#4F46E5;padding:13px 28px;border-radius:24px;text-decoration:none;box-shadow:0 4px 16px rgba(79,70,229,.25);transition:all .2s}

/* ── 받는것 ── */
.rec-row{display:flex;align-items:center;justify-content:space-between;gap:20px;background:#F8FAFC;border-radius:12px;padding:20px 24px}
.rec-title{font-size:16px;font-weight:700;color:#0F172A;margin-bottom:10px}
.rec-items{display:flex;flex-direction:column;gap:6px}
.rec-item{font-size:16px;color:#475569}
.rec-btn{flex-shrink:0;display:inline-flex;align-items:center;font-size:15px;font-weight:700;color:#fff;padding:14px 24px;border-radius:12px;text-decoration:none;transition:all .2s;white-space:nowrap;box-shadow:0 4px 14px rgba(0,0,0,.18)}

/* ── CTA 섹션 ── */
.cta-sec{background:#fff;padding:96px 24px;text-align:center;border-top:1px solid #F1F5F9;position:relative;overflow:hidden}
.cta-sec::before{content:'';position:absolute;width:600px;height:600px;border-radius:50%;background:radial-gradient(circle,rgba(79,70,229,.05) 0%,transparent 70%);top:-200px;right:-100px;pointer-events:none}
.cta-kicker{font-size:13px;font-weight:700;text-transform:uppercase;color:#4F46E5;margin-bottom:20px}
.cta-h2{font-size:clamp(38px,5vw,68px);font-weight:700;letter-spacing:-.04em;line-height:1.1;color:#0F172A;margin-bottom:14px}
.cta-h2 em{color:#4F46E5;font-style:normal}
.cta-sub{font-size:19px;color:#64748B;max-width:500px;margin:0 auto 48px;line-height:1.7}
.cta-form{max-width:520px;margin:0 auto;background:#F8FAFC;border:1px solid #E2E8F0;border-radius:20px;padding:36px;text-align:left}
.cf-hint{font-size:14px;color:#64748B;text-align:center;margin-bottom:20px;line-height:1.6}
.cf-chips{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px}
.cf-chip{font-size:14px;color:#475569;background:#fff;border:1.5px solid #E2E8F0;border-radius:20px;padding:8px 16px;cursor:pointer;transition:all .15s;font-family:inherit}
.cf-chip:hover{border-color:#4F46E5;color:#4F46E5}
.cf-chip.cf-chip
.cf-label{font-size:14px;font-weight:700;color:#475569;display:block;margin-bottom:8px}
.cf-input{width:100%;background:#fff;border:1.5px solid #E2E8F0;border-radius:10px;padding:13px 16px;font-size:16px;color:#0F172A;font-family:inherit;transition:border-color .2s;margin-bottom:16px;display:block}
.cf-input:focus{outline:none;border-color:#4F46E5;box-shadow:0 0 0 3px rgba(79,70,229,.08)}.cf-input:focus-visible{outline:2px solid #4F46E5;outline-offset:1px}
.cf-input::placeholder{color:#CBD5E1}
.cf-row{display:grid;grid-template-columns:1fr 1fr;gap:12px;margin-bottom:16px}
.cf-row
.cf-row
.cf-note{font-size:13px;color:#64748B;text-align:center;margin-top:16px;line-height:1.7}
.cf-note strong{font-weight:700;color:#0F172A}

/* ── 푸터 ── */
.footer{background:#0F172A;padding:36px 48px;border-top:1px solid rgba(255,255,255,.06)}
.ft-inner{display:flex;align-items:center;justify-content:space-between;flex-wrap:wrap;gap:16px}
.ft-links{display:flex;gap:20px;flex-wrap:wrap}
.ft-links a{font-size:14px;color:rgba(255,255,255,.35);transition:color .2s}
.ft-links a:hover{color:rgba(255,255,255,.7)}
.ft-copy{font-size:13px;color:rgba(255,255,255,.2)}

/* ── 애니메이션 ── */
.fade-up{opacity:0;transform:translateY(24px);transition:opacity .75s cubic-bezier(.22,.68,0,1.05),transform .75s cubic-bezier(.22,.68,0,1.05)}
.fade-up.show{opacity:1;transform:none}
.d1{transition-delay:.08s}.d2{transition-delay:.16s}.d3{transition-delay:.24s}


/* ── 반응형 ── */
@media(max-width:1280px){

}

/* ── 반응형 ── */
@media(max-width:767px){
  .case-item.open .case-trigger{border-radius:16px 16px 0 0}
  .case-trigger{padding:16px 18px;gap:12px}
  .cta-form{padding: 20px}
  .gnb-menu,.gnb-tel{display:none}
  .hero{padding:80px 20px 52px}
  .ind-inner{justify-content:flex-start; }
  .ind-btn{font-size:14px;padding:13px 12px}
  .cases-sec{padding:32px 16px 64px}

  .ct-result{display:none}
  .panel-inner{padding:0 16px 20px}
  .tab-btn{font-size:15px;padding:10px 10px}
  .ba-row{grid-template-columns:1fr; text-align: center}
  .ba-arrow{transform:rotate(90deg);padding:4px 0;text-align:center}
  .rec-row{flex-direction:column;align-items:flex-start}
  .rec-btn{width:100%;justify-content:center}
  .case-panel .panel-inner { padding: 0 20px 10px}
  .case-item .case-trigger { padding: 16px 18px}
.cf-chip { width: 48%; padding:8px }
.cf-chips { gap:5px }

  .cf-row{grid-template-columns:1fr}
  .cf-row
  .cf-row
  .cta-form{padding:24px 20px}
  .footer{padding:28px 20px}
  .ft-inner{flex-direction:column;align-items:flex-start}
  .hs{padding:14px 18px}

  .ba-label { margin-bottom: 2px}
.rec-title{ font-size: 15px}
  .rec-item { font-size: 15px}
.ct-arr { display: none;}
  .case-item .ct-left {text-align: center; flex-direction: column;}
}
@media(max-width:900px){.ind-inner{justify-content:flex-start}}


.case-item.open{border-color:#4F46E5}
.case-panel.open{max-height:3000px;overflow:visible}
.tab-btn.on{color:#4F46E5;border-bottom-color:#4F46E5}
.tab-pane.on{display:block}
.cf-chip.on{background:#4F46E5;border-color:#4F46E5;color:#fff}
.cf-row .cf-input{margin-bottom:0}
.cf-drop{border:1.5px dashed #E2E8F0;border-radius:10px;background:#fff;padding:16px;text-align:center;cursor:pointer;transition:border-color .2s,background .2s;position:relative;margin-bottom:16px}
.cf-drop:hover{border-color:#4F46E5;background:#F5F3FF}
.cf-drop.disabled{opacity:.45;pointer-events:none}
.cf-drop input[type="file"]{position:absolute;inset:0;opacity:0;cursor:pointer;width:100%;height:100%}
.cf-drop-icon{font-size:20px;margin-bottom:4px}
.cf-drop-txt{font-size:14px;color:#64748B;line-height:1.55}
.cf-drop-txt strong{color:#4F46E5;font-weight:600}
.cf-drop-ext{font-size:12px;color:#94A3B8;margin-top:4px}
.cf-file-list{margin-bottom:16px;display:flex;flex-direction:column;gap:6px}
.cf-file-item{display:flex;align-items:center;justify-content:space-between;background:#F8FAFC;border:1px solid #E2E8F0;border-radius:8px;padding:7px 12px;font-size:13px;color:#475569}
.cf-file-del{background:none;border:none;color:#94A3B8;font-size:17px;line-height:1;cursor:pointer;padding:0 2px;transition:color .15s;font-family:inherit}
.cf-file-del:hover{color:#E24B4A}
.panel-inner{font-size:16px;line-height:1.75}
.panel-inner p{font-size:16px;line-height:1.8;color:#475569}
.panel-inner li{font-size:16px;line-height:1.8;color:#475569}
.panel-desc{font-size:16px;line-height:1.8;color:#475569}
.prob-list li{font-size:15px;line-height:1.8;color:#475569}
.sol-list li{font-size:15px;line-height:1.8;color:#475569}
.ba-item p{font-size:15px;line-height:1.8;color:#475569}
.result-item .ri-val{font-size:22px;font-weight:700}
.result-item .ri-label{font-size:14px;color:#64748B}

.landing-link{font-size:15px;font-weight:600}

/* ═══ 모바일 햄버거 메뉴 ═══ */
.gnb-ham{display:none;flex-direction:column;justify-content:center;align-items:center;width:44px;height:44px;cursor:pointer;background:none;border:none;padding:0;gap:5px;z-index:1100;flex-shrink:0}
.gnb-ham span{display:block;width:22px;height:2px;background:#0F172A;border-radius:2px;transition:all .3s cubic-bezier(.4,0,.2,1)}
.gnb-ham.open span:nth-child(1){transform:translateY(7px) rotate(45deg)}
.gnb-ham.open span:nth-child(2){opacity:0;transform:scaleX(0)}
.gnb-ham.open span:nth-child(3){transform:translateY(-7px) rotate(-45deg)}
.mob-drawer{position:fixed;inset:0;z-index:1050;pointer-events:none}
.mob-overlay{position:absolute;inset:0;background:rgba(15,23,42,.45);opacity:0;transition:opacity .3s ease}
.mob-panel{position:absolute;top:0;right:0;width:min(320px,85vw);height:100%;background:#fff;transform:translateX(100%);transition:transform .35s cubic-bezier(.4,0,.2,1);display:flex;flex-direction:column;padding:0;box-shadow:-4px 0 24px rgba(0,0,0,.08)}
.mob-drawer.open{pointer-events:auto}
.mob-drawer.open .mob-overlay{opacity:1}
.mob-drawer.open .mob-panel{transform:translateX(0)}
.mob-panel-head{display:flex;align-items:center;justify-content:space-between;padding:20px 24px;border-bottom:1px solid #F1F5F9}
.mob-panel-logo{font-size:20px;font-weight:800;color:#0F172A;text-decoration:none}
.mob-panel-close{width:36px;height:36px;border:none;background:#F8FAFC;border-radius:50%;cursor:pointer;font-size:18px;color:#64748B;display:flex;align-items:center;justify-content:center}
.mob-nav{display:flex;flex-direction:column;padding:16px 0;flex:1}
.mob-nav a{font-size:17px;font-weight:600;color:#0F172A;padding:14px 24px;text-decoration:none;border-bottom:1px solid #F8FAFC;transition:background .15s}
.mob-nav a:hover{background:#F8FAFC;color:#4F46E5}
.mob-panel-foot{padding:20px 24px}
.mob-cta{display:block;text-align:center;background:#4F46E5;color:#fff;font-size:16px;font-weight:700;padding:15px;border-radius:14px;text-decoration:none}
.mob-tel{text-align:center;font-size:13px;color:#94A3B8;margin-top:12px}
@media(max-width:767px){
  .gnb-ham{display:flex}
  .ct-badge { font-size: 15px}
  .ct-q { font-size: 18px; word-break: keep-all;}
  .prob-txt {font-size: 15px;word-break: keep-all;}
  .ba-before .ba-txt { font-size: 15px; line-height: 1.4; word-break: keep-all; }
  .ba-txt-a {font-size: 15px}
  .ba-after { padding: 10px 20px 20px; word-break: keep-all;}
  .ba-before { padding: 20px 20px 10px}
  .ba-cta-btn {padding: 13px 10px;width: 100%;text-align: center;font-size: 14px;margin: auto;display: block;}
  }




/* ── 태블릿 대응 (768px ~ 1024px) ── */
@media(min-width:768px) and (max-width:1024px){
  .hero-inner,.hero-content{padding:0 32px}
  .trust,.portfolio-prev,.reviews,.process,.faq-cta,.why,.industry{padding:72px 40px}
  .trust-grid{grid-template-columns:repeat(2,1fr)}
  .pf-grid{grid-template-columns:repeat(2,1fr)}
  .review-grid{grid-template-columns:1fr}
  .industry-grid{grid-template-columns:repeat(2,1fr)}
  .why-grid{grid-template-columns:1fr 1fr}
  .hero-stats{width:90%}
  .inn,.container{padding:0 32px}
  .cta-form{padding:28px 24px}
}

.hero-h1,.sec-h2,.cta-h2,.hero-h1,.card-title{word-break:keep-all}

/* ── iOS Safari 주소창 대응 ── */
@supports (height: 100svh){
  .hero,.hero-section,section.hero{min-height:100svh !important}
}
/* ── 소폰(480px 이하) 추가 최적화 ── */
@media(max-width:480px){
  body{font-size:14px}
  .mob-panel{width:min(300px,90vw)}
  .hero-h1,.cta-h2{font-size:clamp(32px,9vw,52px)}
  .cf-row{grid-template-columns:1fr !important}
  .cf-input{font-size:16px}  /* iOS 줌 방지 */
  .btn-pw,.cf-btn,.mob-cta{min-height:44px}
}


.cf-input::placeholder { color: #CBD5E1; }
.cf-note {
  font-size: 15px; color: #64748B;
  text-align: center; margin-top: 16px; line-height: 1.7;
}
.cf-note strong { font-weight: 700; color: #0F172A; }


@media (max-width: 760px) {
  .cf-note {  font-size: 12px}
}
