/*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 */