@charset "utf-8";@import url("https://fonts.googleapis.com/css?family=Roboto:400,300,100,500,700");
html, body, div, span, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, acronym, address, big, cite, code, img, ins, kbd, q, s, samp, small, strike, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td { margin: 0; padding: 0; border: 0; outline: 0; font-size: 100%; vertical-align: baseline; background: transparent;}
h1, h2, h3, h4, h5, h6 { font-weight: normal;}
body { line-height: 1;}
ol, ul { list-style: none;}
table { border-collapse: collapse; border-spacing: 0;}
html, body { max-width: 100%; height: 100%;}
body { width: 100%; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; background-color: #f8f9fa; line-height: 1; /* 컨텐츠 드래그 막기 (브라우저 상관없이 모두) 추가 by daltago87*/ -webkit-touch-callout: none; -webkit-user-select: none; -khtml-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -khtml-user-select: none;} body.sub { background-color: #ffffff; }
body, textarea, select, input, button { font: 12px "Malgun Gothic", "맑은 고딕"; color: #4a4e57;}
a { color: #363940; text-decoration: none; cursor: pointer;}
a:hover { color: #363940; text-decoration: none; }
button { border: 0; padding: 0; background: transparent; cursor: pointer; *overflow: visible; display: inline-block;}
button::-moz-focus-inner { padding: 0; border: 0; }
caption, legend, .hidden { visibility: hidden; width: 0; height: 0; overflow: hidden; font-size: 0; line-height: 0; padding: 0;}
.dimmed { display: block; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #000000; opacity: 0.8; z-index: 10;}
.dimmed2 { display: block; position: fixed; top: 0; left: 0; width: 100%; height: 100%; background-color: #000000; opacity: 0.8; z-index: 30;}
.layer { position: fixed; z-index: 20; background-color: #ffffff; border-radius: 6px;}
.bt1 { display: block; width: 222px; height: 35px; padding-top: 15px; text-align: center; background-color: #0077ff; font: 18px 'NEXONLv1GothicOTFBold'; color: #ffffff;}
.bt1:hover { color: #ffffff; background-color: #02b0ff; }
.bt2 { display: block; width: 222px; height: 35px; padding-top: 15px; text-align: center; background-color: #4a4e57; font: 18px 'NEXONLv1GothicOTFBold'; color: #ffffff;}
.bt2:hover { color: #ffffff; background-color: #17191d; }
.bt3 { display: block; width: 86px; height: 28px; padding-top: 12px; text-align: center; background-color: #17191d; font: 14px 'NEXONLv1GothicOTFBold'; color: #ffffff;}
.bt3:hover { color: #ffffff; background-color: #0077ff; }
.bt4 { display: block; width: 100%; height: 35px; padding-top: 17px; text-align: center; background-color: #0077ff; font: 16px 'NEXONLv1GothicOTFBold'; color: #ffffff;}
.bt4:hover { color: #ffffff; background-color: #02b0ff; }
.bt5 { display: block; width: 100%px; height: 35px; padding-top: 17px; text-align: center; background-color: #17191d; font: 14px 'NEXONLv1GothicOTFBold'; color: #ffffff;}
.bt5:hover { color: #ffffff; background-color: #363940; }
.bt6 { display: block; width: 100%px; height: 32px; padding-top: 16px; text-align: center; background-color: #17191d; font: 14px 'NEXONLv1GothicOTFBold'; color: #ffffff;}
.bt6:hover { color: #ffffff; background-color: #363940; }
.bt7 { display: inline-block; width: 320px; height: 35px; padding-top: 17px; text-align: center; background-color: #17191d; font: 16px 'NEXONLv1GothicOTFBold'; color: #ffffff;}
.bt7:hover { color: #ffffff; background-color: #0077ff; }
.bt8 { display: inline-block; width: 159px; height: 35px; margin: 0 1px; padding-top: 17px; text-align: center; background-color: #9fa1a7; font: 16px 'NEXONLv1GothicOTFBold'; color: #ffffff;}
.bt8:hover { color: #ffffff; background-color: #0077ff; }
.bt9 { display: inline-block; width: 159px; height: 35px; margin: 0 1px; padding-top: 17px; text-align: center; background-color: #17191d; font: 16px 'NEXONLv1GothicOTFBold'; color: #ffffff;}
.bt9:hover { color: #ffffff; background-color: #0077ff; }
.disable { opacity: 0.4; pointer-events: none;}
.bt1.disable:hover { background-color: #0077ff;}
.bt4.disable:hover { background-color: #0077ff;}
.bt5.disable:hover { background-color: #17191d;}
.chargeState1, .chargeState2, .chargeState3 {display:inline-block;height:18px;padding:2px 8px 0;color:#ffffff;border-radius:20px;font:12px "Malgun Gothic", "맑은 고딕";letter-spacing: -0.9px;white-space: nowrap;}
.chargeState1, .chargeState3 {background-color:#2be283;}
.chargeState2 {background-color:#ff6060;}
.chargeState3 {width:105px;padding:2px 0 0;text-align:center;}
/* checkbox */.checkboxSec { position: relative;}
.checkboxSec input { visibility: hidden; width: 1px; height: 1px; overflow: hidden; font-size: 0; line-height: 0; padding: 0; position: absolute; top: -3px; left: -3px; }
.checkboxSec label { display: inline-block; padding: 0px 0 0 27px; background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/checkbtn_default.png) no-repeat left 2px; cursor: pointer; }
.checkboxSec input[type="checkbox"]:checked + label { background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/checkbtn.png) no-repeat left 2px; }
/* radio */.radioSec { position: relative;}
.radioSec input { visibility: hidden; width: 1px; height: 1px; overflow: hidden; font-size: 0; line-height: 0; padding: 0; position: absolute; top: -3px; left: -3px; }
.radioSec label { display: inline-block; padding: 0px 0 1px 27px; background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/radiobtn_default.png) no-repeat left 1px; cursor: pointer; }
.radioSec input[type="radio"]:checked + label { background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/radiobtn_selected.png) no-repeat left 1px; }
/* font */@font-face { font-family: 'NEXONLv1GothicRegular'; src: url("/Contents/theme/nxat/fonts/NEXONLv1GothicOTF.eot"); src: url("/Contents/theme/nxat/fonts/NEXONLv1GothicOTF.eot?#iefix") format("embedded-opentype"), url("/Contents/theme/nxat/fonts/NEXONLv1GothicOTF.woff") format("woff"), url("/Contents/theme/nxat/fonts/NEXONLv1GothicRegular.ttf") format("truetype"), url("/Contents/theme/nxat/fonts/NEXONLv1GothicRegular.svg#webfont") format("svg");}
@font-face { font-family: 'NEXONLv1GothicOTFLight'; src: url("/Contents/theme/nxat/fonts/NEXONLv1GothicOTFLight.eot"); src: url("/Contents/theme/nxat/fonts/NEXONLv1GothicOTFLight.eot?#iefix") format("embedded-opentype"), url("/Contents/theme/nxat/fonts/NEXONLv1GothicOTFLight.woff") format("woff"), url("/Contents/theme/nxat/fonts/NEXONLv1GothicLight.ttf") format("truetype"), url("/Contents/theme/nxat/fonts/NEXONLv1GothicLight.svg#webfont") format("svg");}
@font-face { font-family: 'NEXONLv1GothicOTFBold'; src: url("/Contents/theme/nxat/fonts/NEXONLv1GothicOTFBold.eot"); src: url("/Contents/theme/nxat/fonts/NEXONLv1GothicOTFBold.eot?#iefix") format("embedded-opentype"), url("/Contents/theme/nxat/fonts/NEXONLv1GothicOTFBold.woff") format("woff"), url("/Contents/theme/nxat/fonts/NEXONLv1GothicBold.ttf") format("truetype"), url("/Contents/theme/nxat/fonts/NEXONLv1GothicBold.svg#webfont") format("svg");}
.wrapper { position: relative; width: 954px; margin: 0 auto;}
.header { position: fixed; top: 0; left: 0; width: 100%; z-index: 1; box-shadow: 0 4px 6px 0 rgba(0, 0, 0, 0.04); background-color: #ffffff; font: 14px 'NEXONLv1GothicOTFBold'; line-height: 1.2;}
.header .wrapper { max-width: 954px; width: 100%; }
#header, #header .wrapper { height: 54px;}
#header2, #header2 .wrapper { height: 96px;}
@media screen and (max-width:954px) { .header { box-shadow: 0 0 0 0 rgba(0, 0, 0, 0); }
.header .wrapper { box-shadow: 0 4px 6px 0 rgba(0, 0, 0, 0.04); background-color: #ffffff; }}
.header .wrapper::after, #chargeCase li dl, .FAQ, .layer1 #cashInfo dl, .layer1 .inputSec3, .layer1 #authNum, .layer2 dl, #errorSec .txt2 {content:''; display:table; clear:both;}
.header h1 {float:left;padding:19px 0 0 40px;color:#000000;}
.header h1 img {vertical-align:middle;margin:0 6px 3px 0;}
.header ul#nav {float:right;margin-top:19px;padding-right:40px;}
.header ul#nav li {display:inline-block;margin-left:18px;}
.header ul#nav li a, .header ul#nav2 li a {color:#9fa1a7;}
.header ul#nav li a:hover, .header ul#nav2 li a:hover {color:#0077ff;}
.header ul#nav li.on a {color:#292e3c;}
.header ul#nav2 {position:absolute;top:68px;left:0px;width:100%;text-align:center;}
.header ul#nav2 li {position:relative;display:inline-block;height:26px;margin:0 17px;}
.header ul#nav2 li.on {border-bottom:2px solid #17191d;}
.header ul#nav2 li.on a {color:#17191d;}
.header ul#nav2 li p {position:absolute;top:-31px;left:0;text-align:center;width:100%;}
.header ul#nav2 li p span.chargeState3 {position: absolute;left:-8px;}
#contents1 { padding-top: 54px;}
#contents2 { padding-top: 96px;}
#contents2 .wrapper { background-color: #ffffff; }
.noProduct { padding-top: 252px; text-align: center; font-size: 14px; color: #9fa1a7; line-height: 1.57;}
p#mainTxt {padding:70px 0 39px;font:26px 'NEXONLv1GothicOTFBold';color:#0b1843;line-height:1.38;text-align:center;}
p#mainTxt.mainTxt2 {padding:84px 0 48px;}
p#mainTxt span {display:block;}
p#mainTxt .txt1 {font-family:'NEXONLv1GothicRegular';}
p#mainTxt .txt2 {padding-top:12px;font:11px 'Malgun Gothic';color:#373a46;letter-spacing:-0.55px;opacity:0.7;line-height:2;}#chargeCase {text-align:center;font-size:0;}
#chargeCase {text-align:center;font-size:0;}
#chargeCase li {position:relative;width:246px;height:390px;display:inline-block;margin:0 7px;padding-left:24px;border-radius:4px;background-color:#ffffff;box-shadow:0px 0 20px 0 rgba(0, 0, 0, 0.08);text-align:left;vertical-align:top;}
#chargeCase li:hover {box-shadow:0px 0 20px 0 rgba(0, 0, 0, 0.16);}
#chargeCase li .chargeTit {float:left;padding-top:30px;font:14px 'NEXONLv1GothicOTFBold';color:#272c3c;line-height:1.5;}
#chargeCase li .chargeState {float:right;padding:30px 24px 0 0;}
#chargeCase li .chargeTxt {clear:both;padding-top:13px;font:32px 'NEXONLv1GothicRegular';color:#111e41;line-height:1.38;}
#chargeCase li .chargeTxt strong {font-weight:normal;font-family:'NEXONLv1GothicOTFBold';}
#chargeCase li .chargeEvent {width:222px;padding:79px 0 0px;}
#chargeCase li .chargeEvent a {display:inline-block;width:100%;height:22px;padding-top:2px;text-indent:12px;border-radius: 30px;background:#8154ef url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/Chevrongo_w_default.png) no-repeat 202px center;font-size:12px;font-family:'NEXONLv1GothicOTFBold';line-height: 1.8;letter-spacing: -0.6px;color: #ffffff;}
#chargeCase li .chargeEvent a:hover {background-color:#aa88ff;}
#chargeCase li .chargeInfoTxt {position:absolute;bottom:12px;left:24px;width:222px;padding-top:5px;color:#0077ff;line-height:1.33;letter-spacing:-0.6px;font-size:12px;text-align:center;}
#chargeCase li .btSec1 {position: absolute;bottom:32px;left:24px;}
/*#chargeCase li dl { width: 222px; padding: 78px 0 19px; line-height: 1.11; font-size: 14px; color: #414758; letter-spacing: -0.7px; }
#chargeCase li dl dt { float: left; }
#chargeCase li dl dd { float: right; }*/
#chargeCase li .chargeInfoTxt { width: 222px; padding-top: 5px; color: #0077ff; line-height: 1.33; letter-spacing: -0.6px; font-size: 12px; text-align: center; }
#contents2 h2 { font: 14px 'NEXONLv1GothicOTFBold'; color: #17191d;}
.myProduct { padding: 30px 40px 40px; line-height: 1.2; letter-spacing: -0.7px;}
.myProduct h2 { float: left; padding-bottom: 12px; }
.myProduct .productCloseBt { float: right; padding-top: 2px; }
.myProduct .productCloseBt a { display: inline-block; padding-right: 12px; background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/Chevrongo_default.png) no-repeat right 4px; }
.myProduct .productCloseBt a:hover { color: #0077ff; background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/Chevrongo_hoverpress.png) no-repeat right 4px; }
.myProduct .myCashInfo {position:relative;clear:both;width:814px;height:140px;padding:0 30px;background-color:#ffffff;box-shadow:0 0 20px 0 rgba(0, 0, 0, 0.08);}
.myProduct .myCashInfo h3 {padding:25px 0 9px;font:14px 'Malgun Gothic';color:#17191d;font-weight:bold;line-height:1.2;letter-spacing:-0.7px;}
.myProduct .myCashInfo .cash {font:42px 'Roboto';color:#17191d;line-height: 1.19;}
.myProduct .myCashInfo .cash span {display:block;padding:4px 0 0 1px;font:13px 'Malgun Gothic';color:#363940;line-height: 1.11;letter-spacing: -0.65px;}
.myProduct .myCashInfo .bt {position:absolute;top:53px;right:30px;z-index:2;}
.myProduct .myCashInfo .alert {position:absolute;bottom:-26px;left:0;width:100%;height:22px;padding-top:4px;text-indent:50px;background:#ff6060 url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/icon_error.png) no-repeat 30px 6px;font:12px 'Malgun Gothic';font-weight:bold;color:#ffffff;}
.myProduct .myCashInfo .noProduct {position:absolute;top:62px;left:0;width:100%;padding-top:0;}
.myProduct .myCashInfo .cashState {position:absolute;top:26px;right:0;width:436px;height:88px;border-left:1px solid #e5e8eb;font-size:13px;}
.myProduct .myCashInfo .cashState .stit {display:inline-block;padding:0 20px 0 24px;font-weight:bold;color:#17191d;line-height: 1.29;letter-spacing: -0.65px; vertical-align: top;}
.myProduct .myCashInfo .cashState ul {display:inline-block;margin-top:-4px;}
.myProduct .myCashInfo .cashState ul li {line-height: 1.85;letter-spacing: -0.65px;}
#productList {padding:0 40px;}
#productList h2 {padding-bottom:12px;}
#productList h2 span {float:right;font:12px 'Malgun Gothic';color:#9fa1a7;letter-spacing:-0.6px;}
#productList table {width:100%;border-top:2px solid #17191d;font:13px 'Malgun Gothic';color:#363940;}
#productList table th {height:42px;border-bottom:1px solid #17191d;font-weight:normal;vertical-align:middle;}
#productList table td {height:42px;text-align:center;border-bottom:1px solid #dde1e5;vertical-align:middle;}
#productList table .cell1 {width:120px;}
#productList table .cell2, #productList table .cell4 {width:200px;}
#productList table .cell3 {width:280px;}
#productList table .cell5 {width:164px;color:#737881;}
#productList table .cell1 a {text-decoration:underline;}
#productList table .cell1 a.state1 {color:#ff6060}
#productList table .cell1 a:hover {color:#0077ff;}
#productList #pageSec { margin-top: 20px; text-align: center; font-size: 0; }
#productList #pageSec a { display: inline-block; width: 24px; height: 20px; margin-right: 1px; padding-top: 4px; color: #9fa1a7; font-size: 12px; vertical-align: middle; }
#productList #pageSec a:hover { color: #0077ff; }
#productList #pageSec a strong { color: #17191d; }
#productList #pageSec a.first, #productList #pageSec a.first.disable:hover { margin-top: 2px; margin-right: 2px; background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/ChevronFront_Default.png) no-repeat center center; }
#productList #pageSec a.prev, #productList #pageSec a.prev:hover { margin-top: 2px; margin-right: 2px; background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/ChevronPrevious_Default.png) no-repeat center center; }
#productList #pageSec a.next, #productList #pageSec a.next:hover { margin-top: 2px; margin-left: 3px; background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/ChevronNext_Default.png) no-repeat center center; }
#productList #pageSec a.last, #productList #pageSec a.last:hover { margin-top: 2px; margin-left: 1px; background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/ChevronLast_Default.png) no-repeat center center; }
#productList #pageSec a.first:hover { background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/ChevronFront_Hoverpress.png) no-repeat center center; }
#productList #pageSec a.prev:hover { background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/ChevronPrevious_Hoverpress.png) no-repeat center center; }
#productList #pageSec a.next:hover { background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/ChevronNext_Hoverpress.png) no-repeat center center; }
#productList #pageSec a.last:hover { background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/ChevronLast_Hoverpress.png) no-repeat center center; }
.FAQ { width: 874px; padding: 40px 40px 0;}
.FAQ dt, .FAQ dd { float: left; border-top: 1px solid #dde1e5; }
.FAQ dt { clear: both; width: 120px; padding-top: 15px; color: #737881; font: 14px 'NEXONLv1GothicRegular'; }
.FAQ dd { width: 754px; padding-bottom: 10px; word-break: break-all; word-wrap: break-word; }
.FAQ dd a { display: block; padding: 14px 0 13px 21px; font: 14px 'NEXONLv1GothicOTFBold'; color: #4a4e57; line-height: 1.57; background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/icon_fold.png) no-repeat left 18px; }
.FAQ dd a.on { background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/icon_fold_on.png) no-repeat left 18px; }
.FAQ dd a:hover { color: #0077ff; }
.FAQ dd .answer { display: none; width: 734px; margin-top: -9px; padding: 0 0 19px 20px; font: 13px 'Malgun Gothic'; color: #737881; line-height: 1.54; letter-spacing: -0.65px; word-break: break-all; word-wrap: break-word; }
.FAQ dd .answer strong {display:block;padding-top:20px;}.FAQ dd .answer ul li {padding-left:8px;background:url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/bul_squ_bl.png) no-repeat left 8px;}
#errorSec {position:absolute;width:320px;text-align:center;z-index:15;}
#errorSec h1 {padding-top:50px;font:16px 'NEXONLv1GothicOTFBold';line-height:1.05;color:#000000;}
#errorSec h1.alert {background:url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/icon_error2.png) no-repeat center top;}
#errorSec h1.check {background:url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/icon_confirm.png) no-repeat center top;}
#errorSec .txt1 {padding:10px 0;font-size:13px;color:#4a4e57;line-height:1.54;letter-spacing:-0.65px;}
#errorSec .txt1 span {display:block;padding-top:10px;color:#0077ff;}
#errorSec .txt2 {width:320px;padding-bottom:32px;}
#errorSec .txt2 span {float:left;line-height:1.83;letter-spacing:-0.6px;color:#9fa1a7;}
#errorSec .txt2 a {float:right;line-height:1.83;letter-spacing:-0.6px;color:#737881;text-decoration:underline;}
#errorSec .bt {clear:both;}
#errorSec2 {position:absolute;width:320px;text-align:center;z-index:40;}
#errorSec2 h1 {padding-top:50px;font:16px 'NEXONLv1GothicOTFBold';line-height:1.05;color:#000000;}
#errorSec2 h1.alert {background:url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/icon_error2.png) no-repeat center top;}
#errorSec2 h1.check {background:url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/icon_confirm.png) no-repeat center top;}
#errorSec2 .txt1 {padding:10px 0;font-size:13px;color:#4a4e57;line-height:1.54;letter-spacing:-0.65px;}
#errorSec2 .txt1 span {display:block;padding-top:10px;color:#0077ff;}
#errorSec2 .txt2 {width:320px;padding-bottom:32px;}
#errorSec2 .txt2 span {float:left;line-height:1.83;letter-spacing:-0.6px;color:#9fa1a7;}
#errorSec2 .txt2 a {float:right;line-height:1.83;letter-spacing:-0.6px;color:#737881;text-decoration:underline;}
#errorSec2 .bt {clear:both;}
.layer1 { position: relative; width: 380px; height: 640px;}
.layer1 h1 { height: 34px; padding-top: 18px; font: 14px 'NEXONLv1GothicOTFBold'; line-height: 1.2; text-align: center; color: #000000; }
.layer1 ol#step, .layer1 ol#step2 { font-size: 0; box-shadow: 0 3px 6px 0 rgba(0, 0, 0, 0.06); }
.layer1 ol#step li, .layer1 ol#step2 li { display: inline-block; width: 95px; height: 22px; padding-top: 26px; font: 12px 'NEXONLv1GothicOTFBold'; color: #9fa1a7; text-align: center; line-height: 1.4; border-bottom: 2px solid #ffffff; }
.layer1 ol#step2 li { width: 127px; }
.layer1 ol#step2 li:last-child { width: 126px; }
.layer1 ol#step li.step1, .layer1 ol#step2 li.step1 { background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/icon_progress_dimmed_01.png) no-repeat center 1px; }
.layer1 ol#step li.step2, .layer1 ol#step2 li.step2 { background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/icon_progress_dimmed_02.png) no-repeat center 1px; }
.layer1 ol#step li.step3, .layer1 ol#step2 li.step3 { background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/icon_progress_dimmed_03.png) no-repeat center 1px; }
.layer1 ol#step li.step4 { background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/icon_progress_dimmed_04.png) no-repeat center 1px; }
.layer1 ol#step li.on, .layer1 ol#step2 li.on { color: #17191d; border-bottom: 2px solid #17191d; }
.layer1 ol#step li.step1.on, .layer1 ol#step2 li.step1.on { background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/icon_progress_active_01.png) no-repeat center 1px; }
.layer1 ol#step li.step2.on, .layer1 ol#step2 li.step2.on { background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/icon_progress_active_02.png) no-repeat center 1px; }
.layer1 ol#step li.step3.on, .layer1 ol#step2 li.step3.on { background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/icon_progress_active_03.png) no-repeat center 1px; }
.layer1 ol#step li.step4.on { background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/icon_progress_active_04.png) no-repeat center 1px; }
.layer1 ol#step li.on.check, .layer1 ol#step2 li.on.check { border-bottom: 2px solid #17191d; background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/icon_progress_done.png) no-repeat center 1px; color: #9fa1a7; }
.layer1 .btSec { position: absolute; bottom: 20px; left: 16px; width: 348px; }
.layer1 .closeBt { position: absolute; top: 5px; right: 0; }
.layer1 .closeBt button { width: 42px; height: 42px; background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/btn_close002_default.png) no-repeat left top; }
.layer1 .closeBt button:hover { background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/btn_close002_hoverpress.png) no-repeat left top; }


.layer1 .chargeAmount {position:relative;width:346px;height:62px;margin:24px auto 0;border:1px solid #e5e8eb;}
.layer1 .chargeAmount:nth-of-type(2) {margin-top:12px;}
.layer1 .chargeAmount.on {width:346px;height:60px;border:2px solid #0077ff;}
.layer1 .chargeAmount button.amount {position:absolute;top:0;left:0;display:block;width:100%;height:100%;text-align:left;z-index:50;background:#ffffff url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/bul_arr_gr_down.png) no-repeat 326px 40px;}
.layer1 .chargeAmount button.amount.on {background:#ffffff url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/bul_arr_gr_up.png) no-repeat 326px 40px;}
.layer1 .chargeAmount button.amount span, .layer1 #paymentMethod span {display:block;}
.layer1 .chargeAmount button.amount .txt {padding:0 0 4px 12px;color:#6e737c;line-height:1.33;letter-spacing:-0.6px;}
.layer1 .chargeAmount button.amount .num {padding-left:12px;color:#17191d;font-size:16px;font-weight:bold;line-height:1;}
.layer1 .chargeAmount.disable {border-color:#C7C8CC;}
.layer1 .chargeAmount.disable button.amount {background-color:#F2F5F8;}
.layer1 .chargeAmount ul {/*display:none;*/position:absolute;top:63px;left:0;overflow:auto;overflow-x:hidden;width:348px;max-height:240px;padding:10px 0;box-shadow:0 0 20px 0 rgba(0, 0, 0, 0.16);z-index:30;background-color:#ffffff;z-index:60;}
.layer1 .chargeAmount ul li button {width:348px;height:48px;text-align:left;text-indent:12px;font:bold 16px 'Malgun Gothic';color:#4a4e57;line-height:1;}
.layer1 .chargeAmount ul li button:hover {color:#0077ff;}

.layer1 #paymentMethod {width:346px;height:62px;margin:12px auto 0;border:solid 1px #e5e8eb;background-color:#ffffff;}
.layer1 #paymentMethod .txt1 {padding:11px 0 6px 12px;color:#737881;line-height:1.3;letter-spacing:-0.6px;}
.layer1 #paymentMethod .txt2 {padding:0 11px 0 12px;color:#17191d;font-size:16px;font-weight:bold;letter-spacing:-0.8px;line-height:1;}
.layer1 #paymentMethod .txt2 img {float:right;}
.layer1 #paymentMethod.disable {border-color:#C7C8CC;background-color:#F2F5F8;}

.layer1 #cashInfo {position:absolute;bottom:82px;left:16px;}
.layer1 #cashInfo .cashInfoCnts {width:348px;padding:24px 0 23px;box-shadow:0 0 20px 0 rgba(0, 0, 0, 0.06);}
.layer1 #cashInfo .txt1 {width:308px;margin:0 auto 17px;font-size:14px;line-height:1.57;letter-spacing:-0.7px;color:#17191d;}
.layer1 #cashInfo .txt1 strong.num2 { color: #0077ff; }
.layer1 #cashInfo .txt1 span { display: block; padding-top: 6px; font-size: 12px; color: #737881; line-height: 1.33; letter-spacing: -0.6px; }
.layer1 #cashInfo dl { width: 308px; margin: 0 auto; padding-top: 23px; border-top: 1px solid #f2f5f8; }
.layer1 #cashInfo dl dt, .layer1 #cashInfo dl dd { float: left; padding-bottom: 11px; font-size: 14px; line-height: 1.57; letter-spacing: -0.7px; }
.layer1 #cashInfo dl dt { clear: both; width: 130px; color: #4a4e57; }
.layer1 #cashInfo dl dd { width: 178px; color: #4a4e57; font-weight: bold; text-align: right; }
.layer1 #cashInfo .txt2 {clear:both;width:308px;margin:-9px auto 0;color:#737881;line-height:1.83;letter-spacing:-0.6px;}
.layer1 #cashInfo .alert {width:348px;padding-bottom:10px;color:#ff6060;font-size:11px;line-height: 1.45;letter-spacing:-0.55px;font-weight:bold;}
.layer1 #cashInfo .alert a {text-decoration:underline;color:#737881;}
.layer1 #cashInfo .alertInfo { position: absolute; top: -35px; left: 0; color: #0077ff; font-size: 11px; line-height: 1.36; letter-spacing: -0.55px; font-weight: bold; }
.layer1 .nxOTPTxt1 { padding-top: 188px; text-align: center; background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/menu_ico_OTP.png) no-repeat center 100px; line-height: 1.54; letter-spacing: -0.65px; font-size: 13px; color: #4a4e57; }
.layer1 .nxOTPTxt2 { width: 348px; margin: 40px auto; padding-top: 24px; border-top: 1px solid #f2f5f8; line-height: 1.5; letter-spacing: -0.6px; text-align: center; color: #737881; }
.layer1 .nxOTPTxt2 span { display: block; padding-top: 6px; }
.layer1 .nxOTPTxt3 { padding-top: 100px; text-align: center; font-size: 13px; color: #4a4e57; line-height: 1.54; letter-spacing: -0.65px; }
.layer1 .nxOTPTxt3 img { display: block; margin: 0 auto 40px; }
.layer1 #agreement { width: 348px; margin: 0 auto; font-size: 14px; color: #4a4e57; line-height: 1.57; letter-spacing: -0.7px; }
.layer1 #agreement #allChk { padding: 25px 0 21px; border-bottom: 1px solid #f2f5f8; font-weight: bold; }
.layer1 #agreement ul { padding-top: 8px; }
.layer1 #agreement ul li { position: relative; margin-bottom: 8px; }
.layer1 #agreement ul li label { padding: 13px 0 13px 27px; }
.layer1 #agreement ul li label { background-position: left 15px; }
.layer1 #agreement ul li label span { display: block; font-size: 12px; }
.layer1 #agreement ul li .checkCnts { display: none; overflow: auto; width: 328px; height: 80px; padding: 10px; font-size: 12px; background-color: #f8f9fa; color: #737881; border: 0; outline: 0; resize: none; line-height: 1.5; letter-spacing: -0.6px; }
.layer1 #agreement ul li button { position: absolute; top: 13px; right: -5px; display: inline-block; width: 20px; height: 20px; background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/bul_arr_gr_down.png) no-repeat center 7px; }
.layer1 #agreement ul li button.on { background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/bul_arr_gr_up.png) no-repeat center 7px; }
.layer1 #agreement ul li.disable, .layer1 #agreement ul li.disable textarea { opacity: 1; }
.layer1 #agreement ul li.disable .checkboxSec { opacity: 0.4; }
.layer1 .paymentMethodSec { width: 348px; margin: 24px auto 0; }
.layer1 .inputSec { border: 1px solid #e5e8eb; }
.layer1 .inputSec input { display: block; width: 322px; height: 18px; padding: 15px 12px; border: 0; color: #17191d; font-weight: bold; font-size: 14px; }
.layer1 .inputSec.focus { border: 2px solid #0077ff; }
.layer1 .inputSec.focus input { padding: 14px 11px; }
.layer1 .inputSec input::placeholder { font-size: 14px; color: #c7c8cc; font-weight: normal; }
.layer1 .inputSec input::-webkit-input-placeholder { font-size: 14px; color: #c7c8cc; font-weight: normal; }
.layer1 .inputSec input:-ms-input-placeholder { font-size: 14px; color: #c7c8cc; font-weight: normal; }
.layer1 .inputSec.disable { opacity: 1; background: #fafbfc url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/icon_check.png) no-repeat 312px 12px; border-color: #e9e9eb; }
.layer1 .inputSec.disable input { opacity: 0.4; background: transparent; }
.layer1 .inputSubTxt { padding-top: 4px; font-size: 11px; color: #737881; line-height: 1.36; letter-spacing: -0.55px; font-weight: bold; }
.layer1 .alertTxt { font-weight: bold; color: #ff6060; }
.layer1 #mobileCarrierList { width: 346px; margin: 8px auto 0; border: 1px solid #e5e8eb; font-size: 0; }
.layer1 #mobileCarrierList li { position: relative; display: inline-block; width: 82px; height: 46px; border-left: 1px solid #e5e8eb; line-height: 1.11; letter-spacing: -0.7px; text-align: center; vertical-align: top; }
.layer1 #mobileCarrierList li:first-child { border: 0; }
.layer1 #mobileCarrierList li:last-child { width: 97px; }
.layer1 #mobileCarrierList li button { width: 100%; height: 100%; font-size: 14px; }
.layer1 #mobileCarrierList li button:hover { color: #0077ff; }
.layer1 #mobileCarrierList li button.on { color: #0077ff; font-weight: bold; }
.layer1 #mobileCarrierList li.etc .txt { position: absolute; top: 14px; left: 9px; display: block; width: 68px; text-overflow: ellipsis; white-space: nowrap; overflow: hidden; word-wrap: normal; text-align: left; }
.layer1 #mobileCarrierList li.etc .more { position: absolute; top: 0; left: 0; background: #ffffff url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/bul_arr_gr_down.png) no-repeat 78px 20px; z-index: 30; }
.layer1 #mobileCarrierList li.etc .moreOn { color: #0077ff; background: #ffffff url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/bul_arr_gr_up.png) no-repeat 78px 20px; z-index: 30; }
.layer1 #mobileCarrierList li.etc .etcL { display: none; position: absolute; top: 46px; left: -1px; width: 99px; padding: 8px 0; background-color: #ffffff; z-index: 20; box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.16); }
.layer1 #mobileCarrierList li.etc .etcL li { border: 0; width: 97px; height: 40px; }
.layer1 #mobileCarrierList li.etc .etcL li button { padding-left: 9px; text-align: left; }
.layer1 #mobileCarrierList li.etc .etcL li button:hover { color: #0077ff; }
.layer1 #methodOption { width: 348px; margin: 15px auto 0; font-size: 0; }
.layer1 #methodOption li { display: inline-block; margin-right: 24px; }
.layer1 #methodOption li label { font-size: 14px; color: #4a4e57; line-height: 1.57; letter-spacing: -0.7px; }
.layer1 #authSec { width: 348px; margin: 0 auto; }
.layer1 #authSec .checkboxSec { margin: 17px 0 15px; }
.layer1 #authSec .checkboxSec label { padding-bottom: 2px; font-size: 14px; color: #4a4e57; line-height: 1.57; letter-spacing: -0.7px; }
.layer1 #authSec .alert { font-size: 11px; font-weight: bold; color: #ff6060; line-height: 1.36; letter-spacing: -0.55px; }
.layer1 #authSec .alert1 { margin: -14px 0 8px; }
.layer1 #authSec .alert2 { margin: -3px 0 8px; }
.layer1 .inputSec2 { width: 334px; height: 31px; margin-bottom: 8px; padding: 15px 0 0 12px; border: 1px solid #e5e8eb; color: #17191d; font-size: 14px; font-weight: bold; }
.layer1 .inputSec2.focus { width: 333px; height: 30px; padding: 14px 0 0 11px; border: 2px solid #0077ff; }
.layer1 .inputSec2 input { border: 0; color: #17191d; font-weight: bold; line-height: 1.11; letter-spacing: -0.7px; font-size: 14px; background: transparent; }
.layer1 .inputSec2 input.inputTxt1 { width: 50px; }
.layer1 .inputSec2 input.inputTxt2 { width: 10px; }
.layer1 .paymentCheck { position: absolute; bottom: 90px; left: 16px; }
.layer1 .paymentCheck input { vertical-align: top; }
.layer1 .paymentCheck label { display: inline-block; color: #4a4e57; font-size: 14px; line-height: 1.57; letter-spacing: -0.7px; }
.layer1 .paymentCheck span { display: block; color: #737881; font-size: 12px; line-height: 1.83; letter-spacing: -0.6px; }
.layer1 #authNum { width: 348px; margin: 0 auto; }
.layer1 .inputSec3 { float: left; width: 224px; height: 34px; padding: 12px 12px 0 12px; border: 1px solid #e5e8eb; }
.layer1 .inputSec3.focus { width: 224px; height: 33px; padding: 11px 11px 0 11px; border: 2px solid #0077ff; }
.layer1 .inputSec3 input { float: left; width: 140px; border: 0; font-size: 14px; color: #17191d; font-weight: bold; background: transparent; }
.layer1 .inputSec3 input::placeholder { font-size: 14px; color: #c7c8cc; font-weight: normal; }
.layer1 .inputSec3 input::-webkit-input-placeholder { font-size: 14px; color: #c7c8cc; font-weight: normal; }
.layer1 .inputSec3 input:-ms-input-placeholder { font-size: 14px; color: #c7c8cc; font-weight: normal; }
.layer1 .inputSec3 button.reSend { float: right; margin: 2px 0 0 0; color: #737881; text-decoration: underline; }
.layer1 #authNum a.authBt { float: left; width: 98px; height: 32px; padding-top: 16px; color: #ffffff; background-color: #17191d; font: 14px 'NEXONLv1GothicOTFBold'; text-align: center; }
.layer1 #authNum a.authBt:hover { color: #ffffff; background-color: #363940; }
.layer1 #authNum p { clear: both; padding-top: 4px; color: #737881; font-size: 11px; line-height: 1.36; letter-spacing: -0.55px; font-weight: bold; }
.layer1 .uPlusTxt { padding: 17px 0 18px; color: #4a4e57; font-size: 13px; line-height: 1.69; letter-spacing: -0.65px; text-align: center; }
.layer1 .disableSec #mobileCarrierList, .layer1 .disableSec #methodOption, .layer1 .disableSec #authSec { opacity: 0.4; }
.layer1 .disableSec #mobileCarrierList, .layer1 .disableSec #mobileCarrierList li.etc .more, .layer1 .disableSec #mobileCarrierList li, .layer1 .disableSec #authSec .inputSec2, .layer1 .disableSec #authSec .inputSec3 { background-color: #F2F5F8; border-color: #C7C8CC; }
.layer2 {width:360px;padding-top:40px;}
.layer2 h1 {padding:0px 0 12px;text-align:center;font:16px 'NEXONLv1GothicOTFBold';color:#000000;}
.layer2 h1.alert {padding-top:50px;background:url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/icon_error2.png) no-repeat center top;}
.layer2 h1.check {padding-top:50px;background:url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/icon_confirm.png) no-repeat center top;}
.layer2 p.txt1 {margin:-12px auto 0;padding:10px 0 0px;font-size:13px;line-height:1.54;letter-spacing:-0.65px;text-align:center;color:#4a4e57;}
.layer2 p.txt1 strong {font-weight:normal;color:#0077ff;}
.layer2 .txt2 {width:320px;margin:18px auto 0;padding-top:18px;border-top:1px solid #f2f5f8;font-size:13px;line-height:1.54;letter-spacing:-0.65px;text-align:center;color:#4a4e57;}
.layer2 .txt2 span {color:#0077ff;}
.layer2 dl {width:320px;margin:18px auto 0;border-top:1px solid #f2f5f8;}
.layer2 dl dt, .layer2 dl dd {float:left;font-size:14px;line-height:1.57;letter-spacing:-0.7px;margin-top:14px;word-break:break-all;word-wrap:break-word;}
.layer2 dl dt {clear:both;width:120px;color:#737881;}
.layer2 dl dd {width:200px;color:#4a4e57;}
.layer2 .errorCode {clear:both;float:left;margin:20px 0 0px;padding-left:20px;color:#9fa1a7;}
.layer2 a.info {float:right;margin:20px 0 0px;padding-right:20px;text-decoration:underline;color:#737881;}
.layer2 a.info:hover {color:#0077ff;}
.layer2 .btSec {clear:both;padding:36px 19px 30px;font-size:0;text-align:center;}
.errorLayer { width: 360px; padding-top: 40px; text-align:center;}
.errorLayer h1 { padding-top: 50px; line-height:1.05; font: 16px 'NEXONLv1GothicOTFBold'; color: #000000; }
.errorLayer h1.alert { background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/icon_error2.png) no-repeat center top; }
.errorLayer h1.check { background: url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/icon_confirm.png) no-repeat center top; }
.errorLayer p.txt1 { margin: 0 auto; padding: 10px 20px 0px; font-size: 13px; line-height: 1.54; letter-spacing: -0.65px; text-align: center; color: #4a4e57;} .errorLayer p.txt1 span {display:block;padding-top:10px;color:#0077ff;} .errorLayer p.txt2 {clear:both;float:left;margin:20px 0px 0px;padding-left:20px;color:#9fa1a7;} .errorLayer p.txt2 span {float:left;line-height:1.83;letter-spacing:-0.6px;color:#9fa1a7;} .errorLayer p.txt2 a {float:right;line-height:1.83;letter-spacing:-0.6px;color:#737881;text-decoration:underline;} .errorLayer a.info { float: right; margin: 20px 0px 0px; padding-right: 20px; text-decoration: underline; color: #737881; }
.errorLayer a.info:hover { color: #0077ff; }
.errorLayer .btSec { clear: both; padding: 36px 20px 30px; font-size: 0; text-align: center; }
.ng-hide.ng-hide-animate { display: none !important;}
.eventLayer {position:absolute;width:640px;height:440px;background:url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/img_evlayer.png) no-repeat center -30px;z-index:1000;}
.eventLayer .evCloseBt {position:absolute;top:10px;right:10px;}
.eventLayer .evCloseBt button {display:block;width:42px;height:42px;background:url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/btn_close000_default.png) no-repeat center center;}
.eventLayer .evCloseBt button:hover {background:url(https://ssl.nexon.com/s2/billing/cash/jmn_imgs/nxat/btn_close000_hoverpress.png) no-repeat center center;}