@charset "utf-8";

/*
	[프로그램팀 맞춤제작 및 수정 CSS]

	copyright(c) 상상너머·원데이넷 all rights reserved.
	허용된 라이센스이외 무단도용재배포를 금합니다.
	본 소스는 모두 (주)상상너머의 지적 재산이며, 이에 대해 무단도용 및 수정 재배포/재편집등을 절대 금하며 적발 시 법적 대응을 할 것임을 경고합니다.

	※ css 추가 시, 반드시 날짜와 작업자 이니셜을 기재바랍니다.

	===============================================================================
	반응형으로 제작되어 임의적인 CSS추가는 문제가 될 수 있으니 디자인팀과 반드시 상의바랍니다.
	===============================================================================
*/

/* 2차 카테고리 뱃지 박스 (호라이즌 스크롤) - ctg3_box 스타일 참고 */
/* 데스크탑 900px 이상 */
@media screen and (min-width: 901px) {
	.p_Category .ctg2_badge_box {
		overflow: hidden;
		margin-bottom: -15px;
		padding: 15px 0;
	}

	.p_Category .ctg2_badge_box .swipe_box {
		display: block;
		overflow: visible;
		-webkit-overflow-scrolling: touch;
	}

	.p_Category .ctg2_badge_box .swipe_box #js_cate2badge_iscroll {
		overflow: hidden;
		-webkit-overflow-scrolling: touch;
	}

	.p_Category .ctg2_badge_box .sub_badge_group {
		display: flex;
		flex-direction: row;
		justify-content: center;
		align-items: flex-start;
		flex-wrap: wrap;
		gap: 5px 5px;
		width: 100%;
	}

	.p_Category .ctg2_badge_box .sub_badge {
		font-size: 13px;
		color: #666;
		padding: 0 10px;
		box-sizing: border-box;
		height: 30px;
		display: flex;
		justify-content: center;
		align-items: flex-start;
		flex-direction: column;
		transition: all 0.3s ease-out;
		text-align: center;
		font-weight: 500;
		border: 1px solid #ccc;
		border-radius: 100px;
		line-height: 1;
		text-decoration: none;
		white-space: nowrap;
		flex-shrink: 0;
	}

	.p_Category .ctg2_badge_box .sub_badge:hover {
		color: var(--primary-color);
		border-color: var(--primary-color);
	}

	.p_Category .ctg2_badge_box .sub_badge.active {
		color: var(--primary-color);
		font-weight: 700;
		border-color: var(--primary-color) !important;
	}
}