@charset "UTF-8";
/* common.css */
/** form **/
/* placeholder color 제어 */
input:-ms-input-placeholder {
  color: #888888;
}

/* Internet Explorer 10 이상에 적용 */
input::-webkit-input-placeholder {
  color: #888888;
}

/* Webkit, Blink, Edge에 적용 */
input::-moz-placeholder {
  color: #888888;
}

/* Mozilla Firefox 4 부터 18에 적용 */
input::-moz-placeholder {
  color: #888888;
}

/* overflow */
.ofa {
  overflow: auto !important;
}

.of-xa {
  overflow-x: auto !important;
}

.of-ya {
  overflow-y: auto !important;
}

.cf::after {
  display: table;
  content: "";
  clear: both;
}

.opa-0 {
  opacity: 0;
  transition: 0.4s all;
}

.m0a {
  margin: 0 auto;
}

/* margin-top */
.mt0 {
  margin-top: 0rem !important;
}

.mt5 {
  margin-top: 0.5rem !important;
}

.mt10 {
  margin-top: 1rem !important;
}

.mt15 {
  margin-top: 1.5rem !important;
}

.mt20 {
  margin-top: 2rem !important;
}

.mt25 {
  margin-top: 2.5rem !important;
}

.mt30 {
  margin-top: 3rem !important;
}

.mt40 {
  margin-top: 4rem !important;
}

.mt45 {
  margin-top: 4.5rem !important;
}

.mt50 {
  margin-top: 5rem !important;
}

.mt55 {
  margin-top: 5.5rem !important;
}

.mt60 {
  margin-top: 6rem !important;
}

.mt65 {
  margin-top: 6.5rem !important;
}

.mt70 {
  margin-top: 7rem !important;
}

.mt75 {
  margin-top: 7.5rem !important;
}

.mt80 {
  margin-top: 8rem !important;
}

.mt85 {
  margin-top: 8.5rem !important;
}

.mt90 {
  margin-top: 9rem !important;
}

.mt95 {
  margin-top: 9.5rem !important;
}

.mt100 {
  margin-top: 10rem !important;
}

.mtm1 {
  margin-top: -0.1rem;
}

/* margin-bottom */
.mb0 {
  margin-bottom: 0rem !important;
}

.mb5 {
  margin-bottom: 0.5rem !important;
}

.mb10 {
  margin-bottom: 1rem !important;
}

.mb15 {
  margin-bottom: 1.5rem !important;
}

.mb20 {
  margin-bottom: 2rem !important;
}

.mb25 {
  margin-bottom: 2.5rem !important;
}

.mb30 {
  margin-bottom: 3rem !important;
}

.mb40 {
  margin-bottom: 4rem !important;
}

.mb45 {
  margin-bottom: 4.5rem !important;
}

.mb50 {
  margin-bottom: 5rem !important;
}

.mb55 {
  margin-bottom: 5.5rem !important;
}

.mb60 {
  margin-bottom: 6rem !important;
}

.mb65 {
  margin-bottom: 6.5rem !important;
}

.mb70 {
  margin-bottom: 7rem !important;
}

.mb75 {
  margin-bottom: 7.5rem !important;
}

.mb80 {
  margin-bottom: 8rem !important;
}

.mb85 {
  margin-bottom: 8.5rem !important;
}

.mb90 {
  margin-bottom: 9rem !important;
}

.mb95 {
  margin-bottom: 9.5rem !important;
}

.mb100 {
  margin-bottom: 10rem !important;
}

.mbm1 {
  margin-bottom: -0.1rem;
}

/* margin-left */
.ml0 {margin-left: 0px !important;}
.ml5 {margin-left: 0.5rem !important;}
.ml10 {margin-left: 1.0rem !important;}
.ml15 {margin-left: 1.5rem !important;}
.ml20 {margin-left: 2.0rem !important;}
.ml25 {margin-left: 2.5rem !important;}
.ml30 {margin-left: 3.0rem !important;}
.ml40 {margin-left: 4.0rem !important;}
.ml45 {margin-left: 4.5rem !important;}
.ml50 {margin-left: 5.0rem !important;}
.ml55 {margin-left: 5.5rem !important;}
.ml60 {margin-left: 6.0rem !important;}
.ml65 {margin-left: 6.5rem !important;}
.ml70 {margin-left: 7.0rem !important;}
.ml75 {margin-left: 7.5rem !important;}
.ml80 {margin-left: 8.0rem !important;}
.ml85 {margin-left: 8.5rem !important;}
.ml90 {margin-left: 9.0rem !important;}
.ml95 {margin-left: 9.5rem !important;}
.ml100 {margin-left: 10.0rem !important;}

/* margin-right */
.mr0 {margin-right: 0rem !important;}
.mr5 {margin-right: 0.5rem !important;}
.mr10 {margin-right: 1.0rem !important;}
.mr15 {margin-right: 1.5rem !important;}
.mr20 {margin-right: 2.0rem !important;}
.mr25 {margin-right: 2.5rem !important;}
.mr30 {margin-right: 3.0rem !important;}
.mr40 {margin-right: 4.0rem !important;}
.mr45 {margin-right: 4.5rem !important;}
.mr50 {margin-right: 5.0rem !important;}
.mr55 {margin-right: 5.5rem !important;}
.mr60 {margin-right: 6.0rem !important;}
.mr65 {margin-right: 6.5rem !important;}
.mr70 {margin-right: 7.0rem !important;}
.mr75 {margin-right: 7.5rem !important;}
.mr80 {margin-right: 8.0rem !important;}
.mr85 {margin-right: 8.5rem !important;}
.mr90 {margin-right: 9.0rem !important;}
.mr95 {margin-right: 9.5rem !important;}
.mr100 {margin-right: 10.0rem !important;}

/* padding */
.pd0 {padding: 0rem !important;}
.pd5 {padding: 0.5rem !important;}
.pd10 {padding: 1.0rem !important;}
.pd15 {padding: 1.5rem !important;}
.pd20 {padding: 2.0rem !important;}
.pd25 {padding: 2.5rem !important;}
.pd30 {padding: 3.0rem !important;}
.pd40 {padding: 4.0rem !important;}
.pd45 {padding: 4.5rem !important;}
.pd50 {padding: 5.0rem !important;}
.pd55 {padding: 5.5rem !important;}
.pd60 {padding: 6.0rem !important;}
.pd65 {padding: 6.5rem !important;}
.pd70 {padding: 7.0rem !important;}
.pd75 {padding: 7.5rem !important;}
.pd80 {padding: 8.0rem !important;}
.pd85 {padding: 8.5rem !important;}
.pd90 {padding: 9.0rem !important;}
.pd95 {padding: 9.5rem !important;}
.pd100 {padding: 10.0rem !important;}

/* padding-left */
.pdl0 {padding-left: 0 !important;}

/* padding-top */
.pt0 {padding-top: 0rem !important;}
.pt5 {padding-top: 0.5rem !important;}
.pt10 {padding-top: 1.0rem !important;}
.pt15 {padding-top: 1.5rem !important;}
.pt20 {padding-top: 2.0rem !important;}
.pt25 {padding-top: 2.5rem !important;}
.pt30 {padding-top: 3.0rem !important;}
.pt40 {padding-top: 4.0rem !important;}
.pt45 {padding-top: 4.5rem !important;}
.pt50 {padding-top: 5.0rem !important;}
.pt55 {padding-top: 5.5rem !important;}
.pt60 {padding-top: 6.0rem !important;}
.pt65 {padding-top: 6.5rem !important;}
.pt70 {padding-top: 7.0rem !important;}
.pt75 {padding-top: 7.5rem !important;}
.pt80 {padding-top: 8.0rem !important;}
.pt85 {padding-top: 8.5rem !important;}
.pt90 {padding-top: 9.0rem !important;}
.pt95 {padding-top: 9.5rem !important;}
.pt100 {padding-top: 10.0rem !important;}

/* padding-left */
.pl0 {padding-left: 0rem !important;}
.pl5 {padding-left: 0.5rem !important;}
.pl10 {padding-left: 1.0rem !important;}
.pl15 {padding-left: 1.5rem !important;}
.pl20 {padding-left: 2.0rem !important;}
.pl25 {padding-left: 2.5rem !important;}
.pl30 {padding-left: 3.0rem !important;}
.pl40 {padding-left: 4.0rem !important;}
.pl45 {padding-left: 4.5rem !important;}
.pl50 {padding-left: 5.0rem !important;}
.pl55 {padding-left: 5.5rem !important;}
.pl60 {padding-left: 6.0rem !important;}
.pl65 {padding-left: 6.5rem !important;}
.pl70 {padding-left: 7.0rem !important;}
.pl75 {padding-left: 7.5rem !important;}
.pl80 {padding-left: 8.0rem !important;}
.pl85 {padding-left: 8.5rem !important;}
.pl90 {padding-left: 9.0rem !important;}
.pl95 {padding-left: 9.5rem !important;}
.pl100 {padding-left: 10.0rem !important;}

/* padding-right */
.pr0 {padding-right: 0rem !important;}
.pr5 {padding-right: 0.5rem !important;}
.pr10 {padding-right: 1.0rem !important;}
.pr15 {padding-right: 1.5rem !important;}
.pr20 {padding-right: 2.0rem !important;}
.pr25 {padding-right: 2.5rem !important;}
.pr30 {padding-right: 3.0rem !important;}
.pr40 {padding-right: 4.0rem !important;}
.pr45 {padding-right: 4.5rem !important;}
.pr50 {padding-right: 5.0rem !important;}
.pr55 {padding-right: 5.5rem !important;}
.pr60 {padding-right: 6.0rem !important;}
.pr65 {padding-right: 6.5rem !important;}
.pr70 {padding-right: 7.0rem !important;}
.pr75 {padding-right: 7.5rem !important;}
.pr80 {padding-right: 8.0rem !important;}
.pr85 {padding-right: 8.5rem !important;}
.pr90 {padding-right: 9.0rem !important;}
.pr95 {padding-right: 9.5rem !important;}
.pr100 {padding-right: 10.0rem !important;}

/* padding-bottom */
.pb0 {
  padding-bottom: 0 !important;
}

/* width */
.w0 {
  width: 0rem !important;
}

.w5 {
  width: 0.5rem !important;
}

.w10 {
  width: 1rem !important;
}

.w15 {
  width: 1.5rem !important;
}

.w20 {
  width: 2rem !important;
}

.w25 {
  width: 2.5rem !important;
}

.w30 {
  width: 3rem !important;
}

.w40 {
  width: 4rem !important;
}

.w45 {
  width: 4.5rem !important;
}

.w50 {
  width: 5rem !important;
}

.w55 {
  width: 5.5rem !important;
}

.w60 {
  width: 6rem !important;
}

.w65 {
  width: 6.5rem !important;
}

.w70 {
  width: 7rem !important;
}

.w75 {
  width: 7.5rem !important;
}

.w80 {
  width: 8rem !important;
}

.w85 {
  width: 8.5rem !important;
}

.w90 {
  width: 9rem !important;
}

.w95 {
  width: 9.5rem !important;
}

.w100 {
  width: 10rem !important;
}

.w105 {
  width: 10.5rem !important;
}

.w110 {
  width: 11rem !important;
}

.w115 {
  width: 11.5rem !important;
}

.w120 {
  width: 12rem !important;
}

.w125 {
  width: 12.5rem !important;
}

.w130 {
  width: 13rem !important;
}

.w140 {
  width: 14rem !important;
}

.w145 {
  width: 14.5rem !important;
}

.w150 {
  width: 15rem !important;
}

.w155 {
  width: 15.5rem !important;
}

.w160 {
  width: 16rem !important;
}

.w165 {
  width: 16.5rem !important;
}

.w170 {
  width: 17rem !important;
}

.w175 {
  width: 17.5rem !important;
}

.w180 {
  width: 18rem !important;
}

.w185 {
  width: 18.5rem !important;
}

.w190 {
  width: 19rem !important;
}

.w195 {
  width: 19.5rem !important;
}

.w200 {
  width: 20rem !important;
}

.w100 {
  width: 10rem !important;
}

.w1000 {
  width: 100rem !important;
}

/* max-width */
.max-w0 {
  width: 100% !important;
  max-width: 0rem !important;
}

.max-w5 {
  width: 100% !important;
  max-width: 0.5rem !important;
}

.max-w10 {
  width: 100% !important;
  max-width: 1rem !important;
}

.max-w15 {
  width: 100% !important;
  max-width: 1.5rem !important;
}

.max-w20 {
  width: 100% !important;
  max-width: 2rem !important;
}

.max-w25 {
  width: 100% !important;
  max-width: 2.5rem !important;
}

.max-w30 {
  width: 100% !important;
  max-width: 3rem !important;
}

.max-w40 {
  width: 100% !important;
  max-width: 4rem !important;
}

.max-w45 {
  width: 100% !important;
  max-width: 4.5rem !important;
}

.max-w50 {
  width: 100% !important;
  max-width: 5rem !important;
}

.max-w55 {
  width: 100% !important;
  max-width: 5.5rem !important;
}

.max-w60 {
  width: 100% !important;
  max-width: 6rem !important;
}

.max-w65 {
  width: 100% !important;
  max-width: 6.5rem !important;
}

.max-w70 {
  width: 100% !important;
  max-width: 7rem !important;
}

.max-w75 {
  width: 100% !important;
  max-width: 7.5rem !important;
}

.max-w80 {
  width: 100% !important;
  max-width: 8rem !important;
}

.max-w85 {
  width: 100% !important;
  max-width: 8.5rem !important;
}

.max-w90 {
  width: 100% !important;
  max-width: 9rem !important;
}

.max-w95 {
  width: 100% !important;
  max-width: 9.5rem !important;
}

.max-w100 {
  width: 100% !important;
  max-width: 10rem !important;
}

.max-w105 {
  width: 100% !important;
  max-width: 10.5rem !important;
}

.max-w110 {
  width: 100% !important;
  max-width: 11rem !important;
}

.max-w115 {
  width: 100% !important;
  max-width: 11.5rem !important;
}

.max-w120 {
  width: 100% !important;
  max-width: 12rem !important;
}

.max-w125 {
  width: 100% !important;
  max-width: 12.5rem !important;
}

.max-w130 {
  width: 100% !important;
  max-width: 13rem !important;
}

.max-w140 {
  width: 100% !important;
  max-width: 14rem !important;
}

.max-w145 {
  width: 100% !important;
  max-width: 14.5rem !important;
}

.max-w150 {
  width: 100% !important;
  max-width: 15rem !important;
}

.max-w155 {
  width: 100% !important;
  max-width: 15.5rem !important;
}

.max-w160 {
  width: 100% !important;
  max-width: 16rem !important;
}

.max-w165 {
  width: 100% !important;
  max-width: 16.5rem !important;
}

.max-w170 {
  width: 100% !important;
  max-width: 17rem !important;
}

.max-w175 {
  width: 100% !important;
  max-width: 17.5rem !important;
}

.max-w180 {
  width: 100% !important;
  max-width: 18rem !important;
}

.max-w185 {
  width: 100% !important;
  max-width: 18.5rem !important;
}

.max-w190 {
  width: 100% !important;
  max-width: 19rem !important;
}

.max-w195 {
  width: 100% !important;
  max-width: 19.5rem !important;
}

.max-w200 {
  width: 100% !important;
  max-width: 20rem !important;
}

.max-w220 {
  width: 100% !important;
  max-width: 22rem !important;
}

.max-w240 {
  width: 100% !important;
  max-width: 24rem !important;
}

.max-w260 {
  width: 100% !important;
  max-width: 26rem !important;
}

.max-w280 {
  width: 100% !important;
  max-width: 28rem !important;
}

.max-w300 {
  width: 100% !important;
  max-width: 30rem !important;
}

.max-w100 {
  width: 100% !important;
  max-width: 10rem !important;
}

.max-w1000 {
  width: 100% !important;
  max-width: 100rem !important;
}

/* width percent */
.w25p {
  width: 25% !important;
}

.w39p {
  width: 39% !important;
}

.w40p {
  width: 40% !important;
}

.w50p {
  width: 50% !important;
}

.w100p {
  width: 100% !important;
}

.max-w10p {
  max-width: 10% !important;
}

.max-w20p {
  max-width: 20% !important;
}

.max-w30p {
  max-width: 30% !important;
}

.max-w40p {
  max-width: 40% !important;
}

.max-w50p {
  max-width: 50% !important;
}

.max-w60p {
  max-width: 60% !important;
}

.max-w70p {
  max-width: 70% !important;
}

.max-w80p {
  max-width: 80% !important;
}

.max-w90p {
  max-width: 90% !important;
}

.max-w100p {
  max-width: 100% !important;
}

/* height */
.h0 {
  height: 0px !important;
}

.h5 {
  height: 5px !important;
}

.h10 {
  height: 10px !important;
}

.h15 {
  height: 15px !important;
}

.h20 {
  height: 20px !important;
}

.h25 {
  height: 25px !important;
}

.h30 {
  height: 30px !important;
}

.h40 {
  height: 40px !important;
}

.h45 {
  height: 45px !important;
}

.h50 {
  height: 50px !important;
}

.h55 {
  height: 55px !important;
}

.h60 {
  height: 60px !important;
}

.h65 {
  height: 65px !important;
}

.h70 {
  height: 70px !important;
}

.h75 {
  height: 75px !important;
}

.h80 {
  height: 80px !important;
}

.h85 {
  height: 85px !important;
}

.h90 {
  height: 90px !important;
}

.h95 {
  height: 95px !important;
}

.h100 {
  height: 100px !important;
}

.h105 {
  height: 105px !important;
}

.h110 {
  height: 110px !important;
}

.h115 {
  height: 115px !important;
}

.h120 {
  height: 120px !important;
}

.h125 {
  height: 125px !important;
}

.h130 {
  height: 130px !important;
}

.h140 {
  height: 140px !important;
}

.h145 {
  height: 145px !important;
}

.h150 {
  height: 150px !important;
}

.h155 {
  height: 155px !important;
}

.h160 {
  height: 160px !important;
}

.h165 {
  height: 165px !important;
}

.h170 {
  height: 170px !important;
}

.h175 {
  height: 175px !important;
}

.h180 {
  height: 180px !important;
}

.h185 {
  height: 185px !important;
}

.h190 {
  height: 190px !important;
}

.h195 {
  height: 195px !important;
}

.h100 {
  height: 100px !important;
}

.h1000 {
  height: 1000px !important;
}

.mh300 {
  max-height: 300px !important;
}

.mh500 {
  max-height: 620px !important;
}

.h_auto {
  height: auto !important;
}

.h100p {
  height: 100% !important;
}

/* vertical align */
.vt {
  vertical-align: top;
}

.vm {
  vertical-align: middle;
}

.vb {
  vertical-align: bottom;
}

/* text align */
.tl {
  text-align: left !important;
}

.tc {
  text-align: center !important;
}

.tr {
  text-align: right !important;
}

.tj {
  text-align: justify !important;
}

.align_left {
  text-align: left !important;
}

.align_right {
  text-align: center !important;
}

.align_center {
  text-align: right !important;
}

.align-left {
  text-align: left !important;
}

.align-right {
  text-align: center !important;
}

.align-center {
  text-align: right !important;
}

/* display */
.db {
  display: block !important;
}

.dib {
  display: inline-block !important;
}

.hide {
  display: none !important;
}

/* .show{display:table-row;} */
.show {
  display: block;
}

/* elip */
.elips {
  text-overflow: ellipsis;
  white-space: nowrap;
  word-wrap: normal;
  overflow: hidden;
}

/* float */
.fl {
  float: left;
}

.fr {
  float: right;
}

.fn {
  float: none !important;
}

/* font-weight */
.fwb {
  font-weight: bold !important;
}

/* font-size */
.fs0 {
  font-size: 0;
}

/* font-color */
.fc-r {
  color: #e6541c !important;
}

.fc-g {
  color: #53af31 !important;
}

.fc-o {
  color: #fd721f !important;
}

.fc-b {
  color: #303030 !important;
}

.fc-p {
  color: #ab10e9;
}

.fc-y {
  color: #FFE814 !important;
}

.fc-g {
  color: #777777;
}

.color-green{
  color:var(--green-color);
}

.low, .fc-blue, .color-blue {
  color: var(--primary-blue-bright-color);
}

.high, .fc-red, .color-red {
  color: #ee2e24;
}

/* border */
.bdn {
  border: none !important;
}

.bdln {
  border-left: none !important;
}

.bdrn {
  border-right: none !important;
}

.bdtn {
  border-top: none !important;
}

.bdbn {
  border-bottom: none !important;
}

.no-deco {
  border: none !important;
  box-shadow: unset !important;
}

/* text-decoration */
.txt_ul {
  text-decoration: underline;
}

/* background */
.bg_gray {
  background: #eeeeee;
}

/* etc */
.csp {
  cursor: pointer;
}

.clear {
  clear: both;
}

/***** SET *****/
.bold {
  font-weight: bold;
}

.point {
  color: #ef4153;
}

/** flex **/
.df {
  display: flex;
}

.dif {
  display: inline-flex;
}

.fdc {
  flex-direction: column !important;
}

.f-1 {
  flex: 1 !important;
}

.f-2 {
  flex: 2 !important;
}

.f-3 {
  flex: 3 !important;
}

.f-4 {
  flex: 4 !important;
}

.f-5 {
  flex: 5 !important;
}

.f-6 {
  flex: 6 !important;
}

.f-7 {
  flex: 7 !important;
}

.f-8 {
  flex: 8 !important;
}

/** align items **/
.aic {
  align-items: center !important;
}

.aib {
  align-items: baseline !important;
}

/** justify **/
.jcs {
  justify-content: start !important;
}

.jce {
  justify-content: end !important;
}

.jcsb {
  justify-content: space-between !important;
}

.jcc {
  justify-content: center !important;
}

.jcb {
  justify-content: baseline !important;
}

/** border **/
/* .bbs-none{border:none!important; box-shadow:none!important;} */
.dtc-grid {
  display: grid;
  gap: 2.0rem;
}
.dtc-grid > li {
  width: 100%;
  border: 1px solid var(--gray300-color);
  border-radius: 1rem;
  box-shadow: var(--gray300-color) 0 0.4rem 0.4rem 0;
  background: #ffffff;
  overflow: hidden;
}
.dtc-grid > li > div {
  border: unset !important;
  box-shadow: unset;
}
.dtc-grid.rep-1 {
  grid-template-columns: repeat(1, 1fr);
}
.dtc-grid.rep-2 {
  grid-template-columns: repeat(2, 1fr);
}
.dtc-grid.rep-3 {
  grid-template-columns: repeat(3, 1fr);
}
.dtc-grid.rep-4 {
  grid-template-columns: repeat(4, 1fr);
}
.dtc-grid.rep-5 {
  grid-template-columns: repeat(5, 1fr);
}
.dtc-grid.rep-6 {
  grid-template-columns: repeat(6, 1fr);
}
.dtc-grid.rep-7 {
  grid-template-columns: repeat(7, 1fr);
}
.dtc-grid.rep-8 {
  grid-template-columns: repeat(8, 1fr);
}
.dtc-grid.rep-9 {
  grid-template-columns: repeat(9, 1fr);
}
.dtc-grid.rep-10 {
  grid-template-columns: repeat(10, 1fr);
}
.dtc-grid.rep-11 {
  grid-template-columns: repeat(11, 1fr);
}
.dtc-grid.rep-12 {
  grid-template-columns: repeat(12, 1fr);
}
.dtc-grid.fd-col {
  flex-direction: column;
}

@media screen and (max-width: 870px) {
  .dtc-grid{
    grid-template-columns: repeat(1, 1fr) !important;
  }
}

.dtc-flex {
  display: flex;
  gap: 1.5rem;
}
.dtc-flex > li {
  flex: 1;
  width: 100%;
  border: 1px solid var(--gray300-color);
  border-radius: 1rem;
  box-shadow: var(--gray300-color) 0 0.4rem 0.4rem 0;
  background: #ffffff;
  overflow: hidden;
}
.dtc-flex > li > div {
  border: unset !important;
  box-shadow: unset;
}
.dtc-flex .flex-1 {
  flex: 1;
}
.dtc-flex .flex-2 {
  flex: 2;
}
.dtc-flex .flex-3 {
  flex: 3;
}
.dtc-flex .flex-4 {
  flex: 4;
}
.dtc-flex .flex-5 {
  flex: 5;
}
.dtc-flex .flex-6 {
  flex: 6;
}
.dtc-flex .flex-7 {
  flex: 7;
}
.dtc-flex .flex-8 {
  flex: 8;
}
.dtc-flex .flex-9 {
  flex: 9;
}
.dtc-flex .flex-10 {
  flex: 10;
}
.dtc-flex .flex-11 {
  flex: 11;
}
.dtc-flex .flex-12 {
  flex: 12;
}

.df-column {
  display: flex;
  flex-direction: column;
  width: 100%;
  height: 100%;
  /* gap:1.0rem; */
  position: relative;
}
.df-column > li {
  flex: 1;
  /* width: 100%; */
  /* border: 1px solid var(--gray300-color); */
  /* border-radius: 1.0rem; */
  /* box-shadow: var(--gray300-color) 0 0.4rem 0.4rem 0; */
  /* background: #ffffff; */
  /* overflow: hidden; */
  /* > div{border:unset!important; box-shadow:unset; } */
  border-bottom: 1px solid var(--gray200-color);
  padding: 0.5rem 1rem;
}
.df-column > li:last-child {
  border-bottom: 0;
}
.df-column .flex-1 {
  flex: 1;
}
.df-column .flex-2 {
  flex: 2;
}
.df-column .flex-3 {
  flex: 3;
}
.df-column .flex-4 {
  flex: 4;
}
.df-column .flex-5 {
  flex: 5;
}
.df-column .flex-6 {
  flex: 6;
}
.df-column .flex-7 {
  flex: 7;
}
.df-column .flex-8 {
  flex: 8;
}
.df-column .flex-9 {
  flex: 9;
}
.df-column .flex-10 {
  flex: 10;
}
.df-column .flex-11 {
  flex: 11;
}
.df-column .flex-12 {
  flex: 12;
}

body * {
  box-sizing: border-box;
}


.hyphen{padding:0 0.5rem;}

/*** wrap ***/
/* .wrap{width:100%; height:100%;  box-sizing:border-box; background-size:1920px; } */
/**************************** root ******************************/
:root {
  /* color */
  --white-color: #fff;
  --white-bg-opa-10: rgba(255,255,255,0.1);
  --white-bg-opa-20: rgba(255,255,255,0.2);
  --white-bg-opa-30: rgba(255,255,255,0.3);
  --white-bg-opa-40: rgba(255,255,255,0.4);
  --white-bg-opa-50: rgba(255,255,255,0.5);
  --white-bg-opa-60: rgba(255,255,255,0.6);
  --white-bg-opa-70: rgba(255,255,255,0.7);
  --white-bg-opa-80: rgba(255,255,255,0.8);
  --white-bg-opa-90: rgba(255,255,255,0.9);
  --white-bg-opa-100: rgba(255,255,255,1.0);

  --black-color: #140a00;
  --blue-color: #045fd4;
  --primary-blue-bright-color: #015CA9;
  --primary-blue-bright-bg-opa-10: rgba(1,92,169,0.1);
  --primary-blue-bright-bg-opa-20: rgba(1,92,169,0.2);
  --primary-blue-bright-bg-opa-30: rgba(1,92,169,0.3);
  --primary-blue-bright-bg-opa-40: rgba(1,92,169,0.4);
  --primary-blue-bright-bg-opa-50: rgba(1,92,169,0.5);
  --primary-blue-bright-bg-opa-60: rgba(1,92,169,0.6);
  --primary-blue-bright-bg-opa-70: rgba(1,92,169,0.7);
  --primary-blue-bright-bg-opa-80: rgba(1,92,169,0.8);
  --primary-blue-bright-bg-opa-90: rgba(1,92,169,0.9);
  --primary-blue-bright-bg-opa-100: rgba(1,92,169,1.0);
  --primary-blue-dark-color: #283D8A;
  --primary-blue-dark-bg-opa-10: rgba(40,61,138,0.1);
  --primary-blue-dark-bg-opa-20: rgba(40,61,138,0.2);
  --primary-blue-dark-bg-opa-30: rgba(40,61,138,0.3);
  --primary-blue-dark-bg-opa-40: rgba(40,61,138,0.4);
  --primary-blue-dark-bg-opa-50: rgba(40,61,138,0.5);
  --primary-blue-dark-bg-opa-60: rgba(40,61,138,0.6);
  --primary-blue-dark-bg-opa-70: rgba(40,61,138,0.7);
  --primary-blue-dark-bg-opa-80: rgba(40,61,138,0.8);
  --primary-blue-dark-bg-opa-90: rgba(40,61,138,0.9);
  --primary-blue-dark-bg-opa-100: rgba(40,61,138,1.0);

  --red-color: #B01116;
  --red-bg-opa-10: rgba(176, 17, 22,0.1);
  --red-bg-opa-20: rgba(176, 17, 22,0.2);
  --red-bg-opa-30: rgba(176, 17, 22,0.3);
  --red-bg-opa-40: rgba(176, 17, 22,0.4);
  --red-bg-opa-50: rgba(176, 17, 22,0.5);
  --red-bg-opa-60: rgba(176, 17, 22,0.6);
  --red-bg-opa-70: rgba(176, 17, 22,0.7);
  --red-bg-opa-80: rgba(176, 17, 22,0.8);
  --red-bg-opa-90: rgba(176, 17, 22,0.9);
  --red-bg-opa-100: rgba(176, 17, 22,1.0);

  --green-color: #009d3f;
  --green-bg-opa-10:rgba(0, 157, 63,0.1);
  --green-bg-opa-20:rgba(0, 157, 63,0.2);
  --green-bg-opa-30:rgba(0, 157, 63,0.3);
  --green-bg-opa-40:rgba(0, 157, 63,0.4);
  --green-bg-opa-50:rgba(0, 157, 63,0.5);
  --green-bg-opa-60:rgba(0, 157, 63,0.6);
  --green-bg-opa-70:rgba(0, 157, 63,0.7);
  --green-bg-opa-80:rgba(0, 157, 63,0.8);
  --green-bg-opa-90:rgba(0, 157, 63,0.9);
  --green-bg-opa-100:rgba(0, 157, 63,1.0);

  --green-dark-color: #02913b;
  --green-bg-opa-10:rgba(2, 145, 59,0.1);
  --green-bg-opa-20:rgba(2, 145, 59,0.2);
  --green-bg-opa-30:rgba(2, 145, 59,0.3);
  --green-bg-opa-40:rgba(2, 145, 59,0.4);
  --green-bg-opa-50:rgba(2, 145, 59,0.5);
  --green-bg-opa-60:rgba(2, 145, 59,0.6);
  --green-bg-opa-70:rgba(2, 145, 59,0.7);
  --green-bg-opa-80:rgba(2, 145, 59,0.8);
  --green-bg-opa-90:rgba(2, 145, 59,0.9);
  --green-bg-opa-100:rgba(2, 145, 59,1.0);

  /* --yellow-color: #33B133; */
  --yellow-color: #FF7E11;
  --yellow-bg-opa-10:rgba(255,126,17,0.1);
  --yellow-bg-opa-20:rgba(255,126,17,0.2);
  --yellow-bg-opa-30:rgba(255,126,17,0.3);
  --yellow-bg-opa-40:rgba(255,126,17,0.4);
  --yellow-bg-opa-50:rgba(255,126,17,0.5);
  --yellow-bg-opa-60:rgba(255,126,17,0.6);
  --yellow-bg-opa-70:rgba(255,126,17,0.7);
  --yellow-bg-opa-80:rgba(255,126,17,0.8);
  --yellow-bg-opa-90:rgba(255,126,17,0.9);
  --yellow-bg-opa-100:rgba(255,126,17,1.0);

  --td-color:#C6C8CA;
  --gray-dark-color: #666666;
  --gray-light-color: #e0e0e0;
  --gray100-color: #F7F8FA;
  --gray200-color: #EAEBED;
  --gray200-bg-opa-10: rgba(234,234,237,0.1);
  --gray200-bg-opa-20: rgba(234,234,237,0.2);
  --gray200-bg-opa-30: rgba(234,234,237,0.3);
  --gray200-bg-opa-40: rgba(234,234,237,0.4);
  --gray200-bg-opa-50: rgba(234,234,237,0.5);
  --gray200-bg-opa-60: rgba(234,234,237,0.6);
  --gray200-bg-opa-70: rgba(234,234,237,0.7);
  --gray200-bg-opa-80: rgba(234,234,237,0.8);
  --gray200-bg-opa-90: rgba(234,234,237,0.9);
  --gray200-bg-opa-100: rgba(234,234,237,1.0);
  --gray300-color: #CACDD2;
  --gray400-color: #9FA4A8;
  --gray500-color: #73787E;
  --gray600-color: #474C52;
  --gray700-color: #27282C;
  --gray800-color: #1C1D1F;
  --gray900-color: #131416;
  --kape_gray_bright-color: #A7A9AC;
  --kape_gray_dark-color: #666666;
  --kape_black-color: #333333;

  /* border color */
  --basic-border-color:#B2B0B0;

  --gray-dark-border-color: #909090;
  --gray-light-border-color: #e0e0e0;
  --gray100-border-color: #F7F8FA;
  --gray200-border-color: #EAEBED;
  --gray300-border-color: #CACDD2;
  --gray400-border-color: #9FA4A8;
  --gray500-border-color: #73787E;
  --gray600-border-color: #474C52;
  --gray700-border-color: #27282C;
  --gray800-border-color: #1C1D1F;
  --gray900-border-color: #131416;

  /* black color */
  --black-color: #000000;
  --black-bg-opa-10: rgba(0,0,0,0.1);
  --black-bg-opa-20: rgba(0,0,0,0.2);
  --black-bg-opa-30: rgba(0,0,0,0.3);
  --black-bg-opa-40: rgba(0,0,0,0.4);
  --black-bg-opa-50: rgba(0,0,0,0.5);
  --black-bg-opa-60: rgba(0,0,0,0.6);
  --black-bg-opa-70: rgba(0,0,0,0.7);
  --black-bg-opa-80: rgba(0,0,0,0.8);
  --black-bg-opa-90: rgba(0,0,0,0.9);
  --black-bg-opa-100: rgba(0,0,0,1.0);

  /* Size */
  /* --padding: 12px; */
  /* Font Size */
  --font-4x-large: 3.6rem;
  --font-xxx-large: 2.4rem;
  --font-xx-large: 2.2rem;
  --font-x-large: 2.0rem;
  --font-large: 1.8rem;
  --font-medium: 1.6rem;
  --font-small: 1.4rem;
  --font-micro: 1.2rem;
}

.fs-4x {
  font-size: var(--font-4x-large);
}

.fs-3x {
  font-size: var(--font-xxx-large);
}

.fs-2x {
  font-size: var(--font-xx-large);
}

.fs-1x {
  font-size: var(--font-x-large);
}

.fs-l {
  font-size: var(--font-large);
}

.fs-m {
  font-size: var(--font-medium);
}

.fs-s {
  font-size: var(--font-small);
}

/**************************** scroll ******************************/
.scr-type-01 {
  overflow-y: scroll;
}

.pop-cont::-webkit-scrollbar,
.scr-type-01--::-webkit-scrollbar {
  width: 1.1rem;
  border-radius: 1rem;
}
.pop-cont::-webkit-scrollbar-thumb,
.scr-type-01--::-webkit-scrollbar-thumb {
  background: #C1C1C1;
  /* 스크롤바 색상 */
  border-radius: 10px;
  /* 스크롤바 둥근 테두리 */
  border-right: 1px solid #ffffff;
  border-top: 1px solid #ffffff;
  border-bottom: 1px solid #ffffff;
}
.pop-cont::-webkit-scrollbar-track,
.scr-type-01--::-webkit-scrollbar-track {
  /*스크롤바 뒷 배경 색상*/
}
.pop-cont::-webkit-scrollbar-button,
.scr-type-01--::-webkit-scrollbar-button {
  display: none;
}
.pop-cont::-webkit-scrollbar-button:start,
.scr-type-01--::-webkit-scrollbar-button:start {
  background-color: red;
  /* Top, Left 방향의 이동버튼 */
}
.pop-cont::-webkit-scrollbar-button:end,
.scr-type-01--::-webkit-scrollbar-button:end {
  background-color: orange;
  /* Bottom, Right 방향의 이동버튼 */
}

/**************************** 탭 ******************************/
.tab-content-wrap .tab-content {
  display: none;
}
.tab-content-wrap .tab-content.on {
  display: block;
}

@media screen and (max-width: 780px) {
  .dtc-flex {
    flex-direction: column;
  }

  .dtc-grid.rep-3 {
    grid-template-columns: repeat(2, 1fr) !important;
  }
}
/**************************** 통합검색 ******************************/
/* pagination */
.pagination {
  margin: 26px 0 40px 0;
  text-align: center;
}

.pagination strong, .pagination span a, .pagination img {
  vertical-align: middle;
  text-align: center;
}

.pagination img {
  height: 37px;
  width: 37px;
  margin: 0 1px;
}

.pagination span a {
  display: inline-block;
  background: #fff;
  border: 1px solid #fff;
  height: 37px;
  width: 37px;
  padding: 7px 0 0 0;
  margin: 0 1px;
  font-size: 14px;
}

.pagination strong {
  display: inline-block;
  background: #045ebc;
  border: 1px solid #045ebc;
  color: #fff;
  height: 37px;
  width: 37px;
  padding: 6px 0 0 0;
  margin: 0 1px;
  font-size: 14px;
}

.pagination .next02, .pagination .prev02 {
  display: inline-block;
}

.pagination a.prev {
  margin: 0 2px 0 0;
}

.pagination a.next {
  margin: 0 0 0 2px;
}

/* gap */
.g-5{gap:0.5rem;}
.g-10{gap:1.0rem;}

/* web, mobile */
.web-only{display: block;}
.mo-only{display: none;}

@media screen and (max-width: 870px){
  .web-only{display: none;}
  .mo-only{display: block;}

  .mo-fd-col{flex-direction: column;}
}