.header .header-nav a.active::after, .header .header-nav a.active:after, .header .header-nav a:hover::after, .header .header-nav a:hover:after  { width: 100%; }

.page-banner .banner-nav-wrap{
  height: 100px;
}

.offer .topic-box{ padding-top: 110px; }


.business-scope-swiper .business-scope-list{ padding-top: 60px; }
.business-scope{ background: linear-gradient(#fff, #e7ecf1); }
.business-scope-list .business-scope-item{ width: 448px; height: 220px; transition: .3s; padding: 24px 30px; background-image: #fff; overflow: hidden; margin-right: 28px; margin-bottom: 40px; -webkit-transition: .3s; -moz-transition: .3s; -ms-transition: .3s; -o-transition: .3s; }
.business-scope-list .business-scope-item:nth-of-type(3n){ margin-right: 0; }
.business-scope-list .business-scope-item .iconfont{ color: #343a58; }
.business-scope-list .business-scope-item .item-bottom{ padding: 24px 30px;position: absolute; left: 0; bottom: 0; width: 100%; }
.business-scope-list .business-scope-item .item-title{ font-size: 24px; color: #343a58; padding-left: 30px; height: 64px;}
.business-scope-list .business-scope-item .item-title::after, .business-scope-list .business-scope-item .item-title:after{ 
  content: '';
  position: absolute;
  left: 0;
  top: 8px;
  width: 14px;
  height: 1px;
  background: #39b54a;
}
.business-scope-list .business-scope-item .number{ font-size: 32px; color: #d6d8de; font-weight: bolder; display: inline-block; position: absolute; bottom: 24px; left: 30px;}
.business-scope-list .business-scope-item .item-bottom .iconfont{ font-size: 59px;}
.business-scope-list .business-scope-item .right-icon{ position: absolute; right: -10%; bottom: -20%; font-size: 184px; color: rgba(108, 114, 145, .05); }
.business-scope-list .business-scope-item.active .iconfont, .business-scope-list .business-scope-item:hover .iconfont{ color: #fff; }
.business-scope-list .business-scope-item.active, .business-scope-list .business-scope-item:hover{ transform: translateY(-10px);background: rgb(27,51,166); background-image: -moz-linear-gradient( -29deg, rgb(27,51,166) 0%, rgb(56,175,78) 100%); background-image: -webkit-linear-gradient( -29deg, rgb(27,51,166) 0%, rgb(56,175,78) 100%); background-image: -ms-linear-gradient( -29deg, rgb(27,51,166) 0%, rgb(56,175,78) 100%); -webkit-transform: translateY(-10px); -moz-transform: translateY(-10px); -ms-transform: translateY(-10px); -o-transform: translateY(-10px); }
.business-scope-list .business-scope-item.active .item-title::after, .business-scope-list .business-scope-item.active .item-title:after{ background: #fff; }
.business-scope-list .business-scope-item.active .item-title, .business-scope-list .business-scope-item.active .item-bottom, .business-scope-list .business-scope-item:hover .item-bottom, .business-scope-list .business-scope-item:hover .item-title{ color: #fff; }
.business-scope-list .business-scope-item.active .number, .business-scope-list .business-scope-item:hover .number{ color: rgba(255, 255, 255, .2) }
.business-scope-list .business-scope-item.active .right-icon,  .business-scope-list .business-scope-item:hover .right-icon{ color: rgba(255, 255, 255, .05); }

.pagination-scope{ padding-top: 36px; padding-bottom: 110px; }

.guide-swiper-topic{ margin-top: 74px; z-index: 9;}
.business-guide{ padding-bottom: 110px; }
.guide-item { height: 484px; z-index: 9; }
.guide-pic-wrap{ width: 714px; height: 483px; position: absolute; top: 0; right: 0; z-index: 9;}
.guide-swiper-topic .guide-item .left-text{ width: 595px; }
.guide-swiper-topic .guide-item .left-text .title{ font-size: 40px; width: 60%; color: #343a58; line-height: 1.2; padding-top: 50px; padding-bottom: 40px;}
.guide-swiper-topic .guide-item .left-text .desc{ font-size: 16px; color: #666; line-height: 1.375; height: 176px;}
.guide-swiper-topic .guide-item .left-text .more-btn{ width: 150px; height: 50px; text-align: center; line-height: 50px; background: #1b31a7; margin-top: 71px; }

.guide-swiper-topic .pages{ position: absolute; left: 0; top: 0; font-size: 24px; color: #cfd3d6; }
.guide-swiper-topic .pages .active-page{ color: #39b54a; font-size: 34px; font-weight: bold; padding-right: 10px;}
.guide-swiper-topic .arrow{ height: 65px; width: 65px; z-index: 99; color: #fff; font-size: 25px; line-height: 65px; cursor: pointer; text-align: center; background: rgba(0, 0, 0, .5); position: absolute; top: 50%; transform: translateY(-50%); -webkit-transform: translateY(-50%); -moz-transform: translateY(-50%); -ms-transform: translateY(-50%); -o-transform: translateY(-50%); }
.guide-swiper-topic .right-arrow{ right: 0; }
.guide-swiper-topic .left-arrow{ right: 714px; transform: translate(100%, -50%); -webkit-transform: translate(100%, -50%); -moz-transform: translate(100%, -50%); -ms-transform: translate(100%, -50%); -o-transform: translate(100%, -50%); }

.guide-swiper-bottom{ border: 1px solid #cfd4d8; margin-top: 100px;}
.guide-bottom-item{ display: table;width: 468px; height: 86px; position: relative; padding: 0 70px; line-height: 1.333; cursor: pointer; color: #878787; text-align: center; border-right: 1px solid #cfd4d8; font-size: 18px;}
.guide-bottom-item>span{ display: table-cell; vertical-align: middle; }

.guide-swiper-bottom .swiper-slide{ position: relative; }
.guide-swiper-bottom .swiper-slide::after, .guide-swiper-bottom .swiper-slide:after{
  content: '';
  position: absolute;
  left: 0;
  bottom: 0;
  width: 0;
  height: 3px;
  background: #39b54a;
  transition: .3s;
  -webkit-transition: .3s;
  -moz-transition: .3s;
  -ms-transition: .3s;
  -o-transition: .3s;
}
.guide-swiper-bottom .active-nav{ color: #39b54a; }
.guide-swiper-bottom .active-nav::after, .guide-swiper-bottom .active-nav::after{ width: 100%; }

.swiper-project{ padding-top: 74px; }
.project-cases{ background: linear-gradient(#e7ecf1, #fff); padding-bottom: 100px;}
.project-cases .project-item{ margin-right: 28px; width: 329px}
.swiper-project .pic-wrap{ width: 329px; height: 185px; }
.swiper-project .txt-box{ padding: 30px; font-size: 14px; color: #999; }
.swiper-project .txt-box .title{ font-size: 18px; color: #333; padding-bottom: 12px; }
.project-list .project-item:last-of-type{ margin-right: 0; }
.pagination-project{ padding-top: 84px; }


/**
 * ########################################################################################################################
 * 媒体查询
 * ########################################################################################################################
 */
@media screen and (max-width: 1680px) {

}

@media screen and (max-width: 1450px) {

  .business-scope-list .business-scope-item{ width: 381px; }
  .guide-pic-wrap{ width: 580px; }
  .guide-swiper-topic .left-arrow{ right: 580px; }
  .guide-swiper-topic .guide-item .left-text { width: 570px; }

  .guide-bottom-item{ width: 400px; }

  .swiper-project .pic-wrap, .swiper-project .txt-box{ width: 285px; }
  .project-cases .project-item { margin-right: 20px; }

  .swiper-project, .pagination-project{ padding-top: 60px; }
  .guide-swiper-topic, .guide-swiper-bottom{ margin-top: 60px; }
  .project-cases .project-item{  width: 285px} 
  .pagination-scope, .business-guide, .project-cases{ padding-bottom: 60px; }
}


@media screen and (max-width: 1366px) {

}

@media screen and (max-width: 1280px) {

  .business-scope-list .business-scope-item{ width: 336px; margin-right: 20px; margin-bottom: 30px;}
  .business-scope-list .business-scope-item .item-bottom{ padding-bottom: 15px; }
  .guide-pic-wrap{ width: 490px; height: 430px; }
  .guide-swiper-topic .left-arrow{ right: 490px; }
  .guide-swiper-topic .guide-item { height: auto;; }
  .guide-swiper-topic .guide-item .left-text { width: 510px; }
  .guide-swiper-topic .guide-item .left-text .title{ padding-bottom: 20px; }
  .guide-swiper-topic .guide-item .left-text .more-btn{ margin-top: 37px; }
  .guide-bottom-item{ width: 350px; }

  .swiper-project .pic-wrap, .swiper-project .txt-box{ width: 247px; }
  .project-cases .project-item { margin-right: 20px; }

  .swiper-project, .pagination-project{ padding-top: 60px; }
  .guide-swiper-topic, .guide-swiper-bottom{ margin-top: 60px; }
  .pagination-scope, .business-guide{ padding-bottom: 60px; }
  .project-cases .project-item{ width:246px }
  
}


@media screen and (max-width: 1152px) {

  
}



