@charset "utf-8";
/* ============================================================
 * gt_mnav — 리빌더 모바일 전체메뉴 스킨 엔진   style.css  (css=1)
 * ------------------------------------------------------------
 * gt_mnav.php 의 GTMN_CSS_VER 와 아래 --gtmn-css-ver 는 짝이다.
 * CSS 를 고치면 둘을 함께 올린다(소스보기 표식 · 콘솔 경고로 배포 누락이 갈린다).
 *
 * ▣ 특이도 계약
 *   테마      .cbp-hrmenu-btm / .cbp-hrmenu-btm.active       (0,1,0)~(0,2,0)
 *   테마      .cbp-hrmenu-btm > ul > li …  set.point.css 의 .cbp-hrmenu > ul > li …
 *             → 목록을 .gtmn_panel 안으로 한 겹 감싸 "매칭 자체"를 피한다.
 *               (테마 JS cbpHorizontalMenu_btm 도 같은 선택자라 아무것도 안 붙는다)
 *   여기      #cbp-hrmenu-btm.gtmn …  모든 규칙에 ID 를 세운다 (1,1,0)+
 *             → reset.css 의 a{color:#000} · form.css 의 input 규칙을 상태(:visited 등)
 *               나열 없이 이긴다. 리셋은 (1,1,1), 컴포넌트는 (1,2,0) 이상.
 *
 * ▣ 축별 클래스 접두어 (루트 nav 에 붙는다)
 *   ly_ 레이아웃   mn_ 메뉴구조   it_ 항목   mk_ 현재위치   ar_ 펼침아이콘
 *   bt_ 버튼       qk_ 퀵액션     tp_ 상단   cl_ 닫기       sf_ 바탕   tn_ 컬러
 *
 * ▣ 색 — 강조컬러는 인라인으로 내려보내지 않는다(tn_auto). 고정 컬러셋만 인라인.
 *   color-mix() 가 필요한 값은 @supports 안에서만 정의한다.
 *   커스텀 속성은 "나중 선언이 폴백" 이 안 된다(계산 시점 무효 → unset).
 * ============================================================ */

/* ── 0. 루트 레이어 ─────────────────────────────────────── */
#cbp-hrmenu-btm.gtmn{
  --gtmn-css-ver:3;
  --gtmn-point:var(--rb-point, var(--point-color, #2f6fed));
  --gtmn-rgb:var(--rb-point-rgb, 47,111,237);
  --gtmn-on:var(--rb-point-on, #ffffff);

  --gtmn-dur:420ms;
  --gtmn-ease:cubic-bezier(.22,.8,.24,1);
  /* 설정값(px)은 gt_mnav.php 가 --gtmn-*-base 로 인라인 내려보낸다.
     여기서 실제 쓰는 이름(--gtmn-pad 등)으로 한 번 받아 온다 — 인라인 style 은
     어떤 선택자보다 강해서, 500px 이하에서 줄이려면(§ 500px 미디어쿼리) 반드시
     이 "받아오는 자리"를 거쳐야 한다(인라인 자체를 미디어쿼리로 못 이긴다).
     자기 자신을 참조하면 순환이 되므로 항상 -base 를 가리킨다. */
  --gtmn-pad:var(--gtmn-pad-base, 22px);   /* 좌우 여백 */
  --gtmn-fs:var(--gtmn-fs-base, 20px);     /* 대메뉴 글자 */
  --gtmn-fs2:var(--gtmn-fs2-base, 16px);   /* 서브메뉴 글자 */
  --gtmn-ip:15px;           /* 대메뉴 위아래 */
  --gtmn-sp:8px;            /* 서브 위아래 */
  --gtmn-w:86%;             /* 서랍 폭 */
  --gtmn-wmax:420px;
  --gtmn-sh:88%;            /* 바텀시트 높이 */
  --gtmn-logo-h:40px;
  --gtmn-logo-w:200px;
  --gtmn-rad:14px;          /* 카드 둥글기 */
  --gtmn-brad:999px;        /* 버튼 둥글기 — bt_ 가 바꾼다 */
  --gtmn-arx:17px;          /* 펼침 아이콘 중심 x */
  --gtmn-mkx:max(4px, calc(var(--gtmn-pad) - 12px));  /* 현재위치 바 x */
  --gtmn-font:'font-R', Pretendard, -apple-system, 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif;
  --gtmn-font-b:'font-B', Pretendard, -apple-system, 'Apple SD Gothic Neo', 'Malgun Gothic', sans-serif;

  /* 바탕 기본값 = sf_light */
  --gtmn-bg:#ffffff; --gtmn-fg:#17191d; --gtmn-fg2:#4d525a; --gtmn-mut:#858b94;
  --gtmn-line:rgba(16,20,28,.07); --gtmn-line2:rgba(16,20,28,.12);
  --gtmn-sub:#f5f6f8; --gtmn-card:#ffffff; --gtmn-chip:#f0f1f3;
  --gtmn-acc:var(--gtmn-point);
  --gtmn-soft:rgba(var(--gtmn-rgb), .10);
  --gtmn-pri-bg:var(--gtmn-point); --gtmn-pri-fg:var(--gtmn-on);
  --gtmn-dimc:rgba(10,12,16,.48);

  /* 테마 .cbp-hrmenu-btm(left:-100% · overflow-y:scroll · transition:all 600ms) 를 전부 되돌린다.
     display 는 건드리지 않는다 — .mobile 이 1360px 기준으로 켜고 끈다. */
  position:fixed; top:0; left:0; right:0; bottom:0; width:100%; height:100%;
  z-index:100000; margin:0; padding:0; border:0;
  background:transparent; box-shadow:none; overflow:hidden;
  visibility:hidden; pointer-events:none;
  transition:visibility 0s linear var(--gtmn-dur);
  font-family:var(--gtmn-font); font-weight:400; text-indent:0;
  -webkit-text-size-adjust:100%; text-size-adjust:100%;
}
#cbp-hrmenu-btm.gtmn.active{ left:0; visibility:visible; pointer-events:auto; transition-delay:0s; }

#cbp-hrmenu-btm.gtmn,
#cbp-hrmenu-btm.gtmn *,
#cbp-hrmenu-btm.gtmn *::before,
#cbp-hrmenu-btm.gtmn *::after{ box-sizing:border-box; }

/* 리셋 (1,1,1) — 컴포넌트 규칙은 모두 (1,2,0) 이상이라 이 리셋에 지지 않는다 */
#cbp-hrmenu-btm.gtmn ul,
#cbp-hrmenu-btm.gtmn li{ margin:0; padding:0; list-style:none; float:none; width:auto; border:0; text-indent:0; background:none; }
#cbp-hrmenu-btm.gtmn a{ color:inherit; text-decoration:none; font-family:inherit; float:none; -webkit-tap-highlight-color:transparent; }
#cbp-hrmenu-btm.gtmn button{ font:inherit; color:inherit; background:none; border:0; margin:0; padding:0; border-radius:0;
  cursor:pointer; -webkit-appearance:none; appearance:none; -webkit-tap-highlight-color:transparent; text-align:inherit; }
#cbp-hrmenu-btm.gtmn p{ margin:0; }
#cbp-hrmenu-btm.gtmn svg{ display:block; }

/* 열려 있는 동안 뒤 페이지 스크롤을 막는다 (mobile.css 의 html,body{overflow-x:hidden} 을 이긴다) */
html.gtmn_lock,
html.gtmn_lock body{ overflow:hidden !important; }

/* 테마 닫기 버튼(tail.php)은 쓰지 않는다 — 패널이 자기 닫기 버튼을 갖는다.
   헤더들의 #m_gnb_close_btn.active{display:block !important}(1,1,0) 을 (1,1,3) 로 이긴다.
   (1025~1360px 에서 메뉴를 닫을 수 없던 문제도 구조적으로 사라진다 — 테마 스킬 §11.6①) */
html body button#m_gnb_close_btn,
html body button#m_gnb_close_btn.active{ display:none !important; }

/* ── 1. 바탕(surface) 토큰 ───────────────────────────────── */
#cbp-hrmenu-btm.gtmn.sf_gray{
  --gtmn-bg:#f2f3f5; --gtmn-sub:#ffffff; --gtmn-card:#ffffff; --gtmn-chip:#e7e9ec;
  --gtmn-line:rgba(16,20,28,.07); --gtmn-line2:rgba(16,20,28,.09);
}
#cbp-hrmenu-btm.gtmn.sf_tint{
  --gtmn-bg:#f6f8fc; --gtmn-sub:rgba(255,255,255,.75); --gtmn-card:#ffffff; --gtmn-chip:rgba(var(--gtmn-rgb), .08);
  --gtmn-line:rgba(var(--gtmn-rgb), .10); --gtmn-line2:rgba(var(--gtmn-rgb), .16);
}
#cbp-hrmenu-btm.gtmn.sf_dark{
  --gtmn-bg:#15171b; --gtmn-fg:#f1f2f4; --gtmn-fg2:#b7bbc3; --gtmn-mut:#878d96;
  --gtmn-line:rgba(255,255,255,.08); --gtmn-line2:rgba(255,255,255,.14);
  --gtmn-sub:rgba(255,255,255,.045); --gtmn-card:#1e2126; --gtmn-chip:rgba(255,255,255,.08);
  --gtmn-soft:rgba(var(--gtmn-rgb), .22);
  --gtmn-dimc:rgba(0,0,0,.6);
}
#cbp-hrmenu-btm.gtmn.sf_point{
  --gtmn-bg:var(--gtmn-point); --gtmn-fg:var(--gtmn-on); --gtmn-fg2:var(--gtmn-on); --gtmn-mut:var(--gtmn-on);
  --gtmn-line:rgba(255,255,255,.16); --gtmn-line2:rgba(255,255,255,.26);
  --gtmn-sub:rgba(0,0,0,.08); --gtmn-card:rgba(255,255,255,.12); --gtmn-chip:rgba(255,255,255,.16);
  --gtmn-acc:var(--gtmn-on); --gtmn-soft:rgba(255,255,255,.2);
  --gtmn-pri-bg:var(--gtmn-on); --gtmn-pri-fg:var(--gtmn-point);
}
#cbp-hrmenu-btm.gtmn.sf_glass{
  --gtmn-bg:rgba(255,255,255,.97); --gtmn-sub:rgba(255,255,255,.55); --gtmn-card:rgba(255,255,255,.72);
  --gtmn-chip:rgba(16,20,28,.06); --gtmn-dimc:rgba(10,12,16,.22);
}
@supports ((-webkit-backdrop-filter:blur(1px)) or (backdrop-filter:blur(1px))){
  #cbp-hrmenu-btm.gtmn.sf_glass{ --gtmn-bg:rgba(255,255,255,.68); }
  #cbp-hrmenu-btm.gtmn.sf_glass .gtmn_panel{ -webkit-backdrop-filter:blur(22px) saturate(160%); backdrop-filter:blur(22px) saturate(160%); }
}
/* color-mix 가 되는 브라우저에서만 더 정교한 색으로 */
@supports (color:color-mix(in srgb, red 50%, blue)){
  #cbp-hrmenu-btm.gtmn{ --gtmn-soft:color-mix(in srgb, var(--gtmn-point) 11%, transparent); }
  #cbp-hrmenu-btm.gtmn.sf_tint{
    --gtmn-bg:color-mix(in srgb, var(--gtmn-point) 6%, #ffffff);
    --gtmn-chip:color-mix(in srgb, var(--gtmn-point) 9%, transparent);
    --gtmn-line:color-mix(in srgb, var(--gtmn-point) 11%, transparent);
    --gtmn-line2:color-mix(in srgb, var(--gtmn-point) 18%, transparent);
  }
  #cbp-hrmenu-btm.gtmn.sf_dark{
    --gtmn-acc:color-mix(in srgb, var(--gtmn-point) 72%, #ffffff);
    --gtmn-soft:color-mix(in srgb, var(--gtmn-point) 24%, transparent);
  }
  #cbp-hrmenu-btm.gtmn.sf_point{
    --gtmn-fg2:color-mix(in srgb, var(--gtmn-on) 84%, transparent);
    --gtmn-mut:color-mix(in srgb, var(--gtmn-on) 64%, transparent);
    --gtmn-line:color-mix(in srgb, var(--gtmn-on) 15%, transparent);
    --gtmn-line2:color-mix(in srgb, var(--gtmn-on) 26%, transparent);
    --gtmn-card:color-mix(in srgb, var(--gtmn-on) 12%, transparent);
    --gtmn-chip:color-mix(in srgb, var(--gtmn-on) 16%, transparent);
    --gtmn-soft:color-mix(in srgb, var(--gtmn-on) 20%, transparent);
  }
}

/* ── 2. 레이아웃(ly_) — 딤 · 패널 ─────────────────────────── */
#cbp-hrmenu-btm.gtmn .gtmn_dim{
  position:absolute; top:0; left:0; right:0; bottom:0;
  background:var(--gtmn-dimc); opacity:0; transition:opacity var(--gtmn-dur) ease;
}
#cbp-hrmenu-btm.gtmn.active .gtmn_dim{ opacity:1; }
#cbp-hrmenu-btm.gtmn.ly_full .gtmn_dim,
#cbp-hrmenu-btm.gtmn.ly_fade .gtmn_dim{ display:none; }

#cbp-hrmenu-btm.gtmn .gtmn_panel{
  position:absolute; display:flex; flex-direction:column; overflow:hidden;
  background:var(--gtmn-bg); color:var(--gtmn-fg);
  transition:transform var(--gtmn-dur) var(--gtmn-ease), opacity var(--gtmn-dur) ease;
  will-change:transform;
}
#cbp-hrmenu-btm.gtmn .gtmn_scroll{
  position:relative; flex:1 1 auto; min-height:0;
  overflow-x:hidden; overflow-y:auto; overscroll-behavior:contain; -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
#cbp-hrmenu-btm.gtmn .gtmn_scroll::-webkit-scrollbar{ display:none; }
#cbp-hrmenu-btm.gtmn .gtmn_in{ position:relative; padding-bottom:calc(8px + env(safe-area-inset-bottom)); }

/* 전체화면 — 지금 쓰는 방식(왼쪽에서 밀고 들어옴) */
#cbp-hrmenu-btm.gtmn.ly_full .gtmn_panel{ top:0; left:0; right:0; bottom:0; transform:translate3d(-100%,0,0); }
/* 서랍 */
#cbp-hrmenu-btm.gtmn.ly_drawer_l .gtmn_panel,
#cbp-hrmenu-btm.gtmn.ly_drawer_r .gtmn_panel{ top:0; bottom:0; width:var(--gtmn-w); max-width:var(--gtmn-wmax); }
#cbp-hrmenu-btm.gtmn.ly_drawer_l .gtmn_panel{ left:0;  transform:translate3d(-100%,0,0); box-shadow:10px 0 40px rgba(0,0,0,.16); }
#cbp-hrmenu-btm.gtmn.ly_drawer_r .gtmn_panel{ right:0; transform:translate3d(100%,0,0);  box-shadow:-10px 0 40px rgba(0,0,0,.16); }
/* 바텀시트 — 태블릿에서는 가운데 640px */
#cbp-hrmenu-btm.gtmn.ly_sheet .gtmn_panel{
  left:0; right:0; bottom:0; margin:0 auto; max-width:640px;
  height:var(--gtmn-sh); max-height:calc(100% - 20px);
  border-radius:22px 22px 0 0; transform:translate3d(0,100%,0); box-shadow:0 -10px 40px rgba(0,0,0,.18);
}
/* 오버레이 — 제자리에서 떠오름 */
#cbp-hrmenu-btm.gtmn.ly_fade .gtmn_panel{ top:0; left:0; right:0; bottom:0; opacity:0; transform:scale(1.04); }
/* 플로팅 카드 — 오른쪽 위(여는 버튼 자리)에서 커진다.
   [2026-09] max-width 를 처음부터 걸어 두면, 화면폭이 (--gtmn-wmax + 20px) 를
   넘는 순간부터 카드가 --gtmn-wmax 로 멈추고 right:10px 만 유지되면서 왼쪽 여백만
   커진다 — 태블릿에서는 의도한 "오른쪽에 붙은 카드"이지만, 420~500px 대 폰에서는
   오른쪽 여백만 사라져 "여백이 없다"로 보인다(실제로 이 폭에서 그렇게 보고받았다).
   560px 까지는 카드가 화면 전체 폭을 따라가게(좌우 10px 대칭) 두고, 진짜
   태블릿 폭부터만 오른쪽 앵커 + 최대폭으로 좁힌다. */
#cbp-hrmenu-btm.gtmn.ly_card .gtmn_panel{
  top:10px; right:10px; bottom:10px; width:calc(100% - 20px);
  border-radius:24px; opacity:0; transform:scale(.94); transform-origin:top right;
  box-shadow:0 24px 60px rgba(0,0,0,.26);
}
@media all and (min-width:560px){
  #cbp-hrmenu-btm.gtmn.ly_card .gtmn_panel{ max-width:var(--gtmn-wmax); }
}
#cbp-hrmenu-btm.gtmn.active .gtmn_panel{ transform:none; opacity:1; }

/* 넓은 화면(전체화면·오버레이)에서는 글 줄을 640px 로 모은다 */
#cbp-hrmenu-btm.gtmn.ly_full .gtmn_in,
#cbp-hrmenu-btm.gtmn.ly_fade .gtmn_in{ max-width:640px; margin:0 auto; }

/* 바텀시트 손잡이 */
#cbp-hrmenu-btm.gtmn .gtmn_grab{ display:none; }
#cbp-hrmenu-btm.gtmn.ly_sheet .gtmn_grab{ display:block; flex:none; position:relative; height:20px; cursor:grab; touch-action:none; }
#cbp-hrmenu-btm.gtmn.ly_sheet .gtmn_grab::before{
  content:""; position:absolute; left:50%; top:9px; width:40px; height:5px; margin-left:-20px;
  border-radius:3px; background:var(--gtmn-line2);
}

/* ── 3. 상단(tp_) · 닫기(cl_) · 로고 ─────────────────────── */
#cbp-hrmenu-btm.gtmn .gtmn_bar{
  flex:none; position:relative; z-index:3; display:flex; align-items:center; justify-content:flex-end; gap:10px;
  min-height:58px; padding:7px calc(var(--gtmn-pad) - 10px) 7px var(--gtmn-pad);
}
#cbp-hrmenu-btm.gtmn.tp_bar .gtmn_bar{ justify-content:space-between; border-bottom:1px solid var(--gtmn-line); }
/* 로고 가운데 · 히어로 — 닫기 버튼만 오른쪽 위에 띄운다 */
#cbp-hrmenu-btm.gtmn.tp_center .gtmn_bar,
#cbp-hrmenu-btm.gtmn.tp_hero .gtmn_bar{ position:absolute; top:0; right:0; min-height:0; padding:10px; }
#cbp-hrmenu-btm.gtmn.ly_sheet.tp_center .gtmn_bar,
#cbp-hrmenu-btm.gtmn.ly_sheet.tp_hero .gtmn_bar{ top:12px; }

#cbp-hrmenu-btm.gtmn .gtmn_logo{ display:inline-block; line-height:0; color:var(--gtmn-fg); }
#cbp-hrmenu-btm.gtmn .gtmn_logo img{ display:block; width:auto; height:auto; max-height:var(--gtmn-logo-h); max-width:var(--gtmn-logo-w); }
#cbp-hrmenu-btm.gtmn .gtmn_bar .gtmn_logo img{ max-height:calc(var(--gtmn-logo-h) * .72); }

#cbp-hrmenu-btm.gtmn .gtmn_x{
  position:relative; flex:none; display:inline-flex; align-items:center; justify-content:center; gap:6px;
  width:44px; height:44px; border-radius:50%; color:var(--gtmn-fg);
}
#cbp-hrmenu-btm.gtmn .gtmn_x i{ position:relative; display:block; width:18px; height:18px; }
#cbp-hrmenu-btm.gtmn .gtmn_x i::before,
#cbp-hrmenu-btm.gtmn .gtmn_x i::after{
  content:""; position:absolute; left:50%; top:50%; width:20px; height:2px; margin:-1px 0 0 -10px;
  border-radius:2px; background:currentColor; transform:rotate(45deg);
}
#cbp-hrmenu-btm.gtmn .gtmn_x i::after{ transform:rotate(-45deg); }
#cbp-hrmenu-btm.gtmn .gtmn_xt{ display:none; font-size:13px; font-family:var(--gtmn-font-b); font-weight:700; }
#cbp-hrmenu-btm.gtmn.cl_circle .gtmn_x{ width:40px; height:40px; background:var(--gtmn-chip); }
#cbp-hrmenu-btm.gtmn.cl_circle .gtmn_x i::before,
#cbp-hrmenu-btm.gtmn.cl_circle .gtmn_x i::after{ width:16px; margin-left:-8px; }
#cbp-hrmenu-btm.gtmn.cl_text .gtmn_x{ width:auto; height:34px; padding:0 12px 0 11px; border-radius:var(--gtmn-brad); border:1px solid var(--gtmn-line2); }
#cbp-hrmenu-btm.gtmn.cl_text .gtmn_x i{ width:12px; height:12px; }
#cbp-hrmenu-btm.gtmn.cl_text .gtmn_x i::before,
#cbp-hrmenu-btm.gtmn.cl_text .gtmn_x i::after{ width:13px; height:1.6px; margin:-.8px 0 0 -6.5px; }
#cbp-hrmenu-btm.gtmn.cl_text .gtmn_xt{ display:inline; }
/* 히어로 위의 닫기 버튼은 강조색 위에 있다 */
#cbp-hrmenu-btm.gtmn.tp_hero .gtmn_x{ color:var(--gtmn-on); }
#cbp-hrmenu-btm.gtmn.tp_hero.cl_circle .gtmn_x{ background:rgba(255,255,255,.18); }
#cbp-hrmenu-btm.gtmn.tp_hero.cl_text .gtmn_x{ border-color:rgba(255,255,255,.35); }

/* 로고 가운데 */
#cbp-hrmenu-btm.gtmn .gtmn_brand{ padding:calc(var(--gtmn-pad) + 20px) var(--gtmn-pad) 20px; text-align:center; }
#cbp-hrmenu-btm.gtmn .gtmn_info{ padding:0 var(--gtmn-pad) 14px; text-align:center; }
#cbp-hrmenu-btm.gtmn .gtmn_brand + .gtmn_info{ margin-top:-8px; }
#cbp-hrmenu-btm.gtmn .gtmn_info span{ display:block; font-size:12.5px; line-height:1.7; color:var(--gtmn-mut); }
#cbp-hrmenu-btm.gtmn.tp_bar .gtmn_info{ padding-top:12px; text-align:left; }

/* 히어로 — 강조색 띠 안에 로고 · 인사 · 회원 버튼 */
#cbp-hrmenu-btm.gtmn .gtmn_hero{
  position:relative; overflow:hidden; padding:24px var(--gtmn-pad) 22px; margin-bottom:14px;
  color:var(--gtmn-on); background-color:var(--gtmn-point);
  background-image:linear-gradient(135deg, rgba(255,255,255,.16), rgba(0,0,0,.2));
}
#cbp-hrmenu-btm.gtmn .gtmn_hero::after{
  content:""; position:absolute; right:-46px; top:-58px; width:190px; height:190px; border-radius:50%;
  background:rgba(255,255,255,.1); pointer-events:none;
}
#cbp-hrmenu-btm.gtmn .gtmn_hero .gtmn_logo{ color:var(--gtmn-on); }
#cbp-hrmenu-btm.gtmn .gtmn_hero .gtmn_logo img{ max-height:calc(var(--gtmn-logo-h) * .78); }
#cbp-hrmenu-btm.gtmn .gtmn_hero_t{ position:relative; margin-top:20px; font-family:var(--gtmn-font-b); font-weight:700; font-size:21px; line-height:1.35; letter-spacing:-.02em; }
#cbp-hrmenu-btm.gtmn .gtmn_hero_s{ position:relative; margin-top:3px; font-size:13px; opacity:.82; }
#cbp-hrmenu-btm.gtmn .gtmn_hero .gtmn_btns{ position:relative; justify-content:flex-start; margin-top:14px; }
#cbp-hrmenu-btm.gtmn.sf_point .gtmn_hero{ background-image:linear-gradient(135deg, rgba(0,0,0,.12), rgba(0,0,0,.28)); }

/* ── 4. 회원 영역 · 버튼(bt_) ───────────────────────────── */
#cbp-hrmenu-btm.gtmn .gtmn_me{
  display:flex; align-items:center; gap:12px; margin:0 var(--gtmn-pad) 12px; padding:13px 14px;
  border-radius:var(--gtmn-rad); background:var(--gtmn-sub);
}
#cbp-hrmenu-btm.gtmn.tp_bar .gtmn_me{ margin-top:14px; }
#cbp-hrmenu-btm.gtmn .gtmn_ava{
  flex:none; display:flex; align-items:center; justify-content:center; width:42px; height:42px;
  border-radius:50%; background:var(--gtmn-card); color:var(--gtmn-acc); overflow:hidden;
}
#cbp-hrmenu-btm.gtmn .gtmn_ava img{ width:100%; height:100%; object-fit:cover; }
#cbp-hrmenu-btm.gtmn .gtmn_me_t{ flex:1 1 auto; min-width:0; line-height:1.4; }
#cbp-hrmenu-btm.gtmn .gtmn_me_t b{ display:block; font-family:var(--gtmn-font-b); font-weight:700; font-size:15px; color:var(--gtmn-fg); }
#cbp-hrmenu-btm.gtmn .gtmn_me_t span{ display:block; font-size:12px; color:var(--gtmn-mut); white-space:nowrap; overflow:hidden; text-overflow:ellipsis; }
#cbp-hrmenu-btm.gtmn .gtmn_btns{ flex:none; display:flex; flex-wrap:wrap; justify-content:flex-end; gap:6px; }

#cbp-hrmenu-btm.gtmn .gtmn_btn{
  display:inline-flex; align-items:center; justify-content:center; gap:4px; height:32px; padding:0 13px;
  border:1px solid var(--gtmn-line2); border-radius:var(--gtmn-brad); background:var(--gtmn-card);
  font-family:var(--gtmn-font-b); font-weight:700; font-size:12.5px; line-height:1; white-space:nowrap;
  color:var(--gtmn-fg2);
}
#cbp-hrmenu-btm.gtmn .gtmn_btn.is_pri{ background:var(--gtmn-pri-bg); border-color:var(--gtmn-pri-bg); color:var(--gtmn-pri-fg); }

#cbp-hrmenu-btm.gtmn.bt_round{ --gtmn-brad:10px; }
#cbp-hrmenu-btm.gtmn.bt_soft { --gtmn-brad:12px; }
#cbp-hrmenu-btm.gtmn.bt_solid{ --gtmn-brad:8px; }
#cbp-hrmenu-btm.gtmn.bt_ghost{ --gtmn-brad:10px; }
#cbp-hrmenu-btm.gtmn.bt_soft .gtmn_btn{ border-color:transparent; background:var(--gtmn-soft); color:var(--gtmn-acc); }
#cbp-hrmenu-btm.gtmn.bt_solid .gtmn_btn{ border-color:var(--gtmn-fg); background:var(--gtmn-fg); color:var(--gtmn-bg); }
#cbp-hrmenu-btm.gtmn.bt_ghost .gtmn_btn{ height:28px; padding:0 4px; border-color:transparent; background:none; color:var(--gtmn-fg2);
  text-decoration:underline; text-underline-offset:4px; text-decoration-color:var(--gtmn-line2); }
#cbp-hrmenu-btm.gtmn.bt_soft .gtmn_btn.is_pri,
#cbp-hrmenu-btm.gtmn.bt_solid .gtmn_btn.is_pri{ background:var(--gtmn-pri-bg); border-color:var(--gtmn-pri-bg); color:var(--gtmn-pri-fg); }
#cbp-hrmenu-btm.gtmn.bt_ghost .gtmn_btn.is_pri{ background:none; color:var(--gtmn-acc); text-decoration-color:currentColor; }
/* 히어로 안의 버튼은 강조색 위에 있다 (bt_ 규칙보다 한 칸 높게) */
#cbp-hrmenu-btm.gtmn.tp_hero .gtmn_hero .gtmn_btn{ border-color:rgba(255,255,255,.34); background:rgba(255,255,255,.14); color:var(--gtmn-on); text-decoration:none; height:32px; padding:0 13px; }
#cbp-hrmenu-btm.gtmn.tp_hero .gtmn_hero .gtmn_btn.is_pri{ border-color:var(--gtmn-on); background:var(--gtmn-on); color:var(--gtmn-point); }

/* ── 5. 검색 · 메뉴 찾기 ─────────────────────────────────── */
#cbp-hrmenu-btm.gtmn .gtmn_search{ position:relative; margin:0 var(--gtmn-pad) 14px; }
#cbp-hrmenu-btm.gtmn.tp_bar .gtmn_bar + .gtmn_scroll .gtmn_in > .gtmn_search:first-child{ margin-top:14px; }
#cbp-hrmenu-btm.gtmn .gtmn_search form{
  display:flex; align-items:center; gap:6px; height:46px; margin:0; padding:0 5px 0 16px;
  border:1px solid var(--gtmn-line2); border-radius:var(--gtmn-brad); background:var(--gtmn-card);
}
#cbp-hrmenu-btm.gtmn .gtmn_search input[type="text"],
#cbp-hrmenu-btm.gtmn .gtmn_search input[type="search"]{
  flex:1 1 auto; min-width:0; width:auto; height:100%; margin:0; padding:0; border:0; border-radius:0;
  background:none; box-shadow:none; outline:none; font-family:inherit; font-size:15px; color:var(--gtmn-fg);
}
#cbp-hrmenu-btm.gtmn .gtmn_search input::placeholder{ color:var(--gtmn-mut); opacity:1; }
#cbp-hrmenu-btm.gtmn .gtmn_search button{
  flex:none; display:flex; align-items:center; justify-content:center; width:36px; height:36px;
  border-radius:calc(var(--gtmn-brad) - 4px); background:var(--gtmn-pri-bg); color:var(--gtmn-pri-fg);
}
#cbp-hrmenu-btm.gtmn.bt_soft  .gtmn_search form{ border-color:transparent; background:var(--gtmn-chip); }
#cbp-hrmenu-btm.gtmn.bt_solid .gtmn_search form{ border:1.5px solid var(--gtmn-fg); }
#cbp-hrmenu-btm.gtmn.bt_ghost .gtmn_search form{ height:44px; padding-left:2px; border:0; border-bottom:1.5px solid var(--gtmn-fg); border-radius:0; background:none; }
#cbp-hrmenu-btm.gtmn.bt_ghost .gtmn_search button{ background:none; color:var(--gtmn-fg); }

#cbp-hrmenu-btm.gtmn .gtmn_hits{
  display:none; margin-top:6px; padding:5px; border-radius:var(--gtmn-rad);
  border:1px solid var(--gtmn-line2); background:var(--gtmn-card); box-shadow:0 10px 26px rgba(0,0,0,.08);
}
#cbp-hrmenu-btm.gtmn .gtmn_hits.is_show{ display:block; }
#cbp-hrmenu-btm.gtmn .gtmn_hit{ display:flex; align-items:baseline; gap:8px; padding:10px 10px; border-radius:10px; font-size:14.5px; color:var(--gtmn-fg); }
#cbp-hrmenu-btm.gtmn .gtmn_hit small{ font-size:12px; color:var(--gtmn-mut); }
#cbp-hrmenu-btm.gtmn .gtmn_hit mark{ background:none; color:var(--gtmn-acc); font-family:var(--gtmn-font-b); font-weight:700; }
#cbp-hrmenu-btm.gtmn .gtmn_hit:active,
#cbp-hrmenu-btm.gtmn .gtmn_hit:focus-visible{ background:var(--gtmn-chip); }
#cbp-hrmenu-btm.gtmn .gtmn_hit_none{ padding:10px; font-size:13px; color:var(--gtmn-mut); }

/* ── 6. 퀵 액션(qk_) · 하단 고정 바 ───────────────────────── */
#cbp-hrmenu-btm.gtmn .gtmn_quick{ display:grid; grid-template-columns:repeat(3, 1fr); gap:8px; margin:0 var(--gtmn-pad) 16px; }
#cbp-hrmenu-btm.gtmn .gtmn_q{ display:flex; text-align:center; font-size:12.5px; line-height:1.3; color:var(--gtmn-fg); }
#cbp-hrmenu-btm.gtmn .gtmn_qi{ flex:none; display:flex; align-items:center; justify-content:center; line-height:0; color:var(--gtmn-acc); }
#cbp-hrmenu-btm.gtmn.qk_box .gtmn_q{
  flex-direction:column; align-items:center; gap:6px; padding:13px 4px;
  border:1px solid var(--gtmn-line2); border-radius:var(--gtmn-rad); background:var(--gtmn-card);
}
#cbp-hrmenu-btm.gtmn.qk_circle .gtmn_q{ flex-direction:column; align-items:center; gap:7px; padding:2px 0; color:var(--gtmn-fg2); }
#cbp-hrmenu-btm.gtmn.qk_circle .gtmn_qi{ width:50px; height:50px; border-radius:50%; background:var(--gtmn-soft); }
/* 목록형 — 인라인 grid-template-columns 를 이겨야 해서 !important */
#cbp-hrmenu-btm.gtmn.qk_list .gtmn_quick{
  grid-template-columns:1fr !important; gap:0; overflow:hidden;
  border:1px solid var(--gtmn-line2); border-radius:var(--gtmn-rad); background:var(--gtmn-card);
}
#cbp-hrmenu-btm.gtmn.qk_list .gtmn_quick > li + li{ border-top:1px solid var(--gtmn-line); }
#cbp-hrmenu-btm.gtmn.qk_list .gtmn_q{ align-items:center; gap:12px; padding:13px 14px; font-size:14.5px; text-align:left; }
#cbp-hrmenu-btm.gtmn.qk_list .gtmn_q::after{
  content:""; margin-left:auto; width:7px; height:7px; border:solid var(--gtmn-mut); border-width:1.6px 1.6px 0 0; transform:rotate(45deg);
}
/* 하단 고정 바 — 스크롤과 무관하게 늘 보인다(예전 '하단 정보'가 스크롤 밖으로 밀리던 문제의 답) */
#cbp-hrmenu-btm.gtmn .gtmn_dock{
  flex:none; display:grid; grid-template-columns:repeat(3, 1fr); gap:8px;
  padding:10px var(--gtmn-pad) calc(10px + env(safe-area-inset-bottom));
  border-top:1px solid var(--gtmn-line); background:var(--gtmn-bg);
}
#cbp-hrmenu-btm.gtmn .gtmn_dock .gtmn_q{
  align-items:center; justify-content:center; gap:6px; height:46px; padding:0 6px;
  border-radius:min(var(--gtmn-brad), 14px); background:var(--gtmn-chip);
  font-family:var(--gtmn-font-b); font-weight:700; font-size:14px; color:var(--gtmn-fg);
}
#cbp-hrmenu-btm.gtmn .gtmn_dock > li:first-child .gtmn_q{ background:var(--gtmn-pri-bg); color:var(--gtmn-pri-fg); }
#cbp-hrmenu-btm.gtmn .gtmn_dock .gtmn_qi{ color:inherit; }
#cbp-hrmenu-btm.gtmn.bt_pill .gtmn_dock .gtmn_q{ border-radius:999px; }

/* ── 7. 메뉴 구조(mn_) ───────────────────────────────────── */
#cbp-hrmenu-btm.gtmn .gtmn_nav{ position:relative; padding:0 0 26px; }
#cbp-hrmenu-btm.gtmn .gtmn_t{ position:relative; }

/* 7-1. 아코디언 (+ 단계이동 1단계가 같은 목록을 쓴다) */
#cbp-hrmenu-btm.gtmn .gtmn_li{ position:relative; }
#cbp-hrmenu-btm.gtmn .gtmn_row{ position:relative; display:flex; align-items:stretch; }
#cbp-hrmenu-btm.gtmn .gtmn_a{
  position:relative; flex:1 1 auto; min-width:0; display:block;
  padding:var(--gtmn-ip) 8px var(--gtmn-ip) var(--gtmn-pad);
  font-family:var(--gtmn-font-b); font-weight:700; font-size:var(--gtmn-fs); line-height:1.35; letter-spacing:-.02em;
  color:var(--gtmn-fg); word-break:keep-all;
}
#cbp-hrmenu-btm.gtmn .gtmn_li:not(.has_sub) > .gtmn_row .gtmn_a{ padding-right:var(--gtmn-pad); }
#cbp-hrmenu-btm.gtmn .gtmn_arr{ flex:none; position:relative; width:calc(var(--gtmn-pad) + 34px); min-height:48px; color:var(--gtmn-mut); }
#cbp-hrmenu-btm.gtmn .gtmn_li.is_open > .gtmn_row .gtmn_a,
#cbp-hrmenu-btm.gtmn .gtmn_li.is_on > .gtmn_row .gtmn_a{ color:var(--gtmn-acc); }
#cbp-hrmenu-btm.gtmn .gtmn_li.is_open > .gtmn_row .gtmn_arr{ color:var(--gtmn-acc); }

#cbp-hrmenu-btm.gtmn .gtmn_sub{ display:none; overflow:hidden; --gtmn-sbx:calc(var(--gtmn-pad) + 3px); }
#cbp-hrmenu-btm.gtmn .gtmn_li.is_open > .gtmn_sub{ display:block; }
#cbp-hrmenu-btm.gtmn .gtmn_sub > ul{ position:relative; padding:2px 0 14px; }
#cbp-hrmenu-btm.gtmn .gtmn_sa{
  position:relative; display:block; padding:var(--gtmn-sp) var(--gtmn-pad) var(--gtmn-sp) calc(var(--gtmn-pad) + 16px);
  font-size:var(--gtmn-fs2); line-height:1.45; color:var(--gtmn-fg2); word-break:keep-all;
}
#cbp-hrmenu-btm.gtmn .gtmn_sa.is_on{ color:var(--gtmn-acc); font-family:var(--gtmn-font-b); font-weight:700; }

/* 새글 표시 */
#cbp-hrmenu-btm.gtmn .gtmn_new{
  display:inline-flex; align-items:center; justify-content:center; min-width:16px; height:16px; padding:0 4px; margin-left:6px;
  border-radius:8px; background:var(--gtmn-pri-bg); color:var(--gtmn-pri-fg);
  font:700 10px/1 Arial, sans-serif; font-style:normal; vertical-align:.3em; letter-spacing:0;
}

/* 7-2. 좌우 분할 — 왼쪽 대메뉴 탭, 오른쪽 하위 목록 (쇼핑앱식) */
#cbp-hrmenu-btm.gtmn .gtmn_split{
  --gtmn-tabw:118px;
  display:grid; grid-template-columns:var(--gtmn-tabw) minmax(0,1fr); align-items:start;
  min-height:100%; border-top:1px solid var(--gtmn-line);
  background:linear-gradient(90deg, var(--gtmn-sub) var(--gtmn-tabw), transparent 0);
}
#cbp-hrmenu-btm.gtmn.sf_light .gtmn_split,
#cbp-hrmenu-btm.gtmn.sf_glass .gtmn_split{ background:linear-gradient(90deg, var(--gtmn-chip) var(--gtmn-tabw), transparent 0); }
#cbp-hrmenu-btm.gtmn .gtmn_tabs{ position:sticky; top:0; }
#cbp-hrmenu-btm.gtmn .gtmn_tab{
  position:relative; display:block; width:100%;
  padding:15px calc(var(--gtmn-pad) * .45) 15px var(--gtmn-pad);
  font-size:14.5px; line-height:1.35; color:var(--gtmn-fg2); word-break:keep-all; text-align:left;
}
#cbp-hrmenu-btm.gtmn .gtmn_tab.is_sel{ background:var(--gtmn-bg); color:var(--gtmn-acc); font-family:var(--gtmn-font-b); font-weight:700; }
#cbp-hrmenu-btm.gtmn.sf_gray .gtmn_tab.is_sel{ background:var(--gtmn-bg); }
#cbp-hrmenu-btm.gtmn .gtmn_tab.is_sel::before{
  content:""; position:absolute; left:0; top:13px; bottom:13px; width:3px; border-radius:0 3px 3px 0; background:var(--gtmn-acc);
}
#cbp-hrmenu-btm.gtmn .gtmn_tab.is_on:not(.is_sel) .gtmn_t::after{
  content:""; display:inline-block; width:5px; height:5px; margin-left:5px; border-radius:50%; background:var(--gtmn-acc); vertical-align:.3em;
}
#cbp-hrmenu-btm.gtmn .gtmn_pane{ display:none; padding:4px 0 20px; --gtmn-sbx:7px; }
#cbp-hrmenu-btm.gtmn .gtmn_pane.is_sel{ display:block; animation:gtmnFade .28s ease both; }
#cbp-hrmenu-btm.gtmn .gtmn_pane_h{ display:flex; align-items:center; justify-content:space-between; gap:8px; padding:15px var(--gtmn-pad) 8px var(--gtmn-pad); }
#cbp-hrmenu-btm.gtmn .gtmn_pane_h b{ font-family:var(--gtmn-font-b); font-weight:700; font-size:17px; color:var(--gtmn-fg); }
#cbp-hrmenu-btm.gtmn .gtmn_pane .gtmn_sa{ padding:12px var(--gtmn-pad); border-bottom:1px solid var(--gtmn-line); color:var(--gtmn-fg); }
#cbp-hrmenu-btm.gtmn .gtmn_all{
  flex:none; display:inline-flex; align-items:center; gap:3px; font-size:12px; color:var(--gtmn-mut); white-space:nowrap;
}
#cbp-hrmenu-btm.gtmn .gtmn_all::after{ content:""; width:6px; height:6px; border:solid currentColor; border-width:1.4px 1.4px 0 0; transform:rotate(45deg); }

/* 7-3. 단계 이동 — 대메뉴를 누르면 하위 화면으로 넘어간다 (iOS 설정앱식) */
#cbp-hrmenu-btm.gtmn .gtmn_drill{ position:relative; overflow:hidden; }
#cbp-hrmenu-btm.gtmn .gtmn_track{ display:flex; width:200%; transition:transform var(--gtmn-dur) var(--gtmn-ease); }
#cbp-hrmenu-btm.gtmn .gtmn_lv1,
#cbp-hrmenu-btm.gtmn .gtmn_lv2{ flex:0 0 50%; width:50%; min-width:0; }
#cbp-hrmenu-btm.gtmn .gtmn_drill.is_deep .gtmn_track{ transform:translate3d(-50%,0,0); }
/* 넘어간 뒤에는 1단계 높이를 접는다 — 긴 1단계 밑에 빈 공간이 남지 않게 */
#cbp-hrmenu-btm.gtmn .gtmn_drill.is_settled .gtmn_lv1{ height:0; overflow:hidden; visibility:hidden; }
#cbp-hrmenu-btm.gtmn .gtmn_dpane{ display:none; --gtmn-sbx:var(--gtmn-mkx); }
#cbp-hrmenu-btm.gtmn .gtmn_dpane.is_sel{ display:block; }
#cbp-hrmenu-btm.gtmn .gtmn_dhead{ display:flex; align-items:center; padding:4px calc(var(--gtmn-pad) - 12px) 0; }
#cbp-hrmenu-btm.gtmn .gtmn_back{ display:inline-flex; align-items:center; gap:7px; height:42px; padding:0 12px; font-size:14px; color:var(--gtmn-fg2); }
#cbp-hrmenu-btm.gtmn .gtmn_back::before{ content:""; width:8px; height:8px; border:solid currentColor; border-width:0 0 2px 2px; transform:rotate(45deg); }
#cbp-hrmenu-btm.gtmn .gtmn_dtit{ display:flex; align-items:baseline; justify-content:space-between; gap:10px; padding:6px var(--gtmn-pad) 10px; }
#cbp-hrmenu-btm.gtmn .gtmn_dtit b{ font-family:var(--gtmn-font-b); font-weight:700; font-size:calc(var(--gtmn-fs) * 1.25); letter-spacing:-.03em; color:var(--gtmn-fg); }
#cbp-hrmenu-btm.gtmn .gtmn_dpane .gtmn_sa{
  display:flex; align-items:center; justify-content:space-between; gap:10px;
  padding:14px var(--gtmn-pad); border-top:1px solid var(--gtmn-line); font-size:calc(var(--gtmn-fs2) + 1px); color:var(--gtmn-fg);
}
#cbp-hrmenu-btm.gtmn .gtmn_dpane .gtmn_sa::after{ content:""; flex:none; width:7px; height:7px; border:solid var(--gtmn-mut); border-width:1.6px 1.6px 0 0; transform:rotate(45deg); }
#cbp-hrmenu-btm.gtmn .gtmn_dpane .gtmn_sa.is_on{ color:var(--gtmn-acc); }

/* 7-4. 펼침 칩 — 누를 필요 없이 한 화면에 전부 (사이트맵식) */
#cbp-hrmenu-btm.gtmn .gtmn_grp{ padding:16px var(--gtmn-pad) 6px; }
#cbp-hrmenu-btm.gtmn .gtmn_gt{
  display:inline-flex; align-items:center; gap:7px; margin-bottom:10px;
  font-family:var(--gtmn-font-b); font-weight:700; font-size:calc(var(--gtmn-fs) * .82); letter-spacing:-.02em; color:var(--gtmn-fg);
}
#cbp-hrmenu-btm.gtmn a.gtmn_gt::after{ content:""; width:6px; height:6px; border:solid var(--gtmn-mut); border-width:1.5px 1.5px 0 0; transform:rotate(45deg); }
#cbp-hrmenu-btm.gtmn .gtmn_grp.is_on .gtmn_gt{ color:var(--gtmn-acc); }
#cbp-hrmenu-btm.gtmn .gtmn_grp > ul{ display:flex; flex-wrap:wrap; gap:7px; }
#cbp-hrmenu-btm.gtmn .gtmn_chip{
  display:inline-flex; align-items:center; min-height:36px; padding:6px 14px;
  border:1px solid var(--gtmn-line2); border-radius:var(--gtmn-brad); background:var(--gtmn-card);
  font-size:calc(var(--gtmn-fs2) * .92); line-height:1.3; color:var(--gtmn-fg2);
}
#cbp-hrmenu-btm.gtmn.bt_soft .gtmn_chip,
#cbp-hrmenu-btm.gtmn.bt_ghost .gtmn_chip{ border-color:transparent; background:var(--gtmn-chip); }
#cbp-hrmenu-btm.gtmn .gtmn_chip.is_on{ border-color:var(--gtmn-pri-bg); background:var(--gtmn-pri-bg); color:var(--gtmn-pri-fg); font-family:var(--gtmn-font-b); font-weight:700; }

/* ── 8. 항목 스타일(it_) — 아코디언·단계이동 목록 ─────────── */
/* 구분선 (지금 쓰는 모양) */
#cbp-hrmenu-btm.gtmn.it_line .gtmn_list > .gtmn_li + .gtmn_li{ border-top:1px solid var(--gtmn-line); }
#cbp-hrmenu-btm.gtmn.it_line .gtmn_sub{ background:var(--gtmn-sub); }
#cbp-hrmenu-btm.gtmn.it_line .gtmn_sub > ul{ padding-top:8px; }
#cbp-hrmenu-btm.gtmn.it_line .gtmn_sub > ul::before{
  content:""; position:absolute; top:13px; bottom:19px; left:calc(var(--gtmn-pad) + 4px); width:1px; background:var(--gtmn-line2);
}
/* 여백형 — 선 없이 숨 쉬는 목록 */
#cbp-hrmenu-btm.gtmn.it_plain .gtmn_list{ padding:4px 0; }
#cbp-hrmenu-btm.gtmn.it_plain .gtmn_a{ padding-top:calc(var(--gtmn-ip) * .78); padding-bottom:calc(var(--gtmn-ip) * .78); }
#cbp-hrmenu-btm.gtmn.it_plain .gtmn_sub{ --gtmn-sbx:calc(var(--gtmn-pad) + 1px); }
#cbp-hrmenu-btm.gtmn.it_plain .gtmn_sub .gtmn_sa::before{
  content:""; position:absolute; left:calc(var(--gtmn-pad) + 2px); top:50%; width:6px; height:1.5px; margin-top:-.75px;
  border-radius:1px; background:currentColor; opacity:.45;
}
/* 카드 — 대메뉴 하나가 카드 한 장 */
#cbp-hrmenu-btm.gtmn.it_card{ --gtmn-arx:25px; }
#cbp-hrmenu-btm.gtmn.it_card .gtmn_list{ display:grid; gap:8px; padding:2px var(--gtmn-pad) 4px; }
#cbp-hrmenu-btm.gtmn.it_card .gtmn_list > .gtmn_li{
  border:1px solid var(--gtmn-line2); border-radius:var(--gtmn-rad); background:var(--gtmn-card); overflow:hidden;
  transition:border-color .25s ease, box-shadow .25s ease; --gtmn-mkx:7px;
}
#cbp-hrmenu-btm.gtmn.it_card .gtmn_list > .gtmn_li.is_open{ border-color:var(--gtmn-acc); box-shadow:0 8px 20px rgba(0,0,0,.06); }
#cbp-hrmenu-btm.gtmn.it_card .gtmn_a{ padding-left:18px; }
#cbp-hrmenu-btm.gtmn.it_card .gtmn_li:not(.has_sub) > .gtmn_row .gtmn_a{ padding-right:18px; }
#cbp-hrmenu-btm.gtmn.it_card .gtmn_arr{ width:50px; }
#cbp-hrmenu-btm.gtmn.it_card .gtmn_sub{ --gtmn-sbx:19px; }
#cbp-hrmenu-btm.gtmn.it_card .gtmn_sub > ul{ padding:0 0 12px; }
#cbp-hrmenu-btm.gtmn.it_card .gtmn_sub .gtmn_sa{ padding-left:34px; padding-right:18px; }
#cbp-hrmenu-btm.gtmn.it_card .gtmn_sub .gtmn_sa::before{
  content:""; position:absolute; left:20px; top:50%; width:4px; height:4px; margin-top:-2px; border-radius:50%; background:currentColor; opacity:.4;
}
/* 번호 — 01 · 02 에디토리얼 */
#cbp-hrmenu-btm.gtmn.it_num .gtmn_list{ counter-reset:gtmn; }
#cbp-hrmenu-btm.gtmn.it_num .gtmn_list > .gtmn_li{ counter-increment:gtmn; }
#cbp-hrmenu-btm.gtmn.it_num .gtmn_list > .gtmn_li + .gtmn_li{ border-top:1px solid var(--gtmn-line); }
#cbp-hrmenu-btm.gtmn.it_num .gtmn_a{ font-size:calc(var(--gtmn-fs) * 1.15); letter-spacing:-.035em; }
#cbp-hrmenu-btm.gtmn.it_num .gtmn_a::before{
  content:counter(gtmn, decimal-leading-zero); display:inline-block; min-width:2.2em;
  font-size:.52em; letter-spacing:0; vertical-align:.5em; color:var(--gtmn-acc);
}
#cbp-hrmenu-btm.gtmn.it_num .gtmn_sub{ --gtmn-sbx:calc(var(--gtmn-pad) + var(--gtmn-fs) * 1.32 - 12px); }
#cbp-hrmenu-btm.gtmn.it_num .gtmn_sub .gtmn_sa{ padding-left:calc(var(--gtmn-pad) + var(--gtmn-fs) * 1.32); }

/* ── 9. 펼침 아이콘(ar_) ─────────────────────────────────── */
#cbp-hrmenu-btm.gtmn .gtmn_arr::before,
#cbp-hrmenu-btm.gtmn .gtmn_arr::after{ content:""; position:absolute; top:50%; left:var(--gtmn-arx); transition:transform .3s var(--gtmn-ease), background-color .2s, border-color .2s; }
/* 꺾쇠 */
#cbp-hrmenu-btm.gtmn.ar_chevron .gtmn_arr::before{
  width:8px; height:8px; margin:-6px 0 0 -4px; border:solid currentColor; border-width:0 2px 2px 0; transform:rotate(45deg);
}
#cbp-hrmenu-btm.gtmn.ar_chevron .gtmn_li.is_open > .gtmn_row .gtmn_arr::before{ transform:translateY(4px) rotate(-135deg); }
/* 플러스 → 마이너스 */
#cbp-hrmenu-btm.gtmn.ar_plus .gtmn_arr::before{ width:14px; height:2px; margin:-1px 0 0 -7px; border-radius:2px; background:currentColor; }
#cbp-hrmenu-btm.gtmn.ar_plus .gtmn_arr::after { width:2px; height:14px; margin:-7px 0 0 -1px; border-radius:2px; background:currentColor; }
#cbp-hrmenu-btm.gtmn.ar_plus .gtmn_li.is_open > .gtmn_row .gtmn_arr::before{ transform:rotate(180deg); }
#cbp-hrmenu-btm.gtmn.ar_plus .gtmn_li.is_open > .gtmn_row .gtmn_arr::after { transform:rotate(90deg) scaleY(0); }
/* 원형 — 원(::before) 위에 꺾쇠(::after) */
#cbp-hrmenu-btm.gtmn.ar_circle .gtmn_arr::before{ width:30px; height:30px; margin:-15px 0 0 -15px; border-radius:50%; background:var(--gtmn-chip); }
#cbp-hrmenu-btm.gtmn.ar_circle .gtmn_arr::after { width:7px; height:7px; margin:-5px 0 0 -3.5px; border:solid currentColor; border-width:0 1.8px 1.8px 0; transform:rotate(45deg); }
#cbp-hrmenu-btm.gtmn.ar_circle .gtmn_li.is_open > .gtmn_row .gtmn_arr::before{ background:var(--gtmn-pri-bg); }
#cbp-hrmenu-btm.gtmn.ar_circle .gtmn_li.is_open > .gtmn_row .gtmn_arr::after { border-color:var(--gtmn-pri-fg); transform:translateY(3px) rotate(-135deg); }
/* 단계이동은 늘 오른쪽 꺾쇠 (PHP 가 ar_chevron 으로 강제한다 — 이 절은 9절 뒤에 있어야 한다) */
#cbp-hrmenu-btm.gtmn.mn_drill .gtmn_arr::before{ margin:-4px 0 0 -6px; transform:rotate(-45deg); }

/* ── 10. 현재 위치 표시(mk_) — 8절(항목)보다 뒤에 있어야 한다 ── */
#cbp-hrmenu-btm.gtmn.mk_bar .gtmn_li.is_on > .gtmn_row::before{
  content:""; position:absolute; left:var(--gtmn-mkx); top:50%; width:3px;
  height:calc(var(--gtmn-fs) * .95); margin-top:calc(var(--gtmn-fs) * -.475); border-radius:3px; background:var(--gtmn-acc);
}
#cbp-hrmenu-btm.gtmn.mk_bar .gtmn_sa.is_on::before{
  content:""; position:absolute; left:var(--gtmn-sbx); top:50%; width:3px; height:1.05em; margin-top:-.525em;
  border-radius:3px; background:var(--gtmn-acc); opacity:1;
}
#cbp-hrmenu-btm.gtmn.mk_dot .gtmn_li.is_on > .gtmn_row .gtmn_t::after,
#cbp-hrmenu-btm.gtmn.mk_dot .gtmn_sa.is_on .gtmn_t::after{
  content:""; display:inline-block; width:6px; height:6px; margin-left:7px; border-radius:50%; background:var(--gtmn-acc); vertical-align:.3em;
}
#cbp-hrmenu-btm.gtmn.mk_bg .gtmn_li.is_on > .gtmn_row .gtmn_t,
#cbp-hrmenu-btm.gtmn.mk_bg .gtmn_sa.is_on .gtmn_t{
  margin-left:-.5em; padding:.12em .5em; border-radius:.55em; background:var(--gtmn-soft);
  -webkit-box-decoration-break:clone; box-decoration-break:clone;
}

/* ── 11. 하단 정보 ───────────────────────────────────────── */
#cbp-hrmenu-btm.gtmn .gtmn_foot{ margin-top:6px; padding:22px var(--gtmn-pad) 26px; background:var(--gtmn-sub); border-top:1px solid var(--gtmn-line); }
#cbp-hrmenu-btm.gtmn .gtmn_ftel{ display:inline-flex; align-items:center; gap:8px; font-family:var(--gtmn-font-b); font-weight:700; font-size:21px; line-height:1.3; color:var(--gtmn-fg); }
#cbp-hrmenu-btm.gtmn .gtmn_ftel .gtmn_qi{ color:var(--gtmn-acc); }
#cbp-hrmenu-btm.gtmn .gtmn_faddr{ margin-top:5px; }
#cbp-hrmenu-btm.gtmn .gtmn_faddr span{ display:block; font-size:12px; line-height:1.65; color:var(--gtmn-mut); }
#cbp-hrmenu-btm.gtmn .gtmn_sns{ display:flex; flex-wrap:wrap; gap:8px; margin-top:14px; }
#cbp-hrmenu-btm.gtmn .gtmn_sns a{
  display:flex; align-items:center; justify-content:center; width:34px; height:34px;
  border:1px solid var(--gtmn-line2); border-radius:50%; background:var(--gtmn-card);
}
#cbp-hrmenu-btm.gtmn .gtmn_sns img{ width:17px; height:17px; object-fit:contain; filter:grayscale(1); opacity:.7; }
#cbp-hrmenu-btm.gtmn.sf_dark .gtmn_sns img,
#cbp-hrmenu-btm.gtmn.sf_point .gtmn_sns img{ filter:grayscale(1) brightness(2.2); opacity:.8; }

/* ── 12. 포커스 · 등장 효과 · 동작 줄이기 · 500px ─────────── */
#cbp-hrmenu-btm.gtmn a:focus,
#cbp-hrmenu-btm.gtmn button:focus{ outline:none; }
#cbp-hrmenu-btm.gtmn a:focus-visible,
#cbp-hrmenu-btm.gtmn button:focus-visible{ outline:none; box-shadow:inset 0 0 0 2px var(--gtmn-acc); border-radius:8px; }
#cbp-hrmenu-btm.gtmn .gtmn_x:focus-visible{ border-radius:50%; }

@keyframes gtmnIn{ from{ opacity:0; transform:translate3d(0,12px,0); } to{ opacity:1; transform:none; } }
@keyframes gtmnFade{ from{ opacity:0; } to{ opacity:1; } }
#cbp-hrmenu-btm.gtmn.fx_stagger.active .gtmn_stg{
  animation:gtmnIn .5s var(--gtmn-ease) both;
  animation-delay:calc(var(--i, 0) * 38ms + 110ms);
}

@media (prefers-reduced-motion: reduce){
  #cbp-hrmenu-btm.gtmn,
  #cbp-hrmenu-btm.gtmn *,
  #cbp-hrmenu-btm.gtmn *::before,
  #cbp-hrmenu-btm.gtmn *::after{ transition-duration:1ms !important; animation:none !important; }
}

/* ============================================================
 * 온웹 휴대폰 기준선 500px
 * ------------------------------------------------------------
 * [2026-09] 글자·좌우 여백을 500px 이하에서 줄인다. 서랍(drawer_l·
 * drawer_r)은 뺀다 — 서랍 폭이 이미 화면 폭의 비율(--gtmn-w)로 정해져
 * 좁은 화면에서 스스로 줄어들고 있어서, 안쪽 글자까지 더 줄이면
 * 오히려 좁은 서랍 안 글자가 지나치게 작아진다.
 *
 * --gtmn-fs/-fs2/-pad 는 gt_mnav.php 가 인라인으로 내려보내므로
 * (위 "0. 루트 레이어"에서 --gtmn-*-base 로 받는다) 이 미디어쿼리가
 * 인라인을 이기려면 반드시 그 "받는 자리"(--gtmn-pad: var(--gtmn-pad-base,…))
 * 를 다시 선언해야 한다 — .gtmn_a 같은 소비처를 직접 겨눠도 소용없다.
 * ============================================================ */
@media all and (max-width:500px){
  #cbp-hrmenu-btm.gtmn:not(.ly_drawer_l):not(.ly_drawer_r){
    --gtmn-fs:calc(var(--gtmn-fs-base, 20px) * .87);
    --gtmn-fs2:calc(var(--gtmn-fs2-base, 16px) * .92);
    --gtmn-pad:calc(var(--gtmn-pad-base, 22px) * .8);
  }
  #cbp-hrmenu-btm.gtmn .gtmn_btns{ gap:4px; }
  #cbp-hrmenu-btm.gtmn .gtmn_btn{ height:30px; padding:0 10px; font-size:11.5px; }
  #cbp-hrmenu-btm.gtmn.tp_hero .gtmn_hero .gtmn_btn{ height:30px; padding:0 11px; }
  #cbp-hrmenu-btm.gtmn .gtmn_ftel{ font-size:19px; }
  #cbp-hrmenu-btm.gtmn .gtmn_split{ --gtmn-tabw:104px; }
}

