@charset "utf-8";
ul,ol{list-style:none}
ul {padding-inline-start: 0px;}
.main_login .btn_login,
.main_login .options .chk,
.main_login .wallet li .ic,
.main_login .service li .noti_cnt,
.main_login .service li .noti_cnt em{background:url(/img/sp_login.png) no-repeat}
.input[type="radio"], input[type="checkbox"] {
    margin: 4px 0 0;
    margin-top: 1px \9;
    line-height: normal;
    margin-top: -3px;
}
.main_login{float:left;width: 100%; margin-bottom: 8px;border:1px solid #d8d9de;background-color: #fff;}
.main_login .login_title{position:relative}
.main_login .login_title h2{margin-bottom:9px;font-size:16px;font-weight:normal;color:#dd6568}
.main_login .login_title h2 .material-icons{margin-right:4px;font-size:18px;vertical-align:top}
.main_login .login_before{position:relative;padding:20px 20px 0px;background-color: #fff;}
.main_login .login_before .input_box{position:relative}
.main_login .login_before .input_box ul{padding-right:83px;border-right:none}
.main_login .login_before .input_box li{position:relative;text-align:left}
.main_login .login_before .input_box li label{position:absolute;top:13px;left:11px;font-size:12px;color:#AFAFAF;letter-spacing:-1px;cursor:auto;z-index:2}
.main_login .login_before .input_box li .input_text{position:relative;width:100%;height:41px;margin-top:-1px;padding:0 11px;background-color:#fff;color:#370;font-size:12px;line-height:41px;border:1px solid #e4e4e4;outline:none;letter-spacing:normal}
.main_login .login_before .input_box li .input_text:focus{border:1px solid #DD6568;z-index:1}
.main_login .login_before .input_box li:first-child .input_text{margin-top:0}
.main_login .login_before .input_box .btn_login{display:block;position:absolute;top:0;right:0;width:84px;height:81px;border:none;font-size:0;line-height:0;color:transparent;cursor:pointer;}
.main_login .login_before .input_box .btn_login:hover{opacity:0.8;}
.main_login .login_before .options{overflow:hidden;position:relative;height: 44px;}
.main_login .login_before .options:after{display:table;clear:both;content:''}
.main_login .login_before .options .security{height:30px;margin-top:-5px}
.main_login .login_before .options .security li{float:left;height:30px;line-height:30px;color: #7e878e;font-size:12px;letter-spacing:-0.05em;}
.main_login .login_before .options .security li b{color:#DD6568}
.main_login .login_before .options .security li u{display:inline-block;padding:0 5px;text-decoration:none;color:#ccc}
.main_login .login_before .options .security li.auto{float:right}
.main_login .login_before .register{position:relative;margin:0 -20px 0;background-color:#fff}
.main_login .login_before .register ul{overflow:hidden;border-top: 1px solid #ebeef3;}
.main_login .login_before .register li{float:left;width: 50%;}
.main_login .login_before .register li a{display:block;height:41px;border-left: 1px solid #ebeef3;line-height:40px;text-align:center;color: #7e878e;}
.main_login .login_before .register li a:hover{background-color: rgba(247, 248, 250, 0.7);}
.main_login .login_before .register li:first-child a{border-left:none}
.main_login .login_after{position:relative;padding:20px 20px 0}
/* .main_login .login_after .after_box{height: 124px;} */
.main_login .login_after .thumb_area{float:left;position:relative;width:48px;font-size:0}
.main_login .login_after .thumb_area:after{position:absolute;left:0;top:0;right:0;bottom:0;border-radius:50%;border:1px solid #000;opacity:.1;content:""}
.main_login .login_after .thumb_area img{border-radius:50%}
.main_login .login_after .thumb_area .btn{position:absolute;bottom:-2px;left:-2px;width:28px;height:28px;cursor:pointer}
.main_login .login_after .txt_area{overflow:hidden;padding: 3px 0 0 10px;}
.main_login .login_after .txt_area .acount{margin-bottom:3px;font-size:0}
.main_login .login_after .txt_area .name{display:inline-block;margin-top:1px;color:#232a32;vertical-align:top;font-size:14px}
.main_login .login_after .txt_area .name a{display:inline-block;overflow:hidden;max-width:110px;text-overflow:ellipsis;white-space:nowrap;vertical-align:top;font-weight:bold;color:#232a32}
.main_login .login_after .txt_area .btn{display: inline-block;
    height: 25px;
    position: relative;
    font-family: 'dotum';
    font-size: 11px;
    min-width: 51px;
    margin: 0 0 0 4px;
    line-height: 14px;
    vertical-align: top;
    color: #6A747B;
    text-align: center;
    border: 1px solid #c7cdd6;}
.main_login .login_after .txt_area .btn:hover{border-color:#939EAB}
.main_login .login_after .txt_area .msg{position:relative;overflow:hidden;margin-top:8px;white-space:nowrap;text-overflow:ellipsis;color:#9aa1a7;font-size:12px}
.main_login .login_after .txt_area .edit_lst{margin-top:5px;}
.main_login .login_after .txt_area .edit_lst:after{display:block;clear:both;content:""}
.main_login .login_after .txt_area .edit_lst li{float:left;position:relative;padding-left:8px;margin-left:8px}
.main_login .login_after .txt_area .edit_lst li:after{position:absolute;left:0;top:1px;width:1px;height:12px;background-color:#ececec;content:""}
.main_login .login_after .txt_area .edit_lst li a{display:block;position:relative;color:#6a747d;text-decoration:none;letter-spacing:-1px;cursor:pointer;text-decoration:underline}
.main_login .login_after .txt_area .edit_lst li.info{padding-left:0;margin-left:0}
.main_login .login_after .txt_area .edit_lst li.info:after{display:none}
.main_login .login_after .txt_area .grade_box{margin-top:5px}
.main_login .login_after .txt_area .grade{display:inline-block;height:23px;vertical-align:top}
.main_login .login_after .txt_area .grade .tit{display:inline-block;margin-right:2px;vertical-align:top}
.main_login .login_after .txt_area .grade a{line-height:23px;font-weight:normal;font-size:11px;color:#6a747c;}

.main_login .login_after .txt_area .wallet_box{margin-top:20px}
.main_login .login_after .txt_area .wallet{display:inline-block;height:16px;vertical-align:top}
.main_login .login_after .txt_area .wallet .tit{display:inline-block;margin-right:2px;vertical-align:top}
.main_login .login_after .txt_area .wallet .tit .ic_m{font-size:0;line-height:0;vertical-align:top}
.main_login .login_after .txt_area .wallet .tit strong{position:relative;display:inline-block;font-weight:normal;margin-top:0;line-height:16px;letter-spacing:-1px;vertical-align:top;font-size:11px}
.main_login .login_after .txt_area .wallet a{display:inline-block;margin-top:-3px;letter-spacing:0;word-spacing:-30px;font-family:tahoma;font-size:11px;font-weight:bold;vertical-align:top}
.main_login .login_after .txt_area .wallet a:hover{text-decoration:underline}
.main_login .login_after .txt_area .wallet .tit strong{color:#9e9e9e}
.main_login .login_after .txt_area .wallet.point{margin-right:5px;}
.main_login .login_after .txt_area .wallet.point a{color:#b4b4b4}
.main_login .login_after .txt_area .wallet.cash{margin-left:6px}
.main_login .login_after .txt_area .wallet.cash .tit strong{color:#ff8e00}
.main_login .login_after .txt_area .wallet.cash a{color:#ff8e00}
.main_login .service{position:relative;height:53px}
.main_login .service ul{margin-right:-1px}
.main_login .service ul:after{display:block;clear:both;content:''}
.main_login .service li{float:left;position:relative;width:25%}
.main_login .service li.on{z-index:2}
.main_login .service li.on a{border-color:#949fab;border-bottom-color: rgb(251, 251, 252);background-color:rgba(247, 248, 250, 0.7);}
.main_login .service li:first-child a{margin-left:0;border-left-color: transparent;}
.main_login .service li:last-child a{border-right-color: transparent;}
.main_login .service li a{display:block;position: relative;height: 52px;padding-top: 10px;color: #6a747c;margin-left:-1px;border: 1px solid #ebeef3;border-bottom-color:transparent;text-align:center;}
.main_login .service li a:hover{background-color:rgba(247, 248, 250, 0.7);}
.main_login .service li a .fa{display:block;margin-bottom: 4px;color: #90979c;font-size: 15px;}
.main_login .service li a font{font-size: 11px;color: #767e84;}
.main_login .service li .noti_cnt{position:absolute;top:8px;left:35px;height:15px;padding-left:8px;background-position:-307px -242px; display:none}
.main_login .service li .noti_cnt em{display:block;height:15px;padding-right:8px;background-position:100% -262px;font-family:tahoma,'돋움',Dotum;font-weight:bold;font-size:11px;color:#fff;text-align:center;text-indent:0}

/* input */
textarea{width:100%;height:100px;padding:0 6px;padding:10px;border:1px solid #e0e0e0;background:#FFF;font-size:12px;color:#54575A;vertical-align:middle;outline:none;resize:none}

input[type=text],
input[type=password]{width:100%;height:32px;line-height:32px;padding:0 6px;padding:10px;border:1px solid #e0e0e0;background:#FFF;font-size:12px;color:#54575A;vertical-align:middle;}

input[type=checkbox].checkbox,
input[type=radio].radio{
    opacity:0;
    position:absolute;
    z-index:12;
    width:28px;
    height:24px;
    cursor:pointer;
}
input[type=checkbox].checkbox:checked,
input[type=checkbox].checkbox:focus,
input[type=radio].radio:checked,
input[type=radio].radio:focus{
    outline:none !important;
}
input[type=checkbox].checkbox+.label,
input[type=radio].radio+.label{
    position:relative;
    z-index:11;
    display:inline-block;
    margin:0 2px 0 0;
    line-height:20px;
    min-height:18px;
    min-width:18px;
    font-weight:normal;
    vertical-align:middle;
}
input[type=checkbox].checkbox+.label::before,
input[type=radio].radio+.label::before{
    font-family:fontAwesome;
    font-weight:normal;
    font-size:12px;
    color:#fff;
    content:"\a0";
    background-color:#fff;
    border:1px solid #ddd;
    box-shadow:0 1px 2px rgba(0,0,0,0.05);
    border-radius:0;
    display:inline-block;
    text-align:center;
    vertical-align:middle;
    height:20px;
    line-height:20px;
    min-width:20px;
    margin-right:1px;
}

input[type=radio].radio+.label::before{
    height:20px;
    line-height:20px;
    min-width:20px;
    margin-left:2px;
}

input[type=checkbox].checkbox:checked+.label:before,
input[type=radio].radio:checked+.label:before{
    display:inline-block;
    content:"\f00c";
    background-color:#dd6568;
    border-color:#dd6568;
    box-shadow:0 1px 2px rgba(0,0,0,0.05), inset 0 -15px 10px -12px rgba(0,0,0,0.05), inset 15px 10px -12px rgba(255,255,255,0.1);
}
input[type=checkbox].checkbox:hover+.label::before,
input[type=checkbox].checkbox+.label:hover::before,
input[type=radio].radio:hover+.label::before,
input[type=radio].radio+.label:hover::before{
    border-color:#dd6568;
}
input[type=checkbox].checkbox:active+.label::before,
input[type=checkbox].checkbox:checked:active+.label::before,
input[type=radio].radio:active+.label::before,
input[type=radio].radio:checked:active+.label::before{
    box-shadow:0 1px 2px rgba(0,0,0,0.05), inset 0 1px 3px rgba(0,0,0,0.1);
}
input[type=checkbox].checkbox:disabled+.label::before,
input[type=checkbox].checkbox[disabled]+.label::before,
input[type=checkbox].checkbox.disabled+.label::before,
input[type=radio].radio:disabled+.label::before,
input[type=radio].radio[disabled]+.label::before,
input[type=radio].radio.disabled+.label::before{
    background-color:#f0f0f0 !important;
    border-color:#c9c9c9 !important;
    box-shadow:none !important;
    color:#bbb;
}

input[type=radio].radio+.label::before{
    border-radius:100%;
    font-size:12px;
    line-height:21px;
    height:21px;
    min-width:21px;
}

input[type=checkbox].checkbox.switch{
    width:60px;
    height:30px;
}
input[type=checkbox].checkbox.switch+.label{
    margin:0 4px;
    min-height:30px;
}
input[type=checkbox].checkbox.switch+.label::before{
    content:"ON\a0\a0\a0\a0\a0\a0\a0\a0\a0\a0\a0\a0\a0\a0\a0\a0OFF";
    float:left;
    overflow:hidden;
    box-sizing:border-box;
    margin-right:0px;
    padding:0px;
    width:60px;
    height:30px;
    line-height:28px;
    background-color:#889fae;
    border:1px solid #6d899c;
    border-radius:2px;
    box-shadow:none;
    color:#fff;
    font-family:Arial, Helvertica, sans-serif;
    font-size:11px;
    font-weight:bold;
    text-align:left;
    text-indent:-30px;
    transition:all 0.4s ease;
}
input[type=checkbox].checkbox.switch+.label::after{
    content:"ːːː";
    position:absolute;
    top:0px;
    left:0px;
    box-sizing:border-box;
    padding:4px 0px 0px;
    width:30px;
    height:30px;
    background:#f7f7f7;
    background:linear-gradient(to bottom,  #f7f7f7 0%,#e5e5e5 100%);
    border-top:1px solid #e4e4e4;
    border-right:none;
    border-bottom:1px solid #c3c3c3;
    border-left:1px solid #cecece;
    boder-top-right-radius:0px;
    border-bottom-right-radius:0px;
    border-top-left-radius:2px;
    border-bottom-left-radius:2px;
    color:#5b6a73;
    font-family:Arial, Helvertica, sans-serif;
    font-size:12px;
    font-weight:lighter;
    line-height:18px;
    text-align:center;
    text-shadow:-1px 0 0 rgba(0,0,0,0.2);
    transition:all 0.4s ease;
}
input[type=checkbox].checkbox.switch:checked+.label::before{
    text-indent:5px;
    background-color:#5791d7;
    border-color:#4b79ad;
}
input[type=checkbox].checkbox.switch:checked+.label::after{
    left:32px;
    border-right:1px solid #cecece;
    border-left:none;
    boder-top-right-radius:2px;
    border-bottom-right-radius:2px;
    border-top-left-radius:0px;
    border-bottom-left-radius:0px;
}
input.checkbox.readonly[type="checkbox"] + .label:before,
input.radio.readonly[type="radio"] + .label:before{
    background:#e1e1e1;
}

input[type="text"],
input[type="password"]{
    border:1px solid #e1e4e8;
    background:#fff;
    height:30px;
    padding:0 10px;
    appearance:none;
    -webkit-appearance:none;
    font-size:12px;
}
input[type="text"].inp_date{font-size:11px}
input[type="text"]::-webkit-input-placeholder{color:#9a9fa2;line-height:normal !important;}
input[type="password"]::-webkit-input-placeholder{line-height:normal !important;}
input[type="text"]{line-height:normal !important;}
input[type="password"]:-ms-input-placeholder{line-height:normal !important;}
input[type="text"]{line-height:normal !important;}
input[type="password"]::-moz-placeholder{line-height:normal !important;}
input[type="text"]{line-height:normal !important;}
input[type="password"]:-moz-placeholder{line-height:normal !important;}

select{
    border:1px solid #e1e4e8;
    height:30px;
    vertical-align:middle;
    padding:0 10px;
    font-size:12px;
    background-color:#fff;
}
.type-area{
    border:1px solid #ccc;
    padding:10px;
    font-size:12px;
}

.inp_check{display:inline-block;vertical-align:middle}
.inp_check label{display:inline-block;font-size:12px;color:#6a747c;vertical-align:top}
.inp_check .p{font-size:11px;font-family:tahoma;font-weight:bold}
.inp_check input{margin:1px 4px 0 0;vertical-align:top}
.inp_check+.inp_check{margin-left:8px}

.ic_cate {
    display:inline-block;
    width:30px;
    height:17px;
    padding:0 2px;
    font-family:arial;
    line-height:16px;
    font-size:10px;
    font-weight:bold;
    border-radius:2px;
    border:1px solid #ddd;
    vertical-align:middle;
    text-align:center;
}
.ic_cate.news{border:1px solid #9a9a9a;color:#fff;background-color:#ababab;text-shadow:0 0 1px #a0a0a0}
.ic_cate.premium{width:26px;height:15px;line-height:14px;color: #dd6568;text-shadow: none;border-color: #dd6568;}

.ic_m{display:inline-block;width:13px;height:17px;vertical-align:middle;background:url(/img/sp_point.png) no-repeat;font-size: 1px;color: transparent;}

em.ic_m.ic_point {}

em.ic_m.ic_point {}
.ic_m.ic_cach{background-position:0 0}
.ic_m.ic_point{background-position:-30px 0}
.ic_m.ic_heart{width:16px;background-position:-63px 1px}

.blind{display:block;overflow:hidden;position:absolute;top:-1000em;left:0;width:0;height:0;font-size:0;line-height:0;z-index:-1;}