@charset "utf-8";
/*banner*/
#banner ul li img{display: block;width: 100%;}
#banner .swiper-pagination-bullet{background: #fff;width: 50px;height: 2px;border-radius: unset;}

#about{background:#FDFDFD url(../images/about-bg.jpg) no-repeat left bottom;padding:90px 0 100px}
#about .container{max-width:1700px}
#about .aboutL{flex:1;display:flex;align-items:center;justify-content:center;margin-right:20px}
#about .aboutL>div{max-width:600px}
.title .en{color:#DD4554;border-bottom:1px solid #DD4554;font-weight:bold;font-size:16px;width:210px}
.title .cn{font-size:34px;font-weight:bold;color:#084558;line-height: 1;margin-top: 20px;}
#about .aboutL .about-txt{text-indent:2em;color:#9A9A9A;font-size:16px;margin: 20px 0 30px;}
#about .aboutL .about-ul li{line-height:30px;color:#084558}
#about .aboutL .about-ul li:before{display:inline-block;content:'';width:15px;height:12px;background:url(../images/dui.png);margin-right:15px}
#about .aboutR{width:50%;max-width:789px}
#about .aboutR img{display:block;max-width:100%}
#huoban{background:#FDFDFD;padding-bottom: 70px;}
#huoban .container{max-width:1700px}
#huoban li{width:16%;max-width:240px;height:110px;display:flex;justify-content:center;align-items:center;background:#fff;box-shadow:0 0 5px #eee;transition: 0.5s all;}
#huoban li:hover{
    transform: rotateY(180deg);
}
#huoban li img{display:block;max-width:80%;max-height:100%}
@media (max-width:1200px){
	#about{padding:40px 0 50px}
	.title .cn{font-size:30px}
	#about .aboutL .about-txt{margin:0 0 10px;font-size:14px;line-height:1.6}
	#about .aboutL .about-ul li{line-height:1.6}
	#about .aboutL .about-ul li:before{content:''}
	#huoban{padding-bottom: 50px;}
	#huoban li{height:70px}
}
@media (max-width:768px){
	#about{padding:20px 0}
	#about .aboutL{width:100%;margin-bottom:20px}
	.title .en{font-size:14px}
	.title .cn{font-size:24px;margin-top: 10px;}
	#about .aboutR{width: 100%;}
	#huoban{padding-bottom: 20px;}
	#huoban li{width: 32%;margin-bottom: 10px;}
}
@media (max-width:500px){
	.title .en{font-size:14px;width:150px}
	.title .cn{font-size:20px}
}

#youshi{background:#0A445A;padding-top:90px;position:relative}
#youshi .title .cn{color:#fff}
#youshi .title .en{color:#fff;border-bottom-color:#fff}
#youshi .youshi-controls{display:flex;height:50px;align-self:flex-end}
#youshi .youshi-controls .swiper-button-prev,#youshi .youshi-controls .swiper-button-next{background-image:none;color:#fff;border:1px solid #FFFFFF;width:50px;display:flex;align-items:center;justify-content:center}
#youshi .youshi-controls span{font-size:26px}
#youshi .youshi-controls .swiper-button-prev{transform:rotate(-180deg);margin-right:10px}
#youshi .youshi-controls .swiper-button-next{}
#youshi .youshi-controls .swiper-button-disabled,#youshi .youshi-controls div:hover{background:rgba(255,255,255,0.5);opacity:1}
#youshi .youshi{margin-top:40px}
#youshi .youshi ul{}
#youshi .youshi li{width:55%}
#youshi .youshi li a{
    overflow: hidden;
    display: block;
}
#youshi .youshi li a img{display:block;max-width:100%;transition: 0.5s all;}
#youshi .youshi li a:hover img{
    transform: scale(1.1);
}
#youshi .youshi li a .text{position:absolute;width:100%;bottom:0;left:0;background: rgba(0,0,0,0.4);box-sizing:border-box;padding:20px 4%}
#youshi .youshi li a .text:after{display:block;content:'';width: 15px;height: 15px;background: #DD4454;position: absolute;right: 0;top: 0;}
#youshi .youshi li a .text h4{font-size:26px;font-weight:normal;color:#fff;text-decoration:underline}
#youshi .youshi li a .text p{color:#fff;width:100%}
#youshi:after{display:block;content:'';position: absolute;width: 100%;height: 120px;background: #fff;bottom: 0;left: 0;}
@media (max-width:1200px){
	#youshi{padding-top:50px}
	#youshi .youshi{margin-top:20px}
	#youshi .youshi li a .text{padding:10px 4%}
	#youshi .youshi li a .text h4{font-size:20px}
	#youshi:after{height:88px}
}
@media (max-width:768px){
	#youshi{padding-top:20px}
	#youshi .youshi-controls{height:40px}
	#youshi .youshi-controls .swiper-button-prev,#youshi .youshi-controls .swiper-button-next{width: 40px;height: 40px;}
	#youshi .youshi li{width:60%}
	#youshi .youshi li a .text{position:unset;background:#0A445A}
	#youshi .youshi li a .text p{line-height:1.4}
	#youshi:after{height:99px}
}
@media (max-width:500px){
	#youshi .youshi li{width:80%}
}

#shebei{padding:100px 0 70px}
#shebei .shebei-title{align-items:flex-end}
#shebei .shebei-title .title{
    min-width: 50%;
}
#shebei .shebei-title .title .cn{line-height:1;margin-bottom: 0;}
#shebei .shebei-more{background:#F1F5F8;width:170px;height:50px;display:flex;justify-content:space-between;align-items:center;padding:0 25px}
#shebei p{color:#999999;max-width:600px;margin: 30px 0 40px;}
.shebei li{width:31%;max-width:364px}
.shebei a{display:block;position:relative;overflow: hidden;aspect-ratio: 1.33;display: flex;align-items: center;justify-content: center;}
.shebei a img{display:block;max-width: 100%;max-height: 100%;transition: 0.5s all;}
.shebei a:hover img{
    transform: scale(1.1);
}
.shebei a .text{position:absolute;bottom:0;left:0;width:100%;background:rgba(0,0,0,0.4);box-sizing:border-box;padding:0 20px;color:#fff;line-height:70px;font-size:20px;display:flex;justify-content:space-between;align-items:center}
.shebei a .text span{font-size:20px}
@media (max-width:1024px){
	#shebei{padding:40px 0 30px}
	.shebei a .text{line-height:50px;font-size:16px}
}
@media (max-width:768px){
	#shebei{padding:20px 0 20px}
	#shebei .shebei-more{width:100px}
	.shebei li{width:32%}
	.shebei a .text{line-height:40px;font-size:14px}
}
@media (max-width:500px){
	#shebei .shebei-more{margin-top:10px;height:40px}
	#shebei p{margin:10px 0}
	.shebei li{width:100%;margin-bottom:15px;max-width:unset}
}

#product{background:linear-gradient(to bottom,#0A445A 50%,#fff 50%);padding: 70px 0 0;}
#product .product-title .en{color:#fff;border-bottom-color:#fff}
#product .product-title .cn{color:#fff}
#product .category{position:relative;width:220px;color:#fff;z-index:5}
#product .category div{border-bottom:1px solid;display:flex;justify-content:space-between;cursor:pointer}
#product .category span{display:block;transform:rotate(90deg)}
#product .category ul{position:absolute;right:0;width:100%;background:rgba(0,0,0,0.5);text-align:center;display:none}
#product .category ul li{padding:5px 0}
#product .category ul li a{color:#fff}
#product .product{margin-top:40px}
#product .product li{border:1px solid #EBEBEB;margin-bottom:30px;width:32%;max-width:380px;position:relative}
#product .product li .img img{display:block;width:100%}
#product .product li .text{position:absolute;top:50%;left:0;width:100%;transform:translateY(-50%);z-index:1;text-align:center;display: none;}
#product .product li .text .more{display:flex;justify-content:center}
#product .product li .text .more a{display:block;background:#fff;width:50px;line-height:50px}
#product .product li .text .more span{color:#0A445A;font-size:20px}
#product .product li .text .more a:first-child{background:#0A445A;margin-right:2px}
#product .product li .text .more a:first-child span{color:#fff}
#product .product li .text h4{font-size:20px;color:#0A445A;margin-top:15px}
#product .product li:after{content:'';display:none;position:absolute;width:100%;height:100%;left:0;top:0;background:rgba(255,255,255,0.8)}
#product .product li:hover:after{display:block;}
#product .product li:hover .text{display:block;}
@media (max-width:1024px){
	#product{padding: 50px 0 0;}
	#product .product{margin-top:30px}
	#product .product li .text h4{font-size:16px}
}
@media (max-width:768px){
	#product{padding:30px 0}
	#product .category{width:150px}
	#product .product{margin-top:20px}
	#product .product li{width:49%;margin-bottom:10px}
	#product .product li .text .more a{width:40px;line-height:40px}
	#product .product li .text .more span{font-size:16px}
}
@media (max-width:425px){
	#product .category{width:120px}
	#product .category ul{width:130%}
	#product .product li{width:100%;max-width:unset}
}

#news{background:linear-gradient(to bottom,#fff 0%,#FBFBFD 10%,#F1F5F6);padding: 70px 0 220px;}
#news .news-more{background:#fff;width:170px;height:50px;display:flex;justify-content:space-between;align-items:center;padding:0 25px}
#news .news{margin-top:40px}
#news .news li{width:49%;display:flex;flex-direction:column;max-width:583px;background:#fff}
#news .news .img a{display:block;overflow:hidden;}
#news .news .img a img{display:block;max-width:100%;transition:0.5s all}
#news .news li:hover img{transform:scale(1.1)}
#news .news .con{background:#fff;padding:60px 60px;flex:1}
#news .news .con p{text-align:center;font-size:12px}
#news .news .con p a{color:#DF4452}
#news .news .con .t{text-align:center;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:1;overflow:hidden;text-overflow:ellipsis;margin: 1px 0;}
#news .news .con .t a{color:#0A445A;font-size:18px;font-weight:bold}
#news .news .con .t a:hover{color:#DF4452;}
#news .news .con .text{color:#989898;font-size:18px;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:5;overflow:hidden;text-overflow:ellipsis}
#news .newsR{width:49%;justify-content:space-between;flex-direction:column}
#news .newsR li{width:100%;display:flex;flex-direction:row;align-items:center}
#news .newsR li:first-child{}
#news .newsR li .con{padding: 0 30px;}
#news .newsR li .img{max-width:279px;width: 40%;}
#news .newsR li .con .text{font-size:14px;-webkit-line-clamp: 2;}
@media (max-width:1230px){
	#news{padding-top:50px;padding-bottom: 200px;}
	#news .news .con{padding:50px 50px}
	#news .newsR li .con{padding:0 30px}
}
@media (max-width:1024px){
	#news{padding-top:30px;}
	#news .news .con{padding:40px 40px}
	#news .news .con .text{-webkit-line-clamp:4}
	#news .news .con .t{margin:0}
	#news .news .con .t a{font-size:16px}
	#news .news .con .text{font-size:16px}
	#news .newsR li:first-child{margin-bottom:10px}
	#news .newsR li .con{padding:0 15px}
	#news .newsR li .con .text{-webkit-line-clamp: 3;}
}
@media (max-width:768px){
	#news{background:linear-gradient(to bottom,#FBFBFD,#F1F5F6);padding-bottom:20px}
	#news .news-more{
    margin-top: 15px;
}
	#news .news li{width:100%;max-width:unset;margin-bottom:10px;flex-wrap: wrap;}
	#news .newsR li .img{
    width: 100%;
    max-width: unset;
}
	#news .news .img a img{width:100%}
	#news .news .con{padding:10px 20px}
	#news .newsR li .con{
}
	#news .news .con .text{font-size:14px}
	#news .newsR{width:100%}
}