/*#body { background:url(https://mr-333.com/images/common/login_bg.jpg);background-size:cover;}*/
#body { background:#232323;background-size:cover;}
#body .both { clear:both;}
#body .full-shade { display:none;}
button, input { font-size:1.1em;}
input { -webkit-appearance: none;-moz-appearance: none;appearance: none;border-radius: 0;}
/* 자동완성 스타일 제거 */
input:-webkit-autofill { background-color: transparent !important;color: inherit !important;box-shadow: none !important;border: 1px solid #ccc !important;transition: background-color 5000s ease-in-out 0s;}
input:-webkit-autofill:focus { background-color: transparent !important;box-shadow: none !important;}
.inpt::placeholder { color:#fff;}
.lgn-shade { position:fixed;left:0;top:0;width:100%;height:100%;background:rgba(0,0,0,0.78);}
.lgn-wrp, .join-wrp { width:300px;position:fixed;left:50%;top:50%;transform: translate(-50%,-50%);}
.lgn-wrp .clm, .join-code-frm .clm, .join-wrp .clm { /*margin-bottom:5px;font-size:13px;*/color:#fff;position:relative;}
.lgn-wrp .clm i, .join-wrp .clm i { position:absolute;left:0;height:44px;line-height: 44px;width:40px;text-align: center;}
.lgn-wrp .clm.err i, .join-wrp .clm.err i, .join-wrp .clm.err .inpt { color:#e19a9a;}
.lgn-wrp .clm.err .inpt, .join-code-frm .clm.err .inpt { background:rgba(255,255,255,0.5);}
.lgn-wrp .clm.err .inpt::placeholder, .join-code-frm .clm.err .inpt::placeholder, .join-wrp .clm.err .inpt::placeholder { color:#e19a9a;}
.lgn-wrp .inpt, .join-code-frm .inpt, .join-wrp .inpt { font-weight:200;width:100%;height:44px;line-height: 44px;box-sizing:border-box;padding-left:40px;border:1px solid rgba(255,255,255,0.1);background:rgba(255,255,255,0.21);font-family:'Noto Sans KR', 'sans-serif';color:#fff;}
.lgn-wrp .btn, .join-code-frm .btn, .join-wrp .btn { width:100%;height:44px;border:0;font-size:14px;font-family:'Noto Sans KR', 'sans-serif';}
.lgn-wrp .lgn-btn, .join-wrp .lgn-btn { background:rgba(33,33,33,0.9);color:#fff;}
.lgn-wrp .join-btn, .join-wrp .join-btn { background:rgba(255,255,255,0.9);}
.lgn-wrp .header { height:40px;line-height: 40px;font-weight: bold;color:#fff;text-align: center;font-family: 'Noto Sans KR', 'sans-serif';border:1px solid rgba(0,0,0,0.7);background:rgba(0,0,0,0.5);font-size:14px;}
.join-wrp .header { font-size:22px;color:#fff;text-align: center;font-family: 'Noto Sans KR','sans-serif';margin-bottom:10px;font-weight:bold;}
.join-wrp .clm { margin-bottom:0;}
.join-wrp .clm .inpt { border-bottom:0;font-weight:200;}
.join-wrp .join-btn { background:rgba(33,33,33,0.9);color:#fff;}
.join-wrp .lgn-btn { background:rgba(255,255,255,0.9);color:#000;}
.join-wrp .clm .cut-lne { height:40px;line-height: 40px;position:relative;text-align: center;}
.join-wrp .clm .cut-lne .lne { height:1px;background:rgba(255,255,255,0.1);position:absolute;left:0;width:100%;top:19px;}
.join-wrp .clm .cut-lne .cut-text { height:40px;font-family: 'Noto Sans KR','sans-serif';}
.join-wrp .warning-msg-box { font-family: 'Noto Sans KR', 'sans-serif';font-size:14px;padding:10px;background:rgba(255,255,255,0.45);color:#000;}
.join-wrp .warning-msg-box span { float:left;width:calc(100% - 27px);margin-left:27px;}
.join-wrp .warning-msg-box .header { font-size:14px;text-align: left;color:#000;}
.join-wrp .warning-msg-box .header i { position:static;width:auto;height:auto;line-height: initial;}
.join-wrp .warning-clm { margin:5px 0;}
.join-wrp .button-clm { border:1px solid #bdbdbd21;margin-bottom:5px;}


.join-code-frm { width:300px;position:fixed;left:50%;top:50%;transform:translate(-50%, -50%);font-family:'Noto Sans KR', 'sans-serif';font-weight: bold;font-size:22px;color:#fff;}
.join-code-frm .header { text-align: center;margin-bottom:10px;}
.join-code-frm .inpt { text-align: center;padding-left:0;}
.join-code-frm .btn { background:rgba(33,33,33,0.9);color:#fff;border:1px solid rgba(255,255,255,0.1);border-top:0;border-bottom:0;}
.join-code-frm .lgn-btn { background:rgba(255,255,255,0.9);color:#000;}
.lgn-wrp .header { padding:initial;}
#body .top-border-none { border-top:0;}
.lgn-wrp .lgn-btn, .join-wrp .lgn-btn { border:1px solid rgb(135 135 135 / 10%);border-top:0;}
#body .code-inpt { padding-right:80px;}
.verti-code-btn { height: 28px;width:90px;box-sizing: border-box;position: absolute;right: 10px;top: 8px;background: #6d6d6dcc;border: 1px solid #d9d9d930;color: #fff;font-family:'Noto Sans KR', 'sans-serif';border-radius: 3px;font-size:1em;}
#body .block-inpt { position:absolute;left:-10000000px;}
#body .scala-ani { transform: scale(0.96);}
#body .mg-top-5 { margin-top:30px;}
#body #verti_code { padding-right:135px;}
.time-limit { font-family: 'snsv', 'sans-serif';position: absolute;right: 105px;width: 30px;text-align: center;height: 20px;line-height: 20px;top: 12px;font-size: 1.1em;}
.join-wrp .msg { text-align:center;height: 30px;line-height: 30px;color: #fff;font-family: 'snsv', 'sans-serif';background: #5f2e2ed6;}
#body .join-money { text-align:center;padding:0 5px;width:90px;line-height:26px;height: 28px;padding: 0 5px;box-sizing: border-box;position: absolute;right: 10px;top: 8px;background: #6d6d6dcc;border: 1px solid #d9d9d930;color: #fff;font-family: 'Noto Sans KR', 'sans-serif';border-radius: 3px;font-size: 1em;}
#body .join-money i, #body .full-btn i, #body .verti-code-btn i { position:static;height:auto;line-height: initial;width:auto;}
#body .bank-box { display:none;}
#body .err button { color:#e19a9a;}
#body .join-wrp .clm .full-btn { background: rgba(255, 255, 255, 0.21);border: 1px solid rgba(255, 255, 255, 0.1);text-indent:6px;font-weight:100;text-align: left;color:#fff;}
#body .f-left { float:left;}
#body .f-right { float:right;}
#body .txt-lnk { padding:10px 0;}
#body .txt-lnk a { font-family:"Noto Sans KR", 'sans-serif';color:#fff;}
#body .txt-lnk a.f-right { margin-left:12px;font-size:13px;}
@media (max-width: 1024px) {
    .lgn-wrp, .join-wrp { width:90%;}
}