/*アニメーションの@keyframes用のCSSコードを書く（ここに書くとAMP用で約500KBまで記入できます）*/
@keyframes popup {
  0% {
    opacity: 0;
  }
  80%, 100% {
    opacity: 1;
  }
}

@keyframes expansion {
  0% {
    opacity: 0;
  }
  100% {
	transform: scale(1.5);
    opacity: 1;
  }
}

@keyframes SlideIn {
  0% {
    opacity: 0;/*初期状態では透明に*/
    transform: translateX(64px);
  }
  100% {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes pulseMotion {
  0% {
    transform: translate(-50%, -50%) scale(1, 1);
    background-color: rgba(29, 32, 136, 0.4)
  }
  100% {
    transform: translate(-50%, -50%) scale(3.5, 3.5);
    background-color: rgba(29, 32, 136, 0)
  }
}

@keyframes rotation {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}

@keyframes blink {
    from {
        opacity: 0;
    }
    to {
        opacity: 1;
    }
}

@keyframes arrow
{
0% {opacity:0}
40% {opacity:1}
80% {opacity:0}
100% {opacity:0}
}

@keyframes jump {
  0%, 100% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-20px);
  }
}