@charset "UTF-8";

html,
body {
    margin: 0;
    padding: 0;
    font-family: "Hiragino Sans", "ヒラギノ角ゴ ProN", apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Meiryo, sans-serif;
    /*自動文字詰め*/
    font-feature-settings: "palt";
    font-feature-settings: "palt";
    background: #f2f2f2;
}


img {
    max-width: 100%;
    height: auto;
    user-select: none;
    -moz-user-select: none;
    -webkit-user-select: none;
    -ms-user-select: none;
}

a {
    color: #fff;
    text-decoration: none;
}

p {
    font-family: 'Hina Mincho', 'Noto Serif JP', Georgia, 游明朝, "Yu Mincho", YuMincho, "Hiragino Mincho ProN", HGS明朝E, メイリオ, Meiryo, serif;
    /*自動文字詰め*/
    font-feature-settings: "palt";
    font-size: 25px;
    line-height: 1.8;
    color: #333;
    font-weight: 500;
    margin: 30px 0;
}


.wrap {
    overflow: hidden;
}





/* 文字
******************************************************************************/


.mincho {
    font-family: '游明朝', 'Yu Mincho', YuMincho, 'Hiragino Mincho Pro', serif;
}

.wh {
    color: #fff;
}

.bg_nv2 p {
    color: #fff;
}

.td1 {
    color: #C9145A;
}

.td2 {
    color: #08394F;
}

.bg_nv2 .td2 {
    color: #ecc500;
}

.td3 {
    background: #08394F;
    color: #fff;
    padding: 10px 15px;
    margin-right: 10px;
}

.bg_nv2 .td3 {
    background: #fff;
    color: #08394F;
    padding: 10px 15px;
    margin-right: 10px;
}

.td4 {
    background: linear-gradient(transparent 50%, #ecc500 50%);
}

.td5 {
    color: #EBE646;
}

.td6 {
    background: #C9145A;
    color: #fff;
    padding: 10px 15px;
    margin-right: 10px;
    font-size: 200%;
}

.ts1 {
    font-size: 130%;
}

.ts2 {
    font-size: 160%;
}

.quote {
    font-size: 80%;
    text-align: right;
    color: #666;
    margin-top: 0;
    margin-bottom: 80px;
}

@media only screen and (max-width: 1000px) {
    .quote {
        font-size: 60%;

    }
}



/* ヘッダー／プロフィール
******************************************************************************/


.w100 {
    width: 100%;
}


/* CTA
******************************************************************************/

.bg_nv .content h2 {
    text-align: center;
    font-size: 50px;
    font-weight: 800;
    color: #EEE946;
    margin: 10px auto 30px;
}



/* 背景
******************************************************************************/


/*　色　*/


.bg_gr {
    background: #1a1a1a;
}

.bg_nv {
    background: #08394F;
}

.bg_nv2 {
    background: #041B23;
}

.bg_grn {
    background: #387a59;
}

.bg_last {
    background: #f2f2f2;
    position: relative;
    z-index: 999;
}

.bg_about {
    background-image: url(../images/bg_about.png);
    background-position: top;
    background-repeat: no-repeat;
    margin: auto;
}


/*経験*/

.keiken {
    width: 100vw;
    height: 1525px;
    background-image: url(../images/keiken.png);
    background-position: top;
    background-repeat: no-repeat;
    margin: auto;
}

@media only screen and (max-width: 1000px) {
    .keiken {
        width: 100vw;
        height: 1767px;
        background-image: url(../images/keiken_sp.png);
        background-position: top;
        margin: auto;
    }
}

/*お悩み*/

.nayami {
    width: 100vw;
    height: 1379px;
    background-image: url(../images/nayami.png);
    background-position: top;
    background-repeat: no-repeat;
    margin: auto;
}

@media only screen and (max-width: 1000px) {
    .nayami {
        width: 100%;
        height: 2046px;
        background-image: url(../images/nayami_sp.png);
    }
}

/*メリット*/

.merit {
    width: 100vw;
    height: 4463px;
    background-image: url(../images/merit.png);
    background-position: top;
    background-repeat: no-repeat;
    margin: auto;
}

@media only screen and (max-width: 1000px) {
    .merit {
        width: 100%;
        height: 6431px;
        background-image: url(../images/merit_sp.png);
    }
}

/*セミナー*/

.bg_seminar {
    width: 100vw;
    height: auto;
    background-image: url(../images/bg_seminar.png);
    background-position: top;
    background-repeat: no-repeat;
    margin: auto;
}




/* 位置調整
******************************************************************************/

.center {
    text-align: center;
}



/* 画像
******************************************************************************/


.contimg1 {
    width: 100%;
    margin: 20px 0;
}

.contimg2 {
    width: 90%;
    margin: 50px auto;
}

.contimg3 {
    width: 80%;
    margin: 0;
}


.shimg {
    width: 100%;
    margin-top: 80px;
}

.arrow {
    margin-top: -60px;
    text-align: center;
}

.arrow2 {
    margin: 30px auto;
    text-align: center;
    position: relative;
    z-index: 1;
}

.lastcta {
    margin-top: 20px;
    position: relative;
    z-index: 0;
}



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

    .contimg2,
    .contimg3 {
        width: 100%;
    }
}



/* 本文
******************************************************************************/

.content {
    width: 1000px;
    background: none;
    padding: 30px 40px 80px;
    margin: auto;
    box-sizing: border-box;
}

.content2 {
    width: 100%;
    background: none;
    padding: 0 0 80px 0;
    margin: auto;
    box-sizing: border-box;
}

.content3 {
    width: 1000px;
    background: none;
    padding: 30px 40px 0;
    margin: auto;
    box-sizing: border-box;
}

/*　催眠DIVEとは　*/

.bg_nv2 .bg_about .content p {
    text-align: center;
    color: #fff;
    margin-top: 60px;
    margin-bottom: 100px;
}






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

    .content {
        width: 900px;
        margin: 0 auto;
    }

    .meritbox {
        width: 100%;
    }

    .box h3,
    .meritbox h3 {
        font-size: 45px;
    }

    .seminarbox h3 {
        font-size: 42px;
    }

    .bg_seminar .content {
        width: 960px;
        margin: 0 auto;
        padding: 30px 10px 80px;
    }

    .seminarbox:nth-child(even),
    .seminarbox:nth-child(odd) {
        width: 87%;
        padding: 20px 10px 20px 20px;
    }

    .seminarbox p.number {
        font-size: 70px;
        top: -100px;
    }

    .seminarbox p.number span {
        font-size: 100px;
    }

}



/* QA
******************************************************************************/
.container_accordion {
    margin: 40px auto 60px;
    width: 100%;
}

.container_accordion h3 {
    font-size: 22px;
    font-weight: 500;
    display: inline-block;
    padding: 0 0.4em 0.4em;
    margin-bottom: 20px;
}

@media screen and (max-width: 1000px) {
    .container_accordion h3 {
        padding: 0 0 0.4em;
        text-align: left;
        display: block;
    }
}

.accordion .accordion-item {
    border-bottom: 1px solid lightgray;
}

.accordion .accordion-item button[aria-expanded=true] {
    border-bottom: 1px solid #08394F;
}

.accordion button {
    position: relative;
    display: block;
    text-align: left;
    width: 100%;
    padding: 1em 0;
    color: #313131;
    font-size: 22px;
    font-weight: 800;
    border: none;
    background: none;
    outline: none;
}

.accordion button:hover,
.accordion button:focus {
    cursor: pointer;
    color: #08394F;
}

.accordion button:hover::after,
.accordion button:focus::after {
    cursor: pointer;
    color: #08394F;
    border: 1px solid #08394F;
}

.accordion button .accordion-title {
    padding: 1em 1.5em 1em 0;
}

.accordion button .icon {
    display: inline-block;
    position: absolute;
    top: 18px;
    right: 0;
    width: 22px;
    height: 22px;
    border: 1px solid;
    border-radius: 22px;
}

.accordion button .icon::before {
    display: block;
    position: absolute;
    content: "";
    top: 9px;
    left: 5px;
    width: 10px;
    height: 2px;
    background: currentColor;
}

.accordion button .icon::after {
    display: block;
    position: absolute;
    content: "";
    top: 5px;
    left: 9px;
    width: 2px;
    height: 10px;
    background: currentColor;
}

.accordion button[aria-expanded=true] {
    color: #08394F;
}

.accordion button[aria-expanded=true] .icon::after {
    width: 0;
}

.accordion button[aria-expanded=true] + .accordion-content {
    opacity: 1;
    max-height: 21em;
    transition: all 200ms linear;
    will-change: opacity, max-height;
}

.accordion .accordion-content {
    opacity: 0;
    max-height: 0;
    overflow: hidden;
    transition: opacity 200ms linear, max-height 200ms linear;
    will-change: opacity, max-height;
}

.accordion .accordion-content p {
    font-size: 20px;
    font-weight: 300;
    margin: 2em 0;
}

@media screen and (max-width: 1000px) {
    .accordion button {
        font-size: 35px
    }

    .accordion .accordion-content p {
        font-size: 35px;
    }

    .container_accordion h3 {
        font-size: 35px;
    }

    .accordion button .icon {
        display: inline-block;
        position: absolute;
        top: 40px;
        right: 0;
        width: 30px;
        height: 30px;
        border: 2px solid;
        border-radius: 30px;
    }

    .accordion button .icon::before {
        display: block;
        position: absolute;
        content: "";
        top: 13px;
        left: 8px;
        width: 14px;
        height: 2px;
        background: currentColor;
    }

    .accordion button .icon::after {
        display: block;
        position: absolute;
        content: "";
        top: 8px;
        left: 14px;
        width: 2px;
        height: 13px;
        background: currentColor;
    }

}

/* 声
******************************************************************************/

.swiper-slide {
    background: #fff;
    padding: 10px;
    margin: 10px;
    border-radius: 30px;
    width: 30%;
}

.swiper-slide img {
    width: 100%;
}



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






/* PC/SP表示切り替え
******************************************************************************/

.pc {
    display: block !important;
}

.sp {
    display: none !important;
}


@media only screen and (max-width: 1000px) {
    .pc {
        display: none !important;
    }

    .sp {
        display: block !important;
    }
}


/* フッター
******************************************************************************/

footer {
    background-color: #666;
    padding: 15px 0;
    text-align: center;
    padding-bottom: 60px;
    position: relative;
    z-index: 999;
}

footer p {
    color: #fff;
    font-size: 16px;
    margin: 0 auto;
    line-height: 2;
}

@media only screen and (max-width: 1000px) {
    footer p {
        font-size: 18px;
    }
}

/* 特商法
******************************************************************************/

.tokusho {
    width: 1000px;
    margin: 0 auto;
    padding: 30px;
    box-sizing: border-box;

}

.tokusho table {
    width: 95%;
    margin: 0 auto;
    margin-bottom: 100px;
    font-size: 20px;
}

.tokusho p {
    font-size: 18px;
    font-family: "Hiragino Sans", "ヒラギノ角ゴ ProN", apple-system, BlinkMacSystemFont, "Helvetica Neue", "Segoe UI", Meiryo, sans-serif;
}

.tokusho table td {
    padding: 20px;

}

.tokusho table th {
    width: 30%;
    background: #999;
    color: #fff;
}

.tokusho a {
    color: #999;
}

.tokusho h3 {
    text-align: center;
    font-size: 45px;
    border-bottom: 8px solid #333;
}

.tokusho h4 {
    text-align: center;
    font-size: 25px;
}

/* 追従ボタン
******************************************************************************/

.footer-fix {
    position: fixed;
    bottom: 0;
    right: 0;
    height: 140px;
    width: 500px;
    background: none;
    padding: 0;
    box-sizing: border-box;
    vertical-align: middle;
    z-index: 888;
}


.footer_btn {
    position: relative;
    margin: 10px;
    width: 90%;
}

.fix {
    margin: 0 auto;
    text-align: right;
    position: relative;
}

.fix img {
    width: 500px;
}


@media only screen and (max-width: 1000px) {
    .footer-fix {
        width: 100%;
        height: 210px;
    }


    .fix {
        text-align: center;
    }

    .fix img {
        width: 95%;
    }
}



/* レスポンシブ
******************************************************************************/

/*1000px以下*/

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

    p {
        font-size: 35px;
    }

    .bg_about .content p {
        font-size: 45px;
    }

}


/* ボタンアニメーション
******************************************************************************/

.slide-bottom {
    -webkit-animation: slide-bottom 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite both;
    animation: slide-bottom 2s cubic-bezier(0.250, 0.460, 0.450, 0.940) infinite both;
}

/* ----------------------------------------------
 * Generated by Animista on 2024-7-26 14:54:46
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation slide-bottom
 * ----------------------------------------
 */
@-webkit-keyframes slide-bottom {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    100% {
        -webkit-transform: translateY(100px);
        transform: translateY(100px);
    }
}

@keyframes slide-bottom {
    0% {
        -webkit-transform: translateY(0);
        transform: translateY(0);
    }

    100% {
        -webkit-transform: translateY(100px);
        transform: translateY(100px);
    }
}

.heartbeat {
    -webkit-animation: heartbeat 1.5s ease-in-out infinite both;
    animation: heartbeat 1.5s ease-in-out infinite both;
}

/* ----------------------------------------------
 * Generated by Animista on 2022-11-8 13:41:17
 * Licensed under FreeBSD License.
 * See http://animista.net/license for more info. 
 * w: http://animista.net, t: @cssanimista
 * ---------------------------------------------- */

/**
 * ----------------------------------------
 * animation heartbeat
 * ----------------------------------------
 */
@-webkit-keyframes heartbeat {
    from {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    10% {
        -webkit-transform: scale(0.91);
        transform: scale(0.91);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    17% {
        -webkit-transform: scale(0.98);
        transform: scale(0.98);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    33% {
        -webkit-transform: scale(0.87);
        transform: scale(0.87);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    45% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
}

@keyframes heartbeat {
    from {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-transform-origin: center center;
        transform-origin: center center;
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    10% {
        -webkit-transform: scale(0.91);
        transform: scale(0.91);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    17% {
        -webkit-transform: scale(0.98);
        transform: scale(0.98);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }

    33% {
        -webkit-transform: scale(0.87);
        transform: scale(0.87);
        -webkit-animation-timing-function: ease-in;
        animation-timing-function: ease-in;
    }

    45% {
        -webkit-transform: scale(1);
        transform: scale(1);
        -webkit-animation-timing-function: ease-out;
        animation-timing-function: ease-out;
    }
}
