
/*
 * page-top splash
 */
@keyframes splash-done {
  0% {
    z-index: 1002;
    background-position: 100%;
    opacity: 1;
  }

  40% {
    z-index: 1002;
    background-position: 40%;
    opacity: 1;
  }

  95% {
    z-index: 1002;
  }

  100% {
    z-index: -1;
    background-position: 0%;
    opacity: 0;
  }
}

@-webkit-keyframes splash-done {
  0% {
    z-index: 1002;
    background-position: 100%;
    opacity: 1;
  }

  40% {
    z-index: 1002;
    background-position: 40%;
    opacity: 1;
  }

  95% {
    z-index: 1002;
  }

  100% {
    z-index: -1;
    background-position: 0%;
    opacity: 0;
  }
}

.splash-bg.splash-done {
  -webkit-animation: splash-done 3000ms cubic-bezier(0.37, 0, 0.63, 1) forwards;
  animation: splash-done 3000ms cubic-bezier(0.37, 0, 0.63, 1) forwards;
}

.splash-bg {
  position: fixed;
  z-index: 1002;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  background: -o-linear-gradient(225deg, rgba(255, 255, 255, 1), rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
  background: linear-gradient(-135deg, rgba(255, 255, 255, 1), rgba(255, 255, 255, 1), rgba(255, 255, 255, 0));
  background-position: 100%;
  background-size: 500%;
}

.splash-bg #splash-logo {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 60%;
  max-width: 450px;
  height: 60%;
  max-height: 450px;
  opacity: 1;
  -webkit-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
  -webkit-transition-delay: 0.5s;
  -o-transition-delay: 0.5s;
  transition-delay: 0.5s;
  -webkit-transform: translate(-50%, -50%);
  -ms-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
}

.splash-bg #splash-logo.splash-done {
  opacity: 0;
}

/*
 * page-top
 */
.pic-header-date-sp {
  display: block;
}

.pic-header-date-pc,
.pic-header-firstview-pc {
  display: none;
}

.pic-header-logo.splash-done,
.pic-header-date-sp.splash-done,
.pic-header-firstview-sp.splash-done {
  opacity: 1;
}

.mainvis-slider {
  z-index: -1;
  overflow: hidden;
}

@keyframes animation-slider-item-horizonal {
  0% {
    -webkit-transform: translateX(-4%) scale(1.1);
    transform: translateX(-4%) scale(1.1);
  }

  100% {
    -webkit-transform: translateX(4%) scale(1.1);
    transform: translateX(4%) scale(1.1);
  }
}

@keyframes animation-slider-item-vertical {
  0% {
    -webkit-transform: translateY(-3%) scale(1.1);
    transform: translateY(-3%) scale(1.1);
  }

  100% {
    -webkit-transform: translateY(3%) scale(1.1);
    transform: translateY(3%) scale(1.1);
  }
}

@-webkit-keyframes animation-slider-item-horizonal {
  0% {
    -webkit-transform: translateX(-4%) scale(1.1);
    transform: translateX(-4%) scale(1.1);
  }

  100% {
    -webkit-transform: translateX(4%) scale(1.1);
    transform: translateX(4%) scale(1.1);
  }
}

@-webkit-keyframes animation-slider-item-vertical {
  0% {
    -webkit-transform: translateY(-3%) scale(1.1);
    transform: translateY(-3%) scale(1.1);
  }

  100% {
    -webkit-transform: translateY(3%) scale(1.1);
    transform: translateY(3%) scale(1.1);
  }
}

.mainvis-slider .slick-track,
.mainvis-slider .slick-list {
  height: 100%;
}

.mainvis-slider .slider__item {
  width: 100%;
  height: 100%;
  background: url(../img/index/index_mainvis_slider_image1_sp.jpg) 50% 50% no-repeat;
  background-size: cover;
  -webkit-transform: translateX(4%) scale(1.1);
  -ms-transform: translateX(4%) scale(1.1);
  transform: translateX(4%) scale(1.1);
}

.mainvis-slider .slider__item:nth-child(2n) {
  -webkit-transform: translateY(3%) scale(1.1);
  -ms-transform: translateY(3%) scale(1.1);
  transform: translateY(3%) scale(1.1);
}

.mainvis-slider .slider__item.slick-current {
  -webkit-animation: animation-slider-item-horizonal 5.8s cubic-bezier(0, 0, 0, 0.4) 0s 1 normal both;
  animation: animation-slider-item-horizonal 5.8s cubic-bezier(0, 0, 0, 0.4) 0s 1 normal both;
}

.mainvis-slider .slider__item.slick-current:nth-child(2n) {
  -webkit-animation: animation-slider-item-vertical 6s cubic-bezier(0, 0, 0, 0.4) 0s 1 normal both;
  animation: animation-slider-item-vertical 6s cubic-bezier(0, 0, 0, 0.4) 0s 1 normal both;
}

.mainvis-slider .slider__item:nth-of-type(2) {
  background-image: url(../img/index/index_mainvis_slider_image2_sp.jpg);
}

.mainvis-slider .slider__item:nth-of-type(3) {
  background-image: url(../img/index/index_mainvis_slider_image3_sp.jpg);
}

.mainvis-slider .slider__item:nth-of-type(4) {
  background-image: url(../img/index/index_mainvis_slider_image4_sp.jpg);
}

.mainvis-slider .slider__item:nth-of-type(5) {
  background-image: url(../img/index/index_mainvis_slider_image5_sp.jpg);
}

.mainvis-slider .slider__item:nth-of-type(6) {
  background-image: url(../img/index/index_mainvis_slider_image6_sp.jpg);
}

.mainvis-slider .slider__item:nth-of-type(7) {
  background-image: url(../img/index/index_mainvis_slider_image7_sp.jpg);
}
