640 lines
11 KiB
Plaintext
640 lines
11 KiB
Plaintext
.page {
|
|
padding-bottom: 166rpx;
|
|
}
|
|
|
|
.card-swiper {
|
|
width: 100%;
|
|
height: 440rpx;
|
|
background: #fff;
|
|
}
|
|
|
|
.card-swiper swiper {
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.clubcard {
|
|
width: 95%;
|
|
height: 320rpx;
|
|
border-radius: 15rpx;
|
|
margin-top: 54rpx;
|
|
overflow: hidden;
|
|
box-sizing: border-box;
|
|
padding: 20rpx;
|
|
text-align: center;
|
|
position: relative;
|
|
}
|
|
|
|
.clubcard.big {
|
|
width: 95%;
|
|
height: 358rpx;
|
|
margin-top: 36rpx;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.clubcard .content {
|
|
position: relative;
|
|
width: 100%;
|
|
height: 100%;
|
|
}
|
|
|
|
.clubcard .content .icon image {
|
|
width: 58rpx;
|
|
height: 58rpx;
|
|
}
|
|
|
|
.clubcard .content:after {
|
|
content: "";
|
|
position: absolute;
|
|
left: 0;
|
|
right: 0;
|
|
top: 0;
|
|
bottom: 0;
|
|
border: 1rpx solid #000;
|
|
opacity: 0.1;
|
|
}
|
|
|
|
.clubcard .icon-bg {
|
|
position: absolute;
|
|
font-size: 204rpx;
|
|
color: #000;
|
|
opacity: 0.1;
|
|
right: -55rpx;
|
|
bottom: -66rpx;
|
|
}
|
|
|
|
.clubcard .icon {
|
|
padding-top: 26rpx;
|
|
}
|
|
|
|
.clubcard .icon i {
|
|
font-size: 52rpx;
|
|
color: #fff;
|
|
}
|
|
|
|
.clubcard .title {
|
|
color: #fff;
|
|
font-size: 46rpx;
|
|
opacity: 0.8;
|
|
line-height: 1;
|
|
margin-top: 10rpx;
|
|
}
|
|
|
|
.clubcard .subtitle {
|
|
color: #fff;
|
|
font-size: 30rpx;
|
|
opacity: 0.8;
|
|
line-height: 1;
|
|
margin-top: 25rpx;
|
|
}
|
|
|
|
.clubcard .opencard {
|
|
color: #c1a167;
|
|
font-size: 32rpx;
|
|
width: 208rpx;
|
|
height: 64rpx;
|
|
border-radius: 32rpx;
|
|
background: #333;
|
|
margin: 0 auto;
|
|
line-height: 64rpx;
|
|
margin-top: 40rpx;
|
|
position: relative;
|
|
z-index: 999;
|
|
}
|
|
|
|
.card-style-golden {
|
|
background: linear-gradient(to right,#c1a167,#e9d5aa);
|
|
box-shadow: 0 26px 40px -24px rgba(193,161,103,0.6);
|
|
}
|
|
|
|
.card-style-erythrine {
|
|
background: linear-gradient(to right,#745757,#966d6d);
|
|
box-shadow: 0 26px 40px -24px rgba(116,87,87,0.6);
|
|
}
|
|
|
|
.card-style-gray {
|
|
background: linear-gradient(to right,#434247,#7a7985);
|
|
}
|
|
|
|
.card-style-gray .shadow {
|
|
box-shadow: 0 0 70rpx #434247;
|
|
}
|
|
|
|
.card-style-brown {
|
|
background: linear-gradient(to right,#736e6c,#978c8c);
|
|
}
|
|
|
|
.card-style-brown .shadow {
|
|
box-shadow: 0 0 70rpx #736e6c;
|
|
}
|
|
|
|
.card-style-blue {
|
|
background: linear-gradient(to right,#576074,#6d7b96);
|
|
}
|
|
|
|
.card-style-blue .shadow {
|
|
box-shadow: 0 0 70rpx #576074;
|
|
}
|
|
|
|
.card-style-black {
|
|
background: linear-gradient(to right,#373737,#4a4a4a);
|
|
}
|
|
|
|
.card-style-blue .black {
|
|
box-shadow: 0 0 70rpx #373737;
|
|
}
|
|
|
|
.card-group {
|
|
background: #fff;
|
|
padding-top: 40rpx;
|
|
margin-top: 20rpx;
|
|
}
|
|
|
|
.card-group.nomargin {
|
|
margin-top: 0;
|
|
}
|
|
|
|
.card-title {
|
|
height: 48rpx;
|
|
line-height: 48rpx;
|
|
font-size: 32rpx;
|
|
color: #333;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
position: relative;
|
|
margin-bottom: 20rpx;
|
|
}
|
|
|
|
.card-subtitle {
|
|
font-size: 22rpx;
|
|
color: #bbb;
|
|
text-align: center;
|
|
}
|
|
|
|
.card-title:before {
|
|
content: "";
|
|
position: absolute;
|
|
width: 80rpx;
|
|
height: 2rpx;
|
|
top: 50%;
|
|
margin-top: -1rpx;
|
|
left: 205rpx;
|
|
background: linear-gradient(to right,#fff,#c1a167);
|
|
}
|
|
|
|
.card-title:after {
|
|
content: "";
|
|
position: absolute;
|
|
width: 80rpx;
|
|
height: 2rpx;
|
|
top: 50%;
|
|
margin-top: -1rpx;
|
|
right: 205rpx;
|
|
background: linear-gradient(to right,#c1a167,#fff);
|
|
}
|
|
|
|
.card-btn-group {
|
|
padding: 0 20rpx;
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.card-btn-group .card-btn-item {
|
|
width: 25%;
|
|
height: 176rpx;
|
|
text-align: center;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
}
|
|
|
|
.card-btn-group .card-btn-item .card-btn-icon .icon {
|
|
width: 108rpx;
|
|
height: 108rpx;
|
|
background: rgba(193,161,103,0.2);
|
|
display: inline-block;
|
|
border-radius: 50%;
|
|
margin-bottom: 24rpx;
|
|
text-align: center;
|
|
line-height: 108rpx;
|
|
}
|
|
|
|
.card-btn-group .card-btn-item .card-btn-icon i {
|
|
font-size: 50rpx;
|
|
color: #c1a167;
|
|
}
|
|
|
|
.card-btn-group .card-btn-item .card-btn-text {
|
|
font-size: 22rpx;
|
|
color: #999;
|
|
}
|
|
|
|
.card-getmore {
|
|
text-align: center;
|
|
font-size: 24rpx;
|
|
color: #c1a167;
|
|
line-height: 70rpx;
|
|
padding-bottom: 10rpx;
|
|
}
|
|
|
|
.card-getmore i {
|
|
font-size: 20rpx;
|
|
margin-left: 10rpx;
|
|
}
|
|
|
|
.card-fiche {
|
|
width: 710rpx;
|
|
height: 160rpx;
|
|
border-radius: 8rpx;
|
|
margin: 20rpx auto 0;
|
|
display: flex;
|
|
}
|
|
|
|
.card-fiche.gary {
|
|
background: #393939;
|
|
}
|
|
|
|
.card-fiche.golden {
|
|
background: linear-gradient(to right,#c1a167,#ead5aa);
|
|
}
|
|
|
|
.card-fiche .fiche-icon {
|
|
width: 168rpx;
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
|
|
.card-fiche .fiche-inner {
|
|
flex: 1;
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
}
|
|
|
|
.card-fiche .fiche-btn {
|
|
width: 260rpx;
|
|
}
|
|
|
|
.card-fiche.gary .fiche-inner {
|
|
font-size: 32rpx;
|
|
font-weight: bold;
|
|
color: #c1a167;
|
|
}
|
|
|
|
.card-fiche.gary .fiche-btn {
|
|
font-size: 32rpx;
|
|
font-weight: bold;
|
|
color: #c1a167;
|
|
line-height: 140rpx;
|
|
height: 100%;
|
|
text-align: right;
|
|
box-sizing: border-box;
|
|
padding-right: 20rpx;
|
|
}
|
|
|
|
.card-fiche.gary .fiche-btn span {
|
|
font-size: 72rpx;
|
|
}
|
|
|
|
.card-fiche.golden .fiche-inner {
|
|
font-size: 32rpx;
|
|
font-weight: bold;
|
|
color: #333;
|
|
}
|
|
|
|
.card-fiche.golden .fiche-inner .subtitle {
|
|
font-size: 46rpx;
|
|
font-weight: bold;
|
|
color: #000;
|
|
opacity: 0.5;
|
|
margin-top: 10rpx;
|
|
}
|
|
|
|
.card-fiche.golden .fiche-inner .subtitle span {
|
|
font-size: 24rpx;
|
|
}
|
|
|
|
.card-fiche.golden .fiche-btn {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
font-size: 22rpx;
|
|
}
|
|
|
|
.card-fiche.golden .fiche-btn .btn-submit {
|
|
width: 174rpx;
|
|
height: 50rpx;
|
|
text-align: center;
|
|
line-height: 48rpx;
|
|
border-radius: 27rpx;
|
|
display: inline-block;
|
|
}
|
|
|
|
.card-fiche.golden .fiche-btn .btn-submit.border {
|
|
border: 1px solid #333;
|
|
}
|
|
|
|
.card-modal {
|
|
position: fixed;
|
|
top: 0;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
background: rgba(0,0,0,0.6);
|
|
}
|
|
|
|
.card-modal .inner {
|
|
width: 570rpx;
|
|
height: 422rpx;
|
|
border-radius: 15rpx;
|
|
background: #fff;
|
|
margin: 350rpx auto 0;
|
|
padding: 48rpx;
|
|
box-sizing: border-box;
|
|
}
|
|
|
|
.card-modal .inner .title {
|
|
font-size: 32rpx;
|
|
color: #333;
|
|
font-weight: bold;
|
|
text-align: center;
|
|
line-height: 1;
|
|
margin-bottom: 20rpx;
|
|
}
|
|
|
|
.card-modal .inner .text {
|
|
font-size: 28rpx;
|
|
color: #666;
|
|
line-height: 50rpx;
|
|
position: relative;
|
|
padding-left: 30rpx;
|
|
}
|
|
|
|
.card-modal .inner .text::before {
|
|
content: "";
|
|
position: absolute;
|
|
width: 8rpx;
|
|
height: 8rpx;
|
|
background: #666;
|
|
border-radius: 50%;
|
|
left: 10rpx;
|
|
top: 50%;
|
|
margin-top: -4rpx;
|
|
}
|
|
|
|
.card-modal .inner .text.nobefore::before {
|
|
display: none;
|
|
}
|
|
|
|
.card-modal .inner .submit {
|
|
font-size: 28rpx;
|
|
color: #fff;
|
|
line-height: 84rpx;
|
|
margin: 46rpx auto 0;
|
|
width: 474rpx;
|
|
height: 84rpx;
|
|
background: linear-gradient(to right,#c1a167,#e9d5aa);
|
|
text-align: center;
|
|
border-radius: 42rpx;
|
|
}
|
|
|
|
.card-group .card-explain {
|
|
font-size: 22rpx;
|
|
color: #666;
|
|
line-height: 40rpx;
|
|
padding: 0 24rpx;
|
|
}
|
|
|
|
.card-group .card-explain:last-child {
|
|
padding-bottom: 50rpx;
|
|
}
|
|
|
|
.btn-footbar-bj {
|
|
height: 98rpx;
|
|
position: fixed;
|
|
left: -50rpx;
|
|
right: -50rpx;
|
|
bottom: 0;
|
|
background: #c1a168;
|
|
display: flex;
|
|
transform: skewX(-20deg);
|
|
}
|
|
|
|
.btn-footbar-bj.iphonex,.btn-footbar.iphonex {
|
|
bottom: 68rpx;
|
|
}
|
|
|
|
.renew {
|
|
height: 98rpx;
|
|
position: fixed;
|
|
left: 0;
|
|
right: 0;
|
|
bottom: 0;
|
|
background: #c1a168;
|
|
text-align: center!important;
|
|
line-height: 98rpx;
|
|
color: #fff;
|
|
}
|
|
|
|
.renew.iphonex {
|
|
bottom: 68rpx;
|
|
}
|
|
|
|
.btn-footbar-bj .item {
|
|
flex: 1;
|
|
}
|
|
|
|
.btn-footbar-bj .item:first-child {
|
|
background: #333;
|
|
}
|
|
|
|
.btn-footbar {
|
|
position: fixed;
|
|
left: 0;
|
|
bottom: 0;
|
|
right: 0;
|
|
z-index: 2;
|
|
display: flex;
|
|
}
|
|
|
|
.btn-text {
|
|
color: #c1a168;
|
|
font-size: 28rpx;
|
|
font-weight: bold;
|
|
width: 50%;
|
|
text-align: center;
|
|
line-height: 82rpx;
|
|
}
|
|
|
|
.btn-text span {
|
|
font-size: 46rpx;
|
|
}
|
|
|
|
.btn-footbar .btn-submit {
|
|
color: #fff;
|
|
font-size: 34rpx;
|
|
width: 50%;
|
|
text-align: center;
|
|
line-height: 82rpx;
|
|
}
|
|
|
|
.btn-footbar .btn-submit i {
|
|
margin-left: 4rpx;
|
|
font-size: 28rpx;
|
|
}
|
|
|
|
.fiche-icon .icox-kaiqiajifen,.fiche-icon .icox-meiyuejifen,.fiche-icon .icox-huangguan-line {
|
|
font-size: 150rpx;
|
|
color: 000;
|
|
opacity: 0.1;
|
|
}
|
|
|
|
.fiche-icon .icox-huangguan-line {
|
|
position: absolute;
|
|
bottom: -57rpx;
|
|
left: -42rpx;
|
|
font-size: 190rpx;
|
|
}
|
|
|
|
.fiche-icon .icox-huiyuanzhuanxiangzhekou {
|
|
font-size: 190rpx;
|
|
position: absolute;
|
|
left: -60rpx;
|
|
bottom: -76rpx;
|
|
opacity: 0.1;
|
|
color: #fff;
|
|
}
|
|
|
|
.card-group .coupon-list {
|
|
display: flex;
|
|
flex-wrap: wrap;
|
|
padding: 28rpx 20rpx 0;
|
|
}
|
|
|
|
.card-group .coupon-list.left {
|
|
flex-wrap: nowrap;
|
|
overflow-x: scroll;
|
|
}
|
|
|
|
.coupon-list-item {
|
|
position: relative;
|
|
overflow: hidden;
|
|
width: 349rpx;
|
|
height: 194rpx;
|
|
text-align: center;
|
|
margin-bottom: 20rpx;
|
|
}
|
|
|
|
.card-group .coupon-list.left .coupon-list-item {
|
|
flex-shrink: 0;
|
|
margin-right: 15rpx;
|
|
}
|
|
|
|
.coupon-list-item:nth-child(odd) {
|
|
margin-right: 15rpx;
|
|
}
|
|
|
|
.coupon-list-item .coupon-inner {
|
|
border: 1rpx solid #ccc;
|
|
width: 345rpx;
|
|
height: 190rpx;
|
|
border-radius: 15rpx;
|
|
}
|
|
|
|
.coupon-inner-media {
|
|
display: flex;
|
|
padding-left: 36rpx;
|
|
}
|
|
|
|
.coupon-inner-media .price {
|
|
line-height: 100rpx;
|
|
}
|
|
|
|
.coupon-list-item .price {
|
|
font-size: 20rpx;
|
|
font-weight: bold;
|
|
color: #c1a167;
|
|
padding-top: 20rpx;
|
|
}
|
|
|
|
.coupon-list-item .price span {
|
|
font-size: 48rpx;
|
|
}
|
|
|
|
.coupon-list-item .explain {
|
|
font-size: 22rpx;
|
|
color: #666;
|
|
line-height: 1;
|
|
padding-top: 5rpx;
|
|
}
|
|
|
|
.coupon-inner-media .explain {
|
|
display: flex;
|
|
flex-direction: column;
|
|
justify-content: center;
|
|
text-align: left;
|
|
padding-left: 20rpx;
|
|
font-size: 24rpx;
|
|
color: #000;
|
|
font-weight: bold;
|
|
}
|
|
|
|
.coupon-inner-media .explain .subtitle {
|
|
color: #666;
|
|
font-size: 22rpx;
|
|
margin-top: 10rpx;
|
|
font-weight: 400;
|
|
}
|
|
|
|
.coupon-list-item.already .condition .btn-condition {
|
|
width: 174rpx;
|
|
height: 48rpx;
|
|
line-height: 48rpx;
|
|
margin: 10rpx auto 0;
|
|
color: #fff;
|
|
border-radius: 24rpx;
|
|
background: linear-gradient(to right,#c1a167,#e9d5aa);
|
|
}
|
|
|
|
.coupon-list-item.already .condition .btn-condition.gary {
|
|
background: #bbb;
|
|
}
|
|
|
|
.coupon-list-item .condition {
|
|
height: 68rpx;
|
|
line-height: 68rpx;
|
|
font-size: 24rpx;
|
|
color: #333;
|
|
position: absolute;
|
|
bottom: 0;
|
|
left: 24rpx;
|
|
right: 24rpx;
|
|
border-top: 1rpx dashed #ccc;
|
|
}
|
|
|
|
.coupon-list-item .circle {
|
|
position: relative;
|
|
}
|
|
|
|
.coupon-list-item .circle-l {
|
|
position: absolute;
|
|
width: 20rpx;
|
|
height: 20rpx;
|
|
border-radius: 50%;
|
|
border: 1rpx solid #ccc;
|
|
left: -11rpx;
|
|
bottom: 60rpx;
|
|
background: #fff;
|
|
}
|
|
|
|
.coupon-list-item .circle-r {
|
|
position: absolute;
|
|
width: 20rpx;
|
|
height: 20rpx;
|
|
border-radius: 50%;
|
|
border: 1rpx solid #ccc;
|
|
right: -11rpx;
|
|
bottom: 60rpx;
|
|
background: #fff;
|
|
} |