/*
  css-only-tooltip version 1.0.0
  ⓒ 2015 AHN JAE-HA http://github.com/eu81273
  MIT License
*/


[data-tooltip-text]:hover {
  position: relative;
}

[data-tooltip-text]:hover:after {
  background-color: #000000;
  background-color: rgba(0, 0, 0, 0.8);

  -webkit-box-shadow: 0px 0px 3px 1px rgba(50, 50, 50, 0.4);
  -moz-box-shadow: 0px 0px 3px 1px rgba(50, 50, 50, 0.4);
  box-shadow: 0px 0px 3px 1px rgba(50, 50, 50, 0.4);

  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;

  color: #FFFFFF;
  font-size: 12px;

  content:"캐시키보드1 : " attr(data-tooltip-text) "\A캐시키보드2 : " attr(data-tooltip-text2);
  white-space:pre;

  margin-bottom: 10px;
  top: 130%;
  left: 0;
  padding: 7px 12px;
  position: absolute;
  text-align: left;

  z-index: 9999;
}



.mngOff {
  background-color: #f0f0f0;
}



.progress-group {
  display: flex;
  align-items: center; /* 세로 축에서 중앙 정렬 */
  justify-content: space-between; /* 자식 요소들 사이에 공간을 균등하게 배분 */
  margin-bottom: 5px; /* 그룹 간의 여백 */
}

.progress-group:last-child {
  margin-bottom: 0; /* 마지막 progress-group에 대한 여백을 제거 */
}

.progressbar-label {
  /* 필요한 추가 스타일링 */
  flex: 0 0 auto; /* 라벨이 컨텐츠 크기에 따라 크기가 정해지도록 설정 */
  margin-right: 5px; /* 라벨과 진행율 바 사이의 여백 */
  padding : 0 5px;
  width:45px;
}

.progressbar-container {
  flex: 1; /* 진행율 바 컨테이너가 남은 공간을 모두 차지하도록 설정 */
  width: 0; /* flex: 1 속성을 활성화하기 위해 width를 0으로 설정 */
  position: relative;
}

.progressbar-border {
  border: 1px solid #ccc;
  height: 15px;
  position: relative;
  overflow: hidden;
}

.progressbar-background {
  height: 100%;
  background-color: white;
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
}

.progressbar {
  position: absolute;
  height: 100%;
}


.progress-group2 {
  display : none;
}



/*** 이슈관리 > 업무이슈 [S] ***/
#columns{
  column-width:350px;
  column-gap: 15px;
}
#columns figure{
  display: inline-block;
  border:1px solid rgba(0,0,0,0.2);
  margin:0;
  margin-bottom: 15px;
  padding:10px;
  box-shadow: 2px 2px 5px rgba(0,0,0,0.5);
  line-height: 15px;
  font-size: 9pt;
  color:gray;
  width:100%;
}
#columns figure img {
  width:100%;
}


.columns-figure-title > span.card-title{
  font-size: 10pt;
  /*font-weight: bold;*/
  line-height: 20px;
}
.columns-figure-title > span.card-date{
  color:navy;
  padding-left:10px;
  line-height: 20px;
}
.columns-figure-title > .repeat{
  color: #6666bd;
}

.columns-figure-footer{
  display: flex;
  flex-wrap: wrap;
}
.columns-figure-footer > div > span{
  margin-right:10px;
}
.columns-figure-footer > div > span.strong{
  color:navy;
}
.columns-figure-detail{
  background: #fffaee;
  border:1px solid #faecb9;
  border-radius: 5px;
  padding:5px;
  margin-bottom: 10px;
  /*max-height:150px;*/
  overflow-y: scroll;
  color:gray;
  font-size: 9pt;
  line-height: 20px;
  word-break: break-all;
}
.columns-figure-detail.repeat{
  background: #eef7fd;
  border:1px solid #d2f2ff;
}

.columns-figure-comment{
  padding-bottom: 10px;
}
.columns-figure-comment > .cmt-list{
  background: #f4ffe6;
  border:1px solid #b2e5b7;
  border-radius: 5px;
  padding:3px;
  color:gray;
  margin-top: 3px;
  word-break: break-all;
}
.columns-figure-comment > .appendix{
  background: white;
  border:1px solid #bdbdbd;
  border-radius: 5px;
  padding:3px 10px;
  color:gray;
  margin: 0px;
}
.columns-figure-comment > .appendix > span{
  color:black;
  font-weight: bold;
  line-height: 20px;
  border:1px solid #c0c0c0;
  margin-right:0px;
}
.columns-figure-comment > div > span{
  color:black;
  font-weight: bold;
  line-height: 20px;
}
/*** 이슈관리 > 업무이슈 [E] ***/


/** 회의록 - 파일첨부 [S] **/
.insert {
  display: block;
  width:100%;
  border: 1px solid #dbdbdb;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
}
.insert .file-list {
  height: 100px;
  overflow: auto;
  border: 1px solid #989898;
  padding: 10px;
  text-align: left;
}
.insert .file-list .filebox p {
  font-size: 14px;
  /*margin-top: 10px;*/
  display: inline-block;
}
.insert .file-list .filebox .delete i{
  color: #ff5353;
  margin-left: 5px;
}
/** 회의록 [E] **/


/**  파일 BOX [S] **/
span.file-delete{
  padding:2px 5px;
  margin:5px;
  border-radius: 5px;
  border:1px solid red;
  background: white;
  color:red;
}

.appendix{
  padding:2px 5px;
  margin:5px;
  border:1px solid silver;
  border-radius: 5px;
  background: white;
  display: inline-block;
}
/** 파일 BOX [E] **/


/**  좌우정렬 [S] **/
.container_div {
  display: flex;
  justify-content: space-between;
  width: 100%;
}
.left_div {
  flex-grow: 1; /* 남는 공간을 모두 차지하도록 설정 */
  display: flex; /* Flexbox 사용 */
  justify-content: left; /* 가로 중앙 정렬 */
  align-items: center; /* 세로 중앙 정렬 */
}
.right_div {
  width: 80px; /* 고정 너비 설정 */
  display: flex; /* Flexbox 사용 */
  justify-content: right; /* 가로 중앙 정렬 */
  align-items: center; /* 세로 중앙 정렬 */
}
/** 좌우정렬 [E] **/



/**  진행업무 리스트 [S] **/
.site_01{
  color:blue;
}

.site_10{
  color:red;
}
/** 진행업무 리스트 [E] **/


/** 달력(스케쥴) [S] **/
div.cal_box{
  display: inline-block;
  padding: 2px 5px;
  border-radius: 5px;
  border: 1px solid #d0d0d0;
  margin-top: 5px;
  width: 100%;
  max-width: 160px;
  text-align: left;
  background: white;
  z-index: 10;
}
span.cal_box{
  margin:5px;
  padding: 3px 0px;
  border-radius: 5px;
  border: 1px solid #d0d0d0;
  text-align: left;
  background: white;
}
.cal_today{
  background: #f1f1f1 !important;
}
.cal_td{
  vertical-align: top !important;
  height: 80px;
  text-align: left !important;
}
.schedule>tbody>tr>td:first-child{
  background: #fff3f3;
}
.schedule>tbody>tr>td:last-child{
  background: #f3f3ff;
}
.cal_td > div:first-child{
  text-align: right;
}

/* 숫자 기본 표시 */
.schedule-btn-add .day-num {
  display: inline-block;
  background-color: transparent; /* 배경색 없음 */
  border: none; /* 테두리 없음 */
}

/* plus-btn은 초기에는 숨깁니다. */
.schedule-btn-add .plus-btn {
  display: none;
  cursor: pointer;
}

/* 마우스를 요소 위로 올릴 때 plus-btn을 보이게 합니다. */
.schedule-btn-add:hover .day-num {
  display: none;
}
.schedule-btn-add:hover .plus-btn {
  display: inline-block;
}

.day {
  position: relative;
  width: 100%;
  height:100%;
  overflow: hidden;
}
.day::before {
  content: attr(data-date);
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  font-size: 40px;
  color: rgba(0, 0, 0, 0.1); /* 연한 색상으로 설정 */
  z-index: 0;
}

/** 달력(스케쥴) [E] **/



/* 모달 스타일 */
.modal {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
  z-index: 9999;
}

.modal-content {
  background-color: #fff;
  border-radius: 5px;
  padding: 20px;
  width: 300px;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.modal-header {
  margin-top: -20px;
  padding: 0px 40px 0px 0px; /* X 버튼 공간 확보 */
}

.modal-form {
  padding: 0px; /* X 버튼 공간 확보 */
}

/* 하단 버튼 영역 스타일 */
.modal-footer {
  padding: 15px 00px; /* 상하좌우 패딩 조정 */
  text-align: center;
}

.footer-close-button:hover,
.footer-close-button:focus {
  color: black;
  text-decoration: underline;
}

/* 닫기 버튼 스타일 */
.close-button {

  color: #aaa;
  font-size: 24px;
  font-weight: bold;
  cursor: pointer;
}

.close-button:hover,
.close-button:focus {
  color: black;
  text-decoration: none;
}

.close-button {
  position: absolute;
  top: 10px;
  right: 10px;
  color: #aaa;
  font-size: 24px;
  font-weight: bold;
  cursor: pointer;
}

.close-button:hover,
.close-button:focus {
  color: black;
  text-decoration: none;
}


/* 업체정보 스타일 */
.company-user-td {
  border:0px solid white !important;
  text-align: center;
}
.company-user-td > button {
  margin-bottom: 5px;
  line-height:15px;
  padding: 0px 10px;
}