.banner-box { width: 100%; height: 840px; }
.banner-box>div { height: 100%;}
.banner-box .banner-img { width: 100%; height: 100%; background-repeat: no-repeat; background-position: center top; }
.banner-box .banner-img a { display: block; width: 100%; height: 100%; }
.banner-box .banner-circle-btns { width: 100%; text-align: center; position: absolute; bottom: 60px; left: 0; z-index: 9; }
.banner-box .banner-circle-btns span { width: 10px; height: 10px; border-radius: 50%; border: solid 1px #fff; opacity: 1;}
.banner-box .banner-circle-btns .swiper-pagination-bullet-active { background-color: #dd0c14; border-color: #dd0c14; }
.banner-box .swiper-container-horizontal > .swiper-pagination-bullets .swiper-pagination-bullet { margin: 0 8px; }
.banner-box .prev-btn,
.banner-box .next-btn { display: block; width: 52px; height: 52px; border: solid 1px #fff; border-radius: 50%; position: absolute; top: 50%; margin-top: -26px; z-index: 5; cursor: pointer; opacity: .5;}
.banner-box .prev-btn { left: 4%; }
.banner-box .next-btn { right: 4%; }
.banner-box .prev-btn:before,
.banner-box .next-btn:before { content: ''; display: block; width: 20px; height: 9px; background: url(../images/icon_jt01.png) no-repeat; position: absolute; left: 50%; top: 50%; margin: -4.5px 0 0 -10px; }
.team-wrap .team-jt span.next-btn,
.product-box .pro-cont>a:hover em:after,
.news-wrap .left-news a span:after,
.banner-box .next-btn:before { 
  -webkit-transform:rotate(180deg);
  -moz-transform:rotate(180deg);
  -ms-transform:rotate(180deg);
  transform:rotate(180deg);
}
.banner-box .prev-btn:hover,
.banner-box .next-btn:hover { opacity: 1; }

.case-wrap .case-cont .txts .line:after,
.product-box .pro-cont>a:hover em,
.product-box .pro-cont>a:hover em:after,
.news-wrap .news-box span.line:before,
.banner-box .prev-btn,
.banner-box .next-btn {
  -webkit-transition:all .5s ease-out;
  -moz-transition:all .5s ease-out;
  transition:all .5s ease-out;
}

@media screen and (max-width: 800px){
  .banner-box { height: auto; }
  .banner-box .banner-circle-btns { bottom: 8%; }
}
@media screen and (max-width: 640px){
  .banner-box .prev-btn,
  .banner-box .next-btn { display: none; }
}

/*产品*/
.product-box { width: 100%; background-color: #fff; }
.product-box .pro-cont { width: 25%; padding: 4%; }
.product-box .pro-cont{ border-right: solid 1px rgba(17,17,17,.05); }
.product-box .pro-cont .tt { padding-bottom: 16%; margin-bottom: 5%; border-bottom: solid 3px #f3f3f3; }
.product-box .pro-cont h2 { font-size: 24px; margin-bottom: 4%; }
.product-box .pro-cont h2 a { font-size: 24px; color: #000; }
.product-box .pro-cont .tt p { font-size: 14px; color: #666; height:38px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.product-box .pro-cont>a span { display: block; overflow: hidden; }
.product-box .pro-cont>a em { display: block; width: 100%; padding: 6% 0; background-color: #f3f3f3; color: #999; font-size: 14px; text-align: center; }
.product-box .pro-cont>a em:after { content: ''; display: inline-block; width: 20px; height: 9px; background: url(../images/icon_jt02.png) no-repeat; margin-left: 3%; }
.product-box .pro-cont:hover>a em { background-color: #dd0c14; color: #fff; }
.product-box .pro-cont:hover>a em:after { background-image: url(../images/icon_jt01.png); }
.product-box .pro-cont:hover h2 a { color: #dd0c14; }

@media screen and (max-width: 900px){
  .product-box .pro-cont { width: 50%; }
  .product-box .pro-cont:not(:first-child) { border-left: none 0; }
}
@media screen and (max-width: 750px){
  .product-box .pro-cont .tt { border-width: 2px; padding-bottom: 10%; }
  .product-box .pro-cont h2 a { font-size: 18px; }
  .product-box .pro-cont>a em:after { -webkit-transform:scale(.85);transform:scale(.85); }
}

/*团队专家*/
.team-wrap { width: 100%; height: auto; /*background: url(../images/index/ts_bg.jpg) no-repeat center center; background-size: cover;*/ position: relative;}
.team-wrap .lines { display: block; width: 100%; height: 240px; position: absolute; bottom: 0; left: 0; z-index: 1; }
.team-wrap .lines span { display: block; width: 200%; height: 100%; background: url(../images/index/ts_lines_bg01.png) no-repeat center center; background-size: cover; 
  -webkit-animation:linesMove 12s linear both infinite;
  -moz-animation:linesMove 12s linear both infinite;
  animation:linesMove 12s linear both infinite; 
}
.team-wrap .team-box .swiper-slide { background-repeat: no-repeat; background-position: center center; background-size: cover; }

.team-wrap .team-cont .txts { width: 38%; color: #fff; margin-top: 130px; }
.team-wrap .team-cont .txts h2 { font-size: 36px;}
.team-wrap .team-cont .txts span { display: block; font-size: 20px; margin-top: 12px; padding-bottom: 40px; position: relative;}
.team-wrap .team-cont .txts span:after { content: ''; display: block; width: 30px; height: 3px; background-color: #dd0c14; position: absolute; bottom: 0; left: 0; z-index: 9; }
.team-wrap .team-cont .txts p { font-size: 14px; margin-top: 36px; line-height: 30px; }
.team-wrap .team-cont .pro-img { width: 38%; margin-left: 3%; }
.team-wrap .team-jt { width: 120px; height: 12px; position: absolute; right: 5%; top:  130px; z-index: 9;}
.team-wrap .team-jt span { display: block; width: 33px; height: 12px; background: url(../images/icon_jt03.png) no-repeat; cursor: pointer; }
.team-wrap .team-nav { width: 100%; position: absolute; left: 0; bottom: 120px; z-index: 9; }
.team-wrap .team-nav .item { width: 16%; color: #fff; text-align: center; cursor: pointer;}
.team-wrap .team-nav .item:not(:first-child) { margin-left: 12%; }
.team-wrap .team-nav .item p { font-size: 16px; }
.team-wrap .team-nav .item em { font-size: 12px; }
.team-wrap .team-nav .item span { display: block; width: 25px; height: 25px; margin: 10px auto 0; border: solid 0px #dd0c14; border-radius: 50%; position: relative; }
.team-wrap .team-nav .item span:before { content: ''; display: block; width: 5px; height: 5px; background-color: #fff; border-radius: 50%; position: absolute; left: 50%; top: 50%; margin: -2.5px 0 0 -2.5px; }
.team-wrap .team-nav .item.cur,
.team-wrap .team-nav .item:hover { color: #dd0c14; }
.team-wrap .team-nav .item:hover span,
.team-wrap .team-nav .item.cur span { border-width: 1px;}
.team-wrap .team-nav .item:hover span:before,
.team-wrap .team-nav .item.cur span:before { background-color: #dd0c14; }
.team-wrap .swiper-pagination { display: none; }

@keyframes linesMove {
  0%{
    transform:translate(0,0);
  }
  50%{
    transform:translate(-25%,20px);
  }
  100%{
    transform:translate(-50%,0);
  }
}
@-webkit-keyframes linesMove {
  0%{
    -webkit-transform:translate(0,0);
  }
  50%{
    -webkit-transform:translate(-25%,20px);
  }
  100%{
    -webkit-transform:translate(-50%,0);
  }
}

@media screen and (max-width: 1200px){
  .team-wrap .lines { bottom: -45px; }
  .team-wrap .team-nav { bottom: 75px; }
  .team-wrap .team-cont .txts { margin-top: 7%; }
}

@media screen and (max-width: 900px){
  .team-wrap .lines,
  .team-wrap .team-nav { display: none; }
  .team-wrap .team-cont .txts { width: 50%; margin-top: 18%; }
  .team-wrap .team-cont .pro-img { width: 50%; margin-left: 0; }
  .team-wrap .team-cont { padding: 0 6%; }
  .team-wrap .team-jt { width: auto; height: auto; position: static; top: 0;}
  .team-wrap .team-jt span { width: 3%; position: absolute; top: 50%; margin-top: -6px; z-index: 99; }
  .team-wrap .team-jt span.prev-btn { left: 1%; }
  .team-wrap .team-jt span.next-btn { right: 1%; }
.team-wrap .swiper-pagination { display: block; }
}

@media screen and (max-width: 750px){
  .team-wrap .team-cont .txts h2 { font-size: 22px; }
  .team-wrap .team-cont .txts span { font-size: 16px; padding-bottom: 10%; margin-top: 3%; }
  .team-wrap .team-cont .txts p { display:none;  /*width: 130%; margin-top: 10%; line-height: 24px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 5;-webkit-box-orient: vertical;*/ }
  .team-wrap .team-cont .txts { width: 40%;margin-top:30%; position:relative; left:5%; }
  .team-wrap .team-cont .pro-img { width: 60%; }
}


/*案例*/
.news-wrap,
.case-wrap { width: 100%; padding: 60px 0 40px; background-color: #f7f7f7; }
.index-tt { width: 100%; text-align: center; padding-bottom: 25px; margin-bottom: 50px; position: relative; }
.index-tt h2 { font-size: 32px; color: #111; }
.index-tt h2 a { color: #111; }
.index-tt span { display: block; font-size: 24px; color: #999; }
.index-tt:after { content: ''; display: block; width: 20px; height: 3px; background-color: #dd0c14; position: absolute; bottom: 0; left: 50%; margin-left: -10px; }
.case-wrap .case-box .case-cont { width: 25%; background-color: #fff; padding-top: 31.25%; position: relative; }
.case-wrap .case-cont a { display: block; width: 100%; height: 100%; position: absolute; left: 0; top: 0; z-index: 2; }
.case-wrap .case-cont span { display: block; height: 50%; overflow: hidden; }
.case-wrap .case-cont .txts { width: 100%; height: 50%; position: relative; }
.case-wrap .case-cont .txts:before { content: ''; display: block; width: 0; height: 0; border-left: solid 8px transparent; border-right: solid 8px transparent; position: absolute; left: 10%; z-index: 9; }
.case-wrap .case-cont:nth-child(2n) span { position: absolute; bottom: 0; left: 0; }
.case-wrap .case-cont:nth-child(odd) .txts:before { border-bottom: solid 8px #fff; top: -6px;}
.case-wrap .case-cont:nth-child(even) .txts:before { border-top: solid 8px #fff; bottom: -6px; }
.case-wrap .case-cont .txts>div { width: 100%; height: 100%; padding: 8% 10% 0; position: absolute; left: 0; top: 0; z-index: 2; }
.case-wrap .case-cont .txts h3 { font-size: 20px; color: #111; margin-bottom: 6%; white-space: nowrap; text-overflow: ellipsis; overflow:hidden; }
.case-wrap .case-cont .txts p { height: 96px; font-size: 14px; color: #666; line-height: 24px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 4;-webkit-box-orient: vertical;}
.case-wrap .case-cont .txts .line { display: block; width: 80%; height: 3px; background-color: #f3f3f3; position: absolute; bottom: 15%; }
.case-wrap .case-cont:nth-child(2n) .txts .line { left: 10%; }
.case-wrap .case-cont .txts .line:after { content: ''; display: block; width: 0; height: 100%; background-color: #dd0c14; }
.case-wrap .case-cont:hover .txts h3 { color: #dd0c14; }
.case-wrap .case-cont:hover .txts .line:after { width: 100%; }
.all-btn { width: 100%; font-size: 16px; text-align: center; margin-top: 40px;}
.all-btn a:after { content: ''; display: inline-block; width: 20px; height: 9px; background: url(../images/icon_jt02.png) no-repeat; margin-left: 10px; }
.all-btn a:hover { font-weight: bold; }

@media screen and (max-width: 1200px){
  .case-wrap .case-cont .txts p { height: 75px; -webkit-line-clamp: 3; }
  .case-wrap .case-cont .txts .line {display: none;}
}
@media screen and (max-width: 900px){
  .case-wrap .case-box .case-cont { width: 100%; padding-top: 0;}
  .case-wrap .case-cont a { overflow: hidden; position: relative; }
  .case-wrap .case-cont:nth-child(2n) span { position: relative; float: right; }
  .case-wrap .case-cont span { width: 50%; float: left; }
  .case-wrap .case-cont .txts { width: 50%; padding-top: 31.25%; float: left; }
  .case-wrap .case-cont:nth-child(odd) .txts:before { left: -10px; top: 50%; margin-top: -8px; -webkit-transform:rotate(-90deg); transform:rotate(-90deg);}
  .case-wrap .case-cont:nth-child(even) .txts:before { left: calc(100% - 6px); bottom: 50%; margin-top: -8px; -webkit-transform:rotate(-90deg); transform:rotate(-90deg);}
}
@media screen and (max-width: 750px){
  .news-wrap,
  .case-wrap { padding: 6% 0; }
  .index-tt h2 { font-size: 20px; }
  .index-tt span { font-size: 16px; }
  .index-tt { padding-bottom: 5%; margin-bottom: 6%;}
  .case-wrap .case-cont .txts h3 { font-size: 16px; margin-bottom: 4%; }
  .case-wrap .case-cont .txts p { height: auto; font-size: 14px; line-height: normal;}
  .all-btn { margin-top: 5%; font-size: 15px;}
}

/*新闻*/
.news-wrap { background-color: #fff; }
.news-wrap .news-box { width: 100%; }
.news-wrap .news-box .left-news { width: 47%;}
.news-wrap .left-news a { position: relative; margin-bottom: 5%; }
.news-wrap .left-news a span { display: block; width: 100%; font-size: 15px; position: absolute; bottom: 5%; left: 0; z-index: 5; color: #fff; }
.news-wrap .left-news a em { display: inline-block; padding: 1% 2%; background-color: #dd0c14; color: #fff; font-size: 12px; margin-right: 4%; }
.news-wrap .left-news a span:after { content: ''; display: block; width: 20px; height: 9px; background: url(../images/icon_jt01.png) no-repeat; position: absolute; right: 5%; top: 50%; margin-top: -4.5px; z-index: 5; }
.news-wrap .news-box .time { display: block; font-size: 14px; color: #ccc; }
.news-wrap .news-box h3 { font-size: 18px; margin: 1.5% 0 3%; white-space: nowrap; text-overflow: ellipsis; overflow: hidden; position: relative; }
.news-wrap .news-box h3:after { content: ''; display: block; width: 20px; height: 9px; background: url(../images/icon_jt02.png) no-repeat; position: absolute; right: 0; top: 50%; margin-top: -4.5px;}
.news-wrap .news-box h3 a { color: #111; }
.news-wrap .news-box p.intro { font-size: 14px; color: #666; line-height: 24px; height:48px; overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.news-wrap .news-box span.line { display: block; width: 100%; height: 3px; background-color: #f2f2f2; margin-top: 5%; }
.news-wrap .news-box span.line:before { content: ''; display: block; width: 0; height: 100%; background-color: #dd0c14; }
.news-wrap .left-news:hover span.line:before,
.news-wrap .news-infos:hover span.line:before { content: ''; display: block; width: 100%; height: 100%; background-color: #dd0c14; }
.news-wrap .left-news:hover h3:after,
.news-wrap .news-infos:hover h3:after { background-image: url(../images/icon_jt04.png); }
.news-wrap .left-news:hover h3 a,
.news-wrap .news-infos:hover h3 a { color: #dd0c14; }
.news-wrap .left-news:hover p.intro,
.news-wrap .news-infos:hover p.intro { color: #333; }
.news-wrap .news-list { width: 47%; }
.news-wrap .news-list .news-infos:not(:first-child){ margin-top: 5.4%; }

@media screen and (max-width: 1500px){
  .news-wrap .news-list .news-infos:not(:first-child) { margin-top: 3.1%; }
}

@media screen and (max-width: 900px){
  .news-wrap .news-box .left-news { display: none; }
  .news-wrap .news-list { width: 100%; padding: 0 3%; }
}
@media screen and (max-width: 750px){
  .news-wrap .news-box h3 { font-size: 16px; }
  .news-wrap .news-box .time { font-size: 12px; }
  .news-wrap .news-box h3:after { display: none; }
  .news-wrap .news-box p.intro { line-height: normal; height: auto; }
  .news-wrap .news-box span.line { height: 2px; }
}

/*移动端搜索*/
.m-search-box { display: none; width: 100%; background-color: #f7f7f7; padding: 5% 0; }
.m-search-box .m-search-cont { width: 90%; height: 42px; line-height: 42px; border: solid 1px #ccc; background-color: #fff; border-radius: 50px; margin: 0 auto; font-size: 14px; position: relative; overflow: hidden;}
.m-search-box .m-search-cont input { width: 100%; height: 40px; padding: 0 40px 0 15px; }
.m-search-box .m-search-cont button { display: block; width: 40px; height: 40px; position: absolute; right: 0; top: 0; z-index: 9; }
.m-search-box .m-search-cont button:before { content: ''; display: block; width: 15px; height: 15px; background: url(../images/icon_search02.png) no-repeat; margin-left: 8px;}

@media screen and (max-width: 900px){
  .m-search-box { display: block; }
}