/* 메인페이지 */
/* 섹션 공통 */
section.sec { display: flex; padding: 8rem 0; flex-direction: column; align-items: center; gap: 4rem; align-self: stretch; } 

.container { width: 100%; } 

.contents { margin: 0 auto; max-width: 150rem; } 

.contents__title { color: #000; text-align: center; font-size: clamp(2rem, calc(24px + (100vw - 960px) * 0.0166667), 2.4rem); font-weight: 700; line-height: 3.2rem; letter-spacing: -0.04rem; margin-bottom: 2rem; } 

.section__title { color: #000; font-size: clamp(2.4rem, calc(24px + (100vw - 960px) * 0.0166667), 3.2rem); font-weight: 700; line-height: 120%; /* 57.6px */
 letter-spacing: -4%; } 

/* 메인페이지 스타일 */
/* ===============================
HERO (video background) 완료
=============================== */
.hero { position: relative; height: 76dvh; min-height: 56rem; display: grid; place-items: center; color: #fff } 

.hero__bg { position: absolute; inset: 0; overflow: hidden; } 

.hero video { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; } 

.hero__overlay { position: absolute; inset: 0; background: rgba(0, 0, 0, 0.20) } 

.hero__inner { display: flex; flex-direction: column; align-items: center; gap: 2rem; position: absolute; z-index: 1; max-width: 1920px; } 

.hero h1 { color: #FFF; /* font-size: 64px; */
 font-weight: 800; letter-spacing: -2.56px; font-size: clamp(2.6rem, 2vw + 1rem, 6.4rem); } 

.hero p { color: #FFF; text-align: center; font-size: clamp(2rem, 2.50vw, 3.2rem); font-weight: 200; line-height: 100%; /* 36px */
 letter-spacing: -1.44px; } 

.youtube-bg { position: absolute; top: 0; left: 0; width: 100%; height: 100%; overflow: hidden; z-index: 0; background: #000; } 

.youtube-bg iframe { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: max(100vw, 177.78dvh); /* 16:9 기준으로 화면보다 짧은 쪽 확장 */
 height: max(100dvh, 56.25vw); /* 반대로 9:16 비율 대비 확장 */
 pointer-events: none; opacity: 0.7; } 


/* 오른쪽 플로팅 CTA 완료 */
.float-cta { position: fixed; right: 3rem; bottom: 10dvh; z-index: 999; border-radius: 99rem; } 

.float-cta .pill { border-radius: 99rem; box-shadow: 0 2rem 4rem 0 rgba(109, 109, 109, 0.29); background: var(--Color__EE6811, #EE6811); display: flex; width: clamp(6rem, calc(60px + (100vw - 768px) * 0.02976), 8rem); padding: 2rem 0; flex-direction: column; align-items: center; gap: 1.7rem; color: #FFF; text-align: center; font-size: 1.4rem; font-weight: 500; line-height: 110%; /* 15.4px */
 letter-spacing: -0.56px; transition: transform 0.3s ease; } 

.float-cta .pill:hover { transform: translateY(-2rem); } 


/* ===============================
공간 필터 검색 (수정)
=============================== */
.chip-row { display: flex; flex-wrap: wrap; gap: 1rem } 

.rt__service.filter { display: flex; align-items: center; justify-content: center; flex-direction: row; } 

.filter { display: flex; /* flex-direction: column; */
 align-items: center; gap: 1rem; width: 100%; } 

.filters { padding: 0 !important; } 

.filters .container { display: flex; flex-direction: column; align-items: center; gap: 4rem; align-self: stretch; width: 1500px; max-width: 100%; background-color: #fff; padding: 8rem 0; } 

.filters-box { display: flex; flex-direction: column; align-items: center; gap: 1rem; /* max-width: 69rem; width: 100%; */ } 

.filter__label { display: flex; align-items: center; gap: 4px; position: relative; } 

.filter__label span { color: #666; font-size: 1.4rem; font-weight: 300; line-height: 100%; /* 1.4rem */
 letter-spacing: -0.56px; display: none; } 

.filter__label span.req { color: #EB2D2D; } 

.filter__label { font-size: 1.8rem; font-weight: 700; letter-spacing: -0.72px; } 

.chip-row.single { display: flex; padding: 1rem; align-items: center; /* gap: 1rem; */
 border-radius: 1rem; background: #F3F4F6; width: 100%; } 

.chip-row.single .chip { /* min-width: 16rem; */
 text-align: center; } 

.chip { justify-content: center; align-items: center; font-size: clamp(1.4rem, calc(14px + (100vw - 768px) * 0.003125), 1.6rem); font-weight: 300; line-height: 100%; border-radius: 1rem; text-align: center; cursor: pointer; } 

.chip-row.multi input[type="checkbox"]:checked~label { background: #8F949F; } 

.chip-row.multi .chip label { padding: 1rem 0; justify-content: center; align-items: center; cursor: pointer; font-size: clamp(1.4rem, calc(14px + (100vw - 768px) * 0.003125), 1.6rem); font-weight: 300; line-height: 100%; letter-spacing: -0.64px; min-width: 8rem; border-radius: 1rem; background: #F3F4F6; text-align: center; width: 100%; } 

.chip label { cursor: pointer; } 

.chip label:hover { opacity: 0.8; } 

.chip-row.single .chip { /* padding: 1rem; */ } 

.chip-row.single .chip label { padding: 1rem 0.8rem; /* min-width: 16rem; */
 border-radius: 1rem; display: inline-flex; align-items: center; justify-content: center; width: 100%; } 

.chip-row.single .chip input:checked~label { background: #FFF; color: #000; /* font-weight: 600; */ } 

.chip-row.multi .chip { display: flex; flex: 1; } 

.chip-row.multi .chip input:checked~label { background: #8F949F; color: #FFF; } 

.chip-row.single .chip.is-selected { background: #FFF; color: #000; font-weight: 600; } 

.chip.is-selected { background: var(--ink-900); border-color: var(--ink-900); color: #fff } 



/* 스크롤 시 스타일 */
.filters-pin { position: sticky; /* top: 8rem; */
 top: 0; z-index: 10; /* transition: background .2s ease, box-shadow .2s ease, padding .2s ease, border-radius .2s ease; */
 min-height: var(--filters-h, auto); } 

.filters-pin.is-stuck { /*
 display: flex; padding: 8rem 0; flex-direction: column; align-items: center; gap: 2rem; border-bottom: 1px solid #E8E8E8; background: #FFF; box-shadow: 0 4px 1rem 0 rgba(0, 0, 0, 0.10); */ } 

/* 내부에만 패딩/정렬 변화 적용 */
.filters__inner .container { padding: 2rem 0; /* 기존 큰 패딩 */
 transition: padding .2s ease; /* 내부만 부드럽게 */ } 

.filters-pin.is-stuck .filters__inner .container { /*
 padding: 2rem 0; gap: 1rem; */ } 

.filters-wrapper { position: relative; } 

.filters-pin { position: sticky; z-index: 10; } 

#filters { } 

#filters .filters__inner { position: sticky; top: 0; z-index: 20; will-change: transform; width: 100%; } 

#filters .filters__inner .container { gap: 0; } 

#filters .filters-box .aco-icon { display: none !important; } 

#filters.active { z-index: 111; width: 100%; min-height: auto; height: auto; } 

#filters.active .filters__inner { padding: 2rem 4rem; background: #ffffff; box-shadow: 0 4px 1rem 0 rgba(0, 0, 0, 0.10); border-bottom: 1px solid #E8E8E8; } 

#filters.active .filters__inner .container { margin: 0 auto; padding: 0; gap: 1rem; flex-wrap: wrap; display: flex; flex-direction: row; width: 1920px; max-width: 100%; justify-content: center; } 

#filters.active .contents__title { display: none; } 

#filters.active .filters-box { /* width:calc(100% - 184px - 236px - 4rem); */
 display: flex; flex-direction: row; align-items: center; justify-content: flex-start; max-width: 100%; gap: 1rem; } 

#filters.active .filters-box .filter.rt__service .filter-arco { display: none; } 

#filters.active .filters-box>.filter { display: flex; flex-direction: row; align-items: center; flex: 0 0 auto; max-width: 100%; width: auto } 

#filters.active .filters-box>.filter .filter-arco { flex: 0 0 auto; width: auto; } 

#filters.active .filters-box>.filter .filter-arco .filter__label { width: 6.4rem; flex-wrap: wrap; } 

#filters.active .filters-box>.filter .filter-arco .filter__label span { width: 100%; flex: 0 0 auto; } 

#filters.active .filters-box>.filter .filter-arco .filter__label .req { width: auto; flex: 0 0 auto; } 

#filters.active .filters-box .filter__panel { width: 100%; } 

#filters.active .filters-box .filter__panel.chip-row.single { gap: 1rem; width: 309px; overflow-x: auto; flex-wrap: unset; } 

#filters.active .filters-box .filter__panel.chip-row.single { -ms-overflow-style: none; } 

#filters.active .filters-box .filter__panel.chip-row.single::-webkit-scrollbar { display: none; } 

#filters.active .filters-box .filter__panel.chip-row.single .chip { white-space: nowrap; flex: 0 0 auto; width: auto; } 

#filters.active .rental-area { margin: 0; flex: 0 0 auto; width: 18.4rem; } 

#filters.active .rental-area .rental_btn { padding: 0 2rem; width: 100%; height: 4.4rem; border-radius: 1.2rem; } 

#filters.active .rental-area .rental_btn .left__txt { display: none; } 

#filters.active .rental-area .rental_btn:before { content: '렌탈서비스'; font-size: 16px; font-weight: 700; } 

#filters.active .cta-wrap { margin: 0; flex: 0 0 auto; width: auto; } 

#filters.active .cta-wrap .cta-btn { width: auto; height: 5.4rem; padding: 1.2rem 1.4rem; } 

#filters.active .cta-wrap .cta-btn .cta__text { flex: 1; } 

#filters.active .cta-wrap .cta-btn .cta__title { font-size: 16px; } 

@media (min-width:769px) { /* #filters .rental-area { margin-top:2rem; } */
 #filters .filters-box .chip-row { width: 100%; } 

 #filters .filters-box .chip-row.single { } 

 #filters .filters-box .chip-row.single .chip { width: 160px; } 


 #filters .cta-wrap .cta__title { font-size: 1.8rem; font-weight: 700; } 

 #filters .baro-search { display: none; } 

 #filters.active .filters-box .filter__panel { padding: 1rem !important; max-height: 100% !important; } 

 #results { } 

 #results .container { padding: 0 } 
 }

@media all and (max-width:769px){
 #filters { width: 100%; } 

 #filters .filters__inner .container { gap: 10px; padding: 20px 20px 52px; } 

 #filters .filters__inner .contents__title { margin: 0; font-weight: 700; line-height: 1; font-size: 2.2rem; } 

 #filters .rental-area { width: 100%; flex: 0 0 100%; } 

 #filters .rental-area .rental_btn { width: 184px; max-width: 100%; padding: 12px 20px; height: 44px; border-radius: 12px; } 

 #filters .rental-area .rental_btn .left__txt { display: none; } 

 #filters .rental-area .rental_btn .switch { flex: 0 0 auto; width: 41px; } 

 #filters .rental-area .rental_btn .switch input { flex: 0 0 auto; width: 41px; height: 20px; } 

 #filters .rental-area .rental_btn .switch input:before { padding: 0; min-width: 41px; width: 41px; height: 20px; flex: 0 0 auto; } 

 #filters .rental-area .rental_btn:before { content: '렌탈서비스'; font-size: 18px; line-height: 20px; font-weight: 700; } 

 #filters .cta-wrap { width: 100%; display: flex; align-items: center; justify-content: center; } 

 #filters .cta-wrap .cta-btn { width: 140px; height: 48px; padding: 0 24px; } 

 #filters .cta-wrap .cta-btn .cta__text { flex: 1; } 

 #filters .cta-wrap .cta-btn .cta__text .cta__title { font-size: 15px; font-weight: 500; } 

 #filters .cta-wrap .cta-btn .cta__icon { width: 30px; height: 30px; } 

 #filters .filters-box { display: none !important } 

 #filters .rental-area { display: none !important; } 

 #filters .cta-wrap { display: none !important; } 

 #filters.active .contents__title { text-align: center; margin: 0; font-weight: 700; line-height: 1; display: block; width: 100%; font-size: 2.2rem; } 

 #filters.active .filters__inner { padding: 0; border-bottom: 0; } 

 #filters.active .filters__inner form .container { padding: 20px 20px 52px; gap: 1rem; } 

 #filters.active .filters-box { width: 100%; max-width: 100%; flex-direction: column; } 

 #filters.active .filters-box>.filter { flex: 0 0 100%; width: 100%; max-width: 100%; } 

 #filters.active .filters-box .filter__panel.chip-row.single .chip { padding: 0; } 

 #filters.active .filters-box .filter__panel { } 

 #filters.active .rental-area { flex: 0 0 100%; width: 100%; display: flex; align-items: center; justify-content: center; } 

 #filters.active .rental-area .rental_btn { width: auto; } 

 #filters.active .rental-area .rental_btn { width: 184px; padding: 5px 15px; height: 40px; } 

 #filters.active .rental-area .rental_btn .left__txt { display: none; } 

 #filters.active .rental-area .rental_btn:before { content: '렌탈서비스'; font-size: 18px; font-weight: 700; } 

 #filters.active .cta-wrap { width: 100%; display: flex; align-items: center; justify-content: center; } 

 #filters.active .cta-wrap .cta-btn { height: 60px; width: auto; padding: 0 20px; } 

 #filters.active .cta-wrap .cta-btn .cta__text { } 

 #filters.active .cta-wrap .cta-btn .cta__text .cta__title { font-size: 15px; } 

 #filters.none .filters__inner { } 

 /* #filters.none .filters__inner .contents__title { margin-bottom: 20px; } */
 #filters.none .filters__inner .contents__title { display: none; } 

 #filters.none .filters-box { display: flex !important; width: 100%; } 

 #filters.none .filters-box .filter { flex-direction: row; gap: 10px; align-items: center;} 

 #filters.none .filters-box .filter.rt__service { flex-direction: row; gap: 10px; } 

 #filters.none .filters-box .filter.rt__service .filter-arco { width: auto; flex: 1 auto; } 

 #filters.none .filters-box .filter .filter-arco { width: auto; flex:1; } 

 #filters.none .filters-box .filter .filter-arco .filter__label { width: auto; } 

 #filters.none .filters-box .filter .filter-arco .filter__label span { width: auto; } 
#filters.none .filters-box .filter .chip-row.multi .chip label{
  width: auto; min-width: auto; padding: 1rem;
}
#filters.none .filters-box .filter .chip-row.multi {padding: 0 !important;}
 #filters.none .filters-box .filter__label { line-height: 1; font-size: 14px; } 

 #filters.none .filters-box .chip-row { padding: 0; gap: 4px;} 

 #filters.none .filters-box .chip-row { width: 100% !important } 

 #filters.none .filters-box .chip-row .chip {padding: 0 !important;
        flex: inherit;} 

 #filters.none .rental-area { display: flex !important; margin-top: 10px; } 

 #filters.none .cta-wrap { display: flex !important; width: auto; } 

 #filters .baro-search { position: absolute; bottom: 0; left: 0; display: flex !important; height: 32px; background: #EE6811; width: 100%; justify-content: center; align-items: center; gap: 0.4rem; } 

 #filters .baro-search .baro__title { font-size: 16px; color: #ffffff; } 

 #filters .baro-search .baro__icon { transform: rotate(180deg);  } 

 #filters .baro-search.on .baro__icon { transform: rotate(0); } 

 #results { padding: 4rem 0; } 

 #results .container { padding: 4rem 0 } 
 }

/*
 #filters.is-unpinned { position: relative; } 
.filters-pin.is-unpinned { position: static; top: auto; z-index: auto; box-shadow: none; } 
.filters-pin.is-stuck .filters-box { display: flex; justify-content: center; align-items: flex-start; gap: 4rem; flex-direction: row !important; max-width: 150rem; } 
.filters-pin.is-stuck .filters-box .chip-row.single .chip { min-width: 10rem; } 
.filters-pin.is-stuck .container { padding: 4rem 0; gap: 2rem } 
.filters-pin.is-stuck .contents__title { font-size: clamp(2.0rem, calc(24px + (100vw - 960px) * 0.0166667), 2.4rem); display: none; } 
.filters-pin.is-stuck .filter.w100 { width: auto !important; } 
*/
/* 토글 버튼 */
.filter .switch { display: flex; align-items: center; gap: 1rem; } 

.filter .switch span { color: #414141; font-size: 1.6rem; font-weight: 300; line-height: 100%; /* 1.6rem */
 letter-spacing: -0.64px; } 

.filter .switch input { display: flex; align-items: center; justify-content: center; gap: 1rem; cursor: pointer; transition: .2s; min-width: 4rem; height: 2rem; border-radius: 99px; overflow: hidden; } 

.filter .switch input::before { content: ""; display: flex; min-width: 4rem; height: 2rem; padding: .2rem; align-items: center; background: url(/img/house/icon-toggle.png) center center no-repeat !important; background-size: contain !important; } 

.filter .switch input:checked:before { background: url(/img/house/icon-toggle-active.png) center center no-repeat !important; background-size: contain !important; } 

.filter .switch input:read-only,
.filter .switch input:disabled { background: none; color: transparent; border: 0; } 

.rental_btn { display: flex; /* padding: 0 2rem; */
 gap: 1rem; align-items: center; align-self: stretch; /* border-radius: 1.2rem; */
 /* border: 1px solid rgba(238, 104, 17, 0.50); */
 /* background: #FDEFE7; */
 /* width: 18.4rem; */
 /* max-width: 100%; */
 /* margin: 0 auto; */
 /* height:4.4rem; */ } 

.rental_btn .left__txt { display: flex; align-items: center; gap: 1rem; } 

.rental_btn .left__txt strong { font-size: 1.5rem; font-weight: 600; letter-spacing: -4%; } 

.rental_btn .left__txt span { color: #868686; font-size: 1.5rem; font-weight: 600; line-height: 100%; /* 1.5rem */
 letter-spacing: -0.06rem; } 

.rental_btn .left__txt p { color: #000; font-size: 1.4rem; font-weight: 600; line-height: 130%; /* 2rem */
 letter-spacing: -0.08rem; margin-top: 0.4rem; } 

/* ===============================
제품 리스트
=============================== */
.cards { display: grid; grid-template-columns: 1fr 1fr; gap: 24px; width: 100%; } 

.card { display: flex; padding: 3rem; border-radius: 1.2rem; border: 1px solid #E8E8E8; } 

.card__inner { display: flex; flex-direction: column; align-items: flex-start; gap: 2rem; flex: 1 0 0; } 

.card__inner>div { width: 100%; } 

.model__title { display: flex; align-items: center; gap: 1rem; } 

.model__title span { color: #999; font-size: 1.4rem; font-weight: 600; letter-spacing: -0.56px; } 

.model__title .code { color: #000; font-size: clamp(1.7rem, calc(17px + (100vw - 768px) * 0.00441), 2rem); font-weight: 600; letter-spacing: -0.8px; } 

.thumb_wrap { display: flex; align-items: center; gap: 2rem; align-self: stretch; } 

.thumb { height: 100%; width: 100%; position: relative; border-radius: .4rem; background: linear-gradient(0deg, rgba(0, 0, 0, 0.20) 0%, rgba(0, 0, 0, 0.20) 100%), url(<path-to-image>) lightgray 50% / cover no-repeat; overflow: hidden; aspect-ratio: 16 / 9; /* 비율 고정 */
 box-sizing: border-box; cursor: pointer; } 

.thumb img { display: block; width: 100%; height: 100%; object-fit: cover; } 

.thumb__play { position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); /* 중앙 정렬 핵심 */
 z-index: 2; display: inline-block; line-height: 0; transition: transform .2s ease; } 

.thumb.video:hover .thumb__play { transform: translate(-50%, -50%) scale(1.04); } 

.meta_grid { display: grid; grid-template-columns: repeat(2, 1fr); gap: 2rem; width: 100%; } 

.meta_grid>div { display: flex; width: 100%; align-items: center; gap: 4rem; max-width: 37rem; } 

.meta_grid dt { min-width: 5rem; color: #000; font-size: clamp(1.6rem, calc(16px + (100vw - 768px) * 0.002976), 1.8rem); font-weight: 600; letter-spacing: -0.72px; } 

.meta_grid dd { color: #000; font-size: clamp(1.6rem, calc(16px + (100vw - 768px) * 0.002976), 1.8rem); font-weight: 200; letter-spacing: -0.72px; } 


@media (max-width: 1024px){
 .cards { grid-template-columns: 1fr } 

 .card__inner { grid-template-columns: 1fr } 
 }

/* ===============================
VIDEO SECTION
=============================== */
.video-sec { background: rgba(239, 239, 239, 0.60); } 

.video-sec .container { max-width: 150rem; } 

.video-head { display: flex; justify-content: space-between; align-items: flex-end; align-self: stretch; margin-bottom: 4rem; } 

.btn-youtube { display: flex; padding: 1.6rem 3.2rem; justify-content: center; align-items: center; gap: 1rem; border-radius: 9.9rem; background: #FFF; color: #000; text-align: center; font-size: 1.6rem; font-weight: 400; line-height: 100%; /* 1.6rem */
 letter-spacing: -0.064rem; } 

.btn-youtube::before { content: ""; display: flex; width: 2.4rem; height: 2.4rem; justify-content: center; align-items: center; background: url(/img/house/jt-youtube.svg) no-repeat center center; } 

.video-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 24px } 

.video-card { border-radius: 1.6rem; overflow: hidden; box-shadow: var(--shadow-card); background: #fff } 

.video-card__title { padding: 1.6rem 1.8rem; font-weight: 700 } 

@media (max-width: 1024px){
 .video-grid { grid-template-columns: 1fr } 
 }

.video-thumb { position: relative; width: 100%; padding-top: 56.25%; /* 16:9 비율 (9 / 16 * 100) */
 overflow: hidden; border-radius: 8px; /* 선택: 모서리 둥글게 */ } 

.video-thumb iframe { position: absolute; top: 0; left: 0; width: 100%; height: 100%; border: 0; } 

/* ===============================
WIDE BANNER
=============================== */
.wide-banner { max-width: 150rem; margin: 0 auto; padding: 3.6rem 0 } 

.wide { display: flex; padding: 10.8rem 8rem; align-items: center; border-radius: 3rem; background: linear-gradient(0deg, rgba(0, 0, 0, 0.50) 0%, rgba(0, 0, 0, 0.50) 100%),
 url(/img/house/img-banner.png) lightgray 0 -58.5643rem / 100% 254.834% no-repeat; } 

.wide__inner { } 

.wide__copy { display: flex; flex-direction: column; align-items: flex-start; gap: 4rem; } 

.wide__copy h4 { color: #FFF; font-size: clamp(3.2rem, calc(32px + (100vw - 768px) * 0.02381), 4.8rem); font-weight: 800; line-height: 100%; /* 48px */
 letter-spacing: -4%; } 

.wide__copy p { color: #FFF; font-size: clamp(1.6rem, calc(16px + (100vw - 768px) * 0.0119), 2.4rem); font-weight: 400; line-height: 100%; /* 36px */
 letter-spacing: -1.44px; margin-bottom: 2rem; } 

.banner-btn { display: flex; align-items: center; gap: 2rem; color: #FFF; } 

.banner-btn .cta__text { color: #FFF; font-size: clamp(1.6rem, calc(16px + (100vw - 768px) * 0.0119), 2.4rem); font-weight: 700; line-height: 100%; /* 24px */
 letter-spacing: -0.96px; } 

.banner-btn .cta__icon { display: flex; width: 4rem; height: 4rem; justify-content: center; align-items: center; gap: 1rem; aspect-ratio: 1/1; border-radius: 99px; background: #FFF; backdrop-filter: blur(5px); } 

/* ===============================
FOOTER
=============================== */
.footer { background: var(--footer); color: #fff } 

.footer .grid { display: grid; grid-template-columns: 1.1fr .9fr; gap: 4rem } 

.foot-left { padding: 4.8rem 0 } 

.foot-left .brand { display: flex; align-items: center; gap: 1rem; font-weight: 900; margin-bottom: 1.8rem } 

.foot-left .tel { font-size: 2.8rem; font-weight: 900 } 

.foot-left .list { margin: 1.8rem 0 0; padding: 0; list-style: none; opacity: .9 } 


.foot-form { padding: 4.8rem 0 } 

.panel { background: #252B36; border: 1px solid rgba(255, 255, 255, .08); border-radius: 1.6rem; padding: 2.4rem } 

.panel h5 { margin: 0 0 1.2rem; font-size: 2rem } 

.form { display: grid; gap: 1.2rem } 

.field { display: grid; grid-template-columns: 12rem 1fr; align-items: center; gap: 1rem } 

.field label { font-weight: 700 } 

.input { height: 44px; border-radius: 1rem; border: 1px solid rgba(255, 255, 255, .18); background: #1E2430; color: #fff; padding: 0 1.2rem } 

.consent { display: flex; align-items: center; gap: 8px; font-size: 1.4rem; opacity: .9 } 

.submit { display: flex; justify-content: flex-end } 

.btn-submit { height: 4.8rem; padding: 0 1.8rem; border-radius: 999rem; background: var(--brand); color: #fff; border: none; font-weight: 800 } 


@media (max-width: 960){
 .footer .grid { grid-template-columns: 1fr } 

 .field { grid-template-columns: 1fr; } 
 }











/* 메인 반응형 */
@media (max-width: 960px){
 .hero { position: relative; height: 100%; min-height: 42rem; display: grid; place-items: center; color: #fff; } 

 .rental_btn .left__txt p { font-size: 1.5rem; } 

 /* 필터 */
 section.sec { padding: 4rem 2rem; gap: 2rem; } 

 .filters .container { gap: 2rem; padding: 4rem 2rem; } 

 .filters-pin.is-stuck .container { padding: 4rem 2rem; gap: 2rem; } 

 .chip-row.single { width: 100%; gap: 0.4rem; } 

 .chip-row.single .chip label { min-width: auto; border-radius: .6rem; } 

 .chip-row.single .chip { min-width: auto; padding: 0.4rem .6rem; } 

 .filters-pin.is-stuck .filters-box { gap: 1rem; flex-direction: column !important; } 

 .filters-pin.is-stuck .filters-box .chip-row.single .chip { min-width: auto; } 

 .chip { min-width: auto; } 

 /* 모델 카드 섹션 */
 .card { padding: 2rem; } 

 .thumb_wrap { flex-direction: column; gap: 1rem; } 

 .meta_grid>div { gap: 1rem; } 

 /* 유튜브 영상 */
 .video-head { flex-direction: column; align-items: flex-start; gap: 4rem; } 

 /* 배너 */
 .wide { padding: 8rem 3rem; } 
 }




.card.card-empty { overflow: hidden; background: #EFEFEF; height: 40rem; max-height: 40rem; } 

.card.card-empty .pr_empty { display: flex; align-items: center; justify-content: center; flex-direction: column; gap: 2rem; width: 100%; height: 100%; padding: 0; } 

.card.card-empty .pr_empty img { width: 100%; max-width: 10rem; } 

.pr_empty h1 { color: #999; font-size: 2.4rem; font-weight: 600; } 
/* 메인 아코디언 추가 */
/* 아코디언 패널 기본 상태 */



/* .filter-arco { display: flex; align-items: center; justify-content: space-between; width: 100%; } */
.filter-arco .aco-icon { cursor: pointer; } 

.aco-icon svg { transition: transform 200ms ease; } 

.filter.is-open .aco-icon svg { transform: rotate(180deg); } 

.filter__panel { padding: 1rem !important; overflow: hidden; max-height: 100% !important; transition: max-height 260ms ease; transition: padding 0.2s; } 

.filter.is-open .filter__panel { } 

.filter.is-open .filter__panel.chip-row.single { padding: 1rem !important; } 

@media (max-width: 960px){
 .card.card-empty { padding: 5rem 0; } 
 #filters.none .filters-box .chip-row { flex-wrap: nowrap; } 
  #main .content_section{
  padding: 0 2rem;
 }
  #main .content_section .content-box {
    padding: 0;
}
#main .content_section #userVO .width_200 {
    width: 14rem !important;
    max-width: 100%;
}
#main .content_section #userVO .width_100{
  width: 6rem;
}
 }

 .meta_grid dd.rantprice-txt{flex: 1.8rem; font-weight: 600; color: var(--color-main);}


