/*header*/

    .header{

        position: fixed;

        top: 0;

        left: 0;

        z-index: 99999;

        width: 100%;

        /*transition: all 0.35s;*/

        /*opacity: 1;*/

        background: rgba(0,0,0,.8);

    }

    /*.header.block{

        opacity: 1;

        background: rgba(0,0,0,.8);



        transition: opacity .5s ease-in-out;

       -webkit-transition: opacity .5s ease-in-out;

       -o-transition: opacity .5s ease-in-out;

       -ms-transition: opacity .5s ease-in-out;

       -moz-transition: opacity .5s ease-in-out;

    }*/

    /*.header.none{

        opacity: 0;



        transition: opacity .5s ease-in-out;

       -webkit-transition: opacity .5s ease-in-out;

       -o-transition: opacity .5s ease-in-out;

       -ms-transition: opacity .5s ease-in-out;

       -moz-transition: opacity .5s ease-in-out;

    }*/

    .header_top{

        border-bottom: 1px solid #393b42;

        height: 50px;

        line-height: 50px;

    }

    .header_top_phone{

        float: right;

        color: #fff;

        padding-left: 25px;

        margin-right: 10px;

        background: url(../image/header_top_phone.png)no-repeat center left;

    }

    .header_top_search{

        float: right;

    }

    .header_top_search_input{

        float: left;

        height: 50px;

        width: 0;

        border:1px solid transparent;

        background: transparent;

        padding-left: 10px;

        color: #fff;



        transition: all .8s ease-in-out;

       -webkit-transition: all .8s ease-in-out;

       -o-transition: all .8s ease-in-out;

       -ms-transition: all .8s ease-in-out;

       -moz-transition: all .8s ease-in-out;

    }

    .header_top_search_input:focus{

        width: 300px;

        border: 1px solid #00c1de; 

    }

    .header_top_search_button{ cursor: pointer;

        border: none;

        float: left;

        background-color: transparent;

        background: url(../image/header_top_search.png)no-repeat center center;

        width: 50px;

        height: 50px;

        border-right: 1px solid #393b42;

    }



    .header_top_search.active .header_top_search_input{

        width: 300px;

        border: 1px solid #00c1de; 

    }

    .header_top_logo{

        display: none;

        float: left;

        font-size: 0;

        margin-left: 20px;

    }





    .header_nav{

        border-bottom: 1px solid #393b42;

        height: 50px;

        line-height: 50px;

    }

    .logo{

        float: left;

        font-size: 0;

    }

    .logo > img{

        vertical-align: middle;

    }

    .header_nav_ul{

        float: left;

        margin-left: 10px;



        position: relative;

    }

    .header_nav_ul > ul li {

        display: inline-block;

        padding: 0 20px;

        font-size: 16px;

        color: #fff;

        position: relative;

    }

    .header_nav_ul > ul li.content.active:after{

        content: '';

        position: absolute;

        left: 50%;

        margin-left: -8px;

        bottom: 0;

        border: 8px solid transparent;

        border-bottom-color: #fff; 

    }

    .header_nav_ul > ul li a {

        display: block;

    }





    .header_nav_ul > ul li a:hover {

        color: #ffcb07;

        border-bottom: 1px solid #ffcb07;

    }

    .header_nav_ul > ul li.on a{

        color: #ffcb07;

        border-bottom: 1px solid #ffcb07;

    }



    .VIRBOX {

        float: right;

        font-size: 14px;

        color: #fff;

        padding: 0 20px;

        border-left: 1px solid #393b42;

        border-right: 1px solid #393b42;

    }

    

    .dropdown{

        position: absolute;

        left: 0;

        top: 50px;

        display: none;

        width: 100%;

        background: #fff;

        border: 1px solid #393b42;

    }

    .dropdown_container{

        margin: 30px 20px;

    }

    .dropdown_container > dl{

        width: 32%;

        margin-right: 2%;

        float: left;

        line-height: 30px;

    }

    .dropdown_container > dl dt{

        font-size: 16px;

        color: #242424;

        font-weight: bold;

        border-bottom: 1px solid #eff3f5;

        margin-bottom: 10px;

        padding-left: 10px;

    }

    .dropdown_container > dl dd{

        color: #525252;

    }

    .dropdown_container > dl dd a {

        display: block;

        padding-left: 10px;

    }

    .dropdown_container > dl dd a:hover {

        background-color: #f2f4f5;

    }





    .all_nav{

        float: right;

        height: 50px;

        width: 50px;

        color: #fff;

        cursor: default;

        text-align: center;

        border-right: 1px solid #393b42;

        transition: all .2s ease-in-out;



        transition: background .5s ease-in-out;

       -webkit-transition: background .5s ease-in-out;

       -o-transition: background .5s ease-in-out;

       -ms-transition: background .5s ease-in-out;

       -moz-transition: background .5s ease-in-out;

    }

    .all_nav:hover{

        background: #00c1de;

    }

    .all_nav  img{

        width: 18px;

    }

    /*閹稿鎸抽弽宄扮础*/

     .navBtn{

        float: right;

        height: 50px;

        width: 50px;

        color: #fff;

        cursor: default;

        text-align: center;

        background: transparent;

        border-right: 1px solid #393b42;

        outline: none;

        border: none;

        cursor: pointer;

        text-align: center;

        transition: all 0.5s ease-out;

        -webkit-transition: all 0.5s ease-out;

        -ms-transition: all 0.5s ease-out;

        -o-transition: all 0.5s ease-out;

        -moz-transition: all 0.5s ease-out;

     }

     .navBtn.active {

         background: #333;

         transition: all 0.5s ease-out;

        -webkit-transition: all 0.5s ease-out;

        -ms-transition: all 0.5s ease-out;

        -o-transition: all 0.5s ease-out;

        -moz-transition: all 0.5s ease-out;

     }

     

    /*閹稿鎸抽崘鍛殠閺夛拷*/

     .navBtn > span{

        display: block;

        margin: 0 auto;

        width: 18px;

        height: 2px;

        background-color: #fff;

        margin-bottom: 2px;

        transition: all 0.5s ease-out;

        -webkit-transition: all 0.5s ease-out;

        -ms-transition: all 0.5s ease-out;

        -o-transition: all 0.5s ease-out;

        -moz-transition: all 0.5s ease-out;

        transform-origin: 0 0;

        -webkit-transform-origin: 0 0;

        -ms-transform-origin: 0 0;

        -o-transform-origin: 0 0;

        -moz-transform-origin: 0 0;

     }

     .navBtn.active {

        background: #0067cc;

     }

     .navBtn.active > span {

         /*background: #0052a7;*/

         width: 24px;

     }

     .navBtn.active > span:first-child {

         transform: rotate(45deg) translate(2px, -6px);

         -webkit-transform: rotate(45deg) translate(2px, -6px);

        -ms-transform: rotate(45deg) translate(2px, -6px);

        -o-transform: rotate(45deg) translate(2px, -6px);

        -moz-transform: rotate(45deg) translate(2px, -6px);

     }

     .navBtn.active > span:nth-child(2) {

         opacity: 0;

     }

     .navBtn.active > span:last-child {

         transform: rotate(-45deg) translate(-2px, 7px);

         -webkit-transform: rotate(-45deg) translate(-2px, 7px);

        -ms-transform: rotate(-45deg) translate(-2px, 7px);

        -o-transform: rotate(-45deg) translate(-2px, 7px);

        -moz-transform: rotate(-45deg) translate(-2px, 7px);

     }





     .dnav{

        width: 300px;

        position: absolute;

        padding:20px 0 ;

        background: rgba(0,0,0,0.9);

        top: 80px;

        right: -300px;

        transition: right 0.75s;

        -webkit-transition: right 0.75s;

        -ms-transition: right 0.75s;

        -o-transition: right 0.75s;

        -moz-transition: right 0.75s;

     }

     .dnav.active{

        right: 0px;

        transition: right 0.75s;

        -webkit-transition: right 0.75s;

        -ms-transition: right 0.75s;

        -o-transition: right 0.75s;

        -moz-transition: right 0.75s;

     }

     .dnav > li{

        /*height: 50px;*/

        line-height: 50px;

        color: #fff;

        text-align: left;

        position: relative;

        /*border-bottom: 1px solid #333;*/

    

        text-align: center;

     }

     .dnav > li{

      padding: 0 20px;

     }

     .dnav > li > a{

        display: block;

     }

     .dnav > li > a i {

        display: block;

        position: absolute;

        right: 30px;

        top: 20px;

        width: 15px;

        height: 11px;

        background: url(../image/xia_bai.png)no-repeat center;

          transition: all .3s ease-in-out;

  -webkit-transition: all .3s ease-in-out;

  -o-transition: all .3s ease-in-out;

  -ms-transition: all .3s ease-in-out;

  -moz-transition: all .3s ease-in-out;

     }

     .dnav > li > a:hover{

      background: #3366cc;

        /*color: #3366cc;*/

     }

     .dnav > li > a:hover i{

        background: url(../image/shang_bai.png)no-repeat center;

        margin-top: -3px;

     }

     .dznav{

        display: none;

        background: rgba(0,0,0,0.9);

        position: absolute;

        top: 0;

        right: 298px;

        white-space : nowrap ;

        padding: 20px;



    

     }

     .dznav li{

        /*border-bottom: 1px solid #333;*/

     }

     .dznav li a{

      display: block;

      padding: 0 20px;

     }

     .dznav li a:hover{

        background: #3366cc;

     }







/*banner*/

    .banner{

        height: 568px;

        position: relative;

    }

    .banner_img{

        width: 100%;

        text-align: center;

        left: 0;

        top: 0;

        position: absolute;

    }

    .banner_img > img{

        width: 1920px;

        position: absolute;

        left: 50%;

        margin-left: -960px;

    }

    .banner_img_r {

        position: absolute;

        right: 0;

        bottom: 17%;

        width: 30%;

    }

    .banner_img_r > img {

        width: 100%;

    }

    .swiper-slide{

        overflow: hidden;

    }

    .banner > .swiper-pagination {bottom: 5%;}

    .banner > .swiper-pagination .swiper-pagination-bullet {width: 60px; height: 3px;background: #6b6a6f;border-radius: 0; margin: 0 10px;margin-bottom: 6px; display: inline-block;opacity:1;}

    .banner > .swiper-pagination .swiper-pagination-bullet-active {width: 60px; background: #fff;}



    .banner_content{

        position: relative;

        height: 100%;

    }

    .banner_zi{

        position: absolute;

        left: 0;

        top: 32%;

        color: #fff;

        z-index: 9999;

    }

    .banner_zi > h2{

        font-size: 48px;

    

      position: relative;

      opacity: 0;

      bottom:-20px;



      -webkit-transition: 0.5s 0.5s ease-out;



      -o-transition: 0.5s 0.5s ease-out;



      transition: 0.5s 0.5s ease-out;

     }

    .swiper-slide-active .banner_zi > h2{

        bottom: 0;

        opacity: 1;

     }



    .banner_zi > p {

        font-size: 16px;

        line-height: 2.25;

        position: relative;

      opacity: 0;

      bottom:-20px;

      margin-top: 10px;



      -webkit-transition: 0.5s 0.5s ease-out;



      -o-transition: 0.5s 0.5s ease-out;



      transition: 0.5s 0.5s ease-out;

     }

    .swiper-slide-active .banner_zi > p{

        bottom: 0;

        opacity: 1;

     }

    .banner_zi > span {

        display: inline-block;

        text-align: center;

         width: 168px;

         height: 50px;

         line-height: 50px;

         font-size: 16px;

         font-weight: bold;

         background-color: #ffcb07;

         margin-top: 6%;



        position: relative;

      opacity: 0;

      bottom:-20px;



      -webkit-transition: 0.5s 0.5s ease-out;



      -o-transition: 0.5s 0.5s ease-out;



      transition: 0.5s 0.5s ease-out;

     }
    .banner_zi > span a{ display: block; }
    .swiper-slide-active .banner_zi > span{

        bottom: 0;

        opacity: 1;

     }

    .banner_img_r > img {

        position: relative;

        opacity: 0;

        bottom:-30px;



        -webkit-transition: 0.5s 0.5s ease-out;



      -o-transition: 0.5s 0.5s ease-out;



      transition: 0.5s 0.5s ease-out;

    }

    .swiper-slide-active .banner_img_r > img {

        opacity: 1;

        bottom: 0;

    }



/*footer*/

    /*footer*/

    .footer{

        padding-top: 80px;

        padding-bottom: 30px;

        background: #212231;

        color: #898a8d;

    }



    .footer_m {

        width: 32%;

        float: left;

        line-height: 1.8;

    }

    



    .footer_m_title{

        font-size: 18px;

        color: #fff;

        padding-left: 0;

    }

    .footer_m_1 {

        background: url(../image/foot_1.png) no-repeat 2px 4px;

        padding-left: 24px;

    }

    .footer_m_2 {

        background: url(../image/foot_2.png) no-repeat 0 4px;

        padding-left: 24px;

    }

    .footer_m_3 {

        background: url(../image/foot_3.png) no-repeat 2px 4px;

        padding-left: 24px;

    }

    .footer_m_4 {

        background: url(../image/foot_4.png) no-repeat -5px -2px;

        padding-left: 24px;

    }

    .footer_m_5 {

        background: url(../image/foot_5.png) no-repeat -2px 2px;

        padding-left: 24px;

    }

    .footer_m_6 {

        background: url(../image/foot_6.png) no-repeat -1px 2px;

        padding-left: 24px;

    }

    .footer_m_7 {

        background: url(../image/foot_7.png) no-repeat -1px 2px;

        padding-left: 24px;

    }







    .footer_l {

        width: 44%;

        float: left;

    }

    .footer_l > dl {

        float: left;

        width: 33.3%;

        line-height: 1.8;

    }

    .footer_l > dl dt{

        font-size: 18px;

        color: #fff;

    }

    .footer > .container a{

        transition: all 0.3s;

        -webkit-transition: all 0.3s;

        -ms-transition: all 0.3s;

        -o-transition: all 0.3s;

        -moz-transition: all 0.3s;

    }

    .footer > .container a:hover {

        color: #fff;

        text-decoration: underline;

    }



    .footer_r {

        width: 20%;

        float: right;

    }

    .footer_r > h3{

        font-size: 18px;

        color: #fff;

        margin-bottom: 10px;

    }

    .footer_r img{ width: 100px; }

    .footer_b{

        margin-top: 70px;

        padding: 20px 0;

        border-top: 1px solid #40454f;

        color: #6c6c6c;

        font-size: 12px;

    }

    .footer_b > p{

        margin-top: 10px;

        text-align: center;

    }



   .footer_b .link a{ margin:0 5px; }





/*proANDser*/

    .proANDser{

        padding-top: 80px;

        text-align: center;

    }



    .proANDser_tab{

        margin-top: 40px;

    }

    .proANDser_tab > li {

        width: 20%;

        max-width: 320px;

        height: 160px;

        display: inline-block;

        font-size: 18px;

        color: #000;

        cursor: pointer;

        border-bottom: 3px solid transparent;



        transition: all 0.5s;

        -webkit-transition: all 0.5s;

        -ms-transition: all 0.5s;

        -o-transition: all 0.5s;

        -moz-transition: all 0.5s;

    }

    .proANDser_tab > li.active{

        border-bottom: 3px solid #0054a6;

        color: #0067cc;

    }

    .proANDser_tab > li:hover{

        color: #0067cc;

    }

    .proANDser_tab_icon{
        height: 100px;
        background-repeat: no-repeat;
        -ms-background-position: center;
        background-position: center;
        transition: all 0.5s;
        -webkit-transition: all 0.5s;
        -ms-transition: all 0.5s;
        -o-transition: all 0.5s;
        -moz-transition: all 0.5s;
    }
    .proANDser_tab_icon_1{
        background-image: url(../image/jms_b.png);
    }
    .proANDser_tab_icon_2{
        background-image: url(../image/virbox_b.png);
    }
    .proANDser_tab_icon_3{
        background-image: url(../image/safe_b.png);
    }
    .proANDser_tab_icon_4{
        background-image: url(../image/phone_b.png);
    }
    .proANDser_tab_icon_5{
        background-image: url(../image/hxb_b.png);
    }

    .proANDser_tab > li.active .proANDser_tab_icon_1{
        background-image: url(../image/jms_a.png);
    }
    .proANDser_tab > li.active .proANDser_tab_icon_2{
        background-image: url(../image/virbox_a.png);
    }
    .proANDser_tab > li.active .proANDser_tab_icon_3{
        background-image: url(../image/safe_a.png);
    }
    .proANDser_tab > li.active .proANDser_tab_icon_4{
        background-image: url(../image/phone_a.png);
    }
    .proANDser_tab > li.active .proANDser_tab_icon_5{
        background-image: url(../image/hxb_a.png);
    }       
    

    .proANDser_panel{

        width: 100%;

        margin:0 auto; padding:50px 0 0 0; 

        position: relative; overflow: hidden;


        background: #f7f8fa;

    }

    .proANDser_panel li { min-height:332px; 

        /*opacity: 0;*/

        display: none;

        position: relative;

        z-index: 99;

        transition: all 0.5s;

        -webkit-transition: all 0.5s;

        -ms-transition: all 0.5s;

        -o-transition: all 0.5s;

        -moz-transition: all 0.5s;

    }

    .proANDser_panel_content {

        /*padding-left: 5%;

        padding-right: 3%;*/

    }

    .proANDser_panel li.active {

        /*opacity: 1;*/

        display: block;

    }

    .proANDser_panel canvas{

        position: absolute;

        left: 0;

        top: 0;

    }

    .proANDser_panel_item{

        width: 25%;

        float: left;

        background-repeat: no-repeat;

        -ms-background-position: left 4px;

        background-position: left 4px;



        padding-left: 30px;

        padding-right: 3%;

        margin-bottom: 50px;

        text-align: left;

    }

    .proANDser_panel_item > h3 {

        font-size: 18px;

        color: #010101;

        height: 30px;

        overflow: hidden;

    }

    .proANDser_panel_item > p {

        font-size: 14px;

        color: #848484;

        margin-top: 4px;

        height: 42px;

        overflow: hidden;

    }

    .proANDser_panel_item > .more {

        font-size: 18px;

        color: #010101;

        display: inline-block;

        width: 100px;

        height: 30px;

        line-height: 30px;

        text-align: center;

        font-size: 12px;

        color: #fff;

        margin-top: 10px;

        background: #0054a6;



        transition: all 0.5s;

        -webkit-transition: all 0.5s;

        -ms-transition: all 0.5s;

        -o-transition: all 0.5s;

        -moz-transition: all 0.5s;

    }

    .proANDser_panel_item > .more a {

        display: block;

    }

    .proANDser_panel_item > .more:hover{

        background: #ffcb07;

    }



/*solution*/

    .solution{

        margin-top: 80px;

    }

    .solution_main{

        margin-top: 70px;

    }

    .solution_main > li{

        width: 25%;

        float: left;

        overflow: hidden;

        position: relative;

    }

    .solution_up {

        height: 100%;

        position: relative;

    }

    .solution_up > figure {

        line-height: 0;

        font-size: 0;

    }

    .solution_up > figure img {

        width: 100%;

    }

    .solution_up > h3 {

        position: absolute;

        left: 0;

        top: 45%;

        text-align: center;

        width: 100%;

        font-size: 30px;

        color: #fff;



        transition: all 0.5s;

        -webkit-transition: all 0.5s;

        -ms-transition: all 0.5s;

        -o-transition: all 0.5s;

        -moz-transition: all 0.5s;

    }

    .solution_down{

        height: 100%;

        position: absolute;

        left: 0;

        top: 100%;

        width: 100%;

        text-align: center;



        transition: all 0.5s;

        -webkit-transition: all 0.5s;

        -ms-transition: all 0.5s;

        -o-transition: all 0.5s;

        -moz-transition: all 0.5s;

        background: rgba(0,84,166,.8);

    }

    .solution_main > li:hover .solution_up > h3{

        opacity: 0;

    }

    .solution_main > li:hover .solution_down{

        top: 0;

    }

    .solution_down > a {

        display: block;

        height: 100%;

    }

    .solution_down > a h3 {

        margin-top: 16%;

        width: 100%;

        font-size: 30px;

        color: #ffcb07;

    }

    .solution_down > a p {

        margin-top: 3%;

        color: #fff;

    }

    .solution_down > a .more{

        width: 100px;

        height: 30px;

        line-height: 30px;

        background: #0778f8;

        color: #fff;

        margin: 0 auto;

        margin-top: 5%;

    }



/*need*/

    .need{

        background: url(../image/need.jpg) no-repeat center;

        height: 570px;

        width: 100%;

        padding-top: 70px;

        overflow: hidden;

    }



    .need_content{

        max-width: 1400px;

        margin: 75px auto 0;

        background: url(../image/need_content.jpg) no-repeat center;

        padding: 35px 0 45px;

        border-radius: 5px;


        position: relative;

    }







    .need_num li{

        width: 33.3%;

        text-align: center;

        float: left;

        position: relative;

    }

    .need_num li strong{

        display: block;

        text-align: center;

        width: 100%;

        font-size: 42px;

        color: #ffcb07;

        font-weight: normal;

    }

    .need_num li strong::after{

        content: "+";

        font-size: 30px;

        color: #ffcb07;

        display: inline-block;

        vertical-align: middle;

        position: relative;

        top: -6px;

        margin-left: 10px;

        font-weight: normal;

    }

    .need_num li span{

        font-size: 14px;

        color: #fff;

        text-align: center;

        display: block;

        width: 100%;

    }



/*partner*/

    .partner{

        margin-top: 70px;

        overflow: hidden;

        height: 620px;

        background: url(../image/partner.png)no-repeat center bottom;

        background-color: #fff;

        -webkit-background-size: 100% auto;

        background-size: 100% auto;

    }

    .partner_content {

        margin-top: 50px;

    }

    .partner_content > li{

        float: left;

        width: 20%;

        height: 100px;

        text-align: center;

    }
    .partner_content > li figure{
        height: 100px;

        line-height: 100px;

        text-align: center;}
    .partner_content > li img {

max-height: 100%;
max-width: 100%;
    }

    .partner_content_slide > figure{

        height: 180px;

        line-height: 180px;

        text-align: center;

    }

    .partner_content_slide > figure img {

        max-height: 100%;

        max-width: 100%;

    }



/*report*/



    .report{

        overflow: hidden;

        background: #f7f8fa;

        padding-top: 40px;

        padding-bottom: 60px;

    }

    .report_content {

        margin-top: 50px;

        height: 450px;

    }

    .report_banner {

        width: 49%;

        float: left;

        height: 100%;

    }

    .report_banner_content {

        position: relative;

    }

    .report_banner_content > figure{

        text-align: center;

        margin: 0 auto;

    }

    .report_banner_content > h3{

        position: absolute;

        left: 0;

        bottom: 0;

        width: 100%;

        height: 84px;

        line-height: 110px;

        text-align: center;

        vertical-align: bottom;

        color: #fff;

        background: url(../image/report_content_bg.png) no-repeat center;

    }

    .report_banner .swiper-button-next{

        background: rgba(0,0,0,.6);

        width: 50px;

        height: 60px;

        right: 0;



    }

    .report_banner .swiper-button-next:after{

        content: '';

        position: absolute;

        left: 50%;

        top: 50%;

        margin-left: -2px;

        margin-top: -6px;

        border: 6px solid transparent;

        border-left-color: #fff;



    }

    .report_banner .swiper-button-prev{

        background: rgba(0,0,0,.6);

        width: 50px;

        height: 60px;

        left: 0;

    }

    .report_banner .swiper-button-prev:after{

        content: '';

        position: absolute;

        left: 50%;

        top: 50%;

        margin-left: -10px;

        margin-top: -6px;

        border: 6px solid transparent;

        border-right-color: #fff;



    }

    .report_article {

        width: 49%;

        float: right;

    }

    .report_article > li{

        height: 143px;

        margin-bottom: 10px;

        background: #fff;

        padding-right: 5%;

    }

    .report_article_data{

        width: 20%;

        float: left;

        height: 100%;

        text-align: center;

    }

    .report_article_data_d{

        margin-top: 30px;

        font-size: 40px;

        font-weight: bold;

        color: #020202;

        font-family: Arial;

    }

    .report_article_data_ym{

        color: #8d8d8d;

        font-family: Arial;

    }

    .report_article_main{

        height: 100%;

        padding-top: 26px;

    }

    .report_article_main > h2{

        font-size: 18px;

        color: #010101;

    }

    .report_article_main > p{

        line-height: 1.8;

        color: #6e6e6e;

        margin-top: 14px;

        height: 44px;

        overflow: hidden;

    }

    .report_article_main a:hover {

        color: #0054a6;

    }



/*canvars*/

    .m-virbox-canvar{

        background: #f2fbff;

        width: 100%;

        overflow: hidden;

        height: 186px;

        text-align: center;

        padding-top: 60px;

        position: relative;

    }

    .m-virbox-canvar .m-pos{

        position: absolute;

        left: 50%;

        top: 50%;

        transform: translate(-50%,-50%);

        z-index: 99;

    }

    .m-virbox-canvar h2{

        font-size: 32px;

        color: #0869e2;

        text-align: center;

        white-space: nowrap;

    }

    .m-virbox-canvar a{

        display: inline-block;

        border: 1px solid #0869e2;

        padding: 8px 28px;

        font-size: 15px;

        color: #0869e2;

        margin-top: 25px;

        border-radius: 3px;

        transition: all 0.35s;

    }

    .m-virbox-canvar a:hover{

        background: #0869e2;

        color: #fff;

    }



    .m-virbox-canvar  canvas{

        position: absolute;

        top:0;

        left:0;

        width: 100%;

        height: 200px;

    }



/*閸氬牅缍旀导娆庡嵆妞ょ敻娼�*/

    .partnerPage{

        padding-top: 60px;

        padding-bottom: 80px;

        background: url(../image/partner.png)no-repeat center bottom;

        background-color: #fff;

        -webkit-background-size: 100% auto;

        background-size: 100% auto;

    }

    .partnerPage_title{

        font-size: 36px;

        color: #2b2b2b;

        text-align: center;

    }

    .partnerPage .pagination{

        margin-top: 40px;

    }



/*閼辨梻閮撮幋鎴滄粦妞ょ敻娼�*/



    .contactUs_main{

        padding-top: 50px;

        margin-bottom: 50px;

    }

    .contactUs_top{

        text-align: center;

    }

    .contactUs_top_title {

        font-size: 18px;

        color: #2c2c2c;

        line-height: 1.8;

    }



    .contactUs_top_icon {

        margin-top: 70px;

        text-align: center;

    }

    

    .contactUs_top_icon > li{

        display: inline-block;

        margin: 0 55px;

    }





    .contactUs_top_icon_img {

        display: block;

        width: 95px;

        height: 110px;

    }

    .contactUs_top_icon_text{

        display: inline-block;

        margin-top: 20px;

    }

    .img_first {

        background: url(../image/contact-one.png) no-repeat 100% 100%;

    }

    .img_second {

        background: url(../image/contact-two.png) no-repeat 100% 100%;

    }

    .img_three {

        background: url(../image/contact-thr.png) no-repeat 100% 100%;

    }

    .img_four {

        background: url(../image/contact-four.png) no-repeat 100% 100%;

    }



    .senseWx{

    position:relative;

    }

    .senseWx:hover .WeChats{

        display:block;

    }



    .WeChats {

        position: absolute;

        top: -16px;

        left: 80px;

    }



    .WeChats span{

        position: absolute;

        top: 66px;

        left: -9px;

    }



    .WeChats img,

    .virBox-weChat img{

        margin-top: 4px;

        width: 150px;

        height:150px;

    }





    .VirBoxWx{

        position:relative;

    }

    .VirBoxWx:hover .virBox-weChat{

        display:block;

    }

    .virBox-weChat{

        position: absolute;

        top: -16px;

        left: 80px;



    }

    .virBox-weChat span{



        position: absolute;

        top: 66px;

        left: -9px;

    }





    .common_wx{

        display: none;

        width: 160px;

        height: 160px;

        background: #ccc;

        text-align: center;

        border-radius: 5px;

        -moz-border-radius: 5px;

        -ms-border-radius: 5px;

        -o-border-radius: 5px;

        -webkit-border-radius: 5px;

        z-index: 99;

    }

    .common_wx span{

        display: block;

        width: 0;

        height: 0;

        border-width: 8px 9px 8px 0;

        border-style: solid;

        border-color: transparent #ccc transparent transparent;

    }



    .contactUs_feedback{

        margin-top: 70px;

        text-align: center;

    }

    .contactUs_feedback_title{

        font-size: 30px;

        color: #2c2c2c;

    }

    .form{

        width: 100%;

        max-width: 1200px;

        margin: 0 auto;

        margin-top: 50px;

    }

    .form_top > input{

        width: 32%;

        margin-right: 2%;

        float: left;

        border: transparent;

        background: #f1f1f1;

        height: 44px;

        line-height: 44px;

        color: #696969;

        padding-left: 20px;

    }

    .form_top > input:last-child{

        margin-right: 0;

    }

    .form_bottom{

        margin-top: 30px;

    }

    .form_bottom > textarea{

        width: 88%;

        float: left;

        border: transparent;

        background: #f1f1f1;

        color: #696969;

        padding: 20px;

        height: 140px;

        line-height: 1.8;

    }

    .form_bottom > button{

        width: 10%;

        height: 140px;

        float: right;

        border: transparent;

        background: #0054a6;

        font-size: 24px;

        color: #ffffff;

        cursor: pointer;

    }



    .contactUs_map{

        width: 100%;

        max-width: 1200px;

        margin: 0 auto;

        margin-top: 40px;

    }



    .map{

        height: 368px;

        width: 100%;

        margin-bottom: 20px;

    }

    .map_img{

        width: 50%;

        height: 100%;

        float: left;

    }

    .map_text{

        width: 50%;

        height: 100%;

        float: left;

        padding-top: 6%;

        padding-left: 4%;

        border: 1px solid #e8e8e8;

        border-left: none;

    }

    .map_text > h2 {

        font-size: 30px;

        font-weight: bold;

        color: #0054a6;

        margin-bottom: 20px;

    }

    .map_text > p{

        line-height: 2;

        font-size: 18px;

        color: #2c2c2c;

        padding-left: 22px;

    }





/*閺備即妞堟い鐢告桨*/

    .newsPage{

        margin-top: 30px;

    }

    .newsPage_l{

        float: left;

        width: 72%;

        padding-right: 3%;

        border-right: 1px solid #e9e9e9;



        margin-bottom: 40px;

    }

    .newsPage_l_banner {

        width: 100%;

        float: left;

        height: 100%;

    }
    .newsPage_l_banner img{ width: 100%; }

    .newsPage_l_banner_content {

        position: relative;

    }

    .newsPage_l_banner_content > figure{

        text-align: center;

    }

    .newsPage_l_banner_content > figure {

        margin: 0 auto;

    }

    .newsPage_l_banner_content > h3{

        position: absolute;

        left: 0;

        bottom: 0;

        width: 100%;

        height: 84px;

        line-height: 110px;

        text-align: center;

        vertical-align: bottom;

        color: #fff;

        background: url(../image/newsPage_l_banner_content_bg.png) no-repeat center;

    }

    .newsPage_l_banner .swiper-button-next{

        background: rgba(0,0,0,.6);

        width: 50px;

        height: 60px;

        right: 0;



    }

    .newsPage_l_banner .swiper-button-next:after{

        content: '';

        position: absolute;

        left: 50%;

        top: 50%;

        margin-left: -2px;

        margin-top: -6px;

        border: 6px solid transparent;

        border-left-color: #fff;



    }

    .newsPage_l_banner .swiper-button-prev{

        background: rgba(0,0,0,.6);

        width: 50px;

        height: 60px;

        left: 0;

    }

    .newsPage_l_banner .swiper-button-prev:after{

        content: '';

        position: absolute;

        left: 50%;

        top: 50%;

        margin-left: -10px;

        margin-top: -6px;

        border: 6px solid transparent;

        border-right-color: #fff;



    }

    

    .newsPage_l_list {

        float: left;

        margin-bottom: 40px;

    }

    .newsPage_l_list > ul li {

        padding: 12px 0;

        border-bottom: 1px solid #e5e5e5;

    }

    .newsPage_l_list > ul li a:hover{ color:#0054a6;}



    .newsPage_l_list_tu{

      width: 25%;

      text-align: center;

      height: 170px;

      line-height: 170px;

      font-size: 0;

    }

    .newsPage_l_list_tu > p{

      height: 100%;

    }

    .newsPage_l_list_tu > p img{

      vertical-align: middle;

      max-width: 100%;

      max-height: 100%;

    }

    .newsPage_l_list_zi{

      display: inline-block;

      width: 75%;

      padding: 0 20px;

      height: 170px;

    }

    .newsPage_l_list_zi > h3{

      font-size: 20px;

      color: #000000;

      margin-top: 20px;

      max-height: 26.4px;

      overflow: hidden;

    }

    .newsPage_l_list_zi > p {

      font-size: 14px;

      color: #7a7a7a;

      line-height: 2;

      max-height: 84px;

      overflow: hidden;

      margin-top: 12px;

    }

    .newsPage_l_list_zi_date{

        color: #999999;

        text-align: center;

        display: inline-block;

        margin-top: 12px;

    }









    .newsPage_r{

        float: right;

        width: 25%;

    }

    .hotTag > h2 {

        font-size: 20px;

        color: #000;

    }

    .hotTag > ul {

        padding-right: 18px;

        margin-top: 20px;

    }

    .hotTag > ul li{

        display: inline-block;

        padding: 0 6px;

        height: 36px;

        line-height: 36px;

        border: 1px solid #dddddd;

        margin-right: 10px;

        margin-bottom: 10px;

        color: #545454;



        transition: all 0.5s;

        -webkit-transition: all 0.5s;

        -ms-transition: all 0.5s;

        -o-transition: all 0.5s;

        -moz-transition: all 0.5s;

    }

    .hotTag > ul li a {

        display: block;

    }

    .hotTag > ul li:hover {

        color: #0054a6;

        border-color: #0054a6;

    }



    .hotText{

        margin-top: 20px;

    }

    .hotText > h2 {

        font-size: 20px;

        color: #000;

    }

    .hotText > ul {

        margin-top: 14px;

        border-top: 1px solid #dddddd;

        padding-top: 20px;

    }

    .hotText > ul li {

        line-height: 2;

        padding-left: 10px;

        position: relative;



        transition: all 0.5s;

        -webkit-transition: all 0.5s;

        -ms-transition: all 0.5s;

        -o-transition: all 0.5s;

        -moz-transition: all 0.5s;

    }

    .hotText > ul li:before{

        content: '';

        position: absolute;

        left: 2px;

        top: 0;

    }

    .hotText > ul li:hover{

        color: #0054a6;

    }



/*閸忓厖绨幋鎴滄粦妞ょ敻娼�*/

    .about {

        text-align: center;

    }

    .about_title{

        font-size: 48px;

        color: #2b2b2b;

        font-weight: bold;

    }



    .about_top {

        margin-top: 66px;

    }



    .about_top > p{

        line-height: 1.8;

        margin-top: 40px;

        font-size: 16px;

        color: #000;

    }

    .about_top > p strong{

        font-size: 24px;

    }

    .about_top > ul {

        margin-top: 50px;

    }

    .about_top > ul li {

        width: 25%;

        float: left;

    }

    .about_top > ul li p{

        font-size: 16px;

        color: #1d1d1d;

        margin-top: 10px;

    }

    .about_top > ul li p strong{

        font-size: 24px;

    }

    

    .about_world{

        margin-top: 50px;

        padding-bottom: 40px;

    }

    .about_world_main{

        margin-top: 70px;

    }



    .about_patent{

        margin-top: 70px;

    }

    .about_patent > p {

        line-height: 1.8;

        margin-top: 20px;

        font-size: 16px;

        color: #000;

    }

    .about_patent_banner {

        margin-top: 70px;

    }

    .about_patent .swiper-father{

        position: relative;

        padding: 0 80px;

    }

    .about_patent_banner_content{

        border: 1px solid #efefef;

        padding: 10px;

    }

    .about_patent_banner_content figure{

        transition: all 0.5s;

        -webkit-transition: all 0.5s;

        -ms-transition: all 0.5s;

        -o-transition: all 0.5s;

        -moz-transition: all 0.5s;

    }

    .about_patent_banner_content figure img {

        width: 100%;

    }

    .about_patent_banner_content figure:hover{

        transform: translate3d(0,-4px,0);

        box-shadow: 0 4px 10px rgba(0,0,0,0.5);

    }

    .about_patent .swiper-button-next{

        background: rgba(0,0,0,.6);

        width: 50px;

        height: 60px;

        right: 0;



    }

    .about_patent .swiper-button-next:after{

        content: '';

        position: absolute;

        left: 50%;

        top: 50%;

        margin-left: -2px;

        margin-top: -6px;

        border: 6px solid transparent;

        border-left-color: #fff;



    }

    .about_patent .swiper-button-prev{

        background: rgba(0,0,0,.6);

        width: 50px;

        height: 60px;

        left: 0;

    }

    .about_patent .swiper-button-prev:after{

        content: '';

        position: absolute;

        left: 50%;

        top: 50%;

        margin-left: -10px;

        margin-top: -6px;

        border: 6px solid transparent;

        border-right-color: #fff;



    }

    

    .about_idea{

        margin-top: 90px;

        padding-top: 90px;

        padding-bottom: 50px;

        background: #f1f1f1;

    }

    .about_idea > ul {

        margin-top: 90px;

    }

    .about_idea > ul li {

        width: 33.3%;

        float: left;

        padding: 0 20px;

    }

    .about_idea_img {

        height: 193px;

        line-height: 193px;

        background-repeat: no-repeat;

        -webkit-background-size:  auto 100%;

        background-size:  auto 100%;



        font-size: 36px;

        font-weight: bold;

        color: #fff;

    }

    .about_idea_text{

        padding: 40px 0;

        background: #f6f3f3;

    }

    .about_idea_text > h3 {

        font-size: 24px;

        font-weight: bold;

        color: #2b2b2b;

    }

    .about_idea_text > p {

        font-size: 16px;

        color: #2b2b2b;

        margin-top: 14px;

    }



    .about_no1 {

        margin-top: 90px;

        padding-bottom: 110px;

    }

    .about_no1 > ul{

        margin-top: 80px;

    }

    .about_no1 > ul li {

        float: left;

        width: 20%;

        padding: 0 10px;

    }

    .about_no1 > ul li h3 {

        font-size: 60px;

        color: #dcdcdc;

        font-family: Impact;

    }

    .about_no1 > ul li p {

        font-size: 18px;

        color: #2b2b2b;

        line-height: 1.8;

    }



    .about_future {

        text-align: center;

        height: 549px;

        padding-top: 160px;

        background: url(../image/about_future.jpg) no-repeat center;

    }

    .about_future_title {

        font-size: 48px;

        font-weight: bold;

        color: #fff;

    }

    .about_future > p {

        font-size: 24px;

        color: #fff;

        line-height: 1.8;

        margin-top: 50px;

    }



    .about_service{

        margin-top: 70px;

        padding-bottom: 200px;

    }

    .about_service_main { max-width: 1400px; margin: 90px auto 0 auto;}

    .about_service_img {

        display: none;

        line-height: 0;

        font-size: 0;

        text-align: center;

    }

    .about_service_main > ul{

        position: relative;

        height: 155px;

    }

    .about_service_main > ul li{

        width: 212px;

        height: 140px;

        position: relative;

    }

    .about_service_main > ul li.l{

        left: 27%;

    }

    .about_service_main .about_service_main_ul2 > li.l{

        left: 14%;

    }

    .about_service_main > ul li.r{

        right: 27%;

    }

    .about_service_main .about_service_main_ul2 > li.r{

        right: 14%;

    }

    .diamond{

        position: absolute;

        left: 0;

        top: 0;

        width: 212px;

        height: 212px;

        -moz-transform:rotate(45deg);

        -webkit-transform:rotate(45deg);

        -o-transform:rotate(45deg);

        transform:rotate(45deg);

        background: #eeeeee;

    }

    .diamond_text{

        position: relative;

        z-index: 9;

    }

    .diamond_text > h3{

        font-size: 24px;

        font-weight: bold;

        color: #0f0f0f;

        padding-top: 30px;

    }

    .diamond_text > p{

        font-size: 16px;

        line-height: 1.8;

        color: #4b4b4b;

        margin-top: 10px;

    }

    .about_service_main ul li.diamond_content{

        width: 250px;

        height: 250px;

        position: absolute;

        left: 50%;

        top: -14px;

        margin-left: -125px;

    }

    .diamond_content .diamond{

        width: 250px;

        height: 250px;

        background: #ffcb07;

    }

    .diamond_content .diamond_text > h3{

        color: #fff;

        padding-top: 80px;

    }



    .about_development{

        padding-top: 100px;

        padding-bottom: 120px;

        background: url(../image/development.png)no-repeat center;

        background-size: 100% auto;

        background-color: #f1f1f1;

    }

    .about_development .swiper-slide {

        width: auto;

    }

    .about_development_swiper{

        margin-top: 70px;

    }



    .tree{

        margin-top: 90px;

        height: 500px;

        list-style: none;

        margin: 0;

        padding: 0;

    }

    .tree li{

        width: 175px;

        float: left;

        height: 8px;

        background: #fff;

        position: relative;

        margin-top: 250px;

        border: 1px solid #dcdcdc;

        border-left: none;

        border-right: none;

    }

    .tree li:last-child{

        width: 350px;

    }

    .tree_point{

        width: 14px;

        height: 14px;

        background: #fff;

        margin-left: 175px;

        margin-top: -4px;

        border: 3px solid #dcdcdc;

        border-radius: 50%;

        position: relative;

        z-index: 999;

    }

    .tree_text{

        width: 100px;

        position: relative;

        margin-left: 130px;

        bottom: 50px;

        font-size: 18px;

        font-weight: bold;

        color: #2b2b2b;

    }

    .tree_content{

        width: 300px;

        height: 150px;

        background: #fff;

        position: absolute;

        bottom: 70px;



        

        /*鐠佸墽鐤嗛崘鍛啇閸ㄥ倻娲跨仦鍛厬閿涘奔绲緄e10娑撳秴鍚嬬€癸拷*/

        /*display: flex;

        justify-content: center;

        align-items: center;*/



        

        margin-left: 30px;

        line-height: 1.8;

        padding: 24px 20px;

        color: #2b2b2b;



        transition: all 0.5s;

        -webkit-transition: all 0.5s;

        -ms-transition: all 0.5s;

        -o-transition: all 0.5s;

        -moz-transition: all 0.5s;

    }

    .tree_content:hover{

        background: #0054a6;

        color: #fff;

    }

    .tree_content:after{

        content: '';

        display: inline-block;

        border:  15px solid transparent;

        border-top-color: #fff;

        position: absolute;

        

        left: 50%;

        margin-left: -15px;

        bottom: -30px;



        transition: all 0.5s;

        -webkit-transition: all 0.5s;

        -ms-transition: all 0.5s;

        -o-transition: all 0.5s;

        -moz-transition: all 0.5s;

    }

    .tree_content:hover:after{

        border-top-color: #0054a6;

    }

    

    .tree li:nth-child(even) .tree_content{

        top: 70px;

    }

    .tree li:nth-child(even) .tree_text{

        top: 10px;

    }

    

    .tree li:nth-child(even) .tree_content:after{

        border-top-color: transparent;

        border-bottom-color: #fff;

        bottom: auto;

        top: -30px;

    }

    .tree li:nth-child(even) .tree_content:hover:after{

        border-bottom-color: #0054a6;

    }



    .jj01{

        margin: 120px auto 40px;

    }