

/* 에러 페이지 */
.error-common-page{width: 100%; text-align: center; padding: 30px 20px 50px;}
.error-common-page .inner{margin-top: 240px;}
.error-common-page h2{font-size: 155px; color: #293042; font-weight: 900; line-height: 1;}
.error-common-page .middle-row{display: flex; flex-wrap: wrap; gap: 0; align-items: center; justify-content: center;}
.error-common-page .sub-tit{font-size: 23px; font-weight: 700; color: #293042; margin: 0;}
.error-common-page .gif-box{width: 60px; height: 60px; margin-right: -60px;}
.error-common-page .gif-box img{width: 100%;}
.error-common-page .gif-box.lock{width: 35px; vertical-align: middle; margin-right: -40px; align-content: center; margin-left: 5px;}
.error-common-page .desc{font-size: 14px; color: #aaa; margin-top: 5px;}
.error-common-page .btn-box{margin-top: 25px; text-align: center;}
.error-common-page .btn-error{height: 38px; min-width: 130px; text-align: center; border-radius: 5px; background-color: #C82D43; font-size: 15px; font-weight: 600; color: #fff; padding: 5px 20px; border: none; transition: .25s; box-shadow: 0 4px 10px rgba(200, 45, 67, 0.35);}
.error-common-page .btn-error:hover,
.error-common-page .btn-error:focus{background-color: #9f1b2e;}

.error-common-page .lock-screen-title{position: relative; margin-bottom: 40px;}
.error-common-page .lock-screen-title .tit{font-size: 155px; font-weight: 900; color: #D7DCE2; line-height: 1.1; word-break: break-all;}
.error-common-page .lock-screen-title .tit br{display: none;}
.error-common-page .lock-screen-title .blur{position: absolute; z-index: 10; left: 0; bottom: -6px; width: 100%; height: 66px;  background-color: rgba(255, 255, 255, .2); backdrop-filter: blur(10px);}


@media all and (max-width: 1000px){
    .error-common-page{padding: 20px 20px 50px;}
    .error-common-page .inner{margin-top: 150px;}
    .error-common-page h2{font-size: 80px;}
    .error-common-page .sub-tit{font-size: 18px;}
    .error-common-page .gif-box{width: 45px; height: 45px; margin-right: -45px;}
    .error-common-page .desc{font-size: 12px;}
    .error-common-page .btn-box{margin-top: 20px;}

    .error-common-page .lock-screen-title{margin-bottom: 20px;}
    .error-common-page .lock-screen-title .tit{font-size: 50px; font-weight: 900; color: #D7DCE2; line-height: 1.1; word-break: break-all; line-height: 1;}
    .error-common-page .lock-screen-title .tit br{display: block;}
    .error-common-page .lock-screen-title .blur{height: 25px; bottom: -6px;}
}



/* 로그인 페이지 */
.login-common-page{width: 100%; height: 100vh; overflow: auto; display: flex; align-items: center; justify-content: center; padding: 30px; background-color: #293042;}

.login-common-page .inner{width: 100%; max-width: 520px; flex-shrink: 0; margin: auto;}

.login-common-page .login-form{background-color: white; border-radius: 12px; padding: 60px;}

.login-common-page .logo{text-align: center;}
.login-common-page .sub-text{text-align: center; color: #475569; font-size: 14px; margin-top: 10px;}
.login-common-page .mgtlg{margin-top: 32px;}

.login-common-page .input-row{width: 100%; margin-bottom: 15px;}
.login-common-page .input-row .form-control{height: 42px; padding: 0 15px; font-size: 14px; font-weight: 400; color: #111;}
.login-common-page .input-row .form-control::placeholder{color: #8B95A1; font-weight: 300;}

.login-common-page .form-control:focus {border-color: #777; box-shadow: 0 0 0 0.2rem rgba(0, 0, 0, 0.1);}

.login-common-page .form-check-label{padding-left: 18px; align-content: center; font-size: 14px; color: #6B7684;}
.login-common-page .form-check-label input::after{background-color: white; border: 1px solid #6B7684;}
.login-common-page .form-check-label input:checked::after{background-color: #284ddd; border: 1px solid transparent;}
.login-common-page .form-check-label:has(input:checked){font-weight: 700;}


.login-common-page .btn-login{width: 100%; height: 42px; border-radius: 8px; width: 100%; font-size: 14px; font-weight: 600; color: white; border: none; transition: .25s; background-color: #C82D43; margin-top: 20px;}
.login-common-page .btn-login:where(:hover, :focus){background-color: #8d1527;}

.login-common-page .a-btn-box{display: flex; flex-wrap: wrap; gap: 5px; align-items: center; justify-content: center; margin-top: 25px;}
.login-common-page .a-btn-box > a{font-size: 15px; color: #6B7684;}
.login-common-page .a-btn-box .red{color: #c82d43;}
.login-common-page .a-btn-box > a:where(:hover, :focus){text-decoration: underline;}
.login-common-page .a-btn-box .dots{width: 3px; height: 3px; display: block; border-radius: 50%; background-color: #6B7684; margin: 0 4px;}

.login-common-page .bt-desc{font-size: 14px; color: rgba(255, 255, 255, .5); margin-top: 25px; text-align: center;}

.login-pop-message{text-align: center; margin: 20px 0;}
.login-pop-message .ic-bang-yellow{width: 30px; height: 30px; margin: 0 auto 10px; background-repeat: no-repeat; background-position: center center; background-size: 100%; background-image: url("data:image/svg+xml,%3Csvg width='31' height='31' viewBox='0 0 31 31' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15.3136 0C19.375 0 23.2701 1.61339 26.1419 4.48525C29.0138 7.3571 30.6272 11.2522 30.6272 15.3136C30.6272 19.375 29.0138 23.2701 26.1419 26.1419C23.2701 29.0138 19.375 30.6272 15.3136 30.6272C11.2522 30.6272 7.3571 29.0138 4.48525 26.1419C1.61339 23.2701 0 19.375 0 15.3136C0 11.2522 1.61339 7.3571 4.48525 4.48525C7.3571 1.61339 11.2522 0 15.3136 0ZM17.6105 9.40187C18.748 9.40187 19.6711 8.61219 19.6711 7.44187C19.6711 6.27156 18.7458 5.48188 17.6105 5.48188C16.473 5.48188 15.5542 6.27156 15.5542 7.44187C15.5542 8.61219 16.473 9.40187 17.6105 9.40187ZM18.0108 21.7109C18.0108 21.4769 18.0917 20.8687 18.0458 20.5231L16.2477 22.5925C15.8758 22.9841 15.4098 23.2553 15.1911 23.1831C15.0918 23.1466 15.0089 23.0759 14.9572 22.9836C14.9054 22.8914 14.8883 22.7837 14.9089 22.68L17.9058 13.2125C18.1508 12.0116 17.477 10.9156 16.0486 10.7756C14.5414 10.7756 12.3233 12.3047 10.9736 14.245C10.9736 14.4769 10.9298 15.0544 10.9758 15.4L12.7717 13.3284C13.1436 12.9412 13.5767 12.6678 13.7955 12.7422C13.9032 12.7809 13.9916 12.8603 14.0415 12.9633C14.0913 13.0664 14.0988 13.1849 14.0623 13.2934L11.0917 22.715C10.7483 23.8175 11.398 24.8981 12.973 25.1431C15.2917 25.1431 16.6611 23.6513 18.013 21.7109H18.0108Z' fill='%23FF9D00'/%3E%3C/svg%3E%0A");}
.login-pop-message .bolder{font-size: 16px; color: #1E293B; line-height: 1.5; font-weight: 500; margin-bottom: 10px;}
.login-pop-message .desc{font-size: 14px; color: #666; line-height: 1.5;}

.pwd-icon{display: inline-block; vertical-align: middle; width: 20px; height: 20px; background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_2239_35467' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='24' height='24'%3E%3Crect width='24' height='24' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_2239_35467)'%3E%3Cpath d='M12 16C13.25 16 14.3125 15.5625 15.1875 14.6875C16.0625 13.8125 16.5 12.75 16.5 11.5C16.5 10.25 16.0625 9.1875 15.1875 8.3125C14.3125 7.4375 13.25 7 12 7C10.75 7 9.6875 7.4375 8.8125 8.3125C7.9375 9.1875 7.5 10.25 7.5 11.5C7.5 12.75 7.9375 13.8125 8.8125 14.6875C9.6875 15.5625 10.75 16 12 16ZM12 14.2C11.25 14.2 10.6125 13.9375 10.0875 13.4125C9.5625 12.8875 9.3 12.25 9.3 11.5C9.3 10.75 9.5625 10.1125 10.0875 9.5875C10.6125 9.0625 11.25 8.8 12 8.8C12.75 8.8 13.3875 9.0625 13.9125 9.5875C14.4375 10.1125 14.7 10.75 14.7 11.5C14.7 12.25 14.4375 12.8875 13.9125 13.4125C13.3875 13.9375 12.75 14.2 12 14.2ZM12 19C9.56667 19 7.35 18.3208 5.35 16.9625C3.35 15.6042 1.9 13.7833 1 11.5C1.9 9.21667 3.35 7.39583 5.35 6.0375C7.35 4.67917 9.56667 4 12 4C14.4333 4 16.65 4.67917 18.65 6.0375C20.65 7.39583 22.1 9.21667 23 11.5C22.1 13.7833 20.65 15.6042 18.65 16.9625C16.65 18.3208 14.4333 19 12 19ZM12 17C13.8833 17 15.6125 16.5042 17.1875 15.5125C18.7625 14.5208 19.9667 13.1833 20.8 11.5C19.9667 9.81667 18.7625 8.47917 17.1875 7.4875C15.6125 6.49583 13.8833 6 12 6C10.1167 6 8.3875 6.49583 6.8125 7.4875C5.2375 8.47917 4.03333 9.81667 3.2 11.5C4.03333 13.1833 5.2375 14.5208 6.8125 15.5125C8.3875 16.5042 10.1167 17 12 17Z' fill='%23666'/%3E%3C/g%3E%3C/svg%3E%0A"); background-repeat: no-repeat; background-position: center center; background-size: 100%;}
.pwd-icon.active{background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cmask id='mask0_2239_35461' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='24' height='24'%3E%3Crect width='24' height='24' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_2239_35461)'%3E%3Cpath d='M16.1 13.2969L14.65 11.8469C14.8 11.0635 14.575 10.3302 13.975 9.64688C13.375 8.96354 12.6 8.69688 11.65 8.84688L10.2 7.39688C10.4833 7.26354 10.7708 7.16354 11.0625 7.09688C11.3542 7.03021 11.6667 6.99688 12 6.99688C13.25 6.99688 14.3125 7.43438 15.1875 8.30938C16.0625 9.18438 16.5 10.2469 16.5 11.4969C16.5 11.8302 16.4667 12.1427 16.4 12.4344C16.3333 12.726 16.2333 13.0135 16.1 13.2969ZM19.3 16.4469L17.85 15.0469C18.4833 14.5635 19.0458 14.0344 19.5375 13.4594C20.0292 12.8844 20.45 12.2302 20.8 11.4969C19.9667 9.81354 18.7708 8.47604 17.2125 7.48438C15.6542 6.49271 13.9167 5.99688 12 5.99688C11.5167 5.99688 11.0417 6.03021 10.575 6.09688C10.1083 6.16354 9.65 6.26354 9.2 6.39688L7.65 4.84688C8.33333 4.56354 9.03333 4.35104 9.75 4.20938C10.4667 4.06771 11.2167 3.99688 12 3.99688C14.5167 3.99688 16.7583 4.69271 18.725 6.08438C20.6917 7.47604 22.1167 9.28021 23 11.4969C22.6167 12.4802 22.1125 13.3927 21.4875 14.2344C20.8625 15.076 20.1333 15.8135 19.3 16.4469ZM19.8 22.5969L15.6 18.4469C15.0167 18.6302 14.4292 18.7677 13.8375 18.8594C13.2458 18.951 12.6333 18.9969 12 18.9969C9.48333 18.9969 7.24167 18.301 5.275 16.9094C3.30833 15.5177 1.88333 13.7135 1 11.4969C1.35 10.6135 1.79167 9.79271 2.325 9.03438C2.85833 8.27604 3.46667 7.59688 4.15 6.99688L1.4 4.19688L2.8 2.79688L21.2 21.1969L19.8 22.5969ZM5.55 8.39688C5.06667 8.83021 4.625 9.30521 4.225 9.82188C3.825 10.3385 3.48333 10.8969 3.2 11.4969C4.03333 13.1802 5.22917 14.5177 6.7875 15.5094C8.34583 16.501 10.0833 16.9969 12 16.9969C12.3333 16.9969 12.6583 16.976 12.975 16.9344C13.2917 16.8927 13.6167 16.8469 13.95 16.7969L13.05 15.8469C12.8667 15.8969 12.6917 15.9344 12.525 15.9594C12.3583 15.9844 12.1833 15.9969 12 15.9969C10.75 15.9969 9.6875 15.5594 8.8125 14.6844C7.9375 13.8094 7.5 12.7469 7.5 11.4969C7.5 11.3135 7.5125 11.1385 7.5375 10.9719C7.5625 10.8052 7.6 10.6302 7.65 10.4469L5.55 8.39688Z' fill='%23666'/%3E%3C/g%3E%3C/svg%3E%0A");}


@media all and (max-width: 1000px){
    .login-common-page{padding: 25px;}

    .login-common-page .login-form{padding: 45px 30px;}

    .login-common-page .logo img{width: 100%; max-width: 200px;}
    .login-common-page .sub-text{font-size: 12px; margin-top: 5px;}
    .login-common-page .mgtlg{margin-top: 28px;}

    .login-common-page .input-row{margin-bottom: 10px;}
    .login-common-page .input-row input{font-size: 13px;}

    .login-common-page .form-check-label{font-size: 13px;}

    .login-common-page .btn-login{font-size: 13px;}

    .login-common-page .a-btn-box > a{font-size: 14px;}

    .login-common-page .bt-desc{font-size: 12px; margin-top: 20px;}
}



/* 회원가입 페이지 */
.sds-join-wrapper{width: 100%; max-width: 840px; padding: 70px 20px; margin: auto;}
.sds-join-wrapper h1{font-size: 20px; font-weight: 600; color: #3c434a; margin-bottom: 25px; padding: 0 10px;}
.sds-join-wrapper h2{font-size: 15px; font-weight: 600; color: #3c434a; margin: 0 0 20px;}
.sds-join-wrapper .card{padding: 30px;}
.sds-join-wrapper .card .form-group{gap: 5px 0;}
.sds-join-wrapper .card .form-group .col-form-label{margin-top: 4px;}
.sds-join-wrapper .card .col-sm-10 .form-group{margin-bottom: 10px;}
.sds-join-wrapper .card .col-sm-10 .row:last-of-type .form-group{margin-bottom: 0;}
.sds-join-wrapper .desc{margin-top: 50px; text-align: center; font-size: 13px; color: #8F969D;}

@media all and (max-width: 1000px){
    .sds-join-wrapper{padding: 40px 20px 50px;}
    .sds-join-wrapper .card .col-sm-10 .row:last-of-type .form-group{margin-bottom: 10px;}
}




/* 대시보드 */
.title-base-box{margin-bottom: 20px; display: flex; flex-wrap: wrap; gap: 15px 20px; align-items: center;}
.title-base-box .left-box{margin-right: auto;}
.title-base-box .right-box{margin-left: auto; }

.title-base-box h2{margin: 0; font-size: 20px; color: var(--gray-dark); font-weight: 700;}
.title-base-box .breadcrumb{margin: 0;}

.select-base{padding: 5px 20px 5px 20px; font-size: 13px; font-weight: 500; color: var(--gray-dark); border: 1px solid var(--gray-light3); border-radius: 3px; box-shadow: 0 1px 3px rgba(0, 0, 0, 0.05); background-repeat: no-repeat; background-size: 14px; background-position: left 10px center; height: 30px; vertical-align: middle;}
.select-base[class*='ic-']{padding-left: 30px; text-align: left;}
.select-base.ic-calendar{background-image: url('../images/ic-new-calendar.svg');}

.btn-refresh-normal{height: 30px; width: 38px; background-color: var(--danger); border-radius: 3px; vertical-align: middle; border: none; transition: .25s; background-repeat: no-repeat; background-position: center center;}
.btn-refresh-normal:where(:hover, :focus){background-color: var(--danger-hover);}
.btn-refresh-normal i{font-size: 17px; color: white;}


.dashboard-container .card{height: calc(100% - 25px); margin-bottom: 25px;}
@media all and (max-width: 768px){
    .dashboard-container .card{height: calc(100% - 18px); margin-bottom: 18px;}
}


.dash-count-detail{display: flex; gap: 15px; padding: 20px; align-items: center;}
.dash-count-detail p{margin: 0; line-height: 1.2; word-break: break-all;}
.dash-count-detail .cont{flex: 1;}
.dash-count-detail .number{font-size: 24px; font-weight: 700; color: var(--gray-dark); margin-bottom: 5px;}
.dash-count-detail .desc{font-size: 14px; color: var(--gray);}
.dash-count-detail .icon{flex-shrink: 0; width: 48px; height: 48px; display: flex; align-items: center; justify-content: center; border-radius: 50%; padding: 5px; background-color: rgba(200, 45, 67, .1);}


.dash-list-admin{max-height: 350px; overflow: auto;}
.dash-list-admin > li{border-bottom: 1px solid var(--gray-table-border);}
.dash-list-admin .item{display: flex; align-items: center; gap: 14px; padding: 14px 10px; font-size: 13px;}
.dash-list-admin .item .profile-box{flex-shrink: 0; width: 24px; height: 24px; border-radius: 50%; overflow: hidden; background: url('../images/img-default-profile.svg');}
.dash-list-admin .item .profile-box img{width: 100%; height: 100%; object-fit: cover; object-position: center center;}
.dash-list-admin .item .cont-box{flex: 1; min-width: 0; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}
.dash-list-admin .item .cont-box .name{color: var(--black2); font-weight: 500;}
.dash-list-admin .item .cont-box .id{color: #565B62; margin: 0 2px;}
.dash-list-admin .item .cont-box .ip{color: var(--gray);}
.dash-list-admin .item .time-box{flex-shrink: 0; max-width: 30%; overflow: hidden; white-space: nowrap; text-overflow: ellipsis;}


.dash-go-link-group{display: grid; grid-template-columns: repeat(4, 1fr); padding: 10px 0; max-width: 500px; margin: 0 auto;}
.a-dash-go-to-link{display: block; padding: 15px 5px; text-align: center; transition: .25s; border-radius: 4px;}
.a-dash-go-to-link:where(:hover, :focus){background-color: var(--light);}
.a-dash-go-to-link .tit{margin: 0; color: var(--black2); font-size: 13px; font-weight: 500;}
.a-dash-go-to-link .icon{margin-bottom: 10px; font-size: 25px; color: var(--black2);}
.a-dash-go-to-link.disabled{cursor: initial; pointer-events: none; opacity: .4;}

@media all and (max-width: 768px){
    .dash-go-link-group{grid-template-columns: repeat(2, 1fr);}
}


.dash-month-statistics-group{display: flex; gap: 40px;}

.dash-month-statistics-group .info-box{flex-shrink: 0; display: flex; flex: 1; flex-direction: column; gap: 20px; padding-left: 10px; min-width: 0;}
.dash-month-statistics-group .info-box .top-in{margin-bottom: auto; padding-top: 20px;}
.dash-month-statistics-group .info-box .bott-in{margin-top: auto;}
.dash-month-statistics-group .info-box .sbj{font-size: 14px; color: var(--gray-dark); margin-bottom: 10px;}
.dash-month-statistics-group .info-box .data{font-size: 14px; color: var(--gray);}
.dash-month-statistics-group .info-box .data strong{color: var(--gray-dark); font-weight: 700; font-size: 24px;}
.dash-month-statistics-group .info-box .data .per{margin: 0 2px 0 5px; font-weight: 700;}
.dash-month-statistics-group .info-box .data .per.red{color: var(--danger2);}
.dash-month-statistics-group .info-box .data .per.blue{color: var(--blue);}
.dash-month-statistics-group .info-box .info-dl{display: flex; align-items: center; flex-wrap: wrap; margin-bottom: 12px; gap: 10px;}
.dash-month-statistics-group .info-box .info-dl dt{flex: 1; font-weight: 400; color: var(--gray); padding-left: 20px; position: relative; padding-left: 20px;}
.dash-month-statistics-group .info-box .info-dl dt::before{content: ""; width: 5px; height: 5px; display: block; position: absolute; left: 3px; top: 7px; background-color: #3B76E1; border-radius: 50%;}
.dash-month-statistics-group .info-box .info-dl dd{margin-left: auto; margin-bottom: 0; font-size: 16px; font-weight: 600; color: var(--gray-dark);}

.dash-month-statistics-group .graph-inline-box{flex: 2.5; min-width: 0; display: block;}
.dash-month-statistics-group .graph-inline-box .g-inline-box{width: 100%; display: block; margin: 0; padding: 0; min-width: 0;}
.dash-month-statistics-group .graph-inline-box #morris-bar-chart{margin: 0; padding: 0; min-width: 0; width: 100%;}
.dash-month-statistics-group .graph-inline-box .c-box{text-align: center; margin-top: 10px; display: flex; flex-wrap: wrap; gap: 20px; justify-content: center;}

.cate-dash-tag{display: inline-flex; align-items: center; gap: 7px;}
.cate-dash-tag .squre{display: block; width: 8px; height: 8px;}
.cate-dash-tag .text{font-size: 12px; color: var(--gray-dark);}

@media all and (max-width: 1200px){
    .content-body{margin-left: 0;}
}

@media all and (max-width: 768px){
    .dash-month-statistics-group{display: block;}

    .dash-month-statistics-group .info-box{width: 100%; display: block; padding-left: 10px;}
    .dash-month-statistics-group .info-box .top-in{padding-top: 0;}
    .dash-month-statistics-group .info-box .bott-in{margin-top: auto;}
    .dash-month-statistics-group .info-box .sbj{font-size: 13px; margin-bottom: 8px;}
    .dash-month-statistics-group .info-box .data{font-size: 13px;}
    .dash-month-statistics-group .info-box .data strong{font-size: 22px;}
    .dash-month-statistics-group .info-box .info-dl{margin-bottom: 8px;}
    .dash-month-statistics-group .info-box .info-dl dd{font-size: 15px;}

    .dash-month-statistics-group .graph-inline-box{ width: 100%; margin-top: 20px;}
    .dash-month-statistics-group .graph-inline-box .g-inline-box{display: block; width: 100%;}
    .dash-month-statistics-group .graph-inline-box .c-box{gap: 15px;}
    .morris-bar-chart{width: 100%;}
    
    .content-body{margin-left: 0;}
}



.dash-circle-graph-group{display: flex; align-items: flex-start; gap: 40px;}
.dash-circle-graph-group .graph-box{flex: 1; min-width: 140px;}
.dash-circle-graph-group .info-box{flex: 1; min-width: 0; padding: 10px 0;}
.dash-circle-graph-group .info-box .result-b{text-align: right; margin-bottom: 10px;}
.dash-circle-graph-group .info-box .number{font-size: 16px; color: var(--gray-dark); line-height: 1.3; margin-bottom: 5px;}
.dash-circle-graph-group .info-box .number strong{font-size: 24px; font-weight: 700; color: var(--gray-dark);}
.dash-circle-graph-group .info-box .byte{color: var(--blue); font-size: 14px; font-weight: 700; margin-bottom: 0;}
.dash-circle-graph-group .info-box .list p{margin-bottom: 0;}
.dash-circle-graph-group .info-box .list > li{margin-bottom: 10px; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; line-height: 1.2;}
.dash-circle-graph-group .info-box .list .data{margin-left: auto; font-size: 14px; color: var(--gray);}
.dash-circle-graph-group .info-box .list .cate-dash-tag .text{font-size: 14px; margin-left: 5px;}
.dash-circle-graph-group .info-box .list > li:last-of-type{margin-bottom: 0;}

@media all and (max-width: 1500px){
    .dash-circle-graph-group{display: flex; flex-wrap: wrap; gap: 10px;}
    .dash-circle-graph-group .graph-box{flex: 1 0 100%; min-width: 0;}
    .dash-circle-graph-group .info-box{flex: 1 0 100%; min-width: 0;}
    .dash-circle-graph-group .info-box .number{font-size: 15px;}
    .dash-circle-graph-group .info-box .number strong{font-size: 22px;}
    .dash-circle-graph-group .info-box .byte{font-size: 13px;}
    .dash-circle-graph-group .info-box .list > li{margin-bottom: 8px;}
    .dash-circle-graph-group .info-box .list .data{font-size: 13px;}
    .dash-circle-graph-group .info-box .list .cate-dash-tag .text{font-size: 13px;}
}


.card-body:has(.dash-server-graph-group){padding: 0;}
.dash-server-graph-group{display: flex; }
.dash-server-graph-group .cols{flex: 1; min-width: 0; border-right: 1px solid var(--gray-light3); position: relative;}
.dash-server-graph-group .cols:last-of-type{border-right: none;}
.dash-server-graph-group .name{position: absolute; z-index: 5; left: 20px; top: 20px; font-size: 14px; color: var(--gray);}

.dash-server-graph-group .graph-box{height: 150px; position: relative; padding: 20px 20px;}
.dash-server-graph-group .gauge-info-box{position: absolute; z-index: 5; left: 0; top: 0; width: 100%; height: 100%; text-align: center; display: flex; flex-direction: column; align-content: center; justify-content: center; padding-top: 40px;}
.dash-server-graph-group .gauge-info-box .number{font-size: 28px; font-weight: 500; color: var(--gray-dark); margin-bottom: 5px; line-height: 1.2;}
.dash-server-graph-group .gauge-info-box .text-box{display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: 14px; color: var(--gray); justify-content: center;}
.dash-server-graph-group .gauge-info-box .text-box .per{font-weight: 700; color: var(--blue);}
.dash-server-graph-group .gauge-info-box .text-box .per.red{font-weight: 700; color: var(--danger2);}

.dash-server-graph-group .graph-bar-box{height: 160px; position: relative; width: 100%; padding: 10px 20px;}
.dash-server-graph-group .graph-bar-box canvas{width: 100%;}


@media all and (max-width: 768px){
    .dash-server-graph-group{display: block; height: auto;}
    .dash-server-graph-group .cols{width: 100%; height: 320px; border-right: none; border-bottom: 1px solid var(--gray-light3);}
    .dash-server-graph-group .cols:last-of-type{border-bottom: none;}
    .dash-server-graph-group .name{left: 20px; top: 20px; font-size: 13px;}
}


.flex-col-direction-box{height: 100%; display: flex; flex-direction: column;}
.flex-col-direction-box > *{flex-shrink: 0;}
.flex-col-direction-box .flex{flex: 1; min-height: 0;}
.flex-col-direction-box .jstree-sds-group{height: 100%;}



/* 레이아웃 관리 - 추가 css */
.history-header{background: #f8f9fa; padding: 10px 15px; border: 1px solid #dee2e6; cursor: pointer;}




/* 통계 쪽 css */
.progress.h-8{height: 8px;}

.form-control.input-daterange-datepicker{padding-right: 40px; background-image: url("data:image/svg+xml,%3Csvg width='24' height='24' viewBox='0 0 24 24' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M5.616 20.9956C5.15533 20.9956 4.771 20.8416 4.463 20.5336C4.155 20.2256 4.00067 19.8413 4 19.3806V6.61062C4 6.15062 4.15433 5.76662 4.463 5.45862C4.77167 5.15062 5.156 4.99629 5.616 4.99563H7.385V2.76562H8.462V4.99563H15.616V2.76562H16.616V4.99563H18.385C18.845 4.99563 19.2293 5.14996 19.538 5.45862C19.8467 5.76729 20.0007 6.15163 20 6.61163V19.3806C20 19.8406 19.846 20.225 19.538 20.5336C19.23 20.8423 18.8453 20.9963 18.384 20.9956H5.616ZM5.616 19.9956H18.385C18.5383 19.9956 18.6793 19.9316 18.808 19.8036C18.9367 19.6756 19.0007 19.5343 19 19.3796V10.6116H5V19.3806C5 19.534 5.064 19.675 5.192 19.8036C5.32 19.9323 5.461 19.9963 5.615 19.9956' fill='%236C757D'/%3E%3C/svg%3E%0A"); background-repeat: no-repeat; background-position: right 7px center;}

.statics-page-info-item{display: flex; align-items: center; gap: 20px;}
.statics-page-info-item p{margin-bottom: 0; line-height: 1.4;}
.statics-page-info-item .info-group{flex: 1; min-width: 0;}
.statics-page-info-item .tit{margin-bottom: 22px; font-size: 15px; color: var(--gray-dark);}
.statics-page-info-item .number{margin-bottom: 4px; font-size: 20px; font-weight: 600; color: var(--gray-dark);}
.statics-page-info-item .number strong{font-weight: 700;}
.statics-page-info-item .data-box{display: flex; flex-wrap: wrap; gap: 3px 10px; font-size: 14px; color: var(--gray);}
.statics-page-info-item .data-box .num{font-weight: 600;}
.statics-page-info-item .icon-group{flex-shrink: 0;}
.statics-page-info-item .ic-graph{display: inline-block; width: 48px; height: 48px; border-radius: 50%; background-repeat: no-repeat; background-position: center center; background-color: #f9f9f9; background-image: url("data:image/svg+xml,%3Csvg width='18' height='13' viewBox='0 0 23 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cline x1='1' y1='6.5' x2='22' y2='6.5' stroke='%23000' stroke-width='2' stroke-linecap='round'/%3E%3C/svg%3E");}
.statics-page-info-item .ic-graph.up{background-color: #F9EAEC; background-image: url("data:image/svg+xml,%3Csvg width='23' height='13' viewBox='0 0 23 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15.1445 1H21.4302V7.28571' stroke='%23C82D43' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M21.4286 1L12.55 9.87857C12.4031 10.0225 12.2057 10.1032 12 10.1032C11.7943 10.1032 11.5969 10.0225 11.45 9.87857L7.83571 6.26429C7.68884 6.12032 7.49138 6.03968 7.28571 6.03968C7.08005 6.03968 6.88259 6.12032 6.73571 6.26429L1 12' stroke='%23C82D43' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");}
.statics-page-info-item .ic-graph.down{background-color: #ECF2FD; background-image: url("data:image/svg+xml,%3Csvg width='23' height='13' viewBox='0 0 23 13' fill='none' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M15.1445 12H21.4302V5.71429' stroke='%233F80EA' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3Cpath d='M21.4286 12L12.55 3.12143C12.4031 2.97747 12.2057 2.89683 12 2.89683C11.7943 2.89683 11.5969 2.97747 11.45 3.12143L7.83571 6.73571C7.68884 6.87968 7.49138 6.96032 7.28571 6.96032C7.08005 6.96032 6.88259 6.87968 6.73571 6.73571L1 1' stroke='%233F80EA' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E%0A");}

.chart-traffic-box{width: 100%;}
.chart-traffic-box canvas{ width:100% !important; height:320px !important; }

.chart-circle-box-01{width: 100%; max-width: 360px; margin: 0 auto;}
/* .chart-circle-box-01 canvas{width:100% !important;} */

.chart-category-01{display: flex; flex-wrap: wrap; gap: 10px 20px; justify-content: center; align-items: center; margin: 10px 0 10px;}





@media all and (max-width: 768px){
    .statics-page-info-item{gap: 20px;}
    .statics-page-info-item .tit{margin-bottom: 15px; font-size: 14px;}
    .statics-page-info-item .number{margin-bottom: 3px; font-size: 17px;}
    .statics-page-info-item .data-box{gap: 3px 7px; font-size: 13px;}
    .statics-page-info-item .ic-graph{width: 40px; height: 40px; background-size: 15px;}
}



@media all and (max-width: 768px){

}
















