/* 기본 텍스트 스타일 */
.member_txt {font-size:12px;font-family:굴림,돋움;color:#333333}

/* 텍스트박스 스타일 */
.member_border {font-size:12px;font-family:돋움;color:#666666; border:1px solid #CACACA;}

/* 항목 스타일 */
.member_td_bgcolor {background-color:#F7F7F7;font-size:12px;font-family:돋움;color:#000000;border-right:0}

/* 회원 주민등록번호/여권번호/외국인등록번호/법인번호 확인 스타일 */
ul.member_list {margin:10px 0 0 0;}
ul.member_list li {margin:0 0 15px 0;}
ul.member_list li input {margin:-2px 0 0 0; vertical-align:middle;}
.member_divide {width:100%; font-size:12px; border-top:1px solid #cecece; border-bottom:1px solid #cecece;}
.member_divide th {padding:7px 10px 6px 10px; color:#555; border-right:1px solid #e2e2e2; border-bottom:1px solid #e2e2e2; background:#f7f7f7;}
.member_divide td {padding:5px 10px 4px 10px; border-right:1px solid #e2e2e2; border-bottom:1px solid #e2e2e2;}
.member_divide td.member_list_bg {color:#555; background:#f7f7f7;}
.member_divide td.member_cont {height:170px; padding:15px 10px; vertical-align:top; border-right:none; border-bottom:none;}
.member_info {}
.member_info dl {}
.member_info dt {clear:both; float:left; width:100px; height:13px; margin:0 0 5px 0; padding:4px 0 0 0;}
.member_info dt input {margin:-2px 0 0 0; vertical-align:middle;}
.member_info dt.foreigner_info {width:220px; margin:0;}
.member_info dd {margin:0 0 5px 0;}
.member_info dd.foreigner_info2 {float:left; margin:2px 0 0 0;}

/* table */
.t_m1 {border-collapse:collapse; border-top:2px solid #88A8EC; border-left:1px solid #CECECE;}
.t_m1 td {padding-top:5px; padding-bottom:5px; border-right:1px solid #CECECE; border-bottom:1px solid #CECECE;}
.t_m1 table td {border:none;}




/* 로그인 폼 중앙 정렬 */
.member {
    width: 100%;
    padding: 20px;
    text-align: center; /* 전체 중앙 정렬 */
}


/* 폼 자체 중앙 정렬 */
.member form,
.member > div {
    display: inline-block;
    text-align: left; /* 폼 내부는 왼쪽 정렬 유지 */
    margin: 0 auto 40px auto; /* 하단에 40px 간격 추가 */
}


/* 데스크톱에서 추가 중앙 정렬 보정 */
@media screen and (min-width: 769px) {
    .member {
        display: flex;
        flex-direction: column; /* 세로 배치 */
        justify-content: center;
        align-items: center;
        gap: 40px; /* 폼 사이 간격 */
    }
    
    .member form,
    .member > div {
        display: block;
        margin: 0; /* gap으로 간격 조정하므로 마진 제거 */
    }
}


/* 모바일에서는 기본 설정 유지 */
@media screen and (max-width: 768px) {
    .member {
        padding: 10px;
        display: flex;
        flex-direction: column;
        align-items: center;
        gap: 30px; /* 모바일에서도 gap 사용 */
    }
    
    .member form,
    .member > div {
        width: 100%;
        max-width: 350px; /* 모바일에서 최대 너비 제한 */
        text-align: left;
        margin: 0; /* gap으로 간격 조정하므로 마진 제거 */
    }
}