/* --------------------------------------------------
  animation
-------------------------------------------------- */
@-webkit-keyframes fade-in {
  0% {
    display: none;
    opacity: 0;
  }
  20% {
    display: block;
    opacity: 0;
  }
  100% {
    display: block;
    opacity: 1;
  }
}
@keyframes fade-in {
  0% {
    display: none;
    opacity: 0;
  }
  20% {
    display: block;
    opacity: 0;
  }
  100% {
    display: block;
    opacity: 1;
  }
}
@-webkit-keyframes fadeUp {
  0% {
    opacity: 0;
    transform: translate(0, 20px);
  }
  40% {
    opacity: 1;
  }
  100% {
    transform: translate(0);
    opacity: 1;
  }
}
@keyframes fadeUp {
  0% {
    opacity: 0;
    transform: translate(0, 20px);
  }
  40% {
    opacity: 1;
  }
  100% {
    transform: translate(0);
    opacity: 1;
  }
}
.js .js-animation {
  opacity: 0;
  visibility: hidden;
  transform: translateY(20px);
  transition: opacity 0.2s ease-out, transform 0.4s ease-out;
}
.js-animation.is-show {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
@-webkit-keyframes marquee {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}
@keyframes marquee {
  0% {
    transform: translateX(0);
  }
  100% {
    transform: translateX(-100%);
  }
}
.marquee .marquee-text {
  -webkit-animation: marquee 15s linear infinite;
  animation: marquee 15s linear infinite;
}
@-webkit-keyframes float {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-15px);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes float {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-15px);
  }
  100% {
    transform: translateY(0);
  }
}
@-webkit-keyframes float2 {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-20px);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes float2 {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(-20px);
  }
  100% {
    transform: translateY(0);
  }
}
@-webkit-keyframes float3 {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(20px);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes float3 {
  0% {
    transform: translateY(0);
  }
  50% {
    transform: translateY(20px);
  }
  100% {
    transform: translateY(0);
  }
}
@-webkit-keyframes float4 {
  0% {
    transform: translateY(0);
  }
  49% {
    transform: translateY(16px);
  }
  98% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes float4 {
  0% {
    transform: translateY(0);
  }
  49% {
    transform: translateY(16px);
  }
  98% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(0);
  }
}
.fuwa1 {
  -webkit-animation: float 6s ease-in-out infinite;
  animation: float 6s ease-in-out infinite;
}
.fuwa2 {
  -webkit-animation: float2 6s ease-in-out infinite;
  animation: float2 6s ease-in-out infinite;
}
.fuwa3 {
  -webkit-animation: float3 8s linear infinite;
  animation: float3 8s linear infinite;
}
.fuwa4 {
  -webkit-animation: float4 5s linear infinite;
  animation: float4 5s linear infinite;
}
