page {
	background-color: #F6F6FF
}
.monthly {
	padding: 37rpx 40rpx;
	height: calc(100vh - 88rpx);
	overflow-y: scroll;
	.paging {
		padding: 37rpx 40rpx;
	}
	.monthly-list {
		.monthly-list-item {
			overflow: hidden;
			width: 100%;
			background-color: #fff;
			border-radius: 15rpx;
			margin-bottom: 20rpx;
			.monthly-list-item-top {
				display: flex;
				justify-content: space-between;
				padding: 26rpx 39rpx;
				border-bottom: solid 1px #DFDFDF;
				.mlit-left {
					view {
						&:first-child {
							font-size: 32rpx;
							color: #3A3A3A;
							font-family: PingFangSC-Semibold, PingFang SC;
							font-weight: 600;
							line-height: 45rpx;
						}
						&:last-child {
							color: #787878;
							font-size: 26rpx;
							font-family: PingFangSC-Regular, PingFang SC;
							font-weight: 400;
							line-height: 37rpx;
						}
					}
				}
				.mlit-right {
					line-height: 50rpx;
					text-align: center;
					border-radius: 5rpx;
					color: #858585;
					font-size: 24rpx;
					.mlit-right-item{
						padding: 0 15rpx;
						border: solid 1px #BDBDBD;
					}
					.mlit-right-item.fee-status{color: #FA6400;border-color: #FA6400;}
					.mlit-right-item + .mlit-right-item{margin-left: 10rpx;}
				}
			}
			.monthly-list-item-bottom {
				padding: 31rpx 39rpx;
				.mlib-item {
					display: flex;
					flex-direction: row;
					color: #595959;
					font-family: PingFangSC-Regular, PingFang SC;
					font-size: 26rpx;
					line-height: 40rpx;
					view {
						&:first-child {
							width: 20%;
							text-align: justify;
							text-align-last: justify;
							margin-right: 5rpx;
						}
						&:last-child {
							margin-left: 10rpx;
						}
					}
					&:last-child {
						view {
							&:last-child {
								color: #FA6400;
							}
						}
					}
				}
			}
			.button-wrap{
				border-top: 1px solid #DFDFDF;
				// padding: 26rpx 39rpx;
				.tool-btn{
					padding: 26rpx 39rpx;
					flex: 1;
					text-align: center;
					&-cancel{
						// background-color: red;
					}
				}
			}
		}
	}
}