.fade .animation-bg {
  background: #ffffff;
  content: "";
  position: fixed;
  z-index: 999;
  top: 0;
  left: 0;
  width: 100%;
  height: 100vh;
  animation-name: PageAnime-fade;
  animation-duration: 0.3s;
  animation-delay: 0.2s;
  animation-timing-function: ease-in-out;
  animation-fill-mode: forwards;
  pointer-events: none;
}

@keyframes PageAnime-fade {
  0% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    display: none;
  }
}

body {
    font-family: 'Noto Sans JP', sans-serif;
}


.move_rice{
    transform: translate(0px, 0px);
    animation: move 5s linear infinite;
}
@keyframes move {
    0% {
        transform: translateX(0px);
    }
    25% {
        transform:  translateX(15px);

    }
    50% {
        transform:  translateX(0px);
    }
    75% {
        transform:  translateX(-15px);
    }
    100% {
        transform:  translateX(0px);
    }
}

.gatagoto_rice{
    display: block;
    margin: 10px auto 0;
    width: 150px;
    animation: MoveRice .3s infinite;
}
@keyframes MoveRice{
    20% {
        transform: translateY(-2px);
        animation-timing-function: cubic-bezier(0.4, 0, 1, 1.3);
    }
    25% {
        transform: translateY(0px);
    }
    55% {
        transform: translateY(-1px);
        animation-timing-function: cubic-bezier(0.4, 0, 1, 1.3);
    }
    60% {
        transform: translateY(0px);
    }
}