/******* Do not edit this file *******
Simple Custom CSS and JS - by Silkypress.com
Saved: Aug 25 2025 | 01:58:20 */
/* ========== CSS グローバルナビ ========== */

/*グローバルナビのロゴ 非表示*/
/*本文　優先順位5*/

#access li.menu-item-1721,
  #access li.menu-item-2288 {
    display: none !important;
  }


#bg_image {
  display: none !important;
}

/* ─── グローバルナビ カラー上書き ─── */

/* メインメニュー全体 */
#access,
#nav-toggle {
  background-color: #FFFFFF !important;
}

/* メインメニューのリンク文字色 */
#access a,
#nav-toggle span {
  color: #000000 !important;
}

/* 各メニュー項目（通常／ホバー／選択中） */
#access > .menu > ul > li,
#access > .menu > ul > li:hover,
#access > .menu > ul > li.current_page_item,
#access > .menu > ul > li.current-menu-item,
#access > .menu > ul > li.current_page_ancestor,
#access > .menu > ul > li.current-menu-ancestor {
  background-color: #FFFFFF !important;
}

/* サブメニュー全体 */
#access ul ul,
#access ul ul li {
  background-color: #FFFFFF !important;
}

/* サブメニューのリンク文字色 */
#access ul ul li a {
  color: #000000 !important;
}

/* サブメニュー項目のホバー */
#access ul ul li:hover {
  background-color: #FFFFFF !important;
}

/* ─── 以降、あなたの既存のブレイクポイント定義 ─── */
@media screen and (max-width: 800px) {

}



/* 0～800px のあいだでも nav をタブレット用の表示にする */
@media screen and (max-width: 800px) {
  #access > .menu {
    max-width: none !important;
    width: 100%      !important;
  }
  #access > .menu > ul {
    display: flex              !important;
    justify-content: flex-end  !important;
    flex-wrap: nowrap          !important;
  }
  /* 必要ならロゴの切り替えもここで */
}


/* ～428px（小スマホ） */
@media screen and (max-width: 428px) {
  /* ハンバーガー有効化 */
  #access > .menu {
    max-width: none !important;
  }
  #access > .menu > ul {
    display: block !important;
    align-items: initial !important;
    justify-content: initial !important;
  }
  #access > .menu > ul > li {
    margin: 0 !important;
  }

  /* ロゴ非表示 */
  #access li.menu-item-1721,
  #access li.menu-item-2288 {
    display: none !important;
  }
  /* ヘッダー画像100% */
  #access > .menu > ul > li.menu-item-1721 {
    width: 100% !important;
    margin: 0 !important;
    padding: 0 !important;
  }
  #access > .menu > ul > li.menu-item-1721 img.menu-image {
    display: block !important;
    width: 100% !important;
    height: auto !important;
    object-fit: contain !important;
  }
}

/* ─── 429px～640px ───
   ①の「≤640px」と同じ挙動をここでも適用 */
   @media screen and (min-width: 429px) and (max-width: 640px) {
    /* 全幅フレックスの影響を打ち消し */
    #access > .menu {
      max-width: none !important;
    }
    /* テーマ純正ハンバーガーJSが display を切り替えられるよう block に戻す */
    #access > .menu > ul {
      display: block !important;
      align-items: initial !important;
      justify-content: initial !important;
    }
    /* 間隔リセット */
    #access > .menu > ul > li {
      margin: 0 !important;
    }
    /* ハンバーガーボタンを表示 */
    #nav-toggle {
      display: block !important;
      cursor: pointer !important;
    }
    /* ロゴは非表示 */
    #access li.menu-item-1721,
    #access li.menu-item-2288 {
      display: none !important;
    }
    /* ヘッダー画像100% */
    #access > .menu > ul > li.menu-item-1721 {
      width: 100% !important;
      margin: 0 !important;
      padding: 0 !important;
    }
    #access > .menu > ul > li.menu-item-1721 img.menu-image {
      display: block !important;
      width: 100% !important;
      height: auto !important;
      object-fit: contain !important;
    }
  }
  
  /* ─── 641px～768px ───
   ハンバーガー・ロゴ非表示、メニュー均等配置 */
@media screen and (min-width: 641px) and (max-width: 768px) {
  /* ハンバーガーアイコンを隠す */
  #nav-toggle {
    display: none !important;
  }

  /* ロゴ（大・小）を隠す */
  #access li.menu-item-1721,
  #access li.menu-item-2288 {
    display: none !important;
  }

  /* メニューを横並び／均等配置 */
  #access > .menu > ul {
    display: flex              !important;
    justify-content: space-around !important;
    align-items: center        !important;
    flex-wrap: nowrap          !important;
  }
}



/* 769px～1280px（タブレット） */
@media screen and (min-width: 769px) and (max-width: 1280px) {
  /* 右寄せ＋折り返し禁止 */
  #access > .menu > ul {
    display: flex              !important;
    align-items: center        !important;
    justify-content: flex-end  !important;
    flex-wrap: nowrap          !important; /* 折り返し禁止 */
  }

  /* ロゴ項目を左へ */
  #access > .menu > ul > li.menu-item-1721,
  #access > .menu > ul > li.menu-item-2288 {
    margin-right: auto         !important;
  }

  /* メニュー項目間の間隔を狭める */
  #access > .menu > ul > li:not(.menu-item-1721):not(.menu-item-2288) {
    margin-left: 10px          !important;
  }

  /* 大きいロゴは非表示、小さいロゴを表示 */
  #access li.menu-item-1721 { display: none !important; }
  #access li.menu-item-2288 { display: block !important; }

  /* （必要なら）ロゴ縮小調整 */
  #access > .menu > ul > li.menu-item-1721 img.menu-image {
    width: min(200px, 20vw)    !important;
    height: auto               !important;
  }
}


/* 1281px～（PC） */
@media screen and (min-width: 1281px) {
  /* 幅を100%にしつつ、最大幅を1280pxに制限して中央寄せ */
  #access > .menu {
    width: 100%            !important;
    max-width: 1280px      !important;
    margin: 0 auto         !important;
    padding: 0             !important;
  }
  #access > .menu > ul {
    display: flex              !important;
    align-items: center        !important;
    justify-content: space-between !important;
  }
  #access > .menu > ul > li.menu-item-1721 {
    margin-right: auto !important;
  }
  #access > .menu > ul > li:not(.menu-item-1721) {
    margin-left: 20px !important;
  }
  /* ロゴ：大→表示、小→非表示 */
  #access li.menu-item-1721 { display: block !important; }
  #access li.menu-item-2288 { display: none !important; }
}

