/* BASIC css start */
#loginWrap { padding-top:100px }
#loginWrap .mlog-sign { height:458px; border:1px solid #e9e9e9; border-top:none }
#loginWrap .mlog-sign .mlog,
#loginWrap .mlog-sign .sign { float:left }
#loginWrap .mlog-sign h3 { padding-top:35px; font-size:18px; color:#363636; font-weight:bold; line-height:18px }
/* member login */
#loginWrap .mlog-sign .mlog { margin-top:44px; padding:0 81px; position:relative; width:386px; height:370px; border-right:1px solid #e9e9e9 }
#loginWrap .mlog-sign .mlog p { padding-top:20px; font-size:11px; color:#adadad }
#loginWrap .mlog-sign .frm-list { padding-top:18px; position:relative; width:386px }
#loginWrap .mlog-sign .frm-list li { position:relative; width: 100%; margin-bottom:6px }
#loginWrap .mlog-sign .frm-list li label { padding-left:11px; position:absolute; top:0; left:0; width:375px; height:50px; color:#adadad; line-height:50px; cursor:text }
#loginWrap .mlog-sign .frm-list li input { padding-left:10px; width:374px; height:48px; line-height:48px; border:1px solid #ddd }
#loginWrap .mlog-sign .btn-mlog { padding-top:10px; position:relative }
#loginWrap .mlog-sign .btn-mlog a { width:384px; height:58px; font-size:16px; line-height:58px }
#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 { margin-top:44px; padding-left:76px; width:386px }
#loginWrap .mlog-sign .sign dl { padding-top:22px }
#loginWrap .mlog-sign .sign dl dt { font-size:11px; color:#adadad }
#loginWrap .mlog-sign .sign dl dd { padding-top:15px }
#loginWrap .mlog-sign .sign dl dd a { width:384px; height:58px; font-size:15px; line-height:58px }

/* simpleLogin */
#simpleLogin { text-align:center; margin-top:10px }
#simpleLogin .sns-login { font-size:0 }
#simpleLogin .sns-login a { display:inline-block; *display:inline; vertical-align:top;position:relative;width:267px;margin-left:6px; *margin-left:9px }
#simpleLogin .sns-login a:first-child { margin-left:0 }


/* --- [·Î±×ÀÎ Æû ¹Ú½º »ó´Ü ¿©¹é Ãß°¡] --- */

/* #loginWrap .mlog-sign¿¡ Á÷Á¢ »ó´Ü ¸¶ÁøÀ» Ãß°¡ÇÏ¿© Á¦¸ñ ¼± ¾Æ·¡·Î ³»¸³´Ï´Ù. */
#loginWrap .mlog-sign { 
    height:458px; 
    border:1px solid #e0d5c6; 
    border-top: 1px solid #e0d5c6; /* »ó´Ü Å×µÎ¸® ÅëÀÏ */
    border-radius: 12px; 
    overflow: hidden; 
    background: #fff; 
    
    /* ¡Ú¡Ú¡Ú [ÇÙ½É ¼öÁ¤] Æû ¹Ú½º ÀÚÃ¼¸¦ ¾Æ·¡·Î ³»¸³´Ï´Ù. ¡Ú¡Ú¡Ú */
    margin-top: 20px !important; 
}


/* ¡Ú¡Ú¡Ú [Ãß°¡] ·Î±×ÀÎ ÆäÀÌÁö Á¦¸ñ ¾Æ·¡ÀÇ °ËÀº ¼± Á¦°Å ¡Ú¡Ú¡Ú */
/* ¼±À» ¸¸µå´Â ¿ä¼Ò¸¦ °­Á¦·Î Á¦°ÅÇÏ¿© ±ò²ûÇÏ°Ô ºÐ¸® */
.xans-content h2, 
.xans-content .heading,
#contents h2 {
    border-bottom: none !important; 
    padding-bottom: 0 !important;
}
#loginWrap .mlog-sign .mlog,
#loginWrap .mlog-sign .sign { 
    float:left; /* ¡Ú ±âÁ¸ float À¯Áö */
    box-sizing: content-box; /* ¡Ú ±âº»°ª À¯Áö */
}
#loginWrap .mlog-sign h3 { 
    padding-top:35px; 
    font-size:18px; 
    color:#4a3f35; /* ¡Ú ´ÙÅ© ºê¶ó¿î ÅØ½ºÆ® */
    font-weight:bold; 
    line-height:18px 
}

/* --- 1. È¸¿ø ·Î±×ÀÎ (¿ÞÂÊ) --- */
#loginWrap .mlog-sign .mlog { 
    margin-top:44px; 
    padding:0 81px; /* ¡Ú ±âÁ¸ ÆÐµù À¯Áö */
    position:relative; 
    width:386px; /* ¡Ú ±âÁ¸ »çÀÌÁî À¯Áö */
    height:370px; /* ¡Ú ±âÁ¸ »çÀÌÁî À¯Áö */
    border-right:1px solid #f0ebe5; /* ¡Ú ºÎµå·¯¿î ±¸ºÐ¼± */
}
#loginWrap .mlog-sign .mlog p { 
    padding-top:20px; 
    font-size:11px; 
    color:#adadad 
}
#loginWrap .mlog-sign .frm-list { 
    padding-top:18px; 
    position:relative; 
    width:386px; /* ¡Ú ±âÁ¸ »çÀÌÁî À¯Áö */
}
#loginWrap .mlog-sign .frm-list li { 
    position:relative; 
    width: 100%; 
    margin-bottom:6px 
}

/* ¡Ú ¶óº§ (ÇÃ·¹ÀÌ½ºÈ¦´õ) ½ºÅ¸ÀÏ (±âÁ¸ ±¸Á¶ À¯Áö) ¡Ú */
#loginWrap .mlog-sign .frm-list li label { 
    padding-left:11px; 
    position:absolute; 
    top:0; 
    left:0; 
    width:375px; /* ¡Ú ±âÁ¸ »çÀÌÁî À¯Áö */
    height:50px; /* ¡Ú ±âÁ¸ »çÀÌÁî À¯Áö */
    color:#aaa; /* ¡Ú ÇÃ·¹ÀÌ½ºÈ¦´õ »ö»ó */
    line-height:50px; 
    cursor:text;
    pointer-events: none; /* ¡Ú Å¬¸¯ Åë°ú (Áß¿ä) */
    z-index: 1; /* input ¾Æ·¡¿¡ ¿Àµµ·Ï */
}
/* ¡Ú input Æ÷Ä¿½º ½Ã ¶óº§ ¼û±è ¡Ú */
#loginWrap .mlog-sign .frm-list li input:focus + label {
    display: none;
}

/* ¡Ú ÀÔ·ÂÃ¢ ½ºÅ¸ÀÏ (±âÁ¸ ±¸Á¶ À¯Áö) ¡Ú */
#loginWrap .mlog-sign .frm-list li input { 
    padding-left:10px; 
    width:374px; /* ¡Ú ±âÁ¸ »çÀÌÁî À¯Áö */
    height:48px; /* ¡Ú ±âÁ¸ »çÀÌÁî À¯Áö */
    line-height:48px; 
    border:1px solid #e0d5c6; /* ¡Ú º£ÀÌÁö Åæ Å×µÎ¸® */
    border-radius: 8px; /* ¡Ú µÕ±Ù ¸ð¼­¸® */
    font-size: 15px; 
    color: #333;
    background: #fff;
    position: relative; /* ¡Ú ¶óº§º¸´Ù À§¿¡ ¿Àµµ·Ï */
    z-index: 2; /* ¶óº§º¸´Ù À§ */
    transition: border-color 0.2s, box-shadow 0.2s;
}

/* ¡Ú ÀÔ·ÂÃ¢ Æ÷Ä¿½º (Å¬¸¯ ½Ã) ¡Ú */
#loginWrap .mlog-sign .frm-list li input:focus {
    border-color: #b59d7f; /* ¡Ú °í±Þ °ñµå»ö Å×µÎ¸® */
    box-shadow: 0 0 5px rgba(181, 157, 127, 0.3);
    outline: none;
    z-index: 3; /* Æ÷Ä¿½º ½Ã ¶óº§º¸´Ù ´õ À§·Î */
}

/* --- ·Î±×ÀÎ ¹öÆ° (±âÁ¸ »çÀÌÁî À¯Áö) --- */
#loginWrap .mlog-sign .btn-mlog { 
    padding-top:10px; 
    position:relative 
}
#loginWrap .mlog-sign .btn-mlog a { 
    width:384px; /* ¡Ú ±âÁ¸ »çÀÌÁî À¯Áö */
    height:58px; /* ¡Ú ±âÁ¸ »çÀÌÁî À¯Áö */
    font-size:16px; 
    line-height:58px;
    /* ¡Ú µðÀÚÀÎ ½ºÅ² Àû¿ë ¡Ú */
    background-color: #4a3f35;
    border: 1px solid #4a3f35;
    color: #fff;
    border-radius: 8px;
    display: block;
    text-align: center;
    transition: all 0.3s ease;
}
#loginWrap .mlog-sign .btn-mlog a:hover {
    background-color: #b59d7f;
    border-color: #b59d7f;
}

/* --- º¸¾ÈÁ¢¼Ó/¾ÆÀÌµðÀúÀå (±âÁ¸ À¯Áö) --- */
#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 
}

/* --- 2. ºñÈ¸¿ø/°¡ÀÔ (¿À¸¥ÂÊ) --- */
#loginWrap .mlog-sign .sign { 
    margin-top:44px; 
    padding-left:76px; /* ¡Ú ±âÁ¸ ÆÐµù À¯Áö */
    width:386px; /* ¡Ú ±âÁ¸ »çÀÌÁî À¯Áö */
}
#loginWrap .mlog-sign .sign dl { 
    padding-top:22px 
}
#loginWrap .mlog-sign .sign dl dt { 
    font-size:11px; 
    color:#adadad 
}
#loginWrap .mlog-sign .sign dl dd { 
    padding-top:15px 
}

/* ¡Ú ºñÈ¸¿ø/°¡ÀÔ ¹öÆ° (±âÁ¸ »çÀÌÁî À¯Áö) ¡Ú */
#loginWrap .mlog-sign .sign dl dd a { 
    width:384px; /* ¡Ú ±âÁ¸ »çÀÌÁî À¯Áö */
    height:58px; /* ¡Ú ±âÁ¸ »çÀÌÁî À¯Áö */
    font-size:15px; 
    line-height:58px;
    /* ¡Ú µðÀÚÀÎ ½ºÅ² Àû¿ë ¡Ú */
    background-color: #b59d7f;
    border: 1px solid #b59d7f;
    color: #fff;
    border-radius: 8px;
    display: block;
    text-align: center;
    transition: all 0.3s ease;
}
#loginWrap .mlog-sign .sign dl dd a:hover {
    background-color: #4a3f35;
    border-color: #4a3f35;
}

/* --- °£Æí ·Î±×ÀÎ (ÇÏ´Ü - flex À¯Áö) --- */
/* (°£Æí ·Î±×ÀÎÀº ±âÁ¸ CSS ÄÚµå°¡ ¾ø¾î¼­, flex µðÀÚÀÎÀÌ °¡Àå ÀûÀýÇÕ´Ï´Ù) */
#simpleLogin { 
    text-align:center; 
    margin-top:10px 
}
#simpleLogin .sns-login { 
    font-size:0;
    display: flex;
    justify-content: center;
    gap: 10px;
}
#simpleLogin .sns-login a { 
    display:inline-block; 
    vertical-align:top;
    position:relative;
    width:auto;
    flex: 1;
    max-width: 267px;
    margin-left:0;
}
#simpleLogin .sns-login a:first-child { 
    margin-left:0 
}
#simpleLogin .sns-login a img {
    width: 100%;
    height: auto;
}



/* BASIC css end */

