@media screen and (min-width: 320px)
{
.body2
{
	border-top:1px #eee solid;
	width: 100%;
	overflow: hidden;

}
.bread
{
	width: 1200px;
	margin:0 auto;
	overflow: hidden;
	margin-top: 33px;
	margin-bottom: 20px;
}
.bread_home
{
	float: left;
	padding-top: 2px;
}
.bread_article
{
	float: left;
	font-size: 15px;
	padding-left: 3px;
}
.bread_article a 
{
	color: black;
}
.bread_article a:hover
{
	color: #008dd4;
}
.bread_article2
{
	font-size: 14px;
	padding-top: 2px;
}
.aboutus_q1
{
	background: url(../images/aboutus01.jpg) no-repeat bottom;
	background-size: 1920px auto;
	width: 100%;
	height: 530px;
}
.aboutus_q2
{
	width: 1200px;
	overflow: hidden;
	margin:0 auto;
	margin-top: 70px;
}
.aboutus_q2_left
{
	width: 547px;
	height: auto;
	float: left;
	margin-top: 5px;
}
.aboutus_q2_right
{
	width: 100%;
	height: auto;
	float: right;
}
.aboutus_q2_title
{
	color: #008dd4;
	font-size: 34px;
	margin-top: 0px;
	text-align: left;
	margin-bottom: 45px;
}

.aboutus_q2_article
{
     line-height: 25px;
     color: black;

}
.aboutus_q3
{
	width: 1200px;
	overflow: hidden;
	margin:0 auto;
	margin-top: 40px;

}
.aboutus_q4
{
	width: 1200px;
	overflow: hidden;
	margin:0 auto;
	margin-top: 20px;
	
}
.aboutus_q5
{
	width: 100%;
	background: #eee;
}
.aboutus_q5_item
{
	width: 1200px;
	overflow: hidden;
	margin:0 auto;
	/*margin-top: 40px;*/
}
.aboutus_q5_left
{
	width: 547px;
	height: auto;
	float: left;
	margin-top: 35px;
	margin-bottom: 35px;
}
.aboutus_q5_right
{
	width: 600px;
	height: auto;
	float: right;
	margin-top: 35px;
}
.aboutus_q5_right_title
{
	font-size: 28px;
	float: left;
	margin-top: 15px;
}
.aboutus_q5_right_subtitle
{
	font-size:18px;
	float: left;
	margin-top: 28px;
	margin-left: 30px;
}
.aboutus_q5_right_article
{
	clear: both;
	padding-top: 15px;
	font-size: 14px;
	line-height: 21px;

}


.aboutus_q6
{
	width: 100%;
	background: #eee;
	overflow: hidden;
}
.aboutus_q6_item
{
	width: 1200px;
	overflow: hidden;
	margin:0 auto;
	margin-top: 40px;

}
.aboutus_q6_left
{
	width: 600px;
	height: auto;
	float: left;
	margin-top: 35px;
	
}
.aboutus_q6_right
{
	width: 525px;
	height: auto;
	float: right;
	margin-top: 35px;
	margin-bottom: 35px;
}
.aboutus_q6_left_title
{
	font-size: 28px;
	float: left;
	margin-top: 15px;
}
.aboutus_q6_left_subtitle
{
	font-size:18px;
	float: left;
	margin-top: 28px;
	margin-left: 30px;
}
.aboutus_q6_left_article
{
	clear: both;
	padding-top: 45px;
	font-size: 14px;
	line-height: 21px;

}
#aboutus1
{
	position: absolute;
	top:500px;
}
#aboutus2
{
	position: absolute;
	top:1050px;
}
#aboutus3
{
	position: absolute;
	top:1550px;
}
.productlist1_q1
{
	background: url(../images/product-banner.jpg) no-repeat bottom;
	background-size: 1920px auto;
	width: 100%;
	height: 528px;
}
.productlist1_q2
{
	width: 1200px;
	position: absolute;
	left:calc(50% - 600px);
	top:600px;
	background-color: white;
	height: 120px;
	border-radius: 10px;
	-webkit-box-shadow:0px 5px 20px #aaa;
    -moz-box-shadow:0px 5px 20px #aaa;
    box-shadow:0px 5px 20px #aaa;
}
.productlist1_q2_item
{
	width: 32%;
	height: 80px;
	float: left;
	margin-top: 20px;
	margin-right: 1%;
	margin-left: 0;
	background-color: #eee;
}
.productlist1_q2 a:nth-child(1) .productlist1_q2_item{
    margin-left: 1%;
}
.productlist1_q2_item_selected
{
   /*margin-left: 0;*/
   /*margin-right: 0;*/
   background-color: #008dd4;
}
.productlist1_q2_item img
{
	margin-left: 125px;
	margin-top: 20px;
	float: left;
}
.productlist1_q2_title
{
	font-size: 20px;
	margin-top: 27px;
	margin-left: 20px;
	float: left;
	color: black;


}
.productlist1_q2_item_selected .productlist1_q2_title
{
	color: white;
}
.productlist1_q3
{
	width: 1220px;
	margin:0 auto;
	overflow: hidden;
	height: 700px;
	margin-top: 90px;
	padding-top: 20px;
}
.productlist1_q3_item
{
	width: 378px;
	/*height: 660px;*/
	margin-left: 20px;
	border:1px solid #e4e4e4;
    float: left;
    border-radius: 5px;
    overflow: hidden;
    transition:All 0.4s ease-in-out;
  -webkit-transition:All 0.4s ease-in-out;
  -moz-transition:All 0.4s ease-in-out;
  -o-transition:All 0.4s ease-in-out;
}
.productlist1_q3_item:hover
{
	transform:translate(0,-10px);
  -webkit-transform:translate(0,-10px);
  -moz-transform:translate(0,-10px);
  -o-transform:translate(0,-10px);
  -ms-transform:translate(0,-10px);
  -webkit-box-shadow:0px 5px 10px #999;
    -moz-box-shadow:0px 5px 10px #999;
    box-shadow:0px 5px 10px #999;
      transition:All 0.4s ease-in-out;
  -webkit-transition:All 0.4s ease-in-out;
  -moz-transition:All 0.4s ease-in-out;
  -o-transition:All 0.4s ease-in-out;
  border: 1px solid #e4e4e4;
}
.productlist1_q3_item_img
{
	width: 100%;
	height: 260px;
	background-color: #e4e4e4;
}
.productlist1_q3_item_title
{
	font-size: 24px;
	color: black;
	margin-top: 30px;
	margin-left: 20px;
	margin-right: 20px;
}
.productlist1_q3_item_article
{
	color: black;
	margin:20px 20px;
	font-size: 15px;
	line-height: 22px;
   text-align: justify;
}


.productlist2_q2_item
{
	width: 32%;
	height: 80px;
	float: left;
	margin-top: 20px;
	margin-right: 1%;
	margin-left: 0;
	background-color: #eee;
}
.productlist1_q2 a:nth-child(1) .productlist2_q2_item{
    margin-left: 1%;
}
.productlist2_q2_item_selected
{
   background-color: #008dd4;
}
.productlist2_q2_item img
{
	margin-left: 125px;
	margin-top: 20px;
	float: left;
}
.productlist2_q2_item_selected .productlist1_q2_title
{
	color: white;
}
.productshow_q1
{
	width: 1200px;
	margin:0 auto;
	overflow: hidden;
}
.productshow_q1_left
{
	width: 517px;
	float: left;
	margin-bottom: 30px;
}
.productshow_q1_right
{
	width: 1200px;
	float: right;
}
.productshow_q1_title
{
	font-size: 24px;
	margin-bottom: 10px;
}
.productshow_q1_article
{
	font-size: 16px;
	line-height: 30px;
	margin-top: 20px;
	text-align: justify;
}
.newslist_top
{
	margin-top: 25px;
	font-size: 32px;
	width: 1200px;
	overflow: hidden;
	margin:0 auto;
	padding-bottom: 10px;
	border-bottom: 1px solid #bfbfbf;
}
.newslist1_body
{
	width: 1200px;
	overflow: hidden;
	margin:0 auto;
	margin-top: 55px;
	margin-bottom: 55px;
}
.newslist1_body_item
{
	width: 1200px;
	overflow: hidden;
	margin:0 auto;
	margin-top: 35px;
	display: none;

}
.newslist1_body_left
{
	width: 318px;
	float: left;
	margin-left: 30px;
	margin-bottom: 35px;
	height: 183px;
	overflow: hidden;
}
.newslist1_body_left img
{
	transition: 0.3s;
}
.newslist1_body_left img:hover
{
	transform: scale(1.1);
	-webkit-transform: scale(1.1);
	transition: 0.3s;
}
.newslist1_body_right
{
	width: 650px;
	float: right;
	margin-right: 160px;
}
.newslist1_body_right_title
{
	font-size: 18px;
	color: black;
	margin-bottom: 15px;
	margin-top: 10px;
}
.newslist1_body_right_title:hover
{
	color: #008dd4;
}
.newslist1_body_right_article
{
	font-size: 15px;
	color: #666;
	margin-bottom: 15px;
	line-height: 2;
}
.newslist1_body_right_time
{
	font-size: 14px;
	color: #999;
}
.newslist3_body_top
{
	width: 1200px;
	margin-left: 5px;
	border-bottom: 1px solid #bfbfbf;
	overflow: hidden;
	padding-bottom: 12px;
}
.newslist3_body_title
{
	font-size: 18px;
	color: black;
	margin-bottom: 0px;
	margin-top: 0px;
	float: left;
	width: 800px;
}
.newslist3_body_title:hover
{
	color: #008dd4;
}
.newslist3_body_article
{
	font-size: 15px;
	color: #666;
	margin-bottom: 15px;
	width: 1000px;
	margin-left: 5px;
	margin-top: 12px;
	line-height: 24px;

}
.newslist3_body_time
{
	font-size: 14px;
	color: #999;
	float: right;
	width: 100px;
	margin-top: 5px;
}

.productlist1_page
{

    clear: both;
    padding-top: 30px;
    overflow: hidden;
        width: 1200px;
    margin: 0 auto;
    margin-bottom: 30px;
    margin-left: 200px;
   
  
}
.newlist3_page
{
	margin-top: 50px;
}
.productlist1_page_item
{
	float: left;
	font-size: 18px;
	width: 80px;
	margin-top: 3px;
	text-align: center;
	cursor: pointer;

}
.productlist1_page_item2
{
	display: none;
}
#prev_item
{ 
	margin-top: 0px;
}
#next_item
{
	margin-top: 0px;
}
.productlist1_page_item_selected
{
	font-weight: bold;
	color: #206ca0;
}

.item_show {
    display: block;
}

.newsshow_top
{
	margin-top: 25px;
	font-size: 24px;
	width: 800px;
	overflow: hidden;
	margin:0 auto;
	text-align: center;
	padding-bottom: 10px;
	/*padding-left: 200px;*/
	/*padding-right: 200px;*/
	border-bottom: 1px solid #bfbfbf;
}
.newsshow_body
{
	width:800px;
	overflow: hidden;
	margin:0 auto;
}
.newsshow_body_time
{
	font-size: 15px;
	color: #999;
	text-align: center;
		margin-top: 8px;
}
.newsshow_body_article
{
	margin-top: 20px;
	padding-bottom: 20px;
	border-bottom: 1px solid #bfbfbf;
}
.newsshow_bottom
{
    width: 1200px;
	overflow: hidden;
	margin:0 auto;
	margin-top: 20px;
	margin-bottom: 50px;
}
.newsshow_bottom_item
{
	color: black;
	margin-bottom: 14px;
}
.contact_top
{
	/*margin-top: 25px;*/
	font-size: 32px;
	width: 1200px;
	overflow: hidden;
	margin:0 auto;
	/*padding-bottom: 10px;*/
	/*border-bottom: 1px solid #bfbfbf;*/
}
.contactlist1_q1
{
	width: 1200px;
	overflow: hidden;
	margin:0 auto;
}
.contactlist1_q1_title 
{
    color: #008dd4;
    font-size: 34px;
    text-align: left;
    margin-top: 65px;
    margin-bottom: 20px;
}
.contactlist1_q1_subtitle 
{
    color: #000;
    font-size: 24px;
    margin-top: 0px;
    text-align: left;
    margin-top: 30px;
    padding-bottom: 15px;
    border-bottom: 1px solid #bfbfbf;
    cursor: pointer;
}
.contactlist1_q1_item
{
	/*overflow: hidden;*/
	/*height: 0px;*/
	display: none;
	transition: 1s;
}
.contactlist1_q1_item_show
{
    /*height: 700px;*/
    display: block;
    transition: 1s;
}
.contactlist1_q1_article
{
	margin-top: 20px;
	line-height: 30px;
	color: black;
}
.contactlist1_q1_button
{
	color: #008dd4;
	font-size: 18px;
	width: 72px;
	border-bottom: 1px solid #008dd4;
	margin-top: 20px;
	cursor: pointer;
}
.contactlist1_q2
{
	width: 1200px;
	overflow: hidden;
	margin:0 auto;
	margin-bottom: 130px;
}
.contactlist1_q2_title 
{
    color: #008dd4;
    font-size: 34px;
    text-align: left;
    margin-top: 65px;
    margin-bottom: 20px;
}
.contactlist1_q2_subtitle 
{
    color: #000;
    font-size: 24px;
    margin-top: 0px;
    text-align: left;
    margin-top: 30px;
    padding-bottom: 15px;
    border-bottom: 1px solid #bfbfbf;
    cursor: pointer;
}
#contact2
{
	position: absolute;
	top:850px;
}
.contact_q1
{
	background: url(../images/contact01.jpg) no-repeat bottom;
	background-size: 1920px auto;
	width: 100%;
	height: 530px;
	margin-bottom: 366px;
}
.contact_q2
{
    width: 1200px;
	position: absolute;
	left:calc(50% - 600px);
	top:550px;
	
	height: 383px;
	
}
.contact_q2_item
{
	width: 379px;
	float: left;overflow: hidden;
	font-size: 0px;
	margin-left: 10px;
	margin-right: 11px;
}
.contact_q2_img
{
	width: 379px;
	height: 270px;
	overflow: hidden;
}
.contact_q2_item img
{
	width: 100%;
	transition: 0.3s;

}
.contact_q2_item img:hover
{
	transform: scale(1.1);
	-webkit-transform: scale(1.1);
	transition: 0.3s;
}
.contact_q2_article
{
	width: 379px;
	height: 112px;
	background-color: #eee;
	font-size: 24px;
	color: black;
	line-height: 112px;
	text-align: center;

}
.contactlist2_q1
{
	width: 1212px;
	overflow: hidden;
	margin:0 auto;
	margin-top: 68px;
	margin-bottom: 100px;
}
.contactlist2_q1_item
{
	width:283px;
	height:425px;
	float: left;
	-webkit-box-shadow:0px 5px 20px #aaa;
    -moz-box-shadow:0px 5px 20px #aaa;
    box-shadow:0px 5px 20px #aaa;
    overflow: hidden;
    margin-left: 10px;
    margin-right: 10px;
    margin-bottom: 30px;


}
.contactlist2_q1_title
{
	text-align: center;
	font-size: 24px;
	margin-top: 30px;
	width: 283px;
}
.contactlist2_q1_article
{
	text-align: left;
	font-size: 16px;
	margin-top: 24px;
	width: 255px;
	line-height: 24px;
	margin-left: 15px;
}
.contactlist2_q1_img
{
	width: 283px;
	height: 202px;
	overflow: hidden;
}
.contactlist2_q1_item img
{
	width: 100%;
	transition: 0.3s;

}
.contactlist2_q1_item img:hover
{
	transform: scale(1.1);
	-webkit-transform: scale(1.1);
	transition: 0.3s;
}
.contactlist3_q1
{
	width: 1200px;
	overflow: hidden;
	margin:0 auto;
	margin-top: 48px;
	margin-bottom: 100px;
}
.contactlist3_q1_item
{
	width:384px;
	height:275px;
	float: left;
   background-color: #e5e5e5;
    overflow: hidden;
    margin-right: 24px;
    margin-bottom: 30px;


}
.contactlist3_q1_item:nth-child(3n)
{
	margin-right: 0px;
}
.contactlist3_q1_item img
{
	text-align: center;
	margin-left: 144px;
	margin-top: 63px;
	margin-bottom: 20px;
}
.contactlist3_q1_title
{
	font-size: 20px;
	text-align: center;
}
}


@media screen and (min-width: 320px) and (min-device-width:640px)
{
@keyframes topeaseinAnimate
{ 
  0%{ transform: translateY(60px); opacity: 0;}
  /*在0%时设置文字在想X轴-2000px位移处(左边),透明度为0,也就是看不见文字*/ 
  100%{ transform: translateY(0px); opacity: 1;}
  /*在100%时设置文字在想X轴0px位移处,也就是原始布局的位置,透明度为1,也就是文字可以看见了*/
}
@-webkit-keyframes topeaseinAnimate{ 0%{ -webkit-transform: translateY(60px); opacity: 0;} 
100%{ -webkit-transform: translateY(0px); opacity: 1;} }
@-o-keyframes topeaseinAnimate{ 0%{ -webkit-transform: translateY(60px); opacity: 0;} 
100%{ -webkit-transform: translateY(0px); opacity: 1;} }
@-ms-keyframes topeaseinAnimate{ 0%{ -webkit-transform: translateY(60px); opacity: 0;} 
100%{ -webkit-transform: translateY(0px); opacity: 1;} }
@-moz-keyframes topeaseinAnimate{ 0%{ -webkit-transform: translateY(60px); opacity: 0;} 
100%{ -webkit-transform: translateY(0px); opacity: 1;} }
.aboutus_q1{ animation: topeaseinAnimate 0.8s ease 1; /*调用已定义好的动画lefteaseinAnimate,全程运行时间1S,进入的速度曲线为ease,只播放一次*/ 
-webkit-animation: topeaseinAnimate 0.8s ease  1;

-ms-animation: topeaseinAnimate 0.8s ease 1; 
-o-animation: topeaseinAnimate 0.8s ease 1; 
-moz-animation: topeaseinAnimate 0.8s ease 1; 
/*规定动画的最后状态为结束状态*/ 
animation-fill-mode:forwards; 
-webkit-animation-fill-mode: forwards; 
-o-animation-fill-mode: forwards; 
-ms-animation-fill-mode: forwards; 
-moz-animation-fill-mode: forwards; }
.aboutus_q3ani{ animation: topeaseinAnimate 0.8s ease 1; /*调用已定义好的动画lefteaseinAnimate,全程运行时间1S,进入的速度曲线为ease,只播放一次*/ 
-webkit-animation: topeaseinAnimate 0.8s ease  1;

-ms-animation: topeaseinAnimate 0.8s ease 1; 
-o-animation: topeaseinAnimate 0.8s ease 1; 
-moz-animation: topeaseinAnimate 0.8s ease 1; 
/*规定动画的最后状态为结束状态*/ 
animation-fill-mode:forwards; 
-webkit-animation-fill-mode: forwards; 
-o-animation-fill-mode: forwards; 
-ms-animation-fill-mode: forwards; 
-moz-animation-fill-mode: forwards; }
.productlist1_q2{ animation: topeaseinAnimate 0.8s ease 1; /*调用已定义好的动画lefteaseinAnimate,全程运行时间1S,进入的速度曲线为ease,只播放一次*/ 
-webkit-animation: topeaseinAnimate 0.8s ease  1;

-ms-animation: topeaseinAnimate 0.8s ease 1; 
-o-animation: topeaseinAnimate 0.8s ease 1; 
-moz-animation: topeaseinAnimate 0.8s ease 1; 
/*规定动画的最后状态为结束状态*/ 
animation-fill-mode:forwards; 
-webkit-animation-fill-mode: forwards; 
-o-animation-fill-mode: forwards; 
-ms-animation-fill-mode: forwards; 
-moz-animation-fill-mode: forwards; }
.productlist1_q3{ animation: topeaseinAnimate 0.8s ease 1; /*调用已定义好的动画lefteaseinAnimate,全程运行时间1S,进入的速度曲线为ease,只播放一次*/ 
-webkit-animation: topeaseinAnimate 0.8s ease  1;

-ms-animation: topeaseinAnimate 0.8s ease 1; 
-o-animation: topeaseinAnimate 0.8s ease 1; 
-moz-animation: topeaseinAnimate 0.8s ease 1; 
/*规定动画的最后状态为结束状态*/ 
animation-fill-mode:forwards; 
-webkit-animation-fill-mode: forwards; 
-o-animation-fill-mode: forwards; 
-ms-animation-fill-mode: forwards; 
-moz-animation-fill-mode: forwards; }
.contact_q2_item:nth-child(2){ animation: topeaseinAnimate 0.8s ease 1; /*调用已定义好的动画lefteaseinAnimate,全程运行时间1S,进入的速度曲线为ease,只播放一次*/ 
-webkit-animation: topeaseinAnimate 0.8s ease  1;

-ms-animation: topeaseinAnimate 0.8s ease 1; 
-o-animation: topeaseinAnimate 0.8s ease 1; 
-moz-animation: topeaseinAnimate 0.8s ease 1; 
/*规定动画的最后状态为结束状态*/ 
animation-fill-mode:forwards; 
-webkit-animation-fill-mode: forwards; 
-o-animation-fill-mode: forwards; 
-ms-animation-fill-mode: forwards; 
-moz-animation-fill-mode: forwards; }
.contactlist1_q1{ animation: topeaseinAnimate 0.8s ease 1; /*调用已定义好的动画lefteaseinAnimate,全程运行时间1S,进入的速度曲线为ease,只播放一次*/ 
-webkit-animation: topeaseinAnimate 0.8s ease  1;

-ms-animation: topeaseinAnimate 0.8s ease 1; 
-o-animation: topeaseinAnimate 0.8s ease 1; 
-moz-animation: topeaseinAnimate 0.8s ease 1; 
/*规定动画的最后状态为结束状态*/ 
animation-fill-mode:forwards; 
-webkit-animation-fill-mode: forwards; 
-o-animation-fill-mode: forwards; 
-ms-animation-fill-mode: forwards; 
-moz-animation-fill-mode: forwards; }
.contactlist1_q2{ animation: topeaseinAnimate 0.8s ease 1; /*调用已定义好的动画lefteaseinAnimate,全程运行时间1S,进入的速度曲线为ease,只播放一次*/ 
-webkit-animation: topeaseinAnimate 0.8s ease  1;

-ms-animation: topeaseinAnimate 0.8s ease 1; 
-o-animation: topeaseinAnimate 0.8s ease 1; 
-moz-animation: topeaseinAnimate 0.8s ease 1; 
/*规定动画的最后状态为结束状态*/ 
animation-fill-mode:forwards; 
-webkit-animation-fill-mode: forwards; 
-o-animation-fill-mode: forwards; 
-ms-animation-fill-mode: forwards; 
-moz-animation-fill-mode: forwards; }
.contactlist2_q1{ animation: topeaseinAnimate 0.8s ease 1; /*调用已定义好的动画lefteaseinAnimate,全程运行时间1S,进入的速度曲线为ease,只播放一次*/ 
-webkit-animation: topeaseinAnimate 0.8s ease  1;

-ms-animation: topeaseinAnimate 0.8s ease 1; 
-o-animation: topeaseinAnimate 0.8s ease 1; 
-moz-animation: topeaseinAnimate 0.8s ease 1; 
/*规定动画的最后状态为结束状态*/ 
animation-fill-mode:forwards; 
-webkit-animation-fill-mode: forwards; 
-o-animation-fill-mode: forwards; 
-ms-animation-fill-mode: forwards; 
-moz-animation-fill-mode: forwards; }
.contactlist3_q1{ animation: topeaseinAnimate 0.8s ease 1; /*调用已定义好的动画lefteaseinAnimate,全程运行时间1S,进入的速度曲线为ease,只播放一次*/ 
-webkit-animation: topeaseinAnimate 0.8s ease  1;

-ms-animation: topeaseinAnimate 0.8s ease 1; 
-o-animation: topeaseinAnimate 0.8s ease 1; 
-moz-animation: topeaseinAnimate 0.8s ease 1; 
/*规定动画的最后状态为结束状态*/ 
animation-fill-mode:forwards; 
-webkit-animation-fill-mode: forwards; 
-o-animation-fill-mode: forwards; 
-ms-animation-fill-mode: forwards; 
-moz-animation-fill-mode: forwards; }

@keyframes lefteaseinAnimate
{ 
  0%{ transform:   translateX(-100px); opacity: 0;}
  /*在0%时设置文字在想X轴-2000px位移处(左边),透明度为0,也就是看不见文字*/ 
  100%{ transform:translateX(0px); opacity: 1;}
  /*在100%时设置文字在想X轴0px位移处,也就是原始布局的位置,透明度为1,也就是文字可以看见了*/
}
@-webkit-keyframes lefteaseinAnimate{ 0%{ -webkit-transform: translateX(-100px); opacity: 0;} 
100%{ -webkit-transform: translateX(0px); opacity: 1;} }
@-o-keyframes lefteaseinAnimate{ 0%{ -webkit-transform: translateX(-100px); opacity: 0;} 
100%{ -webkit-transform: translateX(0px); opacity: 1;} }
@-ms-keyframes lefteaseinAnimate{ 0%{ -webkit-transform: translateX(-100px); opacity: 0;} 
100%{ -webkit-transform: translateX(0px); opacity: 1;} }
@-moz-keyframes lefteaseinAnimate{ 0%{ -webkit-transform: translateX(-100px); opacity: 0;} 
100%{ -webkit-transform: translateX(0px); opacity: 1;} }
.aboutus_q2{ animation: lefteaseinAnimate 1s ease 0s 1; /*调用已定义好的动画lefteaseinAnimate,全程运行时间1S,进入的速度曲线为ease,只播放一次*/ 
-webkit-animation: lefteaseinAnimate 1s ease 0s 1; 
-ms-animation: lefteaseinAnimate 1s ease 0s 1;
-o-animation: lefteaseinAnimate 1s ease 0s 1;
-moz-animation: lefteaseinAnimate 1s ease 0s 1;
/*规定动画的最后状态为结束状态*/ 
animation-fill-mode:forwards; 
-webkit-animation-fill-mode: forwards; 
-o-animation-fill-mode: forwards; 
-ms-animation-fill-mode: forwards; 
-moz-animation-fill-mode: forwards; }
.aboutus_q4ani{ animation: lefteaseinAnimate 1s ease 0s 1; /*调用已定义好的动画lefteaseinAnimate,全程运行时间1S,进入的速度曲线为ease,只播放一次*/ 
-webkit-animation: lefteaseinAnimate 1s ease 0s 1; 
-ms-animation: lefteaseinAnimate 1s ease 0s 1;
-o-animation: lefteaseinAnimate 1s ease 0s 1;
-moz-animation: lefteaseinAnimate 1s ease 0s 1;
/*规定动画的最后状态为结束状态*/ 
animation-fill-mode:forwards; 
-webkit-animation-fill-mode: forwards; 
-o-animation-fill-mode: forwards; 
-ms-animation-fill-mode: forwards; 
-moz-animation-fill-mode: forwards; }
.aboutus_q6ani{ animation: lefteaseinAnimate 1s ease 0s 1; /*调用已定义好的动画lefteaseinAnimate,全程运行时间1S,进入的速度曲线为ease,只播放一次*/ 
-webkit-animation: lefteaseinAnimate 1s ease 0s 1; 
-ms-animation: lefteaseinAnimate 1s ease 0s 1;
-o-animation: lefteaseinAnimate 1s ease 0s 1;
-moz-animation: lefteaseinAnimate 1s ease 0s 1;
/*规定动画的最后状态为结束状态*/ 
animation-fill-mode:forwards; 
-webkit-animation-fill-mode: forwards; 
-o-animation-fill-mode: forwards; 
-ms-animation-fill-mode: forwards; 
-moz-animation-fill-mode: forwards; }
.contact_q2_item:first-child { animation: lefteaseinAnimate 1s ease 0s 1; /*调用已定义好的动画lefteaseinAnimate,全程运行时间1S,进入的速度曲线为ease,只播放一次*/ 
-webkit-animation: lefteaseinAnimate 1s ease 0s 1; 
-ms-animation: lefteaseinAnimate 1s ease 0s 1;
-o-animation: lefteaseinAnimate 1s ease 0s 1;
-moz-animation: lefteaseinAnimate 1s ease 0s 1;
/*规定动画的最后状态为结束状态*/ 
animation-fill-mode:forwards; 
-webkit-animation-fill-mode: forwards; 
-o-animation-fill-mode: forwards; 
-ms-animation-fill-mode: forwards; 
-moz-animation-fill-mode: forwards; }

@keyframes righteaseinAnimate{ 0%{ transform: translateX(100px); opacity: 0;} 
/*在0%时设置文字在想X轴2000px位移处(右边),透明度为0,也就是看不见文字*/ 
100%{ transform: translateX(0px); opacity: 1;} 
/*在100%时设置文字在想X轴0px位移处,也就是原始布局的位置,透明度为1,也就是文字可以看见了*/}
@-webkit-keyframes righteaseinAnimate{ 0%{ -webkit-transform: translateX(100px); opacity: 0;} 100%{ -webkit-transform: translateX(0px); opacity: 1;}}
@-o-keyframes righteaseinAnimate{ 0%{ -webkit-transform: translateX(100px); opacity: 0;} 100%{ -webkit-transform: translateX(0px); opacity: 1;}}
@-ms-keyframes righteaseinAnimate{ 0%{ -webkit-transform: translateX(100px); opacity: 0;} 100%{ -webkit-transform: translateX(0px); opacity: 1;}}
@-moz-keyframes righteaseinAnimate{ 0%{ -webkit-transform: translateX(100px); opacity: 0;} 100%{ -webkit-transform: translateX(0px); opacity: 1;}}
.aboutus_q5ani
{ 
  animation: righteaseinAnimate 1.2s ease 1; /*调用已定义好的动画righteaseinAnimate,全程运行时间1S,进入的速度曲线为ease,只播放一次*/ 
  -webkit-animation: righteaseinAnimate 1.2s ease 1; 
  -moz-animation: righteaseinAnimate 1.2s ease 1; 
  -ms-animation: righteaseinAnimate 1.2s ease 1; 
  -o-animation: righteaseinAnimate 1.2s ease 1; 
  /*规定动画的最后状态为结束状态*/ animation-fill-mode:forwards; 
  -webkit-animation-fill-mode: forwards; 
  -o-animation-fill-mode: forwards; 
  -ms-animation-fill-mode: forwards;
   -moz-animation-fill-mode: forwards; 
}
.newslist1_body
{ 
  animation: righteaseinAnimate 1.2s ease 1; /*调用已定义好的动画righteaseinAnimate,全程运行时间1S,进入的速度曲线为ease,只播放一次*/ 
  -webkit-animation: righteaseinAnimate 1.2s ease 1; 
  -moz-animation: righteaseinAnimate 1.2s ease 1; 
  -ms-animation: righteaseinAnimate 1.2s ease 1; 
  -o-animation: righteaseinAnimate 1.2s ease 1; 
  /*规定动画的最后状态为结束状态*/ animation-fill-mode:forwards; 
  -webkit-animation-fill-mode: forwards; 
  -o-animation-fill-mode: forwards; 
  -ms-animation-fill-mode: forwards;
   -moz-animation-fill-mode: forwards; 
}
.contact_q2_item:nth-child(3)
{ 
  animation: righteaseinAnimate 1s ease 1; /*调用已定义好的动画righteaseinAnimate,全程运行时间1S,进入的速度曲线为ease,只播放一次*/ 
  -webkit-animation: righteaseinAnimate 1s ease 1; 
  -moz-animation: righteaseinAnimate 1s ease 1; 
  -ms-animation: righteaseinAnimate 1s ease 1; 
  -o-animation: righteaseinAnimate 1s ease 1; 
  /*规定动画的最后状态为结束状态*/ animation-fill-mode:forwards; 
  -webkit-animation-fill-mode: forwards; 
  -o-animation-fill-mode: forwards; 
  -ms-animation-fill-mode: forwards;
   -moz-animation-fill-mode: forwards; 
}
}




