/* ===== FAQ 2段階ドロップダウン =====
   site.css の以下のルールに負けないよう、セレクタの詳細度を高くしている
   - .theme--blue a:link / :hover / :visited { color:#0972c1 }   (0,2,1)
   - .gnav .gnavList__item a { display:flex; height:100%; ... }  (0,2,1)
   → 本ファイルは .gnav .gnavList__item--faq ... を前置して (0,3,1) 以上にする */

.gnav .gnavList__item--faq {
    position: relative;
}

.gnav .gnavList__item--faq .faqMenu,
.gnav .gnavList__item--faq .faqSub {
    list-style: none;
    margin: 0;
    padding: 0;
}

/* 大分類パネル（FAQにホバーで表示） */
.gnav .gnavList__item--faq .faqMenu {
    /* display: none の代わりに opacity と visibility で非表示にする */
    opacity: 0;
    visibility: hidden;

    position: absolute;
    top: 100%;
    right: 0;
    /* 画面右端からはみ出さないよう右揃え */
    min-width: 200px;
    z-index: 1000;

    /* ホバー解除時は遅延なしですぐに消える設定 */
    transition: opacity 0.2s ease, visibility 0.2s ease;
}

/* ★親要素にホバーした時（大分類の表示時間差） */
.gnav .gnavList__item--faq:hover>.faqMenu,
.gnav .gnavList__item--faq:focus-within>.faqMenu {
    opacity: 1;
    visibility: visible;

    /* ホバーしてから 0.25秒後に大分類を表示 */
    transition-delay: 0.25s;
}

.gnav .gnavList__item--faq .faqMenu__item {
    position: relative;
}

/* リンク共通（通常・訪問済み・ホバー全て文字色を白に固定） */
.gnav .gnavList__item--faq .faqMenu a,
.gnav .gnavList__item--faq .faqMenu a:link,
.gnav .gnavList__item--faq .faqMenu a:visited,
.gnav .gnavList__item--faq .faqMenu a:hover {
    display: block;
    /* site.css の display:flex / height:100% を打ち消す */
    height: auto;
    background: #0972c1;
    /* site.css のテーマ青に合わせた */
    color: #fff;
    padding: 10px 16px;
    border: 1px solid #dddddd;
    border-top: none;
    /* 上だけ非表示にする */
    text-decoration: none;
    line-height: 1.4;
    white-space: nowrap;
}

.gnav .gnavList__item--faq .faqMenu__item>a::before {
    content: "\2039";
    margin-right: 10px;
}

/* ‹ */
.gnav .gnavList__item--faq .faqMenu a:hover {
    background: #0253af;
}

/* 小分類パネル（大分類にホバーで左側に展開） */
.gnav .gnavList__item--faq .faqSub {
    /* display: none の代わりに opacity と visibility で非表示にする */
    opacity: 0;
    visibility: hidden;

    position: absolute;
    top: 0;
    right: 100%;
    min-width: 220px;

    /* ホバー解除時は遅延なしですぐに消える設定 */
    transition: opacity 0.2s ease, visibility 0.2s ease;
}

/* ★大分類項目にホバーした時（小分類の表示時間差） */
.gnav .gnavList__item--faq .faqMenu__item:hover>.faqSub,
.gnav .gnavList__item--faq .faqMenu__item:focus-within>.faqSub {
    opacity: 1;
    visibility: visible;

    /* 大分類にホバーしてから 0.25秒後に小分類を表示 */
    transition-delay: 0.25s;
}

/* スマホ／タブレット（ドロワーメニュー）：ホバー・タップに関係なく、FAQの全リストを常時表示
   ※PC用は opacity / visibility で隠しているため、ここで必ず opacity:1 / visibility:visible に戻す
   ※ドロワーの背景は青なので、PC用の青いパネルは透明にして白文字で表示する */
@media only screen and (max-width: 979px) {

    .gnav .gnavList__item--faq .faqMenu,
    .gnav .gnavList__item--faq .faqSub,
    .gnav .gnavList__item--faq:hover>.faqMenu,
    .gnav .gnavList__item--faq:focus-within>.faqMenu,
    .gnav .gnavList__item--faq .faqMenu__item:hover>.faqSub,
    .gnav .gnavList__item--faq .faqMenu__item:focus-within>.faqSub {
        display: block;
        position: static;
        min-width: 0;
        margin: 0;
        padding: 0;
        opacity: 1;
        visibility: visible;
        transition: none;
        transition-delay: 0s;
    }

    /* リンク共通：PC用の青背景・枠線・折り返し禁止を打ち消す */
    .gnav .gnavList__item--faq .faqMenu a,
    .gnav .gnavList__item--faq .faqMenu a:link,
    .gnav .gnavList__item--faq .faqMenu a:visited,
    .gnav .gnavList__item--faq .faqMenu a:hover {
        background: transparent;
        color: #fff;
        border: none;
        white-space: normal;
        text-align: center;
    }

    /* 大分類：見出し扱い（小さめ・太字・やや薄く） */
    .gnav .gnavList__item--faq .faqMenu__item>a,
    .gnav .gnavList__item--faq .faqMenu__item>a:link,
    .gnav .gnavList__item--faq .faqMenu__item>a:visited,
    .gnav .gnavList__item--faq .faqMenu__item>a:hover {
        padding: 12px 15px 4px;
        font-size: 13px;
        font-weight: bold;
        letter-spacing: .08em;
        opacity: .8;
        text-decoration: underline;   /* スマホのみ：大分類に下線 */
        text-underline-offset: 4px;
    }

    .gnav .gnavList__item--faq .faqMenu__item>a::before {
        content: "";
        margin: 0;
    }

    /* 小分類：タップしやすい通常のリンク */
    .gnav .gnavList__item--faq .faqSub a,
    .gnav .gnavList__item--faq .faqSub a:link,
    .gnav .gnavList__item--faq .faqSub a:visited,
    .gnav .gnavList__item--faq .faqSub a:hover {
        padding: 10px 15px;
        font-size: 13px;   /* 大分類と同じ大きさ */
        color: #fff;       /* ナビメニューと同じ白 */
        opacity: 1;
    }

    .gnav .gnavList__item--faq .faqSub a:hover {
        background: rgba(255, 255, 255, .15);
    }

    /* 最後の大分類の下に余白 */
    .gnav .gnavList__item--faq .faqMenu__item:last-child {
        padding-bottom: 8px;
    }
}