.mod-top-block-01 .text-01 {
  left: 14px;
  top: 140px;
}
.mod-top-block-01 .text-01.is-active {
  top: 110px;
}
.tablet-device .mod-top-block-01 .text-01 {
  top: 260px;
}
.tablet-device .mod-top-block-01 .text-01.is-active {
  top: 230px;
}

.mod-top-block-01 .text-02.is-active {
  top: 360px;
}
.tablet-device .mod-top-block-01 .text-02.is-active {
  top: 760px;
}

#js-block-04 {
  position: relative;
  height: 518px;
  z-index: 10;
  margin-top: -67px;
}
.tablet-device #js-block-04 {
  height: 1036px;
  margin-top: -134px;
}
#js-block-04 div, #js-block-04 h1, #js-block-04 p {
  position: absolute;
  transition: all 0.8s ease-out;
}
#js-block-04 .image-01 {
  top: -1px;
  left: -215px;
}
.tablet-device #js-block-04 .image-01 {
  top: -2px;
  left: -430px;
}
.tablet-device #js-block-04 .image-01 img {
  width: 1500px;
}
#js-block-04 .ttl-main {
  left: 109px;
  top: 220px;
  -webkit-transform: translateY(-10px);
  transform: translateY(-10px);
  opacity: 0;
}
#js-block-04 .ttl-main.is-active {
  -webkit-transition-delay: 1.8s;
  transition-delay: 1.8s;
  -webkit-transform: translateY(0);
  transform: translateY(0);
  opacity: 1;
}
.tablet-device #js-block-04 .ttl-main {
  left: 218px;
  top: 440px;
}
.tablet-device #js-block-04 .ttl-main img {
  width: 386px;
}
#js-block-04 .ttl-sub {
  left: 113px;
  top: 313px;
  -webkit-transform: translateY(-10px);
  transform: translateY(-10px);
  opacity: 0;
}
#js-block-04 .ttl-sub.is-active {
  -webkit-transition-delay: 2.3s;
  transition-delay: 2.3s;
  -webkit-transform: translateY(0);
  transform: translateY(0);
  opacity: 1;
}
.tablet-device #js-block-04 .ttl-sub {
  left: 226px;
  top: 626px;
}
.tablet-device #js-block-04 .ttl-sub img {
  width: 250px;
}
#js-block-04 .photo-01 {
  left: -161px;
  top: 128px;
  opacity: 0;
  -webkit-transform: rotate(-30deg) translate(480px, 400px);
  transform: rotate(-30deg) translate(480px, 400px);
}
#js-block-04 .photo-01.is-active {
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
  -webkit-transform: rotate(0) translate(0, 0);
  transform: rotate(0) translate(0, 0);
  opacity: 1;
}
.tablet-device #js-block-04 .photo-01 {
  left: -322px;
  top: 256px;
}
.tablet-device #js-block-04 .photo-01 img {
  width: 590px;
}
#js-block-04 .photo-02 {
  left: -74px;
  top: 303px;
  opacity: 0;
  -webkit-transform: rotate(-20deg) translate(400px, 220px);
  transform: rotate(-20deg) translate(400px, 220px);
}
#js-block-04 .photo-02.is-active {
  -webkit-transition-delay: 0.4s;
  transition-delay: 0.4s;
  -webkit-transform: rotate(0) translate(0, 0);
  transform: rotate(0) translate(0, 0);
  opacity: 1;
}
.tablet-device #js-block-04 .photo-02 {
  left: -148px;
  top: 606px;
}
.tablet-device #js-block-04 .photo-02 img {
  width: 326px;
}
#js-block-04 .photo-03 {
  left: 10px;
  top: 344px;
  opacity: 0;
  -webkit-transform: rotate(-30deg) translate(320px, 200px);
  transform: rotate(-30deg) translate(320px, 200px);
}
#js-block-04 .photo-03.is-active {
  -webkit-transition-delay: 0.6s;
  transition-delay: 0.6s;
  -webkit-transform: rotate(0) translate(0, 0);
  transform: rotate(0) translate(0, 0);
  opacity: 1;
}
.tablet-device #js-block-04 .photo-03 {
  left: 20px;
  top: 688px;
}
.tablet-device #js-block-04 .photo-03 img {
  width: 324px;
}
#js-block-04 .photo-04 {
  left: 62px;
  top: 343px;
  opacity: 0;
  -webkit-transform: rotate(-20deg) translate(260px, 200px);
  transform: rotate(-20deg) translate(260px, 200px);
}
#js-block-04 .photo-04.is-active {
  -webkit-transition-delay: 0.8s;
  transition-delay: 0.8s;
  -webkit-transform: rotate(0) translate(0, 0);
  transform: rotate(0) translate(0, 0);
  opacity: 1;
}
#js-block-04 .photo-04.is-active.js-anim {
  -webkit-animation: shake 8s linear infinite;
  animation: shake 8s linear infinite;
}
.tablet-device #js-block-04 .photo-04 {
  left: 124px;
  top: 686px;
}
.tablet-device #js-block-04 .photo-04 img {
  width: 436px;
}
#js-block-04 .photo-05 {
  left: 20px;
  top: 14px;
  opacity: 0;
  -webkit-transform: rotate(20deg) translate(400px, 500px);
  transform: rotate(20deg) translate(400px, 500px);
}
#js-block-04 .photo-05.is-active {
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
  -webkit-transform: rotate(0) translate(0, 0);
  transform: rotate(0) translate(0, 0);
  opacity: 1;
}
.tablet-device #js-block-04 .photo-05 {
  left: 40px;
  top: 28px;
}
.tablet-device #js-block-04 .photo-05 img {
  width: 664px;
}
#js-block-04 .photo-06 {
  left: 192px;
  top: 80px;
  opacity: 0;
  -webkit-transform: rotate(30deg) translate(230px, 440px);
  transform: rotate(30deg) translate(230px, 440px);
}
#js-block-04 .photo-06.is-active {
  -webkit-transition-delay: 0.6s;
  transition-delay: 0.6s;
  -webkit-transform: rotate(0) translate(0, 0);
  transform: rotate(0) translate(0, 0);
  opacity: 1;
}
#js-block-04 .photo-06.is-active.js-anim {
  -webkit-animation: shake 6s linear infinite;
  animation: shake 6s linear infinite;
}
.tablet-device #js-block-04 .photo-06 {
  left: 384px;
  top: 160px;
}
.tablet-device #js-block-04 .photo-06 img {
  width: 340px;
}

@-webkit-keyframes shake {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }

  30% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }

  40% {
    -webkit-transform: rotate(-5deg);
    transform: rotate(-5deg);
  }

  43% {
    -webkit-transform: rotate(4deg);
    transform: rotate(4deg);
  }

  45% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }

  47% {
    -webkit-transform: rotate(1deg);
    transform: rotate(1deg);
  }

  48% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }

  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }
}

@keyframes shake {
  0% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }

  30% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }

  40% {
    -webkit-transform: rotate(-5deg);
    transform: rotate(-5deg);
  }

  43% {
    -webkit-transform: rotate(4deg);
    transform: rotate(4deg);
  }

  45% {
    -webkit-transform: rotate(-2deg);
    transform: rotate(-2deg);
  }

  47% {
    -webkit-transform: rotate(1deg);
    transform: rotate(1deg);
  }

  48% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }

  100% {
    -webkit-transform: rotate(0);
    transform: rotate(0);
  }
}

#js-block-03 {
  position: relative;
  height: 489px;
  z-index: 10;
  margin-top: -47px;
}
.tablet-device #js-block-03 {
  height: 978px;
  margin-top: -94px;
}
#js-block-03 div, #js-block-03 h1, #js-block-03 p {
  position: absolute;
  transition: all 1s ease-out;
}
#js-block-03 .image-01 {
  top: -1px;
  left: -215px;
}
.tablet-device #js-block-03 .image-01 {
  top: -2px;
  left: -430px;
}
.tablet-device #js-block-03 .image-01 img {
  width: 1500px;
}
#js-block-03 .ttl-main {
  left: 203px;
  top: 71px;
  -webkit-transform: translateY(-10px);
  transform: translateY(-10px);
  opacity: 0;
}
#js-block-03 .ttl-main.is-active {
  -webkit-transition-delay: 2.5s;
  transition-delay: 2.5s;
  -webkit-transform: translateY(0);
  transform: translateY(0);
  opacity: 1;
}
.tablet-device #js-block-03 .ttl-main {
  left: 406px;
  top: 142px;
}
.tablet-device #js-block-03 .ttl-main img {
  width: 160px;
}
#js-block-03 .ttl-name {
  left: 4px;
  top: 226px;
  -webkit-transform: translateY(-10px);
  transform: translateY(-10px);
  opacity: 0;
}
#js-block-03 .ttl-name.is-active {
  -webkit-transition-delay: 3s;
  transition-delay: 3s;
  -webkit-transform: translateY(0);
  transform: translateY(0);
  opacity: 1;
}
.tablet-device #js-block-03 .ttl-name {
  left: 8px;
  top: 452px;
}
.tablet-device #js-block-03 .ttl-name img {
  width: 418px;
}
#js-block-03 .hexagon-01 {
  left: -170px;
  top: 327px;
  opacity: 0;
}
#js-block-03 .hexagon-01.is-active {
  opacity: 1;
}
.tablet-device #js-block-03 .hexagon-01 {
  left: -340px;
  top: 654px;
}
.tablet-device #js-block-03 .hexagon-01 img {
  width: 168px;
}
#js-block-03 .hexagon-02 {
  left: -51px;
  top: 46px;
  opacity: 0;
}
#js-block-03 .hexagon-02.is-active {
  -webkit-transition-delay: 0.1s;
  transition-delay: 0.1s;
  opacity: 1;
}
.tablet-device #js-block-03 .hexagon-02 {
  left: -101px;
  top: 92px;
}
.tablet-device #js-block-03 .hexagon-02 img {
  width: 170px;
}
#js-block-03 .hexagon-03 {
  left: 35px;
  top: 15px;
  opacity: 0;
}
#js-block-03 .hexagon-03.is-active {
  -webkit-transition-delay: 0.2s;
  transition-delay: 0.2s;
  opacity: 1;
}
.tablet-device #js-block-03 .hexagon-03 {
  left: 70px;
  top: 31px;
}
.tablet-device #js-block-03 .hexagon-03 img {
  width: 164px;
}
#js-block-03 .hexagon-04 {
  left: 77px;
  top: 52px;
  opacity: 0;
}
#js-block-03 .hexagon-04.is-active {
  -webkit-transition-delay: 0.3s;
  transition-delay: 0.3s;
  opacity: 1;
}
.tablet-device #js-block-03 .hexagon-04 {
  left: 154px;
  top: 104px;
}
.tablet-device #js-block-03 .hexagon-04 img {
  width: 166px;
}
#js-block-03 .hexagon-05 {
  left: 160px;
  top: 54px;
  opacity: 0;
}
#js-block-03 .hexagon-05.is-active {
  -webkit-transition-delay: 0.4s;
  transition-delay: 0.4s;
  opacity: 1;
}
.tablet-device #js-block-03 .hexagon-05 {
  left: 320px;
  top: 108px;
}
.tablet-device #js-block-03 .hexagon-05 img {
  width: 166px;
}
#js-block-03 .hexagon-06 {
  left: 203px;
  top: 27px;
  opacity: 0;
}
#js-block-03 .hexagon-06.is-active {
  -webkit-transition-delay: 0.5s;
  transition-delay: 0.5s;
  opacity: 1;
}
.tablet-device #js-block-03 .hexagon-06 {
  left: 406px;
  top: 53px;
}
.tablet-device #js-block-03 .hexagon-06 img {
  width: 162px;
}
#js-block-03 .hexagon-07 {
  left: 246px;
  top: 53px;
  opacity: 0;
}
#js-block-03 .hexagon-07.is-active {
  -webkit-transition-delay: 0.6s;
  transition-delay: 0.6s;
  opacity: 1;
}
.tablet-device #js-block-03 .hexagon-07 {
  left: 492px;
  top: 106px;
}
.tablet-device #js-block-03 .hexagon-07 img {
  width: 162px;
}
#js-block-03 .hexagon-08 {
  left: 288px;
  top: 126px;
  opacity: 0;
}
#js-block-03 .hexagon-08.is-active {
  -webkit-transition-delay: 0.7s;
  transition-delay: 0.7s;
  opacity: 1;
}
.tablet-device #js-block-03 .hexagon-08 {
  left: 576px;
  top: 252px;
}
.tablet-device #js-block-03 .hexagon-08 img {
  width: 166px;
}
#js-block-03 .hexagon-09 {
  left: 245px;
  top: 199px;
  opacity: 0;
}
#js-block-03 .hexagon-09.is-active {
  -webkit-transition-delay: 0.8s;
  transition-delay: 0.8s;
  opacity: 1;
}
.tablet-device #js-block-03 .hexagon-09 {
  left: 490px;
  top: 398px;
}
.tablet-device #js-block-03 .hexagon-09 img {
  width: 166px;
}
#js-block-03 .hexagon-10 {
  left: 320px;
  top: 262px;
  opacity: 0;
}
#js-block-03 .hexagon-10.is-active {
  -webkit-transition-delay: 0.9s;
  transition-delay: 0.9s;
  opacity: 1;
}
.tablet-device #js-block-03 .hexagon-10 {
  left: 640px;
  top: 524px;
}
.tablet-device #js-block-03 .hexagon-10 img {
  width: 166px;
}
#js-block-03 .hexagon-11 {
  left: 432px;
  top: 249px;
  opacity: 0;
}
#js-block-03 .hexagon-11.is-active {
  -webkit-transition-delay: 1s;
  transition-delay: 1s;
  opacity: 1;
}
.tablet-device #js-block-03 .hexagon-11 {
  left: 864px;
  top: 498px;
}
.tablet-device #js-block-03 .hexagon-11 img {
  width: 164px;
}
#js-block-03 .hexagon-12 {
  left: 388px;
  top: 319px;
  opacity: 0;
}
#js-block-03 .hexagon-12.is-active {
  -webkit-transition-delay: 1.1s;
  transition-delay: 1.1s;
  opacity: 1;
}
.tablet-device #js-block-03 .hexagon-12 {
  left: 776px;
  top: 638px;
}
.tablet-device #js-block-03 .hexagon-12 img {
  width: 162px;
}
#js-block-03 .photo-01 {
  left: -36px;
  top: 147px;
  opacity: 0;
}
#js-block-03 .photo-01.is-active {
  -webkit-transition-delay: 1.8s;
  transition-delay: 1.8s;
  opacity: 1;
}
.tablet-device #js-block-03 .photo-01 {
  left: -72px;
  top: 294px;
}
.tablet-device #js-block-03 .photo-01 img {
  width: 814px;
}
#js-block-03 .illust-01 {
  left: 0;
  top: 15px;
  opacity: 0;
}
#js-block-03 .illust-01.is-active {
  -webkit-transition-delay: 1.8s;
  transition-delay: 1.8s;
  opacity: 1;
}
.tablet-device #js-block-03 .illust-01 {
  left: 0px;
  top: 30px;
}
.tablet-device #js-block-03 .illust-01 img {
  width: 390px;
}
#js-block-03 .flash-01 {
  left: -51px;
  top: 46px;
  opacity: 0;
}
#js-block-03 .flash-01.is-active.js-anim {
  -webkit-animation: flash 7s ease 3s infinite;
  animation: flash 7s ease 3s infinite;
}
.tablet-device #js-block-03 .flash-01 {
  left: -101px;
  top: 92px;
}
.tablet-device #js-block-03 .flash-01 img {
  width: 170px;
}
#js-block-03 .flash-02 {
  left: 160px;
  top: 54px;
  opacity: 0;
}
#js-block-03 .flash-02.is-active.js-anim {
  -webkit-animation: flash 6s ease 6s infinite;
  animation: flash 6s ease 6s infinite;
}
.tablet-device #js-block-03 .flash-02 {
  left: 320px;
  top: 108px;
}
.tablet-device #js-block-03 .flash-02 img {
  width: 166px;
}
#js-block-03 .flash-03 {
  left: 245px;
  top: 199px;
  opacity: 0;
}
#js-block-03 .flash-03.is-active.js-anim {
  -webkit-animation: flash 7s ease 5s infinite;
  animation: flash 7s ease 5s infinite;
}
.tablet-device #js-block-03 .flash-03 {
  left: 490px;
  top: 398px;
}
.tablet-device #js-block-03 .flash-03 img {
  width: 166px;
}

@-webkit-keyframes flash {
  0% {
    opacity: 0;
  }

  1% {
    opacity: 1;
  }

  6% {
    opacity: 1;
  }

  11% {
    opacity: 0;
  }

  16% {
    opacity: 0;
  }

  17% {
    opacity: 1;
  }

  22% {
    opacity: 1;
  }

  27% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

@keyframes flash {
  0% {
    opacity: 0;
  }

  1% {
    opacity: 1;
  }

  6% {
    opacity: 1;
  }

  11% {
    opacity: 0;
  }

  16% {
    opacity: 0;
  }

  17% {
    opacity: 1;
  }

  22% {
    opacity: 1;
  }

  27% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

#js-block-02 {
  position: relative;
  height: 518px;
  z-index: 10;
  margin-top: -26px;
}
.tablet-device #js-block-02 {
  height: 1036px;
  margin-top: -52px;
}
#js-block-02 div, #js-block-02 h1 {
  position: absolute;
  transition: all 1s ease-out;
}
#js-block-02 .image-01 {
  top: -1px;
  left: -215px;
}
.tablet-device #js-block-02 .image-01 {
  top: -2px;
  left: -430px;
}
.tablet-device #js-block-02 .image-01 img {
  width: 1500px;
}
#js-block-02 .text-01 {
  left: 12px;
  top: 15px;
  opacity: 0;
}
#js-block-02 .text-01.is-active {
  -webkit-transition-delay: 1s;
  transition-delay: 1s;
  opacity: 1;
}
.tablet-device #js-block-02 .text-01 {
  left: 24px;
  top: 30px;
}
.tablet-device #js-block-02 .text-01 img {
  width: 578px;
}
#js-block-02 .kaleido-01 {
  left: -215px;
  top: 7px;
  -webkit-transform: scale(0.5);
  transform: scale(0.5);
  opacity: 0;
}
#js-block-02 .kaleido-01.is-active {
  -webkit-transform: scale(1);
  transform: scale(1);
  -webkit-transition-delay: 0.5s;
  transition-delay: 0.5s;
  opacity: 1;
}
.tablet-device #js-block-02 .kaleido-01 {
  left: -430px;
  top: 14px;
}
.tablet-device #js-block-02 .kaleido-01 img {
  width: 1500px;
}
#js-block-02 .kaleido-02-left {
  left: -215px;
  top: 18px;
  -webkit-transform: scale(0.5) translate(256px, 0);
  transform: scale(0.5) translate(256px, 0);
  opacity: 0;
}
#js-block-02 .kaleido-02-left.is-active {
  -webkit-transform: scale(1) translate(0);
  transform: scale(1) translate(0);
  -webkit-transition-delay: 0.5s;
  transition-delay: 0.5s;
  opacity: 1;
}
.tablet-device #js-block-02 .kaleido-02-left {
  left: -430px;
  top: 36px;
}
.tablet-device #js-block-02 .kaleido-02-left img {
  width: 580px;
}
#js-block-02 .kaleido-02-right {
  left: 250px;
  top: 0;
  -webkit-transform: scale(0.5) translate(-256px, 0);
  transform: scale(0.5) translate(-256px, 0);
  opacity: 0;
}
#js-block-02 .kaleido-02-right.is-active {
  -webkit-transform: scale(1) translate(0);
  transform: scale(1) translate(0);
  -webkit-transition-delay: 0.5s;
  transition-delay: 0.5s;
  opacity: 1;
}
.tablet-device #js-block-02 .kaleido-02-right {
  left: 500px;
  top: 0px;
}
.tablet-device #js-block-02 .kaleido-02-right img {
  width: 536px;
}
#js-block-02 .kaleido-03-left {
  left: -215px;
  top: 271px;
  -webkit-transform: translate(206px, -56px);
  transform: translate(206px, -56px);
  opacity: 0;
}
#js-block-02 .kaleido-03-left.is-active {
  -webkit-transform: translate(0);
  transform: translate(0);
  -webkit-transition-delay: 0.5s;
  transition-delay: 0.5s;
  opacity: 1;
}
.tablet-device #js-block-02 .kaleido-03-left {
  left: -430px;
  top: 542px;
}
.tablet-device #js-block-02 .kaleido-03-left img {
  width: 530px;
}
#js-block-02 .kaleido-03-right {
  left: 252px;
  top: -1px;
  -webkit-transform: translate(-156px, 106px);
  transform: translate(-156px, 106px);
  opacity: 0;
}
#js-block-02 .kaleido-03-right.is-active {
  -webkit-transform: translate(0);
  transform: translate(0);
  -webkit-transition-delay: 0.5s;
  transition-delay: 0.5s;
  opacity: 1;
}
.tablet-device #js-block-02 .kaleido-03-right {
  left: 504px;
  top: -2px;
}
.tablet-device #js-block-02 .kaleido-03-right img {
  width: 536px;
}
#js-block-02 .photo-01 {
  left: -36px;
  top: 187px;
  opacity: 0;
}
#js-block-02 .photo-01.is-active {
  -webkit-transition-delay: 1.5s;
  transition-delay: 1.5s;
  opacity: 1;
}
.tablet-device #js-block-02 .photo-01 {
  left: -72px;
  top: 374px;
}
.tablet-device #js-block-02 .photo-01 img {
  width: 478px;
}
#js-block-02 .runway-01.js-anim .run01, #js-block-02 .runway-02.js-anim .run01, #js-block-02 .runway-03.js-anim .run01 {
  -webkit-animation: flick 10s ease 0.3s infinite;
  animation: flick 10s ease 0.3s infinite;
}
#js-block-02 .runway-01.js-anim .run02, #js-block-02 .runway-02.js-anim .run02, #js-block-02 .runway-03.js-anim .run02 {
  -webkit-animation: flick 10s ease 0.6s infinite;
  animation: flick 10s ease 0.6s infinite;
}
#js-block-02 .runway-01.js-anim .run03, #js-block-02 .runway-02.js-anim .run03, #js-block-02 .runway-03.js-anim .run03 {
  -webkit-animation: flick 10s ease 0.9s infinite;
  animation: flick 10s ease 0.9s infinite;
}
#js-block-02 .runway-01 .run01, #js-block-02 .runway-02 .run01, #js-block-02 .runway-03 .run01 {
  position: absolute;
  left: -1px;
  top: 377px;
  opacity: 0;
}
.tablet-device #js-block-02 .runway-01 .run01, .tablet-device #js-block-02 .runway-02 .run01, .tablet-device #js-block-02 .runway-03 .run01 {
  left: -2px;
  top: 754px;
  width: 190px;
}
#js-block-02 .runway-01 .run02, #js-block-02 .runway-02 .run02, #js-block-02 .runway-03 .run02 {
  position: absolute;
  left: 76px;
  top: 306px;
  opacity: 0;
}
.tablet-device #js-block-02 .runway-01 .run02, .tablet-device #js-block-02 .runway-02 .run02, .tablet-device #js-block-02 .runway-03 .run02 {
  left: 152px;
  top: 612px;
  width: 274px;
}
#js-block-02 .runway-01 .run03, #js-block-02 .runway-02 .run03, #js-block-02 .runway-03 .run03 {
  position: absolute;
  left: 174px;
  top: 224px;
  opacity: 0;
}
.tablet-device #js-block-02 .runway-01 .run03, .tablet-device #js-block-02 .runway-02 .run03, .tablet-device #js-block-02 .runway-03 .run03 {
  left: 348px;
  top: 449px;
  width: 302px;
}

@-webkit-keyframes flick {
  0% {
    opacity: 0;
  }

  10% {
    opacity: 1;
  }

  30% {
    opacity: 1;
  }

  40% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}

@keyframes flick {
  0% {
    opacity: 0;
  }

  10% {
    opacity: 1;
  }

  30% {
    opacity: 1;
  }

  40% {
    opacity: 0;
  }

  100% {
    opacity: 0;
  }
}