#pages_join {}

#pages_join h2 {font-family:"malgun gothic",dotum;font-size:20px;padding:0 0 10px 0;margin:0 0 30px 0;border-bottom:#999999 solid 3px;}
#pages_join h3 {font-family:"malgun gothic",dotum;font-size:15px;padding:30px 0 10px 0;}
#pages_join .msg {padding:0 0 25px 20px;color:#1C5B8C;font-family:dotum;line-height:150%;}
#pages_join .msg span {font-size:11px;color:#ff0000;}

.join-step2{
    float: left;
    width: 100%;
}
.join-step2 table {
    float: left;
    width: 100%;
    border: 1px solid #ddd;
    border-collapse: collapse;
    margin-bottom: 30px;
}
.join-step2 table caption {display:none;}
.join-step2 table thead {display:none;}
.join-step2 tbody td {
    border: 1px solid #ddd;
    padding: 7px 10px;
}
.join-step2 tbody td:first-child{
    width: 13%;
    background: #f2f2f2;
    text-align: left;
    font-weight: bold;
    font-size: 14px;
}
.join-step2 tbody td .output{
    float: left;
    padding: 7px 11px;
}
.join-step2 tbody td .output:before{
    content: '*';
    float: left;
    margin-right: 2px;
    margin-top: -4px;
}
.join-step2 tbody td .output.err{
    color: #e83434;
}
.join-step2 tbody td .output.ok{
    color: #3ea214;
}
.join-step2 tbody td .input{
    float: left;
    font-size: 14px;
    border: 1px solid #c3c3c3;
    padding: 7px;
    margin: 0;
    outline: none;
}
.join-step2 tbody td .input.tel{
    width: auto;
    float: none;
    margin-right: 5px;
}
.join-step2 tbody td .input.readonly{
    background-color: #f7f7f7;
    cursor: not-allowed;
}
.join-step2 tbody td select{
    float: left;
    font-size: 14px;
    border: 1px solid #c3c3c3;
    padding: 7px;
    margin: 0;
    outline: none;
}
.join-step2 tbody td div {float: left;width: 100%;padding:7px 0 0 0;line-height:150%;}
.join-step2 tbody td div.b{
    color: red;
    font-weight: normal;
}
.join-step2 tbody td .remail {position:relative;top:-3px;left:-2px;color:#111;}
.join-step2 tbody td .btn {margin:1px;}
.join-step2 tbody td .hmsg {font-weight:bold;color:#ff0000;}
.join-step2 tbody td .hmsg .ok {color:#0000ff;}
.join-step2 tbody td .pw_q2 {width:395px;}



.bbs_title{
    float: left;
    width: 100%;
    box-sizing: border-box;
    margin-bottom: 20px;
    font-size: 20px;
    font-weight: bold;
    color: #444;
}
.bbs_title:before{
    content: '';
    float: left;
    width: 9px;
    height: 9px;
    border-radius: 10px;
    border: 3px solid #d81a1a;
    margin: 4px 6px 0 0;
}



.join-wrap{
    float: left;
    width: 100%;
    border: 1px solid #ddd;
    box-sizing: border-box;
    margin-bottom: 30px;
    padding-bottom: 30px;
}
.join-wrap .title{
    float: left;
    width: 100%;
    height: 46px;
    padding: 13px 20px;
    font-size: 13px;
    box-sizing: border-box;
    border-bottom: 1px solid #ddd;
    color: #333;
    background-color: #f5f5f5;
}
.join-wrap .box{
    float: left;
    width: 100%;
    padding: 16px 16px 0 16px;
    box-sizing: border-box;
    display: table;
    table-layout: fixed;
}
.join-wrap .box.half{
    width: 50%;
}
.join-wrap .box .label{
    width: 178px;
    text-align: right;
    padding-right: 30px;
    box-sizing: border-box;
    display: table-cell;
    vertical-align: middle;
}

.join-wrap .box .input-wrap{
    width: calc(100% - 178px);
    display: table-cell;
    vertical-align: middle;
}

.join-wrap .box .input-wrap select{
    float: left;
    width: 50%;
    margin-right: 10px;
    padding: 7px 7px;
    border: 1px solid #dfdfdf;
}

.join-wrap .box .input{
    float: left;
    width: 237px;
    padding: 6px 8px;
    outline: none;
}
.join-wrap .box .input:hover,
.join-wrap .box .input:active{
    background: #fff;
}
.join-wrap .box .input.half{
    float: left;
    width: calc(50% - 18px);
    margin: 9px 0 0 0;
}
.join-wrap .box .caption{
    float: left;
    width: 100%;
    margin: 4px 0 0 4px;
    font-size: 12px;
    color: #b2b2b2;
}
.submitbox{
    float: left;
    width: 100%;
    text-align: center;
    padding: 0 0 20px 0;
}
.submitbox .btn{
    padding: 4px 9px;
    margin: 0 2px;
    background-color: #f8f8f8;
    border: 1px solid #e8e8e8;
    border-radius: 2px;
    cursor: pointer;
}
.submitbox .btn:hover{
    background-color: #f5f5f5;
}
.submitbox .btn:active{
    background-color: #f0f0f0;
}
.submitbox .btn.btn-cancel{

}
.submitbox .btn.btn-signup{
    background-color: #6f6f6f;
    border: 1px solid #646464;
    color: #fff;
}
.submitbox .btn.btn-signup:hover{
    background-color: #797878;
}
.submitbox .btn.btn-signup:active{
    background-color: #636363;
}


@media (max-width: 850px){
    .content{padding: 5px;box-sizing: border-box;}
    .join-step2{padding-bottom: 20px;}
    .join-step2 tbody td:first-child, .join-step2 tbody td:first-child{width: 25%!important;}
    .join-step2 tbody td select.pw_q{width: 100%;}
    .mobile-menu, .search-wrap{display: none;}
