@charset "utf-8";

/******************************************************************/
/**************************** 動くノイズ ****************************/
body::before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: url(../img/icon/bg6.png);
  animation: bg 8s steps(10) infinite;
  pointer-events: none;
  opacity: 0.8; /* 要調整 */
  z-index: -1;
  will-change: transform;
  transform: translateZ(0);
}

@keyframes bg {
  to {
    background-position: 0 0;
  }
  10% {
    background-position: -5% -10%;
  }
  20% {
    background-position: -15% 5%;
  }
  30% {
    background-position: 7% -25%;
  }
  40% {
    background-position: 20% 25%;
  }
  50% {
    background-position: -25% 10%;
  }
  60% {
    background-position: 15% 5%;
  }
  70% {
    background-position: 0 15%;
  }
  80% {
    background-position: 25% 35%;
  }
  90% {
    background-position: -10% 10%;
  }
}

/**************************** font ****************************/
/* 画像の遷移アニメーション */
@keyframes slideFromLeft {
  from {
    opacity: 0;
    transform: translateX(-30px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

/* 画像の遷移アニメーション(右から左) */
@keyframes slideFromRight {
  from {
    opacity: 0;
    transform: translateX(30px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}