/*reset*/
html, body {
    height: 100%;
    margin: 0;
}

picture {
    display: block;
}

/*base*/
html {
    -webkit-overflow-scrolling: touch;
}

/* CSS Document */
/*Base*/
.llw {
    max-width: 750px;
    width: 100%;
    background: #fff;
    margin: 0 auto;
    overflow: hidden;
}
.llw input {
    border-radius: 0;
    -webkit-box-sizing: content-box;
    -webkit-appearance: button;
    appearance: button;
    border: none;
    box-sizing: border-box;
    border: 1px solid transparent;
    transition: border 0.2s ease-out;
}
.llw input::-webkit-search-decoration {
    display: none;
}
.llw input:focus {
    outline-offset: -2px;
}
.llw input[type=image] {
    -webkit-appearance: none;
}
.llw img {
    display: block;
    vertical-align: bottom;
    width: 100%;
    height: auto;
}

.cta01__btn--01 {
    width: 93.46%;
    top: 60.6%;
    left: 4%;
    animation: scaleAnm01 1s infinite alternate ease-in-out;
}
@keyframes scaleAnm01 {
    0% {
        transform: scale(0.9);
    }
    100% {
        transform: scale(1);
    }
}

.overlayArea {
    position: relative;
}
.overlayItem {
    position: absolute;
}

.so-fade > * {
    transition: 0.8s all;
    opacity: 0;
}
.so-fade.js-observe > * {
    opacity: 1;
}
.so-topFade > * {
    transition: 0.8s all;
    opacity: 0;
    transform: translateY(-50px);
}
@media screen and (max-width: 750px) {
    .so-topFade > * {
        transform: translateY(-6.6666666667vw);
    }
}
.so-topFade.js-observe > * {
    opacity: 1;
    transform: translateY(0);
}
.so-botFade > * {
    transition: 0.8s all;
    opacity: 0;
    transform: translateY(50px);
}
@media screen and (max-width: 750px) {
    .so-botFade > * {
        transform: translateY(6.6666666667vw);
    }
}
.so-botFade.js-observe > * {
    opacity: 1;
    transform: translateY(0);
}

.lp01_01 {
    width: 100%;
}
.lp02_02_clip {
    position: absolute;
    width: 679px;
    height: 164px;
    top: 27.8%;
    left: 3.3%;
    overflow: hidden;
    clip-path: url(#lp02_02_clip);
}
@media screen and (max-width: 750px) {
    .lp02_02_clip {
        width: 90.5333333333vw;
        height: 21.8666666667vw;
    }
}
.lp02_02_clip::before {
    position: absolute;
    content: "";
    display: block;
    top: -150px;
    width: 50px;
    height: 100%;
    background-color: #fff;
    animation: reflection 3s ease-in-out infinite;
}
@media screen and (max-width: 750px) {
    .lp02_02_clip::before {
        top: -20vw;
        width: 6.6666666667vw;
    }
}
@keyframes reflection {
    0% {
        -webkit-transform: scale(0) rotate(45deg);
        opacity: 0;
    }
    70% {
        -webkit-transform: scale(0) rotate(45deg);
        opacity: 0.4;
    }
    71% {
        -webkit-transform: scale(4) rotate(45deg);
        opacity: 0.8;
    }
    100% {
        -webkit-transform: scale(50) rotate(45deg);
        opacity: 0;
    }
}
.lp02_02_clip_base {
    position: absolute;
    pointer-events: none;
    width: 100%;
    height: auto;
}
.lp02_02_clip_base clipPath {
    width: 100%;
    height: auto;
}
.lp02_03_elm_01 {
    width: 91.2%;
    top: 39.4%;
    left: 0;
    right: 0;
    margin: 0 auto;
}
.lp02_04_elm_01 {
    width: 90.7%;
    top: 25.3%;
    left: 0;
    right: 0;
    margin: 0 auto;
}
.lp02_05_gif {
    width: 66.4%;
    top: 37.1%;
    left: 16.8%;
}
.lp02_06_clip {
    position: absolute;
    width: 434px;
    height: 108px;
    top: 33.5%;
    left: 0;
    right: 0;
    margin: 0 auto;
    overflow: hidden;
    clip-path: url(#lp02_06_clip);
}
@media screen and (max-width: 750px) {
    .lp02_06_clip {
        width: 57.8666666667vw;
        height: 14.4vw;
    }
}
.lp02_06_clip::before {
    position: absolute;
    content: "";
    display: block;
    top: -150px;
    width: 50px;
    height: 100%;
    background-color: #fff;
    animation: reflection 3s ease-in-out infinite;
}
@media screen and (max-width: 750px) {
    .lp02_06_clip::before {
        top: -20vw;
        width: 6.6666666667vw;
    }
}
.lp02_06_clip_base {
    position: absolute;
    pointer-events: none;
    width: 100%;
    height: auto;
}
.lp02_06_clip_base clipPath {
    width: 100%;
    height: auto;
}
.lp02_07_gif {
    width: 90.2%;
    top: 1.74%;
    left: 0;
    right: 0;
    margin: 0 auto;
}
.lp02_08_elm_01 {
    width: 47.8%;
    top: 0.04%;
    left: 0;
    right: 0;
    margin: 0 auto;
    -webkit-transform: translateY(-10px);
    animation: topBot 1.5s infinite ease-in-out;
}
@keyframes topBot {
    0% {
        -webkit-transform: translateY(-10px);
    }
    50% {
        -webkit-transform: translateY(10px);
    }
    100% {
        -webkit-transform: translateY(-10px);
    }
}
@media screen and (max-width: 750px) {
    .lp02_08_elm_01 {
        -webkit-transform: translateY(-1.3333333333vw);
    }
    @keyframes topBot {
        0% {
            -webkit-transform: translateY(-1.3333333333vw);
        }
        50% {
            -webkit-transform: translateY(1.3333333333vw);
        }
        100% {
            -webkit-transform: translateY(-1.3333333333vw);
        }
    }
}
.lp02_08_elm_02 {
    width: 63.2%;
    top: 57.9%;
    left: 0;
    right: 0;
    margin: 0 auto;
    -webkit-transform: scale(1);
}
.js-observe .lp02_08_elm_02 > * {
    animation: scaleAnm03 0.8s ease-in-out 2s forwards;
}
@keyframes scaleAnm03 {
    0% {
        -webkit-transform: scale(1);
    }
    20% {
        -webkit-transform: scale(1.15);
    }
    70% {
        -webkit-transform: scale(0.9);
    }
    100% {
        -webkit-transform: scale(1);
    }
}
.lp02_08_border_01 > *, .lp02_08_border_02 > * {
    transform: scale(0, 1);
    transform-origin: left;
}
.js-observe .lp02_08_border_01 > *, .js-observe .lp02_08_border_02 > * {
    transform: scale(1, 1);
}
.lp02_08_border_0102, .lp02_08_border_0202 {
    width: 100%;
    height: 3px;
    background: #e51200;
}
@media screen and (max-width: 750px) {
    .lp02_08_border_0102, .lp02_08_border_0202 {
        height: 0.4vw;
    }
}
.lp02_08_border_01 {
    width: 51%;
    top: 39.2%;
    left: 20.4%;
}
.lp02_08_border_01 > * {
    transition: 1s all;
}
.lp02_08_border_02 {
    width: 52.2%;
    top: 53.2%;
    left: 11%;
}
.lp02_08_border_02 > * {
    transition: 1s all 1s;
}
.lp02_09_clip {
    position: absolute;
    width: 689px;
    height: 93px;
    top: 31.9%;
    left: 1.1%;
    right: 0;
    margin: 0 auto;
    overflow: hidden;
    clip-path: url(#lp02_09_clip);
}
@media screen and (max-width: 750px) {
    .lp02_09_clip {
        width: 91.8666666667vw;
        height: 12.4vw;
    }
}
.lp02_09_clip::before {
    position: absolute;
    content: "";
    display: block;
    top: -150px;
    width: 50px;
    height: 100%;
    background-color: #fff;
    animation: reflection 3s ease-in-out infinite;
}
@media screen and (max-width: 750px) {
    .lp02_09_clip::before {
        top: -20vw;
        width: 6.6666666667vw;
    }
}
.lp02_09_clip_base {
    position: absolute;
    pointer-events: none;
    width: 100%;
    height: auto;
}
.lp02_09_clip_base clipPath {
    width: 100%;
    height: auto;
}
.lp02_10_mp4 {
    width: 90.1%;
    top: 1.77%;
    left: 0;
    right: 0;
    margin: 0 auto;
}
.lp02_10_elm_01 {
    width: 38.5333333333%;
    bottom: 0%;
    left: 0;
}
.lp02_14_elm_01 {
    width: 96.9333333333%;
    left: 0.27%;
    top: 0.76%;
}
.lp02_16 {
    position: relative;
    z-index: 1;
}
.lp02_16_gif {
    width: 53.3333333333%;
    bottom: 7%;
    right: -5.3%;
    z-index: 2;
}
.lp03_01 {
    width: 100%;
    bottom: -2.22%;
    left: 0;
}
.lp03_01_mp4 {
    margin-top: -27%;
    width: 100%;
}
.lp03_03_elm_01 {
    width: 80.8%;
    top: 25.5%;
    left: 0;
}
.lp03_04_elm_01 {
    width: 73.1%;
    top: -5.7%;
    left: 14.1%;
}
.lp03_05_mp4 {
    width: 90.68%;
    top: 3%;
    left: 0;
    right: 0;
    margin: 0 auto;
}
.lp03_06_elm_01 {
    width: 0;
    top: 7.84%;
    left: 9.7%;
    overflow: hidden;
    transition: 0.8s all;
}
.lp03_06_elm_01 img {
    width: 537px;
}
@media screen and (max-width: 750px) {
    .lp03_06_elm_01 img {
        width: 71.6vw;
    }
}
.lp03_06_elm_01.js-observe {
    width: 71.6%;
}
.lp03_08_mp4 {
    width: 90.5%;
    top: 0.8%;
    left: 0;
    right: 0;
    margin: 0 auto;
}
.lp03_08_elm_01 {
    width: 20.1%;
    top: 53.16%;
    left: 0;
}
.lp03_08_elm_02 {
    width: 0;
    top: 72%;
    left: 4.5%;
    overflow: hidden;
    transition: 0.8s all;
}
.lp03_08_elm_02 img {
    width: 683px;
}
@media screen and (max-width: 750px) {
    .lp03_08_elm_02 img {
        width: 91.0666666667vw;
    }
}
.lp03_08_elm_02.js-observe {
    width: 91.1%;
}
.lp03_09_elm_01 {
    width: 45.9%;
    top: 29.76%;
    left: 26.1%;
}
.lp03_09_elm_02 {
    width: 83.37%;
    top: 49.25%;
    left: 9.7%;
}
.lp04_01_gif {
    width: 53.3333333333%;
    bottom: 19.6%;
    right: -9.4%;
}
.lp04_02_elm_01 {
    width: 100%;
    top: 15.3%;
    left: 0;
}
.lp04_02_elm_01 > *, .lp04_02_elm_03 > * {
    transition: 0.8s all;
    opacity: 0;
    transform: translateY(50px);
}
@media screen and (max-width: 750px) {
    .lp04_02_elm_01 > *, .lp04_02_elm_03 > * {
        transform: translateY(6.6666666667vw);
    }
}
.js-observe .lp04_02_elm_01 > *, .js-observe .lp04_02_elm_03 > * {
    opacity: 1;
    transform: translateY(0);
}
.lp04_02_elm_02 {
    width: 44.57%;
    top: 0.05%;
    left: 27.86%;
}
.lp04_02_elm_03 {
    width: 42.4%;
    top: 36.91%;
    left: 30%;
}
.lp04_04_elm_01 {
    width: 63.3%;
    top: 10.55%;
    left: 12.8%;
}
.lp04_05_elm_01 {
    width: 85.6%;
    top: 56.1%;
    left: 3.3%;
}
.lp04_07_elm_01 {
    width: 100%;
    top: 0.26%;
    left: 0;
}
.lp04_07_elm_02 {
    width: 100%;
    top: 49.11%;
    left: 0;
}
.lp04_08_elm_01 {
    width: 100%;
    top: 63.26%;
    left: 0;
}
.lp04_09_elm_01 {
    width: 46.56%;
    bottom: -4.73%;
    right: 0;
    z-index: 2;
}
.lp04_10_elm_01 {
    width: 100%;
    top: -0.82%;
    left: 0;
}
.lp04_10_elm_02 {
    width: 100%;
    top: 40.4%;
    left: 0;
}
.lp04_11_elm_01 {
    width: 36%;
    top: 35.8%;
    right: 1%;
}
.lp04_11_elm_01 > * {
    -webkit-transform: scale(0);
}
.lp04_11_elm_01.js-observe > * {
    animation: scaleAnm02 0.5s forwards ease-in-out;
}
@keyframes scaleAnm02 {
    0% {
        -webkit-transform: scale(0);
    }
    80% {
        -webkit-transform: scale(1.1);
    }
    100% {
        -webkit-transform: scale(1);
    }
}
.lp05_03_elm_01 {
    width: 72%;
    top: 1.5%;
    left: 14.4%;
}
.lp05_05_elm_01 {
    width: 81.2%;
    top: 1.2%;
    left: 9.06%;
}
.lp05_07_elm_01 {
    width: 69.1%;
    top: 2.05%;
    left: 15.3%;
}
.lp05_08_elm_01 {
    width: 0;
    top: 72.26%;
    left: 4.5%;
    overflow: hidden;
    transition: 0.8s all;
}
.lp05_08_elm_01 img {
    width: 682px;
}
@media screen and (max-width: 750px) {
    .lp05_08_elm_01 img {
        width: 90.9333333333vw;
    }
}
.lp05_08_elm_01.js-observe {
    width: 90.99%;
}
.lp05_08_clip {
    position: absolute;
    width: 676px;
    height: 114px;
    top: 58.9%;
    left: 0;
    right: 0;
    margin: 0 auto;
    overflow: hidden;
    clip-path: url(#lp05_08_clip);
}
@media screen and (max-width: 750px) {
    .lp05_08_clip {
        width: 90.1333333333vw;
        height: 15.2vw;
    }
}
.lp05_08_clip::before {
    position: absolute;
    content: "";
    display: block;
    top: -150px;
    width: 50px;
    height: 100%;
    background-color: #fff;
    animation: reflection 3s ease-in-out infinite;
}
@media screen and (max-width: 750px) {
    .lp05_08_clip::before {
        top: -20vw;
        width: 6.6666666667vw;
    }
}
.lp05_08_clip_base {
    position: absolute;
    pointer-events: none;
    width: 100%;
    height: auto;
}
.lp05_08_clip_base clipPath {
    width: 100%;
    height: auto;
}
.lp05_09_mp4 {
    width: 91%;
    top: 1.5%;
    left: 0;
    right: 0;
    margin: 0 auto;
    aspect-ratio: 17/10;
}
.lp05_09_elm_01 {
    width: 18.5%;
    top: 29.56%;
    right: 0;
}
.lp05_10_elm_01 {
    width: 100%;
    top: 37.8%;
    left: 0;
}
.lp05_10_elm_02 {
    width: 32.67%;
    top: 60.17%;
    left: 33.3%;
}
.lp06_01_elm_01 {
    width: 41.3%;
    top: 36.5%;
    right: 3.9%;
}
.lp06_02_elm_01 {
    width: 38.5%;
    top: 29.4%;
    left: 5.6%;
}
.lp06_03_elm_01 {
    width: 49.9%;
    top: 21.8%;
    right: 4%;
}
.lp06_04_elm_01 {
    width: 100%;
    top: 10.17%;
    left: 0;
}
.lp06_04_gif {
    width: 53.3333333333%;
    bottom: 16.9%;
    left: 29.3%;
}

.floating {
    position: relative;
    z-index: 10;
}
.floatingContainer {
    position: fixed;
    max-width: 750px;
    width: 100%;
    bottom: 0;
    left: 0;
    right: 0;
    margin: 0 auto;
    opacity: 0;
    transition: 0.3s all;
    z-index: 100;
    pointer-events: none;
}
.floatingContainer.js-floating {
    opacity: 1;
    pointer-events: auto;
}/*# sourceMappingURL=base.css.map */