﻿.banner{width:100%;}
.swiper-container {width: 100%;height: auto;border-radius:0 0 250px 0;overflow:hidden;}
.swiper-slide {width:100%;height:100%;overflow:hidden;text-align: center;font-size: 18px;background: #fff;display: -webkit-box;display: -ms-flexbox;display: -webkit-flex;display: flex;-webkit-box-pack: center;-ms-flex-pack: center;-webkit-justify-content: center;justify-content: center;-webkit-box-align: center;-ms-flex-align: center;-webkit-align-items: center;align-items: center;}
.swiper-slide a{height:100%;}
.swiper-slide img{height:100%;transition: all 0.5s;margin:0 auto;}
.swiper-slide:hover img{transform: scale(1.05);}

.about{background:url(/images/about-bg.jpg?v=1) no-repeat center bottom;background-size:100% auto;padding-bottom:380px;}
.about .wrap{padding-top:90px;display:flex;}
.about .text{width:75%;}
.about .text h1{font-size:var(--f26);font-weight:bold;color:#006835;padding-bottom:20px;}
.about .text h2{font-size:var(--f40);font-weight:600;line-height:1.3;text-align:justify;}
.about .text p{font-size:var(--f18);color:#4d4c4c;line-height:2;padding:50px 0 80px 0;font-weight:400;text-align:justify;}

.about .num{width:30%;text-align:right;padding-top:40px;}
.about .num li{padding-bottom:55px;color:#006835;}
.about .num li h3{font-size:var(--f30);}
.about .num li h3 span{font-family:gilroy-bold;font-size:var(--f80);line-height:var(--f60)}
.about .num li p{color:#666;font-size:var(--f18);font-weight:400;}
.about .num .more{display:none;}

.more{display:block;width:180px;background:#fabf16;color:#fff;font-size:var(--f18);text-align:center;line-height:52px;}

.product{padding-bottom:80px;}
.product .title{display:flex;padding:120px 0 50px 0;justify-content:space-between;}
.product .title h1{font-size:var(--f50);color:#000;font-weight:bold;}
.product .title ul{display:flex;justify-content:flex-end;width:52%;justify-content:space-between;}
.product .title li{width:23%;line-height:55px;font-size:var(--f22);color:#827e7e;border-radius:30px;border:1px solid #cdcdcd;text-align:center;cursor:pointer;height:55px;}
.product .title li.on{background:#006835;border:none;color:#fabf16;font-weight:500;}
.product .plist{display:none;}
.product .plist.active{display:block;}
.product .plist ul{display:flex;flex-wrap:wrap;justify-content:space-between;}
.product .plist ul li{width:23%;color:#006835;padding-bottom:40px;text-align:center;}
.product .plist ul li .img{width: 100%;height: 0;padding-top: 100%;position: relative;overflow: hidden;border-radius:20% 0;box-sizing:border-box;border:1px solid #006835;}
.product .plist ul li .img img{position: absolute;object-fit: cover;width: 100%;left: 50%;top: 50%;transform: translate(-50%, -50%);}
.product .plist ul li h1{font-size:var(--f28);color:#006835;font-weight:600;padding-top:20px;line-height:1.6}
.product .plist ul li p{font-size:var(--f16);color:#999;display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 1;overflow: hidden;}
.product .plist ul li:hover .img{}

.ad{width:100%;height:auto;background:url(/images/ad.jpg) no-repeat top right;border-radius:180px 0 0 0;color:#fff;background-size:auto 100%;}
.ad .text{width:55%;padding:8vw 0 8vw 3vw;}
.ad h2{font-size:var(--f50);font-weight:600;padding-bottom:30px;}
.ad p{font-size:var(--f18);line-height:1.8;text-align:justify;}

.article{padding-top:100px;padding-bottom:150px;box-sizing:border-box;}
.article .title{display:flex;justify-content:space-between;padding-bottom:50px;}
.article .title h1{font-size: var(--f50);font-weight: bold;color:#000;}
.article .title .more{height:52px;}
.article .more2{display:none;}

.article .list{display:flex;justify-content:space-between;position:relative;}
.article .list .swiper-article{width:50%;margin:0;height:500px;border-radius:0;}
.swiper-article .swiper-slide a{display:flex;width:100%;height:100%;position:relative;justify-content:center;overflow:hidden;}
.swiper-article .swiper-slide a *{transition-duration: 0.5s;}
.swiper-article .swiper-slide a img{width: 100%;height: 100%;object-fit: cover;position: absolute;left: 0;top: 0;}
.swiper-article .swiper-slide div{background-image: linear-gradient(to bottom, rgba(255, 255, 255, 0), rgba(0, 0, 0, 0.7));position:absolute;left:0;bottom:0;width:100%;color:#fff;text-align:left;padding:5% 6%;box-sizing:border-box;}
.swiper-article .swiper-slide div h1{font-size:var(--f26);line-height:36px;font-weight:600;}
.swiper-article .swiper-slide div h3{font-size:16px;line-height:30px;}

.article .list .right{width:50%;box-sizing:border-box;background:#f6f6f6;padding:40px 0 40px 4%;}
.list .right ul{display:flex;flex-direction:column;justify-content:space-between;height:100%;}
.article .list li *{transition: all 0.5s;}
.article .list li{width:100%;padding:20px 0 20px 20px;position:relative;box-sizing:border-box;}
.article .list li:after{content:"";background:#006835;width:5px;height:0;position:absolute;top:0;right:0;transition: all 0.5s;}
.article .list li a{display:flex;justify-content:space-between;}
.article .list li h1{font-size:var(--f22);line-height:1.6;color:#444;font-weight:500;width:70%;}
.article .list li h3{font-size:var(--f18);font-weight:400;padding-bottom:10px;width:30%;text-align:center;color:#888;line-height:1.7;}
.article .list li:hover:after{height:90px;}
.article .list li:hover h1,.article .list li:hover h3{color:#006835;font-weight:bold}

@media screen and (max-width:1440px){
	.swiper-container{height:650px;border-bottom-right-radius:200px;}
	.about{padding-bottom:280px;}

}
@media screen and (max-width:1280px){
	.swiper-container{height:550px;}
	.about{padding-bottom:240px;}
	.about .num li{padding-bottom:40px;}
	.product .title{padding:100px 0 40px 0;}

	.article .list .swiper-article{height:450px;}
	.article .list .item h1{font-size:18px;line-height:26px;}
}
@media screen and (max-width:1024px) {
	.swiper-container{width:100%;height:40vw;border-radius:0 0 200px 0;}
	.about{padding-bottom:200px;}
	.about .text{width:100%;}
	.product .title ul{width:60%;}
	.product .title ul li{line-height:45px;height:45px;}
	
	.ad{border-radius:150px 0 0 0;}
	.ad .text{width:70%;}

	.article .list .swiper-article{height:450px;}
}
@media screen and (max-width: 820px){
	.banner{width:100%;box-sizing:border-box;}
	.swiper-container{width:100%;height:auto;border-radius:0 0 150px 0;}
	.swiper-slide img{width:100%;height:auto;}
	.about{padding-bottom:150px;background-size:120% auto;}
	.about .text p{line-height:1.8;}
	.about .num{padding-top:30px;}
	
	.ad{background-position:-300px bottom;border-radius:70px 0 0 0;}
	.ad .text{width:85%;}

	
	.article{padding-top:80px;padding-bottom:80px;}
	.article .title{width:96%;margin:0 auto;}
	.article .title h2{font-size:34px;padding-bottom:20px;}
	.article .list{flex-direction:column;}
	.article .list .swiper-article{height:350px;width:100%;}	
	.article .list li{padding:7px 0 7px 0;}
	.article .list .right{width:100%;}
}
@media screen and (max-width:768px){
	.swiper-container{border-radius:0 0 80px 0;}
	.swiper-slide a{width:100%;}
	.product .plist ul li h1{padding-top:10px;}
}

@media screen and (max-width:670px){
	.about{padding-bottom:120px;background:url(/images/about-bg-wap.jpg) no-repeat bottom left;background-size:100% auto;}
	.about .wrap{padding:50px 0 0 0;flex-wrap:wrap;}
	.about .text{width:100%;padding-left:20px;padding-right:20px;}
	.about .num{width:100%;padding-top:0;}
	.about .num .more{display:block;margin-top:20px;margin-left:20px;width:130px;line-height:45px;}	
	.about .text p{padding:30px 0 30px 0;font-size:15px;}
	.about .num ul{display:flex;}
	.about .num li{text-align:center;box-sizing:border-box;padding:0 2px;width:33.3%;}
	.about .num li p{font-size:13px;}
	
	.more{font-size:15px;width:150px;line-height:45px;}

	.product{padding-bottom:50px;}
	.product .title{padding:50px 0 20px 0;flex-wrap:wrap;}
	.product .title h1{width:100%;text-align:center;padding-bottom:20px;}
	.product .title ul{width:100%;}
	.product .title ul li{line-height:40px;height:40px;}
	.product .plist ul li{width:48%;padding-bottom:20px;}

	.ad{border-radius:80px 0 0 0;background:url(/images/ad-wap.jpg?v=1) no-repeat bottom center;background-size:auto 100%;}
	.ad .text{width:100%;padding:60px 0 100px 0;}	

	.article{padding:50px 0;}
	.article .title{padding-bottom:20px;justify-content:center;}	
	.article .title .more{display:none;}
	.article .more2{display:block;margin:40px auto 0 auto;}
	.article .list .right{padding:20px;}
	.article .list .swiper-article{height:230px;}	
	.swiper-article .swiper-slide div{padding:10px 10px;}
	.swiper-product .swiper-slide a div{padding-top: 124%;}
	.swiper-product .swiper-slide a div h1{font-size:20px;line-height:20px;}

	.swiper-article .swiper-slide div h1{font-size:17px;line-height:24px;}
	.article .list li h3{text-align:right;font-size:14px;}
}