page { background-color: #f6f7fb; } .container { margin-top: 7rpx; } .white_container { background: #FFFFFF; padding: 20rpx; padding-bottom: 28rpx; } .swiper { width: 710rpx; height: 400rpx; } .pic { width: 710rpx; height: 400rpx; border-radius: 20rpx 20rpx 20rpx 20rpx; } .main { margin: 37rpx 10rpx 0; } .title { font-weight: 600; font-size: 40rpx; color: #000000; margin-bottom: 20rpx; } .table { display: flex; font-size: 26rpx; margin-bottom: 10rpx; } .table { display: flex; align-items: center; justify-content: space-between; } .label { color: #999999; margin-right: 36rpx; } .desc { color: #000000; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; flex: 1; display: block; } .detail { margin-top: 20rpx; } .particulars { display: flex; justify-content: space-between; font-size: 30rpx; color: #FF370B; padding-top: 28rpx; border-top: 1rpx solid #E6E6E6; } .bottom { position: fixed; bottom: 0; width: 100%; height: 122rpx; background-color: #FFFFFF; display: flex; justify-content: space-between; align-items: center; box-shadow: 3rpx -3rpx 15rpx 0rpx rgba(255, 27, 27, 0.05); padding-bottom: 30rpx; } .left { display: flex; margin-top: 22rpx; margin-left: 48rpx; } .left_label { display: flex; flex-direction: column; align-items: center; margin-right: 30rpx; } .left_label>image { width: 32rpx; height: 30rpx; margin-bottom: 16rpx; } .btn { width: 230rpx; height: 70rpx; line-height: 70rpx; text-align: center; font-weight: 500; font-size: 36rpx; color: #FFFFFF; /* display: inline-block; */ /* padding: 10rpx 44rpx; */ background: linear-gradient(91deg, #FF7658 0%, #FF370B 100%); border-radius: 100rpx 100rpx 100rpx 100rpx; margin-right: 20rpx; } .btn_disabled { width: 230rpx; height: 70rpx; line-height: 70rpx; text-align: center; font-weight: 500; font-size: 36rpx; color: #FFFFFF; background: #a4a3a1; border-radius: 100rpx 100rpx 100rpx 100rpx; margin-right: 20rpx; } .startList { display: flex; align-items: center; } .startList image { width: 22rpx; height: 22rpx; margin-right: 4rpx; } .Msg { width: 100%; background: #FFFFFF; border-radius: 0rpx 0rpx 0rpx 0rpx; margin: 0 auto; padding: 26rpx 20rpx; margin-top: 30rpx; box-sizing: border-box; } .Msg_Tit { display: flex; align-items: center; justify-content: space-between; } .Msg_Tit_left { display: flex; align-items: center; font-size: 26rpx; color: #999999; } .Msg_Tit_left image { height: 60rpx; width: 60rpx; border-radius: 50%; margin-right: 16rpx; } .Msg_Tit_right { display: flex; align-items: center; } .Msg_Tit_right image { width: 22rpx; height: 22rpx; margin-right: 4rpx; } .Msg_con { font-size: 26rpx; color: #222222; margin-top: 30rpx; } .Msg_con_img { display: flex; flex-wrap: wrap; width: 100%; margin-top: 15rpx; gap: 15rpx; } .Msg_con_img image { width: calc(33% - 11rpx); height: 225rpx; flex-shrink: 0; } .Msg_con_video { width: calc(33.33% - 11rpx); height: 225rpx; flex-shrink: 0; } .Msg_iconList_leftIcon { display: flex; align-items: center; font-size: 22rpx; color: #999999; margin-right: 30rpx; } .Msg_iconList_leftIcon image { width: 30rpx; /* height: 30rpx; */ margin-right: 10rpx; } .Msg_iconList { display: flex; align-items: center; justify-content: space-between; margin-top: 30rpx; } .Msg_iconList_left { display: flex; align-items: center; } .Msg_iconList_right { display: flex; align-items: center; font-size: 26rpx; color: #999999; } .Msg_iconList_right div { margin-left: 10rpx; } .mb32 { margin-bottom: 32rpx; } /* 优惠劵样式 */ .coupon_container { display: flex; align-items: center; overflow-x: auto; padding: 20rpx 0; gap: 20rpx; } .coupon { flex-shrink: 0; display: flex; align-items: center; justify-content: space-between; width: auto; height: 100rpx; background: linear-gradient(91deg, #FF7658 0%, #FF370B 100%); border-radius: 10rpx; padding: 0 20rpx; position: relative; overflow: hidden; color: #fff; } .coupon_used1 { background: #ffece7; border: 1rpx solid #FF5757; color: #ff3a0d; } .coupon_amount { font-size: 36rpx; font-weight: bold; } .coupon_condition { font-size: 30rpx; margin-left: 10rpx; } .coupon_status { width: 60rpx; height: 40rpx; line-height: 40rpx; font-weight: bold; text-align: center; } .more_coupon { flex-shrink: 0; display: flex; align-items: center; gap: 8rpx; color: #FF370B; font-size: 30rpx; position: sticky; right: 0; left: 750rpx; z-index: 1000; background-color: #fff; height: 122rpx; padding: 0 20rpx; border-left: 1rpx solid #cccc; } .more_text { width: 70rpx; font-weight: bold; } /* 优惠详情弹窗样式 */ .coupon_popup { width: 100%; height: 100%; background: white; border-radius: 20rpx; overflow: hidden; } .popup_header { display: flex; justify-content: space-between; align-items: center; padding: 30rpx; border-bottom: 1rpx solid #E6E6E6; } .popup_title { font-size: 32rpx; font-weight: bold; color: #333333; } .popup_close { font-size: 28rpx; color: #999999; } .popup_content { padding: 30rpx; } .coupon_item { display: flex; align-items: center; justify-content: space-between; padding: 20rpx; background: white; border-radius: 10rpx; box-shadow: 0 2rpx 10rpx rgba(0, 0, 0, 0.05); margin-bottom: 20rpx; } .coupon_item_left { background: #FF5757; padding: 20rpx; border-radius: 10rpx; color: white; text-align: center; min-width: 160rpx; } .coupon_item_amount { font-size: 36rpx; font-weight: bold; margin-bottom: 8rpx; } .coupon_item_condition { font-size: 20rpx; opacity: 0.9; } .coupon_item_center { flex: 1; padding: 0 20rpx; } .coupon_item_name { font-size: 28rpx; font-weight: bold; color: #333333; margin-bottom: 8rpx; } .coupon_item_expire { font-size: 22rpx; color: #999999; } .coupon_item_right { margin-left: 20rpx; } .coupon_item_button { width: 120rpx; height: 60rpx; line-height: 60rpx; text-align: center; background: #FF370B; color: white; border: none; border-radius: 30rpx; font-size: 24rpx; font-weight: bold; padding: 0; margin: 0; } .coupon_item_button::after { border: none; }