/* 基础重置和通用样式 */
a, a:hover { text-decoration: none }
img, input, select { vertical-align: middle }
.clear, .order-tr { clear: both }
a, b, blockquote, body, button, dd, div, dl, dt, em, fieldset, form, h1, h2, h3, h4, h5, h6, hr, html, i, iframe, img, input, label, legend, li, ol, p, pre, span, strong, table, tbody, td, textarea, tfoot, th, thead, tr, ul { margin: 0; padding: 0; border: 0; outline: 0 }
fieldset, hr, img { border: none }
body, button, input, select, textarea { font: 12px/1 "Microsoft Yahei", SimSun, Arial, "\5b8b\4f53", sans-serif }
address, cite, dfn, em, i, var { font-style: normal }
h1, h2, h3, h4, h5, h6 { font-size: 100%; font-weight: 400 }
ol, ul { list-style: none }
a { color: #3c3c3c }
a, button { cursor: pointer }
table { border-collapse: collapse; border-spacing: 0 }
.fl { float: left }
.fr { float: right }
.tc { text-align: center }
.tr { text-align: right }
.of { overflow: hidden }
.pr { position: relative }
.pa { position: absolute }
.bold { font-weight: 700 }
.hide { display: none }
.show { display: block }
.clearfix { *zoom: 1 }
.clearfix:after { display: block; overflow: hidden; clear: both; height: 0; visibility: hidden; content: "." }
.cf { zoom: 1 }
.cf:after { clear: both; display: table; content: "" }
.orange { color: #ff8d13 }
.red { color: #f25277 }
.blue { color: #0f8ff2 }
.green { color: #6bac2f }
.f12 { font-size: 12px }
.f14 { font-size: 14px }
.f18 { font-size: 18px }
.input, .textarea { background-color: #fff; border: 1px solid #d9d9d9 }
.textarea { border-radius: 2px; resize: none }
.disabled { cursor: default; color: #9c9c9c }

/* 优惠券禁用状态样式 */
#pay_coupon .disabled:hover { border: 1px solid #d8dbde; }
#pay_coupon .disabled:hover .coupon-title { margin-top: 10px; }

/* 布局和容器 - 调整宽度为880px */
body { color: #3c3c3c; font: 12px/1.5 "Microsoft Yahei", SimSun; background-color: #ebf0f6 }


/* 头部样式 */
.header { width: 100%; background-color: #fff }
.hd-top {width: 880px; height: 80px; line-height: 30px; z-index: 22;align-items: center; position: relative;  margin: 0 auto;}
.logo-icon, .logo-pay, .logozjh { position: absolute }
.logozjh { width: 105px; height: 36px; left: 0; top: 22px; background: -508px -338px no-repeat }
.logozjh a { height: 100%; display: block }
.logo-icon { display: block; width: 1px; height: 36px; left: 125px; top: 22px; background: -312px -385px no-repeat }
.logo-pay { height: 36px; left: 145px; top: 23px; font-size: 27px; font-weight: 600; color:#12bb12; }

/* 主要内容区域 - 调整总宽度为880px，左侧200px，右侧680px */
.pay-main { width: 880px; margin: 20px auto 30px; position: relative; background: url(images/pay-main-bg.jpg) repeat-y; box-shadow: 0 0 2px rgba(0,0,0,.1) }
.pay-left { width: 200px; padding-bottom: 30px; position: relative; float: left }
.pay-right { width: 680px; padding-bottom: 30px; float: left; padding-left: 0; padding-right: 0; margin-left: 0; margin-right: 0 }

/* 支付类型样式 - 适配左侧200px宽度 */
.pay-type-title { position: relative; *zoom: 1; text-indent: 28px; color: #fff; font-size: 14px; font-weight: 700; line-height: 26px; width: 194px; height: 32px; margin: 20px 0 10px; right: 6px; background: -274px -469px no-repeat }

/* 渠道列表样式 */
.channel-a, .channel-icon, .channel-name, .channel-status { display: inline-block }
.channel-a { *zoom: 1; width: 100%; height: 34px; line-height: 34px; border-top: 1px solid transparent; border-bottom: 1px solid transparent; _border-top: 0; _border-bottom: 0; border-left: none; border-right: none }
.channel-a.on, .channel-a:hover { background-color: #fff; border-color: #e8eaec; color: #0f8ff2; border-bottom: 2px solid #ffd15f; height: 33px; _height: 32px; zoom: 1 }
.channel-a.on .channel-name, .channel-a:hover .channel-name { color: #0f8ff2 }
.channel-icon { margin: 0 6px; text-align: center; width: 22px; height: 33px; background: center center no-repeat none; vertical-align: top; _vertical-align: middle; *vertical-align: middle }
.left-icon-2 { background-position: -244px -469px }
.left-icon-3 { background-position: -114px -516px }
.left-icon-9 { background-position: -78px -516px }
.channel-name { font-size: 16px; color: #333; vertical-align: top; _vertical-align: middle; *vertical-align: middle }
.channel-status { margin-left: 3px; margin-top: 0px; *margin-top: 4px; vertical-align: middle; width: 30px; height: 14px; background: -504px -253px no-repeat}


/* 订单区域样式 - 右侧内容边距调整 */
.channel-order { width: 100% }
.order-title { height: 63px; line-height: 63px; margin-left: 30px; color: #00aaef; font-size: 24px }
.order-tr { padding: 15px 0 15px 36px; color: #333; font-size: 14px; *zoom: 1; clear: both }
.order-td-left { text-align: right; width: 98px; float: left }
.order-td-left label { margin-right: 10px; line-height: 30px }
.order-td-right { width: 510px; float: left }
.order-td input { width: 232px; padding: 4px 5px; line-height: 26px; color: #3d3d3d; height: 20px; line-height: 20px; vertical-align: top; margin-right: 10px; border: 1px solid #d9d9d9 }
.order-td input:focus { border: 1px solid #1fb8ff }

/* 金额选择样式 */
.pay-amount { box-sizing: border-box; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; color: #666; position: relative; border-radius: 1px; _display: inline; width: 90px; height: 40px; *width: 88px; *height: 38px; *line-height: 38px; border: 1px solid #ffd563; background-color: #fffdf8; margin-bottom: 10px; text-align: center; margin-right: 10px; float: left; line-height: 40px }
.pay-amount-on, .pay-amount:hover { color: #333; width: 90px; height: 40px; line-height: 38px; *width: 86px; *height: 36px; *line-height: 36px; border: 2px solid #3fa8f9 }
.pay-amount-input { width: 190px; *width: 188px }
.pay-amount-input:hover, .pay-amount-on.pay-amount-input { width: 190px; *width: 186px }
.pay-amount-input .input { width: 120px; vertical-align: inherit; *padding: 0; margin-right: 5px; *vertical-align: middle }
.order-checked { position: absolute; display: none; width: 20px; height: 20px; bottom: -2px; right: -2px; background: -504px -210px no-repeat }
.pay-amount-on .order-checked { display: block }

/* 支付按钮样式 */
.pay-confirm { display: inline-block; text-align: center; width: 180px; height: 54px; line-height: 54px; font-size: 24px; color: #fff; background-color: #f90; border-radius: 3px }
.pay-confirm:hover { background-color: #ff8a00; color: #fff }

/* 汇款流程样式 - 调整边距：左边距缩小9px，右边距加大9px */
.order-remit-process { width: 632px; overflow: hidden; position: relative; margin-left: -10px; margin-right: 10px; padding-left: 0; padding-right: 0 }
.process-btn { width: 100%; border-bottom: 1px solid #3fa8f9; height: 39px; margin: 30px 0 25px }
.process-btn li { float: left }
.process-btn a { display: inline-block; width: 156px; height: 39px; line-height: 39px; text-align: center; margin-right: 2px; background-color: #ebf0f6; color: #999 }
.process-btn a.on, .process-btn a:hover { background-color: #3fa8f9; color: #fff }
.process-info { font-size: 12px; padding-bottom: 40px; position: relative; margin-left: 0; margin-right: 0 }
.process-info h3 { font-weight: 700; color: #333; line-height: 30px }
.process-info tr { height: 42px; line-height: 42px }
.process-info td, .process-info th { border: 1px solid #f2f6fa; text-indent: 15px; text-align: left; font-weight: 400 }
.process-info th { color: #999 }
.process-info-w64 { width: 64px }
.process-info-w172 { width: 172px }
.process-info-w210 { width: 210px }
.process-warn { padding: 25px 0 0; margin-left: 0; margin-right: 0 }
.process-warn p { font-size: 12px; text-align: justify; line-height: 26px; color: #999 }
.pay-info-help { font-size: 12px; text-align: justify; background-color: #fafbfd; border: 1px solid #eaeaea; padding: 20px 25px; line-height: 18px; margin-left: 0; margin-right: 0 }
.pay-info-help p { margin: 4px 0 }
.pay-info-help h3 { font-weight: 700 }


/* 页脚样式 - 适配880px宽度 */
.footer { width: 100%; background: 0 0 !important; padding: 20px 0; border-top: 1px solid #eee ; text-align: center}
.about-zjh { text-align: center; margin-bottom: 10px }
.about-zjh a { color: #3c3c3c; margin: 0 5px }
.about-zjh a:hover { color: #008eeb; text-decoration: none }
.copyright { text-align: center; color: #666; line-height: 1.8 }


/* 背景图片精灵图 */
.channel-icon,
.channel-status,
.logozjh,
.logo-icon,
.order-checked,
.pay-type-title {
    background-image: url(images/pay-20251201.png)
}