@charset "utf-8";
/* CSS Document */

/**{ -webkit-transition:none; -moz-transition:none; -ms-transition:none; -o-transition:none; transition:none;} 
	a *{-webkit-transition:none;    -moz-transition:none;    -ms-transition:none;    -o-transition:none;    transition:none;}*/
	.header *, #middle *, #footer *{ -webkit-transition: all 0.5s ease-out 125ms; -moz-transition: all 0.5s ease-out 125ms; -ms-transition: all 0.5s ease-out 125ms; -o-transition: all 0.5s ease-out 125ms; transition: all 0.5s ease-out 125ms;} 
	.header a *, #middle a *, #footer a *{-webkit-transition: all 0.3s ease 0.2s;    -moz-transition: all 0.3s ease 0.2s;    -ms-transition: all 0.3s ease 0.2s;    -o-transition: all 0.3s ease 0.2s;    transition: all 0.3s ease 0.2s;}
	#header{z-index:100; position:relative;} #banner>.wrap{z-index:99;} #middle{z-index:104; background:#fff; position:relative;}

#banner:before{background:url(../images/index/index-banner-l.png); width:146px; height:336px; top:-39px;}
#banner:after{background:url(../images/index/index-banner-r.png); width:177px; height:405px; bottom:-38px;}
.index-pros-wrap{padding:42px 0;}	
	.index-pros-wrap ul{list-style:none; padding:0; margin:0;}
	.index-pros-wrap ul:after{clear:both; overflow:hidden; display:block; height:0; content:'';}
	.index-pros-wrap li{width:50%; float:left; padding:0 12px; overflow:hidden;}
	.index-pro{
	background: rgb(255,255,255); /* Old browsers */
	background: -moz-linear-gradient(top,  rgba(255,255,255,1) 0%, rgba(205,207,209,1) 100%); /* FF3.6-15 */
	background: -webkit-linear-gradient(top,  rgba(255,255,255,1) 0%,rgba(205,207,209,1) 100%); /* Chrome10-25,Safari5.1-6 */
	background: linear-gradient(to bottom,  rgba(255,255,255,1) 0%,rgba(205,207,209,1) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#cdcfd1',GradientType=0 ); /* IE6-9 */
	}
	.index-pro a{display:block; position:relative;}
	.index-pro-img{overflow:hidden; text-align:center;}
	.index-pro-img img{display:block; margin:0 auto; -webkit-transform:scale(1);	-ms-transform:scale(1);	transform:scale(1); opacity:1;}
	.index-pro-mask{position:absolute; top:0; bottom:0; left:0; opacity:0.89;} .index-pro-mask img{height:100%;}
	.index-pro-name{position:absolute; top: 50%; -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); transform: translateY(-50%); -o-transform: translateY(-50%); transform: translateY(-50%); left:0; width:44%; padding-left:20px; color:#ffffff; font-size:20px; font-family: 'Oswald', \5FAE\8EDF\6B63\9ED1\9AD4, sans-serif;}
	.index-pro-name span{color:#97b1d1; display:block;}
	.index-pros-wrap li:hover .index-pro-img img{-webkit-transform:scale(1.1);	-ms-transform:scale(1.1);	transform:scale(1.1); opacity:0.7;}
	.index-pros-wrap li:hover .index-pro-mask{opacity:0.7;}
	
	.index-pros-wrap li{-webkit-animation-name: fadeInUp; animation-name: fadeInUp;}
	.index-pros-wrap li:nth-child(1){-webkit-animation-delay: 0.1s; animation-delay: 0.1s;}
	.index-pros-wrap li:nth-child(1){-webkit-animation-delay: 0.2s; animation-delay: 0.2s;}
	.index-pros-wrap li:nth-child(1){-webkit-animation-delay: 0.3s; animation-delay: 0.3s;}
	
.index-news-wrap{text-align:center; padding:12px 0; font-size: 18px; }
	.index-news-head{font-size:50px; font-weight:100; color:#000;}
	.index-news-head2{font-size:28px; font-weight:100; color:#e50012; display:inline-block; border-bottom:1px #e5e5e5 solid; margin-bottom:20px;} .index-news-head2 span{color:#0068b6;}
	.index-news-txt{}
	.index-news-ti{font-size: 20px;   color: #222;    line-height: 1.5em;}
    

@media (max-width : 1500px) {
	#banner:before{left:50%; margin-left:-750px;}
	#banner:after{ right:50%; margin-right:-750px;}
}
@media (max-width : 999px) {
	.index-pro-name{font-size:17px; padding-left:10px;}
	
}
@media (max-width : 767px) {
	.index-pros-wrap{padding:20px 0 0;}
	.index-pros-wrap li{width:100%; float:none; margin-bottom:24px;}
	 .index-pro-mask img{ width:100%; height:auto;}
	.index-pro-name{font-size:20px; padding-left:20px; width:35%;}
    .index-pro-name span {  width: 50%;}
    .index-pro .index-pro-mask {width:37%;}
}
@media (max-width :600px) {
	.index-pro-mask{width:auto;} .index-pro-mask img{ width:auto; height:100%;}
	
}
@media (max-width :480px) {
	.index-pro-name{width:44%; font-size:17px;}
}