@charset "UTF-8";

/* -----------------------------------------------

基本スタイル

----------------------------------------------- */
.lp_wrap .slider {
    display: none;
}
.lp_wrap .slider.slick-initialized {
    display: block;
}
.lp_wrap .slider .slick-arrow {
    cursor: pointer;
}
.lp_wrap .slider .slick-list {
    cursor: grab;
}
.lp_wrap .slider .slick-list:active {
    cursor: grabbing;
}
.lp_wrap .slider .slick-dots li * {
    display: none;
}

/* -----------------------------------------------

offer

----------------------------------------------- */
.lp_wrap .offer .icon {
    position: absolute;
    top: 51.35%;
    left: 67.5%;
    width: 26.6666%;
    transition: 0.8s cubic-bezier(0.25, 0.1, 0.45, 1.48);
    transform: scale(0);
    opacity: 0;
    transform-origin: bottom left;
}
.lp_wrap .offer .icon.trigger.move {
    transform: scale(1);
    opacity: 1;
}
.lp_wrap .offer .btn1 {
    position: absolute;
    top: 51.5%;
    left: 6.1%;
    width: 86%;
    animation: 1.6s offer_btn ease-in-out infinite;
}
.lp_wrap .offer .btn2 {
    position: absolute;
    top: 91.6%;
    left: 9.3%;
    width: 81.3333%;
}
.lp_wrap .offer.tanpin .btn {
    position: absolute;
    inset: 68% 0 auto;
    margin: auto;
    width: 83.7333%;
    animation: 1.6s offer_btn ease-in-out infinite;
}
@keyframes offer_btn {
    0% {
        transform: translateX(0%);
    }
    10% {
        transform: translateX(-5%);
    }
    20% {
        transform: translateX(5%);
    }
    30% {
        transform: translateX(-5%);
    }
    40% {
        transform: translateX(3%);
    }
    50% {
        transform: translateX(-1%);
    }
    60%, 100% {
        transform: translateX(0%);
    }
}
/* -----------------------------------------------

各コンテンツ

----------------------------------------------- */
.lp_wrap .float {
    position: fixed;
    bottom: 0%;
    max-width: 750px;
    width: 100%;
    z-index: 10;
    display: none;
}
.lp_wrap .float .btn {
    position: absolute;
    bottom: 9%;
    left: 4.066%;
    width: 91.867%;
}
/* -------------------------------------------- */
.lp_wrap .modal {
    position: fixed;
    inset: 0%;
    z-index: 10;
    display: none;
}
.lp_wrap .modal .shadow {
    position: absolute;
    inset: 0;
    background: rgba(0, 0, 0, 0.6);
    cursor: pointer;
}
.lp_wrap .modal .img {
    position: absolute;
    inset: 40px 20px auto;
    max-width: 670px;
    max-height: calc(100vh - 80px);
    margin: auto;
    overflow: auto;
    -webkit-overflow-scrolling: touch;
}
.lp_wrap .modal .close {
    position: absolute;
    inset: 40px 20px auto;
    width: calc(100% - 40px);
    max-width: 670px;
    margin: auto;
}
.lp_wrap .modal .close img {
    display: block;
    width: 10.447%;
    margin-left: auto;
    transform: translate(10px, -10px);
    cursor: pointer;
}
/* -------------------------------------------- */
.lp_wrap .intro .head li {
    position: absolute;
}
.lp_wrap .intro .head li:nth-child(1) {
    top: 1.67%;
    left: 4.7%;
    width: 65.4666%;
}
.lp_wrap .intro .head li:nth-child(2) {
    top: 1.7%;
    left: 78.5%;
    width: 16.1333%;
}
.lp_wrap .intro .head li:nth-child(3) {
    top: 5.67%;
    left: 31.7%;
    width: 46%;
}
.lp_wrap .intro .head li.trigger.move:nth-of-type(1) {
    animation: 1s haneru ease-in-out;
}
.lp_wrap .intro .head li.trigger.move:nth-of-type(2) {
    animation: 1s haneru 0.1s ease-in-out;
}
@keyframes haneru {
    0%, 20%, 80%, 100% {
        transform: translateY(0);
    }
    50% {
        transform: translateY(-15%);
    }
}
.lp_wrap .intro .head li:nth-child(1) img {
    transition: 0.8s;
}
.lp_wrap .intro .head li:nth-child(2) img {
    transition: 0.8s 0.1s;
}
.lp_wrap .intro .head li:nth-child(3) img {
    transition: 0.8s 0.3s;
}
.lp_wrap .intro .head li.trigger img,
.lp_wrap .intro .head li.trigger ~ li img {
    transform: translateY(15%);
    opacity: 0;
}
.lp_wrap .intro .head li.trigger.move img,
.lp_wrap .intro .head li.trigger.move ~ li img {
    transform: translateY(0);
    opacity: 1;
}
.lp_wrap .intro .movie {
    position: absolute;
    top: 11%;
    left: 4.666%;
    width: 90.667%;
    overflow: hidden;
    border-radius: 30px;
    aspect-ratio: 16 / 9;
}
.lp_wrap .intro .movie iframe {
    width: 100%;
    height: 100%;
}
.lp_wrap .intro .copy {
    position: absolute;
    top: 28.7%;
    left: 12.267%;
    width: 75.467%;
}
.lp_wrap .intro .copy.trigger.move {
    animation: 0.8s haneru ease-in-out;
}
.lp_wrap .intro .copy.trigger img {
    transition: 0.8s;
    transform: translateY(15%);
    opacity: 0;
}
.lp_wrap .intro .copy.trigger.move img {
    transform: translateY(0);
    opacity: 1;
}
.lp_wrap .intro .center li {
    position: absolute;
}
.lp_wrap .intro .center li:nth-child(1) {
    top: 38.2%;
    left: 0;
    width: 35.867%;
    transition: 0.8s;
    transform: translateX(-110%);
}
.lp_wrap .intro .center li:nth-child(2) {
    top: 37.5%;
    right: 0;
    width: 36%;
    transition: 0.8s;
    transform: translateX(110%);
}
.lp_wrap .intro .center li.trigger.move,
.lp_wrap .intro .center li.trigger.move ~ li {
    transform: translateX(0);
}
.lp_wrap .intro .photo {
    position: absolute;
    top: 66.3%;
    left: 0%;
    width: 97.7333%;
}
.lp_wrap .intro .photo.trigger {
    transition: 0.6s;
    opacity: 0;
    transform: translateY(-15%);
}
.lp_wrap .intro .photo.trigger.move {
    opacity: 1;
    transform: translateY(0);
}
.lp_wrap .intro .icon li {
    position: absolute;
    top: 91%;
    width: 28%;
}
.lp_wrap .intro .icon li:nth-child(1) {
    left: 5.3%;
}
.lp_wrap .intro .icon li:nth-child(2) {
    left: 36%;
}
.lp_wrap .intro .icon li:nth-child(3) {
    left: 66.7%;
}
.lp_wrap .intro .icon li.trigger.move:nth-of-type(1) {
    animation: 1s haneru ease-in-out;
}
.lp_wrap .intro .icon li.trigger.move:nth-of-type(2) {
    animation: 1s haneru 0.3s ease-in-out;
}
.lp_wrap .intro .icon li.trigger.move:nth-of-type(3) {
    animation: 1s haneru 0.6s ease-in-out;
}
.lp_wrap .intro .icon li:nth-child(1) img {
    transition: 0.8s;
}
.lp_wrap .intro .icon li:nth-child(2) img {
    transition: 0.8s 0.3s;
}
.lp_wrap .intro .icon li:nth-child(3) img {
    transition: 0.8s 0.6s;
}
.lp_wrap .intro .icon li.trigger img,
.lp_wrap .intro .icon li.trigger ~ li img {
    transform: translateY(15%);
    opacity: 0;
}
.lp_wrap .intro .icon li.trigger.move img,
.lp_wrap .intro .icon li.trigger.move ~ li img {
    transform: translateY(0);
    opacity: 1;
}
/* -------------------------------------------- */
.lp_wrap .recommend .icon {
    position: absolute;
    top: 2.3%;
    left: 6.2%;
    width: 29.467%;
}
.lp_wrap .recommend .icon.trigger {
    transition: 0.6s;
    transform: scale(0);
}
.lp_wrap .recommend .icon.trigger.move {
    transform: scale(1);
}
.lp_wrap .recommend .movie {
    position: absolute;
    top: 42%;
    left: 16%;
    width: 78.667%;
}
/* -------------------------------------------- */
.lp_wrap .school .fk {
    position: absolute;
    top: 1.9%;
    left: -2.8%;
    width: 62.667%;
    transform-origin: bottom right;
    animation: 3s school_fk linear infinite;
}
@keyframes school_fk {
    0%, 9%, 54%, 100% {
        transform: rotate(0);
    }
    10%, 20%, 32%, 42% {
        transform: rotate(-2deg);
    }
    21%, 31%, 43%, 53% {
        transform: rotate(2deg);
    }
}
.lp_wrap .school .hand {
    position: absolute;
    top: 0.8%;
    left: 49.7%;
    width: 91.867%;
}
.lp_wrap .school .hand img {
    transition: 0.8s;
    transform: rotate(45deg);
    transform-origin: bottom right;
}
.lp_wrap .school .hand.trigger.move img {
    transform: rotate(0deg);
}
.lp_wrap .school .icon1 {
    position: absolute;
    top: 20.05%;
    left: 4.2%;
    width: 30.667%;
}
.lp_wrap .school .icon1.trigger {
    transition: 0.8s;
    transform: translateX(-120%);
}
.lp_wrap .school .icon1.trigger.move {
    transform: translateX(0);
}
.lp_wrap .school .movie {
    position: absolute;
    top: 41.45%;
    right: 0;
    width: 53.333%;
    aspect-ratio: 1 / 1.1;
}
.lp_wrap .school .movie iframe {
    width:100%;
    height:100%;
}
.lp_wrap .school .photo1 {
    position: absolute;
    top: 51.6%;
    left: 0;
    width: 48.667%;
}
.lp_wrap .school .icon2 {
    position: absolute;
    top: 65.3%;
    left: 61.2%;
    width: 35.333%;
}
.lp_wrap .school .icon2.trigger {
    transition: 0.8s;
    transform: translateX(120%);
}
.lp_wrap .school .icon2.trigger.move {
    transform: translateX(0);
}
.lp_wrap .school .icon3 {
    position: absolute;
    top: 80.5%;
    left: 0;
    width: 31.867%;
}
.lp_wrap .school .icon3.trigger {
    transition: 0.8s;
    transform: translateX(-120%);
}
.lp_wrap .school .icon3.trigger.move {
    transform: translateX(0);
}
.lp_wrap .school .photo2 {
    position: absolute;
    top: 84.5%;
    right: 0;
    width: 75.7333%;
}
/* -------------------------------------------- */
.lp_wrap .voice .fk li {
    position: absolute;
    transition: 0.8s;
}
.lp_wrap .voice .fk li:nth-of-type(1) {
    top: 13.5%;
    left: 6.5%;
    width: 86.133%;
    transform: translateX(-120%);
}
.lp_wrap .voice .fk li:nth-of-type(2) {
    top: 26.8%;
    left: 57.9%;
    width: 39.86666%;
    transform: translateX(120%);
}
.lp_wrap .voice .fk li.trigger.move,
.lp_wrap .voice .fk li.trigger.move ~li {
    transform: translateX(0);
}
/* -------------------------------------------- */
.lp_wrap .insta .head li {
    position: absolute;
    clip-path: inset(0 100% 0 0);
}
.lp_wrap .insta .head li:nth-child(1) {
    top: 11.7%;
    left: 10.7%;
    width: 78.6%;
    height: 6.7%;
    background: #fff;
    transition: 0.8s;
}
.lp_wrap .insta .head li:nth-child(2) {
    top: 12.6%;
    left: 13.1%;
    width: 73.867%;
    transition: 0.8s 0.4s;
}
.lp_wrap .insta .head li.trigger.move,
.lp_wrap .insta .head li.trigger.move ~ li {
    clip-path: inset(0);
}
.lp_wrap .insta .slider_wrap1 {
    position: absolute;
    top: 25.6%;
    left: 0%;
    width: 100%;
}
.lp_wrap .insta .slider_wrap1 img {
    width: 97%;
    margin: auto;
}
.lp_wrap .insta .slider_wrap1 .slick-slide {
    transform: scale(0.8);
    transition: 0.6s;
    display: flex;
    align-items: baseline;
}
.lp_wrap .insta .slider_wrap1 .slick-slide.slick-center {
    transform: scale(1);
}
.lp_wrap .insta .slider_wrap1 .movie {
    position: absolute;
    top: 8.1%;
    left: 0%;
    width: 100%;
    z-index: -1;
}
.lp_wrap .insta .slider_wrap1 .slick-arrow {
    position: absolute;
    top: 34.1%;
    width: 11%;
    z-index: 1;
}
.lp_wrap .insta .slider_wrap1 .slick-arrow.prev {
    left: 13%;
}
.lp_wrap .insta .slider_wrap1 .slick-arrow.next {
    right: 13.3%;
}
.lp_wrap .insta .slider_wrap2 {
    position: absolute;
    top: 75.25%;
    left: 0%;
    width: 100%;
}
.lp_wrap .insta .slider_wrap2 img {
    width: 97%;
    margin: auto;
}
/* -------------------------------------------- */
.lp_wrap .repeat .more {
    width: 100%;
    box-sizing: border-box;
    background: rgb(94 176 78);
}
.lp_wrap .repeat .content {
    position: relative;
    height: auto;
    max-height: 150vw;
    overflow: hidden;
    transition: max-height 1s;
}
.lp_wrap .repeat .content::after {
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    z-index: 1;
    display: block;
    width: 100%;
    height: 100%;
    transition: 1s;
    background: rgb(94 176 78);
    background: linear-gradient(180deg, rgba(94,176,78,0) 0%, rgba(94,176,78,0) 60%, rgba(94,176,78,1) 100%);
}
.lp_wrap .repeat .content.open:after {
    z-index: -1;
    opacity: 0;
}
.lp_wrap .repeat .more_btn {
    display: block;
    margin: 0 auto;
    padding-bottom: 5%;
    border: 0;
    width: 81.33%;
    cursor: pointer;
    background: rgb(94 176 78);
}
@media screen and (min-width: 751px) {
    .lp_wrap .repeat .content {
        max-height: 1010px;
    }
}
.lp_wrap .repeat .graph li {
    position: absolute;
}
.lp_wrap .repeat .graph li:nth-child(1) {
    margin-top: -292.1%;
    left: 12.5%;
    width: 74.933%;
    aspect-ratio: 1 / 1;
}
.lp_wrap .repeat .graph li:nth-child(1) svg {
    display: block;
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    transform:rotate(-90deg);
}
.lp_wrap .repeat .graph li:nth-child(1) svg circle {
    fill: transparent;
    stroke: #5eb04e;
    stroke-width: 55;
    stroke-linecap: round;
    stroke-dasharray: 1800;
    stroke-dashoffset: 1800;
}
.lp_wrap .repeat .graph li.trigger.move svg circle {
    animation: 1.6s almond_graph ease-in-out forwards;
}
@keyframes almond_graph {
    0% {
        stroke-dashoffset: 1800;
    }
    100%{
        stroke-dashoffset: 381;
    }
}
.lp_wrap .repeat .graph li:nth-child(2) {
    margin-top: -265.6%;
    left: 30.067%;
    width: 39.867%;
}
.lp_wrap .repeat .graph li.trigger.move:nth-of-type(2) {
    animation: 1s haneru 0.6s ease-in-out;
}
.lp_wrap .repeat .graph li:nth-child(2) img {
    transform: translateY(15%);
    opacity: 0;
    transition: 0.6s 0.8s;
}
.lp_wrap .repeat .graph li.trigger.move img,
.lp_wrap .repeat .graph li.trigger.move ~ li img {
    transform: translateY(0);
    opacity: 1;
}
.lp_wrap .repeat .graph li:nth-child(3) {
    margin-top: -294.8%;
    left: 61.8%;
    width: 36%;
    transform-origin: bottom left;
    animation: 3s school_fk linear infinite;
}
/* -------------------------------------------- */
.lp_wrap .none .cause1 li {
    position: absolute;
}
.lp_wrap .none .cause1 li:nth-child(1) {
    top: 14%;
    left: 0;
    width: 73.333%;
    transition: 0.8s;
    transform: translateX(-100%);
}
.lp_wrap .none .cause1 li:nth-child(2) {
    top: 17.4%;
    left: 67.3%;
    width: 29.467%;
    transition: 0.3s 0.5s;
    opacity: 0;
    transform: scale(1.3);
}
.lp_wrap .none .cause1 li:nth-child(3) {
    top: 14.05%;
    left: 74.3%;
    width: 22.8%;
    transition: 0.3s 0.5s;
    opacity: 0;
    transform: scale(1.3);
}
.lp_wrap .none .cause1 li.trigger.move,
.lp_wrap .none .cause1 li.trigger.move ~ li {
    transform: scale(1) translateX(0);
    opacity: 1;
}
.lp_wrap .none .cause2 li {
    position: absolute;
}
.lp_wrap .none .cause2 li:nth-child(1) {
    top: 27.2%;
    right: 0;
    width: 73.333%;
    transition: 0.8s;
    transform: translateX(100%);
}
.lp_wrap .none .cause2 li:nth-child(2) {
    top: 29.6%;
    left: 7.9%;
    width: 29.467%;
    transition: 0.3s 0.5s;
    opacity: 0;
    transform: scale(1.3);
}
.lp_wrap .none .cause2 li:nth-child(3) {
    top: 26.4%;
    left: 1.6%;
    width: 34.533%;
    transition: 0.3s 0.5s;
    opacity: 0;
    transform: scale(1.3);
}
.lp_wrap .none .cause2 li.trigger.move,
.lp_wrap .none .cause2 li.trigger.move ~ li {
    transform: scale(1) translateX(0);
    opacity: 1;
}
.lp_wrap .none .cause3 li {
    position: absolute;
}
.lp_wrap .none .cause3 li:nth-child(1) {
    top: 38.98%;
    left: 0;
    width: 73.333%;
    transition: 0.8s;
    transform: translateX(-100%);
}
.lp_wrap .none .cause3 li:nth-child(2) {
    top: 44.1%;
    left: 62.9%;
    width: 29.467%;
    transition: 0.3s 0.5s;
    opacity: 0;
    transform: scale(1.3);
}
.lp_wrap .none .cause3 li:nth-child(3) {
    top: 40.75%;
    left: 69.6%;
    width: 25.867%;
    transition: 0.3s 0.5s;
    opacity: 0;
    transform: scale(1.3);
}
.lp_wrap .none .cause3 li.trigger.move,
.lp_wrap .none .cause3 li.trigger.move ~ li {
    transform: scale(1) translateX(0);
    opacity: 1;
}
.lp_wrap .none .copy1 li {
    position: absolute;
}
.lp_wrap .none .copy1 li:nth-child(1) {
    top: 56.95%;
    left: 81.6%;
    width: 14.667%;
    transition: 0.6s;
    transform: translateX(130%);
}
.lp_wrap .none .copy1 li:nth-child(2) {
    top: 56.97%;
    left: 4.3%;
    width: 16.8%;
    transition: 0.6s;
    transform: translateX(-130%);
}
.lp_wrap .none .copy1 li:nth-child(3) {
    top: 56.9%;
    left: 58.8%;
    width: 21.2%;
    transition: 0.4s 0.4s;
    transform: scale(0);
    transform-origin: bottom left;
}
.lp_wrap .none .copy1 li.trigger.move,
.lp_wrap .none .copy1 li.trigger.move ~ li {
    transform: scale(1) translateX(0);
}
.lp_wrap .none .clock li {
    position: absolute;
    opacity: 0;
    transform: translateY(15%);
}
.lp_wrap .none .clock li:nth-child(1) {
    top: 84.1%;
    left: 38%;
    width: 25.3%;
    transition: 0.6s;
}
.lp_wrap .none .clock li:nth-child(1) .arrow {
    position: absolute;
    top: 3.6%;
    left: 62.8%;
    width: 49.1%;
}
.lp_wrap .none .clock li:nth-child(2) {
    top: 91.4%;
    left: 3.7%;
    width: 88.1333%;
    transition: 0.6s 0.3s;
}
.lp_wrap .none .clock li.trigger.move,
.lp_wrap .none .clock li.trigger.move ~ li {
    opacity: 1;
    transform: translateY(0);
}
/* -------------------------------------------- */
.lp_wrap .know .fk {
    position: absolute;
    top: 6.7%;
    left: 25.1%;
    width: 49.333%;
}
.lp_wrap .know .fk.trigger {
    transition: 0.8s;
    opacity: 0;
    transform: translateY(-30%);
}
.lp_wrap .know .fk.trigger.move {
    opacity: 1;
    transform: translateY(0);
}
.lp_wrap .know .head li {
    position: absolute;
}
.lp_wrap .know .head li:nth-child(1) {
    top: 19.4%;
    left: 16.934%;
    width: 66.133%;
    transition: 1s;
    transform: translateX(-130%);
}
.lp_wrap .know .head li:nth-child(2) {
    top: 29.5%;
    left: 10%;
    width: 79.6%;
    transition: 1s;
    transform: translateX(130%);
}
.lp_wrap .know .head li.trigger.move,
.lp_wrap .know .head li.trigger.move ~ li {
    transform: translateX(0);
}
.lp_wrap .know .graph {
    position: absolute;
    top: 40.4%;
    left: 6.267%;
    width: 87.467%;
}
.lp_wrap .know .graph.trigger {
    transition: 0.8s;
    opacity: 0;
    transform: translateY(15%);
}
.lp_wrap .know .graph.trigger.move {
    opacity: 1;
    transform: translateY(0);
}
/* -------------------------------------------- */
.lp_wrap .nayami .fk {
    position: absolute;
    top: 2.83%;
    left: 36.7%;
    width: 26.6666%;
    transition: 0.6s;
    opacity: 0;
    transform: translateY(-30%);
}
.lp_wrap .nayami .fk.trigger.move {
    opacity: 1;
    transform: translateY(0);
}
.lp_wrap .nayami .head {
    position: absolute;
    top: 12.83%;
    left: 40.7%;
    width: 51.2%;
    transition: 0.8s;
    clip-path: inset(0 100% 0 0);
}
.lp_wrap .nayami .head.trigger.move {
    clip-path: inset(0);
}
.lp_wrap .nayami .catch {
    position: absolute;
    top: 29.34%;
    left: 26.3%;
    width: 47.4666%;
    transition: 0.8s;
    clip-path: inset(0 100% 0 0);
}
.lp_wrap .nayami .catch.trigger.move {
    clip-path: inset(0);
}
.lp_wrap .nayami .com li {
    position: absolute;
  opacity: 0;
  transform: scale(0.3);
}
.lp_wrap .nayami .com li:nth-child(1) {
    top: 36.03%;
    left: 25.3%;
    width: 46.53333%;
    transition: 0.6s;
    transform-origin: 0% 20%;
}
.lp_wrap .nayami .com li:nth-child(2) {
    top: 42.96%;
    left: 22.2%;
    width: 47.2%;
    transition: 0.6s 0.3s;
    transform-origin: 100% 10%;
}
.lp_wrap .nayami .com li:nth-child(3) {
    top: 49%;
    left: 26.4%;
    width: 65.7333%;
    transition: 0.6s 0.6s;
    transform-origin: 0% 20%;
}
.lp_wrap .nayami .com li.trigger.move,
.lp_wrap .nayami .com li.trigger.move ~ li {
  opacity: 1;
  transform: scale(1);
}
.lp_wrap .nayami .before1 {
    position: absolute;
    top: 76.1%;
    left: 12.8%;
    width: 12.2666%;
    transition: 0.4s 0.6s;
    opacity: 1;
}
.lp_wrap .nayami .before2 {
    position: absolute;
    top: 76.1%;
    left: 44.4%;
    width: 12.2666%;
    transition: 0.4s 1s;
    opacity: 1;
}
.lp_wrap .nayami .before3 {
    position: absolute;
    top: 76.1%;
    left: 74.9%;
    width: 12.2666%;
    transition: 0.4s 1.4s;
    opacity: 1;
}
.lp_wrap .nayami .before1.trigger.move,
.lp_wrap .nayami .before1.trigger.move ~ .before2,
.lp_wrap .nayami .before1.trigger.move ~ .before3 {
    opacity: 0;
}
.lp_wrap .nayami .after1 {
    position: absolute;
    top: 75.23%;
    left: 4.5%;
    width: 29.333%;
    transition: 0.6s 0.6s;
    opacity: 0;
    transform: translateY(20%);
}
.lp_wrap .nayami .after2 {
    position: absolute;
    top: 75.23%;
    left: 35.6%;
    width: 29.333%;
    transition: 0.6s 1s;
    opacity: 0;
    transform: translateY(20%);
}
.lp_wrap .nayami .after3 {
    position: absolute;
    top: 75.23%;
    left: 66.7%;
    width: 29.333%;
    transition: 0.6s 1.4s;
    opacity: 0;
    transform: translateY(20%);
}
.lp_wrap .nayami .before1.trigger.move ~ .after1,
.lp_wrap .nayami .before1.trigger.move ~ .after2,
.lp_wrap .nayami .before1.trigger.move ~ .after3 {
    opacity: 1;
    transform: translateY(0);
}
/* -------------------------------------------- */
.lp_wrap .eat .box {
    position: absolute;
    top: 5.85%;
    left: 0%;
    width: 100%;
}
.lp_wrap .eat .box.trigger {
    transition: 0.8s;
    opacity: 0;
    transform: translateY(15%);
}
.lp_wrap .eat .box.trigger.move {
    opacity: 1;
    transform: translateY(0);
}
.lp_wrap .eat .box .head li {
    position: absolute;
    clip-path: inset(0 100% 0 0);
}
.lp_wrap .eat .box .head li:nth-child(1) {
    top: 9.4%;
    left: 10.7%;
    width: 84.1%;
    height: 8.7%;
    background: rgb(255 255 255 / 80%);
    transition: 1s;
}
.lp_wrap .eat .box .head li:nth-child(2) {
    top: 11.2%;
    left: 12.9%;
    width: 80.133%;
    transition: 1s 0.6s;
}
.lp_wrap .eat .box .head li.trigger.move,
.lp_wrap .eat .box .head li.trigger.move ~ li {
    clip-path: inset(0);
}
.lp_wrap .eat .fk {
    position: absolute;
    top: -3.25%;
    left: 4%;
    width: 22.8%;
}
.lp_wrap .eat .photo {
    position: absolute;
    top: 27.4%;
    left: -33.2%;
    width: 104.8%;
    animation: 24s cycle linear infinite;
}
@keyframes cycle {
    from {
        transform: rotate(0deg);
    }
    to {
        transform: rotate(359deg);
    }
}
.lp_wrap .eat .com li {
    position: absolute;
    right: 0;
    width: 73.2%;
    transform: translateX(150%);
}
.lp_wrap .eat .com li:nth-child(1) {
    top: 30.6%;
    transition: 1s;
}
.lp_wrap .eat .com li:nth-child(2) {
    top: 44.3%;
    transition: 1s 0.3s;
}
.lp_wrap .eat .com li:nth-child(3) {
    top: 58.05%;
    transition: 1s 0.6s;
}
.lp_wrap .eat .com li:nth-child(4) {
    top: 71.75%;
    transition: 1s 0.9s;
}
.lp_wrap .eat .com li.trigger.move,
.lp_wrap .eat .com li.trigger.move ~ li {
    transform: translateX(0);
}
.lp_wrap .eat .text {
    position: absolute;
    top: 85.4%;
    left: 38.8%;
    width: 58.66666%;
}
.lp_wrap .eat .arrow {
    position: absolute;
    top: 61.8%;
    left: 43.334%;
    width: 13.333%;
}
.lp_wrap .eat .arrow.trigger {
    transition: 0.6s;
    opacity: 0;
    transform: translateY(-20%);
}
.lp_wrap .eat .arrow.trigger.move {
    opacity: 1;
    transform: translateY(0);
}
.lp_wrap .eat .center li {
    position: absolute;
    top: 68.45%;
    width: 48.667%;
    transition: 0.8s;
}
.lp_wrap .eat .center li:nth-child(1) {
    left: 0;
    transform: translateX(-120%);
}
.lp_wrap .eat .center li:nth-child(2) {
    right: 0%;
    transform: translateX(120%);
}
.lp_wrap .eat .center li.trigger.move,
.lp_wrap .eat .center li.trigger.move ~ li {
    transform: translateX(0);
}
/* -------------------------------------------- */
.lp_wrap .off .head {
    position: absolute;
    top: 4.88%;
    left: 29.2%;
    width: 40.533%;
}
.lp_wrap .off .head.trigger {
    transition: 0.6s;
    opacity: 0;
    transform: translateY(-15%);
}
.lp_wrap .off .head.trigger.move {
    opacity: 1;
    transform: translateY(0);
}
.lp_wrap .off .step1 li {
    position: absolute;
}
.lp_wrap .off .step1 li:nth-child(1) {
    top: 26.85%;
    left: 32.2%;
    width: 135.733%;
}
.lp_wrap .off .step1 li:nth-child(1) img {
    transition: 0.8s;
    transform: rotate(45deg);
    transform-origin: bottom right;
}
.lp_wrap .off .step1 li:nth-child(2) {
    top: 32.25%;
    left: -22.3%;
    width: 58.4%;
}
.lp_wrap .off .step1 li:nth-child(2) img {
    transition: 0.8s;
    transform: rotate(-60deg);
    transform-origin: bottom left;
}
.lp_wrap .off .step1 li:nth-child(3) {
    top: 31.47%;
    left: 13.2%;
    width: 20.4%;
    transition: 0.3s 0.8s;
    opacity: 0;
    transform: scale(0.4);
    transform-origin: top right;
}
.lp_wrap .off .step1 li:nth-child(4) {
    top: 36%;
    left: 36%;
    width: 53.333%;
    transition: 0.3s 0.8s;
    opacity: 0;
    transform: scale(0.4);
}
.lp_wrap .off .step1 li.trigger.move,
.lp_wrap .off .step1 li.trigger.move ~ li {
    opacity: 1;
    transform: scale(1);
}
.lp_wrap .off .step1 li.trigger.move img,
.lp_wrap .off .step1 li.trigger.move ~ li img {
    transform: rotate(0deg);
}
.lp_wrap .off .step2 {
    position: absolute;
    top: 40.8%;
    left: 0;
    width: 64.133%;
}
.lp_wrap .off .step2.trigger {
    transition: 1s;
    transform: translateX(-150%);
}
.lp_wrap .off .step2.trigger.move {
    transform: translateX(0);
}
.lp_wrap .off .step3 {
    position: absolute;
    top: 48.2%;
    right: 0;
    width: 54.4%;
}
.lp_wrap .off .step3.trigger.move {
    animation: 0.8s haneru ease-in-out;
}
.lp_wrap .off .step3.trigger img {
    transition: 0.8s;
    transform: translateY(15%);
    opacity: 0;
}
.lp_wrap .off .step3.trigger.move img {
    transform: translateY(0);
    opacity: 1;
}
.lp_wrap .off .icon1 {
    position: absolute;
    top: 60.56%;
    left: 10%;
    width: 79.067%;
    z-index: 1;
}
.lp_wrap .off .icon1.trigger {
    transition: 0.6s;
    transform: translateY(-15%);
    opacity: 0;
}
.lp_wrap .off .icon1.trigger.move {
    transform: translateY(0);
    opacity: 1;
}
.lp_wrap .off .cycle {
    position: absolute;
    top: 74.6%;
    left: -5.133%;
    width: 110.267%;
    animation: 16s cycle linear infinite;
}
.lp_wrap .off .photo {
    position: absolute;
    top: 71.5%;
    left: 0%;
    width: 100%;
}
.lp_wrap .off .photo.trigger {
    transition: 1s 0.4s;
    clip-path: polygon(0% 0%, 0% 100%, 50% 100%, 50% 0, 50% 0, 50% 100%, 100% 100%, 100% 0%);
}
.lp_wrap .off .photo.trigger.move {
    clip-path: polygon(0% 0%, 0% 100%, 0% 100%, 0% 0, 100% 0, 100% 100%, 100% 100%, 100% 0%);
}
.lp_wrap .off .icon2 li {
    position: absolute;
    top: 93.2%;
    width: 45.333%;
}
.lp_wrap .off .icon2 li:nth-child(1) {
    left: 4%;
}
.lp_wrap .off .icon2 li:nth-child(2) {
    left: 50.7%;
}
.lp_wrap .off .icon2 li.trigger.move:nth-of-type(1) {
    animation: 1s haneru ease-in-out;
}
.lp_wrap .off .icon2 li.trigger.move:nth-of-type(2) {
    animation: 1s haneru 0.3s ease-in-out;
}
.lp_wrap .off .icon2 li:nth-child(1) img {
    transition: 0.8s;
}
.lp_wrap .off .icon2 li:nth-child(2) img {
    transition: 0.8s 0.3s;
}
.lp_wrap .off .icon2 li.trigger img,
.lp_wrap .off .icon2 li.trigger ~ li img {
    transform: translateY(15%);
    opacity: 0;
}
.lp_wrap .off .icon2 li.trigger.move img,
.lp_wrap .off .icon2 li.trigger.move ~ li img {
    transform: translateY(0);
    opacity: 1;
}
/* -------------------------------------------- */
.lp_wrap .ion .movie {
    position: absolute;
    top: 51.2%;
    left: 4.8%;
    width: 90.667%;
    aspect-ratio: 16 / 9;
}
.lp_wrap .ion .movie iframe {
    width: 100%;
    height: 100%;
}
/* -------------------------------------------- */
.lp_wrap .good .bg {
    position: absolute;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    background: #b4e2f1;
    z-index: 1;
}
.lp_wrap .good .bg.trigger {
    transition: 1.2s 0.2s;
    clip-path: inset(0 0 63.5% 0);
}
.lp_wrap .good .bg.trigger.move {
    clip-path: inset(0 0 100% 0);
}
.lp_wrap .good .head {
    position: absolute;
    top: 1.28%;
    left: 6.5%;
    width: 86.533%;
    z-index: 1;
}
.lp_wrap .good .bg.trigger + .head {
    transition: 0.8s 0.4s;
    transform: translateY(160%);
}
.lp_wrap .good .bg.trigger.move + .head {
    transform: translateY(0);
}
.lp_wrap .good .copy1 {
    position: absolute;
    top: 8.17%;
    right: 0;
    width: 36.6666%;
    z-index: 1;
}
.lp_wrap .good .bg.trigger + .head + .copy1 {
    transition: 0.8s 1s;
    transform: translateX(100%);
}
.lp_wrap .good .bg.trigger.move + .head + .copy1 {
    transform: translateX(0);
}
.lp_wrap .good .photo_base {
    position: absolute;
    top: 11.91%;
    right: 23.4%;
    width: 91%;
    height: 15.06%;
    background: #f4f6f5;
    border-radius: 50%;
}
.lp_wrap .good .bg.trigger + .head + .copy1 + .photo_base {
    transition: 0.6s 1.4s;
    transform: scale(0);
}
.lp_wrap .good .bg.trigger.move + .head + .copy1 + .photo_base {
    transform: scale(1);
}
.lp_wrap .good .photo {
    position: absolute;
    top: 10.95%;
    left: -14.1%;
    width: 90.8%;
}
.lp_wrap .good .bg.trigger + .head + .copy1 + .photo_base + .photo {
    transition: 0.6s 1.8s;
    opacity: 0;
    transform: translateY(-10%);
}
.lp_wrap .good .bg.trigger.move + .head + .copy1 + .photo_base + .photo {
    opacity: 1;
    transform: translateY(0);
}
.lp_wrap .good .vegetables li {
    position: absolute;
}
.lp_wrap .good .vegetables li:nth-child(1) {
    top: 21.8%;
    left: -9.2%;
    width: 45.733%;
    animation: 3s school_fk linear infinite;
}
.lp_wrap .good .vegetables li:nth-child(2) {
    top: 22.73%;
    left: 52.1%;
    width: 53.467%;
    animation: 3s school_fk -1.3s linear infinite;
}
.lp_wrap .good .vegetables li:nth-child(3) {
    top: 20.75%;
    left: 70.6%;
    width: 68%;
    animation: 3s school_fk -1.3s linear infinite;
}
.lp_wrap .good .vegetables li:nth-child(4) {
    top: 26.5%;
    left: 61.4%;
    width: 63.067%;
    animation: 3s school_fk -1.5s linear infinite;
}
.lp_wrap .good .tit {
    position: absolute;
    top: 28.45%;
    left: 6.4%;
    width: 83.06666%;
}
.lp_wrap .good .copy2 {
    position: absolute;
    top: 37.83%;
    left: 5.3%;
    width: 57.467%;
}
.lp_wrap .good .copy2.trigger {
    transition: 0.8s;
    transform: translateX(-150%);
}
.lp_wrap .good .copy2.trigger.move {
    transform: translateX(0);
}
.lp_wrap .good .copy3 {
    position: absolute;
    top: 42.25%;
    left: 60.2%;
    width: 37.467%;
}
.lp_wrap .good .copy3.trigger {
    transition: 1s;
    clip-path: inset(0 100% 0 0);
}
.lp_wrap .good .copy3.trigger.move {
    clip-path: inset(0);
}
.lp_wrap .good .point1 {
    position: absolute;
    top: 47.06%;
    left: 73.2%;
    width: 20.8%;
}
.lp_wrap .good .point1.trigger {
    transition: 0.8s;
    transform: translateX(150%);
}
.lp_wrap .good .point1.trigger.move {
    transform: translateX(0);
}
.lp_wrap .good .icon1 li {
    position: absolute;
}
.lp_wrap .good .icon1 li:nth-child(1) {
    top: 47.95%;
    left: 2.9%;
    width: 67.867%;
}
.lp_wrap .good .icon1 li:nth-child(2) {
    top: 53.53%;
    left: 47.5%;
    width: 23.067%;
    transition: 0.6s 3s;
    transform: scale(0);
}
.lp_wrap .good .icon1 li:nth-child(1) img {
    opacity: 0;
}
.lp_wrap .good .icon1 li.trigger.move img {
    animation: 3s step1_tomato 0.4s linear forwards;
}
@keyframes step1_tomato {
    0%, 10%, 30%, 40%, 60%, 70%, 90%, 100% {
        opacity: 0;
    }
    15%, 25%, 45%, 55%, 75%, 85% {
        opacity: 1;
    }
}
.lp_wrap .good .icon1 li.trigger.move,
.lp_wrap .good .icon1 li.trigger.move ~ li {
    transform: scale(1);
}
.lp_wrap .good .point2 {
    position: absolute;
    top: 62.93%;
    left: 6.3%;
    width: 20%;
}
.lp_wrap .good .point2.trigger {
    transition: 0.8s;
    transform: translateX(-150%);
}
.lp_wrap .good .point2.trigger.move {
    transform: translateX(0);
}
.lp_wrap .good .icon2 li {
    position: absolute;
}
.lp_wrap .good .icon2 li:nth-child(1) {
    top: 71.46%;
    left: 38.8%;
    width: 50.4%;
    transition: 0.6s 0.4s;
    transform: translateY(-100%);
    opacity: 0;
}
.lp_wrap .good .icon2 li:nth-child(2) {
    top: 72.8%;
    left: 16.5%;
    width: 23.067%;
    transition: 0.6s 0.8s;
    transform: scale(0);
}
.lp_wrap .good .icon2 li.trigger.move,
.lp_wrap .good .icon2 li.trigger.move ~ li {
    opacity: 1;
    transform: scale(1) translateY(0);
}
.lp_wrap .good .before {
    position: absolute;
    top: 65.28%;
    left: 38.2%;
    width: 51.467%;
}
.lp_wrap .good .point3 {
    position: absolute;
    top: 84%;
    left: 74%;
    width: 20%;
}
.lp_wrap .good .point3.trigger {
    transition: 0.8s;
    transform: translateX(150%);
}
.lp_wrap .good .point3.trigger.move {
    transform: translateX(0);
}
.lp_wrap .good .icon3 {
    position: absolute;
    top: 91.05%;
    left: 50.4%;
    width: 23.067%;
}
.lp_wrap .good .icon3.trigger {
    transition: 0.6s;
    transform: scale(0);
}
.lp_wrap .good .icon3.trigger.move {
    transform: scale(1);
}
/* -------------------------------------------- */
.lp_wrap .wash .let {
    position: absolute;
    top: 43.35%;
    left: 13.8%;
    width: 72%;
    animation: 2s wash_let ease-in-out infinite;
}
@keyframes wash_let {
    0%, 60%, 100% {
        transform: translateX(0%);
    }
    10% {
        transform: translateX(-8%);
    }
    20% {
        transform: translateX(8%);
    }
    30% {
        transform: translateX(-8%);
    }
    40% {
        transform: translateX(4%);
    }
    50% {
        transform: translateX(-2%);
    }
}
.lp_wrap .wash .head {
    position: absolute;
    top: 38.2%;
    left: 13.6%;
    width: 71.867%;
}
.lp_wrap .wash .head.trigger {
    transition: 0.8s;
    clip-path: inset(0% 100% 0% 0%);
}
.lp_wrap .wash .head.trigger.move {
    clip-path: inset(0%);
}
.lp_wrap .wash .slider_wrap {
    position: absolute;
    top: 59%;
    left: 2.7%;
    width: 94.6%;
}
.lp_wrap .wash .slider_wrap img {
    width: 97.7%;
    margin: auto;
}
.lp_wrap .wash .slider_wrap .slick-slide {
    position: relative;
}
.lp_wrap .wash .slider_wrap .movie {
    position: absolute;
    top: 27.4%;
    left: 2.1%;
    width: 95.8%;
    z-index: -1;
    aspect-ratio: 16 / 9;
}
.lp_wrap .wash .slider_wrap .movie iframe {
    width: 100%;
    height: 100%
}
.lp_wrap .wash .slider_wrap .slick-arrow {
    position: absolute;
    top: 28.5%;
    width: 11.544%;
    z-index: 1;
}
.lp_wrap .wash .slider_wrap .slick-arrow.prev {
    left: 2%;
}
.lp_wrap .wash .slider_wrap .slick-arrow.next {
    right: 1.8%;
}
.lp_wrap .wash .slider_wrap .slider .slick-dots {
    top: -40.6%;
    height: 38.4%;
}
.lp_wrap .wash .slider_wrap .slider .slick-dots li {
    width: 23.962%;
    height: 100%;
    margin: 0;
    background: url("../image/wash-dots1.png") center center/contain no-repeat;
}
.lp_wrap .wash .slider_wrap .slider .slick-dots li:nth-of-type(2) {
    background: url("../image/wash-dots3.png") center center/contain no-repeat;
}
.lp_wrap .wash .slider_wrap .slider .slick-dots li:nth-of-type(3) {
    background: url("../image/wash-dots4.png") center center/contain no-repeat;
}
/* .lp_wrap .wash .slider_wrap .slider .slick-dots li:nth-of-type(4) {
    background: url("../image/wash-dots4.png") center center/contain no-repeat;
} */
/* -------------------------------------------- */
.lp_wrap .proof .num li {
    position: absolute;
    transform: scale(0);
}
.lp_wrap .proof .num li:nth-of-type(1) {
    top: 8%;
    left: 31.5%;
    width: 6.6666%;
    transition: 0.6s cubic-bezier(0.25, 0.1, 0.45, 1.48);
}
.lp_wrap .proof .num li:nth-of-type(2) {
    top: 12.91%;
    left: 10.4%;
    width: 15.2%;
    transition: 0.6s cubic-bezier(0.25, 0.1, 0.45, 1.48) 0.3s;
}
.lp_wrap .proof .num li.trigger.move,
.lp_wrap .proof .num li.trigger.move ~li {
    transform: scale(1);
}
.lp_wrap .proof .head li {
    position: absolute;
}
.lp_wrap .proof .head li:nth-child(1) {
    top: 9.08%;
    left: 65.3%;
    width: 19.333%;
    transition: 0.6s;
    clip-path: inset(0% 100% 0% 0%);
}
.lp_wrap .proof .head li:nth-child(2) {
    top: 13.7%;
    left: 52%;
    width: 32.667%;
    transition: 0.6s 0.2s;
    clip-path: inset(0% 100% 0% 0%);
}
.lp_wrap .proof .head li:nth-child(3) {
    top: 9.75%;
    left: 67.6%;
    width: 14.533%;
    transition: 0.6s 0.4s;
    clip-path: inset(0% 100% 0% 0%);
}
.lp_wrap .proof .head li:nth-child(4) {
    top: 14.33%;
    left: 54.4%;
    width: 28.133%;
    transition: 0.6s 0.6s;
    clip-path: inset(0% 100% 0% 0%);
}
.lp_wrap .proof .head li.trigger.move,
.lp_wrap .proof .head li.trigger.move ~ li {
    clip-path: inset(0%);
}
.lp_wrap .proof .graph1 li {
    position: absolute;
}
.lp_wrap .proof .graph1 li:nth-child(1) {
    top: 38.05%;
    left: 20.4%;
    width: 68.8%;
    transition: 0.8s;
    clip-path: inset(0% 100% 0% 0%);
}
.lp_wrap .proof .graph1 li:nth-child(2) {
    top: 28.87%;
    left: 61.2%;
    width: 26.933%;
    transition: 0.6s 0.4s;
    transform-origin: left bottom;
    transform: scale(0);
}
.lp_wrap .proof .graph1 li.trigger.move,
.lp_wrap .proof .graph1 li.trigger.move ~ li {
    clip-path: inset(0%);
    transform: scale(1);
}
.lp_wrap .proof .graph2 li {
    position: absolute;
}
.lp_wrap .proof .graph2 li:nth-child(1) {
    top: 59.1%;
    left: 20.4%;
    width: 59.3333%;
    transition: 0.8s;
    clip-path: inset(0% 100% 0% 0%);
}
.lp_wrap .proof .graph2 li:nth-child(2) {
    top: 49.94%;
    left: 61.2%;
    width: 26.933%;
    transition: 0.6s 0.4s;
    transform-origin: left bottom;
    transform: scale(0);
}
.lp_wrap .proof .graph2 li.trigger.move,
.lp_wrap .proof .graph2 li.trigger.move ~ li {
    clip-path: inset(0%);
    transform: scale(1);
}
.lp_wrap .proof .safe {
    position: absolute;
    top: 71.85%;
    left: 12.5%;
    width: 34.93333%;
}
.lp_wrap .proof .water {
    position: absolute;
    top: 71.85%;
    left: 52.5%;
    width: 34.93333%;
}
.lp_wrap .proof .after {
    position: absolute;
    top: 84.6%;
    left: 37.8%;
    width: 54.8%;
}
.lp_wrap .proof .after.trigger {
    transition: 0.8s;
    transform: translateX(120%);
}
.lp_wrap .proof .after.trigger.move {
    transform: translateX(0%);
}
.lp_wrap .proof .before {
    position: absolute;
    top: 91.7%;
    left: 8.7%;
    width: 57.6%;
}
.lp_wrap .proof .text {
    position: absolute;
    top: 86.28%;
    left: 7.9%;
    width: 38.9333%;
}
/* -------------------------------------------- */
.lp_wrap .try .icon {
    position: absolute;
    top: 2.85%;
    left: 3.8%;
    width: 48.267%;
}
.lp_wrap .try .icon.trigger.move {
    animation: 1s haneru ease-in-out;
}
.lp_wrap .try .icon.trigger img {
    transition: 0.8s;
    transform: translateY(15%);
    opacity: 0;
}
.lp_wrap .try .icon.trigger.move img {
    transform: translateY(0);
    opacity: 1;
}
.lp_wrap .try .movie {
    position: absolute;
    top: 34%;
    left: 6%;
    width: 88%;
    clip-path: inset(0 0.8% 0 0.5%);
    aspect-ratio: 16 / 9;
}
.lp_wrap .try .movie iframe {
    width: 100%;
    height: 100%;
}
.lp_wrap .try .fk li {
    position: absolute;
}
.lp_wrap .try .fk li:nth-child(1) {
    top: 49.2%;
    left: 10.1%;
    width: 73.333%;
    transition: 0.8s;
    clip-path: circle(0%);
}
.lp_wrap .try .fk li:nth-child(2) {
    top: 47.8%;
    left: 2.6%;
    width: 71.733%;
}
.lp_wrap .try .fk li:nth-child(3) {
    top: 49.86%;
    left: 56.7%;
    width: 39.067%;
    transition: 0.8s 0.4s;
    transform: translateX(110%);
}
.lp_wrap .try .fk li.trigger.move:nth-child(1) {
    clip-path: circle(50%);
}
.lp_wrap .try .fk li.trigger.move ~ li:nth-child(3) {
    transform: translateX(0%);
}
.lp_wrap .try .line {
    position: absolute;
    top: 68.28%;
    left: 49.7%;
    width: 0.4%;
}
.lp_wrap .try .no li {
    position: absolute;
}
.lp_wrap .try .no li:nth-child(1) {
    top: 71.92%;
    left: 9.8%;
    width: 80%;
}
.lp_wrap .try .no li:nth-child(2) {
    top: 69.66%;
    left: 2.8%;
    width: 24%;
    transition: 0.6s cubic-bezier(0.25, 0.1, 0.45, 1.48) 0.4s;
    transform: scale(0);
}
.lp_wrap .try .no li.trigger:nth-child(1) img {
    transition: 0.8s;
    transform: translateY(-15%);
    opacity: 0;
}
.lp_wrap .try .no li.trigger.move img,
.lp_wrap .try .no li.trigger.move ~ li {
    transform: scale(1) translateY(0%);
    opacity: 1;
}
/* -------------------------------------------- */
.lp_wrap .free .head {
    position: absolute;
    top: 1.7%;
    left: 5.2%;
    width: 25.2%;
}
.lp_wrap .free .head.trigger img {
    transition: 0.6s;
    transform: translateY(-15%);
    opacity: 0;
}
.lp_wrap .free .head.trigger.move img {
    transform: translateY(0%);
    opacity: 1;
}
.lp_wrap .free .icon li {
    position: absolute;
}
.lp_wrap .free .icon li:nth-child(1) {
    top: 45%;
    left: 0;
    width: 24%;
}
.lp_wrap .free .icon li:nth-child(2) {
    top: 51.55%;
    left: 18%;
    width: 26.667%;
}
.lp_wrap .free .icon li:nth-child(3) {
    top: 45%;
    left: 36.7%;
    width: 26.667%;
}
.lp_wrap .free .icon li:nth-child(4) {
    top: 51.55%;
    left: 56.4%;
    width: 26.667%;
}
.lp_wrap .free .icon li:nth-child(5) {
    top: 44.95%;
    right: 0;
    width: 24%;
}
.lp_wrap .free .icon li.trigger.move:nth-child(1) {
    animation: 1s haneru ease-in-out;
}
.lp_wrap .free .icon li.trigger.move ~ li:nth-child(2) {
    animation: 1s haneru 0.2s ease-in-out;
}
.lp_wrap .free .icon li.trigger.move ~ li:nth-child(3) {
    animation: 1s haneru 0.4s ease-in-out;
}
.lp_wrap .free .icon li.trigger.move ~ li:nth-child(4) {
    animation: 1s haneru 0.6s ease-in-out;
}
.lp_wrap .free .icon li.trigger.move ~ li:nth-child(5) {
    animation: 1s haneru 0.8s ease-in-out;
}
.lp_wrap .free .icon li.trigger:nth-child(1) img {
    transition: 0.8s;
}
.lp_wrap .free .icon li.trigger ~ li:nth-child(2) img {
    transition: 0.8s 0.2s;
}
.lp_wrap .free .icon li.trigger ~ li:nth-child(3) img {
    transition: 0.8s 0.4s;
}
.lp_wrap .free .icon li.trigger ~ li:nth-child(4) img {
    transition: 0.8s 0.6s;
}
.lp_wrap .free .icon li.trigger ~ li:nth-child(5) img {
    transition: 0.8s 0.8s;
}
.lp_wrap .free .icon li.trigger img,
.lp_wrap .free .icon li.trigger ~ li img {
    transform: translateY(15%);
    opacity: 0;
}
.lp_wrap .free .icon li.trigger.move img,
.lp_wrap .free .icon li.trigger.move ~ li img {
    transform: translateY(0%);
    opacity: 1;
}
.lp_wrap .free .fk {
    position: absolute;
    top: 76.35%;
    left: 29.95%;
    width: 66.667%;
}
.lp_wrap .free .fk.trigger {
    transition: 0.8s;
    transform: translateX(110%);
}
.lp_wrap .free .fk.trigger.move {
    transform: translateX(0%);
}
/* -------------------------------------------- */
.lp_wrap .recipe .btn {
    cursor: pointer;
}
.lp_wrap .recipe .btn1 {
    position: absolute;
    top: 38.35%;
    left: 55.6%;
    width: 34.6666%;
}
.lp_wrap .recipe .btn2 {
    position: absolute;
    top: 63.35%;
    left: 10.3%;
    width: 34.6666%;
}
.lp_wrap .recipe .btn3 {
    position: absolute;
    top: 88.34%;
    left: 55.6%;
    width: 34.6666%;
}
.lp_wrap .recipe .color1 {
    position: absolute;
    top: 21.7%;
    right: 5.3%;
    width: 89.3%;
    height: 23.3%;
    background: #ffe250;
    transition: 0.8s;
}
.lp_wrap .recipe .color1.trigger.move {
    width: 0%;
}
.lp_wrap .recipe .color2 {
    position: absolute;
    top: 46.7%;
    left: 5.3%;
    width: 89.3%;
    height: 23.3%;
    background: #5eb04e;
    transition: 0.8s;
}
.lp_wrap .recipe .color2.trigger.move {
    width: 0%;
}
.lp_wrap .recipe .color3 {
    position: absolute;
    top: 71.7%;
    right: 5.3%;
    width: 89.3%;
    height: 23.3%;
    background: #01bad9;
    transition: 0.8s;
}
.lp_wrap .recipe .color3.trigger.move {
    width: 0%;
}
/* -------------------------------------------- */
.lp_wrap .htu .movie1 {
    position: absolute;
    top: 19.5%;
    left: 9.334%;
    width: 81.333%;
    aspect-ratio: 16 / 9;
}
.lp_wrap .htu .movie1 iframe {
    width: 100%;
    height: 100%;
}
.lp_wrap .htu .movie2 {
    position: absolute;
    top: 43.83%;
    left: 9.334%;
    width: 81.333%;
    aspect-ratio: 16 / 9;
}
.lp_wrap .htu .movie2 iframe {
    width: 100%;
    height: 100%;
}
.lp_wrap .htu .movie3 {
    position: absolute;
    top: 68.15%;
    left: 9.334%;
    width: 81.333%;
    aspect-ratio: 16 / 9;
}
.lp_wrap .htu .movie3 iframe {
    width: 100%;
    height: 100%;
}
.lp_wrap .htu .hand {
    position: absolute;
    top: 87.05%;
    left: 61.5%;
    width: 43.2%;
}
.lp_wrap .htu .hand.trigger img {
    transition: 0.6s;
    transform-origin: right bottom;
    transform: rotateZ(60deg);
}
.lp_wrap .htu .hand.trigger.move img {
    transform: rotateZ(0deg);
}
/* -------------------------------------------- */
.lp_wrap .story .head li {
    position: absolute;
}
.lp_wrap .story .head li:nth-child(1) {
    top: 18.3%;
    left: 38.6%;
    width: 23.2%;
    transition: 0.6s;
}
.lp_wrap .story .head li:nth-child(2) {
    top: 21.45%;
    left: 10.5%;
    width: 78.9333%;
    transition: 0.6s 0.2s;
}
.lp_wrap .story .head li.trigger,
.lp_wrap .story .head li.trigger ~ li {
    clip-path: inset(0% 100% 0% 0%);
}
.lp_wrap .story .head li.trigger.move,
.lp_wrap .story .head li.trigger.move ~ li {
    clip-path: inset(0%);
}
.lp_wrap .story .yell {
    position: absolute;
    top: 56.33%;
    left: 8.934%;
    width: 82.133%;
    transform-origin: center bottom;
    animation: 1.6s story_yell steps(2) infinite;
}
@keyframes story_yell {
    from {
        transform: rotateZ(-5deg);
    }
    to {
        transform: rotateZ(5deg);
    }
}
.lp_wrap .story .deco {
    position: absolute;
    top: 59.6%;
    left: 0%;
    width: 100%;
}
.lp_wrap .story .center li {
    position: absolute;
    top: 78.05%;
    width: 48.667%;
}
.lp_wrap .story .center li:nth-child(1) {
    left: 0;
    transition: 0.8s;
    transform: translateX(-110%);
}
.lp_wrap .story .center li:nth-child(2) {
    right: 0;
    transition: 0.8s;
    transform: translateX(110%);
}
.lp_wrap .story .center li.trigger.move,
.lp_wrap .story .center li.trigger.move ~ li {
    transform: translateX(0%);
}
/* -------------------------------------------- */
.lp_wrap .last .head {
    position: absolute;
    top: 4.15%;
    left: 6.3%;
    width: 37.733%;
}
.lp_wrap .last .head.trigger img {
    transition: 0.6s;
    transform: translateY(-20%);
    opacity: 0;
}
.lp_wrap .last .head.trigger.move img {
    transform: translateY(00%);
    opacity: 1;
}
.lp_wrap .last .goods li {
    position: absolute;
}
.lp_wrap .last .goods li:nth-child(1) {
    top: 69.3%;
    left: 5.3%;
    width: 20.667%;
}
.lp_wrap .last .goods li:nth-child(1) img {
    transition: 0.8s;
}
.lp_wrap .last .goods li:nth-child(2) {
    top: 86%;
    left: 40.3%;
    width: 51.333%;
    transition: 0.6s;
    transform: translateX(120%);
}
.lp_wrap .last .goods li.trigger.move:nth-child(1) {
    animation: 1s haneru ease-in-out;
}
.lp_wrap .last .goods li.trigger:nth-child(1) img {
    transform: translateY(15%);
    opacity: 0;
}
.lp_wrap .last .goods li.trigger.move:nth-child(1) img {
    transform: translateY(0);
    opacity: 1;
}
.lp_wrap .last .goods li.trigger.move,
.lp_wrap .last .goods li.trigger.move ~ li {
    transform: translateX(0%);
}
/* -------------------------------------------- */
.lp_wrap .purpose .goods {
    position: absolute;
    top: 42.95%;
    left: 75.7%;
    width: 21.8666%;
}
.lp_wrap .purpose .goods.trigger img {
    transition: 0.6s;
    opacity: 0;
    transform: translateY(20%);
}
.lp_wrap .purpose .goods.trigger.move img {
    opacity: 1;
    transform: translateY(0);
}
/* -------------------------------------------- */
.lp_wrap .faq {
    background: #f2e4d1;
}
.lp_wrap .faq .head {
    margin: 0 auto 5%;
    padding-top: 10%;
    width: 33.6%;
}
.lp_wrap .faq dl {
    padding: 0% 4% 10%;
}
.lp_wrap .faq dl dt {
    position: relative;
    cursor: pointer;
    z-index: 1;
}
.lp_wrap .faq dl dt.open::before {
    height: 37%;
    content: "";
    display: block;
    width: 100%;
    position: absolute;
    bottom: 0%;
    z-index: -1;
    transition: 0.3s;
}
.lp_wrap .faq dl dt::after {
    content: "";
    display: block;
    position: absolute;
    top: 0%;
    right: 4%;
    width: 3.623%;
    height: 100%;
    background: url("../image/faq-close.png") center center/contain no-repeat;
    transition: 0.6s;
    transform: rotate(-45deg);
}
.lp_wrap .faq dl dt.open::after {
    transform: rotate(0deg);
}
.lp_wrap .faq dl dt:nth-of-type(n + 2) {
    margin-top: 4%;
}
.lp_wrap .faq dl dd {
    display: none;
    position: relative;
    padding: 0 4.3%;
}
.lp_wrap .faq dl dd .line a {
    position: absolute;
    top: 39%;
    left: 13.8%;
    width: 50.5%;
    height: 5.9%;
    cursor: pointer;
}
.lp_wrap .faq dl dd .tel a {
    position: absolute;
    top: 62%;
    left: 13.8%;
    width: 20.2%;
    height: 5.4%;
    cursor: pointer;
}
.lp_wrap .faq dl dd .form a {
    position: absolute;
    top: 85.5%;
    left: 13.8%;
    width: 54.5%;
    height: 6.6%;
    cursor: pointer;
}