.page{
	// position: absolute;
	// left: 0;
	// top: 0;
	width: 100%;
	height: 100%;
	// overflow-x: hidden;
	// overflow-y: auto;
	position: absolute;
}
.top-img {
	width: 100%;
	height: 400rpx;
}
.head{
		position: fixed;
		left: 0;
		top: 0;
		z-index: 100;
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 100%;
		height: 100rpx;
		/* #ifdef MP */
		height: calc(120rpx + var(--status-bar-height));
		padding-top: calc(40rpx + var(--status-bar-height));
		/* #endif */
		background-color: rgba(255,255,255,0);
		.logo-title{
			width: 64%;
			color: #fff;
			padding-left: 25rpx;
			image {
				width: 100%;
			}
		}
		.title{
			image {
				width: 210rpx;
				height: 33rpx;
			}
		}
		.setting-mess{
			width: 20%;
			display: flex;
			align-items: center;
			height: 100%;
			margin-right: 20rpx;
			.setting{
				display: flex;
				justify-content: center;
				align-items: center;
				width: 80rpx;
				height: 100%;
				text{
					font-size: 38rpx;
				}
			}
			.mess{
				display: flex;
				justify-content: center;
				align-items: center;
				width: 80rpx;
				height: 100%;
				text{
					font-size: 38rpx;
				}
			}
		}
	}
.main{
	position: relative;
	top: 80rpx;
	/* #ifdef MP */
	top: 150rpx;
	/* #endif */
	padding-bottom: 140rpx;
	margin: 0 25rpx;
}
.my-top{
	margin: 40rpx 0;
	/* 用户信息 */
	.user-info{
		display: flex;
		align-items: center;
		.portrait{
			width: 120rpx;
			height: 120rpx;
			margin-right: 20rpx;
			image{
				width: 120rpx;
				height: 120rpx;
				border-radius: 25rpx;
			}
		}
		.info{
			display: flex;
			flex-direction: column;
			justify-content: center;
			width: 74%;
			height: 100%;
			color: #fff;
			.nickname{
				width: 100%;
				margin-bottom: 15rpx;
				text{
					font-size: 32rpx;
					font-weight: bold;
				}
			}
			.rank{
				display: flex;
				align-items: center;
				.rank-img {
					width: 25rpx;
					height: 25rpx;
					margin-left: 10rpx;
				}
				image{
					width: 35rpx;
					height: 35rpx;
					margin-right: 10rpx;
				}
			}
		}
	}
	.user-right {
		display: flex;
		image {
			width: 30rpx;
			height: 30rpx;
		}
	}
}
.my-top-wei {
	display: flex;
	align-items: center;
	justify-content: space-between;
	.my-top-wei {
		background-color: #E4ECFF;
		border-radius: 25rpx;
		color:#477EFF;
		font-size: 28rpx;
		display: inline-block;
		line-height: 74rpx;
		padding: 0 80rpx;
	}
}
.order-content {
	width: 100%;
	border-radius: 20rpx;
	background-color: #FFFFFF;
	padding: 0 4% 4% 4%;
	box-shadow:0 20rpx 30rpx #f1f2f4;
}
.order-info{
	display: flex;
	margin-top: 20rpx;
	.list{
		width: 100%;
		height: 100%;
		.title{
			background-color: #E5F1FF;
			border-radius: 20rpx;
			padding: 20rpx 30rpx;
			text{
				color: #477EFF;
				font-size: 28rpx;
			}
		}
	}
}
.titleall-box {
	display: flex;
	justify-content: space-between;
	padding: 40rpx 0 20rpx 0;
	.titleall-left {
		font-size: 30rpx;
		font-weight: bold;
		display: flex;
		align-items: center;
		.titleall-left-line {
			width: 14rpx;
			height: 28rpx;
			border-radius: 100rpx;
			background-color: #6f91ff;
			margin-right: 20rpx;
			box-shadow: 0 8rpx 10rpx #daddff;
		}
	}
	.titleall-right {
		color: #C1C1C1;
		image {
			width: 20rpx;
			height: 20rpx;
			margin-left: 10rpx;
		}
	}
}
.message-list{
	padding: 20rpx;
	.list{
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 100%;
		height: 100rpx;
		border-bottom: 2rpx solid #f6f6f6;
		.icon-data{
			display: flex;
			align-items: center;
			width: 80%;
			height: 100%;
			.icon{
				display: flex;
				align-items: center;
				justify-content: center;
				width: 40rpx;
				height: 40rpx;
				image{
					width: 40rpx;
					height: 40rpx;
				}
			}
			.data{
				margin-left: 20rpx;
				.title{
					display: flex;
					width: 100%;
					text{
						color: #000;
					}
				}
			}
		}
		.more{
			display: flex;
			align-items: center;
			image {
				width: 20rpx;
				height: 20rpx;
			}
		}
	}
}
/* 我的服务 */
.my-service{
	background-color: #FFFFFF;
	border-radius: 20rpx;
	padding: 20rpx;
	margin: 20rpx;
	.toptitle {
		display: flex;
		justify-content: space-between;
		margin-bottom: 20rpx;
		.title{
				display: flex;
				align-items: center;
				margin-bottom: 20rpx;
				.line {
					width: 15rpx;
					height: 34rpx;
					background: linear-gradient(to bottom, #74CE6A, #3CB545);
					border-radius: 100rpx;
					margin-right: 10rpx;
				}
				.line-blue {
					background: linear-gradient(to bottom, #6BB7F6, #4699E7);
				}
				text{
					font-size: 32rpx;
					font-weight: bold;
					color: #212121;
				}
			}
		.title-more {
			color: #C1C1C1;
			font-size: 28rpx;
			image {
				width: 24rpx;
				height: 24rpx;
			}
		}
	}
	.service-list{
		display: flex;
		flex-wrap: wrap;
		padding: 0 4%;
		.list{
			display: flex;
			flex-direction: column;
			align-items: center;
			justify-content: center;
			width: 25%;
			height: 140rpx;
			.thumb{
				width: 60rpx;
				height: 60rpx;
				image{
					width: 100%;
					height: 100%;
				}
			}
			.name{
				display: flex;
				align-items: center;
				justify-content: center;
				height: 80rpx;
				text{
					color: #212121;
					font-size: 24rpx;
				}
			}
		}
	}
}