.purchasealert{ padding:20px; margin:0 10px; border:solid 2px #CCC; color:#666; font:normal 12px/normal Gulim; overflow:hidden }
.purchasealert > img{ float:left }
.purchasealert > ul{ padding:0; margin:0 0 0 220px }
.purchasealert > ul > li{ padding:4px 0; list-style:none }

.paymentedstring{ margin:23px auto; text-align:center; font:500 16px/normal 'NanumBarunGothic'; font-size:0 }
.paymentedstring > .paymentstate{ display:inline-block; width:478px; margin:0 5px; border:solid 1px #999; border-radius:4px; font-size:14px }
.paymentedstring > .paymentstate > .title{ font-size:20px }
.paymentedstring > .paymentstate > .periodlength > span{ font-weight:bold; color:#E00; font-size:20px }

.paymentlist{ padding:0; margin:24px auto; font-size:0 }
.paymentlist > li{ position:relative; display:inline-block; width:470px; height:95px; margin:10px; border:solid 5px #F46200; border-radius:10px; list-style:none }
.paymentlist > li > .title{ position:absolute; left:0; top:0; bottom:0; width:170px; background:#F46200; color:#FFF; text-align:center; font:500 20px/95px 'NanumBarunGothic' }
.paymentlist > li > .price{ position:absolute; left:170px; right:0; top:0; bottom:0; padding:12px }
.paymentlist > li > .price > p{ padding:0; margin:0; color:#333; font:500 16px/normal 'NanumBarunGothic' }
.paymentlist > li > .price > p.disabled > span{ margin-bottom:6px; font:normal 11px/normal Dotum; color:#888; text-decoration:line-through }
.paymentlist > li > .price > p.disabled > strong{ margin-left:12px; font:bold 12px/normal Dotum; text-decoration:none; color:#E00 }
.paymentlist > li > .price > p.discount{ color:#E00; font-size:14px; }
.paymentlist > li > .price > p.total{ margin-top:6px; color:#E00; color:#03C; font-weight:700; font-size:20px }
.paymentlist > li > .price > p.total > span{ color:#666; font-weight:500; font-size:12px }
.paymentlist > li:hover{ background-color:#F9E9C9; cursor:pointer }
.paymentlist > li[data-disabled=true]{ border-color:#999 }
.paymentlist > li[data-disabled=true] > .title{ background-color:#999; color:#CCC }
.paymentlist > li[data-disabled=true] > .price{ background-color:#F9F9F9; }
.paymentlist > li[data-disabled=true] > .price > p{ color:#999 }
.paymentlist > li[data-disabled=true] > .price > p.disabled > strong{ color:#999 }
.paymentlist > li[data-disabled=true]:hover{ background-color:#F9F9F9; cursor:default }

.paymentform{ width:980px; margin:24px auto }
.paymentform > .title{ margin:4px 0; font:500 16px/normal 'NanumBarunGothic' }
.paymentform > form{ border-top:solid 2px #444 }
.paymentform > form > dl{ width:100%; padding:0; margin:0 }
.paymentform > form > dl > dt{ float:left; width:130px; height:50px; padding:0 10px; background-color:#E9E9E9; border-bottom:solid 1px #CCC; color:#333; font:bold 12px/50px Gulim }
.paymentform > form > dl > dd{ height:50px; padding:0 10px; margin:0 0 0 150px; border-bottom:solid 1px #CCC; font:normal 12px/50px Gulim }
.paymentform > form > dl > dd > input[type=radio]{ vertical-align:middle }
.paymentform > form > dl > dd > input[type=radio] + label{ margin:0 12px 0 0; vertical-align:middle }
.paymentform > form > dl > dd#payprice{ color:#C00; font:700 20px/50px 'NanumBarunGothic' }
.paymentform > form > dl > .cashreceipt{ display:none }
.paymentform > form > dl > .cashreceipt.on{ display:block }
.paymentform > form > dl > .accounts{ display:none }
.paymentform > form > dl > .accounts.on{ display:block }
.paymentform > form > .buttons{ margin:12px auto; text-align:center }

/* 결제방식 이미지화 */
input[type=radio].paymethod{ display:none }
input[type=radio].paymethod + label{ width:140px; height:30px; background:url(/subPicture/paymethod.png) no-repeat 0 0; vertical-align:middle; font-size:0 }
input[type=radio].paymethod.credit + label{ background-position:0 -120px }
input[type=radio].paymethod.credit + label:hover{ background-position:-150px -120px; cursor:pointer }
input[type=radio].paymethod.credit:checked + label{ background-position:-150px -120px; cursor:default }
input[type=radio].paymethod.credit[disabled] + label{ background-position:-300px -120px !important; cursor:default }
input[type=radio].paymethod.virtual + label{ background-position:0 -280px }
input[type=radio].paymethod.virtual + label:hover{ background-position:-150px -280px; cursor:pointer }
input[type=radio].paymethod.virtual:checked + label{ background-position:-150px -280px; cursor:default }
input[type=radio].paymethod.virtual[disabled] + label{ background-position:-300px -280px !important; cursor:default }
input[type=radio].paymethod.transfer + label{ background-position:0 -240px }
input[type=radio].paymethod.transfer + label:hover{ background-position:-150px -240px; cursor:pointer }
input[type=radio].paymethod.transfer:checked + label{ background-position:-150px -240px; cursor:default }
input[type=radio].paymethod.transfer[disabled] + label{ background-position:-300px -240px !important; cursor:default }
input[type=radio].paymethod.deposit + label{ background-position:0 -600px }
input[type=radio].paymethod.deposit + label:hover{ background-position:-150px -600px; cursor:pointer }
input[type=radio].paymethod.deposit:checked + label{ background-position:-150px -600px; cursor:default }
input[type=radio].paymethod.deposit[disabled] + label{ background-position:-300px -600px !important; cursor:default }

/* 결제완료 */
.tblPurchaseSuccess{ width:100%; border-spacing:0; border-collapse:collapse; font:normal 12px/normal Dotum; table-layout:fixed }
.tblPurchaseSuccess th{ padding:8px 11px; background-color:#E9E9E9; font-weight:bold }
.tblPurchaseSuccess td{ padding:8px 11px; border-bottom:solid 1px #CCC; text-align:center }
.tblPurchaseSuccess td.disabled{ color:#999 }

/* 결제실패 */
.pf_title{ width:760px; padding:30px 15px; margin:10px auto; border:solid 5px #CCC; text-align:center; font:500 18px/24px 'NanumBarunGothic' }
.pf_cause{ width:760px; padding:30px 15px; margin:10px auto; border:solid 5px #CCC; text-align:center; font:500 14px/24px 'NanumBarunGothic' }
.pf_button{ padding:25px 0; text-align:center }
.pf_button > button{ padding:24px 32px; background-color:#F60; border:0; color:#FFF; font:700 22px/normal 'NanumBarunGothic' }

.purchase_denied{  }
.purchase_denied img{ max-width:100% }

@media (max-width:640px){

#successmsg{ max-width:100% }

.purchasealert{ padding:1rem; margin:.5rem; font-size:.75rem }
.purchasealert > img{ float:none; display:block; margin:0 auto }
.purchasealert > ul{ margin:0 }
.purchasealert > ul > li{ padding:.3rem 0 }

.paymentedstring{ margin:23px auto; text-align:center; font:500 16px/normal 'NanumBarunGothic'; font-size:0 }
.paymentedstring > .paymentstate{ display:block; width:calc(100% - 1rem); margin:.5rem; border:solid 1px #999; border-radius:4px; font-size:14px }
.paymentedstring > .paymentstate > .title{ font-size:20px }
.paymentedstring > .paymentstate > .periodlength > span{ font-weight:bold; color:#E00; font-size:20px }

.paymentlist{ margin:1rem auto }
.paymentlist > li{ display:block; width:auto; margin:.5rem; border-radius:1rem }
.paymentlist > li > .title{ width:35%; font-size:1rem }
.paymentlist > li > .price{ left:35%; padding:.5rem }

.paymentform{ width:calc(100% - 1rem); margin:1rem auto }
.paymentform > form{  }
.paymentform > form > dl{ width:100% }
.paymentform > form > dl > dt{ float:left; width:100px; height:50px; padding:0 10px; background-color:#E9E9E9; border-bottom:solid 1px #CCC; color:#333; font:bold 12px/50px Gulim }
.paymentform > form > dl > dd{ height:50px; padding:0 10px; margin:0 0 0 120px; border-bottom:solid 1px #CCC; font:normal 12px/50px Gulim }
.paymentform > form > dl > dt:first-child{ height:150px }
.paymentform > form > dl > dt:first-child + dd{ height:150px; line-height:40px }
.paymentform > form > dl > dt.accounts{ height:70px }
.paymentform > form > dl > dd.accounts{ height:50px; padding:10px; line-height:25px; }

}
@media (max-width:360px){
	.paymentform{ width:100% }
}