/* 11-faq.css - Aのアイコンのみを左に強制移動 */

/* SWELL標準リセット */
.sw-faq__question::before,
.sw-faq__answerInner::before,
.sw-faq__item dt::before,
.sw-faq__item dd::before {
    display: none !important;
    content: none !important;
}

/* 全体設定 */
.ks-faq-container {
    max-width: 900px;
    margin: 60px auto;
    padding: 0 20px;
    font-family: var(--font-serif);
}

.ks-faq-list {
    border: 1px solid var(--sys-border-light);
    border-radius: 8px;
    overflow: hidden;
}

.ks-faq-item {
    border-bottom: 1px solid var(--sys-border-light);
    background-color: var(--mist-50);
}

/* 質問エリア */
.ks-faq-question {
    width: 100%;
    padding: 24px 50px 24px 20px !important;
    display: flex;
    align-items: center;
    background: var(--mist-50);
    border: none !important;
    margin: 0 !important;
    text-align: left;
    cursor: pointer;
    font-size: 17px;
    font-weight: 600;
    line-height: 1.4 !important;
    position: relative;
    color: var(--sys-text-primary);
    min-height: 0 !important;
}

/* 質問アイコン（Q） */
.ks-faq-icon {
    display: inline-flex;
    align-items: center;
    margin-right: 18px;
    font-weight: 800;
    font-size: 20px;
    flex-shrink: 0;
    color: var(--depth-500);
}

/* 回答エリアの内側 */
.ks-faq-answer-inner {
    padding: 24px 24px 30px 20px !important; /* ここの 20px が Q との基準線 */
    display: flex;
    align-items: flex-start;
    border-top: 1px solid var(--sys-border-light);
    color: var(--sys-text-secondary);
    line-height: 1.8;
}

/* ★回答アイコン（A）のみを左にずらす設定 */
.ks-faq-icon.is-a {
    color: var(--sacred-gold) !important;
    margin-right: 14px; /* テキストとの間隔 */
    margin-left: -4px !important; /* ★ここをマイナスにすることで、Aだけを左へ移動 */
}

.ks-faq-text {
    flex: 1;
    font-size: 15px;
}

/* 矢印アイコン */
.ks-faq-question::after {
    content: '';
    position: absolute;
    right: 20px;
    top: 50%;
    width: 10px;
    height: 10px;
    border-right: 2px solid var(--sys-border-mid);
    border-bottom: 2px solid var(--sys-border-mid);
    transform: translateY(-50%) rotate(45deg);
    transition: transform 0.3s;
}

.ks-faq-item.is-open .ks-faq-question::after {
    transform: translateY(-20%) rotate(-135deg);
}

.ks-faq-answer {
    overflow: hidden;
    max-height: 0;
    transition: max-height 0.4s ease;
}

/* スマホ対応 */
@media screen and (max-width: 768px) {
    .ks-faq-question { padding: 18px 45px 18px 16px !important; }
    .ks-faq-answer-inner { padding: 20px 16px 24px 16px !important; display: block; }
    .ks-faq-icon.is-a { margin-left: 0 !important; float: left; margin-right: 10px; }
}

/* --- 11-faq.css --- */

/* エリアの配置のみ指定 */
.ks-faq-all-wrap {
    text-align: right;
    margin-top: 24px;
}

/* リンク自体のスタイル：フォントの種類だけを標準に戻し、他は SWELL に任せる */
.ks-faq-all-wrap a {
    /* 親要素の明朝体を打ち消すため、ここだけ標準のゴシック系を指定 */
    font-family: sans-serif !important; 
    
    /* 太さ(weight)、サイズ(size)、色(color) はあえて書かない。
       これにより SWELL 本来の初期設定がそのまま当たります。 */
    display: inline-block;
}

/* スマホ表示 */
@media screen and (max-width: 768px) {
    .ks-faq-all-wrap {
        margin-top: 20px;
    }
}