@charset "utf-8";

/* ----------------------------------------------------------

	Animation CSS

---------------------------------------------------------- */

.fadeInUp {
  opacity : 0;
  transform: translateY(100px);
  transition: 2s;
}

.fadeInUp1 {
  opacity : 0;
  transform: translateY(200px);
  transition: 2s;
}
.fadeInUp2 {
  opacity : 0;
  transform: translateY(200px);
  transition: 2.5s;
}
.fadeInUp3 {
  opacity : 0;
  transform: translateY(200px);
  transition: 3s;
}

.fadeInDown {
  opacity : 0;
  transform: translateY(-100px);
  transition: 2s;
}

.fadeInFromRight {
  opacity : 0;
  transform: translateX(1500px);
  transition: 2s;
}

.fadeInFromLeft {
  opacity : 0;
  transform: translateX(-1500px);
  transition: 2s;
}

.fadeIn {
  animation: kfFadeIn 1s ease 2ms 1 normal;
}

@keyframes kfFadeIn {
  0% { opacity: 0 }
  100% { opacity: 1 }
}

@media screen and (max-width: 768px) {

  /* アニメーションを無効に */
  .fadeInUp1 { opacity : 1; transform: none; }
  .fadeInUp2 { opacity : 1; transform: none; }
  .fadeInUp3 { opacity : 1; transform: none; }
}