@charset "UTF-8";
/* ============================================================
 * directory-search-layout-panel.css
 * 우측 상세 패널 + 기초데이터 검색창 반응형(~767px)
 *
 * directory-search-layout.css 와 짝으로 사용한다.
 *
 * [사용 페이지 - 9개]
 *   user/renew         : govSearch, spaceDataSearch, textDataSearch, docDataSearch,
 *                        statsDataSearch, themeAnalSearch, fusionDataSearch, etcDataSearch
 *   user/renew/observe : rawSearch
 *
 * NOTE) openAPI 계열은 이 파일을 연결하지 않는다. 해당 페이지에도
 *       #right-panel-info-btn 요소가 있어 `flex: 0 0 auto` 가 적용되면
 *       모바일에서 현재 정렬이 바뀐다.
 * ============================================================ */

@media (max-width: 767px) {
    #tab-2 .right-panel-meta-actions {
        display: contents !important;
    }

    #tab-2 #right-panel-info-btn,
    #tab-2 #right-panel-list-btn {
        flex: 0 0 auto;
    }

    #tab-2 #directoryBsisSearchBox > .form-area-box,
    #tab-2 #directoryBsisSearchBox .ele-icon-box {
        width: 100%;
        min-width: 0;
    }

    #tab-2 #directoryBsisSearchBox .ele-icon-box {
        flex-wrap: nowrap;
    }

    #tab-2 #directoryBsisSearchBox {
        flex: 1 0 180px;
        width: auto;
        max-width: 100%;
        min-width: 0;
    }

    #tab-2 #directoryBsisSearchBox > .form-area-box {
        margin-right: 0 !important;
    }

    #tab-2 #directoryBsisSearchInput {
        flex: 1 1 auto;
        width: auto;
        min-width: 0;
    }

    #tab-2 #directoryBsisSearchBtn {
        flex: 0 0 auto;
    }
}