html, body{
	font-size: 16px;
}
.banner .flex_box{
	display: flex;
	align-items: center;
}

/**************************/
/*       2. banner        */
/**************************/

.banner{
	background: url(../imgs/yt_gzhkf_blg.png) center center / cover no-repeat, rgb(25, 26, 37);
	padding: 7.5rem 0 8rem;
	color: #fff;
}
.banner .yt_gzhkf_video{
	display: flex;		
	align-items: center;
}
.banner .lt_wrap>.tit{
	font-size: 2.5rem;
	line-height: 2.5rem;
	font-weight: 600;
}
.banner .lt_wrap>.tit>span{
	color: #f5bc68;
}
.banner .lt_wrap>.sub{
	padding: 1rem 0 2.5rem;
	font-size: 2rem;
	line-height: 2rem;
}
.banner .lt_wrap>.des{
	display: inline-block;
	padding: 1.25rem 1.5rem;
	margin-bottom: 5.5rem;
	font-size: 1.5rem;
	line-height: 1.5rem;
	border: 1px dotted #fff;
	border-radius: 10px;
	box-sizing: border-box;
}
.banner .lt_wrap>.ty_btn{
	display: inline-block;
	padding: 15px 45px;
	background-color: #0067ed;
	font-size: 1.5rem;
	line-height: 1.5rem;
	border-radius: 15px;
}

/**************************/
/*        2. video        */
/**************************/
/* 通过 css 设置播放器尺寸 这时<video>中的宽高属性将被覆盖*/
.yt_gzhkf_video #video_box {
	width: 100%;
	max-width: 100%;
	height: 0;
	padding-top: 56.25%; /* 计算方式：播放器以16：9的比率显示，这里的值为 9/16 * 100 = 56.25  */
}
/* 外部容器也需要是自适应的*/
.yt_gzhkf_video #vedio_wrap {
  	width: 80%;
}

.com_box{
	display: flex;
	justify-content: center;
	align-items: center;
	margin: 60px 0;
}
.com_box .tit{
	font-size: 2rem;
	line-height: 3rem;
	font-weight: 600;
	color: #0067ed;
	margin-bottom: 20px;
	letter-spacing: 2px;
}
.com_box .des{
	font-size: 1.25rem;
	line-height: 2rem;
	font-weight: normal;
	color: #333333;
}
.com_box .con{
	margin-top: 30px;
	font-size: 1rem;
	line-height: 1.5rem;
	font-size: 400;
	padding: 20px;
	border: 1px dotted #000;
	box-sizing: border-box;
	border-radius: 15px;
}
.yt_gzhkf_s2, .yt_gzhkf_s4, .yt_gzhkf_s6, .yt_gzhkf_s8, .yt_gzhkf_s10{
	background-color: #f3f8ff;
}

@media only screen and (max-width: 768px){
	html, body{
		font-size: 10px;
	}
	.banner{
		background: url(../imgs/yt_gzhkf_bxs.png) center center / cover no-repeat, rgb(25, 26, 37);
		padding: 7.5rem 0 0;
		height: calc(100vh - 46px);
	}

	.banner .flex_box{
		flex-direction: column;
	}
	.banner .flex_box .lt_wrap{
		display: flex;	
		flex-direction: column;
		align-items: center;
	}
	.banner .flex_box .yt_gzhkf_video{
		justify-content: center;
		align-items: center;
		height: calc(100vh - 34rem);
	}
	.yt_gzhkf_video #vedio_wrap {
        width: 100%;
    }

	.com_box{
		flex-direction: column;
	}
	.com_box img{
		width: 50%;
		margin-bottom: 3rem;
	}

}