/* ===== NB Fullscreen Slide-Down Menu : CLEAN ===== */
:root{
  --nbmm-z-overlay: 10001;
  --nbmm-z-toggle: 10002;
  --nbmm-bg:#111; --nbmm-fg:#fff; --nbmm-accent:#fff;
}

/* 既定のトグル系は念のため非表示 */
.site-header .menu-toggle,
.handheld-navigation,
.storefront-handheld-footer-bar{ display:none !important; }

/* === Toggle (右上固定) === */
#nbMenuToggle.nbmm-toggle{
  position:fixed !important; top:28px !important; right:28px !important;
  z-index:var(--nbmm-z-toggle) !important;
  width:46px !important; height:46px !important;
  border-radius:9999px !important; box-sizing:border-box !important;
  background:rgba(0,0,0,.55) !important; border:1px solid rgba(255,255,255,.25) !important;
  padding:0 !important; display:block !important; line-height:0 !important;
  overflow:hidden !important; white-space:nowrap !important;
}
#nbMenuToggle *{ font-size:0 !important; line-height:0 !important; }

/* 3本バー（円の真ん中基準） */
#nbMenuToggle .nbmm-bar{
  position:absolute !important; left:50% !important; top:50% !important;
  width:24px !important; height:2px !important; margin:0 !important;
  background:#fff !important; display:block !important;
  transform:translate(-50%,-50%) !important;
  transition:transform .25s ease, opacity .2s ease !important;
  pointer-events:none !important;
}
#nbMenuToggle .nbmm-bar[data-i="1"]{ transform:translate(-50%,-50%) translateY(-5px) !important; }
#nbMenuToggle .nbmm-bar[data-i="2"]{ transform:translate(-50%,-50%) !important; }
#nbMenuToggle .nbmm-bar[data-i="3"]{ transform:translate(-50%,-50%) translateY(5px) !important; }
#nbMenuToggle.is-open .nbmm-bar[data-i="1"]{ transform:translate(-50%,-50%) rotate(45deg) !important; }
#nbMenuToggle.is-open .nbmm-bar[data-i="2"]{ opacity:0 !important; }
#nbMenuToggle.is-open .nbmm-bar[data-i="3"]{ transform:translate(-50%,-50%) rotate(-45deg) !important; }

/* 位置調整 */
@media (max-width:1024px){
  #nbMenuToggle.nbmm-toggle{ top:14px !important; right:14px !important; width:44px !important; height:44px !important; }
}
html.admin-bar #nbMenuToggle.nbmm-toggle{ top:60px !important; }
@media (max-width:782px){ html.admin-bar #nbMenuToggle.nbmm-toggle{ top:46px !important; } }

/* === Overlay === */
#nbMenuOverlay.nbmm-overlay{
  position:fixed; inset:0; z-index:var(--nbmm-z-overlay);
  background:var(--nbmm-bg); color:var(--nbmm-fg);
  transform:translateY(-100%); transition:transform .38s cubic-bezier(.22,.61,.36,1);
}
#nbMenuOverlay.is-open{ transform:translateY(0); }
html.nbmm-lock, body.nbmm-lock{ overflow:hidden !important; }

.nbmm-inner{
  height:100%; width:min(1080px,100%); margin:0 auto;
  padding:clamp(16px,3vw,40px);
  display:grid; grid-template-rows:1fr auto; gap:24px;
}
.nbmm-nav{ display:grid; align-content:center; }

/* Menu typograph */
.nbmm-menu{ list-style:none; margin:0; padding:0; display:grid; gap:14px; }
.nbmm-menu > li > a{
  display:inline-block; color:#fff; text-decoration:none;
  font-weight:600; letter-spacing:.02em;
  font-size:clamp(18px,2.2vw,28px); line-height:1.25;
  border-bottom:1px solid transparent; padding-bottom:4px;
}
.nbmm-menu > li > a:hover{ border-color:var(--nbmm-accent); }
.nbmm-menu li .sub-menu{ list-style:none; margin:8px 0 0 14px; padding:0; display:grid; gap:8px; }
.nbmm-menu li .sub-menu a{ font-size:clamp(14px,1.8vw,18px); opacity:.9; }

/* PCで通常のプライマリメニューを可視(トグルと共存) */
@media (min-width:1025px){
  #site-navigation, #site-navigation .menu, #site-navigation .menu > li{
    display:block !important; visibility:visible !important; opacity:1 !important;
  }
  #site-navigation .menu{ display:flex !important; gap:18px !important; align-items:center !important; flex-wrap:wrap; }
}

/* --- Overlay を閉じている時は完全不可視＆操作不可 --- */
#nbMenuOverlay{ 
  position: fixed; inset: 0; z-index: 10001;
  background:#111; color:#fff;
  transform: translateY(-100%); transition: transform .38s cubic-bezier(.22,.61,.36,1);
  visibility: hidden; pointer-events: none; overflow: auto;
}
#nbMenuOverlay.is-open{
  transform: translateY(0);
  visibility: visible; pointer-events: auto;
}

/* --- トグル内のテキストノード完全遮断（“カート”等が溢れない） --- */
#nbMenuToggle{ font-size:0 !important; line-height:0 !important; overflow:hidden !important; white-space:nowrap !important; }
#nbMenuToggle *{ font-size:0 !important; line-height:0 !important; }

/* --- 3本バー（中央基準）--- 既に導入済みなら重複不要。念のため強制上書き --- */
#nbMenuToggle .nbmm-bar{ 
  position:absolute !important; left:50% !important; top:50% !important;
  width:24px !important; height:2px !important; margin:0 !important; background:#fff !important;
  transform:translate(-50%,-50%) !important; transition:transform .25s ease,opacity .2s ease !important; pointer-events:none !important;
}
#nbMenuToggle .nbmm-bar[data-i="1"]{ transform:translate(-50%,-50%) translateY(-5px) !important; }
#nbMenuToggle .nbmm-bar[data-i="2"]{ transform:translate(-50%,-50%) !important; }
#nbMenuToggle .nbmm-bar[data-i="3"]{ transform:translate(-50%,-50%) translateY(5px) !important; }
#nbMenuToggle.is-open .nbmm-bar[data-i="1"]{ transform:translate(-50%,-50%) rotate(45deg) !important; }
#nbMenuToggle.is-open .nbmm-bar[data-i="2"]{ opacity:0 !important; }
#nbMenuToggle.is-open .nbmm-bar[data-i="3"]{ transform:translate(-50%,-50%) rotate(-45deg) !important; }

/* --- 既存ヘッダー側の検索窓/カートを消す（オーバーレイに統一する時）--- */
.site-header .site-search,
.site-header .widget_product_search,
.site-header .site-header-cart{ display:none !important; }

/* --- オーバーレイのタイポ（読みやすいサイズ） --- */
.nbmm-menu{ list-style:none; margin:0; padding:0; display:grid; gap:14px; }
.nbmm-menu > li > a{ display:inline-block; color:#fff; text-decoration:none; font-weight:600; letter-spacing:.02em;
  font-size:clamp(18px,2.2vw,28px); line-height:1.25; border-bottom:1px solid transparent; padding-bottom:4px; }
.nbmm-menu > li > a:hover{ border-color:#fff; }
.nbmm-menu li .sub-menu{ list-style:none; margin:8px 0 0 14px; padding:0; display:grid; gap:8px; }
.nbmm-menu li .sub-menu a{ font-size:clamp(14px,1.8vw,18px); opacity:.9; }



/* ===== Overlayメニューの文字サイズを小さめに調整 ===== */
.nbmm-menu > li > a {
  font-size: clamp(14px, 1.8vw, 16px);
}

.nbmm-menu li .sub-menu a {
  font-size: clamp(14px, 1.6vw, 16px);
}


/* === PC幅（1025px以上）でトグルを下げる === 
@media (min-width: 1025px) {
  html body #nbMenuToggle.nbmm-toggle {
    top: 60px !important;  
  }
}*/
/* ← 今28pxなら +50px で78px に */

/* === Overlayメニューを常に2カラム表示 === */
.nbmm-menu {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr; /* ← 2カラム固定 */
  gap: 16px 32px;                /* 行間16px, 列間32px */
}


/* === Overlayメニューを常に2カラム表示（左寄せ） === */
.nbmm-menu {
  list-style: none;
  margin: 0;
  padding: 0;
  display: grid;
  grid-template-columns: 1fr 1fr; /* 2カラム固定 */
  gap: 16px 32px;                /* 行間16px, 列間32px */
}

.nbmm-menu > li {
  text-align: left;              /* ← 左寄せに変更 */
}

.nbmm-menu > li > a {
  display: block;                /* ← inline-block → block に変更すると揃いやすい */
  font-size: clamp(14px, 2vw, 20px);
  font-weight: 600;
  line-height: 1.4;
  color: #fff;
  text-decoration: none;
  padding: 8px 0;
  border-bottom: 1px solid transparent;
}

.nbmm-menu > li > a:hover {
  border-color: #fff;
}

/*menu icon*/
.nbmm-menu li a::before {
  content: "";
  display: inline-block;
  width: 20px;
  height: 20px;
  margin-right: 8px;
  background-size: contain;
  background-repeat: no-repeat;
  vertical-align: middle;
}

/* 個別アイコン */
.nbmm-menu .menu-home a::before {
  background-image: url("https://fex.co.jp/wp-content/uploads/2025/09/ico-home.webp");
}
.nbmm-menu .menu-shirt a::before {
  background-image: url("https://fex.co.jp/wp-content/uploads/2025/09/ico-shirt.webp");
}
.nbmm-menu .menu-suit a::before {
  background-image: url("https://fex.co.jp/wp-content/uploads/2025/09/ico-suit.webp");
}
.nbmm-menu .menu-jacket a::before {
  background-image: url("https://fex.co.jp/wp-content/uploads/2025/09/ico-jacket.webp");
}
.nbmm-menu .menu-pants a::before {
  background-image: url("https://fex.co.jp/wp-content/uploads/2025/09/ico-pants.webp");
}
.nbmm-menu .menu-vest a::before {
  background-image: url("https://fex.co.jp/wp-content/uploads/2025/09/ico-vest.webp");
}
.nbmm-menu .menu-belt a::before {
  background-image: url("https://fex.co.jp/wp-content/uploads/2025/09/ico-belt.webp");
}
.nbmm-menu .menu-tie a::before {
  background-image: url("https://fex.co.jp/wp-content/uploads/2025/09/ico-tie.webp");
}
.nbmm-menu .menu-account a::before {
  background-image: url("https://fex.co.jp/wp-content/uploads/2025/09/ico-account.webp");
}
.nbmm-menu .menu-contact a::before {
  background-image: url("https://fex.co.jp/wp-content/uploads/2025/09/ico-contact.webp");
}
.nbmm-menu .menu-features a::before {
  background-image: url("https://fex.co.jp/wp-content/uploads/2025/09/ico-features.webp");
}
.nbmm-menu .menu-arrival a::before {
  background-image: url("https://fex.co.jp/wp-content/uploads/2025/09/ico-arrival.webp");
}
.nbmm-menu .menu-ranking a::before {
  background-image: url("https://fex.co.jp/wp-content/uploads/2025/09/ico-ranking.webp");
}
.nbmm-menu .menu-delivery a::before {
  background-image: url("https://fex.co.jp/wp-content/uploads/2025/09/ico-delivery.webp");
}
.nbmm-menu .menu-cart a::before {
  background-image: url("https://fex.co.jp/wp-content/uploads/2025/09/ico_cart.webp");
}
/* 以下、同様に追加 */

