@charset "UTF-8";
/*==================================================
 * 底部导航 – 响应式补丁
 *================================================*/

/*底部*/
footer {
    position: relative;
    /*background: url(../images/footer-bg.jpg) center center no-repeat !important;*/
    background: url(../images/footer-bg.jpg) center center / cover no-repeat !important;
    height: auto;
    min-height: 820px;
    display: flex;
    background-color: #33aa33;
}

/*底部最下方的一条灰色，放版权声明和备案号*/
footer .footer-bottom {
    position: absolute;
    bottom: 0;
    width: 100%;
    height: 60px;
    background-color: #373434;
    text-align: left;
    line-height: 60px;
    font-size: 14px;
    color: rgba(255, 255, 255, 0.5) !important;
}
/*底部最下方的一条灰色，链接样式，主要是针对备案号的*/
footer .footer-bottom a{
    color: rgba(5, 101, 245, 0.73) !important;
}

.footer-top {
    width: 95%;
}


/* ===== 移动端（<768px） */
@media screen and (max-width: 767px) {
    /*底部->上方->左侧部分*/
    .footer-top .footer-top-left{
        width: 100%;
    }
    /*底部->上方->右侧部分*/
    .footer-top .footer-top-right {
        flex: 0 0 100%;
        height: auto;
        text-align: center;
    }
    /*底部->上方->一个区域，比如关于我们的区域，产品和解决方案的区域*/
    .footer-top .footer-nav {width: 100%;line-height: 60px;margin-bottom: 20px;}
    /*底部->上方->一个区域内的链接，如关于我们，联系我们*/
    .footer-top .footer-nav a {width: 100%;line-height: 30px;display: block;}
    /*底部->上方->一个区域内的区域标题，如关于我们，产品和解决方案*/
    .footer-top .footer-nav-a1, .work-h5, .footer-add-h5 {
        font-size: 20px;
        color: #fff;
    }
    /*底部->上方->一个区域->栏目链接*/
    .footer-top a.footer-nav-a2 {
        font-size: 13px;
        height: 28px;
        line-height: 28px;
        color: rgba(255, 255, 255, 0.6);
    }
    .footer-right-address {
        font-size: 13px;
        line-height: 22px;
    }

    /*公司名称，工作时间，总部地址颜色变灰一些*/
    .footer-right-address .footer-company,
    .footer-right-address .work-time,
    .footer-right-address .footer-add-detail {
        color: rgba(255, 255, 255, 0.6) !important;
    }

    footer .footer-bottom {
        position: absolute;
        bottom: 0;
        width: 100%;
        height: auto;
        min-height: 60px;
        background-color: #373434;
        text-align: center;
        line-height: 2;
        font-size: 14px;
        color: rgba(255, 255, 255, 0.5) !important;
    }

    footer .footer-bottom a {
        /*小屏幕时换行*/
        display: block;
        color: rgba(5, 101, 245, 0.73) !important;
        word-break: break-all;
    }
}

/* ===== 桌面端（≥768px） ===== */
@media screen and (min-width: 768px) {
    footer .footer-top {
        width: 100%;
        display: flex;
        align-items: center;
    }
    /*底部->上方->左侧部分*/
    .footer-top .footer-top-left{
        flex: 0 0 50%;
        margin-top: -100px;
    }
    /*底部->上方->右侧部分*/
    .footer-top .footer-top-right {
        text-align: left;
        flex: 0 0 33%;
        margin-top: -100px;
    }
    .footer-top .footer-nav-a1 {
        display: block;
        font-size: 18px;
        line-height: 22px;
        margin-bottom: 1rem;
        color: #fff;

    }
    .footer-top .footer-nav-a2 {
        display: block;
        font-size: 14px;
        height: 32px;
        line-height: 32px;
        color: rgba(255, 255, 255, 0.6);
        transition-duration: .3s;
        text-align: left;
    }
    .footer-right-address {
        font-size: 14px;
        line-height: 24px;
        color: #b2b6c0;
    }
    .footer-right-address .footer-company,
    .footer-right-address .work-h5,
    .footer-right-address .ser-line {
        color: rgba(255, 255, 255, 0.6);
        margin-top: 1rem;
    }
}

/*===== 针对桌面端大屏幕（≥1024px）*/
@media screen and (min-width: 1024px) {

}