.loadPic {
	width: 100%;
	height: 100%;
	position: absolute;
	overflow: hidden;
	left:50%;
	top:50%;
	transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
	z-index:5;
}

.loadPic-logo{
  position: absolute;
  width:167px;
  left:40px;
  top:25px;
}

.loadPic-wrapper{
  position: absolute;
}

.loadMain {
	width: 100%;
	position: absolute;
	margin: 0 auto 0;
	top: 350px;
}

.loadBook {
	display: block;
	width: 620px;
	margin: 0 auto 0;
	animation: gifttop 2s linear infinite;
	-webkit-animation: gifttop 2s linear infinite;
}

@-webkit-keyframes gifttop {
	0% {
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0)
	}

	60% {
		-webkit-transform: translate3d(0, 0px, 0);
		transform: translate3d(0px, 10px, 0)
	}

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

@keyframes gifttop {
	0% {
		-webkit-transform: translate3d(0, 0, 0);
		transform: translate3d(0, 0, 0)
	}

	40% {
		-webkit-transform: translate3d(0, 0px, 0);
		transform: translate3d(0px, 10px, 0)
	}

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

.loadPercent {
	width: 680px;
	height: 70px;
	background: url('https://cdnstatic.yingxiong.com/dna/double_helix_bright/images/jd.png') no-repeat center;
	background-size: cover;
	position: relative;
	margin: 166px auto 0;
}

.loadPercent .lTxt {
	display: block;
	width: 211px;
	margin: 50px auto 0;
	animation: loadDesc 1.5s linear infinite;
	-webkit-animation: loadDesc 1.5s linear infinite;
}

.loadPercent i {
	height: 25px;
	background: url('https://cdnstatic.yingxiong.com/dna/double_helix_bright/images/zc.png') no-repeat center;
	background-size: 100% 100%;
	position: absolute;
	left: 5px;
	top: 5px;
	border-radius: 10px;
}
.loadPercent b {
  display: block;
  width: 95.4%;
  height: 22px;
  background: #f2f3ff;
  position: absolute;
  right: 21px;
  top: 7px;
  border-top-right-radius: 17px;
  border-bottom-right-radius: 17px;
}
.loadPercent .loadMao {
	display: block;
	width: 72px;
	position: absolute;
	left: 0;
	top: -91px;
	z-index: 1;
	animation: feather 2s linear infinite;
	-webkit-animation: feather 2s linear infinite;
	transform-origin: center center;
	-webkit-transform: center center;
  margin-left:-20px;
}

/* .ma {
	display: block;
	width: 4rem;
	position: absolute;
	right: 0;
	bottom: 0;
	z-index: 1;
} */

.xing1 {
	display: block;
	width: 39px;
	position: absolute;
  left: 40px;
  top: 1027px;
	animation: star 1s linear infinite;
	-webkit-animation: star 1s linear infinite;
}

.xing2 {
	display: block;
	width: 89px;
	position: absolute;
  left: 41px;
  top: 1149px;
	animation: star 2s linear infinite;
	-webkit-animation: star 2s linear infinite;
}

.xing3 {
	display: block;
	width: 81px;
	position: absolute;
	right: 0px;
  top: 28px;
	animation: star 3s linear infinite;
	-webkit-animation: star 3s linear infinite;
}

.xing4 {
	display: block;
	width: 39px;
	position: absolute;
  right: 147px;
  top: 206px;
	animation: star 2s linear infinite;
	-webkit-animation: star 2s linear infinite;
}

.xing5 {
	display: block;
	width: 81px;
	position: absolute;
  right: 29px;
  top: 1198px;
	animation: star 3s linear infinite;
	-webkit-animation: star 3s linear infinite;
}