body {
  -webkit-transition: all 2s;
  transition: all 2s;
  max-width: 1350px;
  margin: 0 auto;
  font-family: "Sawarabi Gothic";
}

.bodyfadeout {
  opacity: 0;
}

@media screen and (min-width: 640px) {
  .front-top-page {
    height: 90vh;
    overflow: hidden;
    text-align: center;
    margin: 0 auto;
  }
  .front-top-page img {
    padding-top: 3vh;
    height: 70vh;
    width: 100%;
    -o-object-fit: cover;
       object-fit: cover;
    -webkit-transform: translateX(-2vh);
            transform: translateX(-2vh);
  }
  .front-top-page div {
    -webkit-animation: moving 3s infinite;
            animation: moving 3s infinite;
  }
  .front-top-page div h1 {
    font-size: 16px;
    color: #1b5a1b;
  }
  .front-top-page div p {
    margin: 0;
    color: #1b5a1b;
  }
  @-webkit-keyframes moving {
    0% {
      -webkit-transform: translateY(-5vh);
              transform: translateY(-5vh);
    }
    50% {
      -webkit-transform: translateY(-1vh);
              transform: translateY(-1vh);
    }
    100% {
      -webkit-transform: translateY(-5vh);
              transform: translateY(-5vh);
    }
  }
  @keyframes moving {
    0% {
      -webkit-transform: translateY(-5vh);
              transform: translateY(-5vh);
    }
    50% {
      -webkit-transform: translateY(-1vh);
              transform: translateY(-1vh);
    }
    100% {
      -webkit-transform: translateY(-5vh);
              transform: translateY(-5vh);
    }
  }
}

@media screen and (max-width: 640px) {
  .front-top-page {
    height: 90vh;
    overflow: hidden;
    text-align: center;
  }
  .front-top-page img {
    height: 60vh;
    -o-object-fit: cover;
       object-fit: cover;
    -webkit-transform: translateX(-1vh);
            transform: translateX(-1vh);
    display: block;
  }
  .front-top-page div {
    -webkit-animation: moving 3s infinite;
            animation: moving 3s infinite;
  }
  .front-top-page div h1 {
    font-size: 13px;
    color: #1b5a1b;
  }
  .front-top-page div p {
    margin: 0;
    color: #205220;
  }
  .front-top-page .click a {
    color: black;
  }
  @-webkit-keyframes moving {
    0% {
      -webkit-transform: translateY(-14vh);
              transform: translateY(-14vh);
    }
    50% {
      -webkit-transform: translateY(-8vh);
              transform: translateY(-8vh);
    }
    70% {
      -webkit-transform: translateY(-8vh);
              transform: translateY(-8vh);
    }
    100% {
      -webkit-transform: translateY(-14vh);
              transform: translateY(-14vh);
    }
  }
  @keyframes moving {
    0% {
      -webkit-transform: translateY(-14vh);
              transform: translateY(-14vh);
    }
    50% {
      -webkit-transform: translateY(-8vh);
              transform: translateY(-8vh);
    }
    70% {
      -webkit-transform: translateY(-8vh);
              transform: translateY(-8vh);
    }
    100% {
      -webkit-transform: translateY(-14vh);
              transform: translateY(-14vh);
    }
  }
}
/*# sourceMappingURL=front-top.css.map */