@charset "utf-8";
.mainTitle {
	margin-top:2em !important;
}
.articleTxt p {
	text-align:center;
}
.recents {
	width:100%;
}
.recentHeader {
	width:100%;
	font-weight:bold;
	height:30px;
	line-height:30px;
	font-weight:bold;
}
.recent {
	position:relative;
	float:left;
	width:25%;
	height:200px;
	box-sizing:border-box;
	border-right-width:0px;
}
#recent4 {
	border-right-width:1px;
}
.recentImg {
	background-size:cover;
	background-position:center center;
	width:100%;
	height:100%;
	clear:both;
	z-index:1;
}
.recentText {
	width:100%;
	height:100%;
	padding:5px;
	box-sizing:border-box;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:pre-line;
	clear:both;
	z-index:1;
}
.recentText p {
	text-align:left;
	font-size:12px;
}
.recentTitle {
	position:absolute;
	width:100%;
	height:30px;
	z-index:2;
	bottom:0;
}
.recentTitle .bg {
	height:30px;
	opacity:0.4;
	z-index:1;
}
.recentTitle .caption {
	top:0;
	position:absolute;
	z-index:2;
	font-weight:bold;
	line-height:30px;
	padding:0 4px;
	box-sizing:border-box;
	text-align:center;
	width:100%;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}
.recent ul {
	width:100%;
	list-style:none;
}
.recent ul li {
	padding:2px 5px;
	text-align:left;
	overflow:hidden;
	text-overflow:ellipsis;
	white-space:nowrap;
}

@media all and (min-width:769px) and (max-width:1024px) {
	#recent1 {
		border-left-width:0px !important;
	}
	#recent4 {
		border-right-width:0px !important;
	}
}

@media all and (min-width:568px) and (max-width:768px) {
	.recentHeader {
		height:25px;
		line-height:25px;
	}
	.recent {
		float:left;
		width:50%;
		height:180px !important;
		border-width:0px 0px 1px 0px !important;
	}
	#recent1, #recent3 {
		border-right-width:1px !important;
	}
	.recentText p {
		font-size:11px;
	}
	.recentTitle {
		height:25px;
	}
	.recentTitle .bg {
		height:25px;
	}
	.recentTitle .caption {
		line-height:25px;
	}
}

@media all and (max-width:567px) {
	.recentHeader {
		height:20px;
		line-height:20px;
	}
	.recent {
		width:100%;
		height:150px;
		border-left-width:0px !important;
		border-right-width:0px !important;
		border-top-width:0px !important;
	}
	#recent1 {
		border-top-width:1px !important;
	}
	#recent4 {
		border-bottom-width:0px !important;
	}
	.recent ul {
		width:100%;
		list-style:none;
	}
	.recentText p {
		font-size:10px;
	}
	.recentTitle {
		height:20px;
	}
	.recentTitle .bg {
		height:20px;
	}
	.recentTitle .caption {
		line-height:20px;
	}
}