body {
	margin: 0 auto;
	padding: 0;
	width: 100%;
	background-color: #151a24;
}

.banner {
	position: relative;
	width: 100%;
	height: 3.68rem;
	background: url(../../img/news/banner.png) no-repeat top;
	background-size: cover;
}

.s4 {
	width: 100%;
	background: url(../../img/home/bg4.png) no-repeat center top;
	background-size: cover;
}

.s4 .inner {
	position: relative;
	margin: 0 auto;
	width: 13rem;
	height: 10.13rem;
}

.s4 .gonglue-title {
	position: absolute;
	left: -1rem;
	top: 1rem;
	width: 3.33rem;
	height: 1.24rem;
	background: url(../../img/home/bg4-title.png) no-repeat center;
	background-size: 100%;
}

.s4 .tuwen-title {
	position: absolute;
	left: 0;
	top: 2.7rem;
	width: 6.07rem;
	height: .6rem;
	background: url(../../img/home/tuwen-title.png) no-repeat center;
	background-size: 100%;
}

.s4 .shipin-title {
	position: absolute;
	right: .3rem;
	top: 2.7rem;
	width: 6.02rem;
	height: .59rem;
	background: url(../../img/home/shipin-title.png) no-repeat center;
	background-size: 100%;
}

.s4 .graphic-guide-nav {
	overflow-x: auto;
	position: absolute;
	left: 0;
	top: 3.55rem;
	width: 5.8rem;
}

.s4 .graphic-guide-more {
	position: absolute;
	left: 5.38rem;
	top: 2.65rem;
	width: .55rem;
	height: .3rem;
}

.s4 .video-items-more {
	position: absolute;
	left: 5.25rem;
	top: -.95rem;
	width: .55rem;
	height: .3rem;
}

.s4 .graphic-guide-more a,
.s4 .video-items-more a {
	display: inline-block;
	width: 100%;
	height: 100%;
}

.s4 .graphic-guide-nav-list {
	padding-bottom: .15rem;
	border-bottom: .01rem dashed #d5d9e3;
	white-space: nowrap;
}

.s4 .graphic-guide-nav-list li {
	display: inline-block;
	position: relative;
	list-style: none;
	cursor: pointer;
	text-align: center;
	font-size: .16rem;
	color: #666;
}

.s4 .graphic-guide-nav-list li.active span {
	font-weight: 700;
	color: #6186ca;
}

.s4 .graphic-guide-nav-list li.active::after {
	position: absolute;
	left: 0;
	bottom: -.16rem;
	width: calc(100% - .35rem);
	height: .05rem;
	background-color: #6186ca;
	content: "";
}

.s4 .graphic-guide-nav-list li:last-of-type.active::after {
	width: 100%;
}

.s4 .graphic-guide-nav-list li i {
	margin: 0 .1rem 0;
}

.s4 .items {
	position: absolute;
	left: 0;
	top: 4rem;
	width: 5.8rem;
	height: 4.3rem;
	font-size: .14rem;
}

.s4 .items>div {
	width: 100%;
	height: 100%;
}

.s4 .items dl {
	overflow: auto;
	padding: .2rem 0;
	border-bottom: .01rem dashed #d5d9e3;
}

.s4 .items dt {
	overflow: hidden;
	float: left;
	width: 4.7rem;
	text-overflow: ellipsis;
	color: #666;
	white-space: nowrap;
}

.s4 .items dd {
	float: right;
	color: #999;
}

.s4 .items dt a {
	color: #666;
}

.s4 .items dt a:hover {
	text-decoration: underline;
	color: #6186ca;
}

.s4 .items dl:last-of-type {
	padding: .2rem 0 0;
	border-bottom: none;
}

.s4 .video-items {
	position: absolute;
	right: .4rem;
	top: 3.6rem;
	width: 5.8rem;
}

.s4 .video-items dl {
	display: inline-block;
	position: relative;
	margin-right: .2rem;
	margin-bottom: .2rem;
	width: 2.71rem;
	height: 1.53rem;
}

.s4 .video-items dt {
	width: 100%;
	height: 100%;
}

.s4 .video-items dt a {
	display: inline-block;
	width: 100%;
	height: 100%;
}

.s4 .video-items dt img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.s4 .video-items dl:nth-of-type(2n) {
	margin-right: 0;
}

.s4 .video-items dl .preview-video {
	position: absolute;
	left: -.15rem;
	bottom: .1rem;
	width: 1.01rem;
	height: .97rem;
	background: url(../../img/home/preview-btn.png) no-repeat center;
	background-size: 100%;
	cursor: pointer;
	transition: all .3s;
}

.s4 .video-items dl:hover .preview-video {
	opacity: .9;
}

.s4 .video-items dl .video-text {
	overflow: hidden;
	position: absolute;
	left: 0;
	bottom: 0;
	box-sizing: border-box;
	padding: 0 .05rem;
	width: 100%;
	height: .3rem;
	background-color: rgba(0, 0, 0, .6);
	cursor: pointer;
	line-height: .3rem;
	text-overflow: ellipsis;
	text-align: center;
	font-size: .14rem;
	color: #fff;
	white-space: nowrap;
}