/* ========== */
/* =BNANER = */
/* ========== */
.banner{ position: relative;}
.banner-button{ position: absolute; bottom: -40px; left:0; width: 100%;}
.banner-button .content{ width: 100%; height: 80px;position: relative; z-index: 1;}
.banner-button .content:after{ content: "";  display: block; position: absolute; z-index:0; top:0; left:0; width: 200%; height: 80px;  background: #FFFFFF; -o-box-shadow:0 0 45px rgba(0,0,0,.15); -ms-box-shadow:0 0 45px rgba(0,0,.15); -moz-box-shadow:0 0 45px rgba(0,0,0,.15);  -webkit-box-shadow:0 0 45px rgba(0,0,0,.15); box-shadow:0 0 45px rgba(0,0,0,.15); }
.banner-button .swiper-button-prev,
.banner-button .swiper-button-next{ z-index:1; top:auto; margin: 0; bottom:30px; color: #000000; height: 20px; line-height: 20px; width: 90px; text-transform: uppercase; opacity: .3; font-size: 12px;  -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none;}
.banner-button .swiper-button-prev{ left:50%; margin-left: -135px; text-align:right; background: url(../images/banner_prev.png) no-repeat left;}
.banner-button .swiper-button-next{ right:50%; margin-right: -135px; text-align: left; background: url(../images/banner_next.png) right no-repeat;}
.banner-button .swiper-button-prev:hover,
.banner-button .swiper-button-next:hover{ opacity:1;}
.banner-button .swiper-pagination{ position: relative; z-index:3; margin-top: 27px; float: right; font-size: 12px; color: #202020; }
.banner-button .swiper-pagination .swiper-pagination-bullet{ line-height:20px; height: 20px; width: auto; background: none; display: inline-block; vertical-align:bottom; margin-left:15px; cursor: pointer; position: relative;  -webkit-user-select:none; -moz-user-select:none; -ms-user-select:none; user-select:none;}
.banner-button .swiper-pagination .swiper-pagination-bullet-active{ font-size: 20px; height: 24px; line-height:24px;}
.banner-button .swiper-pagination .swiper-pagination-bullet:after{ content: "/"; font-size: 12px; line-height: 12px; position: absolute; bottom:5px; left:-12px;}
.banner-button .swiper-pagination .swiper-pagination-bullet:first-child:after{ display: none;}

.banner-text{ position: absolute; top:50%; margin-top: -120px; left:0; width: 100%; text-align: center; font-family:"SourceHanSansCN-Light"; color: #FFFFFF;}
.banner-text .text{ font-size: 54px; line-height: 76px; letter-spacing:12px;}
.banner-text .text .ico-cloud{ position: relative;}
.banner-text .text .ico-cloud:after{ content: ""; position: absolute; top:50%; margin-top: -20px; right:-20px; width: 45px; height: 40px; background: url(../images/banner_ico_cloud.png);}
.banner-text .text i{ font-style: normal; color: #3fa2fe; }
.banner-text .bt{ margin-top: 70px; text-align: center;}
.banner-text .bt a{ margin: 0 12px; display:inline-block; width: 180px; height: 46px; line-height: 46px; border-radius: 23px; font-size: 20px; letter-spacing: 2px; background: rgba(255,255,255,.2); color: #FFFFFF;}
.banner-text .bt a:hover{ background: -webkit-linear-gradient(180deg,#188ffd,#0352ba); background: linear-gradient(180deg,#188ffd,#0352ba);}


.home-tit{ position: relative;}
.home-tit span{ display: block; color: #030000; font-size: 28px; line-height: 36px;  letter-spacing:2px; position: relative;}
.home-tit span:after{ content: ""; position: absolute; top:50%; left:-60px; width: 40px; height: 2px; background: #0e0e0e;}
.home-tit p{ margin-top:5px; font-size: 14px; line-height: 26px; color: #bbbbbb; letter-spacing:1px;}
.home-tit .home-more{ position: absolute; top:50%; right:0; margin-top:-20px;}
.home-more{ display: block; width: 158px; height: 40px; line-height: 40px; border-radius: 20px; text-align: center; background: -webkit-linear-gradient(180deg,#188ffd,#0352ba); background: linear-gradient(180deg,#188ffd,#0352ba); color:#FFFFFF;}
.home-more i{ font-style: normal; display: inline-block; padding-right: 15px; background: url(../images/ico_more.png) no-repeat right;}



/* ========== */
/* =HOME-PRODUCT = */
/* ========== */
.home-product{ padding-top:150px; position: relative;}
.home-product:before{ content: ""; position: absolute; top:0; right:62%; width: 100%; height: 100%; background: #f9f9f9; }
.home-product .content{ margin-top: 70px; position: relative; padding-left: 175px;padding-bottom: 80px;}
.home-product .tab{ position: absolute; top:0; left:0;}
.home-product .tab span{ display: block; cursor: pointer; height: 30px; margin-bottom:25px; font-size: 16px; letter-spacing: 1px;}
.home-product .tab span i{ display: inline-block; line-height:32px; font-style: normal; border-bottom:3px solid rgba(255,255,255,0);}
.home-product .tab span.active{ color: #202020;border: 0;color: #777777;}
.home-product .tab span.active i{ border-bottom:3px solid #188ffe;}
.home-product .js-tab-con.active{ display: block;border: 0;color: #777777;}
.home-product .js-tab-con{ display:none;}
.home-product .img{ float: left; width: 55%; position: relative;}
.home-product .img:before,
.home-product .img:after{ z-index:1; content: ""; position: absolute; top:48px; right:0; height: 0; width:20px; background:#FFFFFF;}
.home-product .img:after{ width: 40px; right:-40px; background: #000000;}
.home-product .text{ float: right; width: 38%;}
.home-product .text .tit{ color: #202020;}
.home-product .text .tit span{ font-size:18px; letter-spacing: 1px; color: #0178e7;}
.home-product .text .tit p{ font-size: 32px;}
.home-product .text .tit i{ margin-top: 10px; display: block; font-size: 18px;font-style:normal;}
.home-product .text .des{ margin-top:50px;}
.home-product .text .des p{ line-height: 36px; padding-left: 15px; position: relative; }
.home-product .text .des p span{ position: absolute; top:0; left:0;color: #0178e7;}
.home-product .text .bt .home-more { margin-top:19%; margin-right: 10px; max-width: 40%; display: inline-block; color: #777777; background: #FFFFFF; -o-box-shadow:0 0 20px rgba(0,0,0,.08); -ms-box-shadow:0 0 20px rgba(0,0,.08); -moz-box-shadow:0 0 20px rgba(0,0,0,.08);  -webkit-box-shadow:0 0 20px rgba(0,0,0,.08); box-shadow:0 0 20px rgba(0,0,0,.08); }
.home-product .text .bt .home-more i{ background: url(../images/ico_more2.png) no-repeat right;}
.home-product .text .bt .home-more:hover{background: -webkit-linear-gradient(180deg,#188ffd,#0352ba); background: linear-gradient(180deg,#188ffd,#0352ba); color:#FFFFFF;}
.home-product .text .bt .home-more:hover i{ background: url(../images/ico_more.png) no-repeat right;}


/* ========== */
/* =HOME-POINT = */
/* ========== */
.home-point{ padding: 100px 0 105px;}
.home-point li{ float: left; width: 33.33333333%; }
.home-point li:nth-child(1){ text-align: left;}
.home-point li:nth-child(2){ text-align: center;}
.home-point li:nth-child(3){ text-align: right;}
.home-point .item{ display: inline-block; text-align: left;}
.home-point .item .tit{ display: inline-block; line-height: 62px; height: 62px; position: relative;}
.home-point .item .tit span{ font-size: 62px; color: #202020; font-family:"SourceHanSansCN-Light";}
.home-point .item .tit i{ position: absolute; display: block; top:0; right:-25px; font-style: normal;}
.home-point .item .tit i:before,
.home-point .item .tit i:after{ position: absolute; left:0; content: ""; width:12px; height: 12px; background: url(../images/index_point_line.png);}
.home-point .item .tit i:before{ top:5px;}
.home-point .item .tit i:after{ bottom:5px;}
.home-point .item .des{ margin-top: 18px;}
.home-point .item .des span{ font-size:16px; color: #555555;}
.home-point .item .des p{font-size: 12px; color: #cccccc;}



/* ========== */
/* =HOME-ABOUT= */
/* ========== */
.home-about{ padding-bottom: 135px; background: url(../images/home_about_bg.jpg) top center no-repeat;}
.home-about .content{ position: relative; padding-left: 285px; }
.home-about .left{ position: absolute; top:0; left:0; padding-top: 108px;}
.home-about .left:after{ content: ""; position:absolute; top:0; left:55px; width: 195px; height: 242px; background: #FFFFFF; opacity:.1;}
.home-about .home-tit{ background: #FFFFFF; padding-top: 60px; width: 195px; height: 330px; padding-left: 28px;}
.home-about .home-tit span{padding-top: 155px;}
.home-about .home-tit span:after{ left:0; top:0;}
.home-about .home-more{ margin-top: 160px; margin-left: 35px;}
.home-about .right .tit{padding-top: 108px; height: 242px;}
.home-about .right .tit img{ margin: 0;}
.home-about .right .tit p{ margin-top: 25px; color: #FFFFFF; font-size: 24px;}
.home-about .right ul{ margin: 75px -50px 0;}
.home-about .right li{ float: left; width: 33.333333333%; text-align: center; padding: 0 50px; position: relative;}
.home-about .right li:after{ content: ""; position: absolute; top:55%; right:-25px; width: 50px; height: 1px; background:#d2d2d2;}
.home-about .right li:last-child:after{ display: none;}
.home-about .right li span{ font-size: 38px; color: #202020; font-family:"SourceHanSansCN-Light";}
.home-about .right li span i{ font-style: normal; color: #188ffe;}
.home-about .right li p{ margin-top:15px; font-size: 18px; color: #202020;}
.home-about .right li p em{ padding-right:15px; margin-right: 15px; position: relative;}
.home-about .right li p em:after{ content: ""; position: absolute; top:50%; margin-top: -7px; right:0; width: 1px; height: 14px; background: #d2d2d2;}
.home-about .right .des{ margin-top: 80px; line-height:40px; color: #999999; letter-spacing: 1px;}




/* ========== */
/* =HOME-CASE = */
/* ========== */
.home-case{ padding-top: 105px; border-bottom: 1px solid #eeeeee; position: relative;}
.home-case:after{ content: ""; position:absolute; z-index:0; top: 0; left:0; width: 100%; height: 52%; background:#f9f9f9;}
.home-case .inner-wrap{ position: relative; z-index: 1;}
.home-case ul{ margin: 55px -15px 0;}
.home-case li{ float: left; width: 25%; padding: 0 15px;}
.home-case li a{ position: relative; display: block;}
.home-case li a:after{  content: ""; position: absolute; bottom: 0; left:0; width: 0%; height:3px; background: #017bec; -webkit-transition: all ease .4s; -moz-transition: all ease .4s; -ms-transition: all ease .4s; -o-transition: all ease .4s; transition: all ease .4s;}
.home-case li .img{ background: #FFFFFF; overflow: hidden;}
.home-case li .text{ padding: 30px 30px 40px;}
.home-case li .text .tit{ font-size: 20px; color: #202020;}
.home-case li .text .des{ margin-top: 20px; font-size: 14px; line-height: 24px; height: 48px; overflow: hidden;}
.home-case li .text span{ margin-top: 35px; display:block; width: 31px; height:5px; background: url(../images/case_ico_more.png);}
.home-case li a:hover:after{ width: 100%;}
.home-case li a:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1);}
.home-case li a:hover .text{ background: #2d2d2d;}
.home-case li a:hover .text .tit{ color:#FFFFFF;}
.home-case li a:hover .text .des{ color:#FFFFFF;}
.home-case li a:hover .text span{background: url(../images/case_ico_moreh.png);}



/* ========== */
/* =HOME-NEWS = */
/* ========== */
.home-news{ padding: 155px 0 35px;}
.home-news ul{ margin-top: 45px;}
.home-news li{ float: left; width: 33.33333333%; }
.home-news li a{ display: block; padding: 48px 35px 50px; font-family:"SourceHanSansCN-Light"; position: relative;}
.home-news li a:after{  content: ""; position: absolute; bottom: 0; left:0; width: 0%; height:4px; background: #017bec; -webkit-transition: all ease .4s; -moz-transition: all ease .4s; -ms-transition: all ease .4s; -o-transition: all ease .4s; transition: all ease .4s;}
.home-news li .date{ color: #bbbbbb; font-size: 12px; letter-spacing:1px;}
.home-news li .date span{ margin-right: 5px; font-size: 36px;}
.home-news li .tit{ margin-top: 10px; font-size: 18px; color: #202020;}
.home-news li .des{ margin-top: 15px; color: #999999; line-height: 24px; height: 48px; overflow: hidden;}
.home-news li .more{ margin-top: 55px; display: inline-block; padding-right: 45px; color: #202020; background: url(../images/news_ico_more.png) right no-repeat; opacity: .4;}
.home-news li a:hover{  background: #FFFFFF; -o-box-shadow:0 0 35px rgba(0,0,0,.1); -ms-box-shadow:0 0 35px rgba(0,0,.1); -moz-box-shadow:0 0 35px rgba(0,0,0,.1);  -webkit-box-shadow:0 0 35px rgba(0,0,0,.1); box-shadow:0 0 35px rgba(0,0,0,.1); }
.home-news li a:hover:after{ width: 100%; }
.home-news li a:hover .more{ opacity: 1;}



@media (max-width:1360px) {
	.banner-text{  margin-top:-110px;}
	.banner-text .text{ font-size: 40px; line-height: 64px;}

	
	.home-product .text .tit p{ font-size:28px;}
	
	.home-about .right ul{ margin: 75px -25px 0;}
	.home-about .right li{ padding: 0 25px;}
	.home-about .right li p{ font-size: 16px;}
}