@charset "utf-8";
/*-------------------------------------------------------------------------------------------------------------
	File : Layout.css
	CSS 적용순서 : 아이디 > 태그와 클래스 > 클래스 > 태그
	CSS 선택자 선언순서 : Type Selector, Layout Selector, Class Selector, Etc
	CSS 속성 선언순서 : display, position, float/clear, overflow, width/height, margin/padding, border, background, font/color, align, etc
-------------------------------------------------------------------------------------------------------------*/

/* Wrapper */

/* 화면 확대 축소 */
body {
  transition: all 0.3s;
  -ms-transform-origin: 50% 0;
  -webkit-transform-origin: 50% 0;
  transform-origin: 50% 0;
}
body.zoom-80 {
  -ms-transform: scale(0.8, 0.8);
  -webkit-transform: scale(0.8, 0.8);
  transform: scale(0.8, 0.8);
}
body.zoom-90 {
  -ms-transform: scale(0.9, 0.9);
  -webkit-transform: scale(0.9, 0.9);
  transform: scale(0.9, 0.9);
}
body.zoom-100 {
  -ms-transform: scale(1, 1);
  -webkit-transform: scale(1, 1);
  transform: scale(1, 1);
}
body.zoom-110 {
  -ms-transform: scale(1.1, 1.1);
  -webkit-transform: scale(1.1, 1.1);
  transform: scale(1.1, 1.1);
}
body.zoom-120 {
  -ms-transform: scale(1.2, 1.2);
  -webkit-transform: scale(1.2, 1.2);
  transform: scale(1.2, 1.2);
}
body.zoom-130 {
  -ms-transform: scale(1.3, 1.3);
  -webkit-transform: scale(1.3, 1.3);
  transform: scale(1.3, 1.3);
}
body.zoom-140 {
  -ms-transform: scale(1.4, 1.4);
  -webkit-transform: scale(1.4, 1.4);
  transform: scale(1.4, 1.4);
}
body.zoom-150 {
  -ms-transform: scale(1.5, 1.5);
  -webkit-transform: scale(1.5, 1.5);
  transform: scale(1.5, 1.5);
}

/*** swiper 기본 style정의 ***/
.swiper-container {
  position: relative;
  margin: 0 auto;
  padding: 0;
  list-style: none;
  overflow: hidden;
  z-index: 1;
}
.swiper-container .swiper-wrapper {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  position: relative;
  width: 100%;
  height: 100%;
  transition-property: transform;
  box-sizing: content-box;
}
.swiper-container .swiper-wrapper .swiper-slide {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  position: relative;
  width: 100%;
  height: 100%;
  transition-property: transform;
  flex-shrink: 0;
}
.swiper-container .swiper-button-prev {
  display: block;
  position: absolute;
  left: 10px;
  top: calc(50% - 22px);
  cursor: pointer;
}
.swiper-container .swiper-button-next {
  display: block;
  position: absolute;
  right: 10px;
  top: calc(50% - 22px);
  cursor: pointer;
}
.swiper-container .swiper-button-prev::before,
.swiper-container .swiper-button-next::before {
  content: "";
  display: block;
  position: relative;
  width: 36px;
  height: 4px;
  border-radius: 2px;
  background-color: #ccc;
}
.swiper-container .swiper-button-prev::after,
.swiper-container .swiper-button-next::after {
  content: "";
  display: block;
  position: relative;
  width: 36px;
  height: 4px;
  border-radius: 2px;
  background-color: #ccc;
}
.swiper-container .swiper-button-prev.swiper-button-disabled,
.swiper-container .swiper-button-next.swiper-button-disabled {
  opacity: 0.2;
  cursor: auto; /* pointer-event:none; */
}
.swiper-container .swiper-button-prev::before {
  transform: rotate(135deg);
  top: 4px;
}
.swiper-container .swiper-button-prev::after {
  transform: rotate(45deg);
  top: 23px;
}
.swiper-container .swiper-button-next::before {
  transform: rotate(45deg);
  top: 4px;
}
.swiper-container .swiper-button-next::after {
  transform: rotate(135deg);
  top: 23px;
}

.swiper-container .swiper-pagination {
  display: inline-block;
  position: absolute;
  left: 0;
  bottom: 10px;
  width: 100%;
  text-align: center;
  z-index: 10;
}
.swiper-pagination .swiper-pagination-bullet {
  display: inline-block;
  position: relative;
  width: 8px;
  height: 8px;
  margin: 0 4px;
  padding: 0;
  border-radius: 100%;
  background-color: rgba(0, 0, 0, 0.3);
  z-index: 10;
}
.swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  opacity: 1;
  background-color: rgba(0, 0, 0, 1);
}
.swiper-pagination-clickable .swiper-pagination-bullet {
  cursor: pointer;
}
.swiper-container .swiper-controls {
  display: inline-block;
  position: absolute;
  left: 20px;
  bottom: 10px;
  z-index: 20;
}
.swiper-container .swiper-controls .swiper-button-play {
  width: 20px;
  height: 20px;
  z-index: 20;
}
.swiper-container .swiper-controls .swiper-button-pause {
  width: 20px;
  height: 20px;
  z-index: 20;
}

@media screen and (max-width: 768px) {
  .swiper-slide {
    padding-bottom: 6rem;
  }
  .swiper-slide .item .img {
    width: 100%;
  }
  .swiper-slide .item .img img {
    width: 80%;
  }
}

/*** 분할영역 만들기 ***/
/** float요소를 이용한 분할영역 **/
.partitionWrap {
  display: table;
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
}
.partitionWrap::after {
  content: "";
  clear: both;
  display: block;
}
.partitionWrap .blueZone {
  float: left;
  display: block;
  position: relative;
  margin: 0;
  padding: 0;
}
.partitionWrap .redZone {
  float: right;
  display: block;
  position: relative;
  margin: 0;
  padding: 0;
}

/* table속성을 부여하여 좌우 분할 */
.partitionWrap.tableGrid .blueZone,
.partitionWrap.tableGrid .redZone {
  float: initial;
  display: table-cell;
  height: 100%;
}
.partitionWrap.tableGrid .tableCell {
  display: table-cell;
  text-align: center;
  height: 100%;
}

/* Vertical-align:middle */
.tableGrid.vMiddle .blueZone,
.tableGrid.vMiddle .redZone,
.tableGrid.vMiddle .tableCell {
  vertical-align: middle;
}

/** flex요소를 이용한 분할영역 **/
.flexWrap {
  display: flex;
  position: relative;
  margin: 0;
  padding: 0;
  flex-wrap: nowrap;
  flex-direction: row;
  justify-content: space-between;
}
.flexWrap .flexItem {
  display: flex;
  position: relative;
}
.flexWrap .wsnw {
  white-space: nowrap;
}
.flexend {
  margin-left: auto;
}
.subHeading {
  align-items: flex-end;
  -ms-flex-align: end;
}
@media screen and (max-width: 768px) {
  .subHeading {
    align-items: flex-start;
    -ms-flex-align: start;
  }
  .subHeading .tip {
    margin-left: 0;
  }
  .flexend {
    margin-right: auto;
    margin-left: 0;
  }
}

/* flex속성 변경 */
.flexWrap.wrap {
  flex-wrap: wrap;
}
.flexWrap.column {
  flex-direction: column;
}
.flexWrap.default,
.flexItem.default {
  justify-content: start;
}
.flexWrap.center,
.flexItem.center {
  justify-content: center;
}
.flexWrap.around,
.flexItem.around {
  justify-content: space-around;
}
.flexWrap.vMiddle,
.flexItem.vMiddle {
  align-items: center;
}
.flexWrap.rowReverce {
  flex-direction: row-reverse;
  justify-content: flex-end;
}
.flexWrap.btnBoth {
  align-items: center;
}
.subHeading .tip {
  margin-left: 8px;
}

/* .flexWrap.default.subHeading .tip {margin-left:8px;} */
@media screen and (max-width: 768px) {
  .subHeading .tip {
    margin-left: 0;
  }
}
/* flex 모바일에서 column */
@media screen and (max-width: 768px) {
  .flexWrap.mfall {
    flex-direction: column;
  }
  .flexWrap.mfall > * {
    align-self: flex-end;
  }
  .flexWrap.mfall > button:first-child {
    margin-bottom: 15px;
  }
}

/*** 탭영역  ***/
.tabWrap {
  display: block;
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
}
/* .tabWrap .tabList {display:flex; position:relative; width:100%; margin:0 -8px 0 0; padding:0; flex-wrap:wrap; flex-direction:row; justify-content:start;} */
.tabWrap .tabList {
  display: flex;
  position: relative;
  width: 100%;
  margin: 0 -8px 0 0;
  padding: 0;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: start;
  border-bottom: 1px solid #ccc;
} /* 2021.01.19 곽현준 수정 */

.tabWrap .tabList.pcCenter {
  justify-content: center;
}

/* .tabWrap .tabList li {display:block; position:relative; height:40px; margin:0 8px 0 0; padding:0; box-sizing:border-box;} */
/* .tabWrap .tabList li {display:block; position:relative; height:40px; margin:0 0 0 -1px; padding:0; box-sizing:border-box;} */ /* 2021.01.19 곽현준 수정 */
.tabWrap .tabList li {
  display: block;
  position: relative;
  height: 43px;
  margin: 0 0 0 -1px;
  padding: 0;
  box-sizing: border-box;
} /* 2022.01.12 곽현준 메인 리뉴얼 수정 */

.tabWrap .tabList li button {
  display: inline-block;
}
.tabWrap .tabList li a,
.tabWrap .tabList li p {
  display: table;
}

/* .tabWrap .tabList li button,
.tabWrap .tabList li a,
.tabWrap .tabList li p {position:relative; min-width:90px; height:100%; margin:0; padding:0 16px; border:solid #999 1px; background-color:#FFF; text-align:center; border-radius:20px; box-sizing:border-box;} */
.tabWrap .tabList li button,
.tabWrap .tabList li a,
.tabWrap .tabList li p {
  position: relative;
  min-width: 90px;
  height: 100%;
  margin: 0;
  padding: 0 16px;
  border: 1px solid #ccc;
  border-bottom: none;
  background-color: #fff;
  text-align: center;
  /* border-radius:20px; */
  box-sizing: border-box;
  outline: none;
} /* 2021.01.19 곽현준 수정 */

.tabWrap .tabList li button,
.tabWrap .tabList li a {
  border: none;
  background-color: transparent;
} /* 2022.01.12 곽현준 메인 리뉴얼 추가 */

/*** 회원가입 탭영역  ***/
.tabWrap {
  display: block;
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
}

.tabWrap .cellin.info .txt {
  margin: 0 auto;
  width: 940px;
} /* 2021.01.20 곽현준 추가 */
@media screen and (max-width: 768px) {
  .tabWrap .cellin.info .txt {
    margin: 0 auto 15px;
    width: 300px;
  }
} /* 2021.01.20 곽현준 추가 */

.tabWrap .tabList.join {
  display: flex;
  position: relative;
  width: 100%;
  margin: 0 -8px 0 0;
  padding: 0;
  flex-wrap: wrap;
  flex-direction: row;
  justify-content: center;
  border-bottom: none;
}
.tabWrap .tabList.join li.join_box {
  display: block;
  position: relative;
  margin: 10px;
  padding: 22px;
  width: 300px;
  height: 150px;
  border: 1px solid #dadada;
  border-radius: 5px;
  box-sizing: border-box;
}
.tabWrap .tabList.join li.join_box:nth-child(1) {
  background: url("/images/contents/ico_join_people_02.png") 38px 22px no-repeat;
}
.tabWrap .tabList.join li.join_box:nth-child(2) {
  background: url("/images/contents/ico_join_people_04.png") 38px 22px no-repeat;
}
.tabWrap .tabList.join li.join_box:nth-child(3) {
  background: url("/images/contents/ico_join_people_03.png") 38px 22px no-repeat;
}
.tabWrap .tabList.join li.join_box:nth-child(1) div.big-text {
  margin: 15px 0 5px 73px;
  font-weight: 400;
  font-size: 17px;
  letter-spacing: -1px;
  white-space: nowrap;
}
.tabWrap .tabList.join li.join_box:nth-child(2) div.big-text {
  margin: 15px 0 5px 73px;
  font-weight: 400;
  font-size: 17px;
  letter-spacing: -1px;
  white-space: nowrap;
}
.tabWrap .tabList.join li.join_box:nth-child(3) div.big-text {
  margin: 15px 0 5px 84px;
  font-weight: 400;
  font-size: 17px;
  letter-spacing: -1px;
  white-space: nowrap;
}
.tabWrap .tabList.join li.join_box div.small-text {
  margin-left: 50px;
}

.tabWrap .tabList.join li.join_box button {
  display: inline-block;
}
.tabWrap .tabList.join li.join_box button span {
  padding: 0 15px;
  color: #fff;
}

.tabWrap .tabList.join li.join_box a,
.tabWrap .tabList li p {
  display: table;
}

.tabWrap .tabList.join li.join_box button,
.tabWrap .tabList.join li.join_box a {
  position: relative;
  display: inline-block;
  margin-top: 22px;
  width: 100%;
  height: 44px;
  border: 1px solid #003894;
  background-color: #003894;
  color: #fff;
  border-radius: 3px;
  outline: none;
}
.tabWrap .tabList.join li.current.join_box button,
.tabWrap .tabList.join li.current.join_box a {
  background-color: #4380e0;
  border-color: #4380e0;
}
/*** //회원가입 탭영역  ***/

/* 2021.01.19 곽현준 추가 */
@media screen and (max-width: 768px) {
  .tabWrap .tabList {
    display: flex;
    position: relative;
    width: 100%;
    margin: 0 -8px 0 0;
    padding: 0;
    flex-wrap: wrap;
    flex-direction: row;
    justify-content: start;
    border-bottom: initial;
  }
  .tabWrap .tabList li {
    display: block;
    position: relative;
    height: 40px;
    margin: 0 8px 0 0;
    padding: 0;
    box-sizing: border-box;
  }
  .tabWrap .tabList li button,
  .tabWrap .tabList li a,
  .tabWrap .tabList li p {
    position: relative;
    min-width: 90px;
    height: 100%;
    margin: 0;
    padding: 0 16px;
    border: solid #999 1px;
    background-color: #fff;
    text-align: center;
    border-radius: 20px;
    box-sizing: border-box;
    outline: none;
  }
}

/* .tabWrap .tabList li span {position:relative; width:100%; height:100%; margin:0; padding:0; text-align:center; vertical-align:middle; color:#999; font-size:16px;} */
.tabWrap .tabList li span {
  position: relative;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  text-align: center;
  vertical-align: middle;
  color: #999;
  font-size: 18px;
} /* 2022.01.12 곽현준 메인 리뉴얼 수정 */

.tabWrap .tabList li a span,
.tabWrap .tabList li p span {
  display: table-cell;
}

.tabWrap .tabList li.current a,
.tabWrap .tabList li.current p,
.tabWrap .tabList li.current button {
  background-color: #4380e0;
  border-color: #4380e0;
}

/* .tabWrap .tabList li.current button, .tabWrap .tabList li.current a, .tabWrap .tabList li.current p {cursor: default;} */
.tabWrap .tabList li.current button,
.tabWrap .tabList li.current a,
.tabWrap .tabList li.current p {
  cursor: default;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
} /* 2022.01.12 곽현준 메인 리뉴얼 수정 */

.tabWrap .tabList li.current span {
  color: #fff;
}

.tabWrap .tabContents {
  display: block;
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
}
.tabContents .tabCont {
  display: none;
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
}
.tabContents .tabCont.current {
  display: block;
}
.tabContents .tabCont.on {
  display: block;
}

/** Tab In Tab**/
.tabWrap.insideTab .tabList {
  margin: 0 0 12px 0;
  padding: 0 6px;
  background-color: #f7f7f7;
  box-sizing: border-box;
}
.tabWrap.insideTab .tabList li {
  height: 32px;
  margin: 0;
  padding: 0;
}
.tabWrap.insideTab .tabList li + li {
  padding-left: 1px;
}
.tabWrap.insideTab .tabList li + li::before {
  content: "";
  display: block;
  position: absolute;
  left: 0px;
  top: calc(50% - 6px);
  width: 1px;
  height: 12px;
  background-color: #999;
}
.tabWrap.insideTab .tabList li button,
.tabWrap.insideTab .tabList li a {
  min-width: inherit;
  padding: 0 10px;
  border: none;
  background-color: transparent;
  border-radius: inherit;
}
.tabWrap.insideTab .tabList li span {
  font-size: 14px;
}
.tabWrap.insideTab .tabList li.current a,
.tabWrap.insideTab .tabList li.current button {
  background-color: transparent;
  border: none;
}
.tabWrap.insideTab .tabList li.current span {
  color: #4380e0;
}

@media screen and (max-width: 768px) {
  /*** 탭영역  ***/
  /* .tabWrap .tabList {margin-right:-12px;} */
  .tabWrap .tabList {
    display: block;
    margin-right: -12px;
    flex-wrap: initial;
    flex-direction: initial;
    justify-content: initial;
  } /* 2021.02.23 곽현준 수정 */
  .tabWrap .tabList.pcCenter {
    justify-content: start;
  }
  /* .tabWrap .tabList li {height:30px; margin:0 12px 12px 0;} */
  .tabWrap .tabList li {
    display: inline-block;
    height: 30px;
    margin: 0 12px 12px 0;
  } /* 2021.02.23 곽현준 수정 */
  .tabWrap .tabList li button,
  .tabWrap .tabList li a {
    min-width: 80px;
  }
  .tabWrap .tabList li span {
    padding: 0 10px;
    font-size: 16px;
  }

  /** Tab In Tab**/
  .tabWrap.insideTab .tabList {
    margin: 0 0 12px 0;
    padding: 0 8px;
  }
  .tabWrap.insideTab .tabList li {
    height: 28px;
  }
  .tabWrap.insideTab .tabList li button,
  .tabWrap.insideTab .tabList li a {
    padding: 0 7px;
  }
  .tabWrap.insideTab .tabList li span {
    font-size: 16px;
  }
}

/*** 아코디언 ***/
.accordionWrap {
  display: block;
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
}
.accordionWrap .accUnit {
  display: block;
  position: relative;
  margin: 0;
  padding: 0;
  border-bottom: solid #ccc 1px;
}
.accUnit .accHead {
  display: block;
  position: relative;
  height: 50px;
  margin: 0;
  padding: 0;
}
.accHead > button {
  display: block;
  position: relative;
  width: 100%;
  height: 100%;
  margin: 0;
  padding: 0;
  text-align: left;
}
.accHead > button:focus {
  outline: solid transparent 1px;
}
.accHead > button:focus::after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
  background-color: #999;
}
.accHead .ico {
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  width: 50px;
  height: 50px;
  transform: rotate(0deg);
}
.accHead .ico::after {
  content: "";
  display: block;
  position: absolute;
  width: 24px;
  height: 4px;
  border-radius: 2px;
  background-color: #ccc;
}
.accHead .ico::before {
  content: "";
  display: block;
  position: absolute;
  width: 24px;
  height: 4px;
  border-radius: 2px;
  background-color: #ccc;
}
.accordionWrap.arrow .accHead .ico::before {
  transform: rotate(135deg);
  right: calc(50% - 5px);
  top: calc(50% - 2px);
}
.accordionWrap.arrow .accHead .ico::after {
  transform: rotate(45deg);
  left: calc(50% - 5px);
  top: calc(50% - 2px);
}
.accordionWrap.arrow .accUnit .accHead .ico {
  transform: rotate(180deg);
  transition: all 0.3s;
}
.accordionWrap.arrow .accUnit.current .accHead .ico {
  transform: rotate(0deg);
  transition: all 0.3s;
}
.accordionWrap .accBody {
  display: none;
  position: relative;
  width: 100%;
  height: 100px;
  margin: 0;
  padding: 0;
  border-top: solid #ccc 1px;
  background-color: #f5f9ff;
}

/* 확장영역 리스트 */
.expandListWrap .expandTitle .icoCross {
  position: absolute;
  top: 21px;
  right: 16px;
  overflow: hidden;
  width: 20px;
  height: 20px;
  margin: 0;
  padding: 0;
}
.expandListWrap .expandTitle .icoCross::before,
.expandListWrap .expandTitle .icoCross::after {
  position: absolute;
  margin: 0;
  padding: 0;
  background-color: #999;
  -webkit-transition: all 0.2s;
  -o-transition: all 0.2s;
  transition: all 0.2s;
  content: "";
}
.expandListWrap .expandTitle .icoCross::before {
  top: 50%;
  left: 0;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  width: 20px;
  height: 2px;
}
.expandListWrap .expandTitle .icoCross::after {
  top: 0;
  left: 50%;
  -webkit-transform: translateX(-50%);
  -ms-transform: translateX(-50%);
  transform: translateX(-50%);
  width: 2px;
  height: 20px;
}
.expandListWrap .expandTitle.is-expanded .icoCross::before {
  -webkit-transform: translateX(100%);
  -ms-transform: translateX(100%);
  transform: translateX(100%);
  opacity: 0;
}
.expandListWrap .expandTitle.is-expanded .icoCross::after {
  -webkit-transform: translate(-50%, 0) rotate(90deg);
  -ms-transform: translate(-50%, 0) rotate(90deg);
  transform: translate(-50%, 0) rotate(90deg);
}
.expandListWrap .expandContent.reset {
  display: none;
}

@media screen and (max-width: 768px) {
  .expandListWrap .expandTitle .icoCross {
    top: 12px;
    right: 12px;
    width: 16px;
    height: 16px;
  }
  .expandListWrap .expandTitle .icoCross::before {
    width: 16px;
    height: 2px;
  }
  .expandListWrap .expandTitle .icoCross::after {
    width: 2px;
    height: 16px;
  }
}

/*** flow step ***/
.flowStep {
  display: inline-block;
  position: relative;
  margin: 0;
  padding: 0;
}
.flowStep ol,
.flowStep ul {
  display: flex;
  position: relative;
  margin: 0;
  padding: 0;
}
.flowStep li {
  display: block;
  position: relative;
  margin: 0;
  padding: 0;
}
.flowStep li + li {
  margin-left: 30px;
}
.flowStep li span {
  display: inline-block;
  position: relative;
  margin: 0;
  padding: 0;
}
.flowStep li.current {
  margin: 0;
  padding: 0;
}
.flowStep p.findent {
  position: absolute;
}

/** 바 타입 **/
.flowStep.barType {
  display: block;
  position: relative;
  margin: 0;
  padding: 0;
  border-top: solid #003894 1px;
  background-color: #f5f9ff;
}
.flowStep.barType ol {
  display: flex;
  justify-content: space-around;
}
.flowStep.barType ol li {
  display: table;
  height: 52px;
}
.flowStep.barType ol li + li {
  margin-left: 0;
}
.flowStep.barType ol li span {
  display: table-cell;
  text-align: center;
  vertical-align: middle;
  color: #666;
}
.flowStep.barType ol li.current span {
  color: #003894;
  font-weight: 400;
}
.flowStep.barType ol li.current span::before {
  content: "";
  display: block;
  position: absolute;
  left: -20px;
  top: 0;
  width: calc(100% + 40px);
  height: 4px;
  background-color: #003894;
}
.flowStep.barType.icon ol li {
  position: relative;
}

/* 2021.03.08 곽현준 추가 - 화살표 삽입 */
.flowStep.barType.icon ol li:nth-child(1):after {
  content: "";
  position: absolute;
  top: 13px;
  left: 263px;
  width: 22px;
  height: 22px;
  background: url(/images/common/ico_progress.png) no-repeat 0 0;
  background-size: 22px;
}
.flowStep.barType.icon ol li:nth-child(2):after {
  content: "";
  position: absolute;
  top: 13px;
  left: 202px;
  width: 22px;
  height: 22px;
  background: url(/images/common/ico_progress.png) no-repeat 0 0;
  background-size: 22px;
}
.flowStep.barType.icon ol li:nth-child(3):after {
  content: "";
  position: absolute;
  top: 13px;
  left: 202px;
  width: 22px;
  height: 22px;
  background: url(/images/common/ico_progress.png) no-repeat 0 0;
  background-size: 22px;
}
@media screen and (max-width: 1000px) {
  .flowStep.barType.icon ol li:nth-child(1):after {
    content: "";
    position: absolute;
    top: 13px;
    left: 220px;
    width: 22px;
    height: 22px;
    background: url(/images/common/ico_progress.png) no-repeat 0 0;
    background-size: 22px;
  }
  .flowStep.barType.icon ol li:nth-child(2):after {
    content: "";
    position: absolute;
    top: 13px;
    left: 152px;
    width: 22px;
    height: 22px;
    background: url(/images/common/ico_progress.png) no-repeat 0 0;
    background-size: 22px;
  }
  .flowStep.barType.icon ol li:nth-child(3):after {
    content: "";
    position: absolute;
    top: 13px;
    left: 152px;
    width: 22px;
    height: 22px;
    background: url(/images/common/ico_progress.png) no-repeat 0 0;
    background-size: 22px;
  }
}
/* //2021.03.08 곽현준 추가 - 화살표 삽입 */

/** 탭 타입 **/
.flowStep.tabType ol {
  justify-content: flex-start;
}
.flowStep.tabType ol li {
  display: table;
  min-width: 90px;
  height: 40px;
  margin: 0 8px 0 0;
  padding: 0 16px;
  border: solid #999 1px;
  text-align: center;
  border-radius: 20px;
  box-sizing: border-box;
}
.flowStep.tabType ol li + li {
  margin-left: inherit;
}
.flowStep.tabType ol li span {
  display: table-cell;
  width: 100%;
  height: 100%;
  vertical-align: middle;
  color: #999;
  font-size: 16px;
}
.flowStep.tabType ol li.current {
  border-color: #4380e0;
  background-color: #4380e0;
}
.flowStep.tabType ol li.current span {
  color: #fff;
}

/*** input ***/
input[type="text"],
input[type="password"],
input[type="number"] {
  height: 40px;
  padding: 0 16px;
  border: solid #d0d0d0 1px;
  background-color: #fff;
  color: #222;
  font-size: 16px;
}
input[type="text"]::placeholder,
input[type="password"]::placeholder,
input[type="number"]::placeholder {
  color: #d0d0d0;
}
input[type="text"]:disabled,
input[type="password"]:disabled,
input[type="number"]:disabled {
  background-color: #ececec;
  color: #999;
}
input[type="password"] + p {
  display: inline-block;
}
input[readonly="readonly"],
select[disabled="disabled"],
input[disabled="disabled"] {
  background-color: #ececec;
  color: #999;
}
input[readonly="readonly"].borderNone {
  padding: 0;
  border-top: 1px solid transparent !important;
  border-right: 1px solid transparent !important;
  border-bottom: 1px solid transparent !important;
  border-left: 1px solid transparent !important;
  background-color: #fff;
  color: #666;
  outline: unset;
}
input.full {
  width: 100%;
}
input.dfsize {
  width: 100%;
  max-width: 390px;
}

.tdcell input[type="text"],
.tdcell input[type="password"],
.tdcell input[type="number"] {
  padding: 0 13px;
  width: 202px;
  border: solid #d0d0d0 1px;
  background-color: #fff;
  color: #222;
  font-size: 16px;
} /* 2021.01.28 곽현준 추가 - 조회 input 사이즈 */

.tdcell input.full {
  width: 100%;
} /* 2021.01.28 곽현준 추가 - 조회 input 사이즈 */
.tdcell input.dfsize {
  width: 202px;
  max-width: 390px;
} /* 2021.01.28 곽현준 추가 - 조회 input 사이즈 */

.inputWrap {
  display: inline-block;
  position: relative;
  margin: 0;
  padding: 0;
}
.inputWrap input {
  display: block;
  position: relative;
  box-sizing: border-box;
}
.inputWrap.initDel input,
.inputWrap.error input,
.inputWrap.verify input {
  padding-right: 50px;
}
.inputWrap.initDel .clearValue {
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  width: 40px;
  height: 40px;
}
.inputWrap.initDel .clearValue span {
  position: absolute;
  font-size: 1px;
  color: transparent;
  text-indent: -9999px;
}
.inputWrap.initDel .clearValue::before {
  content: "";
  display: block;
  position: absolute;
  right: 16px;
  top: 10px;
  width: 20px;
  height: 20px;
  background: url(/images/common/ico_inputwrap.png) no-repeat 0 0;
  background-size: 100%;
}
.inputWrap.verify::after {
  content: "";
  display: block;
  position: absolute;
  right: 16px;
  top: 10px;
  width: 20px;
  height: 20px;
  background: url(/images/common/ico_inputwrap.png) no-repeat 0 -50px;
  background-size: 100%;
}
.inputWrap.error::after {
  content: "";
  display: block;
  position: absolute;
  right: 16px;
  top: 10px;
  width: 20px;
  height: 20px;
  background: url(/images/common/ico_inputwrap.png) no-repeat 0 -98px;
  background-size: 100%;
}
.inputWrap.error input {
  border-color: #e60020;
}
.inputWrap.error .errorMsg {
  display: inline-block;
  position: absolute;
  left: 0;
  bottom: -20px;
  font-size: 14px;
  color: #e60020;
  z-index: 2;
}
.inputWrap .clearValue,
.inputWrap .errorMsg {
  display: none;
}

@media screen and (max-width: 768px) {
  input[type="text"],
  input[type="password"],
  input[type="number"] {
    width: 100%;
    height: 30px;
    padding: 0 12px;
  }

  .tdcell input[type="text"],
  .tdcell input[type="password"],
  .tdcell input[type="number"],
  input.dfsize {
    width: 100%;
  } /* 2021.01.28 곽현준 추가 - 조회 input 사이즈 */

  .inputWrap.initDel input,
  .inputWrap.error input,
  .inputWrap.verify input {
    padding-right: 42px;
  }
  .inputWrap.initDel .clearValue {
    height: 30px;
  }
  .inputWrap.initDel .clearValue::before {
    top: 5px;
    right: 12px;
  }
  .inputWrap.verify::after {
    top: 5px;
    right: 12px;
  }
  .inputWrap.error::after {
    top: 5px;
    right: 12px;
  }
  input.dfsize {
    width: 100%;
    max-width: 100%;
  }
}

/** radioSet **/
.radioSet {
  display: inline-flex;
  position: relative;
  margin: 0;
  padding: 0;
  flex-direction: row;
  justify-content: start;
  align-items: baseline;
}
.radioSet label {
  display: inline-block;
  position: relative;
  margin: 0;
  padding: 0 0 0 30px;
  line-height: 20px;
  font-size: 16px;
}
.radioSet label + label {
  margin-left: 50px;
}
.radioSet label input[type="radio"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  display: block;
  position: absolute;
  left: 5px;
  top: 50%;
  width: 1px;
  height: 1px;
  background-color: transparent;
  z-index: 0;
}
.radioSet label input[type="radio"] + span {
  display: inline-block;
}
.radioSet label input[type="radio"] + span::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: calc(50% - 10px);
  width: 20px;
  height: 20px;
  border: solid #999 1px;
  border-radius: 10px;
  background-color: #fff;
}
.radioSet label input[type="radio"] + span::after {
  content: "";
}
.radioSet label input[type="radio"]:checked + span::before {
  border-color: #4380e0;
}
.radioSet label input[type="radio"]:checked + span::after {
  content: "";
  display: block;
  position: absolute;
  left: 4px;
  top: calc(50% - 6px);
  width: 12px;
  height: 12px;
  background-color: #4380e0;
  border-radius: 7px;
}
.radioSet label input[type="radio"]:disabled + span::before {
  background-color: #ececec;
  border-color: #d1d1d1;
}
.radioSet label input[type="radio"]:disabled:checked + span::after {
  content: "";
  background-color: #999;
}
.radioSet label input[type="radio"]:foucs + span::before {
  border: dotted #333 1px;
}
/** pre 추가 이태호21-02-08 **/
.radioSet label input[type="radio"] + pre {
  display: inline-block;
  font-weight: bold;
}
.radioSet label input[type="radio"] + pre::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: calc(50% - 10px);
  width: 20px;
  height: 20px;
  border: solid #999 1px;
  border-radius: 10px;
  background-color: #fff;
}
.radioSet label input[type="radio"] + pre::after {
  content: "";
}
.radioSet label input[type="radio"]:checked + pre::before {
  border-color: #4380e0;
}
.radioSet label input[type="radio"]:checked + pre::after {
  content: "";
  display: block;
  position: absolute;
  left: 4px;
  top: calc(50% - 6px);
  width: 12px;
  height: 12px;
  background-color: #4380e0;
  border-radius: 7px;
}
.radioSet label input[type="radio"]:disabled + pre::before {
  background-color: #ececec;
  border-color: #d1d1d1;
}
.radioSet label input[type="radio"]:disabled:checked + pre::after {
  content: "";
  background-color: #999;
}
.radioSet label input[type="radio"]:foucs + pre::before {
  border: dotted #333 1px;
}

.radioSet.column {
  flex-direction: column;
}
.radioSet.column label + label {
  margin-left: 0;
  margin-top: 10px;
}

.radioSet.multiline {
  display: block;
}
.radioSet.multiline + .radioSet.multiline {
  margin-top: 12px;
}
.radioSet.multiline label {
  width: 20%;
}

@media screen and (max-width: 768px) {
  .radioSet.mColumn {
    flex-direction: column;
  }
  .radioSet.mColumn label + label {
    margin-left: 0;
    margin-top: 10px;
  }
}

/** radioSet : button type **/
.radioSet.btnType {
  display: inline-flex;
  position: relative;
  margin: 0;
  padding: 0;
  flex-direction: column;
  justify-content: start;
  align-items: baseline;
  width: 100%;
}
.radioSet.btnType label {
  display: inline-block;
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
  line-height: 44px;
  font-size: 16px;
}
.radioSet.btnType label + label {
  margin: 10px 0 0 0;
}
.radioSet.btnType label input[type="radio"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 1px;
  height: 1px;
  background-color: transparent;
  z-index: 0;
  opacity: 0;
}
.radioSet.btnType label input[type="radio"] + span {
  display: inline-block;
  width: 100%;
  padding: 0 10px;
  height: 44px;
  line-height: 40px;
  text-align: center;
}
.radioSet.btnType label input[type="radio"] + span::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 44px;
  border: solid #ccc 1px;
  border-radius: 0;
  background-color: transparent;
}
.radioSet.btnType label input[type="radio"] + span::after {
  content: "";
}
.radioSet.btnType label input[type="radio"]:checked + span::before {
  border-color: #4380e0;
}
.radioSet.btnType label input[type="radio"]:checked + span::after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 44px;
  background-color: #4380e0;
  border-radius: 0;
  z-index: -1;
}
.radioSet.btnType label input[type="radio"]:checked + span {
  color: #fff;
}
.radioSet.btnType label input[type="radio"]:disabled + span::before {
  background-color: #ececec;
  border-color: #d1d1d1;
}
.radioSet.btnType label input[type="radio"]:disabled:checked + span::after {
  content: "";
  background-color: #999;
}
.radioSet.btnType label input[type="radio"]:foucs + span::before {
  border: dotted #333 1px;
}

.radioSet.btnType.harf {
  flex-direction: row;
  flex-wrap: wrap;
  margin: -10px 0 0 0;
}
.radioSet.btnType.harf label {
  max-width: calc(50% - 10px);
  flex: 1 1 auto;
  margin: 10px 10px 0 0;
}
.radioSet.btnType.harf label:nth-child(even) {
  margin: 0;
}

.checkboxSet.btnType {
  display: inline-flex;
  position: relative;
  margin: 0;
  padding: 0;
  flex-direction: column;
  justify-content: start;
  align-items: baseline;
  width: 100%;
}
.checkboxSet.btnType label {
  display: inline-block;
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
  line-height: 44px;
  font-size: 16px;
}
.checkboxSet.btnType label + label {
  margin: 10px 0 0 0;
}
.checkboxSet.btnType label input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 1px;
  height: 1px;
  background-color: transparent;
  z-index: 0;
  opacity: 0;
}
.checkboxSet.btnType label input[type="checkbox"] + span {
  display: inline-block;
  width: 100%;
  padding: 0 10px;
  height: 44px;
  line-height: 40px;
  text-align: center;
}
.checkboxSet.btnType label input[type="checkbox"] + span::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 44px;
  border: solid #ccc 1px;
  border-radius: 0;
  background-color: transparent;
}
.checkboxSet.btnType label input[type="checkbox"] + span::after {
  content: "";
}
.checkboxSet.btnType label input[type="checkbox"]:checked + span::before {
  border-color: #4380e0;
}
.checkboxSet.btnType label input[type="checkbox"]:checked + span::after {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: 0;
  width: 100%;
  height: 44px;
  background-color: #4380e0;
  border-radius: 0;
  z-index: -1;
  transform: rotate(0deg) !important;
}
.checkboxSet.btnType label input[type="checkbox"]:checked + span {
  color: #fff;
}
.checkboxSet.btnType label input[type="checkbox"]:disabled + span::before {
  background-color: #ececec;
  border-color: #d1d1d1;
}
.checkboxSet.btnType
  label
  input[type="checkbox"]:disabled:checked
  + span::after {
  content: "";
  background-color: #999;
}
.checkboxSet.btnType label input[type="checkbox"]:foucs + span::before {
  border: dotted #333 1px;
}

.checkboxSet.btnType.harf {
  flex-direction: row;
  flex-wrap: wrap;
  margin: -10px 0 0 0;
}
.checkboxSet.btnType.harf label {
  max-width: calc(50% - 10px);
  flex: 1 1 auto;
  margin: 10px 10px 0 0;
}
.checkboxSet.btnType.harf label:nth-child(even) {
  margin: 0;
}

/** checkboxSet **/
.checkboxSet {
  display: inline-flex;
  position: relative;
  margin: 0;
  padding: 0;
  flex-direction: row;
  justify-content: start;
  align-items: center;
}
.checkboxSet label {
  display: inline-block;
  position: relative;
  margin: 0;
  padding: 0 0 0 30px;
  line-height: 20px;
  font-size: 16px;
}
.checkboxSet label + label {
  margin-left: 50px;
}
.checkboxSet label input[type="checkbox"] + span {
  display: inline-block;
}
.checkboxSet label input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  display: block;
  position: absolute;
  left: 5px;
  top: 5px;
  width: 1px;
  height: 1px;
  background-color: transparent;
  z-index: 0;
}
.checkboxSet label input[type="checkbox"] + span::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: calc(50% - 10px);
  width: 20px;
  height: 20px;
  border: solid #999 1px;
  border-radius: 3px;
  background-color: #fff;
}
.checkboxSet label input[type="checkbox"] + span::after {
  content: "";
}
.checkboxSet label input[type="checkbox"]:checked + span::before {
  border-color: #4380e0;
}
.checkboxSet label input[type="checkbox"]:checked + span::after {
  content: "";
  display: block;
  position: absolute;
  left: 4px;
  top: calc(50% - 6px);
  width: 12px;
  height: 8px;
  border-bottom: solid #4380e0 2px;
  border-left: solid #4380e0 2px;
  transform: rotate(-45deg);
}
.checkboxSet label input[type="checkbox"]:disabled + span::before {
  background-color: #ececec;
  border-color: #d1d1d1;
}
.checkboxSet label input[type="checkbox"]:disabled:checked + span::after {
  border-bottom-color: #999;
  border-left-color: #999;
}
.checkboxSet.pdFixed {
  padding-left: 10px;
}
.checkboxSet.flexwrap {
  width: 100%;
  flex-wrap: wrap;
}
.checkboxSet.fixSize15to50 label {
  width: 15%;
  margin: 5px 0;
}

label.checkSingle {
  display: inline-block;
  position: relative;
  margin: 0;
  padding: 0 0 0 30px;
  line-height: 20px;
  font-size: 16px;
}
label.checkSingle input[type="checkbox"] {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;
  display: block;
  position: absolute;
  left: 5px;
  top: 14px;
  width: 1px;
  height: 1px;
  background-color: transparent;
  z-index: 0;
}
label.checkSingle input[type="checkbox"] + span {
  display: inline-block;
}
label.checkSingle input[type="checkbox"] + span::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  top: calc(50% - 10px);
  width: 20px;
  height: 20px;
  border: solid #999 1px;
  border-radius: 3px;
  background-color: #fff;
}
label.checkSingle input[type="checkbox"] + span::after {
  content: "";
}
label.checkSingle input[type="checkbox"]:checked + span::before {
  border-color: #4380e0;
}
label.checkSingle input[type="checkbox"]:checked + span::after {
  content: "";
  display: block;
  position: absolute;
  left: 4px;
  top: calc(50% - 6px);
  width: 12px;
  height: 8px;
  border-bottom: solid #4380e0 2px;
  border-left: solid #4380e0 2px;
  transform: rotate(-45deg);
}
label.checkSingle input[type="checkbox"]:disabled + span::before {
  background-color: #ececec;
  border-color: #d1d1d1;
}
label.checkSingle input[type="checkbox"]:disabled:checked + span::after {
  border-bottom-color: #999;
  border-left-color: #999;
}
label.checkSingle input[type="checkbox"] + span.findent {
  position: absolute;
}

/* label 없는 checkbox */
.checkSelf {
  display: block;
  position: relative;
  margin: 0;
  padding: 0;
  width: 20px;
  height: 20px;
  border: solid #999 1px;
  border-radius: 3px;
  background-color: #fff;
}
.checkSelf input[type="checkbox"] {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  z-index: 10;
  width: 20px;
  height: 20px;
  opacity: 0;
}
.checkSelf input[type="checkbox"]:checked + .check {
  display: inline-block;
  position: absolute;
  top: -1px;
  left: -1px;
  width: 20px;
  height: 20px;
  margin: 0;
  padding: 0;
  border: 1px solid #4380e0;
  border-radius: 3px;
  background-color: transparent;
}
.checkSelf input[type="checkbox"]:checked + .check::after {
  content: "";
  display: block;
  position: absolute;
  left: 3px;
  top: calc(50% - 6px);
  width: 12px;
  height: 8px;
  border-bottom: solid #4380e0 2px;
  border-left: solid #4380e0 2px;
  -webkit-transform: rotate(-45deg);
  -ms-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

@media screen and (max-width: 768px) {
  /* .radioSet {padding:0 12px;} */ /* 1228 */
  .radioSet label + label {
    margin-left: 50px;
  }
  .checkboxSet {
    padding: 0 12px;
  }
  .checkboxSet label + label {
    margin-left: 30px;
  }
  label.checkSingle {
    padding: 0 0 0 30px;
  }
  .checkboxSet.pdFixed {
    padding: 12px 0 0 0;
  }

  label.checkSingle input[type="checkbox"] + span::before {
    top: 0;
  }
  label.checkSingle input[type="checkbox"]:checked + span::after {
    top: 4px;
  }

  .checkboxSet.fixSize15to50 label {
    width: 50%;
  }
}

select {
  display: inline-block;
  position: relative;
  height: 40px;
  margin: 0;
  padding: 0 40px 0 16px;
  font-size: 16px;
  color: #222;
  border: solid #d0d0d0 1px;
  background-color: #fff;
  background: url(/images/common/ico_tws_select.png) no-repeat right 9px #fff;
  -moz-appearance: none;
  -webkit-appearance: none;
  appearance: none;
}
.tdcell select {
  width: 202px;
} /* 2021.01.28 곽현준 추가 - 조회 select 사이즈 */
select::-ms-expand {
  display: none;
}
select.full {
  width: 100%;
}
/* select.dfsize {width:100%; max-width:390px;} */
select.dfsize {
  width: 202px;
  max-width: 390px;
} /* 2021.01.28 곽현준  수정 - 조회 select 사이즈 */

.disabled select,
.disabled input {
  background-color: #ececec;
  border-color: #d1d1d1;
  pointer-events: none;
}

/** dateSetting **/
.dateSetting {
  display: inline-flex;
  position: relative;
  margin: 0;
  padding: 0;
}
.dateSetting.full {
  width: 100%;
}
.dateSetting .datePC {
  display: flex;
  position: relative;
  margin: 0;
  padding: 0;
}
.dateSetting .datePC.full {
  width: 100%;
}
.dateSetting .dateMobile {
  display: none;
}
.dateSetting .datePic {
  display: flex;
  position: relative;
  margin: 0;
  padding: 0;
}
/* .dateSetting .datePic input[type="text"] {display:block; position:relative; height:38px; width:120px; padding-right:40px; box-sizing:content-box;} */

/* 2021.01.28 곽현준  추가 - 조회 달력 input 사이즈 */
.dateSetting .datePic input[type="text"] {
  display: block;
  position: relative;
  height: 38px;
  width: 147px;
  padding-right: 40px;
  box-sizing: content-box;
}

.dateSetting .datePic input[type="text"]:read-only {
  background-color: #fff;
  color: #222;
}
.dateSetting .datePic input[type="text"]:disabled,
.dateSetting .datePic input[type="text"]:read-only:disabled {
  background-color: #ececec;
  color: #999;
}

.dateSetting .datePic input[type="text"]:disabled + .ui-datepicker-trigger {
  display: none;
} /* 2021.02.08 곽현준  추가 - disable일때 달력 호출 막음 */
/* .dateSetting .datePic input[type="text"]:disabled:after {
	content:'';
	position:absoute;
	right:16px;
	top:calc(50% - 10px);
	width:20px;
	hegith:20px;
	backgorund:url('/images/common/ico_tws_datepic.png') 0 0 no-repeat;
} */

.dateSetting .datePic .btnDatepicker {
  display: block;
  position: absolute;
  right: 0;
  top: 0;
  width: 40px;
  height: 40px;
}
.dateSetting .datePic .btnDatepicker span {
  position: absolute;
  font-size: 1px;
  color: transparent;
  text-indent: -9999px;
}
.dateSetting .datePic .btnDatepicker::before {
  content: "";
  display: block;
  position: absolute;
  right: 16px;
  top: calc(50% - 10px);
  width: 20px;
  height: 20px;
  background: url(/images/common/ico_tws_datepic.png) no-repeat 50%;
  background-size: 100%;
}
.dateSetting span.bar {
  display: inline-block;
  position: relative;
  margin: 0;
  padding: 0 12px;
  line-height: 40px;
  color: #999;
}
.dateSetting.full .datePic {
  width: 100%;
}
.dateSetting.full .datePic .inputDatepicker {
  width: 100%;
}
.dateSetting.full .KdatePic input[type="text"] {
  padding: 0;
}
.dateSetting .ui-datepicker-trigger {
  display: inline-block;
  position: absolute;
  right: 16px;
  top: calc(50% - 10px);
  width: 20px;
  height: 20px;
  cursor: pointer;
}

@media screen and (max-width: 768px) {
  select {
    height: 30px;
    padding: 0 30px 0 12px;
    background: #fff url(/images/common/ico_tws_selectM.png) no-repeat right 3px;
  }
  .thcell select {
    width: calc(100% + 24px);
    margin-left: -12px;
  }
  .tdcell select {
    width: 100%;
  } /* 2021.01.28 곽현준  추가 - 조회 select 사이즈 */
  .tdcell select.mfull {
    width: 100%;
  }
  select.dfsize {
    width: 100%;
    max-width: 100%;
  } /* 2021.01.28 곽현준  수정 - 조회 select 사이즈 */

  /* 2021.01.28 곽현준  추가 - 조회 달력 input 사이즈 */
  .dateSetting .datePic input[type="text"] {
    display: block;
    position: relative;
    height: 38px;
    width: 100%;
    padding-right: 40px;
    box-sizing: content-box;
  }
}

.textareaWrap {
  display: block;
  position: relative;
  margin: 0;
  padding: 0;
}
.textareaWrap.borderTop textarea {
  border-top-color: #003894;
}
.textareaWrap .textarea {
  font-size: 1.6rem;
}
textarea {
  display: inline-block;
  position: relative;
  margin: 0;
  padding: 0;
}
textarea.textarea {
  display: inline-block;
  position: relative;
  width: 100%;
  height: 120px;
  margin: 0;
  padding: 12px 16px;
  border: solid #d0d0d0 1px;
  background-color: #fff;
  color: #222;
}
textarea.textarea::placeholder {
  color: #999;
} /*201229 박진우 수정/ color #d0d0d0 -> #999*/
textarea.textarea.thin {
  height: 80px;
}
textarea.textarea.small {
  height: 120px;
}
textarea.textarea.middle {
  height: 260px;
}
textarea.textarea.editer {
  height: 400px;
}

@media screen and (max-width: 768px) {
  textarea.textarea {
    padding: 12px;
    height: 60px;
  }
  textarea.textarea.thin {
    height: 40px;
  }
  textarea.textarea.middle {
    height: 130px;
  }
  textarea.textarea.editer {
    height: 200px;
  }
}

.ui-datepicker {
  display: none;
  position: absolute;
  width: 333px;
  height: 372px;
  margin: 0;
  padding: 0;
  background-color: #fff;
  border: solid #d0d0d0 1px;
  z-index: 3 !important;
  box-sizing: border-box;
} /* 2021.01.08 곽현준 수정 - 레이어 우선 설정 */
.ui-datepicker .ui-datepicker-header {
  display: block;
  position: relative;
  width: 100%;
  height: 64px;
  margin: 0;
  padding: 12px 46px;
  background-color: #4380e0;
  box-sizing: border-box;
}
.ui-datepicker-header .ui-corner-all span {
  position: absolute;
  font-size: 1px;
  color: transparent;
  text-indent: -9999px;
}
.ui-datepicker-header .ui-datepicker-prev {
  display: block;
  position: absolute;
  left: 6px;
  top: 12px;
  width: 40px;
  height: 40px;
  background: url(/images/common/ico_datepic_prev.png) no-repeat 50%;
  background-size: 20px;
}
.ui-datepicker-header .ui-datepicker-next {
  display: block;
  position: absolute;
  right: 6px;
  top: 12px;
  width: 40px;
  height: 40px;
  background: url(/images/common/ico_datepic_prev.png) no-repeat 50%;
  background-size: 20px;
  transform: rotate(180deg);
}
.ui-datepicker-header .ui-datepicker-title {
  display: flex;
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
  flex-direction: row;
  justify-content: space-between;
}
.ui-datepicker-title .ui-datepicker-year {
  width: 50%;
  margin-right: 4px;
}
.ui-datepicker-title .ui-datepicker-month {
  width: 50%;
  margin: 0;
}
.datepicker01.reserve + .ui-datepicker {
  z-index: 1 !important;
}

.ui-datepicker .ui-datepicker-calendar {
  position: relative;
  width: calc(100% - 20px);
  margin: 10px;
  padding: 0;
  font-size: 16px;
}
.ui-datepicker-calendar thead th,
.ui-datepicker-calendar tbody td {
  height: 40px;
  width: 40px;
  margin: 0;
  padding: 0 2px;
  text-align: center;
}
.ui-datepicker-calendar thead th span {
  font-weight: 700;
}
.ui-datepicker-calendar .ui-datepicker-week-end:first-child,
.ui-datepicker-calendar .ui-datepicker-week-end:first-child a {
  color: #e60020;
}
.ui-datepicker-calendar a {
  display: inline-block;
  position: relative;
  width: 100%;
  height: 100%;
  line-height: 40px;
  z-index: 10;
}
.ui-datepicker-calendar .ui-datepicker-week-end:last-child a {
  color: #222;
}
.ui-datepicker-calendar .ui-state-highlight,
.ui-datepicker-calendar .ui-state-active {
  color: #fff !important;
  z-index: 10;
  font-weight: 700;
}
.ui-datepicker-calendar .ui-state-highlight::before {
  content: "";
  display: block;
  position: absolute;
  left: calc(50% - 20px);
  top: calc(50% - 20px);
  width: 40px;
  height: 40px;
  background-color: #4380e0;
  border-radius: 20px;
  z-index: -1;
  opacity: 0.5;
}
.ui-datepicker-calendar .ui-state-active::before {
  content: "";
  display: block;
  position: absolute;
  left: calc(50% - 20px);
  top: calc(50% - 20px);
  width: 40px;
  height: 40px;
  background-color: #4380e0;
  border-radius: 20px;
  z-index: -1;
  opacity: 1;
}
.ui-datepicker .ui-datepicker-buttonpane {
  display: block;
  position: absolute;
  right: 0;
  bottom: 20px;
  height: 32px;
  margin: 0;
  padding: 0;
}
.ui-datepicker-buttonpane .ui-datepicker-current {
  display: none;
}
.ui-datepicker-buttonpane .ui-datepicker-close {
  display: inline-block;
  position: absolute;
  right: 20px;
  top: 0;
  width: 60px;
  height: 32px;
  border: solid #999 1px;
  border-radius: 16px;
  font-size: 16px;
  color: #999;
  background-color: #fff;
}

/** timeSetting **/
.timeSetting {
  display: inline-flex;
  position: relative;
  margin: 0;
  padding: 0;
  flex-direction: row;
}
.timeSetting .hour,
.timeSetting .minute {
  display: flex;
  position: relative;
  margin: 0;
  padding: 0;
  flex-direction: row-reverse;
}
.timeSetting .minute {
  margin-left: 10px;
}
.timeSetting select {
  width: 120px;
}
.timeSetting label {
  display: none;
  line-height: 40px;
  margin-left: 8px;
}
.dateSetting + .timeSetting {
  margin-left: 8px;
}

/* scrollTable 가로 */
.scrollTable {
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 4px !important;
}
.fixScrollTable {
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 4px !important;
}

/* scroll bar 노출  */
/* ::-webkit-scrollbar {width:6px; height:8px;} */ /* 2021.01.25 곽현준 수정 - 스크롤바 기본형태로 복원 */
::-webkit-scrollbar-thumb {
  height: 8px;
  background-color: #d0d0d0;
  border-radius: 4px;
}

/** 버튼셋 **/
.btnWrap {
  display: flex;
  position: relative;
  margin: 0;
  padding: 0;
  flex-direction: row;
  justify-content: start;
}
.btnWrap.flexend {
  justify-content: flex-end;
}
.btnWrap.flexend.rank {
  justify-content: flex-end;
  top: 0;
} /* 2021.01.19 곽현준 추가 */
@media screen and (max-width: 768px) {
  .btnWrap.flexend.rank {
    position: relative;
    top: initial;
    bottom: 15px;
    right: 0px;
  }
} /* 2021.01.19 곽현준 추가 */

.btnWrap.alignend {
  align-items: flex-end;
}
.btnWrap.alignend button {
  margin-right: 10px;
}
.btnWrap .txt {
  display: inline-block;
  position: relative;
  margin: 0;
  padding: 5px 0;
}
.btnWrap .txt span {
  display: inline-block;
  position: relative;
  margin: 0;
  padding: 0 10px 0 0;
  line-height: 20px;
  word-break: keep-all;
}
.btnWrap.between {
  justify-content: space-between;
  align-items: center;
}
.btnWrap.center {
  justify-content: center;
}
.btnWrap.center .btn + .btn {
  margin-left: 20px;
}
.btnWrap.center button {
  height: 47px;
  margin: 0 10px;
}

.btnWrap .summary {
  margin-right: 20px;
  line-height: 40px;
}
.btnWrap .summary .total {
  color: #003894;
}
.btn {
  position: relative;
  min-width: 62px;
  height: 40px;
  line-height: 1;
  margin: 0;
  padding: 0;
  font-size: 16px;
  border-radius: 20px;
  text-align: center;
  box-sizing: border-box;
}
.btn span {
  padding: 0 15px;
}
.btn + .btn {
  margin-left: 8px;
}
a.btn,
p.btn {
  display: inline-table;
}
a.btn span,
p.btn span {
  display: table-cell;
  position: relative;
  width: 100%;
  height: 100%;
  vertical-align: middle;
}
button.btn,
button.btn span,
.commentBtn {
  display: inline-block;
}
.selectBtnBox .btnWrap {
  display: inline-block;
}

/* 상세 팝업 오픈 버튼 */
.detailPopOpen {
  display: block;
  position: relative;
  width: 30px;
  height: 30px;
  margin: 0;
  padding: 0;
  background: url("../images/contents/ico_popup.png") no-repeat center center /
    15px 15px;
}
.detailBtnWrap .detailPopOpen {
  display: inline-block;
  vertical-align: middle;
}

.detailPop .blueBox {
  display: block;
  position: relative;
  width: 100%;
  margin: 0;
  padding: 17px 24px;
  background-color: #f5f9ff;
}

@media screen and (max-width: 768px) {
  .detailBtnWrap {
    display: flex !important;
    flex-wrap: nowrap;
    justify-content: space-between;
  }
  .detailBtnWrap .detailPopOpen {
    margin-left: 1rem;
  }
}

/* 모바일 버튼 줄바꿈 및 간격 */
.btnWrap.wrap {
  flex-wrap: wrap;
}

@media screen and (max-width: 768px) {
  .btnWrap {
    font-size: 1.6rem;
  }
  .btnWrap.alignend {
    align-items: flex-start;
  }
  .btnWrap.alignend button {
    margin-right: 0;
    margin-bottom: 10px;
  }
  .btnWrap.mfull {
    width: 100%;
  }
  .btnWrap.mfull .btn {
    width: 100%;
  }
  .btnWrap.mfull .btn span {
    letter-spacing: -1px;
  }

  /* 모바일 버튼 줄바꿈 및 간격 */
  .btnWrap.wrap {
    margin-top: 25px !important;
  }
  .btnWrap.wrap .btn {
    padding: 0;
    margin-top: 15px;
  }
}

.btn.btnSmall {
  height: 32px;
}
.btn.btnSmall span {
  padding: 0 12px;
}
.btn.btnMicro {
  height: 22px;
  padding: 0 10px;
}
.btn.btnLine {
  height: 22px;
  width: inherit;
  min-width: inherit;
  padding: 0;
  border-radius: 0;
}
.btn.btnLine::before {
  content: "";
  display: block;
  position: absolute;
  left: 0;
  bottom: 0;
  width: 100%;
  height: 1px;
}

.btn.btnWide {
  min-width: 200px;
}

.btn.lightblue {
  background-color: #003894;
  color: #fff;
}
/* .btn.lightblue {margin-top:22px; width:100px; height:44px; background-color:#003894; color:#fff; border-radius:3px;} */ /* 2021.01.06 곽현준 수정 */
/* .btn.lightblue {margin-top:22px; min-width:100px; height:44px; background-color:#003894; color:#fff; border-radius:3px;} */ /* 2021.01.14 곽현준 수정 */
/*.btn.lightblue {margin-top:22px; min-width:100px; height:44px; background-color:#003894; color:#fff; border-radius:3px; outline:none;} */ /* 2021.01.18 곽현준 수정 */
.btn.lightblue.search {
  margin-top: 0px !important;
  min-width: 100px;
  height: 40px;
  background-color: #003894;
  color: #fff;
  border-radius: 3px;
  outline: none;
} /* 2021.01.18 곽현준 수정 */

/* 2021.03.08 곽현준 추가 - 그린버튼 추가 */
.btn.darkgreen {
  background-color: #166b2a;
  color: #fff;
}

/*.btn.lightblue:hover {background-color:#535353;} */ /* 2021.01.18 곽현준 추가 */
.btn.lightblue.search:hover {
  background-color: #535353;
} /* 2021.01.18 곽현준 추가 */
.btn.darkgreen:hover {
  background-color: #535353;
} /* 2021.03.08 곽현준 추가 - 그린버튼 추가 */

.btn.lightblue.clearValue {
  padding-right: 34px;
}
.btn.lightblue.clearValue:after {
  content: "";
  display: block;
  position: absolute;
  top: calc(50% - 10px);
  right: 16px;
  width: 20px;
  height: 20px;
  margin-left: 10px;
  background: url(/images/common/ico_close.png) no-repeat 0 50%;
  background-size: 100%;
}
.btn.darkgray {
  background-color: #999;
  color: #fff;
}
.btn.red {
  background-color: #e60020;
  color: #fff;
}
.btn.red2 {
  background-color: #e60020;
  color: #fff;
}
.btn.btnLine.lightblue {
  color: #4380e0;
  background-color: transparent;
}
.btn.btnLine.lightblue::before {
  background-color: #4380e0;
}
.btn.btnLine.red {
  color: #e60020;
  background-color: transparent;
}
.btn.btnLine.red::before {
  background-color: #e60020;
}
.btn.btnLine.darkgray {
  color: #999;
  background-color: transparent;
}
.btn.btnLine.darkgray::before {
  background-color: #999;
}

.line.white {
  border: solid #fff 1px;
  color: #fff;
}
/* .line.lightblue {border:solid #4380e0 1px; color:#4380e0; background-color:#FFF;} */
.line.lightblue {
  margin-top: 22px;
  min-width: 100px;
  height: 44px;
  background-color: #003894;
  color: #fff;
  border-radius: 3px;
  outline: none;
} /* 2021.01.18 곽현준 수정 */
.line.lightblue:hover {
  background-color: #535353;
} /* 2021.01.18 곽현준 추가 */

/* .line.darkgray {border:solid #999 1px; color:#666; background-color:#FFF;} */ /*201229 박진우/ color #999 -> #666 변경*/
.line.darkgray {
  margin-top: 22px;
  min-width: 100px;
  height: 44px;
  border: solid #4380e0 1px;
  color: #4380e0;
  background-color: #fff;
  border-radius: 3px;
} /* 2021.01.18 곽현준 수정 */
.line.darkgray:hover {
  color: #535353;
  border: 1px solid #535353;
} /* 2021.01.18 곽현준 추가 */

.inputWrap.unit + .line.darkgray {
  margin-top: 0;
  height: 40px;
}

@media screen and (max-width: 768px) {
  .inputWrap.unit + .line.darkgray {
    margin-top: 0;
    height: 30px;
  }
} /* 2021.01.18 곽현준 추가 */

.line.darkgray.btn_list {
  margin-top: 22px;
  padding-left: 30px;
  min-width: 100px;
  height: 44px;
  border: solid #4380e0 1px;
  color: #4380e0;
  background-color: #fff;
  background: #fff url(/images/btn/bg_btn_list.png) 15px center no-repeat;
  border-radius: 3px;
} /* 2021.01.18 곽현준 추가 */
.line.darkgray.btn_list:hover {
  color: #535353;
  border: 1px solid #535353;
  background: #fff url(/images/btn/bg_btn_list_hover.png) 15px center no-repeat;
} /* 2021.01.18 곽현준 추가 */

/* 버튼 비활성 */
.btn:disabled {
  border: solid #999 1px !important;
  color: #999 !important;
  background-color: #fff !important;
  cursor: default !important;
}
a.btn.disabled {
  border: solid #999 1px !important;
  color: #999 !important;
  background-color: #fff !important;
  cursor: default !important;
  pointer-events: none !important;
}

/* .search.darkgray, .reset.darkgray, .file.darkgray {border:solid #999 1px; color:#999; background-color:#FFF; padding-right:25px;} */
.search.darkgray,
.reset.darkgray,
.file.darkgray {
  height: 40px;
  color: #fff;
  background-color: #535353;
  border-radius: 3px;
  padding-left: 22px;
} /* 2021.01.06 곽현준 수정 */
.search.darkgray:hover,
.reset.darkgray:hover,
.file.darkgray:hover {
  background-color: #4380e0;
} /* 2021.01.06 곽현준 추가 */

.file.darkgray {
  padding-left: 30px;
  min-width: 100px;
  /* height:44px; */
  height: 38px !important;
  line-height: 38px !important; /* input과 높이 통일 */
  border: solid #4380e0 1px;
  color: #4380e0;
  background-color: #fff;
  background: #fff url(/images/btn/bg_btn_file.png) 15px center no-repeat;
  border-radius: 3px;
} /* 2021.01.18 곽현준 추가 */
.file.darkgray:hover {
  color: #535353;
  border: 1px solid #535353;
  background: #fff url(/images/btn/bg_btn_file_hover.png) 15px center no-repeat;
} /* 2021.01.18 곽현준 추가 */

/* .search.darkgray::after {content:''; display:block; position:absolute; right:16px; top:calc(50% - 10px); width:17px; height:20px; background:url(/images/common/ico_tws_search.png) no-repeat 50%; background-size:100%;} */

/* 2021.01.18 곽현준 수정 */
.search.darkgray::after {
  content: "";
  display: block;
  position: absolute;
  left: 11px;
  top: calc(50% - 10px);
  width: 19px;
  height: 20px;
  background: url(/images/common/ico_tws_search_1.png) no-repeat 50%;
  background-size: 100%;
}

/* .reset.darkgray::after {content:''; display:block; position:absolute; right:12px; top:calc(50% - 10px); width:20px; height:20px; background:url(/images/common/ico_tws_reset.png) no-repeat 50%; background-size:100%;} */

/* 2021.01.06 곽현준 수정 */
.reset.darkgray::after {
  content: "";
  display: block;
  position: absolute;
  left: 12px;
  top: calc(50% - 10px);
  width: 20px;
  height: 20px;
  background: url(/images/common/ico_tws_reset_1.png) no-repeat 50%;
  background-size: 100%;
}

/* 2021.01.18 곽현준 수정 */
/* .file.darkgray::after {content:''; display:block; position:absolute; right:16px; top:calc(50% - 10px); width:20px; height:20px; background:url(/images/common/ico_tws_file.png) no-repeat 50%; background-size:100%;} */

.btn.btnSmall.darkgray {
  position: relative;
  padding-right: 15px;
  height: 38px;
  color: #4380e0;
  border: 1px solid #4380e0;
  background-color: #fff;
  border-radius: 3px;
} /* 2021.01.18 곽현준 추가 */
.btn.btnSmall.darkgray:after {
  content: "";
  position: absolute;
  right: 7px;
  top: 10px;
  width: 12px;
  height: 22px;
  background: url(/images/btn/bg_btn_go.png) 0 0 no-repeat;
} /* 2021.01.18 곽현준 추가 */
.btn.btnSmall.darkgray:hover {
  color: #535353;
  border: 1px solid #535353;
} /* 2021.01.18 곽현준 추가 */
.btn.btnSmall.darkgray:hover:after {
  background: url(/images/btn/bg_btn_go_hover.png) 0 0 no-repeat;
}

.expandBtn {
  min-width: inherit;
  width: 40px;
  height: 40px;
  border: solid #999 1px;
  border-radius: 20px;
}
.expandBtn span {
  position: absolute;
  font-size: 1px;
  color: transparent;
  text-indent: -9999px;
}
.expandBtn::before {
  content: "";
  display: inline-block;
  position: absolute;
  left: calc(50% - 10px);
  top: calc(50% - 6px);
  width: 20px;
  height: 12px;
  background: url(/images/common/ico_tws_up.png) no-repeat 50%;
  background-size: 100%;
  transform: rotate(180deg);
  transition: all 0.3s;
}
.expandBtn.open::before {
  transform: rotate(0deg);
  transition: all 0.3s;
}

.linkArrBtn {
  display: block;
  position: absolute;
  top: 50%;
  right: 16px;
  width: 40px;
  height: 40px;
  border: solid #c7c7c7 1px;
  border-radius: 20px;
  font-size: 1px;
  text-indent: -9999px;
  color: transparent;
  transform: translateY(-50%);
}
.linkArrBtn::before {
  content: "";
  display: block;
  position: absolute;
  left: calc(50% - 10px);
  top: calc(50% - 10px);
  width: 20px;
  height: 20px;
  background: url(/images/common/ico_arr_right.png) no-repeat 50%;
  background-size: 100%;
}

@media screen and (max-width: 768px) {
  /*** input ***/
  /** dateSetting **/
  .dateSetting {
    display: inline-block;
    position: relative;
    width: 100%;
    margin: 0;
    padding: 0;
  }
  .dateSetting .datePC {
    display: none;
  }
  .dateSetting .dateMobile {
    display: flex;
    position: relative;
    width: 100%;
    margin: 0;
    padding: 0;
    flex-wrap: wrap;
    justify-content: start;
    flex-direction: row;
  }
  .dateSetting .dateMobile span.bar {
    display: none;
  }
  .dateMobile input[type="date"] {
    position: relative;
    height: 30px;
    width: 100%;
    padding: 0 0 0 12px;
    border: solid #d0d0d0 1px;
    font-size: 1.6rem;
    background-color: #fff;
    color: #222;
    -webkit-appearance: none;
  }
  .dateMobile input[type="date"]:nth-of-type(2) {
    margin-top: 12px;
  }
  .dateMobile input[type="date"]::before {
    content: "";
    display: block;
    position: absolute;
    right: 5px;
    top: 5px;
    width: 20px;
    height: 20px;
    background: url(/images/common/ico_tws_datepic.png) no-repeat 50%;
    background-size: 100%;
  }
  .dateMobile input[type="date"]::-webkit-inner-spin-button {
    display: none;
  }
  .dateMobile input[type="date"]::-webkit-calendar-picker-indicator {
    opacity: 0;
    display: none;
    -webkit-appearance: none;
  }

  /** timeSetting **/
  .timeSetting {
    display: flex;
    flex-direction: column;
  }
  .timeSetting .hour,
  .timeSetting .minute {
    display: flex;
    position: relative;
    margin: 0;
    padding: 0;
    flex-direction: row-reverse;
  }
  .timeSetting .minute {
    margin-left: 0px;
    margin-top: 12px;
  }
  .timeSetting select {
    width: 100%;
  }
  .timeSetting label {
    display: none;
    line-height: 30px;
    margin-left: 10px;
  }
  .dateSetting + .timeSetting {
    margin-left: 0px;
    margin-top: 12px;
  }

  /** 버튼셋**/
  .btnWrap.fall {
    flex-direction: column;
  }
  .btnWrap.fall .btn {
    margin-right: auto;
  }

  .btn {
    min-width: 50px;
    height: 30px;
    border-radius: 15px;
    padding: 0 10px;
  }
  .btn.btnSmall {
    height: 28px;
    padding: 0 12px;
  }

  .btn.fall {
    height: 60px;
    border-radius: 32px;
  }
  .btn.fall span {
    line-height: 22px;
  }

  /* .search.darkgray, .reset.darkgray, .file.darkgray {min-width:inherit; width:30px; height:30px; padding:0;}
	.search.darkgray span, .reset.darkgray span, .file.darkgray span {position:absolute; font-size:1px; color:transparent; text-indent:-9999px;} */

  /* 2021.01.07 곽현준 수정 */
  .search.darkgray,
  .reset.darkgray,
  .file.darkgray {
    margin-top: 12px;
  }
  .btn.lightblue.search {
    margin-top: 12px !important;
  }

  .search.darkgray::after {
    width: 15px;
    height: 17px;
    right: calc(50% - 8px);
    top: calc(50% - 9px);
  }
  .reset.darkgray::after {
    width: 17px;
    height: 17px;
    right: calc(50% - 8px);
    top: calc(50% - 8px);
  }
  .file.darkgray::after {
    width: 14px;
    height: 15px;
    right: calc(50% - 7px);
    top: calc(50% - 8px);
  }

  /* .expandBtn {min-width:inherit; width:30px; height:30px;}
	.expandBtn::before {left:calc(50% - 8px); top:calc(50% - 4px); width:15px; height:9px;} */

  /* 2021.01.19 곽현준 수정 */
  .expandBtn {
    margin-top: 12px;
    min-width: inherit;
    width: 40px;
    height: 40px;
    border: solid #999 1px;
    border-radius: 20px;
  }
  .expandBtn span {
    position: absolute;
    font-size: 1px;
    color: transparent;
    text-indent: -9999px;
  }
  .expandBtn::before {
    content: "";
    display: inline-block;
    position: absolute;
    left: calc(50% - 10px);
    top: calc(50% - 6px);
    width: 20px;
    height: 12px;
    background: url(/images/common/ico_tws_up.png) no-repeat 50%;
    background-size: 100%;
    transform: rotate(180deg);
    transition: all 0.3s;
  }
  .expandBtn.open::before {
    transform: rotate(0deg);
    transition: all 0.3s;
  }

  .btnWrap .summary {
    font-size: 1.6rem;
    line-height: 30px;
  }

  .btnPrintWrap {
    display: none;
  }
}

/** 페이징 **/
/* .pagingWrap {display:block; position:relative; margin:0; padding:0;} */
.pagingWrap {
  display: block;
  position: relative;
  margin: 30px 0 0;
  padding: 0;
} /* 2021.01.19 곽현준 추가 */
.pagingWrap .summary {
  display: inline-block;
  position: absolute;
  right: 0;
  top: 7px;
  color: #666;
}
.pagingWrap .summary .total {
  color: #003894;
}
.pagingWrap .paging {
  display: flex;
  position: relative;
  margin: 0 auto;
  padding: 0;
  flex-direction: row;
  justify-content: center;
}
/* .pagingWrap .paging a {display:inline-block; position:relative; width:40px; height:40px; line-height:40px; margin:0; padding:0; border:solid #c7c7c7 1px; border-radius:50%; text-align:center;} */

/* 2021.01.06 곽현준 수정 */
.pagingWrap .paging a {
  display: inline-block;
  position: relative;
  width: 34px;
  height: 34px;
  line-height: 34px;
  margin: 0;
  padding: 0;
  border: solid #c7c7c7 1px;
  text-align: center;
}

.pagingWrap .paging a + a {
  margin-left: 8px;
}
.pagingWrap .paging a span {
  display: inline-block;
  position: relative;
  margin: 0;
  padding: 0;
  color: #666;
}
/* .pagingWrap .paging a.current {background-color:#999; border-color:#999;} */
.pagingWrap .paging a.current {
  background-color: #252525;
  border-color: #252525;
} /* 2021.01.06 곽현준 수정 */
.pagingWrap .paging a.current span {
  color: #fff;
}
.pagingWrap .paging a.first span,
.paging a.prev span,
.paging a.next span,
.paging a.end span {
  position: absolute;
  font-size: 1px;
  color: transparent;
  text-indent: -9999px;
}
.pagingWrap .paging a.first::before,
.paging a.prev::before,
.paging a.next::before,
.paging a.end::before {
  content: "";
  display: block;
  position: absolute;
  left: calc(50% - 10px);
  top: calc(50% - 10px);
  width: 20px;
  height: 20px;
  background-repeat: no-repeat;
  background-position: 50%;
  background-size: 100%;
}
.pagingWrap .paging a.first::before {
  background-image: url(/images/common/ico_tws_first.png);
}
.pagingWrap .paging a.prev::before {
  background-image: url(/images/common/ico_tws_prev.png);
}
.pagingWrap .paging a.next::before {
  background-image: url(/images/common/ico_tws_prev.png);
  transform: rotate(180deg);
}
.pagingWrap .paging a.end::before {
  background-image: url(/images/common/ico_tws_first.png);
  transform: rotate(180deg);
}
.pagingWrap .paging a.first.disable,
.paging a.prev.disable,
.paging a.next.disable,
.paging a.end.disable {
  opacity: 0.6;
  cursor: default;
}
.pagingWrap .mobileMore {
  display: none;
}

.pagingWrap > .total {
  display: block;
  position: relative;
  margin: 0;
  padding: 0;
  text-align: center;
}
.pagingWrap > .total span {
  display: inline-block;
  position: relative;
  margin: 0;
  padding: 0;
  color: #003894;
}
.pagingWrap > .sign {
  display: block;
  position: absolute;
  top: 0;
  right: 0;
  margin: 0;
  padding: 0;
}
.pagingWrap > .sign span {
  display: inline-block;
  position: relative;
  margin: 0 5px;
  padding: 0;
  font-size: 18px;
  font-weight: 600;
}

@media screen and (max-width: 768px) {
  .pagingWrap {
    padding-top: 40px;
    font-size: 1.6rem;
  }
  .pagingWrap .summary {
    width: 100%;
    right: 0;
    top: 0;
    text-align: center;
  }
  /* .pagingWrap .paging a {width:30px; height:30px; border-radius:100px; line-height:30px;} */

  /* 2021.01.06 곽현준 수정 */
  .pagingWrap .paging a {
    display: inline-block;
    position: relative;
    width: 34px;
    height: 34px;
    line-height: 34px;
    margin: 0;
    padding: 0;
    border: solid #c7c7c7 1px;
    text-align: center;
  }

  .pagingWrap .paging a + a {
    margin-left: 12px;
  }

  /* 모바일 더보기 사용안함 */
  .pagingWrap button.mobileMore {
    display: none;
  }
  /* .pagingWrap button.mobileMore {display:block; position:relative; width:100%; height:30px; border:solid #999 1px; border-radius:15px; text-align:center; color:#999;} */
  /* .pagingWrap .mobileMore > span {display:inline-block; position:relative; margin:0; padding:0 25px 0 0; background:url(/images/common/ico_more.png) no-repeat right 6px; background-size:14px;} */
}

/** fileBox **/
.fileBox {
  display: flex;
  position: relative;
  margin: 0;
  padding: 0;
  flex-direction: row;
}
.fileBox .fileName {
  display: inline-block;
  position: relative;
  width: calc(100% - 118px);
  height: 40px;
  line-height: 40px;
  margin: 0 16px 0 0;
  padding: 0 16px;
  border: solid #d0d0d0 1px;
  font-size: 16px;
}
.fileBox .fileName::placeholder {
  font-size: 16px;
  color: #999;
}
/* .fileBox .btn_file.btn {display:table; position:relative; line-height:40px; cursor:pointer;} */
.fileBox .btn_file.btn {
  display: table;
  position: relative;
  line-height: 40px;
  cursor: pointer;
  border-collapse: separate;
} /* 2021.01.28 곽현준 수정 - 첨부버튼 특정 위치에서 스타일 오류 방지 */
.fileBox .btn_file.btn span {
  display: table-cell;
  position: relative;
}
.fileBox input[type="file"] {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  border: 0;
}

/* Logo Upload FileBox */
.logoFileBox {
  display: flex;
  position: relative;
  margin: 0;
  padding: 0;
  flex-direction: row;
  justify-content: flex-start;
  align-items: center;
}
.logoFileBox .comp_logo {
  display: block;
  position: relative;
  margin: 0 10px 0 0;
  padding: 0;
  width: 100px;
  height: 100px;
  background: url(/images/common/ico_logo_none.png) no-repeat center;
  background-size: 100%;
}

/* 2021.03.08 곽현준 추가 - 명함사진 비율고정 */
.logoFileBox.wrap_photo .comp_logo {
  display: block;
  position: relative;
  margin: 0 10px 0 0;
  padding: 0;
  width: 106px;
  height: 136px;
  background: url(/images/common/ico_logo_none.png) no-repeat center;
  background-size: 100%;
}
.logoFileBox.wrap_photo .btnFixed p {
  margin-bottom: 10px;
  font-size: 12px;
}
.logoFileBox.wrap_photo .btnFixed .fileName {
  display: none;
}

.logoFileBox .comp_logo img {
  width: 100%;
  height: 100%;
}
.logoFileBox.initFile .comp_logo img {
  display: block;
}
@media screen and (max-width: 768px) {
  .logoFileBox {
    padding: 0 0 0 12px;
  }
}

/* logoTextWrap */
.logoTextWrap {
  display: block;
  position: relative;
  margin: 16px 0 40px -32px;
  padding: 0;
}
.logoTextWrap ul {
  display: flex;
  position: relative;
  margin: 0;
  padding: 0;
}
.logoTextBox {
  display: block;
  position: relative;
  margin: 0;
  padding: 0;
}
.logoTextBox a {
  display: flex;
  position: relative;
  margin: 24px 0 0 32px;
  padding: 18px 25px;
  border: 1px solid #d0d0d0;
  flex-direction: row;
  flex-wrap: nowrap;
  align-items: center;
}

/* .logoTextBox .comp_logo {display:block; position:relative; min-width:100px; height:100px; background:url(/images/common/ico_logo_none.png) no-repeat center; background-size:100%;} */
.logoTextBox .comp_logo {
  display: block;
  position: relative;
  width: 100px;
  height: 100px;
  background: url(/images/common/ico_logo_none.png) no-repeat center;
  background-size: 100%;
} /* 2021.02.02 곽현준 수정 - 폭 고정 */

.logoTextBox .comp_logo img {
  width: 100%;
  height: 100%;
}
.logoTextBox .comp_info {
  margin-left: 25px;
}
.logoTextBox .comp_info .bold {
  font-weight: bold;
}
.logoTextBox .comp_info .title {
  display: block;
  position: relative;
  margin: 0;
  padding: 14px 0 0;
  font-size: 18px;
  font-weight: bold;
}
.logoTextBox .comp_info .infoText {
  display: block;
  position: relative;
  margin: 22px 0 0 0;
  padding: 0;
  font-size: 14px;
  color: #999;
}
.logoTextBox .comp_info .infoText li {
  display: inline-block;
  position: relative;
  margin: 0 6px 0 0;
  padding: 0 10px 0 0;
}
.logoTextBox .comp_info .infoText li::after {
  content: "";
  display: block;
  position: absolute;
  top: 3px;
  right: 0;
  width: 1px;
  height: 12px;
  background-color: #999;
}
.logoTextBox .comp_info .infoText li:last-child {
  margin-right: 0;
  padding-right: 0;
}
.logoTextBox .comp_info .infoText li:last-child::after {
  display: none;
}

@media screen and (max-width: 768px) {
  .logoTextWrap {
    font-size: 1.6rem;
  }
  .logoTextBox .comp_info .infoText li {
    margin: 0 6px 0 0;
    padding: 0 6px 0 0;
  }
}

/** Dropdown fileBox**/
.multiFileBox {
  display: flex;
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
  flex-direction: column-reverse;
}
.multiFileBox .infoMsg {
  display: flex;
  position: relative;
  margin: 0;
  padding: 8px 0 0 0;
}
.multiFileBox .infoMsg.marker_star {
  flex-direction: row;
}
.multiFileBox .infoMsg.marker_star li + li {
  margin: 0 0 0 8px;
}
.multiFileBox .btnFixed {
  display: block;
  position: relative;
  margin: 0;
  padding: 0 140px 0 0;
}
.multiFileBox .btnFixed button.file {
  position: absolute;
  right: 0;
  top: 0;
}
.multiFileBox .dropArea {
  display: block;
  position: relative;
  min-height: 64px;
  max-height: 200px;
  margin: 0 0 10px;
  padding: 14px 16px;
  background-color: #f7f7f7;
  overflow: hidden;
  overflow-y: auto;
}
.multiFileBox .dropArea .beforeMsg {
  display: inline-block;
  position: absolute;
  left: calc(50% - 100px);
  top: calc(50% - 10px);
  width: 200px;
  height: 20px;
  line-height: 20px;
  color: #666;
  text-align: center;
}
.multiFileBox .dropArea.disabled {
  background-color: #ececec;
  color: #999;
}

.multiFileBox.initFile .beforeMsg {
  display: none;
}
.multiFileBox.initFile .filelist {
  display: block;
  position: relative;
  margin: 0;
  padding: 0;
}
.multiFileBox.initFile .filelist li {
  display: flex;
  position: relative;
  margin: 0;
  padding: 0;
  flex-direction: row;
  justify-content: start;
}
.multiFileBox.initFile .filelist li + li {
  padding-top: 6px;
}
.multiFileBox.initFile .filelist li span {
  display: inline-block;
  position: relative;
  color: #222;
}
.multiFileBox.initFile .filelist .fileDel {
  display: block;
  position: relative;
  top: -1px;
  width: 19px;
  height: 19px;
  margin: 0 0 0 8px;
  padding: 0;
  border: solid #666 1px;
  border-radius: 50%;
  transform: rotate(45deg);
}
.multiFileBox.initFile .filelist .fileDel span {
  position: absolute;
  font-size: 1;
  color: transparent;
  text-indent: -9999px;
}
.multiFileBox.initFile .filelist .fileDel::before {
  content: "";
  display: block;
  position: absolute;
  left: 4px;
  top: 8px;
  width: 9px;
  height: 1px;
  background-color: #666;
}
.multiFileBox.initFile .filelist .fileDel::after {
  content: "";
  display: block;
  position: absolute;
  left: 8px;
  top: 4px;
  width: 1px;
  height: 9px;
  background-color: #666;
}

.btn_del_img {
  display: block;
  position: relative;
  top: 9px;
  width: 19px;
  height: 19px;
  margin: 0 0 0 8px;
  padding: 0;
  border: solid #666 1px;
  border-radius: 50%;
  transform: rotate(45deg);
}
.btn_del_img span {
  position: absolute;
  font-size: 1;
  color: transparent;
  text-indent: -9999px;
}
.btn_del_img::before {
  content: "";
  display: block;
  position: absolute;
  left: 4px;
  top: 8px;
  width: 9px;
  height: 1px;
  background-color: #666;
}
.btn_del_img::after {
  content: "";
  display: block;
  position: absolute;
  left: 8px;
  top: 4px;
  width: 1px;
  height: 9px;
  background-color: #666;
}

.multiFileBox .filelist {
  display: none;
}

@media screen and (max-width: 768px) {
  .fileBox .fileName {
    width: calc(100% - 30px);
    height: 30px;
    line-height: 30px;
    margin-right: 10px;
  }
  .fileBox .btn_file.btn {
    line-height: 30px;
  }

  .multiFileBox {
    flex-direction: column;
  }
  .multiFileBox .btnFixed {
    padding-right: 40px;
  }
  .multiFileBox .infoMsg.marker_star {
    flex-direction: column;
    padding: 0 0 8px 0;
  }
  .multiFileBox .infoMsg.marker_star li + li {
    margin: 4px 0 0 0;
  }

  /* 고정 스크롤 테이블 안에 파일박스가 있는 경우 */
  .fixScrollTable .multiFileBox {
    flex-direction: column-reverse;
  }
  .fixScrollTable .multiFileBox .infoMsg {
    padding: 8px 0 0 0;
  }
  .fixScrollTable .multiFileBox .infoMsg.marker_star {
    flex-direction: row;
  }
  .fixScrollTable .multiFileBox .infoMsg.marker_star li + li {
    margin: 0 0 0 8px;
  }

  .multiFileBox .dropArea {
    width: 70%;
  } /* 2021.01.20 곽현준 추가 */
  .fileBox .fileName + .btn_file.btn.darkgray.file {
    margin-top: 0;
    height: 30px !important;
    line-height: 30px !important;
  } /* 2021.01.20 곽현준 추가 */
}

/*** ModalPop ***/
/* .lpContainer {display:none; position:fixed; left:0; top:0; width:100%; height:100%; background-color:rgba(0,0,0,0.6); font-size:16px; z-index:100;} */
.lpContainer {
  display: none;
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.6);
  font-size: 16px;
  z-index: 1000;
  overflow: auto;
} /* 2021.02.04 곽현준 수정 - 스크롤 */
/* .lpContainer .lpWrap {display:block; position:relative; top:50%; margin:0 auto; padding:0; background-color:#fff; transform:translateY(-50%);} */
.lpContainer .lpWrap {
  display: block;
  position: relative;
  top: 15%;
  margin: 0 auto;
  padding: 0;
  background-color: #fff; /* transform:translateY(-50%); */
  padding: 20px;
  box-sizing: border-box;
  border-radius: 10px;
} /* 2021.02.04 곽현준 수정 - 모달팝업 width가 길경우 화면 안보임 수정 */
/* .lpContainer .lpWrap.small {width:calc(100% - 32px); max-width:344px; padding:44px 20px;} */
.lpContainer .lpWrap.small {
  width: calc(100% - 32px);
  max-width: 344px;
  padding: 22px;
} /* 2021.02.11 곽현준 수정 - 모달팝업 패딩 수정 */
.lpContainer .lpWrap.medium {
  width: calc(100% - 32px);
  max-width: 700px;
}
.lpContainer .lpWrap.big {
  width: calc(100% - 32px);
  max-width: 900px;
}
.lpContainer .lpWrap.veryBig {
  width: calc(100% - 32px);
  max-width: 1024px;
}
.lpContainer .lpWrap.full {
  width: calc(100% - 32px);
  max-width: 100%;
}

.lpWrap .lpHead {
  display: block;
  position: relative;
  margin: 0;
  padding: 0;
}
.lpWrap .lpHead .title {
  display: block;
  position: relative;
  font-size: 24px;
  font-weight: 700;
  margin: 0 0 25px 0;
  color: #000;
}
.lpWrap .lpHead .title::focus {
  color: #ccc;
}
.lpWrap .lpHeadSub {
  display: block;
  position: relative;
  margin: 0;
  padding: 0;
}
.lpWrap .lpHeadSub .title {
  display: block;
  position: relative;
  font-size: 18px;
  font-weight: 700;
  margin: 30px 0 25px 0;
  color: #000;
}
.lpWrap .lpContent {
  display: block;
  position: relative;
  width: 100%;
  margin: 0;
  padding: 0;
}
/* .lpWrap .lpContent p {padding-top:40px; color:#222; text-align:center; line-height:28px;} */
.lpWrap .lpContent p {
  padding-top: 22px;
  color: #222;
  text-align: center;
  line-height: 28px;
} /* 2021.02.11 곽현준 수정 - 모달팝업 패딩 수정 */
.lpWrap .lpContent p.infoText {
  padding-top: 0;
}
.lpWrap .btnWrap {
  justify-content: center;
}
.lpWrap .lpContent + .btnWrap {
  margin-top: 20px !important;
} /* 2021.02.11 곽현준 수정 - 모달팝업 마진 수정 */
.lpWrap .btnWrap.flexend {
  justify-content: flex-end;
}
.lpWrap .lpContent p + p {
  padding-top: 20px;
}
.lpWrap .boardListWrap .tableWrap01 .radioSet label {
  padding: 0 0 0 20px;
}
/* .lpWrap .lpBottom {display:flex; position:relative; margin:40px 0 0 0; padding:0; text-align:center;} */
.pwPop .lpContent em {
  color: #e60020;
}
.pwPop .lpContent .blueBox span {
  display: inline-block;
  padding: 6px 16px;
  background-color: #f5f9ff;
}

.inputPop .lpWrap.small,
.inputPop .lpWrap.medium,
.inputPop .lpWrap.big,
.inputPop .lpWrap.veryBig {
  padding: 30px 20px 44px;
}

.inputPop .lpWrap.full {
  padding: 30px 20px 10px;
}

/* 팝업의 내용이 길 경우 내용 높이 고정 */
.fullPack .lpWrap .verticalFix {
  overflow-y: auto;
  max-height: 60vh;
}
.fullPack .lpWrap .verticalFix.small {
  overflow-y: auto;
  max-height: 30vh;
}
.fullPack .verticalFix .blueBox + .subHeading {
  margin-top: 3rem;
}
.fullPack .verticalFix .contTitle + .txt {
  margin-top: 1rem;
}
.fullPack .verticalFix .linkTxt {
  color: #4380e0;
  border-bottom: 1px solid #4380e0;
}
.fullPack .verticalFix .tableWrap01 .linkTxt {
  color: inherit;
  border-bottom: none;
}
.fullPack .buyCallPopList .tableWrap01 table td {
  text-align: left;
}
.fullPack .verticalFix label.checkSingle input[type="checkbox"] + span {
  padding-left: 10px;
}

.radioPop .formGrid {
  display: block;
  overflow-y: auto;
  height: 105px;
}
.radioPop .formGrid .thcell p {
  padding-top: 0;
}
.radioPop .formGrid .row .thcell {
  display: block;
  position: relative;
  width: 100%;
  height: inherit;
  margin: 0;
  padding: 12px;
  text-align: center;
  font-weight: 400;
  background-color: #edf4ff;
  border-right: inherit;
  box-sizing: border-box;
}
.radioPop .formGrid .row .tdcell {
  display: block;
  position: relative;
  width: 100%;
  height: inherit;
  margin: 0;
  padding: 0;
  box-sizing: border-box;
}
.radioPop .formGrid .row:last-child .tdcell {
  padding-bottom: 0;
}
.radioPop .formGrid .row:first-child .tdcell {
  padding-top: 0;
}
.radioPop .formGrid .row .tdcell .radioSet {
  flex-direction: column;
  width: 100%;
}
.radioPop .formGrid .row .tdcell label {
  width: 100%;
  padding: 16px 24px 16px 24px;
  text-align: left;
}
.radioPop .formGrid .row .tdcell label + label {
  margin-left: 0;
  border-top: 1px solid #ececec;
}
.radioPop .formGrid .row .tdcell label span {
  padding-left: 30px;
}
.radioPop .radioSet label input[type="radio"] {
  left: 28px;
}
.radioPop .radioSet label input[type="radio"] + span::before {
  left: 20px;
}
.radioPop .radioSet label input[type="radio"]:checked + span::after {
  left: 24px;
}

.confirmPop02 strong.data {
  font-weight: bold;
  color: #003894;
}

.closeModal {
  display: block;
  position: absolute;
  top: 32px;
  right: 22px;
  color: #000;
  z-index: 100;
}
.lpWrap .closeModal {
  display: block;
  width: 24px;
  height: 24px;
  text-indent: -9999px;
  font-size: 1px;
  color: transparent;
}
.lpWrap .closeModal::before {
  content: "";
  display: block;
  position: absolute;
  top: 12px;
  left: -4px;
  width: 30px;
  height: 1px;
  background-color: #000;
  transform: rotate(315deg);
}
.lpWrap .closeModal::after {
  content: "";
  display: block;
  position: absolute;
  top: 12px;
  left: -4px;
  width: 30px;
  height: 1px;
  background-color: #000;
  transform: rotate(-315deg);
}

.icoSymbol {
  display: block;
  width: 100%;
  height: 80px;
}
.ico_info {
  background: url(/images/common/ico_info.png) center 0 no-repeat;
  background-size: 80px;
}
.ico_warning {
  background: url(/images/common/ico_warning.png) center 0 no-repeat;
  background-size: 92px 80px;
}
.ico_error {
  background: url(/images/common/ico_error.png) center 0 no-repeat;
  background-size: 80px;
}
.ico_lock {
  background: url(/images/common/ico_lock.png) center 0 no-repeat;
  background-size: 80px;
}
.ico_question {
  background: url(/images/common/ico_question.png) center 0 no-repeat;
  background-size: 80px;
}
.ico_find {
  background: url(/images/common/ico_find.png) center 0 no-repeat;
  background-size: 80px;
}
.ico_search {
  background: url(/images/common/ico_search.png) center 0 no-repeat;
  background-size: 80px;
}
.ico_emailRefusal {
  background: url(/images/common/ico_email_refusal.png) center 0 no-repeat;
  background-size: 114px 80px;
}

.icoCross.small {
  position: absolute;
  top: 50%;
  right: 10px;
  overflow: hidden;
  width: 30px;
  height: 30px;
  margin: 0;
  padding: 0;
  transform: translateY(-50%);
}
.icoCross.small::before,
.icoCross.small::after {
  position: absolute;
  top: 50%;
  left: 50%;
  margin: 0;
  padding: 0;
  background-color: #999;
  transform: translate(-50%, -50%);
  transition: all 0.2s;
  content: "";
}
.icoCross.small::before {
  width: 16px;
  height: 2px;
}
.icoCross.small::after {
  width: 2px;
  height: 16px;
}
.is-show.icoCross.small::before {
  transform: translateX(100%);
  opacity: 0;
}
.is-show.icoCross.small::after {
  transform: translate(-50%, -50%) rotate(90deg);
}

/* 2024.09.24 - 김지안 추가*/
/* 버튼 */
.onSearch.detail + .onConHead .btn > * {
  position: relative;
  z-index: 10;
}
.onSearch.detail + .onConHead .btn {
  border-radius: 5px;
}
.onSearch.detail + .onConHead .btn::before {
  position: absolute;
  opacity: 0;
  content: "";
  display: block;
  background: transparent;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  transition: 0.3s linear;
}
.onSearch.detail + .onConHead .btn:hover::before {
  background: linear-gradient(
    135deg,
    rgba(37, 49, 130, 1) 0%,
    rgba(216, 72, 102, 1) 100%
  );
  opacity: 1;
}

.onField .checkboxSet.pdFixed {
  padding: 0;
}
.onField .checkboxSet label {
  padding: 0 0 0 15px;
}
/* 2024.09.24 - 김지안 추가*/

/* 라디오 버튼을 체크할 경우 하단 폼이 바뀜 */
.tabRadio {
  display: block;
  position: relative;
  margin: 0;
  padding: 0;
}
.contRadio {
  display: block;
  position: relative;
  margin: 0;
  padding: 0;
}
.contRadio > .unit {
  display: none;
  position: relative;
  margin: 0;
  padding: 0;
}
.contRadio > .unit.is-active {
  display: block;
}

/******** 1240이상 대응 *******/
@media screen and (max-width: 1240px) {
}

/** 페이징 **/
/* .pagingWrap {display:block; position:relative; margin:0; padding:0;} */
.pagingWrap {
  display: block;
  position: relative;
  margin: 50px 0 0;
  padding: 0;
} /* 2021.01.19 곽현준 추가 */
.pagingWrap .summary {
  display: inline-block;
  position: absolute;
  right: 0;
  top: 7px;
  color: #666;
}
.pagingWrap .summary .total {
  color: #003894;
}
.pagingWrap .paging {
  display: flex;
  position: relative;
  margin: 0 auto;
  padding: 0;
  flex-direction: row;
  justify-content: center;
}
/* .pagingWrap .paging a {display:inline-block; position:relative; width:40px; height:40px; line-height:40px; margin:0; padding:0; border:solid #c7c7c7 1px; border-radius:50%; text-align:center;} */

/* 2021.01.06 곽현준 수정 */
.pagingWrap .paging a {
  display: inline-block;
  position: relative;
  border-color: none;
  min-width: 12px;
  padding: 0 10px;
  box-sizing: border-box;
  width: auto;
  height: 34px;
  line-height: 34px;
  margin: 0;
  text-align: center;
  border: none;
  font-size: 18px;
  font-weight: 600;
}

.pagingWrap .paging a + a {
  margin-left: 0;
}
.pagingWrap .paging a span {
  display: inline-block;
  position: relative;
  margin: 0;
  padding: 0;
  color: #888888;
}
/* .pagingWrap .paging a.current {background-color:#999; border-color:#999;} */
.pagingWrap .paging a.current {
  background-color: unset;
  border: none;
} /* 2021.01.06 곽현준 수정 */
.pagingWrap .paging a:hover span,
.pagingWrap .paging a.current span {
  color: #003994;
}
.pagingWrap .paging a.first,
.pagingWrap .paging a.prev {
  margin-right: 2%;
}
.pagingWrap .paging a.first::before {
  background: url(/images/common/icon_first.svg) no-repeat center center;
}
.pagingWrap .paging a.prev::before {
  background: url(/images/common/icon_prev.svg) no-repeat center center;
}
.pagingWrap .paging a.next::before {
  background: url(/images/common/icon_prev.svg) no-repeat center center;
  transform: rotate(180deg);
}
.pagingWrap .paging a.next,
.pagingWrap .paging a.end {
  margin-left: 2%;
}
.pagingWrap .paging a.end::before {
  background: url(/images/common/icon_first.svg) no-repeat center center;
  transform: rotate(180deg);
}
.pagingWrap .paging a.first:hover::before {
  background: url(/images/common/icon_firstHover.svg) no-repeat center center;
}
.pagingWrap .paging a.prev:hover::before {
  background: url(/images/common/icon_prevHover.svg) no-repeat center center;
}
.pagingWrap .paging a.next:hover::before {
  background: url(/images/common/icon_prevHover.svg) no-repeat center center;
  transform: rotate(180deg);
}
.pagingWrap .paging a.end:hover::before {
  background: url(/images/common/icon_firstHover.svg) no-repeat center center;
  transform: rotate(180deg);
}
.pagingWrap .paging a.first.disable::before,
.paging a.prev.disable::before,
.paging a.next.disable::before,
.paging a.end.disable::before {
  opacity: 0.6;
  cursor: default;
}

/* 2024.09.05 - 김지안 추가*/
.tdcell input[type="text"],
.tdcell input[type="password"],
.tdcell input[type="number"] {
  border: 1px solid #e8e8e8;
}
.onSearchIn .dateSetting .datePic input[type="text"] {
  width: 100%;
  border-radius: 5px;
}
.onSearchIn .checkboxSet {
  align-items: center;
}

.boardDetailWrap .btnWrap.center .btn {
  border-radius: 8px;
  padding: 15px 60px;
  transition: all 0.3s;
  box-sizing: border-box;
  border: 1px solid transparent;
}
.boardDetailWrap .btnWrap.center .btn.darkgray:hover {
  background: #fff;
  border: 1px solid #747588;
  color: #747588;
}
.boardDetailWrap .btnWrap.center .btn.red:hover {
  background: #fff;
  border: 1px solid #747588;
  color: #747588;
}
.boardDetailWrap .btnWrap.center .btn.red2:hover {
  background: #fff;
  border: 1px solid #747588;
  color: #747588;
}
.boardDetailWrap .btnWrap.center .btn.lightblue:hover {
  background: #fff;
  border: 1px solid #747588;
  color: #747588;
}
.boardDetailWrap .btnWrap.center + .adjacentList {
  margin-top: 60px;
}

.btnWrap.center .btn + .btn {
  margin: 0;
}
.contentzone .btnWrap.center {
  flex-wrap: wrap;
}
.contentzone .btnWrap.center .btn {
  margin: 5px 10px;
  border-radius: 8px;
  padding: 15px 60px;
  transition: all 0.3s;
  box-sizing: border-box;
  border: 1px solid transparent;
}
.contentzone .btnWrap.center .btn.darkgray:hover {
  background: #fff;
  border: 1px solid #747588;
  color: #747588;
}
.contentzone .btnWrap.center .btn.red:hover {
  background: #fff;
  border: 1px solid #747588;
  color: #747588;
}
.contentzone .btnWrap.center .btn.lightblue:hover {
  background: #fff;
  border: 1px solid #747588;
  color: #747588;
}
.contentzone .btnWrap.center .btn span {
  padding: 0px;
}
.contentzone .btnWrap.center + .adjacentList {
  margin-top: 60px;
}

@media screen and (max-width: 768px) {
  .pagingWrap .paging a {
    font-size: 15px;
    padding: 0 7px;
  }
  .contentzone .btnWrap.center .btn {
    padding: 15px;
    min-width: 130px;
  }
  .boardDetailWrap .btnWrap.center + .adjacentList {
    flex-direction: column;
  }
  .boardDetailWrap .btnWrap.center + .adjacentList > p {
    width: 100%;
    padding: 12px;
  }

  .onSearchIn .dateMobile input[type="date"] {
    border-radius: 5px;
    height: 32px;
    border: 1px solid #e8e8e8;
  }
  .onSearchIn .dateMobile input[type="date"]:nth-of-type(2) {
    margin-top: 10px;
  }

  .subHeading .btnWrap .btn.btnSmall.darkgray {
    height: 32px;
    font-size: 14px;
    padding: 0;
    background: url(/images/btn/bg_btn_go.png) no-repeat 0 0 / contain;
    top: 0;
    bottom: 0;
    margin: auto 0;
    width: 10px;
    height: 12px;
  }
}
/* 2024.09.05 - 김지안 추가*/