@media screen and (max-width: 600px) {
	/* 0) 루트 가로 스크롤 근본 차단 */
	html, body {
		width: 100%;
		max-width: 100%;
		overflow-x: hidden;
	}
	#H-wrap-PC {
		display: none;
	}
	#H-wrap-M {
		display: block;
		height: 150px;
		width: 100%;
		border-bottom: 1px solid #e5e7eb;
		background-color: white;
		box-shadow: 0 1px 5px rgba(0, 0, 0, 0.05);
	}
	#H-wrap-M #H-1 {
		width: 100%;
		height: 50px;
		display: flex;
		align-items: center;
		justify-content: space-between;
		padding:8px;
		padding-left: 18px;
	}
	#H-wrap-M #H-1-1 {
		width: 34%;
		height: 100%;
		display: flex;
		align-items: flex-end;
		justify-content: right;
		white-space: nowrap;
	}
	#H-wrap-M #H-1-1 button {
		background: #ece19e;
		color: white;
		border: none;
		padding: 8px 10px;
		border-radius: 20px;
		font-size: 12px;
		cursor: pointer;
		transition: 0.3s ease;
		color: black;
		font-weight: bold;
	}
	#H-wrap-M #H-1-1 button:hover {
		background-color: #ebb36b;
		transform: translateY(-2px);
	}
	#H-wrap-M #H-1-1 {
		/* width: 40%; */
		height: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
		white-space: nowrap;
	}
	#H-wrap-M #H-logo {
		display: flex;
		width: 100%;
		align-items: center;
		justify-content: center;
	}
	#H-wrap-M #H-logo>a {
		text-decoration: none;
		display: flex;
		margin-top: 23px;
		font-size: 14px;
	}
	#H-wrap-M #H-logo-txt {
		font-family: 'Binggrae-Two';
	}
	#H-wrap-M #H-logo-img {
		margin-left: 6px;
		height: 34px;
	}
	#H-wrap-M .logo-color {
		color: #ffeb9e;
	}
	#H-wrap-M #H-1-3 {
		height: 100%;
		align-items: center;
		justify-content: center;
		white-space: nowrap;
		text-align: right;
	}
	#H-wrap-M #H-1-3 button {
		background: rgb(249, 244, 223);
		color: white;
		border: none;
		padding: 5px 5px;
		border-radius: 20px;
		font-size: 12px;
		cursor: pointer;
		transition: 0.3s ease;
		color: black;
		font-weight: bold;
		margin-bottom: 5px;
	}
	#H-wrap-M #H-1-3 button:hover {
		background: #ebb36b;
		transform: translateY(-2px);
	}
	#H-wrap-M #H-2 {
		width: 100%;
		display: flex;
		align-items: center;
		justify-content: center;
	}
	#H-wrap-M .search-box {
		display: flex;
		align-items: center;
		width: 80%;
		max-width: 500px;
		border: 2px solid #fd5d008c;
		border-radius: 30px;
		padding: 4px 12px;
		background-color: #fff;
		transition: 0.3s ease;
	}
	#H-wrap-M .search-box:focus-within {
		box-shadow: 0 0 0 3px #fd5d004d;
		transform: translateY(-1px);
	}
	#H-wrap-M .search-txt {
		border: none;
		background: none;
		outline: none;
		float: left;
		padding-left: 5px;
		color: #797979;
		font-size: 18px;
		line-height: 30px; /* min-width: 300px; */ /* max-width: 90%; */
		width: 800px;
		flex: 1;
	}
	#H-wrap-M .search-btn {
		color: #f9deec;
		float: right;
		width: 40px;
		height: 100%;
		border-radius: 50%;
		background-color: #fff;
		border: none;
		font-size: 16px;
		display: flex;
		justify-content: center;
		align-items: center;
	}
	#H-wrap-M .search-btn:hover {
		transform: scale(1.1);
	}
	#H-wrap-M #filter-M {
		font-size: 13px;
		list-style: none;
		display: flex;
		text-align: center;
		justify-content: center;
		background-color: #ffffff;
		min-height: 40px;
	}
	#H-wrap-M #filter-M>li {
		width: 100%;
	}
	#H-wrap-M #filter-M>li>div {
		height: 40px;
		display: flex;
		align-items: center;
		justify-content: center;
		transition: 0.3s;
	}
	#H-wrap-M #filter-M>li>div>a {
		display: block;
		padding: 6px 10px;
		border-radius: 12px;
		color: #333;
		text-decoration: none;
		transition: 0.3s;
		font-size: 14px;
	}
	#H-wrap-M #filter-M>li>div>a:hover {
		border: none;
		background-color: #fd5d00e8;
		color: #fff;
		transform: translateY(-1px);
	}
	#H-wrap-M #filter-M>li>ul {
		padding: 10px 0;
		list-style: none;
		border-left: 1px solid #999;
	}
	#H-wrap-M #filter-M>li>ul:first-child {
		border-left: none;
	}
	#H-wrap-M #filter-M>li.active>div>a {
		background-color: #fd5d00e8;
		color: #fff;
	}
	#H-wrap-M #filter-M .submenu li.selected {
		background-color: #f3f4f6;
		color: #fd5d0063;
	}
	#H-wrap-M .submenu>li {
		padding: 5px 0;
	}
	#H-wrap-M .submenu>li:hover {
		background-color: #eee;
	}
	/* 1) PC 헤더 숨기고 M 헤더만 표시 */
	#H-wrap-PC {
		display: none !important;
	}
	#H-wrap-M {
		display: block !important;
	}

	/* 3) 로고/이미지/아이콘이 폭을 밀어내지 않게 */
	#H-wrap-M img, #H-wrap-M svg, #H-wrap-M i {
		max-width: 100%;
		height: auto;
	}
	/* 4) 검색 박스: 고정폭/최소폭 제거 + 100% 채우기 */
	#H-wrap-M .search-box {
		width: 95%;
		max-width: 100%;
		height: 80%;
	}
	#H-wrap-M .search-txt {
		min-width: 0; /* ← 기존 PC 스타일의 min-width:300px 무력화 */
		width: 100%;
		max-width: 100%;
		box-sizing: border-box;
	}
	#H-wrap-M .search-btn {
		flex: 0 0 auto;
	}
	#H-wrap-M #H-3 {
		width: 100%;
		max-width: 100%;
		padding: 0;
		box-sizing: border-box;
		height: auto !important; /* ← 고정 높이 제거 */
		overflow: visible !important;
	}
	#H-wrap-M #H-2 {
		height: 50px;
		width: 100%;
		max-width: 100%;
		padding: 10px 12px 0px 12px;
		box-sizing: border-box;
	}
	#H-wrap-M #H-1-1 button, #H-wrap-M #H-1-3 button {
		max-width: 100%;
		white-space: nowrap;
	}
	/* 8) 혹시 남아있을 a, 버튼의 강제 마진으로 새는 것 방지 */
	#H-wrap-M a, #H-wrap-M button {
		max-width: 100%;
		text-decoration: none;
		margin-right: 3px;
		color: black;
	}

	/* === 펼침형 아코디언: 스크롤 금지, 레이아웃 아래로 밀림 === */
	#H-wrap-M #filter-M {
		user-select: none;
	}
	#H-wrap-M #filter-M>li>div {
		cursor: pointer;
	}

	/* 기본은 닫힘: 높이 0. padding은 열릴 때만 주자 */
	#H-wrap-M #filter-M .submenu {
		overflow: hidden; /* 내부 스크롤 안 나옴 */
	}

	/* 열린 상태에서만 padding / border 주기(시각적 구분) */
	#H-wrap-M #filter-M li.open>.submenu {
		padding: 10px 0;
		border-top: 1px solid #eee;
	}

	/* 항목 스타일(선택 표시 등) */
	#H-wrap-M #filter-M .submenu li {
		padding: 6px 0;
	}
	#H-wrap-M #filter-M .submenu li.selected {
		background: #f3f4f6;
		font-weight: 600;
	}

	/* 상단 라벨 활성 강조 */
	#H-wrap-M #filter-M>li.active>div>a {
		background: #fd5d00e8;
		color: #fff;
	}
}