/* IW Main Hero - GNB header styles */

.iwg-header{
  position:fixed;top:0;left:0;right:0;z-index:9999;
  background:transparent;
  transition:background .3s ease, transform .35s ease, box-shadow .3s ease;
  transform:translateY(0);
}
/* 드롭다운 열릴 때 상단 가로 라인 (전체 폭) */
.iwg-header::before{
  content:'';position:absolute;left:0;right:0;top:var(--iwg-barh, 90px);height:1px;
  background:#e8e8e8;opacity:0;transition:opacity .25s ease;pointer-events:none;
}
.iwg-header:hover::before{opacity:1;}
.iwg-header.iwg-hidden{transform:translateY(-110%);}
.iwg-header.iwg-scrolled,
.iwg-header:hover{background:#fff;box-shadow:0 1px 0 rgba(0,0,0,.06);}

/* 헤더 바 높이 · 로고 높이 — v1.25.0
   인라인으로는 -pc / -mo 만 들어오고, 여기서 화면 크기에 따라 갈라 준다.
   (인라인에 --iwg-barh 를 직접 넣으면 인라인이 이겨서 모바일 값이 안 먹는다) */
.iwg-header{ --iwg-barh: var(--iwg-barh-pc, 90px); --iwg-logoh: var(--iwg-logoh-pc, 64px);
             --iwg-logotx: var(--iwg-logotx-pc, 22px); }

.iwg-bar{
  max-width:1800px;margin:0 auto;padding:0 40px;
  display:flex;align-items:flex-start;gap:var(--iwg-gapl, 60px);
}

/* ----- 로고 (흰색/컬러 전환) ----- */
.iwg-logo{flex:none;height:var(--iwg-barh, 90px);display:flex;align-items:center;text-decoration:none !important;}
.iwg-logo img{height:var(--iwg-logoh, 64px) !important;width:auto !important;max-width:none !important;display:block;}
/* 로고 높이 0 = 원본 크기. 헤더 바보다 크면 바 높이까지만 (안 그러면 메뉴를 뚫고 나온다) */
.iwg-header[data-logo="auto"] .iwg-logo img{height:auto !important;max-height:var(--iwg-barh, 90px);}
/* 로고 이미지를 안 올리면 사이트 이름이 이 글자로 나온다 — 위의 로고 높이(이미지 전용)와 무관 (v1.29.0) */
.iwg-logo-text{font-size:var(--iwg-logotx, 22px);font-weight:800;letter-spacing:1px;color:#fff;line-height:1.15;}
.iwg-logo .iwg-logo-color{display:none;}
.iwg-logo-text.iwg-logo-color{color:#4318b5;}
.iwg-header.iwg-scrolled .iwg-logo-white,
.iwg-header:hover .iwg-logo-white{display:none;}
.iwg-header.iwg-scrolled .iwg-logo-color,
.iwg-header:hover .iwg-logo-color{display:block;}

/* ----- 메뉴 ----- */
ul.iwg-menu{
  list-style:none;margin:0 0 0 auto;padding:0;
  display:flex;justify-content:center;
  transition:padding .35s ease;
}
/* 글자를 키우면 컬럼도 같이 넓혀야 줄바꿈이 안 난다. 가운데(9.4vw)는 그대로 두고
   상·하한만 배율을 태워, 배율 1 이면 예전 값(120~170px)과 같다. (v1.26.0) */
.iwg-item{flex:none;width:clamp(calc(120px * var(--iwg-top-k, 1)), 9.4vw, calc(170px * var(--iwg-top-k, 1)));text-align:center;margin:0;position:relative;}
/* 컬럼 사이 세로 구분선 — 가로 라인(90px) 아래부터 패널 끝까지 */
.iwg-item::before{
  content:'';position:absolute;left:0;top:var(--iwg-barh, 90px);bottom:0;width:1px;
  background:#e8e8e8;opacity:0;transition:opacity .25s ease;pointer-events:none;
}
.iwg-item:first-child::before{display:none;}
/* 마지막 컬럼 오른쪽 라인 */
.iwg-item:last-child::after{
  content:'';position:absolute;right:0;top:var(--iwg-barh, 90px);bottom:0;width:1px;
  background:#e8e8e8;opacity:0;transition:opacity .25s ease;pointer-events:none;
}
.iwg-header:hover .iwg-item::before,
.iwg-header:hover .iwg-item:last-child::after{opacity:1;}
.iwg-top{
  display:flex;align-items:center;justify-content:center;height:var(--iwg-barh, 90px);
  /* v1.26.0 : vw 항에 --iwg-top-k(=지정값/19) 를 곱한다. 배율 1 이면 예전과 같은 값이 나온다.
     지정값이 최댓값 자리에만 있어서 20 이상은 올려도 변화가 없던 것을 고친 것. */
  color:#fff;font-size:clamp(14px, calc(1.05vw * var(--iwg-top-k, 1)), var(--iwg-top-size, 19px));font-weight:700;text-decoration:none !important;
  transition:color .2s;letter-spacing:-.2px;
}
.iwg-header.iwg-scrolled .iwg-top,
.iwg-header:hover .iwg-top{color:#111;}
.iwg-item:hover > .iwg-top{color:#333 !important;opacity:.75;}

/* ----- 전체 드롭다운 ----- */
ul.iwg-sub{
  list-style:none;margin:0;padding:0;
  max-height:0;overflow:hidden;
  transition:max-height .35s ease;
}
.iwg-header:hover ul.iwg-sub{max-height:var(--iwg-panel-h, 460px);padding:14px 0 40px;}
ul.iwg-sub li{margin:0;}
ul.iwg-sub a{
  display:block;padding:11px 0;
  color:#444;font-size:var(--iwg-sub-size, 15px);font-weight:500;text-decoration:none !important;
  transition:color .2s;
}
ul.iwg-sub a:hover{color:#333;font-weight:600;}

/* 드롭다운 좌측 썸네일 — 각 1차 메뉴 호버 시 헤더 좌측에 표시 */
.iwg-sub-thumb{
  position:fixed;
  left:max(24px, calc((100vw - 1800px) / 2 + 24px));top:108px;
  width:clamp(140px, 13vw, 280px);height:clamp(94px, 8.7vw, 187px);
  border-radius:12px;
  background-size:cover;background-position:center;background-repeat:no-repeat;
  opacity:0;visibility:hidden;transform:translateY(8px);
  transition:opacity .3s ease, visibility .3s ease, transform .3s ease;
  pointer-events:none;z-index:9998;
  box-shadow:0 12px 30px rgba(0,0,0,.12);
}
.iwg-item.iwg-thumb-active .iwg-sub-thumb{opacity:1;visibility:visible;transform:translateY(0);}
.iwg-cta-thumb.iwg-thumb-active .iwg-sub-thumb{opacity:1;visibility:visible;transform:translateY(0);}
.iwg-cta-thumb{position:relative;}

/* 좁은 화면에선 썸네일이 메뉴 컬럼을 덮으므로 숨김 (1280px 이하) */
@media (max-width:1280px){
  .iwg-sub-thumb{display:none !important;}
}

/* ----- 모바일 ----- */
.iwg-burger{display:none !important;}

/* 메뉴 우측 CTA 버튼 */
.iwg-header .iwg-cta{
  flex:none;align-self:flex-start;
  height:var(--iwg-barh, 90px);
  display:inline-flex;align-items:center;
  padding:0 0 0 14px;
  color:#fff;font-size:15px;font-weight:700;text-decoration:none !important;
  letter-spacing:-.2px;white-space:nowrap;
  transition:color .2s;
}
.iwg-cta-inner{
  display:inline-flex;align-items:center;
  height:40px;padding:0 22px;
  border:1.5px solid rgba(255,255,255,.7);border-radius:22px;
  transition:color .2s, border-color .2s, background .2s;
}
.iwg-header .iwg-cta:hover .iwg-cta-inner{background:#fff;color:#111;border-color:#fff;}
.iwg-header.iwg-scrolled .iwg-cta,
.iwg-header:hover .iwg-cta{color:#111;}
.iwg-header.iwg-scrolled .iwg-cta-inner,
.iwg-header:hover .iwg-cta-inner{border-color:#ccc;}
.iwg-header.iwg-scrolled .iwg-cta:hover .iwg-cta-inner,
.iwg-header:hover .iwg-cta:hover .iwg-cta-inner{background:#111;color:#fff;border-color:#111;}

/* ----- 한/영 전환 (맨 오른쪽) ----- */
.iwg-lang{
  flex:none;align-self:flex-start;
  height:var(--iwg-barh, 90px);display:inline-flex;align-items:center;gap:4px;
  margin-left:28px;
}
.iwg-lang-link{
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  min-width:36px;height:32px;padding:0 10px;
  font-size:16px;font-weight:700;letter-spacing:.02em;
  color:rgba(255,255,255,.7);text-decoration:none !important;
  border-radius:6px;transition:color .2s,background .2s,opacity .2s;
}
.iwg-lang-flag{
  width:24px !important;height:16px !important;display:block;
  object-fit:cover;border-radius:2px;flex:none;
}
.iwg-lang-link:hover{color:#fff;}
.iwg-lang-link.iwg-lang-on{color:#fff;}
.iwg-header.iwg-scrolled .iwg-lang-link,
.iwg-header:hover .iwg-lang-link{color:#999;}
.iwg-header.iwg-scrolled .iwg-lang-link:hover,
.iwg-header:hover .iwg-lang-link:hover,
.iwg-header.iwg-scrolled .iwg-lang-link.iwg-lang-on,
.iwg-header:hover .iwg-lang-link.iwg-lang-on{color:#111;}
@media (max-width:1024px){
  .iwg-header::before,
  .iwg-item::before,
  .iwg-item:last-child::after{display:none;}
  /* 모바일: 헤더 배경 항상 표시 (투명일 때 흰 로고·버거가 묻히는 문제 방지) */
  .iwg-header{background:#fff !important;box-shadow:0 1px 0 rgba(0,0,0,.06);}
  .iwg-header .iwg-logo-white{display:none;}
  .iwg-header .iwg-logo-color{display:block;}
  /* 모바일: 좌측 썸네일 이미지 노출 안 함 */
  .iwg-sub-thumb{display:none !important;}
  /* 모바일: 제품문의 CTA 버튼 숨김 */
  .iwg-header .iwg-cta,
  .iwg-header .iwg-cta-thumb{display:none !important;}
  /* 모바일: 언어 버튼 — 흰 헤더 배경이라 어두운 글자로 고정 */
  .iwg-lang{height:var(--iwg-barh, 66px);margin-left:0;}
  .iwg-header .iwg-lang-link,
  .iwg-header:hover .iwg-lang-link,
  .iwg-header.iwg-scrolled .iwg-lang-link{color:#888 !important;}
  .iwg-header .iwg-lang-link.iwg-lang-on,
  .iwg-header:hover .iwg-lang-link.iwg-lang-on,
  .iwg-header.iwg-scrolled .iwg-lang-link.iwg-lang-on{color:#111 !important;}
  .iwg-bar{
    max-width:100%;width:100%;box-sizing:border-box;
    padding:0 20px;gap:20px;align-items:center;
    justify-content:space-between;overflow:visible;
  }
  /* 모바일 값으로 갈아끼운다 (v1.25.0) */
  .iwg-header{ --iwg-barh: var(--iwg-barh-mo, 66px); --iwg-logoh: var(--iwg-logoh-mo, 44px);
               --iwg-logotx: var(--iwg-logotx-mo, 18px); }
  .iwg-logo{flex:1 1 auto;min-width:0;}
  .iwg-logo{height:var(--iwg-barh, 66px);}
  .iwg-logo img{height:var(--iwg-logoh, 44px) !important;}
  /* 모바일만 원본 크기 / PC만 원본 크기인 경우를 각각 되돌린다 */
  .iwg-header[data-logo-mo="auto"] .iwg-logo img{height:auto !important;max-height:var(--iwg-barh, 66px);}
  .iwg-header[data-logo="auto"]:not([data-logo-mo="auto"]) .iwg-logo img{height:var(--iwg-logoh, 44px) !important;max-height:none;}
  .iwg-logo-text{font-size:var(--iwg-logotx, 18px);}
  ul.iwg-menu{
    display:none;
    position:absolute;top:var(--iwg-barh, 66px);left:0;right:0;
    background:#fff;
    padding:10px 24px 24px;box-shadow:0 12px 24px rgba(0,0,0,.08);
    max-height:calc(100vh - var(--iwg-barh, 66px));overflow-y:auto;
    flex:none !important;justify-content:flex-start !important;
  }
  .iwg-header.iwg-mopen{background:#fff;}
  .iwg-header.iwg-mopen.iwg-hidden{transform:translateY(0) !important;}
  .iwg-header.iwg-mopen ul.iwg-menu{display:block !important;}
  .iwg-header.iwg-mopen .iwg-logo-white{display:none;}
  .iwg-header.iwg-mopen .iwg-logo-color{display:block;}
  .iwg-header .iwg-menu .iwg-item{
    display:block !important;width:100% !important;
    text-align:left;margin:0;position:relative;
  }
  .iwg-header .iwg-menu .iwg-item > .iwg-top{
    display:block !important;width:100% !important;height:auto !important;
    min-height:0;padding:14px 0;color:#111;line-height:1.4;
    font-size:min(calc(18px * var(--iwg-top-k, 1)), 26px);font-weight:700;text-align:left;
  }
  .iwg-header.iwg-mopen .iwg-top{color:#111;}
  .iwg-header .iwg-menu .iwg-sub,
  .iwg-header:hover .iwg-menu .iwg-sub{
    display:block !important;max-height:none;border-left:none;
    padding:0 0 8px 14px;overflow:visible;
  }
  ul.iwg-sub a{padding:8px 0;}
  .iwg-header .iwg-burger{
    display:flex !important;margin-left:auto;flex:0 0 auto;
    width:44px;height:44px;align-items:center;justify-content:center;
    background:none !important;border:0 !important;outline:none !important;
    box-shadow:none !important;cursor:pointer;position:relative;z-index:2;
    padding:0;-webkit-appearance:none;appearance:none;
  }
  .iwg-header .iwg-burger:hover,
  .iwg-header .iwg-burger:focus,
  .iwg-header .iwg-burger:active{
    background:none !important;border:0 !important;outline:none !important;box-shadow:none !important;
  }
  .iwg-burger span{position:relative;width:24px;height:2px;background:#111;transition:background .2s, transform .3s ease;}
  .iwg-burger span::before,.iwg-burger span::after{
    content:'';position:absolute;left:0;width:24px;height:2px;background:inherit;
    transition:transform .3s ease, top .3s ease, opacity .2s ease;
  }
  .iwg-burger span::before{top:-8px;}
  .iwg-burger span::after{top:8px;}
  .iwg-header.iwg-scrolled .iwg-burger span,
  .iwg-header.iwg-mopen .iwg-burger span{background:#111;}
  /* 메뉴 열림(iwg-mopen) 시 3줄 → X 변형 */
  .iwg-header.iwg-mopen .iwg-burger span{background:transparent !important;}
  .iwg-header.iwg-mopen .iwg-burger span::before{top:0;transform:rotate(45deg);background:#111;}
  .iwg-header.iwg-mopen .iwg-burger span::after{top:0;transform:rotate(-45deg);background:#111;}
}

/* =========================================================
   GNB 스타일 세트 (data-style) — classic 이 기본값(현재 스타일)
   minimal / mega / modern / line 은 오버라이드
   ========================================================= */

/* ---------- MINIMAL: 항상 흰 배경·검은 글자 고정 + 호버 시 가로 한 줄 서브메뉴 ---------- */
/* 헤더 배경/글자색을 스크롤·호버 무관하게 항상 흰 배경 + 검은 글자로 고정 */
.iwg-header[data-style="minimal"]{background:#fff !important;box-shadow:0 1px 0 rgba(0,0,0,.06);}
.iwg-header[data-style="minimal"] .iwg-top{color:#111 !important;}
.iwg-header[data-style="minimal"] .iwg-item:hover > .iwg-top{color:#2a1670 !important;opacity:1;}
/* 로고: 항상 컬러 버전 표시 */
.iwg-header[data-style="minimal"] .iwg-logo-white{display:none !important;}
.iwg-header[data-style="minimal"] .iwg-logo-color{display:block !important;}
.iwg-header[data-style="minimal"] .iwg-logo-text.iwg-logo-color{color:#4318b5 !important;}
.iwg-header[data-style="minimal"] .iwg-cta{color:#111 !important;}
.iwg-header[data-style="minimal"] .iwg-cta-inner{border-color:#ccc !important;}
.iwg-header[data-style="minimal"] .iwg-lang-link{color:#999 !important;}
/* 기본(classic) 전체 슬라이드다운 규칙 무력화 + BMS식 서브메뉴 */
.iwg-header[data-style="minimal"]{overflow:visible;}
/* 헤더 아래 풀와이드 흰 띠 (호버 시 나타남) */
.iwg-header[data-style="minimal"]::after{
  content:'';position:absolute;left:0;right:0;top:var(--iwg-barh, 90px);height:0;
  background:#fff;box-shadow:0 12px 24px rgba(0,0,0,.08);
  border-top:1px solid #eee;
  transition:height .28s ease;z-index:1;pointer-events:none;
}
.iwg-header[data-style="minimal"]:hover::after{height:56px;}
/* 서브메뉴: 부모 대메뉴(iwg-item) 아래 왼쪽 기준 정렬 → 대메뉴 위치에 맞춰짐 */
.iwg-header[data-style="minimal"] ul.iwg-sub{
  position:absolute;top:var(--iwg-barh, 90px);left:0;transform:translateY(4px);
  max-height:none !important;height:auto;overflow:visible;
  width:max-content;
  display:flex;flex-direction:row;align-items:center;gap:2px;
  background:transparent;border-radius:0;box-shadow:none;
  padding:0 !important;opacity:0;visibility:hidden;
  transition:opacity .25s ease, visibility .25s ease, transform .25s ease;
  white-space:nowrap;z-index:2;
}
/* 마지막 대메뉴(고객센터 등)는 오른쪽 넘침 방지: 오른쪽 끝 기준 정렬 */
.iwg-header[data-style="minimal"] .iwg-item:last-child ul.iwg-sub{
  left:auto;right:0;
}
.iwg-header[data-style="minimal"] .iwg-item:hover ul.iwg-sub{
  opacity:1;visibility:visible;transform:translateY(0);
}
.iwg-header[data-style="minimal"] .iwg-item:not(:hover) ul.iwg-sub{opacity:0;visibility:hidden;}
.iwg-header[data-style="minimal"] ul.iwg-sub li{margin:0;}
.iwg-header[data-style="minimal"] ul.iwg-sub a{
  display:block;height:56px;line-height:56px;padding:0 14px !important;
  text-align:center;border-radius:0;
  color:#555;font-weight:500;font-size:var(--iwg-sub-size, 16px);transition:color .2s;
}
.iwg-header[data-style="minimal"] ul.iwg-sub a:hover{color:#2a1670;font-weight:700;}
.iwg-header[data-style="minimal"] .iwg-sub-thumb{display:none !important;}

/* ---------- LINE: 배경 투명 유지 + 메뉴 언더라인 강조 ---------- */
.iwg-header[data-style="line"].iwg-scrolled,
.iwg-header[data-style="line"]:hover{background:transparent;box-shadow:none;}
/* 글자는 항상 흰색 (배경 안 채워지므로) */
.iwg-header[data-style="line"].iwg-scrolled .iwg-top,
.iwg-header[data-style="line"]:hover .iwg-top{color:#fff;}
.iwg-header[data-style="line"].iwg-scrolled .iwg-logo-white,
.iwg-header[data-style="line"]:hover .iwg-logo-white{display:block;}
.iwg-header[data-style="line"].iwg-scrolled .iwg-logo-color,
.iwg-header[data-style="line"]:hover .iwg-logo-color{display:none;}
.iwg-header[data-style="line"] .iwg-top{position:relative;}
.iwg-header[data-style="line"] .iwg-top::after{
  content:'';position:absolute;left:22%;right:22%;bottom:24px;height:2px;
  background:#f2c14e;transform:scaleX(0);transform-origin:center;
  transition:transform .25s ease;
}
.iwg-header[data-style="line"] .iwg-item:hover > .iwg-top::after{transform:scaleX(1);}
.iwg-header[data-style="line"] .iwg-item:hover > .iwg-top{opacity:1 !important;color:#fff !important;}
/* line 모드는 배경이 없으므로 서브메뉴는 개별 드롭다운(어두운 배경)로 */
.iwg-header[data-style="line"] ul.iwg-sub{
  position:absolute;top:var(--iwg-barh, 90px);left:50%;transform:translateX(-50%) translateY(6px);
  max-height:none;height:auto;overflow:visible;min-width:150px;
  background:rgba(12,10,32,.85);-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);
  border-radius:10px;box-shadow:0 12px 30px rgba(0,0,0,.3);
  padding:8px 0;opacity:0;visibility:hidden;transition:.25s;
}
.iwg-header[data-style="line"] .iwg-item:hover ul.iwg-sub{
  opacity:1;visibility:visible;transform:translateX(-50%) translateY(0);
}
.iwg-header[data-style="line"] ul.iwg-sub a{padding:9px 22px;white-space:nowrap;text-align:left;color:#cfd0e8;}
.iwg-header[data-style="line"] ul.iwg-sub a:hover{color:#fff;background:rgba(255,255,255,.08);}
.iwg-header[data-style="line"] .iwg-sub-thumb{display:none !important;}
.iwg-header[data-style="line"]::before{display:none;}

/* =========================================================
   로그인 / 회원가입 버튼 (숭덕원 스타일 알약)
   투명 비주얼 위: 흰 테두리 투명 / 흰 배경 위: 컬러 채움
   ========================================================= */
.iwg-member{display:flex;align-items:center;gap:8px;margin-left:14px;flex:0 0 auto;height:var(--iwg-barh, 90px);}
.iwg-mbtn{
  display:inline-flex;align-items:center;justify-content:center;
  height:38px;padding:0 20px;border-radius:999px;
  font-size:14px;font-weight:700;text-decoration:none !important;
  white-space:nowrap;transition:background .2s,color .2s,border-color .2s,opacity .2s;
  border:1.5px solid transparent;
}
/* --- 기본(투명 비주얼 위): 흰 테두리 투명 버튼 --- */
.iwg-mbtn-line{color:#fff !important;border-color:rgba(255,255,255,.6);background:transparent;}
.iwg-mbtn-line:hover{background:rgba(255,255,255,.14);border-color:#fff;}
.iwg-mbtn-fill{color:#fff !important;border-color:#fff;background:transparent;}
.iwg-mbtn-fill:hover{background:#fff;color:#1a1f2b !important;}

/* --- 흰 배경일 때(스크롤/hover/미니멀): 컬러 채운 알약 (숭덕원식) --- */
.iwg-header.iwg-scrolled .iwg-mbtn-line,
.iwg-header:hover .iwg-mbtn-line{
  color:#fff !important;background:#0e9488;border-color:transparent;
}
.iwg-header.iwg-scrolled .iwg-mbtn-line:hover,
.iwg-header:hover .iwg-mbtn-line:hover{background:#0b7a70;color:#fff !important;}
.iwg-header.iwg-scrolled .iwg-mbtn-fill,
.iwg-header:hover .iwg-mbtn-fill{
  color:#fff !important;background:#1f3a8a;border-color:transparent;
}
.iwg-header.iwg-scrolled .iwg-mbtn-fill:hover,
.iwg-header:hover .iwg-mbtn-fill:hover{background:#16296a;color:#fff !important;}

/* 미니멀(항상 흰 배경)은 hover 없이도 컬러 버튼 */
.iwg-header[data-style="minimal"] .iwg-mbtn-line{color:#fff !important;background:#0e9488;border-color:transparent;}
.iwg-header[data-style="minimal"] .iwg-mbtn-line:hover{background:#0b7a70;color:#fff !important;}
.iwg-header[data-style="minimal"] .iwg-mbtn-fill{color:#fff !important;background:#1f3a8a;border-color:transparent;}
.iwg-header[data-style="minimal"] .iwg-mbtn-fill:hover{background:#16296a;color:#fff !important;}

/* 모던(다크 글래스)은 어두운 배경이므로 투명 버튼 유지 */
.iwg-header[data-style="modern"].iwg-scrolled .iwg-mbtn-line,
.iwg-header[data-style="modern"]:hover .iwg-mbtn-line{color:#fff !important;background:transparent;border-color:rgba(255,255,255,.6);}
.iwg-header[data-style="modern"].iwg-scrolled .iwg-mbtn-fill,
.iwg-header[data-style="modern"]:hover .iwg-mbtn-fill{color:#fff !important;background:transparent;border-color:#fff;}

/* 모바일: 햄버거 옆이라 숨김(모바일 메뉴 안에서 별도 처리 권장) */
@media (max-width:1024px){
/* 모바일: 로그인/회원가입은 메뉴 목록 안으로 이동됨(JS) → 전체폭 버튼 */
@media (max-width:1024px){
  .iwg-member.iwg-member-mobile{
    display:flex;gap:10px;margin:16px 0 4px;padding-top:16px;
    border-top:1px solid #eee;width:100%;
  }
  .iwg-member.iwg-member-mobile .iwg-mbtn{
    flex:1;height:46px;font-size:15px;border-radius:8px;
  }
  /* 모바일 헤더는 항상 흰 배경 → 컬러 채운 버튼으로 */
  .iwg-member.iwg-member-mobile .iwg-mbtn-line{
    color:#fff !important;background:#0e9488;border-color:transparent;
  }
  .iwg-member.iwg-member-mobile .iwg-mbtn-fill{
    color:#fff !important;background:#1f3a8a;border-color:transparent;
  }
}
}

/* ============================================================
   GNB 확장 — v1.13.0
   ① 메뉴 정렬(가운데 / 로고 옆)  ② 관련사이트 박스  ③ 외부링크 아이콘
   메가메뉴 구조는 기존 것을 그대로 쓴다 — .iwg-header:hover 로 모든
   .iwg-sub 가 동시에 열리며 .iwg-item 이 컬럼이 되는 방식이 이미
   우리은행·CMS 형태와 동일하다.
   ============================================================ */

/* ① 메뉴 정렬 : 로고 옆(left) */
/* 간격은 .iwg-bar 의 gap(--iwg-gapl) 이 정한다 — 여기서 또 더하면 두 번 벌어진다 (v1.24.0) */
.iwg-header[data-menu="left"] ul.iwg-menu { justify-content: flex-start; margin-left: 0; }
.iwg-header[data-menu="left"] .iwg-item { text-align: left; }
.iwg-header[data-menu="left"] .iwg-item::before,
.iwg-header[data-menu="left"] .iwg-item:last-child::after { display: none; }

/* ② 관련사이트 박스 — 메가메뉴 패널 우측에 붙는 링크 카드 */
.iwg-rel { position: absolute; right: 0; top: var(--iwg-barh, 90px); width: 240px; z-index: 4;
  opacity: 0; visibility: hidden; transition: opacity .22s, visibility .22s; }
.iwg-header:hover .iwg-rel { opacity: 1; visibility: visible; }
.iwg-rel-t { font-size: 13px; font-weight: 600; color: #666; margin: 0 0 10px;
  display: flex; align-items: center; gap: 6px; }
.iwg-rel-t::after { content: '+'; font-size: 14px; color: #999; }
.iwg-rel-a { display: flex; align-items: center; justify-content: space-between;
  background: #f4f5f7; border-radius: 8px; padding: 13px 16px; margin-bottom: 8px;
  font-size: 14px; font-weight: 500; color: #333; text-decoration: none !important; transition: .15s; }
.iwg-rel-a:hover { background: #eaecf0; color: #111; }
.iwg-rel-a::after { content: '\2192'; color: #888; transition: transform .15s; }
.iwg-rel-a:hover::after { transform: translateX(3px); }

/* ③ 외부링크 아이콘 — 메뉴에서 "새 창에서 열기" 를 체크하면 자동으로 붙는다 */
.iwg-ext { display: inline-block; margin-left: 4px; font-size: .82em; opacity: .6; }

@media (max-width: 1280px) {
  .iwg-rel { display: none; }   /* 컬럼이 좁아지면 패널을 가리므로 숨긴다 */
}
@media (max-width: 1024px) {
  .iwg-header[data-menu="left"] ul.iwg-menu { margin-left: 0; }
}

/* ============================================================
   헤더 위치 = 바 (data-pos="bar") — v1.13.1
   풀스크린 히어로용 오버레이(position:fixed + 투명)를 끄고,
   흰 배경 줄로 문서 흐름에 자리를 차지하게 한다.
   그래야 라운드 배너(스타일2)가 헤더 아래에서 시작한다.
   ============================================================ */
/* ★ fixed 를 쓴다 (v1.15.8)
   sticky 는 문서 흐름에 남아 부모 컨테이너의 폭·패딩을 물려받는다.
   헤더가 테마/엘리멘터 컨테이너 안에 있으면 그 여백만큼 안으로 밀려
   좌측에 빈 공간이 생기고 전체 폭이 되지 않는다.
   fixed 는 부모를 무시하고 화면 좌우 끝까지 간다 — 스타일1·5(겹치기)와 같은 방식이다.
   대신 흐름에서 빠지므로 아래 .iwg-spacer 가 높이만큼 자리를 차지한다. */
.iwg-header[data-pos="bar"] {
  position: fixed; top: 0; left: 0; right: 0; background: #fff;
  box-shadow: 0 1px 0 rgba(0,0,0,.06);
}
/* 헤더가 흐름에서 빠진 만큼을 대신 차지한다. 높이는 JS 가 실제 헤더 높이 + 여백으로 채우고,
   JS 가 막히면 아래 폴백값을 쓴다. */
.iwg-spacer { height: var(--iwg-sp, 90px); flex: none; }
@media (max-width: 1024px) { .iwg-spacer { height: var(--iwg-sp, 68px); } }
.iwg-header[data-pos="bar"]::before { opacity: 1; }
/* 로고·글자는 처음부터 컬러/어두운 색 (오버레이 상태의 흰색이 아니라) */
.iwg-header[data-pos="bar"] .iwg-logo-white { display: none; }
.iwg-header[data-pos="bar"] .iwg-logo-color { display: block; }
.iwg-header[data-pos="bar"] .iwg-top { color: #333; }
/* 구분선은 아래에서 display:none 으로 숨긴다 */
/* 회원 버튼 — 흰 테두리(어두운 배경용)를 컬러 테두리로 */
.iwg-header[data-pos="bar"] .iwg-mbtn-line {
  color: #0b7a70 !important; border-color: #0b7a70; background: transparent;
}
.iwg-header[data-pos="bar"] .iwg-mbtn-line:hover { background: #0b7a70; color: #fff !important; }
.iwg-header[data-pos="bar"] .iwg-mbtn-fill {
  color: #fff !important; border-color: #1a3ea8; background: #1a3ea8;
}
.iwg-header[data-pos="bar"] .iwg-mbtn-fill:hover { filter: brightness(1.1); }
/* 언어 전환·CTA 도 어두운 배경 기준 색을 벗긴다 */
.iwg-header[data-pos="bar"] .iwg-lang a { color: #666; }
.iwg-header[data-pos="bar"] .iwg-lang .iwg-lang-on { color: #111; }
/* 바 모드에서는 스크롤 시 숨기지 않는다 — 흐름에 자리를 차지하므로
   숨기면 아래 내용이 위로 튀어 올라 흔들린다 */
.iwg-header[data-pos="bar"].iwg-hidden { transform: none; }

/* ============================================================
   v1.13.2 — 바 모드 두 가지 수정
   ============================================================ */

/* ① 서브메뉴가 열릴 때 아래 콘텐츠가 밀려 내려가던 문제
      ------------------------------------------------------------
      ul.iwg-sub 는 max-height 0 → 460px 로 열린다. 겹치기(fixed) 모드에서는
      헤더가 문서 흐름 밖이라 아무 영향이 없었지만, 바 모드는 흐름에 자리를
      차지하므로 헤더 높이가 그만큼 늘어나 메인 비주얼이 아래로 밀렸다.
      → 바 모드에서는 서브 패널을 흐름에서 띄운다(absolute). 바 높이는 고정되고
        패널만 아래로 펼쳐진다. .iwg-item 이 이미 position:relative 이므로
        컬럼 위치는 그대로 유지된다. */
/* ★ 반드시 데스크톱 한정이어야 한다 (v1.15.1)
      모바일(1024px 이하)은 대메뉴를 세로로 쌓고 서브를 그 아래 블록으로 펼친다.
      여기서 서브를 absolute 로 띄우면 대메뉴 위에 겹쳐 글자가 뒤엉키고,
      100vw 배경은 메뉴 컨테이너를 넘쳐 가로 스크롤바를 만든다. */
/* ★ 미디어쿼리로 감싸지 않는다 (v1.15.6)
      1025px 경계에 의존하면 화면 배율 125% 처럼 CSS 폭이 1024~1025 사이로 떨어지는
      환경에서 규칙이 비는 구간이 생겨, 서브가 흐름에 남아 배너를 밀어낸다.
      모바일은 아래 max-width:1024px 블록이 !important 로 되돌리므로 그쪽만 있으면 충분하다. */
.iwg-header[data-pos="bar"] ul.iwg-sub {
  position: absolute; left: 0; right: 0; top: 100%;
  z-index: 3;
}
/* 패널 배경 — 겹치기 모드에서는 헤더 자체가 흰색이 되며 배경 역할을 했다.
   바 모드는 바 높이가 고정이므로 패널에 흰 배경을 직접 준다.

   ★ 헤더에 붙인다 (v1.15.7)
   예전에는 .iwg-menu::after 에 left:50% + translateX(-50%) + width:100vw 로 줬는데,
   .iwg-menu 는 로고와 우측 버튼 사이에 있어 그 중심이 화면 중심과 다르다.
   그래서 100vw 박스가 오른쪽으로 밀려 왼쪽이 잘렸다.
   헤더는 fixed/sticky 로 left:0;right:0 이므로 left/right 0 만으로 정확히 전체 폭이 된다.
   100vw 를 쓰지 않으므로 가로 스크롤바도 생기지 않는다. */
.iwg-header[data-pos="bar"]::after {
  content: ''; position: absolute; left: 0; right: 0; top: 100%;
  height: 0; background: #fff;
  box-shadow: 0 14px 30px rgba(0,0,0,.07);
  transition: height .35s ease; z-index: 2; pointer-events: none;
}
.iwg-header[data-pos="bar"]:hover::after { height: var(--iwg-panel-h, 460px); }

/* ② 메뉴 아래 라인 제거 (스타일2 요청)
      바 모드에서는 배너가 바로 아래에서 시작하므로 경계선이 군더더기가 된다. */
.iwg-header[data-pos="bar"] { box-shadow: none; }
.iwg-header[data-pos="bar"]::before { opacity: 0; }
/* 호버 시에도 경계선을 만들지 않는다 — 예전 구조에서 패널 폭과 라인 폭이 어긋나
   양옆에만 선이 삐져나와 보였다. 경계는 패널 그림자로 충분하다. */
.iwg-header[data-pos="bar"]:hover::before { opacity: 0; }

/* ③ 컬럼 세로 구분선 제거 (요청)
      배너형에서는 구분선이 없는 쪽이 깔끔하다. 앞서 패널 영역으로 옮겨 자라게
      했었지만 요청에 따라 아예 표시하지 않는다. */
.iwg-header[data-pos="bar"] .iwg-item::before,
.iwg-header[data-pos="bar"] .iwg-item:last-child::after { display: none; }

/* ── 헤더 아래 여백 (바 모드 전용) — v1.14.3 ──
   바 모드는 헤더가 문서 흐름에 자리를 차지하므로 margin-bottom 이 그대로
   아래 비주얼을 밀어낸다. 겹치기 모드는 position:fixed 라 margin 이 의미가 없어
   [data-pos="bar"] 로만 한정한다.
   값은 인라인 변수가 아니라 data-gapb 속성으로 받아 attr() 없이 쓰도록
   CSS 변수를 헤더에 직접 심는다(아래 JS 가 처리). */
/* 헤더 아래 여백은 스페이서 높이에 더해 처리한다 — fixed 는 margin 이 아래 내용을 밀지 못한다 */

/* ============================================================
   모바일 안전장치 — v1.15.1
   bar 모드 규칙이 모바일 메뉴를 건드리지 않도록 원래 값으로 되돌린다.
   위에서 데스크톱 한정으로 감쌌지만, 나중에 규칙을 추가할 때 또 새는 것을
   막기 위해 모바일에서 명시적으로 못을 박아 둔다.
   ============================================================ */
@media (max-width: 1024px) {
  .iwg-header[data-pos="bar"] ul.iwg-sub {
    position: static !important; max-height: none !important; overflow: visible !important;
  }
  .iwg-header[data-pos="bar"]::after { display: none !important; }
  /* 모바일에서도 fixed 를 유지한다 — 메뉴가 열리면 헤더가 아래 내용을 덮으며 커진다.
     이것이 모바일 메뉴의 일반적인 동작이고, 스페이서는 닫힘 상태 높이만 차지한다. */
}

/* ============================================================
   GNB 버튼 색 · 추가 버튼 — v1.24.0
   색은 header 인라인 변수로 들어온다:
     --iwg-b1bg/-fg  로그인 · 마이페이지 (line 버튼)
     --iwg-b2bg/-fg  회원가입 · 로그아웃 (fill 버튼)
     --iwg-b3bg/-fg  추가 버튼
   기존 하드코딩 규칙과 같은 자리(흰 배경 상태)를 같은 특이도로 뒤에서 덮는다.
   원본 규칙을 지우지 않은 이유는 되돌리기 쉽게 하기 위해서다.
   ============================================================ */

/* 추가 버튼 — 회원 버튼과 무관하게 항상 지정색 */
.iwg-mbtn-x{
  background:var(--iwg-b3bg, #5a5f6a); color:var(--iwg-b3fg, #fff) !important;
  border-color:transparent;
}
.iwg-mbtn-x:hover{ filter:brightness(.9); color:var(--iwg-b3fg, #fff) !important; }

/* --- 흰 배경 상태(스크롤 · hover · 미니멀 · 모던) 에서의 지정색 --- */
.iwg-header.iwg-scrolled .iwg-mbtn-line,
.iwg-header:hover .iwg-mbtn-line,
.iwg-header[data-style="minimal"] .iwg-mbtn-line,
.iwg-header[data-pos="bar"] .iwg-mbtn-line,
.iwg-header[data-style="modern"].iwg-scrolled .iwg-mbtn-line,
.iwg-header[data-style="modern"]:hover .iwg-mbtn-line{
  background:var(--iwg-b1bg, #0e9488); color:var(--iwg-b1fg, #fff) !important; border-color:transparent;
}
.iwg-header.iwg-scrolled .iwg-mbtn-line:hover,
.iwg-header[data-pos="bar"] .iwg-mbtn-line:hover,
.iwg-header:hover .iwg-mbtn-line:hover{
  background:var(--iwg-b1bg, #0e9488); color:var(--iwg-b1fg, #fff) !important; filter:brightness(.9);
}
.iwg-header.iwg-scrolled .iwg-mbtn-fill,
.iwg-header:hover .iwg-mbtn-fill,
.iwg-header[data-style="minimal"] .iwg-mbtn-fill,
.iwg-header[data-pos="bar"] .iwg-mbtn-fill,
.iwg-header[data-style="modern"].iwg-scrolled .iwg-mbtn-fill,
.iwg-header[data-style="modern"]:hover .iwg-mbtn-fill{
  background:var(--iwg-b2bg, #1f3a8a); color:var(--iwg-b2fg, #fff) !important; border-color:transparent;
}
.iwg-header.iwg-scrolled .iwg-mbtn-fill:hover,
.iwg-header[data-pos="bar"] .iwg-mbtn-fill:hover,
.iwg-header:hover .iwg-mbtn-fill:hover{
  background:var(--iwg-b2bg, #1f3a8a); color:var(--iwg-b2fg, #fff) !important; filter:brightness(.9);
}

/* 바 모드(data-pos="bar")는 흰 배경이라 원래 "컬러 테두리 + 흰 배경" 이었다.
   v1.24.0 덮어쓰기 목록에서 이 상태만 빠져 있어서 컬러피커가 먹지 않았다. (v1.30.1)
   이제 다른 흰 배경 상태와 똑같이 지정색으로 채운다. */

/* --- "투명 비주얼 위에서도 지정색" 을 켠 경우 --- */
.iwg-header[data-btncolor="1"] .iwg-mbtn-line{
  background:var(--iwg-b1bg, #0e9488); color:var(--iwg-b1fg, #fff) !important; border-color:transparent;
}
.iwg-header[data-btncolor="1"] .iwg-mbtn-fill{
  background:var(--iwg-b2bg, #1f3a8a); color:var(--iwg-b2fg, #fff) !important; border-color:transparent;
}
.iwg-header[data-btncolor="1"] .iwg-mbtn:hover{ filter:brightness(.9); }

/* --- 모바일 : 메뉴 목록 안으로 내려간 버튼도 같은 색 --- */
@media (max-width:1024px){
  .iwg-member.iwg-member-mobile .iwg-mbtn-line{
    background:var(--iwg-b1bg, #0e9488); color:var(--iwg-b1fg, #fff) !important; border-color:transparent;
  }
  .iwg-member.iwg-member-mobile .iwg-mbtn-fill{
    background:var(--iwg-b2bg, #1f3a8a); color:var(--iwg-b2fg, #fff) !important; border-color:transparent;
  }
  .iwg-member.iwg-member-mobile .iwg-mbtn-x{
    background:var(--iwg-b3bg, #5a5f6a); color:var(--iwg-b3fg, #fff) !important; border-color:transparent;
  }
}

/* ============================================================
   MINIMAL 보정 — v1.36.0
   ------------------------------------------------------------
   ① 바 모드 규칙이 minimal 을 덮고 있었다.
      .iwg-header[data-pos="bar"]::after (525줄) 와
      .iwg-header[data-style="minimal"]::after (277줄) 은 특이도가 같은데
      바 모드 쪽이 파일 뒤에 있어 순서로 이겼다.
      그래서 미니멀인데도 흰 띠 높이가 56px 이 아니라
      클래식 메가패널 높이(--iwg-panel-h, 최소 150px)로 열리고 있었다.
      → 스타일2·3·4(바 모드)에서 미니멀을 고르면 흰 띠가 항상 150px 이상이었다.
   ② 흰 띠 높이를 옵션으로 뺀다(--iwg-msubh-set, 기본 46px).
      서브 링크 높이도 같은 변수를 쓰므로 글자가 항상 띠 한가운데에 온다.
   ③ 서브메뉴 가로 위치는 CSS 로 못 맞춘다(글자 폭을 모른다) —
      iw-gnb.js 가 실측해서 인라인 left 로 넣는다.
   ============================================================ */
.iwg-header[data-style="minimal"]{ --iwg-msubh: var(--iwg-msubh-set, 46px); }

/* 흰 띠 — 바 모드에서도 미니멀 높이를 쓴다 */
.iwg-header[data-style="minimal"]::after,
.iwg-header[data-style="minimal"][data-pos="bar"]::after{
  content:''; position:absolute; left:0; right:0; top:100%;
  height:0; background:#fff;
  /* 그림자 없음 (v1.36.2) — 미니멀은 흰 바 자체가 배경이라
     아래로 번지는 그림자가 배너 위에 회색 띠처럼 남았다.
     바 모드 규칙의 box-shadow:0 14px 30px 도 여기서 같이 덮는다. */
  box-shadow:none;
  border-top:0;
  transition:height .28s ease; z-index:1; pointer-events:none;
}

/* 헤더 아래 회색 가로선 제거 (v1.36.1) — 미니멀 한정.
   같은 자리에 선이 나올 수 있는 곳이 세 군데라 전부 막는다.
     · 미니멀 ::after 의 border-top:1px solid #eee  (238,238,238 로 실측된 그 선)
     · .iwg-header::before  배경 #e8e8e8 (겹치기 모드에서 호버 시 나타남)
     · .iwg-header:hover / .iwg-scrolled 의 box-shadow:0 1px 0
   미니멀은 원래 항상 흰 배경이라 경계선이 없어도 헤더가 묻히지 않는다. */
.iwg-header[data-style="minimal"]::before,
.iwg-header[data-style="minimal"]:hover::before{ opacity:0; }
.iwg-header[data-style="minimal"],
.iwg-header[data-style="minimal"].iwg-scrolled,
.iwg-header[data-style="minimal"]:hover,
.iwg-header[data-style="minimal"][data-pos="bar"]{ box-shadow:none; }
.iwg-header[data-style="minimal"]:hover::after,
.iwg-header[data-style="minimal"][data-pos="bar"]:hover::after{
  height:var(--iwg-msubh, 46px);
}

/* 서브 링크 높이 = 띠 높이 (세로 가운데) */
.iwg-header[data-style="minimal"] ul.iwg-sub a{
  height:var(--iwg-msubh, 46px); line-height:var(--iwg-msubh, 46px);
}

/* 바 모드에서 서브메뉴가 흐름/폭에 눌리지 않게 미니멀 규칙을 다시 못 박는다.
   (바 모드 rule 이 left:0;right:0;top:100% 로 덮고 있었다) */
.iwg-header[data-style="minimal"][data-pos="bar"] ul.iwg-sub{
  position:absolute; top:100%; right:auto; width:max-content;
  max-height:none; overflow:visible; z-index:3;
}

/* 모바일 : 미니멀도 세로 목록으로 되돌린다.
   (가로 한 줄 + absolute 는 데스크톱 전용이다) */
@media (max-width:1024px){
  .iwg-header[data-style="minimal"] ul.iwg-sub,
  .iwg-header[data-style="minimal"][data-pos="bar"] ul.iwg-sub{
    position:static !important; left:auto !important; right:auto !important;
    width:auto !important; display:block !important;
    max-height:none !important; overflow:visible !important;
    transform:none !important; opacity:1 !important; visibility:visible !important;
  }
  .iwg-header[data-style="minimal"] ul.iwg-sub a{
    height:auto; line-height:1.5; padding:8px 0 !important; text-align:left;
  }
  .iwg-header[data-style="minimal"]::after,
  .iwg-header[data-style="minimal"][data-pos="bar"]::after{ display:none !important; }
}

/* ============================================================
   MINIMAL 서브바 자동 높이 — v1.37.0
   ------------------------------------------------------------
   고정 높이 + 글자 세로 가운데 정렬로는 "아래 여백을 3px 로" 같은
   요청을 받을 수가 없다(가운데니까 위·아래가 항상 같다).
   띠 높이 0 = 자동 → data-msub="auto" 가 붙고,
     흰 띠 높이 = 글자줄 + 아래 여백
     흰 띠·서브메뉴 위치 = 헤더 아래 + 간격(음수면 헤더 안쪽으로 당김)
   흰 띠(::after)와 서브메뉴(ul)에 같은 top 을 주므로 항상 같이 움직인다.
   ============================================================ */
.iwg-header[data-style="minimal"][data-msub="auto"]{
  --iwg-msubline: calc(var(--iwg-sub-size, 16px) * 1.35);
  --iwg-msubh: calc(var(--iwg-msubline) + var(--iwg-msubpb, 3px));
}
.iwg-header[data-style="minimal"][data-msub="auto"]::after,
.iwg-header[data-style="minimal"][data-msub="auto"][data-pos="bar"]::after,
.iwg-header[data-style="minimal"][data-msub="auto"] ul.iwg-sub,
.iwg-header[data-style="minimal"][data-msub="auto"][data-pos="bar"] ul.iwg-sub{
  top: calc(100% + var(--iwg-msubgap, 6px));
}
/* 글자는 위 기준으로 붙이고 아래 여백만 준다.
   좌우 14px 는 그대로 — iw-gnb.js 의 가로 정렬이 이 값을 읽는다. */
.iwg-header[data-style="minimal"][data-msub="auto"] ul.iwg-sub a{
  height: auto; line-height: var(--iwg-msubline);
  padding: 0 14px var(--iwg-msubpb, 3px) !important;
}

/* 모바일 : 자동 모드도 세로 목록으로 되돌린다.
   (위 규칙이 특이도가 높아 앞의 모바일 블록만으로는 안 눌린다) */
@media (max-width:1024px){
  .iwg-header[data-style="minimal"][data-msub="auto"] ul.iwg-sub,
  .iwg-header[data-style="minimal"][data-msub="auto"][data-pos="bar"] ul.iwg-sub{
    top: auto !important;
  }
  .iwg-header[data-style="minimal"][data-msub="auto"] ul.iwg-sub a{
    height: auto; line-height: 1.5; padding: 8px 0 !important; text-align: left;
  }
}

/* ============================================================
   메뉴 글자색 직접 지정 — v1.39.0
   ------------------------------------------------------------
   .iwg-top 과 서브 링크의 color 가 파일 곳곳 18군데에 하드코딩돼 있었다
   (기본 / 스크롤 / 헤더호버 / 항목호버 / minimal / line / bar / 모바일).
   상태마다 !important 오버라이드를 쌓으면 반드시 하나가 빠지므로,
   ★ "지금 쓸 색"을 CSS 변수 하나(--iwg-c-cur / --iwg-s-cur)에 담고
     색 선언은 딱 한 줄만 둔다. 상태 판단은 전부 변수 쪽에서 한다.
   커스텀 속성도 상속되므로 li 에 심으면 그 안의 a 가 물려받는다.

   data-menucolor="1" 이 없으면 이 블록은 통째로 안 걸린다 → 기존 사이트 영향 0.
   data-mcalways="1" 이면 투명 비주얼 위에서도 지정색을 쓴다.
   ============================================================ */

/* --- 대메뉴 --- */
/* 투명 비주얼 위(스크롤 전)는 원래대로 흰 글자 */
.iwg-header[data-menucolor="1"]{ --iwg-c-cur: #fff; --iwg-s-cur: var(--iwg-csub, #555); }
/* 배경이 채워진 상태 = 지정한 기본색 */
.iwg-header[data-menucolor="1"].iwg-scrolled,
.iwg-header[data-menucolor="1"]:hover,
.iwg-header[data-menucolor="1"].iwg-mopen,
.iwg-header[data-menucolor="1"][data-style="minimal"],
.iwg-header[data-menucolor="1"][data-pos="bar"],
.iwg-header[data-menucolor="1"][data-mcalways="1"]{ --iwg-c-cur: var(--iwg-ctop, #111); }
/* 현재 페이지 → 호버 순서로 둔다. 같은 특이도라 뒤에 있는 호버가 이긴다 */
.iwg-header[data-menucolor="1"] .iwg-item.current-menu-item,
.iwg-header[data-menucolor="1"] .iwg-item.current-menu-parent,
.iwg-header[data-menucolor="1"] .iwg-item.current-menu-ancestor,
.iwg-header[data-menucolor="1"] .iwg-item.current_page_item,
.iwg-header[data-menucolor="1"] .iwg-item.current_page_parent,
.iwg-header[data-menucolor="1"] .iwg-item.current_page_ancestor{ --iwg-c-cur: var(--iwg-ctopa, #2a1670); }
.iwg-header[data-menucolor="1"] .iwg-item:hover{ --iwg-c-cur: var(--iwg-ctoph, #2a1670); }
/* 색 선언은 이 한 줄뿐 — [data-style] 은 항상 붙으므로 특이도만 올려 준다 */
/* minimal · line 의 "항목 호버" 규칙이 (0,5,0)+!important 라
   (0,4,0) 로는 못 이긴다 — 같은 모양(.iwg-item:hover > .iwg-top)으로 한 줄 더 둔다.
   스크립트로 상태 전수 확인해서 찾은 구멍이다. */
.iwg-header[data-menucolor="1"][data-style] .iwg-top,
.iwg-header[data-menucolor="1"][data-style] .iwg-item > .iwg-top,
.iwg-header[data-menucolor="1"][data-style] .iwg-item:hover > .iwg-top{
  color: var(--iwg-c-cur) !important; opacity: 1 !important;
}

/* --- 서브메뉴 --- */
.iwg-header[data-menucolor="1"] ul.iwg-sub li.current-menu-item,
.iwg-header[data-menucolor="1"] ul.iwg-sub li.current_page_item{ --iwg-s-cur: var(--iwg-csuba, #2a1670); }
.iwg-header[data-menucolor="1"] ul.iwg-sub a:hover{ --iwg-s-cur: var(--iwg-csubh, #2a1670); }
.iwg-header[data-menucolor="1"][data-style] ul.iwg-sub a{
  color: var(--iwg-s-cur) !important;
}

/* 현재 페이지는 굵게 — 색만으로는 잘 안 보인다 */
.iwg-header[data-menucolor="1"] ul.iwg-sub li.current-menu-item > a,
.iwg-header[data-menucolor="1"] ul.iwg-sub li.current_page_item > a{ font-weight: 700; }

/* 드롭다운 좌측 썸네일 끄기 — v1.40.0
   워커에서 마크업 자체를 안 그리지만, 로고 호버 이미지나
   캐시된 메뉴 HTML 이 남아 있을 수 있어 CSS 로도 못을 박는다. */
.iwg-header[data-thumb="0"] .iwg-sub-thumb,
.iwg-header[data-thumb="0"] .iwg-cta-thumb{ display:none !important; }

/* =========================================================
   좁은 데스크톱(폴더블 펼침 · 작은 노트북) 대메뉴 잘림 방지 — v1.46.0

   증상: 1025~1280px 구간은 아직 가로 메뉴 모드인데
         로고(약 250px) + 대메뉴(칼럼 최소 120px × 5 = 600px)
         + 로고~메뉴 간격 60px + 회원버튼(약 180px) + 좌우 여백 80px
         = 약 1170px 가 필요해서, 화면이 그보다 좁으면
         오른쪽 항목(마지막 대메뉴)과 회원버튼이 화면 밖으로 밀려 사라졌다.
         1024px 이하로 더 좁히면 3줄 메뉴가 나와서 오히려 멀쩡해 보였음.

   해결: 이 구간에서만 여백 · 칼럼 하한 · 버튼 크기를 줄여 한 줄에 들어오게 한다.
         칼럼 하한만 120→84px 로 낮추면 실제로는 가운데 항(9.4vw ≈ 96~120px)이
         잡히므로 글자 크기는 그대로 두고 남는 폭만 회수하는 셈이다.
         1024px 이하(3줄 메뉴)와 1281px 이상(기존 PC)은 전혀 건드리지 않는다.
   ========================================================= */
@media (min-width:1025px) and (max-width:1280px){
  .iwg-bar{ padding:0 16px; gap:min(var(--iwg-gapl, 60px), 20px); }

  .iwg-item{
    width:clamp(calc(84px * var(--iwg-top-k, 1)), 9.4vw, calc(170px * var(--iwg-top-k, 1)));
  }
  .iwg-top{ letter-spacing:-.4px; }

  /* 로그인 / 회원가입 / 추가 버튼 */
  .iwg-member{ margin-left:8px; gap:6px; }
  .iwg-mbtn{ padding:0 13px; font-size:13px; }

  /* 한/영 전환 */
  .iwg-lang{ margin-left:12px; }
  .iwg-lang-link{ min-width:30px; padding:0 7px; font-size:14px; }
}

/* 1100px 이하(폴드 펼침 폭 근처)는 로고까지 조금 줄여야
   메뉴가 5~6개일 때도 여유가 생긴다. */
@media (min-width:1025px) and (max-width:1100px){
  .iwg-bar{ padding:0 12px; gap:min(var(--iwg-gapl, 60px), 14px); }
  .iwg-logo img{ height:min(var(--iwg-logoh, 64px), 52px) !important; }
  .iwg-header[data-logo="auto"] .iwg-logo img{ height:auto !important; max-height:52px; }
  .iwg-mbtn{ padding:0 11px; }
}