﻿/******************************************************************
      ** media query
      ******************************************************************
 여기부터 모바일 스타일로 변경 
@media all and (min-width: 768px) and (max-width: 1023px) {
    .org-title {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0px 10px;
    }

    .org-title-icon {
        width: var(--xlg-font);
        height: var(--xlg-font);
        display: flex;
        justify-content: center;
        align-items: center;
        color:#5c5fc0;
    }

        .org-title-icon svg {
            width: var(--xlg-font);
            height: var(--xlg-font);
            display: flex;
            justify-content: center;
            align-items: center;
        }

    .sub-container {
        margin: 40px 10px 0px;
    }

    .main {
        padding: 30px 15px 16px;
    }

    .main-area {
        margin-bottom: 7.5px;
    }

    .organized {
        padding: 16px 15px;
    }

    .approval {
        padding: 16px 15px;
    }

    .settlement {
        padding: 16px 15px;
    }

    .sub-area {
        display: flex;
        flex-wrap: wrap;
    }

    .default-table td {
        margin-right: 20px;
        padding: 0px 10px;
    }

    .default-font-color {
        color: #4c4c4c;
    }

    .scrollbar {
        overflow: auto;
    }

        .scrollbar::-webkit-scrollbar {
            width: 5px;
        }

        .scrollbar::-webkit-scrollbar-thumb {
            background: #a2a2a2;
            border-radius: 20px;
        }

        .scrollbar::-webkit-scrollbar-track {
            background: #e1e1e1;
            border-radius: 20px;
        }

    .sub-wrap.scrollbar::-webkit-scrollbar-button:vertical:start:decrement,
    .sub-wrap.scrollbar::-webkit-scrollbar-button:vertical:start:increment {
        display: block;
        height: 15px;
        pointer-events: none;
    }

    .org-list.scrollbar::-webkit-scrollbar-button:vertical:end:decrement {
        display: block;
        width: 25px;
    }

    .d_item_wrapper {
        max-width: 25%;
        flex: 1;
        flex-basis: 25%;
        display: flex;
        justify-content: center;
        padding: 7.5px 0;
    }
}

 모바일 가로 & 테블릿 세로 (해상도 480px ~ 767px)
@media all and (min-width: 480px) and (max-width: 767px) {
    .org-title {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0px 10px;
    }

    .org-title-icon {
        width: var(--xlg-font);
        height: var(--xlg-font);
        display: flex;
        justify-content: center;
        align-items: center;
    }

        .org-title-icon svg {
            width: var(--xlg-font);
            height: var(--xlg-font);
            display: flex;
            justify-content: center;
            align-items: center;
        }

    .sub-container {
        margin: 40px 10px 0px;
    }

    .main {
        padding: 30px 15px 16px;
    }

    .main-area {
        margin-bottom: 7.5px;
    }

    .organized {
        padding: 16px 15px;
    }

    .approval {
        padding: 16px 15px;
    }

    .settlement {
        padding: 16px 15px;
    }

    .sub-area {
        display: flex;
        flex-wrap: wrap;
    }

    .default-table td {
        margin-right: 20px;
        padding: 0px 10px;
    }

    .default-font-color {
        color: #4c4c4c;
    }

    .scrollbar {
        overflow: auto;
    }

        .scrollbar::-webkit-scrollbar {
            width: 5px;
        }

        .scrollbar::-webkit-scrollbar-thumb {
            background: #a2a2a2;
            border-radius: 20px;
        }

        .scrollbar::-webkit-scrollbar-track {
            background: #e1e1e1;
            border-radius: 20px;
        }

    .sub-wrap.scrollbar::-webkit-scrollbar-button:vertical:start:decrement,
    .sub-wrap.scrollbar::-webkit-scrollbar-button:vertical:start:increment {
        display: block;
        height: 15px;
        pointer-events: none;
    }

    .org-list.scrollbar::-webkit-scrollbar-button:vertical:end:decrement {
        display: block;
        width: 25px;
    }

    .d_item_wrapper {
        max-width: 25%;
        flex: 1;
        flex-basis: 25%;
        display: flex;
        justify-content: center;
        padding: 7.5px 0;
    }
}

 모바일 세로 (해상도 ~ 479px)
@media all and (max-width: 479px) {
    .org-title {
        display: flex;
        align-items: center;
        gap: 0.5rem;
        padding: 0px 10px;
    }

    .org-title-icon {
        width: var(--xlg-font);
        height: var(--xlg-font);
        display: flex;
        justify-content: center;
        align-items: center;
    }

        .org-title-icon svg {
            width: var(--xlg-font);
            height: var(--xlg-font);
            display: flex;
            justify-content: center;
            align-items: center;
        }

    .sub-container {
        margin: 40px 10px 0px;
    }

    .main {
        padding: 30px 15px 16px;
    }

    .main-area {
        margin-bottom: 7.5px;
    }

    .organized {
        padding: 16px 15px;
    }

    .approval {
        padding: 16px 15px;
    }

    .settlement {
        padding: 16px 15px;
    }

    .sub-area {
        display: flex;
        flex-wrap: wrap;
        
    }

    .default-table td {
        margin-right: 20px;
        padding: 0px 10px;
    }

    .default-font-color {
        color: #4c4c4c;
    }

    .scrollbar {
        overflow: auto;
    }

        .scrollbar::-webkit-scrollbar {
            width: 5px;
        }

        .scrollbar::-webkit-scrollbar-thumb {
            background: #a2a2a2;
            border-radius: 20px;
        }

        .scrollbar::-webkit-scrollbar-track {
            background: #e1e1e1;
            border-radius: 20px;
        }

    .sub-wrap.scrollbar::-webkit-scrollbar-button:vertical:start:decrement,
    .sub-wrap.scrollbar::-webkit-scrollbar-button:vertical:start:increment {
        display: block;
        height: 15px;
        pointer-events: none;
    }

    .org-list.scrollbar::-webkit-scrollbar-button:vertical:end:decrement {
        display: block;
        width: 25px;
    }

    .d_item_wrapper {
        max-width: 25%;
        flex: 1;
        flex-basis: 25%;
        display: flex;
        justify-content: center;
        padding:7.5px 0;
    }
    .menu-btn {
        cursor: pointer;
    }
}
*/