@charset "UTF-8";

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

基本スタイル

----------------------------------------------- */
* {
    margin: 0;
    padding: 0;
    outline: none;
}
.lp_wrap {
    max-width: 750px;
    margin: auto;
    overflow: hidden;
}
.lp_wrap * {
    font-size: 10px;
    font-weight: normal;
    line-height: 1em;
}
.lp_wrap ul,
.lp_wrap ol,
.lp_wrap dl {
    list-style: none;
}
.lp_wrap img,
.lp_wrap video {
    width: 100%;
    height: auto;
    vertical-align: top;
}
.lp_wrap > section {
    position: relative;
}
.lp_wrap .slider {
    display: none;
    cursor: grab;
}
.lp_wrap .slider:active {
    cursor: grabbing;
}
.lp_wrap .slider.slick-initialized {
    display: block;
}

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

offer

----------------------------------------------- */
.lp_wrap .offer .btn {
    position: absolute;
    top: 75.5%;
    left: 4.666%;
    width: 90.666%;
    animation: 1s offer_btn ease-in-out alternate infinite;
}
@keyframes offer_btn {
    from {
        transform: translateX(-5px);
    }
    to {
        transform: translateX(5px);
    }
}

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

各コンテンツ

----------------------------------------------- */
.lp_wrap .float {
    position: fixed;
    bottom: 0%;
    width: 100%;
    max-width: 750px;
    z-index: 10;
    display: none;
}
.lp_wrap .float .btn {
    position: absolute;
    top: 8%;
    left: 41.2%;
    width: 57.733%;
}
/* -------------------------------------------- */
.lp_wrap .loosen .catch {
    position: absolute;
    top: 4%;
    left: 1.5%;
    width: 27.066%;
}
.lp_wrap .loosen .catch.trigger {
    transition: 1s;
    opacity: 0;
}
.lp_wrap .loosen .catch.trigger.move {
    opacity: 1;
}
.lp_wrap .loosen .foam {
    position: absolute;
    top: 32%;
    left: 27.133%;
    width: 45.733%;
}
.lp_wrap .loosen .foam.trigger {
    transition: 1s ease-out;
    transform-origin: center 30%;
    transform: scale(0);
    opacity: 0;
}
.lp_wrap .loosen .foam.trigger.move {
    transform: scale(1);
    opacity: 1;
}
.lp_wrap .loosen .clean {
    position: absolute;
    top: 48%;
    left: 10%;
    width: 80%;
}
.lp_wrap .loosen .cause {
    position: absolute;
    top: 63%;
    left: 6.133%;
    width: 87.733%;
}
.lp_wrap .loosen .cause.trigger {
    transition: 1s;
    opacity: 0;
}
.lp_wrap .loosen .cause.trigger.move {
    opacity: 1;
}
.lp_wrap .loosen .icon {
    position: absolute;
    top: 65.7%;
    left: 13.4%;
    width: 73.2%;
}
.lp_wrap .loosen .icon.trigger {
    transition: 1s;
    opacity: 0;
}
.lp_wrap .loosen .icon.trigger.move {
    opacity: 1;
}
.lp_wrap .loosen .head {
    position: absolute;
    top: 75.8%;
    left: 12.5%;
    width: 84.133%;
}
.lp_wrap .loosen .head.trigger {
    transition: 1s;
    opacity: 0;
}
.lp_wrap .loosen .head.trigger.move {
    opacity: 1;
}
.lp_wrap .loosen .image {
    position: absolute;
    top: 80.5%;
    left: 4.266%;
    width: 91.466%;
}
.lp_wrap .loosen .image.trigger {
    transition: 1s;
    opacity: 0;
}
.lp_wrap .loosen .image.trigger.move {
    opacity: 1;
}
/* -------------------------------------------- */
.lp_wrap .ranking .medal li {
    position: absolute;
}
.lp_wrap .ranking .medal li.trigger,
.lp_wrap .ranking .medal li.trigger ~ li {
    transition: 1s;
    opacity: 0;
}
.lp_wrap .ranking .medal li:nth-child(1) {
    top: 14.7%;
    left: 0%;
    width: 54.666%;
}
.lp_wrap .ranking .medal li:nth-child(2) {
    top: 28.8%;
    left: 5%;
    width: 47.866%;
}
.lp_wrap .ranking .medal li:nth-child(3) {
    top: 28.6%;
    left: 55.5%;
    width: 39.066%;
}
.lp_wrap .ranking .medal li.trigger.move,
.lp_wrap .ranking .medal li.trigger.move ~ li {
    opacity: 1;
}
.lp_wrap .ranking .head1 {
    position: absolute;
    top: 41.8%;
    left: 37.866%;
    width: 24.266%;
}
.lp_wrap .ranking .head1.trigger {
    transition: 1s;
    opacity: 0;
}
.lp_wrap .ranking .head1.trigger.move {
    opacity: 1;
}
.lp_wrap .ranking .head2 {
    position: absolute;
    top: 45.5%;
    left: 12.2%;
    width: 75.6%;
}
.lp_wrap .ranking .head2.trigger {
    transition: 1s;
    opacity: 0;
}
.lp_wrap .ranking .head2.trigger.move {
    opacity: 1;
}
.lp_wrap .ranking .head3 {
    position: absolute;
    top: 50.8%;
    left: 4.333%;
    width: 91.333%;
}
.lp_wrap .ranking .head3.trigger {
    transition: 1s;
    opacity: 0;
}
.lp_wrap .ranking .head3.trigger.move {
    opacity: 1;
}
.lp_wrap .ranking .head4 {
    position: absolute;
    top: 64.7%;
    left: 8.6%;
    width: 82.8%;
}
.lp_wrap .ranking .head4.trigger {
    transition: 1s;
    opacity: 0;
}
.lp_wrap .ranking .head4.trigger.move {
    opacity: 1;
}
.lp_wrap .ranking .classy {
    position: absolute;
    top: 73%;
    left: 7%;
    width: 37.6%;
}
.lp_wrap .ranking .classy.trigger {
    transition: 1s;
    transform: translateX(-120%);
}
.lp_wrap .ranking .classy.trigger.move {
    transform: translateX(0%);
}
.lp_wrap .ranking .magazine {
    position: absolute;
    top: 71%;
    left: 49%;
    width: 45.6%;
}
.lp_wrap .ranking .classy.trigger ~ .magazine {
    transition: 1s;
    transform: translateX(120%);
}
.lp_wrap .ranking .classy.trigger.move ~ .magazine {
    transform: translateX(0%);
}
.lp_wrap .ranking .other {
    position: absolute;
    top: 91.2%;
    left: 9.666%;
    width: 80.666%;
}
.lp_wrap .ranking .classy.trigger ~ .other {
    transition: 1s;
    opacity: 0;
}
.lp_wrap .ranking .classy.trigger.move ~ .other {
    opacity: 1;
}
/* -------------------------------------------- */
.lp_wrap .realstore .photo li {
    position: absolute;
}
.lp_wrap .realstore .photo li.trigger,
.lp_wrap .realstore .photo li.trigger ~ li {
    opacity: 0;
}
.lp_wrap .realstore .photo li:nth-child(1) {
    top: 23%;
    left: 12.533%;
    z-index: 4;
    width: 74.933%;
    transition: 1s;
}
.lp_wrap .realstore .photo li:nth-child(2) {
    top: 43.8%;
    left: 30%;
    z-index: 3;
    width: 66.4%;
    transition: 1s 0.4s;
}
.lp_wrap .realstore .photo li:nth-child(3) {
    top: 56.1%;
    left: 5%;
    z-index: 2;
    width: 58.266%;
    transition: 1s 0.8s;
}
.lp_wrap .realstore .photo li:nth-child(4) {
    top: 69%;
    left: 48.9%;
    z-index: 1;
    width: 44.4%;
    transition: 1s 1.2s;
}
.lp_wrap .realstore .photo li:nth-child(5) {
    top: 77.6%;
    left: 13.5%;
    width: 40.533%;
    transition: 1s 1.6s;
}
.lp_wrap .realstore .photo li.trigger.move,
.lp_wrap .realstore .photo li.trigger.move ~ li {
    opacity: 1;
}
/* -------------------------------------------- */
.lp_wrap .j_jun .head {
    position: absolute;
    top: 2.5%;
    left: 26%;
    z-index: 1;
    width: 36.666%;
}
.lp_wrap .j_jun .photo1 {
    position: absolute;
    top: 6%;
    left: 0%;
    width: 80%;
}
.lp_wrap .j_jun .photo1.trigger {
    transition: 1s;
    transform: translateX(-100%);
}
.lp_wrap .j_jun .photo1.trigger.move {
    transform: translateX(0%);
}
.lp_wrap .j_jun .name {
    position: absolute;
    top: 2%;
    left: 80%;
    width: 16.133%;
}
.lp_wrap .j_jun .photo1.trigger ~ .name {
    transition: 1s;
    transform: translateX(130%);
}
.lp_wrap .j_jun .photo1.trigger.move ~ .name {
    transform: translateX(0%);
}
.lp_wrap .j_jun .let {
    position: absolute;
    top: 30.2%;
    left: 29%;
    width: 67.2%;
}
.lp_wrap .j_jun .photo1.trigger ~ .let {
    transition: 1s 0.2s;
    transform: translateX(110%);
}
.lp_wrap .j_jun .photo1.trigger.move ~ .let {
    transform: translateX(0%);
}
.lp_wrap .j_jun .movie {
    position: absolute;
    top: 49.3%;
    left: 4%;
    width: 92%;
}
.lp_wrap .j_jun .photo2 {
    position: absolute;
    top: 77.5%;
    right: 0%;
    z-index: 1;
    width: 59.066%;
}
.lp_wrap .j_jun .photo2.trigger {
    transition: 1s;
    transform: translateX(100%);
}
.lp_wrap .j_jun .photo2.trigger.move {
    transform: translateX(0%);
}
.lp_wrap .j_jun .foam {
    position: absolute;
    top: 75%;
    left: 0%;
    width: 85.866%;
}
.lp_wrap .j_jun .photo2.trigger ~ .foam {
    transition: 1.5s;
    opacity: 0;
}
.lp_wrap .j_jun .photo2.trigger.move ~ .foam {
    opacity: 1;
}
.lp_wrap .j_jun .goods {
    position: absolute;
    top: 77%;
    left: 10%;
    z-index: 1;
    width: 35.733%;
}
.lp_wrap .j_jun .photo2.trigger ~ .goods {
    transition: 1s;
    transform: translateX(-130%);
}
.lp_wrap .j_jun .photo2.trigger.move ~ .goods {
    transform: translateX(0%);
}
/* -------------------------------------------- */
.lp_wrap .instagram .movie:nth-of-type(1) {
    position: absolute;
    top: 20.3%;
    left: 49.1%;
    width: 44.133%;
}
.lp_wrap .instagram .movie:nth-of-type(2) {
    position: absolute;
    top: 67.1%;
    left: 7.9%;
    width: 44.133%;
}
/* -------------------------------------------- */
.lp_wrap .voice .review dt {
    position: absolute;
    width: 47.333%;
}
.lp_wrap .voice .review dd {
    position: absolute;
    width: 41.466%;
}
.lp_wrap .voice .review1 dd.trigger,
.lp_wrap .voice .review3 dd.trigger {
    transition: 1s;
    transform: translateX(120%);
}
.lp_wrap .voice .review2 dd.trigger {
    transition: 1s;
    transform: translateX(-120%);
}
.lp_wrap .voice .review dd.trigger.move {
    transform: translateX(0%);
}
.lp_wrap .voice .review1 dt {
    top: 8%;
    left: 3%;
}
.lp_wrap .voice .review1 dd {
    top: 9%;
    left: 54%;
}
.lp_wrap .voice .review2 dt {
    top: 38.5%;
    left: 51.6%;
}
.lp_wrap .voice .review2 dd {
    top: 39.8%;
    left: 6%;
}
.lp_wrap .voice .review3 dt {
    top: 69%;
    left: 3%;
}
.lp_wrap .voice .review3 dd {
    top: 70%;
    left: 54%;
}
/* -------------------------------------------- */
.lp_wrap .fact .in {
    position: absolute;
    top: 24.2%;
    left: 12.266%;
    width: 75.466%;
}
.lp_wrap .fact .in.trigger {
    transition: 1s;
    transform: scale(1.2);
    opacity: 0;
}
.lp_wrap .fact .in.trigger.move {
    transform: scale(1);
    opacity: 1;
}
.lp_wrap .fact .out {
    position: absolute;
    top: 24.8%;
    left: 12.2%;
    width: 75.6%;
}
.lp_wrap .fact .in.trigger ~ .out {
    transition: 1s 0.4s;
    transform: scale(0.8);
    opacity: 0;
}
.lp_wrap .fact .in.trigger.move ~ .out {
    transform: scale(1);
    opacity: 1;
}
.lp_wrap .fact .icon li {
    position: absolute;
    left: 7.333%;
    width: 85.333%;
}
.lp_wrap .fact .icon li.trigger {
    transition: 1s;
    opacity: 0;
}
.lp_wrap .fact .icon li:nth-child(1) {
    top: 49%;
}
.lp_wrap .fact .icon li:nth-child(2) {
    top: 56.5%;
}
.lp_wrap .fact .icon li.trigger.move {
    opacity: 1;
}
.lp_wrap .fact .mask {
    position: absolute;
    top: 69%;
    left: 0%;
    width: 48%;
}
.lp_wrap .fact .mask.trigger {
    transition: 1s;
    transform: translateX(-100%);
}
.lp_wrap .fact .mask.trigger.move {
    transform: translateX(0%);
}
.lp_wrap .fact .heating {
    position: absolute;
    top: 70%;
    right: 0%;
    width: 49.2%;
}
.lp_wrap .fact .mask.trigger ~ .heating {
    transition: 1s;
    transform: translateX(100%);
}
.lp_wrap .fact .mask.trigger.move ~ .heating {
    transform: translateX(0%);
}
/* -------------------------------------------- */
.lp_wrap .firststep .icon {
    position: absolute;
    top: 25%;
    left: 64%;
    width: 32.266%;
}
.lp_wrap .firststep .icon.trigger {
    transition: 0.6s cubic-bezier(0.54, 1.13, 0.74, 1.24);
    transform: scale(0);
    opacity: 0;
}
.lp_wrap .firststep .icon.trigger.move {
    transform: scale(1);
    opacity: 1;
}
.lp_wrap .firststep .arrow {
    position: absolute;
    top: 43%;
    left: 47%;
    width: 17.466%;
    overflow: hidden;
}
.lp_wrap .firststep .icon.trigger ~ .arrow img {
    transition: 1s 0.6s;
    transform: translateX(100%);
}
.lp_wrap .firststep .icon.trigger.move ~ .arrow img {
    transform: translateX(0%);
}
/* -------------------------------------------- */
.lp_wrap .choose .head {
    position: absolute;
    top: 4%;
    left: 4%;
    width: 67.733%;
    animation: 1s choose_head ease-in-out alternate infinite;
}
@keyframes choose_head {
    from {
        transform: scale(1);
    }
    to {
        transform: scale(1.05);
    }
}
/* -------------------------------------------- */
.lp_wrap .rule .list li {
    position: absolute;
    right: 0%;
    width: 49.333%;
}
.lp_wrap .rule .list li.trigger {
    transition: 1s;
    transform: translateX(100%);
}
.lp_wrap .rule .list li:nth-child(1) {
    top: 30%;
}
.lp_wrap .rule .list li:nth-child(2) {
    top: 52.2%;
}
.lp_wrap .rule .list li:nth-child(3) {
    top: 74.4%;
}
.lp_wrap .rule .list li.trigger.move {
    transform: translateX(0%);
}
/* -------------------------------------------- */
.lp_wrap .clensing .icon {
    position: absolute;
    top: 16%;
    left: 38.733%;
    width: 22.533%;
}
.lp_wrap .clensing .icon::before {
    content: "";
    display: block;
    position: absolute;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    background: url("https://k-cosme.jp/gold/prm/ten/a1/images/clensing-icon-back.png") center center/contain no-repeat;
    animation: 1.5s clensing_icon ease-in-out alternate infinite;
}
@keyframes clensing_icon {
    from {
        transform: scale(1);
    }
    to {
        transform: scale(1.2);
    }
}
.lp_wrap .clensing .icon img {
    position: relative;
}
.lp_wrap .clensing .gel {
    position: absolute;
    top: 35%;
    left: 1.8%;
    width: 96.4%;
}
.lp_wrap .clensing .gel.trigger {
    transition: 1s 3s;
    opacity: 0;
}
.lp_wrap .clensing .gel.trigger.move {
    opacity: 1;
}
.lp_wrap .clensing .foam {
    position: absolute;
    top: 34%;
    left: 1.8%;
    width: 96.4%;
}
.lp_wrap .clensing .gel.trigger ~ .foam {
    transform-origin: center 30%;
    transform: scale(0);
    opacity: 0;
}
.lp_wrap .clensing .gel.trigger.move ~ .foam {
    animation: 4s clensing_foam 0.3s ease-out forwards;
}
@keyframes clensing_foam {
    0% {
        transform: scale(0);
        opacity: 0;
    }
    70% {
        transform: scale(1);
        opacity: 1;
    }
    100% {
        transform: scale(0.98);
        opacity: 0;
    }
}
.lp_wrap .clensing .foam::after {
    content: "";
    display: block;
    position: absolute;
    top: 0%;
    left: 0%;
    width: 100%;
    height: 100%;
    background: url("https://k-cosme.jp/gold/prm/ten/a1/images/clensing-foam-warm.png") center center/contain no-repeat;
}
.lp_wrap .clensing .gel.trigger ~ .foam::after {
    transition: 2s 2s;
    opacity: 0;
}
.lp_wrap .clensing .gel.trigger.move ~ .foam::after {
    opacity: 1;
}
.lp_wrap .clensing .goods {
    position: absolute;
    top: 33%;
    left: 20.066%;
    width: 59.866%;
}
.lp_wrap .clensing .gel.trigger ~ .goods {
    transition: 1.5s;
    transform: translateY(-20px);
    opacity: 0;
}
.lp_wrap .clensing .gel.trigger.move ~ .goods {
    transform: translateY(0px);
    opacity: 1;
}
.lp_wrap .clensing .catch {
    position: absolute;
    top: 39%;
    left: 9%;
    width: 29.866%;
}
.lp_wrap .clensing .head {
    position: absolute;
    top: 39.5%;
    left: 75%;
    width: 13.866%;
}
.lp_wrap .clensing .gel.trigger ~ .head {
    transition: 1s 3s;
    transform: translateY(-20px);
    opacity: 0;
}
.lp_wrap .clensing .gel.trigger.move ~ .head {
    transform: translateY(0px);
    opacity: 1;
}
/* -------------------------------------------- */
.lp_wrap .feature .movie {
    position: absolute;
    top: 20%;
    left: -25%;
    z-index: -1;
    width: 150%;
}
/* -------------------------------------------- */
.lp_wrap .feature1 .head {
    position: absolute;
    top: -3.4%;
    left: 3%;
    width: 26.266%;
}
.lp_wrap .feature1 .head.trigger {
    transition: 1s;
    transform: translateX(-120%);
}
.lp_wrap .feature1 .head.trigger.move {
    transform: translateX(0%);
}
.lp_wrap .feature1 .image {
    position: absolute;
    top: -1%;
    left: 25%;
    width: 72.266%;
}
.lp_wrap .feature1 .head.trigger ~ .image {
    transition: 1s;
    transform: translateX(110%);
}
.lp_wrap .feature1 .head.trigger.move ~ .image {
    transform: translateX(0%);
}
/* -------------------------------------------- */
.lp_wrap .comparison {
    margin-top: -3.1%;
}
.lp_wrap .comparison .movie {
    position: absolute;
    top: 39%;
    left: 12.133%;
    width: 75.733%;
}
/* -------------------------------------------- */
.lp_wrap .feature2 {
    margin-top: -22%;
}
.lp_wrap .feature2 .head {
    position: absolute;
    top: 7%;
    left: 52.5%;
    width: 43.866%;
}
.lp_wrap .feature2 .head.trigger {
    transition: 1s;
    transform: translateX(110%);
}
.lp_wrap .feature2 .head.trigger.move {
    transform: translateX(0%);
}
.lp_wrap .feature2 .image {
    position: absolute;
    top: 16%;
    left: 7%;
    width: 38.933%;
}
.lp_wrap .feature2 .movie {
    position: absolute;
    top: 56%;
    left: 6.666%;
    width: 86.666%;
}
.lp_wrap .feature2 .head.trigger ~ .image {
    transition: 1s;
    transform: translateX(-120%);
}
.lp_wrap .feature2 .head.trigger.move ~ .image {
    transform: translateX(0%);
}
/* -------------------------------------------- */
.lp_wrap .feature3 {
    margin-top: -16.4%;
}
.lp_wrap .feature3 .head {
    position: absolute;
    top: 8%;
    left: 3%;
    width: 26.266%;
}
.lp_wrap .feature3 .head.trigger {
    transition: 1s;
    transform: translateX(-120%);
}
.lp_wrap .feature3 .head.trigger.move {
    transform: translateX(0%);
}
.lp_wrap .feature3 .image {
    position: absolute;
    top: -2%;
    right: 0%;
    width: 83.2%;
}
.lp_wrap .feature3 .head.trigger ~ .image {
    transition: 1s;
    transform: translateX(100%);
}
.lp_wrap .feature3 .head.trigger.move ~ .image {
    transform: translateX(0%);
}
/* -------------------------------------------- */
.lp_wrap .component .head {
    position: absolute;
    top: 5%;
    left: 22.533%;
    width: 54.933%;
}
.lp_wrap .component .head.trigger {
    transition: 1s;
    transform: translateY(-20px);
    opacity: 0;
}
.lp_wrap .component .head.trigger.move {
    transform: translateY(0px);
    opacity: 1;
}
.lp_wrap .component .head.trigger ~ .icon li:nth-child(1) {
    transition: 1s 0.4s;
    transform: translateX(-110%);
}
.lp_wrap .component .head.trigger ~ .icon li:nth-child(2) {
    transition: 1s 0.4s;
    transform: translateX(110%);
}
.lp_wrap .component .head.trigger.move ~ .icon li {
    transform: translateX(0%);
}
/* -------------------------------------------- */
.lp_wrap .comp_natural .graph {
    position: absolute;
    top: 49.75%;
    left: 24%;
    width: 23.6%;
}
.lp_wrap .comp_natural .graph.trigger {
    transition: 1.5s;
    clip-path: polygon(0% 100%, 100% 100%, 100% 100%, 0% 100%);
}
.lp_wrap .comp_natural .graph.trigger.move {
    clip-path: polygon(0% 0%, 100% 0%, 100% 100%, 0% 100%);
}
/* -------------------------------------------- */
.lp_wrap .comp_plant {
    margin-top: -4%;
}
.lp_wrap .comp_plant .list {
    position: absolute;
    top: 25.5%;
    left: 0%;
    width: 100%;
    height: 39.846%;
    background: url("https://k-cosme.jp/gold/prm/ten/a1/images/comp_plant-list.png") 0 0/cover repeat-x;
    animation: 30s comp_plant_list linear infinite;
}
@keyframes comp_plant_list {
    from {
        background-position: 0 0;
    }
    to {
        background-position: -281.866vw 0;
    }
}
@media screen and (min-width: 751px) {
    .lp_wrap .comp_plant .list {
        animation: 30s comp_plant_list_pc linear infinite;
    }
}
@keyframes comp_plant_list_pc {
    from {
        background-position: 0 0;
    }
    to {
        background-position: -2114px 0;
    }
}
/* -------------------------------------------- */
.lp_wrap .other .use li {
    position: absolute;
    left: 0%;
    width: 100%;
}
.lp_wrap .other .use li:nth-child(1) {
    top: 8%;
}
.lp_wrap .other .use li.trigger:nth-child(1) {
    transition: 1s;
    transform: translateX(100%);
}
.lp_wrap .other .use li.trigger.move:nth-child(1) {
    transition: 1s;
    transform: translateX(0%);
}
.lp_wrap .other .use li:nth-child(2) {
    top: 55%;
}
.lp_wrap .other .use li.trigger:nth-child(2) {
    transition: 1s;
    transform: translateX(-100%);
}
.lp_wrap .other .use li.trigger.move:nth-child(2) {
    transition: 1s;
    transform: translateX(0%);
}
/* -------------------------------------------- */
.lp_wrap .four_in_one .icon li {
    position: absolute;
    width: 29.466%;
}
.lp_wrap .four_in_one .icon li.trigger,
.lp_wrap .four_in_one .icon li.trigger ~ li {
    opacity: 0;
}
.lp_wrap .four_in_one .icon li:nth-child(1) {
    top: 52.5%;
    left: 63%;
    z-index: 1;
    transition: 1s;
}
.lp_wrap .four_in_one .icon li:nth-child(2) {
    top: 76.5%;
    left: 4%;
    z-index: 1;
    transition: 1s 0.4s;
}
.lp_wrap .four_in_one .icon li:nth-child(3) {
    top: 72%;
    left: 66%;
    z-index: 1;
    transition: 1s 0.8s;
}
.lp_wrap .four_in_one .icon li:nth-child(4) {
    top: 58.5%;
    left: 4%;
    transition: 1s 1.2s;
}
.lp_wrap .four_in_one .icon li:nth-child(5) {
    top: 84%;
    left: 39%;
    z-index: 1;
    transition: 1s 1.6s;
}
.lp_wrap .four_in_one .icon li.trigger.move,
.lp_wrap .four_in_one .icon li.trigger.move ~ li {
    opacity: 1;
}
.lp_wrap .four_in_one .woman {
    position: absolute;
    bottom: 0%;
    left: 0%;
    width: 100%;
}
/* -------------------------------------------- */
.lp_wrap .howtouse .movie {
    position: absolute;
    top: 10.9%;
    left: 4.666%;
    width: 90.666%;
}
.lp_wrap .howtouse .slider_wrap {
    position: absolute;
    top: 60%;
    left: 0%;
    width: 100%;
}
.lp_wrap .howtouse .slider_wrap .slider .slick-arrow {
    position: absolute;
    top: 44%;
    z-index: 1;
    width: 3.2%;
    cursor: pointer;
}
.lp_wrap .howtouse .slider_wrap .slider .slick-arrow.prev {
    left: 4%;
}
.lp_wrap .howtouse .slider_wrap .slider .slick-arrow.next {
    right: 4%;
}
.lp_wrap .howtouse .slider_wrap .slider .slick-list .slick-track .slick-slide img {
    width: 80%;
    margin: auto;
}
.lp_wrap .howtouse .slider_wrap .slider .slick-dots {
    bottom: 0%;
    top: 102%;
    height: 3%;
    display: flex;
    justify-content: center;
}
.lp_wrap .howtouse .slider_wrap .slider .slick-dots li {
    width: 2.5%;
    height: 100%;
    margin: 0% 1%;
    background-color: #e0c8b0;
    border-radius: 50%;
}
.lp_wrap .howtouse .slider_wrap .slider .slick-dots li.slick-active {
    background-color: #491504;
}
.lp_wrap .howtouse .slider_wrap .slider .slick-dots li * {
    display: none;
}
/* -------------------------------------------- */
.lp_wrap .origin .slider_wrap {
    position: absolute;
    top: 37%;
    left: 0%;
    width: 100%;
}
.lp_wrap .origin .slider_wrap .slider .slick-list .slick-track .slick-slide {
    opacity: 0.3;
    transition: 0.6s;
}
.lp_wrap .origin .slider_wrap .slider .slick-list .slick-track .slick-slide.slick-active {
    opacity: 1;
}
.lp_wrap .origin .slider_wrap .slider .slick-list .slick-track .slick-slide img {
    width: 92%;
    margin: auto;
}
.lp_wrap .origin .slider_wrap .slider .slick-dots {
    bottom: 0%;
    top: 107%;
    height: 3%;
    display: flex;
    justify-content: center;
}
.lp_wrap .origin .slider_wrap .slider .slick-dots li {
    width: 2.5%;
    height: 100%;
    margin: 0% 1%;
    background-color: #ffffff;
    border-radius: 50%;
}
.lp_wrap .origin .slider_wrap .slider .slick-dots li.slick-active {
    background-color: #619d45;
}
.lp_wrap .origin .slider_wrap .slider .slick-dots li * {
    display: none;
}
/* -------------------------------------------- */
.lp_wrap .faq .list {
    padding: 0% 4% 10%;
    background-color: #f4e5d0;
}
.lp_wrap .faq .list dt {
    position: relative;
}
.lp_wrap .faq .list dt:nth-of-type(n + 2) {
    margin-top: 3%;
}
.lp_wrap .faq .list dt::after {
    content: "";
    display: block;
    position: absolute;
    top: 50%;
    right: 2%;
    transform: translateY(-50%);
    width: 6.666%;
    height: 100%;
    background: url("https://k-cosme.jp/gold/prm/ten/a1/images/faq-arrow.png") center center/contain no-repeat;
    transition: 0.6s;
}
.lp_wrap .faq .list dt.open::after {
    transform: translateY(-50%) rotateZ(-180deg);
}
.lp_wrap .faq .list dd {
    display: none;
}