/*=================================================
        JOO Drawer
=================================================*/
/**#####===== 기본 =====#####**/
.joo-drawer{
    display: none;
    flex-wrap: nowrap;
    flex-direction: column;
    position: fixed;
    z-index: 1000;

    background-color: #ffffff;
}

/**#####===== 렌더 =====#####**/
.joo-drawer.before-render{
    opacity: 0;
}

.joo-drawer.before-render.showing{
    display: flex;
    opacity: 1;

    transition: transform 0.5s ease-in, opacity 0.5s ease-in;
}

.joo-drawer.rendered{
    display: flex;
}

.joo-drawer.close-render{
    opacity: 0;

    transition: transform 0.5s ease-in, opacity 0.5s ease-out;
}

/**#####===== 드로워 형태 =====#####**/
.joo-drawer.bottom{
    right: 0;
    left: 0;

    border-top-left-radius: 1rem;
    border-top-right-radius: 1rem;
}

.joo-drawer.bottom.before-render,
.joo-drawer.bottom.close-render{
    transform: translateY(100%);
}

.joo-drawer.bottom.before-render.showing{
    transform: translateY(0%);
}

.joo-drawer.page{
    width: 100%;
    height: 100%;

    z-index: 1040;

    border-radius: 0;
}

/**#####===== 헤더 =====#####**/
/**##### 닫기 #####**/
.joo-drawer-close{
    position: absolute;
    display: inline-block;
    top: 0;
    right: 0;
    padding: 1rem;
}

/**##### 드래그 핸들 #####**/
.joo-drawer-handler{
    position: relative;
    overflow: hidden;
    height: 3rem;
    visibility: hidden;
}

.joo-drawer.draggable .joo-drawer-handler{
    visibility: visible;
}

.joo-drawer-handler:before{
    content: '';
    position: absolute;

    border-radius: 4px;
    background-color: rgba(200, 200, 200, 0.7);
}

.joo-drawer.top .joo-drawer-handler:before,
.joo-drawer.bottom .joo-drawer-handler:before{
    width: 5rem;
    height: 0.5rem;

    top: 0.5rem;
    left: 50%;

    transform: translateX(-50%);
}

/**#####===== 컨텐츠 =====#####**/
.joo-drawer-content{
    padding: 1rem;
    overflow-y: auto;
}

.joo-drawer-content .plugin-remove_button .remove-single{
    display: none;
}

.joo-drawer-content .report-wrap{
    padding: 0;
}
