#project-counters {background-color: #222;}
#project-counters .counters {margin-top: 20px;width: 1120px;margin: 0 auto;}
#project-counters .counters li {
	background: none;border-radius: 3px 3px 3px 3px;color: rgba(255,255,255,0.6);font-size: 15px;padding: 25px 0;
	text-align: center;text-transform: none;
}
.parallax {text-align: center;background-position: center center;background-repeat: no-repeat;background-size: cover;background-attachment: fixed !important;}
.parallax-overlay {background-color: rgba(0,0,0,0.80);color: #ffffff;}
.parallax-overlay h1, .parallax-overlay h3 {color: #ffffff;}
.parallax-overlay.parallax-background-color {background-color: rgba(0,0,0,0.80);}
#project-counters .container{width:940px;}
#project-counters .container {width: 1180px;margin: 0 auto;padding:20px;}
#project-counters .container:before,#project-counters .container:after {display: table;content: "";line-height: 0;}
#project-counters .container:after {clear: both;}
#project-counters .counters li .count {
	border-radius: 3px 3px 3px 3px;color: #fff;font-family: Arial, Helvetica, sans-serif;font-size: 70px;padding: 25px 0;
	text-align: center;text-transform: uppercase;display: block;
}
.counters {margin-top: 40px;}
.counters ul {text-align: center;}
.counters i {display: block;font-size: 50px;margin-bottom: 20px;position: relative;}
.counters li {background: #FFF;color: #222222;font-size: 18px;padding: 25px 0;text-align: center;text-transform: uppercase;border-radius: 3px}
.counters li.last {border-right: 0 none;}
.one_fourth {width: 22%;float: left;margin-bottom: 20px;margin-right: 4%;position: relative;}
.last {margin-right: 0px!important;}
@media screen and (max-width:1024px){
	#project-counters .container{width:920px}
	#project-counters .counters{width:100%;}
	.one_fourth{margin:1%;width:22%;}
	#project-counters .counters li,	#project-counters .counters li .count{padding:20px;}
}
@media screen and (max-width:992px){
	#project-counters .container{width:860px}
	#project-counters .counters{width:100%;}
	.one_fourth{margin:1%;width:22%;}
	#project-counters .counters li,	#project-counters .counters li .count{padding:20px;}
}
@media screen and (max-width:861px){
	#project-counters .container{width:760px}
	#project-counters .counters{width:100%;}
	.one_fourth{margin-bottom:0;width:46%;}
	#project-counters .counters li,	#project-counters .counters li .count{padding:20px;}
}
@media screen and (max-width:760px){
	#project-counters .container{width:760px}
	#project-counters .counters{width:100%;}
	.one_fourth{margin-bottom:0;width:46%;}
	#project-counters .counters li,	#project-counters .counters li .count{padding:20px;}
}
@media screen and (max-width:640px){
	#project-counters .container{width:640px}
	#project-counters .counters{width:100%;}
	.one_fourth{margin-bottom:0;width:46%;}
	#project-counters .counters li,	#project-counters .counters li .count{padding:0;}
}
@media screen and (max-width:480px){
	#project-counters .container{width:480px}
	#project-counters .counters{width:100%;}
	.one_fourth{margin-bottom:0;width:46%;}
	#project-counters .counters li,	#project-counters .counters li .count{padding:0;}
}
@media screen and (max-width:375px){
	#project-counters .container{width:375px}
	#project-counters .counters,.one_fourth{width:100%;}
	.one_fourth{margin-bottom:0;}
	#project-counters .counters li,	#project-counters .counters li .count{padding:0;}
}
@media screen and (max-width:320px){
	#project-counters .container{width:320px}
	#project-counters .counters,.one_fourth{width:100%;}
	.one_fourth{margin-bottom:0;}
	#project-counters .counters li,	#project-counters .counters li .count{padding:0;}
}
@media screen and (max-width:240px){
	#project-counters .container{width:240px}
	#project-counters .counters,.one_fourth{width:100%;}
	.one_fourth{margin-bottom:0;}
	#project-counters .counters li,	#project-counters .counters li .count{padding:0;}
}
/**服务项目===================================================================================================================================**/
.theorBox {width:1122px;margin:0px auto;padding:20px 0px 40px;}
.theorBox a:link, .theorBox a:visited {color:#fff;}
.theorBox a:active, .theorBox a:hover {color:#fff;}
.theorBox li {float:left;display:block;width:24%;margin:.5%;color:#fff;}
.theorBox li a {display:block;position:relative;height:396px;overflow:hidden;}
.theorBox .img {width:100%;background-position: center center; background-size: cover; height: 100%; }
.theorBox .con {
	width:210px;padding-top:45px;height:210px;border-radius:50%; position: absolute; left: 50%; top: 50%;
	margin: -105px 0px 0px -105px;background-color:#c4cf67; background-color:rgba(196, 207, 103,0.9);/*background-color:#36b6cf;background-color: rgba(54, 182, 207,0.9);*/text-align: center;
	transition: 400ms; -webkit-transition: 400ms; -ms-transition: 400ms;
}
.theorBox .item2 .con {background-color:#810505; background-color:rgba(129,5,5,0.9);}
.theorBox .item3 .con {background-color:#e39b55; background-color:rgba(227,115,85,0.9);}
.theorBox .item4 .con {background-color:#006766; background-color:rgba(0,103,102,0.9);}
.theorBox .item5 .con {background-color:#fac44f; background-color:rgba(250, 196, 79,0.9);}
.theorBox .item6 .con {background-color:#72a530; background-color:rgba(114, 165, 48,0.9);}
.theorBox .item7 .con {background-color:#d78aea; background-color:rgba(215, 138, 234,0.9);}
.theorBox .item8 .con {background-color:#2b70c7; background-color:rgba(43, 112, 199,0.9);}
.theorBox .zh {border-top:1px solid #fff; border-bottom: 1px solid #fff; font-size:24px; padding-bottom: 8px; }
.theorBox .bot {background:url(../images/nbot5.png) no-repeat; width: 59px; height: 14px; display: block; margin: 12px auto 8px; }
.theorBox .en {font-size:14px; text-transform: capitalize; }
.theorBox .con2 {position:absolute; left: 0px; top: 0px; width: 100%; height: 100%; background-color: #eeeeee; color: #787878; font-size: 14px; transition: 500ms ease 400ms; -webkit-transition: 500ms ease 400ms; -ms-transition: 500ms ease 400ms; }
.theorBox .con2 .c {padding:22px 22px 0px; height: 256px; overflow: hidden; }
.theorBox .con2 .line {border-bottom:1px solid #dcdcdc; font-weight: bold; padding-bottom: 10px; margin-bottom: 15px; }
.theorBox .con2 .more {width: 106px;height: 35px; text-align: center; line-height: 35px; border: 1px solid #c9c9c9; display: block; float: right; margin: 12% 22px 0px 0px; }
.theorBox .con2 .more:hover{border: 1px solid #c4cf67;color:#c4cf67;}
.theorBox a:hover .con {opacity: 0;-webkit-transform: scale(1.3); transform: scale(1.3); }

.theorBox a:hover .img {transform:scale(1.1); -webkit-transform: scale(1.1); }
.clearfix:before, .clearfix:after { display: table; content: ""; line-height: 0px; }
.clearfix:after { clear: both; }
.clearfix { *zoom: 1; }
.csstransitions .theorBox .con2 {opacity: 0; transform: scale(1.1);-webkit-transform: scale(1.1);border: 3px solid #c4cf67;box-sizing: border-box;}
.csstransitions .theorBox a:hover .con2 { opacity: 1; transform: scale(1); -webkit-transform: scale(1); }
.no-csstransitions .theorBox .con2 { display: none; }
.no-csstransitions .theorBox a:hover .con2 { display: block; }
@media screen and (max-width:1024px){
	.theorBox{width:100%;}
	.theorBox li{margin:.5%;width:32%;}
	.theorBox li a{height:345px;}
}
@media screen and (max-width:920px){
	.theorBox{width:100%;}
	.theorBox li{margin:.5%;width:32%;}
	.theorBox li a{height:345px;}
}
@media screen and (max-width:861px){
	.theorBox{width:100%;}
	.theorBox li{margin:.5%;width:32%;}
	.theorBox li a{height:345px;}
}
@media screen and (max-width:768px){
	.theorBox{width:100%;}
	.theorBox li{margin:1%;width:48%;}
	.theorBox li a{height:345px;}
}
@media screen and (max-width:640px){
	.theorBox{width:100%;}
	.theorBox li{margin:1%;width:48%;}
	.theorBox li a{height:345px;}
}
@media screen and (max-width:480px){
	.theorBox{width:100%;}
	.theorBox li{margin:1%;width:48%;}
	.theorBox li a{height:345px;}
}
@media screen and (max-width:414px){
	.theorBox{width:100%;}
	.theorBox li{margin:1.5% 3%;width:96%;}
	.theorBox li a{height:345px;}
}
@media screen and (max-width:375px){
	.theorBox{width:100%;}
	.theorBox li{margin: 3%;width: 94%;}
	.theorBox li a{height:345px;}
}
@media screen and (max-width:320px){
	.theorBox{width:100%;}
	.theorBox li{margin: 3%;width: 94%;}
	.theorBox li a{height:300px;}
}
@media screen and (max-width:240px){
	.theorBox{width:100%;}
	.theorBox li{margin: 3%;width: 94%;}
	.theorBox li a{height:300px;}
}