@charset "UTF-8";

@media screen and (max-width: 1319px) {
  .sp-nav {
    /* ビューポート高さを超えるメニューをスクロール可能に */
    overflow-x: hidden;
    overflow-y: auto;
    -webkit-overflow-scrolling: touch; /* iOS の慣性スクロール */
    overscroll-behavior: contain; /* 背後のページへのスクロール連鎖を抑制 */

    /* モバイルブラウザのアドレスバー変動で切れないよう 100dvh も併用 */
    height: 100vh;
    height: 100dvh;
    max-height: 100vh;
    max-height: 100dvh;

    /* 最下部の項目が切れないよう余白を確保 */
    padding-bottom: 40px;
    box-sizing: border-box;
  }

  /* メニューオープン時は背面ページのスクロールを止める
   * （現行は max-width: 500px のみ。タブレット幅でも同様にロック） */
  body.active {
    overflow: hidden;
  }
}