/* ============================================================
   独立モバイルナビ（静的サイト移行用の置き換え）
   既存テーマの device-pc/device-mobile（User-Agent判定）に
   依存せず、画面幅だけで確実に切り替える。
   ============================================================ */

/* 旧ハンバーガーボタン・旧スライドパネルは常に無効化 */
#vk-mobile-nav-menu-btn,
#vk-mobile-nav { display: none !important; }

/* 新ハンバーガーボタン */
#my-mnav-btn{
  position:fixed; top:12px; right:12px; z-index:2147483000;
  width:44px; height:44px; padding:0;
  display:none; flex-direction:column; justify-content:center; align-items:center; gap:5px;
  background:rgba(255,255,255,.94); border:1px solid #333; border-radius:6px;
  cursor:pointer;
}
#my-mnav-btn span{
  display:block; width:22px; height:2px; background:#333;
  transition:transform .25s ease, opacity .2s ease;
}
#my-mnav-btn.is-open span:nth-child(1){ transform:translateY(7px) rotate(45deg); }
#my-mnav-btn.is-open span:nth-child(2){ opacity:0; }
#my-mnav-btn.is-open span:nth-child(3){ transform:translateY(-7px) rotate(-45deg); }

/* スライドインパネル */
#my-mnav-panel{
  position:fixed; top:0; right:0; height:100%; width:82%; max-width:320px;
  background:#fff; z-index:2147482999;
  box-shadow:-2px 0 14px rgba(0,0,0,.18);
  transform:translateX(100%); transition:transform .3s ease;
  overflow-y:auto; box-sizing:border-box; padding:76px 24px 32px;
}
#my-mnav-panel.is-open{ transform:translateX(0); }
#my-mnav-panel ul{ list-style:none; margin:0; padding:0; }
#my-mnav-panel li{ border-bottom:1px solid #eee; }
#my-mnav-panel > ul > li:first-child{ border-top:1px solid #eee; }
#my-mnav-panel a{
  display:block; padding:14px 4px; color:#333; text-decoration:none; font-size:15px;
}
/* 子メニューは常に展開（開閉ボタンに依存しない） */
#my-mnav-panel ul ul{ padding-left:14px; border-left:2px solid #eee; margin:0 0 6px 4px; }
#my-mnav-panel ul ul li{ border-bottom:none; }
#my-mnav-panel ul ul a{ font-size:14px; color:#666; padding:10px 4px; }
#my-mnav-panel ul ul a::before{ content:"– "; color:#bbb; }

/* 背景オーバーレイ */
#my-mnav-overlay{
  position:fixed; inset:0; background:rgba(0,0,0,.35); z-index:2147482998;
  opacity:0; pointer-events:none; transition:opacity .3s ease;
}
#my-mnav-overlay.is-open{ opacity:1; pointer-events:auto; }

body.my-mnav-lock{ overflow:hidden; }

/* 画面幅だけで出し分ける（旧テーマの device-pc/device-mobile は無視） */
@media (max-width:991.98px){
  #gMenu_outer{ display:none !important; }
  #my-mnav-btn{ display:flex !important; }
}
@media (min-width:992px){
  #gMenu_outer{ display:block !important; }
  #my-mnav-btn,#my-mnav-panel,#my-mnav-overlay{ display:none !important; }
}

@media (prefers-reduced-motion: reduce){
  #my-mnav-btn span,#my-mnav-panel,#my-mnav-overlay{ transition:none !important; }
}