@charset 'utf-8';

.product_banner{position: relative; overflow: hidden;}
.product_banner .picture{overflow: hidden;}
/* .product_banner .picture img{position: relative; left: 50%; transform: translateX(-50%);} */
.product_banner .picture img{width: 100%;}
.product_banner .content{width: 100%; position: absolute; left: 0; top: 50%; transform: translateY(-50%);}
.product_banner .content .title{max-width: 480px; font-size: 36px; line-height: 42px; font-family: 'Poppins SemiBold'; color: #f3f3f3;}
.product_banner .content .text{max-width: 730px;}
.product_banner .content .text p{font-size: 16px; line-height: 26px; color: #f3f3f3; position: relative; padding-left: 26px; margin-top: 20px;}
.product_banner .content .text p::after{width: 9px; height: 9px; content: ''; border: solid #efefef 3px; border-radius: 50%; position: absolute; left: 0; top: 5px;}
.product_banner .content .button{margin-top: 30px;}
.product_banner .content .button a{display: inline-block; line-height: 42px; padding: 0 20px; font-size: 14px; border-radius: 6px; background: #fff; color: #000;}

.con_banner{position: relative; overflow: hidden;}
.con_banner .picture{overflow: hidden;}
.con_banner .picture img{width: 100%;}
.con_banner .content{width: 100%; position: absolute; left: 0; top: 50%; transform: translateY(-50%);}
.con_banner .content .text{text-align: center; font-size: 36px; line-height: 46px; font-family: 'Poppins Medium'; color: #fff;}

.categorylist{padding: 40px 0; background: #f5f5f5;}
.categorylist .list{width: 32%; float: left; background: #fff; border-radius: 10px; overflow: hidden; margin: 0 2% 30px 0;}
.categorylist .list:hover{box-shadow: 5px 5px 8px 8px #eee;}
.categorylist .list:nth-child(3n){margin-right: 0;}
.categorylist .list:nth-child(3n+1){clear: both;}
.categorylist .list .picture{height: 200px; padding: 20px 0; text-align: center; overflow: hidden;}
.categorylist .list .picture a{display: block; height: 100%;}
.categorylist .list .picture img{height: 100%; transition: all 0.5s;}
.categorylist .list:hover .picture img{transform: scale(1.1);}
.categorylist .list .title{margin-top: 10px; text-align: center;}
.categorylist .list .title a{font-size: 22px; line-height: 24px; font-family: 'Poppins Medium'; color: #161616;}
.categorylist .list .button{margin-top: 15px;}
.categorylist .list .button a{display: block; line-height: 50px; font-size: 18px; text-align: center; background: #b9b9b9; color: #fff; border-radius: 5px; transition: all 0.5s;}
.categorylist .list:hover .button a{background: #009ca3;}

.productlist{padding: 40px 0; background: #f5f5f5;}
.productlist .list{width: 23.5%; float: left; background: #fff; border-radius: 10px; overflow: hidden; margin: 0 2% 30px 0;}
.productlist .list:nth-child(4n){margin-right: 0;}
.productlist .list:nth-child(4n+1){clear: both;}
.productlist .list .picture{height: 200px; padding: 20px 0; text-align: center; overflow: hidden;}
.productlist .list .picture a{display: block; height: 100%;}
.productlist .list .picture img{height: 100%; transition: all 0.5s;}
.productlist .list:hover .picture img{transform: scale(1.1);}
.productlist .list .title{padding: 0 28px; height: 40px; overflow: hidden;}
.productlist .list .title a{font-size: 16px; line-height: 20px; font-family: 'Poppins SemiBold'; color: #161616; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis;}
.productlist .list .text{padding: 10px 28px 15px; font-size: 14px; font-family: 'Poppins Light'; color: #8e8e8e; position: relative; display: none;}
.productlist .list .text::after{content: ''; width: 60px; height: 2px; background: #eee; position: absolute; left: 28px; bottom: 0;}
.productlist .list .button{padding: 15px 28px 20px;}
.productlist .list .button a{font-size: 14px; text-transform: uppercase; color: #009ca3;}

.productadvantages{padding: 60px 0 40px;}
.productadvantages .advantages_title{text-align: center;}
.productadvantages .advantages_title h2{font-size: 36px; line-height: 56px; text-transform: uppercase;}
.productadvantages .advantagescontent{position: relative; padding: 30px 40px 0;}
.productadvantages .advantagesSwiper{overflow: hidden;}
.productadvantages .advantagesSwiper .swiper-slide{padding: 20px; box-sizing: border-box;}
.productadvantages .advantagesSwiper .list{background: #f9f9f9; transition: all 0.5s;}
.productadvantages .advantagesSwiper .list:hover{background: #fff; box-shadow: 0 0 10px 10px #eee;}
.productadvantages .advantagesSwiper .list .picture{overflow: hidden;}
.productadvantages .advantagesSwiper .list .picture img{width: 100%; transition: all 0.5s;}
.productadvantages .advantagesSwiper .list:hover .picture img{transform: scale(1.1);}
.productadvantages .advantagesSwiper .list .content{padding: 15px 15px 20px;}
.productadvantages .advantagesSwiper .list .content .title{font-size: 18px; height: 48px; line-height: 24px; overflow: hidden;}
.productadvantages .advantagesSwiper .list .content .title a{color: #161616; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis;}
.productadvantages .advantagesSwiper .list .content .text{margin-top: 10px; font-size: 14px; line-height: 18px; height: 36px; font-family: 'Poppins Light'; color: #8e8e8e; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis;}
.productadvantages .advantagesSwiper .list .content .button{margin-top: 10px;}
.productadvantages .advantagesSwiper .list .content .button a{display: block; width: 19px; height: 13px; background: url("../images/button.png");}
.productadvantages .advantagesSwiper .swiper-button-prev,
.productadvantages .advantagesSwiper .swiper-button-next{width: 40px; height: 40px; opacity: 1; cursor: pointer;}
.productadvantages .advantagesSwiper .swiper-button-prev{left: 0; background: url("../images/arrow_left.png");}
.productadvantages .advantagesSwiper .swiper-button-next{right: 0; background: url("../images/arrow_right.png");}
.productadvantages .advantagesSwiper .swiper-button-prev:hover{background: url("../images/arrow_left_hover.png");}
.productadvantages .advantagesSwiper .swiper-button-next:hover{background: url("../images/arrow_right_hover.png");}

.productsuperiority{padding: 60px 0 40px; background: #fafafb;}
.productsuperiority .superiority_title{text-align: center;}
.productsuperiority .superiority_title h2{font-size: 36px; line-height: 56px; text-transform: uppercase;}
.productsuperiority .superioritycontent{position: relative; padding: 30px 40px 0;}
.productsuperiority .superioritySwiper{overflow: hidden;}
.productsuperiority .superioritySwiper .swiper-slide{padding: 20px; height: auto; box-sizing: border-box;}
.productsuperiority .superioritySwiper .list{height: 100%; box-sizing: border-box; padding: 50px 20px; text-align: center; background: linear-gradient(to bottom, #f4f5f8, #fff); border: solid #fff 2px; border-radius: 10px; transition: all 0.5s;}
.productsuperiority .superioritySwiper .list:hover{box-shadow: 0 0 10px 10px #eee;}
.productsuperiority .superioritySwiper .list .icon{height: 58px;}
.productsuperiority .superioritySwiper .list .icon img{height: 100%;}
.productsuperiority .superioritySwiper .list .title{font-size: 24px; line-height: 26px; font-family: 'Poppins Bold'; color: #292929; margin-top: 20px;}
.productsuperiority .superioritySwiper .list .text{font-size: 16px; line-height: 24px; font-family: 'Poppins Light'; color: #5e5e5e; margin-top: 20px;}
.productsuperiority .superioritySwiper .swiper-button-prev,
.productsuperiority .superioritySwiper .swiper-button-next{width: 40px; height: 40px; opacity: 1; cursor: pointer;}
.productsuperiority .superioritySwiper .swiper-button-prev{left: 0; background: url("../images/arrow_left.png");}
.productsuperiority .superioritySwiper .swiper-button-next{right: 0; background: url("../images/arrow_right.png");}
.productsuperiority .superioritySwiper .swiper-button-prev:hover{background: url("../images/arrow_left_hover.png");}
.productsuperiority .superioritySwiper .swiper-button-next:hover{background: url("../images/arrow_right_hover.png");}
.productsuperiority .superioritybutton{margin-top: 30px; text-align: center;}
.productsuperiority .superioritybutton a{display: inline-block; padding: 0 30px; line-height: 42px; font-size: 16px; font-family: 'Poppins Medium'; background: #009ca3; color: #fff; border-radius: 6px;}

@media (max-width:960px) {
	/* .product_banner .picture img{width: 150%;} */
	.product_banner .content{box-sizing: border-box; padding: 0 10px;}
	.product_banner .content .title{max-width: 100%; font-size: 16px; line-height: 28px;}
	.product_banner .content .text{display: none;}
	.product_banner .content .button{display: none;}
	
	/* .con_banner .picture img{height: 140px;} */
	.con_banner .content{box-sizing: border-box; padding: 0 10px;}
	.con_banner .content .text{font-size: 14px; line-height: 22px; text-align: left;}
	
	.categorylist{padding: 30px 10px}
	.categorylist .list{width: 49%; padding: 20px 0 0; border-radius: 0; margin: 0 2% 20px 0;}
	.categorylist .list:nth-child(3n){margin-right: 2%;}
	.categorylist .list:nth-child(3n+1){clear: none;}
	.categorylist .list:nth-child(2n){margin-right: 0;}
	.categorylist .list:nth-child(2n+1){clear: both;}
	.categorylist .list .picture{height: 130px; padding: 0;}
	.categorylist .list .title{margin-top: 10px; padding: 0 8px;}
	.categorylist .list .title a{display: block; font-size: 14px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
	.categorylist .list .button{margin-top: 5px;}
	.categorylist .list .button a{line-height: 32px; font-size: 12px; padding: 0 20px; border-radius: 0;}
	
	.productlist{padding: 30px 10px;}
	.productlist .list{width: 49%; padding: 20px 0 0; border-radius: 0; margin: 0 2% 20px 0;}
	.productlist .list:nth-child(2n){margin-right: 0;}
	.productlist .list:nth-child(2n+1){clear: both;}
	.productlist .list .picture{height: 130px; padding: 0;}
	.productlist .list .picture a{display: block; height: 100%;}
	.productlist .list .title{padding: 0 8px; height: 40px; margin-top: 10px;}
	.productlist .list .title a{font-size: 14px;}
	.productlist .list .button{padding: 10px 8px 10px;}
	.productlist .list .button a{font-size: 14px;}
	
	.productadvantages{padding: 30px 0;}
	.productadvantages .advantages_title h2{font-size: 24px; line-height: 38px;}
	.productadvantages .advantagescontent{position: relative; padding: 20px 40px 0;}
	.productadvantages .advantagesSwiper .swiper-slide{padding: 10px;}
	.productadvantages .advantagesSwiper .list:hover{background: #fff; box-shadow: 0 0 5px 5px #f2f2f2;}
	.productadvantages .advantagesSwiper .list .content{padding: 15px 15px 20px;}
	.productadvantages .advantagesSwiper .list .content .title{font-size: 18px; height: 48px; line-height: 24px; overflow: hidden;}
	.productadvantages .advantagesSwiper .list .content .title a{color: #161616; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis;}
	.productadvantages .advantagesSwiper .list .content .text{margin-top: 10px; font-size: 14px; line-height: 18px; height: 36px; font-family: 'Poppins Light'; color: #8e8e8e; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; overflow: hidden; text-overflow: ellipsis;}
	
	.productsuperiority{padding: 30px 0;}
	.productsuperiority .superiority_title h2{font-size: 24px; line-height: 38px;}
	.productsuperiority .superioritycontent{position: relative; padding: 20px 40px 0;}
	.productsuperiority .superioritySwiper .swiper-slide{padding: 10px;}
	.productsuperiority .superioritySwiper .list{padding: 30px 20px; text-align: center; border-radius: 10px;}
	.productsuperiority .superioritySwiper .list:hover{box-shadow: 0 0 10px 10px #eee;}
	.productsuperiority .superioritySwiper .list .icon{height: 58px;}
	.productsuperiority .superioritySwiper .list .icon img{height: 100%;}
	.productsuperiority .superioritySwiper .list .title{font-size: 16px; line-height: 22px; text-align: left; margin-top: 20px;}
	.productsuperiority .superioritySwiper .list .text{font-size: 14px; line-height: 20px; text-align: left; margin-top: 20px;}
	.productsuperiority .superioritybutton{margin-top: 20px; text-align: center;}
	.productsuperiority .superioritybutton a{padding: 0 25px; line-height: 36px; font-size: 14px;}
}