@charset "utf-8";

/* 공통 */
.member-wrap {background: linear-gradient(180deg, rgba(160, 255, 141, 0.04) 0%, rgba(28, 172, 0, 0.04) 100%); padding: var(--space-100) var(--space-container) var(--space-150); display: flex; align-items: center; justify-content: center;}
.member-wrap .box h2 {font-size:var(--font-size-40); line-height:1.2; color:#2c2c2c; font-family: 'Paperlogy', sans-serif; text-align:center; margin-bottom: var(--space-40);}
.member-wrap .checkbox label:before {border-radius: 50%; background: #fff url("/images/member/member-check.svg") 50% 50% no-repeat; background-size: 10px; width: 18px; height: 18px;}
.member-wrap .checkbox input:checked + label:before {background: var(--color-secondary) url("/images/member/member-check-on.svg") 50% 50% no-repeat; border-color: var(--color-secondary);}
.member-wrap .box {max-width:570px; width: 100%; background: #fff; border-radius: var(--radius-32); box-shadow: 0 0 20px 0 rgba(0, 0, 0, 0.10); padding: var(--space-50); position: relative;}
.member-wrap .box::before {content: ''; position: absolute; width: clamp(40px, calc(101 / var(--inner) * 100vw), 101px); height: clamp(35px, calc(88 / var(--inner) * 100vw), 88px); left: 0; top: 0; transform: translate(-45%, -25%) rotate(90deg); background: url('/images/sub/scholarship-deco3.svg') no-repeat center center / contain; pointer-events: none; user-select: none; z-index: 1;}
.member-wrap .box::after {content: ''; position: absolute; width: clamp(50px, calc(104 / var(--inner) * 100vw), 104px); height: clamp(46px, calc(96 / var(--inner) * 100vw), 96px); bottom: 0; right: 0; transform: translate(72%, 2%); background: url('/images/sub/scholarship-deco4.svg') no-repeat center center / contain; pointer-events: none; user-select: none; z-index: 1;}

/* 로그인 */
.login .box .item {margin-bottom: var(--space-20);}
.login .box .item label {display:block; font-size:var(--font-size-16); line-height:1.5em; color:#2c2c2c; font-weight:500; margin-bottom: var(--space-15);}
.login .box .item label .required {color:var(--color-secondary);}
.login .box .item input {display:block; width:100%; height:54px; font-size:16px; padding:0 var(--space-15); border-radius: var(--radius-8); border:1px solid #ddd; background:#fff;}
.login .box .checkbox {color: #454545; font-size:var(--font-size-14); line-height:1.5; margin: 0;}
.login .box .links {display:flex; justify-content:space-between; align-items: center; margin-top: var(--space-20);}
.login .box .links a {font-size:var(--font-size-14); line-height:1.5em; color:#454545; margin: 0 var(--space-20); position: relative;}
.login .box .links a:after {content:""; position:absolute; top:50%; right: calc(var(--space-20) * -1); transform: translateY(-50%); width:1px; height:16px; background:#ddd;}
.login .box .links a:first-child {margin-left: 0;}
.login .box .links a:last-child {margin-right: 0;}
.login .box .links a:last-child:after {content:none;}
.login .box .button {display: flex; flex-direction: column; align-items: center; justify-content: center; margin-top: var(--space-40); gap: var(--space-10);}
.login .box .button input {width: 100%; font-size: var(--font-size-18); font-weight: 500;}
.login .box .button a {width: 100%; font-size: var(--font-size-18); font-weight: 500;}

.sns-login {text-align:center; margin-top:50px;}
.sns-login .tit {position:relative; color:#333; font-size:15px; font-weight:400; line-height:1.3em; margin-bottom:35px;}
.sns-login .tit:before {content:""; position:absolute; top:50%; left:0; margin-top:-1px; width:100%; height:1px; background:#ddd;}
.sns-login .tit span {display:inline-block; position:relative; padding:0 30px; background:#fff;}
.sns-login a {margin:0 12px;}

/* 약관동의 */
.agree .item {margin-bottom: var(--space-20);}
.agree .agree-tit {color:#aaa; font-size: var(--font-size-16); font-weight:500; line-height:1.3em; width: 100%; display: flex; align-items: center; justify-content: space-between; background: #f8f8f8; border-radius: var(--radius-8); padding: var(--space-15) var(--space-20); transition: all .3s;}
.agree .agree-tit .checkbox {display: flex; align-items: center; justify-content: center; margin: 0; cursor: pointer;}
.agree .agree-tit .checkbox label {cursor: pointer;}
.agree .agree-tit .checkbox label:before {width:24px; height:24px; background:transparent url("/images/member/member-check.svg") 50% 50% no-repeat; background-size: 16px; margin: -.2em 10px 0 0;}
.agree .agree-tit .checkbox input:checked + label:before {background-color:var(--color-primary); border-color:var(--color-primary); background-image:url("/images/member/member-check-on.svg"); background-size: 16px;}
.agree .agree-tit .icon {display: flex; align-items: center; justify-content: center; margin-left: auto; transition: all .3s; cursor: pointer;}
.agree .agree-box-wrap {border:1px solid rgba(87, 172, 70, 0.4); border-radius: var(--radius-8); overflow: hidden; margin-top: var(--space-10); display: none;}
.agree .active .agree-box-wrap {display: block;}
.agree .agree-box {position:relative; max-height:145px; padding: var(--space-18) var(--space-20); overflow-y:auto;}
.agree .agree-box .terms-wrap {color:#767676; font-size:14px;}
.agree .agree-box .terms-wrap .sec {margin-bottom:20px;}
.agree .agree-box .terms-wrap .sec h3 {color:#767676; font-size:14px; font-weight:400; margin-bottom:0;}
.agree .agree-box .terms-wrap .sec strong {font-weight:400;}

.agree .age .agree-tit {color: #242424; background: transparent; border: 1px solid #ddd; font-weight: 400;}
.agree .age .agree-tit label span {color: var(--color-secondary); font-weight: 500;}
.agree .age.active .agree-tit {background: transparent;}
.agree .age.check .agree-tit {background: transparent;}
.agree .age .agree-tit .checkbox input:checked + label:before {background-color: var(--color-secondary); border-color: var(--color-secondary);}

.agree .check .agree-tit {color: #242424; background: rgba(87, 172, 70, 0.05);}
.agree .check .agree-tit .icon {color: var(--color-primary);}

.terms-wrap {font-weight:400; color:#666; line-height:1.75em;}
.terms-wrap .sec {margin-bottom:40px;}
.terms-wrap .sec h3 {color:#222; font-size:1.1em; font-weight:700; margin-bottom:7px;}
.terms-wrap .sec p {margin-bottom:1em;}
.terms-wrap .sec strong {font-weight:700;}
.terms-wrap .sec ol li {padding-left:1em; text-indent:-1em;}
.terms-wrap .sec ol li ol li {padding-left:1.35em; text-indent:-1.35em;}
.terms-wrap .policy-contact {display:flex; padding:20px 0; background:#fafafa; border:1px solid #e5e5e5; margin-bottom:1em;}
.terms-wrap .policy-contact dl {flex:1; padding:0 20px; border-left:1px solid #e5e5e5;}
.terms-wrap .policy-contact dl:first-child {border-left:0;}
.terms-wrap .policy-contact dt {font-weight:500; color:#333; margin-bottom:12px;}

.agree .button {margin-top: var(--space-40);}
.agree .button .btn-pack {width: 100%; font-size: var(--font-size-18); font-weight: 500;}

/* 본인확인 */
.verify .box h2 {margin-bottom: var(--space-30);}
.verify .cont {width: 100%; max-width: 470px; margin: 0 auto;}
.verify .desc {margin: 0 0 var(--space-30); font-size: var(--font-size-16); line-height: 1.5; color: #686868; text-align: center;}
.verify .option {position: relative; display: flex; align-items: center; justify-content: center; min-height: 15px; margin: 0 0 20px;}
.verify .option::before {content: ''; position: absolute; left: 0; top: 50%; width: 100%; height: 1px; margin-top: -0.5px; background: #d9d9d9;}
.verify .option span {position: relative; z-index: 1; padding: 0 var(--space-10); background: #fff; font-size: var(--font-size-14); line-height: 1.07; color: #868686;}
.verify .btn-wrap {display: flex; flex-wrap: wrap; gap: 10px; align-items: stretch; justify-content: center;}
.verify .btn-wrap a {display: flex; flex-direction: column; align-items: center; justify-content: center; flex: 0 1 230px; width: 230px; max-width: 100%; min-height: 210px; border-radius: var(--radius-16); gap: var(--space-20); text-align: center; transition: all .3s;}
.verify .btn-wrap .phone {background: var(--color-primary); border: 1px solid var(--color-primary);}
.verify .btn-wrap .ipin {background: var(--color-secondary); border: 1px solid var(--color-secondary);}
.verify .btn-wrap .icon {display: flex; align-items: center; justify-content: center; width: 60px; height: 60px; border-radius: var(--radius-16); background: rgba(255,255,255,0.2); color: #fff; transition: all .3s;}
.verify .btn-wrap .icon svg {width: 32px; height: 32px;}
.verify .btn-wrap h3 {font-size: var(--font-size-20); font-weight: 600; line-height: 1.2; color: #fff; transition: all .3s;}
.verify .btn-wrap p {font-size: var(--font-size-14); font-weight: 500; line-height: 1.29; color: rgba(255,255,255,0.7); transition: all .3s;}
.verify .btn-wrap a:hover {background: #fff;}
.verify .btn-wrap a:hover p {color: rgba(134, 134, 134, 0.7);}
.verify .btn-wrap .phone:hover .icon {background: rgba(87, 172, 70, 0.1); color: var(--color-primary);}
.verify .btn-wrap .phone:hover h3 {color: var(--color-primary);}
.verify .btn-wrap .ipin:hover .icon {background: rgba(245, 158, 11, 0.1); color: var(--color-secondary);}
.verify .btn-wrap .ipin:hover h3 {color: var(--color-secondary);}

/* 회원가입 */
.join .box {max-width: 1000px;}
.join .warning {display: flex; align-items: center; gap: var(--space-20); margin-bottom: var(--space-40); border-radius: var(--radius-8); border: 1px solid rgba(245, 158, 11, 0.6); background: rgba(245, 158, 11, 0.04); padding: var(--space-18) var(--space-40);}
.join .warning .icon {display: flex; align-items: center; justify-content: center; width: 64px; height: 64px; border-radius: 64px; background: var(--color-secondary); user-select: none;}
.join .warning .icon img {width: 32px; height: 32px;}
.join .warning .list li {font-weight: 500; line-height: 1.75; padding-left: 13px; position: relative;}
.join .warning .list li::before {content: ''; width: 3px; height: 3px; background: var(--color-secondary); border-radius: 50%; position: absolute; top: 12px; left: 2px;}
.join h3 {font-family: 'Paperlogy', sans-serif; color: #242424; font-size: var(--font-size-18); font-weight: 600; line-height: 1.5; margin-bottom: var(--space-20); position: relative; padding-left: 20px;}
.join h3::before {content: ''; position: absolute; left: 0; top: 50%; width: 14px; height: 14px; border-radius: 50%; transform: translateY(-55%); border: 3px solid var(--color-primary);}
.join section {margin-bottom: var(--space-40);}
.join .required {color:#fd8239;}
.join .cont {display: grid; grid-template-columns: repeat(1, 1fr); gap: var(--space-20); padding-top: var(--space-20); border-top: 1px solid #ddd;}
.join .cont .item {display: flex; align-items: flex-start; gap: var(--space-20); min-height: 54px;}
.join .cont .item .tit {font-size: var(--font-size-16); font-weight: 500; line-height: 1.5; color: #242424; width: 30%; padding-left: var(--space-20); width: clamp(120px, calc(144 / var(--inner) * 100vw), 144px); margin-top: .9em;}
.join .cont .item .input-wrap {display: flex; align-items: center; gap: var(--space-10); flex: 1 0 auto;}
.join .cont .item .input-wrap .item {align-items: center;}
.join .cont .item .input {display:block; width:100%; height:54px; font-size: var(--font-size-16); padding:0 15px; border-radius: var(--radius-8); border:1px solid #ddd; background:#fff;}
.join .cont .item .btn-pack.dark {flex: 0 0 auto; padding: 0 var(--space-22); height: 54px; line-height: 54px; background: #454545;}
.join .cont .item .radiobox {margin-top: 0; margin-right: var(--space-30);}
.join .cont .item:last-child .radiobox {margin-right: 0;}
.join .cont .item .radiobox label:before {width: 18px; height: 18px; background-color: #f8f8f8;}
.join .cont .item .radiobox input:checked + label:before {background-size: 8px; border-color: #ddd;}
.join .ui-datepicker-trigger {background: #fff url('/images/member/join-datapicker.svg') no-repeat center; background-size: 32px; border: 1px solid #ddd; border-radius: var(--radius-8); width: 54px; height: 54px; flex: 1 0 auto; transition: all .2s;}
.join .ui-datepicker-trigger:hover {background: #454545 url('/images/member/join-datapicker-on.svg') no-repeat center; border-color: #454545;}
.join input[readonly] {background-color:#fff; color:#505050;}
.join .help-text {display:inline-block; margin-left:10px; color:#868686; flex: 1 0 auto;}
.join .buttons {margin: 0;}
.join .buttons .btn-pack {width: 100%; max-width: 470px; background: var(--color-primary); color: #fff;}

[lang="en"] .join .cont .item .tit {text-indent: -10px; padding-left: calc(var(--space-20) + 10px);}

/* 회원가입 - 이메일 중복확인 인라인 피드백 */
.join .cont .item .email-check-wrap {flex-direction: column; align-items: flex-start; gap: var(--space-6);}
.join .cont .item .email-check-wrap .input {width: 100%;}
.join .cont .item .email-msg {display: none; font-size: var(--font-size-14); line-height: 1.4; color: #686868;}
.join .cont .item .email-msg.is-checking,
.join .cont .item .email-msg.is-valid,
.join .cont .item .email-msg.is-invalid {display: block;}
.join .cont .item .email-msg.is-checking {color: #686868;}
.join .cont .item .email-msg.is-valid {color: var(--color-primary);}
.join .cont .item .email-msg.is-invalid {color: #e02b27;}
.join .cont .item .input.is-checking {border-color: #aaa;}
.join .cont .item .input.is-valid {border-color: var(--color-primary); box-shadow: 0 0 0 1px var(--color-primary) inset;}
.join .cont .item .input.is-invalid {border-color: #e02b27; box-shadow: 0 0 0 1px #e02b27 inset;}

/* 회원가입 - 비밀번호 규칙/확인 인라인 피드백 (이메일과 동일 패턴) */
.join .cont .item .pw-check-wrap {flex-direction: column; align-items: flex-start; gap: var(--space-6);}
.join .cont .item .pw-check-wrap .input {width: 100%;}
.join .cont .item .pw-msg {display: block; font-size: var(--font-size-14); line-height: 1.4; color: #686868;}
.join .cont .item .pw-msg:empty {display: none;}
.join .cont .item .pw-msg.is-valid {color: var(--color-primary);}
.join .cont .item .pw-msg.is-invalid {color: #e02b27;}

/* 회원가입 - 가입완료 버튼 비활성화 상태 */
.join .buttons .btn-pack.is-disabled,
.join .buttons .btn-pack:disabled {background: #c8c8c8; border-color: #c8c8c8; color: #fff; cursor: not-allowed; pointer-events: none; opacity: 1;}

/* 로그인 - 인증메일 재발송 안내 박스 */
.login .box .cert-resend-box {margin-bottom: var(--space-20); padding: var(--space-18) var(--space-20); border-radius: var(--radius-8); background: rgba(245, 158, 11, 0.06); border: 1px solid rgba(245, 158, 11, 0.4); display: flex; flex-direction: column; align-items: center; gap: var(--space-15); text-align: center;}
.login .box .cert-resend-box .msg {font-size: var(--font-size-14); line-height: 1.5; color: #686868;}
.login .box .cert-resend-box .btn-pack {background: var(--color-secondary); border-color: var(--color-secondary); color: #fff;}

/* 가입완료 */
.join-complete .box {text-align: center; display: flex; align-items: center; justify-content: center; flex-direction: column;}
.join-complete .box h2 {color: #242424; font-size: var(--font-size-40); font-weight: 700; line-height: 1.2; margin-bottom: var(--space-30);}
.join-complete .box .txt {color: #686868; margin-bottom: var(--space-40); line-height: 1.5;}
.join-complete .box .txt strong {color: var(--color-secondary); font-weight: 700;}
.join-complete .box .icon {width: clamp(100px, calc(130 / var(--inner) * 100vw), 130px); height: clamp(100px, calc(130 / var(--inner) * 100vw), 130px); border-radius: 50%; background: rgba(28, 172, 0, 0.05); display: flex; align-items: center; justify-content: center; margin-bottom: var(--space-40);}
.join-complete .box .icon img {width: clamp(50px, calc(64 / var(--inner) * 100vw), 64px); height: clamp(42px, calc(54 / var(--inner) * 100vw), 54px);}
.join-complete .box .btn-pack {width: 100%; font-size: var(--font-size-18);}
.join-complete .box .btn-pack.focus {margin-bottom: var(--space-10);}

/* 게정찾기 */
.find .box .item {margin-bottom: var(--space-20);}
.find .box .item label {display:block; font-size:var(--font-size-16); line-height:1.5em; color:#2c2c2c; font-weight:500; margin-bottom: var(--space-15);}
.find .box .item label .required {color:var(--color-secondary);}
.find .box .item input {display:block; width:100%; height:54px; font-size:16px; padding:0 var(--space-15); border-radius: var(--radius-8); border:1px solid #ddd; background:#fff;}
.find .button {display: flex; flex-direction: column; align-items: center; justify-content: center; margin-top: var(--space-40); margin-bottom: 0; gap: var(--space-10);}
.find .button input {width: 100%; font-size: var(--font-size-18); font-weight: 500;}
.find .button a {width: 100%; font-size: var(--font-size-18); font-weight: 500;}
.find .find-result {text-align: center; padding: var(--space-30) var(--space-40); color: #505050; font-size: var(--font-size-18); font-weight: 400; line-height: 1.75em; background: #fafafa; border-radius: var(--radius-16);}
.find .find-result .name {color: var(--color-primary); font-size: var(--font-size-20); font-weight: 700; line-height: 1.5;}
.find .find-result h4 {color: var(--color-primary); font-size: var(--font-size-20); font-weight: 700; line-height: 1.5; margin-bottom: var(--space-10);}


/* 장학금 신청내역 */
.applylist .status {display: inline-flex; align-items: center; justify-content: center; padding: var(--space-6) var(--space-25); border-radius: var(--radius-8); font-size: var(--font-size-18); font-weight: 600; line-height: 1.5; color: #fff;}
.applylist .status.soon {background: var(--color-secondary);}
.applylist .status.ing {background: var(--color-tertiary);}
.applylist .status.success {background: var(--color-primary);}
.applylist .status.fail {background: #686868;}

[lang="en"] .applylist .status {font-size: var(--font-size-16); line-height: 1.3; padding: var(--space-6) var(--space-10); min-width: 80px;}

/* 내정보수정 */
.myinfo .box {border: 1px solid #ddd; margin: 0 auto; border-radius: var(--radius-32); padding: var(--space-50); background: #fff;}

/* 회원탈퇴 */
.member-leave .box {max-width: 570px; border: 1px solid #ddd; margin: 0 auto; border-radius: var(--radius-32); padding: var(--space-50); background: #fff;}

.inquiries .status {display: inline-flex; align-items: center; justify-content: center; padding: var(--space-6) var(--space-15); border-radius: var(--radius-8); font-size: var(--font-size-14); font-weight: 600; line-height: 1.5; color: #fff; width: clamp(70px, calc(88 / var(--inner) * 100vw), 88px);}
.inquiries .status.ing {background: var(--color-secondary);}
.inquiries .status.success {background: var(--color-primary);}
.inquiries .status.cancel {background: #686868;}