@keyframes move_text {
  0% {
    transform: translateX(-12%);
    opacity: 0;
  }
  5% {
    opacity: 1;
  }
  95% {
    opacity: 1;
  }
  100% {
    transform: translateX(13%);
    opacity: 0;
  }
}
@keyframes scale_text {
  0% {
    transform: translateY(0);
  }
  5% {
    transform: translateY(-10%);
  }
  10% {
    transform: translateY(0);
  }
  100% {
    transform: translateY(0);
  }
}
@keyframes move_text_inner {
  0% {
    transform: translate(-10%);
  }
  5% {
    transform: translate(15%);
  }
  100% {
    transform: translate(15%);
  }
}
@keyframes move_text_inner02 {
  0% {
    transform: translate(10%);
  }
  5% {
    transform: translate(-15%);
  }
  100% {
    transform: translate(-15%);
  }
}
@keyframes ud01 {
  0% {
    transform: translateY(0%) rotate(0deg);
  }
  50% {
    transform: translateY(max(10%, 2rem)) rotate(-5deg);
  }
  100% {
    transform: translateY(0%) rotate(0deg);
  }
}
@keyframes ud02 {
  0% {
    transform: translateY(0%) rotate(0deg);
  }
  50% {
    transform: translateY(min(-10%, -2rem)) rotate(5deg);
  }
  100% {
    transform: translateY(0%) rotate(0deg);
  }
}
@keyframes ud03 {
  0% {
    transform: translateY(0%) rotate(0deg);
  }
  50% {
    transform: translateY(min(-10%, -2rem)) rotate(15deg);
  }
  100% {
    transform: translateY(0%) rotate(0deg);
  }
}
@keyframes pop_in {
  0% {
    transform: translateY(50%) scale(0.3);
    opacity: 0;
  }
  100% {
    transform: translateY(0) scale(1);
    opacity: 1;
  }
}
@keyframes slide_in {
  0% {
    transform: translateY(50%);
  }
  100% {
    transform: translateY(0%);
  }
}
@keyframes grad_rotate {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(360deg);
  }
}
.pop_in {
  opacity: 0;
}
.pop_in.is-show {
  animation: pop_in 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.3s forwards;
}

.slide_in {
  opacity: 0;
  transition: 0.5s ease;
}
.slide_in.is-show {
  animation: slide_in 0.5s ease forwards;
  opacity: 1;
}
.slide_in.to_left {
  transform: translate(50%, 0);
  transition-delay: 0.15s;
  transition-duration: 0.5s;
  animation: none;
}
.slide_in.to_left.is-show {
  transform: translate(0, 0);
}
.slide_in.to_right {
  transform: translate(-50%, 0);
  transition-delay: 0.15s;
  transition-duration: 0.5s;
  animation: none;
}
.slide_in.to_right.is-show {
  transform: translate(0, 0);
}

.shine {
  position: relative;
  overflow: hidden;
}
.shine::before {
  content: "";
  position: absolute;
  display: inline-block;
  top: -18rem;
  left: 0;
  width: 3rem;
  height: 100%;
  background-color: #fff;
  transition: 1200ms;
  animation: shinyshiny 2.5s ease-in-out infinite;
  z-index: 1;
}

.slide_in_1 {
  opacity: 0;
  transition: 0.5s ease;
}
.slide_in_1.is-show {
  animation: slide_in 0.5s ease forwards;
  opacity: 1;
}

.slide_in_2 {
  opacity: 0;
  transition: 0.5s ease;
}
.slide_in_2.is-show {
  animation: slide_in 0.5s ease forwards;
  opacity: 1;
}

.slide_in_3 {
  opacity: 0;
  transition: 0.5s ease;
}
.slide_in_3.is-show {
  animation: slide_in 0.5s ease forwards;
  opacity: 1;
}

.slide_in_4 {
  opacity: 0;
  transition: 0.5s ease;
}
.slide_in_4.is-show {
  animation: slide_in 0.5s ease forwards;
  opacity: 1;
}

.slide_in_5 {
  opacity: 0;
  transition: 0.5s ease;
}
.slide_in_5.is-show {
  animation: slide_in 0.5s ease forwards;
  opacity: 1;
}

.slide_in_6 {
  opacity: 0;
  transition: 0.5s ease;
}
.slide_in_6.is-show {
  animation: slide_in 0.5s ease forwards;
  opacity: 1;
}

.slide_in_7 {
  opacity: 0;
  transition: 0.5s ease;
}
.slide_in_7.is-show {
  animation: slide_in 0.5s ease forwards;
  opacity: 1;
}

.slide_in_8 {
  opacity: 0;
  transition: 0.5s ease;
}
.slide_in_8.is-show {
  animation: slide_in 0.5s ease forwards;
  opacity: 1;
}

.slide_in_9 {
  opacity: 0;
  transition: 0.5s ease;
}
.slide_in_9.is-show {
  animation: slide_in 0.5s ease forwards;
  opacity: 1;
}

.slide_in_10 {
  opacity: 0;
  transition: 0.5s ease;
}
.slide_in_10.is-show {
  animation: slide_in 0.5s ease forwards;
  opacity: 1;
}

.pop_in_1 {
  opacity: 0;
}
.pop_in_1.is-show {
  animation: pop_in 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.3s forwards;
}

.fade_in_1 {
  opacity: 0;
  transition: 1s;
}
.fade_in_1.is-show {
  opacity: 1;
}

.pop_in_2 {
  opacity: 0;
}
.pop_in_2.is-show {
  animation: pop_in 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.3s forwards;
}

.fade_in_2 {
  opacity: 0;
  transition: 1s;
}
.fade_in_2.is-show {
  opacity: 1;
}

.pop_in_3 {
  opacity: 0;
}
.pop_in_3.is-show {
  animation: pop_in 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.3s forwards;
}

.fade_in_3 {
  opacity: 0;
  transition: 1s;
}
.fade_in_3.is-show {
  opacity: 1;
}

.pop_in_4 {
  opacity: 0;
}
.pop_in_4.is-show {
  animation: pop_in 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.3s forwards;
}

.fade_in_4 {
  opacity: 0;
  transition: 1s;
}
.fade_in_4.is-show {
  opacity: 1;
}

.pop_in_5 {
  opacity: 0;
}
.pop_in_5.is-show {
  animation: pop_in 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.3s forwards;
}

.fade_in_5 {
  opacity: 0;
  transition: 1s;
}
.fade_in_5.is-show {
  opacity: 1;
}

.pop_in_6 {
  opacity: 0;
}
.pop_in_6.is-show {
  animation: pop_in 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.3s forwards;
}

.fade_in_6 {
  opacity: 0;
  transition: 1s;
}
.fade_in_6.is-show {
  opacity: 1;
}

.pop_in_7 {
  opacity: 0;
}
.pop_in_7.is-show {
  animation: pop_in 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.3s forwards;
}

.fade_in_7 {
  opacity: 0;
  transition: 1s;
}
.fade_in_7.is-show {
  opacity: 1;
}

.pop_in_8 {
  opacity: 0;
}
.pop_in_8.is-show {
  animation: pop_in 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.3s forwards;
}

.fade_in_8 {
  opacity: 0;
  transition: 1s;
}
.fade_in_8.is-show {
  opacity: 1;
}

.pop_in_9 {
  opacity: 0;
}
.pop_in_9.is-show {
  animation: pop_in 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.3s forwards;
}

.fade_in_9 {
  opacity: 0;
  transition: 1s;
}
.fade_in_9.is-show {
  opacity: 1;
}

.pop_in_10 {
  opacity: 0;
}
.pop_in_10.is-show {
  animation: pop_in 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.3s forwards;
}

.fade_in_10 {
  opacity: 0;
  transition: 1s;
}
.fade_in_10.is-show {
  opacity: 1;
}

.fade_in {
  opacity: 0;
  transition: 1s;
}
.fade_in.is-show {
  opacity: 1;
}

.mask {
  display: inline-block;
  position: relative;
  overflow: hidden;
  opacity: 0;
}
.mask.is-show {
  animation: 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) 0.4s forwards showElm;
}
.mask.is-show::after {
  animation: 0.5s cubic-bezier(0.895, 0.03, 0.685, 0.22) alternate forwards openMask, 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s alternate forwards closeMask;
}
.mask::after {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  width: 100%;
  height: 100%;
  background: #000;
  content: "";
  transform: scaleX(0) translateX(0);
  transform-origin: left;
  z-index: 10;
}

.mask_1 {
  display: inline-block;
  position: relative;
  overflow: hidden;
  opacity: 0;
}
.mask_1.is-show {
  animation: 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) 0.4s forwards showElm;
}
.mask_1.is-show::after {
  animation: 0.5s cubic-bezier(0.895, 0.03, 0.685, 0.22) alternate forwards openMask, 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s alternate forwards closeMask;
}
.mask_1::after {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  width: 100%;
  height: 100%;
  background: #000;
  content: "";
  transform: scaleX(0) translateX(0);
  transform-origin: left;
  z-index: 10;
}

.mask_2 {
  display: inline-block;
  position: relative;
  overflow: hidden;
  opacity: 0;
}
.mask_2.is-show {
  animation: 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) 0.4s forwards showElm;
}
.mask_2.is-show::after {
  animation: 0.5s cubic-bezier(0.895, 0.03, 0.685, 0.22) alternate forwards openMask, 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s alternate forwards closeMask;
}
.mask_2::after {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  width: 100%;
  height: 100%;
  background: #000;
  content: "";
  transform: scaleX(0) translateX(0);
  transform-origin: left;
  z-index: 10;
}

.mask_3 {
  display: inline-block;
  position: relative;
  overflow: hidden;
  opacity: 0;
}
.mask_3.is-show {
  animation: 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) 0.4s forwards showElm;
}
.mask_3.is-show::after {
  animation: 0.5s cubic-bezier(0.895, 0.03, 0.685, 0.22) alternate forwards openMask, 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s alternate forwards closeMask;
}
.mask_3::after {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  width: 100%;
  height: 100%;
  background: #000;
  content: "";
  transform: scaleX(0) translateX(0);
  transform-origin: left;
  z-index: 10;
}

.mask_4 {
  display: inline-block;
  position: relative;
  overflow: hidden;
  opacity: 0;
}
.mask_4.is-show {
  animation: 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) 0.4s forwards showElm;
}
.mask_4.is-show::after {
  animation: 0.5s cubic-bezier(0.895, 0.03, 0.685, 0.22) alternate forwards openMask, 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s alternate forwards closeMask;
}
.mask_4::after {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  width: 100%;
  height: 100%;
  background: #000;
  content: "";
  transform: scaleX(0) translateX(0);
  transform-origin: left;
  z-index: 10;
}

.mask_5 {
  display: inline-block;
  position: relative;
  overflow: hidden;
  opacity: 0;
}
.mask_5.is-show {
  animation: 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) 0.4s forwards showElm;
}
.mask_5.is-show::after {
  animation: 0.5s cubic-bezier(0.895, 0.03, 0.685, 0.22) alternate forwards openMask, 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s alternate forwards closeMask;
}
.mask_5::after {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  width: 100%;
  height: 100%;
  background: #000;
  content: "";
  transform: scaleX(0) translateX(0);
  transform-origin: left;
  z-index: 10;
}

.mask_6 {
  display: inline-block;
  position: relative;
  overflow: hidden;
  opacity: 0;
}
.mask_6.is-show {
  animation: 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) 0.4s forwards showElm;
}
.mask_6.is-show::after {
  animation: 0.5s cubic-bezier(0.895, 0.03, 0.685, 0.22) alternate forwards openMask, 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s alternate forwards closeMask;
}
.mask_6::after {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  width: 100%;
  height: 100%;
  background: #000;
  content: "";
  transform: scaleX(0) translateX(0);
  transform-origin: left;
  z-index: 10;
}

.mask_7 {
  display: inline-block;
  position: relative;
  overflow: hidden;
  opacity: 0;
}
.mask_7.is-show {
  animation: 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) 0.4s forwards showElm;
}
.mask_7.is-show::after {
  animation: 0.5s cubic-bezier(0.895, 0.03, 0.685, 0.22) alternate forwards openMask, 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s alternate forwards closeMask;
}
.mask_7::after {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  width: 100%;
  height: 100%;
  background: #000;
  content: "";
  transform: scaleX(0) translateX(0);
  transform-origin: left;
  z-index: 10;
}

.mask_8 {
  display: inline-block;
  position: relative;
  overflow: hidden;
  opacity: 0;
}
.mask_8.is-show {
  animation: 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) 0.4s forwards showElm;
}
.mask_8.is-show::after {
  animation: 0.5s cubic-bezier(0.895, 0.03, 0.685, 0.22) alternate forwards openMask, 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s alternate forwards closeMask;
}
.mask_8::after {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  width: 100%;
  height: 100%;
  background: #000;
  content: "";
  transform: scaleX(0) translateX(0);
  transform-origin: left;
  z-index: 10;
}

.mask_9 {
  display: inline-block;
  position: relative;
  overflow: hidden;
  opacity: 0;
}
.mask_9.is-show {
  animation: 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) 0.4s forwards showElm;
}
.mask_9.is-show::after {
  animation: 0.5s cubic-bezier(0.895, 0.03, 0.685, 0.22) alternate forwards openMask, 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s alternate forwards closeMask;
}
.mask_9::after {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  width: 100%;
  height: 100%;
  background: #000;
  content: "";
  transform: scaleX(0) translateX(0);
  transform-origin: left;
  z-index: 10;
}

.mask_10 {
  display: inline-block;
  position: relative;
  overflow: hidden;
  opacity: 0;
}
.mask_10.is-show {
  animation: 0.3s cubic-bezier(0.165, 0.84, 0.44, 1) 0.4s forwards showElm;
}
.mask_10.is-show::after {
  animation: 0.5s cubic-bezier(0.895, 0.03, 0.685, 0.22) alternate forwards openMask, 0.5s cubic-bezier(0.165, 0.84, 0.44, 1) 0.5s alternate forwards closeMask;
}
.mask_10::after {
  position: absolute;
  top: 0;
  left: 0;
  display: inline-block;
  width: 100%;
  height: 100%;
  background: #000;
  content: "";
  transform: scaleX(0) translateX(0);
  transform-origin: left;
  z-index: 10;
}

@keyframes openMask {
  0% {
    transform: scaleX(0) translateX(0);
  }
  100% {
    transform: scaleX(1) translateX(0);
  }
}
@keyframes closeMask {
  0% {
    transform: scaleX(1) translateX(0);
  }
  100% {
    transform: scaleX(1) translateX(101%);
  }
}
@keyframes showElm {
  0% {
    opacity: 0;
  }
  100% {
    opacity: 1;
  }
}
@keyframes shinyshiny {
  0% {
    transform: scale(0) rotate(45deg);
    opacity: 0;
  }
  80% {
    transform: scale(0) rotate(45deg);
    opacity: 0.5;
  }
  81% {
    transform: scale(4) rotate(45deg);
    opacity: 1;
  }
  100% {
    transform: scale(50) rotate(45deg);
    opacity: 0;
  }
}
@keyframes kumo01 {
  0% {
    opacity: 0;
    transform: translate(20%, 0);
  }
  10% {
    opacity: 1;
  }
  90% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: translate(-80%, 0);
  }
}
@keyframes kumo02 {
  0% {
    opacity: 0;
    transform: translate(-20%, 0);
  }
  10% {
    opacity: 1;
  }
  90% {
    opacity: 1;
  }
  100% {
    opacity: 0;
    transform: translate(80%, 0);
  }
}
@keyframes bird01 {
  0% {
    opacity: 0;
    transform: translate(-200%, -300%);
  }
  100% {
    opacity: 1;
    transform: translate(0, 0);
  }
}
@keyframes bird02 {
  0% {
    opacity: 0;
    transform: translate(80%, -300%);
  }
  100% {
    opacity: 1;
    transform: translate(0, 0);
  }
}/*# sourceMappingURL=animation.css.map */