/* ============================================================
 * 焦点图(.focus) 与 金港关注(.top) 两栏对齐修复 v2
 * 站点：www.fzjsgw.com（EyouCMS 默认模板）
 * ------------------------------------------------------------
 * 本次（2026-11-05 二次修复）根因：
 *   首页模板近期改版后，金港关注(.top) 内部字号/行距放大
 *   （h3 1.3em、h4 1.2em、p max-height 50px、li 上下间距 14px），
 *   3 条内容自然高度约 424px，已超出旧方案的 387px 盒子，
 *   被 .top 的 overflow:hidden 裁掉第 3 条底部 → 视觉上"底部没对齐/被截断"。
 *   焦点图(.focus) 仍是 387px，于是两栏可见底部错位。
 * 修复要点：
 *   1) 两栏统一等高 430px（留出余量，彻底不裁切），焦点图同步 430px；
 *   2) .top 内部列表改为 flex 纵向撑满，3 条均匀分布、底部不留空白；
 *   3) 高度/宽度/float 全部 !important，压制 core.css / pages.css
 *      各档媒体查询冲突声明（含 ≤1200px 的 .focus 359px、≤980px 的 width:100%）。
 * 部署：本文件在首页模板 <head> 中 pages.css 之后用
 *      <link href="/template/default/pc/skin/css/focus_top_align.css" rel="stylesheet">
 *      引入；回滚：删掉该 <link> 即可。
 * ============================================================ */

@media (min-width: 981px) {
  .focus,
  .top {
    float: left !important;
    width: calc(50% - 10px) !important;
    height: 430px !important;
    margin-bottom: 20px !important;
    box-sizing: border-box !important;
  }
  .focus {
    margin-right: 20px !important;
  }
  .top {
    margin-right: 0 !important;
    display: flex !important;
    flex-direction: column !important;
  }
  /* 金港关注内部列表纵向撑满，3 条均匀分布：底部不留空、也不裁切 */
  .top > ul {
    flex: 1 1 auto !important;
    display: flex !important;
    flex-direction: column !important;
    justify-content: space-between !important;
    margin: 0 !important;
  }
  /* 焦点图填满等高盒子；object-fit:cover 避免改高度后被拉伸变形 */
  .focus ul li img {
    width: 100% !important;
    height: 430px !important;
    object-fit: cover !important;
  }
  .flexslider {
    width: 100% !important;
    height: 430px !important;
  }
}
