@charset "UTF-8";

.login_area ul li {padding-top:0;}

/* 로그인 스타일 */
div.login {height:100%;font-size:1.13em;}

	/* 로그인 1 스타일 */
	
	div.login.skin1 {background:#fafafa;height:100%;}
		div.login.skin1 h1 {background:url(../../images/common/img_login1.gif) center center no-repeat;display:block;width:300px;height:250px;margin:0 auto;}
			div.login.skin1 h1 .blank {position:absolute;left:-10000px;top:-10000px;}
			
		div.login .select_design {position:absolute;top:20px;right:20px;border:1px solid #dcdcdc;background:#fff;height:28px;line-height:28px;padding:0 10px;width:98px;color:#646464;}
			div.login .select_design label span.icon {position:absolute;right:10px;top:12px;background:url(../../images/common/icon_arrow.gif) no-repeat;display:block;width:8px;height:4px;}
			div.login .select_design select {position:absolute;left:0;top:0;right:0;bottom:0;margin:0;border:0;opacity:0;filter:alpha(opacity=0);}
		
		div.login.skin1 .input_area {width:300px;margin:0 auto;position:relative;}
			div.login.skin1 .input_area li.input_line  {position:relative;display:block;margin-bottom:10px;}
			div.login.skin1 .input_area li.input_line label span {position:absolute;left:0;top:0;height:50px;line-height:50px;padding-left:16px;font-size:1.1em;color:#bababa;}
			div.login.skin1 .input_area li input[type="text"],div.login.skin1 .input_area li input[type="password"] {margin:0;padding:0 15px;border:1px solid #dcdcdc;height:48px;line-height:48px;height:48px;width:268px;font-size:1.1em;color:#646464;}
			div.login.skin1 .input_area li input[type="text"]:focus + label,div.login.skin1 .input_area li input[type="password"]:focus + label {display:none;}
			div.login.skin1 .input_area li.btn_line {margin-top:20px;}
				div.login.skin1 .input_area li.btn_line button.btn.login {width:100%;height:60px;background:#18a2c9;color:#fff;font-size:1.25em;}
				
			div.login.skin1 .input_area li.save_id {margin-top:10px;}
				div.login.skin1 .input_area li.save_id input[type="checkbox"] {border:1px solid #dcdcdc;background:#fff;width:16px;height:16px;-webkit-appearance:none;border:0;-moz-appearance:none;border:0;border:0;vertical-align:middle;border-radius:8px;margin-top:0px;margin:0 5px 0 0;}
				div.login.skin1 .input_area li.save_id input[type="checkbox"]:checked {border:6px solid #18a2c9;background:#fff;}
				div.login.skin1 .input_area li.save_id span {vertical-align:middle;color:#646464;}
			
			div.login.skin1 .input_area li.find_id {position:absolute;bottom:1px;right:0;}
				div.login.skin1 .input_area li.find_id a span {color:#18a2c9;}
				
			div.login.skin1 .security {position:absolute;bottom:20px;left:20px;}
				div.login.skin1 .security input[type="checkbox"] {background:url(../../images/common/icon_security.gif) no-repeat;width:18px;height:30px;-webkit-appearance:none;border:0;-moz-appearance:none;border:0;border:0;vertical-align:middle;margin-right:5px;}
				div.login.skin1 .security input[type="checkbox"] + label {color:#646464;}
				div.login.skin1 .security input[type="checkbox"] + label span {vertical-align:middle;}
				div.login.skin1 .security input[type="checkbox"] + label .off {display:inline-block;}
				div.login.skin1 .security input[type="checkbox"] + label .on {display:none;}
				div.login.skin1 .security input[type="checkbox"]:checked {background-position:-18px 0;}
				div.login.skin1 .security input[type="checkbox"]:checked + label {color:#18a2c9;}
				div.login.skin1 .security input[type="checkbox"]:checked + label .off {display:none;}
				div.login.skin1 .security input[type="checkbox"]:checked + label .on {display:inline-block}
			
			div.login.skin1 .notice {width:300px;margin:30px auto 0 auto;border-top:1px solid #dcdcdc;padding-top:30px;display:none;}
				div.login.skin1 .notice h2 {border-bottom:1px solid #eaeaea;padding-bottom:5px;font-size:1.2em;color:#323232;margin-bottom:5px;}
				div.login.skin1 .notice li {border-bottom:1px solid #f0f0f0;}
				div.login.skin1 .notice li:last-child {border-bottom:1px solid #eaeaea;}
				div.login.skin1 .notice li a span {display:block;height:35px;line-height:35px;color:#646464;padding-left:10px;}
				
	
	/* 로그인 2 스타일 */
	div.login.skin2 {background:#f0f0f0;height:100%;}
		div.login.skin2 h1 {display:block;margin:20px;position:absolute;left:0;top:0;z-index:1;}
			div.login.skin2 h1 .blank {position:absolute;left:-10000px;top:-10000px;}
			
		div.login.skin2 .select_design {border:0;z-index:1;}
		
		div.login.skin2 .main_img_area {background:url(../../images/common/img_login2.png) center bottom no-repeat #00698f;display:block;height:240px;position:absolute;left:0;right:0;top:0;z-index:0;}
		
		div.login.skin2 .input_area {width:300px;margin:0 auto 0 auto;padding-top:270px;position:relative;}
			div.login.skin2 .input_area li.input_line  {position:relative;display:block;margin-bottom:10px;}
			div.login.skin2 .input_area li.input_line label span {position:absolute;left:0;top:0;height:50px;line-height:50px;padding-left:16px;font-size:1.1em;color:#bababa;}
			div.login.skin2 .input_area li input {background:url(../../images/common/icon_login2.gif) no-repeat;background-position:265px 0px;background-color:#fff;}
				div.login.skin2 .input_area li input[type="password"] {background-position:265px -50px;}
			div.login.skin2 .input_area li input[type="text"],div.login.skin2 .input_area li input[type="password"] {margin:0;padding:0 15px;border:0;height:50px;line-height:50px;width:268px;font-size:1.1em;color:#646464;border-radius:5px;}
			div.login.skin2 .input_area li input[type="text"]:focus + label,div.login.skin2 .input_area li input[type="password"]:focus + label {display:none;}
				div.login.skin2 .input_area li.btn_line button.btn.login {width:100%;height:60px;background:#18a2c9;color:#fff;font-size:1.25em;border-radius:5px;}
				
			div.login.skin2 .input_area li.save_id {margin-top:10px;}
				div.login.skin2 .input_area li.save_id input[type="checkbox"] {border:1px solid #dcdcdc;background:#fff;width:16px;height:16px;-webkit-appearance:none;border:0;-moz-appearance:none;border:0;border:0;vertical-align:middle;border-radius:8px;margin-top:0px;margin:0 5px 0 0;}
				div.login.skin2 .input_area li.save_id input[type="checkbox"]:checked {border:6px solid #18a2c9;background:#fff;}
				div.login.skin2 .input_area li.save_id span {vertical-align:middle;color:#646464;}
			
			div.login.skin2 .input_area li.find_id {position:absolute;bottom:1px;right:0;}
				div.login.skin2 .input_area li.find_id a span {color:#18a2c9;}
				
			div.login.skin2 .security {position:fixed;bottom:20px;right:20px;}
				div.login.skin2 .security input[type="checkbox"] {background:#fff;border:1px solid #dcdcdc;width:16px;height:16px;-webkit-appearance:none;border:0;-moz-appearance:none;border:0;border:0;vertical-align:middle;margin-right:5px;border-radius:8px;}
				div.login.skin2 .security input[type="checkbox"] + label {color:#646464;}
				div.login.skin2 .security input[type="checkbox"] + label span {vertical-align:middle;}
				div.login.skin2 .security input[type="checkbox"] + label .off {display:inline-block;}
				div.login.skin2 .security input[type="checkbox"] + label .on {display:none;}
				div.login.skin2 .security input[type="checkbox"]:checked {border:6px solid #18a2c9;}
				div.login.skin2 .security input[type="checkbox"]:checked + label {color:#18a2c9;}
				div.login.skin2 .security input[type="checkbox"]:checked + label .off {display:none;}
				div.login.skin2 .security input[type="checkbox"]:checked + label .on {display:inline-block}
			
			div.login.skin2 .notice {width:300px;margin:30px auto 0 auto;border-top:1px solid #dcdcdc;padding-top:30px;display:none;}
				div.login.skin2 .notice h2 {border-bottom:1px solid #eaeaea;padding-bottom:5px;font-size:1.2em;color:#323232;margin-bottom:5px;}
				div.login.skin2 .notice li {border-bottom:1px solid #f0f0f0;}
				div.login.skin2 .notice li:last-child {border-bottom:1px solid #eaeaea;}
				div.login.skin2 .notice li a span {display:block;height:35px;line-height:35px;color:#646464;padding-left:10px;}
				
	/* 로그인 3 스타일 */
	div.login.skin3 {background:#fafafa;height:100%;}
		div.login.skin3 h1 {display:block;position:absolute;left:350px;top:0;right:0;bottom:0;z-index:1;text-align:center;background:url(../../images/common/logo_login3.gif) center center no-repeat;}
			div.login.skin3 h1 .blank {position:absolute;left:-10000px;top:-10000px;}
			
		div.login.skin3 .select_design {background:none;border:1px solid #cacaca;border-width:0 0 1px 0;padding:0;width:120px;z-index:2;}
		div.login .select_design label span.icon {right:5px;}
				
		div.login.skin3 .input_area {position:absolute;left:0;top:0;bottom:0;width:300px;background:#46505a;padding:30px 25px 0 25px;}
			div.login.skin3 .input_area li.input_line  {position:relative;display:block;margin-bottom:10px;}
			div.login.skin3 .input_area li.input_line label span {position:absolute;left:0;top:0;height:50px;line-height:50px;padding-left:50px;font-size:1.1em;color:#bababa;}
			div.login.skin3 .input_area li input {background:url(../../images/common/icon_login2.gif) no-repeat;background-position:20px 0px;background-color:#fff;}
				div.login.skin3 .input_area li input[type="password"] {background-position:20px -50px;}
			div.login.skin3 .input_area li input[type="text"],div.login.skin3 .input_area li input[type="password"] {margin:0;padding:0 15px 0 50px;border:0;height:50px;line-height:50px;width:235px;font-size:1.1em;color:#646464;border-radius:5px;}
			div.login.skin3 .input_area li input[type="text"]:focus + label,div.login.skin3 .input_area li input[type="password"]:focus + label {display:none;}
				div.login.skin3 .input_area li.btn_line button.btn.login {width:100%;height:60px;background:#18a2c9;color:#fff;font-size:1.25em;border-radius:5px;}
				
			div.login.skin3 .input_area li.save_id {margin-top:10px;}
				div.login.skin3 .input_area li.save_id input[type="checkbox"] {border:2px solid #bababa;background:none;width:18px;height:18px;-webkit-appearance:none;border:0;-moz-appearance:none;border:0;border:0;vertical-align:middle;border-radius:3px;margin-top:0px;margin:0 5px 0 0;}
				div.login.skin3 .input_area li.save_id input[type="checkbox"]:checked {border:2px solid #18a2c9;background:#fff;background:#49caef;}
				div.login.skin3 .input_area li.save_id span {vertical-align:middle;color:#eaeaea;}
			
			div.login.skin3 .input_area li.find_id {position:absolute;top:223px;right:25px;}
				div.login.skin3 .input_area li.find_id a span {color:#93a1ae;}
				
			div.login.skin3 .security {position:fixed;bottom:20px;left:20px;}
				div.login.skin3 .security input[type="checkbox"] {background:#fff;border:1px solid #dcdcdc;width:16px;height:16px;-webkit-appearance:none;border:0;-moz-appearance:none;border:0;border:0;vertical-align:middle;margin-right:5px;border-radius:8px;}
				div.login.skin3 .security input[type="checkbox"] + label {color:#eaeaea;}
				div.login.skin3 .security input[type="checkbox"] + label span {vertical-align:middle;}
				div.login.skin3 .security input[type="checkbox"] + label .off {display:inline-block;}
				div.login.skin3 .security input[type="checkbox"] + label .on {display:none;}
				div.login.skin3 .security input[type="checkbox"]:checked {border:6px solid #18a2c9;}
				div.login.skin3 .security input[type="checkbox"]:checked + label {color:#18a2c9;}
				div.login.skin3 .security input[type="checkbox"]:checked + label .off {display:none;}
				div.login.skin3 .security input[type="checkbox"]:checked + label .on {display:inline-block}
			
			div.login.skin3 .notice {width:300px;margin:30px auto 0 auto;border-top:1px solid #dcdcdc;padding-top:30px;display:none;}
				div.login.skin3 .notice h2 {border-bottom:1px solid #eaeaea;padding-bottom:5px;font-size:1.2em;color:#323232;margin-bottom:5px;}
				div.login.skin3 .notice li {border-bottom:1px solid #f0f0f0;}
				div.login.skin3 .notice li:last-child {border-bottom:1px solid #eaeaea;}
				div.login.skin3 .notice li a span {display:block;height:35px;line-height:35px;color:#646464;padding-left:10px;}
				
	/* 로그인 4 스타일 */
	div.login.skin4 {background:#fff;height:100%;}
		div.login.skin4 h1 {display:block;border-top:5px solid #18a2c9;padding:15px 0 0 20px;}
			
		div.login.skin4 .select_design {background:none;border:1px solid #cacaca;border-width:0 0 1px 0;padding:0;width:120px;z-index:2;}
		div.login .select_design label span.icon {right:5px;}
				
		div.login.skin4 .login_area {background:#00698f;margin-top:40px;}
		div.login.skin4 .login_area .login_content {width:800px;margin:0 auto;}
		div.login.skin4 .login_area .login_content:after {content:"";display:block;clear:both;}
		div.login.skin4 .login_area .login_content .main_img {float:left;width:310px;height:420px;background:url(../../images/common/img_login4.png) center center no-repeat #18a2c9;}
			div.login.skin4.zh .login_area .login_content .main_img {background:url(../../images/zh/img_login4.png) center center no-repeat #18a2c9;}

		div.login.skin4 .login_form {float:right;background:#fff;width:410px;height:370px;padding:50px 40px 0 40px;position:relative;}
		div.login.skin4 .input_area ul {position:relative;}
		div.login.skin4 .input_area h2 {font-size:1.6em;text-transform:uppercase;color:#646464;font-weight:200;font-family:Helvetica Neue,Helvetica;margin-bottom:10px;padding-bottom:10px;border-bottom:1px solid #eaeaea;}
			div.login.skin4 .input_area li.input_line  {position:relative;display:block;margin-bottom:10px;}
			div.login.skin4 .input_area li.input_line label {position:absolute;left:13px;top:13px;height:16px;line-height:16px;font-size:1.05em;color:#bababa;z-index:8}
            div.login.skin4 .input_area li.input_line input {z-index:9;}
			div.login.skin4 .input_area li input {background:url(../../images/common/icon_login2.gif) no-repeat;background-position:227px -5px;background-color:#fff;}
				div.login.skin4 .input_area li input[type="password"] {background-position:227px -55px;}
			div.login.skin4 .input_area li input[type="text"],div.login.skin4 .input_area li input[type="password"] {margin:0;padding:0 40px 0 10px;border:1px solid #dcdcdc;;height:40px;line-height:38px;width:208px;font-size:1.05em;color:#646464;}
			div.login.skin4 .input_area li input[type="text"]:focus + label,div.login.skin4 .input_area li input[type="password"]:focus + label {display:none;}
				div.login.skin4 .input_area li.btn_line {position:absolute;right:0;top:0;}
				div.login.skin4 .input_area li.btn_line button.btn.login {width:140px;height:95px;background:#18a2c9;color:#fff;font-size:1.25em;border:0;border-radius:0;text-shadow:none;font-weight:normal;margin:0;}
				
				/* 에러 메시지 출력 관련 css */
				div.login.skin4 .input_area li.error {margin-top:5px;}
				div.login.skin4 .input_area li.error span {vertical-align:middle;color:#e65b5b;}
				div.login.skin4 .input_area li.error span.icon {width:16px;height:16px;display:inline-block;margin-right:5px;background:url(../../images/common/icon_login_error.gif) no-repeat;}
				
			div.login.skin4 .input_area li.save_id {margin-top:10px;}
				div.login.skin4 .input_area li.save_id input[type="checkbox"] {width:18px;height:18px;vertical-align:middle;margin:0 5px 0 0;}
				div.login.skin4 .input_area li.save_id input[type="checkbox"]:checked {border:1px solid #18a2c9;background:#18a2c9;}
				div.login.skin4 .input_area li.save_id input[type="checkbox"]:checked + span {color:#18a2c9;}
				div.login.skin4 .input_area li.save_id span {vertical-align:middle;color:#646464;}

			div.login.skin4 .input_area li.join_us {position:absolute;left:75px;top:-42px;border-left:1px solid #dcdcdc;padding-left:15px;}
				div.login.skin4 .input_area li.join_us span {display:block;height:20px;line-height:20px;font-size:1.4em;font-weight:300;color:#646464;}
				
			div.login.skin4 .input_area li.find_id {position:absolute;top:107px;right:0;}
				div.login.skin4 .input_area li.find_id a span {color:#909090;}
				
			div.login.skin4 .security {position:absolute;top:50px;right:40px;}
				div.login.skin4 .security input[type="checkbox"] {display:none;}
				div.login.skin4 .security input[type="checkbox"] + label span.icon.check {display:inline-block;background:url(../../images/common/icon_toggle.png) no-repeat;width:50px;height:20px;vertical-align:middle;margin-right:5px;}
				div.login.skin4 .security input[type="checkbox"] + label {color:#909090;}
				div.login.skin4 .security input[type="checkbox"] + label span {vertical-align:middle;}
				div.login.skin4 .security input[type="checkbox"] + label .off {display:inline-block;width:20px;}
				div.login.skin4 .security input[type="checkbox"] + label .on {display:none;}
				div.login.skin4 .security input[type="checkbox"]:checked + label span.icon.check {background-position:0 -20px;}
				div.login.skin4 .security input[type="checkbox"]:checked + label {color:#18a2c9;}
				div.login.skin4 .security input[type="checkbox"]:checked + label .off {display:none;}
				div.login.skin4 .security input[type="checkbox"]:checked + label .on {display:inline-block;width:20px;}
			
			div.login.skin4 .notice {margin-top:40px;}
				div.login.skin4 .notice h2 {font-size:1.6em;text-transform:uppercase;color:#646464;font-weight:200;font-family:Helvetica Neue,Helvetica;padding-bottom:10px;border-bottom:1px solid #eaeaea;}
				div.login.skin4 .notice li {border-bottom:1px solid #fafafa;}
				div.login.skin4 .notice li:last-child {border-bottom:1px solid #eaeaea;height:30px;line-height:30px;}
				div.login.skin4 .notice li a span {display:block;height:30px;line-height:30px;color:#909090;}
				
			div.login.skin4 .footer {padding:30px;font-size:.9em;color:#909090;line-height:120%;}
				div.login.skin4 .footer p {margin-bottom:10px;}
				div.login.skin4 .footer p a {color:#18a2c9;}
				
		/* 로그인 5 스타일 */
	div.login.skin5 {background:#fff;height:100%;}
		div.login.skin5 h1 {display:block;padding:20px 0 0 20px;}
			
		div.login.skin5 .select_design {background:none;border:1px solid #cacaca;padding:0 10px;width:100px;z-index:2;}
		div.login .select_design label span.icon {right:5px;}
				
		div.login.skin5 .login_area {background:#fff;border-top:10px solid #18a2c9;margin-top:60px;}
		div.login.skin5 .login_area .main_img {background:#fff;border-bottom:1px solid #eaeaea;}
			div.login.skin5 .login_area .main_img img {display:block;margin:0 auto;}
		div.login.skin5 .login_area .login_content {width:1000px;margin:0 auto;}

		div.login.skin5 .login_form {background:#fff;width:1000px;padding:35px 0 0 0;position:relative;min-height:220px;border-bottom:1px solid #eaeaea;}
		div.login.skin5 .login_form:after {content:"";display:block;clear:both;}
		div.login.skin5 .input_area {float:left;margin-left:50px;width:410px;border-bottom:1px solid #eaeaea;padding-bottom:20px;}
		div.login.skin5 .input_area ul {position:relative;}
		div.login.skin5 .input_area h2 {font-size:1.2em;text-transform:uppercase;color:#323232;font-weight:200;padding-bottom:10px;}
			div.login.skin5 .input_area li.input_line  {position:relative;display:block;margin-bottom:10px;}
			div.login.skin5 .input_area li.input_line label span {position:absolute;left:1px;top:0;height:40px;line-height:40px;padding-left:10px;font-size:1.05em;color:#bababa;}
			div.login.skin5 .input_area li input {background:url(../../images/common/icon_login2.gif) no-repeat;background-position:227px -5px;background-color:#fff;}
				div.login.skin5 .input_area li input[type="password"] {background-position:227px -55px;}
			div.login.skin5 .input_area li input[type="text"],div.login.skin5 .input_area li input[type="password"] {margin:0;padding:0 40px 0 10px;border:1px solid #dcdcdc;;height:38px;line-height:38px;width:208px;font-size:1.05em;color:#646464;}
			div.login.skin5 .input_area li input[type="text"]:focus + label,div.login.skin5 .input_area li input[type="password"]:focus + label {display:none;}
				div.login.skin5 .input_area li.btn_line {position:absolute;right:0;top:0;}
				div.login.skin5 .input_area li.btn_line button.btn.login {width:140px;height:90px;background:#18a2c9;color:#fff;font-size:1.25em;}
				
			div.login.skin5 .input_area li.save_id {margin-top:10px;}
				div.login.skin5 .input_area li.save_id input[type="checkbox"] {border:1px solid #bababa;background:none;width:18px;height:18px;-webkit-appearance:none;border:0;-moz-appearance:none;border:0;border:0;vertical-align:middle;margin-top:0px;margin:0 5px 0 0;}
				div.login.skin5 .input_area li.save_id input[type="checkbox"]:checked {border:1px solid #18a2c9;background:#18a2c9;}
				div.login.skin5 .input_area li.save_id input[type="checkbox"]:checked + span {color:#18a2c9;}
				div.login.skin5 .input_area li.save_id span {vertical-align:middle;color:#646464;}
			
			div.login.skin5 .input_area li.find_id {position:absolute;top:102px;right:0;}
				div.login.skin5 .input_area li.find_id a span {color:#909090;}
				
			div.login.skin5 .security {position:absolute;left:50px;top:210px;}
				div.login.skin5 .security input[type="checkbox"] {background:url(../../images/common/icon_toggle.png) no-repeat;width:50px;height:20px;-webkit-appearance:none;border:0;-moz-appearance:none;border:0;border:0;vertical-align:middle;margin-right:5px;border-radius:8px;}
				div.login.skin5 .security input[type="checkbox"] + label {color:#909090;}
				div.login.skin5 .security input[type="checkbox"] + label span {vertical-align:middle;}
				div.login.skin5 .security input[type="checkbox"] + label .off {display:inline-block;}
				div.login.skin5 .security input[type="checkbox"] + label .on {display:none;}
				div.login.skin5 .security input[type="checkbox"]:checked {background-position:0 -20px;}
				div.login.skin5 .security input[type="checkbox"]:checked + label {color:#18a2c9;}
				div.login.skin5 .security input[type="checkbox"]:checked + label .off {display:none;}
				div.login.skin5 .security input[type="checkbox"]:checked + label .on {display:inline-block}
			
			div.login.skin5 .notice {margin-left:510px;width:440px;}
				div.login.skin5 .notice h2 {font-size:1.2em;text-transform:uppercase;color:#323232;font-weight:200;padding-bottom:10px;border-bottom:1px solid #eaeaea;}
				div.login.skin5 .notice li {border-bottom:1px solid #fafafa;}
				div.login.skin5 .notice li:last-child {border-bottom:1px solid #eaeaea;}
				div.login.skin5 .notice li a span {display:block;height:30px;line-height:30px;color:#909090;}
				
			div.login.skin5 .footer {padding:30px 0;font-size:.9em;color:#909090;line-height:120%;text-align:right;width:1000px;margin:0 auto;}
				div.login.skin5 .footer p {margin-bottom:10px;}
				div.login.skin5 .footer p a {color:#18a2c9;}

