/* 회원가입 */
#joinStepFirst-Box {overflow: hidden; width:900px; margin:50px auto; height:auto;}
.joinStepFirst-box-inner {float:left; width:100%;  margin:0 auto; height:auto;}

.joinStepFirst-box-inner h1 {font-size:20pt; font-weight:600; color:#000; padding: 40px 0 10px 12px;}
.p-text-joinStep-t {font-size:11pt; margin-top:10px; font-weight:300; line-height:150%; letter-spacing:-0.8px;}
.p-text-joinStep-ts {font-size:10pt; margin:20px 0 10px 0; font-weight:300; line-height:150%; letter-spacing:-0.8px;}
#line {border-bottom:2px solid #444;}

.joinTopText-box-inner {width:98.8%;  margin:20px auto; padding:0; height:auto; background-color:#f8f8f8; border:2px solid #444;}
.p-text-joinStep-tRed {font-size:11pt; font-weight:400; line-height:150%; padding:15px; letter-spacing:-1px; color:#ff0000;}

.joinStepFirst-box-inner h2 {font-size:12pt; font-weight:400; color:#000; padding: 40px 0 10px 0;}
.text-area-box-textarea {width: 100%; padding: 12px; border: 1px solid #ccc; border-radius: 4px; color:#666; line-height:150%; box-sizing: border-box; resize: vertical; font-size:9pt; height:300px;}
#joinStepFirst-checkBox {width:100%; margin:5px auto; text-align:left;}
.p-text-joinStep-t2 {font-size:9pt; margin-top:5px; font-weight:300; line-height:150%; letter-spacing:-1px;}
.p-text-joinStep-t2-bold {font-size:9pt; margin-top:5px; font-weight:400; line-height:150%; letter-spacing:-1px; color:#000;}

/* 체크박스 */
.checks {position: relative;}
.checks input[type="checkbox"] {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0}
.checks input[type="checkbox"] + label {display: inline-block; position: relative; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none;}
.checks input[type="checkbox"] + label:before {content: ' '; display: inline-block; width: 16px; height: 16px; line-height: 16px; margin: -2px 8px 0 0; text-align: center; vertical-align: middle; background: #fafafa; border: 1px solid #cacece; border-radius : 3px; box-shadow: 0px 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05);}
.checks input[type="checkbox"] + label:active:before,
.checks input[type="checkbox"]:checked + label:active:before {box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1);}
.checks input[type="checkbox"]:checked + label:before {content: '\2714'; color: #666; text-shadow: 1px 1px #fff; background: #e9ecee; border-color: #adb8c0; box-shadow: 0px 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05), inset 15px 10px -12px rgba(255,255,255,0.1);}

/* 라디오버튼 */
.checks {position: relative;}
.checks input[type="radio"] {position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0;}
.checks input[type="radio"] + label {display: inline-block; position: relative; padding-left: 22px; padding-right:20px; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none;}
.checks input[type="radio"] + label:before {content: ''; position: absolute; left: 0; top: -1px; width: 16px; height: 16px; text-align: center; background: #fafafa; border: 1px solid #cacece; border-radius: 100%; box-shadow: 0px 1px 2px rgba(0,0,0,0.05), inset 0px -15px 10px -12px rgba(0,0,0,0.05);}
.checks input[type="radio"] + label:active:before,
.checks input[type="radio"]:checked + label:active:before  {box-shadow: 0 1px 2px rgba(0,0,0,0.05), inset 0px 1px 3px rgba(0,0,0,0.1);}
.checks input[type="radio"]:checked + label:before {background: #E9ECEE; border-color: #adb8c0;}
.checks input[type="radio"]:checked + label:after {content: ''; position: absolute; top: 3px; left: 4px; width: 10px; height: 10px; background: #99a1a7; border-radius: 100%; box-shadow: inset 0px 0px 10px rgba(0,0,0,0.3);}


/* 회원가입여부확인 */
#joinforms-one-inputbox {width:100%; margin:0 auto; text-align:left;}
.tbl-joinforms-one {width:100%; border-collapse:collapse; border-spacing:0; box-sizing:border-box; border-left:1px solid #ccc; border-right:1px solid #ccc; background:#fff}
.tbl-joinforms-one th {padding:10px 10px; border-top:1px solid #ccc; border-right:1px solid #ccc; border-bottom:1px solid #ccc; background-color:#f8f8f8; font-size:10pt; font-weight:400; color:#444; letter-spacing:-0.5px;}
.tbl-joinforms-one td {padding:10px 10px; border-top:1px solid #ccc; border-right:1px solid #ccc; border-bottom:1px solid #ccc; font-size:10pt; font-weight:300; color:#666; letter-spacing:-0.5px;}

.tbl-joinforms-one colgroup .cols-j-o-left {width:15%;}
.tbl-joinforms-one colgroup .cols-j-o-right {width:85%;}

.joinforms-one-input-box {width: 50%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-two-input-box {width: 20%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-one-select-box {width: 15%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-two-select-box {width: 15%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; margin-left:5px; color:#666;}

#joinforms-one-bottom-text {width:100%; margin:20px auto; text-align:left;}
.joinforms-bottom-text-01 {font-size:10pt; text-align:left; color:#444; font-weight:400; letter-spacing:-0.5px; line-height:150%;}
.joinforms-bottom-text-02 {font-size:10pt; text-align:left; color:#666; font-weight:300; letter-spacing:-0.5px; line-height:150%;}

#joinforms-one-btn-box {width:100%; margin:30px auto 80px auto; text-align:center;}
.btn-joinforms-one-button-O {margin:10px 3px 0 3px; border: none; color: #fff; padding: 10px 25px; cursor: pointer; background-color:#444; outline:none;} /* 회원정보입력하기 버튼 */
.btn-joinforms-one-button-C {margin:10px 3px 0 3px; border: none; color: #fff; padding: 10px 25px; cursor: pointer; background-color:#666; outline:none;} /* 이전으로돌아가기 버튼 */


/* 회원정보 입력폼 */
#joinforms-two-inputbox {width:100%; margin:0 auto; text-align:left;}
.tbl-joinforms-two {width:100%; border-collapse:collapse; border-spacing:0; box-sizing:border-box; border-left:1px solid #ccc; border-right:1px solid #ccc; background:#fff}
.tbl-joinforms-two th {padding:10px 10px; border-top:1px solid #ccc; border-right:1px solid #ccc; border-bottom:1px solid #ccc; background-color:#f8f8f8; font-size:10pt; font-weight:400; color:#444; letter-spacing:-0.5px;}
.tbl-joinforms-two td {padding:10px 10px; border-top:1px solid #ccc; border-right:1px solid #ccc; border-bottom:1px solid #ccc; font-size:9pt; font-weight:300; color:#666; letter-spacing:-0.5px; line-height:120%;}

.tbl-joinforms-two colgroup .cols-left {width:15%;}
.tbl-joinforms-two colgroup .cols-right {width:85%;}

.joinforms-second-one-input-box {width: 40%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; height:28px; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-second-two-input-box {width: 20%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; height:28px; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-second-three-input-box {width: 100%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; height:28px; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-second-four-input-box {width: 80%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; height:28px; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-second-five-input-box {width: 20%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; height:28px; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-second-one-select-box {width: 15%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-second-two-select-box {width: 15%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; margin-left:5px; color:#666;}
.btn-joinforms-two-button-D {margin:0 10px 0 5px; border: none; color: #fff; font-size:8pt; padding: 0 5px; height:28px; cursor: pointer; background-color:#444; outline:none;} /* 중복확인 버튼 */
.btn-joinforms-two-button-A {margin:0 10px 0 5px; border: none; color: #fff; font-size:8pt; padding: 0 5px; height:28px; cursor: pointer; background-color:#444; outline:none;} /* 주소검색 버튼 */

#joinforms-two-btn-box {width:100%; margin:30px auto 80px auto; text-align:center;}
.btn-joinforms-two-button-O {margin:10px 3px 0 3px; border: none; color: #fff; padding: 10px 25px; cursor: pointer; background-color:#444; outline:none;} /* 회원정보입력하기 버튼 */
.btn-joinforms-two-button-C {margin:10px 3px 0 3px; border: none; color: #fff; padding: 10px 25px; cursor: pointer; background-color:#666; outline:none;} /* 이전으로돌아가기 버튼 */


/* 회원가입 완료 */
#joinforms-three-Tbox {overflow: hidden; width:100%; margin:30px auto; text-align:center;}
#joinforms-three-Tbox-in {width:98%; margin:0 auto; padding:20px 0; text-align:center; border:1px solid #ccc;}
.h2-text-bold-three {font-size:18pt; color:#000; font-weight:400; letter-spacing:-1px; padding-bottom:20px;}
.p-text-bold-three {font-size:14pt; color:#444; font-weight:300; line-height:150%; letter-spacing:-1px;}
.p-text-bold-three-2 {font-size:13pt; color:#000; font-weight:400; line-height:150%; letter-spacing:-1px;}

#joinforms-three-btn-box {width:100%; margin:30px auto 80px auto; text-align:center;}
.btn-joinforms-three-button-M {margin:10px 3px 0 3px; border: none; color: #fff; padding: 10px 25px; cursor: pointer; background-color:#444; outline:none;} /* 메인으로가기 버튼 */


/* 중복확인 */
.collapsibleDuplication {margin:0 10px 0 5px; border: none; color: #fff; font-size:8pt; padding: 0 5px; height:28px; cursor: pointer; background-color:#444; outline:none;}
.active, .collapsibleDuplication:hover {background-color: #555;}
.collapsibleDuplication:after {content: '\002B'; color:#fff; font-weight: bold; float: right; margin-left: 5px;}
.active:after {content: "\2212";}
.contentDuplication {padding: 0; max-height: 0; overflow: hidden; transition: max-height 0.2s ease-out; background-color: #fff;}
.box-content {margin-top:10px; padding:0; border:4px solid #666; text-align:center;}
.top-con-title {background-color:#666; color:#fff; font-size:13pt; font-weight:300; text-align:center; padding:10px 0;}
.top-con-text01 {color:#444; font-size:10pt; font-weight:300; text-align:center; padding:30px 0 0 0; line-height:140%;}
.top-con-text02 {color:#444; font-size:10pt; font-weight:300; text-align:center; padding:3px 0 20px 0; line-height:140%;}
.top-con-text03 {color:#000; font-size:10pt; font-weight:500; text-align:center; padding:3px 0 15px 0; line-height:140%;}
.top-con-text04 {color:#444; font-size:10pt; font-weight:300; text-align:center; padding:3px 0 5px 0; line-height:140%;}
.btn-use-button {margin:0 10px 20px 5px; border: none; color: #fff; font-size:8pt; padding: 0 5px; height:28px; cursor: pointer; background-color:#444; outline:none;} /* 사용하기 버튼 */
.btn-dupli-button {margin:0 10px 30px 5px; border: none; color: #fff; font-size:8pt; padding: 0 5px; height:28px; cursor: pointer; background-color:#444; outline:none;} /* 중복확인 버튼 */
.collDupli-input-box {width: 40%; padding: 0 10px; border: 1px solid #ccc; margin-top:-30px; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}



/* 아이디, 비밀번호 찾기 */
#idpw-search-inputbox {width:100%; margin:20px auto; text-align:left;}
.tbl-idpw-search {width:100%; border-collapse:collapse; border-spacing:0; box-sizing:border-box; border-left:1px solid #ccc; border-right:1px solid #ccc; background:#fff}
.tbl-idpw-search th {padding:10px 10px; border-top:1px solid #ccc; border-right:1px solid #ccc; border-bottom:1px solid #ccc; background-color:#f8f8f8; font-size:10pt; font-weight:400; color:#444; letter-spacing:-0.5px;}
.tbl-idpw-search td {padding:10px 10px; border-top:1px solid #ccc; border-right:1px solid #ccc; border-bottom:1px solid #ccc; font-size:10pt; font-weight:300; color:#666; letter-spacing:-0.5px;}

.tbl-idpw-search colgroup .col-id-pw-left {width:15%;}
.tbl-idpw-search colgroup .col-id-pw-right {width:85%;}

.idpw-search-one-input-box {width: 50%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.idpw-search-two-input-box {width: 20%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.idpw-search-one-select-box {width: 15%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.idpw-search-two-select-box {width: 15%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; margin-left:5px; color:#666;}

#idpw-search-trans-box {width:99.8%; margin:20px auto; text-align:center; background-color:#f8f8f8; border:1px solid #ccc;}
#idpw-search-trans-box-in {width:96%; padding:20px; text-align:center;}
.p-idpw-search-text01 {font-size:12pt; color:#000; letter-spacing:-0.5px; padding:0 0 20px 0;}
.p-idpw-search-text02 {font-size:10pt; color:#444; font-weight:300; letter-spacing:-0.5px; padding:0 0 20px 0;}

#idpw-search-explain-box {width:100%; margin:20px auto; text-align:left;}
#idpw-search-addition-f-box {width:99%; padding:20px 0; background-color:#f8f8f8; margin:20px auto 10px auto; text-align:center; border:1px solid #ccc;}
.p-idpw-search-text03 {font-size:10pt; color:#444; font-weight:300; letter-spacing:-0.5px; line-height:150%;}
.p-idpw-search-text03-b {font-size:10pt; color:#000; font-weight:400; letter-spacing:-0.5px; line-height:150%;}
.p-idpw-search-text03-b-n {font-size:11pt; color:#000; font-weight:500; letter-spacing:-0.5px; line-height:150%;}
.p-idpw-search-text04 {font-size:11pt; color:#666; font-weight:400; letter-spacing:-0.5px; line-height:150%; margin-bottom:10px;}

#idpw-search-box {width:100%; margin:10px auto 80px auto; text-align:center;}
.btn-idpw-search-Ok {margin:10px 3px 0 3px; border: none; color: #fff; padding: 10px 25px; cursor: pointer; background-color:#444; outline:none;} /* 회원가입, 확인 버튼 */
.btn-idpw-search-cancel {margin:10px 3px 0 3px; border: none; color: #fff; padding: 10px 25px; cursor: pointer; background-color:#666; outline:none;} /* 취소 버튼 */









@media all and (min-width: 800px) and (max-width:992px) { 
#joinStepFirst-Box {width:95%; margin:0 auto 50px auto; height:auto;}
.joinStepFirst-box-inner {width:100%;}
.joinStepFirst-box-inner h1 {font-size:16pt; font-weight:600; color:#000; padding: 40px 0 10px 12px;}

.tbl-joinforms-two colgroup .cols-left {width:16%;}
.tbl-joinforms-two colgroup .cols-right {width:84%;}

.joinforms-second-one-input-box {width: 40%; margin-bottom:5px;}
.btn-joinforms-two-button-D {margin:-5px 10px 0 5px; border: none; color: #fff; font-size:8pt; padding: 0 5px; height:28px; cursor: pointer; background-color:#444; outline:none;} /* 중복확인 버튼 */

.collapsibleDuplication {margin:-5px 10px 0 5px; border: none; color: #fff; font-size:8pt; padding: 0 5px; height:28px; cursor: pointer; background-color:#444; outline:none;}

#idpw-search-box {width:100%; margin:20px auto; text-align:center;}
}


@media all and (min-width: 768px) and (max-width:799px) { 
#joinStepFirst-Box {width:90%; margin:0 auto 50px auto; height:auto;}
.joinStepFirst-box-inner {width:100%;}
.joinStepFirst-box-inner h1 {font-size:16pt; font-weight:600; color:#000; padding: 40px 0 10px 12px;}

.tbl-joinforms-two colgroup .cols-left {width:20%;}
.tbl-joinforms-two colgroup .cols-right {width:80%;}

.collapsibleDuplication {margin:-5px 10px 0 5px; border: none; color: #fff; font-size:8pt; padding: 0 5px; height:28px; cursor: pointer; background-color:#444; outline:none;}
.joinforms-second-one-input-box {width: 85%; margin-bottom:5px;}
.btn-joinforms-two-button-D {margin:-5px 10px 0 5px; border: none; color: #fff; font-size:8pt; padding: 0 5px; height:28px; cursor: pointer; background-color:#444; outline:none;} /* 중복확인 버튼 */

#idpw-search-box {width:100%; margin:10px auto; text-align:center;}
}



@media all and (min-width: 640px) and (max-width:767px) { 
#joinStepFirst-Box {width:95%; margin:0 auto 50px auto; height:auto;}
.joinStepFirst-box-inner {width:100%;}
.joinStepFirst-box-inner h1 {font-size:16pt; font-weight:600; color:#000; padding: 40px 0 10px 12px;}


.tbl-joinforms-two colgroup .cols-left {width:20%;}
.tbl-joinforms-two colgroup .cols-right {width:80%;}

.joinforms-second-one-input-box {width: 85%; margin-bottom:5px;}
.btn-joinforms-two-button-D {margin:-5px 10px 0 5px; border: none; color: #fff; font-size:8pt; padding: 0 5px; height:28px; cursor: pointer; background-color:#444; outline:none;} /* 중복확인 버튼 */

/* 중복확인 */
.collapsibleDuplication {margin:-5px 10px 0 5px; border: none; color: #fff; font-size:8pt; padding: 0 5px; height:28px; cursor: pointer; background-color:#444; outline:none;}
.top-con-title {background-color:#666; color:#fff; font-size:12pt; font-weight:300; text-align:center; padding:10px 10px 15px 10px;}
.top-con-text01 {color:#444; font-size:9pt; font-weight:300; text-align:center; padding:30px 10px 0 10px; line-height:140%; letter-spacing:-0.5px;}
.top-con-text02 {color:#444; font-size:9pt; font-weight:300; text-align:center; padding:3px 10px 20px 10px; line-height:140%; letter-spacing:-0.5px;}
.top-con-text03 {color:#000; font-size:9pt; font-weight:500; text-align:center; padding:3px 10px 15px 10px; line-height:140%; letter-spacing:-0.5px;}
.top-con-text04 {color:#444; font-size:9pt; font-weight:300; text-align:center; padding:3px 10px 5px 10px; line-height:140%; letter-spacing:-0.5px;}
.btn-use-button {margin:0 10px 20px 10px; border: none; color: #fff; font-size:8pt; padding: 0 5px; height:28px; cursor: pointer; background-color:#444; outline:none;} /* 사용하기 버튼 */
.btn-dupli-button {margin:0 3px 30px 3px; border: none; color: #fff; font-size:8pt; padding: 0 5px; height:28px; cursor: pointer; background-color:#444; outline:none;} /* 중복확인 버튼 */
.collDupli-input-box {width: 40%; padding: 0 10px; border: 1px solid #ccc; margin-top:-30px; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}

#idpw-search-trans-box {width:99%; margin:20px auto; text-align:center; background-color:#f8f8f8; border:1px solid #ccc;}
}



@media all and (min-width: 401px) and (max-width:639px) { 
#joinStepFirst-Box {width:90%; margin:0 auto 50px auto; height:auto;}
.joinStepFirst-box-inner {width:100%;}
.joinStepFirst-box-inner h1 {font-size:16pt; font-weight:600; color:#000; padding: 40px 0 10px 12px;}

/* 회원가입여부확인 */
.tbl-joinforms-one,
.tbl-joinforms-one thead,
.tbl-joinforms-one tbody,
.tbl-joinforms-one tr,
.tbl-joinforms-one th,
.tbl-joinforms-one td {display:block}/* 테이블의 모든 요소를 block화 시킴*/
.tbl-joinforms-one {border-top:1px solid #000}
.tbl-joinforms-one tr:after {content:"";display:block;clear:both}/* th,td의 플롯해제 */
.tbl-joinforms-one th {position:relative;border-top:0 none;float:left;width:100%;border-right:0;box-sizing:border-box;}/* ie9에서 float을 줘야함 */
.tbl-joinforms-one td {position:relative;border-top:0 none;float:left;width:100%;border-right:0;box-sizing:border-box;}/* relative를 줘야 사파리에서 다시 키웠을때, 안깨짐*/

.joinforms-one-input-box {width: 100%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-two-input-box {width: 25%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-one-select-box {width: 25%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-two-select-box {width: 25%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; margin-left:5px; color:#666;}

#joinforms-one-bottom-text {width:100%; margin:10px auto; text-align:left;}
#joinforms-one-btn-box {width:100%; margin:30px auto 40px auto; text-align:center;}
.btn-joinforms-one-button-O {margin-top:10px; border: none; color: #fff; padding: 8px 10px; cursor: pointer; background-color:#444;} /* 회원정보입력하기 버튼 */
.btn-joinforms-one-button-C {margin-top:10px; border: none; color: #fff; padding: 8px 10px; cursor: pointer; background-color:#666;} /* 이전으로돌아가기 버튼 */

/* 라디오버튼 */
.checks input[type="radio"] + label {margin-bottom:10px;}

/* 회원정보 입력폼 */
.tbl-joinforms-two,
.tbl-joinforms-two thead,
.tbl-joinforms-two tbody,
.tbl-joinforms-two tr,
.tbl-joinforms-two th,
.tbl-joinforms-two td {display:block}/* 테이블의 모든 요소를 block화 시킴*/
.tbl-joinforms-two {border-top:1px solid #000}
.tbl-joinforms-two tr:after {content:"";display:block;clear:both}/* th,td의 플롯해제 */
.tbl-joinforms-two th {position:relative;border-top:0 none;float:left;width:100%;border-right:0;box-sizing:border-box;}/* ie9에서 float을 줘야함 */
.tbl-joinforms-two td {position:relative;border-top:0 none;float:left;width:100%;border-right:0;box-sizing:border-box;}/* relative를 줘야 사파리에서 다시 키웠을때, 안깨짐*/

.joinforms-second-one-input-box {width: 80.5%; margin-bottom:5px; padding: 0 5px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-second-two-input-box {width: 30%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-second-three-input-box {width: 100%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-second-four-input-box {width: 70%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-second-five-input-box {width: 100%; margin-bottom:5px; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-second-one-select-box {width: 30%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-second-two-select-box {width: 30%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; margin-left:5px; color:#666;}

#joinforms-two-btn-box {width:100%; margin:15px auto 50px auto; text-align:center;}

.h2-text-bold-three {font-size:18pt; color:#000; font-weight:400; letter-spacing:-1px; padding-bottom:20px; padding:0 20px 20px 20px; line-height:120%;}
.p-text-bold-three {font-size:12pt; color:#444; font-weight:300; line-height:150%; letter-spacing:-1px; padding:0 20px 10px 20px; line-height:120%;}
.p-text-bold-three-2 {font-size:13pt; color:#000; font-weight:400; line-height:150%; letter-spacing:-1px; padding:0 20px 0 20px; line-height:120%;}

/* 중복확인 */
.collapsibleDuplication {margin:-5px 10px 0 5px; border: none; color: #fff; font-size:8pt; padding: 0 5px; height:28px; cursor: pointer; background-color:#444; outline:none;}
.top-con-title {background-color:#666; color:#fff; font-size:12pt; font-weight:300; text-align:center; padding:10px 10px 15px 10px;}
.top-con-text01 {color:#444; font-size:9pt; font-weight:300; text-align:center; padding:30px 10px 0 10px; line-height:140%; letter-spacing:-0.8px;}
.top-con-text02 {color:#444; font-size:9pt; font-weight:300; text-align:center; padding:3px 10px 20px 10px; line-height:140%; letter-spacing:-0.8px;}
.top-con-text03 {color:#000; font-size:9pt; font-weight:500; text-align:center; padding:3px 10px 15px 10px; line-height:140%; letter-spacing:-0.8px;}
.top-con-text04 {color:#444; font-size:9pt; font-weight:300; text-align:center; padding:3px 10px 5px 10px; line-height:140%; letter-spacing:-0.8px;}
.btn-use-button {margin:0 10px 20px 10px; border: none; color: #fff; font-size:8pt; padding: 0 5px; height:28px; cursor: pointer; background-color:#444; outline:none;} /* 사용하기 버튼 */
.btn-dupli-button {margin:0 3px 30px 3px; border: none; color: #fff; font-size:8pt; padding: 0 5px; height:28px; cursor: pointer; background-color:#444; outline:none;} /* 중복확인 버튼 */
.collDupli-input-box {width: 40%; padding: 0 10px; border: 1px solid #ccc; margin-top:-30px; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}

/* 아이디, 비밀번호 찾기 */
#idpw-search-trans-box {width:99%; margin:20px auto; text-align:center; background-color:#f8f8f8; border:1px solid #ccc;}
#idpw-search-inputbox {width:100%; margin:20px auto; text-align:left;}
#idpw-search-addition-f-box {width:90%; padding:20px 10px; background-color:#f8f8f8; margin:20px auto 10px auto; text-align:center; border:1px solid #ccc;}
.tbl-idpw-search {width:100%; border-collapse:collapse; border-spacing:0; box-sizing:border-box; border-left:1px solid #ccc; border-right:1px solid #ccc; background:#fff}
.tbl-idpw-search th {padding:10px 10px; border-top:1px solid #ccc; border-right:1px solid #ccc; border-bottom:1px solid #ccc; background-color:#f8f8f8; font-size:10pt; font-weight:400; color:#444; letter-spacing:-0.5px;}
.tbl-idpw-search td {padding:10px 10px; border-top:1px solid #ccc; border-right:1px solid #ccc; border-bottom:1px solid #ccc; font-size:10pt; font-weight:300; color:#666; letter-spacing:-0.5px;}

.tbl-idpw-search colgroup .col-id-pw-left {width:20%;}
.tbl-idpw-search colgroup .col-id-pw-right {width:80%;}

.idpw-search-one-input-box {width: 100%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.idpw-search-two-input-box {width: 30%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.idpw-search-one-select-box {width: 30%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.idpw-search-two-select-box {width: 30%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; margin-left:5px; color:#666;}

.p-idpw-search-text03 {font-size:9pt; color:#444; font-weight:300; letter-spacing:-0.5px; line-height:150%;}
.p-idpw-search-text03-b {font-size:9pt; color:#000; font-weight:400; letter-spacing:-0.5px; line-height:150%;}
.p-idpw-search-text03-b-n {font-size:9pt; color:#000; font-weight:500; letter-spacing:-0.5px; line-height:150%;}
.p-idpw-search-text04 {font-size:9pt; color:#666; font-weight:400; letter-spacing:-0.5px; line-height:150%; margin-bottom:10px;}
}



@media all and (min-width: 320px) and (max-width:400px) { 
#joinStepFirst-Box {width:90%; margin:0 auto 50px auto; height:auto;}
.joinStepFirst-box-inner {width:100%;}
.joinStepFirst-box-inner h1 {font-size:16pt; font-weight:600; color:#000; padding: 40px 0 10px 12px;}

/* 회원가입여부확인 */
.tbl-joinforms-one,
.tbl-joinforms-one thead,
.tbl-joinforms-one tbody,
.tbl-joinforms-one tr,
.tbl-joinforms-one th,
.tbl-joinforms-one td {display:block}/* 테이블의 모든 요소를 block화 시킴*/
.tbl-joinforms-one {border-top:1px solid #000}
.tbl-joinforms-one tr:after {content:"";display:block;clear:both}/* th,td의 플롯해제 */
.tbl-joinforms-one th {position:relative;border-top:0 none;float:left;width:100%;border-right:0;box-sizing:border-box;}/* ie9에서 float을 줘야함 */
.tbl-joinforms-one td {position:relative;border-top:0 none;float:left;width:100%;border-right:0;box-sizing:border-box;}/* relative를 줘야 사파리에서 다시 키웠을때, 안깨짐*/

.joinforms-one-input-box {width: 100%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-two-input-box {width: 30%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-one-select-box {width: 30%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-two-select-box {width: 30%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; margin-left:5px; color:#666;}

#joinforms-one-bottom-text {width:100%; margin:10px auto; text-align:left;}
#joinforms-one-btn-box {width:100%; margin:30px auto 40px auto; text-align:center;}
.btn-joinforms-one-button-O {margin-top:10px; border: none; color: #fff; padding: 8px 10px; cursor: pointer; background-color:#444;} /* 회원정보입력하기 버튼 */
.btn-joinforms-one-button-C {margin-top:10px; border: none; color: #fff; padding: 8px 10px; cursor: pointer; background-color:#666;} /* 이전으로돌아가기 버튼 */


/* 라디오버튼 */
.checks input[type="radio"] + label {margin-bottom:10px;}

/* 회원정보 입력폼 */
.tbl-joinforms-two,
.tbl-joinforms-two thead,
.tbl-joinforms-two tbody,
.tbl-joinforms-two tr,
.tbl-joinforms-two th,
.tbl-joinforms-two td {display:block}/* 테이블의 모든 요소를 block화 시킴*/
.tbl-joinforms-two {border-top:1px solid #000}
.tbl-joinforms-two tr:after {content:"";display:block;clear:both}/* th,td의 플롯해제 */
.tbl-joinforms-two th {position:relative;border-top:0 none;float:left;width:100%;border-right:0;box-sizing:border-box;}/* ie9에서 float을 줘야함 */
.tbl-joinforms-two td {position:relative;border-top:0 none;float:left;width:100%;border-right:0;box-sizing:border-box;}/* relative를 줘야 사파리에서 다시 키웠을때, 안깨짐*/

.joinforms-second-one-input-box {width: 74.5%; margin-bottom:5px; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-second-two-input-box {width: 30%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-second-three-input-box {width: 100%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-second-four-input-box {width: 70%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-second-five-input-box {width: 100%; margin-bottom:5px; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-second-one-select-box {width: 30%; padding: 0 5px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.joinforms-second-two-select-box {width: 30%; padding: 0 5px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; margin-left:5px; color:#666;}

#joinforms-two-btn-box {width:100%; margin:15px auto 50px auto; text-align:center;}

.h2-text-bold-three {font-size:18pt; color:#000; font-weight:400; letter-spacing:-1px; padding-bottom:20px; padding:0 20px 20px 20px; line-height:120%;}
.p-text-bold-three {font-size:12pt; color:#444; font-weight:300; line-height:150%; letter-spacing:-1px; padding:0 20px 10px 20px; line-height:120%;}
.p-text-bold-three-2 {font-size:13pt; color:#000; font-weight:400; line-height:150%; letter-spacing:-1px; padding:0 20px 0 20px; line-height:120%;}

/* 중복확인 */
.collapsibleDuplication {margin:-5px 10px 0 5px; border: none; color: #fff; font-size:8pt; padding: 0 5px; height:28px; cursor: pointer; background-color:#444; outline:none;}
.top-con-title {background-color:#666; color:#fff; font-size:12pt; font-weight:300; text-align:center; padding:10px 10px 15px 10px;}
.top-con-text01 {color:#444; font-size:9pt; font-weight:300; text-align:center; padding:30px 10px 0 10px; line-height:140%; letter-spacing:-0.8px;}
.top-con-text02 {color:#444; font-size:9pt; font-weight:300; text-align:center; padding:3px 10px 20px 10px; line-height:140%; letter-spacing:-0.8px;}
.top-con-text03 {color:#000; font-size:9pt; font-weight:500; text-align:center; padding:3px 10px 15px 10px; line-height:140%; letter-spacing:-0.8px;}
.top-con-text04 {color:#444; font-size:9pt; font-weight:300; text-align:center; padding:3px 10px 5px 10px; line-height:140%; letter-spacing:-0.8px;}
.btn-use-button {margin:0 10px 20px 10px; border: none; color: #fff; font-size:8pt; padding: 0 5px; height:28px; cursor: pointer; background-color:#444; outline:none;} /* 사용하기 버튼 */
.btn-dupli-button {margin:0 3px 30px 3px; border: none; color: #fff; font-size:8pt; padding: 0 5px; height:28px; cursor: pointer; background-color:#444; outline:none;} /* 중복확인 버튼 */
.collDupli-input-box {width: 40%; padding: 0 10px; border: 1px solid #ccc; margin-top:-30px; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}

/* 아이디, 비밀번호 찾기 */
.tbl-idpw-search,
.tbl-idpw-search thead,
.tbl-idpw-search tbody,
.tbl-idpw-search tr,
.tbl-idpw-search th,
.tbl-idpw-search td {display:block}/* 테이블의 모든 요소를 block화 시킴*/
.tbl-idpw-search {border-top:1px solid #000}
.tbl-idpw-search tr:after {content:"";display:block;clear:both}/* th,td의 플롯해제 */
.tbl-idpw-search th {position:relative;border-top:0 none;float:left;width:100%;border-right:0;box-sizing:border-box;}/* ie9에서 float을 줘야함 */
.tbl-idpw-search td {position:relative;border-top:0 none;float:left;width:100%;border-right:0;box-sizing:border-box;}/* relative를 줘야 사파리에서 다시 키웠을때, 안깨짐*/

#idpw-search-trans-box {width:99%; margin:20px auto; text-align:center; background-color:#f8f8f8; border:1px solid #ccc;}
#idpw-search-addition-f-box {width:90%; padding:20px 10px; background-color:#f8f8f8; margin:20px auto 10px auto; text-align:center; border:1px solid #ccc;}
.idpw-search-one-input-box {width: 100%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.idpw-search-two-input-box {width: 30%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.idpw-search-one-select-box {width: 30%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; color:#666;}
.idpw-search-two-select-box {width: 30%; padding: 0 10px; border: 1px solid #ccc; border-radius: 2px; font-size:9pt; color:#666; box-sizing: border-box; resize: vertical; margin-left:5px; color:#666;}

.p-idpw-search-text03 {font-size:9pt; color:#444; font-weight:300; letter-spacing:-0.5px; line-height:150%;}
.p-idpw-search-text03-b {font-size:9pt; color:#000; font-weight:400; letter-spacing:-0.5px; line-height:150%;}
.p-idpw-search-text03-b-n {font-size:9pt; color:#000; font-weight:500; letter-spacing:-0.5px; line-height:150%;}
.p-idpw-search-text04 {font-size:9pt; color:#666; font-weight:400; letter-spacing:-0.5px; line-height:150%; margin-bottom:10px;}
}