@import url(pscroll.css);
/*首页*/
.statistics-box {
	width: 100%;
	position: relative;
}

.statistics-box .statistics {
	width: 60%;
	height: 110px;
	border-radius: 10px;
	position: absolute;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	background-color: #274AFF;
	display: flex;
	justify-content: space-around;
	align-items: center;
}

.statistics-box .statistics-top {
	width: 100%;
	height: 50vh;
      min-height: 540px;
	display: flex;
	justify-content: space-around;
	align-items: center;
  	   background: url(/upload/1/cms/content/qklbj.svg);
    background-size: cover;
}

.statistics-box .statistics-top .box {
			  width: 400px;
			  height: 400px;
			  display: flex;
			  background-image: url('/upload/1/cms/content/qkldt.svg');
			  background-size: 100% 100%;
			  position: relative; /* 设置相对定位 */
  			  margin-bottom: 40px;
			}
			
.statistics-box .statistics-top .box .head {
			  width: 50px;
			  height: 60px;
			  position: absolute;
			  top: 150px;
			  left: 150px;
			  transform-origin: 50% 100%;
			  animation: init 12s infinite; /* 动画总时长调整为12秒 */
			  background-image: url('/upload/1/cms/content/rt.svg');
			  background-size: cover;
			  background-repeat: no-repeat;
			  background-position: center;
			  z-index: 2; /* 小人位于流光之上 */
			}
			
			.statistics-box .statistics-top .box .l0{
			  width: 125px;
			  height: 180px;
			  position: absolute;
			  top: 70px;
			  left: 120px;
			  transform-origin: 50% 100%;
			  background-image: url('/upload/1/cms/content/zd.svg');
			  background-size: cover;
			  background-repeat: no-repeat;
			  background-position: center;
			  z-index: 2;
			}
			
			.statistics-box .statistics-top .box .l1{
			  width: 60px;
			  height: 100px;
			  position: absolute;
			  top: -10px;
			  left: 150px;
			  transform-origin: 50% 100%;
			  background-image: url('/upload/1/cms/content/l1.svg');
			  background-size: cover;
			  background-repeat: no-repeat;
			  background-position: center;
			  z-index: 3;
			  animation: appear-disappear 3s infinite;
			}
			
			.statistics-box .statistics-top .box .l2{
			  width: 60px;
			  height: 100px;
			  position: absolute;
			  top: 45px;
			  left: 55px;
			  transform-origin: 50% 100%;
			  background-image: url('/upload/1/cms/content/l2.svg');
			  background-size: cover;
			  background-repeat: no-repeat;
			  background-position: center;
			  z-index: 3;
			  animation: appear-disappear 4s infinite;
			}
			
			.statistics-box .statistics-top .box .l3{
				width: 60px;
				height: 100px;
				position: absolute;
				top: 145px;
				left: 65px;
			  transform-origin: 50% 100%;
			  background-image: url('/upload/1/cms/content/l3.svg');
			  background-size: cover;
			  background-repeat: no-repeat;
			  background-position: center;
			  z-index: 3;
			  animation: appear-disappear 5s infinite;
			}
			
			.statistics-box .statistics-top .box .l4{
				width: 60px;
				height: 100px;
				position: absolute;
				top: 150px;
				left: 240px;
			  transform-origin: 50% 100%;
			  background-image: url('/upload/1/cms/content/l4.svg');
			  background-size: cover;
			  background-repeat: no-repeat;
			  background-position: center;
			  z-index: 3;
			  animation: appear-disappear 6s infinite;
			}
			
			.statistics-box .statistics-top .box .l5{
				width: 60px;
				height: 100px;
				position: absolute;
				top: 45px;
				left: 245px;
			  transform-origin: 50% 100%;
			  background-image: url('/upload/1/cms/content/l5.svg');
			  background-size: cover;
			  background-repeat: no-repeat;
			  background-position: center;
			  z-index: 3;
			  animation: appear-disappear 7s infinite;
			}

.statistics-box .statistics-top .title-content {
	width: 40%;
}

.statistics-box .statistics-top .title-content .content {
	margin-top: 20px;
}

.statistics-box .statistics-bottom {
	width: 100%;
	height: 50vh;
  	    min-height: 540px;
	background-color: #DEEFFF;
	display: flex;
	justify-content: space-around;
	align-items: center;
}

.statistics-box .statistics-bottom .box {
			  width: 400px;
			  height: 400px;
			  display: flex;
			  background-image: url('/upload/1/cms/content/fxbj.svg');
			  background-size: 100% 100%;
			  position: relative; /* 设置相对定位 */
  			  margin-top: 40px;
			}
			
			.statistics-box .statistics-bottom .box .left-circle {
				    width: 126px;
				    height: 153px;
				    background-image: url('/upload/1/cms/content/zq.svg');
				    position: absolute;
				    top: 20px;
				    left: 135px;
					animation: cir_p 5s linear 0s infinite;
			}
			
			.statistics-box .statistics-bottom .box  .right-circle {
				    width: 126px;
				    height: 153px;
				    background-image: url('/upload/1/cms/content/yq.svg');
				    position: absolute;
				    top: 20px;
				    left: 135px;
					animation: cir_p 5s linear 0s infinite;
			}
			
			.statistics-box .statistics-bottom .box  .center-circle {
				   width: 164px;
				       height: 101px;
				       background-image: url('/upload/1/cms/content/zhq.svg');
				       position: absolute;
				       top: 50px;
				       left: 115px;
					   animation: cir_p 5s linear 0s infinite;
			}
			.statistics-box .statistics-bottom .box  .light {
			      width: 170px;
			      height: 240px;
			      position: absolute;
			      top: 5px;
			      left: 113px;
			  transform-origin: 50% 100%;
			  background-image: url('/upload/1/cms/content/d.svg');
			  background-size: cover;
			  background-repeat: no-repeat;
			  background-position: center;
			  z-index: 1;
			}
			
			.statistics-box .statistics-bottom .box  .ball{
				width: 50px;
				    height: 50px;
				    background-image: url('/upload/1/cms/content/xq.svg');
				    background-size: cover;
				    background-repeat: no-repeat;
				    background-position: center;
				    position: absolute;
				    transform-origin: center;
				    z-index: 0;
				    top: 70px;
				    left: 175px;
			}
		
			@keyframes cir_p {
			    0% {
			      transform: rotateZ(0deg);
			    }
			    100% {
			      transform: rotateZ(-360deg);
			    }
			  }

.statistics-box .statistics-bottom .title-content {
	width: 40%;
}

.statistics-box .statistics-bottom .title-content .content {
	margin-top: 20px;
}

.statistics-box .statistics-bottom .title-content .content strong {
	font-weight: normal;
}