@charset "utf-8";
@import url("bootstrap.min.css");
@import url("swiper.min.css");
@import url("icomoon.css");
@font-face{font-family:'Barlow';font-weight:200;src:url(fonts/Barlow-Light.ttf);font-display:swap}
@font-face{font-family:'Barlow';font-weight:300;src:url(fonts/Barlow-Regular.ttf);font-display:swap}
@font-face{font-family:'Barlow';font-weight:400;src:url(fonts/Barlow-Medium.ttf);font-display:swap}
@font-face{font-family:'Barlow';font-weight:500;src:url(fonts/BarlowCondensed-Bold.ttf);font-display:swap}
@font-face{font-family:'Barlow';font-weight:600;src:url(fonts/Barlow-Black.ttf);font-display:swap}
html,body,ul,li{margin:0;padding:0;height:100%; font-size:16px; color:#333;-webkit-text-size-adjust:none;font-family: 'Barlow';font-weight: 200}
h1,h2,h3,h4,h5,h6,hr,blockquote,dl,dt,dd,ul,ol,li,pre,form,fieldset,legend,button,input,textarea{margin:0;padding:0;list-style:none;font-family: 'Barlow';font-size:16px; color:#333; font-weight:normal;font-weight:300}
h1{font-weight:500;}
h2{font-weight:400;}
h5{font-weight:200}
h6{font-weight:600;}
p{font-weight:300}
em{ font-style:normal}
input,dl,dt,dd{-webkit-tap-highlight-color:rgba(255,255,255,0); display:inline-block; vertical-align:top;}
input{font-size:14px;outline:0;display: inline-block;}
input[type=button]{cursor:pointer}
select{margin:0;font-weight: 200}
li{list-style:none}
img{display: inline-block; border:none}
a{text-decoration:none;color:#333;-webkit-tap-highlight-color:rgba(0,0,0,0);-webkit-touch-callout: none; -webkit-user-select: none;transition: all 0.2s;}
a:hover{ color:#1c1f82;text-decoration:none;}
a,input,button,textarea,i{ outline:none;font-weight: 200}
.containerfull,.container{overflow-x:clip;}
.containerfull{padding: 0 5%}
.container{padding:0}
.flex{display: flex;}
.flex-none{flex: none}
.flex-row{flex-direction: row;}
.flex-row-reverse{flex-direction: row-reverse;}
.flex-col{flex-direction: column;}
.flex-col-reverse{flex-direction: column-reverse;}
.basis-full{flex-basis: 100%;}
.basis-auto{flex-basis: auto;}
.justify-start{justify-content: flex-start;}
.justify-center{justify-content: center;}
.justify-between{justify-content: space-between;}
.justify-end{justify-content: flex-end;}
.items-start{align-items: flex-start;}
.items-center{align-items: center;}
.items-end{align-items: flex-end;}
.shrink{flex-shrink: 1;}
.flex-grow{flex-grow:1}
.center{text-align: center;}
.gap-15{gap: 15px;}
.gap-20{gap: 20px;}
.gap-25{gap: 25px;}
.gray{background: #f8f8f8}
.mobileshow{display: none}
header{width: 100%;transition: all .2s;position: relative;z-index: 99;}
header.upsroll{background:rgba(255,255,255,.95);top:0;box-shadow: 0px 5px 30px 0px rgb(10 25 50 / 10%);border-bottom: 1px rgba(0,0,0,.05) solid;}
header .logo{padding-top: 15px;padding-bottom: 15px}
header .logo a h1{text-transform: uppercase;font-size: 20px;}
header .logo a i{font-size: 50px;background: linear-gradient(90deg, #58beed, #1c1f82);-webkit-background-clip: text;color: transparent;}
header .fixmenu{background: #fffffffd;box-shadow: 0px 5px 30px 0px rgb(10 25 50 / 10%);position: fixed;width: 100%;left: 0;top: -80px;height:60px;line-height: 60px;transition: all .2s;font-size: 0;}
header.scroll .fixmenu{top: 0;}
header .fixmenu .toplogo a h1{text-transform: uppercase;font-size:18px;}
header .fixmenu .toplogo a i{font-size: 36px;background: linear-gradient(90deg, #58beed, #1c1f82);-webkit-background-clip: text;color: transparent;}
header .fixmenu ul{}
header .fixmenu ul li{display: inline-block;line-height: 60px;padding-right: 2.8%;position: relative;}
header .fixmenu ul li a{font-size: 16px;font-weight:400}
header .fixmenu ul li a i{display: inline-block;vertical-align: bottom;line-height:60px;margin-left: 3px;font-size: 18px;transition: all .2s}
header .fixmenu ul li a:hover i{-webkit-transform:rotate(180deg);transform:rotate(180deg);}
header .fixmenu ul li span{position: absolute;left: 0;top: 60px;background: #fff;visibility: hidden;opacity: 0;transition: all .2s;box-shadow: 0 0 7px 2px #00000020;padding:10px;min-width: 150%;border-radius: 5px}
header .fixmenu ul li span a{display: block;line-height: 36px;white-space: nowrap;padding:0 10px;border-radius: 5px;margin-bottom: 5px}
header .fixmenu ul li span a em{display: inline-block;vertical-align: middle;margin-right: 5px}
header .fixmenu ul li span a:last-child{margin-bottom:0}
header .fixmenu ul li span a:hover{color: #1c1f82;background: #f0f0f0}
header .fixmenu ul li span:after{content: '';position: absolute;top: -6px;left: 15%;display: inline-block;border-right: 6px solid transparent;border-bottom: 6px solid #fff;border-left: 6px solid transparent;}
header .fixmenu ul li:hover span{top: 50px;opacity: 1;visibility: visible;}
header .fixmenu ul > span{padding-left: 2%;position: relative;}
header .fixmenu ul > span .lang{display: inline-block;position: relative;margin-left:8px;vertical-align: top;margin-left:40px;}
header .fixmenu ul > span:after,header .fixmenu ul > span .lang:after{content: '';position:absolute;left:4%;top: 23px;background: #00000020;width: 1px;height:15px;}
header .fixmenu ul > span .lang:after{left: -25px}
header .fixmenu ul > span > a{margin-left:5px;font-size:16px;vertical-align: top;color: #333;width: 28px;height:28px;text-align: center;line-height: 28px;border-radius: 3px;display: inline-block}
header .fixmenu ul > span > a:first-child{margin-left: 0}
header .fixmenu ul > span > a:hover{background: #f0f0f0;}
header .fixmenu ul > span .lang > a{font-weight: 400;font-size: 13px;text-transform:uppercase;background:#1c1f82;color: #fff;padding:6px 15px;border-radius: 5px}
header .fixmenu ul > span .lang > a i{font-size: 15px;display: inline-block;vertical-align: top;line-height: 60px;margin-right:8px;}
header .fixmenu ul > span .lang > a:hover{background:#58beed;}
header .fixmenu ul > span .lang .langlist{position:absolute;left:50%;transform: translateX(-50%);width:145px;top:58px;background:rgba(255,255,255,.9);text-align: left;box-shadow: 0px 5px 30px 0px rgb(10 25 50 / 10%);opacity:0;visibility: hidden;transition: all .2s .4s;border-radius:3px;padding: 10px 0}
header .fixmenu ul > span .lang .langlist:after{position: absolute;top: -8px;left: 50%;display: inline-block;border-right: 8px solid transparent;border-bottom: 8px solid #ffffffe0;
    border-left: 6px solid transparent;content: '';margin-left: -4px}
header .fixmenu ul > span .lang .langlist p{padding:10px 20px;border-bottom: 1px #eee solid;padding-right: 0;height: 40px;margin: 0;display: block}
header .fixmenu ul > span .lang .langlist a{line-height: 18px;display: block;font-size: 14px;}
header .fixmenu ul > span .lang .langlist a:last-child{border-bottom: none}
header .fixmenu ul > span .lang .langlist p:hover{background-color: #00000010;color: #000}
header .fixmenu ul > span .lang:hover .langlist{top: 50px;opacity:1;visibility:visible;transition: all .2s}
header .fixmenu ul > span .lang .langlist a{width:100%;height:20px;background:url(../images/lang.png) no-repeat 0 0;line-height:18px;display: block;padding-left: 34px;font-size:13px;padding-right:20px;margin-bottom:15px}
header .fixmenu ul > span .lang .langlist a.cn{background-position:0 -22px}
header .fixmenu ul > span .lang .langlist a.de{background-position:0 -44px}
header .fixmenu ul > span .lang .langlist a.fr{background-position:0 -66px;float: none}
header .fixmenu ul > span .lang .langlist a.es{background-position:0 -88px}
header .search {cursor: pointer;`}
header .search i{font-size: 24px}
header .menu{color: #333;font-size:16px;font-weight: 300;cursor: pointer;position:relative;z-index: 100;}
header .menu > a{display:inline-block;position: relative;cursor: pointer;width:30px;height:36px;overflow:hidden;vertical-align: middle;}
header .menu > a span,header .menu > a span:after,header .menu > a span:before {content:"";display:block;width:24px;height:2px;background:#111;position:absolute;top:46%;margin-top:-1px;left:0; -webkit-transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);-moz-transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);-o-transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);-webkit-transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);-moz-transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);-o-transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);}
header .menu > a span:after {margin-top:-7px;top:0;transition-delay:0.27s;}
header .menu > a span:before {margin-top:7px;top:0;transition-delay:0.2s;width: 15px}
header .menu.click a span,header .menu.click a span:after,header .menu.click a span:before {transition-delay:0.12s;-webkit-transform:translateX(70px);-moz-transform:translateX(70px);-ms-transform:translateX(70px);-o-transform:translateX(70px);transform:translateX(70px);background: #fff}
header .menu.click a span:after {transition-delay:0s;}
header .menu.click a span:before {transition-delay:0.07s;}
header .menu > a i:before,header .menu > a i:after {content:"";display:block;width:24px;height:3px;background:#111;position:absolute;top:50%;margin-top:-3px;left:50%;margin-left:-18px;-webkit-transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);-moz-transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);-o-transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);transition:transform 0.3s cubic-bezier(0.600,0.000,0.200,1.000);-webkit-transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);-moz-transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);-o-transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);transition-timing-function:cubic-bezier(0.600,0.000,0.200,1.000);-webkit-transform:translateY(-70px) translateX(-70px) rotate(45deg);-moz-transform:translateY(-70px) translateX(-70px) rotate(45deg);-ms-transform:translateY(-70px) translateX(-70px) rotate(45deg);-o-transform:translateY(-70px) translateX(-70px) rotate(45deg);transform:translateY(-70px) translateX(-70px) rotate(45deg);transition-delay:0.12s;}
header .menu > a i:after {transition-delay:0s;-webkit-transform:translateY(70px) translateX(-70px) rotate(-45deg);-moz-transform:translateY(70px) translateX(-70px) rotate(-45deg);-ms-transform:translateY(70px) translateX(-70px) rotate(-45deg);-o-transform:translateY(70px) translateX(-70px) rotate(-45deg);transform:translateY(70px) translateX(-70px) rotate(-45deg);}
header .menu > a i:after {-webkit-transform:translateY(-70px) translateX(70px) rotate(-45deg);-moz-transform:translateY(-70px) translateX(70px) rotate(-45deg);-ms-transform:translateY(-70px) translateX(70px) rotate(-45deg);-o-transform:translateY(-70px) translateX(70px) rotate(-45deg);transform:translateY(-70px) translateX(70px) rotate(-45deg);}
header .menu.click a{right:40px;top: 40px;position: fixed;}
header .menu.click a i:before {transition-delay:0.12s;-webkit-transform:rotate(45deg);-moz-transform:rotate(45deg);-ms-transform:rotate(45deg);-o-transform:rotate(45deg);transform:rotate(45deg);background: #fff}
header .menu.click a i:after {transition-delay:0.24s;-webkit-transform:rotate(-45deg) !important;-moz-transform:rotate(-45deg) !important;-ms-transform:rotate(-45deg) !important;-o-transform:rotate(-45deg) !important;transform:rotate(-45deg) !important;background: #fff}
header .inquiry{margin-bottom: 1px}
header .inquiry a{display: block;background: #1c1f82;border-radius: 5px;padding: 6px 22px 7px 22px;color: #fff;text-transform:uppercase;font-size:13px;font-weight: 400}
header .inquiry a i{margin-right: 8px;font-size:16px;display: inline-block;vertical-align: text-bottom;}
header .inquiry a:hover{background: #58beed}
header .share a{font-size: 16px;margin:0 2px;text-align: center;border-radius: 5px;transition: all .3s;width: 28px;height: 28px;line-height: 28px;display: inline-block}
header .share a:hover{background: #f0f0f0}
header .togglemenu{width: 100%;left: -100%;position: fixed;top: 0;height:100vh;width: 100%;transition: all .2s;font-size: 0;display: table}
header.upsroll .mobilemenu a span,header.upsroll-two .mobilemenu a span,header.upsroll .mobilemenu a span:after,header.upsroll .mobilemenu a span:before,header.upsroll-two .mobilemenu a span:after,header.upsroll-two .mobilemenu a span:before{background: rgba(0,0,0,.8);}
header .menu .togglemenu{display: block;position: fixed;top: 70px;right: -50%;background:rgba(255,255,255,.95);padding:8% 5%;width: 100%;height: 100%;visibility: hidden;opacity:0;transition: all .2s;text-align: left}
header.navmenu .togglemenu{opacity:1;visibility: visible;left: 0;background: #000000e0}
header .togglemenu .header-menu{height:100vh;background: #1c1f82f0;width: 45vw;display: table-cell;vertical-align: middle;padding-left: 260px}
header .togglemenu .header-contact{height:100vh;width: 56vw;display: table-cell;vertical-align: middle;padding-left: 100px}
header .togglemenu .header-contact h2{color: #fff;font-size:30px;line-height: 40px;}
header .togglemenu .header-contact h2 i{font-size: 18px;display: block;color: #fff}
header .togglemenu .header-contact .contacts{padding-top: 30px;}
header .togglemenu .header-contact .contacts dl{display: block;margin-bottom: 20px}
header .togglemenu .header-contact .contacts dl dt{color: #fff;display: block}
header .togglemenu .header-contact .contacts dl dd{color: #fff;display: block;font-size: 16px;font-weight: 300}
header .togglemenu .header-contact .contacts dl dd a{color: #fff;font-weight: 300}
header .togglemenu .header-contact .contacts dl dd a:hover{color: #9ab6e5}
header .togglemenu .header-menu .langurl{display: block;padding-top: 40px}
header .togglemenu .header-menu .langurl p{display: inline-block;margin-right:20px;}
header .togglemenu .header-menu .langurl p a{color: #fff;font-size: 14px;height:20px;background:url(../images/lang.png) no-repeat 0 0;line-height:18px;display: inline-block;padding-left: 34px;font-size:13px;}
header .togglemenu .header-menu .langurl p a:hover{color: #1c1f82}
header .togglemenu .header-menu .langurl p a.cn{background-position:0 -22px}
header .togglemenu .header-menu .langurl p a.de{background-position:0 -44px}
header .togglemenu .header-menu .langurl p a.fr{background-position:0 -66px;float: none}
header .togglemenu .header-menu .langurl p a.es{background-position:0 -88px}
header .togglemenu h1{position: relative;font-size: 20px;color: #fff;padding-bottom: 15px;margin-bottom: 40px;font-weight: 300}
header .togglemenu h1:after{content: '';position: absolute;left: 0;bottom: 0;width: 40px;height:1px;background: #58beed}
header .togglemenu ul{height:auto;width: 80%;display: block;}
header .togglemenu ul li{height: 6vh;display: block;position: relative;overflow:hidden;}
header .togglemenu ul li > a{line-height:6vh;font-size:28px;text-transform: capitalize;color: #fff;font-weight:400;}
header .togglemenu ul li > a:hover{color: #58beed}
header .togglemenu ul li span{width: 100%;display: block;padding-bottom: 20px}
header .togglemenu ul li span a{line-height: 3vh;display: block;width: 100%;font-size: 15px;color: #fff;}
header .togglemenu ul li span a:hover,header .togglemenu ul li.active > a{color: #58beed}
header .togglemenu ul li i{width: 30px;height:30px;color:#fff;font-size: 20px;cursor: pointer;transition: all .2s;display: inline-block;margin-left:10px}
header .togglemenu ul li.active i{transform: rotate(90deg);margin-left:5px;color: #58beed}

@media (max-width:1299px){
	header .fixmenu ul li{padding:0 1.1%;}
}

@media (max-width:991px){
	header .togglemenu .header-menu{padding-left: 200px;width: 100%}
	header .togglemenu ul li > a{font-size:20px;}
	header .togglemenu .header-contact{display: none}
	header .togglemenu .header-menu .langurl{padding-top: 30px}
	header .togglemenu .header-menu .langurl p{margin-right:10px;}
	header .togglemenu .header-menu .langurl p a{padding-left: 31px;}
}

/* index */
.index-banner {width: 100%;}
.index-banner-content {width: 100%;}
.index-banner-swiper {width: 100%;position: relative;background:#000;} 
.index-banner-swiper .swiper-slide-active .img {animation: srmgani 6000ms 1 ease forwards;}
.index-banner-swiper .swiper-slide .img img{opacity: 0.5;width: 100%;object-fit: cover}
@keyframes srmgani{0%{transform:scale(1.05);} 100%{transform:scale(1.0);}}
.index-banner-item {position: relative;}
.index-banner-item .video {position: relative;width: 100%;z-index: 5;}
.index-banner-item .video video {display: block;width: 100%;opacity:0.9;}
.index-banner-item .text{position: absolute;left: 10%;top: 50%;width: 55%;transform: translateY(-50%);z-index: 10;color: #fff;}
.index-banner-item .text.center{left: 0;text-align:center;padding: 0 22%;width: 100%}
.index-banner-item .title-1,.index-banner-item .title-2,.index-banner-item .title-3,.index-banner-item .text-4,.index-banner-item .title-4 {overflow: hidden;}
.index-banner-item .title-1 div,.index-banner-item .title-2 div,.index-banner-item .title-3 div,.index-banner-item .text-4 div,.index-banner-item .title-4 div,.index-banner-item .text-5 div{opacity: 0;transform:translateY(200px);transition: opacity 1s linear,transform 1s cubic-bezier(.215,.61,.355,1);}
.index-banner-item .title-1 h2{font-size: 25px;color: #fff;line-height:50px;margin: 0;}
.index-banner-item .title-2 h1{font-size: 60px;color: #fff}
.index-banner-item .title-3 {padding-top: 20px} 
.index-banner-item .title-3 h1{font-size: 60px;color: #fff;line-height:1;position:relative;display: inline-block;padding-bottom: 25px}
.index-banner-item .title-3 h1:after{content: '';position: absolute;left:0;bottom: 0;background:#58beed;width: 50px;height: 3px}
.index-banner-item .title-4 {font-weight:500;color: #ed6e2b;}
.index-banner-item .text-4 {margin-top: 5%;}
.index-banner-item .text-4 h2{font-size: 20px; font-weight: 300; line-height: 1.2;color: #fff} 
.index-banner-item .text-5 {margin-top:5%;}
.index-banner-item .text-5 .viewmore a{color: #fff;border-radius: 50px;padding: 4px 40px;padding-right: 4px;background: #0559a1;line-height: 42px;font-size: 15px;box-shadow: 0 15px 15px -13px #00000080;text-transform: uppercase;display:inline-block;}
.index-banner-item .text-5 .viewmore a i{display: inline-block;vertical-align: top;transition:all .3s;text-align:center;line-height: 42px;margin-left: 8px;font-size: 20px;width:42px;height: 42px;background:#fff;color:#02a943;border-radius: 50%;margin-left: 30px}
.index-banner-item .text-5 .viewmore a:hover{background: #02a943}
.index-banner-item .text-5 .viewmore a:hover i{margin-left:40px;transform: rotate(45deg)}
.index-banner-swiper .swiper-slide .title-1 div{transition-delay: .8s;}
.index-banner-swiper .swiper-slide .title-2 div{transition-delay: 1s;}
.index-banner-swiper .swiper-slide .title-3 div,.index-banner-swiper .swiper-slide .title-4 div{transition-delay: 1.2s;}
.index-banner-swiper .swiper-slide .text-4 div{transition-delay: 1.4s;}
.index-banner-swiper .swiper-slide .text-5 div,.index-banner-swiper .swiper-slide .viewmore{transition-delay: 1.6s;}
.index-banner-swiper .swiper-slide-active .title-1 div,.index-banner-swiper .swiper-slide-active .title-2 div,.index-banner-swiper .swiper-slide-active .title-3 div,.index-banner-swiper .swiper-slide-active .viewmore,.index-banner-swiper .swiper-slide-active .text-5 div,.index-banner-swiper .swiper-slide-active .title-4 div,.index-banner-swiper .swiper-slide-active .text-4 div{transform: translateY(0px);opacity: 1;}
.index-banner .index-banner-swiper{position: relative;}
.index-banner .scrolldown-1 {position:absolute ;right: 3%;bottom:10%;width: 22px;z-index: 11;}
.swiper-ctrl {position: absolute;width: 100%;left: 0;bottom: 45px;z-index: 11;font-size: 0;text-align: center;}
.scroll-center {display: inline-block;position: absolute;right: 0;bottom: 0;width: 80px;text-align: center;}
.scroll-center .scroll {text-transform: uppercase;color: #fff;position: relative;font-size: 12px;width: 50px;vertical-align: top}
.scroll-center .scroll::before,.scroll-center .scroll::after{content: '';width: 1px;height: 35px;background: #fff;position: absolute;right: 26px;top: -40px;opacity: .5;}
.scroll-center .scroll::after{height: 15px;background: #b71b33;opacity: 1;z-index: 11;top: -36px;width: 3px;right: 25px;-webkit-animation: rotateplane 3s infinite ease-in-out;animation: rotateplane 3s infinite ease-in-out;}
@keyframes rotateplane{ 
    0%{transform: translateY(0px);-ms-transform:translateY(0px);-moz-transform:translateY(0px);-webkit-transform:translateY(0px);-o-transform:translateY(0px)}
    50%{transform: translateY(12px);-ms-transform:translateY(12px);-moz-transform:translateY(12px);-webkit-transform:translateY(12px);-o-transform:translateY(12px)}
    100%{transform: translateY(0px);-ms-transform:translateY(0px);-moz-transform:translateY(0px);-webkit-transform:translateY(0px);-o-transform:translateY(0px)}
}

.index-banner-swiper .banner-pagination {text-align: center;left: auto;bottom:auto!important;right:auto!important;left:auto!important;width: auto;color: #fff;width:auto;transform:none;position: relative}
.index-banner-swiper .banner-pagination span{opacity: 1;margin: 0 3px!important;position: relative;width: 32px;height: 32px;background: transparent;display: inline-block;vertical-align: middle;}
.index-banner-swiper .banner-pagination span::before {content: '';width:5px;height:5px;position: absolute;left:50%;top:50%;border-radius: 100%;transform: translate(-50%,-50%);background: #fff;transition:all .4s ease;opacity: .5;}
.index-banner-swiper .banner-pagination span::after {content: '';width:32px;height:32px;position: absolute;left:50%;top:50%;border-radius: 100%;transform: translate(-50%,-50%);z-index: 1;border: 2px solid rgba(255,255,255,.5);opacity: 0;transition:all .4s ease;}
.index-banner-swiper .swiper-button-prev:after,.index-banner-swiper .swiper-button-next:after{color: #fff;font-size: 30px}
.index-banner-swiper .banner-pagination span.swiper-pagination-bullet-active::before {background: #fff!important;opacity: 1;}
.index-banner-swiper .banner-pagination span.swiper-pagination-bullet-active::after {opacity: 1;}
.index-banner-swiper .banner-pagination span.swiper-pagination-bullet-active .content {opacity: 1;}
.index-banner-swiper .banner-pagination span .content {position: absolute;top: 0;width: 50%;height:100%;margin: 0;padding: 0;overflow: hidden;opacity: 0;transition:all .4s ease;z-index: 11;}
.index-banner-swiper .banner-pagination span .left {left: 0;}
.index-banner-swiper .banner-pagination span .right {right: 0;}
.index-banner-swiper .banner-pagination span .circle {position: absolute;margin: 0;width: 32px;height: 32px;border-radius: 50%;border: 2px solid transparent;transform: rotate(135deg);box-sizing: border-box;}
.index-banner-swiper .banner-pagination span .left-circle {left: 0;border-top-color: #fff;border-left-color: #fff;}
.index-banner-swiper .banner-pagination span .right-circle {right: 0;border-bottom-color: #fff;border-right-color: #fff;}
.index-banner-swiper .banner-pagination span.swiper-pagination-bullet-active .left-circle {animation: circleleft 5s linear forwards;}
.index-banner-swiper .banner-pagination span.swiper-pagination-bullet-active .right-circle {animation:circleright 5s linear forwards;}
.index-banner-swiper .banner-pagination span.swiper-pagination-bullet-active:first-child .left-circle {animation: circleleft 12s linear forwards;}
.index-banner-swiper .banner-pagination span.swiper-pagination-bullet-active:first-child .right-circle {animation:circleright 12s linear forwards;}
@keyframes circleright {0% {transform: rotate(135deg);}50%,100% {transform: rotate(315deg);}}
@keyframes circleleft {0%,50% {transform: rotate(135deg);}100% {transform: rotate(315deg);}}
.postfix img{width: 100%;height: 100vh}
@media screen and (max-width: 1699px) {
	.index-banner-item .title-3 h1{font-size: 50px;}
}
@media screen and (max-width: 1599px) {

}
@media screen and (max-width: 1499px) {
	.index-banner-item .title-1 h1{font-size: 25px;line-height:40px}
	.index-banner-item .title-2 h1{font-size: 60px;line-height:70px}
	.index-banner-item .title-3 h1{font-size: 40px}
	.index-banner-item .text-4 h2{font-size: 18px;line-height:28px;} 
}
@media screen and (max-width: 1399px) {
	.index-banner-item .text{left: 10%;width: 60%;}
}
@media screen and (max-width: 1299px) {
	.index-banner-item .title-1 h1{font-size: 20px;line-height:30px}
	.index-banner-item .title-2 h1{font-size: 40px;line-height:50px}
	.index-banner-item .title-3{padding-top: 10px}
	.index-banner-item .title-3 h1{font-size: 35px}
	.index-banner-item .title-3 h1:after{bottom: 2px;height: 4px;}
	.index-banner-item .text-4 h2{font-size: 16px;line-height:24px;} 
}
@media screen and (max-width: 1199px) {
	.index-banner{position: initial;height: auto}
	.index-banner-item .video:after,.index-banner .img:after{height:650px;content:'';display:block}
	.postfix{display:none;}
	.index-banner-item .video video,.index-banner .img img{position:absolute;left:50%;height:100%;width:auto;max-width:initial;top:0;-moz-transform: translateX(-50%);-ms-transform: translateX(-50%); -webkit-transform: translateX(-50%);transform: translateX(-50%);}
	.index-banner-item .text{top: 50%;width: 84%;left: 8%}
	.index-banner-item .text-5 .viewmore a{padding: 4px;padding-left: 25px;line-height: 30px;font-size: 14px}
	.index-banner-item .text-5 .viewmore a i{line-height: 30px;height: 30px;width: 30px;margin-left: 15px}
	
}
@media screen and (max-width:991px) {
	.index-banner-item .video:after,.index-banner .img:after{height:550px;}
	.index-banner-item .title-3 h1{padding-bottom: 25px}
	.index-banner-item .title-3 h1:after{background-size: 55px auto}
	.index-banner-item .title-1 h2{line-height: 40px}
}

@media screen and (max-width: 767px) {
	.index-banner .scrolldown-1 {display: none}
	.index-banner-item .video:after,.index-banner .img:after{height:450px;}
	.postfix{height: 400px}
	.index-banner-item .text{width: 84%;}
	.index-banner-item .title-1 h1{font-size:16px;line-height:25px}
	.index-banner-item .title-1 h2{font-size:18px;}
	.index-banner-item .title-2 h1{font-size: 22px;line-height:45px}
	.index-banner-item .title-3 h1{font-size: 22px}
	.index-banner-item .text-4 h2{font-size: 14px;line-height:22px;width:auto} 
	.banner-swiper-ctrl {bottom: 60%}
	.progress-bar-1 {width: 160px;}
	.img-block.imgwh.mbshow.mbt{margin-top:18rem;}
	.index-banner-item .text-5 .viewmore a{padding: 4px;padding-left: 20px;line-height: 25px;font-size: 12px}
	.index-banner-item .text-5 .viewmore a i{line-height: 25px;height: 25px;width: 25px;margin-left: 10px;font-size: 15px}
}
@media screen and (max-width: 576px) {
	.banner-swiper-ctrl {bottom: 59%}
}

@media (max-width:1599px){
	.containerfull{padding: 0 3%}
	.banner .swiper-slide .text h1,.banner .swiper-slide .text h6{font-size: 45px;margin-bottom: 25px}
	.banner .swiper-slide .text h1:after{top: 80px}
	.banner .swiper-slide .text h2{font-size: 25px}
	.banner .swiper-slide .text h3{font-size: 18px;line-height: 25px}
	.banner.ban-product .swiper-slide .img {top: 23%;right: 0}
}
@media (max-width:1299px){
	.containerfull{padding: 0 2%}
	header{position: fixed;left:0; top:0;background: #fff;}
	header .logo{padding-top: 10px;padding-bottom: 10px}
	header .logo a i{font-size: 45px}
	.space-block{height: 65px;display: block;width: 100%}
}
@media (max-width:1199px){
	header .logo a i{font-size: 40px}
	header .logo a h1{font-size: 18px}
	header .fixmenu{display: none}
	.space-block{height: 60px;}
	.banner-inner .text h2{font-size: 16px;}
}
@media (max-width:991px){
	.gap-15{gap: 10px;}
	.gap-20{gap: 15px;}
	.gap-25{gap: 20px;}
	.containerfull{padding: 0}
	.container{padding: 0 2%}
	header .share{top: 50px}
	header .share a{font-size: 18px;margin-left: 10px;}
}
@media (max-width:767px){
	.space-block{height:55px;}
	header .logo a i{font-size: 35px}
	header .logo a h1{font-size: 16px}
	header .inquiry a{font-size:0;padding: 8px}
	header .inquiry a i{margin-right: 0}
}

.learnmore{display: inline-block;margin-top: 50px;background: #1c1f82;border-radius: 5px;overflow: hidden;box-shadow: 0 15px 15px -13px #00000060;}
.learnmore a{position: relative;z-index: 1;display: inline-block;color: #fff;padding: 12px 32px 12px 37px;text-transform: uppercase;font-weight: 400;font-size: 14px;}
.learnmore a:after{content: '';position: absolute;left: 0;top: 0;z-index: -1;height: 100%;background: #58beed;width: 5px;display: block;transition: all .3s}
.learnmore a i{display: inline-block;margin-left: 15px;transition: all .3s}
.learnmore a:hover i{margin-left: 20px}
.learnmore a:hover:after{width: 100%}

.comm-padding{padding-top: 60px;padding-bottom: 60px}
.comm-title{display: block;position: relative;padding-bottom: 30px;z-index: 50}
.comm-title h1{font-size:50px;display: block;}
.comm-title h1:after{}
.comm-title p{padding:20px 22%;font-size:18px;}

.swiper-pagination{left: 50%;transform: translateX(-50%);bottom: 0px}
.swiper-pagination .swiper-pagination-bullet{width: 18px;margin: 0 4px;height: 5px;border-radius: 3px;transition: all .3s}
.swiper-pagination .swiper-pagination-bullet-active{width: 32px;background:#58beed;}
@media (max-width:1399px){
	.comm-title p{padding:20px 15%;}
}
@media (max-width:991px){
	.comm-title p{padding:20px 0;margin-bottom: 0}
	.learnmore{margin-top: 30px;}
	.learnmore a{font-size:12px;padding: 8px 22px 8px 27px;}

}

.home-product .row > div{padding: 0}
.home-product .row > div:last-child{padding-left: 5%}
.home-product .prut-list{border-radius: 5px;overflow: hidden;box-shadow: 0 15px 15px -13px #00000030;}
.home-product .prut-list .swiper-button-next:after,.home-product .prut-list .swiper-button-prev:after{color: #999;font-size:20px;}
.home-product .prut-list a{display: block;}
.home-product .prut-list a img{width: 100%;object-fit:cover;aspect-ratio:2/1.6;}
.home-product .prut-intro{height: 100%;padding-bottom: 50px}
.home-product .prut-intro dl{display: block;}
.home-product .prut-intro dl dt{display: block;}
.home-product .prut-intro dl dt h1{font-size:45px;font-weight: 500;text-transform: capitalize;}
.home-product .prut-intro dl dd{display: block;padding-top: 30px}
.home-product .prut-intro dl dd fieldset{display: block;margin-bottom: 15px}
.home-product .prut-intro dl dd fieldset:last-child{margin-bottom: 0}
.home-product .prut-intro dl dd fieldset span{padding:5px 20px;background: #f0f0f0;display: inline-block;vertical-align: top;font-size:18px;font-weight: 400;border-radius: 5px;color: #1c1f82}
.home-product .prut-intro dl dd fieldset span i{font-size:20px;display: inline-block;margin-right: 10px;vertical-align: text-bottom;}
.home-product .prut-intro dl dd fieldset p{display: block;padding-top:15px;font-size:18px;margin-left: 20px}
.home-product .prut-intro .learnmore{margin-top: 15px}
.home-product .prut-intro .swiper-pagination{left: 0;transform: translateX(0);}
@media (max-width:1699px){
	.home-product .prut-intro dl dd fieldset{margin-bottom: 10px}
	.home-product .prut-intro dl dd fieldset p{margin-bottom: 10px}
}
@media (max-width:1499px){
	.home-product .prut-list a img{aspect-ratio:2/1.8;}
	.home-product .prut-intro dl dd fieldset{margin-bottom: 5px}
}
@media (max-width:1399px){
	.home-product .prut-list a img{aspect-ratio:auto;}
}
@media (max-width:991px){
	.home-product .row > div:last-child{padding-left: 0;padding-top: 30px}
	.home-product .prut-intro{height: auto;padding-bottom: 40px}
	.home-product .prut-intro dl dt h1{font-size:25px;}
	.home-product .prut-intro dl dd{padding-top: 20px}
	.home-product .prut-intro dl dd fieldset span{font-size: 16px}
	.home-product .prut-intro dl dd fieldset span i{font-size:18px;}
	.home-product .prut-intro dl dd fieldset p{font-size:16px;}
	.home-product .prut-intro .learnmore{margin-top: 25px}
}
@media (max-width:767px){
	.home-product .row > div:last-child{padding-top: 20px}
	.home-product .prut-intro{height: auto;padding-bottom: 30px}
	.home-product .prut-intro dl dt h1{font-size:20px;}
	.home-product .prut-intro dl dd{padding-top: 15px}
	.home-product .prut-intro dl dd fieldset span{font-size:14px}
	.home-product .prut-intro dl dd fieldset span i{font-size:16px;}
	.home-product .prut-intro dl dd fieldset p{font-size:14px;}
}
.home-advantage{padding: 30px 23%}
.home-advantage .why-list{padding: 10px 0;}
.home-advantage .why-list dl{padding:30px;border-radius: 10px;text-align: center;}
.home-advantage .why-list dl dt{font-size: 60px;line-height: 1.5}
.home-advantage .why-list dl dd{display: block;padding-bottom:20px}
.home-advantage .why-list dl dd h2{display: block;font-size:18px;text-transform:capitalize;color: #888}
.home-advantage .why-list dl dd h3{display: block;font-size: 32px;line-height: 1.1;font-weight: 500;color: #333;margin-top:20px}
.home-advantage .swiper-pagination{bottom: 10px}

@media (max-width:1399px){
	.home-advantage{padding: 25px 15%}
	.home-advantage .why-list dl dt{font-size:50px;}
	.home-advantage .why-list dl dd h3{font-size: 25px;}
}
@media (max-width:991px){
	.home-advantage{padding: 20px 0}
	.home-advantage .why-list dl dt{font-size:40px;}
	.home-advantage .why-list dl dd h3{font-size: 20px;line-height: 1.4;}
}

.home-installvideo{position: relative}
.home-installvideo #video-container video{width: 100%;object-fit:cover;aspect-ratio:3/1.3;border-radius: 5px;box-shadow: 0 15px 15px -13px #00000030;}
.home-installvideo .intro{text-shadow: 0 0 8px white;font-size:40px;line-height:40px;font-weight: 500;color: #fff;position: absolute;right: 80px;bottom: 70px;text-transform:uppercase;}
.home-installvideo .intro i{font-size:15px;display: inline-block;margin-right: 15px;vertical-align: top;width: 44px;height: 44px;border-radius: 50%;border:2px #ffffffd0 solid;text-align: center;line-height:40px;padding-left: 3px}
.home-about{padding-top: 30px;padding-bottom: 50px;}
.home-about .row {margin-left: -15px;margin-right: -15px}
.home-about .row > div{padding: 15px}
.home-about .row .img-bg-color{display: block;background: #000;border-radius: 5px;overflow: hidden;box-shadow: 0 15px 15px -13px #00000030;}
.home-about .row .img-bg-color a{display: block;position: relative}
.home-about .row .img-bg-color a img{width: 100%;opacity: 0.7;transition: all 2s}
.home-about .row .img-bg-color a:hover img{transform: scale(1.15);}
.home-about .row .img-bg-color a span{position: absolute;right: 20px;bottom: 20px;text-shadow:0 0 8px white;color: #fff;font-weight: 500;font-size: 25px;transition: all .3s}
.home-about .row .img-bg-color a:hover span{color: #def4fe}
.home-about .row .intro {padding-left: 5%}
.home-about .row .intro h2{font-size:45px;line-height: 1;color: #222;font-weight: 500;text-transform:capitalize;}
.home-about .row .intro fieldset{padding: 30px 0 20px 0; border-top: 1px #ddd solid;margin-top: 30px}
.home-about .num-block dl dt{display: block;white-space: nowrap;}
.home-about .num-block dl dt span{display: inline-block;font-size:45px;font-weight: 600}
.home-about .num-block dl dt sup{font-size:24px;top: -20px;left: 5px}
.home-about .num-block dl dd{display: block;}

@media (max-width:1399px){
	.home-installvideo #video-container video{aspect-ratio: 2/1;}
	.home-installvideo .intro{font-size:30px;}	
}
@media (max-width:1199px){
	.home-installvideo #video-container video{aspect-ratio: auto;}
}
@media (max-width:767px){
	.home-installvideo .intro{font-size:18px;line-height:18px;font-weight: 400;right: 25px;bottom: 25px}
	.home-installvideo .intro i{display: none}
}
.home-solution{background:url(../images/solution_bg.webp) no-repeat; background-size: cover}
.home-solution .comm-title{color: #fff}
.home-solution .comm-title h1{color: #fff}

.home-news{}
.home-news .news-list{padding-bottom:80px;padding-top:10px}
.home-news .news-list dl a{display: block;}
.home-news .news-list dl a dt {display: block;overflow: hidden;background: #000;border-radius: 5px;box-shadow: 0 15px 15px -13px #00000030;}
.home-news .news-list dl a dt img{width: 100%;transition: all .3s;opacity: 0.6}
.home-news .news-list dl a:hover dt img{transform:scale(1.08);opacity: 0.9}
.home-news .news-list dl a dd{display: block;border-bottom: 2px #f0f0f0 solid;padding-bottom: 10px;padding-top: 25px;position: relative;}
.home-news .news-list dl a dd:after{content: '';position: absolute;left: 0;bottom: -2px;width: 0;height: 2px;transition: all .3s;background: #1c1f82}
.home-news .news-list dl a:hover dd:after{width: 100%;}
.home-news .news-list dl a dd h2{font-size:22px;line-height: 30px;height: 150px;transition: all .3s}
.home-news .news-list dl a:hover dd h2{color: #1c1f82}
.home-news .news-list dl a dd p{color: #999}
.home-news .news-list .swiper-button-prev,.home-news .news-list .swiper-button-next{top: 30%}
.home-news .news-list .swiper-button-prev:after,.home-news .news-list .swiper-button-next:after{color: #fff;font-size:20px;}
.home-news .swiper-pagination{bottom: 20px}

.home-solution{padding-top: 80px;padding-bottom:80px}
.home-solution .solution-list .row > div{padding: 0}
.home-solution .solution-list .row > div img{width: 100%;border-radius: 5px}
.home-solution .solution-list .row > div:last-child {padding-left:5%}
.home-solution .solution-list .row > div h1{color: #fff;text-transform: uppercase;font-size:40px;}
.home-solution .solution-list .row > div p{color: #fff;display: block;margin-top: 30px;font-size:18px;line-height: 28px}
.home-solution .solution-list .row > div ul{height: auto;font-size:0;display: block;padding-top: 50px}
.home-solution .solution-list .row > div ul li{width: 40%;vertical-align: top;font-size:18px;display: inline-block;line-height: 35px;color: #fff;font-weight: 400}
.home-solution .solution-list .row > div ul li i{font-size:16px;display: inline-block;line-height:35px;vertical-align: top;margin-right: 10px}
.home-solution .solution-list .swiper-button-prev:after,.home-solution .solution-list .swiper-button-next:after{color: #fff;font-size: 20px}


.footer{background:#1c1f82;padding-top: 20px;}
.footer .row > div{padding: 0}
.footer .row .foot-logo a{color: #fff;font-size: 50px}
.footer .row .foot-menu{gap:5%;padding-right:10%}
.footer .row .foot-menu dl{flex: none;}
.footer .row .foot-menu dl dt{display: block;padding-bottom: 20px}
.footer .row .foot-menu dl dt h2{color: #fff;font-size: 22px;text-transform: uppercase;}
.footer .row .foot-menu dl dd{display: block;}
.footer .row .foot-menu dl dd a{color: #fff;display: block;margin:5px 0;font-weight:300}
.footer .row .foot-menu dl dd a:hover{color: #58beed}
.footer .row .foot-contact h1{color: #fff;font-size:25px;line-height:1}
.footer .row .foot-contact ul{height: auto;padding-top: 30px;}
.footer .row .foot-contact ul li{line-height:22px;height: auto;color: #fff;margin-bottom: 15px;}
.footer .row .foot-contact ul li a{color: #fff;line-height:22px;font-size:15px;font-weight: 300}
.footer .row .foot-contact ul li a i{display: inline-block;line-height:22px;vertical-align: top;width: 22px}
.footer .row .foot-contact ul li a:hover{color: #58beed}
.footer .row .foot-phone h2{font-size:18px;color: #fff;display: block;margin-bottom: 20px}
.footer .row .foot-phone{display: block;margin-top: 20px}
.footer .row .foot-phone a{display: inline-block;line-height:24px;padding:5px 25px;border-radius: 5px;border:1px #ffffff90 solid;color: #fff;font-weight: 400}
.footer .row .foot-phone a i{display: inline-block;vertical-align: top;line-height:24px;margin-right: 12px}
.footer .row .foot-phone a:hover{background: #58beed;border-color: #58beed}

.copyright{background: #222;padding-top: 15px;padding-bottom: 15px;color: #fff;font-size: 14px;}
.copyright a{color: #fff}