/* [웹프림 M16-C 최소 수정] 절대 /img/ 경로 1건을 테마 자산 상대 경로(../img/)로 변경 — 그 외 원본 무수정 */
@charset "utf-8";

:root {
    --header-height: 0px;

    /* bg */
    --color-bg1: #fff;
    --color-bg2: #F8F6F2;

    /* static */
    --color-static1: #4E6A48; /* 메인 */
    --color-static1-hover: #435C3D;
    --color-static2: #A8B58A; /* 서브1 */
    --color-static2-hover: #96A47A;
    --color-static3: #666666; /* 서브2 */
    --color-static4: #9F998E; /* 서브3 */
    --color-static5: #D9CFBD; /* 서브4 */
    --rgb-static1: 78 106 72;    /* #4E6A48 */
    --rgb-static2: 168 181 138;  /* #A8B58A */
    --rgb-static3: 102 102 102;  /* #666666 */
    --rgb-static4: 159 153 142;  /* #9F998E */
    --rgb-static5: 217 207 189;  /* #D9CFBD */
    --color-white: #fff;
    --rgb-white: 255 255 255;
    --color-black: #000;
    --rgb-black: 0 0 0;

    /* text */
    --color-text1: #262626; /* grayscale9 */
    --color-text2: #404040; /* grayscale8 */
    --color-text3: #525252; /* grayscale7 */
    --color-text4: #A3A3A3; /* grayscale5 */
    --color-text5: #FAFAFA; /* grayscale1 */
    --rgb-text1: 38 38 38;
    --rgb-text2: 64 64 64;
    --rgb-text3: 82 82 82;
    --rgb-text4: 163 163 163;
    --rgb-text5: 250 250 250;

    /* border */
    --color-border1: #EDE7DC;
    --color-border2: #E5E5E5; /* grayscale3 */

    --color-line-hover: #F6F8F2;

    /* font size */
    --fs-72: clamp(42px, 5vw, 72px);
    --fs-64: clamp(38px, 4.44vw, 64px);
    --fs-56: clamp(40px, 3.89vw, 56px);
    --fs-50: clamp(36px, 3.47vw, 50px);
    --fs-48: clamp(34px, 3.33vw, 48px);
    --fs-44: clamp(32px, 3.05vw, 44px);
    --fs-40: clamp(30px, 2.78vw, 40px);
    --fs-36: clamp(28px, 2.5vw, 36px);
    --fs-32: clamp(26px, 2.22vw, 32px);
    --fs-30: clamp(24px, 2.08vw, 30px);
    --fs-28: clamp(22px, 1.94vw, 28px);
    --fs-26: clamp(21px, 1.8vw, 26px);
    --fs-24: clamp(20px, 1.67vw, 24px);
    --fs-22: clamp(19px, 1.53vw, 22px);
    --fs-20: clamp(18px, 1.39vw, 20px);
    --fs-18: clamp(16px, 1.25vw, 18px);
    --fs-16: clamp(15px, 1.11vw, 16px);
    --fs-15: clamp(14px, 1.04vw, 15px);
    --fs-14: clamp(13px, 0.97vw, 14px);
    --fs-13: clamp(12px, 0.9vw, 13px);
    --fs-12: clamp(11px, 0.83vw, 12px);

    --space-60: clamp(48px, 4.17vw, 60px);
    --space-80: clamp(56px, 5.56vw, 80px);
    --space-100: clamp(64px, 6.94vw, 100px);
    --space-120: clamp(80px, 8.33vw, 120px);
    --space-140: clamp(96px, 9.72vw, 140px);
    --space-160: clamp(112px, 11.11vw, 160px);

    /* status */
    --state-open: #19A73D;
    --state-open-bg: #EEF6F1;

    --state-busy: #FD9F4B;
    --state-busy-bg: #FFF7E8;

    --state-soldout: var(--color-text4);
    --state-soldout-bg: #E5E5E5;

    /* shadow */
    --box-shadow:0px 0px 30px #0000000D;
}

:root[data-theme="blue"] {
    /* bg */
    --color-bg2: #F5FAFD;

    /* static */
    --color-static1: #35586D; /* 메인 */
    --color-static1-hover: #2B495B;
    --color-static2: #7E9FB1; /* 서브1 */
    --color-static2-hover: #6C8C9E;
    --color-static3: #737A7E; /* 서브2 */
    --color-static4: #8B969D; /* 서브3 */
    --color-static5: #DCE9EF; /* 서브4 */
    --rgb-static1: 53 88 109;    /* #35586D */
    --rgb-static2: 126 159 177;  /* #7E9FB1 */
    --rgb-static3: 115 122 126;  /* #737A7E */
    --rgb-static4: 139 150 157;  /* #8B969D */
    --rgb-static5: 220 233 239;  /* #DCE9EF */

    /* border */
    --color-border1: #E5E5E5;

    --color-line-hover: #F2F7FA;
}

:root[data-theme="wood"] {
    /* bg */
    --color-bg2: #FCF7F4;

    /* static */
    --color-static1: #7A5648; /* 메인 */
    --color-static1-hover: #66473C;
    --color-static2: #B49384; /* 서브1 */
    --color-static2-hover: #9F7E70;
    --color-static3: #837B77; /* 서브2 */
    --color-static4: #A79893; /* 서브3 */
    --color-static5: #EADDD6; /* 서브4 */
    --rgb-static1: 122 86 72;
    --rgb-static2: 180 147 132;
    --rgb-static3: 131 123 119;
    --rgb-static4: 167 152 147;
    --rgb-static5: 234 221 214;

    /* border */
    --color-border1: #E8E4E1;
    
    --color-line-hover: #FAF4F1;
}


.mt80 {margin-top: var(--space-80);}

.line {display: block; width: 100%; height: 1px; background-color: var(--color-border1);}
.centered {margin-inline: auto;}

.txt-white {color: var(--color-white) !important;}
.txt-black {color: var(--color-black) !important;}
.txt-static1 {color: var(--color-static1) !important;}
.txt-static2 {color: var(--color-static2) !important;}
.txt-static3 {color: var(--color-static3) !important;}
.txt1 {color: var(--color-text1) !important;}
.txt2 {color: var(--color-text2) !important;}
.txt3 {color: var(--color-text3) !important;}
.txt4 {color: var(--color-text4) !important;}
.txt5 {color: var(--color-text4) !important;}

.weight500 {font-weight: 500 !important;}
.weight600 {font-weight: 600 !important;}
.weight700 {font-weight: 700 !important;}

.noto-serif-kr {font-family: "Noto Serif KR", serif !important;}
.noto-serif {font-family: "Noto Serif", serif !important;}
.pretendard {font-family: "Pretendard", serif !important;}

.hero-head {font-size: var(--fs-48); line-height: 1.4; font-family: "Noto Serif KR", serif; word-break: keep-all;}
.section-tit {font-size: var(--fs-32); line-height: 1.5; font-weight: 500;}
.card-tit {font-size: var(--fs-24); line-height: 1.5; font-weight: 500;}
.card-subtit {font-size: var(--fs-20); line-height: 1.5; font-weight: 500;}
.body-large {font-size: var(--fs-18); line-height: 1.5;}
.body-medium {font-size: var(--fs-16); line-height: 1.5;}
.body-small {font-size: var(--fs-15); line-height: 1.5;}
.body-xsmall {font-size: var(--fs-14); line-height: 1.5;}
.eyebrow {font-size: var(--fs-14); line-height: 1.5; letter-spacing: 0.2em; font-family: "Noto Serif", serif; color: var(--color-static1);}


.status {padding: 4px 10px; border-radius: 999px; font-size: var(--fs-13); font-weight: 500; line-height: 1.5;}
.status.open {background-color: var(--state-open-bg); color: var(--state-open);}
.status.busy {background-color: var(--state-busy-bg); color: var(--state-busy);}
.status.soldout {background-color: var(--state-soldout-bg); color: var(--state-soldout);}

.tab-list {display: flex; align-items: center; column-gap: calc(var(--fs-30) * 2);}
.tab {transition: color 0.2s; font-size: var(--fs-24); line-height: 1.5; padding-bottom: 4px; border-bottom: 2px solid transparent;}
.tab:hover {color: var(--color-text3);}
.tab.active {border-color: var(--color-static2);}

.sort-list {display: flex; align-items: center;}
.sort-list .sort {color: var(--color-text3); transition: color 0.2s;}
.sort-list .sort + .sort{margin-left: var(--fs-18); padding-left: var(--fs-18); border-left: 1px solid var(--color-border1);}
.sort-list .sort.active {cursor: default; pointer-events: none; font-weight: 500; color: var(--color-static1);}
.sort-list .sort:hover {color: var(--color-black);}

.label {width: fit-content; transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease; padding: 4px 10px; border-radius: 999px; display: flex; align-items: center; column-gap: 2px; font-size: var(--fs-13); line-height: 1.5; font-weight: 500; border: 1px solid transparent;}
.label.available {background-color: var(--state-open-bg); color: var(--state-open);}
.label.closed {background-color: var(--state-soldout-bg); color: var(--state-soldout);}

.btn-wrap {display: flex; align-items: center; gap: var(--fs-24);}
.btn-wrap > * {flex: 1; justify-content: center;}

.round-btn {width: fit-content; transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease; padding: 8px var(--fs-20); border-radius: 999px; display: flex; align-items: center; column-gap: 8px; font-size: var(--fs-16); line-height: 1.5; font-weight: 500; border: 1px solid transparent;}
.square-btn {width: fit-content; transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease; padding: var(--fs-12) var(--fs-24); border-radius: 8px; display: flex; align-items: center; column-gap: 8px; font-size: var(--fs-16); line-height: 1.5; font-weight: 500; border: 1px solid transparent;}
.round-btn.small,
.square-btn.small {padding: 8px var(--fs-16); font-size: var(--fs-14);}
.round-btn.large,
.square-btn.large {padding: var(--fs-18) var(--fs-32);}
.ico-btn {transition: background-color 0.2s ease, border-color 0.2s ease, color 0.2s ease; width: 32px; height: 32px; border-radius: 8px; display: flex; align-items: center; justify-content: center; border: 1px solid transparent;}
.ico-btn.disabled img,
.ico-btn:disabled img {opacity: 0.3;}
.w100 {width: 100%;}
.round-btn.w100 ,
.square-btn.w100 {justify-content: center;}

.kakao-btn {background-color: #FFE202; color: #391B1B;}
.gray-btn {background-color: var(--color-text4); color: var(--color-white);}
.main-btn {background-color: var(--color-static1); color: var(--color-white);}
.sub-btn {background-color: var(--color-static2); color: var(--color-white);}
.line-btn {border-color: var(--color-static2); background-color: var(--color-white); color: var(--color-static1);}

.red-line-btn {background-color: var(--color-white); border-color: #C0392B; color: #C0392B;}
.main-line-btn {background-color: var(--color-white); border-color: var(--color-static2); color: var(--color-static1);}
.gray-line-btn {background-color: var(--color-white); border-color: var(--color-border1); color: var(--color-static1);}
.white-btn {background-color: var(--color-white); color: var(--color-static1);}
.white-15-btn {background-color: rgb(var(--rgb-white) / 15%);; color: var(--color-white);}
.black-50-btn {background-color: rgb(var(--rgb-black) / 50%);; color: var(--color-white);}

.kakao-btn:hover:not(.disabled):not(:disabled) {background-color: #F4D600;}
.gray-btn:hover:not(.disabled):not(:disabled) {background-color: #C4C4C4;}
.main-btn:hover:not(.disabled):not(:disabled) {background-color: var(--color-static1-hover);}
.sub-btn:hover:not(.disabled):not(:disabled) {background-color: var(--color-static2-hover);}
.line-btn:hover:not(.disabled):not(:disabled) {background-color: var(--color-line-hover);}

.red-line-btn:hover:not(.disabled):not(:disabled) {background-color: #FFF0F0;}
.main-line-btn:hover:not(.disabled):not(:disabled) {background-color: var(--color-bg2);}
.gray-line-btn:hover:not(.disabled):not(:disabled) {border-color: var(--color-static2);}
.white-btn:hover:not(.disabled):not(:disabled) {background-color: var(--state-soldout-bg);}
.white-15-btn:hover:not(.disabled):not(:disabled) {background-color: rgb(var(--rgb-white) / 25%);}
.black-50-btn:hover:not(.disabled):not(:disabled) {background-color: rgb(var(--rgb-black) / 65%);}

.round-btn.disabled,
.square-btn.disabled,
.ico-btn.disabled,
.round-btn:disabled,
.square-btn:disabled,
.ico-btn:disabled {cursor: default; pointer-events: none; background-color: var(--state-soldout-bg); color: var(--color-text4); border-color: transparent;}

.ico-btn:disabled img {opacity: 0.3;}

.txt-btn {background-color: transparent; transition: opacity 0.2s; display: flex; align-items: center; column-gap: 8px; font-size: var(--fs-18); font-weight: 500; line-height: 1.5;}
.txt-btn.white {color: var(--color-white);}
.txt-btn.black {color: var(--color-black);}
.txt-btn.main {color: var(--color-static1);}
.txt-btn:hover {opacity: 0.7;}
.txt-btn.readonly,
.txt-btn:disabled {cursor: default; pointer-events: none;}

.section-tit-wrap {width: 100%; display: flex; align-items: flex-start; flex-direction: column;}
.section-tit-wrap.centered {align-items: center; width: 100% !important;}
.section-tit-wrap .eyebrow {color: var(--color-static1); margin-bottom: calc(var(--fs-20) / 2);}
.section-tit-wrap h2 {color: var(--color-text1);}
.section-tit-wrap p {color: var(--color-text2); text-align: left; margin-top: var(--fs-20);}
.section-tit-wrap.centered p {text-align: center;}

.sub-content-wrap {display: flex; flex-direction: column; row-gap: var(--space-120);}
.sub-content-wrap .sub-content .section-tit-wrap {margin-bottom: var(--space-80);}

.container > section:has(.sticky-wrap) {overflow: unset;}
.sticky-wrap {display: flex; align-items: flex-start; column-gap: var(--fs-26);}
.sticky-wrap > .left {width: calc(100% - var(--fs-26) - var(--fs-36) * 10);}
.sticky-wrap > .right {width: calc(var(--fs-36) * 10); position: sticky; top: calc(var(--header-height) + var(--fs-16));}

.hero-tit-wrap {width: 100%; display: flex; flex-direction: column; row-gap: var(--fs-32);}

.hero-section {height:100vh; max-height:800px; position:relative; overflow:hidden; background-repeat: no-repeat; background-size: cover; background-position: center center;}
.hero-section:not(.bg-color)::after {content:''; display:block; width:100%; height:100%; background-color:rgb(var(--rgb-black) / 60%); position:absolute; top:0; left:0; z-index:1; pointer-events:none;}
.hero-section .inner {height: 100%; position:relative; z-index:2; row-gap: 0 !important; align-items: flex-start; justify-content: center;}
.hero-section.centered .inner {align-items: center; text-align: center;}
.hero-section:not(.bg-color) .inner > * {color: var(--color-white);}
/* .hero-section .inner .hero-head {margin-bottom: calc(var(--fs-20) * 2);}
.hero-section .inner .hero-sub + .round-btn {margin-top: calc(var(--fs-20) * 4);} */

.full-box {border-radius: 8px; border: 1px solid var(--color-border1); position: relative; background-color: var(--color-white); flex-shrink: 0; height: 100%; display: flex; flex-direction: column;}
.full-box .full-box-tit {color: var(--color-text6); padding: var(--fs-16) var(--fs-24) var(--fs-12); display: flex; flex-direction: column; align-items: flex-start; row-gap: 4px;}
.full-box .full-box-tit span {color: var(--color-static3);}
.full-box .full-box-tit p {color: var(--color-static1);}
.full-box .full-box-body {padding: var(--fs-16) var(--fs-14); padding-top: 0; overflow: hidden;}
.full-box .full-box-body .desc-box {padding: var(--fs-12);}

/* 테이블 */
.full-table {width:100%; table-layout:fixed; border-collapse:collapse; border-spacing:0; background-color:var(--color-white); border-bottom:1px solid var(--color-border2);}
.full-table th,
.full-table td {text-align: left; font-size: var(--fs-14); line-height: 1.5; font-weight: 400; padding: var(--fs-18) var(--fs-16); vertical-align:middle; word-break:keep-all; border-bottom: 1px solid var(--color-border2);}
.full-table th {background-color:var(--color-bg2); color: var(--color-text1);}
.full-table td {color: var(--color-text3); white-space: nowrap; overflow: hidden; text-overflow: ellipsis; background-color: var(--color-white);}

/* 데스크박스 */
.desc-box {border: 1px solid transparent; color: var(--color-text2); padding: var(--fs-20); border-radius: 8px; display: flex; align-items: center; column-gap: var(--fs-16);}
.desc-box img {flex-shrink: 0;}
.desc-box.flex {display: flex; align-items: center; justify-content: space-between;}
.desc-box.red {background-color: #FCF3F3;}
.desc-box.red p {color: #8B2A20;}
.desc-box.blue {background-color: var(--color-bg2);}
.desc-box.blue p {color: var(--color-static2);}
.desc-box.gray {background-color: var(--color-border2);}

.desc-box:has(ul) {flex-direction: column; align-items: flex-start; row-gap: var(--fs-20);}
.desc-box strong {display: block; font-weight: 500;}
.desc-box .list-tit {padding-top: var(--fs-20); margin-bottom: var(--fs-20); color: var(--color-text1);}
.desc-box li + li {margin-top: var(--fs-12);}
.desc-box li {display: flex; align-items: flex-start; column-gap: var(--fs-12); color: var(--color-text2);}
.desc-box li:not(.list-tit)::before {margin-block: calc(var(--fs-18) / 2); flex-shrink: 0; content: ''; display: block; width: 4px; height: 4px; border-radius: 50%; background-color: var(--color-text2);}


.desc-box:has(dl) {flex-direction: column; align-items: flex-start; row-gap: var(--fs-20);}
.desc-box strong {display: block; font-weight: 500;}
.desc-box dl {width: 100%; display: flex; flex-direction: column; row-gap: var(--fs-12);}
.desc-box dl div {display: flex; align-items: center; justify-content: space-between;}
.desc-box dl dt {color: var(--color-text2);}
.desc-box dl dd {color: var(--color-static1);}

/* 커스텀체크 */
.custom-chk-list {display: flex; flex-direction: column; row-gap: 10px;}
.desc-box:has(.custom-chk) {border-color: var(--color-border1); background-color: var(--color-white);}
.desc-box:has(.custom-chk input[type="checkbox"]:checked) {border-color: var(--color-static2);}
.desc-box .custom-chk {width: 100%; justify-content: space-between;}
.desc-box .custom-chk label {column-gap: var(--fs-20); flex: 1;}
.desc-box .custom-chk label em {flex-direction: column; align-items: flex-start; row-gap: 2px; flex: 1;}
.desc-box .custom-chk label em strong {color: var(--color-text2);}
.desc-box .custom-chk label em p {color: var(--color-text4);}
.custom-chk {display:flex; align-items:center; gap:7px; font-size: var(--fs-16); line-height: 1.65; letter-spacing: -0.2px; color:var(--color-text1);}
.custom-chk input[type="checkbox"] {display:none;}
.custom-chk label {cursor:pointer; display:flex; align-items:center; column-gap: var(--fs-12);}
.custom-chk label span {flex-shrink:0; display:inline-block; width: 24px; height: 24px; border:1px solid var(--color-border1); border-radius: 4px; background-color:var(--color-white); background-image:url(../img/checkbox-ico.svg); background-size:60%; background-repeat:no-repeat; background-position:center center; transition:all 0.2s ease;}
.custom-chk label em {display: flex; align-items: center; column-gap: 8px; font-style:normal; font-size:var(--fs-16); line-height:1.65; color:var(--color-text1);}
.custom-chk.required label em::after {content: '(필수)'; color: var(--color-text3); word-break: keep-all;}
.custom-chk.optional label em::after {content: '(선택)'; color: var(--color-text3); word-break: keep-all;}
.custom-chk input[type="checkbox"]:checked + label span {background-color:var(--color-static1);}
.custom-chk:hover span {background-color:var(--color-static3);}

/* 인풋 */
form, fieldset {width: 100%;}
fieldset {margin:0; padding:0; border:0;}
form {display: flex; flex-direction: column; row-gap: var(--space-60);}
.form-block {display: flex; flex-direction: column; row-gap: var(--fs-40);}
.form-block + .form-block {padding-top: var(--space-60); border-top: 1px solid var(--color-border2);}
.form-tit {color:var(--color-static1); display: flex; align-items: center; column-gap: var(--fs-20);}
.form-tit h3 {flex-shrink: 0;}
/* .form-tit::after {flex: 1; content: ''; width: 100%; height: 1px; background-color: var(--color-border1);} */
/* .form-tit:has(> button) {display: grid; grid-template-columns: 1fr auto; align-items: center; column-gap: var(--fs-16);}
.form-tit > button {align-self: start;} */
.blind {position:absolute; width:1px; height:1px; margin:-1px; padding:0; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0;}
.input-list {display: flex; flex-direction: column; row-gap: var(--fs-20);}
.input-list > * {width: 100%;}
.input-wrap {width: 100%; display: flex; flex-wrap: wrap; gap: var(--fs-20);}
.input-wrap > * {width: calc(50% - var(--fs-20) / 2);}
.input-wrap > .w30 {width: calc(100% / 3 - var(--fs-20) * 2 / 3);}
.input-item-label > .custom-select-box,
.input-item-label > .custom-input {width: 100%;}
.input-item-label {display: flex; flex-direction: column; row-gap: 6px; align-items: flex-start;}
.input-item-label label,
.input-item-label .label {padding: 0; font-size: var(--fs-16); line-height: 1.65; letter-spacing: -0.2px; color:var(--color-text1); display: flex; align-items: center; column-gap: 6px;}
.input-item-label label.required::after,
.input-item-label .label.required::after {content: '*'; color: #D7193F;}
.input-item-label .hidden-label {opacity: 0;}
.input-item-label .hidden-label {opacity: 0;}
.input-item-label.row {display:grid; grid-template-columns:140px minmax(0, 1fr); align-items:start; column-gap:var(--fs-20); row-gap:0;}
.input-item-label.row > .input-content {min-width:0;}
.input-item-label.row > .input-content input {width: 100%;}
.input-item-btn,
.input-item-email {width: 100%; display: flex; align-items: center; column-gap: 6px;}
.input-item-email {width: 100%;}
.input-item-email span {width: var(--fs-16); text-align: center;}
.input-item-email .custom-input,
.input-item-email .custom-select-box {width: calc((100% - var(--fs-16) - 12px) / 3) !important;}
.input-item-btn .custom-input {width: auto; flex: 1;}
.custom-textarea,
.custom-select-box select,
.custom-input {transition: border 0.2s; background-color: #fff; border: 1px solid var(--color-border1); padding: 9.5px 10px; font-size: var(--fs-16); color: var(--color-text1); line-height: 1.6; letter-spacing: -0.2px;}
.custom-textarea {width: 100%; height: 180px; resize: none; border-radius: 8px;}
.custom-textarea::placeholder,
.custom-input::placeholder {color: var(--color-text4); font-size: var(--fs-16); line-height: 1.6; letter-spacing: -0.2px;}
.custom-input.search {}
.custom-select-box {position: relative;}
.custom-select-box select {width: 100%; cursor: pointer; padding-right: calc(10px + var(--fs-24)); appearance: none; -webkit-appearance: none; -moz-appearance: none;}
.custom-select-box::after {content: ''; display: block; position: absolute; top: 50%; transform: translateY(-50%); right: 10px; width: var(--fs-24); height: var(--fs-24); background-color:var(--color-white); background-image:url(../img/select-arrow.svg); background-repeat:no-repeat; background-position:center center; pointer-events: none;}
.custom-input,
.custom-select-box select,
.custom-input-btn {height: calc(var(--fs-22) * 2); border-radius: 8px; flex-shrink: 0; white-space: nowrap; padding-block: 0;}
.custom-input:hover,
.custom-select-box:hover select {border-color: var(--state-soldout-bg);}
.custom-input:focus,
.custom-select-box select:focus {border-color: var(--color-static3);}
.input-desc {font-size:var(--fs-15); line-height:1.6; color:var(--color-text3);}
.input-desc.error {display: flex; align-items: center; column-gap: 6px; color: #FF383C;}
.input-desc.error::before {content: ''; display: block; width: 12px; height: 12px; background-image: url(../img/error-ico.svg); background-size: contain; background-repeat: no-repeat; background-position: center center;}
.desc-box.input-desc {margin-top: 10px; background-color: var(--color-bg2); color: var(--color-text2);}
.custom-input.error {border-color:#FF383C;}
.custom-input:read-only {background-color: var(--color-bg2); pointer-events: none;}
.custom-input[type="month"]::-webkit-calendar-picker-indicator,
.custom-input[type="date"]::-webkit-calendar-picker-indicator {opacity: 0; position: absolute; right: 10px; width: var(--fs-24); height: var(--fs-24); cursor: pointer;}
.custom-input[type="month"],
.custom-input[type="date"] {position: relative; padding-right: calc(10px + var(--fs-24)); background-image: url('../img/calendar-ico.svg'); background-repeat: no-repeat; background-position: right 10px center; background-size: var(--fs-24);}
.custom-input:disabled {background-color: var(--color-text6);}

.textarea-wrap {position: relative;}
.textarea-wrap .textarea-count {position: absolute; right: var(--fs-20); bottom: var(--fs-20); color: var(--color-text4);}

/* 캘린더 */
.common-calendar {width: 100%; border-radius:24px; background:var(--color-white);}
.common-calendar .swiper {width: 100%;}
.common-calendar .calendar-month {display:flex; justify-content: center; align-items:center; column-gap: var(--fs-24); margin-bottom: var(--fs-16); padding-bottom: var(--fs-16); border-bottom: 1px solid var(--color-border1);}
.common-calendar .calendar-month strong {font-size: var(--fs-28);}
.common-calendar .calendar-month button {transition: opacity 0.2s;}
.common-calendar .calendar-month button:disabled {opacity: 0.3;}
.common-calendar .calendar-b {}
.common-calendar .calendar-week {text-align: center; display:grid; grid-template-columns:repeat(7,1fr); margin-bottom: 2px; height: 24px;}
.common-calendar .calendar-week span {text-align:center; color: var(--color-text3);}
.common-calendar .calendar-week .sun {color:#C0392B;}
.common-calendar .calendar-week .sat {color:#3B82F6;}
.common-calendar .calendar-day-list {display:grid; grid-template-columns:repeat(7,1fr);}
.common-calendar .calendar-day-list .calendar-day {transition: background-color 0.2s; width: 100%; aspect-ratio: 1/1; display: flex; flex-direction: column; align-items: center; justify-content: center; cursor: pointer;}
.common-calendar .calendar-day-list .calendar-day .date {transition: background-color 0.2s, color 0.2s; width: 34px; height: auto; aspect-ratio: 1/1; max-width: 80%; border-radius: 50%; display: flex; align-items: center; justify-content: center; color: var(--color-text2);}
.common-calendar .calendar-day-list .calendar-day.other-month .date {color: var(--color-text4);}
.common-calendar .calendar-day-list .calendar-day.checkin .date,
.common-calendar .calendar-day-list .calendar-day.checkout .date {background-color: var(--color-static1) !important; color: var(--color-white) !important;}
.common-calendar .calendar-day-list .calendar-day.checkin {border-top-left-radius: 99px; border-bottom-left-radius: 99px;}
.common-calendar .calendar-day-list .calendar-day.checkout {border-top-right-radius: 99px; border-bottom-right-radius: 99px;}
.common-calendar .calendar-day-list .calendar-day.checkin,
.common-calendar .calendar-day-list .calendar-day.checkout,
.common-calendar .calendar-day-list .calendar-day.stay {background-color: var(--color-bg2);}
.common-calendar .calendar-day-list .calendar-day:hover .date {background-color: var(--color-static5);}

/* 필터 */
.filter-white {-webkit-filter: brightness(0) invert(1); filter: brightness(0) invert(1);}
.filter-black {-webkit-filter: grayscale(100%) brightness(0); filter: grayscale(100%) brightness(0);}

/* 오시는길 공통 */
.loc-section .loc-wrap {width: 100%; display: flex; align-items: center; column-gap: calc(var(--fs-20) * 2);}
.loc-section .loc-wrap .loc-map {aspect-ratio: 1005 / 440; flex: 1; height: auto; border-radius: 8px; border: 1px solid var(--color-border1); overflow: hidden;}
.loc-section .loc-wrap .loc-map #daumRoughmapContainer1781677659144 {width: 100% !important; height: 100% !important;}
.loc-section .loc-wrap .loc-map .wrap_map {height: 100% !important;}
.loc-section .loc-wrap .loc-map .root_daum_roughmap_landing .border1,
.loc-section .loc-wrap .loc-map .root_daum_roughmap_landing .border3,
.loc-section .loc-wrap .loc-map .root_daum_roughmap_landing .border4,
.loc-section .loc-wrap .loc-map .root_daum_roughmap .wrap_controllers,
.loc-section .loc-wrap .loc-map .root_daum_roughmap .cont .section.lst {display: none !important;}
.loc-section .loc-wrap .loc-info {display: flex; flex-direction: column; row-gap: calc(var(--fs-20) * 2);}
.loc-section .loc-wrap .loc-info .loc-box {}
/* .loc-section .loc-wrap .loc-info .loc-box + .loc-box {margin-top: calc(var(--fs-20) * 2);} */
.loc-section .loc-wrap .loc-info .loc-box h4 {font-weight: 500; margin-bottom: var(--fs-24); color: var(--color-static1);}
.loc-section .loc-wrap .loc-info .loc-box .loc-info-list {display: flex; flex-direction: column; row-gap: var(--fs-20);}
.loc-section .loc-wrap .loc-info .loc-box dl {display: flex; flex-direction: column; row-gap: 4px;}
.loc-section .loc-wrap .loc-info .loc-box dl + dl {}
.loc-section .loc-wrap .loc-info .loc-box dl dt {font-weight: 500; line-height: 1.5;}
.loc-section .loc-wrap .loc-info .loc-box dl dd {color: var(--color-text2);}
.loc-map {width: 100%; min-width: 0;}
.loc-map .root_daum_roughmap {width: 100% !important; height: 100% !important;}
.loc-map .root_daum_roughmap .wrap_map {width: 100% !important; height: 100% !important;}
.loc-map .root_daum_roughmap .map {width: 100% !important; height: 100% !important;}

@media screen and (max-width: 1024px) {
    .input-item-label.row {display: flex; flex-direction: column; row-gap: var(--fs-12);}
    .input-item-label.row > .input-content {width: 100%;}

    /* 오시는길 공통 */
    .loc-section .loc-wrap .loc-map {aspect-ratio: unset; max-width: 100%;}
    .loc-section .loc-wrap {flex-direction: column; row-gap: var(--fs-30);}
    .loc-section .loc-wrap .loc-map,
    .loc-section .loc-wrap .loc-map #daumRoughmapContainer1781677659144,
    .loc-section .loc-wrap .loc-map .wrap_map,
    .loc-section .loc-wrap .loc-map .wrap_map .map {min-height: 400px;}
    .loc-section .loc-wrap .loc-info {width: 100%;}
}

@media screen and (max-width: 768px) {
    .tab-list {column-gap: var(--fs-30);}
    .full-box .full-box-tit::before {content:''; width:36px; height:4px; border-radius:2px; background-color:rgb(var(--rgb-white) / 30%); margin-inline:auto;}
    .full-box .full-box-body {border-radius:0;}
    
    .full-table {display:block; min-width:unset; border:0; background-color:transparent;}
    .full-table colgroup,
    .full-table thead {display:none;}
    .full-table tbody {display:flex; flex-direction:column; row-gap:var(--fs-20);}
    .full-table tbody tr {display:flex; flex-direction:column; padding: var(--fs-16) var(--fs-20); border:1px solid var(--color-border1); border-radius: 8px; background-color:var(--color-white);}
    .full-table th,
    .full-table td {display:block; padding:0; border-bottom:0; text-align:left; white-space:normal; overflow:visible; text-overflow:unset;}
    .full-table td + td {padding-top:10px; margin-top:10px; border-top:1px solid var(--color-border1);}
    .full-table td::before {content:attr(data-label); display:block; margin-bottom:2px; font-size:var(--fs-16); font-weight: 400; line-height: 1.65; letter-spacing: -0.2px; color:var(--color-text4);}
    .full-table tbody tr:hover td {background-color:var(--color-white);}
    .full-table tbody tr td {font-weight: 500; color: var(--color-text2);}
    .full-table tbody tr td > .square-btn {margin-inline:0;}

    .full-box {border-radius: 8px 8px 0 0;}

    /* 오시는길 공통 */
    .loc-section .loc-wrap .loc-map,
    .loc-section .loc-wrap .loc-map #daumRoughmapContainer1781677659144,
    .loc-section .loc-wrap .loc-map .wrap_map,
    .loc-section .loc-wrap .loc-map .wrap_map .map {min-height: 300px;}
}
@media screen and (max-width: 500px) {
    .section-tit-wrap {align-items: center;}
    .section-tit-wrap > * {text-align: center !important;}
    .desc-box .custom-chk label {column-gap: var(--fs-12); align-items: center;}
    .custom-chk label {align-items: flex-start;}
    /* .custom-chk label em {flex-direction: column; align-items: flex-start;}
    .custom-chk label em strong {line-height: 24px;} */
    .custom-chk:has(label em >*:first-child:last-child) {border: 1px solid var(--color-border1); color: var(--color-text2); padding: var(--fs-20); border-radius: 6px; display: flex; align-items: center; column-gap: var(--fs-16);}
    .custom-chk:has(input[type="checkbox"]:checked + label em >*:first-child:last-child) {border-color: var(--color-static2);}
    .custom-chk label em:has(>*:first-child:last-child) {display: unset;}
    .custom-chk label em:has(>*:first-child:last-child) strong {line-height: 24px;}
    .custom-chk.required label em::after {content: '*'; color: #D7193F;}
}
@media screen and (max-width: 375px) {
    .hero-sub {font-size: 16px;}
    .section-tit {font-size: 24px;}
    .btn-wrap {flex-direction: column; align-items: flex-start; row-gap: var(--fs-16);}
    .btn-wrap > * {width: 100%;}
}