/* ==========================================
   shenghuo1.0 - 主样式
   ========================================== */

/* ---------- 基础重置 ---------- */
*{margin:0;padding:0;box-sizing:border-box}
body{font-family:"Microsoft YaHei","PingFang SC","Helvetica Neue",Helvetica,Arial,sans-serif;font-size:14px;color:#333;background:#f5f5f5;line-height:1.6}
a{color:#333;text-decoration:none;transition:color .2s}
a:hover{color:#e74c7a}
img{max-width:100%;height:auto;display:block}
ul,ol{list-style:none}
.clearfix::after,.clear::after{content:"";display:block;clear:both}
.clear{clear:both}
.container{width:1200px;margin:0 auto}

/* ---------- 顶部导航 ---------- */
.header{background:#fff;border-bottom:1px solid #eee}
.header .container{height:70px;display:flex;align-items:center;justify-content:space-between}
.logo{display:block}
.logo img{height:50px;width:auto}
.headerInput{display:flex;align-items:center;border:1px solid #ddd;border-radius:25px;padding:0 5px 0 15px;background:#fafafa}
.headerInput img{width:18px;height:18px;margin-right:8px;flex-shrink:0}
.headerInputText{border:none;outline:none;background:none;width:280px;height:38px;font-size:14px;color:#333}
.headerInputBtn{background:#e74c7a;color:#fff;border:none;border-radius:20px;padding:8px 20px;cursor:pointer;font-size:14px;transition:background .3s}
.headerInputBtn:hover{background:#d43a68}

/* ---------- 主导航 ---------- */
.navigation{background:#e74c7a;height:45px;line-height:45px;box-shadow:0 2px 5px rgba(0,0,0,.1)}
.navBox .comWidth{width:1200px;margin:0 auto}
.nav{display:flex;overflow:hidden}
.nav li{position:relative;padding:0;flex-shrink:0}
.nav li a{display:block;color:#fff;padding:0 22px;font-size:15px;transition:background .3s;white-space:nowrap}
.nav li a:hover,.nav li.active a{background:rgba(255,255,255,.15)}
.nav li span{display:none}

/* ---------- 主内容区 ---------- */
.mainbox{width:1200px;margin:15px auto 0;display:flex;min-width:0}
.mainbox_left{width:880px;display:flex;min-width:0}
.fixed_outbox{width:170px;flex-shrink:0;min-width:0}
.fix_guide{background:#fff;border-radius:5px;padding:10px 0;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.guidebox{display:flex;align-items:center;padding:10px 15px;margin:2px 0;transition:all .3s;border-radius:3px}
.guidebox:hover,.guidebox.active{background:#fef0f5}
.guidebox img{width:22px;height:22px;margin-right:8px;flex-shrink:0}
.guidebox.active img.icon_tuijian,.guidebox:first-child img{transform:scale(1.1)}
.guidebox span{font-size:14px;color:#555}
.guidebox:hover span,.guidebox.active span{color:#e74c7a;font-weight:600}
.main_content{flex:1;margin-left:15px;min-width:0}

/* ---------- 轮播图 ---------- */
.firstLeftBanner{background:#fff;border-radius:5px;overflow:hidden;margin-bottom:15px;position:relative}
.firstLeftBanner .swiper-container{width:100%;height:450px;overflow:hidden}
.firstLeftBanner .swiper-wrapper{height:450px}
.firstLeftBanner .swiper-slide{height:450px;overflow:hidden;background:#f5f5f5}
.firstLeftBanner .swiper-slide img{width:100%!important;height:450px!important;object-fit:cover;display:block}
.swiper-button-next,.swiper-button-prev{color:#fff!important;background:rgba(0,0,0,.3);width:40px;height:60px;border-radius:3px;transition:background .3s}
.swiper-button-next:hover,.swiper-button-prev:hover{background:rgba(0,0,0,.55)}
.swiper-pagination-bullet{background:#fff!important;opacity:.7}
.swiper-pagination-bullet-active{background:#e74c7a!important;opacity:1}

/* ---------- 猜你喜欢 ---------- */
.guessTitle{display:flex;align-items:center;justify-content:space-between;padding:12px 0 8px;margin:10px 0 5px}
.guessTitle h2{font-size:20px;font-weight:700;color:#222;padding-left:12px;border-left:4px solid #e74c7a;line-height:1}
.guessTitle.special{margin-top:20px}
.guessTitle a{font-size:13px;color:#999;flex-shrink:0}
.guessTitle a:hover{color:#e74c7a}
.recommendation{background:#fff;border-radius:5px;padding:15px;box-shadow:0 1px 3px rgba(0,0,0,.08);display:flex;gap:12px;min-width:0}
.recommendation_item{flex:1;min-width:0;overflow:hidden}
.recommendation_item:last-child{border-right:none}
.first_pic{position:relative;width:100%;overflow:hidden;border-radius:5px}
.first_pic img{width:100%;height:170px;object-fit:cover;transition:transform .5s}
.recommendation_item:hover .first_pic img{transform:scale(1.05)}
.shadow_text{position:absolute;bottom:0;left:0;right:0;padding:25px 8px 8px;background:linear-gradient(transparent,rgba(0,0,0,.65));color:#fff;font-size:13px;line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.view{padding:5px 0 0}
.viewLists{display:flex;flex-direction:column}
.viewHotList{display:flex;align-items:center;padding:5px 3px;border-bottom:1px dashed #f0f0f0}
.viewHotList:last-child{border-bottom:none}
.viewHotListDot{width:5px;height:5px;border-radius:50%;background:#e74c7a;flex-shrink:0;margin-right:6px}
.viewHotList p{font-size:12px;color:#555;line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.viewHotList:hover p{color:#e74c7a}

/* ---------- 美食推荐（网格图） ---------- */
.secondLeftLists{display:flex;flex-wrap:wrap;gap:10px;background:#fff;border-radius:5px;padding:12px 10px;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.secondLeftList{width:calc(25% - 7.5px);overflow:hidden;border-radius:5px;transition:transform .3s}
.secondLeftList:hover{transform:translateY(-2px)}
.secondLeftListImg{width:100%;height:120px;overflow:hidden;border-radius:4px}
.secondLeftListImg img{width:100%;height:100%;object-fit:cover;transition:transform .5s;display:block}
.secondLeftList:hover .secondLeftListImg img{transform:scale(1.08)}
.secondLeftList p{font-size:13px;color:#444;padding:6px 2px 0;line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.secondLeftList:hover p{color:#e74c7a}

/* ---------- 汽车百科（文字双列） ---------- */
.com{display:flex;gap:15px;background:#fff;border-radius:5px;padding:12px 15px;box-shadow:0 1px 3px rgba(0,0,0,.08);min-width:0}
.com .conList{flex:1;min-width:0}
.conHotList{padding:7px 5px;border-bottom:1px dashed #f0f0f0}
.conHotList:last-child{border-bottom:none}
.conHotList p{font-size:13px;color:#555;line-height:1.5;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.conHotList:hover p{color:#e74c7a;padding-left:3px}

/* ---------- 数码科技（图文双列） ---------- */
.tec{display:flex;gap:12px;background:#fff;border-radius:5px;padding:12px;box-shadow:0 1px 3px rgba(0,0,0,.08);min-width:0}
.tec .viewListsLeft,.tec .viewListsRight{flex:1;min-width:0}
.viewListMain{display:flex;flex-direction:column;margin-bottom:8px;padding-bottom:8px;border-bottom:1px dashed #eee;min-width:0}
.viewListMain:last-child{border-bottom:none}
.viewList{display:flex;gap:8px;align-items:center;min-width:0}
.viewListImg{width:80px;height:55px;overflow:hidden;border-radius:3px;flex-shrink:0}
.viewListImg img{width:100%;height:100%;object-fit:cover;display:block}
.telListText{flex:1;min-width:0}
.telListText p{font-size:12px;color:#555;line-height:1.4;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}
.telText{padding:3px 0}
.telText p{font-size:13px;font-weight:600;color:#333;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}

/* ---------- 生活常识（小图+标题列表） ---------- */
.nationalLists{background:#fff;border-radius:5px;padding:10px 15px;box-shadow:0 1px 3px rgba(0,0,0,.08);display:flex;flex-wrap:wrap;gap:5px}
.nationalList{display:flex;width:50%;padding:10px 5px;border-bottom:1px dashed #f0f0f0;align-items:center;min-width:0}
.nationalList:nth-last-child(-n+2){border-bottom:none}
.nationalListImg{width:80px;height:55px;overflow:hidden;border-radius:4px;flex-shrink:0;margin-right:10px}
.nationalListImg img{width:100%;height:100%;object-fit:cover;transition:transform .4s;display:block}
.nationalList:hover .nationalListImg img{transform:scale(1.06)}
.nationalListText{flex:1;min-width:0;overflow:hidden}
.nationalListText p{font-size:14px;color:#333;font-weight:600;line-height:1.4;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nationalListTextTig{font-size:12px;color:#aaa;margin-top:3px}
.nationalList:hover .nationalListText p{color:#e74c7a}

/* ---------- 右侧栏 ---------- */
.mainbox_right{width:290px;margin-left:15px;flex-shrink:0;min-width:0}
.recommend{background:#fff;border-radius:5px;margin-bottom:12px;overflow:hidden;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.recommendTitle{font-size:16px;font-weight:700;color:#222;padding:12px 15px;border-bottom:2px solid #e74c7a;display:flex;justify-content:space-between;align-items:center}
.recommendTitle a span{font-size:12px;color:#999;font-weight:400}
.recommendTitle a:hover span{color:#e74c7a}

/* 大家都爱看（标签） */
.seeLists{display:flex;flex-wrap:wrap;padding:10px 10px 5px}
.seeList{display:inline-block;padding:4px 10px;margin:3px;border:1px solid #f0f0f0;border-radius:3px;font-size:13px;color:#666;transition:all .3s}
a:hover .seeList{background:#e74c7a;color:#fff;border-color:#e74c7a}

/* 侧边栏栏目区块 */
.childLists{padding:10px}
.childList{display:flex;gap:10px;padding:6px 0;border-bottom:1px dashed #f0f0f0;min-width:0}
.childList:last-child{border-bottom:none}
.childListImg{width:70px;height:50px;overflow:hidden;border-radius:3px;flex-shrink:0}
.childListImg img{width:100%;height:100%;object-fit:cover;display:block}
.childListText{flex:1;font-size:13px;color:#555;line-height:1.4;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}

/* 热门推荐 */
.recommendLists{padding:8px}
.recommendList{display:flex;gap:10px;padding:8px 5px;border-bottom:1px dashed #f0f0f0;min-width:0}
.recommendList:last-child{border-bottom:none}
.recommendListImg{width:90px;height:60px;overflow:hidden;border-radius:3px;flex-shrink:0}
.recommendListImg img{width:100%;height:100%;object-fit:cover;display:block}
.recommendList p{flex:1;font-size:13px;color:#555;line-height:1.4;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}

/* 关于我们 */
.index_title{position:relative;padding:0 0 8px;margin-bottom:10px;border-bottom:2px solid #e74c7a}
.index_title span{font-size:16px;font-weight:700;color:#333;display:inline-block;padding-left:10px;border-left:3px solid #e74c7a}
.aboutus{background:#fff;border-radius:5px;padding:15px;margin-bottom:12px;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.aboutus_content p{font-size:13px;color:#666;line-height:1.8;margin-bottom:5px}
.aboutus_contact{margin-top:8px;padding-top:8px;border-top:1px dashed #eee}
.aboutus_contact p{font-size:13px;color:#555}

/* ---------- 文章列表（通用 fallback） ---------- */
.textlist_box{background:#fff;border-radius:5px;padding:10px 20px;box-shadow:0 1px 3px rgba(0,0,0,.08)}
.textlist{display:flex;padding:18px 0;border-bottom:1px solid #f0f0f0;min-width:0}
.textlist:last-child{border-bottom:none}
.textlist_img{width:180px;height:120px;overflow:hidden;border-radius:4px;flex-shrink:0;margin-right:20px}
.textlist_img img{width:100%;height:100%;object-fit:cover;transition:transform .5s}
.textlist:hover .textlist_img img{transform:scale(1.05)}
.textlist_text{flex:1;min-width:0}
.textlist_text h3{font-size:17px;font-weight:700;margin-bottom:8px;line-height:1.4}
.textlist_text h3 a{color:#222}
.textlist_text h3 a:hover{color:#e74c7a}
.textlist_text_dec{font-size:12px;color:#999;margin-bottom:10px}
.textlist_text_dec span{margin-right:15px}
.textlist_text p{font-size:14px;color:#666;line-height:1.7;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}

/* ---------- 分页 ---------- */
.page-nav{text-align:center;padding:20px 0}
.page-nav a,.page-nav span{display:inline-block;padding:6px 12px;margin:0 2px;border:1px solid #ddd;border-radius:3px;font-size:13px;color:#555;transition:all .3s}
.page-nav a:hover{background:#e74c7a;color:#fff;border-color:#e74c7a}
.page-nav span.current{background:#e74c7a;color:#fff;border-color:#e74c7a}

/* ---------- 文章详情页 ---------- */
.article_box{background:#fff;border-radius:5px;padding:25px 30px;min-height:400px}
.article_title h1{font-size:24px;color:#222;margin-bottom:15px;line-height:1.4}
.article_info{font-size:13px;color:#999;margin-bottom:20px;padding-bottom:15px;border-bottom:1px solid #eee}
.article_info span{margin-right:20px}
.article_content{font-size:15px;color:#444;line-height:1.9;word-wrap:break-word;overflow-wrap:break-word}
.article_content p{margin-bottom:15px}
.article_content img{margin:10px auto;border-radius:5px;max-width:100%!important;height:auto!important;display:block}
.article_tags{padding:15px 0;margin-top:20px;border-top:1px solid #eee;font-size:13px;color:#999}
.article_tags a{color:#e74c7a;margin:0 3px}
.article_nav{padding:15px 0;margin-top:15px;border-top:1px solid #eee}
.article_nav p{margin:5px 0;font-size:14px}
.article_nav a{color:#e74c7a}
.cat_header{padding:15px 20px;background:#fff;border-radius:5px;margin-bottom:15px}
.cat_header h1{font-size:22px;color:#222}
.cat_header p{font-size:13px;color:#888;margin-top:5px}

/* ---------- 底部 ---------- */
.fbottom{background:#333;color:#aaa;text-align:center;padding:25px 0;margin-top:20px;font-size:13px;line-height:2}
.fbottom a{color:#ccc;margin:0 5px}
.fbottom a:hover{color:#e74c7a}
.footer_links{margin-bottom:8px}

/* 返回顶部 */
#top{position:fixed;right:25px;bottom:60px;width:44px;height:44px;background:linear-gradient(135deg,#e74c7a,#d43a68);border-radius:50%;cursor:pointer;display:none;z-index:999;box-shadow:0 3px 10px rgba(231,76,122,.4);transition:all .3s}
#top:hover{transform:translateY(-3px);box-shadow:0 5px 15px rgba(231,76,122,.5)}
#top::after{content:"\2191";color:#fff;font-size:22px;display:flex;align-items:center;justify-content:center;height:100%;font-weight:700}

/* 懒加载 */
img.lazyload{opacity:1;transition:opacity .3s}
img.lazyloaded{opacity:1}

/* ===== 响应式 ===== */
@media screen and (max-width:1200px){
    .container,.mainbox,.navBox .comWidth{width:100%;padding:0 10px}
    .mainbox{flex-direction:column}
    .mainbox_left{width:100%;flex-direction:column}
    .fixed_outbox{width:100%;margin-bottom:10px;overflow-x:auto}
    .fix_guide{display:flex;padding:8px 5px;overflow-x:auto}
    .guidebox{flex-shrink:0;padding:6px 10px;flex-direction:column}
    .guidebox img{margin:0 0 3px;width:20px;height:20px}
    .guidebox span{font-size:11px;white-space:nowrap}
    .main_content{margin-left:0}
    .mainbox_right{width:100%;margin-left:0}
    .recommendation{flex-direction:column}
    .recommendation_item{width:100%}
    .secondLeftList{width:calc(50% - 5px)}
    .com{flex-direction:column}
    .tec{flex-direction:column}
    .nationalList{width:100%}
    .nationalList:nth-last-child(-n+2){border-bottom:1px dashed #f0f0f0}
    .nationalList:last-child{border-bottom:none}
}
@media screen and (max-width:768px){
    .header .container{height:auto;padding:10px;flex-wrap:wrap}
    .logo img{height:36px}
    .headerInput{margin-top:8px;width:100%}
    .headerInputText{width:100%}
    .navigation{overflow-x:auto}
    .nav{flex-wrap:nowrap}
    .nav li a{padding:0 12px;font-size:13px;white-space:nowrap}
    .firstLeftBanner .swiper-container{height:250px}
    .firstLeftBanner .swiper-slide{height:250px}
    .firstLeftBanner .swiper-slide img{height:250px!important}
    .secondLeftList{width:calc(50% - 5px)}
    .article_box{padding:15px}
}

/* 搜索框重置 - 去掉默认灰色方块/清除按钮 */
.headerInputText::-webkit-search-decoration,
.headerInputText::-webkit-search-cancel-button,
.headerInputText::-webkit-search-results-button,
.headerInputText::-webkit-search-results-decoration,
.headerInputText::-webkit-clear-button,
.headerInputText::-ms-clear{display:none;-webkit-appearance:none}
.headerInputText{outline:none;-webkit-appearance:none;appearance:none}


/* 右侧栏整体下移与猜你喜欢平齐（仅首页） */
.home .mainbox_right{margin-top:480px}

/* 轮播图扩展到右侧栏区域 */
.firstLeftBanner{margin-right:-305px;width:auto}
@media screen and (max-width:1200px){
  .home .mainbox_right{margin-top:15px}
  .firstLeftBanner{margin-right:0;width:100%}
}
