/* ==========================================================
   faq.css - よくあるご質問ページ
   ========================================================== */

/* --- h2: 下層ページ標準 30px / 600 / 0.1em --- */
.faq-section h2 {
    font-size: 30px;
    font-weight: 600;
    letter-spacing: 0.1em;
    margin-top: 0;
}

/* --- コンテンツ幅 1000px --- */
.faq-inner {
    max-width: 1000px;
    margin: 0 auto;
    padding-top: 370px;
    padding-bottom: 250px;
}

/* ==========================================================
   ナビボタン（カテゴリアンカー）
   ========================================================== */
.faq-nav {
    display: flex;
    justify-content: center;
    gap: 10px;
    margin-top: 50px;
}

.faq-nav-btn {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 140px;
    height: 36px;
    font-size: 16px;
    font-family: var(--font-serif);
    color: #7b7b7b;
    text-decoration: none;
    background-color: #fff;
    border: none;
    letter-spacing: 0.05em;
    transition: opacity 0.3s;
}

.faq-nav-btn:hover {
    opacity: 0.7;
}

/* ==========================================================
   カテゴリセクション
   ========================================================== */
.faq-category {
    margin-top: 170px;
}

.faq-category + .faq-category {
    margin-top: 140px;
}

.faq-category-title {
    font-size: 28px;
    font-weight: 600;
    color: #493d37;
    letter-spacing: 0.1em;
    text-align: left;
    padding-left: 120px;
    padding-bottom: 20px;
    border-bottom: 1px solid #7f6760;
    margin: 0 0 50px;
}

/* ==========================================================
   Q&A リスト
   ========================================================== */
.faq-list {
    margin: 0;
    padding: 0;
}

.faq-item {
    padding-left: 120px;
}

.faq-item + .faq-item {
    border-top: 1px solid #7f6760;
    padding-top: 40px;
    margin-top: 40px;
}

.faq-q,
.faq-a {
    display: flex;
    align-items: baseline;
    gap: 20px;
    margin: 0;
    font-size: 16px;
    line-height: 30px;
}

.faq-a {
    margin-top: 0;
}

.faq-label {
    flex-shrink: 0;
    font-family: var(--font-serif);
}

.faq-a-detail {
    line-height: 30px;
}

.faq-a-detail p {
    margin: 0 0 20px;
}

.faq-a-detail p:last-child {
    margin-bottom: 0;
}

.faq-closing {
    padding-left: 120px;
    margin-top: 40px;
    font-size: 16px;
    line-height: 30px;
}

/* ==========================================================
   レスポンシブ（SP: 768px以下 / 650pxカンプ基準）
   計算式: 実測px / 650 * 100 = vw
   ========================================================== */
@media (max-width: 768px) {
    .faq-section h2 {
        font-size: var(--sp-h2-fs);
    }

    .faq-inner {
        max-width: none;
        padding-top: 26.15vw;
        padding-left: 4.62vw;
        padding-right: 4.62vw;
        padding-bottom: 38.46vw;
    }

    .faq-nav {
        flex-wrap: wrap;
        gap: 1.54vw;
        margin-top: 7.69vw;
    }

    .faq-nav-btn {
        width: 29.54vw;
        height: 7.08vw;
        font-size: 3.08vw;
    }

    .faq-category {
        margin-top: 15.38vw;
    }

    .faq-category + .faq-category {
        margin-top: 18.46vw;
    }

    .faq-category-title {
        font-size: 4.31vw;
        padding-left: 0;
        padding-bottom: 3.08vw;
        border-bottom: 1px solid #7f6760;
        margin: 0 0 3.08vw;
    }

    .faq-item {
        padding-left: 0;
    }

    .faq-q,
    .faq-a {
        font-size: 3.08vw;
        gap: 3.08vw;
        line-height: 6.15vw;
    }

    .faq-item + .faq-item {
        padding-top: 3.08vw;
        margin-top: 3.08vw;
    }

    .faq-closing {
        padding-left: 0;
        font-size: 3.08vw;
        line-height: 6.15vw;
    }
}
