@charset "UTF-8";

@media only screen and (max-width:768px) {

    /* CSS Document */

    /*----------------------------------------
SP用レイアウト(768px以下のスクリーン)
----------------------------------------*/

    /* body全体の初期スタイル調整 */

    body {
        width: 100%;
        -webkit-text-size-adjust: 100%;
        -ms-text-size-adjust: 100%;
    }


    /*----------------------------------------
全体レイアウト/背景設定(PC)
----------------------------------------*/

    /* 全体エリア(全体背景を設定するにはここ) */

    .main {
        background-image: none;
        width: 100%;
        margin: 0%;

    }

    .img {
        vertical-align: bottom;
    }


    /*----------------------------------------
ファーストビュー設定
----------------------------------------*/

    .fv {
        width: 100%;
        margin: 0%;

    }

    #main-contents {
        width: 100%;
        margin: 0%;

    }

    .contents{
        width: 100%;
        background: #ceaa5e;
        padding: 1% 0;
        margin: 0 auto;
      }
      
      .contents_inner{
          margin: 5% 5%;
          padding: 5% 7%;
          background: #fff;
          border-radius: 20px;
      }
    

    /*----------------------------------------
よくあるご質問
----------------------------------------*/

#faq {
    background-image: url(../images/sec14_faq.jpg);
    background-repeat: no-repeat;
    background-size: 100%;

}

.accordion_wrap {
    padding: 65% 5% 5% 5%;
    width: 100%;
    margin: 0 auto;
}

.accordion {
    margin-bottom: 3%;
    position: relative;
}

.accordion__btn {
    cursor: pointer;
    position: relative;
}

.accordion__btn::before {
    content: '';
    display: inline-block;
    border-radius: 10%;
    width: 4%;
    height: 2px;
    background-color: #fff;
    position: absolute;
    right: 3.97%;
    top: 50%;
    transform: translateY(-50%);
    transition: opacity 1s;
}

.accordion__btn::after {
    content: '';
    display: inline-block;
    border-radius: 10%;
    width: 4%;
    height: 2px;
    background-color: #fff;
    position: absolute;
    right: 3.97%;
    top: 50%;
    transform: translateY(-50%) rotate(90deg);
    transition: transform 1s;
}

.accordion__btn.show::before {
    opacity: 0;
}

.accordion__btn.show::after {
    transform: translateY(-50%) rotate(180deg);
}

.accordion__content {
    display: none;
}

/*----------------------------------------
トップへ戻るボタン
----------------------------------------*/

    a.back_btn {
        display: block;
        text-align: center;
        vertical-align: middle;
        text-decoration: none;
        width: 50%;
        margin: auto;
        padding: 1rem 0;
        font-weight: normal;
        border: 1.5px solid #c36a2d;
        color: #c36a2d;
        border-radius: 100vh;
        transition: 0.5s;
        font-size: 1.2em;
    }

    a.back_btn:hover {
        color: #fff;
        background: #c36a2d;
    }

    .back_btn:hover::after {
        transform: translateY(-50%) scaleX(1.4);
    }

    /*----------------------------------------
フッター部分
----------------------------------------*/

    .footer {
        background-color: #252525;
        padding: 4em 0em;
        text-align: center;
        font-size: 1.2em;
        color: #fff;
    }

    .footer a {
        color: #fff;
    }

}