@charset "UTF-8";

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed,
figure, figcaption, footer, header, hgroup,
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
	margin: 0;
	padding: 0;
	vertical-align: baseline;
	font: inherit;
	font-size: 100%;
	border: 0;
	position: relative;
	word-break: keep-all;
	box-sizing: border-box;;
}

@font-face{
	font-family: "NanumGothic";
	src: url('../fonts/NanumGothic.otf') format('opentype'),
	url('../fonts/NanumGothic.ttf') format('truetype');
}

@font-face{
	font-family: "NanumGothicBold";
	src: url('../fonts/NanumGothicBold.otf') format('opentype'),
	url('../fonts/NanumGothicBold.ttf') format('truetype');
}

@font-face{
	font-family: "NanumGothicExtraBold";
	src: url('../fonts/NanumGothicExtraBold.otf') format('opentype'),
	url('../fonts/NanumGothicExtraBold.ttf') format('truetype');
}

@font-face{
	font-family: "NanumGothicLight";
	src: url('../fonts/NanumGothicLight.otf') format('opentype'),
	url('../fonts/NanumGothicLight.ttf') format('truetype');
}


table{
	border-collapse: collapse;
	border-spacing: 0;
	
}

input, select {
	vertical-align: middle;
}

/*SCROLL TYPE*/
html::-webkit-scrollbar-track , .modal_container::-webkit-scrollbar-track,.inner.modalscrab1 .modalscrab_wrap .scrab_no1 > ul::-webkit-scrollbar-track {/*  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 	 */  background-color: rgba(0,0,0,.1); border-radius:10px; margin-top:5px; margin-bottom:0px; }
html::-webkit-scrollbar , .modal_container::-webkit-scrollbar , .inner.modalscrab1 .modalscrab_wrap .scrab_no1 > ul::-webkit-scrollbar{ width: 5px;  background-color: #fff;margin-top:20px; margin-bottom:20px;}
html::-webkit-scrollbar-thumb , .modal_container::-webkit-scrollbar-thumb , .inner.modalscrab1 .modalscrab_wrap .scrab_no1 > ul::-webkit-scrollbar-thumb{ background-color: #717171; border-radius:10px; margin-top:20px; margin-bottom:20px;}
*::-webkit-scrollbar-track , .modal_container::-webkit-scrollbar-track,.inner.modalscrab1 .modalscrab_wrap .scrab_no1 > ul::-webkit-scrollbar-track {/*  -webkit-box-shadow: inset 0 0 6px rgba(0,0,0,0.3); 	 */  background-color: rgba(0,0,0,.1); border-radius:10px; margin-top:5px; margin-bottom:0px; }
*::-webkit-scrollbar , .modal_container::-webkit-scrollbar , .inner.modalscrab1 .modalscrab_wrap .scrab_no1 > ul::-webkit-scrollbar{ width: 5px;  background-color: #fff;margin-top:20px; margin-bottom:20px;}
*::-webkit-scrollbar-thumb , .modal_container::-webkit-scrollbar-thumb , .inner.modalscrab1 .modalscrab_wrap .scrab_no1 > ul::-webkit-scrollbar-thumb{ background-color: #717171; border-radius:10px; margin-top:20px; margin-bottom:20px;}

:root {
    --white: #ffffff;
    --background-gray: #efefef;
    --brand-color1: #0B2E4E;
    --brand-color2: #212E3E;
    --brand-color3: #4D5B68;
    --gray-white-color: #E6E4E5;
    --white2: #E5E5E5;
    --red-color: #D12B2B;
    --text-color: #333333;
    --gray-color: #F2F2F2;
    --gray-color2: #F5F5F5;
    --shadow-color: rgba(0, 0, 0, 0.3);
    --dark-gray-color: #7F7F7F;
    --light-gray-color: #E6E4E5;
    --table-line-color: #191919;
    --input-background-color: #F7F5F6;
    --green-color: #388E3C;
    --table-border: #D3D3D3;
    --table-odd: #F6F6F6;
    --yellow-color: #EEC346;
    --blue-color: #0100FF;
/*     --pink-color: #FFD9EC; */
	--pink-color: #FAE7F0;
	--light-blue : #F4F6Fb;
    
}
body,html{overflow: hidden;}
.bold{font-family: 'NanumGothicBold', sans-serif !important;}
body{width: 100%; min-width: 1200px; height: 100vh; min-height: 675px; }
.title {font-weight: bold;font-size: 15px;}
.wrap{width: 100%; display: flex; flex-direction: column; height: 100%;}
.wrap * {font-family: 'NanumGothic', sans-serif; font-size: 14px; color: var(--text-color);}
.wrap .gnb{width: 100%; height: 60px; background-color: var(--white); display: flex; justify-content: space-between;}
.wrap .gnb .logo_wrap{ display: flex; align-items: center; padding-left: 40px;}
.wrap .gnb .logo_wrap img{height: 40px;}
.wrap .gnb .info_wrap{display: flex; align-items: center; justify-content: flex-end; padding-right: 30px;}
.wrap .gnb .info_wrap .bell_wrap{width: 30px; height: 30px; display: flex;}
.wrap .gnb .info_wrap .bell_wrap .bell{width: 100%; height: 100%; background-image: url('../images/icons/bell.svg'); background-size: cover;}
.wrap .gnb .info_wrap .txt_wrap{margin-left: 10px; display: flex; align-items: center; margin-right: 10px;}
.wrap .gnb .info_wrap .txt_wrap span{font-size: 14px;}
.wrap .gnb .info_wrap .txt_wrap span .bold{font-family: 'NanumGothicBold', sans-serif;}
.wrap .body_wrap{width: 100%; display: flex; height: 100%;}
.wrap .body_wrap .lnb{height: 100%; overflow-y: auto; width: 240px; background-color: var(--brand-color1); display: flex; flex-direction: column; align-items: center;}
.wrap .body_wrap .lnb .lnb_wrap{width: 75%; height: 300px; margin-top: 120px;}
.wrap .body_wrap .lnb .lnb_wrap .lnb_tit{font-size: 16px; font-family: 'NanumGothicBold', sans-serif; color: var(--gray-white-color); display: flex; justify-content: center; align-items: center; line-height: 1.4;}
.wrap .body_wrap .lnb .lnb_wrap .lnb_tit_line{width: 100%; height: 1px; background-color: var(--white); margin-top: 10px;}
.wrap .body_wrap .lnb .lnb_wrap .lnb_tit_line .lnb_sub_line{width: 70%; background-color: var(--white); height: 4px; position: absolute; left: 0; bottom: 0;}
.wrap .body_wrap .lnb .lnb_wrap .lnb_menu{width: 100%; display: flex; flex-direction: column; margin-top: 20px; list-style: none; text-decoration: none; }
.wrap .body_wrap .lnb .lnb_wrap .lnb_menu li{width: 100%; margin-bottom: 10px;}
.wrap .body_wrap .lnb .lnb_wrap .lnb_menu li:last-child{margin-bottom: 0;}
.wrap .body_wrap .lnb .lnb_wrap .lnb_menu li a{display: flex; align-items: center; padding: 8px 20px; padding-left: 30px; color: var(--white2); font-size: 16px; text-decoration: none;}
.wrap .body_wrap .lnb .lnb_wrap .lnb_menu li a:before{width: 10px; height: 10px; background-color: var(--white2); position: absolute; left: 8px; top: 50%; transform: translateY(-50%); content: '';}
.wrap .body_wrap .lnb .lnb_wrap .lnb_menu li a.active{background-color: var(--brand-color3); border-radius: 5px;}
.wrap .body_wrap .contents_wrap{flex: 1; display: flex; flex-direction: column;}
.wrap .body_wrap .contents_wrap .header{width: 100%; height: 60px; background-color: var(--brand-color2); display: flex; align-items: center; padding: 0px 20px;}
.wrap .body_wrap .contents_wrap .header a{text-decoration: none; color: var(--white); font-size: 16px; padding: 8px 20px; margin-right: 15px;}
.wrap .body_wrap .contents_wrap .header a:last-child{margin-right: 0;}
.wrap .body_wrap .contents_wrap .header a.active{background-color: var(--brand-color3); border-radius: 5px;}
span.noti{position: absolute; right: 0px; top: -8px; background-color: var(--red-color); width: 20px; height: 20px; border-radius: 50%; display: flex; justify-content: center; align-items: center; line-height: 1; color: var(--white)}
.wrap .gnb .info_wrap .bell_wrap span.noti{right: -6px !important;}
.wrap .body_wrap .contents_wrap .contents_title_wrap{width: 100%; height: 50px; background-color: var(--gray-color2); display: flex; align-items: center; padding-left: 30px; padding-right: 30px;}
.wrap .body_wrap .contents_wrap .contents_title_wrap .contents_title{font-size: 16px; display: flex; align-items: center;}
.wrap .body_wrap .contents_wrap .contents{width: 100%; flex: 1; display: flex; flex-direction: column; background-color: var(--gray-color); overflow-y: auto; padding: 30px;}
.wrap .body_wrap .contents_wrap .contents .flex_wrap{flex:1 ; display: flex; column-gap: 30px;}
.wrap .body_wrap .contents_wrap .contents .flex_wrap .dynamic_wrap{display: flex; flex-direction: column; background-color: var(--white); padding: 20px; box-shadow: 0px 5px 10px #00000029; overflow-y: auto; max-height: calc(100vh - 176px);}
.wrap .body_wrap .contents_wrap .contents .flex_wrap .static_wrap{flex: 1; display: flex; flex-direction: column; background-color: var(--white); padding: 20px; box-shadow: 0px 5px 10px #00000029; overflow-y: auto; max-height: calc(100vh - 176px); opacity: 0.4; pointer-events: none;}
.wrap .body_wrap .contents_wrap .contents .flex_wrap .static_wrap.on{flex: 1; display: flex; flex-direction: column; background-color: var(--white); padding: 20px; box-shadow: 0px 5px 10px #00000029; overflow-y: auto; max-height: calc(100vh - 176px); opacity: 1.0; pointer-events: auto;}
.wrap .body_wrap .contents_wrap .contents .search_wrap{width: 100%; display: flex; column-gap: 5px; margin-bottom: 45px;}

/* 버튼 */
.wrap .gray_btn{display: flex; justify-content: center; align-items: center; cursor: pointer; border: none; background-color: var(--gray-color); height: 30px; border-radius: 5px; font-family: 'NanumGothicBold', sans-serif;  text-decoration: none; padding: 8px 20px; box-shadow: 0px 2px 5px var(--shadow-color);}
.wrap select, .wrap input[type="text"], .wrap input[type="password"], .wrap input[type="file"], .wrap input[type="number"]{background-color: var(--input-background-color); border: none; outline: none; border-radius: 5px; height: 34px; padding-left: 15px; padding-right: 15px; box-shadow: 0px 2px 5px var(--shadow-color);     max-width: 100%; box-sizing: border-box;}
.wrap select{-webkit-appearance:none; /* for chrome */-moz-appearance:none; /*for firefox*/appearance:none; background-image: url('../images/icons/dropdown.svg'); background-repeat: no-repeat; background-size: 20px 20px; background-position: right 5px top 50%; padding-right: 40px; height: 34px; max-width:200px;}
.wrap .datepicker_wrap{display: flex; align-items: center;}
.wrap .datepicker_input{padding-right: 45px;background-image: url('../images/icons/calendar.svg'); background-repeat: no-repeat; background-size: 20px 20px; background-position: right 10px top 50%;  width: 130px; cursor: pointer;}
.wrap .datepicker_dash{margin-left: 10px; margin-right: 10px;}

.wrap .search_btn{border:none; background-color: var(--dark-gray-color); width: 34px; height: 34px; border-radius: 5px; outline: none; background-position: center; background-repeat: no-repeat; background-size: 20px 20px; background-image: url('../images/icons/search.svg'); width: 34px; height: 34px; cursor: pointer; box-shadow: 0px 2px 5px var(--shadow-color);}

.wrap .btn_wrap{width: 100%; display: flex; justify-content: space-between; align-items: center; margin-bottom: 15px;}
.wrap .btn_wrap .btn_box{flex: 1; display: flex; column-gap: 5px; align-items: center;}
.wrap .btn_wrap .right_wrap{justify-content: flex-end;}
.wrap .btn_wrap button{height: 34px; border-radius: 5px; cursor: pointer; box-shadow: 0px 2px 5px var(--shadow-color); display: flex; justify-content: center; align-items: center; padding-right: 20px; padding-left: 40px; background-position: left 15px top 50%; background-repeat: no-repeat; background-size: 16px 16px; transition: 0.5s;}
.wrap .btn_wrap button:hover{transition: 0.5s; color: var(--white);}
.wrap .btn_wrap .write_btn{ background-color: var(--white);  border: 1px solid var(--brand-color1); color: var(--brand-color1);  background-image: url('../images/icons/pencil_brand.svg'); }
.wrap .btn_wrap .write_btn:hover{background-color: var(--brand-color1); background-image: url('../images/icons/pencil.svg');  }
.wrap .btn_wrap .excel_btn{ background-color: var(--white);  border: 1px solid var(--green-color); color: var(--green-color);  background-image: url('../images/icons/excel.svg'); }
.wrap .btn_wrap .excel_btn:hover{background-color: var(--green-color); background-image: url('../images/icons/excel_white.svg');  }
.wrap .btn_wrap .search_result{color: var(--brand-color1);}
.wrap .btn_wrap .search_result .total{color: var(--brand-color1); font-weight: bold; font-size: 17px;}


/* .wrap .table_wrap{width: 100%; display: flex; flex-direction: column; justify-content: space-between; flex: 0.1; } */
.wrap .table_wrap{width: 100%; display: flex; flex-direction: column; justify-content: space-between; flex: 0.5; }
.wrap .table_wrap table{width: 100%; table-layout: fixed;}
.wrap .table_wrap table td{word-break: break-all;}
.wrap .table_wrap table th, .wrap .table_wrap table td{border: 1px solid var(--table-border); padding: 10px 15px; }
.wrap .table_wrap table th{background-color: var(--dark-gray-color); color: var(--white);}
.wrap .table_wrap table th, .wrap .table_wrap table td{vertical-align: middle;}
.wrap .table_wrap table td.center{text-align: center;word-break: keep-all;white-space: normal;}
.wrap .table_wrap table td.left{text-align: left;}
.wrap .table_wrap table td.right{text-align: right;}
.wrap .table_wrap table td.btn_td{padding-top: 0px; padding-bottom: 0px; padding-left: 5px; padding-right: 5px;}
.wrap .table_wrap table .tbl_btn{margin: 2.5px; width: 34px; height: 34px; border-radius: 5px; background-position: center; background-repeat: no-repeat; background-size: 16px 16px; cursor: pointer; border: none; box-shadow: 0px 2px 5px var(--shadow-color);}
.wrap .table_wrap table .tbl_btn.update_btn{background-color: var(--green-color); background-image: url('../images/icons/pencil.svg');}
.wrap .table_wrap table .tbl_btn.delete_btn{background-color: var(--red-color); background-image: url('../images/icons/delete.svg');}
.wrap .table_wrap table .tbl_btn.reload_btn{background-color: var(--brand-color1); background-image: url('../images/icons/reload.svg');}
.wrap .table_wrap table .tbl_btn.disable_btn{background-color: var(--brand-color3); background-image: url('../images/icons/disable.svg');}
.wrap .table_wrap table .tbl_btn.search_btn{background-color: var(--brand-color3); background-image: url('../images/icons/search.svg');}
.wrap .table_wrap table tbody tr:nth-child(2n){background-color: var(--table-odd);}
.wrap .table_wrap table tbody tr{transition: 0.5s; cursor: pointer;}
.wrap .table_wrap table tbody tr:hover{background-color: var(--light-gray-color); transition: 0.5s;}
.wrap .table_wrap table td .conn{color: var(--green-color);}
.wrap .table_wrap table td .disconn{color: var(--red-color);}
/* .wrap .table_wrap table tbody tr:hover td{color: var(--white);} */
.wrap .table_wrap table tbody tr.active{background-color: var(--brand-color3);}
.wrap .table_wrap table tbody tr.active td{color: var(--white);}

.wrap .pagenation{width: 100%; display: flex; margin-top: 30px; justify-content: center; align-items: center; column-gap: 5px;}
.wrap .pagenation a{height: 34px; text-decoration: none; display: flex; justify-content: center; align-items: center; padding-left: 7px; padding-right: 7px; min-width: 34px; background-color: var(--table-odd); border-radius: 5px;}
.wrap .pagenation a.active{background-color: var(--brand-color3); color: var(--white);}
.wrap .pagenation a.icon{background-position: center; background-repeat: no-repeat; background-size: 16px ;}
.wrap .pagenation a.prev_init{background-image: url('../images/icons/double_arrow_gray.svg');}
.wrap .pagenation a.prev_init.abled{background-image: url('../images/icons/double_arrow_dark_gray.svg');}
.wrap .pagenation a.prev{background-image: url('../images/icons/arrow_gray.svg');}
.wrap .pagenation a.prev.abled{background-image: url('../images/icons/arrow_dark_gray.svg');}
.wrap .pagenation a.next_init{background-image: url('../images/icons/double_arrow_gray.svg'); transform: rotate(180deg);}
.wrap .pagenation a.next_init.abled{background-image: url('../images/icons/double_arrow_dark_gray.svg'); transform: rotate(180deg);}
.wrap .pagenation a.next{background-image: url('../images/icons/arrow_gray.svg'); transform: rotate(180deg);}
.wrap .pagenation a.next.abled{background-image: url('../images/icons/arrow_dark_gray.svg'); transform: rotate(180deg);}

.wrap .tab_wrap{width: 100%; display: flex; align-items: center; column-gap: 2px;}
.wrap .tab_wrap a{display: flex; height: 34px; border-radius: 5px 5px 0px 0px; border: 1px solid var(--brand-color1); border-bottom: 0; justify-content: center; align-items: center; padding-left: 20px; padding-right: 20px; text-decoration: none; transition: 0.5s; color: var(--brand-color1);}
.wrap .tab_wrap a:hover{background-color: var(--brand-color1); color: var(--white); transition: 0.5s;}
.wrap .tab_wrap a.active{background-color: var(--brand-color1); color: var(--white);}

/* checkbox */
.wrap .check_box{width: 16px; height: 13px; display: inline-block;}
.wrap .check_box input[type="checkbox"]{display: none;}
.wrap .check_box input[type="checkbox"] + label{width: 20px; height: 20px; border: 2px solid var(--dark-gray-color); border-radius: 5px; transition: 0.5s; background-size: 12px; background-repeat: no-repeat; background-position: center; cursor: pointer; position: absolute; left: -2px; top: -2px;}
.wrap .check_box input[type="checkbox"]:checked + label{border: 2px solid var(--brand-color1); transition: 0.5s; background-image: url('../images/icons/check.svg');}

.wrap th .check_box input[type="checkbox"] + label{border: 2px solid var(--white);}


.popup_wrap{width: 100%; height: 100vh; position: fixed; left: 0; top: 0; z-index: 20; background-color: rgba(0, 0, 0, 0.6);  display: none;}
.popup_wrap .popup_box{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); max-height: 80vh; overflow-y: auto; min-width: 500px;}
.popup_wrap .popup_box .popup_head{width: 100%; height: 50px; display: flex; justify-content: space-between; align-items: center; padding-left: 20px; padding-right: 20px; background-color: var(--brand-color1);}
.popup_wrap .popup_box .popup_head .popup_title{color: var(--white); font-family: 'NanumGothicBold', sans-serif; font-size: 16px;}
.popup_close_btn{width: 40px; height: 40px; background-size: 20px; cursor: pointer; border: 0; background-repeat: no-repeat; background-position: center; background-image: url('../images/icons/x_white.svg'); background-color: transparent;}
.popup_wrap .popup_box .popup_body{width: 100%; display: flex; flex-direction: column; padding: 20px; background-color: var(--white); row-gap: 15px; padding-top: 30px; padding-bottom: 30px;}
.input_wrap{width: 100%; display: flex; align-items: center;}
.input_wrap .input_title{color: var(--text-color); font-family: 'NanumGothicBold', sans-serif; margin-right: 15px; width: 80px;}

.input_wrap .file_box{flex: 1; display: flex; column-gap: 5px;}
.input_wrap .file_box input[type="text"]{flex: 1; cursor: pointer;}
.input_wrap .file_box input[type="file"]{position: absolute; width: 0; height: 0; padding: 0; border: 0; overflow: hidden;}
.input_wrap .file_box label{ height: 34px; cursor: pointer; display: flex; align-items: center; background-color: var(--brand-color3); border-radius: 5px; color: var(--white); padding-right: 15px; padding-left: 40px; box-shadow: 0px 2px 5px var(--shadow-color); background-position: left 15px top 50%; background-repeat: no-repeat; background-size: 16px; background-image: url('../images/icons/upload.svg');}
.input_wrap textarea{flex: 1; min-height: 120px; background-color: var(--input-background-color); border: none; outline: none; border-radius: 5px; padding: 15px;  box-shadow: 0px 2px 5px var(--shadow-color); resize: none;}
.input_wrap.text_area_wrap {align-items: flex-start;}
.input_wrap.text_area_wrap .input_title{line-height: 34px;}
.popup_wrap .popup_box .popup_body .popup_btn_wrap{width: 100%; margin-top: 15px; display: flex; justify-content: center; align-items: center; column-gap: 10px;}
.popup_wrap .popup_box .popup_body .popup_btn_wrap button{height: 34px; border: none; cursor: pointer; display: flex; justify-content: center; align-items: center; padding-left: 20px; padding-right: 20px; border-radius: 5px; box-shadow: 0px 2px 5px var(--shadow-color);}
.popup_wrap .popup_box .popup_body .popup_btn_wrap button.cancel_btn{background-color: ver(--light-gray-color);}
.popup_wrap .popup_box .popup_body .popup_btn_wrap button.confirm_btn{background-color: var(--brand-color3); color: var(--white);}
/* 설치장소 컨텐츠별 목록 조회를 위해 분리 */
.popup_wrap .popup_box .popup_body .popup_search_wrap{width: 100%; display: flex; column-gap: 5px; margin-bottom: 45px;}

input.w100 ,select.w100{flex: 1;}
input.w10 ,select.w10{width:10% !important;}
input.w15 ,select.w15{width:15% !important;}
input.w20 ,select.w20{width:20% !important;}
input.w25 ,select.w25{width:25% !important;}
input.w30 ,select.w30{width:30% !important;}
input.w40 ,select.w40{width:40% !important;}
input.w50 ,select.w50{width:50% !important;}
input.w60 ,select.w60{width:60% !important;}
input.w70 ,select.w70{width:70% !important;}

.alert_wrap{width: 100%; height: 100vh; position: fixed; left: 0; top: 0; z-index: 30; background-color: rgba(0, 0, 0, 0.6); display: none;}
.alert_wrap .alert_box{width: 350px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}
.alert_wrap .alert_box .alert_head{width: 100%; display: flex; height: 50px; background-color: var(--yellow-color); justify-content: space-between; align-items: center; padding-left: 20px; padding-right: 20px;}
.alert_wrap .alert_box .alert_head .alert_title{font-size: 16px; color: var(--white); font-family: 'NanumGothicBold', sans-serif; }
.alert_wrap .alert_box .alert_body{display: flex; flex-direction: column; width: 100%; padding: 30px; background-color: var(--white);}
.alert_wrap .alert_box .alert_body span{line-height: 1.6; width: 100%; text-align: center; font-size: 16px;}
.alert_wrap .alert_box .alert_body .alert_btn_wrap{display: flex; justify-content: center; margin-top: 20px; align-items: center; column-gap: 15px;}
.alert_wrap .alert_box .alert_body .alert_btn_wrap button{height: 34px; border: none; cursor: pointer; display: flex; justify-content: center; align-items: center; padding-left: 20px; padding-right: 20px; border-radius: 5px; box-shadow: 0px 2px 5px var(--shadow-color);}
.alert_wrap .alert_box .alert_body .alert_btn_wrap button.cancel_btn{background-color: ver(--light-gray-color);}
.alert_wrap .alert_box .alert_body .alert_btn_wrap button.confirm_btn{background-color: var(--brand-color3); color: var(--white);}

#confirm.alert_wrap .alert_box .alert_head{background-color: var(--brand-color1);}
 
#excelUploadConfirm.alert_wrap .alert_box .alert_head{background-color: var(--brand-color1);}
#excelUploadConfirm.alert_wrap .alert_box {width: 700px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}
#excelUploadConfirm.alert_wrap .alert_box .alert_body span.alert_txt{line-height: 1.6; width: 100%; text-align: center; font-size: 16px;overflow-y: auto;margin-bottom: 1rem;max-height: 50vh;}

#excelUploadAlert.alert_wrap .alert_box .alert_head{background-color: var(--brand-color1);}
#excelUploadAlert.alert_wrap .alert_box {width: 700px; position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%);}
#excelUploadAlert.alert_wrap .alert_box .alert_body span.alert_txt{line-height: 1.6; width: 100%; text-align: center; font-size: 16px;overflow-y: auto;margin-top: 1rem;max-height: 50vh;}


.ui-datepicker th{font-family: 'NanumGothic', sans-serif !important; color: var(--text-color); font-size: 0.9em;}
.ui-widget-header {background-color: var(--brand-color1); border: none; font-size: 12px;}
.ui-widget.ui-widget-content{padding:0; border: 1px solid var(--brand-color1);}

.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active{border: none; background-color: transparent; text-align: center; vertical-align: middle; font-family: 'NanumGothic', sans-serif; padding-top: 0.6em; padding-bottom: 0.6em; font-size: 12px;}
.ui-datepicker-today .ui-state-default{ color: var(--brand-color1); font-family: 'NanumGothicBold', sans-serif; border-radius: 5px; background-color: var(--light-gray-color) !important; border-radius: 5px; }
.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active, a.ui-button:active, .ui-button:active, .ui-button.ui-state-active:hover{background-color: var(--brand-color1) !important; border-radius: 5px; color: var(--white)}
.ui-state-hover{background-color: transparent !important;}
.ui-datepicker .ui-datepicker-prev span{background-size: cover; background-image: url('../images/icons/arrow_gray.svg') !important; background-position: center;}
.ui-datepicker .ui-datepicker-next span{background-size: cover; background-image: url('../images/icons/arrow_gray.svg') !important; background-position: center; transform: rotate(180deg)}
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next{top: 50% !important; transform: translateY(-50%);}

.ui-datepicker select.ui-datepicker-month, .ui-datepicker select.ui-datepicker-year{width: 30%; height: 30px;}

/* 버튼 색상 css */
.wrap .default_btn{height: 34px; border: none; cursor: pointer; display: flex; justify-content: center; align-items: center; padding-left: 20px !important; padding-right: 20px !important; border-radius: 5px; box-shadow: 0px 2px 5px var(--shadow-color); border: 1px solid var(--light-gray-color); background-color: transparent; transition: 0.5s;}
.wrap .default_btn:hover{transition: 0.5s; background-color: var(--light-gray-color); color: var(--text-color) !important;}
.wrap .default_btn.red{border: 1px solid var(--red-color); color: var(--red-color);}
.wrap .default_btn.red.active{background-color: var(--red-color); color: var(--white) !important; border:0px;}
.wrap .default_btn.red:hover{background-color: var(--red-color); color: var(--white) !important;}
.wrap .default_btn.brand{border: 1px solid var(--brand-color1); color: var(--brand-color1);}
.wrap .default_btn.brand.active{background-color: var(--brand-color1); color: var(--white) !important; border:0px;}
.wrap .default_btn.brand:hover{background-color: var(--brand-color1); color: var(--white) !important;}
.wrap .default_btn.yellow{border: 1px solid var(--yellow-color); color: var(--yellow-color);}
.wrap .default_btn.yellow:hover{background-color: var(--yellow-color); color: var(--white) !important;}
.wrap .default_btn.gray{border: 1px solid var(--gray-color); color: var(--gray-color);}
.wrap .default_btn.gray:hover{background-color: var(--gray-color); color: var(--white) !important;}
.wrap .default_btn.dark_gray{border: 1px solid var(--dark-gray-color); color: var(--dark-gray-color);}
.wrap .default_btn.dark_gray:hover{background-color: var(--dark-gray-color); color: var(--white) !important;}
.wrap .default_btn.green{border: 1px solid var(--green-color); color: var(--green-color);}
.wrap .default_btn.green.active{background-color: var(--green-color); color: var(--white) !important; border:0px;}
.wrap .default_btn.green:hover{background-color: var(--green-color); color: var(--white) !important;}


/* 우측영역 input file css */
.static_wrap .input_wrap .file_box{flex: 1; display: flex; column-gap: 5px;}
.static_wrap .input_wrap .file_box input[type="text"]{flex: 1; cursor: pointer;}
.static_wrap .input_wrap .file_box input[type="file"]{position: absolute; width: 0; height: 0; padding: 0; border: 0; overflow: hidden;}
.static_wrap .input_wrap .file_box label{ height: 34px; cursor: pointer; display: flex; align-items: center; background-color: var(--brand-color3); border-radius: 5px; color: var(--white); padding-right: 15px; padding-left: 40px; box-shadow: 0px 2px 5px var(--shadow-color); background-position: left 15px top 50%; background-repeat: no-repeat; background-size: 16px; background-image: url('../images/icons/upload.svg');}

/* 공통 margin css */
.mgt10 {margin-top:10px;}
.mgt20 {margin-top:20px;}
.mgt30 {margin-top:30px;}
.mgt40 {margin-top:40px;}
.mgt50 {margin-top:50px;}

.mgb10 {margin-bottom:10px;}
.mgb20 {margin-bottom:20px;}
.mgb30 {margin-bottom:30px;}
.mgb40 {margin-bottom:40px;}
.mgb50 {margin-bottom:50px;}

.mgl10 {margin-left:10px;}
.mgl20 {margin-left:20px;}
.mgl30 {margin-left:30px;}
.mgl40 {margin-left:40px;}
.mgl50 {margin-left:50px;}

.mgr10 {margin-right:10px;}
.mgr20 {margin-right:20px;}
.mgr30 {margin-right:30px;}
.mgr40 {margin-right:40px;}
.mgr50 {margin-right:50px;}

/* 공통 flex css */
.flex_row {display: flex; align-items: center; justify-content: space-around; flex-direction: row;}
.flex_row2 {display:flex; justify-content: space-between;align-items: center;}
.flex_col {display: flex; align-items: center; justify-content: space-around; flex-direction: column;}


/* text관련 css */
.wrap .col.red{color: var(--red-color);}
.wrap .col.green{color: var(--green-color);}
.wrap .col.brand{color: var(--brand-color1);}
.wrap .col.darkgray{color: var(--dark-gray-color);}

.wrap .txt_el {overflow: hidden; white-space: nowrap; text-overflow: ellipsis; word-break: break-all;}


input[type="text"]:disabled, select:disabled{
  background-color: var(--brand-color3);
}

.atht_wrap{width: 100%; display: flex; flex-wrap: wrap; column-gap: 4%; row-gap: 0.5;}
.atht_wrap .atht_menu_wrap{width: 48%; display: flex; flex-direction: column; margin-bottom: 30px;}
.atht_wrap .atht_menu_wrap .atht_title{width: 100%; display: flex; justify-content: center; align-items: center; background-color: var(--brand-color1); color: var(--white); padding-top: 10px; padding-bottom: 10px;}
.atht_wrap .atht_menu_wrap .atht_tbl{width: 100%; table-layout: fixed;}
.atht_wrap .atht_menu_wrap .atht_tbl td, .atht_wrap .atht_menu_wrap .atht_tbl th{padding-left: 0; padding-right: 0;  border: 1px solid var(--table-line-color); vertical-align: middle; padding-top: 8px; padding-bottom: 8px;}
.atht_wrap .atht_menu_wrap .atht_tbl th{background-color: var(--brand-color3); color: var(--white);}
.atht_wrap .atht_menu_wrap .atht_tbl td{color: var(--text-color); text-align: center;}

.year_month_wrap{width: 100%; margin-top: 20px; display: flex; justify-content: center; align-items: center; column-gap: 20px;}
.year_month_wrap a{width: 40px; height: 40px; border-radius: 50%; box-shadow: 0px 2px 5px var(--shadow-color); background-color: var(--input-background-color); color: var(--brand-color1); }
.year_month_wrap a:before{background-position: center center; background-repeat: no-repeat; background-size: 16px; width: 100%; height: 100%; position: absolute; left: 0; top: 0; content: '';}
.year_month_wrap a.prev:before{background-image: url('../images/icons/arrow_dark_gray.svg');}
.year_month_wrap a.next:before{background-image: url('../images/icons/arrow_dark_gray.svg'); transform: rotate(180deg);}
.full_calendar_wrap{width: 100%; margin-top: 20px; flex: 1;}
.full_calendar_wrap table{width: 100%; height: 100%; table-layout: fixed;}
.full_calendar_wrap table th,.full_calendar_wrap table td{border: 1px solid var(--table-border) !important;}
.full_calendar_wrap table thead{max-height: 30px;}
.full_calendar_wrap table thead tr{max-height: 30px; height: 30px;}
.full_calendar_wrap table thead th{text-align: center; vertical-align: middle; background-color: var(--brand-color3); color: var(--white); max-height: 30px;}
.full_calendar_wrap table td{}
.full_calendar_wrap table td .status_wrap{width: 100%; height: 100%; display: flex; flex-direction: column; justify-content: space-between; padding: 8px; cursor: pointer; position: absolute; left: 0; top: 0;}
.full_calendar_wrap table td .status_wrap.none{background-color: var(--pink-color);}
.full_calendar_wrap table td .status_wrap.noactive{background-color: var(--background-gray);}
.full_calendar_wrap table td .status_wrap.comp{background-color: var(--light-blue);}
.full_calendar_wrap table td .status_wrap.active{background-color: var(--brand-color1);}
.full_calendar_wrap table td .status_wrap.active *{color: var(--white) !important;}
.full_calendar_wrap table td .status_wrap .day{color: var(--text-color);}
.full_calendar_wrap table td .status_wrap .day.sun{color: var(--red-color);}
.full_calendar_wrap table td .status_wrap .day.sat{color: var(--blue-color);}
.full_calendar_wrap table td .status_wrap .status{color: var(--text-color);}


/* 경고표wl css */
.warn_sign_area{display: flex; flex: 1;flex-direction: column; }
.sign_list{display: flex; flex-wrap: wrap; }
.sign_list *{box-sizing: border-box;}
.sign_list .sign_item{width: 12.5%;}
.sign_list .sign_item .sign_item_inner{width: 100%;}
.sign_list .sign_item .sign_item_inner img{width: 100%; display: block;}
.sign_list input{width: 0; height: 0; position: absolute; left: 0; top:0;}
.sign_list .sign_item.sign_item_color_01{border: 1px solid var(--red-color);}
.sign_list .sign_item.sign_item_color_01.active{border: 3px solid var(--red-color); background-color: rgba(255, 0, 0, 0.2);}
.sign_list .sign_item.sign_item_color_02{border: 1px solid var(--yellow-color);}
.sign_list .sign_item.sign_item_color_02.active{border: 3px solid var(--yellow-color); background-color: rgba(255, 255, 0, 0.2);}
.sign_list .sign_item.sign_item_color_03{border: 1px solid var(--blue-color);}
.sign_list .sign_item.sign_item_color_03.active{border: 3px solid var(--blue-color); background-color: rgba(0, 0, 255, 0.2);}
.selected_sign_list{display: flex; flex-wrap: wrap; }
.selected_sign_list *{box-sizing: border-box;}
.selected_sign_list .sign_item{width: 14%;/*height: 250px; border: 1px solid var(--brand-color2);*/}
.selected_sign_list .sign_item .sign_item_inner{width: 100%;}
.selected_sign_list .sign_item .sign_item_inner img{width: 100%; display: block;}

/* 설치장소별 컨텐츠 검색 버튼 */
.wrap .lab_content_search_btn{border:none; background-color: var(--dark-gray-color); width: 34px; height: 34px; border-radius: 5px; outline: none; background-position: center; background-repeat: no-repeat; background-size: 20px 20px; background-image: url('../images/icons/search.svg'); width: 34px; height: 34px; cursor: pointer; box-shadow: 0px 2px 5px var(--shadow-color);}



.wrap .label_check_box{display: flex; align-items: center;}
.wrap .label_check_box input[type="checkbox"]{display: none;}
.wrap .label_check_box input[type="checkbox"] + label{padding-left: 30px; color: var(--text-color); cursor: pointer;}
.wrap .label_check_box input[type="checkbox"] + label:before{width: 20px; height: 20px; border: 2px solid var(--dark-gray-color); border-radius: 5px; transition: 0.5s; background-size: 12px; background-repeat: no-repeat; background-position: center; position: absolute; left: 0; top: 50%; transform: translateY(-50%); content: '';}
.wrap .label_check_box input[type="checkbox"]:checked + label:before{border: 2px solid var(--brand-color1); transition: 0.5s; background-image: url('../images/icons/check.svg'); transition: 0.5s;}
.login_section{width: 100%; height: 100vh; display: flex; justify-content: center; align-items: center; background-color: var(--brand-color1);}
.login_section .login{display: flex; flex-direction: column; align-items: center;}
.login_section .login .login_form{display: flex; flex-direction: column; align-items: center; }
.login_section .login .login_form .login_form_field{width: 100%; margin-top: 30px; margin-bottom: 15px;}
.login_section .login .login_form .login_form_field .field{width: 100%; display: flex; margin-bottom: 15px;}
.login_section .login .login_form .login_form_field .field input{width: 100%; min-height: 34px; padding-left: 15px; padding-right: 15px; outline: none;}
.login_section .login .login_form .btn-default{width: 100%; height: 40px; border-radius: 10px; background-color: var(--brand-color3); display: flex; justify-content: center; align-items: center; color: var(--white); text-decoration: none;}

.noaccident_logo_wrap{width: 200px;} 
.noaccident_logo_wrap img{max-width: 100%;}
.noacctident_btn_wrap{width: 100%; display: flex; align-items: center; column-gap: 10px; margin-top: 40px; padding-left: 160px;}

.menu_icon_box{width: 60px; height: 60px; background-repeat: no-repeat; background-position: center; background-color: var(--brand-color1); background-size: 60% auto; display: inline-block;}


.loading_wrap{width: 100%; height: 100vh; background-color: rgba(0, 0, 0, 0.7); position: fixed; left: 0; top: 0; z-index: 100; display: none;}
.loading_wrap .loading_box{position: absolute; left: 50%; top: 50%; transform: translate(-50%, -50%); display: flex; column-gap: 0.5rem;}
.loading_wrap .loading_box .loading_text{font-size: 2rem; color: var(--white); }
.loading_wrap .loading_box .dot{font-size: 2rem; color: var(--white);  opacity: 0; animation: fade 1.5s infinite;}
.loading_wrap .loading_box .dot:nth-child(1) { animation-delay: 0s; }
.loading_wrap .loading_box .dot:nth-child(2) { animation-delay: 0.3s; }
.loading_wrap .loading_box .dot:nth-child(3) { animation-delay: 0.6s; }


        @keyframes fade {
            0% {
                opacity: 0;
            }
            50% {
                opacity: 1;
            }
            100% {
                opacity: 0;
            }
        }