@charset "utf-8";

.member-title {text-align:center; padding:var(--space-130) 0 var(--space-110);}
.member-title h1 {font-size: var(--font-size-48); font-weight: 700; letter-spacing:-.03em; line-height: 1.4em;}

.mypage-menu {margin-bottom:var(--space-50);}
.mypage-menu ul {display: flex; justify-content: center;}
.mypage-menu ul li {width: auto;}
.mypage-menu ul li + li {margin-left:var(--space-10);}
.mypage-menu ul li a {border:1px solid #ddd; border-radius:var(--radius-100); height: clamp(45px, calc(64 / var(--inner) * 100vw), 64px); font-size: var(--font-size-20); font-weight: 600; letter-spacing:-.03em; line-height: 1.4em; display: flex; align-items: center; justify-content: center; text-align:center; min-width: 180px; padding: 0 13px;}
.mypage-menu ul li.active a {border-color:var(--color-primary); color:#fff; background:var(--color-primary);}

/* 로그인 */
.login-area {max-width:470px; margin:0 auto;}
.login-area h3 {text-align:center; color:#2c2c2c; font-size:20px; font-weight:500; line-height:1.3em; margin-bottom:20px;}
.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; 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:500;}
.login-content .group {margin-bottom:8px;}
.login-content .group .input {display:block; width:100%; height:54px; font-size:16px;}
.login-content .links {display:flex; justify-content:space-between; margin-top:14px; font-size:14px; color:#505050; font-weight:500; line-height:1.5em;}
.login-content .links a:hover {text-decoration:underline;}
.login-content .links .bar {display:inline-block; vertical-align:middle; margin:-.2em 12px 0; width:1px; height:16px; background:#ddd;}
.login-content .btn-pack {display:block; width:100%; margin-top:10px;}
.login-content .btn-pack.focus {margin-top:20px;}
.login-content .btn-pack.xlarge {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-wrap {max-width:980px; margin:0 auto 50px;}
.agree-wrap .group {margin-top:40px;}
.agree-wrap .group:first-child {margin-top:0;}
.agree-wrap .agree-tit {color:#333; font-size:20px; font-weight:500; line-height:1.3em; letter-spacing:-.03em;}
.agree-wrap .agree-tit .checkbox label:before {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:16px 20px; border:1px solid #ddd; overflow:auto;}
.agree-wrap .agree-box .terms-wrap {color:#767676; font-size:14px;}
.agree-wrap .agree-box .terms-wrap .sec {margin-bottom:20px;}
.agree-wrap .agree-box .terms-wrap .sec h3 {color:#767676; font-size:14px; font-weight:300; margin-bottom:0;}
.agree-wrap .agree-box .terms-wrap .sec strong {font-weight:300;}

.terms-wrap {font-weight:300; color:#666; line-height:1.75em; letter-spacing:-.03em;}
.terms-wrap .sec {margin-bottom:40px;}
.terms-wrap .sec h3 {color:#222; font-size:1.1em; font-weight:500; margin-bottom:7px;}
.terms-wrap .sec p {margin-bottom:1em;}
.terms-wrap .sec strong {font-weight:500;}
.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;}
.terms-wrap .table {margin:10px 0;}
.terms-wrap .table table {width:100%; border-collapse:collapse; border-spacing:0px;}
.terms-wrap .table th {padding:10px; border:1px solid #dfdfdf; background:#fafafa; font-weight:500; color:#333;}
.terms-wrap .table td {padding:10px; border:1px solid #dfdfdf; text-align:center; font-weight:300; color:#666;}
.terms-wrap .table td b {font-weight:500;}

/* 회원가입 */
.join-tit {}
.join-tit h3 {display:inline-block; color:var(--color-primary); font-size:18px; font-weight:500; line-height:1.3em;}
.join-tit p {display:inline-block;}
.join-tit.flex {display:flex; justify-content:space-between;}
.join-form {max-width:900px; margin:0 auto 60px;}
.join-form .required {color:#fd8239}
.join-form .join-form-txt {color:#505050; font-weight:300; line-height:1.4em; margin-bottom:12px;}
.join-form table {width:100%; border-collapse:collapse; border-spacing:0px; border-top:2px solid #242424; font-size:16px; line-height:1.5em; letter-spacing:-.03em;}
.join-form table th {padding:12px 15px; height:69px; border:1px solid #ddd; background:#fafafa; font-weight:500; color:#333;}
.join-form table th small {font-weight:400; color:#686868; line-height:1.3em;}
.join-form table td {padding:12px 20px; border:1px solid #ddd; color:#505050; font-weight:300;}
.join-form tr th:first-child,
.join-form tr td:first-child {border-left:0;}
.join-form tr th:last-child,
.join-form tr td:last-child {border-right:0;}
.join-form input[readonly] {background-color:#fff; color:#505050;}
.join-form .radiobox {margin-right:30px; font-weight:500;}
.join-form .help-text {display:inline-block; margin-left:10px; color:#767676;}
.join-form + .buttons {margin-top:50px;}

/* 가입완료 */
.join-complete {text-align:center;}
.join-complete .tit {color:var(--color-primary); font-size:28px; font-weight:500; line-height:1.4em; letter-spacing:-.03em; margin-bottom:30px;}
.join-complete .txt {color:#333; font-size:18px; line-height:1.8em; letter-spacing:-.03em;}
.join-complete .icon {width:180px; height:180px; background:var(--color-primary) url("../images/member/complete.png") 50% 50% no-repeat; border-radius:100%; margin:36px auto 45px;}
.join-complete .buttons {margin:0;}

/* 게정찾기 */
.find-area {max-width:470px; margin:20px auto 0;}
.find-tab {text-align:center; border-bottom:4px solid var(--color-primary); margin-bottom:50px;}
.find-tab ul {display:flex; padding:0 2px;}
.find-tab ul li {flex:1; border:4px solid #dfdfdf; border-bottom:0; margin:0 -2px; border-radius:10px 10px 0 0;}
.find-tab ul li a {display:block; color:#333; font-size:18px; 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:500;}
.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:300; line-height:1.75em; letter-spacing:-.03em; background:#fafafa; border-top:2px solid var(--color-primary); border-bottom:1px solid #ddd;}
.find-result h4 {font-size:22px; font-weight:500; line-height:1.4em; letter-spacing:-.03em; 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; letter-spacing:-.03em; 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:500;}
.member-leave .form .group .text-id,
.member-leave .form .group .input {flex:1 1 auto; min-width:0; width:1%;}

.cancel-box {border:1px solid #ddd; padding:var(--space-20); min-height: 230px;}

.reserve-apply-wrap {margin-bottom:var(--space-70);}
.reserve-apply + .reserve-apply {margin-top:var(--space-50);}
.reserve-apply table {border-top:2px solid #686868; width:100%; border-collapse:collapse; border-spacing:0;}
.reserve-apply table th {line-height: 1.4em; height: 70px; background: #FAFAFA; padding:var(--space-12); border-right:1px solid #ddd; border-bottom:1px solid #ddd;}
.reserve-apply table th.type2 {background:#F1F7FF; padding-left:var(--space-30);}
.reserve-apply table th.type2 img {margin-right:var(--space-15);}
.reserve-apply table td {line-height: 1.4em; height: 70px; padding:var(--space-12); border-bottom:1px solid #ddd; border-right:1px solid #ddd;}
.reserve-apply table td:last-child {border-right:0;}
.reserve-apply table .input {width: 100%;}
.reserve-apply .input-with-unit {position:relative;}
.reserve-apply .input-with-unit .input {padding-right:30px;}
.reserve-apply .input-with-unit .unit {position:absolute; right:15px; top:50%; transform:translateY(-50%); pointer-events:none; color:#242424;}
.reserve-apply .input-search {display:flex; gap:var(--space-10);}
.reserve-apply .input-search .input {flex:1;}
.reserve-apply .input-search button {flex-shrink:0;}
.reserve-apply.type2 {margin-bottom:var(--space-50);}
.reserve-apply.type2 tbody th {background:#F1F7FF;}

.reserve-add-button {text-align:center; margin-top:var(--space-30);}
.reserve-add-button button {border-color:var(--color-secondary); font-weight: 700; color: #fff; background: var(--color-secondary); line-height: 48px; width: 120px; text-align:center; border-radius:var(--radius-100);}

.reserve-minus-button {margin-bottom:var(--space-10); text-align:right;}
.reserve-minus-button button {font-weight: 600; border-color: #FD8239; color: #fff; background: #FD8239; line-height: 32px; width: 88px; text-align:center; border-radius:var(--radius-100);}

.bang-text {text-align:center; background: #f6f6f6; display: flex; align-items: center; justify-content: center; min-height: 100px;  padding:20px;}
.bang-text p {font-weight: 600;}
.bang-text p img {vertical-align:middle; margin:-.2em var(--space-20);}

.reserve-complete {text-align:center;}
.reserve-complete .txt {margin:var(--space-60) 0 var(--space-50); font-size: var(--font-size-30); font-weight: 700; letter-spacing:-.03em;}

.pop-rsvp {position: relative; border-radius:20px; background: #fff; padding:var(--space-60);}
.pop-rsvp h2 {margin-bottom:var(--space-40); font-size: var(--font-size-30); font-weight: 700; letter-spacing:-.03em; line-height: 1.3em;}
.pop-rsvp .yn {display: flex; gap:0 var(--space-20)}
.pop-rsvp .absent textarea {width:100%; height:200px; border-radius:4px;}
.pop-rsvp .button {border:0; border-color:none; width:50%; font-size: var(--font-size-24); font-weight: 500; letter-spacing:-.03em; border-radius:4px; color: #fff; display: flex; align-items: center; justify-content: center; text-align:center; height:88px;}
.pop-rsvp .button.st1 {background: #15A6DE;}
.pop-rsvp .button.st2 {background: #F3543F;}
.pop-rsvp .submit {display: flex; justify-content: center; text-align:center; margin-top:var(--space-30);}
.pop-rsvp .submit .button {height: clamp(45px, calc(60 / var(--inner) * 100vw), 60px);}
.pop-rsvp .close {font-size: 0; display: block; position: absolute; right:var(--space-30); top:var(--space-30); width: 19px; height: 18px; background: url('/images/sub/modal-close.png') no-repeat center center / contain;}
.pop-rsvp .holiday .input {width: 100%;}
.pop-rsvp .holiday .date-area {margin-bottom:var(--space-40); display: flex; align-items: center; justify-content:space-between;}
.pop-rsvp .holiday .txt {font-size: var(--font-size-18); font-weight: 600; letter-spacing:-.03em; line-height: 1.4em;}

.visa-password {max-width:400px; margin: 0 auto; text-align:center; display: flex; flex-direction: column; align-items: center; text-align:center;}
.visa-password .ico img {height:clamp(60px, calc(130 / var(--inner) * 100vw), 130px);}
.visa-password .txt {margin:var(--space-30) 0 var(--space-40); font-size: var(--font-size-24); font-weight: 600; letter-spacing: -.03em;}
.visa-password .input {height: 60px; margin-bottom: 20px; width: 100%;}
.visa-password .btn-pack.xlarge {width:100%;}