/* ========================================
   페이지 상단 제목 영역
======================================== */

.ing_page_top{
	width:100%;
	margin:0;
	padding:0;
	background:#fff;
	border-bottom:1px solid #e3e7ed;
	box-sizing:border-box;
}

.ing_page_top_inner{
	width:100%;
	max-width:1340px;
	margin:0 auto;
	padding:42px 20px 10px;
	box-sizing:border-box;
}

.ing_page_top_title_row{
	display:flex;
	align-items:flex-end;
	justify-content:space-between;
	gap:30px;
	padding-bottom:25px;
}

.ing_page_top_title_box{
	display:flex;
	align-items:center;
	min-width:0;
}

.ing_page_top_line{
	display:block;
	width:5px;
	height:34px;
	margin-right:14px;
	border-radius:5px;
	background:#142d59;
	flex-shrink:0;
}

.ing_page_top_title{
	margin:0;
	padding:0;
	font-size:34px;
	line-height:1.25;
	font-weight:800;
	letter-spacing:-1.3px;
	color:#111827;
	word-break:keep-all;
}


/* ========================================
   현재 페이지 위치
======================================== */

.ing_page_location{
	display:flex;
	align-items:center;
	justify-content:flex-end;
	flex-wrap:wrap;
	gap:9px;
	padding-bottom:4px;
	font-size:13px;
	line-height:1.5;
	white-space:nowrap;
}

.ing_page_location_link{
	color:#7d8796;
	text-decoration:none;
	transition:color 0.2s ease;
}

.ing_page_location_link:hover{
	color:#142d59;
}

.ing_page_location_current{
	font-weight:700;
	color:#142d59;
}

.ing_page_location_arrow{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	font-size:11px;
	font-weight:400;
	color:#c0c6d0;
}


/* ========================================
   서브메뉴 탭
======================================== */

.ing_page_tab{
	/*
		PHP에서 전달하는 칸 수입니다.

		style="--ing-page-tab-columns:7;"
	*/
	--ing-page-tab-columns:7;

	position:relative;
	z-index:100;
	width:100%;
	margin:0;
	padding:0;
	background:#fff;
	box-sizing:border-box;
}

.ing_page_tab_list{
	display:grid;
	grid-template-columns:repeat(
		var(--ing-page-tab-columns),
		minmax(0, 1fr)
	);
	align-items:stretch;
	width:100%;
	margin:0;
	padding:0;
	list-style:none;
	border-top:1px solid #dce1e8;
	border-left:1px solid #dce1e8;
	box-sizing:border-box;
}

.ing_page_tab_item{
	min-width:0;
	margin:0;
	padding:0;
	border-right:1px solid #dce1e8;
	border-bottom:1px solid #dce1e8;
	background:#fff;
	box-sizing:border-box;
}

.ing_page_tab_link{
	display:flex;
	align-items:center;
	justify-content:center;
	width:100%;
	min-height:60px;
	padding:12px 15px;
	box-sizing:border-box;
	font-size:16px;
	line-height:1.4;
	font-weight:600;
	letter-spacing:-0.4px;
	text-align:center;
	text-decoration:none;
	word-break:keep-all;
	color:#181d27;
	background:#fff;
	transition:
		color 0.2s ease,
		background-color 0.2s ease,
		box-shadow 0.2s ease;
}

.ing_page_tab_item:not(.active) .ing_page_tab_link:hover{
	color:#142d59;
	background:#f3f6fa;
	box-shadow:inset 0 -3px 0 #142d59;
}

.ing_page_tab_item.active{
	border-color:#142d59;
}

.ing_page_tab_item.active .ing_page_tab_link{
	font-weight:700;
	color:#fff;
	background:#142d59;
}

.ing_page_tab_item.active + .ing_page_tab_item{
	border-left-color:#142d59;
}


/* ========================================
   고정 메뉴 공간 유지
======================================== */

.ing_page_tab_placeholder{
	display:block;
	width:100%;
	height:0;
	margin:0;
	padding:0;
}


/* ========================================
   스크롤 시 서브메뉴 고정
======================================== */

.ing_page_tab.is_fixed{
	position:fixed;
	top:92px;
	left:0;
	z-index:500;
	width:100%;
	margin:0;
	padding:0 max(
		20px,
		calc((100% - 1300px) / 2)
	);
	background:rgba(255,255,255,0.98);
	border-bottom:1px solid #e9e9e9;
	box-shadow:0 4px 20px rgba(0,0,0,0.07);
	box-sizing:border-box;
}

.ing_page_tab.is_fixed .ing_page_tab_list{
	width:100%;
	max-width:1300px;
	margin:0 auto;
}


/* ========================================
   모바일
======================================== */

@media (max-width:767px) {

	.ing_page_top_inner{
		width:100%;
		margin:0 auto;
		padding:20px 5px 10px;
		box-sizing:border-box;
	}

	.ing_page_top_title_row{
		display:block;
		padding:0 9px 19px;
	}

	.ing_page_top_title_box{
		align-items:center;
	}

	.ing_page_top_line{
		width:4px;
		height:26px;
		margin-right:10px;
	}

	.ing_page_top_title{
		font-size:25px;
		line-height:1.3;
		letter-spacing:-0.8px;
	}

	.ing_page_location{
		justify-content:flex-start;
		margin-top:11px;
		padding:0 0 0 14px;
		gap:6px;
		font-size:12px;
		white-space:normal;
	}

	/*
		모바일에서는 메뉴 개수와 관계없이
		한 줄에 2개씩 배치합니다.
	*/
	.ing_page_tab{
		--ing-page-tab-columns:2 !important;

		width:100%;
	}

	.ing_page_tab_list{
		width:100%;
		overflow:hidden;
	}

	.ing_page_tab_link{
		min-height:44px;
		padding:7px 5px;
		font-size:13px;
		line-height:1.35;
		font-weight:600;
		letter-spacing:-0.6px;
	}

	.ing_page_tab.is_fixed{
		top:66px;
		left:0;
		width:100%;
		padding:0 5px;
	}

	.ing_page_tab.is_fixed .ing_page_tab_list{
		width:100%;
		max-width:none;
		margin:0;
	}

}






/* PC에서는 모바일용 선택 버튼 숨김 */
.ing_page_tab_mobile_button{
	display:none;
}

@media (max-width:767px) {

	.ing_page_tab{
		position:relative;
		width:100%;
		margin:0;
		padding:0;
		overflow:visible;
	}

	.ing_page_tab_mobile_button{
		position:relative;
		z-index:2;
		display:flex;
		align-items:center;
		justify-content:space-between;
		width:100%;
		height:54px;
		margin:0;
		padding:0 18px;
		border:1px solid #dfe3e8;
		border-radius:8px;
		background:#fff;
		color:#142d59;
		font-family:inherit;
		font-size:16px;
		font-weight:700;
		line-height:1;
		text-align:left;
		box-sizing:border-box;
		cursor:pointer;
		-webkit-appearance:none;
		appearance:none;
	}

	.ing_page_tab_mobile_button.is_open{
		border-color:#142d59;
		border-radius:8px 8px 0 0;
	}

	.ing_page_tab_list{
		position:relative;
		top:auto;
		left:auto;
		z-index:1;
		display:none;
		width:100%;
		max-height:none;
		margin:0;
		padding:0;
		overflow:visible;
		border:1px solid #142d59;
		border-top:0;
		border-radius:0 0 8px 8px;
		background:#fff;
		box-shadow:0 8px 20px rgba(20, 45, 89, 0.12);
		box-sizing:border-box;
		list-style:none;
	}

	.ing_page_tab_list.is_open{
		display:block;
	}

	.ing_page_tab_item{
		display:block;
		width:100%;
		margin:0;
		padding:0;
		border:0;
		border-bottom:1px solid #edf0f3;
		box-sizing:border-box;
	}

	.ing_page_tab_item:last-child{
		border-bottom:0;
	}

	.ing_page_tab_link{
		display:flex;
		align-items:center;
		width:100%;
		min-height:50px;
		margin:0;
		padding:10px 18px;
		border:0;
		background:#fff;
		color:#555;
		font-size:15px;
		font-weight:500;
		line-height:1.4;
		text-align:left;
		text-decoration:none;
		box-sizing:border-box;
	}

	.ing_page_tab_item.active .ing_page_tab_link{
		background:#f2f5f9;
		color:#142d59;
		font-weight:700;
	}

	.ing_page_tab_item.active .ing_page_tab_link:after{
		content:"✓";
		margin-left:auto;
		padding-left:15px;
		color:#142d59;
		font-weight:700;
	}

}
.ing_page_tab_mobile_arrow{
	display:block;
	width:9px;
	height:9px;
	margin-left:15px;
	border-right:2px solid #142d59;
	border-bottom:2px solid #142d59;
	transform:rotate(45deg) translateY(-3px);
	transition:transform 0.2s ease;
	flex-shrink:0;
}

.ing_page_tab_mobile_button.is_open
.ing_page_tab_mobile_arrow{
	transform:rotate(225deg) translate(-2px, -2px);
}