123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117 |
- .buyVip {
- position: fixed;
- z-index: 12;
- left: 0rpx;
- top: 0rpx;
- width: 100vw;
- height: 100vh;
- background: rgba(0, 0, 0, 0.7);
- .modal {
- position: relative;
- width: 677rpx;
- margin: 140rpx auto 0rpx;
- border-radius: 20rpx;
- text-align: center;
- overflow: hidden;
- background-color: white;
- .header {
- width: 100%;
- height: 172rpx;
- background-image: linear-gradient(129deg, #F9D9BF 0%, #F6D0B2 45%, #F3C0A3 70%, #F1B998 100%);
- text-align: center;
- font-size: 36rpx;
- font-weight: bold;
- border-bottom-left-radius: 100rpx;
- border-bottom-right-radius: 100rpx;
- overflow: hidden;
- .h1 {
- margin: 24rpx 0rpx;
- }
- }
- .goodsList {
- margin: 50rpx 0 30rpx;
- width: 100%;
- height: 310rpx;
- padding: 0rpx 20rpx;
- white-space: nowrap;
- .payBox {
- position: relative;
- margin-right: 22rpx;
- width: 268rpx;
- height: 268rpx;
- background-size: cover;
- text-align: center;
- display: inline-block;
- border-radius: 20rpx;
- .pay {
- position: absolute;
- bottom: 24rpx;
- left: 50%;
- transform: translateX(-50%);
- padding: 6rpx 40rpx;
- font-size: 26rpx;
- font-weight: bold;
- border-radius: 50rpx;
- }
- }
- .payBox::after {
- content: '';
- position: absolute;
- width: 268rpx;
- height: 45rpx;
- left: 0;
- bottom: -42rpx;
- background: linear-gradient(180deg, #2A2116 0%, rgba(255, 255, 255, 0) 100%);
- border-radius: 22rpx 22rpx 0rpx 0rpx;
- opacity: 0.26;
- }
- .pbbg1 {
- background-image: url(http://reader-wx.ai160.com/images/reader/v3/12992x.png);
- .pay {
- background: linear-gradient(325deg, #FFBD96 0%, #FFF1E7 100%);
- }
- }
- .pbbg2 {
- background-image: url(http://reader-wx.ai160.com/images/reader/v3/2992x.png);
- .pay {
- background: linear-gradient(285deg, #DFF2EE 0%, #D8E9FD 39%, #BDE6F8 72%, #BAE7F7 100%);
- }
- }
- .pbbg3 {
- background-image: url(http://reader-wx.ai160.com/images/reader/v3/55152x.png);
- .pay {
- background: linear-gradient(325deg, #FFBD96 0%, #FFF1E7 100%);
- }
- }
- }
- .iosVip{
- margin: 30rpx 0;
- width: 580rpx;
- height: 560rpx;
- }
- }
- .close {
- display: block;
- margin: 0 auto;
- padding: 40rpx;
- width: 54rpx;
- height: 54rpx;
- }
- }
|