
/* ==========全局重置========== */
*{
    margin: 0;
    padding: 0;
    box-sizing: border-box;
}
body{
    font-family: "Microsoft YaHei",Helvetica,sans-serif;
    background-color: #f4f6f9;
    color: #333;
    font-size: 14px;
    line-height: 1.7;
}
a{
    text-decoration: none;
    color: #333;
    transition: all 0.22s;
}
a:hover{
    color: #0066cc;
}
ul,ol{
    list-style: none;
}
img{
    width: 100%;
    display: block;
    object-fit: cover;
}

li{
           list-style: none;
}

.fl{float:left;}
.fr{float:right;}
.clearfix::after{
    content:"";
    display:block;
    clear:both;
}
.container{
    width: 1220px;
    margin: 0 auto;
}

/* ==========通用标签、文本组件========== */
.tag{
    display: inline-block;
    padding: 2px 7px;
    font-size: 12px;
    margin-right: 6px;
}
.tag-blue{background:#e8f2ff;color:#0066cc;}
.tag-orange{background:#fff2e8;color:#ff6700;}
.tag-green{background:#e6f9ef;color:#009957;}
.tag-red{background:#fee;color:#f54343;}
.tag-gray{background:#f2f3f5;color:#666;}
.tag-purple{background:#f4efff;color:#8848dd;}
/* 身份标签 */
.tag-person{background:#e1f5fe;color:#0288d1;}
.tag-shop{background:#fff8e1;color:#f57c00;}

.price-text{
    font-size:18px;
    color:#ff5500;
    font-weight:bold;
}
.meta-info{
    font-size:12px;
    color:#888;
}
.hover-shadow{
    transition: box-shadow 0.25s,transform 0.25s;
}
.hover-shadow:hover{
    box-shadow: 0 4px 14px rgba(0,0,0,0.09);
    transform: translateY(-2px);
}
.img-scale{
    overflow:hidden;
}
.img-scale img{
    transition: transform 0.3s;
}
.img-scale:hover img{
    transform: scale(1.06);
}

/* ==========1.顶部通知通栏========== */
.top-bar{
    background:#232834;
    color:#ccc;
    font-size:13px;
    padding:8px 0;
}
.top-bar a{
    color:#ccc;
}
.top-bar a:hover{
    color:#fff;
}
.top-left a{
    margin-right:16px;
}
.top-right a{
    padding:0 12px;
    border-left:1px solid #444;
}
.top-right a:first-child{border-left:none;}

/* ==========2.头部LOGO+搜索一体区域========== */
.header-main{
    background:#ffffff;
    padding:24px 0;
}
.logo-area{
    width:240px;
    float:left;
}
.logo{
    font-size:30px;
    font-weight:bold;
    color:#0066cc;
}
.logo-sub{
    font-size:12px;
    color:#999;
}
.header-search{
    width:640px;
    float:left;
    margin-left:40px;
    margin-top:12px;
}
.search-row{
    display:flex;
}
.header-search input{
    flex:1;
    height:44px;
    border:2px solid #0066cc;
    padding:0 16px;
    font-size:15px;
    outline:none;
}
.search-btn{
    width:106px;
    height:44px;
    background:#0066cc;
    color:#fff;
    border:none;
    font-size:15px;
    cursor:pointer;
}
.search-btn:hover{
    background:#0052a6;
}
.hot-keyword{
    margin-top:10px;
}
.hot-keyword a{
    font-size:13px;
    margin-right:12px;
    color:#666;
}
.header-publish-box{
    float:right;
    margin-top:12px;
}
.publish-btn{
    display:block;
    background:#ff6700;
    color:#fff;
    padding:11px 28px;
    font-size:15px;
}
.publish-btn:hover{
    background:#e65c00;
}

/* ==========3.主导航栏========== */
.nav-header{
    background:#fff;
    border-top:1px solid #eee;
    border-bottom:2px solid #0066cc;
}
.nav-list{
    display:flex;
}
.nav-list>li>a{
    display:block;
    padding:14px 22px;
    font-size:15px;
}
.nav-list>li>a.active{
    background:#0066cc;
    color:#fff;
}
.nav-user-menu{
    float:right;
}
.nav-user-menu a{
    padding:14px 14px;
    font-size:13px;
    color:#666;
}

/* ==========新增：筛选标签导航条【全新排版】========== */
.filter-tab-bar{
    background:#fff;
    padding:14px 0;
    border-bottom:1px solid #eee;
}
.filter-list{
    display:flex;
    gap:10px;
}
.filter-list a{
    padding:6px 16px;
    border:1px solid #e4e7ed;
    font-size:13px;
}
.filter-list a.active{
    background:#0066cc;
    color:#fff;
    border-color:#0066cc;
}
.filter-list a:hover{
    border-color:#0066cc;
}

/* ==========4.横向快捷功能导航========== */
.quick-nav{
    background:#fff;
    padding:20px 0;
    border-bottom:1px solid #eee;
}
.quick-row{
    display:flex;
    justify-content: space-between;
}
.quick-item a{
    display:block;
    text-align:center;
    width:100px;
}
.quick-item p{
    margin-top:6px;
    font-size:13px;
}
.quick-item a:hover{
    color:#0066cc;
}

/* ==========通用模块标题========== */
.mod-title{
    display:flex;
    align-items:center;
    font-size:18px;
    font-weight:600;
    margin-bottom:16px;
}
.mod-title .line{
    width:4px;
    height:18px;
    background:#0066cc;
    margin-right:10px;
}
.mod-title .more{
    margin-left:auto;
    font-size:13px;
    color:#999;
    font-weight:normal;
}
.mod-title .more:hover{
    color:#0066cc;
}

/* ==========页面主体容器========== */
.wrap-body{
    margin-top:24px;
}
.body-layout{
    display:flex;
    gap:24px;
}
.main-left{
    width:100%;
}
.sidebar-right{
    width:366px;
}

/* ====================区块1：横幅大图 + 图文资讯列表==================== */
.banner-news-row{
    display:flex;
    gap:24px;
    margin-bottom:26px;
}
.big-banner{
    width:560px;
    height:260px;
    overflow:hidden;
    position:relative;
    img-scale;
}
.big-banner img{
    height:100%;
}
.banner-text{
    position:absolute;
    left:0;
    bottom:0;
    width:100%;
    padding:22px;
    background:linear-gradient(transparent,rgba(0,0,0,0.75));
    color:#fff;
}
.banner-text h3{
    font-size:20px;
    margin-bottom:6px;
}
/* 新版图文资讯列表（区别旧纯文字列表） */
.side-news-list{
    flex:1;
    background:#fff;
    padding:18px;
}
.news-item{
    display:flex;
    gap:10px;
    padding:9px 0;
    border-bottom:1px dotted #eee;
}
.news-item:last-child{border:none;}
.news-item .thumb{
    width:80px;
    height:56px;
}
.news-item .txt h4{
    font-size:13px;
    display:-webkit-box;
    -webkit-line-clamp:2;
    overflow:hidden;
}

/* ====================新增：同城行情快讯 通栏横向图文排版【全新版式】==================== */
.news-flash{
    background:#fff;
    padding:20px;
    margin-bottom:26px;
}
.flash-row{
    display:flex;
    gap:16px;
}
.flash-card{
    flex:1;
}
.flash-card .pic{
    height:110px;
    margin-bottom:8px;
}
.flash-card h4{
    font-size:14px;
    display:-webkit-box;
    -webkit-line-clamp:2;
    overflow:hidden;
}

/* ====================区块2：招聘专区【双混合排版：岗位卡片 + 企业卡片两种样式共存】==================== */
.job-section{
    background:#fff;
    padding:22px;
    margin-bottom:26px;
}
.job-tab{
    display:flex;
    gap:20px;
    margin-bottom:18px;
}
.job-tab a{
    font-size:15px;
    padding-bottom:4px;
}
.job-tab a.active{
    color:#0066cc;
    border-bottom:2px solid #0066cc;
}
.job-row{
    display:flex;
    flex-wrap:wrap;
    gap:18px;
    margin-bottom:22px;
}
.job-card{
    width:calc(50% - 9px);
    border:1px solid #eee;
    padding:14px;
    hover-shadow;
}
.job-name{
    font-size:16px;
    font-weight:500;
    margin-bottom:8px;
}
.job-bottom{
    display:flex;
    justify-content:space-between;
    margin-top:8px;
}
/* 新增企业招聘横向卡片 全新排版 */
.company-row{
    display:flex;
    gap:14px;
}
.company-card{
    flex:1;
    border:1px solid #eee;
    padding:12px;
    display:flex;
    gap:12px;
    hover-shadow;
}
.company-card .logo{
    width:70px;
    height:70px;
    background:#f4f6f9;
}

/* ====================区块3：二手房｜租房 左右并列双栏==================== */
.house-row{
    display:flex;
    gap:24px;
    margin-bottom:26px;
}
.house-col{
    width:50%;
    background:#fff;
    padding:22px;
}
.house-filter{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
    margin-bottom:14px;
}
.house-filter a{
    font-size:12px;
    padding:3px 9px;
    border:1px solid #eee;
}
.house-filter a.active{
    background:#0066cc;
    color:#fff;
    border-color:#0066cc;
}
.house-grid{
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap:16px;
}
.house-card a{
    display:block;
}
.house-card .pic{
    height:130px;
    margin-bottom:8px;
    img-scale;
}
.house-card h4{
    font-size:14px;
    display:-webkit-box;
    -webkit-line-clamp:2;
    overflow:hidden;
}

/* ====================区块4：二手闲置 + 便民服务【左右并排】==================== */
.goods-service-row{
    display:flex;
    gap:24px;
    margin-bottom:26px;
}
.goods-col{
    width:58%;
    background:#fff;
    padding:22px;
}
.service-col{
    width:42%;
    background:#fff;
    padding:22px;
}
.goods-grid{
    display:grid;
    grid-template-columns: repeat(4,1fr);
    gap:12px;
}
.goods-item{
    hover-shadow;
}
.goods-item .img{
    height:110px;
    margin-bottom:6px;
    img-scale;
}
.goods-item .title{
    font-size:13px;
    display:-webkit-box;
    -webkit-line-clamp:2;
    overflow:hidden;
}
.service-tag-wrap{
    display:flex;
    flex-wrap:wrap;
    gap:10px;
}
.service-tag-wrap a{
    border:1px solid #e4e7ed;
    padding:9px 12px;
    flex:1 1 42%;
    text-align:center;
}
.service-tag-wrap a:hover{
    background:#f0f7ff;
    border-color:#0066cc;
}

/* ====================新增：精选商家横向多卡片排版【全新模块】==================== */
.shop-section{
    background:#fff;
    padding:22px;
    margin-bottom:26px;
}
.shop-row{
    display:flex;
    gap:16px;
}
.shop-card{
    flex:1;
    border:1px solid #eee;
    padding:14px;
    hover-shadow;
}
.shop-card .pic{
    height:120px;
    margin-bottom:10px;
    img-scale;
}

/* ====================区块5：二手车通栏板块==================== */
.car-section{
    background:#fff;
    padding:22px;
    margin-bottom:26px;
}
.car-grid{
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap:20px;
}
.car-item{
    display:flex;
    gap:14px;
    hover-shadow;
    padding:10px;
    border:1px solid #eee;
}
.car-item .img{
    width:200px;
    height:140px;
    img-scale;
}
.car-info h4{
    font-size:15px;
    margin-bottom:6px;
}

/* ====================右侧边栏丰富多种组件==================== */
.sidebar-widget{
    background:#fff;
    padding:18px;
    margin-bottom:20px;
}
.widget-notice{
    background:#1976d2;
    color:#fff;
}
.widget-notice .mod-title{
    color:#fff;
}
.publish-grid{
    display:grid;
    grid-template-columns: 1fr 1fr;
    gap:10px;
}
.publish-grid a{
    display:block;
    text-align:center;
    padding:10px 0;
    border:1px solid #e5e7eb;
    background:#f7f9fc;
}
.publish-grid a:hover{
    background:#0066cc;
    color:#fff;
    border-color:#0066cc;
}
.rank-list li{
    padding:8px 0;
    border-bottom:1px dotted #eee;
}
.rank-list li:last-child{border:none;}
/* 侧边热门搜索云标签 */
.tag-cloud{
    display:flex;
    flex-wrap:wrap;
    gap:8px;
}
.tag-cloud a{
    border:1px solid #eee;
    padding:4px 8px;
    font-size:12px;
}
.tag-cloud a:hover{
    background:#f0f7ff;
    border-color:#0066cc;
}
/* 悬浮客服按钮 */
.float-service{
    position:fixed;
    right:30px;
    bottom:110px;
    width:46px;
    height:46px;
    background:#ff6700;
    color:#fff;
    text-align:center;
    line-height:46px;
    cursor:pointer;
}

/* ==========底部区域新版式========== */
.footer{
    background:#222833;
    color:#aaa;
    margin-top:40px;
    padding:40px 0 25px;
}
.footer-row{
    display:grid;
    grid-template-columns: repeat(6,1fr);
    gap:16px;
    margin-bottom:30px;
}
.footer-col h4{
    color:#fff;
    margin-bottom:14px;
    font-size:15px;
}
.footer-col a{
    display:block;
    color:#aaa;
    margin:7px 0;
    font-size:13px;
}
.footer-col a:hover{
    color:#fff;
}
.footer-copyright{
    text-align:center;
    padding-top:20px;
    border-top:1px solid #333842;
    font-size:13px;
    line-height:1.8;
}

/* 返回顶部 */
#backTop{
    position:fixed;
    right:30px;
    bottom:50px;
    width:46px;
    height:46px;
    background:#0066cc;
    color:#fff;
    text-align:center;
    line-height:46px;
    font-size:18px;
    cursor:pointer;
    display:none;
}
