@charset "utf-8";



/* ---- コンテンツ　スクロールアニメーション ----- */
.animation-scroll-item {
  opacity: 0;
}

.scroll-fadeup {
  animation-name: fadeUpAnime;
  animation-duration: 0.8s;
  animation-fill-mode: forwards;
  opacity: 0;
}

@keyframes fadeUpAnime {
  from {
    opacity: 0;
    transform: translateY(100px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.animation-scroll-item02 {
  opacity: 0;
}

.scroll-fadeup02 {
  animation-name: fadeUpAnime02;
  animation-duration: 1.5s;
  animation-fill-mode: forwards;
  opacity: 0;
}

@keyframes fadeUpAnime02 {
  from {
    opacity: 0;
    transform: translateY(0);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}


.animation-walk {
  animation-name: animation-walk;
  animation-duration: 10s;
  animation-iteration-count: infinite;
  animation-timing-function: ease;
}

@keyframes animation-walk {
  10% {
    transform: rotate(5deg);
  }

  20% {
    transform: rotate(-5deg);
  }

  30% {
    transform: rotate(5deg);
  }

  40% {
    transform: rotate(-5deg);
  }

  50% {
    transform: rotate(0deg);
  }

  60% {
    transform: rotate(-5deg);
  }

  70% {
    transform: rotate(0deg);
  }

  80% {
    transform: rotate(-5deg);
  }

  90% {
    transform: rotate(5deg);
  }

  100% {
    transform: rotate(0deg);
  }
}







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




}

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






}

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

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




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