/* 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:386px;margin-left:6px; *margin-left:9px }
#simpleLogin .sns-login a:first-child { margin-left:0 }
#simpleLogin .sns-login a img { width:272px }
#simpleLogin .sns-login span { position:absolute; left:50%; top: -22px; margin-left: -40px; }
#simpleLogin .sns-login span img { width: 80px !important;}


/* 부모 요소 설정 */
.sns-login ul {
    display: flex; /* Flexbox 레이아웃 사용 */
    justify-content: space-between; /* 버튼 사이 여백 균등 분배 */
    list-style: none; /* 기본 리스트 스타일 제거 */
    padding: 0;
    margin: 0;
    gap: 0px; /* 버튼 사이 간격 */
}

/* 버튼 공통 스타일 */
.sns-login ul li {
    flex: 1; /* 버튼 크기를 동일하게 설정 */
    text-align: center;
}

/* 카카오 버튼 스타일 */
.kakao a {
    background: url(/design/buddy4772/mobile_vitaline/renewal_img/kakao.png) no-repeat center left 20px;
    background-size: 30px;
    height: 60px;
    line-height: 60px;
   
    font-weight: bold;
    color: #111;
    background-color: #fae300;
    text-align: center;
    font-size: 15px;
    display: block;

    border: 0px solid #dfdfdf;
}

/* 네이버 버튼 스타일 */
.naver a {
 background: url(/images/d3/m_01/icon/ico_sns_naver.gif) no-repeat center left 20px;
    background-size: 22px;
 position: relative;
    height: 60px;
    line-height: 60px;
    font-weight: bold;
    color: #666;
    background-color: #fff;
    text-align: center;
    font-size: 15px;
    display: block;
    border: 1px solid #dfdfdf;
}
/* BASIC css end */