@charset "utf-8";
body {
  width: 100%;
  min-height: 100vh;
  overflow: hidden;
}
.main {
  position: relative;
  width: 100%;
  height: 100vh;
  overflow: hidden;
  background-repeat: no-repeat;
  -o-background-size: cover;
  background-size: cover;
  background-position: center center;
  display: flex;
  justify-content: space-between;
  flex-direction: column;
}
.top {
  position: fixed;
  padding: 0 4.8%;
  right: 0;
  left: 0;
  top: 3%;
  display: flex;
  justify-content: space-between;
  align-items: center;
  z-index: 900;
}
@media screen and (max-width: 1180px) {
  .top {
    top: 2%;
  }
}
.buy {
  width: 7.34375vw;
  display: block;
}
.buy > img {
  animation: beat 1s ease 0s infinite normal;
}
@media screen and (max-width: 1180px) {
  .buy {
    width: 10.36764706vw;
  }
}
@media screen and (max-width: 860px) {
  .buy {
    width: 18.8vw;
  }
}
.logo {
  width: 20.57291667vw;
}
.logo a {
  display: block;
}
.logo a img {
  width: 100%;
  display: block;
}
@media screen and (max-width: 1180px) {
  .logo {
    width: 29.04411765vw;
  }
}
@media screen and (max-width: 860px) {
  .logo {
    width: 52.66666667vw;
  }
}
.poinn {
  pointer-events: none;
}
.fireworks-box {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
}
@media screen and (max-width: 860px) {
  .fireworks-box {
    display: none;
  }
}
.fireworks-canvas {
  pointer-events: none;
}
.main-box {
  position: absolute;
  left: 0%;
  top: 0%;
  width: 100%;
  height: 100%;
  background: url(../img/bg02.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}
@media screen and (max-width: 860px) {
  .main-box {
    background-image: url(../img/bg0m.jpg);
  }
}
.main-bg {
  width: 100%;
  height: 100%;
  display: block;
}
.main-bot {
  position: absolute;
  left: 0;
  width: 100%;
  bottom: -5.33854167vw;
}
@media screen and (max-width: 1180px) {
  .main-bot {
    bottom: -5%;
  }
}
@media screen and (max-width: 860px) {
  .main-bot {
    bottom: 0;
  }
}
.item1 {
  width: 13.17708333%;
  left: -2.5%;
  top: 4.63414634%;
  animation: satellite-move 12s linear infinite;
}
.item1 img {
  -webkit-animation: raftFloat 1.6s ease-in-out infinite alternate;
  animation: raftFloat 1.6s ease-in-out infinite alternate;
}
@media screen and (max-width: 860px) {
  .item1 {
    width: 24.93333333%;
    top: -5.90062112%;
    left: -4.5%;
  }
}
.item1a {
  width: 13.17708333%;
  right: 1%;
  top: -1%;
  animation: satellite-move 12s linear infinite;
  transform-origin: right center;
}
.item1a img {
  -webkit-animation: raftFloat 1.6s ease-in-out infinite alternate;
  animation: raftFloat 1.6s ease-in-out infinite alternate;
}
@media screen and (max-width: 860px) {
  .item1a {
    width: 24.93333333%;
    right: -5%;
  }
}
.item2 {
  width: 39.47916667%;
  left: 38.02083333%;
  top: 29%;
  transform: translateY(-50%);
}
.item2 img {
  -webkit-animation: raftFloat2 1.4s ease-in-out infinite alternate;
  animation: raftFloat2 1.4s ease-in-out infinite alternate;
  transform-origin: center bottom;
}
@media screen and (max-width: 1180px) {
  .item2 {
    width: 47.375%;
    top: 27%;
  }
}
@media screen and (max-width: 860px) {
  .item2 {
    width: 87.73333333%;
    left: 50%;
    transform: translate(-50%, -50%);
  }
}
.item3 {
  width: 26.71875%;
  left: 10.83333333%;
  top: 22.43902439%;
}
.item3 img {
  -webkit-animation: shakeX 5s infinite linear;
  animation: shakeX 5s infinite linear;
}
@media screen and (max-width: 860px) {
  .item3 {
    width: 55.46666667%;
    left: 50%;
    top: -2%;
    transform: translateX(-50%);
  }
}
.item4 {
  width: 31.875%;
  left: 5.46875%;
  top: -40%;
}
@media screen and (max-width: 860px) {
  .item4 {
    width: 104%;
    left: -6.279412%;
    top: auto;
    bottom: 80%;
  }
}
.item5 {
  width: 21.51041667%;
  left: 15.52083333%;
  top: -63.17073171%;
}
.item5 img {
  -webkit-animation: wave 7.6s infinite linear;
  animation: wave 7.6s infinite linear;
}
@media screen and (max-width: 860px) {
  .item5 {
    width: 68.13333333%;
    left: -6%;
    top: auto;
    bottom: 58%;
  }
}
.item6 {
  width: 15.98958333%;
  right: 9.89583333%;
  top: -38.04878049%;
}
.item6 img {
  -webkit-animation: wave 7.6s infinite linear;
  animation: wave 7.6s infinite linear;
}
@media screen and (max-width: 860px) {
  .item6 {
    width: 40.93333333%;
    right: -3%;
    top: auto;
    bottom: 76%;
  }
}
.item7 {
  width: 27.39583333%;
  left: -4.47916667%;
  top: -68.29268293%;
}
.item7 img {
  -webkit-animation: opacity0 0.6s infinite alternate;
  animation: opacity0 0.6s infinite alternate;
}
@media screen and (max-width: 860px) {
  .item7 {
    width: 38.67647059%;
    left: -6.32352941%;
    top: -17.5%;
  }
}
.item8 {
  width: 9.01041667%;
  left: 3.07291667%;
  top: -15.6097561%;
}
.item8 img {
  -webkit-animation: opacity2 0.6s infinite alternate;
  animation: opacity2 0.6s infinite alternate;
}
@media screen and (max-width: 860px) {
  .item8 {
    width: 12.72058824%;
    left: 4.33823529%;
    top: -4%;
  }
}
.nav-box {
  display: flex;
  align-items: center;
  justify-content: space-between;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: 53.17073171%;
  width: 66.45833333%;
  height: 12.92682927%;
}
.nav-box a {
  position: relative;
  height: 100%;
}
@media screen and (max-width: 860px) {
  .nav-box {
    top: auto;
    width: 100%;
    flex-wrap: wrap;
    height: auto;
    bottom: 9%;
  }
  .nav-box a {
    height: auto;
    width: 50%;
    margin-bottom: 2vh;
  }
  .nav-box a img {
    width: 72.28571429%;
    height: auto;
    margin: 0 auto;
  }
}
.nav-item {
  cursor: pointer;
}
.nav-item img {
  -webkit-animation: bounce1m 2.5s ease-in-out infinite;
  animation: bounce1m 2.5s ease-in-out infinite;
}
.nav-item:nth-child(1) img {
  -webkit-animation-delay: 0.2s;
  animation-delay: 0.2s;
}
.nav-item:nth-child(2) img {
  -webkit-animation-delay: 0.3s;
  animation-delay: 0.3s;
}
.nav-item:nth-child(3) img {
  -webkit-animation-delay: 0.4s;
  animation-delay: 0.4s;
}
.nav-item:nth-child(4) img {
  -webkit-animation-delay: 0.5s;
  animation-delay: 0.5s;
}
.pop-main {
  position: fixed;
  left: 0;
  right: 0;
  bottom: 0;
  height: 100%;
  background: none rgba(0, 0, 0, 0.85);
  -webkit-overflow-scrolling: touch;
  z-index: -10;
  opacity: 0;
  transition: 0.3s;
  -webkit-mask: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyB0PSIxNzc3MTkyMzIxMDE1IiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjUgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjQyNjciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMjAwLjE5NTMxMjUiIGhlaWdodD0iMjAwIj48cGF0aCBkPSJNNzc4LjQ3OSAxMDAyLjQ5NmMtMTIuMjg4IDAtMjQuNTc2LTMuMDcxLTM3Ljg4OC0xMC4yMzlMNTMzLjc0MiA4ODMuNzEzYy01LjEyLTMuMDcyLTEyLjI4OC01LjEyLTIwLjQ3OS01LjEyLTcuMTY4IDAtMTUuMzYgMi4wNDgtMjAuNDggNC4wOTZMMjg2Ljk1OSA5OTIuMjU3Yy0xMi4yODggNy4xNjgtMjQuNTc2IDEwLjIzOS0zOC45MTIgMTAuMjM5LTI0LjU3NiAwLTQ4LjEyOC0xMS4yNjQtNjQuNTEzLTI5LjY5NS0xNi4zODQtMTguNDMzLTIyLjUyNy00My4wMDgtMTguNDMyLTY3LjU4NGwzOS45MzctMjI5LjM3NmMyLjA0OC0xNC4zMzYtMy4wNzItMjguNjcyLTEzLjMxMy0zOC45MTJMMjUuODM5IDQ3Ni4xNkMyLjI4NyA0NTMuNjMzLTUuOTA1IDQyMC44NjQgNC4zMzUgMzkwLjE0NGMxMC4yMzktMzAuNzIxIDM1Ljg0LTUyLjIyNSA2Ny41ODQtNTcuMzQ1bDIyOS4zNzYtMzMuNzkyYzE0LjMzNi0yLjA0OCAyNy42NDctMTEuMjY0IDMzLjc5MS0yMy41NTJsMTAyLjQtMjA4Ljg5NmMxNC4zMzYtMjguNjcyIDQzLjAwOC00Ni4wOCA3NC43NTItNDYuMDhzNjAuNDE2IDE3LjQwOCA3NC43NTIgNDYuMDhsMTAyLjQgMjA4Ljg5NmM3LjE2OCAxMy4zMTMgMTkuNDU2IDIxLjUwNCAzMy43OTIgMjMuNTUyTDk1Mi41NTkgMzMyLjhjMzEuNzQ0IDUuMTIgNTcuMzQ0IDI2LjYyNCA2Ny41ODQgNTYuMzIgMTAuMjQgMzAuNzIgMi4wNDggNjMuNDg4LTIwLjQ4IDg2LjAxN0w4MzQuNzk5IDYzNi45MjhjLTExLjI2NSAxMC4yNC0xNS4zNiAyNC41NzYtMTMuMzEzIDM4LjkxMmwzOC45MTIgMjI4LjM1MmM0LjA5NiAyNC41NzYtMi4wNDggNDkuMTUyLTE4LjQzMiA2Ny41ODRDODI2LjYwNyA5OTEuMjMyIDgwMy4wNTUgMTAwMi40OTYgNzc4LjQ3OSAxMDAyLjQ5NnoiIGZpbGw9IiMyNzI2MzYiIHAtaWQ9IjQyNjgiPjwvcGF0aD48L3N2Zz4=) no-repeat center center;
  mask: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiBzdGFuZGFsb25lPSJubyI/PjwhRE9DVFlQRSBzdmcgUFVCTElDICItLy9XM0MvL0RURCBTVkcgMS4xLy9FTiIgImh0dHA6Ly93d3cudzMub3JnL0dyYXBoaWNzL1NWRy8xLjEvRFREL3N2ZzExLmR0ZCI+PHN2ZyB0PSIxNzc3MTkyMzIxMDE1IiBjbGFzcz0iaWNvbiIgdmlld0JveD0iMCAwIDEwMjUgMTAyNCIgdmVyc2lvbj0iMS4xIiB4bWxucz0iaHR0cDovL3d3dy53My5vcmcvMjAwMC9zdmciIHAtaWQ9IjQyNjciIHhtbG5zOnhsaW5rPSJodHRwOi8vd3d3LnczLm9yZy8xOTk5L3hsaW5rIiB3aWR0aD0iMjAwLjE5NTMxMjUiIGhlaWdodD0iMjAwIj48cGF0aCBkPSJNNzc4LjQ3OSAxMDAyLjQ5NmMtMTIuMjg4IDAtMjQuNTc2LTMuMDcxLTM3Ljg4OC0xMC4yMzlMNTMzLjc0MiA4ODMuNzEzYy01LjEyLTMuMDcyLTEyLjI4OC01LjEyLTIwLjQ3OS01LjEyLTcuMTY4IDAtMTUuMzYgMi4wNDgtMjAuNDggNC4wOTZMMjg2Ljk1OSA5OTIuMjU3Yy0xMi4yODggNy4xNjgtMjQuNTc2IDEwLjIzOS0zOC45MTIgMTAuMjM5LTI0LjU3NiAwLTQ4LjEyOC0xMS4yNjQtNjQuNTEzLTI5LjY5NS0xNi4zODQtMTguNDMzLTIyLjUyNy00My4wMDgtMTguNDMyLTY3LjU4NGwzOS45MzctMjI5LjM3NmMyLjA0OC0xNC4zMzYtMy4wNzItMjguNjcyLTEzLjMxMy0zOC45MTJMMjUuODM5IDQ3Ni4xNkMyLjI4NyA0NTMuNjMzLTUuOTA1IDQyMC44NjQgNC4zMzUgMzkwLjE0NGMxMC4yMzktMzAuNzIxIDM1Ljg0LTUyLjIyNSA2Ny41ODQtNTcuMzQ1bDIyOS4zNzYtMzMuNzkyYzE0LjMzNi0yLjA0OCAyNy42NDctMTEuMjY0IDMzLjc5MS0yMy41NTJsMTAyLjQtMjA4Ljg5NmMxNC4zMzYtMjguNjcyIDQzLjAwOC00Ni4wOCA3NC43NTItNDYuMDhzNjAuNDE2IDE3LjQwOCA3NC43NTIgNDYuMDhsMTAyLjQgMjA4Ljg5NmM3LjE2OCAxMy4zMTMgMTkuNDU2IDIxLjUwNCAzMy43OTIgMjMuNTUyTDk1Mi41NTkgMzMyLjhjMzEuNzQ0IDUuMTIgNTcuMzQ0IDI2LjYyNCA2Ny41ODQgNTYuMzIgMTAuMjQgMzAuNzIgMi4wNDggNjMuNDg4LTIwLjQ4IDg2LjAxN0w4MzQuNzk5IDYzNi45MjhjLTExLjI2NSAxMC4yNC0xNS4zNiAyNC41NzYtMTMuMzEzIDM4LjkxMmwzOC45MTIgMjI4LjM1MmM0LjA5NiAyNC41NzYtMi4wNDggNDkuMTUyLTE4LjQzMiA2Ny41ODRDODI2LjYwNyA5OTEuMjMyIDgwMy4wNTUgMTAwMi40OTYgNzc4LjQ3OSAxMDAyLjQ5NnoiIGZpbGw9IiMyNzI2MzYiIHAtaWQ9IjQyNjgiPjwvcGF0aD48L3N2Zz4=) no-repeat center center;
}
.pop-main.show {
  z-index: 999;
  opacity: 1;
  -webkit-animation: maskStarIn4 1.2s cubic-bezier(1, 0, 1, 1) forwards;
  animation: maskStarIn4 1.2s cubic-bezier(1, 0, 1, 1) forwards;
}
.pop-wapper {
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
  visibility: hidden;
  color: #fff;
  -webkit-transition: 0.3s linear;
  transition: 0.3s linear;
  margin-top: 40px;
  width: 100%;
  height: 100%;
}
.md-show {
  overflow-y: hidden;
}
.md-show body {
  overflow-y: hidden;
}
.show .pop-wapper.act {
  margin-top: 0;
  opacity: 1;
  visibility: visible;
}
.pop-img {
  position: absolute;
  width: 100%;
  left: 0;
  right: 0;
  top: 52%;
  transform: translateY(-50%);
}
.pop-close {
  position: absolute;
  right: -8%;
  top: 0;
  width: 11.7106%;
  cursor: pointer;
  transition: 0.3s;
  -webkit-transition: 0.3s;
}
.pop-close:hover {
  transform: rotate(180deg);
  -webkit-transform: rotate(180deg);
}
@media screen and (max-width: 640px) {
  .pop-close {
    right: 1%;
    top: -18%;
  }
}
.nav-next {
  position: absolute;
  width: 8.728%;
  right: 11%;
  top: -18%;
}
.nav-next img {
  -webkit-animation: shakeX 5s infinite linear;
  animation: shakeX 5s infinite linear;
}
.swiper-img-kua {
  width: 45.364%;
  margin: 0 auto;
}
@media screen and (max-width: 1180px) {
  .swiper-img-kua {
    width: 58%;
  }
}
@media screen and (max-width: 860px) {
  .swiper-img-kua {
    width: 66%;
  }
}
@media screen and (max-width: 640px) {
  .swiper-img-kua {
    width: 100%;
  }
}
.swiper-img-box {
  width: 77.0378%;
  bottom: 5.4%;
  left: 11.6792%;
  height: 51%;
}
.swiper-img-box .swiper-pagination {
  bottom: -4%;
  width: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  line-height: 1;
}
.swiper-img-box .swiper-pagination-bullet {
  background-color: rgba(255, 255, 255, 0.5);
  opacity: 1;
  margin: 0 4px;
}
.swiper-img-box .swiper-pagination-bullet-active {
  opacity: 1;
  background-color: #01ffff;
}
@media screen and (max-width: 860px) {
  .swiper-img-box .swiper-pagination-bullet {
    width: 4px;
    height: 4px;
  }
}
.swiper-img-bor {
  box-sizing: border-box;
  border-radius: 1.458vw;
  border: 2px solid #fff;
}
.swiper-img-bor .swiper-slide {
  border-radius: inherit;
  height: auto;
}
.swiper-img-bor .img {
  border-radius: inherit;
}
.swiper-img-bor .img img {
  width: 100%;
  border-radius: inherit;
}
.swiper-btn {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 6.4%;
  cursor: pointer;
  z-index: 500;
}
.swiper-btn img {
  width: 100%;
  display: block;
  transition: 0.3s;
}
.swiper-btn:hover img {
  transform: scale(1.06);
}
.swiper-prev {
  right: 97%;
}
.swiper-next {
  left: 97%;
}
.swiper-img {
  position: relative;
  overflow: hidden;
}
.swiper-img .img {
  display: block;
}
.swiper-img .img img {
  width: 100%;
  display: block;
}
.open-title {
  width: 33.98%;
  left: 49%;
  top: -5.5%;
  transform: translateX(-50%);
}
.open-by {
  width: 16.532%;
  right: 5%;
  top: 3%;
}
.open-desc {
  height: 37.92%;
  width: 77.152%;
  left: 11.0792%;
  top: 4.5%;
}
.open-desc .txt {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 100%;
  color: #00e4ff;
  font-size: 1.8015625vw;
  line-height: 1.5;
  text-align: center;
}
@media screen and (max-width: 1180px) {
  .open-desc .txt {
    font-size: 2.161875vw;
  }
}
@media screen and (max-width: 750px) {
  .open-desc .txt {
    font-size: 2.66666667vw;
  }
}
@media screen and (max-width: 640px) {
  .open-desc .txt {
    font-size: 3.75vw;
  }
}
.aitem1 {
  width: 57.979334%;
  left: 100%;
  top: 0;
  -webkit-animation: opacity2 0.6s infinite alternate;
  animation: opacity2 0.6s infinite alternate;
}
.aitem1 img {
  transform-origin: left bottom;
  animation: 1.8s ease-in-out 0s infinite alternate none running raftFloat2;
}
@media screen and (max-width: 1180px) {
  .aitem1 {
    width: 47%;
    left: 90%;
  }
}
@media screen and (max-width: 750px) {
  .aitem1 {
    width: 40%;
    top: auto;
    left: 70%;
    bottom: -25%;
  }
}
.aitem2 {
  width: 50.74%;
  right: 102%;
  top: 10.998%;
  -webkit-animation: opacity2 0.6s infinite alternate;
  animation: opacity2 0.6s infinite alternate;
}
.aitem2 img {
  -webkit-transform-origin: left bottom;
  transform-origin: left bottom;
  -webkit-animation: arotate1 3.5s infinite ease alternate;
  animation: arotate1 3.5s infinite ease alternate;
}
@media screen and (max-width: 1180px) {
  .aitem2 {
    width: 40.74%;
    right: 92%;
  }
}
@media screen and (max-width: 750px) {
  .aitem2 {
    width: 40.74%;
    right: 72%;
    top: -24.002%;
  }
}
.aitem3 {
  width: 57.2%;
  bottom: -5%;
  right: 80%;
}
.aitem3 img {
  -webkit-animation: wave 15s 0.1s infinite linear;
  animation: wave 15s 0.1s infinite linear;
}
@media screen and (max-width: 750px) {
  .aitem3 {
    width: 47.2%;
    bottom: -40%;
    right: 59%;
    z-index: 1;
  }
}
.aitem4 {
  width: 15.154%;
  right: 98%;
  top: -10%;
}
.aitem4 img {
  -webkit-animation: fireworks 3.2s linear infinite normal;
  animation: fireworks 3.2s linear infinite normal;
}
@media screen and (max-width: 750px) {
  .aitem4 {
    display: none;
  }
}
.aitem5 {
  width: 26.52123995%;
  left: 68%;
  top: -15%;
}
.aitem5 img {
  -webkit-animation: fireworks 3.2s 0.1s linear infinite normal;
  animation: fireworks 3.2s 0.1s linear infinite normal;
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom;
}
.aitem6 {
  width: 12.05510907%;
  left: 90%;
  bottom: 8%;
  -webkit-animation: opacity0 0.6s infinite alternate;
  animation: opacity0 0.6s infinite alternate;
}
.aitem6 img {
  -webkit-transform-origin: left bottom;
  transform-origin: left bottom;
  -webkit-animation: arotate1 2.5s infinite ease alternate;
  animation: arotate1 2.5s infinite ease alternate;
}
.bitem1 {
  width: 24.45464983%;
  left: 73.4%;
  top: -8%;
  -webkit-animation: opacity2 0.6s infinite alternate;
  animation: opacity2 0.6s infinite alternate;
}
.bitem1 img {
  -webkit-animation: rotation21 18s linear infinite;
  animation: rotation21 18s linear infinite;
}
.bitem2 {
  width: 15.49942595%;
  top: -5%;
  left: 4%;
}
.bitem2 img {
  -webkit-transform-origin: left bottom;
  transform-origin: left bottom;
  -webkit-animation: arotate1 2.5s infinite ease alternate;
  animation: arotate1 2.5s infinite ease alternate;
}
.bitem3 {
  width: 32.49138921%;
  top: 5%;
  right: 98%;
  -webkit-animation: opacity2 0.6s infinite alternate;
  animation: opacity2 0.6s infinite alternate;
}
.bitem3 img {
  -webkit-animation: twinkle 3.8s infinite linear;
  animation: twinkle 3.8s infinite linear;
  transform-origin: left top;
  -webkit-transform-origin: left top;
}
@media screen and (max-width: 750px) {
  .bitem3 {
    right: 80%;
    top: 100%;
  }
}
.bitem4 {
  width: 9.75889782%;
  top: 12%;
  left: 116.8%;
}
.bitem4 img {
  -webkit-animation: opacity2 0.6s infinite alternate;
  animation: opacity2 0.6s infinite alternate;
}
@media screen and (max-width: 750px) {
  .bitem4 {
    left: -1.2%;
    top: 30%;
  }
}
.bitem5 {
  width: 10.56257176%;
  top: 25%;
  left: 99.4%;
}
.bitem5 img {
  -webkit-animation: weight 0.6s ease-in-out alternate infinite;
  animation: weight 0.6s ease-in-out alternate infinite;
  -webkit-transform-origin: bottom center;
  transform-origin: bottom center;
}
@media screen and (max-width: 750px) {
  .bitem5 {
    left: 91%;
  }
}
.bitem6 {
  width: 14.58094145%;
  bottom: 16%;
  right: 102%;
}
.bitem6 img {
  -webkit-animation: weight 0.6s ease-in-out alternate infinite;
  animation: weight 0.6s ease-in-out alternate infinite;
  -webkit-transform-origin: bottom center;
  transform-origin: bottom center;
}
@media screen and (max-width: 750px) {
  .bitem6 {
    bottom: -5%;
    right: 90%;
  }
}
.bitem7 {
  width: 34.32835821%;
  bottom: 1%;
  left: 94.5%;
}
.bitem7 img {
  -webkit-animation: wave 15s infinite linear;
  animation: wave 15s infinite linear;
}
@media screen and (max-width: 750px) {
  .bitem7 {
    bottom: initial;
    top: 95%;
    left: 70%;
  }
}
.citem1 {
  width: 24.33983927%;
  top: -6%;
  right: 100%;
}
.citem1 img {
  -webkit-animation: fireworks 3.2s linear infinite normal;
  animation: fireworks 3.2s linear infinite normal;
  -webkit-transform-origin: center bottom;
  transform-origin: center bottom;
}
@media screen and (max-width: 750px) {
  .citem1 {
    right: 78%;
    top: initial;
    bottom: 95%;
  }
}
.citem2 {
  width: 33.52468427%;
  bottom: -4%;
  right: 80%;
  z-index: 10;
}
.citem2 img {
  -webkit-transform-origin: left bottom;
  transform-origin: left bottom;
  -webkit-animation: arotate1 3.5s infinite ease alternate;
  animation: arotate1 3.5s infinite ease alternate;
}
.citem3 {
  width: 12.62916188%;
  top: 18%;
  right: 94%;
}
.citem3 img {
  -webkit-animation: twinkle 3.8s infinite linear;
  animation: twinkle 3.8s infinite linear;
  transform-origin: left top;
  -webkit-transform-origin: left top;
}
@media screen and (max-width: 750px) {
  .citem3 {
    right: 89%;
    display: none;
  }
}
.citem4 {
  width: 38.00229621%;
  bottom: 1%;
  left: 92%;
}
@media screen and (max-width: 750px) {
  .citem4 {
    left: 0;
    bottom: initial;
    top: 102%;
  }
}
.citem5 {
  width: 10.56257176%;
  top: 25%;
  left: 99.4%;
}
.citem5 img {
  -webkit-animation: weight 0.6s ease-in-out alternate infinite;
  animation: weight 0.6s ease-in-out alternate infinite;
  -webkit-transform-origin: bottom center;
  transform-origin: bottom center;
}
@media screen and (max-width: 750px) {
  .citem5 {
    left: 91%;
  }
}
.citem6 {
  width: 44.66130884%;
  bottom: 2%;
  right: 93%;
}
@media screen and (max-width: 750px) {
  .citem6 {
    right: 0;
    bottom: initial;
    top: 102%;
  }
}
.ditem1 {
  width: 17.22158439%;
  right: 100%;
  top: -4%;
}
.ditem1 img {
  -webkit-animation: fireworks 3.2s linear infinite normal;
  animation: fireworks 3.2s linear infinite normal;
}
@media screen and (max-width: 750px) {
  .ditem1 {
    right: 80%;
    top: -8%;
  }
}
.ditem2 {
  width: 12.16991963%;
  left: 75%;
  bottom: 95%;
  -webkit-animation: opacity2 0.6s infinite alternate;
  animation: opacity2 0.6s infinite alternate;
}
.ditem2 img {
  -webkit-animation: twinkle 3.8s infinite linear;
  animation: twinkle 3.8s infinite linear;
  transform-origin: left top;
  -webkit-transform-origin: left top;
}
.ditem3 {
  width: 28.58783008%;
  left: 90%;
  bottom: 95%;
}
.ditem3 img {
  -webkit-animation: fireworks 3.2s linear infinite normal;
  animation: fireworks 3.2s linear infinite normal;
  transform-origin: center bottom;
  -webkit-transform-origin: center bottom;
}
@media screen and (max-width: 750px) {
  .ditem3 {
    left: 75%;
  }
}
.ditem4 {
  width: 16.53272101%;
  left: 90%;
  top: 35%;
}
.ditem4 img {
  -webkit-transform-origin: left bottom;
  transform-origin: left bottom;
  -webkit-animation: arotate1 2.5s infinite ease alternate;
  animation: arotate1 2.5s infinite ease alternate;
}
.ditem5 {
  width: 30.65442021%;
  right: 84%;
  bottom: -5%;
}
.ditem5 img {
  -webkit-animation: wave 12s infinite linear;
  animation: wave 12s infinite linear;
}
@media screen and (max-width: 750px) {
  .ditem5 {
    right: initial;
    left: 0;
    bottom: initial;
    top: 100%;
  }
}
.ditem6 {
  width: 29.62112514%;
  right: 92%;
  bottom: 42%;
}
.ditem6 img {
  -webkit-transform-origin: left bottom;
  transform-origin: left bottom;
  -webkit-animation: arotate1 2.5s infinite ease alternate;
  animation: arotate1 2.5s infinite ease alternate;
}
@media screen and (max-width: 750px) {
  .ditem6 {
    right: initial;
    left: 0;
    bottom: initial;
    top: 92%;
  }
}
.ditem7 {
  width: 32.8358209%;
  left: 94%;
  bottom: 2%;
}
.ditem7 img {
  -webkit-animation: wave 10s infinite linear;
  animation: wave 10s infinite linear;
}
@media screen and (max-width: 750px) {
  .ditem7 {
    left: initial;
    right: 0;
    bottom: initial;
    top: 92%;
  }
}