@charset "utf-8";
/************************************************************************
 * filename : login.css
 * description : 로그인 CSS
 * date : 2016.6.9
************************************************************************/
/* 로그인 바닥 & 레이어 공통 */
.login_box .login_input .login_item label,
.layer_login .login_item label {position:absolute; left:-9999em;}
.login_box .login_area .go_link li,
.layer_login .go_link li {float:left; margin-left:20px; padding-left:20px; background:url('/cjmweb/images/common/bg_vline02.png') no-repeat 0 50%;}
.login_box .login_area .go_link li.first,
.layer_login .go_link li.first {margin:0; padding:0; background:none;}
.login_sec .btn_sec {margin-top:30px; text-align:center;}

/* 로그인 바닥 */
.login_box {height:470px; padding-top:15px;}
.login_box .login_area {float:left; width:560px; height:429px; padding:40px 0 0 50px; border-top:1px solid #222; background-color:#f8f8f8;}
.login_box .login_area .losginInfo_msg {padding-top:14px;}

.login_box .login_input {position:relative; width:510px; padding-top:24px;}
.login_box .login_input .login_item {margin-bottom:7px;}
.login_box .login_input .login_item:first-child {margin-top:0;}

.login_box .login_input .login_item .input_txt {display:block; width:338px; height:49px;}
.login_box .login_input .login_item .input_txt input {height:47px; line-height:47px;}
.login_box .login_input .btn_em {position:absolute; top:24px; *top:25px; right:0; min-width:0; width:130px; height:104px; margin:0; font-size:16px;}
.login_box .login_area .go_link {padding-top:20px;}

.login_box .login_slideBanner {position:relative; height:470px; margin-left:610px; overflow:hidden;}
.login_box .login_slideBanner .bx-controls {position:absolute; right:0; bottom:40px; left:0; z-index:100; text-align:center;}
.login_box .login_slideBanner .bx-controls .pager_wrap {position:relative; display:inline-block; height:18px; padding-left:24px; line-height:18px;}
.login_box .login_slideBanner .bx-controls .bx-pager-item {display:inline-block; width:18px; height:18px; vertical-align:top;}
.ie7 .login_box .login_slideBanner .bx-controls .bx-pager-item {display:block; zoom:1;}
.login_box .login_slideBanner .bx-controls a {display:inline-block; width:21px; height:20px; background:url('/cjmweb/images/common/btn_banner.png') no-repeat; text-indent:-999em;}
.ie7 .login_box .login_slideBanner .bx-controls a {display:block; zoom:1;}
.login_box .login_slideBanner .bx-controls .bx-pager-link {background-position:-63px 0;}
.login_box .login_slideBanner .bx-controls .bx-pager-link.active {background-position:-42px 0;}
.login_box .login_slideBanner .bx-controls .bx-stop {background-position:-21px 0;}

.login_box .login_slideBanner .bx-controls-auto {position:absolute; top:0; left:0;}
.login_box .login_slideBanner .bx-controls-auto-item a {position:absolute; top:0; left:0; display:inline-block;}
.login_box .login_slideBanner .bx-controls-auto .active {display:none;}
.login_box .login_slideBanner .bx-controls-direction {display:none;}

.login_box .login_slideBanner.black .bx-controls a {background:url('/cjmweb/images/common/btn_banner_black.png') no-repeat;}
.login_box .login_slideBanner.black .bx-controls .bx-pager-link {background-position:-63px 0;}
.login_box .login_slideBanner.black .bx-controls .bx-pager-link.active {background-position:-42px 0;}
.login_box .login_slideBanner.black .bx-controls .bx-stop {background-position:-21px 0;}

/* 로그인 레이어 */
.layer_login .login_item {margin-bottom:5px;}
.layer_login .login_item .input_txt {display:block; width:308px}
.layer_login .login_input .btn_em {position:absolute; bottom:10px; left:0; width:340px; margin:0;}
.layer_login .go_link {padding:24px 0 0 20px;}

/* 아이디 찾기, 비밀번호 찾기 */
.id_find_wrap {overflow:hidden; padding:50px; border-top:1px solid #222; background-color:#f8f8f8;}
.find_area {float:left;}
.find_area .input_txt.w316 input {width:322px;}

.find_handy {width:402px; padding-right:0px; border-right:1px solid #ddd;}
.find_handy .tit_box .h3_tit {line-height:23px;}
.find_handy .tit_box .desc {width:auto; margin-top:20px; color:#555; line-height:24px; letter-spacing:-1px;}
.find_handy .check_member_form {width:400px; margin-top:54px;}
.find_handy .check_member_form .input_txt {padding-right:0; padding-bottom:5px;}
.find_handy .check_member_form .msg_info {display:none;}
.find_handy .check_member_form .btn_sec {padding-top:5px; padding-left:0;}
.find_handy .check_member_form .btn_sec .btn {width:354px; margin:0;}

.find_comp {position:relative; width:507px; padding-left:50px;}
.find_comp .certification_sec {text-align:left;}
.find_comp .certification_sec .way {display:block; overflow:hidden; margin:35px auto 0; width:500px; padding-left:0;}
.find_comp.new_pwd .certification_sec .way {margin-top:48px;}
.login_wrap .find_comp .pwd_box {margin-top:20px;}
.find_comp .certification_sec .way li.type1,
.find_comp .certification_sec .way li.type2 {border-right:0;}
.find_comp .certification_sec .way li.type1 {margin-left:0;}
.find_comp .certification_sec .way li {margin-left:10px; padding:117px 0 0;}
.find_comp .btn {margin:0;}

.certi_fail.certi_id .input_txt.w182 {padding-right:3px;}
.certi_fail.certi_id .input_txt.w182 input {width:150px;}

/* 비밀번호 찾기 */
.find_pw .find_handy {width:428px;}
.find_pw .find_handy .tit_box .desc {width:auto;}
.find_pw .find_handy .input_txt.w316 input {width:396px;}
.find_pw .find_handy .check_member_form .btn_sec .btn {width:428px;}
.find_pw .new_pwd {width:431px;}
.find_pw .new_pwd .input_txt.w316 input {width:399px;}
.find_pw .new_pwd .way.col2 {width:427px; margin:37px auto 0 auto;}
.find_pw .new_pwd .way.col2 li.type1 {width:160px;}
.find_pw .new_pwd .way.col2 li.type2 {width:160px; margin-left:53px; padding-left:53px; border-left:1px solid #ddd;}
.find_pw .new_pwd .way.col2 li.type2 span.bg {left:89px; margin-left:0;}

/* 5회 실패 */
.capcha_wrap {position:relative; width:370px; padding-top:21px;}
.capcha_wrap .input_capcha label {position:absolute; left:-9999em;}
.capcha_wrap .input_capcha img {display:block;}

.capcha_wrap .input_capcha .input_txt {display:block; width:338px; margin-top:5px;}

.capcha_wrap .btn_wrap {position:absolute; top:21px; right:0;}
.capcha_wrap .btn_wrap .btn_sm {display:block; *min-width:105px; margin:0 0 5px 0; overflow:hidden;line-height:32px; *line-height:26px;}
.capcha_wrap .btn_wrap .btn_sm .arr {display:block; padding:0 0 0 20px;}
.capcha_wrap .btn_wrap .btn_sm .refresh {background:url('/cjmweb/images/common/btn_refresh.png') no-repeat 0 6px; *background-position-y:5px;}
.capcha_wrap .btn_wrap .btn_sm .voice {background:url('/cjmweb/images/common/btn_voice.png') no-repeat 0 6px; *background-position-y:5px;}

/* 해외 IP 계정 잠금 해제 */
.certi_em {display:block; padding-top:8px; text-align:left;}

/* 계정잠금 해제 */
.certi_box.cancellation .certi_txt {letter-spacing:-1px;}
.certi_box.cancellation .multi_line {display:inline-block;padding-top:8px;}

/* 비밀번호 변경 */
.guide_pw {position:relative; margin-top:40px; background:#f8f8f8; overflow:hidden;}
.guide_pw span.line {position:absolute; width:1px; background:#ddd; top:30px; bottom:30px; left:50%;}
.guide_pw .col {float:left; width:50%;}
.member_info.change_password .input_group {padding-bottom:0;}
.member_info.change_password .title {width:18%;}
.member_info.change_password .body {width:82%;}

/* 비밀번호 확인 */
.choice_get_pwd {width:560px; margin:30px auto 0;padding:20px 0; background:#fff;}
.choice_get_pwd ul {display:inline-block; font-size:16px;text-align:left;*padding-left:20px;}
.choice_get_pwd ul li.choice_phon {margin-top:11px;}

/* 1024 */
@media screen and (max-width:1024px) {
	/* 로그인 */
	.login_box {height:auto;}
	.login_box .login_area {float:none; width:auto; height:290px;}
	.login_box .login_area .h2_tit {width:560px; margin:0 auto;}
	.login_box .login_area .losginInfo_msg {width:560px; margin:0 auto;}
	.login_box .login_input {width:560px; margin:0 auto;}
	.login_box .login_input .btn_em {right:50px;}
	.login_box .login_area .go_link {width:560px; margin:0 auto;}
	.login_box .login_slideBanner {width:450px; margin:0 auto; padding-top:50px;}

	/* 아이디 찾기, 비밀번호 찾기 */
	.id_find_wrap {padding:30px;}
	.find_handy {padding-right:0px;width:380px;}
	.find_comp {padding-left:20px;}
}

/* 768 */
@media screen and (max-width:768px) {
	/* 로그인 */
	.guide_pw {background:transparent;}
	.guide_pw span.line {display:none;}
	.guide_pw .col:first-child {margin-top:0;}
	.guide_pw .col {float:none; width:100%; margin-top:20px;}
	.member_info.change_password .title{width:25%;}
	.member_info.change_password .body{width:75%}

	/* 아이디 찾기, 비밀번호 찾기 */
	.find_area {float:none;}
	.find_handy {width:100%; padding:0 0 50px 0; border-right:0; border-bottom:1px solid #ddd;}
	.find_handy .check_member_form {margin:30px auto 0;}
	.find_comp {width:100%; padding:50px 0 0 0;}
	.find_comp .certification_sec {text-align:center;}
	.find_comp .certification_sec .way {display:inline-block; margin-top:60px; width:520px;}
	.find_comp .certification_sec .way li {margin-left:20px;}
	.login_wrap .find_comp .pwd_box {margin-top:30px; text-align:center;}

	.certi_fail.certi_id .fail,
	.certi_fail.certi_id .error {height:198px; padding-bottom:40px;}
	.certi_fail.certi_id .input_txt.w182 {display:block; margin-bottom:10px; text-align:center;}
	.certi_fail.certi_id .input_txt.w182 input {display:inline-block; text-align:left;}

	/* 비밀번호 찾기 */
	.find_pw .find_handy {width:auto;}
	.find_pw .find_handy .check_member_form {width:428px;}
	.find_pw .find_handy .tit_box .desc {width:auto;}
	.find_pw .find_handy .input_txt.w316 input {width:396px;}
	.find_pw .find_handy .check_member_form .btn_sec .btn {width:428px;}
	.find_pw .new_pwd {width:auto;}
	.find_pw .new_pwd .input_txt.w316 {padding-right:0;}
	.find_pw .new_pwd .input_txt.w316 input {width:399px;}
	.find_pw .new_pwd .way.col2 {width:427px; margin:37px auto 0 auto;}
	.find_pw .new_pwd .way.col2 li.type1 {width:160px;}
	.find_pw .new_pwd .way.col2 li.type2 {width:160px; margin-left:53px; padding-left:53px; border-left:1px solid #ddd;}
	.find_pw .new_pwd .way.col2 li.type2 span.bg {left:89px; margin-left:0;}
}

/* ISMS 심사 대응 작업관련 속성 추가 */
.find_comp .tit_box .h3_tit {line-height:23px;}
.find_comp .tit_box .desc {margin-top:20px; color:#555; line-height:24px; letter-spacing:-1px;}
.find_handy .check_member_form.pw_form_box{margin-top:121px;}
@media screen and (max-width:768px) {
	.find_handy .check_member_form.pw_form_box{margin-top:30px;}
}