@charset "utf-8";


section.clients {
	width: 100%;
	height: 780px;
	/* background-color: rgba(221, 221, 221, 0.1); */
	background: url(../images/wallpaper4.jpg) 50% 90%;
}

.clients .box {
	position: relative;
	top: 60px;
	-webkit-transition: all .3s ease-in-out 0s;
	-moz-transition: all .3s ease-in-out 0s;
	-ms-transition: all .3s ease-in-out 0s;
	-o-transition: all .3s ease-in-out 0s;
	transition: all .3s ease-in-out 0s;
}

.clients .box .caption {
	width: 100%;
	text-align: center;
	-moz-opacity: 0;
	opacity: 0;
	-webkit-transition: all .5s ease-in-out 0s;
	-moz-transition: all .5s ease-in-out 0s;
	-ms-transition: all .5s ease-in-out 0s;
	-o-transition: all .5s ease-in-out 0s;
	transition: all .5s ease-in-out 0s;
}

.clients.active .box .caption {
	-moz-opacity: 1;
	opacity: 1;
}

.clients .box .caption i {
	display: block;
	margin: 0 auto;
	margin-bottom: 20px;
	width: 299px;
	height: 37px;
	background: url(../images/words.png) no-repeat -152px -528px;
}

.clients .box .caption span {
	font-size: 24px;
	padding-left: 10px;
}

.clients .box ul.items {
	margin: 0 auto;
	margin-top: 45px;
	width: 1155px;
	height: 450px;
	font-size: 0;
	overflow: hidden;
}

.clients .box ul.items li {
	position: relative;
	padding: 0;
	width: 230px;
	height: 150px;
	overflow: hidden;
	z-index: 10;
}

.clients .box ul.items li.cctv {
	top: 600px;
	background: url(../images/clients.png) no-repeat;
	-webkit-transition: all .8s ease-in-out 0s;
	-moz-transition: all .8s ease-in-out 0s;
	-ms-transition: all .8s ease-in-out 0s;
	-o-transition: all .8s ease-in-out 0s;
	transition: all .8s ease-in-out 0s;
}

.clients .box ul.items li.cctv.active {
	background: url(../images/clients.png) no-repeat 0px -150px;
}

.clients.active .box ul.items li.cctv {
	top: 0px;
}

.clients .box ul.items li.unicom {
	top: -400px;
	background: url(../images/clients.png) no-repeat -230px 0px;
	-webkit-transition: all .8s ease-in-out 0s;
	-moz-transition: all .8s ease-in-out 0s;
	-ms-transition: all .8s ease-in-out 0s;
	-o-transition: all .8s ease-in-out 0s;
	transition: all .8s ease-in-out 0s;
}

.clients .box ul.items li.unicom.active {
	background: url(../images/clients.png) no-repeat -230px -150px;
}

.clients.active .box ul.items li.unicom {
	top: 0px;
}

.clients .box ul.items li.tsinghua {
	top: 600px;
	background: url(../images/clients.png) no-repeat -460px 0px;
	-webkit-transition: all .8s ease-in-out 0s;
	-moz-transition: all .8s ease-in-out 0s;
	-ms-transition: all .8s ease-in-out 0s;
	-o-transition: all .8s ease-in-out 0s;
	transition: all .8s ease-in-out 0s;
}

.clients .box ul.items li.tsinghua.active {
	background: url(../images/clients.png) no-repeat -460px -150px;
}

.clients.active .box ul.items li.tsinghua {
	top: 0px;
}

.clients .box ul.items li.cas {
	top: -400px;
	background: url(../images/clients.png) no-repeat -690px 0px;
	-webkit-transition: all .8s ease-in-out 0s;
	-moz-transition: all .8s ease-in-out 0s;
	-ms-transition: all .8s ease-in-out 0s;
	-o-transition: all .8s ease-in-out 0s;
	transition: all .8s ease-in-out 0s;
}

.clients .box ul.items li.cas.active {
	background: url(../images/clients.png) no-repeat -690px -150px;
}

.clients.active .box ul.items li.cas {
	top: 0px;
}

.clients .box ul.items li.sipo {
	top: 600px;
	background: url(../images/clients.png) no-repeat -920px 0px;
	-webkit-transition: all .8s ease-in-out 0s;
	-moz-transition: all .8s ease-in-out 0s;
	-ms-transition: all .8s ease-in-out 0s;
	-o-transition: all .8s ease-in-out 0s;
	transition: all .8s ease-in-out 0s;
}

.clients .box ul.items li.sipo.active {
	background: url(../images/clients.png) no-repeat -920px -150px;
}

.clients.active .box ul.items li.sipo {
	top: 0px;
}

.clients .box ul.items li.apple {
	top: 450px;
	background: url(../images/clients.png) no-repeat -1150px 0px;
	-webkit-transition: all .8s ease-in-out 0s;
	-moz-transition: all .8s ease-in-out 0s;
	-ms-transition: all .8s ease-in-out 0s;
	-o-transition: all .8s ease-in-out 0s;
	transition: all .8s ease-in-out 0s;
}

.clients .box ul.items li.apple.active {
	background: url(../images/clients.png) no-repeat -1150px -150px;
}

.clients.active .box ul.items li.apple {
	top: 0px;
}

.clients .box ul.items li.das {
	top: -550px;
	background: url(../images/clients.png) no-repeat -1380px 0px;
	-webkit-transition: all .8s ease-in-out 0s;
	-moz-transition: all .8s ease-in-out 0s;
	-ms-transition: all .8s ease-in-out 0s;
	-o-transition: all .8s ease-in-out 0s;
	transition: all .8s ease-in-out 0s;
}

.clients .box ul.items li.das.active {
	background: url(../images/clients.png) no-repeat -1380px -150px;
}

.clients.active .box ul.items li.das {
	top: 0px;
}

.clients .box ul.items li.hunantv {
	top: 450px;
	background: url(../images/clients.png) no-repeat -1610px 0px;
	-webkit-transition: all .8s ease-in-out 0s;
	-moz-transition: all .8s ease-in-out 0s;
	-ms-transition: all .8s ease-in-out 0s;
	-o-transition: all .8s ease-in-out 0s;
	transition: all .8s ease-in-out 0s;
}

.clients .box ul.items li.hunantv.active {
	background: url(../images/clients.png) no-repeat -1610px -150px;
}

.clients.active .box ul.items li.hunantv {
	top: 0px;
}

.clients .box ul.items li.sino {
	top: -550px;
	background: url(../images/clients.png) no-repeat -1840px 0px;
	-webkit-transition: all .8s ease-in-out 0s;
	-moz-transition: all .8s ease-in-out 0s;
	-ms-transition: all .8s ease-in-out 0s;
	-o-transition: all .8s ease-in-out 0s;
	transition: all .8s ease-in-out 0s;
}

.clients .box ul.items li.sino.active {
	background: url(../images/clients.png) no-repeat -1840px -150px;
}

.clients.active .box ul.items li.sino {
	top: 0px;
}

.clients .box ul.items li.report {
	top: 450px;
	background: url(../images/clients.png) no-repeat -2070px 0px;
	-webkit-transition: all .8s ease-in-out 0s;
	-moz-transition: all .8s ease-in-out 0s;
	-ms-transition: all .8s ease-in-out 0s;
	-o-transition: all .8s ease-in-out 0s;
	transition: all .8s ease-in-out 0s;
}

.clients .box ul.items li.report.active {
	background: url(../images/clients.png) no-repeat -2070px -150px;
}

.clients.active .box ul.items li.report {
	top: 0px;
}

.clients .box ul.items li.gedu {
	top: 300px;
	background: url(../images/clients.png) no-repeat -2300px 0px;
	-webkit-transition: all .8s ease-in-out 0s;
	-moz-transition: all .8s ease-in-out 0s;
	-ms-transition: all .8s ease-in-out 0s;
	-o-transition: all .8s ease-in-out 0s;
	transition: all .8s ease-in-out 0s;
}

.clients .box ul.items li.gedu.active {
	background: url(../images/clients.png) no-repeat -2300px -150px;
}

.clients.active .box ul.items li.gedu {
	top: 0px;
}

.clients .box ul.items li.bgg {
	top: -700px;
	background: url(../images/clients.png) no-repeat -2530px 0px;
	-webkit-transition: all .8s ease-in-out 0s;
	-moz-transition: all .8s ease-in-out 0s;
	-ms-transition: all .8s ease-in-out 0s;
	-o-transition: all .8s ease-in-out 0s;
	transition: all .8s ease-in-out 0s;
}

.clients .box ul.items li.bgg.active {
	background: url(../images/clients.png) no-repeat -2530px -150px;
}

.clients.active .box ul.items li.bgg {
	top: 0px;
}

.clients .box ul.items li.bsec {
	top: 300px;
	background: url(../images/clients.png) no-repeat -2760px 0px;
	-webkit-transition: all .8s ease-in-out 0s;
	-moz-transition: all .8s ease-in-out 0s;
	-ms-transition: all .8s ease-in-out 0s;
	-o-transition: all .8s ease-in-out 0s;
	transition: all .8s ease-in-out 0s;
}

.clients .box ul.items li.bsec.active {
	background: url(../images/clients.png) no-repeat -2760px -150px;
}

.clients.active .box ul.items li.bsec {
	top: 0px;
}

.clients .box ul.items li.huadan {
	top: -700px;
	background: url(../images/clients.png) no-repeat -2990px 0px;
	-webkit-transition: all .8s ease-in-out 0s;
	-moz-transition: all .8s ease-in-out 0s;
	-ms-transition: all .8s ease-in-out 0s;
	-o-transition: all .8s ease-in-out 0s;
	transition: all .8s ease-in-out 0s;
}

.clients .box ul.items li.huadan.active {
	background: url(../images/clients.png) no-repeat -2990px -150px;
}

.clients.active .box ul.items li.huadan {
	top: 0px;
}

.clients .box ul.items li.zd {
	top: 300px;
	background: url(../images/clients.png) no-repeat -3220px 0px;
	-webkit-transition: all .8s ease-in-out 0s;
	-moz-transition: all .8s ease-in-out 0s;
	-ms-transition: all .8s ease-in-out 0s;
	-o-transition: all .8s ease-in-out 0s;
	transition: all .8s ease-in-out 0s;
}

.clients .box ul.items li.zd.active {
	background: url(../images/clients.png) no-repeat -3220px -150px;
}

.clients.active .box ul.items li.zd {
	top: 0px;
}

.clients .box ul.items li.r {
	border-right: 1px dotted #ddd;
}

.clients .box ul.items li.b {
	border-bottom: 1px dotted #ddd;
}

.clients .box ul.items li span {
	position: absolute;
	bottom: -30px;
}

.clients .box ul.items li.bg.all {
	position: absolute;
	width: 1155px;
	height: 450px;
	background-color: White;
	-moz-opacity: 0.3;
	opacity: 0.3;
	filter: alpha(opacity=30);
}

.clients .box ul.items li.bg.one {
	position: absolute;
	background: #000;
	-moz-opacity: 0.5;
	opacity: 0.5;
	filter: alpha(opacity=50);
	-webkit-transition: all .3s ease-in-out 0s;
	-moz-transition: all .3s ease-in-out 0s;
	-ms-transition: all .3s ease-in-out 0s;
	-o-transition: all .3s ease-in-out 0s;
	transition: all .3s ease-in-out 0s;
	display: none;
}

.clients .box ul.mini {
	display: none;
}




@media (min-width:1921px),(min-height:1201px) {
	section.clients {
		-moz-background-size: cover;
		background-size: cover;
	}
}

@media (max-width:1280px) and (max-height:800px) {
	section.clients {

	}
}

@media (max-width:960px) and (max-height:600px) {
	section.clients {
	}
}

@media (max-width:1150px) {
	.clients .box ul.items {
		width: 924px;
	}

	.clients .box ul.items li.bg.all {
		width: 924px;
	}
}

@media (max-width:920px) {
	.clients .box ul.items {
		width: 693px;
	}

	.clients .box ul.items li.bg.all {
		width: 693px;
	}
}

@media (max-width:690px) {
	.clients .box ul.items {
		width: 462px;
	}

	.clients .box ul.items li.bg.all {
		width: 462px;
	}
}

@media (min-width:471px) and (max-height:720px) {
	.clients .box ul.items {
		height: 300px;
	}

	.clients .box ul.items li.bg.all {
		height: 300px;
	}
}

@media (min-width:471px) and (max-height:580px) {
	.clients .box ul.items {
		height: 150px;
	}

	.clients .box ul.items li.bg.all {
		height: 150px;
	}
}

@media (min-width:471px) and (max-height:450px) {
	.clients .box .swiper-container.items {
		margin-top: 40px;
	}

	.clients .box .caption i {
		display: none;
	}
}

@media (min-height:920px) {
	.clients .box {
		margin-top: -80px;
	}
}

@media (max-width:690px) and (max-height:380px),(max-width:620px) and (max-height:480px),(max-width:470px) {
	.clients .box ul.items {
		display: none;
	}

	.clients .box ul.mini {
		display: block;
		position: relative;
		margin: 0 auto;
		margin-top: 30px;
		width: 500px;
		height: 550px;
		overflow: hidden;
	}

	.clients .box ul.mini li {
		position: relative;
		float: left;
		width: 200px;
		padding: 8px 0 8px 40px;
		background: url(../images/point.png) no-repeat 20px 15px;
		z-index: 20;
	}

	.clients .box ul.mini li.bg.all {
		position: absolute;
		width: 500px;
		height: 560px;
		list-style: none;
		background-color: White;
		-moz-opacity: 0.5;
		opacity: 0.5;
		filter: alpha(opacity=50);
	}

	.clients .box ul.mini li.bg.one {
		display: none;
	}
}

@media (max-width:560px) and (max-height:480px),(max-width:470px) {
	.clients .box ul.mini {
		width: 250px;
	}

	.clients .box ul.mini li.bg.all {
		width: 250px;
	}
}

@media (max-width:470px) and (max-height:800px) {
	.clients .box ul.mini {
		height: 440px;
	}

	.clients .box ul.mini li.bg.all {
		height: 440px;
	}
}

@media (max-width:470px) and (max-height:700px) {
	.clients .box ul.mini {
		height: 330px;
	}

	.clients .box ul.mini li.bg.all {
		height: 330px;
	}
}

@media (max-width:560px) and (max-height:600px) {
	.clients .box ul.mini {
		height: 260px;
	}

	.clients .box ul.mini li.bg.all {
		height: 260px;
	}
}

@media (max-width:690px) and (max-height:520px) {
	.clients .box ul.mini {
		margin-top: 15px;
	}

	.clients .box .caption i {
		display: none;
	}
}

@media (max-width:690px) and (max-height:430px) {
	.clients .box ul.mini {
		height: 150px;
	}

	.clients .box ul.mini li.bg.all {
		height: 150px;
	}
}

@media (max-width:690px) and (max-height:420px) {
	.clients .box ul.mini {
		height: 110px;
	}

	.clients .box ul.mini li.bg.all {
		height: 110px;
	}
}

@media (max-width:690px) and (max-height:300px) {
	.clients .box ul.mini {
		margin-top: 5px;
	}
}

@media (max-width:400px) {
	.clients .box .caption i {
		display: none;
	}
}


/*
@media (max-width:319px),(max-height:210px) {
	body {
		display: none;
	}

	html {
		background: url(../images/displaynone.png) no-repeat 50% top;
		background-color: #333a32;
	}
}
*/

.clear {
	clear: both;
}

#BDBridgeWrap {
	display: none;
}