.page_welcome-pack-bonus {
  background-color: #0e131b
}
.page_welcome-pack-bonus img {
  pointer-events: none;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none
}

main {
  box-sizing: border-box;
  width: 100%;
  max-width: 1246px;
  margin: 0 auto 80px
}
@media only screen and (max-width:1246px) {
  main {
    padding: 0 24px
  }
}
@media only screen and (max-width:400px) {
  main {
    padding: 0 16px
  }
}
main div {
  position: relative;
  box-sizing: border-box
}
main h1, main h2, main h3, main h4, main h5, main p, main span {
  margin: 0;
  color: #fff
}
.mainBgImg {
  position: absolute;
  left: 0;
  top: 0;
  max-width: 300px;
  width: 20%;
  aspect-ratio: 1
}
@media only screen and (max-width:1100px) {
  .mainBgImg {
    display: none
  }
}
.mainBgImg-rg {
  left: auto;
  right: 0
}
@media only screen and (max-width:550px) {
  .mainBgImg-rg .m-star2 {
    display: block;
    width: 40px;
    z-index: 1;
    left: 81%;
    top: -27%;
    animation: m-star1-mob 3s cubic-bezier(.6, .01, .45, 1) infinite;
    animation-delay: 1.5s
  }
}
.char1000-mob {
  width: 43%;
  left: 76%;
  top: 15%
}
.c183 {
  position: absolute;
  width: 62.33%;
  height: auto;
  animation-duration: 4s;
  animation-timing-function: cubic-bezier(.6, .01, .45, 1);
  animation-iteration-count: infinite
}
.c1 {
  left: 55%;
  top: 138%;
  animation-name: c1
}
.c2 {
  left: -24%;
  top: 136%;
  animation-name: c2
}
.c3 {
  top: 104%;
  left: 9%;
  animation-name: c3
}
.c4 {
  top: 32%;
  left: -31%;
  animation-name: c2
}
.c5 {
  top: -12%;
  left: 5%;
  animation-name: c3;
  filter: blur(2px);
  opacity: .5
}
.c1-lf {
  left: -27%;
  top: 97%;
  animation-name: c1-lf
}
.c2-lf {
  left: 4%;
  top: 148%;
  animation-name: c2-lf
}
.c3-lf {
  left: 14%;
  top: 65%;
  animation-name: c3-lf
}
.c4-lf {
  left: 3%;
  top: 4%;
  animation-name: c2-lf
}
.bg_star {
  position: absolute;
  left: 0;
  top: 0;
  width: 100%
}
@keyframes c1 {
  0% {
    transform: translateX(0) scale(1)
  }
  50% {
    transform: translateX(5%) translateY(-15%) scale(1.1) rotate(15deg)
  }
  to {
    transform: translateX(0) scale(1)
  }
}
@keyframes c2 {
  0% {
    transform: translateX(0) scale(1)
  }
  50% {
    transform: translateX(5%) translateY(-15%) scale(1.1) rotate(-15deg)
  }
  to {
    transform: translateX(0) scale(1)
  }
}
@keyframes c3 {
  0% {
    transform: translateX(0) scale(1)
  }
  50% {
    transform: translateX(5%) translateY(-15%) scale(1.1) rotate(15deg)
  }
  to {
    transform: translateX(0) scale(1)
  }
}
@keyframes c1-lf {
  0% {
    transform: translateX(0)
  }
  50% {
    transform: translateY(-3%) rotate(-5deg)
  }
  to {
    transform: translateX(0)
  }
}
@keyframes c2-lf {
  0% {
    transform: translateX(0)
  }
  50% {
    transform: translateX(1%) translateY(-2%) rotate(10deg)
  }
  to {
    transform: translateX(0)
  }
}
@keyframes c3-lf {
  0% {
    transform: translateX(0) scale(1)
  }
  50% {
    transform: translateX(1%) translateY(2%) scale(1.1) rotate(-15deg)
  }
  to {
    transform: translateX(0)
  }
}