/* fran_2 (창업절차 · 창업비용 · 수익성 분석) — 화면별 반응형.
   원래 구조: .process_wrap 1200px 안에서 .process_list 가 margin-left:-125px, li 가 margin-left:125px 로
   서로 상쇄한다. 한쪽만 덮으면 상쇄가 깨져 왼쪽으로 잘린다(QA B05). 그래서 부모·자식을 한꺼번에 정리한다. */

@media screen and (max-width: 1259px) {
	.process_wrap, .fran_tbl_wrap, .t03_tbl_wrap { width: 100%; }

	/* 창업절차 9단계 — 3열 격자(1024+) / 2열(768+) / 2열 축소(~767). 단계 사이 화살표는 열 수에 따라
	   의미가 없어져 걷는다. */
	.process_list { margin-left: 0; padding: 0 16px 56px; display: flex; flex-wrap: wrap;
		justify-content: center; gap: 28px 24px; }
	.process_list li { margin: 0; flex: 0 0 auto; }
	.process_list li:after { display: none; }
}

@media screen and (max-width: 767px) {
	.process_list { padding: 0 12px 40px; gap: 14px 10px; }
	.process_list li { width: calc(50% - 5px); max-width: 220px; height: auto; aspect-ratio: 1 / 1;
		background-size: 100% 100%; }
	.process_list li .txt_wrap { display: flex; flex-direction: column; justify-content: center; align-items: center;
		width: 100%; height: 100%; padding: 14% 12%; box-sizing: border-box; }
	.process_list li .stit { font-size: 10px; }
	.process_list li .tit { padding: 4px 0 8px; font-size: 14px; letter-spacing: -.06em; }
	.process_list li .txt { font-size: 11px; line-height: 1.35; letter-spacing: -.05em; word-break: keep-all; }
	.tit_wrap .tit { font-size: 26px; }
	.tit_wrap .stit { font-size: 15px; }
}

/* 창업비용 표 — 세 칸(목록·내용·금액)이라 줄여서 다 보이게 한다. 사이 5px 빈 칸은 가늘게. */
@media screen and (max-width: 1023px) {
	.fran_tbl_wrap { padding: 0 12px; box-sizing: border-box; }
	/* 폭은 두 군데서 온다: <col width="200px"…> 속성과, 첫 행 <th class="col1…col5"> 의 CSS 폭(고정 레이아웃은
	   <col> 이 auto 면 첫 행 셀을 따른다). 한쪽만 덮으면 남은 쪽이 640px 로 표를 밀어낸다. */
	.fran_tbl col:nth-child(1), .fran_tbl .col1 { width: 26%; }
	.fran_tbl col:nth-child(2), .fran_tbl col:nth-child(4), .fran_tbl .col2, .fran_tbl .col4 { width: 6px; }
	.fran_tbl col:nth-child(3), .fran_tbl .col3 { width: auto; }
	.fran_tbl col:nth-child(5), .fran_tbl .col5 { width: 30%; }
	.fran_tbl th, .fran_tbl td { word-break: keep-all; }
}
@media screen and (max-width: 767px) {
	.fran_tbl th { height: auto; padding: 8px 4px; font-size: 13px; }
	.fran_tbl tbody th { height: auto; padding: 8px 4px; font-size: 13px; }
	.fran_tbl tbody td { height: auto; padding: 8px 6px; font-size: 12px; line-height: 1.4; letter-spacing: -.04em; }
	.fran_tbl tbody tr.tfoot th, .fran_tbl tbody tr.tfoot td { height: auto; padding: 9px 4px; font-size: 13px; }
}

/* 수익성 분석 표 — 6열에 병합 칸이라 줄이면 읽기 어렵다. 표만 감싼 .tbl_scroll 안에서 가로로 밀어 보게 하고
   안내를 표 바로 위에 둔다(빌드가 감싼다). 표 래퍼(.t03_tbl_wrap)는 제목·차트까지 품고 있어 스크롤 영역으로 못 쓴다. */
.tbl_hint { display: none; }
@media screen and (max-width: 1023px) {
	.tbl_hint { display: block; margin: 0 12px 8px; font-size: 12px; color: #888; text-align: right; }
	.tbl_scroll { overflow-x: auto; -webkit-overflow-scrolling: touch; padding: 0 12px 4px; box-sizing: border-box; }
	.t03_tbl { width: 640px; margin-bottom: 40px; }
	.t03_tbl col:nth-child(1) { width: 15%; }
	.t03_tbl col:nth-child(2) { width: 22%; }
	.t03_tbl col:nth-child(3) { width: 17%; }
	.t03_tbl col:nth-child(4) { width: 11%; }
	.t03_tbl col:nth-child(5) { width: 20%; }
	.t03_tbl col:nth-child(6) { width: 15%; }
	.t03_tbl thead th { font-size: 14px; }
	.t03_tbl tbody th { font-size: 13px; }
	.t03_tbl tbody td { font-size: 13px; }
	.t03_tbl_tit { padding-top: 40px; }
	.t03_tbl_tit .tit, .t03_top .tit { font-size: 24px; }
}
@media screen and (max-width: 767px) {
	.footnote { margin: 12px 16px 60px; font-size: 13px; }
}