@charset "UTF-8";

/*
  /room/list.asp 검색 필터 고정
  사이트 헤더 아래에서 검색 조건이 계속 보이도록 합니다.
*/

.room-catalog-page .room-list-sticky-filter{
    position:sticky;
    top:62px;
    z-index:900;
    padding:10px 0 11px;
    background:rgba(255,255,255,.96);
    border-bottom:1px solid #e6e9f0;
    box-shadow:0 7px 18px rgba(25,35,65,.07);
    backdrop-filter:blur(14px);
    -webkit-backdrop-filter:blur(14px);
}

.room-catalog-page .room-list-sticky-filter .room-filter-form{
    margin-top:0;
    padding:13px 14px;
    border:1px solid #e2e6ee;
    border-radius:13px;
    box-shadow:none;
}

.room-catalog-page .room-list-sticky-filter .room-filter-grid{
    gap:9px;
}

.room-catalog-page .room-list-sticky-filter .filter-field label{
    margin-bottom:4px;
    font-size:10px;
}

.room-catalog-page .room-list-sticky-filter .filter-field input,
.room-catalog-page .room-list-sticky-filter .filter-field select{
    height:39px;
    border-radius:9px;
    font-size:12px;
}

.room-catalog-page .room-list-sticky-filter .filter-checks{
    min-height:38px;
}

.room-catalog-page .room-list-sticky-filter .filter-checks label{
    font-size:12px;
}

.room-catalog-page .room-list-sticky-filter .filter-checks input{
    width:16px;
    height:16px;
}

.room-catalog-page .room-list-sticky-filter .filter-actions a,
.room-catalog-page .room-list-sticky-filter .filter-actions button{
    height:39px;
    border-radius:9px;
    font-size:12px;
}

.room-catalog-page .room-list-sticky-filter .filter-actions button{
    min-width:110px;
}

.room-catalog-page .room-list-sticky-filter .room-filter-message{
    margin:8px 0 0;
    padding:8px 11px;
    font-size:11px;
}

.room-catalog-page .room-results-section{
    position:relative;
    z-index:1;
}

/* 사이트 메뉴가 접히는 태블릿 구간 */
@media (max-width:1024px){
    .room-catalog-page .room-list-sticky-filter{
        top:62px;
    }
}

/*
  모바일에서는 헤더 56px 아래에 고정합니다.
  검색 조건을 열었을 때는 화면 높이를 넘지 않도록 내부 스크롤합니다.
*/
@media (max-width:760px){
    .room-catalog-page .room-list-sticky-filter{
        top:56px;
        max-height:calc(100vh - 56px - 63px);
        padding:8px 0;
        overflow-y:auto;
        overscroll-behavior:contain;
        box-shadow:0 5px 14px rgba(25,35,65,.08);
    }

    .room-catalog-page
    .room-list-sticky-filter
    .mobile-filter-toggle{
        position:relative;
        height:40px;
        border-color:#dfe3ec;
        background:#fff;
        box-shadow:none;
        font-size:12px;
    }

    .room-catalog-page
    .room-list-sticky-filter
    .room-filter-form{
        margin-top:7px;
        padding:10px;
    }

    .room-catalog-page
    .room-list-sticky-filter
    .filter-field input,
    .room-catalog-page
    .room-list-sticky-filter
    .filter-field select{
        height:40px;
    }
}

/* 아주 작은 화면에서는 입력항목을 한 열로 배치합니다. */
@media (max-width:430px){
    .room-catalog-page
    .room-list-sticky-filter
    .room-filter-grid{
        grid-template-columns:1fr;
    }

    .room-catalog-page
    .room-list-sticky-filter
    .room-filter-grid > .filter-field:nth-child(n),
    .room-catalog-page
    .room-list-sticky-filter
    .filter-checks,
    .room-catalog-page
    .room-list-sticky-filter
    .filter-actions{
        grid-column:auto;
    }
}