:root{
 --color-primary:#d60000;   /* 品牌红 */
 --color-dark:#111111;      /* 深黑 */
 --color-black:#000000;
 --color-white:#ffffff;
 --header-height:80px;
 --color-border:#ececec;
 --color-text:#333333;
 --color-muted:#8a8a8a;
 --color-bg:#f9f9f9;
 
     /* 11151115.com*/
    --text-secondary: #666666;
 	--text-light: #999999;
	--border-color: #eaeaea;
 
}
*{ box-sizing:border-box; }
body{
 color:#333;
 padding:0;
 margin:0;
 font-size:14px;
 font-family:'Microsoft YaHei','微软雅黑',Arial,sans-serif;
 background:#f9f9f9;
 -webkit-font-smoothing:antialiased;
}
a:link,a:visited,a:active{ color:#333; text-decoration:none; }
a:hover{ color:#d60000; }
ul,li{ list-style:none; padding:0; margin:0; }
form{ margin:0; padding:0; }
img{ border:none; max-width:100%; }
button{ font-family:inherit; cursor:pointer; }

.container{ max-width:1440px; margin:0 auto; padding:0 24px; }


/* ===== 顶栏 ===== */
.header{
  height:var(--header-height);
  background:var(--color-white);
  border-top:3px solid var(--color-primary);
  border-bottom:1px solid var(--color-border);
  position:sticky; top:0; z-index:10000;
}
.header-inner{ display:flex; align-items:center; height:100%; gap:32px; }
.logo{ display:flex; align-items:center; gap:10px; }
.logo-mark{
  width:148px; height:50px; flex-shrink:0; display:block; object-fit:contain;
}
.logo-text{ display:flex; flex-direction:column; line-height:1; }
.logo-text b{ font-size:18px; font-weight:800; color:var(--color-dark); letter-spacing:1px; }
.logo-text small{ font-size:9px; font-weight:600; letter-spacing:2.6px; color:var(--color-muted); margin-top:4px; }
.nav{ display:flex; gap:30px; margin-left:auto; }
.nav a{ font-size:14px; font-weight:500; padding:8px 2px; position:relative; }
.nav a:hover{ color:var(--color-primary); }
.nav a.active{ color:var(--color-primary); font-weight:700; }
.nav a.active::after{ content:""; position:absolute; left:0; right:0; bottom:-2px; height:2px; background:var(--color-primary); }

/* 导航下拉：hover 显示大分类 */
.nav-item{ position:relative; display:flex; align-items:center; }
/* 透明桥：Products 与下拉之间的整段区域都算悬停区（放 .nav-item 上，不会被下拉的 overflow 裁剪） */
.nav-item::after{ content:""; position:absolute; top:100%; left:-120px; right:-120px; height:16px; }
.nav-drop{
  position:absolute; top:100%; left:50%; transform:translateX(-50%);
  min-width:190px; background:var(--color-white); border:1px solid var(--color-border);
  border-radius:8px; box-shadow:0 8px 24px rgba(17,17,17,.08);
  padding:6px 0; display:none; z-index:120;
}
.nav-item:hover .nav-drop,
.nav-item:focus-within .nav-drop,
.nav-drop:hover{ display:block; }
.nav-drop::-webkit-scrollbar{ width:6px; }
.nav-drop::-webkit-scrollbar-thumb{ background:#d9d9d9; border-radius:3px; }
.nav-drop::-webkit-scrollbar-track{ background:transparent; }
.nav-drop .drop-cat{
  display:flex; align-items:center; justify-content:space-between; gap:16px;
  padding:9px 16px; font-size:14px; color:var(--color-dark); white-space:nowrap;
}
.nav-drop .drop-cat:hover{ color:var(--color-primary); background:#fafafa; }
.nav-drop .drop-arrow{
  width:6px; height:6px; border-top:1.5px solid #999; border-right:1.5px solid #999;
  transform:rotate(45deg); margin-left:14px; flex:none; transition:border-color .2s;
}
.nav-drop .drop-cat:hover .drop-arrow{ border-color:var(--color-primary); }
.drop-cat.active{ color:var(--color-primary); }
.sub-drop a.active{ color:var(--color-primary); font-weight:600; }
.drop-cat-wrap{ position:relative; }
.sub-drop{
  display:none; position:absolute; left:100%; top:-6px;
  min-width:170px; background:var(--color-white); border:1px solid var(--color-border);
  border-radius:8px; box-shadow:0 8px 24px rgba(17,17,17,.10);
  padding:6px 0; z-index:121;
}
.drop-cat-wrap:hover .sub-drop{ display:block; }
.sub-drop a{
  display:block; padding:8px 16px; font-size:13px; color:#666; white-space:nowrap;
  font-weight:400;
}
.sub-drop a:hover{ color:var(--color-primary); background:#fafafa; }
.btn-quote{
  background:var(--color-primary); color:#fff; font-weight:600; font-size:14px;
  padding:10px 20px; border-radius:4px; transition:background .2s; white-space:nowrap;
}
.btn-quote:hover{ background:#b00000; color:#fff; }
.lang-wrap{ position:relative; display:flex; align-items:center; }
.lang-wrap::after{ content:""; position:absolute; top:100%; left:-10px; right:-10px; height:14px; }
.lang-btn{
  display:flex; align-items:center; gap:8px;
  background:#fff; border:1px solid var(--color-border); border-radius:4px;
  padding:7px 12px; font-size:14px; color:#333; cursor:pointer;
  transition:border-color .2s, color .2s;
}
.lang-btn:hover{ border-color:var(--color-primary); color:var(--color-primary); }
.lang-flag-img{ width:24px; height:auto; border-radius:2px; display:block; }
.lang-code{ font-size:14px; line-height:1; }
.lang-arrow{
  display:inline-block; width:6px; height:6px; margin-left:2px;
  border-right:1.5px solid #999; border-bottom:1.5px solid #999;
  transform:rotate(45deg) translateY(-2px);
}
.lang-drop{
  position:absolute; top:calc(100% + 10px); right:0;
  min-width:180px; background:var(--color-white); border:1px solid var(--color-border);
  border-radius:8px; box-shadow:0 8px 24px rgba(17,17,17,.10);
  padding:6px 0; display:none; z-index:130;
}
.lang-wrap:hover .lang-drop{ display:block; }
.lang-drop a{
  display:flex; align-items:center; gap:10px;
  padding:8px 16px; font-size:14px; color:#333;
}
.lang-drop a:hover{ color:var(--color-primary); background:#fafafa; }
.lang-flag-img-wrap{ width:24px; flex:none; display:flex; align-items:center; }
.lang-text{ line-height:1; }
.lang-check{ margin-left:auto; color:var(--color-primary); font-size:12px; font-weight:700; }
.lang-drop a.lang-selected{ color:var(--color-primary); font-weight:600; }
.lang-old{ font-size:13px; color:#999; }
.lang-divider{ height:1px; background:var(--color-border); margin:6px 0; }
.menu-btn{
  display:none; width:40px; height:40px; border:1px solid var(--color-border);
  background:#fff; border-radius:6px; align-items:center; justify-content:center; color:var(--color-dark);
}


/* ===== 页脚 ===== */
.footer{ background:var(--color-dark); color:#9a9a9a; padding:26px 0; }
.footer-inner{ display:flex; align-items:center; justify-content:space-between; gap:12px; flex-wrap:wrap; }
.footer p{ margin:0; font-size:13px; }
.footer-links{ display:flex; gap:10px; }
.footer-links a{ color:#cfcfcf; }
.footer-links a:hover{ color:var(--color-primary); }

@media (max-width:768px){
  html{ overflow-x:hidden; }
  body{ overflow-x:hidden; }
  html, body{ overflow-x:clip; }
  .container{ padding:0 16px; }
  .header-inner{ gap:12px; }
  .menu-btn{ display:flex; }
  .nav{ display:none; }
  .btn-quote{ display:none; }
  .logo-text b{ font-size:16px; }
  .logo-mark{ width:48px; height:48px; }
  .footer-inner{ justify-content:center; text-align:center; }
}


body,td,th {
	font-family: "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
}





/* 分页*/
.page {
    margin: 30px auto;
    padding: 10px 0;
    font-size: 12px;
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    align-items: center;
    gap: 6px; /* 替代原来margin-right:6px，彻底摆脱float */
}

.page span,
.page a {
    display: inline-flex;
    justify-content: center;
    align-items: center;
    min-width: 30px;
    min-height: 30px;
    padding: 0 8px; /* 文字多的时候自动加宽，防止文字溢出 */
    line-height: 1;
    border: 1px solid var(--border-color);
    border-radius: 4px;
    transition: all var(--transition-speed) ease;
}

/* 普通不可点击（禁用状态：上一页/下一页无数据时） */
.page span {
    color: var(--text-light);
    background-color: #f7f7f7;
    cursor: not-allowed;
}

/* 当前激活页码 */
.page span.active {
    background: var(--color-primary);
    border-color: var(--color-primary);
    font-weight: bold;
    color: #ffffff;
    cursor: default;
}

/* 可点击链接hover效果 */
.page a {
    color: var(--text-secondary);
}
.page a:hover {
    background-color: var(--color-primary);
    border-color: var(--color-primary);
    color: #fff;
    text-decoration: none;
}

/* 统计文字：共xx条，取消固定宽度，适配文字 */
.page .p0 {
    min-width: auto;
    border-color: var(--color-primary);
    color: var(--text-main);
    background-color: #fff;
    cursor: default;
}
.page .p0 b{
    color:var(--color-primary);
}

/* 首页、尾页、上一页、下一页，移除固定写死宽度，靠padding自适应 */
.page .p1,
.page .p2 {
    min-width: auto;
}

.page .p3 {
    display: none;
}

/* 移动端分页适配 */
@media (max-width:768px) {
    .page {
        gap:4px;
    }
    .page span,
    .page a {
        min-height:28px;
        min-width:28px;
        padding:0 6px;
        font-size:11px;
    }
}

/* ===== About 页 ===== */
.about-hero{ text-align:center; padding:48px 0 32px; }
.about-hero h1{ font-size:32px; color:var(--color-dark); margin:0 0 8px; font-weight:700; }
.about-hero .accent{ color:var(--color-primary); }
.about-slogan{ color:var(--color-primary); font-size:16px; letter-spacing:.5px; margin:0 0 16px; font-weight:500; }
.about-hero .about-desc{ color:var(--text-secondary); max-width:640px; margin:0 auto 24px; line-height:1.8; }
.about-hero-actions{ display:flex; gap:12px; justify-content:center; flex-wrap:wrap; }


.hero-banner .btn-outline{ border-color:var(--color-white); color:var(--color-white); }
.hero-banner .btn-outline:hover{ border-color:var(--color-primary); color:var(--color-white); }
/* Contact 页横幅 */
.contact-hero, .hero-banner{
  text-align:center; padding:76px 24px; color:var(--color-white);
  position:relative; margin:0 -24px;
  background-size:cover; background-position:center; background-repeat:no-repeat;
}
.contact-hero{ background-image:url(/images/contact-hero.jpg); }
.hero-banner{ background-image:url(/images/about-banner.jpg); }
.contact-hero::before, .hero-banner::before{ content:""; position:absolute; left:0; top:0; right:0; bottom:0; background:rgba(17,17,17,.32); }
.contact-hero-inner, .hero-banner-inner{ position:relative; z-index:1; }
.contact-hero h1, .hero-banner h1{ font-size:36px; margin:0 0 10px; color:var(--color-white); font-weight:700; }
.contact-hero .accent, .hero-banner .accent{ color:#ff7070; }
.contact-hero .about-slogan, .hero-banner .about-slogan{ color:var(--color-white); }
.contact-hero .about-desc, .hero-banner .about-desc{ color:rgba(255,255,255,.92); }
@media (max-width:768px){
  .contact-hero, .hero-banner{ padding:52px 16px; }
  .contact-hero h1, .hero-banner h1{ font-size:26px; }
}
.about-hero-actions .btn{ min-width:200px; } /* 固定最小宽度，hover 加粗时不撑大 */
.btn{ display:inline-flex; align-items:center; justify-content:center; padding:10px 28px; border-radius:4px; font-size:14px; font-weight:500; border:1px solid transparent; }
a.btn-dark{ background:var(--color-primary); color:var(--color-white); }
a.btn-dark:hover{ background:var(--color-primary); color:var(--color-white); font-weight:bold; }
a.btn-outline{ border-color:var(--color-dark); color:var(--color-dark); background:transparent; }
a.btn-outline:hover{ border-color:var(--color-primary); color:var(--color-primary); }
.about-section{ padding:36px 0; border-top:1px solid var(--color-border); }
.about-title{ font-size:20px; color:var(--color-dark); margin:0 0 36px; padding-left:12px; border-left:3px solid var(--color-primary); }
.about-sub{ color:var(--text-muted); font-size:13px; margin:0 0 14px; }
.about-text{ color:#555; line-height:1.9; font-size:16px; }
.about-grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:16px; }
.value-card{ background:var(--color-white); border:1px solid var(--color-border); border-radius:6px; padding:20px 18px; }
.value-card .value-num{ font-size:26px; font-weight:700; color:var(--color-primary); line-height:1; }
.value-card h3{ font-size:15px; color:var(--color-dark); margin:8px 0 6px; }
.value-card p{ font-size:12px; color:#777; line-height:1.7; margin:0; }
.about-pcats{ display:flex; flex-wrap:wrap; gap:10px; }
.about-pcat{ padding:8px 16px; border:1px solid var(--color-border); border-radius:4px; color:#555; background:var(--color-white); font-size:13px; }
.about-pcat:hover{ border-color:var(--color-primary); color:var(--color-primary); }
.about-contact{ display:grid; grid-template-columns:repeat(2,1fr); gap:12px; max-width:760px; margin:0 auto; }

/* Contact 页：联系人卡片 */
.contact-section .about-title{ text-align:center; border-left:none; padding-left:0; }
.contact-cards{ display:flex; gap:24px; justify-content:center; flex-wrap:wrap; margin-bottom:30px; }
.person-card{ width:300px; background:var(--color-white); border:1px solid var(--color-border); border-radius:8px; padding:28px 24px; text-align:center; transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.person-card:hover{ transform:translateY(-4px); box-shadow:0 10px 24px rgba(17,17,17,.10); border-color:var(--color-primary); }
.person-avatar{ width:88px; height:88px; border-radius:50%; overflow:hidden; margin:0 auto 14px; border:3px solid var(--color-primary); background:#f2f2f2; }
.person-avatar img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .25s ease; }
.person-card:hover .person-avatar img{ transform:scale(1.08); }
.person-card:hover .person-name{ color:var(--color-primary); }
.person-name{ font-size:16px; color:var(--color-dark); margin:0 0 12px; font-weight:600; }
.person-list{ list-style:none; padding:0; margin:0; }
.person-list li{ display:flex; justify-content:space-between; gap:10px; font-size:13px; color:#555; padding:7px 0; border-top:1px dashed var(--color-border); text-align:left; }
.person-list li:first-child{ border-top:none; }
.person-list .k{ color:var(--color-dark); font-weight:600; flex-shrink:0; }
.person-list a{ color:var(--color-primary); }
.contact-shared{ margin-top:6px; }
.about-contact .c-item{ display:flex; gap:10px; font-size:13px; color:#555; line-height:1.8; justify-content:center; }
.about-contact .c-label{ color:var(--color-dark); font-weight:600; min-width:60px; }
@media (max-width:768px){
  .about-hero h1{ font-size:24px; }
  .about-grid{ grid-template-columns:repeat(2,1fr); }
  .about-contact{ grid-template-columns:1fr; }
}
@media (max-width:480px){
  .about-grid{ grid-template-columns:1fr; }
}


/* ===== News ===== */
.news-hero{ background-image:url(/images/news-hero.jpg); }
.news-section{ padding:36px 0; }
.news-list{ display:flex; flex-direction:column; gap:20px; }
.news-item{ display:flex; gap:20px; background:var(--color-white); border:1px solid var(--color-border); border-radius:6px; padding:16px; transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.news-item:hover{ transform:translateY(-4px); box-shadow:0 10px 24px rgba(17,17,17,.10); border-color:var(--border-color); }
.news-img{ flex:0 0 220px; height:150px; overflow:hidden; border-radius:4px; }
.news-img img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .3s ease; }
.news-item:hover .news-img img{ transform:scale(1.05); }
.news-info{ flex:1; min-width:0; }
.news-info h3{ font-size:17px; margin:0 0 6px; font-weight:600; }
.news-info h3 a:hover{ color:var(--color-primary); }
.news-item:hover .news-info h3 a{ color:var(--color-primary); }
.news-date{ font-size:12px; color:var(--color-muted); margin:0 0 8px; }
.news-desc{ color:#555; line-height:1.7; font-size:13px; margin:0 0 10px; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; }
.news-more{ display:inline-block; color:var(--color-primary); font-size:13px; border-bottom:1px solid var(--color-primary); padding-bottom:1px; }
.news-more:hover{ color:var(--color-dark); border-color:var(--color-dark); }
@media (max-width:768px){
  .news-item{ flex-direction:column; }
  .news-img{ flex:none; width:100%; height:180px; }
}


/* ===== 提示条（data-toast） ===== */
.toast{
  position:fixed; left:50%; bottom:36px; transform:translateX(-50%) translateY(20px);
  background:var(--color-dark); color:var(--color-white); font-size:13px;
  padding:10px 20px; border-radius:6px; opacity:0; pointer-events:none;
  transition:all .25s; z-index:300; max-width:80vw; text-align:center;
}
.toast.show{ opacity:1; transform:translateX(-50%) translateY(0); }


/* ===== Home Banner ===== */
.banner-slider{ position:relative; overflow:hidden; }
.banner-slider .bd{ position:relative; height:0; padding-bottom:26.04%; }
.banner-slider .bd ul{ position:relative; margin:0; }
.banner-slider .bd li{ position:absolute; left:0; top:0; width:100%; }
.banner-slider .bd li a{ display:block; width:100%; }
.banner-slider .bd img{ width:100%; display:block; }
.banner-slider .hd{ position:absolute; left:0; right:0; bottom:16px; text-align:center; z-index:6; }
.banner-slider .hd ul{ display:inline-block; }
.banner-slider .hd ul li{ display:inline-block; width:9px; height:9px; border-radius:50%; background:rgba(27,38,53,.28); margin:0 4px; cursor:pointer; font-size:0; line-height:0; }
.banner-slider .hd ul li.on{ background:var(--color-primary); }
.banner-slider .prev,.banner-slider .next{ position:absolute; top:50%; transform:translateY(-50%); width:40px; height:40px; border:0; border-radius:50%; background:rgba(27,38,53,.30); color:var(--color-white); font-size:18px; line-height:1; cursor:pointer; z-index:6; display:flex; align-items:center; justify-content:center; text-decoration:none; opacity:0; visibility:hidden; }
.banner-slider:hover .prev,.banner-slider:hover .next{ opacity:1; visibility:visible; }
.banner-slider .prev:hover,.banner-slider .next:hover{ background:var(--color-primary); }
.banner-slider .prev{ left:16px; }
.banner-slider .next{ right:16px; }
@media (max-width:768px){
  .banner-slider .bd{ height:38vw; padding-bottom:0; }
  .banner-slider .bd ul{ position:relative; width:100%; height:100%; }
  .banner-slider .bd li{ position:absolute; left:0; top:0; width:100%; height:100%; }
  .banner-slider .bd li a{ display:block; width:100%; height:100%; }
  .banner-slider .bd img{ width:100%; height:100%; object-fit:cover; object-position:center; display:block; }
}
.home-section{ padding:36px 0; }
.spec-block h3{ font-size:16px; color:var(--color-dark); margin:0 0 12px; padding-left:10px; border-left:3px solid var(--color-primary); }
.spec-list{ display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:8px 24px; margin:0 0 20px; }
.spec-list li{ display:flex; padding:8px 0; border-bottom:1px dashed var(--color-border); font-size:13px; color:#555; }
.spec-list li span{ flex:0 0 132px; color:var(--color-dark); font-weight:600; }
.home-desc{ color:#555; line-height:1.9; font-size:14px; margin:0 0 14px; }
.home-usage{ display:grid; grid-template-columns:1fr 1fr; gap:16px; margin-top:20px; }
.usage-block{ background:var(--color-white); border:1px solid var(--color-border); border-radius:6px; padding:18px; }
.usage-block h3{ font-size:15px; color:var(--color-dark); margin:0 0 8px; }
.usage-block p{ color:#555; line-height:1.8; font-size:13px; margin:0; }
@media (max-width:768px){
  .banner-caption{ left:16px; right:16px; max-width:none; }
  .banner-caption h2{ font-size:22px; }
  .banner-caption p{ font-size:12px; }
  .spec-list{ grid-template-columns:1fr; }
  .spec-list li span{ flex-basis:110px; }
  .home-usage{ grid-template-columns:1fr; }
}

/* ===== Home Sections ===== */
.section-head{ display:flex; align-items:baseline; justify-content:space-between; gap:16px; margin-bottom:22px; }
.section-title{ font-size:24px; font-weight:800; color:var(--color-dark); margin:0; padding-left:12px; border-left:4px solid var(--color-primary); letter-spacing:.5px; }
.section-more{ font-size:13px; color:var(--color-muted); white-space:nowrap; }
.section-more:hover{ color:var(--color-primary); }

/* Featured Products（复用 product.css 卡片） */
.hp-products .product-grid{ margin:0; }
.hp-products .card{ background:var(--color-white); border:1px solid var(--color-border); border-radius:6px; overflow:hidden; display:flex; flex-direction:column; transition:transform .25s ease, box-shadow .25s ease; }
.hp-products .card:hover{ transform:translateY(-4px); box-shadow:0 10px 24px rgba(17,17,17,.10); }
.hp-products .card-name{ padding:12px 14px 16px; display:block; }
.hp-products .card:hover .card-name{ color:var(--color-primary); }

/* Why Choose Us */
.why-section{ background:var(--color-white); border-top:1px solid var(--color-border); border-bottom:1px solid var(--color-border); }
.why-grid{ display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:20px; }
.why-item{ padding:24px 20px; border:1px solid var(--color-border); border-radius:6px; background:#fcfcfc; transition:transform .25s ease, box-shadow .25s ease, border-color .25s ease; }
.why-item:hover{ transform:translateY(-4px); box-shadow:0 8px 20px rgba(17,17,17,.08); border-color:rgba(214,0,0,.35); }
.why-num{ font-size:30px; font-weight:800; color:var(--color-primary); line-height:1.1; margin-bottom:10px; }
.why-item h3{ font-size:15px; font-weight:700; color:var(--color-dark); margin:0 0 8px; }
.why-item p{ font-size:13px; color:var(--color-muted); line-height:1.7; margin:0; }

/* Latest News 首页 */
.home-news-list{ border-top:1px solid var(--color-border); }
.home-news-item{ display:flex; align-items:center; gap:18px; padding:14px 4px; border-bottom:1px solid var(--color-border); }
.home-news-item:hover .home-news-title{ color:var(--color-primary); }
.home-news-item:hover .home-news-arrow{ color:var(--color-primary); transform:translateX(3px); }
.home-news-date{ flex:0 0 92px; font-size:12px; color:var(--color-muted); font-variant-numeric:tabular-nums; }
.home-news-title{ flex:1; min-width:0; font-size:14px; color:var(--color-dark); overflow:hidden; text-overflow:ellipsis; white-space:nowrap; transition:color .2s; }
.home-news-arrow{ flex:0 0 auto; color:#bbb; transition:transform .2s ease, color .2s ease; }

@media (max-width:768px){
  .hp-products .cols-4{ grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
  .why-grid{ grid-template-columns:repeat(2,minmax(0,1fr)); }
  .home-news-date{ flex-basis:80px; }
}
@media (max-width:480px){
  .why-grid{ grid-template-columns:1fr; }
}

/* About Us 首页 + About 页 Who We Are 图文 */
.about-who{ display:flex; gap:32px; align-items:flex-start; }
.about-who-text{ flex:1; min-width:0; }
.about-who-img{ flex:0 0 44%; }
.about-who-img img{ width:100%; display:block; border-radius:6px; }
.hp-about-body{ display:flex; gap:36px; align-items:center; }
.hp-about-img{ flex:0 0 calc(38% - 60px); }
.hp-about-img img{ width:100%; height:320px; object-fit:cover; object-position:center; display:block; border-radius:6px; }
.hp-about-text p{ color:#555; line-height:1.9; font-size:14px; margin:0 0 18px; }
@media (max-width:768px){
  .about-who{ flex-direction:column; }
  .about-who-img{ flex:none; width:100%; }
  .hp-about-body{ flex-direction:column; }
  .hp-about-img{ flex:none; width:100%; }
}

/* About 纯图横幅 */
.hero-banner-plain{ display:flex; align-items:center; justify-content:center; height:420px; padding:0 24px; }
.hero-banner-plain::before{ display:none; }
@media (max-width:768px){
  .hero-banner-plain{ height:240px; padding:0 16px; }
}

/* ===== Crumb（全站面包屑） ===== */
.crumb{ font-size:14px; color:var(--color-muted); margin:20px 0 16px; }
.crumb span{ margin:0 6px; color:#ccc; }
.crumb-pos{ font-weight:400; color:var(--color-muted); }
.crumb-home:link,.crumb-home:visited,.crumb-home:active{ color:var(--color-primary); font-weight:700; }
.crumb-cur{ font-weight:400; color:#555; }

/* ===== News Cards ===== */
.news-grid{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; margin-top:24px; }
.news-card{ background:#fff; border:1px solid var(--color-border); border-radius:8px; overflow:hidden; display:flex; flex-direction:column; transition:transform .28s ease, box-shadow .28s ease, border-color .28s ease; min-width:0; }
.news-card:hover{ transform:translateY(-6px); box-shadow:0 14px 30px rgba(17,17,17,.14); border-color:var(--color-primary); }
.news-card-img{ display:block; aspect-ratio:16/9; overflow:hidden; background:#eee; }
.news-card-img img{ width:100%; height:100%; object-fit:cover; display:block; transition:transform .4s ease; }
.news-card:hover .news-card-img img{ transform:scale(1.06); }
.news-card-body{ padding:14px 16px 16px; display:flex; flex-direction:column; flex:1; }
.news-card-title{ font-size:16px; font-weight:700; color:var(--color-dark); margin:0 0 6px; line-height:1.45; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical; overflow:hidden; overflow-wrap:break-word; word-break:break-word; }
.news-card-title a{ color:inherit; transition:color .25s ease; }
.news-card-title a:hover{ color:var(--color-primary); }
.news-card:hover .news-card-title a{ color:var(--color-primary); }
.news-card-date{ font-size:12px; color:var(--color-muted); margin:0 0 10px; }
.news-card-desc{ font-size:13px; color:#666; line-height:1.7; margin:0 0 14px; display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden; flex:1; overflow-wrap:break-word; word-break:break-word; min-width:0; }
.news-card-more{ font-size:13px; color:var(--color-primary); font-weight:600; display:inline-block; transition:color .25s ease, transform .25s ease; }
.news-card-more:hover{ color:var(--color-primary); }
.news-card:hover .news-card-more{ color:var(--color-primary); transform:translateX(4px); }

/* ===== News Show ===== */
.news-show{ max-width:880px; margin:6px auto 0; background:#fff; border:1px solid var(--color-border); border-radius:10px; padding:32px 38px; }
.news-show-title{ font-size:26px; font-weight:800; color:var(--color-dark); margin:0 0 10px; line-height:1.4; }
.news-show-date{ font-size:13px; color:var(--color-muted); margin:0 0 22px; padding-bottom:14px; border-bottom:1px solid #eee; }
.news-show-img{ margin:0 0 22px; border-radius:8px; overflow:hidden; }
.news-show-img img{ width:100%; display:block; aspect-ratio:16/9; object-fit:cover; }
.news-show-content{ color:#555; line-height:1.9; font-size:14px; }
.news-show-content img{ max-width:100%; height:auto; }
.news-show-back{ margin-top:26px; }
.news-none{ padding:80px 0; text-align:center; color:var(--color-muted); }

/* 首页新闻横滑 */
.hp-news-track{ display:grid; grid-template-columns:repeat(3,1fr); gap:22px; }
@media (max-width:768px){
  .news-grid{ grid-template-columns:1fr; }
  .news-show{ padding:18px 16px; }
  .hp-news-track{ grid-template-columns:repeat(3,78%); overflow-x:auto; scroll-snap-type:x mandatory; -webkit-overflow-scrolling:touch; padding-bottom:8px; }
  .hp-news-track .news-card{ scroll-snap-align:start; }
  .hp-news-track::-webkit-scrollbar{ height:0; }
}

/* ===== 手机版导航菜单 ===== */
.m-menu{
  position:fixed; top:0; left:0; bottom:0; width:min(80vw,300px); z-index:10110;
  background:var(--color-white); box-shadow:0 0 40px rgba(0,0,0,.18);
  transform:translateX(-105%); transition:transform .28s ease;
  display:flex; flex-direction:column;
}
.m-menu.open{ transform:translateX(0); }
.m-menu-head{ display:flex; align-items:center; justify-content:space-between; padding:14px 16px; border-bottom:1px solid var(--color-border); }
.m-menu-title{ font-size:16px; font-weight:700; color:var(--color-dark); }
.m-menu-close{ background:none; border:none; font-size:22px; line-height:1; color:#999; cursor:pointer; padding:2px 6px; }
.m-menu-close:hover{ color:var(--color-primary); }
.m-nav{ flex:1; overflow-y:auto; padding:6px 0 20px; }
.m-link{ display:block; padding:13px 18px; font-size:15px; color:#333; border-bottom:1px solid #f1f1f1; }
.m-link:hover{ color:var(--color-primary); }
.m-row{ display:flex; align-items:center; border-bottom:1px solid #f1f1f1; }
.m-row .m-link{ flex:1; border-bottom:none; }
.m-toggle{
  width:46px; height:46px; border:none; background:none; cursor:pointer; flex:none; position:relative;
}
.m-toggle::after{
  content:""; position:absolute; left:50%; top:50%; width:8px; height:8px;
  border-right:2px solid #999; border-bottom:2px solid #999;
  transform:translate(-50%,-60%) rotate(45deg); transition:transform .2s;
}
.m-toggle.open::after{ transform:translate(-50%,-40%) rotate(-135deg); }
.m-sub{ display:none; background:#f7f7f7; }
.m-sub .m-link{ padding-left:18px; font-size:14px; }
.m-sub .m-sub .m-link{ padding-left:30px; }
.m-sub > .m-group > .m-row > .m-link{ color:var(--color-dark); }
.m-sub .m-sub{ border-left:1px solid #e2e2e2; margin-left:22px; }
.m-sub .m-sub .m-link{
  color:#666; font-weight:400; position:relative;
  padding-top:8px; padding-bottom:8px; border-bottom:none;
}
.m-sub .m-sub .m-link::before{
  content:""; position:absolute; left:0; top:50%; width:20px; height:1px; background:#e2e2e2;
}
.m-link.active{ color:var(--color-primary); font-weight:700; }
.m-backdrop{
  position:fixed; inset:0; background:rgba(0,0,0,.45); z-index:10100;
  opacity:0; pointer-events:none; transition:opacity .28s;
}
.m-backdrop.show{ opacity:1; pointer-events:auto; }
@media (min-width:769px){ .m-menu, .m-backdrop{ display:none; } }




	/* 底部聊天start*/
	#tabBar ul,#tabBar li{ list-style:none; padding:0; margin:0;
	}
	#tabBar img{ vertical-align:middle;
	}
	#tabBar .pull-left{ float:left;
	}
	#tabBar .text-center{ text-align:center;
	}
	#tabBar{ position: fixed; right:20px; bottom:20px; z-index: 99; width:50px; height: 50px;}
	#tabBar.active{ width: calc(100% - 40px); animation: tabBarAnimation 3s 1s infinite linear; -webkit-animation: tabBarAnimation 3s 1s infinite linear; -moz-animation: tabBarAnimation 3s 1s infinite linear; -o-animation: tabBarAnimation 3s 1s infinite linear;  }
	#tabBar .clickbtn{ position: absolute; right: 0; bottom: 0; z-index: 2; width:50px; height:50px; font-size: 0; line-height: 50px; background: rgba(255,255,255,0.8); border-radius: 50%; }
	#tabBar .clickbtn span{ display: block; position: absolute; left: 0; top: 0; z-index: 1; width: 100%; height: 100%; opacity: 0; }
	#tabBar .clickbtn img{ width: 22px; }
	#tabBar .clickbtn.on{ animation:clickbtnAnimation 10s 0s infinite linear; -moz-animation:clickbtnAnimation 10s 0s infinite linear; -webkit-animation:clickbtnAnimation 10s 0s infinite linear; -o-animation:clickbtnAnimation 10s 0s infinite linear; box-shadow: 0 3px 5px rgba(0,0,0,0.5); }
	#tabBar .clickbtn.on:before{ content: ""; position: absolute; left: 0; bottom: -5px; z-index: 1; width: 20px; height: 5px;}
	#tabBar .clickbtn.active{ background:url(/images/tabBar/xian2.png) #9fc43e; background-size: 100% 100%; }
	#tabBar .clickbtn.active:before{ content: ""; position: absolute; left: 0; top: 0; z-index: 2; width: 100%; height: 100%; border:solid 1px rgba(255,255,255,0.2); border-radius: 50%; }
	#tabBar .clickbtn.active > img{ opacity: 0; }
	#tabBar .clickbtn.active span{ opacity: 1; }
	#tabBar .navigation{ position: absolute; left:calc(100% - 100px); bottom: 0; z-index: 1; width:0; height: 50px; border-radius: 25px; transition: all 0.3s;}
	#tabBar .navigation:before{ content: ""; position: absolute; left: 0; top: 0; z-index: 1; width: 100%; height: 100%; border-radius: 25px; 
background:-moz-linear-gradient(left,rgba(255,255,255,0.8) 0%,rgba(255,255,255,0.6) 100%);background:-webkit-linear-gradient(left,rgba(255,255,255,0.8) 0%,rgba(255,255,255,0.6) 100%);background:linear-gradient(to right,rgba(255,255,255,0.8) 0%,rgba(255,255,255,0.6) 100%);filter:progid:DXImageTransform.Microsoft.gradient( startColorstr='#ccffffff',endColorstr='#99ffffff',GradientType=1 );}
	#tabBar .navigation ul{ position: relative; z-index: 2; padding: 0 60px 0 20px; }
	#tabBar .navigation ul li{ width: calc(100% / 3); font-size: 0; width: calc(100% / 2);}
	#tabBar .navigation ul li a{ position: relative; left: 10px; display: inline-block; vertical-align: top; line-height: 50px;opacity: 0; }
	#tabBar .navigation ul li a .tab-icon{ margin-right: 5px; }
	#tabBar .navigation ul li a .tab-icon img{ width: 22px; }
	#tabBar .navigation ul li a .tab-title{ font-size: 12px;color: #333; }
	#tabBar .navigation.active{ box-shadow: 5px 5px 10px rgba(0,0,0,0.2); animation: navigationAnimation 0.5s 0s linear forwards; -webkit-animation: navigationAnimation 0.5s 0s linear forwards; -moz-animation: navigationAnimation 0.5s 0s linear forwards; -o-animation: navigationAnimation 0.5s 0s linear forwards; }
	#tabBar .navigation.active ul li:nth-child(1) a{animation:navigationAAnimation 0.3s 0.5s linear forwards; -webkit-animation:navigationAAnimation 0.3s 0.5s linear forwards; -moz-animation:navigationAAnimation 0.3s 0.5s linear forwards; -o-animation:navigationAAnimation 0.3s 0.5s linear forwards; }
	#tabBar .navigation.active ul li:nth-child(2) a{animation:navigationAAnimation 0.3s 0.6s linear forwards; -webkit-animation:navigationAAnimation 0.3s 0.6s linear forwards; -moz-animation:navigationAAnimation 0.3s 0.6s linear forwards; -o-animation:navigationAAnimation 0.3s 0.6s linear forwards; }
	#tabBar .navigation.active ul li:nth-child(3) a{animation:navigationAAnimation 0.3s 0.7s linear forwards; -webkit-animation:navigationAAnimation 0.3s 0.7s linear forwards; -moz-animation:navigationAAnimation 0.3s 0.7s linear forwards; -o-animation:navigationAAnimation 0.3s 0.7s linear forwards; }		

	@keyframes tabBarAnimation{
		0%{transform:translate(0,0);}
		30%{transform:translate(0,5px);}
		50%{transform:translate(0,0);}
		70%{transform:translate(0,-5px);}
		100%{transform:translate(0,0);}
	}
	@-webkit-keyframes tabBarAnimation{
		0%{transform:translate(0,0);}
		30%{transform:translate(0,5px);}
		50%{transform:translate(0,0);}
		70%{transform:translate(0,-5px);}
		100%{transform:translate(0,0);}
	}
	@-moz-keyframes tabBarAnimation{
		0%{transform:translate(0,0);}
		30%{transform:translate(0,5px);}
		50%{transform:translate(0,0);}
		70%{transform:translate(0,-5px);}
		100%{transform:translate(0,0);}
	}
	@-o-keyframes tabBarAnimation{
		0%{transform:translate(0,0);}
		30%{transform:translate(0,5px);}
		50%{transform:translate(0,0);}
		70%{transform:translate(0,-5px);}
		100%{transform:translate(0,0);}
	}

	@keyframes navigationAnimation{
		0%{left:calc(100% - 100px); width: 0; }
		80%{ left: -10px; width:100%; }
		90%{ left:  5px; width:100%; }
		100%{ left: 0; width:100%; }
	}
	@-webkit-keyframes navigationAnimation{
		0%{left:calc(100% - 100px); width: 0; }
		80%{ left: -10px; width:100%; }
		90%{ left:  5px; width:100%; }
		100%{ left: 0; width:100%; }
	}
	@-moz-keyframes navigationAnimation{
		0%{left:calc(100% - 100px); width: 0; }
		80%{ left: -10px; width:100%; }
		90%{ left:  5px; width:100%; }
		100%{ left: 0; width:100%; }
	}
	@-o-keyframes navigationAnimation{
		0%{left:calc(100% - 100px); width: 0; }
		80%{ left: -10px; width:100%; }
		90%{ left:  5px; width:100%; }
		100%{ left: 0; width:100%; }
	}

	@keyframes navigationAAnimation{
		from{ left: -10px; opacity: 0; }
		to{ left: 0; opacity: 1; }
	}
	@-moz-keyframes navigationAAnimation{
		from{ left: -10px; opacity: 0; }
		to{ left: 0; opacity: 1; }
	}
	@-webkit-keyframes navigationAAnimation{
		from{ left: -10px; opacity: 0; }
		to{ left: 0; opacity: 1; }
	}
	@-o-keyframes navigationAAnimation{
		from{ left: -10px; opacity: 0; }
		to{ left: 0; opacity: 1; }
	}

	@keyframes clickbtnAnimation{
		0%{ transform: rotateY(0deg); }
		10%{transform: rotateY(270deg); }
		15%{transform: rotateY(180deg); }
		30%{transform: rotateY(0deg); }
		100%{transform: rotateY(0deg); }
	}
	@-moz-keyframes clickbtnAnimation{
		0%{ transform: rotateY(0deg); }
		10%{transform: rotateY(270deg); }
		15%{transform: rotateY(180deg); }
		30%{transform: rotateY(0deg); }
		100%{transform: rotateY(0deg); }
	}
	@-webkit-keyframes clickbtnAnimation{
		0%{ transform: rotateY(0deg); }
		10%{transform: rotateY(270deg); }
		15%{transform: rotateY(180deg); }
		30%{transform: rotateY(0deg); }
		100%{transform: rotateY(0deg); }
	}
	@-o-keyframes clickbtnAnimation{
		0%{ transform: rotateY(0deg); }
		10%{transform: rotateY(270deg); }
		15%{transform: rotateY(180deg); }
		30%{transform: rotateY(0deg); }
		100%{transform: rotateY(0deg); }
	}
	/*底部聊天 end*/

/* 新增代码，防止电脑端 按钮栏全屏*/	
@media (min-width:768px) {
    #tabBar .navigation {
        left: auto !important;
        right: 50px; /* 按钮宽度，导航放在按钮左边 */
        width: 0;
    }
    #tabBar .navigation.active {
        width: 300px;
    }
    @keyframes navigationAnimation {
        0% {right:0; width:0;}
        80% { right:0; width:300px; }
        90% { right:0; width:300px; }
        100% { right:0; width:300px; }
    }
    @-webkit-keyframes navigationAnimation {
        0% {right:0; width:0;}
        80% { right:0; width:300px; }
        90% { right:0; width:300px; }
        100% { right:0; width:300px; }
    }
    @-moz-keyframes navigationAnimation {
        0% {right:0; width:0;}
        80% { right:0; width:300px; }
        90% { right:0; width:300px; }
        100% { right:0; width:300px; }
    }
    @-o-keyframes navigationAnimation {
        0% {right:0; width:0;}
        80% { right:0; width:300px; }
        90% { right:0; width:300px; }
        100% { right:0; width:300px; }
    }
}
