/* asp2606.css - common styles for top.html, foot.html, and about.html */

/* ===== Reset & Base ===== */
* { margin: 0; padding: 0; box-sizing: border-box; }
body { font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "PingFang SC", "Microsoft YaHei", sans-serif; font-size: 16px; line-height: 1.6; color: #1a1a2e; background: #fff; overflow-x: hidden; }
img { max-width: 100%; height: auto; display: block; }
a { text-decoration: none; color: inherit; }
ul { list-style: none; }

/* ===== Containers ===== */
.main-container { width: 80%; max-width: 1800px; margin: 0 auto; padding: 0 15px; }
.container { width: 80%; max-width: 1800px; margin: 0 auto; padding: 0 15px; }

/* ===== Bootstrap-like Navbar (for index.html) ===== */
.navbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; position: relative; padding: 0; }
.navbar-expand-lg { flex-flow: row nowrap; justify-content: flex-start; }
.navbar-nav { display: flex; flex-direction: row; padding-left: 0; margin-bottom: 0; list-style: none; margin-top: 0; }
.nav-item { position: relative; }
.nav-link { display: block; padding: 12px 16px; text-decoration: none; font-weight: 700; font-size: 18px; transition: background .3s; }
.collapse { display: none; }
.collapse.show { display: block; }
.navbar-collapse { flex-basis: 100%; flex-grow: 1; align-items: center; }
@media (min-width: 992px) {
  .navbar-expand-lg .navbar-collapse { display: flex !important; flex-basis: auto; }
  .navbar-expand-lg .navbar-nav { flex-direction: row; }
}
.dropdown-menu { position: absolute; z-index: 1000; display: none; min-width: 180px; padding: 8px 0; margin: 0; background: #f8fafc; border: 1px solid #0056b3; border-radius: 4px; box-shadow: 0 4px 12px rgba(0,0,0,0.15); list-style: none; }
.dropdown:hover .dropdown-menu { display: block; }
.dropdown-item { display: block; padding: 8px 20px; color: #333; text-decoration: none; font-size: 14px; }
.dropdown-item:hover { background: #007BFF; color: #fff; }
.navbar-brand { padding: 12px 0; font-size: 16px; font-weight: 700; text-decoration: none; }
.text-white { color: #fff !important; }
.navbar-toggler { padding: 8px 12px; font-size: 20px; line-height: 1; background: transparent; border: 1px solid rgba(255,255,255,0.3); border-radius: 4px; cursor: pointer; display: none; }
.navbar-expand-lg .navbar-toggler { display: none; }
.navbar-toggler-icon { display: inline-block; width: 1.5em; height: 1.5em; vertical-align: middle; background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255,255,255,0.9%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e"); background-repeat: no-repeat; background-position: center; background-size: 100%; }
@media (max-width: 991px) {
  .navbar-expand-lg .navbar-toggler { display: block; }
  .navbar-expand-lg .navbar-nav { flex-direction: column; }
  .navbar-expand-lg .navbar-collapse { position: absolute; top: 100%; left: 0; right: 0; background: #0056b3; padding: 10px 15px; z-index: 999; display: none !important; }
  .navbar-expand-lg .navbar-collapse.show { display: block !important; }
  .dropdown-menu { position: static; box-shadow: none; background: rgba(255,255,255,0.1); border: none; }
  .dropdown-item { color: #fff; }
  .dropdown-item:hover { background: rgba(255,255,255,0.2); color: #fff; }
}

/* ===== Top Bar (index.html) ===== */
.top-bar { background: #fff; border-bottom: 1px solid #e2e8f0; padding: 12px 0; }
.top-bar-inner { display: flex; align-items: center; justify-content: space-between; gap: 20px; flex-wrap: wrap; }
.top-bar .logo img { height: 50px; width: auto; }
.top-bar h1 { font-size: clamp(12px, 2vw, 18px); color: #1a1a2e; font-weight: 500; margin: 0; text-align: center; flex: 1; }
.top-bar .contact { text-align: right; font-size: 14px; }
.top-bar .contact .phone { font-size: clamp(14px, 2vw, 20px); color: #0056b3; font-weight: 700; }
.top-bar .brand-title { font-size: 22px; }
.top-bar .brand-subtitle { font-size: 14px; }
.title-wrap { text-align: center; }
.top-bar-inner { flex-wrap: nowrap; }
.mobile-hamburger { display: none; }

/* ===== Navbar Main (index.html blue bar) ===== */
.navbar-main { background: #0056b3 !important; padding: 0; }
.navbar-main .nav-link { color: #fff !important; }
.navbar-main .nav-link:hover, .navbar-main .nav-link.active { background: rgba(255,255,255,0.1); }

/* Header sticky */
.header-wrap { position: sticky; top: 0; z-index: 1000; }

/* ===== Mobile Nav Panel ===== */
/* ===== Mobile Nav Panel ===== */
.mobile-nav-panel {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: #fff;
  z-index: 10000;
  transform: translateX(-100%);
  transition: transform 0.35s ease;
  overflow-y: auto;
  display: none;
}
.mobile-nav-panel.show { transform: translateX(0); display: block; }
.mobile-nav-panel .panel-header { display: flex; align-items: center; justify-content: space-between; padding: 12px 16px; border-bottom: 1px solid #eee; background: #fff; position: sticky; top: 0; z-index: 2; }
.mobile-nav-panel .panel-header .logo img { height: 32px; }
.mobile-nav-panel .panel-header .close-btn { width: 36px; height: 36px; display: flex; align-items: center; justify-content: center; cursor: pointer; position: relative; }
.mobile-nav-panel .panel-header .close-btn::before, .mobile-nav-panel .panel-header .close-btn::after { content: ''; position: absolute; width: 20px; height: 2px; background: #333; transition: all 0.3s; }
.mobile-nav-panel .panel-header .close-btn::before { transform: rotate(45deg); }
.mobile-nav-panel .panel-header .close-btn::after { transform: rotate(-45deg); }
.mobile-nav-panel .panel-list { padding: 16px; }
.mobile-nav-panel .panel-list li { border-bottom: 1px solid #f0f0f0; }
.mobile-nav-panel .panel-list li a { display: block; padding: 14px 4px; color: #333; font-size: 15px; font-weight: 500; text-decoration: none; }
.mobile-nav-panel .panel-tel { padding: 16px; text-align: center; background: #f8f9fa; margin-top: 20px; }
.mobile-nav-panel .panel-tel span { font-size: 13px; color: #666; }
.mobile-nav-panel .panel-tel strong { display: block; font-size: 20px; color: #0056b3; margin-top: 4px; }

/* ===== Hamburger Bar ===== */
.hamburger-bar {
  display: block;
  width: 22px;
  height: 2px;
  background: #333;
  position: relative;
  transition: all 0.3s;
}
.hamburger-bar::before,
.hamburger-bar::after {
  content: '';
  display: block;
  width: 22px;
  height: 2px;
  background: #333;
  position: absolute;
  left: 0;
  transition: all 0.3s;
}
.hamburger-bar::before { top: -7px; }
.hamburger-bar::after { top: 7px; }

/* ===== Anchor Bar ===== */
.anchor-bar.show { display: block; }
.anchor-bar a { display: inline-block; padding: 6px 18px; margin: 0 4px; color: #0056b3; font-size: 14px; font-weight: 500; text-decoration: none; border-radius: 20px; transition: all 0.28s; border: 1px solid transparent; }
.anchor-bar a:hover { background: #0056b3; color: #fff; border-color: #0056b3; }

/* ===== Back to Top ===== */
.back-top { position: fixed; right: 24px; bottom: 24px; width: 48px; height: 48px; background: #0056b3; color: #fff; border: none; border-radius: 50%; cursor: pointer; z-index: 999; font-size: 20px; display: flex; align-items: center; justify-content: center; opacity: 0; visibility: hidden; transition: all 0.3s; }
.back-top.show { opacity: 1; visibility: visible; }
.back-top:hover { background: #FF6B00; transform: translateY(-3px); }

/* ===== Footer ===== */
.site-footer { background: #0056b3; color: #fff; font-size: 14px; }
.site-footer a { color: rgba(255,255,255,0.85); text-decoration: none; transition: color 0.2s; }
.site-footer a:hover { color: #fff; }
.site-footer .footer-top { padding: 40px 0 24px; border-bottom: 1px solid rgba(255,255,255,0.1); }
.site-footer .footer-grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 20px; width: 80%; max-width: 1800px; margin: 0 auto; padding: 0 15px; }
.site-footer .footer-col .footer-title { font-size: 15px; font-weight: 700; margin-bottom: 12px; color: #fff; }
.site-footer .footer-col ul { list-style: none; padding: 0; margin: 0; }
.site-footer .footer-col li { margin-bottom: 6px; font-size: 13px; }
.site-footer .footer-col li a::before { content: '\B7'; margin-right: 4px; color: #FF6B00; }
.site-footer .footer-contact p { margin-bottom: 4px; font-size: 13px; line-height: 1.6; }
.site-footer .footer-qr { text-align: center; }
.site-footer .footer-qr img { width: 80px; height: 80px; border-radius: 4px; margin-bottom: 4px; display: inline-block; }
.site-footer .footer-qr p { font-size: 12px; color: rgba(255,255,255,0.7); }
.site-footer .footer-bottom { padding: 16px 0; background: rgba(0,0,0,0.15); }
.site-footer .footer-links { display: flex; flex-wrap: wrap; gap: 6px 12px; justify-content: center; font-size: 12px; margin-bottom: 10px; width: 80%; max-width: 1800px; margin: 0 auto 10px; padding: 0 15px; }
.site-footer .copyright { text-align: center; font-size: 12px; color: rgba(255,255,255,0.6); width: 80%; max-width: 1800px; margin: 0 auto; padding: 0 15px; }

/* ===== Footer contact override (with !important to beat inline styles) ===== */
.footer-contact p { font-size: 13px !important; color: #fff !important; font-weight: 400 !important; margin-bottom: 4px !important; line-height: 1.6 !important; }
.footer-contact p strong { font-size: 18px !important; color: #fff !important; font-weight: 700 !important; }
.footer-contact .phone-number { font-size: 18px !important; color: #fff !important; font-weight: 700 !important; }

/* ===== Navigation menu (for {aspcms:top} generated header) ===== */
.menu { display: block !important; width: 100% !important; background: #0056b3 !important; border-top: 1px solid rgba(255,255,255,0.1) !important; border-bottom: 1px solid rgba(255,255,255,0.1) !important; position: relative; z-index: 100; overflow: hidden; visibility: visible !important; opacity: 1 !important; min-height: 40px; float: none !important; clear: both; }
.menu > div { width: 80% !important; max-width: 1800px !important; margin: 0 auto !important; position: relative; }
.menu > div::after { content: ''; display: table; clear: both; }
.navigation { display: flex !important; list-style: none !important; margin: 0 !important; padding: 0 !important; height: 40px !important; align-items: center !important; flex-wrap: nowrap; float: none !important; }
.navigation li { position: relative; list-style: none !important; margin: 0 !important; padding: 0 !important; float: none !important; }
.navigation li a { display: block !important; padding: 0 20px !important; color: #fff !important; font-size: 14px !important; font-weight: 500 !important; text-decoration: none !important; line-height: 40px !important; transition: background 0.2s !important; white-space: nowrap; float: none !important; }
.navigation li a:hover { background: rgba(255,255,255,0.15) !important; color: #fff !important; }
.navigation li ul { display: none !important; position: absolute !important; top: 100% !important; left: 0 !important; background: #fff !important; border: 1px solid #e2e8f0 !important; border-radius: 4px !important; box-shadow: 0 4px 12px rgba(0,0,0,0.15) !important; min-width: 180px !important; z-index: 1000 !important; padding: 4px 0 !important; list-style: none !important; margin: 0 !important; }
.navigation li:hover > ul { display: block !important; }
.navigation li ul li { list-style: none !important; margin: 0 !important; padding: 0 !important; float: none !important; }
.navigation li ul li a { color: #333 !important; line-height: 32px !important; padding: 0 16px !important; font-size: 13px !important; white-space: nowrap !important; display: block !important; text-decoration: none !important; float: none !important; }
.navigation li ul li a:hover { background: #f0f7ff !important; color: #0056b3 !important; }
.menu .clear { display: none !important; }

/* ===== Banner Area ===== */
.banner-area { border-top: 2px solid #ff0000; border-bottom: 4px solid #cecece; overflow: hidden; }
.banner-area img { width: 100%; height: 246px; object-fit: cover; display: block; }
@media (max-width: 768px) {
  .banner-area img { height: 140px; }
}
.page-container { width: 80%; max-width: 1800px; margin: 0 auto; display: flex; gap: 20px; padding: 20px 0; }
.page-sidebar { width: 222px; flex-shrink: 0; position: sticky; top: 80px; align-self: flex-start; }
.page-content { flex: 1; min-width: 0; }
.page-content table { width: 100%; }

/* ===== Page Header / Breadcrumb ===== */
.page-header { background: linear-gradient(135deg, #0056b3 0%, #007BFF 100%); border-radius: 8px; padding: 12px 20px; margin-bottom: 16px; }
.page-header table { width: 100%; }
.page-title { font-size: clamp(10px, 2.5vw, 18px); font-weight: 700; color: #fff; margin: 0; }
.breadcrumb-nav { font-size: clamp(6px, 1.5vw, 12px); color: rgba(255,255,255,0.85); font-family: arial; }
.breadcrumb-nav a { color: rgba(255,255,255,0.85); text-decoration: none; }
.breadcrumb-nav a:hover { color: #fff; }

/* ===== Left Sidebar - Blue Theme ===== */
.sidebar-block { margin-bottom: 16px; border-radius: 8px; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,0.08); }
.sidebar-header { background: linear-gradient(135deg, #0056b3 0%, #007BFF 100%); padding: 14px 16px; color: #fff; font-size: 15px; font-weight: 700; }
.sidebar-header .en { font-size: 12px; font-weight: 400; opacity: 0.8; margin-left: 6px; }
.sidebar-body { background: #fff; padding: 8px 0; }
.sidebar-body a { display: block; padding: 10px 16px; color: #333; font-size: 14px; text-decoration: none; transition: all 0.2s; border-left: 3px solid transparent; }
.sidebar-body a:hover { background: #d0e7ff; color: #0056b3; border-left-color: #0056b3; }
.sidebar-body a.active { background: #0056b3; color: #fff; border-left-color: #FF6B00; }
.sidebar-footer { height: 4px; background: linear-gradient(90deg, #0056b3, #007BFF); }

/* ===== Responsive: .tit h1 & subtitle ===== */
@media (max-width: 1200px) and (min-width: 769px) {
  .tit h1 { font-size: 18px !important; }
  .tit > span { font-size: 12px !important; }
}
@media (max-width: 768px) {
  .tit h1 { font-size: 14px !important; }
  .tit > span { font-size: 10px !important; }
}

/* ===== Responsive: Mobile ===== */
@media (max-width: 768px) {
  .main-container { width: 100%; padding: 0 8px; }

  /* Top bar */
  .top-bar { padding: 6px 0; }
  .top-bar-inner {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: flex-start;
    gap: 8px;
    padding: 2px 0;
  }
  .mobile-hamburger { flex-shrink: 0; display: flex; align-items: center; }
  .top-bar .logo { flex-shrink: 0; }
  .top-bar .logo img { height: 28px; }
  .title-wrap {
    flex: 1;
    min-width: 0;
    text-align: left;
  }
  .top-bar h1 {
    font-size: 11px;
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
    text-align: left;
    display: block !important;
    margin: 0;
    padding-right: 4px;
  }
  .top-bar .brand-title { font-size: 10px; }
  .top-bar .brand-subtitle { font-size: 7px; }
  .top-bar .contact div { font-size: 7px; }
  .top-bar .contact { display: flex; flex-direction: column; align-items: flex-end; font-size: 7px; }
  .top-bar .contact .phone { font-size: 7px; }

  /* Navbar */
  .navbar-expand-lg .navbar-toggler { display: none !important; }

  /* Header wrap sticky */
  .header-wrap { position: sticky; top: 0; z-index: 1000; border-bottom: 3px solid #0056b3; }

  /* Anchor bar hidden on mobile */
  .anchor-bar { display: none !important; }

  /* Back top */
  .back-top { right: 12px; bottom: 12px; width: 40px; height: 40px; font-size: 18px; }

  /* Menu / navigation */
  .menu > div { width: 100% !important; padding: 0 10px !important; }
  .navigation { flex-wrap: wrap !important; height: auto !important; }
  .navigation li a { padding: 0 10px !important; font-size: 12px !important; line-height: 36px !important; }
  .navigation li ul { position: static !important; box-shadow: none !important; border: none !important; background: rgba(255,255,255,0.1) !important; display: none !important; }
  .navigation li:hover > ul { display: block !important; }
  .navigation li ul li a { color: #fff !important; padding: 0 10px !important; line-height: 30px !important; }

  /* Page layout */
  .page-container { width: 100%; padding: 10px; }
  .page-sidebar { display: none; }
  .page-content { width: 100%; }
  .page-header { padding: 10px 14px; flex-wrap: wrap; gap: 6px; }
  .page-title { font-size: 10px; }
  .breadcrumb-nav { font-size: 6px; }

  /* Footer: only show contact and QR on mobile */
  .site-footer .footer-grid { grid-template-columns: 1fr 1fr; gap: 16px; }
  .site-footer .footer-col:not(.footer-contact):not(.footer-qr) { display: none; }
  .site-footer .footer-contact { grid-column: 1 / -1; text-align: center; }
  .site-footer .footer-qr { grid-column: 1 / -1; text-align: center; }
  .site-footer .footer-qr > div { display: inline-block; margin: 0 8px; }
}

/* Smaller phones */
@media (max-width: 480px) {
  .site-footer .footer-grid { grid-template-columns: 1fr; }
}

/* ===== Product / Solution List ===== */
.grid-3 { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; }
.card-v { text-align: center; }
.card-v a { display: block; }
.card-v img { width: 100%; height: auto; aspect-ratio: 484 / 300; object-fit: contain; border: 1px solid #e2e8f0; border-radius: 4px; display: block; background: #f8f9fa; }
.card-v a.title { padding: 10px 4px; font-size: 14px; color: #0056b3; text-decoration: none; font-weight: 500; }
.card-v a.title:hover { color: #007BFF; }
.section-title { background: linear-gradient(135deg, #0056b3 0%, #007BFF 100%); color: #fff; font-size: 16px; padding: 10px 14px; margin: 0 0 16px 0; border-radius: 4px; font-weight: 700; }
.more-btn { text-align: center; margin-top: 20px; }
.more-btn a { display: inline-block; padding: 12px 40px; background: #0056b3; color: #fff; text-decoration: none; font-size: 26px; font-weight: 700; border-radius: 8px; transition: background 0.2s; }
.more-btn a:hover { background: #007BFF; }

/* ===== News / Product Detail ===== */
.tit { text-align: center; padding: 20px 0; }
.tit h1 { font-size: 24px !important; font-weight: 700; color: #333; margin-bottom: 8px; }
.tit > span { font-size: 14px !important; }
.news-date { text-align: center; border: 1px solid #e9e9e9; padding: 8px 0; font-size: 13px; color: #666; }
.download-bar { text-align: center; padding: 15px 0; font-size: 14px; color: #333; }
.download-bar a { color: #0056b3; text-decoration: none; font-weight: 700; }
.download-bar a:hover { color: #007BFF; }
.prev-next { padding: 15px 0; font-size: 14px; color: #333; line-height: 1.8; }
.prev-next a { color: #0056b3; text-decoration: none; }
.prev-next a:hover { color: #007BFF; }

/* ===== Responsive: Product / Solution List ===== */
@media (max-width: 768px) {
  .grid-3 { grid-template-columns: repeat(2, 1fr); gap: 16px; }
  .card-v img { height: auto; }
}

/* ===== News List ===== */
.news-item { border-bottom: 1px dotted #cccccc; padding: 12px 0; line-height: 1.8; }
.news-item a.title-link { font-size: 15px; font-weight: 700; color: #0056b3; text-decoration: none; }
.news-item a.title-link:hover { color: #007BFF; }
.news-item .date { color: #999; font-size: 12px; }
.news-item .desc-link { color: #333; text-decoration: none; font-size: 14px; }
.news-item .more-link { color: #FF0000; text-decoration: none; font-size: 13px; }

/* ===== Video/Product List ===== */
.list-item { border-bottom: 1px dotted #cccccc; padding: 15px 0; }
.list-item table { width: 100%; }
.img-col {
  max-width: 484px;
  width: 100%;
  height: 300px;
  background: #f5f5f5;
  display: flex;
  justify-content: center;
  align-items: center;
  overflow: hidden;
  border: 1px solid #e2e8f0;
  border-radius: 4px;
}
.text-col { width: 60%; }
.list-item img {
  width: 100%;
  height: 100%;
  object-fit: contain;
  display: block;
}
.list-item .text-col { padding-left: 15px; vertical-align: top; line-height: 1.8; }
.list-item .title-link { font-size: 16px; font-weight: 700; color: #0056b3; text-decoration: none; }
.list-item .title-link:hover { color: #007BFF; }
.list-item .desc-link { color: #333; text-decoration: none; font-size: 14px; }
.list-title { font-size: 16px; font-weight: 700; color: #0056b3; text-decoration: none; margin: 0; line-height: 1.4; }
.list-title a { color: #0056b3; text-decoration: none; }
.list-title a:hover { color: #007BFF; }

/* ===== Pagination ===== */
.pagination { height: 70px; text-align: center; padding-top: 20px; font-size: 14px; }
.pagination a { color: #0056b3; text-decoration: none; padding: 4px 8px; margin: 0 2px; border: 1px solid #e2e8f0; border-radius: 4px; }
.pagination a:hover { background: #0056b3; color: #fff; border-color: #0056b3; }

/* ===== CTA Section (响应式) ===== */
.cta-wrapper {
  max-width: 1200px;
  margin: 0 auto;
  background: #fff;
  border-radius: 12px;
  box-shadow: 0 4px 20px rgba(0,0,0,0.08);
  padding: 40px 48px;
  overflow: hidden;
}
.cta-divider {
  border: none;
  height: 3px;
  background: linear-gradient(90deg, transparent, #0056b3, transparent);
  margin: 0 0 28px 0;
}
.cta-headline {
  text-align: center;
  font-size: 28px;
  color: #e71f18;
  font-weight: 700;
  margin: 0 0 24px 0;
  line-height: 1.4;
}
.cta-lead {
  font-size: 16px;
  line-height: 2;
  color: #444;
  margin: 0 0 32px 0;
}
.cta-lead strong { color: #0056b3; }
.cta-section-title {
  font-size: 20px;
  font-weight: 700;
  color: #1a1a2e;
  margin: 32px 0 16px 0;
  display: flex;
  align-items: center;
  gap: 10px;
}
.cta-section-title::before {
  content: '';
  display: inline-block;
  width: 4px;
  height: 22px;
  background: #0056b3;
  border-radius: 2px;
}
.cta-stage-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 16px;
  margin: 0 0 32px 0;
}
.cta-stage-card {
  background: #f8fafc;
  border-radius: 8px;
  padding: 20px 16px;
  border-left: 4px solid #0056b3;
}
.cta-stage-card .stage-label {
  font-size: 15px;
  font-weight: 700;
  color: #0056b3;
  margin: 0 0 10px 0;
}
.cta-stage-card .stage-text {
  font-size: 14px;
  line-height: 1.8;
  color: #555;
  margin: 0;
}
.cta-stats {
  display: flex;
  justify-content: center;
  gap: 40px;
  padding: 24px 0;
  margin: 24px 0;
  background: linear-gradient(135deg, #f0f7ff, #fff8f0);
  border-radius: 8px;
}
.cta-stat-item { text-align: center; }
.cta-stat-num {
  font-size: 32px;
  font-weight: 700;
  color: #0056b3;
  line-height: 1;
}
.cta-stat-label {
  font-size: 13px;
  color: #666;
  margin-top: 4px;
}
.cta-closing {
  text-align: center;
  font-size: 18px;
  color: #333;
  margin: 32px 0 0 0;
  line-height: 1.8;
}
.cta-closing .highlight-red {
  color: #e71f18;
  font-size: 22px;
  font-weight: 700;
}
.cta-contact-bar {
  background: linear-gradient(135deg, #0056b3 0%, #007BFF 100%);
  color: #fff;
  text-align: center;
  padding: 48px 24px;
  border-radius: 8px;
  margin: 32px 0 0 0;
  font-size: 22px;
  font-weight: 700;
  letter-spacing: 0.5px;
  line-height: 1.6;
}
.cta-contact-bar .cta-phone {
  font-size: 28px;
  color: #FFD700;
  text-decoration: none;
  font-weight: 700;
}
.cta-contact-bar .cta-wechat {
  font-size: 16px;
  color: rgba(255,255,255,0.85);
  font-weight: 400;
}
.cta-contact-bar .cta-closing-bar {
  font-size: 22px;
  color: #fff;
  margin: 0 0 16px 0;
  line-height: 1.6;
}
.cta-contact-bar .highlight-cta {
  color: #FFD700;
  font-size: 26px;
  font-weight: 700;
}
.cta-contact-bar .cta-phone-line {
  font-size: 20px;
  margin: 12px 0 4px 0;
}

/* Responsive: CTA */
@media (max-width: 768px) {
  .cta-wrapper { padding: 24px 20px; }
  .cta-headline { font-size: 20px; }
  .cta-lead { font-size: 14px; }
  .cta-section-title { font-size: 16px; }
  .cta-stage-grid { grid-template-columns: 1fr; }
  .cta-stage-card .stage-label { font-size: 14px; }
  .cta-stage-card .stage-text { font-size: 13px; }
  .cta-stats { gap: 20px; flex-wrap: wrap; }
  .cta-stat-num { font-size: 24px; }
  .cta-stat-label { font-size: 12px; }
  .cta-closing { font-size: 15px; }
  .cta-closing .highlight-red { font-size: 18px; }
  .cta-contact-bar { font-size: 16px; padding: 28px 16px; }
  .cta-contact-bar .cta-phone { font-size: 22px; }
  .cta-contact-bar .cta-wechat { font-size: 13px; }
  .cta-contact-bar .cta-closing-bar { font-size: 16px; }
  .cta-contact-bar .highlight-cta { font-size: 18px; }
}

/* ===== Article Content (news:info / product:info) ===== */
.article-content {
  max-width: 1200px;
  margin: 0 auto;
  padding: 0 24px;
  font-family: "Microsoft YaHei", arial, sans-serif;
  line-height: 2;
  color: #333;
}
.article-content p {
  margin: 0 0 16px 0;
}
.article-content h2 {
  line-height: 4;
}
.article-content img {
  display: block;
  margin: 16px auto;
  max-width: 100%;
  height: auto;
}

/* ===== Responsive: Article Content ===== */
@media (max-width: 768px) {
  .article-content {
    padding: 0 16px;
    line-height: 1.8;
  }
  .article-content img {
    margin: 12px auto;
  }
}

@media (max-width: 768px) {
  .news-item { padding: 10px 0; }
  .img-col { width: 100%; display: flex !important; height: 300px; }
  .text-col { width: 100%; }
  .list-item img { width: 100%; height: 100%; }
  .list-item .text-col { padding-left: 0; padding-top: 10px; }
  .list-item table { display: block; }
  .list-item tr { display: flex; flex-direction: column; }
  .list-item td { display: block; width: 100% !important; }
}
/* ===== Product Detail Page Styles ===== */

/* H2 Headings */
.product-h2 {
    color: #0056b3;
    margin-top: 64px; /* 四倍行距 */
    margin-bottom: 32px; /* 两倍行距 */
    line-height: 2;
    font-size: 24px;
    border-bottom: 2px solid #e2e8f0;
    padding-bottom: 10px;
}
.product-h2:first-of-type {
    margin-top: 0;
}

/* Product Overview Layout */
.overview-container {
    display: flex;
    gap: 40px;
    align-items: flex-start;
}
.overview-highlight {
    font-size: 20px;
    font-weight: 700;
    color: #0056b3;
    line-height: 1.4;
    flex: 0 0 40%;
}
.overview-content {
    flex: 1;
    line-height: 1.8;
}

/* FAQ Styles */
.faq-dl dt {
    font-weight: 700;
    color: #1a1a2e;
    margin-top: 16px;
    font-size: 17px;
}
.faq-dl dd {
    margin-left: 0;
    margin-bottom: 16px;
    color: #333;
}

/* Table Styles */
.spec-table {
    width: 100%;
    border-collapse: collapse;
    margin-top: 20px;
    font-size: 15px;
}
.spec-table th, .spec-table td {
    border: 1px solid #e2e8f0;
    padding: 12px 15px;
    text-align: left;
}
.spec-table th {
    background-color: #f8fafc;
    color: #0056b3;
    font-weight: 700;
    width: 30%;
}

/* List Styles */
.feature-list {
    padding-left: 20px;
    margin-bottom: 20px;
}
.feature-list li {
    margin-bottom: 10px;
    line-height: 1.8;
}

/* Responsive Design */
@media (max-width: 900px) {
    .overview-container {
        flex-direction: column;
    }
    .overview-highlight {
        flex: none;
        width: 100%;
        margin-bottom: 20px;
        font-size: 18px;
    }
}

/* ===== Shared header/footer styles (for top.html + foot.html) ===== */
.anchor-bar {
  background: rgba(255,255,255,0.96);
  backdrop-filter: blur(8px);
  box-shadow: 0 2px 10px rgba(0,0,0,0.08);
  padding: 10px 0;
  text-align: center;
  display: none;
  border-bottom: 1px solid rgba(0,86,179,0.1);
  width: 100%;
}

@media (max-width: 700px) {
  .top-bar .brand-title { font-size: 8px; }
  .top-bar .brand-subtitle { font-size: 6px; }
  .top-bar .contact div { font-size: 6px; }
  .top-bar .contact .phone { font-size: 6px; }
}

/* ===== Merged from /Css/csl.css ===== */
html,body{min-height:100%}
a{text-decoration:none}
body{font-family:Arial,sans-serif}
img{border:0}
ul{list-style-type:none}



        * {
            margin: 0;
            padding: 0;
            box-sizing: border-box;
        }
        
        /* 顶部区域居中 */
        .h_top {
            padding: 0 10px;
            display: flex;
            align-items: center;
            justify-content: center;
            height: 50px;
            background: white;
            transition: all 0.3s ease;
        }
        
        .h_top.hide {
            opacity: 0;
            transform: translateY(-100%);
        }
        
        /* 导航栏居中 */
        .sticky-nav {
            height: 50px;
            position: sticky;
            top: 0;
            z-index: 1000;
            background: #0066FF;
            box-shadow: 0 2px 10px rgba(0,0,0,0.1);
            transition: all 0.3s;
        }
        
        .navs {
            display: flex;
            justify-content: center;
            width: 100%;
        }
        
        .top_dh {
            list-style: none;
            display: flex;
            width: 100%;
            max-width: 960px;
            margin: 0 auto;
        }
        
        .mainlevel {
            position: relative;
        }
        
        .mainlevel > a {
            display: block;
            text-decoration: none;
            color: #FFFFFF;
        }
        
        .level_one {
            position: absolute;
            z-index: 1001;
            list-style: none;
            background: white;
            box-shadow: 0 5px 15px rgba(0,0,0,0.1);
            min-width: 120px;
            display: none;
            left: 0;
            text-align: left;
        }
        
        .mainlevel:hover .level_one {
            display: block;
        }
        

        main {
            margin-top: 50px;
            padding: 20px;
        }



#header{height:100px;width:100%;min-width:960px;clear:both}
#header .h_top{height:100px;width:960px;margin:0 auto}
.h_top .log{float:left;height:100px;width:700px;overflow:hidden}
.h_top .top_sm{float:right;height:50px;width:auto;font-size:12px;font-family:Arial,Helvetica,sans-serif;color:#7f8891}
.top_dh{float:left;width:100%;height:50px}
.top_dh .mainlevel{float:left;height:50px;width:130px}
.top_dh .mainlevel a{height:49px;color:#FFFFFF;display:block;font-family:"Arial";font-size:16px;font-weight:bold;line-height:50px}
#footer .f_cen{height:364px;width:960px;margin:0 auto;padding:20px 0 0 0}
.f_cen .banquan{float:left;height:18px;width:960px;padding:15px 0 0 0;line-height:20px;color:#FFFFFF;text-align:center;font-size:12px}
.f_cen .banquan a{height:20px;color:#FFFFFF;display:inline-block;padding:0 6px}
#in_body .in_bcen{height:auto;width:960px;margin:0 auto;clear:both}
.in_bcen .shuoming{float:left;height:38px;line-height:38px;font-size:9px;color:#0066FF;width:960px;border-bottom:2px #CCCCCC solid;border-top:2px #CCCCCC solid}
.in_bcen .in_tu{float:left;height:410px;width:960px;padding:15px 0 0 0}
.in_tu .in_tu_left,.quehuan{float:left;height:407px;width:250px;padding:0 7px 0 0}
.quehuan{padding:0}
.quehuan span{height:35px;line-height:35px;color:#999;width:100%;display:block;margin-top:374px;text-indent:15px}
.quehuan:hover span{display:none}
.quehuan:hover{}
.quehuan div{display:none}
.quehuan:hover div{background:none;display:block}
.in_tu .in_tu_right{float:left;height:407px;width:703px}
.in_tu_right .r_tu7{float:left;height:198px;width:230px;padding:0 7px 10px 0}
.in_tu_right .r_tu7 a{float:left;height:198px;width:230px;padding:0 7px 10px 0}
.in_tu_right .r_tu7 span{height:35px;line-height:35px;color:#999;width:100%;display:block;margin-top:163px;text-indent:15px}
.in_tu_right .r_tu7:hover span{display:none}
.in_tu_right .r_tu7:hover{}
.in_tu_right .r_tu7 div{display:none}
.in_tu_right .r_tu7:hover div{background:none;display:block}
.in_tu_right .r_tu1,.in_tu_right .r_tu2,.in_tu_right .r_tu1 a,.in_tu_right .r_tu2 a{float:left;height:198px;width:190px;padding:0 7px 10px 0}
.in_tu_right .r_tu1 span,.in_tu_right .r_tu2 span{height:35px;color:#999;width:100%;display:block;margin-top:163px;text-indent:15px}
.in_tu_right .r_tu1:hover span,.in_tu_right .r_tu2:hover span{display:none}
.in_tu_right .r_tu1 div,.in_tu_right .r_tu2 div{display:none}
.in_tu_right .r_tu1:hover div,.in_tu_right .r_tu2:hover div{background:none;display:block}
.in_tu_right .r_tu1 a{padding:0;display:block}
.in_tu_right .r_tu7 a{padding:0;display:block}
.in_tu_right .r_tu1 a:hover{}
.in_tu_right .r_tu2{padding:0 0px 10px 0}
.in_tu_right .r_tu2 a{padding:0;display:block}
.in_tu_right .r_tu2 a:hover{}
.in_tu_right .r_tu3,.in_tu_right .r_tu3 a{float:left;height:198px;width:230px;padding:0 7px 0px 0}
.in_tu_right .r_tu3 a{padding:0;display:block}
.in_tu_right .r_tu3 .in_tu_right .r_tu4,.in_tu_right .r_tu4 a{float:left;height:198px;width:229px}
.in_tu_right .r_tu4 a{padding:0;display:block}
.in_tu_right .r_tu4 a:hover{}
.in_tu_right .r_tu4 a{float:left;height:198px;width:227px}
.in_tu_right .r_tu4 span{height:35px;line-height:35px;color:#999;width:100%;display:block;margin-top:163px;text-indent:15px}
.in_tu_right .r_tu4:hover span{display:none}
.in_tu_right .r_tu4:hover{}
.in_tu_right .r_tu4 div{display:none}
.in_tu_right .r_tu4:hover div{background:none;display:block}
.in_bcen .in_tu2{float:left;height:487px;width:960px;padding:30px 0 50px}
.in_tu2 .m_tu1,.in_tu2 .m_tu2,.in_tu2 .m_tu3{float:left;height:487px;width:218px;padding:0 14px 0 0}
.in_tu2 .m_tu2{padding:0 14px 0 15px}
.in_tu2 .m_tu3{padding:0 0 0 15px}
.home_product_tag{margin-top:15px}
.f_left1{width:180px;height:120px;border-right:1px solid #fff;float:left}
.f_left1 img{margin-left:43px}
.f_left1 p{color:#fff;font-size:16px;height:30px;line-height:30px;text-align:center}
.f_left2{width:230px;height:120px;float:right}
#footer{height:200px;width:100%;min-width:960px;clear:both;background:#0066FF}
.box{position:relative;margin:0 auto;width:1010px;height:100%;padding:18px 0}
#slides li{height:840px}
#in_body .in_bcen{position:relative;z-index:22}
.in_bcen{position:relative}
#header .nav{background:#0066FF;overflow:hidden}
#header .navs{width:960px;margin:0 auto}
#header .top_dh{}
.top_dh .mainlevel{}
.f_left2 ul{margin-left:5px}
.f_left2 li{margin-bottom:10px;text-transform:none}
.f_left2 li img{vertical-align:bottom;position:relative;top:-1px;margin-right:5px;width:auto}
.f_left2 li,.f_left2 li a{color:#fff;font-size:18px;font-weight:bold}
img{border:0 none}
.next{width:0;height:0;border-top:20px solid transparent;border-bottom:20px solid transparent;border-left:20px solid white;right:12px;left:auto}
*{padding:0;margin:0}
#full-screen-slider{width:100%;height:520px;float:left;position:relative}
#slides{display:block;width:100%;min-width:960px;height:520px;list-style:none;padding:0;margin:0;position:relative}
#slides li{display:block;width:100%;height:100%;list-style:none;padding:0;margin:0;position:absolute}
#slides li a{display:block;width:100%;height:100%;text-indent:-9999px}
@charset "utf-8";ul,li{list-style-type:none;text-transform:capitalize}
.clear{clear:both;display:inline}
.news-items { display: flex; }
.news-items { align-items: flex-start; }
.news-items { margin-bottom: 20px; }
.news-items { padding-bottom: 20px; }
.news-items { border-bottom: 1px solid #ededed; }
.news-items { min-height: 150px; }
.news-items dt { flex: 0 0 200px; }
.news-items dt { margin-right: 20px; }
.news-items .content-wrapper { flex: 1; }
.news-items .content-wrapper { display: flex; }
.news-items .content-wrapper { flex-direction: column; }
.news-items .content-wrapper { height: 100%; }
.news-tit { margin-bottom: 10px; }
.news-tit { font-size: 18px; }
.news-meta { color: #666; }
.news-meta { font-size: 14px; }
.news-meta { margin-bottom: 8px; }
.news-con { margin-bottom: 15px; }
.news-con { line-height: 1.6; }
.news-con { flex-grow: 1; }
.news-more { margin-top: auto; }
.news-more { text-align: right; }
@media (max-width: 768px) { .news-items { flex-direction: column; } }
@media (max-width: 768px) { .news-items { min-height: auto; } }
@media (max-width: 768px) { .news-items dt { margin-right: 0; } }
@media (max-width: 768px) { .news-items dt { margin-bottom: 15px; } }
@media (max-width: 768px) { .news-items dt { flex: none; } }
@media (max-width: 768px) { .news-more { text-align: left; } }
@media (max-width: 768px) { .news-more { margin-top: 10px; } }
.products {
    display: flex;
    align-items: flex-start;
    margin-bottom: 20px;
    padding-bottom: 20px;
    border-bottom: 1px solid #676767;
    min-height: 150px;
}
.products dt {
    flex: 0 0 242px;
    margin-right: 20px;
}
.products .content-wrapper {
    flex: 1;
    display: flex;
    flex-direction: column;
    height: 100%;
}
.product_tit {
    margin-bottom: 10px;
    font-size: 15px;
}
.product_con {
    margin-bottom: 5px;
    line-height: 1.6;
    flex-grow: 1;
}
.product_more {
    margin-top: auto;
    text-align: right;
}

/* 移动端响应式 */
@media (max-width: 768px) {
    .products {
        flex-direction: column;
        min-height: auto;
    }
    .products dt {
        margin-right: 0;
        margin-bottom: 15px;
        flex: none;
    }
    .product_more {
        text-align: left;
        margin-top: 10px;
    }
}
.top_dh .mainlevel{float:left}
.top_dh .mainlevel a{color:#fff;text-decoration:none;display:block}
.top_dh .mainlevel a:hover{color:#fff;text-decoration:none}
.top_dh .mainlevel ul{display:none;position:absolute;z-index:9999;margin-left:-27px;background:#D9D9D9;height:370px;width:102px}
.h_top .log{position:relative}
#in_body{overflow:visible}
.control-box{width:960px;height:230px;background-size:1055px;background-repeat:no-repeat;background-position:60px 165px;margin-left:auto;margin-right:auto;margin-top:25px}
.control-box ul{list-style:none;position:relative}
.control-box ul li{position:absolute;top:50px;cursor:pointer}
.prev{left:-50px}
.next{right:0}
.bigbox{overflow:hidden;width:960px;height:230px;margin:auto 0 auto}
.content_1 .box,.content_2 .box{transition:all .1s cubic-bezier(0.25,0.1,0.25,1);width:255px;height:230px;float:left;border-left:3px white solid;padding:0}
.content_1 .box img,.content_2 .box img{width:100%}
.box:hover{opacity:0.5}
.shadow{width:237px;height:60px;background-color:#0066FF;filter:progid:DXImageTransform.Microsoft.gradient(startColorstr=#66000000,endColorstr=#66000000);color:white;font-size:12px}
.shadow a{display:inline-block;width:217px;height:60px;color:#fff;text-decoration:none;margin:10px 10px 0}
.top{height:50px;overflow:hidden;width:1000px;margin:0 auto}
.quick_links_wrap{font-size:0;width:66px;position:fixed;right:20px;bottom:100px;z-index:9;transition:width linear .4s;}
.quick_links_wrap.quick_links_min{width:34px}
.quick_links_wrap.quick_links_dockright{margin-left:0;left:auto;right:4px}
.quick_links_panel{background:#FBFBFB;border:1px solid #EAEAEA;box-shadow:0 0 4px rgba(0,0,0,.14);padding-bottom:30px;height:268px;width:64px;overflow:hidden;position:absolute;left:0;bottom:0;transition:all ease .4s}
.quick_links_allow_gotop{height:277px}
.quick_links{width:100%;position:absolute;left:0;transition:top ease .4s}
.quick_links_allow_gotop .quick_links,.quick_links_min .quick_links_allow_gotop .quick_links{top:0}
.quick_links_min .quick_links{top:32px}
.quick_links a{display:block;border:1px solid #fff;border-bottom-color:#edecec;color:#4467a7;font-size:12px;margin:0;padding:8px 0;text-align:center}
.quick_links i{display:inline-block; no-repeat 0 -182px;cursor:pointer;height:38px;width:38px;vertical-align:top}
.quick_links a:hover i,.quick_links a.current i{background-position:0 -220px}
.quick_links .message{background-position:-190px -182px}
.quick_links .qa{background-position:-114px -182px}
.quick_links a:hover .qa,.quick_links a.current .qa{background-position:-114px -220px}
.quick_links .top{background-position:-152px -182px}
.quick_links span{display:block;cursor:pointer;padding-top:3px;height:1.5em;width:100%;overflow:hidden;word-break:break-all;word-wrap:break-word;text-overflow:ellipsis}
.quick_links .num,.quick_links .num b,.quick_links_pop .num,.quick_links_pop .num b{display:inline-block; no-repeat 100% -102px;padding-right:6px;vertical-align:top}
.quick_links .num,.quick_links_pop .num{background-position:-210px -82px;color:#fff;cursor:pointer;font:12px/18px Arial;margin-left:6px;padding:0 0 0 6px;vertical-align:middle}
.quick_links .num{margin:-40px 0 0;position:absolute;left:38px}
.quick_links_pop,.quick_links_pop .fix_bg{background:#fcfcfc;border:1px solid #dfdfdf;border-radius:3px}
.quick_links_pop{box-shadow:0 2px 8px rgba(0,0,0,.2);margin-right:6px;position:absolute;bottom:0;right:100%}
#pagination{display:block;list-style:none;position:absolute;left:50%;top:500px;z-index:9900;padding:5px 15px 5px 0;margin:0}
#pagination li{display:block;list-style:none;width:10px;height:10px;float:left;margin-left:15px;border-radius:5px;background:#d7d8d9}
#pagination li a{display:block;width:100%;height:100%;padding:0;margin:0;text-indent:-9999px}
#pagination li.current{background:#0092CE}
.top_dh .mainlevel a:hover{color:#f60;text-decoration:none}
.top_dh:hover .level_one{display:block}
.top_dh .mainlevel li{border-top:1px solid #fff;background:#D9D9D9;width:100%;z-index:9999;text-align:center}
.top_dh .mainlevel li a{color:#0066ff;height:45px;line-height:45px;display:block;font-size:13px;font-family:"Arial";width:100%}
#switcher{height:230px;left:0px}
.shineu-top-tab .select.ry-sl a,.shineu-top-tab .select.yy-sl a{color:#0066FF;border-bottom:3px solid #0066FF}
.quick_links a:hover,.quick_links a.current{background-color:#4467a7;border-color:#4467a7;color:#fff}
.quick_links_min .quick_links .top{background-position:-180px -62px;height:20px;width:20px}
.quick_links a:hover .top,.quick_links a.current .top{background-position:-152px -220px}
.quick_links_min .quick_links a:hover .top,.quick_links_min .quick_links a.current .top{background-position:-180px -82px}
.quick_links a:hover .num,.quick_links a.current .num{background-position:-220px -82px}
.quick_links a:hover .num b,.quick_links a.current .num b{background-position:100% -122px}
.f_cen .banquan  a{height:20px;color:#FFFFFF;display:inline-block;padding:0 6px}
.news_list{float:left;height:auto;width:900px;border:1px #CCCCCC solid;padding:15px 15px 15px 15px;margin:20px 0}
.news_list .news{float:left;height:190px;width:900px;padding:20px 0 20px 0;border-bottom:1px solid #CCCCCC}
.news dt{width:257px;height:160px;padding:0 20px 0 0;float:left}
.news dd{float:left;width:623px}
.news .new_tit{height:30px;padding:0 0 10px 0}
.news .new_tit a{height:30px;font-size:16px;color:#000000;font-family:"Arial";line-height:30px;font-weight:bold}
.news .new_con{height:72px;font-size:14px;color:#000000;font-family:"Arial";line-height:26px}
.news .new_more{height:25px;font-size:14px;color:#FF6600;font-family:"Arial";line-height:50px}
.news .new_more a{height:25px;font-size:14px;color:#0066FF;font-family:"Arial";line-height:50px;float:right;width:120px}
.tagContent{DISPLAY:none;PADDING-BOTTOM:20px;WIDTH:930px;PADDING-TOP:10px;HEIGHT:auto}
#tagContent DIV.selectTag{DISPLAY:block}
.h_top .top_ss{position:relative !important;right:-20px !important}
.top_ss{margin-top:10px;display:inline-block}
.f_left2 li a{cursor:pointer}
.zw{line-height:25px;padding:15px 0;min-height:350px;color:#000000;font-size:14px}
.zw a:link{color:#000000}
.zw a:visited{color:#000000}
.zw img{max-width:100%;width:expression(document.body.clientWidth>100%?"100%":"auto")}
.hide{visibility:hidden}
body{background-size:100% 100%}
.shineu-top-box{width:100%;margin:0 auto;background-color:#ffffff;border-bottom:1px solid #e8e8e8;margin-top:5px}
.shineu-top-tab{height:100%;width:960px;margin:0 auto;background-color:#ffffff}
.shineu-top-tab ul{padding:0;margin:0;padding-bottom:20px;margin-top:10px}
.shineu-top-tab ul li{display:inline-block}
.shineu-top-tab ul li{font-size:18px;margin-right:20px}
.shineu-top-tab ul li a{color:#000000}
.shineu-top-tab ul li:first-child{margin-left:20px}
.shineu-top-tab ul li.select a{color:#06f;padding-bottom:4px;border-bottom:3px solid #06f}
.shineu.in_bcen{background-color:#ffffff;padding:0px 0px 0px}
.tags LI{LIST-STYLE-TYPE:none;HEIGHT:41px;width:120px;FLOAT:left;MARGIN-RIGHT:3px}
.tags LI A{width:auto;float:left;border:2px #0066FF solid;box-sizing:border-box;display:inline;padding:0 16px;LINE-HEIGHT:41px;HEIGHT:41px;TEXT-DECORATION:none;text-align:center;font-size:14px;font-family:"Arial";font-weight:bold;color:#FF6600}
.ul{list-style-type:none}
.tags LI.selectTag{BACKGROUND-POSITION:left bottom;MARGIN-BOTTOM:-2px;POSITION:relative;HEIGHT:41px}
ul,li{list-style-type:none;text-transform:capitalize}
.in_bcen .shuom{float:left;height:38px;line-height:38px;font-size:10px;color:#0066FF;width:960px;border-bottom:2px #CCCCCC solid;border-top:2px #CCCCCC solid}
.in_bcen .shuoming{float:left;height:38px;line-height:38px;font-size:16px;color:#0066FF;width:960px;border-bottom:2px #CCCCCC solid;border-top:2px #CCCCCC solid}
.control-box{width:960px;height:230px;background-size:1055px;background-repeat:no-repeat;background-position:60px 165px;margin-left:auto;margin-right:auto;margin-top:25px}
.xiaocms-page a{display:inline-block;height:22px;line-height:22px;background:#E9E9E9;border:1px solid #e3e3e3;text-align:center;color:#999;padding:0 10px;margin-left:4px;border-radius:5px;-moz-border-radius:25px}
.xiaocms-page span{display:inline-block;height:22px;padding:0 10px;line-height:22px;background:#0066FF;border:1px solid #0066FF;color:#fff;text-align:center;margin-left:1px;border-radius:5px}
.in_bcen .spsx{float:left;height:auto;width:960px;padding:20px 30px;background-color:#ededed}
.sxsp{overflow:hidden;height:auto;width:900px;font-size:14px;font-family:"Arial";color:#000000;border-bottom:1px #ccc solid;padding:0 0 10px 0}
.sxsp dd{float:left;height:28px;width:auto;line-height:28px;margin-right:5px;margin-top:2px}
.spsx .xiangxlx{height:auto;overflow:hidden;font-size:14px;font-family:"Arial";color:#000000;padding:10px 0 0 0}
.xiangxlx dt,.xiangxlx dd,.xiangxlx dd a{float:left;height:25px;width:auto;font-size:14px;font-family:"Arial";color:#000000;line-height:25px}
.xiangxlx dd{padding:0 0px 0 15px}
.xiangxlx a{display:block}
.xuanz{float:left;height:28px;width:auto;padding:2px 10px 2px 10px;border:1px #999999 solid}
.xuanz .spname{float:left;height:28px;width:auto;line-height:28px;text-align:center}
.xuanz a{float:left;height:28px;width:30px;display:block;line-height:28px;padding:0 0 0 10px;color:#CC0000}
.tags{WIDTH:960px;HEIGHT:41px;float:left}
#pagination li{width:18px;height:18px;border-radius:50%}
.tags LI.selectTag A{BACKGROUND-POSITION:right top;COLOR:#0066ff;LINE-HEIGHT:35px;HEIGHT:41px}
.tags2{width:960px;height:52px}
.tags3 LI A{width:auto;float:left;border:2px #0066FF solid;box-sizing:border-box;display:inline;padding:0 16px;LINE-HEIGHT:41px;HEIGHT:41px;TEXT-DECORATION:none;text-align:center;font-size:14px;font-family:"Arial";font-weight:bold;color:#FF6600}
.navigator .categorys .nav_lbg,.navigator .categorys .nav_rbg,.navigator .categorys .nav_lbg i,.navigator .categorys .nav_rbg i{ repeat-y;font-size:0;height:100%;height:388px;width:8px;position:absolute;left:-8px;top:0;_background:#d9d9d9;_width:1px;_left:-1px}
.quick_links a:hover .message,.quick_links a.current .message{background-position:-190px -220px}

/*向上图标*/
.toolbar-item,.toolbar-layer{background:url(/images/toolbar.png) no-repeat;}
.toolbar{position:fixed;right:30px;bottom:80px;}
.toolbar-item{display:block;width:52px;height:52px;margin-top:1px;position:relative;transition:background-position 1s;}
.toolbar-item:hover .toolbar-layer{opacity:1;filter:alpha(opacity=100);transform:scale(1);-webkit-transform:scale(1);-moz-transform:scale(1);-ms-transform:scale(1);-o-transform:scale(1);}
.toolbar-item-weixin{background-position:0 -798px;}
.toolbar-item-weixin:hover{background-position:0 -860px;}
.toolbar-item-weixin .toolbar-layer{height:212px;background-position:0 0;}
.toolbar-item-feedback{background-position:0 -426px;}
.toolbar-item-feedback:hover{background-position:0 -488px;}
.toolbar-item-app{background-position:0 -550px;}
.toolbar-item-app:hover{background-position:0 -612px;}
.toolbar-item-app .toolbar-layer{height:194px;background-position:0 -222px;}
.toolbar-item-top{background-position:0 -674px;}
.toolbar-item-top:hover{background-position:0 -736px;}
.toolbar-layer{position:absolute;right:46px;bottom:-10px;width:172px;opacity:0;filter:alpha(opacity=0);
transform-origin: 95% 95%;-moz-transform-origin: 95% 95%;-ms-transform-origin: 95% 95%;-o-transform-origin: 95% 95%;-webkit-transform-origin: 95% 95%;transform:scale(0.01);
-moz-transform:scale(0.01);-ms-transform:scale(0.01);-o-transform:scale(0.01);-webkit-transform:scale(0.01);transition:all 1s;-moz-transition:all 1s;-ms-transition:all 1s;-o-transition:all 1s;-webkit-transition:all 1s;}

.home_product_tag{height:41px;font-size:18px;line-height:41px;}
.home_product_tag a{display:inline-block;width:120px;text-align:center;color:#000000;}
.home_product_tag a:hover {color:#0066ff;}
.home_product_tag .a{background-color:#ededed;color:#0066ff;}


    .social-share {
      display: flex;
      gap: 12px;
      margin-top: 8px;
      background-color: #0066FF; /* 指定背景色 */
      padding: 8px 12px;
      border-radius: 4px;
    }
    .share-btn {
      display: inline-flex;
      align-items: center;
      justify-content: center;
      width: 40px;
      height: 40px;
      border-radius: 50%;
      transition: all 0.3s;
      text-decoration: none;
      font-weight: bold;
    }
    .share-btn:hover {
      opacity: 0.9;
      transform: translateY(-3px);
    }
    .weibo-share { background: #E6162D; color: white; }
    .qzone-share { background: #FFCC00; color: #333; }
     
    /* 图标样式 */
    .icon-weibo::before { content: '微'; }
    .icon-qzone::before { content: 'Q'; }

  .modern-table {
    width: 100%; 
    border: 0; 
    border-collapse: collapse; 
  }
  

  .modern-table td,
  .modern-table th {
    padding: 0;
  }

/* ======================== */
/* 左侧边栏 + 响应式主内容区  */
/* ======================== */

/* 页面容器：80%宽度，最大1800px，flex布局 */
.page-container {
  width: 80%;
  max-width: 1800px;
  margin: 0 auto;
  padding: 0 15px;
  display: flex;
  gap: 24px;
  align-items: flex-start;
}

/* 左侧边栏 */
.sidebar-left {
  width: 220px;
  flex-shrink: 0;
  position: sticky;
  top: 140px;
  align-self: flex-start;
  z-index: 500;
}

.left-sidebar {
  width: 100%;
}

/* 顶部图片区域：#0056b3背景，上左上右圆角 */
.left-sidebar-top {
  background: #0056b3;
  padding: 12px 16px;
  text-align: center;
  border-radius: 8px 8px 0 0;
}

.left-sidebar-top img {
  width: 210px;
  height: auto;
  display: inline-block;
}

/* 中间内容区 */
.left-sidebar-body {
  background: #fff;
  border: 1px solid #e2e8f0;
  border-top: none;
  border-bottom: none;
}

.left-nav-group {
  padding: 12px 16px;
  border-bottom: 1px solid #e2e8f0;
}

.left-nav-group:last-child {
  border-bottom: none;
}

.left-nav-title {
  font-size: 15px;
  font-weight: 700;
  color: #0056b3;
  margin-bottom: 8px;
  padding-bottom: 6px;
  border-bottom: 1px solid #e2e8f0;
}

.left-nav-list {
  padding: 0;
  margin: 0;
  list-style: none;
}

.left-nav-list li {
  padding: 4px 0;
}

.left-nav-list li a {
  font-size: 13px;
  color: #333;
  text-decoration: none;
  transition: color 0.2s;
}

.left-nav-list li a:hover {
  color: #0056b3;
}

/* 底部图片区域：#0056b3背景，下左下右圆角 */
.left-sidebar-bottom {
  background: #0056b3;
  padding: 12px 16px;
  text-align: center;
  border-radius: 0 0 8px 8px;
}

.left-sidebar-bottom img {
  width: 210px;
  height: auto;
  display: inline-block;
}

/* 主内容区：flex自适应 */
.main-content {
  flex: 1;
  min-width: 0;
}

/* 覆盖旧样式：主内容区内的 in_bcen 不再固定960px */
#in_body .main-content .in_bcen,
#in_body .page-container .in_bcen {
  width: 100%;
  margin: 0;
  clear: none;
  height: auto;
}

/* Banner 容器：在 page-container 外，同样 80%/1800px */
.banner-wrap {
  width: 80%;
  max-width: 1800px;
  margin: 0 auto 10px;
  padding: 0 15px;
}

/* 二级栏目缩进 20px */
.left-nav-sub li {
  padding: 4px 0 4px 20px;
}

/* 标题链接样式 */
.left-nav-title a {
  color: #0056b3;
  text-decoration: none;
}
.left-nav-title a:hover {
  color: #007BFF;
}

/* 移动端适配 */
@media (max-width: 768px) {
  .page-container {
    width: 100%;
    padding: 0 8px;
    display: block;
  }
  .sidebar-left {
    display: none;
  }
  .main-content {
    width: 100%;
  }
  #in_body .main-content .in_bcen,
  #in_body .page-container .in_bcen {
    width: 100%;
  }
}