.box { height: 100%; background: linear-gradient(180deg, rgba(253, 131, 45, 1) 0%, rgba(254, 74, 22, 1) 100%); } .container { background: #fff; width: 92%; margin: 8% auto 6%; border-radius: 16rpx; } .coedTiem { text-align: center; color: rgba(253, 131, 45, 1); margin-bottom: 10rpx; } page { background: linear-gradient(180deg, rgba(253, 131, 45, 1) 0%, rgba(254, 74, 22, 1) 100%); height: auto !important; } .zhuangtai { margin-bottom: 20rpx; } .panel, .zhuangtai image { position: relative; width: 600rpx; display: block; border-radius: 10rpx; margin: 0 auto; padding: 0; z-index: 10000; } .panel { position: relative; } .pane2 { background: #fff; opacity: 0.6; } .pane2 image { width: 500rpx; display: block; margin: 40rpx auto 0; } .buy { background: #fff; height: 88rpx; width: 98%; color: #7e7e7e; line-height: 88rpx; border-radius: 16rpx; border: 1px solid #eee; } .barcode { height: 100rpx; width: 510rpx; margin: 0 auto; } .barnum { background: #fff; height: 88rpx; width: 600rpx; margin: 0 auto; line-height: 88rpx; border: 2rpx solid #ccc; border-radius: 10px; font-size: 36rpx; color: #333; letter-spacing: 0; text-align: center; overflow: hidden; } .barnumtext { float: left; margin-left: 20rpx; font-size: 30rpx; } .barnumImg { float: left; height: 40rpx; width: 40rpx !important; margin: 24rpx 20rpx !important; z-index: 999; } .barnumtext::before { content: "优惠券码:"; font-size: 24rpx; color: #999; } .barcode>canvas { width: 510rpx; height: 100rpx; } .qrcode { position: relative; height: 350rpx; width: 350rpx; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; margin: 0 auto; } .qrcode>canvas { width: 350rpx; height: 350rpx; } .coupon_detail { position: relative; } .coupon_detail .wmfl { position: absolute; width: 120rpx; height: 120rpx; left: 0; right: 0; margin: auto; top: -50rpx; border-radius: 50%; overflow: hidden; } .coupon_detail image { display: block; width: 100%; height: 100%; } .coupon_detail .fr { width: 100%; text-align: center; } .coupon_detail .title { font-size: 32rpx; color: #1f2d3d; letter-spacing: 0; text-align: center; display: block; padding-top: 92rpx; line-height: 45rpx; } .line { height: 10rpx; display: block; width: 100%; margin-top: 20rpx; } .time { font-size: 26rpx; color: #999; letter-spacing: 0; text-align: center; line-height: 37rpx; padding: 0 10rpx; } .time text { font-size: 26rpx; color: red; } .money text { color: red; } .money del { color: #999; font-size: 26rpx; text-decoration: line-through; margin-left: 20rpx; } .clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; } .timevalidity { text-align: center; } .timevalidity text:nth-of-type(1) { font-size: 22rpx; color: #999; letter-spacing: 0; text-align: left; } .timevalidity text:nth-of-type(2) { font-size: 22rpx; color: #999; letter-spacing: 0; text-align: left; } .timevalidity text:nth-of-type(3) { font-size: 22rpx; color: #999; letter-spacing: 0; text-align: left; } .tit { padding: 53rpx 0 0; text-indent: 30rpx; font-size: 24rpx; color: #919191; letter-spacing: 0; } .notes view:nth-child(1) { width: 92%; height: 87rpx; padding: 0 4%; line-height: 87rpx; background: #fff; } .notes view:nth-child(1) text { font-size: 30rpx; color: #333; letter-spacing: 0; } .notes view:nth-child(2) { width: 92%; padding: 0 4%; background: #fff; display: flex; flex-direction: column; } .notes view:nth-child(2)>text { font-size: 24rpx; color: #333; letter-spacing: 0; line-height: 42rpx; } .notes { border-bottom-left-radius: 16rpx; border-bottom-right-radius: 16rpx; padding-bottom: 30rpx; } .note view { height: 48rpx; line-height: 48rpx; } .note view text { display: inline-block; } .note text:nth-of-type(1) { width: 22%; text-indent: 30rpx; text-align: left; font-size: 24rpx; color: #333; letter-spacing: 1.16rpx; } .note text:nth-of-type(2) { width: 67%; font-size: 24rpx; color: #333; letter-spacing: 1.16rpx; } .manjian { margin-left: 26rpx; color: #999 !important; font-size: 26rpx !important; text-align: center; } .moneys { font-size: 40rpx !important; color: #ff4949 !important; letter-spacing: 0; text-align: right; } .game-entry { width: 690rpx; height: 140rpx; margin: 10rpx auto 0; } .gameimg { display: block; width: 100%; height: 140rpx; } .refund { display: inline-block; font-size: 26rpx !important; color: red !important; border: 1px solid red; padding: 3rpx; } .closeRq { position: absolute; width: 420rpx; height: 420rpx; line-height: 420rpx; text-align: center; background-color: rgba(0, 0, 0, 0.8); left: 50%; top: 42%; transform: translate(-50%, -50%); /* 50%为自身尺寸的一半 */ z-index: 10000000; color: #fff; font-size: 38rpx; } .updataRqCode { width: 80rpx !important; height: 80rpx; margin-top: calc(50%-80rpx) !important; margin-left: calc(50%-80rpx) !important; display: inline-block !important; } .upDataRq { position: absolute; width: 100%; text-align: center; height: 80rpx; color: #fff; top: 20%; left: 0; } /* .upDataRqImg{ width: 40rpx !important; height: 40rpx; float: left; margin: 20rpx 0 0 20rpx !important; } */