body { background-color: #eeeff1; height: 100%; font-size: 14px; } header { background-color: #ffffff; -webkit-box-shadow: 0 0 10px rgba(49, 49, 49, 0.3); -moz-box-shadow: 0 0 10px rgba(49, 49, 49, 0.3); box-shadow: 0 0 10px rgba(49, 49, 49, 0.3); padding: 20px 0; } .pay-main { margin-top: 30px; background-color: #ffffff; padding: 30px 20px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .pay-main .pay-main-head { border-bottom: 1px dotted #e9e9e9; padding-bottom: 20px; } .pay-main .pay-main-head .pay-order-info > ul { margin-bottom: 10px; } .pay-main .pay-main-head .pay-order-info > ul > li { display: inline-block; } .pay-main .pay-main-head .pay-order-info > .pay-order-money { margin-right: 100px; font-size: 20px; color: #ff822a; margin-top: 10px; } .pay-main .pay-main-body { padding-top: 30px; } .pay-tab .pay-tab-head { border-bottom: 1px solid #dddddd; } .pay-tab .pay-tab-head > ul { position: relative; bottom: -1px; } .pay-tab .pay-tab-head > ul > li { display: inline-block; width: 200px; text-align: center; padding-bottom: 20px; } .pay-tab .pay-tab-head > ul > li.active { border-bottom: 1px solid #05cdca; } .pay-tab .pay-tab-head > ul > li.active > a { color: #05cdca; cursor: default; } .pay-tab .pay-tab-head > ul > li > a { padding: 7px 15px; } .pay-tab .pay-tab-head > ul > li > a:hover { background-color: #f5f5f5; border: 1px solid #e3e3e3; } .pay-tab .pay-tab-head > ul > li.active > a:hover { border: none; background: none; } .pay-tab .pay-tab-body { padding: 30px; } .pay-tab .pay-tab-body .balance-panel .pay-password { margin-top: 20px; position: relative; margin-bottom: 20px; } .pay-tab .pay-tab-body .balance-panel .pay-password:before { display: inline-block; content: ""; width: 35px; height: 35px; position: absolute; left: 213px; bottom: 5px; z-index: 999; background-color: #ffffff; } .pay-tab .pay-tab-body .balance-panel .pay-password > ul { margin: 5px 0; display: inline-block; } .pay-tab .pay-tab-body .balance-panel .pay-password > ul > li { display: inline-block; width: 35px; height: 35px; border: 1px solid #dedede; float: left; border-left: none; } .pay-tab .pay-tab-body .balance-panel .pay-password > ul > li.first { border-left: 1px solid #dedede; } .pay-tab .pay-tab-body .balance-panel .pay-password .pay-forget-pass { background-color: #fff; top: -16px; padding: 10px; z-index: 201; position: relative; } .pay-tab .pay-tab-body .balance-panel .pay-password .pay-forget-pass:hover { color: #05cdca; } .pay-tab .pay-tab-body .balance-panel .pay-password .password-text { position: absolute; left: 0px; top: 25px; height: 35px; width: 245px; background: rgba(255, 255, 255, 0); letter-spacing: 30px; text-indent: 15px; } .pay-tab .pay-tab-body .alipay-panel .pay-alipay { width: 142px; height: 58px; border: 1px solid #05cdca; margin-bottom: 30px; } .pay-tab .pay-tab-body .weixin-panel .qr-box { margin: 0 auto; width: 250px; padding: 10px; -webkit-box-shadow: 0 0 10px rgba(49, 49, 49, 0.3); -moz-box-shadow: 0 0 10px rgba(49, 49, 49, 0.3); box-shadow: 0 0 10px rgba(49, 49, 49, 0.3); text-align: center; font-size: 12px; } .pay-tab .pay-tab-body .weixin-panel .qr-box > .weixin-qr { display: block; margin: 0 auto; } .pay-tab .pay-tab-body .weixin-panel .qr-box > .weixin-already { border: 1px solid #dbdbdb; padding: 2px 5px; color: #05cdca; } .pay-tab .pay-tab-body .company-panel .bank-panel { width: 500px; } .pay-tab .pay-tab-body .company-panel .bank-panel .bank-head { background-color: #f3f3f3; padding: 10px 20px; } .pay-tab .pay-tab-body .company-panel .bank-panel .bank-body { border: 1px solid #f2f2f2; padding: 10px 5px; } .pay-tab .pay-tab-body .company-panel .bank-panel .bank-body .bank-img { margin-bottom: 10px; } .pay-tab .pay-tab-body .company-panel .bank-hand-list { padding: 20px 0 0; } .pay-tab .pay-tab-body .company-panel .bank-hand-list .comapny-already { margin: 0 5px 0 0; } .pay-button { padding: 8px 14px; -webkit-border-radius: 3px; -moz-border-radius: 3px; border-radius: 3px; } .pay-button.default { background-color: #05cdca; color: #ffffff; } .pay-button.none-bg { border: 1px solid #dbdbdb; } .pay-button.default:hover { background-color: #1aa5a2; } .pay-input-text { border: 1px solid #dedede; width: 200px; height: 36px; text-indent: 5px; } .pay-type { display: inline-block; content: ""; width: 20px; height: 20px; background-image: url(/static/image/pay/pay-icon.png); background-repeat: no-repeat; position: relative; margin-right: 5px; } .pay-type.weixin { background-position: -103px -5px; top: 5px; } .pay-type.alipay { background-position: -173px -5px; top: 7px; } .pay-type.balance { background-position: -148px -5px; top: 5px; } .pay-type.company { background-position: -129px -5px; top: 5px; } .pay-type.safe { background-position: -35px -5px; top: 3px; } .pay-type.leter { background-position: -7px -5px; top: 3px; margin-left: 10px; } .pay-mask { width: 100%; height: 100%; position: absolute; top: 0; left: 0; z-index: 998; } .pay-mask .pay-dialog { width: 370px; margin: 20% auto 0; background-color: #ffffff; -webkit-box-shadow: 0 0 10px rgba(49, 49, 49, 0.3); -moz-box-shadow: 0 0 10px rgba(49, 49, 49, 0.3); box-shadow: 0 0 10px rgba(49, 49, 49, 0.3); padding: 5px; } .pay-mask .pay-dialog .dialog-head .head-close { display: inline-block; content: ""; width: 30px; height: 30px; background-image: url(/static/image/pay/pay-icon.png); background-repeat: no-repeat; position: relative; margin-right: 5px; background-position: -64px 0px; } .pay-mask .pay-dialog .dialog-body { padding: 30px 10px 30px; text-align: center; } .pay-text-center { text-align: center; } .pay-text-right { text-align: right; } .pay-text-left { text-align: left; } .none { display: none !important; } .pay-font-blue { color: #05cdca; } .pay-font-yellow { color: #ff5e03; } .pay-block { display: block !important; } .pay-ml-sm { margin-left: 10px; } .pay-mt-xs { margin-top: 5px; } /*锟斤拷锟街э拷锟�*/ .tj-alipay { position: relative; margin:20px 0; } .tj-alipay > p{ margin-bottom: 5px; font-size: 14px; } .tj-alipay > .move { background-color: #ffffff; position: absolute; top: 25px; left: -1px; display: none; width: 31px; } .tj-alipay > .move.keyup { background: url(/static/image/pay/T1nYJhXalXXXXXXXXX.gif) center center no-repeat; display: block; border: 1px solid rgba(82, 168, 236, .8); box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075), 0 0 8px rgba(82, 168, 236, 0.6); } .tj-alipay > ul { border-right: 1px solid #dedede; margin: 0; padding: 0; } .tj-alipay > ul, .tj-alipay > ul > li { display: inline-block; } .tj-alipay > ul > li { border-top: 1px solid #dedede; border-bottom: 1px solid #dedede; border-left: 1px solid #dedede; border-right: none; float: left; width: 29px; } .tj-alipay > ul > li.input { background: url(/static/image/pay/T1sl0fXcBnXXXXXXXX.png) center center no-repeat; } .tj-alipay > .move, .tj-alipay > ul > li { height: 29px; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; } .tj-alipay > .pass { position: absolute; left: 0; height: 28px; width: 174px; opacity: 0; filter: alpha(opacity=0); cursor: default; } /* 微锟斤拷支锟斤拷锟斤拷锟斤拷锟斤拷 */ #wechat-pay-layer .pay-layer { position: fixed; top: 0; left: 0; right: 0; bottom: 100%; z-index: 11; overflow: hidden; } #wechat-pay-layer .pay-layer.show { bottom: 0; } #wechat-pay-layer .pay-layer .box { position: absolute; left: 0; bottom: 0; box-sizing: border-box; width: 100%; padding: 0 1.5rem 3rem; background: #fff; font-size: 1.6rem; color: #333; -webkit-transition: all .4s ease; -moz-transition: all .4s ease; -o-transition: all .4s ease; transition: all .4s ease; -webkit-transform: translate3d(0, 100%, 0); -moz-transform: translate3d(0, 100%, 0); -o-transform: translate3d(0, 100%, 0); transform: translate3d(0, 100%, 0); } #wechat-pay-layer .pay-layer.show .box { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); } #wechat-pay-layer .pay-layer .titbox { border-bottom: .1rem solid #edf0f0; font-size: 1.6rem; color: #333; line-height: 4.5rem; text-align: center; } #wechat-pay-layer .pay-layer .icon { position: absolute; top: .3rem; right: 1.5rem; font-size: 3rem; line-height: 1; color: #999; cursor: pointer; } #wechat-pay-layer .pay-layer .label { width: auto; line-height: 3rem; color: #666; } #wechat-pay-layer .pay-layer span { line-height: 3rem } #wechat-pay-layer .pay-layer .text { box-sizing: border-box; width: 50%; height: 3rem; padding: 0 .5rem; border: .1rem solid #e1e1e1; border-radius: .4rem; } #wechat-pay-layer .pay-layer .txtbox { padding: 1rem 0; } #wechat-pay-layer .pay-layer .btn { display: block; width: 9rem; height: 3rem; margin: 2rem auto 0; border-radius: .4rem; background: #00cdcb; font-size: 1.6rem; text-align: center; color: #fff; line-height: 3rem; } #wechat-pay-layer .pay-layer .select-box { padding-top: 1.5rem; } #wechat-pay-layer .pay-layer .pay-btn { display: block; height: 4rem; margin: 1.5rem 2rem 0; border-radius: .2rem; text-align: center; color: #fff; line-height: 4rem; font-size: 1.4rem } #wechat-pay-layer .pay-layer .wechat-payment { background: #04bb02; } #wechat-pay-layer .pay-layer .surplus-payment { background: #4293d1; } #wechat-pay-layer .surplus-pay-layer .titbox { margin-bottom: 1.5rem } #wechat-pay-layer .surplus-pay-layer .label { float: left; } #wechat-pay-layer .surplus-pay-layer .pasword-text-box { margin-left: 8rem; margin-right: 1rem } #wechat-pay-layer .surplus-pay-layer .pasword-text-box .text { width: 100%; box-sizing: border-box }