/* 页头 */
.top-phone{
    width: 100%;
    background: #1f1f1f;
    padding:0 250px;
    box-sizing: border-box;
    height: 45px;
}
.top-phone .hello{
    float: left;
    color: #999;
    height: 45px;
    font-size: 14px;
    line-height: 45px;
}
.right-ph{
    float: right;
    height: 45px;
    line-height: 45px;
    font-size: 20px;
    color: #999;
}
.right-ph *{
    vertical-align: middle;
}
.right-ph .dis{
    font-size: 14px;
}
.head {
    width: 100%;
    position: relative;
    z-index: 1001;
}
.top-nav{
    padding: 0 10%;
    height: 100px;
    background: #fff;
    width: 100%;
    box-sizing: border-box;
    border-bottom: 1px solid #fff;
}
.top-nav .logo{
    float: left;
    margin-top: 28px;
}
.top-nav .logo img{
    width: 200px;
}
.nav-first{
    float: right;
}
.nav-first>li{
    float: left;
    height: 99px;
    width: 120px;
    line-height:99px;
    text-align: center;
    font-size:18px;
    color: #222;
    position: relative;
    z-index: 1001;
}
.nav-first>li>a{
    color: #222;
    display: block;
    position: relative;
}
.nav-first>.active>a,.nav-first>li:hover>a{
    color: #df2128;
}
.nav-first>.active:before, .nav-first>li:hover:before{
    transform: scaleY(1);
    -webkit-transform: scaleY(1);
    transform-origin: left 0;
    -webkit-transform-origin: left 0;
}
/*.nav-first>li:before{
    content: "";
    width: 100%;
    height: 100%;
    background: #df2128;
    position: absolute;
    left: 0;
    bottom: 0;
    -webkit-transition: -webkit-transform .7s cubic-bezier(0.215, 0.61, 0.355, 1);
    transition: -webkit-transform .7s cubic-bezier(0.23, 1, 0.32, 1);
    transition: transform .7s cubic-bezier(0.23, 1, 0.32, 1);
    transition: transform .7s cubic-bezier(0.23, 1, 0.32, 1),-webkit-transform .7s cubic-bezier(0.23, 1, 0.32, 1);
    transform-origin: left 100%;
    -webkit-transform-origin: left 100%;
    transform: scaleY(0);
    -moz-transform: scaleY(0);
    -webkit-transform: scaleY(0);
}*/
@media (max-width: 1190px){
    .top-nav{
        padding: 0 40px;
        height: 100px;
        background: #fff;
        width: 100%;
        box-sizing: border-box;
    }
    .head{
        position: fixed;
        z-index: 1001;
    }
    .banner{
        padding-top: 165px;
    }
    .com-banner{
        top:165px
    }
    .core-box{
        margin-top: 120px!important;
    }
}
@media screen and (min-width:1200px) and (max-width: 1550px){
    .top-nav{
        padding: 0 20px;
    }
}
.product-nav{
    width: 960px;
    box-sizing: border-box;
   /* column-count: 3;*/
    position: absolute;
    top: 100px;
    left: -420px;
    z-index: 1001;
    background: #3b3b3b;
    height: 0;
    overflow: hidden;
    transition: all .3s;
}

.product-nav::-webkit-scrollbar {
    width: 0px;
}
.product-nav li{
    line-height: normal;
    width:285px ;
    height: 487px;
    padding-top: 40px;
    transition: all .3s;
}
.product-nav li:first-child{
    padding-left: 40px;
}
.product-nav .title span{
    font-size: 22px;
    color: #fff;
    text-align: left;
    vertical-align: middle;
    padding-top: 10px;
}
.product-nav .title *{
    vertical-align: middle;
}
.product-nav p{
    text-align: left;
}
.product-nav p a{
    font-size: 16px;
    color: #939393;
    margin-top:10px;
    display: inline-block;
}
.product-nav p a:hover{
    color: #fff;
    font-weight: 600;
}
.nav-first>li:hover .product-nav{
    height:570px;
    overflow: auto;
    transition: all .3s;
}
/*.nav-first>li:hover .product-nav li{
    opacity: 1;
    transition: all 1s;
}*/
@media (max-width: 1366px){
    .product-nav{
        padding: 0;
    }
    .product-nav p a{
        margin-top:5px
    }
    .nav-first>li:hover .product-nav{
        height:450px;
        transition: all .5s;
    }
    .product-nav li{
        line-height: normal;
        width:285px ;
        height: 487px;
        padding-top: 20px;
        transition: all .5s;
    }
    .product-nav li:first-child{
        padding-left: 20px;
    }
}
.nav-second{
    position: absolute;
    top: 100px;
    left: -20px;
    z-index: 1001;
    background: #3b3b3b;
    height: 0;
    overflow: hidden;
    transition: all .3s;
}
.nav-second li{
    height: 50px;
    line-height: 50px;
}
.nav-second a{
    display: inline-block;
    width: 160px;
    height:50px;
    line-height: 50px;
    font-size: 16px;
    color: #939393;
    text-align: center;
    background: #3b3b3b;
}
.nav-second a:hover{
    color: #fff;
    background:#292929;
    font-weight:600;
}
/*.nav-first>li:hover .nav-second{
    display: block;
}*/
/* 隐藏导航 */
.nav-menu{
    width: 40px;
    line-height: .5;
    height: 40px;
    margin-top: 30px;
    cursor: pointer;
    position: relative;
    display: none;
    margin-right:20px;
}
.nav-menu span{
    display: inline-block;
    width: 40px;
    height: 2px;
    background: #000;
    position: absolute;
}
.nav-menu.active .s1{
    transform: rotate(45deg);
    transition: all .3s;
    top:12px;
    background: rgba(0,0,0,.8);
}
.nav-menu.active .s3{
    transform: rotate(-45deg);
    transition: all .3s;
    top:12px;
    background: rgba(0,0,0,.8);
}
.nav-menu.active .s4{
    display: none;
}
.nav-menu.active .s2{
    opacity:0;
    transition: all .3s;
}
.nav-menu .s1{
    top:4px;
    transition: all .3s;
}
.nav-menu .s2{
    top:12px;
    transition: all .3s;
}
.nav-menu .s3{
    top:20px;
    transition: all .3s;
}
.nav-menu .s4{
    width: 20px;
    top:28px;
    transition: all .3s;
}
@media (max-width: 1199px){
    .nav-first,
    .top-phone{
        display: none;
    }
    .nav-menu{
        display: block;
    }
    .banner{
        padding-top: 100px;
    }
    .com-banner{
        top:100px
    }
}
@media (max-width: 500px){
    .top-nav{
       height: 70px;
       padding: 0 24px;
    }
    .top-nav .logo img{
        height: 30px;
        width: auto!important;
    }
    .top-nav .logo{
        margin-top: 20px;
    }
    .nav-menu{
        margin-top: 20px;
        margin-right: 0;
        width:24px
    }
    .nav-menu .s4{
        display:none
    }
    .nav-menu span{
        width:24px
    }
    .nav-menu-two{
        border-color: #e3e3e3!important;
    }
    .banner{
        padding-top: 70px;
    }
    .com-banner{
        top:70px
    }
    .core-box{
        margin-top: 70px!important;
    }
}
.nav-menu-two{
    background: #fff;
    box-sizing: border-box;
    width: 100%;
    padding: 0 24px;
    position: fixed;
    top:70px;
    left: 0;
    z-index: -1;
    transition: all 1s;
    height: 0;
    overflow-y: scroll;
}
.menu-three {
    background: #fff;
    box-sizing: border-box;
    width: 100%;
    padding: 0 24px 24px;
    position: fixed;
    top:70px;
    left: 0;
    z-index: 100;
    transition: all 1s;
    height: 80%;
    overflow-y: scroll;
    border-top: 1px solid #e3e3e3;
    display: none;
    box-shadow: 0 0 5px #ccc;
}
.menu-three p{
    margin-top: 20px;
 /*   transform: perspective(120px) rotateX(-90deg);
    -webkit-transform: perspective(120px) rotateX(-90deg);
    -o-transform: perspective(120px) rotateX(-90deg);
    -ms-transform: perspective(120px) rotateX(-90deg);
    -moz-transform: perspective(120px) rotateX(-90deg);
    transform-origin: center top 0;
    transition: all .3s ease .3s;*/
}
.menu-three a{
    font-size: 18px;
    color: #666;
}
.nav-menu-two .title{
    font-size: 26px;
    margin-top: 30px;
}
.nav-menu-two .title a{
    color:#333;
    font-size: 20px;
}
.nav-menu-two li>div a{
    display: block;
    font-size: 16px;
    color: #666;
    margin-top: 15px;
    width:33.3333%;
    float:left
}
/* 页脚 */
.foot-ba{
    width: 100%;
    background: #000;
    text-align: center;
    font-size: 14px;
    color: #777;
    padding: 20px;
    box-sizing: border-box;
}
.foot-ba a{
    color: #777;
}
.foot-ba a:hover{
    text-decoration: underline;
}
.foot-nav{
    padding: 40px 10%;
    background: #1f1f1f;
    width: 100%;
    box-sizing: border-box;
}
.foot-nav li{
    float: left;
    width: 16.6666%;
    padding-left: 4%;
    box-sizing: border-box;
}
.foot-nav li a{
    font-size: 14px;
    color: #858585;
    display: inline-block;
    margin-top: 5px;
}
.foot-wx .img>img{
    vertical-align: middle;
    margin-right: 10px;
}
.foot-wx .img{
    position: relative;
}
.foot-wx .ewm{
    position: absolute;
    top:50px;
    left:-10px;
    padding: 10px;
    text-align: center;
    font-size: 14px;
    color: #666;
    background: #fff;
    border-radius: 10px;
    display: none;
}
.foot-wx .ewm img{
    width: 100%;
}
.foot-wx .ewm p{
    margin-top: 5px;
}
.foot-wx .img:hover .ewm{
    display: block;
}
.foot-wx .ewm:after{
    content: '';
    border-bottom: 8px solid #fff;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    position: absolute;
    top: -8px;
    left: 55px;
}
.foot-wx .dis{
    font-size: 14px;
    color: #858585;
    margin-top: 10px;
}
.foot-wx .ph{
    font-size: 22px;
    color: #858585;
    margin-top: 10px;
}
.foot-nav li a:hover{
    color: #fff;
}
.foot-nav li .title{
    margin-bottom: 5px;
}
.foot-nav .title a,.foot-nav .title{
    font-size: 22px;
    color: #c5c5c5;
    margin-top: 0;
}
.foot-nav .title a *,.foot-nav .title *{
    vertical-align: middle;
}
@media (max-width: 1500px){
    .foot-nav{
        padding: 40px 80px;
    }
    .foot-wx .ph{
        font-size: 18px;
    }
}
@media (max-width: 1000px){
    .foot-nav{
        display: none;
    }
}
/* 首页 */
.index-banner img{
    width: 100%;
}
.index-banner .swiper-pagination .swiper-pagination-bullet{
    width: 30px;
    height:4px;
    border-radius: 2px;
    background: rgba(0,0,0,.8);
    opacity:1;
}
.swiper-button-next, .swiper-button-prev{
    position: absolute;
    top: 50%;
    width: 30px;
    height: 30px;
    margin-top: -22px;
    z-index: 10;
    cursor: pointer;
    -moz-background-size: 27px 44px;
    -webkit-background-size: 27px 44px;
    background-size: 27px 44px;
    background-position: center;
    background-repeat: no-repeat;
    opacity: .5;
}
.swiper-button-next, .swiper-container-rtl {
    background: url(../images/right-r.png);
    right: 30px;
}
.swiper-button-prev{
    background: url(../images/left-l.png);
    left: 30px;
}
.swiper-button-prev:hover,.swiper-button-next:hover{
    opacity: 1;
}
.index-banner .swiper-pagination .swiper-pagination-bullet-active{
    background: #fff;
}
.index-center{
    padding: 40px 10%;
    overflow: hidden;
}
.index-ul{
    margin: 0 -5px;
}
.index-ul li{
    float: left;
    padding: 0 5px;
    width: 15%;
    height: 500px;
    box-sizing: border-box;
    cursor: pointer;
    transition: all .5s;
}
.big-box{
    width: 100%;
    height: 100%;
    position: relative;
    background-size: 100%;
    background-repeat: no-repeat;
    background-position: center;
    overflow: hidden;
}

.big-box .layer{
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    background: rgba(0,0,0,.5);
}

.big-box img{
    width: 100%;
    display: none;
}
.box-bom{
    position: absolute;
    background:rgba(0,0,0,.8);
    width: 100%;
    height:130px;
    left: 0;
    bottom: -70px;
    padding: 20px;
    box-sizing: border-box;
    transition: all .5s;
    z-index: 10;
}
.index-ul li:first-child{
    width:40%;
    height: 500px;
}
.index-ul li:first-child .layer{
    background: rgba(0,0,0,0);
}
.box-bom .name{
    text-align: center;
    font-size: 18px;
    color: #fff;
}
.box-bom .summary{
    font-size: 15px;
    color: #fff;
    margin-top:5px;
    line-height: 24px;
    display: none;
}
.index-ul li:first-child .box-bom{
    position: absolute;
    background: rgba(223,33,40,.8);
    width: 100%;
    height:130px;
    left: 0;
    bottom: 0;
    padding: 20px;
    box-sizing: border-box;
    transition: all .5s;
}
.index-ul li:first-child .box-bom .name{
    text-align: left;
    font-size: 30px;
    color: #fff;
}
.index-ul li:first-child .box-bom .summary{
    font-size: 15px;
    color: #fff;
    margin-top:5px;
    line-height: 24px;
    display: block;
}
@media (max-width: 1200px){
    .index-center {
        padding: 20px 5%;
    }
    .index-ul li{
        margin-bottom: 10px;
    }
}
.index-news{
    padding: 40px 10% 80px;
    overflow: hidden;
}
.index-news .title{
    font-size: 30px;
    text-align: center;
    color: #222;
}
.left-news{
    float: left;
    width: 50%;
    padding: 0 30px;
    margin: 0 -30px;

}
.index-news .left-div{
    margin: 40px -20px 0;
    overflow: hidden;
}
.left-news li{
    float: left;
    padding: 0 20px;
    width: 50%;
    box-sizing: border-box;
}
.left-inside{
    position: relative;
    overflow: hidden;
}
.bom-cont{
    position: absolute;
    width: 100%;
    height: 100%;
    background: #df2128;
    padding:30px;
    box-sizing: border-box;
    transition: all .5s;
    left: 0;
    top: 100%;
}
.left-news li:hover .bom-cont{
    top: 0;
    left: 0;
    transition: all .5s;
}
.bom-cont .name{
    font-size: 20px;
    color: #fff;
    font-weight: 600;
    margin-top: 10px;
}
.bom-cont .summary{
    font-size: 14px;
    color:#ffafb2;
    margin-top: 20px;
}
.left-news .img{
    overflow: hidden;
}
.bom-cont .time{
    font-size: 24px;
    color: #fff;
}
.left-news img{
    width: 100%;
    transition: all .3s;
}
.left-inside>.name{
    font-size:20px;
    color: #222;
    margin-top: 10px;
}
.left-inside>.time{
    margin-top: 15px;
}
.left-news .mouth{
    font-size: 20px;
    color: #999;
}
.left-news .year{
    font-size: 14px;
    color: #999;
    margin-left: 10px;
}
.right-news{
    float: left;
    width: 50%;
    padding: 0 0 0 20px;
    margin-right:-20px;
    box-sizing: border-box;
}
.right-news li{
    padding:20px;
    border-bottom: 1px solid #e7e9f4;
    transition: all .3s;
    position: relative;
    overflow: hidden;
}
.right-news li:after{
    content: '';
    width: 100%;
    height: 100%;
    background: #df2128;
    position: absolute;
    left: 0;
    top: 100%;
    transition: all .3s;
}
.right-news .name{
    font-size: 18px;
    color: #222;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    position: relative;
    z-index: 10;
    transition: all .3s;
}
.right-news .summary{
    font-size: 14px;
    color: #999;
    margin-top: 10px;
    transition: all .3s;
    position: relative;
    z-index: 10;
}
.right-news li:hover{
    /*background: #df2128;*/
    padding:20px;
    transition: all .3s;
}
.right-news li:hover:after{
    top: 0;
    transition: all .3s;
}
.right-news li:hover .name{
    color: #fff;
    transition: all .3s;
    font-weight: 600;
}
.right-news li:hover .summary{
    color: #ffafb2;
    transition: all .3s;
}
.right-news li:last-child{
    border-bottom: 0;
}
.index-company{
    padding: 40px 10% 30px;
    background: #eef2f7;
}
.index-company .title{
    font-size: 30px;
    color: #222;
    text-align: center;
}
.index-company ul{
    display: flex;
    justify-content: center;
    margin: 30px -10px 0;
}
.index-company li{
    padding: 0 10px;
    /*float: left;*/
    width: 25%;
    box-sizing: border-box;
}
.index-company li img{
    width: 100%;
    transition: all 1s;
}
.company-name{
    position: relative;
    cursor: pointer;
    overflow: hidden;
    width: 100%;
}
/*.company-name img{
    position: absolute;
    top: 0;
    left: 0;
}*/
.company-name .name{
    position: absolute;
    top: 100%;
    left: 0;
    width: 100%;
    height: 100%;
    text-align: center;
    background: #373737;
    color: #fff;
    font-size:20px;
    transition: all .3s;
    display: flex;
    justify-content: center;
    align-items: center;
}
.company-name:hover .name{
    top: 0;
    transition: all .3s;
}
@media (max-width: 768px) {
    .left-news{
        display: none;
    }
    .index-news .title{
        display: none;
    }
    .right-news{
        width: 100%;
        padding: 0;
    }
    .index-news .left-div{
        margin:0;
    }
    .index-news{
        padding: 0 5% 40px;
    }
    .index-company li{
        width: 50%;
        margin-bottom: 20px;
    }
    .index-company{
        padding: 40px 5% 30px;
    }
    .company-name .name{
        font-size: 16px;
    }
    .index-company .title{
        font-size: 20px;
    }
    .index-banner .swiper-pagination{
        display: none;
    }
    .index-ul li{
        padding: 0 10px;
        margin-bottom: 20px;
    }
    .index-ul{
        margin:0 -10px;
    }
}

/* 新闻详情 */
.news-detail-banner img{
    width: 100%;
}
.detail-cont{
    padding: 2% 20%;
}
.detail-cont .title{
    text-align: center;
    font-size: 24px;
    color: #222;
}
.detail-cont .author{
    font-size: 14px;
    color: #999;
    text-align: center;
    margin-top: 10px;
    padding-bottom: 20px;
    border-bottom: 1px solid #e8e8e8;
}
@media (max-width: 768px){
    .detail-cont{
        padding: 20px;
    }
    .detail-cont .share-box{
        display: none;
    }
}
.news-content{
    padding: 20px 0;
}
.return-pre a{
    font-size: 16px;
    color: #666;
    display: inline-block;
    width: 90px;
    background: url(../images/return.png) no-repeat;
    background-size: 18px 14px;
    background-position: center right;
    text-align: left;
}
.return-pre{
    text-align: right;
    padding-bottom: 10px;
}
.return-pre a:hover{
    color: #df2128;
    background: url(../images/re-icon.png) no-repeat;
    background-size: 18px 14px;
    background-position: center right;
}
.return-pre img{
    width:22px;
    opacity: .4;
}
.news-link a{
    display: inline-block;
    width: 40%;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    font-size: 16px;
    color: #999;
    margin-top: 20px;

}
.news-link .pre{
     float: left;
 }
.news-link .next{
    float: right;
    text-align: right;
}
.news-link a:hover{
    color: #df2128;
}
@media (max-width: 1000px) {
    .news-link a{
        display: inline-block;
        width: 100%;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
        font-size: 16px;
        color: #999;
        margin-top: 20px;
        text-align: center!important;
    }

}

/* 关于我们 */
.about-banner>img{
    width: 100%;
}
.about-banner{
    position: relative;
}
.ab-nav{
    overflow: hidden;
    overflow-x: scroll;
    -ms-overflow-style: none;
    position: absolute;
    width: 100%;
    height: 55px;
    left: 0;
    bottom: 0;
    padding: 0 10%;
    background: rgba(0,0,0,.7);
    box-sizing: border-box;
}
.ab-nav .home{
    float: left;
    line-height: 55px;
}
.ab-nav .home *{
    vertical-align: middle;
    font-size: 18px;
    color: #fff;
}
.ab-nav .home img{
    margin-top: -7px;
}
.ab-nav .home i{
    color:#838588;
    margin: 0 10px;
}
.ab-nav .ja-nav{
    float: right;
    height: 55px;
}
.ab-nav::-webkit-scrollbar{
    display: none;
}
.ab-nav li{
    float: left;
    margin-left:15px;
}
.ab-nav li a{
    display: inline-block;
    padding: 0 20px;
    height: 55px;
    line-height: 55px;
    font-size: 16px;
    color: #b9b9b9;
    text-align: center;
}
.ab-nav .active a{
    background: #df2128;
    color:#fff;
}
.ab-nav ul a:hover{
    color:#fff;
}
@media (min-width: 768px) and (max-width: 1300px){
    .ab-nav li{
        float: left;
        margin-left:0;
    }
    .ab-nav li a{
        padding: 0 15px;
    }
}
@media (max-width: 768px){
    .ab-nav ul{
        width: 675px;
        float: left;
    }
    .ab-nav .ja-nav{
        float: none;
    }
    .ab-nav li{
        float: left;
    }
    .ab-nav .home{
        display: none;
    }
    .ab-nav{
        padding: 0;
    }
}
.company-intro .name{
    font-size: 24px;
    color: #333;
    text-align: center;
    font-weight: 500;
    padding-top:50px;
}
.company-intro .summary{
    font-size: 14px;
    color: #333333;
    text-align: center;
    padding: 0 25%;
    margin-top: 20px;
    line-height: 26px;
}
.daq-content{
    margin-top: 100px;
    background: url(../upload/daq-bg.jpg) no-repeat center top/cover;
    padding:2% 20%;
    position: relative;
}
.daq-content .daq-up{
    position: absolute;
    left: 0;
    top: -20px;
    width: 100%;
    text-align: center;
}
.daq-content .daq-up span{
    display: inline-block;
    width: 40px;
    height: 40px;
    text-align: center;
    background: #df2128;
    border-radius: 100%;
}
.daq-content .daq-up img{
    margin-top: 15px;
}
.daq-content .content{
    padding: 40px;
    background: #fff;
    height: 800px;
    overflow-y:scroll;
    -ms-overflow-style: none;
}
.daq-content .content::-webkit-scrollbar{
    display: none;
}
.time-ul{
    display: inline-block;
    width: 100%;
    text-align: center;
    margin: 40px 0;
}
.time-ul li{
    display: inline;
}
.time-ul div{
    text-align: center;
    padding: 0 30px;
    font-size:14px;
    color: #df2128;
    display: inline-block;
}
.time-ul .num{
    font-size: 36px;
}
.time-ul .dis{
    font-size: 14px;
    color: #999;
}
@media (max-width: 768px){
    .company-intro .summary{
        padding: 0 20px;
    }
    .right-float{
        display: none;
    }
    .daq-content .content{
        padding: 20px;
        overflow-y: auto;
        height: auto;
    }
    .daq-content{
        margin-top:00px;
        background: none;
        padding:0;
        position: relative;
    }
    .time-ul div{
        text-align: center;
        padding: 0 10px;
        font-size:14px;
        color: #df2128;
        display: inline-block;
    }
    .daq-up{
        display: none;
    }
}
.about-ckg{
    background:#fff;
    padding: 5% 20%;
}
.daq-ckg-cont{
    transition: all 1s;
    min-height: 600px;
}
.about-ckg .title{
    font-size: 30px;
    color: #222;
    text-align: center;
}
.about-ckg ul{
    display: flex;
    justify-content: center;
    margin: 30px -10px;
}
.about-ckg ul li{
    padding:0 10px;
    /*float: left;*/
    width: 25%;
    box-sizing: border-box;
    cursor: pointer;
}
.about-ckg ul li img{
     width: 100%;
     border: 1px solid #e2e2e2;
     box-sizing: border-box;
 }
.img-div{
    position: relative;
    overflow: hidden;
}
.about-ckg ul li .navImage{
    width: 100%;
    border: 1px solid #e2e2e2;
    box-sizing: border-box;
    position: absolute;
    left: 0;
    top: 99%;
    transition: all .2s;
}
.about-ckg ul .active .navImage{
    top: 0;
}
.about-ckg ul li div:hover .navImage{
    top: 0;
    transition: all .2s;
}
@media (max-width: 768px){
    .about-ckg{
        padding:20px;
    }
    .about-ckg ul li{
        padding:0 10px;
        float: left;
        width: 50%;
        box-sizing: border-box;
        margin-bottom: 20px;
    }
    .about-ckg .title{
        font-size: 24px;
        color: #222;
        text-align: center;
    }
}

/* 新闻列表 */
.daq-news{
    padding: 2% 10% 0;
    background:#f6f6fc;
    overflow: hidden;
}
.news-scroll{
    background: #fff;
}
.news-div .img{
    width: 40%;
    float: left;
    padding: 40px 20px 40px 40px;
    box-sizing: border-box;
}
.news-div .cont{
    width: 60%;
    padding: 30px;
    box-sizing: border-box;
    float: left;
}
.news-div .title{
   font-size: 26px;
    color: #000;
    margin-top: 2vw;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.news-div .title a{
    color: #000;
}
.news-div .title a:hover{
    color: #df2128;
}
.news-div .mouth{
    margin-top: 20px;
    font-size: 24px;
    color: #999;
    font-weight: 600;
}
.news-div .year{
    font-size: 16px;
    color: #999;
    margin-top:5px;
}
.news-div .summary{
    font-size: 14px;
    color: #333;
    margin-top: 20px;
    line-height: 24px;
    padding-right: 10px;
    box-sizing: border-box;
}
.news-div .more{
    display: inline-block;
    width:150px;
    height: 50px;
    border:1px solid #e2e2e2;
    line-height: 50px;
    text-align: center;
    font-size: 14px;
    color: #999;
    margin-top:6vw;
}
.news-div .more span{
    display: inline-block;
    width:14px;
    height: 12px;
    background: url(../images/rig-h.png) no-repeat;
}
.news-div .more:hover{
    background: #df2128;
    border-color: #df2128;
    color: #fff;
}
.news-div .more:hover span{
    background: url(../images/rig.png) no-repeat;
}
.news-scroll .flex-control-nav{
    bottom: auto;
    top:30px;
    text-align: right;
    padding-right: 40px;
    box-sizing: border-box;
}
.news-scroll .flex-control-nav .flex-active{
    background: #bababa!important;
    box-shadow: none;
}
.news-scroll .flex-control-paging li a{
    background: #dedede!important;
    box-shadow: none;
}
.news-scroll .flexslider{
    margin: 0;
    border: 0;
}
@media (max-width: 1200px){
    .news-div .img{
        display: none;
    }
    .news-div .cont{
        width: 100%;
        padding: 0;
    }
    .daq-news{
        padding: 12px;
    }
    .news-scroll .flex-control-nav{
        display: none;
    }
    .news-scroll{
        padding: 10px;
    }
}
.news-list{
    padding: 16px 10% 32px;
    background: #f6f6fc;
    overflow: hidden;
}
.news-list-ul{
    display: flex;
    flex-wrap: wrap;
    margin:0 -16px;
}
.news-list-ul li{
    padding:16px;
    width: 24.99%;
    box-sizing: border-box;
    position: relative;
    top:0;
    transition: all .5s;
}
.news-list-ul li>div{
    position: relative;
}
.news-list-ul li .tips{
    position: absolute;
    left: 0;
    top: 0;
    background: #df2128;
    color: #fff;
    padding: 15px 10px 20px;
    width: 54px;
    font-size: 14px;
    border-bottom-left-radius: 27px;
    border-bottom-right-radius: 27px;
    text-align: center;
    box-sizing: border-box;
    height: 65px;
}
.news-list-ul li img{
    width: 100%;
}
.news-list-ul .content{
    padding: 20px 15px;
    background: #fff;
}
.news-list-ul .name{
    height: 55px;
    font-size: 18px;
    color: #222;
    padding-bottom: 20px;
    border-bottom: 1px solid #e8e8f1;
    position: relative;
}
.news-list-ul .name:after{
    content: '';
    height: 1px;
    width:0;
    background: #df2128;
    position: absolute;
    left: 0;
    bottom:-1px;
    transition: all .2s;
}
.news-list-ul .name .line{
    position: absolute;
    display: inline-block;
    width: 0;
    height: 1px;
    background: #df2128;
    left:0;
    bottom:-1px;
    transition:all .3s;
}
.news-list-ul .time{
    font-size:14px;
    color: #999;
    text-align: center;
    padding:20px 5px 10px;
}
.news-list-ul li:hover{
    top: -16px;
    transition: all .5s;
}
.news-list-ul li:hover .name{
    color: #df2128;
}
.news-list-ul li:hover .name:after{
    width: 100%;
    transition:all .2s;
}
.news-list-ul li:hover .line{
    width:100%;
    transition:all .3s;
}
@media (max-width: 1500px) {
    .news-list-ul li{
        width: 33.3333%;
    }
}
@media (max-width: 1000px){
    .news-list-ul li{
        width: 50%;
    }
}
@media (max-width: 450px) {
    .news-list-ul li{
        width: 100%;
    }
    .news-list{
        padding: 12px;
    }
}

/* 联系我们 */
.contact-cont{
    padding: 5% 15%;
    background: #f6f6fc;
}
.contact-maps{
    position: relative;
    width: 60%;
}
.contact-maps img{
    width: 100%;
    max-width: 721px;
}
.contact-mob{
    width: 700px;
    padding:24px;
    box-sizing: border-box;
    background: #fff;
    position: absolute;
    top: 40px;
    right: -700px;
}
.contact-mob .name{
    font-size: 36px;
    color: #222;
    margin-bottom: 30px;
}
.contact-mob .phone{
    margin-left: 120px;
    padding-bottom: 30px;
    /*border-bottom: 1px solid #e8e8e8;*/
}
.contact-mob .icon{
    display: inline-block;
    float: left;
    width: 80px;
    height: 80px;
    margin-right: 50px;
    border-radius: 100%;
    background: #fff0ea;
    text-align: center;
}
.contact-mob .icon img{
    width: 50px;
    margin-top:21px;
}
.contact-mob .num{
    float: left;
    margin-left: 15px;
    font-size: 18px;
    color: #222;
    width: 310px;
    margin-top: 10px;
}
.contact-mob .num i{
    font-size: 20px;
    margin-top: 10px;
    display: inline-block;
}
.contact-mob .num p{
    margin-top: 15px;
   font-size: 14px;
    color: #666;
}
.contact-mob .message p{
    margin-bottom: 15px;
}
.contact-list {
    color: #666;
    font-size: 14px;
    line-height: 30px;
}
.contact-list li {
    overflow: hidden;
}
.contact-list .fl {
    width: 465px;
}
.contact-list .fr {
    font-weight: bold;
}
@media (max-width: 1300px){
    .contact-maps{
        width: 100%;
        position: static;
    }
    .contact-mob{
        position: static;
        width: 100%;
        margin-bottom: 30px;
    }
}
@media (max-width: 768px){
    .contact-cont{
        padding: 5% 12px;
    }
    .contact-mob .name{
        font-size: 24px;
    }
    .contact-mob .num{
        font-size: 16px;
    }
    .contact-mob .num i{
        font-size: 18px;
    }
    .contact-mob .icon{
        width: 80px;
        height: 80px;
    }
    .contact-mob .icon img{
        width: 50px;
    }
}
@media (max-width: 414px) {
    .contact-mob .icon{
        display: none;
    }
    .contact-mob .name{
        margin-bottom: 15px;
    }
    .contact-mob .num{
        margin-left: 0;
    }
}
/* 發展歷史 */
.daq-history{
    padding: 80px 20%;
}
.daq-history li{
    padding: 55px 45px;
    border-top: 1px solid #e3e3e3;
    margin-top: 100px;
    opacity: 0;
    transition: all 1s;
}
.daq-history li:last-child{
    border-bottom: 1px solid #e3e3e3;
}
.history-box{
    display: flex;
}
.history-box .year{
    display: flex;
    align-items: center;
    justify-content: center;
    width: 125px;
    font-size: 36px;
    color: #666;
}
.history-box .cont{
    flex: 1;
    font-size: 16px;
    color: #222;
    margin-left: 70px;
    display: flex;
    align-items: center;
}
@media (max-width: 768px){
    .daq-history{
        padding: 30px 10px;
    }
    .history-box .year{
        display: flex;
        align-items: center;
        justify-content: center;
        width: 80px;
        font-size: 18px;
        color: #666;
    }
    .daq-history li{
        padding: 10px;
        border-top: 1px solid #e3e3e3;
        margin-top: 100px;
        opacity: 0;
        transition: all 1s;
    }
    .history-box .cont{
        flex: 1;
        font-size: 14px;
        color: #222;
        margin-left: 10px;
    }
}

/*  产品中心 */
.product-center{
    padding:40px 10% ;
    background:#f6f6fc ;
}
.product-tips{
    width: 100%;
    border: 1px solid #e3e3e3;
    background: #fff;
    box-sizing: border-box;
}
.product-tips li{
    width: 25%;
    box-sizing: border-box;
    border-right: 1px solid #e3e3e3;
    text-align: center;
    height: 60px;
    line-height: 60px;
    float: left;
    font-size: 18px;
    color: #333;
    cursor: pointer;
}
.product-tips li:last-child{
    border: none;
}
.product-tips .active{
    background: #df2128;
    color: #fff;
    border-color: #df2128;
    font-weight: 600;
}
.product-tips li:hover{
    background: #df2128;
    color: #fff;
    border-color: #df2128;
    font-weight: 600;
}
.product-list{
    padding: 20px 0;
    margin: 0 -20px;
}
.product-list li{
    width: 25%;
    padding: 19px;
    box-sizing: border-box;
    position: relative;
    top: 0;
    transition: all .5s;
    float: left;
}
.product-list .img{
    overflow: hidden;
}
.product-list img{
    width: 100%;
    transition: all .5s;
}
.product-list .cont{
    padding: 20px;
    background: #fff;
}
.product-list .title{
    font-size: 20px;
    color: #222;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
}
.product-list .summary{
    font-size: 14px;
    color: #777;
    margin-top: 5px;
    overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.product-list li:hover{
    top: -20px;
}
.product-list li:hover .title{
    color: #df2128;
}
.product-list li:hover img{
    transform: scale(1.1,1.1);
    transition: all .5s;
}
@media (max-width: 1200px){
    .product-list li{
        width: 33.3333%;
    }
}
@media (max-width: 768px){
    .product-list li{
        width: 50%;
    }
    .product-center{
        padding: 20px;
    }
}
@media (max-width: 420px){
    .product-list li{
        width: 50%;
        padding:10px;
    }
    .product-list .cont{
        padding:10px;
    }
    .product-list{
        margin:0 -10px
    }
    .product-tips li{
        width: 50%;
        height:40px;
        line-height: 40px;
        font-size:16px;
    }
    .product-tips li:nth-child(even){
        border: none;
    }
    .product-tips li:nth-child(3),
    .product-tips li:nth-child(4){
        border-top:1px solid #e3e3e3;
    }
}

/* 产品详情 */
.product-detail{
    padding: 30px 20%;
}
.product-detail .title{
    font-size: 36px;
    color: #222;
    text-align: center;
    padding-bottom: 30px;
}
@media (max-width: 768px){
    .product-detail{
        padding: 24px;
    }
    .product-detail .title{
        font-size: 30px;
        text-align: left;
    }
}

/* 荣誉证书 */
.honor-list{
    padding:2% 10%;
    background: #fff;
}
.honor-list .title{
    font-size: 24px;
    color: #222;
    text-align: center;
    margin-top: 30px;
}
.honor-zs{
    margin: 15px -15px 0;
}
.honor-zs li{
    padding: 15px;
    width: 25%;
    box-sizing: border-box;
    float: left;
}
.honor-zs li .img{
    width: 100%;
    overflow: hidden;
    border:1px solid #e2e2e2;
    box-sizing: border-box;
}
.honor-zs li img{
    width: 100%;
    transition: all .5s;
}
.honor-zs li img:hover{
    transform: scale(.9,.9);
    transition: all .5s;
}
@media (max-width: 1200px){
    .honor-zs li{
        padding: 15px;
        width: 33.3333%;
        box-sizing: border-box;
        float: left;
    }
}
.yd-banner{
    display: none;
}
@media (max-width:768px){
    .honor-zs li{
        padding: 15px;
        width: 50%;
        box-sizing: border-box;
        float: left;
    }
    .pc-banner{
        display: none;
    }
    .yd-banner{
        display: block;
        width: 100%;
    }
}
@media (max-width:450px){
    .honor-zs li{
        padding: 5px;
        width: 50%;
        box-sizing: border-box;
        float: left;
    }
    .honor-list{
        padding: 20px;
    }
}

/* 公司案例 */
.zf-case{
    padding: 2% 10% 50px;
}
.case-dis{
    float: left;
    width: 50%;
}
.case-dis .title{
    font-size: 26px;
    color: #000;
    margin-top: 50px;
}
.case-dis .summary{
    font-size: 16px;
    color: #333;
    margin-top: 20px;
    line-height: 26px;
}
.case-rig{
    float: left;
    width: 50%;
    padding-left: 30px;
    box-sizing: border-box;
    padding-top: 70px;
}
.case-rig img{
    width: 100%;
}
@media (max-width: 1200px) {
    .case-rig{
        display: none;
    }
    .case-dis{
        float: left;
        width: 100%;
    }
}
.com-sase .title{
    font-size: 22px;
    color: #000;
    margin-top: 20px;
}
.com-sase .summary{
    font-size: 16px;
    color: #333;
    margin-top: 20px;
    line-height: 26px;
}
.case-list{
    margin: 20px -10px 0;
}
.case-list li{
    width: 25%;
    padding: 10px;
    box-sizing: border-box;
    float: left;
}
.case-list li img{
    width: 100%;
    transition: all .5s;
}
.case-list li .img{
    overflow: hidden;
}
.case-list li .img:hover img{
    transition: all .5s;
    transform: scale(1.1,1.1);
 }
.case-list li p{
    font-size: 16px;
    color: #333;
    text-align: center;
    overflow: hidden;
    text-overflow: ellipsis;
    white-space: nowrap;
    padding: 10px 0;
}
@media (max-width:1366px) {
    .case-list li{
        width: 33.3333%;
        padding: 10px;
        box-sizing: border-box;
        float: left;
    }
}
@media (max-width:420px) {
    .case-list li{
        width:50%;
        padding: 10px;
        box-sizing: border-box;
        float: left;
    }
    .zf-case{
        padding: 20px 20px 50px;
    }
}
/* 党政工作 */
.daq-party{
    padding: 16px 10%;
    background: #f6f6fc;
}
.daq-party>div{
    padding: 50px;
    background: #fff;
}
.daq-party>div>.title{
    font-size: 36px;
    padding-bottom:10px;
    border-bottom: 2px solid #df2128;
    color: #df2128;
}
.js_party{
    margin-top:30px;
}
.js_party .title a{
    font-size: 26px;
    color: #000;
    font-weight: 500;
}
.js_party .title a:hover{
    color:#df2128;
}
.js_party .author{
   font-size: 18px;
    color: #999;
    margin-top: 10px;
}
.js_party .summary{
    font-size:14px;
    color: #333;
    margin-top: 15px;
}
.js_party ul{
    position:relative;
}
.js_party .more{
    display:inline-block;
    width: 120px;
    height: 40px;
    color: #999;
    font-size: 14px;
    text-align: center;
    line-height: 40px;
    border: 1px solid #e2e2e2;
    position: absolute;
    right: 0;
    top:-70px;
}
.js_party .more:hover{
    background: #df2128;
    border-color: #df2128;
    color: #fff;
}
.index-news .more{
    display: inline-block;
    width: 150px;
    height: 50px;
    border: 1px solid #e2e2e2;
    line-height: 50px;
    text-align: center;
    font-size: 14px;
    color: #999;
    margin-top: 20px;
}
.index-news .more span{
    display: inline-block;
    width: 14px;
    height: 12px;
    background: url(../images/rig-h.png) no-repeat;
}
.index-news .more:hover{
    background: #df2128;
    border-color: #df2128;
    color: #fff;
}
.index-news .more:hover span{
    background: url(../images/rig.png) no-repeat;
}
@media (max-width:700px) {
    .daq-party{
        padding:12px;
    }
    .daq-party>div{
        padding: 24px;
    }
    .js_party .more{
        display:none;
    }
}
.daq-solution{
    padding:16px 12% 60px;
    background: #ebf0f4;
    margin-top: -4px;
}
.daq-solution li{
    position:relative;
    margin-top: 24px;
    width: 100%;
    left:0;
    transition: all .2s;
}
.daq-panorama li:nth-child(even) .solu-left{
    float: right;
}
.daq-panorama li:nth-child(even) .solu-right{
    left: 0;
    top:0;
}
.daq-panorama li:nth-child(even) .in{
    padding-right: 0;
}
.daq-panorama li:nth-child(odd) .in{
    padding-left: 0;
}
.solu-left{
    width:46%;
    overflow: hidden;
    position: relative;
    z-index: 5;
    padding: 24px;
    box-sizing: border-box;
    background: #fff;
}
.daq-panorama .solu-left{
    width:30%;
    overflow: hidden;
    position: relative;
    z-index: 5;
    padding: 24px;
    box-sizing: border-box;
    background: #fff;
}
.js_list li:hover{
    left:5px;
    transition: all .2s;
}
.solu-left img{
    width: 100%;
    transition: all .3s;
}
.solu-right{
    position: absolute;
    width:54%;
    height: 100%;
    left:46%;
    top:0;
    box-sizing: border-box;
}
.daq-panorama .solu-right{
    position: absolute;
    width:70%;
    height: 100%;
    left: 30%;
    top:0;
    box-sizing: border-box;
}
.solu-right .in{
    width: 100%;
    height: 100%;
    background:#fff;
    padding: 35px;
    box-sizing:border-box;
    position:relative;
}
.solu-right .title{
    font-size: 24px;
    color:#000;
}
.solu-right .title a{
    color:#000;
}
.daq-panorama .solu-right .summary{
    font-size: 16px;
    color:#666;
    line-height: 20px;
    margin-top: 10px;
}
.solu-right .summary{
    font-size: 16px;
    color:#666;
    line-height: 24px;
    margin-top: 10px;
}
.solu-right .summary a{
     color:#666;
 }
.solu-right .more{
    display: inline-block;
    width: 120px;
    height: 40px;
    line-height: 40px;
    text-align: center;
    position:absolute;
    bottom: 40px;
    left: 40px;
    border: 1px solid #e2e2e2;
    color: #999;
    font-size:14px;
}
.solu-right .more:hover{
    color:#fff;
    background: #df2128;
    border-color: #df2128;
}
@media (max-width: 1190px) {
    .daq-solution li>div{
        width: 100%;
        padding: 0;
        position: static;
        float: left;
    }
    .video-in{
        background:#ebf0f4;
        padding:0!important;
    }
    .daq-solution li .in{
        position: static;
        padding: 24px;
    }
    .solu-right .more{
        margin-top: 50px;
        position: static;
    }
}
@media (max-width: 1200px){
    .daq-solution{
        padding: 10px 10px 40px;
        background: #ebf0f4;
    }
}
@media (max-width:768px){
    .solu-right .title{
        font-size: 24px;
    }
}
#pan-video{
    width: 100%;
}
.video-in{
    background:#ebf0f4;
    padding:40px 12% 0;
    border-top: 1px solid #e2e2e2;
}
@media screen and (min-width:1200px) and (max-width: 1920px){
    .case-map{
        height:933px;
        background: url(../upload/bg.jpg) top center no-repeat;
        overflow: hidden;
    }
    .center-div{
        width: 1200px;
        margin: 0 auto;
        height: 100%;
        text-align: center;
    }
    .center-div .title{
        text-align: center;
        font-size: 36px;
        color: #2ef3ff;
        margin-top: 75px;
    }
    .center-div .num{
        padding: 0 259px;
        box-sizing: border-box;
        margin-top: 30px;
    }
    .center-div .num>div{
        display: inline-block;
        float: left;
        margin: 0 25px;
    }
    .center-div .num span{
        font-size: 30px;
        color: #fff;
    }
    .center-div .num i{
        font-size: 16px;
        vertical-align: top;
    }
    .center-div .num p{
        font-size: 16px;
        color: #b2dbff;
        margin-top: 10px;
    }
    .center-div .map{
        width: 802px;
        margin: 10px auto;
        position: relative;
    }
    .center-div .sf{
        position: absolute;
        top: 0;
        left: 0;
        z-index: 50;
    }
    .center-div .line{
        position: absolute;
        z-index: 10;
    }
    .line-icon{
        position: absolute;
        z-index: 10;
        width: 0;
        height: 0;
        top: 342px;
        left: 400px;
        animation:line-icon 2s linear 1 forwards;
    }
    @keyframes line-icon{
        0% {width: 0;height: 0}
        100%{width: 536px;height: 467px;top:87px;left: 180px}
    }
    .cq,.gz,.guangx,.guangd,.hail,.hulan{
        top:350px;
    }
    .cq{
        width: 0;
        animation:cq .5s linear 1 forwards;
        -moz-animation:cq .5s linear 1 forwards;
        -webkit-animation:cq .5s linear 1 forwards;
        -o-animation:cq .5s linear 1 forwards;
    }
    @keyframes cq{
        0% {width: 0;height: 0}
        100%{width: 40px;height: 22px}
    }
    .gz{
        animation:gz .8s linear 1 forwards;
        -moz-animation:gz .8s linear 1 forwards;
        -webkit-animation:gz .8s linear 1 forwards;
        -o-animation:gz .8s linear 1 forwards;
    }
    @keyframes gz{
        0% {width: 0}
        100%{width: 40px}
    }
    .guangx{
        animation:guangx 1s linear 1 forwards;
        -moz-animation:guangx 1s linear 1 forwards;
        -webkit-animation:guangx 1s linear 1 forwards;
        -o-animation:guangx 1s linear 1 forwards;
    }
    @keyframes guangx{
        0% {height: 0}
        100%{height: 147px}
    }
    .yunl{
        top: 350px;
        left:398px;
        height: 0px;
        width: 0px;
        animation:yunl 1s linear forwards;
        -moz-animation:yunl 1s linear forwards;
        -webkit-animation:yunl 1s linear forwards;
        -o-animation:yunl 1s linear forwards;
    }
    @keyframes yunl{
        0% {height:1px;width: 0px;left: 398px}
        100%{height: 105px;width: 43px;left: 355px}
    }
    .hail{
        height: 0px;
        width: 0px;
        animation:hail 1.5s linear 1 forwards;
        -moz-animation:hail 1.5s linear 1 forwards;
        -webkit-animation:hail 1.5s linear 1 forwards;
        -o-animation:hail 1.5s linear 1 forwards;
    }
    @keyframes hail{
        0% {height:0;width: 0}
        100%{height: 212px;width: 97px}
    }
    .guangd{
        height: 0px;
        width: 0px;
        animation:guangd 1.3s linear 1 forwards;
        -moz-animation:guangd 1.3s linear 1 forwards;
        -webkit-animation:guangd 1.3s linear 1 forwards;
        -o-animation:guangd 1.3s linear 1 forwards;
    }
    @keyframes guangd{
        0% {height:0;width: 0}
        100%{height: 147px;width: 158px}
    }
    .hulan{
        height: 0px;
        width: 0px;
        animation:hulan 1s linear 1 forwards;
        -moz-animation:hulan 1s linear 1 forwards;
        -webkit-animation:hulan 1s linear 1 forwards;
        -o-animation:hulan 1s linear 1 forwards;
    }
    @keyframes hulan{
        0% {height:0;width: 0}
        100%{height: 49px;width: 151px}
    }
    .hubei{
        top:340px;
        height: 0px;
        width: 0px;
        animation:hubei 1s linear 1 forwards;
        -moz-animation:hubei 1s linear 1 forwards;
        -webkit-animation:hubei 1s linear 1 forwards;
        -o-animation:hubei 1s linear 1 forwards;
    }
    @keyframes hubei{
        0% {height:0;width: 0}
        100%{height: 15px;width: 169px}
    }
    .js{
        top: 349px;
        height: 0;
        width: 0;
        animation:js 1.2s linear 1 forwards;
        -moz-animation:js 1.2s linear 1 forwards;
        -webkit-animation:js 1.2s linear 1 forwards;
        -o-animation:js 1.2s linear 1 forwards;
    }
    @keyframes js{
        0% {height:0;width: 0;top: 349px}
        100%{height: 29px;width: 247px;top:320px}
    }
    .jx{
        top: 345px;
        height: 0;
        width: 0;
        animation:jx 1s linear 1 forwards;
        -moz-animation:jx 1s linear 1 forwards;
        -webkit-animation:jx 1s linear 1 forwards;
        -o-animation:jx 1s linear 1 forwards;
    }
    @keyframes jx{
        0% {height:0;width: 0}
        100%{height: 41px;width: 201px}
    }
    .sx{
        top: 341px;
        height: 0;
        width: 0;
        animation:sx .8s linear 1 forwards;
        -moz-animation:sx .8s linear 1 forwards;
        -webkit-animation:sx .8s linear 1 forwards;
        -o-animation:sx .8s linear 1 forwards;
    }
    @keyframes sx{
        0% {height:0;width: 0;top: 341px}
        100%{height: 61px;width: 86px;top:280px}
    }
    .hel{
        top: 345px;
        height: 0;
        width: 0;
        animation:hel 1s linear 1 forwards;
        -moz-animation:hel 1s linear 1 forwards;
        -webkit-animation:hel 1s linear 1 forwards;
        -o-animation:hel 1s linear 1 forwards;
    }
    @keyframes hel{
        0% {height:0;width: 0;top: 341px}
        100%{height: 65px;width: 160px;top:280px}
    }
    .heb{
        top: 343px;
        height: 0;
        width: 0;
        animation:heb 1s linear 1 forwards;
        -moz-animation:heb 1s linear 1 forwards;
        -webkit-animation:heb 1s linear 1 forwards;
        -o-animation:heb 1s linear 1 forwards;
    }
    @keyframes heb{
        0% {height:0;width: 0;top: 343px}
        100%{height: 123px;width: 169px;top:220px}
    }
    .tianj{
        top: 349px;
        height: 0;
        width: 0;
        animation:tianj 1s linear 1 forwards;
        -moz-animation:tianj 1s linear 1 forwards;
        -webkit-animation:tianj 1s linear 1 forwards;
        -o-animation:tianj 1s linear 1 forwards;
    }
    @keyframes tianj{
        0% {height:0;width: 0;top: 349px}
        100%{height: 144px;width: 211px;top:205px}
    }
    .beij{
        top:344px;
        height: 0;
        width: 0;
        animation:beij 1s linear 1 forwards;
        -moz-animation:beij 1s linear 1 forwards;
        -webkit-animation:beij 1s linear 1 forwards;
        -o-animation:beij 1s linear 1 forwards;
    }
    @keyframes beij{
        0% {height:0;width: 0;top: 344px}
        100%{height: 154px;width: 194px;top:190px}
    }
    .liaol{
        top:339px;
        height: 0;
        width: 0;
        animation:liaol 1.3s linear 1 forwards;
        -moz-animation:liaol 1.3s linear 1 forwards;
        -webkit-animation:liaol 1.3s linear 1 forwards;
        -o-animation:liaol 1.3s linear 1 forwards;
    }
    @keyframes liaol{
        0% {height:0;width: 0;top: 339px}
        100%{height: 189px;width: 288px;top:150px}
    }
    .hlj{
        top:348px;
        height: 0;
        width: 0;
        animation:hlj 1.5s linear 1 forwards;
        -moz-animation:hlj 1.5s linear 1 forwards;
        -webkit-animation:hlj 1.5s linear 1 forwards;
        -o-animation:hlj 1.5s linear 1 forwards;
    }
    @keyframes hlj{
        0% {height:0;width: 0;top: 348px}
        100%{height: 258px;width: 316px;top:90px}
    }
    .nmg{
        top: 343px;
        height: 0;
        width: 0;
        animation:nmg 1s linear 1 forwards;
        -moz-animation:nmg 1s linear 1 forwards;
        -webkit-animation:nmg 1s linear 1 forwards;
        -o-animation:nmg 1s linear 1 forwards;
    }
    @keyframes nmg{
        0% {height:0;width: 0;top: 343px}
        100%{height: 163px;width: 131px;top:180px}
    }
    .ningx{
        top: 346px;
        height: 0;
        width: 0;
        animation:ningx 1s linear 1 forwards;
        -moz-animation:ningx 1s linear 1 forwards;
        -webkit-animation:ningx 1s linear 1 forwards;
        -o-animation:ningx 1s linear 1 forwards;
    }
    @keyframes ningx{
        0% {height:0;width: 0;top: 346px}
        100%{height: 126px;width: 55px;top:220px}
    }
    .qingh{
        top: 350px;
        left:380px;
        height: 0;
        width: 0;
        animation:qingh 1s linear 1 forwards;
        -moz-animation:qingh 1s linear 1 forwards;
        -webkit-animation:qingh 1s linear 1 forwards;
        -o-animation:qingh 1s linear 1 forwards;
    }
    @keyframes qingh{
        0% {height:0;width: 0;top: 350px}
        100%{height: 100px;width: 21px;top:250px}
    }
    .xz{
        top:330px;
        left: 402px;
        height: 0;
        width: 0;
        animation:xz 1s linear 1 forwards;
        -moz-animation:xz 1s linear 1 forwards;
        -webkit-animation:xz 1s linear 1 forwards;
        -o-animation:xz 1s linear 1 forwards;
    }
    @keyframes xz{
        0% {height:0;width: 0;left: 402px}
        100%{height: 24px;width: 217px;left:185px}
    }
    .xij{
        top:346px;
        left: 395px;
        height: 0;
        width: 0;
        animation:xij 1.5s linear 1 forwards;
        -moz-animation:xij 1.5s linear 1 forwards;
        -webkit-animation:xij 1.5s linear 1 forwards;
        -o-animation:xij 1.5s linear 1 forwards;
    }
    @keyframes xij{
        0% {height:0;width: 0;left: 395px;top:346px}
        100%{height: 236px;width: 175px;left:220px;top:110px}
    }
}
@media (max-width: 1190px){
    .case-map{
        display: none;
    }
    .yd-banner{
        display: block;
    }
    .pc-banner{
        display: none;
    }
}
.right-float{
    position: fixed;
    right: 0;
    bottom:330px;
    z-index: 3000;
    display: none;
}
.right-float>p{
    background:#3f3f3f;
    text-align: center;
    width: 60px;
    height: 60px;
    border-top: 1px solid #fff;
    cursor: pointer;

}
.right-float>p:hover{
    background: #df2128;
}
.right-float>p>img{
    margin-top: 20px;
}
.right-float>.wx{
    border: none;
    position: relative;
}
.right-float>.wx span{
    padding: 10px;
    border-radius: 10px;
    background: #fff;
    position: absolute;
    border:1px solid #e2e2e2;
    left: -140px;
    top:-25px;
    display: none;
    transition: all .3s;
}
.right-float>.wx:hover span{

    opacity: 1;
    transition: all .3s;
    display: block;
}