@charset "utf-8";

/*
 * layout.css - 대구개인택시조합 사이트 전체 레이아웃 골격 스타일시트
 *  - 헤더(#hd): 상단 고정 2단 헤더(상단 로그인바 + 로고/GNB), 메인/서브 색상 분기
 *  - GNB/메가메뉴(.snb_area): 데스크톱 전체메뉴, GNB와 동일한 235px 고정폭 컬럼 정렬
 *  - 사이트맵(#sitemap_area): 모바일 전용 3단 드릴다운(전체메뉴 → 카테고리 → 하위)
 *  - 서브메뉴(#submenu_area): 서브페이지 상단 알약형 현재위치/드롭다운 메뉴
 *  - 푸터(#ft): 하단 로고/회사정보/저작권 + 탑버튼/개인정보 버튼
 *  - 데스크톱 기준 min-width:1900px, 모바일은 @media(max-width:500px)에서 vw 단위로 재정의
 */

/******************************  공통 영역  ******************************/
/* 전체 래퍼/컨테이너 - 데스크톱 최소 폭 1900px 보장 */
#wrap, .container { width: 100%; min-width: 1900px; }
/* 고정 2단 헤더(약 120px) 아래로 본문 배치 */
#wrap { padding-top: 120px; }
/* 콘텐츠 가운데 정렬용 고정폭 래퍼(헤더/푸터 등 넓은 영역 1600px) */
.sector { width: 1600px; margin: 0 auto; }
/* 서브페이지 본문용 좁은 고정폭 래퍼(1200px) */
.sub_sector { width: 1200px; margin: 0 auto; }

/* 본문 콘텐츠 영역 - 최소 높이 확보 + 상/하 여백 */
.contents {min-height: 25vh;padding-top: 100px;padding-bottom: 70px;}

/* 모바일 공통 오버라이드: 최소폭 해제, 헤더 높이만큼 vw로 상단 패딩, 폭 88%로 축소 */
@media screen and (max-width:500px) {
	#wrap, .container { min-width: 0; }
	#wrap { padding-top: 15vw; }            /* 모바일 헤더 높이(15vw)만큼 본문 내림 */
	.sector, .sub_sector { width: 88%; }    /* 좌우 6% 여백을 둔 화면 폭 88% */

	.contents {min-height: 60vh;padding-bottom: 30vw;}
}

/* 관리자 페이지 콘텐츠 래퍼(가운데 정렬, 1200px 고정) */
#admin_content{
	margin:50px auto;
	width:1200px;
}



/******************************  헤더  ******************************/
/* 헤더 전체 - 2단 고정 헤더. 기본(서브)=흰색/검정, 메인(.main)=진녹색/흰색 */
#hd {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	min-width: 1900px;
	background: #fff;
	border-bottom: 1px solid #e5e5e5;
	z-index: 9999;
	transition: transform .3s ease;
}
#hd.main {
	background: var(--main-color);
	border-bottom: 0;
}

/* 서브페이지 스크롤 시: 헤더(GNB) 숨김 → 서브메뉴만 상단 노출 */
body.hd_hide #hd { transform: translateY(-100%); }
body.hd_hide #submenu_area { margin-top: 12px; }  /* 헤더 사라진 만큼 서브메뉴를 상단으로 끌어올림 */

/* === 1단: 상단 로그인 바 === */
/* 상단 로그인 바 - 회색 배경, 메인에서는 반투명 검정으로 분기 */
#hd .hd_top_area {
	height: 50px;
	background: #fff;
	border-bottom: 1px solid #e5e5e5;
}
#hd.main .hd_top_area {
	background: rgba(0,0,0,0.12);
	border-bottom: 1px solid rgba(255,255,255,0.18);
}

/* 상단바 내부 1600px 고정폭, 우측 정렬(로그인 폼을 오른쪽에 배치) */
#hd .hd_top_inner {
	width: 1600px;
	height: 50px;
	margin: 0 auto;
	display: flex;
	align-items: center;
	justify-content: flex-end;
}

/* 상단 로그인 폼 - 가로 배치(라벨/입력칸/버튼 간격 8px) */
#hd .hd_login_form {
	display: flex;
	align-items: center;
	gap: 8px;
}

/* 로그인 폼 라벨(아이디/비밀번호 텍스트) - 메인에서는 흰색 */
#hd .hd_login_form .hd_label {
	color: #333;
	font-size: 15px;
}
#hd.main .hd_login_form .hd_label { color: #fff; }

/* 로그인 입력칸 공통 스타일(높이 30px, 반투명 흰 배경) */
#hd .hd_login_form .hd_input {
	height: 30px;
	padding: 0 8px;
	background: #ffffffE6;
	border: 1px solid #CCCCCC;
	border-radius: 4px;
	box-sizing: border-box;
}

/* 아이디 입력 그룹(여러 칸을 묶는 컨테이너) - 메인에서는 흰색 글자 */
#hd .hd_login_form .hd_id_group {
	display: inline-flex;
	align-items: center;
	gap: 4px;
	color: #333;
	font-weight: 600;
}
#hd.main .hd_login_form .hd_id_group { color: #fff; }

/* 아이디: 한 글자씩 입력하는 칸 - 칸 간격 좁힘 */
#hd .hd_login_form .hd_id_group {
	gap: 1px;
}
/* 아이디 한 글자 칸(정사각형 30x30, 가운데 정렬) */
#hd .hd_login_form .hd_id_cell {
	width: 30px;
	height: 30px;
	padding: 0;
	text-align: center;
	font-size: 15px;
}
#hd .hd_login_form .hd_id_mid { width: 50px; padding: 0 4px; }  /* 아이디 중간 입력칸(넓은 칸) */
#hd .hd_login_form .hd_id_fixed { display: inline-block; min-width: 18px; margin: 0 2px; text-align: center; color: #333; font-weight: 600; font-size: 15px; }  /* 아이디 사이 고정문자('바') - 아이디/비밀번호와 동일 크기(15px) */
#hd.main .hd_login_form .hd_id_fixed { color: #fff; }
#hd .hd_login_form .hd_pw { width: 240px; }  /* 비밀번호 입력칸 폭 */

/* 로그인/검색 등 아이콘 버튼(32x32 정사각, 아이콘 가운데 정렬) */
#hd .hd_login_form .hd_icon_btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 32px;
	height: 32px;
}

#hd .hd_login_form .hd_icon_btn img { width: 24px; height: 24px; }  /* 아이콘 버튼 내부 이미지 크기 */

/* 상단바 텍스트 링크(회원가입/로그아웃 등) - 메인에서는 흰색 */
#hd .hd_login_form .hd_top_link {
	color: #333;
	font-size: 14px;
	margin-left: 6px;
	white-space: nowrap;
}
#hd.main .hd_login_form .hd_top_link { color: #fff; }

/* 로그인 후 환영 인사(○○님 환영합니다) - 메인에서는 흰색 */
#hd .hd_login_form .hd_welcome {
	color: #333;
	font-size: 15px;
	margin-right: 6px;
}
#hd.main .hd_login_form .hd_welcome { color: #fff; }

/* 관리자 로그인 배지(빨간 알약) - 공개 페이지에서 관리자 로그인 상태를 눈에 띄게 표시(메인/서브 공통) */
#hd .hd_login_form .hd_admin_badge {
	background: #e23b30;
	color: #fff;
	padding: 4px 14px;
	border-radius: 14px;
	font-weight: 700;
	font-size: 14px;
}
#hd.main .hd_login_form .hd_admin_badge { color: #fff; }

/* === 2단: 로고 + GNB 영역 (로고 위아래 여백을 좁게, 높이 70px) === */
#hd .hd_gnb_area {
	position: relative;
	height: 70px;
}

/* 로고 - 좌측 배치, 서브=검정 로고 / 메인=흰색 로고 이미지로 교체 */
#hd .hd_gnb_area .logo {
	display: inline-block;
	width: 227px;
	height: 54px;
	margin-top: 8px;
	margin-left: 60px;
	background: url('/images/h_logo_bk.png') no-repeat left center / contain;
}
#hd.main .hd_gnb_area .logo {
	background-image: url('/images/h_logo.png');
}

/* GNB(주 네비게이션) - 우측 정렬, 우측 여백 85px(메가메뉴 .snb_box와 일치) */
#hd .hd_gnb_area .gnb {
	float: right;
	margin-right: 85px;
}

/* GNB 1차 항목 - 235px 고정폭 컬럼으로 정렬(아래 메가메뉴 컬럼과 폭 일치) */
#hd .hd_gnb_area .gnb > li {
	float: left;
	width: 235px;            /* snb 컬럼과 동일 고정폭 → 메가메뉴 정렬 일치 */
	margin-top: 20px;
	text-align: center;
}

/* GNB 1차 링크 텍스트 - 서브=검정 / 메인=흰색 */
#hd .hd_gnb_area .gnb > li > a {
	font-size: 24px;
	font-weight: 700;
	color: #333;
}
#hd.main .hd_gnb_area .gnb > li > a {
	color: #fff;
}

/* 현재 활성 GNB(.fc-main) - 기준 컬러 + 밑줄 강조 */
#hd .hd_gnb_area .gnb > li.fc-main > a {
	font-weight: 700;
	color: var(--main-color);
	border-bottom: 2px solid var(--main-color);
	padding-bottom: 4px;
}
#hd.main .hd_gnb_area .gnb > li.fc-main > a {
	color: #fff;
	border-bottom-color: #fff;
}

/* 사이트맵(햄버거) 버튼 - 데스크톱에서는 숨김, 모바일에서만 노출 */
#hd .hd_gnb_area .sitemap_btn {
	display: none;
}

/* === 모바일 헤더 오버라이드(max-width:500px) === */
@media screen and (max-width:500px) {
	/* 모바일 헤더: 최소폭 해제, 높이 자동(1단만 노출) */
	#hd {
		min-width: 0;
		height: auto;
	}

	/* 모바일은 상단 로그인바 숨김(사이트맵에서 로그인 처리) */
	#hd .hd_top_area {
		display: none;
	}

	/* 모바일 로고/햄버거 바 높이(화면폭 15vw) */
	#hd .hd_gnb_area {
		height: 15vw;
	}

	/* 모바일 로고 - vw 단위로 축소, 모바일 전용 로고 이미지로 교체 */
	#hd .hd_gnb_area .logo {
		width: 36vw;
		height: 11vw;
		margin-top: 2vw;
		margin-left: 6vw;
		background-image: url('/images/m_h_logo_bk.png');
	}
	#hd.main .hd_gnb_area .logo {
		background-image: url('/images/m_h_logo.png');
	}

	/* 모바일에서는 가로 GNB 숨김 → 사이트맵으로 대체 */
	#hd .hd_gnb_area .gnb {
		display: none;
	}

	/* 모바일 햄버거(사이트맵 열기) 버튼 - 우상단 고정, 서브/메인 아이콘 분기 */
	#hd .hd_gnb_area .sitemap_btn {
		display: block;
		position: absolute;
		top: 5.4vw;
		right: 6vw;
		width: 5.1vw;
		height: 4vw;
		background: url('/images/m_menu_ico_bk.png') no-repeat center center / contain;
	}
	#hd.main .hd_gnb_area .sitemap_btn {
		background-image: url('/images/m_menu_ico.png');
	}
}


/******************************  헤더 - 전체메뉴(메가메뉴)  ******************************/
/* 전체메뉴 패널 - GNB 호버 시 헤더(142px) 바로 아래에 펼쳐지는 반투명 흰 패널.
   기본 숨김 + 페이드/슬라이드 트랜지션, .snb_show로 노출 */
.snb_area {
	display: none;
	position: fixed;
	top: 120px;             /* 2단 헤더 높이만큼 아래에서 시작 */
	width: 100%;
	min-width: 1900px;
	height: auto;            /* 내용(가장 긴 메뉴 컬럼)에 맞춰 자동 높이 → 마지막 하위메뉴 아래에서 끝남 */
	padding-bottom: 8px;     /* 마지막 메뉴 항목 아래 여백(최소화) */
	overflow: hidden;        /* 내부 float 컬럼 높이를 패널 높이에 포함 */
	background: #FFFFFFE8;   /* 약 91% 불투명 흰 배경 */
	z-index: 999;
	opacity: 0;
	transform: translateY(-12px);
	transition: opacity .25s ease, transform .25s ease;
}
/* 노출 상태 - 불투명 + 제자리로 슬라이드 */
.snb_area.snb_show {
	opacity: 1;
	transform: translateY(0);
}

/* 메인페이지용 - 헤더와 함께 absolute 배치(메인 비주얼 위에 겹침) */
.snb_area.main {
	position: absolute;
	z-index: 9999;
}

/* 메가메뉴 컬럼 묶음 - 우측 정렬, GNB와 동일한 우측 여백으로 컬럼 위치 일치 */
.snb_area .snb_box {
	float: right;
	margin-right: 85px;      /* GNB와 동일한 우측 여백 → 컬럼 위치 일치 */
}

/* 메가메뉴 1개 컬럼 - GNB 1차 항목과 동일한 235px 고정폭으로 수직 정렬 일치 */
.snb_area .snb_box .snb {
	float: left;
	width: 235px;            /* GNB 항목과 동일 고정폭 */
}

.snb_area .snb_box .snb > ul {}

/* 메가메뉴 항목 - 컬럼 안에서 위아래 간격(상하간격 축소), 가운데 정렬 */
.snb_area .snb_box .snb > ul > li {
	margin: 24px 0;
	text-align: center;
}
/* 마지막 항목은 아래 여백 제거(패널 하단 공백 최소화) */
.snb_area .snb_box .snb > ul > li:last-child {
	margin-bottom: 0;
}

/* 메가메뉴 링크 텍스트 */
.snb_area .snb_box .snb > ul > li > a {
	font-size: 20px;
	line-height: 1.2;
}

/* 전체메뉴(하위메뉴) 오버 시 녹색(기준 컬러) + 굵기 700 */
.snb_area .snb_box .snb > ul > li > a:hover {
	color: var(--main-color);
	font-weight: 700;
}

/* 전체메뉴 카테고리(제휴사업/공지사항) + 하위(서브) 항목 */
/* 메가메뉴 카테고리 헤더(제휴사업/공지사항 등 묶음 제목) */
.snb_area .snb_box .snb > ul > li.snb_cat {
	margin: 24px 0 12px;
	font-size: 20px;
	font-weight: 400;
	color: #222;
}
/* 메가메뉴 카테고리 하위 항목 - 간격 좁힘 */
.snb_area .snb_box .snb > ul > li.snb_sub {
	margin: 14px 0;
}
/* 하위 항목 링크 - 작은 회색 글자(호버 시 녹색 강조) */
.snb_area .snb_box .snb > ul > li.snb_sub > a {
	font-size: 18px;
	color: #aaa;
}
.snb_area .snb_box .snb > ul > li.snb_sub > a:hover {
	color: var(--main-color);
	font-weight: 700;
}


/******************************  사이트맵(모바일 전체메뉴)  ******************************/
/* 데스크톱에서는 완전 숨김(모바일 전용 오버레이) */
#sitemap_area { display: none; }
#sitemap_area::-webkit-scrollbar { display: none; }  /* 스크롤바 숨김 */

/* === 모바일 사이트맵 오버레이(max-width:500px) === */
@media screen and (max-width:500px) {
	/* 우측 화면 밖(right:-100%)에 대기 → JS로 슬라이드인하는 전체화면 오버레이 */
	#sitemap_area {
		display: block;
		position: fixed;
		top: 0;
		right: -100%;
		width: 100%;
		height: 100%;
		background: #fff;
		overflow-y: auto;
		z-index: 99999;
	}

	/* 사이트맵 헤더(녹색 바: 로고 + 닫기 + 로그인) - 로그인 영역 줄 수에 따라 높이 자동 */
	#sitemap_area .sitemap_hd {
		height: auto;
		background: var(--main-color);
	}

	/* 메인페이지일 때는 로그인 영역 포함(버튼이 넘치면 자동 줄바꿈으로 높이 확장) */
	#sitemap_area.main .sitemap_hd {
		height: auto;
	}

	/* 로고 영역 행(높이 15vw) */
	#sitemap_area .sitemap_hd .sitemap_logo_area {
		height: 15vw;
	}
	
	/* 사이트맵 로고(모바일 흰 로고) */
	#sitemap_area .sitemap_hd .sitemap_logo_area .sitemap_logo {
		margin-top: 2vw;
		margin-left: 6vw;
		width: 36vw;
	}

	/* 사이트맵 닫기(X) 버튼 - 우상단 고정 */
	#sitemap_area .sitemap_hd .sitemap_logo_area .close_btn {
		position: absolute;
		top: 5.5vw;
		right: 6vw;
		width: 4vw;
		height: 4vw;
		background: url('/images/m_close_icon.png') no-repeat center center / contain;
	}

	/* 사이트맵 로그인 영역(헤더 하단, 흰 구분선 + 한 줄 정렬: 환영문구 좌측 / 버튼 우측) */
	#sitemap_area .sitemap_hd .sitemap_login_area {
		display: flex;
		flex-wrap: nowrap;
		justify-content: flex-end;
		align-items: center;
		gap: 4vw;
		border-top: 1px solid #fff;
		padding: 3vw 6vw;
		white-space: nowrap;
	}

	/* 로그인 시 환영 인사 - 좌측 배치(버튼은 우측으로 밀어냄) */
	#sitemap_area .sitemap_hd .sitemap_login_area .user_hello {
		margin-right: auto;
		color: #fff;
		font-size: 3.4vw;
	}

	/* 로그인/마이페이지/비밀번호찾기/로그아웃 버튼 - 아이콘+라벨 가로 배치(줄바꿈 없음) */
	#sitemap_area .sitemap_hd .sitemap_login_area > button {
		display: inline-flex;
		align-items: center;
		flex: 0 0 auto;
		gap: 1.2vw;
	}

	/* 버튼 아이콘 크기 */
	#sitemap_area .sitemap_hd .sitemap_login_area > button > img {
		width: 4.4vw;
	}

	/* 버튼 라벨(흰 글자) */
	#sitemap_area .sitemap_hd .sitemap_login_area > button > span {
		color: #fff;
		font-size: 3.4vw;
	}

	/* 사이트맵 메뉴 영역(GNB 목록 컨테이너) */
	#sitemap_area .sitemap_gnb_area {}

	/* 사이트맵 메뉴 리스트(<dl>) - 하단 여백 */
	#sitemap_area .sitemap_gnb_area .sitemap_gnb {
		margin-bottom: 15vw;
	}

	/* 1단 대분류(dt) + 2단 하위(dd) 공통 - 패딩/구분선/가운데 정렬 */
	#sitemap_area .sitemap_gnb_area .sitemap_gnb dt,
	#sitemap_area .sitemap_gnb_area .sitemap_gnb dd {
		padding: 3.5vw 0;
		border-bottom: 1px solid #BBBBBB;
		text-align: center;
	}

	/* 1단 대분류(dt) - 굵게 */
	#sitemap_area .sitemap_gnb_area .sitemap_gnb dt {
		font-weight: 700;
	}

	/* 2단 하위(dd) - 기본 숨김(대분류 탭 시 펼침), 연녹색 배경 */
	#sitemap_area .sitemap_gnb_area .sitemap_gnb dd {
		display: none;
		background: #E7F0EC;
	}
}


/******************************  푸터  ******************************/
/* 푸터 전체 - 어두운 회색 배경 바 */
#ft {
	padding: 25px 0;
	background: #333333;
}

/* 푸터 내부 정렬 기준(개인정보 버튼 절대배치 기준점) */
#ft .sector {
	position: relative;
}

/* 푸터 로고 */
#ft .ft_logo {
	margin-bottom: 26px;
}

/* 푸터 회사정보 텍스트(주소/연락처 등, 흰 글자) */
#ft .ft_info {
	font-size: 16px;
	font-weight: 300;
	line-height: 1.65;
	color: #fff;
}

#ft .ft_info > a {}

/* 저작권 한 줄(별도 줄로 표시) */
#ft .ft_info .copyright {
	display: block;
	margin-top: 20px;
	font-size: 16px;
}

/* 상단으로 이동 버튼 - 화면 우하단 고정 */
.top_btn {
	position: fixed;
	bottom: 50px;
	right: 30px;
	z-index: 99;
}

/* 개인정보처리방침 버튼 - 푸터 우상단에 테두리 박스로 배치 */
.privacy_btn {
	position: absolute;
	top: 20px;
	right: 0;
	padding: 10px 15px;
	border: 2px solid #BBBBBB;
	font-size: 20px;
	font-weight: 500;
	color: #BBBBBB;
}

/* === 모바일 푸터 오버라이드: 패딩/폰트/버튼을 vw로 축소 === */
@media screen and (max-width:500px) {
	#ft {
		padding: 2vw 0;
	}

	#ft .ft_logo {
		width: 45.2vw;
		margin-bottom: 1.5vw;
	}

	#ft .ft_info {
		font-size: 1.8vw;
	}

	#ft .ft_info .copyright {
		margin-top: 2vw;
		font-size: 1.6vw;
	}

	.top_btn {
		width: 15vw;
		bottom: 5vw;
		right: 0;
	}

	.privacy_btn {
		top: 1.5vw;
		padding: 1.5vw 1vw;
		border: 1px solid #BBBBBB;
		font-size: 2.2vw;
	}
}


/******************************  서브메뉴(서브페이지 현재위치 바)  ******************************/
/* 서브페이지 상단의 알약형(둥근 모서리) 녹색 바 - 홈/현재 GNB/현재 SNB 경로 표시.
   가로 가운데 정렬을 left:calc(50% - 930px)로 처리(폭 1860px의 절반) */
#submenu_area {
	position: fixed;
	top: 0;
	left: calc(50% - 930px);
	width: 1860px;
	height: 65px;
	margin-top: 152px;       /* 헤더 아래에 위치(헤더 숨김 시 margin-top 변동) */
	background: var(--main-color);
	border-radius: 54px;
	z-index: 99;
	transition: margin-top .3s ease;
}

#submenu_area .submenu_box {}

/* 홈 아이콘 + 현재 경로 박스 - 가로 배치 */
#submenu_area .submenu_box .home,
#submenu_area .submenu_box .current_box {
	float: left;
	line-height: 65px;
}

#submenu_area .submenu_box .home {
}

/* 홈 아이콘 이미지 */
#submenu_area .submenu_box .home > img {
	width: 35px;
}

/* 현재위치 박스(현재 GNB/SNB 이름) - 우측에 드롭다운 화살표 아이콘 */
#submenu_area .submenu_box .current_box {
	min-width: 270px;
	padding-left: 65px;
	box-sizing: border-box;
	color: #fff;
	background: url('/images/sub_down_arrow_icon.png') no-repeat center right;
}

#submenu_area .submenu_box .current_box.current_gnb {}  /* 현재 GNB(대분류) 칸 */

#submenu_area .submenu_box .current_box.current_snb {}  /* 현재 SNB(소분류) 칸 */

/* 마지막 뎁스: 화살표 제거 + 드롭다운 없음(텍스트만 표시) */
#submenu_area .submenu_box .current_box.current_last {
	background: none;
	cursor: default;
}

/* 현재위치 클릭 시 펼쳐지는 드롭다운 메뉴(기본 숨김) */
#submenu_area .submenu_box .submenu {
	display: none;
	position: absolute;
	top: 65px;
	width: 268px;
	border: 1px solid #ddd;
	z-index: 99;
}

/* 드롭다운 항목 - 흰 배경 + 하단 구분선 */
#submenu_area .submenu_box .submenu > li {
	border-bottom: 1px solid #ddd;
	background: #fff;
}

/* 드롭다운 링크 */
#submenu_area .submenu_box .submenu > li > a {
	display: block;
	padding: 12px 0;
	font-size: 20px;
	text-align: center;
}

/* GNB(대분류) 드롭다운 가로 위치 */
#submenu_area .submenu_box .submenu.submenu_gnb {
	left: 370px;
}

/* SNB(소분류) 드롭다운 가로 위치 */
#submenu_area .submenu_box .submenu.submenu_snb {
	left: 640px;
}

/* 3차(소소분류) 드롭다운 가로 위치 */
#submenu_area .submenu_box .submenu.submenu_snb.ssnb {
	left: 910px;
}

/* 모바일 전용 서브메뉴(현재 미사용, 기본 숨김) */
#submenu_area_mob {
	display: none;
}

/* === 모바일 서브메뉴 오버라이드: 알약형 → 화면 폭 꽉 찬 바로 전환 === */
@media screen and (max-width:500px) {
	/* #submenu_area {
		display: none;
	} */

	/* 모바일: 전체 폭 + 직각 모서리 바, 헤더(15vw) 바로 아래 고정 */
	#submenu_area {
		left: 0;
		width: 100%;
		height: 11.5vw;
		margin-top: 15vw;
		border-radius: 0;
	}

	/* 항목 가로 정렬(flex) */
	#submenu_area .submenu_box {
		display: flex;
		align-items: center;
	}

	#submenu_area .submenu_box .home,
	#submenu_area .submenu_box .current_box {
		height: 11.5vw;
		line-height: 1.25;
	}

	/* 모바일 홈 아이콘 축소 */
	#submenu_area .submenu_box .home > img {
		width: 3vw;
	}

	/* 모바일 현재위치 박스 - 폭/패딩/화살표/폰트 vw로 축소 */
	#submenu_area .submenu_box .current_box {
		display: flex;
		align-items: center;
		width: 30vw;
		min-width: 0;
		padding-left: 7vw;
		background-size: 2vw;
		font-size: 3vw;
	}

	/* 모바일 드롭다운 - 바 아래(11.5vw)에 폭 30vw로 표시 */
	#submenu_area .submenu_box .submenu {
		display: none;
		position: absolute;
		top: 11.5vw;
		width: 30vw;
	}

	#submenu_area .submenu_box .submenu > li > a {
		padding: 12px 0;
		font-size: 3vw;
	}

	/* 모바일 드롭다운 가로 위치(각 단계별 vw 오프셋) */
	#submenu_area .submenu_box .submenu.submenu_gnb {
		left: 9.6vw;
	}

	#submenu_area .submenu_box .submenu.submenu_snb {
		left: 39.6vw;
	}

	#submenu_area .submenu_box .submenu.submenu_snb.ssnb {
		left: 69.6vw;
	}
	
	/* #submenu_area_mob {
		position: fixed;
		display: block;
		width: 100%;
		margin-top: 15vw;
		padding: 3.7vw 0;
		background: var(--main-color);
		color: #fff;
		z-index: 99;
	}
	
	#submenu_area_mob .home {
		position: relative;
		top: -2px;
		width: 4vw;
		margin-right: 4vw;
	}
	
	#submenu_area_mob .submenu_name {
		font-size: 3vw;
		font-weight: 500;
	}
	
	#submenu_area_mob .submenu_arrow {
		display: inline-block;
		margin: 0 4.5vw;
	}
	
	#submenu_area_mob .submenu_arrow > img {
		width: 1vw;
	} */
}
/******************************  모바일 사이트맵 3단 드릴다운  ******************************/
/* 사이트맵 메뉴 구조: 1단 대분류(dt) → 2단 하위(dd) → 3단 더깊은 하위(.sitemap_sub) 패널.
   하위가 더 있는 2단 항목(.sitemap_drill)을 누르면 3단 패널이 슬라이드로 열림 */
@media screen and (max-width:500px) {
	/* 하위가 있는 항목(제휴사업 등)에 › 표시 → 더 깊은 메뉴가 있다는 안내 */
	#sitemap_area .sitemap_gnb dd.sitemap_drill {
		position: relative;
	}
	#sitemap_area .sitemap_gnb dd.sitemap_drill::after {
		content: "›";
		position: absolute;
		right: 7vw;
		top: 50%;
		transform: translateY(-50%);
		font-size: 5vw;
		color: #555;
	}

	/* 3단 하위 패널 - 기본 숨김(드릴다운 시 노출) */
	#sitemap_area .sitemap_sub {
		display: none;
	}
	/* 3단 패널 상단 뒤로가기 헤더(‹ 표시로 상위 단계로 복귀) */
	#sitemap_area .sitemap_sub .sitemap_sub_back {
		position: relative;
		padding: 3.5vw 0;
		border-bottom: 1px solid #BBBBBB;
		text-align: center;
		font-weight: 700;
	}
	#sitemap_area .sitemap_sub .sitemap_sub_back::before {
		content: "‹";
		position: absolute;
		left: 6vw;
		top: 50%;
		transform: translateY(-50%);
		font-size: 6vw;
		font-weight: 400;
	}
	/* 3단 패널 개별 항목(최종 링크) */
	#sitemap_area .sitemap_sub .sitemap_sub_item {
		padding: 3.5vw 0;
		border-bottom: 1px solid #BBBBBB;
		text-align: center;
	}
}
