/* CSS Document for home*/
.indexBan{width: 100%; position: relative; height: 819px; overflow: hidden;}
.indexBan .Banner{ width: 1920px;position: absolute;height: 819px; margin-left: -960px; left: 50%; ;}
#indexBan .swiper-slide{ width: 1920px; height: 819px;}
#indexBan .swiper-pagination{ position: absolute; text-align: center; bottom: 60px;z-index: 2; width: 100%;}
#indexBan .swiper-pagination .swiper-pagination-switch{display: inline-block;cursor: pointer;width: 49px;height: 5px;background: #fff;border-radius: 3px; margin: 0 5px;}
#indexBan .swiper-pagination .swiper-pagination-switch.swiper-active-switch{background: #FE9F17; }

.about{ width: 100%; display: table; padding: 60px 0 60px 0;}
.about .left{ width: 45%;}
.about .left h4{ font-size: 36px; color: #333; margin-bottom: 50px;}
.about .left h4:after{display: inline-block; content: " "; width: 136px; height: 29px; background: url(../image/icon_1.png) no-repeat center center; -webkit-background-size: 100% 100%;background-size: 100% 100%; margin-left: 20px; vertical-align: middle;}
.about .left .content{ font-size: 18px; line-height: 36px;;}
.about .left h6 .more{ display: inline-block; border-radius: 30px; line-height: 58px; width: 207px; text-align: center;; font-size: 18px; background: #416eff; color: #fff; font-weight: normal; margin-top: 30px;}
.about .right{  width: 42%;}
.about .right img{ width: 100%; height: auto;}

.advantage{ height: 652px; background: url(../image/index_bg_product.jpg) no-repeat top center; background-size: 1920px 652px; width: 100%; display: table;}
.cooperTit {text-align: center; margin: 70px 0 90px 0; line-height: 36px;}
.cooperTit span{ font-size: 36px;  display: inline-block; vertical-align: middle;}
.cooperTit.t_w span:before{ background: url(../image/icon_title_lt.png) no-repeat center center; }
.cooperTit.t_w span:after{ background: url(../image/icon_title_rt.png) no-repeat center center;}
.cooperTit.t_b span:before{ background: url(../image/icon_titleB_lt.png) no-repeat center center;}
.cooperTit.t_b span:after{ background: url(../image/icon_titleB_rt.png) no-repeat center center;}
.cooperTit.t_w span{color: #fff;}
.cooperTit.t_b span{color: #333;}
.cooperTit span:before,.cooperTit span:after{display: inline-block; width: 136px; height: 29px; content: " "; vertical-align: middle; -webkit-background-size: 100% 100%;background-size: 100% 100%; margin: 0 20px;}

.adsList{text-align: center; width: 100%; margin-top: 60px; overflow: hidden;}
.adsList dl{ display: inline-block; vertical-align: middle; margin: 0 24px; font-size: 24px; color: #fff;;}
.adsList dl:first-child{ margin-left: 0;}
.adsList dl:last-child{ margin-right: 0;}
.adsList dl dd{ margin-top: 36px; line-height: 24px;}

.product{ margin-top: 50px; overflow: hidden;}
.sulList{ width: 100%; display: table; margin: 0 0 50px 0;}
.sulList .item{width: 100%;padding: 80px 0; overflow: hidden;}
.sulList .item:nth-child(odd){ background: #fff;}
.sulList .item:nth-child(even){ background: #f5f6fb; }
.sulList .item.setLeft .textBox{ width: 44%; float: left;}
.sulList .item.setLeft .imgBox{ width: 50%; float: right; position: relative;}
.sulList .item.setRight .textBox{ width: 46%; float: right;}
.sulList .item.setRight .imgBox{ width: 50%; float: left; position: relative;}

.textBox h4{ font-size: 24px; line-height: 30px; color: #333;padding-left: 25px; margin-bottom: 40px; position: relative;}
.textBox ul{ margin: 0; padding: 0;}
.textBox ul li{  font-size: 18px; position: relative; color: #666; line-height: 28px;padding-left: 25px;}
.textBox h4:before{width: 10px;height: 10px;background: #416eff;border-radius: 50%; content: ''; display: inline-block; position: absolute; left: 0; top: 13px;}
.imgBox img{ width: 636px; height: 441px; position: relative; z-index: 2; border: #d7d7d7 solid 1px; border-radius: 4px;}
.imgBox:before{ content: ''; display: inline-block; width: 636px;height: 411px;background: #416eff;border-radius: 5px 5px 0px 0px;border-radius: 4px; position: absolute;}
.item.setLeft{ background: #f5f6fb;}
.item.setLeft .imgBox:before{ left: 30px; top: 60px;}
.item.setRight .imgBox:before{ left: -30px; top: 60px;}

/*classicList*/
.classicList{ width: 100%; display: table; margin-top: 40px;}
.classicList ul { width: 105%;}
.classicList ul li{width: 440px;height: 450px;background: #FFFFFF;border: 1px solid #EEEEEE;box-shadow: 2px 5px 24px 0px rgba(220, 218, 218, 0.44);border-radius: 10px 10px 0px 0px; float: left; margin-right: 35px; margin-bottom: 40px; position: relative;}
.bigImg{width: 440px;height: 226px; overflow: hidden;}
.bigImg img{ width: 100%; height: 100%; -webkit-transition: ease .4s; -ms-transition: ease .4s; -moz-transition: ease .4s; transition: ease .4s;}
.classicList ul li h4{ font-size: 24px; line-height: 26px; margin: 30px 68px 20px 38px; height: 24px; color: #333;}
.intro{ font-size: 16px; color: #666; line-height: 26px;margin: 0px 38px 40px 38px;overflow: hidden;text-overflow: -o-ellipsis-lastline;  overflow: hidden;  text-overflow: ellipsis;  display: -webkit-box;  -webkit-line-clamp: 2;  line-clamp: 2;  -webkit-box-orient: vertical;;}
.classicList ul li:hover img{ -webkit-transform: scale(1.2);-ms-transform: scale(1.2);-moz-transform: scale(1.2); transform: scale(1.2);}

.more{margin: 0px 38px; font-size: 16px; text-align: right; color: #333;}
.more.aboutA{ margin-left: 0;}

.case{ padding-bottom: 40px;}

.newsList{ width: 100%; overflow: hidden;; margin: 40px 0;}
.newsList .left{ width: 700px; float: left;}
.newsList .left img{ width: 100%; border-radius: 3px; height: auto;}
.newsList .right{ width: 600px; float: right;}
.newsList .right dl{ width: 100%; display:flex; overflow: hidden; margin-bottom: 40px;}
.newsList .right dl dt{ width: 220px; border-right: 1px dashed #D7D7D7; margin-right: 20px;text-align: center;}
.newsList .right dl dt b{ font-size: 50px; font-weight: normal; color: #416eff;display: block; line-height: 54px;}
.newsList .right dl dd{ width: 475px;}
.newsList .right dl dt span{ font-size: 20px; font-weight: normal; color: #666;display: block; }
.newsList .right dl dd b{ font-size: 20px; color: #333; display: block; margin-bottom: 15px;}
.newsList .right dl dd span{ font-size: 16px; color: #666; text-overflow: -o-ellipsis-lastline;  overflow: hidden;  text-overflow: ellipsis;  display: -webkit-box;  -webkit-line-clamp: 2;  line-clamp: 2;  -webkit-box-orient: vertical;}
.newsList .right dl dd a:hover *{ color: #000;}
.flink{ width: 100%; text-align: left; font-size: 16px;}
.flink a{ display: inline-block; margin-right: 20px;;}


@media screen and (min-width:1461px) and (max-width:1620px) {
	.indexBan{height: 703px;}
	.indexBan .Banner{ height: 703px; margin-left: 0; transform: translateX(-50%); left: 50%; text-align: center ;}
	#indexBan .swiper-slide{  height: 703px;}
	#indexBan .swiper-slide img{ width:auto; height:703px;}		
	.banBar{ width: 52px; height: 52px; line-height: 52px; top: 32px;}	
	
	.cooperTit{margin: 61px 0 66px 0;}
	.adsList{ margin-top: 54px;}
	
	.about{ padding: 50px 0 50px 0;}
	.about .left h4{ font-size: 31px;margin-bottom: 43px;}
	.about .left h4:after{width: 117px; height: 25px;}
	.about .left .content{ font-size: 15px; line-height: 31px;;}
	.about .left h6 .more{ line-height: 50px; width: 177px; font-size: 15px;margin-top: 26px;}
	
	.advantage{ height: 559px;  background-size: 1645px 559px;}
	.cooperTit {margin: 60px 0 77px 0; line-height: 31px;}
	.cooperTit span{ font-size: 31px;}
	.cooperTit span:before,.cooperTit span:after{width: 117px; height: 25px;margin: 0 14px;}
	
	.adsList{margin-top: 51px;}
	.adsList dl{margin: 0 21px; font-size: 21px; width: 200px;}
	.adsList dl dt img{ width: 200px; height: 200px;}
	.adsList dl dd{ margin-top: 31px;}
	
	.product{ margin-top: 43px;}
	.sulList{ margin: 0 0 43px 0;}
	.sulList .item{padding: 69px 0;}
	
	.textBox h4{ font-size: 21px; line-height: 26px;padding-left: 21px; margin-bottom: 34px;}
	.textBox ul li{font-size: 15px; line-height: 24px;padding-left: 21px;}
	.textBox h4:before{width: 10px;height: 10px;top: 13px;}
	.imgBox img{ width: 545px; height: 378px; }
	.imgBox:before{ width: 545px;height: 378px;}
	.item.setLeft .imgBox:before{ left: 26px; top: 51px;}
	.item.setRight .imgBox:before{ left: -26px; top: 51px;}
	
	
	.classicList{ margin-top: 34px;}
	.classicList ul li{width: 377px;height: 386px;margin-right: 30px; margin-bottom: 34px;}
	.bigImg{width: 377px;height: 194px;}
	.classicList ul li h4{ font-size: 21px; line-height: 22px; margin: 26px 58px 17px 33px; height: 21px; }
	.intro{ font-size: 14px;line-height: 22px;margin: 0px 33px 20px 33px; }
	.more{margin: 0px 33px; font-size: 14px;}
	.case{ padding-bottom: 34px;}
	
	.newsList{margin: 34px 0;}
	.newsList .left{ width: 600px;}
	.newsList .right{ width: 544px;}
	.newsList .right dl{ width: 100%;margin-bottom: 24px;}
	.newsList .right dl dt{ width: 189px; margin-right: 17px;}
	.newsList .right dl dt b{ font-size: 43px;  line-height: 46px;}
	.newsList .right dl dt span{ font-size: 17px;}
	.newsList .right dl dd{ width: 350px;}
	.newsList .right dl dd b{ font-size: 17px;margin-bottom: 15px;}
	.newsList .right dl dd span{ font-size: 14px;}
	.flink{font-size: 14px;}
	.flink a{margin-right: 17px;}
}

@media screen and (min-width:1024px) and (max-width:1460px) {
	.indexBan{height: 600px;}
	.indexBan .Banner{ width: 1400px;height: 600px; margin-left: -700px; left: 50%; text-align: center ;}
	#indexBan .swiper-slide{ width: 1400px; height: 600px;}
	#indexBan .swiper-slide img{ width:1400px; height:600px;}
	
	.cooperTit{margin: 52px 0 56px 0;}
	.adsList{ margin-top: 46px;}
	
	.about{ padding: 43px 0 43px 0;}
	.about .left h4{ font-size: 26px;margin-bottom: 37px;}
	.about .left h4:after{width: 100px; height: 21px;}
	.about .left .content{ font-size: 14px; line-height: 26px;;}
	.about .left h6 .more{ line-height: 43px; width: 151px; font-size: 14px;margin-top: 22px;}
	
	.advantage{ height: 477px;  background-size: 1403px 477px;}
	.cooperTit {margin: 51px 0 66px 0; line-height: 26px;}
	.cooperTit span{ font-size: 26px;}
	.cooperTit span:before,.cooperTit span:after{width: 100px; height: 21px;margin: 0 12px;}
	
	.adsList{margin-top: 44px;}
	.adsList dl{margin: 0 18px; font-size: 18px; width: 171px;}
	.adsList dl dt img{ width: 171px; height: 171px;}
	.adsList dl dd{ margin-top: 31px;}
	
	.product{ margin-top: 37px;}
	.sulList{ margin: 0 0 37px 0;}
	.sulList .item{padding: 59px 0;}
	
	.textBox h4{ font-size: 18px; line-height: 22px;padding-left: 18px; margin-bottom: 29px;}
	.textBox ul li{font-size: 13px; line-height: 20px;padding-left: 18px;}
	.textBox h4:before{width: 9px;height: 9px;top: 13px;}
	.imgBox img{ width: 465px; height: 322px; }
	.imgBox:before{ width: 465px;height: 322px;}
	.item.setLeft .imgBox:before{ left: 22px; top: 44px;}
	.item.setRight .imgBox:before{ left: -22px; top: 44px;}
	
	
	.classicList{ margin-top: 29px;}
	.classicList ul li{width: 322px;height: 329px;margin-right: 30px; margin-bottom: 29px;}
	.bigImg{width: 322px;height: 165px;}
	.classicList ul li h4{ font-size: 18px; line-height: 19px; margin: 22px 49px 15px 28px; height: 18px; }
	.intro{ font-size: 12px;line-height: 19px;margin: 0px 28px  20px 28px;}
	.more{margin: 0px 28px; font-size: 12px;}
	.case{ padding-bottom: 29px;overflow: hidden; width: 100%;}
	
	.newsList{margin: 29px 0;}
	.newsList .left{ width: 512px;}
	.newsList .right{ width: 464px;}
	.newsList .right dl{ margin-bottom: 20px;}
	.newsList .right dl dt{ width: 161px; margin-right: 15px;}
	.newsList .right dl dt b{ font-size: 37px;  line-height: 39px;}
	.newsList .right dl dt span{ font-size: 15px;}
	.newsList .right dl dd{ width: 303px;}
	.newsList .right dl dd b{ font-size: 15px;margin-bottom: 13px;}
	.newsList .right dl dd span{ font-size: 12px;}
	.flink{font-size: 12px;}
	.flink a{margin-right: 15px;}
	
}

@media screen and (min-width:300px) and (max-width:1024px) {
	.indexBan .Banner{ width: 100%; left: 0; margin-left: 0; position: inherit;}
	.indexBan{ height: auto;}
	.indexBan .BanOther{  position: relative; height: 2.4rem; border-bottom: 1px solid #d8d8d8;}
	#indexBanSm,.indexBan .BanOther li{ height: 2.4rem;}
	
	#indexBan .swiper-slide img{ width: 100%; height: 100%;}
	#indexBan .swiper-pagination{ bottom: .1rem;}
	#indexBan .swiper-pagination .swiper-pagination-switch{ width: .49rem; height: 0.05rem;}
	
	.about .left,.about .right{ float: none; margin: 0.3rem; width: auto;}
	
	.about{ width: 100%; display: table; padding: .4rem 0 .4rem 0;}
	.about .left{ width: auto;}
	.about .left h4{ font-size: .36rem;margin-bottom: .5rem;}
	.about .left h4:after{width: 1.36rem; height: 0.29rem; margin-left: .2rem;}
	.about .left .content{ font-size: .28rem; line-height: .46rem;;}
	.about .left h6 .more{ display: block; border-radius: .3rem; line-height: .58rem; width:auto;font-size: .28rem;margin-top: .30rem;}
	.about .right{  width: auto;}
	.about .right img{ width: 100%; height: auto;}
	
	.advantage{ height: auto; background: url(../image/index_bg_product.jpg) no-repeat top center; background-size:cover; width: 100%; display: table;}
	.cooperTit { margin: .7rem 0 .9rem 0; line-height: .46rem;}
	.cooperTit span{ font-size: .46rem;}
	.cooperTit span:before,.cooperTit span:after{width: 1.36rem; height: .29rem;margin: 0 .2rem;}
	
	.adsList{margin-top: .6rem;}
	.adsList dl{margin: 0 .24rem; font-size: .34rem; width: 2.32rem; height: 4rem;}
	.adsList dl dt img{ width: 100%; height: auto;}
	.adsList dl dd{ margin-top: .36rem;}
	
	
	.product{ margin-top: .5rem;}
	.sulList{ width: 100%; display: table; margin: 0 0 .50rem 0;}
	.sulList .item{width: auto; padding: .8rem .2rem;display: block; overflow: hidden;}
	.sulList .item.setLeft .textBox{ width: auto; float: none;}
	.sulList .item.setLeft .imgBox{ width: auto; float: none; margin: 0.3rem;}
	.sulList .item.setRight .textBox{ width:auto; float: none;}
	.sulList .item.setRight .imgBox{ width: auto; float: none;margin: 0.3rem;}
	
	.textBox h4{ font-size: .34rem; line-height: .4rem;padding-left: .25rem; margin-bottom: .4rem;}	
	.textBox ul li{  font-size: .28rem;line-height: .38rem;padding-left: .25rem;}
	.textBox h4:before{width: .10rem;height: .10rem;left: 0; top: .13rem;}
	.imgBox img{ width: 6.36rem; height: 4.41rem;}
	.imgBox:before{width: 6.36rem;height: 4.11rem;}	
	.item.setLeft .imgBox:before{ left: .30rem; top: .60rem;}
	.item.setRight .imgBox:before{ left: -.30rem; top: .60rem;}
	
	.classicList{ width: auto; display: block; margin-top: .40rem;}
	.classicList ul { width: auto;}
	.classicList ul li{width: auto;height: auto;border-radius: .10rem .10rem 0px 0px;margin:.3rem; float: none; padding-bottom: .2rem;}
	.bigImg{width: 100%;height: auto;}	
	.classicList ul li h4{ font-size: .34rem; line-height: .36rem; margin: .30rem .68rem .20rem .38rem; height: auto;}
	.intro{ font-size: .26rem;line-height: .36rem;margin: 0px .38rem  .20rem .38rem; }
	.more{margin: 0px .38rem; font-size: .26rem;}	
	.case{ padding-bottom: .40rem;}
	
	.newsList{ width: auto;margin: .40rem 0;}
	.newsList .left{ width: auto; float: none; margin: .2rem;}	
	.newsList .right{ width: auto; float: none;margin: .2rem;}
	.newsList .right dl{ width: 100%; display:flex; overflow: hidden; margin-bottom: .40rem;}
	.newsList .right dl dt{ width: 3rem;margin-right: .2rem; padding-right: .2rem;}
	.newsList .right dl dt b{ font-size: .50rem;line-height: .54rem;}
	.newsList .right dl dt span{ font-size: .3rem;}
	.newsList .right dl dd{}
	.newsList .right dl dd b{ font-size: .3rem;margin-bottom: .15rem;}
	.newsList .right dl dd span{ font-size: .26rem; line-height: .36rem; }	
	.flink{font-size: .26rem;margin: .3rem;}
	.flink a{margin-right: .20rem;}
	
}