/* pages/cashier_pay/cashier_pay.wxss */ page { position: inherit; background: #fff; } .goodsinfo .cashier .header { margin: 60rpx auto; display: flex; justify-content: center; } .goodsinfo .cashier .header .img { width: 80rpx; height: 80rpx; border-radius: 40rpx; overflow: hidden; margin-right: 20rpx; } .goodsinfo .cashier .header .img image { width: 100%; height: 100%; } .goodsinfo .cashier .header .span { line-height: 80rpx; font-size: 32rpx; font-weight: bold; } .goodsinfo .cashier .pay { width: 660rpx; line-height: 160rpx; background: #fff; border: solid 2rpx #999; border-radius: 12rpx; margin: 0 auto; padding: 0 28rpx; display: flex; justify-content: space-between; box-sizing: border-box; } .goodsinfo .cashier .pay .span:first-child { line-height: 160rpx; font-size: 32rpx; color: #8c8c8c; } .goodsinfo .cashier .pay .span:last-child { font-size: 72rpx; max-width: 416rpx; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; } .goodsinfo .cashier .pay .span:last-child icon { font-size: 32rpx; } .goodsinfo .cashier .btn { background: #fff; position: absolute; bottom: 0; left: 0; } .goodsinfo .cashier .btn .btn_box { border-top: solid 2rpx #ccc; } .goodsinfo .cashier .btn .btn_box .line_one { display: flex; } .goodsinfo .cashier .btn .btn_box .line_one .button { width: 186rpx; height: 126rpx; font-size: 72rpx; background: none; color: #333; border-radius: 0; padding: 0; border-right: solid 2rpx #ccc; display: flex; justify-content: center; align-items: center; overflow: hidden; } .goodsinfo .cashier .btn .btn_box .line_one .button icon { font-size: 96rpx; color: #666; } .goodsinfo .cashier .btn .btn_box .btn_bottom .line_two_1 { display: flex; } .goodsinfo .cashier .btn .btn_box .btn_bottom .line_two_1 .line-left .line_box .line_two { display: flex; border-top: solid 2rpx #ccc; } .goodsinfo .cashier .btn .btn_box .btn_bottom .line_two_1 .line-left .line_box .line_two .button { width: 186rpx; height: 126rpx; font-size: 72rpx; background: none; color: #333; border-radius: 0; padding: 0; border-right: solid 2rpx #ccc; display: flex; justify-content: center; align-items: center; } .goodsinfo .cashier .btn .btn_box .btn_bottom .line_two_1 .line-left .line_box .line_three { border-top: solid 2rpx #ccc; display: flex; } .goodsinfo .cashier .btn .btn_box .btn_bottom .line_two_1 .line-left .line_box .line_three .button { width: 186rpx; height: 126rpx; font-size: 72rpx; background: none; color: #333; border-radius: 0; padding: 0; border-right: solid 2rpx #ccc; display: flex; justify-content: center; align-items: center; } .goodsinfo .cashier .btn .btn_box .btn_bottom .line_two_1 .line-left .line_box .line_four { display: flex; border-top: solid 2rpx #ccc; } .goodsinfo .cashier .btn .btn_box .btn_bottom .line_two_1 .line-left .line_box .line_four .button { width: 186rpx; height: 126rpx; font-size: 72rpx; background: none; color: #333; border-radius: 0; padding: 0; border-right: solid 2rpx #ccc; display: flex; justify-content: center; align-items: center; } .goodsinfo .cashier .btn .btn_box .btn_bottom .line_two_1 .line-left .line_box .line_four .button .span { width: 60rpx; height: 60rpx; text-align: center; line-height: 60rpx; font-size: 48rpx; font-weight: bold; } .goodsinfo .cashier .btn .btn_box .btn_bottom .line_two_1 .line-right .button { width: 188rpx; height: 384rpx; padding: 0; border-radius: 0; font-size: 36rpx; display: flex; flex-direction: column; align-items: center; justify-content: center; background-color: #04be02; color: #fff; } .pay-psw-info { overflow-y: scroll; width: 100vw; height: auto; background: #fff; max-height: 80vh; padding-top: 20rpx; } .pay_content_title { text-align: center; width: 100vw; height: 60rpx; line-height: 60rpx; margin-bottom: 20rpx; font-size: 36rpx; } .pay_content { width: 100vw; height: 100rpx; margin-bottom: 20rpx; } .pay_content_view { width: 100vw; height: 100rpx; border-bottom: 2rpx solid #ddd; border-top: 2rpx solid #ddd; border-right: 2rpx solid #ddd; display: flex; flex-wrap: wrap; box-sizing: border-box; overflow: hidden; } .ipt_pay { width: 16.27%; height: 100rpx; text-align: center; border-left: 2rpx solid #ddd; display: flex; align-items: center; justify-content: center; } .ipt_pay_p { line-height: 50rpx; height: 50rpx; font-size: 40rpx; } .footer { width: 100vw; font-weight: 600; } .pay_btn { border-top: 2rpx solid #ddd; width: 100vw; height: auto; display: flex; flex-wrap: wrap; } .pay_btn .li { width: 33%; height: 96rpx; line-height: 96rpx; text-align: center; background: #fff; font-size: 28rpx; border-right: 2rpx solid #ddd; border-bottom: 2rpx solid #ddd; } .pay_btn .li.b9:active { background: #fff; } .pay_btn .li.b9 { background: #c2c2c2; } .msgbox { padding: 10rpx; } .goodsinfo .cashier .popup { background: #f5f5f5; min-height: 100vh; } .goodsinfo .cashier .popup .text_box { position: fixed; top: 0; z-index: 10; background: #fff; width: 100%; height: 80rpx; line-height: 80rpx; border-bottom: solid 2rpx #ebebeb; display: flex; align-items: center; justify-content: center; } .goodsinfo .cashier .popup .text_box .span { font-weight: bold; font-size: 15px; color: #666; } .goodsinfo .cashier .popup .text_box icon { position: absolute; line-height: 80rpx; font-size: 32rpx; color: #999; left: 20rpx; } .popup_pay { margin-top: 100rpx; background: #fff; text-align: center; padding: 20rpx 0; } .popup_pay .li:first-child { color: #8c8c8c; font-size: 32rpx; line-height: 80rpx; } .popup_pay .li:last-child .span:first-child { font-size: 32rpx; } .popup_pay .li:last-child .span:last-child { font-size: 72rpx; } .tbs { display: flex; flex-direction: column; align-items: center; background: #fff; flex-flow: row wrap; padding: 20rpx; line-height: 48rpx; font-size: 28rpx; } .tbs .list { width: 100%; padding-bottom: 20rpx; } .tbs .listflex { display: flex; justify-content: space-between; align-items: center; } .tbs .listflex2 { flex-direction: column; } .tbs .list:nth-last-child(1) { padding-bottom: 0; } .tbs .score { display: flex; width: 100%; justify-content: space-between; align-items: center; } .tbs .score .left { flex: 1; align-self: center; } .tbs .score .right { align-self: center; } .tbs .left { text-align: left; color: #858585; } .tbs .left .span { font-size: 28rpx; } .tbs .right { text-align: right; } .tbs .right .font { color: #e84e40; } .tbs.coupon-list { margin-top: 20rpx; margin-bottom: 20rpx; } .tbs.coupon-list .couponss .left { font-size: 32rpx; color: #333; } .couponss.list .left .span { color: #fff; background: #f15353; font-size: 24rpx; height: 40rpx; padding: 8rpx 10rpx; border-radius: 6rpx; margin-left: 10rpx; } .couponss.list .right .font .span { font-size: 24rpx; } .couponss.list .right .font icon { font-size: 24rpx; color: #999; } .goodsinfo .agreement { background: #fff; padding: 0 16rpx; text-align: left; display: flex; align-items: center; margin-bottom: 20rpx; } .goodsinfo .agreement .span { color: red; line-height: 60rpx; } .goodsinfo .cashier .popup .popup_btn { padding-bottom: 40rpx; } .goodsinfo .cashier .popup .popup_btn .text { display: block; line-height: 80rpx; padding-left: 40rpx; font-size: 32rpx; text-align: left; font-weight: bold; color: #666; } .goodsinfo .cashier .popup .popup_btn .button { width: 650rpx; padding: 0 20rpx; display: flex; justify-content: flex-start; align-items: center; height: 84rpx; border-radius: 12rpx; background: #fff; border: solid 2rpx #dedede; margin: 0 auto 20rpx; } .goodsinfo .cashier .popup .popup_btn .button .icon_bg { width: 72rpx; height: 48rpx; border-radius: 6rpx; line-height: 48rpx; display: flex; align-items: center; justify-content: center; } .goodsinfo .cashier .popup .popup_btn .button .span { color: #333; font-size: 32rpx; margin-left: 20rpx; } .goodsinfo .cashier .popup .popup_btn .button .icon_bg icon { color: #fff; font-size: 48rpx; } .goodsinfo .coubtngroup { display: flex; font-size: 28rpx; text-align: center; } .goodsinfo .coubtngroup .sure { background: #f15353; height: 80rpx; line-height: 80rpx; color: #fff; width: 50%; } .goodsinfo .coubtngroup .close { background: #eee; height: 80rpx; line-height: 80rpx; color: #333; width: 50%; } .goodsinfo .add-info { overflow-y: scroll; width: 100%; background: #fff; max-height: 50vh; padding-top: 20rpx; } .goodsinfo .add-info .coupon-list-info { width: 99.5vw; display: flex; align-items: center; } .goodsinfo .add-info .checkList { padding-left: 6rpx; margin-right: 20rpx; display: flex; justify-content: center; align-items: center; } .goodsinfo .add-info .coupon_voucher_gray { flex: 1; height: 160rpx; margin-right: 20rpx; margin-bottom: 20rpx; display: flex; } .goodsinfo .add-info .coupon_voucher_main { flex: 1; height: 160rpx; margin-right: 20rpx; margin-bottom: 20rpx; display: flex; } .goodsinfo .add-info .coupon_voucher_main .coupon_voucher_left { width: 204rpx; height: 100%; color: #fff; border-radius: 8rpx 0 0 8rpx; text-align: center; display: flex; flex-direction: column; justify-content: center; background-color: #47c1c4; } .goodsinfo .add-info .coupon_voucher_gray .coupon_voucher_left { width: 204rpx; height: 100%; color: #fff; border-radius: 8rpx 0 0 8rpx; text-align: center; display: flex; flex-direction: column; justify-content: center; background-color: #ccc; } .goodsinfo .add-info .coupon_voucher_main .coupon_voucher_left .coupon_voucher_amount.type_large { margin: 0; font-size: 44rpx; } .goodsinfo .add-info .coupon_voucher_gray .coupon_voucher_left .coupon_voucher_amount.type_large { margin: 0; font-size: 44rpx; } .goodsinfo .add-info .coupon_voucher_main .coupon_voucher_left .coupon_voucher_limit { font-size: 24rpx; margin-top: 26rpx; margin-bottom: 0; } .goodsinfo .add-info .coupon_voucher_gray .coupon_voucher_left .coupon_voucher_limit { font-size: 24rpx; margin-top: 26rpx; margin-bottom: 0; } .goodsinfo .add-info .coupon_voucher_main .coupon_voucher_right { flex: 1; padding: 30rpx 30rpx 30rpx 20rpx; border-radius: 0 8rpx 8rpx 0; background-color: #e5f3f3; color: #666; } .goodsinfo .add-info .coupon_voucher_gray .coupon_voucher_right { flex: 1; padding: 30rpx 30rpx 30rpx 20rpx; border-radius: 0 8rpx 8rpx 0; background-color: #eee; color: #666; } .goodsinfo .add-info .coupon_voucher_main .coupon_voucher_right .coupon_voucher_range { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; font-size: 24rpx; text-align: left; margin: 0; padding: 0; vertical-align: baseline; } .goodsinfo .add-info .coupon_voucher_gray .coupon_voucher_right .coupon_voucher_range { overflow: hidden; text-overflow: ellipsis; display: -webkit-box; -webkit-line-clamp: 2; font-size: 24rpx; text-align: left; margin: 0; padding: 0; vertical-align: baseline; } .coupon_voucher_main .coupon_voucher_right .coupon_voucher_period { color: #999; font-size: 24rpx; bottom: 0; } .coupon_voucher_main .coupon_voucher_gray .coupon_voucher_period { color: #999; font-size: 24rpx; bottom: 0; } .icon-pay_alipay { color: #29a1f7; } .icon-pay_quick { color: #46e0d1; } .icon-pay_yue { color: #ff7433; } .icon-pay_wechat { color: #09bb07; } .icon-pay_otherpay { color: #ffba00; } .icon-pay_remittance { color: #ff692f; } .icon-pay_utsd { color: #9000ff; } .icon-pay_prepay { color: #9000ff; } .icon-pay_default { color: #538ff9; } .icon-pay_cashondelivery { color: #ed3800; } .btna { margin: 0 30rpx; background: #fff; border-radius: 14rpx; overflow: hidden; margin-top: 30rpx; } .sureBtn { background: #ff5d5c; color: white; width: 85%; margin: 20rpx auto; padding: 14rpx; border-radius: 20rpx; text-align: center; font-size: 32rpx; } .btnaTitle { height: 90rpx; display: flex; justify-content: flex-start; align-items: center; font-size: 28rpx; color: rgba(248, 110, 110, 1); font-weight: normal; font-stretch: normal; } .btnaTitle text { width: 6rpx; height: 28rpx; background-color: rgba(248, 112, 112, 1); margin-right: 26rpx; } .btn-area { height: 90rpx; margin-right: 12rpx; margin-left: 8rpx; border-bottom: 1rpx solid rgba(241, 241, 241, 1); display: flex; justify-content: space-between; align-items: center; } .dBtn { position: relative; } .wrapper { display: flex; align-items: center; justify-content: center; width: 448rpx; height: 576rpx; background-color: #ff504c; } .wrapper .block { width: 448rpx; height: 576rpx; background-color: #ff504c; } .block image { width: 448rpx; height: 576rpx; } .start { transition: 1s; }