/* PC のグローバルナビ（2026-10-28）
   以前：ロゴの段とメニューの段が上下2段に分かれ、6項目を同じ幅で左寄せ・13px・装飾なし。
   変更：ロゴと同じ1段に右寄せで並べ、「お問い合わせ」はトップの「まずは無料で相談してみる」と同じオレンジのボタンに。
   今いる場所・マウスを載せた項目は下線（オレンジ）で示し、サブメニューは白い面に。
   HTML（partials/header.html・トップ等の本文内ヘッダー）は変えず、CSS だけで組み替えている。スマホ版（*_sp）には読み込まない。 */

@media print, screen and (min-width: 960px) {
  /* ヘッダーは画面上部に固定（2026-10-28 ユーザー指示）。固定した分の高さ（85px）を header の上に空けておく */
  header { position: relative; padding-top: 85px; }
  #headbox-bg { position: fixed; top: 0; left: 0; right: 0; z-index: 10000; }
  /* ページ内リンク（目次・トップのボタン等）で移動したとき、見出しがヘッダーの下に隠れないように */
  html { scroll-padding-top: 100px; }

  /* ロゴの段（85px）の右側にメニューを重ねる。1060px のコンテンツ幅の右端にそろえる */
  #st-menuwide {
    position: fixed;
    top: 0;
    right: max(10px, calc(50% - 530px + 10px));
    height: 85px;
    width: auto;
    margin: 0;
    padding: 0;
    background: none !important;
    border: 0 !important;
    z-index: 10001;
  }
  #st-menuwide nav.smanone { height: 100%; background: none !important; border: 0 !important; }
  #st-menuwide .menu {
    display: flex;
    align-items: center;
    gap: 4px;
    height: 100%;
    margin: 0;
    padding: 0;
    background: none !important;
  }
  #st-menuwide .menu > li {
    position: relative;
    float: none;
    width: auto !important;
    height: 100%;
    display: flex;
    align-items: center;
    border: 0 !important;
    background: none !important;
  }
  #st-menuwide .menu > li > a {
    position: relative;
    display: flex;
    align-items: center;
    height: 100%;
    padding: 0 14px !important;
    background: none !important;
    border: 0 !important;
    color: #fff !important;
    font-family: 'Noto Sans JP', 'Noto Sans JP Fallback', sans-serif;
    font-size: 15px;
    font-weight: 700;
    letter-spacing: 0.04em;
    line-height: 1;
    white-space: nowrap;
  }
  /* 下線：マウスを載せた項目・今いるページ（またはその親） */
  #st-menuwide .menu > li > a::after {
    content: '';
    position: absolute;
    left: 14px;
    right: 14px;
    bottom: 22px;
    height: 2px;
    background: #ff7702;
    transform: scaleX(0);
    transition: transform .18s ease-out;
  }
  #st-menuwide .menu > li:hover > a::after,
  #st-menuwide .menu > li:focus-within > a::after,
  #st-menuwide .menu > li.current-menu-item > a::after,
  #st-menuwide .menu > li.current-menu-ancestor > a::after,
  #st-menuwide .menu > li.current-post-ancestor > a::after { transform: scaleX(1); }
  /* サブメニューがある項目は小さな下向き矢印 */
  #st-menuwide .menu > li.menu-item-has-children > a { padding-right: 26px !important; }
  #st-menuwide .menu > li.menu-item-has-children > a::before {
    content: '';
    position: absolute;
    right: 12px;
    top: 50%;
    width: 6px;
    height: 6px;
    margin-top: -5px;
    border-right: 2px solid rgba(255,255,255,.7);
    border-bottom: 2px solid rgba(255,255,255,.7);
    transform: rotate(45deg);
  }
  /* テーマの JS が付ける矢印アイコンは使わない（上の CSS の矢印で表す） */
  #st-menuwide .menu a svg,
  #st-menuwide .menu a .fa { display: none !important; }

  /* お問い合わせ：オレンジのボタン（最後の項目） */
  #st-menuwide .menu > li:last-child { margin-left: 10px; }
  #st-menuwide .menu > li:last-child > a {
    height: auto;
    padding: 12px 20px !important;
    border-radius: 8px;
    background: #ff7702 !important;
    color: #fff !important;
    transition: background-color .15s;
  }
  #st-menuwide .menu > li:last-child > a::after,
  #st-menuwide .menu > li:last-child > a::before { content: none; }
  #st-menuwide .menu > li:last-child > a:hover { background: #e86a00 !important; }
  /* お問い合わせの下の「運営会社」は出さない（2026-10-28 ユーザー指示） */
  #st-menuwide .menu > li:last-child > .sub-menu { display: none !important; }

  /* サブメニュー：白い面 */
  #st-menuwide .menu .sub-menu {
    position: absolute;
    top: calc(100% - 14px);
    left: 0;
    width: auto !important;
    min-width: 240px;
    margin: 0;
    padding: 8px 0;
    background: #fff !important;
    border-radius: 8px;
    box-shadow: 0 12px 32px rgba(23,35,48,.22);
    text-align: left;
  }
  #st-menuwide .menu .sub-menu li {
    position: relative;
    width: auto !important;
    float: none;
    background: none !important;
    border: 0 !important;
  }
  #st-menuwide .menu .sub-menu a {
    display: block;
    width: auto !important;
    box-sizing: border-box;
    padding: 10px 20px !important;
    background: none !important;
    border: 0 !important;
    color: #172330 !important;
    font-size: 14px;
    font-weight: 400;
    line-height: 1.5;
    text-align: left;
    white-space: nowrap;
  }
  #st-menuwide .menu .sub-menu a:hover,
  #st-menuwide .menu .sub-menu a:focus-visible { background: #f2f4f7 !important; color: #172330 !important; }
  /* 3段目は右に出す */
  #st-menuwide .menu .sub-menu .sub-menu { top: -8px; left: 100% !important; margin-left: 0 !important; }
  #st-menuwide .menu .sub-menu li.menu-item-has-children > a { padding-right: 36px !important; }
  #st-menuwide .menu .sub-menu li.menu-item-has-children > a::after {
    content: '';
    position: absolute;
    right: 18px;
    top: 50%;
    width: 6px;
    height: 6px;
    margin-top: -4px;
    border-right: 2px solid #8a94a3;
    border-top: 2px solid #8a94a3;
    transform: rotate(45deg);
  }

  #st-menuwide a:focus-visible { outline: 2px solid #fff; outline-offset: -4px; }
  #st-menuwide .sub-menu a:focus-visible { outline-color: #ff7702; }

  /* メニューが段ごと消えた分、ヘッダーの高さはロゴの段（85px）だけに */
  #gazou-wide { min-height: 0; }
}
/* 幅の狭いPC（960〜1199px）：ロゴと重ならないよう詰める。「トップ」はロゴがトップへのリンクを兼ねるので省く */
@media screen and (min-width: 960px) and (max-width: 1199px) {
  #st-menuwide .menu { gap: 0; }
  #st-menuwide .menu > li:first-child { display: none; }
  #st-menuwide .menu > li > a { padding: 0 10px !important; font-size: 14px; }
  #st-menuwide .menu > li.menu-item-has-children > a { padding-right: 22px !important; }
  #st-menuwide .menu > li.menu-item-has-children > a::before { right: 9px; }
  #st-menuwide .menu > li > a::after { left: 10px; right: 10px; }
  #st-menuwide .menu > li:last-child > a { padding: 11px 16px !important; }
}
@media (prefers-reduced-motion: reduce) {
  #st-menuwide .menu > li > a::after { transition: none; }
}