/* 로그인 */
.loginBox{position:relative;width:100%;margin:0 auto;padding:50px 0;border:solid 1px #ccc;}
.login-tit{font-weight:bold;font-size:32px;color:#222;text-align:center;line-height:2em;}
.login-tit + p{color:#666;line-height:1.8}
.login_form{overflow:hidden;width:100%;max-width:600px;margin:20px auto;}
.login_form .loginInput{float:left;width:69%;margin:0 2% 0 0;}
.login_form .loginInput .form-control{height:70px;padding:10px 20px;border:solid 1px #e0e0e0;border-radius:3px;font-size:17px;}
.login_form .loginBtn{float:left;width:29%;height:150px;}
.login_form .loginBtn .btn-login{width:100%;height:100%;border:solid 1px #444;border-radius:3px;background:#444;font-size:20px;color:#fff;}

.loginBox .login_etc,
.member-link{width:100%;max-width:600px;margin:0 auto 20px;}
.member-link{overflow:hidden;padding-top:20px;border-top:solid 1px #ccc;}
.member-link li{float:left;width:49%;list-style:none;}
.member-link li:first-child{width:49%;margin-right:2%;}
.member-link li a{display:block;position:relative;padding:14px 15px;border:solid 1px #ddd;transition:all .3s ease}
.member-link li a:after{content:'';position:absolute;top:50%;right:5%;width:8px;height:8px;margin-top:-4px;border:solid #000;border-width:1px 1px 0 0;transform:rotate(45deg);}
.member-link li a:hover{border:solid 1px #444;background:#444;color:#fff;}
.member-link li a:hover:after{border-color:#fff;}


/* 넓이가 767px 이하일 때*/
@media (max-width: 767px) {
.loginBox{padding:25px 15px;}
.login_form, .loginBox .login_etc, .member-link{max-width:100%;}
.login_form .loginInput,
.login_form .loginBtn{float:none;width:100%;margin:0 0 10px;}
.login_form .loginInput .form-control{height:45px;padding:7px 15px 8px;line-height:1.5;font-size:14px;}
.login_form .loginBtn{height:auto;}
.login_form .loginBtn .btn-login{padding:15px;}
}

/* 넓이가 577px 이하일 때*/
@media (max-width: 577px) {
.member-link li{width:100%;margin-bottom:10px}
.member-link li:first-child{width:100%;margin-right:0;}
.member-link li a{padding:10px;}
.member-link li a:after{right:6%;}
}