* {
    padding: 0;
    margin: 0;
    box-sizing: border-box;
}

ul li {
    list-style: none;
}

a {
    text-decoration: none;
}

a:hover {
    text-decoration: none;
}

img {
    vertical-align: top;
    outline-width: 0ch;
}

 :root {
    --main-color: #19385a;
    --main-color-white: #ffffff;
    --main-color-333: #333333;
    --main-color-555: #555555;
    --main-color-666: #666666;
    --main-color-999: #999999;
    --main-transition: all ease 0.4s;
    --main-shadow: rgba(100, 100, 111, 0.2) 0px 7px 29px 0px;
}

@media only screen and (min-width: 996px) {
    .topcon {
        max-width: 68.75rem;
        margin: 0 auto;
        display: flex;
        align-items: center;
        justify-content: space-between;
        height: 4.0625rem;
    }
    .top {
        position: relative;
        z-index: 9;
        height: 4.0625rem;
    }
    .banner {
        width: 100%;
        position: relative;
        margin-top: -15.625rem;
    }
    .banner img {
        width: 100%;
    }
    .lang {
        display: flex;
        align-items: center;
        position: relative;
    }
    .lang span {
        display: block;
        color: #333;
        font-size: 1.125rem;
    }
    .lang i {
        color: #333;
        margin-left: .9375rem;
        font-size: 1.25rem !important;
    }
    .pclogo img {
        height: 3.4375rem;
    }
    .langbox {
        position: absolute;
        width: 8.75rem;
        background-color: #fff;
        border-radius: .1875rem;
        top: 2.5rem;
        transition: var(--main-transition);
        top: 250%;
        opacity: 0;
        visibility: hidden;
    }
    .langbox a {
        display: block;
        height: 2.5rem;
        line-height: 2.5rem;
        text-align: center;
        color: #333;
        font-size: 1rem;
    }
    .langbox a:hover {
        color: #19385a;
    }
    .lang:hover .langbox {
        opacity: 1 !important;
        visibility: visible !important;
        top: 130% !important;
    }
    .nav {
        position: relative;
        z-index: 9;
        max-width: 68.75rem;
        margin: 0 auto;
        display: flex;
        align-items: center;
        margin-top: 1.5625rem;
        justify-content: space-between;
    }
    .nav li {
        flex: 1;
    }
    .nav li a {
        color: #333;
        font-size: 1.25rem;
        text-align: center;
        height: 3.125rem;
        line-height: 3.125rem;
        display: block;
    }
        .nav li a:hover {
            color: #2ECDDC;
        }
        .pos {
            position: absolute;
            text-align: center;
            z-index: 999;
            left: 0;
        }
    .pos1 {
        color: #d2d9e1;
        font-size: 5rem;
        text-align: center;
        width: 100%;
        bottom: 8.125rem;
        letter-spacing: .625rem;
    }
    .pos2 {
        color: var(--main-color);
        font-size: 2.5rem;
        width: 100%;
        letter-spacing: .625rem;
        bottom: 7.5rem;
    }
    .bannerpic {
        position: absolute;
        width: 12.5rem;
        left: 50%;
        transform: translateX(-50%);
    }
    .bannerpic {
        width: 12.5rem !important;
        top: 35%;
    }
    .ml_mb_head {
        display: none;
    }
    .ml_mb_nav {
        display: none;
    }
    .con1 {
        width: 100%;
        padding: 6.25rem 0;
    }
    .con1con {
        max-width: 68.75rem;
        margin: 0 auto;
    }
    .conitem {
        width: 100%;
        position: relative;
        cursor: pointer;
        margin-bottom: 6.25rem;
        transition: var(--main-transition);
    }
    .conitem img {
        width: 100%;
    }
    .con1pos {
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        display: flex;
        align-items: center;
        padding: 0 10%;
    }
    .con1pos p {
        color: var(--main-color);
        font-size: 1.875rem;
    }
    .con1pos span {
        color: #8494a5;
        font-size: 1.5625rem;
        display: block;
        font-weight: bold;
        margin-left: 1.875rem;
    }
    .conitem:hover {
        box-shadow: var(--main-shadow);
        transform: translateY(-1.25rem);
    }
    .con2bg {
        width: 100%;
        position: relative;
    }
    .con2bg img {
        width: 100%;
    }
    .con2pos {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        display: flex;
        align-items: center;
        justify-content: space-around;
    }
    .con2left {
        width: 25%;
        text-align: center;
    }
    .con2center {
        width: 25%;
    }
    .con2center img {
        width: 100%;
    }
    .con2right {
        width: 25%;
    }
    .con2left p {
        line-height: 1.875rem;
        font-size: 1.25rem;
        color: var(--main-color);
        text-align: center;
    }
    .con2left img {
        width: 6.25rem;
        height: 6.25rem;
        margin-top: 1.25rem;
    }
    .con2right p {
        line-height: 1.875rem;
        font-size: 1.25rem;
        color: var(--main-color);
        text-align: center;
        font-weight: bold;
    }
    .foot {
        padding: 6.25rem 0;
        background-image: url(../images/footbg.png);
    }
    .footer {
        max-width: 68.75rem;
        margin: 0 auto;
    }
    .fnav {
        display: flex;
        align-items: center;
        justify-content: center;
    }
    .fnav a {
        color: #fff;
        font-size: 1.125rem;
        margin: 0 1.25rem;
    }
    .footer ul {
        display: flex;
        justify-content: space-between;
        margin-top: 9.375rem;
    }
    .footer ul li {
        text-align: center;
        color: #fff;
        font-size: 1.125rem;
    }
    .fb {
        margin-top: 2.1875rem;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .fbitem {
        margin-bottom: 2.5rem;
    }
    .fbleft {
        width: 75%;
    }
    .fbitem p {
        color: #fff;
        margin-bottom: .625rem;
        font-size: 1.125rem;
    }
    .fbitem span {
        color: #fff;
        font-size: 1rem;
    }
    .fbright {
        text-align: right;
    }
    .fbright img {
        width: 6.875rem;
        height: 6.875rem;
    }
    .fbright p {
        width: 6.875rem;
        text-align: center;
        color: #fff;
        font-size: 1rem;
        margin-top: .625rem;
    }
    .inbanner {
        width: 100%;
        margin-top: -15.625rem;
        position: relative;
    }
    .inbanner img {
        width: 100%;
    }
    .in_pos {
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .in_pos h1 {
        color: #153d69;
        font-size: 5.625rem;
        text-transform: uppercase;
        font-weight: 400;
        letter-spacing: .625rem;
        opacity: .2;
    }
    .in_pos h2 {
        color: #153d69;
        font-size: 3.125rem;
        font-weight: 400;
        letter-spacing: .3125rem;
        margin-top: -2.5rem;
    }
    .contactPic {
        width: 100%;
        margin: .3125rem 0;
    }
    .contactPic img {
        width: 100%;
    }
    .proBox {
        width: 100%;
        background-image:url(/images/bj1.png);
        padding: 10rem 0;
    }
    .proBoxCon {
        max-width: 68.75rem;
        margin: 0 auto;
    }
    .proItem {
        border-top: .3125rem solid #113154;
        padding: 4.6875rem 0;
    }
    .proTitle p {
        color: #113154;
        font-size: 1.875rem;
        letter-spacing: .3125rem;
    }
    .proTitle strong {
        color: #113154;
        font-size: 1.875rem;
        text-transform: uppercase;
        letter-spacing: .3125rem;
        margin-bottom: 6.25rem;
        display: block;
    }
    .proType1 ul {
        display: flex;
        flex-wrap: wrap;
    }
    .proType1 ul li {
        width: calc((100% - 15rem) / 4);
        margin-right: 5rem;
        margin-bottom: 5rem;
    }
    .proType1 ul li:nth-child(4n) {
        margin-right: 0;
    }
    .proTitle1 {
        margin-bottom: 7.5rem;
    }
    .proType1 ul li img {
        width: 100%;
        margin: 2.8125rem auto;
    }
    .proType1 ul li span {
        display: block;
        text-align: center;
        color: #113154;
        font-size: 1.375rem;
        letter-spacing: .1875rem;
    }
    .proType1 ul li p {
        display: block;
        font-weight: bold;
        color: #113154;
        font-size: 1.25rem;
        text-align: center;
    }
    .proType2 ul {
        display: flex;
        flex-wrap: wrap;
    }
    .proType2 ul li {
        width: calc((100% - 15rem) / 4);
        margin-right: 5rem;
        margin-bottom: 5rem;
    }
    .proType2 ul li:nth-child(4n) {
        margin-right: 0;
    }
    .proTitle1 {
        margin-bottom: 7.5rem;
    }
    .proType2 ul li img {
        width: 65%;
        margin: 2.8125rem auto;
        display: block;
    }
    .proType2 ul li span {
        display: block;
        text-align: center;
        color: #113154;
        font-size: 1.375rem;
        letter-spacing: .1875rem;
    }
    .proType2 ul li p {
        display: block;
        color: #113154;
        font-size: 1.25rem;
        text-align: center;
    }
    .proType1 ul li em {
        text-transform:uppercase;
        color: #91a1b2;
        font-style: normal;
        display: block;
        text-align: center;
        font-size: 1.125rem;
        margin-top: .625rem;
    }
    .bzbanner {
        width: 100%;
        margin-top: -15.625rem;
        position: relative;
    }
    .bzbanner img {
        width: 100%;
    }
    .lock {
        position: absolute;
        width: 100%;
        font-size: 7.5rem;
        text-transform: uppercase;
        color: #cadfed;
        bottom: 0;
        left: 0;
        text-align: center;
        letter-spacing: .625rem;
    }
    .bzpos {
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        display: flex;
        letter-spacing: .625rem;
        text-align: center;
        align-items: center;
        flex-direction: column;
        justify-content: center;
        color: #6eb9e3;
        font-size: 3.25rem;
    }
    .bz1 {
        width: 100%;
        padding: 6.25rem 0;
    }
    .bz1con {
        max-width: 68.75rem;
        margin: 0 auto;
    }
    .bz1title {
        text-align: center;
        margin-bottom: 2.8125rem;
        font-size: 2.125rem;
        color: #5a99c9;
        font-weight: 300;
    }
    .bz1title em {
        font-weight: 500 !important;
        color: #67a1cd;
        margin-top: 10px;
        font-style: normal;
        display: block;
    }
    .bz1Top {
        padding: 2.8125rem 6.25rem;
        background-image: url(../images/bzbg.png);
        background-repeat: no-repeat;
        background-size: cover;
    }
    .ch {
        display: flex;
        justify-content: space-between;
    }
    .chItem {
        display: flex;
        align-items: center;
        width: calc(100% / 3);
    }
    .chItem span {
        width: 3.5rem;
        height: 2.1875rem;
        background-color: #5898c8;
        border-radius: 50%;
        color: #fff;
        font-size: 1.25rem;
        text-align: center;
        line-height: 2.1875rem;
    }
    .chItem p {
        font-size: 1.5rem;
        color: #5898c8;
        font-weight: 500;
        margin-left: 1.25rem;
    }
    .En ul {
        display: flex;
        justify-content: space-between;
        margin-top: 1.875rem;
    }
    .En ul li {
        text-align: center;
        width: calc(100% / 6);
        text-align: center;
    }
    .En ul li span {
        opacity: .5;
        color: #5898c8;
        font-size: 1.25rem;
    }
    .En ul li i {
        opacity: 1 !important;
        color: #5898c8;
        font-size: 2rem;
    }
    .bz1Bot {
        display: flex;
        justify-content: space-between;
    }
    .bz1BotLeft {
        width: 60%;
        background-image: url(../images/bzbg2.png);
        background-size: cover;
        padding: 1.6875rem 7.5rem;
    }
    .bz1BotRight {
        width: 40%;
    }
    .bz1BotRight img {
        width: 100%;
    }
    .bz1BotLeft h1 {
        text-align: center;
        font-size: 2.5rem;
        font-weight: 300;
        color: #5898c8;
    }
    .bz1BotLeft h2 {
        text-align: center;
        font-size: 2.5rem;
        font-weight: 500;
        margin-top: .625rem;
        color: #5898c8;
        margin-bottom: 3.125rem;
    }
    .bz1BotLeft h3 {
        font-size: 1.5rem;
        color: #5898c8;
        letter-spacing:6px;
        font-weight: normal;
    }
    .bz1BotLeft h3 span {
        font-weight: bold;
        font-size: 1.7rem !important;
    }
    .bz1BotLeft h3 em {
        font-size: 3.125rem;
        font-weight: bold;
        font-style: normal;
    }
    .bz2 {
        width: 100%;
        padding: 3.75rem 0;
    }
    .bz2con {
        max-width: 68.75rem;
        margin: 0 auto;
        position: relative;
    }
    .bz2con img {
        width: 100%;
    }
    .bz2pos {
        position: absolute;
        width: 71%;
        right: 2.5rem;
        height: 100%;
        top: 0;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    .bzItem {
        display: flex;
        padding: 1.5625rem 0;
        align-items: center;
        border-bottom: 2px solid #fff;
    }
    .bzItem1 {
        display: flex;
        width: 7.5rem;
        align-items: center;
    }
    .bzItem1 span {
        color: #c5d3e1;
        font-size: 1.875rem;
    }
    .bzItem1 p {
        color: #c5d3e1;
        margin-left: .9375rem;
        font-size: 1.5625rem;
    }
    .bzItem2 {
        margin: 0 3.125rem 0 1.25rem;
        width: 10.625rem;
    }
    .bzItem2 p {
        color: #023d70;
        font-size: 1rem;
    }
    .bzItem2 p span {
        color: #009cf6;
    }
    .bzItem3 {
        flex: 1;
        line-height: 1.875rem;
        font-size: .875rem;
    }
    .bz3 {
        padding: 5rem 0;
    }
    .bz3con {
        max-width: 68.75rem;
        margin: 0 auto;
    }
    .bz3 img {
        width: 100%;
    }
}

@media only screen and (max-width: 996px) {
    .bz3 {
        padding: 30px 15px;
    }
    .bz3 img {
        width: 100%;
    }
    .bz2 {
        width: 100%;
        padding: 30px 15px;
    }
    .bz2con {
        margin: 0 auto;
        position: relative;
    }
    .bz2con img {
        width: 100%;
    }
    .bz2pos {
        width: 100%;
    }
    .bzItem {
        padding: 15px 0;
    }
    .bzItem1 {
        display: flex;
        width: 120px;
        align-items: center;
    }
    .bzItem1 span {
        color: #c5d3e1;
        font-size: 14px;
    }
    .bzItem1 p {
        color: #c5d3e1;
        margin-left: 15px;
        font-size: 14px;
    }
    .bzItem2 {
        margin: 10px 0;
    }
    .bzItem2 p {
        color: #023d70;
        font-size: 20px;
    }
    .bzItem2 p span {
        color: #009cf6;
    }
    .bzItem3 {
        width: 100%;
        line-height: 25px;
        font-size: 14px;
    }
    .bz1Bot {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .bz1BotLeft {
        width: 100%;
        background-image: url(../images/bzbg2.png);
        background-size: cover;
        padding: 20px;
    }
    .bz1BotRight {
        width: 100%;
    }
    .bz1BotRight img {
        width: 100%;
    }
    .bz1BotLeft h1 {
        text-align: center;
        font-size: 30px;
        font-weight: 300;
        color: #5898c8;
    }
    .bz1BotLeft h2 {
        text-align: center;
        font-size: 30px;
        font-weight: 500;
        margin-top: 10px;
        color: #5898c8;
        margin-bottom: 30px;
    }
    .bz1BotLeft h3 {
        font-size: 20px;
        color: #5898c8;
        font-weight: normal;
    }
    .bz1BotLeft h3 span {
        font-weight: bold;
        font-size: 25px !important;
    }
    .bz1BotLeft h3 em {
        font-size: 50px;
        font-weight: bold;
        font-style: normal;
    }
    .bz1 {
        width: 100%;
        padding: 30px 15px;
    }
    .bz1con {
        margin: 0 auto;
    }
    .bz1title {
        text-align: center;
        margin-bottom: 25px;
        font-size: 20px;
        color: #5a99c9;
        font-weight: 300;
    }
    .bz1title em {
        font-weight: 500 !important;
        color: #67a1cd;
        margin-top: 10px;
        font-size: 15px;
        font-style: normal;
        display: block;
    }
    .bz1Top {
        padding: 30px 15px;
        background-image: url(../images/bzbg.png);
        background-repeat: no-repeat;
        background-size: cover;
    }
    .ch {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .chItem {
        display: flex;
        align-items: center;
        flex-wrap: wrap;
        width: calc(100% / 6);
        text-align: center;
    }
    .chItem span {
        width: 25px;
        height: 25px;
        background-color: #5898c8;
        border-radius: 50%;
        color: #fff;
        font-size: 14px;
        text-align: center;
        line-height: 25px;
    }
    .chItem p {
        font-size: 15px;
        color: #5898c8;
        font-weight: 500;
    }
    .En ul {
        display: flex;
        justify-content: space-between;
        margin-top: 20px;
    }
    .En ul li {
        text-align: center;
        width: calc(100% / 6);
        text-align: center;
    }
    .En ul li span {
        opacity: .5;
        color: #5898c8;
        font-size: 14px;
    }
    .En ul li i {
        opacity: 1 !important;
        color: #5898c8;
        font-size: 14px;
    }
    .bzbanner {
        width: 100%;
        margin-top: 60px;
        position: relative;
    }
    .bzbanner img {
        width: 100%;
    }
    .lock {
        position: absolute;
        width: 100%;
        font-size: 40px;
        text-transform: uppercase;
        color: #cadfed;
        bottom: 0;
        left: 0;
        text-align: center;
        letter-spacing: 4px;
    }
    .bzpos {
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        display: flex;
        letter-spacing: .625rem;
        text-align: center;
        align-items: center;
        flex-direction: column;
        justify-content: center;
        color: #6eb9e3;
        font-size: 18px;
    }
    .proBox {
        width: 100%;
        padding: 30px 15px;
    }
    .proBoxCon {
        margin: 0 auto;
    }
    .proItem {
        border-top: 3px solid #113154;
        padding: 15px 0;
    }
    .proTitle p {
        color: #113154;
        font-size: 20px;
        letter-spacing: 5px;
    }
    .proTitle strong {
        color: #113154;
        font-size: 16px;
        text-transform: uppercase;
        letter-spacing: 5px;
        margin-bottom: 30px;
        display: block;
    }
    .proType1 ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .proType1 ul li {
        width: 100%;
        width: 48%;
        margin-bottom: 30px;
    }
    .proTitle1 {
        margin-bottom: 20px;
    }
    .proType1 ul li img {
        width: 100%;
        margin: 25px auto;
    }
    .proType1 ul li span {
        display: block;
        text-align: center;
        color: #113154;
        font-size: 16px;
        letter-spacing: 3px;
    }
    .proType1 ul li p {
        display: block;
        font-weight: bold;
        color: #113154;
        font-size: 14px;
        text-align: center;
    }
    .proType2 ul {
        display: flex;
        justify-content: space-between;
        flex-wrap: wrap;
    }
    .proType2 ul li {
        margin-bottom: 30px;
        width: 48%;
    }
    .proTitle1 {
        margin-bottom: 20px;
    }
    .proType2 ul li img {
        width: 65%;
        margin: 45px auto;
        display: block;
    }
    .proType2 ul li span {
        display: block;
        text-align: center;
        color: #113154;
        font-size: 16px;
        letter-spacing: 3px;
    }
    .proType2 ul li p {
        display: block;
        font-weight: bold;
        color: #113154;
        font-size: 14px;
        text-align: center;
    }
    .proType2 ul li em {
        color: #91a1b2;
        font-style: normal;
        display: block;
        text-align: center;
        font-size: 18px;
        margin-top: 10px;
    }
    .contactPic {
        width: 100%;
        margin: 5px 0;
    }
    .contactPic img {
        width: 100%;
    }
    .inbanner {
        width: 100%;
        position: relative;
        margin-top: 60px;
    }
    .inbanner img {
        width: 100%;
    }
    .in_pos {
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .in_pos h1 {
        color: #153d69;
        font-size: 26px;
        text-transform: uppercase;
        font-weight: 400;
        letter-spacing: 4px;
        opacity: .2;
    }
    .in_pos h2 {
        color: #153d69;
        font-size: 20px;
        font-weight: 400;
        letter-spacing: 5px;
    }
    .foot {
        padding: 50px 15px;
        background-image: url(../images/footbg.png);
    }
    .footer {
        margin: 0 auto;
    }
    .fnav {
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: center;
    }
    .fnav a {
        color: #fff;
        font-size: 15px;
        margin: 0 5px;
    }
    .footer ul {
        display: flex;
        justify-content: space-between;
        margin-top: 20px;
        flex-wrap: wrap;
    }
    .footer ul li {
        width: 100%;
        margin-bottom: 10px;
        color: #fff;
        font-size: 15px;
    }
    .fb {
        margin-top: 20px;
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
    }
    .fbitem {
        margin-bottom: 25px;
    }
    .fbleft {
        width: 100%;
    }
    .fbitem p {
        color: #fff;
        margin-bottom: 5px;
        font-size: 14px;
    }
    .fbitem span {
        color: #fff;
        font-size: 14px;
    }
    .fbright img {
        width: 80px;
        height: 80px;
    }
    .fbright p {
        width: 80px;
        text-align: center;
        color: #fff;
        font-size: 14px;
        margin-top: 10px;
    }
    .con2bg {
        width: 100%;
        position: relative;
    }
    .con2bg img {
        width: 100%;
    }
    .con2pos {
        width: 100%;
        height: 100%;
        position: absolute;
        top: 0;
        left: 0;
        display: flex;
        align-items: center;
        justify-content: space-around;
    }
    .con2left {
        width: 25%;
        text-align: center;
    }
    .con2center {
        width: 25%;
    }
    .con2center img {
        width: 100%;
    }
    .con2right {
        width: 25%;
    }
    .con2left p {
        line-height: 25px;
        font-size: 16px;
        color: var(--main-color);
        text-align: center;
    }
    .con2left img {
        width: 60px;
        height: 60px;
        margin-top: 20px;
    }
    .con2right p {
        line-height: 25px;
        font-size: 15px;
        color: var(--main-color);
        text-align: center;
        font-weight: bold;
    }
    .con1 {
        width: 100%;
        padding: 30px 15px;
    }
    .conitem {
        width: 100%;
        position: relative;
        cursor: pointer;
        margin-bottom: 40px;
        transition: var(--main-transition);
    }
    .conitem img {
        width: 100%;
    }
    .con1pos {
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        display: flex;
        align-items: center;
        padding: 0 10%;
    }
    .con1pos p {
        color: var(--main-color);
        font-size: 18px;
    }
    .con1pos span {
        color: #8494a5;
        font-size: 16px;
        display: block;
        font-weight: bold;
        margin-left: 30px;
    }
    .conitem:hover {
        box-shadow: var(--main-shadow);
        transform: translateY(-20px);
    }
    .mr {
        display: flex;
        align-items: center;
    }
    .mr a {
        font-size: 13px;
        color: #fff;
    }
    .mr span {
        color: #fff;
        margin: 0 10px;
        font-size: 12px;
    }
    .mlang {
        display: flex;
        align-items: center;
        margin-right: 20px;
    }
    .banner {
        width: 100%;
        position: relative;
        margin-top: 60px;
    }
    .banner img {
        width: 100%;
    }
    .top {
        display: none;
    }
    .nav {
        display: none;
    }
    .pos {
        position: absolute;
        text-align: center;
        z-index: 999;
        left: 0;
    }
    .pos1 {
        color: #d2d9e1;
        font-size: 25px;
        text-align: center;
        width: 100%;
        color: var(--main-color);
        bottom: 45px;
        letter-spacing: 10px;
    }
    .pos2 {
        color: var(--main-color);
        font-size: 20px;
        width: 100%;
        letter-spacing: 10px;
        bottom: 20px;
    }
    .bannerpic {
        position: absolute;
        width: 100px !important;
        left: 50%;
        top: 20%;
        transform: translateX(-50%);
    }
    .ml_mb_arrowChange {
        transform: rotate(90deg);
    }
    .ml_mbnav_3 {
        display: none;
    }
    .ml_mbnav_3_item {
        display: flex;
        padding: 0 20px;
        justify-content: space-between;
        align-items: center;
        border-bottom: 1px solid #f3f3f3;
        background-color: #efefef;
    }
    .ml_mbnav_3_item>a {
        display: block;
        width: 100%;
        height: 40px;
        line-height: 40px;
        color: var(--main-color-333);
        font-size: 14px;
        padding-left: 35px;
    }
    .ml_mb_nav i {
        font-size: 22px !important;
        transition: var(--main-transition);
    }
    .ml_mbnav_2_item {
        display: flex;
        padding: 0 20px;
        justify-content: space-between;
        align-items: center;
        border-bottom: 1px solid #f3f3f3;
        background-color: #e3e3e3;
    }
    .ml_mbnav_2_item>a {
        display: block;
        height: 40px;
        width: 100%;
        line-height: 40px;
        color: var(--main-color-333);
        font-size: 14px;
        padding-left: 20px;
    }
    .ml_mbnav_2 {
        display: none;
    }
    .ml_mbnav_1_item>a {
        display: block;
        height: 40px;
        line-height: 40px;
        color: var(--main-color-333);
        font-size: 14px;
        width: 100%;
    }
    .ml_mbnav_1_item {
        display: flex;
        padding: 0 20px;
        justify-content: space-between;
        align-items: center;
        border-bottom: 1px solid #f3f3f3;
    }
    .ml_mb_nav {
        width: 100%;
        height: calc(100% - 60px);
        position: fixed;
        top: 60px;
        right: -100%;
        background-color: var(--main-color-white);
        z-index: 100;
        z-index: 9999;
        border-top: 1px solid #ccc;
        overflow: scroll;
        padding: 20px 0;
        transition: var(--main-transition);
    }
    .mb_navShow {
        right: 0 !important;
    }
    .hb_fadeout {
        opacity: 0 !important;
    }
    .change2 {
        transform: translateY(-10px) rotate(-45deg);
    }
    .change1 {
        transform: translateY(10px) rotate(45deg);
    }
    .hb span {
        display: block;
        width: 30px;
        height: 1px;
        background-color: var(--main-color-white);
        transition: var(--main-transition);
    }
    .hb {
        display: flex;
        flex-wrap: wrap;
        justify-content: space-between;
        height: 20px;
        flex-direction: column;
    }
    .ml_mb_logo img {
        width: 120px;
    }
    .ml_mb_head {
        display: flex;
        height: 60px;
        padding: 0 20px;
        background-color: var(--main-color-333);
        position: fixed;
        top: 0;
        left: 0;
        align-items: center;
        justify-content: space-between;
        box-shadow: rgba(149, 157, 165, 0.2) 0px 8px 24px;
        width: 100%;
        z-index: 99999;
        z-index: 99;
    }
}