﻿/* CSS Document */

/*-----------------------------------// 全局样式 //-----------------------------------*/
body { margin:0; padding:0; font-size:12px; font-family: Arial, "微软雅黑", Helvetica, sans-serif, Verdana; color:#222; background:#fff; line-height:24px;}
ul,li,img,dl,dd,dt,form,table,tr,td,p,ol,div,input,label,span,h1,h2,h3,h4,h5,h6 { margin:0; padding:0;}
ol,ul,li { list-style-type:none; }
table { border-collapse:collapse; border-spacing:0; empty-cells:show;/*空单元格*/}
th, td { border-collapse:collapse; }
a { blr:expression(this.onFocus=this.blur());} /*for IE 去除链接虚线框*/
a { outline:none; } /*for Firefox*/
img { border:none;}
a { color:#333; text-decoration:none;}
a:hover { color:#F6882F; text-decoration:underline;}
.clear { clear:both;}
.b { font-weight:bold;}
.float_right { float:right;}
.float_left { float:left;}
.hg10 { height:10px; zoom:1; clear:both; overflow:hidden;}
.hg20 { height:20px; zoom:1; clear:both; overflow:hidden;}
.hg30 { height:30px; zoom:1; clear:both; overflow:hidden;}
.hg40 { height:40px; zoom:1; clear:both; overflow:hidden;}
.hg50 { height:50px; zoom:1; clear:both; overflow:hidden;}
.hg5 { height:5px; overflow:hidden; zoom:1; clear:both;}
em { font-style:normal;}
/*解决ie6图片缩小出现锯齿的问题*/
v\:* { behavior: url(#default#VML);}
img.thumb{-ms-interpolation-mode: bicubic;}

/* 更多 */
.more { float:right; margin-right:10px;}
.in_more a{ float:right; margin-right:10px; background-color:#50aee1; width:130px; height:40px; text-align:center; color:#FFF;}
.in_more a:hover{ background-color:#666;}

/*-----------------------------------// 页面样式 //-----------------------------------*/
/*------ 外部DIV ------*/
#wrap { width:100%;}

/*--- 头部 ---*/
#web_top { width:100%; padding:0;}
.header { width:1150px; margin:0 auto; height:113px; zoom:1;}
.logo { height:80px; float:left;} /*logo 高度*/
.tp_rt { float:right; padding:20px 0 0 0;}/* 右边中英文 */
.tp_rt a span { background:url('../images/icon.gif') no-repeat left center; padding:0 0 0 15px;}
.tp_tel span{ font-size:30px; color:#11a08b; font-weight:600;letter-spacing:1px;}
.tp_tel p{ font-size:14px;}

/*--- 导航 ---*/
.menu { height:55px; zoom:1; margin:0 auto; background-color:#2f2e33;}
#nav_ecwms { width:1150px; height:55px; line-height:55px; margin:0 auto;}
#nav_ecwms .wxmenu1 { zoom:1;  }
#nav_ecwms .wxmenu1 li { width:110px; font-weight:normal; font-size:14px; float:left; z-index:100; text-align:center; position:relative; font-family:微软雅黑;-webkit-transition: 0.8s;
	-o-transition: 0.8s;
	transition: 0.8s; margin:0 30px 0 0;}
#nav_ecwms .wxmenu1 li a {color: #fff; font-weight:bold;  width:110px; height:55px; display: block; text-decoration: none;  /*一级链接的颜色宽度和高度*/ }
#nav_ecwms .wxmenu1 li a:hover { color:#fff; text-decoration: none; background-color:#7e7e7e; -webkit-transition: 0.8s;
	-o-transition: 0.8s;
	transition: 0.8s;  /*鼠标滑上去后，链接的颜色和背景*/}
#nav_ecwms .wxmenu1 ul { display:none;}
#nav_ecwms .wxmenu1 ul li { position:relative;}
#nav_ecwms .wxmenu1 li ul { width:110px;  top:55px; /*下拉二级ul*/ position:absolute; left:0px; margin: 0px; padding:0; z-index:100; }
#nav_ecwms .wxmenu1 li ul li { width:110px; background-color:#999;/*下拉二级和三级li的样式*/ border:0; background-image:none; height:30px; line-height:30px; text-align:left; padding:0; 
 -webkit-transition: 0.5s;
	-o-transition: 0.5s;
	transition: 0.5s; border-bottom:#FF9 solid 1px;  }
#nav_ecwms .wxmenu1 li ul li a { color:#fff; width:110px; /*下拉二级和三级链接样式 */font-weight:normal;  text-align:left;  display:block; text-indent:0px; height:30px; background:none; overflow:hidden; zoom:1; text-align:center;}
#nav_ecwms .wxmenu1 li ul li a span { padding:0 0 0 5px;}
#nav_ecwms .wxmenu1 li ul li a:hover { color:#fff; width:110px; background:#FFC400; /*下拉二级三级鼠标滑过样式*/ height:30px; text-align:center; display:block;  -webkit-transition: 0.5s;-o-transition: 0.5s;transition: 0.5s;}
#nav_ecwms .wxmenu1 li ul ul { left:110px;/*下拉三级左边距*/ z-index:200; top:0;}
#nav_ecwms .wxmenu1 li a.selected { color: #fff; font-weight:bold;  width:110px; height:55px; display: block; text-decoration: none; background-color:#7e7e7e /*当前位置*/}

/*--- 搜索2 ---*/

.shousuo{ background:url('../images/sousuo.png') no-repeat top; width:343px; height:52px; margin-top:15px;}
#web_search2 { width:300px; float:left; padding:2px 0 0 35px; zoom:1; overflow:hidden; background:none;}
.web_search2_keyword { border:0px; background:none; padding:0 10px 0 0; margin:0px; width:230px; height:40px; line-height:40px; color:#444; float:left;}
.web_search2_submit { border:0; padding:0px; margin:0px; width:40px; height:40px; line-height:40px; background:none; text-indent:999px; cursor:pointer; float:left;}


/* --- banner动画 ---*/
#web_banner { width:100%; margin:0 auto; height:420px; clear:both; z-index:-999;}


.ban01{ width:674px; margin:120px auto 0;}
.ban02{ width:674px; margin:0px auto;}

.ban03{ float:left; width:169px; margin: 0 0 0 150px;}
.ban04{ width:622px; float:left; margin:30px auto;}

/*--- 主体内容 ---*/
#web_main { width:1170px; margin:0 auto; overflow:hidden; zoom:1; padding:10px 0 0 0; }

/*首页样式*/
.iy_dier{ margin:10px 0 0 0; width:100%;}
.ix_left { width:400px; float:left; overflow:hidden; background-color:#edebe4; min-height:377px;}
.ix_center { width:740px; float:left; background-color:#fff; overflow:hidden;  margin:0 0 0 20px;}
.ix_right { width:250px; float:left; overflow:hidden;  border:#CCC solid 1px; margin-left:6px}

.iy_left{ width:795px; float:left;}
.iy_left_l{ width:324px; border:#CCC solid 1px; float:left; margin:0 9px 0 0}
.iy_left_e{float:left; margin:10px 9px 0 0}

.iy_right{ margin:0 0 0 5px; width:250px; float:left;}
.iy_right li{ margin:0 0 15px 0; height:76px;}
    /* bar */
	
	
    .bar { height:88px;  background:url('../images/biaoti.jpg') no-repeat center; width:100%;}
	.bar_dd{background:#FFF;width:180px;height:60px;margin:0 auto;text-align:center; margin:0 auto; padding:20px 0 0 0;}
	.bar_df{ width:140px; margin:0 auto; line-height:35px;letter-spacing:3px;}
	.bar_dd p{ letter-spacing:2px;}
	.span1 { float:left;  display:block;   color:#737577; font-size:30px; font-family:"微软雅黑";font-weight:600;}
	.span2{ float:left; font-size:30px; color:#30b2ad;  font-family:"微软雅黑"; font-weight:600;}
	
	.barx{ height:38px; line-height:38px; border-left:2px solid #4eace5; width:100%;}
	.barx span.span1 { width:87px; height:30px; display:block; text-align:center; color:#438cc0; font-size:14px; font-weight:bold;float:left;}
	.barx span.span2 { width:150px; height:30px; display:block; color:#969696; font-size:14px; font-weight:bold; float:left;}
	.bary{ height:38px; line-height:38px; background-color:#0d60c0; width:100%; }
	.bary span.span1 { height:30px; display:block; text-align:center; color:#fff; font-size:14px; font-weight:bold;}
	.barz{ height:55px;line-height:55px; padding:0 0 0 20px; border-left:2px solid #3396e0;}
	.barz span.span1{ display:block;  color:#438cc0; font-size:14px; font-weight:bold; }
    .tu1 { width:124px; height:150px; float:right; padding:0 0 0 10px; background:url('../images/tu1.gif') no-repeat;}/*首页关于我们图*/
	
	
	.barl { background:url('../images/left.jpg') no-repeat center center; width:100%; width:218px; height:116px;}
	.barl span.span1 { display:block; color:#fff; font-size:30px; font-weight:bold; line-height:120px; margin-left:40px;}
	.barl_i{ width:20px; float:left; margin:9px 0 0 65px;}
	.barl_p{ float:left; margin-left:5px;}
	/* 内容框 */
    .neirong { overflow:hidden; zoom:1; padding:5px; background-color:#fff;}
	.neirong_new{overflow:hidden; zoom:1; padding:5px 5px 5px 5px; background-color:#fff;}

    /* 成功案例 */
    .case {  background:url('../images/case.gif') no-repeat; height:70px; width:240px; }
    .case a { width:240px; height:70px; display:block;}
    .case a:hover { text-decoration:none;}
    /*首页联系方式*/
    .ix_contact { width:255px; overflow:hidden; zoom:1;}
	.contact1 {  background-color:#fff; height:299px;}

    /*首页 tab 切换*/
    .sub-con{height:196px; width:440px; display:none;}
    .cur-sub-con{ display:block;}
    .box_nav{ width:380px; height:30px;}
    .box_nav ul{width:380px; height:30px;}
    .box_nav ul li{ width:87px; height:30px;line-height:30px; text-align:center; float:left; padding:0 2px 0 0;}
    .box_nav ul li a{ width:87px; height:30px; display:block; text-align:center; background:url('../images/bar_span.gif') no-repeat 0 -30px; color:#fff; font-size:14px; font-weight:bold;}
    .box_nav ul li a:hover{ text-decoration:none; background:url('../images/bar_span.gif') no-repeat;}
    .box_nav ul li a.cur{ width:87px; height:30px; display:block; text-align:center; background:url('../images/bar_span.gif') no-repeat 0 0; color:#fff; font-size:14px; font-weight:bold;}
		
	/*热门新闻*/
	.newshot { line-height:18px; background:#f4f4f4; padding:5px; overflow:hidden; zoom:1; height:120px;}
	.newshot h2 { font-size:12px; line-height:28px; color:#4593d3;}
	.newshot h2 a { color:#4593d3;}
	.newshot img { width:159px; height:114px; float:left; padding:0 5px 0 0;}
	/*--- 首页新闻 ---*/
	.xingnew{ padding:0 10px 0 10px;}	
	.in_new_lf{ float:left; width:320px;}
	.in_new_ri{ float:left; width:390px; margin:0 0 0 10px;}
    #web_news li { line-height:43px; height:43px; background:url('../images/li_news_x.png')no-repeat left center; padding:0 0 0 15px;border-bottom:1px dashed #CCC;}
    #web_news li a { color:#555;}
	#web_news li span.time { float:right; color:#777;}
	
	#web_news_g{ padding:0 0 0 20px;}
	#web_news_g li { line-height:40px; height:40px;background:url('../images/li_news_g.png')no-repeat left center; padding:0 0 0 15px; }
    #web_news_g li a { color:#555;}
	#web_news_g li span.time { float:right; color:#777;}
	.new_neirong{ padding:5px 20px 5px 20px;}
	/*首页简介*/
   .about_tit{ width:603px; margin:50px auto 20px;}
   .in_about{ height:425px;background:url('../images/about.jpg') no-repeat top center; background-color:#00736e;}
   
   .about02{ height:522px;background:url('../images/about02.jpg') no-repeat top center;}
   .about02_ni{ width:310px; margin: 0 40px 0 40px; float:left; text-align:center;}
   .about02_ni h2{ font-size:24px; color:#595959; line-height:50px;}
   
   .ind_ri_in{width:460px;float:right; height:260px; margin:80px 0 0 0px; background-color:#23817d; padding:30px;}
.ind_ri_in p{ color:#FFF; line-height:25px; font-size:14px;}
.ind_ri_in h2{ font-size:28px; color:#fff; font-weight:600; border-bottom:2px dashed #fff; height:35px;}
.ind_ri_in a{ color:#fff; float:right; border:2px solid #FFF; width:100px; height:40px; line-height:40px; text-align:center;  }
   
/*热门新闻*/
.newstz{ border-bottom:10px solid #00736e; height:124px;}

/*内页*/
.banner2 { width:960px; height:190px; margin:0 auto; padding:10px 0 0 0;}
.left { width:218px; float:left; padding:0 0px 0 0;}
.right { width:900px; float:left; margin:0 0 0 45px;}

.left_ls{ height:19px; background-color:#00736e; }
.left_p{}

.left_lix00{ width:230px; margin:0 auto;}
.left_lix{ color:#0f61ed; font-size:20px;background:url('../images/left_cu.jpg')no-repeat left center; padding-left:25px; line-height:40px;}

  /*--- 产品类别 ---*/
    .prod_type { padding:4px 0 10px 0; background-color:#1d9da8; margin-top:15px;}
    .prod_type ul { margin:0 auto; float:none; }
    .prod_type ul li { padding:0 0 4px 0px; margin-bottom:5px; height:35px; text-align:center;}
    .prod_type ul li {}
    .prod_type ul li li { background:none;}
    .prod_type ul li a { height:40px; line-height:40px; color:#FFF; display:block;}
    .prod_type ul li a:hover, .prod_type ul li.act a { background-color:#94bbbe;}
    .prod_type ul ul { display:none; }
    .prod_type ul ul li { text-indent:20px; border:0px; padding:0px; background-position:0px 8px; }
    .prod_type ul li, .prod_type ul li a, .prod_type ul li a:visited {}
	
	.news_type{ width:465px; margin:0 auto;}
	.news_type ul { margin:0 auto; float:none;}
    .news_type ul li { margin-bottom:5px; height:44px; text-align:center; float:left;}
    .news_type ul li {background:url('../images/lanmu.jpg') no-repeat left center; width:132px; border:1px solid #ccc; margin:0 10px 0 10px;}
    .news_type ul li li { background:none;}
    .news_type ul li a { height:44px; line-height:44px; color:#FFF; display:block; font-size:14px;}
    .news_type ul li a:hover, .prod_type ul li.act a { background-color:#94bbbe;}
	
	/* 内页右边 */
    .bar2 { height:38px; line-height: 38px;  width:100%; border-left: 2px solid #4eace5; border-bottom:1px dashed #CCC;}
	.bar2 span.span1 { display:block; padding:0 0 0 30px; background:url('../images/icon2.gif') 10px center no-repeat; font-size:16px; font-weight:bold;color:#438cc0; }
	.bar2 em.em1 { float:right; font-style:normal; font-size:14px; padding:0 10px 0 0; color:#777;}
	.bar2 em.em1 a { color:#777;}
	.neirong2 { background-color:#fff; overflow:hidden; zoom:1; padding:10px;}
	

/* 内页公司简介 */
.sin_lf{ float:left; width:608px;}
.sin_ri{ float:left; width:400px; padding:50px 50px 0 50px;}
.sin_ri p{ line-height:30px; font-size:14px;}
.sin_l_img{ width:136px; margin:0 auto;}

.sin_ni h2{ color:#00736e; font-weight:600; font-size:20px;margin:50px 0 20px 0;}
.sin_ni p{font-size:14px; margin:10px 0 20px 0;}
/*--- 尾部 ---*/
.foot{}
#web_foot {  margin:0 auto; overflow:hidden; zoom:1; padding:10px 0; color:#8f8f8f; background-color:#373737; height:200px; border-top:5px solid #55cac1;}
#web_foot a { color:#8f8f8f;}
#web_foot a:hover { color:#8f8f8f;}
#web_foot .copyright { font-weight:bold; font-size:14px; color:#8f8f8f;}
#web_foot ul.wxmenu1 { overflow:hidden;}
#web_foot ul.wxmenu1 li { display:inline; padding:0 10px;}
.foot_meul{ width:370px; margin:0 auto;}
.foot_meul li{ float:left; margin:10px 10px 0 10px;}
.foot_meed{ width:1050px; border-bottom:#666 solid 1px; height:auto; overflow:hidden; margin:0 auto;}
.foot_meed li{ float:left; margin:0 20px 0 20px; }

.foot_lf{ width:390px; float:left;}
.foot_co{ width:390px; float:left;}
.foot_ri{ width:390px; float:left;}
.foot_span{ border-left:#3CF solid 3px; font-size:22px; padding-left:15px; color:#fff; line-height:40px;}
.foot_lf p{ line-height:30px;}
/*--- 链接 ---*/
.lianjie0{margin-bottom:20px;}
.lianjie_t{  width:410px; line-height:40px; color:#FFF; font-size:16px; margin:0 auto}
.lianjie{ height:80px; }
.lianjie_sm{ float:left; margin:10px 20px 0 0;text-align:center;}
.lianjie_xi a{ margin:0px 0 0 8px; }
.lianjie_xi{ padding:16px 0 10px 0; }
.lianjie_xi img{border:1px solid #ccc; width:220px;}
/*--- 分页 ---*/
.page_num { width:100%; height:30px; padding:10px 0 0 0; text-align:center; clear:both; }
.page_num strong { padding:0 5px 2px 5px; background-color:#504C4D; color:#fff; margin:0 3px;}
.page_num a { padding:0 5px 2px 5px; background-color:#fff; border:1px solid #ccc; margin:0 3px;}
.page_num a:hover { background-color:#E9740D; color:#fff; border:1px solid #F30;}


/*--- 新闻列表 ---*/
.in_news li{height:120px;width:100%;overflow:hidden;}
.in_news li .riqi{width:62px;height:65px;background:#23817d;float:left;text-align:center;}
.in_news li .riqi h1{height:40px;line-height:40px;color:#fff;font-size:28px;text-align:center;margin:0px;}
.in_news li .riqi h2{line-height:24px;height:24px;border-top:1px solid #fff;text-align:center;margin:0px;font-size:12px;color:#9fd1f3;}
.in_news li .nrong{margin-left:90px;height:65px;overflow:hidden;text-overflow: ellipsis;}
.in_news li .nrong h1{font-size:16px;margin:0px;height:26px;line-height:26px;}
.in_news li .nrong p{line-height:22px; color:#999;}
.in_news li .nrong a{color:#333;text-decoration:none;}
.in_news li .nrong a:hover{color:#045896;}
.btn-danger2{color:#FFF;background:#045896;}

/*--- 产品列表 ---*/
#web_product li { float:left; width:234px; height:184px; margin:0 10px 0 10px; }
#web_product li p.pro_other { line-height:40px; text-align:center; font-size:14px;}
.div1 {width:265px; height:208px; border:1px solid #ddd; overflow:hidden; position:relative; display:table-cell; text-align:center; vertical-align:middle   }
.div2 {width:265px; height:208px;border:1px solid #F6882F; overflow:hidden; position:relative; display:table-cell; text-align:center; vertical-align:middle   }

.div1 p,.div2 p {  position:static; +position:absolute; top:50%; }   
.div1 img,.div2 img { position:static; +position:relative; top:-50%;left:-50%; width:234px; height:184px; _width: expression(this.width > 234 ? 234 : true); _height: expression(this.height > 184 ? 184 : true);}
.div1 a img,.div2 a img {}
.div3 {  width:234px; height:184px; border:1px solid #ddd; overflow:hidden; text-align:center; vertical-align:middle   }
.div4 {  width:234px; height:184px; border:1px solid #F6882F; overflow:hidden; text-align:center; vertical-align:middle   }
.div3 img,.div4 img { width:234px; height:184px; padding:3px;}

#web_product2 li{ float:left; width:265px; height:250px; margin:10px 32px 0 0;}
#web_product2 li:nth-child(3n){margin:10px 0px 0 0; }
#web_product2 li p.pro_other { line-height:40px; text-align:center; font-size:14px;}


#web_product3 li{ float:left; width:220px; height:200px; margin:10px 80px 50px 80px; background-color:#19b5a8;-moz-border-radius: 10px; 
-webkit-border-radius: 10px; 
border-radius: 10px;text-align:center; }
#web_product3 li:nth-child(3n){margin:10px 0px 50px 80px; }
#web_product3 li p.pro_other { line-height:40px; text-align:center; font-size:20px; }
#web_product3 li a{color:#FFF; display:block;}

#tubi_p{ font-size:60px; color:#FFF;line-height:80px;}

/*联系我们*/
.sin_con{ width:290px; height:100px; margin:0 50px 0 50px; float:left;}
.sin_con_s{ float:left; width:70px;}
.sin_con p{ font-size:16px; float:left; width:220px; margin:10px 0 0 0;}
#tubi{ color:#4eb00d; font-size:60px; c}

/*产品具体内容*/
#prodview_pic { text-align:center; overflow:hidden; zoom:1;}
#prodview_pic img {  background-color:#fff; padding:1px; border:2px solid #ccc;}

#prodview_pic_02 { overflow:hidden; zoom:1; float:left; width:450px;}
#prodview_pic_02 img { background-color:#fff; padding:1px;}

.protext02_tit{background-color:#1bb8ab; height:40px; line-height:40px; padding-left:20px; margin:0px 0 20px 0;}
.protext02_tit em{ color:#FFF;}

#protext { width:100%; padding:10px 0;}
#protext02 { width:650px; padding:0px 0; float:left; margin:0 0 0 30px;}
#protext02 span{ color:#22d0c2;}
h2.pro_name { height:40px; line-height:40px; font-size:24px; color:#444; text-align:center; padding:15px 0;}
.smallpic { max-width:600px; _width: expression(this.width > 600 ? 600 : true);}
.smallpic02 { max-width:450px; _width: expression(this.width > 600 ? 600 : true);}
.nore_new a{
    width: 120px;
    height: 30px;
    float: left;
    text-align: center;
    margin: 20px 30px 0 0;
    line-height: 25px;
    background-color: #23817d; color:#FFF;}
	
	
	
	
	
/*--- 新闻具体内容 ---*/
h2#h2_news { font-size:18px; line-height:60px; text-align:center;}
#news_top1 { color:#999; font-size:12px; line-height:28px; text-align:center;}
#news_contain { padding:10px;}
/*--- 发布时间 ---*/
.n_time { float:right; color:#777;}

/*在线招聘页面*/
input.input_job { height:24px; line-height:24px; width:280px;}


/*--- 在线客服 ---*/
.kf_list { padding:10px 10px; line-height:30px;overflow:hidden; /*border-left:1px solid #dedede; border-bottom:1px solid #dedede; border-right:1px solid #dedede;*/}
.message fieldset{ padding-left:20px;}
/*--- 友情链接 ---*/
.link_list { overflow:hidden; zoom:1; padding:0 0 10px 0; /*border-left:1px solid #dedede; border-bottom:1px solid #dedede; border-right:1px solid #dedede;*/}
.link_list ul li { float:left; width:110px; padding:10px 10px 0 10px;}



/*--- 新增滚动 ---*/
#demo { overflow:hidden; width: 1150px; height:220px; position:relative;}
#indemo { float: left; width: 880%; }
#demo1 { float: left; }
#demo2 { float: left;} 



/*--- 动画效果 ---*/
 @keyframes dong01-in {  
       0% { top:-800px;opacity: 0;}  
        40% {opacity: 0;}  
        100% {top:0;opacity: 1;} /*结束状态 透明度为1*/ 
    }  
    @-webkit-keyframes dong01-in {/*针对webkit内核*/  
   0% { top:-800px;opacity: 0;}  
        40% {opacity: 0;}  
        100% {top:0;opacity: 1;} /*结束状态 透明度为1*/ 
    }  
    @-moz-keyframes dong01-in 
   {
    0% { top:-800px;opacity: 0;}  
        40% {opacity: 0;}  
        100% {top:0;opacity: 1;} /*结束状态 透明度为1*/   
   } 
   @-o-keyframes dong01-in 
 {
     0% { top:-800px;opacity: 0;}  
        40% {opacity: 0;}  
        100% {top:0;opacity: 1;} /*结束状态 透明度为1*/  
  } 
  #dong01 { position:relative;
   animation: dong01-in;/*动画名称*/  
        animation-duration: 1.5s ;/*动画持续时间*/  
        -webkit-animation:dong01-in 1.5s ;/*针对webkit内核infini为循环*/ 
         -moz-animation:dong01-in 1.5s;
        -o-animation:dong01-in 1.5s ; 
    } 
	
	
	
 @keyframes dong02-in {  
        0% { left:-800px;opacity: 0;}  
        40% {opacity: 0;}  
        100% {left:0;opacity: 1;} /*结束状态 透明度为1*/ 
    }  
    @-webkit-keyframes dong02-in {/*针对webkit内核*/  
       0% { left:-800px;opacity: 0;}  
        40% {opacity: 0;}  
        100% {left:0;opacity: 1;} /*结束状态 透明度为1*/ 
    }  
    @-moz-keyframes dong02-in 
   {
    0% { left:-800px;opacity: 0;}  
        40% {opacity: 0;}  
        100% {left:0;opacity: 1;} /*结束状态 透明度为1*/   
   } 
   @-o-keyframes dong02-in 
 {
        0% { left:-800px;opacity: 0;}  
        40% {opacity: 0;}  
        100% {left:0;opacity: 1;} /*结束状态 透明度为1*/  
  } 
  #dong02 { position:relative;
   animation: dong02-in;/*动画名称*/  
        animation-duration: 1.5s ;/*动画持续时间*/  
        -webkit-animation:dong02-in 1.5s ;/*针对webkit内核infini为循环*/ 
         -moz-animation:dong02-in 1.5s;
        -o-animation:dong02-in 1.5s ; 
    }
	

	
@keyframes dong03-in {  
      0% { right:-800px;opacity: 0;}  
        40% {opacity: 0;}  
        100% {right:0;opacity: 1;} /*结束状态 透明度为1*/  
    }  
    @-webkit-keyframes dong03-in {/*针对webkit内核*/  
   0% { right:-800px;opacity: 0;}  
        40% {opacity: 0;}  
        100% {right:0;opacity: 1;} /*结束状态 透明度为1*/ 
    }  
    @-moz-keyframes dong03-in 
   {
    0% { right:-800px;opacity: 0;}  
        40% {opacity: 0;}  
        100% {right:0;opacity: 1;} /*结束状态 透明度为1*/   
   } 
   @-o-keyframes dong03-in 
 {
     0% { right:-800px;opacity: 0;}  
        40% {opacity: 0;}  
        100% {right:0;opacity: 1;} /*结束状态 透明度为1*/   
  } 
  #dong03{ position:relative;
   animation: dong03-in;/*动画名称*/  
        animation-duration: 1.5s ;/*动画持续时间*/  
        -webkit-animation:dong03-in 1.5s ;/*针对webkit内核infini为循环*/ 
         -moz-animation:dong03-in 1.5s;
        -o-animation:dong03-in 1.5s ; 
    }  	 
	  	 
@keyframes dong04-in {  
           0% { transform: rotateX(530deg);
-webkit-transform: rotateX(530deg);	/* Safari 和 Chrome */
-moz-transform: rotateX(530deg);	/* Firefox */opacity: 0;}  
        5% {opacity: 0.1;}  
        18% {transform: rotateX(0deg);
-webkit-transform: rotateX(0deg);	/* Safari 和 Chrome */
-moz-transform: rotateX(0deg);
	/* Firefox */opacity: 1;} 
	
	    100% {transform: rotateX(0deg);
-webkit-transform: rotateX(0deg);	/* Safari 和 Chrome */
-moz-transform: rotateX(0deg);
	/* Firefox */opacity: 1;}/*结束状态 透明度为1*/  
    }  
    @-webkit-keyframes dong04-in {/*针对webkit内核*/  
          0% { transform: rotateX(530deg);
-webkit-transform: rotateX(530deg);	/* Safari 和 Chrome */
-moz-transform: rotateX(530deg);	/* Firefox */opacity: 0;}  
        5% {opacity: 0.1;}  
        18% {transform: rotateX(0deg);
-webkit-transform: rotateX(0deg);	/* Safari 和 Chrome */
-moz-transform: rotateX(0deg);
	/* Firefox */opacity: 1;} 
	
	    100% {transform: rotateX(0deg);
-webkit-transform: rotateX(0deg);	/* Safari 和 Chrome */
-moz-transform: rotateX(0deg);
	/* Firefox */opacity: 1;}/*结束状态 透明度为1*/  
    }  
    @-moz-keyframes dong04-in 
   {
    0% { transform: rotateX(530deg);
-webkit-transform: rotateX(530deg);	/* Safari 和 Chrome */
-moz-transform: rotateX(530deg);	/* Firefox */opacity: 0;}  
        5% {opacity: 0.1;}  
        18% {transform: rotateX(0deg);
-webkit-transform: rotateX(0deg);	/* Safari 和 Chrome */
-moz-transform: rotateX(0deg);
	/* Firefox */opacity: 1;} 
	
	    100% {transform: rotateX(0deg);
-webkit-transform: rotateX(0deg);	/* Safari 和 Chrome */
-moz-transform: rotateX(0deg);
	/* Firefox */opacity: 1;}/*结束状态 透明度为1*/  
   } 
   @-o-keyframes dong04-in 
 {
       0% { transform: rotateX(530deg);
-webkit-transform: rotateX(530deg);	/* Safari 和 Chrome */
-moz-transform: rotateX(530deg);	/* Firefox */opacity: 0;}  
        5% {opacity: 0.1;}  
        18% {transform: rotateX(0deg);
-webkit-transform: rotateX(0deg);	/* Safari 和 Chrome */
-moz-transform: rotateX(0deg);
	/* Firefox */opacity: 1;} 
	
	    100% {transform: rotateX(0deg);
-webkit-transform: rotateX(0deg);	/* Safari 和 Chrome */
-moz-transform: rotateX(0deg);
	/* Firefox */opacity: 1;}/*结束状态 透明度为1*/   
  } 
  #dong04{ position:relative;
   animation: dong04-in;/*动画名称*/  
        animation-duration:8s infinite;/*动画持续时间*/  
        -webkit-animation:dong04-in 8s infinite;/*针对webkit内核infini为循环*/ 
         -moz-animation:dong04-in 8s infinite;
        -o-animation:dong04-in 8s infinite; 
    } 



@keyframes dong05-in {  
       0% { top:800px;opacity: 0;}  
        40% {opacity: 0;}  
        100% {top:0;opacity: 1;} /*结束状态 透明度为1*/ 
    }  
    @-webkit-keyframes dong05-in {/*针对webkit内核*/  
   0% { top:800px;opacity: 0;}  
        40% {opacity: 0;}  
        100% {top:0;opacity: 1;} /*结束状态 透明度为1*/ 
    }  
    @-moz-keyframes dong05-in 
   {
    0% { top:800px;opacity: 0;}  
        40% {opacity: 0;}  
        100% {top:0;opacity: 1;} /*结束状态 透明度为1*/   
   } 
   @-o-keyframes dong05-in 
 {
     0% { top:800px;opacity: 0;}  
        40% {opacity: 0;}  
        100% {top:0;opacity: 1;} /*结束状态 透明度为1*/  
  } 
  #dong05 { position:relative;
   animation: dong05-in;/*动画名称*/  
        animation-duration: 1.5s ;/*动画持续时间*/  
        -webkit-animation:dong05-in 1.5s ;/*针对webkit内核infini为循环*/ 
         -moz-animation:dong05-in 1.5s;
        -o-animation:dong05-in 1.5s ; 
    }



@keyframes dong06-in {  
          0% {   -webkit-transform:scale(1.5,1.5);
    -moz-transform:scale(1.5,1.5);
    -transform:scale(1.5,1.5);opacity: 0;}  
        40% {opacity: 0;}  
        100% {   -webkit-transform:scale(1.0,1.0);
    -moz-transform:scale(1.0,1.0);
    -transform:scale(1.0,1.0);opacity: 1;} /*结束状态 透明度为1*/   
    }  
    @-webkit-keyframes dong06-in {/*针对webkit内核*/  
    0% {   -webkit-transform:scale(1.5,1.5);
    -moz-transform:scale(1.5,1.5);
    -transform:scale(1.5,1.5);opacity: 0;}  
        40% {opacity: 0;}  
        100% {   -webkit-transform:scale(1.0,1.0);
    -moz-transform:scale(1.0,1.0);
    -transform:scale(1.0,1.0);opacity: 1;} /*结束状态 透明度为1*/   
    }  
    @-moz-keyframes dong06-in 
   {
    0% {   -webkit-transform:scale(1.5,1.5);
    -moz-transform:scale(1.5,1.5);
    -transform:scale(1.5,1.5);opacity: 0;}  
        40% {opacity: 0;}  
        100% {   -webkit-transform:scale(1.0,1.0);
    -moz-transform:scale(1.0,1.0);
    -transform:scale(1.0,1.0);opacity: 1;} /*结束状态 透明度为1*/   
   } 
   @-o-keyframes dong06-in 
 {
     0% {   -webkit-transform:scale(1.5,1.5);
    -moz-transform:scale(1.5,1.5);
    -transform:scale(1.5,1.5);opacity: 0;}  
        40% {opacity: 0;}  
        100% {   -webkit-transform:scale(1.0,1.0);
    -moz-transform:scale(1.0,1.0);
    -transform:scale(1.0,1.0);opacity: 1;} /*结束状态 透明度为1*/    
  } 
  #dong06 { position:relative;
   animation: dong06-in;/*动画名称*/  
        animation-duration: 1.5s ;/*动画持续时间*/  
        -webkit-animation:dong06-in 1.5s ;/*针对webkit内核infini为循环*/ 
         -moz-animation:dong06-in 1.5s;
        -o-animation:dong06-in 1.5s ; 
    } 		



@keyframes dong07-in {  
          0% {   -webkit-transform:scale(1.5,1.5);
    -moz-transform:scale(1.5,1.5);
    -transform:scale(1.5,1.5);opacity: 0;}  
        40% {opacity: 0;}  
        100% {   -webkit-transform:scale(1.0,1.0);
    -moz-transform:scale(1.0,1.0);
    -transform:scale(1.0,1.0);opacity: 1;} /*结束状态 透明度为1*/   
    }  
    @-webkit-keyframes dong07-in {/*针对webkit内核*/  
    0% {   -webkit-transform:scale(1.5,1.5);
    -moz-transform:scale(1.5,1.5);
    -transform:scale(1.5,1.5);opacity: 0;}  
        40% {opacity: 0;}  
        100% {   -webkit-transform:scale(1.0,1.0);
    -moz-transform:scale(1.0,1.0);
    -transform:scale(1.0,1.0);opacity: 1;} /*结束状态 透明度为1*/   
    }  
    @-moz-keyframes dong07-in 
   {
    0% {   -webkit-transform:scale(1.5,1.5);
    -moz-transform:scale(1.5,1.5);
    -transform:scale(1.5,1.5);opacity: 0;}  
        40% {opacity: 0;}  
        100% {   -webkit-transform:scale(1.0,1.0);
    -moz-transform:scale(1.0,1.0);
    -transform:scale(1.0,1.0);opacity: 1;} /*结束状态 透明度为1*/   
   } 
   @-o-keyframes dong07-in 
 {
     0% {   -webkit-transform:scale(1.5,1.5);
    -moz-transform:scale(1.5,1.5);
    -transform:scale(1.5,1.5);opacity: 0;}  
        40% {opacity: 0;}  
        100% {   -webkit-transform:scale(1.0,1.0);
    -moz-transform:scale(1.0,1.0);
    -transform:scale(1.0,1.0);opacity: 1;} /*结束状态 透明度为1*/    
  } 
  #dong07 { position:relative;
   animation: dong07-in;/*动画名称*/  
        animation-duration: 1.5s ;/*动画持续时间*/  
        -webkit-animation:dong07-in 1.5s ;/*针对webkit内核infini为循环*/ 
         -moz-animation:dong07-in 1.5s;
        -o-animation:dong07-in 1.5s ; 
    } 	
	
	
	@keyframes dong08-in {  
           0% { transform: rotateY(530deg);
-webkit-transform: rotateY(530deg);	/* Safari 和 Chrome */
-moz-transform: rotateY(530deg);	/* Firefox */opacity: 0;}  
        5% {opacity: 0.1;}  
        18% {transform: rotateY(0deg);
-webkit-transform: rotateY(0deg);	/* Safari 和 Chrome */
-moz-transform: rotateY(0deg);
	/* Firefox */opacity: 1;} 
	
	    100% {transform: rotateY(0deg);
-webkit-transform: rotateY(0deg);	/* Safari 和 Chrome */
-moz-transform: rotateY(0deg);
	/* Firefox */opacity: 1;}/*结束状态 透明度为1*/  
    }  
    @-webkit-keyframes dong08-in {/*针对webkit内核*/  
          0% { transform: rotateY(530deg);
-webkit-transform: rotateY(530deg);	/* Safari 和 Chrome */
-moz-transform: rotateY(530deg);	/* Firefox */opacity: 0;}  
        5% {opacity: 0.1;}  
        18% {transform: rotateY(0deg);
-webkit-transform: rotateY(0deg);	/* Safari 和 Chrome */
-moz-transform: rotateY(0deg);
	/* Firefox */opacity: 1;} 
	
	    100% {transform: rotateY(0deg);
-webkit-transform: rotateY(0deg);	/* Safari 和 Chrome */
-moz-transform: rotateY(0deg);
	/* Firefox */opacity: 1;}/*结束状态 透明度为1*/  
    }  
    @-moz-keyframes dong08-in 
   {
    0% { transform: rotateY(530deg);
-webkit-transform: rotateY(530deg);	/* Safari 和 Chrome */
-moz-transform: rotateY(530deg);	/* Firefox */opacity: 0;}  
        5% {opacity: 0.1;}  
        18% {transform: rotateY(0deg);
-webkit-transform: rotateY(0deg);	/* Safari 和 Chrome */
-moz-transform: rotateY(0deg);
	/* Firefox */opacity: 1;} 
	
	    100% {transform: rotateY(0deg);
-webkit-transform: rotateY(0deg);	/* Safari 和 Chrome */
-moz-transform: rotateY(0deg);
	/* Firefox */opacity: 1;}/*结束状态 透明度为1*/  
   } 
   @-o-keyframes dong08-in 
 {
       0% { transform: rotateY(530deg);
-webkit-transform: rotateY(530deg);	/* Safari 和 Chrome */
-moz-transform: rotateY(530deg);	/* Firefox */opacity: 0;}  
        5% {opacity: 0.1;}  
        18% {transform: rotateY(0deg);
-webkit-transform: rotateY(0deg);	/* Safari 和 Chrome */
-moz-transform: rotateY(0deg);
	/* Firefox */opacity: 1;} 
	
	    100% {transform: rotateY(0deg);
-webkit-transform: rotateY(0deg);	/* Safari 和 Chrome */
-moz-transform: rotateY(0deg);
	/* Firefox */opacity: 1;}/*结束状态 透明度为1*/   
  } 
  #dong08{ position:relative;
   animation: dong08-in;/*动画名称*/  
        animation-duration:8s infinite;/*动画持续时间*/  
        -webkit-animation:dong08-in 8s infinite;/*针对webkit内核infini为循环*/ 
         -moz-animation:dong08-in 8s infinite;
        -o-animation:dong08-in 8s infinite; 
    } 
