/* green2024.css */

/******************************/
/* Custom Alert Styles (alert.css) */
/******************************/
#customAlertOverlay {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-color: rgba(0, 0, 0, 0.5);
    display: none; 
    z-index: 20000;
}

#customAlertBox {
    position: absolute;
    top: 50%;
    left: 50%;
    width: 300px;
    padding: 20px;
    background-color: #fff;
    border-radius: 8px;
    box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
    transform: translate(-50%, -50%);
    text-align: center;
    z-index: 2001;
}

#customAlertTitle {
    background-color: #f0f0f0;
    border-bottom: 2px solid green;
    padding: 10px;
    font-size: 18px;
    font-weight: bold;
    margin-bottom: 20px;
}

#customAlertMessage {
    margin-bottom: 20px;
}

#customAlertFooter {
    background-color: #f0f0f0;
    border-top: 2px solid green;
    padding: 10px;
    text-align: center;
}

#customAlertButton {
    padding: 10px 20px;
    background-color: #007bff;
    color: #fff;
    border: none;
    border-radius: 5px;
    cursor: pointer;
    margin-top: 10px;
}

    #customAlertButton:hover {
        background-color: #0056b3;
    }

/******************************/
/* Navbar Menu Styles (myMenu.css) */
/******************************/
@import url('https://fonts.googleapis.com/css?family=Lato:300,400');

html, body {
    font-family: Verdana, sans-serif, helvetica, meiryo, gulim;
}

.navbar-default {
    font-size: 0.9em;
    font-weight: bold;
    background-color: #006b96;
    padding: 1px;
    border: 0px;
    border-radius: 30px;
}

    .navbar-default .navbar-nav > li > a {
        color: white;
    }

        .navbar-default .navbar-nav > li > a:hover {
            color: #cbf0ff;
        }

    .navbar-default .navbar-brand {
        color: #002433;
    }

        .navbar-default .navbar-brand:hover {
            color: #ffffff;
            text-shadow: 1px -1px 8px #b3e9ff;
        }

    .navbar-default .navbar-nav > .open > a,
    .navbar-default .navbar-nav > .open > a:hover,
    .navbar-default .navbar-nav > .open > a:focus {
        background-color: #004059;
        color: white;
    }

    .navbar-default .navbar-toggle {
        border: none;
    }

    .navbar-default .navbar-collapse,
    .navbar-default .navbar-form {
        border: none;
    }

    .navbar-default .navbar-toggle:hover,
    .navbar-default .navbar-toggle:focus {
        background-color: #002433;
    }

    .navbar-default .navbar-toggle .icon-bar {
        background-color: #ffffff;
    }

.dropdown-menu {
    background-color: #004059;
    font-size: 0.9em;
    color: white;
    border: 0px;
    border-radius: 10px;
    padding-top: 10px;
    padding-bottom: 10px;
}

    .dropdown-menu > li > a {
        background-color: #004059;
        color: white;
    }

        .dropdown-menu > li > a:hover,
        .dropdown-menu > li > a:focus {
            background-color: #004059;
            color: white;
        }

    .dropdown-menu .divider {
        height: 1px;
        margin: 9px 0;
        overflow: hidden;
        background-color: #003246;
    }

.navbar-default .navbar-nav .open .dropdown-menu > li > a {
    color: #ffffff;
}

@media (max-width: 767px) {
    .dropdown-menu > li > a {
        background-color: #006b96;
        color: #ffffff;
    }

        .dropdown-menu > li > a:hover {
            color: #ffffff;
        }

    .navbar-default .navbar-nav .open .dropdown-menu > li > a:focus,
    .navbar-default .navbar-nav .open .dropdown-menu > li > a:hover {
        color: #ffffff;
        background-color: white;
    }

    .dropdown-menu .divider {
        height: 1px;
        margin: 9px 0;
        overflow: hidden;
        background-color: #005577;
    }
}

/******************************/
/* Active Navbar Styles (navbar.css) */
/******************************/
.active {
    border: 1px solid white;
    background-color: yellow;
}

.navbar-nav li.active > a {
    color: #fff !important;
    background-color: #f4511e !important;
    background-image: none !important;
}

@media (max-width: 768px) {
    .hide-on-mobile {
        display: none !important;
    }


    li.dropdown-toggle {
        display: none; /* 메뉴 항목 숨기기 */
    }
}
.navbar-mobile {
    display: none; /* 기본값은 숨김 */
}

/* 모바일 화면에서만 보이도록 설정 */
@media (max-width: 768px) {
    .navbar-mobile {
        display: block; /* 모바일에서 보이기 */
    }

    .navbar-pc {
        display: none; /* 모바일에서는 PC 메뉴 숨김 */
    }
}

@media (min-width: 769px) {
    .navbar-mobile {
        display: none !important;
    }
}
/* 리스트 기본 스타일 */
.navbar-mobile .dropdown-menu li a {
    display: block;
    padding: 10px 15px;
    color: #333;
    text-decoration: none;
    transition: background-color 0.3s, color 0.3s;
}

    /* Hover 시 배경색 및 텍스트 색상 */
    .navbar-mobile .dropdown-menu li a:hover {
        background-color: #f8f9fa; /* 연한 회색 */
        color: #007bff; /* 파란색 텍스트 */
    }

    /* 클릭 시 활성화 스타일 */
    .navbar-mobile .dropdown-menu li a:active {
        background-color: #e9ecef; /* 더 연한 회색 */
        color: #0056b3; /* 더 진한 파란색 */
        font-weight: bold;
    }

/* Divider 스타일 (구분선) */
.navbar-mobile .dropdown-menu .divider {
    height: 1px;
    margin: 5px 0;
    background-color: #dee2e6; /* 연한 회색 */
}


/******************************/
/* loader Css */
/******************************/
.loader {
    position: fixed;
    left: 0px;
    top: 0px;
    width: 100%;
    height: 100%;
    z-index: 9999;
    background: url('../images/loading.png') 50% 50% no-repeat rgb(249,249,249);
    opacity: .8;
}