html, body, #app{
	height: 100%;
	background-color: #f1f1f1;
}
.nine-content-002{
	display: flex;
	flex-direction: column;
	width: 750rpx;
	height: calc(100vh - 50px);
	/* #ifndef H5 */
	height: calc(100vh - 0px);
	/* #endif */
	margin: 0;
	padding: 0;
	background-color: #f1f1f1;
}

.chat-search{
	display: flex;
	align-items: center;
	padding: 5rpx;
	background-color: #ffffff;
}
.chat-search-image{
	height: 45rpx;
	line-height: 45rpx;
	padding: 10rpx;
	background-color: #f8f8f8;
}
.chat-search-input{
	width: 100%;
	height: 45rpx;
	line-height: 45rpx;
	padding: 10rpx;
	font-size: 16px;
	background-color: #f8f8f8;
}

.chat-list{
	flex: 1;
	padding: 0;
	overflow-y: auto;
}
.chat-list-item{
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin: 2rpx 0;
	padding: 15rpx 10rpx;
	border-radius: 10rpx;
	background-color: #ffffff;
}
.chat-list-item-left{
	position: relative;
	width: 84rpx;
	height: 84rpx;
}
.chat-list-item-left-image{
	width: 82rpx;
	height: 82rpx;
	border: 1rpx solid #f1f1f1;
	border-radius: 5rpx;
}
.chat-list-item-left-mark{
	position: absolute;
	width: 30rpx;
	top: -13rpx;
	right: -13rpx;
	padding: 1rpx;
	border-radius: 50%;
	font-size: 12px;
	color: white;
	background-color: red;
	text-align: center;
}

.chat-list-item-center{
	width: 450rpx;
	margin: 0 20rpx;
}
.chat-list-item-center-top{
	width: 450rpx;
	font-size: 16px;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}
.chat-list-item-center-bottom{
	width: 450rpx;
	font-size: 12px;
	color: #969696;
	overflow: hidden;
	white-space: nowrap;
	text-overflow: ellipsis;
}

.chat-list-item-right{
	width: 130rpx;
	color: #a7a7a7;
}
.chat-list-item-right-top{
	font-size: 12px;
	text-align: right;
}
.chat-list-item-right-bottom{
	padding-top: 15rpx;
	text-align: right;
}
.chat-list-item-right-bottom-image{
	width: 25rpx;
	height: 30rpx;
}