.page {
	background-color: #F9F9F9;
	width: 100%;
	min-height: 100vh;
}
.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,1);
		.logo-title{
			width: 64%;
			color: #000;
			padding-left: 25rpx;
			font-size: 32rpx;
			display: flex;
			align-items: center;
			image {
				width: 32rpx;
				height: 32rpx;
				margin-right: 10rpx;
			}
		}
		.title{
		}
		.setting-mess{
			width: 20%;
			display: flex;
			align-items: center;
			height: 100%;
			margin-right: 25rpx;
		}
	}

.main {
	margin-top: 100rpx;
	padding-bottom: 140rpx;
}

.coupon-tab {
	display: flex;
	align-items: center;
	width: 100%;
	height: 100rpx;
	.tab {
		position: relative;
		display: flex;
		align-items: center;
		justify-content: center;
		width: 33%;
		height: 100%;
		text {
			font-size: 28rpx;
			color: #7C7C7C;
		}
	}
	.action {
		text {
			color: #222222;
		}
		.line {
			position: absolute;
			left: 50%;
			bottom: 0;
			width: 25%;
			height: 8rpx;
			border-radius: 20rpx 20rpx 0 0;
			background-color: #667FFF;
			transform: translate(-50%, 0);
		}
	}
}
.step-bar {
	margin: 0 25rpx;
	background-color: #fff;
	border-radius: 20rpx;
	padding: 30rpx;
}
.step_item {
		position: relative;
		display: flex;
		padding-bottom: 50rpx;
		.line {
			position: absolute;
			top: 40rpx;
			left: 16rpx;
			content: "";
			width: 4rpx;
			height: 98%;
		}
		.line-active {
			border-left: 4rpx dashed #B6CCFF;
		}
	}
 .element1{
             width: 35rpx;
             height: 35rpx;
             background-color: #B6CCFF;
             border-radius: 50%;
			 position: absolute;
			top: 4rpx;
			left: 0;
         }
         .child1{
             width: 18rpx;
             height: 18rpx;
             border-radius: 50%;
             background-color: #fff;
             position: relative;
             top: 10rpx;
             left: 10rpx;
         }
 
	.middle-box {
		display: flex;
		flex-direction: column;
		margin-left: 50rpx;
		width: 100%;
		.middle-title {
			font-size: 28rpx;
			font-weight: bold;
			color: #000;
			margin-right: 20rpx;
		}
		.middle-bold {
			margin-top: 20rpx;
			color: #0FBB59;
		}
		.middle-img {
			width: 80rpx;
			height: 80rpx;
			margin: 20rpx 0;
		}
		.middle-btn {
			background-color: #000;
			border-radius: 10rpx;
			color: #fff;
			width: 180rpx;
			text-align: center;
			padding: 15rpx 0;
			margin-top: 20rpx;
		}
		.middle-zd-box {
			display: flex;
			align-items: center;
			justify-content: center;
			background-color: #F3F3F3;
			border-radius: 10rpx;
			padding: 10rpx 0;
			text-align: center;
			margin-top: 10rpx;
			image {
				width: 22rpx;
				height: 22rpx;
				position: relative;
				top: 2rpx;
			}
		}
		.describe {
			margin-top: 15rpx;
			margin-bottom: 10rpx;
			color: #909090;
		}
	}
.step_item_one {
	padding-bottom: 0;
	.line {
		height: 0;
	}
}
.middle-box-tips {
	display: flex;
	align-items: center;
	justify-content: space-between;
	color: #989898;
	image {
		width: 113rpx;
		height: 40rpx;
		margin-left: 10rpx;
	}
	.middle-green {
		color: #787878;
	}
}

.user-list{
	padding: 0 25rpx;
	.list{
		position: relative;
		display: flex;
		align-items: center;
		justify-content: space-between;
		background-color: #FFFFFF;
		border-radius: 20rpx;
		margin-bottom: 20rpx;
		padding: 30rpx;
		.title{
			color: #767676;
			.title-big {
				font-size: 28rpx;
				font-weight: bold;
				color: #000;
				margin-bottom: 35rpx;
			}
			.title-btn {
				background-color: #477EFF;
				border-radius: 100rpx;
				box-shadow: 0 10rpx 20rpx #d6e3ff;
				color: #fff;
				display: inline-block;
				padding: 14rpx 40rpx;
				margin-top: 35rpx;
			}
			.title-right {
				margin-left: 40rpx;
			}
		}
		.more-content{
			display: flex;
			align-items: center;
			.more-content-img {
				display: flex;
				align-items: center;
				image {
					width: 210rpx;
					height: 210rpx;
				}
			}
		}
	}
}