body {
    min-height: 100vh;
    font-family: 'Noto Sans KR', 'Noto Serif KR', 'Malgun Gothic', '맑은 고딕', sans-serif;
    font-style: normal;
    display: flex;
    flex-direction: column;
    color: #000;
}
.table {
    color: #000;
}
.my-link {
    text-decoration: none;
}
.noto-sans-kr-go { /*고딕*/
    font-family: "Noto Sans KR", sans-serif;
    font-optical-sizing: auto;
    font-weight: 400;
    font-style: normal;
}
.noto-serif-kr-my { /*명조*/
    font-family: "Noto Serif KR", serif;
    font-optical-sizing: auto;
    font-weight: 700;
    font-style: normal;
}

.container-fluid {
    padding-left: 1.5rem;
    padding-right: 1.5rem;
}


form.user .form-control-input {
	font-size: .8rem;
	border-radius: .8rem;
	padding: 1.5rem 1rem;
}

form.user .btn-input {
    font-size: .8rem;
    border-radius: 0.8rem;
    padding: .75rem 1rem;
}

.alert-red {
	color: red;
}

@media (max-width: 600px) {
	.dashboard-img {
		width: 64px !important;
		height: 64px !important;
	}
	.dashboard-text {
		white-space: nowrap;
		font-size: 16px;
	}
}

/* mylink css */
.address-text {
    font-size: 0.95em;
    color: #555;
    margin-top: 2px;
    min-height: 24px; /* 주소가 없어도 높이 확보 */
}
@media (max-width: 767.98px) {
    .address-text { min-height: 20px; }
    /* 모바일텍스트크기 */
    .m-text13 {
        font-size: 1.3rem !important;
    }
}

/* 토글 스위치 크기 키우기 및 정렬 개선 */
.custom-switch.custom-switch-lg .custom-control-label::before,
.custom-switch.custom-switch-lg .custom-control-label::after {
    top: 0rem;
    left: -2.8rem;
    width: 4.0rem;
    height: 2.0rem;
    border-radius: 15px;
}
.custom-switch.custom-switch-lg .custom-control-label::after {
    width: 1.6rem;
    height: 1.8rem;
    top: 0.18rem;
    left: -2.5rem;
}

/* ON 상태에서 after 위치 조정 */
.custom-switch.custom-switch-lg .custom-control-input:checked ~ .custom-control-label::after {
    left: -1.5rem; /* ON 위치 */
}

.custom-switch.custom-switch-lg .custom-control-label {
    padding-left: 3.1rem !important;
    font-size: 2.2em;
    /*min-height: 2.3rem;*/
}

.custom-control-input:checked~.custom-control-label::before {
    color: #fff;
    border-color: #4cd964;
    background-color: #4cd964;
}

.site-item.active {
    background: #007bff;
    color: #fff;
}
.site-item {
    padding: 0.5rem 1rem;
}
.selected-label {
    font-size: 0.95em;
    color: #555;
}
.selected-sites .badge {
    font-size: 1em;
}

/* footer logo / top logo */
.logo {
    margin-left: auto;
    margin-right: auto;
    display: block;
    /*width: fit-content;*/
    cursor: pointer;
}
.logo-bottom-img {
    width: 120px; height: auto;
}
.copy-footer {
    padding: 10px;
}

.logo-top-color {
    background-color: #000;
}

/* link */
.link-card {
    background: #fff;
    border-radius: 0.5rem;
    /*margin-bottom: 0.5rem;*/
}
/* toggle */
.toggle-container {
    display: inline-block;
    width: 60px;
    height: 25px;
    background-color: #ccc;
    border-radius: 15px;
    position: relative;
    cursor: pointer;
    transition: background-color 0.3s;
}

.toggle-container.on {
    background-color: #4c90d9;
}

.toggle-button {
    width: 20px;
    height: 20px;
    background-color: white;
    border-radius: 50%;
    position: absolute;
    top: 2px;
    left: 2px;
    transition: left 0.3s;
}

.toggle-container.on .toggle-button {
    left: 32px;
}

/* customer */
.call-card {
    background: #fff;
    border-radius: 0.5rem;
    /*margin-bottom: 0.5rem;*/
    box-shadow: 0 1px 2px rgba(0,0,0,0.03);
}

.nav-tabs-wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}




.nav-tabs-wrapper {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
}

/* Webkit 기반 브라우저 (Chrome, Safari, Edge, Opera) */
.nav-tabs-wrapper::-webkit-scrollbar {
    display: none;
}

/* Firefox */
.nav-tabs-wrapper {
    scrollbar-width: none;
}

/* sidebar */
@media (max-width: 768px) {
    #accordionSidebar {
        position: fixed;
        top: 0;
        left: 0;
        width: 50vw;
        min-width: 220px;
        max-width: 400px;
        height: 100vh;
        z-index: 1050;
        background: #dc3545;
        box-shadow: 2px 0 8px rgba(0,0,0,0.15);
        transform: translateX(-100%);
        transition: transform 0.3s;
        border-top-right-radius: 0.75rem;
        border-bottom-right-radius: 0.75rem;
        overflow-y: auto;
        display: block;
    }
    #accordionSidebar.active {
        transform: translateX(0);
    }

    .sidebar-overlay {
        display: none; /* 기본 숨김 */
        position: fixed;
        top: 0; left: 0;
        width: 100vw;
        height: 100vh;
        background-color: rgba(0, 0, 0, 0.35); /* 어두운 반투명 배경 */
        z-index: 1040; /* 사이드바보다는 낮은 숫자 */
        transition: opacity 0.3s ease;
    }

    .sidebar-overlay.active {
        display: block;
        opacity: 1;
    }


    .sidebar .nav-item .nav-link span {
        font-size: 1.0rem;
        display: inline;
        color: #fff;
    }


    .sidebar .sidebar-heading {
        text-align: left;
        padding: 0 1rem;
        font-weight: 800;
        font-size: .75rem;
        color: #fff;
    }

    .sidebar .nav-item .nav-link {
        text-align: left;
        padding: .75rem 1rem;
        width: 13.5rem;
    }

   .sidebar-dark .nav-item .nav-link i  {
        /*color: #fff;*/
       color: rgba(255,255,255,.9)!important;
   }
}

.sidebar .sidebar-heading {
    color: #fff;
    font-size: .9rem;
}
.sidebar-dark .nav-item .nav-link i {
    color: #fff;
}
.sidebar .nav-item .nav-link span {
    color: #fff;
    font-size: .9rem;
}

.sidebar-dark .nav-item .nav-link {
    padding-left: 2rem;
}

.font-size-24 {
    font-size: 24px !important;
}

.sidebar .nav-item .nav-link .img-profile, .topbar .nav-item .nav-link .img-profile {
    height: 2.5rem;
    width: 2.5rem;
}

.btn-link {

    color: #fff;
}

    /* sidebar */

/* search bar */
.card-ext {
    background-color: transparent;
    border: 0 solid #fff;
}
.card-body-ext {
    padding: 0rem;
}

.card-body-ext-1 {
    padding: 1rem;
}
/* search bar */
.col-color-odd {
    background-color: #fff;
}
/* search bar */

/* footer */
footer.sticky-footer {
    padding: 0.2rem 0;
    padding-top: 1.2rem;
}
/* footer */


.dragElem {
    opacity: 0.6;
    z-index: 1000;
    position: relative;
}
.over {
    border: 2px dashed #007bff;
    z-index: 999;
}


@media (max-width: 767.98px) {
    .card {
        border: none;
        background-color: transparent;
    }
    .bg-light {
        background-color: #fff !important;
    }
}

/* mobile footer */
/* 푸터 네비게이션 기본 스타일 */
.footer-nav {
    position: fixed;
    left: 0; right: 0; bottom: 0;
    z-index: 1030;
    width: 100%;
    background: #ff5722;
    box-shadow: 0 -8px 32px rgba(60,80,140,0.10), 0 -2px 8px rgba(80,120,220,0.08);
    border-top-left-radius: 2rem;
    border-top-right-radius: 2rem;
    padding: 0.5rem 0 0.2rem 0;
    transition: box-shadow 0.2s;
}

.footer-nav ul {
    display: flex;
    flex-direction: row;
    justify-content: space-around;
    align-items: flex-end;
    width: 100%;
    margin: 0;
    padding: 0;
    list-style: none;
}

.footer-nav ul > li {
    flex: 1 1 0;
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 0;
}

.footer-nav .nav-link {
    color: #888;
    font-size: 1.0rem;
    padding: 0.15rem 0 0.1rem 0;
    border-radius: 1.2rem;
    transition: background 0.18s, color 0.18s;
    display: flex;
    flex-direction: column;
    align-items: center;
    min-width: 0;
    background: none !important;
    text-decoration: none;
    outline: none !important;
}

.footer-icon {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 54px;
    height: 54px;
    margin-bottom: 2px;
    border-radius: 50%;
    background: linear-gradient(135deg, #f3f6fa 60%, #eaf1ff 100%);
    box-shadow: 0 2px 10px rgba(80,120,220,0.11);
    transition: background 0.18s, box-shadow 0.18s;
    position: relative;
}

.footer-img-icon {
    width: 36px;
    height: 36px;
    object-fit: contain;
    display: block;
    margin: 0 auto;
    filter:
            drop-shadow(0 0 2px #fff)
            drop-shadow(0 2px 8px #5a7cff33)
            brightness(1.3)
            contrast(1.2);
    transition: filter 0.18s;
}

/* 활성 메뉴: 검정 그라데이션, 아이콘 흰색 효과 */
.footer-nav .nav-link.active .footer-icon,
.footer-nav .nav-link:focus .footer-icon,
.footer-nav .nav-link:hover .footer-icon {
    background: linear-gradient(135deg, #333 60%, #aaa 100%) !important;
    box-shadow: 0 4px 18px rgba(40,40,40,0.22);
    animation: bounce 0.3s;
}

.footer-nav .nav-link.active .footer-img-icon,
.footer-nav .nav-link:focus .footer-img-icon,
.footer-nav .nav-link:hover .footer-img-icon {
    filter: brightness(0) invert(1) drop-shadow(0 0 4px #fff);
}

@keyframes bounce {
    0%   { transform: scale(1);}
    30%  { transform: scale(1.18);}
    60%  { transform: scale(0.95);}
    100% { transform: scale(1);}
}

.footer-label {
    font-size: .95rem;
    margin-top: 3px;
    color: #fff;
    letter-spacing: -0.5px;
    transition: color 0.18s, font-weight 0.18s;
    font-weight: 500;
    white-space: nowrap;
    text-overflow: ellipsis;
    overflow: hidden;
    max-width: 60px;
    margin-left: auto;
    margin-right: auto;
}

.footer-nav .nav-link.active .footer-label,
.footer-nav .nav-link:focus .footer-label,
.footer-nav .nav-link:hover .footer-label {
    color: #222;
    font-weight: 700;
}

@media (min-width: 768px) {
    .footer-nav { display: none !important; }
}
@media (max-width: 767.98px) {
    body { padding-bottom: 100px; }
}




/* mobile footer */

.btn-dark-custom {
    background-color: #594343;
    border-color: #594343;
    color: #fff;
}
.btn-daboda-custom {
    background-color: #ff5722;
    color: #fff;
    border-color: #fd5722;
}


label {
    font-weight: 500;
}

.dropdown-divider { border-top: 2px solid #e9ecef; }

.dropdown-item {
    padding: 0 0;
}

.dropdown-item2 {
    padding: .25rem 1.6rem !important;
}

.my-icon {
    color: #3498db; /* 원하는 색상 코드 */
}
.my-icon2 {
    color: #e81717; /* 원하는 색상 코드 */
}
.my-icon-size {
    font-size: 1rem;
}

@media (max-width: 600px) {
    .custom-mobile-dropdown {
        width: 40vw !important;
        max-width: 320px !important;
        min-width: unset !important;
        max-height: 300px !important;
        overflow-y: auto;
        padding: .5rem 0 !important;
        box-shadow: 0 8px 32px rgba(0,0,0,0.18);
        border-radius: 12px !important;
    }
}

.long-title {
    word-break: break-word;
    overflow-wrap: break-word;
    white-space: normal;
}

.h4 {
    font-size: 1.3rem;
    font-weight: 500;
    /*border-bottom: 2px solid #333; !* 원하는 색상과 두께로 조절 *!*/
    /*padding-bottom: 0.5rem;           !* 밑줄과 텍스트 사이 간격 *!*/
    /*margin-bottom: 1rem;              !* 밑줄과 아래 요소 간격 *!*/
}

.h5 {
    font-size: 1.1rem;
    font-weight: 700;
}


/* 마이링트 위아래버튼 */
.move-up-btn, .move-down-btn {
    margin: 4px 1px;
}


/* 맨위/맨아래 버튼 색상 변경 */
.move-top-btn {
    background: linear-gradient(135deg, #ffd700 0%, #ffec8b 100%) !important;
}
.move-bottom-btn {
    background: linear-gradient(135deg, #87CEFA 0%, #b0e0e6 100%) !important;
}

/* 아이콘 크기 조절 */
/*.move-top-btn i,*/
/*.move-bottom-btn i {*/
/*    font-size: 0.9rem;*/
/*    margin: 4px 1px;*/
/*}*/



.btn-arrow.btn-icon {
    background: none;
    border: none;
    box-shadow: none;
    padding: 0 4px;
    border-radius: 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    color: #495057; /* 원하는 색상 */
    font-size: 1.25rem; /* 아이콘 크기 */
    transition: color 0.15s;
}

.btn-arrow:hover,
.btn-arrow:focus,
.btn-arrow:active {
    color: #495057;
    background: none;
    box-shadow: none;
    outline: none;
}

/* 카드 선택 표시 */
.link-card.selected {
    background-color: rgba(0, 123, 255, 0.12); /* 연한 파란색 */
    border-color: #007bff;
}


/*.btn-arrow.btn-icon:focus,*/
/*.btn-arrow.btn-icon:active {*/
/*    !*outline: none;*!*/
/*    color: #007bff;*/
/*    background: none;*/
/*    box-shadow: none;*/
/*}*/

/*.btn-arrow.btn-icon:hover {*/
/*    color: #0056b3;*/
/*    background: none;*/
/*    box-shadow: none;*/
/*}*/

.btn-arrow i {
    color: #495057;
    transition: color 0.15s;
}

/*.btn-arrow:hover i,*/
/*.btn-arrow:focus i,*/
/*.btn-arrow:active i {*/
/*    color: #007bff;*/
/*}*/

/*.btn-arrow:focus {*/
/*    outline: 2px solid #007bff !important;*/
/*}*/
/* 마이링크 위아래버튼*/


/* font */
.h7 {
    font-size: 0.9rem;
    padding: 0.2rem 0;
}
/* font */

/* 회원관리 버튼 */
.custom-plus-btn {
    background: #fff;
    /*border: 1.5px dotted #b0b0b0;   !* 회색 점선 테두리 *!*/
    border-radius: 6px;
    padding: 2px 7px 2px 7px;
    min-width: 28px;
    min-height: 28px;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    box-shadow: none;
}

.custom-plus-btn i {
    color: #b0b0b0; /* 회색 아이콘 */
    font-size: 1.1em;
}

.custom-plus-btn:active,
.custom-plus-btn:focus {
    border-color: #007bff;      /* 클릭/포커스 시 테두리 색상 */
    background: #f0f8ff;        /* 클릭/포커스 시 배경색 */
}
.custom-plus-btn:active i,
.custom-plus-btn:focus i {
    color: #007bff;             /* 클릭/포커스 시 아이콘 색상 */
}


.badge-owner { background: #2c3e50; color: #fff;}
.badge-head { background: #2980b9; color: #fff;}
.badge-leader { background: #27ae60; color: #fff;}
.badge-staff { background: #f1c40f; color: #fff; }
.badge-member { background: #95a5a6; color: #fff;}

.tree-row {
    border-bottom: 1px solid #f1f3f5;
    padding: 0.75rem 0.5rem;
    background: #fff;
    display: flex;
    align-items: center;
    font-size: 1rem;
}
.tree-item .tree-row:last-child {
    border-bottom: none;
}
@media (min-width: 768px) {
    .tree-list {
        border: 1px solid #dee2e6;
        border-radius: 0.25rem;
        background: #fff;
    }
    .tree-item.member .tree-row {
        background: #f8f9fa;
    }
}
@media (max-width: 767.98px) {
    .tree-list {
        border: none;
        border-radius: 0;
        background: #fff;
    }
    .tree-row {
        /* flex-direction: column;  <= 사용하지 않음 */
        /* align-items: flex-start; <= 사용하지 않음 */
        font-size: 0.98rem;
        border: none;
        border-radius: 0;
        margin-bottom: 0;
        background: #fff;
        padding: 0.5rem 0.5rem;
        display: flex;
        align-items: center;
    }
    .tree-row > * {
        margin-bottom: 0;
    }
    .tree-row button.btn-danger {
        align-self: auto;
        margin-top: 0;
    }
}

/* 회원관리 버튼 */

/* 모바일사이드바 배경식 */
@media (max-width: 768px) {
    #accordionSidebar {
        background: #ff5722;
    }
}

/* 사이드바구분선 */
.sidebar-dark hr.sidebar-divider {
    border-top: 1px solid rgba(255, 255, 255, 0.35) !important;
}

/* 웹사이드바 배경색*/
.bg-gradient-danger {
    background-color: #ff5722;
    background-image: linear-gradient(180deg, #ff5722 10%, #c63d0f 100%);
    background-size: cover;
}

/* topbar 고정 */
@media (max-width: 768px) {
    #wrapper, #content-wrapper, #content {
        overflow: visible !important;
    }
    .topbar {
        position: sticky !important;
        top: 0;
        z-index: 1040;
    }
}
/* topbar 고정 */

/* 콜문의관리 히스토리 */
.history-list .card {
    border-radius: 10px;
    box-shadow: 0 2px 8px rgba(0,0,0,0.03);
    border: 1px solid #ddd;
}
.history-list .card-header {
    font-size: 1.08rem;
    font-weight: bold;
    border-radius: 10px 10px 0 0;
}
.history-list .font-weight-bold {
    color: #222;
}

.clsMessage {
    color: red;
}
/* 콜문의관리 히스토리 */

/* 사이드바메뉴 간격조정*/
.sidebar hr.sidebar-divider {
    margin: .5rem 1rem 1rem;
}

@media (min-width: 768px) {
    .sidebar .nav-item .nav-link {
         padding: 0;
     }
}
.sidebar .nav-item .nav-link {
    padding: .75rem 2rem;
}

.bg-daboda {
    background: #ff5722 !important;
}


@media (min-width: 768px) {
    .sidebar.toggled {
         overflow: hidden;
         width: 0 !important;
    }
}

@media (min-width: 768px) {
    #accordionSidebar {
        position: fixed;
        top: 0;
        left: 0;
        width: 250px;
        height: 100vh;          /* 화면 높이 꽉 채움 */
        overflow-y: auto;       /* 세로 스크롤바 활성화 */
        background: #ff5722;
        box-shadow: 2px 0 8px rgba(0,0,0,0.15);
        transition: transform 0.3s ease;
        border-top-right-radius: 0.75rem;
        border-bottom-right-radius: 0.75rem;
        z-index: 1050;
    }

    #accordionSidebar.active {
        transform: translateX(0);
    }

    .sidebar-overlay {
        position: fixed;
        top: 0; left: 0;
        width: 100vw; height: 100vh;
        background-color: rgba(0,0,0,0.35);
        z-index: 1040;
        opacity: 0;
        visibility: hidden;
        transition: opacity 0.3s ease, visibility 0.3s ease;
    }

    .sidebar-overlay.active {
        opacity: 1;
        visibility: visible;
    }
}