@charset "UTF-8";

.kv1-slide span,
.kv2-slide span,
.kv3-slide span {
    display: block;
    position: relative;
    opacity: 0;
}

.kv1-slide .__copy1 span {
    transform: scale(1.1);
}
.kv1-slide.__active .__copy1 span {
    transform: scale(1);
    opacity: 1;
    transition: all cubic-bezier(0.65, 0, 0.2, 1) .6s .3s;
}
.kv1-slide .__copy2 span {
    transform: scale(1.8);
}
.kv1-slide.__active .__copy2 span {
    transform: scale(1);
    opacity: 1;
    transition: all cubic-bezier(0.65, 0, 0.2, 1) 1s .8s;
}
.kv1-slide .__line span {
    width: 100%;
    opacity: 1;
    clip-path: polygon(0 0, 0 100%, 0 100%, 0 0);
}
.kv1-slide.__active .__line span {
    clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 0);
    transition: all cubic-bezier(0.65, 0, 0.2, 1) .6s 1.3s;
}
.kv1-slide .__name span {
    transform: scale(1.8);
}
.kv1-slide.__active .__name span {
    transform: scale(1);
    opacity: 1;
    transition: all cubic-bezier(.4,.05,.1,1) .6s 2s;
}
.kv1-slide .__text span {
}
.kv1-slide.__active .__text span {
    opacity: 1;
    transition: all ease 1s 2.5s;
}

.kv2-slide .__copy1 span {
    transform: scale(1.1);
}
.kv2-slide.__active .__copy1 span {
    transform: scale(1);
    opacity: 1;
    transition: all cubic-bezier(0.65, 0, 0.2, 1) .6s;
}
.kv2-slide .__copy2 span {
    transform: scale(1.8);
}
.kv2-slide.__active .__copy2 span {
    transform: scale(1);
    opacity: 1;
    transition: all cubic-bezier(0.65, 0, 0.2, 1) 1s .5s;
}
.kv2-slide .__line span {
    width: 100%;
    opacity: 1;
    clip-path: polygon(0 0, 0 100%, 0 100%, 0 0);
}
.kv2-slide.__active .__line span {
    clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 0);
    transition: all cubic-bezier(0.65, 0, 0.2, 1) .6s 1s;
}
.kv2-slide .__name span {
    transform: scale(1.8);
}
.kv2-slide.__active .__name span {
    transform: scale(1);
    opacity: 1;
    transition: all cubic-bezier(.4,.05,.1,1) .6s 1.7s;
}
.kv2-slide .__text span {
}
.kv2-slide.__active .__text span {
    opacity: 1;
    transition: all ease 1s 2.2s;
}

.kv3-slide .__copy1 span {
    transform: scale(1.8);
}
.kv3-slide.__active .__copy1 span {
    transform: scale(1);
    opacity: 1;
    transition: all cubic-bezier(0.65, 0, 0.2, 1) 1s;
}
.kv3-slide .__copy2 span {
    transform: scale(1.1);
}
.kv3-slide.__active .__copy2 span {
    transform: scale(1);
    opacity: 1;
    transition: all cubic-bezier(0.65, 0, 0.2, 1) .8s .9s;
}
.kv3-slide .__line span {
    width: 100%;
    opacity: 1;
    clip-path: polygon(0 0, 0 100%, 0 100%, 0 0);
}
.kv3-slide.__active .__line span {
    clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 0);
    transition: all cubic-bezier(0.65, 0, 0.2, 1) .6s .5s;
}
.kv3-slide .__name span {
    transform: scale(1.8);
}
.kv3-slide.__active .__name span {
    transform: scale(1);
    opacity: 1;
    transition: all cubic-bezier(.4,.05,.1,1) .6s 1.7s;
}
.kv3-slide .__text span {
}
.kv3-slide.__active .__text span {
    opacity: 1;
    transition: all ease 1s 2.2s;
}


.maincopy-video__title1 .scl-wrapper-elm {
    display: block;
    position: relative;
    transform: scale(1.5);
    opacity: 0;
}
.maincopy-video__title1 .scl-wrapper-elm.scl-anim-init {
    transform: scale(1);
    opacity: 1;
    transition: all cubic-bezier(0.65, 0, 0.2, 1) 1s;
}

.maincopy-video__title2 .scl-wrapper-elm {
    display: block;
    position: relative;
    transform: scale(1.8);
    opacity: 0;
}
.maincopy-video__title2 .scl-wrapper-elm.scl-anim-init {
    transform: scale(1);
    opacity: 1;
    transition: all cubic-bezier(0.65, 0, 0.2, 1) .8s .8s;
}

.maincopy-video__title-line.scl-wrapper-elm span {
    display: block;
    width: 100%;
    opacity: 1;
    clip-path: polygon(0 0, 100% 0, 100% 0, 0 0);
}
.maincopy-video__title-line.scl-wrapper-elm.scl-anim-init span {
    clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%);
    transition: all cubic-bezier(0.65, 0, 0.2, 1) .8s 1.2s;
}

.udon__copy-bg.scl-wrapper-elm span {
    display: block;
    width: 100%;
    opacity: 1;
    clip-path: polygon(0 0, 0 100%, 0 100%, 0 0);
}
.udon__copy-bg.scl-wrapper-elm.scl-anim-init span {
    clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 0);
    transition: all cubic-bezier(0.65, 0, 0.2, 1) .8s;
}

.udon__copy-text .scl-wrapper-elm {
    display: block;
    position: relative;
    transform: scale(1.5);
    opacity: 0;
}
.udon__copy-text .scl-wrapper-elm.scl-anim-init {
    transform: scale(1);
    opacity: 1;
    transition: all cubic-bezier(0.65, 0, 0.2, 1) .5s .5s;
}

.udon__body-name .scl-wrapper-elm {
    display: block;
    position: relative;
    transform: scale(1.8);
    opacity: 0;
}
.udon__body-name .scl-wrapper-elm.scl-anim-init {
    transform: scale(1);
    opacity: 1;
    transition: all cubic-bezier(0.65, 0, 0.2, 1) .8s;
}

.udon__body-price .scl-wrapper-elm {
    display: block;
    position: relative;
    transform: translateY(30px);
    opacity: 0;
}
.udon__body-price .scl-wrapper-elm.scl-anim-init {
    transform: translateY(0px);
    opacity: 1;
    transition: all ease 1.2s .3s;
}
.udon__body-btn.scl-wrapper-elm {
    display: block;
    position: relative;
    transform: translateY(30px);
    opacity: 0;
}
.udon__body-btn.scl-wrapper-elm.scl-anim-init {
    transform: translateY(0px);
    opacity: 1;
    transition: all ease 1.2s .5s;
}

.udon__detail-text.scl-wrapper-elm {
    display: block;
    position: relative;
    transform: translateY(50px);
    opacity: 0;
}
.udon__detail-text.scl-wrapper-elm.scl-anim-init {
    transform: translateY(0px);
    opacity: 1;
    transition: all ease 1.2s;
}
.udon__detail-img .scl-wrapper-elm span {
    display: block;
    width: 100%;
    opacity: 0;
    transform: translateX(50px);
    clip-path: polygon(0 0, 0 100%, 0 100%, 0 0);
}
.udon__detail-img .scl-wrapper-elm.scl-anim-init span {
    opacity: 1;
    transform: translateX(0);
    clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 0);
    transition: all cubic-bezier(0.65, 0, 0.2, 1) 1s .3s;
}


.kodawari-head-title.scl-wrapper-elm span {
    display: block;
    width: 100%;
    opacity: 0;
    transform: translateX(50px);
    clip-path: polygon(0 0, 0 100%, 0 100%, 0 0);
}
.kodawari-head-title.scl-wrapper-elm.scl-anim-init span {
    opacity: 1;
    transform: translateX(0);
    clip-path: polygon(0 0, 0 100%, 100% 100%, 100% 0);
    transition: all cubic-bezier(0.65, 0, 0.2, 1) .8s;
}
.kodawari-head-text.scl-wrapper-elm {
    display: block;
    position: relative;
    transform: scale(1.6);
    opacity: 0;
}
.kodawari-head-text.scl-wrapper-elm.scl-anim-init {
    transform: scale(1);
    opacity: 1;
    transition: all cubic-bezier(0.65, 0, 0.2, 1) .6s .5s;
}
.kodawari-head-img.scl-wrapper-elm {
    display: block;
    position: relative;
    transform: translateX(-30px);
    opacity: 0;
}
.kodawari-head-img.scl-wrapper-elm.scl-anim-init {
    transform: translateX(0px);
    opacity: 1;
    transition: all ease 1s .8s;
}

.kodawari-body-text1.scl-wrapper-elm {
    display: block;
    position: relative;
    transform: translateX(-30px);
    opacity: 0;
}
.kodawari-body-text1.scl-wrapper-elm.scl-anim-init {
    transform: translateX(0px);
    opacity: 1;
    transition: all ease 1s;
}
.kodawari-body-img1.scl-wrapper-elm {
    display: block;
    position: relative;
    transform: translateX(30px);
    opacity: 0;
}
.kodawari-body-img1.scl-wrapper-elm.scl-anim-init {
    transform: translateX(0px);
    opacity: 1;
    transition: all ease 1s .3s;
}

.kodawari-body-text2.scl-wrapper-elm {
    display: block;
    position: relative;
    transform: translateX(30px);
    opacity: 0;
}
.kodawari-body-text2.scl-wrapper-elm.scl-anim-init {
    transform: translateX(0px);
    opacity: 1;
    transition: all ease 1s;
}
.kodawari-body-img2.scl-wrapper-elm {
    display: block;
    position: relative;
    transform: translateX(-30px);
    opacity: 0;
}
.kodawari-body-img2.scl-wrapper-elm.scl-anim-init {
    transform: translateX(0px);
    opacity: 1;
    transition: all ease 1s .3s;
}

.sns-video-title.scl-wrapper-elm {
    display: block;
    position: relative;
    transform: translateY(20px);
    opacity: 0;
}
.sns-video-title.scl-wrapper-elm.scl-anim-init {
    transform: translateY(0px);
    opacity: 1;
    transition: all ease 1.2s;
}
.sns-video-item.scl-wrapper-elm > div {
    display: block;
    position: relative;
    transform: translateY(20px);
    opacity: 0;
}
.sns-video-item.scl-wrapper-elm.scl-anim-init > div {
    transform: translateY(0px);
    opacity: 1;
    transition: all ease 1s .3s;
}
.sns-video-comingsoon.scl-wrapper-elm > div {
    display: block;
    position: relative;
    transform: translateY(20px);
    opacity: 0;
}
.sns-video-comingsoon.scl-wrapper-elm.scl-anim-init > div {
    transform: translateY(0px);
    opacity: 1;
    transition: all ease 1s .3s;
}
.sns-video-kumo1.scl-wrapper-elm {
    display: block;
    position: relative;
    transform: translateX(30px);
    opacity: 0;
}
.sns-video-kumo1.scl-wrapper-elm.scl-anim-init {
    transform: translateX(0px);
    opacity: 1;
    transition: all ease .6s 1s;
}
.sns-video-kumo2.scl-wrapper-elm {
    display: block;
    position: relative;
    transform: translateX(-30px);
    opacity: 0;
}
.sns-video-kumo2.scl-wrapper-elm.scl-anim-init {
    transform: translateX(0px);
    opacity: 1;
    transition: all ease .6s 1.2s;
}


.mdl-kodawari__contents-qa .mdl-q-text {
    display: block;
    transform: rotate(-10deg) scale(1.2);
    opacity: 0;
}
.remodal-is-opened .mdl-kodawari__contents-qa .mdl-q-text {
    display: block;
    transform: rotate(0deg) scale(1);
    opacity: 1;
    transition: all cubic-bezier(0.65, 0, 0.2, 1) .8s;
}
.mdl-kodawari__contents-qa .mdl-a-img {
    display: block;
    transform: scale(1.1);
    opacity: 0;
}
.remodal-is-opened .mdl-kodawari__contents-qa .mdl-a-img {
    display: block;
    transform: scale(1);
    opacity: 1;
    transition: all ease .8s .8s;
}
.mdl-kodawari__contents-qa .mdl-a-text {
    display: block;
    transform: translateY(20px);
    opacity: 0;
}
.remodal-is-opened .mdl-kodawari__contents-qa .mdl-a-text {
    display: block;
    transform: translateY(0);
    opacity: 1;
    transition: all ease 1s 1s;
}
.mdl-kodawari__contents-qa .mdl-developer {
    display: block;
    transform: translateY(20px);
    opacity: 0;
}
.remodal-is-opened .mdl-kodawari__contents-qa .mdl-developer {
    display: block;
    transform: translateY(0);
    opacity: 1;
    transition: all ease 1s 1.1s;
}

.a-bounce {
    display: block;
    position: relative;
    transform: scale(.5);
    opacity: 0;
}
.a-bounce.scl-anim-init {
    transform: scale(1);
    opacity: 1;
    transition: all linear(0, 1.2, 0.87, 1.05, 0.98, 1.01, 1, 1) .9s;
}

.a-fade-slidein {
    display: block;
    position: relative;
    transform: translateY(20px);
    opacity: 0;
}
.a-fade-slidein.scl-anim-init {
    transform: translateY(0px);
    opacity: 1;
    transition: all ease 1s;
}

.a-fade-slidein2 {
    display: block;
    position: relative;
    transform: translateY(20px);
    opacity: .05;
}
.a-fade-slidein2.scl-anim-init {
    transform: translateY(0px);
    opacity: 1;
    transition: all ease .5s;
}

.a-fade-slidein3 {
    display: block;
    position: relative;
    transform: translateY(30px);
    opacity: 0;
}
.a-fade-slidein3.scl-anim-init {
    transform: translateY(0px);
    opacity: 1;
    transition: all ease 1s;
}

.a-fade-zoomin1 {
    display: block;
    position: relative;
    transform: scale(1.5);
    opacity: 0;
}
.a-fade-zoomin1.scl-anim-init {
    transform: scale(1);
    opacity: 1;
    transition: all cubic-bezier(0.65, 0, 0.2, 1) .8s;
}

.a-fade-zoomin2 {
    display: block;
    position: relative;
    transform: scale(1.5);
    opacity: 0;
}
.a-fade-zoomin2.scl-anim-init {
    transform: scale(1);
    opacity: 1;
    transition: all cubic-bezier(0.65, 0, 0.2, 1) .5s;
}

.a-fade-zoomin3 {
    display: block;
    position: relative;
    transform: scale(1.2);
    opacity: 0;
}
.a-fade-zoomin3.scl-anim-init {
    transform: scale(1);
    opacity: 1;
    transition: all cubic-bezier(0.65, 0, 0.2, 1) 1s;
}

.a-fade-zoomin4 {
    display: block;
    position: relative;
    transform: scale(1.5);
    opacity: 0;
}
.a-fade-zoomin4.scl-anim-init {
    transform: scale(1);
    opacity: 1;
    transition: all ease 1s;
}

