@charset "UTF-8";

:root{
  /* 서브 페이지 폰트 컬러 */
  --sub-font-color:#222;

  /* 솔루션 전용 */
  --sol-maxw:1184px;
  --sol-gap:28px;
  --sol-radius:14px;
  --sol-shadow:0 10px 28px rgba(0,0,0,.08);
  --sol-ink:#222;
  --sol-ink-dim:#6a768e;
  --sol-line:#e7ecf5;
  --sol-primary:var(--primary);
  --sol-primary-ink:#1C64FF;
  --sol-chip-bg:#f8faff;
  --sol-badge:#111;

  /* 노트(카드) */
  --note-gap:16px;
  --note-radius:16px;
  --note-line:#E7ECF5;
  --note-shadow:0 10px 28px rgba(0,0,0,.06);
  --note-title:#0B1222;
  --note-body:#5C667A;
  --note-meta:#98A1A7;
  --note-insight-bg:#1C64FF;
  --note-insight-ink:#fff;
  --note-solution-bg:#FFA41C;
  --note-solution-ink:#fff;

  /* 산업(인사이트) */
  --ind-hero-h:300px;
  --ind-gap:56px;

  /* NAV 3-DEPTH */
  --nav3-max:1184px;
  --nav3-ink:#2878ff;
  --nav3-ink-text:#1C64FF;
  --nav3-inkbar-h:2px;
  --nav3-gap-x:28px;
  --nav3-d2-gap:20px;
  --nav3-ink-tri:6px;
  --nav3-ink-tri-offset:13px;
  --nav3-bg:#fff;
}
.sub{ background:var(--bg-sub); color:var(--sub-font-color); }
.sub .header{ background:var(--bg-sub); backdrop-filter:none; border-bottom:1px solid #BED0FE}
.sub .header .icons svg rect{ fill:#2C2E2F; }
.sub .header .icons svg.gnb-search rect{ stroke:#2C2E2F; }
.sub .header .icons svg circle{ stroke:#2C2E2F; }

/* 서브 GNB 오버레이 */
.sub .svc-overlay { border-top:none!important;}
.sub #svcOverlay, .sub .svc-wrap { background-color: #fff!important;}
.sub .svc-acc{ color:#2C2E2F!important;}
.sub .svc-body ul li a { color:#2C2E2F!important;}
.sub .svc-body ul li a:hover { color:#1C64FF!important;}
.sub .svc-body .svc-grid .svc-panel li a {color:#5374be!important;}
.sub .svc-body .svc-grid .svc-panel li a:hover {color:#5374be!important;}

/* 서브 페이지 모바일 헤더 */
.sub-header{ background:var(--bg-sub); backdrop-filter:none;}
.sub-header { display:none; position:fixed; width:100%;top:0; z-index:50; border-bottom:1px solid #EEF0F4 }
.sub-header .bar{display:flex; align-items:center; width:100%;height:72px;}
.sub-header .bar .logo { flex:1;display:flex;align-items:center;padding-left:22px;}
.sub-header .bar .logo span { font-size:20px;font-weight:700;margin-left:11px;}

.sub-header .location { padding-left:32px; font-size:20px; font-weight:700; letter-spacing:-1px; flex:1 }
.sub-header .icons { display:flex;column-gap:16px;padding-right:22px;position:relative;}
.sub-header .icons a { line-height: 1 }
.sub-header .icons a svg, .sub-header .icons a img { width:22px;height:22px;}

/* ========== content 공통(색/카드/버튼/칩) ========== */
.main-content{position:relative;overflow:hidden;margin-top:90px}
.content-section{ color:var(--sol-ink); }
.content-section *{ box-sizing:border-box; }
.content-section .wrap, .content-section .caption{ width:min(var(--sol-maxw),92vw); margin:0 auto; }

.content-section h2.section-title{ font-size:28px; line-height:1.25; letter-spacing:.2px; margin:80px 0 18px; }
.content-section p.lead{ color:var(--sol-ink-dim); font-size:14px; }
.content-section .card{ background:#fff; border:1px solid var(--sol-line); border-radius:var(--sol-radius); box-shadow:var(--sol-shadow); }
.content-section .btn{
  display:inline-flex; align-items:center; justify-content:center; gap:8px;
  height:38px; padding:0 14px; border-radius:999px; font-weight:700; font-size:14px;
  border:1px solid var(--sol-primary); color:#fff; background:var(--sol-primary);
}
.content-section .btn.secondary{ color:var(--sol-primary); background:#EDF4FF; border-color:#CFE0FF; }
.content-section .chips{ display:flex; flex-wrap:wrap; gap:8px; }
.content-section .chip{ background:var(--sol-chip-bg); border:1px solid var(--sol-line); padding:8px 12px; border-radius:8px; font-size:12px; color:#3a4a6a; }
.content-section p strong, .content-section p b{ font-weight:700; }

/* ========== Hero ========== */
.hero{
  position:relative; overflow:hidden; margin-top:0;
  height:360px; color:#fff; display:flex; align-items:center; border-radius:0;
  background-repeat:no-repeat; background-size:cover; background-position:center;
}
.hero .inner .sup{ font-size:56px; font-weight:250; line-height:1.3 }
.hero .inner .title{ font-size:56px; font-weight:700; line-height:1.3 }
.hero .inner .desc{ font-size:18px; font-weight:400; margin-top:32px }

/* Caption entrance animation */
.hero .caption{position:absolute; inset-inline:0; top:50%; transform:translateY(-50%);}    
.hero .caption .sup, .caption .title, .caption .desc{opacity:0; transform:translateY(14px); transition:opacity .6s ease, transform .6s ease}
.hero.loaded .caption .sup{opacity:1; transform:none; transition-delay:.05s}
.hero.loaded .caption .title{opacity:1; transform:none; transition-delay:.18s}
.hero.loaded .caption .desc{opacity:1; transform:none; transition-delay:.32s}

/* ========== 서브 메뉴 ========== */
.mds-submenu{ width:100%; background-color: #EEF0F4; user-select:none;transition: top 0.2s ease;}
.mds-submenu__wrap{ height:72px; margin:0 auto; padding-top:25px; display:flex; justify-content:center }
.mds-submenu__wrap nav{ margin-left:unset }
.mds-submenu__wrap-cont{ width:100%; max-width:1184px; padding-bottom:10px; margin-bottom:10px }
.mds-submenu__wrap-list{ display:flex; flex-wrap:wrap; gap:28px; list-style:none; margin:0; padding:0; justify-content:space-between }
.mds-submenu__wrap-item{ position:relative; flex:1; text-align: center }
.mds-submenu__wrap-link{
  display:inline-block; white-space:nowrap; cursor:pointer; font-weight:700; font-size:18px; line-height:1.2; letter-spacing:-.03em;
  color:#2A2F39; transition:color .15s ease;
}
.mds-submenu__wrap-link:hover, .mds-submenu__wrap-link:focus{ color:var(--nav3-ink-text); outline:none }
.mds-submenu__wrap-item.is-active .mds-submenu__wrap-link{ color:var(--nav3-ink-text) }
.mds-submenu__wrap-item.is-active::after{ content:""; position:absolute; left:0; right:0; bottom:-21px; height:4px; background:var(--nav3-ink) }
.mds-submenu-placeholder { display:none;height:0;transition: top 0.2s ease;}
.mds-submenu.fixed { position:fixed;top:90px;z-index:10;}
.mds-submenu.fixed + .mds-submenu-placeholder { display:block;height:72px;}

.sr-only{ position:absolute; left:-10000px; top:auto; width:1px; height:1px; overflow:hidden }

footer{
  background:#fff; padding:120px 0; color:#9EA3AC; font-size:14px;
}
footer .inner{ width: 100%; max-width:1184px; margin:0 auto; padding:0 16px }
footer .btn-wrap{ display:flex; column-gap:8px }
footer .btn-wrap a{ display:block; background:#9EA3AC; border-radius:999px; padding:4px 16px; font-size:14px; color:#fff }
footer .company-info-wrap{ margin-top:32px }
footer .company-name{ font-size:16px; font-weight:700 }
footer .company-info{ margin-top:6px; font-size:14px }
footer .separator{ display:inline-block; width:1px; height:11px; margin:-1px 2px; background:#9EA3AC }
footer .privacy-link{ margin-top:20px }
footer .privacy-link span:first-child a{ font-weight:700 }
footer .sns-link-wrap{ display:flex; margin-top:24px; column-gap:8px }
footer .sns-link-wrap li img{ width:40px }
._mob-view { display:none!important; }
._pc-view { display:block!important; }
._pc-view.flex { display:flex!important; }
._pc-view.block { display:block!important; }
._pc-view.inline-block { display:inline-block!important; }

/* ========== 모바일(<=768px) ========== */
@media (max-width:768px){
  .header { display:none }
  .sub-header { display:block }
  .main-content{ margin-top: calc(73px + var(--mob-combos-h, 60px)); }
  .etc .main-content{ margin-top: calc(73px + var(--mob-combos-h, 0px)); }

  /* NAV 3-DEPTH: 데스크톱 숨김, 모바일 셀렉트 표시 */
  .mds-nav3__wrap{ display:none }
  .mds-nav3__mobile{ display:grid; grid-template-columns:1fr }

  /* Hero/Intro 타이포 축소 */
  .content-section .hero{ height:360px }
  .content-section .hero .inner .sup,
  .content-section .hero .inner .title{ font-size:24px }
  .content-section .hero .inner .desc{ font-size:16px }

  /* Footer */
  footer{ padding:64px 0 }
  footer .btn-wrap{ flex-wrap:wrap; row-gap:8px }
  footer .company-info br{ display:none }
  ._mob-view { display:block!important }
  ._mob-view.block{ display:block!important }
  ._mob-view.flex{ display:flex!important }
  ._mob-view.inline-block{ display:inline-block!important }
  ._pc-view { display:none!important; }
  ._pc-view.flex { display:none!important; }
  ._pc-view.inline-block { display:none!important; }
}

/* [REVEAL-PRELOAD] 초기 페인트 잔상 제거 */
html.reveal-preload .title-container .page-title,
html.reveal-preload .title-container .page-desc,
html.reveal-preload .content-section > section:not(.mds-submenu),
html.reveal-preload .list-container .list-item{
  opacity:0 !important;
  transform:translateY(var(--reveal-offset,18px)) !important;
  visibility:hidden; /* 클릭도 방지 */
}
/* reveal 클래스로 전환되면 다시 상호작용 가능 */
.reveal{ visibility:visible; }
/* 접근성: 모션 최소화 환경에선 숨기지 않음(즉시 노출) */
@media (prefers-reduced-motion:reduce){
  html.reveal-preload .title-container .page-title,
  html.reveal-preload .title-container .page-desc,
  html.reveal-preload .content-section > section:not(.mds-submenu),
  html.reveal-preload .list-container .list-item{
    opacity:1 !important; transform:none !important; visibility:visible !important;
  }
}
/* [MOTION] 공통 리빌(슬라이드업+페이드인) */
:root{
  /* 최초 모션 딜레이(전역). 예: .14s → 140ms */
  --reveal-base-delay:.14s;
  --reveal-dur:.6s;
  --reveal-ease:cubic-bezier(.2,.8,.2,1);
  --reveal-offset:18px;
}
.reveal{
  opacity:0;
  transform:translateY(var(--reveal-offset));
  transition:
    opacity var(--reveal-dur) var(--reveal-ease),
    transform var(--reveal-dur) var(--reveal-ease);
}
.reveal.is-visible{
  opacity:1;
  transform:none;
}
/* 접근성: 모션 최소화 환경에서는 즉시 노출 */
@media (prefers-reduced-motion:reduce){
  .reveal{transition:none; transform:none; opacity:1!important}
}

/* ========== Element Plus 커스텀 ========== */
.el-select__wrapper {
  height:100%;
  font-size:16px!important;
  border:1px solid #E4EAF5;
  background-color:#F3F5F9;
  box-shadow:none;
  color:#000;
}
.el-select__wrapper.is-focused, .el-select__wrapper.is-hovering {
  outline:none;
  box-shadow:none!important;
  border:1px solid #BED0FE;
}
.el-select__tags-text {
  font-size:14px!important;
}
.el-tag.el-tag--info {
  background-color: #dee0e5;
  font-size:14px!important;
  padding: 16px 5px 16px 8px;
}

.el-cascader .el-input__wrapper {
  height:50px;
  font-size:16px!important;
  border:1px solid #E4EAF5;
  background-color:#F3F5F9;
  box-shadow:none;
  color:#000;
}
.el-cascader .el-input__wrapper.is-focused, .el-cascader .el-input__wrapper.is-hovering {
  outline:none;
  box-shadow:none!important;
  border:1px solid #BED0FE;
}
.el-cascader input.el-input__inner {
  background-color: unset!important;
  border:none!important;
  padding:unset!important;
}

/* ===== [MOBILE] Combo Navigation (custom) ===== */
.mob-combos{ display:none; }
.mob-combos__stack{ display:none;}

@media (max-width:768px){
  /* 콤보바 강제 표시 */
  #mobCombos.mob-combos{
    display:block !important;
    position:fixed;
    left:0; right:0;
    top:72px;
    background:#EEF0F4;
    z-index:40 !important;
  }

  /* ===== 1열 (L1+L2) ===== */
  #mobCombos .mob-combos__row{
    display:flex;
    width:100%;
    position:relative;
    border-bottom:1px solid #DDE0E8;
    z-index:2005; /* dim(1990)보다 위 */
  }
  #mobCombos .mob-combo{
    position:relative;
    height:60px;
    min-width:0;
  }
  #mobCombos .mob-combo--l1{ flex:0 0 155px; width:155px; }
  #mobCombos .mob-combo--l2{ flex:1 1 auto; }

  /* 버튼 공통 */
  #mobCombos .mob-combo__btn{
    width:100%;
    height:60px;
    padding:0 24px 0 16px;
    border:0;
    background:#EEF0F4;
    color:#2A2F39;
    font-size:18px;
    font-weight:700;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    cursor:pointer;
  }
  #mobCombos .mob-combo--l1 .mob-combo__btn,
  #mobCombos .mob-combo--l2 .mob-combo__btn{
    border-right:1px solid rgba(0,0,0,.06);
  }
  #mobCombos .mob-combo--l2 .mob-combo__btn{ border-right:0; }

  #mobCombos .mob-combo__value{
    flex:1 1 auto;
    min-width:0;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    text-align:left;
  }

  /* 화살표 */
  #mobCombos .mob-combo__chev{
    width:10px; height:6px; flex:0 0 10px;
    background-repeat:no-repeat;
    background-position:center;
    background-size:contain;
    transition:transform .18s ease;
    background-image:url('data:image/svg+xml;utf8,<svg width="10" height="6" viewBox="0 0 10 6" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1.7041 0.292969C1.31367 -0.0976517 0.681442 -0.0976522 0.291016 0.292969C-0.0993862 0.683592 -0.0994034 1.31642 0.291016 1.70703L4.29004 5.70801C4.38771 5.80573 4.50065 5.87891 4.62109 5.92773C4.68112 5.95209 4.74281 5.97119 4.80566 5.9834C4.90026 6.00174 4.99711 6.00624 5.09277 5.99707C5.31594 5.97577 5.53321 5.87899 5.7041 5.70801L9.70312 1.70703C10.0935 1.31642 10.0935 0.683594 9.70312 0.292969C9.3127 -0.0976461 8.68047 -0.0976334 8.29004 0.292969L4.99707 3.58594L1.7041 0.292969Z" fill="%232A2F39"/></svg>');
  }
  #mobCombos .mob-combo.is-open .mob-combo__chev{ transform:rotate(180deg); }

  /* ===== Dim (페이지 딤) ===== */
  #mobComboDim.mob-combo-dim{
    position:fixed; left:0; right:0; top:0; bottom:0;
    z-index: 5 !important;
    background:rgba(0,0,0,.35);
    opacity:0;
    transition:opacity .18s ease;
  }
  #mobComboDim.mob-combo-dim.is-on{ opacity:1; }
  body.mobcombo-locked{ overflow:hidden; }

  /* ===== Drawer Panel ===== */
  #mobCombos .mob-combo__panel{
    position:absolute;
    left:0; right:0; top:60px;
    z-index:2020 !important; /* cover보다 위 */
    overflow:hidden;
    background:#EEF0F4;
    max-height:0;
    transform:translateY(-14px);
    transition:max-height .26s ease, transform .22s ease;
    will-change:max-height, transform;
    box-shadow:0 14px 28px rgba(0,0,0,.12);
  }
  #mobCombos .mob-combo.is-open .mob-combo__panel{
    max-height:420px;
    transform:translateY(0);
  }

  #mobCombos .mob-combo__list{
    list-style:none;
    margin:0;
    max-height:420px;
    overflow:auto;
    -webkit-overflow-scrolling:touch;
  }
  #mobCombos .mob-combo__opt{
    height:60px;
    line-height:60px;
    padding:0 16px;
    align-items:center;
    font-size:16px;
    font-weight:700;
    color:#2A2F39;
    cursor:pointer;
    user-select:none;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  #mobCombos .mob-combo__opt[aria-selected="true"]{ background:#DDE8FF; }
  .mob-combo__opt.is-placeholder{ display:none !important; }

  /* ===== Biz Stack (L3/L4 영역) ===== */
  #mobCombos .mob-combos__stack{
    padding:0 16px 16px;
    padding-top:16px;
    display:grid;
    row-gap:16px;

    max-height:0;
    transform:translateY(-14px);
    transition:max-height .28s ease, transform .22s ease;
    will-change:max-height, transform;
    overflow:hidden;

    position:relative;
    background-color: #fff;
    z-index:2000; /* row(2005)보다 아래 */
  }
  #mobCombos .mob-combos__stack.is-open{
    max-height:260px;
    transform:translateY(0);
    overflow:visible;
  }

  /* L3/L4 버튼 스타일 */
  #mobCombos .mob-combo--l3 .mob-combo__btn{
    border-radius:8px;
    border:2px solid #1C64FF;
    background:#fff;
    color:#1C64FF;
  }
  #mobCombos .mob-combo--l4 .mob-combo__btn{
    border-radius:8px;
    border:0;
    background:#EEF0F4; 
    color:#1C64FF;
  }
  #mobCombos .mob-combo--l3.is-open .mob-combo__btn {
    border-bottom:none;
  }

  /* ===== 딤 규칙 =====
    - L1/L2는 항상 딤 제외
    - 기본: L3/L4는 살짝 딤
    - L3/L4 패널 열면 L3/L4 딤 제외
    - stack 상태(2Depth 선택 후 3/4가 노출된 상태)에서도 딤 제외
  */
  #mobCombos.is-overlay .mob-combo--l3 .mob-combo__btn,
  #mobCombos.is-overlay .mob-combo--l4 .mob-combo__btn{ opacity:.28; }

  #mobCombos.is-overlay .mob-combo--l1 .mob-combo__btn,
  #mobCombos.is-overlay .mob-combo--l2 .mob-combo__btn{ opacity:1 !important; }

  #mobCombos.is-overlay[data-open-depth="l3"] .mob-combo--l3 .mob-combo__btn,
  #mobCombos.is-overlay[data-open-depth="l3"] .mob-combo--l4 .mob-combo__btn,
  #mobCombos.is-overlay[data-open-depth="l4"] .mob-combo--l3 .mob-combo__btn,
  #mobCombos.is-overlay[data-open-depth="l4"] .mob-combo--l4 .mob-combo__btn{ opacity:1 !important; }

  /* ✅ stack 상태에서는 L3/L4 딤 금지 */
  #mobCombos.is-overlay[data-open-depth="stack"] .mob-combo--l3 .mob-combo__btn,
  #mobCombos.is-overlay[data-open-depth="stack"] .mob-combo--l4 .mob-combo__btn{
    opacity:1 !important;
  }

  /* ✅ 요청: L1/L2 패널 열릴 때, 스택까지 “가림판”으로 덮기(비침 방지) */
  #mobCombos.is-overlay[data-open-depth="l1"]::after,
  #mobCombos.is-overlay[data-open-depth="l2"]::after{
    content:"";
    position:absolute;
    left:0; right:0;
    top:60px;      /* L1/L2 버튼줄 아래부터 */
    bottom:0;      /* 콤보 전체 높이 끝까지 */
    /* background:#EEF0F4; */
    z-index:2002;  /* stack(2000) 위, panel(2020) 아래 */
    pointer-events:none;
  }

  /* ✅ L3/L4 스택은 본문 흐름에서 스크롤되도록 + 딤(40)보다 위 */
  #mobBizStack{
    position: relative;
    z-index: 41;            /* #mobCombos(40) 위, header(50) 아래 */
    background:#fff;
  }
  /* ✅ L1/L2 패널 열린 동안엔 스택(3/4Depth) 클릭 차단 */
  #mobCombos[data-open-depth="l1"] ~ .main-content #mobBizStack,
  #mobCombos[data-open-depth="l2"] ~ .main-content #mobBizStack{
    z-index: 0 !important;
    pointer-events:none !important;
  }

  /* ✅ L1/L2 패널이 열린 동안에는 아래 스택(3/4Depth) 클릭 차단 */
  #mobCombos[data-open-depth="l1"] #mobBizStack,
  #mobCombos[data-open-depth="l2"] #mobBizStack{
    pointer-events:none !important;
  }
  #mobCombos[data-open-depth="l1"] .mob-combo--l3 .mob-combo__btn,
  #mobCombos[data-open-depth="l1"] .mob-combo--l4 .mob-combo__btn,
  #mobCombos[data-open-depth="l2"] .mob-combo--l3 .mob-combo__btn,
  #mobCombos[data-open-depth="l2"] .mob-combo--l4 .mob-combo__btn{
    pointer-events:none !important;
  }

  #mobCombos[data-open-depth="l3"] #mobBizStack,
  #mobCombos[data-open-depth="l4"] #mobBizStack{
    max-height: none !important;     /* 스택 높이 제한 해제 */
    overflow: visible !important;     /* 내부 absolute 패널 클립 방지 */
  }

  /* ✅ FIX: L4 패널을 확실히 위로 */
  #mobCombos[data-open-depth="l4"] .mob-combo--l4 .mob-combo__panel{
    z-index: 2100 !important;
  }
  #mobCombos[data-open-depth="l3"] .mob-combo--l3 .mob-combo__panel{
    z-index: 2100 !important;
  }

  /* ---- 스택 컨테이너(3/4Depth) ---- */
  #mobBizStack.mob-combos__stack{
    padding:0 16px 16px;
    padding-top:16px;
    display:grid;
    row-gap:16px;

    max-height:0;
    transform:translateY(-14px);
    transition:max-height .28s ease, transform .22s ease;
    will-change:max-height, transform;
    overflow:hidden;

    position:relative;
    background:#fff;
    z-index: 10;
  }
  #mobBizStack.mob-combos__stack.is-open{
    max-height:260px;
    transform:translateY(0);
    overflow:visible;
  }

  /* ---- 스택 내부 콤보 공통(기존 #mobCombos .mob-combo 룰 대체) ---- */
  #mobBizStack .mob-combo{
    position:relative;
    height:60px;
    min-width:0;
  }

  #mobBizStack .mob-combo__btn{
    width:100%;
    height:60px;
    padding:0 24px 0 16px;
    border:0;
    background:#EEF0F4;
    color:#2A2F39;
    font-size:18px;
    font-weight:700;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:12px;
    cursor:pointer;
  }
  #mobBizStack .mob-combo__value{
    flex:1 1 auto;
    min-width:0;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
    text-align:left;
  }
  #mobBizStack .mob-combo__chev{
    width:10px; height:6px; flex:0 0 10px;
    background-repeat:no-repeat;
    background-position:center;
    background-size:contain;
    transition:transform .18s ease;
    background-image:url('data:image/svg+xml;utf8,<svg width="10" height="6" viewBox="0 0 10 6" fill="none" xmlns="http://www.w3.org/2000/svg"><path d="M1.7041 0.292969C1.31367 -0.0976517 0.681442 -0.0976522 0.291016 0.292969C-0.0993862 0.683592 -0.0994034 1.31642 0.291016 1.70703L4.29004 5.70801C4.38771 5.80573 4.50065 5.87891 4.62109 5.92773C4.68112 5.95209 4.74281 5.97119 4.80566 5.9834C4.90026 6.00174 4.99711 6.00624 5.09277 5.99707C5.31594 5.97577 5.53321 5.87899 5.7041 5.70801L9.70312 1.70703C10.0935 1.31642 10.0935 0.683594 9.70312 0.292969C9.3127 -0.0976461 8.68047 -0.0976334 8.29004 0.292969L4.99707 3.58594L1.7041 0.292969Z" fill="%232A2F39"/></svg>');
  }
  #mobBizStack .mob-combo--l3 .mob-combo__chev{
    width:12px; height:12px;
    background-image: url(/assets/app/img/select-arrow-2.svg) !important;
  }
  #mobBizStack .mob-combo--l4 .mob-combo__chev{
    width:12px; height:12px;
    background-image: url(/assets/app/img/select-arrow-3.svg) !important;
  }
  #mobBizStack .mob-combo.is-open .mob-combo__chev{ transform:rotate(180deg); }

  /* ---- 패널(드롭다운) ---- */
  #mobBizStack .mob-combo__panel{
    position:absolute;
    left:0; right:0; top:60px;
    z-index: 20 !important;
    overflow:hidden;
    background:#EEF0F4;
    max-height:0;
    /*transform:translateY(-14px);*/
    transition:max-height .26s ease, transform .22s ease;
    will-change:max-height, transform;
    box-shadow:0 14px 28px rgba(0,0,0,.12);
  }
  #mobBizStack .mob-combo--l3.is-open .mob-combo__panel{
    max-height:420px;
    border: 2px solid #1C64FF;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
    border-top-width:1px;
    background-color:#fff;
    color:#1C64FF;
    top:58px;
    transform:translateY(0);
  }
  #mobBizStack .mob-combo--l4.is-open .mob-combo__panel{
    max-height:420px;
    border-bottom-left-radius: 8px;
    border-bottom-right-radius: 8px;
    background-color:#EEF0F4;
    top:58px;
    transform:translateY(0);
  }
  #mobBizStack .mob-combo__list{
    list-style:none;
    margin:0;
    max-height:420px;
    overflow:auto;
    -webkit-overflow-scrolling:touch;
  }
  #mobBizStack .mob-combo__opt{
    height:60px;
    padding:0 16px;
    display:flex;
    align-items:center;
    font-size:16px;
    font-weight:700;
    color:#2A2F39;
    cursor:pointer;
    user-select:none;
    white-space:nowrap;
    overflow:hidden;
    text-overflow:ellipsis;
  }
  #mobBizStack .mob-combo__opt[aria-selected="true"]{ background:#DDE8FF; }
  #mobBizStack .mob-combo__opt.is-placeholder{ display:none !important; }

  #mobBizStack .mob-combo--l3 .mob-combo__opt{
    border-bottom:1px solid #1C64FF;
    color:#1C64FF;
  }

  /* ---- L3 / L4 버튼 톤 ---- */
  #mobBizStack .mob-combo--l3 .mob-combo__btn{
    border-radius:8px;
    border:2px solid #1C64FF;
    background:#fff;
    color:#1C64FF;
    transition-delay: .22s;
  }
  #mobBizStack .mob-combo--l3.is-open .mob-combo__btn{
    border-bottom:2px solid #fff;
    border-bottom-left-radius:0;
    border-bottom-right-radius:0;
    transition-delay: 0s;
  }
  #mobBizStack .mob-combo--l4 .mob-combo__btn{
    border-radius:8px;
    border:0;
    background:#EEF0F4;
    color:#1C64FF;
  }
  #mobBizStack .mob-combo--l4.is-open .mob-combo__btn{
    border-bottom-left-radius:0;
    border-bottom-right-radius:0;
    transition-delay: 0s;
  }
  /* ✅ 초기 렌더 전: 안 보이게 + 클릭 차단 */
  #mobCombos[data-ready="0"]{
    opacity:0;
    transform: translateY(-6px);
    pointer-events:none;
  }

  /* ✅ 렌더 완료: 자연스럽게 페이드인 */
  #mobCombos[data-ready="1"]{
    opacity:1;
    transform:none;
    pointer-events:auto;
    transition: opacity .22s ease, transform .22s ease;
  }

  /* (선택) 3/4Depth 스택도 페이드인 */
  #mobBizStack[data-ready="0"]{
    opacity:0;
    transform: translateY(-6px);
    pointer-events:none;
  }
  #mobBizStack[data-ready="1"]{
    opacity:1;
    transform:none;
    pointer-events:auto;
    transition: opacity .22s ease, transform .22s ease;
  }

  /* 접근성: 모션 줄이기면 즉시 표시 */
  @media (prefers-reduced-motion:reduce){
    #mobCombos[data-ready="1"],
    #mobBizStack[data-ready="1"]{
      transition:none;
    }
  }
}