/* 01. 헤더 스크롤 시 덜컹거림 방지 및 영역 유지 */
body #header2 {
    position: sticky
}

body #header2.headsticky {
    /*position: sticky !important;*/
    position: fixed !important;
}

body #sub-container.login {
    margin: 0 auto;
}

body #header2 ~ #container #sub-container.login {
    margin: 0 auto;
}



/* 02. 스크롤 테이블 thead의 크기 조정 (스크롤바의 크기가 17px에서 8px로 변경됨) */
.scroll-table .table thead {
    /*width: calc(100% - 17px);*/
    width: calc(100% - 8px);
}


/* 03. 관리자 로그인 OTP 스타일링 */
#contents-page .login-tab > li > a {
    /*탭 숨기기*/
    visibility: hidden;
}

#otpLogin, #otpRegister {
    line-height: 1.6;
}

#otpLogin h3, #otpRegister h3 {
    color: #272727
}

#qrCodeImage {
    width: 150px;
    display: block;
    margin: 30px auto;
}

#otpLoginInput, #otpCodeInput {
    margin-top: 10px;
}

#btn_login_otp, #btn_register_otp {
    width: 100%;
    margin-top: 15px;
    margin-left: 0;
    height: 55px;
}


/* 04. 디바이스 상세정보 팝업에서 새 항목 추가에 의해 저장 버튼을 개행  */
.device-detail-alarm-set > .btn-bottom {
    width: 100%;
    padding: 5px 0;
}


/* 05. 차량ㆍ사용자의 배터리 셀별 현황이 없을 경우의 텍스트 표시와 기준 기간 위치를 변경 */
.cell-wrap .stats {
    position: relative;
}

.cell-wrap .rule_date .rule_date_span {
    position: absolute;
    right: 0;
    top: 28px;
}


.cell-wrap .val-list {
    margin-top: 20px;
}

.cell-wrap .val-list .no_data {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 90px 0;
}


/* 06. 디바이스 A/S 접수 아이콘과 보고서ㆍ결재 아이콘의 혼선 해결 */
.driving-page .btn.icon-report:before {
    content: "\e904";
}


/* 07. 부트스트랩 스타일 클래스 추가 */
.d-none {display: none;}
.d-block {display: block;}
.d-inline {display: inline;}
.d-inline-block {display: inline-block;}
.d-flex {display: flex;}
.d-inline-flex {display: inline-flex;}
.justify-content-center {justify-content: center;}
.justify-content-start {justify-content: start;}
.justify-content-end {justify-content: end;}
.justify-content-between {justify-content: space-between;}
.justify-content-around {justify-content: space-around;}
.justify-content-evenly {justify-content: space-evenly;}
.align-items-center {align-items: center;}
.align-items-start {align-items: start;}
.align-items-end {align-items: end;}
.align-items-baseline {align-items: baseline;}
.align-items-stretch {align-items: stretch;}
.flex-wrap {flex-wrap: wrap;}
.flex-nowrap {flex-wrap: nowrap;}
.flex-wrap-reverse {flex-wrap: wrap-reverse;}
.flex-column {flex-direction: column;}
.flex-column-reverse {flex-direction: column-reverse;}
.flex-row {flex-direction: row;}
.flex-row-reverse {flex-direction: row-reverse;}
.align-top {vertical-align: top}
.align-middle {vertical-align: middle}
.position-relative {position: relative;}
.position-absolute {position: absolute;}
.position-fixed {position: fixed;}
.position-sticky {position: sticky;}
.w-100 {width: 100%;}
.w-50 {width: 50%;}
.list-style-initial {list-style: initial;}
.list-style-decimal {list-style: decimal; padding-left: 1.33em}


/* 08. 헤더 배너 및 로고 스타일 */
.header-banner {
    background: #d9d9d9;
    text-align: center;
    color: #333;
    padding: 12px 0 14px;
    display: none;
}

.header-banner.on {
    display: block
}

.header-banner a {
    margin-left: 6px;
    color: #333;
    text-decoration: underline;
}

#header .section01 {
    height: 100%
}