/* 請與 header-11.html 一併載入：先 in_nav_2.css，再本檔 + in_nav_11_flyout / _mega / _mega_split.css */

:root {
  --h11-paper: var(--theme11-paper, #fcfbf8);
  --h11-paper-2: var(--theme11-paper, #ffffff);
  --h11-line: var(--theme11-line, #d8d0c2);
  --h11-text: var(--theme11-text, #2b251f);
  --h11-soft: var(--theme11-soft, #6f6358);
  --h11-primary: var(--theme11-main, #3a3026);
  --h11-primary-weak: color-mix(in srgb, var(--theme11-main, #3a3026) 12%, transparent);
  --h11-shadow: 0 8px 22px color-mix(in srgb, var(--theme11-text, #2b251f) 8%, transparent);
  --ab11-banner-content-gap: clamp(40px, 6vw, 72px);
  --v11-focus-ring: 0 0 0 3px color-mix(in srgb, var(--theme11-main, #4e8e8b) 28%, transparent);
}

.v11-skip-link {
  position: absolute;
  left: -9999px;
  top: auto;
  width: 1px;
  height: 1px;
  overflow: hidden;
  z-index: 100000;
  padding: 12px 20px;
  border-radius: var(--v11-radius);
  background: var(--theme11-main, #4e8e8b);
  color: var(--theme11-active-text, #fff);
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
}

.v11-skip-link:focus {
  left: 16px;
  top: 16px;
  width: auto;
  height: auto;
  overflow: visible;
  outline: none;
  box-shadow: var(--v11-focus-ring);
}

/* =========================
   v11：搜尋 Lightbox 精緻化
   ========================= */
.inpage_lightbox {
  background: rgba(21, 18, 14, 0.62);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);
}

.inpage_lightbox .mid {
  padding: 24px;
}

.inpage_lightbox .mid .close {
  top: clamp(20px, 3.2vw, 36px);
  right: clamp(20px, 3.2vw, 36px);
  width: 44px;
  height: 44px;
  border-radius: 999px;
  border: 1px solid rgba(255, 255, 255, 0.35);
  background-color: rgba(0, 0, 0, 0.24);
  padding: 0;
  margin: 0;
  cursor: pointer;
  transition: background-color 0.2s ease, border-color 0.2s ease;
}

.header-v11 .header-bar > .nav-toggle {
  appearance: none;
  border: 0;
  background: transparent;
  padding: 0;
  font: inherit;
  color: inherit;
  cursor: pointer;
}

.inpage_lightbox .mid .close:focus-visible {
  outline: none;
  box-shadow: var(--v11-focus-ring);
}

.inpage_lightbox .mid .close:hover {
  background-color: rgba(0, 0, 0, 0.4);
  border-color: rgba(255, 255, 255, 0.6);
}

.inpage_lightbox .mid .box {
  width: min(760px, 92vw);
  border: 1px solid rgba(255, 255, 255, 0.26);
  border-radius: 16px;
  background: rgba(44, 36, 28, 0.72);
  box-shadow: 0 24px 48px rgba(0, 0, 0, 0.35);
  padding: clamp(16px, 2.6vw, 24px);
}

.inpage_lightbox .mid .box form input {
  height: 58px;
  font-size: clamp(16px, 1.8vw, 22px);
  border: 1px solid rgba(255, 255, 255, 0.25);
  border-radius: 12px;
  background: rgba(255, 255, 255, 0.08);
  padding: 0 66px 0 16px;
  color: #fff;
}

.inpage_lightbox .mid .box form input::placeholder {
  color: rgba(255, 255, 255, 0.72);
}

.inpage_lightbox .mid .box form input:focus {
  border-color: rgba(255, 255, 255, 0.58);
  background: rgba(255, 255, 255, 0.12);
}

.inpage_lightbox .mid .box form button {
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.1);
  transition: background-color 0.2s ease;
}

.inpage_lightbox .mid .box form button:hover {
  background: rgba(255, 255, 255, 0.2);
}

.inpage_lightbox .mid .box form button div {
  width: 24px;
  height: 24px;
}

/* 桌機：搜尋按鈕靠輸入框內側固定間距 */
@media (min-width: 768px) {
  .inpage_lightbox .mid .box form button {
    right: 40px;
    width: 38px;
    height: 38px;
  }

  .inpage_lightbox .mid .box form button div {
    width: 24px;
    height: 24px;
  }
}

/* 行動版：按鈕縮小，避免貼邊或壓到輸入文字 */
@media (max-width: 767px) {
  .inpage_lightbox .mid .box form input {
    padding-right: 54px;
  }

  .inpage_lightbox .mid .box form button {
    right: 7vw;
    width: 34px;
    height: 34px;
    border-radius: 9px;
  }

  .inpage_lightbox .mid .box form button div {
    width: 20px;
    height: 20px;
  }
}

/* 覆蓋 in_nav_2 的 .inpage-header .header，改由 .header-bar 排版 */
.inpage-header .header.header-v11 {
  display: block;
  width: 100%;
  height: auto;
  padding: 0;
  box-sizing: border-box;
}

/* ========== 桌機：單一容器 .header-bar（對齊 in_nav_2 滿版頂列，非獨立卡片） ========== */
@media (min-width: 1024px) {
  .inpage-header .header.header-v11 {
    padding-left: clamp(20px, 6vw, 110px) !important;
    padding-right: clamp(20px, 6vw, 110px) !important;
  }

  /* 保留後台/主題設定的頂列底色，勿強制透明 */
  .inpage-header .header-v11 {
    max-width: 100% !important;
    margin-left: auto;
    margin-right: auto;
    padding: 0 clamp(20px, 6vw, 110px) !important;
    box-sizing: border-box;
  }

  .inpage-header .header-v11 .header-bar {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    gap: clamp(8px, 1.2vw, 20px);
    width: 100%;
    max-width: none;
    margin: 0;
    min-height: var(--height-nav-md);
    padding: 0;
    box-sizing: border-box;
    position: relative;
    z-index: 1;
    background: transparent;
    border: none;
    border-radius: 0;
    box-shadow: none;
  }

  .header-v11 .header-bar > .logo {
    /* 勿設 order>0：否則會排在預設 order:0 的 main_nav／top_block 之後 */
    flex: 0 0 auto;
    /* 套版網站需容納寬/高/方形 logo：給可伸縮區間，不鎖死 240px */
    max-width: clamp(140px, 24vw, 520px);
    min-width: 200px;
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    min-height: var(--height-nav-md);
    overflow: hidden;
    position: relative;
    z-index: 2;
  }

  .header-v11 .header-bar > .logo img {
    width: auto;
    height: auto;
    max-width: 100%;
    max-height: calc(var(--height-nav-md) - 10px);
    object-fit: contain;
    display: block;
    flex-shrink: 0;
  }

  /* 桌機單排：logo | 主選單（置中佔滿中間）| top_block */
  .header-v11 .header-bar > .main_nav.nav-horizontal {
    --h11-main-nav-pad-x: clamp(6px, 0.65vw, 14px);
    flex: 1 1 auto;
    width: auto !important;
    min-width: 0;
    max-width: none;
    display: flex !important;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: center;
    margin-top: 0;
    gap: 0;
    text-align: center;
    white-space: nowrap;
    /* 桌機有多層下拉選單，不能用 overflow: auto 否則會被裁切 */
    overflow: visible;
    -webkit-overflow-scrolling: touch;
    scrollbar-width: none;
    overscroll-behavior-x: contain;
    position: relative;
    z-index: 1;
    pointer-events: auto !important;
    /* 避免在某些情況被繼承為 0 導致文字消失 */
    font-size: 16px;
    line-height: var(--height-nav-md);
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal::-webkit-scrollbar {
    display: none;
  }

  /* 桌機下拉選單：原 in_nav_2 的 .nested_nav 會以 .inpage_nav 為參考；v11 改為以 .dropmenu 為參考 */
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu {
    position: relative;
  }

  .header-v11 .header-bar .nested_nav {
    left: 0 !important;
    top: var(--height-nav-md) !important;
    z-index: 50;
  }

  /* 第一層掛在 .dropmenu 底下時，改為緊貼選單下方（flyout 另於後段覆寫） */
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:not(.menu-mode-flyout):not([data-menu-mode="flyout"]):not(.h11-more-dropmenu):not(.menu-mode-mega):not([data-menu-mode="mega"]):not(.menu-mode-mega-split):not([data-menu-mode="mega-split"]) > .nested_nav {
    top: calc(100% + 2px) !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu.menu-mode-flyout > .nested_nav,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu[data-menu-mode="flyout"] > .nested_nav,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu.h11-more-dropmenu > .nested_nav {
    top: calc(50% + 0.65em + 16px) !important;
    margin-top: 0 !important;
    z-index: 160 !important;
  }

  /* 桌機預設收合：避免僅因主選單 .active 就把子選單整塊展開 */
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .nested_nav {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transform: translateY(4px) !important;
    transition: opacity 0.18s ease, transform 0.18s ease, visibility 0.18s ease !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu.menu-mode-flyout > .nested_nav,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu[data-menu-mode="flyout"] > .nested_nav,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu.h11-more-dropmenu > .nested_nav {
    transform: none !important;
    transition: opacity 0.18s ease, visibility 0.18s ease !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu.menu-mode-flyout > .nested_nav.active,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu[data-menu-mode="flyout"] > .nested_nav.active,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu.h11-more-dropmenu > .nested_nav.active {
    transform: none !important;
  }

  /*
   * 勿用 .dropmenu:hover 顯示子選單：滑到 a 時會先出現外層 nested_nav，
   * 但內層 ul 仍須 JS 加 .dsk-open，與滑到 .more 時不同步，看起來像「內容不一樣」。
   * 桌機統一只認 .nested_nav.active（由 inpage.js openV11Dropmenu 設定）。
   */
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .nested_nav.active {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu.menu-mode-flyout > .nested_nav.active,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu[data-menu-mode="flyout"] > .nested_nav.active,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu.h11-more-dropmenu > .nested_nav.active {
    transform: none !important;
  }

  .header-v11 .header-bar .nested_nav ul {
    z-index: 60;
  }

  .header-v11 .header-bar .nested_nav,
  .header-v11 .header-bar .nested_nav > ul,
  .header-v11 .header-bar .nested_nav ul,
  .header-v11 .header-bar .nested_nav ul.open,
  .header-v11 .header-bar .nested_nav ul ul,
  .header-v11 .header-bar .nested_nav ul ul.open {
    background: var(--header-color-black, var(--theme11-paper, #000)) !important;
    color: var(--header-color-main, var(--theme11-main, #4e8e8b)) !important;
    border-color: color-mix(in srgb, var(--header-color-main, #4e8e8b) 18%, transparent) !important;
  }

  .header-v11 .header-bar .nested_nav li,
  .header-v11 .header-bar .nested_nav .hassub,
  .header-v11 .header-bar .nested_nav .back {
    color: var(--header-color-main, var(--theme11-main, #4e8e8b)) !important;
    border-color: color-mix(in srgb, var(--header-color-main, #4e8e8b) 18%, transparent) !important;
  }

  /* 桌機第二層面板：去掉不同底框色/圓角/陰影，跟第一層乾淨一致 */
  .header-v11 .header-bar .nested_nav ul {
    border-radius: 0 !important;
    box-shadow: none !important;
    background-clip: padding-box;
  }

  /* 若其他樣式加了框線，統一拿掉（避免「底框顏色不同」） */
  .header-v11 .header-bar .nested_nav,
  .header-v11 .header-bar .nested_nav ul {
    border: none !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > a,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .m_area {
    flex: 0 0 auto;
    pointer-events: auto;
    display: inline-block !important;
    vertical-align: middle;
    width: auto;
    line-height: var(--height-nav-md) !important;
    font-size: clamp(16px, 1.04vw, 20px) !important;
    font-weight: 500;
    padding: 0 var(--h11-main-nav-pad-x);
    transition: all 0.35s ease;
    position: relative;
    color: var(--color-text, #000);
    opacity: 1 !important;
    -webkit-text-fill-color: var(--color-text, #000) !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:after,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .has_dropmenu > a:after,
  .header-v11 .header-bar > .main_nav.nav-horizontal > a:after {
    content: "";
    display: block;
    width: 30px;
    height: 4px;
    position: absolute;
    transition: all 0.5s ease;
    top: 60%;
    left: 1em;
    transform: scaleX(0);
    transform-origin: left top;
    background-color: var(--header-color-main, #4e8e8b);
  }

  /* has_dropmenu 的底線改到文字下方，避免壓到字體 */
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .has_dropmenu > a:after {
    top: auto;
    bottom: -0.35em;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu .has_dropmenu > a,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .m_area > a {
    display: inline-block !important;
    line-height: 1.2 !important;
    font-size: clamp(16px, 1.04vw, 20px) !important;
    font-weight: 500;
    padding: 0 0 0 var(--h11-main-nav-pad-x);
    color: var(--color-text, #000);
    opacity: 1 !important;
    -webkit-text-fill-color: var(--color-text, #000) !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .has_dropmenu {
    display: inline-block;
    position: relative;
    line-height: inherit;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu.active,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .has_dropmenu > a.active,
  .header-v11 .header-bar > .main_nav.nav-horizontal > a.active {
    position: relative;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu.active:after,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .has_dropmenu > a.active:after,
  .header-v11 .header-bar > .main_nav.nav-horizontal > a.active:after {
    transform: scaleX(1);
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:hover:after,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:active:after,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .has_dropmenu > a:hover:after,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .has_dropmenu > a:active:after,
  .header-v11 .header-bar > .main_nav.nav-horizontal > a:hover:after,
  .header-v11 .header-bar > .main_nav.nav-horizontal > a:active:after {
    transform: scaleX(1);
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu {
    padding-left: 0;
    position: relative;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu.active .has_dropmenu > a:after {
    transform: scaleX(1);
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:after {
    display: none;
  }

  /* 版型 11：桌機第二層（nested_nav）風格對齊第一層；flyout 有獨立字級 */
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:not(.menu-mode-flyout):not([data-menu-mode="flyout"]):not(.h11-more-dropmenu):not(.menu-mode-mega):not([data-menu-mode="mega"]):not(.menu-mode-mega-split):not([data-menu-mode="mega-split"]) .nested_nav a {
    font-size: clamp(16px, 1.04vw, 20px) !important;
    font-weight: 500 !important;
    color: var(--color-text, #111) !important;
    -webkit-text-fill-color: var(--color-text, #111) !important;
    opacity: 1 !important;
    line-height: 1.35 !important;
    padding: 12px 3em 12px 1em !important; /* 保留右側 more 區域 */
  }

  /* 關掉 in_nav_2 桌機 nested_nav 的 a:before 底線，改用跟第一層一致的 :after（僅 legacy 多欄；三模式各有獨立檔） */
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:not(.menu-mode-flyout):not([data-menu-mode="flyout"]):not(.h11-more-dropmenu):not(.menu-mode-mega):not([data-menu-mode="mega"]):not(.menu-mode-mega-split):not([data-menu-mode="mega-split"]) .nested_nav a:before {
    display: none !important;
    content: none !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:not(.menu-mode-flyout):not([data-menu-mode="flyout"]):not(.h11-more-dropmenu):not(.menu-mode-mega):not([data-menu-mode="mega"]):not(.menu-mode-mega-split):not([data-menu-mode="mega-split"]) .nested_nav a:after {
    content: "" !important;
    display: block !important;
    width: 30px !important;
    height: 4px !important;
    position: absolute !important;
    top: 68% !important;
    left: 1em !important;
    transform: scaleX(0) !important;
    transform-origin: left top !important;
    transition: all 0.5s ease !important;
    background-color: var(--header-color-main, #4e8e8b) !important;
    pointer-events: none !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:not(.menu-mode-flyout):not([data-menu-mode="flyout"]):not(.h11-more-dropmenu):not(.menu-mode-mega):not([data-menu-mode="mega"]):not(.menu-mode-mega-split):not([data-menu-mode="mega-split"]) .nested_nav a:hover:after,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:not(.menu-mode-flyout):not([data-menu-mode="flyout"]):not(.h11-more-dropmenu):not(.menu-mode-mega):not([data-menu-mode="mega"]):not(.menu-mode-mega-split):not([data-menu-mode="mega-split"]) .nested_nav a.active:after {
    transform: scaleX(1) !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:not(.menu-mode-flyout):not([data-menu-mode="flyout"]):not(.h11-more-dropmenu):not(.menu-mode-mega):not([data-menu-mode="mega"]):not(.menu-mode-mega-split):not([data-menu-mode="mega-split"]) .nested_nav a:hover,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:not(.menu-mode-flyout):not([data-menu-mode="flyout"]):not(.h11-more-dropmenu):not(.menu-mode-mega):not([data-menu-mode="mega"]):not(.menu-mode-mega-split):not([data-menu-mode="mega-split"]) .nested_nav a.active {
    color: var(--header-color-hover, #a1a09e) !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:not(.menu-mode-flyout):not([data-menu-mode="flyout"]):not(.h11-more-dropmenu):not(.menu-mode-mega):not([data-menu-mode="mega"]):not(.menu-mode-mega-split):not([data-menu-mode="mega-split"]) .nested_nav a:hover:after,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:not(.menu-mode-flyout):not([data-menu-mode="flyout"]):not(.h11-more-dropmenu):not(.menu-mode-mega):not([data-menu-mode="mega"]):not(.menu-mode-mega-split):not([data-menu-mode="mega-split"]) .nested_nav a.active:after {
    background-color: var(--header-color-hover, #a1a09e) !important;
  }

  /* 桌機只顯示 top_block 語系，隱藏 main_nav 內 language-block_2 */
  .header-v11 .header-bar > .main_nav.nav-horizontal > .lang {
    display: none !important;
  }

  /* 與 in_nav_2 一致：會員入口用 top_block，主選單內不重複 m_area */
  .header-v11 .header-bar > .main_nav.nav-horizontal > .m_area {
    display: none !important;
  }

  .header-v11 .header-bar > .top_block {
    flex: 0 0 auto;
    margin-left: auto;
    position: static !important;
    right: auto !important;
    width: auto !important;
    max-width: fit-content;
    display: flex !important;
    flex-direction: row;
    align-items: center;
    gap: 0;
    z-index: 2;
    background: transparent !important;
    border: none !important;
    box-shadow: none !important;
    padding: 0 !important;
    pointer-events: auto !important;
  }

  /* top_block 原本各 icon 有 margin-left，這裡縮小間距避免太鬆散 */
  .inpage-header .header-v11 .top_block .btn_search,
  .inpage-header .header-v11 .top_block .btn_cart,
  .inpage-header .header-v11 .top_block .btn_login,
  .inpage-header .header-v11 .top_block .lang {
    margin-left: 10px !important;
  }
}


/* 1920+：再放寬一點內容寬度，避免左右留白過大 */
@media (min-width: 1800px) {
  .inpage-header .header-v11 {
    max-width: 100% !important;
    padding-left: clamp(20px, 6vw, 110px) !important;
    padding-right: clamp(20px, 6vw, 110px) !important;
  }
}

/* 與 a-config.style-header2 桌機 hover／主色一致（主題檔只寫 .inpage_nav .main_nav） */
@media (min-width: 1024px) {
  .header-v11 .header-bar > .main_nav.nav-horizontal .dropmenu:hover,
  .header-v11 .header-bar > .main_nav.nav-horizontal .dropmenu:active,
  .header-v11 .header-bar > .main_nav.nav-horizontal .dropmenu > .has_dropmenu > a:hover,
  .header-v11 .header-bar > .main_nav.nav-horizontal .dropmenu > .has_dropmenu > a:active,
  .header-v11 .header-bar > .main_nav.nav-horizontal > a:hover,
  .header-v11 .header-bar > .main_nav.nav-horizontal > a:active {
    color: var(--header-color-hover, #a1a09e);
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal .dropmenu > .has_dropmenu > a:hover:after,
  .header-v11 .header-bar > .main_nav.nav-horizontal .dropmenu > .has_dropmenu > a:active:after,
  .header-v11 .header-bar > .main_nav.nav-horizontal > a:hover:after,
  .header-v11 .header-bar > .main_nav.nav-horizontal > a:active:after {
    background-color: var(--header-color-hover, #a1a09e);
  }
}

/* 桌機：頂列 pointer-events（in_nav_2 父層曾設 none） */
@media (min-width: 1024px) {
  .inpage-header .header-v11 {
    pointer-events: none;
  }

  .inpage-header .header-v11 .header-bar,
  .inpage-header .header-v11 .header-bar * {
    pointer-events: auto;
  }
}

/* 輔助層：無主選單，不參與遮擋 */
.inpage_nav.v2.inpage_nav--aux {
  background: transparent !important;
  border: none !important;
  padding: 0 !important;
  margin: 0 !important;
}

@media (min-width: 1024px) {
  .inpage_nav.v2.inpage_nav--aux {
    position: relative !important;
    height: auto !important;
    min-height: 0 !important;
    overflow: visible !important;
    pointer-events: none !important;
  }

  .inpage_nav.v2.inpage_nav--aux .copyright {
    pointer-events: auto;
  }
}

/* ========== 手機／平板：.header-bar 第一列；主選單改為全螢幕層 ========== */
@media (max-width: 1023px) {
  /* 頂列樣式交給 a-config.style-header2（--header-color-black 等），勿另套紙感色 */
  body:has(.header-v11) {
    --height-nav-mobile: max(56px, var(--height-nav-xs));
  }

  .inpage-header .header-v11 .header-bar {
    display: flex;
    flex-direction: row;
    flex-wrap: nowrap;
    align-items: center;
    justify-content: flex-start;
    gap: 6px;
    width: 100%;
    padding: 0 calc(var(--pd-inside-xs) / 2 + 4px);
    box-sizing: border-box;
    min-height: var(--height-nav-mobile);
    position: relative;
    z-index: 120;
  }

  .header-v11 .header-bar > .logo {
    flex: 0 0 auto;
    min-width: 0;
    max-width: 100px;
    width: 100px;
    min-height: var(--height-nav-mobile);
    display: inline-flex;
    align-items: center;
    justify-content: flex-start;
    overflow: hidden;
    margin-right: auto;
    z-index: 2;
  }

  .header-v11 .header-bar > .logo img {
    /* 手機版固定顯示比例：100 × 50 */
    width: 100px;
    height: 50px;
    max-width: 100px;
    max-height: 50px;
    object-fit: contain;
    display: block;
    flex-shrink: 0;
  }

  .header-v11 .header-bar > .top_block {
    position: static !important;
    flex: 0 0 auto;
    margin-left: auto;
    width: auto !important;
    right: auto !important;
    gap: 4px;
    z-index: 2;
  }

  /* 購物車數字 badge 略往右上，避免遮住 icon */
  .inpage-header .header-v11 .top_block .btn_cart .shopnum {
    right: -12px;
    top: -12px;
    transform: scale(0.72);
  }

  .header-v11 .header-bar > .nav-toggle {
    position: relative !important;
    right: auto !important;
    flex: 0 0 auto;
    margin-left: 0;
    margin-right: -25px;
    z-index: 2;
  }

  /* v11：選單開啟時仍顯示頂列 logo／搜尋／會員／購物車（覆寫 in_nav_2 的 opacity:0） */
  .nav-open .inpage-header .header-v11 .logo,
  .nav-open .inpage-header .header-v11 .top_block {
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  .nav-open .inpage-header .header-v11 .top_block .btn_search,
  .nav-open .inpage-header .header-v11 .top_block .btn_cart,
  .nav-open .inpage-header .header-v11 .top_block .btn_login {
    opacity: 1 !important;
    transform: none !important;
  }

  .nav-open .inpage-header .header.header-v11,
  .nav-open .inpage-header .header-v11 .header-bar {
    pointer-events: auto !important;
    background-color: var(--theme11-paper, #fff) !important;
  }

  /* 覆寫 in_nav_2：.nav-open .inpage-header { pointer-events:none } */
  .nav-open .inpage-header {
    pointer-events: auto !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal {
    position: fixed;
    left: 0;
    right: 0;
    top: var(--height-nav-mobile, var(--height-nav-xs));
    bottom: 0;
    width: 100% !important;
    max-width: none !important;
    margin: 0 !important;
    padding: 12px 0 24px;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    background-color: var(--theme11-paper, #fff);
    color: var(--theme11-text, var(--color-text, #111));
    z-index: 116;
    transform: translateY(-120%);
    transition: transform 0.38s cubic-bezier(0.22, 1, 0.36, 1);
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    justify-content: flex-start !important;
    min-height: calc(100vh - var(--height-nav-mobile, var(--height-nav-xs))) !important;
    min-height: calc(100dvh - var(--height-nav-mobile, var(--height-nav-xs))) !important;
    box-sizing: border-box !important;
    font-size: 16px !important;
    pointer-events: auto !important;
  }

  /* 手機下拉選單：確保 nested_nav 蓋在抽屜內容上 */
  .header-v11 .header-bar .nested_nav {
    z-index: 200 !important;
  }

  .header-v11 .header-bar .nested_nav,
  .header-v11 .header-bar .nested_nav > ul,
  .header-v11 .header-bar .nested_nav ul,
  .header-v11 .header-bar .nested_nav ul.open,
  .header-v11 .header-bar .nested_nav ul ul,
  .header-v11 .header-bar .nested_nav ul ul.open {
    background: transparent !important;
    color: var(--theme11-text, var(--color-text, #111)) !important;
    border-color: color-mix(in srgb, var(--theme11-main, var(--header-color-main, #4e8e8b)) 18%, transparent) !important;
  }

  .header-v11 .header-bar .nested_nav li,
  .header-v11 .header-bar .nested_nav .hassub,
  .header-v11 .header-bar .nested_nav .back {
    color: var(--theme11-text, var(--color-text, #111)) !important;
    border-color: color-mix(in srgb, var(--theme11-main, var(--header-color-main, #4e8e8b)) 18%, transparent) !important;
  }

  .nav-open .header-v11 .header-bar > .main_nav.nav-horizontal {
    transform: translateY(0);
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > a {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
    position: relative !important;
    font-size: clamp(16px, 4.2vw, 20px) !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
    padding: 14px calc(var(--pd-inside-xs) + 14px) 18px !important;
    color: var(--color-text, var(--theme11-text, #111)) !important;
    -webkit-text-fill-color: var(--color-text, var(--theme11-text, #111)) !important;
    border-bottom: 0 !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .m_area {
    display: block !important;
    width: 100% !important;
    padding: 0 !important;
    margin: 0 !important;
  }

  /* 手機版不需要 m_area（會員入口走頂列 icon） */
  .header-v11 .header-bar > .main_nav.nav-horizontal > .m_area {
    display: none !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .has_dropmenu {
    display: flex !important;
    align-items: center !important;
    position: relative !important;
    width: 100% !important;
    min-height: 48px;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .has_dropmenu > a,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .m_area > a {
    display: block !important;
    flex: 1 1 auto !important;
    width: auto !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    position: relative !important;
    font-size: clamp(16px, 4.2vw, 20px) !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
    padding: 14px calc(var(--pd-inside-xs) + 14px) 18px !important;
    padding-right: calc(var(--pd-inside-xs) + 56px) !important;
    color: var(--color-text, var(--theme11-text, #111)) !important;
    -webkit-text-fill-color: var(--color-text, var(--theme11-text, #111)) !important;
    border-bottom: 0 !important;
  }

  /* 主選單內語系直接列出全部項目 */
  .header-v11 .header-bar > .main_nav.nav-horizontal > .lang {
    margin-top: auto !important;
    flex-shrink: 0 !important;
    position: relative !important;
    display: flex !important;
    flex-direction: column !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    padding: calc(var(--pd-inside-xs) / 2) calc(var(--pd-inside-xs) + 10px) calc(var(--pd-inside-xs) * 2) !important;
    box-sizing: border-box !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .lang .lang-toggle {
    display: none !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .lang .lang-dropmenu {
    left: 0 !important;
    top: auto !important;
    width: 100% !important;
    display: flex !important;
    flex-wrap: wrap;
    gap: 8px;
    border: 0 !important;
    border-radius: 0 !important;
    position: relative !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    background: transparent !important;
    padding: 0 !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .lang .lang-dropmenu a {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
    border: 1px solid var(--header-color-main, #4e8e8b) !important;
    border-radius: 50%;
    text-align: center !important;
    font-size: 12px !important;
    font-weight: 500;
    line-height: 1 !important;
    color: var(--header-color-main, #4e8e8b) !important;
    -webkit-text-fill-color: var(--header-color-main, #4e8e8b) !important;
    background: transparent !important;
    box-sizing: border-box;
  }

  /* 讓語系分隔線不被底線規則影響 */
  .header-v11 .header-bar > .main_nav.nav-horizontal > .lang .lang-dropmenu a:after {
    display: none !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .lang .lang-dropmenu a:hover,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .lang .lang-dropmenu a.active {
    background: var(--header-color-main, #4e8e8b) !important;
    color: var(--header-color-black, #000) !important;
    -webkit-text-fill-color: var(--header-color-black, #000) !important;
  }

  /* 桌機語彙：短底線（非整列分隔線） */
  .header-v11 .header-bar > .main_nav.nav-horizontal > a:after,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .has_dropmenu > a:after {
    content: "" !important;
    display: block !important;
    width: 30px !important;
    height: 4px !important;
    position: absolute !important;
    left: calc(var(--pd-inside-xs) + 14px) !important;
    bottom: 6px !important;
    top: auto !important;
    border: none !important;
    opacity: 1 !important;
    transform: scaleX(0) !important;
    transform-origin: left top !important;
    transition: transform 0.35s ease, background-color 0.35s ease !important;
    background-color: var(--header-color-main, var(--theme11-main, #4e8e8b)) !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > a.active:after,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .has_dropmenu > a.active:after,
  .header-v11 .header-bar > .main_nav.nav-horizontal > a:active:after,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .has_dropmenu > a:active:after {
    transform: scaleX(1) !important;
    background-color: var(--header-color-main, var(--theme11-main, #4e8e8b)) !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .m_area > a:after {
    display: none !important;
  }

  /* 版型 11：子選單風格對齊桌機文字色（長英文允許換行，避免撐破下拉寬度） */
  .header-v11 .header-bar .nested_nav a {
    display: block !important;
    width: 100% !important;
    box-sizing: border-box !important;
    position: relative !important;
    font-size: clamp(16px, 4.2vw, 20px) !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
    padding: 12px 18px 16px !important;
    color: var(--color-text, var(--theme11-text, #111)) !important;
    -webkit-text-fill-color: var(--color-text, var(--theme11-text, #111)) !important;
    border-bottom: 0 !important;
    white-space: normal !important;
    overflow-wrap: break-word !important;
  }

  .header-v11 .header-bar .nested_nav a.active,
  .header-v11 .header-bar .nested_nav a:active {
    color: var(--header-color-hover, var(--theme11-main-hover, #a1a09e)) !important;
    -webkit-text-fill-color: var(--header-color-hover, var(--theme11-main-hover, #a1a09e)) !important;
  }

  /* 第三層及以下：縮排＋上下間距對齊第二層（> ul ul a 涵蓋所有更深層級） */
  .header-v11 .header-bar .nested_nav > ul ul a {
    padding-top: 12px !important;
    padding-bottom: 16px !important;
    padding-left: 18px !important;
    padding-right: 18px !important;
  }

  /* hassub 右側預留箭頭，避免長文與 .more 重疊 */
  .header-v11 .header-bar .nested_nav .hassub > a,
  .header-v11 .header-bar .nested_nav > ul ul .hassub > a {
    padding-right: 56px !important;
  }

  .header-v11 .header-bar .nested_nav > ul ul a,
  .header-v11 .header-bar .nested_nav > ul ul a .h11-mega-tile__cap,
  .header-v11 .header-bar .nested_nav > ul ul a .h11-mega-cat__txt {
    font-size: clamp(16px, 4.2vw, 20px) !important;
    font-weight: 500 !important;
    line-height: 1.35 !important;
  }

  .header-v11 .header-bar .nested_nav > ul ul ul a {
    padding-top: 12px !important;
    padding-bottom: 16px !important;
    padding-left: 28px !important;
    padding-right: 18px !important;
  }

  .header-v11 .header-bar .nested_nav > ul ul ul ul a {
    padding-top: 12px !important;
    padding-bottom: 16px !important;
    padding-left: 38px !important;
    padding-right: 18px !important;
  }

  /* 避免 in_nav_2 的 .nested_nav a:before 底線影響一致性 */
  .header-v11 .header-bar .nested_nav a:before {
    display: none !important;
    content: none !important;
  }

  /* 關閉舊版空白全螢幕 inpage_nav */
  .inpage_nav.v2.inpage_nav--aux {
    position: fixed !important;
    top: 0 !important;
    left: 0 !important;
    width: 100% !important;
    height: 0 !important;
    min-height: 0 !important;
    overflow: visible !important;
    padding: 0 !important;
    visibility: hidden !important;
    opacity: 0 !important;
    pointer-events: none !important;
    background: transparent !important;
    transform: none !important;
    z-index: 0 !important;
  }

  .nav-open .inpage_nav.v2.inpage_nav--aux {
    display: none !important;
  }
}

@media (min-width: 768px) and (max-width: 1023px) {
  .header-v11 .header-bar > .main_nav.nav-horizontal {
    top: var(--height-nav-md) !important;
    min-height: calc(100vh - var(--height-nav-md)) !important;
    min-height: calc(100dvh - var(--height-nav-md)) !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > a,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .has_dropmenu > a,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .m_area > a {
    padding-left: var(--pd-inside-md) !important;
    padding-right: var(--pd-inside-md) !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .lang {
    padding-left: var(--pd-inside-md) !important;
    padding-right: var(--pd-inside-md) !important;
  }
}

/* 桌機：頂列語系 pill（top_block）；手機頂列圖示／底色交給 in_nav_2 + a-config */
@media (min-width: 1024px) {
  .inpage-header .top_block .btn_search,
  .inpage-header .top_block .btn_cart,
  .inpage-header .top_block .btn_login,
  .inpage-header .top_block .lang .lang-toggle {
    color: var(--h11-text) !important;
    opacity: 1 !important;
  }

  .inpage-header .top_block .lang {
    position: relative;
    width: auto !important;
    height: auto !important;
    display: inline-flex !important;
    align-items: center;
    margin-left: 10px !important;
  }

  .inpage-header .top_block .lang .lang-toggle {
    display: none !important;
  }

  .inpage-header .top_block .lang .lang-toggle:before,
  .inpage-header .top_block .lang .lang-toggle:after {
    content: none !important;
    display: none !important;
  }

  .inpage-header .top_block .lang .lang-dropmenu {
    position: static !important;
    left: auto !important;
    right: auto !important;
    top: auto !important;
    width: auto !important;
    min-width: 0 !important;
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    padding: 0 !important;
    border: 0 !important;
    border-radius: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  .inpage-header .top_block .lang .lang-dropmenu .link {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
    border: 1px solid var(--theme11-main, var(--h11-primary, #4e8e8b)) !important;
    border-radius: 50%;
    background: var(--h11-paper-2);
    color: var(--h11-text) !important;
    -webkit-text-fill-color: var(--h11-text) !important;
    font-size: 12px;
    font-weight: 700;
    line-height: 1;
    text-align: center;
    white-space: nowrap;
    box-sizing: border-box;
  }

  .inpage-header .top_block .lang .lang-dropmenu .link:after {
    display: none !important;
    content: none !important;
  }

  .inpage-header .top_block .lang .lang-dropmenu .link:hover,
  .inpage-header .top_block .lang .lang-dropmenu .link.active {
    border-color: var(--h11-primary) !important;
    background: var(--h11-primary) !important;
    color: var(--h11-on-primary, var(--theme11-active-text, #fff)) !important;
    -webkit-text-fill-color: var(--h11-on-primary, var(--theme11-active-text, #fff)) !important;
  }
}

.inpage_nav .lang {
  position: relative;
}

/* mini-header：v11 外觀與捲動前相同，僅保留下拉不被裁切 */
@media (min-width: 1024px) {
  .mini-header .inpage.inpage-header:has(.header-v11),
  .mini-header .inpage-header .header.header-v11,
  .mini-header .header-v11 .header-bar {
    height: auto !important;
    overflow: visible !important;
  }

  /* 懸浮時白色底色 */
  .mini-header .inpage.inpage-header:has(.header-v11) {
    background-color: #fff !important;
  }

  .mini-header .inpage-header .header.header-v11 {
    height: auto !important;
    min-height: var(--height-nav-md) !important;
  }

  .mini-header .header-v11 .header-bar > .logo {
    min-height: var(--height-nav-md) !important;
    max-width: clamp(140px, 24vw, 520px) !important;
  }

  .mini-header .header-v11 .header-bar > .logo img {
    max-height: calc(var(--height-nav-md) - 10px) !important;
  }

  .mini-header .header-v11 .header-bar {
    min-height: var(--height-nav-md) !important;
  }

  .mini-header .header-v11 .header-bar > .main_nav.nav-horizontal,
  .mini-header .header-v11 .header-bar > .main_nav.nav-horizontal > a,
  .mini-header .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu {
    line-height: var(--height-nav-md) !important;
  }
}

/* =========================
   v11 最終覆寫（避免 in_nav_2 衝突）
   ========================= */

/* 桌機：主選單文字一定可見 */
@media (min-width: 1024px) {
  .header-v11 .header-bar > .main_nav.nav-horizontal > a,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .has_dropmenu > a,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .m_area > a,
  .header-v11 .header-bar > .main_nav.nav-horizontal > a *,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .has_dropmenu > a * {
    font-size: clamp(16px, 1.04vw, 20px) !important;
    font-weight: 500 !important;
    color: var(--color-text, #111) !important;
    -webkit-text-fill-color: var(--color-text, #111) !important;
    opacity: 1 !important;
    visibility: visible !important;
    text-indent: 0 !important;
  }

  /* 桌機各解析度統一：語系按鈕不要過度圓角 */
  .inpage-header .top_block .lang .lang-toggle {
    border-radius: 14px !important;
  }

  /* 桌機語系下拉貼近按鈕 */
  .inpage-header .top_block .lang .lang-dropmenu {
    left: 0 !important;
    right: auto !important;
    transform: none !important;
    top: calc(80% - 2px) !important;
  }
}

/* 手機：主選單文字一定可見（對齊桌機色票） */
@media (max-width: 1023px) {
  .header-v11 .header-bar > .main_nav.nav-horizontal > a,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .has_dropmenu > a,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .m_area > a,
  .header-v11 .header-bar > .main_nav.nav-horizontal > a *,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .has_dropmenu > a * {
    font-size: clamp(16px, 4.2vw, 20px) !important;
    font-weight: 500 !important;
    color: var(--color-text, var(--theme11-text, #111)) !important;
    -webkit-text-fill-color: var(--color-text, var(--theme11-text, #111)) !important;
    opacity: 1 !important;
    visibility: visible !important;
    text-indent: 0 !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > a.active,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .has_dropmenu > a.active,
  .header-v11 .header-bar > .main_nav.nav-horizontal > a:active,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .has_dropmenu > a:active {
    color: var(--header-color-hover, var(--theme11-main-hover, #a1a09e)) !important;
    -webkit-text-fill-color: var(--header-color-hover, var(--theme11-main-hover, #a1a09e)) !important;
  }

  /* 手機語系：預設隱藏，點擊後直向展開 */
  .header-v11 .header-bar > .main_nav.nav-horizontal > .lang .lang-dropmenu {
    display: none !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .lang.active .lang-dropmenu {
    display: block !important;
    position: absolute !important;
    left: 0 !important;
    right: 0 !important;
    top: 0 !important;
    bottom: auto !important;
    width: 100% !important;
    margin-top: 0 !important;
    padding: 0 !important;
    border: 1px solid var(--header-color-main, #4e8e8b) !important;
    border-radius: 14px !important;
    background: var(--header-color-black, #000) !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    z-index: 120 !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .lang.active .lang-dropmenu .link {
    display: block !important;
    width: 100% !important;
    padding: 0 14px !important;
    line-height: 40px !important;
    font-size: 14px !important;
    text-align: left !important;
    color: var(--header-color-main, #4e8e8b) !important;
    -webkit-text-fill-color: var(--header-color-main, #4e8e8b) !important;
    border-bottom: 1px solid color-mix(in srgb, var(--header-color-main, #4e8e8b) 35%, transparent) !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .lang.active .lang-dropmenu .link:last-child {
    border-bottom: none !important;
  }
}

/* v11 語系最終狀態：直接顯示圓形按鈕，並保留 active 變色 */
@media (min-width: 1024px) {
  .inpage-header .header-v11 .top_block .btn_cart + .lang,
  .inpage-header .header-v11 .top_block .btn-shop-cart.common_cart + .lang {
    margin-left: 18px !important;
  }

  .inpage-header .header-v11 .top_block .lang .lang-toggle {
    display: none !important;
  }

  .inpage-header .header-v11 .top_block .lang .lang-dropmenu {
    position: static !important;
    top: auto !important;
    left: auto !important;
    right: auto !important;
    width: auto !important;
    min-width: 0 !important;
    display: inline-flex !important;
    align-items: center;
    gap: 6px;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    box-shadow: none !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  .inpage-header .header-v11 .top_block .lang .lang-dropmenu .link {
    width: 32px !important;
    height: 32px !important;
    min-width: 32px !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
    border: 1px solid var(--theme11-main) !important;
    border-radius: 50% !important;
    background: var(--theme11-paper, var(--h11-paper-2, #fff)) !important;
    color: var(--theme11-main, var(--h11-primary, #4e8e8b)) !important;
    -webkit-text-fill-color: var(--theme11-main, var(--h11-primary, #4e8e8b)) !important;
    font-size: 12px !important;
    font-weight: 700;
    line-height: 1 !important;
    text-align: center !important;
  }

  .inpage-header .header-v11 .top_block .lang .lang-dropmenu .link.active,
  .inpage-header .header-v11 .top_block .lang .lang-dropmenu .link:hover {
    border-color: var(--theme11-main, var(--h11-primary, #4e8e8b)) !important;
    background: var(--theme11-main, var(--h11-primary, #4e8e8b)) !important;
    color: var(--theme11-active-text, #fff) !important;
    -webkit-text-fill-color: var(--theme11-active-text, #fff) !important;
  }
}

@media (max-width: 1023px) {
  .header-v11 .header-bar > .main_nav.nav-horizontal > .lang .lang-toggle {
    display: none !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .lang .lang-dropmenu,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .lang.active .lang-dropmenu {
    position: relative !important;
    top: auto !important;
    left: 0 !important;
    right: auto !important;
    width: 100% !important;
    display: flex !important;
    flex-wrap: wrap;
    gap: 8px;
    padding: 0 !important;
    border: 0 !important;
    background: transparent !important;
    transform: none !important;
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .lang .lang-dropmenu .link,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .lang.active .lang-dropmenu .link {
    width: 34px !important;
    height: 34px !important;
    min-width: 34px !important;
    display: inline-flex !important;
    align-items: center;
    justify-content: center;
    padding: 0 !important;
    border: 1px solid var(--theme11-main, var(--header-color-main, #4e8e8b)) !important;
    border-radius: 50% !important;
    background: transparent !important;
    color: var(--theme11-main, var(--header-color-main, #4e8e8b)) !important;
    -webkit-text-fill-color: var(--theme11-main, var(--header-color-main, #4e8e8b)) !important;
    font-size: 12px !important;
    font-weight: 500;
    line-height: 1 !important;
    text-align: center !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .lang .lang-dropmenu .link.active,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .lang .lang-dropmenu .link:hover,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .lang.active .lang-dropmenu .link.active,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .lang.active .lang-dropmenu .link:hover {
    border-color: var(--theme11-main, var(--header-color-main, #4e8e8b)) !important;
    background: var(--theme11-main, var(--header-color-main, #4e8e8b)) !important;
    color: var(--theme11-active-text, #fff) !important;
    -webkit-text-fill-color: var(--theme11-active-text, #fff) !important;
  }
}

/* v11：主選單有子層時，強制顯示右側箭頭按鈕（桌機/手機） */
.header-v11 .header-bar .main_nav .has_dropmenu {
  position: relative;
  display: inline-flex;
  align-items: center;
  flex-wrap: nowrap;
  gap: 2px;
  max-width: 100%;
}

.header-v11 .header-bar .main_nav .has_dropmenu .more {
  display: inline-flex !important;
  width: 34px;
  height: 34px;
  align-items: center;
  justify-content: center;
  vertical-align: middle;
  cursor: pointer;
  position: relative;
  z-index: 2;
  flex-shrink: 0;
  pointer-events: auto !important;
}

/* 桌機主選單 overflow 收納 */
@media (min-width: 1024px) {
  .header-v11 .header-bar > .main_nav.nav-horizontal .h11-overflow-hidden {
    display: none !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .h11-more-dropmenu > .has_dropmenu > a {
    white-space: nowrap;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .h11-more-dropmenu > .nested_nav > ul > li {
    min-width: 160px;
  }
}

@media (min-width: 1024px) {
  /* v11：無下拉的第一層標題（如「關於」）對齊有下拉項目的視覺寬度 */
  .header-v11 .header-bar > .main_nav.nav-horizontal > a {
    padding: 0 calc(var(--h11-main-nav-pad-x) + 18px) 0 var(--h11-main-nav-pad-x) !important;
  }

  .header-v11 .header-bar .main_nav .has_dropmenu > a {
    position: relative;
    z-index: 1;
  }

  /* v11：桌機第一層 dropmenu 保留原本較寬手感（避免字被擠） */
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .has_dropmenu {
    display: inline-flex;
    align-items: center;
    position: relative;
    height: var(--height-nav-md);
    padding-right: 0.2vw;
    gap: 0;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .has_dropmenu > a {
    display: inline-flex !important;
    align-items: center;
    /* 右側預留箭頭空間，寬度更接近原本 dropmenu */
    padding: 0 calc(var(--h11-main-nav-pad-x) + 18px) 0 var(--h11-main-nav-pad-x) !important;
    line-height: 1.2 !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .has_dropmenu > .more {
    position: absolute;
    right: 0.65vw;
    top: 50%;
    transform: translateY(-50%);
    width: 1.05em;
    height: 1.05em;
    margin: 0;
    justify-content: center;
    z-index: 2;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .has_dropmenu > .more:before {
    width: 0.62em;
    height: 0.62em;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > a:after {
    left: var(--h11-main-nav-pad-x) !important;
    right: calc(var(--h11-main-nav-pad-x) + 18px) !important;
    width: auto !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .has_dropmenu > a:after {
    left: var(--h11-main-nav-pad-x) !important;
    right: auto !important;
    width: calc(100% - var(--h11-main-nav-pad-x) - var(--h11-main-nav-pad-x) - 18px) !important;
  }
}

.header-v11 .header-bar .main_nav .has_dropmenu .more:before {
  content: "" !important;
  display: inline-block !important;
  width: 12px;
  height: 12px;
  -webkit-mask: url("../../images/new/layout/icon_right2.svg") no-repeat center;
  -webkit-mask-size: contain;
  mask: url("../../images/new/layout/icon_right2.svg") no-repeat center;
  mask-size: contain;
  background-color: var(--color-text, #111);
  transform: rotate(90deg);
  transition: transform 0.25s ease, background-color 0.25s ease;
}

.header-v11 .header-bar .main_nav .has_dropmenu .more.active:before {
  transform: rotate(-90deg);
}

/* v11：has_dropmenu 的 a hover 反應和 .more 一致 */
.header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .has_dropmenu > a:hover + .more:before,
.header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .has_dropmenu > a:focus-visible + .more:before {
  transform: rotate(-90deg);
}

@media (max-width: 1023px) {
  .header-v11 .header-bar .main_nav .has_dropmenu .more {
    position: absolute;
    right: calc(var(--pd-inside-xs) + 10px);
    top: 50%;
    transform: translateY(-50%);
    width: 34px;
    height: 34px;
    justify-content: center;
  }

  .header-v11 .header-bar .main_nav .has_dropmenu .more:before {
    -webkit-mask: url("../../images/new/layout/icon_right2.svg") no-repeat center;
    -webkit-mask-size: contain;
    mask: url("../../images/new/layout/icon_right2.svg") no-repeat center;
    mask-size: contain;
    background-color: var(--color-text, var(--theme11-text, #111));
    transform: rotate(90deg);
  }

  .header-v11 .header-bar .main_nav .has_dropmenu .more.active:before {
    transform: rotate(-90deg);
    background-color: var(--header-color-hover, var(--theme11-main-hover, #a1a09e));
  }

  /* 子層 hassub 的 more 需要可點，避免被同列連結蓋住 */
  .header-v11 .header-bar .nested_nav .hassub {
    position: relative;
  }

  .header-v11 .header-bar .nested_nav .hassub > a {
    display: block;
    padding-right: 56px !important;
    position: relative;
    z-index: 1;
    touch-action: manipulation;
  }

  .header-v11 .header-bar .nested_nav .hassub .more {
    position: absolute !important;
    right: 0 !important;
    top: 0 !important;
    width: 64px !important;
    height: 100% !important;
    z-index: 6 !important;
    pointer-events: auto !important;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
  }

  /* v11：hassub 的 more 改成箭頭（覆寫 in_nav_2 的 +） */
  .header-v11 .header-bar .nested_nav .hassub .more:after {
    content: "" !important;
    width: 12px !important;
    height: 12px !important;
    display: inline-block !important;
    vertical-align: middle !important;
    -webkit-mask: url("../../images/new/layout/icon_right2.svg") no-repeat center !important;
    -webkit-mask-size: contain !important;
    mask: url("../../images/new/layout/icon_right2.svg") no-repeat center !important;
    mask-size: contain !important;
    background-color: var(--color-text, var(--theme11-text, #111)) !important;
    transform: rotate(90deg) !important;
    transition: transform 0.25s ease, background-color 0.25s ease !important;
  }

  .header-v11 .header-bar .nested_nav .hassub .more.active:after {
    transform: rotate(-90deg) !important;
    background-color: var(--header-color-hover, var(--theme11-main-hover, #a1a09e)) !important;
  }
}

/* ========== 版型 11：主流多層選單（桌機：hover 右側飛出；手機：抽屜內摺疊） ========== */

@media (min-width: 1024px) {
  /* 避免飛出選單被頂列裁切 */
  .inpage-header .header.header-v11,
  .inpage-header .header-v11 .header-bar,
  .inpage-header .header-v11 .nested_nav {
    overflow: visible !important;
  }

  .header-v11 .header-bar {
    overflow: visible !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu {
    overflow: visible !important;
  }

  /* 每一列可掛右側子面板 */
  .header-v11 .nested_nav > ul > li {
    position: relative !important;
  }

  .header-v11 .nested_nav li {
    position: relative !important;
  }

  /* 第二層起：緊貼父項右側（flyout 有獨立樣式，勿套用） */
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:not(.menu-mode-flyout):not([data-menu-mode="flyout"]):not(.h11-more-dropmenu):not(.menu-mode-mega):not([data-menu-mode="mega"]):not(.menu-mode-mega-split):not([data-menu-mode="mega-split"]) .nested_nav ul ul,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:not(.menu-mode-flyout):not([data-menu-mode="flyout"]):not(.h11-more-dropmenu):not(.menu-mode-mega):not([data-menu-mode="mega"]):not(.menu-mode-mega-split):not([data-menu-mode="mega-split"]) .nested_nav ul ul ul {
    left: calc(100% + 8px) !important;
    top: 0 !important;
    margin-left: 0 !important;
    min-width: var(--h11-flyout-w, clamp(180px, 15vw, 240px)) !important;
    width: var(--h11-flyout-w, clamp(180px, 15vw, 240px)) !important;
    max-width: var(--h11-flyout-w, clamp(180px, 15vw, 240px)) !important;
    box-sizing: border-box !important;
    z-index: 80 !important;
    box-shadow: 0 10px 28px rgba(0, 0, 0, 0.12) !important;
    border-radius: 8px !important;
    background-color: var(--color-bg-nav-2-sub, #fff) !important;
  }

  /* 內層欄位固定寬度：避免以內容寬度撐開而造成第三層與第二層互壓 */
  .header-v11 .nested_nav ul ul > li,
  .header-v11 .nested_nav ul ul ul > li {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* 右側空間不足時，第三層（含更深）改往左側展開，避免蓋回第二層 */
  .header-v11 .nested_nav li.h11-open-left > ul {
    left: auto !important;
    right: calc(100% + 8px) !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  /* 內層預設關閉；flyout 第三層由檔案末「flyout 最終覆寫」處理 */
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:not(.menu-mode-flyout):not([data-menu-mode="flyout"]):not(.h11-more-dropmenu):not(.menu-mode-mega):not([data-menu-mode="mega"]):not(.menu-mode-mega-split):not([data-menu-mode="mega-split"]) .nested_nav ul ul,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:not(.menu-mode-flyout):not([data-menu-mode="flyout"]):not(.h11-more-dropmenu):not(.menu-mode-mega):not([data-menu-mode="mega"]):not(.menu-mode-mega-split):not([data-menu-mode="mega-split"]) .nested_nav ul ul ul {
    opacity: 0 !important;
    visibility: hidden !important;
    pointer-events: none !important;
    transition: opacity 0.15s ease, visibility 0.15s ease !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:not(.menu-mode-flyout):not([data-menu-mode="flyout"]):not(.h11-more-dropmenu):not(.menu-mode-mega):not([data-menu-mode="mega"]):not(.menu-mode-mega-split):not([data-menu-mode="mega-split"]) .nested_nav li:hover > ul,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:not(.menu-mode-flyout):not([data-menu-mode="flyout"]):not(.h11-more-dropmenu):not(.menu-mode-mega):not([data-menu-mode="mega"]):not(.menu-mode-mega-split):not([data-menu-mode="mega-split"]) .nested_nav li:focus-within > ul,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:not(.menu-mode-flyout):not([data-menu-mode="flyout"]):not(.h11-more-dropmenu):not(.menu-mode-mega):not([data-menu-mode="mega"]):not(.menu-mode-mega-split):not([data-menu-mode="mega-split"]) .nested_nav ul ul.dsk-open,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:not(.menu-mode-flyout):not([data-menu-mode="flyout"]):not(.h11-more-dropmenu):not(.menu-mode-mega):not([data-menu-mode="mega"]):not(.menu-mode-mega-split):not([data-menu-mode="mega-split"]) .nested_nav ul ul ul.dsk-open {
    opacity: 1 !important;
    visibility: visible !important;
    pointer-events: auto !important;
    transform: translateY(0) !important;
  }

  /* 內層「+」在桌機僅為視覺提示 */
  .header-v11 .nested_nav .hassub .more {
    pointer-events: none !important;
    cursor: default !important;
  }

  /* v11：桌機 hassub 的 more 改成箭頭（覆寫 in_nav_2 的 +） */
  .header-v11 .nested_nav .hassub .more:after {
    content: "" !important;
    width: 14px !important;
    height: 14px !important;
    display: inline-block !important;
    vertical-align: middle !important;
    -webkit-mask: url("../../images/new/layout/icon_right.svg") no-repeat center !important;
    -webkit-mask-size: contain !important;
    mask: url("../../images/new/layout/icon_right.svg") no-repeat center !important;
    mask-size: contain !important;
    background-color: #d0d0d0 !important;
    transform: none !important;
    transition: all 0.25s ease !important;
  }

/* legacy 多欄深層選單：長文字保留右側箭頭（排除 flyout / mega / mega-split） */
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:not(.menu-mode-flyout):not([data-menu-mode="flyout"]):not(.h11-more-dropmenu):not(.menu-mode-mega):not([data-menu-mode="mega"]):not(.menu-mode-mega-split):not([data-menu-mode="mega-split"]) > .nested_nav.h11-has-deep .hassub {
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:not(.menu-mode-flyout):not([data-menu-mode="flyout"]):not(.h11-more-dropmenu):not(.menu-mode-mega):not([data-menu-mode="mega"]):not(.menu-mode-mega-split):not([data-menu-mode="mega-split"]) > .nested_nav.h11-has-deep .hassub > a {
    display: flex !important;
    width: 100% !important;
    max-width: 100% !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
    padding-right: 48px !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:not(.menu-mode-flyout):not([data-menu-mode="flyout"]):not(.h11-more-dropmenu):not(.menu-mode-mega):not([data-menu-mode="mega"]):not(.menu-mode-mega-split):not([data-menu-mode="mega-split"]) > .nested_nav.h11-has-deep .hassub > a .h11-mega-cat__txt,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:not(.menu-mode-flyout):not([data-menu-mode="flyout"]):not(.h11-more-dropmenu):not(.menu-mode-mega):not([data-menu-mode="mega"]):not(.menu-mode-mega-split):not([data-menu-mode="mega-split"]) > .nested_nav.h11-has-deep .hassub > a .h11-mega-tile__cap {
    flex: 1 1 auto !important;
    min-width: 0 !important;
    max-width: 100% !important;
    white-space: normal !important;
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:not(.menu-mode-flyout):not([data-menu-mode="flyout"]):not(.h11-more-dropmenu):not(.menu-mode-mega):not([data-menu-mode="mega"]):not(.menu-mode-mega-split):not([data-menu-mode="mega-split"]) > .nested_nav.h11-has-deep .hassub > .more {
    position: absolute !important;
    right: 0.75em !important;
    top: 0 !important;
    width: 34px !important;
    height: 100% !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
    box-sizing: border-box !important;
  }

  /* v11：第一層子選單（dropdown-menu）改為固定高度後橫向堆欄；flex 讓 pager 貼在面板右側垂直置中 */
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu:not(.menu-mode-flyout):not([data-menu-mode="flyout"]):not(.h11-more-dropmenu):not(.menu-mode-mega):not([data-menu-mode="mega"]):not(.menu-mode-mega-split):not([data-menu-mode="mega-split"]) > .nested_nav {
    position: absolute;
    left: 0 !important;
    top: calc(70% + 2px) !important;
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 8px !important;
    max-width: min(92vw, 1200px) !important;
    box-sizing: border-box !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .nested_nav > ul {
    --h11-sub-col-width: max-content;
    --h11-sub-col-gap: 18px;
    --h11-sub-max-cols: 3;
    --h11-sub-rows: 7;
    --h11-flyout-w: clamp(180px, 15vw, 240px);
    flex: 1 1 auto !important;
    min-width: 0 !important;
    display: grid !important;
    grid-auto-flow: column;
    grid-template-rows: repeat(var(--h11-sub-rows), minmax(0, max-content));
    grid-auto-columns: var(--h11-sub-col-width);
    column-gap: var(--h11-sub-col-gap);
    row-gap: 0;
    width: fit-content !important;
    max-width: 84vw !important;
    min-width: min(280px, 84vw) !important;
    max-height: min(74vh, 560px) !important;
    overflow-x: auto !important;
    overflow-y: hidden !important;
    padding: 12px !important;
    overscroll-behavior-x: contain;
    scroll-behavior: smooth;
    scrollbar-width: none;
  }

  /* 有第三層時，避免被第一層橫向捲動容器裁切 */
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .nested_nav.h11-has-deep {
    max-width: none !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .nested_nav.h11-has-deep > ul {
    max-width: none !important;
    overflow-x: visible !important;
    overflow-y: visible !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .nested_nav > ul::-webkit-scrollbar {
    display: none;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .nested_nav > ul > li {
    width: var(--h11-flyout-w) !important;
    min-width: var(--h11-flyout-w) !important;
    max-width: var(--h11-flyout-w) !important;
    box-sizing: border-box !important;
  }

  /* 右側切換按鈕：僅超過三欄且可捲動時顯示（由 JS 加 .h11-has-overflow） */
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .nested_nav .h11-submenu-pager {
    display: none;
    position: static !important;
    flex: 0 0 auto !important;
    align-self: center !important;
    margin: 0 !important;
    right: auto !important;
    top: auto !important;
    transform: none !important;
    z-index: 92;
    flex-direction: column;
    gap: 6px;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .nested_nav.h11-has-overflow .h11-submenu-pager {
    display: inline-flex;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .nested_nav.h11-has-deep .h11-submenu-pager {
    display: none !important;
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .nested_nav .h11-submenu-pager button {
    width: 34px;
    height: 34px;
    border: 0;
    border-radius: 6px;
    background: rgba(43, 37, 31, 0.85);
    color: #fff;
    font-size: 18px;
    line-height: 1;
    cursor: pointer;
    box-shadow: 0 8px 18px rgba(0, 0, 0, 0.18);
  }

  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .nested_nav.h11-at-start .h11-submenu-pager .h11-submenu-prev,
  .header-v11 .header-bar > .main_nav.nav-horizontal > .dropmenu > .nested_nav.h11-at-end .h11-submenu-pager .h11-submenu-next {
    opacity: 0.35;
    cursor: default;
  }
}

@media (max-width: 1023px) {
  /* 抽屜內相對排版，捨棄全螢幕滑層 */
  .header-v11 .nested_nav {
    position: relative !important;
    left: 0 !important;
    right: auto !important;
    top: auto !important;
    width: 100% !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    opacity: 1 !important;
    transform: none !important;
    pointer-events: auto !important;
    background: transparent !important;
    margin: 0 !important;
    padding: 0 !important;
    z-index: 5 !important;
    display: none;
    transition: none !important;
  }

  .header-v11 .nested_nav.active {
    display: block !important;
    opacity: 1 !important;
    pointer-events: auto !important;
  }

  /* 覆寫 in_nav_2：dsk-open／open 勿 fixed／100vh，避免橫向撐出抽屜 */
  .header-v11 .nested_nav ul,
  .header-v11 .nested_nav > ul,
  .header-v11 .nested_nav > ul.dsk-open,
  .header-v11 .nested_nav ul.dsk-open {
    position: relative !important;
    left: 0 !important;
    right: auto !important;
    top: 0 !important;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;
    box-sizing: border-box !important;
    overflow-x: hidden !important;
    pointer-events: auto !important;
    transform: none !important;
    transition: none !important;
  }

  /* 第一層子面板：依內容寬度 */
  .header-v11 .nested_nav > ul,
  .header-v11 .nested_nav > ul.dsk-open {
    width: max-content !important;
    min-width: clamp(120px, 44vw, 200px) !important;
    max-width: min(88vw, 280px) !important;
  }

  .header-v11 .nested_nav > ul > li,
  .header-v11 .nested_nav > ul ul > li {
    width: max-content !important;
    min-width: 100% !important;
    max-width: 100% !important;
  }

  .header-v11 .nested_nav > ul {
    overflow-y: visible !important;
    padding: 4px 0 8px !important;
    margin: 4px 0 6px calc(var(--pd-inside-xs) + 14px) !important;
    background: var(--theme11-paper, #fff) !important;
    border: 1.5px solid var(--theme11-main, var(--header-color-main, #4e8e8b)) !important;
    border-radius: 14px !important;
  }

  /* 第二層起：縮排清單，勿再套外框（避免三層選單框在一起） */
  .header-v11 .nested_nav > ul ul {
    opacity: 1 !important;
    visibility: visible !important;
    display: none;
    width: 100% !important;
    min-width: 0 !important;
    max-width: 100% !important;
    padding: 0 0 0 14px !important;
    margin: 0 !important;
    box-shadow: none !important;
    background: transparent !important;
    border: 0 !important;
    border-radius: 0 !important;
  }

  .header-v11 .nested_nav > ul ul.open,
  .header-v11 .nested_nav > ul ul ul.open {
    display: block !important;
  }

  /* 行動版 dsk-open：縮小 li 間距 */
  .header-v11 .nested_nav > ul.dsk-open,
  .header-v11 .nested_nav ul.dsk-open {
    padding: 2px 0 4px !important;
  }

  .header-v11 .nested_nav > ul.dsk-open > li > a {
    padding: 8px 18px 10px !important;
  }

  /* hassub 右側須留箭頭熱區；勿用 shorthand 蓋掉 padding-right */
  .header-v11 .nested_nav > ul.dsk-open > li > .hassub > a {
    padding: 8px 56px 10px 18px !important;
  }

  /* 覆寫 in_nav_2：子層 .open 勿變全螢幕 fixed 滑層 */
  .header-v11 .nested_nav ul.open {
    position: relative !important;
    top: 0 !important;
    left: 0 !important;
    width: max-content !important;
    max-width: min(88vw, 280px) !important;
    min-width: clamp(120px, 44vw, 200px) !important;
    height: auto !important;
    min-height: 0 !important;
    z-index: auto !important;
    pointer-events: auto !important;
    transform: none !important;
    transition: none !important;
  }

  .header-v11 .nested_nav li,
  .header-v11 .nested_nav .hassub {
    max-width: min(88vw, 280px) !important;
    box-sizing: border-box !important;
  }

  .header-v11 .nested_nav .hassub {
    position: relative !important;
  }

  .header-v11 .nested_nav .hassub > a,
  .header-v11 .nested_nav.active > ul > li > .hassub > a,
  .header-v11 .nested_nav > ul.dsk-open > li > .hassub > a,
  .header-v11 .nested_nav ul ul .hassub > a {
    display: block !important;
    padding-right: 56px !important;
    box-sizing: border-box !important;
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  .header-v11 .nested_nav .hassub .more {
    position: absolute !important;
    right: 0 !important;
    top: 0 !important;
    width: 64px !important;
    height: 100% !important;
    z-index: 6 !important;
    pointer-events: auto !important;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
    touch-action: manipulation;
  }

  /* 行動版：外框內第二層與所有更深層子選單，上下間距統一 */
  .header-v11 .nested_nav.active > ul > li > a,
  .header-v11 .nested_nav.active > ul > li > .hassub > a,
  .header-v11 .nested_nav ul ul a,
  .header-v11 .nested_nav ul ul ul a,
  .header-v11 .nested_nav ul ul ul ul a {
    padding-top: 12px !important;
    padding-bottom: 16px !important;
  }

  .header-v11 .nested_nav a {
    max-width: 100% !important;
    box-sizing: border-box !important;
    overflow-wrap: anywhere;
    word-break: break-word;
  }

  /* 滑層「返回」改由主選單關閉處理，摺疊選單不需要 */
  .header-v11 .nested_nav .back {
    display: none !important;
  }

  .header-v11 .nested_nav .back .back-btn {
    display: block;
    width: 100%;
    min-height: 44px;
    padding: 12px 18px;
    margin: 0;
    border: 0;
    background: transparent;
    font: inherit;
    font-weight: 500;
    color: inherit;
    text-align: left;
    cursor: pointer;
    -webkit-tap-highlight-color: transparent;
  }

  .header-v11 .nested_nav .back .back-btn:focus-visible {
    outline: none;
    box-shadow: var(--v11-focus-ring);
    border-radius: var(--v11-radius, 12px);
  }
}

/* =========================
   v11 桌機內容位移校正（單排頂列：對齊 --height-nav-md / mini）
   原 `body > .inpage:not(.inpage-header):first-of-type` 在「第一個 div 就是頁首」時
   選不到第二個主內容包裝（如 inpage_main_body），導致與 news11 等頁的 page_header 位置不一致。
   改為：頁首區塊（.inpage.inpage-header）之後的第一層主內容。
   使用 padding 留位，讓 11 版頁面的整頁背景延伸到選單下方預留區。
   ========================= */
@media (min-width: 1024px) {
  body:has(.header-v11) > .inpage.inpage-header ~ .inpage_main_body.inpage,
  body:has(.header-v11) > .inpage.inpage-header ~ div.inpage.product_list,
  body:has(.header-v11) > .inpage.inpage-header ~ div.inpage.news_list,
  body:has(.header-v11) > .inpage.inpage-header ~ div.inpage.download,
  body:has(.header-v11) > .inpage.inpage-header ~ div.inpage#product_detail11,
  body:has(.header-v11) > .inpage.inpage-header ~ div.inpage.contact,
  body.mini-header:has(.header-v11) > .inpage.inpage-header ~ .inpage_main_body.inpage,
  body.mini-header:has(.header-v11) > .inpage.inpage-header ~ div.inpage.product_list,
  body.mini-header:has(.header-v11) > .inpage.inpage-header ~ div.inpage.news_list,
  body.mini-header:has(.header-v11) > .inpage.inpage-header ~ div.inpage.download,
  body.mini-header:has(.header-v11) > .inpage.inpage-header ~ div.inpage#product_detail11,
  body.mini-header:has(.header-v11) > .inpage.inpage-header ~ div.inpage.contact {
    margin-top: 0 !important;
    padding-top: var(--height-nav-md) !important;
  }

  body:has(.header-v11) > .inpage.inpage-header ~ .inpage_main_body.inpage .banner,
  body:has(.header-v11) > .inpage.inpage-header ~ div.pages.ir-monthly-revenue .banner,
  body:has(.header-v11) > .inpage.inpage-header ~ div.inpage.product_list .banner,
  body:has(.header-v11) > .inpage.inpage-header ~ div.inpage.news_list .banner,
  body:has(.header-v11) > .inpage.inpage-header ~ div.inpage.download .banner,
  body:has(.header-v11) > .inpage.inpage-header ~ div.inpage#product_detail11 .banner,
  body:has(.header-v11) > .inpage.inpage-header ~ div.inpage.contact .banner {
    margin-top: 0 !important;
  }

  body:has(.header-v11) > .inpage.inpage-header ~ div.pages.ir-monthly-revenue,
  body.mini-header:has(.header-v11) > .inpage.inpage-header ~ div.pages.ir-monthly-revenue {
    padding-top: var(--height-nav-md) !important;
  }
}

/* v11：page_header 下緣與 news.css `.news_list .page_header` 一致（非消息頁也對齊 news11） */
@media (min-width: 768px) {
  body:has(.header-v11) section.inpage.container.page_header,
  body:has(.header-v11) section.inpage.container_inside.page_header {
    padding-bottom: 2vw !important;
  }
}

/* v11：避免 page_header 被全域 banner 規則加上 nav 高度位移 */
@media (min-width: 768px) {
  body:has(.header-v11) section.inpage.container.page_header,
  body:has(.header-v11) section.inpage.container_inside.page_header,
  body:has(.header-v11) section.inpage.container.page_header .banner,
  body:has(.header-v11) section.inpage.container_inside.page_header .banner {
    margin-top: 0 !important;
  }
}

/* v11：banner h1 與首段內容間距 — 對齊 news11 .n11-section */
body:has(.header-v11) #news_list.news11 > section.page_header ~ .n11-section,
body:has(.header-v11) #news_list.article11 > section.page_header ~ .a11-section,
body:has(.header-v11) #news_detail.news_detail11 > section.page_header ~ .nd11-section,
body:has(.header-v11) #news_detail.article_detail11 > section.page_header ~ .ad11-section,
body:has(.header-v11) #about.about11 > section.page_header ~ .ab11-hero,
body:has(.header-v11) #faq.faq11 > section.page_header ~ .container_inside,
body:has(.header-v11) #download > section.page_header ~ .container_inside,
body:has(.header-v11) #photobook > section.page_header ~ .container_inside:first-of-type,
body:has(.header-v11) #activity11 > section.page_header ~ .container_inside:first-of-type,
body:has(.header-v11) #contact > section.page_header ~ .container_inside:first-of-type,
body:has(.header-v11) #product11 > section.page_header ~ .p11-wrap,
body:has(.header-v11) #product_detail11 > section.page_header ~ .d11-wrap,
body:has(.header-v11) #faq > section.page_header ~ .container_inside.faq_section_wrap,
body:has(.header-v11) #esg.esg11 > section.page_header ~ .container_inside:first-of-type {
  margin-top: var(--ab11-banner-content-gap);
}






/* =========================
   v11 行動／平板（<1024px）：內頁左右版心留白
   與手機頂列斷點一致；覆寫 special11 各檔 22–30px 過窄設定
   ========================= */
@media (max-width: 1023px) {
  body:has(.header-v11) div.inpage > section.page_header,
  body:has(.header-v11) .inpage_main_body.inpage [class$="-wrap"]:not(.nd11-wrap):not(.ad11-wrap):not(.d11-wrap):not(.ax3-org-wrap):not(.inv11-wrap),
  body:has(.header-v11) .inpage_main_body.inpage .container_inside:not(.page_header):not(.n11-list):not(.a11-list):not(.pb11-list):not(.nd11-wrap):not(.ad11-wrap):not(.fq11-layout),
  body:has(.header-v11) .inpage_main_body.inpage .news_content_container_v3 {
    width: min(1320px, calc(100% - var(--v11-gutter-page-xs) * 2)) !important;
    max-width: 100% !important;
    margin-left: auto !important;
    margin-right: auto !important;
    box-sizing: border-box !important;
  }
  /* *11 內頁留白由 v11_inpage_mobile_gutter.css + special11/*.css 處理 */
  /* albums_detail11（#faq 無 .faq11）留白由 gutter + albums_detail11.css 處理 */
  /* #download / files11 留白由 v11_inpage_mobile_gutter.css + files11.css 處理 */
  /* #product11 留白由 v11_inpage_mobile_gutter.css + product11.css 處理 */
  /* #contact / contact11 留白由 v11_inpage_mobile_gutter.css + contact11.css 處理 */
  /* 投資人 ir11 留白由 investor11.css + v11-chrome.css 處理 */
}

/* about11 獎項過場：about_award 100vw breakout + 文字 40px */
body:has(.header-v11) #about.about11.inpage_main_body {
  overflow: visible !important;
}

body:has(.header-v11) #about.about11 > section.ab11-award-transition-section {
  width: auto !important;
  max-width: none !important;
  margin-top: 0 !important;
  margin-left: 0 !important;
  margin-right: 0 !important;
  margin-bottom: var(--ab11-section-gap, clamp(72px, 9vw, 120px)) !important;
  padding: 0 !important;
  overflow: visible !important;
}

body:has(.header-v11) #about.about11 .about_award.ab11-award-transition {
  position: relative !important;
  width: 100vw !important;
  max-width: 100vw !important;
  margin-top: 0 !important;
  margin-bottom: 0 !important;
  margin-left: calc(50% - 50vw) !important;
  margin-right: calc(50% - 50vw) !important;
  min-height: clamp(380px, 68vh, 720px) !important;
  padding: 0 !important;
  overflow: hidden !important;
  box-sizing: border-box !important;
}

body:has(.header-v11) #about.about11 .ab11-award-transition__bg,
body:has(.header-v11) #about.about11 .ab11-award-transition__overlay {
  position: absolute !important;
  top: 0 !important;
  right: 0 !important;
  bottom: 0 !important;
  left: 0 !important;
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
  transform: none !important;
}

@media (max-width: 1023px) {
  body:has(.header-v11) #about.about11 .ab11-award-transition__content {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 40px !important;
    padding-right: 40px !important;
    box-sizing: border-box !important;
  }
}

/* news11 行動版版心 40px（壓過上方 width calc） */
@media (max-width: 1023px) {
  body:has(.header-v11) #news_list.news11 > section:is(.page_header, .n11-section) {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: var(--v11-gutter-page-xs) !important;
    padding-right: var(--v11-gutter-page-xs) !important;
    box-sizing: border-box !important;
  }
}

/* news_detail11 行動版版心 40px（壓過上方 width calc） */
@media (max-width: 1023px) {
  body:has(.header-v11) #news_detail.news_detail11 > :is(section.page_header, article.nd11-section) {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: var(--v11-gutter-page-xs) !important;
    padding-right: var(--v11-gutter-page-xs) !important;
    box-sizing: border-box !important;
  }

  body:has(.header-v11) #news_detail.news_detail11 .container_inside.nd11-wrap {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* product11 行動版版心 40px（麵包屑 + 內容區；壓過上方 width calc） */
@media (max-width: 1023px) {
  body:has(.header-v11) #product11 > :is(section.page_header, .p11-wrap) {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: var(--v11-gutter-page-xs) !important;
    padding-right: var(--v11-gutter-page-xs) !important;
    box-sizing: border-box !important;
  }
}

/* product_detail11 行動版版心 40px（麵包屑 + 內容區；壓過上方 width calc） */
@media (max-width: 1023px) {
  body:has(.header-v11) #product_detail11 > :is(section.page_header, .d11-wrap) {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: var(--v11-gutter-page-xs) !important;
    padding-right: var(--v11-gutter-page-xs) !important;
    box-sizing: border-box !important;
  }
}

/* albums_detail11 行動版版心 40px（#faq 相簿內頁；壓過上方 width calc） */
@media (max-width: 1023px) {
  body:has(.header-v11) #faq.inpage_main_body > :is(section.page_header, .container_inside.faq_section_wrap) {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: var(--v11-gutter-page-xs) !important;
    padding-right: var(--v11-gutter-page-xs) !important;
    box-sizing: border-box !important;
  }
}

/* faq11 行動版版心 40px（壓過上方 width calc） */
@media (max-width: 1023px) {
  body:has(.header-v11) #faq.faq11.inpage_main_body > :is(section.page_header, .container_inside.fq11-layout) {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: var(--v11-gutter-page-xs) !important;
    padding-right: var(--v11-gutter-page-xs) !important;
    box-sizing: border-box !important;
  }
}

/* files11 行動版版心 40px（麵包屑 + 內容區；壓過上方 width calc） */
@media (max-width: 1023px) {
  body:has(.header-v11) #download.inpage > :is(section.page_header, .container_inside:not(.page_header)) {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: var(--v11-gutter-page-xs) !important;
    padding-right: var(--v11-gutter-page-xs) !important;
    box-sizing: border-box !important;
  }
}

/* contact11 行動版版心 40px（麵包屑 + 內容區；壓過上方 width calc） */
@media (max-width: 1023px) {
  body:has(.header-v11) #contact.contact11.inpage_main_body > :is(section.page_header, .container_inside:not(.page_header)),
  body:has(.header-v11) #contact.contact11 .ct11-section-gutter {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: var(--v11-gutter-page-xs) !important;
    padding-right: var(--v11-gutter-page-xs) !important;
    box-sizing: border-box !important;
  }
}

/* article11 行動版版心 40px（壓過上方 width calc） */
@media (max-width: 1023px) {
  body:has(.header-v11) #news_list.article11 > section:is(.page_header, .a11-section) {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: var(--v11-gutter-page-xs) !important;
    padding-right: var(--v11-gutter-page-xs) !important;
    box-sizing: border-box !important;
  }
}

/* article_detail11 行動版版心 40px（壓過上方 width calc） */
@media (max-width: 1023px) {
  body:has(.header-v11) #news_detail.article_detail11 > :is(section.page_header, article.ad11-section) {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: var(--v11-gutter-page-xs) !important;
    padding-right: var(--v11-gutter-page-xs) !important;
    box-sizing: border-box !important;
  }

  body:has(.header-v11) #news_detail.article_detail11 .container_inside.ad11-wrap {
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* albums11 行動版版心 40px（壓過上方 width calc） */
@media (max-width: 1023px) {
  body:has(.header-v11) #photobook.albums11 > :is(section.page_header, section.pb11-section) {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: var(--v11-gutter-page-xs) !important;
    padding-right: var(--v11-gutter-page-xs) !important;
    box-sizing: border-box !important;
  }

  body:has(.header-v11) #photobook.albums11 .container_inside.pb11-list {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: 0 !important;
    padding-right: 0 !important;
  }
}

/* activity11 行動版版心 40px（麵包屑 + 內容區；壓過上方 width calc） */
@media (max-width: 1023px) {
  body:has(.header-v11) #activity11.inpage_main_body > :is(section.page_header, .container_inside:not(.page_header)) {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: var(--v11-gutter-page-xs) !important;
    padding-right: var(--v11-gutter-page-xs) !important;
    box-sizing: border-box !important;
  }
}

/* 投資人 inv11 行動版版心 40px */
@media (max-width: 1023px) {
  body:has(.header-v11) #investor.investor > :is(section.page_header, .container_inside.page_header, .container_inside.page_header.inv11-subpage-head, .inv11-wrap) {
    width: 100% !important;
    max-width: 100% !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
    padding-left: var(--v11-gutter-page-xs) !important;
    padding-right: var(--v11-gutter-page-xs) !important;
    box-sizing: border-box !important;
  }
}
