@charset "utf-8";
/* ============================================================
   首页专属：新闻缩略图列表
   仅在 首页第一页 加载，不影响列表页 / 文章页 / 其他页面
   ============================================================ */

/* ---------- 新闻区：全宽 + 缩略图卡片 ---------- */
#fh5co-info-list{padding:36px 0 46px;background:#fff}

#fh5co-info-list .fh5co-heading.hn-head{
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:16px;
  height:auto;
  min-height:40px;
  padding:0 0 10px;
  border-bottom:1px solid #e6ebf2;
}
#fh5co-info-list .fh5co-heading.hn-head h2{
  position:relative;
  display:inline-block;
  margin:0;
  padding:0 0 0 12px;
  border-bottom:0;
  font-size:20px;
  font-weight:600;
  line-height:1.4;
  color:var(--hn-primary, #003366);
  overflow:visible;
  word-break:normal;
}
#fh5co-info-list .fh5co-heading.hn-head h2::before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  width:4px;
  height:18px;
  margin-top:-9px;
  border-radius:2px;
  background:linear-gradient(180deg,var(--hn-primary, #003366),var(--hn-accent, #2f78c4));
}
#fh5co-info-list .fh5co-heading.hn-head h2 a{color:var(--hn-primary, #003366)}
#fh5co-info-list .fh5co-heading.hn-head h2 a:hover{color:var(--hn-accent, #2f78c4)}
#fh5co-info-list .hn-more{
  flex:0 0 auto;
  font-size:12px;
  color:#8894a5;
  text-decoration:none;
  transition:color .2s;
}
#fh5co-info-list .hn-more .iconfont{font-size:12px;margin-left:2px}
#fh5co-info-list .hn-more:hover{color:var(--hn-primary, #003366)}

#fh5co-info-list .hn-list{
  display:grid;
  grid-template-columns:repeat(2,minmax(0,1fr));
  gap:16px 22px;
  margin:0;
  padding:22px 0 0;
  list-style:none;
}
#fh5co-info-list .hn-item{
  display:flex;
  align-items:stretch;
  gap:14px;
  min-width:0;
  padding:12px;
  background:#fff;
  border:1px solid #e8edf4;
  border-radius:10px;
  transition:transform .25s ease,box-shadow .25s ease,border-color .25s ease;
}
#fh5co-info-list .hn-item:hover{
  transform:translateY(-2px);
  border-color:#c9dcf0;
  box-shadow:0 10px 26px rgba(15,45,80,.09);
}
#fh5co-info-list .hn-thumb{
  flex:0 0 172px;
  width:172px;
  height:118px;
  display:block;
  overflow:hidden;
  border-radius:8px;
  background:#f2f5f9;
}
#fh5co-info-list .hn-thumb img{
  display:block;
  width:100%;
  height:100%;
  object-fit:cover;
  transition:transform .5s ease;
}
#fh5co-info-list .hn-item:hover .hn-thumb img{transform:scale(1.06)}
#fh5co-info-list .hn-body{
  display:flex;
  flex-direction:column;
  justify-content:center;
  gap:7px;
  min-width:0;
  flex:1 1 auto;
}
#fh5co-info-list .hn-title{
  margin:0;
  font-size:15px;
  font-weight:600;
  line-height:1.55;
}
#fh5co-info-list .hn-title a{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
  color:#1f2c3d;
  text-decoration:none;
  transition:color .2s;
}
#fh5co-info-list .hn-title a:hover{color:var(--hn-primary, #003366)}
#fh5co-info-list .hn-intro{
  display:-webkit-box;
  -webkit-box-orient:vertical;
  -webkit-line-clamp:2;
  overflow:hidden;
  margin:0;
  font-size:12.5px;
  line-height:1.75;
  color:#8a94a3;
}
#fh5co-info-list .hn-meta{
  display:flex;
  align-items:center;
  gap:14px;
  font-size:12px;
  line-height:1.6;
  color:#9aa4b2;
}
#fh5co-info-list .hn-date{color:#9aa4b2}
#fh5co-info-list .hn-view{position:relative;padding-left:13px;color:#9aa4b2}
#fh5co-info-list .hn-view::before{
  content:"";
  position:absolute;
  left:0;
  top:50%;
  width:3px;
  height:3px;
  margin-top:-1.5px;
  border-radius:50%;
  background:#c6cede;
}

/* ---------- 响应式 ---------- */
@media screen and (max-width:980px){
  #fh5co-info-list .hn-list{grid-template-columns:1fr;gap:14px}
  #fh5co-info-list .hn-thumb{flex-basis:156px;width:156px;height:108px}
}
@media screen and (max-width:760px){
  #fh5co-info-list{padding:28px 0 32px}
  #fh5co-info-list .fh5co-heading.hn-head h2{font-size:18px}
  #fh5co-info-list .hn-list{padding-top:16px;gap:12px}
  #fh5co-info-list .hn-item{padding:10px;gap:12px;border-radius:8px}
  #fh5co-info-list .hn-thumb{flex-basis:124px;width:124px;height:88px}
  #fh5co-info-list .hn-title{font-size:14px}
  #fh5co-info-list .hn-intro{display:none}
}
@media screen and (max-width:480px){
  #fh5co-info-list .hn-thumb{flex-basis:104px;width:104px;height:76px}
  #fh5co-info-list .hn-title{font-size:13px;line-height:1.5}
  #fh5co-info-list .hn-meta{font-size:11px;gap:10px}
}

/* ============================================================
   首页轮播：固定显示比例 + 等比裁切
   原图 1200x312（约 3.85:1），模板旧属性写成 1920x600（3.2:1）
   导致浏览器按错误比例拉伸 → 图片变形。此处按真实比例重建。
   ============================================================ */
.flexslider{
  position:relative;
  background:#0b1b2e;
  overflow:hidden;
}
.flexslider .slides > li{position:relative}

/* 用 padding 撑出固定比例盒，任何宽屏下比例都不变 */
.flexslider .slides > li > a{
  display:block;
  position:relative;
  width:100%;
  height:0;
  padding-top:26%;          /* 1200 x 312 = 26% */
  overflow:hidden;
}

/* 图片填满盒子并等比裁切，绝不拉伸 */
.flexslider .slides > li > a > img{
  position:absolute;
  top:0;
  left:0;
  width:100%;
  height:100%;
  max-width:none;
  object-fit:cover;
  object-position:center center;
  display:block;
}

/* 手机端：比例放高，避免横幅被压成一条细带 */
@media screen and (max-width:760px){
  .flexslider .slides > li > a{padding-top:40%}
}
