@CHARSET "UTF-8";
.panel{position:relative;}
.swiper-slide{
	background-size:cover;
	background-position:center center;
}
.swiper-slide .font{
	width:60%;
	opacity:0;
	left:30%;
	-webkit-transform:scale(0.6);
	transform:scale(0.6);
	transition:2s;
	-webkit-transition:2s;
}
.swiper-slide.swiper-slide-active .font{
	transition-delay: 0.5s;
    -webkit-transition-delay: 0.5s;
	width:29%;
	position:absolute;
	top:220px;
	left:50%;
	opacity:1;
	-webkit-transform:scale(1.4);
	transform:scale(1.4);
}
.swiper-slide .logo{
	position:absolute;
	width:10%;
	top:180px;
	opacity:0.4;
	left:0%;
	-webkit-transform:scale(0.6);
	transform:scale(0.6);
	transition:2s;
	-webkit-transition:2s;
}
.swiper-slide.swiper-slide-active .logo{
	width:20%;
	left:15%;
	-webkit-transform:scale(1);
	transform:scale(1);
	opacity:1;
}
 
.main-width{
	width:1200px;
	margin:0 auto;
	padding-top:80px;
}
.product{
	position:absolute;
	top:50%;
	margin-left:-600px;
	left:50%;
	margin-top:-300px;
}
.product .top,.case .top,.news .top{
	text-align:center;
	margin-bottom:20px;
}
.product .top .title,.case .top .title,.news .top .title{
	font-size:24px;
	line-height:36px;
	font-family:arial;
}
.product .top .name,.case .top .name,.news .top .name{
	margin:6px auto;
	font-size:18px;
	font-weight:normal;
}
.product .sub-nav{
	width:100%;
	margin-top:18px;
	position:relative;
}
.product .sub-nav:after{
	border-bottom:1px solid #999;
	position:absolute;
	bottom:19.5px;
	content: " ";
	width: 100%;
	z-index:-1;
	display: block;
}
.product .sub-nav ul{
	width:88%;
	margin:auto;
	text-align:center;
}
.product .sub-nav ul li{
	float:left;
	width:24.5%;
	cursor:pointer;
	padding:8px 0;
	margin-left:-1px;
	color:#555555;
	border: 1px solid #DFDFDF;
	text-align: center;
	background:#fafafa;
}
.product .sub-nav ul li:hover,.product .sub-nav ul li.cur{
	background:rgb(37, 130, 197);
	color:#fafafa;
	border:1px solid rgb(37, 130, 197);
}
.product .list{
	margin-top:30px;
}
.product .list .item{
	display:none;
}
.product .list .item.active{
	display:block;
	animation:productIn 5s 1;
}
.product .list ul{
	padding:0;
}
.product .list ul li{
	overflow:hidden;
	width: 33.33%;
	float: left;
	height: 260px;
	background: #E1E8EC;
	text-align:center;
	position:relative;
	transition: 3s;
	opacity: 1;
	-webkit-transform: scale(0.2);
	transform: scale(0.2);
}
.product .list .active ul li{
	-webkit-transform: scale(1);
	transform: scale(1);
	opacity: 1;
	transition-delay: 0.8s;
}

.product .list ul li a{
	color:#555555;
	font-size:16px;
	text-decoration:none;
}
.product .list ul li .img-box,.product .list ul li .img-box img{
	width:100%;
	transition: 2s;
}
.product .list ul li .tit{
	position:absolute;
	bottom:0;
	line-height:30px;
	padding:6px 0;
	background:rgba(0,0,0,0.5);
	left:0;
	width:100%;
	color:#fafafa;
}
.product .list ul li .view{
	position:absolute;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,.6);
	line-height:260px;
	transition: all 0.5s;
	-webkit-transition: all 0.5s;
	opacity: 0;
	transform-origin: 50% 0;
	transform: rotateX(60deg);
	-webkit-transform: rotateX(60deg);
	-moz-transform: rotateX(-60deg);
	-webkit-transform-origin: 50% 0;
	-moz-transform-origin: 50% 0;
	transform-style: preserve-3d;
	-webkit-transform-style: preserve-3d;
	-moz-transform-style: preserve-3d;
}
.product .list ul li.cur .view{
	transform: rotateX(0deg);
	-webkit-transform: rotateX(0deg);
	-moz-transform: rotateX(0deg);
	opacity: 1;
}
.product .list ul li.cur img{
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
}
.product .list ul li.cur .tit{
	color:rgb(37, 130, 197);
}
.product .list ul li .view i{
	font-size:30px;
	color:#fafafa;
}
.product .product-more{
	display:block;
	width:120px;
	margin:auto;
	text-align:center;
	color:#555555;
	padding:6px 0;
	border:1px solid #999;
	box-shadow:0 1px 8px #ccc;
	margin-top:20px;
	transition:1.6s;
}
.product .product-more:hover{
	color:rgb(37, 130, 197);
	box-shadow:0 1px 10px rgb(37, 130, 197);
}
.case{
	position:absolute;
	top:50%;
	margin-left:-600px;
	left:50%;
	margin-top:-250px;
}
.case .top{
	color:#fafafa;
}
.case .list{}
.case .list ul{
	height: 400px;
	overflow:hidden;
}
.case .list ul li{
	float: left;
	width: 100px;
	height: 400px;
	cursor: pointer;
	background-repeat:no-repeat;
	background-position: center;
	background-size:cover;
}

.case .list ul li > .text{
	width: 100px;
	height: 100%;
	background: #000;
	opacity: .5;
}
.case .list ul li > .text p{
	padding: 20px 40px;
	font-family: 'Microsoft yahei';
	color: #fff;
}

.case .list ul li.active .box .img .bg{
	width:100%;
	position:absolute;
	top:0;
	bottom:0;
	right:0;
	opacity:0;
	background:#000;
	left:0;
	z-index:2;
	transition:1.2s;
	-webkit-transition:1.2s;
}
.case .list ul li.active .box .img .content{
	width:80%;
	height:200px;
	line-height:100px;
	text-align:center;
	position:absolute;
	top:50px;
	left:10%;
	z-index:3;
	opacity:0;
	color:#fafafa;
	transition:1.2s;
	-webkit-transition:1.2s;
}
.case .list ul li.active .box .img.active .bg{
	opacity:0.3;
}
.case .list ul li.active .box .img.active .content{
	opacity:1;
	border:1px solid #fafafa;
	line-height:200px;
	font-size:20px;
}
.news{
	position:absolute;
	top:50%;
	margin-left:-600px;
	left:50%;
	margin-top:-300px;
}
.news .list{}
.news .list ul{
	padding-bottom:10px;
	border-bottom:1px solid #D0CBCB;
}
.news .list ul li{
	width:360px;
	FLOAT:left;
	cursor:pointer;
	margin-right:60px;
}
.news .list ul li .img-box{
	width:100%;
	height:200px;
	overflow:hidden;
	text-align:center;
}
.news .list ul li .img-box img{
	width:100%;
	transition:1.2s;
	
}
.news .list ul li a{
	color:#555555;
	transition:1.2s;
}
.news .list ul li.cur a{
	color:rgb(37, 130, 197);
}
.news .list ul li.cur .img-box img{
	-webkit-transform: scale(1.1);
	transform: scale(1.1);
}
.news .list ul li h3{
	margin:10px 0;
	color:#000;
	font-family:sans-serif, 宋体, arial;
	font-weight:300;
	transition:1.2s;
}
.news .list ul li.cur h3{
	color:rgb(37, 130, 197);
}
.news .list ul li .decribe{
	font-size:14px;
	line-height:22px;
	height:44px;
	width:100%;
	text-decoration:none;
	overflow:hidden; 
	color:#555555;
	text-overflow:ellipsis;
}
.news .list ul li .view{
	display:block;
	width:80px;
	font-size:14px;
	text-align:center;
	color:#555555;
	padding:6px 0;
	border:1px solid #999;
	box-shadow:0 1px 8px #ccc;
	margin-top:20px;
	transition:1.6s;
}
.news .list ul li .view:hover{
	color:rgb(37, 130, 197);
	box-shadow:0 1px 10px rgb(37, 130, 197);
}
.link{
	margin-top:50px;
	line-height:40px;
}
.link a{
	color:#555555;
	margin-right:12px;
	transition:1s;
}
.link a:hover{
	color:rgb(37, 130, 197);
	margin-left:6px;
}
.about-us{
	position:absolute;
	top:50%;
	margin-left:-600px;
	left:50%;
	margin-top:-300px;
	line-height:30px;
	text-indent:32px;
}
.about-us .first{
	font-size: 40px;
	color: #167fb5;
	font-weight: bold;
}