/* 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 */
    .sns-login-wrapper {
        display: flex;
        flex-direction: column;
        align-items: center;
        border: 1px solid #e9e9e9;
        border-top: none;
        background: #f9f9f9;        
    }

    .sns-title {
        font-size: 22px;
        font-weight: bold;
        margin: 50px 0px 20px 0px;
        text-align: center;
    }

    .sns-login {
        display: flex;
        gap: 10px;
        flex-wrap: wrap;
        justify-content: center;
        margin-bottom: 50px;
    }

    .sns-box {
        width: 350px;
        height: 60px;
        display: flex;
        align-items: center;
        justify-content: center;
    }

    .sns-box a {
        display: flex;
        align-items: center;
        gap: 12px;
        text-decoration: none;
        padding: 10px 16px;
        border-radius: 4px;
    }

    .sns-icon img {
        height: 24px;
        width: auto;
    }

    /* 카카오 박스 */
    .sns-box.kakao {
        background-color: #fedc00;
        border: 1px solid #fedc00;
    }

    .sns-text.kakao-text {
        color: #371c1d;
        font-weight: 700;
        font-size: 18px;
        transition: transform 0.2s ease;
    }

    .sns-box.kakao a:hover .sns-text {
        transform: scale(1.05);
    }

    /* 네이버 박스 */
    .sns-box.naver {
        background-color: #00c63b;
        border: 1px solid #00c63b;
    }

    .sns-text.naver-text {
        color: #fff;
        font-weight: 700;
        font-size: 18px;
        transition: transform 0.2s ease;
    }

    .sns-box.naver a:hover .sns-text {
        transform: scale(1.05);
    }
/* BASIC css end */