/* BASIC css start */
#join .MK_ok_confirm {color: #1984f1;}
#join .MK_no_confirm {color: #f1191f;}
#join .sequence {height:100px; text-align:center;}
#join .sequence li {display: inline-block; margin: 0 12px;}
#join .sequence li .fa-stack {display:block; margin:20px auto 0;}
#join .sequence li .fa-circle {color: #858585;}
#join .sequence li.now {color:#ab3e41;}
#join .sequence li.now .fa-circle {color:#ab3e41;}
#join .join {background-color: #eaeaea; padding:0 5px 20px 5px;}
#join .join .tableBox {padding:10px 0; background-color: #fff; margin-bottom:10px;}
#join .join .tableBox:last-child {margin-bottom:0;}
#join .join .tableBox table {width:100%; }
#join .join .tableBox table:first-child {margin-top:0;}
#join .join .tableBox table th {text-align:left; vertical-align: top; padding:17px 0 0 10px;}
#join .join .tableBox table td {padding:10px 10px 10px 0; position:relative;}
#join .join .tableBox table td p {font-size:0.917em; margin-top: 5px; color:#707070;}
#join .join .tableBox table td.birth select {margin:0 5px 10px 0; width: 29%;}
#join .join .tableBox table td.birth .MS_input_txt {width: 27%;}
#join .join .tableBox table tr.birth dl.type1:after { clear:both; display:block; content:''; }
#join .join .tableBox table tr.birth dl.type1 dd { float:left; width:30%; }
#join .join .tableBox table tr.birth dl.type1 dd:first-child { width:40%; }
#join .join .tableBox table tr.birth dl.type1 dd:nth-child(2) .box-select,
#join .join .tableBox table tr.birth dl.type1 dd:nth-child(3) .box-select { margin-left:5px; }
#join .join .tableBox table tr.birth dl.type2:after { clear:both; display:block; content:''; }
#join .join .tableBox table tr.birth dl.type2 dd { position:relative; float:left; width:30%; }
#join .join .tableBox table tr.birth dl.type2 dd ul li { margin: 0 6px 0 0 }
#join .join .tableBox table tr.birth dl.type2 dd:first-child { width:40%; }
#join .join .tableBox table tr.birth dl.type2 dd:nth-child(2) div,
#join .join .tableBox table tr.birth dl.type2 dd:nth-child(3) div { margin-left:5px; }
#join .join .tableBox table tr .fc-blue {display:none;}
#join .join .tableBox table tr.gender dl:after { clear:both; display:block; content:''; }
#join .join .tableBox table tr.gender dl dd { float:left; width:49%; }
#join .join .tableBox table tr.gender dl dd:first-child{display:none;}
#join .join .tableBox table tr.gender dl dd:nth-child(2) label { margin-left:5px; }
/*
#join .join .tableBox table tr.gender dl dd label { display:block; width:100%; height:35px; line-height:37px; border:1px solid #bbb; text-align:center; background:#fff; }
#join .join .tableBox table tr.gender dl dd label.on { color:#fff; border:1px solid #bbb; background:#636363; }
#join .join .tableBox table tr.gender dl dd label .input-radio { display:none; width:0 !important; height:0 !important; }
*/
#join .join .tableBox table .MS_input_tel,
#join .join .tableBox table .MS_input_sms {width: 80% !important;}
#join .join .tableBox table .txt-input {width:100%; box-sizing: border-box;    outline: 0;}
#join .join .tableBox table .txt-input[name=haddress1] {margin-bottom:10px;}
#join .join .tableBox table #email1 {width: 35% !important;}
#join .join .tableBox table #email1 {width: 35% !important;}
#join .join .tableBox table #hphone1,
#join .join .tableBox table #hphone2,
#join .join .tableBox table #hphone3,
#join .join .tableBox table #etcphone1,
#join .join .tableBox table #etcphone2,
#join .join .tableBox table #etcphone3 {width: 29% !important;}
#join .join .tableBox table .btn { display:block; position:absolute; top:0; right:10px; width:18%; height:34px; line-height:36px; font-size:0.75em; font-weight:bold; color:#fff; border:1px solid #ddd; background:#636363; text-align:center; }
#join .join .every-agree {padding: 10px 0 10px 0; background-color: #fff; font-weight: bold; color: #BD3D3D;}
#join .pd10 {margin-top: 20px;}
#join .step-comm {display:none;}
#join .layer .keyword input {width:45%;}
#join .layer .msg01 {text-align: center;}
#join .layer .msg-wrap {background-color: #fbfbfb; padding:10px 0; text-align: center;}
#join .layer .msg-wrap .msg01-highlight {color:#1984f1;}
#join .layer #searchStep02 {margin-top:10px;}
#join .layer #searchStep02 h4 {font-weight: bold;}
#join .layer #searchStep02 .btn_Black {margin-top:10px;}
#join .layer #searchStep03 table {width:100%;}
#join .layer #searchStep03 table th {width:20%; text-align: left;}
#join .layer #searchStep03 table td {padding:10px 0;}
#join .layer #searchStep03 table .detail-addrPost input {width:50px;}
#join .layer #searchStep03 table .detail-addrAddress input {width:90%; margin-bottom: 5px;}
#join .desc-2 {background-color: #fff; padding:20px 10px; margin-top:10px;}
#join .desc-2 dl {margin-bottom:20px;}
#join .btn-txt-view {border:1px solid #c7c7c7; padding:4px 10px; float: right;}
#layerTermsWrap, #layerPrivercyWrap, #layerTermsWrap-A, #layerTermsWrap-B, #layerTermsWrap-C, #layerTermsWrap-D {display:none;}
#layerTermsWrap .txt, #layerPrivercyWrap .txt, #layerThirdPartyWrap .txt, #layerTrustWrap .txt {padding: 15px 10px; }
#join .layerArea .layer-pop {width:90%; background-color: #fff; position: relative; box-shadow: 0px 1px 10px #494949; margin:80px auto;}
#layerTermsWrap .layer .layer-pop, #layerTerms-A, #layerTerms-B, #layerTerms-C, #layerTerms-D {width:90%; background-color: #fff; position: relative; box-shadow: 0px 1px 10px #494949; margin:80px auto;}
#layerTermsWrap .layer .txt, .layerArea .layer-pop .txt {max-height: 300px; overflow-y: auto; padding:10px;background-color: #fff;}
#join .layerArea .layer-pop h3 {background-color: #efefef; height: 36px; line-height: 36px; font-weight: bold; padding: 0 10px; }
#join .layerArea .layer-pop .btns { margin: 25px 0; padding: 0 15px; }
.layer-pop .btns .btn-type-03, .layer-pop .btns .btn-type-04 { padding: 7px 20px; }
#join .layerArea .layer-pop .btns .f-right { float: right; }
#join .layerArea .layer-pop .close {display: block; width:45px; height:36px; position: absolute; right:0; top:0; background:url("/images/d3/m_04/btn_del_gray@2x.gif") no-repeat center center; background-size: 45px 36px; text-indent: -9999px; font-size: 0;}
#join .layerArea .txt table {width:100%;}

/* °³ÀÎÁ¤º¸ ¼öÁý ÀÌ¿ë¾È³» */
#join .desc h3.none-line {border-bottom: none; }
#join .privercy-contract-tap {position: relative; border-left: 1px solid #cacaca; }
#join .privercy-contract-tap li {list-style-type: none; border-top: 1px solid #cacaca;  border-right: 1px solid #CACACA; background-color: #f4f4f4; display: block; float: left; line-height: 27px; text-align: center; width: 33%; height: 28px; margin-bottom: -1px; }
#join .privercy-contract-tap li.sel{background-color: #fff; border-bottom: 1px solid #fff; }
#join .privercy-contract-tap li:last-child {border-right: 1px solid #cacaca;; }
#join .privercy-contract-tap li a {text-align: center; padding: 0; display: block; color: #787878; width: 100%; height: 100%; }
#join .tab-content {border: 1px solid #cacaca;}
#join .tab-content .privercy-contract {padding: 10px; }
#join .tab-content .privercy-contract p {line-height: 1.5em; width: 100%; height: 55px; margin: 0; padding: 0; border: none; overflow-y: hidden;}

/* ±¸¹öÀü ÀÌ¿ë¾à°ü µî style ¸ðÀ½ */
#join .desc-3 {border: 1px solid #909090;}
#join .desc {position: relative; background-color: #fff; padding: 20px 10px 10px 10px; margin: 0 5px;}
#join .desc .open-pop {position: absolute; right: 10px; top: 18px; border: 1px solid #c7c7c7; padding: 2px 10px; float: right;}
#join .desc h3 {font-weight: bold; padding: 3px 0;}
#join .agree-2 {padding-left: 10px; background-color: #fff; margin: 0 5px;}
#layerTermsWrap, #layerPrivercyWrap, #layerThirdPartyWrap, #layerTrustWrap { display: none; }


/* ¼¿·ºÆ®¹Ú½º */
.box-select { position:relative; background:#fff; border:1px solid #bbb; height:35px; vertical-align:middle; }
.box-select select { 
    display:block; width:100%; height:100%; position:absolute; left:0; top:0; border:none; color:#000;
    background:#fff url('/images/d3/modern_simple/btn/btn_select.gif') no-repeat right 0; background-size:35px 35px;
    appearance:none;
    -moz-appearance:none;
    -webkit-appearance:none;
    -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box;
    padding-left:6px;   font-size:0.85em; line-height:35px; font-family:dotum;
    outline: 0;
}







/* °£Æí È¸¿ø°¡ÀÔ [WIB] */
.h_title {border:none; margin-top: 50px; padding:0; font-size: 24px; color: #222; font-weight: 500; text-align: center; line-height: 1.3; margin-bottom:25px;}
.join_step ul {font-size:0; text-align:center;}
.join_step ul li {display:inline-block; vertical-align:top; color:#989898; font-size:14px;}
.join_step ul li:after {content:''; display:inline-block; margin:0 10px; background:url("/design/nubizio777/wib/img/sub/join_step_arrow.png") no-repeat; width:6px; height:9px; background-size:100% auto; position:relative; top:-1px;}
.join_step ul li:last-of-type:after {display:none;}
.join_step ul li.on {color:#222; font-weight:500;}
#join .join {background:none; padding:0; padding:40px 12px 0;}
#join .join .tableBox {margin-bottom:0; padding:0;}
#join .join .tableBox table th {font-size:13px;color:#222;font-weight:normal;padding:0;vertical-align: top;position:relative;padding-top: 10px;}
#join .join .tableBox table th:after {content:''; z-index:1; display:inline-block; width:3px; height:3px; background:#D7282F; border-radius:100%; position:relative; right:-5px; top:-8px;}
#join .join .tableBox table td {padding: 0 0 20px 0;vertical-align: top;}
/*#join .join .tableBox table td p {display:none;}*/
#join .join .tableBox table td input {padding:0;}
input[type="text"], input[type="date"], input[type="tel"], input[type="number"], input[type="email"], input[type="password"], select {border:none; border-bottom:1px solid #E3E3E3; line-height:42px;}
input[type="text"]::placeholder, input[type="date"]::placeholder, input[type="tel"]::placeholder, input[type="number"]::placeholder, input[type="email"]::placeholder, input[type="password"]::placeholder {font-size:13px; color:#989898;}
input[type="email"] {width:100% !important;}
.box-select {border:none;border-bottom:1px solid #E3E3E3;
    border: 1px solid #E3E3E3;
    border-left: 0;}
#join .join .tableBox table tr.birth dl.type1 dd:first-child .box-select {
    border-left: 1px solid #e3e3e3;
}
.box-select select {font-size:13px;color:#989898;font-family:'Montserrat','Noto Sans KR', sans-serif !important;padding-left:0;background:url("/design/nubizio777/wib/img/sub/join_arrow.png") no-repeat 85% center;background-size:9px 6px;}
#join .join .tableBox table tr.birth dl.type1 dd:first-child .box-select select {
    padding-left: 15px;
}
#join .join .tableBox table tr.birth dl.type1 dd:first-child {width:33.3%;}
#join .join .tableBox table tr.birth dl.type1 dd {width:33.3%; position:relative;}
#join .join .tableBox table tr.birth dl.type1 dd:after {content:''; display:inline-block; width:1px; height:10px; background:#e3e3e3; position:absolute; right:0; top:50%; margin-top:-5px;}
#join .join .tableBox table tr.birth dl.type1 dd:last-of-type:after {display:none;}
#join .join .tableBox table tr.birth dl.type1 dd:nth-child(2) .box-select, #join .join .tableBox table tr.birth dl.type1 dd:nth-child(3) .box-select {margin-left:0;}
#join .join .tableBox table tr.birth dl.type1 dd:nth-child(2) .box-select select, #join .join .tableBox table tr.birth dl.type1 dd:nth-child(3) .box-select select {padding-left:15px;}
#join .join .tableBox table tr.gender th {padding:20px 0;}
#join .join .tableBox table tr.gender dl dd {width:auto; margin-right:20px;}
#join .join .tableBox table tr.gender label {background:url(/design/nubizio777/wib/img/sub/radio_off.png) no-repeat left center; display:inline-block; background-size:13px 13px; padding-left:7px; color:#222; font-size:13px;}
#join .join .tableBox table tr.gender label.on {background:url(/design/nubizio777/wib/img/sub/radio_on.png) no-repeat left center; display:inline-block; background-size:13px 13px;}
#join .join .tableBox table tr.gender label input[type='radio'] {opacity:0;}
#join .join .tableBox table tr.mobile td,
#join .join .tableBox table tr.sms td {/*padding:10px 0;*/}
#join .join .tableBox table .btn {border:1px solid #222;box-sizing:border-box;background:#fff;font-size:13px;color:#222;font-weight:normal;width: 48px;line-height: 35px;height: 35px;top:0;right: 0;}
.join-msg {margin:20px 0 50px 0;}
.join-msg li {padding-bottom:10px;}
.join-msg li:last-of-type {padding-bottom:0;}
.join-msg li label {font-size:14px; color:#222; font-weight:500;}
.join-msg li p {font-size:13px; color:#989898; line-height:1.5;}
.join #terms_agree .terms-agree dt {padding-left:0; font-size:14px; color:#222; font-weight:500; margin-top:0; height:auto; line-height:1.5; letter-spacing:0; border-bottom:1px solid #222; padding-bottom:10px;}
.join #terms_agree .terms-agree dd {margin:0; padding:15px 0 20px 0; border-bottom:1px solid #E3E3E3;}
.join #terms_agree .terms-agree dd .lst li {float:none; width:100%; padding:0; margin-bottom:20px;}
.join #terms_agree .terms-agree dd .lst li:last-of-type {margin-bottom:0;}
.join #terms_agree .terms-agree dd .lst li a {font-size:14px; color:#222; text-decoration:none;}
.join #terms_agree .terms-agree dd:last-child {padding:20px 0 0 0; font-size:0;}
.join #terms_agree .terms-agree dd:last-child label:nth-child(1) strong {font-size:14px; color:#222; font-weight:normal; letter-spacing:0;}
.join #terms_agree .terms-agree dd:last-child div {display:block !important; margin-top:12px;}
.join #terms_agree .terms-agree dd label {font-size:14px; color:#222; margin-right:20px;}
.join #terms_agree .terms-agree dd .txt {background:#F8F8F8; padding:15px; color:#5A5A5A; font-size:12px; line-height:1.5; letter-spacing:0; margin-top:20px; white-space: normal; word-break: keep-all;}
.join #terms_agree .terms-agree dd .txt p {margin-top:0; color:#5a5a5a;}

.join #terms_agree .terms-agree dd input[type="checkbox"]:checked:before {background: url(/design/nubizio777/wib/img/sub/join_check_on.png)no-repeat left top !important; background-size: 18px !important;}



/*
.join #terms_agree .terms-agree .cb_wrap  {background:url(/design/nubizio777/wib/img/sub/check_off.png) no-repeat left center; display:inline-block; background-size:18px 18px; padding-left:7px; color:#222; font-size:13px;}
.join #terms_agree .terms-agree .cb_wrap.on,
.join #terms_agree .terms-agree .cb_wrap input[type="checkbox"]:checked {background:url(/design/nubizio777/wib/img/sub/check_on.png) no-repeat left center; display:inline-block; background-size:18px 18px;}
.join #terms_agree .terms-agree label input[type='checkbox'] {opacity:0;}
*/
#join .ok_btn {padding:40px 12px 0;}

#join #terms_desc .terms-desc {margin:40px 12px 0; border-top:1px solid #e3e3e3;}
#join #terms_desc .terms-desc dt {margin:0; height:auto; line-height:1.2; padding:20px 0; border-bottom:1px solid #E3E3E3; border-top:none; font-size:13px; color:#222; letter-spacing:0; font-weight:500;}
#join #terms_desc .terms-desc dt .btn-down,
#join #terms_desc .terms-desc dt .btn-up {background:none; width:100%; padding:20px 0; display:block; top:0; right:0; margin-top:0; height:100%; box-sizing:border-box;}
#join #terms_desc .terms-desc dt .btn-down span {display:inline-block; width:14px; height:10px; background:url("/design/nubizio777/wib/img/sub/join_notice_arrow.png") no-repeat right center; background-size:14px 10px; right:0; transition:all 0.5s ease; -webkit-transition:all 0.5s ease; position:absolute;}
#join #terms_desc .terms-desc dt .btn-up span {display:inline-block; width:14px; height:10px; background:url("/design/nubizio777/wib/img/sub/join_notice_arrow.png") no-repeat right center; background-size:14px 10px; right:0; transform: rotate(180deg); -webkit-transform: rotate(180deg); transition:all 0.5s ease; -webkit-transition:all 0.5s ease; position:absolute;}
#join #terms_desc .terms-desc dd {border-top:none; background:#F8F8F8; padding:20px; border-bottom:1px solid #E3E3E3;}
#join #terms_desc .terms-desc dd textarea {background:none; font-size:12px; color:#222; line-height:1.5; border:none; padding:0; resize:none; letter-spacing:0; text-align:left;}
#join .join .tableBox table .txt-input#id + p {
    display: none;
}

#join .join .tableBox table tr.gender td {
    padding: 20px 0;
}
 

#join .join .tableBox table tr.birth td {}

#join .join .tableBox table tr.birth td dl.type1 dd .box-select {
    border: 1px solid #e3e3e3;
    border-left: 0;
}

#join .join .tableBox table tr.birth dl.type1 dd:first-child .box-select {
    /* border-left: 0; */
}

#join .join .tableBox table tr.birth dl.type1 dd .box-select .sbHolder {
    border: 0;
    margin-top: 0;
    font-weight: 400;
    color: #989898;
    font-family: 'Montserrat','Noto Sans KR', sans-serif !important;
}

#join .join .tableBox table tr.birth dl.type1 dd:after {
    display: none;
}

#join .join .tableBox table tr.birth dl.type1 dd .box-select .sbHolder .sbSelector {
    font-size: 13px;
    color: #989898;
    height: 35px;
    line-height: 35px;
    font-weight: 400;
}

#join .join .tableBox table tr.birth dl.type1 dd .box-select .sbHolder .sbToggle {
    padding-left: 0;
    background: url(/design/nubizio777/wib/img/sub/join_arrow.png) no-repeat right 10px center;
    background-size: 9px 6px;
}

.sbOptions {
    max-height: 180px !important;
}
/* BASIC css end */

