body {
	background: #F2F2F2;
}

.root {
	width: 1200rem;
	margin: 0 auto 0 auto;
	padding-top: 80rem;
	padding-bottom: 30rem;
}

/* ==.==.== 顶部广告 ==.==.== */
.root .top-logo {
	width: 100%;
	height: 200rem;
	margin-top: 20rem;
}
.top-logo img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* ==.==.== 顶部标题 ==.==.== */
.root .top-title-bar {
	width: 100%;
	height: 60rem;
	font-size: 18rem;
	color: #666666;
	line-height: 56rem;
}
.root .top-title-bar a {
	color: #666666;
}
.root .top-title-bar a:hover, .root .top-title-bar .__a {
	color: #ED287B;
}
/* ==.==.== 主内容区 ==.==.== */
.root .zones {
	display: grid;
	grid-template-columns: 140rem auto 300rem;
}

/* == 导航 == */
.zones .nav {
	width: 100%;
	background: #FFFFFF;
}
.nav .nav-block {
	border-bottom: 2rem solid #E5E5E5;
	padding: 21rem 0 11rem 0;
}
.nav .nav-block .nav-head {
	font-size: 20rem;
	font-weight: 500;
	color: #000000;
	width: 100%;
	text-align: center;
	height: 50rem;
	line-height: 50rem;
}
.nav .nav-block .nav-item {
	font-size: 16rem;
	color: #6E6E6E;
	width: 100%;
	text-align: center;
	height: 44rem;
	line-height: 44rem;
}
.nav .nav-block .nav-item.active {
	color: #ED287B;
	background-image: url("../images/pink_r_arrow.png");
	background-size: 10rem 12rem;
	background-position: 24rem 16rem;
	background-repeat: no-repeat;
}

.nav .nav-block .nav-item:hover {
	color: #ED287B;
	background-image: url("../images/pink_r_arrow.png");
	background-size: 10rem 12rem;
	background-position: 24rem 16rem;
	background-repeat: no-repeat;
}

/* == 文章列表 == */
.zones .article-list {
	background: #FFFFFF;
	width: 720rem;
	margin: 0 auto;
	padding-top: 50rem;
}

.article-list .acell {
	position: relative;
	width: 100%;
	height: 240rem;
}

.article-list .acell .ibox {
    position: absolute;
    top: 24rem;
    left: 30rem;
    right: 240rem;
    max-height: 160rem;
    color: #000000;
}

.article-list .acell .txt {
	position: relative;
	width: 100%;
	font-size: 23rem;
	font-weight: 500;
	line-height: 32rem;
	color: #000000;
	max-height: 64rem;
	overflow: hidden;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.article-list .acell .msg {
	position: relative;
    margin-top: 22rem;
    width: 100%;
	font-size: 16rem;
	line-height: 22rem;
	color: #666666;
	max-height: 44rem;
    overflow: hidden;
}
.article-list .acell .time {
	position: absolute;
	bottom: 24rem;
	left: 30rem;
	right: 240rem;
	font-size: 14rem;
	height: 20rem;
	line-height: 20rem;
	color: gray;
}
.article-list .acell .cover {
	position: absolute;
	top: 30rem;
	right: 30rem;
	width: 180rem;
	height: 180rem;
	overflow: hidden;

}
.article-list .acell .cover img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.article-list .acell .hline {
	position: absolute;
	bottom: 0;
	left: 30rem;
	right: 30rem;
	height: 1rem;
	background: #E8E8E8;
}

/* == 页码 == */
.zones .pagination {
	width: 100%;
	height: 140rem;
	display: flex;
	justify-content: center;
	align-items: center;
}
.pagination .L_, .pagination .R_ {
	width: 40rem;
	height: 40rem;
}
.pagination .N_ {
	width: 40rem;
	height: 40rem;
	font-size: 16rem;
	background: #FFFFFF;
	color: black;
	text-align: center;
	line-height: 40rem;
}
.pagination .N_.active {
	background: #000000;
	color: #FFFFFF;
}
.pagination .D_ {
	width: 40rem;
	height: 40rem;
	text-align: center;
	line-height: 40rem;
	cursor:pointer ;
}
.pagination .L_, .pagination .N_, .pagination .D_ {
	margin-right: 10rem;
}

/* == 推荐文章 == */
.zones .rec-list {
	background: #FFFFFF;
	width: 100%;	
}
.rec-list .section-header {
	position: relative;
	width: 100%;
	height: 88rem;
}
.rec-list .section-header .txt {
	position: absolute;
	top: 26rem;
	left: 20rem;
	font-size: 23rem;
	font-weight: 500;
	height: 32rem;
	line-height: 32rem;
	color: #000000;
}
.rec-list .section-header .hline {
	position: absolute;
	bottom: 14rem;
	left: 20rem;
	right: 20rem;
	height: 2rem;
	background: #E8E8E8;	
}

.rec-list .rcell {
	position: relative;
	width: 100%;
	height: 120rem;
}
.rec-list .rcell .ribox
{
	position: absolute;
	top: 21rem;
	left: 20rem;
	right: 120rem;
}

.rec-list .rcell .txt {
	position: relative;
	width:100%;
	font-size: 14rem;
	font-weight: 500;
	max-height: 40rem;
	line-height: 20rem;
	color: #000000;
	overflow: hidden;
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.rec-list .rcell .msg {
	position: relative;
	width:100%;
	margin-top:5rem;
	font-size: 12rem;
	line-height: 20rem;
	color: gray;
	max-height: 40rem;
	overflow: hidden;
	display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}
.rec-list .rcell .cover {
	position: absolute;
	top: 20rem;
	right: 20rem;
	width: 80rem;
	height: 80rem;
	overflow: hidden;
}
.rec-list .rcell .cover img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
.rec-list .rcell .hline {
	position: absolute;
	bottom: 0;
	left: 20rem;
	right: 20rem;
	height: 1rem;
	background: #E8E8E8;
}
/* == 右下广告 == */
.zones .tail-gg {
	margin-top: 20rem;
	width: 300rem;
	height: 600rem;
}
.tail-gg img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}
/**********图片放大动画***********/
.article-list img {
	cursor: pointer;
	transition: all 0.6s;
}

.article-list img:hover {
	transform: scale(1.1);
}

.rec-list img {
	cursor: pointer;
	transition: all 0.6s;
}

.rec-list img:hover {
	transform: scale(1.1);
}
.article-list .acell .txt:hover {
	color:#ED287B;
}

.article-list .acell .msg:hover {
	color:#ED287B;
}

.article-list .one-line:hover {
	color:#ED287B;
}
.article-list .two-line:hover {
	color:#ED287B;
}
.rec-list .rcell .txt:hover {
    color:#ED287B;
}

.rec-list .rcell .msg:hover {
    color:#ED287B;
}
