/* 아이디 찾기 */
.findid {margin-top: 75px;}
.form-wrap {width: 530px; margin: 0 auto;}
.input-wrap .input-item {display: flex; align-items: center; height: 45px; border: 1px solid #ddd; padding: 8px 0; box-sizing: border-box; font-size: 15px; margin-bottom: 16px;}
.input-wrap .input-item:last-child {margin-bottom: 0;}
.input-wrap .input-item > label {width: 116px; height: 100%; line-height: 27px; border-right: 1px solid #ddd; padding: 0 5px 0 20px; box-sizing: border-box;}
.input-wrap .input-item.label-long > label {width: 148px;}
.input-wrap .input-item .input-radio {margin-left: 26px; display: flex; width: calc(100% - 116px); gap: 5%;}
.input-wrap .input-item .input-radio .radio-item {display: flex; align-items: center; gap: 10px; font-size: 15px; font-weight: 500;}
.input-wrap .input-item .input-radio input:checked + label {color: #42ade2;}
.input-wrap .input-item .input-text {width: calc(100% - 116px); position: relative;}
.input-wrap .input-item.label-long .input-text {width: calc(100% - 150px);}
.input-wrap .input-item .input-text.has-btn {display: grid; grid-template-columns: 3fr auto; gap: 3px; padding-right: 6px; box-sizing: border-box;}
.input-wrap .input-item .input-text input {border: none; width: 100%; height: 100%; background-color: transparent; padding: 0 15px 0 26px; box-sizing: border-box; font-size: 14px;}
.input-wrap .input-item .input-text input::placeholder {color: #999; font-weight: 300;}
.input-wrap .input-item .input-text.has-btn .btn-normal {height: 30px;}
.input-wrap .input-item .input-file input {text-align: right;}
.input-wrap .email {display: flex; gap: 7px;}
.input-wrap .email .input-item .input-text {display: flex; align-items: center; gap: 2px;}
.input-wrap .email .input-item .input-text input:first-child {padding: 0 5px 0 26px;}
.input-wrap .email .input-item .input-text input:nth-child(3) {padding: 0 5px}
.input-wrap .email select {width: 140px; height: 45px; line-height: 15px; color: #333;}
.input-file .file-name {appearance: none; -webkit-appearance: none; -moz-appearance: none; color: #999;}
.input-file input[type=file] {position: absolute; width: 1px!important; height: 1px!important; padding: 0!important; margin: -1px; overflow: hidden; clip: rect(0,0,0,0); border: 0;}
.input-file label {line-height: 27px;}
.form-wrap .btn-wrap {margin-top: 35px;}
.input-item-top {color: #999; margin-bottom: 10px; font-size: 14px;}

/* 회원가입 */
.join01 {margin-top: 75px;}
.join02 {margin-top: 35px;}
.join03 {margin-top: 55px;}
.join-step {position: relative;}

.card-radio {display: flex; justify-content: center; gap: 20px;}
.card-radio .card-item .card-content-wrap {position: relative; width: 245px; height: 195px; background-color: #ebebeb; border-radius: 15px; padding: 25px 0; text-align: center; cursor: pointer; display: flex; flex-direction: column; justify-content: center; box-sizing: border-box; transform: .3s all ease;}
.card-radio .card-item .card-content-wrap .ico-check {position: absolute; top: 10px; right: 15px; display: none; transition: .3s all ease;}
.card-radio .card-item .card-content-wrap .card-content .card-content-img {width: 80px; height: 80px; border-radius: 100%; margin: 0 auto 10px; background-color: #fff; display: flex; align-items: center; justify-content: center;}
.card-radio .card-item .card-content-wrap .card-content h4 {font-size: 13px; font-weight: 400; margin-bottom: 8px;}
.card-radio .card-item .card-content-wrap .card-content h3 {font-size: 18px;}
.card-radio .card-item input[type=radio]:checked + .card-content-wrap {background-color: #42ade2; color: #fff; transition: .3s all ease;}
.card-radio .card-item input[type=radio]:checked + .card-content-wrap .ico-check {display: block; transform: .3s all ease;}
.link-login {font-size: 14px; margin: 55px auto 0; text-align: center;}
.link-login a {color: #42ade2; margin-left: 10px;}

.step01 {text-align: center;}
.step01 .msg {display: inline-block; position: relative; color: #fff; font-size: 12px; margin: 25px auto 0; height: 30px; padding: 0 8px; line-height: 30px; background-color: #5b5959; border-radius: 4px;}
.step01 .msg::after {position: absolute; display: block; content: ''; top: -17px; right: 5%; background-color: transparent; border-left: 6px solid transparent; border-top: 6px solid transparent; border-right: 6px solid transparent; border-bottom: 12px solid #5b5959}
.step02 {width: 530px; margin: 50px auto 0;}
.step02 .terms-wrap .terms-box {margin-bottom: 34px;}
.step02 .terms-wrap .terms-box:last-child {margin-bottom: 0;}
.step02 .terms-wrap .terms-box h3 {text-align: left; font-size: 16px; margin-bottom: 10px;}
.step02 .terms-wrap .terms-box .terms-con {border: 1px solid #ddd; background-color: #f9f9f9; height: 210px; overflow-y: auto; padding: 10px; box-sizing: border-box; margin-bottom: 18px;}
.step02 .terms-wrap .terms-check label {font-size: 13px;}
.step02 .btn-wrap {margin-top: 50px;}
.step03 {width: 530px; margin: 18px auto 0;}
.step03 .join-desc {font-weight: 300; line-height: 145%; font-size: 15px; margin-bottom: 30px; text-align: center;}
.step03 .title {font-size: 14px; color: #42ade2; margin-bottom: 20px;}
.step03 .btn-wrap {margin-top: 25px;}
.step03 .btn-wrap button:nth-child(2) {padding: 0 45px;}

/* 로그인 */
.content-wrap > .left > div, .side-user-wrap .side-user > div {width: 100%; height: 685px; border-radius: 8px; border: 1px solid #ddd; padding: 50px 20px 40px 20px; box-sizing: border-box;}
.content-wrap > .left > div .login-input input::placeholder {background-position: 0px 50%; padding-left: 25px;}
.content-wrap > .left > div .login-input input[type=text]::placeholder {background-image: url(../images/main/ico_id.png); background-repeat: no-repeat; background-size: 15px;}
.content-wrap > .left > div .login-check {margin-bottom: 20px;}
.content-wrap > .left > div .number-wrap {margin-bottom: 30px;}
.content-wrap > .left > div .btn-wrap, .content-wrap .left > div .btn-wrap  {display: block; margin-bottom: 24px;}
.content-wrap > .left > div .btn-wrap button, .content-wrap .left > div .btn-wrap button {width: 100%; height: 35px; box-sizing: border-box; margin-bottom: 8px;}
.content-wrap > .left > div .btn-wrap button:last-child, .content-wrap .left > div .btn-wrap button:last-child {letter-spacing: -0.5px;}
.content-wrap > .left > div .btn-wrap button img, .content-wrap .left > div .btn-wrap button img {height: 18px;}
.content-wrap > .left > div .btn-normal, .content-wrap .left > div .btn-normal {background-color: #42ADE2; border-radius: 8px; color: #fff; cursor: pointer; font-size: 16px; font-weight: 600; border: 2px solid #42ADE2; display: inline-flex; justify-content: center; align-items: center; gap: 10px;}
.content-wrap > .left > div .btn-white, .content-wrap .left > div .btn-white {background-color: #fff; color: #42ADE2; border: 2px solid #42ADE2;}
.content-wrap > .left > div .link-wrap, .content-wrap .left > div .link-wrap {margin-bottom: 50px;}
.content-wrap > .left > div .number, .content-wrap .left > div .number {display: inline-flex; gap: 10px; font-size: 27px; font-weight: 900; margin-bottom: 28px; color: #4cade2;}
.content-wrap > .left > div .number img, .content-wrap .left > div .number img {height: 30px;}
.content-wrap > .left > div .time, .content-wrap .left > div .time {background-color: #efefef; border-radius: 9px; padding: 25px 30px; font-size: 16px; line-height: 160%;}