
.empty_table{line-height:10rem;text-align:center;}

.grid1-head{width:15%;min-width:90px;}
.grid2-head{width:25%;min-width:120px;}
.grid3-head{width:12%;}
.grid4-head{width:20%;min-width:120px;}

.wp-50{width:50px !important;}
.wp-60{width:60px !important;}
.wp-70{width:70px !important;}
.wp-80{width:80px !important;}
.wp-90{width:90px !important;}
.wp-100{width:100px !important;}
.wp-120{width:120px !important;}
.wp-130{width:130px !important;}
.wp-150{width:150px !important;}
.wp-200{width:200px !important;}
.wp-250{width:250px !important;}
.wp-300{width:300px !important;}
.wp-400{width:400px !important;}
.wp-480{width:480px !important;}
.wp-500{width:500px !important;}
.wp-600{width:600px !important;}
.wp-700{width:700px !important;}
.wp-800{width:800px !important;}
.wp-900{width:900px !important;}

.w-20{width:20% !important;}
.w-24{width:24% !important;}
.w-30{width:30% !important;}
.w-33{width:33% !important;}
.w-40{width:40% !important;}
.w-45{width:45% !important;}
.w-48{width:48% !important;}
.w-60{width:60% !important;}
.w-65{width:65% !important;}
.w-70{width:70% !important;}
.w-75{width:75% !important;}
.w-80{width:80% !important;}
.w-85{width:85% !important;}
.w-90{width:90% !important;}
.w-95{width:95% !important;}

.max-90{max-width:90%!important;}
.max-95{max-width:95%!important;}
.max-100{max-width:99%!important;}

.max-150{max-width:150px;}
.max-200{max-width:200px;}
.max-250{max-width:250px;}
.max-300{max-width:300px;}
.max-350{max-width:350px;}
.max-400{max-width:400px;}
.max-450{max-width:450px;}
.max-500{max-width:500px;}
.max-550{max-width:550px;}
.max-600{max-width:600px;}
.max-700{max-width:700px;}
.max-800{max-width:800px;}
.max-900{max-width:900px;}
.max-1000{max-width:1000px;}
.max-1100{max-width:1100px;}

.min-100{min-width:100px;}
.min-120{min-width:120px;}
.min-150{min-width:150px;}
.min-200{min-width:200px;}
.min-250{min-width:250px;}
.min-300{min-width:300px;}
.min-350{min-width:350px;}
.min-400{min-width:400px;}
.min-450{min-width:450px;}
.min-500{min-width:500px;}
.min-550{min-width:550px;}
.min-600{min-width:600px;}
.min-700{min-width:700px;}
.min-800{min-width:800px;}
.min-900{min-width:900px;}
.min-1000{min-width:1000px;}
.min-1100{min-width:1100px;}

.mb-p10{margin-bottom:10px !important;}
.mb-p20{margin-bottom:20px !important;}
.mb-p30{margin-bottom:30px !important;}
.mb-p40{margin-bottom:40px !important;}
.mb-p50{margin-bottom:50px !important;}
.mb-p60{margin-bottom:60px !important;}
.mb-p70{margin-bottom:70px !important;}
.mb-p80{margin-bottom:80px !important;}
.mb-p90{margin-bottom:90px !important;}
.mb-p100{margin-bottom:100px !important;}
.mb-p120{margin-bottom:150px !important;}
.mb-p150{margin-bottom:150px !important;}
.mb-p200{margin-bottom:200px !important;}
.mb-p250{margin-bottom:250px !important;}
.mb-p300{margin-bottom:300px !important;}

.mt-p10{margin-top:10px !important;}
.mt-p20{margin-top:20px !important;}
.mt-p30{margin-top:30px !important;}
.mt-p40{margin-top:40px !important;}
.mt-p50{margin-top:50px !important;}
.mt-p60{margin-top:60px !important;}
.mt-p70{margin-top:70px !important;}
.mt-p80{margin-top:80px !important;}
.mt-p90{margin-top:90px !important;}
.mt-p100{margin-top:100px !important;}
.mt-p120{margin-top:150px !important;}
.mt-p150{margin-top:150px !important;}
.mt-p200{margin-top:200px !important;}
.mt-p250{margin-top:250px !important;}
.mt-p300{margin-top:300px !important;}

/*컬러*/
.color_1 {background:#169dd6}
.color_2 {background:#14d53d}
.color_3 {background:#3814ff}
.color_4 {background:#7520c5}

/* 기본테이블 */
.tbl_wrap table {width:100%;border-collapse:collapse;border-spacing: 0 5px;border:1px solid #ccc;} 
.tbl_wrap caption {padding:10px 0;font-weight:bold;text-align:left}
.tbl_head01 {margin:0 0 10px}
.tbl_head01 caption {padding:0;font-size:0;line-height:0;overflow:hidden}
.tbl_head01 thead th {padding:10px 0;font-weight:normal;text-align:center;border-bottom:1px solid #ddd;background:#fafafa;height:40px}
.tbl_head01 thead th input {vertical-align:top} /* middle 로 하면 게시판 읽기에서 목록 사용시 체크박스 라인 깨짐 */
.tbl_head01 tfoot th, .tbl_head01 tfoot td {padding:10px 0;border-top:1px solid #c1d1d5;border-bottom:1px solid #c1d1d5;background:#d7e0e2;text-align:center}
.tbl_head01 tbody th {padding:8px 0;border-bottom:1px solid #e8e8e8}
.tbl_head01 td {color:#666;background:#fff;padding:10px 5px;border-top:1px solid #ecf0f1;line-height:1.4em;height:60px;word-break:break-all}
.tbl_head01 tbody tr:hover td{background:#fafafa;}
.tbl_head01 a:hover {text-decoration:underline}

.tbl_head02 {margin:0 0 10px}
.tbl_head02 caption {padding:0;font-size:0;line-height:0;overflow:hidden}
.tbl_head02 thead th {padding:5px 0;border-top:1px solid #d1dee2;border-bottom:1px solid #d1dee2;background:#e5ecef;color:#383838;font-size:0.95em;text-align:center;letter-spacing:-0.1em}
.tbl_head02 thead a {color:#383838}
.tbl_head02 thead th input {vertical-align:top} /* middle 로 하면 게시판 읽기에서 목록 사용시 체크박스 라인 깨짐 */
.tbl_head02 tfoot th, .tbl_head02 tfoot td {padding:10px 0;border-top:1px solid #c1d1d5;border-bottom:1px solid #c1d1d5;background:#d7e0e2;text-align:center}
.tbl_head02 tbody th {padding:5px 0;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9;background:#fff}
.tbl_head02 td {padding:5px 3px;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9;background:#fff;line-height:1.4em;word-break:break-all}
.tbl_head02 a {}

/* 폼 테이블 */
.tbl_frm01 {margin:0 0 20px}
.tbl_frm01 table {width:100%;border-collapse:collapse;border-spacing:0}
.tbl_frm01 th {width:70px;padding:7px 13px;border:1px solid #e9e9e9;border-left:0;background:#f5f8f9;text-align:left}
.tbl_frm01 td {padding:7px 10px;border-top:1px solid #e9e9e9;border-bottom:1px solid #e9e9e9;background:transparent}
.wr_content textarea,.tbl_frm01 textarea,.form_01 textarea, .frm_input {border:1px solid #ccc;background:#fff;color:#000;vertical-align:middle;border-radius:3px;padding:5px;
-webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
-moz-box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
box-shadow: inset 0 1px 1px rgba(0, 0, 0, .075);
}
.tbl_frm01 textarea {padding:2px 2px 3px}
input[type=text].frm_input,input[type=password].frm_input {height:40px;}

.full_input{width:100%}
.half_input{width:49.5%}
.tbl_frm01 textarea, .write_div textarea {width:100%;}
.tbl_frm01 a {text-decoration:none}
.tbl_frm01 .frm_file {display:block;margin-bottom:5px}
.tbl_frm01 .frm_info {display:block;padding:0 0 5px;line-height:1.4em}

/*기본 리스트*/
.list_01 li{border:1px solid #dbdbdb;background:#fff;border-radius:3px;margin:3px 0;padding:10px 15px;list-style:none;position:relative;}
.list_01 li:after {display:block;visibility:hidden;clear:both;content:""}
.list_01 li:hover{background:#f9f9f9}
.list_01 li.empty_li{text-align:center;padding:20px 0;color:#666}
/*폼 리스트*/
.form_01 h2{margin:0 0 10px;font-size:1.167em}
.form_01 li{margin:10px 0}
.form_01 li:after {display:block;visibility:hidden;clear:both;content:""}
.form_01 li .right_input{float:right}
.form_01 textarea{height:100px;width:100%}
.form_01 .frm_label{display:inline-block;width:130px}

/* 자료 없는 목록 */
.empty_table {padding:50px 0 !important;text-align:center}
.empty_list {padding:20px 0 !important;color:#666;text-align:center}

/* 필수입력 */
.required, textarea.required {/*background-image:url('../img/require.png')  !important;background-repeat:no-repeat   !important;background-position:right top  !important;*/}

/* 테이블 항목별 정의 */
.td_board {width:80px;text-align:center}
.td_category {width:80px;text-align:center}
.td_chk {width:30px;text-align:center}
.td_date {width:60px;text-align:center}
.td_datetime {width:110px;text-align:center}
.td_group {width:80px;text-align:center}
.td_mb_id {width:100px;text-align:center}
.td_mng {width:80px;text-align:center}
.td_name {width:100px;text-align:left}
.td_nick {width:100px;text-align:center}
.td_num {width:50px;text-align:center}
.td_numbig {width:80px;text-align:center}
.td_stat {width:60px;text-align:center}

.txt_active {color:#5d910b}
.txt_done {color:#e8180c}
.txt_expired {color:#ccc}
.txt_rdy {color:#8abc2a}

/* 검색결과 색상 */
.sch_word {color:#00c4ac}

/* 자바스크립트 alert 대안 */
#validation_check {margin:100px auto;width:500px}
#validation_check h1 {margin-bottom:20px;font-size:1.2em;text-align: center;}
#validation_check p {margin-bottom:20px;padding:30px 20px;border:1px solid #e9e9e9;background:#fff;text-align: center;}
#validation_check .btn_confirm{text-align: center;}
/* 페이징 */
.pg_wrap {clear:both;margin:30px 0 ;text-align:center; line-height:30px;}
.pg_wrap:after {display:block;visibility:hidden;clear:both;content:""} 
.pg {}
.pg_page, .pg_current {font-size:12px; display:inline-block;vertical-align:middle;line-height:23px;}
.pg a:focus, .pg a:hover {text-decoration:none}
.pg_page {color:#171717; min-width:23px; height:23px;text-decoration:none;}
.pg_page:hover{font-weight:800; }
.pg_start {text-indent:-999px;overflow:hidden;background:url('/image/btn_prev2.gif') no-repeat 50% 50% #fff; padding:0;}
.pg_prev {text-indent:-999px;overflow:hidden;background:url('/image/btn_prev2.gif') no-repeat 50% 50% #fff; padding:0;}
.pg_end {text-indent:-999px;overflow:hidden;background:url('/image/btn_next2.gif') no-repeat 50% 50% #fff; padding:0;}
.pg_next {text-indent:-999px;overflow:hidden;background:url('/image/btn_next2.gif') no-repeat 50% 50% #fff; padding:0;}
.pg_start:hover,.pg_prev:hover,.pg_end:hover,.pg_next:hover{}

.pg_current {display:inline-block;color:#fff;
width: 23px;
height: 23px;
/* UI Properties */
background: #122C2B 0% 0% no-repeat padding-box;
border-radius: 5px;
}

/* cheditor 이슈 */
.cheditor-popup-window *, .cheditor-popup-window :after, .cheditor-popup-window :before {
-webkit-box-sizing: content-box;
-moz-box-sizing: content-box;
box-sizing: content-box;
}

/* 알림 */
#float_notice{width:100%;height:3rem;position:fixed;bottom:0;text-align:center;background:rgb(0,0,0,0.5);color:#FFFFFF;font-size:1.2rem;line-height:3rem;display:none;}

/*=================================== 테이블 ===================================*/
table th,table td{font-size:1rem;}
table td.empty-table{padding:1.5rem 0!important;}

.table-x {border-top:1px solid #ababab;  border-left:1px solid #dedede; border-right:1px solid #dedede;margin-bottom: 1.5rem; }
.table-x td, .table-x th{border-left:1px solid #dedede; border-right:1px solid #dedede; border-bottom:1px solid #dedede; color:#000; font-weight:400;}
.table-x th { text-align:center;vertical-align:middle;font-weight:500;padding:0.5rem 0.3rem ;word-wrap:normal;white-space: nowrap;word-break: keep-all; overflow: hidden;}
.table-x th:not(.no-bg) {background:#f7f7f7;}
.table-x td{text-align:center;vertical-align:middle;padding:0.35rem 0.3rem;}
.table-x td:last-child, .table-x th:last-child{}
.table-x tfoot td{background:#efefef; border-top:1px solid #dedede !important;}
.table-x td.nowrap{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
.table-x .border-bottom-2{border-bottom:2px solid #ababab !important;}
.table-x .info{font-size:0.825rem;color:#989898;}

.table-y {border-top:1px solid #ababab;  }
.table-y td, .table-y th{border-right:1px solid #dedede; border-bottom:1px solid #dedede; color:#000; font-weight:400;}
.table-y th { text-align:center;vertical-align:middle;font-weight:500;padding:0.5rem 0.3rem;}
.table-y th:not(.no-bg) {background:#f7f7f7;}
.table-y td{text-align:left;vertical-align:middle; padding:0.35rem 0.35rem;}
.table-y td:last-child,.table-x th:last-child{border-right:none;}
.table-y tfoot td{background:#f7f7f7; border-top:1px solid #ababab !important;}
.table-y td.nowrap{white-space:nowrap;text-overflow:ellipsis;overflow:hidden;}
.table-y .info{display:block;font-size:0.825rem;color:#989898;}


.table-y.table-div2 th{width:30%; }
.table-y.table-div2 td{width:70%; }

tr.deleted td  {color:#aaa;}

.grid0-head{width:11%;min-width:80px;}
.grid1-head{width:15%;min-width:90px;}
.grid2-head{width:25%;min-width:120px;}
.grid3-head{width:30%;min-width:150px;}
.grid4-head{width:40%;min-width:200px;}

td .s-tit{font-size:1.1rem;line-height:1.2rem;font-weight:500;color:#000;text-align:left;margin-bottom:0.5rem;}

.table-xs td,.table-xs th{padding:0 0.3rem 0 0.3rem;word-wrap: normal;word-break: keep-all;}

.table-small td, .table-small th {font-size:0.925rem !important;}

.table-fsmall th, .table-fsmall td{font-size:0.825em !important;padding:0.15rem 0.15rem;}
.table-fsmall td.small{font-size:0.825em !important;min-width:40px !important;}

.table-fmid th, .table-fmid td{font-size:0.875em !important;padding-left:0.45rem !important;padding-right:0.45rem !important;}
.table-fmid td.small{font-size:0.875em !important;min-width:40px !important;}

.table-ysmall th, .table-ysmall td{font-size:0.825em !important;padding:0.15rem 0.15rem;}
.table-ysmall td.small{font-size:0.825em !important;min-width:40px !important;}

.table-ymid th, .table-ymid td{font-size:0.875em !important;padding-left:0.45rem !important;padding-right:0.45rem !important;}
.table-ymid td.small{font-size:0.875em !important;min-width:40px !important;}

table.responsive-tb1 td:not(.empty_table):before{display: none;}
table.responsive-tb2 td:not(.empty_table):before{display: none;}

table.responsive-tb1 td span.th { 
	/* Now like a table header */
	display: inline-block;
	position: relative;
	width: 130px; 
	align-self: stretch;
	line-height:3rem;
	margin:-0.3rem 0.5rem -0.3rem 0; 
	padding-left: 0.5rem; 
	padding-right: 0.5rem;
	border-right: 1px solid #eee; 
	white-space: nowrap;
	background:#f7f7f7;
	font-weight:600;
}
table.responsive-tb1 tr.block-tr td{ 		
	
	width:100%;	
}

@media only screen and (max-width:991px) {
	.table-x.responsive-lg{border-top:1px solid #eee;border-left:0;border-right:0;}
	.table-x.responsive-lg td{border-left:0;border-right:0; padding:0.5rem 0;}
	.table-x.responsive-lg td{}

}
@media only screen and (max-width:768px) {

	
	table.responsive-tb1{border:none;}
	table.responsive-tb1 thead, table.responsive-tb1 tbody, table.responsive-tb1 th { 
		display: block; 
	}
	table.responsive-tb1 tr { 
		display: flex; 
		justify-content: flex-start;
		flex-wrap: wrap;
		border-top: 1px solid #ccc; 
		border-bottom: 1px solid #ccc; 
		margin-bottom:0.8rem; 		
	}	
	table.responsive-tb1 tr.tr-mid { 		
		border-bottom:0; 
		margin-bottom:0; 		
	}
	
	table.responsive-tb1 td { 		
		width:50%;		
	}
	table.responsive-tb1 td.block-td { 		
		width:100%;	
		border-right:0 !important;	
	}
	table.responsive-tb1 td img.thumb{ 		
		height:30px;
	}
	table.responsive-tb1 colgroup{display: none;visibility:collapse;}
	/* Hide table headers (but not display: none;, for accessibility) */
	table.responsive-tb1 thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	table.responsive-tb1 td { 
		/* Behave  like a "row" */
		border: none;
		border-bottom: 1px solid #eee; 						
	}
	table.responsive-tb1 td:not(.empty_table) { 		
		text-align: left;
		display: flex;
		justify-content: flex-start;	
		align-items: center;
		position: relative;
		padding:0.3rem 0.3rem 0.3rem 0; 		
		line-height:100%;
	}
	
	table.responsive-tb1 td:nth-child(odd) { 
		border-right: 1px solid #eee; 
	}
	table.responsive-tb1 td:not(.empty_table):before { 
		/* Now like a table header */
		display: inline-block;
		position: relative;
		width: 130px; 
		align-self: stretch;
		line-height:3rem;
		margin:-0.3rem 0.5rem -0.3rem 0; 
		padding-left: 0.5rem; 
		padding-right: 0.5rem;
		border-right: 1px solid #eee; 
		white-space: nowrap;
		background:#f7f7f7;
		font-weight:600;
		
	}
	table.responsive-tb1 td.block-td:not(.empty_table):before { 
		/* Now like a table header */		
		width: 130px; 
	}
	
	table.responsive-tb1 td select,table.responsive-tb1 td input{max-width:100%; }
	/*
	Label the data
	*/
	
	table.responsive-tb2{border:none;}
	table.responsive-tb2 thead, table.responsive-tb2 tbody, table.responsive-tb2 th { 
		display: block; 
	}
	table.responsive-tb2 tr { 
		display: flex; 
		justify-content: flex-start;
		align-items: center;
		flex-wrap: wrap;
		
	}
	table.responsive-tb2 td { 
		display: flex; 
		align-items: center;
		width:100%;		
	}
	table.responsive-tb2 colgroup{display: none;}
	/* Hide table headers (but not display: none;, for accessibility) */
	table.responsive-tb2 thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	table.responsive-tb2 tr { 
	border-top: 1px solid #ccc; 
	border-bottom: 1px solid #ccc; 
	margin-bottom:0.8rem; 
	}
	table.responsive-tb2 td { 
		/* Behave  like a "row" */
		border: none !important ;
		border-bottom: 1px solid #eee!important; 			
		position: relative;
		padding:0.3rem 0.3rem 0.3rem 0; 
		text-align: left;
	}
	
	table.responsive-tb2 td:not(.empty_table):before { 
		/* Now like a table header */		
		position: relative;		
		display: inline-block;
		width: 120px;
		align-self: stretch;
		line-height:3rem;
		margin:-0.3rem 0.5rem -0.3rem 0; 
		padding-left: 0.5rem; 
		padding-right: 10px; 
		border-right: 1px solid #eee; 	
		white-space: nowrap;
		background:#f7f7f7;
		font-weight:600;
	}
	table.responsive-tb2 td.block-td:not(.empty_table):before { 
		/* Now like a table header */				
		width: 120px; 
	}

}

@media only screen and (max-width:576px) {
	
	table.responsive-tb1 thead, table.responsive-tb1 tbody, table.responsive-tb1 th { 
		display: block; 
	}
	table.responsive-tb1 tr { 
		display: flex; 
		justify-content: flex-start;
		align-items: center;
		flex-wrap: wrap;
		
	}
	table.responsive-tb1 td { 
		display: flex; 
		width:100%;		
	}
	table.responsive-tb1 colgroup{display: none;}
	/* Hide table headers (but not display: none;, for accessibility) */
	table.responsive-tb1 thead tr { 
		position: absolute;
		top: -9999px;
		left: -9999px;
	}
	
	table.responsive-tb1 tr { border-bottom: 1px solid #ccc; }
	
	table.responsive-tb1 td { 
		/* Behave  like a "row" */
		border: none !important ;
		border-bottom: 1px solid #eee!important; 	
		
		position: relative;
		padding:0.3rem 0.3rem 0.3rem 0; 
		text-align: left;
	}
	
	table.responsive-tb1 td:not(.empty_table):before { 
		/* Now like a table header */		
		position: relative;		
		display: inline-block;
		width: 120px;		
		align-self: stretch;
		line-height:3rem;
		margin:-0.3rem 0.5rem -0.3rem 0; 
		padding-left: 0.5rem; 
		padding-right: 10px; 
		border-right: 1px solid #eee;
		
	}
	table.responsive-tb1 td.block-td:not(.empty_table):before { 
		/* Now like a table header */				
		width: 120px; 
	}
	
	table.responsive-tb1 td span.th { 
	/* Now like a table header */	
	width: 120px; 	
	}

	table.responsive-tb2 td:before { 		
		width: 100px;
		min-width:100px;
	}
	table.responsive-tb2 td.block-td:before { 
		/* Now like a table header */				
		width: 100px; 
	}
}


@media only screen and (max-width:576px) {
	

	table.responsive-form1 > thead, table.responsive-form1 >  tbody,
	table.responsive-form1 > tbody > tr > th, 
	table.responsive-form1 > tbody > tr ,
	table.responsive-form1 > tbody > tr > td,
	table.responsive-form1 > tr > th, 
	table.responsive-form1 > tr ,
	table.responsive-form1 > tr > td { 
		display: block; 	
		width:100%;		
	}	

	
	table.responsive-form1 > tbody > tr,table.responsive-form1 > tr { border-bottom: 1px solid #ccc; }
	table.responsive-form1 > tbody > tr > th,
	table.responsive-form1 > tr > th{ 
		text-align: left;
		display:flex;
		align-items: center;
		border:none;
		border-bottom: 1px solid #ededed;
	}
	table.responsive-form1 > tbody >  tr > td,
	table.responsive-form1 > tr > td{ 
		/* Behave  like a "row" */
		border: none;		
		position: relative;
		padding:0.3rem 0.3rem 1rem 0.3rem; 
		text-align: left;		
		height:auto;
		
	}
	
	colgroup{display:none;}
	.grid1-head,.grid2-head , .grid3-head ,.grid4-head,col {width:100%;}
		
}
/* 테이블 그리드 padding 0 5px 고려한 넓이 */
.grid_1 {width:40px}
.grid_2 {width:100px}
.grid_3 {width:120px}
.grid_4 {width:190px}
.grid_5 {width:240px}
.grid_6 {width:290px}
.grid_7 {width:340px}
.grid_8 {width:390px}
.grid_9 {width:440px}
.grid_10 {width:490px}
.grid_11 {width:540px}
.grid_12 {width:590px}
.grid_13 {width:640px}
.grid_14 {width:690px}
.grid_15 {width:740px}
.grid_16 {width:790px}
.grid_17 {width:840px}
.grid_18 {width:890px}
 
.fs-10p{font-size:10px;}
.fs-12p{font-size:12px;}
.fs-13p{font-size:13px;}
.fs-14p{font-size:14px;}
.fs-15p{font-size:15px;}
.fs-16p{font-size:16px;}
.fs-18p{font-size:18px;} 
.fs-20p{font-size:20px;} 
.fs-24p{font-size:24px;} 
.fs-28p{font-size:28px;} 
.fs-30p{font-size:30px;} 
.fs-32p{font-size:32px;} 
.fs-34p{font-size:34px;} 
.fs-60p{font-size:60px;} 
.fs-80p{font-size:80px;} 

  
.fs-08r{font-size:0.8rem;}
.fs-09r{font-size:0.9rem;}
.fs-1r{font-size:1rem;}
.fs-11r{font-size:1.1rem;}
.fs-12r{font-size:1.2rem;}
.fs-13r{font-size:1.3rem;}
.fs-14r{font-size:1.4rem;}
.fs-15r{font-size:1.5rem;}
.fs-16r{font-size:1.6rem;}
.fs-17r{font-size:1.7rem;}
.fs-18r{font-size:1.8rem;}
.fs-19r{font-size:1.9rem;}
.fs-2r{font-size:2rem;}
.fs-22r{font-size:2.2rem;}
.fs-25r{font-size:2.5rem;}
.fs-27r{font-size:2.7rem;}
.fs-3r{font-size:3rem;}
.fs-32r{font-size:3.2rem;}
.fs-35r{font-size:3.5rem;}
.fs-37r{font-size:3.7rem;}
.fs-4r{font-size:3rem;}
 
.fw-1{font-weight:100 !important;}
.fw-2{font-weight:200 !important;}
.fw-3{font-weight:300 !important;}
.fw-4{font-weight:400 !important;}
.fw-5{font-weight:500 !important;}
.fw-6{font-weight:600 !important;}
.fw-7{font-weight:700 !important;}
.fw-8{font-weight:800 !important;}
 
.text-gray{color:#A6ACB1 !important;}
 
.btn-group-xs>.btn, .btn-xs {
    padding: .15rem .25rem;
    font-size: .775rem;
    line-height: 1.5;
    border-radius: .2rem;
}

.btn-light{border:1px solid #dfdfdf;}

.ui-datepicker .ui-datepicker-title select {
    margin: 1px 2px !important;
	height:2em;
	border-radius:3px;
}


.btn-purple{
    color: #fff;
    background-color: #6564CB;
    border-color: #6564CB;
}

.btn-purple:hover{
    color: #fff;
    background-color: #5192D8;
    border-color: #3BC7E7;
}

	
.page-item.active .page-link {
    z-index: 1;
    color: #fff;
    background-color: #565656;
    border-color: #676767;
}

.alert {
width:auto !important;
position: relative;
display:block;
padding: .25rem 1.25rem;
margin: .25rem 0;
border: 1px solid transparent;
border-radius: .25rem;
}

.search-form span{display:inline-block;;margin-bottom:1%;}
.search-form input,.search-form select ,.search-form a{width:auto;margin-bottom:1%;}
.search-form input,.search-form select,.search-form a,.search-form button{vertical-align:middle;}

.cursor-pointer{cursor:pointer;}
.required{/*background:url('../img/require.png')  top right no-repeat #fff !important*/}


.filebox label {display:block;/*display: inline-block; padding: .5em .75em; color: #999; font-size: inherit; line-height: normal; vertical-align: middle; background-color: #fdfdfd; cursor: pointer; border: 1px solid #ebebeb; border-bottom-color: #e2e2e2; border-radius: .25em; */} 
.filebox input[type="file"] { /* 파일 필드 숨기기 */ position: absolute; width: 1px; height: 1px; padding: 0; margin: -1px; overflow: hidden; clip:rect(0,0,0,0); border: 0; }
.filebox span {width:80%;display:inline-block;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;text-align:left;}


.overflow-ellipsis{overflow:hidden;text-overflow:ellipsis;}
.nowrap{white-space:nowrap;word-break:keep-all;}


input.designed[type=checkbox] {  
    display: none;  
}

input.designed[type=checkbox] + label{
    display: inline-block;  
    cursor: pointer;  
    position: relative;  
    padding-left: 34px;  
    margin-right: 0;  
    font-size: 1rem;
}


input.designed[type=checkbox]+ label:before {     
    content: "";  
    display: inline-block;  
    width: 22px;  
    height:22px;  
    margin-right: 32px;  
	margin-top:-12px;
    position: absolute;  
	top:50%;
    left: 0;  
    bottom: 1px;  
    background-color: #fff; 
	border:1px solid #999999;
    border-radius: 3px; 
}
input.designed.blank[type=checkbox]+ label:before {     
    margin-right: 0px;
    left: 6px; 
}
input.designed[type=checkbox]:checked + label:before { 
    content: "\2713";  
    text-shadow: 0.1rem 0.1rem 0.1rem rgba(0, 0, 0, .2);  
    font-size: 1rem; 
    font-weight:800; 
    color: #fff;  
    background:#2f87c1;
    text-align: center;  
    line-height: 22px;
} 

input.designed2[type=checkbox] {  
    display: none;  
}

input.designed2[type=checkbox] + label{
    display: inline-block;  
    cursor: pointer;  
    position: relative;  
    padding-left: 40px;  
    margin-right: 0rem;  
    font-size: 1rem;
	line-height: 32px;
}

input.designed2[type=checkbox]+ label:before {     
    content: "";  
    display: inline-block;  
    width: 32px;  
    height:32px;
    margin-right: 10px;  
	margin-top:-15px;
    position: absolute;  
	top:50%;
    left: 0;  
    bottom: 1px;  
    background-color: #fff; 
	border:3px solid #E39D19;
    border-radius: 4px; 
}

input.designed2[type=checkbox]:checked + label:before { 
    content: "";      
    background:url('/image/checkbox_on.png') 50% 50% no-repeat;	
}

input.designed3[type=checkbox] {  
    display: none;  
}

input.designed3[type=checkbox] + label{
    display: inline-block;  
    cursor: pointer;  
    position: relative;  
    padding-left: 25px;  
    margin-right: 0rem;  
    font-size: 1rem;
	line-height: 22px;
}

input.designed3[type=checkbox]+ label:before {     
    content: "";  
    display: inline-block;  
    width: 20px;  
    height:20px;  
    margin-right: 4px;  
	margin-top:-10px;
    position: absolute;  
	top:50%;
    left: 0;  
    bottom: 1px;  
    background-color: #fff; 
	border:1px solid #999999;
    border-radius: 4px; 
}

input.designed3[type=checkbox]:checked + label:before { 
    content: "";      
    background:url('/image/checkbox_on3.png') 50% 50% no-repeat;
	background-size:20px 20px;
} 

input.designed4[type=checkbox] {  
    display: none;  
}

input.designed4[type=checkbox] + label{
    display: inline-block;  
    cursor: pointer;  
    position: relative;  
    padding-left: 20px;  
    margin-right: 0rem;  
    font-size: 1rem;
	line-height: 22px;
}

input.designed4[type=checkbox] + label:before {     

    content: "";  
    display: inline-block;  
  
    width:15px;  
    height:15px;  
  
    margin-right: 4px;  
	margin-top:-6px;
    position: absolute;  
	top:50%;
    left: 0;  
    bottom: 1px;  
    background-color: #fff; 
	border:1px solid #999999;
    border-radius: 4px; 
}

input.designed4[type=checkbox]:checked + label:before { 
    content: "";      
    background:url('/image/checkbox_on4.png') 50% 50% no-repeat;
	background-size:20px 20px;
} 


input.designed[type=radio] {  
    display: none;  
}

input.designed[type=radio] + label{
    display: inline-block;  
    cursor: pointer;  
    position: relative;  
    padding-left: 25px;  
    margin-right: 0;  
    font-size: 1rem;
}

input.designed[type=radio]+ label:before {     

    content: "";  
    display: inline-block;    
    width: 20px;  
    height: 20px;   
    margin-right: 25px;  
	margin-top:-10px;
    position: absolute;  
	top:50%;
    left: 0;  
    background:url('/image/radio_off.svg') 50% 50% no-repeat;	
}
input.designed[type=radio]:checked + label:before {     
	content: ""; 
	background:url('/image/radio_on.svg') 50% 50% no-repeat;	
} 

/*--------------------------------------------------------------
# ajax
--------------------------------------------------------------*/
#ajaxhtml{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:800px;max-width:100%; max-height:90vh;background:#fff; border-radius: 10px; z-index:1041;}
#ajaxhtml .close{position: absolute;top:15px;right:15px;display: inline-block;}
#ajaxhtml .cont{margin:1rem 0;overflow-y:auto;max-height:80vh; padding:40px;}

#ajaxhtml2{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:800px;max-width:100%; max-height:90vh;background:#fff; border-radius: 10px; z-index:1041;}
#ajaxhtml2 .close{position: absolute;top:15px;right:15px;display: inline-block;}
#ajaxhtml2 .cont{margin:1rem 0;overflow-y:auto;max-height:80vh; padding:40px;}

#ajaxtable{position:fixed;top:50%;left:50%;transform:translate(-50%,-50%);width:800px;max-width:100%; max-height:90vh;background:#fff; border-radius: 10px; z-index:1041;}
#ajaxtable .close{position: absolute;top:15px;right:15px;display: inline-block;}
#ajaxtable .cont{margin:1rem 0;overflow-y:auto;max-height:80vh; padding:40px;}

@media only screen and (max-width:768px) {
	#ajaxhtml .cont{margin:0.5rem 0; padding:20px;}
}


@media only screen and (max-width:576px) {
	#ajaxhtml .cont{margin:0.3rem 0; padding:10px;}
}
#mask {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    max-height: 100vh;    
    z-index: 1041;    
	backdrop-filter: blur(3px) brightness(80%) grayscale(50%);
	/*
	backdrop-filter: brightness(60%);
	backdrop-filter: contrast(40%);
	backdrop-filter: drop-shadow(4px 4px 10px blue);
	backdrop-filter: grayscale(30%);
	backdrop-filter: hue-rotate(120deg);
	backdrop-filter: invert(70%);
	backdrop-filter: opacity(20%);
	backdrop-filter: sepia(90%);
	backdrop-filter: saturate(80%);
	*/
}
