@charset "utf-8";

.subContainer {margin-top: 120px;}

/* sub navigation */
.sub_lnb {position: fixed; width: 100%; height: 60px; background: url('/images/page/contents/lnb_bg.png') no-repeat right 50%, linear-gradient(to right, #00339f, #21388b); background-size: cover; transition: all 0.3s ease-in-out; z-index: 8000;}
.cont_navigation {position: relative; display: flex; align-items: center; height: 60px;}
.cont_navigation .home {display: flex; align-items: center; justify-content: center; width: 60px; height: 60px; text-align: center;}
.cont_navigation .home > i {font-size: 18px; color: #fff; vertical-align: -webkit-baseline-middle;}
.cont_navigation .navi_select {position: relative; z-index: 100;}
.cont_navigation .navi_select .depth {position: relative; display: block; width: 220px; height: 100%; padding: 0 20px; text-align: left; transition: all .3s;}
.cont_navigation .navi_select .depth:after {content: ''; position: absolute; top: 50%; right: 0; margin-top: -9px; display: block; width: 1px; height: 18px; background-color: rgba(255, 255, 255, .3);}
.cont_navigation .navi_select.select1 .depth:before {content: ''; position: absolute; top: 50%; left: 0; margin-top: -9px; display: block; width: 1px; height: 18px; background-color: rgba(255, 255, 255, .3);}
.cont_navigation .navi_select .depth span {position: relative; display: block; color: #fff; font-size: 1rem; line-height: 100%; letter-spacing: -0.05rem; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.cont_navigation .navi_select .depth span:after {content: ''; position: absolute; top: 50%; right: 5px; margin-top: -5px; display: block; width: 8px; height: 8px; border-bottom: 2px solid #fff; border-right: 2px solid #fff; transform: rotate(45deg); transition: all .4s; box-sizing: border-box;}

.cont_navigation .navi_list {position: absolute; top: 30px; left: 0; width: 100%; background-color: rgba(255, 255, 255, .9); backdrop-filter: blur(3px); border: 1px solid var(--gray-200); padding: 10px 12px; display: none; border-radius: 16px;}
.cont_navigation .navi_list li {display: block; font-size: 1rem; padding: 10px 12px; line-height: 1; border-radius: 8px;}
.cont_navigation .navi_list li a {display: block; color: #666; letter-spacing: -0.05rem; white-space: nowrap; text-overflow: ellipsis; overflow: hidden;}
.cont_navigation .navi_list li:hover {background-color: var(--gray-100);}
.cont_navigation .navi_list li:hover a {color: var(--main-color);}

/* navi active */
.cont_navigation .navi_select.active .depth span:after {transform: rotate(225deg);}

/* scroll lnn */
.down .sub_lnb {margin-top: -40px;}

/* sub tit */
.sub_wrap {padding-top: 150px;}
.page_title .inner {border-bottom: 1px solid var(--gray-200); padding-bottom: 40px;}
.page_title .inner:after {content: ''; clear: both; display: block;}
.page_title h1 {font-size: 36px; font-weight: 800; color: #000;}
.page_title p {font-size: 18px; font-weight: 400; color: var(--gray-400); margin-top: 20px;}
.page_title p > b {color: var(--sub-color);}


/* navigation - page_path */
.page_path {position: absolute; bottom: 50px; right: 0; display: flex; align-items: center;}
.page_path li {position: relative; font-size: 15px; color: var(--gray-300); font-weight: 500; padding: 0 10px;}
.page_path li a {color: var(--main-color);}
.page_path li:before {content: ''; display: block; position: absolute; top: 50%; left: 0; width: 2px; height: 10px; margin-top: -5px; margin-left: 1px; background-color: var(--gray-200); transform: rotate(15deg);}
.page_path li:first-child:before {content: none;}
.page_content {padding: 60px 0 120px;}


/* page intro title */
h2.intro_tit {font-size: 26px; font-weight: 700; margin-bottom: 40px; word-break: keep-all;}
h2.intro_tit > b {color: var(--main-color);}


/* section */
section + section {margin-top: 60px;}

/* page content title */
.cont_tit {display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px;}
.cont_tit h4 {font-size: 28px; font-weight: 700;}


/* list style 공통 */
.list_st_dot > li {position:relative; padding-left:10px; text-align:left; font-size: 1rem}
.list_st_dot > li + li{margin-top:10px;}
.list_st_dot > li:before{content:''; width:4px; height:4px; border-radius:50%; background:#aaa; position:absolute; display:block; left:0; top:10px; margin-right:8px;}
.list_st_dot > li > b {color:#222;}
.list_st_dot > li > p {font-size: 17px; color: #333;}
.list_st_dot > li > ul {margin-top: 15px;}

.list_st_dash > li {position:relative; padding-left:10px; text-align:left; font-size: 1rem;}
.list_st_dash > li + li{margin-top:10px;}
.list_st_dash > li:before{content:'-'; position:absolute; display:block; left:0; top:0; margin-right:8px;}
.list_st_dash > li > b{color:#222;}


/* arw button */
.arw_btn {text-align: center; font-size: 1rem; font-weight: 700; width: 45px; height: 45px;}
.arw_btn .arw {position: relative; width: 100%; height: 100%; display: inline-block; border-radius: 50%; background: no-repeat 50% 50%; background-image: url('/images/page/common/icon_arw_wh.png'); background-size: auto 13px; background-color: #000; margin: 0 auto; z-index: 10; transition: all .3s;}
.arw_btn .arw_circle {content: ''; position: absolute; top: 0; left: 0; width: 100%; height: 100%; background-color: #fff; border-radius: 50%; z-index: 1; animation: wavePulse 1.6s linear infinite;}

.arw_btn:hover .arw {background-color: var(--main-color);}

@keyframes wavePulse {
    0% {
        -webkit-transform: scale(1);
        transform: scale(1);
        opacity: .3
    }

    100% {
        -webkit-transform: scale(1.6);
        transform: scale(1.6);
        opacity: 0
    }
}


/* tab */
.tab {display: inline-block; font-size: 0; margin-bottom: 60px;}
.tab .tab_item {display: inline-block; padding: 0 30px; height: 40px; font-size: 18px; line-height: 40px; color: var(--gray-400); background-color: var(--gray-100); border-radius: 20px; margin-right: 10px;}
.tab .tab_item.active {background-color: var(--main-color);}
.tab .tab_item.active {color: #fff; font-weight: 600;}

.tab_content {display: none;}
.tab_content.active {display: block;}


/* 준비중 페이지 */
.ready_box {text-align: center;}
.ready_box i {display: block; width: 120px; height: 120px; border: 5px solid #ddd; border-radius: 50%; margin: 0 auto;}
.ready_box i span {font-size: 60px; font-weight: 800; color: #ddd; line-height: 120px;}
.ready_box h5 {font-size: 35px; font-weight: 800; color: #111; letter-spacing: 5px; margin-top: 40px;} 
.ready_box p {margin-top: 30px; color: #666;}


/* 협회 소개 - 인사말 */
.greeting {display: flex; justify-content: space-between; gap: 40px 60px;}
.greeting .txt_box {position: relative; width: 55%;}
.greeting .txt_box p {margin-bottom: 24px; font-size: 18px; color: #111; word-break: keep-all;}
.greeting .sign {clear: both; padding-top: 40px; text-align: right;}
.greeting .sign * {display: inline-block; vertical-align: middle;}
.greeting .sign span {font-size: 1rem; font-weight: 400; color: var(--gray-400);}
.greeting .sign img {width: 150px; margin-left: 15px;}
.greeting .img_box {width: 45%; border: 0; padding-top: 47%;}


/* 협회 소개 - 연혁 */
.history .history_cont {margin-bottom: 100px;}
.history .history_cont .img_box {position: relative; width: 100%; height: 300px; border-radius: 20px; overflow: hidden; background-color: #000; margin-bottom: 60px;}
.history .history_cont .img_box > img {object-fit: cover;}
.history .history_cont .img_box p {position: absolute; left: 60px; bottom: 40px; font-size: 32px; font-weight: 700; color: #fff;}
.history .history_cont .item {display: flex; align-items: stretch; justify-content: space-between; padding-bottom: 50px;}
.history .history_cont .item:last-child {padding-bottom: 0;}
.history .history_cont .item .history_year {width: 295px; padding-left: 30px;} 
.history .history_cont .item .history_year h3 {position: relative; font-size: 32px; font-weight: 800; color: #111;}
.history .history_cont .item .history_year h3:after {content: ''; position: absolute; top: 50%; transform: translateY(-50%); right: -5.5px; width: 11px; height: 11px; background-color: var(--gray-200); border-radius: 50%; z-index: 10;}
.history .history_cont .item.active .history_year h3 {color: var(--main-color);}
.history .history_cont .item.active .history_year h3:after {background-color: var(--main-color);}

.history .history_list {position: relative; width: calc(100% - 295px); padding-left: 165px; padding-top: 10px;}
.history .history_list:before,
.history .history_list:after {content: ''; position: absolute; top: 20px; left: 0; width: 1px; height: calc(100% + 100px); background-color: var(--gray-200); transition: height 1s ease;}
.history .history_list:after {height: 0;}
.history .history_cont .item.active .history_list:after {background-color: var(--main-color); height: calc(100% + 100px);}
.history .history_list > li {display: flex; align-items: stretch; justify-content: space-between; font-size: 18px;} 
.history .history_list > li + li {margin-top: 20px;}
.history .history_list > li .month {width: 180px; font-weight: 600;}
.history .history_list > li > ul {width: calc(100% - 180px);}
.history .history_list > li > ul > li {position: relative; font-size: 17px; font-weight: 400; padding-left: 12px;}
.history .history_list > li > ul > li:before {content: ''; position: absolute; top: 12px; left: 0; width: 5px; height: 1px; background-color: var(--gray-300);}
.history .history_list > li > ul > li + li {margin-top: 10px;}
.history .history_list > li > ul > li > small {display: block; font-size: 14px; font-weight: 400; color: var(--gray-400);}


/* 협회 소개 - 조직도 : PC fluid (뷰포트에 따라 clamp 로 스케일) */
.organization {
	--org-box-w: clamp(140px, 12vw, 180px);
	--org-overseas-w: clamp(160px, 14vw, 200px);
	--org-dept-w: clamp(150px, 13vw, 200px);
	--org-dept-gap: 12px;
	--org-team-w: 130px;
	--org-side-offset: clamp(50px, 6.5vw, 90px);
	--org-general-gap: clamp(30px, 4vw, 60px);
	--org-box-h: 50px;
	--org-line: 2px;
	--org-line-color: var(--gray-200);
	/* axis pseudo 가 dept_row 바 top 에서 끊기도록 tree bottom 에서 뺄 offset.
	   = dept_row 전체 높이 (padding-top:30 + dept_node:135 = 165) */
	--org-dept-area-h: 165px;
	position: relative;
	overflow-x: clip;
}
.organization .org_chart {position: relative; max-width: 1440px; margin: 0 auto 100px; padding-top: 20px;}

/* ===== 리스트 초기화 =====
   padding 은 여기서 리셋 안 함 (team_list.padding-top 등 개별 규칙이 있음).
   개별 요소별로 padding 0 이 필요하면 그 곳에서 명시. */
.organization .org_tree,
.organization .org_tree ul,
.organization .org_tree li {list-style: none; margin: 0;}
.organization .org_tree,
.organization .subordinates {padding: 0;}
.organization .overseas_list {padding: 0;}

/* ===== 공통 박스 ===== */
.organization .node_box {
	display: flex; align-items: center; justify-content: center;
	width: var(--org-box-w); height: var(--org-box-h);
	color: #fff; font-size: 16px; font-weight: 600;
	border-radius: 6px; text-align: center; word-break: keep-all;
	position: relative; z-index: 2;
}
.organization .node_box.type_meeting,
.organization .node_box.type_general {background-color: #000; color: #fff;}
.organization .node_box.type_president {background-color: var(--main-color);}
.organization .node_box.type_board,
.organization .node_box.type_advisor,
.organization .node_box.type_committee {background-color: #fff; border: 2px solid var(--main-color); border-radius: 25px; color: var(--main-color);}
.organization .node_box.type_dept {background-color: #e8f4ff; color: #333; font-weight: 700; width: var(--org-dept-w);}
.organization .node_box.type_overseas_head {background-color: #97c56c; border-radius: 6px;}
.organization .chart_overseas.is_open .node_box.type_overseas_head {border-radius: 6px 6px 0 0;}

/* ===== 트리 최상위 ===== */
.organization .org_tree {
	position: relative;
	display: flex; flex-direction: column;
	align-items: center;
}
/* ★ 중앙 세로 축: 유일한 axis pseudo. 최상단(총회)~dept 바 top 까지. */
.organization .org_tree::before {
	content: '';
	position: absolute;
	top: 0;
	bottom: var(--org-dept-area-h);
	left: 50%; transform: translateX(-50%);
	width: var(--org-line);
	background-color: var(--org-line-color);
	z-index: 0;
}

/* .main = 축 상 렌더. box + subordinates 세로 정렬. */
.organization .main {
	position: relative;
	width: auto;
	display: flex; flex-direction: column;
	align-items: center;
}

/* ===== .subordinates (일반) =====
   width 100% (부모 .main 폭 = box_w), position:relative 로 포지셔닝 기준 확보.
   .main 만 in-flow (justify-content:center 로 중앙 정렬), advisory/sibling 은 모두 absolute.
   50% (= .main 축) 기준으로 좌우 오프셋 배치. */
.organization .subordinates:not(.dept_row) {
	position: relative;
	width: 100%;
	display: flex; justify-content: center;
	padding-top: 60px;
	margin-top: 10px;
	row-gap: 10px;
}
.organization .subordinates > .main {flex: 0 0 auto;}

/* --- advisory (이사회/상임고문): 부모 main↔이 main 사이 gap 영역에 absolute.
   x = 축(50%)에서 --org-side-offset 만큼 좌/우로 오프셋 */
.organization .subordinates > .advisory {
	position: absolute;
	top: 0;
	width: var(--org-box-w);
}
.organization .subordinates > .advisory.branch_left {
	right: calc(50% + var(--org-side-offset));   /* box 우측 edge = 축 - offset */
}
.organization .subordinates > .advisory.branch_right {
	left: calc(50% + var(--org-side-offset));    /* box 좌측 edge = 축 + offset */
}
/* advisory 가로 라인: box edge → 축 */
.organization .subordinates > .advisory.branch_left::before {
	content: '';
	position: absolute;
	top: calc(var(--org-box-h) / 2);
	left: 100%;
	width: var(--org-side-offset);
	height: var(--org-line);
	background-color: var(--org-line-color);
	z-index: 0;
}
.organization .subordinates > .advisory.branch_right::before {
	content: '';
	position: absolute;
	top: calc(var(--org-box-h) / 2);
	right: 100%;
	width: var(--org-side-offset);
	height: var(--org-line);
	background-color: var(--org-line-color);
	z-index: 0;
}

/* --- sibling (전문위원실/해외사무소): .main box 와 같은 y 에 absolute ---
   x = 축(50%)에서 (--org-general-gap + box_w/2) 만큼 좌/우 → box edge 가 .main box edge 에 general-gap 거리로 인접 */
.organization .subordinates > .sibling {
	position: absolute;
	top: 60px;
}
.organization .subordinates > .sibling.side_left {
	right: calc(50% + var(--org-general-gap) + var(--org-box-w) / 2);
	width: var(--org-box-w);
}
.organization .subordinates > .sibling.side_right {
	left: calc(50% + var(--org-general-gap) + var(--org-box-w) / 2);
	width: var(--org-overseas-w);
}
/* sibling → main box 가로 라인 */
.organization .subordinates > .sibling.side_left::before {
	content: '';
	position: absolute;
	top: calc(var(--org-box-h) / 2);
	left: 100%;
	width: var(--org-general-gap);
	height: var(--org-line);
	background-color: var(--org-line-color);
	z-index: 0;
}
.organization .subordinates > .sibling.side_right::before {
	content: '';
	position: absolute;
	top: calc(var(--org-box-h) / 2);
	right: 100%;
	width: var(--org-general-gap);
	height: var(--org-line);
	background-color: var(--org-line-color);
	z-index: 0;
}

/* ===== 해외사무소 ===== */
.organization .chart_overseas {width: var(--org-overseas-w);}
.organization .chart_overseas .node_box.type_overseas_head {width: 100%; cursor: pointer; transition: border-radius 0.3s ease;}
/* head 우측 화살표 (▼): 접힘=아래, 펼침=위 (180deg 회전).
   block 우측 끝에 absolute 로 배치, 세로 중앙 정렬. */
.organization .chart_overseas .node_box.type_overseas_head::after {
	content: '\25BC';
	position: absolute;
	right: 12px;
	top: 50%;
	font-size: 10px;
	transform: translateY(-50%);
	transition: transform 0.3s ease;
}
.organization .chart_overseas.is_open .node_box.type_overseas_head::after {
	transform: translateY(-50%) rotate(180deg);
}
/* PC 기본 접힘 상태. 펼침은 jQuery slideToggle 이 inline display 관리.
   (.is_open 클래스는 border-radius 와 화살표 회전만 담당) */
.organization .chart_overseas .overseas_list {display: none;}
.organization .overseas_list {border: 1px solid #ddd; border-top: none; border-radius: 0 0 6px 6px; overflow: hidden; position: relative; z-index: 2;}
.organization .overseas_list li {padding: 10px 14px; background-color: #f9f9f9; color: #666; text-align: center;}
.organization .overseas_list li + li {border-top: 1px solid #ddd;}
.organization .overseas_list li strong {display: block; font-size: 16px; font-weight: 700; line-height: 1.3; word-break: keep-all; overflow-wrap: anywhere;}
.organization .overseas_list li span {display: block; font-size: 16px; font-weight: 400; margin-top: 2px; line-height: 1.3; word-break: keep-all; overflow-wrap: anywhere;}

/* ===== dept_row (사무총장 산하 4개 본부) ===== */
.organization .subordinates.dept_row {
	position: relative;
	display: flex; justify-content: center; align-items: flex-start;
	gap: var(--org-dept-gap);
	width: max-content;
	margin: 30px auto 0;   /* 사무총장 box → dept_row 상단 gap = 30 (축 연장) */
	padding-top: 30px;     /* 바 → dept_head 세로 커넥터 공간 */
}
/* 본부 분배 가로 바 (첫 dept_head center → 마지막 dept_head center) */
.organization .subordinates.dept_row::before {
	content: '';
	position: absolute;
	top: 0;
	left: calc(var(--org-team-w) + 4px);    /* 첫 dept(2팀 268) center = 134 */
	right: calc(var(--org-dept-w) / 2);      /* 마지막 dept(dept_head 180) center = 90 */
	height: var(--org-line);
	background-color: var(--org-line-color);
	z-index: 0;
}
.organization .dept {
	position: relative;
	width: auto; flex: 0 0 auto;
	display: flex; flex-direction: column; align-items: center;
	gap: 0;
}
/* 각 dept 짧은 세로: 바 → dept_head (dept_row padding-top 30px 위 오버레이) */
.organization .dept::before {
	content: '';
	position: absolute;
	top: -30px; left: 50%; transform: translateX(-50%);
	width: var(--org-line); height: 30px;
	background-color: var(--org-line-color);
	z-index: 0;
}

/* ===== team_list ===== */
.organization .team_list {
	position: relative;
	padding-top: 30px;
	display: flex; gap: 8px;
	width: max-content; margin: 0 auto;
}
.organization .team_list::before {
	content: '';
	position: absolute;
	top: 0; left: 50%; transform: translateX(-50%);
	width: var(--org-line); height: 20px;
	background-color: var(--org-line-color);
	z-index: 0;
}
.organization .team_list::after {
	content: '';
	position: absolute;
	top: 20px;
	left: calc(var(--org-team-w) / 2);
	right: calc(var(--org-team-w) / 2);
	height: var(--org-line);
	background-color: var(--org-line-color);
	z-index: 0;
}
.organization .team_list:has(> li:only-child)::after {display: none;}
.organization .team_list > li {
	position: relative; z-index: 2;
	flex: 0 0 auto;
	width: var(--org-team-w); min-height: 55px;
	display: flex; align-items: center; justify-content: center;
	padding: 8px 6px;
	background-color: #eee; color: #666;
	font-size: 16px; font-weight: 600;
	text-align: center; border-radius: 6px;
	white-space: nowrap; word-break: keep-all; line-height: 1.3;
}
.organization .team_list > li::before {
	content: '';
	position: absolute;
	top: -10px; left: 50%; transform: translateX(-50%);
	width: var(--org-line); height: 10px;
	background-color: var(--org-line-color);
	z-index: 0;
}

.organization .bbsTop {margin-top: 60px;}
.organization .bbsTop .search_box {width: 100%; border-radius: 10px; padding: 20px 0; background-color: var(--gray-100);}

.org_tab {width: 100%; height: 60px; border-bottom: 1px solid var(--gray-200); background-color: #fff;}
.org_tab .inner {width: 100%; height: 100%; display: flex; align-items: center; justify-content: space-between; }
.org_tab .tab_item {position: relative; text-align: center; width: calc(100% / 8); height: 100%; line-height: 60px;}
.org_tab .tab_item:before {content: ''; position: absolute; left: 50%; bottom: 0; transform: translateX(-50%); width: 0; height: 3px; background-color: var(--main-color); transition: all .3s;}
.org_tab .tab_item > span {font-size: 17px; font-weight: 500; color: var(--gray-400);}
.org_tab .tab_item:hover:before,
.org_tab .tab_item.active:before {width: 100%;}
.org_tab .tab_item:hover > span,
.org_tab .tab_item.active > span {color: var(--main-color); font-weight: 700;}

/* .org_cont {padding-top: 60px;} */
.organization section:first-child {margin-top: 60px;}
.organization section .info li {font-size: 1rem;}
.organization section .info li {font-size: 1rem;}
.organization section .info li + li {margin-top: 5px;}
.organization section .info li i {width: 24px; height: 24px; border-radius: 50%; background-color: rgba(var(--sub-color-rgb), .2); color: var(--main-color); font-size: 1rem; line-height: 24px; text-align: center; margin-right: 5px;}

/* scroll org tab */
.org_tab.fixed {position: fixed; width: 100%; top: 140px; left: 0; z-index: 10;}
.org_wrap.fixed {padding-top: 60px;}


/* 협회 소개 - 오시는 길 */
.map_label {position: relative; display: inline-block; background: var(--main-color); padding: 10px 20px;}
.map_label > span {color: #fff;}
.map_label:after {content:''; position: absolute; left: 0; right: 0; bottom: -10px; margin: 0 auto; width: 0; height: 0; border-top: 10px solid var(--main-color); border-left: 10px solid transparent; border-right: 10px solid transparent;}

.location .map_cont .cont_tit {padding-left: 20px;}
.location .map_box {width: 100%; overflow: hidden; background-color: #ddd;}
.location .map_box .root_daum_roughmap {width: 100%;}
.location .map_box .root_daum_roughmap .wrap_map {height: 100%; height: 400px;}
.location .map_box .root_daum_roughmap .cont {display: none;}
.location .map_info {position: relative; background: linear-gradient(to right, #051632, var(--main-color)); border-radius: 20px 20px 0 0; padding: 30px 40px;}
.location .map_info .address {font-size: 26px; font-weight: 700; color: #fff; border-bottom: 1px solid rgba(255, 255, 255, .2); padding-bottom: 20px;}
.location .map_list {margin-top: 20px; font-size: 0;}
.location .map_list li {display: flex; align-items: center; font-size: 17px; color: #fff;}
.location .map_list li + li {margin-top: 10px;}
.location .map_list li .tit {position: relative; width: 120px;}
.location .map_list li .tit:after {content: ''; position: absolute; top: 50%; margin-top: -6px; right: 0; width: 2px; height: 12px; background-color: rgba(255, 255, 255, .2);}
.location .map_list li .tit strong {font-size: 18px; font-weight: 700; vertical-align: middle;}
.location .map_list li .tit i {background-color: rgba(255, 255, 255, .2); padding: 5px; border-radius: 50%; vertical-align: middle; margin-right: 10px;}
.location .map_list li p {display: block; padding-left: 20px;}


/* 사업공고 - 사업신청 폼 */
/* step */
.step {border:1px solid #ddd; border-radius:15px; margin-bottom:60px;}
.step .step_list:after {content: ''; clear: both; display: block;}
.step .step_list {width:fit-content; margin:0 auto; padding: 30px 0; font-size: 0;}
.step .step_list li {position: relative; float: left; padding: 0 50px 0 25px; font-size: 1rem; font-weight: 500; text-align: center;}
.step .step_list li:after {content: ''; position: absolute; right: 0; top: 50%; margin-top: -1px; width: 30px; height: 2px; border-bottom: 2px dashed var(--gray-200);}
.step .step_list li:last-child:after {content: none;}
.step .step_list li span {display: inline-block; max-width: 80px; font-weight: 800; text-transform: uppercase; font-size: 13px; border: 2px solid var(--gray-200); padding: 4px 8px; border-radius: 20px; vertical-align: middle; margin-right: 10px;}

.step .step_list li.on a {color: #243056; font-weight: 800;}
.step .step_list li.on:after {border-color: var(--main-color);}
.step .step_list li.on span {background: var(--main-color); color: #fff; border-color: var(--main-color); box-shadow: 0 5px 10px 0 rgba(var(--main-color-rgb), .2);}

.step .step_list li.end {color: var(--gray-400);}
.step .step_list li.end span {color: var(--gray-300); border-color: var(--gray-300); background-color: var(--gray-200);}
.step .step_list li.end:after {border-color: #999;}


/* 사업공고 - 협회일정 */
.schedule .all {background-color: #000;}

.schedule .calendar_top {display: flex; align-items: center; justify-content: center; gap: 0 20px; margin-bottom: 30px;}
.schedule .calendar_top .month_ctrl {display: flex; align-items: center; justify-content: center; gap: 0 15px;}
.schedule .calendar_top .month_ctrl button {width: 30px; height: 30px; border: 1px solid var(--gray-200); border-radius: 5px;}
.schedule .calendar_top .month_ctrl button > i {font-size: 20px; color: var(--gray-400);}
/* .schedule .calendar_top .month_ctrl select {padding-left: 20px; padding-right: 50px; height: 50px; border: 0; background-color: #fff; border: 1px solid var(--gray-200); border-radius: 6px; color: #111; font-size: 20px; font-weight: 600; cursor: pointer;} */
.schedule .calendar_top .month_label > h3 {font-size: 32px; font-weight: 700; display: inline-block;}
.schedule .cal_category {display: flex; align-items: center; justify-content: end; gap: 10px 10px; margin-bottom: 20px;}
.schedule .cal_category .item {border: 1px solid var(--gray-100); background-color: var(--gray-100); padding: 8px 20px; border-radius: 30px;}
.schedule .cal_category .item .dot {display: inline-block; width: 10px; height: 10px; border-radius: 50%; background-color: #666; vertical-align: middle; margin-right: 5px;}
.schedule .cal_category .item span {display: inline-block; vertical-align: middle; font-size: 15px; color: var(--gray-400); font-weight: 400;}
.schedule .cal_category .item.active {border: 1px solid var(--gray-200); background-color: #fff;}
.schedule .cal_category .item.active span {color: #111; font-weight: 500;}

.schedule .calendar {width: 100%;}
.schedule .calendar .sun > span {color: #FC6259 !important;}
.schedule .calendar .sat > span {color: #2A71EF !important;}
.schedule .calendar .cal_week {display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); background-color: rgba(var(--sub-color-rgb), .07); border-radius: 8px; margin-bottom: 10px;}
.schedule .calendar .cal_week .day {position: relative; text-align: center; padding: 16px 0; font-size: 17px; font-weight: 600; color: var(--gray-400);}
.schedule .calendar .cal_week .day:after {content: ''; position: absolute; right: 0; top: 50%; margin-top: -6px; width: 1px; height: 12px; background-color: #DEE3EA;}
.schedule .calendar .cal_week .day:last-child:after {content: none;}
.schedule .calendar .cal_date {display: grid; grid-template-columns: repeat(7, minmax(0, 1fr));}
.schedule .calendar .cal_date:last-child {border-bottom: 1px solid var(--gray-200);}
.schedule .calendar .cal_date .date {position: relative; min-height: 120px; border: 1px solid var(--gray-200); border-width: 1px 1px 0 0; padding: 50px 10px 0 10px; padding-top: 50px;}
.schedule .calendar .cal_date .date > span {position: absolute; top: 15px; left: 15px; display: inline-block; font-size: 1rem; font-weight: 400; color: #111; z-index: 10;}
.schedule .calendar .cal_date .date:last-child {border-right: 0;}
/* .schedule .calendar .cal_date .date.today {border-color: var(--sub-color)} */
.schedule .calendar .cal_date .date.today > span {color: #fff;}
.schedule .calendar .cal_date .date.today > span:before {content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 26px; height: 26px; background-color: var(--sub-color); border-radius: 50%; z-index: -1;}
.schedule .calendar .date_bar {position: absolute; left: 0; padding: 0 16px; height: 26px; line-height: 26px; z-index: 1000; border-radius: 15px; background-color: #ddd; color: #fff; font-weight: 500; font-size: 1rem;}
.schedule .calendar .date_bar.bar_start {border-radius: 15px 0 0 15px;}
.schedule .calendar .date_bar.bar_end {border-radius: 0 15px 15px 0;}

.schedule .calendar .cal_date .date_more_btn {position: absolute; bottom: 0; left: 0; right: 0; margin: 0 auto; padding-top: 0; margin-top: 0;}
.schedule .calendar .cal_date .date_more_btn {width: 100%; padding: 5px 0; text-align: center; font-size: 1rem; font-weight: 400; color: var(--gray-400);}
.schedule .calendar .cal_date .date_more_btn > span {color: var(--main-color); margin-right: 5px;}
.schedule .calendar .cal_date .date_more_btn:hover {color: var(--main-color); font-weight: 500;}

/* 타기관 공고 */
.ext_dl_group{background:var(--gray-100); padding:10px; border-radius:10px; display:flex; align-items: center; gap:10px; border:1px solid #ddd; flex-wrap: wrap;}
.ext_dl_group dl{display:flex; background:#fff; padding:2px 10px; border-radius:25px; border:1px solid #ddd; font-size:14px; gap:5px;}
.ext_dl_group > dl > dt{font-weight: 500; color:#222; white-space: nowrap;}
.ext_dl_group > dl > dt > i.bx{color:rgba(var(--main-color-rgb), 0.7);}
.ext_dl_group > dl > dd{color:#666;}
.ext_dl_group > dl > dd > div{display:flex; gap:0 5px; flex-wrap: wrap;}
.ext_dl_group > dl > dd > div span + span{position:relative; padding-left:12px;}
.ext_dl_group > dl > dd > div span + span:before{content:''; display:block; width:3px; height:3px; border-radius: 50%; background:#ddd; position:absolute; left:0; top:0; bottom:0; margin:auto;}



.ext_status{display:flex; justify-content: space-between; align-items: center; gap:40px; margin-top:30px; padding-bottom:30px; border-bottom:1px dashed #ddd;}
.ext_stend{text-align: center; width:fit-content; min-width:320px;}
.ext_stend > strong{font-family: var(--tit_font); font-size:18px; color:#fff; font-weight: 500; background:var(--main-color); display:block; padding:10px; border-radius:10px;}
.ext_stend > ul{display:flex; justify-content: center; align-items: stretch; gap:10px; margin-top:10px;}
.ext_stend > ul > li{width:calc((100% - 10px)/2); height:100%; padding:10px; border:1px solid #ddd; text-align: center; display: flex; flex-direction: column; justify-content: center;}
.ext_stend > ul > li b{font-size:26px;}
.ext_stend > ul > li span{font-size:16px;}


.ext_link{max-width:calc(100% - 360px); width:100%;}
.ext_link > ul{ display:flex; align-items: stretch; flex-wrap: wrap; gap: 10px;}
.ext_link > ul > li{border:1px solid #ddd; border-radius: 10px; padding:15px; height:100%;}
.ext_link > ul.layx4 > li{width:calc(25% - 15px);}
.ext_link > ul.layx5 > li{width:calc(20% - 16px);}
.ext_link > ul > li > a{display:block;}
.ext_link > ul > li.active{border-color:var(--main-color); background:rgba(var(--main-color-rgb), .05);}
.ext_link > ul > li.active > a > span{font-weight:600; color:var(--main-color);}
.ext_link > ul > li > a > span{text-align: left; font-size:14px; position:relative; padding-left:15px;}
.ext_link > ul > li > a p{text-align: right;}
.ext_link > ul > li > a p > b{font-size:20px;}
.ext_link > ul > li > a > span:before{content:''; display:block; width:8px; height:8px; border-radius:50%; position:absolute; left:0; top:0; bottom:0; margin: auto;}
.ext_link > ul > li:nth-child(11n+1) > a > span:before{background:#7C3AED}
.ext_link > ul > li:nth-child(11n+2) > a > span:before{background:#EA580C}
.ext_link > ul > li:nth-child(11n+3) > a > span:before{background:#E11D48}
.ext_link > ul > li:nth-child(11n+4) > a > span:before{background:#059669}
.ext_link > ul > li:nth-child(11n+5) > a > span:before{background:#2563EB}
.ext_link > ul > li:nth-child(11n+6) > a > span:before{background:#14B8A6}
.ext_link > ul > li:nth-child(11n+7) > a > span:before{background:#0284C7}
.ext_link > ul > li:nth-child(11n+8) > a > span:before{background:#9333EA}
.ext_link > ul > li:nth-child(11n+9) > a > span:before{background:#CA8A04}
.ext_link > ul > li:nth-child(11n+10) > a > span:before{background:#0F766E}
.ext_link > ul > li:nth-child(11n+11) > a > span:before{background:#DC2626}

.ext_link > ul > li > a p > span{color:#666; font-size:12px;}

/* 관련기관 / 기업 - 정부기관 & 지방자치단체 */
.public .public_box {padding: 20px 20px; border: 1px solid var(--gray-200); background-color: var(--gray-100); border-radius: 16px;}
.public .public_box ul {display: flex; align-items: stretch; flex-wrap: wrap; gap: 10px 20px;}
.public .public_box ul > li {position: relative; width: calc((100% - 80px) / 5); text-align: left;}
.public .public_box ul > li > a {display: block; width: 100%; height: 100%; background-color: #fff; border: 1px solid var(--gray-200); padding: 10px 20px; border-radius: 8px; font-size: 1rem; font-weight: 500; color: #111; transition: all .25s;}
.public .public_box ul > li > a span {transition: all .25s;}
.public .public_box ul > li > a i {display: flex; align-items: center; justify-content: center; width: 40px; height: 100%; position: absolute; top: 0; right: 0; border-left: 1px solid var(--gray-200); font-size: 18px; color: var(--gray-300); text-align: center; border-radius: 0 8px 8px 0; transition: all .25s;}

.public .public_box ul > li:hover > a {border-color: var(--main-color); box-shadow: 0 3px 15px 0 rgba(var(--main-color-rgb), .1);}
.public .public_box ul > li:hover > a span {padding-left: 10px;}
.public .public_box ul > li:hover > a i {border-color: var(--main-color); background-color: var(--main-color); color: #fff;}

/* .local_government .cont_tit {position: relative;}
.local_government .cont_tit:after {content: ''; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: calc(100% - 300px); border: 1px dashed var(--gray-200); z-index: -1;}
.local_government .cont_tit h4 {background-color: #fff;} */


/* 관련기업 소개 */
.partner .partnerList {display: flex; gap: 25px 25px; flex-wrap: wrap; align-items: stretch;}
.partner .partnerList li {width: calc((100% - 75px) / 4); border: 1px solid var(--gray-200); border-radius: 15px; overflow: hidden;}
.partner .partnerList li.nodata {width: 100%;}
.partner .partnerList li .thumb {position: relative; display: flex; align-items: center; justify-content: center; width: 100%; padding: 30px 30px; aspect-ratio: 16 / 9; background-color: #fff;}
.partner .partnerList li .thumb > img {max-width: 100%; max-height: 100%; object-fit: contain; transform: scale(1); transition: all .25s;}
.partner .partnerList li .link_btn {position: absolute; bottom: 10px; right: 10px; display: block; width: 40px; height: 40px; background-color: var(--gray-100); border: 1px solid var(--gray-200); border-radius: 10px; text-align: center; line-height: 40px; transition: all .25s;}
.partner .partnerList li .link_btn > i {font-size: 20px; color: var(--main-color);}
.partner .partnerList li .txt {border-top: 1px solid var(--gray-200); padding: 25px 25px;}
.partner .partnerList li .txt .tit {display: block; font-size: 18px; font-weight: 600; margin-top: 10px;}
.partner .partnerList li .txt P {font-size: 1rem; color: var(--gray-400); margin: 5px 0;}
.partner .partnerList li .txt P.address {font-size: 15px; color: #000;}
.partner .partnerList li .txt P.address > i {vertical-align: text-top;}
.partner .partnerList li:hover .link_btn {background-color: var(--main-color); border-color: var(--main-color);}
.partner .partnerList li:hover .link_btn > i {color: #fff;}
.partner .partnerList li:hover .thumb > img {transform: scale(1.1);}

.partner .partner_box {display: flex; justify-content: space-between; align-items: stretch; flex-wrap: wrap;}
.partner .partner_box .partner_img {position: relative; display: flex; align-items: center; justify-content: center; width: 380px; height: 220px; border: 1px solid var(--gray-200); padding: 30px 30px; overflow: hidden; background-color: #fff; border-radius: 10px;}
.partner .partner_box .partner_img > img {max-width: 100%; max-height: 100%; object-fit: contain;}
.partner .partner_box .partner_txt {width: calc(100% - 380px); padding-left: 80px;}
.partner .partner_box .partner_txt .tit {display: flex; align-items: center; justify-content: space-between; margin-bottom: 20px;}
.partner .partner_box .partner_txt .tit strong {font-size: 30px; font-weight: 700; color: #111;}
.partner .partner_box .partner_txt .tit .link_btn {display: block; width: 40px; height: 40px; background-color: var(--gray-100); border: 1px solid var(--gray-200); border-radius: 10px; text-align: center; line-height: 40px; transition: all .25s;}
.partner .partner_box .partner_txt .tit .link_btn > i {font-size: 20px; color: var(--sub-color);}
.partner .partner_box .partner_txt .tit .link_btn:hover {background-color: var(--sub-color); border-color: var(--sub-color);}
.partner .partner_box .partner_txt .tit .link_btn:hover > i {color: #fff;}
.partner .partner_box .partner_txt p {font-size: 18px; line-height: 1.5; font-weight: 400; color: #111;}
.partner .partner_box .partner_txt .cont_box {margin-top: 15px;}


/* 통합검색 */
.search section + section {padding-top: 60px; border-top: 1px dashed var(--gray-200);}
.search .pagination {margin-top: 40px !important;}

/* 팝업 */
.product_img {display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; border: 1px solid var(--gray-200); border-radius: 10px; overflow: hidden;}

/* 레이어팝업 layerpopup */
.layer_popup {position: fixed; top: 0; left: 0; z-index: 9999; width: 100%; height: 100%; display: none;}
.layer_popup {background: rgba(16, 25, 36, .4); backdrop-filter: blur(5px);}
.popup_box {position: fixed; top: 50%; left: 50%; transform: translate(-50%, -50%); max-width: 100%; width: 1024px; max-height: 95%; height: auto; background: #fff; border: 1px solid #eee; box-shadow: 0 3px 29px 0 rgba(0, 0, 0, 0.15); border-radius: 10px; overflow: auto;}
.popup_box.sm {width: 640px;}
.popup_box .popup_header {position: relative; width: 100%; height: 60px; background-color: var(--gray-100); padding: 16px 30px; border-bottom: 1px solid #eee;}
.popup_box .popup_header > h4 {font-size: 18px; font-weight: 600;}
.popup_box .close_btn {position: absolute; top: 0; right: 0; transform: none; z-index: 10; display: block; width: 60px; height: 60px; background: url("/images/page/common/icon_close.svg") no-repeat 50% 50%; background-size: 20px auto;}
.popup_box .popup_body {padding: 30px 30px;}
.popup_box .popup_body .map {height: 400px;}
.popup_box .search_box {margin-bottom: 30px;}
.popup_box .btn_wrap {margin-top: 0; padding-top: 10px; text-align: center !important;}
.popup_box .pagination {margin-top: 30px; padding-top: 20px;}
.popup_box .pagination .page_item {width: 35px; height: 35px; line-height: 33px; font-size: 15px;}
.popup_box .popup_bottom {padding: 16px 30px; border-top: 1px solid var(--gray-200);}
.popup_box .fixedY {max-height: 303px;}


@media (max-width: 1440px) {

	/* navigation - page_path */
	.page_path {right: 20px;}

	/* 협회 소개 - 조직도 */
	.org_tab .inner {padding: 0;}
	.org_tab.fixed .inner {padding: 0 20px;}
}


@media (max-width: 1280px) {

	/* sub tit */
	.sub_wrap {padding-top: 120px;}
	.page_title h1 {font-size: 32px;}


	/* 협회 소개 - 인사말 */
	.greeting .txt_box p {font-size: 16px;}


	/* 협회 소개 - 연혁 */
	.history .history_cont .img_box {height: 240px;}
	.history .history_cont .img_box p {font-size: 28px; left: 40px;}
	.history .history_cont .item .history_year h3 {font-size: 28px;}


	/* 협회 소개 - 조직도 */
	.org_tab .tab_item > span {font-size: 1rem;}


	/* 사업공고 - 협회일정 */
	.schedule .calendar_top .month_label > h3 {font-size: 28px;}

	/* 타기관 공고 */
	.ext_link > ul.layx5 > li{width:calc(25% - 7.5px);}

}

@media (max-width: 1024px) {

	/* sub navigation */
	.sub_lnb {height: 50px;}
	.cont_navigation {height: 50px;}
	.cont_navigation .home {width: 50px; height: 50px;}
	.cont_navigation .navi_list {top: 25px;}

	/* sub tit */
	.page_title p {font-size: 1rem;}


	/* list style 공통 */
	.list_st_dot > li > p {font-size: 1rem;}


    /* arw button */
    .arw_btn .arw {width: 40px; height: 40px; background-size: auto 9px;}


	/* 협회 소개 - 연혁 */
	.history .history_cont .item .history_year {width: 220px;}
	.history .history_cont .item .history_year h3 {font-size: 24px;}
	.history .history_list {width: calc(100% - 220px); padding-left: 120px;}
	.history .history_list > li {font-size: 16px;}
	.history .history_list > li .month {width: 120px;}
	.history .history_list > li > ul {width: calc(100% - 120px);}
	.history .history_list > li > ul > li {font-size: 1rem;}


	/* 협회 소개 - 조직도 */
	.org_tab {height: 50px;}
	.org_tab .tab_item {line-height: 50px;}

	/* scroll org tab */
	.org_tab.fixed {top: 130px;}


	/* 협회 소개 - 오시는 길 */
	.location .map_info .address {font-size: 22px;}


	/* 사업공고 - 협회일정 */
	.schedule .calendar .cal_week .day {font-size: 1rem;}

	/* 타기관 공고 */
	.ext_status{flex-direction: column; gap:30px;}
	.ext_stend {width:100%; display:flex; align-items: center; border:1px solid #ddd; border-radius:10px; overflow:hidden;}
	.ext_stend > strong{width:50%; max-width:320px; border-radius: 0;}
	.ext_stend > ul{width:80%; margin-top:0; padding:10px;}
	.ext_stend > ul > li{width:100%; flex-direction:row-reverse; align-items: center; gap:10px; padding:0; border:none; border-radius:0; }
	.ext_stend > ul > li + li{border-left:1px solid #ddd;}
	.ext_stend > ul > li > span{position:relative; padding-right:10px; font-size:16px;}
	.ext_stend > ul > li > span:before{content:':' color:#666; position:absolute; right:0;}
	.ext_stend > ul > li b{font-size:16px;}

	.ext_link{max-width:100%;}
	.ext_link > ul.layx4 > li{width:calc(25% - 7.5px);}

	/* 관련기관 / 기업 - 정부기관 & 지방자치단체 */
	.public .public_box ul > li {width: calc((100% - 60px) / 4);}

	/* 지원기업 소개 */
	.partner .partnerList li {width: calc((100% - 50px) / 3);}
	.partner .partner_box .partner_txt {padding-left: 40px;}
	.partner .partner_box .partner_txt .tit strong {font-size: 24px;}
	.partner .partner_box .partner_txt p {font-size: 16px;}


	/* 레이어팝업 layerpopup */
    .popup_box,
    .popup_box.sm {width: 94%;}
    .popup_box .popup_body {padding: 20px 20px;}
    .popup_box .popup_header {padding-left: 20px; padding-right: 20px;}

}

/* ===== 태블릿 (≤1280px): dept_head + 팀 리스트를 해외사무소 카드 스타일로 변환 ===== */
@media (max-width: 1280px) {
	/* 태블릿에선 팀 리스트가 세로 stack 이라 dept_row 세로 크기가 커짐.
	   axis pseudo `.org_tree::before { bottom: var(--org-dept-area-h) }` 값 재조정.
	   dept_row = padding-top(30) + dept_head(50) + team_list max(3팀 × 44 + 2 border 사이 + 2 outer border ≈ 136) = 216 */
	.organization {
		--org-dept-area-h: 216px;
	}
	/* dept_head: 해외사무소 head 처럼 상단 라운드 + 외곽선 (하단 border 제거로 team_list 와 연결) */
	.organization .node_box.type_dept {
		border-radius: 6px 6px 0 0;
		border: 1px solid #ddd;
		border-width: 1px 1px 0 1px;
	}
	/* dept_row 가로 바: 모든 dept 폭이 dept_head 폭(--org-dept-w)로 통일되니 (team_list 100%)
	   첫/마지막 dept center 오프셋 모두 dept_w/2 */
	.organization .subordinates.dept_row::before {
		left: calc(var(--org-dept-w) / 2);
		right: calc(var(--org-dept-w) / 2);
	}
	/* --- team_list: 해외사무소 리스트 스타일 (dept_head 아래 카드 body 로 연결) --- */
	.organization .team_list {
		flex-direction: column;
		gap: 0;
		padding-top: 0;
		width: 100%;
		margin: 0;
		border: 1px solid #ddd;
		border-radius: 0 0 6px 6px;
		overflow: hidden;
		left: auto; transform: none;
	}
	.organization .team_list::before,
	.organization .team_list::after {display: none;}
	.organization .team_list > li {
		width: 100%;
		min-height: 44px;
		padding: 10px 14px; font-size: 15px; font-weight: 400;
		white-space: normal;
		background-color: #f9f9f9;
		border-radius: 0;
	}
	.organization .team_list > li + li {border-top: 1px solid #ddd;}
	.organization .team_list > li::before {display: none;}
}

/* ===== 조직도 모바일 (≤1024px) ===== */
/* 좌정렬 축(x=70) + 우측 브랜치 + dept 세로 stack */
@media (max-width: 1024px) {
	.organization {
		--org-dept-area-h: 0;   /* 모바일에선 axis 가 dept 영역까지 관통 (dept_head 들이 축 상에 있음) */
	}
	.organization .org_chart {max-width: 340px; margin: 0 auto 60px;}

	.organization .node_box {width: 140px; height: 44px; font-size: 15px;}

	/* --- 트리 축 좌정렬 ---
	   .main 들 모두 flex-start 로 자기 컨테이너 좌측에 붙어야 축(x=70)에 정렬됨.
	   base .main 은 align-items:center 라 모바일에선 반드시 override. */
	.organization .org_tree {align-items: flex-start;}
	.organization .org_tree::before {left: 70px; transform: none;}
	.organization .main {align-items: flex-start;}

	/* --- subordinates (일반): block + absolute (PC 패턴과 통일) ---
	   DOM 순: advisory → sibling.side_left → main → sibling.side_right
	   Layout:
	   - .main: in flow, 좌축 (x=0~140, 축 x=70)
	   - .advisory: absolute at top:0, 우측 (x=180+)
	   - .sibling.side_left: absolute at .main box y, 우측
	   - .sibling.side_right: absolute, sibling.side_left 아래 */
	.organization .subordinates:not(.dept_row) {
		display: block;
	}

	/* --- advisory: absolute 우측. branch_left/right 구분 무시 (모두 우측) --- */
	.organization .subordinates > .advisory,
	.organization .subordinates > .advisory.branch_left,
	.organization .subordinates > .advisory.branch_right {
		position: absolute;
		top: 0;
		left: 180px;
		right: auto;
		width: 140px;
	}
	.organization .subordinates > .advisory.branch_left::before,
	.organization .subordinates > .advisory.branch_right::before {
		top: 50%; transform: translateY(-50%);
		left: -110px; right: auto;
		width: 110px;
	}

	/* --- .main: in flow (block). PC 의 absolute prop 필요 없음. --- */
	.organization .subordinates > .main {
		position: relative;
		top: auto; left: auto; right: auto;
	}

	/* --- sibling.side_left: absolute, .main box 와 같은 y --- */
	.organization .subordinates > .sibling.side_left {
		position: absolute;
		top: 68px;             /* subordinates padding-top 값 = .main box top */
		left: 180px;
		right: auto;
		width: 140px;
	}
	.organization .subordinates > .sibling.side_left::before {
		top: 50%; transform: translateY(-50%);
		left: -40px; right: auto;
		width: 40px;
	}

	/* --- sibling.side_right: absolute, sibling.side_left 아래에 위치 고정.
	   in-flow 로 두면 .main (사무총장) 이 자기 dept_row 를 포함해 매우 tall 해져서
	   side_right 이 dept 최하단 아래로 밀려남 → 반드시 absolute.
	   top = padding-top(68) + side_left height(44) + gap(24) = 136 */
	.organization .subordinates > .sibling.side_right {
		position: absolute;
		top: 136px;
		left: 180px;
		right: auto;
		margin: 0;
		width: 160px;
	}
	/* bracket 세로 (사무총장 middle y=22 → 해외사무소 head middle y=22 in side_right frame) */
	.organization .subordinates > .sibling.side_right::before {
		top: -46px;
		left: -20px; right: auto;
		width: var(--org-line); height: 68px;
	}
	/* bracket 하단 가로 (세로 → 해외사무소 head 좌측) */
	.organization .subordinates > .sibling.side_right::after {
		content: '';
		position: absolute;
		top: 22px; left: -20px;
		width: 20px; height: var(--org-line);
		background-color: var(--org-line-color);
		z-index: 0;
	}

	/* --- 해외사무소 리스트: 모바일은 항상 펼침 (토글 비활성) ---
	   base 의 `.chart_overseas.is_open .overseas_list` (0,3,0) 을 이기려면 최소 0,4,0 필요 */
	.organization .chart_overseas {width: 160px;}
	.organization .chart_overseas .node_box.type_overseas_head {height: 44px; font-size: 15px; cursor: default; border-radius: 6px 6px 0 0;}
	/* 모바일에선 화살표 숨김 (토글 비활성이라 표시할 이유 없음) */
	.organization .chart_overseas .node_box.type_overseas_head::after {display: none;}
	/* 모바일 항상 펼침. slideToggle 이 inline style 로 display 를 설정할 수 있으므로 !important 로 강제. */
	.organization .chart_overseas .overseas_list {display: block !important;}
	.organization .overseas_list li {padding: 8px 12px;}
	.organization .overseas_list li strong {font-size: 14px;}
	.organization .overseas_list li span {font-size: 13px;}

	/* --- dept_row: 세로 stack. subordinates.dept_row 오버라이드.
	   width:max-content 로 dept 내용 (dept_head 140 + gap 40 + team_list 140 = 320) 에 맞춤.
	   부모 .main 이 140 wide 여도 dept_row 는 320 로 우측 overflow (visible).
	   margin-top: 사무총장 우측에 absolute 로 걸린 해외사무소(side_right) 와 겹치지 않게
	   해외사무소 총 높이(head 44 + list 3항목 ≈ 180 = ~224) + gap 24 여유 → 250 하드코딩.
	   해외사무소 개수/컨텐츠 바뀌면 이 값 재조정. */
	.organization .subordinates.dept_row {
		display: flex; flex-direction: column;
		align-items: stretch;
		gap: 24px;
		width: max-content;
		margin: 250px 0 0;
		padding-top: 0;
	}
	/* 모바일 dept_row 세로 축 (base 의 가로바 pseudo 리셋 → 세로선으로 재활용) */
	.organization .subordinates.dept_row::before {
		left: 70px; right: auto;
		top: 0; bottom: 0;
		width: var(--org-line); height: auto;
	}
	/* --- dept: 가로 (dept_head + team_list) --- */
	.organization .dept {
		width: 100%;
		flex-direction: row; align-items: flex-start;
		gap: 40px;
	}
	.organization .dept::before {display: none;}   /* dept_row 축이 대신함 */
	/* 모바일 dept_head: border 사면 + 라운드 사면 (태블릿의 border-width/radius override) */
	.organization .node_box.type_dept {
		width: 140px; margin: 0;
		border: 1px solid #ddd;
		border-width: 1px;
		border-radius: 6px;
	}
	/* dept_head → team_list 가로 라인 */
	.organization .node_box.type_dept::after {
		content: '';
		position: absolute;
		top: 50%; right: -40px;
		width: 40px; height: var(--org-line);
		background-color: var(--org-line-color);
		z-index: 0;
	}

	/* --- team_list: 모바일 세로 stack (해외사무소 리스트 스타일은 1280px 블럭에서 상속).
	   태블릿의 `border-radius: 0 0 6px 6px` (dept_head 와 연결된 카드) override → 사면 라운드 (독립 박스) */
	.organization .team_list {width: 140px; border-radius: 6px;}
	.organization .team_list > li {width: 140px;}
}

@media (max-width: 768px) {
	/* sub tit */
	.sub_wrap {padding-top: 90px;}
	.page_title .inner {padding-bottom: 30px;}
	.page_title h1 {font-size: 28px;}


	/* navigation - page_path */
	.page_path {bottom: 30px;}
	.page_content {padding: 60px 0 80px;}


	/* page intro title */
	h2.intro_tit {font-size: 22px;}


	/* section */
	section + section {margin-top: 40px;}


	/* page content title; */
	.cont_tit h4 {font-size: 22px;}


	/* tab */
	.tab {display: flex; align-items: center; flex-wrap: nowrap; gap: 10px; margin-bottom: 40px; width: 100%; overflow-y: hidden; overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none;}
	.tab .tab_item {font-size: 16px; margin-right: 0; padding: 0 24px; white-space: nowrap;}

	
	/* 협회 소개 - 인사말 */
	.greeting {flex-direction: column-reverse;}
	.greeting .txt_box {width: 100%;}
	/* 이미지 안나오는거 확인하기 */
	.greeting .img_box {width: 100%; padding-top: 80%;}


	/* 협회 소개 - 연혁 */
	.history .history_cont .img_box {height: 200px; margin-bottom: 40px;}
	.history .history_cont .img_box p {font-size: 24px;}


	/* 협회 소개 - 조직도 */
	.org_tab .inner {overflow-x: auto; overflow-y: hidden; flex-wrap: nowrap; gap: 0 30px; scrollbar-width: none; -ms-overflow-style: none;}
	.org_tab .tab_item {width: auto; white-space: nowrap;}

	/* 협회 소개  - 오시는 길 */
	.location .map_info {padding: 24px 30px;}
	.location .map_list li {display: block;}
	.location .map_list li .tit {display: block; width: 100%;}
	.location .map_list li .tit:after {content: none;}
	.location .map_list li p {padding-left: 0; margin-top: 10px;}


	/* 사업공고 - 사업신청 폼 */
	.step .step_list {margin: 0; flex-direction: column; padding: 20px 20px;}
	.step .step_list li {float: none; width: 100%; text-align: left; padding: 0;}
	.step .step_list li:after {content: none;}
	.step .step_list li + li {margin-top: 10px;}
	.step .step_list li span {display: inline-block; margin: 0 10px 0 0;}


	/* 사업공고 - 협회일정 */
	.schedule .calendar_top .month_label > h3 {font-size: 24px;}
	.schedule .cal_category {justify-content: start; flex-wrap: nowrap; overflow-y: hidden; overflow-x: auto; scrollbar-width: none; -ms-overflow-style: none;}
	.schedule .cal_category .item {white-space: nowrap;}

	/* 타기관 공고 */
	.ext_link > ul.layx4 > li, .ext_link > ul.layx5 > li{width:calc(50% - 5px);}

	/* 관련기관 / 기업 - 정부기관 & 지방자치단체 */
	.public .public_box ul > li {width: calc((100% - 40px) / 3);}

	
	/* 지원기업 소개 */
	.partner .partnerList li {width: calc((100% - 25px) / 2);}
	.partner .partner_box {display: block;}
	.partner .partner_box .partner_img {margin: 0 auto;}
	.partner .partner_box .partner_txt {width: 100%; padding-left: 0; padding-top: 40px;}
}

@media (max-width: 640px) {
	/* sub navigation */
	/* .cont_navigation .navi_select.select1 {display: none;} */
	.cont_navigation .home {display: none;}
	.cont_navigation .navi_select {width: 50%;}
	.cont_navigation .navi_select .depth {width: 100%;}

	/* 타기관 공고 */
	.ext_dl_group{flex-direction: column;}
	.ext_dl_group dl{padding:8px 10px; width:100%;}

	.ext_stend{flex-direction: column;}
	.ext_stend > strong{width:100%; max-width: unset;}
	.ext_stend > ul{width:100%;}

	.ext_link > ul > li > a{width:100%; display:flex; align-items: center; justify-content: space-between;}

}

@media (max-width: 576px) {

	/* navigation - page_path */
	.page_path {position: static; margin-top: 20px;}


	/* page intro title */
	h2.intro_tit > br {display: none;}


	/* 협회 소개 - 연혁 */
	.history .history_cont .item {flex-direction: column;}
	.history .history_cont .item .history_year {width: 100%; padding-left: 0; margin-bottom: 10px;}
	.history .history_cont .item .history_year h3 {padding-left: 30px;}
	.history .history_cont .item .history_year h3:after {left: 0;}
	.history .history_list {width: 100%; padding-left: 30px;}
	.history .history_list:before, .history .history_list:after {top: -30px; left: 5px;}
	.history .history_list > li {display: block;}
	.history .history_list > li .month {display: block; width: 100%; margin-bottom: 10px;}
	.history .history_list > li > ul {width: 100%;}
	.history .history_list > li > ul > li + li {margin-top: 5px;}


	/* 협회 소개 - 오시는 길 */
	.location .map_info .address {font-size: 18px;}
	.location .map_list li {font-size: 1rem;}
	.location .map_list li p {word-break: keep-all;}


	/* 사업공고 - 협회일정 */
	.schedule .calendar .date_bar {font-size: 12px; padding: 0 10px;}


	/* 관련기관 / 기업 - 정부기관 & 지방자치단체 */
	.public .public_box ul > li {width: calc((100% - 20px) / 2);}


	/* 지원기업 소개 */
	.partner .partnerList li {width: 100%;}

	/* 타기관 공고 */
	.ext_link > ul.layx4 > li, .ext_link > ul.layx5 > li{width:100%;}
}

@media (max-width: 420px) {
	/* sub tit */
	.page_title h1 {font-size: 25px;}
	.page_title p {margin-top: 10px;}
	

	/* page intro title */
	h2.intro_tit {font-size: 20px; margin-bottom: 24px;}


	/* 협회 소개 - 인사말 */
	.greeting .txt_box p {font-size: 1rem;}

	/* 타기관 공고 */
	.ext_link > ul > li{width:100%; }


	/* 관련기관 / 기업 - 정부기관 & 지방자치단체 */
	.public .public_box ul > li {width: 100%;}
	
}