@charset "utf-8";

/** reset:Based on work by Eric Meyer
-------------------------------------------*/
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, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, label, legend ,nav,table
 {margin:0; padding:0; border:0;  font-size:100%; vertical-align:middle; background:transparent;}
 /* {margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:middle; background:transparent;}*/

 /* tables still need 'cellspacing="0"' in the markup */
table {border-collapse:collapse; border-spacing:0;}


form, input, select, textarea, label {margin:0; padding:0; border:0; outline:0; font-size:12px; vertical-align:middle;}
body {line-height:1;}
ol, ul {list-style:none;}
blockquote, q {quotes:none;}

/* HTML5 display definitions */
article, aside, details, figcaption, figure, footer, header, hgroup, nav, section {display:block;}

[hidden] {display:none;}
caption, legend {position:absolute;width:0;height:0;overflow:hidden;visibility:hidden;display: none;text-indent:-9999px;font-size:0;}

a { text-decoration: none; }

 /* 컬럼 */
.rowCE {margin-left: 0px;}
.rowCE:before, .rowCE:after {display: table; content: "";}
.rowCE:after {clear: both}

/**
 html 속성에 height: 100%; 를 지정해주어야  table height:100% 가 적용됩니다.
-------------------------------------------*/
html {width: 100%; height: 100%; font-size:12px; line-height:1.6em; color:#151515;   font-family : 'Malgun Gothic','맑은 고딕','Dotum',"돋움"; background-color:#fff;}
body {height:100%; width:100%; background-color:#fff;}

/**  top. 영역 시작
-------------------------------------------*/
#logo {padding:0px 2px 0px 0px;}

#headerWrap {
    min-width: 655px;
    width: 100%;
    /* height: 80px; */
    color: #dfdfdf;
    background: #254a72;
    cursor: default;
    line-height: 80px;
    float: left;
}
#headerWrap .top01 {
    width: 270px !important;
    margin: 0;
    float: left;
    text-align: center;
    line-height: 80px;
    padding-top: 17px;
}
#headerWrap .top01 img{
	vertical-align:middle;
}
#headerWrap .top02 {
    float: left;
}
#headerWrap .top00 {
	position:fixed;
	height:35px;
	top:0;
	right:0;
	width:auto;
    padding-right: 7px;
    float: right;
    color: #fff;
	line-height:23px;
	clear: both;
}

#headerWrap .top04 {
	color: #fff;
	line-height:23px;
}

#headerWrap .top03 {
	height:35px;
    text-align: right;
    padding-right: 7px;
    float: right;
    color: #fff;
    padding-top:40px;
}
.user img {
    margin-right: 7px;
    vertical-align: -4px;
}
.top03 .topBtn {
    margin-right: 5px;
    border: 2px solid #fff;
    border-radius: 25px;
    padding: 2px 10px 3px;
    line-height: 1.7;
    float: right;
    text-decoration: none;
    color: #fff;
    margin: 8px 0 0 5px;
    display: block;
    font-weight: bold;
}

.topBtn.popover .sbux-pop-content {
	color: #000;
}

.top03 span a {
    color: #fff;
}
.top03 span a:hover {
    border: 2px solid #f1d4d4;
    color: #f1d4d4;
    display: block;
}
.top03 .popover span a:hover {
	color: #000;
}

.link a{
	padding-right: 17px;
	background:url(/images/com/ico_m.png)no-repeat right center;
	color: #fff;
}
.link a:hover{
	background:url(/images/com/ico_m_hover.png)no-repeat right center;
	color: #f1d4d4;
}
#mainNav ul {
    font-size: 14px;
    font-weight: bold;
    overflow: hidden;
}
#mainNav ul li {
    color: #fff;
    padding: 3px 15px 7px 15px;
    display: inline;
    text-align: center;
    height: 100%;
    text-shadow: 0px 0px #243673;
    line-height: 80px;
    font-weight: bold;
    font-size:15px;
}
#mainNav ._on {
    font-size: 14px;
    color: #fff;
    border-top: 5px solid #fff;
    line-height: 70px;
}
#mainNav ul li span:hover {
    color: #fff;
    border-top: 5px solid #fff;
}

.mainNavClick {
    border-bottom: 5px solid #fff;
}

@media screen and (max-width: 1780px) {
	#headerWrap .top02{width: calc(100% - 700px);}
}

@media screen and (max-width: 1067px){
	#headerWrap .top02{width: 100%;}
	#headerWrap .top03{padding-top:25px;}
}


/**  footerWrap 영역 시작
-------------------------------------------*/
#footerWrap {position:fixed ; bottom:0px; left:0; width:99%; height:25px; line-height:25px; background:#3c454f; color:#fff; z-index:5;padding-left:1%;}
#footerWrap {display:none;}

.content_wrap{
	width: 100%;
	float: left;
}

/**  left 영역 시작
-------------------------------------------*/
#leftWrap {width:270px; height:100%; color:#222222; border-right: 1px solid #dfdfdf; overflow:hidden; cursor:default; background:#f6f6f6;box-sizing: border-box;float: left;}
#leftWrap p {
	padding-left: 33px; 
    margin:12px auto;}
#leftWrap p a {
    display: inline-block;
    line-height: 33px;
}
.left_tab {
    border-radius: 25px;
    border: 2px solid #909cb6;
    color: #555;
    padding: 1.3px 10px 1.5px;
    font-weight: bold;
    cursor: pointer;
    text-decoration: none;
    line-height: 1.9 !important;
}
.left_tab:hover {
    border: 2px solid #316399;
}
.left_footer{
	position: fixed;
    bottom: 0;
    background:#909cb6;
    width: 270px;
    height: 140px;
    padding: 10px;
    box-sizing: border-box;
}
.left_footer_inner{
	border:1px solid #fff;
	text-align:left;
    line-height:1.8;
    font-size:12px;
    height: 100%;
    padding-left: 5px;
}
#leftNav {
    border-top: #dfdfdf solid 1px;
    border-bottom: #dfdfdf solid 1px;
    padding-top: 10px;
    padding-bottom: 10px;
    padding-left: 2px;
    box-sizing: border-box;
    overflow: auto;
}

/** container 영역 시작
-------------------------------------------*/
#container {width:100%; height:120%; position:relative; background-color:#fff;}	/* 컨테이너 */


#container .titArea {height:50px; border-bottom:1px solid #dfdfdf; background: #f3f7fa;}
#container .titArea h1 { font-size:17px; padding-left:25px; margin-left:10px; margin-top:16px; font-weight:bold; background:url("/images/admin/imgs/icoBbsDoc.png") no-repeat 6px 45%; font-family : 'Malgun Gothic','맑은 고딕','Dotum',"돋움";}

#btnArea {float:right; margin-top:15px; margin-right:10px}

#gridArea {width:100%; min-height:100px;}

.formsetArea {padding:5px 10px; background-color:#f6f6f6; border-top:1px solid #dfdfdf;border-bottom:1px solid #dfdfdf;}
.scroll_x{overflow-x: scroll;}
.formsetArea input, .formsetArea select {background-color:#fff; border:1px solid #dfdfdf; font-size:12px;ime-mode:active;}
.formsetArea input:focus, .formsetArea select:focus {border:1px solid #5c9ccc;}
.wInputDate {width:90px; padding-left:5px; background:url("/images/admin/imgs/buttonImg/btn_date.gif") no-repeat right ;}




.txLeft {text-align:left !important;}
.txRight {text-align:right !important;}
.txCenter {text-align:center !important;}

.txStrongColor {color:#007bbd;}
.txStrong {font-weight:bold;}
.txLM {font-size:14px; font-weight:bold;}
.txM {font-size:13px; font-weight:bold;}
.txEnd {color:#6360d5;}

.txRed {color:#ec151e !important; }
.txBlue {color:#007bbd !important;}
.txGreen {color:#54ac4b !important;}
.txOrange  {color:#f0802e !important;}
.txBlack {color:#262626 !important;}
.txPurple {color:#FF00DD !important;}
.txPurple1 {color:#5F00FF !important;}
.txPurple2 {color:#800080 !important;}
.txGray {color:#8C8C8C !important;}

.txRed a{color:#ec151e !important; }
.txBlue a{color:#007bbd !important;}
.txGreen a{color:#54ac4b !important;}
.txOrange  a{color:#f0802e !important;}
.txBlack a{color:#262626 !important;}
.txPurple a{color:#FF00DD !important;}
.txPurple1 a{color:#5F00FF !important;}
.txPurple2 a{color:#800080 !important;}
.txGray a{color:#8C8C8C !important;}


.txColor {color:#505050;}


.bdRed {border:1px solid red;}
.bdGreen {border:1px solid green;}
.bdBlue {border:1px solid blue;}

.bgRed {background:red; !important;}
.bgGreen {background-color:green; !important;}
.bgBlue {background-color:blue !important;}
.bgWhite{background-color:white !important;}
#home{position: right;left:0;}

.main {
    height: 100%;
    float: left;
    /* background: #eee; */
    overflow: hidden;
}

/** 버튼
-------------------------------------------*/
.btnS {
	height:20px; line-height:20px; display:inline-block; text-align:center;
	border: 1px solid #677585; background: #b6b6b6/*#677585*/; border-radius: 4px;
	margin:0px 0 0 0px; cursor:default; padding:0 5px;  font-family:'돋움';font-size:11px;
}
.splitMenu {border-left:1px solid #666; height:35px; width:3px; display:inline-block; text-align:center; margin:0 10px;}



/** 그리드
-------------------------------------------*/
.ceGridWarp,.ceFormWarp {margin:5px  0  0 5px; border:1px solid #dfdfdf;border-bottom:1px solid #fff; }

/** SB그리드 스타일 제어
-------------------------------------------*/
.tree .tree-item, .tree .tree-branch {border:0px solid #f6f6f6 !important; overflow-y:hidden;}
.sbux-tre-item-txt, .sbux-tre-item-chl-txt {color:#222 !important;}
.tab-content { background:#f6f6f6; }


.schFormSet {border-bottom:1px solid #fff !important; margin:0; padding:0;}

.schFormSet  .panel-body {padding:0;}

.schFormSet table:not(.sbux-pik-popwrap table) { clear:both; width:100%; border-top:0px solid #dfdfdf; background:#f6f6f6; margin-bottom:0px;font-size:12px;}
.schFormSet th:not(.sbux-pik-popwrap th) {border-right:0px solid #fff;  text-align:right; line-height:130%; vertical-align:middle; padding:5px 10px;  border:none; border-bottom:1px solid #dfdfdf; border-right:#dfdfdf solid 1px;
max-width:120px;
}
.schFormSet td:not(.sbux-pik-popwrap td) {border-right:0px solid #fff; line-height:130%; text-align:left; padding:3px;  border-bottom:#dfdfdf solid 1px; border-right:#dfdfdf solid 1px; background:#fff; }
.schFormSet td input[type="text"], .schFormSet td input[type="password"], .schFormSet td select {width:100%; border:1px solid #dfdfdf;  }
.schFormSet label {display:inline-block !important; margin-top:6px; }

.readForm > table { clear:both; width:100%; border-top:0px solid #dfdfdf; background:#f6f6f6; margin-bottom:0px;font-size:12px;}
.readForm > th {border-right:0px solid #fff;  text-align:right; line-height:130%; vertical-align:middle; padding:5px 10px; border:none; border-bottom:1px solid #dfdfdf; border-right:#dfdfdf solid 1px;}
.readForm > td {border-right:0px solid #fff; line-height:130%; text-align:left; padding:5px 10px; http://localhost:8070/images/login/cleanEye_logo5.pngborder-bottom:#dfdfdf solid 1px; border-right:#dfdfdf solid 1px; background:#fff; }
.readForm > td input[type="text"], .readForm > td input[type="password"] {width:100%; border:1px solid #dfdfdf;  }
.readForm > label {display:inline-block !important; margin-top:6px; padding-right:15px;}

.listTable table { clear:both; width:100%; border-top:1px solid #dfdfdf; background:#f6f6f6; margin-bottom:0px;font-size:12px; background:#fff;}
.listTable th {border-right:0px solid #dfdfdf;  line-height:130%; vertical-align:middle; padding:10px 3px; border:none; border-bottom:1px solid #dfdfdf;
	color:#222;
	background: rgba(255,255,255,1);
	background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(47%, rgba(246,246,246,1)), color-stop(100%, rgba(237,237,237,1)));
	background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
	background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
	background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
	background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed', GradientType=0 );

}
.listTable td {border-right:0px solid #dfdfdf; line-height:130%; text-align:left; padding:3px; border-bottom:#dfdfdf solid 1px;  }
.listTable td input[type="text"], .schFormSet td input[type="password"], .schFormSet td select {width:100%;  border:1px solid #dfdfdf;  }
.listTable label {display:inline-block !important; margin-top:6px; padding-right:15px; font-weight:normal;}
.listTable h4 { font-size:14px; font-weight:bold; margin-left:30px;}


.sbgrid_fixed_table_st td.sbgrid_fixed_cell_st{
	color:#222;
	background: rgba(255,255,255,1);
	background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(47%, rgba(246,246,246,1)), color-stop(100%, rgba(237,237,237,1)));
	background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
	background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
	background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
	background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed', GradientType=0 );
}
.sbgrid_fixed_table_st td.sbgrid_fixed_cell_st:hover{		/*헤더 영역의 셀에 hover 발생 시 스타일*/
	background: rgba(212,228,239,1);
	background: -moz-linear-gradient(top, rgba(212,228,239,1) 0%, rgba(184,207,224,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(212,228,239,1)), color-stop(100%, rgba(184,207,224,1)));
	background: -webkit-linear-gradient(top, rgba(212,228,239,1) 0%, rgba(184,207,224,1) 100%);
	background: -o-linear-gradient(top, rgba(212,228,239,1) 0%, rgba(184,207,224,1) 100%);
	background: -ms-linear-gradient(top, rgba(212,228,239,1) 0%, rgba(184,207,224,1) 100%);
	background: linear-gradient(to bottom, rgba(212,228,239,1) 0%, rgba(184,207,224,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d4e4ef', endColorstr='#b8cfe0', GradientType=0 );
}

.w30p {width:30%;}
sbgrid_table sbgrid_fixed_table_st sbgrid_FHT sbgrid_FHT_st sbgrid_common


/** table Width */
.wTdNo {width:5%;}
.wTdName {width:8%;}
.wTdDate {width:12%;}
.wTdS{width:10%;}
.wTdMS{width:12%;}
.wTdM{width:15%;}
.wTdCol5{width:20%;}
.wThCol4{width:15%;}
.wTdx8 {width:12.5%;}

.wInput100p { width:100%; }
.wInput90p { width:90% !important; }
.wInput80p { width:79% !important; }
.wInput70p { width:69%; }
.wInput50p { width:49%; }
.wInputDate { width:120px; }
.wInputM { width:60px; }

.w50p {width:50%;}
.w100p {width:100% !important;}

.w50px{width:50px}
.w100px{width:100px}
.w150px{width:150px}
.w200px{width:200px}
.w250px{width:250px}
.w300px{width:300px}

/** 관리자메인
-------------------------------------------*/

.mainAdmin { max-width:99%; margin:0px auto 0; overflow:hidden; margin-bottom:20px; }
.mainAdmin  .col-1 { width:49%;  margin-right:1%; float:left; overflow:hidden;  }
.mainAdmin  .col-2 { width:50%; float:left; overflow:hidden; }
.mainAdmin table {border-right:1px solid #dfdfdf;}
.mainAdmin table th { text-align:center !important; }
.mainAdmin h4 { font-size:17px; padding-left:25px; font-weight:bold; background:url("/images/admin/imgs/icoBbsDoc.png") no-repeat 2px 45%; font-family : 'Malgun Gothic','맑은 고딕','Dotum',"돋움"; margin:10px 0px 8px 10px}

.chartAdmin dl {border:1px solid #dfdfdf; width:100%; margin-left:5px;}
.chartAdmin dt {border-right:0px solid #dfdfdf;  line-height:130%; vertical-align:middle; padding:10px 3px; border:none; border-bottom:1px solid #dfdfdf;
	color:#222;
	background: rgba(255,255,255,1);
	background: -moz-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
	background: -webkit-gradient(left top, left bottom, color-stop(0%, rgba(255,255,255,1)), color-stop(47%, rgba(246,246,246,1)), color-stop(100%, rgba(237,237,237,1)));
	background: -webkit-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
	background: -o-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
	background: -ms-linear-gradient(top, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
	background: linear-gradient(to bottom, rgba(255,255,255,1) 0%, rgba(246,246,246,1) 47%, rgba(237,237,237,1) 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#ffffff', endColorstr='#ededed', GradientType=0 );
}
.chartAdmin dd {min-height:150px;}

/**sbChart 기준선 -------------------------------------------*/
#sbChart .g line, path {stroke: #dfdfdf; stroke-width: 1px; fill: none;}

/* Preloader */

#preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  /* change if the mask should have another color then white */
  z-index: 99;
  /* makes sure it stays on top */
}

/* 2017.10.24 jh 로딩 바 추가 */
#statusFile {
  width: 200px;
  height: 200px;
  position: absolute;
  left: 50%;
  /* centers the loading animation horizontally one the screen */
  top: 50%;
  /* centers the loading animation vertically one the screen */
  background-image: url(/images/admin/imgs/status.gif); 
  /* path to your loading animation */
  background-repeat: no-repeat;
  background-position: center;
  margin: -100px 0 0 -100px;
  /* is width and height divided by two */
}

/** 20171108 추가 -------------------------------------------*/
.infoTbl { min-width:920px;width:100%;}
.infoTbl .sbux-txa { background:#fff !important;}
.infoTbl textarea{resize:none;}

h3 {font-size:18px; margin:50px 0 10px 20px; }
.writeRule {width:90%; border:1px solid #dfdfdf; padding:15px; margin:15px 0 15px 20px; background:#fff; line-height:16px;}
.writeRule2 {border: 1px solid #dfdfdf; padding : 8px; margin : 0px 3px 0px 3px; background: #fff; line-height: 16px;}

.sbgrid_cell img {width:12px !important; height:auto !important;}
#phone1,#phone2,#phone3 { max-width:100px !important;}

.infoTbl1 table:not(.sbux-pik-popwrap table) { clear:both; /*min-width:920px;*/ width:100%; border-top:2px solid #4C63A3; background:#fff; margin-bottom:30px;font-size:14px;}
.infoTbl1 th:not(.sbux-pik-popwrap th) {background:#f6f6f6; border-right:1px solid #ddd !important; line-height:130%; vertical-align:middle; border:none; border-top:1px solid #ddd; border-bottom:1px solid #ddd;  padding:10px;}
.infoTbl1 td:not(.sbux-pik-popwrap td), #synoreptForm tbody td {border-right:1px solid #ddd; line-height:130%; text-align:left; padding:12px 4px; border-top:#ddd solid 1px;border-bottom:#ddd solid 1px; background:#fff;  }
.infoTbl1 tbody td textarea{resize:none;}

#sbTreeArea {height:500px; overflow-y:auto; }

/* #loading { position: absolute; top: 45%; left: 50%; z-index: 999; background:url(/images/Spinner.gif) no-repeat; width:72px; height:72px;} */



#msg404 { width:100%;  padding-top:7%; }
#msg404 h1 {font-size:30px; padding:30px 0 20px 0;}
#msg404 .txMsg {font-size:17px; line-height:24px; padding:0 0 40px 0; ; color:#777; font-family: "notokr-regular", "Malgun Gothic", "Dotum", Sans-serif; font-weight:normal;}
#msg404 .txMsg img {width:90%; height:auto;}

#msg404 .btnWrap {margin:10px 0;}
#msg404 .btnBlue { border: 1px solid	#3B7CBE; background-color:#3B7CBE; }
#msg404 .btnBlue > span {color:#fff; font-family:  "Malgun Gothic", "Dotum", Sans-serif; display:inline-block; margin-top:-4px; }
#msg404 .btnM { font-family: "notokr-medium", "Malgun Gothic", "Dotum", Sans-serif; font-weight:normal;}

.top01 a{color:#fff; vertical-align:top;
}
.top01 a:hover{color:#dadbdc; text-decoration:none;
}
.m_top{margin-top:7px;}
.m_right{margin-right:19px;}
.slider{
	background-color:#909cb6;
	z-index:1000;
	position:relative;
	padding:15px 15px 20px;
}
.slider_btn{
	float:right;
	background-color:#909cb6;
	padding:15px;
	position:absolute;
	top:0;
	right:-50px;
	
}
.p60{padding:60px 0 0 5px;}
.gongsiInfoBox {padding-left:40px;background: #fff;}
.gongsiInfoBox .titleInfo{line-height:22px; font-weight:bold;}

.haedHover {color : #fff; float:left;}
.hoverLvl1 {color : #fff;}
.hoverLvl2 {color : #fff;}
.hoverLvl3 {color : #fff;margin-left: 10px;}
.hoverLvl4 {color : #fff;margin-left: 20px;}
.hoverLvl5 {color : #fff;margin-left: 30px;}
