/* Responsive overrides for mobile — loaded after existing styles.
   Do not change original CSS files; use these overrides to make layouts
   fluid on small screens and restore scroll behavior. */

/* Override many fixed widths/heights for small screens */
@media (max-width: 768px) {
  /* Ensure page can scroll on mobile */
  html, body {
    height: auto !important;
    min-height: 100% !important;
    overflow: auto !important;
    -webkit-overflow-scrolling: touch;
    overflow-x: hidden !important;
  }

  /* Make the centered wrapper fluid on small screens */
  .w {
    width: 100% !important;
    max-width: 1124px !important;
    padding: 0 16px !important;
    box-sizing: border-box !important;
  }

  /* Make images and videos scale */
  img, .news-cover, video {
    max-width: 100% !important;
    height: auto !important;
  }
  .container.row, .container-fluid, .container {
    width: 100% !important;
    padding-left: 12px !important;
    padding-right: 12px !important;
    box-sizing: border-box !important;
  }

  /* Remove large fixed heights so content flows naturally */
  .news-cover, .slider div[style], .news-cover[style], .contents .cont-one, .cont-two, .cont-three, .cont-four, .cont-five, .cont-six, .cont-seven, .cont-eight, .cont-nine, .cont-ten, .cont-eleven {
    height: auto !important;
    min-height: 0 !important;
    background-size: cover !important;
  }

  /* Make videos responsive */
  .cont-four .row .tab-pane video, video {
    width: 100% !important;
    height: auto !important;
  }

  /* Floating form and right floats should stack */
  .bann-form, .pull-right, .pull-left, .con-img, .con-one-img, .con-imgs {
    float: none !important;
    margin: 0 auto !important;
    display: block !important;
    text-align: center !important;
  }

  /* Top area: allow it to wrap and not cover viewport */
  .top, .top-topbg, .top-nav, .top-tel {
    height: auto !important;
    padding: 8px 0 !important;
  }

  /* Avoid forcing horizontal no-wrap */
  .textRow, .tlist li {
    white-space: normal !important;
    overflow: visible !important;
  }

  /* Ensure large fixed-width images inside .w don't overflow */
  .w img[width], img[width] {
    width: 100% !important;
    height: auto !important;
  }

  /* Buttons and inputs adapt */
  .layui-form-float, .layui-form-float * {
    width: auto !important;
    max-width: 100% !important;
  }
  /* Mobile menu / top-nav fixes (only for small screens) */
  .top-nav .w{
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:12px !important;
    padding: 6px 8px !important;
    box-sizing:border-box !important;
  }

  .top-nav .logo{
    width: 120px !important;
    max-width: 140px !important;
    height: auto !important;
    margin: 0 !important;
    display:block !important;
    flex: 0 0 auto !important;
  }

  /* WP menu id generated in templates */
  #topmeau{
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    justify-content:flex-end !important;
    width:auto !important;
    padding:0 6px !important;
    margin:0 !important;
    list-style:none !important;
    box-sizing:border-box !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling: touch !important;
    white-space:nowrap !important;
  }

  /* Make menu items inline and compact for single-row layout */
  #topmeau > li{
    flex: 0 0 auto !important;
    display:inline-block !important;
    width:auto !important;
    text-align:center !important;
    padding:6px 10px !important;
    box-sizing:border-box !important;
    border-top:none !important;
    margin:0 4px !important;
    line-height:1 !important;
  }

  #topmeau > li a{
    display:inline-block !important;
    padding:4px 6px !important;
    color: #333 !important;
    font-size:15px !important;
  }

  /* If too crowded on very small screens, use two columns */
  @media (max-width:420px){
    #topmeau > li{ width:50% !important; }
  }

}

/* ===== 手机横向布局：.pull-left.course-tits li 图标左、文案右（<=768px） ===== */
@media (max-width:768px) {
  .cont-ten.course-cont .pull-left.course-tits {
    padding: 6px 0 !important;
  }

  .cont-ten.course-cont .pull-left.course-tits li {
    display: flex !important;
    flex-direction: row !important;
    align-items: center !important;
    gap: 12px !important;
    padding: 10px 0 !important;
    margin: 0 !important;
    border-bottom: none !important;
    box-sizing: border-box !important;
  }

  /* 缩小图标为圆形并固定宽度，避免占满整行 */
  .cont-ten.course-cont .pull-left.course-tits li img {
    display: block !important;
    width: 72px !important;
    height: 72px !important;
    max-width: 72px !important;
    object-fit: cover !important;
    border-radius: 0 !important;
    margin: 0 !important;
    flex: 0 0 72px !important;
  }

  /* 修复图标被裁切问题：确保容器没有负外边距并允许溢出可见 */
  .cont-ten.course-cont .pull-left.course-tits,
  .cont-ten.course-cont .pull-left.course-tits li {
    overflow: visible !important;
    padding-left: 12px !important;
    margin-left: 0 !important;
  }

  /* 防止父容器对浮动/定位产生裁切 */
  .cont-ten.course-cont .w { overflow: visible !important; }

  /* 文案区域占据剩余空间，左对齐文本 */
  .cont-ten.course-cont .pull-left.course-tits li .pull-right {
    flex: 1 1 auto !important;
    width: auto !important;
    text-align: left !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  /* 标题、段落微调，保证可读性 */
  .cont-ten.course-cont .pull-left.course-tits li .titcorb,
  .cont-ten.course-cont .pull-left.course-tits li .titcor,
  .cont-ten.course-cont .pull-left.course-tits li .titcora {
    display: block !important;
    margin-bottom: 6px !important;
    font-size: 16px !important;
    color: #333 !important;
    line-height: 1.3 !important;
  }

  .cont-ten.course-cont .pull-left.course-tits li p {
    margin: 6px 0 !important;
    color: #666 !important;
    font-size: 13px !important;
    line-height: 1.6 !important;
  }

  /* 在非常小的屏幕上再微调图标尺寸 */
  @media (max-width:420px) {
    .cont-ten.course-cont .pull-left.course-tits li img { width:56px !important; height:96px !important; flex:0 0 56px !important; }
    .cont-ten.course-cont .pull-left.course-tits li .titcorb,
    .cont-ten.course-cont .pull-left.course-tits li .titcor,
    .cont-ten.course-cont .pull-left.course-tits li .titcora { font-size:15px !important; }
    .cont-ten.course-cont .pull-left.course-tits li p { font-size:12px !important; }
  }
}


/* Footer (.info) 手机端可见性与布局优化 */
@media (max-width:768px) {
  .info {
    display: block !important;
    position: static !important;
    clear: both !important;
    width: 100% !important;
    box-sizing: border-box !important;
    padding: 18px 12px !important;
    margin: 0 !important;
    background: transparent !important;
    z-index: 1 !important;
  }

  /* 内部容器自适应，居中，保持可读性 */
  .info .centerMth, .info .footerMth {
    width: 100% !important;
    max-width: 100% !important;
    padding: 0 8px !important;
    box-sizing: border-box !important;
    text-align: center !important;
  }

  .info .tc_p, .info .link-ft, .info .link-ft a, .info .footer_desc {
    display: block !important;
    width: 100% !important;
    color: #333 !important;
    font-size: 14px !important;
    line-height: 1.45 !important;
    margin: 6px 0 !important;
    text-align: center !important;
    word-break: break-word !important;
  }

  /* 短链接行或版权信息稍微变小以适配小屏 */
  .info .link-ft { font-size: 13px !important; color: #666 !important; }

  /* 如果 footer 被某些元素覆盖，提升其 stacking context（但尽量保持低） */
  .info, .info * { position: relative !important; z-index: 2 !important; }

  /* 确保内容下方有足够间距，避免被固定底部遮挡 */
  body > .info { padding-bottom: 30px !important; }

  .cont-five ul {
  display: flex;
  justify-content: center; /* 水平居中 */
  flex-wrap: wrap; /* 允许换行 */
  gap: 20px; /* 统一间距 */
  padding: 0;
  margin: 0;
}

.cont-five ul li {
  height: 312px;
  width: 350px;
  transition: 0.5s all;
  /* 移除原来的 margin */
  margin: 0 !important;
}


.contents ul {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 25px 66px; /* 垂直间距 25px，水平间距 66px */
  padding: 0;
  margin: 0;
  list-style: none;
}

.contents ul li {
  font-size: 25px;
  text-align: center;
  /* 清除原有样式 */
  float: none;
  margin: 0;
}

.cont-six ul {
  display: flex;
  justify-content: center; /* 水平居中 */
  flex-wrap: wrap; /* 允许换行 */
  gap: 0 73px; /* 水平间距 73px，垂直间距 0 */
  padding: 0;
  margin: 0;
  list-style: none;
}

.cont-six ul li {
  width: 208px;
  /* 移除浮动和 margin */
  float: none;
  margin: 0 !important;
}
  
}

/* 最终修复：强制在手机上 logo 与菜单垂直堆叠，清除浮动，避免重叠 */
@media (max-width:768px) {
  .top-nav .w { display:flex !important; flex-direction:column !important; align-items:center !important; justify-content:flex-start !important; gap:6px !important; }

  /* logo 单独一行，居中显示，清除任何 float */
  .top-nav .logo, .top-nav .w img.logo { float:none !important; display:block !important; margin:8px auto !important; width:100px !important; max-width:140px !important; height:auto !important; order:0 !important; }

  /* 确保菜单在 logo 下方单独一行 */
  #topmeau { order:1 !important; clear:both !important; width:100% !important; display:flex !important; flex-direction:row !important; flex-wrap:nowrap !important; justify-content:center !important; gap:8px !important; padding:6px 8px !important; margin:0 auto !important; box-sizing:border-box !important; overflow-x:auto !important; -webkit-overflow-scrolling:touch !important; }

  /* 减小菜单项间距，保证更多项可见 */
  #topmeau > li { padding:6px 6px !important; margin:0 4px !important; min-width:0 !important; }

  /* 如果菜单仍然被其他样式影响，可使用更高优先级选择器 */
  .top-nav .w #topmeau, .top-nav #topmeau { display:flex !important; }
}

/* 手机端：强制 logo 单独一行，菜单单独一行（不影响桌面） */
@media (max-width:768px) {
  /* 将 header 主容器改为纵向堆叠 */
  .top-nav .w {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    gap: 6px !important;
    padding: 8px 10px !important;
    box-sizing: border-box !important;
  }

  /* logo 缩小并居中，占据一行 */
  .top-nav .logo {
    width: 100px !important;
    max-width: 120px !important;
    height: auto !important;
    margin: 0 auto !important;
    display: block !important;
    float: none !important;
  }

  /* 菜单容器为单独一行，居中显示，且允许横向滚动以展示全部项 */
  .top-nav .w > div {
    width: 100% !important;
    display: flex !important;
    justify-content: center !important;
    align-items: center !important;
    box-sizing: border-box !important;
  }

  #topmeau {
    width: 100% !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: nowrap !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 6px 8px !important;
    margin: 0 auto !important;
    overflow-x: auto !important;
    -webkit-overflow-scrolling: touch !important;
    white-space: nowrap !important;
    box-sizing: border-box !important;
  }

  #topmeau > li {
    display: inline-block !important;
    padding: 6px 8px !important;
    margin: 0 6px !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  #topmeau > li a {
    font-size: 15px !important;
    display: inline-block !important;
    padding: 4px 6px !important;
    white-space: nowrap !important;
  }

  /* 非常小屏幕再微调 */
  @media (max-width:420px) {
    .top-nav .logo { width: 84px !important; }
    #topmeau > li a { font-size: 13px !important; padding: 4px 6px !important; }
  }
}

/* Final enforcement: force header/logo/menu single-row on small screens
   Placed last to override earlier conflicting rules. */
@media (max-width:768px){
  .top-nav .w{
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:space-between !important;
    gap:8px !important;
    padding:6px 8px !important;
  }

  .top-nav .logo{
    float:none !important;
    width:120px !important;
    max-width:140px !important;
    margin:0 !important;
    display:block !important;
  }

  /* remove float from pulled elements and force horizontal menu */
  ul.pull-left{ float:none !important; }
  #topmeau{
    float:none !important;
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    gap:8px !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch !important;
    white-space:nowrap !important;
    padding:0 6px !important;
    margin:0 !important;
  }

  #topmeau > li{
    flex:0 0 auto !important;
    display:inline-block !important;
    width:auto !important;
    padding:6px 8px !important;
    margin:0 6px !important;
    border-top:none !important;
  }
}

/* Specific fix: undo generic .pull-left display:block used earlier, only inside .top-nav */
@media (max-width:768px){
  /* Ensure elements inside header respect inline layout */
  .top-nav .pull-left{ display:flex !important; align-items:center !important; float:left !important; }

  /* Logo should float left and not be centered */
  .top-nav .logo{ float:left !important; margin:0 12px 0 0 !important; }

  /* Menu (ul#topmeau) may have class pull-left - force it to be horizontal */
  #topmeau, ul#topmeau.pull-left{
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    gap:0px !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch !important;
    white-space:nowrap !important;
    margin-left:auto !important;
    padding:0 6px !important;
  }

  /* If any global rule set width:100% on list items, undo it here */
  #topmeau > li, ul#topmeau.pull-left > li{ width:auto !important; display:inline-block !important; }
  .top-nav li {
    text-align: left;
    margin-left: 0;
    line-height: 36px;
    font-size: 16px;
    padding-left: 6px;
  }
  
}

/* Make the header menu a single horizontal row on phones while keeping content/order */
@media (max-width:768px) {
  /* Ensure logo stays above and menu becomes single-line */
  .top-nav .w{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    padding: 6px 8px !important;
  }

  /* Horizontal single-line menu with smooth scrolling if overflow */
  #topmeau{
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    justify-content:flex-start !important;
    gap: 8px !important;
    width:100% !important;
    padding:6px 8px !important;
    margin:0 !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch !important;
    box-sizing:border-box !important;
    white-space:nowrap !important;
  }

  /* Each menu item keeps its content, doesn't stretch vertically */
  #topmeau > li{
    flex: 0 0 auto !important;
    display:inline-block !important;
    width:auto !important;
    padding:6px 10px !important;
    border-top:none !important;
    margin:0 !important;
  }

  #topmeau > li a{
    display:inline-block !important;
    padding:6px 8px !important;
    color:#333 !important;
    font-size:15px !important;
    white-space:nowrap !important;
  }

  /* hide potential separators that make menu visually taller */
  #topmeau > li + li{ border-left: none !important; }

  /* reduce gaps on very small screens */
  @media (max-width:420px){
    #topmeau{ gap:6px !important; padding:6px 6px !important; }
    #topmeau > li a{ font-size:14px !important; padding:6px 6px !important; }
  }
}

/* For medium screens, gently relax the fixed wrapper */
@media (min-width:769px) and (max-width:1199px) {
  .w {
    width: 100% !important;
    max-width: 1124px !important;
    padding: 0 24px !important;
  }
}

/* Fix horizontal overflow caused by inline fixed widths or fixed attributes on small/medium screens */
@media (max-width:1199px) {
  /* Prevent page from being scrollable horizontally on narrow viewports */
  html, body {
    overflow-x: hidden !important;
  }

  /* Target common inline/style-fixed widths (e.g. width: 1124px) and force them to be fluid */
  [style*="width: 1124px"], [style*="width:1124px"], [style*="width: 100% 1124px"], [style*="width:1124"] {
    width: 100% !important;
    max-width: 100% !important;
    box-sizing: border-box !important;
  }

  /* Images or elements with width attributes that cause overflow */
  img[width], img[width="1124"], img[width="780"], img[width="963"], img[width="920"]{
    max-width: 100% !important;
    height: auto !important;
  }

  /* Also force any element with excessive fixed horizontal margin or negative margins to wrap */
  [style*="margin-left: 860px"], [style*="margin-left: 120px"], [style*="margin-left: 1124px"] {
    margin-left: 0 !important;
  }
}

/* Further tighten mobile top/header/menu styles — overrides for small screens */
@media (max-width:768px) {
  /* slim the top black bar */
  .top-topbg {
    padding: 6px 0 !important;
    background-color: #000 !important;
  }

  .top-topbg .top-tel{
    display:flex !important;
    align-items:center !important;
    justify-content:space-between !important;
    padding: 4px 12px !important;
    height: auto !important;
    line-height: 1 !important;
  }

  .top-topbg .pull-left, .top-topbg .pull-right{
    float:none !important;
    display:flex !important;
    align-items:center !important;
  }

  .top-topbg .pull-right ul{ margin:0; padding:0; list-style:none; display:flex; gap:8px; align-items:center; }
  .top-topbg .wximg{ display:none !important; }
  /* Hide the '关注微信' wx item on small screens */
  .top-topbg .wx{ display:none !important; }

  /* Hide entire top-topbg block on mobile as requested */
  .top-topbg{ display:none !important; }

  /* header/logo area */
  .top-nav .w{
    display:flex !important;
    flex-direction:column !important;
    align-items:center !important;
    padding: 6px 12px !important;
  }

  .top-nav .logo{
    width: 140px !important;
    max-width: 45% !important;
    height: auto !important;
    margin: 6px 0 !important;
    display:block !important;
  }

  /* keep menu visually similar to PC but compact: centered row with wrapping */
  #topmeau{
    display:flex !important;
    justify-content:center !important;
    flex-wrap:wrap !important;
    gap: 10px 24px !important;
    width:100% !important;
    padding:6px 0 !important;
    margin:0 !important;
    list-style:none !important;
    box-sizing:border-box !important;
  }

  #topmeau > li{
    float:none !important;
    width:auto !important;
    text-align:center !important;
    padding:6px 8px !important;
    box-sizing:border-box !important;
    border-top: none !important;
    margin-left:0 !important;
  }

  #topmeau > li a{
    display:inline-block !important;
    padding:6px 8px !important;
    color: #333 !important;
    font-size:15px !important;
    line-height:1 !important;
  }

  /* if still wrapped into many rows on very small screens, reduce gap */
  @media (max-width:420px){
    #topmeau{ gap:6px 12px !important; }
    #topmeau > li a{ font-size:14px !important; padding:6px 6px !important; }
  }

}

/* ===== 手机专用覆盖（仅作用于 <=768px），不修改模板，保留桌面样式 ===== */
@media (max-width:768px){
  /* 轮播/背景块：覆盖行内 height:614px，使图片在手机端按视口缩放 */
  .layui-carousel div[style*="height:614px"],
  .layui-carousel [style*="background"] {
    height: auto !important;
    min-height: 180px !important;
    max-height: 60vh !important;
    background-size: cover !important;
    background-position: center center !important;
  }

  /* 顶部导航：logo 左对齐，菜单为单行可横向滚动（内容和顺序不变） */
  .top-nav .w{
    display:flex !important;
    flex-direction:row !important;
    align-items:center !important;
    justify-content:space-between !important;
    padding:6px 10px !important;
    box-sizing:border-box !important;
  }

  .top-nav .logo{
    float:left !important;
    width:110px !important;
    max-width:140px !important;
    margin:0 10px 0 0 !important;
    flex:0 0 auto !important;
  }

  /* 强制菜单为横向不换行，允许横向滚动查看溢出项 */
  ul#topmeau, #topmeau.pull-left{
    display:flex !important;
    flex-direction:row !important;
    flex-wrap:nowrap !important;
    align-items:center !important;
    gap:8px !important;
    overflow-x:auto !important;
    -webkit-overflow-scrolling:touch !important;
    white-space:nowrap !important;
    margin:0 !important;
    padding:0 6px !important;
  }

  ul#topmeau > li{
    flex:0 0 auto !important;
    display:inline-block !important;
    width:auto !important;
    padding:6px 0 !important;
    margin:0 6px !important;
    border-top:none !important;
  }

  ul#topmeau > li a{
    white-space:nowrap !important;
    display:inline-block !important;
    padding:4px 6px !important;
    font-size:15px !important;
    color:#333 !important;
  }
}

/* ===== 追加：针对模板的补充手机端响应式覆盖（仅 <=768px） ===== */
@media (max-width:768px) {
  /* 使主容器完全流体 */
  .w { width:100% !important; max-width:100% !important; padding:0 12px !important; box-sizing:border-box !important; }

  /* 覆盖模板中可能存在的行内固定宽度（例如 width:1124px） */
  [style*="width: 1124px"], [style*="width:1124px"] {
    width:100% !important; max-width:100% !important; padding:0 !important; box-sizing:border-box !important;
  }

  /* 覆盖行内高度（轮播等） */
  .layui-carousel div[style*="height:614px"], .layui-carousel [style*="height:614px"] {
    height:auto !important; min-height:160px !important; background-size:cover !important; background-position:center center !important;
  }

  /* hero/cover 背景图块自适应高度 */
  .news-cover, .news-cover[style] {
    height:auto !important; min-height:120px !important; background-size:cover !important; background-position:center center !important; padding:20px 0 !important;
  }

  /* 图片/视频自适应 */
  img, .con-img, .con-one-img, .con-imgs, .three-img, .pull-left img { max-width:100% !important; width:100% !important; height:auto !important; display:block !important; }
  video { width:100% !important; height:auto !important; max-height:none !important; display:block !important; }

  /* 强制带 width 属性的图片流式化 */
  img[width], img[width="1124"], img[width="920"], img[width="963"], img[width="780"] { width:100% !important; height:auto !important; }

  /* 顶部导航在手机上垂直排列，菜单横向滚动 */
  .top-nav .w { display:flex !important; flex-direction:column !important; align-items:center !important; padding:8px !important; }
  .top-nav .logo { float:none !important; width:120px !important; max-width:140px !important; margin:0 0 8px 0 !important; }
  #topmeau, ul#topmeau.pull-left { display:flex !important; flex-direction:row !important; flex-wrap:nowrap !important; gap:0 !important; overflow-x:auto !important; -webkit-overflow-scrolling:touch !important; white-space:nowrap !important; width:100% !important; padding:0 !important; margin:0 !important; box-sizing:border-box !important; }
  #topmeau > li { flex:0 0 auto !important; display:inline-block !important; padding:6px 8px !important; margin:0 6px !important; }
  #topmeau > li a { font-size:15px !important; padding:6px 8px !important; }

  /* 隐藏顶部黑条以节省空间 */
  .top-topbg { display:none !important; }

  /* 文本换行，避免溢出 */
  .textRow, .tlist li { white-space:normal !important; overflow:visible !important; }

  /* 表单浮窗适配 */
  .layui-form-float { width:auto !important; max-width:100% !important; margin-left:0 !important; }

  /* 修正可能存在的大左边距导致溢出的情况 */
  [style*="margin-left: 860px"], [style*="margin-left: 1124px"], [style*="margin-left: 120px"] { margin-left:0 !important; }

  @media (max-width:420px) {
    #topmeau > li { width:50% !important; padding:6px 6px !important; }
    #topmeau { gap:6px !important; padding:6px 6px !important; }
    #topmeau > li a { font-size:14px !important; }
  }
}

/* 强制：在更末端再次覆盖，确保手机上 logo 与菜单处于同行并均匀展示，轮播高度缩小 */
@media (max-width:768px) {
  /* 将 header 行内布局改为行，logo 与菜单同行 */
  .top-nav .w{ display:flex !important; flex-direction:row !important; align-items:center !important; gap:8px !important; padding:6px 8px !important; }

  /* 缩小 logo，避免占据整行 */
  .top-nav .logo{ flex:0 0 auto !important; width:90px !important; max-width:90px !important; height:auto !important; margin:0 !important; }

  /* 让菜单容器占据剩余空间并靠右展示 */
  .top-nav .w > div{ flex:1 1 auto !important; display:flex !important; align-items:center !important; justify-content:flex-end !important; }

  /* 菜单：横向排列、均匀分配空间；在项太多时允许缩小文本而不换行 */
  #topmeau{ display:flex !important; flex-direction:row !important; flex-wrap:nowrap !important; align-items:center !important; justify-content:flex-end !important; gap:6px !important; overflow-x:auto !important; overflow-y:visible !important; -webkit-overflow-scrolling:touch !important; }
  #topmeau > li{ flex:0 1 auto !important; display:inline-flex !important; align-items:center !important; justify-content:center !important; padding:6px 8px !important; margin:0 4px !important; min-width:0 !important; }
  #topmeau > li a{ display:block !important; padding:4px 6px !important; font-size:14px !important; white-space:nowrap !important; text-overflow:ellipsis !important; overflow:hidden !important; }

  /* 当菜单项过多时允许整体缩小字体（尽量显示更多项） */
  @media (max-width:420px){
    #topmeau > li a{ font-size:13px !important; padding:4px 6px !important; }
    .top-nav .logo{ width:80px !important; max-width:80px !important; }
  }

  /* 轮播：减小高度，避免大量空白 (优先级高，以覆盖行内样式) */
  .layui-carousel, .layui-carousel [carousel-item], .layui-carousel div[style*="height:614px"], .layui-carousel div[style*="height: 614px"] {
    height: 18vh !important;
    max-height: 180px !important;
    min-height: 110px !important;
  }
  /* 轮播背景：手机端尝试显示完整图片，优先使用 contain 避免被裁切 */
  .layui-carousel div[style*="background"], .layui-carousel div[style*="background-image"]{
    background-size: contain !important;
    background-repeat: no-repeat !important;
    background-position: center center !important;
  }
  /* 但在图片高度受限时仍保证可视区域不太小 */
  .layui-carousel div[style*="height:614px"], .layui-carousel [style*="height:614px"]{ height:auto !important; min-height:120px !important; max-height:48vh !important; }
  .layui-carousel div[style] img, .layui-carousel div[style] { width:100% !important; height:auto !important; object-fit:contain !important; }
}

/* 最终保障：菜单使用剩余宽度、靠右显示并可横向滚动，避免被 logo 或 padding 截断 */
@media (max-width:768px) {
  .top-nav .w { align-items:center !important; display:flex !important; flex-direction:row !important; }
  .top-nav .w > img.logo { flex:0 0 auto !important; }
  .top-nav .w > div { flex:1 1 auto !important; margin-left:8px !important; display:flex !important; align-items:center !important; }
  /* menu 占用剩余空间并靠右，允许横向滚动显示全部项 */
  #topmeau { margin-left:auto !important; justify-content:flex-end !important; overflow-x:auto !important; -webkit-overflow-scrolling:touch !important; padding-right:12px !important; }
  /* 减小每项左右间距以显示更多项 */
  #topmeau > li { padding:6px 6px !important; margin:0 4px !important; min-width:0 !important; }
  /* 若仍显示不下，允许文字换行为两行（防止不可见） */
  #topmeau.force-wrap > li { white-space:normal !important; }
}

/* ===== 追加：.pull-left.course-tits 手机端响应式（仅 <=768px），尽量局部覆盖 ===== */
@media (max-width:768px) {
  /* 优先在 .cont-ten.course-cont 范围内应用，兼容未作用域的情况 */
  .cont-ten.course-cont .pull-left.course-tits,
  .pull-left.course-tits {
    float: none !important;
    display: block !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 8px 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
    text-align: center !important;
    clear: both !important;
  }

  /* 标题与元信息换行并全宽显示，防止被截断 */
  .cont-ten.course-cont .pull-left.course-tits .title,
  .pull-left.course-tits .title {
    display: block !important;
    width: 100% !important;
    font-size: 18px !important;
    line-height: 1.3 !important;
    white-space: normal !important;
    margin: 6px 0 !important;
    text-align: center !important;
  }

  .cont-ten.course-cont .pull-left.course-tits .meta,
  .pull-left.course-tits .meta {
    display: block !important;
    width: 100% !important;
    font-size: 13px !important;
    color: #666 !important;
    margin-top: 4px !important;
    text-align: center !important;
  }

  /* 内部图片或缩略图自适应：保持为小圆形图标，居中（避免占满整行） */
  .cont-ten.course-cont .pull-left.course-tits img,
  .pull-left.course-tits img {
    display: block !important;
    width: auto !important;
    max-width: 88px !important;
    height: auto !important;
    object-fit: cover !important;
    border-radius: 50% !important;
    margin: 6px auto !important;
  }

  /* 如果该模块原本使用两列，这里强制单列堆叠 */
  .cont-ten.course-cont .pull-left.course-tits + .pull-right,
  .cont-ten.course-cont .pull-left.course-tits ~ .pull-right,
  .pull-left.course-tits + .pull-right,
  .pull-left.course-tits ~ .pull-right {
    display: block !important;
    width: 100% !important;
    margin: 8px 0 0 0 !important;
    float: none !important;
    box-sizing: border-box !important;
  }

  @media (max-width:420px) {
    .cont-ten.course-cont .pull-left.course-tits,
    .pull-left.course-tits { margin: 6px 6px !important; }
    .cont-ten.course-cont .pull-left.course-tits .title,
    .pull-left.course-tits .title { font-size: 16px !important; }
  }
}

  /* ===== 强制：在手机上将 .pull-left.course-tits 内部图片和文字垂直堆叠 ===== */
  @media (max-width:768px) {
    /* 针对模块内作用域及通用选择器，优先级高以覆盖现有布局 */
    .cont-ten.course-cont .pull-left.course-tits,
    .pull-left.course-tits {
      display: flex !important;
      flex-direction: column !important;
      align-items: center !important;
      justify-content: flex-start !important;
      float: none !important;
      width: 100% !important;
      max-width: 100% !important;
      margin: 8px 0 !important;
      padding: 6px 0 !important;
      box-sizing: border-box !important;
      clear: both !important;
    }

    /* 使直接子元素占满宽度，避免与图片并排 */
    .cont-ten.course-cont .pull-left.course-tits > *,
    .pull-left.course-tits > * {
      display: block !important;
      width: 100% !important;
      max-width: 100% !important;
      box-sizing: border-box !important;
      margin: 0 !important;
      padding: 0 !important;
    }

    /* 图片/缩略图自适应并在文字上方居中（小图标样式） */
    .cont-ten.course-cont .pull-left.course-tits img,
    .pull-left.course-tits img,
    .cont-ten.course-cont .pull-left.course-tits .thumb,
    .pull-left.course-tits .thumb {
      display: block !important;
      width: auto !important;
      max-width: 88px !important;
      height: auto !important;
      object-fit: cover !important;
      border-radius: 0 !important;
      margin: 0 auto 10px auto !important;
    }

    /* 文字标题与描述居中、换行显示 */
    .cont-ten.course-cont .pull-left.course-tits .title,
    .pull-left.course-tits .title,
    .cont-ten.course-cont .pull-left.course-tits .text,
    .pull-left.course-tits .text,
    .cont-ten.course-cont .pull-left.course-tits .meta,
    .pull-left.course-tits .meta {
      width: 100% !important;
      text-align: center !important;
      white-space: normal !important;
      overflow: visible !important;
      margin: 4px 0 !important;
    }

    /* 如果存在并排的 .pull-right，强制其在手机上换行到下一行 */
    .cont-ten.course-cont .pull-left.course-tits + .pull-right,
    .pull-left.course-tits + .pull-right,
    .cont-ten.course-cont .pull-left.course-tits ~ .pull-right,
    .pull-left.course-tits ~ .pull-right {
      display: block !important;
      float: none !important;
      width: 100% !important;
      margin-top: 8px !important;
      box-sizing: border-box !important;
    }

    /* 极小屏幕微调 */
    @media (max-width:420px) {
      .cont-ten.course-cont .pull-left.course-tits { padding: 6px 8px !important; }
      .cont-ten.course-cont .pull-left.course-tits img,
      .pull-left.course-tits img { max-width: 100% !important; }
      .cont-ten.course-cont .pull-left.course-tits .title,
      .pull-left.course-tits .title { font-size: 15px !important; }
    }
  }




/* 明确两行头部：手机端（<=768px）logo 单独一行（居中且缩小），菜单在下一行并可换行显示，尽量不影响其他样式 */
@media (max-width:768px) {
  .top-nav .w {
    display: flex !important;
    flex-direction: column !important;
    align-items: center !important;
    justify-content: flex-start !important;
    gap: 6px !important;
    padding: 8px 12px !important;
    box-sizing: border-box !important;
  }

  /* logo 缩小并居中，清除 float/定位，单独成行 */
  .top-nav .logo, .top-nav img.logo {
    width: 96px !important;
    max-width: 110px !important;
    height: auto !important;
    display: block !important;
    margin: 6px auto !important;
    float: none !important;
    position: static !important;
    transform: none !important;
    clear: both !important;
    z-index: 10 !important;
  }

  /* 菜单下一行，占满宽度并允许换行以显示所有项（不强制横向滚动） */
  .top-nav .w > div, #topmeau {
    width: 100% !important;
    display: flex !important;
    flex-direction: row !important;
    flex-wrap: wrap !important;
    justify-content: center !important;
    gap: 8px !important;
    padding: 6px 8px !important;
    margin: 0 auto !important;
    box-sizing: border-box !important;
    clear: both !important;
  }

  #topmeau > li {
    display: inline-block !important;
    padding: 6px 8px !important;
    margin: 4px !important;
    min-width: 0 !important;
    box-sizing: border-box !important;
  }

  #topmeau > li a {
    white-space: normal !important;
    display: inline-block !important;
    text-align: center !important;
    font-size: 15px !important;
    padding: 4px 6px !important;
  }

  @media (max-width:420px) {
    .top-nav .logo { width:84px !important; max-width:96px !important; }
    #topmeau > li a { font-size:13px !important; padding:4px 6px !important; }
  }
}

/* ===== 追加：手机端专用 .cont-ten.course-cont 响应式样式（仅 <=768px） ===== */
@media (max-width:768px) {
  .cont-ten.course-cont {
    width: 100% !important;
    max-width: 100% !important;
    padding: 12px 12px !important;
    box-sizing: border-box !important;
    overflow: visible !important;
  }

  /* 将内部列表/项改为垂直流式布局，防止溢出与横向滚动 */
  .cont-ten.course-cont .course-list,
  .cont-ten.course-cont .course-items,
  .cont-ten.course-cont .course-item {
    display: flex !important;
    flex-direction: column !important;
    gap: 12px !important;
    align-items: stretch !important;
    width: 100% !important;
    max-width: 100% !important;
    margin: 0 !important;
  }

  /* 卡片/单项尺寸与图片自适应 */
  .cont-ten.course-cont .course-item {
    padding: 10px !important;
    background: transparent !important;
    border: none !important;
  }
  .cont-ten.course-cont img,
  .cont-ten.course-cont .thumb,
  .cont-ten.course-cont .course-thumb {
    width: 100% !important;
    max-width: 100% !important;
    height: auto !important;
    object-fit: cover !important;
    display: block !important;
  }

  /* 文本块、元信息全宽显示，避免被截断 */
  .cont-ten.course-cont .title,
  .cont-ten.course-cont .meta,
  .cont-ten.course-cont .excerpt {
    width: 100% !important;
    text-align: left !important;
    overflow: visible !important;
    white-space: normal !important;
  }

  /* 两栏布局在手机上强制成单列 */
  .cont-ten.course-cont .two-column,
  .cont-ten.course-cont .row,
  .cont-ten.course-cont .col {
    display: block !important;
    width: 100% !important;
    flex: none !important;
    margin: 0 !important;
    padding: 0 !important;
    box-sizing: border-box !important;
  }

  /* 进一步在极小屏幕微调间距 */
  @media (max-width:420px) {
    .cont-ten.course-cont { padding: 10px 8px !important; }
    .cont-ten.course-cont .course-item { padding: 8px !important; }
    .cont-ten.course-cont .title { font-size: 16px !important; }
  }
}



/* Contact top images — responsive (moved from contact.html inline style) */
.contact-top-images .img-row{
  display:flex;
  gap:12px;
  align-items:center;
  justify-content:center;
  margin:12px 0 18px;
  max-width:1124px;
  margin-left:auto;
  margin-right:auto;
  /* flex-wrap:wrap; */
}

.contact-info-wrap {
  width:100%;
  max-width:1124px;
  margin:0 auto 24px auto;
  display:flex;
  flex-direction:column;
  align-items:center;
  justify-content:center;
}

.contact-info-wrap .con-bott-box {
  margin-top:0;
  margin-bottom:12px;
}

.contact-top-images .ct-img{
  /* 固定尺寸，避免被父容器拉伸 */
  flex: 0 0 auto !important;
  width: 360px !important;
  height: 220px !important;
  max-width: 360px !important;
  object-fit: cover !important;
  border-radius: 8px !important;
  display: block !important;
}
@media (max-width:768px){
  .contact-top-images .img-row{flex-direction:column;gap:8px;max-width:420px;margin-left:auto;margin-right:auto;}
  .contact-top-images .ct-img{width:100%;height:140px;max-width:100%;}
  .contact-info-wrap {
    max-width:420px;
    padding:0 8px;
  }
  .contact-info-wrap .con-bott-box {
    margin-bottom:10px;
  }
}
@media (min-width:1200px){
  .contact-top-images .ct-img{height:220px;}
}

/* Contact info: unify layout and alignment */
.con-bott-box{display:flex;justify-content:center;width:100%;box-sizing:border-box;padding:6px 12px;}
.con-bott-left{max-width:720px;width:100%;text-align:center;box-sizing:border-box;}
/* 每项（电话/地址）单独一行，标签与内容同行 */
.contact-row{display:flex;flex-direction:column;gap:12px;align-items:center;flex-wrap:nowrap;width:100%;}
.contact-item{display:flex;flex-direction:row;align-items:center;gap:12px;box-sizing:border-box;width:100%;padding:6px 12px;}
.contact-item strong{display:inline-block;min-width:80px;text-align:right;font-weight:600;color:#222;}
.contact-item .phone-number{font-size:28px;color:#d64545;font-weight:700;margin-left:8px;}
.contact-item .phone-note{font-size:14px;color:#777;margin-left:8px;font-weight:400;}
.contact-item .address{color:#555;word-break:break-word;flex:1;text-align:left;margin-left:8px;}

@media (max-width:768px){
  .con-bott-box{padding:0 8px;}
  .con-bott-left{text-align:center;padding:0;}
  .contact-row{gap:10px;}
  .contact-item{flex-direction:row;justify-content:center;width:100%;}
  .contact-item strong{min-width:70px;text-align:right;font-size:16px;}
  .contact-item .phone-number{font-size:22px;margin-left:8px;}
  .contact-item .address{font-size:15px;text-align:center;margin-left:8px;}
}

/* 强制固定尺寸（高优先级，覆盖全局 img 规则） */
.contact-top-images .ct-img{
  width:360px !important;
  height:220px !important;
  max-width:360px !important;
  object-fit:cover !important;
  display:block !important;
}
@media (min-width:1400px){
  .contact-top-images .ct-img{width:420px !important;height:260px !important;max-width:420px !important;}
}
@media (max-width:768px){
  .contact-top-images .ct-img{
    width:320px !important;
    height:140px !important;
    max-width:320px !important;
  }
}