/* 마켓컬리 회원가입 양식 */
body{background-color: #f5f5f5;}
#wrap{
    width: 612px; margin: 0 auto;
    padding: 41px 0 0 ;
}
#wrap h1{margin: 0 0 41px; 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 .user_info{
    margin: 0 0 54px;
    overflow: hidden;
}
#wrap #join_frm .user_info dt{
    width: 120px;
    /* display: inline-block; */
    /* 인라인블록은 기본 margin을 2-3px 내장하고있다. */
    float: left; clear: both;
}
#wrap #join_frm .user_info dt em{font-weight: 600; color: #F00;
}
#wrap #join_frm .user_info dd{
    width: 300px;
    /* display: inline-block; */
    float: left;
    margin: 0 0 11px 0;
}
#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;
}
/* 가입양식 --------------------------------- 버튼 hover 공통 */
#wrap #join_frm .btn_design:hover{background-color: #df15ff !important;}
/* 가입양식 --------------------------------- 1~6 공통 클래스 */
#wrap #join_frm .user_info dd .input_de{
    border: 1px solid #aaa; border-radius: 5px;
    width: 100%; padding: 10px;
}
#wrap #join_frm .user_info dd .input_de:focus{
    border: 1px solid #9E00B7
}
#wrap #join_frm .user_info dd .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; background-color: #9E00B7;
    width: 120px; padding: 10px 0; border-radius: 5px;
    font-size: 0.875rem;
}
/* 가입양식 --------------------------------- 2. 비밀번호 */
#wrap #join_frm .user_info dd #user_pw{}
/* 가입양식 --------------------------------- 3. 비밀번호 확인 */
#wrap #join_frm .user_info dd #user_pw_chk{}
/* 가입양식 --------------------------------- 4. 이름 */
#wrap #join_frm .user_info dd #user_name{}
/* 가입양식 --------------------------------- 5. 이메일 */
#wrap #join_frm .user_info dd #user_email{}
#wrap #join_frm .user_info dd #email_overlap_btn{
    color: #FFF; background-color: #9E00B7;
    width: 120px; padding: 10px 0; border-radius: 5px;
    font-size: 0.875rem; 
}
/* 가입양식 --------------------------------- 6. 휴대폰 */
#wrap #join_frm .user_info dd #agency{
    background: #FFF url(../images/arrow_drop_down.png) no-repeat 29px 14px ;
    width: 50px; padding: 10px;
    border:1px solid #aaa ; border-radius: 5px;
    font-size: 0.75rem; float: left; height: 41px;
}
#wrap #join_frm .user_info dd #agency option{}
#wrap #join_frm .user_info dd #user_phone_num{width:245px;float: right;}
#wrap #join_frm .user_info dd #certified_btn{
    color: #FFF; background-color: #ccc;
    width: 120px; padding: 10px 0; border-radius: 5px;
    font-size: 0.875rem;
}
/* 가입양식 --------------------------------- 7. 주소 */
#wrap #join_frm .user_info dd .adr_search{
    display: block; padding: 10px; text-align: center; margin-bottom: 5px;
    border: 1px solid #9E00B7; border-radius: 5px;
    font-size: 0.875rem;
    background-color: #FFF;
}
#wrap #join_frm .user_info dd p{
    color: #aaa; font-size: 0.875rem;
}
/* 가입양식 --------------------------------- 8. 성별 */
#wrap #join_frm .user_info dd:nth-child(23){padding:10px 0; text-align: center;}
#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{}
#wrap #join_frm .user_info dd label span{
    background-image: url(../images/gender_unchecked.png);
    background-repeat: no-repeat;
    padding-left: 17px;; font-size: 0.875rem;
}/* 선택X */
#wrap #join_frm .user_info dd label .gender:checked+span{
    background-image: url(../images/gender_checked.png);
}/* 체크될 때, 형제 span에 사용 */
#wrap #join_frm .user_info dd label #male{}
#wrap #join_frm .user_info dd label #female{}
#wrap #join_frm .user_info dd label #null{}
#wrap #join_frm .user_info dd label #male,
#wrap #join_frm .user_info dd label #female,
#wrap #join_frm .user_info dd label #null{}
/* 가입양식 --------------------------------- 9. 생년월일 */
#wrap #join_frm .user_info dd .birthday{
    text-align: center; width: 50px; font-size: 0.875rem;
}/* 공통 */
#wrap #join_frm .user_info dd:nth-child(26){
    display: inline-block; text-align: center;
    border: 1px solid #9E00B7; border-radius: 5px; padding: 10px 0;
    background-color: #FFF;
}
#wrap #join_frm .user_info dd .birthday::placeholder{color: #aaa;}
#wrap #join_frm .user_info dd .birthday{border: 1px solid #fff;}
#wrap #join_frm .user_info dd .birthday:focus{border: 1px solid #9E00B7;}
#wrap #join_frm .user_info dd > span{
    color: #aaa; margin: 0 15px;
}
#wrap #join_frm .user_info dd #user_y{}
#wrap #join_frm .user_info dd #user_m{}
#wrap #join_frm .user_info dd #user_d{}
/* 가입버튼 */
#wrap #join_frm #join_btn{
    color: #FFF; background-color: #9E00B7;
    width: 200px; height: 40px; border-radius: 10px;
    font-size: 0.875rem; font-weight: 600;
    display: block;
    margin: 54px auto 0;
}