/* sub-content-box */
.sub-content-box .content-inner {margin:0 0 var(--margin-50);}
.sub-content-box .content-inner:last-of-type {margin:0;}
.sub-content-box .content-inner .content-title {margin:0 0 var(--margin-10);}
.sub-content-box .content-inner .content-title h4 {font-size:var(--font-xxl); font-weight:600;}


/* ========================================
   header — 프론트 공통 헤더
   ======================================== */
.header {position:fixed; top:0; left:0; width:100%; z-index:1000; background:rgba(255,255,255,0.97); backdrop-filter:blur(8px); -webkit-backdrop-filter:blur(8px); border-bottom:1px solid var(--color-gray-300); transition:box-shadow 0.3s ease;}
.header.scrolled {box-shadow:0 2px 12px rgba(0,0,0,0.08);}
.header__inner {display:flex; flex-wrap:wrap; align-items:center; justify-content:space-between; height:64px;}
.header__brand {display:flex; align-items:center; text-decoration:none; flex-shrink:0;}
.header__logo {height:36px; width:auto; display:block;}
.header__site-name {font-size:var(--font-xl); font-weight:700; color:var(--color-black);}

/* PC 내비게이션 */
.header__nav {display:flex; align-items:center; height:100%;}
.header__menu {display:flex; align-items:center; gap:0; height:100%; list-style:none; margin:0; padding:0;}
.header__menu-item {position:relative; height:100%; display:flex; align-items:center;}
.header__menu-item > a {display:flex; align-items:center; height:100%; padding:0 16px; font-size:var(--font-md); font-weight:500; color:var(--color-gray-800); text-decoration:none; transition:color 0.2s ease; white-space:nowrap;}
.header__menu-item > a:hover,
.header__menu-item > a:focus {color:var(--color-active);}

/* PC 드롭다운 (2차 메뉴) */
.header__dropdown {position:absolute; top:100%; left:0; padding-top:4px; opacity:0; pointer-events:none; transition:opacity 0.25s ease; z-index:100;}
.header__menu-item:hover > .header__dropdown,
.header__menu-item:focus-within > .header__dropdown {opacity:1; pointer-events:auto;}

/* 햄버거 버튼 (PC 숨김) */
.header__hamburger {display:none; background:none; border:none; cursor:pointer; padding:8px; flex-direction:column; gap:5px; align-items:center; justify-content:center; width:40px; height:40px;}
.header__hamburger-bar {display:block; width:22px; height:2px; background:var(--color-gray-800); border-radius:2px; transition:all 0.3s ease;}
.header__hamburger.active .header__hamburger-bar:nth-child(1) {transform:translateY(7px) rotate(45deg);}
.header__hamburger.active .header__hamburger-bar:nth-child(2) {opacity:0;}
.header__hamburger.active .header__hamburger-bar:nth-child(3) {transform:translateY(-7px) rotate(-45deg);}

/* 모바일 오버레이 */
.header__mobile-overlay {position:fixed; inset:0; background:rgba(0,0,0,0.4); z-index:999; opacity:0; pointer-events:none; transition:opacity 0.3s ease;}
.header__mobile-overlay.active {opacity:1; pointer-events:auto;}

/* 모바일 사이드 내비 */
.header__mobile-nav {position:fixed; top:0; right:-280px; width:280px; height:100%; background:var(--color-white); z-index:1000; overflow-y:auto; transition:right 0.3s ease; box-shadow:-4px 0 20px rgba(0,0,0,0.1);}
.header__mobile-nav.active {right:0;}
.header__mobile-head {display:flex; align-items:center; justify-content:space-between; padding:12px 16px; border-bottom:1px solid var(--color-gray-300);}
.header__mobile-head .header__logo {height:28px;}
.header__mobile-close {background:none; border:none; font-size:28px; line-height:1; cursor:pointer; color:var(--color-gray-700); padding:4px 8px;}

/* 모바일 메뉴 목록 */
.header__mobile-menu {list-style:none; margin:0; padding:0;}
.header__mobile-item {border-bottom:1px solid var(--color-gray-200);}
.header__mobile-link-row {display:flex; align-items:center; justify-content:space-between;}
.header__mobile-link-row > a {flex:1; min-width:0; padding:14px 16px; font-size:var(--font-md); font-weight:500; color:var(--color-gray-800); text-decoration:none;}
.header__mobile-toggle {background:none; border:none; cursor:pointer; padding:14px 16px; display:flex; align-items:center; justify-content:center;}
.header__mobile-toggle-icon {display:block; width:12px; height:12px; position:relative; transition:transform 0.3s ease;}
.header__mobile-toggle-icon::before,
.header__mobile-toggle-icon::after {content:""; position:absolute; background:var(--color-gray-600); border-radius:1px;}
.header__mobile-toggle-icon::before {top:50%; left:0; width:100%; height:2px; transform:translateY(-50%);}
.header__mobile-toggle-icon::after {top:0; left:50%; width:2px; height:100%; transform:translateX(-50%); transition:transform 0.3s ease;}
.header__mobile-toggle-icon.active::after {transform:translateX(-50%) rotate(90deg);}

/* 모바일 서브 메뉴 (아코디언) */
.header__mobile-sub {list-style:none; margin:0; padding:0; max-height:0; overflow:hidden; transition:max-height 0.3s ease; background:var(--color-gray-50);}
.header__mobile-sub li {border-top:1px solid var(--color-gray-200);}
.header__mobile-sub .header__mobile-link-row > a {padding-left:32px; font-weight:400; font-size:var(--font-sm); color:var(--color-gray-700);}
.header__mobile-sub .header__mobile-sub .header__mobile-link-row > a {padding-left:48px; font-size:var(--font-xs);}

/* 헤더 높이만큼 body padding (고정 헤더) */
body {padding-top:64px;}

/* ── 반응형: 태블릿 이하 ── */
@media (max-width:991px){
.header__nav {display:none;}
.header__hamburger {display:flex;}
}