.co-tittle,
.sub-tittle,
#bbfresh_tech,
#banner_pro,
.martin_loop,
.about_content,
.box2,
#news-video,
.newshot ul li,
.cp-series ul li,
.cp-change ul li,
#cp .swiper-container .swiper-slide,
.itemUp { opacity: 0; transform: translateY(50px); } 


.up_100,
.pro-smallbox ,
.pro-slogan,
.alline,
.about-box,
.abt_group,
.news-items,
.dh_fadeIn ,
.about-fixed,
.box-group-320,
.mode-slide .co-tittle,
.zs-box img { opacity: 0; transform: translateY(0);} 

.star_s50 img,
.star_dh { 
	transform-origin: center center; transform: scale(.15); 
	animation: starR 2s ease-in-out infinite ;
}



#camping,
.dh_fadeInLeft { opacity: 0;  transform: translateX(-100px); } 


/* star */
@-webkit-keyframes starR {
	0% {   transform: scale(.5);  }	
	60% { transform: scale(1);  }
	100% { transform: scale(.5);  }
}

@-moz-keyframes starR {
	0% {   transform: scale(.5);  }	
	60% { transform: scale(1);  }
	100% { transform: scale(.5);  }
}

@-o-keyframes starR {
	0% {   transform: scale(.5);  }	
	60% { transform: scale(1);  }
	100% { transform: scale(.5);  }
}

@keyframes starR {
	0% {   transform: scale(.5);  }	
	60% { transform: scale(1);  }
	100% { transform: scale(.5);  }
}






/* star */


@-webkit-keyframes leftloop {
	0% {  transform: translate( 0 ,0);  }
	30% {  transform: translate( -130% ,0);  }
	40% { transform: translate( 0 , 150%);   }
	60% { transform: translate(83% ,0);  }
	100% { transform: translate(0 ,0);  }
}

@-moz-keyframes leftloop {
	0% {  transform: translate( 0 ,0);  }
	30% {  transform: translate( -130% ,0);  }
	40% { transform: translate( 0 , 150%);   }
	60% { transform: translate(83% ,0);  }
	100% { transform: translate(0 ,0);  }
}

@-ms-keyframes leftloop {
	0% {  transform: translate( 0 ,0);  }
	30% {  transform: translate( -130% ,0);  }
	40% { transform: translate( 0 , 150%);   }
	60% { transform: translate(83% ,0);  }
	100% { transform: translate(0 ,0);  }
}

@keyframes leftloop {
	0% {  transform: translate( 0 ,0);  }
	30% {  transform: translate( -130% ,0);  }
	40% { transform: translate( 0 , 150%);   }
	60% { transform: translate(83% ,0);  }
	100% { transform: translate(0 ,0);  }
}


.swiper-button-next:hover .mdui-icon {  animation: rightloop .45s ease-in-out forwards; }

@-webkit-keyframes rightloop {
	0% {  transform: translate( 0 ,0);  }
	30% {  transform: translate( 130% ,0);  }
	40% { transform: translate( 0 ,150%);   }
	60% { transform: translate(-83% ,0);  }
	100% { transform: translate(0 ,0);  }
}

@-moz-keyframes rightloop {
	0% {  transform: translate( 0 ,0);  }
	30% {  transform: translate( 130% ,0);  }
	40% { transform: translate( 0 ,150%);   }
	60% { transform: translate(-83% ,0);   }
	100% { transform: translate(0 ,0);   }
}

@-ms-keyframes rightloop {
	0% {  transform: translate( 0 ,0);  }
	30% {  transform: translate( 130% ,0);  }
	40% { transform: translate( 0 ,150%);   }
	60% { transform: translate(-83% ,0);   }
	100% { transform: translate(0 ,0);   }
}

@keyframes rightloop {
	0% {  transform: translate( 0 ,0);  }
	30% {  transform: translate( 130% ,0);  }
	40% { transform: translate( 0 ,150%);   }
	60% { transform: translate(-83% ,0);   }
	100% { transform: translate(0 ,0);   }
}


.imgOpen::after { content: ""; animation: imgOpen 1s ease-in-out .15s forwards; }

@-webkit-keyframes imgOpen {
	from{  transform: translateX(0);  }
	to{ transform: translateX(100%);   }
}

@-ms-keyframes imgOpen {
	from{  transform: translateX(0);  }
	to{ transform: translateX(100%);   }
}

@-moz-keyframes imgOpen {
	from{  transform: translateX(0);  }
	to{ transform: translateX(100%);   }
}

@keyframes imgOpen {
	from{  transform: translateX(0);  }
	to{ transform: translateX(100%);   }
}



.fadeInUp2 { animation: fadeInUp2 .35s ease-in-out forwards;  }

@-webkit-keyframes fadeInUp2 {
	from{ opacity: 0; transform: translateY(50px); }
	to{ opacity: 1; transform: translateY(0px); }
}

@-ms-keyframes fadeInUp2 {
	from{ opacity: 0; transform: translateY(50px); }
	to{ opacity: 1; transform: translateY(0px); }
}

@-o-keyframes fadeInUp2 {
	from{ opacity: 0; transform: translateY(50px); }
	to{ opacity: 1; transform: translateY(0px); }
}

@keyframes fadeInUp2 {
	from{ opacity: 0; transform: translateY(50px); }
	to{ opacity: 1; transform: translateY(0px); }
}



.fadeIn2 { animation: fadeIn2 .35s ease-in-out forwards;  }

@-webkit-keyframes fadeIn2 {
	from{ opacity: 0;  }
	to{ opacity: 1;  }
}


@-ms-keyframes fadeIn2 {
	from{ opacity: 0;  }
	to{ opacity: 1;  }
}

@-o-keyframes fadeIn2 {
	from{ opacity: 0;  }
	to{ opacity: 1;  }
}

@keyframes fadeIn2 {
	from{ opacity: 0;  }
	to{ opacity: 1;  }
}



.fadeInLeft2 { animation: fadeInLeft2 .5s ease-in-out forwards;  }

@-webkit-keyframes fadeInLeft2  {
	from{ opacity: 0; transform: translateX(-100%); }
	to{ opacity: 1; transform: translateX(0);  }
}

@-moz-keyframes fadeInLeft2  {
	from{ opacity: 0; transform: translateX(-100%); }
	to{ opacity: 1; transform: translateX(0);  }
}

@-ms-keyframes fadeInLeft2  {
	from{ opacity: 0; transform: translateX(-100%); }
	to{ opacity: 1; transform: translateX(0);  }
}

@keyframes fadeInLeft2  {
	from{ opacity: 0; transform: translateX(-100%); }
	to{ opacity: 1; transform: translateX(0);  }
}



.img16_9 {
    height: 0;
    padding-top: 63.25%;
    background-repeat: no-repeat;
    background-size: cover;
}


/* change */

@-webkit-keyframes change {
	from{	
		z-index: 8;	
		width: 500px;
		height: 500px;
		background-color: #32d46b;
		border: 5px #32d46b solid;
		border-radius: 80px;
		padding: 60px 50px;
	}
	to{		
		z-index: 28;
		width: 190px;
		height: 190px;
		background-color: #fff;
		border: 5px #32d46b solid;
		border-radius: 40px;
		padding: 20px;
	}
}

@-moz-keyframes change {
	from{	
		z-index: 8;	
		width: 500px;
		height: 500px;
		background-color: #32d46b;
		border: 5px #32d46b solid;
		border-radius: 80px;
		padding: 60px 50px;
	}
	to{		
		z-index: 28;
		width: 190px;
		height: 190px;
		background-color: #fff;
		border: 5px #32d46b solid;
		border-radius: 40px;
		padding: 20px;
	}
}

@-ms-keyframes change {
	from{	
		z-index: 8;	
		width: 500px;
		height: 500px;
		background-color: #32d46b;
		border: 5px #32d46b solid;
		border-radius: 80px;
		padding: 60px 50px;
	}
	to{		
		z-index: 28;
		width: 190px;
		height: 190px;
		background-color: #fff;
		border: 5px #32d46b solid;
		border-radius: 40px;
		padding: 20px;
	}
}




@keyframes change {
	from{	
		z-index: 8;	
		width: 500px;
		height: 500px;
		background-color: #32d46b;
		border: 5px #32d46b solid;
		border-radius: 80px;
		padding: 60px 50px;
	}
	to{		
		z-index: 28;
		width: 190px;
		height: 190px;
		background-color: #fff;
		border: 5px #32d46b solid;
		border-radius: 40px;
		padding: 20px;
	}
}

/* change-end */
/* X轴偏移 */
@-webkit-keyframes changeLeft {
	from{  transform: translate(0,0); }
	to{ transform: translate(535px,-80px);  }
}

@-moz-keyframes changeLeft {
	from{  transform: translate(0,0); }
	to{ transform: translate(535px,-80px);  }
}

@-o-keyframes changeLeft {
	from{  transform: translate(0,0); }
	to{ transform: translate(535px,-80px);  }
}

@-ms-keyframes changeLeft {
	from{  transform: translate(0,0); }
	to{ transform: translate(535px,-80px);  }
}


@keyframes changeLeft {
	from{  transform: translate(0,0); }
	to{ transform: translate(535px,-80px);  }
}
/* X轴偏移-end */







/* leftReback */
@-webkit-keyframes leftReback {
	from{  transform: translate(535px,-80px);  }
	to{ transform:translate(0,0);  }
}

@-moz-keyframes leftReback {
	from{  transform: translate(535px,-80px);  }
	to{ transform:translate(0,0);  }
}

@-o-keyframes leftReback {
	from{  transform: translate(535px,-80px);  }
	to{ transform:translate(0,0);  }
}

@-ms-keyframes leftReback {
	from{  transform: translate(535px,-80px);  }
	to{ transform:translate(0,0);  }
}

@keyframes leftReback {
	from{  transform: translate(535px,-80px);  }
	to{ transform:translate(0,0);  }
}

/* leftReback-end */


/* reback */

@-webkit-keyframes reback {
	from{	
		z-index: 28;
		width: 160px;
		height: 160px;
		background-color: #fff;
		border: 5px #32d46b solid;
		border-radius: 40px;
		padding: 20px;
	}
	to{	
		z-index: 8;
		width: 500px;
		height: 500px;
		background-color: #32d46b;
		border: 5px #32d46b solid;
		border-radius: 80px;
		padding: 60px 50px;
		
	}
}


@keyframes reback {
	from{	
		z-index: 28;
		width: 190px;
		height: 190px;
		background-color: #fff;
		border: 5px #32d46b solid;
		border-radius: 40px;
		padding: 20px;
	}
	to{	
		z-index: 8;
		width: 500px;
		height: 500px;
		background-color: #32d46b;
		border: 5px #32d46b solid;
		border-radius: 80px;
		padding: 60px 50px;
		
	}
}


/* reback-end */