.page-header {
    background-color: #000;
    color: #fff;
    position: fixed;
    left: 0;
    right: 0;
    top: 0;
    z-index: 1000;
    transition: top 0.3s linear;
    /* overflow: hidden; */
}
.page-header:hover,
.page-header-hover{
    background-color: #fff;
    box-shadow:0px 4px 4px 0px rgba(0,0,0,0.08);
    color: #333; 
}
.page-header:hover .right-part{
    color: #333; 
}
.mobile-page-header .divnone,
.page-header .divnone{
    display: none!important;
}
.page-header-hide {
    top: -100px;
}
.header-content {
    display: block;
    height: 64px;
    line-height: 64px;
    width: 1160px;
}
.clearfix:after {
    visibility: hidden;
    display: block;
    font-size: 0;
    content: " ";
    clear: both;
    height: 0;
}

.page-header .logo {
    margin: 20px 0;
    width: 96px;
    height: 23px;
    cursor: pointer;
}
.page-header .hover-img{
    display: none;
}
.page-header .init-img{
    display: inline-block;
}
/** right **/
.page-header .right-part {
    display: block;
    float: right;
    font-size: 14px;
    color:  #fff;
}
.page-header .right-part a{
    color:  #fff;
}
.page-header .right-part .tel {
    margin-right: 20px;
}
.page-header:hover .right-part a:hover,
.page-header-hover .right-part a:hover{
    color: #0e57a2;
}
.page-header .right-part .tel-icon{
    width: 10px;
    height: 12px;
    margin-right: 8px;
    vertical-align: middle;
}
.page-header .lang-split{
    font-size: 16px;
    margin: 0 2px;
}
/** left **/
.page-header .left-part{
    display: inline-block;
    vertical-align: top;
    margin-left: 46px;
    /* margin-top: 20px; */
    font-size: 0;
    line-height: 0;
}
.page-header .left-part .menu-item{
    position: relative;
    display: inline-block;
    width:80px;
    height:64px;
    line-height: 64px;
    margin-right: 24px;
    text-align: center;
    font-size:14px;
    cursor: pointer;
    /* text-shadow:0px 4px 4px rgba(0,0,0,0.08); */
    color:rgba(255,255,255,1);
}
.page-header .left-part .menu-item .menu-name {
    font-weight: 600;
}
.page-header .left-part .menu-item:hover .menu-name{
    color: #0e57a2;
}
.page-header .left-part .menu-item .nav-line{
    display: none;
    position: absolute;
    top: 45px;
    left: 30px;
    width:20px;
    height:4px;
    background:rgba(255,255,255,1);
    box-shadow:0px 4px 4px 0px rgba(0,0,0,0.08);
    margin: 0 auto;
}
.page-header .left-part .menu-item .menu-popover{
    position: absolute;
    cursor: default;
    top: 50px;
    left: -25px;
    z-index: 1;
    display: none;
    padding: 18px 0px 24px;
    background: rgba(255,255,255,1);
    border-radius: 0px 0px 1px 1px;
    box-shadow: 0px 4px 4px 0px rgba(0,0,0,0.1);
    line-height: 24px;
    text-align: left;
}

.page-header .menu-popover .menu-popover-item{
    display: inline-block;
    vertical-align: top;
}
.page-header .left-part .menu-item .menu-popover-open{
    display: block;
}
.page-header .left-part .menu-popover li {
    padding: 6px 34px;
    margin: 0 5px;
}
.page-header .left-part .menu-item .menu-popover a,
.page-header .left-part .menu-item .menu-popover a span{
    height:24px;
    color:rgba(51,51,51,1);
    line-height:24px;
    outline: none;
    word-break: keep-all;
    white-space: nowrap;
}
.page-header .left-part .menu-popover a img{
    height: 12px;
}

.page-header .left-part .menu-item-columns .menu-popover{
    padding: 24px 64px 34px;
}
.page-header .left-part .menu-item-core .menu-popover{
    width: 255px;
}
.page-header .left-part .menu-name {
    cursor: pointer;
}
.page-header .left-part .menu-item-products .menu-popover{
    width: 680px;
    left: -42px
}
.page-header .left-part .menu-item-products .menu-popover-item-title{
    cursor: auto;
}
.page-header .left-part .menu-item-industries .menu-popover{
    left: -16px;
}
.page-header .left-part .menu-item-developers .menu-popover{
    left: -21px;
}
.page-header .left-part .menu-item-solutions .menu-popover{
    width: 850px;
    left: -54px;
}
.page-header .menu-item-columns .menu-popover li{
    padding: 6px 0;
    margin: 0;
}
.page-header .menu-item-columns .menu-popover li.menu-popover-item-category{
    padding: 0;
    margin: 26px 0 2px;
}
.page-header .menu-item-columns .menu-popover .menu-popover-item-category:first-child{
    margin-top: 16px;
}
.page-header .left-part .menu-item-columns .menu-popover-line{
    width:126px;
    height:1px;
    /* background: #cccccc; */
    margin: 15px 0 10px;
    background: -webkit-linear-gradient(left, rgba(10, 35, 73, 0.3) 0%,rgba(0,0,0,0) 100%);
    background: -o-linear-gradient(right, rgba(10, 35, 73, 0.3) 0%,rgba(0,0,0,0) 100%);
    background: -moz-linear-gradient(right, rgba(10, 35, 73, 0.3) 0%,rgba(0,0,0,0) 100%);
    background: linear-gradient(to right, rgba(10, 35, 73, 0.3) 0%,rgba(0,0,0,0) 100%);
    filter: 'progid:dximagetransform.microsoft.gradient(startcolorstr="#cccccc", endcolorstr="#ffffff", gradienttype=1)';
}
.page-header .menu-item-columns .menu-popover-item-title{
    display: block;
}
.page-header .menu-item-columns .menu-popover .menu-popover-item-title img{
    display: inline-block;
    vertical-align: top;
    margin-top: 2px;
    height: 18px;
    width: 18px;
}
.page-header .menu-item-columns .menu-popover-item-title span{

    height: 22px;
    font-size: 16px;
    font-weight: 600;
    color: rgba(51,51,51,1);
    line-height: 22px;
}
.page-header .menu-item-columns .menu-popover-item{
    margin-right: 70px;
}
.page-header .menu-item-products .menu-popover-item:last-child,
.page-header .menu-item-solutions .menu-popover-item:nth-last-child(2){
    margin-right: 0;
}
.page-header .menu-item-columns .menu-popover-item .menu-popover-item-category{
    height:17px;
    font-size:12px;
    font-weight:400;
    color:rgba(175,177,183,1);
    line-height:17px;
}
.page-header .menu-item-solutions .menu-popover-all{
    text-align: center;
    margin-top: 20px;
}
.page-header .left-part .menu-item-solutions .menu-popover .menu-popover-all a{
    font-weight: bold;
    color: #0e57a2;
}

.page-header .left-part .menu-item-solutions .new-icon{
    height: 14px;
    vertical-align: top;
    margin-top: 5px;
}

.page-header .left-part .menu-popover li .init-icon{
    display: inline-block;
}
.page-header .left-part .menu-popover li .hover-icon{
    display: none;
}

.page-header .left-part .menu-popover li:hover,
.page-header .left-part .menu-item-solutions .menu-popover-all:hover{
    transition: all 0.5s ease 0s;
    transform: translate(0,-2px);
}

.page-header .left-part .menu-popover li:hover a,
.page-header .left-part .menu-popover li:hover a span,
.page-header .left-part .menu-popover li:hover span.menu-popover-name,
.page-header .left-part .menu-popover li.menu-popover-name:hover,
.page-header .left-part .menu-item-solutions .menu-popover .menu-popover-item-title:hover span{
    color: #0e57a2;
}

.page-header .left-part .menu-popover li.menu-popover-item-category:hover{
    transition: none;
    transform: none;
}

.page-header .menu-popover li:hover .hover-icon{
    display: inline-block;
}
.page-header .menu-popover li:hover .init-icon{
    display: none;
}


.page-header .left-part .menu-item.active .menu-name {
    font-weight: bold;
}
.page-header .left-part .menu-item.active .nav-line{
    display: block;
}



.page-header:hover .menu-item,
.page-header:hover .right-part a,
.page-header-hover .menu-item,
.page-header-hover .right-part a{
    color:rgba(51,51,51,1);
}
.page-header:hover .nav-line,
.page-header-hover .nav-line{
    background:rgba(14,87,162,1);
}
.page-header:hover .init-img,
.page-header-hover .init-img{
    display: none;
}
.page-header:hover .hover-img,
.page-header-hover .hover-img{
    display: inline-block;
}
.page-header:hover .menu-item.active .menu-name,
.page-header-hover .menu-item.active .menu-name{
    color: #0e57a2;
}






.mobile-page-header {
    display: none;
}

/* mobile */
@media screen and (max-width:767px) {
    .active {
        color: #0e57a2;
    }

    .color-333 {
        color: #333;
        font-weight: bold;
    }
    .color-666 {
        color: #666;
    }
    .page-header {
        display: none;
    }
    .mobile-page-header {
        display: flex;
        position: fixed;
        top: 0;
        left: 0;
        right: 0;
        z-index: 1000;
    }
    .mobile-page-header .top{
        width: 100vw;
        height: .44rem;
        display: flex;
        padding: 0 20px;
        justify-content: space-between;
        align-items: center;
        z-index: 1005;
        position: fixed;
        left: 0;
        right: 0;
        top: 0;
        background: #fff;
        box-shadow:0 .04rem .06rem 0 rgba(0,0,0,0.04);
    }

    .mobile-page-header .top .left{
        display: flex;
        align-items: center;
    }

    .mobile-page-header .top .left img {
        height: .2rem;
    }

    .mobile-page-header .top .right {
        height: .44rem;
        line-height: .44rem;
        text-align: center;
        padding: .16rem .1rem .13rem;
    }
    .mobile-page-header .top .right  span {
        display: block;
        width: 18px;
        height: 2px;
        margin-bottom: 3px;
        background-color: #0e57a2;
        transition: background .5s cubic-bezier(.77,.2,.05,1),opacity .55s ease,transform .5s cubic-bezier(.77,.2,.05,1),width .5s,-webkit-transform .5s cubic-bezier(.77,.2,.05,1);
        left: 0;
        transform-origin: 16px;
        border-radius: 3px;
        opacity: 1;
    }
    .mobile-page-header .top .right  span:nth-of-type(2) {
        transition: width .5s ease;
    }
    .first-rotate {
        transform: rotate(-45deg);
    }
    .mobile-page-header .top .right  span.mid-width {
        width: 0;
        opacity: 0;
    }
    .last-rotate {
        transform: rotate(45deg);
    }
    .mobile-menu-close-button {
        display: none;
    }
    .header-show {
        top: .44rem!important;
        opacity: 1!important;
        z-index: 1000!important;
    }
    .mobile-page-header .mobile-header-popover-container {
        position: absolute;
        left: 0;
        right: 0;
        font-size: .12rem;
        z-index: -1;
        background: #eee;
        opacity: 0;
        top: calc(.44rem - 100vh);
        transition: all 0.5s ease;
    }
    .mobile-page-header .mobile-header-popover-container .mobile-header-popover {
        height: calc(100vh - 1rem);
        overflow-y: scroll;
        background: #fff;
    }
    .mobile-page-header .mobile-header-popover-container .mobile-header-popover .mobile-header-menu-item-wrapper {
        padding: 0 24px;
    }
    .mobile-page-header .mobile-header-popover-container .mobile-header-popover .mobile-header-menu-item {
        display: flex;
        height: .56rem;
        justify-content: space-between;
        align-items: center;
        font-size: .14rem;
        border-bottom: 1px solid rgba(140, 140, 140, .19);
    }

    .header-menu-active {
        transform: translatey(30px);
        opacity: 1!important;
        height: initial!important;
        z-index: 1001!important;
    }
    .mobile-header-menu-children-container {
        z-index: -1;
        background:rgba(249,249,249,1);
        width: 100vw;
        padding: 0 .24rem 0 .4rem;
        position: relative;
        top: -30px;
        opacity: 0;
        transition: all .5s ease;
        transition-property:transform, height, opacity;
        height: 0;
    }
    .mobile-sub-item-container {
        z-index: -1;
        transition: all .5s ease;
        position: relative;
        top: -30px;
        opacity: 0;
        height: 0;
        overflow: hidden;
    }
    .mobile-page-header .mobile-header-popover-container .mobile-header-popover .mobile-header-menu-item-active {
        background: rgb(236,242,248);
        border: none;
        z-index: 1002;
    }
    .mobile-header-menu-item-active .color-333{
        color: #0e57a2;
    }
    .mobile-page-header .mobile-header-popover-container .mobile-header-popover .mobile-header-menu-item-active>.mobile-header-menu-item {
        border: none;
    }

    .mobile-header-menu-children-container .mobile-header-menu-item:last-of-type{
         border: none!important;
     }

    .sticky {
        position: -webkit-sticky;
        position: sticky;
        top: 0;
    }
    /*@keyframes rotate {*/
    /*    0% {*/
    /*        transform: rotate(0);*/
    /*    }*/
    /*    100% {*/
    /*        transform: rotate(180deg);*/
    /*    }*/
    /*}*/
    /*.animation-mobile-header-icon {*/
    /*    animation: rotate .5s linear 1;*/
    /*}*/
    .mobile-header-icon {
        transition: transform 0.5s;
        transform: rotate(0deg);
    }
    .mobile-header-icon-active {
        transform: rotate(180deg);
    }
    .mobile-header-contact-us {
        position: fixed;
        bottom: 0;
        left: 0;
        right: 0;
        height: 0;
        background:linear-gradient(180deg,rgba(250,252,254,1) 0%,rgba(244,247,251,1) 100%);
        border-radius:0px 0px 0px 2px;
        padding: 0 .6rem 0 .24rem;
        display: flex;
        align-items: center;
        font-size: .14rem;
        color: #333;
        font-family:pingfangsc-regular,pingfang sc;
        transition: all .5s ease;
        z-index: 1100;
        display: flex;
        justify-content: space-between;
    }
    .mobile-header-contact-us a {
        color: #333;
    }
    .mobile-header-contact-us-show {
        height: .56rem;
    }
    .mobile-header-contact-us  i {
        font-size: .12rem;
    }
    .mobile-header-contact-us .close{
        position: absolute;
        left: calc(50% - .06rem);
        top: calc(50% - .08rem);
    }
    .menu-popover-item-category {
        display: none!important;
    }
    .mobile-fixed-top {
        position: fixed!important;
        top: 0;
        left: 0;
        right: 0;
    }
    .mobile-sub-title {
        display: flex;
        justify-content: space-between;
    }
    .mobile-header-menu-children-container .init-icon {
        display: inline-block;
        width: .47rem;
        margin-right: .05rem;
    }
}