#preloadingPage {
  position: fixed;
  z-index: 10000;
  left: 0;
  top: 0;
  width: 100%;
  height: -webkit-fill-available;
  height: -moz-available;
  height: fill-available;
  color: #ccc;
  background-color: #fff;
  display: flex;
  justify-content: center;
  align-items: center;
}
@media all and (min-width: 520px) and (orientation: landscape), all and (min-width: 640px) {
  #preloadingPage {
    height: 100vh;
  }
}
@media all and (max-width: 519.9px) and (orientation: portrait), all and (max-width: 639.9px) {
  #preloadingPage {
    height: 100%;
  }
}
#preloadingPage .text {
  text-transform: uppercase;
  animation: preloadingTextAni 2s linear 0s infinite;
}
@media all and (min-width: 520px) and (orientation: landscape), all and (min-width: 640px) {
  #preloadingPage .text {
    font-size: 2.0833333333vw;
    line-height: 3.125vw;
  }
}
@media all and (max-width: 519.9px) and (orientation: portrait), all and (max-width: 639.9px) {
  #preloadingPage .text {
    font-size: 8.8888888889vw;
    line-height: 17.7777777778vw;
  }
}

#kvSec .loadingScene {
  position: absolute;
  overflow: hidden;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  z-index: 400;
}
#kvSec .loadingScene .sprite {
  position: absolute;
}
#kvSec .loadingScene .p {
  overflow: hidden;
  left: 0;
  right: 0;
  height: 0;
  padding-bottom: 33.33%;
  bottom: 0;
  opacity: 1;
  background-size: 100% 800%;
  background-image: url(../img/loading-spr.png);
  mix-blend-mode: multiply;
  transition: opacity 0.01s cubic-bezier(0.25, 1, 0.5, 1), -webkit-clip-path 2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: opacity 0.01s cubic-bezier(0.25, 1, 0.5, 1), clip-path 2s cubic-bezier(0.25, 1, 0.5, 1);
  transition: opacity 0.01s cubic-bezier(0.25, 1, 0.5, 1), clip-path 2s cubic-bezier(0.25, 1, 0.5, 1), -webkit-clip-path 2s cubic-bezier(0.25, 1, 0.5, 1);
}
#kvSec .loadingScene .p::before, #kvSec .loadingScene .p::after {
  display: block;
  position: absolute;
  top: 0;
  content: "";
  width: 70%;
  height: 100%;
  transition: left 3s cubic-bezier(0.25, 1, 0.5, 1), right 3s cubic-bezier(0.25, 1, 0.5, 1);
}
#kvSec .loadingScene .p::before {
  left: 0%;
  background: linear-gradient(270deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.25) 5%, rgb(255, 255, 255) 28.5714285714%);
}
#kvSec .loadingScene .p::after {
  right: 0%;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.25) 5%, rgb(255, 255, 255) 28.5714285714%);
}
#kvSec .loadingScene .p1 {
  background-position: 0 0;
}
#kvSec .loadingScene .p2 {
  background-position: 0 14.2857142857%;
}
#kvSec .loadingScene .p3 {
  background-position: 0 28.5714285714%;
}
#kvSec .loadingScene .p4 {
  background-position: 0 42.8571428571%;
}
#kvSec .loadingScene .p5 {
  background-position: 0 57.1428571429%;
}
#kvSec .loadingScene .p6 {
  background-position: 0 71.4285714286%;
}
#kvSec .loadingScene .p7 {
  background-position: 0 85.7142857143%;
}
#kvSec .loadingScene .p8 {
  background-position: 0 100%;
}
@media all and (max-width: 519.9px) and (orientation: portrait), all and (max-width: 639.9px) {
  #kvSec .loadingScene .p1 {
    bottom: 4.4444444444vw;
  }
  #kvSec .loadingScene .p2 {
    bottom: 6.6666666667vw;
  }
  #kvSec .loadingScene .p3 {
    bottom: 8.8888888889vw;
  }
  #kvSec .loadingScene .p4 {
    bottom: 11.1111111111vw;
  }
  #kvSec .loadingScene .p5 {
    bottom: 13.3333333333vw;
  }
  #kvSec .loadingScene .p6 {
    bottom: 15.5555555556vw;
  }
  #kvSec .loadingScene .p7 {
    bottom: 17.7777777778vw;
  }
  #kvSec .loadingScene .p8 {
    bottom: 20vw;
  }
}
#kvSec .loadingScene.-p1 .p1::before, #kvSec .loadingScene.-p1 .p2::before, #kvSec .loadingScene.-p1 .p3::before {
  left: -70%;
}
#kvSec .loadingScene.-p1 .p1::after, #kvSec .loadingScene.-p1 .p2::after, #kvSec .loadingScene.-p1 .p3::after {
  right: -70%;
}
#kvSec .loadingScene.-p2 .p6::before, #kvSec .loadingScene.-p2 .p8::before {
  left: -70%;
}
#kvSec .loadingScene.-p2 .p6::after, #kvSec .loadingScene.-p2 .p8::after {
  right: -70%;
}
#kvSec .loadingScene.-p3 .p4::before, #kvSec .loadingScene.-p3 .p5::before, #kvSec .loadingScene.-p3 .p7::before {
  left: -70%;
}
#kvSec .loadingScene.-p3 .p4::after, #kvSec .loadingScene.-p3 .p5::after, #kvSec .loadingScene.-p3 .p7::after {
  right: -70%;
}
#kvSec .loadingScene .sprite1 {
  left: 50%;
  opacity: 0;
}
@media all and (min-width: 520px) and (orientation: landscape), all and (min-width: 640px) {
  #kvSec .loadingScene .sprite1 {
    top: 43.7037037037%;
    margin-left: -4.5833333333vw;
  }
}
@media all and (max-width: 519.9px) and (orientation: portrait), all and (max-width: 639.9px) {
  #kvSec .loadingScene .sprite1 {
    top: 58.8888888889vw;
    margin-left: -18.3333333333vw;
  }
}
#kvSec .loadingScene .sprite2 {
  width: 100%;
  height: 100%;
}
#kvSec .loadingScene .sprite11 {
  background: #C9A063;
  border-radius: 10000px;
  opacity: 0;
}
@media all and (min-width: 520px) and (orientation: landscape), all and (min-width: 640px) {
  #kvSec .loadingScene .sprite11 {
    left: 2.2916666667vw;
    top: 0vw;
    width: 4.5833333333vw;
    height: 4.5833333333vw;
  }
}
@media all and (max-width: 519.9px) and (orientation: portrait), all and (max-width: 639.9px) {
  #kvSec .loadingScene .sprite11 {
    left: 9.1666666667vw;
    top: 0vw;
    width: 18.3333333333vw;
    height: 18.3333333333vw;
  }
}
#kvSec .loadingScene .sprite12 {
  border-radius: 10000px;
  opacity: 0;
}
@media all and (min-width: 520px) and (orientation: landscape), all and (min-width: 640px) {
  #kvSec .loadingScene .sprite12 {
    left: 2.2916666667vw;
    top: 2.4479166667vw;
    width: 4.5833333333vw;
    height: 4.5833333333vw;
    border: 0.2604166667vw solid #C9A063;
  }
}
@media all and (max-width: 519.9px) and (orientation: portrait), all and (max-width: 639.9px) {
  #kvSec .loadingScene .sprite12 {
    left: 9.1666666667vw;
    top: 9.7916666667vw;
    width: 18.3333333333vw;
    height: 18.3333333333vw;
    border: 1.0416666667vw solid #C9A063;
  }
}
#kvSec .loadingScene .sprite13 {
  background: #C9A063;
  opacity: 0;
}
@media all and (min-width: 520px) and (orientation: landscape), all and (min-width: 640px) {
  #kvSec .loadingScene .sprite13 {
    top: 2.2916666667vw;
    height: 0.2083333333vw;
    width: 9.1666666667vw;
  }
}
@media all and (max-width: 519.9px) and (orientation: portrait), all and (max-width: 639.9px) {
  #kvSec .loadingScene .sprite13 {
    top: 9.1666666667vw;
    height: 0.8333333333vw;
    width: 36.6666666667vw;
  }
}
#kvSec .loadingScene .sprite21 {
  transform-origin: 0% 50%;
  transform: scaleY(0);
}
@media all and (min-width: 520px) and (orientation: landscape), all and (min-width: 640px) {
  #kvSec .loadingScene .sprite21 {
    left: 7.1354166667%;
    top: 21.6666666667%;
    height: 8.8888888889%;
    border-left: 0.15625vw solid #C9A063;
  }
}
@media all and (max-width: 519.9px) and (orientation: portrait), all and (max-width: 639.9px) {
  #kvSec .loadingScene .sprite21 {
    left: 8.8888888889vw;
    top: 26.6666666667vw;
    height: 26.6666666667vw;
    border-left: 0.8333333333vw solid #C9A063;
  }
}
#kvSec .loadingScene .sprite22 {
  transform-origin: 0% 50%;
  transform: scaleY(0);
}
@media all and (min-width: 520px) and (orientation: landscape), all and (min-width: 640px) {
  #kvSec .loadingScene .sprite22 {
    left: 8.75%;
    top: 15.2777777778%;
    height: 6.1111111111%;
    border-left: 0.1041666667vw solid #C9A063;
  }
}
@media all and (max-width: 519.9px) and (orientation: portrait), all and (max-width: 639.9px) {
  #kvSec .loadingScene .sprite22 {
    left: 13.3333333333vw;
    top: 8.8888888889vw;
    height: 17.7777777778vw;
    border-left: 0.5555555556vw solid #C9A063;
  }
}
#kvSec .loadingScene .sprite23 {
  background: #C9A063;
  border-radius: 10000px;
  opacity: 0;
}
@media all and (min-width: 520px) and (orientation: landscape), all and (min-width: 640px) {
  #kvSec .loadingScene .sprite23 {
    left: 10.3125%;
    top: 22.2222222222%;
    width: 1.1458333333vw;
    height: 1.1458333333vw;
  }
}
@media all and (max-width: 519.9px) and (orientation: portrait), all and (max-width: 639.9px) {
  #kvSec .loadingScene .sprite23 {
    left: 17.7777777778vw;
    top: 28.8888888889vw;
    width: 5.5555555556vw;
    height: 5.5555555556vw;
  }
}
#kvSec .loadingScene .sprite24 {
  transform-origin: 0% 50%;
  transform: scaleY(0);
}
@media all and (min-width: 520px) and (orientation: landscape), all and (min-width: 640px) {
  #kvSec .loadingScene .sprite24 {
    right: 6.6666666667%;
    bottom: 23.3333333333%;
    height: 14.0740740741%;
    border-left: 0.15625vw solid #C9A063;
  }
}
@media all and (max-width: 519.9px) and (orientation: portrait), all and (max-width: 639.9px) {
  #kvSec .loadingScene .sprite24 {
    right: 8.8888888889vw;
    bottom: 26.6666666667vw;
    height: 35.5555555556vw;
    border-left: 0.8333333333vw solid #C9A063;
  }
}
#kvSec .loadingScene .sprite25 {
  background: #C9A063;
  border-radius: 10000px;
  opacity: 0;
}
@media all and (min-width: 520px) and (orientation: landscape), all and (min-width: 640px) {
  #kvSec .loadingScene .sprite25 {
    right: 9.1666666667%;
    bottom: 16.7592592593%;
    width: 2.2395833333vw;
    height: 2.2395833333vw;
  }
}
@media all and (max-width: 519.9px) and (orientation: portrait), all and (max-width: 639.9px) {
  #kvSec .loadingScene .sprite25 {
    right: 15.5555555556vw;
    bottom: 17.7777777778vw;
    width: 8.8888888889vw;
    height: 8.8888888889vw;
  }
}
#kvSec .loadingScene .sprite3 {
  left: 50%;
  opacity: 0;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center center;
}
@media all and (min-width: 520px) and (orientation: landscape), all and (min-width: 640px) {
  #kvSec .loadingScene .sprite3 {
    top: calc(43.1481481481% - 0.46875vw);
    margin-left: -3.125vw;
    width: 6.25vw;
    height: 6.25vw;
  }
}
@media all and (max-width: 519.9px) and (orientation: portrait), all and (max-width: 639.9px) {
  #kvSec .loadingScene .sprite3 {
    top: 54.7222222222vw;
    margin-left: -13.3333333333vw;
    width: 26.6666666667vw;
    height: 26.6666666667vw;
  }
}
@media all and (max-width: 519.9px) and (orientation: portrait) and (min-aspect-ratio: 320/499) {
  #kvSec .loadingScene .sprite3 {
    top: 56.9444444444vw;
    margin-left: -11.1111111111vw;
    width: 22.2222222222vw;
    height: 22.2222222222vw;
  }
}
#kvSec .loadingScene .sprite3 img {
  width: 100%;
  height: auto;
}
#kvSec .loadingScene .skip {
  position: absolute;
  left: 50%;
  right: 0;
  bottom: 0;
  opacity: 0;
  text-align: center;
  letter-spacing: 0.1em;
  color: rgba(125, 125, 125, 0.75);
  text-transform: uppercase;
  cursor: pointer;
  transform: translateY(100%) translateX(-50%);
  transition: opacity 1s, transform 0s cubic-bezier(0.25, 1, 0.5, 1) 1s;
}
@media all and (min-width: 520px) and (orientation: landscape), all and (min-width: 640px) {
  #kvSec .loadingScene .skip {
    font-size: 2.0833333333vw;
    line-height: 4.1666666667vw;
  }
}
@media all and (max-width: 519.9px) and (orientation: portrait), all and (max-width: 639.9px) {
  #kvSec .loadingScene .skip {
    font-size: 5.5555555556vw;
    line-height: 17.7777777778vw;
  }
}
#kvSec .loadingScene .skip.-active {
  opacity: 1;
  transform: translateY(0) translateX(-50%);
  transition: opacity 0s, transform 1s cubic-bezier(0.25, 1, 0.5, 1);
}