jzmall_wx/pages/member/memberCenter/memberCenter.wxss

.member-center-page{
	/* background: #2E3235; */
	/* height: 100vh; */
	padding-bottom:140rpx;
	/* padding:16rpx 70rpx 80rpx; */
}
.center-top{
	width: 610rpx;
height: 286rpx;
background: linear-gradient(162deg, #F1E3C8 0%, #E6C162 100%);
border-radius: 10rpx;
margin:0 0 26rpx;
padding:32rpx 32rpx 20rpx;
}
.user-info{
	height: 112rpx;
	margin:0 0 32rpx;
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}
.user-avatar{
 width:112rpx;
 height: 112rpx;
 background-color: #fff;
 border-radius: 112rpx;
 margin:0 40rpx 0 0;
}
.user-detail{
	flex:1;
	padding:0 0 12rpx;
	color: #5D3A11;
	font-size:26rpx;
}
.user-name{
	height: 30rpx;
	display: flex;
	align-items: center;
	margin:0 0 20rpx 0;
}
.user-name text{
	font-size: 30rpx;
}
.member-date{
	height: 36rpx;
	line-height:36rpx;
}
.member-bage{
	width: 28rpx;
height: 28rpx;
line-height: 24rpx;
background: #2E3235;
border-radius: 50%;
margin:0 0 0 10rpx;
text-align: center;
font-size:20rpx;
color: #E6C162;
}
.member-bage text{
	font-weight: bold;
color: #5D3A11;
font-size:20rpx;
line-height: 24rpx;
background: linear-gradient(78deg, #F1E3C8 0%, #E6C162 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.amount-info{
	height: 90rpx;
	display: flex;
	justify-content: space-between;
	align-items: flex-end;
}
.save-text{
	color: #5D3A11;
	font-size: 24rpx;
	height: 24rpx;
	line-height: 22rpx;
	margin:0 0 6rpx 0;
}
.save-cost{
	font-size: 60rpx;
	height: 64rpx;
	line-height: 64rpx;
	font-weight: bold;
	color: #5D3A11;
}
.save-cost text{
	font-size: 32rpx;
	font-weight: bold;
}
.buy-record{
	/* padding: 0 0 12rpx; */
	display: flex;
	align-items: center;
	color: #5D3A11;
	font-weight: 26rpx;
}
.buy-record text{
  padding-left:10rpx;
}
.renew-btn{
	width: 130rpx;
	height: 36rpx;
	line-height: 34rpx;
	background: #2E3235;
	border-radius: 18rpx;
	text-align: center;
}
.renew-btn text{
	
	font-size: 24rpx;
color: #5D3A11;
background: linear-gradient(78deg, #F1E3C8 0%, #E6C162 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}


.center-content{
	height: 602rpx;
	width:610rpx;
	border-radius: 10rpx;
	background: url('https://jzmall.lifejingzhi.com/file/jzmall/weixin/new/member-center-bg.png') no-repeat center top;
	background-size: 100%;
	padding:48rpx 24rpx 20rpx;
}
.h1-title{
	text-align: center;
	height: 44rpx;
	line-height: 44rpx;
font-size: 44rpx;
color: #FFFFFF;
font-weight: bold;
background: linear-gradient(78deg, #F1E3C8 0%, #E6C162 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.h2-title{
	text-align: center;
	height: 24rpx;
	line-height: 24rpx;
font-size: 24rpx;
color: #FFFFFF;
background: linear-gradient(78deg, #F1E3C8 0%, #E6C162 100%);
-webkit-background-clip: text;
-webkit-text-fill-color:transparent;
margin:24rpx 0  66rpx;
}
.category-block{
	display: flex;
	justify-content: space-between;
	margin:0 0 20rpx;
}
.category-item{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: space-between;
	height:160rpx;
	flex:1;
}
.category-img{
	width:88rpx;
	height: 88rpx;
}
.category-name{
	height: 28rpx;
	line-height: 28rpx;
font-size: 28rpx;
color: #FFFFFF;
background: linear-gradient(181deg, #F1E3C8 0%, #E6C162 100%);
-webkit-background-clip: text;
-webkit-text-fill-color: transparent;
}
.category-discount{
	height: 24rpx;
font-size: 24rpx;
color: #85868A;
}



.rule{
	text-align: center;
    padding-bottom: 20rpx;
    color: #E6C162;
    margin: 0 0 20rpx;
}








/* 海报的样式 */
.poster{
	padding: 50rpx;
	background: linear-gradient(162deg, #F1E3C8 0%, #E6C162 100%);
	text-align: left;
	/* height: 650rpx; */
	top: 20%;
	margin: 50rpx;
  position: absolute;  
  z-index: 99;
  text-align: left;
  left: 0; 
	right: 0; 
	border-radius: 20rpx;
}

.title{
	color: #333;
	margin: 20rpx 0;
	font-size: 36rpx;
	text-align: center;
}
.ads{
	margin: 10rpx 0rpx;
  color: #333; 
}
.tool{
	display: flex;
    text-align: center;
    justify-content: baseline;
    width: 100%;   
    margin-top: 20rpx;
}
.tool view{
	flex: 1;
}


.img{
	width: 107rpx;
	height: 128rpx;
} 

.closeImg{
  width: 57rpx;
  height: 57rpx;
} 

.share-btn{
	background: #2E3235;
	width: 260rpx;
	height: 76rpx;
	line-height: 76rpx;
	margin: 0 auto;
	color: #fff;
	border-radius: 38rpx;
}

.share-btn::after {
  border: none;
}
.pay-btn{
	margin:80rpx auto 0;
	width: 530rpx;
height: 100rpx;
background: linear-gradient(0deg, #E4CFA8, #E4CFA8);
box-shadow: 0rpx 9rpx 18rpx 0rpx rgba(50, 50, 50, 0.06);
border-radius: 100rpx;
font-weight: bold;
color: #663315;
text-shadow: 2rpx 6rpx 8rpx rgba(30, 4, 4, 0.18);
font-size: 36rpx;
text-align: center;
line-height: 100rpx;
}
.benefit-title{
	font-weight: bold;
color: #000000;
font-size: 34rpx;
margin:48rpx 0 28rpx 34rpx;
height: 34rpx;
}
.benefit-banner-item{
	width:700rpx;
	height: 182rpx;
	margin:0 25rpx 12rpx;
}
.benefit-banner-item image{
	width:700rpx;
	height: 182rpx;
}
.benefit-icon-block{
	margin:26rpx 0 0;
	padding:0 66rpx 0 ;
	display: flex;
	justify-content: space-between;
}
.benefit-icon-item{
	width:124rpx;
	display: flex;
	flex-direction: column;
	align-items: center;
}
.benefit-icon-item image{
	width:112rpx;
	height:112rpx;
}
.benefit-icon-title{
	color: #515151;
	font-size: 24rpx;
	height: 32rpx;
	line-height: 32rpx;
}
.benfit-icon-remark{
	color: #9D9D9D;
	font-size: 20rpx;
}
.first-buy-title{
  height: 34px;
  line-height: 34rpx;
  padding:0 34rpx;
  display: flex;
  align-items: flex-end;
  font-size: 34rpx;
  font-weight: bold;
}
.first-buy-title .remark{ 
  margin-left:16rpx;
  font-size: 20rpx;
  font-weight: normal;

}
.good-list{
  padding:0 20rpx;
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;

}
.good-item{
  margin-bottom:10rpx;
}
.good-img{
  width:350rpx;
  height: 224rpx;
}
.banner-item{
	margin:0 auto 10rpx;
	width:712rpx;
}
.banner-img{
  width:712rpx;
  height: 190rpx;
  margin:0 auto;
}
.member-valid-wrapper{
	text-align: center;
}
.user-info{
	height: 112rpx;
	margin:0 0 32rpx;
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding:0 80rpx 0 40rpx;
}
.user-avatar{
 width:112rpx;
 height: 112rpx;
 background-color: #fff;
 border-radius: 112rpx;
 margin:0 20rpx 0 0;
}
.user-detail{
	flex:1;
	padding:8rpx  0 0rpx;
	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-invalid-top{
	background: url('https://jzmall.lifejingzhi.com/file/jzmall/weixin/memberCard-1229/member-center-bg.png') no-repeat center top;
  background-size: 100%;
	height: 342rpx;
	width:750rpx;
	padding:30rpx 0 0;
}
.member-invalid-wrapper .buy-record,.member-valid-wrapper .buy-record{
	display: flex;
	align-items: center;
color: #FFFFFF;
font-size: 22rpx;
	font-weight: 26rpx;
	width: 136rpx;
	justify-content: center;
height: 42rpx;
line-height: 42rpx;
border-radius: 5rpx;
	background-color: #45474C;
}
.member-invalid-card{
	width: 608rpx;
height: 180rpx;
background: linear-gradient(180deg, #FFE3AF, #FEBF4F);
box-shadow: 0rpx 10rpx 16rpx 0rpx rgba(197, 148, 60, 0.16);
border-radius: 15rpx;
margin:-156rpx auto 0;
padding:50rpx 54rpx 44rpx 40rpx;
display: flex;
justify-content: space-between;
}
.invalid-card-left{
  color: #A26428;
text-shadow: 2rpx 6rpx 8rpx rgba(30, 4, 4, 0.18);
font-size: 24rpx;
}
.invalid-card-left .card-title{
	font-weight: bold;
color: #663315;
text-shadow: 2rpx 6rpx 8rpx rgba(30, 4, 4, 0.18);
font-size: 32rpx;
height: 44rpx;
line-height: 44rpx;
margin-bottom:8rpx;
}
.invalid-card-right{
	display: flex;
	flex-direction: column;
	justify-content: flex-end;
	align-items: center;
	color: #A26428;
opacity: 0.8;
text-shadow: 2rpx 6rpx 8rpx rgba(30, 4, 4, 0.18);
font-size: 20rpx;
width: 144rpx;
}
.invalid-card-right .btn{
	width: 144rpx;
height: 42rpx;
line-height: 42rpx;
background: #FFFFFF;
border-radius:42rpx;
color: #663315;
font-size: 24rpx;
opacity: 1;
text-align: center;
margin-top:8rpx;
}
.member-valid-top{
 padding:30rpx 0 32rpx;
background: #1F232D;
background: url('https://jzmall.lifejingzhi.com/file/jzmall/weixin/memberCard-1229/member-valid-bg.png') no-repeat center;
  background-size: 100%;
	height: 700rpx;
	width:750rpx;
	color:#fff;
}
.member-valid-benefit{

	height: 526rpx;
	width:750rpx;
}
.valid-benefit-item image{
	width:100rpx;
	height: 100rpx;
}
.valid-benefit-title{
	display: flex;
	justify-content: center;
	font-size: 28rpx;
	font-weight: bold;
	align-items: center;
}
.valid-benefit-title .line{
	width: 50rpx;
height: 3rpx;
background: rgba(255,255,255,0.85);
border-radius: 0rpx 3rpx 3rpx 0rpx;
}
.valid-benefit-title .text{
	margin:0 14rpx;
}
.valid-benefit-block{
	padding:0 30rpx 0 26rpx;
}
.valid-benefit-line{
	display: flex;
	justify-content: space-between;
	text-align: center;
	margin-top:30rpx;
}
.valid-benefit-item{
	flex:1;
	font-size: 24rpx;
}
.valid-benefit-item .remark{
	color: #9D9D9D;
	font-size: 21rpx;
}
.member-date .renew{
	color: #E6C78B;
	font-size: 24rpx;
	margin-left:14rpx;
}