.page-template-front-page-php .topvisual .base {
  opacity: 0;
  transform: translateY(10%) scale(0.75);
  transition: all 0.75s ease-in;
}
.page-template-front-page-php .topvisual .base.active {
  opacity: 1;
  transform: translateY(0) scale(1);
}
.page-template-front-page-php .topvisual .plane {
  transform: translateY(1rem) translateX(2rem);
  opacity: 0;
}
.page-template-front-page-php .topvisual .plane.active {
  animation: plane 0.5s ease 2.75s forwards;
}
.page-template-front-page-php .topvisual .plane.rep {
  transform: translateY(0) translateX(0);
  opacity: 1;
  animation: planeRep 10s linear infinite 3s forwards;
}
.page-template-front-page-php .topvisual .recycling {
  transform: translateY(4rem);
  opacity: 0;
}
.page-template-front-page-php .topvisual .recycling.active {
  animation: bottomInL 0.5s ease 2.5s forwards;
}
.page-template-front-page-php .topvisual .topvisual-bottole {
  transform: scale(0.8);
  opacity: 0;
}
.page-template-front-page-php .topvisual .topvisual-bottole.active {
  animation: fadeupIn 0.5s ease 2s forwards;
}
.page-template-front-page-php .topvisual .topvisual-couple {
  transform: translateX(4rem);
  opacity: 0;
}
.page-template-front-page-php .topvisual .topvisual-couple.active {
  animation: rightInL 0.75s ease 2.5s forwards;
}
.page-template-front-page-php .topvisual .topvisual-kumo01, .page-template-front-page-php .topvisual .topvisual-kumo02, .page-template-front-page-php .topvisual .topvisual-kumo03, .page-template-front-page-php .topvisual .topvisual-kumo04 {
  opacity: 0;
  transition: all 0.75s 1s ease-in;
}
.page-template-front-page-php .topvisual .topvisual-kumo01.active, .page-template-front-page-php .topvisual .topvisual-kumo02.active, .page-template-front-page-php .topvisual .topvisual-kumo03.active, .page-template-front-page-php .topvisual .topvisual-kumo04.active {
  opacity: 1;
}
.page-template-front-page-php .fadeIn {
  opacity: 0;
}
.page-template-front-page-php .fadeIn.active {
  animation: fadeIn 0.5s ease forwards;
}
.page-template-front-page-php .fadeupIn {
  transform: scale(0.8);
  opacity: 0;
}
.page-template-front-page-php .fadeupIn.active {
  animation: fadeupIn 0.5s ease forwards;
}
.page-template-front-page-php .fadeupIn-ac {
  transform: scale(0.8);
  opacity: 0;
}
.page-template-front-page-php .fadeupIn-ac.active {
  animation: fadeupIn 0.5s ease forwards;
}
.page-template-front-page-php .fadeupIn-1 {
  transform: scale(0.8);
  opacity: 0;
}
.page-template-front-page-php .fadeupIn-1.active {
  animation: fadeupIn 0.5s ease 1s forwards;
}
.page-template-front-page-php .fadeupIn-1.rep {
  transform: scale(1);
  opacity: 1;
  animation: fadeupInRep 10s linear infinite forwards;
}
.page-template-front-page-php .fadeupIn-ac-1 {
  transform: scale(0.8);
  opacity: 0;
}
.page-template-front-page-php .fadeupIn-ac-1.active {
  animation: fadeupIn 0.5s ease 1s forwards;
}
.page-template-front-page-php .fadeupIn-2 {
  transform: scale(0.8);
  opacity: 0;
}
.page-template-front-page-php .fadeupIn-2.active {
  animation: fadeupIn 0.5s ease 1.5s forwards;
}
.page-template-front-page-php .fadeupIn-2.rep {
  transform: scale(1);
  opacity: 1;
  animation: fadeupInRep 10s linear infinite 1.5s forwards;
}
.page-template-front-page-php .rightIn-1 {
  transform: translateX(1rem);
  opacity: 0;
}
.page-template-front-page-php .rightIn-1.active {
  animation: rightIn 0.75s linear 1s forwards;
}
.page-template-front-page-php .rightIn-1.rep {
  transform: translateX(0);
  opacity: 1;
  animation: rightInRep 10s linear infinite forwards;
}
.page-template-front-page-php .rightIn-2 {
  transform: translateX(1rem);
  opacity: 0;
}
.page-template-front-page-php .rightIn-2.active {
  animation: rightIn 0.75s linear 1.5s forwards;
}
.page-template-front-page-php .rightIn-2.rep {
  transform: translateX(0);
  opacity: 1;
  animation: rightInRep 10s linear infinite 1.5s forwards;
}
.page-template-front-page-php .rightIn-3 {
  transform: translateX(1rem);
  opacity: 0;
}
.page-template-front-page-php .rightIn-3.active {
  animation: rightIn 0.75s linear 2s forwards;
}
.page-template-front-page-php .rightIn-3.rep {
  transform: translateX(0);
  opacity: 1;
  animation: rightInRep 10s linear infinite 2s forwards;
}
.page-template-front-page-php .leftIn-1 {
  transform: translateX(-1rem);
  opacity: 0;
}
.page-template-front-page-php .leftIn-1.active {
  animation: leftIn 0.75s linear 1s forwards;
}
.page-template-front-page-php .leftIn-1.rep {
  transform: translateX(0);
  opacity: 1;
  animation: leftInRep 10s linear infinite forwards;
}
.page-template-front-page-php .leftIn-2 {
  transform: translateX(-1rem);
  opacity: 0;
}
.page-template-front-page-php .leftIn-2.active {
  animation: leftIn 0.75s linear 1.5s forwards;
}
.page-template-front-page-php .leftIn-2.rep {
  transform: translateX(0);
  opacity: 1;
  animation: leftInRep 10s linear infinite 1.5s forwards;
}
.page-template-front-page-php .leftIn-3 {
  transform: translateX(-1rem);
  opacity: 0;
}
.page-template-front-page-php .leftIn-3.active {
  animation: leftIn 0.75s linear 2s forwards;
}
.page-template-front-page-php .leftIn-3.rep {
  transform: translateX(0);
  opacity: 1;
  animation: leftInRep 10s linear infinite 2s forwards;
}
.page-template-front-page-php .topvisual-title-1 {
  transform: translateX(4rem);
  opacity: 0;
}
.page-template-front-page-php .topvisual-title-1.active {
  animation: rightSlideIn 0.5s ease-in 0.5s forwards;
}
.page-template-front-page-php .topvisual-title-2 {
  transform: translateX(4rem);
  opacity: 0;
}
.page-template-front-page-php .topvisual-title-2.active {
  animation: rightSlideIn 0.5s ease-in 1s forwards;
}
.page-template-front-page-php .topvisual-subtitle {
  opacity: 0;
}
.page-template-front-page-php .topvisual-subtitle.active {
  animation: fadeIn 0.5s ease 1.5s forwards;
}
.page-template-front-page-php .buttlemove1 {
  animation: buttlemove1 6s ease-in-out infinite alternate;
}
@keyframes buttlemove1 {
  0% {
    transform: translate(0, 0) rotate(-7deg);
  }
  50% {
    transform: translate(0, -4rem) rotate(0deg);
  }
  100% {
    transform: translate(0, 0) rotate(7deg);
  }
}
.page-template-front-page-php .buttlemove2 {
  animation: buttlemove2 8s ease-in-out infinite alternate;
}
@keyframes buttlemove2 {
  0% {
    transform: translate(0, 0) rotate(10deg);
  }
  50% {
    transform: translate(0, -7rem) rotate(0deg);
  }
  100% {
    transform: translate(0, 0) rotate(-10deg);
  }
}
.page-template-front-page-php .news-business-bottle01 {
  animation: buttlemove3 6s ease-in-out infinite alternate;
}
@media only screen and (min-width: 751px) {
  .page-template-front-page-php .news-business-bottle01 {
    animation: buttlemove3pc 6s ease-in-out infinite alternate;
  }
}
@keyframes buttlemove3 {
  0% {
    transform: translate(0, 0) rotate(10deg);
  }
  50% {
    transform: translate(0, -7rem) rotate(0deg);
  }
  100% {
    transform: translate(0, 0) rotate(-10deg);
  }
}
@keyframes buttlemove3pc {
  0% {
    transform: translate(80rem, 0) rotate(10deg);
  }
  50% {
    transform: translate(80rem, -7rem) rotate(0deg);
  }
  100% {
    transform: translate(80rem, 0) rotate(-10deg);
  }
}
@keyframes plane {
  0% {
    transform: translateY(1rem) translateX(2rem);
    opacity: 0;
  }
  100% {
    transform: translateY(0) translateX(0);
    opacity: 1;
  }
}
@keyframes planeRep {
  0% {
    transform: translateY(0) translateX(0);
    opacity: 1;
  }
  4.76% {
    transform: translateY(0) translateX(0);
    opacity: 0;
  }
  40.84% {
    transform: translateY(1rem) translateX(2rem);
    opacity: 0;
  }
  45.124% {
    transform: translateY(0) translateX(0);
    opacity: 1;
  }
  100% {
    transform: translateY(0) translateX(0);
    opacity: 1;
  }
}
@keyframes fadeIn {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes fadeupIn {
  0% {
    transform: scale(0.8);
    opacity: 0;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes fadeupInRep {
  0% {
    transform: scale(1);
    opacity: 1;
  }
  14.28% {
    transform: scale(1);
    opacity: 0;
  }
  40.84% {
    transform: scale(0.8);
    opacity: 0;
  }
  45.124% {
    transform: scale(1);
    opacity: 1;
  }
  100% {
    transform: scale(1);
    opacity: 1;
  }
}
@keyframes bottomInL {
  0% {
    transform: translateY(4rem);
    opacity: 0;
  }
  100% {
    transform: translateY(0);
    opacity: 1;
  }
}
@keyframes rightSlideIn {
  0% {
    transform: translateX(4rem);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes rightIn {
  0% {
    transform: translateX(1rem);
    opacity: 0;
  }
  40% {
    transform: translateX(1rem);
    opacity: 1;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes rightInRep {
  0% {
    transform: translateX(0);
    opacity: 1;
  }
  14.28% {
    transform: translateX(0);
    opacity: 1;
  }
  18.564% {
    transform: translateX(0);
    opacity: 0;
  }
  32.845% {
    transform: translateX(1rem);
    opacity: 0;
  }
  37.129% {
    transform: translateX(1rem);
    opacity: 1;
  }
  47.125% {
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes rightInL {
  0% {
    transform: translateX(4rem);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes leftIn {
  0% {
    transform: translateX(-1rem);
    opacity: 0;
  }
  40% {
    transform: translateX(-1rem);
    opacity: 1;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}
@keyframes leftInRep {
  0% {
    transform: translateX(0);
    opacity: 1;
  }
  14.28% {
    transform: translateX(0);
    opacity: 1;
  }
  18.564% {
    transform: translateX(0);
    opacity: 0;
  }
  32.845% {
    transform: translateX(-1rem);
    opacity: 0;
  }
  37.129% {
    transform: translateX(-1rem);
    opacity: 1;
  }
  47.125% {
    transform: translateX(0);
    opacity: 1;
  }
  100% {
    transform: translateX(0);
    opacity: 1;
  }
}
.page-template-front-page-php .fuwafuwa-1 {
  animation: fuwafuwa 3s ease-in-out infinite alternate;
}
.page-template-front-page-php .fuwafuwa-2 {
  animation: fuwafuwa 4s ease-in-out infinite alternate;
}
.page-template-front-page-php .fuwafuwa-3 {
  animation: fuwafuwa 3s ease-in-out infinite alternate;
}
.page-template-front-page-php .fuwafuwa-4 {
  animation: fuwafuwa 4s ease-in-out infinite alternate;
}
@keyframes fuwafuwa {
  0% {
    transform: translate(0, 0) rotate(-3deg);
  }
  50% {
    transform: translate(0, -0.9rem) rotate(0deg);
  }
  100% {
    transform: translate(0, 0) rotate(3deg);
  }
}