jzmall_wx/pages/member/buyMember/buyMember.wxss

.buy-member-page{
	/* height: 100vh; */
	/* background: #2E3235; */
	/* padding:34rpx 30rpx; */
}
.member-top{
	background: url('https://jzmall.lifejingzhi.com/file/jzmall/weixin/memberCard-1229/member-pay-bg.png') no-repeat center top;
  background-size: 100%;
	height: 560rpx;
	width:750rpx;
	padding:30rpx 36rpx 0;
}
.member-type{
	display: flex;
	justify-content:space-between;

}
.type-item{
	height:262rpx;
	width:212rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
	background: #2E3235;
	/* border: 2rpx solid #E6C162; */
/* border-image: linear-gradient(0deg, #F1E3C8, #E6C162) 10 10; */
border-radius: 12rpx;
/* padding:20rpx 0 0; */
overflow:hidden;
}
.member-type-img{
	height:262rpx;
	width:212rpx;
	border-radius: 10rpx;
}
.type-item.type-active{
	/* background: url('https://jzmall.lifejingzhi.com/file/jzmall/weixin/member/member-type.png') no-repeat center top;
	background-size: 100% 100%; */
	border:2rpx solid #fff;
}
.member-icon{
	width:84rpx;
	height:84rpx;
}
.member-title{
	margin:16rpx 0 0;
}
.member-title,.type-name{
	color: #5D3A11;
	font-style: 24rpx;
	line-height: 28rpx;
background: linear-gradient(180deg, #F1E3C8 0%, #E6C162 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.type-price{
	font-size: 26rpx;
	color: #E6C162;
	height: 60rpx;
	line-height: 60rpx;
	margin: 10rpx 0 4rpx;
}
.type-price text{
	font-size: 68rpx;
	font-weight: bold;
}
.type-item.type-active .member-title,.type-item.type-active .type-name{
	color: #5D3A11;
	background: #5D3A11;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.type-item.type-active .type-price{
	color: #5D3A11;
	background: #5D3A11;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.old-price{
	text-decoration: line-through;
color: #85868A;
font-size: 20rpx;
line-height: 20rpx;
margin:6rpx 0 0;
}
.type-convert{
	color: #5D3A11;
background: linear-gradient(180deg, #F1E3C8 0%, #E6C162 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
font-size: 40rpx;
line-height: 44rpx;
font-weight: bold;
margin:36rpx 0 24rpx;
}
.vip-tips{
	color: #85868A;
	font-size: 20rpx;
	line-height: 20rpx;
}
.type-item.type-active .type-convert{
	color: #5D3A11;
	background: #5D3A11;
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.type-item.type-active .vip-tips{
	color: #5D3A11;
}
/* 卡内权益 */
.card-benefit{
	width: 690rpx;
height: 238rpx;
background: #3D4144;
border-radius: 10rpx;
padding:22rpx 14rpx;
margin:32rpx 0;
}
.benefit-title{
	font-size: 24rpx;
	line-height: 24rpx;
	margin:0 0 28rpx 0;
	color: #5D3A11;
background: linear-gradient(173deg, #F1E3C8 0%, #E6C162 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.benefit-block{
	display: flex;
	justify-content: space-between;
}
.benefit-item{
	flex:1;
	text-align: center;
}
.benefit-img{
	width:70rpx;
	height: 70rpx;
	margin:0 0 6rpx 0;
}
.item-title{
 height: 24rpx;
 font-size: 24rpx;
 line-height: 24rpx;
background: linear-gradient(181deg, #F1E3C8 0%, #E6C162 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.item-tip{
	color: #85868A;
	font-size: 20rpx;
	margin:4rpx 0 0;
}
.price-block{
	width: 690rpx;
height: 144rpx;
background: #3D4144;
border-radius: 10rpx;
padding:20rpx 20rpx;
}

.price-line{
	height: 52rpx;
	display: flex;
	font-size: 24rpx;
	justify-content: space-between;
	align-items: center;
  color: #2A2A2A;
}
.price-line text{
	background: linear-gradient(173deg, #F1E3C8 0%, #E6C162 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.invalid-price{
	text-decoration: line-through;
	color:#E6C162;
}

.buy-btn{
	/* position: fixed;
	left:30rpx;
	right:30rpx;
	bottom: 80rpx; */
	width: 530rpx;
height: 100rpx;
line-height: 100rpx;
text-align: center;
color: #663315;
font-size: 24rpx;
background: linear-gradient(0deg, #E4CFA8, #E4CFA8);
box-shadow: 0rpx 9rpx 18rpx 0rpx rgba(50, 50, 50, 0.06);
border-radius: 100rpx;
margin:92rpx auto 0;
}
.now-pay{
	font-size: 32rpx;
	font-weight: bold;
}
.actual-price{
	font-size:38rpx;
	font-weight: bold;
}


.row{
	display: flex;
    justify-content: space-between;
    padding: 20rpx;
}

.title{ 
	color:#E6C162;
	flex: 1;
}
.desc{
	/* color: #09afff; */
	color:#E6C162;
	flex: 2;
}

.price{ 
	color:#E6C162;
	flex: 1;
	text-align: right;
}
.activity-rule-title{
	/* height:112rpx; */
	padding:36rpx 28rpx 20rpx;
	/* display: flex;
	align-items:center; */
	font-size: 34rpx;
	font-weight: bold;
}
.title-hardline{
	height:2rpx;
	background: #85868A;
	flex:1;
}
.activity-rule-title text{
	font-size: 33rpx;
	margin:0 16rpx;
}
.activity-rule-content{
	padding:0 40rpx 0 36rpx;
	font-size: 24rpx;
	color:#85868A;
	line-height: 44rpx;
	text-align: justify;
}
.user-info{
	height: 112rpx;
	margin:0 0 32rpx;
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
	padding-left:40rpx;
}
.user-avatar{
 width:112rpx;
 height: 112rpx;
 background-color: #fff;
 border-radius: 112rpx;
 margin:0 20rpx 0 0;
}
.user-detail{
	flex:1;
	padding:0 0 12rpx;
	color: #fff;
	font-size:26rpx;
}
.user-name{
	height: 30rpx;
	display: flex;
	align-items: center;
	margin:0 0 20rpx 0;
}
.user-name text{
	font-size: 32rpx;
}
.member-date{
	height: 30rpx;
	font-size: 22rpx;
	line-height:30rpx;
	color: #828387;
	display: flex;
	align-items: center;
}
.member-tip{
	height:22rpx;
	display: flex;
	align-items: center;
	margin-top:36rpx;
	color: #BABABA;
	font-size: 22rpx;
	justify-content: center;
}
.member-tip-img{
 width:22rpx;
 height:22rpx;
 margin-right:8rpx;
}