.login-part {position: relative; display: flex; flex-direction: column; align-items:center ; padding: 20px; height: 100vh;}
.login-part .login-logo {width: 50vw; margin: 60px 0;}
.login-part .login-wrap {width: 100%; display: flex; flex-direction: column; gap: 15px;}
.login-part .login-wrap p {font-size: 15px; font-weight: 600; margin-bottom: 8px;}
.login-part .login-wrap input {padding: 14px 10px; border-radius: 5px; border: 1px solid #ddd; font-size: 14px;}
.login-part .login-btn {width: 100%; margin-top: 30px;}
.login-part .login-btn button {padding: 15px 0; text-align: center; width: 100%; font-size: 15px;}
.login-part .login-btn ul {font-size: 0; text-align: center;}
.login-part .login-btn ul li {display: inline-block; font-size: 14px; color: #888; padding: 0 10px; border-right: 1px solid #ddd; line-height: 0.8; margin: 15px 0;}
.login-part .login-btn ul li:last-child {border: none;}
.login-part .join {position: absolute; width: 100%; text-align: center; display: flex; align-items: center; gap: 10px;  bottom: 50px; justify-content: center;}
.login-part .join p {color: #888;}
.login-part .join span {text-decoration: underline; font-weight: 600;}

.find-id {padding: 20px;display: flex; flex-direction: column; gap: 15px;}
.find-id h3 {font-size: 20px; font-weight: 700; margin-bottom: 20px;}
.find-id input {padding: 13px 10px; border-radius: 5px; border: 1px solid #ddd; font-size: 15px;}

/* .find-id > div {} */
.find-id > div p {font-size: 15px; font-weight: 600; margin-bottom: 8px;}
.find-id > div > div {display: flex; align-items: center; gap: 10px;}
.find-id > div > div div {background-color: #888; color: white; padding: 12px; border-radius: 5px;}
.id-num {display: none;}

.id-done {display: flex; flex-direction: column; align-items: center; margin-top: 150px;}
.id-done .done-img {width: 80px;}
.id-done h3 {text-align: center; font-size: 20px; font-weight: 700; margin: 30px 0;}
.id-done h3 span {font-weight: 700; display: inline;}

.id-num .done-confirm {margin-top: 2px; color: #4040df; display: none;}