*{box-sizing:border-box}
body{margin:0;background:#f4f5f7;color:#333;font:14px/1.7 "PingFang SC","Microsoft YaHei",sans-serif}
a{color:#333;text-decoration:none}
a:hover{color:#c8161d}
img{max-width:100%;border:0;vertical-align:middle}
ul{margin:0;padding:0;list-style:none}
#header{background:#fff;border-bottom:1px solid #eee;position:sticky;top:0;z-index:20}
.header{max-width:1200px;margin:0 auto;height:72px;display:flex;align-items:center;gap:24px;padding:0 16px}
#logo{margin:0;font-size:26px;line-height:1}
#logo a{color:#c8161d;font-weight:700}
#mainnav{flex:1}
.nav-pills{display:flex;gap:4px;flex-wrap:wrap}
.navbar-item a{display:block;padding:6px 12px;border-radius:16px}
.navbar-item a:hover{background:#c8161d;color:#fff}
.mini_search{margin-left:auto}
.searchform{display:flex;border:1px solid #e5e5e5;border-radius:18px;overflow:hidden;background:#fff}
.searchInput{border:0;padding:7px 12px;width:160px;outline:none}
.searchBtn{border:0;background:#c8161d;color:#fff;padding:0 14px;cursor:pointer}
.jumbotrons{position:relative;height:280px;overflow:hidden;background:#222}
.jumbotrons img{width:100%;height:280px;object-fit:cover;display:block}
.jumbotrons .shadow{position:absolute;inset:0;background:linear-gradient(to top,rgba(0,0,0,.45),rgba(0,0,0,.05))}
#wrapper{max-width:1200px;margin:-40px auto 30px;position:relative;padding:0 16px}
.fl-top{background:#fff;border-radius:6px 6px 0 0;padding:12px 18px;color:#888;font-size:13px}
.breadcrumbs i{margin:0 6px;color:#bbb}
#main{display:flex;gap:20px;align-items:flex-start}
.main-left{width:280px;flex:none}
#sidebar-left-xf{display:flex;flex-direction:column;gap:16px}
.sideleft-author,.sidebox,#article,#related,#comments{background:#fff;border-radius:6px}
.sideleft-author{padding:18px;text-align:center}
.widget_avatar{width:84px;height:84px;margin:0 auto 10px;border-radius:50%;overflow:hidden;background:#eee center/cover}
.widget_avatar img{width:84px;height:84px;object-fit:cover}
.sideleft-author h3{margin:0 0 8px;font-size:16px}
.admin_field{display:inline-block;margin-left:6px;padding:0 6px;background:#c8161d;color:#fff;border-radius:3px;font-size:12px;font-weight:400}
.author_count ul{display:flex}
.author_count li{flex:1}
.author_count span{display:block;color:#999;font-size:12px}
.author_count strong{font-size:18px}
.sidebox{padding:16px}
.sidebox_title,.related-title{margin:0 0 12px;padding-left:10px;border-left:3px solid #c8161d;font-size:16px}
.sidebar_content li+li{margin-top:12px}
.hotcom-img{float:left;width:72px;height:54px;margin-right:8px;overflow:hidden;border-radius:3px}
.hotcom-img img{width:72px;height:54px;object-fit:cover}
.hot-com-title{font-size:13px;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
.hotcom-clock{color:#999;font-size:12px;margin-top:4px}
.num1,.num2,.num3,.num4,.num5,.li-icon{display:inline-block;min-width:16px;margin-right:4px;color:#fff;background:#bbb;text-align:center;border-radius:2px;font-size:12px}
.num1,.li-icon-1{background:#c8161d}
.num2,.li-icon-2{background:#f26b21}
.num3,.li-icon-3{background:#f0b429;color:#333}
#tab{display:flex;border-bottom:1px solid #eee;margin:-4px 0 10px}
#tab li{padding:8px 14px;cursor:pointer;color:#888}
#tab li.tabhover{color:#c8161d;border-bottom:2px solid #c8161d}
.con_one_list li{margin:0;padding:7px 0;border-bottom:1px dashed #f0f0f0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
#wrap{flex:1;min-width:0;display:flex;flex-direction:column;gap:16px}
#article{padding:22px 26px 10px}
.title h1{margin:0 0 12px;font-size:26px;line-height:1.4}
.post_icon{color:#999;font-size:13px;display:flex;flex-wrap:wrap;gap:12px;padding-bottom:14px;border-bottom:1px solid #f0f0f0}
.author-head img{width:22px;height:22px;border-radius:50%;margin-right:4px}
.post{padding:16px 0;font-size:16px;line-height:1.9}
.post p{margin:0 0 14px}
.post h2,.post h3{margin:18px 0 10px;line-height:1.4}
.post img{display:block;margin:12px auto;border-radius:4px}
.post-statement{padding:12px 0 18px;color:#888;border-top:1px dashed #eee}
#authorarea{padding:0 0 18px}
.authorinfo{display:flex;gap:12px;background:#fafafa;padding:14px;border-radius:6px}
.author-avater img{width:50px;height:50px;border-radius:50%;object-fit:cover}
.author-meta{display:flex;gap:12px;flex-wrap:wrap;margin-bottom:4px}
#related{padding:18px}
.related_img{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}
.related_img img{width:100%;height:110px;object-fit:cover;border-radius:4px}
.related_img h2{margin:8px 0 0;font-size:14px;font-weight:500;line-height:1.4;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}
#comments{padding:18px}
.commentpost h4{margin:0 0 12px}
.comt-box{display:flex;gap:10px;margin-bottom:10px}
.comt-box input,.comt-area{width:100%;border:1px solid #e5e5e5;border-radius:4px;padding:8px 10px}
.comt-area{min-height:90px}
.button{background:#c8161d;color:#fff;border:0;border-radius:4px;padding:8px 22px;cursor:pointer}
.comment-text-center{text-align:center;color:#999;font-weight:400;font-size:14px}
#footer{background:#2b2d33;color:#aaa;text-align:center;padding:22px 12px}
#footer a{color:#ddd}
.cd-top{position:fixed;right:18px;bottom:18px;width:42px;height:42px;border-radius:50%;background:#c8161d;color:#fff;text-align:center;line-height:42px}
@media (max-width:980px){
  .header{height:auto;flex-wrap:wrap;padding:10px 12px}
  #mainnav,.mini_search{width:100%;margin:0}
  .searchInput{flex:1;width:auto}
  .jumbotrons,.jumbotrons img{height:180px}
  #main{flex-direction:column}
  .main-left,#wrap{width:100%}
  .related_img{grid-template-columns:repeat(2,1fr)}
  .title h1{font-size:22px}
  .comt-box{flex-direction:column}
}
