body{ font-family: "Microsoft yahei";}
root{
  --redcolor:#00a3ff;
}
ul{
  li{
    list-style-type: none;
  }
}
a{
  color: #666666;
  text-decoration: none;
  background-color: transparent;
  &:hover{
    color: #555555;
  }
}
.bgf6f6f6{background: #f6f6f6;}
.card{
  transition: all ease-out 0.4s;
  &:hover{
    transform: translateY(-20px);cursor: pointer;
  }
}
.media{
  transition: all ease-out 0.4s;
  &:hover{
    transform: translateY(-20px);cursor: pointer;
  }
}
.banner{
  @media screen and(max-width: 768px){
    margin-top: 30px;
  }
}
@media (min-width: 1800px) {
  .container, .container-sm, .container-md, .container-lg, .container-xl {
    max-width: 1600px;
  }
}
header{
  .wz-header-nav{
    height: 90px; overflow: hidden;

    @media screen and(max-width: 768px){  height: 50px !important;overflow: hidden;
    .navbar-brand{
      padding-top: 0px;
      padding-bottom: 0px;
      img{
        height: 30px;
      }
    }
    }
    &>.navbar{ background-image: linear-gradient(to bottom,rgba(255,255,255,0.6),rgba(255,255,255,0.2));
      &.sticky {
        background: rgba(0,0,0,0.5);
        box-shadow: 0px 1px 3px 3px rgba(0,0,0,0.15);
        @media screen and(max-width: 768px){
          background: rgba(0,0,0,0.8);
        }
      }
      .navbar-nav{
        li{
          padding: 0 6px;
          a{
            color: #ffffff;
            @media  screen and (min-width: 1400px) and (max-width: 1600px) {
              font-size: 12px;
            }
            @media (max-width: 1366px){
              font-size: 12px;
            }
          }
          .dropdown-item{
            color: #666666;
          }
        }
      }
      .navbar-right-item{
        color: #ffffff;
        span{
          display: inline-block; width: 30px; height: 30px; border-radius: 50%; border: #404040 solid 1px; text-align: center; margin-left: 8px;
          &.wz-header-tel{
            display: inline-block; width: 100px; color:#ffffff;height: 30px;text-align: left;border-radius: 0%;line-height: 30px;border: #404040 solid 0px; font-size: 14px;font-weight: bold;
          }
          &:nth-child(3){
            position: relative; cursor: pointer;
            i{color: #5ca719;}
            img{
              display: none;
            }
            &:hover{
              img{
                display: block; position: absolute; top: 40px; left: 0px; transform: translateX(-50%);
              }
            }
          }
          &:nth-child(4){i{ color: #ffffff;}}
        }
      }
      .navbar-toggler {
        color: rgba(0, 0, 0, .5);
        border-color: rgba(0, 0, 0, .5);
        .navbar-toggler-icon{
          @media screen and(max-width: 768px) {
            background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0,0,0, 0.95)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
          }
        }
      }
      &.bgc6{
        background: #ffffff;
        box-shadow: 0 0 10px rgba(15, 41, 131, .06);
        .navbar-nav{
          li{
            padding: 0 6px;
            a{
              color: #2d3144;
              @media  screen and (min-width: 1400px) and (max-width: 1600px) {
                font-size: 12px;
              }
              @media (max-width: 1366px){
                font-size: 12px;
              }
            }
            .dropdown-item{
              color: #2d3144;
            }
          }
        }
        .navbar-right-item{
          color: #2d3144;
          span{
            display: inline-block; width: 30px; height: 30px; border-radius: 50%; border: #404040 solid 1px; text-align: center; margin-left: 8px;
            &.wz-header-tel{
              display: inline-block; width: 100px; color:#2d3144;height: 30px;text-align: left;border-radius: 0%;line-height: 30px;border: #404040 solid 0px; font-size: 14px;font-weight: bold;
            }
            &:nth-child(3){
              position: relative; cursor: pointer;
              i{color: #5ca719;}
              img{
                display: none;
              }
              &:hover{
                img{
                  display: block; position: absolute; top: 40px; left: 0px; transform: translateX(-50%);
                }
              }
            }
            &:nth-child(4){i{ color: #2d3144;}}
          }
        }
        .navbar-toggler {
          color: rgba(0, 0, 0, .5);
          border-color: rgba(0, 0, 0, .5);
          .navbar-toggler-icon{
            @media screen and(max-width: 768px) {
              background-image: url("data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 32 32' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0,0,0, 0.95)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 8h24M4 16h24M4 24h24'/%3E%3C/svg%3E");
            }
          }
        }
      }
      .show{
        background: #ffffff;box-shadow: 0 3px 10px 2px rgba(0,0,0,0.6);
        .navbar-nav{
          .nav-item{
            .nav-link{
              color: #666666;
            }
          }
        }
      }
      @media screen and(max-width: 768px){
        .navbar-brand{
          img{max-width: 150px;}
        }
      }
    }
  }
}
/*首页*/
.index-wz-content{
  width: 100%;padding: 0px; position: relative; z-index: 1;margin-top: -90px;
  @media  screen and (max-width: 768px){
    .index-wz-content{width: 100%;padding: 0px; position: relative; z-index: 1; }
  }
      .index-carousel{

      }
    .index-about{
      padding-bottom: 40px;
      h3{font-weight: normal; font-size: 16px; line-height: 1.2em; color: #999; margin-top: 30px;}
      h2{
        font-size: 36px; font-weight: bold; line-height: 1.4em;
        strong{
          color:#00a3ff;
        }
      }
      p{
        color: #999;
        strong{
          color:#00a3ff;
        }
      }
      .index-about-service-item{
        padding-bottom: 15px;
        border-bottom: #999 solid 2px; margin: 20px auto; transition: 0.5s linear 0.5s;cursor: pointer;
        &:hover{
          border-bottom: #00a3ff solid 2px; margin: 20px auto;
          h3{
            a{
              color: #00a3ff;
            }
          }
          h4{
            i{
              color: #00a3ff;
            }
          }
          ul{
            li{
              a{color: #00a3ff;}
            }
          }
        }
        ul{
          margin: 0 auto;
          padding: 0;
          li{
            position: relative; margin: 0 auto; padding: 0px; padding-left: 10px;
            &:before{
              content: "-"; position: absolute;  left: -0px; color: #777;
            }
            a{
              color: #666666;
            }
          }
        }
        h3{color: #333; font-size: 20px; font-weight: bold;}
        h4{
          i{
            color: #666666;
          }
        }
      }
    }
    .index-case{
      background: #fcfcfc; width: 100%;
      overflow: hidden;margin-bottom: 40px;
      .container{
        h3{
          font-weight: normal; font-size: 16px; line-height: 1.2em; color: #999; margin-top: 30px;
        }
        h2{ font-size: 36px; font-weight: bold; line-height: 1.4em;}
        &>ul{
          margin: 20px auto;
        }
        .nav{border: transparent;
        .nav-item{
          padding: 0 10px;
          @media  screen and (max-width: 768px){margin-bottom: 15px;}
        }
        }
        .nav-pills{
          .nav-link{
            &.active{
              color: #fff;
              background-color: #00a3ff;
            }
          }
          .show{
            &.nav-link{
              color: #fff;
              background-color: #00a3ff;
            }
          }
        }
        .tab-content{
          .card{
            border: none; margin: 20px auto; cursor: pointer;background: transparent; box-shadow: 0 0 15px rgba(0,0,0,0.25);
            &:hover{
              a{color: #00a3ff;}
            }
            .card-body{
              @media  screen and (max-width: 768px){
                margin: 0 auto;
                padding: 0;
              }
              .card-title{font-size: 16px; font-weight: bold; text-align: center;}
              .card-text{font-size: 14px;}
            }

          }
        }
      }
    }
    .index-plan{background: #f6f6f6; width: 100%;overflow: hidden;
    .container{
      h3{font-weight: normal; font-size: 16px; line-height: 1.2em; color: #999; margin-top: 30px;}
      h2{ font-size: 36px; font-weight: bold; line-height: 1.4em;}
      .swiper-slide{ margin: 20px auto;
        .card{ margin-bottom: 20px; cursor: pointer;
          .card-title{font-weight: bold;font-size: 16px;}
          .card-text{font-size: 14px;}
        }
      }
    }
    }
    .index-honor{width: 100%;overflow: hidden;background: url("../images/index-about-honor.jpg") top center;
    .container{
      ul{
        margin: 40px auto;
        @media  screen and (max-width: 768px){
          padding: 0;
          display: flex;flex-wrap: wrap;
        }
        li{ width: 33.3%; float: left;color: #ffffff;text-align: center;margin: 40px auto; overflow: hidden;
          @media  screen and (max-width: 768px){
            width: 50%;
            margin: 30px auto;
          }
          h3{ font-size: 70px; position: relative;
            @media  screen and (max-width: 768px){
              font-size: 36px;
            }
          &:after{
            content: ""; position: absolute;bottom: -10px; left: 50%; width: 20px; height: 2px; margin-left: -10px; background: #ffffff;
          }
          }
          p{ margin: 20px auto;
            @media  screen and (max-width: 768px){
              margin: 15 auto;}
          }
        }
      }
    }
    }
    .index-news{background: #f6f6f6; width: 100%;overflow: hidden;
    .container{
      h3{font-weight: normal; font-size: 16px; line-height: 1.2em; color: #999; margin-top: 30px;}
      h2{ font-size: 36px; font-weight: bold; line-height: 1.4em;}
      .nav{
        .nav-item{
          padding: 0 10px;
        }
      }
      .nav-pills{
        .nav-link{
          &.active{
            color: #fff;
            background-color: #00a3ff;
          }
        }
        .show{
          .nav-link{
            color: #fff;
            background-color: #00a3ff;
          }
        }
      }
    }
      .tab-content{
        .media{
          background: #f1f1f1; border-radius: 4px; margin: 8px auto; margin-bottom: 30px;
          @media  screen and (max-width: 768px){
            flex-direction: column;
            .mr-3{
              margin-right: 0px !important;
            }
          }

          &:hover{
            h5{
              a{
                color: #00a3ff;
              }
            }
            p{
              a{color: #00a3ff;}
            }
          }
          a{
            color: #666666; line-height: 1.6em;
          }
          .media-body{
            padding: 15px;
          }
          h5{font-size: 16px;}
          p{font-size: 14px;}
        }
      }
      .hot-search{
        width: 100%; padding: 0px;
        li{float: left; padding: 0px; line-height: 1.6em; margin-right: 4px; list-style-type: none;
          a{ line-height: 1.6em;font-weight: 500;}
          &:first-child{ margin-right: 8px;}
        }
      }
    }
}
/*底部公共*/
.index-contact{ width: 100%; background: url("../images/index-contact-bg.jpg") top center no-repeat; padding: 0px;
  overflow: hidden;
  @media  screen and (max-width: 768px){
    background-size: cover;}
  .container{
    h2{
      font-size: 36px; font-weight: bold; line-height: 1.4em; margin-top: 30px; color: #c4c4c4;
    }
    h3{font-weight: normal; font-size: 16px; line-height: 1.2em; color: #999; margin-top: 30px;}
  }
  .row{
    margin: 30px auto;
    .col-md-3{ margin: 40px auto;
      &:hover{
        span{ background: url("../images/index-contact-span-bg-h.png") no-repeat center center;
          i{color:#00a3ff;}
        }
        p{color:#00a3ff;
          a{color:#00a3ff;}
        }
      }
      p{ padding-left: 13px; font-size: 20px;color: #9d9d9d; line-height: 2.8em;}
    }
    &>div{
      &:nth-child(4){
        span{
          i{margin: 25px 0 0 43px;}
        }
      }
    }
  }
  span{position: relative; cursor: pointer; line-height: 100px;
    display: block;
    width: 115px;
    height: 100px;
    overflow: hidden;
    z-index: 7; background: url("../images/index-contact-span-bg.png") no-repeat center center;
    &>i{ font-size: 50px; color: #9d9d9d; margin: 25px 0 0 33px;}}

}
.index-footer{
  background: #242424; width: 100%; overflow: hidden;
  .container{
    .row{
      .col-md-4{
        h3{
          color: #c4c4c4; margin: 20px auto; font-size: 18px;
        }
        form{
          input{
            background: #363636; border: #363636 solid 1px;
            &:focus{ outline: none;}
            @media screen and(max-width: 768px){
              &[name=company]{
              margin-top: 15px;
            }
              &[name=email]{
                margin-top: 15px;
              }}
          }
          @media screen and(max-width: 768px){
            button{
              margin-top: 15px;
            }
          }
          textarea{background: #363636; border: #363636 solid 1px;}
        }
        ul{ width: 50%; text-align: left; margin: 0 auto; padding: 0px; float: left;
          li{ float: left;color: #767676; font-size: 14px; line-height: 2em;}
        }
        p{color: #767676;}
      }
      &>div{
        &:nth-child(1){
          h3{
            border-bottom: transparent solid 1px;
            span{
              position: relative;
              &:before{
                position: absolute; content: ""; width: 20px; height: 4px; background:#00a3ff; right: -24px; top: 20px;
              }
            }
          }
        }
        h3{ border-bottom: #333333 solid 1px; line-height: 2em;}
      }
    }
    p{color: #767676;}
  }
  .index-copyright{ width: 100%; height: 52px; border-top:#333333 solid 1px;
    .container{
      p{line-height: 52px; text-align: center; font-size: 14px;}
    }
  }
}
/*底部公共完*/
/*面包屑公共*/
.nav-breadcrumb{ background: #f3f3f3; height: 50px;clear: both;
  @media screen and(max-width: 768px){height: auto;}
  .container{
    ul{width:100%;margin: 0 auto; padding: 0px;
      @media screen and(max-width: 768px){
       }
      li{
        height: 50px; margin: 0 0 0 50px; padding: 0px 20px; line-height: 50px; float: left;
        @media screen and(max-width: 768px){
          width: 50%;
          margin: 0 auto;
          padding: 0;
          text-align: center;
        }
        &.active{
          background: #ffffff; height: 50px; margin: 0 0 0 50px; padding: 0px 20px; line-height: 50px; float: left;
          @media screen and(max-width: 768px){
            margin: 0 auto;
            padding: 0;
            background: #f3f3f3;
          }
        }
        &:hover{
          background: #ffffff; height: 50px; margin: 0 0 0 50px; padding: 0px 20px; line-height: 50px; float: left;
        }
        &.breadcrumb-item{
          &::before{
            float: left;
            padding-right: 0rem;
            color: #6c757d;
            content: "";
          }
        }
      }
    }
  }
}
/*面包屑公共完*/
/*页码样式*/
.pagination{
  .page-item{
    .page-link {
      position: relative;
      display: block;
      padding: .5rem .75rem;
      margin-left: -1px;
      line-height: 1.25;
      color: #999999;
      background-color: #fff;
      border: 1px solid #dee2e6;
      &:hover{
        z-index: 2;
        color: #333333;
        text-decoration: none;
        background-color: #e9ecef;
        border-color: #dee2e6;
      }
    }
    &.active{
      .page-link {
        z-index: 3;
        color: #333333;
        background-color: #999999;
        border-color: #999999;
      }
    }
  }
}
/*页码样式完*/
/*关于我们*/
.about{
  &>.container{
    .row{
      .col-lg-6{
        h1{
          font-size: 18px;color: #333;
          font-weight: bold;}
        h2{
          font-size: 18px;
          font-weight: normal;color: #333;
        }
      }
    }
  }
  .about-do{
    width: 100%; background: url("/content/images/about-do-bg.png") top center no-repeat;
    ul{ width: 100%; margin: 0 auto; padding: 0px; display: flex;flex-direction: row; flex-wrap: wrap; justify-content: flex-start; align-items: flex-start; justify-items: flex-start; margin-top: 30px;
      li{counter-increment: a 1; position: relative; padding-left: 30px; box-sizing: border-box; width: 33.3%; flex: 1 1 auto; margin-bottom: 15px;
        font-size: 14px; line-height: 2em;
      &::before{content: counter(a); position: absolute; top: 4px; left: 0px; width: 20px; height: 20px;
        border: #a4a3a3 solid 1px; border-radius: 50%; font-size: 14px;
        line-height: 20px; text-align: center;}
      }
    }
    .col-12{
      h3{
        font-size: 18px;
        &:first-child{
          font-weight: bold;
        }
      }
    }
  }
}
/*关于我们完*/
/*联系我们*/
.contact{ width: 100%; overflow: hidden; margin-top: 96px;
  .content{ width: 100%; position: relative;overflow: hidden; min-height: 550px;
    .maps{ position: absolute; top: 0px; left: 0px; width: 100%; opacity: 0.8; z-index: 1;}
    .contact-info{ position: absolute; top: 0px; left: 0px;  z-index: 2; background: rgba(255,255,255,0.7); width: 100%; height: 550px;
      ul{width: 100%; margin: 0 auto; padding: 0px;}
      img{ width: 104px; height: 104px;}
      .contact-detail{ width: 40%;margin: 0 auto; padding: 0px;}
    }
  }
}
/*联系我们完*/
/*网站建设*/
.service{ background: #ffffff; width: 100%; overflow: hidden;
  .service-content{margin: 0px auto; }
  .container{
    h2{font-size: 24px; margin-top: 60px;}
    .row{
      margin-top: 60px;
      @media screen and(max-width: 768px){margin-top: 0px;}
      .col-md-6{ margin: 30px auto;
        .media{
          box-shadow: 0 0 15px rgba(0,0,0,0.15);
          padding: 15px;
          @media screen  and (max-width: 768px){
            display: flex;
            flex-direction: column;
          }
          .media-body{
            padding: 15px;
            p{
              a{
                font-size: 14px;
                text-decoration: none;
              }
            }
          }
          a{
            img{
              max-width: 250px;
              @media screen  and (max-width: 1366px){
                max-width: 250px;
              }
              @media screen  and (max-width: 768px){
                width: 100%;
            }
            }
          p{font-size: 14px; line-height: 1.8em;}
          h5{}
          }
        }
      }
      .col-md-8{
        ul{display: flex; flex-direction: row; justify-content: center;align-items: center;flex-wrap: wrap;
          @media screen and(max-width: 768px){
            flex-wrap: wrap;
            margin: 0 auto;
            padding: 10px;
          }
          li{ width: 33.3%;display: flex; flex-direction: row; justify-content: center;align-items: center;margin-bottom: 15px; padding-right: 8px;
            @media screen and(max-width: 768px){
              width: 100%;}
            h3{font-size: 14px;font-weight: bold; color: #333333;}
            p{font-size: 14px;color: #333333;}
            img{margin-right: 8px;}
          }
        }
      }
      .col-12{
        h1{
          font-size: 30px;line-height: 3em; text-align: center;
        }
        p{font-size: 14px;}
      }
    }
  }
  .website_lc_bg{
    background: url("../images/website_lc_bg.jpg") top center no-repeat #f6f6f6;
  }
  .showservice{
    width: 100%;
    clear: both;
    h2{    font-size: 22px;color: #333;}
    h3{    font-size: 14px;color: #999;margin-top: -5px;margin-bottom: 20px;}
    &>.container{
      &>.row{
        &>.col-md-6{
          &>h2{
            margin-top: 0px;
          }
        }
      }
    }
    .col-md-6{
      h4{
        font-size: 14px;color: #666;margin-bottom: 25px;
      }
      p{
        &>span{
          color: #e80315;
        }
      }
    }
    .col-12{
      &>ul{
        display: flex; width: 100%; margin: 0 auto; padding: 0px; flex-direction: row; flex-wrap: wrap; margin-top: 60px;
        &>li{
          width: 50%; list-style-type: none; flex: 1 1 auto; margin-bottom: 20px; padding-right: 10px;
          &>h4{
            font-size: 18px;
          }
          &>p{font-size: 14px;}
        }
      }
      &>p{
        font-size: 13px; line-height: 1.9em; padding: 0px; margin: 0 auto;
      }
    }
  }
}
/*网站建设完*/
/*客户案例*/
.case{ background: #ffffff; width: 100%; overflow: hidden;
  .container{
    h2{text-align: center;font-size: 24px; margin-top: 60px;}
    .case-category{
      margin-top: 60px; padding: 0px;
      li{
        float: left; text-align: center; width: 10%;padding: 0px; margin: 0 0 0 15px;  border: #999999 solid 1px; height: 34px; line-height: 32px;
        @media screen and(max-width: 768px){
          width: 49%;
          margin: 0 auto;
          margin-bottom: 15px;
          &:nth-child(2n){
            margin-left: 2%;
          }
        }
        &:hover{
          border: #f20707 solid 1px;
          a{
            color: #f20707;text-decoration: none;
          }
        }
        &.active{
          border: #f20707 solid 1px;
        }
        &:first-child{
          margin-left: 0px;
        }
      }
    }
    .row{
      margin-top: 60px;
      .card{
        &:hover{
          a{color: #e10606;}
        }
        .card-title{font-size: 16px; font-weight: bold;}
        .card-text{font-size: 14px;}
      }
    }
  }
}
/*客户案例完*/
/*解决方案*/
.solution{
  background: #ffffff; width: 100%; overflow: hidden;
  .container{
    .row{justify-content: flex-start; margin-top: 60px;
    &>div{
      border-bottom: #999999 solid 2px; border-radius: 0px; transition: 0.5s  linear;
      box-shadow: 0 0 5px rgba(0,0,0,0.05);
      &:nth-of-type(4n+0){
        margin-right: 0px;
      }
      &:hover{  border-bottom: #f20707 solid 2px;border-radius: 0px; }
    }
      .card{
        border: none; margin: 20px auto; cursor: pointer;background: transparent;border-bottom: transparent solid 2px;
        .card-title{font-size: 16px; font-weight: bold;}
        .card-text{font-size: 14px; border-radius: 0px;}
      }
    }
  }
}
/*解决方案完*/
/*解决方案详细*/
.solution-page{ width: 100%; margin: 0 auto; padding: 0px; background: #f5f6f7;
.container{
  &>p{
    padding-left: 20px; font-size: 14px; line-height: 3em;margin-bottom: 0rem;
  }
  .row{

    &>div{
      h1{font-size: 24px; border-bottom: #eee solid 1px; line-height: 2em; margin: 0 20px; color: #333333;}
    }
    .left{
      background: #ffffff; overflow: hidden; width: 100%; margin-bottom: 30px;
      .content{
        margin: 0 auto; padding: 20px;
        h3{
          font-size: 18px;
        }
        h2{font-size: 18px;}
        p{font-size: 14px;}
      }
    }
    .right{
      background: #ffffff;
      margin-bottom: 30px;
      h1{
        span{
          font-size: 24px; position: relative;
          &:before{
            content: ""; width: 4px; height: 20px; position: absolute; left: -10px; top: 6px; background: #f20707
          }
        }
      }
      ul{
        margin: 0 auto; padding: 0px;
        li{
          margin-left:15px;padding: 0px; line-height: 3em; font-size: 16px; border-bottom: #f9f9f9 dashed 1px;
        }
      }
    }

  }
}
}
/*解决方案详细完*/
/*新闻列表*/
.news{
  width: 100%; margin: 0 auto; padding: 0px; background: #f5f6f7;
  .container{
    &>p{padding-left: 20px; font-size: 14px; line-height: 3em;margin-bottom: 0rem; clear: both;}
    .row{
      &>div{
        h1{font-size: 24px; border-bottom: #eee solid 1px; line-height: 2em; margin: 0 20px; color: #333333;
        span{
          font-size: 24px; position: relative;
          &::before{
            content: ""; width: 4px; height: 20px; position: absolute; left: -10px; top: 6px; background: #f20707
          }
        }
        }
      }
      .left{background: transparent;margin: 0 auto; padding: 0px;width: 100%; overflow: hidden;
        .content{ margin: 0 auto; padding: 0 20px;width: 100%;
          .media{ width: 100%; margin-bottom: 30px; border-radius: 4px;
          @media screen and(max-width: 768px){flex-direction: column;
            padding: 10px;
          img{
            max-width: 100%;
            &.mr-3{
              margin-right: 0px !important;
            }
          }
          }
          }
        }
      }
      .right{background: #ffffff; overflow: hidden; width: 100%; margin-bottom: 30px;
      ul{
        margin: 0 auto;
        padding: 0;
        margin-top: 15px;
        li{ margin-left:15px;padding: 0px; font-size: 16px; border-bottom: #f9f9f9 dashed 1px;
          p{font-size: 12px;}
        }
      }
      }
    }
  }
}
/*新闻列表完*/
/*新闻详细*/
.shownews{
  width: 100%; margin: 0 auto; padding: 0px; background: #f5f6f7;
  .container{
    &>p{
      padding-left: 20px; font-size: 14px; line-height: 3em;margin-bottom: 0rem;clear: both;
    }
    .row{
      &>div{
        h1{font-size: 22px; border-bottom: #eee solid 1px; line-height: 2em; margin: 0 20px; color: #333333;}
      }
      .left{
        background: #ffffff; overflow: hidden; width: 100%; margin-bottom: 30px;
        .content{
          margin: 0 auto; padding: 0 20px; line-height: 2em;
          h2{font-size: 20px;font-weight: bold;line-height: 2em;}
          h3{font-size: 18px;font-weight: bold;line-height: 2em;}
          p{line-height: 2em;font-size: 16px;
          text-indent: 0em;
          }
          ol{
            font-size: 16px;
            width: 100%;
            margin: 0 auto;
            padding: 0 20px;
            line-height: 1.6em;
            li{
              width: 100%;
              margin: 0 auto;
              padding: 0px;
              list-style-position: outside;
              p{
                text-indent: 0;
                line-height: 1.6em;
              }
            }
          }
          ul{
            width: 100%;
            margin: 0 auto;
            padding: 0;
            font-size: 16px;
            line-height: 1.6em;
            li{
              width: 100%;
              margin: 0 auto;
              padding: 0;
              p{
                text-indent: 0;
                line-height: 1.6em;
              }
            }
          }
          .media{ margin-bottom: 20px;border-radius: 4px;}
        }
      }
      .right{
        background: #ffffff; overflow: hidden; width: 100%; margin-bottom: 30px;
        h1{
          span{
            font-size: 24px; position: relative;
            &::before{
              content: ""; width: 4px; height: 20px; position: absolute; left: -10px; top: 6px; background: #f20707;
            }
          }
        }
        ul{
          margin: 0 auto; padding: 0px;
          li{
            margin-left:15px;padding: 0px; font-size: 16px; border-bottom: #f9f9f9 dashed 1px;
            p{font-size: 12px;}
          }
        }
      }
    }
  }
}
/*新闻详细完*/
/*分站*/
.index2-page{
  @base_color:#00a2fe;
  a{
    text-decoration: none;
  }
  .title_css{
    .title{
      width: 100%;
      margin: 0 auto;
      padding: 60px 0 15px 0;
      @media screen and(max-width: 768px){
        padding: 40px 0 15px 0;}
      h2{font-size: 36px; text-align: center; line-height: 2em;
        color: #353535;
      @media screen and(max-width: 768px){font-size: 28px; line-height: 1em;}
      }
      p{font-size: 20px;text-align: center;
        color: #666666;}
    }
  }
  .w100p0m0_css{
    width: 100%;
    margin: 0 auto;
    padding: 0;
  }
  .banner{
    position: relative;
    img{
      max-width: 100%;
    }
    .desc{
      position: absolute;
      left: 50%;
      top:50%;
      transform: translate(-50%,-50%);
      color: #ffffff;
      h1{text-align: center;
        @media screen and(max-width: 768px){font-size: 28px;}
      }
      p{text-align: center;
        @media screen and(max-width: 768px){display: none;}
      }
    }
  }
  .ys-crumbs{
    background: #f5f7fb;
    .w100p0m0_css();
    .container{
      position: relative;
      .ys-list{
        width: 100%;
        height: 90px;
        display: flex;
        position: absolute;
        top:-45px;
        background: #ffffff;
        border-radius: 10px;
        box-shadow: 1px 1px 15px 2px rgba(0,0,0,0.35);
        @media screen and(max-width: 768px){flex-wrap: wrap;
          position: relative;
          height: 180px;
          width: 99%;
          margin: 0 auto;
          left: 0.5%;
          top: 20px;
        }
        .item{
          width: 25%;
          border-right: #e1e1e1 solid 1px;
          @media screen and(max-width: 768px){
            width: 50%;}
          &:last-child{
            border-right: #e1e1e1 solid 0px;
          }
          h3{
            font-size: 20px;text-align: center;
            line-height: 2em;margin-top: 6px;
            color: #444444;
            @media screen and(max-width: 768px){line-height: 1.6em;}
            b{}
          }
          p{
            text-align: center;font-size: 18px;
            color: #999999;
          }
        }
      }
      .crumbs{
        padding-top: 80px;
        padding-bottom: 20px;
        @media screen and(max-width: 768px){
          padding-top: 50px;
        }
        p{
          font-size: 16px;
          a{
            &::after{
              content: "       >";
            }
            &:last-child{
              &::after{
                content: "";
              }
            }
          }
        }
      }
    }
  }
  .service{
    .container{
      h2{
        margin-top: 0px;
      }
      .title_css();
      .title{
        p{
          i{
            margin-right: 4px;
            font-size: 20px;color:@base_color;
          }
        }
      }
      &>p{
        text-align: left;
        margin-top: 40px;
        font-size: 18px;
        line-height: 2em;
        margin-bottom: 60px;
      }
      &>.service-list{
        display: flex;
        @media screen and(max-width: 768px){flex-direction: column;}
        .title{
          width: 240px;
          margin: 0 auto;
          padding: 0;
          @media screen and(max-width: 768px){
            width: 100%;}
          &>div{
            background: #f4f4f4;
            margin-bottom: 15px;
            height: 95px;
            line-height: 95px;
            text-align: center;
            font-size: 20px;
            cursor: pointer;
            @media screen and(max-width: 768px){
              height: 60px;
              line-height: 60px;
            }
            &.active{
              background-image: linear-gradient(to right,@base_color,#087dc4);
              color: #ffffff;
            }
          }
        }
        .content{
          width: calc(~"100% - 250px"); margin-left: 10px;
          @media screen and(max-width: 768px){
            width: 100%;margin-left: 0px;
          }
          &>div{
            display: none;
            &.active{
              display: flex;
              background: #f5f5f5;
              height: 425px;
              @media screen and(max-width: 768px){
                height: auto;
                flex-direction: column;
              }
              .left{
                width: 350px; border-right: #d1d1d1 solid 1px;
                @media screen and(max-width: 768px){
                  width: 100%;
                  border-right: transparent;
                  img{
                    margin-top: 15px;
                  }
                }
                margin: 0 auto;
                padding: 0;
                text-align: center;
                display: flex;
                justify-content: center;
                align-items: center;
                flex-direction: column;
                a{
                  text-align: center;
                  margin-top: 20px;
                }
              }
              .right{
                width: calc(~"100% - 380px");
                margin-left: 30px;
                padding: 20px;
                @media screen and(max-width: 768px){
                  width: 100%;
                  margin-left: 0px;
                }
                h3{
                  font-size: 24px;
                  color: #333333;
                  text-align: left;
                  margin-top: 30px;
                }
                p{
                  color: #777777;font-size: 20px;
                  text-align: left;
                }
                .advantage{
                  margin-top: 30px;
                  ul{
                    display: flex;
                    justify-content: center;
                    margin: 0 auto;
                    padding: 0;
                    @media screen and(max-width: 768px){
                      flex-direction: column;
                    }
                    li{
                      text-align: center;
                      width: 20%;
                      padding: 10px;
                      @media screen and(max-width: 768px){
                        width: 100%;
                      }
                      span{
                        width: 52px;
                        height: 52px;
                        display: inline-block;
                        margin: 0 auto;
                        padding: 0;
                        line-height: 52px;text-align: center;
                        background: @base_color;
                        border-radius: 26px;
                        i{
                          font-size: 20px;
                          color: #ffffff;
                        }
                      }
                      h4{
                        font-size: 22px;
                        line-height: 2em;
                      }
                      p{text-align: center;font-size: 15px;}
                    }
                  }
                }
              }
            }
          }
        }
      }
    }
  }
  .worry{
    background: #f4f4f4;
    .w100p0m0_css();
    .title_css();
    .container{
      padding-bottom: 50px;
      .row{
        .col-md-3{

          .card{
            @media screen and(max-width: 768px){
            margin-bottom: 30px;
          }
            .card-header{
              background-image: linear-gradient(to right,@base_color,#0786e0);
              h4{font-size: 16px; color: #ffffff; line-height: 1.8em;margin-top: 20px;}
              p{
                text-align: center; color: #ffffff;
                i{
                  color: #ffffff;}
              }
            }
            .card-body{
              margin: 0 auto;
              padding: 0;
              width: 100%;
              ul{
                width: 100%;
                margin: 0 auto;
                padding: 30px 0 50px 0;
                li{    margin: 0 auto;
                  width: 100%;
                  text-align: left;
                  padding-left: 15px;
                      list-style-type: disc;
                  list-style-position: inside;
                  height: 40px;
                  overflow: hidden;

                  line-height: 40px;
                  a{
                    color: #666666;
                    text-align: left;
                  }
                }
              }
            }
          }
        }
      }
    }

  }
  .choose-us{
    .w100p0m0_css();
    .title_css();
    .container{
      .choose-us-list{
        width: 80%;
        margin: 0 auto;
        padding: 0;
        display: flex;
        justify-content: space-between;
        @media screen and(max-width: 768px){
          flex-direction: column;
        }

        .item{
          width: calc(~"25% - 10px");
          background: #edeff3;
          margin: 0 auto;
          padding: 10px;
          text-align: center;
          margin-bottom: 40px;
          @media screen and(max-width: 768px){
            width: 100%;
          }
          h3{text-align: center;font-size: 42px;line-height:1em;margin-top: 30px;}
          img{
            margin: 0 auto;
            padding: 0;
            position: relative;
            top:-20px;
          }
          h4{font-size: 24px;}
        }
      }
    }
  }
  .benefit{
    background: #f4f4f4;
    .w100p0m0_css();
    .title_css();
    .container{
      .row{
        .col-md-6{
          margin-bottom: 50px;
          margin-top: 40px;
          img{
           float: right;
            @media screen and(max-width: 768px){
              max-width: 100%;
            }
          }
          ul{
            margin: 0 auto;
            padding: 0;
            li{
              h3{
                font-size: 22px;
                line-height: 1.6em;
                color: #353535;
                span{
                  margin-right: 6px;
                  i{color:@base_color;}
                }
              }
            }
          }
        }
      }
    }
  }
  .case{
    .w100p0m0_css();
    .title_css();
    .container{
      .mySwiper{
        width: 80%;
        .card{
          position: relative;
          .card-body{
            position: absolute;
            display: none;
            width: 100%;
            height: 100%;
          }
          &:hover{
            .card-body{
              background: rgba(0,0,0,0.6);
              display: flex;
              justify-content: center;
              align-items: center;
              h5{
                a{
                  color: #ffffff;
                }
              }
            }
          }
        }
        .swiper-button-next{
          display: none;
        }
        .swiper-button-prev{
          display: none;
        }
        .button{
          width: 380px;
          margin: 50px auto;
          padding: 0;
          display: flex;
          justify-content: space-between;
          @media screen and(max-width: 768px){
            width: 100%;
            margin: 50px auto;
          }
          a{
            display: block;
            height: 50px;
            padding: 0 40px;
            border: #d1d1d1 solid 1px;
            line-height: 50px;
            margin: 0 auto;
            cursor: pointer;
            @media screen and(max-width: 768px){
              padding: 0 20px;
            }
            i{
              font-size: 30px;
              position: relative;
              top:5px;
            }
            &:hover{
              background: #666666;
              i{
                color: #ffffff;
              }
            }
          }
        }
      }
    }
  }
  .news{
    .w100p0m0_css();
    .title_css();
    .container{
      .row{
        margin-top: 40px;
        .col-md-4{
          .card{
            border: transparent solid 0px;
            margin-bottom: 30px;
          }
        }
        .col-md-8{
          ul{
            margin: 0 auto;
            padding: 0;
            li{
              padding: 10px;
              margin-bottom: 15px;
              h3{
                font-size: 18px;
                color: #444444;
              }
              p{
                margin: 0 auto;
                padding: 0;
                a{
                  display: block;
                  margin: 0 auto;
                  padding: 0;
                  height: 60px;
                  overflow: hidden;
                  line-height: 30px;
                }
                /**/&:last-child{
                  margin-top: 23px;
                      padding: 0;
               a{
                 line-height: 20px;
                 height: 20px;
               }
                }
              }
              &:hover{
                background: #ffffff;
              }
            }
          }
        }
      }
    }
  }
}
/*分站*/
/*分站城市列表*/
.city-page{
  width: 100%;
  margin: 0 auto;
  padding:60px 0;
  background: #f5f5f5;
  .crumbs{
    p{
      font-size: 14px;
      a{
        color:#00a3ff;
        &:after{
          content:"    >";
        }
        &:last-child{
          &:after{
            content:"";
          }
        }
      }
    }
  }
  .city-list{
    width: 100%;
    margin: 0 auto;
    padding: 0;

    .item{
      display: flex;font-size: 14px;
      margin-bottom: 15px;
      .province{
        width: 80px;
        margin: 0 auto;
        padding: 0;
        color: #333333;
        font-weight: bold;
      }
      .city-name{
        color: #666666;
        width: calc(~"100% - 80px");
        ul{
          margin: 0 auto;
          padding: 0;
          li{
            float: left; margin-right: 30px;margin-bottom: 10px;
          }
        }
      }
    }
  }
}
/*分站城市列表完*/