/* button */
.btn._xs {display: flex; width: fit-content; height: 32px; padding: 10px 12px; justify-content: center; align-items: center; gap: 4px;border-radius: 5px; border: 1px solid var(--border-line-color); background: var(--color-white, #FFF);font-weight: 500;font-size: var(--text-14);color: var(--color-slate-700);}
.btn._sm {display: flex; width: fit-content; height: 44px; padding: 10px 12px; justify-content: center; align-items: center; gap: 4px;border-radius: 10px; border: 1px solid var(--border-line-color); background: var(--color-white, #FFF);font-weight: 500;font-size: var(--text-15);white-space: nowrap;}
.btn._md {display: flex; width: fit-content; height: 52px; padding: 16px 24px; justify-content: center; align-items: center; gap: 6px;border-radius: 10px; border: 1px solid var(--border-line-color); background: var(--color-white, #FFF);font-weight: 500;}
.btn._lg {display: flex;align-items: center; height: 56px;font-size: var(--text-16);width: 100%;border-radius: 10px;justify-content: center;border: 1px solid var(--border-line-color);font-weight: 500;gap:6px;}
.btn img {width: 20px;height: 20px;}
.btn._full {width: -webkit-fill-available !important;}
.btn._line {background: transparent;border: 1px solid var(--border-button-color);}
.btn._underline {border-bottom: 1px solid var(--color-slate-700);width: fit-content;padding: 0 3px;min-width: auto;}
.btn._nav {display: flex; width: 100%; min-height: 44px; padding: 10px 20px; justify-content: space-between; align-items: center; gap: 4px;border-radius: 10px; background: var(--color-white, #FFF);font-weight: 700;font-size: var(--text-16);color: var(--color-slate-900);}
.btn._nav._line {border: 1px solid var(--border-line-color);}
.btn._nav img {width: 24px;height: 24px;}
.btn._primary {background: var(--color-primary-600);border: 1px solid var(--color-primary-600);color: var(--color-white);}
.btn._white {background: var(--color-white);border: 1px solid var(--color-button-color);color: var(--color-slate-900);}
.btn._slate {background: var(--color-slate-700);border: 1px solid var(--color-slate-700);color: var(--color-white);}
.btn._gray {background: var(--color-slate-500);border: 1px solid var(--color-slate-700);color: var(--color-white);}
.btn._light {background: var(--color-slate-50);}
.btn._dark {background: var(--color-slate-900);border: 1px solid var(--color-slate-900);color: var(--color-white);}
.btn._fz-sm {font-size: var(--text-14);}
.btn._w-sm {min-width:auto;width: fit-content;white-space: nowrap;}

/* common */
span.primary {color: var(--color-primary-600);}

.component_wrap {display:flex;flex-direction:column;gap:40px;max-width:1400px;margin:80px auto;display: flex;gap:40px;flex-wrap: wrap;}
.component_wrap > div {padding: 40px;border: 1px solid var(--border-line-color);width: calc( 50% - 20px )}
.component_wrap > div.full {width: 100%;}
.component_wrap h3 {font-size: var(--text-24);font-weight: 700;margin: 0 0 24px;background: var(--color-slate-900);color: var(--color-white);padding: 12px 20px;}
.component_wrap ul {display: flex !important;}

/* input */
.flex.between {display: flex;justify-content: space-between;align-items: center;gap:10px;}
.input.flex {display: flex;gap:10px;}
.input._wrap .flex {flex-wrap:wrap;}
.input .flex {display: flex;gap:10px;align-items: center;}
.input select {height:52px;border: 1px solid var(--border-line-color);border-radius: 10px;padding: 10px 40px 10px 14px;width: auto;}
.input select._sm {width:fit-content;height:44px;font-size: var(--text-14);padding: 10px 26px 10px 12px;background-position:center right 12px;}
.input input[type=text], .input input[type=password], .input input[type=email] {width: 100%; height:52px;border: 1px solid var(--border-line-color);border-radius: 10px;padding: 0 20px;}
.input input[type=text]:disabled, .input input[type=password]:disabled, .input input[type=email]:disabled {background: var(--color-slate-50);}
.input input[type=text]::placeholder, .input input[type=password]::placeholder, .input input[type=email]::placeholder {color: var(--color-slate-500);}
.input._md input[type=text], .input._md input[type=password], .input._md input[type=email] {padding: 16px;}
.input._lg input[type=text], .input._lg input[type=password], .input._lg input[type=email] {padding: 0 20px;}
.input._full input[type=text], .input._full select {width: 100%;}
.input._w-sm input[type=text], .input._w-sm input[type=password], .input._w-sm input[type=email] {min-width:400px;}
.input_icon{position: absolute;right:0;top:0; width: 54px;height:54px;padding:0 16px;border-radius:10px;background: var(--color-slate-100);display: flex;justify-content: center;align-items: center;}
.input .search {position: relative;}
.board .search {width: 100%;}
.input .search button {position: absolute;right:20px;top:50%;transform: translateY(-50%);}
.input input[type=text]._full, .input select._full {width: 100% !important;}
textarea {width: 100%; height:180px; border: 1px solid var(--border-line-color);border-radius: 10px;padding: 20px;font-size: var(--text-16);resize: none;}

.pw_field{position:relative;gap:8px;align-items:center}

.date_field{position:relative;gap:8px;align-items:center}
.date_text{flex:1;height:60px;padding:0 12px;border:1px solid #ddd;border-radius:10px}
.date_picker{position:absolute;left:0;top:60px;width:1px;height:1px;opacity:0}

.radio input[type=radio] {display: none;}
.radio input[type=radio] + label {display: inline-block;height: 52px;display: flex;align-items: center;justify-content: center; padding: 0 10px; gap:8px; border-radius: 10px;border: 1px solid var(--border-line-color);color: var(--color-slate-500);font-weight: 500;white-space: nowrap;cursor:pointer;}
.radio input[type=radio]:checked + label {background: var(--color-primary-600);border: 1px solid var(--color-primary-600);color: var(--color-white);}
.radio_select_group div {width: calc(( 100% -  20px )/3 );}

.checkbox input[type=checkbox] {display: none;}
.checkbox input[type=checkbox] + label {display: inline-block;height: 52px;display: flex;align-items: center;justify-content: center; padding: 0 20px; gap:8px; border-radius: 10px;border: 1px solid var(--border-line-color);color: var(--color-slate-500);font-weight: 500;white-space: nowrap;cursor:pointer;width:88px;}
.checkbox input[type=checkbox]:checked + label {background: var(--color-primary-600);border: 1px solid var(--color-primary-600);color: var(--color-white);}

.checkbox_text input[type=checkbox] {display: none;}
.checkbox_text img {width: 28px;height: 28px;}
.checkbox_text input[type=checkbox] + label {font-size: var(--text-16);font-weight: 700;display: flex;gap:10px;align-items: center;cursor:pointer;}
.checkbox_text input[type=checkbox]:checked + label {color: var(--color-primary-600);}

.file{display:flex;gap:8px;align-items:center}
.file_text{flex:1;height:48px;padding:0 12px;border:1px solid #ddd;border-radius:10px}
.file_input{display:none}

/* tab */
.tab {max-width: var(--max-width);display: flex;gap:10px;flex-wrap:wrap;}
.tab li {padding: 11px 12px;border-radius: 10px;font-weight: 700;cursor: pointer;border: 1px solid var(--border-line-color);color: var(--color-slate-500);min-width:62px;text-align: center;}
.tab li.active {background: var(--color-primary-600);border: 1px solid var(--color-primary-600);color: var(--color-white);}
.tab_box {display: none;}
.tab_box.active {display: block;}

.mobile_tab {display: flex;flex-wrap:wrap;margin: 0 0 10px;border:1px solid var(--border-line-color);border-radius: 5px;overflow: hidden;}
.mobile_tab li {width: 50%;border-right: 1px solid var(--border-line-color);word-break: keep-all;}
.mobile_tab li:nth-child(even) {border-right: none;}
.mobile_tab li:nth-child(n+3) {border-top: 1px solid var(--border-line-color);}
.mobile_tab li a {text-align: center;padding: 13px 0;display: block;font-weight: 600;display: flex;align-items: center;justify-content: center;width: 100%;height: 100%;}
.mobile_tab li.active a {background: #EEF2FF;color: var(--color-primary-600);}
.mobile_tab.item3 li {width: calc( 100% / 3 );border-right: 1px solid var(--border-line-color);border-top: none;}
.mobile_tab.item3 li:nth-child(3n) {border-right: none;}
.mobile_tab.item3 li:nth-child(n+4) {border-top: 1px solid var(--border-line-color);}
.mobile_tab.item4 li {width: 25%;border-right: 1px solid var(--border-line-color);border-top: none;}
.mobile_tab.item4 li:nth-child(4n) {border-right: none;}
.mobile_tab.item4 li:nth-child(n+5) {border-top: 1px solid var(--border-line-color);}

/* pagination */
.pagination {display: flex;justify-content: center;align-items: center;gap:6px;margin: 36px 0 0;}
.pagination a {display: block;width: 44px;height: 44px;line-height: 44px;text-align: center;border-radius: 10px;border: 1px solid var(--border-line-color);color: var(--color-slate-500);font-weight: 500;font-size: var(--text-16);}
.pagination a img {width: 20px;height: 20px;}
.pagination a.active {background: var(--color-slate-900);border: 1px solid var(--color-slate-900);color: var(--color-white);}


/* modal */
.modal_wrap {display: none; position: fixed;top:0;left:0;width: 100%;height: 100vh;background: rgba(15, 23, 43, 0.90);z-index: 9999;align-items: center;justify-content: center;}
.modal {background: #fff;border-radius: 10px;width:calc( 100% - 36px );max-height:70vh;overflow-y: auto;margin: 0 auto;}
.modal._md {width: 640px;max-height:640px;overflow-y: auto;}
.modal._lg {width: 100%;max-height:100vh;overflow-y: auto;border-radius: 0;}
.modal .modal_header {padding: 14px 24px;display: flex;justify-content: space-between;border-bottom: 1px solid var(--border-line-color);align-items: center;}
.modal .modal_header h3 {max-width:calc( 100% - 40px );font-size: var(--text-18);font-weight: 700;word-break: keep-all;margin: 0;}
.modal .modal_header button img {width:24px;height:24px;max-width:none;}
.modal .modal_cont {padding: 24px;}
.modal .modal_cont .bdb {margin:0 0 20px;padding:0 0 20px;border-bottom: 1px solid var(--border-line-color);}
.modal .modal_cont h6 {font-weight: 700;line-height: 140%;color: var(--color-slate-700);}
.modal .modal_cont._center {display: flex;flex-direction: column; justify-content: center;align-items: center;text-align: center;}
.modal .modal_cont._center p {margin: 0;}
.modal .modal_btn {margin:20px 0 0;width: 100%;display:flex;justify-content: center;}
.modal .modal_btn.between {display: flex;justify-content: space-between;}

.modal._full {background: none;border-radius: 0;width: 100%;max-height:100vh;overflow-y: auto;}
.modal._full .modal_header {border-bottom: none;}
.modal._full .modal_header h3 {color: #fff;}
.modal._hg-fit {max-height:none;}

.modal .password{display:flex;gap:10px;margin:0 0 20px;}
.modal .password .input{position:relative;width:44px;height:44px}
.modal .password .input input{width:100%;height:100%;text-align:center;border:1px solid var(--border-line-color);border-radius:10px;font-size:var(--text-20);color: var(--color-primary-600);font-weight: 700;}
.modal .password .input input:focus {border-color:var(--color-primary-600);}
.modal .password .input img{position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:22px;pointer-events:none}
.modal .password .input.active img{display:none}
.modal .password .input.active input{border-color:var(--color-primary-600);}

.modal .bg_box {padding: 20px;margin: 20px 0;border-radius: 10px;background: var(--color-slate-50);}
.modal .modal_img {text-align: center;margin:10px 0 0;}
.modal h3 {font-size: var(--text-30);font-weight: 700;line-height: 140%;margin:0 0 10px;word-break: keep-all;}
.modal h4 {font-size: var(--text-24);font-weight: 700;line-height: 140%;word-break: keep-all;}
.modal h5 {font-size: var(--text-18);font-weight: 700;margin: 0 0 14px;line-height: 140%;word-break: keep-all;}
.modal p {color: var(--color-slate-700);line-height: 160%;margin:14px 0 0;word-break: keep-all;}


/* slider */
.img_slider {width: 100%; position: relative;overflow: hidden;}
.img_slider .slide_controls {position: absolute;bottom: 30px;left: 50%;transform: translateX(-50%);z-index: 10;}
.img_slider .slide_navigation {width: fit-content;display: flex;justify-content: space-between;align-items: center;gap: 4px;margin: 0 auto 12px;background: rgba(15, 23, 43, 0.70);border-radius: 10px;padding: 10px;}
.img_slider .slide_navigation .slide-button {width: 20px;height:20px;display: flex;align-items: center;justify-content: center;cursor: pointer;}
.img_slider .slide-pagination {color: var(--color-white);text-align: center;width: auto;white-space: nowrap;font-size: var(--text-12);font-weight: 500;line-height: 20px;padding: 0 12px;border-left: 1px solid rgba(226, 232, 240, 0.10);border-right: 1px solid rgba(226, 232, 240, 0.10);}

.card_slider .slide_controls {display: flex;gap:20px;max-width: var(--max-width);margin: 0 auto 20px;justify-content: end;}
.card_slider .slide_navigation {display: flex;gap:10px;}
.card_slider .slide_navigation .slide-button {width: 44px;height:44px;cursor: pointer;background: var(--color-slate-900);border-radius: 10px;display: flex;align-items: center;justify-content: center;}
.card_slider .slide_navigation .slide-button img {width: 24px;}
.card_slider .slide_navigation .slide-button.swiper-button-disabled {background: var(--bg-gray-100);cursor: default;}
.card_slider .slide_navigation .slide-button.swiper-button-disabled path {fill: var(--color-slate-900);}

.insurance_swiper .slide-pagination {width: auto;}
.insurance_swiper .slide_navigation .slide-button {width: 44px;height:44px;cursor: pointer;background: var(--color-slate-900);border-radius: 10px;display: flex;align-items: center;justify-content: center;}
.insurance_swiper .slide_navigation .slide-button img {width: 24px;}
.insurance_swiper .slide_navigation .slide-button.swiper-button-disabled {background: var(--bg-gray-100);cursor: default;}
.insurance_swiper .slide_navigation .slide-button.swiper-button-disabled path {fill: var(--color-slate-900);}

.slide-scrollbar-full {background: rgba(15, 23, 43, 0.70);width: 245px;height:10px;border-radius: 30px;padding: 2px;}
.slide-scrollbar-full .swiper-scrollbar-drag {background: var(--color-white);width:245px;border-radius: 30px;}
.slide-pagination-dot .swiper-pagination-bullet {background: rgba(15, 23, 43, 0.70);opacity: 1;}
.slide-pagination-dot .swiper-pagination-bullet.swiper-pagination-bullet-active {background: var(--color-white);width:51px;border-radius: 30px;}


/* review */
.review_card {display: grid;grid-template-columns: repeat(3, 1fr);}
.review_card._list-2 {grid-template-columns: repeat(2, 1fr);gap:10px;}
.review_card li .thumb {aspect-ratio: 1/1; overflow: hidden;border-radius: 10px;position: relative;margin:0 0 10px}
.review_card li .thumb > img {width: 100%;height: 100%;object-fit: cover;}
.review_card li .thumb .chip {position: absolute;top:10px;right:10px;display: flex;background: var(--color-white);padding: 4px;border-radius: 10px;align-items: center;gap:5px;}
.review_card li .thumb .chip p {font-size: var(--text-14);color: var(--color-slate-700);font-weight: 500;}
.review_card li .text_box {border: 1px solid var(--border-line-color);padding:16px;display: flex;flex-direction: column;gap:10px;border-radius: 10px;}
.review_card li .text_box .star {display: flex;gap:1px;color: #4A5565;font-weight: 700;align-items: center;flex-wrap: wrap;gap:4px;}
.review_card li .text_box .star div {display: flex;}
.review_card li .text_box .star img {width: 20px;}
.review_card li .text_box .info {display: flex;justify-content: space-between;align-items: center;flex-wrap:wrap;}
.review_card li .text_box .info p {font-size: var(--text-14);color: var(--color-slate-700);}
.review_card li .text_box .text {color: var(--color-slate-700);line-height: 140%;;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}
.review_card li .text_box .resort {font-size: var(--text-14);font-weight: 700;text-align: center;border-radius: 10px;background: var(--color-primary-50);padding: 12px 0;}

.review_list li {margin:0 0 30px;position: relative;}
.review_list li {display: flex;gap:13px;}
.review_list.review_list_link li {display: flex;flex-direction:column;gap:13px;align-items: flex-end;}
.review_list li a {display: flex;gap:13px;}
.review_list li .thumb {width:60px;height:60px;overflow: hidden;border-radius: 10px;}
.review_list li .thumb > img {width: 100%;height: 100%;object-fit: cover;}
.review_list li .text_box {display: flex;flex-direction: column;gap:10px;} 
.review_list li .thumb + .text_box {width: calc( 100% - 73px );}
.review_list li .text_box .btn {display: flex;justify-content: flex-end;}
.review_list li .text_box .star {display: flex;gap:1px;color: #4A5565;font-weight: 700;align-items: center;}
.review_list li .text_box .star img {width: 20px;}
.review_list li .text_box .star a {margin:0 0 0 10px;background: var(--color-slate-50);}
.review_list li .text_box .tit {display: flex;justify-content: space-between;align-items: center;position: relative;}
.review_list li .text_box .tit h5 {font-size: var(--text-18);font-weight: 700;}
.review_list li .text_box .info {display: flex;gap:10px;align-items: center;}
.review_list li .text_box .info p {font-size: var(--text-14);color: var(--color-slate-700);line-height: 20px;}
.review_list li .text_box .info p.date {font-size: var(--text-14);font-weight: 500;color: var(--color-slate-700);padding: 0 4px;background: var(--color-slate-100);}
.review_list li .text_box .text {font-size: var(--text-15); color: var(--color-slate-700);line-height: 140%;overflow: hidden;text-overflow: ellipsis;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;}

/* product */
a.full_view {position: absolute;right:8px;bottom:8px;width: 32px;height:32px;display: flex;align-items: center;justify-content: center;background: rgba(15, 23, 43, 0.70);z-index: 10;border-radius: 10px;}
a.full_view > img {width: 16px;}
.product .thumb {border-radius: 10px;position: relative;overflow: hidden;aspect-ratio: 280/250;}
.product .thumb > img {width: 100%;height: 100%;object-fit: cover;}
.product .thumb .chip {position: absolute;top:10px;right:10px;display: flex;background: var(--color-white);padding: 4px;border-radius: 10px;align-items: center;gap:5px;}
.product .thumb .chip p {font-size: var(--text-14);color: var(--color-slate-700);font-weight: 500;}
.product .resort_tit {display: flex;justify-content: space-between;margin:0 0 14px;flex-wrap: wrap;gap:8px;}
.product .resort_tit .resort_btn { display: flex;gap:10px;align-items: center;}
.product .resort_tit h4 {font-size: var(--text-18);font-weight: 700;}
.product .resort_tit .info {display:flex;gap:8px;align-items:center;}
.product .resort_tit .info div {display:flex;gap:2px;align-items:center}
.product .resort_tit .info p {font-size: var(--text-14);font-weight: 700;color: var(--color-slate-700);line-height: 20px;padding: 0 4px;background: var(--color-slate-100);}
.product .resort_txt {font-size: var(--text-15);color: var(--color-slate-700);line-height: 140%;overflow: hidden; display: -webkit-box;-webkit-box-orient: vertical;-webkit-line-clamp: 4;align-self: stretch;}
.product .tag {margin:12px 0 0;display: flex;gap:8px;flex-wrap: wrap;}
.product .tag p {font-size: var(--text-12);color: var(--color-slate-700);padding: 8px 10px;border-radius: 40px;background: var(--bg-gray-100);}

.product._card {display: grid;grid-template-columns: repeat(2,1fr);}
.product._card._list-4 {grid-template-columns: repeat(4,1fr);}
.product._card .cont {margin:14px 0 0;}

.product._list li {display: flex;gap:14px;width: 100%;}
.product._list .thumb {width: 96px;height:96px;}
.product._list .cont {width: calc(100% - 110px);}
.product._list a.cont {display: flex;flex-direction: column;justify-content: space-between;}
.product._list .thumb_gallery {display: flex;gap:4px}
.product._list .thumb_gallery span {display: block;width: 80px;aspect-ratio: 1/1;overflow: hidden;border-radius: 5px;}
.product._list .thumb_gallery span img {width: 100%;height: 100%;object-fit: cover;}

.product._btn li {flex-direction: column;}
.product._btn li .thumb {width: 96px;height:96px}
.product._btn li > div {display: flex;gap:14px;width: 100%;}
.product._btn li .btn {white-space: nowrap;}
.product._btn .resort_txt {-webkit-line-clamp: 2;}

.product._list._gallery li {margin:0 0 40px;}
.product._list._gallery .thumb{position:relative;overflow:hidden}
.product._list._gallery .thumb > img.main_img{position:relative;z-index:1}
.product._list._gallery .thumb > img.fade_img{position:absolute;inset:0;z-index:2;opacity:0;transition:opacity .8s cubic-bezier(.4,0,.2,1);pointer-events:none}

.product._view .thumb {height:367px;margin:0 0 14px;}
.product._view .resort_btn {display: flex;gap:10px;margin:10px 0 0;}
.product._view .resort_btn > :first-child {flex:1;}
.product._view .resort_btn > :last-child {flex:2;}

/* .info_resort_box ul {display: grid;grid-template-columns: repeat(2,1fr);gap:16px;}
.info_resort_box li {position: relative;aspect-ratio: 1/1; display: flex;padding: 10px;border-radius: 10px;overflow: hidden;align-items: flex-end;}
.info_resort_box li > img {width: 100%;position: absolute;height:100%;object-fit: cover;top: 0;left: 0;}
.info_resort_box li a.btn {z-index: 1;padding: 12px 10px;}
.info_resort_box li a span {width: calc( 100% - 20px );overflow: hidden;white-space: nowrap;text-overflow: ellipsis;display: block;}
.info_resort_box li a img {width: 20px;} */
.info_resort_box ul {display: grid;grid-template-columns: repeat(2,1fr);gap:16px 8px;}
.info_resort_box li a {width: 100%;display:block;}
.info_resort_box li img {width: 100%;height:100%;object-fit: cover;border-radius: 10px;overflow: hidden;aspect-ratio: 1/1;}
.info_resort_box li a span {overflow: hidden; text-overflow: ellipsis;display: block;margin:12px 0 0;font-size: var(--text-14);font-weight: 700;text-align: center;}

.card_swiper_wrap {overflow: hidden;}


/* 380 이하 */
@media (max-width: 380px) {
    .input .search input {padding:0 6px;}
}