:root {
  --Primary: #0455B2;
  --Secondary: #26C5F8;
  --Tertiary: #DCECFF;

  --color-01:#DCECFF;
  --color-02:#26C5F8;
  --color-03:#0085FF;
  --color-04:#0455B2;

  --c-green:#00BF58;
  --c-gray:#707783;
  --c-red:#CF0000;
  --c-o-red:#FF4118;

  --gray-01:#F0F3F7;
  --gray-02:#eee;
  --gray-03:#EDF0F5;
  --gray-04:#E0E2E6;
  --gray-05:#ddd;
  --gray-06:#ccc;
  --gray-07:#C2C6CC;
  --gray-08:#A3A9B3;
  --gray-09:#333;

  --hover-color:#DCECFF;
  --hover-color-02:#02336B;

  --white:#fff;
  --black:#000;
}

.hidden {
  position: absolute !important;
  top:auto;
  left:-10000px;
  width:1px;
  height:1px;
  overflow:hidden;
}

/*display*/
.dp_bc {
  display: block
}

.dp_ib {
  display: inline-block
}

.dp_fx {
  display: flex
}

.dp_if {
  display: inline-flex
}

.dp_no {
  display: none;
}

/*overflow*/
.over-hidden{
  overflow: hidden;
}
.overY-auto{
  overflow-y: auto;
}
.overX-auto{
  overflow-x: auto;
}
/*position*/
.po_rel{
  position: relative;
}
.po_abs{
  position: absolute;
}
.po_fix{
  position: fixed;
}
.po_stky{
  position: sticky;
}
.po_unset{
  position: unset !important;
}

/*width*/
.w-auto{
  width: auto !important;
}
.w100{
  width: 100% !important;
}
.w50{
  width: 50% !important;
}
.w25{
  width: 25% !important;
}

.w70px{
  width: 70px;
}
.w120px{
  width: 120px;
}
.w150px{
  width: 150px !important;
}

.m558{
  min-width: 558px !important;
}

.w-fit{
  width: fit-content;
}
.w-mxc{
  width: max-content;
}
.mnw-fit{
  min-width: fit-content !important;
}
.mnw-mxc{
  min-width: max-content !important;
}
.mnw-unset{
  min-width: unset !important;
}

/*height*/
.h100{
  height: 100%;
}
.h46px{
  height: 46px !important;
}
.h220px{
  height: 220px !important;
}
.h300px{
  height: 300px !important;
}
.h320px{
  height: 320px !important;
}
.h500px{
  height: 500px !important;
}
.h540px{
  height: 540px !important;
}
.mx525px{
  max-height: 525px;
}
.mnh520px{
  min-height: 520px !important;
}

/*hr*/
hr {
  display: block;
  width: 100%;
  height: 1px;
  background-color: transparent;
  border: 0px;
  border-bottom: 1px dashed var(--gray-05);
  margin: 20px 0;
}

/*margin*/
.m0 {
  margin: 0px !important;
}

.m10 {
  margin: 10px;
}

.m30 {
  margin: 30px;
}

/*margin-top*/
.mt_0 {
  margin-top: 0px !important
}

.mt_10 {
  margin-top: 10px
}

.mt_20 {
  margin-top: 20px
}

.mt_30 {
  margin-top: 30px
}

.mt_50 {
  margin-top: 50px
}

/*margin-bottom*/
.mb_0 {
  margin-bottom: 0px !important;
}

.mb_5 {
  margin-bottom: 5px !important;
}

.mb_10 {
  margin-bottom: 10px !important;
}

.mb_20 {
  margin-bottom: 20px !important;
}

.mb_30 {
  margin-bottom: 30px !important;
}

.mb_50 {
  margin-bottom: 50px;
}

/*margin-left*/
.ml_0 {
  margin-left: 0px !important
}

.ml_5 {
  margin-left: 5px
}

.ml_10 {
  margin-left: 10px !important;
}

.ml_20 {
  margin-left: 20px
}

.ml_30 {
  margin-left: 30px
}

.ml_50 {
  margin-left: 50px
}

/*margin-right*/
.mr_0 {
  margin-right: 0px !important
}

.mr_10 {
  margin-right: 10px
}

.mr_20 {
  margin-right: 20px
}

.mr_30 {
  margin-right: 30px
}

.mr_50 {
  margin-right: 50px
}

/*padding*/
.p0 {
  padding: 0;
}

.p10 {
  padding: 10px;
}

.p20 {
  padding: 20px;
}

.p30 {
  padding: 30px;
}

/*padding-top*/
.pt_0 {
  padding-top: 0px !important;
}

.pt_5 {
  padding-top: 5px
}

.pt_10 {
  padding-top: 10px
}

.pt_20 {
  padding-top: 20px
}

.pt_30 {
  padding-top: 30px
}

.pt_50 {
  padding-top: 50px
}

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

.pb_5 {
  padding-bottom: 5px !important;
}

.pb_10 {
  padding-bottom: 10px;
}

.pb_30 {
  padding-bottom: 30px;
}

.pb_50 {
  padding-bottom: 50px;
}

/*padding-left*/
.pl_0 {
  padding-left: 0px
}

.pl_10 {
  padding-left: 10px
}

.pl_30 {
  padding-left: 30px
}

.pl_50 {
  padding-left: 50px
}

/*padding-right*/
.pr_0 {
  padding-right: 0px
}

.pr_10 {
  padding-right: 10px
}

.pr_30 {
  padding-right: 30px
}

.pr_50 {
  padding-right: 50px
}

/*gap*/
.g1r{
  gap: 1rem!important;
}
.g5{
  gap: 5px !important;
}
.g10{
  gap: 10px !important;
}
.g20{
  gap: 20px;
}
.g30{
  gap: 30px;
}

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

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

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

/*vertical-align*/
.vtc_m{vertical-align: middle}
.vtc_t{vertical-align: top}
.vtc_b{vertical-align: bottom}

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

.align_end {
  align-items: flex-end !important;
}

.align_st {
  align-items: flex-start !important;
}

.align_str {
  align-items: stretch !important;
}

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

.fr {
  float: right
}

/*clear - both*/
.clear {
  clear: both;
}

/*flex-direction*/
.Fdt_col{flex-direction: column !important;}
.Fdt_row{flex-direction: row !important;}

/*justify-content*/
.jst_ct {
  justify-content: center !important;
}

.jst_btw {
  justify-content: space-between;
}

.jst_st {
  justify-content: flex-start !important;
}

.jst_end {
  justify-content: flex-end !important;
}

/*flex-direction*/
.fx_row {
  flex-direction: row;
}

.fx_col {
  flex-direction: column;
}

/*flex-wrap*/
.fx_nowrap {
  flex-wrap: nowrap
}

.fx_wrap {
  flex-wrap: wrap
}

/*background color*/
.bg_no {
  background-color: transparent !important;
}

.bg_bl {
  background-color: var(--Primary);
}

.bg_lgr {
  background-color: var(--gray-01);
}

/*font - color*/
.fc_wh {
  color: #fff;
}

.fc_bk {
  color: #000 !important;
}

.fc_bl {
  color: var(--Primary);
}

.fc_lb {
  color: var(--color-02) !important;
}

.fc_dg {
  color: var(--gray-09) !important;
}

.fc_gr {
  color: #667080 !important;
}

.fc_rd {
  color: var(--c-red) !important;
}

.fc-ord{
  color: var(--c-o-red);
}
.fc-grn{
  color: var(--c-green);
}
/*font-weight*/
.fw_light {
  font-weight: 300;
}

.fw_normal {
  font-weight: 500;
}

.fw_bold {
  font-weight: 700;
}

/*font-size*/
.fs_xs {
  font-size: 12px
}

.fs_sm {
  font-size: 14px
}

.fs_md {
  font-size: 16px
}

.fs_lg {
  font-size: 18px
}

.fs_xl {
  font-size: 20px
}
/*line-height*/
.lh-15{
  line-height:1.5;
}
.lh-13{
  line-height:1.3;
}
/**cursor**/
.cs_dt{
  cursor: default;
}
.cs_pt{
  cursor: pointer;
}

.hyperlink {
  color: #0454B2;
  text-decoration: underline;
  text-underline-offset: .1rem;
}

/**button**/
button {
  border: 0px;
  background: transparent
}

button span{
  font-size: 16px;
}

.reset-button {
  color: #000;
  display: inline-block;
  text-decoration: none;
}
.reset-button img{
  display: inline-block;
  vertical-align: middle;
}

.add-button,
.register-button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-width: 120px;
  padding: 13px 10px;
  background: var(--Primary);
  border: 1px solid var(--Primary);
  border-radius: 5px;
  color: #fff;
  font-size: 16px;
  text-decoration: none;
  text-align: center;
}

.register-button.xs {
  min-width: 60px;
  padding: 6px 0;
  white-space: nowrap;
}
.register-button.sm {
  width: auto;
  min-width: unset;
  padding: 13px 10px;
  white-space: nowrap;
}

.outline-button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-width: 120px;
  padding: 13px 10px;
  background: #fff;
  border: 1px solid var(--Primary);
  border-radius: 5px;
  color: var(--Primary);
  font-size: 16px;
  text-decoration: none;
}
.outline-button-gr {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-width: 120px;
  padding: 13px 10px;
  background: #fff;
  border: 1px solid var(--c-gray);
  border-radius: 5px;
  color: var(--c-gray);
  font-size: 16px;
  text-decoration: none;
}

.select-button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  padding: 0.5rem 2rem 0.3rem 1rem;
  background: url(../images/pin.svg) no-repeat 4.6rem center var(--Primary);
  border-radius: 5px;
  color: #fff;
  text-decoration: none;
}

.search-button {
  width: 24px;
  height: 24px;
  background: url('/images/main/search.svg') no-repeat center;
  position: absolute;
  top: 48%;
  right: 10px;
  transform: translate(0, -50%);
}

.search-keyword-section.open-popup-search .search-button {
  width: 24px;
  height: 24px;
  background: url('/images/find.svg') no-repeat center;
  background-size: 100%;
  position: absolute;
  top: 48%;
  right: 10px;
  transform: translate(0, -50%);
}

.search-keyword-section .cancel-button {
  width: 24px;
  height: 24px;
  background: url('/images/main/close_r.svg') no-repeat center transparent;
  position: absolute;
  top: 48%;
  right: 10px;
  transform: translate(0, -50%);
  min-width: unset;
  border: unset;
}

.search-keyword-section .cancel-button:hover {
  background: url('/images/main/close_r.svg') no-repeat center transparent;
  border: unset;
}

.download-button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-width: 120px;
  padding: 13px 10px;
  background: var(--c-green);
  border: 1px solid var(--c-green);
  border-radius: 5px;
  color: #fff;
  font-size: 16px;
  text-decoration: none;
  text-align: center;
}

.list-button.custom {
  width: auto !important;
  padding: 6px 10px;
  margin-bottom: 0.3rem;
  font-size: 15px;
}

.list-button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-width: 120px;
  padding: 13px 10px;
  background: var(--c-gray);
  border: 1px solid var(--c-gray);
  border-radius: 5px;
  color: #fff;
  font-size: 16px;
  text-decoration: none;
  text-align: center;
}
.cancel-button {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-width: 120px;
  padding: 13px 10px;
  background: var(--c-red);
  border: 1px solid var(--c-red);
  border-radius: 5px;
  color: #fff;
  font-size: 16px;
  text-decoration: none;
  text-align: center;
}

.cancel-button.sm {
  width: auto;
  min-width: unset;
  padding: 13px 10px;
  white-space: nowrap;
}
.pRedBtn {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-width: 120px;
  padding: 13px 10px;
  background: #FFE4E7;
  border: 1px solid #FFE4E7;
  border-radius: 5px;
  color: var(--gray-09);
  font-size: 16px;
  text-decoration: none;
  text-align: center;
}
.grayBtn {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-width: 120px;
  padding: 13px 10px;
  background: var(--gray-08);
  border: 1px solid var(--gray-08);
  border-radius: 5px;
  color: #fff;
  font-size: 16px;
  text-decoration: none;
  text-align: center;
}
.skyB-Btn {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-width: 120px;
  padding: 13px 10px;
  background: var(--color-02);
  border: 1px solid var(--color-02);
  border-radius: 5px;
  color: #fff;
  font-size: 16px;
  text-decoration: none;
  text-align: center;
}
.orange-Btn {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-width: 120px;
  padding: 13px 10px;
  background: #FF6B1A;
  border: 1px solid #FF6B1A;
  border-radius: 5px;
  color: #fff;
  font-size: 16px;
  text-decoration: none;
  text-align: center;
}
.yellow-Btn {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-width: 120px;
  padding: 13px 10px;
  background: #FFB11A;
  border: 1px solid #FFB11A;
  border-radius: 5px;
  color: #fff;
  font-size: 16px;
  text-decoration: none;
  text-align: center;
}
/*state button*/
.st-button{
  display: flex;
  align-items: center;
  justify-content: center;
  width: 90px;
  gap: 5px;
  padding: 11px 0 9px;
  border-radius: 5px;
  background-color: #f9f9f9;
  border: 1px solid var(--gray-08);
  color: var(--gray-08);
}

.st-button::before{
  content: '';
  display: block;
  width: 20px;
  height: 20px;
  margin-top: -3px;
  filter: invert(78%) sepia(15%) saturate(185%) hue-rotate(179deg) brightness(300%) contrast(82%);
}

.st-button.ready::before{
  background: url('../images/loading.svg')no-repeat center;
  background-size: 100%;
}
.st-button.active::before{
  background: url('../images/check-fill.svg')no-repeat center;
  background-size: 100%;
}
.st-button.inactive::before{
  background: url('../images/dash.svg')no-repeat center;
  background-size: 100%;
}
.st-button.block::before{
  background: url('../images/block-r.svg')no-repeat center;
  background-size: 100%;
  filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(50deg) brightness(116%) contrast(106%);
}

.st-button.on{
  background-color: #fff;
}

.st-button.ready.on{
  border: 1px solid #FFB11A;
  color: #FFB11A;
}
.st-button.ready.on::before{
  filter: invert(55%) sepia(53%) saturate(1200%) hue-rotate(362deg) brightness(129%) contrast(108%);
}
.st-button.active.on{
  border: 1px solid var(--color-02);
  color: var(--color-02);
}
.st-button.active.on::before{
  filter: invert(58%) sepia(49%) saturate(726%) hue-rotate(152deg) brightness(140%) contrast(95%);
}
.st-button.inactive.on{
  border: 1px solid #667080;
  color: #667080;
}
.st-button.inactive.on::before{
  filter: invert(49%) sepia(11%) saturate(571%) hue-rotate(178deg) brightness(86%) contrast(94%);
}
.st-button.block.on{
  border: 1px solid #EA4B4B;
  color: #EA4B4B;
}
.st-button.block.on::before{
  filter: unset;
}
/*filter button*/
.ft-button{
  display: flex;
  width: 48px;
  height: 48px;
  align-items: center;
  border: 1px solid var(--color-02);
  border-radius: 5px;
  background: url('../images/outline_filter.svg') no-repeat center var(--white);
}
.ft-button.open{
  background: url('../images/outline_filter_w.svg') no-repeat center var(--color-02);
}

.register-button,
.outline-button,
.outline-button-gr,
.cancel-button,
.download-button,
.list-button,
.pRedBtn,
.grayBtn,
.skyB-Btn,
.orange-Btn,
.yellow-Btn{
  width: 100%;
}

.more_btn_box {
  width: 100%;
  text-align: center;
}

.more_btn_box a.more_btn {
  display: block;
  margin: 0 1rem 1rem;
  padding: .5rem 0;
  background: #f7f7f7;
  border-radius: 5px;
  text-decoration: none;
  color: #000;
}

.more_btn_box a.more_btn img,
.more_btn_box a.more_btn span {
  vertical-align: middle;
}

.manualBtn {
  display: inline-block;
  padding: 12px 2.5rem 10px 1rem;
  background: #FFEECC url('/images/material-symbols_menu-book-outline-rounded.svg') no-repeat 90% center;
  border-radius: 50px;
  text-decoration: none;
  color: #FF9900;
  font-size: 15px;
}

.light-yellow-Btn {
  display: inline-block;
  padding: 12px 1rem 10px;
  background-color: #FFEECC;
  border-radius: 50px;
  text-decoration: none;
  color: #FF9900;
  font-size: 15px;
}

button.name_order_btn {
  display: inline-block;
  padding: 10px;
  background-color: #fff;
  border: 1px solid var(--color-02);
  border-radius: 100px;
  color: var(--color-02);
  font-weight: 700;
  text-decoration: none;
}

button.name_order_btn img {
  margin-left: .5rem;
  vertical-align: -2px;
}

button.Before_btn {
  display: inline-block;
  min-width: 100px;
  padding: 8px 8px 7px;
  background: #667080;
  color: #fff;
  border-radius: 50px
}

button.Before_btn img {
  width: 15px;
  margin-right: 3px;
  vertical-align: middle
}

.IconBtn {
  display: inline-block;
  width: 35px;
  min-width: 35px;
  height: 35px;
  border-radius: 50px;
  background-color: var(--Primary);
  text-indent: -99999px;
}

.IconBtn.add {
  background: url('/images/plus.svg') no-repeat center var(--c-green);
  background-size: 70%;
}

.IconBtn.userEdit {
  background: url('/images/user-edit.svg') no-repeat center var(--c-green);
  background-size: 70%;
}

.IconBtn.delete {
  background: url('/images/delete.svg') no-repeat center #EA4B4B;
  background-size: 60%;
}

.IconBtn.delete2 {
  background: url('../images/delete2.svg') no-repeat center #FFE7E7;
}

.IconBtn.share {
  width: 35px;
  min-width: 35px;
  height: 35px;
  background: url('/images/dcp/mydata/share.svg') no-repeat center #FFE7C2;
}

.IconBtn.list {
  width: 35px;
  min-width: 35px;
  height: 35px;
  background: url('/images/dcp/mydata/list.svg') no-repeat center #FFE4FE;
}

.IconBtn.listBlue {
  width: 35px;
  min-width: 35px;
  height: 35px;
  background: url('/images/dcp/mydata/listBlue.svg') no-repeat center #e2f3ff;
}

.IconBtn.download {
  width: 35px;
  min-width: 35px;
  height: 35px;
  background: url('/images/dcp/mydata/download.svg') no-repeat center #D9F6E6;
}

.IconBtn.download.blue {
  width: 35px;
  min-width: 35px;
  height: 35px;
  background: url('/images/dcp/mydata/download_b.svg') no-repeat center #DCF6FF;
}

.IconBtn.save {
  width: 35px;
  min-width: 35px;
  height: 35px;
  background: url('/images/dcp/mydata/save.svg') no-repeat center #D9F6E6;
}

.IconBtn.more {
  width: 35px;
  min-width: 35px;
  height: 35px;
  background: url('/images/dcp/mydata/more.svg') no-repeat center #DADEEA;
}
.IconBtn.up,
.IconBtn.down{
  position: relative;
}
.IconBtn.up:hover,
.IconBtn.down:hover{
  background-color: #044591;
}

.IconBtn.down::after {
  content: '';
  display: block;
  width: 35px;
  height: 35px;
  background: url('/images/chevron-down.svg') no-repeat center;
  filter: invert(98%) sepia(2%) saturate(0%) hue-rotate(319deg) brightness(210%) contrast(100%);
  background-size: 70%;
  position: absolute;
  top: 0;
}

.IconBtn.up::after {
  content: '';
  display: block;
  width: 35px;
  height: 35px;
  background: url('/images/chevron-down.svg') no-repeat center;
  filter: invert(98%) sepia(2%) saturate(0%) hue-rotate(319deg) brightness(210%) contrast(100%);
  background-size: 70%;
  transform: rotate(180deg);
  position: absolute;
  top: 0;
}

.label-box button{
  min-width: 70px;
  padding: 10px 10px 8px;
}

.IconBtn.icon-sm {
  width: 25px;
  min-width: 25px;
  height: 25px;
}

.detail-button {
  display: inline-block;
  width: 36px;
  height: 36px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("/images/dcp/mydata/detail-button.svg");
}
.link-button {
  display: inline-block;
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("/images/dcp/mydata/link-button.svg") ;
}
.download-ico-btn {
  display: inline-block;
  width: 24px;
  height: 24px;
  background-repeat: no-repeat;
  background-position: center;
  background-image: url("/images/dcp/mydata/download_b.svg");
}
.info-icon {
  display: inline-block;
  width: 14px;
  height: 14px;
  background-image: url('/css/images/portal/component/icon/ico_information.svg');
  background-size: contain;
  background-repeat: no-repeat;
  margin-right: 2px;
  vertical-align: bottom;
}

/*button - hover*/
.register-button:hover {
  background: #044591;
  border: 1px solid #044591;
}
.outline-button:hover {
  background: var(--hover-color);
}
.cancel-button:hover {
  background: #b90000;
  border: 1px solid #b90000;
}
.pRedBtn:hover {
  background: #ffced5;
  border: 1px solid #ffced5;
}
.grayBtn:hover {
  background: #949aa2;
  border: 1px solid #949aa2;
}
.skyB-Btn:hover {
  background: #23b5e5;
  border: 1px solid #23b5e5;
}
.download-button:hover {
  background: #00a44b;
  border: 1px solid #00a44b;
}
.orange-Btn:hover{
  background: #f35600;
  border: 1px solid #f35600;
}

.yellow-Btn:hover{
  background: #ffa51a;
  border: 1px solid #ffa51a;
}

.list-button:hover {
  background: #585f6b;
  border: 1px solid #585f6b;
}
button.name_order_btn:hover{
  background: var(--color-02);
  color: #fff;
}
button.name_order_btn:hover img{
  filter: invert(100%) sepia(0%) saturate(0%) hue-rotate(136deg) brightness(330%) contrast(102%);
}

/** Box **/
.rowBox {
  display: flex;
  flex-direction: row;
  width: 100%;
}

.rowBox.btnBox {
  justify-content: flex-end;
}

.rowBox.btnBox a {
  margin-right: .5rem;
}

.rowBox.btnBox a:last-child {
  margin-right: 0;
}

.cellBox {
  display: flex;
  flex-direction: column;
  width: 100%;
}

.cellBox.left {
  margin-right: .5rem;
}

.cellBox.right {
  margin-left: .5rem;
}

.item-box-group {
  display: flex;
  flex-direction: column;
  gap: 1.5rem;
}

.item-box {
  display: flex;
  flex-direction: column;
  width: 100%;
  /*margin-bottom: 1rem;*/
}

.item-horizontal-box {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
}

.button-item-box{
  display: flex;
  flex-direction: row;
  align-items: flex-end;
  flex-wrap: wrap;
  gap: 10px;
  width: 100%;
}

.chip-item-box{
  display: flex;
  flex-direction: row;
  align-items: flex-start;
  width: 100%;
  gap: 10px;
  flex-wrap: wrap;
}

.button-box {
  display: flex;
  width: 100%;
  /* TODO [김언중] : 버튼 하단에 고정시 주석 해제 */
  /*padding-top: .5rem;*/
  flex-direction: column;
  gap: 10px;
  text-align: right;
}

.input-section-group{
  display: flex;
  flex-direction: column;
  gap: 10px;
  /* TODO [김언중] : 버튼 하단에 고정시 주석 해제 */
  /*height: calc(100% - 96px - 42px);*/
  /*overflow-y: auto;*/
}

/*border*/
.border-box{
  border: 1px solid var(--gray-04);
}
.border-bt{
  border-bottom: 1px solid var(--gray-04);
}
.bd-1-line-bg{
  border: 1px solid #D7DDEF;
}
/*box shadow*/
.bsd-bg{
  box-shadow: 3px 3px 4px 0px rgba(45, 59, 131, 0.25);
}

/*detail page*/

/*sub title font style*/
.formSubTitle {
  font-size: 1.5em;
  color: #000;
}

/** form **/
select:focus:focus,
input:focus,
input.input_style:focus,
textarea.textarea_style:focus,
.explain-textarea:focus,
.download-icon-btn:focus,
.download-icon-btn:active,
.download-icon-btn:hover{
  outline: 2px solid #badaff;
}

.textarea_style:read-only,
.explain-textarea:read-only,
.input_style:read-only,
.text-input:read-only{
  cursor: default;
  outline: 2px solid transparent !important;
}

.input_disable,
.textarea_disable,
.select_disable,
.input_disable:read-only,
.textarea_disable:read-only,
.select_disable:read-only,
.textarea_style:disabled,
.explain-textarea:disabled,
.input_style:disabled,
.text-input:disabled{
  background: #f8f8f8;
  border: 1px solid var(--gray-05);
  opacity: .9;
  cursor: default;
}

.input_disable:focus,
.textarea_disable:focus,
.select_disable:focus{
  outline: 2px solid transparent !important;
}


/*label*/
label {
  display: block;
  color: #667080;
  margin-bottom: .3rem;
}

.search-section label{
  display: block;
  color: #667080;
  margin-bottom: 0;
}

.label {
  display: block;
  color: #667080;
  margin-bottom: .3rem;
}

label span{
  margin-left: 10px;
}

.label-box {
  display: flex;
  justify-content: space-between;
  align-items: flex-start;
  margin: 0 0 0.2rem;
  flex-direction: column;
}

.title-label {
  display: block;
  color: #667080;
  margin-bottom: 0.3rem;
}
.radio-label {
  display: block;
  margin: 0.5rem 1rem;
  color: #000;
  line-height: 0;
}

/*input*/
.inputBox {
  width: calc(100% - 20px);
  margin: .8rem 0;
}

input.input_style {
  width: 100%;
  padding: 13px 10px 11px;
  border: 1px solid var(--gray-07);
  border-radius: 5px;
}

.input_style {
  width: 100%;
  padding: 13px 10px 11px;
  border: 1px solid var(--gray-07);
  border-radius: 5px;
}

.text-input {
  /*width: 100%;*/
  padding: 12px 10px;
  border: 1px solid var(--gray-07);
  border-radius: 5px;
}

/*textarea*/
.textareaBox {
  width: 100%;
  margin: .8rem 0;
}

.textarea_style {
  width: calc(100% - 20px);
  height: 6.25em;
  padding: 10px;
  border: 1px solid var(--gray-07);
  border-radius: 5px;
  resize: none;
  line-height: 1.4;
}
.explain-textarea {
  height: 6.25em;
  padding: 10px;
  border: 1px solid var(--gray-07);
  border-radius: 5px;
  resize: none;
  line-height: 1.4;
}
.table-textarea{
  width: 100%;

  padding: 10px;
  border: 1px solid var(--gray-07);
  border-radius: 5px;
  resize: none;
  line-height: 1.4;
}

/*value-text*/
.value-txt{
  margin-top: 5px;
  padding: 10px 5px;
  border-top: 1px solid var(--gray-02);
  line-height: 1.3;
}

/*toggleSwitch*/
.toggleBtnBox{
  display: flex;
  align-items: center;
}
.toggleSwitch {
  width: 38px;
  height: 25px;
  display: block;
  position: relative;
  border-radius: 30px;
  background-color: var(--gray-04);
  cursor: pointer;
}
.toggleSwitch .toggleButton {
  width: 21px;
  height: 21px;
  margin-left: 0;
  position: absolute;
  top: 50%;
  left: 3px;
  transform: translateY(-50%);
  border-radius: 50%;
  background: #858D99;
}

#toggle:checked ~ .toggleSwitch .toggleButton {
  left: calc(100% - 24px);
  background: #5864FF;
}

.toggleSwitch, .toggleButton {
  transition: all 0.2s ease-in;
}

/**select**/
select.select {
  min-width: 100%;
  padding: 14px 30px 13px 10px;
  border: 1px solid var(--gray-07);
  background: url('../images/under_arrow.svg') no-repeat calc(100% - 10px) 50% #fff;
  border-radius: 5px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  text-overflow: ellipsis;
}
.select.open {
  background: none;
  background-color: #fff;
}
select.select option {
  padding: 1rem;
  background-color: #fff;
}
select.select:disabled{
  background: url('../images/under_arrow.svg') no-repeat calc(100% - 10px) 50% #f8f8f8;
  border: 1px solid var(--gray-05);
  opacity: .9;
}
.selectBox select {
  padding: 12px 10px 10px;
  border: 1px solid var(--gray-07);
  background: url('/images/under_arrow.svg') no-repeat calc(100% - 10px) 50% #fff;
  border-radius: 5px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}

.list-count-select {
  width: 120px;
  padding: 8px 10px 6px 15px;
  border: 1px solid var(--gray-03);
  background: url('../images/chevron-down.svg') no-repeat calc(100% - 10px) 50% var(--gray-03);
  border-radius: 50px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  color: #667080;
  margin-bottom: 10px;
}

.list-count-select option {
  padding: 1rem;
}

/*radio*/
.radioBox{
  width: 100%;
}
.radioBox .label{
  margin-bottom: 0.3rem;
  font-size:1em;
  color:#667080;
}
.radioBox .radioGroup{
  display: flex;
  align-items: center;
  padding: 3.5px 10px;
  gap: 1rem;
}
.radioBox label{
  display:block;
  margin:.5rem 1rem;
  color:  #667080;
  line-height: 0;
}
.radioBox label:first-child{
  margin-left:0;
}
.radioBox input{
  margin: 0;
  vertical-align: middle;
}
.radioBox input:checked {
  color: #0075ff;
}

/*checkBox*/
.chkItem label{
  margin: 0;
}
input[type="checkbox"].chkBtn + label{
  display: inline-flex;
  align-items: center;
}

input[type="checkbox"].chkBtn + label span{
  margin-top: 3px;
}

input[type="checkbox"].chkBtn{
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  border: 0;
}

input[type="checkbox"].chkBtn + label:before{
  content: "";
  display: block;
  width: 20px;
  height: 20px;
  margin-right: 5px;
  text-align: center;
  background: url('/images/Checkbox_off.svg')no-repeat;
  background-size: 100%;
  box-sizing: border-box;
  border-radius: 5px;
}
input[type="checkbox"].chkBtn:checked + label{
  color: #0455b2;
}
input[type="checkbox"].chkBtn:checked + label:before{
  background: url('/images/Checkbox_b.svg')no-repeat;
  background-size: 100%;
}

input[type="checkbox"].chkBtn.bgBlue:checked + label:before{
  background: url('/images/Checkbox_on.svg')no-repeat;
  background-size: 100%;
}

/* date picker */
.custom-date-picker{
  display: flex;
  align-items: center;
  flex-direction: column;
}
/*input*/
.sbux-pik-group{
  width: 100%;
  margin: 0;
}

input.sbux-pik-input{
  height: 44px !important;
  padding: 13px 10px 11px;
  font-weight: 500;
  font-size: 15px !important;
}

.sbux-pik-input:hover {
  border-color: var(--gray-07) !important;
}
.sbux-pik-input:hover + .sbux-pik-icon-span button{
  border-color: var(--gray-07) !important;
}

.sbux-pik-input:focus{
  box-shadow: -2px -2px 0px 0px #badaff, 0px 2px 0px 0px #badaff !important;
}

input.sbux-pik-input{
  height: 44px !important;
  padding: 13px 10px 11px;
}

.sbux-pik-input.sbux-dirty{
  background: unset !important;
  border-color: #d3d3d3 !important;
  color: #222 !important;
  font-size: 15px !important;
}

/*button*/
.sbux-pik-icon-span button:focus{
  outline: 0px;
}

.sbux-pik-icon-span button.sbux-pik-icon-btn{
  height: 44px !important;
}

.sbux-pik-input:focus +  .sbux-pik-icon-span button{
  outline: 2px solid #badaff;
  box-shadow: -2px -2px 0px 0px #badaff, 2px 2px 0px 0px #badaff !important;
}

.sbux-pik-icon-span button{
  padding: 15px 10px;
  height: 46px;
}

input.sbux-pik-input.sbux-dirty + ul.sbux-ddl-menu + .sbux-pik-icon-span .sbux-pik-icon-btn,
input.sbux-pik-input.sbux-dirty + .sbux-pik-icon-span .sbux-pik-icon-btn{
  background: var(--Primary) !important;
  border-color: var(--Primary) !important;
}
/*calendar*/
.sbux-pik-popwrap{
  border-radius: 5px;
  border: 1px solid var(--gray-05);
  background: #fff !important;
}

.sbux-pik-popwrap .sbux-pik-pop-body{
  background: #fff !important;
  border-bottom: 1px solid var(--gray-02);
}

.sbux-pik-popwrap .sbux-pik-pop-body:after{
  background-color: #fff !important;
  height: 38px !important;
  border-bottom: 1px solid var(--gray-02);
}

table.sbux-pik-pop-year thead th,
table.sbux-pik-pop-month thead th{
  padding: 6px 0 15px;
}

table.sbux-pik-pop-day thead th {
  padding: 5px;
}

table.sbux-pik-pop-year thead th strong,
table.sbux-pik-pop-month thead th strong,
table.sbux-pik-pop-day thead th strong{
  font-size: 14px !important;
}

table.sbux-pik-pop-month thead th button,
table.sbux-pik-pop-year thead th button,
table.sbux-pik-pop-day thead th button{
  color: var(--Primary) !important;
}

table.sbux-pik-pop-day tbody td button{
  color: #444 !important;
}

table.sbux-pik-pop-day tbody td.sbux-pik-saturday span{
  color: var(--Primary) !important;
}

table.sbux-pik-pop-day tbody td.sbux-pik-saturday .sbux-pik-text-muted span{
  color: var(--Tertiary) !important;
}

table.sbux-pik-pop-day tbody td.sbux-pik-saturday button.active span{
  color: #fff !important;
}

table.sbux-pik-pop-day tbody td.sbux-pik-sunday span{
  color: #ff0000 !important;
}

table.sbux-pik-pop-day tbody td.sbux-pik-sunday .sbux-pik-text-muted span{
  color: #ffbbbb !important;
}

table.sbux-pik-pop-day tbody td.sbux-pik-sunday button.active span{
  color: #fff!important;
}

table.sbux-pik-pop-day tbody td button span{
  display: block;
  padding-top: 3px;
}

table.sbux-pik-pop-month tbody td button:hover,
table.sbux-pik-pop-year tbody td button:hover,
table.sbux-pik-pop-year tbody td button:focus,
table.sbux-pik-pop-year tbody td button:hover,
table.sbux-pik-pop-day tbody td button:hover{
  background-color: var(--hover-color) !important;
  color: var(--Primary) !important;
  border-radius: 5px;
}

table.sbux-pik-pop-month tbody td button.sbux-btn.sbux-btn-secondary:hover,
table.sbux-pik-pop-day tbody td button.sbux-btn.sbux-btn-secondary:hover{
  background-color: var(--hover-color) !important;
}

table.sbux-pik-pop-day tbody td.sbux-pik-sunday button:hover span{
  color: #ff0000 !important;
}

table.sbux-pik-pop-month tbody td button.active,
table.sbux-pik-pop-year tbody td button.active,
.sbux-pik-popwrap .sbux-pik-pop-body .sbux-pik-now.active,
table.sbux-pik-pop-day tbody td button.sbux-btn-secondary.active{
  background-color: var(--Primary) !important;
  color: #fff !important;
}

table.sbux-pik-pop-month tbody td button.sbux-btn.sbux-btn-secondary:hover{
  background: #0455B2 !important;
}

.sbux-pik-popwrap .sbux-pik-pop-body .sbux-pik-now.active,
table.sbux-pik-pop-year tbody td button.sbux-pik-today.active,
table.sbux-pik-pop-day tbody td button.sbux-pik-today.active{
  background-color: #26C5F8 !important;
}

table.sbux-pik-pop-month tbody td button:hover span,
table.sbux-pik-pop-year tbody td button:hover span,
table.sbux-pik-pop-day tbody td button:hover span{
  color: var(--Primary) !important;
}

table.sbux-pik-pop-year tbody td button.active:hover span,
table.sbux-pik-pop-month tbody td button.active:hover span,
table.sbux-pik-pop-year tbody td button.sbux-pik-today.active:hover span,
table.sbux-pik-pop-day tbody td button.sbux-pik-today.active:hover span{
  color: #fff !important;
}

table.sbux-pik-pop-day tbody td .sbux-pik-text-muted{
  color: var(--gray-07) !important;
}

.sbux-pik-popwrap .sbux-pik-pop-body .sbux-pik-dow{
  color:var(--gray-09) !important;
}

.sbux-pik-pop-showbar{
  border-top: 0px !important;
}

.sbux-pik-pop-showbar .sbux-pik-btn-today{
  background-color: var(--Primary) !important;
}

.sbux-pik-pop-showbar .sbux-pik-btn-clear{
  background-color: #EA4B4B !important;
}

/* filter checkBox Button */
.checkBoxFilter{
  width: 100%;
}
.checkBoxFilter .chkBoxList{
  width: calc(100% - 10px);
  padding: 5px;
  background-color:var(--gray-01) !important;
  border-radius: 5px;
}
.checkBoxFilter .chkBoxList label{
  min-width: auto;
  padding: 10px;
  margin: 5px;
  background-color: #fff;
  border-radius: 5px;
}
.checkBoxFilter .chkBoxList input:checked + label{
  background-color: var(--Primary) !important;
  color: #fff;
}

/*list Box filter*/
.listFilterBox{
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
.listFilterBox .selectBox select {
  width: 140px;
  padding: 8px 10px 6px 15px;
  border: 1px solid var(--gray-03);
  background: url('../images/chevron-down.svg') no-repeat calc(100% - 10px) 50% var(--gray-03);
  border-radius: 50px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  color: #667080;
}

.listFilterBox .chkItem{
  display: inline-block;
  margin: 0 10px;
}


/**keyword searchBox**/
.search-section {
  display: flex;
  flex-direction: column;
  background: #fff;
  border-radius: 5px;
  position: relative;
  width: 100%;
  z-index: 4 !important;
}

.search-section .inner {
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
  align-items: center;
  margin: 10px;
  row-gap: 10px;
}

.search-section .left {
  display: flex;
  width: 100%;
  gap: 10px;
  flex-direction: column;
}

.search-section .right {
  display: flex;
  align-items: center;
  flex-direction: column;
  justify-content: flex-end;
  width: 100%;
  row-gap: 10px;
}

.search-keyword-section {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  width: 100%;
  position: relative;
}

.search-keyword-section .keyword-input {
  width: 100%;
  padding: 12px 34px 12px 10px;
  border: 1px solid var(--gray-07);
  border-radius: 5px;
}

.search-keyword-section span.sbux-uuid-txtSearchKeyword{
  width: 100%;
}

.search-summary {
  margin: 1rem 0;
}

.search-summary .count {
  color: var(--color-02);
  font-weight: 700;
}

/**table**/
.table-list {
  width: 100%;
  background: #fff;
  position: relative;
  margin-bottom: 30px;
}

.table-list .table-inner {
  overflow-x: auto;
}

.table-list.mh-px .table-inner {
  min-height: 120px;
}

.table-list table:not(.sbux-pik-date table) {
  width: 100%;
  min-width: 1000px;
  margin: 0;
  border-collapse: separate;
  border-spacing: 0;
}
.min0{
  min-width: auto !important;
}
.table-list table caption {
  position: absolute;
  font-size: 0;
  left: -99999px;
}

.table-list table thead th:not(.sbux-pik-date th) {
  padding: 1rem 1rem .8rem;
  font-size: 1.1em;
  text-align: center;
  background: var(--gray-03);
  border-top: 1px solid var(--gray-04);
  border-bottom: 1px solid var(--gray-04);
  position: sticky;
  top: 0;
  z-index: 1;
}

.table-list table tbody tr td:not(.sbux-pik-date td) {
  padding: 1.1rem 1rem .9rem;
  border-top: 0;
  border-bottom: 1px solid var(--gray-04);
  background: #fff;
  text-align: center;
  overflow: hidden;
  vertical-align: middle;
}

.table-list table tbody td:first-child:not(.sbux-pik-date td) {
  border-left: 0px;
}

.table-list table tbody td:last-child:not(.sbux-pik-date td) {
  border-right: 0px;
}

.table-list table tbody tr:hover td:not(.sbux-pik-date td) {
  background: var(--hover-color);
}

.table-list table tbody.eqpmnt tr td {
  max-width: 289px;
}

/*table - checkBox list*/
.table-list.checkBox-list{
  width: 100%;
  height: 400px;
  border-bottom: 1px solid var(--gray-04);
  background: #fff;
  overflow-y: auto;
  position: relative;
}
.table-list.checkBox-list td{
  padding: 10px;
  text-align: center;
  overflow: hidden;
  vertical-align: middle;
}
.table-list.checkBox-list .selectBox,
.table-list.checkBox-list .inputBox,
.table-list.checkBox-list .selectBox label,
.table-list.checkBox-list .inputBox label{
  margin: 0;
}
.table-list.checkBox-list .inputBox{
  width: 100%;
}

.table-list.checkBox-list .selectBox select{
  width: calc(100% - 10px);
}
.table-list.checkBox-list .multiple_selectBox .selectBox {
  display: inline-block;
  width: 48%;
}
/*table - tree list*/
.table-list .child-02 td:nth-child(2){
  padding-left: 30px;
}
.table-list .child-03 td:nth-child(2){
  padding-left: 60px;
}
.table-list .child-04 td:nth-child(2){
  padding-left: 90px
}
/*table - tbody th*/
.table-list.tbodyTh tbody th:not(.sbux-pik-date th),
.table-list.tbodyTh tbody td:not(.sbux-pik-date td){
  padding: 1rem 1rem .8rem;
  font-size: 1.1em;
  text-align: center;
  border-top: 1px solid var(--gray-04);
  border-bottom: 0px;
}
.table-list.tbodyTh tbody tr:last-child th:not(.sbux-pik-date th),
.table-list.tbodyTh tbody tr:last-child td:not(.sbux-pik-date td){
  border-bottom: 1px solid var(--gray-04);
}
.table-list.tbodyTh tbody th:not(.sbux-pik-date th){
  background: var(--gray-03);
  color:var(--black);
}
.table-list.tbodyTh tbody th label{
  color:var(--black);
}
.table-list.tbodyTh table tbody tr:hover td:not(.sbux-pik-date td){
  background-color: transparent;
}
/*pagination*/
.pagination {
  margin: 0;
  padding: 0;
  text-align: center
}

.pagination li {
  display: inline;
  margin:0 3px;
}

.pagination li a {
  display: inline-block;
  text-decoration: none;
  width: 34px;
  padding: 12px 0 8px;
  color: #000;
  border-radius: 50%;
  vertical-align: middle;
  background-color: #fff;
}

.pagination li a.first_page,
.pagination li a.disabled_first_page,
.pagination li a.disabled_prev_page,
.pagination li a.prev_page,
.pagination li a.next_page,
.pagination li a.disabled_next_page,
.pagination li a.last_page,
.pagination li a.disabled_last_page {
  text-indent: -9999px;
}

.pagination li a.disabled_first_page {
  background: url('/images/chevron-double-left_n.svg') no-repeat center;
  cursor: default;
}

.pagination li a.first_page {
  background: url('/images/chevron-double-left.svg') no-repeat center;
}

.pagination li a.disabled_prev_page {
  background: url('/images/chevron-left_n.svg') no-repeat center;
  cursor: default;
}

.pagination li a.prev_page {
  background: url('/images/chevron-left.svg') no-repeat center;
}

.pagination li a.next_page {
  background: url('/images/chevron-right.svg') no-repeat center;
}

.pagination li a.disabled_next_page {
  background: url('/images/chevron-right_n.svg') no-repeat center;
  cursor: default;
}

.pagination li a.last_page {
  background: url('/images/chevron-double-right.svg') no-repeat center;
}

.pagination li a.disabled_last_page {
  background: url('/images/chevron-double-right_n.svg') no-repeat center;
  cursor: default;
}

.pagination li a.active {
  background-color: var(--Primary);
  color: #fff;
  cursor: default;
}

.pagination li a:hover:not(.active) {
  background-color: var(--gray-05);
}



/*modal*/
.viewOfModal {
  display: none;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.8);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 100;
}

.viewOfModal .modal_content {
  width: 1000px;
  height: 300px;
  background: #fff;
  border-radius: 10px;
  box-sizing: border-box;
  position: relative;
  top: 50%;
  right: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
}

.Inform.warning .modal_button button{
  min-width: 100px;
}


.custom_modal_typeC.sbux-mol-wrap{
  width: 100%;
  height: 100%;
  margin: 0 auto;
  left: 0;
  top: 0;
  right: 0;
  bottom: 0;
}

.custom_modal_typeA .sbux-mol-dlg,
.custom_modal_typeB .sbux-mol-dlg{
  height: auto !important;
  border-radius: 10px;
  overflow: hidden;
}

.custom_modal_typeC .sbux-mol-dlg{
  width: 280px !important;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  border-radius: 10px;
  overflow: hidden;
}

.custom_modal_typeA.over-visi .sbux-mol-dlg,
.custom_modal_typeB.over-visi .sbux-mol-dlg,
.custom_modal_typeC.over-visi .sbux-mol-dlg{
  overflow: visible;
}

.custom_modal_typeA .sbux-mol-cont .sbux-mol-hd,
.custom_modal_typeB .sbux-mol-cont .sbux-mol-hd{
  background-color: var(--Primary) !important;
  border: 1px solid var(--Primary) !important;
  border-radius: 10px 10px 0 0 !important;
}
.custom_modal_typeC .sbux-mol-cont .sbux-mol-hd{
  display: none;
}
.custom_modal_typeB .sbux-mol-cont .sbux-mol-hd .sbux-mol-hd-close,
.custom_modal_typeA .sbux-mol-cont .sbux-mol-hd .sbux-mol-hd-close{
  width: 24px;
  height: 24px;
  font-size: 24px !important;
  line-height: 1.2;
  top: 46% !important;
}
.custom_modal_typeA .sbux-mol-cont,
.custom_modal_typeB .sbux-mol-cont{
  background-color: #EEF1F4 !important;
  border-radius: 10px !important;
}
.custom_modal_typeC .sbux-mol-cont{
  background-color: #fff !important;
}
.custom_modal_typeA .sbux-mol-cont .sbux-mol-hd .sbux-mol-hd-txt,
.custom_modal_typeB .sbux-mol-cont .sbux-mol-hd .sbux-mol-hd-txt,
.custom_modal_typeC .sbux-mol-cont .sbux-mol-hd .sbux-mol-hd-txt{
  display: block;
  margin-top:4px !important;
  font-size: 20px !important;
  font-weight: 700;
  line-height: 1 !important;
}
.custom_modal_typeA .sbux-mol-cont .sbux-mol-bd,
.custom_modal_typeB .sbux-mol-cont .sbux-mol-bd{
  padding: 10px !important;
  background-color: #EEF1F4 !important;
  border-radius: 10px !important;
}

.custom_modal_typeA.p0 .sbux-mol-cont .sbux-mol-bd,
.custom_modal_typeB.p0 .sbux-mol-cont .sbux-mol-bd{
  padding: 0px !important;
}

.custom_modal_typeC .sbux-mol-cont .sbux-mol-bd{
  background-color: #fff !important;
}

.Data_mgmt .custom_modal_typeA .sbux-mol-cont .sbux-mol-bd .table-list .table-inner,
.Data_mgmt .custom_modal_typeB .sbux-mol-cont .sbux-mol-bd .table-list .table-inner{
  min-height: unset;
}

.custom_modal_typeA .msgPopup,
.custom_modal_typeB .msgPopup{
  padding: 10px;
  background-color: #fff;
  border-radius: 5px;
}
.custom_modal_typeC .sbux-mol-cont .Inform img.warning_red,
.custom_modal_typeC .sbux-mol-cont .Inform.warning img.warning_blue{
  display: none;
}
.custom_modal_typeC .sbux-mol-cont .Inform img.warning_blue,
.custom_modal_typeC .sbux-mol-cont .Inform.warning img.warning_red{
  display: block;
}
.custom_modal_typeA .sbux-mol-cont .sbux-mol-ft{
  margin: 0 !important;
  border: 0 !important;
  padding-top: 10px !important;
}
.custom_modal_typeB .sbux-mol-cont .sbux-mol-ft{
  display: none !important;
}
.custom_modal_typeB .sbux-mol-cont .sbux-custom-ft{
  margin: 0 !important;
  border: 0 !important;
  padding: 10px 0 0!important;
  text-align: center;
}
.custom_modal_typeC .sbux-mol-cont .sbux-mol-ft{
  display: none;
}
.custom_modal_typeA .sbux-mol-ft .sbux-btn,
.custom_modal_typeB .sbux-custom-ft .sbux-btn,
.custom_modal_typeC .sbux-mol-ft .sbux-btn{
  display: inline-block;
  min-width: 120px;
  padding: 13px 0 11px;
  background: var(--gray-07);
  border-radius: 5px;
  border: 1px solid var(--gray-07);
  color: #fff;
  font-size: 16px;
  text-decoration: none;
  text-align: center;
}

/*모달*/
.sbux-mol-dlg{
  width: 95% !important;
}
.sbux-mol{
  overflow-y: hidden !important;
}
.sbux-mol-bd{
  max-height: 760px;
  overflow-y: auto;
  overflow-x: hidden;
}

/****modal end****/

/*map*/
.map-tooltip{
  padding: 12px 10px 10px;
  border-radius: 10px;
  background-color: #fff;
  margin-bottom: 1.5rem;
  border: 1px solid #3B95FF;
  color: #3B95FF;
  font-weight: 700;
  position: relative;
  cursor: default;
}
.map-tooltip::before{
  content: '';
  display: block;
  width: 0;
  height: 0;
  border-bottom: 0px solid transparent;
  border-top: 10px solid #3B95FF;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  position: absolute;
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 0;
}
.map-tooltip::after{
  content: '';
  display: block;
  width: 0;
  height: 0;
  border-bottom: 0px solid transparent;
  border-top: 10px solid #fff;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  position: absolute;
  bottom: -8px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
}

.map-tooltip-r{
  padding: 12px 10px 10px;
  border-radius: 10px;
  background-color: #fff;
  margin-bottom: 1.5rem;
  border: 1px solid var(--c-red);
  color: var(--c-red);
  font-weight: 700;
  position: relative;
  cursor: default;
}
.map-tooltip-r::before{
  content: '';
  display: block;
  width: 0;
  height: 0;
  border-bottom: 0px solid transparent;
  border-top: 10px solid var(--c-red);
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  position: absolute;
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 0;
}
.map-tooltip-r::after{
  content: '';
  display: block;
  width: 0;
  height: 0;
  border-bottom: 0px solid transparent;
  border-top: 10px solid #fff;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  position: absolute;
  bottom: -8px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
}
/**통합모니터링 picker**/
.map-tooltip-b{
  padding: 12px 10px 10px;
  border-radius: 10px;
  background-color: #fff;
  margin-bottom: 1.5rem;
  border: 1px solid #667080;
  color: #667080;
  font-weight: 700;
  position: relative;
  cursor: default;
}
.map-tooltip-b::before {
  content: '';
  display: block;
  width: 0;
  height: 0;
  border-bottom: 0px solid transparent;
  border-top: 10px solid #667080;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  position: absolute;
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 0;
}
.map-tooltip-b::after{
  content: '';
  display: block;
  width: 0;
  height: 0;
  border-bottom: 0px solid transparent;
  border-top: 10px solid #fff;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  position: absolute;
  bottom: -8px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
}
.map-tooltip-g{
  padding: 12px 10px 10px;
  border-radius: 10px;
  background-color: #fff;
  margin-bottom: 1.5rem;
  border: 1px solid var(--c-green);
  color: var(--c-green);
  font-weight: 700;
  position: relative;
  cursor: default;
}
.map-tooltip-g::before {
  content: '';
  display: block;
  width: 0;
  height: 0;
  border-bottom: 0px solid transparent;
  border-top: 10px solid var(--c-green);
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  position: absolute;
  bottom: -10px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 0;
}
.map-tooltip-g::after{
  content: '';
  display: block;
  width: 0;
  height: 0;
  border-bottom: 0px solid transparent;
  border-top: 10px solid #fff;
  border-left: 10px solid transparent;
  border-right: 10px solid transparent;
  position: absolute;
  bottom: -8px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
}

/*게시판*/
.content-area{
  min-height: 150px;
  padding: 1rem;
  border: 1px solid var(--gray-05);
  border-radius: 5px;
  white-space: pre-wrap;
  line-height: 1.3;
  text-align: left;
}

.title-label.answer{
  width: calc(100% - 20px);
  padding: 10px 10px;
  border-radius: 5px 5px 0;
  background-color: #42C6FF;
  color: #fff;
  /* min-width: 150px; */
  text-align: left;
}

.content-area img{
  max-width: 100%;
}

.floatStyle {
  border-radius: 5px !important;
  box-shadow: 2px 2px 3px 0 rgba(45, 59, 131, 0.20);
  box-sizing: border-box;
  padding: 5px;
  background-color: white;
}

.result-list .twin-row {
  display: flex;
  flex-direction: column;
  gap: 30px;
}

.twin-row .table-inner {
  height: 320px !important;
  overflow: auto;
}

.twin-row table {
  min-width: 100% !important;
}

.twin-row table tr > td, .twin-row table  tr > th {
  padding: .5rem 1rem !important;
  height: 45px;
}
.twin-row table thead{
  position: sticky;
  top: 0;
  z-index: 1;
}
/*tag*/
.dm-data-tag{
  display: flex;
  flex-wrap: wrap;
  gap: 3px;
}
.dm-data-tag .dm-tag{
  display: flex;
  padding: 7px 5px 4px 5px;
  border-radius: 5px;
  color: var(--white);
  font-size: 13px;
  background-color:#00AAB5;
  border: 1px solid transparent;
}
.dm-data-tag02{
  display: flex;
  align-items: center;
  align-content: center;
  gap: 10px;
}
.dm-data-tag02 .dm-tag{
  display: flex;
  padding: 5px;
  border-radius: 5px;
  color: var(--white);
  font-size: 11px;
  white-space: nowrap;
  background-color:#00AAB5;
  border: 1px solid transparent;
}
.dm-data-tag02 .dm-tag.radius{
  border-radius: 30px;
}
.dm-data-tag02 .ass-name{
  display: block;
  padding: 5px 0;
  overflow: hidden;
  text-overflow: ellipsis;
}
/* 통합 모니터링 셀렉트박스 체크박스*/
.custom-select{
  width: 100%;
}
.custom-select .select-selected {
  padding: 14px 28px 13px 10px;
  border: 1px solid var(--gray-07);
  background: url(../images/under_arrow.svg) no-repeat 97% 50% #fff;
  background-size: 16px;
  min-width: 160px;
  max-width: 100%;
  border-radius: 5px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  user-select: none;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.select-selected:focus{
  outline: 2px solid #badaff;
}
.select-items {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 390px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 1;
  overflow-y: auto;
}
.select-items .chkBox-wrap {
  cursor: pointer;
  border-bottom: 1px solid #E0E2E6;
  background-color: #fff;
  padding: 10px 10px 7px 10px;
  display: flex;
  align-items: center;
  gap: 5px;
  color: #667080;
}
.chkBox-wrap label{
  display: flex;
  padding: 10px 10px 7px 10px;
  align-items: center;
  gap: 5px;
}
.select-items div:hover {
  background-color: #f1f1f1;
}
.select-items.show {
  display: block;
}
input[type="checkbox"]:checked + label {
  color: #0454B2;
}
input[type=checkbox] + label.custom{
  padding-top: 1px !important;
}

/*detail filter box*/
.detail-filter-box{
  display: none;
  flex-direction: column;
  padding: 1.5rem 1rem 2rem;
  border: 1px solid var(--color-02);
  border-radius: 10px;
  background-color: var(--white);
}
.detail-filter-box .inner{
  display: flex;
  gap: 1rem;
  flex-direction: column;
}
.detail-filter-box .inner hr{
  margin: 0;
  border-bottom:1px solid var(--hover-color);
}
.detail-filter-box .title{
  color: var(--color-02);
}
.detail-filter-box .title-label{
  min-width: 120px;
  width: 100%;
}
.detail-filter-box .item-horizontal-box{
  width: 100%;
}
.detail-filter-box .select-group{
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  width: 100%;
}
.detail-filter-box .select-group .select{
  width: 100%;
}
.detail-filter-box .radio-group{
  display: flex;
  gap: 1rem;
  align-items: flex-start;
  width: 100%;
}
.detail-filter-box .radio-group label{
  margin: 0;
}
.detail-filter-box .button-box{
  margin-top: 1rem;
}
.detail-filter-box .return-button{
  display: flex;
  align-items: center;
  gap: 5px;
}
.detail-filter-box .return-button span{
  padding-top: 3px;
}
.detail-filter-box .return-button img{
  filter: invert(0%) sepia(99%) saturate(0%) hue-rotate(275deg) brightness(0%) contrast(101%);
}
.detail-filter-box .submit-button{
  display: flex;
  align-items: center;
  justify-content: center;
  min-width: 100px;
  width: 100%;
  padding: 12px 10px 10px;
  border-radius: 50px;
  background-color: var(--color-02);
  color: var(--white);
}
/*모니터링*/
.sc-box{
  width: 100% !important;
}
.sc-box .keyword-input{
  width: 100% !important;
}

/*도움말*/
.contextual-help{
  display: flex;
  width: 20px;
  height: 20px;
  background: url('../images/question-fill.svg') no-repeat center;
  background-size: 100%;
  border-radius: 50%;
  text-indent: -99999px;
}
.help-popover{
  display: none;
  width: 500px;
  padding: 2rem;
  height: fit-content;
  background-color: var(--white);
  border-radius: 1.2rem;
  border: 1px solid var(--gray-02);
  box-shadow: 0 0 0.2rem 0 rgb(0 0 0 / 8%), 0 0.8rem 1.6rem 0 rgb(0 0 0 / 12%);
  position: absolute;
  z-index: 10;
}
.help-popover::before{
  content: "";
  display: block;
  width: 1rem;
  height: 1rem;
  background-color: var(--white);
  border: 1px solid var(--gray-02);
  border-top-color: transparent;
  border-left-color: transparent;
  transform: rotate(45deg);
  position: absolute;
  bottom: -10px;
}
.help-popover .close-btn-icon{
  display: block;
  width: 20px;
  height: 20px;
  text-indent: -99999px;
  background: url('../images/close.svg')no-repeat center;
  background-size: 100%;
  position: absolute;
  top: .7rem;
  right: .7rem;
}
.help-popover .tooltip-contents{
  padding: 5px;
}
.help-popover .tooltip-contents p{
  display: flex;
  gap: 5px;
  align-items: flex-start;
  line-height: 1.5;
}
.help-popover .tooltip-contents p::before{
  content: '';
  display: block;
  width: 5px;
  min-width: 5px;
  height: 5px;
  margin-top: 7px;
  border-radius: 50%;
  background-color: var(--black);
}

/*outline chip - close btn*/
.chip-list-box{
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 5px;
}
.chip-icon-button{
  display: flex;
  gap: 5px;
  width: fit-content;
  padding: 13px 10px 10px;
  border: 1px solid var(--gray-09);
  border-radius: 50px;
  color: var(--gray-09);
}
.chip-icon-button::after{
  content: '';
  display: block;
  width: 12px;
  height: 12px;
  background: url("../images/close-w.svg")no-repeat center;
  background-size: 100%;
  filter: invert(21%) sepia(0%) saturate(0%) hue-rotate(248deg) brightness(40%) contrast(99%);
}

/*more menu*/
.popup-set-menu{
  display: none;
  min-width: 120px;
  background: var(--white);
  border: 1px solid var(--gray-05);
  border-radius: 5px;
  overflow: hidden;
  box-shadow: 3px 4px 4px rgba(38 70 142 / 25%);
  position: absolute;
  z-index: 12;
}
.popup-set-menu.open{
  display: block;
}
.popup-set-menu hr {
  margin: 0;
  background: #d4d4d4;
  height: 1px;
  border: 0;
}
.popup-set-menu li {
  display: block;
}
.popup-set-menu li button {
  display: block;
  width: 100%;
  padding: 10px;
  text-decoration: none;
  color: #667080;
  text-align: left;
}
.popup-set-menu li button:hover {
  background: #f0f7ff;
}
/*section  acco*/
.IconBtn.acco-arrow,
.label-box .arrow {
  display: inline-block;
  width: 24px;
  height: 24px;
  background: url("../images/dcp/mydata/arrow-up.svg")no-repeat center;
  background-size: 24px;
}
.IconBtn.acco-arrow{
  display: inline-block;
  width: 24px;
  min-width: 24px;
  height: 24px;
  background: url("../images/dcp/mydata/arrow-up.svg")no-repeat center;
  background-size: 24px;
}
.IconBtn.acco-arrow.open{
  background: url("../images/dcp/mydata/arrow-down.svg")no-repeat center;
  background-size: 24px;
}
/*결과 없음*/
.no-results-info{
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  gap: 20px;
  cursor: default;
}
.no-results-info>.img{
  width: 200px;
  height: 135px;
  background: url("../images/noList.svg")no-repeat center;
  background-size: 100%;
}
.no-results-info>p{
  color: #AFBAEB;
}