@charset "utf-8";



.banner {

	height: 700px;

	position: relative;

	z-index: 5;

	overflow: hidden;

}



.banner .banner-text {

	position: absolute;

	z-index: 15;

	width: 679px;

	height: 364px;

	left: 50%;

	top: 50%;

	margin: -182px 0 0 -340px

}



.banner .banner-text .line {

	background: rgba(255,255,255,.7);

	position: absolute

}



.banner .banner-text .line.line-right {

	right: 0;

	top: 0;

	height: 0%;

	width: 4px;

	transition: all .9s;

	-webkit-transition: all .9s;

	transition-delay: 3.3s;

	-webkit-transition-delay: 3.3s

}



.banner .banner-text .line.line-top {

	top: 0;

	left: 0;

	width: 0;

	height: 4px;

	transition: all 1.2s;

	-webkit-transition: all 1.2s;

	transition-delay: 2.1s;

	-webkit-transition-delay: 2.1s

}



.banner .banner-text .line.line-left {

	left: 0;

	bottom: 0;

	width: 4px;

	height: 0%;

	transition: all .6s;

	-webkit-transition: all .6s;

	transition-delay: 1.5s;

	-webkit-transition-delay: 1.5s

}



.banner .banner-text .line.line-bottom {

	bottom: 0;

	height: 4px;

	right: 0;

	width: 0;

	transition: all 1.2s;

	-webkit-transition: all 1.2s;

	transition-delay: .3s;

	-webkit-transition-delay: .3s

}



.banner .banner-text .line.line-right2 {

	right: 0;

	top: 75%;

	height: 0%;

	width: 4px;

	transition: all .3s;

	-webkit-transition: all .3s

}



.banner .banner-text .line.cur.line-bottom {

	width: 100%

}



.banner .banner-text .line.cur.line-top {

	width: 100%

}



.banner .banner-text .line.cur.line-left {

	height: 100%

}



.banner .banner-text .line.cur.line-right {

	height: 60%

}



.banner .banner-text .line.cur.line-right2 {

	height: 25%

}



.banner .bg {

	position: absolute;

	top: 0;

	left: 0;

	width: 100%;

	height: 100%;

	background: rgba(0,0,0,0);

	z-index: 8

}



.banner .video {

	position: absolute;

	width: 100%;

	height: 100%;

	z-index: 10

}



.banner .video video {

	width: 100%;

}



.banner .banner-tab {

	position: absolute;

	width: 100%;

	height: auto;

	bottom: 50px;

	z-index: 15;

	height: 12px;

}



.banner .banner-tab ul {

	height: auto;

	width:1200px;

	left: 50%;

	margin-left:px;

	position: absolute;

}



.banner .banner-tab ul li {

	width: 12px;

	height: 12px;

	float: left;

	border-radius:12px;

	background: #ccc;

	position: relative;

	bottom: 0px;

	transition: all .10s;

	-webkit-transition: all .10s;

	cursor: pointer;

	margin-left:10px; margin-right:10px;



}



.banner .banner-tab ul li span {

	display: block;

	position: absolute;

	z-index: 15

}



.banner .banner-tab ul li .cn {

	font-size: 18px;

	color: #dad8d8;

	left: 25px;

	bottom: 104px

}



.banner .banner-tab ul li .en {

	font-size: 12px;

	color: #fff;

	text-transform: uppercase;

	left: 25px;

	top: 75px;

	opacity: .5;

	filter: alpha(opacity=50)

}



.banner .banner-tab ul li:after {

	background:#ccc;

	position: absolute;

	left: 0;

	top: 0;

	width: 100%;

	height: 100%;

	content: '';

	transition: all .10s;

	-webkit-transition: all .10s;

	opacity: 0;

	filter: alpha(opacity=0);

	transition: all .5s;

	-webkit-transition: all .10s;

	z-index: 5

}



.banner .banner-tab ul li:before {

	background:#fff;

	position: absolute;

	left: 0;

	top: 0;

	width: 100%;

	height: 100%;

	content: '';

	transition: all .10s;

	-webkit-transition: all .10s;

	opacity: 0;

	filter: alpha(opacity=0);

	transition: all .5s;

	-webkit-transition: all .10s;

	z-index: 6;

	 border-radius: 12px;

}



.banner .banner-tab ul li.active:after {

	opacity: 0!important;

	filter: alpha(opacity=0)

}



.banner .banner-tab ul li.active:before {

	opacity: 1!important;

	filter: alpha(opacity=100)

}



.banner .banner-tab ul li.active .cn {

	color: #dad8d8!important

}



.banner .banner-tab ul li.active .en {

	color: #fff!important

}



.banner .bannert-img {

	height: 100%

}



.banner .bannert-img ul li.cur {

	filter: blur(10px)

}



.banner .bannert-img ul li.swiper-slide {

	z-index: 2

}



.banner .bannert-img ul li.swiper-slide-active {

	z-index: 5

}



.banner .bannert-img ul li img {

	width: 100%;

}

.banner .swiper-container-horizontal>.swiper-pagination-bullets{height: auto;width: 1200px;left: 50%;position: absolute; bottom:50px; z-index:999;}
.banner .swiper-container-horizontal .swiper-pagination-banner span.swiper-pagination-bullet{width: 12px;
    height: 12px;
    float: left;
    border-radius: 12px;
    background: #ccc;
    position: relative;
    bottom: 0px;
    transition: all .10s;
    -webkit-transition: all .10s;
    cursor: pointer;
    margin-left: 10px;
    margin-right: 10px;
	opacity:1;}
.banner .swiper-container-horizontal .swiper-pagination-banner span.swiper-pagination-bullet-active{ background-color:#ffffff;}