@charset "utf-8";

/*=========================
 共通
=========================*/
/*--- バナー ---*/
.bnr02 {
    line-height: 0;
}
.bnr03 {
    width: 100%;
    max-width: 700px;
    line-height: 0;
    padding: 35px 2%;
    margin: 0 auto;
}
.bnr03 img {
    box-shadow: 4px 3px 10px #dddddd;
}

/*=========================
 下層 main内
=========================*/
main {
}

/*===== #mv =====*/
#mv {
}
#mv .mv-img {
    line-height: 0;
}
#mv .mv-img .mv-sp {
    display: none;
}

/*===== #front =====*/
#front {
    padding: 30px 0;
}
#front .top-hx {
    flex-direction: row-reverse;
    margin-bottom: 25px;
}

/*===== #order =====*/
#order {
    padding: 30px 0 0;
}
#order .top-hx {
}
#order .top-hx .hx-img img {
    width: auto;
    height: 175px;
}
#order .text-box {
    background: url(../img/common/bg02.png) no-repeat center top;
    padding-top: 35px;
    padding-bottom: 30px;
}
#order .text-box .main-text {
    background: url(../img/common/next01.png) no-repeat center top;
    background-size: 250px;
    padding-top: 50px;
    text-align: center;
}
#order .text-box .main-text .text {
    font-size: 30px;
    font-weight: bold;
    line-height: 1.6;
}
#order .text-box .main-text .fs1 {
    font-size: 35px;
}
#order .text-box .main-text .fs2 {
    font-size: 40px;
}
#order .text-box .sub-text {
    text-align: center;
    font-weight: bold;
}
#order .text-box .sub-text .text {
    font-size: 24px;
    line-height: 1.6;
}
#order .text-box .sub-text .fs3 {
    font-size: 30px;
}
#order .text-box .sub-text .fs4 {
    font-size: 20px;
}

/*===== #nayami01 =====*/
#nayami01 {
    padding: 30px 0;
}
#nayami01 .top-hx {
    flex-direction: row-reverse;
    margin-bottom: 25px;
}
#nayami01 .top-hx .hx-img img {
    width: auto;
    height: 175px;
}
#nayami01 .top-text {
    font-size: 22px;
    text-align: center;
    font-weight: bold;
}
#nayami01 .fs1 {
    font-size: 24px;
}
#nayami01 .bottom-text {
    font-size: 24px;
    text-align: center;
    font-weight: bold;
}
#nayami01 .fs2 {
    font-size: 30px;
}

/*===== #nayami02 =====*/
#nayami02 {
    padding: 30px 0;
}
#nayami02 .top-hx .hx-img img {
    height: 175px;
}
#nayami02 .img {
    padding: 35px 2% 0;
    margin-bottom: 25px;
    background: linear-gradient(to bottom, #d7eff7 -50%, #ffffff 100%);
}
#nayami02 .text-box {
    font-size: 24px;
    text-align: center;
    font-weight: bold;
}
#nayami02 .text-box .fs1 {
    font-size: 30px;
}

/*===== #rebound =====*/
#rebound {
    padding: 30px 0;
}
#rebound .top-hx {
    margin-bottom: 25px;
}
#rebound .img01 {
    width: 100%;
    max-width: 850px;
    background: url(../img/common/next01.png) no-repeat center top;
    background-size: 250px;
    padding: 65px 2% 0;
    margin: 0 auto 40px;
}
#rebound .text-box {
    font-size: 24px;
    text-align: center;
}
#rebound .text-box .fs1 {
    font-size: 30px;
}
#rebound .text-box .fs2 {
    font-size: 20px;
}
#rebound .syukan {
    width: 90%;
    margin: 45px auto 0;
}
#rebound .syukan .top-hx {
    flex-direction: row-reverse;
}
#rebound .syukan .top-hx .hx span {
    color: #fff98d;
    font-size: 38px;
    font-weight: bold;
}
#rebound .syukan .top-hx .hx-img img {
    height: 140px;
}
#rebound .syukan .box {
    background: url(../img/common/syukan-icon01.png) no-repeat left top;
    background-size: 100px;
    padding: 7px 0 15px 110px;
    width: 100%;
    max-width: 700px;
    margin: 0 auto 15px;
}
#rebound .syukan .box.icon01 {
    background-image: url(../img/common/syukan-icon01.png);
}
#rebound .syukan .box.icon02 {
    background-image: url(../img/common/syukan-icon02.png);
}
#rebound .syukan .box.icon03 {
    background-image: url(../img/common/syukan-icon03.png);
}
#rebound .syukan .box h4 {
    line-height: 1.4;
    font-size: 24px;
    font-weight: bold;
    margin-bottom: 10px;
}
#rebound .syukan .box .txt {
    line-height: 1.4;
    font-size: 20px;
}
#rebound .syukan .ans-box {
    background: url(../img/common/next02.png) no-repeat center top;
    background-size: 250px;
    padding-top: 60px;
}
#rebound .syukan .ans-box .txt {
    text-align: center;
    font-size: 25px;
    font-weight: bold;
    line-height: 1.4;
    margin-bottom: 25px;
}
#rebound .syukan .ans-box .img02 {
    width: 100%;
    max-width: 800px;
    margin: 0 auto;
}

/*===== #tigai =====*/
#tigai {
    padding: 30px 0;
}
#tigai .top-hx {
    flex-direction: row-reverse;
    margin-bottom: 25px;
}
#tigai .top-hx .hx-img img {
    height: 175px;
}
#tigai .top-box {
    text-align: center;
    font-size: 25px;
    font-weight: bold;
}
#tigai .top-box .fs1 {
    font-size: 30px;
}
#tigai .top-box .fs2 {
    font-size: 35px;
}
#tigai .top-box .next01 {
    width: 100%;
    max-width: 300px;
    margin: 0 auto 20px;
}
#tigai .check-box {
    position: relative;
}
#tigai .check-box .img {
    width: 55%;
}
#tigai .check-box .box {
    position: absolute;
    top: 5%;
    right: 0;
    width: 55%;
    background-color: #ffffffb3;
    padding: 3% 3% 2%;
    font-size: 16px;
}
#tigai .check-box .box ul {
}
#tigai .check-box .box ul li {
    background: url(../img/common/icon01.png) no-repeat left top;
    background-size: 20px;
    line-height: 1.4;
    font-weight: bold;
    margin-bottom: 6px;
    padding: 0 0 3px 28px;
}
#tigai .txt {
    line-height: 1.6;
    font-size: 18px;
    padding: 0 3%;
    margin-top: 20px;
}
#tigai .bottom-box {
    text-align: center;
    font-size: 25px;
    font-weight: bold;
    margin-top: 30px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
}
#tigai .bottom-box .img {
    width: 25%;
}
#tigai .bottom-box .box {
    width: 50%;
    margin-right: 3%;
}
#tigai .bottom-box .box .next02 {
    width: 100%;
    max-width: 300px;
    margin-bottom: 20px;
    margin-left: auto;
}
#tigai .bottom-box .fs1 {
    font-size: 30px;
}
#tigai .bottom-box .fs2 {
    font-size: 35px;
}
#tigai .bottom-box .last {
    width: 100%;
}

/*===== #dna =====*/
#dna {
    padding: 30px 0;
}
#dna .top-hx {
    flex-direction: row-reverse;
    margin-bottom: 25px;
}
#dna .dna-box {
    text-align: center;
    font-size: 25px;
    font-weight: bold;
}
#dna .dna-box .img {
    width: 100%;
    max-width: 800px;
    margin: 0 auto 25px;
}
#dna .dna-box ol {
    background-color: #f2f6fb;
    line-height: 1.4;
    font-size: 20px;
    width: 100%;
    max-width: 800px;
    padding: 3%;
    margin: 0 auto 25px;
}
#dna .dna-box ol li {
    margin-bottom: 16px;
}
#dna .dna-box ol li.last {
    margin-bottom: 0;
}
#dna .dna-box ol li .fc1 {
    display: block;
    font-size: 24px;
}
#dna .dna-box ul {
    background-color: #ffffff;
    border: 2px solid #8c96cb;
    box-shadow: 4px 3px 10px #dddddd;
    line-height: 1.4;
    text-align: left;
    font-size: 23px;
    width: 100%;
    max-width: 600px;
    padding: 3%;
    margin: 0 auto 25px;
}
#dna .dna-box ul li {
    background: url(../img/common/icon02.png) no-repeat left top;
    background-size: 35px;
    padding: 3px 0 3px 45px;
    margin-bottom: 12px;
}
#dna .dna-box ul li.last {
    margin-bottom: 0;
}
#dna .dna-box .fs1 {
    font-size: 30px;
}
#dna .dna-box .fs2 {
    font-size: 35px;
}
#dna .btn {
    width: 90%;
    margin: 0 auto 25px;
}
#dna .memo-box {
    background-color: #f2f6fb;
    width: 100%;
    max-width: 800px;
    font-size: 18px;
    padding: 3%;
    margin: 0 auto;
}
#dna .memo-box .text {
    margin-bottom: 0;
}

/*===== #point =====*/
#point {
    padding: 30px 0;
}
#point .top-hx {
    flex-direction: row-reverse;
    margin-bottom: 25px;
}
#point .top-hx .hx-img img {
    height: 175px;
}
#point .point-box {
    width: 96%;
    max-width: 800px;
    margin: 55px auto 0;
    background-color: #fff;
    border: 2px solid #5988c1;
    border-bottom-right-radius: 30px;
    box-shadow: 4px 3px 10px #dddddd;
    padding: 20px;
    position: relative;
}
#point .point-box.n2 {
    border-bottom-right-radius: 0;
    border-bottom-left-radius: 30px;
}
#point .point-box .icon {
    width: 300px;
    position: absolute;
    top: -40px;
    left: 20px;
}
#point .point-box.n2 .icon {
    left: auto;
    right: 20px;
}
#point .point-box .box {
    margin-top: 20px;
}
#point .point-box .box h3 {
    color: #f33180;
    width: 57%;
    float: right;
    line-height: 1.4;
    font-size: 20px;
    font-weight: bold;
    border-bottom: 2px solid #8bb4e5;
    padding-bottom: 5px;
    margin-bottom: 10px;
}
#point .point-box.n2 .box h3 {
    float: left;
}
#point .point-box .box .img {
    width: 40%;
    float: left;
    margin-right: 3%;
    margin-bottom: 10px;
}
#point .point-box.n2 .box .img {
    float: right;
    margin-left: 3%;
    margin-right: 0;
}
#point .point-box .box .text {
    font-size: 16px;
}
#point .point-box .box .text span {
    color: #f33180;
}
#point .ans-box {
    text-align: center;
    font-size: 25px;
    font-weight: bold;
    margin: 40px 0;
}
#point .ans-box .img {
    background: url(../img/common/next01.png) no-repeat center top;
    background-size: 250px;
    padding-top: 65px;
}
#point .ans-box .box {
    font-size: 20px;
    font-weight: normal;
    background: url("../img/common/bg-sankaku01.png") no-repeat left top,
                url("../img/common/bg-sankaku02.png") no-repeat right bottom;
    background-color: #d6e9ffc4;
    border: 2px solid #5988c1;
    width: 100%;
    max-width: 850px;
    padding: 2%;
    margin: -60px auto 0;
    position: relative;
    z-index: 1;
}
#point .ans-box .box .text {
    line-height: 1.4;
}
#point .ans-box .box .text.last {
    margin-bottom: 0;
}
#point .ans-box .box .fwb {
    font-size: 24px;
}
#point .counseling {
    background-color: #fffdea;
    border-top: 2px solid #f33180;
    border-bottom: 2px solid #f33180;
    margin-top: 55px;
    padding: 30px 5%;
}
#point .counseling h3 {
    width: 530px;
    line-height: 1.4;
    font-size: 30px;
    font-weight: bold;
    color: #fff;
    background-color: #f33180;
    padding: 5px 10px;
    margin: -60px auto 25px;
}
#point .counseling .box {
    display: flex;
    flex-wrap: wrap;
    flex-direction: row-reverse;
    justify-content: space-between;
    margin-bottom: 15px;
}
#point .counseling .box .img {
    width: 40%;
}
#point .counseling .box .text-box {
    width: 57%;
}
#point .counseling .box .text-box ul {
}
#point .counseling .box .text-box ul li {
    background: url(../img/common/icon01.png) no-repeat left 3px;
    background-size: 22px;
    line-height: 1.4;
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 6px;
    padding: 0 0 3px 28px;
}
#point .counseling .text {
    font-size: 18px;
}

/*===== #top-step =====*/
#top-step {
    padding: 30px 0;
}
#top-step .top-hx {
    margin-bottom: 25px;
}
#top-step .top-hx .hx-img img {
    height: 175px;
}
#top-step .step-box {
    position: relative;
    width: 90%;
    max-width: 850px;
    margin: 0 auto;
    padding-left: 37px;
    padding-top: 16px;
}
#top-step .step-box .icon {
    width: 75px;
    position: absolute;
    top: 0;
    left: 0;
}
#top-step .step-box h3 {
    width: 43%;
    background-color: #ff8fa7;
    border-radius: 10px;
    line-height: 1.4;
    font-size: 18px;
    font-weight: bold;
    color: #fff;
    padding: 10px 3% 10px 45px;
    text-align: center;
}
#top-step .step-box .box {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    border-left: 3px solid #ff8fa7;
    padding-left: 37px;
    padding-bottom: 15px;
}
#top-step .step-box.last .box {
    border-left: none;
}
#top-step .step-box .box .img {
    width: 37%;
}
#top-step .step-box .box .text-box {
    width: 60%;
    padding-top: 10px;
}
#top-step .step-box .box .text-box .text {
}

/*===== #faq =====*/
#faq {
    padding: 30px 0;
}
#faq .top-hx {
    flex-direction: row-reverse;
    margin-bottom: 25px;
}
#faq .top-hx .hx span {
    color: #fff98d;
    font-size: 38px;
    font-weight: bold;
}
#faq .faq-box {
    width: 100%;
    max-width: 1000px;
    margin: 0 auto;
    padding: 2%;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}
#faq .faq-box .box {
    width: 49%;
    background-color: #f1f6fb;
    line-height: 1.4;
    padding: 3%;
    margin-bottom: 15px;
}
#faq .faq-box .box.w100 {
    width: 100%;
}
#faq .faq-box .box dl {
}
#faq .faq-box .box dl dt {
    font-size: 18px;
    font-weight: bold;
    color: #5988c1;
    background: url(../img/common/icon-q.png) no-repeat left bottom 5px;
    background-size: 35px;
    border-bottom: 2px solid #9abfeb;
    padding: 6px 0 9px 45px;
    margin-bottom: 15px;
}
#faq .faq-box .box dl dd {
    background: url(../img/common/icon-a.png) no-repeat left top;
    background-size: 35px;
    padding-left: 45px;
}


/*===============================================
    ■tablet 画面の横幅が800pxまで
===============================================*/
@media screen and (max-width: 800px) {
/*===== #tigai =====*/
  #tigai .check-box {
    position: static;
  }
  #tigai .check-box .img {
    width: 100%;
  }
  #tigai .check-box .box {
    position: static;
    top: auto;
    right: auto;
    width: 100%;
  }
  #tigai .bottom-box {
    align-items: flex-end;
  }
/*===== #point =====*/
  #point .counseling h3 {
    width: 80%;
    font-size: 22px;
    text-align: center;
    padding: 5px 19px;
  }
/*===== #faq =====*/
  #faq .faq-box .box {
    width: 100%;
  }
}

/*===============================================
    ■tablet 画面の横幅が570pxまで
===============================================*/
@media screen and (max-width: 570px) {
/*===== #mv =====*/
  #mv .mv-img .mv-pc {
    display: none;
  }
  #mv .mv-img .mv-sp {
    display: block;
  }
/*===== #front =====*/
  #front {
    padding: 30px 0 10px;
  }
/*===== #order =====*/
  #order .top-hx {
    align-items: flex-end;
  }
  #order .top-hx .hx-img img {
    height: 100px;
  }
  #order .text-box {
    padding-bottom: 0;
  }
  #order .text-box .main-text .text {
    font-size: 18px;
  }
  #order .text-box .main-text .fs1 {
    font-size: 20px;
  }
  #order .text-box .main-text .fs2 {
    font-size: 25px;
  }
  #order .text-box .sub-text .text {
    font-size: 17px;
  }
  #order .text-box .sub-text .fs3 {
    font-size: 24px;
  }
  #order .text-box .sub-text .fs4 {
    font-size: 15px;
  }
/*===== #nayami01 =====*/
  #nayami01 {
    padding: 30px 0 0;
  }
  #nayami01 .top-hx {
    align-items: flex-end;
  }
  #nayami01 .top-hx .hx-img img {
    height: 100px;
  }
  #nayami01 .top-text {
    font-size: 20px;
  }
  #nayami01 .fs1 {
    font-size: 22px;
  }
  #nayami01 .bottom-text {
    font-size: 20px;
  }
  #nayami01 .fs2 {
    font-size: 24px;
  }
/*===== #nayami01 =====*/
  #nayami021 {
    padding: 30px 0 0;
  }
  #nayami02 .top-hx {
    align-items: flex-end;
  }
  #nayami02 .top-hx .hx-img img {
    height: 100px;
  }
  #nayami02 .text-box {
    font-size: 20px;
  }
  #nayami02 .text-box .fs1 {
    font-size: 22px;
  }
/*===== #rebound =====*/
  #rebound {
    padding: 30px 0 0;
  }
  #rebound .text-box {
    font-size: 20px;
  }
  #rebound .text-box .fs1 {
    font-size: 24px;
  }
  #rebound .syukan .top-hx {
    align-items: flex-end;
  }
  #rebound .syukan .top-hx .hx-img img {
    height: 100px;
  }
  #rebound .syukan .top-hx .hx span {
    font-size: 20px;
  }
  #rebound .syukan .box {
    background-size: 50px;
    padding: 7px 0 15px 60px;
  }
  #rebound .syukan .box h4 {
    font-size: 20px;
  }
  #rebound .syukan .ans-box .txt {
    font-size: 20px;
  }
/*===== #tigai =====*/
  #tigai .top-hx .hx-img img {
    height: 100px;
  }
  #tigai .top-box {
    font-size: 20px;
  }
  #tigai .top-box .fs1 {
    font-size: 24px;
  }
  #tigai .top-box .next01 {
    width: 50%;
  }
  #tigai .top-box .fs1 {
    font-size: 22px;
  }
  #tigai .top-box .fs2 {
    font-size: 23px;
  }
  #tigai .bottom-box {
    font-size: 20px;
  }
  #tigai .bottom-box .box {
    width: 100%;
    margin-right: 0;
  }
  #tigai .bottom-box .box .next02 {
    width: 50%;
    margin: 0 auto 20px;
  }
  #tigai .bottom-box .fs1 {
    font-size: 24px;
  }
  #tigai .bottom-box .fs2 {
    font-size: 24px;
  }
  #tigai .bottom-box .img {
    width: 200px;
  }
/*===== #dna =====*/
  #dna .dna-box {
    font-size: 20px;
  }
  #dna .dna-box ol {
    font-size: 16px;
  }
  #dna .dna-box ol li .fc1 {
    font-size: 18px;
  }
  #dna .dna-box ul {
    font-size: 18px;
  }
  #dna .dna-box ul li {
    background-size: 25px;
    padding: 1px 0 3px 32px;
  }
  #dna .dna-box .fs1 {
    font-size: 24px;
  }
  #dna .dna-box .fs2 {
    font-size: 24px;
  }
/*===== #point =====*/
  #point .top-hx {
    align-items: flex-end;
  }
  #point .top-hx .hx-img img {
    height: 100px;
  }
  #point .point-box .box h3 {
    width: 100%;
    float: none;
    font-size: 18px;
  }
  #point .point-box .icon {
    width: 250px;
    top: -28px;
    left: 0;
    right: 0;
    margin: auto;
  }
  #point .point-box.n2 .icon {
    left: 0;
    right: 0;
  }
  #point .point-box .box .img {
    width: 100%;
    float: none;
    margin-right: 0;
    margin-bottom: 10px;
  }
  #point .ans-box {
    font-size: 20px;
    margin: 20px 0;
  }
  #point .ans-box .box {
    font-size: 16px;
    text-align: left;
    padding: 6%;
    margin: 0 auto 0;
  }
  #point .ans-box .box .fwb {
    font-size: 16px;
  }
  #point .counseling .box {
    margin-bottom: 0;
  }
  #point .counseling .box .img {
    width: 100%;
    margin-bottom: 10px;
  }
  #point .counseling .box .text-box {
    width: 100%;
  }
/*===== #top-step =====*/
  #top-step .top-hx {
    align-items: flex-end;
  }
  #top-step .top-hx .hx-img img {
    height: 100px;
  }
  #top-step .step-box h3 {
    width: 100%;
  }
  #top-step .step-box .box .img {
    width: 95%;
  }
  #top-step .step-box .box .text-box {
    width: 95%;
  }
}