@charset "utf-8";

/* 로그인 */
.login-area {max-width:470px; margin:0 auto;}
.login-tab {text-align:center; border-bottom:4px solid #ff307e; 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:#ff307e;}
.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:#ff307e; font-weight:700;}
.login-content .group {margin-bottom:8px;}
.login-content .group .input {display:block; width:100%; height:54px; font-size:16px; border-radius: 8px; }
.login-content .links {display:flex; justify-content:space-between; margin-top:14px; font-size:14px; color:#2c2c2c; font-weight:500; line-height:1.5em; margin-bottom:20px; letter-spacing: -.04em;}
.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 .links .save { color: #505050; }
.login-content .links .checkbox label:before { border-radius: 4px; width: 20px; height: 20px; }
.login-content .links .checkbox input:checked + label:before { background-color: #000; border-color: #000;}
.login-content .btn-pack {display:block; width:100%; margin-top:10px;}
.login-content .btn-pack.focus {margin-top:20px; font-weight: 600; border-radius: 6px;}
.login-content .btn-pack.xlarge {font-weight:600; border-radius: 6px;}

.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:680px; 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: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:#590022; border-color:#590022; 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; border-radius: 6px; background: #fff; }
.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 h2 { font-size: 15px; color: #2c2c2c; font-weight: 700; margin-bottom: 20px;}
.agree-wrap .agree-box .terms-wrap .sec h3 {color:#767676; font-size:14px; font-weight:400; margin-bottom:0;}
.agree-wrap .agree-box .terms-wrap .sec strong {font-weight:400;}
.agree-wrap .agree-box .terms-wrap .sec ul { margin-top: 5px; padding-left: 10px;}
.agree-wrap .agree-box .terms-wrap .sec ul li { position: relative; padding-left: 10px; margin-bottom: 8px; }
.agree-wrap .agree-box .terms-wrap .sec ul li:last-child { margin-bottom: 0;}
.agree-wrap .agree-box .terms-wrap .sec ul li::before { content: ""; position: absolute; left: 0; width: 5px; height: 1px; background: #767676; top: 12px;}

.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;}

/* 회원가입 */
.join-form { max-width: 680px; width: 100%; position: relative; background: #fff; margin: auto; border-radius: 24px; padding: 45px 50px; }
.join-form dl { margin-bottom: 28px; }
.join-form dl dt { line-height: 1em; margin-bottom: 15px; line-height: 1em; font-weight: 600; color: #2c2c2c;}
.join-form dl dd .input { border-radius: 6px; height: 48px; }
.join-form .required {color:#ff307e;}
.join-form .btn-pack.bdrs { border-radius: 6px; background: #121212; height: 48px; border: 1px solid #121212; line-height: 46px; font-size: 15px; font-weight: 500; }
.join-form .inp-fx { display: flex; gap: 5px; }
.join-form .inp-fx .input { flex: 1 1 auto; min-width: 0; width: 1%; }
.join-form .item-fx { margin: 30px 0 20px; }
.join-form .item-fx .item { padding-right: 30px; font-weight: 500; color: #505050; }
.join-form .item-fx .item:last-child { padding-right: 0; }
.join-form .radiobox label:before { width: 20px; height: 20px; background-color: #fff;}
.join-form .radiobox input:checked + label:before { background-image: url(../images/member/join-radio.png); border: 1px solid #590022;}
.join-form .file-fx { display: flex; align-items: center; margin-bottom: 6px; }
.join-form .file-upload {display:flex; height:48px; flex: 1 1 auto; min-width: 0; width: 1%; gap: 6px; }
.join-form .file-button {display:flex; justify-content:center; align-items:center; height:100%; padding:0 15px; border:0; border-radius:6px; background:#121212; color:#fff; cursor:pointer; transition: .2s; font-size: 15px; font-weight: 500; line-height: 46px;}
.join-form .file-name {flex:1 1 auto; min-width:0; width:1%; display:flex; align-items:center; height:100%; padding:0 14px; border:1px solid #ddd; border-radius: 6px; font-size: 15px; color: #a8a8a8; font-weight: 400;}
.join-form-txt { font-size: 14px; font-weight: 300; margin-top: 20px; color: #f72c2c; }
.join-form .file-name.clr { color: #2c2c2c;}
.join-form .typeBox { display: none;}
.join-form .saleBox { display: none;}
.join-form select { color: #a8a8a8; }

/* 가입완료 */
.join-complete {text-align:center; max-width: 680px; width: 100%; margin: auto; }
.join-complete .inner { border-radius: 24px; background: #fff; margin-bottom: 30px; text-align: center; }
.join-complete .inner .top { padding: 65px 10px;} 
.join-complete .inner .top h3 { line-height: 1.3em; font-size: 28px; font-weight: 700; color: #ff307e; margin-bottom: 25px; margin-top: 15px;}
.join-complete .inner .top .under { text-decoration: underline; text-underline-position: under; font-weight: 400; }
.join-complete .inner .top .blue { font-size: 17px; font-weight: 500; color: #1937f2; line-height: 1.4em; margin-top: 12px;}
.join-complete .inner .top p { font-size: 15px; font-weight: 400; color: #505050; line-height: 1.666em; margin: 35px 0; }
.join-complete .inner .top .red { font-size: 14px; line-height: 2em; color: #f72c2c; font-weight: 500; margin-bottom: 8px; }
.join-complete .inner .top strong { font-size: 17px; font-weight: 600; color: #2c2c2c; line-height: 1.666em; }

.join-complete .btn-fx { display: flex; gap: 10px; }
.join-complete .btn-fx a { width: calc(100%/2 - 5px); border-radius: 8px; }

/* 게정찾기 */
.find-area {max-width:470px; margin:0 auto;}
.find-tab {text-align:center; border-bottom:4px solid #ff307e; 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; font-weight:500; line-height:60px;}
.find-tab ul li.active {position:relative; z-index:2; border-color:#ff307e;}
.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:#ff307e; font-weight:700;}
.find-content .group {margin-bottom:8px;}
.find-content .group .input {display:block; width:100%; height:54px; font-size:16px; border-radius: 6px;}
.find-content .buttons .cen { display: flex; gap: 5px; }
.find-content .buttons .cen .focus { margin-top: 0;}
.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:600; border-radius: 6px;}
.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 #dfdfdf; border-bottom:1px solid #ddd;}
.find-result h4 {font-size:22px; font-weight:700; line-height:1.4em; margin-bottom:20px; color: #ff307e;}
.find-result p:first-child {margin-bottom:10px;}
.find-result .name {color:#ff307e; font-size:30px; font-weight:700; line-height:1.5em;}

/* 회원탈퇴 */
.member-leave { border-radius: 24px; padding: 45px 50px; background: #fff;}
.member-leave .txt {text-align:center; color:#505050; line-height:1.7em; margin-bottom:40px; }
.member-leave .txt .tit {color:#ff307e; 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;  border:1px solid #ff307e; 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%;}

/* 마이페이지 */
.mp-fx { display: flex; align-items: flex-start; height: 100%; }
.mp-fx .left { margin-right: 60px; max-width: 270px; width: 100%; position: sticky; top: 30px;}
.mp-fx .right { flex: 1 1 auto; min-width: 0; width: 1%; }
.mp-menubox { background: #fff; border-radius: 16px; padding: 40px; margin-bottom: 10px; }
.mp-menubox:last-child { margin-bottom: 0; }
.mp-menubox h4 { line-height: 1em; font-size: 14px; font-weight: 600; color: #a8a8a8; margin-bottom: 25px;}
.mp-menubox h2 { line-height: 1em; font-size: 28px; font-weight: 600; color: #2c2c2c;}
.mp-menubox ul li { margin-bottom: 20px; }
.mp-menubox ul li:last-child { margin-bottom: 0; }
.mp-menubox ul li a { line-height: 1em; display: block; font-size: 18px; font-weight: 600; color: #2c2c2c; }
.mp-menubox ul li.active a { color: #ff307e;}
.mp-logout { margin-top: 28px; padding-left: 40px; line-height: 1em; font-size: 15px; font-weight: 500; color: #a8a8a8; display: block;}
.mp-fx .right .join-form { max-width: 100%; margin-bottom: 60px;}
.leave-txt { display: inline-block; margin-top: 20px; font-size: 14px; font-weight: 400; color: #878787; text-decoration: underline; text-underline-position: under; border-bottom: 1px solid #878787; width: auto;}

/* 마이페이지 예약관리 리스트 , 예약취소 */
.mp-rv { width: 100%; background: #fff; border-radius: 24px; overflow: hidden; margin-bottom: 70px;}
.mp-tab { padding: 50px; display: flex; gap: 8px; flex-wrap: wrap; padding-bottom: 0;}
.mp-tab li { width: calc(100%/4 - 6px); text-align: center; border: 1px solid #eee; border-radius: 8px; }
.mp-tab li a { width: 100%; display: flex; align-items: center; justify-content: center; height: 56px; font-size: 18px; font-weight: 600; line-height: 1em; color: #ccc; }
.mp-tab li.active { background: #ff307e; border-color: #ff307e; }
.mp-tab li.active a { color: #fff; }
.mp-rv .mp-group { padding: 50px; border-bottom: 1px dashed #ddd;}
.mp-rv .mp-group.bd { border: none; }
.mp-rv .mp-group .tit { line-height: 1.5em; font-size: 24px; font-weight: 700; color: #2c2c2c; margin-bottom: 25px; }
.mp-rv .mp-group .tit .num { display: inline-flex; width: 32px; height: 32px; align-items: center; justify-content: center; line-height: 1em; font-weight: 600; font-size: 14px; color: #ff307e; border: 1px solid #eee; border-radius: 32px; background: #fafafa; margin-right: 15px; position: relative; top: -3px;}
.mp-rv .mp-group .date { line-height: 1em; margin-bottom: 30px; color: #505050; position: relative; padding-left: 28px; font-weight: 400;}
.mp-rv .mp-group .date::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; margin: auto; width: 18px; height: 17px; background: url(../images/member/rv-icon.png) center no-repeat; background-size: contain;} 
.mp-rv .mp-group ul li { display: flex; margin-bottom: 15px; }
.mp-rv .mp-group ul li:last-child { margin-bottom: 0; }
.mp-rv .mp-group ul li .title { line-height: 1.5em; font-size: 15px; font-weight: 700; color: #a8a8a8; width: 78px; }
.mp-rv .mp-group ul li .txt { flex: 1 1 auto; min-width: 0; width: 1%; line-height: 1.5em; font-weight: 400; color: #505050;}
.mp-rv .mp-group .link {display: flex; margin-top: 30px; gap: 6px;}
.mp-rv .mp-group .link a { width: 85px; height: 35px; line-height: 1em; display: flex; align-items: center; justify-content: center; background: #f1f1f1; color: #2c2c2c; font-size: 16px; font-weight: 700; border-radius: 8px;}
.mp-rv .mp-group .link a:last-child { background: #2c2c2c; color: #fff; }
.mp-rv .paginate { margin: 40px 0;}
.mp-rv .mp-group .pink { background: #f9f5f7; padding: 50px; border-radius: 24px; margin: 40px 0; }
.mp-rv .mp-group .pink.mg { margin-bottom: 0; }
.mp-rv .mp-group .pink h3 { font-size: 18px; font-weight: 700; line-height: 1em; color: #ff307e;}
.mp-rv .mp-group .pink .box { margin-top: 40px; }
.mp-rv .mp-group .pink .box h4 { font-weight: 600; line-height: 1.3em; position: relative; padding-left: 15px; color: #505050; margin-bottom: 15px; }
.mp-rv .mp-group .pink .box h4::before { content: ""; position: absolute; left: 0; width: 6px; height: 6px; border-radius: 6px; background: #ff307e; top: 6px;}
.mp-rv .mp-group .pink .box p { margin-left: 0; position: relative; padding-left: 10px; font-size: 15px; margin-bottom: 5px; margin-left: 15px;}
.mp-rv .mp-group .pink .box p::before { content: ""; position: absolute; left: 0; top: 11px; width: 5px; height: 1px; background: #505050;}
.mp-rv .mp-group .pink .box p:last-child { margin-bottom: 0; }
.mp-rv .mp-group .pink .box h5 { font-size: 15px; font-weight: 400; margin-bottom: 6px; margin-left: 15px;}
.mp-rv .mp-group .pink .box .txtbox { padding-left: 15px; margin-bottom: 25px;}
.mp-rv .mp-group .pink>span { font-size: 14px; font-weight: 400; display: block; color: #878787;}
.mp-rv .join-form { border-radius: 0; padding: 0; margin: 0 !important;}
.mp-rv .join-form dl { margin-bottom: 0; }

/* 환불안내 */
.cancel-chk { background: #fff; border-radius: 12px; padding: 25px 30px 22px; margin-bottom: 8px; font-weight: 500; color: #505050;}
.cancel-chk:last-child { margin-bottom: 0; }
.cancel-chk .checkbox input + label:before { border-radius: 4px; border: 1px solid #a8a8a8; background-color: transparent;}
.cancel-chk .checkbox input:checked + label:before { background-color: #ff307e; border-color: #ff307e;}
.cancel-chk.clr { background: #f9f5f7; margin-top: 30px; }
.cancel-chk.fx { display: flex; align-items: center; justify-content: space-between; flex-wrap: wrap; gap: 5px;}
.cancel-chk.fx span { font-size: 15px; font-weight: 700; color: #a8a8a8; line-height: 1em; }
.cancel-chk.fx span .time { font-size: 16px; font-weight: 500; color: #505050; }
.cancel-chk.clr span { color: #ff307e; }
.mp-rv .mp-group .title2 { font-size: 22px; font-weight: 600; color: #2c2c2c; line-height: 1.4em; margin-bottom: 50px; }
.cc-fx { display: flex; gap: 30px 10px; flex-wrap: wrap;}
.cc-fx dl { margin: 0; width: calc(100%/2 - 5px);}
.cc-fx dl.w100 { width: 100%; }
.cc-price { display: flex; align-items: flex-end; justify-content: space-between; padding-bottom: 35px; }
.cc-price .left strong { line-height: 1em; color: #2c2c2c; font-weight: 700; margin-bottom: 16px; display: block; font-size: 16px; }
.cc-price .left .price { line-height: 1em; font-size: 38px; font-weight: 700; color: #ff307e; }
.cc-price .right { flex: 1 1 auto; min-width: 0; width: 1%; padding-left: 10px; display: flex; gap: 40px; flex-wrap: wrap; justify-content: flex-end;}
.cc-price .right h5 { font-size: 15px; color: #2c2c2c; font-weight: 500; }
.cc-price .right h5 span { display: inline-block; font-weight: 400; color: #878787; padding-right: 20px; }
.cc-gray { border-radius: 24px; text-align: center; background: #f1f1f1; padding: 35px 10px;}
.cc-gray h4 { line-height: 1.666em; font-weight: 500; color: #2c2c2c;  margin-bottom: 25px; }
.cc-gray .checkbox input + label:before { border-radius: 20px; border: 1px solid #a8a8a8; background-color: transparent; width: 20px; height: 20px;}
.cc-gray .checkbox input:checked + label:before { background-color: #590022; border-color: #590022;}
.cc-complete { max-width: 100%; }

/* 마이페이지 - 예약 장바구니 20250508 */
.mp-pay { display: flex; border-top: 1px solid #dfdfdf; border-bottom: 1px solid #dfdfdf; align-items: center; margin-bottom: 20px; }
.mp-pay .group-wrap { width: 75%; border-right: 1px solid #dfdfdf;}
.mp-pay .group-wrap .group { border-bottom: 1px solid #dfdfdf; padding: 23px 20px; display: flex; align-items: center;}
.mp-pay .group-wrap .group .checkbox input + label:before { border-radius: 4px; border: 1px solid #a8a8a8; background-color: transparent;}
.mp-pay .group-wrap .group .checkbox input:checked + label:before { background-color: #ff307e; border-color: #ff307e;}
.mp-pay .group-wrap .group ul { padding-left: 20px; flex: 1 1 auto; min-width: 0; width: 1%;}
.mp-pay .group-wrap .group ul li { display: flex; margin-bottom: 5px; }
.mp-pay .group-wrap .group ul li:last-child { margin-bottom: 0; }
.mp-pay .group-wrap .group ul li .tt { font-size: 15px; font-weight: 600; color: #a8a8a8; width: 50px; }
.mp-pay .group-wrap .group ul li .txt-wrap { flex: 1 1 auto; min-width: 0; width: 1%; font-size: 15px; }
.mp-pay .group-wrap .group ul li .txt-wrap .txt { margin-bottom: 15px; width: 100%; padding-top: 2px; display: flex; align-items: center;}
.payment-close { text-indent: -9999em; display: inline-block; width: 18px; height: 18px; border-radius: 100%; background-repeat: no-repeat; background-image: url(../images/member/payment-close.png); background-size: 8px; background-color: #e7e7e7; margin-left: 10px; background-position: center center;}
.payment-close:hover { background-color: #ff307e; background-image: url(../images/member/payment-close-w.png);}
.mp-pay .group-wrap .group:last-child { border: none; }
.mp-pay .time-wrap { width: 25%; padding: 0 10px; text-align: center; }
.mp-pay .time-wrap p { line-height: 1em; font-size: 14px; font-weight: 600; color: #a8a8a8; margin-bottom: 15px; }
.mp-pay .time-wrap .time { font-size: 32px; font-weight: 700; color: #ff307e; line-height: 1em; }
.mp-pay-status { background: #121212; border-radius: 12px; color: #fff; padding: 30px; display: flex; justify-content: space-between; align-items: center;}
.mp-pay-status .status-tit { font-size: 15px; font-weight: 600; color: #a8a8a8; }
.mp-pay-status .status-tit strong { display: inline-block; color: #fff; font-size: 20px; padding-left: 24px; }
.mp-pay-status a { display: inline-block; background: #ff307e; border-radius: 8px; line-height: 1em; font-weight: 600; letter-spacing: -.02em; padding: 10px 13px; }