/***** member *****/
table td .txt{ font-size:0.9em; padding-left:5px;}

/* loginWrap */
.loginWrap {overflow:hidden; margin: 0 auto 30px auto; position:relative; border:1px solid #ddd; padding:45px 30px;}
.loginWrap * { box-sizing:border-box;}

.loginWrap .loginTit {width:27%;float:left;font-size: 1em;color:#777;text-align:center;margin-right:3%;}
.loginWrap .loginTit .tit {font-size:50px;text-transform:uppercase;font-weight:400;color:#444;letter-spacing:-0.05em; line-height:1em;}
.loginWrap .loginTit p {margin-top:13px;letter-spacing:-0.05em;line-height:1.600em}
.loginWrap .loginTit em{ display:block;}
.loginWrap .loginTit span {  display:block; background:url('../images/member/bg_login.png') no-repeat center bottom;width:100%;height:105px; margin-top:10px;}

.loginWrap .loginCon {width:70%;float: right;position: relative; padding-left:30px;}
.loginWrap .loginCon fieldset{ position:relative;}
.loginWrap .loginCon input[type="text"],
.loginWrap .loginCon input[type="password"] {display:block;width: 71%;height:45px; line-height: 43px; margin-bottom:5px;padding:0 10px 0 45px;}
.loginWrap .loginCon input[type="text"] {background:url('../images/member/icon_login.png') no-repeat 10px 4px;}
.loginWrap .loginCon input[type="text"]:-webkit-autofill { background-color: rgb(250, 255, 189); background:url(../images/member/icon_login.png) no-repeat 10px 4px; color: rgb(0, 0, 0);}
.loginWrap .loginCon input[type="password"] {background:url('../images/member/icon_login.png') no-repeat 10px -78px; margin-bottom:0}
.loginWrap .loginCon input[type="text"].email {background:url('../images/member/icon_login.png') no-repeat 10px -240px;}
.loginWrap .loginCon input.button {display:block;width: 28%;margin-bottom:0;height: 100%;font-size:1.2em;position: absolute;right: 0;top: 0;}
.loginWrap .loginCon .login_text { padding:5px 0 20px;}
.loginWrap .info_ex {}

.loginWrap .loginBn{ display:block;line-height:48px; height:50px; width:50%; float:left; border:1px solid #ddd; box-sizing:border-box; padding:0 20px 0 50px;}
.loginWrap .findID{ overflow:hidden; clear:both;}
.loginWrap .loginBn.bn01{ background:url('../images/member/loginBn01.png') no-repeat 15px center ;}
.loginWrap .loginBn.bn02{ background:url('../images/member/loginBn02.png') no-repeat 15px center ; border-width:1px 1px 1px 0px;}

/* leave */
.loginWrap.line_box{border:0;padding: 3px;width: 100%;}
.loginWrap.line_box .loginCon{width:100%;float:none;padding: 30px;}

/* confirm */
.confirm{margin-top:20px;}
.confirm dl{}
.confirm dt{ font-weight:bold;}

/* loginSection */
.loginSection .find_id { float:left; width:50%; padding:30px 30px 40px; }
.loginSection .find_pw { float: right; width: 50%; padding: 30px 30px 40px;border-left:1px solid #e4e4e4}
.loginSection .find_id label,
.loginSection .find_pw label {}
.loginSection .find_id input,
.loginSection .find_pw input { display:block;width:100%; height:45px;margin-bottom:5px;}
.loginSection .find_id input.button,
.loginSection .find_pw input.button { height:55px; font-size:1.2em;}

/* loginUser */
.findBox{ clear:both; overflow:hidden; padding:20px 20px 20px 80px;  background:url('../images/member/loginuser_icon01.png') no-repeat 20px 20px;}


/* joinStep */
.joinStep { overflow:hidden; margin-bottom:35px}
.joinStep li { position:relative; float: left; width:22.9%;padding-right:30px; box-sizing:content-box;}
.joinStep li span { display:block; position:relative; padding:70px 0px 10px 0px;  border: 1px solid #d7d7d7; min-height:120px; text-align:center; border-radius: 7px;}
.joinStep li.step4 { padding-right:0}
.joinStep li span:after {display:inline-block; content:''; position:absolute; right:-30px; top:40%; width:30px; height:30px; background:url('../images/member/stepBg_left.png') no-repeat 50% 50% }
.joinStep li.step4 span:after { display:none}
.joinStep li span:before {display:inline-block; content:'';position:absolute; left:50%; top:20px; width:40px; height:40px; margin-left:-20px; background:url('../images/member/icon_join.png') no-repeat;}
.joinStep li.step1 span:before { background-position: 0 0px;}
.joinStep li.step2 span:before { background-position: 0 -121px;}
.joinStep li.step3 span:before { background-position: 0 -243px;}
.joinStep li.step4 span:before { background-position: 0 -365px;}
.joinStep li i { display:block; font-size: 0.8em; line-height:16px; color:#777; font-style:normal}
.joinStep li.on span {border-color: #44b0b3;background-color: #44b0b3;color:#fff;}
.joinStep li.on.step1 span:before { background-position: -100px 0px;}
.joinStep li.on.step2 span:before { background-position: -100px -121px;}
.joinStep li.on.step3 span:before { background-position: -100px -243px;}
.joinStep li.on.step4 span:before { background-position: -100px -365px;}

/* joinBox */
.joinBox{ overflow:hidden; }
.joinBox > li{ display:block; float:left; width:48%; margin-bottom:30px;}
.joinBox > li:nth-child(2n+2){ float:right;}
.joinBox > li:last-child{ width:100%;margin-bottom:30px;}
.joinBox > li .ttl02{ margin-top:0 }
.joinBox > li p{ margin-bottom:0;}


/* agreeBox */
.agreeBox{background:#fff;padding: 25px 25px 15px 25px;overflow: hidden;border: 1px solid #dfdfdf; max-height:250px; overflow-y:auto; margin-bottom:0}
.agreeBox .checkbox{ border:1px solid #b7b7b7; width:15px; height:15px;}
.agreeBox h4{clear: both;font-size:1.1em;}
.agreeBox h5{font-size:1.1em;margin:20px 0 5px;}
.agreeBox h5:first-child{ margin-top:0;}



/* guideBox */
.guideBox{ border:1px solid #ccc; padding:30px; text-align:left; max-height:300px; overflow-y: scroll;}
.guideBox h4{ font-size:1.2em; margin:1em 0 0.2em 0;}
.guideBox h6{ font-size:1em; margin: 1em 0 0.2em 0;}
.guideBox p{ text-align:left}
.guideBox .listStyle li {padding: 0 0 3px 10px; line-height: 1.5;}
.guideBox dt{ font-size: 0.87em;}
.guideBox ul ul{ padding:0}

.joinBtn {text-align:center; margin-top:30px }
.joinBtn a.button { height:55px; line-height:55px; font-size:1.3em; color:#fff;padding: 0 40px 0 50px;}
.joinBtn a.button:after{content: "";display: inline-block; width: 20px; height:18px; margin-left:10px; background: url('../images/common/bul/icon_button_w.png') no-repeat center -481px;}
.joinBtn a.button.join:after{background: url('../images/common/bul/icon_button_w.png') no-repeat center 5px;}
.boardWrite .button.down { padding:0 5px 0 15px; line-height:28px; float:right}
.boardWrite .button.down:after {background:url('../images/common/bul/icon_button_b.png') no-repeat center -479px; content:""; display:inline-block; width:30px; height:20px }

/*.stepList li div span{display:block;}*/
.stepList li div p{font-size:16px;}
.stepWrap .text{margin-top:15px;font-size: 0.94em;text-align:center;line-height:1.6em;}
.stepWrap .textLeft{margin-top:15px;font-size: 0.94em;text-align:left;line-height:1.6em;}
.stepWrap .text span{display:block;}
.siteRule{margin-top:40px;}
.siteRule h3{padding-top:10px;color:#1a1a1a;font-size: 1.21em;background:url('../images/member/bgTitLine.gif') no-repeat;}
.siteRule label + h3{margin-top:55px;}
.siteRule textarea{width:98%;height:200px;padding:10px;margin-bottom:5px;color:#707070;background:#fff;border:1px solid #cccccc;resize:none;line-height: 1.6em;font-size: 0.8em; letter-spacing:-1px}
.siteRule h3 + textarea{margin-top:10px;}
.siteRule label + textarea{margin-top:25px;}
.siteRule label input[type=checkbox]{margin-right:5px;}

p.agreeArea { font-weight:normal;margin: 0px 0 30px; background: #fafafa; padding: 20px; color:#333; text-align:center; border-bottom: 1px solid #ccc;}
.siteRule label{font-size: 0.8em;}
.siteRule .allChk{font-size: 0.94em;color:#666;font-weight:normal;margin-bottom:30px;}
.stepWrap .btnSec{ margin:35px 0;text-align:center;}
.stepWrap .btnSec .bt{display:inline-block;padding:0px 20px;height: 30px;line-height: 30px;margin:0;background:#000;border:0 none;/*border-bottom:1px solid #ba000f;*/border-radius:3px;box-shadow: 1px 1px 3px #999;font-size: 0.87em;/*font-family:NGBold;*/color:#fff;vertical-align: middle;}
.stepWrap .btnSec .bt + .bt{margin-left:3px;background:#4d4d4d;/*border-bottom:1px solid #3e3e3e;*/}
.stepWrap .btnSec .btnDefault{display:inline-block;padding:0px 25px;height: 30px;line-height: 30px;margin:0;background:#000;border:0 none;/*border-bottom:1px solid #ba000f;*/border-radius:3px;box-shadow: 1px 1px 3px #999;font-size: 1em;/*font-family:NGBold;*/color:#fff;vertical-align: middle;}
.stepWrap .btnSec .btnRed {display:inline-block;padding:0px 20px;height: 30px;line-height: 30px;margin:0;background:#e60013;border:0 none;/*border-bottom:1px solid #ba000f;*/border-radius:3px;box-shadow: 1px 1px 3px #999;font-size: 1em;/*font-family:NGBold;*/color:#fff;vertical-align: middle;}
.stepWrap .btnSec .btn_blue_40 i,
.stepWrap .btnSec .btn_b_gray_40 i{ padding:0 31px 0 35px;}



.loginSection .confirm { overflow:hidden; clear:both; padding:40px 30px; border-top:4px solid #e2e4e8}

.loginSection .confirmTxt { padding-right:30px;}
.loginSection .confirmTxt > li { padding-bottom:10px; font-weight:bold;}
.loginSection .confirmTxt li li { font-weight:normal}
.loginSection .confirmTxt li p { margin:7px 0;}

.confirmBlock { overflow:hidden; }
.confirmBlock dl{ padding:20px; margin-left:100px}
.confirmBlock dt { color:#fff; font-size:1.3em; padding:0; margin-bottom:5px;}
.confirmBlock dt:before { content:""; display:block; width:25px; height:1px; margin:5px 0; background:#fff;}
.confirmBlock dd{ line-height:22px; color:#fff;}
.confirmBlock .cfmBtn { position:absolute; bottom:15px; right:15px;}

.mobileCfm, .pinCfm { float:left; position:relative; width:49%; min-height:150px; margin:0 2% 0 0; background:#3f76d0; overflow:hidden}
.pinCfm{ margin: 0; float:right}
.mobileCfm:before { float:left; content:""; display:inline-block; width:100px; min-height:150px; margin-right:20px; background:url('../images/member/icon_confirm.png') no-repeat center 35px #535353;}
.pinCfm:before { float:left; content:""; display:inline-block; width:100px; min-height:150px; margin-right:20px; background:url(../images/member/icon_confirm.png) no-repeat center -133px #535353;}

/* joinRst */
.joinRst { margin-top:15px; padding:5px 20px 35px 280px; background:url('../images/member/mark.png') no-repeat;}
.joinRst p { font-weight:bold}
.joinRst p:first-child { font-size:1.6em; padding-bottom:15px; line-height:1.2em;}
.joinRst p:first-child:after { content:""; display:block; width:30px; height:2px; margin:15px 0 0 0; background:#5b79b9}
.joinRst p:first-child i { color:#e74545}
.joinRst p.txt { font-size:1.2em; font-weight:bold; color:#000;}
.joinRst ul.listStyle { margin-top:20px}

/* messageSection */
.messageSection {overflow:hidden; border:4px solid #e4e4e4;  box-sizing:border-box; padding:40px; text-align:center; color:#666 }
.messageSection p {text-align:center;}
.messageSection p.tit { font-size:1.5em; margin-bottom:15px;}

/* tableData*/
.tableData td.view {height:0px;vertical-align:middle;text-align:center;border:0px solid #3365dd;padding: 1px 0px;margin:0px;background:#fff;}
.tableData td.viewT {height:26px;vertical-align:middle;text-align:center;border:2px solid #3365dd;padding:0;margin:0px;background:#fff;}


@media all and (max-width:1024px) {	
.loginWrap{ width:auto; padding:30px}
.loginWrap .loginTit{ display:none;}
.loginWrap .loginCon{ width:100%; padding:0; float:none;}
.loginWrap .loginCon .login_text { padding-bottom: 15px;}
.confirm{ border:none; padding:0; margin-top:35px; margin-bottom:50px}
.mobileCfm { margin-bottom:10px;}
.mobileCfm, .pinCfm { float:none; width:100%;}
.mobileCfm, .pinCfm, .mobileCfm:before, .pinCfm:before { }
.loginUser .userList li{ float:none; width:auto;}
.loginUser .userList li:first-child{ padding: 20px 20px 10px 80px;}
.loginUser .userList li:last-child{ padding: 10px 20px 20px 80px;}

.loginWrap.line_box{ width:100%;}

/* joinStep */
.joinStep li { width:47.5%; }
.joinStep li span{ min-height:inherit}
.joinStep li:nth-child(1), .joinStep li:nth-child(2){ margin-bottom:10px;}
.joinStep li:nth-child(odd) { border-left:none;}
.joinStep li:nth-child(3), .joinStep li:nth-child(4) { border-bottom:none;}
.joinStep li.step2, .joinStep li.step4 {  padding-right: 0;}
}

@media all and (max-width:640px) {
.loginWrap {margin:0 auto 15px auto; border:0; padding:0;}
.loginWrap h4 { margin-bottom:20px;font-size:1.5em;}
.loginWrap .loginCon:before{ display:none;}
.loginWrap .loginCon,
.loginWrap .loginBn { float: none; width: auto; }
.loginWrap .loginBn.bn01,
.loginWrap .loginBn.bn02{ margin-bottom:1px; border-width:1px; height:40px; line-height:40px; background-size:25px; background-position:10px center; padding-left:42px;}
.loginWrap .loginCon{ margin-bottom:0; padding-bottom:30px;}
.loginWrap .loginCon .login_text{ padding-bottom:10px;}

.loginWrap .button.medium { height: 33px; padding: 0 16px; line-height: 31px;}

.loginWrap.line_box{ background:none; }
.loginWrap.line_box .loginCon { padding:0;}

/* joinStep */
.joinStep {margin-bottom:0px}

.joinStep li { float: none; width:auto !important; padding-right:0; padding-bottom:20px}
.joinStep li span { padding:10px 80px 10px 80px;  min-height:20px; line-height:40px}
.joinStep li span:after { right:50%; top: 60px; bottom:-10px; margin-right:-15px; height:20px; background:url('../images/member/stepBg_bottom.png') no-repeat 50% 50% }
.joinStep li span:before {left:-1px; top:-1px; width:40px; height:40px; margin-left:0; background-color:#666; border:11px solid #666}
.joinStep li.on span:before { background-color:#208b8e;border-color: #208b8e}
.joinStep li.step1 span:before { background-position: -100px 0px;}
.joinStep li.step2 span:before { background-position: -100px -121px;}
.joinStep li.step3 span:before { background-position: -100px -243px;}
.joinStep li.step4 span:before { background-position: -100px -365px;}
.joinStep li span br { display:none}
.joinStep li:nth-child(1), .joinStep li:nth-child(2){ margin-bottom:0}

.joinRst { padding: 50% 0 20px 0; background-size: 80%; background:url('../images/member/mark.png') no-repeat 50% 0;}

/* joinBox */
.joinBox{ overflow:hidden; }
.joinBox > li,
.joinBox > li:nth-child(2n+2),
.joinBox > li:last-child{ float:none; width:auto; margin-bottom:20px;}

}

@media all and (max-width:480px) {
.guideBox{ padding:10px;}	
.confirmBlock dl{ padding:15px;}
.confirmBlock .cfmBtn{ position:relative; top:10px; float:right; right:0}


}
