@charset "utf-8";

/* CSS INFORMATION -====================================================
File name : faq.css
Description :
===================================================================== */

/* =====================================================================
*    faq
* =================================================================== */
.faq_sec:not(:last-child) {
    margin: 0 0 calc(100 / 690 * 100%);
}

.faq_sec_sub:not(:last-child) {
    margin: 0 0 calc(70 / 690 * 100%);
}

.faq_sec_ttl {
    border-top: 2px solid #8fc31f;
    border-bottom: 2px solid #8fc31f;
    padding: 0.6em 0;
    font-size: 2.8rem;
    font-weight: 500;
    line-height: 1.643;
    text-align: center;
}

.faq_sec_subttl {
    margin: calc(70 / 690 * 100%) 0 0;
    padding: 0.4em 0;
    background-color: #8fc31f;
    border-radius: calc(20 / 750 * 100vw);
    color: #fff;
    font-size: 2.8rem;
    font-family: "Noto Sans JP", "メイリオ", "ＭＳ Ｐゴシック", "小塚ゴシック Pro R", "ヒラギノ角ゴ Pro W3", "Meiryo", "MS PGothic", "KozGoPro-Regular", "Hiragino Kaku Gothic Pro", "MS UI Gothic", Osaka, sans-serif;
    font-weight: 700;
    line-height: 1.643;
    letter-spacing: 0.02em;
    text-align: center;
}

.faq_sec_box {
    padding: 2em 0;
    border-bottom: 1px dashed #9ac144;
    font-size: 2.8rem;
    font-family: "Noto Sans JP", "メイリオ", "ＭＳ Ｐゴシック", "小塚ゴシック Pro R", "ヒラギノ角ゴ Pro W3", "Meiryo", "MS PGothic", "KozGoPro-Regular", "Hiragino Kaku Gothic Pro", "MS UI Gothic", Osaka, sans-serif;
    font-weight: 700;
    line-height: 1.643;
    word-break: break-all;
}

.faq_sec_box dt {
    margin: 0 0 2em;
    padding: 0 0 0 calc(90 / 690 * 100%);
    font-weight: 700;
}

.faq_sec_box dd {
    padding: 0 0 0 calc(90 / 690 * 100%);
    line-height: 1.786;
}

.faq_sec_box dt::before,
.faq_sec_box dt::after,
.faq_sec_box dd::before,
.faq_sec_box dd::after {
    content: "";
    display: block;
    width: calc(64 / 750 * 100vw);
    height: calc(64 / 750 * 100vw);
    border-radius: 50%;
    position: absolute;
    top: -0.25em;
    left: 0;
}

.faq_sec_box dt::before {
    background-color: #8fc31f;
}

.faq_sec_box dd::before {
    background-color: #ffb80f;
}

.faq_sec_box dt::after,
.faq_sec_box dd::after {
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    color: #fff;
    font-size: 3.2rem;
    font-family: "M PLUS Rounded 1c", "ヒラギノ丸ゴ Pro W4","ヒラギノ丸ゴ Pro","Hiragino Maru Gothic Pro","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","HG丸ｺﾞｼｯｸM-PRO","HGMaruGothicMPRO";
    font-weight: 700;
}

.faq_sec_box dt::after {
    content: "Q";
}

.faq_sec_box dd::after {
    content: "A";
}

.faq_sec_box a {
    display: inline;
    margin: 0 0.3em;
    color: #d75328;
    text-decoration: underline;
}

.faq_sec_box strong {
    color: #d75328;
    font-weight: 700;
}

@media screen and (min-width: 768px) {
    .faq_sec:not(:last-child) {
        margin: 0 0 calc(60 / 800 * 100%);
    }
    
    .faq_sec_sub:not(:last-child) {
        margin: 0 0 calc(40 / 800 * 100%);
    }
    
    .faq_sec_ttl {
        padding: 0.8em 0;
        font-size: 1.6rem;
    }
    
    .faq_sec_ttl span {
        display: inline-block;
        -webkit-transform: rotate(0.05deg);
        transform: rotate(0.05deg);
    }
    
    .faq_sec_subttl {
        margin: calc(20 / 800 * 100%) 0 0;
        padding: 0.44em 0;
        border-radius: calc(10 / 1200 * 100vw);
        border-radius: 0.83vw;
        font-size: 1.6rem;
    }
    
    .faq_sec_box {
        padding: 2em 0;
        font-size: 1.6rem;
        line-height: 1.875;
    }
    
    .faq_sec_box dt {
        margin: 0 0 1.5em;
        padding: 0 0 0 calc(50 / 800 * 100%);
    }
    
    .faq_sec_box dd {
        padding: 0 0 0 calc(50 / 800 * 100%);
        line-height: 1.875;
    }
    
    .faq_sec_box dt::before,
    .faq_sec_box dt::after,
    .faq_sec_box dd::before,
    .faq_sec_box dd::after {
        width: calc(32 / 1200 * 100vw);
        height: calc(32 / 1200 * 100vw);
        top: 0;
    }
    
    .faq_sec_box dt::after,
    .faq_sec_box dd::after {
        font-size: 1.6rem;
    }
    
    .faq_sec_box a:hover {
        text-decoration: none;
    }
}

@media screen and (min-width: 1200px) {
    .faq_sec_subttl {
        border-radius: 10px;
    }
    
    .faq_sec_box dt::before,
    .faq_sec_box dt::after,
    .faq_sec_box dd::before,
    .faq_sec_box dd::after {
        width: 32px;
        height: 32px;
    }
}