/*banner S*/
.banner-slide{ width: 1920px;  overflow: hidden; margin: 0 auto; position: relative;}
.banner{width: 100%; height: 100%; position: relative;}
.banner-contenr{ width: 100%; height: 100%; position: relative;}
.banner-contenr .banner-bg{ display: block; position: relative;}
/* .banner-contenr .banner-bg.special-banner{ margin-left: -8px;} */
.banner-describe{ position: absolute; left: 118px; top: 200px; z-index: 2; transition: all .5s;}
.banner-describe h2{ font-size: 48px; font-weight: bold; color: #fdfdfd; transition: all .5s;}
.banner-describe h2 a{color: #000;}
.banner-describe .line{ width: 25px; height: 3px; background-color: #FFFFFF; margin-top: 25px; transition: all .5s;}
.banner-introduce{ width: 444px; margin-top: 37px;  font-size: 14px; color: #999999;display: -webkit-box;  -webkit-box-orient:vertical;  transition: all .5s;}
.banner-introduce a{color: #999999;}
.btn-slide-box{ width: 191px; height: 35px; position: absolute; top: 462px; left: 118px; z-index: 3; transition: all .5s;}
.btn-slide{ display: inline-block; width: 82px; height: 33px; border: 1px solid #1cbbb9; position: relative; transition: all .5s;}
.btn-left{ margin-right: 19px;}
.btn-slide::after{ content: ''; display: block; width: 43px; height: 2px; background-color: #1cb9ba; position: absolute; top: 5px; left: 0; right: 0; bottom: 0; margin: auto;}
.btn-slide::before{ content: '';  width: 9px; height: 2px; background-color: #1cb9ba; position: absolute; top: 15px; left: 20px; transform: rotate(-37deg);}
.btn-right::before{top: 15px; left: 53px;transform: rotate(37deg);}
.btn-slide:hover{ 
	background: -webkit-linear-gradient(to right, #189dca, #1cbcb8); 
	background: -o-linear-gradient(to right, #189dca, #1cbcb8);
	background: -moz-linear-gradient(to right, #189dca, #1cbcb8);
	background: linear-gradient(to right, #189dca, #1cbcb8); 
	transform: translateY(-5px);
}
.btn-slide:hover:before,.btn-slide:hover:after{background-color: #FFFFFF;}
.slide-nav-img{ width: 1920px; height: 121px; bottom: 0; left: 0px; z-index: 2;}
.slide-img-ul{width: 100%; height: 121px; position: relative;}
.slide-img-ul li{ width: 320px; height: 121px; float: left;}
.slide-img-ul li a{ display: block; width: 100%; height: 100%; position: relative;}
.mask{ display: block; width: 100%; height: 100%; position: absolute; top: 0; left: 0; background-color: #000000; opacity: 0.7; transition: all .5s;}
.nav-num{ display: block; width: 35px; height: 35px; border: 1px solid #999999; border-radius: 50%; font-weight: bold; color: #999999; line-height: 35px; text-align: center; position: absolute; top: 30px; left: 50%; z-index: 1; margin-left: -17.5px; transition: all .5s;}
.nav-txt{ display: block; width: 100%; height: 35px; line-height: 35px; font-size: 12px; color: #999999; text-align: center; position: absolute; top: 78px;  z-index: 3; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; transition: all .5s;}
.slide-img-ul li a:hover .mask{opacity: 0;}
.slide-img-ul li a:hover .nav-num{opacity: 0;}
.slide-img-ul li a:hover .nav-txt{opacity: 0;}
.img-on .mask,.img-on .nav-num,.img-on .nav-txt{opacity: 0;}

/*banner E*/



@media screen and (min-width: 1680px) and (max-width: 1901px) {
	.banner-slide{ width: 100%; height: 100%;}
	.banner-describe{ top: 160px;}
	.btn-slide-box{top: 422px;}
	.slide-nav-img{ width: 100%; height: 106px;}
	.slide-img-ul{ height: 106px;}
	.slide-img-ul li{ width: 16.66666666666667%; height: 106px;}
	.nav-num{ top: 26px; width: 32px; height: 32px; line-height: 32px; margin-left: -16px;}
	.nav-txt{top: 69px; height: 22px; line-height: 22px;}
}

@media screen and (min-width: 1440px) and (max-width: 1679px) {
	.banner-slide{ width: 100%; height: 100%;}
	.banner-describe h2{ font-size: 42px;}
	.banner-introduce{ margin-top: 31px;}
	.banner-describe{ top: 125px; left: 101px;}
	.btn-slide-box{top: 350px; left: 101px;}
	.btn-slide{ width: 70px; height: 28px;}
	.btn-slide::after{ top: 4px;}
	.btn-slide::before{ top: 12px; left: 14px;}
	.btn-right::before{left: 47px;}
	.slide-nav-img{ width: 100%; height: 90px;}
	.slide-img-ul{ height: 90px;}
	.slide-img-ul li{ width: 16.66666666666667%; height: 90px;}
	.nav-num{ top: 22px; width: 26px; height: 26px; line-height: 26px; margin-left: -13px;}
	.nav-txt{ top: 55px; height: 20px; line-height: 20px;}
}

@media screen and (min-width: 1336px) and (max-width: 1439px) {
	html,body{ background-color: #1b1c1f;}
	.banner-slide{ width: 100%; height: 100%;}
	.banner-describe h2{ font-size: 38px;}
	.banner-introduce{ margin-top: 29px; font-size: 12px;}
	.banner-describe{ top: 111px; left: 93px;}
	.btn-slide-box{top: 319px; left: 93px;}
	.btn-slide{ width: 65px; height: 26px;}
	.btn-slide::after{ top: 3px;}
	.btn-slide::before{ top: 11px; left: 11px;}
	.btn-right::before{left: 45px;}
	.slide-nav-img{ width: 100%; height: 83px;}
	.slide-img-ul{ height: 83px;}
	.slide-img-ul li{ width: 16.66666666666667%; height: 83px;}
	.nav-num{ top: 20px; width: 24px; height: 24px; line-height: 24px; margin-left: -12px;}
	.nav-txt{ top: 48px; height: 20px; line-height: 20px;}
}
@media screen and (min-width: 1280px) and (max-width: 1335px) {
	html,body{ background-color: #1b1c1f;}
	.banner-slide{ width: 100%; height: 100%;}
	.banner-describe h2{ font-size: 32px;}
	.banner-introduce{ width: 294px; height: 56px; margin-top: 29px; font-size: 12px;-webkit-line-clamp: 3;display: -webkit-box;-webkit-box-orient: vertical;text-overflow: ellipsis;}
	.banner-describe{ top: 106px; left: 78px;}
	.btn-slide-box{top: 288px; left: 78px;}
	.btn-slide{ width: 60px; height: 26px;}
	.btn-slide::after{ width: 35px; top: 3px;}
	.btn-slide::before{ top: 11px; left: 13px;}
	.btn-right::before{left: 38px;}
	.slide-nav-img{ width: 100%; height: 80px;}
	.slide-img-ul{ height: 80px;}
	.slide-img-ul li{ width: 16.66666666666667%; height: 80px;}
	.nav-num{ top: 20px; width: 23px; height: 23px; line-height: 23px; margin-left: -11.5px;}
	.nav-txt{ top: 48px; height: 20px; line-height: 20px;}
}
@media screen and (max-width: 1279px){
	html,body{ background-color: #1b1c1f;}
	.banner-slide{ width: 100%; height: 100%;}
	.banner-describe h2{ font-size: 32px;}
	.banner-introduce{ width: 294px; height: 56px; margin-top: 29px; font-size: 12px;-webkit-line-clamp: 3;display: -webkit-box;-webkit-box-orient: vertical;text-overflow: ellipsis;}
	.banner-describe{ top: 106px; left: 78px;}
	.btn-slide-box{top: 288px; left: 78px;}
	.btn-slide{ width: 60px; height: 26px;}
	.btn-slide::after{ width: 35px; top: 3px;}
	.btn-slide::before{ top: 11px; left: 13px;}
	.btn-right::before{left: 38px;}
	.slide-nav-img{ width: 100%; height: 80px;}
	.slide-img-ul{ height: 80px;}
	.slide-img-ul li{ width: 16.66666666666667%; height: 80px;}
	.nav-num{ top: 20px; width: 23px; height: 23px; line-height: 23px; margin-left: -11.5px;}
	.nav-txt{ top: 48px; height: 20px; line-height: 20px;}
}