@charset "utf-8";
/* ============================================
   响应式覆盖层 - gdnms.com
   适配平板(768-1199px)和中小屏幕PC
   手机端(<768px)由UA检测切换到mobile模板
   ============================================ */

/* ===== 平板适配 (768px - 1199px) ===== */
@media screen and (max-width: 1199px) {
    /* 移除最小宽度限制 */
    .header, .main, .main2, .main3 {
        min-width: 100% !important;
    }
    
    /* Header 自适应 */
    .header {
        height: auto !important;
        display: flex;
        flex-wrap: wrap;
        padding: 10px 15px;
        box-sizing: border-box;
    }
    .logo {
        width: 200px !important;
        height: 60px !important;
    }
    .hTxt {
        font-size: 18px !important;
        line-height: 60px !important;
        height: 60px !important;
        padding-left: 20px !important;
    }
    .topBox {
        height: auto !important;
        line-height: 40px !important;
        padding-right: 15px !important;
        width: 100%;
        text-align: right;
    }
    
    /* 主区域自适应 */
    .main {
        width: 95% !important;
        margin: 20px auto !important;
        height: auto !important;
    }
    .mCon1, .mCon2 {
        width: 100% !important;
        float: none !important;
        margin-right: 0 !important;
        margin-bottom: 20px;
        height: auto !important;
    }
    .mTab1 {
        height: 300px !important;
    }
    .mTab2 {
        height: auto !important;
    }
    .mLi1, .mLi2 {
        width: 48% !important;
        margin-bottom: 15px;
    }
    .mLi3, .mLi4 {
        width: 31.5% !important;
    }
    
    /* 左侧栏自适应 */
    .leftBox, .leftBox2 {
        width: 220px !important;
        min-height: auto !important;
    }
    .leftCon {
        width: 220px !important;
    }
    .menuUl {
        width: 220px !important;
    }
    .menuUl li {
        height: 55px !important;
        line-height: 55px !important;
    }
    .menuUl li a {
        width: 217px !important;
        height: 55px !important;
    }
    .menuUl li i {
        width: 55px !important;
        height: 55px !important;
    }
    .menuUl li span {
        line-height: 55px !important;
        width: 120px !important;
        font-size: 14px !important;
    }
    
    /* 内容区域 */
    .rightBox, .main3 {
        width: calc(100% - 240px) !important;
    }
    .main3 {
        margin-left: 0 !important;
        padding: 15px !important;
    }
    
    /* 登录页 */
    .dlBox {
        margin-left: 0 !important;
        margin: 20px auto !important;
        float: none !important;
    }
    .main3[style*="1420px"] {
        width: 100% !important;
    }
    .main3[style*="700px"] {
        margin-left: 0 !important;
    }
}

/* ===== 中等平板 (768px - 999px) ===== */
@media screen and (max-width: 999px) {
    .header {
        flex-direction: column;
        align-items: center;
    }
    .logo {
        width: 180px !important;
        height: 50px !important;
    }
    .hTxt {
        font-size: 16px !important;
        line-height: 50px !important;
        height: 50px !important;
        padding-left: 15px !important;
    }
    .topBox {
        text-align: center;
    }
    
    /* 左侧栏变窄 */
    .leftBox, .leftBox2, .leftCon, .menuUl {
        width: 180px !important;
    }
    .menuUl li {
        height: 48px !important;
        line-height: 48px !important;
    }
    .menuUl li a {
        width: 177px !important;
        height: 48px !important;
    }
    .menuUl li i {
        width: 48px !important;
        height: 48px !important;
    }
    .menuUl li span {
        line-height: 48px !important;
        width: 100px !important;
        font-size: 13px !important;
    }
    .rightBox, .main3 {
        width: calc(100% - 200px) !important;
    }
    
    /* 表格自适应 */
    .table2, table {
        width: 100% !important;
    }
    .listBox1 {
        width: 100% !important;
    }
}

/* ===== 小平板横屏 (600px - 767px) ===== */
@media screen and (max-width: 767px) {
    /* 此时UA检测应该已经切换到mobile模板 */
    /* 但作为fallback，确保基本可用性 */
    .leftBox, .leftBox2 {
        display: none !important;
    }
    .rightBox, .main3 {
        width: 100% !important;
        float: none !important;
    }
    .header {
        height: auto !important;
    }
}

/* ===== 表单增强 ===== */
@media screen and (max-width: 1199px) {
    .layui-form-item .layui-inline {
        display: block;
        margin-right: 0;
        margin-bottom: 10px;
    }
    .layui-form-item .layui-input-inline {
        width: 100% !important;
    }
    input[type="text"], input[type="password"], input[type="tel"],
    textarea, select {
        max-width: 100% !important;
        box-sizing: border-box;
    }
}

/* ===== 图片自适应 ===== */
@media screen and (max-width: 1199px) {
    img {
        max-width: 100%;
        height: auto;
    }
    .ul01, .ul01 li, .mTab1 {
        height: 250px !important;
    }
}

/* ===== 分页自适应 ===== */
@media screen and (max-width: 999px) {
    .pagebox, .pagination, .page {
        text-align: center;
    }
    .pagebox a, .pagination a, .page a {
        padding: 5px 8px !important;
        margin: 2px !important;
        font-size: 13px !important;
    }
}