@charset "utf-8";
#wrap{background: #fff;}
hteml,body{height: 100%;}


.module-title{padding: .4rem 0 20px 0; display: block; margin: .5rem 0 0; position: relative;}
.module-title h2{color: #E40012; font-size: .39rem; display: block; position: relative;}
.module-title span{height: 3px; position: relative; background: #E40012; margin:.2rem 0 10px 0; width: .5rem; display: block;}
.module-title h3{color: #888;font-size: 12px; position: relative; text-transform: uppercase; font-weight: lighter; display: block;}
.module-title p{margin-bottom: 1em;}
.list-box.mobile{display: none;}
.list-box{margin: 0; display: flex; min-width: 1024px; justify-content: center; position: relative; height: 100vh; min-height: 6rem; text-align: center; background-color: #000;}
.list-box .list{width: 20%; height: 100%; margin: 0; position: relative; overflow: hidden; display: block; transition:all 0.8s;}
.list-box .list .pic{overflow: hidden;}
.list-box .list .pic img{width: 100%; height: 100%; position: absolute; top: 0;left: 0; display: block; transition:all 0.4s; background-size: cover; background-position: center;}
.list-box .list .list-mask{position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition:all 0.8s; background: linear-gradient(-90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.6) 100%);}
.list-box .list .con{position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition:all 0.4s; padding-top: 48vh;}
.list-box .list .con h2{font-size: 32px; color: #fff; transition:all 0.4s; position: relative; left: 50%; transform: translate(-50% ,-50%);}
.list-box .list .con span.line{height: 3px; position: relative; left: 50%; transform: translate(-50%, 0); background: #fff; width: .5rem; display: block;transition:all 0.4s; margin: .1rem 0;}
.list-box .list .con .describe{opacity: 0; width: 33vw; line-height: 3.5em; height: 0; padding: 1rem 0 0; overflow: hidden; text-align: left; color: #fff;}
.list-box .list .con .describe p{margin-bottom: 1em; position: relative;}
/* .list-box .list .con .describe p::after{content: ""; position: absolute; left: 4px; width: 6px; height: 6px; border-radius: 12px; background-color: #E40012; top: 16px;}
.list-box .list .con .describe p::before{content: ""; position: absolute; left: 0; width: 10px; height: 10px; border-radius: 12px; border: 2px solid #E40012; top: 12px;} */
.list-box .list .con .link{opacity: 0; width: 20em; margin: 1em auto; text-align: center; position: relative; padding-top: 0.5rem; }
.list-box .list .con .link a{display: inline-block; overflow: hidden; position: relative; width: 13em; text-align: center; background: #fff /* url(../img/industry-06.svg) no-repeat -.22rem center */; background-size: .22rem; transition:all 0.4s; border-radius: 3px; line-height: .5rem; height: .5rem; margin: .1rem;}
.list-box .list .con .link a span.t{position: absolute; top: 0; left: 0; width: 100%;transition:all 0.4s; }
.list-box .list .con .link a span.tag{position: absolute; text-align: center; color: #fff; width: 100%; left: 0; top: .5rem; transition:all 0.4s;}
.list-box .list .con .link a:hover{background: #E40012 /* url(../img/industry-06.svg) no-repeat .17rem center */; width: 15em; background-size: .22rem; color: #fff; /* padding-left: .5rem; */}
.list-box .list .con .link a.win:hover{background: #E40012 /* url(../img/industry-07.svg) no-repeat .17rem center */; width: 15em; background-size: .22rem; color: #fff; /* padding-left: .5rem; */}
.list-box .list .con .link a:hover span.t{top: -.5rem;}
.list-box .list .con .link a:hover span.tag{top: 0;}
.list-box .list.cur .list-mask{left: 0;background-color: rgba(0,0,0,0.5);}
.list-box .list.cur .con{padding-left: .5rem; padding-right: .5rem; padding-top: 38vh; }
/* .list-box .list.cur .con h2{left: 0; text-align: left; transform: translate(0 ,-50%);} */
/* .list-box .list.cur .con span.line{height: 3px; left: 0; transform: translate(0,0); background: #fff; margin:.1rem auto 10px 0; } */
.list-box .list.cur .con .describe{opacity: 1; height: auto; padding: .2rem 0; line-height: 1.8em; transition:all 0.8s;}
.list-box .list.cur .con .link{display: block; opacity: 1; padding-top: 0; transition:all 1s;}
.list-box .list.cur{width: 40%;}

.window_hide .contact{overflow: hidden;}
.window_hide .contact div,
.window_hide .contact a{display: inline-block; margin-right: 50px; vertical-align: middle; padding: 15px 0;}
.window_hide .contact div span,
.window_hide .contact a span{font-size: 1.8em; display: inline-block; vertical-align: middle; margin-right: 10px; color: #E40012;}

@media screen and (max-width: 1600px) {
	.list-box .list .con h2{font-size: 28px;}
	.list-box .list .con .link a{line-height: .6rem; height: .6rem;}
	.window_hide .window-con h3{font-size: .26rem;}
	
	.window_hide .content{width: 100%; border-radius: 0; padding: 0 2rem; height: 100%; top: 0px; left: 0; margin: 0; z-index: 1; overflow: auto;}
}
@media screen and (max-width: 768px) {
	.list-box.pc{display: none;}
	
	.list-box.mobile{display: block;}
	.list-box{margin: 0; min-width: 100%; justify-content: center; position: relative; height: 100vh; min-height: auto; text-align: center; background-color: #000;}
	.list-box .list{width: 100%; height: 100%; margin: 0; position: relative; overflow: hidden; display: block; transition:all 0.8s;}
	.list-box .list .pic{overflow: hidden;}
	.list-box .list .pic img{width: 100%; height: 100%; position: absolute; top: 0;left: 0; display: block; transition:all 0.4s; background-size: cover; background-position: center;}
	.list-box .list .list-mask{position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition:all 0.8s; background: linear-gradient(-90deg, rgba(0,0,0,0) 0%, rgba(0,0,0,0.6) 100%);}
	.list-box .list .con{position: absolute; top: 0; left: 0; width: 100%; height: 100%; transition:all 0.4s; padding-top: 48vh;}
	.list-box .list .con h2{font-size: 32px; color: #fff; transition:all 0.4s; position: relative; left: 50%; transform: translate(-50% ,-50%);}
	.list-box .list .con span.line{height: 3px; position: relative; left: 50%; transform: translate(-50%, 0); background: #fff; width: .5rem; display: block;transition:all 0.4s; margin: .1rem 0;}
	.list-box .list .con .describe{opacity: 0; width: 33vw; line-height: 3.5em; height: 0; padding: 1rem 0 0; overflow: hidden; text-align: left; color: #fff;}
	.list-box .list .con .describe p{margin-bottom: 1em; position: relative;}
	/* .list-box .list .con .describe p::after{content: ""; position: absolute; left: 4px; width: 6px; height: 6px; border-radius: 12px; background-color: #E40012; top: 16px;}
	.list-box .list .con .describe p::before{content: ""; position: absolute; left: 0; width: 10px; height: 10px; border-radius: 12px; border: 2px solid #E40012; top: 12px;} */
	.list-box .list .con .link{opacity: 0; width: 20em; margin: 1em auto; text-align: center; position: relative; padding-top: 0.5rem; }
	.list-box .list .con .link a{display: inline-block; overflow: hidden; position: relative; width: 13em; text-align: center; background: #fff /* url(../img/industry-06.svg) no-repeat -.22rem center */; background-size: .22rem; transition:all 0.4s; border-radius: 3px; line-height: 40px; height: 40px; margin: .1rem;}
	.list-box .list .con .link a span.t{position: absolute; top: 0; left: 0; width: 100%;transition:all 0.4s; }
	.list-box .list .con .link a span.tag{position: absolute; text-align: center; color: #fff; width: 100%; left: 0; top: .5rem; transition:all 0.4s;}
	.list-box .list .con .link a:hover{background: #E40012 /* url(../img/industry-06.svg) no-repeat .17rem center */; width: 15em; background-size: .22rem; color: #fff; /* padding-left: .5rem; */}
	.list-box .list .con .link a.win:hover{background: #E40012 /* url(../img/industry-07.svg) no-repeat .17rem center */; width: 15em; background-size: .22rem; color: #fff; /* padding-left: .5rem; */}
	.list-box .list .con .link a:hover span.t{top: -.5rem;}
	.list-box .list .con .link a:hover span.tag{top: 0;}
	.list-box .list.cur .list-mask{left: 0;background-color: rgba(0,0,0,0.1);}
	.list-box .list .con{padding-left: .5rem; padding-right: .5rem; padding-top: 38vh; }
	/* .list-box .list.cur .con h2{left: 0; text-align: left; transform: translate(0 ,-50%);} */
	/* .list-box .list.cur .con span.line{height: 3px; left: 0; transform: translate(0,0); background: #fff; margin:.1rem auto 10px 0; } */
	.list-box .list .con .describe{opacity: 1; height: auto; padding: .2rem 0; line-height: 1.8em; transition:all 0.8s;}
	.list-box .list .con .link{display: block; opacity: 1; padding-top: 0; transition:all 1s;}
	.list-box .list.cur{width: 100%;}
	
	.window_hide .contact{overflow: hidden;}
	.window_hide .contact div{display: inline-block; margin-right: 50px; vertical-align: middle; padding: 15px 0;}
	.window_hide .contact div span{font-size: 1.8em; display: inline-block; vertical-align: middle; margin-right: 10px; color: #E40012;}

}