.index_left {
	width: 260px;
	.index_left-box{background: #fcfcfc;}
	.index_category{
		border-bottom: 1px solid #e9e9e9;
		.item {
			color: #656a75;
			img{width: 22px; display: block;}
			&:hover{background: #f2f3f5; color: #252b38;}
			&.on{background: #f2f3f5; color: #252b38;}
		}
	}
	.index_information{
		color: #a8adb6;line-height: 1.8;
	}
}
.index_center {
	min-height: 800px;
	flex: 1; width: 0;
	.topic_view{
		.post-info {
			color: #9ea3af;
			.fenxiang{
				.fenxiang-ewm{
					height: 180px; background: #00a0ac;
					overflow: hidden; 
					position: absolute; z-index: 99;
					top: 0px; 
					left: 70px; 
					width: 0px; border-radius: 5px;
					box-sizing: border-box;
					-webkit-transition: all .2s linear;
					transition: all .2s linear;
					.pic {
						background: #fff; width: 130px; height: 130px;margin: 10px;
						img {width: 100%; display: block;}
					}
					h3 {color: #fff;}
				}
				.fenxiang-ewm:after{content: ""; position: absolute; top: 10px; left: -10px; width: 0; height: 0; border-top: 6px solid transparent; border-right: 10px solid #fff; border-bottom: 6px solid transparent;}
			}
			.fenxiang:hover .fenxiang-ewm{width: 150px; }
		}
		.title{
			line-height: 1.6;
		}
		.inner{
			line-height: 1.8;overflow: hidden;
			img{max-width: 100%;}
		}
		.ewm{
			img{width: 160px;}
		}
		.pic-box{
			img {
				display: block;
				max-width: 100%;
				margin: 10px auto;
			}

.swiper-pagination-bullets{height: 30px; line-height: 30px; width: 100%;}
.swiper-pagination-bullet{width: 40px; border-radius: 0; background: #ccc; height: 3px; margin: 0rem 4px; border: none;outline: none; opacity: 0.8;}
.swiper-pagination-white .swiper-pagination-bullet-active{background: #21cfb9;}
		}
		.Tag-box{ 
			line-height: 32px;
			.item {background: #f2f3f4;color: #9ea4b0; height: 32px; border-radius: 20px; padding: 0px 30px;}
		}
		.Tagtopic{ 
			.tit{
				color: #252b38;
				&:before{
					content: '';
					width: 4px;height: 24px; background: #21cfb9; margin-right: 10px;
				}
			}
			.swiper-container{
				padding: 5px 5px 50px 5px;
			}
			.swiper-pagination-bullet-active {background: #afb4b9;}
			.item{
				box-shadow: 0 0 7px 1px #f4f4f4;
				border-radius: 5px;
				overflow: hidden;
				height: 158px;
				.title {line-height: 1.6;
					overflow: hidden;
					text-overflow: ellipsis;
					display: -webkit-box;
					-webkit-box-orient: vertical;
					-webkit-line-clamp: 3;
				}
			}
		}
		.tabs-content{
			.tit{
				color: #252b38;
				&:before{
					content: '';
					width: 4px;height: 24px; background: #21cfb9; margin-right: 10px;
				}
			}
			.write{background: #daf8f4; color: #09c4ac; display: block; width: 95px; height: 32px; text-align: center; line-height: 32px; border-radius: 20px;}
		}
		.comment-list{
			.comment-item{
				.item-left {width: 66px; text-align: center;}
				.user-avatar {border-radius: 50%; width: 34px; height: 34px;}
				.comment-reply{background: #f8f8f8; color: #252b38; border-radius: 8px; line-height: 1.8;padding: 5px 20px;}
			}
		}
		.reply-box{
			width: 100%;display: none;
			.reply-content {
				border-radius: 5px;
				textarea {
					height: 32px;
					padding: 10px;
					box-sizing: border-box;
					line-height: 1.6;
					font-size: 16px;
					color: #666;
					border-radius: 5px;
				}
				.reply-action a {
					display: block;
					padding: 0px 15px;
				}
			}
		}
	}
		.lookall{
			display: none; color: #21cfb9;padding: 70px 0 30px; margin: -100px 0 0px; position: relative; background: linear-gradient(0deg, #fff 57%, transparent);
			.anniu {background: #21cfb9; color: #fff; border: none; border-radius: 30px;margin: auto; width: 110px; height: 32px; line-height: 32px; text-align: center;}
		}
}
.index_right{
	width: 260px;
	.fabu {
		padding: 40px 30px 45px 30px;
		border-radius: 5px; overflow: hidden; box-shadow: 0 0 6px 0px rgba(225,225,225,0.6);
		.photo{
			display: block;
			img{width: 65px; height: 65px; border-radius: 50%;margin:0 auto;display: block;}
		}
		.name{
			p{color: #252b38; white-space: nowrap; overflow: hidden; text-overflow: ellipsis;}
		}
		.fabu_button {
			border: 1px solid #252b38;color: #252b38; border-radius: 30px; height: 42px; width: 128px; display: block; line-height: 40px;margin: 0 auto;
		}
	}
	.hot-topic{
		border-radius: 5px; overflow: hidden; box-shadow: 0 0 6px 0px rgba(225,225,225,0.6);
		.tit{
			line-height: 1;
			letter-spacing: 1px;color: #707684;
			img{height: 24px;}
		}
		.hottopic_list{
			.item{
				display: block;
				.title{overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-box-orient: vertical; -webkit-line-clamp: 2; line-height: 1.6;}
				.author{
					color: #b2b6be;
					margin-right: 5px;margin-top: 5px;
				}
			}
		}
	}
}


.looktelmark{width: 100%; height: 100%; background: rgba(0,0,0,0.3); position: fixed; top: 0px; left: 0%; display: none; z-index: 99;}
.looktel{
	width: 750px; height: 445px; background-color: #fff; position: fixed; z-index: 100; left: 50%; margin-left: -375px; top: 50%; margin-top: -220px; display: none;border-radius: 8px; overflow:hidden;
	.close{position: absolute; right: 16px; top: 18px;}
	.lookteltop{
		height: 70px; line-height: 70px; color: #000;
		i{color: #ff0000;}
	}
	.looktelbox {
		background: #e1f8f5; height: 375px; color: #333;
		.line{width: 1px; height: 100%; background: #aaa;}
		.looktelmode i{color: #21cfb9;}
		a{ display: block; width: 180px; height: 40px; margin: 0 auto; line-height: 40px; color: #fff; background: #21cfb9; border-radius: 8px;}
	}
}

.paywaymark{width: 100%; height: 100%; background: rgba(0,0,0,0.3); position: fixed; top: 0px; left: 0%; display: none; z-index: 99;}
.payway{
	width: 450px; height: 360px; padding: 50px; text-align: center; background-color: #fff; position: fixed; z-index: 100; left: 50%; margin-left: -225px; top: 50%; margin-top: -180px; display: none;
	.qrcode-box{
		.code-box{width: 150px; height: 150px; margin: 20px auto;}
		canvas{width: 100%; height: 100%;}
		.qrcode-title-box{
			font-size: 21px; color: #333;
		}
	}
}