*{margin: 0;padding: 0;border: 0;list-style: none;text-decoration: none;color: inherit;font-weight: normal;font-family: "微软雅黑";box-sizing: border-box;font-style: normal;}
body{width: 100%;overflow-x: hidden;}
img{vertical-align: middle;max-width: 100%;}
a:hover,a:active,a:visited,a:link,a:focus{-webkit-tap-highlight-color: transparent;outline:none;text-decoration: none;
}
.nav-bar{position: relative;height: .88rem;line-height: .88rem;width: 100%;text-align: center;font-size: .36rem;color: #333333;}
.nav-bar .back{background: url(../images/left-arrow-white.png) center left no-repeat;position: absolute;top: 0;left: .33rem;height: 100%;display: inline-block;background-size: .18rem .32rem;width: .5rem;height: 100%;}
/*主体*/
.container{padding: .5rem .3rem;}
.container h2{font-size: .32rem;color: #000;}
.quick-pay{width: 100%;height: auto;overflow: hidden;padding: .62rem 0;}
.quick-pay ul{display: flex;}
.quick-pay ul li{width: 1.4rem;height: .8rem;line-height: .8rem;background: #e0e6e9;color: #333333;font-size: .28rem;text-align: center;margin: 0 .14rem;border-radius: .05rem;}
.quick-pay ul li.active{background: #008aff;color: #FFFFFF;}
.other-pay{padding-top: .3rem;padding-bottom: .62rem;}
.other-pay input{display: inline-block;width: 2.55rem;height: .8rem;line-height: .8rem;padding-left: .3rem;font-size: .52rem;color: #333333;border-bottom: .03rem solid #f2f2f2;outline: none;}
.pay-type{padding-top: .62rem;}
.pay-type ul{display: flex;flex-direction: column;padding: 0 .1rem;overflow: visible;}
.pay-type ul li{display: flex;justify-content: space-between;align-items: center;height: 1.05rem;width: 100%;border: 2px solid #e0e0e0;border-radius: 1.05rem;font-size: .28rem;color: #333333;padding-left: .40rem;padding-right: .45rem;margin-bottom: .35rem;position: relative;overflow: visible;}
.pay-type ul li.is-rec{margin-top: .12rem;}
.pay-type ul li span sup{display: inline-block;background: #ff6767;font-size: .2rem;padding: .02rem .05rem;border-radius: .08rem .08rem .08rem 0;color: #FFFFFF;margin-left: .08rem;}
.pay-type ul li .type{display: flex;align-items: center;height: 100%;}
.pay-type ul li .type i{display: inline-block;width: .85rem;height: 100%;background: url(../images/icon-wxpay.png) center center no-repeat;background-size: .45rem .40rem;}
.pay-type ul li i.check{display: inline-block;width: .85rem;height: 100%;background: url(../images/icon-checked.png) right center no-repeat;background-size: .31rem .31rem;}
.pay-type ul li .type i.wx{background: url(../images/icon-wxpay.png) left center no-repeat;background-size: .45rem .40rem;}
.pay-type ul li .type i.ali{background: url(../images/icon-alipay.png) left center no-repeat;background-size: .47rem .38rem;}
.pay-type ul li .type i.ysf{background: url(../images/icon-ysf.png) left center no-repeat;background-size: .47rem .38rem;}
.pay-type ul li .type i.bank{background: url(../images/icon-bank.png) left center no-repeat;background-size: .56rem .35rem;}
.pay-type ul li .type i.yj{background: url(../images/icon-yj.png) left center no-repeat;background-size: .45rem .40rem;}
.pay-type ul li .type i.lxkf2{background: url(../images/lxkf2.png) left center no-repeat;background-size: .45rem .40rem;}
.pay-type ul li .type i.ka{background: url(../images/ka.png) left center no-repeat;background-size: .45rem .40rem;}
.pay-type ul li.active{border-color: #158ae3;color: #158ae3;}
.pay-type ul li.active .type i.wx{background-image: url(../images/icon-wxpay-active.png);}
.pay-type ul li.active .type i.ali{background-image: url(../images/icon-alipay-active.png);}
.pay-type ul li.active .type i.ysh{background-image: url(../images/icon-ysf.png);}
.pay-type ul li.active .type i.bank{background-image: url(../images/icon-bank-active.png);}
.pay-type ul li.active .type i.yj{background-image: url(../images/icon-yj-active.png);}
.pay-type ul li.active .type i.lxkf2{background-image: url(../images/lxkf2.png);}
.pay-type ul li.active .type i.ka{background-image: url(../images/ka.png);}
.pay-type ul li.active i.check{background-image: url(../images/icon-checked-active.png);}
.pay-type .more{text-align: center;font-size: .24rem;color: #a6a6a6;padding-bottom: 1.2rem;}
.pay-type ul li.hidden{display: none;}
/*底部*/
.money{width: 100%;height: 1.2rem;display: flex;justify-content: space-between;align-items: center;padding: 0 .3rem;background: #FFFFFF;}
.money p{display: flex;align-items: center;font-size: .28rem;color: #000;}
.money p span{padding-left: .35rem;font-size: .36rem;color: #fe403c;font-weight: bold;}
.money p span i{font-weight: bold;}
.money button{height: .68rem;line-height: .68rem;text-align: center;font-size: .32rem;color: #FFFFFF;letter-spacing: .02rem;border-radius: .2rem;outline: none;display: inline-block;width: 100%;background: red;width: 100%;flex-shrink: 0;}

/* 支付方式推荐角标：贴在卡片右上边 */
.pay-type ul li,
.detail-pay ul li{
  position: relative;
  overflow: visible;
}
.pay-type ul li.is-rec,
.detail-pay ul li.is-rec{
  border-color: #ff7a18 !important;
}
.pay-rec{
  position: absolute;
  top: -0.18rem;
  right: 0.35rem;
  z-index: 3;
  display: inline-block;
  margin: 0;
  padding: 0.04rem 0.16rem;
  font-size: 0.22rem;
  font-style: normal;
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0.02rem;
  color: #fff;
  background: linear-gradient(135deg, #ff8a1a 0%, #ff3b30 100%);
  border-radius: 0.16rem 0.16rem 0.16rem 0.06rem;
  box-shadow: 0 0.04rem 0.12rem rgba(255, 59, 48, .4);
  pointer-events: none;
  white-space: nowrap;
}
