/* ============================================================
   グローバルメニュー（メガメニュー・2026-09-23）
   ・第1階層＝入口、パネルは左に見出し＋説明、右にリンク
   ・パネルの基準はヘッダー全体。項目側に position を置かない
   ============================================================ */

@media screen and (min-width: 1025px) {

  /* ---- 並び ---- */
  .main-header-content .main-navigation ul.qc-nav {
    display: flex !important;
    align-items: center;
    gap: 2px;
    justify-content: flex-end;
    list-style: none;
    margin: 0;
    padding: 0;
    flex-wrap: nowrap;
  }
  .main-navigation ul.qc-nav > li.qc-nav__item {
    position: static;          /* パネルの基準をヘッダーにする */
    margin: 0;
    padding: 0;
    list-style: none;
  }

  /* ---- 入口 ---- */
  .main-navigation ul.qc-nav > li > .qc-nav__top {
    display: inline-flex;
    align-items: center;
    gap: 6px;
    padding: 10px 16px;
    font-family: inherit;
    font-size: 13px;
    font-weight: 700;
    letter-spacing: .02em;
    line-height: 1.4;
    color: #101a2b;
    background: none;
    border: 0;
    border-radius: 0;
    cursor: pointer;
    white-space: nowrap;
    text-decoration: none;
    transition: color .18s ease;
  }
  .main-navigation ul.qc-nav > li > .qc-nav__top::after,
  .main-navigation ul.qc-nav > li > .qc-nav__top::before {
    content: none !important;  /* 旧デザインの下線・矢印を出さない */
  }
  .main-navigation ul.qc-nav > li:hover > .qc-nav__top,
  .main-navigation ul.qc-nav > li.is-open > .qc-nav__top {
    color: #1D4382;
    background: none;
  }
  .qc-nav__caret {
    width: 7px;
    height: 7px;
    border-right: 1.5px solid currentColor;
    border-bottom: 1.5px solid currentColor;
    transform: rotate(45deg) translate(-2px, -2px);
    opacity: .5;
    transition: transform .2s ease;
  }
  .qc-nav__item.is-open > .qc-nav__top .qc-nav__caret {
    transform: rotate(225deg) translate(-2px, -2px);
  }

  /* 現在のページ */
  .main-navigation ul.qc-nav > li.current-menu-item > .qc-nav__top,
  .main-navigation ul.qc-nav > li.current-menu-parent > .qc-nav__top,
  .main-navigation ul.qc-nav > li.current-menu-ancestor > .qc-nav__top {
    color: #1D4382;
    background: none;
  }

  /* お問い合わせだけ塗りつぶし。ナビの中で唯一のボタンなので
     高さを出し、影と沈み込みでボタンらしさを付ける */
  .main-navigation ul.qc-nav > li.qc-nav__item--cta > .qc-nav__top {
    margin-left: 14px;
    padding: 15px 24px;
    background: #1D4382;
    color: #ffffff;
    border-radius: 4px;
    box-shadow: 0 2px 6px rgba(29, 67, 130, .28);
    transition: background .18s ease, box-shadow .18s ease, transform .18s ease;
  }
  .main-navigation ul.qc-nav > li.qc-nav__item--cta:hover > .qc-nav__top,
  .main-navigation ul.qc-nav > li.qc-nav__item--cta > .qc-nav__top:focus-visible {
    background: #16345f;
    color: #ffffff;
    box-shadow: 0 4px 12px rgba(29, 67, 130, .34);
    transform: translateY(-1px);
  }
  .main-navigation ul.qc-nav > li.qc-nav__item--cta > .qc-nav__top:active {
    transform: translateY(0);
    box-shadow: 0 1px 4px rgba(29, 67, 130, .3);
  }
  @media (prefers-reduced-motion: reduce) {
    .main-navigation ul.qc-nav > li.qc-nav__item--cta > .qc-nav__top { transition: none; }
    .main-navigation ul.qc-nav > li.qc-nav__item--cta:hover > .qc-nav__top { transform: none; }
  }

  /* ---- パネル ---- */
  /* テーマの .main-navigation に position:relative が付いており、
     そのままだとパネルがナビ幅（680px）に収まってしまう。
     .main-header-original を基準にして画面幅いっぱいに広げる */
  /* 追従ヘッダー（.main-header-clone）は position:fixed のままにする。
     relative を上書きすると固定が外れてページ内を流れてしまう。
     fixed 自体がパネルの基準になるので、ナビ側の relative を外すだけでよい */
  .main-header-original { position: relative; }
  .main-header-original .main-navigation,
  .main-header-clone .main-navigation { position: static; }

  .qc-mega__panel {
    position: absolute;
    top: 100%;
    left: 50%;
    margin-left: -50vw;
    width: 100vw;
    z-index: 120;
    background: #ffffff;
    border-top: 3px solid #1D4382;
    box-shadow: 0 18px 34px rgba(16, 26, 43, .1);
    opacity: 0;
    visibility: hidden;
    transform: translateY(-6px);
    transition: opacity .18s ease, transform .18s ease, visibility .18s;
  }
  /* JS が動かない環境でも開くよう、CSS のホバーでも表示する。
     JS は Esc や外側クリックで閉じる用途と、キーボード操作の補助 */
  .qc-nav__item--mega:hover > .qc-mega__panel,
  .qc-nav__item--mega:focus-within > .qc-mega__panel,
  .qc-nav__item.is-open > .qc-mega__panel {
    opacity: 1;
    visibility: visible;
    transform: none;
  }
  @media (prefers-reduced-motion: reduce) {
    .qc-mega__panel { transition: none; }
  }

  /* 親テーマはナビの高さ合わせに line-height: 52px を置いており、
     継承するとパネル内の行がすべて52px高になる */
  .main-navigation .qc-mega__panel { line-height: 1.6; }

  /* 親テーマのメニュー内テキストは white-space: nowrap。
     パネル内の文章は折り返させる */
  .main-navigation .qc-mega__title,
  .main-navigation .qc-mega__lead,
  .main-navigation .qc-mega__all,
  .main-navigation .qc-mega__grouphead,
  .main-navigation .qc-mega__sub,
  .main-navigation .qc-mega__news-title {
    white-space: normal;
    overflow-wrap: anywhere;
  }

  .main-navigation .qc-mega__inner {
    max-width: 1000px;
    margin: 0 auto;
    padding: 32px 32px 36px;
    display: grid;
    grid-template-columns: 300px 1fr;
    gap: 44px;
    align-items: stretch;
  }

  /* 左側はアイキャッチで余白を埋める。
     右側のリンクが多いほど画像が縦に伸びる */
  .main-navigation .qc-mega__intro {
    display: flex;
    flex-direction: column;
    min-height: 0;
  }
  /* flex-basis を 0 にして、画像の実寸ではなく
     右カラムが残した高さに合わせて伸縮させる */
  .main-navigation .qc-mega__figure {
    display: block;
    flex: 1 1 0;
    min-height: 150px;
    margin: 20px 0 0;
    overflow: hidden;
    border-radius: 4px;
  }
  .main-navigation .qc-mega__figure img {
    display: block;
    width: 100%;
    height: 100%;
    object-fit: cover;
    object-position: center;
  }
  .main-navigation .qc-mega__title {
    font-size: 19px;
    font-weight: 900;
    line-height: 1.45;
    color: #101a2b;
    margin: 0 0 10px;
  }
  .main-navigation .qc-mega__lead {
    font-size: 12.5px;
    line-height: 1.85;
    color: #5d6a80;
    margin: 0 0 16px;
  }
  .main-navigation .qc-mega__all {
    display: inline-block;
    align-self: flex-start;   /* intro は縦flex。stretch で下線が伸びるのを防ぐ */
    font-size: 12px;
    font-weight: 700;
    line-height: 1.6;
    color: #1D4382;
    text-decoration: none;
    border: 0;
    border-bottom: 1px solid currentColor;
    padding: 0 0 2px;
    margin: 0;
  }

  .qc-mega__cols {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 30px;
  }
  .main-navigation .qc-mega__grouphead {
    font-size: 10.5px;
    letter-spacing: .18em;
    line-height: 1.4;
    color: #5d6a80;
    margin: 0 0 12px;
    padding: 0;
    font-weight: 700;
  }
  /* パネル内のリストは、親テーマと旧ナビのサブメニュー用スタイル
     （画面外へ飛ばす left:-9999px / opacity:0 と display:flex !important）に
     乗っ取られる。.main-navigation を前置して特異度で打ち消す */
  .main-navigation ul.qc-mega__list,
  .main-navigation ul.qc-mega__news-list {
    position: static;
    top: auto;
    left: auto;
    width: auto;
    opacity: 1;
    box-shadow: none;
    margin: 0;
    padding: 0;
    list-style: none;
  }
  .main-navigation ul.qc-mega__list {
    display: grid !important;
    grid-template-columns: 1fr;
    justify-content: stretch;
    justify-items: stretch;
    gap: 1px;
  }
  .main-navigation ul.qc-mega__list > li {
    position: static;
    margin: 0;
    padding: 0;
    list-style: none;
  }
  .main-navigation ul.qc-mega__list > li > a {
    display: block;
    padding: 7px 10px;
    margin-left: -10px;
    font-size: 13.5px;
    font-weight: 500;
    line-height: 1.6;
    color: #101a2b;
    text-decoration: none;
    border: 0;
    border-radius: 3px;
  }
  .main-navigation ul.qc-mega__list > li > a::before,
  .main-navigation ul.qc-mega__list > li > a::after,
  .main-navigation ul.qc-mega__news-list > li > a::before,
  .main-navigation ul.qc-mega__news-list > li > a::after {
    content: none !important;
  }
  .main-navigation ul.qc-mega__list > li > a:hover,
  .main-navigation ul.qc-mega__list > li > a:focus-visible {
    background: rgba(29, 67, 130, .07);
    color: #1D4382;
  }
  .main-navigation .qc-mega__sub {
    display: block;
    font-size: 11.5px;
    font-weight: 400;
    color: #5d6a80;
  }

  /* ---- ニュース ---- */
  .qc-mega__news-cols {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 0 30px;
  }
  .main-navigation ul.qc-mega__news-list {
    display: grid !important;
    grid-template-columns: 1fr;
    justify-content: stretch;
    justify-items: stretch;
    gap: 2px;
    align-content: start;
  }
  .main-navigation ul.qc-mega__news-list > li {
    position: static;
    margin: 0;
    padding: 0;
    list-style: none;
  }
  .main-navigation ul.qc-mega__news-list > li > a {
    display: grid;
    grid-template-columns: 82px 1fr;
    gap: 14px;
    align-items: baseline;
    padding: 9px 10px;
    margin-left: -10px;
    border: 0;
    border-radius: 3px;
    color: #101a2b;
    text-decoration: none;
  }
  .main-navigation ul.qc-mega__news-list > li > a:hover,
  .main-navigation ul.qc-mega__news-list > li > a:focus-visible { background: rgba(29, 67, 130, .07); }
  .main-navigation .qc-mega__news-list time {
    font-size: 11px;
    color: #5d6a80;
    letter-spacing: .04em;
    font-variant-numeric: tabular-nums;
  }
  .main-navigation .qc-mega__news-title {
    font-size: 13px;
    line-height: 1.6;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    overflow: hidden;
  }
  .main-navigation ul.qc-mega__news-list > li > a:hover .qc-mega__news-title { color: #1D4382; }
}

/* ============================================================
   狭い画面：従来どおりドロワー内の入れ子リストとして出す
   ============================================================ */
@media screen and (max-width: 1024px) {
  .qc-mega__panel {
    position: static;
    opacity: 1;
    visibility: visible;
    transform: none;
    box-shadow: none;
    border-top: 0;
    background: transparent;
  }
  .qc-mega__inner {
    display: block;
    padding: 0 0 0 14px;
    max-width: none;
  }
  .qc-mega__intro { display: none; }          /* 見出し・説明はドロワーでは省く */
  .qc-mega__cols { display: block; }
  /* ドロワーの地は白。見出しは白半透明だと消えるので濃い色にする */
  .qc-mega__grouphead {
    font-size: 11px;
    letter-spacing: .12em;
    color: #5d6a80;
    margin: 14px 0 4px;
    font-weight: 700;
  }
  /* デスクトップ同様、サブメニュー用の隠しスタイルを打ち消す */
  .main-navigation ul.qc-mega__list,
  .main-navigation ul.qc-mega__news-list,
  .qc-mega__news-cols {
    display: block !important;
    position: static;
    top: auto;
    left: auto;
    width: auto;
    opacity: 1;
    box-shadow: none;
    margin: 0;
    padding: 0;
    list-style: none;
  }
  .main-navigation ul.qc-mega__list > li,
  .main-navigation ul.qc-mega__news-list > li {
    position: static;
    margin: 0;
    padding: 0;
    list-style: none;
  }
  /* 親テーマのメニューリンクは white-space: nowrap。
     ニュースの見出しが折り返さず画面外へ出るので戻す */
  .main-navigation ul.qc-mega__list > li > a,
  .main-navigation ul.qc-mega__news-list > li > a {
    display: block;
    padding: 8px 0;
    margin: 0;
    font-size: 13px;
    line-height: 1.6;
    white-space: normal;
    overflow-wrap: anywhere;
  }
  .main-navigation .qc-mega__news-list time {
    display: block;
    font-size: 10.5px;
    opacity: .7;
    margin-bottom: 2px;
  }
  .main-navigation .qc-mega__news-title {
    display: block;
    font-size: 13px;
    line-height: 1.6;
    white-space: normal;
  }
  .qc-mega__group { margin-bottom: 6px; }
  .qc-nav__caret { display: none; }
  .qc-nav__top {
    display: block;
    width: 100%;
    text-align: left;
    background: none;
    border: 0;
    font-family: inherit;
    font-size: inherit;
    color: inherit;
    padding: 10px 0;
    cursor: pointer;
  }
}