*{ margin:0; padding:0; box-sizing:border-box }
body{ font-family:"Microsoft YaHei",Arial,sans-serif; color:#666; line-height:1.6; background-color:#f5f5f5 }
.text-center{ text-align:center }
.container{ width:1400px; margin:0 auto }
.wrap{ width:1400px; margin:0 auto }
@media(min-width:1201px)and (max-width:1480px){ .wrap,.container{width:92% }
}
@media(max-width:1200px){ .wrap,.container{width:92% }
}
.card{ background-color:#fff; border-radius:8px; overflow:hidden; box-shadow:0 4px 12px rgba(0,0,0,.08); transition:all .3s ease }
.card:hover{ transform:translateY(-5px); box-shadow:0 8px 24px rgba(0,0,0,.12) }
.card .card-image{ height:200px; overflow:hidden }
.card .card-image img{ width:100%; height:100%; object-fit:cover }
.card .card-content{ padding:20px }
.card .card-content h3{ font-size:20px; margin-bottom:15px; color:#333 }
.card .card-content p{ color:#666; line-height:1.7; margin-bottom:20px }
#mapPopup{ position:fixed; top:0; left:0; width:100%; height:100%; display:flex; justify-content:center; align-items:center; z-index:9999; opacity:0; visibility:hidden; transition:all .3s ease }
#mapPopup.active{ opacity:1; visibility:visible }
#mapPopup.active .popup-content{ transform:scale(1) }
#mapPopup .popup-content{ background-color:#fff; border-radius:8px; padding:30px; width:90%; max-width:600px; max-height:80vh; overflow-y:auto; position:relative; transform:scale(0.9); transition:transform .3s ease }
#mapPopup .popup-content::-webkit-scrollbar{ width:8px }
#mapPopup .popup-content::-webkit-scrollbar-track{ background:#f1f1f1; border-radius:4px }
#mapPopup .popup-content::-webkit-scrollbar-thumb{ background:#ccc; border-radius:4px }
#mapPopup .popup-content::-webkit-scrollbar-thumb:hover{ background:#aaa }
#mapPopup .popup-title{ font-size:28px; color:#000; margin-bottom:25px; padding-bottom:20px; border-bottom:1px solid #e0e0e0; font-weight:bold; text-align:center; display:none }
#mapPopup .popup-close{ position:absolute; top:20px; right:20px; width:35px; height:35px; border:none; border-radius:50%; cursor:pointer; display:flex; justify-content:center; align-items:center; font-size:24px; color:#666; transform-origin:center center; transition:all .3s ease }
#mapPopup .popup-close:hover{ color:#333; transform:rotate(90deg) scale(1) }
#mapPopup .popup-body{ font-size:16px; line-height:1.8 }
#mapPopup .popup-item h3{ font-size:22px; font-weight:bold; margin-bottom:25px; color:#ffb500; padding-bottom:15px; border-bottom:1px solid #eee }
#mapPopup .popup-item h2{ font-size:16px; color:#000 }
#mapPopup .popup-item dl{ margin:0 }
#mapPopup .popup-item dl dt{ font-weight:bold; margin-bottom:10px; color:#555; font-size:18px }
#mapPopup .popup-item dl dd{ margin-bottom:20px; color:#666; line-height:1.8; font-size:16px }
#mapPopup .popup-item dl dd p{ margin:8px 0; display:flex; align-items:center }
#mapPopup .popup-item dl dd p img{ margin-right:8px; vertical-align:middle }
.grid{ display:grid; grid-template-columns:repeat(4,1fr); gap:30px; margin-bottom:30px }
.grid-2{ display:grid; grid-template-columns:repeat(2,1fr); gap:30px }
.grid-3{ display:grid; grid-template-columns:repeat(3,1fr); gap:30px }
.header{ background-color:#fff; box-shadow:0 2px 8px rgba(0,0,0,.1); position:fixed; top:0; left:0; right:0; z-index:1000 }
.header-top{ height:90px; display:flex; align-items:center; position:relative }
.header-top-wrap{ display:flex; justify-content:space-between; align-items:center }
.header-top .logo{ display:flex; align-items:center; gap:10px; font-size:24px; color:#333; font-weight:bold; text-decoration:none }
.header-top .logo img{ max-height:40px }
.header-top-right{ display:flex; align-items:center }
.header-top-right-search{ background:rgba(0,0,0,.1); padding:8px 16px; border-radius:4px; height:36px; line-height:36px; margin-right:24px; display:flex; align-items:center }
.header-top-right-search input{ background:none; border:0 none; display:block; width:80% }
.header-top-right-search a{ width:20%; display:flex; justify-content:flex-end; align-items:center }
.header-top-right a{ font-size:14px; color:#000 }
.header-top-right span{ color:#bababa; margin:0 10px }
.header-btm{ background:#ffb500; height:55px; position:relative }
.header-btm ul{ width:100%; height:55px; display:flex; align-items:center }
.header-btm ul li{ height:100%; display:flex; align-items:center; margin-right:10% }
.header-btm ul li>a{ line-height:55px; font-size:16px; color:#000; position:relative; height:100% }
.header-btm ul li>a.active::after,.header-btm ul li>a:hover::after{ content:""; width:20px; height:2px; background:#000; position:absolute; bottom:10px; left:50%; transform:translate(-50%); display:block }
.header-btm .has-submenu>a{ padding-right:20px }
.header-btm .has-submenu>a::before{ content:""; position:absolute; top:50%; right:0; transform:translateY(-50%) rotate(45deg); transform-origin:50% 50%; width:8px; height:8px; border-right:2px solid #000; border-bottom:2px solid #000; transition:transform .3s ease }
.header-btm .has-submenu:hover>a::before{ transform:translateY(-40%) rotate(225deg) }
.header-btm .sub-menu{ opacity:0; visibility:hidden; transform:translateY(-10px); transition:all .3s ease; position:absolute; top:100%; left:0; right:0; background:#fff; box-shadow:0 4px 12px rgba(0,0,0,.1); z-index:100 }
.header-btm .has-submenu>a:hover+.sub-menu,.header-btm .has-submenu:hover .sub-menu,.header-btm .sub-menu:hover{ opacity:1; visibility:visible; transform:translateY(0) }
.header-btm .sub-menu{ width:100% }
.header-btm .sub-menu .wrap{ display:flex; align-items:flex-start; justify-content:center }
.header-btm .sub-menu a{ line-height:92px; font-size:16px; color:#000; display:flex; align-items:center; margin:0 1% }
.header-btm .sub-menu a:hover{ color:#ffb500 }
.header-btm .sub-menu a img{ margin-right:10px }
.header-btm .product-sub-menu{ background:#fff; width:100%; height:400px; position:absolute; left:0; top:100%; z-index:100; box-shadow:0px 10px 20px 0px rgba(0,0,0,.08); overflow:hidden }
.header-btm .product-sub-menu .wrap{ justify-content:center; grid-gap:20px }
.header-btm .product-sub-menu dl{ width:30% }
.header-btm .product-sub-menu dt{ width:100%; margin:24px 0 16px }
.header-btm .product-sub-menu dt a{ font-size:16px; color:#ffb500; display:flex; align-items:center; line-height:40px }
.header-btm .product-sub-menu dt a img{ margin-right:10px; width:20px; height:20px }
.header-btm .product-sub-menu dd a{ font-size:16px; color:#000; line-height:32px }
.header-btm .product-sub-menu dd a:hover{ color:#ffb500 }
.header .mobile-menu-btn,.header .mobile-close-btn{ display:none }
@media(max-width:1200px){ .header{background:#ffb500 }
.header-top{ height:60px }
.header-top img{ height:30px }
.header-top-right{ display:none }
.header-btm{ background:none; height:60px; position:fixed; top:0; left:0; right:0; z-index:1000 }
.header-btm .wrap{ position:relative; height:100%; padding:0 20px }
.header-btm ul{ width:90%; height:auto; max-height:calc(100vh - 60px); overflow-y:auto; display:flex; flex-direction:column; align-items:stretch; position:fixed; top:60px; left:-100%; bottom:0; background:#fff; padding:0; margin:0; z-index:1001; transition:left .3s ease }
.header-btm ul.mobile-active{ left:0 }
.header-btm ul li{ height:auto; display:block; margin-right:0; border-bottom:1px solid rgba(0,0,0,.1) }
.header-btm ul li>a{ line-height:50px; font-size:16px; color:#000; position:relative; height:auto; display:block; padding:0 20px }
.header-btm ul li>a.active,.header-btm ul li>a:hover{ background:rgba(0,0,0,.05) }
.header-btm ul li>a.active::after,.header-btm ul li>a:hover::after{ display:none }
.header-btm .has-submenu>a{ padding-right:40px }
.header-btm .has-submenu>a::before{ right:20px; transform:translateY(-50%) rotate(0deg); border:none; border-right:2px solid #000; border-top:2px solid #000; width:10px; height:10px }
.header-btm .has-submenu.active>a::before{ transform:translateY(-50%) rotate(90deg) }
.header-btm .sub-menu,.header-btm .product-sub-menu{ position:static; opacity:1; visibility:visible; transform:none; background:rgba(0,0,0,.05); box-shadow:none; padding:0; display:none; max-height:500px; overflow-y:auto }
.header-btm .sub-menu.active,.header-btm .product-sub-menu.active{ display:block; animation:slideDown .3s ease-out }
.header-btm .sub-menu .wrap,.header-btm .product-sub-menu .wrap{ display:block; padding:0 }
.header-btm .sub-menu .wrap dl,.header-btm .product-sub-menu .wrap dl{ margin:0; display:block; width:100% }
.header-btm .sub-menu .wrap dl dt,.header-btm .product-sub-menu .wrap dl dt{ display:block; line-height:40px; padding:0; font-size:14px; color:#333; background:rgba(0,0,0,.1); margin:0 }
.header-btm .sub-menu .wrap dl dd,.header-btm .product-sub-menu .wrap dl dd{ margin:0; border-bottom:1px solid rgba(0,0,0,.05) }
.header-btm .sub-menu .wrap dl dd:last-child,.header-btm .product-sub-menu .wrap dl dd:last-child{ border-bottom:none }
.header-btm .sub-menu .wrap dl dd a,.header-btm .product-sub-menu .wrap dl dd a{ line-height:40px; padding:0 40px; font-size:14px; color:#333; display:block }
.header-btm .sub-menu .wrap dl dd a:hover,.header-btm .product-sub-menu .wrap dl dd a:hover{ background:rgba(0,0,0,.1) }
.header-btm .sub-menu .wrap a,.header-btm .product-sub-menu .wrap a{ line-height:40px; padding:0 40px; font-size:14px; color:#333; display:block; padding:0 }
.header-btm .sub-menu .wrap a:hover,.header-btm .product-sub-menu .wrap a:hover{ background:rgba(0,0,0,.1) }
.header-btm .sub-menu .wrap a p,.header-btm .product-sub-menu .wrap a p{ margin:0 }
.header-btm .sub-menu .wrap a img,.header-btm .product-sub-menu .wrap a img{ display:none }
.header-btm .product-sub-menu.active{ display:block !important }
.header-btm .product-sub-menu .wrap dl{ display:block; width:100%; float:none }
@keyframes slideDown{ from{opacity:0; transform:translateY(-10px) }
to{ opacity:1; transform:translateY(0) }
}
.header .mobile-menu-btn{ display:block; position:absolute; top:50%; right:20px; transform:translateY(-50%); font-size:24px; background:none; border:none; cursor:pointer; z-index:1002; color:#000 }
.header .mobile-close-btn{ display:block; position:absolute; top:22px; right:20px; font-size:32px; background:none; border:none; cursor:pointer; z-index:1002; color:#fff; display:none }
.header .mobile-close-btn::before{ content:"×" }
.header .mobile-header-top-right{ padding:20px; border-top:1px solid rgba(0,0,0,.05); text-align:center }
.header .mobile-header-top-right div{ display:flex; flex-direction:column; gap:15px }
.header .mobile-header-top-right div .header-top-right-search{ margin:0 auto; width:100%; display:flex; background:rgba(0,0,0,.1) !important; justify-content:space-between; flex-direction:row; margin-bottom:10px }
.header .mobile-header-top-right div a{ color:#333; font-size:14px }
.header .mobile-header-top-right div a:hover{ color:#06c }
.header .mobile-header-top-right div span{ display:none }
.mobile-overlay{ display:none; position:fixed; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,.5); z-index:999 }
.mobile-overlay.active{ display:block }
}
.footer{ background-color:#333; color:#fff }
.footer-top{ border-bottom:1px solid hsla(0,0%,100%,.1); padding:24px 0 }
.footer-content{ padding:24px 0; display:flex; align-items:center; justify-content:center; align-items:flex-start }
.footer-content-left{ width:30% }
.footer-content-left h3{ color:#fff; font-size:14px; position:relative; margin-bottom:20px; font-weight:normal }
.footer-content-left p{ color:hsla(0,0%,100%,.5); line-height:32px }
.footer-content-left p b,.footer-content-left p strong,.footer-content-left p span{ font-weight:normal; color:hsla(0,0%,100%,.8) }
.footer-content-left .footer-column-social{ margin-top:32px; display:flex; align-items:center; gap:20px }
.footer-content-left .footer-column-social a{ display:block }
.footer-content-center{ width:calc(70% - 158px); margin:0 24px; display:flex }
.footer-content-center .footer-column{ width:23%; margin:0 1% }
.footer-content-center h3{ font-size:14px; position:relative; margin-bottom:20px; color:#ffb500; font-weight:normal }
.footer-content-right{ width:110px; height:110px; display:block }
.footer-content ul{ list-style:none }
.footer-content ul li a{ color:hsla(0,0%,100%,.5); text-decoration:none; line-height:32px; transition:all .3s ease }
.footer-content ul li a:hover{ color:#ffb500; padding-left:5px }
.footer-bottom{ text-align:center; padding:16px 0; border-top:1px solid hsla(0,0%,100%,.1); color:hsla(0,0%,100%,.5); font-size:14px }
.footer-bottom a{ color:hsla(0,0%,100%,.5) }
.sub-page,.home-banner{ margin-top:145px }
@media(max-width:1200px){ .sub-page,.home-banner{margin-top:60px }
}
.banner{ height:400px; position:relative; overflow:hidden }
.banner-content{ display:flex; align-items:center; justify-content:center; width:100%; height:100%; z-index:1; color:#fff; position:absolute; left:0; top:0 }
.banner-content h1{ font-size:42px; margin-bottom:10px; font-weight:400 }
.banner-content p{ font-size:20px; text-transform:uppercase }
.banner-image{ position:absolute; display:block; width:100%; height:100%; object-fit:cover }
.home-banner{ width:100%; height:800px }
.home-banner .banner{ height:100% }
@media(max-width:1200px){ .banner{height:200px }
.banner .banner-content h1{ font-size:24px }
.banner .banner-content p{ font-size:14px }
.home-banner .swiper-button-next,.home-banner .swiper-button-prev{ display:none }
}
.home-page .section-title{ position:relative }
.home-page .section-title h2{ font-size:24px; font-weight:bold; color:#000; display:flex; align-items:center }
.home-page .section-title h2::after{ content:""; width:60px; height:2px; background:#000; display:block; margin-left:10px }
.home-page .section-title p{ font-weight:500; font-size:42px; color:rgba(0,0,0,.1); line-height:62px; margin-top:-10px }
.home-page .section-title .btn-more{ position:absolute; right:0; top:50%; transform:translate(0,-50%) }
.home-page .btn-more{ width:130px; height:36px; border-radius:20px; border:1px solid rgba(0,0,0,.5); display:block; text-align:center; line-height:36px; position:relative; overflow:hidden; color:#000; z-index:1 }
.home-page .btn-more::before{ content:""; position:absolute; top:0; left:-100%; width:100%; height:100%; background:#ffb500; transition:left .3s ease; z-index:-1 }
.home-page .btn-more:hover{ border-color:#ffb500; color:#fff }
.home-page .btn-more:hover::before{ left:0 }
.home-page .about-section{ padding:60px 0; background-color:#f9f9f9 }
.home-page .about-section .intro-content{ margin-top:56px; gap:60px; align-items:center }
.home-page .about-section .intro-content .intro-image{ position:relative }
.home-page .about-section .intro-content .intro-image::after{ content:""; display:block; width:220px; height:160px; position:absolute; right:-10px; bottom:-10px; background:#ffb500 }
.home-page .about-section .intro-content .intro-image img{ border-radius:0; position:relative; z-index:3 }
.home-page .about-section .intro-content .intro-text h3{ color:#ffb500; font-size:28px; font-weight:bold }
.home-page .about-section .intro-content .intro-text-wrap{ margin:40px 0 }
.home-page .about-section .intro-content .intro-text p{ font-size:16px; color:#000; line-height:32px }
.home-page .products-section{ background-size:cover; background-repeat:no-repeat; padding:60px 0; background-color:#fff }
.home-page .products-section .products-swiper{ width:100%; padding:60px 24px 80px }
.home-page .products-section .products-swiper .product-swiper-btn{ display:flex; align-items:center; justify-content:center; height:44px; width:100%; position:absolute; z-index:9; bottom:0; display:none }
.home-page .products-section .products-swiper .product-swiper-btn .swiper-button-next,.home-page .products-section .products-swiper .product-swiper-btn .swiper-button-prev{ background-color:#ffb500; width:44px; height:44px; border-radius:50%; margin:0 10px; position:static; color:#fff }
.home-page .products-section .products-swiper .product-swiper-btn .swiper-button-next::after,.home-page .products-section .products-swiper .product-swiper-btn .swiper-button-prev::after{ font-size:18px }
.home-page .products-section .product-card{ background-color:#fff; border-radius:8px; overflow:hidden; box-shadow:0 4px 12px rgba(0,0,0,.08); transition:all .3s ease; position:relative; border-radius:20px; width:90%; margin:0 auto }
.home-page .products-section .product-card:hover{ transform:translateY(-5px); box-shadow:0 8px 24px rgba(0,0,0,.12) }
.home-page .products-section .product-card::after{ background:#ffb500; width:100%; height:10px; display:block; content:""; position:absolute; bottom:0 }
.home-page .products-section .product-card .product-image{ height:260px; overflow:hidden; background:#bdbdbd }
.home-page .products-section .product-card .product-image img{ width:100%; height:100%; object-fit:contain }
.home-page .products-section .product-card .product-info{ padding:10px 10px 32px 10px }
.home-page .products-section .product-card .product-info h3{ font-size:18px; margin-top:10px; color:#333; text-align:center }
.home-page .products-section .product-card .product-info p{ font-size:16px; color:#999; padding:0 10px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical }
.home-page .products-section .products-list{ width:100%; display:flex; gap:30px; margin-top:48px; justify-content:space-between; align-items:center }
.home-page .products-section .products-list-item{ width:440px; overflow:hidden; height:580px; background:#fff; border-radius:20px }
.home-page .products-section .products-list-item h1{ background:url("../images/bg-product-title-new.png") no-repeat; width:100%; height:69px; text-align:center; line-height:69px; font-size:20px; color:#000; font-weight:bold; background-size:100% 100% }
.home-page .products-section .products-list-item .desc{ padding:0 5%; font-size:16px; color:rgba(0,0,0,.6); height:168px; line-height:28px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:6; -webkit-box-orient:vertical }
.home-page .products-section .products-list-item-swiper{ width:90%; height:310px; margin:0 auto }
.home-page .products-section .products-list-item-swiper img{ max-width:100%; display:block; height:240px; object-fit:contain; margin:0 auto }
.home-page .products-section .products-list-item-swiper p{ font-size:14px; color:#000; height:30px; line-height:30px; text-align:center; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:1; -webkit-box-orient:vertical; margin-top:10px }
.home-page .news-section{ background:#f5f5f5; padding:80px 0 }
.home-page .news-section .news-swiper{ width:100%; padding:100px 0 0; position:relative; margin-top:-65px }
.home-page .news-section .news-swiper .news-swiper-btn{ display:flex; align-items:center; justify-content:center; justify-content:flex-end; width:100%; position:absolute; z-index:9; top:0; right:0 }
.home-page .news-section .news-swiper .news-swiper-btn .swiper-button-next,.home-page .news-section .news-swiper .news-swiper-btn .swiper-button-prev{ background-color:#ffb500; width:44px; height:44px; border-radius:50%; margin:0 10px; position:static; color:#fff }
.home-page .news-section .news-swiper .news-swiper-btn .swiper-button-next::after,.home-page .news-section .news-swiper .news-swiper-btn .swiper-button-prev::after{ font-size:18px }
.home-page .news-section .news-card{ background:none; padding-right:40px; border-right:1px solid rgba(0,0,0,.1) }
.home-page .news-section .news-card .news-image{ width:100%; height:260px; overflow:hidden; margin-top:30px }
.home-page .news-section .news-card .news-image img{ transition:transform .5s }
.home-page .news-section .news-card .news-image:hover img{ transform:scale(1.05) }
.home-page .news-section .news-card .news-image img{ width:100%; height:100%; object-fit:cover; border-radius:10px }
.home-page .news-section .news-card .news-content .news-date{ color:#000; font-size:18px }
.home-page .news-section .news-card .news-content h3{ font-size:18px; margin-bottom:10px; color:#ffb500; margin:20px 0; height:76px; line-height:38px; font-weight:normal; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical }
.home-page .news-section .news-card .news-content p{ color:#000; margin-bottom:15px; font-size:16px; line-height:35px; height:70px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical }
.home-page .honor-section{ background-repeat:no-repeat; background-position:center center; background-size:cover; height:510px; overflow:hidden; padding:60px 0; box-sizing:content-box }
.home-page .honor-section .honor-list{ display:flex; flex-wrap:wrap; margin-top:40px }
.home-page .honor-section .honor-list a{ width:30%; margin-right:10%; display:flex; align-items:center; font-size:16px; color:#000; border-bottom:1px solid #ffb500; margin-top:40px; padding-bottom:20px }
.home-page .honor-section .honor-list a:hover{ color:#ffb500 }
.home-page .honor-section .honor-list a::before{ content:""; width:6px; height:6px; background:#ffb500; display:block; margin-right:10px; border-radius:50% }
.home-page .honor-section .honor-list a p{ width:calc(100% - 16px); overflow:hidden; text-overflow:ellipsis; white-space:nowrap }
.home-page .partner-section{ background-image:url("../images/bg_join.png"); background-repeat:no-repeat; background-position:center center; background-size:cover; height:450px; overflow:hidden }
.home-page .partner-section .container{ height:100%; display:flex; align-items:center; justify-content:center; flex-direction:column }
.home-page .partner-section h1{ text-align:center; font-size:36px; color:#fff; font-weight:400 }
.home-page .partner-section .btn-more{ background:#ffb500; border:1px solid #ffb500; color:#fff; margin-top:40px }
@media(max-width:1200px){ .home-page .section-title h2{font-size:20px }
.home-page .section-title h2::after{ display:none }
.home-page .section-title p{ line-height:1; font-size:18px }
.home-page .about-section .intro-content{ flex-direction:column; margin-top:20px }
.home-page .about-section .intro-content .intro-text-wrap{ margin:20px 0 }
.home-page .about-section .intro-content .intro-image{ width:100% }
.home-page .about-section .intro-content .intro-text h3{ font-size:20px }
.home-page .products-section .products-swiper{ padding:24px 0 80px }
.home-page .products-section .products-list{ flex-direction:column }
.home-page .products-section .products-list-item{ width:100% }
.home-page .products-section .products-list-item .desc{ font-size:14px }
.home-page .news-section{ padding:40px 0 }
.home-page .news-section .news-swiper{ margin-top:-50px; padding-top:70px }
.home-page .news-section .news-card{ padding-right:0; border-right:0 }
.home-page .news-section .news-card .news-content h3{ margin:0; font-size:16px; height:60px; line-height:30px }
.home-page .news-section .news-card .news-content p{ font-size:14px; height:56px; line-height:28px }
.home-page .news-section .news-card .news-image{ margin-top:20px }
.home-page .honor-section{ height:auto }
.home-page .honor-section .honor-list{ flex-direction:column; margin-top:20px }
.home-page .honor-section .honor-list a{ width:100%; margin-top:10px }
.home-page .partner-section h1{ font-size:20px }
}
.intro-content{ display:flex; gap:30px }
.intro-content .intro-image{ width:60% }
.intro-content .intro-image img{ width:100%; border-radius:5px }
.intro-content .intro-text{ flex:1 }
.intro-content .intro-text h3{ font-size:20px; margin-bottom:15px; color:#333 }
.intro-content .intro-text p{ margin-bottom:15px; line-height:1.8 }
.timeline{ position:relative; margin:5% 0 }
.timeline:before{ content:""; position:absolute; top:0; left:120px; width:1px; height:100%; background-color:#ddd }
.timeline-item{ position:relative; margin-bottom:30px }
.timeline-item:before{ content:""; position:absolute; top:0; left:110px; top:50%; margin-top:-10px; width:12px; height:12px; border-radius:50%; background-color:#fff; border:4px solid #ffb500 }
.timeline-item .timeline-year{ font-size:24px; font-weight:bold; color:#ffb500; position:absolute; left:0; padding:10px 0; top:50%; transform:translate(0,-50%) }
.timeline-item .timeline-content{ background:linear-gradient(270deg,rgba(0,0,0,0) 0%,rgba(0,0,0,0.1) 100%); border-radius:0px 0px 0px 0px; padding:20px; margin-left:120px }
.timeline-item .timeline-content p{ font-size:16px; color:#000; line-height:1.6 }
@media(max-width:1200px){ .timeline-item::before{left:80px }
.timeline-item .timeline-year{ font-size:18px }
.timeline-item .timeline-content{ margin-left:90px }
.timeline:before{ left:90px }
}
.cert-grid{ margin:5% 0; display:grid; grid-template-columns:repeat(3,1fr); gap:20px }
.cert-grid .cert-item{ text-align:center; padding:20px; border:1px solid rgba(0,0,0,0); border-radius:5px; transition:all .3s ease }
.cert-grid .cert-item:hover{ border-color:#ffb500; transform:translateY(-5px); box-shadow:0 4px 12px rgba(0,0,0,.08) }
.cert-grid .cert-item img{ max-width:100%; height:auto; margin-bottom:15px }
.cert-grid .cert-item h2{ font-size:16px; color:#000 }
.cert-grid .cert-item p{ font-size:16px; color:rgba(0,0,0,.6) }
@media(max-width:1200px){ .cert-grid{grid-template-columns:repeat(1,1fr) }
.cert-grid .cert-item{ padding:0; margin-bottom:10px }
}
.employee-word{ background-repeat:no-repeat; background-position:center center; background-size:cover }
.employee-swiper{ width:100%; padding:10% 0 }
.employee-swiper .swiper-slide{ transform:scale(0.7); border-radius:4px; overflow:hidden; height:520px }
.employee-swiper .swiper-slide-img{ height:480px }
.employee-swiper .swiper-slide img{ width:100%; height:100%; display:block; object-fit:contain }
.employee-swiper .swiper-slide p{ font-size:16px; height:30px; line-height:30px; color:#000; text-align:center; margin-top:10px; display:none }
.employee-swiper .swiper-slide-active,.employee-swiper .swiper-slide-duplicate-active{ transform:scale(1.3) }
.employee-swiper .swiper-slide-active p,.employee-swiper .swiper-slide-duplicate-active p{ display:block }
@media(max-width:1200px){ .employee-swiper .swiper-slide-active,.employee-swiper .swiper-slide-duplicate-active{transform:scale(1) }
}
.product-detail .product-richtext{ margin:32px 0 48px }
.product-detail .product-intro{ margin:32px 0 48px; display:flex; gap:30px }
.product-detail .product-intro-left{ width:50% }
.product-detail .product-intro-left .product-intro-swiper{ height:340px }
.product-detail .product-intro-left .product-intro-swiper .swiper{ height:100% }
.product-detail .product-intro-left .product-intro-swiper img{ width:100%; height:100%; object-fit:cover }
.product-detail .product-intro-left .product-intro-swiper-thumb{ height:60px; margin-top:20px; position:relative }
.product-detail .product-intro-left .product-intro-swiper-thumb .swiper{ width:calc(100% - 60px); height:100% }
.product-detail .product-intro-left .product-intro-swiper-thumb img{ width:100%; height:100%; object-fit:cover }
.product-detail .product-intro-left .product-intro-swiper-thumb .swiper-button-next,.product-detail .product-intro-left .product-intro-swiper-thumb .swiper-button-prev{ color:#ffb500; width:auto }
.product-detail .product-intro-left .product-intro-swiper-thumb .swiper-button-next::after,.product-detail .product-intro-left .product-intro-swiper-thumb .swiper-button-prev::after{ font-size:24px }
.product-detail .product-intro-left .product-intro-swiper-thumb .swiper-button-next{ right:0 }
.product-detail .product-intro-left .product-intro-swiper-thumb .swiper-button-prev{ left:0 }
.product-detail .product-intro-right{ height:340px; width:50%; display:flex; justify-content:center; flex-direction:column }
.product-detail .product-intro-right h3{ font-size:26px; color:#000 }
.product-detail .product-intro-right p{ margin:32px 0; display:flex; justify-content:space-between; font-size:14px; color:rgba(0,0,0,.6) }
.product-detail .product-intro-right-btns{ width:100%; display:flex; gap:20px }
.product-detail .product-intro-right-btns .product-intro-right-btn{ font-size:15px; color:#fff; text-align:center; height:45px; line-height:45px; border-radius:4px; width:40% }
.product-detail .product-intro-right-btns .product-intro-right-btn:first-child{ background:#ffb500 }
.product-detail .product-intro-right-btns .product-intro-right-btn:last-child{ background:#5f5f5f }
.product-detail .product-recommend{ margin:32px 0 48px; width:100%; position:relative }
.product-detail .product-recommend .swiper-button-next,.product-detail .product-recommend .swiper-button-prev{ width:auto; color:#ffb500 }
.product-detail .product-recommend .swiper-button-next::after,.product-detail .product-recommend .swiper-button-prev::after{ font-size:32px }
.product-detail .product-recommend .swiper-button-next{ right:0 }
.product-detail .product-recommend .swiper-button-prev{ left:0 }
.product-detail .product-recommend-swiper{ width:calc(100% - 100px); margin:0 auto }
.product-detail .product-recommend img{ width:100%; height:220px; object-fit:cover }
.product-detail .product-recommend h2{ font-size:16px; color:#000; text-align:center; margin:10px 0 }
.product-detail .product-recommend p{ font-size:14px; color:rgba(0,0,0,.6); text-align:center }
@media(max-width:1200px){ .product-detail .product-intro{flex-direction:column }
.product-detail .product-intro-left,.product-detail .product-intro-right{ width:100% }
.product-detail .product-intro-right{ height:auto }
}
.news-list{ margin:5% 0 }
.news-list .news-item{ display:flex; justify-content:space-between; height:230px; margin-bottom:30px }
.news-list .news-item:hover{ transition:all .3s ease }
.news-list .news-item .news-image{ width:360px; height:230px; overflow:hidden }
.news-list .news-item .news-image img{ width:100%; height:100%; object-fit:cover; transition:transform .5s }
.news-list .news-item .news-image img:hover{ transform:scale(1.05) }
.news-list .news-item .news-info{ width:calc(100% - 400px); display:flex; flex-direction:column; justify-content:center }
.news-list .news-item .news-info .date{ font-size:18px; color:#ffb500 }
.news-list .news-item .news-info h3{ font-size:18px; color:#000; text-align:left; margin:20px 0 0 0; height:60px; line-height:30px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical }
.news-list .news-item .news-info .desc{ font-size:16px; color:#000; height:56px; line-height:28px; margin-top:20px; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical }
.news-list .news-item .news-info .more{ width:120px; height:32px; text-align:center; line-height:32px; border-radius:20px 20px 20px 20px; font-size:14px; color:rgba(0,0,0,.5); border:1px solid rgba(0,0,0,.5); position:relative; overflow:hidden; transition:color .3s ease; background-color:rgba(0,0,0,0); z-index:1; margin-top:20px }
.news-list .news-item .news-info .more::before{ content:""; position:absolute; top:0; left:-100%; width:100%; height:100%; background-color:#ffb500; transition:left .3s ease; z-index:-1 }
.news-list .news-item .news-info .more:hover{ color:#fff; border-color:#ffb500 }
.news-list .news-item .news-info .more:hover::before{ left:0 }
.news-detail{ margin:5% 0 }
.news-detail-title{ font-size:26px; color:#000; font-weight:bold; text-align:center; margin-top:32px }
.news-detail-msg{ display:flex; flex-direction:row; align-items:center; justify-content:center; margin:24px 0 }
.news-detail-msg p{ display:flex; flex-direction:row; align-items:center; justify-content:flex-start; margin:0 20px }
.news-detail-msg p:before{ background-size:100% 100%; background-repeat:no-repeat; width:18px; height:18px; display:block; content:""; margin-right:10px }
.news-detail-msg p.time::before{ background-image:url("../images/icon-time.png") }
.news-detail-msg p.view::before{ background-image:url("../images/icon-view.png") }
.news-detail-richtext{ padding:5%; font-size:16px; color:#000; font-weight:normal; border-top:1px solid rgba(0,0,0,.1); border-bottom:1px solid rgba(0,0,0,.1); line-height:32px; overflow:hidden; word-break:break-all }
.news-detail-richtext img{ max-width:100%; height:auto !important }
.news-detail-prev-next{ padding:2% 5% }
.news-detail-prev-next dl{ width:100%; line-height:32px; display:flex }
.news-detail-prev-next dl dt{ font-size:16px; color:#ffb500; margin-right:5px }
.news-detail-prev-next dl dt a{ font-size:.16px; color:#000; font-weight:normal }
.join-detail .join-richtext{ font-size:16px; color:#000; line-height:32px }
.join-detail .join-richtext .item{ text-align:left; font-size:16px; color:#000; font-weight:bold; margin-top:36px; margin-bottom:12px; display:flex }
.join-detail .join-richtext .item p{ color:#000 }
.join-detail .join-btn{ width:220px; height:50px; line-height:50px; background:#ffb500; border-radius:4px 4px 4px 4px; opacity:.8; font-size:16px; color:#fff; display:flex; align-items:center; justify-content:space-between; text-align:center; margin:32px 0; text-indent:2em }
.join-detail .join-btn::after{ background:url("../images/line1.png") no-repeat; width:32px; height:23px; display:block; content:""; margin-right:20px; background-size:100% 100% }
.contact{ overflow:hidden }
.contact .contact-top{ display:flex; padding:2% 0; align-items:center }
.contact .contact-top .form-message-map{ width:50% }
.contact .contact-top .form-message-map img{ width:100% }
.contact .contact-top .form-message-info{ margin-left:5% }
.contact .contact-top .form-message-info h3{ font-size:20px; color:#000 }
.contact .contact-top .form-message-info-item{ display:flex; align-items:center; margin-top:32px }
.contact .contact-top .form-message-info-item img{ width:36px; height:36px }
.contact .contact-top .form-message-info-item dl{ width:calc(100% - 56px); margin-left:20px }
.contact .contact-top .form-message-info-item dt{ font-size:16px; color:#ffb500; font-weight:bold }
.contact .contact-top .form-message-info-item dd{ font-size:16px; color:#000 }
.contact .contact-cen dl{ margin-top:32px }
.contact .contact-cen dl:first-child{ margin-top:0 }
.contact .contact-cen dt{ font-size:16px; color:#ffb500; font-weight:bold; margin-bottom:16px }
.contact .contact-cen dd{ line-height:32px; display:flex; align-items:center; font-size:16px; color:#000 }
.contact .contact-cen dd img{ width:18px; height:18px; margin-right:10px }
.contact .contact-cen dd p{ width:calc(100% - 28px) }
.contact .contact-btm{ margin-bottom:48px }
.sidebar{ width:230px; flex-shrink:0; transition:all all .3s }
.sidebar-menu{ list-style:none; background-color:#fff; border-radius:8px; box-shadow:0 4px 12px rgba(0,0,0,.08); overflow:hidden }
.sidebar-menu li{ border-bottom:1px solid #eee; margin:0 20px }
.sidebar-menu li:first-child{ text-align:center; font-weight:bold; width:100%; margin:0 }
.sidebar-menu li:last-child{ border-bottom:none }
.sidebar-menu li.has-subnav{ position:relative; margin:0; border-bottom:1px solid #eee; overflow:hidden; transition:all .3s ease }
.sidebar-menu li.has-subnav a{ position:relative; padding:15px 20px; justify-content:flex-start }
.sidebar-menu li.has-subnav a b{ margin-right:10px }
.sidebar-menu li.has-subnav a .arrow{ position:relative; width:16px; height:16px; transition:transform .3s ease; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E"); background-size:contain; background-repeat:no-repeat; background-position:center }
.sidebar-menu li.has-subnav a.active{ color:#ffb500 }
.sidebar-menu li.has-subnav a.active .arrow{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23FFB500' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") }
.sidebar-menu li.has-subnav a.open .arrow{ transform:rotate(180deg); background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='16' height='16' viewBox='0 0 24 24' fill='none' stroke='%23FFB500' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E") }
.sidebar-menu li.has-subnav .subnav{ background-color:#f8f8f8; list-style:none; padding:0; margin:0; max-height:0; opacity:0; overflow:hidden; transition:max-height .4s cubic-bezier(0.4,0,0.2,1),opacity .3s ease,padding-top .3s ease,padding-bottom .3s ease; padding-top:0; padding-bottom:0 }
.sidebar-menu li.has-subnav .subnav li{ margin:0; border-bottom:1px solid #eee }
.sidebar-menu li.has-subnav .subnav li:last-child{ border-bottom:none }
.sidebar-menu li.has-subnav .subnav li a{ padding:12px 40px; font-size:13px; justify-content:flex-start; transition:color .3s ease,background-color .3s ease; font-weight:normal }
.sidebar-menu li.has-subnav .subnav li a:hover,.sidebar-menu li.has-subnav .subnav li a.active{ color:#ffb500; background-color:rgba(255,181,0,.1) }
.sidebar-menu li.has-subnav.open .subnav{ max-height:500px; opacity:1; padding-top:8px; padding-bottom:8px }
.sidebar-menu li.has-subnav.open{ border-bottom:none }
.sidebar-menu li.has-subnav.open .subnav{ max-height:500px }
.sidebar-menu li.has-subnav.open+li{ border-top:1px solid #eee }
.sidebar-menu li a{ display:flex; padding:15px 0; color:#666; text-decoration:none; transition:all .3s; text-align:center; align-items:center; font-size:13px }
.sidebar-menu li a img{ width:18px; height:18px; display:block; margin-right:10px }
.sidebar-menu li a b{ font-weight:normal }
.sidebar-menu li a.model{ background-color:#ffb500; color:#fff; justify-content:center }
.sidebar-menu li a.model b{ font-weight:bold }
.sidebar-menu li a.model:hover{ color:#fff }
.sidebar-menu li a:hover,.sidebar-menu li a.active{ color:#ffb500 }
.sidebar-toggle{ position:fixed; top:20px; left:20px; z-index:1001; background-color:#ffb500; color:#fff; border:none; border-radius:5px; padding:10px 20px; cursor:pointer; font-size:16px; box-shadow:0 8px 24px rgba(0,0,0,.12); transition:all all .3s }
.sidebar-toggle:hover{ background-color:rgb(204,144.8,0); transform:translateY(-2px) }
.mobile-sidebar{ position:fixed; top:0; left:-100%; width:80%; height:100vh; background-color:#fff; box-shadow:0 16px 48px rgba(0,0,0,.16); z-index:1000; overflow-y:auto; padding-top:60px }
.mobile-sidebar.open{ left:0 }
.mobile-sidebar-overlay{ position:fixed; top:0; left:0; width:100%; height:100%; background-color:rgba(0,0,0,.5); z-index:999; display:none }
.mobile-sidebar-overlay.open{ display:block }
.form-message{ background:#fff; border-radius:5px; padding:30px; margin-top:40px; box-shadow:0px 4px 20px 0px rgba(0,0,0,.08) }
.form-message .form-title{ font-size:18px; margin-bottom:24px; color:#000; border-bottom:1px solid rgba(0,0,0,.1); padding-bottom:12px }
.form-message .form-grid{ display:grid; grid-template-columns:1fr 1fr; gap:20px }
@media(max-width:992px){ .form-message .form-grid{grid-template-columns:1fr }
}
.form-message .form-group{ margin-bottom:20px; position:relative }
.form-message .form-group label{ display:block; margin-bottom:8px; font-weight:500; color:#666 }
.form-message .form-group input,.form-message .form-group select,.form-message .form-group textarea{ width:100%; padding:12px 16px; border:1px solid #ddd; border-radius:4px; font-size:14px; transition:border-color .3s ease }
.form-message .form-group input:focus,.form-message .form-group select:focus,.form-message .form-group textarea:focus{ outline:none; border-color:#ffb500; box-shadow:0 0 0 3px rgba(255,153,0,.1) }
.form-message .form-group input.error,.form-message .form-group select.error,.form-message .form-group textarea.error{ border-color:#ff4d4f }
.form-message .form-group textarea{ resize:vertical; min-height:120px }
.form-message .form-group .form-error{ color:#ff4d4f; font-size:14px; margin-top:4px }
.form-message .form-group .img-code{ width:100px; height:44.8px; display:block; object-fit:cover; position:absolute; right:0; bottom:0 }
.form-message .form-group .input-code{ width:calc(100% - 120px) }
.btn-submit{ background-color:#ffb500; color:#fff; border:none; padding:12px 32px; border-radius:4px; font-size:16px; cursor:pointer; transition:background-color .3s ease; margin:40px auto 0; display:block }
.btn-submit:hover{ background-color:#e68a00 }
.btn-submit:disabled{ background-color:#999; cursor:not-allowed }
.sub-container{ display:flex; gap:40px; padding:60px 0 }
.sub-content{ width:calc(100% - 270px) }
.content-section .title{ font-size:24px; color:#000; position:relative; text-align:center }
.content-section .sub-title{ font-size:32px; text-align:center; color:rgba(0,0,0,.1); border-bottom:1px solid rgba(0,0,0,.1); padding-bottom:20px; margin-top:-10px }
.content-section .sub-title.bar{ position:relative; font-size:20px }
.content-section .sub-title.bar::after{ content:""; position:absolute; left:0; width:90px; height:2px; background-color:#ffb500; bottom:0; display:block }
.content-section .sub-title.return{ font-size:18px; color:gray; font-weight:normal }
.content-section .sub-title.return b{ font-weight:normal }
.content-section .sub-title-left{ text-align:left; color:#000; margin-top:30px; display:flex; justify-content:space-between; align-items:center }
.content-section .sub-title-left .time{ font-size:14px; color:#919191 }
.content-section .sub-title-left .product-search{ display:flex; align-items:center; width:340px; height:36px; border-radius:4px 4px 4px 4px; border:1px solid rgba(0,0,0,.1); overflow:hidden }
.content-section .sub-title-left .product-search input{ width:270px; height:100%; color:rgba(0,0,0,.3); font-size:14px; border:0 none; display:block; padding:0 10px }
.content-section .sub-title-left .product-search button{ border:0; background:#ffb500; font-size:16px; color:#fff; width:70px; height:100%; display:block; text-align:center; cursor:pointer }
.content-section .intro-richtext{ font-size:16px; line-height:36px; color:#000; word-break:break-word; overflow-wrap:break-word }
.content-section .intro-richtext-title{ color:#ffb500; font-size:20px; text-align:center; margin:3% 0 2% }
.content-section .intro-richtext-images{ width:100%; display:flex; justify-content:space-between; margin-top:3% }
.content-section .intro-richtext-images img{ width:48%; border-radius:0 }
.content-section .intro-richtext img{ max-width:100%; height:auto !important }
.breadcrumb{ margin:32px 0 }
.breadcrumb img{ vertical-align:baseline; margin-right:10px }
@media(max-width:1200px){ .breadcrumb{margin:0 0 24px 0 }
}
.richtext{ margin:20px 0; font-size:16px; color:#000; line-height:32px }
.richtext img{ max-width:100%; display:block; height:auto !important }
.richtext-img-two{ width:100%; display:grid; grid-template-columns:repeat(2,1fr); gap:20px; margin:20px 0 }
.richtext-img-three{ width:100%; display:grid; grid-template-columns:repeat(3,1fr); gap:20px; margin:20px 0 }
.pagination{ width:100%; display:flex; align-items:center; justify-content:center; gap:10px; margin-top:30px }
.pagination .page-item{ display:flex; gap:10px; align-items:center; margin:0 10px }
.pagination .page-item a{ display:block; width:32px; height:32px; line-height:32px; text-align:center; border:1px solid #ddd; color:#666; text-decoration:none; border-radius:3px; transition:all .3s ease }
.pagination .page-item a:hover,.pagination .page-item a.active{ background-color:#ffb500; border-color:#ffb500; color:#fff }
.technical{ background:#fff url("../images/bg-map.png") no-repeat; width:100%; background-size:100% auto; overflow:hidden }
.technical-map{ position:relative; width:100%; max-width:1200px; margin:0 auto }
.technical-map img{ display:block; margin:0 auto; width:900px }
.technical-map .map-flag{ position:absolute; width:60px; height:50px; background-size:contain; background-repeat:no-repeat; cursor:pointer; transform-origin:bottom center; transition:transform .3s ease; z-index:10 }
.technical .map-popup{ position:fixed; top:0; left:0; width:100%; height:100%; display:flex; justify-content:center; align-items:center; z-index:1000; opacity:0; visibility:hidden; transition:opacity .3s ease,visibility .3s ease }
.technical .map-popup.active{ opacity:1; visibility:visible }
.technical .map-popup.active .popup-content{ transform:scale(1) }
.technical .map-popup .popup-content{ background-color:#fff; border-radius:8px; padding:30px; width:90%; max-width:600px; max-height:80vh; overflow-y:auto; position:relative; transform:scale(0.9); transition:transform .3s ease }
.technical .map-popup .popup-content .popup-title{ font-size:24px; color:#000; margin-bottom:20px; padding-bottom:15px; border-bottom:1px solid #e0e0e0; font-weight:bold }
.technical .map-popup .popup-content .popup-close{ position:absolute; top:20px; right:20px; width:30px; height:30px; background-color:#f0f0f0; border:none; border-radius:50%; cursor:pointer; display:flex; justify-content:center; align-items:center; font-size:20px; color:#666 }
.technical .map-popup .popup-content .popup-close:hover{ background-color:#e0e0e0; color:#333 }
.technical .map-popup .popup-content .popup-body{ font-size:16px; line-height:1.8 }
.technical .map-popup .popup-content .popup-body .popup-item h3{ font-size:20px; font-weight:bold; margin-bottom:20px; color:#333; padding-bottom:10px; border-bottom:1px solid #eee }
.technical .map-popup .popup-content .popup-body .popup-item dl{ margin:0 }
.technical .map-popup .popup-content .popup-body .popup-item dl dt{ font-weight:bold; margin-bottom:8px; color:#555 }
.technical .map-popup .popup-content .popup-body .popup-item dl dd{ margin-bottom:16px; color:#666; line-height:1.6 }
.technical .map-popup .popup-content .popup-body .popup-province-info{ margin-bottom:20px }
.technical .map-popup .popup-content .popup-body .popup-province-info .province-name{ font-size:20px; font-weight:bold; color:#ffb500; margin-bottom:15px }
.technical .map-popup .popup-content .popup-body .popup-province-info .province-data{ margin-top:15px }
.technical .map-popup .popup-content .popup-body .popup-province-info .province-data .data-item{ margin-bottom:15px }
.technical .map-popup .popup-content .popup-body .popup-province-info .province-data .data-item .item-title{ font-size:16px; font-weight:bold; margin-bottom:8px; color:#333 }
.technical .map-popup .popup-content .popup-body .popup-province-info .province-data .data-item .item-content{ display:flex; align-items:center; margin-bottom:5px }
.technical .map-popup .popup-content .popup-body .popup-province-info .province-data .data-item .item-content img{ width:18px; height:18px; margin-right:10px }
.technical .map-popup .popup-content .popup-body .popup-province-info .province-data .data-item .item-content span{ flex:1 }
.technical .form-message .form-title{ font-size:20px; margin-bottom:0 }
.technical .form-message-info{ display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-start }
.technical-list{ margin:-120px auto 50px; background:none; box-shadow:none }
.technical-list-nav{ width:280px; display:flex; border-top:1px solid #d9d9d9; border-left:1px solid #d9d9d9; margin-top:30px; flex-wrap:wrap; align-items:center; justify-content:space-between }
.technical-list-nav a{ width:50%; display:flex; align-items:center; justify-content:center; word-break:break-all; text-align:center; height:76px; font-size:14px; color:#000; border-right:1px solid #d9d9d9; border-bottom:1px solid #d9d9d9; overflow:hidden }
.technical-list-nav a.active,.technical-list-nav a:hover{ background:#ffb500 }
.technical-list-item{ width:calc(100% - 340px); margin:30px 0 0 0; cursor:pointer; display:none }
.technical-list-item.active{ display:block }
.technical-list-item.active h1{ color:#ffb500 }
.technical-list h1{ font-size:18px; color:#000; font-weight:bold; position:relative; padding-right:30px; display:none }
.technical-list h1 span{ color:rgba(0,0,0,.2); margin-left:24px }
.technical-list h1 .arrow{ position:absolute; right:0; top:50%; transform:translateY(-50%); width:20px; height:20px; background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23999' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E"); background-size:contain; background-repeat:no-repeat; background-position:center; transition:all .3s ease }
.technical-list h1.active .arrow{ background-image:url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' viewBox='0 0 24 24' fill='none' stroke='%23FFB500' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='6 9 12 15 18 9'%3E%3C/polyline%3E%3C/svg%3E"); transform:translateY(-50%) rotate(180deg) }
.technical-list dl{ width:100%; display:flex; flex-wrap:wrap; gap:20px }
.technical-list dd{ width:calc(50% - 50px); background:#fff; line-height:32px; font-size:16px; color:#000; padding:20px; box-shadow:0px 4px 20px 0px rgba(0,0,0,.08); border-radius:10px 10px 10px 10px; box-sizing:content-box }
.technical-list dd h2{ font-size:16px; font-weight:bold; margin-bottom:10px }
.technical-list dd img{ width:18px; height:18px; margin-right:10px }
.technical-list dd p{ width:calc(100% - 28px) }
@media(max-width:1200px){ .technical .breadcrumb{margin-top:40px }
.technical-map{ margin:40px auto }
.technical-map img{ width:92%; display:block; margin:0 auto }
.technical-map .map-flag{ width:20px; height:20px }
.technical .form-message{ width:92%; padding:0 }
.technical .form-message-info{ flex-direction:column }
.technical-list dd{ width:100% }
.technical-list dd p{ width:100% }
.technical-list-nav{ width:100% }
.technical-list-item{ width:100% }
}
.lazy-image{ opacity:0; transition:opacity .3s ease }
.lazy-image.loaded{ opacity:1 }
@keyframes fadeIn{ from{opacity:0 }
to{ opacity:1 }
}
@keyframes slideIn{ from{opacity:0; transform:translateY(-20px) }
to{ opacity:1; transform:translateY(0) }
}
@keyframes slideInRight{ from{opacity:0; transform:translateX(100%) }
to{ opacity:1; transform:translateX(0) }
}
@keyframes fadeOut{ from{opacity:1; transform:translateX(0) }
to{ opacity:0; transform:translateX(100%) }
}
@keyframes spin{ from{transform:rotate(0deg) }
to{ transform:rotate(360deg) }
}
@keyframes shimmer{ 0%{transform:translateX(-100%) }
100%{ transform:translateX(100%) }
}
@keyframes slideInUp{ from{transform:translate3d(0,50%,0) }
to{ opacity:1; transform:none }
}
@keyframes slideInLeft{ from{transform:translate3d(-50%,0,0) }
to{ opacity:1; transform:none }
}
.fade-in{ animation:fadeIn .6s ease forwards }
.animation{ visibility:hidden; opacity:0 }
.fadel,.fader,.fadeup,.fadez{ visibility:visible }
.fadeup{ animation:slideInUp ease-out .6s forwards; -webkit-animation:slideInUp ease-out .6s forwards }
.fadel{ animation:slideInLeft ease-out .6s forwards; -webkit-animation:slideInLeft ease-out .6s forwards }
.fader{ animation:slideInRight ease-out .6s forwards; -webkit-animation:slideInRight ease-out .6s forwards }
@media(max-width:1200px){ .footer-content{flex-direction:column }
.footer-content-left{ width:100% }
.footer-content-center{ display:none }
.footer-content-right{ margin-top:24px }
.sub-page .sub-container{ flex-direction:column; padding:24px 0 }
.sub-page .sub-content{ width:100% }
.sidebar{ width:100% }
.page-container{ flex-direction:column }
.content-section .sub-title{ font-size:24px }
.content-section .sub-title.sub-title-left{ flex-direction:column; align-items:flex-start }
.content-section .sub-title.sub-title-left .product-search{ margin-top:12px; width:100% }
.content-section .sub-title.sub-title-left .product-search input{ width:calc(100% - 70px) }
.contact .contact-top{ flex-direction:column; padding-bottom:32px }
.contact .contact-top .form-message-map{ width:100% }
.contact .contact-top .form-message-map img{ width:100% }
.contact .contact-top .form-message-info{ margin-top:32px; padding-bottom:32px }
.contact .contact-top .form-message-info h1{ font-size:20px }
.contact .contact-top .form-message-info-item{ margin-top:12px }
.news-list .news-item{ flex-direction:column; height:auto }
.news-list .news-item .news-image{ width:100% }
.news-list .news-item .news-info{ margin-top:24px; width:100% }
.news-detail-richtext{ padding:5% 0 }
.news-detail-title{ font-size:18px }
.news-detail-prev-next dl{ flex-direction:column }
}
@media(max-width:1199px){ .sidebar-menu>li:first-child>a.model{cursor:pointer; position:relative }
.sidebar-menu>li:first-child>a.model::after{ content:"▼"; position:absolute; right:15px; top:50%; transform:translateY(-50%); font-size:12px; transition:transform .3s }
.sidebar-menu.collapsed>li:first-child>a.model::after{ transform:translateY(-50%) rotate(180deg) }
.sidebar-menu.collapsed>li:not(:first-child){ display:none }
}
@media(min-width:1200px){ .sidebar-menu>li{display:block !important }
.sidebar-menu>li:first-child>a.model::after{ display:none }
}