.whatApp{
	width: 7.1rem;
	height: 4.28rem;
	background: url(../images/app-bg.png) no-repeat;
	background-size: cover;
	background-position: center;
	padding-left: 0.4rem;
	overflow: hidden;
	margin-top: 1.24rem;
}
.whatApp p:nth-of-type(1){
	font-size: 0.36rem;
	color: #f0ff00;
	margin-top: 1.41rem;
	line-height: 0.54rem;
}
.whatApp p:nth-of-type(2){
	font-size: 0.24rem;
	color: #ffffff;
	line-height: 0.54rem;
}

.whatApp p:nth-of-type(3){
	font-size: 0.40rem;
	color: #f0ff00;
	line-height: 0.54rem;
}

.doApp{
	width: 7.5rem;
	background: #edf6f1;
	padding-top: 0.6rem;
	padding-bottom: 0.82rem;
}
.top h3{
	font-size: 0.36rem;
	color: #333333;
	font-weight: normal;
	line-height: 0.54rem;
	text-align: center;
}
.top h3 span{
	color: #1cac8b;;
}
.top p{
	font-size: 0.24rem;
	color: #666;
	text-align: center;
	margin-bottom: 0.36rem;
}
.doApp .doList{
	width: 7.5rem;
	height: 7.62rem;
	background: url(../images/ser-bg.png) no-repeat;
	background-size:cover ;
	background-position: center;
	position: relative;
	
}
.doApp .doList i{
	display: inline-block;
	position: absolute;
	z-index: 999;
	
}




.doApp .doList .doListBig i:nth-of-type(1){
	height: 0.5rem;
	width: 0.42rem;
	top: 4.83rem;
	left: 0.98rem;
}
.doApp .doList .doListBig i:nth-of-type(2){
	height: 0.52rem;
	width: 0.52rem;
	top: 3.24rem;
	left: 0.55rem;
}
.doApp .doList .doListBig i:nth-of-type(3){
	height: 0.49rem;
	width: 0.57rem;
	top: 1.77rem;
	left: 1.00rem;
}
.doApp .doList .doListBig i:nth-of-type(4){
	height: 0.55rem;
	width: 0.53rem;
	top: 0.52rem;
	left: 2.41rem;
}
.doApp .doList .doListBig i:nth-of-type(5){
	height: 0.53rem;
	width: 0.53rem;
	top: 0.55rem;
	left: 4.57rem;
}
.doApp .doList .doListBig i:nth-of-type(6){
	height: 0.43rem;
	width: 0.60rem;
	top: 1.80rem;
	left: 5.93rem;
}
.doApp .doList .doListBig i:nth-of-type(7){
	height: 0.44rem;
	width: 0.49rem;
	top: 3.28rem;
	left: 6.46rem;
}
.doApp .doList .doListBig i:nth-of-type(8){
	height: 0.5rem;
	width: 0.46rem;
	top: 4.83rem;
	left: 6.08rem;
}

.doApp .doList .doListSmall i:nth-of-type(1){
	height: 0.27rem;
	width: 0.27rem;
	top: 2.36rem;
	left: 3.12rem;
}

.doApp .doList .doListSmall i:nth-of-type(2){
	height: 0.27rem;
	width: 0.23rem;
	top: 2.36rem;
	left: 3.63rem;
}
.doApp .doList .doListSmall i:nth-of-type(3){
	height: 0.25rem;
	width: 0.35rem;
	top: 2.38rem;
	left: 4.08rem;
}
.doApp .doList .doListSmall i:nth-of-type(4){
	height: 0.27rem;
	width: 0.30rem;
	top: 2.94rem;
	left: 3.10rem;
}
.doApp .doList .doListSmall i:nth-of-type(5){
	height: 0.30rem;
	width: 0.34rem;
	top: 2.94rem;
	left: 3.56rem;
}
.doApp .doList .doListSmall i:nth-of-type(6){
	height: 0.29rem;
	width: 0.29rem;
	top: 2.94rem;
	left: 4.08rem;
}
.doApp .doList .doListSmall i:nth-of-type(7){
	height: 0.31rem;
	width: 0.30rem;
	top: 3.46rem;
	left: 3.10rem;
}
.doApp .doList .doListSmall i:nth-of-type(8){
	height: 0.26rem;
	width: 0.25rem;
	top: 3.50rem;
	left: 3.62rem;
}

.advantage{
	width: 7.5rem;
	background-color: #f9f9f9;
	padding-top: 0.6rem;
	padding-bottom: 0.56rem;
}
.advantageList{
	width: 5.4rem;
	padding: 0 1.05rem;
	height: 5.1rem;
	display: -moz-box;  /* Firefox */
	display: -ms-flexbox;    /* IE10 */
	display: -webkit-box;    /* Safari */ 
	display: -webkit-flex;    /* Chrome, WebKit */
	display: box; 
	display: flexbox; 
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	text-align: center;
	
	
}
.advantageList i{
	display: block;
	height: 2.09rem;
	width: 2.09rem;
	margin-bottom: 0.11rem;
	
}
.advantageList i img{
	animation: go 1s linear infinite;
	-webkit-animation: go 1s linear infinite;
}
.advantageList span{
	display: block;
	font-size: 0.24rem;
	color: #333333;
	margin-bottom: 0.21rem;
}

.serFlow{
	width: 7.5rem;
	padding-top: 0.6rem;
	padding-bottom: 0.44rem;
}
.flowList{
	width: 7.1rem;
	height: 5.36rem;
	padding: 0 0.2rem;
	
}
.flowList ul{
	display: -moz-box;  /* Firefox */
	display: -ms-flexbox;    /* IE10 */
	display: -webkit-box;    /* Safari */ 
	display: -webkit-flex;    /* Chrome, WebKit */
	display: box; 
	display: flexbox; 
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
}
.flowList ul li{
	height: 2.48rem;
	width: 2.1rem;
	margin-bottom: 0.4rem;
	
	border-radius: 0.2rem;
}
.flowList ul li p{
	height: 1.24rem;
	width: 2.1rem;
	line-height: 1.24rem;
	text-align: center;
}

.flowList ul li p:nth-of-type(1){
	font-size: 0.66rem;
	color: #aaaaaa;
	border-radius: 0.2rem 0.2rem 0 0;
	background: #fcfcfc;
	font-family: DIN-Medium;
}
.flowList ul li p:nth-of-type(2){
	font-size: 0.30rem;
	color: #fcfcfc;
	border-radius: 0 0 0.2rem 0.2rem;
}

.flowList ul li .p1{
	background-image: linear-gradient(99deg, #3bb7f8 0%, #23cdf8 31%, #0be2f8 100%)
}
.flowList ul li .p2{
	background-image: linear-gradient(144deg, 
		#5e9dfc 0%, 
		#7e8ffd 56%, 
		#9d80fe 100%)
}
.flowList ul li .p3{
	background-image: linear-gradient(-61deg, 
		#2efb76 0%, 
		#33fd8e 50%, 
		#37ffa1 100%)
}
.flowList ul li .p4{
	background-image: linear-gradient(144deg, 
		#f9b35e 0%, 
		#f99e6e 56%, 
		#f9897d 100%)
}
.flowList ul li .p5{
	background-image: linear-gradient(251deg, 
		#56c6fa 0%, 
		#68dafd 56%, 
		#79eeff 100%)
}
.flowList ul li .p6{
	background-image: linear-gradient(56deg, 
		#cd1ad8 0%, 
		#e63ce3 45%, 
		#ff5eee 100%)
}




 @keyframes go {
 0% {
 margin-top: 0;
}
50% {
margin-top: 0.1rem;
}
 100% {
margin-top: 0;
}
}