/* =================================================================
LP共通
=================================================================*/
#contents {width: 100%; padding-top: 0; padding-bottom: 0; overflow: inherit;}
#sub-column {display: none;}
#main-column {float: none; width: 100%; margin-bottom: 0;}
.w100 .freeArea2 {padding: 0; margin: auto;}
#gnav {display: none;}
#main-column h2 {border-top: 0; letter-spacing: inherit; padding: 0}
#main-column img {display: none;}

header,
footer,
h1,
h2,
#bread-crumb,
.state_r {display: none;}
#lp header,
#lp footer {display: block;}
#lp h1 {display: block;}
#lp h2 {display: block;}
#lp img {display: block;}

#footer {display: none;}

#lp header img,
#lp footer img {display: block;}

#lp .cherry {font-family: "Cherry Bomb One", system-ui;}

#lp .title h2 {font-family: "Cherry Bomb One", system-ui; font-size: 10rem; text-align: center; font-weight: 400; line-height: 1;}
#lp .title p {font-size: 3.2rem; font-weight: 700; line-height: 115.625%; letter-spacing: .16rem; text-align: center; margin-top: 1.9rem;}


.js-rainbow-text span {display: inline-block;}
.js-rainbow-text span:nth-child(3n + 1) {color: #EE86AF;}
.js-rainbow-text span:nth-child(3n + 2) {color: #379B6A;}
.js-rainbow-text span:nth-child(3n) {color: #1697A4;}

.color1 {color: #EE86AF;}
.color2 {color: #379B6A;}
.color3 {color: #1697A4;}


@media screen and (max-width: 999px) {
    #lp .title h2 {font-size: 6rem; line-height: 166.667%;}
    #lp .title p {font-size: 2.2rem; line-height: 168.182%; letter-spacing: .11rem; margin-top: -.8rem;}
    #lp .title .small {font-size: 1.8rem; margin-top: -1.6rem; letter-spacing: .09rem; line-height: 177.7787%;}
}

/* =================================================================
FV
=================================================================*/
.fv {margin-bottom: -23.9rem;}
.fv img {display: block; width: 100%;}

@media screen and (max-width: 999px) {
    .fv {margin-bottom: -39.42rem;}
}

/* =================================================================
FV
=================================================================*/
.movie {position: relative; padding-top: 14.5rem; height: 107.9rem; margin-bottom: -15.7rem;}
.movie::before {content: ""; width: 100%; height: 27.6rem; display: block; background-image: url(../img/lp/movie_bg_cloud.png); background-size: 100%; background-repeat: no-repeat; position: absolute; top: 0; left: 0; right: 0; margin: auto;}
.movie::after {content: "SPECIAL MOVIE"; font-family: "Cherry Bomb One", system-ui; line-height: 43.75%; font-size: 16rem; font-weight: 400; color: rgba(238, 134, 175, 0.20); text-align: center; position: absolute; bottom: 24.1rem; left: 0; right: 0; margin: auto; z-index: -1;}
.movie .bg-layer {position: relative;}
.movie .bg-layer::after {content: ""; width: 100%; height: 109.7rem; display: block; background-image: url(../img/lp/movie_cover.png); background-size: 100%; background-repeat: no-repeat; position: absolute; top: -15.4rem; left: 0; right: 0; margin: auto;}

.movie .inner {background-image: url(../img/lp/movie_inner_bg.png); background-size: cover; width: 100rem; height: 62.1rem; padding-top: 11.7rem; position: relative; z-index: 2;}
.movie .inner video {width: 64rem; height: 36rem; border-radius: 8rem; margin: auto; display: block;}

#lp .movie .inner h2 {font-size: 28px; font-weight: 500; line-height: 132.143%; letter-spacing: .14rem; text-align: center; margin-bottom: 3.1rem;}
.movie .kuma {width: 20.4rem; position: absolute; left: 2.3rem; bottom: -1.6rem;}

.video-box {position: relative; width: 64rem; height: 36rem; margin: auto;}
.video-box video {position: absolute; top: 0; left: 0; width: 100%; height: 100%; object-fit: cover; display: block; background: #f5f5f5;}

.play-button {position: absolute; top: 0; left: 0; border: 0; background: none; width: 64rem; height: 36rem; border-radius: 8rem; padding: 0; cursor: pointer;}
.play-button:hover {opacity: 1;}
.play-button img {width: 100%; height: auto; display: block;}
.play-button.is-hidden {opacity: 0; visibility: hidden; pointer-events: none;}

@media screen and (max-width: 999px) {
    .movie {padding-top: 9rem; height: 76.825rem; margin-bottom: -9.325rem;}
    .movie::before {height: 15rem; background-image: url(../img/lp/movie_bg_cloud_sp.png);}
    .movie::after {line-height: 93.333%; font-size: 6rem; bottom: 15.2rem;}

    .movie .bg-layer::after {height: 76.825rem; background-image: url(../img/lp/movie_cover_sp.png); top: -9.2rem;}
    .movie .inner {background-image: url(../img/lp/movie_inner_bg_sp.png); width: 33.6rem; height: 37.4rem; padding-top: 9.7rem;}
    .movie .inner video {width: 29.5rem; height: 18.9rem;}

    #lp .movie .inner h2 {font-size: 2rem; margin-bottom: 3rem;}
    .movie .kuma {width: 9.1rem; height: 10rem; left: -2.5rem; bottom: -7rem;}

    .video-box {width: 29.5rem; height: 18.9rem;}
    .play-button {width: 29.5rem; height: 18.9rem;}
}

/* =================================================================
関西コレクション
=================================================================*/
.kankore {background-image: url(../img/lp/kankore_bg.png); background-size: cover; height: 94.8rem; color: #fff; margin-bottom: -40.8rem;}

.kankore .inner {display: flex; justify-content: flex-end;}
.kankore .text {padding-top: 20.8rem;}
.kankore img {width: 40.1rem;}
#lp .kankore h2 {font-size: 28px; font-weight: 700; line-height: 142.857%; letter-spacing: .14rem; margin-top: 5.6rem;}
.kankore p {font-size: 1.6rem; font-weight: 500; line-height: 187.5%; letter-spacing: .08rem; margin-top: 2.2rem;}

@media screen and (max-width: 999px) {
    .kankore {background-image: url(../img/lp/kankore_bg_sp.png); height: 108.7rem; padding-top: 33.6rem; margin-bottom: -58.2rem;}

    .kankore .inner {align-items: center; justify-content: center;}
    .kankore .text {padding-top: 0; display: flex; flex-direction: column; align-items: center; gap: 1.5rem; text-align: center;}
    .kankore img {width: 27.795rem;}
    #lp .kankore h2 {margin: 0;}
    .kankore p {margin: 0;}
}

/* =================================================================
特徴
=================================================================*/
.features {background-image: url(../img/lp/features_bg.png); background-size: cover; height: 160.6rem; padding-top: 47.9rem; position: relative; margin-bottom: -11.7rem;}
.features::after {content: ""; width: 100%; height: 34.697rem; display: block; background-image: url(../img/lp/features_bg_bottom.png); background-size: 100%; background-repeat: no-repeat; position: absolute; bottom: 18.3rem; left: 0; right: 0; margin: auto;}

.features .list {display: flex; justify-content: center; gap: 1.6rem; margin-top: 4.7rem;}
.features .list .box {background: #fff; border-radius: 14.95rem; width: calc((100% - 1.6rem * 3) / 4); height: 47.5rem; display: flex; align-items: center; flex-direction: column; padding: 8.8rem 3.4rem 0;}
.features .list .title-wrap img {display: block; margin: auto;}
.features .list h3 {font-size: 2.2rem; font-weight: 800; line-height: 145.455%; letter-spacing: .11rem; color: #EE86AF; text-align: center;}
.features .list p {text-align: center; font-size: 1.6rem; font-weight: 500; line-height: 187.5%; letter-spacing: .08rem; margin-top: 4.1rem;}

.features .list .box:nth-child(1) {padding-top: 7.8rem;}
.features .list .box:nth-child(1) h3 {margin-top: 1.8rem;}

.features .list .box:nth-child(2) h3 {margin-top: 1.1rem;}
.features .list .box:nth-child(3) h3 {margin-top: 1rem;}

.features .list .box:nth-child(4) {padding-top: 7.3rem;}
.features .list .box:nth-child(4) h3 {margin-top: 1.4rem;}
.features .list .box:nth-child(4) p {margin-top: 2rem;}

@media screen and (max-width: 999px) {
    .features {background-image: url(../img/lp/features_bg_sp.png); padding-top: 32.7rem; height: 179.4rem; margin-bottom: -8.4rem;}
    .features::after {height: 14rem; background-image: url(../img/lp/features_bg_bottom_sp.png); bottom: 15.4rem;}

    .features .list {padding: 0 2rem; gap: 1.5rem; margin-top: 4rem;}
    .features .list .box {width: 100%; height: auto; border-radius: 12rem; padding: 4.6rem 3.2rem 4.625rem;}
    .features .list .title-wrap {display: flex; align-items: center; gap: 1rem;}
    .features .list h3 {margin-top: 0; text-align: left; font-size: 1.8rem; line-height: 144.44%; letter-spacing: .09rem;}
    .features .list p {margin-top: 1rem; text-align: left; font-size: 1.4rem; line-height: 171.429%; letter-spacing: .07rem;}

    .features .list .box:nth-child(1) {padding-top: 4.7rem;}
    .features .list .box:nth-child(1) h3 {margin-top: 0;}

    .features .list .box:nth-child(2) {padding: 4.6rem 5rem 5rem;}
    .features .list .box:nth-child(2) .title-wrap {gap: .5rem;}
    .features .list .box:nth-child(2) h3 {margin-top: 0;}
    .features .list .box:nth-child(2) p {margin-top: .8rem;}

    .features .list .box:nth-child(3) {padding: 4.6rem 5.8rem 4.8rem;}
    .features .list .box:nth-child(3) h3 {margin-top: 0;}

    .features .list .box:nth-child(4) {padding: 5.2rem 5.8rem 5.2rem;}
    .features .list .box:nth-child(4) p {margin-top: 1rem;}
    .features .list .box:nth-child(4) h3 {margin-top: 0;}
}

/* =================================================================
LINEUP
=================================================================*/
.lineup {position: relative; padding-top: 18.6rem; margin-bottom: 11.2rem;}
.lineup::before {content: ""; width: 100%; height: 27.6rem; display: block; background-image: url(../img/lp/movie_bg_cloud.png); background-size: 100%; background-repeat: no-repeat; position: absolute; top: 0; left: 0; right: 0; margin: auto;}

.lineup .title {position: relative; z-index: 1;}
.lineup .list {margin-top: 6rem; gap: 2.4rem; justify-content: center;}

.lineup .box {width: 38.4rem;}
.lineup .box .text {background-image: url(../img/lp/lineup_fukidashi1.png); background-size: cover; background-repeat: no-repeat; height: 22.2rem; padding: 5.1rem 2.8rem 0;}
.lineup .box .txt-icon {font-family: "Cherry Bomb One", system-ui; font-size: 2rem; letter-spacing: -.1rem; line-height: 185%;}
.lineup .box .main-text {font-size: 1.8rem; letter-spacing: .09rem; font-weight: 500; line-height: 155.556%;}
.lineup .box ul {margin-top: 1.3rem; display: flex; align-items: center; gap: 2.143rem;}
.lineup .box ul img {width: 2.7333rem; margin-right: .719rem;;}
.lineup .box ul li {font-size: 1.6667rem; font-weight: 500; letter-spacing: .0833rem; display: flex; align-items: center;}

.lineup .box .button {border: .2rem solid #EE86AF; background: #fff; width: 31rem; height: 6rem; border-radius: 3rem; display: flex; align-items: center; justify-content: center; gap: 1rem; font-weight: 500; margin: 2rem auto 0;}
.lineup .box .button::after {content: ""; width: 2.7rem; height: 2.7rem; display: block; background-size: cover; background-image: url(../img/lp/lineup_link1.png);}

.lineup .box:nth-child(2) .text {background-image: url(../img/lp/lineup_fukidashi2.png);}
.lineup .box:nth-child(2) .button {border-color: #379B6A;}
.lineup .box:nth-child(2) .button:after {background-image: url(../img/lp/lineup_link2.png);}
.lineup .box:nth-child(3) .text {background-image: url(../img/lp/lineup_fukidashi3.png);}
.lineup .box:nth-child(3) .button {border-color: #1697A4;}
.lineup .box:nth-child(3) .button:after {background-image: url(../img/lp/lineup_link3.png);}

.lineup-contents {padding-top: 12rem; margin-bottom: -58rem;}
.lineup-contents h3 img {height: 10.42rem; margin: auto; display: block;}
.lineup-contents .inner {display: flex; justify-content: flex-end; padding-right: 7.3rem;}
.lineup-contents .text {display: flex; flex-direction: column; align-items: center; padding-top: 2.9rem; position: relative;}
.lineup-contents .text h4 {font-size: 4rem; font-weight: 700; line-height: 150%; letter-spacing: .2rem; text-align: center;}
.lineup-contents .text h4 strong {font-size: 4.8rem; font-weight: 700; line-height: 136%; letter-spacing: .24px;}
.lineup-contents .fukidashi {width: 39.25rem; display: block;}
.lineup-contents .hoshitsu {font-size: 1.4rem; font-weight: 500; line-height: 171.429%; position: absolute; right: 0rem; bottom: 25rem;}
.lineup-contents .bottom-explanation {display: block; width: 36.1rem; margin-top: 2.4rem;}
.lineup-contents .button {display: block; width: 33.4rem; margin-top: 4rem;}

@media screen and (max-width: 999px) {
    .lineup {padding-top: 10rem;}
    .lineup::before {height: 15rem; background-image: url(../img/lp/movie_bg_cloud_sp.png);}

    .lineup .list {margin-top: 3.5rem; padding: 0 2rem;}
    .lineup .box {width: 100%;}
    .lineup .box .text {background-image: url(../img/lp/lineup_fukidashi1_sp.png); height: 18.9rem; width: 100%; margin-top: .5rem; padding: 4.7rem 2rem 0;}
    .lineup .box .icon {font-size: 1.6rem; letter-spacing: -.08rem; line-height: 1;}
    .lineup .box .txt-icon {line-height: 1;}
    .lineup .box .main-text {font-size: 2rem; letter-spacing: .1rem; line-height: 1.5; margin-top: .3rem;}
    .lineup .box ul {margin-top: 1.2rem; gap: 2rem;}
    .lineup .box ul img {width: 2.515rem; margin-right: .442rem;}
    .lineup .box ul li {font-size: 1.533rem; letter-spacing: .0767rem;}

    .lineup .box .button {margin-top: 1.5rem; font-size: 1.6rem;}

    .lineup-contents {padding-top: 6.7rem; margin-bottom: -53.1rem;}
    .lineup-contents .inner {justify-content: center; padding-right: 0rem;}
    .lineup-contents h3 {margin-bottom: 27.7rem;}
    .lineup-contents h3 img {height: 7rem;}

    .lineup-contents .text {padding: 0 2rem; position: relative;}
    .lineup-contents .fukidashi {width: 28.35rem;}
    .lineup-contents .hoshitsu {right: 2rem; bottom: 22.5rem; font-size: 1.3rem;}
    .lineup-contents .text {width: 100%;}
    .lineup-contents .text h4 {font-size: 2.6rem; letter-spacing: .13rem; line-height: 157.692%; margin-top: -3rem;}
    .lineup-contents .text h4 strong {font-size: 2.6rem; letter-spacing: .13rem; line-height: 157.692%;}
    .lineup-contents .bottom-explanation {width: 29.6rem; margin-top: 1.4rem;}

    .lineup-contents .button {width: 25.978rem; margin-top: 2rem;}
}

/* =================================================================
黒くま
=================================================================*/
.kurokuma {background-image: url(../img/lp/kurokuma_bg.png); background-size: cover; height: 173.6rem;}

@media screen and (max-width: 999px) {
    .kurokuma {background-image: url(../img/lp/kurokuma_bg_sp.png); height: 151.1rem;}
}

/* =================================================================
茶くま
=================================================================*/
.chakuma {background-image: url(../img/lp/chakuma_bg.png); background-size: cover; height: 173.6rem;}
.chakuma .inner {justify-content: flex-start; padding-right: 0; padding-left: 5.6rem;}
.chakuma .hosoku {font-size: 1.6rem; text-align: left; margin-top: 4.6rem; width: 100%;}
.chakuma .hoshitsu {bottom: 32.4rem; right: 2rem;}

@media screen and (max-width: 999px) {
    .chakuma {background-image: url(../img/lp/chakuma_bg_sp.png); height: 118.4rem; margin-bottom: -15.9rem;}
    .chakuma .inner {padding-left: 0; justify-content: center;}
    .chakuma .hosoku {margin-top: 2.8rem; font-size: 1.4rem; text-align: left; width: 100%; padding: 0 1.1rem;}
    .chakuma .hoshitsu {bottom: 27.5rem;}
}

/* =================================================================
青くま
=================================================================*/
.aokuma {background-image: url(../img/lp/aokuma_bg.png); background-size: cover; height: 125.9rem; margin-bottom: -14.7rem;}
.aokuma .bottom-explanation {width: 36.4rem;}
.aokuma .hoshitsu {right: -2rem;}

@media screen and (max-width: 999px) {
    .aokuma {background-image: url(../img/lp/aokuma_bg_sp.png); height: 109.3rem; margin-bottom: -7.7rem;}
    .aokuma .bottom-explanation {width: 31.8rem;}
    .aokuma .hoshitsu {right: 2rem; bottom: 22.5rem;}
}


/* =================================================================
TEST
=================================================================*/
.test {position: relative; padding-top: 18.6rem; padding-bottom: 10.6rem;}
.test::before {content: ""; width: 100%; height: 27.6rem; display: block; background-image: url(../img/lp/movie_bg_cloud.png); background-size: 100%; background-repeat: no-repeat; position: absolute; top: 0; left: 0; right: 0; margin: auto;}
.test::after {content: ""; width: 128.98rem; height: 48.367rem; display: block; background-image: url(../img/lp/test_bg.png); background-size: 100%; background-repeat: no-repeat; position: absolute; bottom: 3.454rem; left: 0; right: 0; margin: auto;}

.test .title {position: relative; z-index: 1;}
.test .fukidashi {background-image: url(../img/lp/test_fukidashi.png); background-size: cover; width: 40rem; height: 7.575rem; margin: 5rem auto 0; font-size: 2.635rem; color: #fff; font-weight: 700; text-align: center; padding-top: .923rem ;}
.test .list {justify-content: center; gap: 1.5rem; margin-top: 3.25rem;}
.test .list img {display: block; width: 39rem;}

@media screen and (max-width: 999px) {
.test {padding-top: 10rem;}
.test::before {height: 15rem; background-image: url(../img/lp/movie_bg_cloud_sp.png);}
.test::after {width: 26.019rem; height: 106.102rem; background-image: url(../img/lp/test_bg_sp.png); top: 25.81rem; bottom: auto; left: auto; right: .8rem; margin: auto;}
.test .fukidashi {background-image: url(../img/lp/test_fukidashi_sp.png); width: 25.2rem; height: 7.1rem; font-size: 2rem; line-height: 181.138%; padding-top: 1rem; margin-top: 7.9rem;}
.test .list {padding: 0 2rem; margin-top: .224rem; gap: 1rem;}
}


/* =================================================================
HOW TO USE
=================================================================*/
.howtouse {background-image: url(../img/lp/howtouse_bg.png); background-size: 100%; padding-top: 18.6rem; position: relative; height: 175.5rem; margin-bottom: -11.9rem;}
.howtouse::after {content: "LET’S TRY!!"; font-family: "Cherry Bomb One", system-ui; line-height: 44.248%; font-size: 22.6rem; font-weight: 400; color: rgba(255, 255, 255, 0.70); text-align: center; position: absolute; bottom: 22.9rem; left: 0; right: 0; margin: auto; z-index: 0;}

.howtouse .title {margin-bottom: 3.3rem;}
.howtouse .title + p {text-align: center; font-size: 2.7rem; font-weight: 500; line-height: 166.667%; letter-spacing: .135rem;}
.howtouse .list {align-items: flex-end; justify-content: center; margin-top: 3.747rem;}
.howtouse .list .arrow {margin-right: 2.077rem; margin-bottom: 17.22rem; width: 2.717rem; height: 5.134rem;}
.howtouse .box {width: 31.8rem; text-align: center; margin-right: 2.2rem;}
.howtouse .box:last-child {margin-right: 0;}
.howtouse .box p {margin-top: 2.5rem; font-size: 1.8rem;letter-spacing: .09rem;}

.howtouse .howtouse-movie {margin-top: 12rem; position: relative; z-index: 1;}
.howtouse .howtouse-movie h3 {text-align: center; font-size: 3.2rem; font-weight: 500; letter-spacing: .16rem;}
.howtouse video {width: 64rem; height: 36rem; border-radius: 8rem; margin: auto 0; display: block;}
.howtouse .video-box {margin-top: 4rem;}

@media screen and (max-width: 999px) {
    .howtouse {background-image: url(../img/lp/howtouse_bg_sp.png); height: 153.5rem; padding-top: 10rem; margin-bottom: -6.8rem;}
    .howtouse::after {font-size: 6.1rem; bottom: 7.4rem; line-height: 163.934%;}
    .howtouse .title {margin-bottom: 5rem;}
    #lp .howtouse .title h2 {line-height: 101.667%; margin-bottom: 15px;}
    .howtouse .title p {margin-top: 2rem; line-height: 1;}
    .howtouse .title + p {padding: 0 2rem; text-align: left; font-size: 1.6rem; line-height: 162.5%; letter-spacing: .08rem;}
    .howtouse .list {padding: 0 2rem; position: relative; gap: 0; margin-top: 7.9rem;}
    .howtouse .list .arrow {margin: 0; position: absolute; width: 3.675rem; height: 3.009rem;}
    .howtouse .list .arrow1 {top: 20rem; left: 16.6rem;}
    .howtouse .list .arrow2 {top: 40.2rem; right: 16.6rem;}
    .howtouse .box {display: flex; align-items: center; justify-content: space-between; width: 100%; margin: 0 0 0 0;}
    .howtouse .box img {width: 20rem;}
    .howtouse .box p {margin-top: 0; text-align: left; line-height: 133.333%; font-weight: 500;}

    .howtouse .box.reverse {flex-direction: row-reverse;}

    .howtouse .howtouse-movie {margin-top: 5.557rem;}
    .howtouse .howtouse-movie h3 {font-size: 2rem;}
    .howtouse .video-box {margin-top: 2rem;}
    .howtouse video {width: 29.5rem; height: 18.9rem;}
}

/* =================================================================
MEDIA
=================================================================*/
.media {position: relative; padding-top: 18.5rem; padding-bottom: 8rem;}
.media::before {content: ""; width: 100%; height: 27.6rem; display: block; background-image: url(../img/lp/movie_bg_cloud.png); background-size: 100%; background-repeat: no-repeat; position: absolute; top: 0; left: 0; right: 0; margin: auto;}

.media .inner {display: flex; align-items: center; justify-content: center; gap: 5.2rem;}
.media .text {position: relative;}
.media .text::after {content: ""; width: 8.749rem; height: 7.755rem; display: block; position: absolute; right: -7.979rem; top: -6.972rem; background-image: url(../img/lp/media_bg_icon.png); background-size: cover;}

.media h3 {color: #EE86AF; font-size: 2.4rem; font-weight: 700; line-height: 125%; letter-spacing: .12rem; display: flex; align-items: flex-end;}
.media h3::before {content: url(../img/lp/media_title_left.svg); margin-right: .8rem;}
.media h3::after {content: url(../img/lp/media_title_right.svg); margin-left: -.1rem;}

.media ul {padding-left: 4.4rem; margin-top: 2rem;}
.media ul li {display: flex; align-items: center; gap: 1.5rem;}
.media ul li .date {width: 11.7rem;}

@media screen and (max-width: 999px) {
    .media {padding-top: 10.5rem;}
    .media::before {height: 15rem; background-image: url(../img/lp/movie_bg_cloud_sp.png);}
    .media .inner {flex-direction: column; align-items: center; gap: 3.3rem;}
    .media .text::after {width: 6.453rem; height: 5.72rem; right: -2.45rem; top: -5.8rem;}
    .media h3 {text-align: center; font-size: 2rem; justify-content: center;}
    .media h3::before {content: url(../img/lp/media_title_left_sp.svg);}
    .media h3::after {content: url(../img/lp/media_title_right_sp.svg);}

    .media ul {padding: 0; display: flex; flex-direction: column; gap: 1.7rem; margin-top: 3.1rem;}
    .media ul li {font-size: 1.4rem; gap: 2.9rem; line-height: 1;}
    .media ul li .date {width: 9.1rem;}
}


/* =================================================================
VOICE
=================================================================*/
.voice {background-image: url(../img/lp/voice_bg.png); background-size: 100%; height: 108.3rem; padding-top: 18.6rem; margin-bottom: -14.2rem;}
.voice .list {justify-content: center; gap: 3rem; margin-top: 6rem;}
.voice .box {width: 38rem;}
.voice .box img {width: 16rem; margin: 0 auto -8rem; display: block;}
.voice .box .text {width: 100%; height: 30rem; background: #fff; border-radius: 8rem; padding: 9.2rem 4.3rem 0;}
.voice .box h3 {display: flex; align-items: flex-start; justify-content: center; gap: .9rem;}
.voice .box h3 .name {font-size: 2.2rem; font-weight: 700; line-height: 145.455%; letter-spacing: 0.11rem;}
.voice .box h3 .nayami {font-size: 1.6rem; font-weight: 700; line-height: 1; letter-spacing: .08rem; padding-top: 1.1rem;}
.voice .box p {margin-top: 1.6rem; font-size: 1.6rem; line-height: 187.5%; letter-spacing: .08rem; font-weight: 500;}

@media screen and (max-width: 999px) {
    .voice {background-image: url(../img/lp/voice_bg_sp.png); height: 61.4rem; padding-top: 10rem; margin-bottom: -5.2rem;}
    .voice .list-wrap {overflow-x: scroll;}
    .voice .list {flex-wrap: nowrap; width: max-content; flex-direction: row; padding: 0 3.8rem; gap: 1rem; margin-top: 4rem;}
    .voice .box {width: 29.9rem;}
    .voice .box .text {height: 22rem; padding: 2.5rem 2.5rem 0; border-radius: 4rem;}

    .voice .box h3 {justify-content: flex-start; align-items: center;}
    .voice .box h3 span {display: block;}
    .voice .box h3 img {width: 8rem; margin: 0;}
    .voice .box h3 .nayami {padding-top: .3rem;}
    .voice .box p {font-size: 1.4rem; line-height: 142.857%; letter-spacing: .07rem; margin-top: 1rem;}
}

/* =================================================================
FAQ
=================================================================*/
.faq {position: relative; padding-top: 18.6rem; padding-bottom: 15rem;}
.faq::before {content: ""; width: 100%; height: 27.6rem; display: block; background-image: url(../img/lp/movie_bg_cloud.png); background-size: 100%; background-repeat: no-repeat; position: absolute; top: 0; left: 0; right: 0; margin: auto;}
.faq .title {position: relative; z-index: 1;}

.faq .list {margin: 4rem auto 0; flex-direction: column; max-width: 100rem; gap: 3rem;}
.faq h3 {background: #FDEDF1; display: flex; justify-content: space-between; align-items: center; border-radius: 4rem; padding: 2.4rem 3rem 2.4rem 3.6rem; cursor: pointer;}
.faq h3 span {display: flex; align-items: center; gap: 1.8rem; color: #EE86AF; font-weight: 700; line-height: 145.455%; letter-spacing: .11rem; font-size: 2.2rem;}
.faq h3 span:before {content: "Q"; font-family: "Cherry Bomb One", system-ui; font-size: 3.2rem; font-weight: 400; line-height: 100%; letter-spacing: .16rem; position: relative; top: -.2rem;}
.faq h3::after {content: ""; width: 2rem; height: 1.5rem; background-image: url(../img/lp/faq_arrow.svg); background-size: cover; transform: rotate(-180deg);}

.faq h3.is-open::after {transform: rotate(0deg);}

.faq .inner {display: none}
.faq .content {padding: 2.7rem 3rem 3rem 3.7rem; display: flex; align-items: flex-start; gap: 1.8rem;}
.faq .content:before {content: "A"; font-family: "Cherry Bomb One", system-ui; font-size: 3.2rem; font-weight: 400; line-height: 100%; letter-spacing: .16rem; position: relative; top: -.2rem; color: #379B6A;;}
.faq .content p {font-size: 1.6rem; font-weight: 500; line-height: 187.5%; letter-spacing: .08rem;}

@media screen and (max-width: 999px) {
    .faq {padding-bottom: 7.4rem; padding-top: 10.5rem;}
    .faq::before {height: 15rem; background-image: url(../img/lp/movie_bg_cloud_sp.png);}
    .faq .list {padding: 0 2rem;}
    .faq h3 {padding: 2.1rem 2.3rem 2.1rem 2.1rem;}
    .faq h3 span {font-size: 1.6rem; gap: 1.3rem; padding-right: 1rem;}
    .faq h3 span:before {font-size: 2.2rem;}
    .faq h3::after {flex-shrink: 0; width: 1.5rem; height: 1.125rem;}

    .faq .content {padding: 1.4rem 0 1.4rem 2.1rem; gap: 1.3rem;}
    .faq .content:before {font-size: 2.2rem;}
    .faq .content p {font-size: 1.4rem; line-height: 171.429%; letter-spacing: .07rem;}
}


/* =================================================================
ABOUT US
=================================================================*/
.aboutus {background-image: url(../img/lp/aboutus_bg.png); background-size: 100%; height: 156.7rem; padding-top: 16.4rem; position: relative;}
.aboutus::after {content: "MOND RICH!!"; font-family: "Cherry Bomb One", system-ui; line-height: 49.948%; font-size: 21.3rem; font-weight: 400; color: rgba(255, 255, 255, 0.70); text-align: center; position: absolute; top: 45.7rem; left: 0; right: 0; margin: auto; z-index: 0;}

.aboutus .title + p {text-align: center; font-size: 2.6rem; font-weight: 700; line-height: 153.846%; letter-spacing: .13rem; margin-top: 5rem;}
.aboutus .inner {margin-top: 3rem; position: relative; z-index: 1;}
.aboutus .inner p {text-align: center; font-size: 2rem; font-weight: 500; line-height: 205%; letter-spacing: .1rem;}
.aboutus .list {justify-content: center; gap: 4rem; margin-top: 6rem;}
.aboutus .box {width: 34rem; height: 34rem; border-radius: 100%; background: linear-gradient(180deg, rgba(255, 78, 78, 0.00) 0%, rgba(255, 78, 78, 0.60) 100%), #EE86AF; padding: 6.8rem 6rem 0;}
.aboutus .box h3 {text-align: center; font-size: 2.2rem; font-weight: 700; line-height: 145.455%; letter-spacing: .11rem; color: #fff;}
.aboutus .box p {font-size: 1.6rem; font-weight: 500; line-height: 187.5%; letter-spacing: .08rem; color: #fff; margin-top: 2rem;}

.aboutus .box:nth-child(2) {background: linear-gradient(180deg, rgba(64, 68, 170, 0.00) 0%, rgba(64, 68, 170, 0.50) 100%), #379B6A;}
.aboutus .box:nth-child(3) {background: linear-gradient(180deg, rgba(90, 78, 255, 0.00) 0%, rgba(90, 78, 255, 0.60) 100%), #1697A4;}

.aboutus .president {margin-top: 7.1rem; display: flex; justify-content: center; align-items: center; gap: 2.937rem;}
.aboutus .president img {width: 30.363rem; display: block;}
.aboutus .president p {text-align: left; font-size: 1.8rem; line-height: 166.667%; letter-spacing: .09rem;}

@media screen and (max-width: 999px) {
    .aboutus {background-image: url(../img/lp/aboutus_bg_sp.png); height: 202.1rem; padding-top: 11.2rem; position: relative;}
    .aboutus::after {font-size: 5.4rem; line-height: 185.185%; letter-spacing: .27rem; top: 45rem;}
    .aboutus .title + p {font-size: 1.8rem; margin-top: 4rem;}
    .aboutus .inner p {font-size: 1.6rem;}
    .aboutus .inner>p {letter-spacing: 0;}
    .aboutus .list {justify-content: center; align-items: center; gap: 3rem;}
    .aboutus .box {width: 28rem; height: 28rem; padding: 0; display: flex; justify-content: center; align-items: center; flex-direction: column;}
    .aboutus .box h3 {font-size: 2.2rem; line-height: 145.455%; letter-spacing: .11rem;}
    .aboutus .box p {font-size: 1.6rem; margin-top: 1rem;}

    .aboutus .president {flex-direction: column; padding: 0 2rem; align-items: center; gap: 2rem; margin-top: 4rem;}
    .aboutus .president picture {align-self: flex-start;}
    .aboutus .president p {text-align: center; font-size: 1.6rem; line-height: 175%; letter-spacing: .08rem;}
    .aboutus:before {content: ""; width: 10.3rem; height: 11.3rem; display: block; background-image: url(../img/lp/products_bg.png); background-size: cover; position: absolute; right: 2.7rem; bottom: -3rem;}
}


/* =================================================================
商品一覧
=================================================================*/
.products {overflow: hidden; position: relative; padding-top: 13.3rem;}
.products .inner {position: relative;}
.products .inner:before {content: ""; width: 18.197rem; height: 20rem; display: block; background-image: url(../img/lp/products_bg.png); background-size: cover; position: absolute; right: 0; top: -25.2rem;}

.products .swiper2 {margin-top: 6.1rem;}
.products .swiper-wrapper {gap: 6rem;}
.products .swiper-slide {width: 36rem;}
.products .image img {width: 36rem;}
.products .text {text-align: center;}
.products .appeal {font-size: 1.6rem; letter-spacing: .08rem; font-weight: 500; margin-top: 3rem;}
.products h3 {font-size: 2.6rem; font-weight: 700; line-height: 138.462%; letter-spacing: .13rem; color: #EE86AF;}
.products .price {margin-top: 1rem;}

.products .swiper-slide:nth-child(2) h3 {color: #379B6A;}
.products .swiper-slide:nth-child(3) h3 {color: #1697A4;}

.products .button {display: block; width: 24.7rem; margin: 4rem auto 0;}
.products .button img {width: 100%;}

@media screen and (max-width: 999px) {
    .products {padding-top: 9.5rem;}
    .products .swiper2 {margin-top: 3rem;}
    .products .inner:before {display: none;}
    .products .swiper-wrapper {gap: inherit;}
    .products .swiper-slide {width: auto;}
    .products .image {display: flex; justify-content: center;}
    .products .image img {width: 24rem}
    .products .appeal {margin-top: 2rem;}
    .products h3 {font-size: 2rem; letter-spacing: .1rem;}
    .products .button {margin-top: 2.2rem;}
}

/* LP youtube */
.video-box{
  height: auto;
  aspect-ratio: 16 / 9;
  overflow: hidden;
}
.video-box iframe {
  /* width: 100%;
  height: 100%; */
  width: calc(100% + 2px);
  height: calc(100% + 2px);
  margin: -1px;
}