/* 마켓컬리 회원가입 양식 */
body {background-color:#f5f5f5;}
#wrap {
    border:3px solid aqua;
    width:612px; margin: 0 auto;/* 정렬 위 가운데 고정, 높이는 내용따라 자동 */
}
#wrap h1 {
    margin:41px 0;
    text-align:center;
}
#wrap h1 a {}
#wrap h1 a img {}
/* 약관 */
#wrap .law {
    height: 200px;
    background-color:#fff;
    padding:10px;
    overflow:auto;
    font-size:0.75rem;
    margin:0 0 54px;
}
#wrap .law h2 {margin-bottom:40px;}
#wrap .law h3 {margin-bottom:20px;}
#wrap .law p {line-height: 1.5;}
/* 가입양식(아이디~생년월일) */
#wrap #join_frm {}
#wrap #join_frm button:hover {
    background-color: #9f00b727 !important; color:#9E00B7 !important; border:1px solid #9E00B7 !important;
}
#wrap #join_frm .user_info {
    margin: 0 0 54px;
    overflow: hidden;
}
#wrap #join_frm .user_info dt {
    /* display:inline-block; */ 
    float:left;
    text-align: left; clear:both;
    width:120px; 
}
#wrap #join_frm .user_info dt em {color:#f00; font-weight: 600;}
#wrap #join_frm .user_info dd {
    float:left;
    width:300px;
    margin: 0 0 11px;
    /* display:inline-block; */
    /* inline-block은 기본 margin을 2-3px 내장하고 있다 */
}
#wrap #join_frm .user_info dd:nth-last-child(2) {
    margin:0;
}
#wrap #join_frm .user_info dd:nth-child(3n) {
    width:120px;
    float:right;
}
/* 공통양식 */
#wrap #join_frm .user_info dd .input_de {
    width:100%;
    padding:10px;
    border:1px solid #aaa;
    border-radius: 5px;
}
#wrap #join_frm .user_info dd .input_de:focus {border:1px solid #9E00B7}
#wrap #join_frm .user_info .input_de::placeholder {
    font-size:0.875rem; color:#aaa;
}
/* 가입양식 -------------------------------------- 1.아이디 */
#wrap #join_frm .user_info dd #user_id {
}
#wrap #join_frm .user_info dd #id_overlap_btn {
    color:#fff;
    font-size:0.875rem;
    border-radius:5px;
    background-color:#9E00B7;
    width:120px; height: 40px;
}
#wrap #join_frm .user_info dd #id_overlap_btn:hover {background-color: #9f00b727; color:#9E00B7; border:1px solid #9E00B7;}
/* 가입양식 -------------------------------------- 2. 비밀번호 */
#wrap #join_frm .user_info dd #user_pw {
}
/* 가입양식 -------------------------------------- 3. 비밀번호 확인 */
#wrap #join_frm .user_info dd #user_pw_check {
}
/* 가입양식 -------------------------------------- 4. 이름 */
#wrap #join_frm .user_info dd #user_name {
}
/* 가입양식 -------------------------------------- 5. 이메일 */
#wrap #join_frm .user_info dd #user_mail {
}
#wrap #join_frm .user_info dd #mail_overlap_btn {
    color:#fff;
    font-size:0.875rem;
    border-radius:5px;
    background-color:#9E00B7;
    width:120px; height: 40px;
}
#wrap #join_frm .user_info dd #mail_overlap_btn:hover {background-color: #9f00b727; color:#9E00B7; border:1px solid #9E00B7;}
/* 가입양식 -------------------------------------- 6. 휴대폰 */
#wrap #join_frm .user_info dd #agency {
    /*  background-image:url(../images/arrow_drop_down\ .png);
    background-repeat:no-repeat;
    background-position:27px 12px; */
    background:#fff url(../images/arrow_drop_down\ .png) no-repeat 27px 10px;
    width: 50px; height: 38px;  padding: 10px;
    border: 1px solid #aaa;
    border-radius: 5px;
    font-size:0.75rem;
    float:left;
}
#wrap #join_frm .user_info dd #agency:hover {border:1px solid #9E00B7;}
#wrap #join_frm .user_info dd #agency option {}
#wrap #join_frm .user_info dd #user_number {
    width: 245px; 
    font-size:0.825rem;
    float:right;
}
#wrap #join_frm .user_info dd #certified_btn {          
    color:#fff;
    font-size:0.875rem;
    border-radius:5px;
    background-color:#ccc; 
    width:120px; height: 40px;
}
#wrap #join_frm .user_info dd #certified_btn:hover {background-color: #9f00b727; color:#9E00B7; border: 1px solid #9E00B7;}   
/* 가입양식 -------------------------------------- 7. 주소 */
#wrap #join_frm .user_info dd .adr_search {
    background:#fff;
    border:1px solid #9E00B7;
    width:300px; padding:10px;
    border-radius: 5px;
    display: inline-block;
    text-align: center;
    font-size:0.875rem;
    margin:  0 0 5px;
}
#wrap #join_frm .user_info dd .adr_search:hover {background-color: #9f00b727; color:#9E00B7}
#wrap #join_frm .user_info dd p {
    font-size:0.875rem;
    color:#aaa;
}
/* 가입양식 -------------------------------------- 8. 성별 */
#wrap #join_frm .user_info dd:nth-child(23) {
    text-align:center;
    padding:9px 0;
}
#wrap #join_frm .user_info dd label {}
#wrap #join_frm .user_info dd label:nth-child(2) {
    margin:0 30px;
}
#wrap #join_frm .user_info dd label .gender {display:none;} /* 공통 */
#wrap #join_frm .user_info dd label .gender:checked + span {
    padding-left: 17px;
    background-image: url(../images/gender_checked.png);
} /* 체크 시 */
#wrap #join_frm .user_info dd label #male {}
#wrap #join_frm .user_info dd label #female {}
#wrap #join_frm .user_info dd label #none {} 
#wrap #join_frm .user_info dd label span {
    background: url(../images/gender_unchecked.png) no-repeat left center;
    padding-left: 17px;
    font-size: 0.875rem;
}
/* 가입양식 -------------------------------------- 9.생년월일 */
#wrap #join_frm .user_info dd:nth-child(26) {
text-align: center;
border: 1px solid #9E00B7;
    border-radius:5px;
    background-color: #fff;
    padding:10px 0;
    font-size: 0.875rem;
}
#wrap #join_frm .user_info dd .birthday {width:50px; text-align:center;border-bottom:1px solid #fff;}
#wrap #join_frm .user_info dd .birthday:focus {border-bottom:1px solid #aaa;}
#wrap #join_frm .user_info dd #user_birth_Y {}
#wrap #join_frm .user_info dd #user_birth_M {}
#wrap #join_frm .user_info dd #user_birth_D {}
#wrap #join_frm .user_info dd > span {}
/* 가입버튼 */
#wrap #join_frm #join_btn {
    margin:0 auto 0;
    color:#fff;
    font-size:0.875rem;
    font-weight: 600;
    border-radius:10px;
    background-color:#9E00B7;
    width:200px; height: 40px;
    display:block;
}