/******            KT 타이틀 스타일            ******/
input[type="button"]{
  font-family: "Font Awesome 5 Free";
  -moz-osx-font-smoothing: grayscale;
  -webkit-font-smoothing: antialiased;
  display: inline-block;
  font-style: normal;
  font-variant: normal;
  text-rendering: auto;
  line-height: 1;
  font-weight: 600;
}
.form-group-wrap{
    position:relative;
    border: 1px solid #d1d3e2;
    background:#f8f9fc;
    padding:1.4rem .8rem .8rem .8rem;
}
.form-group-title{
    position:absolute;
    top:-.6rem;
    left:1.4rem;
    background:#fff;
    color:#858796;
    font-size:1rem;
}
.form-group-wrap table td,
.form-group-wrap table th{
    padding: .35rem .5rem;
}
.form-control-title{
    color:#4e73df;
    font-size:1rem;
    text-align: left;
    width: 100%;
}

.graph-section-title{
    text-align: center;
    position:absolute;

    top:-.6rem;
    left:50%;
    background:#fff;
    color:#4e73df;
    font-size:1rem;
    transform: translate(-50%, 0%);
}
/******            KT 모달 달력           ******/
.modalhasDatepicker {
	z-index: 99999 !important;
}
/******            KT 테이블 스타일            ******/
.table {
    text-align: center;
    table-layout: fixed;
}
/*  순서  */
.table .table-width-order,
.table .table-width-25{
    width:25px;
    white-space: nowrap;
    text-overflow: ellipsis;
}
/*  날짜  */
.table .table-width-date,
.table .table-width-110{
    width:110px;
}
/*  포트수, 포트인덱스, 임계, 장비구분  */
.table .table-width-portNu,
.table .table-width-portIndex,
.table .table-width-devgubun,
.table .table-width-45{
    width:45px;
}
/*  관리비관리  */
.table .table-width-management,
.table .table-width-85{
    width:85px;
}
/*  장애등급  */
.table .table-width-level,
.table .table-width-60{
    width:60px;
}
/*  장비 ip  */
.table .table-width-ip
.table .table-width-100{
    width:100px;
}


/*****  테이블 안에 px로 사용해야할 경우 *****/
.table-px-15{
    width:15px!important;
}
.table-px-30{
    width:30px!important;
}
.table-px-60{
    width:60px!important;
}
.table-px-90{
    width:90px!important;
}
.table-px-120{
    width:120px!important;
}
.table-px-150{
    width:150px!important;
}
.table-px-180{
    width:180px!important;
}
.table-px-auto{
    width:100%!important;
}


/*****  테이블 안에 %로 사용해야할 경우 *****/

.table-per-3{
    width:3%!important;
}
.table-per-5{
    width:5%!important;
}
.table-per-7{
    width:7%!important;
}
.table-per-10{
    width:10%!important;
}
.table-per-15{
    width:15%!important;
}
.table-per-20{
    width:20%!important;
}
.table-per-30{
    width:30%!important;
}
.table-per-auto{
    width:auto!important;
}



/*    장비명 , 장비 IP 글자 포인트  */
.table .table-text-point{
    color:#4e73df;
    font-weight: bolder;
}


/******            로딩바 시간 / 간격 스타일            ******/

.loading-wrap{
    position: fixed;
    width: 100%;
    height: 100%;
    overflow-y: hidden;
    top: 0;
    left: 0;
    background: rgba(0,0,0,.6);
    z-index: 999999;
    opacity: 0;
    display:none;
    transition: .5s easing;
}
.loading-wrap.show{
    opacity: 1;
    display:block;

}
.loading-wrap .spinner-grow:nth-child(1){}
.loading-wrap .spinner-grow:nth-child(2){margin:0 1.4rem;animation-delay: .2s;}
.loading-wrap .spinner-grow:nth-child(3){animation-delay: .4s;}



@-webkit-keyframes text-opacity {
    0% {
    }

    50% {
        opacity: 1;
    }
}

@keyframes text-opacity {
    0% {
    }

    50% {
        opacity: 1;
    }
}

.loading-wrap h5 {
    width:100%;
    text-align: center;

    animation-delay: .4s;
    opacity: .4;

    -webkit-animation: text-opacity 2s ease-in infinite;
    animation: text-opacity 2s ease-in infinite;
}

/******            export.css ( 토폴로지맵 편집 ) 스타일 수정            ******/

.custom-menu{
    display: block;
    width: 10rem!important;
    padding: 0.5rem 1rem;
    clear: both;
    font-weight: 400;
    color: #3a3b45;
    text-align: inherit;
    white-space: nowrap;
    background-color: #eaecf4;
}
.custom-menu:hover {
    background-color: #4e73df;
    color: #fff;
}
.ui-draggable-handle{
}

#infovis2 > .topology-hover-event:hover {
    box-shadow: 0 0 0 0.4rem rgba(78, 115, 223, 0.25);
    border-radius: .4rem;
}



/******           사용자등록 그룹명 테이블 스크롤 없는 스타일            ******/
#user_power_table_wrapper .dataTables_scrollBody::-webkit-scrollbar,
#m_user_power_table_wrapper .dataTables_scrollBody::-webkit-scrollbar {
  width: 0px;  /* 세로축 스크롤바 길이 */
}

/******           마우스 커서 클래스           ******/
.cursor-pointer{
    cursor:pointer;
}

/*******        상단 알람 그룹            ******/
.top-alert-group {
    box-shadow: inset 0px 0px 8px 0px #ddd;
    background: #f5f5f5;
    border-radius: .35rem;
    padding: .5rem;

    display: flex;
    justify-content: space-between;
    font-weight: 500;
}
.top-alert-group .nav-link > span{
    min-width:2.6rem;
    text-align: center;
}


/*      20200915 상단 사용자정보, 로그아웃 아이콘 크기 변경       */

.topbar.navbar-light .navbar-nav .nav-item .nav-link > i ,
.topbar.navbar-light .navbar-nav .nav-item:nth-last-child(2) .nav-link{
    font-size:1.35rem;
}
.topbar.navbar-light .navbar-nav .nav-item:last-child{
    border-left:1px solid #e3e6f0;
    padding-left: .5rem;
}


/*  20200915 datatable, input.js  사이즈고정 */
.dataTables_paginate.pagination.paging_input{
    justify-content: flex-end;
}
.dataTables_paginate.pagination.paging_input > span{
    cursor: pointer;
}
.dataTables_paginate.pagination.paging_input > span:first-child {
    border-top-left-radius: .35rem;
    border-bottom-left-radius: .35rem;
}
.dataTables_paginate.pagination.paging_input > span:last-child {
    border-top-right-radius: .35rem;
    border-bottom-right-radius: .35rem;
}
.dataTables_paginate.pagination.paging_input > div:hover{
    background:none;
}
.dataTables_paginate.pagination.paging_input .form-control-sm{
    width:4rem;
    margin-left:.5rem;
}

#websocket_table_wrapper {
    color:#fafafa;
}
#websocket_table_wrapper td{
    color:#fff;
}

/*
20201222 datatable 정렬 표시 없앰*/
table.dataTable thead > tr > th.sorting_asc, table.dataTable thead > tr > th.sorting_desc, table.dataTable thead > tr > th.sorting,
table.dataTable thead > tr > td.sorting_asc,
table.dataTable thead > tr > td.sorting_desc,
table.dataTable thead > tr > td.sorting {
    /*padding-right: 0px;*/
}

table.dataTable thead .sorting:before,
table.dataTable thead .sorting_asc:before,
table.dataTable thead .sorting_desc:before,
table.dataTable thead .sorting_asc_disabled:before,
table.dataTable thead .sorting_desc_disabled:before {
    right: 0em;
    content: none;
}
table.dataTable thead .sorting:after,
table.dataTable thead .sorting_asc:after,
table.dataTable thead .sorting_desc:after,
table.dataTable thead .sorting_asc_disabled:after,
table.dataTable thead .sorting_desc_disabled:after {
    right: 0em;
    content: none;
}