@charset "utf-8";

/* 로그인 */
.login-area {max-width:470px; margin:0 auto;}
.login-txt { font-size: var(--font-size24); font-weight: 400; line-height: 1.58em; color: #505050; margin-bottom: 64px; }
.login-txt span { color: var(--color-primary); font-weight: 600; }
.login-tab {text-align:center; border-bottom:4px solid var(--color-primary); margin-bottom:50px;}
.login-tab ul {display:flex; padding:0 2px;}
.login-tab ul li {flex:1; border:4px solid #dfdfdf; border-bottom:0; margin:0 -2px; border-radius:10px 10px 0 0;}
.login-tab ul li a {display:block; color:#333; font-size:18px; font-weight:500; line-height:60px;}
.login-tab ul li.active {position:relative; z-index:2; border-color:var(--color-primary);}
.login-tab ul li.active:after {content:""; position:absolute; left:0; right:0; bottom:-4px; height:4px; background:#fff;}
.login-tab ul li.active a {color:var(--color-primary); font-weight:700;}
.login-content .group {margin-bottom:22px;}
.login-content .group .tt { line-height: 1.62em; font-weight: 600; margin-bottom: 10px; }
.login-content .group .input {display:block; width:100%; height:66px; font-size:16px; padding: 10px 20px;}
.login-content .links {display:flex; justify-content:center; margin-top:40px; font-size:15px; color:#878787; font-weight:500; line-height:1.5em;}
.login-content .links a:hover {text-decoration:underline;}
.login-content .links a:last-child { color: rgba(5, 47, 108, 0.70);}
.login-content .links .bar {display:inline-block; vertical-align:middle; margin:-.2em 10px 0; width:1px; height:10px; background:#ddd;}
.login-content .btn-pack {display:block; width:100%; }
.login-content .btn-pack.focus {margin-top:24px;}
.login-content .btn-pack.xlarge {font-weight:500;}

.sns-login {text-align:center; margin-top:60px;}
.sns-login .tit {position:relative; color:#878787; font-weight:400; line-height:1.3em; margin-bottom:40px;}
.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 33px; background:#fff;}
.sns-login .flex { display: flex; align-items: center; justify-content: space-between; gap: 15px; }
.sns-login .flex .tt { font-weight: 700; font-size: var(--font-size24); color: #2c2c2c; line-height: 1.58em; }
.sns-login .flex .icons { display: flex; flex-wrap: wrap; gap: 20px; }

/* 약관동의 */
.agree-wrap { margin:0 auto 80px;}
.agree-wrap .group {margin-top:55px;}
.agree-wrap .group:first-child {margin-top:0;}
.agree-wrap .agree-tit {color:#2c2c2c; font-size:20px; font-weight:600; line-height:1.3em;}
.agree-wrap .agree-tit .checkbox label:before {margin-top:-.02em; width:24px; height:24px; background:#fff url("../images/member/checkbox.png") 50% 50% no-repeat; border:2px solid #ccc; border-radius:100%;}
.agree-wrap .agree-tit .checkbox input:checked + label:before {background-color:var(--color-primary); border-color:var(--color-primary); background-image:url("/images/member/checkbox_on.png");}
.agree-wrap .agree-box {position:relative; max-height:175px; margin-top:17px; padding:30px 50px; border:1px solid #ddd; overflow:auto;}
.agree-wrap .agree-box .terms-wrap { font-weight: 400; }
.agree-wrap .agree-box .terms-wrap .sec {margin-bottom:35px;}
.agree-wrap .agree-box .terms-wrap .sec:last-child { margin-bottom: 0; }
.agree-wrap .agree-box .terms-wrap .sec h3 {color:#505050; font-size: 16px; font-weight:600; margin-bottom:0;}
.agree-wrap .agree-box .terms-wrap .sec strong {font-weight:400;}

.terms-wrap {font-weight:400; color:#666; line-height:1.75em;}
.terms-wrap .sec {margin-bottom:40px;}
.terms-wrap .sec:last-child { margin-bottom: 0; }
.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;}

/* 회원가입 */
.join-form { max-width: 470px; margin: auto; }
.join-form .input { height: 66px; padding: 10px 20px; width: 100%; }
.join-form .required { font-weight: 700; color: #fb2c36; }
.join-form .group { margin-bottom: 32px; }
.join-form .group:last-child { margin-bottom: 0; }
.join-form .group .tt { font-weight: 600; line-height: 1.62em; margin-bottom: 10px; }
.join-form .group .fx { display: flex; gap: 10px; }
.join-form .group .fx .input { flex: 1 1 auto; min-width: 0; width: 1%; }
.join-form .group .fx a { height: 66px; padding: 0 20px; display: inline-flex; align-items: center; border: 1px solid #052F6C; font-size: 14px; font-weight: 600; color: var(--color-primary);}
.join-form .help-text {display:inline-block; margin-top:7px; color:#878787;}
.join-form .buttons .btn-pack { width: 100%; }
.join-form .button-flex { display: flex; gap: 6px 12px; flex-wrap: wrap; }
.join-form .button-flex button { height: 54px; border: 1px solid #ddd; display: inline-flex; padding: 0 32px; color: #878787; align-items: center; background: transparent; font-weight: 400; line-height: 1.6em; }
.join-form .button-flex button.active { border-color: var(--color-primary); background: rgba(5, 47, 108, 0.08); color: var(--color-primary);}
.join-form .button-flex.disabled button { pointer-events: none;}
.join-form .button-flex.disabled button.active { background: #f7f7f7; border-color: #ddd; color: #878787;}
.join-form .buttons { margin: 0; }
.join-agree { margin-top: 32px; padding: 32px 0 40px; border-top: 1px solid #ddd;}
.join-agree .tt { font-weight: 600; line-height: 1.62em; margin-bottom: 8px; }
.join-agree .checkbox label:before { width: 20px; height: 20px; margin: -.2em 8px 0 0;}
.join-agree .agree-all-box { background: rgba(5,47,108,0.08); border: 1px solid #052f6c; height: 66px; display: flex; align-items: center; padding: 0 20px; margin-bottom: 16px; }
.join-agree .agree-all-box .item { font-size: 18px; font-weight: 600; color: #2c2c2c; letter-spacing: -0.36px; }
.join-agree .agree-all-box .checkbox label:before { margin-top: -.1em; background-color: #fff; }
.join-agree .agree-all-box .checkbox input:checked + label:before { background-color: var(--color-primary);}
.join-agree .chk-input { position: absolute; opacity: 0; width: 0; height: 0; }
.join-agree .chk-box { display: inline-block; flex-shrink: 0; width: 20px; height: 20px; border: 1px solid #ddd; background: #fff; }
.join-agree .agree-list { display: flex; flex-direction: column; gap: 16px; }
.join-agree .agree-item { display: flex; align-items: center; justify-content: space-between; }
.join-agree .agree-item .item { line-height: 1.62em; }
.join-agree .agree-link { display: flex; align-items: center; flex-shrink: 0; }
.already-txt { font-size: 15px; color: #878787; font-weight: 500; line-height: 1.2em; text-align: center; margin-top: 40px; }
.already-txt a { color: var(--color-primary); display: inline-block; padding-left: 4px; }
.leave-txt { font-size: 15px; color: #878787; font-weight: 500; line-height: 1.2em; text-align: center; margin-top: 40px; display: block; }

/* 가입완료 */
.join-complete {text-align:center;}
.join-complete .tit {color:var(--color-primary); font-size:28px; font-weight:700; line-height:1.4em; margin-bottom:70px;}
.join-complete .txt {color:#505050; font-size:18px; line-height:1.666em; margin-bottom: 40px; }
.join-complete .icon {width:160px; height:160px; background: url("../images/member/complete.png") 50% 50% no-repeat; border-radius:100%; margin:0 auto 40px;}
.join-complete .buttons {margin:0;}

/* 게정찾기 */
.find-area {max-width:470px; margin:0 auto;}
.find-tab {text-align:center; margin-bottom:50px;}
.find-tab ul {display:flex; padding:0 2px;}
.find-tab ul li {flex:1; border:3px solid #dfdfdf; border-bottom:0; margin:0 -2px; }
.find-tab ul li a {display:block; color:#333; font-size:18px; font-weight:500; line-height:60px;}
.find-tab ul li.active {position:relative; z-index:2; border-color:var(--color-primary);}
.find-tab ul li.active:after {content:""; position:absolute; left:0; right:0; bottom:-4px; height:4px; background:#fff;}
.find-tab ul li.active a {color:var(--color-primary); font-weight:700;}
.find-content .group {margin-bottom:8px;}
.find-content .group .input {display:block; width:100%; height:54px; font-size:16px;}
.find-content .btn-pack {display:block; width:100%; margin-top:10px; }
.find-content .btn-pack.focus {margin-top:30px;}
.find-content .btn-pack.xlarge {font-weight:500;}
.find-result {text-align:center; padding:34px 42px; color:#505050; font-size:18px; font-weight:400; line-height:1.75em; background:#fafafa; border-top:2px solid var(--color-primary); border-bottom:1px solid #ddd;}
.find-result h4 {font-size:22px; font-weight:700; line-height:1.4em; margin-bottom:20px;}
.find-result p:first-child {margin-bottom:10px;}
.find-result .name {color:var(--color-primary); font-size:30px; font-weight:700; line-height:1.5em;}

/* 회원탈퇴 */
.member-leave .txt {text-align:center; color:#505050; line-height:1.7em; margin-bottom:40px;}
.member-leave .txt .tit {color:#333; font-size:20px; line-height:1.5em; margin-bottom:15px;}
.member-leave .form {max-width:470px; margin:0 auto 40px; padding:50px; color:#666; font-size:16px; line-height:1.5em; background:#f9f9f9; border:1px solid #e5e5e5; border-radius:10px;}
.member-leave .form .group {display:flex; align-items:center; margin-bottom:20px;}
.member-leave .form .group:last-child {margin-bottom:0;}
.member-leave .form .group .label-tt {width:90px; color:#222; font-weight:700;}
.member-leave .form .group .text-id,
.member-leave .form .group .input {flex:1 1 auto; min-width:0; width:1%;}