.doc-example .doc-example-content::before {
	font-size : 15px!important;
}

/* 최상위 태그 */
#layoutPage {
    transition: all 1s;
    min-width: 1480px !important;
}

#layoutPage .aside-left {
    display: flex;
    width: min-content;
    background-color: #ffffff;
    margin-right: 5px;
}

#layoutPage header {
    display: flex;
    align-items: center;
    height: 2.2rem !important;
}
#layoutPage footer {
    height: 2.2rem !important;
}

#layoutPage main {
    padding: 0 0 0 0 !important;
}

#layoutPage .aside-right {
    background-color: white;
    border: 1px solid black;
    position: fixed;
    z-index: 99;
    top :2.2rem;
    right: 1rem;
    width: min-content;
}

#innerPageTabContents {
    height : calc( 100% - 2.2rem );
    padding-bottom: 0px;
}

#innerPageTabContents > div {
    height : 100%;
}

.wrapper-dashboard {
	display: flex;
    flex-flow: row wrap;
    justify-content:center;
    max-width:1400px;
    padding: 0px;
}

.wrapper-dashboard .card {
    font-weight: bold;
    padding : 7px;
    margin : 7px;
    flex-grow: 1;
    flex-shrink: 1;
}
.wrapper-dashboard .card-header {
    margin: 0;
    padding: 3px;
}
.wrapper-dashboard .card-body {
    margin: 0;
    padding: 3px;
    padding-bottom: 20px;
}
.wrapper-dashboard .card-footer {
	border-top: 1px solid #d9dee3;
    padding: 3px;
}

.dashboard-total {
	min-width : 300px;
	max-width : 400px;
	max-height : 150px;
}

.dashboard-chart {
	min-width : 500px;
	max-width : 650px;
}

@keyframes skeleton-loading {
	0% { fill: #f2f2f2; }
    25% { fill: #c1c1c1; }
    50% { fill: #a1a1a1; }
    75% { fill: #c1c1c1; }
    100% { fill : #f2f2f2; }
}

.skeleton {
	animation: skeleton-loading 1s infinite;
}

.wrapper-list {
    height: 790px;
    overflow-y:scroll;
    padding: 15px;
}

.wrapper-pop {
    padding: 5px 20px 5px 20px;
}

/* 조회조건 영역 */
.container-search {
    clear: both;
    position: relative;
    overflow: hidden;
    padding: 10px 15px;
    background-color: var(--bs-nav-link-color);
    border: 1px solid #d0d0d0;
    box-shadow: rgb(0 0 0 / 15%) 1.95px 1.95px 2.6px;
    line-height: 24px;
}

.container-search-detail {
    background-color: #f2f2f2;
}

.form-search-title {
    min-width: 6.25rem;
}

.form-search-linebox {
    display: inline-block;
    width: max-content;
}

/* 날짜입력 */
.form-date, .form-time {
    width: 7.5rem;
    color: #515151;
    border: 1px solid #a9a9a9;
    text-align: center;
}

/* 탭,내비게이션 */
.nav-link-closeable{
    padding-right: calc(0.8em  + (0.9375em * 2));
}
.nav-link-closeable + .btn-close{
    font-size: 16px;
    margin-left:  calc((0.8em + (0.9375em * 2)) * -1);
    height: 100%;
}

.nav-tabs.nav-tabs-ifr{
    --bs-nav-tabs-padding-top : .3em;
    --bs-nav-tabs-padding-left : .3em;
    --bs-nav-tabs-border-radius: 0.1875rem;
    --bs-nav-tabs-bg-image: linear-gradient(#8AB9DB,whitesmoke);

    --bs-nav-link-color: #2e6e9e;
    --bs-nav-link-bg-image: linear-gradient(#dfeffc,white);
    --bs-nav-tabs-link-active-color: #e17009;
    --bs-nav-tabs-link-active-bg : #fff;
}


/* 버튼 */
.btn-red {
    --bs-btn-color: #fff;
    --bs-btn-bg:#e60012;

    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg:#e60012;
}

.btn-green {
    --bs-btn-color: #fff;
    --bs-btn-bg: #107c41;

    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg:#107c41;
}

.btn-blue {
    --bs-btn-color : #fff;
    --bs-btn-bg : #1a71ff;

    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg:#1a71ff;
}

.btn-lightgray {
    --bs-btn-color:#474747;
    --bs-btn-bg: #eee;

    --bs-btn-hover-color: #474747;
    --bs-btn-hover-bg:#eee;
}

.btn-darkgray {
    --bs-btn-color: #fff;
    --bs-btn-bg: #676767;

    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg:#676767;
}

.btn-square {
    aspect-ratio: 1 / 1 !important;
}

.btn-search {
    --bs-btn-color: #fff;
    --bs-btn-bg: #44539e;

    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg:#44539e;
}

.btn-open-detail {
    --bs-btn-color: #fff;
    --bs-btn-bg: #44539e;

    --bs-btn-hover-color: #fff;
    --bs-btn-hover-bg:#44539e;

    float:right;
}

.btn-pagination {
    border:1px solid #e1e1e1;
    line-height: 0px;
    border-radius: 7px;
    background:#F5F5F5;
    --bs-btn-disabled-bg: #F5F5F5;
}

/*팝업 영역 */
.container-window1{
    margin: 0px auto;
    padding: 20px 20px;
    text-align: left;
    display: flex;
    flex-direction: column;
    gap: 1rem;
}

.container-window2{
    margin: 20px auto;
    padding: 40px 45px;
    text-align: left;
    display: flex;
    flex-flow: column;
}

.container-window3 {
    display: inline-block;
    max-width: 1400px;
    padding: 50px 45px;
    box-sizing: border-box;
    border-top: 5px solid #003567;
    border-bottom: 5px solid #003567;
    text-align: left;
    box-shadow: 0 0 18px 5px rgba(0,0,0,0.2);
}

.container-window1 table {
    font-family: 'Dotum';
    text-align: left;
}

.container-window3 table {
    font-family: 'Dotum';
    text-align: left;
}


/* 팝업 헤더 영역 */
.container-window-header1 {
    padding: 2px 0px 10px 20px;
    color: #333;
    display: flex;
}
.container-window-header-img {
    height: fit-content;
    align-self: center;
    display: block;
    padding: 4px;
}
.container-window-header-title {
    align-self: center;
    font-size: 20px !important;
    font-weight: 700;
    margin-bottom: 0rem;
    padding: 12px;
}
.container-window-header2 {
    border-bottom: 1px solid #c3c3c3;
    font-size: 15px;
    font-weight: bold;
    letter-spacing: -1.6px;
    padding: 10px 10px 10px 10px;
    margin-top: 12px;
}


/* 버튼영역 */
.container-window-btn1 {
    column-gap: 5px;
    margin-top: 20px;
    margin-bottom: 20px;
    overflow: hidden;
    clear: both;
    display: flex;
}
.container-window-btn2 {
    column-gap: 5px;
    margin-top: 20px;
    margin-bottom: 20px;
    overflow: hidden;
    clear: both;
    display: flex;
    flex-direction: row-reverse;
}

.container-window-btn3 {
    column-gap: 5px;
    margin-top: 10px;
    margin-bottom: 10px;
    display: flex;
    justify-content: flex-end;
    padding-right: 22px;
    align-items: center;
}

.container-page-btn {
    margin:8px 0;
    clear: both;
    position: relative;
    overflow: hidden;
    display: flex;
    justify-content: space-between;
    align-items: center;
}
.container-page-btn .btn{
    margin:0 3px;
}

.container-window-btn-right {
    display: flex;
    align-items: center;
    margin-left: auto;
    column-gap: 3px;
}

.btns .btn {
    margin:0 3px;
}

/* 카드 */
.card-header-line {
    --bs-card-body-border-width : 1px;
    margin-bottom: 1rem;
}

.card-header-lg {
    --bs-card-cap-padding-x : 1.5rem;
    --bs-card-cap-padding-y : 1.5rem;
}



/*테이블*/
.table-02 {
    font-size: 12px;
    border-collapse: separate;
    border-spacing: 5px 5px;
    margin-bottom: 20px;
}
.table-02 th, .table-02 td {
    border: 1px solid #b7b7b7;
    color: #515151;
}
.table-02 th {
    vertical-align: top;
    padding: 10px 15px;
    background-color: #eee;
    color: #3d3d3d;
    font-weight: bold;
}
.table-02 td {
    padding: 0 15px;
}
.table-02 input[type=text], .table-02 select, .table-02 textarea {
    border: none;
    width: 100%;
    height: 100%;
    color: #515151;
}
.table-02 input[type=text], .table-02 select {
    min-height: 30px;
}
.table-02 input[type=radio], .table-02 input[type=checkbox] {
    margin: 10px 2px 10px 15px;
}
.table-02 td > input[type=radio]:first-of-type, .table-02 td > input[type=checkbox]:first-of-type {
    margin-left: 0;
}
.table-02 textarea {
    min-height: 50px;
    resize: none;
    padding: 15px;
}

.table-03 {
    font-size: 12px;
    margin-bottom: 20px;
    border:1px solid red;
}
.table-03 th, .table-03 td {
    border: 1px solid #b7b7b7;
    color: #515151;
    vertical-align: middle;
}
.table-03 th {
    background-color: #f2f5fd;
    font-weight: normal;
    color: #101010;
    letter-spacing: -0.7px;
    font-size:13px;
    text-align: center;
}

.table-03 td {
    background-color: #fff;
    padding: 1px;
}
.table-03 input[type=text], .table-03 select, .table-03 textarea {
    border: 1px solid #d1d1d1;
    min-height: 30px;
    width: 100%;
    height: 100%;
    color: #515151;
}
.table-03 a.btn {
    margin-top: -5px;
    margin-bottom: -5px;
    vertical-align: top;
}
.table-03 input[type=text], .table-03 select {
    padding-left: 15px;
}

.table-03 textarea {
    min-height: 50px;
    resize: none;
    padding: 15px;
}
.table-03 input[type=radio], .table-03 input[type=checkbox] {
    margin: 0px 2px 0px 15px;
}
.table-03 input[type=radio]:first-child, .table-03 input[type=checkbox]:first-child {
    margin-left: 0;
}


/* div 너비,높이 */
.container-fix01 {
    width: 70%;
    min-width:600px;
    height: 570px;
}
.container-fix09 {
    width: 70%;
    min-width:600px;
    min-height: 730px;
}
.container-fix02 {
    width:48%;
    min-width:500px;
    height: 630px;
}
.container-fix05 {
    width: 1100px;
    min-width: 700px;
    gap:1em;
    display: flex;
}
.container-fix04 {
    width: 400px;
}
.container-fix06 {
    width: 1100px;
    min-width:700px;
}

.w-form-select {
    width: max-content !important;
    min-width: 6.25rem !important;
    max-width: 16.25rem !important;
}

.w-form-date {
    width: 7.5rem !important;
}


/* 배경색, 외곽선 */
.traffic {

}
.cleanparking {
	--program-border : 1px solid #B5B9BB;
	--program-border-shadow : 0 0 0 1px inset #FCFFFF;
	
	--program-bg : #E3E6E8;
	--program-title-bg : #EEC575;
	--program-btn-bg : #F0F0F0;
	--program-popup-bg : #E2E6E9;
}

.cleanparking.green {
	--program-title-bg : #ADD773;
}

.border-program {
    box-shadow: var(--program-border-shadow) !important;
    border : var(--program-border) !important;
}

.bg-program {
    background-color: var(--program-bg) !important;
}

.bg-program-btn {
    background-color: var(--program-btn-bg) !important;
}

.bg-program-popup {
    background-color: var(--program-popup-bg)!important;
}

.bg-program-title {
    background-color: var(--program-title-bg) !important;
}

/* 다이얼로그 창 넓이 */
.w-dialog-px-500 {
    --bs-modal-width : 500px;
}

.w-dialog-px-600 {
    --bs-modal-width : 600px;
}

.w-dialog-px-700 {
    --bs-modal-width : 700px;
}

.w-dialog-px-800 {
    --bs-modal-width : 800px;
}

.w-dialog-px-900 {
    --bs-modal-width : 900px;
}

.w-dialog-px-1000 {
    --bs-modal-width : 1000px;
}

.w-dialog-px-1100 {
    --bs-modal-width : 1100px;
}

.w-dialog-px-1200 {
    --bs-modal-width : 1200px;
}

.modal-header-noheader {
    height: 0px !important;
}

.modal-header-noheader > .btn-close {
    margin-top: 2rem !important;
}