/***************** baner *****************/
.banner{
	position: relative;
	width: 100%;
	height: 100vh;
	overflow: hidden;
	/*cursor: move;*/
}

.banner .swiper-container {
  width: 100%;
  height: 100%;
  color: #fff;
  text-align: center;
}

.banner .swiper-slide a{
	display: block;
}

.banner .pagination {
    position: absolute;
    width: 100%;
    z-index: 20;
    left: 0;
    bottom: 32px;
    text-align: center;
}
.banner .swiper-pagination-switch {
  display: inline-block;
  width: 60px;
  height: 3px;
  background: #fff;
  margin: 0 10px;
  opacity: 0.8;
  cursor: pointer;
}
.banner .swiper-visible-switch {
  background: #fff;
}
.banner .swiper-active-switch {
  background: #0085ed;
  opacity: 1;
}

.banner .swiper-slide{
	position: relative;
	overflow: hidden;
}

.banner .imgBox{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	-webkit-background-size: cover;
    background-size: cover;
    background-position: center center;
    background-repeat: no-repeat;
}

.bannerCon{
	position: absolute;
	top: 50%;
	left: 0;
	width: 100%;
	height: 51px;
	margin-top: -25px;
	/*z-index: 999;*/
}
.bannerCon a{
	position: relative;
	z-index: 999;
	display: block;
	width: 60px;
	text-align: center;
	height: 60px;
	line-height: 60px;
	-webkit-transition: all .4s ease;
	-moz-transition: all .4s ease;
	-ms-transition: all .4s ease;
	-o-transition: all .4s ease;
	transition: all .4s ease;
	background-image: url(../../../base/img/content/line-icons/white.png);
  background-size: cover;
	opacity: 0.3;
  filter: alpha(opacity=30);
}
.bannerCon a i {
    color: #fff;
    font-size: 30px;
    vertical-align: middle;
}
.bannerCon a#banner-left{
	float: left;
	margin-left: 15px;
	background-position: 0px 3600%;
}
.bannerCon a#banner-right{
	float: right;
	margin-right: 15px;
	background-position: 0px 3700%;
}
.bannerCon a:hover{
	opacity: 1;
    filter: alpha(opacity=100);
}
	
.banner .pagination{
	visibility: hidden;
}

/*  banner  */

@media only screen and (max-width: 1024px) {
	.banner{
		height: 576px;
	}
}

@media only screen and (max-width: 768px) {
	.banner{
		height: 432px;
	}
}

@media only screen and (max-width: 414px) {
	.banner{
		margin-top:65px;
		height: 250px;
	}
	
	.bannerCon a{
		width: 40px;
		height: 40px;
		line-height: 40px;
	}
}

@media only screen and (max-width: 375px) {
	.banner{
		margin-top:65px;
		height: 250px;
	}
	
	.bannerCon a{
		width: 40px;
		height: 40px;
		line-height: 40px;
	}
}

@media only screen and (max-width: 320px) {
	.banner{
		height: 180px;
	}
}
