@charset "UTF-8";

/* ----------------------------------------------------------------
    CSSアニメーション
  ----------------------------------------------------------------- */
.fade-in-first {
  opacity: 0; /* 透明 */
  animation-delay: 0.5s;
  animation-duration: 1s; /* アニメーション時間 */
  animation-name: fadein; /* アニメーション名 */
  animation-fill-mode: forwards;
}
.fade-in {
  opacity: 0; /* 透明 */
}
.fade-in.active {
  animation-delay: 0.5s;
  animation-duration: 1s; /* アニメーション時間 */
  animation-name: fadein; /* アニメーション名 */
  animation-fill-mode: forwards;
}
@keyframes fadein {
  0% {
    opacity: 0; /* 透明 */
  }
  100% {
    opacity: 1; /* 透明 */
  }
}
@-webkit-keyframes fadein {
  0% {
    opacity: 0; /* 透明 */
  }
  100% {
    opacity: 1; /* 透明 */
  }
}
.fade-out {
  opacity: 1; /* 透明 */
}
.fade-out.active {
  animation-delay: 0.5s;
  animation-duration: 1s; /* アニメーション時間 */
  animation-name: fadeout; /* アニメーション名 */
  animation-fill-mode: forwards;
}
@keyframes fadeout {
  0% {
    opacity: 1; /* 透明 */
  }
  100% {
    opacity: 0; /* 透明 */
  }
}
@-webkit-keyframes fadeout {
  0% {
    opacity: 1; /* 透明 */
  }
  100% {
    opacity: 0; /* 透明 */
  }
}

.focus-in-first {
  opacity: 0; /* 透明 */
  -webkit-animation: focusin 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
  animation: focusin 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
  animation-fill-mode: forwards;
}
.focus-in {
  opacity: 0; /* 透明 */
}
.focus-in.active {
  -webkit-animation: focusin 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
  animation: focusin 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
  animation-fill-mode: forwards;
}
.intro .anime {
  opacity: 0; /* 透明 */
}
.intro .anime.active {
  -webkit-animation: focusin 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
  animation: focusin 1s cubic-bezier(0.550, 0.085, 0.680, 0.530) both;
  animation-fill-mode: forwards;
}
@-webkit-keyframes focusin {
  0% {
    -webkit-filter: blur(12px);
    filter: blur(12px);
    opacity: 0;
  }
  100% {
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}
@keyframes focusin {
  0% {
    -webkit-filter: blur(12px);
    filter: blur(12px);
    opacity: 0;
  }
  100% {
    -webkit-filter: blur(0px);
    filter: blur(0px);
    opacity: 1;
  }
}
/* IE対応 */
@media screen\0 {
  .fade-in {
    opacity: 1;
  }
  .slide-in-inr-first {
    visibility: visible;
  }
  .slide-in-inr {
    visibility: visible;
  }
  .focus-in {
    opacity: 1;
  }
  .focus-in-first {
    opacity: 1;
  }
  .intro .anime {
    opacity: 1;
  }
}