@charset "UTF-8";

   .head_container{
  min-width: 1400px;
  width: 100%;
  height: 70px;
  background: rgba(4,17,40,0.52);
  display: flex;
  justify-content: space-between;
  border-bottom: 1px solid rgba(255,255,255,0.2);
  align-items: center;
  padding: 0 20px;
  box-sizing: border-box;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 99999;
  transition: all 0.3s ease;

  &.fixed{
    position: fixed;
    background: #ffffff;
    border-bottom: 1px solid #eeeeee;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    z-index: 99999;

    .nav_list{
      ul{
      margin: 0;
      }
      ul li{
        color: #222222;
        a{
          color: #222222;
          text-decoration: none;
          &:before{
            background-color: #1d78ff;
            left: 50%;
            right: 50%;
          }
          &.active{
            color: #1d78ff;
            background: #ddebff;
              &:before{
                 background-color: #1d78ff;
                 left: 0;
                 right: 0;
                 opacity:1
                   }
                  }

        }



        &:hover{
          color: #1d78ff;
          background: #ddebff;
        }
        span{
          a{
            color: #222222;
           &:before{
           display: none;
          }
            &:hover{
              color: #222222;
              background: #ddebff;
            }
          }
        }
      }
    }
  }


  .logo{
    position: relative;
    width: 150px;
    height: 50px;

    .logo_b, .logo_w{
      position: absolute;
      top: 0px;
      left: 0;
      width: 128px;
      height: 32px;
      transition: opacity 0.3s ease;

      img{
        width: 128px;
        height: 32px;
        object-fit: contain;
      }
    }

    .logo_w{
      opacity: 0;
    }

    .logo_b{
      opacity: 1;
    }
  }



  .nav_list{
    display: flex;
    justify-content: space-between;
    align-items: center;

    .num{
      color: #ffffff;
      font-size: 14px;
      margin-left: 50px;
    }
     ul{
      display: flex;
      justify-content: space-between;
      margin:0;
      li{
        list-style: none;
        color: #ffffff;
        padding: 0;
        font-size: 14px;
        box-sizing: border-box;
        position: relative;

        a{
          color: #ffffff;
          text-decoration: none;
          cursor: pointer;
          display: inline-block;
          position: relative;
          height: 70px;
          line-height: 55px;
          &:before{
            content: "";
            position: absolute;
            z-index: 1;
            transition: all 0.4s cubic-bezier(0.25, 0.46, 0.45, 0.94);
            bottom: 0;
            background-color: #ffffff;
            height: 2px;
            left: 50%;
            right: 50%;
            border-radius: 2px 2px 0 0;
            opacity: 0;
          }
          &.active{
                      &:before{
                       opacity: 1;
                       left: 0;
                        right: 0;
                          }
                           }
        }




        &:hover{
          a{
            &:before{
              opacity: 1;
              left: 0;
              right: 0;
            }
          }
        }

        span{
          position: absolute;
          top: 70px;
          background: #fff;
          width: 200px;
          text-align: center;
          left: 50%;
          margin-left: -100px;
          box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.08);
          padding: 10px 0;
          border-radius: 4px;
          z-index: 999999;
          border-bottom: 1px solid #eeeeee !important;
          a{
            color: #333333;
            display: block;
            width: 100%;
            height: 50px;
            line-height: 50px;
            border-bottom: 1px solid #eeeeee !important;
            text-decoration: none;
            &:hover{
              color: #222222;
              background: #ddebff;
            }
          }
        }
      }

    }
  }

}

  .index_banner{
    width: 100%;
    height: 600px;
    text-align: center;
    position: relative;

    .carousel-item{
    height:600px !important;}

    .carousel-indicators{
    bottom:60px !important;
    }
    .content{
      width: 1400px;
      margin: 0 auto;
      text-align: center;
      color: #ffffff;

      h1{
        font-size: 60px;
        margin: 0;
      }
      p{
        font-size: 22px;
        margin-top: 10px;
      }
      .btn{
        border-radius: 50px;
       padding: 10px 30px;
        display: inline-block;
        background-color: rgb(65, 106, 234);
        box-shadow: 4.974px 3.355px 20px 0 rgba(6, 22, 46, 0.5);
      }
    }
    .info{
      width: 1400px;
      position: absolute;
      bottom: -50px;
      display: flex;
      justify-content: space-between;
      left: 50%;
      transform: translate(-50%);
      z-index: 999;
      .item{
        border-style: solid;
        border-width: 2px;
        border-color: rgb(255, 255, 255);
        border-radius: 4px;
        background: #ffffff;
        box-shadow: 0 5px 10px 0 rgba(35, 24, 21, 0.1);
        width: 24%;
        padding: 10px;
        p{
          margin: 0;
          text-align: center;
        }
        .num{
          font-size: 26px;
          color: #1483ff;
        }
        .text{
          color: #222222;
          font-size: 16px;
        }
        .notes{
          color: #697c9e;
          font-size: 14px;

        }

      }
    }

  }
/*新闻中心*/
.news_container{
  width: 1400px;
  margin: 80px auto 0;
  .title{
    text-align: center;
    .tit{
      margin: 0;
      padding: 0;
      font-size: 36px;
      color: #4c4b4b;

    }
    p{
      margin: 0;
      padding: 0;
      color: #999999;
      font-size: 14px;
    }
  }
  .new_main{
    width: 100%;
    display: flex;
    justify-content: space-between;
    margin-top: 20px;

    .new_left{
      width: 50%;
      background: #ffffff;
      box-shadow: 0 5px 10px 0 rgba(35, 24, 21, 0.1);
      padding: 10px;
      height:560px;
        .item{
          .img{
            width: 100%;

          }
          .text{
            .title{
              text-align: left;
              margin: 10px;
            }
          }
        }

    }
    .new_right{
      flex: 1;
      margin-left: 20px;
      ul{
      margin:0px;
      padding:0px;
      }

      .item{
        display: flex;
        border-bottom: 1px solid #eeeeee;
        padding-bottom: 10px;
        margin-bottom: 15px;
        .img{
          width: 170px;
          margin-right: 10px;
        }
        .info{
          width: calc(100% - 170px);
          text-align: left;

          p{
          margin-bottom:5px
          }
          .title{
            text-align: left;
            font-size: 16px;
            a{
            color: #222222;
font-size: 16px;
            }
          }
          .time{
            color: #999999;
            margin: 10px 0;
          }
          .text{
            color: #434343;
            font-size: 14px;
          }
        }
      }

    }
  }
}

/*推荐产品*/
  .product_container{
    width: 100%;
    background: #f8f8f8 url("../img/img3.png") no-repeat right bottom;
    padding: 50px;
    box-sizing: border-box;
    margin-top: 50px;
    .product_main{
      width: 1400px;
      margin: 0 auto;
      .title{
        text-align: center;
        .tit{
          margin: 0;
          padding: 0;
          font-size: 36px;
          color: #4c4b4b;
        }
        p{
          margin: 0;
          padding: 0;
          color: #999999;
          font-size: 14px;
        }
      }
      .product_wrap{
        width: 100%;
        .top_container{
          width: 100%;
          display: flex;
          margin-top: 30px;
          justify-content: space-around;
          .item{
            border-radius: 29px;
            padding: 10px 30px;
            color: #222222;
            cursor: pointer;
            &:hover{
              background: #1d78ff url("../img/img4.png") no-repeat right bottom;
              color: #ffffff;
            }
          }
          .active{
            background: #1d78ff url("../img/img4.png") no-repeat right bottom;
            color: #ffffff;
          }
        }
        .main_container{
          width: 100%;
          background: #ffffff;
          padding: 50px;
          border-radius: 4px;
          margin-top: 20px;
          display: flex;
          align-items: center;
          .left{
            width: 50%;
            padding-left: 50px;
            .title{
              text-align: left;
              font-size: 24px;
              font-weight: bold;
              margin-top: 20px;
            }
            .notes{
              color: #32344e;
              margin-top: 10px;
            }
            .info{
              margin-top: 30px;
              font-size: 14px;
              color: #536080;
              line-height: 30px;
              .list{
                vertical-align: middle;
                margin:5px;
                img{
                  margin-top: 0px;
                }
              }
            }
          }
          .right{
            text-align: center;
            padding-left: 50px;
          }
        }
      }

    }

  }
/*解决方案*/
  .solution{
    width:100% ;
    background: #ffffff;
    padding: 50px;
    box-sizing: border-box;
    .solution_container{
      width: 1400px;
       margin: 0 auto;
      .title{
        text-align: center;
        .tit{
          margin: 0;
          padding: 0;
          font-size: 36px;
          color: #4c4b4b;

        }
        p{
          margin: 0;
          padding: 0;
          color: #999999;
          font-size: 14px;
        }
      }
      .solution_main{
        width: 100%;
        display: flex;
        margin-top: 30px;
        flex-wrap: wrap;
        .item{
          width: 330px;
          height: 195px;
          position: relative;
          margin: 10px;
          overflow: hidden;
          .img{
            width: 100%;
            height: 100%;
            img{
              width: 100%;
              height: 100%;
              border-radius: 10px;
            }
          }

          .title{
            position: absolute;
            top:15px;
            left: 15px;
            background: rgba(0,0,0,0.23);
            padding: 10px 20px;
            border-radius: 50px;
            color: #ffffff;
            font-weight: bold;
            z-index: 2;
            transition: background 0.3s ease;
          }
          .info{
            width: 100%;
            height: 100%;
            background: rgba(0,22,60,0.6);
            border-radius: 10px;
            position: absolute;
            left: 0;
            top: 0;
            box-sizing: border-box;
            color: #ffffff;
            padding: 80px 20px;
            z-index: 1;
            opacity: 0;
            transform: translateY(100%);
            transition: all 0.4s ease;
            .more{
              text-align: right;
              margin-top: 60px;

              a{
              color:#ffffff;
              }
            }
          }
       &:hover{
         .info{
           opacity: 1;
           transform: translateY(0);
         }
         .title{
           background: #1d78ff;
         }
       }
        }
      }
    }
  }

  /*客户案例*/

  .case{
       width: 100%;
       background: #ecf5ff;
       padding: 20px 0 ;
       box-sizing: border-box;
       .case_container{
         width: 1400px;
         margin: 0 auto;
         .title{
           text-align: center;
           .tit{
             margin: 0;
             padding: 0;
             font-size: 36px;
             color: #4c4b4b;
           }
           p{
             margin: 0;
             padding: 0;
             color: #999999;
             font-size: 14px;
           }
         }
         .case_main{
           width: 100%;
           margin-top: 30px;
           display:flex;
           justify-content: space-between;
           padding-bottom:20px;

           .item{
             width: 440px;
             background: #ffffff;
             border-radius: 16px;
             img{
               width: 100%;
               height: 250px;
               border-radius: 20px;
             }
             .info{
               background: #ffffff;
               padding: 20px;
               border-radius: 20px;
               margin-top: -40px;
               position: relative;
               .title{
                 font-size: 18px;
                 text-align: left;
                 margin-bottom: 20px;
                 color: #222222;
                 a{
                  color: #222222;
                 }

               }
               .text{
                 font-size: 14px;
                 color: #575d63;
                  a{
                                   color: #222222;
                                  }
               }
               .details{
                 color: #1d78ff;
                 text-align: right;
                 font-size: 14px;
                 margin-top: 20px;
               }
             }
           }


         }
           .more_btn{
                       width:200px;
                       height:40px;
                       background:#1d78ff;
                       margin:0 auto;
                       text-align: center;
                       color:#fff;
                       line-height:40px;
                       border-radius:4px;
                       cursor: pointer;
                       transition: all 0.3s ease;
                       font-size: 14px;
                       a{
                       width:200px;
                       height:40px;
                        color:#fff;
                        text-decoration: none;
                        text-align: center;
                        display: block;
                       }
                       &:hover{
                         background:#1063e0;
                         transform: translateY(-5px);
                         box-shadow: 0 8px 20px rgba(29, 120, 255, 0.4);
                       }
                    }
       }
       .case_img{
         width: 100%;
         margin-top:20px;
         img{
           width: 100%
         }
       }
     }

  /*foot*/
    .foot_container{
      width: 100%;
      background: #0c1d35;
     .service-box{
       width:1400px;
       margin: 0 auto;
       background: #0c1d35;
       border-bottom:1px solid #142947;
       display:flex;
       padding:30px 0;
       justify-content: space-between;

       .service{
         display:flex;
         align-items: center;
         .img{

           margin-right: 10px;

         }
         .info{
         .tit{
           color: #ffffff;
           font-size: 14px;

         }
         .text{
           color: #cecece;
           font-size: 12px;
         }
         }
       }
     }
      .foot_bottem{
        width: 100%;
        background: #0c1d35;
        padding: 20px 0;
        .wrap{
          width: 1400px;
          margin: 0 auto;
          display: flex;
          justify-content: space-between;
          .item{
            .tit{
              color: #ffffff;
              font-size: 16px;
              margin-bottom: 10px;
            }
            .main{
              color: #cecece;
              font-size: 13px;
              p{
                cursor: pointer;
                line-height:1
              }
             .QRCode{
               display: flex;
               align-items: center;
               margin-top: 20px;
               img{
                 margin-right: 20px;
               }
             }
              .phone{
                margin-top: 20px;
                color: #ffffff;
                font-size: 14px;
              }
              .btn{
                background: #1d78ff;
                color: #ffffff;
                display: inline-block;
                padding: 6px 30px;
                border-radius: 4px;
                margin-top: 10px;
              }
            }
            .phone-title{
            font-size: 14px;
            color:#cecece;
            }
            .phone{
            color: #fff;
                margin: 3px 0 10px;
                font-size: 22px;
                font-weight: 600;
            }
            .address{
             color:#ffffff;
             font-size: 13px;
             margin-top: 10px;
            }
            .QRCode{
             display:flex;
             margin-top:5px;
             .item{
              text-align: center;
              margin-right:10px;
             .text{
                          font-size: 12px;
                          color:#7587a1;
                          text-align: center;
                          }
             }
            }
          }

        }
        .Copyright{
          width: 1400px;
          margin: 10px auto 0;
          border-top: 1px solid #20334e;
          color: #2f425d;
          text-align: center;
          font-size: 14px;
          padding-top: 10px;
        }
      }
    }
/*右侧客服*/
 .kefu{
      position:fixed;
      z-index:99999;
      top:30%;
      right:50px;
      width:48px;
      ul{
        li{
          position:relative;
          margin-bottom:12px;
          list-style: none;
          cursor: pointer;
          a, div{
            width:48px;
            height:48px;
            background:#fff;
            border:1px solid #eee;
            display:block;
            text-align:center;
            line-height:40px;
            color:#333;
            border-radius:50px;
            box-shadow: 0 4px 16px rgba(28,67,125,.08);
            transition: all 0.5s ease-out 0s;
            font-size: 18px;
            img{
              width:24px;
              height: 24px;
              margin: 12px auto;
            }
          }
          span{
            position: absolute;
            box-shadow: rgba(28, 67, 125, 0.08) 0 4px 16px;
            font-size: 16px;
            line-height: 22px;
            top: 0;
            text-align: center;
            right: 20px;
            padding: 16px 10px;
            white-space: nowrap;
            background: rgb(255, 255, 255);
            border-width: 1px;
            border-style: solid;
            border-color: rgba(180, 183, 192, 0.12);
            border-image: initial;
            border-radius: 4px;
            transition: 0.3s;
            font-weight: bold;
            color: #1d78ff;
            display: none;
            img{
              margin-right: 10px;
            }
           &::after {
              position: absolute;
              box-sizing: border-box;
              background-color: inherit;
              width: 12px;
              height: 12px;
              top: 20px;
              right: -4.25px;
              transform: rotate(315deg);
              content: "";
              transition: 250ms ease-in-out;
              border-right: 1px solid rgba(180, 183, 192, 0.12);
              border-bottom: 1px solid rgba(180, 183, 192, 0.12);
            }
          }
          &:hover{
            span{
              display: block;
          }
            a,div{
              background: #90ceff;
              border:1px solid #90ceff;
            }
        }
      }
      }
    }
    .model{
    position: fixed;
    bottom:50px;
    right:30px;
    z-index:99999;
    }
/*新闻中心*/
.new_container {
  background: #f6f8fa;
  padding-bottom:20px;
  .banner {
    width: 100%;
    height: 320px;
    background: url("../img/newbanner.png") no-repeat top center;
    .banner_main {
      width: 1400px;
      margin: 0 auto;
      padding-top: 135px;
      h2 {
        font-size: 60px;
        color: #ffffff;
        margin: 0;
        padding: 0;
      }
      p {
        margin: 0;
        color: #ffffff;
      }
    }
  }
  .new_container {
    width: 100%;
    .top {
      width: 100%;
      height: 60px;
      background: #ffffff;
      .wrap {
        width: 1400px;
        margin: 0 auto;
        display: flex;
        .list {
          font-size: 16px;
          line-height: 60px;
          cursor: pointer;
          position: relative;
          margin-right: 40px;
          a{
          color:#222222;
          text-decoration: none;
          }
          &.active {
            color: #006aff;
            &:before {
              opacity: 1;
            }
          }
          &:before {
            content: "";
            position: absolute;
            left: 0;
            bottom: 0;
            border-bottom: 3px solid #006aff;
            width: 100%;
            opacity: 0;
          }
          &:hover {
            color: #006aff;
            &:before {
              opacity: 1;
            }
          }
        }
      }
    }
    .new_main{
      width: 1400px;
      margin: 20px auto 0;
     padding-bottom:20px;
      a{
        text-decoration: none;
      }
      .wrap{
        width: 100%;
        background: #ffffff;
        padding: 20px;
        border-radius: 4px;
        margin-bottom: 20px;
        .item{
          display: flex;
          .info{
            padding-left: 20px;
            flex:1;
            .title{
              font-size: 18px;
              color: #222222;
              a{
              color:#222222;}
            }
            .text{
              margin-top: 10px;
              a{
               color: #696969;
               font-size: 14px;
              }
            }
            .time{
              color: #999999;
              margin-top: 10px;
              display: flex;
              align-items: center;
              span{
                padding-left: 5px;
              }
            }
          }
        }
        &:hover{
          box-shadow: 0 8px 30px rgba(45, 104, 255, 0.15)
        }
      }
    }
  }
  .new_container_detail {
      width: 100%;
      .breadcrumb{
      width:1400px;
      margin:0 auto;
      background:none;
      padding:0;
      margin-top:10px;
      .list-inline{
      margin:0 ! important;
      padding:0! important;
      }
      }
      .new_main{
        width: 1400px;
        margin: 10px auto 20px;
        background: #ffffff;
        min-height: 600px;
        border-radius: 4px;
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.05);
        padding: 20px 50px;
        border-top: 3px solid #1d78ff;
        .title{
          width: 100%;
          border-bottom: 1px solid #eeeeee;
          padding-bottom: 20px;
          .time{
            color: #999999;
          }
        }
        .main{
          padding: 20px 0;
          color: #666666;
          p{
            text-indent: 2rem;
            line-height: 2;
            font-size: 14px;
          }
          img{
            margin: 0 auto;
            max-width: 100%;
          }
        }
        .bottom{
          width: 100%;
          margin-top:20px;
          .item{
            padding: 20px;
            box-shadow: 0 0 5px rgba(0, 0, 0, 0.05);
            margin-bottom: 20px;
            cursor: pointer;
            font-size: 14px;

            .previous{
              font-size: 14px;
              margin-bottom: 20px;
              width:80px;
            }
            .title{
              font-size: 14px;
            }
            .info{
              width: 100%;
              color: #666666;
              a{
              color: #666666;
              text-decoration: none;
              }
            }
            &:hover{
              box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
            }
          }
        }
      }

    }
}

/*政策法规*/
.wenku_container {
  background: #f6f8fa;
  .banner {
    width: 100%;
    height: 320px;
    background: url("../img/falv_banner.png") no-repeat top center;
    .banner_main {
      width: 1400px;
      margin: 0 auto;
      padding-top: 135px;
      h2 {
        font-size: 60px;
        color: #ffffff;
        margin: 0;
        padding: 0;
      }
      p {
        margin: 0;
        color: #ffffff;
      }
    }
  }
  .new_container {
    width: 100%;

 .top {
      width: 100%;
      height: 60px;
      background: #ffffff;

      .wrap {
        width: 1400px;
        margin: 0 auto;
        display: flex;


        .list {
          font-size: 16px;
          line-height: 60px;
          cursor: pointer;
          position: relative;
          margin-right: 40px;
          a{
          color:#222222;
          text-decoration: none;

          }

          &.active {
            color: #006aff;
            &:before {
              opacity: 1;
            }
          }

          &:before {
            content: "";
            position: absolute;
            left: 0;
            bottom: 0;
            border-bottom: 3px solid #006aff;
            width: 100%;
            opacity: 0;
          }
          &:hover {
            color: #006aff;
            &:before {
              opacity: 1;
            }
          }
        }
      }
    }
  .new_main{
      width: 1400px;
      margin: 20px auto 0;
     padding-bottom:20px;
      a{
        text-decoration: none;
      }
      .wrap{
        width: 100%;
        background: #ffffff;
        padding: 20px;
        border-radius: 4px;
        margin-bottom: 20px;
        .item{
          display: flex;

          .info{

            flex:1;
            .title{
              font-size: 18px;
              color: #222222;
              a{
              color:#222222;}
            }
            .text{
              margin-top: 10px;
              a{
               color: #696969;
               font-size: 14px;
              }
            }
            .time{
              color: #999999;
              margin-top: 10px;
              display: flex;
              align-items: center;
              span{
                padding-left: 5px;
              }
            }

            .float-left{
              a{
              color:#666;
              }
            }
          }
        }
        &:hover{
          box-shadow: 0 8px 30px rgba(45, 104, 255, 0.15)
        }
      }
    }
  }

    .new_container_detail {
        width: 100%;
        .breadcrumb{
        width:1400px;
        margin:0 auto;
        background:none;
        padding:0;
        margin-top:10px;

        .list-inline{
        margin:0 ! important;
        padding:0! important;

        }
        }


        .new_main{
          width: 1400px;
          margin: 10px auto 20px;
          background: #ffffff;
          min-height: 600px;
          border-radius: 4px;
          box-shadow: 0 0 5px rgba(0, 0, 0, 0.05);
          padding: 20px 50px;
          border-top: 3px solid #1d78ff;

          .title{
            width: 100%;
            border-bottom: 1px solid #eeeeee;
            padding-bottom: 20px;

            .time{
              color: #999999;
            }
          }
          .main{
            padding: 20px 0;
            color: #666666;
            p{
              text-indent: 2rem;
              line-height: 2;
              font-size: 14px;
            }
            img{
              margin: 0 auto;
              max-width: 100%;
            }
          }
          .bottom{
            width: 100%;
            margin-top:20px;
            .item{
              padding: 20px;
              box-shadow: 0 0 5px rgba(0, 0, 0, 0.05);
              margin-bottom: 20px;
              cursor: pointer;
              font-size: 14px;

              .previous{
                font-size: 14px;
                margin-bottom: 20px;
                width:80px;
              }
              .title{
                font-size: 14px;
              }
              .info{
                width: 100%;
                color: #666666;
                a{
                color: #666666;
                text-decoration: none;
                }
              }
              &:hover{
                box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
              }
            }
          }
        }

      }


}

/*产品*/

.case_container{
  background: #f6f8fa;
  .banner {
    width: 100%;
    height: 320px;
    background: url("../img/case_banner.png") no-repeat top center;
    .banner_main {
      width: 1400px;
      margin: 0 auto;
      padding-top: 135px;
      h2 {
        font-size: 60px;
        color: #ffffff;
        margin: 0;
        padding: 0;
      }
      p {
        margin: 0;
        color: #ffffff;
      }
    }
  }
  .case_main{
    width: 100%;
    padding-bottom: 50px;
    .top{
      background: #ffffff;
      height: 60px;
      padding-top: 20px;

      .top_wrap{
        width: 1400px;
        margin: 0 auto;
        display: flex;
        align-items: center;
        .title{
          margin-right: 20px;
          .line{
            color: #999999;
            margin-left: 20px;
          }
        }
        .num{
          display: flex;
          .item{
            color: #666666;
            margin-right: 20px;
            a{
            color:#222222;
            text-decoration: none;
            padding: 6px 30px;
            border-radius: 50px;
            cursor: pointer;

            &.active{
             background: #2e57e9;
             color: #ffffff;
             }
              &:hover{
              background: #2e57e9;
              color: #ffffff;
              }

            }

          }
        }

      }

    }

    .case_main_wrap{
      width: 1400px;
      margin: 30px auto;
      position: relative;
      display: flex;
      flex-wrap: wrap;
      a{
        text-decoration: none;
      }

      .item{
        width: 440px;
        background: #ffffff;
        border-radius: 16px;
        margin: 10px;
        box-shadow: 0 0 20px rgba(0, 0, 0, 0.05);
        transition: all 0.4s ease;
        cursor: pointer;
        &:hover{
          transform: translateY(-8px);
          box-shadow: 0 12px 30px rgba(0, 0, 0, 0.15);
        }
        .img{
          width: 100%;
          height: 250px;

          img{
          width: 100%;
                    height: 250px;
                    border-radius: 20px 20px 0 0;
          }
        }
        .info{
          background: #ffffff;
          padding: 20px;
          border-radius: 20px;
          margin-top: -40px;
          position:relative;
          z-index:9;

          .title{
            font-size: 18px;
            text-align: left;
            margin-bottom: 20px;
            color: #222222;

          }
          .text{
            font-size: 14px;
            color: #575d63;
          }
          .details{
            color: #1d78ff;
            text-align: right;
            font-size: 14px;
            margin-top: 20px;
          }
        }
      }
    }

.page{
width:1400px;
margin:0 auto;
}
  }
}






.case_container_detail{
  background: #f6f8fa;
  .banner {
    width: 100%;
    height: 320px;
    background: url("../img/case_banner.png") no-repeat top center;
    .banner_main {
      width: 1400px;
      margin: 0 auto;
      padding-top: 135px;
      h2 {
        font-size: 60px;
        color: #ffffff;
        margin: 0;
        padding: 0;
      }
      p {
        margin: 0;
        color: #ffffff;
      }
    }
  }

  .breadcrumb{
  width:1400px;
  margin:0 auto;
  background:none;
  padding:0;
  }
  .case_main{
    width: 100%;
    padding-bottom: 50px;
    .top{
      background: #ffffff;
      height: 60px;
      padding-top: 20px;

      .top_wrap{
        width: 1400px;
        margin: 0 auto;
        display: flex;
        align-items: center;
        .title{
          margin-right: 20px;
          .line{
            color: #999999;
            margin-left: 20px;
          }
        }
        .num{
          display: flex;
          .item{
            color: #666666;
            padding: 6px 30px;
            border-radius: 50px;
            cursor: pointer;
            margin-right: 20px;
            &.active{
              background: #2e57e9;
              color: #ffffff;
            }
            &:hover{
              background: #2e57e9;
              color: #ffffff;
            }
          }
        }
      }
    }
      .new_main{
        width: 1400px;
        margin: 0px auto 20px;
        background: #ffffff;
        min-height: 600px;
        border-radius: 4px;
        box-shadow: 0 0 5px rgba(0, 0, 0, 0.05);
        padding: 20px 50px;
        border-top: 3px solid #1d78ff;

        .title{
          width: 100%;
          border-bottom: 1px solid #eeeeee;
          padding-bottom: 20px;
          text-align: center;


        }
        .main{
          padding: 20px 0;
          color: #666666;

          p{
            text-indent: 2rem;
            line-height: 2;
            font-size: 16px;
          }
          img{
            margin: 0 auto;
            max-width: 100%;
          }
        }

      }
    }



}


/*网上公开*/
.public_container {
  background: #f6f8fa;

  .banner {
    width: 100%;
    height: 320px;
    background: url("../img/ziyuan_banner.png") no-repeat top center;
    .banner_main {
      width: 1400px;
      margin: 0 auto;
      padding-top: 135px;
      h2 {
        font-size: 60px;
        color: #ffffff;
        margin: 0;
        padding: 0;
      }
      p {
        margin: 0;
        color: #ffffff;
      }
    }
  }
  .new_container {
    width: 1400px;
    margin: 20px auto 0;
    display: flex;
    .left{
      width: 250px;
      box-sizing: border-box;
      background: #ffffff;
      border-radius: 4px;
      .top{
        width: 100%;
        background: #3f79ff;
        text-align: center;
        color: #ffffff;
        line-height: 40px;
        border-radius: 4px 4px 0 0;
        font-weight: bold;
      }
      .main{
        padding: 10px;
        .list{
          margin-bottom: 5px;
          border-radius: 4px;
          border-left: 4px solid #ffffff;
          a{
                    cursor: pointer;
                    color: #222222;
                    display:block;
                    text-decoration: none;
                    border-radius:4px;
                    padding:10px;
                    font-size: 14px;
          }
          &:hover{
            background: #e4ecff;
            color: #3f79ff;
            border-left: 4px solid #3f79ff;
          }

        }
         .active{
                          background: #e4ecff;
                          border-left: 4px solid #3f79ff;
                          color: #3f79ff;
                          }


        &:last-child{
          border-bottom: none;
        }
      }
    }
    .right_main{
      flex: 1;
      margin-left: 20px;
      background: #ffffff;
      padding: 10px;
      font-size: 14px;
      min-height: 500px;
      line-height: 2;



      a{
        color: #222222;
        text-decoration: none;
      }
      .wrap{
        width: 100%;
        border-bottom: 1px dashed #eeeeee;
        padding: 20px 10px;
        box-sizing: border-box;
        display: flex;
        justify-content: space-between;
        cursor: pointer;
        .time{
          color: #999999;
        }

      }
      .wrap_list{
      margin-bottom:20px;}
    }
    .right_main1{
     flex: 1;
          margin-left: 20px;
          background: #ffffff;
          padding: 10px;
          border-top: 4px solid #1d78ff;
          border-radius: 4px 4px 0 0;

          .top{
                  text-align: center;
                  border-bottom: 1px solid #eeeeee;
                  padding-bottom: 10px;

                  .title{
                    font-weight: bold;
                    font-size: 1.5em;
                  }
                  .time{
                    color: #999999;
                    font-size: 14px;
                    margin-top: 10px;
                  }
                }

                .new_main{

                        .title{
                          width: 100%;
                          border-bottom: 1px solid #eeeeee;
                          padding-bottom: 20px;
                          font-size: 1.5em;
                          text-align: center;

                          .time{
                            color: #999999;
                          }
                        }
                        .main{
                          padding: 20px 0;
                          color: #666666;
                          p{
                            text-indent: 2rem;
                            line-height: 2;
                            font-size: 14px;
                          }
                          img{
                            margin: 0 auto;
                            max-width: 100%;
                          }
                        }
                        .bottom{
                          width: 100%;
                          margin-top:20px;
                          .item{
                            padding: 20px;
                            box-shadow: 0 0 5px rgba(0, 0, 0, 0.05);
                            margin-bottom: 20px;
                            cursor: pointer;
                            font-size: 14px;

                            .previous{
                              font-size: 14px;
                              margin-bottom: 20px;
                              width:80px;
                            }
                            .title{
                              font-size: 14px;
                            }
                            .info{
                              width: 100%;
                              color: #666666;
                              a{
                              color: #666666;
                              text-decoration: none;
                              }
                            }
                            &:hover{
                              box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
                            }
                          }
                        }
                      }






          }
  }
}


.about_container{
background: #f6f8fa;
  .banner{
    width: 100%;
    height: 320px;
    background: url("../img/about_banner.png") no-repeat top center;
    .banner_main{
      width: 1400px;
      margin: 0 auto;
      padding-top: 135px;
      h2{
        font-size: 60px;
        color: #014ea0;
        margin: 0;
        padding: 0;
      }
      p{
        margin: 0;
        color: #323232;
      }
    }
  }

    .banner1{
      width: 100%;
      height: 320px;
      background: url("../img/public_banner.png") no-repeat top center;
      .banner_main{
        width: 1400px;
        margin: 0 auto;
        padding-top: 135px;
        h2{
          font-size: 60px;
          color: #014ea0;
          margin: 0;
          padding: 0;
          color: #ffffff;
        }
        p{
          margin: 0;
          color: #ffffff;
        }
      }
    }



      .banner_fuwu {
        width: 100%;
        height: 320px;
        background: url("../img/fuwu_banner.png") no-repeat top center;
        .banner_main {
          width: 1400px;
          margin: 0 auto;
          padding-top: 135px;
          h2 {
            font-size: 60px;
            color: #ffffff;
            margin: 0;
            padding: 0;
          }
          p {
            margin: 0;
            color: #ffffff;
          }
        }
      }

       .banner_pro {
              width: 100%;
              height: 320px;
              background: url("../img/pro_banner.png") no-repeat top center;
              .banner_main {
                width: 1400px;
                margin: 0 auto;
                padding-top: 135px;
                h2 {
                  font-size: 60px;
                  color: #ffffff;
                  margin: 0;
                  padding: 0;
                }
                p {
                  margin: 0;
                  color: #ffffff;
                }
              }
            }



  .new_container {
    width: 1400px;
    margin: 20px auto 0;
    display: flex;
    .left{
      width: 250px;
      box-sizing: border-box;
      background: #ffffff;
      border-radius: 4px;
      .top{
        width: 100%;
        background: #3f79ff;
        text-align: center;
        color: #ffffff;
        line-height: 40px;
        border-radius: 4px 4px 0 0;
        font-weight: bold;
      }
      .main{
        padding: 10px;
        .list{
          margin-bottom: 5px;
          border-radius: 4px;
          border-left: 4px solid #ffffff;
          a{
                    cursor: pointer;
                    color: #222222;
                    display:block;
                    text-decoration: none;
                    border-radius:4px;
                    padding:10px;
                    font-size: 14px;
          }
          &:hover{
            background: #e4ecff;
            color: #3f79ff;
            border-left: 4px solid #3f79ff;
          }

        }
         .active{
                          background: #e4ecff;
                          border-left: 4px solid #3f79ff;
                          color: #3f79ff;
                          }


        &:last-child{
          border-bottom: none;
        }
      }
    }
    .right_main{
      flex: 1;
      margin-left: 20px;
      background: #ffffff;
      padding: 10px;
      font-size: 14px;
      border-top: 4px solid #1d78ff;
      border-radius: 4px 4px 0 0;

      a{
        color: #222222;
        text-decoration: none;
      }
      .wrap{
        width: 100%;
        border-bottom: 1px dashed #eeeeee;
        padding: 20px 10px;
        box-sizing: border-box;
        display: flex;
        justify-content: space-between;
        cursor: pointer;
        .time{
          color: #999999;
        }

      }
      .wrap_list{
      margin-bottom:20px;}
    }
    .right_main1{
     flex: 1;
          margin-left: 20px;
          background: #ffffff;
          padding: 10px;
          border-top: 4px solid #1d78ff;
          border-radius: 4px 4px 0 0;

          .top{
                  text-align: center;
                  border-bottom: 1px solid #eeeeee;
                  padding-bottom: 10px;

                  .title{
                    font-weight: bold;
                    font-size: 1.5em;
                  }
                  .time{
                    color: #999999;
                    font-size: 14px;
                    margin-top: 10px;
                  }
                }

                .new_main{

                        .title{
                          width: 100%;
                          border-bottom: 1px solid #eeeeee;
                          padding-bottom: 20px;
                          font-size: 1.5em;
                          text-align: center;

                          .time{
                            color: #999999;
                          }
                        }
                        .main{
                          padding: 20px 0;
                          color: #666666;
                          p{
                            text-indent: 2rem;
                            line-height: 2;
                            font-size: 14px;
                          }
                          img{
                            margin: 0 auto;
                            max-width: 100%;
                          }
                        }
                        .bottom{
                          width: 100%;
                          margin-top:20px;
                          .item{
                            padding: 20px;
                            box-shadow: 0 0 5px rgba(0, 0, 0, 0.05);
                            margin-bottom: 20px;
                            cursor: pointer;
                            font-size: 14px;

                            .previous{
                              font-size: 14px;
                              margin-bottom: 20px;
                              width:80px;
                            }
                            .title{
                              font-size: 14px;
                            }
                            .info{
                              width: 100%;
                              color: #666666;
                              a{
                              color: #666666;
                              text-decoration: none;
                              }
                            }
                            &:hover{
                              box-shadow: 0 0 5px rgba(0, 0, 0, 0.1);
                            }
                          }
                        }
                      }

          }
  }


}

.message_container{
width:1400px;
 margin:0 auto;
}


.solution_container1{
  background: #f0f9ff;
  .banner {
    width: 100%;
    height: 320px;
    background: url("../img/solution_banner.png") no-repeat top center;
    .banner_main {
      width: 1400px;
      margin: 0 auto;
      padding-top: 135px;
      h2 {
        font-size: 60px;
        color: #ffffff;
        margin: 0;
        padding: 0;
      }
      .s_tit{
        font-size: 28px;
        color: #ffffff;
      }
      p {
        color: #ffffff;
        margin-top: 5px;
      }
    }
  }
  .block1{
    width: 100%;
    margin-top: 30px;
    .block1_main{
      width: 100%;
      text-align: center;



      .title{
        font-size: 38px;
        color: #2c2c2c;
      }
      .s_img1{
        margin-top: 20px;
      }
      .block1_mid{
        width: 1440px;
        margin: 0 auto;
        padding-bottom: 50px;
        padding-top: 50px;


        .top{
          width: 100%;
          background: #ffffff;
          display: flex;
          justify-content: space-around;
          height: 62px;
          border-radius: 4px;
          box-shadow: 0px 0px 10px 0px rgba(203, 203, 203, 0.32);
          line-height: 62px;
          .item{
            width: 33.34%;
            text-align: center;
            cursor: pointer;
            display: flex;
            align-items: center;
            justify-content: center;


            &:hover{
              background: #1c4eff url("../img/solution_img5.png") no-repeat top center;
              color: #ffffff;
              background-size: 100% 100%;
            }
            &.active{
              background: #1c4eff url("../img/solution_img5.png") no-repeat top center;
              color: #ffffff;
              background-size: 100% 100%;
            }
          }
        }
        .block1_wrap{
          width: 100%;
          background: #ffffff;
          border-radius: 4px;
          padding: 50px;
          box-sizing: border-box;
          margin-top: 20px;
          display: flex;
          align-items: center;
          .info{
            width: 60%;
            text-align: left;
            .title{
              font-size: 48px;
              color: #2a6df9;
              font-weight: bold;
            }
            .s_title{
              margin-top: 30px;
              color: #444444;
            }
            .main{
              margin-top: 40px;
              p{
                display: flex;
                align-items: center;
                color: #666666;
                img{
                  margin-right: 10px;
                }
              }
            }
          }
          .block1_img{
            flex: 1;
          }
        }
      }
    }
  }

.block2{
  width: 100%;
  padding-top: 30px;
  .block2_main{
    width: 1400px;
    margin: 0 auto;

    .title{
      text-align: center;
      .tit{
        color: #181818;
        font-size: 36px;
      }
      p{
        font-size: 16px;
        color: #999999;
        margin: 0;
      }
    }
    .block2_wrap{
      width: 100%;
      display: flex;
      justify-content: space-between;
      margin-top: 40px;
      padding-bottom: 60px;
      .item{
        width: 268px;
        background: #ffffff;
        border-style: solid;
        border-width: 1px;
        border-color: rgb(231 240 255);
        border-radius: 6px;
        background-image: -moz-linear-gradient( 120deg, rgb(238,245,255) 0%, rgb(255,255,255) 100%);
        background-image: -webkit-linear-gradient( 120deg, rgb(238,245,255) 0%, rgb(255,255,255) 100%);
        background-image: -ms-linear-gradient( 120deg, rgb(238,245,255) 0%, rgb(255,255,255) 100%);
        padding: 30px 30px;
        box-sizing: border-box;
        box-shadow: 0 0 10px 0 rgba(203, 203, 203, 0.32);
        transition: all 0.5s ease;
        text-align: left;

        .img{
          transition: opacity 0.3s ease, visibility 0.3s ease;
          opacity: 1;
          visibility: visible;
        }
        .title{
          transition: color 0.3s ease;
          font-size: 24px;
          color: #222222;
          margin: 30px auto  50px;

        }
        .text{
          color: #666666;
          transition: color 0.3s ease;
        }

        &:hover{
          color: #ffffff;
          width: 548px;
          background: url("../img/solution_img11.png") no-repeat top center;
          text-align: left;
          padding: 30px;
          .img{
            opacity: 0;
            visibility: hidden;
          }
          .title{
            font-size: 24px;
            color: #ffffff;
            margin: 30px auto  50px;
            text-align: left;
          }
          .text{
            color: #ffffff;
            text-align: left;
          }
        }

      }
      .active{
        color: #ffffff;
        width: 548px;
        background: url("../img/solution_img11.png") no-repeat top center;
        text-align: left;
        padding: 30px;
        .img{
          opacity: 0;
          visibility: hidden;
        }
        .title{
          font-size: 24px;
          color: #ffffff;
          margin: 30px auto  50px;
          text-align: left;
        }
        .text{
          color: #ffffff;
          text-align: left;
        }
      }
    }
  }

}

  .solution{
    width:100% ;
    background: #ffffff;
    padding: 50px;
    box-sizing: border-box;
    .solution_container{
      width: 1400px;
      margin: 0 auto;
      .title{
        text-align: center;
        .tit{
          margin: 0;
          padding: 0;
          font-size: 36px;
          color: #4c4b4b;

        }
        p{
          margin: 0;
          padding: 0;
          color: #999999;
          font-size: 14px;
        }
      }
      .solution_main{
        width: 100%;
        display: flex;
        margin-top: 30px;
        flex-wrap: wrap;
        .item{
          width: 330px;
          height: 195px;
          position: relative;
          margin: 10px;
          overflow: hidden;
          .img{
            width: 100%;
            height: 100%;
            img{
              width: 100%;
              height: 100%;
              border-radius: 10px;
            }
          }

          .title{
            position: absolute;
            top:15px;
            left: 15px;
            background: rgba(0,0,0,0.23);
            padding: 10px 20px;
            border-radius: 50px;
            color: #ffffff;
            font-weight: bold;
            z-index: 2;
            transition: background 0.3s ease;
          }
          .info{
            width: 100%;
            height: 100%;
            background: rgba(0,22,60,0.6);
            border-radius: 10px;
            position: absolute;
            left: 0;
            top: 0;
            box-sizing: border-box;
            color: #ffffff;
            padding: 80px 20px;
            z-index: 1;
            opacity: 0;
            transform: translateY(100%);
            transition: all 0.4s ease;
            .more{
              text-align: right;
              margin-top: 20px;
            }
          }
          &:hover{
            .info{
              opacity: 1;
              transform: translateY(0);
            }
            .title{
              background: #1d78ff;
            }
          }


        }
      }
    }
  }
}
.right_main{
min-height: 500px;
line-height: 2;

.cm-ff-yh{
      font-size: 1.2rem;
       background: #f9f9f9;
       padding: 0.5rem;
}
img{
max-width: 100%;
}
}
.breadcrumb .list-inline-item a{
 color:#222222;
 font-size:14px;
}

.edu_container{
 position: fixed;
 width:100%;
 height:100%;
 z-index:999999;
 background:rgba(0,0,0,0.5);
 top:0;
 left:0;
 display:none;
 align-items:center;
 justify-content:center;
 transition: background 0.3s ease;
}
.edu_container.show{
 display:flex;
}
 .edu_mainer{
 width:400px;
 background:#ffffff;
 border-radius:4px;
 .top{
 width:100%;
 border-bottom:1px solid #e5e5e5;
 padding:10px;
 display:flex;
 justify-content:space-between;
 align-items:center;

 .close{
 cursor:pointer;
 }
 }
 .edu_main{
 width:100%;
 padding:20px;
 text-align:center;
 .tip{
 width:100%;
 background:#f9f7f1;
 padding:5px 10px;
 border-radius:4px;
 border:1px solid #f3f0f0;
 font-size:14px;
 margin-bottom:10px;
 }
 .QRCode{
  width:200px;
  height:200px;
  margin:0 auto;
  background:#ffffff;
  padding:4px;
  box-shadow:0 0 10px 0 rgba(203,203,203,0.32);
  img{
    width:100%;
    height:100%;
  }
 }
 .text{
  text-align:center;
  font-size:14px;
 }
 }
 }
 }