@charset "utf-8";
html, body {margin: 0px;padding: 0px;}
IMG {border-width:0px;}


*{list-style-type: none;margin: 0;padding: 0;font-family: 'Open Sans', sans-serif;}
a{ text-decoration:none !important; color:#555}
a:hover{ text-decoration:none; }

/*导航*/

/*小屏图标*/
.navbar-toggle{ margin-top:10px !important; margin-bottom:10px !important; border:solid 1px #333 !important; margin-right: 10px}
.navbar-toggle .icon-bar{ background:#333}
.navbar-toggle{ border:solid 1px #666; padding:7px 7px}
.carousel-control.right,.carousel-control.left{ background-image:none}
.carousel-indicators .active{ background:#333 !important; }
.carousel-indicators{ bottom:0;}
.carousel-indicators li{ background:#ccc;}
.carousel-control.right,.carousel-control.left{ background:none !important}
.Language{width:100%;background: #fafafa;overflow: hidden}
.carousel-indicators .active{background: #104e8b!important;}
.carousel-inner .item img{width:100% !important;margin: 0 auto!important; height: auto}
.pck img{width: 100%;height: auto}

@media (min-width: 769px) {
    .head-top {
          background: #f6f6f6;
          width: 100%;
          padding: 5px 0;
          transition: all .3s
      }

    .head-top-box {
        max-width: 1300px;
        margin: 0 auto;
        padding: 0 15px;
        display: flex;
        justify-content: space-between;
        align-items: center
    }

    .head-top-box .left {
        font-size: 14px;
        color: #848484
    }

    .head-top-box .right {
        font-size: 14px;
        display: flex;
        align-items: center;
    }

    .head-top-box a {
        padding: 0 10px;
        border-right: dashed 1px #dedede;
        align-items: center;
        justify-content: right
    }

    .head-top-box .right span {
        color: #DC7C1A;
        padding-right: 10px;
        font-size: 16px
    }

    .head-top-box a:last-child {
        border-right: none
    }

    .indbg {
        width: 100%;
        transition: all .3s
    }

    .indbg.xz .head-top {
        display: none;
        transform: translateY(0)
    }

    .topbg {
        width: 100%;background:#fff;
        margin: 0px auto;
    }

    .nav-box .container {
        width: 100%;
        padding: 0
    }

    .logo1 {
        float: left;
        margin-top: 10px;
        width: 80%;
        height: auto;
    }
    .topbg .col-md-3 {
        padding: 0
    }
    /*.indbg.xz .topbg {*/
    /*    display: none*/
    /*}*/
    .nav-box{max-width: 1300px;margin:0 auto;padding: 0 15px}

    .indbg .topbg1 {
        display: none;
        width: 100%;background: #fff;
        position: fixed;
        z-index: 99;
        transition: all .3s;
        opacity: 0
    }

    .indbg.xz .topbg {
        width: 100%;background: #fff;
        display: block; animation: ease-in banner-dh .6s;
        opacity: 1;
        position: fixed;
        z-index: 99;
        transform: translateY(0)
    }
    .nav-message{width:150px;margin-top: 25px;font-size: 16px;align-items: center;display: flex;justify-content: center;
        background:#DC7C1A;color: #fff;text-align: center;padding: 15px  0}
    .nav-message:hover{background: #222;color: #fff}


    /*导航*/
    .navbar-collapse {
        padding: 0 !important
    }

    .navbar-nav {
        margin-top: 30px;
        display: flex;
        width: 100%;
        justify-content: space-between;
        justify-content: center;
        align-items: center;
    }

    .navbar-nav > li > a.active {
        color: #DC7C1A;
        display: block;
    }

    .navbar-nav > li {
        margin-top: 5px;
        display: inline-flex;
        flex: 1;
        justify-content: center;
        align-items: center;
    }

    .navbar-nav > li:last-child {
        border-right: none
    }

    .navbar-nav > li > a {
        padding: 15px 0 25px !important;
        color: #333;
        text-shadow: none !important;
        font-size: 16px;
    }

    .navbar-header {
        border-top: solid 10px #eee
    }

    .nav .open > a, .nav .open > a:focus, .nav .open > a:hover {
        color: #333
    }

    .dropdown-menu {
        border-top:solid 3px #009db7 ;
        background: rgba(0,0,0, .6);
        padding: 10px
    }
    /*.dropdown-menu:before{*/
    /*    content:"";width: 105%;height: 3px;background: #009db7;margin:-11px 0 11px;display: block;position: relative;z-index: 9}*/

    .dropdown-menu > li a {
        line-height: 30px;
        font-size: 14px;
        text-align: center;
        padding:5px 20px;color: #fff!important;
        margin:0 -8px
    }

    .dropdown-menu > li a:hover {
        background: #DC7C1A;
        color: #fff
    }


    .nav > li > a:focus, .nav > li > a:hover {
        background: none !important
    }

.dropdown a:hover .dropdown-menu
{
    opacity: 1; animation:navdh ease-in .3s;animation-iteration-count: 1;
}

    .nav .open > a, .nav .open > a:focus, .nav .open > a:hover {
        background: none !important
    }

    .dropdown-menu img {
        display: block;
        margin: 5px auto
    }

    .pck {
        position: relative;
        height: 100%;
    }

    .pck .swiper {    width: 100%;
        height: 100%;
    }
    .pck .swiper-slide {
        text-align: center;
        font-size: 18px;
        background: #fff;
        display: flex;
        justify-content: center;
        align-items: center;
    }
    .pck .swiper-slide img {
        display: block;
        width: 100%;
        height: 100%;
        object-fit: cover;
    }
    .pck .swiper-pagination-bullet {
        background: #fff !important;
        width: 15px !important;
        height: 15px !important;
        opacity: .6 !important;

    }

    .pck .swiper-pagination-bullet-active {
        width: 20px !important;
        height: 20px !important;
        border: 2px solid #fff !important;
        padding: 2px;
        background: #fff !important;
        background-clip: content-box !important;
        opacity: 1 !important;
    }

    .pck .swiper-pagination {
        z-index: 10;
        display: flex;
        flex-flow: column;
        align-items: center;
        justify-content: center;
    }

    .pck .swiper-pagination {
        right: 35px !important;
    }
    .box{max-width: 1300px;margin:0 auto;padding: 0 15px}
   .about-box{
      width: 100%;
        padding:60px 60px;
        background-color: #fff;
        -webkit-box-shadow: 0px 21px 35px 0 RGBA(28, 58, 104, 0.1);
        box-shadow: 0 21px 35px 0 RGBA(28, 58, 104, 0.1);
        position: relative;
        z-index: 10;
        margin-top: -100px;
        margin-bottom: 100px;
       border:solid 1px #efefef;

    }
   .about-box:after{
       top:-25px;
       transform: scaleX(0.948);width: 96%;left: 2%;
       opacity: 0.7;
       content: "";display: block;background: #fff;height: 100px;
       position: absolute;
       z-index: -1;
   }
    .about-box:before{
        top:-50px;
        transform: scaleX(0.948);width: 94%;left: 3%;
        opacity: 0.7;
        content: "";display: block;background: #fff;height: 100px;
        position: absolute;
        z-index: 7;
    }
   .about-box{
       .h1{    text-transform: uppercase;color: #DC7C1A;font-size: 17px;}
       .about-title{font-size: 36px;font-weight: 800;line-height: 44px;color: #333}
       .about-article{width: 85%;margin-top: 15px;
           font-size: 20px;line-height: 30px;color:#999;  display: -webkit-box;
           overflow: hidden;
           -webkit-line-clamp: 3;
           text-overflow: ellipsis;
           -webkit-box-orient: vertical;
           min-height: 90px;
       }
       .about-case{
              border-top: solid 1px #dedede;padding-top: 30px;overflow: hidden;margin-top: 30px;
              .h2{font-size:24px;font-weight:700}
              p{font-size: 15px;color:#666;line-height: 26px}
       }
       .about-right{width: 100%;overflow: hidden;cursor: pointer}
       .about-right img{transition: all .3s}
       .about-right:hover img{transform: scale(1.2)}
   }
    .pro-box {
        background-color: #056878;
        padding: 110px 0 200px;
        position: relative;
        margin-bottom: 260px;
        height: 700px;
    }
    .pro-title{font-size: 40px;color:#fff;line-height: 42px;font-weight: 800}
    .pro-summary{font-size:15px;line-height:26px;color: #fff;margin-top: 25px}
    .pro-more{display: block;font-size: 18px;
        margin: 25px 0;
        background: #DC7C1A;width: 160px;text-align: center;padding:15px 0;color:#fff;
     }
    .pro-more:hover{color: #DC7C1A;background: #fff}
    .pro-pro{width:98%;float: right;position: relative;z-index: 2}
    .pro-pro  li{width: 48.5%;float: left;margin-bottom:20px;overflow:hidden}
    .pro-pro img{transition:all .3s}
    .pro-pro li:hover img{transform: scale(1.1)}
    .pro-pro li:nth-child(even){float: right}
    .pro-float{width:540px;position: absolute;left:40px;bottom:-25%;animation: profloat 5s ease-in infinite;z-index: 0}
    .case-title{text-align: center;  }
    .case-title h2{font-size: 40px;text-align:center;color: #222;font-weight:700}
    .case-title p{font-size: 20px;color: #222}
    .case-box{max-width: 1300px;position: relative;margin:80px auto;overflow: hidden}
    .caseimg{position: relative;overflow:hidden}
    .caseimg .title{position: absolute;z-index: 9;padding:5px 0 5px 20px ;
        width: 100%;background:rgba(0,0,0,.6);
        text-align: left;color: #fff;bottom: 0;left: 0;font-size: 20px;line-height: 45px;box-sizing: border-box}
    .case-box .swiper{padding-bottom: 60px;}
    .case-box  .swiper-pagination-bullet-active{background:#DC7C1A!important;width: 20px;height: 20px;border: solid 2px #DC7C1A!important;}
    .case-box  .swiper-pagination-bullet{width: 15px!important;height: 15px!important;background: #fff;border: solid 2px #222;}
    .caseimg img{transition:  all .3s;width: 100%;height: 455px;object-fit: cover}
    .caseimg:hover img{transform:scale(1.2)}
    .feature-one {
        position: relative;width: 100%;overflow: hidden;
    }

    .feature-one::before {
        content: '';
        position: absolute;
        bottom: 0;
        left: 0;
        width: 100%;
        height: calc(100% - 120px);
        background-color: #16172e;
    }

    .feature-one .container {
        position: relative;
    }

    .feature-one .block-title {
        position: relative;
        z-index: 10;
    }

    .feature-one .block-title__title {
        color: #fff;
    }

    .feature-one .block-title__tag-line,
    .feature-one .block-title__text {
        color: rgba(255, 255, 255, 0.7);
    }

    .feature-one__person {
        position: absolute;
        bottom: 0;
        left: 3%;
    }

    .feature-one__block {
        position: relative;
        padding-left: 35px;
        padding-top: 100px;
        padding-bottom: 100px;
    }

    .feature-one__block::after {
        content: '';
        width: 100000px;
        background-color: #056878;
        height: 100%;
        position: absolute;
        left: -20%;
        top: 0;
        -webkit-transform: skew(-10deg);
        transform: skew(-10deg);
    }

    .feature-one__single {
        position: relative;
        z-index: 10;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
    }

    .feature-one__single+.feature-one__single {
        margin-top: 50px;
    }

    .feature-one__title {
        font-weight: 500;
        font-size: 24px;
        color: #fff;
        margin: 0;
        line-height: 1em;
        margin-bottom: 10px;
    }

    .feature-one__title a {
        color: inherit;
        -webkit-transition: all .4s ease;
        transition: all .4s ease;
    }

    .feature-one__title a:hover {
        color: #DC7C1A;
    }

    .feature-one__text {
        margin: 0;
        color: rgba(255, 255, 255, 0.7);
        font-size: 15px;
        line-height: 26px;
        width: 82%;
    }

    .feature-one__icon i {
        width: 75px;
        height: 75px;
        background-color: rgba(255, 255, 255, 0.2);
        border-radius: 50%;
        text-align: center;
        display: -webkit-box;
        display: -ms-flexbox;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        align-items: center;
        margin-right: 30px;
        font-size: 34px;
        color: #fff;
    }
    .com-icon-list {
        display: flex;
        flex-wrap: wrap;
        margin: 0;
        padding: 0;
        position: relative;
        z-index: 10;
        justify-content: space-between;
    }
    .com-icon-list li {
        padding: 12px;
        width: 90px;
        height: 90px;
        text-align: center;
        margin: 10px 0;
        border-radius: 100%;
        background-color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .com-icon-list li img {
        height: auto;
        width: auto;
        max-height: 100%;
        max-width: 100%;
    }
    .ind-contact{width: 100%;margin-bottom: 60px;
        background-color: #DC7C1A;
        padding-top: 70px;
        padding-bottom: 70px;}
    .ind-con{max-width: 1300px;padding:0 15px;margin:0 auto;display: flex;justify-content: space-between;align-items: center;color: #fff;
        .left{font-size: 26px;font-weight: 700}
    .right{width: 160px;color: #222;padding:16px 0;font-weight: 700;font-size: 18px;display: block;background: #fff;text-align: center}
        .right:hover{background: #222;color: #fff}
    }
    .ind-news{max-width: 1300px;padding: 0 15px;margin:50px auto 80px;overflow: hidden}
    .ind-news time{display: block;margin:20px auto 15px;font-size: 15px}
    .ind-news time .sort{background:#ffd9db;color: #DC7C1A;font-size: 14px;padding:5px 10px;text-transform: uppercase }
    .ind-news h3{color: #222;font-size: 24px;line-height: 32px;font-weight: 700}
    .ind-news li{transition: all .4s;}
     .imgk{overflow: hidden;height: 230px;}
     .imgk img{transition: all .4s;}
    .new-arrow{transform:translateX(-10px);transition: all .4s;width:40px; height:40px;display: block;opacity: 0;
        background: url("../images/arrowRight.png") no-repeat center center;background-size:100% }
    .ind-news li:hover  .new-arrow{display:block;transform:translateX(10px);transition: all .4s;opacity: 1;}
    .ind-news li:hover .imgk img{transform: scale(1.2)}
    .bottom{background: #16172E;overflow: hidden;padding:40px 0;
    .end-about{color:rgba(255,255,255,.7);
        p{font-size: 14px;line-height: 26px}
    }
    .end-bank{display: flex;margin-top: 35px;
        flex-wrap: wrap;
       justify-content: space-between;}
    .end-bank li{width: 60px;height: 60px;margin:0 5px;background: #fff;border-radius:100%;display: flex;align-items: center;justify-content: center }
    .end-bank li img{height: 40px;
  }
   .end-h3{font-size: 24px;font-weight: 700;color:#fff;margin-bottom: 30px}
   .end-menu{float: right;}
    .end-menu li{font-size: 14px;line-height: 24px;}
    .end-menu li span{font-size: 10px}
    .end-menu li a{color:rgba(255,255,255,.7);transition: all .3s;padding: 0 0 20px;display: block }
    .end-menu li a:hover{color:#DC7C1A;text-decoration:#DC7C1A }
    .end-contact{color:rgba(255,255,255,.7);float: right;width: 90%}
    .end-contact li{font-size: 15px;line-height: 24px;margin-bottom: 10px}
    .end-contact li img{width: 22px;height: 22px;margin-right: 12px}
    .end-code{margin: 20px 0;width:125px;color:rgba(255,255,255,.7);text-align: center }
    .end-code img{width: 100%;margin:0 auto 10px;display: block}
    .end-code p{text-align: center;line-height: 30px;}
    }
  .copyright{width: 100%;background: #212529;padding: 13px 0;color:#cdced1;font-size: 14px}
/*  list*/
    .inner-banner{width: 100%;background: url(../images/inner-banner.jpg) no-repeat  center center;overflow: hidden;background-size: cover;
        .name{background: rgba(0,0,0,.6);display: flex;align-items: center;justify-content: center;height: 500px;flex-direction: column;
        .top-name{font-size: 50px;color: #fff;font-weight:700}
            .bread{color: #ccc;font-size: 16px;line-height: 24px;}
            .bread a{color: #DC7C1A}
        }

    }
/*  about-list*/
    .list-box{position: relative;max-width: 1300px;margin:-90px auto 50px;padding: 0 15px;overflow: hidden}
    .about-inner{width: 100%;margin:0 auto 30px;padding-bottom: 30px;overflow: hidden}
    .about-inner-box{
        .about-left{box-shadow: 0 12px 39px 0 rgba(8, 18, 109, 0.08);padding: 50px 40px;
            background: #fff;display: flex;justify-content: space-between;
            .item1{width: 48%;
                &:hover .h2{color: #DC7C1A}
            }
            .h2 {
                font-size: 24px;
                font-weight: 700
            }
            p {
                font-size: 15px;
                color: #666;
                line-height: 26px;display: -webkit-box;
                overflow: hidden;
                -webkit-line-clamp: 2;
                text-overflow: ellipsis;
                -webkit-box-orient: vertical;
            }

        }
    }
    .about-right{background:#056878;padding: 50px 40px 80px 40px;display: flex;flex-direction: column;
        h3{color:rgba(255,255,255,.6);font-size: 17px;text-transform: uppercase}
        h4{font-size: 34px;color:#fff;line-height:38px}
    }
    .about-info{margin:30px auto;overflow: hidden;max-width: 1300px;padding: 0 15px; }
    .info{width: 90%;float: right;
        h1{font-size: 36px;font-weight:700;color:#222;margin:20px auto 30px}
        p{color: #DC7C1A;font-size: 17px;;margin:10px auto}
        .article{font-size: 17px;color: #848484;line-height: 28px}
    }


 .about-bg{
    width: 100%;
    background: url(../images/about-bg.jpg) repeat-y center center;
    background-attachment: fixed;
     background-size: cover;
}
.about-bg-font {
    background: rgba(5, 104, 120, .8);
    padding: 114px 0;
    text-align: center;

    .large-font {
        font-size: 48px;
        font-weight: 800;
        color: #fff;
        margin-bottom: 10px
    }

    .small-font {
        font-size: 20px;
        color: rgba(255, 255, 255, .8)
    }

    .btn {
        width: 130px;
        text-align: center;
        padding: 15px 0;
        font-size: 18px;
        font-weight: 700;
        background: #DC7C1A;
        color: #fff;
        display: block;
        margin: 40px auto 0;
        border-radius: 0;

        &:hover {
            background: #222;
            color: #fff
        }
    }
}

    .about-factory {
        background: #fff2f2;
        padding: 80px 0
    }

    .factory-title { text-align: center;
        .small-title {
            font-size: 17px;
            color: #DC7C1A
        }

        .title {
            font-size: 40px;
            font-weight: 700;
            color: #222
        }
    }
    .factory-box{max-width: 1300px;margin:30px auto;overflow: hidden;}
    .factory-item{background: #fff;margin: 25px auto 10px;
        .item-imgk{overflow: hidden}
        .item-imgk img{transition: all .3s;width: 100%;height: 230px;object-fit: cover}
        &:hover img{transform:scale(1.2)}
    .h2{font-size: 18px;text-align: center;font-weight: 700;padding: 0 0 18px;
        overflow: hidden;text-overflow: ellipsis;white-space: nowrap}
    }
/*product*/
    .product-box{margin:30px auto;overflow: hidden}
    .search{width:100%;margin-bottom: 30px;border: solid 1px #dedede;overflow: hidden}
    .search input{height: 35px;width: calc(100% - 35px);float: left;outline: none;border: none;padding-left: 10px;line-height: 35px}
    .search button{width: 35px;float: left;height: 35px;display: flex;align-items: center;justify-content: center;background: none;border: none;outline: none}
    .product-sort{width: 100%;margin:40px auto}
    .sort-title{font-weight: 700;font-size: 20px;margin-bottom: 20px}
    .product-sort li a{background: #056878;padding: 15px 10px;font-size: 15px;
        color: #fff;display: block;margin-bottom: 1px}
    .product-sort li a.active{background:#DC7C1A;padding: 15px 10px;color: #fff;display: block}
    .product-sort li a:hover{background: #DC7C1A;color: #fff}
/*    left-contact*/
    .left-contact{width: 100%;margin:40px auto 20px;overflow: hidden}
    .left-contact li{padding: 5px 0;line-height: 25px;display: flex;align-items: start;
       }
    .left-contact .r{width: calc(100% - 30px);font-size: 15px}
    .left-contact li img{width: 25px;height: auto;margin-right: 10px;}
/*    right-produdt*/
    .right-product{
       time{display: block;margin:20px auto 15px;font-size: 15px}
       time .sort{background:#ffd9db;color: #DC7C1A;font-size: 14px;padding:5px 10px;text-transform: uppercase }
        h3{color: #222;font-size: 22px;line-height: 32px;font-weight: 700;}
        ul{display: flex;justify-content: space-between;align-items: stretch;flex-wrap:wrap}
        li{margin-bottom: 30px;width: 47%}
        .imgk{height: auto;position:relative}

        .imgk img{transition: all .4s;filter: }
        .new-arrow{position: absolute;width:100%;top:0;bottom: 0;z-index: 2;height: 100%;
            transform:translateX(-10px);transition: all .4s; display: block;opacity: 0;
            background: url("../images/arrowRight.png") no-repeat center center;background-size:40px auto}
        li:hover  .new-arrow{display:block;transform:translateX(10px);transition: all .4s;opacity: 1;filter:brightness(0) invert(1)}
        li:hover .imgk img{transform: scale(1.2)}
        li:hover h3{color: #056878}
    }
/*    product-detail*/
    .pro-img{width: 90%;position: relative}
    .pro-img-zoom{position: absolute;font-size:18px;background: #fff;border-radius: 50px;cursor: pointer;
        top:20px;right:20px;width:50px;height: 50px;display: flex;align-items: center;
        justify-content: center
    }
    .pro-img-zoom:hover{background: #222;color: #fff}
    .pro-img img{width: 100%;height: auto}
    .pro-info{
        width: 100%;
        h2{font-size: 30px;font-weight: bold;color: #222}
        .star{font-size: 16px;color:#DC7C1A;;margin-top: 35px}
        .article{font-size: 14px;color:#777;margin:0 auto;line-height: 26px}

    }
    .tel{margin: 10px auto 20px;overflow: hidden}
    .tel a{padding: 15px 20px;background: #DC7C1A;color: #fff;font-size: 18px;transition: all .6s;
        font-weight: 700;margin-left:10px;display: inline-block;}
    .tel a:hover{background: #222}
    .pro-logo{
        h4{font-size: 16px;line-height:30px;margin-top: 20px;overflow: hidden}
    .logo-box{display: flex;margin-top: 15px;width: 100%;
        flex-wrap: wrap;
        justify-content:start;}
    .logo-box li{width: 65px;height: 65px;margin:0 8px 0 0;background: #fff;border-radius:100%;display: flex;align-items:center;justify-content: center }
    .logo-box li img{height: 60px;
    }
    }
    .pro-detail{max-width: 1300px;margin:25px auto;display: block;
        .detail-h2{background: #DC7C1A;padding: 10px 25px;color: #fff;font-size: 18px;font-weight: 700;display: inline-block;margin-bottom: 15px}
        .detail{font-size:16px;line-height: 25px;border-top: solid 1px #dedede;width: 100%;margin-top:5px;padding-top: 30px}
        .detail img{width: 90%;height: auto;margin:10px auto;display: block}
    }
/*    rec*/
    .rec-pro{width: 100%;margin:60px auto 30px}
    .rec-item{width: 100%;text-align: center;
        .rec-img{overflow: hidden;position: relative}
        .rec-more{width:146px;position: absolute;left: calc(50% - 73px);bottom: 10px;
            padding: 10px 0;font-weight: 700;color: #fff;background: #DC7C1A;text-align: center;transition: all .3s;transform:translateY(60px) scale(.6);
            opacity: 0}
        .rec-img:hover .rec-more{opacity: 1;transform:translateY(-20px)  scale(1);}

    .title{font-size: 18px;font-weight: 700;padding: 10px 0}
    }
    .rec-h2{font-size: 24px;font-weight: 700;margin-bottom: 20px}
    .rec-pro .swiper{padding-bottom: 60px;}
    .rec-pro  .swiper-pagination-bullet-active{background:#DC7C1A!important;width: 20px;height: 20px;border: solid 2px #DC7C1A!important;}
    .rec-pro  .swiper-pagination-bullet{width: 15px!important;height: 15px!important;background: #fff;border: solid 2px #222;}
/* list-case*/
    .list-case li{margin-bottom: 20px}
/*    list-news*/
    .list-news{
        time{display: block;margin:20px auto 15px;font-size: 15px}
        time .sort{background:#ffd9db;color: #DC7C1A;font-size: 14px;padding:5px 10px;text-transform: uppercase }
        h3{color: #222;font-size: 22px;line-height: 32px;font-weight: 700;}
        ul{display: flex;justify-content: space-between;align-items: stretch;flex-wrap:wrap}
        li{margin-bottom: 30px;width: 47%}
        .imgk{height: auto;position:relative}
        .imgk img{transition: all .4s; }
        li:hover  .new-arrow{display:block;transform:translateX(10px);transition: all .4s;opacity: 1;filter:brightness(0) invert(1)}
        li:hover .imgk img{transform: scale(1.2)}
        li:hover h3{color: #056878}
    }
    .right-new-k{
        background-color: #fff2f2;
        padding: 40px;
        margin-bottom: 40px;
    }
    .news-h2{font-size: 24px;color: #222;font-weight: 700;margin-bottom: 20px}
    .new-p{font-size: 15px;color: #848484;padding-bottom: 25px;border-bottom: solid 1px #dedede;line-height: 26px}
    .new-sort{margin-top:30px}
    .new-sort a{font-size: 17px;color:#222;display: block;padding: 10px 0;font-weight: bold}
    .new-sort a.active{color: #DC7C1A}
    .new-search{background: #fff;overflow: hidden;padding: 5px 0;
        input{height: 40px;width: calc(100% - 45px);float: left;outline: none;border: none;padding-left: 10px;line-height: 40px}
         button{width: 45px;float: left;height: 40px;font-size: 20px;
             display: flex;align-items: center;justify-content: center;background: none;border: none;outline: none}
    }
    .new-rec{width: 100%;margin-top: 25px;
        li{margin-bottom: 30px}
    li a{display: flex;align-items: start;justify-content: space-between;overflow: hidden}
        .rec-img{width: 90px;}
        .rec-r{width: calc(100% - 100px);text-align: left;
        time{color: #DC7C1A;display: block;font-size: 14px}
            .title{font-size: 16px;color: #222;line-height: 24px;font-weight: bold}
        }
    }
   .list-news1{
   time{display: block;margin:20px auto 15px;font-size: 15px}
   time .sort{background:#ffd9db;color: #DC7C1A;font-size: 14px;padding:5px 10px;text-transform: uppercase }
   h3{color: #222;font-size: 22px;line-height: 32px;font-weight: 700;}
   ul{display: flex;justify-content: space-between;align-items: stretch;flex-wrap:wrap}
   li{margin-bottom: 30px;width:100%}
   .imgk{height: auto;position:relative}
   .imgk img{transition: all .4s; }
   li:hover  .new-arrow{display:block;transform:translateX(10px);transition: all .4s;opacity: 1;filter:brightness(0) invert(1)}
   li:hover .imgk img{transform: scale(1.2)}
   li:hover h3{color: #056878}
}
    /*news-detail*/
    .news-detail{width:90%;margin:40px auto 30px;
    time{display: block;margin:20px auto 15px;font-size: 15px}
    time .sort{background:#ffd9db;color: #DC7C1A;font-size: 14px;padding:5px 10px;text-transform: uppercase }
    h3{color: #222;font-size: 22px;line-height: 32px;font-weight: 700;}
    .news-content{font-size: 16px;line-height: 24px;color: #848484;margin:50px auto;min-height: 300px}
    .news-content img{max-width: 100%;}
    }
  .pre-next{
      width: 90%;border-top:solid 1px #dedede;padding-top:20px;margin:20px auto;
      li{font-size: 16px;line-height: 26px;padding: 5px 0}
  }
/*case-detail*/
   .case-detail-top{
       width: 90%;margin:20px auto 45px;
       box-shadow: 0 12px 39px 0 rgba(8, 18, 109, 0.08);
       padding: 30px 50px 60px;
       background: #fff;
       .subtitle{font-size: 17px;color: #DC7C1A;margin-bottom: 0}
       .title{font-size: 40px;margin:5px auto;color: #222;font-weight: 800;font-family: "Open Sans bold"}
   }
   .case-detail{width: 90%;padding: 0 50px;
       display: block;font-size: 18px;line-height: 32px;color: #555;margin:50px auto;min-height: 300px}
   .case-detail img{max-width: 100%;}
   .pre-space{padding: 20px 50px !important;}

/*   contact*/
   .con-info{box-shadow: 0 0 5px 5px #ddd;text-align: center;padding:70px 0;margin:40px auto;height:350px;
       h3{font-size: 24px;font-weight: bold;}
       p{font-size: 17px;color: #848484;margin-top: 20px}
   }

.formk ul {
    overflow: hidden
}

.formk article {
    font-size: 14px;
    text-align: center;
    padding: 0 0 15px;
    width: 95%;
    line-height: 24px;
    margin-bottom: 20px
}
.formk .k {
    width: 30%;
    float: left;
    padding:10px 3px 10px 20px;
    line-height: 35px;

    margin: 5px 3% 5px 0;
    border-radius: 3px;
    border: solid 1px #7c7c7c
}
.formk .k1 {
    width: 96%;
    float: left;
    padding:10px 3px 10px 20px;
    line-height: 35px;
    margin: 5px 3% 5px 0;
    border-radius: 3px;
    border: solid 1px #7c7c7c;
    min-height: 100px
}

.formk .k2 {
    width: 30%;
    float: left;
    padding:10px 3px 10px 20px;
    line-height: 35px;
    margin: 5px 3% 5px 0;
    border-radius: 3px;
    border: solid 1px #7c7c7c
}

.formk button {
    width: 250px;
    text-align: center;
    line-height: 40px;
    background: #DC7C1A;
    font-size: 16px;
    color: #fff;
    display: block;
    padding:5px 0;
    border-radius: 5px;
    border: none;
    margin-top: 15px;
}
.message-bg{background:#056878;width: 100%;padding: 50px 0}
.message{max-width: 1250px;padding:0 40px;box-sizing: border-box;color: #fff;margin:0 auto;
h4{font-size: 18px;margin:10px auto 10px}
h3{font-size:30px;font-weight: 700;margin:20px auto 10px}
}
.formk{max-width: 1250px;margin:20px auto;padding:0 40px;box-sizing: border-box;}





}






@media (max-width: 768px) {
    .head-top {
        background: #f6f6f6;
        width: 100%;
        padding: 5px 0;
        transition: all .3s
    }

    .head-top-box {
        max-width: 1300px;
        margin: 0 auto;
        padding: 0 15px;
        display: flex;
        justify-content: space-between;
        align-items: center
    }

    .head-top-box .left {
        font-size: 14px;
        color: #848484
    }

    .head-top-box .right {
        font-size: 14px;
        display: flex;
        align-items: center;
    }

    .head-top-box a {
        padding: 0 10px;
        border-right: dashed 1px #dedede;
        align-items: center;
        justify-content: right
    }

    .head-top-box .right span {
        color: #DC7C1A;
        padding-right: 10px;
        font-size: 16px
    }

    .head-top-box a:last-child {
        border-right: none
    }

    .indbg {
        width: 100%;
        transition: all .3s
    }

    .indbg.xz .head-top {
        display: none;
        transform: translateY(0)
    }

    .topbg {
        width: 100%;background:#fff;

        margin: 0px auto;
    }

    .nav-box .container {
        width: 100%;
        padding: 0
    }

    .logo1 {
        float: left;
        margin-top: 10px;
        width: 80%;
        height: auto;
    }
    .topbg .col-md-3 {
        padding: 0
    }

    .indbg.xz .topbg{  position: fixed;
        z-index: 99;}
    .indbg.xz .head-top-box {
        display: none
    }
    .nav-box{max-width: 1300px;margin:0 auto;padding: 0 15px;position: relative;height: 65px}
    .nav-box .col-xs-12{padding: 0}
    .navbar-nav{background: #222;padding: 20px 0}
    .navbar-nav a{color: #fff}
    .navbar-nav li{border-bottom: solid 1px #3f3f3f;}
    .navbar-nav > li > a.active {
        color: #DC7C1A;
        display: block;
    }
    .dropdown-menu>li>a{color: #fff!important;padding: 4px 0;font-size: 13px}
    .dropdown-menu li:last-child{border-bottom: none}
    .logo1{width:40%;position: absolute;left: 10px;}
    .pck1{position: relative}
    .pck1 img{height: 100vw;object-fit: cover}
    .pck1 .swiper-pagination-bullet{background: #fff!important;}
    .about-box{width: 95%;   background-color: #fff;
        -webkit-box-shadow: 0px 21px 35px 0 RGBA(28, 58, 104, 0.1);
        box-shadow: 0 21px 35px 0 RGBA(28, 58, 104, 0.1);position: relative;
        z-index: 10;
        margin: 20px auto;
        order:solid 1px #efefef;

                                              }
    .about-box:after{
        top:-10px;
        transform: scaleX(0.948);width: 96%;left: 2%;
        opacity: 0.7;
        content: "";display: block;background: #fff;height: 100px;
        position: absolute;
        z-index: -1;
    }
    .about-box:before{
        top:-25px;
        transform: scaleX(0.948);width: 94%;left: 3%;
        opacity: 0.7;
        content: "";display: block;background: #fff;height: 100px;
        position: absolute;
        z-index: -2;
    }
    .about-box{
    .h1{    text-transform: uppercase;color: #DC7C1A;font-size: 17px;}
    .about-title{font-size:24px;font-weight: 800;line-height: 32px;color: #333}
    .about-article{width: 90%;margin-top: 15px;
        font-size: 14px;line-height: 24px;color:#999;  display: -webkit-box;
        overflow: hidden;
        -webkit-line-clamp: 3;
        text-overflow: ellipsis;
        -webkit-box-orient: vertical;
    }
    .about-case{
        border-top: solid 1px #dedede;padding-top: 30px;overflow: hidden;margin-top: 30px;
    .h2{font-size:20px;font-weight:700;margin-bottom: 5px   }
    p{font-size: 14px;color:#666;line-height: 22px;margin-bottom: 15px}
}
 .about-right{width: 100%;overflow: hidden;cursor: pointer}
 .about-right img{height:90vw;object-fit: cover;width: 90%;margin:0 auto 25px}
}
.pro-box {
    background-color: #056878;
    padding: 40px 0  15px;
    position: relative;
   overflow: hidden;
}
.pro-title{font-size: 24px;color:#fff;line-height: 42px;font-weight: 800}
.pro-summary{font-size:15px;line-height:24px;color: #fff;margin-top:15px}
.pro-more{display: block;font-size: 15px;
    margin: 25px 0;
    background: #DC7C1A;width: 160px;text-align: center;padding:10px 0;color:#fff;
}
.pro-more:hover{color: #DC7C1A;background: #fff}
.pro-pro{width:100%;float: right;position: relative;z-index: 2}
.pro-pro  li{width: 48.5%;float: left;margin-bottom:20px;overflow:hidden}
.pro-pro img{transition:all .3s}
.pro-pro li:hover img{transform: scale(1.1)}
.pro-pro li:nth-child(even){float: right}
.pro-float{width:540px;position: absolute;left:40px;bottom:-25%;animation: profloat 5s ease-in infinite;z-index: 0}
.case-title{text-align: center;padding: 0 15px }
.case-title h2{font-size: 24px;text-align:center;color: #222;font-weight:700}
.case-title p{font-size: 15px;color: #222}
.case-box{width: 90%;position: relative;margin:30px auto;overflow: hidden}
.caseimg{position: relative;overflow:hidden}
.caseimg .title{position: absolute;z-index: 9;padding:5px 0 5px 20px ;
    width: 100%;background:rgba(0,0,0,.6);
    text-align: left;color: #fff;bottom: 0;left: 0;font-size: 20px;line-height: 45px;box-sizing: border-box}
.case-box .swiper{padding-bottom: 40px;}
.case-box  .swiper-pagination-bullet-active{background:#DC7C1A!important;width: 20px;height: 20px;border: solid 2px #DC7C1A!important;}
.case-box  .swiper-pagination-bullet{width: 10px!important;height: 10px!important;background: #fff;border: solid 2px #222;}
.feature-one {
    position: relative;width: 100%;overflow: hidden;
    background-color: #056878;
    padding: 30px 0;
}


.feature-one .block-title__title {
    color: #fff;
}

.feature-one .block-title__tag-line,
.feature-one .block-title__text {
    color: rgba(255, 255, 255, 0.7);
}

.feature-one__single {
    position: relative;
    z-index: 10;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
}

.feature-one__single+.feature-one__single {
    margin-top: 50px;
}

.feature-one__title {
    font-weight: 500;
    font-size: 24px;
    color: #fff;
    margin: 0;
    line-height: 1em;
    margin-bottom: 10px;
}

.feature-one__title a {
    color: inherit;
    -webkit-transition: all .4s ease;
    transition: all .4s ease;
}

.feature-one__title a:hover {
    color: #DC7C1A;
}

.feature-one__text {
    margin: 0;
    color: rgba(255, 255, 255, 0.7);
    font-size: 15px;
    line-height: 26px;
    width: 82%;
}

.feature-one__icon i {
    width: 60px;
    height: 60px;
    background-color: rgba(255, 255, 255, 0.2);
    border-radius: 50%;
    text-align: center;
    display: -webkit-box;
    display: -ms-flexbox;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    align-items: center;
    margin-right: 30px;
    font-size: 34px;
    color: #fff;
}
.com-icon-list {
    display: flex;
    flex-wrap: wrap;
    margin: 0;
    padding: 0;
    position: relative;
    z-index: 10;
    justify-content: space-between;
}
.com-icon-list li {
    padding: 1vw;
    width:18vw;
    height: 18vw;
    text-align: center;
    margin: 1vw;
    border-radius: 100%;
    background-color: #fff;
    display: flex;
    align-items: center;
    justify-content: center;
}
.com-icon-list li img {
   height: auto;width: 12vw;
}
.ind-contact{width: 100%;margin-bottom: 30px;
    background-color: #DC7C1A;
    padding-top: 20px;
    padding-bottom: 20px;}
.ind-con{max-width: 1300px;padding:0 15px;margin:0 auto;color: #fff;
.left{font-size: 24px;font-weight: 700;width:98%;text-align: center}
.right{width: 160px;color: #222;padding:10px 0;margin:20px auto 0;display: flex;align-items: center;justify-content: center;
    font-weight: 700;font-size: 17px;background: #fff;text-align: center}
}
.ind-news{max-width: 1300px;padding: 0 15px;margin:30px auto;overflow: hidden}
.ind-news time{display: block;margin:20px auto 15px;font-size: 15px}
.ind-news time .sort{background:#ffd9db;color: #DC7C1A;font-size: 14px;padding:5px 10px;text-transform: uppercase }
.ind-news h3{color: #222;font-size: 18px;line-height: 28px;font-weight: 700}
.ind-news li{transition: all .4s;}
.imgk{overflow: hidden;height: 230px;}
.imgk img{transition: all .4s;}
.new-arrow{display:none}

.bottom{background: #16172E;overflow: hidden;padding:40px 0;
.end-about{color:rgba(255,255,255,.7);

p{font-size: 14px;line-height: 26px}
}
.end-bank{display: flex;margin-top: 15px;
    flex-wrap: wrap;
    justify-content: space-between;}
.end-bank li{width: 18vw;height: 18vw;margin:5px 2vw 10px;background: #fff;border-radius:100%;display: flex;align-items: center;justify-content: center }
.end-bank li img{height: 40px;
}
.end-h3{font-size: 24px;font-weight: 700;color:#fff;margin-bottom: 30px}
.end-menu{}
.end-menu li{font-size: 14px;line-height: 24px;margin-bottom: 15px;width: 31%;float: left}
.end-menu li span{font-size: 10px}
.end-menu li a{color:rgba(255,255,255,.7);font-size: 16px }
.end-contact{color:rgba(255,255,255,.7);}
.end-contact li{font-size: 15px;line-height: 24px;margin-bottom: 10px}
.end-contact li img{width: 22px;height: 22px;margin-right: 12px}
.end-code{margin: 20px 0;width:125px;color:rgba(255,255,255,.7);text-align: center;display: none }
.end-code img{width: 100%;margin:0 auto 10px;display: block}
.end-code p{text-align: center;line-height: 30px;}
}
.copyright{width: 100%;background: #212529;padding:20px 13px;color:#cdced1;font-size: 13px}

    /*  list*/
    .inner-banner{width: 100%;background: url(../images/inner-banner.jpg) no-repeat  center center;overflow: hidden;background-size: cover;
        .name{background: rgba(0,0,0,.6);display: flex;align-items: center;justify-content: center;height: 45vw;flex-direction: column;
            .top-name{font-size: 30px;color: #fff;font-weight:700}
            .bread{color: #ccc;font-size: 15px;line-height: 24px;}
            .bread a{color: #DC7C1A}
        }

    }

    /*  about-list*/
    .list-box{position: relative;max-width: 1300px;margin:0 auto 20px;padding: 0 ;overflow: hidden}
    .about-inner{width: 100%;padding-bottom:20px;overflow: hidden}
    .about-inner-box{
        .about-left{box-shadow: 0 12px 39px 0 rgba(8, 18, 109, 0.08);padding: 30px 10px;
            background: #fff;
            .item1{width: 100%;margin-top: 15px;
                &:hover .h2{color: #DC7C1A}
            }
            .h2 {
                font-size: 24px;
                font-weight: 700
            }
            p {
                font-size: 15px;
                color: #666;
                line-height: 26px;display: -webkit-box;
                overflow: hidden;
                -webkit-line-clamp: 2;
                text-overflow: ellipsis;
                -webkit-box-orient: vertical;
            }
        }
        .col-xs-12{padding: 0}
    }
    .about-right{background:#056878;padding:30px  20px;display: flex;flex-direction: column;margin: 0 -20px;
        h3{color:rgba(255,255,255,.6);font-size: 16px;text-transform: uppercase;margin: 5px auto}
        h4{font-size: 24px;color:#fff;line-height:28px;margin: 5px auto}
    }
    .about-info{margin:20px auto;overflow: hidden;max-width: 1300px;padding: 0 15px; }
    .info{width: 100%;float: right;
        h1{font-size: 24px;font-weight:700;color:#222;margin:20px auto 30px}
        p{color: #DC7C1A;font-size: 17px;;margin:10px auto}
        .article{font-size: 15px;color: #848484;line-height: 26px}
    }


    .about-bg{
        width: 100%;
        background: url(../images/about-bg.jpg) repeat-y center center;
        background-attachment: fixed;
        background-size: cover;
    }
    .about-bg-font {
        background: rgba(5, 104, 120, .8);
        padding: 30px 15px;
        text-align: center;

        .large-font {
            font-size: 24px;
            font-weight: 800;
            color: #fff;
            margin-bottom: 10px
        }

        .small-font {
            font-size: 15px;
            color: rgba(255, 255, 255, .8)
        }

        .btn {
            width: 130px;
            text-align: center;
            padding: 10px 0;
            font-size: 16px;
            font-weight: 700;
            background: #DC7C1A;
            color: #fff;
            display: block;
            margin: 20px auto 0;
            border-radius: 0;

            &:hover {
                background: #222;
                color: #fff
            }
        }
    }

    .about-factory {
        background: #fff2f2;
        padding: 30px 15px;
    }

    .factory-title { text-align: center;
        .small-title {
            font-size: 16px;
            color: #DC7C1A
        }

        .title {
            font-size: 24px;
            font-weight: 700;
            color: #222
        }
    }
    .factory-box{max-width: 1300px;margin:30px auto;overflow: hidden;}
    .factory-item{background: #fff;margin-top: 5px;
        .item-imgk{overflow: hidden}
        .h2{font-size: 18px;text-align: center;font-weight: 700;padding: 0 0 18px;
            overflow: hidden;text-overflow: ellipsis;white-space: nowrap}
    }
    /*product*/
    .product-box{margin:30px auto;overflow: hidden}
    .search{width:100%;margin-bottom: 30px;border: solid 1px #dedede;overflow: hidden}
    .search input{height: 35px;width: calc(100% - 35px);float: left;outline: none;border: none;padding-left: 10px;line-height: 35px}
    .search button{width: 35px;float: left;height: 35px;display: flex;align-items: center;justify-content: center;background: none;border: none;outline: none}
    .product-sort{width: 100%;margin:40px auto}
    .sort-title{font-weight: 700;font-size: 20px;margin-bottom: 15px}
    .product-sort li a{background: #056878;padding: 15px 10px;font-size: 15px;
        color: #fff;display: block;margin-bottom: 1px}
    .product-sort li a.active{background:#DC7C1A;padding: 15px 10px;color: #fff;display: block}
    .product-sort li a:hover{background: #DC7C1A;color: #fff}
    /*    left-contact*/
    .left-contact{width: 100%;margin:40px auto 20px;overflow: hidden}
    .left-contact li{padding: 5px 0;line-height: 25px;display: flex;align-items: start;
    }
    .left-contact .r{width: calc(100% - 30px);font-size: 15px}
    .left-contact li img{width: 25px;height: auto;margin-right: 10px;}
    /*    right-produdt*/
    .right-product{
        time{display: block;margin:15px auto 15px;font-size: 15px}
        time .sort{background:#ffd9db;color: #DC7C1A;font-size: 14px;padding:5px 10px;text-transform: uppercase }
        h3{color: #222;font-size: 22px;line-height: 32px;font-weight: 700;}
        ul{}
        li{margin-bottom: 30px;width: 100%}
        .imgk{height: auto;position:relative}

        .imgk img{transition: all .4s;filter: }
        .new-arrow{position: absolute;width:100%;top:0;bottom: 0;z-index: 2;height: 100%;
            transform:translateX(-10px);transition: all .4s; display: block;opacity: 0;
            background: url("../images/arrowRight.png") no-repeat center center;background-size:40px auto}
        li:hover  .new-arrow{display:block;transform:translateX(10px);transition: all .4s;opacity: 1;filter:brightness(0) invert(1)}
        li:hover .imgk img{transform: scale(1.2)}
        li:hover h3{color: #056878}
    }

    /*    product-detail*/
    .pro-img{width: 100%;position: relative}
    .pro-img-zoom{position: absolute;font-size:18px;background: #fff;border-radius: 50px;cursor: pointer;
        top:20px;right:20px;width:50px;height: 50px;display: flex;align-items: center;
        justify-content: center
    }
    .pro-img-zoom:hover{background: #222;color: #fff}
    .pro-img img{width: 100%;height: auto}
    .pro-info{
        width: 98%;margin:0 auto;
        h2{font-size: 24px;font-weight: bold;color: #222}
        .star{font-size: 16px;color:#DC7C1A;;margin-top: 15px}
        .article{font-size: 14px;color:#777;margin:0 auto;line-height: 26px}

    }
    .tel{margin: 10px auto 20px;overflow: hidden}
    .tel a{padding: 10px 20px;background: #DC7C1A;color: #fff;font-size: 16px;transition: all .6s;
        font-weight: 700;margin-left:10px;display: inline-block;}
    .tel a:hover{background: #222}
    .pro-logo{
        h4{font-size: 16px;line-height:30px;margin-top: 20px}
        .logo-box{display: flex;margin-top: 15px;width: 100%;
            flex-wrap: wrap;
            justify-content:start;}
        .logo-box li{width: 70px;height: 70px;margin:0 5px;background: #fff;border-radius:100%;display: flex;align-items:center;justify-content: center }
        .logo-box li img{height: 60px;
        }
    }
    .pro-detail{max-width: 1300px;margin:25px auto;display: block;padding: 0 15px;
        .detail-h2{background: #DC7C1A;padding: 10px 25px;color: #fff;font-size: 18px;font-weight: 700;display: inline-block;margin-bottom: 15px}
        .detail{font-size:16px;line-height: 25px;border-top: solid 1px #dedede;width: 100%;margin-top:5px;padding-top: 30px}
        .detail img{width: 90%;height: auto;margin:10px auto;display: block}
    }
    /*    rec*/
    .rec-pro{width: 90%;margin:60px auto 30px}
    .rec-item{width: 100%;text-align: center;
        .rec-img{overflow: hidden;position: relative}
        .rec-more{width:146px;position: absolute;left: calc(50% - 73px);bottom: 10px;
            padding: 10px 0;font-weight: 700;color: #fff;background: #DC7C1A;text-align: center;transition: all .3s;transform:translateY(60px) scale(.6);
            opacity: 0}
        .rec-img:hover .rec-more{opacity: 1;transform:translateY(-20px)  scale(1);}

        .title{font-size: 18px;font-weight: 700;padding: 10px 0}
    }
    .rec-h2{font-size: 24px;font-weight: 700;margin-bottom: 20px}
    .rec-pro .swiper{padding-bottom: 60px;}
    .rec-pro  .swiper-pagination-bullet-active{background:#DC7C1A!important;width: 20px;height: 20px;border: solid 2px #DC7C1A!important;}
    .rec-pro  .swiper-pagination-bullet{width: 15px!important;height: 15px!important;background: #fff;border: solid 2px #222;}
    .list-case li{margin-bottom: 20px}
/*    list-news*/
    .list-news{
    time{display: block;margin:20px auto 15px;font-size: 15px}
    time .sort{background:#ffd9db;color: #DC7C1A;font-size: 14px;padding:5px 10px;text-transform: uppercase }
    h3{color: #222;font-size: 18px;line-height: 26px;font-weight: 700;}
    ul{width: 96%;margin:0 auto}
    li{margin-bottom: 30px;width: 100%}
    .imgk{height: auto;position:relative}
    .imgk img{transition: all .4s; }
    li:hover  .new-arrow{display:block;transform:translateX(10px);transition: all .4s;opacity: 1;filter:brightness(0) invert(1)}
    li:hover .imgk img{transform: scale(1.2)}
    li:hover h3{color: #056878}
    }
    .right-new-k{
    background-color: #fff2f2;
    padding: 40px;
    margin-bottom: 40px;
    }
    .news-h2{font-size: 24px;color: #222;font-weight: 700;margin-bottom: 20px}
    .new-p{font-size: 15px;color: #848484;padding-bottom: 25px;border-bottom: solid 1px #dedede;line-height: 26px}
    .new-sort{margin-top:30px}
    .new-sort a{font-size: 17px;color:#222;display: block;padding: 10px 0;font-weight: bold}
    .new-sort a.active{color: #DC7C1A}
    .new-search{background: #fff;overflow: hidden;padding: 5px 0;
    input{height: 40px;width: calc(100% - 45px);float: left;outline: none;border: none;padding-left: 10px;line-height: 40px}
    button{width: 45px;float: left;height: 40px;font-size: 20px;
    display: flex;align-items: center;justify-content: center;background: none;border: none;outline: none}
}
   .new-rec{width: 100%;margin-top: 25px;
    li{margin-bottom: 30px}
    li a{display: flex;align-items: start;justify-content: space-between;overflow: hidden}
    .rec-img{width: 90px;}
    .rec-r{width: calc(100% - 100px);text-align: left;
    time{color: #DC7C1A;display: block;font-size: 14px}
    .title{font-size: 16px;color: #222;line-height: 24px;font-weight: bold}
}
}
    .list-news1{
    time{display: block;margin:20px auto 0;font-size: 15px}
    time .sort{background:#ffd9db;color: #DC7C1A;font-size: 14px;padding:5px 10px;text-transform: uppercase }
    h3{color: #222;font-size: 18px;line-height: 30px;font-weight: 700;margin-top:10px}
    ul{display: flex;justify-content: space-between;align-items: stretch;flex-wrap:wrap}
    li{margin-bottom: 5px;width:100%}
    .imgk{height: auto;position:relative}
    .imgk img{transition: all .4s; }
    li:hover  .new-arrow{display:block;transform:translateX(10px);transition: all .4s;opacity: 1;filter:brightness(0) invert(1)}
    li:hover .imgk img{transform: scale(1.2)}
    li:hover h3{color: #056878}
}

/*news-detail*/
.news-detail{width:94%;margin:30px auto 10px;
time{display: block;margin:20px auto 15px;font-size: 15px}
time .sort{background:#ffd9db;color: #DC7C1A;font-size: 14px;padding:5px 10px;text-transform: uppercase }
h3{color: #222;font-size: 22px;line-height: 32px;font-weight: 700;}
.news-content{font-size: 16px;line-height: 24px;color: #848484;margin:20px auto;min-height: 300px}
.news-content img{max-width: 100%;}
}
.pre-next{
    width: 90%;border-top:solid 1px #dedede;padding-top:20px;margin:20px auto;
li{font-size: 16px;line-height: 26px;padding: 5px 0}
}
/*case-detail*/
.case-detail-top{
    width: 95%;margin:20px auto 20px;
    box-shadow: 0 12px 39px 0 rgba(8, 18, 109, 0.08);
    padding:10px;
    background: #fff;
.subtitle{font-size: 17px;color: #DC7C1A;margin-bottom: 0}
.title{font-size: 20px;margin:5px auto;color: #222;font-weight: 800;font-family: "Open Sans bold"}
}
.case-detail{width:95%;padding: 0 15px;
    display: block;font-size: 15px;line-height: 27px;color: #555;margin:20px auto;min-height: 300px}
.case-detail img{max-width: 100%;}


/*   contact*/
.con-info{box-shadow: 0 0 5px 5px #ddd;text-align: center;padding:20px 0;margin:15px auto;
img{width:60px;height: auto;display: block;margin:0 auto 10px}
h3{font-size:20px;font-weight: bold;margin: 0}
p{font-size: 15px;color: #848484;margin-top: 10px}
}

.formk ul {
    overflow: hidden
}

.formk .k {
    width: 100%;
    float: left;
    padding-left: 45px;
    line-height: 35px;
    margin: 5px 3% 5px 0;
    border-radius: 3px;
    border: solid 1px #7c7c7c
}
.formk .k1 {
    width: 100%;
    float: left;
    padding-left: 15px;
    line-height: 35px;
    margin: 5px 3% 5px 0;
    border-radius: 3px;
    border: solid 1px #7c7c7c;
    min-height: 100px
}

.formk .k2 {
    width: 100%;
    float: left;
    padding-left: 15px;
    line-height: 35px;
    margin: 5px 3% 5px 0;
    border-radius: 3px;
    border: solid 1px #7c7c7c
}

.formk button {
    width:100%;
    text-align: center;
    line-height: 40px;
    background:#DC7C1A;
    font-size: 16px;
    color: #fff;
    display: block;
    border-radius: 5px;
    border: none;
    margin-top: 15px;
}
.message-bg{background:#056878;width: 100%;padding: 50px 0}
.message{max-width: 1250px;padding:0 40px;box-sizing: border-box;color: #fff;margin:0 auto;
h4{font-size: 16px;margin:10px auto 10px}
h3{font-size:24px;font-weight: 700;margin:20px auto 10px}
}
.formk{max-width: 1250px;margin:20px auto;padding:0 30px;box-sizing: border-box;}

}

.clear{ clear: both;}
/*popup*/
.modal-open .modal {
    background: rgba(0,0,0,.6)
}
.modal-content {
    border: none;background: none;box-shadow: none;
    height: 80vh;display: flex;align-items: center;justify-content: center;flex-wrap: wrap;flex-direction: column;
}
.modal-content img{max-width: 100%}
.modal-header{width: 100%;border: none;}
.modal-body{background: none!important;box-shadow: none!important;}
.close{font-size: 35px; color: #fff;opacity: 1}
.close:hover{color: #fff}
#CB_ContentHide{background: rgba(0,0,0,.8)!important;height: 100vh!important;position: fixed!important;}
#CB_Thumbs{display: none!important;}


/*页码*/
.listfy {text-align:center; width:98%; display:block; margin:5px auto;}
.pagination a{color:#0b112a !important}
.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:focus,
.pagination > .active > span:focus {
    z-index: 3;
    color: #fff !important;
    cursor: default;
    background-color: #DC7C1A  !important;
    border-color: #ddd !important;}




/*顶部*/
.cd-top {
    display: inline-block;
    height: 40px;
    width: 40px;
    position: fixed;
    bottom: 40px;
    right: 10px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.05);
    /* image replacement properties */
    overflow: hidden;
    text-indent: 100%;
    white-space: nowrap;
    border-radius:100%;
    background: rgb(220, 124, 26) url(../images/cd-top-arrow.svg) no-repeat center 50%;
    opacity: 1;
    -webkit-transition: all 0.3s;
    -moz-transition: all 0.3s;
    transition: all 0.3s;
    z-index: 20;
}
.cd-top.cd-is-visible {
    /* the button becomes visible */
    visibility: visible;
    opacity: 1;
}
.cd-top.cd-fade-out {
    opacity: .8;
}
.no-touch .cd-top:hover {
    background-color:#06C;
    opacity: 1;
}
@media only screen and (min-width: 768px) {
    .cd-top {
        right: 20px;
        bottom: 20px;
    }
}
@media only screen and (min-width: 1024px) {
    .cd-top {
        height: 55px;
        width: 55px;
        right: 30px;
        bottom: 30px;
        border-radius:100%;
    }
}
@keyframes hdpdt {
    0%{transform: scale(1);}
    50%{transform: scale(1.2);}
    100%{transform: scale(1);}

}
.item img{animation: hdpdt 8s infinite}

@keyframes fwbg{
    0%{transform: scale(1);}
    50%{transform: scale(1.2);}
    100%{transform: scale(1);}

}
@keyframes banner-dh {
    0%{transform: translateY(-300px);opacity: 0;}
    25%{transform: translateY(-200px);opacity: .25;}
    50%{transform: translateY(-100px);opacity: .5;}
    75%{transform: translateY(-50px);opacity: .75;}
    100%{transform: translateY(0);opacity: 1;}
}
@keyframes profloat{
    0% {
        transform: translateY(0px);
    }

    25% {
        transform: translateY(15px);
    }

    50% {
        transform: translateY(30px);
    }

    75% {
        transform: translateY(15px);
    }

    100% {
        transform: translateY(0px);
    }

}
@keyframes navdh{
     0% {
         transform: translateY(50px);opacity: 0;
     }


     50% {
         transform: translateY(25px);opacity: 0.5;
     }

     100% {
         transform: translateY(0px);opacity: 1;
     }

 }