/* BASIC css start */
.notice { padding:0 0 20px; font-size:16px; line-height:22px; text-align:center }
#bannerBot { margin-top: -200px; height: 90px; z-index: -1; position: absolute; }

#loginWrap {}
#loginWrap .mlog-sign { margin:auto; position:relative; width:540px; text-align:center; line-height:1 }
#loginWrap .mlog-sign .mlog-tit {padding: 100px 0 50px; text-align: center; }
#loginWrap .mlog-sign .mlog-tit h2 { font-size:40px; font-weight:bold; font-family:Malgun Gothic,"¸¼Àº °íµñ", sans-serif; line-height:1 }
#loginWrap .mlog-sign .mlog-tit h3 {font-size: 30px;font-weight: 500; letter-spacing: -.5px; color: #000;}

#loginWrap .mlog-sign .mlog-tab {border-bottom: 1px solid #E0E2E5; display:flex; position:relative; width:100%; justify-content:space-between; margin-bottom: 50px;}
#loginWrap .mlog-sign .mlog-tab li { width:267.5px; line-height:18px;  }
#loginWrap .mlog-sign .mlog-tab li a { display: block; height: 46px;font-size: 16px; color: #6A6A6A; font-weight: 400; text-align: center; line-height: 46px; }
#loginWrap .mlog-sign .mlog-tab li.on {  border-bottom: 2px solid #000000; margin-bottom: -1px; }
#loginWrap .mlog-sign .mlog-tab li.on a {color: #000;font-weight: 500;}

/* member login */
#loginWrap .mlog-sign .mlog-box { display:none }
#loginWrap .mlog-sign #orderLogin { display:block; margin-bottom: 50px;}
#orderLogin{}
#orderLogin fieldset{display: flex; justify-content: space-between;}
#loginWrap .mlog-sign .mlog { }
#loginWrap .mlog-sign .mlog .login_box{display: flex; justify-content: space-between;}

#loginWrap .mlog-sign .frm-list { width:383px;display: flex; align-content: space-around; flex-direction: column; justify-content: space-between; height: 99px;}
#loginWrap .mlog-sign .frm-list li label { display:none }
#loginWrap .mlog-sign .frm-list li input {
    color: #6A6A6A;
    padding: 0 0 0 20px;
    width: 100%;
    height: 44px;
    font-size: 16px;
    line-height: 44px;
    box-sizing: border-box;
    background: #F6F6F6;
    border: 0;
    border-radius: 0;}
#loginWrap .mlog-sign .frm-list li input::placeholder { 
    color: #6A6A6A;
    background: #F6F6F6;}

#loginWrap .mlog-sign .login_management_box { padding:16px 0 0 0; width:100%; *zoom:1; position: relative; display: block; }
#loginWrap .mlog-sign .login_management_box:after { display:block; clear:both; content:'' }
#loginWrap .mlog-sign .login_management_box .id_save { float:left }
#loginWrap .mlog-sign .login_management_box .id_save label { 
    font-size: 12px;
    color: #6A6A6A;
    line-height: 1;
    letter-spacing: -0.5px;
    font-weight: 500;}

#loginWrap .mlog-sign .login_management_box .id_find { float:right }
#loginWrap .mlog-sign .login_management_box .id_find li { padding:0 10px; position:relative; float:left }
#loginWrap .mlog-sign .login_management_box .id_find li:after { position:absolute; top:48%; left:0; width:1px; height:17px; transform:translateY(-50%); background:#ababab; content:'' }
#loginWrap .mlog-sign .login_management_box .id_find li:first-child:after { display:none }
#loginWrap .mlog-sign .login_management_box .id_find li:last-child { padding-right:0 }
#loginWrap .mlog-sign .login_management_box .id_find li a { display:block; font-size:16px; color:#585858; line-height:26px }

#loginWrap .mlog-sign .btn-mlog {
    position: relative;
    width: 142px;
    height: 99px;}
    
#loginWrap .mlog-sign .btn-mlog .loginBtn {
    display: block;
    height: 99px;
    font-size: 16px;
    color: #fff;
    font-weight: 500;
    text-align: center;
    line-height: 99px;
    background: #000;}

#loginWrap .mlog-sign .se-log { position:relative; color:#666 !important }
#loginWrap .mlog-sign .se-log label { font-size:11px }
#loginWrap .mlog-sign .se-log label input { margin-top:-3px; *margin-top:-4px; vertical-align:middle }

/* sign */
#loginWrap .mlog-sign .sign { padding:15px 0; position: absolute; right: 0; top: 0; }
#loginWrap .mlog-sign .sign span { font-size:16px; color:#585858 }
#loginWrap .mlog-sign .sign strong { font-weight:500 }
#loginWrap .mlog-sign .sign a { 
    display: inline-block;
    padding: 0 9px;
    position: relative;
    font-size: 12px;
    color: #6A6A6A;
    font-weight: 500;}
    
#loginWrap .mlog-sign .sign a:before {
    position: absolute;
    top: 1px;
    left: 0;
    width: 1px;
    height: 15px;
    background: #6A6A6A;
    content: '';}
#loginWrap .mlog-sign .sign a:first-child:before { display:none }

/* simpleLogin */
#simpleLogin { padding:20px 0 0 }
#simpleLogin p { position:relative; font-size:15px; color:#d7d7d7; font-weight:500 }
#simpleLogin p:before,
#simpleLogin p:after { position:absolute; top:6px; left:0; width:115px; height:1px; background:#d7d7d7; content:'' }
#simpleLogin p:after { left:auto; right:0 }
#simpleLogin .sns-login {padding: 30px 0 40px;}
#simpleLogin .sns-login ul { display:flex;justify-content: space-between; flex-direction: column; }
#simpleLogin .sns-login li{margin-bottom: 10px;}
#simpleLogin .sns-login li img { width:100% }


#simpleLogin .sns-login li:nth-child(1) img{
    background: #06BE34;}
#simpleLogin .sns-login li:nth-child(2) img{
    background: #FAE100}




#simpleLogin .sns-login li span { display:none; padding:12px 0; font-size:16px }

/* order shopping */
#loginWrap .order-sp {  }
#loginWrap .order-sp .btn_center_box { padding-top:10px }
#loginWrap .order-sp .btn_center_box a { display:block; height:44px; font-size:18px; color:#fff; font-weight:500; text-align:center; line-height:44px; background:#28bab8 }
#loginWrap .order-sp .btn-mlog {}
#loginWrap .order-sp .js_caution_msg2 {  margin-top:13px; padding:0 0 0 20px; font-size:15px; color:#717171; text-align:left; line-height:20px; background:url(/design/mhmall2023/member/icon_caution.png) 0 2px no-repeat }


input[type=checkbox]{
    position: relative;
    width: 18px;
    height: 18px;
    line-height: 1;
    margin-top: -2px;
    -webkit-appearance: none !important;
    outline: 0;
    margin-left: 10px;
    margin-right: 4px;}
input[type=checkbox]:before{
    background: url(/design/mhmall2023/2025_renewal/pc/img/check.svg) no-repeat;
    background-size: 16px auto;
    content: "";
    font-size: 12px;
    text-align: center;
    position: absolute;
    left: -1px;
    top: 0px;
    z-index: 1;
    width: 16px;
    height: 16px;
    line-height: 16px;
    -webkit-transition: .3s ease-in-out;
    transition: .3s ease-in-out;}
input[type=checkbox]:checked:before{background: url(/design/mhmall2023/2025_renewal/pc/img/check_on.svg) no-repeat;
    content: "";
    background-size: 16px auto;}
input[type=checkbox]:after{display:none;content:"";position:absolute;top:-1px;left:-2px;width:16px;height:16px;background:#fff;border:2px solid #ccc;border-radius:3px;cursor:pointer;-webkit-transition:.3s ease-in-out;transition:.3s ease-in-out}
input[type=checkbox]:checked:after{background: #00aa6c;border: 2px solid #00aa6c;}




.join_area{
    border-top: 1px solid #E0E2E4;
    display: flex;
    justify-content: space-between;
    padding-top: 50px;
    padding-bottom: 70px;}
.join_area .msg{font-size: 16px;font-weight: 400;line-height: 1.4;margin-top: 3px;}
.join_area .msg em{font-weight: 600;line-height: 1.6;}

.join_area a{
    font-weight: 500;
    position:relative;
    width: 243px;
    height: 56px;
    line-height: 56px;
    background: #E0E2E5;
    display: inline-block;
    color: #000;
    font-size: 16px;}
    
.join_area a span{position: absolute;
    font-size: 12px;
    color: #fff;
    width: 224px;
    line-height: 32.21px;
    background: #FE5F57;
    border-radius: 304.2px;
    height: 32.21px;
    box-shadow: 0px 4px 4px 0px #00000040;
    left: 10px;
    top: -25px;}
    
.join_area a span:after{
    content: "V";
    font-size: 0;
    position: absolute;
    top: 21.12px;
    left: 98.83px;
    width: 0;
    height: 0;
    opacity: 1;
    border-left: 16.1649px solid transparent;
    border-right: 16.1649px solid transparent;
    border-top: 15.7911px solid #FE5F57;}
/* BASIC css end */