/* Common */
.inner {
  position: relative;
  width: 1260px;
  margin: 0 auto;
}
.inner_flex {
  display: flex;
  padding: 4rem 0 4.5rem;
}

/* Header */
header {
  position: relative;
  border-bottom: 1px solid #ccc;
  z-index: 1100;
}
header .inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.logo {
  display: flex;
  align-items: center;
  gap: 5px;
}
.logo img {
  height: 43px;
}

.logo .logo_bar {
	color: #c5c5c5;
}

.logo .logo_title {
	color: #2b2b2b;
	font-size: 20px;
	font-weight: 700;
	letter-spacing: -0.050em;
}

/* =========================
   Variables (한 곳에서 관리)
========================= */
:root{
  /* GNB 슬롯(대메뉴) 크기 */
  --gnb-slot-width: 140px;     /* 각 대메뉴 칸 폭 */
  --gnb-slot-height: 80px;     /* GNB 바 높이 */
  --gnb-slot-gap: 20px;        /* 칸 간격 */

}

/* =========================
   GNB (대메뉴 바) – 슬롯 방식
========================= */
.gnb{
  display: flex;
  align-items: center;
  justify-content: center;
  height: var(--gnb-slot-height);
  flex: 1 1 auto;
  margin-left: 90px;
  position: relative;
  text-align: left;
}

.gnb_list{
  display: flex;
  align-items: stretch;            /* li 높이를 바에 맞춤 */
  column-gap: var(--gnb-slot-gap);
  height: 100%;
  padding: 0;
  margin: 0;
}

.gnb_item{
  position: relative;
  flex: 0 0 var(--gnb-slot-width); /* 고정 폭 */
  height: var(--gnb-slot-height);  /* 고정 높이 */
  list-style: none;
}

/* 링크가 슬롯 전체를 덮도록 */
.gnb_item > a{
  position: absolute;
  inset: 0;                        /* top/right/bottom/left = 0 */
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 8px;
  text-decoration: none;

  /* 타이포(기존 값 유지) */
  color: #000;
  font-size: 20px;
  font-weight: 500;
  letter-spacing: -0.5px;
}

/* 포커스/선택 스타일 */
.gnb_item > a:focus-visible{
  outline: 2px solid #10611d;
  outline-offset: 2px;
}
.gnb_item.open > a{
  text-decoration-line: underline;
  text-underline-offset: 10px;
  text-decoration-thickness: 2.5px;
  text-decoration-color: #3d8a58;
  font-weight: 700;
}

/* =========================
   우측 사이트맵 버튼
========================= */
.gnb_sitemap{
  flex: 0 0 auto;
  position: relative;
  width: 40px; height: 40px;
  display: inline-flex; align-items: center; justify-content: center;
  border: 1.5px solid #d7e0f4;
  border-radius: 999px;
  background: #fff;
  color: #3d8a58;
  margin-left: 16px;
  transition: background-color .2s, border-color .2s, color .2s, box-shadow .2s;
  text-decoration: none;
}
.gnb_sitemap::after{
  content: attr(aria-label);
  position: absolute;
  bottom: -40px; left: 50%;
  transform: translateX(-50%);
  background: rgba(0,0,0,.8);
  color: #fff;
  padding: 4px 8px;
  font-size: 12px;
  border-radius: 4px;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s;
}
.gnb_sitemap:hover::after,
.gnb_sitemap:focus-visible::after{ opacity: 1; }
.gnb_sitemap .ico{
  width: 20px; height: 20px;
  background-color: currentColor;
  -webkit-mask: url("/images/road-map-fill.svg") no-repeat center / contain;
          mask: url("/images/road-map-fill.svg") no-repeat center / contain;
}
.gnb_sitemap:hover,
.gnb_sitemap:focus-visible{
  background: #3d8a58; color: #fff; border-color: #3d8a58;
  box-shadow: 0 2px 8px rgba(0,0,0,.12);
  outline: none;
}

/* =========================
   Mega menu (하단 패널: per-item)
========================= */
.mega_menu{
  position: fixed;                 /* 전폭 스트립 */
  left: 0; right: 0;
  top: var(--bar-top, 80px);       /* JS가 헤더 하단으로 세팅 */
  width: 100%;
  min-height: 215px;
  display: none;                   /* 해당 gnb_item에 open 붙을 때만 보임 */
  background: #fff;
  border-top: 1px solid #e5e3e3;
  z-index: 1200;
  pointer-events: auto;
}
.mega_menu_inner{ position: static; }

/* 각 gnb별 중메뉴 카드 묶음 */
.mega_menu_list{
  position: absolute;
  top: 16px;
  left: var(--panel-left, 0px);    /* JS가 중앙정렬된 좌표를 넣음 */
  width: auto;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 10px;
  align-items:flex-start;
}

/* 카드 */
.mega_menu_item{
	width: auto;
}

.mega_menu_item > a{
  /* 레이아웃 */
  display: inline-flex;            /* 아이콘(불릿) + 텍스트 가로 배치 */
  padding: 6px 0;
  align-items: center;
  justify-content: flex-start;     /* 왼쪽 정렬 */
  gap: 0;
  width: 100%;

  /* 여백/박스 */
  padding: 6px 0px !important;
  background: none;
  border: 0;
  border-radius: 0;
  box-sizing: border-box;

  /* 타이포 */
  font-size: 15px;
  font-weight: 500;
  color: #454545;
  text-decoration: none;
  letter-spacing: 0.2px;

  /* 밑줄 애니메이션 (좌→우) */
  position: relative;
  background-image: linear-gradient(currentColor, currentColor);
  background-repeat: no-repeat;
  background-position: 0 100%;       /* 왼쪽 아래 시작 */
  background-size: 0% 1.6px;          /* 처음엔 0% */
  transition: color .18s ease, background-size .5s ease;
}

/* hover/focus 시 색상 + 밑줄 확장 */
.mega_menu_item > a:hover,
.mega_menu_item > a:focus-visible{
  color: #10611d;
  background-size: 100% 1.6px;        /* 좌→우로 그려지듯 확장 */
  outline: none;
}

/* 왼쪽 불릿 */
.mega_menu_item > a::before{
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: 8px;
  border-radius: 50%;
  flex-shrink: 0;
  background: currentColor;
  opacity: 0.9;
}

.mega_menu_item > a > i{
  margin-left: 2px;       /* 0~2px 사이로 조절 */
  vertical-align: middle; /* 폰트아이콘이면 수직 정렬 보정 */
  transform: translateY(1px); /* 살짝 내리고 싶으면 유지/조절 */
}

/* is-open 서브메뉴가 있다면 필요한 규칙 (없으면 제거 가능) */
.mega_submenu{ display: none; list-style: none; margin: 10px 0 0; padding: 0 0 0 12px; }
/* .mega_menu_item.is-open > .mega_submenu{ display: block; } */

/* gnb에서 open된 항목만 패널 보이기 */
.gnb_item.open .mega_menu{ display: block; }

/* 오버레이 */
.page-dim {
  position: fixed;
  left: 0;
  right: 0;
  top: 80px; /* 헤더 하단부터 어둡게 */
  bottom: 0;
  background: rgba(0, 0, 0, 0.45);
  opacity: 0;
  pointer-events: none;
  transition: opacity 0.25s ease;
  z-index: 1000;
}

/* 열림 상태일 때 오버레이 표시 */
body.is-mega-open .page-dim {
  opacity: 1;
  pointer-events: auto;
}

/* Side Menu */
.lnb_sidemenu {
  width: 200px;
}
.sidemenu_tit {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  height: 95px;
  background-color: #4d4a4a;
  color: #fff;
  font-size: 25px;
  font-weight: 500;
  text-align: center;
  line-height: 1.2;
  border-radius: 12px;
  position:relative;
}

.lnb_depth1 {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.lnb_depth1_item {
  box-sizing: border-box;
  width: 100%;
  border: 1px solid #ddd;
  border-top-right-radius: 8px;
  border-top-left-radius: 8px;
}
.depth1_title {
  display: flex;
  justify-content: space-between;
  padding: 10px 15px;
  font-size: 16px;
  color: #000;
  align-items: center;
  font-weight: 500;
}
.depth1_title:after {
  content: "";
  display: inline-block;
  width: 25px;
  height: 20px;
  background-image: url(/images/arrow-down-wide-fill.png);
  background-repeat: no-repeat;
  background-size: contain; /* 이미지가 영역 안에 맞게 축소 */
  transition: transform 0.3s ease; /* 회전 애니메이션 */
}
.depth1_title.open:after {
  transform: rotate(180deg);
}
.lnb_depth2 {
  display: none;
}
.lnb_depth2_item {
  border-bottom: 1px solid #ddd;
}

/* active 상태: 밑줄(보더) + 글자색 초록 */
.lnb_depth2_item.active > a.depth2 {
	color: #3d8a58;
	font-weight: 600; /* 강조용(옵션) */
}
.depth2 {
  display: flex;
  justify-content: space-between;
  align-items: center;
  padding: 8px 15px;
  font-weight: 400;
  color: #000;
  font-size: 15px;
  background-color: #f8f8f8;
  letter-spacing: -0.05em;
}
.depth2.open {
  font-weight: bold;
}
.lnb_depth3 {
  display: none;
  padding: 14px;
}
.lnb_depth3_item {
  border: none;
  margin-bottom: 3px;
}

.lnb_depth3_item.active > a.depth3 {
	color: #3d8a58;
	font-weight: 600;
}
.depth3 {
  display: flex;
  font-size: 14px;
  color: #000;
  font-weight: 400;
}
.depth3:before {
  content: "-";
  display: block;
  margin-right: 5px;
  align-items: flex-start;
}

/* 2뎁스에 3뎁스가 있는 항목: 우측에 + / - 아이콘 */
.lnb_depth2_item.depth_plus > a.depth2 {
	position: relative;
	padding-right: 22px; /* 아이콘 자리 */
}

/* 기본: + */
.lnb_depth2_item.depth_plus > a.depth2::after {
	content: "+";
	position: absolute;
	right: 12px;
	top: 50%;
	transform: translateY(-50%);
	font-weight: 700;
	color: #7a7a7a;
	line-height: 1;
}

/* 열림 상태: - 로 변경 */
.lnb_depth2_item.depth_plus.open > a.depth2::after {
	content: "–"; /* en dash 또는 "-" 사용 가능 */
}

/* 2뎁스가 열렸을 때만 3뎁스 표시 */
.lnb_depth2_item.open > .lnb_depth3,
.lnb_depth2_item.active > .lnb_depth3 {
	display: block;
}

.border_radius_box {
  padding: 20px 15px;
  border: 1px solid #eee;
  border-radius: 5px;
}

.border_radius_box.content_desc_box {
  border: 1px solid #e7e7e7;       /* 얇은 실선 */
  border-radius: 8px;              /* 둥근 모서리 */
  background-color: #fffcf7;       /* 연한 배경 */
  color: #333;                     /* 텍스트 진회색 */
  padding: 18px 20px;              /* 내부 여백 */
  font-size: 14px;
  line-height: 1.8;                /* 줄 간격 넉넉하게 */
  box-shadow: 0 2px 6px rgba(0,0,0,0.05); 
}

/* UL 기본 스타일 초기화 */
.border_radius_box.content_desc_box ul {
  list-style: none;    /* 기본 불릿 제거 */
  margin: 0;
  padding: 0;
}

/* li 스타일 */
.border_radius_box.content_desc_box ul li {
  display: flex;            /* 불릿 + 텍스트를 flex로 배치 */
  align-items: center;      /* 세로 중앙 정렬 */
  margin-bottom: 10px;      /* 항목 간격 */
  font-size: 14px;
  line-height: 1.6;
}

/* 마지막 항목은 여백 제거 */
.border_radius_box.content_desc_box ul li:last-child {
  margin-bottom: 0;
}

/* 빨간 원 불릿 */
.border_radius_box.content_desc_box ul li::before {
  content: "";
  display: inline-block;
  width: 4px;
  height: 4px;
  margin-right: 8px;        /* 불릿과 텍스트 간격 */
  background-color: #e0554e;/* 빨간 원 */
  border-radius: 50%;       /* 동그랗게 */
  flex-shrink: 0;           /* 크기 줄어들지 않도록 */
}

.search_list {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: flex-start;
  gap: 16px 24px;
  padding: 18px 23px;
  background: #f7f7f7;
}
.search_type_common {
  flex: 0 0 calc(50% - 12px);
  display: flex;
  align-items: center;
  gap: 8px;
  min-width: 0;
}
.search_list .search_type_common > label {
  flex: 0 0 80px;
  white-space: nowrap;
}
.search_list label {
  font-weight: 400;
  font-size: 14px;
  line-height: 1.5;
}
.search_select {
  width: 100px;
  height: 40px;
  border: 1px solid #eee;
  border-radius: 5px;
  font-size: 14px;
  appearance: none;
  background: #fff url(../images/icon_arrow.png) no-repeat 90% center;
  background-size: 12px;
  padding-left: 20px;
}

.search_input {
  padding-left: 20px;
  width: 100px;
  height: 40px;
  border: 1px solid #eee;
  border-radius: 5px;
}

.search_date {
  width: 100px;
  height: 40px;
  border: 1px solid #eee;
  border-radius: 5px;
  text-align: center;
}
.search_list .search_type_common .search_input,
.search_list .search_type_common input,
.search_list .search_type_common select,
.search_list .search_type_common .date_range {
  flex: 1 1 auto;
  min-width: 0;
}
.search_list .search_type_date .date_range {
  display: flex;
  align-items: center;
  gap: 8px;
}
/* 특정 항목을 한 줄 가득 (사용할 경우 주석해제) */
/*.search_list .search_type_date.full,
.search_list .search_actions.full {
  flex-basis: 100%;
}*/
/* 반응형: 좁아지면 1컬럼 (사용할 경우 주석해제) */
/*@media (max-width: 768px) {
  .search_list .search_type_common { flex-basis: 100%; }
}*/
.btn_submit {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  background-color: #4d4a4a;
  border-radius: 5px;
  border: 2px solid transparent; /* 기본 투명 border */
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.btn_submit:hover {
  background-color: #fff;    /* 호버시 배경 → 흰색 */
  border-radius: 5px;
  border: 2px solid #4d4a4a;
  color: #4d4a4a;            /* 호버시 글자 → 원래 배경색 */
  cursor: pointer;
}

.btn_reFresh {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  background-color: #4d4a4a;
  border-radius: 5px;
  border: 2px solid transparent; /* 기본 투명 border */
  margin-right: 10px;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.btn_reFresh:hover {
  background-color: #fff;    /* 호버시 배경 → 흰색 */
  border-radius: 5px;
  border: 2px solid #4d4a4a;
  color: #4d4a4a;            /* 호버시 글자 → 원래 배경색 */
  cursor: pointer;
}

.btn_reFresh::before {
  content: "";
  width: 18px;
  height: 18px;
  margin-right: 2px;
  background: currentColor; 
  -webkit-mask: url('/images/btn/btnRefresh_new.png') no-repeat center/contain;
          mask: url('/images/btn/btnRefresh_new.png') no-repeat center/contain;
}

.btn_search {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  background-color: #0c4da2;
  border-radius: 5px;
  border: 2px solid transparent; /* 기본 투명 border */
  margin-right: 5px;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.btn_search:hover {
  background-color: #fff;    /* 호버시 배경 → 흰색 */
  border-radius: 5px;
  border: 2px solid #0c4da2;
  color: #0c4da2;            /* 호버시 글자 → 원래 배경색 */
  cursor: pointer;
}

.btn_search::before {
  content: "";
  width: 18px;
  height: 18px;
  margin-right: 2px;
  background: currentColor; 
  -webkit-mask: url('/images/search_icon.png') no-repeat center/contain;
          mask: url('/images/search_icon.png') no-repeat center/contain;
}

.btn_write {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  background-color: #ff5c6a;
  color: #fff;
  border-radius: 5px;
  border: 2px solid transparent; /* 기본 투명 border */
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.btn_write:hover {
  background-color: #fff;       /* 호버시 배경 → 흰색 */
  color: #ff5c6a;               /* 호버시 글자 → 원래 배경색 */
  border-color: #ff5c6a;        /* border는 유지, 색상만 변경 */
  cursor: pointer;
}

.btn_write::before {
  content: "";
  width: 18px;
  height: 18px;
  margin-right: 2px;
  background: currentColor; 
  -webkit-mask: url('/images/icon-compose-pencil.svg') no-repeat center/contain;
          mask: url('/images/icon-compose-pencil.svg') no-repeat center/contain;
}

.btn_delete {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  background-color: #ff5c6a;
  color: #fff;
  border-radius: 5px;
  border: 2px solid transparent; /* 기본 투명 border */
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.btn_delete:hover {
  background-color: #fff;       /* 호버시 배경 → 흰색 */
  color: #ff5c6a;               /* 호버시 글자 → 원래 배경색 */
  border-color: #ff5c6a;        /* border는 유지, 색상만 변경 */
  cursor: pointer;
}

.btn_delete::before {
  content: "";
  width: 18px;
  height: 18px;
  margin-right: 2px;
  background: currentColor; 
  -webkit-mask: url('/images/delete-bin-line.svg') no-repeat center/contain;
          mask: url('/images/delete-bin-line.svg') no-repeat center/contain;
}

.btn_return {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  background-color: #4d4a4a;
  border-radius: 5px;
  border: 2px solid transparent; /* 기본 투명 border */
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.btn_return:hover {
  background-color: #fff;    /* 호버시 배경 → 흰색 */
  border-radius: 5px;
  border: 2px solid #4d4a4a;
  color: #4d4a4a;            /* 호버시 글자 → 원래 배경색 */
  cursor: pointer;
}

.btn_return::before {
  content: "";
  width: 15px;
  height: 15px;
  margin-right: 2px;
  background: currentColor; 
  -webkit-mask: url('/images/arrow-go-back-line.svg') no-repeat center/contain;
          mask: url('/images/arrow-go-back-line.svg') no-repeat center/contain;
}

.btn_download {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  background-color: #408080;
  color: #fff;
  border-radius: 5px;
  border: 2px solid transparent; /* 기본 투명 border */
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.btn_download:hover {
  background-color: #fff;       /* 호버시 배경 → 흰색 */
  color: #408080;               /* 호버시 글자 → 원래 배경색 */
  border-color: #408080;        /* border는 유지, 색상만 변경 */
  cursor: pointer;
}

.btn_download::before {
  content: "";
  width: 18px;
  height: 18px;
  margin-right: 2px;
  background: currentColor; 
  -webkit-mask: url('/images/arrow-down-box-line.svg') no-repeat center/contain;
          mask: url('/images/arrow-down-box-line.svg') no-repeat center/contain;
}

.btn_save {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  background-color: #00a200;
  border: 2px solid transparent; /* 기본 투명 border */
  border-radius: 5px;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.btn_save:hover {
  background-color: #fff;     /* 호버시 배경 → 흰색 */
  color: #00a200;             /* 호버시 글자 → 원래 배경색 */
  border: 2px solid #00a200;  /* 테두리 추가 */
  border-radius: 5px;
  cursor: pointer;
}

.btn_save::before{
  content:"";
  width:18px;
  height:18px;
  margin-right: 2px;
  background: currentColor;                 /* 글자색을 따름 */
  -webkit-mask: url('/images/checkbox.svg') no-repeat center/contain;
          mask: url('/images/checkbox.svg') no-repeat center/contain;
}

.btn_modify {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 36px;
  background-color: #0080c0;
  border: 2px solid transparent; /* 기본 투명 border */
  border-radius: 5px;
  transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}

.btn_modify:hover {
  background-color: #fff;     /* 호버시 배경 → 흰색 */
  color: #0080c0;             /* 호버시 글자 → 원래 배경색 */
  border: 2px solid #0080c0;  /* 테두리 추가 */
  border-radius: 5px;
  cursor: pointer;
}

.btn_modify::before{
  content:"";
  width:18px;
  height:18px;
  margin-right: 3px;
  background: currentColor;                 /* 글자색을 따름 */
  -webkit-mask: url('/images/edit-2-line.svg') no-repeat center/contain;
          mask: url('/images/edit-2-line.svg') no-repeat center/contain;
}



.list-actions {
  display: flex; /* 행 컨테이너 */
  justify-content: flex-end; /* 우측 정렬 */
  margin-top: 16px; /* 위로 여백(원하면 값 키우기) */
}
.search_actions {
  display: flex;
  align-items: center;
}


/* footer */
.footer_container {
  padding: 49px 0 42px;
  background-color: #292d37;
}
.footer_el {
  display: flex;
  align-items: center;
}
.footer_text {
  display: flex;
  flex-direction: column;
  padding-left: 20px;
}
.footer_text span {
  color: #ffffff;
}

.footer_img {
  height: 45px;
}

.footer_content {
  display: flex;
  align-items: center;
  justify-content: space-between;
}

/* Sub footer */
.subFooter_container {
  padding: 16px 0 18px;
  /* height 고정은 제거: 콘텐츠 절단을 막습니다 */
  /* height: 20px !important;  제거 */
  background-color: #515767;
  border-top: 1px solid rgba(255,255,255,0.08);
}

.subFooter_container .inner {
  width: 1260px;        /* ← 첨부 기준 고정폭 */
  max-width: 100%;
  margin: 0 auto;       /* 가운데 정렬 */
  box-sizing: border-box;
}

.subFooter_content {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 20px;
}

/* ===== 왼쪽 텍스트 영역 (정책/사이트) ===== */
/* 개인정보 처리방침 1줄 고정 */
.subFooter_left {
  flex: 0 0 auto;          /* 고정폭 대신 내용 기반 */
  min-width: max-content;  /* 내용 길이만큼 영역 확보 */
  border-right: 1px solid rgba(255,255,255,0.12);
  align-items:center;
  display: flex;
}

/* 전체 폭이 아닌, 다른 섹션과 동일하게 안쪽 정렬 */
.subFooter_content.inner {
  max-width: 1260px;   /* 다른 섹션과 같은 폭 (예: 1200px, 사이트 공통값 사용) */
  margin: 0 auto;      /* 가운데 정렬 */
  padding: 0 5px;     /* 좌우 여백 */
  box-sizing: border-box;
}

.subFooter_text {           /* 좌측 항목 기본 간격 */
  display: flex;
  flex-direction: column;
  padding-right: 20px;          /* 기존 40px → 0으로 줄임 (구획선으로 분리) */
}

.subFooter_text a {
  display: inline-flex !important;
  align-items: center;
  color: #fff;
  text-decoration: none;
  height: 26px;               /* 오른쪽 .links_badge 높이와 동일 */
  line-height: 26px;          /* 레거시 브라우저 대비 */
}

.subFooter_text span {
  color: #eeee82;
  position: relative;
  cursor: pointer;
  display: inline-flex;
  align-items: center;
  font-weight: 500;
  letter-spacing: 0.1px;
  opacity: 0.95;
}

.subFooter_text span::before {
  content: "";
  display: inline-block;
  width: 6px;
  height: 6px;
  margin-right: 8px;         /* 점과 텍스트 거리 약간 늘림 */
  background-color: #eeee82;
  border-radius: 50%;
  flex-shrink: 0;
  opacity: 0.9;
}

.subFooter_text span::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -3px;
  width: 0;
  height: 1px;
  background-color: #eeee82;
  transition: width 0.25s ease;
  opacity: 0.85;
}

.subFooter_text span:hover::after { width: 100%; }
.subFooter_text span:hover { font-weight: 600; }

/* 오른쪽 블록은 남는 공간 사용 */
.subFooter_links_wrap {
  display: grid;
  grid-template-columns: auto 1fr auto; /* 배지 | 리스트 | 버튼 */
  align-items: center;
  gap: 12px;
  min-width: 0;         /* 내용 수축시 잘림 방지 */
  flex: 1 1 auto;
}

.links_head {
  display: flex;
  align-items: center;
}

.links_badge {
  display: inline-flex;
  align-items: center;
  height: 26px;
  padding: 0 10px;
  border-radius: 999px;
  background: rgba(255,255,255,0.08);   /* 좌측과 톤 차이 */
  color: #e9ecf1;
  font-size: 12px;
  letter-spacing: .2px;
  user-select: none;
  white-space:nowrap;
}

.links_controls {
  display: inline-flex;
  gap: 6px;
}

.footer_btn {
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.14);
  color: #fff;
  font-size: 14px;
  cursor: pointer;
  line-height: 1;
  border-radius: 8px;
  padding: 6px 8px;
  backdrop-filter: saturate(120%) blur(2px);
}
.footer_btn:hover {
  background: rgba(255,255,255,0.12);
}

/* 링크 뷰는 부모 폭 100% (고정폭 금지) */
.subFooter_links_view {
  position: relative;
  overflow: hidden;
  width: 100%;
  max-width: 100%;
  background: rgba(0,0,0,0.08);
  border: 1px solid rgba(255,255,255,0.1);
  border-radius: 10px;
}

/* 좌우 페이드 마스크(스크롤 힌트) */
.subFooter_links_view::before,
.subFooter_links_view::after {
display:none;
}
.subFooter_links_view::before {
  left: 0;
  background: linear-gradient(to right, rgba(81,87,103,1), rgba(81,87,103,0));
}
.subFooter_links_view::after {
  right: 0;
  background: linear-gradient(to left, rgba(81,87,103,1), rgba(81,87,103,0));
}

/* 실제 링크 리스트 */
.subFooter_links {
  display: flex;
  gap: 12px; /* 칩 간격으로 변경 */
  white-space: nowrap;
  padding: 6px 12px; /* 내부 여백 */
  transition: none !important;   /* 반드시 제거/무력화 */
  will-change: transform;        /* 성능 & 확실한 적용 */
}

/* 칩(Chip) 형태로 차별화 */
.subFooter_links li {
  display: flex;
  align-items: center;
}

.subFooter_links li a {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 999px;
  background: rgba(255,255,255,0.06);
  border: 1px solid rgba(255,255,255,0.14);
  color: #fff;
  font-size: 13px;
  text-decoration: none;
  line-height: 1;
  transition: background .18s ease, transform .18s ease, border-color .18s ease;
}

/* hover/focus 시 칩 강조 */
.subFooter_links li a:hover,
.subFooter_links li a:focus {
  background: rgba(255,255,255,0.14);
  border-color: rgba(255,255,255,0.28);
  outline: none;
  transform: translateY(-1px);
}

/* 기존 '|' 구분자는 칩으로 대체했으므로 제거 */
.subFooter_links li:not(:last-child)::after { content: none; }

/* 포커스 링(접근성) */
.subFooter_links li a:focus-visible {
  box-shadow: 0 0 0 3px rgba(255,255,255,0.35);
}

/* site logo 전용 공통 스타일 */
.site-logo {
    width: 150px;
    height: 45px;
    object-fit: contain;  /* 로고 비율이 깨지지 않도록 */
    display: block;
    margin: 0 auto;       /* 가운데 정렬 (옵션) */
}

/* 사이트 링크 공통 스타일 */
.table_common td .site-link {
	text-align: left !important;
	display: block !important;
	margin-left: 50px;
	font-weight: bold;
}

/* ===== Write(입력화면) 전용 컨트롤 ===== */
.definition_table .write_input,
.definition_table .write_select,
.definition_table .write_textarea {
  width: 100%;
  box-sizing: border-box;
  font-size: 15px;
  border: 1px solid #ddd;
  border-radius: 6px;
}

/* input */
.write_input {
	height: 46px;
	padding: 0 14px;
}

.write_input::placeholder,
.write_textarea::placeholder { color:#9aa1a8; }

/* select */
.write_select {
	height: 46px;
	padding: 0 38px 0 14px; /* 오른쪽은 화살표 자리 */
	appearance: none;
	background: #fff url(../images/icon_arrow.png) no-repeat right 12px
		center;
	background-size: 14px;
}

.write_select::-ms-expand { display: none; } /* IE/Edge(레거시) 화살표 제거 */

/* textarea */
.write_textarea {
	min-height: 140px;
	padding: 12px 14px;
	resize: vertical;
}

/* 파일 업로드 */
.write_file {
	width: 100%;
	font-size: 15px;
	height: 46px;
	padding: 0px;
	border-radius: 6px;
}

.write_file::file-selector-button {
	height: 100%;
	padding: 10px 14px;
	border: 1px solid #ddd;
	border-radius: 6px;
	background: #f6f6f6;
	margin-right: 10px;
	cursor: pointer;
	display: inline-flex;
}

/* 포커스 공통 */
.write_input:focus, .write_select:focus, .write_textarea:focus {
	outline: none;
	border-color: #10a628;
	box-shadow: 0 0 0 3px rgba(16, 166, 40, .12);
}

/* 필수 라벨 스타일 */
.required {
	color: #d32f2f; /* 붉은색 */
	font-weight: 700; /* 굵게 */
	font-size:16px;
}

/* 라벨 뒤에 * 자동 표시 (이미 *를 적어두셨다면 이 줄은 빼세요) */
.required::after {
	content: " *";
}

/* ===== Modal (final) ===== */
:root{
  --modal-accent:        #f57c00;            /* 주황 메인 */
  --modal-accent-border: #ffa726;            /* 테두리색(밝게) */
  --modal-accent-ring:   rgba(245,124,0,.18);/* 바깥 링 */
}

.modal-wrap{
  position: fixed;
  inset: 0;
  display: none;
  z-index: 1500;
}

.modal-wrap.is-open {
	display:block;
}

.modal-dim {
	position: absolute;
	inset: 0;
	background: rgba(0, 0, 0, .45);
}

.modal-dialog {
	position: relative;
	max-width: 520px;
	width: 92%;
	margin: 10vh auto 0;
	background: #fff;
	border-radius: 10px;
	overflow: hidden;
	/* 주황 포커스 테두리 + 링 + 드롭 섀도우 */
	border: 1px solid var(--modal-accent-border);
	box-shadow: 0 0 0 3px var(--modal-accent-ring), 0 10px 30px
		rgba(0, 0, 0, .25);
	outline: none;
}

/* 열릴 때 살짝 등장 */
.modal-wrap.is-open .modal-dialog {
	animation: modalIn .18s ease-out;
}

@keyframes modalIn {
	from {
	 transform: translateY(-6px) scale(.98);
	 box-shadow: 0 0 0 0 var(--modal-accent-ring),
	  0 6px 20px rgba(0, 0, 0, .20);
	}
	to {
	transform: none;
	box-shadow: 0 0 0 3px var(- -modal-accent-ring), 0 10px 30px
		rgba(0, 0, 0, .25);
	}
}

@media (prefers-reduced-motion: reduce) {
	.modal-wrap.is-open .modal-dialog {
		animation: none;
	}
}

.modal-head {
	display: flex;
	justify-content: space-between;
	align-items: center;
	padding: 16px 18px;
	border-bottom: 1px solid #eee;
}

.modal-title {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: 20px;
	font-weight: 700;
	line-height: 1;
}

/* 경고 아이콘 */
.caution_triangle {
	display: inline-block;
	width: 33px;
	height: 33px;
	background: url(../images/caution_triangle.svg) no-repeat center/contain;
	flex: 0 0 33px; /* 크기 고정 */
	vertical-align: middle;
}

/* 파일다운로드 아이콘 */
.download_filescript {
	display: inline-block;
	width: 33px;
	height: 33px;
	background: url(../images/download_filescript.svg) no-repeat center/contain;
	flex: 0 0 33px; /* 크기 고정 */
	vertical-align: middle;
}

.modal-close {
	border: 0;
	background: transparent;
	font-size: 24px;
	line-height: 1;
	cursor: pointer;
}

.modal-close:focus-visible {
	outline: none;
	box-shadow: 0 0 0 3px var(--modal-accent-ring);
	border-radius: 6px;
}

.modal-body {
	padding: 18px;
	font-size: 15px;
	line-height: 1.6;
}

/* 'ㆍ' 글머리 + 굵게 */
.modal-body ul {
	margin: 8px 0 0;
	padding-left: 0;
	list-style: none;
}

.modal-body li {
	position: relative;
	padding-left: 1.1em;
	font-weight: 700;
}

.modal-body li::before {
	content: "ㆍ";
	position: absolute;
	left: 0;
	top: 0;
}

.modal-foot {
	display: flex;
	justify-content: flex-end;
	gap: 8px;
	padding: 12px 18px;
	border-top: 1px solid #f1f1f1;
}

/* 다이얼로그가 포커스를 받을 때도 같은 룩 유지 */
.modal-dialog:focus, .modal-dialog:focus-visible {
	outline: none;
	border-color: var(--modal-accent-border);
	box-shadow: 0 0 0 3px var(--modal-accent-ring), 0 10px 30px
		rgba(0, 0, 0, .25);
}

/* ===== invalid 표시 ===== */
.is-invalid {
	border-color: #d32f2f !important;
	background: #fff7f7;
}

.invalid-help {
	color: #d32f2f;
	font-size: 13px;
	margin-top: 6px;
}

.help {
	font-size: 13px;
}

/* 개행/연속 공백 유지 + 자동 줄바꿈 */
.pre-line { white-space: pre-line; word-break: break-word; }

/* 파일 업로드, 다운로드 관련 */
.file-list {
	margin-top: 8px;
}

/* 숨김 처리 */
.file-input-hidden {
	display: none;
}

.file-control {
	display: flex;
	align-items: center;
	margin-bottom: 5px;
	border-bottom: 1px solid #eee;
	padding-bottom: 8px;
}

/* 커스텀 버튼 스타일 */
.btn_file  {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	vertical-align: middle;
	padding: 6px 12px;
	background: #4b5563; /* 진한 회색 */
	color: #fff;
	border-radius: 4px;
	cursor: pointer;
	font-size: 14px;
	margin-right: 8px;
	height: 25px;
	width: 70px;
	border: 2px solid transparent; /* 기본 투명 border */
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
	
}

.btn_file:hover {
	background-color: #fff;    /* 호버시 배경 → 흰색 */
	border-radius: 5px;
	border: 2px solid #4b5563;
	color: #4b5563;            /* 호버시 글자 → 원래 배경색 */
	cursor: pointer;
}

.file-status {
	margin-left: 8px;
	color: #6b7280;
	font-size: 13px;
	font-weight: 700;
}

.file-item {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: 8px 10px;
	border: 1px solid #e5e7eb;
	border-radius: 8px;
	margin-bottom: 6px;
	background: #fafafa;
}

.file-info {
	display: flex;
	gap: 10px;
	align-items: center;
	overflow: hidden;
}

.file-name {
	max-width: 420px;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
}

.file-size {
	font-size: 12px;
	color: #6b7280;
}

.file-remove {
	border: none;
	background: #fff;
	color: #ef4444;
	font-weight: 700;
	cursor: pointer;
	width: 28px;
	height: 28px;
	line-height: 26px;
	text-align: center;
	border-radius: 50%;
	border: 1px solid #fca5a5;
}

.file-remove:hover {
	background: #fee2e2;
}

/* 썸네일/아이콘 공통 컨테이너 */
.file-icon {
	width: 40px;
	height: 40px;
	border-radius: 6px;
	border: 1px solid #e5e7eb;
	background: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	overflow: hidden;
	flex: 0 0 40px; /* 고정 폭/높이 보장 */
}

/* 이미지 썸네일은 꽉 차게 */
.file-thumb {
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
}

/* SVG 아이콘도 40x40으로 강제 */
.file-icon svg {
	width: 40px;
	height: 40px;
}

/* (추천) 리스트 좌측 블록 정렬 보정 */
.file-left {
	display: flex;
	align-items: center;
	gap: 10px;
	overflow: hidden;
}

/* 첨부 리스트 */
.attach-list {
	list-style: none;
	padding: 0;
	margin: 0;
}

/* 첨부 모달은 들여쓰기, 얇게 */
.modal-body .attach-list { margin:0; padding:0; list-style:none; }

.modal-body .attach-list li {
  font-weight: 400 !important;   /* 전역 700 무력화 */
  padding-left: 0 !important;    /* 전역 들여쓰기 제거 */
  position: static !important;   /* 불필요한 before 위치 초기화 */
}
.modal-body .attach-list li::before { content: none !important; }

/* 아이템 레이아웃: 아이콘 + 텍스트 */
.attach-list>li {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 8px 0;
	border-bottom: 1px solid #f2f2f2;
}

.attach-list li {
	display: flex;
	align-items: center;
	gap: 10px;
	padding: 10px 0;
	border-bottom: 1px solid #e5e7eb;
}

.attach-list li:last-child {
	border-bottom: none;
}

/* 첨부파일 목록 항목 */
.attach-item {
	display: block; /* 혹시 inline 상태라면 block으로 */
	padding: 6px 0 6px 16px; /* 위아래 6px, 왼쪽 16px 여백 */
	border-bottom: 1px solid #eee;
	font-size: 14px;
	color: #333;
}

/* 마지막 항목은 구분선 제거 */
.attach-item:last-child {
	border-bottom: none;
}

.attach-file-icon {
	width: 40px;
	height: 40px;
	flex: 0 0 40px;
	border: 1px solid #e5e7eb;
	border-radius: 6px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #fff;
	overflow: hidden;
}

.attach-file-info {
	display: flex;
	flex: 1;
	align-items: baseline;
	gap: 8px;
	min-width: 0;
}

.attach-file-name {
	flex: 1;
	min-width: 0;
	max-width:56vw;
	white-space: nowrap;
	overflow: hidden;
	text-overflow: ellipsis;
	text-decoration: none;
	color: #1f2937; /* 기본 진회색 */
	transition: font-weight 0.2s;
}

.attach-file-name:hover {
	font-weight: 700; /* hover 시 굵게 */
}

.attach-file-size {
	color: #6b7280;
	font-size: 12px;
	white-space: nowrap;
}

.attach-link{display:inline-flex;align-items:center;gap:2px;color:#333;text-decoration:none;}
.attach-link:hover{color:#007aff}
.attach-count{font-size:12px;line-height:1;margin-left:2px}

/* 강조 타이틀 */
.form-alert-msg .hl { color:#CF595B; font-weight:700; }

/* 섹션 간격: 각 제목 위에 여백 추가 */
.form-alert-msg p { margin: 0; } /* 기본값 리셋 */
.form-alert-msg p:not(:first-of-type) { margin-top: 14px; } /* 두 번째 제목부터 간격 */
.form-alert-msg p + ul { margin: 6px 0 0 1.1em; }          /* 제목 아래 목록 간격 */

/* 구분선(선택) */
.form-alert-msg .alert-sep {
  border: none;
  border-top: 1px solid #e5e7eb;
  margin: 12px 0;        /* 섹션 사이 간격 */
}

/* 리스트 가독성(선택) */
.form-alert-msg li { line-height: 1.6; margin: 2px 0; }

/* 토글 스위치 기본 스타일 */
.switch {
  position: relative;
  display: inline-block;
  width: 46px;
  height: 24px;
}
.switch input { display:none; }
.slider {
  position: absolute;
  cursor: pointer;
  top: 0; left: 0; right: 0; bottom: 0;
  background-color: #ccc;
  transition: .3s;
  border-radius: 24px;
}
.slider:before {
  position: absolute;
  content: "";
  height: 18px; width: 18px;
  left: 3px; bottom: 3px;
  background-color: white;
  transition: .3s;
  border-radius: 50%;
}
input:checked + .slider {
  background-color: #3b82f6; /* 파란색 */
}
input:checked + .slider:before {
  transform: translateX(22px);
}
.slider.round { border-radius: 24px; }


/* 공통 달력 버튼 툴팁 */
.calendar-btn {
  position: relative;
  display:inline-flex;
  align-items:center;
  justify-content:center;
}

.calendar-btn::after {
  content: attr(aria-label);
  position: absolute;
  bottom: -42px;             /* 버튼 아래쪽 */
  left: 50%;
  transform: translateX(-50%);
  background: rgba(0,0,0,0.8);
  color: #fff;
  padding: 3px 8px;
  font-size: 12px;
  border-radius: 4px;
  white-space: nowrap;
  opacity: 0;
  pointer-events: none;
  transition: opacity .2s;
}

.calendar-btn:hover::after,
.calendar-btn:focus-visible::after {
  opacity: 1;
}


/* === 수의계약 희망업체 : 떠다니는 액션 버튼 === */

/* 두 개 버튼을 담는 그룹(오른쪽 아래 고정) */
.hope-floating-actions {
	position: fixed;
	right: 40px; /* 화면 오른쪽 끝에서 40px 안쪽 */
	bottom: 230px; /* 페이징 위쪽쯤에 오도록 여유 높이 */
	display: flex;
	flex-direction: column;
	gap: 12px;
	z-index: 1200; /* 헤더(1100)보다 위 */
}

/* 따라다니는 버튼 (동그란 버튼) */

.fab-btn {
	box-shadow: 0 4px 8px rgba(0, 0, 0, 0.15), 0 6px 20px
		rgba(0, 0, 0, 0.12);
	transition: all .25s ease;
}

.fab-btn img {
	pointer-events: none; /* ripple 영역 위에 있어도 클릭 방해 안함 */
	display: block;
}

.fab-btn:hover {
	box-shadow: 0 8px 16px rgba(0, 0, 0, 0.25), 0 12px 32px
		rgba(0, 0, 0, 0.20);
	transform: translateY(-3px); /* 위로 살짝 떠오르는 효과 */
}

/* 등록 */
.fab-btn.fab-write {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	border: 2px solid #ff5c6a;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	font-weight: 600;
	color: #fff;
	box-shadow: 0 8px 16px rgba(0, 0, 0, .18);
}

/* TOP */
.fab-btn.fab-top {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	border: 2px solid #4b5563;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	font-weight: 600;
	color: #fff;
	box-shadow: 0 8px 16px rgba(0, 0, 0, .18);
}

.fab-btn.fab-bottom {
	width: 56px;
	height: 56px;
	border-radius: 50%;
	border: 2px solid #4b5563;
	cursor: pointer;
	display: flex;
	align-items: center;
	justify-content: center;
	font-size: 14px;
	font-weight: 600;
	color: #fff;
	box-shadow: 0 8px 16px rgba(0, 0, 0, .18);
}


/* 등록 버튼 색상 (기존 하단 등록 버튼 톤 맞춰서 핑크 계열) */
.fab-btn.fab-write {
	background: #ff5c6a;
	color: #fff;
	transition: all .25s ease;
}

.fab-btn.fab-write:hover {
	background: #fff;
	color: #ff5c6a;
	border: 2px solid #ff5c6a;
}

/* TOP 버튼 색상 */
.fab-btn.fab-top {
	background: #4b5563;
	color: #fff;
	transition: all .25s ease;
}

.fab-btn.fab-top:hover {
	background: #fff;
	color: #4b5563;
	border: 2px solid #4b5563;
}

/* bottom 버튼 색상 */
.fab-btn.fab-bottom {
	background: #4b5563;
	color: #fff;
	transition: all .25s ease;
}

.fab-btn.fab-bottom:hover {
	background: #fff;
	color: #4b5563;
	border: 2px solid #4b5563;
}

/* ==============================
   SVG 아이콘 전용 TOP/BOTTOM FAB
   ============================== */

/* 공통 스타일 오버라이드 */
.fab-btn.fab-top,
.fab-btn.fab-bottom {
	font-size: 0 !important;     /* 텍스트 공간 제거 */
	font-weight: normal !important;
	color: transparent !important; /* 글자색 제거 */
	border: none !important;     /* 불필요한 테두리 제거 */
	background: #4b5563;         /* 기본 배경 */
	padding: 0;
}

/* SVG 아이콘 크기 및 색상 */
.fab-btn.fab-top img,
.fab-btn.fab-bottom img {
	width: 26px;
	height: 26px;
	filter: brightness(0) invert(1); /* 아이콘을 흰색처럼 보이게 */
	pointer-events: none;
}

/* Hover */
.fab-btn.fab-top:hover,
.fab-btn.fab-bottom:hover {
	background: #fff;
}

.fab-btn.fab-top:hover img,
.fab-btn.fab-bottom:hover img {
	filter: none; /* 원래 아이콘 색상(검정/회색)으로 */
}

/* Optional: Hover 그림자 강조 */
.fab-btn.fab-top:hover,
.fab-btn.fab-bottom:hover {
	box-shadow:
		0 8px 18px rgba(0,0,0,0.28),
		0 2px 6px rgba(0,0,0,0.22);
}


/* 좁은 화면에서는 조금 더 안쪽으로 */
@media ( max-width : 1260px) {
	.hope-floating-actions {
		right: 16px;
		bottom: 90px;
	}
}

.fab-btn[data-tooltip] {
	position: relative;
}

.fab-btn[data-tooltip]::after {
	content: attr(data-tooltip);
	position: absolute;
	right: 70px; /* 버튼 왼쪽에 표시 */
	top: 50%;
	transform: translateY(-50%);
	background: rgba(0,0,0,0.78);
	color: #fff;
	padding: 6px 10px;
	border-radius: 6px;
	font-size: 13px;
	white-space: nowrap;
	opacity: 0;
	pointer-events: none;
	transition: opacity .2s ease;
	z-index: 9999;
}

.fab-btn[data-tooltip]:hover::after {
	opacity: 1;
}

.tooltip-aria {
  position: relative;
}

/* aria-label 값으로 툴팁 표시 */
.tooltip-aria:hover::after,
.tooltip-aria:focus-visible::after {
  content: attr(aria-label);
  position: absolute;
  bottom: -37px;     /* 버튼 아래 여백 */
  left: 50%;
  transform: translateX(-50%);
  background: rgba(0,0,0,.85);
  line-height: 1.3;        /* ← 기본 line-height(1.6~1.8)보다 작게 */
  padding: 6px 10px;        /* ← 적당한 얇은 padding */
  color: #fff;
  font-size: 12px;
  border-radius: 4px;
  white-space: nowrap;
  opacity: 1;
  pointer-events: none;
  z-index: 999;
}

/* 애니메이션 전 상태 (투명) */
.tooltip-aria::after {
  opacity: 0;
  transition: opacity .2s ease;
}

.pwd-status {
	margin-left: 8px;
	font-size: 0.9em;
	vertical-align: middle;
}

.pwd-status.ok {
	color: #16a34a; /* 초록 */
}

.pwd-status.error {
	color: #dc2626; /* 빨강 */
}