@charset "UTF-8";
/* 需要放到文件最上面 */
/* 水平间距 */
/* 水平间距 */
/*
 以下变量是默认值，如不需要修改可以不用给下面的变量重新赋值
 */
/* 水平间距 */
.message .message-system {
  background: #fff;
  display: flex;
  padding: 24rpx 30rpx;
  position: relative;
  margin-top: 30rpx;
}
.message .message-system .message-image {
  width: 100rpx;
  height: 100rpx;
  border-radius: 16rpx;
  overflow: hidden;
}
.message .message-system .message-content {
  flex: 1;
  width: 0;
  margin-left: 20rpx;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.message .message-system .message-title {
  font-size: 32rpx;
  font-weight: 600;
  margin-bottom: 10rpx;
}
.message .message-system .message-sub-content {
  font-weight: 300;
  color: #8c8c8c;
}
.message .message-system .message-system-icon {
  width: 100rpx;
  height: 100rpx;
  border-radius: 16rpx;
  text-align: center;
  line-height: 100rpx;
  background: #08979c;
}
.message .message-titles {
  font-weight: 300;
  padding: 30rpx 30rpx 10rpx 30rpx;
}
.message .message-list .message-item {
  background: #fff;
  display: flex;
  padding: 24rpx 30rpx;
  position: relative;
}
.message .message-list .message-item::before {
  content: '';
  position: absolute;
  bottom: 0;
  right: 0;
  left: 150rpx;
  height: 2rpx;
  background: #d9d9d9;
}
.message .message-list .message-image {
  width: 100rpx;
  height: 100rpx;
  border-radius: 16rpx;
  overflow: hidden;
}
.message .message-list .message-content {
  flex: 1;
  width: 0;
  margin-left: 20rpx;
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.message .message-list .message-title {
  font-size: 32rpx;
  font-weight: 600;
  margin-bottom: 10rpx;
}
.message .message-list .message-sub-content {
  font-weight: 300;
  color: #8c8c8c;
}
.message .message-list .message-date {
  position: absolute;
  top: 34rpx;
  right: 30rpx;
  font-size: 24rpx;
  font-weight: 300;
  color: #8c8c8c;
}