body{
	color: #111;
}

.new_body{
	position: relative;
}

.banner{
	width: 100%;
	position: relative;
}
.banner_img{
	width: 100%;
}
.banner_text{
	position: absolute;
	left: 1.5rem;
	top: 50%;
	transform: translateY(-50%);
	color: #fff;
	font-size: 0.5rem;
}

.sum_box{
	display: flex;
	align-items: flex-start;
	padding: 1rem 1.5rem;
}
.sum_box .sum_min_left{
	padding: 0 1.5rem 0 0;
	color: rgb(14, 66, 134);
	font-size: 0.5rem;
	font-weight: bold;
	line-height: 0.5rem;
}
.sum_box .sum_min_right{
	font-size: 0.2rem;
}

/* unit */
.unit_all{
	padding: 1rem 1.5rem;
	display: flex;
	align-items: center;
	position: relative;
}
.u_bk_box{
	position: absolute;
	top: 0;
	left: 0;
	height: 76%;
	width: 100%;
	background-color: rgb(246, 247, 248);
	z-index: 1;
	overflow: hidden;
}
.u_bk_box img{
	position: absolute;
	bottom: -1rem;
	left: 1.9rem;
	width: 25%;
}
.u1_left, .u1_right{
	z-index: 2;
}
.u1_left{
	width: 38%;
	padding-right: 0.8rem;
	padding-bottom: 0.8rem;
}
.u1_right{
	width: 62%;
	position: relative;
}
.u1_right img{
	width: 100%;
}
.ua_t1{
	font-size: 0.39rem;
	font-weight: bold;
}
.ua_t1 span{
	color: rgb(14, 66, 134);
}
.ua_t2{
	font-size: 0.4rem;
	line-height: 0.35rem;
	font-weight: bold;
	color: rgb(14, 66, 134);
}
.ua_t3{
	font-size: 0.2rem;
	margin-top: 0.08rem;
}
.ua_t4{
	font-size: 0.2rem;
	margin-top: 0.3rem;
	line-height: 0.3rem;
	color: #444;
	font-weight: 300;
}

.unit_2 .u1_left{
	padding-right: 0rem;
	padding-left: 0.8rem;
}
.unit_2 .u_bk_box img{
	left: auto;
	right: 1.9rem;
	opacity: 0.8;
}


.frosted_box{
	padding: 0rem 1.5rem 1rem;
}
.frosted_title div:nth-of-type(1){
	font-size: 0.5rem;
	font-weight: bold;
}
.frosted_title div:nth-of-type(2){
	font-size: 0.27rem;
	font-weight: 300;
	margin-top: 0.1rem;
}
.frosted_list{
	margin-top: 0.6rem;
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
}
.frosted_min{
	width: 49.5%;
	cursor: pointer;
	margin-top: 1%;
}
.fm_top{
	color: #fff;
	width: 100%;
	height: 2rem;
	position: relative;
}
.fm_top_b{
	background-color: rgb(15, 65, 134);
}
.fm_top_g{
	background-color: rgb(150, 150, 152);
}
.fm_top div{
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	width: 100%;
	text-align: center;
	font-size: 0.27rem;
	padding: 0 0.82rem;
	line-height: 0.4rem;
}
.fm_bottom{
	position: relative;
}
.fm_bottom_img{
	width: 100%;
	z-index: 1;
	position: relative;
}
.fm_overlay{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background-color: rgba(150, 150, 152, 0);
	z-index: 20;
}
.fm_frosted{
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	backdrop-filter: saturate(20%) blur(80px);
	-webkit-backdrop-filter: saturate(20%) blur(80px);
	z-index: 1;
	transition: opacity .4s;
	opacity: 0;
}
.fm_text{
	position: absolute;
	z-index: 2;
	color: #fff;
	text-align: center;
	width: 100%;
	bottom: 0.8rem;
	padding: 0 0.82rem;
	font-size: 0.2rem;
	font-weight: 300;
	opacity: 0;
	transition: opacity .4s;
}
.unit_video_btn{
	position: absolute;
	width: 1.7rem;
	height: 0.5rem;
	backdrop-filter: saturate(80%) blur(50px);
	-webkit-backdrop-filter: saturate(80%) blur(50px);
	right: 0.3rem;
	bottom: 0.3rem;
	display: flex;
	align-items: center;
	justify-content: center;
	border-radius: 50px;
	color: #fff;
	cursor: pointer;
	font-size: 0.14rem;
	opacity: 0.8;
	transition: all .3s;
	z-index: 1;
}
.unit_video_btn img{
	width: 0.16rem;
	margin-left: 0.13rem;
}
.frosted_min:hover .fm_frosted{
	opacity: 1;
}
.frosted_min:hover .fm_text{
	opacity: 1;
}
.frosted_min:hover .fm_overlay{
	background-color: rgba(150, 150, 152, 0.4);
}
.frosted_min:hover .unit_video_btn{
	opacity: 0;
}
.unit_all .unit_video_btn{
	opacity: 0;
}


.env_box{
	padding: 1rem 1.5rem;
	position: relative;
}
.env_title{
	font-size: 0.5rem;
	font-weight: bold;
	position: relative;
	z-index: 2;
}
.env_detail{
	font-size: 0.27rem;
	font-weight: 300;
	margin-top: 0.1rem;
	position: relative;
	z-index: 2;
}
.env_img{
	width: 100%;
	margin-top: 0.5rem;
	position: relative;
	z-index: 2;
}
.env_mask{
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	background-color: rgb(246, 247, 248);
	height: 73%;
}


.pub_title{
	padding: 0 1.5rem 0.5rem;
	font-size: 0.5rem;
	font-weight: bold;
}

.close_marks{
	display: none;
}

@media (max-width: 769px){
	.sum_box{
		padding: 1rem 0.5rem;
		flex-direction: column;
	}
	.sum_box .sum_min_right{
		font-size: 0.26rem;
		margin-top: 0.3rem;
	}
	
	/* 单元 */
	.unit_all{
		flex-direction: column-reverse;
		padding: 0;
	}
	.u1_left, .u1_right{
		width: 100%;
	}
	.u_bk_box{
		display: none;
	}
	.u1_left{
		padding-left: 0.5rem;
		padding-top: 0.8rem;
		padding-bottom: 1.5rem;
		padding-right: 0.5rem;
	}
	.unit_2 .u1_left{
		padding-right: 0.5rem;
		padding-left: 0.5rem;
		background-color: rgba(237, 238, 240,0.5);
	}
	.unit_2{
		flex-direction: column;
	}
	.ua_t1{
		font-size: 0.44rem;
		line-height: 0.6rem;
	}
	.ua_t2{
		font-size: 0.5rem;
		line-height: 0.5rem;
		margin-top: 0.1rem;
	}
	.ua_t3{
		font-size: 0.3rem;
		line-height: 0.4rem;
		margin-top: 0.1rem;
	}
	.ua_t4{
		font-size: 0.26rem;
		margin-top: 0.4rem;
		line-height: 0.43rem;
		color: #444;
	}
	
	
	.frosted_box{
		padding: 0rem .5rem 1rem;
	}
	.frosted_list{
		margin-top: 0.3rem;
	}
	.frosted_min{
		width: 100%;
		margin-top: 3%;
	}
	
	.frosted_min:hover .fm_frosted{
		opacity: 0;
	}
	.frosted_min:hover .fm_text{
		opacity: 0;
	}
	.frosted_min:hover .fm_overlay{
		background-color: rgba(150, 150, 152, 0);
	}
	.frosted_min:hover .unit_video_btn{
		opacity: 1;
	}
	.frosted_min.active .unit_video_btn{
		opacity: 0;
	}
	.frosted_min.active .fm_frosted{
		opacity: 1;
	}
	.frosted_min.active .fm_text{
		opacity: 1;
	}
	
	/* 了解更多按钮 */
	.unit_video_btn{
		width: 2.3rem;
		height: 0.7rem;
		font-size: 0.2rem;
		opacity: 1;
	}
	.unit_video_btn img{
		width: 0.2rem;
		margin-left: 0.22rem;
	}
	.frosted_box .unit_video_btn{
		left: 50%;
		transform: translateX(-50%);
	}
	
	
	.env_box{
		padding: 1rem .5rem;
	}
	.env_mask{
		height: 80%;
	}
	
	.pub_title{
		padding: 0 .5rem 0.5rem;
	}
	
	
	.banner_text{
		left: .5rem;
	}
	
	.fm_frosted{
		backdrop-filter: saturate(100%) blur(0px);
		-webkit-backdrop-filter: saturate(100%) blur(0px);
		background-color: rgb(15, 65, 134);
	}
	.fm_text{
		top: 0rem;
		bottom: auto;
		font-size: 0.22rem;
	}
	.frosted_min_g .fm_frosted{
		background-color: rgb(150, 150, 152);
	}
	
	.close_marks{
		position: absolute;
		bottom: 0.5rem;
		left: 50%;
		transform: translateX(-50%);
		z-index: 5;
		display: flex;
		justify-content: center;
		align-items: center;
		width: 0.8rem;
		height: 0.8rem;
		border-radius: 100%;
		border: 1px solid rgba(255,255,255,0.2);
		transition: all .4s;
		opacity: 0;
	}
	.close_marks img{
		width: 0.35rem;
	}
	.frosted_min.active .close_marks{
		opacity: 1;
	}
	
	
	
	
}