@charset "UTF-8";

*,
*::after,
*::before {box-sizing: border-box;}

img {width: 100%;}

.flex {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
}

a,ul,li {
    text-decoration: none;
}

/*  */
.r-faq_innerwrap {
    max-width: 1200px;
    margin: 0 auto;
    padding: 0 40px;
}

/* .r-faq_sp {display: none;}

.r-faq_tab {display: none;}
    
.r-faq_pc {display: block;} */


/* 各カテゴリー見出し */
.r-faq_categorybox {
    width: 100%;
    margin: 20px auto;
    padding: 15px 0;
    background-color: #78503c;
}

.r-faq_txt01 {
    width: calc((100% - 20px) / 5);
    position: relative;
    font-size: 1.8em;
    line-height: 1.6;
    text-align: center;
    color: #fff;
    transition: all .3s;
}

.r-faq_txt01 a {
    display: block;
    color: #fff;
}

.r-faq_txt01 a:hover {color: #ff9600;}

.r-faq_txt01:nth-of-type(2n) {margin-left: 20px;}


.r-faq_txt01::after {
    position: absolute;
    content: "";
    display: inline-block;
    width: 2px;
    height: 15px;
    top: 30%;
    right: 0%;
    background-color: #fff;
}

.r-faq_dele {position: initial;}
/* ここまで */

/* カテゴリー見出し */
.r-faq_bigtit {
    position: relative;
    margin: 100px auto 20px auto;
    font-size: 2.5em;
    font-weight: 800;
    line-height: 1.6;
    text-align: center;
    color: #222;
}

.r-faq_bigtit::after {
    content: "";
    position: absolute;
    width: 8%;
    height: 2px;
    bottom: -15%;
    left: 50%;
    background-color: #78503c;
    transform: translateX(-50%);
}
/* ここまで */


/* 質問アコーディオン */
.r-faq_container {
    margin: 0px auto 100px;
    /* margin: 100px auto; */
}

/*アコーディオン全体*/
.accordion-area{
    max-width: 1200px;
    width: 100%;
    margin: 50px auto;
    list-style: none;
}

.accordion-area li{margin: 10px 0;}

.accordion-area section {border: 1px solid #ccc;}

/*アコーディオンタイトル*/
#faq_area .title {
    position: relative;/*+マークの位置基準とするためrelative指定*/
    padding: 3% 5% 3% 50px;
    font-size: 1.8em;
    font-weight: normal;
    line-height: 1.6;
    text-align: left;
    transition: all .5s ease;
    cursor: pointer;
}

#faq_area .faq_box {
    position: relative;/*+マークの位置基準とするためrelative指定*/
    padding: 0% 5% 0% 0px;
    font-size: 1.8em;
    font-weight: normal;
    line-height: 1.6;
    text-align: left;
    transition: all .5s ease;
    cursor: pointer;
}

/*アイコンの＋と×*/
#faq_area .title::before,
#faq_area .title::after,
#faq_area .faq_box::before,
#faq_area .faq_box::after{
    position: absolute;
    content: "";
    width: 15px;
    height: 2px;
    background-color: #333; 
}

#faq_area .title::before,
#faq_area .faq_box::before{
    top: 48%;
    right: 2%;
    /* left: 15px; */
    transform: rotate(0deg);
}

#faq_area .title::after,
#faq_area .faq_box::after{    
    top: 48%;
    right: 2%;
    /* left: 15px; */
    transform: rotate(90deg);
}

/*　closeというクラスがついたら形状変化　*/
#faq_area .title.close::before{transform: rotate(45deg);}

#faq_area .title.close::after{transform: rotate(-45deg);}

#faq_area .faq_box.close::before{transform: rotate(45deg);}

#faq_area .faq_box.close::after{transform: rotate(-45deg);}


/*アコーディオンで現れるエリア*/
#faq_area .box {
    display: none;/*はじめは非表示*/
    margin: 3% 3% 3% 3%;
    padding: 3%;
    background: #f3f3f3;
}

#faq_area p {
    font-size: 1.6em;
    line-height: 1.6;
    text-align: left;
    overflow: hidden;
    color: #222;
}

.r-faq_question,
.r-faq_answer {width: 4%;}

.r-faq_qcontent,
.r-faq_anstit {width: 96%;}

.r-faq_question {
    padding: 2% 9px;
    font-size: 1.6em;
    text-align: left;
    line-height: 1.6;
    color: #222;
    background-color: #ccc;
}

.r-faq_answer {
    float: left;
    font-size: 2.8em;
    font-weight: 800;
    text-align: left;
    line-height: 1;
    color: #ff9600;
}

.faq_title {padding-left: 20px;}

.faq__b-nav {padding-bottom: 0;}
/* ここまで */



/* タブレット版 */
@media screen and (max-width: 999px) {
    .r-faq_sp {display: none;}
    
    .r-faq_pc {display: none;}

    .r-faq_tab {display: block;}

    .r-flow_othbtn01, .r-flow_othbtn02, .r-flow_othbtn03, .r-flow_othbtn04, .r-flow_othbtn05 {
        padding: 10px;
        font-size: 1.5em;
    }

    .r-flow_othbtn01::after, .r-flow_othbtn02::after, .r-flow_othbtn03::after, .r-flow_othbtn04::after, .r-flow_othbtn05::after {
        width: 8px;
        height: 8px;
        right: 7%;
    }

    .r-faq_question {padding: 2% 4px;}

}





/* 下記よりスマホ版 */
@media only screen and (max-width: 767px) {
    .f-direction_column {flex-direction: column;}

    .r-flow_sp {display: block;}

    .r-faq_tab {display: none;}

    .r-flow_pc {display: none;}


    /*  */
    .r-faq_innerwrap {
        max-width: 767px;
        margin: 0 auto;
        padding: 0 10px;
    }

    /* 大見出し */
    #main #ttl_block .inner h2 .r-flow_tit_color {color: #fff;}

    /* 他ページリンクボタン */
    .r-flow_othbtn01,
    .r-flow_othbtn02,
    .r-flow_othbtn03,
    .r-flow_othbtn04,
    .r-flow_othbtn05 {width: 100%;}

    .r-flow_otherbox div:nth-of-type(2n) {
        border-left: none;
        border-right: none;
    }
    /* ここまで */

    .r-flow_tit {
        margin: 50px auto 25px auto;
        font-size: 25px;
    }
    
    /* 各カテゴリー見出し */
    .r-faq_categorybox {
        margin: 0px auto;
        padding: 0 0 15px 0;
    }
    
    .r-faq_txt01 {width: 100%;}
    
    .r-faq_txt01:nth-of-type(2n) {margin-left: 0;}

    .r-faq_txt01:nth-of-type(odd) {
        margin-top: 15px;
        margin-bottom: 15px;
    }
    
    .r-faq_txt01::after {display: none;}
    /* ここまで */
    
    /* カテゴリー見出し */
    .r-faq_bigtit {margin: 50px auto 25px auto;}
    /* ここまで */
    
    /* 質問アコーディオン */
    .r-faq_container {
        margin: 25px auto 50px auto;
        /* margin: 50px auto; */
    }
    
    /*アコーディオン全体*/
    .accordion-area{max-width: 767px;}
    
    .accordion-area li{margin: 10px 0;}
    
    .accordion-area section {border: 1px solid #ccc;}
        
    .r-faq_question,
    .r-faq_answer {width: 15%;}

    .r-faq_answer {padding: 10px 3px;}
    
    .r-faq_qcontent,
    .r-faq_anstit {
        width: 75%;
        padding: 10px 0;
    }
    
    .r-faq_question {
        padding: 0% 3px 5px 3px;
        background-color: #fff;
    }

    .faq_title {padding-left: 0;}
    /* ここまで */
}

/* 23/07/21 */
/* 6個仕様 */
.r-flow_lgnbtn01,
.r-flow_lgnbtn02,
.r-flow_lgnbtn03,
.r-flow_lgnbtn04,
.r-flow_lgnbtn05,
.r-flow_lgnbtn06 {
    width: calc((100% - 20px ) /6);
    position: relative;
    padding: 0px;
    font-size: 1.6em;
    line-height: 1.6;
    text-align: center;
    color: #fff;
    background-color: #78503c;
    transition: all .3s;
}

.r-flow_othbtn01:hover,
.r-flow_othbtn02:hover,
.r-flow_othbtn03:hover,
.r-flow_othbtn04:hover,
.r-flow_othbtn05:hover,
.r-flow_lgnbtn01:hover, 
.r-flow_lgnbtn02:hover, 
.r-flow_lgnbtn03:hover, 
.r-flow_lgnbtn04:hover, 
.r-flow_lgnbtn05:hover, 
.r-flow_lgnbtn06:hover {background-color: #ff9600;}

.r-flow_othbtn01 a,
.r-flow_othbtn02 a,
.r-flow_othbtn03 a,
.r-flow_othbtn04 a,
.r-flow_othbtn05 a,
.r-flow_othbtn06 a,
.r-flow_lgnbtn01 a,
.r-flow_lgnbtn02 a,
.r-flow_lgnbtn03 a,
.r-flow_lgnbtn04 a,
.r-flow_lgnbtn05 a,
.r-flow_lgnbtn06 a {
    display: block;
    padding: 12px;
    color: #fff;
}

/* 6個仕様 */
.r-flow_lgnbtn01::after,
.r-flow_lgnbtn02::after,
.r-flow_lgnbtn03::after,
.r-flow_lgnbtn04::after,
.r-flow_lgnbtn05::after,
.r-flow_lgnbtn06::after {
    content: "";
    position: absolute;
    display: inline-block;
    width: 12px;
    height: 12px;
    top: 50%;
    right: 15%;
    transform: translateY(-50%) rotate(45deg);
    border-top: solid 2px #fff;
    border-right: solid 2px #fff;
}

/* タブレット版 */
@media screen and (max-width: 999px) {
    /* 6個仕様 */
    .r-flow_lgnbtn01, 
    .r-flow_lgnbtn02,
    .r-flow_lgnbtn03,
    .r-flow_lgnbtn04,
    .r-flow_lgnbtn05,
    .r-flow_lgnbtn06 {
        width: calc(100% / 2);
        padding: 0px;
        font-size: 1.6em;
    }

    .r-flow_lgnbtn01::after, 
    .r-flow_lgnbtn02::after,
    .r-flow_lgnbtn03::after,
    .r-flow_lgnbtn04::after,
    .r-flow_lgnbtn05::after,
    .r-flow_lgnbtn06::after {
        width: 8px;
        height: 8px;
        right: 7%;
    }

    .r-flow_othbtn01 a,
    .r-flow_othbtn02 a,
    .r-flow_othbtn03 a,
    .r-flow_othbtn04 a,
    .r-flow_othbtn05 a,
    .r-flow_othbtn06 a,
    .r-flow_lgnbtn01 a,
    .r-flow_lgnbtn02 a,
    .r-flow_lgnbtn03 a,
    .r-flow_lgnbtn04 a,
    .r-flow_lgnbtn05 a,
    .r-flow_lgnbtn06 a {
        padding: 12px;
        border-left: solid 0.3px #fff;
        border-bottom: solid 0.3px #fff;
    }
}

/* 下記よりスマホ版 */
@media only screen and (max-width: 767px) {
    /* 6個仕様 */
    .r-flow_lgnbtn01,
    .r-flow_lgnbtn02,
    .r-flow_lgnbtn03,
    .r-flow_lgnbtn04,
    .r-flow_lgnbtn05,
    .r-flow_lgnbtn06 {width: calc(100% / 2);}
}
/* ここまで */

/* 23/08/03 */
.r-faq_link_contact {
    width: 50%;
    margin: auto auto 100px auto;
    border-radius: 50px;
    background-color: #78503c;
}

#r-faq_contact a .r-faq_contact_tit {
    margin: 0 auto;
    font-size: 2em;
    font-weight: 800;
    text-align: center;
    line-height: 1.6;
    color: #fff;
}

#r-faq_contact div {
    width: 20%;
    margin: 0 auto;
}

#r-faq_contact div img {width: 100%;}

#r-faq_contact a {
    position: relative;
    display: block;
    margin-top: 0px;
    padding: 30px;
    /* font-size: 1.8em; */
    text-align: center;
    line-height: 1.6;
    /* border: solid 1px #fff; */
    border-radius: 50px;
    color: #fff;
    transition: all .3s;
}

#r-faq_contact a:hover {
    border: solid 1px #ff9600;
    background-color: #ff9600;
}

#r-faq_contact a::after {
    content: "";
    position: absolute;
    display: inline-block;
    width: 13px;
    height: 13px;
    top: 50%;
    right: 7%;
    transform: translateY(-50%) rotate(45deg);
    border-top: solid 2px #fff;
    border-right: solid 2px #fff;
}

/* タブレット版 */
@media screen and (max-width: 999px) {
    .r-faq_link_contact {width: 100%;}
    
    #r-faq_contact a {padding: 20px;}
}

/* 下記よりスマホ版 */
@media only screen and (max-width: 767px) {
    .r-faq_link_contact {
        width: 100%;
        margin: auto auto 70px auto;
    }
    
    #r-faq_contact a .r-faq_contact_tit {font-size: 1.6em;}
    
    #r-faq_contact a {padding: 20px;}
    
    #r-faq_contact a::after {
        width: 11px;
        height: 11px;
    }
}
/* ここまで */