/* ================= 
 sub01_01 
================= */
.intro{color:#1f2937;}

/* 헤드라인 */
.intro-visual{display:block;width:100%;height: auto;padding:20px;border-radius: 12px;background: linear-gradient(180deg, #f7fbff 0%, #ffffff 100%);overflow: hidden;}
.intro-lead{font-size:48px; line-height:1.15; margin:0 0 20px;color:#034694;font-weight:600;/* 초록 */}
	.intro-lead span{display:inline-block;opacity:0;transform:translateY(8px);animation:leadWord .55s ease-out forwards;}
	.intro-lead span:nth-child(1){ animation-delay:.00s; }
	.intro-lead span:nth-child(2){ animation-delay:.06s; }
	.intro-lead span:nth-child(3){ animation-delay:.12s; }
	.intro-lead span:nth-child(4){ animation-delay:.18s; }
	.intro-lead span:nth-child(5){ animation-delay:.24s; }
	.intro-lead span:nth-child(6){ animation-delay:.30s; }
	.intro-lead span:nth-child(7){ animation-delay:.36s; }
.intro-lead span i {text-decoration:none;font-weight:300; font-style: normal;}

	@keyframes leadWord{
	  to{opacity:1; transform:translateY(0);}
	}
	@media (prefers-reduced-motion: reduce){
	  .intro-lead span{ animation:none; opacity:1; transform:none; }
	}
.intro-title{ line-height:1.3;font-size:38px;color:#111; font-weight:600;}
.intro-desc{font-size:38px;font-weight:600;color:#111; line-height:1.3;margin:0 0 30px;}
.intro-link{/*color:#22c55e;text-decoration: underline;text-decoration-color: #111;text-decoration-thickness: 1px;text-underline-offset: 8px; text-decoration-skip-ink: auto;*/}
.intro-link:hover{/*color:#003a7d;text-decoration-color:#003a7d;*/}

/* 본문 텍스트 */
.intro-copy{display:flex; flex-direction:column; gap:14px; margin-bottom:24px;}
.intro-copy p{font-size:22px; line-height:160%; margin:0;color:#333;letter-spacing:-.035em}

/* 안내 카드 섹션 */
.intro-guide{display:grid;grid-template-columns: 1fr 1fr; /* 2열 */gap:18px;align-items:stretch; grid-auto-rows: 1fr;}
.intro-card{background:#F7F7FB;border:1px solid #e5e7eb;border-radius:6px;padding:16px;height:100%;}
.intro-card-title{display:flex; align-items:center; gap:8px;font-size:20px; font-weight:700; color:#111111; margin:0 0 12px;}

/* 아이콘 자리 */
.icons{width:24px; height:24px; inline-size:24px; block-size:24px; flex:0 0 24px;display:inline-block;background-position: center;background-repeat: no-repeat;background-size:contain;}
/* 체크 아이콘 */
.icon--check{background-image:url('../img/check_icon.svg');}
.icon--check::after{}

/* 카드 내부 그리드 */
.intro-card-grid{display:grid;grid-template-columns: 280px 1fr; gap:16px; align-items: stretch; /* ← start → stretch 로 변경 */}
.intro-media{ width:280px;height:160px;border-radius:6px;background:#e5e7eb;position: relative;overflow: hidden; border:1px solid #e5e7eb;display:block; }


.intro-media > div{width:100%;height:100%;pointer-events:none;}
.intro-media img{display:block;width:100%;height:100%;object-fit:cover;}

.intro-card-text p{font-size:18px; line-height:160%; margin:0 0 8px; color:#444;}
.intro-card-text p:last-child{margin-bottom:0;}

/* 반응형 */
@media (max-width:1440px){
  .intro-lead{font-size:42px;}
  .intro-title{font-size:34px;}
  .intro-desc{font-size:34px;}
  .intro-copy p {font-size:20px;}
}
@media (max-width:1280px){
  .intro-guide{display:flex;flex-direction:column;gap:18px;}
}
@media (max-width:1024px){
  .intro-lead{font-size:38px;}
  .intro-title{font-size:28px;}
  .intro-desc{font-size:28px;}
  .intro-copy p {font-size:20px;}
  .intro-card-title {font-size:18px;}
  .intro-card-text p {font-size:16px;}
  .intro-card-grid{grid-template-columns:240px 1fr;}
  .intro-media{width:240px;}

}
@media (max-width:768px){
  .container{/*padding:20px 16px;*/}
  .intro-lead{font-size:36px;}
  .intro-title{font-size:26px;}
  .intro-desc{font-size:26px;}
  .intro-copy p {font-size:18px;}
  .intro-card{padding:14px;}
  .intro-card-grid{ grid-template-columns:1fr; gap:12px; }
  .intro-media{ width:100%; aspect-ratio: 7 / 4; height:auto; }
 
  /* 높이를 자르고싶다면
      .intro-media{ width:100%; height:160px; }
     로 교체 가능 (Safari 14+ 지원) */
 
}





/* 카드 최소높이 정의 */
.soh-tabs-cards{ --soh-card-min-h: 250px; }

/* ================= 
탭메뉴 sub03_01 서브메인페이지 전용 sub03_02는 아래에있음
================= */
.soh-tabbar{ display:flex; flex-wrap:wrap; gap:12px; margin-bottom:56px; } /* 탭과 카드 간격 */
.soh-tab{font-size:18px; appearance:none; border:1px solid #cfd7e8; background:#fff; color:#1c2a44;padding:14px 28px; border-radius:12px; cursor:pointer; font-weight:500;line-height:1;  
  transition:box-shadow .15s, background-color .15s, color .15s, border-color .15s;}
.soh-tab:hover{border-color:#b9c2d6;box-shadow:0 2px 8px rgba(11,63,134,.18);outline:0;}
.soh-tab.is-active{ background:var(--primary); color:#fff; border-color:var(--primary); box-shadow:0 2px 8px rgba(11,63,134,.18); }
.soh-tab:focus-visible{ outline:3px solid color-mix(in oklab, #2f7efb 55%, transparent); outline-offset:2px; }



/* 탭바 100% 채우기 */
.soh-tabbar--autofit{display:grid !important;grid-template-columns: repeat(auto-fit, minmax(160px, 1fr));gap:12px;}
.soh-tabbar--autofit .soh-tab{ width:100%; text-align:center; }

@media (max-width:1440px){
  .soh-tabbar{ margin-bottom:46px; }
  .soh-tab{ font-size:16px; padding:12px 24px; }
}
@media (max-width:1280px){
  .soh-tabbar{margin-bottom:30px; }
  .soh-tab{padding:10px 24px; }
}
@media (max-width:768px){
  .soh-tabbar{}
  .soh-tab{ font-size:14px;}
}


/* ================= 
Carousel
================= */
.soh-carousel{position:relative;overflow-x:clip;/* 가로만 클립 */overflow-y:visible;}
	@supports not (overflow-x:clip){
	  .soh-carousel{ overflow-x: hidden; }
	}

/*  현재 페이지 영역(Viewport): 높이를 페이지마다 맞춤 */
.soh-viewport{position:relative;overflow:hidden;width:100%;transition: height .25s ease;touch-action: pan-y; }

/* Track (translateX로 이동) */
.soh-track{display:flex; width:100%;align-items:flex-start;transition:transform .35s ease;will-change:transform;}

/* 한 페이지 = 100% 폭, 카드 그리드 */
.soh-page{flex:0 0 100%;align-self:flex-start;/* 트랙 높이에 따라 늘어나지 않게 */display:grid; gap:40px; padding:0; box-sizing:border-box;grid-template-columns:repeat(4, minmax(0,1fr));
  grid-auto-rows:minmax(var(--soh-card-min-h), auto);align-content:start;}/* 남는 높이 있어도 행 확장 금지 */
		@media (max-width:1440px){ .soh-page{ gap:30px; } }
		@media (max-width:1280px){ .soh-page{ grid-template-columns:repeat(3, minmax(0,1fr)); gap:20px; } }
		@media (max-width:1024px){ .soh-page{ grid-template-columns:repeat(2, minmax(0,1fr)); } }
		@media (max-width:640px){
		  .soh-page{ grid-template-columns:repeat(1, minmax(0,1fr)); }
		  .soh-tabs-cards{ --soh-card-min-h: 200px; }
		}

/* ================= 
Card
================= */
a.soh-card{ text-decoration:none; color:inherit; }
.soh-card{position:relative;z-index:0;height:auto; min-height:var(--soh-card-min-h);border:1px solid #cfd7e8; border-radius: var(--radius, 16px);
  background:#fff; padding:18px;display:flex; flex-direction:column; gap:10px; justify-content:space-between;transition: box-shadow .15s ease, transform .15s ease, border-color .15s ease; overflow:hidden;}
.soh-card:hover{ box-shadow:0 4px 10px rgba(16,29,58,.08);transform:none; border-color:transparent;box-shadow:inset 0 0 0 4px #052A75, 0 4px 10px rgba(16,29,58,.08);}
.soh-card:focus-visible{transform: none;border-color:transparent;box-shadow:inset 0 0 0 4px #052A75,0 0 0 3px rgba(47,126,251,.20), 0 4px 10px rgba(16,29,58,.08);}

/* 텍스트 */
.soh-card__txt{ display:flex; flex-direction:column;gap:8px; }/* padding-right:84px*/
.soh-card__badge{align-self:flex-start; display:inline-flex; align-items:center; justify-content:center;height:28px; padding:0 10px; border-radius:8px; background:#f3f5f9; color:#6f7e96;
  font-size:14px; font-weight:400; letter-spacing:.02em;}
.soh-card__title{ margin:0; font-size:24px; font-weight:500; color:#111; letter-spacing:-.01em;line-height:1.15}
/* 카드 제목 2줄 말줄임 */
.soh-card__title, .soh-card__title a{display: -webkit-box; -webkit-line-clamp:2;/* 2줄까지만 */-webkit-box-orient:vertical;overflow:hidden;text-overflow:ellipsis;line-height:1.15; /*위에랑맞춰야함 */
  word-break: keep-all; overflow-wrap: anywhere;}
  .soh-card__meta{ margin:0; font-size:18px; font-weight:400; color:#666; }
		@media (max-width:1440px){ 
			.soh-card__title{font-size:20px;} .soh-card__meta{font-size:18px;}
		}
		@media (max-width:768px){
			.soh-card__title{font-size:18px;} .soh-card__meta{font-size:16px;}
		}

/* 패널 show/hide */
.soh-panels .soh-panel{ display:none; }
.soh-panels .soh-panel.is-active{ display:block; }

/* 아이콘: 우하단 */
.soh-card__icon{ position:absolute; right:14px; bottom:14px; width:64px; height:64px; }
.soh-card__icon img{ width:64px; height:64px; object-fit:contain; display:block; transition:opacity .12s; }

/* ================= 
Controls
================= */
.soh-controls{width:100%; margin-bottom:16px;display:grid !important; grid-template-columns: 1fr auto 1fr; align-items:center;position:relative; z-index:1;}
.soh-nav{width:48px; height:48px; cursor:pointer;background-repeat:no-repeat; background-position:center; background-size:40px 40px;}
.soh-nav--prev{ grid-column:1; justify-self:start;background-image:url("../img/basic_left.svg");}
.soh-nav--prev:hover, .soh-nav--prev:focus-visible{background-image:url("../img/hover_left.svg");}
.soh-nav--next{ grid-column:3; justify-self:end;background-image:url("../img/basic_right.svg");}
.soh-nav--next:hover, .soh-nav--next:focus-visible{background-image:url("../img/hover_right.svg");}
.soh-nav[disabled]{ opacity:.3; pointer-events:none; }

/* 도트 중앙 */
.soh-dots{ grid-column:2; display:flex; gap:8px; justify-self:center; margin-inline:auto; }
.soh-dots button{ width:8px; height:8px; border-radius:50%; border:0; background:#cdd6e7; cursor:pointer; }
.soh-dots button[aria-current="true"]{ background:#0B3F86; }

		/* 접근성 - 모션 최소화 */
		@media (prefers-reduced-motion: reduce){
		  .soh-track{ transition:none; }
		  .soh-card:hover{ transform:none; }
		}








/* ===== 통계상세페이지 sub03_02 임시===== */
/* ================= 
    탭메뉴
================= */
/* 드롭다운: hidden 강제 숨김(어떤 CSS가 있어도 무조건 숨김) */
[hidden] { display:none !important; }

/* 탭:링크 전용(hover만 효과, 클릭 시 페이지 이동) */
.sdx-tabbar {margin-bottom:56px; }
.sdx-tabbar--full{display:grid !important;grid-template-columns: repeat(auto-fit, minmax(160px, 1fr)); gap:12px;}
.sdx-tab{appearance:none;line-height:1;  
  display:inline-flex; align-items:center; justify-content:center;
  padding:14px 28px; border:1px solid #cfd7e8; border-radius:12px;
  background:#fff; color:#1c2a44; text-decoration:none;
  font-size:18px; font-weight:500; cursor:pointer;
  transition: box-shadow .15s, background-color .15s, color .15s, border-color .15s;}
.sdx-tab:hover,
.sdx-tab:focus-visible{border-color:#b9c2d6;box-shadow:0 2px 8px rgba(11,63,134,.18);outline:0;}

/* 현재 페이지에만 is-active를 넣어주면 스타일 적용 */
.sdx-tab.is-active{background:var(--primary, #0B3F86);color:#fff; border-color:var(--primary, #0B3F86);box-shadow:0 2px 8px rgba(11,63,134,.18);}

		/* 반응형 */
		@media (max-width:1440px){
		  .sdx-tabbar{ margin-bottom:46px; }
		  .sdx-tab{ font-size:16px; padding:12px 24px; }
		}
		@media (max-width:1280px){
		  .sdx-tabbar{ margin-bottom:30px; }
		  .sdx-tab{padding:10px 24px; }
		}
		@media (max-width:1024px){

		 

		}
		@media (max-width:768px){
		  .sdx-tab{ font-size:14px;}
		}

/* 타이틀 + 더보기 */
.sdx-head{ display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:30px; flex-wrap:wrap; }
.sdx-title{ margin:0;font-size:40px;font-weight:600;letter-spacing:-.01em; color:#111;}
.sdx-subtitle{ margin:0;color:#333; font-size:24px; }

.sdx-more{ position:relative;}
.sdx-more__btn{height:38px; padding:0 14px; border-radius:10px; background:var(--primary);color:#fff;border:0;cursor:pointer;font-weight:400;font-size:15px;
  display:inline-flex; align-items:center; gap:8px;   /* 아이콘 자리 + 정렬 */}
.sdx-more__btn:focus-visible{outline:3px solid color-mix(in oklab, #2f7efb 55%, transparent);outline-offset:2px;}

/* ▼ 아이콘 */
.sdx-more__btn::after{content:"";width:24px; height:24px; inline-size:24px; block-size:24px;background:url('../img/down_arr.svg') center/24px 24px no-repeat;transition: transform .2s ease;}
/* 펼쳐졌을 때 ▲ 로 회전 */
.sdx-more__btn[aria-expanded="true"]::after{transform: rotate(180deg);}


		@media (max-width:768px){
			.sdx-head{display:grid;grid-template-columns:1fr;row-gap:10px;align-items:start;}
			 /* 제목+부제(div)는 위에 두 줄로 그대로, '더보기'는 그 아래 줄로 */
			.sdx-head .sdx-more{grid-column:1;grid-row:3;justify-self:stretch;/* 오른쪽 정렬(원하면 start 로 바꿔도 됨)/ 대신 다운되는 메뉴 위치조정필요 */ width:100%}
		}

.sdx-menu{position:absolute; right:0; top:calc(100% + 8px); min-width:280px; max-width:min(560px, 92vw);border:1px solid #e6ebf5; border-radius:12px;
	max-height:clamp(280px, 50vh, 460px);overflow-y: auto;/* 모바일 스크롤 감도/바디 스크롤 방지 */-webkit-overflow-scrolling: touch;overscroll-behavior: contain;
	background:#fff; box-shadow:0 6px 18px rgba(16,29,58,.08);  padding:6px; display:flex; flex-direction:column; gap:2px; z-index:20;}
.sdx-menu a{padding:10px 12px; border-radius:10px; color:#1c2a44; text-decoration:none; line-height:1.35; word-break:keep-all; overflow-wrap:anywhere;}
.sdx-menu a:hover, .sdx-menu a:focus-visible{background:#f2f6ff; outline:0;}

		/* 768px 이하: 화면을 더 활용(버튼을 100%로 쓰는 기존 규칙과 함께 동작) */
		@media (max-width:768px){
		  .sdx-menu{
			max-height: 40vh;     /* 화면의 40%까지만 펼치고 나머지는 스크롤 */
		  }
		}
/* ========== 값선택 영역 ========== */
.sdx-filter{border:1px solid #e8ecf5;border-radius:12px;background:#f7f8fc;padding:16px;margin:16px 0 24px;overflow: visible;}
.sdx-filter__head{display:flex; align-items:center; gap:6px;padding-bottom:12px;border-bottom:1px solid #e8ecf5;   /* 안내문과 필드 사이 구분선 */}
.sdx-filter__title{margin:0; font-size:20px; font-weight:500; color:#444;}

/* 아이콘(체크) */
.sdx-ico{inline-size:24px; block-size:24px; flex:0 0 24px;display:inline-block;background-position: center;background-repeat: no-repeat;background-size:contain; }
.sdx-ico--check{background-image:url('../img/check_icon.svg');}

/* 본문: 해당년ㄴ도 */
.sdx-filter__body{ padding-top:12px;display:flex;align-items:center;gap:10px; }
.sdx-filter__body span {font-size:16px;color:#555;font-weight:500}
.sdx-filter__body a{border:1px solid #ddd;padding:6px 20px;border-radius:6px;background:#fff;font-size:15px;transition:.3s;} 
.sdx-filter__body a:hover,.sdx-filter__body a:active,.sdx-filter__body a:focus{background:#4689F6;color:#fff;border-color:#4689F6;}
.sdx-filter__body a.is-active{background:#4689F6;color:#fff;border-color:#4689F6;}



/* 자료더보기 박스(화살표 포함) */
.sdx-selectwrap{position:relative;min-width: 160px;/* 너무 좁지 않게 기본 폭 */max-width: 100%;display:inline-block;}
.sdx-selectwrap::after{content:""; position:absolute; right:12px; top:50%; transform:translateY(-50%); width:24px; height:24px; pointer-events:none;
  background: url('../img/down_arrb.svg') center/24px 24px no-repeat;}

/* 셀렉트박스 */
.sdx-select{width:100%; height:44px;padding:0 36px 0 14px;/* 오른쪽은 화살표 여백 */border:1px solid #cfd7e8; border-radius:10px;background:#fff; color:#1c2a44;
	appearance:none; -webkit-appearance:none; -moz-appearance:none;font-size:16px; line-height:44px; cursor:pointer;white-space:nowrap; overflow:hidden; text-overflow:ellipsis;/* 긴 텍스트 한 줄 표시 + 말줄임 */}
.sdx-select:focus{ outline:0; box-shadow:0 0 0 3px rgba(47,126,251,.2); border-color:#b7c6ea; }
.sdx-select:hover{ border-color:#b7c6ea; }
.sdx-select.is-placeholder{ color:#8f9bb3; }

		/* 반응형(모바일에서 폭 100%) 시실 굳이 안해도 상관은 없음 */
		@media (max-width:768px){
		  .sdx-selectwrap{ width:100%; }
		}

/* 그래프 영역*/
.sdx-chartcard{border:1px solid #dfe3ec; border-radius:12px; /*background:var(--graybg);*/padding:40px 36px; box-shadow:none;}
.sdx-chartcard__head{display:grid;grid-template-columns: 1fr auto;  /*가운데 정렬 시 1fr auto 1fr*/align-items:center;gap:12px;margin-bottom:12px;}
/* 제목*/
.sdx-chartcard__title{grid-column:1;/* 가운데 칸에 위치 시 2*/margin:0;text-align:left;font-size:28px;line-height:1.25;font-weight:500;word-break: keep-all;overflow-wrap: anywhere;color:#222;}
/* 툴은 우측 정렬 */
.sdx-chartcard__tools{grid-column:2;justify-self:end;align-self: start;display:flex;gap:8px;min-width:104px;/* 48+48+8 */}
/* 그래프 부가설명*/
.sdx-tit-plus {font-size:17px;color:#555;}


.sdx-iconbtn{width:48px; height:48px;background-repeat:no-repeat;background-position:center;
  background-image:url('../img/sdownload.svg');
  background-repeat:no-repeat;background-size: 48px 48px; background-position:center; cursor:pointer;}
.sdx-iconbtn--share{background-image:url('../img/sprint.svg');}
.sdx-iconbtn:is(:hover,:focus-visible){ border-color:#c8d2ea; box-shadow:0 2px 8px rgba(16,29,58,.08); outline:0; }


/* 캔버스 영역(차트 라이브러리가 크기 제어) */
.sdx-chart{ width:100%; height:auto; display:block;margin-top:40px }
.sdx-chart canvas{ width:100% !important; height:auto !important; display:block; }



.xl-note{border-radius: 8px;padding: 10px 0px;color: #374151;font-size: 15px;line-height: 1.6; /*white-space: pre-wrap;*/}


/*엑셀다운로드*/
.excel-download{ display: grid; grid-template-columns:auto; gap: 12px;align-items: start;margin-top: 20px;}
/* 버튼 */
.xl-btn{justify-self:end;grid-column: 1 / -1;margin-top: 16px; display:inline-flex; align-items:center; gap:10px;padding: 10px 18px;background:#137C3F;color:#fff;border-radius:10px;text-decoration:none;font-weight:500;line-height:1;transition: background .15s ease, transform .12s ease, box-shadow .15s ease;}
.xl-btn:hover{ background:#0A6731; transform: translateY(-1px); }
.xl-btn:active{ transform: translateY(0); }

.xl-note{overflow-x: auto; -webkit-overflow-scrolling: touch;max-width:100%;border-radius:10px !important;}
.xl-note table {width:100% !important; min-width: 1100px;border-collapse:collapse;width:max-content;}
.xl-note table td, .xl-note table th {padding:6px 6px; border: 1px solid #a2b2d8 !important;color:#444;font-weight:400;}
.xl-note table tr:first-child td {background-color:#F4F8FF !important;}
.xl-note table tr:first-child td {padding:8px 6px;color:#333;}
.xl-btn__icon{width:24px; height:24px; flex:0 0 24px;background:url('../img/exel_down.svg') center/contain no-repeat;}

/* 모바일: 전체폭 채우기 */
@media (max-width: 768px){
  .excel-download{ grid-template-columns: 1fr; }
  .xl-btn{width:100%; justify-content:center; }
  /* 그래프 부가설명*/
 .sdx-tit-plus {font-size:16px;}
 .xl-note {font-size:14px;}
}

	/* 반응형 */
	@media (max-width:1440px){
		.sdx-title{ font-size:38px; }
		.sdx-subtitle {font-size:22px;}
		.sdx-filter__title {font-size:18px;}
		.sdx-chartcard__title {font-size:26px;}
		.sdx-chartcard {padding:32px;}
	}
	@media (max-width:1280px){
		.sdx-title{ font-size:36px; }
		.sdx-subtitle {font-size:20px;}
		.sdx-filter__title {font-size:16px;}
		.sdx-chartcard__title {font-size:24px;}
	}
	@media (max-width:1024px){
	  .sdx-title{ font-size:32px; }
	  .sdx-subtitle {font-size:18px;}
	  .sdx-chartcard {padding:20px;}
	  .sdx-chart{} /* 캔버스 영역(차트 라이브러리가 크기 제어) */
	  .sdx-chartcard__title {font-size:22px;}
	  .sdx-tit-plus {font-size:14px;]
	  .sdx-iconbtn{width:42px;height:42px;background-size:42px 42px;}
	  .sdx-chartcard__tools{min-width: 92px;}
	}
	@media (max-width:768px){
	  .sdx-title{ font-size:26px; }
	  .sdx-subtitle {font-size:16px;}
	  .sdx-more__btn{ height:36px;width: 100%; justify-content: center; border-radius: 12px;}
	  .sdx-more .sdx-menu{left: 0;/* 기존 right:0 우선순위보다 강하게 */right: 0; min-width: 0;width: 100%;max-width: 100%; top: calc(100% + 8px);     /* 버튼 바로 아래 */} 
	  .sdx-chartcard {padding:20px 12px;}

	  .sdx-iconbtn{ width:36px; height:36px; background-size:36px 36px; }
	  .sdx-chartcard__tools{min-width: 80px;}
	}