/*** common ***/
.visible-mobile{
    opacity: 0;
    pointer-events: none;
}

.none-laptop,
.none-mobile,
.block-laptop,
.block-mobile {
    display: none !important;
}


/**
******** 반응형 화면 설정
 */


/* 992px */
@media (max-width: 991.98px) {

    /* header */
    .topTitleBar {
        display: none;
    }

    .previewDiv {
        left: 10%;
    }

    /* projectlist */
    /*.bati-project-card .card-header {*/
    /*    display: none !important;*/
    /*}*/



    #workflow.mobile-workflow{
        width: 100% !important;
        display: block !important;
    }
    /* opacity 1 - mobile*/
    .visible-mobile {
        opacity: 1;
        pointer-events: auto;
    }

    .bati-project-table-responsive {
        height: calc(100vh - 325px);
        overflow-y: auto;
    }

    /**
        workbase header
     */
    .bati-workbase-project-title {
        display: none;
    }

    .bati-workbase-slash {
        display: none;
    }

    .bati-workabse-page-title {
        width: 100%;
        text-align: center;
    }

    .bati-workbase-work-title {
        width: 100%;
        max-width: 100%;
    }

    .bati-note-sheet {
        height: calc(100vh - 156px) !important;
    }


    /**
        workbase
     */

    #workbaseHeader-container {
        display: flex;
        align-items: center;
        justify-content: space-between;
    }

    .bati-panel-right {
        display: none !important;
    }

    #bati-splitter {
        display: none !important;
    }

    .bati-panel-left {
        width: 100% !important;
        max-width: 100% !important;
    }
}

/* 768px */
@media (max-width:767.98px) {
    .bati-project-content {
        flex: 1 0 auto;
    }}

/* 576px */
@media (max-width:575.98px) {
    .page-header-btn-right {
        display: none !important;
    }

    .bati-workbase-project-title {
        width: 100px;
        max-width: 100px;
        margin: 0 1rem 0 0 !important;
    }
}



/**
    반응형 기기별 개별 설정
 */
/* 랩탑 이상에서 .none-laptop 숨김 해제, .block-laptop 보임 */
@media (min-width: 992px) {
    .none-laptop {
        display: none !important;
    }
    .block-laptop {
        display: block !important;
    }
}

/* 모바일에서 .none-mobile 숨김 해제, .block-mobile 보임 */
@media (max-width: 991px) {
    .none-mobile {
        display: block !important;
    }
    .block-mobile {
        display: block !important;
    }
}