﻿.ui-bank li.on:before, .ui-money li.on:before {
	background:url(/skin/img/payicons.png) no-repeat 0 0
}
.m-pay-body {
	position:relative;
	margin:30px auto;
	background:#fff;
	min-height:640px
}
.m-pay-body:before {
	display:block!important;
	position:absolute;
	right:0;
	top:0;
	bottom:0;
	width:550px;
	background:#fcfcfc;
	border-left:1px solid #f3f3f3;
	z-index:1
}
.m-pay-body>.section {
	float:left;
	width:650px
}
.m-pay-body>.aside {
	position:relative;
	float:right;
	width:550px;
	z-index:2
}
.m-pay-body.welfare-hide:before {
	content:none
}
.m-pay-body.welfare-hide>.aside {
	display:none
}
.pay-option {
	width:560px;
	overflow:hidden;
	font-size:0;
	margin:10px 0;
	padding-bottom:2px
}
.pay-option a {
	position:relative;
	display:inline-block;
	margin-right:5px;
	padding:10px 20px 10px 55px;
	font-size:17px;
	border:1px solid #e3e3e3;
	border-bottom:0
}
.pay-option a i {
	position:absolute;
	top:0;
	left:15px;
	bottom:0;
	margin:auto;
	width:30px;
	height:30px;
	font-size:30px;
	line-height:30px;
	text-align:center
}
.pay-option a:hover {
	background:#f9f9f9;
	text-decoration:none
}
.pay-option a.on:after {
	content:'';
	position:absolute;
	left:50%;
	margin-left:-500px;
	bottom:-2px;
	width:1200px;
	height:2px;
	background:#e3e3e3
}
.pay-option a.on i:before {
	color:#fff
}
.pay-option a.i1.on, .pay-option a.i1.on:after {
	background:#51c332;
	border-color:#51c332;
	color:#fff
}
.pay-option a.i2.on, .pay-option a.i2.on:after {
	background:#0fa2e7;
	border-color:#0fa2e7;
	color:#fff
}
.pay-option a.i3.on, .pay-option a.i3.on:after {
	background:#ab6db9;
	border-color:#ab6db9;
	color:#fff
}
.pay-check {
	padding:10px 15px;
	width:440px;
	border:1px solid #d4f2aa;
	background:#f3ffe2;
	line-height:28px
}
.pay-check em {
	font-size:20px
}
.pay-main {
	padding:40px 10px 50px 40px
}
.pay-main-header {
	margin-bottom:30px;
	font-size:28px
}
.ui-money {
	width:480px
}
.ui-money li {
	position:relative;
	float:left;
	border:1px solid #e3e3e3;
	border-radius:4px;
	margin-right:10px;
	margin-bottom:10px;
	width:16%;
	height:40px;
	line-height:40px;
	text-align:center;
	cursor:pointer
}
.ui-money li input {
	width:100%;
	text-align:center;
	border:0;
	height:30px;
	line-height:30px;
	background:0;
	cursor:pointer;
	outline:0
}
.ui-money li:hover, .ui-money li.on {
	border-color:#ff9703
}
.ui-money li.on:before {
	content:"";
	position:absolute;
	bottom:0;
	right:0;
	width:21px;
	height:21px;
	background-position:-129px -40px
}
.ui-way li {
	width:30%;
	font-size:15px
}
.ui-way li i {
	font-size:18px;
	vertical-align:baseline;
	margin-bottom:0
}
.ui-way li.on {
	color:#ff9703
}
.pay-welfare {
	padding-top:30px
}
.pay-welfare-hd h3 {
	margin:20px 0 40px;
	padding-left:20px;
	border-left:4px solid #ffd900;
	font-size:30px;
	line-height:1
}
.pay-welfare .m-tab-hook {
	margin:0 30px;
	font-size:0;
	border-bottom:2px solid #f30
}
.pay-welfare .m-tab-hook li {
	position:relative;
	display:inline-block;
	margin-right:2px;
	padding:5px 35px;
	text-align:center;
	font-size:20px;
	border:1px solid #e3e3e3;
	border-bottom:0;
	cursor:pointer
}
.pay-welfare .m-tab-hook li:hover {
	background-color:#f9f9f9
}
.pay-welfare .m-tab-hook li.z-underway:before {
	content:'';
	position:absolute;
	left:50%;
	top:-15px;
	width:75px;
	height:25px;
	background:url(/skin/img/g-underway.gif) no-repeat
}
.pay-welfare .m-tab-hook li.z-czlast:before{content:'';position:absolute;left:50%;top:-15px;width:90px;height:25px;background:url(../img/czlast_icon.gif) no-repeat}
.pay-welfare .m-tab-hook li.cur, .pay-welfare .m-tab-hook li.cur:hover {
	background-color:#f30;
	border-color:#f30;
	color:#fff
}
.pay-welfare .m-tab-panel {
	padding:20px 30px
}
.m-tab-panel .tab-pane {
	display:none
}
.m-tab-panel .tab-pane.cur {
	display:block
}
.f-pay {
	width:340px;
	display:block;
	opacity:1
}
.f-pay-body p {
	margin:auto;
	width:240px;
	color:#999;
	text-align:left
}
.f-pay-body {
	padding-bottom:40px
}
.f-pay-body .account {
	font-size:24px;
	color:#f90
}
.f-pay-body .number {
	color:#333
}
.f-pay-body .qrcode img {
	display:block;
	width:240px;
	height:240px;
	margin:10px auto
}
.f-pay-wechat:before {
	background:#51c332
}
.f-pay-wechat .layer-close:hover {
	background:linear-gradient(rgba(81, 195, 50, 1), rgba(81, 195, 50, 0))
}
.f-pay-wechat .tc-way {
	color:#51c332
}
.f-pay-alipay:before {
	background:#0fa2e7
}
.f-pay-alipay .layer-close:hover {
	background:linear-gradient(rgba(15, 162, 231, 1), rgba(15, 162, 231, 0))
}
.f-pay-alipay .tc-way {
	color:#0fa2e7
}
.f-pay-wechat .f-dialog-footer .btn, .f-pay-alipay .f-dialog-footer .btn {
	display:none
}
.pay-result {
	position:relative;
	margin:auto 30px;
	padding:40px
}
.pay-result>.icon {
	float:left;
	font-size:64px;
	margin-right:15px;
	line-height:1
}
.pay-result>.msg {
	margin-bottom:40px;
	padding-top:5px;
	line-height:1.7
}
.pay-result>.msg>h3 {
	font-size:20px
}
.pay-result>.details>table {
	margin:10px auto 20px;
	width:100%;
	border:1px solid #ddd
}
.pay-result>.details>table td {
	padding:8px 15px;
	border:1px solid #eee
}
.pay-result>.details>table td.tag {
	width:30%;
	color:#999
}
.pay-result>.bar {
	margin-top:30px;
	text-align:center
}
.pay-result>.bar .btn {
	width:120px;
	padding:5px 0;
	margin-right:15px
}
.m-welfare {
	padding-left:0
}
.m-welfare:before {
	content:none
}
.m-welfare .block-hd {
	margin:10px 0 0;
	padding-bottom:15px;
	background:0
}
