html { font-size: 12px; overflow-y: hidden; }
header *, nav *, footer * { margin: 0; padding: 0; border: 0; /* -ms-user-select: none; -moz-user-select: -moz-none; -khtml-user-select: none; -webkit-user-select: none; user-select: none; */ }
body, button, dd, dl, dt, fieldset, form, h1, h2, h3, h4, h5, h6, input, legend, p, select, textarea, img { margin: 0; padding: 0; }
fieldset { border:0; padding:0; }
body, button, input, select, textarea { font-family: 'Malgun Gothic', '맑은 고딕', dotum, '돋움', sans-serif; }
a, a:link { text-decoration: none; }
header ol, nav ol, footer ol, header ul, nav ul, footer ul, header li, nav li, footer li { list-style: none; }
legend { display: none; }
/*  Link    */
a:link, a:visited, a:active { text-decoration: none; color: var(--a-link); }
a:hover { text-decoration: none; color: var(--a-hover); }
/*	INPUT   */
label, input, select, textarea { box-sizing: border-box; }
div.input_hr { height:1px; width:100%; background-color: var(--hr-bg); margin-top:5px; margin-bottom:5px; }
div.input_br { height:1px; width:100%; }
input[type='password'], 
input[type='text'], 
input[type='date'], 
input[type='number'], 
input[type='month'], 
select, 
textarea { border: solid 1px var(--input-border); margin-top:2px; height: 24px; }
input[type='radio'] { height:11px; margin-top:7px; margin-left:5px; margin-right:3px; }
input[type="checkbox"] { display: inline; border-radius: 0px; border: none; transform: translate(0px, 3px); }
input[type="password"], input[type="text"], input[type="number"], input[type="tel"] { padding: 2px; border-radius: 2px; }
input[type="date"] { padding: 1px; border-radius: 2px; }
input[type="number"], input.inp_number { text-align:right; }
input[readonly] { background-color: var(--input-readonly); }
select { padding: 2px; border-radius: 2px; }
textarea { margin-top: 2px; margin-bottom: 3px; padding: 3px; border-radius: 2px; }
input[type="text"]:focus, input[type="number"]:focus, input[type="password"]:focus, select:focus { background-color: var(--input-focus); }
input.span { margin-bottom: -7px; transform: translate(0%, -10px); }
label { display: inline-block; width: 90px; height: 24px; color:var(--lbl); background-color: var(--lbl-bg); border: solid 1px var(--lbl-border); margin-top:2px; margin-left: 2px; padding-top: 2px; text-align: center; vertical-align: top; white-space: nowrap; }
label.default:after { content:'(*)'; font-weight:700; color: var(--lbl-default);}
/*	TAG		*/
hr { display: none; border: 0px; background-color: var(--hr-bg); height: 1px; margin: 4px 0px; }
h1 { color: #FFF; }
/*	LAYOUT	*/
header, nav, main, aside, footer { margin: 0; padding: 0; box-sizing: border-box; }
/*  SECTION  */
.section_title { 
  border-bottom: solid 2px var(--section-title-border); 
  color: var(--section-title-color); 
  padding: 5px 5px 2px 20px; 
  margin-bottom: 10px; 
  font-weight: 700; 
  font-size: var(--size-sx); 
}
.resize_list { background-color: var(--list-bg); border-top: solid 2px var(--list-border); border-bottom: solid 1px var(--list-border); overflow-x:auto; }
.section_list { background-color: var(--list-bg); border-top: solid 2px var(--list-border); border-bottom: solid 1px var(--list-border); }
.section_control { align-items: center; justify-content: center; padding-bottom: 2px; }
.popup_control { border-bottom:solid 1px var(--list-border); align-items: center; justify-content: center; margin-bottom: 5px; padding-top: 5px; padding-bottom: 5px; }
/*  INPUT CONTROL  */
fieldset.lflex { display: flex; flex-flow: row wrap; border:0; }
fieldset.lflex div { margin-right: 3px; }
fieldset.edit {border:0;padding:0;}
fieldset.edit>ul {list-style: none;}
/*	LIST	*/
.list_table { list-style: none; display: table; table-layout: fixed; clear: both; width:100%; border-collapse: collapse; box-sizing: border-box; background-color: transparent; padding: 0; broder:0; margin:0; }
.list_scroll { overflow-y:scroll; overflow-x:hidden; width:100%; }
.list_scroll .list_table { width:100%; }
.list_row { display: table-row; height: 30px; vertical-align: middle; }
.list_row.list_header li { 
  text-align: center; 
  vertical-align: middle; 
  font-weight: 700; 
  background-color: var(--list-header-bg); 
  color: var(--list-header); 
  border-bottom:solid 1px var(--list-header-border); 
}
.list_row li { display: table-cell; vertical-align: middle; border-right: solid 1px transparent; padding-left:2px; padding-right:2px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.list_row.list_header li:nth-child(1n) { border-right: solid 1px var(--list-header-border); }
.list_row.list_header li:nth-last-child(1) { border-right: 0 !important; }
.list_row:hover, 
.list_table li:nth-child(odd) .list_row:hover, 
.list_table li:nth-child(even) .list_row:hover { background-color: var(--list-hover); }
.list_table li:nth-child(odd) .list_row { background-color: var(--list-row-2n); }
.list_table li:nth-child(even) .list_row { background-color: #FFF; }
.list_cell { width: 100%; height: 25px; line-height: 2; margin-top: -2px; margin-bottom: 5px; text-align: center; }
.list_row.row_del li { color: var(--list-row-del); }
.list_row.row_select li { font-weight: 700; color: var(--list-row-select); }
.listGrid.list_header { font-weight:700; color:var(--list-header); background-color:var(--list-header-bg) !important; border-top:solid 1px var(--list-header-border); border-left:solid 1px var(--list-header-border);}
.listGrid.list_header>li { color:var(--list-header) !important; border-right:solid 1px var(--list-header-border); border-bottom:solid 1px var(--list-header-border); width:100%; height:100%; padding:0 !important; text-align:center; line-height:var(--size-xl);}
.listGrid.list_header>li>p { position:relative; top:50%; left:50%; transform: translate( -50%, -50%);}
.list_table > li:nth-child(odd) .listGrid { background-color: var(--list-row-2n); }
.list_table > li:nth-child(even) .listGrid { background-color: #FFF; }
.list_table > li:nth-child(odd) .listGrid:hover,
.list_table > li:nth-child(even) .listGrid:hover { background-color: var(--list-hover); }
/*	LIST GRID	*/
.list_grid.listPadding {padding-top:5px; padding-bottom:5px;}
.list_grid_table { list-style: none; }
.list_grid_table { width: 100%; margin-bottom: 5px; border-collapse: collapse; box-sizing: border-box; background-color: transparent; padding: 0;  }
.list_grid:hover, .list_grid_table li:nth-child(odd) .list_grid:hover { background-color: var(--list-hover); }
.list_grid_table>li { border-bottom: dotted 1px var(--list-border); }
.list_grid_table>li.list_header { border-bottom: 0;}
.list_grid_table>li:last-child { border-bottom: solid 1px var(--list-border);}
.list_grid_table li:nth-child(odd) .list_grid { background-color: var(--list-row-2n); }
.list_grid.list_cell { width: 100%; height: 25px; text-align: center; line-height: 1.5; border-bottom: solid 1px var(--list-border); margin-top: -2px; margin-bottom: 30px; }
.list_grid>li { margin: 0 !important; padding:0 !important; border:0 !important; width:100%; align-self:center;}
.list_grid.row_del>li { color: var(--list-row-del); }
.list_grid.row_select li { font-weight: 700; color: var(--list-row-select); }
.list_grid.list_header { 
  font-weight:700; 
  color:var(--list-header); 
  background-color:var(--list-header-bg) !important; 
  border-top:solid 2px var(--list-header-border) !important; 
  border-left:solid 1px var(--list-header-border) !important;
}
.list_grid.list_header>li { 
  color:var(--list-header) !important; 
  border-right:solid 1px var(--list-header-border) !important; 
  border-bottom:solid 1px var(--list-header-border) !important; 
  width:100%; height:100%; 
  padding:0 !important; 
  text-align:center; 
  line-height:var(--size-xl);
}
.list_grid.list_header>li>p { position:relative; top:50%; left:50%; transform: translate( -50%, -50%);}
/*  LIST SEARCH */
fieldset.list_search { position: relative; border: solid 2px var(--btn-search-bg); margin: 5px 0px; padding-left: 10px; padding-bottom: 2px; padding-right: 85px; display: flex; flex-flow: row wrap; }
fieldset.list_search div:nth-child(n) { margin: 0px 0px 0px 3px; }
fieldset.list_search div:nth-last-child(1) { position: absolute; margin: 0px; padding: 0px; top: 0px; right: -1px; width: 80px !important; height: 100% !important; overflow: hidden; }
fieldset.list_search div:nth-last-child(1) button { width: 100% !important; height: 100% !important; border:0; color: var(--btn-search); cursor: pointer; }
/*	LIST CONTROL */
.list_control { display: flex; flex-flow: row wrap; justify-content: space-between; align-items: center; list-style: none; height:30px; margin-top:2px; margin-bottom:2px; padding:0; }
.list_control .col1 { padding-left: 4px; }
.list_control .col2 { flex: 1; text-align: center; }
.list_control .col2 .btn_group { display: inline-block; margin: 0px auto; text-align: center;}
.list_control .col2 .btn_group :nth-child(n) { padding: 5px 10px; }
.list_control .col3 { padding-right: 4px; }
/** TEXT EDIT VIEW */
.content-canvas {  width: 648px; margin: 20px 0px 10px 20px; overflow: visible; word-wrap:break-word;}
.content-canvas p, .content-canvas br { margin:0; padding:0; }
.content-canvas td { word-break:break-all;}
.content-canvas img { max-width:640px; margin:2px; }
/*  Alignment */
.pc { cursor: pointer; text-align: center; }
.pl { cursor: pointer; text-align: left; }
.pr { cursor: pointer; text-align: right; }
.cc { text-align: center; }
.cl { text-align: left; }
.cr { text-align: right; }
/*  BUTTON GROUP  */
.btn_group { display: flex; flex-direction: row; }
.btn_group button { cursor: pointer; border:0; }
.btn_group :nth-last-child(1) { border-right: solid 1px var(--btn-border-color); }
.btn_group :nth-child(n) { padding: 5px 10px; border-top: solid 1px var(--btn-border-color); border-left: solid 1px var(--btn-border-color); border-bottom: solid 1px var(--btn-border-color); background-color: var(--btn-bg); }
.btn_group :nth-child(n).active, .btn_group :nth-child(n):hover { background-color: var(--btn-bg-hover); font-weight: 500; }
.btn_group :nth-child(n).active { font-weight: 700; }
.btn_group button:hover { background-color: var(--btn-bg-hover); font-weight: 500; }
.btn_group .btn_l { padding: 10px 40px; font-size: var(--size-sx); }
.btn_group .btn_m { padding: 5px 20px; font-size: var(--size-sl); }
.btn_group .btn_s { padding: 2px 10px; font-size: var(--size-ss); }
.btn_group button.btn_primary { color: var(--btn-primary); background-color: var(--btn-primary-bg); }
.btn_group button.btn_primary:hover { color: var(--btn-primary); background-color: var(--btn-primary-hover); }
.btn_group button.btn_search { color: var(--btn-search); background-color: var(--btn-search-bg); }
.btn_group button.btn_search:hover { color: var(--btn-search); background-color: var(--btn-search-hover); }
.btn_group button.btn_info { color: var(--btn-info); background-color: var(--btn-info-bg); }
.btn_group button.btn_info:hover { color: var(--btn-info); background-color: var(--btn-info-hover); }
.btn_group button.btn_warning { color: var(--btn-warning); background-color: var(--btn-warning-bg); }
.btn_group button.btn_warning:hover { color: var(--btn-warning); background-color: var(--btn-warning-hover); }
.btn_group button.btn_danger { color: var(--btn-danger); background-color: var(--btn-danger-bg); }
.btn_group button.btn_danger:hover { color: var(--btn-danger); background-color: var(--btn-danger-hover); }
/*  BUTTON  */
.btn { display: inline-block; padding: 1px 5px; font-size: var(--size-sl); line-height: 1.5; border-radius: 3px; margin-top: -4px; margin-left: 2px; margin-bottom: 0; font-weight: normal; text-align: center; white-space: nowrap; vertical-align: middle; -ms-touch-action: manipulation; touch-action: manipulation; cursor: pointer; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; background-image: none; border: 1px solid transparent; border-radius: 4px; color: var(--btn-default); background-color: var(--btn-default-bg); border-color: var(--btn-default-border); }
.btn_primary { color: var(--btn-primary); background-color: var(--btn-primary-bg); border-color: var(--btn-primary-border); }
.btn_primary:hover { color: var(--btn-primary); background-color: var(--btn-primary-hover); border-color: var(--btn-primary-border); }
.btn_search { color: var(--btn-search); background-color: var(--btn-search-bg); border-color: var(--btn-search-border); }
.btn_search:hover { color: var(--btn-search); background-color: var(--btn-search-hover); border-color: var(--btn-search-border); }
.btn_info { color: var(--btn-info); background-color: var(--btn-info-bg); border-color: var(--btn-info-border); }
.btn_info:hover { color: var(--btn-info); background-color: var(--btn-info-hover); border-color: var(--btn-info-border); }
.btn_warning { color: var(--btn-warning); background-color: var(--btn-warning-bg); border-color: var(--btn-warning-border); }
.btn_warning:hover { color: var(--btn-warning); background-color: var(--btn-warning-hover); border-color: var(--btn-warning-border); }
.btn_danger { color: var(--btn-danger); background-color: var(--btn-danger-bg); border-color: var(--btn-danger-border); }
.btn_danger:hover { color: var(--btn-danger); background-color: var(--btn-danger-hover); border-color: var(--btn-danger-border); }
.btn_lg { padding: 10px 16px; font-size: var(--size-ll); line-height: 1.3333333; border-radius: 6px; }
.btn_sm { padding: 5px 10px; font-size: var(--size-sl); line-height: 1.5; border-radius: 3px; }
.btn_xs { padding: 1px 5px; font-size: var(--size-sl); line-height: 1.5; border-radius: 3px; }
.btn_xx { padding: 1px 3px; font-size: var(--size-ss); line-height: 1.2; border-radius: 3px; }
/*	COMMON	*/
.lbl { font-size: var(--size-ls); line-height: 16px; position: absolute; z-index: 8; top: 16px; left: 15px; color: var(--lbl); border: solid 1px var(--lbl-border); }
.inp { font-size: var(--size-ls); line-height: 16px; position: relative; z-index: 9; width: 100%; height: 16px; padding: 7px 0 6px; border: none; -webkit-appearance: none; }

.fu_file { display:table; width:calc(100% - 10px); margin:2px 0px; }
.fu_tr { display:table-row;table-layout: fixed; }
.fu_control { display:table-cell; width:4%; min-width:45px; }
.fu_control .btn { margin-top:1px; padding: 1px 3px; font-size: 10px; line-height: 1.2; border-radius: 3px; }
.fu_name { display:table-cell; width:70%;}
.fu_size { display:table-cell; width:20%; text-align:right; padding-right:3px;}
/** ckeditor */
.ck .ck-powered-by {display:none;}
/** Image Modal */
#imgModal { display:none; position:fixed; z-index:2000; padding-top:50px; left:0; top:0; width:100%; height:100%; overflow:auto; cursor:pointer; background-color:rgba( 0, 0, 0, 0.8 ); text-align:center; }
#imgModal #imgContent { width:100%; height:calc( 100% - 100px ); overflow:auto; }
#imgModal .modalContent { margin:auto; display: block; height:auto; border-radius:10px; animation-name:zoom; animation-duration:0.8s; }
@keyframes zoom { from { transform:scale(0)} to { transform: scale(1)} }
#imgModal .close { position:absolute; top: 15px; right:35px; color: #f1f1f1; font-size:40px; font-weight:bold; transition:0.3s; }
#imgModal .close:hover, .imgModal .close:focus { color:#bbb; text-decoration:none; cursor:pointer; }
#imgModal img { width:auto; border-radius:10px; cursor:pointer; transition:0.3s; }