@charset "utf-8";

/* select2: .selection span은 기본 inline인데 flex 자식을 감싸면 렌더링 깨짐 → block 처리 */
.board_top .boardschbox .search_box .select-wrap .selection {
	display: block;
}

/* select2: main.css가 전역으로 지구본 배경이미지를 추가하므로 검색 셀렉트에서 제거 */
.board_top .boardschbox .search_box .select-wrap .select2-container .select2-selection--single .select2-selection__rendered
	{
	background: none !important;
	padding-left: 0 !important;
}

/*
검색/필터 드롭다운이 목록 "총 N건" board_top에 가려지지 않도록
(검색용 board_top만 올림 — 둘 다 z-index:20이면 아래 건수 문구가 셀렉트를 덮음)
.board_top:has(.boardschbox) {
	position: relative;
	z-index: 30;
}
.board_top:not(:has(.boardschbox)) {
	position: relative;
	z-index: 1;
}
.board_top .boardschbox .search_box .select-wrap {
	position: relative;
	z-index: 20;
}
.board_top .boardschbox .search_box .select-wrap:has(.select2-container--open),
.board_top .boardschbox .search_box .select-wrap.open {
	z-index: 50;
}
.board_top .boardschbox .search_box .select-wrap .con {
	z-index: 51;
	max-height: 320px;
	overflow-y: auto;
	overflow-x: hidden;
}
.board_top .boardschbox .search_box .select-wrap .select2-dropdown,
.board_top .boardschbox .search_box .select-wrap .search-select-dropdown {
	z-index: 51 !important;
	background: #fff;
}
.board_top .boardschbox .search_box .filter-wrap .item {
	position: relative;
	z-index: 20;
}
.board_top .boardschbox .search_box .filter-wrap .item.open {
	z-index: 50;
}
.board_top .boardschbox .search_box .filter-wrap .item .con {
	z-index: 51;
}

상담정보(dinf) 등: select-top-wrap/filter-wrap 드롭다운이 목록 "총 N건"에 가려지지 않도록
.select-top-wrap {
	position: relative;
	z-index: 30;
}
.filter-wrap .item.open {
	z-index: 50;
}
.filter-wrap .item.open .con,
.filter-wrap .item .con {
	z-index: 51;
	background: #fff;
	max-height: 320px;
	overflow-y: auto;
	overflow-x: hidden;
}
#dataContent {
	position: relative;
	z-index: 1;
}
*/

/*
breadcrumb(LNB) 하위메뉴가 검색영역(board_top) 위에 표시
board_top(검색) z-index:30 — lnb도 30이면 DOM 순서상 contentsarea 검색이 위로 올라와 드롭다운 가림
.lnb {
	position: relative;
	z-index: 40;
}
.lnb:has(.dropdown.open) {
	z-index: 70;
}
.lnb_area > li.dropdown.open {
	z-index: 60;
}
.lnb_area li.dropdown .dropdown-menu-wrap {
	z-index: 61;
}
*/

/* 요약형(thumbnaillist): 내용(.text)과 메타(list_box) 겹침 방지 */
.thumbnaillist > li a .text_box {
	justify-content: flex-start;
}
.thumbnaillist > li a .text_box .text {
	margin-bottom: 16px;
	word-break: break-word;
	overflow-wrap: anywhere;
}
.thumbnaillist > li a .list_box {
	position: static;
	margin-top: auto;
	left: auto;
	bottom: auto;
	flex-wrap: wrap;
}
@media only screen and (max-width: 1023px) {
	.thumbnaillist > li a .text_box {
		justify-content: flex-start;
		gap: 16px;
	}
}

/* 프로그램 목록 — 상태 딱지 세로 정렬 */
.counseling-list > a.item > .flex.justify-between {
	align-items: center;
}
.counseling-list .program-state.cate-st4 {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	line-height: 1.25;
	text-align: center;
	white-space: nowrap;
	align-self: center;
}

.find-job .board_top .boardschbox .search_box .find-task-filter {
	flex-shrink: 0;
	position: relative;
	z-index: 10;
}
.find-job .board_top .boardschbox .search_box .find-task-filter .item {
	width: 200px;
}
.find-job .board_top .boardschbox .search_box .find-task-filter .item .filter-btn {
	overflow: hidden;
	min-width: 0;
	width: 100%;
}
.find-job .board_top .boardschbox .search_box .find-task-filter .item .filter-btn #taskSeCdLabel {
	flex: 1;
	min-width: 0;
	overflow: hidden;
	text-overflow: ellipsis;
	white-space: nowrap;
}
.find-job .board_top .boardschbox .search_box .find-task-filter .item .filter-btn i {
	flex-shrink: 0;
}
.find-job .board_top .boardschbox .search_box .find-task-filter .item .con {
	z-index: 100;
	max-height: 320px;
	overflow-y: auto;
	overflow-x: hidden;
	width: 240px;
}
.find-job .board_top .boardschbox .search_box .find-task-filter .check_box input[type="checkbox"]:checked + label {
	color: var(--main);
	font-weight: 700;
}

@media only screen and (max-width: 560px) {
	.find-job .board_top .boardschbox .search_box .find-task-filter,
	.find-job .board_top .boardschbox .search_box .find-task-filter .item {
		width: 100%;
	}
	.find-job .board_top .boardschbox .search_box .find-task-filter .item .con {
		width: calc(100vw - 20px);
		left: 0;
	}
}

/* 외국인지원시설 요일 셀: 다국어 환경에서 영문 약어 등이 넘치지 않도록 너비 자동 조정 */
.facility .d-name {
	width: auto;
	min-width: 80px;
	max-width: 180px;
	white-space: nowrap;
}

/* 맞춤형정보 카드: DB 2=결혼이민자 / 3=외국인근로자 — 퍼블 파일(sec2-02=근로, sec2-03=결혼)과 교차 */
.custom-info .ci-img2 { background: url(../img/main/sec2-03.png) no-repeat center / cover; }
.custom-info .ci-img3 { background: url(../img/main/sec2-02.png) no-repeat center / cover; }

/* 자치구가족센터(no-info): 우측 정보패널 없을 때 지도가 오른쪽으로 밀리지 않도록 — 다른 센터와 동일 좌측 정렬 */
.facility .fac-body.no-info .fac-left {
	display: block;
}
.facility .fac-body.no-info .fac-intro {
	flex: none;
	margin-bottom: 16px;
}
.facility .fac-body.no-info .fac-map {
	flex: none;
	max-width: 785px;
	margin-left: 0;
	left: 100px;
	margin-top: 16px;
	justify-content: center;
}
@media only screen and (max-width: 1023px) {
	.facility .fac-body.no-info .fac-map {
		left: unset;
	}
}

/* 일자리 찾기 목록: div.item 클릭 상세 이동 (공통 sub_contents.css는 a.item 기준) */
.find-job-list>.item {
	cursor: pointer;
}

.find-job-list>.item:hover, .find-job-list>.item.active {
	border: 1px solid var(--main);
}

.find-job-list .find-detail-link {
	color: inherit;
	text-decoration: none;
}

.find-job-list .find-detail-link:hover {
	text-decoration: underline;
}

/* 헤더 구글번역 팝업 내부 select 스타일 */
.gt-wrap {
	position: relative;
}

.gt-wrap .goog-te-gadget {
	font-size: 0;
}

.gt-wrap .goog-te-gadget>span {
	display: none;
}

.gt-wrap .goog-te-gadget-simple {
	border: none !important;
	background: none !important;
}

.gt-wrap .goog-te-combo {
	display: block;
	width: 100%;
	height: 54px;
	padding: 0 60px 0 16px;
	font-size: 16px;
	color: #222;
	border: 1px solid #ccc;
	background: #fff;
	appearance: none;
	-webkit-appearance: none;
	cursor: pointer;
	box-sizing: border-box;
}

.gt-wrap::after {
	content: "";
	position: absolute;
	top: 0;
	right: 0;
	width: 54px;
	height: 54px;
	background: #4a5568
		url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='14' height='9' fill='none' viewBox='0 0 14 9'%3E%3Cpath fill='%23fff' fill-rule='evenodd' d='M13.768.18a.7.7 0 0 1 .052.988l-6.3 7a.7.7 0 0 1-1.04 0l-6.3-7A.7.7 0 0 1 1.22.18L7 6.655 12.78.18a.7.7 0 0 1 .988-.052' clip-rule='evenodd'/%3E%3C/svg%3E")
		no-repeat center/14px;
	pointer-events: none;
}

/* TODO 임시: 언어 select2 — GNB(.topmenu z-index:102) 위로, 추후 main.css 정리 */
#header .t-head {
	position: relative;
	z-index: 103 !important;
	overflow: visible !important;
}

#header .t-head .language>li:last-child {
	position: relative;
	z-index: 104;
}

#header .t-head .select2-dropdown, .select2-dropdown {
	z-index: 99999 !important;
}

#header .t-head .lang-list+.select2-container--open {
	z-index: 104;
}

/* 헤더의 다국어 셀렉박스 길이 수정 */
.header-lang-option {
	display: flex;
	align-items: center;
	gap: 8px;
	flex-wrap: nowrap;
	white-space: nowrap;
}

.header-lang-option .lang-flag {
	width: 22px;
	height: 15px;
	object-fit: cover;
	flex-shrink: 0;
	border-radius: 2px;
}

.header-lang-option .lang-label {
	flex: 0 1 auto;
	white-space: nowrap;
	word-break: keep-all;
}

.select2-dropdown.header-lang-dropdown {
	min-width: 220px !important;
	width: 220px !important;
}

.header-lang-dropdown .select2-results__option {
	white-space: nowrap;
}

/* 전체메뉴 열림: PC t-head 언어바 비침 차단 */
.toparea:has(.allmenu-category.active) .t-head {
	visibility: hidden !important;
	pointer-events: none !important;
}

/* PC 전체메뉴: 모바일 언어UI 숨김 (mo_only 덮어쓰기 방지) */
.menu-box-top .mo-language-wrap {
	display: none !important;
}

/* 모바일 전체메뉴(햄버거)에서만 언어UI 노출 */
@media (max-width: 767px) {
	.menu-box-top .mo-language-wrap {
		display: flex !important;
		flex-direction: column;
		align-items: flex-start;
		flex-shrink: 0;
		gap: 8px;
		text-align: left;
	}

	.menu-box-top .mo-language-wrap > .language {
		display: flex;
		gap: 5px 18px;
		flex-wrap: wrap;
		margin-bottom: 0;
	}

	.menu-box-top .header-lang-select + .select2-container {
		min-width: 120px;
		width: auto !important;
	}

	.menu-box-top .header-lang-select + .select2-container .select2-selection--single {
		height: 32px;
		border: 1px solid rgba(255, 255, 255, 0.6);
		background: rgba(255, 255, 255, 0.15);
	}

	.menu-box-top .header-lang-select + .select2-container .select2-selection__rendered {
		color: #fff;
		line-height: 30px;
		font-size: 13px;
		padding-left: 28px; /* 글로브 아이콘 자리 */
	}

	.menu-box-top .header-lang-select + .select2-container .select2-selection__arrow {
		height: 30px;
	}

	.allmenu-category .select2-dropdown {
		z-index: 10001 !important;
	}
}

/* 메인 팝업: GNB(seoul-gnb/topmenu z-index:102), 전체메뉴(200) 위 */
#mainPopupArea .popup-st1.main-popup-wrap {
	z-index: 10100 !important;
}
/* 뷰포트 안에 팝업 상자 제한 → 하단 닫기/오늘하루 버튼이 화면 밖으로 잘리지 않음 */
#mainPopupArea .popup-inner.main-popup-layout {
	max-height: calc(100vh - 40px);
	max-height: calc(100dvh - 40px);
	overflow: hidden;
}
#mainPopupArea .popup-inner.main-popup-layout .popup-box1 {
	height: 100%;
	max-height: 100%;
	display: flex;
	flex-direction: column;
	box-sizing: border-box;
	overflow: hidden;
}
#mainPopupArea .popup-inner.main-popup-layout .popup-top {
	flex-shrink: 0;
}
#mainPopupArea .popup-inner.main-popup-layout .popup-cont {
	flex: 1 1 auto;
	min-height: 0;
	max-height: none;
	overflow: hidden;
	display: flex;
	flex-direction: column;
	padding-bottom: 0;
}
#mainPopupArea .popup-inner.main-popup-layout .popup-scroll {
	flex: 1 1 auto;
	min-height: 0;
	overflow-x: hidden;
	overflow-y: auto;
	-webkit-overflow-scrolling: touch;
}
/* 하단 버튼은 스크롤 영역 밖(팝업 하단 고정) */
#mainPopupArea .popup-inner.main-popup-layout .main-popup-actions {
	flex-shrink: 0;
	margin-top: 0;
	padding: 20px 30px 30px;
}
#mainPopupArea .popup-scroll .img-wrap img {
	height: auto;
}

/* 메인 팝업 모바일: PC 관리자 px(위치·크기) 무시, 화면 중앙 반응형 */
@media only screen and (max-width: 767px) {
	#mainPopupArea .popup-inner.main-popup-layout {
		top: 50% !important;
		left: 50% !important;
		width: calc(100% - 40px) !important;
		max-width: 100% !important;
		height: auto !important;
		max-height: 85vh !important;
		max-height: 85dvh !important;
		padding: 0 !important;
		transform: translate(-50%, -50%) !important;
	}
	#mainPopupArea .popup-inner.main-popup-layout .popup-box1 {
		height: auto;
		max-height: 85vh;
		max-height: 85dvh;
	}
	#mainPopupArea .popup-inner.main-popup-layout .main-popup-actions {
		padding: 16px 20px 20px;
	}
	#mainPopupArea .popup-scroll .img-wrap img {
		width: 100%;
		max-width: 100%;
	}
}

/* 메인 팝업 첨부파일 (table.css 미포함 → 퍼블 file-list-st2) */
#mainPopupArea .file-list-st2 > li + li { margin-top: 1.5rem; }
#mainPopupArea .file-list-st2 > li { display: flex; gap: 1.5rem 2rem; align-items: center; flex-wrap: wrap; }
#mainPopupArea .file-list-st2 > li > a { display: flex; gap: .5rem; align-items: center; font-size: clamp(17px, 2vw, 1.8rem); font-weight: 500; }
#mainPopupArea .file-list-st2 > li > a:hover { text-decoration: underline; text-underline-offset: 5px; }
#mainPopupArea .icon-file { display: block; width: 20px; height: 20px; flex-shrink: 0; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='26' height='26' fill='none' viewBox='0 0 26 26'%3E%3Cpath fill='%231d1d1d' d='M21.958 13.445a.975.975 0 0 1 1.377 1.38l-7.11 7.096A7.795 7.795 0 1 1 5.2 10.896l7.282-7.476.023-.02a5.521 5.521 0 0 1 7.806 7.807l-.002.003-7.29 7.486-.002-.002a3.25 3.25 0 0 1-2.304.99A3.248 3.248 0 0 1 8.428 14.1l7.474-7.474a.976.976 0 0 1 1.38 1.379L9.793 15.49l-.011.013a1.3 1.3 0 0 0-.397.922 1.3 1.3 0 0 0 2.233.912l.002-.001 7.287-7.484a3.571 3.571 0 0 0-5.05-5.05l-7.27 7.464-.009.01a5.85 5.85 0 0 0 0 8.266 5.847 5.847 0 0 0 8.266 0h.002z'/%3E%3C/svg%3E") no-repeat center center / contain; }
#mainPopupArea .file-btn-list { display: flex; gap: .8rem; margin: 0; padding: 0; list-style: none; }
#mainPopupArea .file-btn-list > li > button { border-radius: 12px; height: 46px; line-height: 46px; vertical-align: middle; cursor: pointer; }
#mainPopupArea .file-btn-list > li > button.down { width: 46px; height: 46px; border: 0; padding: 0; background: var(--main) url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='22' height='22' fill='none' viewBox='0 0 22 22'%3E%3Cpath fill='%23fff' d='M2.072 13.78a.825.825 0 1 1 1.65 0v3.758h14.556V13.78a.825.825 0 0 1 1.65 0v4.583c0 .455-.37.825-.825.825H2.897a.825.825 0 0 1-.825-.825z'/%3E%3Cpath fill='%23fff' d='M11.793 12.955a.825.825 0 0 1-1.65 0V3.056a.825.825 0 1 1 1.65 0z'/%3E%3Cpath fill='%23fff' d='M5.39 9.489a.825.825 0 0 1 1.167-1.167l4.404 4.404 4.404-4.404a.825.825 0 0 1 1.167 1.167l-4.988 4.987a.825.825 0 0 1-1.167 0z'/%3E%3C/svg%3E") no-repeat center center / 18px; }
#mainPopupArea .file-btn-list > li > button.see { display: flex; gap: .6rem; align-items: center; border: 1px solid var(--bd-color); background: #fff; color: var(--txt-gray); padding: 0 1.3rem; }
#mainPopupArea .file-btn-list > li > button.see i { display: block; width: 17px; height: 17px; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='20' height='20' fill='none' viewBox='0 0 20 20'%3E%3Cg clip-path='url(%23a)'%3E%3Cpath fill='%2356595e' d='M5.8 9.393a4.397 4.397 0 0 1 3.562 6.97l2.107 2.107a.7.7 0 0 1-.99.99l-2.107-2.107A4.397 4.397 0 1 1 5.8 9.394m8.249-8.018c.45 0 .883.18 1.202.498l2.81 2.81a1.7 1.7 0 0 1 .499 1.203v9.908a1.7 1.7 0 0 1-1.7 1.7H13.33a.7.7 0 0 1 0-1.4h3.528a.3.3 0 0 0 .3-.3v-8.49h-2.828a1.7 1.7 0 0 1-1.7-1.7V2.775H6.405a.3.3 0 0 0-.3.3V7.17a.7.7 0 0 1-1.4 0V3.075a1.7 1.7 0 0 1 1.7-1.7zm-8.25 9.418a2.997 2.997 0 1 0 0 5.994 2.997 2.997 0 0 0 0-5.994m8.232-5.189a.3.3 0 0 0 .3.3h2.828v-.018a.3.3 0 0 0-.088-.212l-2.81-2.81a.3.3 0 0 0-.212-.089h-.018z'/%3E%3C/g%3E%3Cdefs%3E%3CclipPath id='a'%3E%3Cpath fill='%23fff' d='M0 0h20v20H0z'/%3E%3C/clipPath%3E%3C/defs%3E%3C/svg%3E") no-repeat center center / contain; }

/* 통합검색 결과 없음 (boardlist .nodata와 동일 레이아웃) */
.result_bx_wr .result_bx .result_nodata_wr {
	width: 100%;
	border-top: 1px solid var(--bd-color);
}
.result_bx_wr .result_bx .result_nodata_wr .nodata {
	width: 100%;
	text-align: center;
	padding: 108px 0;
	color: #56595E;
}

/* 서울생활안내 다운로드 버튼 아이콘 */
.gallerylist.vertical > li .button_box .btn-download {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 6px;
	flex: 1 0 0;
	min-width: 110px;
	width: auto;
	height: auto;
	padding: 14px 20px;
	font-weight: 700;
	color: var(--txt-gray);
	border: 1px solid var(--bd-dark);
	border-radius: 12px;
	background-color: #fff;
	background-image: none;
	cursor: pointer;
	transition: border-color 0.2s, color 0.2s;
	text-decoration: none;
}
.gallerylist.vertical > li .button_box .btn-download:hover {
	border-color: var(--main);
	color: var(--main);
}
.gallerylist.vertical > li .button_box .btn-download i {
	display: inline-block;
	width: 20px;
	height: 20px;
	flex: none;
	background: url(../img/icon_btn_download.png) no-repeat center / contain;
}

/* 조직도 스와이퍼 스크롤바(9px) 겹침 방지 */
.contents_scroll_bx .contents_inner_7 { padding-bottom: 20px; }

/* 조직도 모바일: ::before(세로 background)와 ::after(가로 border-top) 렌더링 통일 → 둘 다 background */
@media only screen and (max-width: 767px) {
	.organize_chart_wr .organize_chart .organ_top::before {
		background: #909cab;
		border-left: none;
	}
	.organize_chart_wr .organize_chart .organ_top::after {
		background: #909cab;
		border-top: none;
	}
}

/* 조직도: JS div 선 그리기 — pseudo-element 비활성화 + 선 스타일 */
.organize_chart_wr .organize_chart { position: relative; }
.org-lines-active .organ_top::before,
.org-lines-active .organ_top::after,
.org-lines-active .organ_body h3.box::before,
.org-lines-active .organ_body .sub::before,
.org-lines-active .organ_body .sub::after,
.org-lines-active .organ_body .sub.col2 ul::before,
.org-lines-active .organ_body .sub.col12 > ul::before,
.org-lines-active .organ_body .sub-team::before { display: none !important; }
.org-line { position: absolute; background: #909cab; }

/* 가족센터 지도 라벨 위치 — CMS inline style 필터됨, 라벨 순서(nth-child) 기준 */
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(2) { left: 55.06%; top: 8.28%; }
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(3) { left: 49.76%; top: 19.48%; }
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(4) { left: 69.29%; top: 14.83%; }
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(5) { left: 20.35%; top: 85.17%; }
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(6) { left: 36.71%; top: 83.58%; }
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(7) { left: 53.29%; top: 79.65%; }
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(8) { left: 60.47%; top: 70.93%; }
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(9) { left: 77.76%; top: 69.33%; }
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(10) { left: 10.24%; top: 73.11%; }
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(11) { left: 8.71%; top: 63.23%; }
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(12) { left: 24.94%; top: 63.66%; }
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(13) { left: 1.06%; top: 46.66%; }
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(14) { left: 31.53%; top: 75.87%; }
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(15) { left: 25.53%; top: 49.56%; }
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(16) { left: 29.76%; top: 24.85%; }
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(17) { left: 32.82%; top: 42.59%; }
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(18) { left: 39.65%; top: 69.48%; }
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(19) { left: 43.65%; top: 59.16%; }
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(20) { left: 44.71%; top: 52.76%; }
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(21) { left: 37.53%; top: 30.23%; }
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(22) { left: 53.18%; top: 32.27%; }
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(23) { left: 59.06%; top: 54.36%; }
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(24) { left: 49.65%; top: 46.51%; }
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(25) { left: 70.24%; top: 34.88%; }
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(26) { left: 61.88%; top: 39.97%; }
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(27) { left: 70.71%; top: 49.27%; }
.contentsarea .family-map .map-wrap.pc_only .map-label:nth-child(28) { left: 84.82%; top: 55.38%; }
/* 가족센터 상세표 — CMS에서 col style/data-content XSS 필터 대체 */
.contentsarea .family-center-list .tableA {
  table-layout: fixed;
  width: 100%;
}
.contentsarea .family-center-list .tableA col {
  width: 25%;
}
@media only screen and (max-width: 767px) {
  /* tableA 모바일 stack은 data-content 필요 → 가족센터 표는 4열 테이블 유지 */
  .contentsarea .family-center-list .tableA {
    display: table !important;
    width: 100% !important;
  }
  .contentsarea .family-center-list .tableA thead {
    display: table-header-group !important;
  }
  .contentsarea .family-center-list .tableA tbody {
    display: table-row-group !important;
  }
  .contentsarea .family-center-list .tableA tr {
    display: table-row !important;
    border-bottom: 1px solid var(--bd-color);
  }
  .contentsarea .family-center-list .tableA th,
  .contentsarea .family-center-list .tableA td {
    display: table-cell !important;
    width: 25% !important;
    padding: 1.2rem 0.8rem;
    font-size: 1.4rem;
    word-break: break-word;
  }
  .contentsarea .family-center-list .tableA td {
    text-align: center !important;
  }
}
/* 앵커(#center-XX) 이동 시 상세 목록 표시 — JS 실패 시 폴백 */
.contentsarea .family-center-list:has(.center-item:target) { display: flex; }

/* 문화달력: 선택 칸 hover 시 회색 대신 하늘색 유지 */
.calendar-st1 tbody td.selected .item:hover {
	background: var(--bg-light);
}

/* 게시판 목록 비밀글 아이콘 — 제목/NEW(18px) 비율에 맞춤 (공통 table.css 30px override) */
.boardlist table tbody tr td.title_box .title img.secret {
	width: 18px;
	height: 18px;
	margin-left: 5px;
	vertical-align: middle;
	object-fit: contain;
}
@media only screen and (max-width: 1023px) {
	.boardlist table tbody tr td.title_box .title img.secret {
		width: 15px;
		height: 15px;
		margin: 0 0 0 5px;
	}
}

/* 댓글 더보기 버튼 — 깨진 아이콘 경로 보정 + 배경/커서 (공통 table.css 유지) */
.comment_area .comment_btn button {
	background: #fff;
	cursor: pointer;
}
.comment_area .comment_btn button .icon {
	display: inline-block;
	width: 12px;
	height: 12px;
	background: url("../img/common/arr-down.svg") no-repeat center / contain;
}
@media only screen and (max-width: 767px) {
	.comment_area .comment_btn button .icon {
		width: 2.8vw;
		height: 2.8vw;
	}
}

/* 요약형(채용공고 등) 목록 NEW 아이콘 */
.thumbnaillist > li a .text_box h3 img.new {
	display: inline-block;
	width: 18px;
	height: 18px;
	margin-left: 8px;
	vertical-align: middle;
	object-fit: contain;
}
@media only screen and (max-width: 767px) {
	.thumbnaillist > li a .text_box h3 img.new {
		width: 3.8889vw;
		height: 3.8889vw;
		margin-left: 1.5vw;
	}
}

/* Header 레이어 z-index (서브 Frame — hmpg-search.css 미로드 보정)
   popup-st1(101) 아래로 내려 팝업 dim에 헤더가 덮이도록 함
   topmenu/gnb(100) > total_search_wr(99) > dim(98) */
.toparea .topmenu,
.toparea .seoul-gnb {
	z-index: 100;
}
.toparea .total_search_wr {
	z-index: 99;
}
.toparea .dim {
	z-index: 98;
}

/* 앨범형 목록 NEW 아이콘 — 요약형과 동일 (갤러리 h3 / 뉴스레터·서울생활안내 strong) */
.gallerylist > li a .text_box h3 img.new,
.gallerylist > li a .text_box strong img.new {
	display: inline-block;
	width: 18px;
	height: 18px;
	margin-left: 8px;
	vertical-align: middle;
	object-fit: contain;
}
@media only screen and (max-width: 767px) {
	.gallerylist > li a .text_box h3 img.new,
	.gallerylist > li a .text_box strong img.new {
		width: 3.8889vw;
		height: 3.8889vw;
		margin-left: 1.5vw;
	}
}

/* 댓글 0건: 빈 comment_list 위·아래 선 제거 */
.comment_area #comtList.is-empty,
.comment_area #comtList.is-empty .comment_list {
	border-top: 0;
	border-bottom: 0;
	margin-top: 0;
}

/* 댓글 목록: 버튼 하단 배치 (답댓글 좌 / 삭제·수정 우) */
.comment_area .comment_list > li dl dt {
	display: block;
}
.comment_area .comment_list > li dl dd.comment_action {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-top: 24px;
	gap: 12px;
}
.comment_area .comment_list > li dl.reply dd.comment_action {
	padding-left: 40px;
}
.comment_area .comment_list > li dl dd.comment_action .comment_action_left {
	flex: none;
}
.comment_area .comment_list > li dl dd.comment_action .comment_action_right {
	display: flex;
	align-items: center;
	justify-content: flex-end;
	gap: 8px;
	margin-left: auto;
}
.comment_area .comment_list > li dl dd.comment_action .comment_action_right li::after {
	display: none;
}
@media only screen and (max-width: 767px) {
	.comment_area .comment_list > li dl {
		padding-bottom: 20px;
	}
	.comment_area .comment_list > li dl dt .list_box.button_area {
		position: static;
	}
	.comment_area .comment_list > li dl.reply dd.comment_action {
		padding-left: 0;
	}
}

/* 게시판 상세 동영상 영역 하단 여백 */
#urlBottom {
	margin-bottom: 20px;
}

/* 조직도: 가로 스와이퍼가 세로 영역까지 잘라내지 않도록 */
.contentsarea .contents_scroll_bx.swiper {
	overflow-x: hidden;
	overflow-y: visible;
	height: auto !important;
}
.contentsarea .contents_scroll_bx .swiper-wrapper,
.contentsarea .contents_scroll_bx .swiper-slide.contents_inner_7 {
	height: auto !important;
}
/* 하위부서 없을 때 센터장 아래 빈 여백 축소 */
.contentsarea .organize_chart:not(:has(.organ_body > .organ)) .organ_top {
	padding-bottom: 0;
}
.contentsarea .organize_chart:not(:has(.organ_body > .organ)) .organ_top::before,
.contentsarea .organize_chart:not(:has(.organ_body > .organ)) .organ_top::after {
	display: none;
}

/*
 * 조직도: 가로 스와이프 없이 콘텐츠 폭에 맞춤
 * 부서 4개 이상이면 팀 박스를 세로로 쌓아 한 화면에 표시
 * 같은 레벨 박스는 부서 개수와 관계없이 동일 크기
 */
.contentsarea .contents_scroll_bx .swiper-slide.contents_inner_7 {
	width: 100% !important;
	max-width: 100%;
	box-sizing: border-box;
}
.organize_chart_wr .organize_chart {
	max-width: 100%;
	width: 100%;
}
.organize_chart_wr .organize_chart .organ_body {
	width: 100%;
}
.contentsarea .organize_chart_wr .organize_chart .organ_body > .organ {
	flex: 1 1 0;
	min-width: 0;
	max-width: 100%;
}
.contentsarea .organize_chart_wr .organize_chart .organ_body .box {
	width: 143px;
	max-width: 143px;
	flex-shrink: 0;
	box-sizing: border-box;
	overflow-wrap: anywhere;
	word-break: break-word;
}
.contentsarea .organize_chart_wr .organize_chart .organ_body h3.box {
	width: 211px;
	max-width: 211px;
	min-width: 0;
	box-sizing: border-box;
	overflow-wrap: anywhere;
	word-break: break-word;
}
.contentsarea .organize_chart_wr .organize_chart .organ_body .sub > ul {
	flex: 0 0 auto;
	width: 143px;
	max-width: 143px;
}
.contentsarea .organize_chart_wr .organize_chart .organ_body .sub-team {
	width: 143px;
	max-width: 143px;
}
.contentsarea .organize_chart_wr .organize_chart .organ_body .sub-team li {
	width: 143px;
	max-width: 143px;
	box-sizing: border-box;
}
@media only screen and (max-width: 1023px) {
	.contentsarea .organize_chart_wr .organize_chart .organ_body .box {
		width: 143px;
		max-width: 143px;
	}
	.contentsarea .organize_chart_wr .organize_chart .organ_body .sub > ul {
		flex: 0 0 auto;
		width: 143px;
		max-width: 143px;
	}
}
@media only screen and (max-width: 767px) {
	.contentsarea .organize_chart_wr .organize_chart .organ_body .box,
	.contentsarea .organize_chart_wr .organize_chart .organ_body .sub > ul,
	.contentsarea .organize_chart_wr .organize_chart .organ_body .sub-team,
	.contentsarea .organize_chart_wr .organize_chart .organ_body .sub-team li {
		width: 100%;
		max-width: 211px;
	}
}
.organize_chart_wr:has(.organ_body > .organ:nth-child(n+4)) .organ_body .sub {
	flex-direction: column;
	align-items: center;
	gap: 12px;
	width: 100%;
}
.organize_chart_wr:has(.organ_body > .organ:nth-child(n+4)) .organ_body .sub > ul {
	flex: 0 0 auto;
	width: 143px;
	max-width: 143px;
}

/* 뉴스레터 목록 — 상세 페이지 없음, a 태그 대신 div 사용 */
.gallerylist.vertical.nlet-list > li > .nlet-item {
	display: flex;
	flex-flow: column;
	gap: 2rem;
}
.gallerylist.vertical.nlet-list > li > .nlet-item .img-box {
	border-radius: 20px;
	background-color: #E0E3E8;
	padding: 3rem;
	overflow: hidden;
}
.gallerylist.vertical.nlet-list > li > .nlet-item .img-wrap {
	position: relative;
	width: 100%;
	height: 0;
	padding-bottom: 122%;
}
.gallerylist.vertical.nlet-list > li > .nlet-item .img-wrap img {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

/* 대관시설 목록 검색: 센터/인원/용도/요일 + 검색어 */
.board_top .boardschbox .search_box.fclt-search-box {
	max-width: 1200px;
	flex-wrap: nowrap;
}
.board_top .boardschbox .search_box.fclt-search-box .select-wrap {
	max-width: 160px;
	flex: 0 1 160px;
}
.board_top .boardschbox .search_box.fclt-search-box .select-wrap.fclt-usg-wrap {
	max-width: 220px;
	flex: 0 1 220px;
}
.board_top .boardschbox .search_box.fclt-search-box .inpbox {
	flex: 1 1 280px;
	min-width: 220px;
	max-width: 420px;
	order: 0;
}
/* 디자인: 검색 아이콘을 입력칸 오른쪽에 배치 */
.board_top .boardschbox .search_box.fclt-search-box .inpbox > button {
	order: 2;
	flex-shrink: 0;
}
.board_top .boardschbox .search_box.fclt-search-box .inpbox input.txt {
	order: 1;
}
/* 디자인 시안은 아이콘 검색 — 별도 검색 버튼은 숨김(접근성용 아이콘 유지) */
.board_top .boardschbox .search_box.fclt-search-box .btn_search {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	border: 0;
}
@media only screen and (max-width: 1200px) {
	.board_top .boardschbox .search_box.fclt-search-box {
		flex-wrap: wrap;
		justify-content: flex-start;
	}
	.board_top .boardschbox .search_box.fclt-search-box .select-wrap,
	.board_top .boardschbox .search_box.fclt-search-box .select-wrap.fclt-usg-wrap {
		max-width: calc(50% - 5px);
		flex: 1 1 calc(50% - 5px);
	}
	.board_top .boardschbox .search_box.fclt-search-box .inpbox {
		max-width: none;
		flex: 1 1 100%;
	}
}
@media only screen and (max-width: 767px) {
	.board_top .boardschbox .search_box.fclt-search-box .select-wrap,
	.board_top .boardschbox .search_box.fclt-search-box .select-wrap.fclt-usg-wrap {
		max-width: 100%;
		flex: 1 1 100%;
	}
}

/* 컨텐츠 출처/주석 - URL·괄호 줄바꿈 방지 */
.contentsarea .tit-cont > p.fc-main.txt-19 {
	word-break: normal;
	overflow-wrap: break-word;
}
.contentsarea .tit-cont > p.fc-main.txt-19 a {
	display: inline-block;
	white-space: nowrap;
	max-width: 100%;
	vertical-align: baseline;
}
.contentsarea .tit-cont > p.fc-main.txt-19 .ws-nowrap {
	white-space: nowrap;
}
.contentsarea .tit-cont > p.fc-main.txt-19.source-note {
	white-space: nowrap;
	overflow-x: auto;
	-webkit-overflow-scrolling: touch;
}
@media only screen and (max-width: 767px) {
	.contentsarea .tit-cont > p.fc-main.txt-19.source-note {
		white-space: normal;
		overflow-x: visible;
	}
}

.long-desc-text {
  word-break: break-all;      /* 단어 중간에서도 강제로 줄바꿈 */
  overflow-wrap: break-word;  /* 컨테이너 넓이를 넘으면 줄바꿈 */
  white-space: normal;        /* 혹시 nowrap이 걸려있다면 해제 */
}

/* 센터일정 달력 — 셀 높이 고정 후 일정 목록 스크롤 */
.calendar-st2 tbody td .item { height: 176px; max-height: 176px; overflow: hidden; }
.calendar-st2 tbody td .item .item-list-st5 { max-height: 120px; overflow-y: auto; }
@media only screen and (max-width: 1023px) {
    .calendar-st2 tbody td .item { height: 126px; max-height: 126px; }
    .calendar-st2 tbody td .item .item-list-st5 { max-height: 70px; }
}

/* type=date 빈값 시 브라우저 한글(연도-월-일) 대신 메시지 문구 표시, 달력 아이콘 유지
   (포커스해도 빈 값이면 안내문구 유지 — 단, 브라우저 달력 팝업 언어는 OS 설정이라 변경 불가) */
.date-input-i18n { position: relative; }
.date-input-i18n .date-input-ph {
	position: absolute;
	left: 12px;
	top: 50%;
	transform: translateY(-50%);
	color: #56595E;
	font-size: clamp(16px, 3vw, 1.8rem);
	pointer-events: none;
	z-index: 1;
	white-space: nowrap;
}
.date-input-i18n.has-value .date-input-ph { display: none; }
.date-input-i18n:not(.has-value) input[type="date"] { color: transparent; }
.date-input-i18n:not(.has-value) input[type="date"]::-webkit-datetime-edit { color: transparent; }
.date-input-i18n input[type="date"]::-webkit-calendar-picker-indicator { cursor: pointer; opacity: 1; position: relative; z-index: 2; }

/* 게시판 상세 본문(TinyMCE) — 에디터 등록 화면과 사용자 노출 정합
   table.css img width:100% / default.css a{display:block;color:inherit} 보정 (퍼블 table.css·default.css 정리 전 임시) */
.board_detail .content_box img {
	max-width: 100%;
	width: auto;
	height: auto;
}
.board_detail .content_box a {
	display: inline;
	color: #007a9f;
	text-decoration: underline;
	text-underline-position: under;
	word-break: break-word;
}
.board_detail .content_box a:hover {
	color: #007a9f;
	text-decoration: underline;
}
.board_detail .content_box p {
	margin: 0 0 1em;
}
.board_detail .content_box p:last-child {
	margin-bottom: 0;
}
.board_detail .content_box p:empty {
	margin: 0;
	min-height: 0;
}
.board_detail .content_box ul,
.board_detail .content_box ol {
	margin: 0 0 1em;
	padding-left: 1.5em;
}
.board_detail .content_box li {
	display: list-item;
}