/* 导航栏背景颜色 */
.my-nav {
    background-color: rgba(0, 10, 28, .7);
}

.main-menu>ul>li:hover>a,
        .main-menu>ul>li>a.active {
            color: #2AC8FF !important;
        }

        .main-menu>ul>li>a::after {
            height: 0;
        }

        .main-menu>ul>li>a::before {
            position: absolute;
            content: "";
            background: #2AC8FF;
            height: calc(100vw/1920*8);
            width: 0%;
            top: -10px;
            left: -25%;
            right: 0;
        }

        .main-menu>ul>li:hover>a::before {
            width: 150%;
            -webkit-transition: all 0.3s ease 0s;
            -o-transition: all 0.3s ease 0s;
            transition: all 0.3s ease 0s;
        }

        .main-menu>ul>li>a.active::before {
            position: absolute;
            content: "";
            background: #2AC8FF;
            height: calc(100vw/1920*8);
            width: 150%;
            top: -10px;
            left: -25%;
            right: 0;
        }

/* foot */
.panel-footer .container {
    text-align: left;
    color: #bbbbbb !important;
    font-size: 18px;
    padding: 15px 0;
}
.panel-footer li{
    text-align: left;
    letter-spacing: 4px;
}
.panel-footer{
    background: linear-gradient(180deg, #0B2047 0%, #020810 100%);
}
/* .panel-footer .container{
    
    
} */
.panel-footer .foot-title{
    font-size: 22px;
    color: #FFFFFF !important;
    letter-spacing: 6px;
    margin: 15px 0;
    text-align: left !important;
}
.panel-footer .foot-logo div{
    height: calc(100vw/1920*36);
}
.panel-footer .foot-logo div img{
    height: 100%;object-fit: contain;
}

/* .panel-footer .code2{
    border-left: 1px solid #FFFFFF;
} */
.panel-footer .container .img p{
    text-align: center;
}
.panel-footer .container{
    max-width: 70%;
}
.panel-footer .foot-code{
    margin: 0;
    font-size: 12px !important;
    display: flex;
    align-items: center;
}
.panel-footer .col-3,.col-sm-3,.col-md-3,.col-lg-3{
    padding: 0 !important;
}
.panel-footer .foot-code .col{
    position: relative;
    display: flex;
    align-items: center;

}
.panel-footer .foot-code .col::after{
    content: '';
    position: absolute;
    left: 50%;
    width: 1px;
    height: 50%;
    background-color: rgba(255,255,255,.1);
}
.panel-footer .foot-code .img{
    display: flex;
    justify-content: center;
    flex-direction: column;
    align-items: center;
}


.panel-footer .foot-code img{
    width: calc(100vw/1920*94);
}


        

/* 屏幕宽度大于1200的导航栏样式 */
@media (min-width: 1200px) {
    /* nav-start */
    /* logo边距及尺寸 */
    .header-logo {
        width: calc(100vw/1920*111) !important;
        line-height: calc(100vw/1920*53);
        margin-left: calc(100vw/1920*190) !important;
        margin-right: calc(100vw/1920*82) !important;
    }

    /* 导航栏样式 */
    .header-wrapper {
        width: 100%;
        height: calc(100vw/1920*80);
        justify-content: start;
        align-items: start;
    }

    .main-menu>ul>li {
        margin: 0 calc(100vw/1920*16);
        padding: 10px calc(100vw/1920*50) 0 calc(100vw/1920*50);
    }
    /* 主体文字占导航栏2/3高度，下拉框占1/3 */
    .main-menu>ul>li>a {
        width: 100%;
        max-height: calc(100vw/1920*53);
        line-height: calc(100vw/1920*53);
        display: inline-block;
        font-size: calc(100vw/1920*20);
        font-weight: 400;
        text-align: center;
        margin: 0;
        text-transform: capitalize;
    }

    /* 鼠标悬浮下拉框样式 */
    .main-menu ul .has-children{
        display: flex;
        justify-content: center;
    }
    .main-menu ul .has-children>.sub-menu {
        height: calc(100vw/1920*30);
        line-height: calc(100vw/1920*30);
        top: calc(100vw/1920*50);
        background: rgba(0, 0, 0, 0);
        box-shadow: 0 0 0 0;
        border-style: none;
        display: flex;
        flex-flow: row nowrap;
        justify-content: center;
    }

    .main-menu ul .has-children>.sub-menu>li {
        width: calc(100vw/1920*74);
        height: calc(100vw/1920*18);
        text-align: center;
        padding: 0 calc(100vw/1920*3);
        white-space:nowrap;
        margin: 0 calc(100vw/1920*20);
    }


    .main-menu ul .has-children>.sub-menu>li>a {
        color: rgb(8, 121, 252);
        font-size: calc(100vw/1920*12);
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        border-style: none;
        text-align: center;
        padding: 0;
    }

    .main-menu ul .has-children>.sub-menu>li>a.active {
        background: #2AC8FF;
        color: white;
        border-radius: calc(100vw/1920*3);
    }

    .main-menu ul .has-children>.sub-menu>li:hover {
        background: #2AC8FF;
        border-radius: calc(100vw/1920*3);
        text-align: center;
        
    }

    .main-menu ul .has-children>.sub-menu>li:hover>a {
        color: white;
        font-size: calc(100vw/1920*12);
        border-style: none;
        padding: 0;
    }
    /* nav-end */
    
/* foot-end */
}

@media (max-width:1370px) {
    .panel-footer .ul2{
        margin-left: 10px;
    }
}


    /* 屏幕宽度在1200的导航栏样式 */
@media screen and (max-width:1200px) {
    /* nav-start */
    .d-lg-flex {
        display: none !important;
    }
    .header-social-actions{
        margin-top: 10px;
    }
    /* logo边距及尺寸 */
    .header-logo {
        width: 69px !important;
        line-height: 33px;
        margin-left: 10% !important;
        margin-right: 70% !important;
    }

    /* 导航栏样式 */
    .header-wrapper {
        width: 100%;
        height: 32px;
        justify-content: start;
        align-items: start;
    }

    .main-menu>ul>li {
        margin: 0 20px;
        display: flex;
        align-items: flex-start;
    }
    /* 主体文字占导航栏2/3高度，下拉框占1/3 */
    .main-menu>ul>li>a {
        width: 100%;
        max-height: 21.2px;
        line-height: 21.2px; 
        display: inline-block;
        font-size: 10px;
        font-weight: 400;
        text-align: center;
        margin: 0;
        text-transform: capitalize;
    }

    /* 鼠标悬浮下拉框样式 */
    .main-menu ul .has-children{
        display: flex;
        justify-content: center;
    }
    .main-menu ul .has-children>.sub-menu {
        height: 12px;
        line-height: 12px;
        top: 23.2px;
        background: rgba(0, 0, 0, 0);
        box-shadow: 0 0 0 0;
        border-style: none;
        display: flex;
        flex-flow: row nowrap;
        justify-content: center;
    }

    .main-menu ul .has-children>.sub-menu>li {
        width: 29.6px;
        height: 7.2px;
        text-align: center;
        padding: 0 3px;
        white-space:nowrap;
        margin: 0 20px;
    }


    .main-menu ul .has-children>.sub-menu>li>a {
        color: rgb(8, 121, 252);
        font-size: 12px;
        width: 100%;
        height: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
        border-style: none;
        text-align: center;
        padding: 0;
    }

    .main-menu ul .has-children>.sub-menu>li>a.active {
        /* background: #2AC8FF; */
        color: white;
        border-radius: 3px;
    }

    .main-menu ul .has-children>.sub-menu>li:hover {
        /* background: #2AC8FF; */
        border-radius: 3px;
        text-align: center;
        
    }

    .main-menu ul .has-children>.sub-menu>li:hover>a {
        color: white;
        font-size: 12px;
        border-style: none;
        padding: 0;
    }

    .panel-footer *{
        font-size: 12px;
        
    }
    .panel-footer .foot-title{
        font-size: 14px;
        margin-bottom: 20px;
    }
    .panel-footer .ul2{
        margin-left: 0;
    }
    .panel-footer .code2{
        border-left: 1px solid rgba(0,0,0,0);
    }
    
    
    /* nav-end */}
    @media screen and (max-width: 768px) {
        /* nav-start */
    .d-lg-flex {
        display: none !important;
    }
    .header-social-actions{
        margin-top: 10px;
    }
    /* logo边距及尺寸 */
    .header-logo {
        width: 69px !important;
        line-height: 33px;
        margin-left: 10% !important;
        margin-right: 60% !important;
    }
    .panel-footer .foot-code img{
        width: 38px;
    }
    .panel-footer .container{
        max-width: 90%;
    }
    }