@charset "utf-8";

html,
body {
  width: 100%;
  height: 100%;
} /*overflow:hidden;*/
/*body{background:#e8ecee;}*/
#menuTabbars {
  background: #fff;
}
.wrap {
  display: flex;
  overflow: hidden;
}
.header {
  width: 100%;
  height: 24px;
  position: relative;
  background: #323232;
}

.wrapper_con {
  height: auto;
  vertical-align: top;
  position: relative;
  margin: 0 0 0 0;
  padding: 0px 5px 5px 5px;
  border: 1px solid #dfdfdf;
  background: #fff;
}

/* .wrapper_con::before{content:'';display:block;background:#dee1e6;width:100%;height:100%;position:absolute;border:6px solid #dee1e6;top:-6px;left:-6px;border-bottom-width:7px;z-index:-1;} */
.wrapper {
  min-width: 1220px;
  box-sizing: border-box;
  word-break: break-all;
  white-space: nowrap;
  height: auto;
  vertical-align: top;
  position: relative;
  width: 100%;
  display: block;
}
.wrapper div {
  vertical-align: top;
}
.path_div {
  display: table;
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  padding-left: 5px;
  padding-bottom: 5px;
  margin: 0;
  box-sizing: border-box;
  border-bottom: 1px solid #dfdfdf;
  height: 36px;
}
.path,
.pathbt_div {
  display: table-cell;
  width: 49%;
}
.path {
  float: left;
  margin-top: 9px;
}
.pathbt_div {
  float: right;
}
.path .path_list li {
  display: inline-block;
}

.path_list li span {
  display: inline-block;
  padding: 0 3px;
}

.path_list li:after {
  position: relative;
  top: -1px;
  content: ">";
  text-align: center;
  color: #aaa;
}
.path_list li:last-child {
  font-weight: bold;
}
.path_list li:last-child:after {
  content: "";
}

.contents_wrap {
  margin: 0;
  width: 100%;
  min-width: 600px;
  max-height: 100%;
  background: #e8ecee;
  overflow: auto;
}

.contents {
  height: calc(100vh - 32px);
  min-height: 400px;
  padding: 5px;
}

.contents_wrap .contents {
  overflow: auto;
}

.contents_show {
  width: 100%;
  padding: 5px;
  background: #e8ecee;
  height: 100%;
  box-sizing: border-box;
  min-height: 610px;
  display: flex;
  flex-direction: row;
}
.contents_paper {
  background: #fff;
  width: 100%;
  height: calc(100% - 10px);
  border: 1px solid #dbd9da;
  min-height: 600px;
  padding: 7px;
  border-radius: 5px;
  margin: 5px;
}

.contents_wrap input,
.contents_wrap button,
.contents_wrap optgroup,
.contents_wrap select,
.contents_wrap textarea {
  border-radius: 0;
}

.contents_wrap .chul_btdiv button,
.contents_wrap .chul_btdiv input {
  border-radius: 5px;
}

/* iframe css */

.contents_show {
  width: 100%;
  padding: 0 5px;
  background: #e8ecee;
  height: 100%;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  min-height: 610px;
  display: flex;
  flex-direction: row;
}

.cont_col {
  width: 100%;
  padding: 5px 7px;
  height: 100%;
  box-sizing: border-box;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  min-height: 610px;
  display: flex;
  flex-direction: row;
}
.cont_row {
  display: flex;
  flex-direction: column;
  height: 100%;
  width: 100%;
}

.cont_row .box {
  padding: 5px;
  width: 100%;
  height: auto;
}
.cont_row .boxmax {
  flex: 1;
  padding: 5px;
  padding-bottom: 0;
  height: 100%;
  overflow: auto;
}
.cont_row .boxmax_noauto {
  flex: 1;
  padding: 5px;
  padding-bottom: 0;
  height: 100%;
}
.cont_row .boxmax .white {
  height: 100%;
}
.cont_col .boxhmax {
  padding: 5px;
}
.cont_col .boxhmax .white {
  height: 100%;
}

/* 서브 table 디자인 */
.flex,
.flex2,
.flex3,
.flex0 {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: stretch;
  justify-content: space-evenly;
}
.dir_col {
  flex-direction: column !important;
}

.flex .item,
.flex .item1,
.flex .item2,
.flex .item333,
.flex .item3,
.flex .item4,
.flex .item5,
.flex .item6,
.flex .item7,
.flex .item5_5 {
  resize: horizontal;
  max-height: calc(100vh - 96px);
  height: -ms-calc(100vh - 92px);
}

.flex3 .item,
.flex3 .item1,
.flex3 .item2,
.flex3 .item333,
.flex3 .item3,
.flex3 .item4,
.flex3 .item5,
.flex3 .item6,
.flex3 .item7,
.flex3 .item5_5 {
  resize: horizontal;
  height: calc(100vh - 160px);
  height: -ms-calc(100vh - 160px);
}
.flex2 .item,
.flex2 .item1,
.flex2 .item2,
.flex2 .item333,
.flex2 .item3,
.flex2 .item4,
.flex2 .item5,
.flex2 .item6,
.flex2 .item7,
.flex2 .item5_5 {
  resize: horizontal;
  max-height: calc(100vh - 136px);
  max-height: -ms-calc(100vh - 136px);
  max-height: -webkit-calc(100vh - 126px);
}
.flex0 .item,
.flex0 .item1,
.flex0 .item2,
.flex0 .item333,
.flex0 .item3,
.flex0 .item4,
.flex0 .item5,
.flex0 .item6,
.flex0 .item7,
.flex0 .item5_5 {
  resize: horizontal;
  min-height: calc(100vh - 50px);
  min-height: -ms-calc(100vh - 50px);
  min-height: -webkit-calc(100vh - 50px);
}

.flex .item,
.flex0 .item,
.flex2 .item,
.flex3 .item {
  flex-basis: auto;
  flex: 1;
  flex-shrink: 1;
  width: 100%;
  align-items: stretch;
}
.flex .item1,
.flex0 .item1,
.flex2 .item1,
.flex3 .item1 {
  flex-basis: auto;
  flex: 1;
  flex-shrink: 1;
  width: 100%;
  align-items: stretch;
}

.flex .item2,
.flex0 .item2,
.flex2 .item2,
.flex3 .item2 {
  flex-basis: auto;
  flex-shrink: 1;
}
.flex .item2:nth-of-type(1),
.flex0 .item2:nth-of-type(1),
.flex2 .item2:nth-of-type(1),
.flex3 .item2:nth-of-type(1) {
  width: calc(20% - 5px);
  width: -ms-calc(20% - 5px);
  margin-right: 5px;
}
.flex .item2:nth-of-type(2),
.flex0 .item2:nth-of-type(2),
.flex2 .item2:nth-of-type(2),
.flex3 .item2:nth-of-type(2) {
  flex-grow: 1;
  width: calc(80% - 5px);
  width: -ms-calc(80% - 5px);
  margin-left: 5px;
  min-width: 500px;
}

.flex .item333,
.flex0 .item333,
.flex2 .item333,
.flex3 .item333 {
  flex-basis: auto;
  flex-shrink: 1;
}
.flex .item333:nth-of-type(1),
.flex0 .item333:nth-of-type(1),
.flex2 .item333:nth-of-type(1),
.flex3 .item333:nth-of-type(1) {
  width: calc(33% - 5px);
  width: -ms-calc(33% - 5px);
  margin-right: 5px;
}
.flex .item333:nth-of-type(2),
.flex0 .item333:nth-of-type(2),
.flex2 .item333:nth-of-type(2),
.flex3 .item333:nth-of-type(2) {
  flex-grow: 1;
  width: calc(33% - 5px);
  width: -ms-calc(33% - 5px);
  margin-left: 5px;
  margin-right: 5px;
}
.flex .item333:nth-of-type(3),
.flex0 .item333:nth-of-type(3),
.flex2 .item333:nth-of-type(3),
.flex3 .item333:nth-of-type(3) {
  flex-grow: 1;
  width: calc(33% - 5px);
  width: -ms-calc(33% - 5px);
  margin-left: 5px;
}

.flex .item3,
.flex0 .item3,
.flex2 .item3,
.flex3 .item3 {
  flex-basis: auto;
  flex-shrink: 1;
}
.flex .item3:nth-of-type(1),
.flex0 .item3:nth-of-type(1),
.flex2 .item3:nth-of-type(1),
.flex3 .item3:nth-of-type(1) {
  width: 33%;
  margin-right: 5px;
}
.flex .item3:nth-of-type(2),
.flex0 .item3:nth-of-type(2),
.flex2 .item3:nth-of-type(2),
.flex3 .item3:nth-of-type(2) {
  flex-grow: 1;
  width: 66%;
  margin-left: 5px;
}
.flex .item3:nth-of-type(3),
.flex0 .item3:nth-of-type(3),
.flex2 .item3:nth-of-type(3),
.flex3 .item3:nth-of-type(3) {
  flex-grow: 1;
  width: 33%;
  margin-left: 5px;
}

.flex .item4,
.flex0 .item4,
.flex2 .item4,
.flex3 .item4 {
  flex-basis: auto;
  flex-shrink: 1;
}
.flex .item4:nth-of-type(1),
.flex0 .item4:nth-of-type(1),
.flex2 .item4:nth-of-type(1),
.flex3 .item4:nth-of-type(1) {
  width: calc(40% - 5px);
  width: -ms-calc(40% - 5px);
  margin-right: 10px;
}
.flex .item4:nth-of-type(2),
.flex0 .item4:nth-of-type(2),
.flex2 .item4:nth-of-type(2),
.flex3 .item4:nth-of-type(2) {
  flex-grow: 1;
  width: calc(60% - 5px);
  width: -ms-calc(60% - 5px);
}

.flex .item5,
.flex0 .item5,
.flex2 .item5,
.flex3 .item5 {
  flex-basis: auto;
  flex-shrink: 1;
}
.flex .item5:nth-of-type(1),
.flex0 .item5:nth-of-type(1),
.flex2 .item5:nth-of-type(1),
.flex3 .item5:nth-of-type(1) {
  width: calc(50% - 5px);
  width: -ms-calc(50% - 5px);
  margin-right: 5px;
}
.flex .item5:nth-of-type(2),
.flex0 .item5:nth-of-type(2),
.flex2 .item5:nth-of-type(2),
.flex3 .item5:nth-of-type(2) {
  flex-grow: 1;
  width: calc(50% - 5px);
  width: -ms-calc(50% - 5px);
  margin-left: 5px;
}

.flex .item6,
.flex0 .item6,
.flex2 .item6,
.flex3 .item6 {
  flex-basis: auto;
  flex-shrink: 1;
}
.flex .item6:nth-of-type(1),
.flex0 .item6:nth-of-type(1),
.flex2 .item6:nth-of-type(1),
.flex3 .item6:nth-of-type(1) {
  width: calc(60% - 5px);
  width: -ms-calc(60% - 5px);
  margin-right: 5px;
}
.flex .item6:nth-of-type(2),
.flex0 .item6:nth-of-type(2),
.flex2 .item6:nth-of-type(2),
.flex3 .item6:nth-of-type(2) {
  flex-grow: 1;
  width: calc(40% - 5px);
  width: -ms-calc(40% - 5px);
  margin-left: 5px;
}

.flex .item7,
.flex0 .item7,
.flex2 .item7,
.flex3 .item7 {
  flex-basis: auto;
  flex-shrink: 1;
}
.flex .item7:nth-of-type(1),
.flex0 .item7:nth-of-type(1),
.flex2 .item7:nth-of-type(1),
.flex3 .item7:nth-of-type(1) {
  width: calc(70% - 5px);
  width: -ms-calc(70% - 5px);
  margin-right: 5px;
}
.flex .item7:nth-of-type(2),
.flex0 .item7:nth-of-type(2),
.flex2 .item7:nth-of-type(2),
.flex3 .item7:nth-of-type(2) {
  flex-grow: 1;
  width: calc(30% - 5px);
  width: -ms-calc(30% - 5px);
  margin-left: 5px;
}

.flex .item5_5,
.flex0 .item5_5,
.flex2 .item5_5,
.flex3 .item5_5 {
  flex-basis: auto;
  flex-shrink: 1;
}
.flex .item5_5:nth-of-type(1),
.flex0 .item5_5:nth-of-type(1),
.flex2 .item5_5:nth-of-type(1),
.flex3 .item5_5:nth-of-type(1) {
  width: calc(50% - 19px);
  width: -ms-calc(50% - 19px);
  margin-right: 7px;
}
.flex .item5_5:nth-of-type(2),
.flex0 .item5_5:nth-of-type(2),
.flex2 .item5_5:nth-of-type(2),
.flex3 .item5_5:nth-of-type(2) {
  flex-basis: 38px;
}
.flex .item5_5:nth-of-type(3),
.flex0 .item5_5:nth-of-type(3),
.flex2 .item5_5:nth-of-type(3),
.flex3 .item5_5:nth-of-type(3) {
  width: calc(50% - 19px);
  width: -ms-calc(50% - 19px);
  margin-left: 7px;
}

.flex .inner_line_grid.left {
  display: flex;
  flex-direction: column;
  min-height: 200px;
  border: 1px solid #d1d8e4;
  border-left: 0;
  border-bottom: 0;
}
.flex .inner_line_grid.right {
  display: flex;
  flex-direction: column;
  min-height: 200px;
  border: 1px solid #d1d8e4;
  border-left: none;
  border-bottom: none;
}

.flex .outer_line_grid.left {
  display: flex;
  flex-direction: column;
  min-height: 200px;
  border: 1px solid #d1d8e4;
  border-left: 0;
  border-bottom: 0;
}
.flex .outer_line_grid.right {
  display: flex;
  flex-direction: column;
  min-height: 200px;
  border: 1px solid #d1d8e4;
  border-left: none;
  border-bottom: none;
}

.table {
  display: table;
  table-layout: fixed;
  width: 100%;
}
.table .table__cell {
  display: table-cell;
}
.table .table__cell:not(:first-of-type) {
  padding-left: 10px;
}

.row-12 {
  display: flex;
  flex-wrap: wrap;
}
.row-12.column {
  flex-direction: column;
}
.row-12 > * {
  flex-shrink: 0;
  width: 100%;
  max-width: 100%;
}
.col-1,
.col-2,
.col-3,
.col-4,
.col-5,
.col-6,
.col-7,
.col-8,
.col-9,
.col-10,
.col-11,
.col-12 {
  float: left;
  box-sizing: border-box;
}
.col-12 {
  width: 100%;
}
.col-11 {
  width: 91.66666667%;
}
.col-10 {
  width: 83.33333333%;
}
.col-9 {
  width: 75%;
}
.col-8 {
  width: 66.66666667%;
}
.col-7 {
  width: 58.33333333%;
}
.col-6 {
  width: 50%;
}
.col-5 {
  width: 41.66666667%;
}
.col-4 {
  width: 33.33333333%;
}
.col-3 {
  width: 25%;
}
.col-2 {
  width: 16.66666667%;
}
.col-1 {
  width: 8.33333333%;
}
.row-pdt {
  padding-top: 10px;
}
.col-pdt {
  padding-top: 10px;
}

/* 페이징 */
.paging {
  position: relative;
  text-align: center;
  margin-top: 10px;
  padding-bottom: 10px;
  border-bottom: 1px solid #dfdfdf;
}
.paging a {
  display: inline-block;
  width: 26px;
  height: 28px;
  margin-right: 1px;
  line-height: 28px;
  text-align: center;
  font-size: 13px;
  color: #707070;
  vertical-align: top;
  border: solid 1px #e9e7e7;
  background: #fff;
}
.paging a:hover {
  color: #505050;
  text-decoration: underline;
  background: #f3f5f7;
}
.paging .on {
  display: inline-block;
  width: 26px;
  height: 28px;
  line-height: 28px;
  text-align: center;
  vertical-align: top;
  font-size: 13px;
  color: #fff;
  font-weight: bold;
  background: #9b9b9b;
  border: solid 1px #9b9b9b;
}

.paging .btn {
  margin: 0 10px;
}
.paging .hide {
  width: 26px;
  background: #fff;
  font-size: 0;
  border: solid 1px #d5d5d5;
  text-indent: -9999px;
}
.paging .prevEnd,
.prevEnd:hover {
  background: url("../img/sub/paging_prev2.png") no-repeat center center !important;
}

/*.paging .prev, .prev:hover {background: url('../img/sub/paging_prev.png') no-repeat center center !important}
.paging .next, .next:hover {background: url('../img/sub/paging_next.png') no-repeat center center !important}*/

.paging .nextEnd,
.nextEnd:hover {
  background: url("../img/sub/paging_next2.png") no-repeat center center !important;
}

/* 헤더-탑 */
.h_top {
  width: 100%;
  height: 24px;
  display: table;
  overflow: hidden;
  white-space: nowrap;
  padding: 5px;
}
.h_top div {
  display: table-cell;
  overflow: hidden;
}

.h_left {
  width: 18%;
  min-width: 280px;
  position: relative;
  overflow: hidden;
  text-align: left;
}
.h_mid {
  width: 68%;
  vertical-align: middle;
}
.h_right {
  width: 14%;
  vertical-align: middle;
}

.leftbigcate {
  width: 70px;
  height: 100vh;
  position: fixed;
  background: var(--green-800);
}
/*.leftbigcate.close-sidebar{display:none;}*/
h1 {
  width: 100%;
  text-align: center;
  height: 15px; /* background:url(../img/seoulwoman_logo.svg) center center no-repeat */
  font-size: 1px;
  color: transparent;
}
.logout {
  position: absolute;
  margin-left: 24px;
  bottom: 27px;
  width: 22px;
  height: 30px;
  background: url(../img/logout.svg) center center no-repeat;
  transition:
    border-color 0.15s ease-in-out,
    background-color 0.4s linear 0s,
    color 0.15s ease-in-out;
  border: 0;
}
.logout:hover {
  background: url(../img/logout_w.svg) center center no-repeat;
}

.tabbarleft_div {
  width: 50px;
  border-bottom: 1px solid #dadbdc;
  display: flex;
  height: 28px;
  background: #fff;
}

.favoritlist_btn {
  width: 19px;
  background: url(../img/star_list.svg) center center no-repeat;
  transition:
    border-color 0.15s ease-in-out,
    background-color 0.4s linear 0s,
    color 0.15s ease-in-out;
  z-index: 99;
  cursor: pointer;
  margin-left: 10px;
}
.favoritlist_btn:hover {
  background: url(../img/star_list_yellow.svg) center center no-repeat;
}

.stm_fav .favorit_btn {
  width: 19px;
  background: url(../img/star_yellow.svg) center center no-repeat;
  transition:
    border-color 0.15s ease-in-out,
    background-color 0.4s linear 0s,
    color 0.15s ease-in-out;
  z-index: 99;
  cursor: pointer;
  margin-left: 10px;
}
.stm_fav .favorit_btn:hover {
  background: url(../img/star_w.svg) center center no-repeat;
}

.stm_enter .favorit_btn {
  width: 19px;
  background: url(../img/star_w.svg) center center no-repeat;
  transition:
    border-color 0.15s ease-in-out,
    background-color 0.4s linear 0s,
    color 0.15s ease-in-out;
  z-index: 99;
  cursor: pointer;
  margin-left: 10px;
}
.stm_enter .favorit_btn:hover {
  background: url(../img/star_yellow.svg) center center no-repeat;
}

.favorit_btn {
  position: absolute;
  bottom: 11px;
  right: 14px;
}

.fav_togbtn.active {
  background: #ececee !important;
}
.fav_togbtn.active svg {
  color: #ffd705;
}

#slide,
#slideBack {
  width: 100%;
  height: 25px;
  display: block;
  border: 0;
}
#slide .axi,
#slideBack .axi {
  color: #dfdfdf;
  font-size: 27px;
}
#slide:hover .axi,
#slideBack:hover .axi {
  color: #fff;
}

#slide.disabled,
#slideBack.disabled {
  opacity: 0.3;
}
#nav_list_box {
  -ms-overflow-style: none; /* IE and Edge */
  scrollbar-width: none; /* Firefox */
  overflow: auto;
  height: calc(100% - 222px);
}
#nav_list_box::-webkit-scrollbar {
  display: none; /* Chrome, Safari, Opera*/
}
.menupin_btn {
  background: url(../img/menu_pin.svg) center center no-repeat;
  width: 17px;
  height: 17px;
  position: absolute;
  right: 10px;
  top: 17%;
}
.menupin_btn:hover {
  background: url(../img/menu_pin_w.svg) center center no-repeat;
}
.menupin_btn.active {
  background: url(../img/menu_pin_w.svg) center center no-repeat;
}

.btn_search {
  position: absolute;
  margin-left: 12px;
  bottom: 65px;
  width: 30px;
  height: 30px;
  background: url(../img/search.svg) center center no-repeat;
  transition:
    border-color 0.15s ease-in-out,
    background-color 0.4s linear 0s,
    color 0.15s ease-in-out;
}
.btn_search:hover {
  background: url(../img/search_w.svg) center center no-repeat;
}

.nav_list {
  vertical-align: middle;
  position: relative;
  margin-top: 60px;
  overflow: hidden;
  margin: 0 auto;
} /*max-width:630px;메뉴한정적으로보이기 */
.nav_list li {
  position: relative;
  width: 100%;
  height: 80px;
  font-size: 12px;
  vertical-align: middle;
  transition:
    border-color 0.15s ease-in-out,
    background-color 0.4s linear 0s,
    color 0.15s ease-in-out;
  white-space: break-spaces;
}

.nav_list li:first-child {
  margin-top: 10px;
}
.nav_list li a {
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  color: #fff;
  box-sizing: border-box;
  transition:
    border-color 0.15s ease-in-out,
    background-color 0.4s linear 0s,
    color 0.15s ease-in-out;
  text-align: center;
  width: 100%;
  height: inherit;
  white-space: normal;
}

.nav_list li a span {
  position: relative;
}
.nav_list li a::before {
  content: "";
  display: block;
  text-align: center;
  background: transparent;
  height: 24px;
  width: 100%;
  background: url(../img/big_note_w.svg) center center no-repeat;
  background-size: 30px 30px;
  margin-bottom: 3px;
}

.nav_list #M_ECSMNG000 a::before {
  background: url(../img/network_w.svg) center center no-repeat;
} /* 협업관리 */
.nav_list #M_PUBMNG000 a::before {
  background: url(../img/big_user_w.svg) center center no-repeat;
} /* 사용자 */
.nav_list #M_PUBWKS000 a::before {
  background: url(../img/big_check_w.svg) center center no-repeat;
} /* 근태 */
.nav_list #M_ETSMNG000 a::before {
  background: url(../img/big_done_w.svg) center center no-repeat;
} /* 결재 */
.nav_list #M_MHSMNG000 a::before {
  background: url(../img/big_docs_w.svg) center center no-repeat;
} /* 인사 */
.nav_list #M_MPSMNG000 a::before {
  background: url(../img/big_salary_w.svg) center center no-repeat;
} /* 급여 */
.nav_list #M_MBSMNG000 a::before {
  background: url(../img/big_pig_w.svg) center center no-repeat;
} /* 예산 */
.nav_list #M_MFSMNG000 a::before {
  background: url(../img/big_calc_w.svg) center center no-repeat;
} /* 회계 */
.nav_list #M_MTXMNG000 a::before {
  background: url(../img/big_tax_w.svg) center center no-repeat;
} /* 세무 */
.nav_list #M_MASMNG000 a::before {
  background: url(../img/big_box_w.svg) center center no-repeat;
} /* 자산 */
.nav_list #M_MPUMNG000 a::before {
  background: url(../img/big_graph_w.svg) center center no-repeat;
} /* 계약 */
.nav_list #M_MPFMNG000 a::before {
  background: url(../img/big_achieve_w.svg) center center no-repeat;
} /* 성과 */
.nav_list #M_STMMNG000 a::before {
  background: url(../img/big_setting_w.svg) center center no-repeat;
} /* 시스템 */
.nav_list #M_PJTMNG000 a::before {
  background: url(../img/big_suitcase_w.svg) center center no-repeat;
} /* 프로젝트 */
.nav_list #M_INAMNG000 a::before {
  background: url(../img/big_box_w.svg) center center no-repeat;
} /* 정보자산관리 */
.nav_list #M_MVSMNG000 a::before {
  background: url(../img/big_person_w.svg) center center no-repeat;
} /* 인사평가 */
.nav_list #M_YNDMNG000 a::before {
  background: url(../img/big_salary_w.svg) center center no-repeat;
} /* 연말정산 */
.nav_list #M_AUTMNG000 a::before {
  background: url(../img/big_sign_w.svg) center center no-repeat;
} /* 감사관리 */

.nav_list_temp {
  vertical-align: middle;
  position: relative;
  margin-top: 30px;
  overflow: hidden;
  margin: 0 auto;
} /*max-width:630px;메뉴한정적으로보이기 */
.nav_list_temp li {
  position: relative;
  width: 100%;
  font-size: 12px;
  vertical-align: middle;
  transition:
    border-color 0.15s ease-in-out,
    background-color 0.4s linear 0s,
    color 0.15s ease-in-out;
  white-space: break-spaces;
  padding: 5px 0;
}
.nav_list_temp li a {
  display: inline-block;
  color: #fff;
  box-sizing: border-box;
  transition:
    border-color 0.15s ease-in-out,
    background-color 0.4s linear 0s,
    color 0.15s ease-in-out;
  text-align: center;
  width: 100%;
  white-space: normal;
  padding: 7px 0;
  border-bottom: 1px solid #07379f;
}

.nav_list_temp li a span {
  position: relative;
}
.nav_list_temp li a::before {
  content: "";
  display: block;
  text-align: center;
  background: transparent;
  height: 24px;
  width: 100%;
  background: url(../img/big_note_w.svg) center center no-repeat;
  background-size: 30px 30px;
  margin-bottom: 3px;
}

.nav_list_temp .mn1 a::before {
  background: url(../img/big_note_w.svg) center center no-repeat;
} /* 게시판 */
.nav_list_temp .mn2 a::before {
  background: url(../img/big_check2_w.svg) center center no-repeat;
} /* 일정관리 */
.nav_list_temp .mn3 a::before {
  background: url(../img/big_graph_w.svg) center center no-repeat;
} /* 영업관리 */
.nav_list_temp .mn4 a::before {
  background: url(../img/big_rench_w.svg) center center no-repeat;
} /* 유지보수 */
.nav_list_temp .mn5 a::before {
  background: url(../img/big_box_w.svg) center center no-repeat;
} /* 정보자산 */
.nav_list_temp .mn6 a::before {
  background: url(../img/big_suitcase_w.svg) center center no-repeat;
} /* 프로젝트 */
.nav_list_temp .mn7 a::before {
  background: url(../img/big_docs_w.svg) center center no-repeat;
} /* 전자결재 */
.nav_list_temp .mn8 a::before {
  background: url(../img/big_setting_w.svg) center center no-repeat;
} /* 시스템관리  */
.nav_list_temp .mn9 a::before {
  background: url(../img/big_graph_w.svg) center center no-repeat;
} /* 성과관리  */

.nav_temp {
  position: absolute;
  left: 6px;
  top: 107px;
  display: none;
}

.nav_list li a:hover {
  background: var(--green-700);
}
.nav_list li.active {
}
/*border-left:2px solid #9b89bc;.nav_list li.active a{color:#777;}background:#eee;*/

.h_bt {
  height: 28px;
  position: absolute;
  right: 0;
  top: 0;
  z-index: 999;
  background: #fff;
  border-bottom: 1px solid #dadbdc;
}
#allClosehome {
  width: 28px;
  height: 28px;
  display: inline-block;
  background: url(../img/close.svg) center center no-repeat;
  background-size: 10px 10px;
  border: 0;
}
#allClosehome:hover {
  background-color: #51b9f0;
  background-image: url(../img/close_w.svg);
  background-size: 10px 10px;
  border: 0;
}

.home_btn {
  background-image: url(../img/home_w.svg) !important;
  background-size: 20px 20px !important;
  margin-top: 16px;
  margin-left: 21px;
  z-index: 99;
  border: 0;
}
.home_btn:hover {
  background-color: transparent !important;
}

.favorit1_btn {
  width: 28px;
  height: 28px;
  background: url(../img/star_yellow.svg) center center no-repeat !important;
  background-size: 20px 20px !important;
  margin-top: 11px;
  margin-left: 21px;
  z-index: 99;
  border: 0;
}

.topbt_ul button .allclose_icon {
  display: inline-block;
  width: 100%;
  height: 100%;
  background: url(../img/allclose_icon.gif) no-repeat center;
}
.topbt_ul li button:hover .allclose_icon {
  background: url(../img/allclose_icon_on.gif) no-repeat center;
}
.topbt_ul li button:hover i {
  color: #fff;
  cursor: pointer;
}

/* 헤더-바텀 */
.h_bottom {
  width: 100%;
  height: 100%;
  display: flex;
  vertical-align: top;
  min-height: 800px;
}

.username_icon {
  width: 24px;
  height: 24px;
  background: url(../img/big_seoulsimbol_purple.svg) center 1px no-repeat;
  display: inline-block;
}
.username_txt {
  display: inline-block;
  color: #c2c2c2;
  white-space: nowrap;
  height: 24px;
  overflow: hidden;
  vertical-align: top;
}

/*.username_icon{width:127px; height:24px; background:url(../img/seoulwoman_logo.svg) center 2px no-repeat; display:inline-block;margin-right:3px;margin-left:8px;margin-top:2px;}*/

.tempbt_ul {
  position: absolute;
  top: 0;
  right: 0;
}
/* .tempbt_ul li{height:14px;display:inline-block; background:#425471;padding:7px;margin-right:-1px;color:#dfdfdf; line-height:10px; border-radius:3px;transition:border-color 0.15s ease-in-out, background-color 0.4s linear 0s;}
.tempbt_ul li:hover{color:#fff;background:#102746;cursor:pointer;} */
button#btnSamplePage {
  height: 24px;
  width: 24px;
  transition:
    border-color 0.15s ease-in-out,
    background-color 0.4s linear 0s;
  vertical-align: top;
  color: #c2c2c2;
}

button#btnSamplePage:hover {
  color: #fff;
}
.tempbt_ul li button {
  width: 100%;
  height: 100%;
  color: #dfdfdf;
}
.tempbt_ul li button:hover {
  color: #fff;
  border-color: #dfdfdf;
  cursor: pointer;
}
.tempbt_ul li #btnRedmine {
  width: 14px;
  height: 11px;
  background: url(../img/redmine.png) no-repeat;
  overflow: hidden;
}

/*.user_div{display:none !important;}  20200603사용자정보 위치변경으로 인하여 display:inline-block;display:table-cell;  */

.tab_div {
  width: calc(100vw - 265px);
  height: 100vh;
  min-height: 800px;
  min-width: 800px;
  display: block;
  position: relative;
  top: 0;
  overflow-x: auto;
  overflow-y: hidden;
}
.tab_div.close-sidebar {
  left: 0px;
  min-width: 1000px;
  width: calc(100% - 0px) !important;
} /*1405*/

.tab_ul {
  position: relative;
  border-bottom: 1px solid #dfdfdf;
}
.tab_ul li {
  position: relative;
  min-width: 50px;
  display: inline-block;
  padding: 0 16px 0 1px;
  border-right: 1px solid #c1c7d0;
}
.tab_ul li:hover {
  background: #f2f3f5;
}
.tab_ul li a {
  display: block;
  padding: 0 10px;
  color: #3c4043;
}
.tab_ul .active {
  background: #fff;
  top: 2px;
  z-index: 99;
  border-left: 2px solid #36a586;
}
.tab_ul .active a {
  font-size: 12px;
  color: #3c4043;
}

.tab_ul .img {
  position: absolute;
  top: -1px;
  right: 0px;
  width: 10px;
  height: 20px;
}
.tab_ul li:before,
.tab_ul li:after {
  content: "";
  width: 12px;
  height: 100%;
  display: block;
}
.tab_ul li:before {
  border-radius: 0 2px 0 0;
  transform: skew(30deg, 0deg);
}

/* 왼쪽 */

.leftMnu {
  min-height: 100vh;
  background: #f8f8fa;
  vertical-align: top;
  display: flex;
  min-width: 265px;
  border-right: 1px solid #dadbdc;
}
.leftMnu.close-sidebar {
  width: 70px;
  min-width: 70px;
}
/*.leftMnu{display:flex;flex-direction:column;width:208px;background:#2c579b;min-height:calc(100vh - 254px);}*/

.leftsltcate.close-sidebar {
  display: none;
}

.menusearch_div {
  height: 32px;
  position: relative;
  background: #f8f8fa;
  border-right: 1px solid #dadbdc;
  border-bottom: 1px solid #dadbdc;
}
.menusearch_ul {
  position: absolute;
  right: 0;
}
.menusearch_ul li {
  display: inline-block;
}
.menusearch_div .menusearch_btn {
  box-sizing: border-box;
  width: 35px;
  height: 30px;
}
.menusearch_div .menusearch_btn:hover {
  background: #1e5ca0;
  cursor: pointer;
}
#search_left {
  transition: all 0.15s;
  ime-mode: active;
  width: 100%;
  border: transparent;
  left: 0;
  position: absolute;
  height: 31px;
}
#search_left:active {
  background: #fff;
}
#search_left:hover {
  background: rgba(255, 255, 255, 1) !important;
}
#search_left:focus {
  background: rgba(255, 255, 255, 1) !important;
}
.btn_menusearch {
  height: 31px;
  position: absolute;
  right: 0;
  width: 28px;
  border-top: 0;
  border-right: 0;
  border-bottom: 0;
}
.btn_menusearch.active {
  background: #ececec;
}
.menusearch_btn .glyphicon-search {
  vertical-align: middle;
}
.menusearch_ul .btn_search {
  color: #fff;
  padding: 0 11px;
}
.menusearch_ul .star {
  display: inline-block;
  width: 17px;
  height: 17px;
  vertical-align: middle;
  background: url(../img/path_star_on.png) no-repeat;
  margin: 0 10px;
}
.l_navtitle {
  background: #f8f8fa;
  position: relative;
  line-height: 27px;
  transition: all 0.2s ease-in-out;
  width: 100%;
  height: 28px;
  border-right: 1px solid #dadbdc;
  border-bottom: 1px solid #dadbdc;
}
.lnav_tit {
  font-size: 14px;
  color: var(--green-800);
  font-weight: bold;
  display: inline-block;
  position: absolute;
  top: 0;
}
.lnav_tit::before {
  content: "";
  width: 2px;
  height: 13px;
  background: var(--green-800);
  display: inline-block;
  position: relative;
  top: 2px;
  margin-right: 10px;
  margin-left: 12px;
}
.bigcate_btn {
  background: #1d3e7e;
  width: 29px;
  height: 29px;
  line-height: 29px;
  text-align: center;
  padding-top: 1px;
}
.bigcate_btn i {
  color: #fff;
  font-size: 18px;
}

/*
input:placeholder { color:rgba(255, 255, 255, 0.4); font-size:11px; line-height:100%; text-align:center;}
input::placeholder { color:rgba(255, 255, 255, 0.4); font-size:11px; line-height:100%; text-align:center;}
input::-webkit-input-placeholder { color:rgba(255, 255, 255, 0.4); font-size:11px; line-height:100%; text-align:center;}
input:-webkit-input-placeholder { color:rgba(255, 255, 255, 0.4); font-size:11px; line-height:100%; text-align:center;}
input:-ms-input-placeholder { color:rgba(255, 255, 255, 0.4); font-size:11px; line-height:100%; text-align:center;}
input:-webkit-input-placeholder { color:rgba(255, 255, 255, 0.4); font-size:11px; line-height:100%; text-align:center;}
input:-moz-placeholder  { color:rgba(255, 255, 255, 0.4); font-size:11px; line-height:100%; text-align:center;}
*/

.lnav_btn {
  height: 27px;
  background: #fff;
  z-index: 99;
  padding: 0 3px;
  width: 14px;
  border-right: 1px solid #dadbdc !important;
}
.lnav_btn a {
  color: white;
  display: block;
  font-size: 19px;
  height: 100%;
  transition: all 0.2s ease-in-out;
}
.lnav_btn i {
  color: #1d48a0;
}
.lnav_btn:hover {
  color: #fff;
}
.lnav_div {
  display: block;
  width: 195px;
  position: fixed;
  left: 70px;
}
.lnav_div.close-sidebar {
  display: none;
}

.lnav {
  background: #f8f8fa;
  overflow-x: hidden;
  width: 195px;
  height: calc(100% - 56px);
  border-right: 1px solid #dadbdc;
}
.leftsltcate {
  width: 205px;
  display: flex;
  height: 100%;
  background: #f8f8fa;
  flex-direction: column;
}
.leftsltcate.close-sidebar {
  display: none;
}

/* custom 디자이너 임의 추가 dhtml ★ 스크롤 중요 */
.cls_menuTabbars_main {
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  border: 0px;
  display: block;
} /*background: #e7eef0;*/
.cls_menuTabbars_main.close-sidebar {
}

.dhxtabbar_base_material {
  overflow-y: hidden !important;
  overflow-x: auto;
}
.dhxtabbar_base_material.close-sidebar {
  overflow: hidden !important;
}

.dhxtabbar_cont {
  overflow: hidden !important;
  width: 100% !important;
  height: 100% !important;
}
.dhxtabbar_cont.close-sidebar {
  overflow: hidden !important;
  width: 100% !important;
}

.dhxtabbar_tabs_top.close-sidebar {
} /* 왼쪽 220px, 우측 87px width:calc(100vw - 60px) !important;*/
/*
.dhxtabbar_tabs_top{min-width:1000px;width:calc(100vw - 80px);.dhxtabbar_tabs.dhxtabbar_tabs_top{min-width:1000px;}} /* 왼쪽 220px, 우측 87px
.dhxtabbar_tabs_top:before{top:-3px;left:-3px; position:absolute;content:'';width:5px;height:5px;background:transparent;border:3px solid #005dba; border-top-left-radius:10px;border-right:none;border-bottom:none;z-index:5;}*/

.dhxtabbar_tabs.dhxtabbar_tabs_top.close-sidebar {
}

.dhxtabbar_tabs_base {
  background-size: cover;
} /*background:#a6a7a8;background:url(../img/leaf_bg.jpg) right top no-repeat;*/
.dhxtabbar_tabs_base.close-sidebar {
}

.dhx_cell_tabbar {
} /* 20210610 width:calc(100vw - 280px); */
.dhx_cell_tabbar.close-sidebar {
  width: calc(100vw - 30px);
}

/*.dhx_cell_cont_tabbar{width:calc(100vw - 220px) !important; height:calc(100vh - 76px) !important; overflow:hidden !important;}*/
.dhx_cell_cont_tabbar {
  overflow: hidden;
  height: 100%;
} /* width:calc(100vw - 280px); height:calc(100vh - 30px) !important; */
.dhx_cell_cont_tabbar.close-sidebar {
  width: 100%;
}
.dhx_cell_cont_tabbar + iframe {
  overflow: hidden !important;
}

.dhxtabbar_base_material
  div.dhxtabbar_tabs
  div.dhxtabbar_tabs_base
  div.dhxtabbar_tab
  a:hover {
  background: #f2f3f5 !important;
}

.dhxtabbar_tabs dhxtabbar_tabs_top {
  border-bottom: 1px solid #f5f5f5;
}
.dhtxtabbar_tabs {
  background: #c6c6c6;
  color: #949799;
}

.tab_div.close-sidebar .cls_menuTabbars_main {
  width: 100% !important;
  padding-left: 0 !important;
}

.stm_main {
  background: #e8ecee;
  width: 100%;
  height: calc(100% - 28px);
  padding: 30px 150px;
} /* display:flex;flex-direction:column; */
.stm_main.realmain {
  padding: 8px;
  background: #e4e5e7;
  position: relative;
  overflow-y: auto;
}
.stm_enter,
.stm_fav {
  width: 100%;
  margin: 0 auto;
}

.main_table {
  width: 100%;
  height: 300px;
}

.stm_fav,
.stm_enter {
  height: 220px;
  margin: 30px 0;
}
.stm_enter > h2,
.stm_fav > h2 {
  margin-left: 14px;
  margin-bottom: 8px;
  font-size: 16px;
}
.stm_enter > h2 + div,
.stm_fav > h2 + div {
  width: 100%;
  margin: 0 auto;
  overflow: hidden;
}
.stm_enter ul,
.stm_fav ul {
  display: flex;
  width: 100%;
  flex-wrap: wrap;
}
.stm_enter ul li,
.stm_fav ul li {
  border-radius: 10px;
  height: 150px;
  width: 230px;
  margin: 8px;
  padding: 15px;
  position: relative;
  flex: 0 0 auto;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background: #fff;
  border: 1px solid #fff;
  border-left-width: 5px;
  border-bottom-left-radius: 0;
  cursor: pointer;
}

#myChnnlList .chn_a,
#favChnnlList .chn_a {
  border-radius: 10px;
  height: 150px;
  width: 230px;
  margin: 8px;
  padding: 15px;
  position: relative;
  flex: 0 0 auto;
  -webkit-box-sizing: border-box;
  -moz-box-sizing: border-box;
  box-sizing: border-box;
  background: #fff;
  border: 1px solid #fff;
  border-left-width: 5px;
  border-bottom-left-radius: 0;
  cursor: pointer;
}

.stm_enter .ch_tit,
.stm_fav .ch_tit {
  color: #000;
  font-size: 15px;
  word-break: keep-all;
}
.ch_membernum {
  display: inline-block;
  position: absolute;
  left: 15px;
  bottom: 15px;
  font-weight: bold;
  color: #000;
}
.ch_membernum::after {
  content: "명 참여중";
  font-size: 12px;
  color: #000;
}

.ch_unreadnum {
  display: inline-block;
  position: absolute;
  right: -5px;
  top: -7px;
  font-weight: bold;
  color: #fff;
  background: red;
  border-radius: 30px;
  width: 25px;
  height: 25px;
  text-align: center;
  padding: 3px;
}

/*
	.stm_enter .favorit_btn{width:20px;height:20px;background:url(${pageContext.request.contextPath}/img/star_w.svg) center center no-repeat;transition:border-color 0.15s ease-in-out, background-color 0.4s linear 0s, color 0.15s ease-in-out;;
	position:absolute;right:15px;bottom:15px;z-index:99;}
	.stm_enter .favorit_btn:hover{background:url(${pageContext.request.contextPath}/img/star_yellow.svg) center center no-repeat;}

	.stm_fav .favorit_btn{width:20px;height:20px;background:url(${pageContext.request.contextPath}/img/star_yellow.svg) center center no-repeat;transition:border-color 0.15s ease-in-out, background-color 0.4s linear 0s, color 0.15s ease-in-out;;
	position:absolute;right:15px;bottom:15px;}
	.stm_fav .favorit_btn:hover{background:url(${pageContext.request.contextPath}/img/star_w.svg) center center no-repeat;}*/

/*.dhxtabbar_tab_text::before {content:'';display:inline-block;background:url(../img/star.svg) center center no-repeat;width:15px;height:11px;vertical-align:middle;margin-right:3px;z-index:99;}*/

.dhxtabbar_tab_text::before:hover {
  background: url(../img/star_yellow.svg) center center no-repeat;
}

.leftsltcate.close-sidebar {
  display: none;
}

.bb {
  border-bottom: 1px solid #dadbdc;
}

.chinfo_btn {
  padding: 2px 7px;
  display: none;
}

#allClose {
  width: 27px;
  height: 27px;
  background: var(--blue-700);
  vertical-align: top;
  border-radius: 0;
  border: 0;
}

#user_profile {
  width: 27px;
  height: 27px;
  background: #fff url(../img/profile-user_blue.svg) center center no-repeat;
  background-size: 18px 18px;
  vertical-align: top;
  border: 0;
}
.user_profilediv {
  position: absolute;
  background-color: #fff;
  background-clip: padding-box;
  border: 1px solid #ccc;
  border: 1px solid rgba(0, 0, 0, 0.15);
  border-radius: 4px;
  -webkit-box-shadow: 0 6px 12px rgb(0 0 0 / 18%);
  box-shadow: 0 6px 12px rgb(0 0 0 / 18%);
  padding: 10px 15px;
  top: 0;
  right: 27px;
  z-index: 90;
  text-align: center;
  display: none;
}
.user_profilediv .face_icon {
  position: relative;
  width: 100%;
  margin: 0 auto;
}

#userPhoto {
  background-image: url(../img/common/myphoto_default.png);
}
.user_profilediv .face_icon .user_photo {
  width: 32px;
  height: 32px;
  overflow: hidden;
  margin: 0 auto;
  border-radius: 100%;
  background: url(../img/undraw_profile.svg) no-repeat;
  position: relative;
}

.user_profilediv .face_icon .user_photo img {
  width: 32px;
  background-size: cover;
  vertical-align: top;
}
.user_profilediv .status-indicator {
  width: 10px;
  height: 10px;
  border-radius: 100%;
  display: inline-block;
  position: relative;
  right: -11px;
  top: -11px;
  border: 1px solid #fff;
}
.user_profilediv .name_div {
  margin-top: -12px;
  display: block;
}
.user_profilediv .name {
  font-weight: bold;
}
.user_profilediv .depart {
  white-space: nowrap;
}
.user_profilediv .ip {
  color: #999;
  font-size: 11px;
}
.bg-none {
  background-color: #cacfd5 !important;
}

.bg-new {
  background-color: red !important;
}

.bg-success {
  background-color: #1cc88a !important;
}

.bg-leave {
  background-color: #1d48a0 !important;
}

#allClose i {
  color: #fff;
  font-size: 14px;
}

.top_line {
  height: 28px;
  width: 100%;
  background: #fff;
  border-bottom: 1px solid #dadbdc;
}

/* 영업활동에 영업활동 히스토리 */
.sale_view01 {
  clear: both;
  margin-top: 0 !important;
  border-bottom: none;
}
.sale_view01 table {
  clear: both;
  width: 100%;
  background: #fff;
} /*border-left:solid 1px #dfdfdf;border-right:solid 1px #ccc;*/
.sale_view01 table th {
  padding: 8px 5px 8px 5px;
  border-right: solid 1px #dfdfdf;
  border-bottom: solid 1px #dfdfdf;
  background: #f8f8fa;
  font-size: 12px;
  font-weight: bold;
  color: #53596e;
  text-align: center;
}
.sale_view01 table td {
  padding: 8px 5px 8px 5px;
  border-right: solid 1px #dfdfdf;
  border-bottom: solid 1px #dfdfdf;
  text-align: left;
  font-size: 12px;
  line-height: 1.6;
}
.sale_view01 table td a {
  color: #2e6e9e;
  vertical-align: middle;
}
.sale_view01 table td a:hover {
  text-decoration: underline;
}

.sale_view02 {
  clear: both;
  margin-top: 10px;
  border-top: solid 1px #dfdfdf;
  border-bottom: none;
}
.sale_view02 table {
  clear: both;
  width: 100%;
  border-left: solid 1px #dfdfdf;
  border-right: solid 1px #dfdfdf;
}
.sale_view02 table th {
  padding: 5px 5px 5px 5px;
  border-right: solid 1px #dfdfdf;
  border-bottom: solid 1px #dfdfdf;
  background: #f9fafb;
  font-size: 12px;
  font-weight: bold;
  color: #53596e;
  text-align: center;
}
.sale_view02 table td {
  position: relative;
  padding: 5px;
  border-right: solid 1px #ccc;
  border-bottom: solid 1px #dfdfdf;
  text-align: left;
  font-size: 12px;
}
.sale_view02 table td a {
  color: #333;
  vertical-align: middle;
}
.sale_view02 table td a:hover {
  text-decoration: underline;
}

.tab_form {
  display: flex;
  flex-direction: column;
  height: 100%;
}

.channel_addbtn {
  width: 100%;
  border-radius: 0;
  background: #fff;
  font-weight: bold;
  border: 1px solid #dadbdc;
}

#myChnnlList,
#favChnnlList {
  height: 183px;
  overflow: auto;
  flex-wrap: nowrap;
}

.main_update ol {
  display: flex;
}
.main_update li {
  width: 33%;
}
.main_update ol li + div {
  width: 30%;
  border: 1px solid #ddd;
}
.main_update .upbox {
  padding: 20px;
  border: 1px solid #ddd;
  margin: 8px 0px 8px 8px;
  height: 138px;
  position: relative;
}
.main_update .d-flex {
  position: absolute;
  bottom: 16px;
}

.div_title {
  position: relative;
  height: 30px;
  width: 100%;
}
.div_title .s_tit {
  font-weight: bold;
  font-size: 14px;
  display: inline-block;
  line-height: 24px;
  vertical-align: bottom;
}
.div_title .left {
  float: left;
  line-height: 32px;
}
.div_title .left span {
  vertical-align: middle;
}
.div_title .left .s_tit {
  font-weight: bold;
  font-size: 13px;
  margin-right: 5px;
}
.div_title .right {
  float: right;
  margin-top: 4px;
}
.div_title .right > * {
  display: inline-block;
}
.div_title .btn {
  background: #fff;
  border: 1px solid #ccc;
  height: 28px;
  min-width: 40px;
}

.div_title .btn.btn-del {
  border: 1px solid #ff4931;
  color: #ff4931;
}

.div_title .btn.btn-save {
  border: 1px solid #1c3a5c;
  color: #1c3a5c;
}

.table_sumnum {
  color: #f15b22;
  font-weight: bold;
  line-height: 32px;
}
.table_sumnum:before {
  content: "총 ";
  font-weight: normal;
  color: #333;
}
.table_sumnum:after {
  content: "건";
  font-weight: normal;
  color: #333;
}

.fm033_ul li {
  float: left;
  border: 1px solid #ddd;
  padding: 2px 6px;
  margin-right: 2px;
  margin-bottom: 2px;
  font-weight: normal;
  font-size: 12px;
}
.fm033_ul li a {
  width: 100%;
  height: 100%;
  display: block;
}
.fm033_ul li a:hover {
  font-weight: bold;
}
.fm033_ul .active {
  font-weight: bold;
}

.path_star {
  display: inline-block;
  width: 17px;
  height: 17px;
  vertical-align: middle;
  background: url(../img/path_star_off.png) no-repeat;
}
.path_star_on {
  display: inline-block;
  width: 17px;
  height: 17px;
  vertical-align: middle;
  background: url(../img/path_star_on.png) no-repeat;
}

.div {
  height: auto;
  display: inline-block;
  box-sizing: border-box;
  border-radius: 2px;
}

.outer_line {
  border: 1px solid #dfdfdf;
  border-radius: 3px;
  margin-top: 5px;
  box-sizing: border-box;
}

.outer_grid {
  display: flex;
  width: 100%;
  flex-direction: column;
  min-height: 200px;
  position: relative;
  border: 0 !important;
}

.outer_tab {
  display: flex;
  width: 100%;
  flex-direction: column;
  min-height: 200px;
  height: calc(100vh - 131px);
  overflow: auto;
}
.inner_tab {
  padding: 5px;
  padding-top: 0 !important;
  background: #fff;
}

.tab_dhtml_line {
  /* dhtml용 */
  min-height: inherit;
  height: 100%;
  overflow: hidden;
  border-bottom: 1px solid #dfdfdf;
}
.outer_line_grid {
  border: 1px solid #dfdfdf;
  box-sizing: border-box;
  border-top: 0;
  border-bottom: 0;
  display: flex;
  flex-direction: column;
  min-height: 200px;
  height: calc(100vh - 131px);
  height: -ms-calc(100vh - 131px);
  height: -webkit-calc(100vh - 131px);
  position: relative;
  width: 100%;
}

.outer_line_form {
  overflow: auto;
  border: 1px solid #dfdfdf;
  margin-top: 5px;
  box-sizing: border-box;
  height: calc(100vh - 131px);
  display: flex;
  flex-direction: column;
}

/* 검색 밑 div_title 부분에 건수나 버튼 없을 경우 아래 영역 표현 */
.notitle_line_form {
  overflow: auto;
  border: 1px solid #dfdfdf;
  margin-top: 15px;
  min-height: calc(100vh - 103px) !important;
  box-sizing: border-box;
  height: calc(100vh - 200px) !important;
}

.outer_line_2dangrid {
  overflow: hidden;
  border: 1px solid #dfdfdf;
  margin-top: 5px;
  box-sizing: border-box;
  height: calc(100vh - 52vh) !important;
  border-top: none;
}
.outer_line_2danform {
  overflow: auto;
  border: 1px solid #dfdfdf;
  margin-top: 5px;
  box-sizing: border-box;
  height: calc(100vh - 52vh) !important;
  border-top: none;
}
.outer_line_2dangrid2 {
  overflow: hidden;
  border: 1px solid #dfdfdf;
  margin-top: 5px;
  box-sizing: border-box;
  height: calc(45vh - 98px) !important;
  border-top: none;
}

.dhtml_line_2danpaging2 {
  /* dhtml용 */
  border: 1px solid #dfdfdf;
  border-left: none;
  border-right: none;
  height: calc(45vh - 165px) !important;
  overflow: hidden;
}

.dhtml_line_2danpaging {
  /* dhtml용 */
  border: 1px solid #dfdfdf;
  border-left: none;
  border-right: none;
  height: calc(55vh - 160px) !important;
  overflow: hidden;
}

.dhtml_line_2dan {
  /* dhtml용 */
  border: 1px solid #dfdfdf;
  border-left: none;
  border-right: none;
  height: calc(55vh - 140px) !important;
  overflow: hidden;
}

.dhtml_grid {
  height: inherit !important;
  min-height: inherit !important;
  width: inherit !important;
  min-width: inherit !important;
  display: flex;
  flex-direction: column;
  position: relative;
}

.dhtml_line_paging {
  /* dhtml용 */
  border-bottom: 1px solid #dfdfdf;
  height: calc(100vh - 179px) !important;
  overflow: hidden;
}

.dhtml_line {
  /* dhtml용 */
  border-left: none;
  border-right: none;
  overflow: hidden;
  border-top: none;
  min-height: 1px;
  height: 100%;
  border-bottom: 1px solid #dfdfdf;
}
.div_line_bottom {
  border-bottom: 1px solid #dfdfdf;
}
.div_liner {
  border: 1px solid #dfdfdf;
}

.div_divine {
  height: 100%;
  display: inline-block;
}
.div_line_pd7 {
  /* 사방 5px 여백 */
  border: 1px solid #dfdfdf;
  border-radius: 2px;
  min-height: calc(100vh - 130px) !important;
  box-sizing: border-box;
}

.div_line_pdlr7 {
  /* 좌우측 5px 패딩여백 */
  border-radius: 2px;
  min-height: calc(100vh - 130px) !important;
  box-sizing: border-box;
}
.searchx2h {
  height: calc(100vh - 169px) !important;
  min-height: auto !important;
}
.searchx2h > .dhtml_line_paging {
  height: calc(100vh - 218px) !important;
}
.searchx2h > .dhtml_line {
  height: calc(100vh - 169px) !important;
}
.searchx2h > .outer_tab > .dhtml_line {
  height: inherit !important;
}

div.gridbox_material.gridbox table.obj tr td:nth-child(1) {
  border-left: none !important;
}

div.gridbox_material.gridbox .xhdr {
  width: inherit !important;
  overflow: hidden !important;
}
div.gridbox .objbox {
  width: inherit !important;
}

div.gridbox_material.gridbox table.obj tr td.numbercell {
  background: #f2f5f7;
  border-bottom: solid 1px #dfdfdf;
}

#noFoundDataOnGridMsg {
  margin-top: 5%;
  text-align: center;
}

/* 2021-06-15 메뉴10개, 메뉴추가시 min-height 조정 */
@media screen and (min-height: 1010px) {
  #slide {
    display: none;
  }
  #slideBack {
    display: none;
  }
}

.consearch_div {
  display: table;
  overflow: visible;
  white-space: nowrap;
  vertical-align: middle;
  width: 100%;
  border: 1px solid #dfdfdf;
  box-sizing: border-box;
  background: #fff;
  margin-bottom: 5px;
}
.consearch_div.nopath {
  border-top: 1px solid #dfdfdf;
}
/* 프레임 안쪽 검색 div */
.consearchbt_div:after {
  content: "";
  display: block;
  clear: both;
}
.consearch_div_in {
  display: table;
  overflow: visible;
  white-space: nowrap;
  vertical-align: middle;
  height: 33px;
  width: 100%;
  border: 1px solid #dfdfdf;
  box-sizing: border-box;
  background: #fff;
  line-height: 29px;
}
.consearch_input {
  display: table-cell;
  padding: 0px;
  box-sizing: border-box;
  background: #f8f8fa;
  line-height: inherit;
}
.consearchbt_div {
  display: table-cell;
  padding: 0px;
  box-sizing: border-box;
  background: #f8f8fa;
  line-height: inherit;
  vertical-align: middle;
}

.consearchinput_list {
  position: relative;
  background: #f8f8fa;
}

.pop-content .consearchbt_list .btn {
  background: #fff;
  border: 1px solid #ccc;
  height: 28px;
}

.consearchinput_list li {
  position: relative;
  display: inline-block;
  margin-right: 10px;
  line-height: 1;
}

.consearchbt_list li:first-child {
  margin-right: 3px;
}

.consearchbt_list li:last-child {
  margin-right: 6px;
}

.consearchinput_list .span {
  display: inline-block;
  vertical-align: middle;
  border-left: 1px solid #dfdfdf;
  padding: 0 10px 0 16px;
  height: 33px;
  font-weight: bold;
  line-height: 33px;
}
.consearchinput_list li:first-child .span {
  border-left: 0 !important;
}
.consearchinput_list > li:nth-child(1) > span {
  border-left: 0;
}
.consearchbt_list {
  vertical-align: middle;
  position: relative;
  float: right;
}
.consearchbt_list .glyphicon-search {
  vertical-align: middle;
}
.consearchbt_list .glyphicon-refresh {
  vertical-align: middle;
}
.consearchbt_list li {
  float: left;
} /*color:#333; display:block;width:100%;height:100%; font-weight:bold;transition : border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out,background-color 0.15s ease-in-out 0s;*/

.consearchbt_list li a {
  display: block;
  font-size: 12px;
  border: 1px solid #dfdfdf;
  color: #333;
  padding: 0px 7px;
  background: #fff;
  transition: background-color 0.15s ease-in-out 0s;
  margin-right: 5px;
  font-weight: bold;
}

.flex2 .outer_line_grid {
  display: flex;
  flex-direction: column;
  height: calc(100vh - 176px);
  border: 1px solid #dfdfdf;
} /*background:url(../img/leaf_bg.jpg) right top no-repeat;*/
.flex2 .outer_line_form {
  display: flex;
  flex-direction: column;
  overflow: auto;
  min-height: calc(100vh - 176px);
  height: calc(100vh - 200px);
  border: 1px solid #dfdfdf;
} /*background:url(../img/leaf_bg.jpg) right top no-repeat;*/

/* 팝업 윈도우 minmax 지우기 */
.dhxwins_vp_material:has(.no_popup_minmax)
  .dhxwin_active
  .dhxwin_btns
  .dhxwin_button_minmax {
  display: none;
}

.menuTabbars__dropdown {
  position: relative;
}

button.menuTabbars_dropdown__button {
  margin-right: 10px;
}

.menuTabbars_dropdown__contents {
  min-width: 240px;
  background: #fff;
  border-bottom-left-radius: 3px;
  border-bottom-right-radius: 3px;
  position: absolute;
  top: 27px;
  right: 0;
  border: 1px solid #ddd;
  border-top: none;
  display: none;
  z-index: 10;
}

.menuTabbars_dropdown__contents > div {
  display: flex;
  gap: 10px;
  flex-wrap: wrap;
  justify-content: center;
  padding: 10px;
}

.menuTabbars_dropdown__contents > div > a {
  min-width: 100px;
  width: calc(50% - 10px);
  display: block;
  height: 28px;
  color: #555;
  display: flex;
  align-items: center;
  gap: 6px;
  padding-left: 6px;
}

.menuTabbars_dropdown__contents > div > a:hover {
  background: #f6f6f6;
  border-radius: 6px;
}

.menuTabbars_dropdown__contents > div > a:hover span {
  color: #1d48a0;
  font-weight: 500;
}
.menuTabbars_dropdown__contents > div > a > span {
  font-size: 14px;
}

.menuTabbars_dropdown__contents.show {
  display: block;
}

/*************************** 2026년 2월 시작 ***************************/

.mgt4 {
  margin-top: 4px !important;
}
.mgt8 {
  margin-top: 8px !important;
}
.mgt12 {
  margin-top: 12px !important;
}
.mgt16 {
  margin-top: 16px !important;
}
.mgt20 {
  margin-top: 20px !important;
}
.mgt24 {
  margin-top: 24px !important;
}
.mgt28 {
  margin-top: 28px !important;
}
.mgt32 {
  margin-top: 32px !important;
}
.mgt36 {
  margin-top: 36px !important;
}
.mgt40 {
  margin-top: 40px !important;
}
.mgt44 {
  margin-top: 44px !important;
}
.mgt48 {
  margin-top: 48px !important;
}
.mgt52 {
  margin-top: 52px !important;
}
.mgt56 {
  margin-top: 56px !important;
}
.mgt60 {
  margin-top: 60px !important;
}
.mgt64 {
  margin-top: 64px !important;
}
.mgt68 {
  margin-top: 68px !important;
}
.mgt72 {
  margin-top: 72px !important;
}
.mgt76 {
  margin-top: 76px !important;
}
.mgt80 {
  margin-top: 80px !important;
}
.mgt84 {
  margin-top: 84px !important;
}
.mgt88 {
  margin-top: 88px !important;
}
.mgt92 {
  margin-top: 92px !important;
}
.mgt96 {
  margin-top: 96px !important;
}
.mgt100 {
  margin-top: 100px !important;
}
.mgb0 {
  margin-bottom: 0 !important;
}
.mgb4 {
  margin-bottom: 4px !important;
}
.mgb8 {
  margin-bottom: 8px !important;
}
.mgb12 {
  margin-bottom: 12px !important;
}
.mgb16 {
  margin-bottom: 16px !important;
}
.mgb20 {
  margin-bottom: 20px !important;
}
.mgb24 {
  margin-bottom: 24px !important;
}
.mgb28 {
  margin-bottom: 28px !important;
}
.mgb32 {
  margin-bottom: 32px !important;
}
.mgb36 {
  margin-bottom: 36px !important;
}
.mgb40 {
  margin-bottom: 40px !important;
}
.mgb44 {
  margin-bottom: 44px !important;
}
.mgb48 {
  margin-bottom: 48px !important;
}
.mgb52 {
  margin-bottom: 52px !important;
}
.mgb56 {
  margin-bottom: 56px !important;
}
.mgb60 {
  margin-bottom: 60px !important;
}
.mgb64 {
  margin-bottom: 64px !important;
}
.mgb68 {
  margin-bottom: 68px !important;
}
.mgb72 {
  margin-bottom: 72px !important;
}
.mgb76 {
  margin-bottom: 76px !important;
}
.mgb80 {
  margin-bottom: 80px !important;
}
.mgb84 {
  margin-bottom: 84px !important;
}
.mgb88 {
  margin-bottom: 88px !important;
}
.mgb92 {
  margin-bottom: 92px !important;
}
.mgb96 {
  margin-bottom: 96px !important;
}
.mgb100 {
  margin-bottom: 100px !important;
}
.mgr4 {
  margin-right: 4px !important;
}
.mgr8 {
  margin-right: 8px !important;
}
.mgr12 {
  margin-right: 12px !important;
}
.mgr16 {
  margin-right: 16px !important;
}
.mgr20 {
  margin-right: 20px !important;
}
.mgr24 {
  margin-right: 24px !important;
}
.mgr28 {
  margin-right: 28px !important;
}
.mgr32 {
  margin-right: 32px !important;
}
.mgr36 {
  margin-right: 36px !important;
}
.mgr40 {
  margin-right: 40px !important;
}
.mgr44 {
  margin-right: 44px !important;
}
.mgr48 {
  margin-right: 48px !important;
}
.mgr52 {
  margin-right: 52px !important;
}
.mgr56 {
  margin-right: 56px !important;
}
.mgr60 {
  margin-right: 60px !important;
}
.mgr64 {
  margin-right: 64px !important;
}
.mgr68 {
  margin-right: 68px !important;
}
.mgr72 {
  margin-right: 72px !important;
}
.mgr76 {
  margin-right: 76px !important;
}
.mgr80 {
  margin-right: 80px !important;
}
.mgr84 {
  margin-right: 84px !important;
}
.mgr88 {
  margin-right: 88px !important;
}
.mgr92 {
  margin-right: 92px !important;
}
.mgr96 {
  margin-right: 96px !important;
}
.mgr100 {
  margin-right: 100px !important;
}
.mgl4 {
  margin-left: 4px !important;
}
.mgl8 {
  margin-left: 8px !important;
}
.mgl12 {
  margin-left: 12px !important;
}
.mgl16 {
  margin-left: 16px !important;
}
.mgl20 {
  margin-left: 20px !important;
}
.mgl24 {
  margin-left: 24px !important;
}
.mgl28 {
  margin-left: 28px !important;
}
.mgl32 {
  margin-left: 32px !important;
}
.mgl36 {
  margin-left: 36px !important;
}
.mgl40 {
  margin-left: 40px !important;
}
.mgl44 {
  margin-left: 44px !important;
}
.mgl48 {
  margin-left: 48px !important;
}
.mgl52 {
  margin-left: 52px !important;
}
.mgl56 {
  margin-left: 56px !important;
}
.mgl60 {
  margin-left: 60px !important;
}
.mgl64 {
  margin-left: 64px !important;
}
.mgl68 {
  margin-left: 68px !important;
}
.mgl72 {
  margin-left: 72px !important;
}
.mgl76 {
  margin-left: 76px !important;
}
.mgl80 {
  margin-left: 80px !important;
}
.mgl84 {
  margin-left: 84px !important;
}
.mgl88 {
  margin-left: 88px !important;
}
.mgl92 {
  margin-left: 92px !important;
}
.mgl96 {
  margin-left: 96px !important;
}
.mgl100 {
  margin-left: 100px !important;
}
.pdt4 {
  padding-top: 4px !important;
}
.pdt8 {
  padding-top: 8px !important;
}
.pdt12 {
  padding-top: 12px !important;
}
.pdt16 {
  padding-top: 16px !important;
}
.pdt20 {
  padding-top: 20px !important;
}
.pdt24 {
  padding-top: 24px !important;
}
.pdt28 {
  padding-top: 28px !important;
}
.pdt32 {
  padding-top: 32px !important;
}
.pdt36 {
  padding-top: 36px !important;
}
.pdt40 {
  padding-top: 40px !important;
}
.pdt44 {
  padding-top: 44px !important;
}
.pdt48 {
  padding-top: 48px !important;
}
.pdt52 {
  padding-top: 52px !important;
}
.pdt56 {
  padding-top: 56px !important;
}
.pdt60 {
  padding-top: 60px !important;
}
.pdt64 {
  padding-top: 64px !important;
}
.pdt68 {
  padding-top: 68px !important;
}
.pdt72 {
  padding-top: 72px !important;
}
.pdt76 {
  padding-top: 76px !important;
}
.pdt80 {
  padding-top: 80px !important;
}
.pdt84 {
  padding-top: 84px !important;
}
.pdt88 {
  padding-top: 88px !important;
}
.pdt92 {
  padding-top: 92px !important;
}
.pdt96 {
  padding-top: 96px !important;
}
.pdt100 {
  padding-top: 100px !important;
}
.pdb4 {
  padding-bottom: 4px !important;
}
.pdb8 {
  padding-bottom: 8px !important;
}
.pdb12 {
  padding-bottom: 12px !important;
}
.pdb16 {
  padding-bottom: 16px !important;
}
.pdb20 {
  padding-bottom: 20px !important;
}
.pdb24 {
  padding-bottom: 24px !important;
}
.pdb28 {
  padding-bottom: 28px !important;
}
.pdb32 {
  padding-bottom: 32px !important;
}
.pdb36 {
  padding-bottom: 36px !important;
}
.pdb40 {
  padding-bottom: 40px !important;
}
.pdb44 {
  padding-bottom: 44px !important;
}
.pdb48 {
  padding-bottom: 48px !important;
}
.pdb52 {
  padding-bottom: 52px !important;
}
.pdb56 {
  padding-bottom: 56px !important;
}
.pdb60 {
  padding-bottom: 60px !important;
}
.pdb64 {
  padding-bottom: 64px !important;
}
.pdb68 {
  padding-bottom: 68px !important;
}
.pdb72 {
  padding-bottom: 72px !important;
}
.pdb76 {
  padding-bottom: 76px !important;
}
.pdb80 {
  padding-bottom: 80px !important;
}
.pdb84 {
  padding-bottom: 84px !important;
}
.pdb88 {
  padding-bottom: 88px !important;
}
.pdb92 {
  padding-bottom: 92px !important;
}
.pdb96 {
  padding-bottom: 96px !important;
}
.pdb100 {
  padding-bottom: 100px !important;
}
.pdl4 {
  padding-left: 4px !important;
}
.pdl8 {
  padding-left: 8px !important;
}
.pdl12 {
  padding-left: 12px !important;
}
.pdl16 {
  padding-left: 16px !important;
}
.pdl20 {
  padding-left: 20px !important;
}
.pdl24 {
  padding-left: 24px !important;
}
.pdl28 {
  padding-left: 28px !important;
}
.pdl32 {
  padding-left: 32px !important;
}
.pdl36 {
  padding-left: 36px !important;
}
.pdl40 {
  padding-left: 40px !important;
}
.pdl44 {
  padding-left: 44px !important;
}
.pdl48 {
  padding-left: 48px !important;
}
.pdl52 {
  padding-left: 52px !important;
}
.pdl56 {
  padding-left: 56px !important;
}
.pdl60 {
  padding-left: 60px !important;
}
.pdl64 {
  padding-left: 64px !important;
}
.pdl68 {
  padding-left: 68px !important;
}
.pdl72 {
  padding-left: 72px !important;
}
.pdl76 {
  padding-left: 76px !important;
}
.pdl80 {
  padding-left: 80px !important;
}
.pdl84 {
  padding-left: 84px !important;
}
.pdl88 {
  padding-left: 88px !important;
}
.pdl92 {
  padding-left: 92px !important;
}
.pdl96 {
  padding-left: 96px !important;
}
.pdl100 {
  padding-left: 100px !important;
}
.pdr4 {
  padding-right: 4px !important;
}
.pdr8 {
  padding-right: 8px !important;
}
.pdr12 {
  padding-right: 12px !important;
}
.pdr16 {
  padding-right: 16px !important;
}
.pdr20 {
  padding-right: 20px !important;
}
.pdr24 {
  padding-right: 24px !important;
}
.pdr28 {
  padding-right: 28px !important;
}
.pdr32 {
  padding-right: 32px !important;
}
.pdr36 {
  padding-right: 36px !important;
}
.pdr40 {
  padding-right: 40px !important;
}
.pdr44 {
  padding-right: 44px !important;
}
.pdr48 {
  padding-right: 48px !important;
}
.pdr52 {
  padding-right: 52px !important;
}
.pdr56 {
  padding-right: 56px !important;
}
.pdr60 {
  padding-right: 60px !important;
}
.pdr64 {
  padding-right: 64px !important;
}
.pdr68 {
  padding-right: 68px !important;
}
.pdr72 {
  padding-right: 72px !important;
}
.pdr76 {
  padding-right: 76px !important;
}
.pdr80 {
  padding-right: 80px !important;
}
.pdr84 {
  padding-right: 84px !important;
}
.pdr88 {
  padding-right: 88px !important;
}
.pdr92 {
  padding-right: 92px !important;
}
.pdr96 {
  padding-right: 96px !important;
}
.pdr100 {
  padding-right: 100px !important;
}

/*************************** 대쉬보드 ***************************/

.dashBoard-box {
  width: 100%;
  padding: 12px;
  border: 1px solid var(--gray-300);
  background: #fff;
  border-radius: 8px;
}

.dashBoard-head {
  display: flex;
  gap: 16px;

  align-items: center;
  margin-bottom: 12px;
  width: 100%;
  min-width: 1280px;
  padding-bottom: 12px;
  border-bottom: 1px solid var(--gray-300);
}

.dashBoard-head__title {
  font-size: 22px;
  font-weight: 700;
}

.dashBoard-head__detail {
  display: flex;
  justify-content: space-between;
}

.dashBoard-head__detail .detail__box {
  margin-right: 8px;
}

.dashBoard-head__detail .detail__box > span:first-child {
  border: 1px solid var(--gray-300);
  background: var(--gray-200);
  border-radius: 20px;
  width: 36px;
  height: 18px;
  line-height: 17px;
  text-align: center;
  margin-right: 8px;
  color: var(--gray-900);
  font-weight: 400;
  font-size: 12px;
}

.dashBoard-head__detail .detail__box:last-child {
  margin-right: 0;
}
.dashBoard-head__detail .detail__box span {
  font-size: 13px;
  font-weight: 500;
  display: inline-block;
}

.dashBoard-head__detail .detail__box span:last-child {
  color: #333;
}

/* 프로세스 박스들 */

.dashBoard-content {
  display: flex;

  gap: 16px;
  min-width: 1280px;
  /*  max-width: 1680px; */
}

.dashBoard-content__box {
  flex: 1;
  max-width: 220px;
  height: 100%;
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
  overflow: hidden;
}

.dashBoard-content__box.widest {
  flex: 1.4;
  max-width: none;
}
.box__head {
  border-top-left-radius: 8px;
  border-top-right-radius: 8px;
  padding: 20px 10px 16px;
}
.dashBoard-content__box.status-complete .box__head {
  background: var(--green-50);
  border: 1px solid #79cdc0;
}

.dashBoard-content__box.status-in-progress .box__head {
  border: 1px solid var(--blue-300);
  background: #f5f9ff;
}

.dashBoard-content__box.status-pending .box__head {
  background: var(--gray-200);
  border: 1px solid var(--gray-400);
}

.box__head > div:first-child {
  display: flex;
  justify-content: space-between;
  margin-bottom: 8px;
  align-items: center;
}

.box__head strong {
  font-size: 16px;
  font-weight: 600;
}

.box__head .badge {
  display: inline-block;
  height: 18px;
  font-size: 12px;
  font-weight: 500;
  padding: 0 4px;
  border-radius: 4px;
  letter-spacing: 1px;
  box-sizing: border-box;
}

/* 뱃지--완료 */
.box__head .badge.status-complete {
  background: var(--green-500);
  color: #fff;
}

/* 뱃지--진행중 */
.box__head .badge.status-in-progress {
  color: #fff;
  height: 22px;
  background: var(--blue-500);
  border: 2px solid var(--blue-200);
  animation: pulse 2s ease-in-out infinite;
}

/* 뱃지--진행중 */
.box__head .badge.status-in-progress {
  color: #fff;
  height: 22px;
  background: var(--blue-500);
  border: 2px solid var(--blue-200);
  animation: pulse 2s ease-in-out infinite;
}
@keyframes pulse {
  0% {
    box-shadow: 0 0 0 0 rgba(59, 130, 246, 0.6);
  }
  70% {
    box-shadow: 0 0 0 3px rgba(59, 130, 246, 0);
  }
  100% {
    box-shadow: 0 0 0 0 rgba(59, 130, 246, 0);
  }
}

/* 뱃지--대기 */
.box__head .badge.status-pending {
  color: var(--gray-800);
  background: var(--gray-300);
}

.box__head .progress {
  width: 100%;
  height: 5px;
  background: var(--blue-200);
  border-radius: 999px;
  overflow: hidden;
}

.box__head .progress__bar {
  height: 100%;
  width: 0;
  background: linear-gradient(to right, #53a9da, #32c4b7);
  border-radius: 999px;
}

/* 프로그레스 바 */

.box__head .progress.is-pending {
  background: var(--gray-400);
}

.box__head .progress.is-pending .progress__bar {
  width: 0%;
}

.box__head .progress.is-in-progress .progress__bar {
  width: 50%;
  position: relative;
  overflow: hidden;
  background: linear-gradient(90deg, #368fff, #276ac0);
}

.box__head .progress.is-in-progress .progress__bar::after {
  content: "";
  position: absolute;
  top: 0;
  left: -20px;
  width: calc(100% + 40px);
  height: 100%;

  background: repeating-linear-gradient(
    45deg,
    rgba(255, 255, 255, 0.3) 0px,
    rgba(255, 255, 255, 0.3) 1px,
    transparent 1px,
    transparent 4px
  );
  background-size: 16px;
  /* 타일 정확하게 고정 (중요) */

  animation: stripe-move 0.6s linear infinite;
  pointer-events: none;
}

@keyframes stripe-move {
  from {
    transform: translateX(0);
  }
  to {
    transform: translateX(16px);
  }
}

.box__head .progress.is-complete .progress__bar {
  width: 100%;
}

.box__contents {
  border: 1px solid var(--gray-400);
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}

.dashboard-box__double-icon {
  display: inline-block;
  width: 20px;
}

.box__contents .works {
  padding: 8px 10px;
  height: 160px;
  overflow-y: auto;
}
.box__contents .works li {
  display: flex;
  justify-content: space-between;
  align-items: center;
  height: 36px;
  border-bottom: 1px solid var(--gray-300);
}

.box__contents .works li p {
  font-size: 14px;
}

.box__contents .works li p:first-child {
  display: inline-flex;
}

.dashboard-box__icon {
  display: inline-block;
  width: 16px;
  vertical-align: middle;
  margin-right: 4px;
}

.status-complete .dashboard-box__icon {
  fill: var(--green-500);
}

.status-pending .dashboard-box__icon {
  fill: var(--gray-500);
}

.status-in-progress .dashboard-box__icon {
  fill: var(--blue-500);
}

.box__contents .works li strong {
  font-weight: 600;
  font-size: 15px;
}

.box__contents .bottom {
  /* 	background: var(--blue-50);
	border-top: 1px solid var(--gray-300); */
  display: flex;
  flex-wrap: wrap;
  align-content: center;
  justify-content: center;
  gap: 4px;
  padding: 8px 10px;
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
  height: 66px;
  overflow: hidden;
}

.box__contents .bottom a {
  color: var(--gray-900);
  font-size: 13px;
  line-height: 1.2;
  display: block;
  position: relative;
  border: 1px solid var(--blue-200);
  background: var(--blue-50);
  padding: 2px 6px;
  border-radius: 2px;
  color: var(--blue-700);
}
.box__contents .bottom a:hover {
  text-decoration: underline;
  color: var(--blue-500);
}

/* 완료 */

/* 진행중 */
.dashBoard-content__box.status-in-progress {
  /* margin-top: -24px; */
  animation: pulse2 2s linear infinite;
}

@keyframes pulse2 {
  0% {
    box-shadow: 0 0 0 0px rgba(59, 130, 246, 0);
  }
  50% {
    box-shadow: 0 0 6px 6px rgba(59, 130, 246, 0.1);
  }
  100% {
    box-shadow: 0 0 0 8px rgba(59, 130, 246, 0);
  }
}

.dashBoard-content__box.status-in-progress .box__head,
.dashBoard-content__box.status-in-progress .box__contents {
  border: 1px solid var(--blue-500);
}

/* 공통 */
.dashBoard-content__box.status-complete .box__contents,
.dashBoard-content__box.status-in-progress .box__contents,
.dashBoard-content__box.status-pending .box__contents {
  border-top: none;
}

/* 메인화면의 헤더 부분 */

.session-extend {
  display: inline-flex;
  gap: 6px;
  align-items: center;
  padding: 4px 10px;
  border: 1px solid var(--gray-300);
  border-top: none;
  border-bottom: none;
}

.session-extend__time {
  color: var(--green-700);
  font-size: 14px;
  font-weight: 600;
  letter-spacing: 0.3px;
}

.session-extend__action {
  background: var(--green-600);
  border-radius: 200px;
  height: 20px;
  padding: 2px 6px;
  min-height: initial;
  font-size: 13px;
  color: #fff;
}

.session-extend__action:hover {
  background: var(--green-700);
}

/* 대시보드 단계에서 내용을 삭제한 경우에 대한 스타일 */

.dashBoard-content__box.no-contents .box__head {
  border-bottom-left-radius: 8px;
  border-bottom-right-radius: 8px;
}

.dashBoard-content__box.no-contents .box__contents {
  border: none;
}

/* 게시판 스타일 */

.main__bullet-title {
  background: url("../images/bullet.svg") no-repeat left;
  background-size: 5px;
  margin-bottom: 8px;
  position: relative;
}

.main__bullet-title.button {
  display: flex;
  justify-content: space-between;
}

.main__bullet-title > h3 {
  font-size: 20px;
  font-weight: 800;
  white-space: nowrap;
}

.main__bullet-title-button-wrap {
  display: flex;
  gap: 4px;
}

.main__bullet-title-button-wrap select {
  height: 28px;
}

.search-button {
  border-radius: 4px;
  background: var(--navy-500);
  color: #fff;
  white-space: nowrap;
  font-size: 13px;
  text-align: center;
  min-width: 52px;
  padding: 0 8px;
  height: 28px;
}

.button--large {
  min-width: 60px;
  padding: 0 12px;
  height: 36px;
  border-radius: 4px;
  font-weight: 500;
}
.button--large.filled {
  background: var(--navy-700); /* #1C3A5C */
  color: #fff;
}
.button--large.outlined {
  border: 2px solid var(--navy-700);
  color: var(--navy-700);
  background: #fff;
  font-weight: 600;
}
.button--large.negative {
  border: 2px solid var(--red-500); /* #FF4931 */
  color: var(--red-500);
  background: #fff;
  font-weight: 600;
}

.button--medium {
  padding: 0 8px;
  height: 28px;
  border-radius: 4px;
  font-weight: 400;
  font-size: 14px;
  white-space: nowrap;
  min-width: 60px;
}

.button--medium.filled {
  background: var(--navy-600);
  color: #fff;
}
.button--medium.outlined {
  border: 1px solid var(--navy-600);
  color: var(--navy-600);
  background: #fff;
  font-weight: 600;
}
.button--medium.negative {
  border: 1px solid var(--red-500);
  color: var(--red-500);
  background: #fff;
  font-weight: 600;
}

table.project-board {
  width: 100%;
  border-collapse: collapse;
}

.project-board thead {
  background: var(--gray-200);
  height: 36px;
  line-height: 36px;
  font-weight: 500;
  border-top: 1px solid var(--gray-700);
  border-bottom: 1px solid var(--gray-400);
}

.project-board th,
.project-board td {
  font-size: 14px;
  text-align: center;
}

.project-board td {
  border-bottom: 1px solid var(--gray-300);
  min-height: 28px;
  padding: 8px 0;
}

.project-board a:hover {
  text-decoration: underline;
}

.project-board-view {
	border-top: 1px solid var(--gray-700);
}

.project-board-view__title {
  font-size: 24px;
  font-weight: 600;
  text-align: center;
  color: var(--gray-900);
  height: initial;
  margin: initial;
  padding-top: 20px;
}

.project-board-view__info {
  display: flex;
  align-items: center;
  padding: 6px 0 20px;
  border-bottom: 1px solid var(--gray-400);
  justify-content: center;
}

.project-board-view__info span {
  position: relative;
  padding: 0 12px;
  font-size: 14px;
  color: var(--gray-800);
}

.project-board-view__info span:first-child {
  padding-left: 0;
}

.project-board-view__info span::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  width: 1px;
  height: 8px;
  background: var(--gray-400);
  transform: translateY(-50%);
}

.project-board-view__info span:last-child::after {
  display: none;
}

.project-board-view__category {
  color: var(--blue-500);
  font-weight: bolder;
  text-align: center;
  display: block;
  margin-bottom: 4px;
}

.project-board-view__contents {
  min-height: 400px;
  padding: 16px;
}

.project-board-view__footer {
  border: 1px solid var(--gray-300);
  border-radius: 8px;
  padding: 0 24px;
  margin-bottom: 16px;
}

.project-board-view__footer > div {
  display: flex;
}

.project-board-view__footer__div {
  padding: 12px 0;
}

.project-board-view__footer__div.prev {
  border-bottom: 1px solid var(--gray-300);
}

.project-board-view__footer__div > span {
  padding-left: 20px;
  font-weight: 500;
  margin-right: 16px;
  display: inline-block;
  font-size: 14px;
}
.project-board-view__footer__div.prev span {
  background: url("../assets/images/up.svg") no-repeat left center;
}

.project-board-view__footer__div.next span {
  background: url("../assets/images/down.svg") no-repeat left center;
}

.project-board-view__footer__div a {
  color: var(--gray-900);
  font-size: 14px;
  cursor: pointer;
}
.project-board-view__footer__div a:hover {
  color: var(--blue-500);
  text-decoration: underline;
}
.project-board-view__buttons {
  display: flex;
  gap: 4px;
  justify-content: space-between;
}

:root {
  /* Navy */
  --navy-100: #f0f3f8;
  --navy-200: #dfe5ec;
  --navy-300: #bec9d8;
  --navy-400: #5a7fb0;
  --navy-500: #2c5282;
  --navy-600: #23466f;
  --navy-700: #1c3a5c;
  --navy-800: #152e49;
  --navy-900: #0f2237;

  /* Blue */
  --blue-50: #f5f9ff;
  --blue-100: #eaf2ff;
  --blue-200: #d6e5ff;
  --blue-300: #aecbff;
  --blue-400: #6fa6ff;
  --blue-500: #368fff;
  --blue-600: #2f7de0;
  --blue-700: #276ac0;
  --blue-800: #1f5799;

  /* Gray */
  --gray-100: #f8fafc;
  --gray-200: #f3f4f6;
  --gray-300: #e5e7eb;
  --gray-400: #d1d5db;
  --gray-500: #9ca3af;
  --gray-600: #7c8594;
  --gray-700: #6b7280;
  --gray-800: #4b5563;
  --gray-900: #1f2430;

  /* Red */
  --red-100: #ffd5ce;
  --red-500: #ff4931;

  /* green */
  --green-50: #f2fbfa;
  --green-100: #e6f7f5;
  --green-200: #cff1ec;
  --green-500: #2ec4b6;
  --green-600: #27aea2;
  --green-700: #209187;
  --green-800: #18726b;
  --green-900: #10534e;
}

/* pagination */
.pagination {
  display: flex;
  align-items: center;
  gap: 4px;
  justify-content: center;
  margin-top: 12px;
}

.pagination a {
  display: flex;
  align-items: center;
  justify-content: center;

  width: 30px;
  height: 30px;

  text-decoration: none;
  color: var(--gray-700);

  border-radius: 6px;
  font-size: 15px;
}

.pagination a:hover {
  color: var(--blue-500);
}

.pagination a.active {
  color: var(--blue-500);
}

.pagination a.disabled {
  opacity: 0.4;
  pointer-events: none;
}

/* left  */
.pagination-double-arrow-left {
  background: url("../assets/images/pagination-double-arrow-left.svg") no-repeat center;
}

.pagination-double-arrow-left:hover {
  background: url("../assets/images/pagination-double-arrow-left--hover.svg") no-repeat
    center;
}

.pagination-arrow-left {
  background: url("../assets/images/pagination-arrow-left.svg") no-repeat center;
}

.pagination-arrow-left:hover {
  background: url("../assets/images/pagination-arrow-left--hover.svg") no-repeat center;
}

/* right */
.pagination-double-arrow-right {
  background: url("../assets/images/pagination-double-arrow-right.svg") no-repeat
    center;
}

.pagination-double-arrow-right:hover {
  background: url("../assets/images/pagination-double-arrow-right--hover.svg")
    no-repeat center;
}

.pagination-arrow-right {
  background: url("../assets/images/pagination-arrow-right.svg") no-repeat center;
}

.pagination-arrow-right:hover {
  background: url("../assets/images/pagination-arrow-right--hover.svg") no-repeat
    center;
}