@charset "utf=8";

/* 로그인 */
#login {width: 100%; height: 100vh; overflow: hidden; background-color: #f4f2f2;}
.login-wrap {height: 100%;}
.login-box {position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); margin: 0 auto;}
.login-content {width: 320px; height: 350px; margin: 0 auto; padding: 53px 40px;  background-color: #fff; border-radius: 40px; text-align: center; box-shadow: 0 0 15px #c4c4c4;}

.logo {margin-bottom: 38px;}
.logo img {height: 30px;}
.logo span {font-size: 15px; color: #9a9ca0;}

.input-login {margin-bottom: 30px;}
.input-login input {width: 100%; border: none; border-bottom: 2px solid #c4c4c4; font-size: 12px; padding: 7px 0;}
.input-login input:first-child {margin-bottom: 36px;}
.input-login input::placeholder {color: #c4c4c4;}
.input-login input:hover, .input-login form input:focus {border-bottom: 2px solid #ee4034;}
.input-login input:hover::placeholder {color: #565656;}

.btn-login {position: relative; bottom: 0; right: 0;}
.btn-login > div {height: 36px; line-height: 32px; font-weight: 600; border-radius: 5px; cursor: pointer}
.btn-login .btn-signin {margin-bottom: 14px; border: 1px solid #9a9ca0;}
.btn-login .btn-signin:hover, .btn-login .btn-signin:focus {border: 1px solid #ee4034;}
.btn-login .btn-google:hover, .btn-login .btn-google:focus {background-color: #c63434;}
.btn-login div span {font-size: 14px;}
.btn-login .btn-signin span {color: #9a9ca0;}
.btn-login .btn-signin:hover span, .btn-login .btn-signin:focus span {color: #ee4034;}
.btn-login .btn-google span {color: #fff;}

.login-service {display: flex; justify-content: space-between; align-items: center;}
.login-service > div:first-child {display: flex; align-items: center;}
.login-service input.save-id[type=checkbox] {width: 15px; height: 15px; border: 1px solid #7f7f7f;}
.login-service input.save-id[type=checkbox] + label {font-size: 14px; color: #7f7f7f; padding-left: 3px;}
.login-service input.save-id[type=checkbox]:checked {background-color: #7f7f7f!important;}
.login-service input.save-id[type=checkbox]:after {content: ''; background-color: #7f7f7f; display: inline-block; visibility: visible;}
.login-service .find-passwd {font-size: 14px; color: #7f7f7f; cursor: pointer;}

.copyright {margin-top: 35px; text-align: center;}
.copyright span {font-size: 12px; color: #b7b7b7;}