@charset "UTF-8"; 


/* ----- placeholder ----- */
input::placeholder,
input::-webkit-input-placeholder,
textarea::placeholder,
textarea::-webkit-input-placeholder {
  opacity: 1;
  color: #717171;
}

/* ========================================== input ========================================== */
/* ========================================== input ========================================== */
/* ========================================== input ========================================== */
/* input - text */
input[type='text'],
input[type='file'],
input[type='time'],
input[type='number'],
input[type='password'],
input[type='url'],
input[type='email'],
input[type='tel'],
input[type='date'] {
  max-width: 100%;
  height: 40px;
  /* btn의 sm 또는 md 와 높이 같게 해줌 */
  padding: 0 10px 0 16px;
  border: 1px solid #B6BEC5;
  background: #fff;
  color: #1E2124;
  font-weight: 500;
  vertical-align: middle;
  border-radius: 3px;
}

input[type='file'] { height: auto; padding: 0; border-radius: 0px; }

/* input - text - hover */
input:hover:not([disabled]) { /* border-color: #999; */ }

/* input - text - readonly */
input[readonly='readonly'],
input[readonly] { background: #eaebec; color: #adadad; }

/* input - text - disable */
input[disabled='disabled'],
input[disabled] { background: #eaebec; color: #6d7882; }

/* ========================================== radio ========================================== */
/* ========================================== radio ========================================== */
/* ========================================== radio ========================================== */
/* input - radio */
input[type='radio'] {
  width: 20px;
  height: 20px;
  margin: 0px;
  padding: 0px;
  border: 1px solid #58616A;
}

input[type='radio'] + label {
  margin-right: 10px;
  color: #1e2124;
}

/* input - radio - disable */
input[type='radio'][disabled] + label {
  color: #adadad;
  cursor: default;
}

/* ----- radio 커스텀 (KRDS 타입) ( before, after 사용 ) ----- */
/* ----- radio 커스텀 (KRDS 타입) ( before, after 사용 ) ----- */
.rdo.custom_rdo input[type='radio'] {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  margin: -1px !important;
  padding: 0 !important;
  border: 0 !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
}
.rdo.custom_rdo input[type='radio']+label {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  position: relative;
  font-size: 1.7rem;
  line-height: 1;
}
.rdo.custom_rdo input[type='radio']+label:before {
  content: '';
  display: flex;
  flex-shrink: 0;
  z-index: 3;
  width: 20px;
  height: 20px;
  margin-top: 0px;
  border: 0.1rem solid #58616A;
  background-color: #fff;
  transition: 0.3s cubic-bezier(0.4, 0, 0.23, 1);
  border-radius: 100rem;
}
.rdo.custom_rdo input[type='radio']+label:after {
  content: '';
  display: flex;
  position: absolute;
  top: 5px;
  left: 5px;
  z-index: 4;
  width: 10px;
  height: 10px;
  background-color: #256ef4;
  transition: 0.3s cubic-bezier(0.4, 0, 0.23, 1);
  transform: scale(0);
  border-radius: 100rem;
}

/* 활성화 */
.rdo.custom_rdo input[type='radio']:checked+label:before { border-color: #256ef4; background-color: #fff; }
.rdo.custom_rdo input[type='radio']:checked+label:after { transform: scale(1); }

/* 비활성 */
.rdo.custom_rdo input[type='radio']:disabled+label:before { border-color: #8a949e; background-color: #cdd1d5; }
.rdo.custom_rdo input[type='radio']:disabled+label:after { background-color: #757575; }

/* ========================================== checkbox ========================================== */
/* ========================================== checkbox ========================================== */
/* ========================================== checkbox ========================================== */
/* input - checkbox */
input[type='checkbox'] { width: 20px; height: 20px; margin: 0px; padding: 0px; border: 1px solid #58616A; }
input[type='checkbox'] + label { margin-right: 10px; color: #1e2124; }

/* input - checkbox - disable */
input[type='checkbox'][disabled] + label { color: #adadad; cursor: default; }

/* ----- checkbox 커스텀 (KRDS 타입) ( before, after 사용 ) ----- */
/* ----- checkbox 커스텀 (KRDS 타입) ( before, after 사용 ) ----- */
.chk.custom_chk input[type='checkbox'] {
  position: absolute !important;
  width: 1px !important;
  height: 1px !important;
  overflow: hidden !important;
  margin: -1px !important;
  padding: 0 !important;
  border: 0 !important;
  clip: rect(0, 0, 0, 0) !important;
  white-space: nowrap !important;
}
.chk.custom_chk input[type='checkbox'] + label {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  position: relative;
  font-size: 1.7rem;
  line-height: 1;
}
.chk.custom_chk input[type='checkbox'] + label:before {
  content: '';
  display: block;
  flex-shrink: 0;
  z-index: 3;
  width: 20px;
  height: 20px;
  margin-top: 0px;
  border: 0.1rem solid #58616A;
  background-color: #fff;
  border-radius: 4px;
}
.chk.custom_chk input[type='checkbox'] + label:after {
  content: '';
  position: absolute;
  top: 50%;
  left: 5px;
  z-index: 100;
  width: 14px;
  height: 14px;
  background: url(/main/images/common/checkbox_ico.png) no-repeat 0 0;
  transform: translateY(calc(-50% + 3px)) scale(0);
}

/* 활성화 */
.chk.custom_chk input[type='checkbox']:checked + label:before {
  border-color: #256ef4;
  background-color: #256ef4;
  transition: 0.3s cubic-bezier(0.4, 0, 0.23, 1);
}
.chk.custom_chk input[type='checkbox']:checked + label:after {
  transition: 0.3s cubic-bezier(0.4, 0, 0.23, 1);
  transform: translateY(calc(-50% + 3px)) scale(1);
}

/* 비활성 */
.chk.custom_chk input[type='checkbox']:disabled + label:before {
  border-color: #8a949e;
  background-color: #cdd1d5;
}
.chk.custom_chk input[type='checkbox']:disabled + label:after {
  background-position: 0 -18px;
}



/* ========================================== 라디오 와 레이블,  체크박스 와 레이블의 레이아웃 =================================== */
/* ========================================== 라디오 와 레이블,  체크박스 와 레이블의 레이아웃 =================================== */
/* 라디오, 체크박스 는 input 과 label이 한쌍이기에 rdo, chk로 감싸준다  */
.rdo,
.chk {
  display: inline-flex;
  align-items: center;
  flex-wrap: nowrap;
  flex-direction: row;
  gap: 6px;
  vertical-align: middle;
}

.rdo > input[type='radio'],
.chk > input[type='checkbox'] { flex: 0 0 auto; }
.rdo > label,
.chk > label { flex: 0 1 auto; word-break: keep-all; /* line-height: 1.2 !important; */ }
.rdo > input[type='radio'] + label,
.chk > input[type='checkbox'] + label { margin-right: 0px; }

/* rdo 와 chk 를 또 감싸는 부모인  rdo_group, chk_group 으로 감싸서 사용가능 */
/* rdo 와 chk 를 또 감싸는 부모인  rdo_group, chk_group 으로 감싸서 사용가능 */
.rdo_group,
.chk_group { display: inline-flex; flex-wrap: wrap; gap: 14px 20px; vertical-align: middle; }

.rdo_group > .rdo,
.chk_group > .chk { flex: 0 1 auto; }

/* 세로 방향 설정 */
.rdo_group.rdo_group_column,
.chk_group.chk_group_column { flex-direction: column; }

/* ========================================== select ========================================== */
/* ========================================== select ========================================== */
/* ========================================== select ========================================== */
select {
  max-width: 100%;
  height: 40px;
  padding: 0 0 0 16px;
  border: 1px solid #B6BEC5;
  background: #fff;
  color: #1E2124;
  font-weight: 500;
  border-radius: 4px;
  /* btn의 sm 또는 md 와 높이 같게 해줌 */
}

/* select - hover */
select:hover:not([disabled]) { /* border-color:#999; */ }

/* select - disable */
select[disabled='disabled'],
select[disabled] { opacity: 1; background: #eaebec; color: #6d7882; }

/* ----- select - 화살표 사용자 이미지로 커스텀 ----- */
/* ----- select - 화살표 사용자 이미지로 커스텀 ----- */
select.custom_select {
  padding-right: 36px;
  background: url(/main/images/common/select_arrow_down.svg) no-repeat right 16px center;
  background-color: #fff;
  -webkit-appearance: none;
  -moz-appearance: none;
  -o-appearance: none;
  appearance: none;
}

select[disabled='disabled'],
select[disabled] { opacity: 1; background: #eaebec; color: #6d7882; }

select.custom_select[disabled='disabled'],
select.custom_select[disabled] {
  background: url(/main/images/common/select_arrow_down.svg) no-repeat right 16px center;
  background-color: #eaebec;
}

select.custom_select::-ms-expand {
  display: none; /* ie에서 화살표 처리 */
}


/* ----- sort select ( 셀렉트 축소형 커스텀) ----- */
/* ----- sort select ( 셀렉트 축소형 커스텀) ----- */
.select_sort {
  display: inline-block;
  min-width: 0px;
  height: auto;
  padding: 0 36px 0 4px;
  border: none;
  background-color: #fff;
  background-image: url(/main/images/common/select_arrow_down.svg);
  background-repeat: no-repeat;
  background-position: right 10px center;
  background-size: 18px;
  border-radius: 4px;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
}
/* hover */
.select_sort:hover,
.select_sort:focus { background-color: #ebf0f4; }
/* disabled */
.select_sort:disabled { background-color: #f1f3f5; color: #999; cursor: not-allowed; }


/* ========================================== textarea ========================================== */
/* ========================================== textarea ========================================== */
/* ========================================== textarea ========================================== */
textarea {
  max-width: 100%;
  padding: 10px;
  border: 1px solid #B6BEC5;
  background: #fff;
  font-weight: 500;
  border-radius: 4px;
}

/* textarea - hover */
textarea:hover:not([disabled]) { /* border-color: #999; */ }

/* textarea - readonly */
textarea[readonly='readonly'],
textarea[readonly] { opacity: 1; background: #eaebec; color: #adadad; }

/* textarea - disable */
textarea[disabled='disabled'],
textarea[disabled] { opacity: 1; background: #eaebec; color: #6d7882; }



/* ========================================== 기본 focus ========================================== */
/* ========================================== 기본 focus ========================================== */
/* ========================================== 기본 focus ========================================== */
/* *:focus {
  outline: 2px solid #fff;
  outline-offset: 0;
  box-shadow: 0 0 0 4px #256ef4;
  transition: outline 0s, box-shadow 0s !important;  
} */

/* a 와 button 은 포커스 아웃시 애니메이션 적용 */
/* a,
button {
  transition: 0.4s ease-in-out;
}
 */
/* ----- 라디오, 체크박스 제외한 input 요소 와 select 와 textarea 의 focus ----- */
/* input:not([type='radio']):not([type='checkbox']):focus,
select:focus,
textarea:focus { border-color: transparent !important; outline: 0 !important; box-shadow: 0 0 0 2px #256ef4 !important; } */

/* ----- 라디오, 체크박스 focus ----- */
/* input[type='radio']:focus,
input[type='checkbox']:focus {
  outline: 0.1rem solid #fff;
  outline-offset: 0;
  box-shadow: 0 0 0 0.3rem #256ef4;
  transition: outline 0s, box-shadow 0s !important;
} */

/* ----- custom 라디오, custom 체크박스 의 focus ----- */
.custom_rdo input[type='radio']:focus + label,
.custom_chk input[type='checkbox']:focus + label,
.toggle_chk input[type='checkbox']:focus + label { outline: 2px solid #256ef4; outline-offset: 1px; }

.chip_chk input[type='checkbox']:focus + label.chip_outline { border-color: #256ef4; box-shadow: inset 0 0 0 2px #256ef4 !important; }




/* ========================================== button ========================================== */
/* ========================================== button ========================================== */
/* ========================================== button ========================================== */

/*btn 기본btn은 sm을 기준으로 세팅됨*/
/*sm 높이를 input 높이와 동일하게 해주세요*/
.btn {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  min-width: 0;
  /* 버튼속 말줄임 때문에 필요 */
  max-width: 100%;
  /* 버튼속 말줄임 때문에 필요 */
  /* margin: 3px 0;  */
  padding: 2px 4px;
  border: 1px solid #1e2124;
  /* box-shadow: 0 2px 2px #e2e2e2;      */
  background-color: #fff;
  font-size: 1.7rem;
  font-weight: 600;
  line-height: 1;
  word-break: keep-all;
  border-radius: 3px;
}

.btn:hover,
.btn:active,
.btn:focus { background-color: #f4f5f6; }

/* 버튼크기 */
/* 필요시 xs 와 xl 을 추가해서 사용가능 */
/* .btn.btn_xs{ min-height: 28px; min-width: 55px;  padding: 2px 8px;  font-size: 13px;} */
.btn.btn_sm { min-width: 55px; min-height: 28px; padding: 2px 10px; font-size: calc(1.7rem - 3px); }
.btn.btn_md { min-width: 80px; min-height: 40px; padding: 4px 16px; font-size: 1.7rem; }

/*기준btn*/
.btn.btn_lg { min-width: 150px; min-height: 50px; padding: 6px 20px; font-size: calc(1.7rem + 3px); }

/* .btn.btn_xl{ min-height: 50px; min-width: 150px; padding: 6px 14px; font-size: 18px; font-weight: 700;} */

/* form 요소와 나란히 하는 버튼 */
.btn.btn_form { min-width: 55px; min-height: 40px; padding: 4px 10px; font-size: 1.7rem; }

/* 버튼 부가기능 */
.btn.btn_text { border-color: transparent; text-align: left; }

.btn.btn_sm.btn_text,
.btn.btn_md.btn_text,
.btn.btn_lg.btn_text { min-width: auto; padding-right: 2px; padding-left: 2px; }

.btn.btn_text:hover { background-color: #eef2f7; }

.btn.btn_text.active,
.btn.btn_text:focus { background-color: #d6e0eb; }

.btn.btn_free { min-width: auto; height: auto; min-height: auto; padding: 0px; }
.btn.btn_wide { width: 100%; }


/* 버튼 속 글자 말줄임 처리 */
.btn .ellipsis {
  display: inline-block;
  width: 100%;
  overflow: hidden;
  white-space: nowrap;
  text-overflow: ellipsis;
}


/* 버튼 색상 */
.btn.btn_blue { border-color: #244CB1; background: #244CB1; color: #fff; }

.btn.btn_blue:hover,
.btn.btn_blue:active,
.btn.btn_blue:focus { border-color: #0c359d; background: #0c359d; color: #fff; }


.btn.btn_light_blue { border-color: #2186B3; background: #2186B3; color: #fff; }

.btn.btn_light_blue:hover,
.btn.btn_light_blue:active,
.btn.btn_light_blue:focus { border-color: #0c78a6; background: #0c78a6; color: #fff; }


.btn.btn_green { border-color: #0D7C40; background: #0D7C40; color: #fff; }

.btn.btn_green:hover,
.btn.btn_green:active,
.btn.btn_green:focus { border-color: #066532; background: #066532; color: #fff; }


.btn.btn_black { border-color: #383E48; background: #383E48; color: #fff; }

.btn.btn_black:hover,
.btn.btn_black:active,
.btn.btn_black:focus { border-color: #000; background: #000; color: #fff; }



/* -------------- bottom_btn_bar -------------- */
/* -------------- bottom_btn_bar -------------- */
.bottom_btn_bar {  display: flex; align-items: center; flex-wrap: wrap; margin-top: 40px; }
.bottom_btn_bar .bar_right{ margin-left: auto; }

.bottom_btn_bar.right {  justify-content: flex-end; }
.bottom_btn_bar .bar_right{ margin-left: 0; }

.bottom_btn_bar.both {  justify-content: space-between; }
.bottom_btn_bar.both .bar_right {  margin: 0; }

.bottom_btn_bar.center {  justify-content: center; }
.bottom_btn_bar.center .bar_right {  margin: 0; }






/* ====================================== 커스텀 요소 스타일 ============================================= */
/* ====================================== 커스텀 요소 스타일 ============================================= */
/* ====================================== 커스텀 요소 스타일 ============================================= */
/* ----- 커스텀 요소 - 삭제버튼있는 input, 달력 버튼이 있는 input, 기간에 사용할 레이아웃 ----- */


/* ----- 삭제 버튼있는 텍스트 input ----- */
.custom_clear_input { display: inline-flex; position: relative; width: 230px; }
.custom_clear_input input { width: 100%; min-width: 0; max-width: 100%; padding-right: 45px;}
.custom_clear_input .btn_clear { position: absolute; top: 50%; right: 16px;  width: 24px; height: 24px;  background: url(/main/images/common/ipt_delete.svg) no-repeat center center; transform: translateY(-50%);  }

.custom_clear_input input:disabled ~ .btn_clear,
.custom_clear_input input[readonly] ~ .btn_clear { opacity: 0.3; pointer-events: none; cursor: default;  }



/* ----- 달력 버튼이 있는 input ----- */
.calendar_set{ display: inline-flex; position: relative; width: 230px;}
.calendar_input{ display: inline-flex; align-items: center; position: relative; width: 100%;}
.calendar_input input{  width: 100%; min-width: 0; max-width: 100%;  padding-right: 38px;}
.calendar_input .btn-datepicker{ position: absolute; right: 12px; width: 24px; height: 24px; background: url(/main/images/common/ipt_calendar.svg) no-repeat center center;  }
.calendar_input input:disabled ~ .btn-datepicker,
.calendar_input input[readonly] ~ .btn-datepicker { opacity: 0.3; pointer-events: none; cursor: default;  }

.calendar_set .calendar_lib{ }


/* ----- 기간 시작,끝 형태에 사용 레이아웃 ul ----- */
.range_ul{ display: inline-flex; align-items: center; flex-wrap: wrap; gap: 10px;}
.range_ul .mark{ line-height: 1; }





/* ----- 필터 섹션 하위 레이아웃 (반응형) ----- */
/* ----- 필터 섹션 하위 레이아웃 (반응형) ----- */
/*
필드셋 하위 구조로 예시
.filter_fieldset > .filter_item_group > .item_label
.filter_fieldset > .filter_item_group > .item_body
*/
.filter_section{ padding: 10px 20px; margin-bottom: 40px; background-color: #F8F9FA;}

.filter_fieldset{ display: flex; flex-wrap: wrap; gap: 0px 30px;}
.filter_fieldset.center{ justify-content: center;}

/* flex아이템(filter_item_group) 강제 줄바꿈 용 */
.filter_fieldset > .break { flex-basis: 100%; }

@media all and (max-width:1024px) {
  .filter_fieldset > .break { display: none;}
}


/* ----- 필드셋 속 서밋 버튼 ----- */
.filter_fieldset .submit_group { display: flex; gap: 10px; margin-top: 10px; margin-bottom: 10px; margin-left: auto; }
.filter_fieldset.center .submit_group { margin-left: -20px; }

/* filter_item_group 속에서 폼요소의 넓이 초기화 */
.filter_item_group input[type='text']{ width: 230px;}
.filter_item_group .custom_clear_input input{ width: 230px;}
.filter_item_group select { width: 160px; }

.filter_item_group .calendar_set { width: 160px; }
.filter_item_group .calendar_set input { width: 100%; }


.filter_item_group{ display: flex; align-items: center; flex-wrap: wrap; margin: 10px 0;}
.filter_item_group .item_label{ margin-right: 20px; font-weight: 500;}
.filter_item_group .item_body{ display: flex; align-items: center; flex-wrap: wrap; gap: 10px;}
.filter_item_group .item_body .item_label{ margin-right: 0;}

@media all and (max-width:600px) {
  .filter_fieldset{ flex-direction: column; }

  .filter_fieldset > br,
  .filter_fieldset > .break{ display: none; }

  .filter_fieldset .filter_item_group { width: 100%; margin: 0; padding: 20px 0; border-top: 1px solid #CDD1D5;}
  .filter_fieldset .filter_item_group:first-of-type {border-top: none; padding-top: 10px;}
  .filter_fieldset .filter_item_group:last-of-type { padding-bottom: 10px;}
  .filter_fieldset .filter_item_group + .filter_item_group{ /* padding-top: 15px; */ /* border-top: 1px solid #CDD1D5; */}
  .filter_fieldset.center .filter_item_group .chk_group,
  .filter_fieldset.center .filter_item_group .rdo_group{ justify-content: center;  width: 100%;}
  .filter_fieldset .filter_item_group .item_label{  width: 35%; margin-right: 0;}
  .filter_fieldset .item_body{ align-items: flex-start; flex-direction: column; width: 65%; }
  
  .full-width-mobile{ width: 100% !important;} /* 모바일에서 강제 width 100% */
  .filter_fieldset .filter_item_group:not(:has(.item_label)) .item_body,
  .filter_fieldset .filter_item_group .item_label.sr-only + .item_body,
  .filter_fieldset .filter_item_group .item_label.sr_only + .item_body{ width: 100% !important; }

  .filter_fieldset .filter_item_group input[type='text'],
  .filter_fieldset .filter_item_group input[type='number'] { width: 100% !important; }
  .filter_fieldset .filter_item_group .custom_clear_input{ width: 100%;}
  .filter_fieldset .filter_item_group .custom_clear_input input{ width: 100%;}
  .filter_fieldset .filter_item_group select { width: 100%; }


  .filter_fieldset .range_ul{ align-items: flex-start; flex-direction: column; gap: 5px; width: 100%;}
  .filter_fieldset .range_ul li{ width: 100%;}
  .filter_fieldset .calendar_set{ width: 100%;}
  .filter_fieldset .calendar_input{ width: 100%;}
  
  .filter_fieldset .submit_group { flex-direction: column; margin: 0;  padding: 20px 0 10px; border-top: 1px solid #CDD1D5; }
  .filter_fieldset .submit_group .btn{ width: 100%; }
  .filter_fieldset.center .submit_group { margin-left: 0px; }
 
}





/* ----- 반응형 커스텀 입력폼 레이아웃 ----- */
/* ----- 반응형 커스텀 입력폼 레이아웃 ----- */

/* custom_form_field */
.custom_form_field { border-top: 1px solid #565D68;  }

.field_TR { display: flex; border-bottom: 1px solid #CDD1D5; }
/* 1단 행 */
.field_TR .field_TH { display: flex; align-items: center; flex: 0 0 auto; width: 160px; padding: 10px 15px; background: #F8F9FA; font-weight: 500;  }
.field_TR .field_TH .gl_ico_required{ margin-top: -7px;}
.field_TR .field_TD { display: flex; align-items: center; flex: 1 1 auto; width: calc(100% - 160px);   min-height: 60px; padding: 10px 20px;  }
.field_TR .field_TD .field_TD_inner{ width: 100%; }

/* 2단 행 */
.field_TR.two_col { display: flex; }
.field_TR.two_col .col { display: flex; flex: 1 1 0; }

/* custom_form_field 안에서 사용되는 폼요소의 기본 넓이 지정 */
.field_TR .field_TD select{ width: 230px; min-width: 0px; max-width: 100%;}
.field_TR .field_TD textarea{ width: 100%; min-width: 0px; max-width: 100%;}
.field_TR .field_TD input:not([type='checkbox']),
.field_TR .field_TD input:not([type='radio']){  width: 230px;}

.field_TR .field_TD .custom_clear_input { width: 230px; }
.field_TR .field_TD .custom_clear_input input { width: 100%; }

.field_TR .field_TD .calendar_set { width: 230px; }
.field_TR .field_TD .calendar_set input { width: 100%; }


/* 추가 기타옵션 */
/* input 다음 버튼 사이간격 */
.field_TR .field_TD input + button,
.field_TR .field_TD input + .btn{ margin-left: 5px;}
/* 컨트롤러 우측 글자 간격 */
.field_TR .field_TD input + span,
.field_TR .field_TD input + em,
.field_TR .field_TD input + i,
.field_TR .field_TD select + span,
.field_TR .field_TD select + em,
.field_TR .field_TD select + i{ margin-left: 8px;}

/* 컨트롤러 아래 글자 간격 */
.field_TR .field_TD .info_txt{ margin-top: 10px;}


/* 반응형 */
@media (max-width:768px) {
  .custom_form_field.responsive .field_TR.two_col { flex-direction: column; }
  .custom_form_field.responsive .field_TR.two_col .col {   border-top: 1px solid #CDD1D5;}
  .custom_form_field.responsive .field_TR.two_col .col:first-child { border-top: none; }
  .custom_form_field.responsive .field_TR .field_TH {  flex: 0 0 30%; min-width: 120px; word-break: break-all; }
  .custom_form_field.responsive .field_TR.two_col .field_TH { flex: 0 0 30%;  }

  .field_TR .field_TD select{ width: 100% !important; min-width: 0; max-width: 100%;}
  .field_TR .field_TD textarea{ width: 100% !important; min-width: 0px; max-width: 100%;}
  .field_TR .field_TD input:not([type='checkbox']),
  .field_TR .field_TD input:not([type='radio']){ width: 100% !important; min-width: 0px; max-width: 100%;}

  .field_TR .field_TD .custom_clear_input { width: 100% !important; }
  .field_TR .field_TD .calendar_set { width: 100% !important; }

  /* 기존 커스텀 된 폼요소의 부모 넓이 100% 처리 */
  .field_TR .field_TD .custom_clear_input { width: 100%;}
  .field_TR .field_TD .calendar_set,
  .field_TR .field_TD .calendar_input { width: 100%; }
  .field_TR .field_TD .range_ul,
  .field_TR .field_TD .range_ul > li{ width: 100%;}

}







/* ========================================== 글로벌 class / 색상 / 아이콘 / 구분선 ========================================== */
/* ========================================== 글로벌 class / 색상 / 아이콘 / 구분선 ========================================== */
/* ========================================== 글로벌 class / 색상 / 아이콘 / 구분선 ========================================== */

/* 새창열림 아이콘 */
.gl_ico_blank { display: inline-block; position: relative; width: 18px; height: 18px; margin-left: 3px; background: url(/main/images/common/ico_newwin.png) no-repeat center center; vertical-align: middle; font-size: 0; vertical-align: middle; text-indent: -9999px;}
.gl_ico_blank.ico_white { background: url(/main/images/common/ico_newwin_white.png) no-repeat center center; }
.gl_ico_blank.ico_small { width: 15px; height: 15px; margin-left: 3px; background-size: contain;}


/* a 링크 문자  */
a.gl_link { color: #437dea; vertical-align: baseline; text-decoration: underline; }
a.gl_link:hover { color: #085dfd; }


/* 필수 아이콘 */
.gl_ico_required,
.gl_ico_need { display: inline-block; position: relative; top: -1px; width: 13px; height: 13px; margin: 0 3px; background: url(/main/images/common/ico_need.png) no-repeat center center; font-size: 0; vertical-align: middle; text-indent: -9999px; }

/* 파일모양 아이콘 */
.gl_ico_file { display: inline-block; position: relative; top: -1px; width: 16px; height: 16px; margin: 0 0px; background: url(/main/images/common/ico_file_common.png) no-repeat center center; background-size: contain; font-size: 0; vertical-align: middle; text-indent: -9999px; }



/*점선 구분줄 bg활용*/
.gl_solidline { display: block; margin: 15px 0; border-bottom: 1px solid #ddd; }
.gl_dashline { display: block; width: 100%; height: 1px; margin: 15px 0; background: url(/main/images/common/pat_dash.png) repeat-x 0 0; }
.gl_dotline { display: block; width: 100%; height: 1px; margin: 15px 0; background: url(/main/images/common/pat_dot.png) repeat-x 0 0; }
.gl_dotline2 { display: block; width: 100%; height: 5px; margin: 15px 0; background: url(/main/images/common/pat_dot2.png) repeat 0 0; }
.gl_slashline { display: block; width: 100%; height: 5px; margin: 15px 0; background: url(/main/images/common/line_patt.png) repeat-x 0 0; }

/* 문장에 밑줄 */
.gl_txt_underline { text-decoration: underline; }


/*  hr 가로줄  */
.hr,
.hr_line { display: block; margin: 0px; padding: 0px; border: none; border-top: 1px solid #000; }



/* ========================================== 제목글 / 본문 / 문단 / 목록글 ========================================== */
/* ========================================== 제목글 / 본문 / 문단 / 목록글 ========================================== */
/* ========================================== 제목글 / 본문 / 문단 / 목록글 ========================================== */
/* ----- 문단 ----- */
/* ----- 문단 ----- */

.para_box_group { margin-bottom: 80px; }
.para_box { margin-bottom: 60px; }
.para_box:last-of-type { margin-bottom: 0px; }
@media (max-width:768px) {
  .para_box { margin-bottom: 40px; }

}


/* p_txt 문장*/
.p_txt { margin-bottom: 15px; }
.p_color{ color: #5D5D5D;}

/* 들여쓰기 상자 */
.indent_box{margin-left: 24px;}
.indent_box .indent_box{margin-left: 14px;}

@media (max-width:768px) {
  .indent_box{margin-left: 0px;}
  .indent_box .indent_box{margin-left: 0px;}
}



/* ----- 제목 ----- */
/* ----- 제목 ----- */
.headding1 { display: flex; align-items: flex-start; margin-bottom: 30px; font-size: 24px; font-weight: 700;  }
.headding1:before { content: ''; flex: 0 0 auto; width: 4px; height: 20px; margin-top: 7px; margin-right: 14px; background-color: #2186B3; }

.headding2 { display: flex; align-items: flex-start; margin-bottom: 20px; font-size: 19px; color: #2186B3; font-weight: 600; }
.headding2:before { content: ''; flex: 0 0 auto;  width: 16px; height: 16px; margin-top: 5px; margin-right: 8px; background: url(/main/images/common/ico_headding2.svg) no-repeat center center;  }

.headding3 { display: flex; align-items: flex-start; margin-bottom: 10px; font-size: 17px; font-weight: 600;  }
.headding3:before { content: ''; flex: 0 0 auto; width: 4px; height: 4px; margin-top: 10px; margin-right: 10px; background-color: #2186B3; }

.headding1 ~ .headding1{ margin-top: 60px;}
.headding2 ~ .headding2{ margin-top: 30px;}
.headding3 ~ .headding3{ margin-top: 20px;}


/* 숫자목록 */
/* 숫자목록 */
.num_ul { }
.num_ul > li + li { margin-top: 5px; }
.num_ul > li { display: flex; align-items: flex-start; gap: 10px; }
.num_ul > li .item { display: inline-flex; align-items: center; justify-content: center; min-width: 16px; height: 16px; background-color: #4AA9D3; font-size: 14px; font-weight: 600; color: #fff; margin-top: 3px; }

/* 블릿 아이콘 목록 */
/* 블릿 아이콘 목록 */
.bullet_ul { }
.bullet_ul > li + li { margin-top: 5px; }
.bullet_ul > li { display: flex; align-items: flex-start; gap: 10px; }
.bullet_ul > li::before { content: ''; display: inline-flex; align-items: center; justify-content: center; min-width: 16px; height: 16px;  margin-top: 3px; background: #4AA9D3 url(/main/images/common/ico_bullet_arrow.svg) no-repeat center center; }

/* 점 아이콘 목록 */
/* 점 아이콘 목록 */
.dot_ul { }
.dot_ul > li + li { margin-top: 5px; }
.dot_ul > li { display: flex; align-items: flex-start; gap: 10px; }
.dot_ul > li::before { content: ''; display: inline-flex; align-items: center; justify-content: center; min-width: 4px; height: 4px; border-radius: 999px;  margin-top: 10px; background-color: #5D5D5D;}

/* 배경 상자 */
/* 배경 상자 */
.outline_box { padding: 10px 15px; border: 1px solid #B6BEC5; background-color: #EEF3FF; }

/* 패턴 테두리 상자 */
/* 패턴 테두리 상자 */
.pattern_box { background: url(/main/images/common/pattern_bg.png) repeat 0 0; padding: 10px; position: relative; }
.pattern_box .box_inner { padding: 20px; background-color: #fff; position: relative; }





/* ========================================== 반응시 처리 스타일 ========================================== */
/* ========================================== 반응시 처리 스타일 ========================================== */
/* ========================================== 반응시 처리 스타일 ========================================== */

/* 특정 미디어쿼리 구간에서 아래와 같이 실행됨 */

@media screen and (max-width:840px) {
  /* 모바일 셀 숨기기 */
  .on_mobile_hidden { display: none; }

  /* 모바일 셀 고정 넓이 */
  .on_mobile_w40 { width: 40px !important; }
  .on_mobile_w45 { width: 45px !important; }
  .on_mobile_w50 { width: 50px !important; }
  .on_mobile_w55 { width: 55px !important; }
  .on_mobile_w60 { width: 60px !important; }
  .on_mobile_w65 { width: 65px !important; }
  .on_mobile_w70 { width: 70px !important; }
  .on_mobile_w75 { width: 75px !important; }
  .on_mobile_w80 { width: 80px !important; }
  .on_mobile_w85 { width: 85px !important; }
  .on_mobile_w90 { width: 90px !important; }
  .on_mobile_w95 { width: 95px !important; }
  .on_mobile_w100 { width: 100px !important; }
}





/* ========================================== 테이블 ========================================== */
/* ========================================== 테이블 ========================================== */
/* ========================================== 테이블 ========================================== */


/* ----- normal_table ----- */
/* ----- normal_table ----- */
/* normal_table 일반 본문속 표*/
.normal_table { position: relative; width: 100%; overflow: auto; margin-bottom: 40px; border-top: 1px solid #565D68; -webkit-overflow-scrolling: touch; }
.normal_table table { width: 100%; text-align: center; table-layout: fixed; border-collapse: collapse; }
/* 라인잡기 */
.normal_table table th, 
.normal_table table td { border: 1px solid #CDD1D5; }

.normal_table table tr:first-child td, 
.normal_table table tr:first-child th { border-top: none; }

.normal_table table th:first-child, 
.normal_table table td:first-child { border-left: none; }

.normal_table table th:last-child, 
.normal_table table td:last-child { border-right: none; }
/* 세부설정 */
.normal_table table thead th { height: 40px; padding: 7px 7px; background: #ECF4F9; font-weight: 600; line-height: 1.2; text-align: center; word-break: break-all; }
.normal_table table tbody th, 
.normal_table table tbody td { height: 40px; padding: 7px 7px; line-height: 1.2; word-break: break-all; }
.normal_table table tbody th { background: #F8F9FA; line-height: 1.2; }
.normal_table table tbody th { font-weight: 600; }
.normal_table table tfoot th, 
.normal_table table tfoot td { height: 40px; padding: 7px 7px; text-align: left; word-break: break-all; }
.normal_table table tfoot th { background: #F8F9FA; line-height: 1.2;  }
.normal_table table tfoot th { font-weight: 600; }

/* 부가기능 클래스 */
/* 부가기능 클래스 */

/* 테이블 테두리에 라인 */
.normal_table.tbl_border table { border: 1px solid #CDD1D5; border-top: none; }
.normal_table.tbl_border_2 { border-top: 1px solid #CDD1D5; }
.normal_table.tbl_border_2 table { border: 1px solid #CDD1D5; border-top: none;}
/* 말줄임 */
.normal_table .ellipsis { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }


@media screen and (max-width:1200px) {
  .normal_table { font-size: 15px; }
}
@media screen and (max-width:1024px) {
  
}
/*20251127 김만진, 게시판 상세페이지에 대해 이관된 clob데이터 내부 테이블 태그 클래스 적용을 위해 임시 작업*/
.table { position: relative; width: 100%; overflow: auto; margin-bottom: 40px; border-top: 1px solid #565D68; -webkit-overflow-scrolling: touch; }
.table table { width: 100%; text-align: center; table-layout: fixed; border-collapse: collapse; }
/* 라인잡기 */
.table table th,
.table table td { border: 1px solid #CDD1D5; }

.table table tr:first-child td,
.table table tr:first-child th { border-top: none; }

.table table th:first-child,
.table table td:first-child { border-left: none; }

.table table th:last-child,
.table table td:last-child { border-right: none; }
/* 세부설정 */
.table table thead th { height: 40px; padding: 7px 7px; background: #ECF4F9; font-weight: 600; line-height: 1.2; text-align: center; word-break: break-all; }
.table table tbody th,
.table table tbody td { height: 40px; padding: 7px 7px; line-height: 1.2; word-break: break-all; }
.table table tbody th { background: #F8F9FA; line-height: 1.2; }
.table table tbody th { font-weight: 600; }
.table table tfoot th,
.table table tfoot td { height: 40px; padding: 7px 7px; text-align: left; word-break: break-all; }
.table table tfoot th { background: #F8F9FA; line-height: 1.2;  }
.table table tfoot th { font-weight: 600; }


/* ----- table 특정 구간에서 가로 스크롤 처리 ----- */
/* ----- table 특정 구간에서 가로 스크롤 처리 ----- */

@media screen and (max-width:1100px) {
  .scroll_guide_1100px { overflow: auto !important; }
  .scroll_guide_1100px>table { width: 1160px !important; }  
}
@media screen and (max-width:1000px) {
  .scroll_guide_1000px { overflow: auto !important; }
  .scroll_guide_1000px>table { width: 1060px !important; }  
}
@media screen and (max-width:900px) {
  .scroll_guide_900px { overflow: auto !important; }
  .scroll_guide_900px>table { width: 960px !important; } 
}
@media screen and (max-width:800px) {
  .scroll_guide_800px { overflow: auto !important; }
  .scroll_guide_800px>table { width: 860px !important; } 
}
@media screen and (max-width:700px) {
  .scroll_guide_700px { overflow: auto !important; }
  .scroll_guide_700px>table { width: 760px !important; } 
}
@media screen and (max-width:600px) {
  .scroll_guide_600px { overflow: auto !important; }
  .scroll_guide_600px>table { width: 660px !important; } 
}
@media screen and (max-width:500px) {
  .scroll_guide_500px { overflow: auto !important; }
  .scroll_guide_500px>table { width: 560px !important; }
}
@media screen and (max-width:400px) {
  .scroll_guide_400px { overflow: auto !important; }
  .scroll_guide_400px>table { width: 460px !important; } 
}


/* 모바일에서 스크롤바 자동숨김 방지, 스크롤바 고정으로 보이기 */
.normal_table::-webkit-scrollbar,
.board_table::-webkit-scrollbar{
  height:4px; /* 가로스크롤일 경우 바의 높이값 */
  width: 4px; /* 세로스크롤일 경우 바의 넓이값 */
}
.normal_table::-webkit-scrollbar-thumb,
.board_table::-webkit-scrollbar-thumb{
  background: #a9a9a9; /* 바 색상 */
}





/* ----- 게시판 상단 카운트 / 목록검색 ----- */
/* ----- 게시판 상단 카운트 / 목록검색 ----- */
/* 게시물 상단 기능*/
.control_bar { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 10px; margin-bottom: 15px; }
.control_bar .bar_left { display: flex; align-items: center; flex-wrap: wrap; flex: 0 0 auto; max-width: 100%; }
.control_bar .bar_left .total{ display: flex; align-items: center;}
.control_bar .bar_left .total .num{ margin-left: 5px; color: #244CB1; font-weight: 700;}
.control_bar .bar_left>* { margin-right: 10px; }
.control_bar .bar_left>:last-child { margin-right: 0px; }



/* ========================================== 테이블 형 게시판 목록 ========================================== */
/* ========================================== 테이블 형 게시판 목록 ========================================== */
/* ========================================== 테이블 형 게시판 목록 ========================================== */

/* ----- board_table ----- */
/* ----- board_table ----- */
.board_table { position: relative; width: 100%; overflow: auto; border-top: 1px solid #565D68; -webkit-overflow-scrolling: touch; }
.board_table table { width: 100%; text-align: center; table-layout: fixed; border-collapse: collapse; }
/* 라인잡기 */
.board_table table th, 
.board_table table td { border: 1px solid #CDD1D5; }
.board_table table tr:first-child td, 
.board_table table tr:first-child th { border-top: none; }
.board_table table th:first-child, 
.board_table table td:first-child { border-left: none; }
.board_table table th:last-child, 
.board_table table td:last-child { border-right: none; }
/* 세부설정 */
.board_table table thead th { height: 40px; padding: 7px 7px; background: #ECF4F9; font-weight: 600; line-height: 1.2; text-align: center; word-break: break-all; }
.board_table table tbody th, 
.board_table table tbody td { height: 40px; padding: 7px 7px;  word-break: break-all; }
.board_table table tbody th { background: #ECF4F9; line-height: 1.2; }
.board_table table tbody th { font-weight: 600; }
.board_table table tfoot th, 
.board_table table tfoot td { height: 40px; padding: 7px 7px; text-align: left; word-break: break-all; }
.board_table table tfoot th { background: #ECF4F9; line-height: 1.2;  }
.board_table table tfoot th { font-weight: 600; }
/* new 아이콘 */
.board_table table td .txt { vertical-align: middle;}
.board_table table td .new { flex: 0 0 auto; display: inline-flex; align-items: center; justify-content: center; width: 19px; height: 19px; margin-left: 5px; margin-top: -2px; background: #ff3b00; line-height: 1;  font-size: 11px; color: #fff; font-weight: bold;  text-transform: uppercase; border-radius: 50%; vertical-align: middle; }

/* 부가기능 클래스 */
/* 부가기능 클래스 */
/* 테이블 테두리에 라인 */
.board_table.tbl_border table { border: 1px solid #d9d9d9; border-top: none; }
/* 말줄임 (td 또는 블럭요소 전용 사용)*/
.board_table .ellipsis { overflow: hidden; white-space: nowrap; text-overflow: ellipsis; }
/* 첨부파일 버튼 */
.board_table .bt_add_file { width: 34px; height: 24px; background: url(/main/images/common/ico_add_file.svg) no-repeat center center; }
/* a 태그 밑줄 */
.board_table td a:hover { text-decoration: underline; }





@media screen and (max-width:1200px) {
  .board_table { font-size: 15px; }
}

@media screen and (max-width:1024px) {
 
}







/* ========================================== 게시판 썸네일 목록 화면 ========================================== */
/* ========================================== 게시판 썸네일 목록 화면 ========================================== */
/* ========================================== 게시판 썸네일 목록 화면 ========================================== */

.photo_list{}
.photo_list ul { display: flex; flex-wrap: wrap; gap: 30px; }
.photo_list ul > li { flex: 0 1 calc((100% - 90px)/4); min-width: 0;}
.photo_list ul > li > a { display: block; }
.photo_list .thumb { display: block; width: 100%; overflow: hidden; background: #ccc; aspect-ratio: 315/180;}
.photo_list .thumb img { display: block; width: 100%; height: 100%; transition: transform 0.5s ease; object-fit: cover; }
.photo_list ul > li:hover .thumb img { transform: scale(1.03); }

.photo_list .cont { display: block; padding-top: 16px;}
.photo_list .cont .tit { display: block; width: 100%; overflow: hidden; padding-bottom: 10px; font-size: 19px; font-weight: 600; white-space: nowrap; text-overflow: ellipsis;  }
.photo_list .cont .meta { position: relative; display: flex; flex-direction: column; gap: 5px; padding-top: 10px; border-top: 1px solid #B6BEC5; }
.photo_list .cont .meta::before { content: ''; position: absolute; top: -1px; left: 0; height: 2px; background-color: #000; width: 0; transition: width 0.3s; }

.photo_list .cont .meta .place{ display: flex; align-items: flex-start;  color: #5D5D5D;}
.photo_list .cont .meta .place::before{ content: ''; display: inline-block; width: 24px; height: 24px; margin-right: 5px;  background: url(/main/images/common/place.svg) no-repeat center center;}
.photo_list .cont .meta .date{ display: flex; align-items: center;  color: #5D5D5D;}
.photo_list .cont .meta .date::before{ content: ''; display: inline-block; width: 24px; height: 24px; margin-right: 5px; background: url(/main/images/common/time.svg) no-repeat center center; }
.photo_list li:hover .cont .tit { color: #1548c0; }
.photo_list li:hover .cont .meta::before { width: 100%;  }











/* 더보기 */
.sec_vhome .more { display: flex; justify-content: center; align-items: center; position: absolute; top: 70px; right: 0; font-size: 19px; color: #5D5D5D; font-weight: 600; }
.sec_vhome .more:hover { text-decoration: underline; }
.sec_vhome .more::after { content: ''; display: inline-block; width: 20px; height: 20px; margin-left: 5px; background: url(/main/images/common/arrow_forward.svg) no-repeat center center; }

/* 반응형 */
@media all and (max-width:1200px) {
  .photo_list ul > li { flex: 0 1 calc((100% - 60px)/3);}
  
}
@media all and (max-width:920px) {
  .photo_list ul > li { flex: 0 1 calc((100% - 30px)/2);}
  
}
@media all and (max-width:580px) {
  .photo_list ul > li { flex: 0 1 100%;}
  
}



/* ========================================== 게시판 관련사이트 목록 화면 ========================================== */
/* ========================================== 게시판 관련사이트 목록 화면 ========================================== */
/* ========================================== 게시판 관련사이트 목록 화면 ========================================== */

.photo_list2{}
.photo_list2 ul { display: flex; flex-wrap: wrap; gap: 30px; }
.photo_list2 ul > li { flex: 0 1 calc((100% - 90px)/4); min-width: 0;}
.photo_list2 ul > li > a { display: block; }
.photo_list2 .thumb { display: flex; align-items: center; justify-content: center; width: 100%; overflow: hidden; aspect-ratio: 308/170; border: 1px solid #CDD1D5;}
.photo_list2 .thumb img { transition: transform 0.3s; max-width: 80%; }

.photo_list2 .cont { display: block; margin-top: 10px; text-align: center; }
.photo_list2 .cont .url_txt { font-size: 19px; font-weight: 600; }

.photo_list2 a:hover .thumb { border-color: #000; }
.photo_list2 a:hover .thumb img { transform: scale(1.03); }
.photo_list2 a:hover .cont .url_txt { text-decoration: underline; }

/* 반응형 */
@media all and (max-width:1200px) {
  .photo_list2 ul > li { flex: 0 1 calc((100% - 60px)/3);}
  
}
@media all and (max-width:920px) {
  .photo_list2 ul > li { flex: 0 1 calc((100% - 30px)/2);}
  
}
@media all and (max-width:580px) {
  .photo_list2 ul > li { flex: 0 1 100%;}
  .photo_list2 .thumb { aspect-ratio: 308/150; }
  
}


/* ========================================== 게시판 활용사례 목록 화면 ========================================== */
/* ========================================== 게시판 활용사례 목록 화면 ========================================== */
/* ========================================== 게시판 활용사례 목록 화면 ========================================== */

.photo_list3{}
.photo_list3 ul { display: flex; flex-wrap: wrap; gap: 30px; }
.photo_list3 ul > li { flex: 0 1 calc((100% - 60px)/3); min-width: 0;}
.photo_list3 ul > li > a { display: block; }
.photo_list3 .thumb { display: flex; align-items: center; justify-content: center; width: 100%; overflow: hidden; aspect-ratio: 424/238; border: 1px solid #CDD1D5;}
.photo_list3 .thumb img { transition: transform 0.3s; width: 100%; }
.photo_list3 ul > li:hover .thumb { border-color: #000; }
.photo_list3 ul > li:hover .thumb img { transform: scale(1.03); }

.photo_list3 .cont { display: block; margin-top: 20px; }
.photo_list3 .cont .sbj_txt { font-weight: 700; }
.photo_list3 .cont .tag_group { margin-top: 10px; }

.photo_list3 a:hover .cont .sbj_txt { text-decoration: underline; }

/* 반응형 */
@media all and (max-width:1200px) {
  .photo_list3 ul > li { flex: 0 1 calc((100% - 60px)/3);}
  
}
@media all and (max-width:920px) {
  .photo_list3 ul > li { flex: 0 1 calc((100% - 30px)/2);}
  
}
@media all and (max-width:580px) {
  .photo_list3 ul > li { flex: 0 1 100%;}

  
}





/* ----- 페이지 네비게이션 ----- */
/* ----- 페이지 네비게이션 ----- */

.pagination { display: flex; justify-content: center; align-items: center; flex-wrap: wrap; gap: 10px 8px; margin-top: 20px;  }
.pagination a { transition: none;  }

/* 이전, 다음 */
.pagination .page_ctrl { display: flex; align-items: center; height: 40px; padding: 0 10px;  line-height: 1; border-radius: 6px; }
.pagination .page_ctrl.disabled { opacity: 0.5; pointer-events: none; cursor: default; }
.pagination .page_ctrl.disabled:hover { background-color: transparent;  }
.pagination .page_ctrl:hover { background-color: #e6eaef;  }
.pagination .page_ctrl.prev::before { content: ''; display: inline-block; width: 20px; height: 20px; background: url(/main/images/common/pagi_prev_arrow.svg) no-repeat center center; }
.pagination .page_ctrl.next::after { content: ''; display: inline-block; width: 20px; height: 20px;  background: url(/main/images/common/pagi_next_arrow.svg) no-repeat center center; }

.pagination .page_link { display: inline-flex; justify-content: center; align-items: center; min-width: 40px; height: 40px; line-height: 1; border-radius: 6px; }
.pagination .page_link:not(.active):hover { background-color: #e6eaef;}
/* 현재 페이지 */
.pagination .page_link.active { background-color: #383E48; color: #fff; font-weight: 700; }

@media screen and (max-width:600px) {
  .pagination {  gap: 10px 4px;  }
}






/* ========================================== 게시판 내용보기 화면 ========================================== */
/* ========================================== 게시판 내용보기 화면 ========================================== */
/* ========================================== 게시판 내용보기 화면 ========================================== */


/* 게시판 내용보기 */
/* 게시판 내용보기 */
/* 게시판 내용보기 */

/* 내용보기 상단 태그 */
.tag_group{ display: flex; flex-wrap: wrap; gap: 8px; }
.tag_badge{ display: inline-flex; align-items: center; background: #4AA9D3; color: #fff; padding: 4px 10px; min-height: 24px; line-height: 1; border-radius: 3px; font-size: 14px; font-weight: 700;}

/* 내용보기 상단 첨부파일  */
.file_list{}
.file_list > li + li{ margin-top: 8px;}
.file_list a:hover .file_name{ text-decoration: underline; }

.file_item { display: flex; align-items: center; }
.file_item .file_badge{ flex: 0 0 auto; align-self: flex-start; margin-right: 10px;}
.file_item .file_name{ }
.file_badge{ display: inline-flex; align-items: center; background: #5273C8; color: #fff; padding: 4px 10px; min-height: 24px; line-height: 1; border-radius: 3px; font-size: 14px; font-weight: 700; text-transform: uppercase;}



/* 게시판 내용보기 */
/* 게시판 내용보기 */
.board_view{ border-top: 1px solid #565D68; font-size: 16px;}

.board_view .board_header{ display: flex; justify-content: space-between; align-items: center; gap: 20px 50px; min-height: 56px; padding: 15px 20px; background-color: #F8F9FA; border-bottom: 1px solid #CDD1D5;}
.board_view .board_header .title{ flex: 1 1 auto; font-weight: 700; font-size: 17px;}
.board_view .board_header .meta{ flex: 0 0 auto; display: flex; gap: 20px;  }
.board_view .board_header .meta .ti{ font-weight: 600; margin-right: 10px; }

/* 내용보기 상단 정보 row 레이아웃 - 태그, 첨부파일 */
.board_view .board_row { display: flex; justify-content: flex-start;  min-height: 56px;  border-bottom: 1px solid #CDD1D5; }
.board_view .board_row .row_label { flex: 0 0 auto; min-width: 80px; display: flex; align-items: center; font-weight: 600; padding: 15px 0px 15px 20px; }
.board_view .board_row .row_body { flex: 1 1 0; padding: 15px 20px;}

/* 내용보기 - 내용 */
/*20251127 김만진, 게시판 상세페이지 조회시 clob데이터가 하단 네비게이션 침범하는 경우로 인해 overflow-y 속성 추가*/
.board_view .board_content {  min-height: 300px; padding: 15px 20px; border-bottom: 1px solid #CDD1D5; overflow-y: auto}

/* 이전 다음 */
.board_view .bottom_nav { display: flex; justify-content: space-between;  min-height: 56px; padding: 15px 20px; border-bottom: 1px solid #CDD1D5; }
.board_view .bottom_nav .prev,
.board_view .bottom_nav .next{ flex: 1 1 auto; width: 50%; }

.board_view .bottom_nav .prev .item,
.board_view .bottom_nav .next .item{ display: flex;  gap: 20px; align-items: center;  min-width: 0; flex-wrap: wrap;  }

.board_view .bottom_nav .prev .item .txt,
.board_view .bottom_nav .next .item .txt{ flex: 1 1 0; text-overflow: ellipsis; overflow: hidden; white-space: nowrap; }

.board_view .bottom_nav .prev .item .txt{ padding-right: 50px;}
.board_view .bottom_nav .next .item .txt{ padding-left: 50px;}

.board_view .bottom_nav .next { text-align: right;   }
.board_view .bottom_nav .next .item{ flex-direction: row-reverse;   }

.board_view .bottom_nav .ti { flex: 0 0 auto; display: inline-flex; align-items: center; gap: 10px; font-weight: 600; }
.board_view .bottom_nav .next .ti { flex-direction: row-reverse;}
.board_view .bottom_nav .ti::before { content: ''; display: inline; width: 20px; height: 20px; background: url(/main/images/common/board_bottom_nav_arrow_left.svg) no-repeat center center;  }
.board_view .bottom_nav .next .ti::before { background-image: url(/main/images/common/board_bottom_nav_arrow_right.svg);}

.board_view .bottom_nav .prev.disabled a,
.board_view .bottom_nav .next.disabled a { pointer-events: none; cursor: default; }

.board_view .bottom_nav a:hover .txt { text-decoration: underline; }

@media all and (max-width:1200px) {
  .board_view .board_header{ flex-direction: column; align-items: flex-start; gap: 10px; }
}
@media all and (max-width:1024px) {  
  .board_view .board_row .row_label {display: none;}  
}
@media all and (max-width:720px) {
  .board_view .bottom_nav { display: block; padding: 0px;}
  .board_view .bottom_nav .prev { border-bottom: 1px solid #CDD1D5; width: 100%;}
  .board_view .bottom_nav .next { text-align: left;  width: 100%;  }
  .board_view .bottom_nav .next .ti { flex-direction: row;}
  .board_view .bottom_nav .prev .item,
  .board_view .bottom_nav .next .item{  min-height: 56px; padding: 15px;  }
  .board_view .bottom_nav .next .item{ flex-direction: row;  }
  .board_view .bottom_nav .prev .ti::before { transform: rotate(90deg);}
  .board_view .bottom_nav .next .ti::before { transform: rotate(90deg);}
  .board_view .bottom_nav .prev .item .txt{ padding-right: 0px;}
  .board_view .bottom_nav .next .item .txt{ padding-left: 0px;}

}


/* 내용보기 속 비디오 관련 */
/* 내용보기 속 비디오 관련 */

/* HTML5 비디오재생 */
.video_player video {
  width: 100%;
  max-width: 100%;
  height: auto;       
  aspect-ratio: 16 / 9;
  display: block;
}

/* 유튜브 재생 */
.youtube_video_wrap iframe { display: block; border: 0; width: 100%; height: 100%; aspect-ratio: 16 / 9;   }
.video_transcript { margin-top: 20px; padding: 15px; border: 1px solid #ddd; background: #f9f9f9; max-height: 300px; overflow-y: auto; }
.transcript_title { margin-bottom: 10px; font-weight: bold; font-size: 16px; }









/* 게시판 작성및수정 */
/* 게시판 작성및수정 */

.board_edit{ border-top: 1px solid #565D68; }

/* 작성및수정 - 상단 정보입력 row 레이아웃 */
.board_edit .board_row { display: flex; justify-content: flex-start;  min-height: 56px;  border-bottom: 1px solid #CDD1D5; }
.board_edit .board_row .row_label { flex: 0 0 auto; width: 140px; display: flex; align-items: center; font-weight: 600; padding: 10px 15px; background-color: #F8F9FA;}
.board_edit .board_row .row_label .btn_add_file {  width: 24px; height: 24px;  background: url(/main/images/common/file_plus.svg) no-repeat center center; margin-left: 5px;}
.board_edit .board_row .row_body { display: flex; align-items: center; flex: 1 1 0; width: calc(100% - 140px); min-height: 55px; padding: 10px 20px; }
.board_edit .board_row .row_body .row_body_inner { width: 100%;}

/* 작성및수정 - 첨부파일 입력 목록 */
.add_file_ul{}
.add_file_ul li{ width: 100%;}
.add_file_ul li + li{ margin-top: 10px;}
.add_file_ul li input{ text-overflow: ellipsis; white-space:nowrap;}


/* 작성및수정 - 내용 */
.board_edit .edit_content { min-height: 400px;  border: 1px solid #CDD1D5;  border-top: 1px solid #565D68;  margin-top: 10px; font-size: 16px; }
.board_edit .text_content { max-height: 400px; overflow-y: auto;  border: 1px solid #CDD1D5;  border-top: 1px solid #565D68;  margin-top: 10px;  padding: 15px 20px;}
.board_edit .text_content .text_inner{ font-size: 16px; }











/* ----- editor 캐스케이딩 ----- */
/* ----- editor 캐스케이딩 ----- */
/* 글보기 에디터 내용글 */
.editor_content { min-height: 300px; padding: 10px 0; line-height: 1.8em; }
.editor { font-size: 13.3333px; color: #333; line-height: 1.5; }
.editor html { display: block; overflow-y: auto; }
.editor head { display: none; }
.editor body { display: block; margin: 8px; }
.editor div { display: block; }
.editor iframe { border: 2px inset; border-image-source: initial; border-image-slice: initial; border-image-width: initial; border-image-outset: initial; border-image-repeat: initial; }
.editor h1 { display: block; margin: 0.67em 0; font-size: 2em; font-weight: bold; }
.editor h2 { display: block; margin: 0.83em 0; font-size: 1.5em; font-weight: bold; }
.editor h3 { display: block; margin: 1em 0; font-size: 1.17em; font-weight: bold; }
.editor h4 { display: block; margin: 1.33em 0; font-weight: bold; }
.editor h5 { display: block; margin: 1.67em 0; font-size: 0.83em; font-weight: bold; line-height: 1.17em; }
.editor h6 { display: block; margin: 2.33em 0; font-size: 0.67em; font-weight: bold; }
.editor p { display: block; /* margin:1em 0; */ }
.editor blockquote { display: block; margin: 1em 40px; }
.editor pre, .editor xmp, .editor plaintext, .editor listing { display: block; margin: 1em 40px; font-family: monospace; white-space: pre; }
.editor i, .editor cite, .editor em, .editor var, .editor address, .editor dfn { font-style: italic; }
.editor address { display: block; }
.editor big { font-size: larger; }
.editor tt, .editor code, .editor kbd, .editor samp { font-family: monospace; }
.editor s, .editor strike, .editor del { text-decoration: line-through; }
.editor u, .editor ins { text-decoration: underline; }
.editor q { display: inline; }
.editor q:before { content: open-quote; }
.editor q:after { content: close-quote; }
.editor small { font-size: smaller; }
.editor strong, .editor b { font-weight: bold; }
.editor sub { font-size: smaller; vertical-align: sub; }
.editor sup { font-size: smaller; vertical-align: super; }
.editor center { display: block; text-align: center; }
.editor dl { display: block; margin: 1em 0; }
.editor dt { display: block; }
.editor dd { display: block; margin-left: 40px; }
.editor ol { display: block; margin: 1em 0; padding-left: 40px; list-style-type: decimal; }
.editor ol li { list-style-type: decimal; }
.editor ul, .editor menu, .editor dir { display: block; margin: 1em 0; padding-left: 40px; list-style-type: disc; }
.editor ul li { list-style-type: disc; }
.editor li { display: list-item; text-align: match-parent; }
.editor fieldset { display: block; min-width: min-content; margin: 0 2px; padding: 0.35em 0.75em 0.625em; border: 2px groove threedface; border-image-source: initial; border-image-slice: initial; border-image-width: initial; border-image-outset: initial; border-image-repeat: initial; }
.editor form { display: block; margin-top: 0em; }
.editor label { cursor: default; }
.editor legend { display: block; visibility: visible; padding: 0 2px; border: none; border-image-source: initial; border-image-slice: initial; border-image-width: initial; border-image-outset: initial; border-image-repeat: initial; }
.editor table { display: table; border-color: gray; border-collapse: separate; border-spacing: 2px; }
.editor caption { display: block; display: table-caption; visibility: visible; text-align: center; }
.editor colgroup { display: table-column-group; }
.editor col { display: table-column; }
.editor thead { display: table-header-group; border-color: inherit; vertical-align: middle; }
.editor tbody { display: table-rows; vertical-align: middli-coliit; }
.editor tfoot { display: table-footer-group; border-color: inherit; vertical-align: middle; }
.editor tr { display: table-row; border-color: inherit; vertical-align: inherit; }
.editor td, .editor th { display: table-comp; vertical-align: inherit; }
.editor th { font-weight: bold; text-align: center; }
.editor hr { border: 1px inset; }
.editor br:before { content: '\A'; }
.editor a { color: #0066cc; text-decoration: underline; }
.editor a:link, .editor a:hover, .editor a:active, .editor a:visited .editor a:focus { text-decoration: underline; }
.editor a:visited { color: #800080; text-decoration: underline; }
.editor article, .editor aside, .editor footer, .editor header, .editor hgroup, .editor main, .editor nav, .editor section { display: block; }
.editor details { display: block; }
.editor figure { display: block; margin: 1em 40px; }
.editor figcaption { display: block; }
.editor bdi, .editor output { unicode-bidi: isolate; }
.editor output { display: inline; }
.editor ruby, .editor rt { text-indent: 0px; }
.editor summary { display: block; }
.editor mark { background-color: yellow; color: black; }
.editor audio { width: 300px; height: 30px; }
.editor video { object-fit: contain; }
.editor img, .editor table, .editor iframe, .editor object, .editor embed { max-width: 100%; }
.editor-table-box { width: 100%; overflow-x: auto; overflow-y: hidden; }
.editor a { word-break: break-word; }
.editor-iframe-box { position: relative; height: 0; padding-top: 56%; }
.editor-iframe-box iframe { position: absolute; top: 0px; left: 0; width: 100%; height: 100%; }





/* ----- 커스텀 모달 레이어 공통 ------- */
/* ----- 커스텀 모달 레이어 공통 ------- */
body.custom_modal_open { overflow: hidden; }
/*커스텀 모달*/
.custom_modal { display: none; position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 2000; background: rgba(0, 0, 0, 0.7); }
.custom_modal .modal_box { position: absolute; top: 50%; left: 50%; width: 96%; max-width: 900px; transform: translate(-50%, -50%);}
/*커스텀 모달 헤더*/
.custom_modal .modal_head { padding: 15px 100px 15px 20px; background: linear-gradient(
    268.83deg,
    rgba(36, 76, 177, 1) 0%,
    rgba(33, 134, 179, 1) 100%
  ); border-radius: 5px 5px 0px 0px; }
.custom_modal .modal_head .tit { font-size: 17px; color: #fff; font-weight: 600; }
/*커스텀 모달 컨텐츠*/
.custom_modal .modal_body { padding: 0px 0px 40px; background: #fff; border-radius: 0px 0px 5px 5px; }
.custom_modal .modal_body .scroll_inner { max-height: calc(100vh - 200px); overflow-y: auto; }
.custom_modal .modal_body .scroll_inner .body_cnt{ padding: 20px;}



/*커스텀 모달 닫기버튼*/
.custom_modal .close_modal { position: absolute; top: 15px; right: 20px; z-index: 9999; width: 30px; height: 30px; background: url(/main/images/common/modal_close.svg) no-repeat center center; }

@media screen and (max-width:900px) {
  
  .custom_modal .modal_body .scroll_inner { max-height: 74vh; }
}
@media screen and (max-width:900px) and (max-height:600px) {
  .custom_modal .modal_body .scroll_inner { max-height: 54vh; }
}




/* ----- bpopup 모달 ----- */
/* ----- bpopup 모달 ----- */
/* bpopup 커스텀  */
#bpopup_container { width: 96% !important; left: 50% !important; transform: translateX(-50%); }
#bpopup_container .bpopup_modal_box { width: 100% !important; max-width: 400px; max-height: 90vh; margin: 0 auto; }

/* bpopup container 안에 불어올 실제 모달 스타일  */
.bpopup_modal_box { position: relative;}
/*커스텀 모달 헤더*/
.bpopup_modal_box .modal_head { border-radius: 5px 5px 0px 0px; padding: 15px 100px 15px 20px; background: linear-gradient( 268.83deg, rgba(36, 76, 177, 1) 0%, rgba(33, 134, 179, 1) 100% ); }
.bpopup_modal_box .modal_head .tit { font-size: 17px; font-weight: 600; color: #fff; }
/*커스텀 모달 컨텐츠*/
.bpopup_modal_box .modal_body { padding: 0px 0px 40px; background: #fff; border-radius: 0px 0px 5px 5px; }
.bpopup_modal_box .modal_body .scroll_inner { max-height: calc(100vh - 200px); overflow-y: auto; }
.bpopup_modal_box .modal_body .scroll_inner .body_cnt{ padding: 20px;}

/*커스텀 모달 닫기버튼*/
.bpopup_modal_box .close_modal { position: absolute; top: 15px; right: 20px; z-index: 9999; width: 30px; height: 30px; background: url(/main/images/common/modal_close.svg) no-repeat center center; }










/* ----- datepicker 데이터 피커 공통----- */
/* ----- datepicker 데이터 피커 공통----- */

.ui-datepicker { z-index: 999 !important; }
/* 모달레이어 보다 상위에 있어야 하기에 zindex 높여줌 */

/* 전체 컨테이너 */
.ui-datepicker { font-family: "Pretendard GOV","Noto Sans KR", "맑은 고딕", AppleSDGothicNeo, sans-serif; width: 320px; border: 1px solid #cfd4dc; border-radius: 8px; overflow: hidden; background: #eef2f7; box-shadow: 0 4px 12px rgba(0,0,0,0.12); }
/* 헤더 */
.ui-datepicker .ui-datepicker-header { background: #eef2f7; height: 60px; color: #111; padding: 5px; border: none; display: flex; justify-content: space-between; align-items: center; }

/* 이전달/다음달 버튼 */
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { top: 50%; transform: translateY(-50%); cursor: pointer; background-color: #fff; border-radius: 999px; border: 1px solid #b0b0b0; }
.ui-datepicker .ui-datepicker-prev { left: 10px; }
.ui-datepicker .ui-datepicker-next { right: 10px; }
.ui-datepicker .ui-datepicker-prev.ui-state-hover, .ui-datepicker .ui-datepicker-next.ui-state-hover { background-color: #fff; border: 1px solid #000; }
.ui-datepicker .ui-datepicker-prev .ui-icon, .ui-datepicker .ui-datepicker-next .ui-icon { transform: scale(0.8); filter: invert(1); }

/* 연도/월 select */
.ui-datepicker .ui-datepicker-title select { border-radius: 4px; border: 1px solid #cfd4dc; font-size: 14px; cursor: pointer; }
.ui-datepicker .ui-datepicker-title select:hover { background-color: #fff; }
.ui-datepicker select.ui-datepicker-month, 
.ui-datepicker select.ui-datepicker-year { width: 70px; height: 30px; background: none; /* 기존 아이콘 숨김 */
  background-color: #dce2ea; margin: 0 4px; padding: 0; border: 0; border-radius: 3px; text-align: center; color: #000; font-size: 15px; font-weight: bold; box-sizing: border-box; -webkit-appearance: none; -moz-appearance: none; appearance: none; }
.ui-datepicker select.ui-datepicker-month{ margin-left: 20px;}

/* 실제 달력 table */
.ui-datepicker .ui-datepicker-calendar { width: 300px; margin: 10px; }
.ui-datepicker .ui-datepicker-calendar thead tr {    position: static; }
/* 요일 */
.ui-datepicker .ui-datepicker-calendar thead th { display: table-cell; float: none; color: #000; font-size: 15px; opacity: 1; }

/* 날짜 */
.ui-datepicker td { text-align: center; padding: 0 2px; }
.ui-datepicker td a { display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border-radius: 50%; font-size: 17px; color: #111; text-decoration: none; }

/* 날짜 상태, 오버 */
.ui-datepicker .ui-state-default { display: block; border: 0; border-radius: 30px; width: 36px; height: 36px; line-height: 34px; padding: 0; margin: 4px auto; font-size: 17px; text-align: center; background: transparent; font-weight: normal; color: #333; box-sizing: border-box; }
.ui-datepicker .ui-state-default.ui-state-hover { background-color: #fff; }

/* 이전/다음 달 날짜 흐리게 */
.ui-datepicker-other-month a { color: #ccc !important; }

/* 오늘 */
.ui-datepicker td .ui-state-highlight { border: none; background: transparent; position: relative; }
.ui-datepicker td .ui-state-highlight::before { content: ''; position: absolute; bottom: 2px; left: 50%; transform: translateX(-50%); width: 10px; height: 4px; border-radius: 4px; background-color: red; }

/* 사용자 선택 날짜 표시 */
.ui-datepicker td.ui-datepicker-current-day .ui-state-active { background: #063a74 !important; color: #fff !important; font-weight: 600; }

/* 주말 강조 */
.ui-datepicker-calendar tbody td:nth-child(1) a { color: #dc2626; } /* 일요일 빨강 */
.ui-datepicker-calendar tbody td:nth-child(7) a { color: #2563eb; } /* 토요일 파랑 */

/* 하단 버튼 패널 */
.ui-datepicker .ui-datepicker-buttonpane { display: flex; justify-content: space-between; gap: 6px; padding: 5px; border-top: 1px solid #e5e7eb; background: #f9fafb; margin-top: 0; }
/* 버튼기본 */
.ui-datepicker .ui-datepicker-buttonpane button { padding: 6px 12px; border-radius: 6px; border: 1px solid #cfd4dc; background: #fff; color: #111; font-size: 14px; cursor: pointer; display: flex; align-items: center; }
/* 오늘날짜 버튼 */
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { border-color: #1e2124; color: #1e2124; opacity: 1 !important; }
/* 닫기버튼 */
.ui-datepicker .ui-datepicker-buttonpane button:last-child { background: #2563eb; color: #fff; border-color: #2563eb; }
.ui-datepicker .ui-datepicker-buttonpane button:last-child:hover { background: #1d4ed8; }

@media screen and (max-width:640px){
  /* 전체 컨테이너 */
  .ui-datepicker { width: 300px;  }

  /* 실제 달력 table */
  .ui-datepicker .ui-datepicker-calendar { width: 276px; } 
  
}









/* ----- tooltip_box 공통 ----- */
/* ----- tooltip_box 공통 ----- */
.tooltip_box { position: absolute; top: 0; left: 0; z-index: 1000; padding: 6px 8px 7px 8px; background-color: rgba(0, 0, 0, 0.5); font-size: 13px; color: #cfcfcf; line-height: 1; white-space: nowrap; border-radius: 6px; }




/* ----- 로딩중 처리중 ----- */
/* ----- 로딩중 처리중 ----- */
body.loading_screen_open { overflow: hidden; }
.loading_screen { display: none; position: fixed; top: 0; right: 0; bottom: 0; left: 0; z-index: 9999; background: rgba(0, 0, 0, 0.7); text-align: center; }
.loading_screen.active { display: block; }
.load-wrapp { position: absolute; top: 50%; left: 50%; width: 160px; height: 160px; padding: 20px 20px; /*background-color: #d8d8d8;*/
  background: #fff; text-align: center; transform: translate(-50%, -50%); border-radius: 50%; }
.load-wrapp p.txt { margin-top: 25px; padding: 0 0 15px; font-size: 16px; color: #056ec0; font-weight: bold; }
.load-wrapp .line { display: inline-block; width: 15px; height: 15px; background-color: #4b9cdb; border-radius: 15px; }
.load-wrapp .load-3 .line:nth-last-child(1) { animation: loadingC 0.6s 0.1s linear infinite; }
.load-wrapp .load-3 .line:nth-last-child(2) { animation: loadingC 0.6s 0.2s linear infinite; }
.load-wrapp .load-3 .line:nth-last-child(3) { animation: loadingC 0.6s 0.3s linear infinite; }
@keyframes loadingC {
  0% { transform: translate(0, 0); }
  50% { transform: translate(0, 15px); }
  100% { transform: translate(0, 0); }
}



/* ----- error 페이지 ----- */
/* ----- error 페이지 ----- */
.error_wrap{ position: relative; width: 100vw; height: 100vh;}
.error_wrap:before{ content:""; position: absolute; top: 0; left: 50%; width: 1px; height: 100%; background-color: #d9d9d9; }
.error_cnt_box{  max-width: 600px; width: 90%; padding: 30px ; margin: 0 auto; position: relative; top: 100px; background-color: #fff; text-align: center;}
.error_cnt_box .txt{ font-size: 19px;  color: #666; line-height: 1.6em; margin-top: 20px;}
.error_cnt_box .back_btn{ display: inline-block; border: 1px solid #d9d9d9; padding: 10px 50px; margin-top: 20px; font-size: 15px; font-weight: 700;}
.error_cnt_box .back_btn:hover{ border-color: #1665d1; text-decoration: none;}
.error_cnt_box .back_btn:before{ content: ""; display: inline-block; width: 14px; height: 14px; background: url(/main/images/common/arrow_blue.png) no-repeat 0 0; position: relative; top: 2px; margin-right: 10px;}

@media screen and (max-width:640px){
    .error_cnt_box .txt{ font-size: 16px; word-break: keep-all;}
    .error_cnt_box .back_btn{  padding: 10px 20px;  font-size: 13px;}
}