/* ========== */
/* = BANNER = */
/* ========== */
.banner{ clear: both; position: relative;}
.banner .swiper-button-prev,
.banner .swiper-button-next{  width:40px; height: 40px; margin-top: -20px;}
.banner .swiper-button-prev{ left:6%; background-image: url(../images/banner_prev.png);}
.banner .swiper-button-next{ right:6%; background-image: url(../images/banner_next.png);}
.banner .swiper-pagination{ left:12%; bottom:60px; text-align:left;}
.banner .swiper-pagination .swiper-pagination-bullet{ background: #ffffff; margin: 0 10px 0 0; opacity: .54; border-radius: 0; width: 34px; height: 3px; }
.banner .swiper-pagination .swiper-pagination-bullet-active{  background: #378ed8; opacity: 1; }
.banner-01{ position: relative;}
.banner-01 .text{ position: absolute; z-index: 1; top:31%; left:0; width: 100%; padding-left: 12%; font-weight: lighter;}
.banner-01 .text p{ font-size: 23px; letter-spacing: 2px; color: #4aacee;}
.banner-01 .text h2{ margin-top:30px; font-size: 120px; color: #FFFFFF;}
.banner-01 .text span{ margin-top:10px; display: inline-block; font-size: 20px; letter-spacing:30px; color: #FFFFFF; opacity: .5;; text-transform: uppercase;}
.banner-02 { background: #2d6eca; position: relative; color: #fff;}
.banner-02 a{ color: #fff; }
.banner-02 .text{ position: absolute; z-index: 1; transform: translateY(-50%); -webkit-transform: translateY(-50%); top:50%; left:0; width: 100%; padding-left: 15%; font-weight: lighter;}
.banner-02 .text h2{ font-size: 60px; font-weight: lighter;}
.banner-02 .text h2 em{ font-size:50px; font-weight: lighter;}
.banner-02 .text p{ margin-top: 2.4%; font-size: 34px;}
.banner-02 .text span{ margin-top:6.5%; display:block; width: 44px; height: 23px; background: url(../images/banner_01_ico.png); }
.banner-02 .img{ position: relative;}
.banner-02 .img img{ width: 100%;}
.banner-02 .img .png{ position: absolute; top:0; left:0;}
.banner-02 .bt{ position: relative; z-index:1; margin-top: 30px; text-align:center; display: inline-block; border-radius: 10px; width: 190px; height:60px; line-height: 60px; background: #fff; color: #288fd4; font-size: 20px; font-weight: bold;}
.banner-03{  background-image: url(../images/banner_02.jpg); background-size:cover; }

@media (max-width:1600px) {
	.banner-01 .text p{ font-size: 20px; }
	.banner-01 .text h2{ margin-top:20px; font-size:100px;}
	.banner-01 .text span{font-size: 18px; letter-spacing:25px;}
	
	.banner-02 .text h2{ font-size:54px;}
	.banner-02 .text h2 em{ font-size: 44px;}
	.banner-02 .text p{ font-size: 28px;}
}
@media (max-width:1400px) {
	.banner-01 .text{ top:29%;}
	.banner-01 .text p{ font-size: 18px; }
	.banner-01 .text h2{font-size:88px;}
	.banner-01 .text span{font-size: 16px; letter-spacing:20px;}
	
	.banner-02 .text h2{ font-size:44px;}
	.banner-02 .text h2 em{ font-size: 34px;}
	.banner-02 .text p{ font-size: 26px;}
	.banner-02 .text span{ margin-top: 5%;}
}


.container{ width:90%; max-width: 1500px; margin: 0 auto; background:#FFFFFF; }

.homt-tit{ color: #333333; padding-bottom: 14px; position: relative;}
.homt-tit:after{ content: ""; position: absolute; bottom: 0; left:0; width: 30px; height: 2px; background: #474747;}
.homt-tit span{ font-size: 28px;}
.homt-tit p{ margin-top:8px; font-size: 16px; text-transform:uppercase;}
.homt-tit-white{ color: #FFFFFF;}
.homt-tit-white:after{ background:#FFFFFF;}
.homt-tit-white p{ color:#eeeeee;}


/* ========== */
/* = HOME-ABOUT = */
/* ========== */
.home-about{ margin-bottom: 55px; position: relative; z-index: 1; background: none; background:#FFFFFF;}
.home-about .box{ display: flex; flex-flow: wrap; align-items: center; justify-content: space-between; background: url(../images/newhome/asl_line.png) center bottom no-repeat;}
.home-about .box .text{ width: 50%; padding: 0 50px; text-align: justify;}
.home-about .box .tit{ margin-left:-15px; font-size: 22px; color: #333333;}
.home-about .box .tit span{ font-size: 27px; color: #288fd4;}
.home-about .box .des{ margin-top: 8%; line-height:40px; font-size: 16px; color: #666;}
.home-about .more-button{ margin-top:8%; display: block; border:1px solid #666; font-size: 16px; color: #666; width: 220px; line-height: 44px; padding-left: 42px; position: relative; overflow: hidden;}
.home-about .more-button i{ display: inline-block; vertical-align: middle; background: url(../images/newhome/more_button_gary.png); width: 23px; height:23px; position: relative; z-index: 1;}
.home-about .more-button span{ margin-left: 14px; display: inline-block; vertical-align: middle; position: relative; z-index: 1;}
.home-about .more-button:after{ content: ""; position: absolute; bottom: 0; left:0; width: 100%; height: 100%; background: #288fd4; transform:translateY(100%);  -webkit-transform:translateY(100%); transition: all ease .3s; -webkit-transition: all ease .3s;}
.home-about .more-button:hover{ color:#FFFFFF; border:1px solid #288fd4; }
.home-about .more-button:hover i{ background: url(../images/home_more_white.png)}
.home-about .more-button:hover:after{ transform:translateY(0%);  -webkit-transform:translateY(0%);}
.home-about .box .right{ width: 50%; height: 457px; position: relative; }
.home-about .box .right .img{ position: absolute; display: block; top:0; left:0; width: 100%; height: 100%; overflow:hidden;}
.home-about .box .right .img-item:hover{ transform: scale(1.1); -webkit-transform: scale(1.1);}
.home-about .slick{ position: absolute; top:-92px; left:0; width: 100%; height: 92px; background: #FFFFFF; padding-right: 140px;}
.home-about .slick-prev{ left:auto; right:70px;}
.home-about .slick-slide{ text-align: center;}
.home-about .slick-slide a{ display:inline-block; padding: 0 25px; line-height: 92px; text-align: center; font-size: 18px; position: relative;}
.home-about .slick-slide a i{ position: absolute; top:50%; margin-top: -7px; left:0; display: block; border: 8px solid transparent; border-left:8px solid #288fd4; width: 0; height: 0px;}
.home-about .slick-slide a:before,
.home-about .slick-slide a:after{ content: ""; position: absolute; left:50%; height: 15px; width: 1px; background:#dddddd; transition: all ease 1s; -webkit-transition: all ease 1s;}
.home-about .slick-slide a:before{ top:12px;}
.home-about .slick-slide a:after{ bottom:12px;}
.home-about .slick-slide a:hover{ color: #288fd4;}
.home-about .slick-slide a:hover:before,
.home-about .slick-slide a:hover:after{ background:#288fd4; height: 0;}

@media (max-width:1340px){
	.home-about .box .tit{ font-size: 20px; margin-left: -10px;}
	.home-about .box .tit span{ font-size: 24px;}
	.home-about .box .des{ line-height: 34px; font-size: 14px;}
	
	.home-about .slick-slide a{ padding:0 15px; font-size: 15px;}
	.home-about .slick-slide a i{ margin-top: -4px; border: 5px solid transparent; border-left:5px solid #288fd4;}
}



/* ========== */
/* = HOME-MARKET = */
/* ========== */
.home-market{ margin-bottom: 50px; margin-top:55px;}
.home-market .content{ padding: 78px 50px 55px; position: relative; z-index: 1;}
.home-market .left{ margin-top: -220px; float:right; width: 380px;}
.home-market .box{  background: #288fd4; padding-bottom: 5px;}
.home-market .box .con{ padding: 55px 25px 10px;}
.home-market .box .des{ margin-top: 30px; font-size: 16px; color:#eeeeee; line-height: 30px;}
.home-market .cricle{ position:relative;}
.home-market .cricle img{ position: relative; z-index:0; animation: progress360 10s ease-in infinite;  -webkit-animation: progress360 10s ease-in infinite;}
.home-market .cricle span{ position: absolute; z-index: 1; margin-top: -16px; top:50%; display: block;  left:0; width: 100%; text-align: center; line-height: 16px; height: 32px; color: #4297ff; font-weight: bold;}
.home-market .more-button{ margin:65px 0 0 30px; display: block; border:1px solid #666; font-size: 16px; color: #666; width: 220px; line-height: 44px; padding-left: 42px; position: relative; overflow: hidden;}
.home-market .more-button i{ display: inline-block; vertical-align: middle; background: url(../images/newhome/more_button_gary.png); width: 23px; height:23px; position: relative; z-index: 1;}
.home-market .more-button span{ margin-left: 14px; display: inline-block; vertical-align: middle; position: relative; z-index: 1;}
.home-market .more-button:after{ content: ""; position: absolute; bottom: 0; left:0; width: 100%; height: 100%; background: #288fd4; transform:translateY(100%);  -webkit-transform:translateY(100%); transition: all ease .3s; -webkit-transition: all ease .3s;}
.home-market .more-button:hover{ color:#FFFFFF; border:1px solid #288fd4; }
.home-market .more-button:hover i{ background: url(../images/home_more_white.png)}
.home-market .more-button:hover:after{ transform:translateY(0%);  -webkit-transform:translateY(0%);}

.home-market ul{ margin-right: 410px;}
.home-market li{ float: left; width:23%; margin-left:2%;}
.home-market li .hbox{position:relative; height: 515px;  background: #FFFFFF; overflow: hidden; -webkit-box-shadow:0 0 25px rgba(206,206,206,.4); box-shadow:0 0 25px rgba(206,206,206,.4);  }
.home-market li .hbox .num{ z-index: 1; position: absolute; top:0; left:28px; padding: 0 15px; height: 48px; line-height: 48px; background: #288fd4; font-size: 18px;  color: #FFFFFF; text-align: center; border: 1px solid rgba(255,255,255,.3);}
.home-market li .hbox a{ border-bottom: 1px solid #f8f8f8; display: block; padding:30px 22px 0; height: 155px; position: relative; text-align: right; }
.home-market li .hbox a:nth-child(2){ padding-top: 77px; height:205px; }
.home-market li .hbox a:nth-child(2) .img{ top:75px;}
.home-market li .hbox a:last-child{ border-bottom: none;}
.home-market li .hbox a .img{ position: absolute; top:30px; left:25px;}
.home-market li .hbox a .img img:nth-child(1){ display: block; }
.home-market li .hbox a .img img:nth-child(2){ display: none; }
.home-market li .hbox a div i{ margin-bottom: 10px; font-style:normal; display: block; font-size:17px; line-height: 30px;}
.home-market li .hbox a div p{ font-size: 14px; line-height: 24px; color: #999999;}
.home-market .li3 .hbox a{ height: 230px; padding-top:55px;}
.home-market .li3 .hbox a .img{ top:52px;}
.home-market .li3 .hbox a:nth-child(2){ padding-top: 115px; height:285px; }
.home-market .li3 .hbox a:nth-child(2) .img{ top:113px; }
.home-market .li4 .hbox a{ height: 115px; padding-top: 40px;}
.home-market .li4 .hbox a .img{ top:38px; }
.home-market .li4 .hbox a:nth-child(2){ padding-top: 77px; height:165px; }
.home-market .li4 .hbox a:nth-child(2) .img{ top:78px;}
.home-market li .hbox a:hover{  background: #288fd4; color: #FFFFFF;}
.home-market li .hbox a:hover p{ color: #FFFFFF;}
.home-market li .hbox a:hover .img img:nth-child(1){ display: none; }
.home-market li .hbox a:hover .img img:nth-child(2){ display: block; }

@keyframes progress360 {
    0%{
        -webkit-transform: rotate(0deg);
        transform: rotate(0deg);
    }
    25%{
    	-webkit-transform: rotate(120deg);
        transform: rotate(120deg);
    }
    35%{
    	-webkit-transform: rotate(120deg);
        transform: rotate(120deg);
    }
    55%{
    	-webkit-transform: rotate(240deg);
        transform: rotate(240deg);
    }
    65%{
    	-webkit-transform: rotate(240deg);
        transform: rotate(240deg);
    }
    90%{
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
    100%{
        -webkit-transform: rotate(360deg);
        transform: rotate(360deg);
    }
}
@media (max-width:1520px){
	.home-market li .hbox a div i{ font-size: 15px;}
}
@media (max-width:1400px){
	.home-market li .hbox a{ padding: 17px 15px 17px;}
	.home-market li .hbox a:nth-child(2){ padding-top: 57px;}
	.home-market li .hbox a div i{ margin-bottom:5px;}
	.home-market li .hbox a .img{ position: relative; top:auto; left:auto; display: inline-block;}
	.home-market li .hbox a:nth-child(2) .img{ top:auto; }
	.home-market .li3 .hbox a{ padding:45px 15px;}
	.home-market .li3 .hbox a .img,
	.home-market .li4 .hbox a .img{ top:auto;}
	.home-market .li3 .hbox a:nth-child(2){ padding-top: 100px; }
	.home-market .li3 .hbox a:nth-child(2) .img,
	.home-market .li4 .hbox a:nth-child(2) .img{ top:auto; }
	.home-market .li4 .hbox a{ padding:22px 15px;}
	.home-market .li4 .hbox a:nth-child(2){ padding-top:70px; }
}
@media (max-width:1340px){
	.home-market li .hbox a div i{ margin-bottom:0; font-size: 15px;}
	.home-market li .hbox a div p{ font-size: 12px; line-height:20px;}
}




/* ========== */
/* = HOME-CASE = */
/* ========== */
.home-case{ margin-bottom: 58px; padding: 55px 50px 40px;}
.home-case .theme span{ font-size: 28px; color: #333333;}
.home-case .theme p{ margin-top: 18px; font-size: 16px; color: #999999;}
.home-case .tab{ margin-top: 25px; padding-right:120px;}
.home-case .tab span{ font-size: 0; float: left; margin-right: 12px; display:block; cursor:pointer; max-width:17%; width:160px; padding-right: 10px; text-align: center; height: 52px; line-height: 52px; color: #333333;  background-color: #f5f5f5; }
.home-case .tab i{ display:inline-block; vertical-align: middle; margin-right: 10px; width: 32px; height: 32px; }
.home-case .tab em{ font-style: normal; vertical-align: middle; font-size:16px; }
.home-case .tab span:nth-child(1) i{background-image:url(../images/ico_case_02.png);}
.home-case .tab span:nth-child(2) i{background-image:url(../images/ico_case_04.png);}
.home-case .tab span:nth-child(3) i{background-image:url(../images/ico_case_01.png);}
.home-case .tab span:nth-child(4) i{background-image:url(../images/ico_case_03.png);}
.home-case .tab span:nth-child(5) i{background-image:url(../images/ico_case_05.png);}
.home-case .tab span:hover,
.home-case .tab span.active,
.home-case .tab span:hover{ background-color: #288fd4; color: #FFFFFF; }
.home-case .tab span:nth-child(1):hover i,
.home-case .tab span:nth-child(1).active i{ background-image:url(../images/ico_case_02h.png);}
.home-case .tab span:nth-child(2):hover i,
.home-case .tab span:nth-child(2).active i{ background-image:url(../images/ico_case_04h.png);}
.home-case .tab span:nth-child(3):hover i,
.home-case .tab span:nth-child(3).active i{background-image:url(../images/ico_case_01h.png);}
.home-case .tab span:nth-child(4):hover i,
.home-case .tab span:nth-child(4).active i{background-image:url(../images/ico_case_03h.png);}
.home-case .tab span:nth-child(5):hover i,
.home-case .tab span:nth-child(5).active i{background-image:url(../images/ico_case_05h.png);}

.home-case .js-tab-con{ display: none; position:relative;}
.home-case .js-tab-con.active{ display: block;}
.home-case .more-button{ position: absolute; top:-82px; right:0; display: block; border:1px solid #666; font-size: 16px; color: #666; width: 220px; line-height: 44px; padding-left: 42px;  overflow: hidden;}
.home-case .more-button i{ display: inline-block; vertical-align: middle; background: url(../images/newhome/more_button_gary.png); width: 23px; height:23px; position: relative; z-index: 1;}
.home-case .more-button span{ margin-left: 14px; display: inline-block; vertical-align: middle; position: relative; z-index: 1;}
.home-case .more-button:after{ content: ""; position: absolute; bottom: 0; left:0; width: 100%; height: 100%; background: #288fd4; transform:translateY(100%);  -webkit-transform:translateY(100%); transition: all ease .3s; -webkit-transition: all ease .3s;}
.home-case .more-button:hover{ color:#FFFFFF; border:1px solid #288fd4; }
.home-case .more-button:hover i{ background: url(../images/home_more_white.png)}
.home-case .more-button:hover:after{ transform:translateY(0%);  -webkit-transform:translateY(0%);}
.home-case .market-logo{  margin:0 -10px 0;  padding:20px 0 30px;}

.web-list{ padding-top: 25px;}
.market-logo{ padding-top: 50px; margin: 0 -10px;}
.market-logo li{ float: left; width: 20%; padding: 10px;}
.market-logo li a{ display: block; padding: 10px 5px; -webkit-box-shadow:0 0 20px rgba(206,206,206,.3); box-shadow:0 0 20px rgba(206,206,206,.3);}
.market-logo li a img{ transition: all ease .4s; -webkit-transition: all ease .4s;}
.market-logo li a:hover img{ transform: scale(1.1); -webkit-transform: scale(1.1);}

.market-list li{ margin-top:60px; float: left; width: 48%; margin-right:4%;}
.market-list li:nth-child(2n){ margin-right: 0;}
.market-list li a{ position: relative; display: block; box-shadow:0 0 20px rgba(206,206,206,.3); -webkit-box-shadow:0 0 20px rgba(206,206,206,.3); }
.market-list li a:before{ content: ""; position: absolute; bottom: 0; left:0; width: 0; height: 2px; background: #288fd4; transition: ease all .6s; -webkit-transition: ease all .6s;}
.market-list li .img{ float:left; padding: 55px 0; border-right: 1px solid #e5e5e5;}
.market-list li .intro{  margin-left: 171px; padding: 25px 25px 0;}
.market-list li .intro>span{ padding-bottom: 13px; display: block;  font-size: 20px; color: #333333; position: relative;}
.market-list li .intro>span:after{ content:""; position: absolute; bottom:0; left:0; width: 30px; height: 1px; background:#333333;}
.market-list li .intro p{ margin: 12px 0 18px; line-height: 28px; height: 56px; color: #999999; overflow: hidden;}
.market-list li .intro div{ line-height:40px; position: relative;}
.market-list li .intro div i{ font-style:normal; font-size: 12px;}
.market-list li .intro div em{ position: absolute; right:0; top:50%; margin-top: -6px; width: 21px; height: 12px; background: url(../images/ico_more.png) right no-repeat;}
.market-list li a:hover:before{ width: 100%;}
.market-list li a:hover .intro div i{ color: #288fd4;}
.market-list li a:hover .intro div em{ transform:translateX(-10px); -webkit-transform: translateX(-10px); width:36px; background: url(../images/ico_moreh.png) right no-repeat;}

@media (max-width:1400px){
.home-case .tab span{max-width:16.3%; }

}


/* ========== */
/* = HOME-WHY = */
/* ========== */
.index-why-box {
    background-position: center 0;
    background-repeat: no-repeat;
	margin-bottom: 50px;
	text-align:center;
}
.index-why-box .homt-tit:after{ background: #3f8fd3; left:50%; margin-left: -15px;}

.index-why-show {
    width: 1200px;
    margin: 0 auto;
    padding:55px 0;
}

.index-why-show h3 {
    font-size: 36px;
    color: #ffffff;
    text-align: center;
    position: relative;
}

.index-why-show h3:after {
    content: "";
    display: block;
    width: 70px;
    height: 2px;
    position: absolute;
    left: 50%;
    bottom: -30px;
    margin-left: -35px;
    background-color: rgba(255, 255, 255, .4);
}

.index-why-show .ltitle {
	margin-top: 18px;
    font-size: 16px;
    color: #999999;
	text-align:center;
}

.index-why-show ul {
    width: 100%;
    overflow: hidden;
    margin-top: 30px;
}

.index-why-show ul li {
    width: 32.5%;
    height: 270px;
    margin-right: 1.25%;
    text-align: center;
    float: left;
    margin-top: 20px;
    position: relative;
	
}

.index-why-show ul li div.show {
    background-color: #666666;
    height: 260px;
    width: 100%;
    position: absolute;
    bottom: 0;
    left: 0;
    display: -webkit-box;
    -webkit-box-align: center;
    -webkit-box-pack: center;
	-webkit-box-shadow:0 0 25px rgba(206,206,206,.4); box-shadow:0 0 25px rgba(206,206,206,.4); 
}

.index-why-show ul li:nth-of-type(3n) {
    margin-right: 0;
}

.index-why-show ul li div.pic img {
    display: block;
    margin: 0 auto;
    text-align: center;
}

.index-why-show ul li div.pic img:nth-of-type(2) {
    display: none;
}

.index-why-show ul li h5 {
    font-size: 18px;
    color: #ffffff;
    margin: 25px 0 20px;
}

.index-why-show ul li div.des {
    font-size: 14px;
    line-height: 22px;
    color: #ffffff;
}

.index-why-show ul li div.show p.bg {
    position: absolute;
    width: 100%;
    height: 100%;
    background-color: #FFF;
    left: 0;
    top: 0;
    opacity: 0;
	-webkit-box-shadow:0 0 25px rgba(206,206,206,.4); box-shadow:0 0 25px rgba(206,206,206,.4); 
}

.index-why-show ul li div.show>div {
    position: relative;
}

.index-why-show ul li:hover h5 {
    color: #0a88c8;
}

.index-why-show ul li:hover div.des {
    color: #666666;
}







/* ========== */
/* = HOME-ASL = */
/* ========== */
.home-asl{ margin-bottom: 50px; padding: 55px 0; text-align: center;}
.home-asl .homt-tit{ text-align: center;}
.home-asl .homt-tit:after{ background: #3f8fd3; left:50%; margin-left: -15px;}
.home-asl .des{ margin: 40px auto 0 ;  max-width: 1312px; width: 80%; font-size: 16px; line-height: 36px; color: #666666;}
.home-asl .line{ margin-top: 35px; width: 100%; height: 20px; background: url(../images/newhome/asl_line.png) center bottom no-repeat;}
.home-asl .more-button{ margin:35px auto 0; position: relative; display: block; border:1px solid #666; font-size: 16px; color: #666; width: 220px; line-height: 44px; padding-left: 42px;  overflow: hidden;}
.home-asl .more-button i{ display: inline-block; vertical-align: middle; background: url(../images/newhome/more_button_gary.png); width: 23px; height:23px; position: relative; z-index: 1;}
.home-asl .more-button span{ margin-left: 14px; display: inline-block; vertical-align: middle; position: relative; z-index: 1;}
.home-asl .more-button:after{ content: ""; position: absolute; bottom: 0; left:0; width: 100%; height: 100%; background: #288fd4; transform:translateY(100%);  -webkit-transform:translateY(100%); transition: all ease .3s; -webkit-transition: all ease .3s;}
.home-asl .more-button:hover{ color:#FFFFFF; border:1px solid #288fd4; }
.home-asl .more-button:hover i{ background: url(../images/home_more_white.png)}
.home-asl .more-button:hover:after{ transform:translateY(0%);  -webkit-transform:translateY(0%);}
.home-asl .content{ padding: 60px 115px 40px; position: relative; background-image: url(../images/newhome/home_asl_bg.jpg); background-size: cover;}
.home-asl .content:before{ content: ''; position: absolute; top:110px; left:0; width: 100%; height: 1px; background:#FFFFFF; opacity: .2;}
.home-asl .content .swiper-button-prev,
.home-asl .content .swiper-button-next{ z-index: 3; top:85px; margin-top:0; width: 54px; height: 54px; background-size: cover;}
.home-asl .content .swiper-button-next{ right:50px; background-image: url(../images/newhome/home_asl_next.png);}
.home-asl .content .swiper-button-prev{ left:50px; background-image: url(../images/newhome/home_asl_prev.png);}
.swiper-home-asl{ color: #FFFFFF;}
.swiper-home-asl .swiper-slide{ padding: 0 5px; font-size: 16px; }
.swiper-home-asl .swiper-slide .year{ line-height:30px;  padding-bottom:15px; position: relative;}
.swiper-home-asl .swiper-slide .year:after{ content: ""; position: absolute; bottom: 0; left:50%; height: 2px; width: 30px; margin-left: -25px; background: #3f8fd3;}
.swiper-home-asl .swiper-slide .year span{ margin-right: 4px; display: inline-block; font-size: 30px; font-weight:bold;}
.swiper-home-asl .swiper-slide .con{ margin: 22px auto 0; max-width: 260px; line-height: 24px; min-height: 72px; opacity: .7;}

@media (max-width:1460px){
	.swiper-home-asl .swiper-slide{ font-size: 14px;}
	.swiper-home-asl .swiper-slide .year span{ font-size:28px;}
	.swiper-home-asl .swiper-slide .con{ line-height: 22px; min-height: 66px;}
}
@media (max-width:1340px){
	.swiper-home-asl .swiper-slide .con{ font-size: 12px; }
}


/* ========== */
/* = HOME-NEWS = */
/* ========== */
.home-news{ margin-bottom: 50px; padding: 55px 0 90px; }
.home-news .top{ padding:0 50px ;}
.home-news .homt-tit{ float: left;}
.home-news .tab{ margin-top: 35px; float: right; line-height:50px;}
.home-news .tab span{ float: left; display: block; padding: 0 25px; position: relative; font-size: 18px; font-weight: 500; cursor: pointer;}
.home-news .tab span.active,
.home-news .tab span:hover{ color: #288fd4;}
.home-news .tab span:after{ content: ""; position: absolute; top:50%; right: 0; width: 2px; height: 18px; background: #b7b7b7; margin-top:-9px;}
.home-news .tab span:last-child:after{ display: none;}
.home-news .content{ margin-top: 25px; padding: 30px 50px 0; border-top: 1px solid #e5e5e5;}
.home-news .box{ float: left; width: 45%; max-width: 562px; position: relative; overflow: hidden;}
.home-news .box div{ position: absolute; width: 100%; bottom: 0; left:0; color:#FFFFFF; background: rgba(0,0,0,.5); padding: 20px 25px 30px;}
.home-news .box div span{ display:block; position: relative; padding-right: 80px; font-size: 18px;}
.home-news .box div span i{ position: absolute; top:50%; margin-top: -8px; right:0; width: 29px; height: 16px; background: url(../images/news_arrows.png) no-repeat;}
.home-news .box div p{ margin-top: 12px; line-height: 22px;}
.home-news .box:hover img{ transform: scale(1.05); -webkit-transform: scale(1.05);}
.home-news .js-tab-con{ display: none;}
.home-news .js-tab-con.active{ display: block;}

.home-news-ul{ float: right; width: 54%; position: relative;}
.home-news-ul:before{ content: ""; position: absolute; z-index:0; top:28px; left:40px; width: 2px; height: 100%; background: #707070;}
.home-news-ul ul{ position: relative; z-index: 1;}
.home-news-ul li{ margin-bottom: 10px;}
.home-news-ul li a{ display:block; padding:22px 15px 22px 90px; position: relative;}
.home-news-ul li a:before{ content:""; position: absolute; top:27px; left:34px; width: 14px; height: 14px; border: 2px solid #666666; background: #FFFFFF; border-radius: 100%;}
.home-news-ul li .date{ float: left; text-align: right;}
.home-news-ul li .date span{ font-size: 28px; line-height: 30px;}
.home-news-ul li .date p{ margin-top: 5px; color: #999999; padding-right: 5px;}
.home-news-ul li .intro{ margin-left: 105px;}
.home-news-ul li .intro span{ font-size: 18px; line-height: 30px; display: block;}
.home-news-ul li .intro p{ margin-top: 5px; color:#999999;}
.home-news-ul li a:hover{ background:#288fd4; color: #FFFFFF;}
.home-news-ul li a:hover:before{ border: 2px solid #FFFFFF; background: #288fd4; }
.home-news-ul li a:hover .date p{ color: #FFFFFF;}
.home-news-ul li a:hover .intro p{ color: #FFFFFF;}
.home-news-ul .more{ position: absolute; bottom: -45px; left:23px; cursor: pointer;}
.home-news-ul .more2{ display: none; }


.home-news-ul li:nth-child(1){ -webkit-transition-delay: 0.2s; transition-delay: 0.2s;}
.home-news-ul li:nth-child(2){ -webkit-transition-delay: 0.5s; transition-delay: 0.5s;}
.home-news-ul li:nth-child(3){ -webkit-transition-delay: 0.8s; transition-delay: 0.8s;}
.home-news-ul li:nth-child(4){ -webkit-transition-delay: 1.1s; transition-delay: 1.1s;}

@media (max-width:1340px){
	.home-news-ul li a{ padding: 18px 15px 18px 100px;}
}


/* ========== */
/* = HOME-DIAGNOSIS = */
/* ========== */
.home-diagnosis{ margin-bottom: 80px; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between;}
.home-diagnosis .left{ height: 500px; width: 50%; position: relative; background-image: url(../images/home_add.jpg);}
.home-diagnosis .left .con{ position: absolute; width: 90%; max-width: 580px; bottom: 0; right:0; background: #333333; padding: 0 3%;}
.home-diagnosis .left .item{ padding: 55px 5px 60px; float: left; width: 33.33333%; color: #FFFFFF; text-align: center;}
.home-diagnosis .left .item span{ font-size: 17px;}
.home-diagnosis .left .item img{ margin-top: 10px;}
.home-diagnosis .left .item p{ margin: 15px auto 0; max-width:160px; line-height: 18px; font-size: 13px; color: #eeeeee;}
.home-diagnosis .left .item a{ color: #eeeeee;}
.home-diagnosis .diagnosis-box{ width: 50%;}





.xg-zixun li{ margin-top:10px;  float: left; width: 49%; margin-right:2%; }
.xg-zixun li:nth-child(2n){ margin-right: 0; }
.xg-zixun li a{ display: block; padding: 8px 95px 5px 30px;  position: relative;}
.xg-zixun li a:after{ content: ""; position: absolute; right:40px; top:50%; margin-top:-6px; width: 17px; height: 12px; background: url(../images/ico_more.png) right no-repeat; transition: ease all .6s; -webkit-transition: ease all .6s; }
.xg-zixun li a:before{ content:""; position: absolute; left:14px; top:19px; width: 8px; height: 8px; border:2px solid #FFFFFF; border-radius: 100%;}
.xg-zixun li .tit{  font-size: 16px; line-height: 30px;  }
.xg-zixun li .tit span{ display: inline-block; margin-right: 15px;}
.xg-zixun li .des{ font-size: 12px; line-height: 30px; padding-left: 110px; color: #666;}
.xg-zixun li a:hover{ background: #2e9bfd; color: #FFFFFF;}
.xg-zixun li a:hover:after{ background: url(../images/ico_more_white.png) right no-repeat; transform:translateX(100%); -webkit-transform:translateX(100%);}
.xg-zixun li a:hover .des{ color: #fff; }




/* ========== */
/* = diagnosis = */
/* ========== */
.diagnosis{ background: #eaeaea; padding: 70px 0 180px;}
.diagnosis-theme{ margin-bottom: 50px; background: none; position: relative; text-align: center; overflow: hidden;}
.diagnosis-theme span{ display: inline-block; font-size: 32px; line-height: 40px; color: #398fd8; position: relative; }
.diagnosis-theme p{ font-size: 20px; color: #858585; line-height: 30px; }
.diagnosis-theme span:before{ content: ""; position: absolute; top:40px; right:300px; height: 1px; width: 200%; background: #9a9a9a;}
.diagnosis-theme span:after{ content:""; position: absolute; top:40px; left:300px; height: 1px; width: 200%; background: #9a9a9a;}
.diagnosis .content{ background-image: url(../images/diagnosis_bg.jpg); background-size:cover; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between;}
.diagnosis .left{ width: 72%; padding:20px 40px; font-size: 20px; color: #555555;}
.diagnosis .left .con p{ margin-bottom: 25px; position: relative;  line-height: 38px; padding-left: 170px;}
.diagnosis .left .con p span{  position:absolute; top:0; left:0; display: inline-block; width: 151px; height: 38px; line-height: 38px; background: url(../images/diagnosis_tip_span.png) no-repeat left; padding-left: 28px; font-size: 20px; color: #FFFFFF; }
.diagnosis .left .des{ padding: 27px 0; border-top: 1px solid #bcbcbc; font-size: 24px; background: url(../images/diagnosis_blue_cricle.png) no-repeat left; padding-left: 27px;}
.diagnosis .left .des span{ position: relative; font-size: 24px; color: #3b90d8; padding-right: 37px;}
.diagnosis .left .des span:after{ content: ""; width: 0; height: 0; position: absolute; top:50%; right:0; margin-top: -8px; border-left:12px solid #3b90d8; border-top:10px solid transparent;  border-bottom:10px solid transparent;}
.diagnosis .left .tip{ color: #FFFFFF; background-image: linear-gradient(90deg, #4d87e1 0, #61acf5 50%, #6ac8f1);-moz-background-image: linear-gradient(90deg, #4d87e1 0, #61acf5 50%, #6ac8f1); position:relative; padding:12px 20px 12px 52px; line-height: 30px;}
.diagnosis .left .tip:before{ content:""; position: absolute; top:50%; margin-top: -15px; left:12px; width: 30px; height: 30px;  background-image: url(../images/diagnosis_laba.png); background-size: cover;}

.diagnosis .right{ width: 28%; padding: 74px 25px; background-image: linear-gradient(90deg, #6ac8f1 0, #61acf5 50%, #4d87e1);-moz-background-image: linear-gradient(90deg, #6ac8f1 0, #61acf5 50%, #4d87e1);}
.diagnosis .right .tit{ margin-bottom: 28px; position: relative; color: #FFFFFF; font-size: 24px; padding-bottom: 22px; text-align: center;}
.diagnosis .right .tit:after{ content:""; position: absolute; bottom: 0; left:50%; width: 60px; height: 2px; background: #FFFFFF; margin-left: -30px;}
.diagnosis .right .in{ display: block; width: 100%; max-width: 310px; border: 1px solid #FFFFFF; margin:0 auto 22px; position: relative;}
.diagnosis .right .in input,
.diagnosis .right .in select{ width: 100%; padding:0; background: none; border: none; line-height: 22px; padding: 10px; color: #FFFFFF;}
.diagnosis .right .ui-multiselect{ display: block; width: 100%; padding: 0 55px 0 15px; line-height:44px; height: 44px; background:none; position: relative; z-index: 1; border: none; color: #FFFFFF;}
.diagnosis .right .in-select:after { content: "";position: absolute; z-index:0; top:8px; right: 15px; width: 30px; height: 30px; background-image: url(../images/ico_xz_down.png); background-size: cover;}
.diagnosis .right .in input::-webkit-input-placeholder, 
.diagnosis .right .in textarea::-webkit-input-placeholder { color: #FFFFFF;}
.diagnosis .right .in input:-moz-placeholder, 
.diagnosis .right .in textarea:-moz-placeholder { color: #FFFFFF;}
.diagnosis .right .in input::-moz-placeholder, 
.diagnosis .right .in textarea::-moz-placeholder { color: #FFFFFF;}
.diagnosis .right .in input:-ms-input-placeholder, 
.diagnosis .right .in textarea:-ms-input-placeholder { color: #FFFFFF;}
.diagnosis .right .button input{ margin: 0 auto; display:block;  max-width: 310px; width: 100%; line-height: 46px; background:#FFFFFF; color: #358dd8;}





/* ========== */
/* = NY-BANNER = */
/* ========== */
.ny-banner{ height: 400px; width: 100%; background-image: url(../images/xky/advantage-banner.png); position: relative;}

.ny-banner .gary{ position: absolute; bottom: 0; left:0; width:6.5%; height: 100%; background: #FFFFFF;}
.ny-banner .gary span{ position: absolute; display:block; bottom:60px; left:60px; font-size: 14px; line-height: 20px; width: 350px; text-transform: uppercase; transform:rotate(-90deg);  -webkit-transform:rotate(-90deg);  transform-origin:0 100%; -webkit-transform-origin:0 100%; letter-spacing: 3px;} 
.ny-banner .text{ float:left; max-width:60%; padding-left: 7%; padding-top:140px; color: #FFFFFF;} 
.ny-banner .text h2{ font-size: 44px; font-weight: normal;}
.ny-banner .text p{ margin-top: 42px; font-size:16px; line-height: 30px;  color#ffffff; color:rgba(255,255,255,.8);}
.ny-banner .img{ float: right;}

.about-banner{ height: 400px; width: 100%; background-image: url(../images/xky/about-banner.png); position: relative;}
.about-banner .gary{ position: absolute; bottom: 0; left:0; width:6.5%; height: 100%; background: #FFFFFF;}
.about-banner .gary span{ position: absolute; display:block; bottom:60px; left:60px; font-size: 14px; line-height: 20px; width: 350px; text-transform: uppercase; transform:rotate(-90deg);  -webkit-transform:rotate(-90deg);  transform-origin:0 100%; -webkit-transform-origin:0 100%; letter-spacing: 3px;} 
.about-banner .text{ float:left; max-width:60%; padding-left: 7%; padding-top:140px; color: #FFFFFF;} 
.about-banner .text h2{ font-size: 44px; font-weight: normal;}
.about-banner .text p{ margin-top: 42px; font-size:16px; line-height: 30px;  color#ffffff; color:rgba(255,255,255,.8);}
.about-banner .img{ float: right;}







@media (max-width:1460px){
	.ny-banner .text{ max-width: 55%;}
}
@media (max-width:1300px){
	.ny-banner .text{ max-width: 50%;}
}



.ny-tit{ text-align: center; font-weight: lighter; font-size: 26px; color: #000000;}
.ny-tit span{ color: #288fd4;}

.ny-tab{ padding: 30px 0 60px; border-bottom: 1px solid #e5e5e5; text-align: center;  }
.ny-tab a{ margin: 0 50px; display: inline-block; line-height:38px; font-size: 16px; color: #333333; position: relative;}
.ny-tab a:after{ content: ""; position: absolute; bottom: 0; left:0; width: 0%; height: 1px; background: #288fd4; transition: all ease .4s; -webkit-transition: all ease .4s;}
.ny-tab a.active,
.ny-tab a:hover{ color: #288fd4;}
.ny-tab a.active:after,
.ny-tab a:hover:after{ width: 100%;}

.page{ text-align: center;}
.page a,
.page span{ margin: 0 2px; display: inline-block; height: 30px; line-height: 30px; min-width: 30px; padding: 0 3px; text-align: center; background: #f4f4f4; color: #999999;} 
.page a:hover,
.page a.current,
.page span.current{ background: #288fd4; color: #FFFFFF;}


.media-tit{ padding-bottom:22px; font-size: 24px; color: #333333; position: relative; text-align: center; }
.media-tit:after{ content: ""; position: absolute; bottom: 0; left:50%; margin-left: -15px; width: 30px; height:2px; background: #288fd4; color:#333333;}
.media-tit p{ margin-top: 10px; font-size: 14px; color:#666666;}



.about-more{ display: inline-block; line-height: 50px; background: #288fd4; padding: 0 32px; text-align: center; color: #FFFFFF;}
.about-more i{ display: inline-block; margin-right: 14px; vertical-align: middle; width: 22px; height: 22px; background: url(../images/ico_about_more.png);}
.about-more span{ display: inline-block; vertical-align: middle; font-size: 16px; color: #FFFFFF;}
.about-more:hover{ background: #0079ca;}
.about-more:hover i{ transform: translateX(7px); -webkit-transform: translateX(7px); }




/* ========== */
/* = WEBCASE = */
/* ========== */
.webcase{ margin: 30px auto; padding: 75px 50px; background: #FFFFFF;}
.webcase .web-list{ margin: 15px 0 60px;}
.webcase .web-list li{ margin-top: 30px;}


/* ========== */
/* = WEBCASE-DETAIL = */
/* ========== */
.webcase-detail{ margin: 30px auto; background: #eaeaea;}
.webcase-detail-left{ float: left; width: 58%; max-width: 800px; background:#FFFFFF;}
.webcase-intro{ position:relative; top:auto; left:auto; float: right; width: 40%; padding: 40px 50px 60px; background:#FFFFFF;}
.webcase-intro.fx{ position: fixed; top:134px; z-index:9; }
.webcase-intro.fxb{ position: fixed; top:auto; bottom:330px; z-index:9; }

.webcase-intro .title{ padding-right: 70px; font-size: 30px; color: #333333; position: relative;}
.webcase-intro .title i{ font-style: normal; font-size: 16px; color: #999999;}
.webcase-intro .text{ margin-top: 15px; letter-spacing:4px;}
.webcase-intro .des{ margin-top: 38px; max-width: 420px; color: #999999; line-height: 30px; font-style: italic;}
.webcase-intro .bt{ margin-top: 38px;}
.webcase-intro .bt a{ float: left; width: 42%; margin-right:8%; text-align: center; display: inline-block; line-height: 44px; background: #288fd4; border: 1px solid #288fd4; color: #FFFFFF;}
.webcase-intro .bt a i{ font-style: normal; padding-left: 38px; display: inline-block; background: url(../images/ico_eye.png) no-repeat left;}
.webcase-intro .bt a:nth-child(2) i{ background: url(../images/ico_contact.png) no-repeat left;}
.webcase-intro .bt a:hover{ background:#FFFFFF; color: #288fd4;}
.webcase-intro .bt a:hover i{  background: url(../images/ico_eyeh.png) no-repeat left;}
.webcase-intro .bt a:nth-child(2):hover i{ background: url(../images/ico_contacth.png) no-repeat left;}
.webcase-intro .list-tit{ margin-top: 35px; font-size: 20px;}
.webcase-intro .list li{ margin-top: 22px; float: left; width: 46%; margin-right:8%;}
.webcase-intro .list li:nth-child(2n){ margin-right: 0;}
.webcase-intro .list li a{ display: block;}
.webcase-intro .list li .img{ overflow: hidden;}
.webcase-intro .list li .intro{ margin-top: 10px; position: relative; padding-right: 55px;}
.webcase-intro .list li .intro span{ letter-spacing: 1px; color: #333333;}
.webcase-intro .list li .intro em{ font-style: normal; color: #999999; font-size: 12px;} 
.webcase-intro .list li .intro:after{ content: ""; position: absolute; right:10px; top:50%; margin-top: -6px; width: 21px; height: 12px; background: url(../images/ico_more.png) right no-repeat; -webkit-transition: all ease .4s; transition: all ease .4s;}
.webcase-intro .list li a:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1);}
.webcase-intro .list li a:hover .intro span{ color: #288fd4;}
.webcase-intro .list li a:hover .intro:after{ transform: translateX(10px); -webkit-transform: translateX(10px); background: url(../images/ico_moreh.png) right no-repeat;}
.return{ position: absolute; top:0; right:0; display: inline-block; width: 37px; height: 37px; background: url(../images/ico_return.png) #288fd4;}
.return:hover{ background: url(../images/ico_return.png)  #0079ca; }


/* ========== */
/* = WECHAT-LIST = */
/* ========== */
.webcase .wechat-list{ margin:35px -14px 60px;}
.wechat-list li{ float:left; width: 33.3333333%; padding: 14px;}
.wechat-list li:nth-child(3n+1){ clear: both;}
.wechat-list .item{ padding:35px; -o-box-shadow:0 0 30px rgba(0,0,0,.08); -ms-box-shadow:0 0 30px rgba(0,0,0,.08); -moz-box-shadow:0 0 30px rgba(0,0,0,.08); -webkit-box-shadow:0 0 30px rgba(0,0,0,.08); box-shadow:0 0 30px rgba(0,0,0,.08);}
.wechat-list .item .img{ float: left; width:45%; }
.wechat-list .item .img div{ width: 135px; height: 268px; padding: 22px 5px 0; background-image: url(../images/wechat_phone.png); background-size: cover;}
.wechat-list .item .text{ margin-left:5%; float: left; width:50%;}
.wechat-list .item .tit{ padding-bottom: 15px; border-bottom: 1px solid #ededed; padding-top:25px; position: relative;}
.wechat-list .item .tit:after{ content: ""; position: absolute; bottom: 0; left:0; width:30px; height: 2px; background: #057dcb;}
.wechat-list .item .tit span{ display:inline-block; font-size: 18px; color: #202020;}
.wechat-list .item .tit p{ margin-top: 5px; font-size: 15px; color: #aaaaaa;}
.wechat-list .item .erweima{ margin-top: 20px; max-width: 110px; text-align: center;}
.wechat-list .item .erweima div{ -o-box-shadow:0 0 30px rgba(0,0,0,.15); -ms-box-shadow:0 0 30px rgba(0,0,0,.15); -moz-box-shadow:0 0 30px rgba(0,0,0,.15); -webkit-box-shadow:0 0 30px rgba(0,0,0,.15); box-shadow:0 0 30px rgba(0,0,0,.15);}
.wechat-list .item .erweima p{ margin-top: 15px; color: #aaaaaa;}
.wechat-list li:nth-child(3n-2){ -webkit-transition-delay: 0.3s; transition-delay: 0.3s;}
.wechat-list li:nth-child(3n-1){ -webkit-transition-delay: 0.6s; transition-delay: 0.6s;}
.wechat-list li:nth-child(3n){ -webkit-transition-delay: 0.9s; transition-delay: 0.9s;}

@media (max-width:1420px) {
	.wechat-list .item{ padding: 25px;}
	.wechat-list .item .img{ width:55%;}
	.wechat-list .item .text{ max-width:40%;}
	.wechat-list .item .tit span{ font-size: 16px;}
}



/* ========== */
/* = MARKET = */
/* ========== */
.market{ margin: 30px 0; padding: 60px 7% 65px; background: #FFFFFF;}
.market .market-list{ margin-top: 50px; padding: 15px 0 60px; border-top:1px solid #ededed;}
.market-list li{ margin-top: 40px; float: left; width: 48%; margin-right:4%;}
.market-list li:nth-child(2n){ margin-right: 0;}
.market-list li:nth-child(1),
.market-list li:nth-child(2){ margin-bottom: 20px; }
.market-list li a{ position: relative; display: block; box-shadow:0 0 20px rgba(206,206,206,.3); -webkit-box-shadow:0 0 20px rgba(206,206,206,.3); }
.market-list li a:before{ z-index: 1; content: ""; position: absolute; bottom: 0; left:0; width: 0; height: 2px; background: #288fd4; transition: ease all .6s; -webkit-transition: ease all .6s;}
.market-list li .img{ float:left; position: relative; width: 171px;  height: 200px; border-right: 1px solid #f0f0f0;}
.market-list li .img img{ position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; max-height: 100%; max-width: 100%; }
.market-list li .intro{  margin-left: 171px; padding: 25px 25px 0;}
.market-list li .intro>span{ padding-bottom: 13px; display: block;  font-size: 20px; color: #333333; position: relative;}
.market-list li .intro>span:after{ content:""; position: absolute; bottom:0; left:0; width: 30px; height: 1px; background:#333333;}
.market-list li .intro p{ margin: 12px 0 18px; line-height: 28px; height: 56px; color: #999999; overflow: hidden;}
.market-list li .intro div{ line-height:40px; position: relative;}
.market-list li .intro div i{ font-style:normal; font-size: 12px;}
.market-list li .intro div em{ position: absolute; right:0; top:50%; margin-top: -6px; width: 21px; height: 12px; background: url(../images/ico_more.png) right no-repeat;}
.market-list li a:hover:before{ width: 100%;}
.market-list li a:hover .intro div i{ color: #288fd4;}
.market-list li a:hover .intro div em{ transform:translateX(-10px); -webkit-transform: translateX(-10px); width:36px; background: url(../images/ico_moreh.png) right no-repeat;}
.market-list li:nth-child(2n-1){ -webkit-transition-delay: 0.3s; transition-delay: 0.3s;}
.market-list li:nth-child(2n){ -webkit-transition-delay: 0.6s; transition-delay: 0.6s;}
.market-more{ margin: 0 auto; display: block; line-height:44px; width: 194px; cursor: pointer;}
.market-more i{ width: 23px; height: 23px; background: url(../images/home_more_white.png);}



.market-list .li-logo{ margin-top: 20px; float: left; width: 20%; padding: 0 10px; margin-right: 0;}
.market-list .li-logo a{ padding-bottom: 54%; position: relative;}
.market-list .li-logo a:hover:before{ width: 0%;}


.market-logo{ margin: 30px 0 50px; padding: 55px 7% 80px; background: #FFFFFF;}
.market-logo .market-logo-box{ margin-top: 40px;}
.market-logo-box{ margin-top: 60px; border: 1px solid #e5e5e5; border-top: none;}
.market-logo-box li{ float: left; width: 20%; border-right: 1px solid #e5e5e5; border-top: 1px solid #e5e5e5; overflow: hidden;}
.market-logo-box li:nth-child(5n){ border-right: none;}
.market-logo-box li a{ display: block; padding-bottom: 50%; position: relative;     -webkit-box-shadow: 0 0 0 rgba(206,206,206,0); box-shadow: 0 0 0 rgba(206,206,206,0);}
.market-logo-box li img{  position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; max-height: 90%; max-width: 90%;transition: ease all .4s; -webkit-transition: ease all .4s;}
.market-logo-box li:hover img{transform: scale(1.1); -webkit-transform: scale(1.1);}
.market-logo-box li .more{ padding:12% 0 0 15%;}
.market-logo-box li .more p{ font-size: 18px; color: #333333;}
.market-logo-box li .more span{ margin-top:7%; width: 90px; font-size: 12px; display: inline-block; position: relative;}
.market-logo-box li .more span i{ position: absolute; margin-top: -6px; top:50%; left:70px; width: 20px; height: 12px; background: url(../images/ico_moreh.png) right no-repeat;}
.market-logo-box li .more:hover span i{ width: 36px;}


/* ========== */
/* = MARKET-DETAIL = */
/* ========== */
.market-detail{ margin:20px 0; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between; background: #FFFFFF;}
.market-detail .left{ width: 40%;}
.market-detail .right{ width: 60%; padding:30px 5%;}
.market-detail .title{ padding-bottom: 20px; border-bottom: 1px dashed #e7e7e7;}
.market-detail .title img{ display: inline-block; vertical-align: middle;}
.market-detail .title h1{ display: inline-block; vertical-align:middle; font-size: 32px; color: #333333; font-weight: bold;}
.market-detail .title h1 span{ margin-left: 20px; font-size: 16px; color: #666666; letter-spacing:5px; font-weight: normal; }
.market-detail .title a{ margin-top: 35px; float: right; color: #288fd4;}
.market-detail .detail{ margin-top: 20px; max-width: 665px; position:relative;}
.market-detail .detail .return{ top:auto; bottom: 0;}
.market-detail .detail .tit{ margin-top:25px; font-size: 20px; color: #333333;}
.market-detail .detail .des{ margin-top: 12px; color: #999999; line-height: 30px;}
.market-detail .detail .des span{ color: #288fd4;}
.market-detail .detail .des i{ font-style: normal; color: #333333;}
.market-detail .detail .p-tip{ position: relative; padding-left: 70px;}
.market-detail .detail .p-tip span{ position: absolute; top:0; left:0; }

.revelant-market{ margin-bottom: 80px; padding: 60px 7% 65px; background:#FFFFFF;}
.revelant-market .theme{ text-align: center; font-size: 28px; color: #333333;}
.revelant-market ul{ margin-bottom: 50px;}


/* ========== */
/* = ABOUT = */
/* ========== */
.about-tit{ padding-bottom: 20px; letter-spacing: 1px; position: relative; color: #333333; font-size: 26px;}
.about-tit span{ color: #666666;}
.about-tit:after{ content: ""; position: absolute; bottom:0; left:0; width: 32px; height: 2px; background: #000000;} 

.about-box{ margin: 20px 0; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between; background: #FFFFFF;}
.about-box .img{ width: 45%; max-width: 620px;}
.about-box .right{ width: 55%; padding:  20px 5%;}
.about-box .tip{ margin-top: 15px; color:#333333; font-size: 16px;}
.about-box .des{  margin-top: 10px; line-height: 30px; color: #999999;}
.about-box .text{ margin-top: 30px; text-align: center;}
.about-box .text .item{ float: left; width:25%; text-align: center;}
.about-box .text .item span{ display: inline-block; position: relative; font-weight:lighter; font-size: 50px; line-height:50px; letter-spacing: -1px;}
.about-box .text .item b{ display:inline-block;  font-weight: lighter;}
.about-box .text .item span i{ position: absolute; top:-12px; right:-15px; font-style: normal; font-size: 22px;}
.about-box .text .item:nth-child(1) span i{ font-size: 14px;}
.about-box .text .item p{ margin-top: 5px; font-size: 16px;}

.about-brand{ margin: 20px 0; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between; background: #FFFFFF;}
.about-brand ul{ width: 70%; padding: 0 5%;}
.about-brand ul li{ padding:25px 5px; float: left; width: 33.33333%; text-align: center;}
.about-brand ul li p{ margin: 15px auto 0; max-width: 190px; font-size: 16px; line-height: 24px;}
.about-brand .box{ width: 30%;  padding: 87px 5% 100px; background-image: url(../images/about_img2.jpg); color: #FFFFFF;}
.about-brand .box .about-tit{ color:#FFFFFF;}
.about-brand .box .about-tit:after{ background: #bfc4c9;} 
.about-brand .box .tip{ font-size: 16px; margin-top: 15px;}
.about-brand .box .about-more{ margin-top: 85px;}

.about-honor{ margin: 20px 0; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between; background: #FFFFFF;}
.about-honor .img{ width: 64%;}
.about-honor .text{ width: 36%; padding: 20px 6%;}
.about-honor .text .tip{ margin-top: 20px; font-size: 16px; color: #333333;}
.about-honor .text .des{ margin-top: 15px; line-height: 30px; color: #999999;}

.about-customer{ margin: 20px 0 80px; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between; background: #FFFFFF;}
.about-customer .box{ padding: 65px 2% 65px 5%; width: 30%; background: #f6f6f6;}
.about-customer .box .tip{ margin-top: 20px; font-size: 16px;}
.about-customer .box .des div{ margin-top: 50px; margin-right: 45px; float: left; }
.about-customer .box .des div:last-child{ margin-right: 0;}
.about-customer .box .des div p{ font-size: 16px; margin-bottom: 15px;}
.about-customer .box .about-more{ margin-top: 50px;}
.about-customer ul{ width: 70%; padding: 0 2%;}
.about-customer ul li{ float: left; width: 20%; }
.about-customer ul li a{ display: block; position: relative; padding-bottom: 50%; }
.about-customer ul li a img{position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; max-height: 80%; max-width: 80%; }

@media (max-width:1480px) {
	.about-tit{ font-size: 22px;}
	
	.about-box .right{ padding: 20px 4%;}
	.about-box .text .item p{ font-size: 14px;}
	.about-brand ul{ width: 65%;}
	.about-brand .box{ width: 35%;}
	.about-brand .about-more{ padding: 0 25px;}
	
	.about-customer .box{ padding-left:40px;}
}
@media (max-width:1280px) {
	.about-box .des{ font-size: 13px; line-height: 24px;}	
	.about-honor .text .des{ font-size: 13px; line-height: 24px;}
	.about-customer .box .des div{ margin-right: 20px;}
}


/* ========== */
/* = NEWS = */
/* ========== */
.news{ margin: 30px 0; padding: 65px 7% 90px; background: #FFFFFF;}
.news .ny-tab{ padding-bottom: 50px;}
.news .ny-tab a{ font-size: 20px; }
.news-list{ margin-bottom:60px;}
.news-list li{ padding: 30px 0; border-bottom: 1px solid #ebebeb;}
.news-list li a{ display: block;}
.news-list li .img{ float: left; overflow: hidden; width: 310px;}
.news-list li .text{ margin-left:350px;}
.news-list li .text .tit{ font-size: 18px; line-height: 46px;}
.news-list li .text p{ line-height: 26px; height: 52px; overflow: hidden; color: #999999;}
.news-list li .text .more{ margin-top: 30px;}
.news-list li .text .more i{ float: left; font-style:normal;}
.news-list li .text .more span{ float: right; display: inline-block; padding-right: 40px; color: #3a9bf1; position: relative;}
.news-list li .text .more span:after{ content: ""; position: absolute; top:50%; right:0; margin-top: -6px; width: 24px; height:12px; background: url(../images/ico_moreh.png) right no-repeat;}
.news-list li a:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1);}
.news-list li a:hover .text .tit{ color: #288fd4;}
.news-list li a:hover .text .more span{ transform:translateX(-20px); -webkit-transform:translateX(-20px);}

.revelant-news{ margin-bottom: 50px; padding: 40px 7% 65px; background: #FFFFFF;}
.revelant-news .theme{text-align: center; font-size: 28px; color: #333333;}
.revelant-news ul{ margin-top: 20px;}
.revelant-news li{ margin-top: 15px; float: left; width: 48.5%; margin-right:3%;}
.revelant-news li:nth-child(2n){ margin-right: 0;}
.revelant-news li a{ display: block;  padding: 35px 40px; -webkit-box-shadow:0 0 20px rgba(206,206,206,.3); box-shadow:0 0 20px rgba(206,206,206,.3); position:relative;}
.revelant-news li p{ font-size: 16px;}
.revelant-news li span{ margin-top: 20px; display: block;}
.revelant-news li i{ position: absolute; bottom:40px; right:45px; width:24px; height:12px; background:url(../images/ico_moreh.png) right no-repeat;}
.revelant-news li a:hover{ background: #288fd4; color: #FFFFFF;}
.revelant-news li a:hover i{background:url(../images/ico_more_white.png) right no-repeat; transform:translateX(-100%); -webkit-transform:translateX(-100%);}


/* ========== */
/* = NEWS-DETAIl = */
/* ========== */
.news-left{ float: left; margin: 30px 0 55px; width: 71%;}
.news-detail{ margin-bottom: 30px; background: #FFFFFF;  padding: 50px 65px 70px;}
.news-detail .title{ max-width: 826px; margin: 0 auto; padding-bottom: 40px; font-size: 20px; color: #444444; line-height: 32px; border-bottom:1px solid #d2d2d2; text-align: center;}
.article-come{ line-height:26px; margin-top:25px; text-align: center;}
.article-come i{ font-style: normal; vertical-align: middle;}
.article-come span{ margin:0 20px; padding-left: 28px; display: inline-block; vertical-align: middle; position: relative;}
.article-come .bdsharebuttonbox{ display:inline-block; vertical-align: middle;}
.article-come .span-date{ background: url(../images/ico_time.jpg) no-repeat left;}
.article-come .span-art{ background: url(../images/ico_art.jpg) no-repeat left;}
.article-come .span-share{ background: url(../images/ico_share.jpg) no-repeat left;}
.news-article{ margin-top: 15px; padding:55px 0; border-top: 1px solid #eeeeee; line-height: 30px; color: #999999;}
.news-detail .detail{ margin-top:40px; line-height: 30px;}
.news-detail .detail p{ margin-bottom: 30px; }

.news-lable{ margin-top: 50px; position: relative; min-height: 37px; padding-right: 100px;}
.news-lable .lable{ float: left; color:#333333;}
.news-lable .lable span{ display: inline-block; vertical-align: middle;}
.news-lable .lable a{ margin-left: 10px; font-size: 13px; display: inline-block; vertical-align: middle; border: 1px solid #888; color:#333333; padding:5px 20px;}
.news-lable .lable a:hover{ color: #288fd4; border: 1px solid #288fd4;}

.diagnosis-link-img{ margin-bottom:30px; }
.diagnosis-link-img img{ width: 100%; }

.flip{ margin-top:40px;}
.flip a{ max-width:48%; line-height:30px;}
.flip .prev{ float: left; padding-left:30px; background: url(../images/flip_prev.png) left no-repeat;}
.flip .next{ float: right; padding-right:30px;  background: url(../images/flip_next.png) right no-repeat;}
.flip a:hover{ color: #288fd4;}
.flip .prev:hover{ background: url(../images/flip_prevh.png) left no-repeat;}
.flip .next:hover{ background: url(../images/flip_nexth.png) right no-repeat;}

.interest-box{ margin-top: 30px; padding: 40px 20px; background:#FFFFFF;}
.interest-box .box{ float: left; width: 50%;}
.interest-box .box .tit{ margin-bottom: 10px; font-size: 16px; color: #555555; padding-left: 30px;}
.interest-box .box .tit span{ padding-bottom: 10px; display: block; border-bottom: 1px solid #d1d1d1;}
.interest-box .box li a{ margin-top:5px; display: block; padding: 0 95px 0 30px; line-height: 26px; height: 26px; font-size: 12px; position: relative;}
.interest-box .box li a:after{ content: ""; position: absolute; right:40px; top:50%; margin-top:-6px; width: 17px; height: 12px; background: url(../images/ico_more.png) right no-repeat; transition: ease all .6s; -webkit-transition: ease all .6s; }
.interest-box .box li a:before{ content:""; position: absolute; left:14px; top:50%; margin-top: -4px;  width: 8px; height: 8px; border:2px solid #FFFFFF; border-radius: 100%;}
.interest-box .box li a span{ display: inline-block; margin-right: 15px;}
.interest-box .box li a:hover{ background: #2e9bfd; color: #FFFFFF;}
.interest-box .box li a:hover:after{ background: url(../images/ico_more_white.png) right no-repeat; transform:translateX(100%); -webkit-transform:translateX(100%);}

.news-right{ float: right; margin: 30px 0 55px; width: 27%;}
.news-right-box{ background: #FFFFFF; padding: 50px 15px 55px;}
.news-right-box .theme{text-align: center; font-size: 20px; color: #333333;}
.news-right-box ul{ margin-top: 20px;}
.news-right-box li{ margin-top: 12px;}
.news-right-box li a{ display: block; padding: 30px 20px; font-size: 12px; -webkit-box-shadow:0 0 20px rgba(206,206,206,.3); box-shadow:0 0 20px rgba(206,206,206,.3); position:relative;}
.news-right-box li span{ margin-top: 15px; display: block;}
.news-right-box li i{ position: absolute; bottom:25px; right:25px; width:20px; height:12px; background:url(../images/ico_moreh.png) right no-repeat;}
.news-right-box li a:hover{ background: #288fd4; color: #FFFFFF;}
.news-right-box li a:hover i{background:url(../images/ico_more_white.png) right no-repeat; transform:translateX(-100%); -webkit-transform:translateX(-100%);}


/* ========== */
/* = CONTACT = */
/* ========== */
.contact{ margin: 30px 0; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between; background: #FFFFFF;}
.contact .left{ padding: 95px 5% 110px; width: 37.8%; background-image: url(../images/contact_bg.jpg); color: #FFFFFF;}
.contact .left img{ margin: 0;}
.contact .left .tit{ margin-top: 60px; font-size: 18px; color: #e2e2e2;}
.contact .left p{  margin-top: 10px; max-width: 360px; font-size: 20px; line-height: 30px; }
.contact .left p a{ color: #FFFFFF;}
.contact .diagnosis-box{ width: 62.2%; padding:30px 8%;}
.contact .diagnosis-box .theme{  margin-bottom: 85px;}
.contact .diagnosis-box .p1{ margin-top: 35px;}
.contact .diagnosis-box .button{ margin-top:12%;}



/* ========== */
/* = OPINION = */
/* ========== */
.opinion-cover{ margin: 30px 0; background: #FFFFFF; text-align: center;}
.opinion-cover .box{  padding: 50px 5% 80px; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between; background: #FFFFFF;}
.opinion-cover .box .text{ width:56%; }
.opinion-cover .box .con{display: flex; flex-flow: wrap; align-items:flex-start; justify-content: space-between; }
.opinion-cover .box .con div{ width: 31%; margin-top: 42px;}
.opinion-cover .box .con div span{ font-size: 25px; font-weight: bold; color: #288fd4; display: block;}
.opinion-cover .box .con div p{ margin-top: 25px; font-size: 16px; line-height: 34px;}
.opinion-cover .box .con div p i{ font-style: normal; color: #288fd4; font-weight: bold; font-size: 20px;}
.opinion-cover .box .img{ width:38%;}
.opinion-cover .bg{ padding: 50px 5% 60px; background: #f7f6f7; }
.opinion-cover ul{ margin: 0 -12px;}
.opinion-cover li{ float: left; width: 20%; padding: 0 12px;}
.opinion-cover .item{  background: #FFFFFF; text-align: center; padding: 40px 10px; position: relative;}
.opinion-cover .item .ico{ display: inline-block; width: 53px; height: 53px; position: relative; z-index: 1; background: #248cd6; border-radius: 100%; overflow: hidden;}
.opinion-cover .item .ico .hover{ position: absolute; top:0; left:0; opacity: 0; transform:rotateY(180deg); -webkit-transform:rotateY(180deg);}
.opinion-cover .item span{ margin: 18px auto 0; padding-bottom: 18px; max-width: 150px; display: block; font-size: 16px; color: #333; border-bottom: 1px solid #cacacf;}
.opinion-cover .item p{ margin-top: 20px; display: block; font-size: 14px; line-height:32px; min-height:96px;}
.opinion-cover .item:hover .ico{ background: #FFFFFF;}
.opinion-cover .item:hover .ico .default{ opacity:0; transform:rotateY(-180deg); -webkit-transform:rotateY(-180deg);}
.opinion-cover .item:hover .ico .hover{ opacity:1; transform:rotateY(0deg); -webkit-transform:rotateY(0deg);}
.opinion-cover .item:hover{ background: #248cd6; color: #FFFFFF;}
.opinion-cover .item:hover span{ color: #FFFFFF;  border-bottom: 1px solid #FFFFFF;}

.opinion-cover .about-more{ margin-top: 50px; font-size: 16px;}
.opinion-cover .about-more i{ background-image: url(../images/ico_heart.png);}


.opinion-data{ margin: 30px 0; padding: 60px 7% 70px; background: #FFFFFF; text-align: center;}
.opinion-data .content{ margin: 40px auto 55px; max-width: 322px; position: relative;}
.opinion-data .line{ position: absolute; font-size: 16px; line-height: 22px;}
.opinion-data .line i{ display: inline-block; vertical-align: middle; width: 8px; height: 8px; background: #248cd6; border-radius: 100%; -webkit-animation: imageAnimation 2s linear infinite 0s; animation: imageAnimation 2s linear infinite 0s}
.opinion-data .line span{ display: inline-block; vertical-align: middle; margin:0 10px;}
.opinion-data .line-01{ right:275px; top:-5px; width:308px; height: 54px; background: url(../images/line_01.png) bottom no-repeat; text-align: left;}
.opinion-data .line-02{ right:322px; top:114px; width:350px; height: 58px; background: url(../images/line_02.png) bottom no-repeat; text-align: left;}
.opinion-data .line-03{ right:270px; top:275px; width:395px; height: 42px; background: url(../images/line_03.png) bottom no-repeat; text-align: left;}
.opinion-data .line-04{ text-align: right; left:275px; top:-5px; width:308px; height: 54px; background: url(../images/line_04.png) bottom no-repeat; text-align: right;}
.opinion-data .line-05{ text-align: right; left:322px; top:114px; width:350px; height: 58px; background: url(../images/line_05.png) bottom no-repeat; text-align: right;}
.opinion-data .line-06{ text-align: right; left:270px; top:275px; width:310px; height: 42px; background: url(../images/line_06.png) bottom no-repeat; text-align: right;}
.opinion-data .about-more{ font-size: 16px;}
.opinion-data .about-more i{ background-image: url(../images/ico_data.png);}

@-webkit-keyframes imageAnimation {
	0% {
		-webkit-transform: scale(1);
		transform: scale(1);
	}
	8% {
		-webkit-transform: scale(1.1);
		transform: scale(1.1);
	}
	25% {
		-webkit-transform: scale(1.5);
		transform: scale(1.5);
	}
	100% {
		-webkit-transform: scale(1);
		transform: scale(1);
	}
}
@keyframes imageAnimation {
	0% {
		-webkit-transform: scale(1);
		transform: scale(1);
	}
	8% {
		-webkit-transform: scale(1.1);
		transform: scale(1.1);
	}
	25% {
		-webkit-transform: scale(1.5);
		transform: scale(1.5);
	}
	100% {
		-webkit-transform: scale(1);
		transform: scale(1);
	}
}

.opinion-system{ margin: 30px 0;  padding: 60px 0 70px; background:#FFFFFF;}
.opinion-system .content{ margin-top: 35px;  display: flex; flex-flow: wrap; align-items: center; justify-content: space-between; background: #fbfafa; padding: 0 5%; }
.opinion-system .content .text{ width: 50%; padding: 20px 0; text-align: center;}
.opinion-system .content .text .con{ max-width: 540px; display: inline-block; text-align: left;}
.opinion-system .content .text h2{ font-weight: bold; font-size: 20px; color: #288fd4;}
.opinion-system .content .text li{ margin-top: 50px; float: left; width: 48%; margin-right:4%;}
.opinion-system .content .text li:nth-child(2n){ margin-right: 0;}
.opinion-system .content .text li img{ float: left;}
.opinion-system .content .text li p{ margin-left:80px; font-size: 16px; line-height: 60px;}
.opinion-system .content .img{ width: 50%;}
.opinion-system .box { padding: 0 5%; text-align: center; max-width: 1180px; margin:0 auto;}
.opinion-system .box li{ margin-top:60px; padding-left: 38px; float: left; width:48%; margin-right:4%; text-align:left; font-size: 16px; position: relative;}
.opinion-system .box li:nth-child(2n){ margin-right: 0;}
.opinion-system .box li:nth-child(2n+1){  clear: both;}
.opinion-system .box li:before{ content: ""; position: absolute; top:50%; left:0; width: 4px; height:4px; background: #61626b; border-radius: 100%;}
.opinion-system .box li span{ color: #288fd4; font-size: 20px;}
.opinion-system .about-more{ margin-top: 70px; font-size: 16px; padding: 0 50px;}
.opinion-system .about-more i{ background-image: url(../images/ico_heart.png);}


.opinion-inter{ padding: 60px 0 75px; background-image: url(../images/opinion_inter.jpg); background-size: cover; text-align: center;}
.opinion-inter ul{ padding:50px 60px;}
.opinion-inter li{ float: left; width: 33.33333%;}
.opinion-inter li .ico{ display: inline-block; width: 76px; height:76px; position: relative; z-index: 1;  border-radius: 100%; overflow: hidden;}
.opinion-inter li .ico .hover{ position: absolute; top:0; left:0; opacity: 0; transform:rotateY(180deg); -webkit-transform:rotateY(180deg);}
.opinion-inter li span{ display: block; margin-top: 30px; font-size: 18px; color: #333333;}
.opinion-inter li p{ margin: 15px auto 0; max-width: 300px; font-size: 16px; line-height: 26px;}
.opinion-inter li:hover .ico .default{ opacity:0; transform:rotateY(-180deg); -webkit-transform:rotateY(-180deg);}
.opinion-inter li:hover .ico .hover{ opacity:1; transform:rotateY(0deg); -webkit-transform:rotateY(0deg);}
.opinion-inter .about-more{ font-size: 16px;}
.opinion-inter .about-more i{ width: 24px; height:24px; background-image: url(../images/ico_zx.png);}




/* ========== */
/* = DATA = */
/* ========== */
.data-box{ margin: 30px 0; background:#FFFFFF; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between; background: #FFFFFF; }
.data-box .img{ width: 56%;}
.data-box .text{ width: 44%; padding:20px 10px 20px 6%;}
.data-box .text .tit{ font-size: 24px; color: #333333; line-height: 60px;}
.data-box .about-more{ margin-top:12%; padding: 0 50px; font-size: 16px; line-height: 38px; font-size: 12px;}
.data-box .about-more i{ width: 24px; height: 24px; background-image: url(../images/ico_light.png);}

.data-system{ margin: 30px 0; padding: 26px 50px 26px 0; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between; background: #FFFFFF;text-align: center; }
.data-system .text{ padding:0 5%; width: 60%;}
.data-system .des{  margin-top:4%; position: relative; font-size: 16px; line-height: 24px; color:#666;}
.data-system li{ margin-top: 5%; float: left; width: 25%; text-align: center;}
.data-system li p{ margin-top: 15px; font-size: 16px; line-height: 24px; color: #999999;}
.data-system .img{ width: 40%;}

.data-advantage{ margin: 30px 0; background:#FFFFFF; padding-top: 30px;}
.data-advantage .theme{ font-size: 24px; text-align: center; padding-bottom: 30px;  border-bottom: 1px solid #eaeaea;}
.data-advantage ul{ overflow: hidden;}
.data-advantage li{ float: left;  width: 33.33333%; padding: 50px 5% 6%;}
.data-advantage li:nth-child(2n){ background: #fbfafa;}
.data-advantage li img{ margin: 0;}
.data-advantage li span{ display: block; margin-top: 40px; font-size: 24px;}
.data-advantage li p{ margin-top: 10%; font-size: 18px; color: #999999;}
.data-advantage li:hover img{ animation:bounce 1s; -webkit-align-content: animation:bounce 1s;}

.data-advantage  .item-list ul { display: flex;flex-wrap: wrap; justify-content: space-between;}
.data-advantage  .item-list li {  float: left;  width: 50%; padding:20px 5% 6%; }
.data-advantage  .item-list li:nth-child(2n){background:none;}
.data-advantage  .item-list li span{ display: block; margin-top: 40px; font-size: 16px;}
.data-advantage  .item-list li p{ margin-top: 10%; font-size: 14px; color: #999999;}
   

/* ========== */
/* = MEDIA = */
/* ========== */
.media-box{ margin: 30px 0; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between; background: #FFFFFF;}
.media-box .left{ width: 45%; max-width: 620px;}
.media-box .right{ width: 55%; padding:20px 3%;}
.media-box .right ul{ margin-top: 55px;}
.media-box .right li{ float: left; width: 25%; text-align: center;}
.media-box .right li p{ margin-top: 30px; font-size: 16px; line-height: 22px;}

.media-cover{ margin: 30px 0; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between; background: #FFFFFF;}
.media-cover .left{ width:44%; padding:20px 3%;}
.media-cover .left ul{ margin-top: 30px;}
.media-cover .left li{ width: 33.333333%; float: left; padding:10px 0;}
.media-cover .right{ width:56%; max-width:780px;}

.logo-customer{  margin: 30px 0 50px; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between; background: #FFFFFF; overflow: hidden; text-align: center;}
.logo-customer ul{ margin-top: -1px; width: 100%;}
.logo-customer li{  float: left; width:16.6666667%;border-right: 1px solid #d7d7d7; border-top: 1px solid #d7d7d7;}
.logo-customer li:nth-child(6n){ border-right: none;}
.logo-customer li a{ display:block;  padding-bottom:100%; position: relative; }
.logo-customer li a img{ position: absolute; top: 0; left: 0; right: 0; bottom: 0; margin: auto; max-height: 90%; max-width: 90%;}
.logo-customer li .more{ padding:40px 5px 0;}
.logo-customer li .more span{ margin-top:50px; display: inline-block; padding:0 25px; background: #298fd4; color: #FFFFFF; height: 34px; line-height: 34px; font-size: 16px;  position: relative;}
.logo-customer li .more span i{  margin-left: 15px; display: inline-block; vertical-align: middle; width: 20px; height: 12px; margin-top: -6px; background:url(../images/ico_more_white.png) right no-repeat;}
.logo-customer li .more:hover span i{ transform:translateX(-10px); -webkit-transform:translateX(-10px);}

@media (max-width:1260px) {
	.media-tit{ font-size:20px;}
	.media-box .right ul{ margin-top: 40px;}
	.media-box .right li p{ margin-top: 15px; font-size: 14px; line-height: 22px;}
	.media-cover .left ul{ margin-top:10px;}
}





/* ========== */
/* = SEM = */
/* ========== */
.sem-box{ position: relative; z-index: 1; height: 220px; padding-left: 285px;}
.sem-box .titbox{ position: absolute; top:-30px; left:0; width: 285px; height: 250px; background: #FFFFFF; padding-top: 55px; text-align: center; }
.sem-box .titbox .about-more{ margin-top: 65px; padding: 0 30px; line-height: 34px; }
.sem-box .titbox .about-more i{ width: 24px; height: 24px; background:url(../images/ico_zx2.png);}
.sem-box li{ float: left; padding-left:2%; width: 25%;}
.sem-box .item{ height: 220px; padding-top: 55px; background:#FFFFFF; text-align: center; position: relative;}
.sem-box .item p{ margin-top: 17px; line-height: 26px; color: #333333;}

.sem-analysis{ margin: 30px auto; background: #FFFFFF; overflow: hidden;}
.sem-analysis .top{ padding: 35px 0; -webkit-box-shadow:0 0 35px rgba(206,206,206,.4); box-shadow:0 0 35px rgba(206,206,206,.4);}
.sem-analysis .content{ padding:50px 6% 55px 3%; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between;}
.sem-analysis .img{ width: 53%;}
.sem-analysis .text{ width: 47%; text-align: center;}
.sem-analysis li{ margin-top: 30px; float:left; width:25%;}
.sem-analysis li p{ font-size: 16px; margin-top:10px; color:#333333;}
.sem-analysis .about-more{ margin-top:60px;}
.sem-analysis .about-more i{ background: url(../images/ico_sanjiao.png);}

.sem-monitor{ margin: 30px 0; padding:60px 4% 75px; background: #FFFFFF;}
.sem-monitor .content{ margin-top: 50px; border-top: 1px solid #f3f2f2;}
.sem-monitor .box{ display: flex; flex-flow: wrap; align-items: center; justify-content: space-between;}
.sem-monitor .box .img{ width: 50%;}
.sem-monitor .box .text{ width:50%; text-align: center;}
.sem-monitor .box ul { padding: 55px 5% 0;}
.sem-monitor .box li{ float: left; width: 16.666666%;}
.sem-monitor .box li p{ margin-top: 15px; font-size: 16px;}
.sem-monitor .box:nth-child(2n) li{ width: 20%;} 

.sem-advantage{ margin: 30px 0; background: #FFFFFF; padding:60px 5% 65px; text-align: center;}
.sem-advantage .content{ margin: 55px 0; position: relative; overflow: hidden;}
.sem-advantage .cricle{ position: absolute; top:50%; left:50%; margin-top: -125px; width:250px; height: 250px; margin-left: -125px;}
.sem-advantage .cricle span{ position: absolute; z-index: 1; top:50%; left:50%; width:62px; height: 62px; margin-top: -31px; padding-top: 25px; margin-left: -31px; text-align: center; font-size: 16px; color: #FFFFFF; line-height:18px;}
.sem-advantage .cricle:after{ content: ""; position: absolute; z-index: 0; top:0; left:0; width: 250px; height: 250px; background: url(../images/sem/sem_cricle.png);  animation: progress360 3s linear infinite;  -webkit-animation: progress360 3s linear infinite;}
.sem-advantage .text{ float: left; width:32%; text-align: right;}
.sem-advantage .text div{ margin-top:70px; position: relative; min-height: 60px; padding-right: 80px; line-height: 30px;}
.sem-advantage .text div:first-child{ margin-top: 0;}
.sem-advantage .text div i{ position: absolute; top:0; right:0; width: 60px; height: 60px;}
.sem-advantage .text div .ico-01{ background-image:url(../images/sem/adv_01.png);}
.sem-advantage .text div .ico-02{ background-image:url(../images/sem/adv_02.png);}
.sem-advantage .text div .ico-03{ background-image:url(../images/sem/adv_03.png);}
.sem-advantage .text div .ico-04{ background-image:url(../images/sem/adv_04.png);}
.sem-advantage .text div .ico-05{ background-image:url(../images/sem/adv_05.png);}
.sem-advantage .text div .ico-06{ background-image:url(../images/sem/adv_06.png);}
.sem-advantage .text div span{ font-size: 16px; color: #000000;}
.sem-advantage .text2{ float: right; text-align:left;}
.sem-advantage .text2 div{ padding-right: 0; padding-left: 80px; }
.sem-advantage .text2 div i{ right: auto; left:0; }
.sem-advantage .about-more{ margin-top:55px; font-size: 16px;}
.sem-advantage .about-more i{ background: url(../images/ico_heart.png);}


/* ========== */
/* = SEO = */
/* ========== */
/* ========== */
/* = SEO = */
/* ========== */
.seo-box{ padding: 25px 0 30px; background: #FFFFFF;}
.seo-box li{ float: left; width: 23.125%; margin-right:2.5%; background: #FFFFFF; padding:30px 20px 38px;}
.seo-box li:nth-child(4n){ margin-right: 0;}
.seo-box li p{ margin: 15px auto 0; max-width: 210px; padding-top: 30px; position: relative; color: #333333; font-size: 18px; line-height: 34px; text-align: center;}
.seo-box li p:before{ content: ""; position: absolute; top:0; left:50%; margin-left: -15px; width:30px; height: 1px; background:#288fd4;}


.seo-strategy{ margin: 30px 0; background: #FFFFFF; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between; padding: 5% 7%;}
.seo-strategy .img{ width: 50%;}
.seo-text{ width: 48%;}
.seo-text .tit{ font-size: 24px; color: #333333;}
.seo-text .tit span{ color: #298fd4;}
.seo-text .con{ margin-top: 40px; line-height: 40px; font-size: 18px;}
.seo-text .con p{ margin-top: 20px; position: relative; padding-left: 65px;}
.seo-text .con p:before{ content: ""; position: absolute; top:0; left:0; width:40px; height: 40px; background-size: cover;}
.seo-text .con p:nth-child(1):before{ background-image: url(../images/seo/ico_strategy_01.png);}
.seo-text .con p:nth-child(2):before{ background-image: url(../images/seo/ico_strategy_02.png);}
.seo-text .con p:nth-child(3):before{ background-image: url(../images/seo/ico_strategy_03.png);}
.seo-text .con p:nth-child(4):before{ background-image: url(../images/seo/ico_optimization_02.png);}
.seo-text .con p:nth-child(5):before{ background-image: url(../images/seo/ico_seo_02.png);}
.seo-text .con p:nth-child(6):before{ background-image: url(../images/seo/ico_seo_01.png);}
.seo-text .con span{font-size: 14px; color: #999; margin:20px 0px 0px 65px; float:left; line-height: 20px;}


.seo-text a{ margin-top:45px; display: inline-block; padding: 0 55px 0 85px; background: url(../images/seo/more_01.png) 44px 6px no-repeat #288fd4; color: #FFFFFF; line-height: 38px;}
.seo-text a:hover{ background-color: #187ec3;}

.seo-accurate{ margin: 30px 0; background: #FFFFFF; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between; padding: 5% 4%;}
.seo-accurate .seo-text{ width:42%;}
.seo-accurate .seo-text .con p:nth-child(1):before{ background-image: url(../images/seo/accurate_01.png);}
.seo-accurate .seo-text .con p:nth-child(2):before{ background-image: url(../images/seo/accurate_02.png);}
.seo-accurate .seo-text .con p:nth-child(3):before{ background-image: url(../images/seo/accurate_03.png);}
.seo-accurate .seo-text a{ background-image: url(../images/ico_zx.png);}
.seo-accurate .img{ width:58%; max-width: 610px; position: relative;}
.seo-accurate .img p{ position:absolute; z-index: 1;}
.seo-accurate .img p img{ display: inline-block; vertical-align: middle;}
.seo-accurate .img p span{ display: inline-block; vertical-align: middle; line-height: 30px;}
.seo-accurate .img p:nth-child(1){ left:57px; top:0; text-align: right;}
.seo-accurate .img p:nth-child(2){ left:-5px; top:140px; }
.seo-accurate .img p:nth-child(3){ left:50px; bottom:15px;text-align: right;}
.seo-accurate .img p:nth-child(4){ right:40px; top:30px;}
.seo-accurate .img p:nth-child(5){ right:45px; bottom:40px;}
.seo-accurate .itembox {position: absolute;top: 34px; left: 61px;width: 488px;}
    
   
    


.seo-ability{ margin: 30px 0; background: #FFFFFF; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between; padding: 5% 2% 5% 7%;}
.seo-ability .img{ width: 55%;}
.seo-ability .seo-text{ width:45%; max-width:500px;}
.seo-ability .seo-text a{ background-image: url(../images/ico_zx.png);}

.seo-optimization{ margin: 30px 0; background: #FFFFFF; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between; padding: 5% 2%;}
.seo-optimization .img{ width:56%;}
.seo-optimization .seo-text{ width: 43%;}
.seo-optimization .seo-text .con p:nth-child(1):before{ background-image: url(../images/seo/ico_optimization_01.png);}
.seo-optimization .seo-text .con p:nth-child(2):before{ background-image: url(../images/seo/ico_optimization_02.png);}
.seo-optimization .seo-text .con p:nth-child(3):before{ background-image: url(../images/seo/ico_optimization_03.png);}


.seo-team{ margin: 30px 0; background: #FFFFFF; padding: 45px 5% 75px;}
.seo-team .content{ width: 880px; margin: 45px auto 0; position: relative;}
.seo-team .content ul{ position: absolute; top:0; left:0; width: 100%;}
.seo-team .content li{ margin:16px 0; float:left;  text-align: right; width:250px; line-height:40px; color: #333333; font-size: 16px; padding-right:42px; position: relative;}
.seo-team .content li:before{ content: ""; position: absolute; top:50%; right: 0; width:4px; height: 4px; background: #187ec3; border-radius: 100%;}
.seo-team .content li:nth-child(2n){ float:right; text-align: left; padding-right: 0; padding-left: 42px;}
.seo-team .content li:nth-child(2n):before{ left:0; right:auto;}
.seo-team .content li:nth-child(2n+1){ clear: both;}
.seo-team .content li img{ margin: 0 15px; display: inline-block; vertical-align: middle;}
.seo-team .content li span{ display: inline-block; vertical-align: middle;}

.seo-case { padding:50px 0; background: #FFFFFF;}
.seo-case .theme{ font-size: 26px; color: #333333; text-align: center; border-bottom: 1px solid #E5E5E5; padding-bottom: 45px;}
.seo-case .theme span{ color: #288fd4;}
.seo-case .tab { margin-top: 45px; text-align: center;}
.seo-case .tab span{ display: inline-block; margin: 0 60px; width: 135px; border: 1px solid #298fd4; color: #298fd4; line-height: 30px; cursor: pointer;}
.seo-case .tab span.active{ background: #298fd4; color: #FFFFFF;}
.seo-case .js-tab-box{ padding: 0 7%;}
.seo-case .js-tab-con{ display: none;}
.seo-case .js-tab-con.active{ display: block;}
.seo-case .market-list{ padding-bottom: 40px; border-bottom: 2px dashed #e5e5e5;}
.seo-case .market-logo-box { margin: 40px 7% 0; }


.seo-bottom-box{  margin: 30px 0; background: #FFFFFF; padding:55px 4%;}
.seo-bottom-box li{ margin-top: 35px; float: left; width: 25%; padding: 0 23px;}
.seo-bottom-box li a{ display: block; padding: 50px 20px 50px 30px;}
.seo-bottom-box li img{ margin: 0;}
.seo-bottom-box li span{ margin-top: 20px; font-weight: bold; display: block; font-size: 16px; color: #298fd4;}
.seo-bottom-box li p{ margin-top: 22px; line-height: 24px; color: #999999;}
.seo-bottom-box li i{ margin-top: 30px; display: inline-block; width: 122px; line-height: 30px; background: #288fd4; color: #FFFFFF; text-align: center; font-style:normal;}
.seo-bottom-box li:hover img{ animation: 1s tada; -webkit-animation: 1s tada;}



/* ========== */
/* = EPR = */
/* ========== */
.epr-three{ margin: 30px 0; background: #FFFFFF; padding: 20px 30px 20px 0; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between;}
.epr-three .img{ width:38%;}
.epr-three .text{ width: 62%;}
.epr-three ul{ margin-top: 30px; padding: 0 5%;}
.epr-three li{ float: left;width:33.33333%; padding: 0 2%;}
.epr-three .item{ text-align: center; position: relative;}
.epr-three .box{ height: 220px; background: #FFFFFF; cursor: pointer; padding:25px 0;}
.epr-three .box span{ margin-top:12px; display: block; font-size: 18px; color:#333333;}
.epr-three .box .tip{ margin-top:12px; font-size: 16px; color: #999999;}
.epr-three .box i{ margin-top: 20px; display: inline-block; width: 23px; height: 23px; background: url(../images/jia.png) no-repeat;}
.epr-three .des{ opacity:0; transform:rotateY(-180deg); -webkit-transform:rotateY(-180deg); position: absolute; top:0; left:0; width: 100%; padding:0 20px; line-height:26px; background:#FFFFFF; height: 100%; -webkit-box-shadow:0 0 25px rgba(206,206,206,.4); box-shadow:0 0 25px rgba(206,206,206,.4);}
.epr-three .des div{ display: inline-block; width: 100%; vertical-align: middle;}
.epr-three .des i{ display: inline-block; vertical-align: middle; height: 100%;}
.epr-three .des p{ margin:20px 0;}
.epr-three .item:hover .box {opacity: 0; transform:rotateY(-180deg); -webkit-transform:rotateY(-180deg); }
.epr-three .item:hover .des{ opacity:1; transform:rotateY(0deg); -webkit-transform:rotateY(0deg);}


.epr-box{ margin: 30px 0; padding: 45px 7% 55px; background: #FFFFFF;}
.epr-box .content{ margin-top: 55px;}
.epr-box .box{ margin-top: 15px; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between;}
.epr-box .box .img{ width: 50%;}
.epr-box .box .text{ width: 50%; padding-right: 5%; padding-left:5%;}
.epr-box .box .text span{ padding-bottom: 30px; display: block; font-size: 22px; position: relative;}
.epr-box .box .text span:after{ content:""; position: absolute; bottom: 0; left:0; width: 35px; height: 1px; background: #666666;}
.epr-box .box .text p{ margin-top: 5%; font-size: 16px; color: #999999; line-height: 34px;}
.epr-box .box:nth-child(2n) .text{  padding-right: 12%; padding-left:5%;}

.epr-feature .box{ clear: both; height: 262px; background:url(../images/epr/epr_img.jpg) no-repeat right #0b2138; padding:45px 0 0 50px;}
.epr-feature .box .tit{ display:block; padding-bottom: 30px; position: relative; color: #FFFFFF; font-size: 28px; letter-spacing:12px;}
.epr-feature .box .tit:after{ width: 27px; height: 2px; background: #FFFFFF; content: ""; position: absolute; bottom: 0; left:0;}
.epr-feature .box .about-more{ margin-top:50px; line-height:38px; padding: 0 50px;}
.epr-feature .box .about-more i{ width: 24px; height: 24px; background: url(../images/ico_zx.png);}
.epr-feature ul{ background: #FFFFFF; overflow: hidden;}
.epr-feature li{ float: left; width:25%; padding:4%;}
.epr-feature li:nth-child(2n){ background: #fbfafa;}
.epr-feature li img{ margin:0;}
.epr-feature li span{ margin-top: 30px; display:block; font-size: 18px; }
.epr-feature li p{ margin-top: 30px; font-size: 12px; color: #999999; line-height:22px; min-height: 88px;}
.epr-feature li:hover img{ animation:bounce 1s; -webkit-transform: bounce 1s;}


.epr-support{ margin: 30px 0; background: #FFFFFF; padding:35px 0 55px 6%;}
.epr-support .content{ margin-top: 35px; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between;}
.epr-support .img{ width: 42%;}
.epr-support ul{ width: 58%; text-align: center;}
.epr-support ul li{ margin: 30px 0; display: inline-block; width:32%;}
.epr-support ul li p{ margin-top: 15px; font-size: 18px;}


.epr-advantage{ margin: 30px 0; background:#FFFFFF; padding:40px 15px;}
.epr-advantage li{ float: left; padding: 25px 15px; margin:40px 0.5% 0; width: 13.2857%; text-align: center; -webkit-box-shadow:0 0 25px rgba(206,206,206,.4); box-shadow:0 0 25px rgba(206,206,206,.4); }
.epr-advantage li span{ margin:18px auto 0; max-width: 120px; display:block; padding-bottom: 12px; border-bottom: 1px solid #e8e8e8; color: #333333;}
.epr-advantage li p{ margin-top: 12px; line-height:24px; min-height: 72px; font-size: 12px; color: #999999; overflow: hidden;}



/* ========== */
/* = RTB = */
/* ========== */
.rtb-box{ position: relative; z-index: 1; height: 255px; padding-left: 220px;}
.rtb-box .titbox{ position: absolute; top:-30px; left:0; width: 220px; height: 250px; background: #FFFFFF; padding-top: 55px; text-align: center; }
.rtb-box .titbox span{ display: block; padding-bottom: 30px; font-size: 24px; color: #333333; position: relative;}
.rtb-box .titbox span:after{ content: ""; position: absolute; bottom:0; left:50%; width: 18px; height: 1px; margin-left: -9px; background: #288fd4;}
.rtb-box .titbox a{ margin-top: 65px; padding: 0 32px; display: inline-block; background: #288fd4; color: #FFFFFF; text-align: center; line-height: 34px; }
.rtb-box .titbox i{ display: inline-block; vertical-align: middle; margin-right: 5px; width: 24px; height: 24px; background:url(../images/ico_zx.png);}
.rtb-box .titbox a:hover i{ transform: translateX(-10px); -webkit-transform: translateX(-10px); }
.rtb-box li{ float: left; padding-left: 15px; width: 20%;}
.rtb-box .item{ padding: 40px 0; background: #FFFFFF; height: 220px; text-align: center; position: relative; cursor: pointer; }
.rtb-box .item span{ display: block; font-size: 18px; color: #333; position: relative; padding-bottom: 20px;}
.rtb-box .item span:after{ content: "" ; position: absolute; bottom: 0; margin-left:-10px; width: 20px; left:50%; background: #288fd4; height: 1px;}
.rtb-box .item p{ margin-top: 20px; line-height: 20px; color: #999;}


.rtb-advantange .box{ clear: both; height: 262px; background:url(../images/rbt_img.jpg) no-repeat right #0c1137; padding:45px 0 0 50px;}
.rtb-advantange .box .tit{ display:block; padding-bottom: 30px; position: relative; color: #FFFFFF; font-size: 28px;}
.rtb-advantange .box .tit:after{ width: 27px; height: 2px; background: #FFFFFF; content: ""; position: absolute; bottom: 0; left:0;}
.rtb-advantange .box p{ margin-top:40px; font-size: 16px; color: #bbbbbb;}
.rtb-advantange ul{ background: #FFFFFF; overflow: hidden;}
.rtb-advantange li{ float: left; width:33.33333%; padding: 5% 6% 8%;}
.rtb-advantange li:nth-child(2n){ background: #fbfafa;}
.rtb-advantange li img{ margin:0;}
.rtb-advantange li span{ margin-top: 40px; display:block; font-size: 24px; }
.rtb-advantange li p{ margin-top: 40px; font-size: 16px; color: #999999; line-height: 40px;}
.rtb-advantange li:hover img{ animation:bounce 1s; -webkit-transform: bounce 1s;}

.rtb-platform{ margin: 30px 0; padding: 60px 7% 35px; background: #FFFFFF;  display: flex; flex-flow: wrap; align-items: center; justify-content: space-between;}
.rtb-platform .text{ width:48%; }
.rtb-platform .tit{ padding-bottom: 30px; position: relative; font-size: 24px; color: #333333;}
.rtb-platform .tit:after{ content: ""; position: absolute; bottom:0; left:0; width: 78px; height: 1px; background: #288fd4;}
.rtb-platform .des{ margin-top: 50px;}
.rtb-platform .des p{ margin-bottom:32px; position: relative; line-height: 30px; padding-left: 70px; font-size: 16px;}
.rtb-platform .des p:last-child{ margin-bottom: 0;}
.rtb-platform .des p:before{ content:""; position: absolute; top:-2px; left:0; width: 35px; height: 35px;}
.rtb-platform .des p:nth-child(1):before{ background-image: url(../images/platform_ico_01.png);}
.rtb-platform .des p:nth-child(2):before{ background-image: url(../images/platform_ico_02.png);}
.rtb-platform .des p:nth-child(3):before{ background-image: url(../images/platform_ico_03.png);}
.rtb-platform .img{ width: 50%;  max-width: 610px;}




/* ========== */
/* = WEB = */
/* ========== */
.web-box{position: relative;}
.web-box li{ float: left; width: 23.5%; margin-right:2%;}
.web-box li:nth-child(4n){ margin-right: 0;}
.web-box .titbox{ margin-top: -45px; height: 315px; background: #FFFFFF; padding-top:65px; text-align: center; }
.web-box .titbox span{ display: block; padding-bottom:30px; font-size: 26px; color: #333333; position: relative;}
.web-box .titbox span:after{ content: ""; position: absolute; bottom:0; left:50%; width: 18px; height: 1px; margin-left: -9px; background: #288fd4;}
.web-box .titbox a{ margin-top:75px; padding: 0 40px; display: inline-block; background: #288fd4; color: #FFFFFF; text-align: center; line-height: 34px; }
.web-box .titbox i{ display: inline-block; vertical-align: middle; margin-right: 10px; width: 24px; height: 24px; background:url(../images/ico_zx.png);}
.web-box .titbox a:hover i{ transform: translateX(-10px); -webkit-transform: translateX(-10px); }
.web-box .item{ padding:32px 14% 0; background: #FFFFFF; height: 270px; text-align: center; position: relative; cursor: pointer; }
.web-box .item span{ margin-top:20px; display: block; padding-bottom: 20px; font-size: 20px; position: relative;}
.web-box .item span:after{ content: ""; position: absolute; bottom: 0; left:50%; margin-left: -14px; width:28px; height: 2px; background: #288fd4;}
.web-box .item p{ margin-top:20px; font-size: 16px; color: #999999; line-height: 34px; }

.web-service{ margin: 30px 0; padding: 45px 7%; background: #FFFFFF;}
.web-service .theme{ padding-bottom: 35px; font-size: 26px; position: relative; color: #333333; text-align: center;}
.web-service .theme:after{ content: ""; position: absolute; bottom:0; left:50%; margin-left:-13px; width: 26px; height: 2px; background: #288fd4;}
.web-service .box{ margin-top: 25px; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between;}
.web-service .box:first-child{ margin-top: 50px;}
.web-service .box .img{ width:50%; max-width: 600px; position: relative;}
.web-service .box .img .tip{ position: absolute; bottom: 0; left:0; width: 100%; background: rgba(0,0,0,.6); color: #FFFFFF; padding: 15px; text-align: center;}
.web-service .box .img .tip i{ font-style: normal; margin: 0 20px;}
.web-service .box .img .tip2{ padding: 0; font-size: 12px; letter-spacing: -1px;}
.web-service .box .img .tip2 div{ float: left; text-align: left;}
.web-service .box .img .tip2 div{ width:55%; padding:20px 0 20px 10px;}
.web-service .box .img .tip2 div:nth-child(2){ width: 45%; border-left: 1px solid rgba(255,255,255,.3);}
.web-service .box .img .tip2 div span{ font-size: 14px; display: block; margin-bottom:8px;}
.web-service .box .text{ width: 50%; padding:20px 2%; text-align: center;}
.web-service .box .tit{ padding-bottom: 35px; font-size: 20px; position: relative; color: #333333; text-align: center;}
.web-service .box .tit:after{ content: ""; position: absolute; bottom:0; left:50%; margin-left:-13px; width: 26px; height: 2px; background: #288fd4;}
.web-service .box li{ margin-top: 40px; float: left; width: 25%; padding: 0 10px;}
.web-service .box li p{ margin-top: 20px; font-size: 16px; color: #333333;}
.web-service .box .des{ margin: 7% auto 0; max-width: 450px; font-size: 18px; line-height: 40px; color: #333333; letter-spacing: 2px;}
.web-service .box .des span{ color: #298fd4;}
.web-service .box .more{ margin-top:7%; padding: 0 40px; display: inline-block; background: #288fd4; color: #FFFFFF; text-align: center; line-height: 34px; }
.web-service .box .more i{ display: inline-block; vertical-align: middle; margin-right: 10px; width: 24px; height: 24px; background:url(../images/ico_zx.png);}
.web-service .box .more a:hover i{ transform: translateX(-10px); -webkit-transform: translateX(-10px); }

@media (max-width:1420px) {
	.web-service .box .img .tip{ font-size: 12px;}
	.web-service .box .img .tip i{ margin: 0 10px;}
}

.web-advantange{ margin:30px 0;}
.web-advantange .box{ clear: both; height: 262px; background:url(../images/web_img.jpg) no-repeat right #090b17; padding:45px 0 0 50px;}
.web-advantange .box .tit{ display:block; padding-bottom: 30px; position: relative; color: #FFFFFF; font-size: 28px;}
.web-advantange .box .tit:after{ width: 27px; height: 2px; background: #FFFFFF; content: ""; position: absolute; bottom: 0; left:0;}
.web-advantange .box p{ margin-top:40px; font-size: 16px; color: #bbbbbb;}
.web-advantange ul{ background: #FFFFFF; overflow: hidden;}
.web-advantange li{ float: left; width:25%; padding:36px 4% 10px;}
.web-advantange li:nth-child(8n-1),
.web-advantange li:nth-child(8n-3),
.web-advantange li:nth-child(8n-4),
.web-advantange li:nth-child(8n-6){ background: #fbfafa;}
.web-advantange li span{ display: block; font-size: 24px; font-weight: bold;}
.web-advantange li p{ margin-top: 25px; line-height: 24px; min-height: 96px; overflow: hidden; color: #999999;}

.web-process{ margin:30px 0; padding: 35px 0 50px; background: #FFFFFF;}
.web-process .theme{ padding-bottom: 25px; font-size: 24px; position: relative; color: #333333; text-align: center;}
.web-process .theme:after{ content: ""; position: absolute; bottom:0; left:50%; margin-left:-13px; width: 26px; height: 2px; background: #288fd4;}
.web-process ul{ margin-top: 70px; height: 320px;}
.web-process li{ float: left; width: 20%; text-align: center; padding: 0 28px; position: relative;}
.web-process li:after{ content: ""; position: absolute; top:135px; right:-8px; width: 15px; height: 15px; background: url(../images/ico_process_jt.png);}
.web-process li:last-child:after{ display: none;}
.web-process li .item{ padding:30px; height: 280px; position: relative;}
.web-process li .item:after{ content: ""; position: absolute; top:0; left:0; width: 100%; height: 0; transition: all ease .6s; -webkit-transition: all ease .6s; background: #288fd4;}
.web-process li .item span{ position: relative; z-index: 1; display: inline-block; width: 50px; height: 50px; line-height:50px; border-radius: 100%; background-image: url(../images/blue_cricle.png); color: #FFFFFF;}
.web-process li .item .tit{ padding:18px 0 11px; font-size: 16px; font-weight:bold;}
.web-process li .item .des{ border-top:2px solid #dadada; max-width: 137px; margin: 0 auto; padding-top: 32px; line-height: 20px; color: #999999;}
.web-process li .item a{ position: absolute; bottom: -17px; left:50%; margin-left: -50px; display:block; width: 100px; line-height: 32px; border:1px solid #288fd4; border-radius: 17px; background: #FFFFFF; color: #288fd4; font-size: 13px;}
.web-process li .item:hover{ margin-top: -35px; height: 355px; padding-top: 55px;}
.web-process li .item:hover:after{ height: 85px;}
.web-process li .item:hover span{ background: #FFFFFF; color: #288fd4;}
.web-process li .item:hover .tit{ padding-bottom: 25px;}
.web-process li .item:hover .des{ line-height: 30px;}
.web-process li .item:hover a{ background: #288fd4; color: #FFFFFF;}

.web-after{ margin:30px 0; background: #FFFFFF; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between;}
.web-after .left{ width: 50%; padding: 20px 6%;}
.web-after .left h2{ margin-bottom: 30px; padding-bottom: 25px; font-size: 24px; color: #333333; position: relative;}
.web-after .left h2:after{ content: ""; position: absolute; bottom: 0; left:0; height: 1px; width: 53px; background: #cccccc;}
.web-after .left p{ margin-bottom: 25px; position: relative; padding-left: 65px; color: #999999; background: url(../images/ico_sj.png) no-repeat 30px 10px; line-height: 32px;}
.web-after .left p span{ font-size: 16px; color: #666666; margin-right:7%;}
.web-after .right{  width: 50%;}

@media (max-width:1500px) {
	.web-after .left{ padding: 20px 4%;}
	.web-after .left h2{ margin-bottom:20px;}
	.web-after .left p{ margin-bottom: 10px;}
}



/* ========== */
/* = INTEGRATION = */
/* ========== */
.integration-box{ position: relative; z-index: 1; height: 220px; padding-left: 285px;}
.integration-box .titbox{ position: absolute; top:-30px; left:0; width: 285px; height: 250px; background: #FFFFFF; padding-top: 55px; text-align: center; }
.integration-box .titbox span{ display: block; padding-bottom: 35px; font-size: 24px; color: #333333; position: relative;}
.integration-box .titbox span:after{ content: ""; position: absolute; bottom:0; left:50%; width: 40px; height: 1px; margin-left: -20px; background: #288fd4;}
.integration-box .titbox a{ margin-top: 65px; padding: 0 55px; display: inline-block; background: #288fd4; color: #FFFFFF; text-align: center; line-height: 34px; }
.integration-box .titbox i{ display: inline-block; vertical-align: middle; margin-right: 5px; width: 24px; height: 24px; background:url(../images/ico_zx2.png);}
.integration-box .titbox a:hover i{ transform: translateX(-10px); -webkit-transform: translateX(-10px); }
.integration-box li{ float: left; padding-left:2%; width: 25%;}
.integration-box .item{ height: 220px; padding-top:35px; background:#FFFFFF; text-align: center; position: relative;}
.integration-box .item span{ margin-top: 10px; display: block; padding-bottom:20px; font-size: 16px; position: relative;}
.integration-box .item span:after{ content: ""; margin-left: -11px; position: absolute; bottom: 0; left:50%; width: 23px; height: 2px; background: #288fd4;}
.integration-box .item p{ margin-top:10px; line-height: 26px; color: #999999; font-size: 12px;}


.integration-product{ margin:30px 0; background:#FFFFFF; padding: 50px 20px 60px;}
.integration-product .box{ float: left; width: 25%; padding: 0 20px; text-align: center; position: relative;}
.integration-product .box .cricle{ margin: 0 auto; display:block; background: #288fd4; border-radius: 100%; padding: 10px; width: 110px; height: 110px; text-align: center;}
.integration-product .box .cricle span{display: block; width: 90px; line-height: 90px; height: 90px; border-radius: 100%; background: #288fd4; border: 1px solid rgba(255,255,255,.3);  font-size: 16px; color: #FFFFFF;}
.integration-product .box i{ margin: 10px 0; display:inline-block; width: 15px; height: 15px; background: url(../images/ico_process_jt2.png) no-repeat;}
.integration-product .item{ border:1px solid #f3f3f3; min-height: 365px; padding:50px 25px 0 35px; text-align: left; position: relative;}
.integration-product .item:after{ position: absolute; right:-30px; top:50%; margin-top: -9px; content: ""; display:inline-block; width: 15px; height: 15px; background: url(../images/ico_process_jt.png) no-repeat;}
.integration-product .item li{ margin-bottom:42px; position: relative; padding-left:65px; min-height: 65px;}
.integration-product .item li:last-child{ margin-bottom: 0;}
.integration-product .item li img{ position: absolute; top:3px; left:0;}
.integration-product .item li span{ color: #333333; font-size: 16px;}
.integration-product .item li p{ margin-top:8px; font-size: 12px; line-height:18px; color: #999999;}
.integration-product .box:last-child .item:after{ display: none;}
.integration-product .box:nth-child(3) .item,
.integration-product .box:nth-child(4) .item{ padding-top: 90px;} 
.integration-product .box:nth-child(3) .item li,
.integration-product .box:nth-child(4) .item li{ margin-bottom:60px;}

@media (max-width:1480px) {
	.integration-product .item{ padding:50px 15px 0 30px;}
	.integration-product .item li{ padding-left: 50px;}
}
@media (max-width:1340px) {
	.integration-product .item{ padding:50px 15px 0 20px;}
	.integration-product .item li{ margin-bottom: 35px;}
	.integration-product .box:nth-child(3) .item li,
	.integration-product .box:nth-child(4) .item li{ margin-bottom: 55px;}
}


.integration-process{ background-image: url(../images/integration/process.jpg);  background-position:bottom right; background-size: cover; padding: 55px 60px 20px;}
.integration-process ul{ margin: 40px auto 0; max-width: 1040px; position: relative;}
.integration-process li{ position: relative; z-index: 1; float: left;  width: 16.66666666%; text-align: center; padding: 0 5px;}
.integration-process li span{ display: inline-block; width: 60px; height: 60px; border-radius: 100%; position: relative;}
.integration-process li span img{ border-radius: 100%;}
.integration-process li span img:nth-child(1){ }
.integration-process li span img:nth-child(2){ position: absolute; top:0; left:0; background: #288fd4;opacity: 0; transform:rotateY(180deg); -webkit-transform:rotateY(180deg);}
.integration-process li p{ margin-top:10px; font-size: 15px; }
.integration-process li .des{ margin:20px auto 0; max-width:170px; font-size: 12px; color: #999999; line-height: 22px; min-height:96px;}
.integration-process li.active span img:nth-child(1){ opacity: 0; transform:rotateY(-180deg); -webkit-transform:rotateY(-180deg);}
.integration-process li.active span img:nth-child(2){ opacity: 1; transform:rotateY(0); -webkit-transform:rotateY(0);}
.integration-process li.active p{ color: #288fd4;}


.integration-team{ margin: 30px 0; background: #FFFFFF; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between; padding:50px 50px 50px 0;}
.integration-team .img{ width: 50%;}
.integration-team .text{ width: 50%; padding:0 7%;}
.integration-team .tit{ font-size: 24px; color: #333333;}
.integration-team .des{  margin-top:45px;}
.integration-team .des p{ margin-bottom: 30px; position: relative; padding-left: 30px; line-height: 26px; font-size: 16px;}
.integration-team .des p:before{ content: ""; position:absolute; top:10px; left:10px; width:8px; height: 8px; background: #288fd4; border-radius: 100%;}
.integration-team li{ padding-top: 15px; float: left; width: 33.333%; text-align: center;}
.integration-team li p{ margin-top: 10px; font-size: 16px; color: #333333;}

.integration-system{ margin: 30px 0; background: #FFFFFF; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between; padding: 30px 0 30px 35px;}
.integration-system .img{ width: 53%;}
.integration-system .text{ width:47%; padding: 0 5%;}
.integration-system li{ margin-top:32px; float: left; width: 50%; text-align: center; font-size:16px; color: #288fd4; line-height: 30px;}
.integration-system li div{ display: inline-block; min-width: 150px; padding-left:30px; text-align: left; position: relative;}
.integration-system li div:before{ content: ""; position: absolute; top:5px; left:0; display:block; width:0; height:0; border-width:8px 0 8px 8px; border-style:solid; border-color:transparent transparent transparent #419cd9;}


/* ========== */
/* = JH = */
/* ========== */
.poly-tit{ position: relative; padding-bottom: 15px; color:#333333; font-size:20px; border-bottom:2px solid #eeeeee;}
.poly-tit:before{ content:""; position: absolute; bottom:-2px; left:0; width: 25px; height: 2px; background: #288fd4;}
.poly-tit span{ display: inline-block; margin-left: 10px; color: #999; font-size: 12px; text-transform:uppercase;}

.jh-box{ background: #FFFFFF; margin:30px auto; padding:50px;}
.jh-box .leftbox{ float: left; width: 74.588%;}
.jh-box .leftbox .left{ float: left; position: relative; width: 54%;}
.jh-box .leftbox .left img{ width: 100%;}
.jh-box .leftbox .left span{ position:absolute; box-sizing: border-box; bottom:0; left:0; width: 100%; background: rgba(0,0,0,.7); color: #FFFFFF; padding: 10px; font-size: 16px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } 
.jh-box .leftbox .right{ float: right; width: 43%;}
.jh-box .leftbox .right li{ padding:8px 0; border-bottom:1px dashed #e4e4e4;}
.jh-box .leftbox .right li:last-child{ padding-bottom:0; border-bottom: none;}
.jh-box .leftbox .right li span{ display: block; font-size: 16px; color: #333333; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.jh-box .leftbox .right li p{ margin-top: 10px; line-height:18px; height: 36px; font-size: 14px; color: #999999; overflow: hidden;}
.jh-box .leftbox .right li:hover span{ color: #288fd4;}

.hot-box{ float: right; width: 22.5%;}
.hot-box .tit{ font-size: 18px; color: #ffffff; background: #333333; text-align: center; padding: 12px 0;}
.hot-box .tit span{ margin-left: 10px; color: #aaaaaa; font-size: 12px; text-transform:uppercase;}
.hot-box ul{ border-left: 1px solid #e4e4e4;  border-right: 1px solid #e4e4e4;}
.hot-box li{ padding:20px; border-bottom: 1px solid #e4e4e4; box-sizing: border-box; }
.hot-box li a{ display: block; font-size: 14px; color: #888888; background: url(../images/hot_ico.png) no-repeat left; padding-left: 20px; width: 100%; box-sizing: border-box; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; text-transform:uppercase;}
.hot-box li:hover{ background: #eeeeee;}
.hot-box li:hover a{ color: #000000;}

.jh-industry{ margin: 30px 0; background: #FFFFFF; padding: 50px;}
.jh-industry ul{ margin: 20px -15px 0;}
.jh-industry li{ float: left; padding: 15px; width: 50%; box-sizing: border-box;}
.jh-industry li a{ display: block; padding:0 38px 30px; border: 1px solid #eeeeee;}
.jh-industry li .tit{ position: relative; padding: 25px 0; padding-right:40px; border-bottom: 1px solid #e9e9e9; font-size: 16px; color: #333333;}
.jh-industry li .tit:before{ content:""; position: absolute; top:50%; margin-top: -3px; left:-12px; width:6px; height: 6px; border-radius: 3px; background: #d4d4d4;}
.jh-industry li .tit:after{ content:""; position: absolute; top:50%; right:0; margin-top:-15px; width: 30px; height: 30px; background: url(../images/poly_more.png);}
.jh-industry li span{ display: block;  overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.jh-industry li p{ margin-top: 20px; color: #999999; line-height: 22px; font-size: 14px; height: 66px; overflow:hidden;}
.jh-industry li:hover .tit:before{ background: #288fd4;}
.jh-industry li:hover .tit:after{ background: url(../images/poly_moreh.png);}

.jh-information{ margin: 30px 0; background: #FFFFFF; padding: 50px;}
.jh-information .left{ float: left; width: 74.5%;}
.jh-information li{ padding:30px 0; border-bottom: 1px dashed #e4e4e4;}
.jh-information li a{ display: block; padding-right:100px; position: relative;}
.jh-information li .dimg{ float: left;}
.jh-information li .text{ margin-left: 340px; padding-top: 10px;}
.jh-information li .text span{ font-size: 16px; color: #202020; display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.jh-information li .text p{ margin-top:20px; color: #999999; font-size: 14px; line-height: 30px; height: 90px; overflow: hidden;}
.jh-information li .date{ position: absolute; top:0; right:0; padding-left: 30px;  width:84px; height:140px;  box-sizing:border-box;border-left: 1px solid #e4e4e4;}
.jh-information li .date span{ display: block; font-size: 18px; color: #777777;}
.jh-information li .date em{ margin-top:5px; display: block; color: #cccccc; font-size: 12px; font-style: normal;}
.jh-information li .date i{ margin-top:40px; display: block; width: 31px; height: 31px; background: url(../images/xz_info_more.png);}
.jh-information li a:hover .text span{ color: #288fd4;}
.jh-information li a:hover .date i{background: url(../images/xz_info_moreh.png);}
.jh-information .getmore{ margin-top:50px; text-align: center;}
.jh-information .getmore a{ display: inline-block; padding:10px 70px; background: #288fd4; color: #FFFFFF; font-size: 16px;}

.tipbox{ float:right; width: 22.5%;}
.tipbox .tit{ font-size: 18px; color: #ffffff; background: #333333; text-align: center; padding: 12px 0;}
.tipbox .tit span{ margin-left: 10px; color: #aaaaaa;text-transform:uppercase;}
.tipbox .con{ border: 1px solid #e4e4e4; border-top: none; padding: 25px 10px 35px; text-align: center;}
.tipbox .con a{ margin: 2px; display: inline-block; border: 1px solid #298fd4; padding:5px 20px;}
.tipbox .con a:hover,
.tipbox .con a.active{ background: #333333; color: #FFFFFF; }


/* ========== */
/* = wltg = */
/* ========== */
.zt-tit{ padding: 18px 0; border-bottom: 1px solid #eeeeee; }
.zt-tit span{ display: inline-block; padding-left: 15px; font-size: 18px; color: #333333; border-left: 4px solid #288fd4;}
.wltg-box{ padding:30px 20px; background: #FFFFFF;}
.wltg-box .top-tit{ margin-bottom: 20px; background: #288fd4; line-height:60px; font-size: 20px; color: #FFFFFF; text-align: center;}
.wltg-box .con{ margin: 15px 0 30px; font-size: 0;}
.wltg-box .con a{ margin-right:7px; margin-top: 8px; padding: 0 10px; line-height: 32px; display: inline-block; background: #f1f5f8; border-radius:4px;  font-size: 12px;}
.wltg-box .con a:hover,
.wltg-box .con a.current{ background: #288fd4; color: #FFFFFF;}

.wltg-news{ margin: 30px 0px; padding:50px 7%; background: #FFFFFF; }
.wltg-news ul{ margin: 0 -35px;}
.wltg-news li{ float: left; width: 50%; padding: 0 35px; box-sizing: border-box;}
.wltg-news li .item{ padding: 35px 0; border-bottom: 1px solid #eeeeee; }
.wltg-news li .item .img{ float: left; position: relative; text-align: center;}
.wltg-news li .item .img .con{ position: absolute; top:0; left:0; width: 100%; height: 100%; color: #FFFFFF;}
.wltg-news li .item .img .con div{ display: inline-block; vertical-align: middle; width: 100%;}
.wltg-news li .item .img .con i{ display: inline-block; vertical-align: middle; height: 100%;}
.wltg-news li .item .img .con span{ font-size: 20px; font-weight: bold;}
.wltg-news li .item .img .con p{ margin-top: 5px; font-size: 12px; text-transform: uppercase;}
.wltg-news li .item .text{  margin-left: 195px;}
.wltg-news li .item .text a{ display: block; width:100%; padding-right: 80px; line-height: 26px; height: 26px;position: relative; box-sizing: border-box;}
.wltg-news li .item .text a span{ display: block; font-size: 14px; color: #333333; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; padding-left: 15px; position: relative;}
.wltg-news li .item .text a span:before{ content:""; position: absolute; top:50%; margin-top:-2px; left:0; width: 4px; height: 4px; background: #288fd4; }
.wltg-news li .item .text a em{ position: absolute; top:0; right:0; color: #aaaaaa; font-size: 12px; font-style: normal;}
.wltg-news li .item .text a:hover span{ color: #288fd4;}


.wltg-three{ padding:50px; background: #FFFFFF;}
.wltg-three .box{ float: left; width: 32%; margin-right: 2%; background: #FFFFFF; box-shadow: 0 0 25px rgba(0,0,0,.06); padding: 0 35px 40px; box-sizing: border-box;}
.wltg-three .box:nth-child(3n){ margin-right: 0;}
.wltg-three .box .zt-tit{ padding: 25px 0;}
.wltg-three .box .con{ margin-top: 30px; padding:15px 15px 30px; background: #fbfbfb;}
.wltg-three .box .con a{ display: block;}
.wltg-three .box .con .tip{ line-height:40px;}
.wltg-three .box .con .tip span{ float: left; font-size:30px; color:#333333;}
.wltg-three .box .con .tip em{ float: right; font-size: 18px; color: #999999; font-style: normal;}
.wltg-three .box .con .tit{ margin-top: 20px; font-size: 16px; line-height: 24px; color: #333333; height: 48px; overflow: hidden;}
.wltg-three .box .con .des{ margin-top: 20px; font-size: 14px; color: #999999; line-height: 24px; height: 48px; overflow: hidden;}
.wltg-three .box .con .des em{ font-style: normal; color: #288fd4;}
.wltg-three .box .con a:hover .tit{  color: #288fd4;}
.wltg-three .box ul{ margin-top: 30px;}
.wltg-three .box li{ margin-top: 5px;}
.wltg-three .box li a{ display: block; line-height: 24px; font-size:14px; color: #666666; position: relative; padding-left: 18px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap;}
.wltg-three .box li a:before{ content:""; position: absolute; left:0; top:10px; width: 4px; height: 4px;  background: #288fd4;}
.wltg-three .box li a:hover{color: #288fd4;}

.wltg-hot{ margin: 30px 0; padding:50px; background: #FFFFFF;}
.wltg-hot ul{ margin: 0 -35px;}
.wltg-hot li{ float: left; width: 50%; padding: 0 35px; box-sizing: border-box;}
.wltg-hot li a{ display: block; line-height: 56px; height: 56px; border-bottom:1px dotted #dcdcdc; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; position: relative; font-size: 14px; color: #666666;}
.wltg-hot li a:hover{ color: #288fd4;}


/* ========== */
/* = 404 = */
/* ========== */
.div404{ margin: 50px 0 80px; background: #FFFFFF; padding:50px 7% 80px;}
.div404 .text{ max-width:600px; margin: 0 auto;}
.div404 .text p{ margin-top:15px; line-height:30px;}
.div404 .text p .alink{ margin:0 10px; color: #298fd4;}


/* ========== */
/* = SITEMAP = */
/* ========== */
.sitemap{ margin: 50px 0 80px; background: #FFFFFF; padding:70px 7%;}
.sitemap .tit{ padding-bottom:20px; border-bottom: 2px solid #EEEEEE; font-size: 16px; color: #333333;}
.sitemap .tit span{ margin-right: 20px; text-transform: uppercase; font-size:26px;}
.sitemap li{ padding: 25px 0; border-bottom: 2px solid #EEEEEE; line-height: 30px;}
.sitemap li span{ display: inline-block; min-width: 120px;}
.sitemap li span a{ display: inline-block; font-size:20px; margin-right: 20px; color: #333333;}
.sitemap li span a:hover{ color: #298fd4;}
.sitemap li>a{ display:inline-block; margin:0 15px; font-size: 16px;}
.sitemap li>a:hover{ color: #298fd4;}


/* ========== */
/* = ok = */
/* ========== */
.success{ margin:50px 0 80px; padding:7% 5%; line-height: 34px; text-align: center; background: #FFFFFF; font-size: 16px;}



/* ========== */
/* = redbook = */
/* ========== */
.redbook-banner{ width: 100%; height: 400px; background-size: cover; background-image: url(../images/red/banner.jpg); background-position: center;}
.redbook-banner .text{ padding-top: 290px; max-width: 1200px; margin:0 auto; padding-left:10%;}
.redbook-banner .text a{ display: inline-block; width: 213px; height: 56px; line-height: 56px; text-align: center; background: #FFFFFF; border-radius: 5px; font-size: 26px; color: #f62d4f; font-weight: bold; position: relative;}

.ico-hand{ content: ""; position: absolute; bottom: -15px; right:0px; width: 40px; height:40px; background-image: url(../images/red/ico_hand.png); background-size:cover;}
.ico-hand{
  -webkit-animation: scales 1.5s linear infinite 0s;
  -moz-animation: scales 1.5s linear infinite 0s;
  -o-animation: scales 1.5s linear infinite 0s;
  -ms-animation: scales 1.5s linear infinite 0s;
  animation: scales 1.5s linear infinite 0s;
  -webkit-transition: all ease .4s;
  -moz-transition: all ease .4s;
  -ms-transition: all ease .4s;
  -o-transition: all ease .4s;
  transition: all ease .4s;
}
@-webkit-keyframes scales {
	0% {
		-webkit-transform: scale(1);
		transform: scale(1);
	}
	50% {
		-webkit-transform: scale(0.8);
		transform: scale(0.8);
	}
	100% {
		-webkit-transform: scale(1);
		transform: scale(1);
	}
}
@-moz-keyframes scales {
	0% {
		-moz-transform: scale(1);
		transform: scale(1);
	}
	50% {
		-moz-transform: scale(0.8);
		transform: scale(0.8);
	}
	100% {
		-moz-transform: scale(1);
		transform: scale(1);
	}
}
@-o-keyframes scales {
	0% {
		-o-transform: scale(1);
		transform: scale(1);
	}
	50% {
		-o-transform: scale(0.8);
		transform: scale(0.8);
	}
	100% {
		-o-transform: scale(1);
		transform: scale(1);
	}
}
@-ms-keyframes scales {
	0% {
		-ms-transform: scale(1);
		transform: scale(1);
	}
	50% {
		-ms-transform: scale(0.8);
		transform: scale(0.8);
	}
	100% {
		-ms-transform: scale(1);
		transform: scale(1);
	}
}
@keyframes scales {
	0% {
		transform: scale(1);
	}
	50% {
		transform: scale(0.8);
	}
	100% {
		transform: scale(1);
	}
}


.redbook-tit{ max-width: 580px; margin: 0 auto; text-align: center; font-size: 32px; color: #333333; font-weight: bold; letter-spacing: 2px; position: relative; padding-bottom: 28px; border-bottom: 1px solid #999999;}
.redbook-tit:after{ content: ""; position: absolute; bottom:-6px; margin-left: -6px; left:50%; width: 12px; height: 12px; background: #f62d4f; border-radius: 100%;}
.redbook-des{  margin-top: 25px; font-size: 20px; color: #666; text-align: center; letter-spacing: 1px;}
a.redbook-bt{ display: block; margin: 0 auto; width: 234px; height: 68px; line-height: 68px; background: #f62d4f; color: #FFFFFF; font-weight: bold; font-size: 24px; text-align: center; position: relative;} 

.redbook-box{ padding: 60px 0; text-align: center; background: #ffffff;}
.redbook-box .content{ margin-top: 55px;}
.redbook-brand{ padding: 60px 0; background: #fafafa;}
.redbook-brand li{ margin-top:50px; float: left; width: 23.5%; margin-right:2%; text-align: center;}
.redbook-brand li:nth-child(4n){ margin-right:0;}
.redbook-brand li span{ display: block; font-size:24px; color:#FFFFFF; background: #f62d4f; line-height: 70px;}
.redbook-brand li p{ border: 1px solid #afafaf; padding: 22px 30px; font-size: 20px; line-height: 30px; color: #666666;}
.redbook-market{ padding: 60px 0;  background: #ffffff;}
.redbook-market .content{ margin-top: 55px;}
.redbook-market .left{ float: left; width: 58%;}
.redbook-market .right{ float: right; width:38%;}

.redbook-flow{ padding:60px 0; background: #f9f9f9;}
.redbook-flow .con{ margin: 40px 0 60px; text-align: center;}
.redbook-exposure{ background: #FFFFFF;}

.redbook-case{ background: #f9f9f9; padding: 60px 0;}
.redbook-case .logo-div{ max-width: 1440px; margin: 60px auto 50px;}
.redbook-case .logo-div div{ float: left; width:12.5%; padding: 0 10px; box-sizing: border-box;}
.redbook-case .slick{ padding-bottom: 65px;}
.redbook-case .slick-dots{ bottom:0;}
.redbook-case .slick-dots li{ width: 16px; height: 16px; margin: 0 8px;}
.redbook-case .slick-dots li button{ width: 16px; height: 16px; border-radius: 100%; border: 1px solid #f62d4f; background: #ffffff;}
.redbook-case .slick-dots li button:before{ display: none}
.redbook-case .slick-dots li.slick-active button{background:#f62d4f;}



.pop{ display: none; position: fixed; top:0; left:0; height: 100%; width: 100%; background: rgba(0,0,0,.6); text-align: center; z-index:999;}
.pop .content+i{ display: inline-block; vertical-align: middle; height: 100%;}
.pop .content{ max-width:400px; width:85%; background: #ffffff; display: inline-block; vertical-align: middle; position: relative;}
.pop .tit{ perspective-origin: right;}
.pop .close{ position: absolute; top:15px; right:20px; display:inline-block; width: 23px; height: 23px; background:url(../images/close.png); cursor: pointer;}
.pop .con{ padding:0 40px 40px;}
.pop .in{ margin-bottom:10px;}
.pop .in input{ background: none; border: none; width: 100%; line-height:24px; padding:8px 15px; background: #e9e9e9; color:#333333;}
.pop .bt{ margin-top:20px; display: block; background: #288fd4; color: #FFFFFF;}
.pop .bt i{ display: inline-block; vertical-align: middle; width:21px; height: 21px; background:url(../images/pop_bt.png);}
.pop .bt span{ display: inline-block; vertical-align: middle; margin-left:10px; height:34px; line-height: 34px; font-size:16px;}
.pop .tip{ margin-top: 10px;}



/******XG-ZIXUN****/
.xg-zixun{   margin-bottom:50px; background: #fff; padding:5% 4%; }
.xg-zixun .theme{ margin-bottom: 10px; font-size:18px; color: #555555; padding:0 30px;}
.xg-zixun .theme span{ padding-bottom: 10px; display: block; border-bottom: 1px solid #d1d1d1;}
.xg-zixun li{ margin-top:10px;  float: left; width: 49%; margin-right:2%; }
.xg-zixun li:nth-child(2n){ margin-right: 0; }
.xg-zixun li a{ display: block; padding: 8px 95px 5px 30px;  position: relative;}
.xg-zixun li a:after{ content: ""; position: absolute; right:40px; top:50%; margin-top:-6px; width: 17px; height: 12px; background: url(../images/ico_more.png) right no-repeat; transition: ease all .6s; -webkit-transition: ease all .6s; }
.xg-zixun li a:before{ content:""; position: absolute; left:14px; top:19px; width: 8px; height: 8px; border:2px solid #FFFFFF; border-radius: 100%;}
.xg-zixun li .tit{  font-size: 16px; line-height: 30px;  }
.xg-zixun li .tit span{ display: inline-block; margin-right: 15px;}
.xg-zixun li .des{ font-size: 12px; line-height: 30px; padding-left: 110px; color: #666;}
.xg-zixun li a:hover{ background: #2e9bfd; color: #FFFFFF;}
.xg-zixun li a:hover:after{ background: url(../images/ico_more_white.png) right no-repeat; transform:translateX(100%); -webkit-transform:translateX(100%);}
.xg-zixun li a:hover .des{ color: #fff; }



/* ========== */
/* = HEADLINES = */
/* ========== */
.about-more-zx{ margin-top:50px; line-height:38px; padding: 0 80px;}
.about-more-zx i{ width: 24px; height: 24px; background: url(../images/ico_zx.png);}

.headlines-why{ margin-top: 45px; padding: 45px 6% 58px; background: #FFFFFF; text-align: center;}
.headlines-why ul{ margin-top:85px;display: flex; flex-flow: wrap; align-items: center; justify-content: space-between;}
.headlines-why ul li{ max-width: 290px;}
.headlines-why ul li i{ display:inline-block; background: #288fd4; border-radius: 100%; overflow: hidden;}
.headlines-why ul li span{ margin-top: 25px; font-size: 18px; color: #333333; font-weight: bold; display: block;}
.headlines-why ul li p{ padding-top: 20px; margin-top: 20px; font-size: 14px; line-height: 30px; color: #666666; position: relative;}
.headlines-why ul li p:before{ content: ""; position: absolute; top:0; left:50%; margin-left: -85px;  width: 170px; height: 1px; background: #e5e5e5;}
.headlines-why .about-more-zx{ margin-top:85px;}
.headlines-what{ margin-top: 30px; padding:50px 6%; background: #FFFFFF; text-align: center;}
.headlines-what ul{ margin-top:50px;}
.headlines-what li{ float: left; width: 48%; margin-right:4%; padding:9% 5%; color: #FFFFFF;}
.headlines-what li:nth-child(2n){ margin-right:0;}
.headlines-what li .tit{ position: relative; padding-bottom: 20px;}
.headlines-what li .tit:after{ content: ""; position: absolute; bottom: 0; left:50%; width: 20px; height: 1px; background: #FFFFFF;}
.headlines-what li .tit img{ display: inline-block; vertical-align: middle;}
.headlines-what li .tit span{ display:inline-block; vertical-align: middle; font-size: 24px; font-weight: bold; margin-left:10px;}
.headlines-what li .con{ margin-top: 30px; display: flex; flex-flow: wrap; align-items: center; justify-content: space-between;}
.headlines-what li .con span{ display: block;}
.headlines-what li .con p{ margin-top: 5px; font-size: 14px;}
.headlines-adv{ margin:30px auto 60px; padding: 50px 40px 70px; background: #FFFFFF; text-align: center;}
.headlines-adv .about-more-zx{ margin-top:60px; }
.headlines-adv ul{ margin-top: 50px; padding: 27px 8% 0; border-top: 1px dashed #e5e5e5;}
.headlines-adv li{ float: left; width: 48%; margin-right:4%;}
.headlines-adv li:nth-child(2n){ margin-right:0;}
.headlines-adv li p{ margin-top: 25px; font-size: 20px; color: #333333;}


/* ========== */
/* = NEWSEARCH = */
/* ========== */
.newsearch-sign{ margin-top:50px; padding: 50px 6% 75px; background: #FFFFFF; text-align: center;}
.newsearch-sign ul{ margin-top: 45px;}
.newsearch-sign li{ float: left; width: 49%; margin-right:2%;}
.newsearch-sign li:nth-child(2n){ margin-right:0;}
.newsearch-sign li p{ margin-top: 25px; font-size: 20px; color: #333333;}

.newsearch-box{ margin-top: 30px; padding: 50px 45px 100px; background: #FFFFFF;text-align: center;}
.newsearch-box .content{ margin-top: 28px; padding-top: 80px; border-top: 1px dashed #e5e5e5; position: relative;}
.newsearch-box ul{display: flex; flex-flow: wrap; align-items: center; justify-content: space-between;}
.newsearch-box li{ width: 44%; padding:  0 30px;text-align: right;}
.newsearch-box li .tit{ padding-bottom: 30px; padding-right: 95px; font-size: 20px; color: #333333; font-weight:bold;}
.newsearch-box li .con{ border-top: 1px dotted #e1e1e1; padding: 18px 92px 34px 0;}
.newsearch-box li .con span{ display: block; font-weight:bold; padding-right: 30px; background: url(../images/newhome/newsearch_bad_ico.png) no-repeat right;}
.newsearch-box li .con p{  padding-right: 30px; margin-top: 12px; color: #999999; font-size:14px;}
.newsearch-box li:nth-child(2n){ text-align: left;}
.newsearch-box li:nth-child(2n) .tit{ padding-right: 0; padding-left: 95px; color: #288fd4;}
.newsearch-box li:nth-child(2n) .con{ padding: 18px 0 34px 92px;}
.newsearch-box li:nth-child(2n) .con span{ padding-left: 30px;  color: #288fd4; padding-right: 0; background: url(../images/newhome/newsearch_bad_right.png) no-repeat left;}
.newsearch-box li:nth-child(2n) .con p{ padding-right: 0; padding-left: 30px;}
.newsearch-box .box{ position: absolute; top:30px; left:50%; margin-left: -130px; text-align: center; }
.newsearch-box .box span{ margin: 45px 0 10px; padding-bottom: 20px; color: #288fd4; display: block; position: relative;}
.newsearch-box .box span:after{ content: ""; position: absolute; bottom: 0; margin-left: -15px; left:50%; width: 30px; height: 1px; background: #288fd4;}
.newsearch-box .box p{ font-size: 14px; line-height: 40px; color: #999999;}

.newsearch-box .box img{
	animation:twinkling 2.1s infinite ease-in-out;
	animation-fill-mode:both;
}
@-webkit-keyframes twinkling {
	0% {
		-webkit-transform: translateY(-20px);
	}
	50% {
		-webkit-transform: translateY(0px);
	}
	100% {
		-webkit-transform: translateY(-20px);
	}
}
@keyframes twinkling {
	0% {
		transform: translateY(-20px);
	}
	50% {
		transform: translateY(0px);
	}
	100% {
		transform: translateY(-20px);
	}
}


.newsearch-case{  margin-top: 30px; background: #FFFFFF; padding: 50px 0 60px; }
.newsearch-case .content{ margin-top: 30px; padding:0 30px 40px; position:relative;}
.newsearch-case .content:after{ content: ""; position: absolute; bottom:-10px; left:50%; margin-left: -15px; width: 0; height: 0; border-left: 20px solid transparent; border-right: 20px solid transparent; border-bottom: 30px solid #eaeaea;}
.newsearch-case .content .line{ border-top: 1px solid #e5e5e5; margin-bottom: 30px;}
.newsearch-case-big .swiper-slide{ padding: 0 60px;}
.newsearch-case-big .swiper-button-prev,
.newsearch-case-big .swiper-button-next{ outline: none; width: 41px; height: 41px; background-size: cover;} 
.newsearch-case-big .swiper-button-prev{ background-image: url(../images/newhome/case_prev.png);}
.newsearch-case-big .swiper-button-next{ background-image: url(../images/newhome/case_next.png);}
.newsearch-case-big .box{ max-width: 1040px; margin: 0 auto;}
.newsearch-case-big .box .left{ float: left; width: 465px; text-align: center;}
.newsearch-case-big .box .left .img{ width: 465px; height: 270px; background-size: cover; padding:16px 56px 33px; background-image: url(../images/newhome/diannao.png); position: relative;}
.newsearch-case-big .box .left .img p{ position: absolute; bottom:50px; padding: 10px 0; left:56px; width: 354px; font-size: 12px; background: rgba(40,143,212,.9); color: #FFFFFF;}
.newsearch-case-big .box .left .text{ margin: 20px auto 0; max-width: 380px; font-size: 14px; line-height: 26px; color: #999999;}
.newsearch-case-big .box .right{ margin-left: 540px;}
.newsearch-case-big .box .right .img{ border-bottom: 1px dashed #e5e5e5;}
.newsearch-case-big .box .right .img img{ margin: 0;}
.newsearch-case-big .box .right .des{ margin-top: 30px;}
.newsearch-case-big .box .right .des span{ margin-bottom:12px; display: inline-block; padding-left: 40px; font-weight: bold; font-size: 16px; color: #288fd4;}
.newsearch-case-big .box .right .des .ico-01{ background:url(../images/newhome/newsearch_ico_1.png) no-repeat left;}
.newsearch-case-big .box .right .des .ico-02{ background:url(../images/newhome/newsearch_ico_2.png) no-repeat left;}
.newsearch-case-big .box .right .des p{ font-size: 14px; line-height:32px; padding-left: 20px; position: relative;}
.newsearch-case-big .box .right .des p i{ position: absolute; top:0; left:0; font-weight: bold; font-size: 16px; margin-right: 10px; font-style: normal; }
.newsearch-case-small.swiper-container-free-mode>.swiper-wrapper {
    -webkit-transition-timing-function: linear;
    -moz-transition-timing-function: linear;
    -ms-transition-timing-function: linear;
    -o-transition-timing-function: linear;
    transition-timing-function: linear;
}
.newsearch-case-small{ background: #eaeaea; padding:18px 0;}
.newsearch-case-small .swiper-slide{ padding:0 6px;}
.newsearch-case-small .swiper-slide span{ background: #FFFFFF; display: block; -webkit-box-shadow:0 0 20px rgba(0,0,0,.03); box-shadow:0 0 20px rgba(0,0,0,.03);}
.newsearch-case .button{ margin-top: 40px; text-align: center;}
.newsearch-case .about-more{ display: inline-block; width: 220px; line-height: 37px; height: 37px;}
.newsearch-case .about-more i{ width: 24px; height: 24px; background: url(../images/newhome/ico_more_i01.png);}
.newsearch-case .about-more:nth-child(2) i{ width: 24px; height: 24px; background: url(../images/newhome/ico_more_i02.png);}

.newsearch-operate{ margin-top: 30px;  padding: 50px 0 60px; background: #FFFFFF; text-align: center;}
.newsearch-operate ul{ margin-top: 50px; border-top: 1px solid #fbfafa;}
.newsearch-operate li{ float: left;  width: 50%; text-align: left;}
.newsearch-operate li .box{  padding:8% 10%;background: #FFFFFF; }
.newsearch-operate li:nth-child(2) .box,
.newsearch-operate li:nth-child(3) .box{ background: #fbfafa; }
.newsearch-operate li .tit i{ display: inline-block; vertical-align: middle;}
.newsearch-operate li .tit i .default{ display: block;}
.newsearch-operate li .tit i .hover{ display: none;}
.newsearch-operate li .tit span{ display: inline-block; vertical-align: middle; font-size: 20px; color: #288fd4; font-weight: bold; margin-left: 20px;}
.newsearch-operate li .des{ margin-top: 20px; font-size: 15px; line-height: 34px; color: #999999;}
.newsearch-operate li:hover .box{ background: #288fd4;}
.newsearch-operate li:hover i .default{ display: none;}
.newsearch-operate li:hover i .hover{ display: block;}
.newsearch-operate li:hover .tit span{ color: #FFFFFF;}
.newsearch-operate li:hover .des{ color: #FFFFFF;}

.tiaozhan-box{ margin-top: 30px; padding: 50px 38px 50px; background: #FFFFFF;}
.tiaozhan-box .content{ margin-top: 32px; text-align: center;}
.tiaozhan-box .tit{ height: 80px; line-height: 80px; border-bottom:1px solid rgba(255,255,255,.3); background: #cdd0d2; font-size: 24px; color: #666666; text-align: center;}
.tiaozhan-box .left{ float: left; width: 240px; padding-bottom: 62px; background: #cdd0d2; position: relative; z-index: 2;}
.tiaozhan-box .left .ico{ text-align: center; padding: 50px 30px;}
.tiaozhan-box .left .ico img{ display: inline-block; margin:10px;}
.tiaozhan-box .left .text{ text-align: center; font-size: 16px; line-height: 28px; color: #999999;}
.tiaozhan-box .left .search-div{ margin: 50px auto 0; width: 150px; height: 28px; line-height: 28px; background: #ffffff; position: relative; padding-right: 48px;}
.tiaozhan-box .left .search-div .int{ width: 100%; border: none; height: 28px; line-height: 22px; padding:4px 10px;}
.tiaozhan-box .left .search-div .button{ position: absolute; top:0; right:0; width:48px; height: 28px; background: #7a7a7a; color: #FFFFFF; font-size: 14px;}
.tiaozhan-box .left .jt{ position: absolute; top:50%; right:-25px;}
.tiaozhan-box .right{ margin-left: 240px; background: #288fd4; color: #FFFFFF; position: relative; text-align: left;}
.tiaozhan-box .right .tit{ background: #288fd4; color: #FFFFFF; }
.tiaozhan-box .right .tit span{ font-size: 16px;}
.tiaozhan-box .right .row{ height: 72px; line-height: 72px; background: #42a0df;}
.tiaozhan-box .right .row:nth-child(2n){ background: #288fd4;}
.tiaozhan-box .right .row-tit{ color: #FFFFFF; font-size: 16px;}
.tiaozhan-box .right .row div{ float: left; display: inline-block; vertical-align: middle; width:22%; text-align: center;}
.tiaozhan-box .right .row div img{ margin:0 2px; display: inline-block; vertical-align: middle; text-align: center;}
.tiaozhan-box .right .row .div-01{ position: relative;  padding:0 2%; }
.tiaozhan-box .right .row .div-01 span{ display: inline-block; vertical-align: middle; position: relative; width: 108px; height: 30px; line-height: 30px; border-radius: 15px; background: #ffffff; font-size: 16px; color: #288fd4;}
.tiaozhan-box .right .row .div-01 span i{ display:inline-block; position: absolute; top:35px; color: #FFFFFF; right:0; background: url(../images/newhome/ico_shu_jt.png) no-repeat left; padding-left: 24px; font-size: 13px; font-style: normal;}
.tiaozhan-box .right .row .div-02{ width: 38%;}
.tiaozhan-box .right .row .div-03{ width: 40%; text-align: left; text-align: center;}
.tiaozhan-box .right .row .div-03 span{ margin: 0 3px; display: inline-block; min-width:70px; font-size:14px;}
.tiaozhan-box .right .row .div-03 i{ margin: 0 3px; display: inline-block;  vertical-align: middle; width: 1px; height:8px; background: #FFFFFF; opacity: .3;}
.tiaozhan-box .right .row .div-03 span:nth-child(1){ min-width: 40px;}
.tiaozhan-box .right .tiaozhan-line{ position: absolute; top:190px; left:40px;}


.newsearch-service{ padding: 47px 0 62px; text-align: center;}
.newsearch-service ul{ margin: 35px -3px 0; }
.newsearch-service li{ float: left; padding: 0 3px; width: 14.28%;}
.newsearch-service .box{ background: #FFFFFF; padding: 32px 5px; text-align: center;}
.newsearch-service .box span{ display: inline-block; vertical-align: middle; margin-left: 5px; font-size: 18px; color: #999999;}
.newsearch-service .box img{ display: inline-block; vertical-align: middle;}


.zhihu-why{ margin-top: 50px; padding: 50px 4%; background: #FFFFFF; text-align: center;}
.zhihu-why ul{ margin-top:50px; display: flex; flex-flow: wrap; align-items:flex-start; justify-content: space-between;}
.zhihu-why li{ width: 25%; padding: 0 15px;}
.zhihu-why li .box{ padding: 50px 20px 60px;  background: #FFFFFF; -webkit-box-shadow:0 0 30px rgba(0,0,0,.03); box-shadow:0 0 30px rgba(0,0,0,.03);}
.zhihu-why li img{ background: #288fd4; border-radius: 100%; overflow: hidden; }
.zhihu-why li span{ display: block; margin-top: 25px; color: #333333; font-weight: bold; font-size: 18px;}
.zhihu-why li .line{ display: inline-block; width: 175px; margin: 20px 0; border-bottom: 1px solid #e5e5e5;}
.zhihu-why li p{ font-size:14px; line-height: 24px;}

.zhihu-feature .box{ clear: both; height: 247px; background:url(../images/newhome/zhi_img.jpg) no-repeat right #0f2138; padding:45px 0 0 50px;}
.zhihu-feature .box .tit{ display:block;  position: relative; color: #FFFFFF; font-size: 28px; }
.zhihu-feature .box .des{ margin-top: 32px; font-size:14px; letter-spacing: 2px; color: #FFFFFF;}
.zhihu-feature .box .about-more{ margin-top:32px; line-height:28px; padding: 0 50px; font-size: 14px;}
.zhihu-feature ul{ background: #FFFFFF; overflow: hidden;}
.zhihu-feature li{ float: left; width:25%; padding:4%;}
.zhihu-feature li:nth-child(2n){ background: #fbfafa;}
.zhihu-feature li img{ margin:0;}
.zhihu-feature li span{ margin-top: 30px; display:block; color: #333333; font-weight: bold; font-size: 18px; }
.zhihu-feature li p{ margin-top: 30px; font-size: 14px; line-height:24px; min-height: 88px;}
.zhihu-feature li:hover img{ animation:bounce 1s; -webkit-transform: bounce 1s;}

.zhihu-adv{ margin: 30px 0 65px;  padding: 50px 5% 60px; background: #FFFFFF; text-align: center;}
.zhihu-adv ul{ margin-top: 50px; padding-top: 30px; border-top: 1px solid #fbfafa;}
.zhihu-adv li{ float: left; width: 50%; margin-bottom: 50px; padding:0 15px;}
.zhihu-adv li p{ margin-top: 25px; font-size: 18px; color: #666666; font-weight: bold;}


@media (max-width:1420px) {
	.zhihu-feature li{ padding:3% 15px 3% 30px; }
	.headlines-what li{ padding:9% 20px; }
}






.video-list{ padding: 50px 0; text-align: center;}
.video-list ul{ padding: 60px; background:#ffffff; }
.video-list li{  margin-bottom: 40px; float: left; width: 32.666%; margin-right:1%; -o-box-shadow:0 0 30px rgba(0,0,0,.1); 
	-ms-box-shadow:0 0 30px rgba(0,0,0,.1); 
	-moz-box-shadow:0 0 30px rgba(0,0,0,.1); 
	-webkit-box-shadow:0 0 30px rgba(0,0,0,.1); 
	box-shadow:0 0 30px rgba(0,0,0,.1);
 	text-align: left;
 }
.video-list li:nth-child(3n){ margin-right: 0;}
.video-list li:nth-child(3n+1){ clear: both;}
.video-list li .img{ position: relative; background: #000000; padding: 24px 0;}
.video-list li .img div{ overflow: hidden; width: 100%;}
.video-list li .img div:after{ content:""; position: absolute; top:0; left:0; z-index: 1; height: 100%; width: 100%; background: rgba(0,0,0,.2);}
.video-list li .img img{ position: relative; z-index:0;}
.video-list li .img span{ position: absolute; top:50%; left:50%; width: 36px; height: 36px; margin-left: -18px; margin-top: -18px; background-image: url(../images/ico_play.png); background-size:cover; z-index: 1;}
.video-list li .text{ padding: 12px 24px 20px; border-bottom: 5px solid #FFFFFF;}
.video-list li .text span{ padding: 3px 12px; background: #378ed8; color: #FFFFFF; display: inline-block;}
.video-list li .text p{ margin-top: 8px; text-align: justify; line-height: 28px; height: 56px; overflow: hidden; color: #333333;}
.video-list li:hover .img img{ transform: scale(1.1); -webkit-transform: scale(1.1);}
.video-list li:hover .text{ border-bottom: 5px solid #378ed8;}

.video-detail{ padding: 50px 0; text-align: center;}
.video-detail .content{ padding: 60px; background:#ffffff; }
.video-detail .content .title{ margin-bottom: 50px; color: #333; text-align: center; font-weight: bold; font-size: 26px; }
.video-detail .content video{  width: 100%; }

/* ========== */
/* = VIDEO-POP = */
/* ========== */
.video-button{ cursor:pointer;}
.video-pop{ display: none; position: fixed; top:0; left:0; height: 100%; width: 100%; background: rgba(0,0,0,.5); text-align: center; z-index: 99999;}
.video-pop .content+i{ display: inline-block; vertical-align: middle; height: 100%;}
.video-pop .content{ position: relative; display: inline-block;  width:80%; max-width:750px; vertical-align: middle; background: #000000;}
.video-pop .content video{ display: block; width: 100%; }
.video-pop .close{ position: absolute; top:0; right: -50px; cursor: pointer; width:50px; height: 50px; background-image: url(../images/close2.png); background-size: cover;}