* {
	padding: 0;
	margin: 0;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
}
body{
    overflow: hidden;
}   
a{
    color: #333;
}

img{
    width: auto;
}

:root{
	--color-main: #28a6e0;
	--color-main-deep: #0172be;
	--color-main-deep-op: rgba(1,114,190,0.8);
	--color-main-green: #8ec220;
	--wapper: 1720px;
}

/* start 元素渐隐 渐现样式 */
.flex-table{
	display: -webkit-flex;
	display: -moz-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-justify-content: flex-start;
	   -moz-box-pack: start;
	    -ms-flex-pack: start;
	        justify-content: flex-start;
	-webkit-align-items: stretch;
	   -moz-box-align: stretch;
	    -ms-flex-align: stretch;
	        align-items: stretch;
	-webkit-flex-wrap: wrap;
	    -ms-flex-wrap: wrap;
	        flex-wrap: wrap;
}

body:before{
    content: '';
    color: #cc0000;
    width: 100%;
    height: 20px;
    top: 0; left: 0; position:fixed;
    z-index: 9999999999999;
    display: none;
}

.pc{
	display: flex;
}
.mobile{
	display: none;
}

.wapper{
	width: var(--wapper);
	margin: 0 auto;
}

header{
	position: fixed;
	top: 0;
	left: 0;
	height: 110px;
	background-color: rgba(0,74,117,0.4);
	width: 100%;
	z-index: 999;
}
header.white,header.subpage{
	background-color: #fff!important;
	box-shadow: 0 1px 5px #eaeaea;
}
header .wapper{
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 100%;
}
header a.logo{
	height: 100%;
	display: flex;
	align-items: center;
}
header a.logo img{
	height: calc( 100% - 64px );
	width: auto;
}

header a.logo .logo-white{
	display: block;
}
header a.logo .logo-color{
	display: none;
}

header.white a.logo .logo-white,header.subpage a.logo .logo-white{
	display: none!important;
}
header.white a.logo .logo-color,header.subpage a.logo .logo-color{
	display: block!important;
}


header nav{
	flex: 1;
	display: flex;
	align-items: center;
	justify-content: flex-end;
	height: 100%;

}
header nav li{
	height: 100%;
	position: relative;
}
header nav li a.nav-a{
	display: flex;
	align-items: center;
	justify-content: center;
	padding: 0 50px;
	height: 100%;
	color: #fff;
	transition: all 0s;
}
header.white nav li a.nav-a,header.subpage nav li a.nav-a{
	color: var(--color-main-deep);
}

header nav li a.nav-a:hover{
	background-color: var(--color-main-deep);
}
header nav li a.nav-a-on,header nav li a.nav-a-on-js{
	background-color: var(--color-main-deep);
}


header.white nav li a.nav-a:hover,header.subpage nav li a.nav-a:hover{
	color: #fff;
}
header.white nav li a.nav-a-on,header.subpage nav li a.nav-a-on,header nav li a.nav-a-on-js{
	color: #fff;
}

header nav li a.nav-a-on-js i{
	transform: rotate(180deg);
}
header nav li a.nav-a i{
	margin-left: 6px;
	transition: all 0.5s;
}
header nav li ul{
	position: absolute;
	top: 110px;
	left: 0;
	width: 100%;
	background: var(--color-main-deep-op);
	padding: 8px 0;
	display: none;
}
header nav li ul a{
	display: flex;
	padding: 8px 0;
	align-items: center;
	justify-content: center;
	color: #fff;
	font-size: 14px;
}
header nav li ul a:hover{
	color: var(--color-main-green);
}

header .lang{
	margin-left: 32px;
	color: #fff;
	position: relative;
}
header.white .lang,header.subpage .lang{
	color: var(--color-main-deep);
}
header .lang .now{
	display: flex;
	align-items: center;
	cursor: pointer;
}
header .lang .now i{
	font-size: 14px;
	color: var(--color-main-green);
	margin-left: 8px;
	transition: all 0.5s;
}
header .lang .now i.on{
	transform: rotate(180deg);
}

header .lang ul{
	display: none;
	position: absolute;
	top: 32px;
	left: 0;
	background: #fff;
	width: 100%;
	padding: 0px 0;
	border: 1px #eaeaea solid;
	border-radius: 3px;
}
header .lang ul a{
	display: flex;
	width: 100%;
	font-size: 15px;
	justify-content: center;
	padding: 4px 0;
	border-bottom: 1px #eaeaea solid;
}
header .lang ul a:last-child{
	border: 0;
}
header .lang ul a:hover{
	background-color: #eaeaea;
}


.banner{
	height: 890px;
	background-image: linear-gradient(to bottom, transparent 0%, var(--color-main) 100%);
}
.banner .swiper-container{
	width: 100%;
	height: 100%;
}
.banner .swiper-container .swiper-slide{
	width: 100%;
	height: 100%;
}
.banner .swiper-container .swiper-slide a{
	display: flex;
	width: 100%;
	height: 100%;
	background-image: url(../images/001.jpg);
	background-size: cover;
	background-position: center;
	color: #fff;
}
.banner .swiper-container .swiper-slide a .wapper{
	display: flex;
	flex-direction: column;
	justify-content: center;
	padding: 0 145px;
}
.banner .swiper-container .swiper-slide a span.yh{
	font-size: 80px;
	line-height: 100%;
	display: flex;
	align-items: center;
	height: 10px;
	display: none;
}
.banner .swiper-container .swiper-slide a p{
	font-size: 32px;
	font-weight: bolder;
	line-height: 100%;
	margin-top: 20px;
}
.banner .swiper-container .swiper-slide a span.desc{
	color: #fff;
	opacity: 0.7!important;
	font-size: 16px;
	margin-top: 30px;
	width: 500px;
}



.banner .swiper-button-next{
	right: 56px;
}
.banner .swiper-button-prev{
	left: 56px;
}
.banner .swiper-pagination{
	bottom: 20px!important;
}
.banner .swiper-pagination-bullet{
	background-color: #fff;
	width: 14px;
	height: 14px;
	margin: 0 5px!important;
	opacity: 1;
}
.banner .swiper-pagination-bullet-active{
	background-color: var(--color-main-deep);
}

.index-box{
	padding: 56px 0;
}

.title-index{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.title-index span:nth-child(1){
	color: var(--color-main);
	font-size: 32px;
	font-weight: bold;
}
.title-index span:nth-child(2){
	color: rgba(0, 0, 0, 0.6);
	font-size: 16px;
	line-height: 1;
	position: relative;
	display: flex;
	align-items: center;
}
.title-index span:nth-child(2)::before{
	content: '';
	position: absolute;
	left: -32px;
	width: 24px;
	height: 1px;
	background-color: #ccc;
}
.title-index span:nth-child(2)::after{
	content: '';
	position: absolute;
	right: -32px;
	width: 24px;
	height: 1px;
	background-color: #ccc;
}


.index-pro{
	margin-top: 40px;
	height: auto;
	overflow: hidden;
}
:root{
	--index-product-box-h:650px;
	--index-product-box-w:60%;
	--index-product-box-small-w:40%;
	--index-product-box-margin:40px;
}
.index-pro a{
	display: flex;
	background-image: url(../images/002.jpg);
	background-position: center;
	background-size: cover;
	position: relative;
	overflow: hidden;
}
.index-pro a:nth-child(1){
	width: var(--index-product-box-w);
	float: left;
	background-color: #ddd;
	height: var(--index-product-box-h);
}
.index-pro a:nth-child(2),.index-pro a:nth-child(3){
	width: calc( var(--index-product-box-small-w) - var(--index-product-box-margin) );
	float: right;
	margin-bottom: var(--index-product-box-margin);
	height: calc( (var(--index-product-box-h) - var(--index-product-box-margin))/2 );
}

.index-pro a img{
	object-fit: cover;
	width: 100%;
	height: 100%;
	transition: all 0.5s;
}
.index-pro a:hover img{
	transform: scale(1.1);
}
.index-pro a > div{
	position: absolute;
	width: 100%;
	background-color: rgba(255, 255, 255, 0.7);
	padding: 16px;
	bottom: 0;
	left: 0;
	display: flex;
	flex-direction: column;
	transition: all 0.5s;
}
.index-pro a:hover > div{
	background-color: var(--color-main-deep-op);
}
.index-pro a:hover > div span{
	color: #fff!important;
}
.index-pro a > div span:nth-child(1){
	color: var(--color-main);
	font-weight: bold;
	font-size: 20px;
	line-height: 1;
}
.index-pro a > div span:nth-child(2){
	opacity: 0.6;
	line-height: 1;
	margin-top: 8px;
}


.index-about-box{
	background-color: var(--color-main-deep);
	padding: 0;
	display: flex;
	position: relative;
}
.index-about-box .text{
	width: 100%;
	text-align: center;
	position: absolute;
	top: 64px;
	font-size: 160px;
	color: #fff;
	opacity: 0.2;
	font-weight: bolder;
	letter-spacing: 20px;
	z-index: 10;
}
.index-about-box .building{
	width: 50%;
	position: absolute;
	bottom: 0;
	left: 64px;
	z-index: 9;
	max-width: 850px;
}
.index-about-box .l,.index-about-box .r{
	width: 50%;
	min-height: 400px;
}
.index-about-box .r{
	background-color: #f9f9f9;
}
.index-about-box .r-n{
	display: flex;
	width: calc( 1720px/2 );
	padding: 160px 64px;
	flex-direction: column;
	position: relative;
	z-index: 11;
	justify-content: center;
}
.index-about-box .r-n span.h1{
	font-size: 40px;
	font-weight: bold;
	color: var(--color-main-deep);
}
.index-about-box .r-n span.desc{
	font-size: 28px;
	color: var(--color-main-deep);
	line-height: 1;
}
.index-about-box .r-n .c{
	font-size: 16px;
	line-height: 2;
	margin-top: 32px;
}
.index-about-box .r-n .c p{
	margin-bottom: 8px;
}
.index-about-box .r-n .morebtn{
	margin-top: 32px;
	font-size: 15px;
	background-color: var(--color-main-deep);
	color: #fff;
	width: 150px;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 40px;
	border-radius: 1000px;
	transition: all 0.5s;
	position: relative;
	overflow: hidden;
}
.index-about-box .r-n .morebtn span{
	position: relative;
	z-index: 999;
}
.index-about-box .r-n .morebtn::after{
	content: '';
	width: 300px;
	height: 300px;
	background-color: var(--color-main-green);
	top: 20px;
	left: -250px;
	z-index: 1;
	position: absolute;
	transition: all 0.5s;
	transform: rotate(45deg);
}
.index-about-box .r-n .morebtn:hover{
	letter-spacing: 4px;
}
.index-about-box .r-n .morebtn:hover::after{
	left: -100px;
}



.index-news{
	padding-top: 20px;
	height: auto;
	overflow: hidden;
}
.index-news .wapper{
	display: flex;
}
.index-news .wapper .l{
	width: 52%;
	display: flex;
	justify-content: space-between;
	flex-wrap: wrap;
	height: calc( (215px + 40px)*2 );
	overflow: hidden;
}
.index-news .wapper .l a{
	display: flex;
	width: calc( 50% - 16px );
	height: 215px;
	margin: 20px 0;
	position: relative;
	overflow: hidden;
}
.index-news .wapper .l a:after{
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: rgba(4, 100, 158, 0.3);
	z-index: 2;
}
.index-news .wapper .l a img{
	object-fit: cover;
	width: 100%;
	height: 100%;
	transition: all 0.5s;
}
.index-news .wapper .l a:hover img{
	transform: scale(1.1);
}
.index-news .wapper .l a span{
	display: flex;
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	font-size: 16px;
	color: #fff;
	padding: 8px 16px;
	z-index: 3;
	line-height: 1.5;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

.index-news .wapper .r{
	flex: 1;
	margin-left: 40px;
	display: flex;
	flex-direction: column;
	height: calc( (215px + 40px)*2 );
}
.index-news .wapper .r a:first-child{

}
.index-news .wapper .r a:last-child{
	border-bottom: 0;
}
.index-news .wapper .r a{
	display: flex;
	padding: 20px 0;
	border-bottom: 1px #f1f1f1 solid;
	flex: 1;
	overflow: hidden;
	max-height: 25%;
}
.index-news .wapper .r a .img{
	width: 150px;
	height: 100%;
	overflow: hidden;
	margin-right: 16px;
}
.index-news .wapper .r a .img img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.index-news .wapper .r a .info{
	flex: 1;
	display: flex;
	flex-direction: column;
}
.index-news .wapper .r a .info span.title{
	font-size: 18px;
	font-weight: bold;
	line-height: 1.5;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.index-news .wapper .r a .info span.desc{
	font-size: 16px;
	opacity: 0.6;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin-top: 4px;
}


footer{
	background-color: #323232;
}
footer .wapper{
	padding: 32px 0;
	display: flex;
	color: #f1f1f1;
	justify-content: space-between;
}
footer .wapper .lx{
	display: flex;
	flex-direction: column;
}
footer .wapper .lx img{
	width: 240px;
}
footer .wapper .lx .c{
	font-size: 15px;
	line-height: 1.8;
	margin-top: 24px;
}

footer .wapper .lx2{
	display: flex;
	flex-direction: column;
	
	border-left: 1px #444 solid;
	padding-left: 48px;
	margin-left: 48px;
}
footer .wapper .lx2 .li{
	display: flex;
	margin-bottom: 24px;
	align-items: center;
}
footer .wapper .lx2 .li .icon{
	width: 70px;
	height: 70px;
	background-color: #fff;
	border-radius: 70px;
	display: flex;
	align-items: center;
	justify-content: center;
	margin-right: 16px;
}
footer .wapper .lx2 .li .icon i{
	color: var(--color-main-deep);
	font-size: 30px;
}

footer .wapper .lx2 .li .info{
	display: flex;
	flex-direction: column;
}
footer .wapper .lx2 .li .info span{
	line-height: 1;
}
footer .wapper .lx2 .li .info span:nth-child(1){
	font-size: 15px;
}
footer .wapper .lx2 .li .info span:nth-child(2){
	font-size: 13px;
	margin-top: 4px;
}
footer .wapper .lx2 .li .info span:nth-child(3){
	font-size: 22px;
	margin-top: 8px;
}

footer .wapper .lx3{
	display: flex;
	justify-content: center;
	align-items: center;
}
footer .wapper .lx3 a{
	margin: 0 24px;
	border-radius: 50%;
	background-color: #fff;
	width: 70px;
	height: 70px;
}
footer .wapper .lx3 a i{
	display: inline-flex;
	color: blue;
	font-size: 70px;
	align-items: center;
	justify-content: center;
	line-height: 1;
}

footer .wapper .nav{
	display: flex;
	border-left: 1px #444 solid;
	padding-left: 48px;
	margin-left: 48px;
}
footer .wapper .nav dl{
	margin: 0 16px;
}
footer .wapper .nav dl a{
	color: #fff;
}
footer .wapper .nav dl dt{
	font-weight: bold;
	margin-bottom: 8px;
}
footer .wapper .nav dl dd{
	font-size: 14px;
	line-height: 32px;
}


footer .copy{
	padding: 16px 0;
	text-align: center;
	border-top: 1px #555 solid;
	font-size: 15px;
	color: #fff;
}
footer .copy a{
	opacity: 0.6;
	color: #fff;
}

footer a{
	color: #fff;
}



.subbanner{
	height: 260px;
	display: flex;
	align-items: center;
	flex-direction: column;
	justify-content: center;
	background-image: url(../images/006.jpg);
	background-position: center;
	background-size: cover;
	color: #fff;
	position: relative;
	margin-top: 110px;
}
.subbanner::after{
	content: '';
	position: absolute;
	width: 100%;
	height: 100%;
	background-color: rgba(0, 34, 49, 0.4);
	left: 0;
	top: 0;
	z-index: 1;
}
.subbanner span{
	position: relative;
	z-index: 2;
}
.subbanner span:nth-child(1){
	font-size: 32px;
	font-weight: bold;
}
.subbanner span:nth-child(2){
	text-transform: uppercase;
	opacity: 0.8;
}

.mb{
	background-color: #fff;
	border-bottom: 1px #eaeaea solid;
	
}
.mb .wapper{
	height: 60px;
	display: flex;
	align-items: center;
	justify-content: space-between;
}
.mb .text{
	display: flex;
	align-items: center;
	font-size: 15px;
}
.mb .text span{
	margin: 0 4px;
	opacity: 0.4;
}
.mb .text i{
	display: flex;
	align-items: center;
	color: var(--color-main);
	font-size: 24px;
	margin-right: 8px;
}
.mb .subnav{
	display: flex;
	height: 100%;
}
.mb .subnav a{
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100%;
	position: relative;
	margin: 0 32px;
}
.mb .subnav a:hover{
	color: var(--color-main);
}
.mb .subnav a:last-child{
	margin-right: 0;
}
.mb .subnav a:hover::after,.mb .subnav a.sel::after{
	width: 100%;
}
.mb .subnav a.sel{
	color: var(--color-main);
}
.mb .subnav a::after{
	transition: all 0.5s;
	position: absolute;
	content: '';
	width: 0;
	height: 2px;
	background-color: var(--color-main);
	bottom: -1px;
}



.about_p1{
	background-color: #f9f9f9;
	padding: 64px 0;
}
.about_p1 .wapper{
	display: flex;
	align-items: center;
}
.about_p1 .wapper .l,.about_p1 .wapper .r{
	width: 50%;
}
.about_p1 .wapper .l{
	padding-right: 30px;
	display: flex;
	flex-direction: column;
}
.about_p1 .wapper .l .h2{
	font-size: 32px;
	font-weight: bold;
	color: var(--color-main);
}
.about_p1 .wapper .l .desc{
	font-size: 18px;
	color: #333;
}
.about_p1 .wapper .l .c{
	font-size: 16px;
	line-height: 2;
	margin-top: 24px;
	color: #666;
}
.about_p1 .wapper .l .c p{
	margin-bottom: 8px;
}
.about_p1 .wapper .r{
	padding-left: 30px;
}
.about_p1 .wapper .r > img{
	width: 100%;
	height: auto;
	object-fit: cover;
	max-height: 450px;
}


.about_p2{
	padding: 64px 0 0 0;
}
.about_p2 .title{
	font-size: 32px;
	font-weight: bold;
	color: var(--color-main);
	text-align: center;
}
.about_p2 .c{
	margin-top: 32px;
}
.about_p2 .c .li{
	display: flex;
	align-items: flex-start;
}
.about_p2 .c .li .l,.about_p2 .c .li .r{
	width: 50%;
	margin: 0 100px;
}
.about_p2 .c .li .r img{
	width: 100%;
	height: 350px;
	object-fit: cover;
}
.about_p2 .c .li .l .t{
	font-size: 32px;
	font-weight: bold;
	color: var(--color-main);
}
.about_p2 .c .li .l .text{
	font-size: 15px;
	margin-top: 40px;
}

.about_p2 .roll-time{
	background-color: #fafafa;
	padding: 32px 0 40px 0;
	margin-top: 32px;
	position: relative;
}
.about_p2 .roll-time .swiper-button-prev,.about_p2 .roll-time .swiper-button-next{
	position: absolute;
	width: 32px;
	height: 32px;
	background-image: none;
	top: 70px;
	border-radius: 32px;
	border: 2px var(--color-main) solid;
	display: flex;
	align-items: center;
	justify-content: center;
}
.about_p2 .roll-time .swiper-button-prev i,.about_p2 .roll-time .swiper-button-next i{
	font-size: 20px;
	display: flex;
	align-items: center;
	transform: rotate(90deg);
	color: var(--color-main);
}
.about_p2 .roll-time .swiper-button-next i{
	transform: rotate(270deg);
}
.about_p2 .roll-time .swiper-button-prev{
	left: 32px;
}
.about_p2 .roll-time .swiper-button-next{
	right: 32px;
}

.about_p2 .roll-time .wapper{
	
}
.about_p2 .roll-time .roll-time-n{
	display: flex;
	align-items: center;
}
.about_p2 .roll-time .wapper li{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	position: relative;
	padding-bottom: 8px;
	cursor: pointer;
}
.about_p2 .roll-time .wapper li span{
	font-weight: bold;
}
.about_p2 .roll-time .wapper li em{
	width: 14px;
	height: 14px;
	border-radius: 14px;
	background-color: #ccc;
	position: relative; 
	z-index: 2; 
}
.about_p2 .roll-time .wapper li.active span{
	color: var(--color-main);
}
.about_p2 .roll-time .wapper li.active em{
	background-color: var(--color-main);
}
.about_p2 .roll-time .wapper li em{
	width: 14px;
	height: 14px;
	border-radius: 14px;
	background-color: #ccc;
	position: relative;
	z-index: 2;
}
.about_p2 .roll-time .wapper li::after{
	content: "";
	width: 100%;
	height: 1px;
	background-color: #eaeaea;
	position: absolute;
	top: 35px;
	left: 0;
	z-index: 1;
}


.about-box{
	padding: 64px 0;
	
}
.about-box .title{
	display: flex;
	justify-content: center;
	flex-direction: column;
	align-items: center;
}
.about-box .title span:nth-child(1){
	font-size: 32px;
	font-weight: bolder;
	color: var(--color-main);
}
.about-box .title span:nth-child(2){
	font-size: 18px;
	opacity: 0.7;
	line-height: 1;
	text-transform: uppercase;
}
.about-wenhua{
	background-image: url(../images/008.jpg);
	background-position: center;
	background-size: cover;
}
.about-wenhua .title span:nth-child(1),.about-wenhua .title span:nth-child(2){
	color: #fff!important;
}
.about-wenhua ul{
	display: flex;
	padding: 0 32px;
	margin-top: 16px;
}
.about-wenhua ul li{
	background-color: #fff;
	margin: 40px 40px 0 40px;
	display: flex;
	align-items: center;
	flex-direction: column;
	justify-content: flex-start;
	padding: 64px 40px;
	width: 25%;
	transition: all 0.5s;
}
.about-wenhua ul li:hover{
	transform: translateY(-10px);
}
.about-wenhua ul li:hover h3{
	letter-spacing: 4px;
}
.about-wenhua ul li i{
	font-size: 50px;
	color: var(--color-main);
	transition: all 0.5s;
}
.about-wenhua ul li h3{
	font-size: 26px;
	font-weight: bold;
	transition: all 0.5s;
	text-align: center;
}
.about-wenhua ul li span.desc{
	margin-top: 16px;
	font-size: 15px;
	color: #777;
	text-align: center;
}


.about-zizhi{
	position: relative;
}
.zizhi-list{
	margin-top: 40px;
}
.zizhi-list a{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	font-size: 16px;
}
.zizhi-list a .img{
	padding: 32px;
	background-color: #f8f8f8;
	width: 100%;
}
.zizhi-list a .img img{
    width: 100%;
}
.zizhi-list a span{
	margin-top: 8px;
}
.about-zizhi .swiper-button-prev{
	left: 32px!important;
	top: calc( 50% + 26px );
}
.about-zizhi .swiper-button-next{
	right: 32px;
	top: calc( 50% + 26px );
}

.about-huoban{
	background-color:#f5f5f5 ;
	height: auto;
	overflow: hidden;
}
.huoban-list{
	margin: 16px -16px 0 -16px;
	height: auto;
	overflow: hidden;
}
.huoban-list a{
	display: flex;
	background-color: #fff;
	width: calc( (100% - 32px * 5)/5 );
	height: 200px;
	position: relative;
	float: left;
	margin: 16px;
	overflow: hidden;
}
.huoban-list a .img{
	width: 100%;
	height: 100%;
	overflow: hidden;
}
.huoban-list a .img img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: all 0.5s;
}
.huoban-list a:hover .img img{
	transform: scale(1.1);
}
.huoban-list a span{
	position: absolute;
	bottom: 0;
	left: 0;
	display: flex;
	width: 100%;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	background-color: var(--color-main-deep-op);
	transition: all 0.5s;
	bottom: -40px;
	color: #fff;
	padding: 4px 0;
	font-size: 14px;
	display: none;
}
.huoban-list a:hover span{
	bottom: 0;
}


.pro-box{
	padding: 64px 0;
}
.pro-box .wapper > .title{
	display: flex;
	align-items: center;
}
.pro-box .wapper > .title span{
	display: flex;
	flex-direction: column;
	width: 10px;
	height: 20px;
	margin-right: 16px;
}
.pro-box .wapper > .title span::before{
	content: '';
	width: 10px;
	height: 10px;
	background-color: #A9E1FC;
}
.pro-box .wapper > .title span::after{
	content: '';
	width: 10px;
	height: 10px;
	background-color: #2CA7E2;
}
.pro-box .wapper > .title p{
	font-size: 32px;
	font-weight: bold;
	color: var(--color-main);
}
.pro-box .wapper > .desc{
	font-size: 15px;
	margin-top: 16px;
}

.pro-box{
	--pro-w: calc( (var(--wapper) + 40px - 40px*4)/4 );
}

.pro-box .wapper .pro-list{
	margin: 20px -20px 0 -20px;
	overflow: hidden;
	/*height: calc( (var(--pro-w)/4*3 + 80px)*2 );*/
	height: auto;
}
.pro-box .wapper .pro-list a{
	display: flex;
	overflow: hidden;
	width: var(--pro-w);
	height: auto;
	float: left;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	margin: 20px;
}
.pro-box .wapper .pro-list a .img{
	width: 100%;
	height: calc( var(--pro-w)/4*3 );
	overflow: hidden;
	background-color: #f9f9f9;
}
.pro-box .wapper .pro-list a .img img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: all 0.5s;
}
.pro-box .wapper .pro-list a:hover .img img{
	transform: scale(1.1);
}
.pro-box .wapper .pro-list a span{
	font-size: 16px;
	margin-top: 8px;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
}



.pro-peitao{
	background-color: #F7F8FA;
}

.pro-box{
	--pro-peitao-w: calc( (var(--wapper) + 40px - 40px*2)/2 );
}
.pro-haocai-list{
	margin: 0 -20px;
	overflow: hidden;
	padding-top: 32px;
}
.pro-haocai-list a{
	background-color: #ffff;
	width: var(--pro-peitao-w);
	height: auto;
	float: left;
	margin: 20px;
	border-radius: 10px;
	padding: 48px;
	box-shadow: 0 0px 10px #eaeaea;
	display: flex;
	align-items: center;
	position: relative;
}
.pro-haocai-list a .num{
	position: absolute;
	width: 48px;
	height: 48px;
	border-radius: 50%;
	background-color: var(--color-main);
	color: #fff;
	font-size: 20px;
	display: flex;
	align-items: center;
	justify-content: center;
	top: -24px;
}
.pro-haocai-list a .img{
	width: 170px;
	height: calc( 170px/4*3 );
	margin-right: 24px;
	background-color: #ddd;
}
.pro-haocai-list a .img img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.pro-haocai-list a h3{
	font-size: 22px;
	color: var(--color-main);
	font-weight: normal;
}
.pro-haocai-list a .info{
	flex: 1;
}
.pro-haocai-list a span.desc{
	font-size: 16px;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
	margin-top: 4px;
}
.pro-haocai-list a span.btn{
	font-size: 14px;
	background-color: var(--color-main);
	color: #fff;
	padding: 0 24px;
	height: 34px;
	border-radius: 100px;
	display: inline-block;
	line-height: 34px;
	margin-top: 16px;
}


.news{
	background-image: url(../images/009.png);
	background-position: top center;
	background-repeat: no-repeat;
	background-size: 100%;
	min-height: 300px;
}

.news .topone{
	display: flex;
	align-items: center;
	border-bottom: 1px #f1f1f1 solid;
	padding: 64px 0;
}
.news .topone .img{
	width: 720px;
	height: calc( 720px/16*9 );
	background-color: #eaeaea;
	margin-right: 40px;
}
.news .topone .img img{
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.news .topone .info{
	flex: 1;
	display: flex;
	flex-direction: column;
}
.news .topone .info .time{
	display: flex;
	flex-direction: column;
}
.news .topone .info .time span{
	line-height: 1;
}
.news .topone .info .time span:nth-child(1){
	font-size: 26px;
	font-weight: bold;
	color: var(--color-main);
}
.news .topone .info .time span:nth-child(2){
	font-size: 16px;
	opacity: 0.8;
	margin-top: 8px;
}
.news .topone .info .title{
	display: flex;
	flex-direction: column;
	margin-top: 24px;
}
.news .topone .info .title h3{
	line-height: 1.5;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
	font-size: 24px;
}
.news .topone .info .title span{
	font-size: 16px;
	line-height: 1.8;
	margin-top: 10px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
	opacity: 0.7;
}
.news .topone .info .more{
	display: flex;
	justify-content: flex-end;
}
.news .topone .info p{
	border: 1px var(--color-main) solid;
	font-size: 16px;
	color: var(--color-main);
	display: inline-flex;
	width: 170px;
	height: 40px;
	border-radius: 40px;
	align-items: center;
	justify-content: center;
	margin-top: 32px;
}

.news-list{
	margin: 0 -20px;
	height: auto;
	overflow: hidden;
	margin-top: 32px;
	padding-bottom: 16px;
}
.news-list a{
	display: flex;
	width: calc( (100% - 40px*3)/3 );
	height: auto;
	overflow: hidden;
	float: left;
	margin: 20px;
	border: 1px #eaeaea solid;
	border-radius: 15px;
	background-color: #fff;
	padding: 24px;
	flex-direction: column;
}
.news-list a .img{
	background-color: #ccc;
	overflow: hidden;
	border-radius: 15px;
	width: 100%;
	height: 250px;

}
.news-list a .img img{
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: all 0.5s;
}
.news-list a:hover .img img{
	transform: scale(1.1);
}
.news-list a .info{
	flex: 1;
	display: flex;
	flex-direction: column;
}
.news-list a .info h3{
	font-size: 18px;
	line-height: 1;
	margin-top: 16px;
	font-weight: bold;
	display: -webkit-box;
	-webkit-line-clamp: 1;
	-webkit-box-orient: vertical;
	overflow: hidden;
	padding-left: 10px;
	position: relative;
}
.news-list a .info h3::before{
	border-left: 3px var(--color-main) solid;
	content: '';
	position: absolute;
	left: 0;
	top: 0;
	height: 100%;
}
.news-list a .info span.desc{
	font-size: 16px;
	opacity: 0.7;
	line-height: 1.7;
	margin-top: 12px;
	display: -webkit-box;
	-webkit-line-clamp: 2;
	-webkit-box-orient: vertical;
	overflow: hidden;
}
.news-list a .info span.btn{
	font-size: 15px;
	padding: 6px 32px;
	border: 1px var(--color-main) solid;
	width: 150px;
	color: var(--color-main);
	font-weight: 200;
	border-radius: 100px;
	display: flex;
	justify-content: center;
	margin-top: 24px;
	transition: all 0.5s;
}
.news-list a:hover .info span.btn{
	
}

.pages{
	padding: 23px 0;
}



.lianxi{
	background-image: url(../images/009.png);
	background-position: top center;
	background-repeat: repeat-y;
	background-size: 100%;
	min-height: 300px;
}
.lianxi .p1{
	display: flex;
	align-items: center;
	padding: 64px 0;
}
.lianxi .p1 .l{
	width: 40%;
	padding-left: 64px;
}
.lianxi .p1 .l h2.title{
	font-size: 18px;
	font-weight: bold;
	color: var(--color-main);
	margin-bottom: 18px;
}
.lianxi .p1 .l .content{
	font-size: 18px;
}
.lianxi .p1 .r{
	flex: 1;
	height: 500px;
	box-shadow: 0 0 10px #ccc;
	background-color: #fff;
}

.lianxi-p2{
	background-color: #F8F8F8;
	background-image: url(../images/009.png);
	background-position: top center;
	background-repeat: repeat-y;
	background-size: 100%;
	padding: 64px 0;
}

.lianxi-p2 .lianxi-title{
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.lianxi-p2 .lianxi-title .en{
	font-size: 56px;
	font-weight: bolder;
	text-transform: uppercase;
	letter-spacing: 4px;
}
.lianxi-p2 .lianxi-title .cn{
	font-size: 30px;
	line-height: 1;
}

.form{
	display: flex;
	flex-direction: column;
	padding: 0 10%;
	margin-top: 32px;
}
.form .item{
	display: flex;
	align-items: center;
}
.form .item input{
	height: 48px;
	border: 0;
	background-color: #fff;
	border-radius: 8px;
	flex: 1;
	margin: 8px;
	padding: 0 16px;
}
.form textarea{
	margin: 8px;
	border: 0;
	background-color: #fff;
	border-radius: 8px;
	padding: 16px;
	height: 160px;
}
.form .btns{
	margin: 40px;
	display: flex;
	align-items: center;
	justify-content: center;
}
.form .btns button{
	padding: 16px 82px;
	background-color: var(--color-main);
	color: #fff;
	border-radius: 1000px;
	border: 0;
	font-size: 18px;
}

.news-show{
	padding: 64px 0;
	background-color: #F8F8F8;
	min-height: 500px;
	background-image: url(../images/009.png);
	background-position: top center;
	background-repeat: repeat-y;
	background-size: 100%;
}
.news-show-c{
	border: 1px #eaeaea solid;
	background-color: #fff;
	min-height: 200px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center; 
	padding: 64px 0 72px 0;
}
.news-show-c-n{
	width: 1200px;
	min-height: 200px;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
}
.news-show-c-n .title{
	font-size: 32px;
	font-weight: bold;
	text-align: center;
}
.news-show-c-n .desc{
	text-align: center;
	color: #666;
	border-bottom: 1px #eaeaea solid;
	padding: 24px 0;
	margin-bottom: 32px;
	width: 100%;
}
.news-show-c-n .desc em{
	margin: 0 8px;
}
.news-show-c-n .content{
	font-size: 16px;
	line-height: 2;
	width: 100%;
}
.news-show-c-n .content img{
	width: auto;
	height: auto;
}
.news-show-c-n .content p,.news-show-c-n .content img{
	margin-bottom: 16px;
}
.news-show-c-n button{
	width: 200px;
	margin-top: 32px;
	padding: 16px 32px;
	border-radius: 1000px;
	background-color: var(--color-main);
	color: #fff;
	border: 0;
}
.news-show-c-n .content table{
    width: 100%;
}
.news-show-c-n .content table td,.news-show-c-n .content table th{
    border:1px #f1f1f1 solid;
    padding: 8px 10px;
}
.news-show-c-n .content table th{
    background: #f9f9f9;
    color: #000;
    text-align: left;
}

.news-show-c-n .roll-img{
	width:100%; margin-bottom: 24px;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 500px;
}
.news-show-c-n .roll-img img{
	width: 100%;
}


.pro-list-more{
	text-align: center;
	margin-top: 32px;
}
.pro-list-more a{
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 8px 48px;
	border: 1px var(--color-main) solid;
	border-radius: 100px;
	color: var(--color-main);
}

.pagecode{
	padding: 50px 50px 64px 50px;
	text-align: center;
}
.pagecode a{
	margin:0 4px;
	height:32px;
	line-height:32px;
	border:1px solid #eaeaea;
	background: #fff; 
	padding:0 10px;
	font-size:14px;
	color:#555;
	border-radius: 32px;
	display:inline-flex;
	align-items: center;
	justify-content: center;
}
.pagecode a:hover,.page a.hover{ 
	background:var(--color-main);
	border:1px solid var(--color-main);
	color:#fff;
}
.pagecode span{
	border-radius: 32px;
	display:inline-flex;
	align-items: center;
	justify-content: center;
	margin:0 4px;
	height:32px;
	width: 32px;
	border:1px solid var(--color-main);
	padding:0 10px;
	font-size:14px;
	background:var(--color-main);
	color:#fff;
}