/**********************************
パララックス
**********************************/
.dt_2 {
  transition-delay: 0.2s !important;
  -webkit-transition-delay: 0.2s !important;
}

.dt_3 {
  transition-delay: 0.3s !important;
  -webkit-transition-delay: 0.3s !important;
}

.dt_4 {
  transition-delay: 0.4s !important;
  -webkit-transition-delay: 0.4s !important;
}

.dt_5 {
  transition-delay: 0.5s !important;
  -webkit-transition-delay: 0.5s !important;
}

.dt_6 {
  transition-delay: 0.6s !important;
  -webkit-transition-delay: 0.6s !important;
}

.dt_7 {
  transition-delay: 0.7s !important;
  -webkit-transition-delay: 0.7s !important;
}

.dt_8 {
  transition-delay: 0.8s !important;
  -webkit-transition-delay: 0.8s !important;
}

.dt_9 {
  transition-delay: 0.9s !important;
  -webkit-transition-delay: 0.9s !important;
}

.dt_10 {
  transition-delay: 1.0s !important;
  -webkit-transition-delay: 1.0s !important;
}

.dt_11 {
  transition-delay: 1.1s !important;
  -webkit-transition-delay: 1.1s !important;
}

.dt_12 {
  transition-delay: 1.2s !important;
  -webkit-transition-delay: 1.2s !important;
}

.dt_14 {
  transition-delay: 1.4s !important;
  -webkit-transition-delay: 1.4s !important;
}

.dt_15 {
  transition-delay: 1.5s !important;
  -webkit-transition-delay: 1.5s !important;
}

.dt_16 {
  transition-delay: 1.6s !important;
  -webkit-transition-delay: 1.6s !important;
}

.dt_18 {
  transition-delay: 1.8s !important;
}

.dt_20 {
  transition-delay: 2s !important;
}

.dt_22 {
  transition-delay: 2.2s !important;
}
.dt_23 {
  transition-delay: 2.3s !important;
}
.dt_24 {
  transition-delay: 2.4s !important;
}
.dt_25 {
  transition-delay: 2.5s !important;
}
.dt_26 {
  transition-delay: 2.6s !important;
}
.dt_27 {
  transition-delay: 2.7s !important;
}
.dt_28 {
  transition-delay: 2.8s !important;
}
.dt_29 {
  transition-delay: 2.9s !important;
}

.dt_30 {
  transition-delay: 3.0s !important;
}

.dt_32 {
  transition-delay: 3.2s !important;
}

.dt_34 {
  transition-delay: 3.4s !important;
}

.dt_36 {
  transition-delay: 3.6s !important;
}



/*from*/
.init {
  opacity: 0;
  transition-duration: 0.7s;
  transition-property: opacity, transform, filter;
  transition-timing-function: cubic-bezier(.17, .67, .58, 1);
}

/*to*/
.animated .init,
.opening.animated .init {
  opacity: 1;
}

.opening {
  overflow: hidden;
}

.animated .init {
  opacity: 1;
  filter: blur(0);
}

.init.move_up {
  transform: translate3d(0px, 30px, 0);
  transition-duration: 0.7s;
}

.animated .init.move_up {
  opacity: 1;
  transform: translate3d(0, 0, 0);
}

.init.move_right {
  transform: translate3d(-80px, 0px, 0);
}

.animated .init.move_right {
  opacity: 1;
  transition-duration: 1.5s;
  transform: translate3d(0, 0, 0);
}

.init.move_left {
  transform: translate3d(80px, 0px, 0);
}

.animated .init.move_left {
  opacity: 1;
  transition-duration: 1.5s;
  transform: translate3d(0, 0, 0);
}

.init.zoom {
  transform: translate3d(0, 0, 0) scale(0.8);
}

.animated .init.zoom {
  opacity: 1;
  transition-duration: 0.4s;
  transition-timing-function: cubic-bezier(.22, .77, .62, 1.5);
  transform: translate3d(0, 0, 0) scale(1);
}

.init.fade {
  opacity: 0;
}
.animated .init.fade {
  opacity: 1;
  transition-duration: 2s;
  transition-timing-function: cubic-bezier(0.600, 0.005, 0.400, 0.970);
}

.init.fade_3 {
  opacity: 0;
}
.animated .init.fade_3 {
  opacity: 1;
  transition-duration: 3s;
  transition-timing-function: cubic-bezier(0.600, 0.005, 0.400, 0.970);
}

.init.fade_5 {
  opacity: 0;
}

.animated .init.fade_5 {
  opacity: 1;
  transition-duration: 5s;
  transition-timing-function: cubic-bezier(0.600, 0.005, 0.400, 0.970);
}




.init.blur {
  opacity: 0;
  transition-timing-function: ease-in-out;
  filter: blur(20px);
  transform: translate(0px, 0px) scale(1.02, 1.02);
}

.animated .init.blur {
  transition-duration: 1s;
  opacity: 1;
  filter: blur(0);
  transform: scale(1, 1);
}

.init.skew {
  opacity: 0;
  transform-origin: 100% 100%;
  transform: rotateX(75deg);
  transition-duration: cubic-bezier(0.820, 0.080, 0.320, 0.910);
}

.opening.animated .init.skew,
.animated .init.skew {
  transform: rotateX(0);
  width: 100%;
  transition-duration: 1.2s;
  overflow: visible;
  opacity: 1;
}

.init.rotate {
  transform: scale(0.7) rotate(-10deg);
}

.animated .init.rotate {
  transform: translate(0, 0) scale(1, 1) rotate(0);
  transition-duration: 0.5s;
  transition-timing-function: ease-out, cubic-bezier(.2, .6, .4, 1);
}