@charset "utf-8";

.loginArea{position:relative;border-radius:0;min-width:250px;max-width:380px;padding:20px 50px;text-align:center;text-shadow:0 0 0 !important;color:#fff;margin:0 auto;}
.loginArea{
	background-color:#65625d;background:rgba(101,98,93,.96) !important;
	/*
	background-image: -webkit-gradient(linear,top,bottom,from(#76726a),to(#76726a));
	background-image: -webkit-linear-gradient(to bottom,#76726a,#76726a);
	background-image: -moz-linear-gradient(to bottom,#76726a,#76726a);
	background-image: -o-linear-gradient(to bottom,#76726a,#76726a);
	background-image: linear-gradient(to bottom,#76726a,#76726a);
	*/
}
.loginArea .txtWel img{max-width:220px;margin-bottom:8px;}
.loginArea .overlay{position:absolute;width:100%;height:100%;top:0;left:0;background:#fff;opacity:.2;filter:alpha(opacity=20);-ms-filter:alpha(opacity=20);z-index:1000;display:none;}
.loginArea .loginInput{position:relative;}
.loginArea .loginComment{display:block;font-weight:600;color:#fff;font-size:12px;margin:5px 0 0;min-height:30px;line-height:30px;}
.loginArea .loginComment.multiline{line-height:15px;}
.loginArea .loginComment.success{color:#fff;}
.loginArea .loginComment.error{color:#ff0;}
.loginArea .loginInput div.ui-input-text{padding:0 !important;margin:0 !important;border:0;border-radius:.1em;}
.loginArea .loginInput .inputArea{padding:94px 0 0;}
.loginArea .loginInput .inputArea .input{position:absolute;top:11px;left:0;width:100%;}
.loginArea .loginInput .inputArea .input .inInput{padding-right:100px;}
.loginArea .loginInput .inputArea .input input{height:38px;background:#fff;padding:0 6px;margin:0 0 7px;color:#333;}
.loginArea .loginInput .inputArea .comment{font-size:13px;margin-bottom:10px;}
.loginArea .loginInput .inputArea .comment span{display:inline-block;}
.loginArea .loginInput .inputLabel{position:absolute;top:-10000px;left:0;visibility:hidden;overflow:hidden;width:0;height:0;}
.loginArea .loginInput .btnLoginArea{width:83px !important;height:83px !important;position:absolute;top:11px;right:0;}
.loginArea .loginInput .btnLoginArea .btnLogin{border:0;border-radius:.3125em;margin:0;padding:14px 18px;}
.loginArea .loginInput .btnLoginArea .btnLogin img{width:47px;height:55px;}
.loginArea .loginInput .autoArea{margin:12px 0 15px;position:relative;text-align:left;}
.loginArea .loginInput .autoArea .auto{display:inline-block;}
.loginArea .loginInput .autoArea .join{position:absolute;top:3px;right:0;}
.loginArea .loginInput .autoArea .join img{height:28px;border-radius:.3125em;}
.loginArea .loginInput .autoArea input{vertical-align:middle;visibility:hidden;}
.loginArea .loginInput .autoArea label{font-size:13px;font-weight:600;color:#fff;text-shadow:none;background:transparent;border:0;}
.loginArea .loginInput .autoArea .ui-checkbox{margin:0;}
.loginArea .loginInput .findArea{margin:0;}
.loginArea .loginInput .findArea a{font-size:13px;font-weight:600;text-decoration:underline;color:#fff;}
.loginArea .loginInput .info{font-size:12px;margin:11px 0 0;line-height:1.4em;margin-left:-5px;margin-right:-5px;}
.loginArea .loginInput .info span{display:inline-block;}
.loginArea .loginInput .info a{color:#d9ae4d !important;text-shadow:0 0 0;font-weight:bold;}
@media all and (max-width:480px) {
	.loginArea{padding:20px;}
}
@media all and (max-width:360px) {
	.loginArea{padding:10px 10px 16px;}
	.loginArea .loginInput .inputArea .input .inInput{padding-right:92px;}
}

.loginPage {padding:0 20px;}
.loginPage .loginTitle {max-width:642px; margin:21px auto -5px; font-size:18px; font-weight:500; color:#282a37;}
.loginPage .loginGuide {margin-bottom:20px; font-size:14px; line-height:1.4;}
.loginPage .loginGuide .subGuide {display:block; padding-left:16px; font-size:12px;}
.loginPage .loginComment {margin-bottom:18px; font-size:12px; font-family:dotum;}
.loginPage .labelArea{text-align:center;}
.loginPage .panel li {margin-bottom:5px;}
.loginPage .panel li .loginComment {margin:0;}
.loginPage .findWay {text-align:center;}
.loginPage .findWay .button {width:185px; height:50px; line-height:50px; font-size:15px;}
.loginPage .myEmail {color:#2070da;}
.loginPage .resetPassword .labelArea {width:42%;}
.loginPage .resetPassword .inputArea {width:58%;}
.loginPage .certifying {text-align:center; padding-top:70px; padding-bottom:110px;}
.loginPage .certifying img {width:84px;}
.loginPage .certifying p {font-size:20px;}
.loginPage .greetingClause {text-align:center; margin-top:20px; color:#282a37; font-size:13px;}
.loginPage .greetingClause strong {display:block; color:#282a37; font-size:20px;}
.loginPage .greetingClause strong span {display:block;color:#2070da;}
.loginPage .clausePanel .loginGuide {margin-bottom:5px;}
.loginPage .clausePanel .checkClause {margin-top:5px; margin-bottom:20px; text-align:right; font-size:14px;}
.loginPage .clausePanel .button {width:46%;}
.loginPage .clauseBox {padding:10px; height:72px; overflow-y:scroll; background-color:#fff;}
.loginPage .clauseBox * {font-family:dotum; color:#666; font-size:11px;}

.panel {max-width:600px; margin:15px auto; padding:15px 21px; background-color:#282a37; color:#fff; border-radius:5px; font-size:14px;}
.panel .inner {width:100%;}
.panel li {position:relative; margin-bottom:11px;}
.panel p {margin-top:8px;}
.panel .labelArea {float:left; width:30%; height:24px; padding-top:8px;}
.panel .labelArea .option {float:right; font-size:12px;}
.panel .inputArea {float:left; width:70%;}
.panel .btnArea {text-align:center; margin-top:25px; margin-bottom:7px;}
.panel .selector {border-color:#010101;}
.panel .btnConfirm {width:113px;}
.panel .gutter {display:inline-block; vertical-align:-5px;}