﻿:root{--fontcolor:#000000;--summarycolor:#666666;--homebg:#0a1d3d;--hometitle:40px;--fontblod3:300;--fontblod4:400;--fontblod5:500;--fontblod6:600;--fontblod7:700;--fontfamily:"Roboto","Lato","Open Sans","Poppins","Oswald","Noto Sans","Montserrat",sans-serif}
@media(max-width:1280px){:root{--hometitle:34px}}
@media(max-width:1024px){:root{--hometitle:28px}}
@media(max-width:768px){:root{--hometitle:24px}}
::-webkit-scrollbar-track{box-shadow:inset 0 0 5px rgba(0,0,0,.1);border-radius:10px;background:rgba(122,122,122,.1)}
::-webkit-scrollbar-thumb{box-shadow:inset 0 0 5px rgba(0,0,0,.2);background:#d7d7d7}
::-webkit-scrollbar{width:8px;height:8px}


.index>main>section{position:relative}
.home-title{font-size:var(--hometitle);font-weight:var(--fontblod5);color:var(--fontcolor);text-align:center;text-transform: uppercase;}
.home-more{min-width:180px;height:56px;background:var(--color);font-weight:var(--fontblod5);border-radius:3px;display:inline-flex;align-items:center;justify-content:center;color:#FFF;position:relative;overflow:hidden}
.home-more em{margin-left:10px;transform: rotate(180deg);}
.home-more:hover::after{width:300px;height:300px}
.home-more::after{content:"";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);transition:all .2s linear;width:0px;height:0px;border-radius:50%;background:rgba(0,0,0,.05)}
.home-about,.home-adv,.home-case,.home-hotproduct,.home-mainproduct,.home-news{padding:3% 0px}
.home-banner .pcimg{display:block}
.home-banner .pcimg img{display:block}
.home-banner .mobimg{display:none}
.home-banner .mobimg img{display:none}
.banner-button-next,.banner-button-prev{position:absolute;left:70px;top:50%;transform:translateY(-50%);width:45px;height:45px;border-radius:50%;background:rgb(0 0 0 / 30%);color:#FFF;font-size:22px;display:flex;align-items:center;justify-content:center;z-index:1;cursor:pointer;font-weight:bold}
.banner-button-next{left:auto;right:70px;transform: rotate(180deg);}
.home-banner .swiper-slide{overflow:hidden}
@media(max-width:768px){.banner-button-next,.banner-button-prev{display:none}
.home-banner .swiper-slide img{width:100%;height: 200px}
.home-banner .pcimg{display:none}
.home-banner .pcimg img{display:none}
.home-banner .mobimg{display:block}
.home-banner .mobimg img{display:block}}
.home-banner .swiper-slide.swiper-slide-active img{animation:bannerimg 6s forwards}
@keyframes bannerimg{0%{transform:scale(1)}80%{transform:scale(1.04)}100%{transform:scale(1.035)}}
.home-banner .swiper-pagination-bullet{background-color:#e2e2e2;border-radius:999px;height:4px;opacity:1;overflow:hidden;position:relative;width:32px}
.home-banner .swiper-pagination-bullet:after{background-color:var(--color);border-radius:999px;content:"";display:block;height:100%;width:0px}
.home-banner .swiper-pagination-bullet-active.cur::after{transition:width 6s linear;width:100%}
.home-banner .banner-animote{position:absolute;bottom:30%;left:10%;color:#ffffff;opacity:0;max-width:770px}
.home-banner .banner-animote .title{font-size:48px;font-weight:var(--fontblod5);line-height:1.4;text-transform:capitalize}
.home-banner .banner-animote .text{margin-top:20px;font-size:18px}
.home-banner .banner-animote .btn{margin-top:4em}
.home-banner .swiper-slide-active .banner-animote{animation:bannerani .5s forwards;animation-delay:.7s}
@keyframes bannerani{0%{opacity:0;transform:scale(0)}
100%{opacity:1;transform:scale(1)}}


.home-hotproduct{background:#F4F4F4}
.home-hotproduct #hotproswiper{margin-top:3%;padding-bottom:10px}
.home-hotproduct .hotpro-list .swiper-slide{width:23%;background:#FFF;border-radius:5px;overflow:hidden;border:1px solid #e5e8ed}
.home-hotproduct .hotpro-list .swiper-slide:hover .img img{transform:scale(1.02)}
.home-hotproduct .hotpro-list .swiper-slide:hover .title{color:var(--color)}
.home-hotproduct .hotpro-list .swiper-slide .img{display:flex;align-items:center;justify-content:center;width:100%}
.home-hotproduct .hotpro-list .swiper-slide .img img{width:100%;height:100%;object-fit:cover}
.home-hotproduct .hotpro-list .swiper-slide .title{border-top:1px solid #e5e8ed;font-size:18px;font-weight:var(--fontblod5);color:var(--fontcolor);text-align:center;display:flex;align-items:center;justify-content:center;height:75px;padding:0px 15px}
.home-hotproduct .hotpro-button{display:flex;align-items:center;justify-content:center;margin-top:50px}
.home-hotproduct .hotpro-button .hotpro-button-next,
.home-hotproduct .hotpro-button .hotpro-button-prev{margin:0px 10px;width:49px;height:49px;border-radius:50%;display:flex;align-items:center;justify-content:center;cursor:pointer;background:var(--color);border:2px solid var(--color);color:#FFF}

.home-hotproduct .hotpro-button .hotpro-button-next{transform: rotate(180deg);}

.home-hotproduct .hotpro-button .hotpro-button-next.swiper-button-disabled,
.home-hotproduct .hotpro-button .hotpro-button-prev.swiper-button-disabled{background:rgba(255,255,255,0);border:2px solid rgba(93,106,128,.3);color:#000}
.home-hotproduct .hotpro-button .hotpro-button-next em,
.home-hotproduct .hotpro-button .hotpro-button-prev em{font-size:18px}


.home-mainproduct{background:#111}
.home-mainproduct .mainpro-top{display:flex;align-items:center;justify-content:space-between}
.home-mainproduct .mainpro-top .mainpro-title{max-width:700px}
.home-mainproduct .mainpro-top .mainpro-title .home-title{color:#FFF;text-align:left}
.home-mainproduct .mainpro-top .mainpro-title .des{color:#FFFFFF95;line-height:30px}
.home-mainproduct .mainpro-top .mainpro-button{display:flex;align-items:center}
.home-mainproduct .mainpro-top .mainpro-button .mainproduct-button-next,.home-mainproduct .mainpro-top .mainpro-button .mainproduct-button-prev{margin-left:20px;width:49px;height:49px;background:rgba(255,255,255,0);border:2px solid rgba(230,232,235,.3);border-radius:50%;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:all .1s linear}
.home-mainproduct .mainpro-top .mainpro-button .mainproduct-button-next{transform: rotate(180deg);}
.home-mainproduct .mainpro-top .mainpro-button .mainproduct-button-next.swiper-button-disabled,.home-mainproduct .mainpro-top .mainpro-button .mainproduct-button-next:hover,.home-mainproduct .mainpro-top .mainpro-button .mainproduct-button-prev.swiper-button-disabled,.home-mainproduct .mainpro-top .mainpro-button .mainproduct-button-prev:hover{background:#F4F4F4}
.home-mainproduct .mainpro-top .mainpro-button .mainproduct-button-next.swiper-button-disabled em,.home-mainproduct .mainpro-top .mainpro-button .mainproduct-button-next:hover em,.home-mainproduct .mainpro-top .mainpro-button .mainproduct-button-prev.swiper-button-disabled em,.home-mainproduct .mainpro-top .mainpro-button .mainproduct-button-prev:hover em{color:#091d3e}
.home-mainproduct .mainpro-top .mainpro-button .mainproduct-button-next em,.home-mainproduct .mainpro-top .mainpro-button .mainproduct-button-prev em{color:#45546d;font-size:22px}
.home-mainproduct #homemainproduct{margin-top:30px;height:658px}
.home-mainproduct .homepro-list .swiper-slide{background:#FFF;display:flex;align-items:center;height:calc((100% - 30px)/ 2);border-radius:4px;position:relative}
.home-mainproduct .homepro-list .swiper-slide::before{content:"";position:absolute;top:0px;left:50%;transform:translateX(-50%);width:80%;height:4px;background:#d8d8d8;border-radius:2px;z-index:9;transition:all .1s linear}
.home-mainproduct .homepro-list .swiper-slide:hover::before{background:var(--color)}
.home-mainproduct .homepro-list .swiper-slide:hover .info .title{color:var(--color)}
.home-mainproduct .homepro-list .swiper-slide .img{width:60%;display:flex;align-items:center;justify-content:center;height:100%;position:relative;z-index:1}
.home-mainproduct .homepro-list .swiper-slide:hover .img img{transform:scale(1)}
.home-mainproduct .homepro-list .swiper-slide .img img{max-width:100%;max-height:100%;width:100%;height:100%;object-fit:cover}
.home-mainproduct .homepro-list .swiper-slide .info{flex:1;padding:20px}
.home-mainproduct .homepro-list .swiper-slide .info .title{font-size:18px;font-weight:var(--fontblod5);display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;margin-bottom:20px}
.home-mainproduct .homepro-list .swiper-slide .info .text{font-size:16px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;margin-bottom:20px;color:var(--summarycolor)}
.home-mainproduct .homepro-list .swiper-slide .info .home-more{min-width:140px;height:44px}
.home-mainproduct .mainproduct-more{text-align:center;margin-top:4%}


@media (max-width:768px){
.home-about,.home-adv,.home-case,.home-hotproduct,.home-mainproduct,.home-news{padding:6% 0px}
.home-banner .banner-animote{width:100%;left:0px;bottom:30%;padding:0px 15px}
.home-banner .banner-animote .title{font-size:26px}
.home-banner .banner-animote .text{font-size:16px}
.home-banner .banner-animote .btn{display:none}
.home-adv::before{height:80%}
.home-adv .homeadv-list li{width:48%;margin-bottom:20px}
.home-about .l-wrap .about-img{width:100%}
.home-about .l-wrap .about-info{padding:0px;margin-top:0px}
.home-mainproduct #homemainproduct{height:auto}
.home-mainproduct .mainpro-top .mainpro-button{display:none}
.home-mainproduct .homepro-list{display:block}
.home-mainproduct .homepro-list .swiper-slide{margin-bottom:20px}
.home-hotproduct .hotpro-button .hotpro-button-next,.home-hotproduct .hotpro-button .hotpro-button-prev{width:40px;height:40px}
.home-mainproduct .homepro-list .swiper-slide .info .title{font-size:16px;}
}
@media (max-width:500px){
.home-banner .banner-animote .title{font-size:16px}
.home-banner .banner-animote .text{font-size:14px;margin-top:10px}
.home-adv .homeadv-list li{width:100%;height:230px}
.home-adv .homeadv-list li .top .title{padding:0px}
.home-hotproduct .hotpro-list .swiper-slide .title{font-weight:400;font-size:16px}
.home-news .homenews-list .homenews-item .info{padding:20px 10px}
.home-news .homenews-list .homenews-item .img .date{height:60px}
.home-hotproduct .hotpro-button{margin-top:20px}
.home-adv .homeadv-list li .top em{font-size:50px}
.home-news .homenews-list .homenews-item .info .title{-webkit-line-clamp:3}
.home-case #homecaseswiper{padding:0px 15px}
.home-mainproduct .homepro-list .swiper-slide .info .home-more{display:none}
.home-mainproduct .homepro-list .swiper-slide .info .text{margin-bottom:0px}}

.icon-videoplay{position:absolute;left:50%;top:50%;transform:translate(-52%,-50%);background:rgba(0,0,0,.5);color:#FFF;width:45px;height:45px;display:flex;align-items:center;justify-content:center;border-radius:50%;font-size:18px;z-index:1;display:none}
img.lazy.loaded+.icon-videoplay{display:flex}
@media(max-width:768px){.icon-videoplay{width:30px;height:30px}}