@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css");
:root{
  --svh-navy:#0B2A5C; --svh-blue:#123E82; --svh-blue-2:#1B56AE; --svh-tint:#EAF0FA; --svh-line:#DCE3EE;
  --svh-text:#1B2A41; --svh-mute:#5E6B80; --svh-font:"Pretendard","Noto Sans KR","Malgun Gothic",-apple-system,"Segoe UI",sans-serif;
}
body, input, button, textarea, select, .navbar, h1,h2,h3,h4,h5,h6{ font-family: var(--svh-font) !important; }

/* ── GNB ─────────────────────────────────────────── */
.svh-gnb-wrap{ display:flex; align-items:center; gap:8px; margin-left:20px; height:100%; position:relative; z-index:1200; }
.svh-gnb{ display:block; }
.svh-menu{ display:flex; gap:2px; margin:0; padding:0; list-style:none; }
.svh-item{ position:relative; list-style:none; }
.svh-item>a{ display:flex; align-items:center; gap:4px; height:56px; padding:0 13px; font-size:15px; font-weight:600; letter-spacing:-.01em; color:var(--svh-navy); text-decoration:none; white-space:nowrap; transition:color .15s; }
.svh-item>a:hover, .svh-item:hover>a{ color:var(--svh-blue-2); }
.svh-dot{ font-style:normal; font-size:9px; font-weight:700; line-height:1; color:#fff; background:var(--svh-blue-2); border-radius:8px; padding:2px 4px; margin-left:1px; transform:translateY(-6px); }
.svh-sub{ position:absolute; left:0; top:100%; min-width:260px; padding-top:0; display:none; }
.svh-item:hover .svh-sub, .svh-item:focus-within .svh-sub{ display:block; }
.svh-sub-in{ background:#fff; border:1px solid var(--svh-line); border-radius:8px; padding:8px; box-shadow:0 8px 24px rgba(11,42,92,.10); }
.svh-sub-in a{ display:block; padding:10px 12px; border-radius:6px; text-decoration:none; color:var(--svh-text); }
.svh-sub-in a:hover{ background:var(--svh-tint); }
.svh-sub-in b{ display:block; font-size:14px; font-weight:600; }
.svh-sub-in span{ display:block; margin-top:2px; font-size:12px; color:var(--svh-mute); font-weight:400; }
.svh-ext svg{ opacity:.7; }
.svh-burger{ display:none; width:40px; height:40px; border:0; background:transparent; cursor:pointer; padding:0; }
.svh-burger span{ display:block; width:20px; height:2px; background:var(--svh-navy); margin:4px auto; border-radius:2px; }

/* 서비스 전환(커뮤니티 | 영상) */
.svh-switch{ display:flex; margin-left:6px; padding:3px; background:var(--svh-tint); border-radius:999px; }
.svh-switch a{ display:flex; align-items:center; gap:5px; padding:6px 13px; font-size:13px; font-weight:600; color:var(--svh-blue); border-radius:999px; text-decoration:none; white-space:nowrap; }
.svh-switch a.on{ background:var(--svh-navy); color:#fff; }
.svh-switch a:not(.on):hover{ background:#fff; }

/* 헤더 안에 들어갈 때 (WoWonder 는 네이비 헤더 → 흰 글씨) */
html.svh-in-header:not(.svh-video) .svh-item>a{ color:#fff; }
html.svh-in-header:not(.svh-video) .svh-item:hover>a{ color:#BFD3F2; }
html.svh-in-header:not(.svh-video) .svh-burger span{ background:#fff; }
html.svh-in-header:not(.svh-video) .svh-switch{ background:rgba(255,255,255,.12); }
html.svh-in-header:not(.svh-video) .svh-switch a{ color:#fff; }
html.svh-in-header:not(.svh-video) .svh-switch a.on{ background:#fff; color:var(--svh-navy); }
html.svh-in-header:not(.svh-video) .svh-switch a:not(.on):hover{ background:rgba(255,255,255,.2); }
html.svh-in-header:not(.svh-video) .svh-dot{ background:#fff; color:var(--svh-navy); }
html.svh-in-header .wow_hdr_innr_left{ display:flex; align-items:center; }

/* PlayTube 헤더 */
.pt_header_nav .left-part{ display:flex; align-items:center; }
.pt_header_nav .svh-gnb-wrap{ margin-left:8px; }
.pt_header_nav .svh-item>a{ height:56px; padding:0 10px; font-size:14.5px; }
.pt_header_nav .search-header{ flex:1 1 220px; max-width:360px; }
html.svh-video .pt_header_nav .search-header{ margin-left:12px; }

/* 헤더 없는 화면용 고정 바 */
.svh-bar{ position:fixed; top:0; left:0; right:0; height:56px; z-index:1500; display:flex; align-items:center; padding:0 20px; background:var(--svh-navy); }
.svh-bar-logo{ display:flex; align-items:center; }
.svh-has-bar body{ padding-top:56px; }
.svh-bar .svh-item>a{ color:#fff; }
.svh-bar .svh-switch{ background:rgba(255,255,255,.12); }
.svh-bar .svh-switch a{ color:#fff; }
.svh-bar .svh-switch a.on{ background:#fff; color:var(--svh-navy); }
.svh-bar .svh-burger span{ background:#fff; }
.svh-has-bar .wow_welcome_left, .svh-has-bar .welcome-page{ margin-top:0; }

/* ── 푸터 ─────────────────────────────────────────── */
.svh-footer{ clear:both; background:#0B2A5C; color:#C9D6EC; font-size:13.5px; line-height:1.7; margin-top:48px; }
.svh-f-in{ max-width:1200px; margin:0 auto; padding:44px 24px 28px; display:grid; grid-template-columns:1.6fr 1fr 1fr 1fr; gap:32px; }
.svh-f-brand p{ margin:14px 0 0; color:#AFC0DC; }
.svh-f-col h4{ margin:0 0 12px; font-size:13px; font-weight:700; letter-spacing:.02em; color:#fff; }
.svh-f-col a{ display:block; padding:3px 0; color:#C9D6EC; text-decoration:none; }
.svh-f-col a:hover{ color:#fff; text-decoration:underline; }
.svh-f-bar{ border-top:1px solid rgba(255,255,255,.14); padding:16px 24px; text-align:center; font-size:12px; color:#9FB2D2; }
html.svh-video .svh-footer{ margin-left:80px; }

/* ── 반응형 ───────────────────────────────────────── */
@media (max-width:1100px){
  .svh-burger{ display:block; }
  .svh-gnb{ display:none; position:fixed; left:0; right:0; top:56px; max-height:calc(100vh - 56px); overflow:auto; background:#fff; border-top:1px solid var(--svh-line); padding:8px 12px 20px; z-index:1400; }
  .svh-open .svh-gnb{ display:block; }
  .svh-menu{ flex-direction:column; gap:0; }
  .svh-item>a{ height:46px; color:var(--svh-navy) !important; }
  .svh-sub{ position:static; display:none; min-width:0; }
  .svh-item:hover .svh-sub{ display:none; }
  .svh-item.svh-expanded .svh-sub{ display:block !important; }
  .svh-sub-in{ border:0; box-shadow:none; background:var(--svh-tint); }
  .svh-switch a{ padding:6px 10px; }
  .svh-f-in{ grid-template-columns:1fr 1fr; }
  html.svh-video .svh-footer{ margin-left:0; }
}
@media (max-width:560px){ .svh-switch a svg{ display:none; } .svh-f-in{ grid-template-columns:1fr; } }

/* PlayTube 검색창이 GNB 때문에 줄어드는 문제 보정 */
.pt_header_nav .search-header{ flex:1 1 200px; min-width:180px; max-width:340px; width:auto; }
.pt_header_nav .search-header .form-group{ display:flex; width:100%; margin:0; }
.pt_header_nav .search-header .form-control{ flex:1 1 auto; min-width:100px; width:auto !important; }
.pt_header_nav .search-header .btn-main{ flex:0 0 auto; }
@media (max-width:1350px){ .pt_header_nav .svh-item>a{ padding:0 7px; font-size:13.5px; } .pt_header_nav .svh-switch a{ padding:6px 9px; } }

.pt_header_nav .search-header{ max-width:260px; min-width:150px; }
.pt_header_nav .right-part{ flex-shrink:0; }
@media (max-width:1500px){ .pt_header_nav .svh-item>a{ padding:0 7px; font-size:13.5px; } .pt_header_nav .search-header{ max-width:200px; } }

/* WoWonder 헤더(높이 48px) 보정 */
html:not(.svh-video) .navbar-fixed-top .header-fixed1000, html:not(.svh-video) nav.header-fixed1000{ width:100% !important; max-width:none !important; padding:0 12px !important; }
html.svh-in-header:not(.svh-video) .navbar-fixed-top .container-fluid{ display:flex; align-items:center; flex-wrap:nowrap; height:48px; }
html.svh-in-header:not(.svh-video) .wow_hdr_innr_left{ display:flex; align-items:center; flex-wrap:nowrap; height:48px; flex:0 1 auto; min-width:0; }
html.svh-in-header:not(.svh-video) .wow_hdr_innr_left .navbar-nav{ flex-wrap:nowrap; display:flex; margin:0 0 0 4px; }
html:not(.svh-video) .svh-gnb-wrap{ height:48px; margin-left:12px; }
html:not(.svh-video) .svh-item>a{ height:48px; padding:0 9px; font-size:14px; }
html:not(.svh-video) .svh-switch a{ padding:5px 11px; }

/* WoWonder: 헤더 가로 폭 확보(검색창 축소) */
html.svh-in-header:not(.svh-video) .navbar-fixed-top nav.header-fixed1000{ width:100% !important; max-width:none !important; }
html.svh-in-header:not(.svh-video) .navbar-fixed-top .container-fluid{ justify-content:flex-start; gap:6px; }
html.svh-in-header:not(.svh-video) .navbar-fixed-top .search-container, html.svh-in-header:not(.svh-video) .navbar-fixed-top .search-container form{ width:210px !important; }
html.svh-in-header:not(.svh-video) .navbar-fixed-top .navbar-right{ margin-left:auto; flex-shrink:0; }
html.svh-in-header:not(.svh-video) .navbar-fixed-top .navbar-nav{ float:none; }
@media (max-width:1500px){ html:not(.svh-video) .svh-item>a{ padding:0 6px; font-size:13px; } html:not(.svh-video) .svh-switch a{ padding:5px 8px; } }
html.svh-in-header:not(.svh-video) .wow_hdr_innr_left{ flex:0 0 auto !important; }
html.svh-in-header:not(.svh-video) .wow_hdr_innr_left > ul.navbar-nav{ display:none !important; }
html.svh-in-header:not(.svh-video) .navbar-fixed-top .container-fluid > ul.navbar-nav:not(.navbar-right){ margin-left:auto; flex-shrink:0; }

/* 로그인 화면 데모 계정 (오른쪽 플로팅 카드) */
.svh-demo{ position:fixed; right:20px; top:76px; width:340px; max-height:calc(100vh - 96px); overflow:auto; z-index:1300; padding:14px 14px 10px; background:#fff; border:1px solid var(--svh-line); border-radius:10px; box-shadow:0 6px 24px rgba(11,42,92,.12); font-size:13px; color:var(--svh-text); text-align:left; }
.svh-demo h4{ margin:0 0 8px; font-size:14px; font-weight:700; color:var(--svh-navy); }
.svh-demo h4 em{ font-style:normal; font-weight:500; font-size:11px; color:var(--svh-mute); margin-left:6px; }
.svh-dr{ padding:9px 0; border-top:1px solid var(--svh-line); }
.svh-dw b{ font-size:13px; } .svh-dw small{ margin-left:6px; font-size:11px; color:var(--svh-mute); }
.svh-dc{ display:flex; gap:6px; margin:6px 0; flex-wrap:wrap; }
.svh-demo code{ font-family:ui-monospace,SFMono-Regular,Consolas,monospace; font-size:12px; background:#F3F6FB; border:1px solid var(--svh-line); border-radius:4px; padding:2px 6px; color:var(--svh-navy); }
.svh-da button{ font-size:12px; padding:4px 10px; margin-right:6px; border:1px solid var(--svh-line); background:#fff; color:var(--svh-blue); border-radius:5px; cursor:pointer; }
.svh-da button.pri{ background:var(--svh-navy); border-color:var(--svh-navy); color:#fff; }
.svh-demo-links{ padding:8px 0 4px; border-top:1px solid var(--svh-line); font-size:12px; color:var(--svh-mute); }
.svh-demo-links a{ color:var(--svh-blue); }
.svh-sso{ margin:6px 0 2px; font-size:12.5px; border-top:1px solid var(--svh-line); padding-top:8px; }
.svh-sso summary{ cursor:pointer; font-weight:600; color:var(--svh-navy); }
.svh-sso ol{ margin:8px 0 2px 18px; padding:0; line-height:1.6; }
@media (max-width:1150px){ .svh-demo{ position:static; width:auto; max-height:none; margin:16px; } }

/* WoWonder 환영 화면: 왼쪽 패널 안에 배치, 장식 사진은 숨김 */
html.svh-demo-left .login_left_combo .img{ display:none !important; }
.svh-demo.svh-in-left{ position:static; width:100%; max-height:none; margin:22px 0 0; box-shadow:none; }
.svh-in-left .svh-dr{ display:grid; grid-template-columns:1.2fr 1.4fr auto; align-items:center; gap:8px; }
.svh-in-left .svh-dc{ margin:0; } .svh-in-left .svh-da{ white-space:nowrap; }
.svh-in-left .svh-dw small{ display:block; margin:2px 0 0; }
