﻿/* CSS Document */

@import url(global.css);
.home_top{ width:100%; height:50px; overflow:hidden;background:#000;}
.home_top .logo{float:left;}
.home_top .logo img{ height:50px;display:block; margin:0 auto; float:left;}
.home_top .right{ width:50px; height:50px; overflow:hidden; position:absolute; right:0px; top:0px;}
.home_top .right img{height:30px; padding:10px 0;}

/*---------------------------------*/
.addcon{}
.addcon2{ position:relative; padding:0 2%;}
.addcon2 .tit{ position: absolute; width: 45px; border-radius: 0 0 100% 0; padding:5px 15px 15px 10px; position: absolute; top: 0; left: 0; z-index: 1; background: #f80; font-style:italic; z-index:999;}
.addcon2 .tit .t{ font-size: 16px; line-height: 20px; color: #fff;}

.swiper-container {width: 100%; height:auto; overflow: hidden;}
.swiper-slide {text-align: center; font-size: 18px;background: #fff; display: -webkit-box; display: -ms-flexbox; display: -webkit-flex; display: flex;-webkit-box-pack: center;  -ms-flex-pack: center; -webkit-justify-content: center; justify-content: center; -webkit-box-align: center; -ms-flex-align: center; -webkit-align-items: center; align-items: center;}
.swiper-slide a { display:block;width:100%;}
.swiper-slide img{ display:block;width:100%;height:auto; float:left;}	


.bncon{ width:100%; height:100%; overflow:hidden;}
.bncon img{ width:100%; display:block; float:left;}
/*------*/	
.project{ width:100%; height:100%; overflow:hidden;}
.project img{ width:100%; display:block; float:left;}
/*------*/	
.service{ width:100%; height:100%; overflow:hidden;}
.service img{ width:100%; display:block; float:left;}
/*------*/	
.certificate{ width:100%; height:100%; overflow:hidden;}
.certificate img{ width:100%; display:block; float:left;}
/*------*/	
.team{ width:100%; height:100%; overflow:hidden;}
.team .title img{ width:100%; display:block; float:left; margin:3% 0 1% 0;}
.team ul{ width:94%; height:100%; overflow:hidden; padding:3%; position:relative;}
.team ul img{ width:33.33%; display:block; float:left; }

/*------*/	
.case{ width:100%; height:100%; overflow:hidden;}
.case .title img{ width:100%; display:block; float:left; margin:3% 0;}
.case .box{ width:100%; height:100%; overflow:hidden; position:relative;}
.case .box .con{ width:25%; height:100%; overflow:hidden; float:left; }
.case .box .con img { display: block; width: 100%;  pointer: ; transition: all 1s; opacity: 0.3; filter: Alpha(opacity=0.6);  -webkit-filter: grayscale(100%);-moz-filter: grayscale(100%);-ms-filter: grayscale(100%);-o-filter: grayscale(100%);filter: grayscale(100%);filter: gray;}
.case .box .con:hover img{transform: scale(1.05); opacity: 1; -webkit-filter: grayscale(0%);-moz-filter: grayscale(0%);-ms-filter: grayscale(0%);-o-filter: grayscale(0%);filter: grayscale(0%);filter: gray;}
.case .box .bot{ width:100%; position:absolute; text-align:center; top:42%; left:0; font-size:18px; color:#aaa;}
/*------*/	
.contact{ width:100%; height:100%; overflow:hidden; padding:3% 0 15% 0;}
.contact img{ width:100%; display:block; float:left;}
/*------*/
.plan{ width:100%; height:100%;  overflow:hidden;}
.plan .tit{ margin:3% 0;}
.plan .tit img{ width:100%; margin:5% 0;}
.plan .box{ width:100%; height:100%; overflow:hidden; margin:5% 0;}
.plan .box img{ width:100%; float:left;}
.plan .box2{ width:94%; height:100%; padding:6% 3% 0 3%;}
.plan .box2 .con{ width:49%; height:100%; overflow:hidden; float:left;  margin:1.5% 0.5%; position:relative; }
.plan .box2 .con .title{ width:90%; height:90px; position:absolute; z-index:3; padding:5%;}
.plan .box2 .con .title h6{ font-size:1.1em;  color:#dbbd89; margin-bottom:5px;}
.plan .box2 .con .title p{ font-size:0.8em; text-transform: uppercase;  color:#fff; line-height:1.8em; }
.plan .box2 .con img { display: block; width: 100%;  pointer: ;   transition: all 1s; opacity: 0.3;}
.plan .box2 .con:hover img,.plan .box2 .con .title img{ transform: scale(1.05); opacity: 1; background:#111;transform: scale(1.05); }
.plan .box2 .con:hover img:hover,.plan .box2 .con .title img:hover{opacity: 1;}

.plan .box3{ width:100%; height:100%; overflow:hidden; position:relative;}
.plan .box3 .con{ position:absolute; z-index:1;}
.plan .box3 .c1{ width:32%; top:19%; left:-18%;  animation: rotate 12s linear infinite;}
.plan .box3 .c1 img{ width:100%;}
.plan .box3 .bg img{ width:100%; float:left;}

@keyframes rotate {
    0%{ transform: rotate(0deg);}
    100% {transform: rotate(360deg); }
}

/*------图片灯箱------*/
.img-lightbox-overlay{
	display:none;
	position:fixed;
	top:0;
	left:0;
	width:100%;
	height:100%;
	background:rgba(0,0,0,0);
	z-index:9999;
	justify-content:center;
	align-items:center;
	transition:background 0.3s ease;
}
.img-lightbox-overlay.active{
	display:flex;
	background:rgba(0,0,0,0.85);
}
.img-lightbox-overlay img{
	max-width:95%;
	max-height:90%;
	object-fit:contain;
	transform:scale(0.3);
	opacity:0;
	transition:transform 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94), opacity 0.3s ease;
}
.img-lightbox-overlay.active img{
	transform:scale(1);
	opacity:1;
}
.img-lightbox-close{
	position:absolute;
	top:15px;
	right:20px;
	width:35px;
	height:35px;
	font-size:28px;
	color:#fff;
	cursor:pointer;
	line-height:35px;
	text-align:center;
	opacity:0;
	transform:scale(0.5);
	transition:opacity 0.3s ease 0.2s, transform 0.3s ease 0.2s;
}
.img-lightbox-overlay.active .img-lightbox-close{
	opacity:1;
	transform:scale(1);
}








