/* ===== 공통 헤더 ===== */
.site-header{position:sticky;top:0;z-index:1000;background:#fff;border-bottom:1px solid #e9eef1}
.site-header .container{max-width:1200px;margin:0 auto;padding:20px;display:flex;align-items:center;gap:16px}
.brand img{height:42px;width:auto;display:block}

.nav-toggle{margin-left:auto;display:none;width:42px;height:36px;border:1px solid #e9eef1;background:#fff;border-radius:0px;cursor:pointer}
.nav-toggle .bar{display:block;width:20px;height:2px;margin:5px auto;background:#222}
@media (max-width:980px){ .nav-toggle{display:inline-block} }

/* ===== 1Depth ===== */
.nav-links{margin-left:auto;margin-right:auto;position:relative}
.nav-links .menu{list-style:none;display:flex;gap:36px;margin:0;padding:0;align-items:center}
.top{position:relative}
.toplink{background:none;border:0;cursor:pointer;font-weight:900;letter-spacing:.08em;font-size:15px;line-height:1;padding:8px 2px;text-transform:uppercase;color:#1b1f24}

/* 모바일 드로어 */
@media (max-width:980px){
  .nav-links{position:fixed;inset:64px 0 auto 0;background:#fff;border-top:1px solid #e9eef1;
             transform:translateY(-8px);opacity:0;pointer-events:none;transition:.2s ease}
  .nav-links.open{transform:translateY(0);opacity:1;pointer-events:auto}
  .nav-links .menu{flex-direction:column;align-items:stretch;gap:0}
}

/* ===== 드롭다운 박스 (토글 스타일) ===== */
.dropdown{
  position:absolute;left:0;top:calc(100% + 7px);transform:none;
  width:320px;background:#fff;color:#111;border:1px solid #e7edf2;border-radius:0px;
  box-shadow:0 16px 48px rgba(0,0,0,.14);padding:10px 0;opacity:0;pointer-events:none;
  transition:opacity .18s ease, transform .18s ease;z-index:1010;
}
@media (min-width:981px){
  .top.has-dd:hover .dropdown,
  .top.has-dd.open .dropdown,
  .top.has-dd .dropdown:hover {opacity:1; pointer-events:auto;transform: translateY(0);}
}
@media (max-width:1200px){
  .dropdown{max-width: min(92vw, 360px);left: max(0px, min(0px, 100vw - 360px));}
}

@media (max-width:980px){
  .dropdown{position:static;transform:none;width:100%;box-shadow:none;border-radius:0;border:0;padding:6px 0;opacity:1;pointer-events:auto}
}
html, body { overflow-x: hidden; }

/* ===== 2Depth 헤더 (토글 버튼) ===== */
.mid{list-style:none;margin:0;padding:6px}
.mid-item{border-radius:8px;overflow:hidden}
.midlink{
  all: unset;width:100%;display:flex;align-items:center;justify-content:space-between;gap:10px;
  padding:14px 16px;background:#fff;border:0;cursor:pointer;font-weight:800;color:#111
}
.midlink:hover{background:#f6f8fa}
.chev{transition:transform .18s ease}
.mid-item.open .chev{transform:rotate(180deg)}

/* ===== 3Depth (아코디언 바디) ===== */
.sub{
  list-style:none;margin:0 6px 10px 6px;padding:0 0 0 12px;border-left:2px solid #e9eef1;
  max-height:0;overflow:hidden;transition:max-height .22s ease;
}
.mid-item.open .sub{max-height:480px} 

.sub li a{
  display:block;padding:10px 12px;border-radius:8px;font-weight:600;color:#1b1f24
}
.sub li a:hover{background:#eef3f6}

/* 액티브 언더라인(데스크톱만) */
.active-underline{display:none}
@media (min-width:981px){
  .active-underline{display:block;position:absolute;bottom:-10px;left:0;height:3px;width:0;background:#1b4b34;border-radius:2px;transition:all .25s ease}
}