*{box-sizing:border-box}html,body{margin:0;padding:0}body{font-family:"Microsoft YaHei",Arial,sans-serif;color:#333;background:#fff}
body { overflow-x: hidden;}
.title{font-size:28px;font-weight:600;margin:0 0 24px;letter-spacing:.02em}
.container{max-width:1320px;margin:0 auto;padding:0 20px}
.section{padding:60px 0}.section-light{background:#f5f6f8}
.title{font-size:28px;font-weight:600;margin:0 0 24px;letter-spacing:.02em; text-align: center;}
.intro{font-size:18px;line-height:1.6;margin:0 0 24px;text-align: center;}
.hero{height:100px;position:fixed;top:0;left:0;right:0;z-index:999}
 .hero-inner{width: 1300px;margin: 0 auto;}
.grid{display:grid;gap:20px}.grid-4{grid-template-columns:repeat(4,1fr)}.grid-3{grid-template-columns:repeat(3,1fr)}.grid-2{grid-template-columns:repeat(2,1fr)}
.case-grid{grid-template-columns:repeat(4,1fr)}
.car-grid{grid-template-columns:repeat(3,1fr)}
.card{background:#fff;border-radius:8px;overflow:hidden;box-shadow:0 6px 20px rgba(0,0,0,.06);transition:transform .25s ease}
.card:hover{transform:translateY(-3px)}
.card.chang .thumb{height:475px}
.card.chang:hover .thumb img{transform:scale(1.06)}
.card.small .thumb{height:140px}
.card.wide .thumb{height:220px}
.thumb{height:180px;background:#e9edf3;border-bottom:1px solid rgba(0,0,0,.06);background-image:linear-gradient(135deg,#e6eef9,#f6f9ff);position:relative;overflow:hidden}
.thumb img{width:100%;height:100%;object-fit:cover;display:block;transition:transform .35s ease}
.case-grid .thumb{height:180px;border-radius:8px}
.case-grid2 .thumb {
    height: 220px;
    border-radius: 8px;
}
.case-grid .card:hover .thumb img{transform:scale(1.06)}
.case-grid .card-title{text-align:center}
.product-mosaic{display:grid;grid-template-columns:380px 1fr;gap:20px}
.product-mosaic .left .thumb{height:700px;}
.product-mosaic .right{display:grid;grid-template-rows:433px 296px;gap:20px}
.product-mosaic .right-top{display:grid;grid-template-columns:repeat(3,1fr);gap:20px}
.product-mosaic .right-bottom{display:grid;grid-template-columns:repeat(2,1fr);gap:20px}
.product-mosaic .thumb{height:100%}
.product-mosaic .right-top .thumb{height:380px;}
.product-mosaic .right-bottom .thumb{height:250px;}
.product-mosaic .card-title{text-align:center}
.product-mosaic .card:hover .thumb img{transform:scale(1.06)}
.card-title{padding:14px 16px;font-size:16px}
.news-grid{gap:14px 20px;margin-top:6px}
.news-item{background:#fff;border:1px solid rgba(0,0,0,.08);border-radius:12px;padding:14px 16px;display:flex;align-items:center;gap:12px;text-decoration:none;color:#111;box-shadow:0 6px 16px rgba(0,0,0,.05);transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease, background .2s ease}
.news-item:hover{transform:translateY(-2px);border-color:rgba(214,0,15,.35);box-shadow:0 10px 26px rgba(0,0,0,.08)}
.news-date{flex:0 0 auto;font-size:12px;color:#d6000f;background:rgba(214,0,15,.08);padding:5px 10px;border-radius:999px;line-height:1}
.news-title{flex:1;min-width:0;font-size:15px;line-height:1.3;font-weight:500;color:#111;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}
.news-item:after{content:"›";flex:0 0 auto;color:rgba(0,0,0,.35);font-size:18px;line-height:1}
.news-card{max-width:980px;margin:0 auto}
.news-card .thumb{height:420px}
.news-card .card-title{padding:22px 26px;text-align:left}
.news-card .news-title{font-size:26px;font-weight:700;line-height:1.35;margin:0 0 14px;color:#111}
.news-meta-wrap{display:flex;align-items:center;gap:10px;margin:0 0 18px}
.news-meta{font-size:13px;color:rgba(0,0,0,.55)}
.news-tag{font-size:12px;color:#d6000f;background:rgba(214,0,15,.08);border:1px solid rgba(214,0,15,.18);padding:4px 10px;border-radius:999px;line-height:1}
.news-desc{font-size:16px;line-height:1.9;color:rgba(0,0,0,.78)}
.about {background:url('../../gg/aboutbj.jpg') no-repeat center center;background-size:cover;height:600px;position:relative;margin-top:100px}
.about .container{position:relative;z-index:1; background: #FFF;padding:30px 70px;}
.about-wrap{display:grid;grid-template-columns:0.5fr 1fr;gap:40px;align-items:center}
.about-media{height:320px;border-radius:8px;filter:grayscale(100%)}
.about-media span { width: 50px;height: 4px;background: #d6000f;margin-bottom: 20px;display: block;}
.about-text p{line-height:1.9;margin:0 0 12px}
.stats{display:grid;grid-template-columns:repeat(4,1fr);gap:20px}
.stat{background:#fff;border-radius:10px;padding:24px 20px;text-align:center;box-shadow:0 6px 20px rgba(0,0,0,.06)}
.stat .num{font-size:44px;font-weight:300;color:#d6000f}
.stat .label{opacity:.85;margin-top:6px}
.logos{display:grid;grid-template-columns:repeat(6,1fr);gap:16px}
.logo{height:60px;border-radius:10px;
    /* background:linear-gradient(135deg,#f0f4ff,#ffffff);box-shadow:inset 0 0 0 1px rgba(0,0,0,.06) */
}
.logos .logo img{width:100%;height:100%;object-fit:contain;display:block}
.footer{background:url('../../gg/bottom.jpg') no-repeat center center;color:#aaa}
.footer-wrap{display:flex;align-items:flex-start;justify-content:space-between;padding:40px 20px}
.footer-cols{display:grid;grid-template-columns:repeat(5,1fr);gap:140px}
.footer-title{color:#fff;font-weight:600;margin-bottom:12px}
.footer-title span {display: block;height:3px;background: #d6000f;width: 50%; margin: 0 auto;margin-top: 20px;}
.footer-col ul{list-style:none;margin:0;padding:0}
.footer-col li{line-height:3.0;}
.footer-contact{display:flex;flex-direction:column;align-items:flex-end;gap:10px}
.footer-contact .phone{font-size:22px;color:#fff}
.footer-contact .qr{width:120px;height:120px;background:repeating-linear-gradient(45deg,#fff,#fff 10px,#ddd 10px,#ddd 12px);border-radius:6px}
.footer-contact .qr img{width:100%;height:100%;object-fit:contain;display:block}
.footer-contact .icp{font-size:12px}
.footer-bottom{border-top:1px solid rgba(255,255,255,.08);text-align:center;padding:14px 0;color:#888}
.backtop{position:fixed;right:18px;bottom:18px;width:40px;height:40px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:#d6000f;color:#fff;font-weight:700;cursor:pointer;box-shadow:0 8px 20px rgba(0,0,0,.15);opacity:.85}
.backtop.hide{display:none}
.bg-a{background-image:linear-gradient(135deg,#dfe7ff,#f1f5ff)}
.bg-b{background-image:linear-gradient(135deg,#ffd9d9,#fff1f1)}
.bg-c{background-image:linear-gradient(135deg,#d9ffe6,#f2fff6)}
.bg-d{background-image:linear-gradient(135deg,#fff4d9,#fff9ec)}
.bg-e{background-image:linear-gradient(135deg,#e9d9ff,#f6f0ff)}
.bg-f{background-image:linear-gradient(135deg,#d9f6ff,#effbff)}
.bg-g{background-image:linear-gradient(135deg,#ffd9f1,#fff0f7)}
.bg-h{background-image:linear-gradient(135deg,#d9fff6,#f1fffb)}
.bg-i{background-image:linear-gradient(135deg,#e8ecf3,#ffffff)}
.bg-j{background-image:linear-gradient(135deg,#e8f6ff,#ffffff)}
.bg-k{background-image:linear-gradient(135deg,#ffe8e8,#ffffff)}
.bg-l{background-image:linear-gradient(135deg,#e8ffe8,#ffffff)}
.bg-m{background-image:linear-gradient(135deg,#fff5e8,#ffffff)}
.bg-n{background-image:linear-gradient(135deg,#efe8ff,#ffffff)}
.bg-o{background-image:linear-gradient(135deg,#e8fff9,#ffffff)}
.bg-p{background-image:linear-gradient(135deg,#fff0f3,#ffffff)}
.bg-q{background-image:linear-gradient(135deg,#f0f6ff,#ffffff)}
.bg-r{background-image:linear-gradient(135deg,#fff0f0,#ffffff)}
.bg-s{background-image:linear-gradient(135deg,#f0fff3,#ffffff)}
.bg-t{background-image:linear-gradient(135deg,#fff9f0,#ffffff)}
.bg-u{background-image:linear-gradient(135deg,#f3e8ff,#ffffff)}
.bg-v{background-image:linear-gradient(135deg,#e8faff,#ffffff)}
.bg-w{background-image:linear-gradient(135deg,#ffe8f4,#ffffff)}
.bg-x{background-image:linear-gradient(135deg,#e8fff9,#ffffff)}
.bg-y{background-image:linear-gradient(135deg,#e8ecf3,#ffffff)}
.bg-z{background-image:linear-gradient(135deg,#fff0f0,#ffffff)}
.bg-aa{background-image:linear-gradient(135deg,#f0fff3,#ffffff)}
.button-more { margin: 10px auto;display: inline-block;padding: 10px 20px;
    background: #FFFF;color: #000;text-decoration: none;
    transition: all.3s ease-in-out;font-size: 16px; font-weight: 100; 
     border:#000 solid 1px; }
.button-more:hover {background: #d6000f;color: #FFF;}
.button-more:active {transform: translateY(1px)}
.pagination{display:flex;align-items:center;justify-content:center;gap:10px;flex-wrap:wrap}
.pagination .page-item{min-width:38px;height:38px;padding:0 12px;border-radius:10px;display:inline-flex;align-items:center;justify-content:center;text-decoration:none;color:#333;background:#fff;border:1px solid rgba(0,0,0,.10);box-shadow:0 6px 16px rgba(0,0,0,.05);transition:transform .2s ease, box-shadow .2s ease, border-color .2s ease, background .2s ease, color .2s ease;font-size:14px}
.pagination .page-item:hover{transform:translateY(-1px);border-color:rgba(214,0,15,.35);color:#d6000f;box-shadow:0 10px 22px rgba(0,0,0,.08)}
.pagination .page-item.active{background:#d6000f;border-color:#d6000f;color:#fff;box-shadow:0 10px 22px rgba(214,0,15,.20)}
.pagination .page-item.active:hover{transform:none}
@media (max-width:1360px){.container{max-width:1100px}.grid-4{grid-template-columns:repeat(3,1fr)}.about-wrap{grid-template-columns:1.1fr 1fr}}
@media (max-width:1024px){.container{max-width:860px}.grid-4{grid-template-columns:repeat(2,1fr)}.grid-3{grid-template-columns:repeat(2,1fr)}.case-grid{grid-template-columns:repeat(2,1fr)}.about-wrap{grid-template-columns:1fr}.about-media{height:220px}}
@media (max-width:640px){.container{max-width:100%}.title{font-size:22px}.hero{height:320px}.stat .num{font-size:22px}.logos{grid-template-columns:repeat(3,1fr)}.grid-2{grid-template-columns:1fr}.news-grid{gap:10px}.news-item{padding:12px 12px;border-radius:10px}.news-title{font-size:14px}.news-date{padding:5px 8px}.news-card .thumb{height:220px}.news-card .card-title{padding:16px 14px}.news-card .news-title{font-size:18px;margin:0 0 10px}.news-desc{font-size:14px;line-height:1.8}.pagination{gap:8px}.pagination .page-item{min-width:34px;height:34px;border-radius:9px;padding:0 10px}.case-grid{grid-template-columns:1fr}.product-mosaic{grid-template-columns:1fr}.product-mosaic .right{grid-template-rows:auto auto}.product-mosaic .left .thumb{height:280px}}
.swiper-container{width:100%;}
.swiper-slide{position:relative}
.swiper-slide img{width:100%;height:100%;object-fit:cover;display:block}
.swiper-pagination-bullet{background:rgba(255,255,255,.8);opacity:1}
.swiper-pagination-bullet-active{background:#d6000f}
.swiper-button-next,.swiper-button-prev{color:#fff;filter:drop-shadow(0 2px 8px rgba(0,0,0,.35))}
.swiper-container .swiper-button-next,.swiper-container .swiper-button-prev{--swiper-navigation-size:28px}