body {
  background-color: #04227c;
  background-image: url(../img/bg.jpg);
  background-position: center 48px;
  background-size: 7.5rem auto;
  background-repeat: no-repeat;
}

.ndjMain {
  width: 7.5rem;
  margin: 0 auto;
  height: 100%;
  overflow: hidden;
  position: relative;
}

.sm {
  background: url(../img/sm.ewbp) no-repeat;
  background-size: 100%;
  width: 1.12rem;
  height: 0.45rem;
  display: block;
  text-indent: -9999em;
  margin: 0.1rem 0 0 0.1rem;
}

.czli {
  text-align: center;
  margin-top: 0.2rem;
}

.czli li {
  display: inline-block;
  margin: 0 0.05rem;
}

.czli li a {
  display: block;
  text-indent: -9999em;
  background-color: #000;
  opacity: 0.7;
  border-radius: 100%;
  width: 0.82rem;
  height: 0.82rem;
  background-repeat: no-repeat;
  background-size: 100%;
}

.czli li:nth-child(1) a {
  background-image: url(../img/cz1.png);
}

.czli li:nth-child(2) a {
  background-image: url(../img/cz2.png);
}

.czli li:nth-child(3) a {
  background-image: url(../img/cz3.png);
}

.czli li:nth-child(4) a {
  background-image: url(../img/cz4.png);
}

.czli li:nth-child(5) a {
  background-image: url(../img/cz6.png);
}

.czli li:nth-child(6) a {
  background-image: url(../img/cz5.png);
}

.czli li:nth-child(7) a {
  background-image: url(../img/cz7.png);
}

.czli li a:hover {
  opacity: 0.8;
}

.czli li a.s {
  opacity: 1;
}

.czli li:nth-child(1) a.s {
  background-color: #f52626;
}

.czli li:nth-child(2) a.s {
  background-color: #02a5bd;
}

.czli li:nth-child(3) a.s {
  background-color: #ff9c00;
}

.czli li:nth-child(4) a.s {
  background-color: #a133ff;
}

.czli li:nth-child(5) a.s {
  background-color: #6baf00;
}

.czli li:nth-child(6) a.s {
  background-color: #ff23b9;
}

.czli li:nth-child(7) a.s {
  background-color: #f52626;
}

.none {
  display: none;
}

.machine {
  width: 7.5rem;
  height: 7.43rem;
  margin: 0 auto;
  position: relative;
  border-radius: 0 1.3rem 0 0;
  margin-top: 20vh;
}

.machine:after {
  content: "";
  width: 100%;
  height: 100%;
  border-radius: 0 1.3rem 0 0;
  background-image: url(../img/rq.webp);
  background-size: cover;
  position: absolute;
  display: block;
  left: 0;
  right: 0;
  top: 0;
  z-index: 1;
}

.machine2 {
  width: 7.5rem;
  height: 7.43rem;
  margin: 0 auto;
  position: relative;
  border-radius: 0 1.3rem 0 0;
}

.machine2:after {
  content: "";
  width: 100%;
  height: 100%;
  border-radius: 0 1.3rem 0 0;
  background-image: url(../img/rq2.png);
  background-size: cover;
  position: absolute;
  display: block;
  left: 0;
  right: 0;
  top: 0;
  z-index: 1;
}

.machine3 {
  width: 7.5rem;
  height: 7.43rem;
  margin: 0 auto;
  position: relative;
  border-radius: 0 1.3rem 0 0;
}

.machine3:after {
  content: "";
  width: 100%;
  height: 100%;
  border-radius: 0 1.3rem 0 0;
  background-image: url(../img/rq3.png?202110282052);
  background-size: cover;
  position: absolute;
  display: block;
  left: 0;
  right: 0;
  top: 0;
  z-index: 1;
}

.gameStart {
  padding: 0.1rem 0.41rem;
  width: 1.17rem;
  height: 1.21rem;
  display: block;
  border-radius: 50%;
  overflow: hidden;
  position: absolute;
  left: 50%;
  margin-left: -1.52rem;
  bottom: 1.1rem;
  z-index: 2;
}

.gameStart>img {
  width: 1.17rem;
  display: block;
}

.xs {
  position: absolute;
  left: 3rem;
  bottom: 1rem;
  width: 1.26rem;
  z-index: 5;
  pointer-events: none;
  -webkit-animation: guideHand 1.5s linear infinite normal;
  animation: guideHand 1.5s linear infinite normal;
}

.glassWrap {
  width: 4.4rem;
  height: 3.6rem;
  overflow: hidden;
  border-radius: 4.4rem 4.4rem 2rem 2rem;
  position: relative;
  left: 0.99rem;
  top: 0.3rem;
  z-index: 0;
}

.gameStart:active {
  -webkit-animation: pushBtn 0.2s ease-in-out;
  animation: pushBtn 0.2s ease-in-out;
  -webkit-transform-origin: center center;
  transform-origin: center center;
}

@-webkit-keyframes pushBtn {

  0%,
  to {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  70% {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
  }
}

@keyframes pushBtn {

  0%,
  to {
    -webkit-transform: rotate(0deg);
    transform: rotate(0deg);
  }

  80% {
    -webkit-transform: rotate(90deg);
    transform: rotate(90deg);
  }
}

@-webkit-keyframes guideHand {
  0% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  20%,
  80% {
    opacity: 1;
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }
}

@keyframes guideHand {
  0% {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
  }

  20%,
  80% {
    opacity: 1;
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }

  to {
    opacity: 0;
    -webkit-transform: scale(0.8);
    transform: scale(0.8);
  }
}

.glassWrap b,
.rball,
.bball,
.yball,
.pball,
.kl8_b {
  width: 0.56rem;
  height: 0.56rem;
  line-height: 0.56rem;
  font-size: 0.36rem;
  position: absolute;
  border-radius: 100%;
  background-size: cover;
  display: block;
  text-align: center;
  color: #fff;
  font-weight: bold;
  text-shadow: rgba(0, 0, 0, 0.6) 1px 0 0, rgba(0, 0, 0, 0.6) 0 1px 0,
    rgba(0, 0, 0, 0.6) -1px 0 0, rgba(0, 0, 0, 0.6) 0 -1px 0;
}

.rb b,
.rball {
  background-image: url(../img/rb.png);
}

.bb b,
.bb1 b,
.bball {
  background-image: url(../img/bb.png);
}

.yb b,
.yball,
.yb1 b {
  background-image: url(../img/yb.png);
}

.pb b,
.pball {
  background-image: url(../img/pb.png);
}

.kl8bb b {
  width: 0.4rem;
  height: 0.4rem;
  line-height: 0.4rem;
  font-size: 0.24rem;
}

.kl8bb b:nth-child(1),
.kl8bb b:nth-child(2),
.kl8bb b:nth-child(3),
.kl8bb b:nth-child(4),
.kl8bb b:nth-child(5),
.kl8bb b:nth-child(6),
.kl8bb b:nth-child(7),
.kl8bb b:nth-child(8),
.kl8_b1 {
  background-image: url(../img/kl8_b1.png);
}

.kl8bb b:nth-child(9),
.kl8bb b:nth-child(10),
.kl8bb b:nth-child(11),
.kl8bb b:nth-child(12),
.kl8bb b:nth-child(13),
.kl8bb b:nth-child(14),
.kl8bb b:nth-child(15),
.kl8bb b:nth-child(16),
.kl8_b2 {
  background-image: url(../img/kl8_b2.png);
}

.kl8bb b:nth-child(17),
.kl8bb b:nth-child(18),
.kl8bb b:nth-child(19),
.kl8bb b:nth-child(20),
.kl8bb b:nth-child(21),
.kl8bb b:nth-child(22),
.kl8bb b:nth-child(23),
.kl8bb b:nth-child(24),
.kl8_b3 {
  background-image: url(../img/kl8_b3.png);
}

.kl8bb b:nth-child(25),
.kl8bb b:nth-child(26),
.kl8bb b:nth-child(27),
.kl8bb b:nth-child(28),
.kl8bb b:nth-child(29),
.kl8bb b:nth-child(30),
.kl8bb b:nth-child(31),
.kl8bb b:nth-child(32),
.kl8_b4 {
  background-image: url(../img/kl8_b4.png);
}

.kl8bb b:nth-child(33),
.kl8bb b:nth-child(34),
.kl8bb b:nth-child(35),
.kl8bb b:nth-child(36),
.kl8bb b:nth-child(37),
.kl8bb b:nth-child(38),
.kl8bb b:nth-child(39),
.kl8bb b:nth-child(40),
.kl8_b5 {
  background-image: url(../img/kl8_b5.png);
}

.kl8bb b:nth-child(41),
.kl8bb b:nth-child(42),
.kl8bb b:nth-child(43),
.kl8bb b:nth-child(44),
.kl8bb b:nth-child(45),
.kl8bb b:nth-child(46),
.kl8bb b:nth-child(47),
.kl8bb b:nth-child(48),
.kl8_b6 {
  background-image: url(../img/kl8_b6.png);
}

.kl8bb b:nth-child(49),
.kl8bb b:nth-child(50),
.kl8bb b:nth-child(51),
.kl8bb b:nth-child(52),
.kl8bb b:nth-child(53),
.kl8bb b:nth-child(54),
.kl8bb b:nth-child(55),
.kl8bb b:nth-child(56),
.kl8_b7 {
  background-image: url(../img/kl8_b7.png);
}

.kl8bb b:nth-child(57),
.kl8bb b:nth-child(58),
.kl8bb b:nth-child(59),
.kl8bb b:nth-child(60),
.kl8bb b:nth-child(61),
.kl8bb b:nth-child(62),
.kl8bb b:nth-child(63),
.kl8bb b:nth-child(64),
.kl8_b8 {
  background-image: url(../img/kl8_b8.png);
}

.kl8bb b:nth-child(65),
.kl8bb b:nth-child(66),
.kl8bb b:nth-child(67),
.kl8bb b:nth-child(68),
.kl8bb b:nth-child(69),
.kl8bb b:nth-child(70),
.kl8bb b:nth-child(71),
.kl8bb b:nth-child(72),
.kl8_b9 {
  background-image: url(../img/kl8_b9.png);
}

.kl8bb b:nth-child(73),
.kl8bb b:nth-child(74),
.kl8bb b:nth-child(75),
.kl8bb b:nth-child(76),
.kl8bb b:nth-child(77),
.kl8bb b:nth-child(78),
.kl8bb b:nth-child(79),
.kl8bb b:nth-child(80),
.kl8_b10 {
  background-image: url(../img/kl8_b10.png);
}

p.copyright {
  line-height: 20px;
  text-align: center;
  color: #98a1d8;
  width: 100%;
  padding-bottom: 5px;
}

p.copyright em {
  display: inline-block;
  margin: 0 5px;
}

/*p.copyright a {color: #8a8686; text-decoration: none;}*/
p.copyright a {
  color: #8a8686;
  text-decoration: none;
  display: inline-block;
}

p.copyright a.ba {
  background: url(../img/beian.png) no-repeat 0 center;
  background-size: 16px;
  padding-left: 20px;
}

/*绾㈢悆浣嶇疆*/
.max_box .rb b:nth-child(1) {
  left: 0.2rem;
  bottom: 0.2rem;
}

.max_box .rb b:nth-child(2) {
  left: 0.6rem;
  bottom: 0.1rem;
}

.max_box .rb b:nth-child(3) {
  left: 1rem;
  bottom: 0.3rem;
}

.max_box .rb b:nth-child(4) {
  left: 1.2rem;
  bottom: 0.1rem;
}

.max_box .rb b:nth-child(5) {
  left: 1.7rem;
  bottom: 0.3rem;
}

.max_box .rb b:nth-child(6) {
  left: 2rem;
  bottom: 0.4rem;
}

.max_box .rb b:nth-child(7) {
  left: 2.5rem;
  bottom: 0.2rem;
}

.max_box .rb b:nth-child(8) {
  left: 2.9rem;
  bottom: 0.1rem;
}

.max_box .rb b:nth-child(9) {
  left: 3.2rem;
  bottom: 0.4rem;
}

.max_box .rb b:nth-child(10) {
  left: 3.7rem;
  bottom: 0.3rem;
}

.max_box .rb b:nth-child(11) {
  left: 0.1rem;
  bottom: 0.8rem;
}

.max_box .rb b:nth-child(12) {
  left: 0.6rem;
  bottom: 0.7rem;
}

.max_box .rb b:nth-child(13) {
  left: 1rem;
  bottom: 1rem;
}

.max_box .rb b:nth-child(14) {
  left: 1.2rem;
  bottom: 0.7rem;
}

.max_box .rb b:nth-child(15) {
  left: 1.7rem;
  bottom: 0.9rem;
}

.max_box .rb b:nth-child(16) {
  left: 2rem;
  bottom: 1rem;
}

.max_box .rb b:nth-child(17) {
  left: 2.5rem;
  bottom: 0.8rem;
}

.max_box .rb b:nth-child(18) {
  left: 2.9rem;
  bottom: 0.7rem;
}

.max_box .rb b:nth-child(19) {
  left: 3.2rem;
  bottom: 1rem;
}

.max_box .rb b:nth-child(20) {
  left: 3.7rem;
  bottom: 0.9rem;
}

.max_box .rb b:nth-child(21) {
  left: 0.1rem;
  bottom: 1.4rem;
}

.max_box .rb b:nth-child(22) {
  left: 0.6rem;
  bottom: 1.3rem;
}

.max_box .rb b:nth-child(23) {
  left: 1rem;
  bottom: 1.6rem;
}

.max_box .rb b:nth-child(24) {
  left: 1.2rem;
  bottom: 1.3rem;
}

.max_box .rb b:nth-child(25) {
  left: 1.7rem;
  bottom: 1.5rem;
}

.max_box .rb b:nth-child(26) {
  left: 2rem;
  bottom: 1.6rem;
}

.max_box .rb b:nth-child(27) {
  left: 2.5rem;
  bottom: 1.4rem;
}

.max_box .rb b:nth-child(28) {
  left: 2.9rem;
  bottom: 1.3rem;
}

.max_box .rb b:nth-child(29) {
  left: 3.2rem;
  bottom: 1.6rem;
}

.max_box .rb b:nth-child(30) {
  left: 3.7rem;
  bottom: 1.5rem;
}

.max_box .rb b:nth-child(31) {
  left: 0.43rem;
  bottom: 1.9rem;
}

.max_box .rb b:nth-child(32) {
  left: 1.4rem;
  bottom: 2rem;
}

.max_box .rb b:nth-child(33) {
  left: 2.4rem;
  bottom: 2rem;
}

.max_box .rb b:nth-child(34) {
  left: 2.97rem;
  bottom: 2.16rem;
}

.max_box .rb b:nth-child(35) {
  left: 1.9rem;
  bottom: 2.34rem;
}

/*钃濈悆浣嶇疆*/
.max_box .bb b:nth-child(1) {
  left: 0.2rem;
  bottom: 0.2rem;
}

.max_box .bb b:nth-child(2) {
  left: 0.6rem;
  bottom: 0.1rem;
}

.max_box .bb b:nth-child(3) {
  left: 1rem;
  bottom: 0.1rem;
}

.max_box .bb b:nth-child(4) {
  left: 1.6rem;
  bottom: 0.1rem;
}

.max_box .bb b:nth-child(5) {
  left: 2rem;
  bottom: 0.3rem;
}

.max_box .bb b:nth-child(6) {
  left: 2.6rem;
  bottom: 0.2rem;
}

.max_box .bb b:nth-child(7) {
  left: 3.1rem;
  bottom: 0.4rem;
}

.max_box .bb b:nth-child(8) {
  left: 3.7rem;
  bottom: 0.3rem;
}

.max_box .bb b:nth-child(9) {
  left: 0rem;
  bottom: 0.75rem;
}

.max_box .bb b:nth-child(10) {
  left: 0.6rem;
  bottom: 0.7rem;
}

.max_box .bb b:nth-child(11) {
  left: 1.1rem;
  bottom: 1rem;
}

.max_box .bb b:nth-child(12) {
  left: 1.6rem;
  bottom: 0.7rem;
}

.max_box .bb b:nth-child(13) {
  left: 2.06rem;
  bottom: 1.07rem;
}

.max_box .bb b:nth-child(14) {
  left: 2.6rem;
  bottom: 0.8rem;
}

.max_box .bb b:nth-child(15) {
  left: 3.13rem;
  bottom: 1.08rem;
}

.max_box .bb b:nth-child(16) {
  left: 3.7rem;
  bottom: 0.9rem;
}

/*鐞冨皯鐨勬椂鍊欑殑绾㈢悆浣嶇疆*/
.min_box .rb b:nth-child(1) {
  left: 0.1rem;
  bottom: 0.5rem;
}

.min_box .rb b:nth-child(2) {
  left: 0.65rem;
  bottom: 0.5rem;
}

.min_box .rb b:nth-child(3) {
  left: 1.1rem;
  bottom: 0.1rem;
}

.min_box .rb b:nth-child(4) {
  left: 1.6rem;
  bottom: 0.4rem;
}

.min_box .rb b:nth-child(5) {
  left: 2.2rem;
  bottom: 0.3rem;
}

.min_box .rb b:nth-child(6) {
  left: 2.75rem;
  bottom: 0.1rem;
}

.min_box .rb b:nth-child(7) {
  left: 3.2rem;
  bottom: 0.5rem;
}

.min_box .rb b:nth-child(8) {
  left: 3.75rem;
  bottom: 0.7rem;
}

.min_box .rb b:nth-child(9) {
  left: 1.15rem;
  bottom: 0.8rem;
}

.min_box .rb b:nth-child(10) {
  left: 2.64rem;
  bottom: 0.68rem;
}

/*澶т箰閫忓墠浜斾綅*/
.max_box .bb1 b:nth-child(1) {
  left: 0.2rem;
  bottom: 0.2rem;
}

.max_box .bb1 b:nth-child(2) {
  left: 0.6rem;
  bottom: 0.1rem;
}

.max_box .bb1 b:nth-child(3) {
  left: 1rem;
  bottom: 0.3rem;
}

.max_box .bb1 b:nth-child(4) {
  left: 1.2rem;
  bottom: 0.1rem;
}

.max_box .bb1 b:nth-child(5) {
  left: 1.7rem;
  bottom: 0.3rem;
}

.max_box .bb1 b:nth-child(6) {
  left: 2rem;
  bottom: 0.4rem;
}

.max_box .bb1 b:nth-child(7) {
  left: 2.5rem;
  bottom: 0.2rem;
}

.max_box .bb1 b:nth-child(8) {
  left: 2.9rem;
  bottom: 0.1rem;
}

.max_box .bb1 b:nth-child(9) {
  left: 3.2rem;
  bottom: 0.4rem;
}

.max_box .bb1 b:nth-child(10) {
  left: 3.7rem;
  bottom: 0.3rem;
}

.max_box .bb1 b:nth-child(11) {
  left: 0.1rem;
  bottom: 0.8rem;
}

.max_box .bb1 b:nth-child(12) {
  left: 0.6rem;
  bottom: 0.7rem;
}

.max_box .bb1 b:nth-child(13) {
  left: 1rem;
  bottom: 1rem;
}

.max_box .bb1 b:nth-child(14) {
  left: 1.2rem;
  bottom: 0.7rem;
}

.max_box .bb1 b:nth-child(15) {
  left: 1.7rem;
  bottom: 0.9rem;
}

.max_box .bb1 b:nth-child(16) {
  left: 2rem;
  bottom: 1rem;
}

.max_box .bb1 b:nth-child(17) {
  left: 2.5rem;
  bottom: 0.8rem;
}

.max_box .bb1 b:nth-child(18) {
  left: 2.9rem;
  bottom: 0.7rem;
}

.max_box .bb1 b:nth-child(19) {
  left: 3.2rem;
  bottom: 1rem;
}

.max_box .bb1 b:nth-child(20) {
  left: 3.7rem;
  bottom: 0.9rem;
}

.max_box .bb1 b:nth-child(21) {
  left: 0.1rem;
  bottom: 1.4rem;
}

.max_box .bb1 b:nth-child(22) {
  left: 0.6rem;
  bottom: 1.3rem;
}

.max_box .bb1 b:nth-child(23) {
  left: 1rem;
  bottom: 1.6rem;
}

.max_box .bb1 b:nth-child(24) {
  left: 1.2rem;
  bottom: 1.3rem;
}

.max_box .bb1 b:nth-child(25) {
  left: 1.7rem;
  bottom: 1.5rem;
}

.max_box .bb1 b:nth-child(26) {
  left: 2rem;
  bottom: 1.6rem;
}

.max_box .bb1 b:nth-child(27) {
  left: 2.5rem;
  bottom: 1.4rem;
}

.max_box .bb1 b:nth-child(28) {
  left: 2.9rem;
  bottom: 1.3rem;
}

.max_box .bb1 b:nth-child(29) {
  left: 3.2rem;
  bottom: 1.6rem;
}

.max_box .bb1 b:nth-child(30) {
  left: 3.7rem;
  bottom: 1.5rem;
}

.max_box .bb1 b:nth-child(31) {
  left: 0.43rem;
  bottom: 1.9rem;
}

.max_box .bb1 b:nth-child(32) {
  left: 1.4rem;
  bottom: 2rem;
}

.max_box .bb1 b:nth-child(33) {
  left: 2.4rem;
  bottom: 2rem;
}

.max_box .bb1 b:nth-child(34) {
  left: 2.97rem;
  bottom: 2.16rem;
}

.max_box .bb1 b:nth-child(35) {
  left: 1.9rem;
  bottom: 2.34rem;
}

/*澶т箰閫忓悗涓や綅*/
.max_box .yb b:nth-child(1) {
  left: 0.2rem;
  bottom: 0.2rem;
}

.max_box .yb b:nth-child(2) {
  left: 0.6rem;
  bottom: 0.1rem;
}

.max_box .yb b:nth-child(3) {
  left: 1rem;
  bottom: 0.1rem;
}

.max_box .yb b:nth-child(4) {
  left: 1.6rem;
  bottom: 0.1rem;
}

.max_box .yb b:nth-child(5) {
  left: 2rem;
  bottom: 0.3rem;
}

.max_box .yb b:nth-child(6) {
  left: 2.6rem;
  bottom: 0.2rem;
}

.max_box .yb b:nth-child(7) {
  left: 3.1rem;
  bottom: 0.4rem;
}

.max_box .yb b:nth-child(8) {
  left: 3.7rem;
  bottom: 0.3rem;
}

.max_box .yb b:nth-child(9) {
  left: 0rem;
  bottom: 0.75rem;
}

.max_box .yb b:nth-child(10) {
  left: 0.6rem;
  bottom: 0.7rem;
}

.max_box .yb b:nth-child(11) {
  left: 1.1rem;
  bottom: 1rem;
}

.max_box .yb b:nth-child(12) {
  left: 1.6rem;
  bottom: 0.7rem;
}

.max_box .yb b:nth-child(13) {
  left: 2.06rem;
  bottom: 1.07rem;
}

.max_box .yb b:nth-child(14) {
  left: 2.6rem;
  bottom: 0.8rem;
}

.max_box .yb b:nth-child(15) {
  left: 3.13rem;
  bottom: 1.08rem;
}

.max_box .yb b:nth-child(16) {
  left: 3.7rem;
  bottom: 0.9rem;
}

/*涓冧箰褰╁墠鍏綅*/
.max_box .yb1 b:nth-child(1) {
  left: 0.2rem;
  bottom: 0.2rem;
}

.max_box .yb1 b:nth-child(2) {
  left: 0.6rem;
  bottom: 0.1rem;
}

.max_box .yb1 b:nth-child(3) {
  left: 1rem;
  bottom: 0.3rem;
}

.max_box .yb1 b:nth-child(4) {
  left: 1.2rem;
  bottom: 0.1rem;
}

.max_box .yb1 b:nth-child(5) {
  left: 1.7rem;
  bottom: 0.3rem;
}

.max_box .yb1 b:nth-child(6) {
  left: 2rem;
  bottom: 0.4rem;
}

.max_box .yb1 b:nth-child(7) {
  left: 2.5rem;
  bottom: 0.2rem;
}

.max_box .yb1 b:nth-child(8) {
  left: 2.9rem;
  bottom: 0.1rem;
}

.max_box .yb1 b:nth-child(9) {
  left: 3.2rem;
  bottom: 0.4rem;
}

.max_box .yb1 b:nth-child(10) {
  left: 3.7rem;
  bottom: 0.3rem;
}

.max_box .yb1 b:nth-child(11) {
  left: 0.1rem;
  bottom: 0.8rem;
}

.max_box .yb1 b:nth-child(12) {
  left: 0.6rem;
  bottom: 0.7rem;
}

.max_box .yb1 b:nth-child(13) {
  left: 1rem;
  bottom: 1rem;
}

.max_box .yb1 b:nth-child(14) {
  left: 1.2rem;
  bottom: 0.7rem;
}

.max_box .yb1 b:nth-child(15) {
  left: 1.7rem;
  bottom: 0.9rem;
}

.max_box .yb1 b:nth-child(16) {
  left: 2rem;
  bottom: 1rem;
}

.max_box .yb1 b:nth-child(17) {
  left: 2.5rem;
  bottom: 0.8rem;
}

.max_box .yb1 b:nth-child(18) {
  left: 2.9rem;
  bottom: 0.7rem;
}

.max_box .yb1 b:nth-child(19) {
  left: 3.2rem;
  bottom: 1rem;
}

.max_box .yb1 b:nth-child(20) {
  left: 3.7rem;
  bottom: 0.9rem;
}

.max_box .yb1 b:nth-child(21) {
  left: 0.1rem;
  bottom: 1.4rem;
}

.max_box .yb1 b:nth-child(22) {
  left: 0.6rem;
  bottom: 1.3rem;
}

.max_box .yb1 b:nth-child(23) {
  left: 1rem;
  bottom: 1.6rem;
}

.max_box .yb1 b:nth-child(24) {
  left: 1.2rem;
  bottom: 1.3rem;
}

.max_box .yb1 b:nth-child(25) {
  left: 1.7rem;
  bottom: 1.5rem;
}

.max_box .yb1 b:nth-child(26) {
  left: 2rem;
  bottom: 1.6rem;
}

.max_box .yb1 b:nth-child(27) {
  left: 2.5rem;
  bottom: 1.4rem;
}

.max_box .yb1 b:nth-child(28) {
  left: 2.9rem;
  bottom: 1.3rem;
}

.max_box .yb1 b:nth-child(29) {
  left: 3.2rem;
  bottom: 1.6rem;
}

.max_box .yb1 b:nth-child(30) {
  left: 3.7rem;
  bottom: 1.5rem;
}

.max_box .yb1 b:nth-child(31) {
  left: 0.43rem;
  bottom: 1.9rem;
}

.max_box .yb1 b:nth-child(32) {
  left: 1.4rem;
  bottom: 2rem;
}

.max_box .yb1 b:nth-child(33) {
  left: 2.4rem;
  bottom: 2rem;
}

.max_box .yb1 b:nth-child(34) {
  left: 2.97rem;
  bottom: 2.16rem;
}

.max_box .yb1 b:nth-child(35) {
  left: 1.9rem;
  bottom: 2.34rem;
}

/*鎺掍笁鎺掍簲绱悆*/
.min_box .pb b:nth-child(1) {
  left: 0.1rem;
  bottom: 0.5rem;
}

.min_box .pb b:nth-child(2) {
  left: 0.65rem;
  bottom: 0.5rem;
}

.min_box .pb b:nth-child(3) {
  left: 1.1rem;
  bottom: 0.1rem;
}

.min_box .pb b:nth-child(4) {
  left: 1.6rem;
  bottom: 0.4rem;
}

.min_box .pb b:nth-child(5) {
  left: 2.2rem;
  bottom: 0.3rem;
}

.min_box .pb b:nth-child(6) {
  left: 2.75rem;
  bottom: 0.1rem;
}

.min_box .pb b:nth-child(7) {
  left: 3.2rem;
  bottom: 0.5rem;
}

.min_box .pb b:nth-child(8) {
  left: 3.75rem;
  bottom: 0.7rem;
}

.min_box .pb b:nth-child(9) {
  left: 1.15rem;
  bottom: 0.8rem;
}

.min_box .pb b:nth-child(10) {
  left: 2.64rem;
  bottom: 0.68rem;
}

/*蹇箰8鐨勭悆浣嶇疆*/
.max_box .kl8bb b:nth-child(1) {
  left: 0.2rem;
  bottom: 0.2rem;
}

.max_box .kl8bb b:nth-child(2) {
  left: 0.6rem;
  bottom: 0.1rem;
}

.max_box .kl8bb b:nth-child(3) {
  left: 1rem;
  bottom: 0.3rem;
}

.max_box .kl8bb b:nth-child(4) {
  left: 1.2rem;
  bottom: 0.1rem;
}

.max_box .kl8bb b:nth-child(5) {
  left: 1.7rem;
  bottom: 0.3rem;
}

.max_box .kl8bb b:nth-child(6) {
  left: 2rem;
  bottom: 0.4rem;
}

.max_box .kl8bb b:nth-child(7) {
  left: 2.5rem;
  bottom: 0.2rem;
}

.max_box .kl8bb b:nth-child(8) {
  left: 2.9rem;
  bottom: 0.1rem;
}

.max_box .kl8bb b:nth-child(9) {
  left: 3.1rem;
  bottom: 0.4rem;
}

.max_box .kl8bb b:nth-child(10) {
  left: 3.7rem;
  bottom: 0.3rem;
}

.max_box .kl8bb b:nth-child(41) {
  left: 0.1rem;
  bottom: 0.5rem;
}

.max_box .kl8bb b:nth-child(12) {
  left: 0.6rem;
  bottom: 0.5rem;
}

.max_box .kl8bb b:nth-child(13) {
  left: 1rem;
  bottom: 0.4rem;
}

.max_box .kl8bb b:nth-child(14) {
  left: 1.3rem;
  bottom: 0.5rem;
}

.max_box .kl8bb b:nth-child(15) {
  left: 1.7rem;
  bottom: 0.6rem;
}

.max_box .kl8bb b:nth-child(16) {
  left: 2rem;
  bottom: 0.5rem;
}

.max_box .kl8bb b:nth-child(47) {
  left: 2.3rem;
  bottom: 0.5rem;
}

.max_box .kl8bb b:nth-child(18) {
  left: 2.6rem;
  bottom: 0.4rem;
}

.max_box .kl8bb b:nth-child(19) {
  left: 2.8rem;
  bottom: 0.6rem;
}

.max_box .kl8bb b:nth-child(20) {
  left: 3.2rem;
  bottom: 0.6rem;
}

.max_box .kl8bb b:nth-child(21) {
  left: 0.1rem;
  bottom: 0.8rem;
}

.max_box .kl8bb b:nth-child(72) {
  left: 0.4rem;
  bottom: 0.8rem;
}

.max_box .kl8bb b:nth-child(23) {
  left: 0.8rem;
  bottom: 0.8rem;
}

.max_box .kl8bb b:nth-child(44) {
  left: 1.2rem;
  bottom: 0.7rem;
}

.max_box .kl8bb b:nth-child(25) {
  left: 1.5rem;
  bottom: 0.8rem;
}

.max_box .kl8bb b:nth-child(26) {
  left: 2rem;
  bottom: 0.8rem;
}

.max_box .kl8bb b:nth-child(27) {
  left: 2.3rem;
  bottom: 0.7rem;
}

.max_box .kl8bb b:nth-child(78) {
  left: 2.5rem;
  bottom: 0.8rem;
}

.max_box .kl8bb b:nth-child(29) {
  left: 2.9rem;
  bottom: 0.9rem;
}

.max_box .kl8bb b:nth-child(30) {
  left: 3.3rem;
  bottom: 1rem;
}

.max_box .kl8bb b:nth-child(31) {
  left: 3.5rem;
  bottom: 0.5rem;
}

.max_box .kl8bb b:nth-child(32) {
  left: 3.8rem;
  bottom: 0.7rem;
}

.max_box .kl8bb b:nth-child(33) {
  left: 3.5rem;
  bottom: 0.8rem;
}

.max_box .kl8bb b:nth-child(34) {
  left: 4rem;
  bottom: 1rem;
}

.max_box .kl8bb b:nth-child(35) {
  left: 1.9rem;
  bottom: 1rem;
}

.max_box .kl8bb b:nth-child(36) {
  left: 0.43rem;
  bottom: 1.1rem;
}

.max_box .kl8bb b:nth-child(37) {
  left: 1.4rem;
  bottom: 1.1rem;
}

.max_box .kl8bb b:nth-child(58) {
  left: 2.2rem;
  bottom: 1.1rem;
}

.max_box .kl8bb b:nth-child(39) {
  left: 2.97rem;
  bottom: 1.2rem;
}

.max_box .kl8bb b:nth-child(40) {
  left: 1.7rem;
  bottom: 1.3rem;
}

.max_box .kl8bb b:nth-child(411) {
  left: 0;
  bottom: 1.2rem;
}

.max_box .kl8bb b:nth-child(42) {
  left: 0.7rem;
  bottom: 1.1rem;
}

.max_box .kl8bb b:nth-child(43) {
  left: 1rem;
  bottom: 1.1rem;
}

.max_box .kl8bb b:nth-child(24) {
  left: 1.2rem;
  bottom: 1.4rem;
}

.max_box .kl8bb b:nth-child(45) {
  left: 1.9rem;
  bottom: 1.3rem;
}

.max_box .kl8bb b:nth-child(46) {
  left: 2.5rem;
  bottom: 1.2rem;
}

.max_box .kl8bb b:nth-child(17) {
  left: 2.7rem;
  bottom: 1.3rem;
}

.max_box .kl8bb b:nth-child(48) {
  left: 3.2rem;
  bottom: 1.3rem;
}

.max_box .kl8bb b:nth-child(49) {
  left: 3.5rem;
  bottom: 1.1rem;
}

.max_box .kl8bb b:nth-child(50) {
  left: 3.7rem;
  bottom: 1.3rem;
}

.max_box .kl8bb b:nth-child(51) {
  left: 0.2rem;
  bottom: 1.4rem;
}

.max_box .kl8bb b:nth-child(52) {
  left: 0.6rem;
  bottom: 1.4rem;
}

.max_box .kl8bb b:nth-child(53) {
  left: 0.9rem;
  bottom: 1.5rem;
}

.max_box .kl8bb b:nth-child(54) {
  left: 1.4rem;
  bottom: 1.5rem;
}

.max_box .kl8bb b:nth-child(75) {
  left: 1.7rem;
  bottom: 1.6rem;
}

.max_box .kl8bb b:nth-child(56) {
  left: 2rem;
  bottom: 1.5rem;
}

.max_box .kl8bb b:nth-child(67) {
  left: 2.3rem;
  bottom: 1.5rem;
}

.max_box .kl8bb b:nth-child(38) {
  left: 2.9rem;
  bottom: 1.6rem;
}

.max_box .kl8bb b:nth-child(59) {
  left: 3.2rem;
  bottom: 1.6rem;
}

.max_box .kl8bb b:nth-child(60) {
  left: 3.4rem;
  bottom: 1.4rem;
}

.max_box .kl8bb b:nth-child(71) {
  left: 3.6rem;
  bottom: 1.5rem;
}

.max_box .kl8bb b:nth-child(62) {
  left: 4rem;
  bottom: 1.4rem;
}

.max_box .kl8bb b:nth-child(63) {
  left: 0.1rem;
  bottom: 1.7rem;
}

.max_box .kl8bb b:nth-child(64) {
  left: 0.5rem;
  bottom: 1.7rem;
}

.max_box .kl8bb b:nth-child(65) {
  left: 1.7rem;
  bottom: 1.6rem;
}

.max_box .kl8bb b:nth-child(66) {
  left: 0.7rem;
  bottom: 1.8rem;
}

.max_box .kl8bb b:nth-child(57) {
  left: 1rem;
  bottom: 1.7rem;
}

.max_box .kl8bb b:nth-child(68) {
  left: 1.4rem;
  bottom: 1.8rem;
}

.max_box .kl8bb b:nth-child(69) {
  left: 1.7rem;
  bottom: 2rem;
}

.max_box .kl8bb b:nth-child(70) {
  left: 2rem;
  bottom: 1.8rem;
}

.max_box .kl8bb b:nth-child(61) {
  left: 2.5rem;
  bottom: 1.6rem;
}

.max_box .kl8bb b:nth-child(22) {
  left: 2.6rem;
  bottom: 1.8rem;
}

.max_box .kl8bb b:nth-child(73) {
  left: 2.3rem;
  bottom: 1.9rem;
}

.max_box .kl8bb b:nth-child(74) {
  left: 2.8rem;
  bottom: 2rem;
}

.max_box .kl8bb b:nth-child(55) {
  left: 3.1rem;
  bottom: 1.9rem;
}

.max_box .kl8bb b:nth-child(76) {
  left: 3.4rem;
  bottom: 1.8rem;
}

.max_box .kl8bb b:nth-child(77) {
  left: 3.8rem;
  bottom: 1.7rem;
}

.max_box .kl8bb b:nth-child(28) {
  left: 0.3rem;
  bottom: 2rem;
}

.max_box .kl8bb b:nth-child(79) {
  left: 0.9rem;
  bottom: 2rem;
}

.max_box .kl8bb b:nth-child(80) {
  left: 1.2rem;
  bottom: 2.1rem;
}

/*鐞冧綋涔卞姩*/
.ballMove b {
  -webkit-animation: ballMove1 0.8s ease-in-out infinite;
  animation: ballMove1 0.8s ease-in-out infinite;
}

.ballMove b:nth-child(2n) {
  -webkit-animation: ballMove2 0.6s ease-in-out infinite;
  animation: ballMove2 0.6s ease-in-out infinite;
}

.ballMove b:nth-child(3n) {
  -webkit-animation: ballMove3 0.4s ease-in-out infinite;
  animation: ballMove3 0.4s ease-in-out infinite;
}

.ballMove b:nth-child(4n) {
  -webkit-animation: ballMove4 0.6s ease-in-out infinite;
  animation: ballMove4 0.6s ease-in-out infinite;
}

.ballMove b:nth-child(6n) {
  -webkit-animation: ballMove6 0.5s ease-in-out infinite;
  animation: ballMove6 0.5s ease-in-out infinite;
}

.ballMove b:nth-child(7n) {
  -webkit-animation: ballMove7 0.7s ease-in-out infinite;
  animation: ballMove7 0.7s ease-in-out infinite;
}

.ballMove b:nth-child(8n) {
  -webkit-animation: ballMove8 0.3s ease-in-out infinite;
  animation: ballMove8 0.3s ease-in-out infinite;
}

.ballMove b:nth-child(9n) {
  -webkit-animation: ballMove9 0.6s ease-in-out infinite;
  animation: ballMove9 0.6s ease-in-out infinite;
}

@-webkit-keyframes ballMove1 {

  0%,
  to {
    -webkit-transform: translate(0) rotate(70deg);
    transform: translate(0) rotate(70deg);
  }

  20% {
    -webkit-transform: translate(1.8rem, -1rem) rotate(140deg);
    transform: translate(1.8rem, -1rem) rotate(140deg);
  }

  40% {
    -webkit-transform: translateY(-0.5rem) rotate(210deg);
    transform: translateY(-0.5rem) rotate(210deg);
  }

  60% {
    -webkit-transform: translate(2rem) rotate(280deg);
    transform: translate(2rem) rotate(280deg);
  }

  80% {
    -webkit-transform: translateY(-1.2rem) rotate(350deg);
    transform: translateY(-1.2rem) rotate(350deg);
  }
}

@keyframes ballMove1 {

  0%,
  to {
    -webkit-transform: translate(0) rotate(70deg);
    transform: translate(0) rotate(70deg);
  }

  20% {
    -webkit-transform: translate(1.8rem, -1rem) rotate(140deg);
    transform: translate(1.8rem, -1rem) rotate(140deg);
  }

  40% {
    -webkit-transform: translateY(-0.5rem) rotate(210deg);
    transform: translateY(-0.5rem) rotate(210deg);
  }

  60% {
    -webkit-transform: translate(2rem) rotate(280deg);
    transform: translate(2rem) rotate(280deg);
  }

  80% {
    -webkit-transform: translateY(-1.2rem) rotate(350deg);
    transform: translateY(-1.2rem) rotate(350deg);
  }
}

@-webkit-keyframes ballMove2 {

  0%,
  to {
    -webkit-transform: translate(0) rotate(70deg);
    transform: translate(0) rotate(70deg);
  }

  20% {
    -webkit-transform: translate(-0.5rem, -1rem) rotate(140deg);
    transform: translate(-0.5rem, -1rem) rotate(140deg);
  }

  40% {
    -webkit-transform: translate(1.2rem, -0.5rem) rotate(210deg);
    transform: translate(1.2rem, -0.5rem) rotate(210deg);
  }

  60% {
    -webkit-transform: translate(-0.5rem, -0.5rem) rotate(280deg);
    transform: translate(-0.5rem, -0.5rem) rotate(280deg);
  }

  80% {
    -webkit-transform: translate(1em, -1.2rem) rotate(350deg);
    transform: translate(1rem, -1.2rem) rotate(350deg);
  }
}

@keyframes ballMove2 {

  0%,
  to {
    -webkit-transform: translate(0) rotate(70deg);
    transform: translate(0) rotate(70deg);
  }

  20% {
    -webkit-transform: translate(-0.5rem, -1em) rotate(140deg);
    transform: translate(-0.5rem, -1rem) rotate(140deg);
  }

  40% {
    -webkit-transform: translate(1.2rem, -0.5rem) rotate(210deg);
    transform: translate(1.2rem, -0.5rem) rotate(210deg);
  }

  60% {
    -webkit-transform: translate(-0.5rem, -0.5rem) rotate(280deg);
    transform: translate(-0.5rem, -0.5rem) rotate(280deg);
  }

  80% {
    -webkit-transform: translate(1rem, -1.2rem) rotate(350deg);
    transform: translate(1rem, -1.2rem) rotate(350deg);
  }
}

@-webkit-keyframes ballMove3 {

  0%,
  to {
    -webkit-transform: translate(0) rotate(120deg);
    transform: translate(0) rotate(120deg);
  }

  33% {
    -webkit-transform: translate(0.8rem, -1.3rem) rotate(240deg);
    transform: translate(0.8rem, -1.3rem) rotate(240deg);
  }

  67% {
    -webkit-transform: translate(-1.6rem, -0.2rem) rotate(360deg);
    transform: translate(-1.6rem, -0.2rem) rotate(360deg);
  }
}

@keyframes ballMove3 {

  0%,
  to {
    -webkit-transform: translate(0) rotate(120deg);
    transform: translate(0) rotate(120deg);
  }

  33% {
    -webkit-transform: translate(0.8rem, -1.3rem) rotate(240deg);
    transform: translate(0.8rem, -1.3rem) rotate(240deg);
  }

  67% {
    -webkit-transform: translate(-1.6rem, -0.2rem) rotate(360deg);
    transform: translate(-1.6rem, -0.2rem) rotate(360deg);
  }
}

@-webkit-keyframes ballMove4 {

  0%,
  to {
    -webkit-transform: translate(0) rotate(120deg);
    transform: translate(0) rotate(120deg);
  }

  33% {
    -webkit-transform: translate(-2.1rem, -1rem) rotate(240deg);
    transform: translate(-2.1rem, -1rem) rotate(240deg);
  }

  67% {
    -webkit-transform: translate(-0.3rem, -0.5rem) rotate(360deg);
    transform: translate(-0.3rem, -0.5rem) rotate(360deg);
  }
}

@keyframes ballMove4 {

  0%,
  to {
    -webkit-transform: translate(0) rotate(120deg);
    transform: translate(0) rotate(120deg);
  }

  33% {
    -webkit-transform: translate(-2.1rem, -1rem) rotate(240deg);
    transform: translate(-2.1rem, -1rem) rotate(240deg);
  }

  67% {
    -webkit-transform: translate(-0.3rem, -0.5rem) rotate(360deg);
    transform: translate(-0.3rem, -0.5rem) rotate(360deg);
  }
}

@-webkit-keyframes ballMove6 {

  0%,
  to {
    -webkit-transform: translate(0) rotate(120deg);
    transform: translate(0) rotate(120deg);
  }

  33% {
    -webkit-transform: translateY(-0.5rem) rotate(240deg);
    transform: translateY(-0.5rem) rotate(240deg);
  }

  67% {
    -webkit-transform: translate(1.1rem, 1rem) rotate(360deg);
    transform: translate(1.1rem, 1rem) rotate(360deg);
  }
}

@keyframes ballMove6 {

  0%,
  to {
    -webkit-transform: translate(0) rotate(120deg);
    transform: translate(0) rotate(120deg);
  }

  33% {
    -webkit-transform: translateY(-0.5rem) rotate(240deg);
    transform: translateY(-0.5rem) rotate(240deg);
  }

  67% {
    -webkit-transform: translate(1.1rem, 1rem) rotate(360deg);
    transform: translate(1.1rem, 1rem) rotate(360deg);
  }
}

@-webkit-keyframes ballMove7 {

  0%,
  to {
    -webkit-transform: translate(0) rotate(70deg);
    transform: translate(0) rotate(70deg);
  }

  20% {
    -webkit-transform: translate(0.5rem, -0.5rem) rotate(140deg);
    transform: translate(0.5rem, -0.5rem) rotate(140deg);
  }

  40% {
    -webkit-transform: translate(0.6rem, 1rem) rotate(210deg);
    transform: translate(0.6rem, 1rem) rotate(210deg);
  }

  60% {
    -webkit-transform: translate(-0.6rem, -0.2rem) rotate(280deg);
    transform: translate(-0.6rem, -0.2rem) rotate(280deg);
  }

  80% {
    -webkit-transform: translate(1rem, 1.8rem) rotate(360deg);
    transform: translate(1rem, 1.8rem) rotate(360deg);
  }
}

@keyframes ballMove7 {

  0%,
  to {
    -webkit-transform: translate(0) rotate(70deg);
    transform: translate(0) rotate(70deg);
  }

  20% {
    -webkit-transform: translate(0.5rem, -0.5rem) rotate(140deg);
    transform: translate(0.5rem, -0.5rem) rotate(140deg);
  }

  40% {
    -webkit-transform: translate(0.6rem, 1rem) rotate(210deg);
    transform: translate(0.6rem, 1rem) rotate(210deg);
  }

  60% {
    -webkit-transform: translate(-0.6rem, -0.2rem) rotate(280deg);
    transform: translate(-0.6rem, -0.2rem) rotate(280deg);
  }

  80% {
    -webkit-transform: translate(1rem, 1.8rem) rotate(360deg);
    transform: translate(1rem, 1.8rem) rotate(360deg);
  }
}

@-webkit-keyframes ballMove8 {

  0%,
  to {
    -webkit-transform: translate(0) rotate(70deg);
    transform: translate(0) rotate(70deg);
  }

  20% {
    -webkit-transform: translateY(-0.8rem) rotate(140deg);
    transform: translateY(-0.8rem) rotate(140deg);
  }

  40% {
    -webkit-transform: translate(-1.2rem, 1rem) rotate(210deg);
    transform: translate(-1.2rem, 1rem) rotate(210deg);
  }

  60% {
    -webkit-transform: translate(-0.2rem, -1.4rem) rotate(280deg);
    transform: translate(-0.2rem, -1.4rem) rotate(280deg);
  }

  80% {
    -webkit-transform: translate(0.4rem, 1rem) rotate(360deg);
    transform: translate(0.4rem, 1rem) rotate(360deg);
  }
}

@keyframes ballMove8 {

  0%,
  to {
    -webkit-transform: translate(0) rotate(70deg);
    transform: translate(0) rotate(70deg);
  }

  20% {
    -webkit-transform: translateY(-0.8rem) rotate(140deg);
    transform: translateY(-0.8rem) rotate(140deg);
  }

  40% {
    -webkit-transform: translate(-1.2rem, 1rem) rotate(210deg);
    transform: translate(-1.2rem, 1rem) rotate(210deg);
  }

  60% {
    -webkit-transform: translate(-0.2rem, -1.4rem) rotate(280deg);
    transform: translate(-0.2rem, -1.4rem) rotate(280deg);
  }

  80% {
    -webkit-transform: translate(0.4rem, 1rem) rotate(360deg);
    transform: translate(0.4rem, 1rem) rotate(360deg);
  }
}

@-webkit-keyframes ballMove9 {

  0%,
  to {
    -webkit-transform: translate(0) rotate(70deg);
    transform: translate(0) rotate(70deg);
  }

  20% {
    -webkit-transform: translate(-0.7rem, 1.4rem) rotate(140deg);
    transform: translate(-0.7rem, 1.4rem) rotate(140deg);
  }

  40% {
    -webkit-transform: translate(-2.7rem, 1rem) rotate(210deg);
    transform: translate(-2.7rem, 1rem) rotate(210deg);
  }

  60% {
    -webkit-transform: translate(-1.2rem, -0.8rem) rotate(280deg);
    transform: translate(-1.2rem, -0.8rem) rotate(280deg);
  }

  80% {
    -webkit-transform: translate(-0.2rem, 0.5rem) rotate(360deg);
    transform: translate(-0.2rem, 0.5rem) rotate(360deg);
  }
}

@keyframes ballMove9 {

  0%,
  to {
    -webkit-transform: translate(0) rotate(70deg);
    transform: translate(0) rotate(70deg);
  }

  20% {
    -webkit-transform: translate(-0.7rem, 1.4rem) rotate(140deg);
    transform: translate(-0.7rem, 1.4rem) rotate(140deg);
  }

  40% {
    -webkit-transform: translate(-2.7rem, 1rem) rotate(210deg);
    transform: translate(-2.7rem, 1rem) rotate(210deg);
  }

  60% {
    -webkit-transform: translate(-1.2rem, -0.8rem) rotate(280deg);
    transform: translate(-1.2rem, -0.8rem) rotate(280deg);
  }

  80% {
    -webkit-transform: translate(-0.2rem, 0.5rem) rotate(360deg);
    transform: translate(-0.2rem, 0.5rem) rotate(360deg);
  }
}

/*鐞冧綋鎺夎惤*/
.ballDown b:nth-child(1),
.ballDown b:nth-child(3),
.ballDown b:nth-child(5),
.ballDown b:nth-child(7),
.ballDown b:nth-child(8) {
  transform: rotate(7deg);
  -webkit-animation: ballDown 0.6s linear 0.4s backwards;
  animation: ballDown 0.6s linear 0.4s backwards;
}

.ballDown b:nth-child(2),
.ballDown b:nth-child(4),
.ballDown b:nth-child(6),
.ballDown b:nth-child(9),
.ballDown b:nth-child(10) {
  transform: rotate(-12deg);
  -webkit-animation: ballDown 0.4s linear 0.6s backwards;
  animation: ballDown 0.4s linear 0.6s backwards;
}

.ballDown b:nth-child(11),
.ballDown b:nth-child(12),
.ballDown b:nth-child(15),
.ballDown b:nth-child(17),
.ballDown b:nth-child(18) {
  transform: rotate(-21deg);
  -webkit-animation: ballDown 0.7s linear 0.8s backwards;
  animation: ballDown 0.7s linear 0.8s backwards;
}

.ballDown b:nth-child(13),
.ballDown b:nth-child(14),
.ballDown b:nth-child(16),
.ballDown b:nth-child(19),
.ballDown b:nth-child(20) {
  transform: rotate(16deg);
  -webkit-animation: ballDown 0.3s linear 1s backwards;
  animation: ballDown 0.3s linear 1s backwards;
}

.ballDown b:nth-child(22),
.ballDown b:nth-child(24),
.ballDown b:nth-child(25),
.ballDown b:nth-child(27),
.ballDown b:nth-child(30) {
  transform: rotate(19deg);
  -webkit-animation: ballDown 0.5s linear 1.2s backwards;
  animation: ballDown 0.5s linear 1.2s backwards;
}

.ballDown b:nth-child(21),
.ballDown b:nth-child(23),
.ballDown b:nth-child(26),
.ballDown b:nth-child(28),
.ballDown b:nth-child(29),
.ballDown b:nth-child(37) {
  transform: rotate(12deg);
  -webkit-animation: ballDown 0.6s linear 1.4s backwards;
  animation: ballDown 0.6s linear 1.4s backwards;
}

.ballDown b:nth-child(32),
.ballDown b:nth-child(35),
.ballDown b:nth-child(38),
.ballDown b:nth-child(40) {
  transform: rotate(-30deg);
  -webkit-animation: ballDown 1.5s linear 0.9s backwards;
  animation: ballDown 1.5s linear 0.9s backwards;
}

.ballDown b:nth-child(31),
.ballDown b:nth-child(33),
.ballDown b:nth-child(34),
.ballDown b:nth-child(36),
.ballDown b:nth-child(39) {
  transform: rotate(14deg);
  -webkit-animation: ballDown 1.7s linear 0.9s backwards;
  animation: ballDown 1.7s linear 0.9s backwards;
}

.ballDown b:nth-child(41),
.ballDown b:nth-child(43),
.ballDown b:nth-child(45),
.ballDown b:nth-child(47),
.ballDown b:nth-child(48) {
  transform: rotate(7deg);
  -webkit-animation: ballDown 0.6s linear 0.4s backwards;
  animation: ballDown 0.6s linear 0.4s backwards;
}

.ballDown b:nth-child(42),
.ballDown b:nth-child(44),
.ballDown b:nth-child(46),
.ballDown b:nth-child(49),
.ballDown b:nth-child(50) {
  transform: rotate(-12deg);
  -webkit-animation: ballDown 0.4s linear 0.6s backwards;
  animation: ballDown 0.4s linear 0.6s backwards;
}

.ballDown b:nth-child(51),
.ballDown b:nth-child(52),
.ballDown b:nth-child(55),
.ballDown b:nth-child(57),
.ballDown b:nth-child(58) {
  transform: rotate(-21deg);
  -webkit-animation: ballDown 0.7s linear 0.8s backwards;
  animation: ballDown 0.7s linear 0.8s backwards;
}

.ballDown b:nth-child(53),
.ballDown b:nth-child(54),
.ballDown b:nth-child(56),
.ballDown b:nth-child(59),
.ballDown b:nth-child(60) {
  transform: rotate(16deg);
  -webkit-animation: ballDown 0.3s linear 1s backwards;
  animation: ballDown 0.3s linear 1s backwards;
}

.ballDown b:nth-child(62),
.ballDown b:nth-child(64),
.ballDown b:nth-child(65),
.ballDown b:nth-child(67),
.ballDown b:nth-child(70) {
  transform: rotate(19deg);
  -webkit-animation: ballDown 0.5s linear 1.2s backwards;
  animation: ballDown 0.5s linear 1.2s backwards;
}

.ballDown b:nth-child(61),
.ballDown b:nth-child(63),
.ballDown b:nth-child(66),
.ballDown b:nth-child(68),
.ballDown b:nth-child(69),
.ballDown b:nth-child(77) {
  transform: rotate(12deg);
  -webkit-animation: ballDown 0.6s linear 1.4s backwards;
  animation: ballDown 0.6s linear 1.4s backwards;
}

.ballDown b:nth-child(72),
.ballDown b:nth-child(75),
.ballDown b:nth-child(78),
.ballDown b:nth-child(80) {
  transform: rotate(-30deg);
  -webkit-animation: ballDown 1.5s linear 0.9s backwards;
  animation: ballDown 1.5s linear 0.9s backwards;
}

.ballDown b:nth-child(71),
.ballDown b:nth-child(73),
.ballDown b:nth-child(74),
.ballDown b:nth-child(76),
.ballDown b:nth-child(79) {
  transform: rotate(14deg);
  -webkit-animation: ballDown 1.7s linear 0.9s backwards;
  animation: ballDown 1.7s linear 0.9s backwards;
}

@-webkit-keyframes ballDown {
  0% {
    -webkit-transform: translateY(-200%);
    transform: translateY(-200%);
    opacity: 0;
  }

  5% {
    -webkit-transform: translateY(-200%);
    transform: translateY(-200%);
  }

  15% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  30% {
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
  }

  40% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  50% {
    -webkit-transform: translateY(-60%);
    transform: translateY(-60%);
  }

  70% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  80% {
    -webkit-transform: translateY(-30%);
    transform: translateY(-30%);
  }

  90% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  95% {
    -webkit-transform: translateY(-14%);
    transform: translateY(-14%);
  }

  97% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  99% {
    -webkit-transform: translateY(-6%);
    transform: translateY(-6%);
  }

  to {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}

@keyframes ballDown {
  0% {
    -webkit-transform: translateY(-200%);
    transform: translateY(-200%);
    opacity: 0;
  }

  5% {
    -webkit-transform: translateY(-200%);
    transform: translateY(-200%);
  }

  15% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  30% {
    -webkit-transform: translateY(-100%);
    transform: translateY(-100%);
  }

  40% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  50% {
    -webkit-transform: translateY(-60%);
    transform: translateY(-60%);
  }

  70% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  80% {
    -webkit-transform: translateY(-30%);
    transform: translateY(-30%);
  }

  90% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  95% {
    -webkit-transform: translateY(-14%);
    transform: translateY(-14%);
  }

  97% {
    -webkit-transform: translateY(0);
    transform: translateY(0);
  }

  99% {
    -webkit-transform: translateY(-6%);
    transform: translateY(-6%);
  }

  to {
    -webkit-transform: translateY(0);
    transform: translateY(0);
    opacity: 1;
  }
}

/*鐞冧綋婊氬姩-闂撮殧3s*/
.ballscroll b {
  position: absolute;
  top: 0.6rem;
  right: 2.25rem;
}

.ballscroll b:nth-child(1) {
  -webkit-animation: boom1 2s linear forwards;
  animation: boom1 2s linear forwards;
}

@-webkit-keyframes boom1 {
  0% {
    -webkit-transform: translate(0) rotate(0deg);
    transform: translate(0) rotate(0deg);
  }

  5% {
    -webkit-transform: translate(0.5rem, -0.07rem) rotate(-90deg);
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  7% {
    -webkit-transform: translate(0.75rem, 0.15rem) rotate(-180deg);
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  9% {
    -webkit-transform: translate(0.9rem, 0.45rem) rotate(-270deg);
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  14% {
    -webkit-transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
    transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
  }

  40% {
    -webkit-transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
    transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
  }

  60% {
    -webkit-transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
    transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
  }

  100% {
    -webkit-transform: translate(-4.15rem, 5.91rem) rotate(-1450deg) scale(1.24);
    transform: translate(-4.15rem, 5.91rem) rotate(-1450deg) scale(1.24);
  }
}

@keyframes boom1 {
  0% {
    -webkit-transform: translate(0) rotate(0deg);
    transform: translate(0) rotate(0deg);
  }

  5% {
    -webkit-transform: translate(0.5rem, -0.07rem) rotate(-90deg);
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  7% {
    -webkit-transform: translate(0.75rem, 0.15rem) rotate(-180deg);
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  9% {
    -webkit-transform: translate(0.9rem, 0.45rem) rotate(-270deg);
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  14% {
    -webkit-transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
    transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
  }

  40% {
    -webkit-transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
    transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
  }

  60% {
    -webkit-transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
    transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
  }

  100% {
    -webkit-transform: translate(-4.15rem, 5.91rem) rotate(-1450deg) scale(1.24);
    transform: translate(-4.15rem, 5.91rem) rotate(-1450deg) scale(1.24);
  }
}

.ballscroll b:nth-child(2) {
  -webkit-animation: boom2 2s 3s linear forwards;
  animation: boom2 2s 3s linear forwards;
}

@-webkit-keyframes boom2 {
  0% {
    -webkit-transform: translate(0) rotate(0deg);
    transform: translate(0) rotate(0deg);
  }

  5% {
    -webkit-transform: translate(0.5rem, -0.07rem) rotate(-90deg);
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  7% {
    -webkit-transform: translate(0.75rem, 0.15rem) rotate(-180deg);
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  9% {
    -webkit-transform: translate(0.9rem, 0.45rem) rotate(-270deg);
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  14% {
    -webkit-transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
    transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
  }

  40% {
    -webkit-transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
    transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
  }

  60% {
    -webkit-transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
    transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
  }

  100% {
    -webkit-transform: translate(-3.46rem, 5.91rem) rotate(-1430deg) scale(1.24);
    transform: translate(-3.46rem, 5.91rem) rotate(-1430deg) scale(1.24);
  }
}

@keyframes boom2 {
  0% {
    -webkit-transform: translate(0) rotate(0deg);
    transform: translate(0) rotate(0deg);
  }

  5% {
    -webkit-transform: translate(0.5rem, -0.07rem) rotate(-90deg);
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  7% {
    -webkit-transform: translate(0.75rem, 0.15rem) rotate(-180deg);
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  9% {
    -webkit-transform: translate(0.9rem, 0.45rem) rotate(-270deg);
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  14% {
    -webkit-transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
    transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
  }

  40% {
    -webkit-transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
    transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
  }

  60% {
    -webkit-transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
    transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
  }

  100% {
    -webkit-transform: translate(-3.46rem, 5.91rem) rotate(-1430deg) scale(1.24);
    transform: translate(-3.46rem, 5.91rem) rotate(-1430deg) scale(1.24);
  }
}

.ballscroll b:nth-child(3) {
  -webkit-animation: boom3 2s 6s linear forwards;
  animation: boom3 2s 6s linear forwards;
}

@-webkit-keyframes boom3 {
  0% {
    -webkit-transform: translate(0) rotate(0deg);
    transform: translate(0) rotate(0deg);
  }

  5% {
    -webkit-transform: translate(0.5rem, -0.07rem) rotate(-90deg);
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  7% {
    -webkit-transform: translate(0.75rem, 0.15rem) rotate(-180deg);
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  9% {
    -webkit-transform: translate(0.9rem, 0.45rem) rotate(-270deg);
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  14% {
    -webkit-transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
    transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
  }

  40% {
    -webkit-transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
    transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
  }

  60% {
    -webkit-transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
    transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
  }

  100% {
    -webkit-transform: translate(-2.77rem, 5.91rem) rotate(-1420deg) scale(1.24);
    transform: translate(-2.77rem, 5.91rem) rotate(-1420deg) scale(1.24);
  }
}

@keyframes boom3 {
  0% {
    -webkit-transform: translate(0) rotate(0deg);
    transform: translate(0) rotate(0deg);
  }

  5% {
    -webkit-transform: translate(0.5rem, -0.07rem) rotate(-90deg);
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  7% {
    -webkit-transform: translate(0.75rem, 0.15rem) rotate(-180deg);
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  9% {
    -webkit-transform: translate(0.9rem, 0.45rem) rotate(-270deg);
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  14% {
    -webkit-transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
    transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
  }

  40% {
    -webkit-transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
    transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
  }

  60% {
    -webkit-transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
    transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
  }

  100% {
    -webkit-transform: translate(-2.77rem, 5.91rem) rotate(-1420deg) scale(1.24);
    transform: translate(-2.77rem, 5.91rem) rotate(-1420deg) scale(1.24);
  }
}

.ballscroll b:nth-child(4) {
  -webkit-animation: boom4 2s 9s linear forwards;
  animation: boom4 2s 9s linear forwards;
}

@-webkit-keyframes boom4 {
  0% {
    -webkit-transform: translate(0) rotate(0deg);
    transform: translate(0) rotate(0deg);
  }

  5% {
    -webkit-transform: translate(0.5rem, -0.07rem) rotate(-90deg);
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  7% {
    -webkit-transform: translate(0.75rem, 0.15rem) rotate(-180deg);
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  9% {
    -webkit-transform: translate(0.9rem, 0.45rem) rotate(-270deg);
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  14% {
    -webkit-transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
    transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
  }

  40% {
    -webkit-transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
    transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
  }

  60% {
    -webkit-transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
    transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
  }

  100% {
    -webkit-transform: translate(-2.08rem, 5.91rem) rotate(-1460deg) scale(1.24);
    transform: translate(-2.08rem, 5.91rem) rotate(-1460deg) scale(1.24);
  }
}

@keyframes boom4 {
  0% {
    -webkit-transform: translate(0) rotate(0deg);
    transform: translate(0) rotate(0deg);
  }

  5% {
    -webkit-transform: translate(0.5rem, -0.07rem) rotate(-90deg);
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  7% {
    -webkit-transform: translate(0.75rem, 0.15rem) rotate(-180deg);
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  9% {
    -webkit-transform: translate(0.9rem, 0.45rem) rotate(-270deg);
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  14% {
    -webkit-transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
    transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
  }

  40% {
    -webkit-transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
    transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
  }

  60% {
    -webkit-transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
    transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
  }

  100% {
    -webkit-transform: translate(-2.08rem, 5.91rem) rotate(-1460deg) scale(1.24);
    transform: translate(-2.08rem, 5.91rem) rotate(-1460deg) scale(1.24);
  }
}

.ballscroll b:nth-child(5) {
  -webkit-animation: boom5 2s 12s linear forwards;
  animation: boom5 2s 12s linear forwards;
}

@-webkit-keyframes boom5 {
  0% {
    -webkit-transform: translate(0) rotate(0deg);
    transform: translate(0) rotate(0deg);
  }

  5% {
    -webkit-transform: translate(0.5rem, -0.07rem) rotate(-90deg);
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  7% {
    -webkit-transform: translate(0.75rem, 0.15rem) rotate(-180deg);
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  9% {
    -webkit-transform: translate(0.9rem, 0.45rem) rotate(-270deg);
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  14% {
    -webkit-transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
    transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
  }

  40% {
    -webkit-transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
    transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
  }

  60% {
    -webkit-transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
    transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
  }

  100% {
    -webkit-transform: translate(-1.39rem, 5.91rem) rotate(-1430deg) scale(1.24);
    transform: translate(-1.39rem, 5.91rem) rotate(-1430deg) scale(1.24);
  }
}

@keyframes boom5 {
  0% {
    -webkit-transform: translate(0) rotate(0deg);
    transform: translate(0) rotate(0deg);
  }

  5% {
    -webkit-transform: translate(0.5rem, -0.07rem) rotate(-90deg);
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  7% {
    -webkit-transform: translate(0.75rem, 0.15rem) rotate(-180deg);
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  9% {
    -webkit-transform: translate(0.9rem, 0.45rem) rotate(-270deg);
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  14% {
    -webkit-transform: translate(1.51rem, 1.2rem) rotate(-400deg) scale(1.1);
    transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
  }

  40% {
    -webkit-transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
    transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
  }

  60% {
    -webkit-transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
    transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
  }

  100% {
    -webkit-transform: translate(-1.39rem, 5.91rem) rotate(-1430deg) scale(1.24);
    transform: translate(-1.39rem, 5.91rem) rotate(-1430deg) scale(1.24);
  }
}

.ballscroll b:nth-child(6) {
  -webkit-animation: boom6 1.8s 15s linear forwards;
  animation: boom6 1.8s 15s linear forwards;
}

@-webkit-keyframes boom6 {
  0% {
    -webkit-transform: translate(0) rotate(0deg);
    transform: translate(0) rotate(0deg);
  }

  10% {
    -webkit-transform: translate(0.5rem, -0.07rem) rotate(-90deg);
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  17% {
    -webkit-transform: translate(0.75rem, 0.15rem) rotate(-180deg);
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  22% {
    -webkit-transform: translate(0.9rem, 0.45rem) rotate(-270deg);
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  30% {
    -webkit-transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
    transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
  }

  60% {
    -webkit-transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
    transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
  }

  75% {
    -webkit-transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
    transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
  }

  100% {
    -webkit-transform: translate(-0.7rem, 5.91rem) rotate(-1080deg) scale(1.24);
    transform: translate(-0.7rem, 5.91rem) rotate(-1080deg) scale(1.24);
  }
}

@keyframes boom6 {
  0% {
    -webkit-transform: translate(0) rotate(0deg);
    transform: translate(0) rotate(0deg);
  }

  10% {
    -webkit-transform: translate(0.5rem, -0.07rem) rotate(-90deg);
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  17% {
    -webkit-transform: translate(0.75rem, 0.15rem) rotate(-180deg);
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  22% {
    -webkit-transform: translate(0.9rem, 0.45rem) rotate(-270deg);
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  30% {
    -webkit-transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
    transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
  }

  60% {
    -webkit-transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
    transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
  }

  75% {
    -webkit-transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
    transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
  }

  100% {
    -webkit-transform: translate(-0.7rem, 5.91rem) rotate(-1080deg) scale(1.24);
    transform: translate(-0.7rem, 5.91rem) rotate(-1080deg) scale(1.24);
  }
}

.ballscroll b:nth-child(7) {
  -webkit-animation: boom7 1.6s 17.8s linear forwards;
  animation: boom7 1.6s 17.8s linear forwards;
}

@-webkit-keyframes boom7 {
  0% {
    -webkit-transform: translate(0) rotate(0deg);
    transform: translate(0) rotate(0deg);
  }

  8% {
    -webkit-transform: translate(0.5rem, -0.07rem) rotate(-90deg);
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  15% {
    -webkit-transform: translate(0.75rem, 0.15rem) rotate(-180deg);
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  29% {
    -webkit-transform: translate(0.9rem, 0.45rem) rotate(-270deg);
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  34% {
    -webkit-transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
    transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
  }

  65% {
    -webkit-transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
    transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
  }

  85% {
    -webkit-transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
    transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
  }

  100% {
    -webkit-transform: translate(-0.01rem, 5.91rem) rotate(-1100deg) scale(1.24);
    transform: translate(-0.01rem, 5.91rem) rotate(-1100deg) scale(1.24);
  }
}

@keyframes boom7 {
  0% {
    -webkit-transform: translate(0) rotate(0deg);
    transform: translate(0) rotate(0deg);
  }

  8% {
    -webkit-transform: translate(0.5rem, -0.07rem) rotate(-90deg);
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  15% {
    -webkit-transform: translate(0.75rem, 0.15rem) rotate(-180deg);
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  29% {
    -webkit-transform: translate(0.9rem, 0.45rem) rotate(-270deg);
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  34% {
    -webkit-transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
    transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
  }

  65% {
    -webkit-transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
    transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
  }

  85% {
    -webkit-transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
    transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
  }

  100% {
    -webkit-transform: translate(-0.01rem, 5.91rem) rotate(-1100deg) scale(1.24);
    transform: translate(-0.01rem, 5.91rem) rotate(-1100deg) scale(1.24);
  }
}

.ballscroll b:nth-child(8) {
  -webkit-animation: boom8 1.4s 20.6s linear forwards;
  animation: boom8 1.4s 20.6s linear forwards;
}

@-webkit-keyframes boom8 {
  0% {
    -webkit-transform: translate(0) rotate(0deg);
    transform: translate(0) rotate(0deg);
  }

  8% {
    -webkit-transform: translate(0.5rem, -0.07rem) rotate(-90deg);
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  15% {
    -webkit-transform: translate(0.75rem, 0.15rem) rotate(-180deg);
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  29% {
    -webkit-transform: translate(0.9rem, 0.45rem) rotate(-270deg);
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  34% {
    -webkit-transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
    transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
  }

  65% {
    -webkit-transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
    transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
  }

  85% {
    -webkit-transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
    transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
  }

  100% {
    -webkit-transform: translate(0.68rem, 5.91rem) rotate(-1070deg) scale(1.24);
    transform: translate(0.68rem, 5.91rem) rotate(-1070deg) scale(1.24);
  }
}

@keyframes boom8 {
  0% {
    -webkit-transform: translate(0) rotate(0deg);
    transform: translate(0) rotate(0deg);
  }

  8% {
    -webkit-transform: translate(0.5rem, -0.07rem) rotate(-90deg);
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  15% {
    -webkit-transform: translate(0.75rem, 0.15rem) rotate(-180deg);
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  29% {
    -webkit-transform: translate(0.9rem, 0.45rem) rotate(-270deg);
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  34% {
    -webkit-transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
    transform: translate(1.17rem, 1.2rem) rotate(-400deg) scale(1.1);
  }

  65% {
    -webkit-transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
    transform: translate(1.14rem, 3.85rem) rotate(-720deg) scale(1.2);
  }

  85% {
    -webkit-transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
    transform: translate(1.45rem, 5.91rem) rotate(-900deg) scale(1.24);
  }

  100% {
    -webkit-transform: translate(0.68rem, 5.91rem) rotate(-1070deg) scale(1.24);
    transform: translate(0.68rem, 5.91rem) rotate(-1070deg) scale(1.24);
  }
}

/*鐞冧綋婊氬姩-闂撮殧5s*/
.ballscroll1 b {
  position: absolute;
  top: 0.6rem;
  right: 2.25rem;
}

.ballscroll1 b:nth-child(1) {
  -webkit-animation: boom1 2s linear forwards;
  animation: boom1 2s linear forwards;
}

.ballscroll1 b:nth-child(2) {
  -webkit-animation: boom2 2s 5s linear forwards;
  animation: boom2 2s 5s linear forwards;
}

.ballscroll1 b:nth-child(3) {
  -webkit-animation: boom3 2s 10s linear forwards;
  animation: boom3 2s 10s linear forwards;
}

.ballscroll1 b:nth-child(4) {
  -webkit-animation: boom4 2s 15s linear forwards;
  animation: boom4 2s 15s linear forwards;
}

.ballscroll1 b:nth-child(5) {
  -webkit-animation: boom5 2s 20s linear forwards;
  animation: boom5 2s 20s linear forwards;
}

.ballscroll1 b:nth-child(6) {
  -webkit-animation: boom6 1.8s 25s linear forwards;
  animation: boom6 1.8s 25s linear forwards;
}

.ballscroll1 b:nth-child(7) {
  -webkit-animation: boom7 1.6s 30s linear forwards;
  animation: boom7 1.6s 30s linear forwards;
}

.ballscroll1 b:nth-child(8) {
  -webkit-animation: boom8 1.4s 35s linear forwards;
  animation: boom8 1.4s 35s linear forwards;
}

/*蹇箰8鐞冧綋婊氬姩*/
.kl8_box {
  margin-bottom: 1.1rem;
}

.kl8_box .ballscroll {
  height: calc(100% + 1.1rem);
  width: 7.5rem;
  position: absolute;
  top: 0;
  left: 0;
}

.kl8_box .ballscroll:after {
  content: "";
  width: 7.5rem;
  height: 1.44rem;
  background-image: url(../img/rq1.png);
  background-size: cover;
  display: block;
  z-index: 1;
  position: absolute;
  bottom: 0;
}

/*蹇箰8鐞冧綋婊氬姩闂撮殧*/
.kl8_box .ballscroll b:nth-child(1) {
  animation: klboom1 2s linear forwards;
}

@keyframes klboom1 {
  0% {
    transform: translate(0) rotate(0deg);
  }

  5% {
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  7% {
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  9% {
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  14% {
    transform: translate(1.17rem, 1.2rem) rotate(-400deg);
  }

  40% {
    transform: translate(1.14rem, 3.85rem) rotate(-720deg);
  }

  60% {
    transform: translate(1.45rem, 5.91rem) rotate(-900deg);
  }

  100% {
    transform: translate(-4.26rem, 5.91rem) rotate(-1450deg);
  }
}

.kl8_box .ballscroll b:nth-child(2) {
  animation: klboom2 2s 3s linear forwards;
}

@keyframes klboom2 {
  0% {
    transform: translate(0) rotate(0deg);
  }

  5% {
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  7% {
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  9% {
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  14% {
    transform: translate(1.17rem, 1.2rem) rotate(-400deg);
  }

  40% {
    transform: translate(1.14rem, 3.85rem) rotate(-720deg);
  }

  60% {
    transform: translate(1.45rem, 5.91rem) rotate(-900deg);
  }

  100% {
    transform: translate(-3.7rem, 5.91rem) rotate(-1430deg);
  }
}

.kl8_box .ballscroll b:nth-child(3) {
  animation: klboom3 2s 6s linear forwards;
}

@keyframes klboom3 {
  0% {
    transform: translate(0) rotate(0deg);
  }

  5% {
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  7% {
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  9% {
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  14% {
    transform: translate(1.17rem, 1.2rem) rotate(-400deg);
  }

  40% {
    transform: translate(1.14rem, 3.85rem) rotate(-720deg);
  }

  60% {
    transform: translate(1.45rem, 5.91rem) rotate(-900deg);
  }

  100% {
    transform: translate(-3.14rem, 5.91rem) rotate(-1420deg);
  }
}

.kl8_box .ballscroll b:nth-child(4) {
  animation: klboom4 2s 9s linear forwards;
}

@keyframes klboom4 {
  0% {
    transform: translate(0) rotate(0deg);
  }

  5% {
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  7% {
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  9% {
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  14% {
    transform: translate(1.17rem, 1.2rem) rotate(-400deg);
  }

  40% {
    transform: translate(1.14rem, 3.85rem) rotate(-720deg);
  }

  60% {
    transform: translate(1.45rem, 5.91rem) rotate(-900deg);
  }

  100% {
    transform: translate(-2.59rem, 5.91rem) rotate(-1460deg);
  }
}

.kl8_box .ballscroll b:nth-child(5) {
  animation: klboom5 2s 12s linear forwards;
}

@keyframes klboom5 {
  0% {
    transform: translate(0) rotate(0deg);
  }

  5% {
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  7% {
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  9% {
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  14% {
    transform: translate(1.17rem, 1.2rem) rotate(-400deg);
  }

  40% {
    transform: translate(1.14rem, 3.85rem) rotate(-720deg);
  }

  60% {
    transform: translate(1.45rem, 5.91rem) rotate(-900deg);
  }

  100% {
    transform: translate(-2.03rem, 5.91rem) rotate(-1430deg);
  }
}

.kl8_box .ballscroll b:nth-child(6) {
  animation: klboom6 2s 15s linear forwards;
}

@keyframes klboom6 {
  0% {
    transform: translate(0) rotate(0deg);
  }

  10% {
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  17% {
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  22% {
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  30% {
    transform: translate(1.17rem, 1.2rem) rotate(-400deg);
  }

  60% {
    transform: translate(1.14rem, 3.85rem) rotate(-720deg);
  }

  75% {
    transform: translate(1.45rem, 5.91rem) rotate(-900deg);
  }

  100% {
    transform: translate(-1.48rem, 5.91rem) rotate(-1080deg);
  }
}

.kl8_box .ballscroll b:nth-child(7) {
  animation: klboom7 2s 17.8s linear forwards;
}

@keyframes klboom7 {
  0% {
    transform: translate(0) rotate(0deg);
  }

  8% {
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  15% {
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  29% {
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  34% {
    transform: translate(1.17rem, 1.2rem) rotate(-400deg);
  }

  65% {
    transform: translate(1.14rem, 3.85rem) rotate(-720deg);
  }

  85% {
    transform: translate(1.45rem, 5.91rem) rotate(-900deg);
  }

  100% {
    transform: translate(-0.92rem, 5.91rem) rotate(-1060deg);
  }
}

.kl8_box .ballscroll b:nth-child(8) {
  animation: klboom8 1.8s 20.6s linear forwards;
}

@keyframes klboom8 {
  0% {
    transform: translate(0) rotate(0deg);
  }

  8% {
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  15% {
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  29% {
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  34% {
    transform: translate(1.17rem, 1.2rem) rotate(-400deg);
  }

  65% {
    transform: translate(1.14rem, 3.85rem) rotate(-720deg);
  }

  85% {
    transform: translate(1.45rem, 5.91rem) rotate(-900deg);
  }

  100% {
    transform: translate(-0.36rem, 5.91rem) rotate(-1090deg);
  }
}

.kl8_box .ballscroll b:nth-child(9) {
  animation: klboom9 1.6s 22.6s linear forwards;
}

@keyframes klboom9 {
  0% {
    transform: translate(0) rotate(0deg);
  }

  5% {
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  7% {
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  9% {
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  14% {
    transform: translate(1.17rem, 1.2rem) rotate(-400deg);
  }

  40% {
    transform: translate(1.14rem, 3.85rem) rotate(-720deg);
  }

  60% {
    transform: translate(1.45rem, 5.91rem) rotate(-900deg);
  }

  100% {
    transform: translate(0.2rem, 5.91rem) rotate(-1080deg);
  }
}

.kl8_box .ballscroll b:nth-child(10) {
  animation: klboom10 1.6s 24s linear forwards;
}

@keyframes klboom10 {
  0% {
    transform: translate(0) rotate(0deg);
  }

  5% {
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  7% {
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  9% {
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  14% {
    transform: translate(1.17rem, 1.2rem) rotate(-400deg);
  }

  40% {
    transform: translate(1.14rem, 3.85rem) rotate(-720deg);
  }

  60% {
    transform: translate(1.45rem, 5.91rem) rotate(-900deg);
  }

  100% {
    transform: translate(0.76rem, 5.91rem) rotate(-1100deg);
  }
}

.kl8_box .ballscroll b:nth-child(11) {
  animation: klboom11 2s 26s linear forwards;
}

@keyframes klboom11 {
  0% {
    transform: translate(0) rotate(0deg);
  }

  5% {
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  7% {
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  9% {
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  14% {
    transform: translate(1.17rem, 1.2rem) rotate(-400deg);
  }

  40% {
    transform: translate(1.14rem, 3.85rem) rotate(-720deg);
  }

  60% {
    transform: translate(1.45rem, 7.04rem) rotate(-900deg);
  }

  100% {
    transform: translate(-4.26rem, 7.04rem) rotate(-1430deg);
  }
}

.kl8_box .ballscroll b:nth-child(12) {
  animation: klboom12 2s 29s linear forwards;
}

@keyframes klboom12 {
  0% {
    transform: translate(0) rotate(0deg);
  }

  5% {
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  7% {
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  9% {
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  14% {
    transform: translate(1.17rem, 1.2rem) rotate(-400deg);
  }

  40% {
    transform: translate(1.14rem, 3.85rem) rotate(-720deg);
  }

  60% {
    transform: translate(1.45rem, 7.04rem) rotate(-900deg);
  }

  100% {
    transform: translate(-3.7rem, 7.04rem) rotate(-1460deg);
  }
}

.kl8_box .ballscroll b:nth-child(13) {
  animation: klboom13 2s 32s linear forwards;
}

@keyframes klboom13 {
  0% {
    transform: translate(0) rotate(0deg);
  }

  5% {
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  7% {
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  9% {
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  14% {
    transform: translate(1.17rem, 1.2rem) rotate(-400deg);
  }

  40% {
    transform: translate(1.14rem, 3.85rem) rotate(-720deg);
  }

  60% {
    transform: translate(1.45rem, 7.04rem) rotate(-900deg);
  }

  100% {
    transform: translate(-3.14rem, 7.04rem) rotate(-1450deg);
  }
}

.kl8_box .ballscroll b:nth-child(14) {
  animation: klboom14 2s 35s linear forwards;
}

@keyframes klboom14 {
  0% {
    transform: translate(0) rotate(0deg);
  }

  5% {
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  7% {
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  9% {
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  14% {
    transform: translate(1.17rem, 1.2rem) rotate(-400deg);
  }

  40% {
    transform: translate(1.14rem, 3.85rem) rotate(-720deg);
  }

  60% {
    transform: translate(1.45rem, 7.04rem) rotate(-900deg);
  }

  100% {
    transform: translate(-2.59rem, 7.04rem) rotate(-1420deg);
  }
}

.kl8_box .ballscroll b:nth-child(15) {
  animation: klboom15 2s 38s linear forwards;
}

@keyframes klboom15 {
  0% {
    transform: translate(0) rotate(0deg);
  }

  5% {
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  7% {
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  9% {
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  14% {
    transform: translate(1.17rem, 1.2rem) rotate(-400deg);
  }

  40% {
    transform: translate(1.14rem, 3.85rem) rotate(-720deg);
  }

  60% {
    transform: translate(1.45rem, 7.04rem) rotate(-900deg);
  }

  100% {
    transform: translate(-2.03rem, 7.04rem) rotate(-1450deg);
  }
}

.kl8_box .ballscroll b:nth-child(16) {
  animation: klboom16 2s 41s linear forwards;
}

@keyframes klboom16 {
  0% {
    transform: translate(0) rotate(0deg);
  }

  10% {
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  17% {
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  22% {
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  30% {
    transform: translate(1.17rem, 1.2rem) rotate(-400deg);
  }

  60% {
    transform: translate(1.14rem, 3.85rem) rotate(-720deg);
  }

  75% {
    transform: translate(1.45rem, 7.04rem) rotate(-900deg);
  }

  100% {
    transform: translate(-1.48rem, 7.04rem) rotate(-1070deg);
  }
}

.kl8_box .ballscroll b:nth-child(17) {
  animation: klboom17 2s 43.8s linear forwards;
}

@keyframes klboom17 {
  0% {
    transform: translate(0) rotate(0deg);
  }

  8% {
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  15% {
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  29% {
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  34% {
    transform: translate(1.17rem, 1.2rem) rotate(-400deg);
  }

  65% {
    transform: translate(1.14rem, 3.85rem) rotate(-720deg);
  }

  85% {
    transform: translate(1.45rem, 7.04rem) rotate(-900deg);
  }

  100% {
    transform: translate(-0.92rem, 7.04rem) rotate(-1090deg);
  }
}

.kl8_box .ballscroll b:nth-child(18) {
  animation: klboom18 1.8s 46.6s linear forwards;
}

@keyframes klboom18 {
  0% {
    transform: translate(0) rotate(0deg);
  }

  8% {
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  15% {
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  29% {
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  34% {
    transform: translate(1.17rem, 1.2rem) rotate(-400deg);
  }

  65% {
    transform: translate(1.14rem, 3.85rem) rotate(-720deg);
  }

  85% {
    transform: translate(1.45rem, 7.04rem) rotate(-900deg);
  }

  100% {
    transform: translate(-0.36rem, 7.04rem) rotate(-1070deg);
  }
}

.kl8_box .ballscroll b:nth-child(19) {
  animation: klboom19 1.6s 48.6s linear forwards;
}

@keyframes klboom19 {
  0% {
    transform: translate(0) rotate(0deg);
  }

  5% {
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  7% {
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  9% {
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  14% {
    transform: translate(1.17rem, 1.2rem) rotate(-400deg);
  }

  40% {
    transform: translate(1.14rem, 3.85rem) rotate(-720deg);
  }

  60% {
    transform: translate(1.45rem, 7.04rem) rotate(-900deg);
  }

  100% {
    transform: translate(0.2rem, 7.04rem) rotate(-1060deg);
  }
}

.kl8_box .ballscroll b:nth-child(20) {
  animation: klboom20 1.6s 50s linear forwards;
}

@keyframes klboom20 {
  0% {
    transform: translate(0) rotate(0deg);
  }

  5% {
    transform: translate(0.5rem, -0.07rem) rotate(-90deg);
  }

  7% {
    transform: translate(0.75rem, 0.15rem) rotate(-180deg);
  }

  9% {
    transform: translate(0.9rem, 0.45rem) rotate(-270deg);
  }

  14% {
    transform: translate(1.17rem, 1.2rem) rotate(-400deg);
  }

  40% {
    transform: translate(1.14rem, 3.85rem) rotate(-720deg);
  }

  60% {
    transform: translate(1.45rem, 7.04rem) rotate(-900deg);
  }

  100% {
    transform: translate(0.76rem, 7.04rem) rotate(-1090deg);
  }
}

.mask {
  position: fixed;
  display: none;
  top: 0;
  filter: alpha(opacity=70);
  background-color: #000;
  z-index: 1002;
  left: 0px;
  opacity: 0.7;
  -moz-opacity: 0.7;
  width: 100%;
  height: 100%;
}

.alert {
  position: fixed;
  z-index: 9999;
  left: 50%;
  background: #fff;
  margin: 0.5rem -3rem;
  width: 6rem;
  border-radius: 0.1rem;
}

.alert .t {
  background: #f5f5f5;
  border-radius: 0.1rem 0.1rem 0 0;
  border-bottom: #ddd 1px solid;
  line-height: 0.5rem;
  height: 0.5rem;
}

.alert .t b {
  padding-left: 0.1rem;
  float: left;
  font-size: 0.2rem;
}

.alert .t a {
  float: right;
  color: #333;
  text-decoration: none;
  text-align: center;
  width: 0.5rem;
  height: 0.5rem;
  background: #e7e7e7;
  font-size: 0.26rem;
  font-family: serif;
  border-radius: 0 0.05rem 0 0;
}

.alert .m {
  padding: 0.1rem;
  line-height: 0.4rem;
  font-size: 0.2rem;
  max-height: 3rem;
  overflow-y: auto;
}

.alert .b {
  background: #f5f5f5;
  border-radius: 0 0 0.1rem 0.1rem;
  text-align: center;
  padding: 0.1rem 0;
  border-top: #ddd 1px solid;
}

.alert .b a {
  background: #fff;
  text-decoration: none;
  color: #333;
  font-size: 0.2rem;
  padding: 0 0.2rem;
  line-height: 0.4rem;
  border-radius: 0.05rem;
  border: #ddd 1px solid;
  display: inline-block;
  margin: 0 0.1rem;
}

.fzbox {
  margin: 0.2rem;
  background-color: rgba(0, 0, 0, 0.3);
  border-radius: 0.1rem;
  padding: 0.2rem;
}

.fzbox b {
  position: inherit;
  margin-right: 0.01rem;
  display: inline-block;
  width: 0.5rem;
  height: 0.5rem;
  line-height: 0.5rem;
  font-size: 0.3rem;
}

.fzbox em {
  font-size: 0.26rem;
  color: #fff;
  width: 0.9rem;
  line-height: 0.5rem;
  display: inline-block;
}

.fzbox li {
  margin-bottom: 0.2rem;
}

.fzbox li:last-child {
  margin-bottom: 0;
}

.fzbox a {
  float: right;
  font-size: 0.26rem;
  color: #fff;
  height: 0.5rem;
  line-height: 0.5rem;
  text-decoration: none;
  padding: 0 0.2rem;
  background: #ff8100;
  border-radius: 1rem;
}

.fzbox a:hover {
  background: #f60;
}

a.alldel {
  height: 0.6rem;
  line-height: 0.6rem;
  text-decoration: none;
  font-size: 0.26rem;
  color: #fff;
  margin: 0 0.2rem 0.2rem;
  background: #1b3a98;
  display: block;
  text-align: center;
  border-radius: 1rem;
}

a.alldel:hover {
  background: #2549b7;
}

.fzbox a.del {
  width: 0.5rem;
  text-indent: -999em;
  margin-left: 0.05rem;
  padding: 0;
  background-color: #1b3a98;
  background-image: url(../img/del.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 40%;
  border-radius: 50%;
}

.fzbox a.del:hover {
  background-color: #2549b7;
}

.fzbox {
  margin: 0.2rem;
  background-color: rgba(0, 0, 0, 0.3);
  border-radius: 0.1rem;
  padding: 0.2rem;
}

.fzbox b {
  position: inherit;
  margin-right: 0.01rem;
  display: inline-block;
  width: 0.5rem;
  height: 0.5rem;
  line-height: 0.5rem;
  font-size: 0.3rem;
}

.fzbox em {
  font-size: 0.26rem;
  color: #fff;
  width: 0.9rem;
  line-height: 0.5rem;
  display: inline-block;
}

.fzbox li {
  margin-bottom: 0.2rem;
}

.fzbox li:last-child {
  margin-bottom: 0;
}

.fzbox a {
  float: right;
  font-size: 0.26rem;
  color: #fff;
  height: 0.5rem;
  line-height: 0.5rem;
  text-decoration: none;
  padding: 0 0.2rem;
  background: #ff8100;
  border-radius: 1rem;
}

.fzbox a:hover {
  background: #f60;
}

a.alldel {
  height: 0.6rem;
  line-height: 0.6rem;
  text-decoration: none;
  font-size: 0.26rem;
  color: #fff;
  margin: 0 0.2rem 0.2rem;
  background: #1b3a98;
  display: block;
  text-align: center;
  border-radius: 1rem;
}

a.alldel:hover {
  background: #2549b7;
}

.fzbox a.del {
  width: 0.5rem;
  text-indent: -999em;
  margin-left: 0.05rem;
  padding: 0;
  background-color: #1b3a98;
  background-image: url(../img/del.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: 40%;
  border-radius: 50%;
}

.fzbox a.del:hover {
  background-color: #2549b7;
}

.fzbox li.list_kl8 {
  display: flex;
  flex-direction: row;
  align-items: center;
}

.fzbox li.list_kl8 em,
.fzbox li.list_kl8 a {
  flex-shrink: 0;
}

.fzbox li.list_kl8 p {
  display: flex;
  flex: 1;
  flex-direction: row;
  flex-wrap: wrap;
}

.fzbox li.list_kl8 p b {
  margin: 0.02rem 0.04rem 0.02rem 0;
  width: 0.38rem;
  height: 0.38rem;
  line-height: 0.38rem;
  font-size: 0.24rem;
}

/* music */
@-webkit-keyframes reverseRotataZ {
  0% {
    -webkit-transform: rotateZ(0deg);
  }

  100% {
    -webkit-transform: rotateZ(-360deg);
  }
}

@-webkit-keyframes rotataZ {
  0% {
    -webkit-transform: rotateZ(0deg);
  }

  100% {
    -webkit-transform: rotateZ(360deg);
  }
}

#musicControl {
  position: absolute;
  right: 0.2rem;
  margin-top: 1.3rem;
  display: inline-block;
  z-index: 2;
  width: 0.6rem;
  height: 0.6rem;
}

#musicControl a {
  display: block;
  width: 0.6rem;
  height: 0.6rem;
  overflow: hidden;
  background-size: 100%;
  background-position: center;
  background-repeat: no-repeat;
}

#musicControl a audio {
  width: 100%;
  height: 0.6rem;
}

#musicControl a.stop {
  background-image: url("../img/stop.png");
}

#musicControl a.on {
  background-image: url("../img/play.png");
  -webkit-animation: reverseRotataZ 1.2s linear infinite;
}

/*鐞冧綋闈欐*/
.ballStop b:nth-child(1),
.ballStop b:nth-child(3),
.ballStop b:nth-child(5),
.ballStop b:nth-child(7),
.ballStop b:nth-child(8) {
  transform: rotate(7deg);
}

.ballStop b:nth-child(2),
.ballStop b:nth-child(4),
.ballStop b:nth-child(6),
.ballStop b:nth-child(9),
.ballStop b:nth-child(10) {
  transform: rotate(-12deg);
}

.ballStop b:nth-child(11),
.ballStop b:nth-child(12),
.ballStop b:nth-child(15),
.ballStop b:nth-child(17),
.ballStop b:nth-child(18) {
  transform: rotate(-21deg);
}

.ballStop b:nth-child(13),
.ballStop b:nth-child(14),
.ballStop b:nth-child(16),
.ballStop b:nth-child(19),
.ballStop b:nth-child(20) {
  transform: rotate(16deg);
}

.ballStop b:nth-child(22),
.ballStop b:nth-child(24),
.ballStop b:nth-child(25),
.ballStop b:nth-child(27),
.ballStop b:nth-child(30) {
  transform: rotate(19deg);
}

.ballStop b:nth-child(21),
.ballStop b:nth-child(23),
.ballStop b:nth-child(26),
.ballStop b:nth-child(28),
.ballStop b:nth-child(29) {
  transform: rotate(12deg);
}

.ballStop b:nth-child(32),
.ballStop b:nth-child(35) {
  transform: rotate(-30deg);
}

.ballStop b:nth-child(31),
.ballStop b:nth-child(33),
.ballStop b:nth-child(34) {
  transform: rotate(14deg);
}

#header {
  height: 48px;
  line-height: 48px;
  background: #222;
}

#header h1 {
  font-size: 18px;
  padding-left: 5px;
  color: #fff;
  float: left;
  white-space: nowrap;
  text-overflow: ellipsis;
  overflow: hidden;
  width: calc(100% - 70px);
}

#header #rpanel {
  background: url(../img/menu.png) no-repeat center;
  float: right;
  width: 40px;
  height: 48px;
  text-indent: -999em;
}

#header a.bank {
  background: url(../img/bank.png) no-repeat 0 0;
  width: 22px;
  height: 48px;
  float: left;
  text-indent: -999em;
}

#menu {
  background: #575757 url(../img/yiy.png) 0 repeat-y;
  display: none;
  width: 90%;
  overflow-y: auto;
}

#menu a {
  text-decoration: none;
}

#menu ul {
  padding: 10px;
}

#menu li {
  float: left;
  margin-bottom: 5px;
}

#menu li a {
  color: #fff;
  background: #444;
  text-align: center;
  margin-right: 5px;
  display: block;
  padding: 0 6px;
  font-size: 14px;
  line-height: 28px;
}

#menu .close {
  line-height: 48px;
  height: 48px;
  background: url(../img/yiyt.png) no-repeat 0 bottom;
}

#menu .close a {
  line-height: 48px;
  margin-right: 20px;
  font-size: 15px;
  padding-right: 22px;
  float: right;
  color: #c0c0c0;
  background: url(../img/close.png) no-repeat right center;
}

.kjhti {
  padding: 0.2rem 0;
  text-align: center;
}

.kjhti h2 {
  color: #ff0;
  font-size: 0.4rem;
  background: rgba(0, 0, 0, 0.6);
  display: inline-block;
  padding: 0 0.4rem;
  line-height: 0.8rem;
  border-radius: 2rem;
}

.kjhti h3 {
  color: #fff;
  font-size: 0.36rem;
  font-weight: normal;
}

a.woyao {
  height: 0.66rem;
  line-height: 0.66rem;
  text-decoration: none;
  font-size: 0.32rem;
  color: #fff;
  font-weight: bold;
  margin: 0.2rem 0.39rem 0.28rem;
  background: #ff8d00;
  box-shadow: #112481 0 0 10px;
  display: block;
  text-align: center;
  border-radius: 2rem;
}

a.woyao:hover {
  background: #ffa500;
}

a.woyao.no {
  color: #42517f;
  background: rgba(0, 0, 0, 0.2);
  box-shadow: none;
  cursor: default;
}

a.woyao.no:hover {
  background: rgba(0, 0, 0, 0.2);
}

a.ayao {
  height: 0.88rem;
  width: 1.8rem;
  position: relative;
  top: 1.57rem;
  left: 2.3rem;
  z-index: 2;
  text-indent: -9999em;
  background-image: url(../img/yao2.png);
  background-position: center;
  background-size: contain;
  background-repeat: no-repeat;
  display: block;
}

a.ayao:hover {
  background-image: url(../img/yao3.png);
}

a.ayao.no,
a.ayao.no:hover {
  background-image: url(../img/yao1.png);
  cursor: default;
}

.mylist {
  margin: 0.1rem 0.39rem 0.28rem;
}

.mylist .t {
  display: flex;
  flex-direction: row;
  line-height: 0.4rem;
}

.mylist .t b {
  font-size: 0.28rem;
  color: #fff;
  font-weight: normal;
  background: url(../img/jlicon.png) no-repeat 0 center;
  background-size: 0.4rem;
  padding-left: 0.5rem;
  flex: 1;
}

.mylist li {
  margin: 0.2rem 0;
  background-color: rgba(0, 0, 0, 0.2);
  border-radius: 0.1rem;
  padding: 0.2rem;
}

.mylist li .box b {
  position: inherit;
  margin-right: 0.1rem;
  display: inline-block;
  width: 0.56rem;
  height: 0.56rem;
  line-height: 0.56rem;
  font-size: 0.32rem;
}

.mylist li .tit {
  font-size: 0.28rem;
  line-height: 0.28rem;
  color: #b6bbca;
  padding-bottom: 0.2rem;
  display: flex;
  flex-direction: row;
}

.mylist li .tit em {
  flex: 1;
}

.mylist li .tit b {
  color: #ff0;
  margin-right: 0.1rem;
}

.nojl {
  margin: 0.2rem 0;
  background: rgba(0, 0, 0, 0.2) url(../img/nojl.png) no-repeat center 0.4rem;
  font-size: 0.28rem;
  line-height: 0.28rem;
  color: #7f89ab;
  text-align: center;
  border-radius: 0.1rem;
  padding: 2.2rem 0 0.44rem;
  background-size: 1.4rem;
}

#musicControl.omusic {
  margin-top: 0.2rem;
}

.mylist li.on {
  background-color: #1541aa;
  position: relative;
}

.mylist li.on .tit {
  padding-left: 0.4rem;
}

.mylist li.on::before {
  content: "";
  background: #ff9 url(../img/lucki.gif) no-repeat center;
  top: 0;
  left: 0;
  border-radius: 0.1rem 0 60%;
  position: absolute;
  background-size: 0.22rem;
  width: 0.5rem;
  height: 0.5rem;
}

a.loading {
  background-color: rgba(0, 0, 0, 0.2);
  border-radius: 0.1rem;
  font-size: 14px;
  font-size: 0.28rem;
  line-height: 0.6rem;
  text-decoration: none;
  color: #b6bbca;
  text-align: center;
  display: block;
  width: 100%;
}

a.loading:hover {
  background-color: rgba(0, 0, 0, 0.4);
}

@media screen and (min-width: 760px) {
  #musicControl {
    margin-top: 0.2rem;
  }
}