@charset "UTF-8";
/* CSS Document */

/*-----------------------------------------------
*	main visual
*-----------------------------------------------*/
.mv{
    background-image: url("../img/mv__bg-img__2550.png");
    height: 1090px;
    width: 100%;
    background-repeat: no-repeat;
    background-position: bottom;
    background-size: cover;
    margin-top: -2px;
    position: relative;
}
@media screen and (max-width: 2000px) {
    .mv{
        height: 890px;
    }
}
@media screen and (max-width: 1500px) {
    .mv{
        background-image: url("../img/mv__bg-img__1500.png");
    }
}
@media screen and (max-width: 1200px) {
    .mv{
        background-image: url("../img/mv__bg-img__1200.png");
        height: 990px;
    }
}
@media screen and (max-width: 800px) {
    .mv{
        background-image: url("../img/mv__bg-img__800.png");
        height: 960px;
    }
}
@media screen and (max-width: 600px) {
    .mv{
        background-image: url("../img/mv__bg-img__600.png");
        margin-top: -4px;
    }
}
@media screen and (max-width: 500px) {
    .mv{
        background-image: url("../img/mv__bg-img__500.png");
    }
}
@media screen and (max-width: 470px) {
    .mv{
        background-image: url("../img/mv__bg-img__470.png");
    }
}
@media screen and (max-width: 360px) {
    .mv{
        background-image: url("../img/mv__bg-img__360.png");
    }
}
.mv__wrapper{
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    position: absolute;
    top: 10px;
    right: 29%;
}
@media screen and (max-width: 2250px) {
    .mv__wrapper {
        right: 26%;
    }
}
@media screen and (max-width: 2000px) {
    .mv__wrapper {
        right: 24%;
    }
}
@media screen and (max-width: 1800px) {
    .mv__wrapper {
        right: 21%;
    }
}
@media screen and (max-width: 1600px) {
    .mv__wrapper {
        right: 16%;
    }
}
@media screen and (max-width: 1200px) {
    .mv__wrapper {
        right: 3%;
    }
}
@media screen and (max-width: 500px) {
    .mv__wrapper {
        padding: 0 20px;
        right: 0;
        left: 0;
    }
}
.mv__leading{
    color: #fff;
    font-size: 2.9rem;
    margin-bottom: 78px;
    line-height: 1.5;
    font-weight: 600;
}
.mv__leading_br{
    display: none;
}
@media screen and (max-width: 600px) {
    .mv__leading{
        text-align: center;
        font-size: 2.5rem;
    }
}
@media screen and (max-width: 500px) {
    .mv__leading{
        margin: 0 auto 30px;
        font-size: 2.2rem;
    }
}
@media screen and (max-width: 460px) {
    .mv__leading_br{
        display: block;
    }
}
@media screen and (max-width: 360px) {
    .mv__leading{
        margin-bottom: 55px;
    }
}
.mv__logo_wrapper{
    background-color: #fff;
    mix-blend-mode: multiply;
}
.mv__logo{
    width: 638px;
    margin-bottom: 100px;
    mix-blend-mode: multiply;
}
@media screen and (max-width: 1500px) {
    .mv__logo{
        margin-bottom: 50px;
    }
}
@media screen and (max-width: 1200px) {
    .mv__logo{
        margin-bottom: 50px;
    }
}
@media screen and (max-width: 990px) {
    .mv__logo {
        width: 70%;
        margin-left: auto;
        display: block;
    }
}
@media screen and (max-width: 500px) {
    .mv__logo {
        width: 90%;
        display: block;
        margin: 0 auto;
        margin-bottom: 160px;
    }
}
@media screen and (max-width: 450px) {
    .mv__logo {
        margin-bottom: 200px;
    }
}
.mv__price_wrapper{
    width: 200px;
    height: 200px;
    border-radius: 100px;
    background-color: #fff;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-bottom: 23px;
    box-shadow: 0px 0px 45px -6px #0b8989;
}
@media screen and (max-width: 1400px) {
    .mv__price_wrapper{
        margin-bottom: 50px;
    }
}
@media screen and (max-width: 900px) {
    .mv__price_wrapper{
        margin-bottom: 100px;
    }
}
@media screen and (max-width: 500px) {
    .mv__price_wrapper{
        margin-bottom: 50px;
    }
}
.mv__list{
    display: flex;
    align-items: center;
}
.mv__price01{
    color: #0B8989;
    font-size: 2.1rem;
}
.mv__price02{
    font-family: "Roboto", sans-serif;
    color: #0B8989;
    font-size: 3.9rem;
}
.mv__price03{
    font-family: "Roboto", sans-serif;
    color: #0B8989;
    font-size: 12rem;
    font-weight: 600;
    line-height: 1;
}
.mv__txt_wrapper{
    display: flex;
    flex-direction: column;
    color: #fff;
    width: 478px;
}
@media screen and (max-width: 800px) {
    .mv__txt_wrapper{
        width: 50%;
    }
}
@media screen and (max-width: 500px) {
    .mv__txt_wrapper{
        width: 100%;
    }
}
.mv__txt01{
    margin: 0 5px 10px 0;
}
.mv__txt02{
    font-size: 2.4rem;
    font-weight: 600;
    margin-bottom: 10px;
    text-align: justify;
}
.leading_txt_br{
    display: block;
}
@media screen and (max-width: 500px) {
    .leading_txt_br{
        display: none;
    }
}
/*-----------------------------------------------
*	contents01
*-----------------------------------------------*/
.contents_wrapper01{
    width: 100%;
    max-width: 1088px;
    margin: 0 auto;
}
@media screen and (max-width: 1200px) {
    .contents_wrapper01{
        max-width: fit-content;
        padding: 0 20px;
    }
}
.leading_txt{
    color: #595858;
    font-size: 2.5rem;
    font-weight: 300;
    line-height: 2;
    text-align: center;
    margin-bottom: 124px;
}
@media screen and (max-width: 500px) {
    .leading_txt{
        text-align:  left;
    }
}
.problems__wrapper{
    display: flex;
    flex-direction: column;
    align-items: center;
}
.problems__header_wrapper{
    display: flex;
    flex-direction: column;
    align-items: center;
    margin-bottom: 55px;
}
.problems__header{
    color: #51A098;
    font-size: 4rem;
    margin-bottom: 24px;
    line-height: 1.5;
}
@media screen and (max-width: 500px) {
    .problems__header{
        font-size: 3.2rem;
    }
}
.problems__border{
    border-bottom: solid 4px #51A098;
    width: 544px;
}
@media screen and (max-width: 700px) {
    .problems__border{
        width: 100%;
    }
}
.problems__list{
    display: flex;
    justify-content: space-between;
    width: 100%;
}
@media screen and (max-width: 940px) {
    .problems__list {
        justify-content: space-around;
        flex-wrap: wrap;
    }
}
@media screen and (max-width: 680px) {
    .problems__list {
        flex-direction: column;
        align-items: center;
    }
}

.problems__box01{
    width: 340px;
    height: 340px;
    border-radius: 170px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: #0183AB;
    opacity: 0;
    transition: all 1s;
}
.problems__box02{
    width: 340px;
    height: 340px;
    border-radius: 170px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: #019EAB;
    opacity: 0;
    transition: all 2s;
}
.problems__box03{
    width: 340px;
    height: 340px;
    border-radius: 170px;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    background-color: #37A89F;
    opacity: 0;
    transition: all 3s;
}

@media screen and (max-width: 1200px) {
    .problems__box01, .problems__box02, .problems__box03{
        width: 300px;
        height: 300px;
    }
}
@media screen and (max-width: 680px) {
    .problems__box01, .problems__box02, .problems__box03{
        margin-bottom: 30px;
    }

}@media screen and (max-width: 500px) {
    .problems__box01, .problems__box02, .problems__box03{
        width: 280px;
        height: 280px;
    }
}
.problems__num{
    color: #fff;
    font-size: 4rem;
    font-weight: 600;
    margin-bottom: 26px;
    opacity: 0.7;
}
.problems__txt{
    color: #fff;
    font-size: 2.5rem;
    text-align: center;
}
@media screen and (max-width: 1200px) {
    .problems__txt{
        font-size: 2.3rem;
    }
}
@media screen and (max-width: 500px) {
    .problems__txt {
        font-size: 2rem;
    }
}


.contents_wrapper02{
    background-image: url("../img/contents_wrapper02__bg-img.png");
    height: 367px;
    width: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    margin-top: -50px;
}
@media screen and (max-width: 1400px) {
    .contents_wrapper02{
        margin-top: -120px;
    }

}
@media screen and (max-width: 900px) {
    .contents_wrapper02{
        margin-top: -140px;
    }
}
@media screen and (max-width: 600px) {
    .contents_wrapper02{
        margin-top: -40px;
    }

}@media screen and (max-width: 500px) {
    .contents_wrapper02{
        margin-top: 40px;
    }
}
.contents_wrapper03{
    background-image: url(../img/contents_wrapper03__bg-img.png);
    height: 488px;
    width: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    margin-top: -488px;
}

@media screen and (max-width: 900px) {
    .contents_wrapper03{
        height: 330px;
    }
}
@media screen and (max-width: 600px) {
    .contents_wrapper03 {
        height: 240px;
    }
}
@media screen and (max-width: 500px) {
    .contents_wrapper03 {
        height: 190px;
    }
}
.contents04{
    background-color: #51A098;
    margin-top: -1px;
}
.contents04__wrapper{
    width: 100%;
    max-width: 1088px;
    margin: 0 auto;
}
@media screen and (max-width: 1200px) {
    .contents04__wrapper{
        max-width: fit-content;
        padding: 0 20px;
    }

}@media screen and (max-width: 500px) {
    .contents04__wrapper{
        padding-top: 65px;
    }
}
.pros__contents_img00{
    width: 31%;
    object-fit: contain;
}
@media screen and (max-width: 940px) {
    .pros__contents_img00{
        display: none;
    }
}
.pros__header_wrapper{
    display: flex;
    justify-content: center;
    color: #fff;
    margin-bottom: 112px;
}
@media screen and (max-width: 500px) {
    .pros__header_wrapper{
        margin-bottom: 65px;
    }
}
.pros__header_num{
    font-family: "Roboto", sans-serif;
    font-size: 16rem;
    line-height: 1;
    margin-top: -10px;
}
@media screen and (max-width: 500px) {
    .pros__header_num{
        font-size: 14rem;
    }
}
.pros__header_list{
    display: flex;
    flex-direction: column;
}
.pros__header_txt01{
    font-size: 2.8rem;
}
@media screen and (max-width: 500px) {
    .pros__header_txt01{
        font-size: 2.3rem;
    }
}
.pros__header_border{
    border-bottom: solid 3px #fff;
    margin: 10px 0;
    width: 211px;
}
@media screen and (max-width: 500px) {
    .pros__header_border{
        width: 100%;
    }
}
.pros__header_txt02{
    font-size: 5rem;
    font-weight: 500;
}
@media screen and (max-width: 500px) {
    .pros__header_txt02{
        font-size: 4.2rem;
    }
}
.pros__contents_wrapper{
    display: flex;
}
.pros__contents_list{
    display: flex;
    flex-direction: column;
    margin-right: 36px;
}
@media screen and (max-width: 700px) {
    .pros__contents_list{
        margin-right: 0;
    }
}
.pros__contents_box01{
    display: flex;
    align-items: center;
    margin-bottom: 114px;
}
@media screen and (max-width:700px) {
    .pros__contents_box01{
        flex-direction: column;
    }
}
.pros__contents_box02{
    display: flex;
    align-items: center;
    margin-bottom: 114px;
}
@media screen and (max-width: 700px) {
    .pros__contents_box02{
         flex-direction: column-reverse;
    }
}
@media screen and (max-width: 500px) {
    .pros__contents_box01, .pros__contents_box02, .pros__contents_box03{
        margin-bottom: 50px;
    }
}
.pros__contents_img01{
    width: 146px;
    margin: 0 48px 0 36px;
}

.pros__contents_img02{
    width: 207px;
    margin: 0 36px 0 48px;
}
.pros__contents_img03{
    width: 175px;
    height: 164px;
    margin: 0 48px 0 36px;
}
@media screen and (max-width: 700px) {
    .pros__contents_img01, .pros__contents_img02, .pros__contents_img03{
        margin: 0 0 50px;
        width: 50%;
        object-fit: contain;
    }
}
@media screen and (max-width: 500px) {
    .pros__contents_img01, .pros__contents_img02, .pros__contents_img03{
        width: 35%;
    }
}
.pros__contents_txt_wrapper{
    display: flex;
    flex-direction: column;
}
.pros__contents_header_wrapper{
    display: flex;
    margin-bottom: 30px;
}
.pros__contents_num{
    font-family: "Roboto", sans-serif;
    color: #1A645B;
    font-size: 44px;
    font-weight: 600;
    margin: -13px 10px 0 0;
}
.pros__contents_header{
    color: #fff;
    font-size: 3rem;
    font-weight: 600;
    margin-top: -3px;
}
@media screen and (max-width: 500px) {
    .pros__contents_header{
        font-size: 2.4rem;
    }
}
.pros__contents_txt{
    color:#fff;
    line-height: 2;
    font-weight: 100;
}

.contents_wrapper05{
    background-image: url("../img/contents_wrapper05__bg-img.png");
    height: 640px;
    width: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: right;
    margin-top: 0px;
}
@media screen and (max-width: 1600px) {
    .contents_wrapper05 {
        margin-top: -40px;
    }
}
@media screen and (max-width: 1400px) {
    .contents_wrapper05 {
        height: 380px;
    }
}
@media screen and (max-width: 700px) {
    .contents_wrapper05 {
        height: 200px;
    }
}
.contents_wrapper06{
    background-image: url("../img/contents_wrapper06__bg-img.png");
    height: 660px;
    width: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    margin-top: -660px;
}
@media screen and (max-width: 2000px) {
    .contents_wrapper06 {
        height: 528px;
    }
}
@media screen and (max-width: 1600px) {
    .contents_wrapper06 {
        height: 424px;
    }
}
@media screen and (max-width: 1400px) {
    .contents_wrapper06 {
        height: 660px;
    }
}
@media screen and (max-width: 1050px) {
    .contents_wrapper06 {
        height: 544px;
    }
}
@media screen and (max-width: 700px) {
    .contents_wrapper06 {
        height: 626px;
    }
}
.contents07{
    width: 100%;
    max-width: 1088px;
    margin: 0 auto 75px;
}
@media screen and (max-width: 1200px) {
    .contents07{
        padding: 0 20px;
        width: auto;
    }
}
@media screen and (max-width: 500px) {
    .contents07{
        margin-top: 50px;
    }
}
.price__header{
    color: #0183AB;
    font-size: 6rem;
    font-weight: 600;
    text-align: center;
    letter-spacing: 0.05em;
    margin-bottom: 90px;
}
.price__wrapper{
    display: flex;
    flex-direction: column;
    border: solid 1px #0183AB;
    border-radius: 15px;
    margin-bottom: 30px;
}
.price__list_header01{
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #0183AB;
    height: 78px;
    border-radius: 15px 15px 0 0;
}
.price__list_header02{
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: #019EAB;
    height: 78px;
    border-radius: 15px 15px 0 0;
}
.price__list_title{
    color: #fff;
    font-size: 2.6rem;
    font-weight: 600;
}
.price__outer_list{
    display: flex;
    flex-direction: column;
    margin: 30px 80px 48px;
}
@media screen and (max-width: 1200px) {
    .price__outer_list{
        margin: 30px 40px 48px;
    }
}
@media screen and (max-width: 1000px) {
    .price__outer_list{
        margin: 30px 30px 48px;
    }
}
@media screen and (max-width: 970px) {
    .price__outer_list{
        margin: 30px 30px 0;
    }
}
.price__list{
    display: flex;
    justify-content: space-between;
    align-items: center;

}
@media screen and (max-width: 1200px) {
    .price__list{
        justify-content: space-around;
    }
}
@media screen and (max-width: 830px) {
    .price__list{
        flex-direction: column;
    }
}
.price__box01{
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    background-color: #0183AB;
    color: #fff;
    border-radius: 140px;
    padding: 28px;
    width: 218px;
    height: 218px;
    opacity: 0;
    transition: all 1s; 
}
.price__box02{
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    background-color: #0183AB;
    color: #fff;
    border-radius: 140px;
    padding: 28px;
    width: 218px;
    height: 218px;
    opacity: 0;
    transition: all 2s; 
}
.price__box03{
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    background-color: #0183AB;
    color: #fff;
    border-radius: 140px;
    padding: 28px;
    width: 218px;
    height: 218px;
    opacity: 0;
    transition: all 3s; 
}
.price__box04{
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    background-color: #019EAB;
    color: #fff;
    border-radius: 140px;
    padding: 28px;
    width: 218px;
    height: 218px;
    opacity: 0;
    transition: all 1s; 
}
.price__box05{
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    background-color: #019EAB;
    color: #fff;
    border-radius: 140px;
    padding: 28px;
    width: 218px;
    height: 218px;
    opacity: 0;
    transition: all 2s; 
}
.price__box06{
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
    background-color: #019EAB;
    color: #fff;
    border-radius: 140px;
    padding: 28px;
    width: 218px;
    height: 218px;
    opacity: 0;
    transition: all 3s; 
}
@media screen and (max-width: 970px) {
    .price__list{
        flex-direction: column;
    }
    .price__box01, .price__box02,.price__box03, .price__box04,.price__box05, .price__box06{
        margin-bottom: 50px;
    }
}

.price__box_header{
    font-size: 3rem;
    font-weight: 500;
    text-align: center;
    margin-bottom: 20px;
}
.price__border{
    border-bottom: solid 1px #fff;
    width: 100%;
    margin-bottom: 30px;
}
.price__txt_wrapper01{
    display: flex;
}
@media screen and (max-width: 1000px) {
    .price__txt_wrapper01{
        flex-direction: column;
        align-items: center;
    }
}
.price__txt_wrapper02{
    display: flex;
    flex-direction: column;
}
.price__txt_list01{
    display: flex;
    align-items: flex-end;
    margin-right: 16px;
    position: relative;
}
@media screen and (max-width: 830px) {
    .price__txt_list01{
        margin: 0 0 10px;
    }
}
/*
.price__txt_list01::after{
    content: url("../img/price__x_img.png");
    width: 61px;
    height: 46px;
    position: absolute;
}
*/
.price__txt_list02{
    display: flex;
    align-items: flex-end;
}
.price__txt01{
    font-family: "Roboto", sans-serif;
    font-size: 3.8rem;
    font-weight: 500;
    line-height: 1;
}
@media screen and (max-width: 1200px) {
    .price__txt01{
        font-size: 3rem;
    }
}
.price__txt02{
    font-size: 2rem;
    font-weight: 500;
    line-height: 1;
    margin-bottom: 5px;
}
.price__txt03{
    font-size: 6rem;
    font-weight: 500;
    line-height: 1;
}
@media screen and (max-width: 1200px) {
    .price__txt03{
        font-size: 5rem;
    }
}
.price__txt04{
    font-size: 3rem;
    font-weight: 500;
    line-height: 1;
    margin-bottom: 10px;
}
.price__txt05{
    font-size: 4rem;
    line-height: 1;
}
.price__txt06{
    font-size: 4.5rem;
    font-weight: 500;
    line-height: 1;
}
.price__txt07{
    font-size: 3rem;
    line-height: 1;
}
.price__x_arrow{
    margin: 0 30px;
    width: 28px;
    height: 41px;
    display: block;
}
@media screen and (max-width: 1000px) {
    .price__x_arrow{
        margin: 0;
    }
}
@media screen and (max-width: 830px) {
    .price__x_arrow{
        display: none;
    }
}
.sp_price__x_arrow{
    display: none;
}
@media screen and (max-width: 830px) {
    .sp_price__x_arrow{
        display: block;
        margin: 15px 0;
    }
}
.price__note{
    font-size: 1.2rem;
    margin-top: 12px;
}
.price__note02{
    color: #009EAB;
    font-size: 1.2rem;
    margin-top: 12px;
    text-align: right;
}
@media screen and (max-width: 970px) {
    .price__note02{
        margin: 0 0 50px;
    }
}
@media screen and (max-width: 500px) {
    .price__note02{
        text-align: left;
    }
}
.contents08{
    background-image: url("../img/contents_wrapper08__bg-img.png");
    height: 562px;
    width: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    margin-top: -200px;
}
@media screen and (max-width: 1300px) {
    .contents08{
        height: 285px;
        margin-top: -60px;
    }
}
@media screen and (max-width: 800px) {
    .contents08{
        height: 200px;
        margin-top: -60px;
    }
}
@media screen and (max-width: 500px) {
    .contents08{
        height: 114px;
    }
}


.contents09{
    background-color: #51A098;
}
.contents09__wrapper{
    width: 100%;
    max-width: 1088px;
    margin: -1px auto 0;
}
@media screen and (max-width: 1200px) {
    .contents09__wrapper{
        padding: 0 20px;
        width: auto;
    }
}
@media screen and (max-width: 500px) {
    .contents09__wrapper{
        padding: 50px 20px 0;
    }
}
.accordion-content {
  display: none;
}
.question__header{
    color: #019EAB;
    font-size: 8rem;
    font-weight: 600;
    text-align: center;
    letter-spacing: 0.05em;
    margin-bottom: 90px;
}
.question__wrapper{
    background-color: #EEF6F5;
    border-radius: 12px;
    margin-bottom: 52px;
}
.question__wrapper:last-child{
    background-color: #EEF6F5;
    border-radius: 12px;
    margin-bottom: 112px;
}
.accordion-content {
  display: none;
}
.accordion-header {
  transition: background .3s ease;
  cursor: pointer;
  position: relative;
    padding: 22px 55px 22px 30px;
    display: flex;
    align-items: center;
}
@media screen and (max-width: 500px) {
    .accordion-header {
        display: flex;
        align-items: flex-start;
        flex-direction: column;
    }
}
.accordion-header::before,
.accordion-header::after{
    position:absolute;
    content:'';
    top:1px;
    right:20px;
    bottom:0;
    width:24px;
    height:5px;
    margin:auto;
    background:#50A098;
}
.accordion-header::after{
  transform:rotate(-90deg);
  transition:transform 0.3s;
}
.accordion-header.active::after{transform:rotate(0deg);}

.answer__list{
    display: flex;
    align-items: center;
    border-top: solid 2px #50A098;
    padding: 22px 55px 22px 30px;
}
@media screen and (max-width: 500px) {
    .answer__list{
        flex-direction: column;
        padding: 22px 55px 22px 30px;
    }
}
.question__initial{
    font-family: "Roboto", sans-serif;
    color: #50A098;
    font-size: 3.2rem;
    font-weight: 600;
    margin-right: 10px;
}
.question__txt{
    font-size: 2rem;
    color: #50A098;
    font-weight: 600;
}
.answer__initial{
    font-family: "Roboto", sans-serif;
    color: #595858;
    font-size: 3.2rem;
    font-weight: 600;
    margin-right: 10px;
}
.answer__txt p{
    font-size: 1.6rem;
    color: #595858;
    font-weight: 600;
}
.answer__txt span{
    color: #51A098;
    font-size: 1.6rem;
    font-weight: 600;
}
.answer__txt strong{
    color: #51A098;
    font-size: 1.6rem;
    font-weight: 600;
}
/*
.answer__hl{
    color: #51A098;
    font-size: 2rem;
    font-weight: 600;
}
*/
.accordion-content {
    display: none;
}

.contents_wrapper08{
    background-image: url("../img/contents_wrapper05__bg-img.png");
    height: 680px;
    width: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: right;
    margin-top: 0px;
    position: relative;
    z-index: -99;
}
@media screen and (max-width: 1600px) {
    .contents_wrapper08{
        height: 530px;
    }
}
@media screen and (max-width: 1300px) {
    .contents_wrapper08{
        height: 350px;
    }
}
@media screen and (max-width: 600px) {
    .contents_wrapper08{
        height: 280px;
    }
}
@media screen and (max-width: 500px) {
    .contents_wrapper08{
        height: 140px;
    }
}
.contents_wrapper09{
    background-image: url("../img/contents_wrapper06__bg-img.png");
    height: 800px;
    width: 100%;
    background-size: cover;
    background-repeat: no-repeat;
    margin-top: -840px;
    position: relative;
    z-index: -99;
}
@media screen and (max-width: 1900px) {
    .contents_wrapper09{
        height: 680px;
    }
}
@media screen and (max-width: 1300px) {
    .contents_wrapper09{
        height: 816px;
    }
}
@media screen and (max-width: 900px) {
    .contents_wrapper09{
        height: 770px;
    }
}
@media screen and (max-width: 500px) {
    .contents_wrapper09{
        height: 840px;
    }
}

.contents10{
    width: 100%;
    max-width: 1088px;
    margin: 0 auto 200px;
    display: flex;
    justify-content: center;
}
@media screen and (max-width: 1200px) {
    .contents10{
        padding: 0 20px;
        max-width: fit-content;
    }
}
.contact_btn{
    background-image: url("../img/contact_btn01.png");
    width: 336px;
    height: 133px;
    display: block;
    background-size: contain;
    background-repeat: no-repeat;
}
.contact_btn:hover{
    background-image: url("../img/contact_btn02.png");
    width: 336px;
    height: 133px;
    display: block;
    background-size: contain;
    transition: 0.5s;
    background-repeat: no-repeat;
}
@media screen and (max-width: 400px) {
    .contact_btn{
        width: 300px;
        height: 118px;
    }
    .contact_btn:hover{
        width: 300px;
        height: 118px;
    }
}
@media screen and (max-width: 330px) {
    .contact_btn{
        width: 280px;
        height: 110px;
    }
    .contact_btn:hover{
        width: 280px;
        height: 110px;
    }
}


.function__header{
    color: #fff;
    font-size: 6rem;
    font-weight: 600;
    text-align: center;
    letter-spacing: 0.05em;
    margin-bottom: 90px;
}
@media screen and (max-width: 500px) {
    .function__header {
        font-size: 4rem;
    }
}
.function__wrapper{
    display: flex;
    flex-direction: column;
}
.function__list01{
    display: flex;
    flex-direction: column;
    background-color: #fff;
    padding: 20px 43px 40px;
    margin: 0 105px 60px 0;
    opacity: 0;
    transition: all 1s; 
}
.function__list02{
    display: flex;
    flex-direction: column;
    background-color: #fff;
    padding: 20px 43px 40px;
    margin-left: 105px;
    margin-bottom: 60px;
    margin: 0 0 60px 105px;
    opacity: 0;
    transition: all 2s; 
}
.function__list03{
    display: flex;
    flex-direction: column;
    background-color: #fff;
    padding: 20px 43px 40px;
    margin: 0 105px 60px 0;
    opacity: 0;
    transition: all 3s; 
}
.function__list04{
    display: flex;
    flex-direction: column;
    background-color: #fff;
    padding: 20px 43px 40px;
    margin-left: 105px;
    margin-bottom: 60px;
    margin: 0 0 60px 105px;
    opacity: 0;
    transition: all 4s; 
}
@media screen and (max-width: 800px) {
    .function__list01 {
        margin: 0 50px 60px 0;
    }
    .function__list02 {
        margin: 0 0 60px 50px;
    }
}
@media screen and (max-width: 500px) {
    .function__list01, .function__list02 {
        margin: 0 0 60px;
    }
}
.function__item{
    background-color: #02A7A1;
    width: max-content;
    height: 60px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-left: -50px;
    margin-bottom: 20px;
    padding-left: 50px;
}
.function__item::after{
    content: "";
    width: 60px;
    aspect-ratio: 1;
    clip-path: polygon(0 100%,100% 0,100% 100%);
    background-color: #fff;
    margin-right: -1px;
    margin-bottom: -1px;
}
.function__number{
    color: #fff;
    font-size: 2.5rem;
    font-weight: 600;
}
.function__txt{
    color: #595858;
    line-height: 2;
}





.fadeIn {
    opacity: 1;
}

/*-----------------------------------------------
*	Contact
*-----------------------------------------------*/
.contact{
    background-color: #87C9C3;
    background: url("../img/contact__bg-img.png");
    width: 100%;
    height: 100%;
    background-size: cover;
}
.contact__wrapper{
    width: 100%;
    max-width: 1088px;
    margin: 0 auto;
    padding: 100px 0 114px;
    display: flex;
    flex-direction: column;
    align-items: center;
}
@media screen and (max-width: 1026px) {
    .contact__wrapper{
        max-width: -webkit-fill-available;
        max-width: -moz-available;
        padding: 100px 20px 114px;
    }
}
.contact__title{
    color: #fff;
    font-size: 70px;
    font-weight: 600;
    font-family: "Roboto", sans-serif;
    margin-bottom: 20px;
}
.contact__sub_title{
    color: #fff;
    font-size: 20px;
    margin-bottom: 32px;
}
.contact__txt01{
    color: #fff;
    font-size: 15px;
    margin-bottom: 85px;
}
.contact__section{
    background-color: #fff;
    width: 100%;
    max-width: 986px;
    padding-top: 65px;
    display: flex;
    flex-direction: column;
}
@media screen and (max-width: 1026px) {
    .contact__section{
        max-width: -webkit-fill-available;
        max-width: -moz-available;
        padding: 65px 20px 0;
    }
}
.contact__list{
    padding: 0 40px;
}
@media screen and (max-width: 500px) {
    .contact__list{
        padding: 0;
    }
}
.contact__tel_wrapper{
    display: flex;
    align-items: center;
}
@media screen and (max-width: 500px) {
    .contact__tel_wrapper{
        width: -webkit-fill-available;
        width: -moz-available;
    }
}
.contact__box01 input{
    background-color: #DDDDDD;
    border: none;
    width: 100%;
    max-width: 660px;
    height: 44px;
    font-size: 16px;
    padding-left: 18px;
}
@media screen and (max-width: 1026px) {
    .contact__box01 input{
        width: -webkit-fill-available;
        width: -moz-available;
    }
}
.contact__name_wrapper{
    display: flex;
}
.contact__name_wrapper input{
    background-color: #DDDDDD;
    border: none;
    width: 100%;
    max-width: 132px;
    height: 44px;
    font-size: 16px;
    margin-right: 10px;
    padding-left: 18px;
}
@media screen and (max-width: 1026px) {
    .contact__name_wrapper{
        width: -webkit-fill-available;
        width: -moz-available;
    }
}
@media screen and (max-width: 816px) {
    .contact__name_wrapper input{
        width: auto!important;
    }
}
@media screen and (max-width: 500px) {
    .contact__name_wrapper input{
        max-width: 109px;
    }
}
.contact__required{
    width: 23px;
    font-size: 10px;
    background-color: #dc3232;
    color: #fff;
    font-weight: 600;
    padding: 2px 4px;
    border-radius: 2px;
    margin: 0 25px 0 0;
}
@media screen and (max-width: 816px) {
    .contact__required{
        margin: 0 25px 20px 0;
    }
}
.contact__tel_wrapper input{
    background-color: #DDDDDD;
    border: none;
    width: 100%;
    max-width: 64px;
    height: 44px;
    font-size: 16px;
    padding-left: 18px;
}
@media screen and (max-width: 1026px) {
    .contact__tel_wrapper input{
        width: -webkit-fill-available;
        width: -moz-available;
    }
}
.contact__box01{
    width: 100%;
    display: flex;
    margin-bottom: 48px;
}
@media screen and (max-width: 816px) {
    .contact__box01{
        flex-direction: column;
    }
}
.contact__item{
    display: flex;
    flex-direction: column;
    align-items: flex-end;
}
@media screen and (max-width: 816px) {
    .contact__item{
        align-items: flex-start;
    }
}
.contact__txt02{
    font-size: 18px;
    min-width: 180px;
    text-align: right;
    margin: 0 25px 0 0;
}
@media screen and (max-width: 816px) {
    .contact__txt02{
        text-align: left;
        margin: 0 0 10px;
    }
}
.contact__tel_hyphen{
    border-top: solid 3px #595858;
    width: 8px;
    display: flex;
    justify-content: center;
    margin: 0 8px;
}
.wpcf7-form-control-wrap{
    width: -webkit-fill-available!important;
    width: -moz-available!important;
}
.contact__name_wrapper .wpcf7-form-control-wrap,
.contact__tel_wrapper .wpcf7-form-control-wrap{
    width: auto!important;
}
@media screen and (max-width: 1026px) {
    .contact__name_wrapper .wpcf7-form-control-wrap{
        width: auto!important;
    }
}
.contact__box01 textarea{
    background-color: #DDDDDD;
    border: none;
    width: 100%;
    width: -webkit-fill-available!important;
    width: -moz-available!important;
    max-width: 660px;
    font-size: 16px;
    line-height: 1.5;
    padding: 8px;
}
.contact__box02{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    margin-bottom: 56px;
}
.contact__box02 p{
    width: fit-content;
}
@media screen and (max-width: 1026px) {
    .contact__box02{
        width: -webkit-fill-available;
        width: -moz-available;
    }
}
.contact__box02 input{
    color: #fff;
    background-color: #02A7A1;
    border: solid 2px #02A7A1;
    font-size: 20px;
    letter-spacing: 0.05em;
    width: 194px;
    height: 44px;
    border-radius: 8px;
    display: flex;
    justify-content: center;
    align-items: center;
}
.contact__box02 input:hover{
    cursor: pointer;
    color: #02A7A1;
    background-color: #fff;
    border: solid 2px #02A7A1;
    font-size: 20px;
    transition: 0.6s;
}
.wpcf7-previous{
    background-color: #585858!important;
    border: solid 2px #585858!important;
}
.wpcf7-previous:hover{
    cursor: pointer;
    background-color: #fff!important;
    font-size: 20px;
    color: #585858!important;
    transition: 0.6s;
}
.wpcf7-response-output{
    display: none;
}
/*-----------------------------------------------
*	Thanks Page
*-----------------------------------------------*/
.contact_thanks{
    background: url("../img/contact__bg-img.png");
    width: -webkit-fill-available;
    width: -moz-available;
    height: calc(100vh - 200px);
    background-size: cover;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-top: -20px;
}
@media screen and (max-width: 700px) {
    .contact_thanks{
        padding: 0 20px;
    }
}
.contact_thanks__wrapper{
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    margin-bottom: 200px;
}
@media screen and (max-width: 700px) {
    .contact_thanks__wrapper{
        margin-bottom: 100px;
    }
}
.contact_thanks__title{
    color: #fff;
    font-size: 50px;
    text-align: center;
    font-weight: 600;
    line-height: 1.5;
    margin-bottom: 20px;
}
.contact_thanks_txt{
    color: #fff;
    font-size: 20px;
    line-height: 2;
    text-align: center;
}
@media screen and (max-width: 700px) {
    .contact_thanks_txt{
        text-align: left;
    }
    .contact_thanks__title{
        font-size: 26px;
    }
}

/*-----------------------------------------------
*	404 Page
*-----------------------------------------------*/
.error_page{
    background: url("../img/contact__bg-img.png");
    width: -webkit-fill-available;
    width: -moz-available;
    height: calc(100vh - 190px);
    background-size: cover;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
}
@media screen and (max-width: 700px) {
    .error_page{
        padding: 0 20px;
    }
}
.error_page__link{
    color: #fff;
    text-decoration: underline;
}