.sub-banner{height: 500px;background-color: fff;background-repeat: no-repeat;background-size: cover;background-position: center top;position: relative}
.sub-banner h2{font-size: 5rem!important;color:#fff!important;font-weight: 800!important;text-transform: uppercase!important;
position:absolute;bottom: 100px;
text-shadow: rgba(0,0,0,0.3) 0.1em 0.1em 0.2em;
-webdit-text-shadow: rgba(0,0,0,0.3) 0.1em 0.1em 0.2em;}
.sub-banner h3{color: #fff!important;font-size: 2rem!important;font-weight: 800!important;
	text-shadow: rgba(0,0,0,0.3) 0.05em 0.05em 0.1em;
	-webdit-text-shadow: rgba(0,0,0,0.3) 0.05em 0.05em 0.1em;
position:absolute;bottom: 60px;}
.sub-banner .container{position: relative;height: 500px;}
.sub-nav{position:absolute;height: 50px;bottom: -30px;left:50%;background-color: #fff;
-webkit-box-shadow: 0 12px 40px 6px rgba(0, 0, 0, 0.05);
box-shadow: 0 12px 40px 6px rgba(0, 0, 0, 0.05);}
.sub-nav li{float: left}
.sub-nav li a{display: block;line-height: 50px;text-align: center;font-size: 16px;color: #333;padding: 0 30px;
	border-right: 1px solid #efefef;text-decoration: none;}
.sub-nav li a:hover,.sub-nav li a.cur{background-color:#007ac0;color: #fff;}


/*当前位置*/
.location {
	font-size: 14px;
	line-height: 40px;
	color: #999;
	text-align: right;
	position: relative;
	border-bottom: 1px solid rgba(0,0,0,0.08);
	margin: 0 auto 50px auto;	
}
.location .icon-weizhi1{font-size: 1.4em;}
.location .icon-jiantou5{font-size: 0.6em;padding: 25px 0;}
.location a {
	color: #666666;
	text-decoration: none;
}
.location a:hover {
	color: #FF6600;
	text-decoration: underline;
}

/*分页样式*/	 
.pagination {
	width:100%;
	margin: 0px auto;
	display: flex;display:-webkit-flex;justify-content:center;flex-wrap: wrap;
}

.pagination a{
	display: inline-block;font-family: 'Lato', sans-serif;
	line-height: 30px;
	margin-right: 10px;margin-bottom: 10px;
	font-weight: normal;
	background-color: #fff;
	text-transform: uppercase;
	padding: 0 12px;border: 1px solid #eaeaea;
}
.pagination a:last-child{margin-right: 0;}
.pagination a:hover,
.pagination a:focus,
.pagination a.active,
.pagination .active span {
	color: #fff !important;
	background-color: #007ac0;
}
.err{ width:30%; line-height:30px; font-size:20px; color:rgba(0,0,0,0.3); text-align:center; margin:50px auto; padding:20px; border:1px solid rgba(0,0,0,0.07);background-color:rgba(255,255,255,0.8)}
.shownews{width: 100%;margin: 0 auto;background-color: #fff;padding: 20px;
-webkit-box-shadow: 0 12px 40px 6px rgba(0, 0, 0, 0.05);
box-shadow: 0 12px 40px 6px rgba(0, 0, 0, 0.05);}
.shownews .shownews-title{font-size:30px;text-align: center;border-bottom: 1px solid #efefef;margin-bottom: 1px;padding: 20px 0;color: #237ac1;}
.shownews .shownews-info{background-color: #f9f9f9;height: 35px;line-height: 35px;text-align: center;font-size:12px;color: #888;margin-bottom: 30px; }
.shownews .shownews-info span{padding:0 12px; }
.shownews .shownews-info i{font-size: 1.6em!important;padding-right: 2px; }
.shownews .shownews-cont{font-size:14px;line-height: 26px;color:#666;margin-bottom: 30px;border-bottom: 1px solid #efefef;padding-bottom: 20px; }
.jiathis_style{padding: 0 0 20px 0;}


/*about*/
.about{background-color: #f9f9f9;padding: 100px 0 50px 0;}
.about .about-info{width: 100%;}
.about .about-img{}
.about .about-text{padding: 0 0 0 30px;}
.about .about-text p{font-size: 16px;line-height: 32px;letter-spacing: 1px; color: #333;margin: 0 0 30px 0;}
.about .operating{width: 100%;overflow: 0;height: 350px;background-image: url(../images/about-1.jpg);margin: 50px 0;padding: 30px 0}
.about .operating .title{width: 1200px;text-align: center;margin: 40px auto;position: relative;}
.about .operating .title h3{font-size: 50px!important;color:#fff!important;font-weight: 800!important;text-transform: uppercase!important;}
.about .operating .title:after{
	content:'';
	width:100px;
	height:1px;
	background-color:rgba(255,255,255,0.5);
	display:block;
	position:absolute; left:50%;margin-left: -250px;bottom:10px;
	}
.about .operating .title:before{
	content:'';
	width:100px;
	height:1px;
	background-color:rgba(255,255,255,0.5);
	display:block;
	position:absolute; right:50%;margin-right: -250px; bottom:10px;
	}

.about .operating .title span{font-size: 25px!important;color: rgba(255,255,255,1)!important;}
.about .operating .txt{font-size: 22px;color: #fff;line-height: 40px;letter-spacing: 2px;}



/*subpage*/
.subpage{background-color:#f2f2f2;padding: 50px 0 50px 0; }
.subpage .customerslist{max-width: 1200px;width: 96%; margin: 0 auto;}
.subpage .customerslist li{float: left;margin:0 1% 1% 0;width: 24%;} 
.subpage .customerslist li a{height: 150px;background-color: #fafafa;display: block;text-align: center;padding-top:35px;line-height:70px;font-size: 18px;color: #999; }
.subpage .customerslist li:nth-child(4n){margin: 0 0 1% 0;}
.subpage .customerslist li a img{
	opacity:0.3;
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -ms-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    filter: gray;
}
.subpage .customerslist li a:hover{
	background-color: #fff;
	-webkit-box-shadow: 1px 10px 30px rgba(0,0,0,0.05);
	box-shadow: 1px 10px 30px rgba(0,0,0,0.05);
}
.subpage .customerslist li a:hover img{
	opacity:1;
    -webkit-filter: grayscale(0%);
    -moz-filter: grayscale(0%);
    -ms-filter: grayscale(0%);
    -o-filter: grayscale(0%);
    filter: grayscale(0%);
}
@media only screen and (max-width:1100px){
.subpage .customerslist li {width: 50%;}}

.subpage .sblist{display: flex;display:-webkit-flex;justify-content:left;flex-wrap: wrap;width: 100%}
.subpage .sblist li{width: 31.33%;margin:0 3% 3% 0;background-color: #fff;position: relative;overflow: hidden;
	-webkit-box-shadow: 1px 10px 30px rgba(0,0,0,0.05);
	box-shadow: 1px 10px 30px rgba(0,0,0,0.05);
}
.subpage .sblist li:nth-child(3n){margin:0 0 3% 0;}
.subpage .sblist li span{display: block;position: absolute;width: 100%;line-height: 50px;left: 0;bottom: 0;background-color: rgba(0,0,0,0.6);
color:#fff;text-align: center;font-size:16px;  }
.subpage .sblist li img{width: 100%;}
.subpage .sblist li:hover{
transform:translateY(-10px);-webkit-transform:translateY(-10px);
-webkit-box-shadow: 20px 0 40px rgba(0,0,0,0.08);
box-shadow: 20px 0 40px rgba(0,0,0,0.08);
}
.subpage .sblist li:hover img{transform: scale(1.1);-webkit-transform: scale(1.1);}
/*contact*/

.contact {;padding: 50px 0;background-color: #fafafa;}
.contact .sub-contact-info{width: 50%}
.contact .sub-contact-info .txt{padding:30px 0 10px 0; }
.contact .sub-contact-info .txt p{font-size: 16px;color: #333;padding-left: 50px;position: relative;display: block;line-height: 50px;}
.contact .sub-contact-info .txt i{font-size: 1.8em;color:#939393;position: absolute;left:0;top:0;}

.contact .sub-contact-message{width: 50%;}
.contact .sub-contact-message .form{padding:30px 0 10px 0; }
.contact .sub-contact-message .form label{display: block;width: 100%;margin-bottom: 10px;}
.contact .sub-contact-message .form input[type="text"],.sub-contact .sub-contact-message .form input[type="tel"]{width: 100%;height: 40px;border: none;background-color: #f1f1f1;font-size: 14px;font-weight: 200;text-indent: 10px;}
.contact .sub-contact-message .form textarea{width: 100%;height: 100px;border: none;background-color: #f1f1f1;font-size: 14px;font-weight: 200;text-indent: 10px;}
.contact .sub-contact-message .form input[type="submit"]{border:1px solid #eaeaea;text-align: center;background-color: #fff;line-height: 35px;width: 120px;font-weight:100;color: #999;font-size: 16px; }
.contact-maps{width: 10%;background-color: #fafafa; text-align: center;padding: 0 0 80px 0;}


/*news*/
.news{background: #f9f9f9;padding:20px 0 60px 0;}
.news .newslist{padding-bottom: 50px;padding-top: 30px;}
.news .newslist li{margin-bottom: 30px;height: 160px;background-color: #fff;}
.news .newslist li a{display: block;position:relative;padding: 20px 250px 20px 200px; }
.news .newslist li a .info{}
.news .newslist li a .info h3{font-size: 18px;color: #333;margin-bottom: 10px;}
.news .newslist li a .info p{font-size: 14px;color: #999;line-height: 22px;}
.news .newslist li a .img{width:180px;height: 120px;overflow: hidden;position: absolute;right:20px;top:20px;}
.news .newslist li a .img img{width: 100%;}
.news .newslist li a .time{position: absolute;width: 90px;height: 90px;left:35px;top:35px;border:1px solid #efefef;padding: 15px;text-align: center;
font-size:14px;color: #888; font-family:Arial;background-color: #efefef;}
.news .newslist li a .time span{display: block;text-align: center;font-size: 50px;line-height: 30px;margin-bottom:10px;font-family:Arial;}
.news .newslist li a:hover{text-decoration : none }
.news .newslist li a:hover .info h3{color: #237ac1;}
.news .newslist li a:hover .time{background-color: #007ac0; color:#fff; }
.news .newslist li a:hover .time span{color: #fff;}
.news .newslist li:hover{-webkit-box-shadow: 0 0 40px rgba(0, 0, 0, 0.1);box-shadow: 0 0 40px rgba(0, 0, 0, 0.1);
transform:translateY(-10px);-webkit-transform:translateY(-10px);}


/*sub-title*/
.sub-title {  position: relative;text-align: center;}
.sub-title:after{
	content:'';
	width:100px;
	height:1px;
	background-color:rgba(0,0,0,0.5);
	display:block;
	position:absolute; left:50%;margin-left: -18%;top:15px;}
.sub-title:before{
	content:'';
	width:100px;
	height:1px;
	background-color:rgba(0,0,0,0.5);
	display:block;
	position:absolute; right:50%;margin-right: -18%; top:15px;}
.sub-title h3{position: relative; font-size: 30px;font-weight:800; color: #333;}
.sub-title h3:before{
	content:'';
	width:30px;
	height:6px;
	background-color:#ed9300;
	display:block;
	position:absolute; right:50%;margin-right: -15px; bottom:-20px;}


.app{background-color:#f2f2f2;padding: 40px 0 40px 0; }
.app .applist{display: flex;display:-webkit-flex;justify-content:left;flex-wrap: wrap;width: 100%}
.app .applist .item{width:22.75%;margin:0 3% 3% 0; height:340px;background-color:#fff;-webkit-box-shadow: 1px 0 10px rgba(0,0,0,0.05);box-shadow: 1px 0 10px rgba(0,0,0,0.05);}
.app .applist .item:nth-child(4n){margin: 0 0 3% 0;}
.app .applist .item a{color:#333;display: block;position:relative;width:100%;height:100%;overflow: hidden;}
.app .applist .item a:after{
	position: absolute;
	content: '';bottom:0;left:0;z-index: 1;
	width: 100%;height: 0%;background-color:#007ac0;
	transition:all 0.5s;
    -webkit-transition:all 0.5s; /* Safari and Chrome */
    -moz-transition:all 0.5s;
    -o-transition:all 0.5s;
    -ms-transition:all 0.5s;
}
.app .applist .item a .info{text-align: center;}
.app .applist .item a .info h3{font-size:18px;color:#333;  }
.app .applist .item a .info h4{font-size:13px;font-weight: 200;color: #888;}
.app .applist .item a .info p{
	font-size:16px;
	line-height: 25px;
	color: #fff;
	width: 100%;
	height: 100%;
	z-index: 2;
	position: absolute;
	left:0;
	top:-300px;
	padding: 20px;text-align:left;}
.app .applist .item a .info span{width: 45%;display: block;line-height: 35px;border-radius: 4px;background-color: #f0f0f0;color: #333;text-align: center;
position: absolute;left:50%;margin-left: -22.5%;bottom: 20px;z-index: 2;}
.app .applist .item a .img{width:100%;height: 180px;overflow: hidden;
background-size: cover;background-position: center center;}
.app .applist .item a:hover{text-decoration: none;}
.app .applist .item a:hover:after{height: 100%;}
.app .applist .item a:hover .info span{width: 50%;margin-left: -25%;color: #fff;bottom: 30px;background-color:transparent;border: 1px solid #fff;}
.app .applist .item a:hover .info p{top:50px;}
.app .applist .item:hover{
transform:translateY(-10px);-webkit-transform:translateY(-10px);
-webkit-box-shadow: 20px 0 40px rgba(0,0,0,0.08);
box-shadow: 20px 0 40px rgba(0,0,0,0.08);}


.pro{background-color:#fff;margin: 80px 0 50px 0;width: 100%;}
.pro .prolist{display: flex;display:-webkit-flex;justify-content:left;flex-wrap: wrap;width: 100%;margin: 0;}
.pro .prolist li{width: 22%;margin:0 4% 4% 0;height: 300px;background-size: cover;-webkit-box-shadow: 1px 10px 30px rgba(0,0,0,0.08);box-shadow: 1px 10px 30px rgba(0,0,0,0.08);}
.pro .prolist li:nth-child(4n){margin:0 0 4% 0;}
.pro .prolist li a{display: block;
	overflow: hidden;position: relative;
    width: 100%;height: 100%;}
.pro .prolist li a span{display: block;position: absolute;width: 100%;line-height: 50px;left: 0;bottom: 0;background-color: rgba(0,0,0,0.6);
color:#fff;text-align: center;font-size:16px;  }
.pro .prolist li:hover{
transform:translateY(-10px);-webkit-transform:translateY(-10px);
-webkit-box-shadow: 20px 0 40px rgba(0,0,0,0.1);
box-shadow: 20px 0 40px rgba(0,0,0,0.1);
}


