/* =========================================================
   スマホ専用：ハンバーガーメニュー
   目的：
   1) メニュー項目の間隔を「詰める」（※広げない）
   2) 全部開いても固まりにくく、下までスクロールで見えるようにする
   方針：
   ・既存のレイアウト(位置/背景/幅)は極力いじらない
   ・「スクロール可能化」と「余白の圧縮」だけ当てる
   ========================================================= */

@media (max-width: 980px){

  /* ===== A) パネル（外枠）になり得る要素を“控えめ”にスクロール可能化 =====
     ※ position:fixed 等は付けない（既存の動作を崩さないため）
  */
  :is(
    #spMenu, #sp-menu, #drawer, #drawerMenu, #globalNavSp, #global-nav-sp,
    .spMenu, .sp-menu, .drawer, .drawerMenu, .drawer-menu,
    .hamburgerMenu, .hamburger-menu, .menuPanel, .menu-panel,
    .globalNavSp, .global-nav-sp,
    .headerSpMenu, .header-sp-menu,
    .header2MenuAreaSp, .header2MenuAreaSP, .header2MenuArea-sp,
    /* よくある“スマホメニュー” */
    .spNav, .sp-nav, .spGnav, .sp-gnav, .spMenuWrap, .sp-menu-wrap,
    nav.sp, nav.spNav, nav.sp-nav
  ){
    /* 下まで見える（パネル内スクロール） */
    max-height: 100dvh;
    overflow-y: auto;
    overflow-x: hidden;
    -webkit-overflow-scrolling: touch;
    overscroll-behavior: contain;

    /* ここが原因で「間隔が広がる」ことがあるので、余計な padding は付けない */
    padding-top: 0 !important;
    padding-bottom: 0 !important;
  }

  @supports not (max-height: 100dvh){
    :is(
      #spMenu, #sp-menu, #drawer, #drawerMenu, #globalNavSp, #global-nav-sp,
      .spMenu, .sp-menu, .drawer, .drawerMenu, .drawer-menu,
      .hamburgerMenu, .hamburger-menu, .menuPanel, .menu-panel,
      .globalNavSp, .global-nav-sp,
      .headerSpMenu, .header-sp-menu,
      .header2MenuAreaSp, .header2MenuAreaSP, .header2MenuArea-sp,
      .spNav, .sp-nav, .spGnav, .sp-gnav, .spMenuWrap, .sp-menu-wrap,
      nav.sp, nav.spNav, nav.sp-nav
    ){
      max-height: 100vh;
    }
  }

  /* ===== B) 間隔を詰める：li / a の余白を小さく（広げない） ===== */
  :is(
    #spMenu, #sp-menu, #drawer, #drawerMenu, #globalNavSp, #global-nav-sp,
    .spMenu, .sp-menu, .drawer, .drawerMenu, .drawer-menu,
    .hamburgerMenu, .hamburger-menu, .menuPanel, .menu-panel,
    .globalNavSp, .global-nav-sp,
    .headerSpMenu, .header-sp-menu,
    .header2MenuAreaSp, .header2MenuAreaSP, .header2MenuArea-sp,
    .spNav, .sp-nav, .spGnav, .sp-gnav, .spMenuWrap, .sp-menu-wrap,
    nav.sp, nav.spNav, nav.sp-nav
  ) ul{
    margin: 0 !important;
    padding: 0 !important;
  }

  :is(
    #spMenu, #sp-menu, #drawer, #drawerMenu, #globalNavSp, #global-nav-sp,
    .spMenu, .sp-menu, .drawer, .drawerMenu, .drawer-menu,
    .hamburgerMenu, .hamburger-menu, .menuPanel, .menu-panel,
    .globalNavSp, .global-nav-sp,
    .headerSpMenu, .header-sp-menu,
    .header2MenuAreaSp, .header2MenuAreaSP, .header2MenuArea-sp,
    .spNav, .sp-nav, .spGnav, .sp-gnav, .spMenuWrap, .sp-menu-wrap,
    nav.sp, nav.spNav, nav.sp-nav
  ) li{
    margin: 0 !important;
    padding: 0 !important;
  }

  /* メニューのリンク：上下を詰める（現状より“広げない”数値） */
  :is(
    #spMenu, #sp-menu, #drawer, #drawerMenu, #globalNavSp, #global-nav-sp,
    .spMenu, .sp-menu, .drawer, .drawerMenu, .drawer-menu,
    .hamburgerMenu, .hamburger-menu, .menuPanel, .menu-panel,
    .globalNavSp, .global-nav-sp,
    .headerSpMenu, .header-sp-menu,
    .header2MenuAreaSp, .header2MenuAreaSP, .header2MenuArea-sp,
    .spNav, .sp-nav, .spGnav, .sp-gnav, .spMenuWrap, .sp-menu-wrap,
    nav.sp, nav.spNav, nav.sp-nav
  ) a{
    /* ここが“広がる”原因になりやすいので、確実に詰めた値を指定 */
    padding: 10px 16px !important;
    line-height: 1.15 !important;
  }

  /* 右の「>」アイコンが絶対配置で余白を食う場合の調整（崩さない範囲） */
  :is(
    #spMenu, #sp-menu, #drawer, #drawerMenu, #globalNavSp, #global-nav-sp,
    .spMenu, .sp-menu, .drawer, .drawerMenu, .drawer-menu,
    .hamburgerMenu, .hamburger-menu, .menuPanel, .menu-panel,
    .globalNavSp, .global-nav-sp,
    .headerSpMenu, .header-sp-menu,
    .header2MenuAreaSp, .header2MenuAreaSP, .header2MenuArea-sp,
    .spNav, .sp-nav, .spGnav, .sp-gnav, .spMenuWrap, .sp-menu-wrap,
    nav.sp, nav.spNav, nav.sp-nav
  ) a::after{
    /* 既存が無い場合は影響なし */
    margin-top: 0 !important;
  }

  /* ===== C) 「全部開くと固まる」対策：重いアニメを無効化（当たれば効く） ===== */
  :is(.subMenu, .sub-menu, .spSub, .sp-sub, .drawerSub, .drawer-sub, .gNavSub, .gnav-sub) *{
    transition: none !important;
    animation: none !important;
  }
}