/* with */
.w10p { width:10%;}
.w20p { width:20%;}
.w30p { width:30%;}
.w40p { width:40%;}
.w50p { width:50%;}
.w60p { width:60%;}
.w70p { width:70%;}
.w80p { width:80%;}
.w90p { width:90%;}
.w95p { width:95%;}
.w100p { width:100%;}

.w10 { width:10px;}
.w20 { width:20px;}
.w30 { width:30px;}
.w40 { width:40px;}
.w50 { width:50px;}
.w80 { width:80px;}
.w90 { width:90px;}
.w100 { width:100px;}
.w120 { width:120px;}
.w140 { width:140px;}
.w150 { width:150px;}
.w160 { width:160px;}
.w170 { width:170px;}
.w180 { width:180px;}
.w200 { width:200px;}
.w210 { width:210px;}
.w220 { width:220px;}
.w240 { width:240px;}
.w250 { width:250px;}
.w260 { width:260px;}
.w270 { width:270px;}
.w280 { width:280px;}
.w300 { width:300px;}
.w400 { width:400px;}

.h24 {height:24px;}
.h26 {height:26px;}
.h30 {height:30px;}
.h34 {height:34px;}
.h35 {height:35px;}
.h36 {height:36px;}
.h37 {height:37px;}
.h38 {height:38px;}
.h40 {height:40px;}
.h50 {height:50px;}
.h100 {height:100px;}
.h200 {height:200px;}


/* layer popup */
.popup-layer {display:none; width:600px; background-color:#fff; padding-top:5px;padding-bottom:40px;}
.popup-layer .popup-layer-top {padding:20px 20px 30px; margin-bottom:10px; }
.popup-layer p.data-title {float:left; padding-left:5px; font-size:18px;/*border-bottom:solid 2px #000; */}
.popup-layer p b {font-weight:800;}
.popup-layer span.b-close {float:right;padding-right:5px; margin-top:-5px;cursor:pointer;}
.data-content { border-top:solid 2px #000; background-color:#fff;  padding-top:20px;margin:20px;}
.data-content ul.pop-up {}
.data-content ul.pop-up li {font-size:14px;}

.popup-layer table {border-top:solid 2px #505050;}
.popup-layer table tr {border-bottom:solid 1px #eee;}
.popup-layer table tr th {padding:5px; text-align:center; font-weight:700;font-size:14px;}
.popup-layer table tr td {padding:10px; text-align:center; font-size:14px;}

.popup-layer ul.pop-up li {display:block; overflow: scroll; overflow-x:hidden; font-size: 12px; height:500px;}


@media screen and (max-width: 600px) {
	.popup-layer {width:98%;}
}

.input {border-radius: 10px;height:30px;font-size:1.0em; font-family: "나눔고딕", "Nanum Gothic", sans-serif;padding-left:5px;font-weight:bold; border:1px solid #d2d2d2;}
.input2 {height:22px;width:20%;font-size:1.0em; font-family: "나눔고딕", "Nanum Gothic", sans-serif;padding-left:5px;font-weight:bold; border:1px solid #d2d2d2;}
.input3 {height:25px;font-size:0.9em; font-family: "나눔고딕", "Nanum Gothic", sans-serif;padding-left:5px;font-weight:bold; border:1px solid #d2d2d2;}
.input4 {height:25px;width:50%;font-size:1.0em; font-family: "나눔고딕", "Nanum Gothic", sans-serif;padding-left:5px;font-weight:bold;}
.input5 {height:25px;width:100px;font-size:1.0em; font-family: "나눔고딕", "Nanum Gothic", sans-serif;padding-left:5px;font-weight:bold;}
.select {border-radius: 10px;height:33px;font-size:1.0em; font-family: "나눔고딕", "Nanum Gothic", sans-serif;}
.select2 {font-size:1.0em; font-family: "나눔고딕", "Nanum Gothic", sans-serif;}
.clear {clear:both;}
input::placeholder {
  color: #ddd;
}
textarea {padding:10px;border-radius: 10px;}
textarea::placeholder {
  color: #ddd;
}

.header-box { text-align:center; }
.topmenu-box { width:100%;text-align:center;background-color:#009966; }
.topmenu-box ul li { display:inline-block; float:none; padding:20px 0px; }
.topmenu-box ul li a { font-size:14px; color:#fff; margin:0px 10px;}
.topmenu-box ul li a.on { font-weight:700;color:#fae100;}
.logo { font-size:20px;padding:10px;padding-top:30px; }
.contents-box { padding:20px; }

.navi-history {width:100%;}
.navi-history ul {border-bottom:solid 1px #ddd;}
.navi-history ul li {display:inline-block; float:none; padding:10px 0px;}
.navi-history ul li.navi-title {font-size:16px; font-weight:700;}
.navi-history ul li:last-child {float:right;text-align:right;}


.footer-box { text-align:center;}

.copyright {text-align:center;}


.blue {color:#3c6cbb;}
.red {color:#e94b4b;}
.gray { color:#0066cc; font-weight:700;}
.dayoff { display:block; padding-top:10px; text-align:center; font-size:12px; color:#505050; font-weight:700; }

/** 작성자 : 박홍근 **/
.expend {font-weight:bold;
	display:block; font-size:12px; text-align:center; font-weight:400; color:#8f8f8f;
}
.expend_today {font-weight:bold;
	display:block; font-size:12px; text-align:center; font-weight:400; color:#009999;
}
.holiday {font-weight:bold;
	display:block; font-size:12px; text-align:center; font-weight:400; color:#ff6600;
}

table#tbl-list-search {width:100%;}
table#tbl-list-search tr td.total {width:200px;}
table#tbl-list-search tr td.search {text-align:right;}
table#tbl-list-search tr td.right {text-align:right;}
table#tbl-list-search tr td.center {text-align:center;}

table#tbl-list-search tr td p {border:solid 1px #ff0000;}

table#tbl-list {
	width:100%;
}
table#tbl-list thead tr th {border-top:solid 1px #eee; border-bottom:solid 1px #eee; font-weight:700; font-size:12px; padding:10px 0px; background:#ddd;}
table#tbl-list tbody tr td {border-bottom:solid 1px #eee; font-weight:400; font-size:12px; padding:10px 5px; text-align:center;}
table#tbl-list tbody tr td.left {text-align:left;}
table#tbl-list tbody tr td.center {text-align:center;}
table#tbl-list tbody tr td.right {text-align:right;}

table#tbl-list tbody tr td div {width:100%;}
table#tbl-list tbody tr td div ul li {display:inline-block;float:none; vertical-align:top;}
table#tbl-list tbody tr td div ul li span {padding-left:20px;}
table#tbl-list tbody tr td div ul li label {margin-right:-14px;}
table#tbl-list tr td p {margin:0px;line-height: 28px;}

table#tbl-list-bottom {width:100%;}
table#tbl-list-bottom tr td {font-weight:400; font-size:12px;}
table#tbl-list-bottom tr td.left {text-align:left;width:140px;}
table#tbl-list-bottom tr td.center {text-align:center;}
table#tbl-list-bottom tr td.right {text-align:right;width:140px;}

table#tbl-form {
	width:100%;
	border-top:solid 1px #eee;
	border-bottom:solid 1px #eee;
}

table#tbl-form tr th {font-weight:700; font-size:12px; padding:10px 0px; width:120px;border-bottom:solid 1px #eee; background:#eee;}
table#tbl-form tr td {font-weight:400; font-size:12px;border-bottom:solid 1px #eee; padding:0px 5px;}
table#tbl-form tr th {}
table#tbl-form tr th.left {text-align:left;}
table#tbl-form tr th.center {text-align:center;}
table#tbl-form tr th.right {text-align:right;}
table#tbl-form tr td {}
table#tbl-form tr td.left {text-align:left;}
table#tbl-form tr td.center {text-align:center;}
table#tbl-form tr td.right {text-align:right;}
table#tbl-form tr td.answer {vertical-align:top;height:150px;border:solid 1px #000;padding:10px;}
.bdr-red {border-top:solid 2px #ff8484;}
.bdr-blue {border-top:solid 2px #006699;}
.bdr-default {border-top:solid 2px #d9d9d9;}
.bdr-black {border-top:solid 2px #000;}
.bdr-yellow {border-top:solid 2px #ffd91c;}
.bdr-orange {border-top:solid 2px #ff9900;}

table#tbl-button {width:100%;}
table#tbl-button tr th {}
table#tbl-button tr th.left {text-align:left;}
table#tbl-button tr th.center {text-align:center;}
table#tbl-button tr th.right {text-align:right;}
table#tbl-button tr td {}
table#tbl-button tr td.left {text-align:left;}
table#tbl-button tr td.center {text-align:center;}
table#tbl-button tr td.right {text-align:right;}



table#tbl-cate {
	width:100%;
	border-top:solid 1px #eee;
	border-bottom:solid 1px #eee;
}

table#tbl-cate tr th {font-weight:700; font-size:12px; padding:10px 0px; width:120px;border-bottom:solid 1px #eee; background:#eee;}
table#tbl-cate tr td {font-weight:400; font-size:12px;border-bottom:solid 1px #eee; padding:0px 5px;}
table#tbl-cate tr th {}
table#tbl-cate tr th.left {text-align:left;}
table#tbl-cate tr th.center {text-align:center;}
table#tbl-cate tr th.right {text-align:right;}
table#tbl-cate tr td {}
table#tbl-cate tr td.left {text-align:left;}
table#tbl-cate tr td.center {text-align:center;}
table#tbl-cate tr td.right {text-align:right;}


.check-button {position:fixed;right:20px;bottom:20px;}



.calendar-list {width:100%;}
.calendar-list ul {clear:both;}
.calendar-list ul li {float:left;}
.calendar-list ul li.tit {text-align:center;width:14%;height:auto;padding:10px 0px;border:solid 1px #ddd;background-color:#eee;}
.day { width:14%;padding:2px 0px 10px 0px;;border:solid 1px #ddd; }


.allAgree { margin-top:20px;margin-bottom:10px;}
.allAgree  label { font-size:22px; font-weight:300; color:#000; letter-spacing: -0.5px; }

.agChk { margin-bottom:20px;}
.agChk  label { font-size:21px; font-weight:300; color:#000; letter-spacing: -0.5px; }
.agChk  label strong { color:#000; margin-left:5px; font-weight:500;}
.agChk  label a { color:#5a5a5a; margin-left:15px; font-weight:500; background:#eee;border-radius:5px;padding:7px 18px;font-size:14px;}
.agFlow { overflow: auto; height: 280px; padding:30px 28px; border:1px solid #e5e5e5; margin-bottom:48px;}
.agFlow > * { line-height:1.7;}


@media screen and (max-width: 600px) {
	.allAgree { margin-top:20px;margin-bottom:10px;}
	.allAgree  label { font-size:14px; font-weight:300; color:#000; letter-spacing: -0.5px; }

	.agChk { margin-bottom:20px;}
	.agChk  label { font-size:14px; font-weight:300; color:#000; letter-spacing: -0.5px; }
	.agChk  label strong { color:#000; margin-left:5px; font-weight:500;}
	.agChk  label a { color:#5a5a5a; margin-left:15px; font-weight:500; background:#eee;border-radius:5px;padding:7px 18px;font-size:14px;}
	.agFlow { overflow: auto; height: 280px; padding:30px 28px; border:1px solid #e5e5e5; margin-bottom:48px;}
	.agFlow > * { line-height:1.7;}
}


.agFlow h1 {font-size:18px;font-weight:700; margin:20px 0px 30px;}
.agFlow h2 {font-size:16px;font-weight:700; margin:20px 0px 10px;}
.agFlow h2.first {margin:0px 0px 10px;}
.agFlow h3 {font-size:16px;font-weight:600; margin-top:30px;}
.agFlow h4 {font-size:12px;}
.agFlow p {font-size:16px;}
.agFlow .agree_item {margin-left:20px;margin-bottom:10px;}
.agFlow .agree_item p {font-size:16px;color:#414141;line-height:24px;}
.agFlow .agree_item p.det {margin-left:20px;font-size:15px;color:#414141;line-height:22px;}




.agreeFlow h1 {font-size:18px;font-weight:700; margin:20px 0px 30px;}
.agreeFlow h2 {font-size:16px;font-weight:700; margin:20px 0px 10px;}
.agreeFlow h2.first {margin:0px 0px 10px;}
.agreeFlow h3 {font-size:16px;font-weight:600; margin-top:30px;}
.agreeFlow h4 {font-size:12px;}
.agreeFlow p {font-size:16px;}
.agreeFlow .agree_item {margin-left:20px; margin-bottom:10px;}
.agreeFlow .agree_item p {font-size:16px;color:#414141;line-height:24px;}
.agreeFlow .agree_item p.det {margin-left:20px;font-size:15px;color:#414141;line-height:22px;}

.agImg { display: flex; align-items: center; height: 38px; position: relative; overflow: hidden;}
.agImg input[type=checkbox] {
  width:1px;
  height:1px;
  background:none;
  position:absolute;
  left:-1px;
  top:-1px;
  z-index:1;
}
.agImg input[type=checkbox] + label {
  position: relative;
  padding-left:38px;
  height:38px;
  display: flex;
  padding-bottom:3px;
  align-items: center;
  background-position: center left;
  background-repeat: no-repeat;
  background-image: url('../img/chk-off.png');
}
.agImg input[type=checkbox]:checked +  label {
  background-image: url('../img/chk-on.png');
  z-index:6;
}
.agImg input[type=checkbox]:checked { border:0 none; z-index:0; }




/* 툴팁 기본 */
.tooltip {
  position: relative;
  display: block;
}

.tooltip .tooltiptext {
  visibility: hidden;
  background-color: black;
  color: #fff;
  font-size:12px;
  text-align: center;
  border-radius: 6px;
  padding: 8px 10px 10px;

  position: absolute;
  z-index: 1;
}

.tooltip:hover .tooltiptext {
  visibility: visible;
}

/* 툴팁 화살표 기본 스타일 설정  */
.tooltip .tooltiptext::after {
  content: " ";
  position: absolute;
  border-style: solid;
  border-width: 5px;
}

/* 왼쪽 툴팁 */
.tooltip .tooltip-left {
  width: 120px;
  top: 0px;
  right: 105%;
}

.tooltip .tooltip-left::after {
  top: 50%;
  left: 100%;
  margin-top: -5px;
  border-color: transparent transparent transparent black;
}

/* 오른쪽 툴팁 */

.tooltip .tooltip-right {
  top: -5px;
  left: 105%;
}

.tooltip .tooltip-right::after {
  top: 50%;
  right: 100%;
  margin-top: -5px;
  border-color: transparent black transparent transparent;
}

/* 위쪽 툴팁 */
.tooltip .tooltip-top {
  width: 120px;
  bottom: 150%;
  left: 50%;
  margin-left: -60px;
}

.tooltip .tooltip-top::after {
  top: 100%;
  left: 50%;
  margin-left: -5px;
  border-color: black transparent transparent transparent;
}

/* 아래쪽 툴팁 */
.tooltip .tooltip-bottom {
  width: 120px;
  top: 150%;
  left: 50%;
  margin-left: -60px;
}


.tooltip .tooltip-bottom::after {
  bottom: 100%;
  left: 50%;
  margin-left: -5px;
  border-color: transparent transparent black transparent;
}


.state_name {font-size:11px;padding:4px 6px;margin-right:2px;border-radius:7px;}
.icon_name {font-size:11px;padding:4px 4px;margin-right:2px;border-radius:5px;}
.tag_name {background:#ddd; font-size:11px;padding:4px 4px;margin-right:2px;border-radius:5px;}
.border_name {border:solid 1px #0099cc;font-size:11px;padding:3px 3px;margin-right:2px;border-radius:5px;}
.item_name {background:#ddd; font-size:14px;padding:8px 8px;margin-right:2px;border-radius:10px;}
.state_tag {background:#ddd;font-size:11px;padding:4px 6px;margin-right:2px;border-radius:7px;white-space:nowrap;}
.cmt_num {font-size:10px;padding:2px 4px;margin-left:2px;border-radius:10px;font-weight:700; }

.s-red {background:#ff0000; color:#fff;}
.s-gray {background:#ddd; color:#000;}
.s-black {background:#000; color:#fff;}
.s-blue {background:#0066cc; color:#fff;}
.s-green {background:#009900; color:#fff;}
.s-orange {background:#ff9900; color:#000;}
.s-orange-w {background:#ff9900; color:#fff;}
.s-yellow {background:#ffe100; color:#000;}
.s-brown {background:#990066; color:#fff;}
.s-purple {background:#9900ff; color:#fff;}
.s-pink {background:#ff00ff; color:#000;}
.s-white {background:#fff; color:#000; border:solid 1px #ddd;}

.f-red {color:#ff0000;}
.f-gray {color:#ddd;}
.f-black {color:#000;}
.f-blue {color:#0066cc; }
.f-green {color:#009900;}
.f-orange {color:#ff9900;}
.f-brown {color:#990066;}
.f-purple {color:#9900ff;}
.f-pink {color:#ff00ff;}
.pointer {cursor:pointer;}


.icon-circle {padding:7px 10px;border-radius:50%;}
.color-A {background:#000;color:#fff;}
.color-B {background:#ff0000;color:#fff;}
.color-C {background:#0099cc;color:#fff;}
.color-D {background:#009966;color:#fff;}
.color-E {background:#cc00ff;color:#fff;}