/* BASIC css start */

/* =========================================================
   GUMZZI PC LOGIN - MASTER V1
   ÀÌ¹ÌÁö ·Î°í/´ÙÀÌ¾Æ¸óµå Á¦°Å
   GUMZZI ÅØ½ºÆ® ·Î°í + Pretendard UI
========================================================= */

#content{
    width:1280px;
    margin:0 auto;
}

#loginWrap,
#loginWrap *{
    box-sizing:border-box;
}

#loginWrap{
    padding:72px 0 110px;
    color:#222;
    font-family:'Pretendard', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
}

#loginWrap a{
    color:inherit;
    text-decoration:none;
}

/* ÀüÃ¼ Æø */
#loginWrap .login-shell{
    width:460px;
    margin:0 auto;
}

/* ---------------------------------------------------------
   ºê·£µå ¿µ¿ª
--------------------------------------------------------- */
#loginWrap .login-brand{
    text-align:center;
    margin-bottom:34px;
}

#loginWrap .login-brand-logo{
    font-family:"Times New Roman", Times, serif;
    font-size:34px;
    font-weight:400;
    line-height:1;
    letter-spacing:4px;
    color:#171717;
}

#loginWrap .login-brand-copy{
    margin:14px 0 0;
    color:#8e8984;
    font-size:12px;
    font-weight:400;
    line-height:1.5;
    letter-spacing:-.2px;
}

/* ---------------------------------------------------------
   ·Î±×ÀÎ ¹Ú½º
--------------------------------------------------------- */
#loginWrap .login-panel{
    width:100%;
    padding:0;
    background:#fff;
}

/* ÅÇ */
#loginWrap .login-tabs{
    display:grid;
    grid-template-columns:1fr 1fr;
    width:100%;
    height:42px;
    margin-bottom:30px;
    border:1px solid #e5e1dd;
}

#loginWrap .login-tab{
    display:flex;
    align-items:center;
    justify-content:center;
    border:0;
    background:#fff;
    color:#9a958f;
    font-family:'Pretendard', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-size:12px;
    font-weight:400;
    cursor:pointer;
}

#loginWrap .login-tab + .login-tab{
    border-left:1px solid #e5e1dd;
}

#loginWrap .login-tab.is-active{
    background:#c6aa91;
    color:#fff;
}

/* Á¦¸ñ */
#loginWrap .login-member h2{
    margin:0;
    color:#222;
    font-size:22px;
    font-weight:600;
    line-height:1.35;
    letter-spacing:-.5px;
}

#loginWrap .login-guide{
    margin:10px 0 24px;
    color:#8e8984;
    font-size:12px;
    line-height:1.55;
}

/* fieldset */
#loginWrap fieldset{
    margin:0;
    padding:0;
    border:0;
}

#loginWrap legend{
    position:absolute;
    width:1px;
    height:1px;
    margin:-1px;
    padding:0;
    overflow:hidden;
    clip:rect(0,0,0,0);
    border:0;
}

#loginWrap .login-field{
    margin-bottom:12px;
}

#loginWrap .login-field > label{
    display:none;
}

/* MakeShop input °­Á¦ ÅëÀÏ */
#loginWrap .login-input-wrap input,
#loginWrap .MS_login_id,
#loginWrap .MS_login_pw{
    display:block !important;
    width:100% !important;
    height:48px !important;
    margin:0 !important;
    padding:0 14px !important;
    border:1px solid #dfdcd8 !important;
    border-radius:0 !important;
    outline:none !important;
    background:#fff !important;
    color:#333 !important;
    font-family:'Pretendard', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif !important;
    font-size:13px !important;
    line-height:46px !important;
    box-shadow:none !important;
}

#loginWrap .login-input-wrap input:focus,
#loginWrap .MS_login_id:focus,
#loginWrap .MS_login_pw:focus{
    border-color:#bda48e !important;
}

#loginWrap input::placeholder{
    color:#aaa5a0 !important;
    opacity:1 !important;
}

/* º¸¾ÈÁ¢¼Ó */
#loginWrap .login-options{
    display:flex;
    align-items:center;
    justify-content:space-between;
    margin:10px 0 18px;
}

#loginWrap .security-check{
    display:flex;
    align-items:center;
    gap:6px;
    color:#77716b;
    font-size:11px;
    cursor:pointer;
}

#loginWrap .security-check input{
    width:14px;
    height:14px;
    accent-color:#bda48e;
}

/* ·Î±×ÀÎ ¹öÆ° */
#loginWrap .login-main-button{
    width:100%;
}

#loginWrap .login-submit{
    display:block;
    width:100%;
    height:48px;
    border:1px solid #c5a98f;
    background:#c5a98f;
    color:#fff !important;
    text-align:center;
    font-size:14px;
    font-weight:500;
    line-height:46px;
    transition:background-color .2s ease, border-color .2s ease;
}

#loginWrap .login-submit:hover{
    background:#b99b80;
    border-color:#b99b80;
}

/* ¾ÆÀÌµð/ºñ¹Ð¹øÈ£ Ã£±â */
#loginWrap .login-find{
    margin-top:14px;
    text-align:right;
}

#loginWrap .login-find a{
    color:#77716b;
    font-size:11px;
}

#loginWrap .login-find a:hover{
    color:#222;
}

/* ---------------------------------------------------------
   SNS ·Î±×ÀÎ
--------------------------------------------------------- */
#simpleLogin{
    margin-top:30px;
    text-align:center;
}

#simpleLogin .sns-divider{
    display:flex;
    align-items:center;
    gap:12px;
    margin-bottom:18px;
    color:#aaa49e;
    font-size:11px;
}

#simpleLogin .sns-divider::before,
#simpleLogin .sns-divider::after{
    content:"";
    flex:1;
    height:1px;
    background:#ece8e4;
}

#simpleLogin .sns-login{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:10px;
}

#simpleLogin .sns-login a{
    display:flex;
    align-items:center;
    justify-content:center;
    width:38px;
    height:38px;
    margin:0 !important;
    border-radius:50%;
    overflow:hidden;
    position:relative;
    font-size:0;
}

#simpleLogin .sns-login a img{
    display:none !important;
}

#simpleLogin .sns-mark{
    display:flex;
    align-items:center;
    justify-content:center;
    width:100%;
    height:100%;
    font-family:'Pretendard', -apple-system, BlinkMacSystemFont, 'Segoe UI', sans-serif;
    font-size:15px;
    font-weight:700;
    line-height:1;
}

#simpleLogin .sns-kakao{
    background:#FEE500;
    color:#191919;
}

#simpleLogin .sns-naver{
    background:#03C75A;
    color:#fff;
}

#simpleLogin .sns-apple{
    background:#111;
    color:#fff;
}

#simpleLogin .sns-facebook{
    background:#1877F2;
    color:#fff;
}

/* ---------------------------------------------------------
   È¸¿ø°¡ÀÔ º¸Á¶
--------------------------------------------------------- */
#loginWrap .join-helper{
    display:flex;
    justify-content:center;
    align-items:center;
    gap:8px;
    margin-top:30px;
    padding-top:24px;
    border-top:1px solid #eeeae6;
    font-size:12px;
}

#loginWrap .join-helper p{
    margin:0;
    color:#8d8882;
}

#loginWrap .join-helper a{
    color:#5f5146;
    font-weight:500;
}

#loginWrap .join-helper a:hover{
    text-decoration:underline;
}

/* BASIC css end */

