/* ============================================
   辛集房产信息网 - 移动端自适应样式
   配合 <meta name="viewport"> 使用
   ============================================ */

/* ---------- 平板及以下 (≤991px) ---------- */
@media screen and (max-width: 991px) {
    /* 所有固定宽度容器改为流式 */
    div.tops,
    div.tops div.r1,
    div.tops div.menus1 ul,
    div.mains,
    div.vips1,
    div.bottoms1,
    .main, .main2,
    .C261, .C262, .C330, .C331, .C332,
    .comtops, .coms, .mains1,
    .r02, .forms,
    .C80 {
        width: 100% !important;
        max-width: 100% !important;
        min-width: 0 !important;
        box-sizing: border-box;
    }

    div.tops, div.mains, div.bottoms1, .main, .comtops, .r02 {
        padding-left: 8px;
        padding-right: 8px;
    }

    /* 顶部：logo 与用户栏堆叠 */
    div.tops div.c1, div.tops div.c2 {
        float: none;
        width: 100% !important;
        text-align: center;
        height: auto;
        padding: 5px 0;
    }
    div.tops div.c1 img { max-width: 200px; height: auto; }
    div.tops div.menus3 { position: static; text-align: center; }

    /* 导航：横向排列自动换行 */
    div.tops div.menus1 ul {
        display: flex;
        flex-wrap: wrap;
        justify-content: center;
    }
    div.tops div.menus1 a {
        float: none;
        padding: 10px 12px;
    }

    /* 两栏布局改为单栏堆叠 */
    .C261, .C262, .C332, .C331,
    .main .left, .main .right,
    .coms div.c1, .coms div.c3 {
        float: none !important;
        width: 100% !important;
        box-sizing: border-box;
        margin-bottom: 10px;
    }

    /* 会员中心左栏变顶部横排 */
    .left1, .left1-bt, .left1-nr,
    .left1-nr ul li, .left1-nr ul li a {
        width: 100% !important;
    }
    .left1-nr ul { display: flex; flex-wrap: wrap; }
    .left1-nr ul li { flex: 1 1 auto; }

    /* 右侧内容区自适应 */
    .about, .about-bt, .about-nr, .about-nr ul li {
        width: 100% !important;
        box-sizing: border-box;
    }
    .about-nr ul li img { max-width: 100%; height: auto; }

    /* 广告图自适应 */
    .ads1, .ads1 img, .ads2, .ads2 img {
        width: 100% !important;
        height: auto !important;
        box-sizing: border-box;
    }

    /* 赞助商卡片网格自适应 */
    div.vips1 div.r2 a {
        width: calc(50% - 4px) !important;
        max-width: 239px;
        box-sizing: border-box;
        overflow: hidden;
        text-overflow: ellipsis;
    }

    /* VIP信息区：取消绝对定位，改为纵向列表（首页新网格 .vipgrid 除外，见文件末尾） */
    div.info8 a.noimg:not(.vg-item),
    div.info8:not(.vipgrid) a {
        position: static !important;
        left: auto !important;
        top: auto !important;
        display: block;
        width: 100% !important;
        margin: 4px 0;
        box-sizing: border-box;
    }
    div.info8:not(.vipgrid) { height: auto !important; }

    /* 信息列表行内容自适应 */
    div.infos div.rows span.c6,
    div.info8 span.c3 {
        width: auto !important;
        max-width: calc(100% - 160px);
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: nowrap;
    }
    li.imgr1 { height: auto !important; min-height: 60px; }
    li.imgr1 a { height: auto !important; }

    /* 表单元素全宽 */
    .forms1 input[type="text"],
    .forms1 select,
    .forms textarea,
    .rowsform input[type="text"],
    .rowsform input[type="password"],
    .forms input[type="text"],
    .forms input[type="password"] {
        width: 100% !important;
        max-width: 100%;
        box-sizing: border-box;
        font-size: 16px; /* 防止 iOS 聚焦时自动放大 */
    }
    .forms table, .forms1 form ul, .sform1 {
        width: 100% !important;
        box-sizing: border-box;
    }
    .forms table td { display: block; width: auto !important; text-align: left !important; }

    /* 表格允许横向滚动 */
    .tableform02, .about-nr table {
        display: block;
        overflow-x: auto;
        max-width: 100%;
    }

    /* 详情页 */
    .maintxts div.authors div.c1,
    .maintxts div.authors div.c2,
    .maintxts div.authors div.c3 {
        float: none;
        width: 100% !important;
        box-sizing: border-box;
        text-align: center;
    }
    div.remarks img { max-width: 100% !important; height: auto !important; }

    /* 图片通用约束 */
    img { max-width: 100%; }

    /* 中介公司卡片 */
    div.agencys ul li.userm {
        width: calc(33.33% - 6px);
        box-sizing: border-box;
    }

    /* 分页按钮加大点击区 */
    div.pages1, div.pages, .P23 { font-size: 14px !important; padding: 12px 0; }
    div.pages1 a, div.pages a, .P23 a { padding: 6px 4px; }

    /* 隐藏纯桌面元素 */
    .sericos { display: none; }
}

/* ---------- 手机 (≤575px) ---------- */
@media screen and (max-width: 575px) {
    body { font-size: 14px; }

    /* 赞助商卡片一行两个 */
    div.vips1 div.r2 a { width: calc(50% - 4px) !important; }

    /* 委托页中介列表 */
    .agencylist .user1 { width: calc(50% - 8px) !important; }

    /* 公司列表卡片堆叠 */
    div.agencys ul li.userm { width: calc(50% - 6px); }

    /* 信息列表隐藏编号列和日期列，突出标题 */
    div.infos div.rows span.c1 { display: none; }
    div.infos div.rows span.c9 { display: none; }
    div.infos div.rows span.c8 {
        width: auto;
        border-left: none;
    }
    div.infos div.rows span.c6 { max-width: 60%; }

    /* 搜索表单纵向堆叠 */
    .forms1 form ul span.item {
        float: none;
        display: block;
        margin: 6px 0;
    }

    /* 顶部导航字号调整 */
    div.tops div.menus1 a { font-size: 13px; padding: 9px 8px; }

    /* 表格字号 */
    table { font-size: 13px; }
}

/* ---------- 通用打印/阅读优化 ---------- */
@media screen and (max-width: 991px) {
    .bottoms1 div.r01 { padding: 12px; font-size: 12px; }
}

/* ============================================
   首页 VIP信息区网格（.vipgrid）
   还原原站 3列×8行 的紧凑排布（原为绝对定位 left:10/332/654px）
   改用弹性布局，便于平板两列、手机单列自适应
   ============================================ */
div.info8.vipgrid {
    display: flex;
    flex-wrap: wrap;
    align-content: flex-start;
    gap: 4px;
    padding: 6px 10px 10px;
    box-sizing: border-box;
    height: auto;
    overflow: hidden;
}

div.info8.vipgrid a {
    /* 覆盖 main20160710.css 里 div.info8 a 的 position:absolute / width:315px */
    position: static;
    left: auto;
    top: auto;
    float: none;
    display: flex;
    align-items: center;
    justify-content: space-between;
    width: calc(33.3333% - 3px);
    height: 24px;
    line-height: 22px;
    margin: 0;
    padding: 0 8px;
    box-sizing: border-box;
    overflow: hidden;
    font-size: 12px;
    text-decoration: none;
    color: #333333;
    background: #FFFFFF;
    border: 1px solid #e3e3e3;
    border-radius: 3px;
}

div.info8.vipgrid a:hover,
div.info8.vipgrid a:active {
    color: #FFFFFF;
    background-color: #3366BB;
    border-color: #3366BB;
}

/* 标题：占满剩余宽度，单行省略 */
div.info8.vipgrid a span.vg-t {
    flex: 1 1 auto;
    min-width: 0;
    padding-right: 6px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    text-align: left;
}

/* 日期：固定宽度，不参与省略 */
div.info8.vipgrid a span.vg-d {
    flex: 0 0 auto;
    width: 74px;
    overflow: hidden;
    white-space: nowrap;
    text-align: right;
    color: #888888;
    font-size: 11px;
}

div.info8.vipgrid a:hover span.vg-d,
div.info8.vipgrid a:active span.vg-d {
    color: #DDE6F5;
}

/* 平板及以下：两列 */
@media screen and (max-width: 991px) {
    div.info8.vipgrid { padding: 6px 4px 8px; gap: 4px; }
    div.info8.vipgrid a { width: calc(50% - 2px); }
}

/* 手机：单列，日期收窄让位给标题 */
@media screen and (max-width: 575px) {
    div.info8.vipgrid a { width: 100%; height: 34px; line-height: 32px; }
    div.info8.vipgrid a span.vg-d { width: 70px; }
}