@charset "utf-8";
/* CSS Document */
/*-----------------------------------------Home-----------------------------------------*/
/*-------
banner
-------*/
#index-banner{position:relative; width:100%; overflow:hidden;}
#index-banner .indexbarimg{
width:100%;
height:auto;
min-height:100%;
transition:0.6s linear 1s;
transform:scale(1.2,1.2);
}
#index-banner .swiper-slide-active .indexbarimg,#index-banner .swiper-slide-duplicate-active .indexbarimg{transition:1s linear;transform:scale(1.3,1.3);}
#index-banner .swiper-slide-active .indexbarimg,#index-banner .swiper-slide-duplicate-active .indexbarimg{transition:1s linear;transform:scale(1,1);}
.banner-txt-1{ position: absolute;left: 5%; top:5%;}
.banner-large-title{font-size:12rem; font-weight:bold; text-transform:uppercase; -webkit-text-stroke: 1px rgba(255,255,255,.2); text-stroke: 1px rgba(255,255,255,.2); color:transparent; -webkit-background-clip: text;-moz-background-clip: text;background-clip: text;color: transparent; line-height:1.8em; text-shadow:.6px .5px .6px rgba(255,255,255,.1);}
.banner-txt-1 .banner-mid-txt{ z-index:1; margin-top:-7rem; display: -webkit-flex; display: flex; font-size:8rem; font-weight:bold; text-transform:uppercase; color:#fff;}
.index-banner-txt{ margin-left:2rem;}
.index-banner-txt-line{ width:80%; height:15px; background-color:var(--web-theme-color); margin-top:1.4rem;}
.banner-mid-txt1{font-size:8rem; font-weight:bold; text-transform:uppercase; color:#fff; line-height:1.6em; }
.banner-small-txt{padding-top:3rem;color:#fff; font-weight:lighter;}
.banner-txt-1 .banner-small-txt{display: -webkit-flex; display: flex;}
.banner-small-txt-iocn{ width:10px; height:20px; background-color:var(--web-theme-color); margin-top:5px;}
.banner-small-txt ul{ margin-left:2rem;}
.banner-small-txt ul li{font-size:2rem; line-height:1.6em; white-space:nowrap;}
#index-banner #playbox{
position:absolute;
left:-4%;
top:58.5%;
width:20%;
height:32%;
border-radius:50px;
display: -webkit-flex;
display: flex;
justify-content:center;
align-items:center;
text-align:center;
}
.com-linkbutton a .banner-txt-link-txt{position:absolute; left:8%; top:73%; text-transform:uppercase; font-size:2rem; color: #fff; }
.com-linkbutton a:hover .banner-txt-link-txt{color:var(--web-theme-color);}
.indexsmallimg{ display:none;}
/*-------
company overview
-------*/
#company-overview{ position:relative; background-color:#fff; overflow:hidden; padding:0; padding-bottom:6rem;}
.company-overviewbg{position:absolute;left:0; top:0; width:100%; height:100%;}
#company-overview .sy-container{ position:relative; z-index:2; max-width:1820px;}
#company-overview .grid{grid-template-columns:repeat(2,1fr);align-items: center;}
#company-overview h2{ text-align:left; padding-top:14rem;}
#company-overview h2 span{color:var(--web-theme-color); }
.company-overview-conent:first-child p{ margin:4rem 0;}
.company-overview-conent:last-child{ margin-top:20vh;}
.company-overview-conent:last-child .more{ float:right;}
.company-overview-conent-info{ margin-top:12rem; }
.company-overview-conent-info h4{ border-bottom:#ccc solid 1px; padding-bottom:2rem;}
.company-overview-conent-info .grid-1{grid-template-columns:repeat(3,1fr); align-items: center; grid-column-gap:4rem; margin-top:6rem;}
.company-overview-conent-info-content{border-right:#ccc solid 1px; padding:0 4rem; }
.company-overview-conent-info-content-txt{display: -webkit-flex; display: flex;font-size:6rem; color:var(--web-theme-color); font-weight:600;}
.company-overview-conent-info-content-title{ margin-top:1.4rem; }
.company-overview-conent-info-content-txt span{ display:block; margin-left:1.4rem; font-size:1.4rem; vertical-align:text-top; color:var(--web-theme-color-gray); }
.company-overview-conent-info-content p{ padding-top:1.6rem; font-weight:500; color:#333; white-space:nowrap;}
.company-overview-conent-info-content:last-child{ border:none;}
/*------
product features
--------*/
#product-features{ background-color:#e8360d; padding:0; overflow:hidden;}
#product-features .wrap-flex{align-items: center;}
.product-features-content:first-child{flex:0 0 40%;}
.product-features-content:last-child{flex:0 0 60%; margin-left:8rem;}
.product-features-content:first-child img{ width:100%;}
#product-features .grid{grid-template-columns:repeat(3,1fr); grid-gap:4rem 2rem; align-items:center;}
.product-features-content-icon{display: -webkit-flex; display: flex;}
.product-features-content-icon p{ margin-left:2rem; color:#fff;word-wrap:break-word;word-break:break-all;}
/*------
product center
--------*/
#product-center{ padding-top:8rem; padding-bottom:12rem; position:relative;}
#product-center h3{ text-transform:capitalize; text-align:center; line-height:1.8em;}
#product-center .grid{grid-template-columns:repeat(4,1fr); align-items: center;grid-gap:20px; margin-top:6rem;}
#product-center ul li{ background-color:#f1f1f1; padding: 5px 4rem; border-radius:10px;text-align:center;}
#product-center ul li a{flex:0 0 auto; color:#333;}
#product-center ul li:hover{ background-color:var(--web-theme-color);}
#product-center ul li:hover a{color:#fff;}
/*swiper*/
.product-center-list{ margin-top:6rem;}
#product-center .swiper-pagination{ display:none;}
#product-center .swiper-button-next,#product-center .swiper-button-prev{font-size:2.2rem;color:#fff; top:60%; width:30px;hight:30px; background-color:#333; }
#product-center .swiper-button-next{ right:2%;}
#product-center .swiper-button-prev{left:2%;}
#product-center .swiper-button-next:after,#product-center .swiper-button-prev:after{font-size:2.2rem; color:#fff;top:60%;}
/*------
home
--------*/
#Home-overiew{ background:url(../Images/index/about/aboutbg-1.webp) no-repeat center; background-size:cover;}
#Home-overiew .grid{grid-template-columns:1.2fr 1.7fr; align-items: center;grid-column-gap:18rem; margin-top:5rem;}
.company-overiew-content h2{ text-align:left;}
.company-overiew-content h2 span{color:var(--web-theme-color);}
.company-overiew-content:last-child{ z-index:1; margin-top:-22rem;}
#Home-overiew .more{ margin-top:12rem;}
/*-------
news
-------*/
/*newslist*/
#news h2{ text-align:left; color:#333; border-bottom:var(--web-theme-color) solid 5px; }
#news .news-list{display: -webkit-grid; display: grid; grid-template-columns:2fr 1fr; align-items: center;grid-column-gap:4rem;}
#news .news-item h2{ padding-top:1.6rem; font-size:2.4rem; border:none;}
#news a{ display:block; margin-top:4rem; text-decoration:none; overflow:hidden;}
#news p{ padding-top:1.6rem; word-wrap:break-word; word-break:break-all;}
#news em{color:var(--web-theme-color-gray);}
#news a:hover img{opacity:0.6;}
#news a:hover h2,#news a:hover p{color:var(--web-theme-color);}
/*moblie phone*/
@media (max-width:1023px){
/*banner*/
.banner-txt-1{ position: absolute;left: 2%; top:8%;}
.banner-large-title{ display:none;}
.banner-txt-1 .banner-mid-txt{margin-top:0; font-size:2.6rem;}
.index-banner-txt{ margin-left:1.2rem; font-size:2.6rem;}
.index-banner-txt-line{ display:none}
.banner-mid-txt1{font-size:2.6rem; line-height:1.6em; }
.banner-small-txt{padding-top:1rem;}
.banner-small-txt-iocn{display:none;}
.banner-small-txt ul{ margin-left:0;}
.banner-small-txt ul li{font-size:1.6rem;}
.com-linkbutton a .banner-txt-link-txt{position:absolute; left:12%; top:72%;font-size:1.8rem; }
/*company overview*/
#company-overview{padding:0; padding-bottom:6rem;}
#company-overview .sy-container{ max-width:100%;}
.company-overviewbg{ display:none;}
#company-overview .grid{grid-template-columns:1fr;}
#company-overview h2{padding-top:4rem;}
.company-overview-conent:first-child p{ margin:2rem 0;}
.company-overview-conent:last-child{ margin-top:2vh;}
.company-overview-conent:last-child .more{ margin-top:4rem;}
.company-overview-conent-info{ margin-top:16rem;}
.company-overview-conent-info .grid-1{grid-template-columns:repeat(2,1fr); align-items: center; grid-column-gap:4rem; grid-row-gap:4rem; margin-top:6rem;}
.company-overview-conent-info-content{ padding:0; border-right:none;}
.company-overview-conent-info-content-txt{font-size:5rem;}
.company-overview-conent-info-content-title{ margin-top:1.4rem; }
.company-overview-conent-info-content p{ padding-top:1.6rem;}
/*product features*/
#product-features .wrap-flex{ flex-direction: column;}
.product-features-content:first-child{flex:0 0 auto;}
.product-features-content:last-child{flex:0 0 auto; margin-left:0; padding:2.2rem;}
#product-features .grid{grid-template-columns:repeat(2,1fr); grid-gap:2rem 3rem;}
.product-features-content-icon p{ margin-left:2rem;}
.product-features-content-icon img{ width:20%; height:20%;}
/*product features*/
product-features-content-icon p{ margin-left:2rem; color:#fff;word-wrap:break-word;word-break:break-all;}
/*product center*/
#product-center{ padding-top:4rem; padding-bottom:12rem; position:relative;}
#product-center h3{ text-transform:capitalize; text-align:center; line-height:1.8em;}
#product-center .grid{grid-template-columns:repeat(2,1fr); align-items: center;grid-gap:20px; margin-top:6rem;}
#product-center ul li{ background-color:#f1f1f1; padding: 5px 4rem; border-radius:10px;text-align:center;}
#product-center ul li a{flex:0 0 auto; color:#333;}
#product-center ul li:hover{ background-color:var(--web-theme-color); cursor:pointer;}
#product-center ul li:hover a{color:#fff;}
/*swiper*/
.product-center-list{ margin-top:6rem;}
.product-center-list .swiper-wrapper{ padding-bottom:2rem;}
#product-center .swiper-button-next,#product-center .swiper-button-prev{display:none; }
#product-center .swiper-button-next:after,#product-center .swiper-button-prev:after{ display:none;}
#product-center .swiper-pagination{ display:block; width:100%; margin: 0 auto; font-size:1.8rem;}
#product-center .swiper-pagination-bullet{ width:30px; height:10px;}
#product-center .swiper-pagination-bullet-active{background-color:var(--web-theme-color);}
/*home*/
#Home-overiew .grid{grid-template-columns:1fr;grid-column-gap:0;grid-row-gap:4rem; margin-top:5rem;}
.company-overiew-content h2{ text-align:left;}
.company-overiew-content h2 span{color:var(--web-theme-color);}
.company-overiew-content:last-child{ z-index:1; margin-top:0;}
#Home-overiew .more{ margin-top:8rem;}
/*news*/
#news .news-list{display: -webkit-grid; display: grid; grid-template-columns:1fr; grid-column-gap:0; grid-row-gap:2rem;}
#news .news-item h2{ padding-top:1.6rem; font-size:2.4rem; border:none;}
#news a{ display:block; margin-top:4rem;}
#news p{ padding-top:1.6rem;}
}