@charset "UTF-8";

/******************************************************************************
*
* [共通]ヘッダー
*
******************************************************************************/

/*---------------------
* トップバー
---------------------*/

header.hero_area .topbar {
    background-image: url(../images/fv/bg1.jpg);
    background-size: cover;
    padding: 10px 0;
}

header.hero_area .topbar .tb {
    width: 70%;
    margin: auto;
}

/*---------------------
* FV
---------------------*/

header.hero_area .fv {
    background-image: url(../images/fv/bg2.jpg);
    background-size: cover;
    background-position: center bottom;
    padding: 50px 0;
}

header.hero_area .fv .main {
    width: 90%;
    margin: auto;
}

header.hero_area .fv .mov_box {
    width: 75%;
    box-sizing: border-box;
    margin: auto;
    border: solid 8px #fff;
    position: relative;
    margin-top: 20px;
}

header.hero_area .fv .mov_box::before {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 15px 20px 15px;
    border-color: transparent transparent #e8949e transparent;
    position: absolute;
    top: -20px;
    left: 0;
    right: 0;
    margin: auto;
}

header.hero_area .fv aside {
    text-align: center;
    font-size: 14px;
    margin-top: 7px;
}

/*---------------------
* 動画
---------------------*/

/*サイズの固定化*/

#movie_container {
    width: 100%;
    height: auto;
    margin: 0 auto;
    position: relative;
}

#movie_container::before {
    content: "";
    display: block;
    padding-top: 56.2%;
}

#movie_container #movie_main {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/*ボタン以外をクリックして再生されるのを防ぐため、全体を覆うマスクを敷く*/

#movie_container #movie_msk {
    width: 100%;
    height: 100%;
    position: absolute;
    top: 0;
    left: 0;
    /*アイキャッチを自作する場合は背景画像を敷く*/
    background-image: url(../images/fv/mov_thum.jpg);
    background-size: cover;
    background-position: center;
}

/*再生ボタン*/

#movie_container #movie_start_btn {
    display: block;
    width: 100px;
    height: 100px;
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translateY(-50%) translateX(-50%);
    -webkit- transform: translateY(-50%) translateX(-50%);
    cursor: pointer;
}

#movie_container #movie_start_btn img {
    display: block;
    position: relative;
    z-index: 3;
}


/******************************************************************************
*
* [共通]ステップ
*
******************************************************************************/

#step .lead {
    width: 70%;
    margin: 0 auto 50px;
}

/*---------------------
* リスト
---------------------*/

#step .list dl {
    display: flex;
    justify-content: space-between;
    box-sizing: border-box;
    padding: 30px;
    background: #f5f6fd;
    border-radius: 10px;
}

#step .list dl:nth-child(n+2) {
    margin-top: 30px;
}

#step .list dl dt {
    width: 47%;
}

#step .list dl dd {
    width: 50%;
}

#step .list dl dd a {
    display: block;
    width: 65%;
    margin-top: 15px;
}

/******************************************************************************
*
* [共通]CTA/特典
*
******************************************************************************/

article.cta {
    background-image: url(../images/fv/bg3.jpg);
    background-size: cover;
    background-position: center;
    position: relative;
}

article.cta .arrow {
    width: 170px;
    position: absolute;
    top: -20px;
    left: 0;
    right: 0;
    margin: auto;
}

/*リード*/

article.cta .lead {
    width: 65%;
    margin: 0 auto 30px;
}

/*特典*/

article.cta .gift {
    filter: drop-shadow(3px 3px 5px rgba(0, 0, 0, 0.2));
    transform: translateZ(0);
}

/*テキスト*/

article.cta .txt1 {
    width: 65%;
    margin: 30px auto 20px;
}

/*ボタン*/

article.cta .btn1 {
    width: 60%;
    margin: auto;
}

article.cta aside {
    text-align: center;
    font-size: 14px;
    margin-top: 7px;
}

article.cta .btn2 {
    width: 40%;
    margin: 50px auto 0;
    cursor: pointer;
}

/*---------------------
* CTA直前
---------------------*/

#before {
    padding: 50px 0 70px;
}

#before .txt2 {
    width: 80%;
    margin: auto;
}

/*---------------------
* 受け取り方
---------------------*/

article.cta .cta_step {
    padding-top: 50px;
    position: relative;
    display: none;
}

article.cta .cta_step .box {
    background: #fff;
    width: 85%;
    margin: auto;
    box-sizing: border-box;
    border: solid 4px #ad6375;
    position: relative;
}

article.cta .cta_step .box::before {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 0 15px 20px 15px;
    border-color: transparent transparent #ad6375 transparent;
    position: absolute;
    top: -20px;
    left: 0;
    right: 0;
    margin: auto;
}

/*見出し*/

article.cta .cta_step .box h2 {
    text-align: center;
    background: #ad6375;
    color: #fff;
    font-size: 30px;
    font-weight: 700;
    padding: 40px 10px;
}

/*インナー*/

article.cta .cta_step .box .inner {
    padding: 30px;
}

article.cta .cta_step .box .inner section:last-child {
    padding-top: 30px;
    margin-top: 30px;
    border-top: dotted 1px #ccc;
}

article.cta .cta_step .box .inner h3 {
    text-align: center;
    font-size: 18px;
}

article.cta .cta_step .box .inner h3 span {
    display: inline-block;
    padding: 5px 20px;
    border: solid 1px #000;
    border-radius: 50px;
    margin-bottom: 30px;
}

/*補足*/

article.cta .cta_step .box .inner aside {
    text-align: center;
    font-size: 12px;
    margin-top: 10px;
    text-indent: -1em;
    padding-left: 1em;
    color: #666;
}



/******************************************************************************
*
* [共通]プロフ
*
******************************************************************************/

/*---------------------
* 1
---------------------*/

#prof1 {
    background-image: url(../images/prof/bg1.jpg);
    background-size: cover;
    background-position: center;
}

#prof1 .ava {
    width: 70%;
    margin: auto;
}

#prof1 .txt {
    width: 80%;
    margin: auto;
    box-sizing: border-box;
    padding: 50px;
    background: #fff;
    background-image: url(../images/prof/bg3.jpg);
    margin-top: -70px;
    position: relative;
    box-shadow: 7px 7px 15px rgba(0, 0, 0, 0.1);
    border: solid 4px #fff;
}

#prof1 .txt .name {
    width: 160px;
    margin-left: auto;
    margin-top: 30px;
}

/*---------------------
* 2
---------------------*/

#prof2 {
    background-image: url(../images/prof/bg2.jpg);
    background-size: cover;
    background-position: center;
    max-width: 1920px;
    margin: auto;
}

#prof2 .prof {
    width: 50%;
    ;
}


/******************************************************************************
*
* [共通]声(1)
*
******************************************************************************/

#voice1 {
    background-image: url(../images/voice/bg1.jpg);
    background-size: 100vw;
    background-position: center top;
}

#voice1 .lead {
    width: 60%;
    margin: 0 auto 60px;
}

/*---------------------
* リスト
---------------------*/

#voice1 .list dl {
    display: flex;
}

#voice1 .list dl:nth-child(even) {
    flex-flow: row-reverse;
}

#voice1 .list dl:nth-child(n+2) {
    margin-top: 50px;
}

#voice1 .list dl dt {
    width: 200px;
}

#voice1 .list dl dd {
    width: 90%;
    width: -webkit-calc(100% - 200px);
    width: calc(100% - 200px);
    box-sizing: border-box;
    background: #f5f6fd;
    padding: 30px 30px 40px;
    border-radius: 10px;
}

#voice1 .list dl:nth-child(odd) dd {
    border-top-left-radius: 0;
}

#voice1 .list dl:nth-child(even) dd {
    border-top-right-radius: 0;
}

/*アバター*/

#voice1 .list dl dt {
    position: relative;
}

#voice1 .list dl:nth-child(odd) dt::before {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 15px 10px 0;
    border-color: transparent #f5f6fd transparent transparent;
    position: absolute;
    right: 0;
    top: 35px;
}

#voice1 .list dl:nth-child(even) dt::before {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 10px 0 10px 15px;
    border-color: transparent transparent transparent #f5f6fd;
    position: absolute;
    left: 0;
    top: 35px;
}

#voice1 .list dl:nth-child(odd) dt img {
    border-top-left-radius: 10px;
    border-bottom-left-radius: 10px;
}

#voice1 .list dl:nth-child(even) dt img {
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
}

/*情報*/

#voice1 .list dl dd .info span {
    display: inline-block;
    font-size: 14px;
    background: #3d2545;
    color: #fff;
    padding: 1px 7px;
    margin-right: 2px;
}

/*見出し*/

#voice1 .list dl dd h2 {
    font-size: 32px;
    line-height: 1.4;
    font-weight: 900;
    color: #ae6375;
    margin: 10px 0 20px;
}

#voice1 .list dl dd p {
    font-size: 15px;
    line-height: 1.5;
}

#voice1 .list dl dd hr {
    border-width: 0;
    border-top: dotted 2px #ccc;
    margin: 20px 0;
}

#voice1 .list dl dd p.h {
    text-indent: -3.4em;
    padding-left: 3.4em;
}


/******************************************************************************
*
* [共通]声(2)
*
******************************************************************************/

#voice2 {
    background-color: #fbdfde;
    background-image: url(../images/voice/bg2.jpg);
    background-position: center top;
    background-size: 100vw;
    background-repeat: no-repeat;
    padding-top: 120px
}

#voice2 .lead {
    width: 650px;
    margin: 0 auto 40px;
}

/*---------------------
* リスト
---------------------*/

#voice2 .list ul li.box {
    padding: 0 10px;
}

#voice2 .list dl {
    background: #fff;
    box-sizing: border-box;
    height: 100%;
    border-radius: 8px;
    overflow: hidden;
}

/*アバター*/

#voice2 .list dl dt {
    width: 100%;
}

/*情報*/

#voice2 .list dl dd {
    font-size: 15px;
    line-height: 1.5;
    padding: 20px;
}

/*slick設定*/

.slick-track {
    display: flex;
}

.slick-slide {
    height: auto !important;
}

.slick-dots {
    bottom: -40px;
}

.slick-dots li {
    margin: 0;
}


/******************************************************************************
*
* [共通]注意
*
******************************************************************************/

#attention {
    background: #5464b4;
}

#attention .a {
    width: 80%;
    margin: 0 auto 30px;
}

#attention .btn {
    width: 400px;
    margin: auto;
}

/******************************************************************************
*
* [共通]誤解
*
******************************************************************************/

#mistake {
    background-image: url(../images/mistake/bg.jpg);
    background-size: 40px;
}

#mistake .lead {
    width: 70%;
    margin: 0 auto 80px;
}

#mistake p.mp {
    width: 85%;
    margin: auto;
    text-align: center;
}

#mistake p.mp.mp2 {
    margin-top: 70px;
}

/*---------------------
* テキスト
---------------------*/

#mistake .txt_sec {
    margin-top: 110px;
}

#mistake .txt_sec section {
    position: relative;
}

#mistake .txt_sec section:nth-child(n+2) {
    margin-top: 80px;
}

#mistake .txt_sec section .icon {
    width: 100px;
    position: absolute;
    left: 0;
    right: 0;
    top: -50px;
    margin: auto;
}

#mistake .txt_sec section .head {
    margin: 0 calc(50% - 600px);
    width: 1200px;
    border-radius: 15px;
    overflow: hidden;
}

#mistake .txt_sec section .txt {
    box-sizing: border-box;
    background: #fff;
    padding: 50px;
    border-radius: 15px;
    width: 90%;
    box-shadow: 7px 7px 20px rgb(15 41 53 / 20%);
    margin: -50px auto 0;
    position: relative;
}

/*見出し*/

#mistake .txt_sec section .txt .sec_lead {
    text-align: center;
    margin-bottom: 50px;
}

#mistake .txt_sec section .txt .sec_lead .num span {
    display: inline-block;
    font-size: 20px;
    font-weight: bold;
    background: #3d2545;
    color: #fff;
    padding: 5px 25px;
    border-radius: 50px;
    margin-bottom: 10px;
}

#mistake .txt_sec section .txt .sec_lead h2 {
    font-size: 32px;
    line-height: 1.5;
    font-weight: 900;
    color: #3d2545;
}

/******************************************************************************
*
* [共通]悩み
*
******************************************************************************/

/*---------------------
* 2
---------------------*/

#t2 {
    background: linear-gradient(0deg, rgba(9, 10, 14, 1) 0%, rgba(0, 38, 83, 1) 100%);
    position: relative;
}

#t2::before {
    content: "";
    display: block;
    width: 0;
    height: 0;
    border-style: solid;
    border-width: 30px 20px 0 20px;
    border-color: #ffffff transparent transparent transparent;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
}

#t2 .lead {
    width: 70%;
    margin: auto;
}

/*---------------------
* 3
---------------------*/

#t3 {
    background-image: url(../images/trouble/bg2.jpg);
    background-size: 100vw;
    background-position: center top;
    position: relative;
    padding-bottom: 100px;
}

#t3 p.tc {
    text-align: center;
    font-size: 18px;
    color: #fff;
    font-weight: 700;
}

#t3 .person {
    width: 60%;
    margin: 40px auto;
}

#t3 .arrow {
    width: 140px;
    margin: auto;
    position: absolute;
    bottom: -20px;
    left: 0;
    right: 0;
}

/*---------------------
* 4
---------------------*/

#t4 {
    background-image: url(../images/trouble/bg3.jpg);
    background-size: cover;
    background-position: center;
    padding: 100px 0
}

#t4 .lead {
    width: 85%;
    margin: 0 auto;
    filter: drop-shadow(0 0 4px #c8ad96) drop-shadow(0 0 8px rgba(200, 173, 150, 0.7));
    transform: translateZ(0);
}


/******************************************************************************
*
* [共通]未来
*
******************************************************************************/

#future {
    background-image: url(../images/future/bg.jpg);
    background-size: 100vw;
    background-position: center top;
}

#future .lead {
    width: 45%;
    margin: 0 auto 60px;
}

#future .list {
    width: 75%;
    margin: 0 auto;
}

/******************************************************************************
*
* [共通]コンテンツ
*
******************************************************************************/

#content {
    /*background-image: url(../images/future/bg.jpg);
    background-size: 100vw;
    background-position: center top;*/
    background: #f5f6fd;
    position: relative;
}

#content::before {
    content: "";
    display: block;
    background : linear-gradient(0deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 70%, rgba(255, 255, 255, 1) 100%);
    width: 100%;
    height: 20%;
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
}

#content .wrap {
    position: relative;
}

#content .lead {
    width: 60%;
    margin: 0 auto 60px;
}


#content .foot {
    width: 70%;
    margin: 30px auto 40px;
}

/*---------------------
* リスト
---------------------*/

#content .list dl {
    display: flex;
    justify-content: space-between;
    background: #fff;
    padding: 30px;
    box-sizing: border-box;
    width: 92%;
    box-shadow: 7px 7px 20px rgb(15 41 53 / 10%);
    border-left: solid 8px #ffdbdb;
}

#content .list dl:nth-child(n+2) {
    margin-top: 20px;
}

#content .list dl:nth-child(even) {
    margin-left: auto;
}

#content .list dl dt {
    width: 60%;
    width: -webkit-calc(100% - 180px);
    width: calc(100% - 180px);
}

#content .list dl dd {
    width: 150px;
}

/*タイトル*/

#content .list dl dt .title {
    display: flex;
    justify-content: space-between;
    margin-bottom: 30px;
}

#content .list dl dt .title .num {
    width: 70px;
}

#content .list dl dt .title h2 {
    width: 80%;
    width: -webkit-calc(100% - 90px);
    width: calc(100% - 90px);
    font-size: 23px;
    line-height: 1.4;
    font-weight: 900;
}

#content .list dl dt p {
    padding-left: 5px;
}


/******************************************************************************
*
* [共通]自宅から
*
******************************************************************************/

#home .lead {
    width: 60%;
    margin: 0 auto 60px;
}

#home .box {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

#home .box p {
    width: 52%;
    font-size: 17px;
    font-weight: bold;
}

#home .box .img {
    width: 47%;
}


/******************************************************************************
*
* [共通]流れ
*
******************************************************************************/

#flow {
    background-image: url(../images/other/flow_bg.jpg);
    background-size: cover;
    background-position: center;
}

#flow .lead {
    width: 50%;
    margin: 0 auto 60px;
}

#flow .img {
    filter: drop-shadow(5px 5px 10px rgba(0, 0, 0, 0.1));
    transform: translateZ(0);
}


/******************************************************************************
*
* [共通]FAQ
*
******************************************************************************/

#faq {
    background: #ad6375;
}

#faq .lead {
    width: 250px;
    margin: 0 auto 50px;
}

/*---------------------
* FAQリスト
---------------------*/

/*リストコンテナ*/

.faq_list {
    width: 80%;
    margin: auto;
}

.faq_list ul li {
    padding: 30px;
    background: #fff;
    margin-bottom: 15px;
    border-radius: 15px;
}

.faq_list ul li:last-child {
    margin-bottom: 0;
}

/*リスト内部*/

.faq_list dl dt,
.faq_list dl dd {
    display: flex;
    justify-content: space-between;
}

.faq_list dl dt {
    margin-bottom: 15px;
}

.faq_list dl dt .txt {
    font-size: 20px;
    font-weight: bold;
}

.faq_list dl i {
    width: 30px;
    height: 30px;
    background-size: cover;
}

.faq_list dl i.q {
    background-image: url(../images/faq/q.png);
}

.faq_list dl i.a {
    background-image: url(../images/faq/a.png);
}

.faq_list dl .txt {
    width: 92%;
    width: -webkit-calc(100% - 44px);
    width: calc(100% - 44px);
    font-size: 16px;
    line-height: 1.5;
}

.faq_list dl .txt small {
    display: block;
}


/******************************************************************************
*
* [共通]ブラウザ別対応
*
******************************************************************************/

/*Firefox*/

@-moz-document url-prefix() {}

/*Safari*/

@media screen and (-webkit-min-device-pixel-ratio:0) {

    ::i-block-chrome,
    .selector {}
}

/*IE10*/

@media all and (-ms-high-contrast:none) {}

/*IE11*/

@media all and (-ms-high-contrast:none) {

    *::-ms-backdrop,
    .selector {}
}

/*Edge*/

@supports (-ms-ime-align:auto) {}


/******************************************************************************
*
* [共通]レスポンシブ対応
*
******************************************************************************/

/*1920px以下*/

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

    /*---------------------
    * [共通]ヘッダー(通常LPの場合)
    ---------------------*/

}

/*1400px以下*/

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

/*960px以下*/

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

    /*---------------------
    * [共通]ヘッダー
    ---------------------*/

    header.hero_area .topbar .tb {
        width: 90%;
    }

}

/*644px以下*/

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

    /*---------------------
    * [共通]ヘッダー
    ---------------------*/

    header.hero_area .topbar .tb {
        width: 80%;
    }

    header.hero_area .fv {
        padding: 30px 0;
    }

    header.hero_area .fv .main {
        width: 100%;
    }

    header.hero_area .fv .mov_box {
        width: 100%;
        border-width: 4px;
        margin-top: 20px;
    }

    header.hero_area .fv .mov_box::before {
        border-width: 0 10px 15px 10px;
        top: -15px;
    }

    header.hero_area .fv aside {
        text-align: left;
        font-size: 10px;
        text-indent: -1em;
        padding-left: 1em;
    }

    /*動画*/

    .pulse_btn,
    #movie_container #movie_start_btn {
        width: 60px;
        height: 60px;
    }

    /*---------------------
    * [共通]ステップ
    ---------------------*/

    #step {
        padding-bottom: 60px;
    }

    #step .lead {
        width: 92%;
        margin: 0 auto 40px;
    }

    /*リスト*/

    #step .list dl {
        display: block;
        padding: 15px;
    }

    #step .list dl:nth-child(n+2) {
        margin-top: 30px;
    }

    #step .list dl dt {
        width: 100%;
    }

    #step .list dl dd {
        width: 94%;
        margin: auto;
        margin-top: 15px;
    }

    #step .list dl dd a {
        width: 75%;
        margin-top: 10px;
    }

    /*---------------------
    * [共通]CTA/特典
    ---------------------*/

    article.cta {
        background-image: url(../images/fv/bg3.jpg);
        padding-top: 40px;
    }

    article.cta .arrow {
        width: 130px;
        top: -25px;
    }

    /*リード*/

    article.cta .lead {
        width: 100%;
        margin: 0 auto 20px;
    }

    /*テキスト*/

    article.cta .txt1 {
        width: 90%;
        margin: 20px auto 15px;
    }

    /*ボタン*/

    article.cta .btn1 {
        width: 85%;
        margin: auto;
    }

    article.cta aside {
        font-size: 10px;
        margin-top: 5px;
    }

    article.cta .btn2 {
        width: 60%;
        margin: 25px auto 0;
    }

    /*CTA直前*/

    #before {
        padding: 30px 0 50px;
    }

    #before .txt2 {
        width: 90%;
    }

    /*受け取り方*/

    article.cta .cta_step {
        padding-top: 30px;
    }

    article.cta .cta_step .box {
        width: 100%;
        border-width: 2px;
    }

    article.cta .cta_step .box::before {
        border-width: 0 10px 15px 10px;
        top: -15px;
    }

    article.cta .cta_step .box h2 {
        font-size: 24px;
        padding: 20px 5px;
    }

    article.cta .cta_step .box .inner {
        padding: 20px 15px;
    }

    article.cta .cta_step .box .inner section:last-child {
        padding-top: 20px;
        margin-top: 20px;
    }

    article.cta .cta_step .box .inner h3 {
        font-size: 15px;
    }

    article.cta .cta_step .box .inner h3 span {
        padding: 5px 16px;
        margin-bottom: 20px;
    }

    article.cta .cta_step .box .inner aside {
        text-align: left;
        font-size: 10px;
    }

    /*---------------------
    * [共通]プロフ
    ---------------------*/

    /*1*/

    #prof1 .ava {
        width: 100%;
    }

    #prof1 .txt {
        width: 100%;
        padding: 20px;
        margin-top: -32px;
    }

    #prof1 .txt p {
        font-size: 14px;
    }

    #prof1 .txt .name {
        width: 100px;
        margin-top: 20px;
    }

    /*2*/

    #prof2 {
        background: none;
        padding: 0;
    }

    #prof2 .prof {
        width: 100%;
        margin: 0 calc(50% - 50vw);
        width: 100vw;
    }

    /*---------------------
    * [共通]声(1)
    ---------------------*/

    #voice1 {
        background-image: url(../images/voice/bg1_sp.jpg);
    }

    #voice1 .lead {
        width: 90%;
        margin: 0 auto 40px;
    }

    /*リスト*/

    #voice1 .list dl:nth-child(n+2) {
        margin-top: 30px;
    }

    #voice1 .list dl dt {
        width: 80px;
    }

    #voice1 .list dl dd {
        width: -webkit-calc(100% - 80px);
        width: calc(100% - 80px);
        padding: 20px 15px 20px;
        border-radius: 6px;
    }

    #voice1 .list dl:nth-child(odd) dt::before {
        border-width: 6px 7px 6px 0;
        top: 15px;
    }

    #voice1 .list dl:nth-child(even) dt::before {
        border-width: 6px 0 6px 7px;
        top: 15px;
    }

    #voice1 .list dl:nth-child(odd) dt img {
        border-top-left-radius: 6px;
        border-bottom-left-radius: 6px;
    }

    #voice1 .list dl:nth-child(even) dt img {
        border-top-right-radius: 6px;
        border-bottom-right-radius: 6px;
    }

    #voice1 .list dl dd .info span {
        font-size: 11px;
        padding: 2px 5px;
    }

    #voice1 .list dl dd h2 {
        font-size: 18px;
        margin: 12px 0 18px;
    }

    #voice1 .list dl dd p {
        font-size: 13px;
    }

    /*---------------------
    * [共通]声(2)
    ---------------------*/

    #voice2 {
        padding-top: 50px
    }

    #voice2 .lead {
        width: 90%;
        margin: 0 auto 30px;
    }

    /*リスト*/

    #voice2 .list {
        margin: 0 calc(50% - 50vw);
        width: 100vw;
    }

    #voice2 .list ul li.box {
        padding: 0 8px;
    }

    #voice2 .list dl dd {
        font-size: 13px;
    }

    .slick-dots {
        bottom: -30px;
    }

    /*---------------------
    * [共通]注意
    ---------------------*/

    #attention .a {
        width: 100%;
        margin: 0 auto 20px;
    }

    #attention .btn {
        width: 80%;
    }

    /*---------------------
    * [共通]誤解
    ---------------------*/

    #mistake {
        background-size: 30px;
    }

    #mistake .lead {
        width: 85%;
        margin: 10px auto 40px;
    }

    #mistake p.mp {
        width: 100%;
    }

    #mistake p.mp.mp2 {
        margin-top: 40px;
    }

    /*テキスト*/

    #mistake .txt_sec {
        margin-top: 80px;
    }

    #mistake .txt_sec section:nth-child(n+2) {
        margin-top: 40px;
    }

    #mistake .txt_sec section .icon {
        width: 75px;
        top: -45px;
    }

    #mistake .txt_sec section .head {
        margin: 0 calc(50% - 50vw);
        width: 100vw;
        border-radius: 0;
    }

    #mistake .txt_sec section .txt {
        padding: 30px 20px;
        border-radius: 8px;
        width: 100%;
        margin: -35px auto 0;
    }

    #mistake .txt_sec section .txt .sec_lead {
        margin-bottom: 30px;
    }

    #mistake .txt_sec section .txt .sec_lead .num span {
        font-size: 16px;
        padding: 5px 20px;
    }

    #mistake .txt_sec section .txt .sec_lead h2 {
        font-size: 24px;
    }

    /*---------------------
    * [共通]悩み
    ---------------------*/

    /*2*/

    #t2::before {
        border-width: 15px 10px 0 10px;
    }

    #t2 .lead {
        width: 90%;
    }

    /*3*/

    #t3 {
        padding-bottom: 70px;
    }

    #t3 p.tc {
        font-size: 14px;
    }

    #t3 .person {
        width: 90%;
        margin: 30px auto;
    }

    #t3 .arrow {
        width: 90px;
        bottom: -10px;
    }

    /*4*/

    #t4 {
        background-image: url(../images/trouble/bg3.jpg);
        background-position: left center;
        padding: 40px 0;
    }

    #t4 .lead {
        width: 100%;
        filter: drop-shadow(0 0 6px #fff) drop-shadow(0 0 12px #fff);
        transform: translateZ(0);
    }

    /*---------------------
    * [共通]未来
    ---------------------*/

    #future {
        background-image: url(../images/future/bg.jpg);
    }

    #future .lead {
        width: 85%;
        margin: 0 auto 30px;
    }

    #future .list {
        width: 100%;
    }

    /*---------------------
    * [共通]コンテンツ
    ---------------------*/

    #content .lead {
        width: 90%;
        margin: 0 auto 30px;
    }

    #content .foot {
        width: 90%;
        margin: 30px auto 20px;
    }

    /*リスト*/

    #content .list dl {
        padding: 15px 13px 15px 8px;
        width: 100%;
        border-left-width: 4px;
        display: block;
        position: relative;
    }

    #content .list dl:nth-child(n+2) {
        margin-top: 12px;
    }

    #content .list dl dt {
        width: 100%;
        width: -webkit-calc(100%);
        width: calc(100%);
    }

    #content .list dl dd {
        width: 50px;
        position: absolute;
        top: 11px;
        right: 10px;
    }

    /*タイトル*/

    #content .list dl dt .title {
        width: 70%;
        width: -webkit-calc(100% - 50px);
        width: calc(100% - 50px);
        margin-bottom: 14px;
    }

    #content .list dl dt .title .num {
        width: 38px;
    }

    #content .list dl dt .title h2 {
        width: -webkit-calc(100% - 44px);
        width: calc(100% - 44px);
        font-size: 15px;
    }

    #content .list dl dt p {
        padding-left: 0;
        font-size: 13px;
        line-height: 1.5;
    }

    /*---------------------
    * [共通]自宅から
    ---------------------*/

    #home .lead {
        width: 85%;
        margin: 0 auto 40px;
    }

    #home .box {
        display: block;
        clear: both;
    }

    #home .box p {
        width: 100%;
        font-size: 13px;
    }

    #home .box p img {
        display: block;
        width: 45%;
        float: right;
    }

    /*---------------------
    * [共通]流れ
    ---------------------*/

    #flow .lead {
        width: 80%;
        margin: 0 auto 30px;
    }

    /*---------------------
    * [共通]FAQ
    ---------------------*/

    #faq .lead {
        width: 150px;
        margin: 0 auto 30px;
    }

    /*リスト*/

    .faq_list {
        width: 100%;
    }

    .faq_list ul li {
        padding: 15px;
        margin-bottom: 12px;
        border-radius: 10px;
    }

    .faq_list dl dt {
        margin-bottom: 15px;
    }

    .faq_list dl dt .txt {
        font-size: 15px;
    }

    .faq_list dl i {
        width: 24px;
        height: 24px;
    }

    .faq_list dl .txt {
        width: -webkit-calc(100% - 30px);
        width: calc(100% - 30px);
        font-size: 13px;
    }

}

/*375px以下*/

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

/*360px以下*/

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

/*330px以下*/

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