/* ========== */
/* = HOME = */
/* ========== */
.banner-bg{ position:relative;}
.banner{ position:relative;}
.banner img{ width: 100%;}
.banner .swiper-pagination{ bottom:20px;}
.banner .text{ position: absolute; top:50%; left:0; width: 100%; transform: translateY(-62%); -webkit-transform: translateY(-62%); text-align: center;}
.banner .text h2{ font-size: 3.4vw; color: #FFFFFF; font-weight: 600;}
.banner .text h3{ font-size: 3vw; color: #FFFFFF; font-weight: 600;}
.banner .text .des{ margin-top: 0.6vw; font-size: 1.6vw; color: #FFFFFF;}
.banner .text .button{ margin-top:3vw;}
.banner .text .button a{ font-size: 1.4vw; display: inline-block; line-height:5vw; border: 1px solid #FFFFFF; border-radius: 8px; color: #FFFFFF; padding: 0 1.5vw;}

.index-theme{ font-size:36px; font-weight:600; color: #000000; text-align: center;}
.index-button-div{ text-align: center;}
.index-button-div .index-button{ margin: 0 10px; }
.index-button{ display: inline-block; line-height:58px; border: 1px solid #2a6cf4; border-radius: 8px; font-size: 18px; color: #2a6cf4; padding: 0 50px; letter-spacing: 1px;}
.index-button:hover{background: #2a6cf4; color: #FFFFFF;}
.index-button-div .index-button:nth-child(1){ background: #2a6cf4; color: #FFFFFF;}
.index-button-white{ border: 1px solid #FFFFFF; color: #FFFFFF;}

.home-tab{font-size: 0;}
.home-tab span,
.home-tab a{ margin-right: 20px; margin-bottom: 20px; display:inline-block; vertical-align: middle; padding: 0 30px; background: #f8f8f8; line-height: 48px; border-radius: 24px;  text-align: center; cursor: pointer; font-size: 18px;}
.home-tab a:last-child{ margin-right: 0;}
.home-tab span:hover,
.home-tab a:hover{ color: #2a6cf4;}
.home-tab span.active,
.home-tab a.active{  background: #2a6cf4 !important; color: #FFFFFF;}


.home-customer{ position: absolute; z-index: 1; bottom:0; left:0; width: 100%; background: rgba(0,0,0,.2); padding: 20px 0;}
.home-customer .content{ padding-left:150px; position: relative;}
.home-customer .tit{ position: absolute; top:20px; left:0; font-size: 24px; color: #FFFFFF; font-weight: 600;}
.home-customer .swiper-slide{ padding: 0 1%;}
.home-customer .swiper-container-free-mode>.swiper-wrapper {
    -webkit-transition-timing-function: linear; /*之前是ease-out*/
    -moz-transition-timing-function: linear;
    -ms-transition-timing-function: linear;
    -o-transition-timing-function: linear;
    transition-timing-function: linear;
    margin: 0 auto;
}


.home-advantage{ padding: 5% 0 6%; background: #f8f8f8;}
.home-advantage ul{ margin-top: 2.9vw; display: flex; flex-flow: wrap; justify-content: space-between; align-items:stretch;}
.home-advantage ul li{ width: 31%; max-width: 480px; background: #FFFFFF; border-radius: 20px; overflow: hidden; padding: 5% 3% 2%; text-align: center;}
.home-advantage ul li .img{ max-width:40%; display: inline-block; position: relative;}
.home-advantage ul li .img img:nth-child(1){ opacity: 1; transform: rotateY(0); -webkit-transform: rotateY(0); }
.home-advantage ul li .img img:nth-child(2){ position: absolute; top:0; left:0; opacity: 0; transform: rotateY(-180deg); -webkit-transform: rotateY(-180deg);  }
.home-advantage ul li .text h3{ padding: 30px 0; font-size: 48px; color: #000000; font-weight: 600;  border-bottom: 1px solid rgb(42,180,244,.2);} 
.home-advantage ul li .text .con{ margin-top:7%; text-align:left;}
.home-advantage ul li .text .con p{ margin: 15px 0; font-size: 18px; line-height: 30px; position: relative; padding-left:26px;}
.home-advantage ul li .text .con p:after{ position: absolute; top:5px; left:0;  content: ""; background-image:url(../image/ico_right3.png); width: 20px; height: 20px; background-size:cover;}
.home-advantage ul li:hover{ -webkit-box-shadow:0 10px 30px rgba(0,0,0,.05); box-shadow:0 10px 30px rgba(0,0,0,.05);}
.home-advantage ul li:hover .img img:nth-child(1){ opacity: 0; transform: rotateY(-180deg); -webkit-transform: rotateY(-180deg); }
.home-advantage ul li:hover .img img:nth-child(2){ opacity: 1; transform: rotateY(0deg); -webkit-transform: rotateY(0deg); } 


.home-drainage{ padding: 5% 0 6%;}
.home-drainage li{ margin-top: 5%; display: flex; flex-flow: wrap; justify-content: space-between; align-items:center;}
.home-drainage li .img{ width: 50%; border-radius:15px; overflow: hidden;}
.home-drainage li .img img{ width: 100%;}
.home-drainage li .text{ width: 50%; padding:0 2% 0 4%;}
.home-drainage li .text .tit{ font-size: 44px; color: #222222;}
.home-drainage li .text .des{ font-size: 20px; margin-top: 15px;} 
.home-drainage li .text .tip{ width: 110%; margin-top: 5%; margin-bottom:2%;}
.home-drainage li .text .tip span{ display: inline-block; background: #f8f8f8; line-height: 48px; border-radius: 24px; background: #f8f8f8; color: #333333; font-size: 18px; padding: 0 10px; min-width: 26%; text-align:center; margin-right: 5%; margin-bottom:3%;}
.home-drainage li .text .button-div .index-button{ margin-right: 20px;}
.home-drainage li .text .button-div .index-button:nth-child(1){ border: 1px solid #2a6cf4;color: #2a6cf4; background:none;}
.home-drainage li .text .button-div .index-button:nth-child(2){ background: #2a6cf4; color: #FFFFFF;}
.home-drainage li:nth-child(1){ margin-top: 3%;}
.home-drainage li:nth-child(2n) .text{padding:0 4% 0 2%;}

.home-case{ padding: 5% 0; background: #f8f8f8;}
.home-case .content{ position: relative;}
.home-case .bt-div{ position: relative; height:20px; width:40%; margin:0 auto;}
.home-case .swiper-button-next{  z-index:99;  background-image: url(../image/next_blue.png); background-color: #f8f8f8;}
.home-case .swiper-button-prev{  z-index: 99; background-image: url(../image/prev_blue.png); background-color: #f8f8f8;}
.swiper-home-case{ margin: 0 -20%; padding:50px 0 40px;}
.swiper-home-case .swiper-slide{ padding: 0 1.8%;}
.swiper-home-case .box{ background: #FFFFFF; overflow: hidden; border-radius: 10px; display: block;}
.swiper-home-case .box .img{ position: relative;}
.swiper-home-case .box .img img{ width: 100%;}
.swiper-home-case .box .img span{ position:absolute; max-width: 50%; top:50%; left:50%; transform: translateX(-50%) translateY(-50%); -webkit-transform: translateX(-50%) translateY(-50%);}
.swiper-home-case .box .text{ padding:15px 25px; min-height: 300px;}
.swiper-home-case .box .text .tit{ padding-bottom:15px; position: relative; padding-right: 80px; line-height: 30px; border-bottom: 1px solid rgba(42,108,244,.2);}
.swiper-home-case .box .text .tit p{ font-weight: 600; font-size:20px; color: #000000;}
.swiper-home-case .box .text .tit span{ display: none; position: absolute; top:0; right:0; color: #2a6cf4;}
.swiper-home-case .box .text .des{ margin-top: 10px; line-height: 24px;}
.swiper-home-case .box .text .des p{ margin-bottom:5px; position: relative; padding-left: 12px;}
.swiper-home-case .box .text .des p:before{ content: ""; width: 4px; height: 4px; background: #2a6cf4; position: absolute; top:10px; left:0; border-radius:100%;}
.swiper-home-case .box:hover .text .tit p{ color: #2a6cf4; }
.swiper-home-case .box:hover .text .tit span{ display: block;}
.home-case ul{ margin-top: 50px; display: flex; flex-flow: wrap; justify-content: space-between; align-items:center;}
.home-case li{ width: 16.666%; border-top:1px dashed #d3d3d3; border-right: 1px dashed #d3d3d3; padding:1.2% 3%;}
.home-case li:nth-child(6n){ border-right: none;}
.home-case li:nth-child(1),
.home-case li:nth-child(2),
.home-case li:nth-child(3),
.home-case li:nth-child(4),
.home-case li:nth-child(5),
.home-case li:nth-child(6){ border-top: none;}

.home-add{ padding:6% 0; background-image: url(../image/index_add_bg1.jpg); color: #FFFFFF;}
.home-add .container{ display: flex; flex-flow: wrap; justify-content: space-between; align-items:center;}
.home-add .text h3{ font-size: 36px; font-weight: 600;}
.home-add .text p{ margin-top: 30px; font-size: 24px;}
.home-add .text p span{ font-weight: 600;}
.home-add .index-button{ line-height: 76px; padding: 0 30px;}

.home-news{ padding: 5% 0;}
.home-news .home-tab{ margin-top: 50px; display: flex; flex-flow: wrap; justify-content:space-between; align-items:center;}
.home-news .home-tab span,
.home-news .home-tab a{ width: 12%; padding: 0 5px;}
.home-news .js-tab-box{ margin-top:60px;}
.home-news .js-tab-con{ display: none; flex-flow: wrap; justify-content:space-between; align-items:center;}
.home-news .js-tab-con.active{  display: flex;}
.home-news .box{ width: 47.5%; display: block; border-radius:15px 15px 0 0; overflow: hidden;}
.home-news .box .text{ padding: 5% 4%; border: 1px solid #dddddd;  border-radius:0 0 15px 15px; overflow: hidden; }
.home-news .box .text .tit{ font-size: 18px; position: relative; padding-right: 130px;}
.home-news .box .text .tit p{ font-weight: 600; color: #222222; }
.home-news .box .text .tit span{ position: absolute; top:0; right:0; color: #999999; padding-left: 25px;}
.home-news .box .text .tit span:before{ content: ""; position: absolute; background-image: url(../image/ico_time.png); width: 20px; height: 20px; left:0; top:50%; margin-top:-10px; background-size: cover;}
.home-news .box .text .des{ margin-top: 10px; line-height: 24px; height: 48px; overflow: hidden;}
.home-news .box:hover .tit p{ color: #2a6cf4;}
.home-news ul{ width: 48%;}
.home-news li{ padding:3% 0; border-bottom: 1px solid #e5e5e5;}
.home-news li .tit{ position: relative; line-height:30px; font-size: 18px; color: #222222; padding-right: 90px;}
.home-news li .tit span{ position: absolute; top:0; right:0; color: #999999; padding-left: 18px; font-size: 12px; color: #999999; }
.home-news li .tit span:before{ content: ""; position: absolute; background-image: url(../image/ico_time.png); width: 14px; height: 14px; left:0; top:50%; margin-top:-7px; background-size: cover;}
.home-news li .des{ margin-top:8px;}
.home-news li:hover .tit{ color: #2a6cf4;}

@media (max-width:1640px){ 
	.index-theme{ font-size: 32px;}
	.home-tab span,
	.home-tab a{ margin-right: 12px; margin-bottom: 12px; font-size: 16px;}
	
	.home-advantage ul li .text h3{ font-size:34px;}
	.home-advantage ul li .text .con p{ font-size: 16px;}
	
	.home-drainage li .text .tit{ font-size: 40px;}
	.home-drainage li .text .tip span{ font-size: 16px;}
	.swiper-home-case .box .text{ min-height: 320px; }
}
@media (max-width:1480px){ 
	.index-theme{ font-size: 30px;}
	.index-button{ line-height: 48px; padding:0 35px; font-size: 16px;}
	
	.home-drainage li .text .tit{ font-size: 36px;}
	.home-drainage li .text .tip span{ font-size: 14px;}
	 
	.home-add .text h3{ font-size: 30px;}
	.home-add .text p{ margin-top: 20px; font-size: 20px;}
	.swiper-home-case .swiper-slide{ padding:0 1%; }
}

@media (max-width:999px){ 
	/* ========== */
	/* = HOME = */
	/* ========== */
	.banner .text h2{ font-size: 0.6rem;}
	.banner .text h3{ font-size: 0.5rem; }
	.banner .text .des{ margin-top: 0.2rem; font-size:0.32rem;}
	.banner .text .button{ margin-top: 0.6rem;}
	.banner .text .button a{  line-height: 0.8rem; padding: 0 0.2rem; font-size: 0.28rem; border-radius: 0.133333rem;} 
	
	.index-theme{ font-size:0.5rem;}
	.index-button-div .index-button{ margin: 0 0.133333rem; }
	.index-button{ line-height:1rem;  border-radius: 0.106666rem; font-size: 0.346666rem;  padding: 0 0.5rem;}
	.home-tab span,
	.home-tab a{ margin: 0 0.2rem 0.2rem 0; padding: 0 0.4rem; line-height: 1rem; border-radius: 0.5rem; font-size: 0.32rem;} 
	
	.home-customer{position: relative; padding: 0.266666rem 0;}
	.home-customer .content{ padding-left:0;}
	.home-customer .tit{ margin-bottom: 0.3rem; position: relative; top:auto; font-size: 0.44rem;}
	
	.home-advantage{ padding:1.2rem 0;}
	.home-advantage ul li{ margin-top: 0.666666rem; padding: 0.666666rem 0.533333rem; width: 100%; max-width: 100%;}
	.home-advantage ul li .img{ width: 2rem;}
	.home-advantage ul li .text h3{ font-size: 0.5rem;} 
	.home-advantage ul li .text .con{ margin-top: 0.4rem;}
	.home-advantage ul li .text .con p{ margin: 0.2rem 0; font-size: 0.36rem; line-height: 0.64rem;}
	.home-advantage ul li .text .con p:after{ top:0.12rem; width: 0.4rem; height:  0.4rem; } 
	
	.home-drainage{ padding: 1.2rem 0;}
	.home-drainage li{ margin-top: 0.8rem !important; display: block;}
	.home-drainage li .img{ width: 100%; border-radius:0.3rem;}
	.home-drainage li .text,
	.home-drainage li:nth-child(2n) .text{ width: 100%; padding: 0.666666rem 0;}
	.home-drainage li .text .tit{ font-size: 0.533333rem; }
	.home-drainage li .text .des{ font-size: 0.32rem; margin-top: 0.266666rem;}
	.home-drainage li .text .tip span{  line-height: 0.8rem; border-radius: 0.3rem; font-size:0.32rem;}
	.home-drainage li .text .button-div{ text-align: center;}
	.home-drainage li .text .button-div .index-button{ margin:0 0.133333rem;}
	
	.home-case{ padding:1.2rem 0;}
	.home-case .bt-div{ width: 100%; height: 0.4rem;}
	.swiper-home-case{ margin: 0 -70%; padding:0.6rem 0 0.4rem;}
	.swiper-home-case .swiper-slide{ padding: 0 0.2rem;}
	.swiper-home-case .box .text{ padding:0.4rem; min-height: 2.133333rem;}
	.swiper-home-case .box .text .tit p{ font-size: 0.373333rem;}
	.swiper-home-case .box .text .des{ margin-top: 0.133333rem; line-height: 0.46rem;}
	.swiper-home-case .box .text .des p{ margin-bottom:0.133333rem; padding-left: 0.3rem;}
	.swiper-home-case .box .text .des p:before{ top:0.23rem; width: 0.1rem; height: 0.1rem;}
	.home-case ul{ margin-top: 0.8rem; }
	.home-case li{ width:33.333%; border-top:1px dashed #d3d3d3; border-right: 1px dashed #d3d3d3;}
	.home-case li:nth-child(6n){border-right: 1px dashed #d3d3d3;}
	.home-case li:nth-child(3n){ border-right: none;}
	.home-case li:nth-child(4),
	.home-case li:nth-child(5),
	.home-case li:nth-child(6){border-top:1px dashed #d3d3d3; }
	 
	.home-add{ padding:1rem 0;}
	.home-add .text h3{ font-size: 0.46rem;}
	.home-add .text p{ margin-top: 0.4rem; font-size: 0.34rem;}
	.home-add .index-button{ margin-top: 0.6rem; line-height: 1.2rem; padding: 0 0.4rem;}
	
	.home-news{ padding:1.2rem 0;}
	.home-news .home-tab{ margin-top: 0.8rem;justify-content:flex-start;}
	.home-news .home-tab span,
	.home-news .home-tab a{ width: 22%;}
	.home-news .js-tab-box{ margin-top:0.8rem;}
	.home-news .box{ width: 100%; }
	.home-news .box .text{ width: 100%;}
	.home-news .box .text .tit{ font-size: 0.4rem; padding-right:2.5rem;}
	.home-news .box .text .tit span{ padding-left: 0.5rem;}
	.home-news .box .text .tit span:before{ width: 0.4rem; height: 0.4rem; margin-top:-0.2rem;}
	.home-news .box .text .des{ margin-top:0.266666rem; line-height:0.64rem; height: 1.28rem;}
	.home-news ul{ width: 100%;}
	.home-news li{ padding:0.4rem 0;}
	.home-news li .tit{ padding-right:2.2rem; font-size: 0.4rem;}
	.home-news li .tit span{  padding-left: 0.5rem;}
	.home-news li .tit span:before{ width: 0.4rem; height: 0.4rem; margin-top:-0.2rem;}
	.home-news li .des{ margin-top:0.133333rem;}
}


/* ========== */
/* = SEARCHSEO = */
/* ========== */
.seo-advantage{ padding:6% 0;}
.seo-advantage ul{ display: flex; flex-flow: wrap; justify-content: space-between; align-items:stretch;}
.seo-advantage ul li{ margin-top:3%; width: 30%; background: #FFFFFF; border-radius: 20px; border: 1px solid #eeeeee; overflow: hidden; padding: 5% 3%; text-align: center;}
.seo-advantage ul li .img{ max-width: 40%; display: inline-block; position: relative; border-radius: 100%; overflow: hidden; background: #e9f0fe; border:1px solid #2a6cf4;}
.seo-advantage ul li .img img:nth-child(1){ opacity: 1; transform: rotateY(0); -webkit-transform: rotateY(0); }
.seo-advantage ul li .img img:nth-child(2){ position: absolute; top:0; left:0; opacity: 0; transform: rotateY(-180deg); -webkit-transform: rotateY(-180deg);  }
.seo-advantage ul li .tit{ font-weight:600; font-size: 30px; color: #222222; padding: 20px 0 30px; position: relative; }
.seo-advantage ul li .tit:after{ content: ""; position: absolute; bottom:0; left:50%; width: 60px; margin-left: -30px; height: 4px; background: #2a6cf4;}
.seo-advantage ul li .des{ margin-top: 25px; font-size: 18px; line-height: 30px;}
.seo-advantage ul li:hover{ -webkit-box-shadow:0 10px 30px rgba(0,0,0,.05); box-shadow:0 10px 30px rgba(0,0,0,.05);}
.seo-advantage ul li:hover .img{ background: #2a6cf4;}
.seo-advantage ul li:hover .img img:nth-child(1){ opacity: 0; transform: rotateY(-180deg); -webkit-transform: rotateY(-180deg); }
.seo-advantage ul li:hover .img img:nth-child(2){ opacity: 1; transform: rotateY(0deg); -webkit-transform: rotateY(0deg); } 

.seo-service{ padding: 5% 0; background-image: url(../image/seo_service.jpg);}
.seo-service .index-theme{ color: #FFFFFF;}
.seo-service .content{ margin-top: 30px;  display: flex; flex-flow: wrap;  justify-content:space-between; align-items:flex-start; }
.seo-service .js-tab{ max-width: 270px; width: 20%;}
.seo-service .js-tab span{ cursor: pointer; padding: 20px 0; display: flex; flex-flow: wrap;  justify-content:space-between; align-items:flex-start; border-bottom: 1px solid rgba(255,255,255,.2); font-size: 18px; color: #FFFFFF; }
.seo-service .js-tab span i{ font-style: normal;}
.seo-service .js-tab span em{ font-style: normal;}
.seo-service .js-tab span.active{ font-weight: 600;}
.seo-service .js-tab-box{ width:74%; }
.seo-service .js-tab-con{ display: none; flex-flow: wrap;  justify-content:space-between; align-items:flex-start;}
.seo-service .js-tab-con.active{ display: flex;}
.seo-service .js-tab-con .img{ width: 65%;}
.seo-service .js-tab-con .logo-div{ padding-top: 4%; width: 30%; max-width: 260px;}
.seo-service .js-tab-con .logo-div .tit{ padding: 15px 0;   border-bottom: 1px solid rgba(255,255,255,.2); font-size: 30px; font-weight: 600; color: #FFFFFF; }
.seo-service .js-tab-con .logo-div img{ margin:20px 0 0;}

.seo-develop{ padding: 6% 0;}
.seo-develop .content{ margin-top: 5%; display: flex; flex-flow: wrap;  justify-content:space-between; align-items:stretch; }
.seo-develop .left{ width: 18.75%; position: relative; border-radius: 14px; overflow: hidden; background: #2469f6;}
.seo-develop .left img{ position: absolute; bottom:0; left:0; width: 100%;}
.seo-develop .left .text{ position: absolute; top:10%; text-align: center; width: 100%; text-align: center; color: #FFFFFF;}
.seo-develop .left .text span{ padding-bottom: 30px; font-size: 30px; font-weight: 600; display: block; position: relative;}
.seo-develop .left .text span:after{ content: ""; position: absolute; bottom: 0; left: 50%; width: 30px; height: 2px; margin-left: -15px; background: #FFFFFF;}
.seo-develop .left .text p{ margin-top: 25px; font-size: 18px; line-height: 24px;}
.seo-develop .right{ width:79%; border-radius: 14px; border: 1px solid #EEEEEE; position: relative; text-align: center;}
.seo-develop .right:after{ content: ""; position: absolute; top:0; left:0; width: 17%; height: 100%; background: #fcfcfc; border-right: 1px solid #EEEEEE;  }
.seo-develop .row{ position: relative; z-index: 1; display: flex; flex-flow: wrap;  justify-content:space-between; align-items:center; }
.seo-develop .row:last-child{ border-bottom: none;}
.seo-develop .row .div-01{ width: 17%; padding:52px 0; font-size: 18px; line-height: 30px; color: #333333; }
.seo-develop .row .div-01 span{ display: block;font-weight:600;}
.seo-develop .row .div-01 p{ margin-top: 5px; }
.seo-develop .row .div-02{ width: 16.6%; position: relative; padding:25px 0;}
.seo-develop .row:nth-child(1) .div-02 span{ color: #2a6cf4; border: 1px solid #2a6cf4; line-height:38px; border-radius: 20px; display:inline-block; font-size: 18px; padding: 0 30px; width: 70%;}
.seo-develop .row:nth-child(1) .div-02 i{ position: absolute; right:-20px; top:5px; width:50px; text-align: center; font-size: 16px; font-style: normal; line-height: 26px;}
.seo-develop .row:nth-child(1) .div-02 i:after{ content: ""; width: 30px; height: 30px; background-size: cover; display:inline-block; background-image: url(../image/reputation_arrows.png);}
.seo-develop .row:nth-child(2) .div-02{ font-size: 0; padding:0;}
.seo-develop .row:nth-child(2) .div-02 div{ display: inline-block; text-align: left;}
.seo-develop .row:nth-child(2) .div-02 img{ max-width: 40px; margin: 5px; border-radius: 15px; overflow: hidden; display: inline-block;}
.seo-develop .row:nth-child(3) .div-02 span{ margin-bottom: 10px; display: block; font-size: 20px; color: #2a6cf4; font-weight:600;}
.seo-develop .row:nth-child(3) .div-02 p{  font-size: 16px; line-height: 24px; color: #333333;}


.seo-data{ padding: 5% 0; background: #f8f8f8;}
.seo-data ul{ display: flex; flex-flow: wrap; justify-content: space-between; align-items:stretch;}
.seo-data li{ margin-top:3%; width: 30%; overflow:hidden; background: #FFFFFF; border-radius: 15px; padding:3% 4%; position: relative;}
.seo-data li .tit{ display: flex; flex-flow: wrap; justify-content: space-between; align-items:center; padding-bottom: 7%; border-bottom: 1px solid rgba(42,108,244,.2);  font-size: 30px; }
.seo-data li .tit span{color: #222222; font-weight: 600;}
.seo-data li .tit i{ font-style: normal; color: #2a6cf4;}
.seo-data li .tip{ margin-top: 8%; width: 110%; font-size: 0;}  
.seo-data li .tip span{ margin: 0 10px 10px 0; font-size: 16px; display: inline-block; background: #f8f8f8; line-height: 30px; padding: 0 20px; border: 1px solid #eeeeee; border-radius: 15px;}
.seo-data li:hover{ -webkit-box-shadow:0 5px 10px rgba(0,0,0,.05); box-shadow:0 5px 10px rgba(0,0,0,.05);}
.seo-data li:hover .tit span{ color: #2a6cf4;}
.seo-data .bt-div{ margin-top: 55px; text-align: center;}
.seo-data .index-button{ margin: 0 8px;}

.seo-propagate{ position: relative; padding: 0 5%;}
.seo-propagate .index-theme{ position: absolute; top:6%; left:0; width: 100%;}

.sem-team{ padding: 6% 0 5%; background: #f8f8f8; text-align: center;}
.sem-team ul{ margin-bottom: 3%; display: flex; flex-flow: wrap; justify-content: space-between; align-items:stretch;}
.sem-team li{ margin-top: 3%; width: 30.5%; border-radius: 10px; overflow:hidden; border-radius: 45px 0 45px 0; padding: 30px 30px 20px; background: #FFFFFF;}
.sem-team li .top{ display: flex; flex-flow: wrap; justify-content: space-between; align-items:center;}
.sem-team li .top .img{ max-width: 30%; border-radius: 100%; overflow: hidden;}
.sem-team li .top .text{ padding-bottom: 10px; text-align: left; width:65%; border-bottom: 1px solid rgba(42,108,244,.2); }
.sem-team li .top .text span{ font-size: 24px; color: #222222;}
.sem-team li .top .text p{ margin-top: 10px; font-size: 16px;}
.sem-team li .des{ margin-top: 20px; font-size: 16px; line-height: 30px; text-align: justify;}

.seo-case{ padding: 5% 0;} 
.swiper-case{ margin: 60px 0;}
.swiper-case .swiper-slide{ display: flex; flex-flow: wrap; justify-content: space-between; align-items:flex-start; overflow:hidden;}
.swiper-case .swiper-slide .img{ width: 50%; border-radius: 10px; overflow: hidden;}
.swiper-case .swiper-slide .text{ width: 45%; padding-right:70px;}
.swiper-case .swiper-slide .text .tit{ font-size: 48px; color: #222222;}
.swiper-case .swiper-slide .text .tip{ margin-top: 5%; font-size: 20px; color: #2a6cf4; padding-left: 35px; font-weight: 600; position: relative; line-height: 40px;}
.swiper-case .swiper-slide .text .tip:before{ content: ""; position: absolute; top:0; left:-5px; width: 40px; height: 40px; background-size: cover;}
.swiper-case .swiper-slide .text .ico-01:before{ background-image: url(../image/ico_light.png);}
.swiper-case .swiper-slide .text .ico-02:before{ background-image: url(../image/ico_book.png);}
.swiper-case .swiper-slide .text .des{ margin-top: 5px; font-size: 16px; line-height: 30px; }
.swiper-case .swiper-button-next,
.swiper-case .swiper-button-prev{ margin: 0;left:auto; right:0; width: 40px; height: 40px;}
.swiper-case .swiper-button-next{ top:auto; bottom:6%; background-image: url(../image/v_next.png);}
.swiper-case .swiper-button-prev{ top:6%; background-image: url(../image/v_prev.png);}
.swiper-case .swiper-pagination{ bottom: auto; right:13px; left:auto; width: auto !important;  height: auto !important; }
.swiper-case .swiper-pagination-bullet{ margin:20px 0 !important;}


@media (max-width:1640px){ 
	.seo-develop .row .div-01{ padding: 40px 0;}
	.swiper-case .swiper-slide .text .tit{ font-size: 40px;}
}

@media (max-width:1480px){ 
	.seo-develop .row .div-01{ padding: 35px 0;}
	.swiper-case .swiper-slide .text .tit{ font-size: 36px;}
	
}
 
@media (max-width:999px){
	.seo-advantage{ padding: 1.2rem 0;}
	.seo-advantage ul li{width: 100%; margin-top: 0.8rem; padding: 0.666666rem;}
	.seo-advantage ul li .img{ width: 2rem;}
	.seo-advantage ul li .tit{ padding: 0.3rem 0 0.6rem; font-size: 0.4rem;}
	.seo-advantage ul li .des{ margin-top: 0.3rem; font-size: 0.32rem; line-height: 0.6rem;}
	
	.seo-service{  padding: 1.2rem 0;}
	.seo-service .content{ margin-top: 0.666666rem;}
	.seo-service .js-tab span{ padding: 0.266666rem 0; font-size: 0.32rem;}
	.seo-service .js-tab span em{ display:none;}
	.seo-service .js-tab-box{ width:75%; }
	.seo-service .js-tab-con .img{ width: 100%;}
	.seo-service .js-tab-con .logo-div{display:none;}
	
	.seo-develop{ padding: 1.2rem 0;}
	.seo-develop .content{ margin-top: 0.8rem;}
	.seo-develop .left{ display: none;}
	.seo-develop .right{ width: 100%;}
	.seo-develop .row .div-01{ padding:0.6rem 0;  font-size: 0.28rem; line-height: 0.5rem;}
	.seo-develop .row .div-01 p{ margin-top:0.053333rem;}
	.seo-develop .row .div-02{  padding:0.8rem 0;}
	.seo-develop .row:nth-child(1) .div-02 span{  line-height:0.533333rem; border-radius: 0.266666rem; font-size: 0.28rem; padding: 0 0.133333rem; }
	.seo-develop .row:nth-child(1) .div-02 i{ top:0.5rem; right:-0.4rem; font-size: 0.22rem; line-height: 0.4rem; width: 0.8rem;}
	.seo-develop .row:nth-child(1) .div-02 i:after{  width: 0.4rem; height: 0.4rem;}
	.seo-develop .row:nth-child(2) .div-02{ font-size: 0;}
	.seo-develop .row:nth-child(2) .div-02 img{ margin: 0.02rem; border-radius:0.066666rem;  width: 0.42rem;}
	.seo-develop .row:nth-child(3) .div-02 span{ margin-bottom: 0.133333rem; font-size: 0.32rem; }
	.seo-develop .row:nth-child(3) .div-02 p{ font-size: 0.28rem; line-height: 0.52rem;}

	.seo-data{ padding:1.2rem 0;}
	.seo-data li{ width: 100%; margin-top: 0.8rem; padding: 0.666666rem;}
	.seo-data li .tit{ padding-bottom: 0.3rem; font-size: 0.4rem; }
	.seo-data li .tip{ margin-top: 0.4rem;}  
	.seo-data li .tip span{ margin: 0 0.133333rem 0.133333rem 0; font-size: 0.32rem; line-height: 0.6rem; padding: 0 0.266666rem; border-radius: 0.31rem;}
	.seo-data .bt-div{ margin-top: 0.8rem;}
	.seo-data .index-button{ margin: 0 0.133333rem;}
	.seo-propagate{ padding:1.2rem 0;}

	.sem-team{ padding: 1.5rem 0 1.2rem;}
	.sem-team ul{ margin-bottom: 0.8rem;}
	.sem-team li{ margin-top: 0.6rem; width:100%;}
	.sem-team li .top .text span{ font-size: 0.5rem;}
	.sem-team li .top .text p{ margin-top:0.133333rem; font-size: 0.36rem;}
	.sem-team li .des{ margin-right: 0.266666rem; font-size: 0.34rem; line-height: 0.68rem;}
	
	.seo-case{ padding:1.2rem 0;} 
	.swiper-case{ margin: 0.8rem 0; height: auto; padding-bottom: 1rem;}
	.swiper-case .swiper-slide{ display: block; }
	.swiper-case .swiper-slide .img{ width: 100%;}
	.swiper-case .swiper-slide .text{ margin-top: 0.5rem; width: 100%;}
	.swiper-case .swiper-slide .text .tit{ font-size: 0.5rem;}
	.swiper-case .swiper-slide .text .tip{ margin-top: 0.266666rem; font-size: 0.4rem; line-height:0.7rem;}
	.swiper-case .swiper-slide .text .tip:before{  left:0; width:0.7rem; height: 0.7rem;}
	.swiper-case .swiper-slide .text .des{ margin-top: 0.133333rem; font-size: 0.32rem; line-height: 0.6rem; }
	.swiper-case .swiper-button-next,
	.swiper-case .swiper-button-prev{ display: none; }
	.swiper-case .swiper-pagination{ bottom: 0; width: 100% !important;}
	.swiper-case .swiper-pagination-bullet{ margin: 0 5px !important;}
}

/* ========== */
/* = WEBSITESEO = */
/* ========== */
.website-seo-flow{ padding: 6% 0; background: #f8f8f8;}
.website-seo-flow .blue-tit{ margin-top:35px; font-weight: 600; text-align: center; font-size: 30px; color: #2a6cf4;}
.website-seo-flow ul{ margin-top: 20px; display: flex; flex-flow: wrap; justify-content: space-between; align-items:center;}
.website-seo-flow ul li{ text-align: center; width: 16%; background: #ffffff; font-size: 24px; color: #333333; padding:10px 5px; border-radius:10px;}
.website-seo-flow ul li span{border-radius:5px; display: inline-block; vertical-align: middle; }
.website-seo-flow ul li span img:nth-child(1){ display: block;}
.website-seo-flow ul li span img:nth-child(2){ display: none;}
.website-seo-flow ul li i{ display: inline-block; vertical-align: middle; font-style: normal;}
.website-seo-flow ul li.arrows{ padding: 0 5px; width:3%; background:#f8f8f8;}
.website-seo-flow ul li:hover{ background: #2a6cf4; color: #FFFFFF; font-weight:600;}
.website-seo-flow ul li:hover span img:nth-child(1){ display: none;}
.website-seo-flow ul li:hover span img:nth-child(2){ display: block;}
.website-seo-flow .content{ margin-top: 5%; background: #FFFFFF; padding:3% 5% 2%; border-radius: 15px; }
.website-seo-flow .content .tit{ margin-top:10px; font-size: 18px; font-weight: 600; color: #333333;}
.website-seo-flow .content .tit:first-child{ margin-top: 0;}
.website-seo-flow .content .tit span{ color: #2a6cf4;}
.website-seo-flow .content .tip{ margin-top: 15px; font-weight: 0;}
.website-seo-flow .content .tip span{ margin-bottom: 20px; margin-right: 20px; line-height: 40px; border-radius: 20px; display: inline-block; background: #f8f8f8; font-size: 16px; padding: 0 30px;}

.website-seo-service{ padding: 6% 0;}
.website-seo-service ul{ display: flex; flex-flow: wrap; justify-content: space-between; align-items:stretch;}
.website-seo-service li{ margin-top:3%; width: 23%; max-width: 340px; overflow:hidden; background: #FFFFFF; border-radius: 15px; padding:2% 3%; position: relative; border:1px solid #eeeeee; color: #333333;}
.website-seo-service li .tit{  padding-bottom:20px;  position: relative;  border-bottom: 1px solid rgba(42,108,244,.2);}
.website-seo-service li .tit span{ padding-right:40px; line-height: 40px; display: block; font-size: 24px; font-weight:600;}
.website-seo-service li .tit p{ margin-top: 5px; font-size: 16px; color:#2a6cf4;}
.website-seo-service li .tit img{ position: absolute; top:0; right:0;}
.website-seo-service li .des{ margin-top: 20px; font-size: 16px; line-height: 30px; }
.website-seo-service li .des p{ margin-bottom: 5px; position: relative; padding-left: 10px;}
.website-seo-service li .des p:before{ content: ""; width: 4px; height: 4px; background: #2a6cf4; position: absolute; top:13px; left:0; border-radius:100%;}
.website-seo-service li:hover{ -webkit-box-shadow:0 5px 10px rgba(0,0,0,.05); box-shadow:0 5px 10px rgba(0,0,0,.05);}

.revelant-news{ padding: 2% 0 7%; text-align: center;}
.revelant-news ul{ margin: 3% 0; display: flex; flex-flow: wrap; justify-content: flex-start; align-items:stretch;}
.revelant-news li{ margin-bottom:2%; width: 48.5%; margin-right:3%; }
.revelant-news li:nth-child(2n){ margin-right: 0;}
.revelant-news li a{ padding:20px; display: block; text-align:left; background: #f8f8f8; border-radius: 10px; overflow: hidden;}
.revelant-news li .tit{ position: relative; line-height:30px; font-size: 18px; color: #222222; padding-right: 90px; font-weight: 600;}
.revelant-news li .tit span{ position: absolute; top:0; right:0; color: #999999; padding-left: 18px; font-size: 12px; color: #999999; font-weight: normal; }
.revelant-news li .tit span:before{ content: ""; position: absolute; background-image: url(../image/ico_time.png); width: 14px; height: 14px; left:0; top:50%; margin-top:-7px; background-size: cover;}
.revelant-news li .des{ margin-top: 8px;}
.revelant-news li:hover a{ background: #2a6cf4; color: #FFFFFF;}
.revelant-news li:hover .tit{ color: #FFFFFF;}
.revelant-news li:hover .tit span{ color: #FFFFFF;}
.revelant-news li:hover .tit span:before{ background-image: url(../image/ico_time2.png);}


@media (max-width:1640px){ 
	.website-seo-service li .tit span{ font-size: 20px;}
	.website-seo-service li .tit p{ font-size: 14px;}
	.website-seo-service li .des{ font-size: 14px;}
}
@media (max-width:999px){
	.website-seo-flow{ padding:1.2rem 0;}
	.website-seo-flow .blue-tit{font-size: 0.4rem; margin-top: 0.4rem;}
	.website-seo-flow ul{justify-content: flex-start; }
	.website-seo-flow ul li{ margin-bottom: 0.266666rem; width: 28%; font-size:0.293333rem;}
	.website-seo-flow ul li span img{ width: 0.6rem;}
	.website-seo-flow ul li i{ display: inline-block; vertical-align: middle; font-style: normal;}
	.website-seo-flow ul li.arrows{ width: 4%; padding: 0;}
	.website-seo-flow .content{ padding: 0.533333rem; margin-top: 0.4rem;}
	.website-seo-flow .content .tit{ margin-top:0.133333rem; font-size: 0.35rem;}
	.website-seo-flow .content .tip{ margin-top: 0.266666rem;}
	.website-seo-flow .content .tip span{ margin-bottom:0.266666rem; margin-right: 0.266666rem; line-height: 0.8rem; border-radius: 0.4rem; padding: 0 0.4rem; font-size: 0.32rem;}	
	
	.website-seo-service{ padding:1.2rem 0;}
	.website-seo-service li{ width: 100%; max-width: 100%; margin-top: 0.8rem; padding: 0.666666rem;} 
	.website-seo-service li .tit{ padding-bottom:0.4rem;}
	.website-seo-service li .tit span{ padding-right:0.666666rem; line-height:0.7rem;  font-size: 0.4rem;}
	.website-seo-service li .tit p{ margin-top: 0.1rem; font-size: 0.34rem; }
	.website-seo-service li .tit img{ width: 0.7rem;}	
	.website-seo-service li .des { font-size: 0.32rem; line-height: 0.46rem;}
	.website-seo-service li .des p{ margin-bottom:0.03rem; padding-left: 0.3rem;}
	.website-seo-service li .des p:before{ top:0.23rem; width: 0.1rem; height: 0.1rem;}

	.revelant-news{ padding: 0.5rem 0 1.2rem;}
	.revelant-news ul{ margin: 0.2rem 0 0.666666rem;}
	.revelant-news li{ margin-top: 0.4rem; width: 100%; margin-right: 0;}
	.revelant-news li .tit{ padding-right:2.2rem; font-size: 0.4rem;}
	.revelant-news li .tit span{  padding-left: 0.5rem;}
	.revelant-news li .tit span:before{ width: 0.4rem; height: 0.4rem; margin-top:-0.2rem;}
}



/* ========== */
/* = CASE = */
/* ========== */
.bread{ line-height: 60px; border-bottom: 1px solid #dddddd;}
.bread a:first-child{ background:url(../image/ico_bread.png) left no-repeat; padding-left: 26px;}
.bread span{ color: #2a6cf4;}
.case{ padding: 5% 0 6.3%;}
.case .home-tab a{ background:#FFFFFF;}
.case-list{ display: flex; flex-flow: wrap; justify-content: flex-start; align-items:stretch;}
.case-list li{ margin-top: 5%; width: 47.5%; margin-right: 5%;}
.case-list li:nth-child(2n){ margin-right: 0;}
.case-list li:nth-child(2n+1){ clear: both; }
.case-list li .box{ background: #ffffff; display: flex; flex-flow: wrap; justify-content: flex-start; align-items:center; border-radius: 20px; overflow: hidden;}
.case-list li .img{ width: 44%;}
.case-list li .img img{ width: 100%;}
.case-list li .text{ width: 56%; padding: 3% 5%;}
.case-list li .text .tit{ color: #2a6cf4; font-weight: 600; font-size: 24px;}
.case-list li .text .tit span{ font-weight:normal; font-size: 14px; color: #666666;}
.case-list li .text .des{ margin-top:7%; line-height: 30px; max-height: 240px; overflow:hidden;}
.case-list li .text .des span{ font-weight: 600; color: #333333; font-size: 16px;}
.case-list li .text .more{ margin-top: 7%; line-height: 40px;  padding: 0 40px; display: inline-block; border:1px solid #2a6cf4; color: #2a6cf4; border-radius: 5px; overflow:hidden;}
.case-list li .text .more:hover{ background: #2a6cf4; color: #FFFFFF;}
.case-list li .box:hover{ -webkit-box-shadow:0 5px 10px rgba(0,0,0,.05); box-shadow:0 5px 10px rgba(0,0,0,.05);}

.case-dateil-banner{ background:#F8F8F8; }
.case-dateil-banner img{ width: 100%;}
.case-dateil-banner .text{ padding:2% 3%; background: #FFFFFF; border-radius:15px; transform: translateY(-50%); -webkit-transform: translateY(-50%); -webkit-box-shadow:0 5px 30px rgba(0,0,0,.15); box-shadow:0 5px 30px rgba(0,0,0,.15);}
.case-dateil-banner .tit{ padding-bottom: 25px; position:relative; font-size: 24px; color: #222222;}
.case-dateil-banner .tit:after{ content: ""; position: absolute; bottom: 0; left:0; width: 40px; height: 4px; background: #2a6cf4; border-radius: 2px;}
.case-dateil-banner .des{ margin-top: 20px; font-size: 18px; line-height:36px; color: #222222; text-align: justify;}
.case-detail{ background:#F8F8F8; padding:1% 0 6%;}
.case-detail .content{ display: flex; flex-flow: wrap; justify-content: space-around; align-items:flex-start; max-width: 1400px; margin: 5% auto 0;}
.case-detail .left-img{ position: relative; width: 40%;}
.case-detail-text{ width: 52%;}
.case-detail-text .img{ padding-bottom:5%; border-bottom: 1px solid rgba(42,108,244,.2);}
.case-detail-text .img img{ max-width: 30%; margin: 0; border: 1px solid #eeeeee; border-radius: 10px; overflow: hidden;}
.case-detail-text .tit{  margin-top: 5%;font-size: 24px; color: #2a6cf4; font-weight: 600;}
.case-detail-text .des{ margin-top: 2%; font-size: 18px; line-height: 36px;}
.case-detail-text .button{ margin-top: 5%; display: block; width: 100%; text-align: center; background: #ffffff;  line-height: 60px; font-size: 20px; color: #2a6cf4; border-radius: 5px; border: 1px solid rgba(42,108,244,.2);}

@media (max-width:1600px){
	.case-list li .text{ padding: 2% 4%;}
	.case-list li .text .tit{ font-size: 20px;}
	.case-list li .text .tit span{font-size: 13px;}
	.case-list li .text .des{ margin-top: 4%; font-size: 13px; line-height: 26px; max-height:208px;}
	.case-list li .text .des span{ font-size: 14px;}
	.case-list li .text .more{ margin-top: 5%; line-height: 36px; padding: 0 20px;}
	
}
@media (max-width:999px){
	.case{ padding: 1.2rem 0;}
	.case-list li{ margin-top:0.666666rem; width: 100%; margin-right: 0;}
	.case-list li .img{ width: 100%;}
	.case-list li .text{ width: 100%; padding: 0.666666rem;}
	.case-list li .text .tit{ font-size: 0.48rem;}
	.case-list li .text .tit span{ font-size: 0.32rem;}
	.case-list li .text .des{ font-size: 0.32rem; line-height: 0.6rem; max-height: 4.8rem;}
	.case-list li .text .des span{ font-size: 0.34rem;}
	.case-list li .text .more{ line-height: 1rem; font-size: 0.32rem; padding: 0 0.5rem;}
	
	.case-dateil-banner .text{ margin-top: 0.533333rem; padding: 0.7rem;  transform: translateY(0%); -webkit-transform: translateY(0%);}
	.case-dateil-banner .tit{ padding-bottom: 0.266666rem; font-size: 0.44rem;}
	.case-dateil-banner .des{ margin-top: 0.266666rem; font-size: 0.34rem; line-height:0.68rem; }
	.case-detail{  padding: 1.2rem 0;}
	.case-detail .left-img{ width: 100%;} 
	.case-detail-text{ margin-top: 0.8rem; width: 100%;}
	.case-detail-text .tit{ font-size: 0.4rem;}
	.case-detail-text .des{  font-size: 0.34rem;  line-height: 0.64rem;}
	.case-detail-text .button{  font-size: 0.38rem; line-height: 1rem;}
	
}



/* ========== */
/* = NEWS = */
/* ========== */
.news{ padding: 4% 0 7%;}
.news .content{ margin-top: 4%; display: flex; flex-flow: wrap; justify-content: space-between; align-items:flex-start; }
.news .left{ width: 71.25%;}
.news .right{ width: 25%;}
.news-list{ margin-bottom: 7%;}
.news-list li{ margin-bottom: 25px;}
.news-list li a{ border-radius: 16px; padding: 20px; display: flex; flex-flow: wrap; justify-content: space-between; align-items:center;}
.news-list li .img{ width: 34%; border-radius: 5px; overflow: hidden;}
.news-list li .img img{ width: 100%;}
.news-list li .text{ width: 62%;}
.news-list li .text .tit{ padding-bottom:5%; font-size: 20px; color: #333333; font-weight:600; position: relative;}
.news-list li .text .tit:after{ content: ""; position: absolute; bottom: 0; left:0; width: 40px; height: 4px; background: #2a6cf4; border-radius: 2px;}
.news-list li .text .des{ margin-top: 3%; font-size: 16px; line-height: 30px; height: 60px; overflow: hidden;}
.news-list li .text .more{ margin-top: 5%; display: flex; flex-flow: wrap; justify-content: space-between; align-items:center;}
.news-list li .text .date{ position: relative; padding-left: 25px;}
.news-list li .text .date:before{ content: ""; position: absolute; margin-top: -10px; top:50%; left:0; width: 20px; height: 20px; background-size: cover; background-image: url(../image/ico_time.png);}
.news-list li .text .date span{ font-size: 16px; color: #999999;}
.news-list li .text .date i{ font-size: 20px; color: #333333; font-style: normal;}
.news-list li .text .more em{ padding-right: 40px; font-style:normal; position: relative;}
.news-list li .text .more em:after{ content: ""; position: absolute; top:50%; right:0; margin-top: -15px; width: 30px; height: 30px; background-image:url(../image/ico_news_more1.png);}
.news-list li a:hover{ background: #f8f8f8;}
.news-list li a:hover .text .tit{ color: #2a6cf4; }
.news-list li a:hover .text .more em{ color: #2a6cf4; padding-right:30px;}
.news-list li a:hover .text .more em:after{ background-image: url(../image/ico_news_more2.png);}

.page{ text-align: center;}
.page ul li{ display: inline-block; vertical-align: middle;}
.page a,
.page span{ display: inline-block; vertical-align: middle; padding: 0 14px; min-width: 50px; margin: 3px; line-height: 40px; color: #999999; border: 1px solid #d4d4d4; border-radius:5px;}
.page a:hover,
.page li.active span{ border: 1px solid #2b6cf4; background: #2b6cf4; color: #FFFFFF;}

.news-rightbox{ margin-bottom: 40px; border: 1px solid #dddddd; border-radius: 20px; padding: 40px 30px;}
.news-rightbox .theme{ padding-left: 30px; padding-bottom: 10px; border-bottom: 1px solid #dddddd; position: relative; font-size: 24px; line-height: 30px; color: #333333; font-weight:600;}
.news-rightbox .theme:before{ content: ""; position: absolute; top:0; left:0; width: 20px; height: 30px; background-image: url(../image/ico_news_tip.png); background-size:cover;}
.news-rightbox .theme a{ position: absolute; top:0; right:0; color: #2a6cf4; font-size: 14px; font-weight: normal;}
.news-rightbox li{ margin-top: 25px;}
.news-rightbox li a{  display: flex; flex-flow: wrap; justify-content: space-between; align-items:center;}
.news-rightbox li .img{ width: 32%; border-radius: 5px; overflow: hidden;  border: 1px solid #DDDDDD;}
.news-rightbox li .text{ width: 63%;}
.news-rightbox li .text .tit{ line-height: 24px; height: 48px; overflow: hidden;}
.news-rightbox li .text .date{ margin-top:2%; color: #999999; font-size: 14px;}
.news-rightbox li .text .date span{ color: #333333;}
.news-rightbox li a:hover .text .tit{ color: #2b6cf4;}
.news-rightbox .tipcon{ margin: 20px -5px 0;  display: flex; flex-flow: wrap; justify-content:flex-start; align-items:center;}
.news-rightbox .tipcon a{ padding: 10px 20px; display: inline-block; background: #f8f8f8;  border: 1px solid #DDDDDD; border-radius: 4px; overflow: hidden; color: #333333; margin: 5px;}
.news-rightbox .tipcon a:hover{ color: #2b6cf4;}

/**news-detail**/
.news-detail .title{ font-weight: 600; font-size: 30px; color: #333333; line-height:40px;}
.news-detail .source{ margin-top: 3%; padding-bottom: 10px; border-bottom: 1px solid #e5e5e5;}
.news-detail .source span{ position: relative; line-height: 30px; display: inline-block; padding-left: 25px; margin-right: 70px; font-size: 16px; color: #999999;}
.news-detail .source span:before{ content: ""; position: absolute; top:50%; margin-top: -10px; left:0; width: 20px; height: 20px; background-size:cover;}
.news-detail .source span:nth-child(1):before{ background-image: url(../image/ico_share.png);}
.news-detail .source span:nth-child(2):before{  background-image: url(../image/ico_time.png);}
.news-detail .detail{ margin-top: 3%; font-size:16px; line-height: 32px;}
.news-detail .flip{ margin-top: 3%; padding-top: 2%; border-top: 1px solid #e5e5e5; display: flex; flex-flow: wrap; justify-content:space-between; align-items:center;}
.news-detail .flip a{ max-width: 46%; display: block; line-height: 30px;}
.news-detail .flip a:hover{ color:#2b6cf4;}
.news-detial-tip{ margin-top: 3%; position: relative; min-height: 34px; line-height: 34px; padding-left: 90px;}
.news-detial-tip a{ margin-right: 7px; line-height: 34px; padding: 0 23px; display: inline-block; background: #f8f8f8;  border: 1px solid #DDDDDD; border-radius: 4px; overflow: hidden; color: #333333;}
.news-detial-tip span{ position:absolute; top:0; left:0; font-size: 16px; color: #2a6cf4;}

/* ========== */
/* = JH = */
/* ========== */
.jh-text{ padding: 5% 0; background: #f8f8f8;}
.jh-text .content{ padding:0 20px;}
.jh-text h2{ font-size: 36px; color: #333333; font-weight: 600;}
.jh-text .des{ margin-top:25px; font-size: 16px; color: #333333; line-height: 32px;}
.jh-list li .img{ width: 20%;}
.jh-list li .text{ width: 75%;}
.jh-list li .text .tit{ padding-bottom:2%;}
.jh-list li .text .des{ margin-top: 2%;}
.jh-list li .text .more{ margin-top: 2%;}

@media (max-width:999px){
	.news{ padding: 1.2rem 0 1rem;}
	.news .content{ margin-top: 0.8rem; }
	.news .left{ width: 100%;}
	.news .right{ margin-top: 1.2rem; width: 100%;}
	.news-list{ margin-bottom: 0.8rem;}
	.news-list li{ margin-bottom: 0.6rem;}
	.news-list li a{ padding:0;}
	.news-list li .text .tit{ padding-bottom: 0; font-size:0.44rem;}
	.news-list li .text .tit:after{ display: none;}
	.news-list li .text .des{ font-size: 0.32rem; line-height: 0.6rem; height: 1.2rem;}
	.news-list li .text .more{ display: none;}
	.news-list li a:hover{ background: #fff;}
	
	.page span{ line-height: 1rem; }
	.news-rightbox{ margin-bottom: 0.8rem; padding: 0.4rem; border-radius: 0.4rem;}
	.news-rightbox .theme{ font-size: 0.48rem;}
	.news-rightbox .theme a{ font-size: 0.32rem;}
	.news-rightbox li{ margin-top: 0.4rem;}
	.news-rightbox li .text .tit{font-size: 0.34rem; line-height: 0.64rem; height: 1.28rem;}
	.news-rightbox li .text .date{ font-size: 0.32rem;}		
	.news-rightbox .tipcon{margin: 0.4rem -0.1rem 0;}
	.news-rightbox .tipcon a{font-size: 0.32rem; margin:0.1rem;}
	
	.news-detail .title{ font-size: 0.5rem; line-height: 0.666666rem;}
	.news-detail .source { margin-top: 0.533333rem;}
	.news-detail .source span{ display: block; margin-right: 0;}
	.news-detail .detail{ margin-top: 0.666666rem; font-size:0.34rem; line-height: 0.64rem;}
	.news-detail .flip{ margin-top:0.533333rem; padding-top: 0.4rem;}
	.news-detail .flip a{ max-width: 100%;}
	.news-detial-tip{ margin-top: 0.8rem;}
	
	.jh-text{ padding:1rem 0;}
	.jh-text .content{ padding:0 0.4rem;}
	.jh-text h2{ font-size:0.48rem; }
	.jh-text .des{ margin-top:0.266666rem; font-size:0.34rem; line-height: 0.64rem;}
	.jh-list li .img{ width: 30%;}
	.jh-list li .text{ width: 65%;}

}



/* ========== */
/* = ABOUT = */
/* ========== */
.about-box{ padding: 5% 0;}
.about-box .container{ margin-top:45px; display: flex; flex-flow: wrap; justify-content:space-between; align-items:center;}
.about-box .img{ width: 47.5%;}
.about-box .img img{ width: 100%;}
.about-box .text { width: 49%; color: #222222; font-size: 18px; line-height: 36px; position: relative; padding-top: 30px;}
.about-box .text p{ position: relative; z-index: 1;}
.about-box .text .png{ position: absolute; top:50%; right:0; transform:translateY(-50%); -webkit-transform:translateY(-50%); max-width: 50%;}
.about-box .text:before{ content: ""; position: absolute; top:0; left:0; width: 40px; height: 8px; background: #2a6cf4;}

.about-history{ padding: 6% 0; background-image:url(../image/history_bg1.jpg);}
.about-history .content{ position: relative; padding-right: 130px;}
.about-history .index-theme{ position: absolute; top:0; left:0; text-align:left;}
.about-history .year-content{ position: absolute; top:0; right: 0; padding: 70px 0;}
.about-history .year-content:before{ content: ""; height: 100%; position: absolute; top:0; left:20px; border-left: 1px solid #aac4fb;}
.about-history .swiper-year{ height:250px;}
.about-history .swiper-year .swiper-slide{ line-height: 55px; height: 55px; width: 100px; padding-left: 40px; position: relative; cursor: pointer; font-size: 18px; color: #999999;}
.about-history .swiper-year .cricle{ position: absolute; left:10px; top:50%; margin-top: -10px; width: 20px; height: 20px; border: 1px solid rgba(255,255,255,0); border-radius: 100%; overflow: hidden;}
.about-history .swiper-year .cricle:before{ content: ""; position: absolute; top:50%; left:50%; margin-left: -5px; margin-top: -5px; width: 10px; height: 10px; background:  #aac4fb;  overflow: hidden; border-radius: 100%;}
.about-history .swiper-year .swiper-slide-active{ color: #2a6cf4;}
.about-history .swiper-year .swiper-slide-thumb-active .cricle{ background: #FFFFFF; border: 1px solid #2a6cf4;}
.about-history .swiper-year .swiper-slide-thumb-active .cricle:before{ background: #2a6cf4;}
.about-history .swiper-pagination{ display: none;}
.about-history .swiper-button-next,
.about-history .swiper-button-prev{ margin: 0;left:auto; right:60px; width: 40px; height: 40px;}
.about-history .swiper-button-next{ top:auto; bottom:0; background-image: url(../image/v_next.png);}
.about-history .swiper-button-prev{ top:0; background-image: url(../image/v_prev.png);}
.swiper-about-history{ height: 410px;}
.swiper-about-history .swiper-slide{  display: flex; flex-flow: wrap; justify-content: space-between; align-items:center;}
.swiper-about-history .box{ width: 100%; display: flex; flex-flow: wrap; justify-content: space-between; align-items:center;}
.swiper-about-history .box .img{ width: 33%;}
.swiper-about-history .box .text{width: 56%;}
.swiper-about-history .box .text .year{ line-height: 100px; font-size: 120px; color: #cccccc;}
.swiper-about-history .box .text .year span{ color: #2a6cf4;} 
.swiper-about-history .box .text .year i{ font-size: 18px; font-style: normal;}
.swiper-about-history .box .text .des{ font-size: 18px; line-height: 36px;}

.about-honor{ padding: 6% 0;}
.about-honor .content{ position: relative; padding:0 50px;}
.swiper-about-honor .swiper-slide{ padding:70px 35px;}
.swiper-about-honor .swiper-slide .img{ border:20px solid #FFFFFF; background: #f8f8f8; -webkit-box-shadow:0 0 20px rgba(0,0,0,.1); box-shadow:0 0 20px rgba(0,0,0,.1); }
.swiper-about-honor .swiper-slide .img div{ padding:14%; box-shadow: 0 0 12px rgba(0,0,0,.1) inset;}
.swiper-about-honor .swiper-slide .img img{ width: 100%;}

@media (max-width:1640px){
	.about-box .text{ font-size: 16px; line-height: 28px;}
	.swiper-about-history .box .text .year{ font-size: 100px; line-height: 90px;}
}
@media (max-width:999px){
	.about-box{ padding: 1.2rem 0;}
	.about-box .container{  margin-top: 0.8rem; display: block;}
	.about-box .img{ width: 100%;}
	.about-box .text { margin-top: 0.8rem; width: 100%; font-size: 0.34rem; line-height: 0.68rem;}
	
	.about-history{ padding: 1.2rem 0;}
	.about-history .content{ padding-right:0;}
	.about-history .index-theme{ position: relative; text-align: center;}
	.about-history .swiper-year{ display: none;}
	.about-history .swiper-pagination{ display: block;}
	.about-history .swiper-button-next,
	.about-history .swiper-button-prev{ display: none;}
	.swiper-about-history{ padding: 0.8rem 0; height: auto;}
	.swiper-about-history .box{  display: block;}
	.swiper-about-history .box .img{ width: 100%;}
	.swiper-about-history .box .text{ margin-top: 0.8rem; width: 100%;}
	.swiper-about-history .box .text .year{ font-size: 0.8rem; line-height: 0.8rem;}
	.swiper-about-history .box .text .year i{ font-size:  0.34rem;}
	.swiper-about-history .box .text .des{  font-size: 0.34rem; line-height: 0.68rem;}
		
	.about-honor{padding:1.2rem 0;}
	.about-honor .content{ padding: 0;}
	.about-honor .swiper-button-next,
	.about-honor .swiper-button-prev{ display: none; }
	.swiper-about-honor .swiper-slide{ padding:0.533333rem 0.4rem 1.2rem;}
	.swiper-about-honor .swiper-slide .img{ border:0.266666rem solid #FFFFFF;  }
}


/* ========== */
/* = CONTACT = */
/* ========== */
.contact{ padding-top: 7%;}
.contact .des{ font-size: 18px; text-align: center; margin-top: 12px;}
.contact ul{ display: flex; flex-flow: wrap; justify-content:space-between; align-items:center;}
.contact li{ margin-top: 50px; width: 31%;  border: 1px solid #eeeeee; padding: 2%;  display: flex; flex-flow: wrap; justify-content:space-between; align-items:center; border-radius: 10px;}
.contact li .ico{ width: 32%; position: relative; background: #e9f0fe; display: inline-block; border-radius: 100%; border: 1px solid #2a6cf4;}
.contact li .ico img:nth-child(1){ opacity: 1; transform: rotateY(0); -webkit-transform: rotateY(0); }
.contact li .ico img:nth-child(2){ position: absolute; top:0; left:0; opacity: 0; transform: rotateY(180deg); -webkit-transform: rotateY(180deg); }
.contact li div{ width:59%; color:#222222;}
.contact li div span{ display: block; font-size: 24px; font-weight:600; padding-bottom: 15px; border-bottom: 1px solid rgba(42,108,244,.2);  color:#222222;}
.contact li div p{ margin-top: 15px; font-size: 16px; line-height: 24px; color:#222222;}
.contact li:hover{ border: 1px solid #FFFFFF; -webkit-box-shadow:0 5px 10px rgba(0,0,0,.05); box-shadow:0 5px 10px rgba(0,0,0,.05);}
.contact li:hover .ico{  background:#2a6cf4;}
.contact li:hover .ico img:nth-child(1){ opacity: 0; transform: rotateY(-180deg); -webkit-transform: rotateY(-180deg); }
.contact li:hover .ico img:nth-child(2){ opacity: 1; transform: rotateY(0deg); -webkit-transform: rotateY(0deg); } 
.contact .allmap{ margin-top: 8%;}
.contact .allmap img{ max-width:1000%;}
.contact .allmap{ width:100%; height:60vh;} 
.contact .allmap .anchorBL{ display: none; }

@media (max-width:999px){
	.contact{ padding-top: 1rem;}
	.contact .des{ font-size: 0.32rem;}
	.contact li{ margin-top: 0.666666rem; width: 100%; padding: 0.533333rem;}
	.contact li .ico{ width: 2rem;}
	.contact li div{ width:67%; }
	.contact li div span{  font-size: 0.44rem; padding-bottom: 0.3rem;}
	.contact li div p{ margin-top: 0.3rem; font-size: 0.36rem; line-height: 0.64rem;}
	
}
