/* s : global.css */
		:root {
			--screen-width: 1052px;

			/* 색상 */
			/* --background-color: #CFCFCF; */
			--background-color: #f5f5f5;
			--white-color: #fff;
			--deep-black-color: #000000;
			--black-color: #2b2b2b;
			--red-color: #ff0000;
			--yellow-color: #f9bb34;
			--gray-color: #bdbdbd;
			--gainsboro-color: #dddddd;
			--space-color: #444444;
			--table-color: #e8e8e8;

			/* 폰트 명 */
			--font-family: "YouandiNewHR";

			/* 폰트 사이즈 */
			--font-size-3xs: 10px;
			--font-size-2xs: 12px;
			--font-size-xs: 14px;
			--font-size-s: 16px;
			--font-size-m: 18px;
			--font-size-l: 20px;
			--font-size-xl: 24px;
			--font-size-2xl: 28px;
			--font-size-3xl: 32px;
			--font-size-4xl: 34px;

			--font-size-title: 65px;

			--font-size-desktop: var(--font-size-s);
			--font-size-mobile: var(--font-size-s);
			/* --font-size-xxxl: 32px */

			/* 폰트 두께 */
			--font-light: 400;
			--font-normal: 600;
			--font-light-bold: 700;
			--font-bold: 800;

			/* 미디어 쿼리용 너비 픽셀 */
			--pc-width: 1052px;
			--tablet-width: 768px;
			--mobile-width: 460px;
			}

			/* 폰트 */
			@font-face {
				font-family: "YouandiNewHR";
				font-style: normal;
				font-weight: normal;
				font-display: swap;
				src: url(/card/font/YouandiNewKrTitle-Regular.ttf);
				src: url(/card/font/YouandiNewKrTitle-Regular.eot?#iefix) format("embedded-opentype");
				src: url(/card/font/YouandiNewKrTitle-Regular.woff) format("woff");
			}
			@font-face {
				font-family: "YouandiNewHR";
				font-style: normal;
				font-weight: bold;
				font-display: swap;
				src: url(/card/font/YouandiNewKrTitle-Bold.ttf);
			}

			* {
				text-decoration: none;
				list-style: none;
				margin: 0;
				padding: 0;
				font-family: var(--font-family) !important;
				letter-spacing: -0.8px;
			}
			body {
				position: relative;
				font-family: var(--font-family);
				background-color: var(--background-color);
				color: var(--black-color);
				overflow-x: hidden;
			}
			html {
				background-color: transparent !important;
				overflow-x: hidden;
				scroll-behavior: smooth !important;
			}

			a {
				text-decoration: none;
				cursor: pointer;
			}

			p {
				margin: 0;
				padding: 0;
			}

			.breadcrumbs {
				display: flex;
				flex-direction: row;
				/* width: 200px; */
				/* justify-content: space-between; */
				align-items: center;
				font-size: 10px;
			}

			.breadcrumbs .breadcrumbs-item {
				color: var(--black-color);
				font-size: var(--font-size-m);
				font-style: normal;
				font-weight: var(--font-light);
				line-height: 20px;
				/* 125% */
				padding-top: 80px;
			}

			.mobilelink {
				pointer-events: none;
			}

			.menu {
				border-radius: 12px;
				border: 1px solid #e0e0e0;
				background: #fff;
				width: 76px;
				flex-shrink: 0;
			}

			.primary_nav_wrap ul ul li.menu-border:after {
				content: "";
				display: block;
				width: 100%; /* 80% 너비 */
				margin: 0 auto; /* 가운데 정렬 */
				border-bottom: 1px solid #e0e0e0;
			}
			.green {
				color: #0b8300;
			}
			.text {
				color: var(--black-color);
				line-height: 28px;
			}

			.text-bold {
				font-weight: var(--font-bold);
			}

			.red {
				color: var(--red-color);
			}

			.text-size-xsmall {
				font-size: var(--font-size-xs);
			}

			.text-size-small {
				font-size: var(--font-size-s);
			}

			.text-size-medium {
				font-size: var(--font-size-m);
			}

			.text-size-large {
				font-size: var(--font-size-l);
			}

			.text-size-xlarge {
				font-size: var(--font-size-xl);
			}

			.text-size-2xlarge {
				font-size: var(--font-size-2xl);
			}

			.text-size-3xlarge {
				font-size: var(--font-size-3xl);
			}

			.text-size-4xlarge {
				font-size: var(--font-size-4xl);
			}

			.text-center {
				text-align: center;
			}

			.margin-bottom-20 {
				margin-bottom: 20px !important;
			}

			.margin-bottom-24 {
				margin-bottom: 24px !important;
			}

			.margin-right-36 {
				margin-right: 36px !important;
			}

			.hidden {
				display: none !important;
			}

			.divider {
				border: 1px solid var(--deep-black-color);
				width: 100%;
				margin: 4px 0;
			}

			.divider ~ .dot {
				border-style: dashed;
			}

			footer {
				border-top: 1px solid var(--gray-color);
				padding-top: 15px;
				padding-left: 15px;
				margin-bottom: 15px;
			}
			footer ul {
				width: 1440px;
				margin: 0 auto 77px auto;
			}
			footer .footer-list .footer-list-item {
				font-size: var(--font-size-xs);
				margin-bottom: 4px;
				color: #5c5c5c;
				line-height: 18px;
			}

			@media screen and (max-width: 460px) {
				.breadcrumbs {
					/* max-width: 150px; */
				}
				.divider {
					margin: 2px 0 !important;
				}
				footer .footer-list {
					width: 100%;
				}
				footer .footer-list .footer-list-item {
					font-size: var(--font-size-2xs);
				}
			}
			/* e : global.css */
			/* s : navbar.css */
			.stickynav {
				display: flex;
				top: 0;
				background: var(--white-color);
				z-index: 999;
				box-shadow: 0px 2px 4px 0px #00000014;
				position: fixed;
				width: 100%;
				height: 70px;
				padding-left: 40px;
			}

			.stickynav-box {
				padding-top: 70px;
			}

			.logo {
				width: auto;
				height: 100%;
				display: flex;
				align-items: center;
			}
			.logo img {
				width: 112px;
				height: 22px;
			}
			.primary_nav_wrap {
				width: 1440px;
				margin: 0 auto;
				display: flex;
				align-items: center;
			}

			.primary_nav_wrap ul {
				padding-left: 40px;
			}

			.primary_nav_wrap ul a {
				display: inline-flex; /* 인라인 플렉스 컨테이너로 설정 */
				align-items: center; /* 수직 정렬 */
				padding: 10px 15px;
				color: var(--black-color);
				font-size: var(--font-size-l);
				font-style: normal;
				font-weight: var(--font-bold);
				text-decoration: none; /* 필요에 따라 추가 */
				/* 125% */
			}

			.primary_nav_wrap ul a img {
				margin-left: 5px; /* 텍스트와 이미지 사이의 간격 조절 */
				vertical-align: middle; /* 이미지의 수직 정렬 */
				width: auto;
			}

			.primary_nav_wrap > ul > li {
				position: relative;
				float: left;
				margin: 0 8px;
				padding: 0;
			}

			.primary_nav_wrap ul li.current-menu-item {
				background: var(--gainsboro-color);
			}

			.primary_nav_wrap ul ul {
				display: none;
				position: absolute;
				top: 100%;
				left: 0;
				background: var(--white-color);
				padding: 0;
				min-width: 100%;
				white-space: nowrap;
				width: auto;
			}

			.primary_nav_wrap ul ul li {
				float: none;
			}

			.primary_nav_wrap ul ul li:after {
				content: "";
				display: block;
				width: 50px;
				margin: auto;
			}
			/* 추가 항목 스타일 */

			.additional-toggle {
				line-height: 120%;
				padding: 10px 16px;
				font-size: var(--font-size-m);
				font-style: normal;
				font-weight: var(--font-light);
				text-align: left;
				display: flex;
				align-items: center;
				justify-content: space-between;
				border-bottom: 1px solid #e0e0e0;
			}
			.additional-items {
				border-bottom: 1px solid #e0e0e0;
				max-height: 0;
				overflow: hidden;
				transition: max-height 0.5s ease-out;
				background-color: #f0f0f0;
			}

			#toggle-items:checked ~ .additional-items {
				display: block;
				background-color: #f0f0f0;
				max-height: 100px;
			}

			.additional-toggle-icon {
				background-image: url("/card/event-magazine_img/arrow.png");
				background-size: contain;
				background-repeat: no-repeat;
				width: 11px;
				height: 7px;
			}

			#toggle-items:checked + .additional-toggle .additional-toggle-icon {
				background-image: url("/card/event-magazine_img/nav_arrow_up.png");
			}

			.primary_nav_wrap ul ul a {
				line-height: 120%;
				padding: 10px 16px;
				font-size: var(--font-size-m);
				font-style: normal;
				font-weight: var(--font-light);
				text-align: left;
			}

			.primary_nav_wrap ul ul ul {
				top: 0;
				left: 100%;
			}

			.primary_nav_wrap ul li:hover > ul {
				display: block;
			}

			.secondary_nav_wrap {
				display: none;
			}

			.secondary_nav_wrap #hamburger-button {
				display: none;
			}
			.secondary_nav_wrap .navbar-button {
				display: flex;
				justify-content: center;
				align-items: center;
			}

			.category-additional-items {
				max-height: 0;
				overflow: hidden;
				transition: max-height 0.5s ease-out;
				margin-top: 11px;
			}

			#category-toggle-items:checked ~ .category-additional-items {
				display: block;
				background-color: #f0f0f0;
				max-height: 100px;
			}

			.category-additional-toggle {
				color: var(--black-color);
				font-size: var(--font-size-l);
			}
			.category-additional-item {
				border-bottom: 1px solid #e0e0e0;
				color: var(--black-color);
				font-size: var(--font-size-l);
				padding-bottom: 10px;
				padding-top: 10px;
				padding-left: 10px;
			}
			.category-additional-item a {
				color: var(--black-color);
				font-size: var(--font-size-l);
			}

			.navbar-close {
				width: 20px;
				height: 14px;
				background-image: url("/card/event-magazine_img/nav_hamburgur.png");
				background-size: contain;
				background-repeat: no-repeat;
			}

			.navbar-hamburger-input:checked + .navbar-label .navbar-close {
				background-image: url("/card/event-magazine_img/nav_close.png");
			}

			.popup-menu {
				position: absolute;
				top: 38px;
				left: 0;
				width: 100%;
				max-height: 1px;
				transition: max-height 0.5s ease-out;
				z-index: 99;
				overflow: hidden;
			}

			.category-list {
				display: none;
				padding-left: 50px;
			}

			.navbar-hamburger-input:checked ~ .popup-menu {
				left: 0;
				height: 100vh;
				max-height: 100vh;
				transition: max-height 0.5s ease-in;
				background-color: var(--white-color);
				overflow-y: auto;
			}

			.navbar-hamburger-input:checked ~ .popup-menu .category-list {
				display: block;
				max-height: 100vh;
				transition: max-height 0.5s ease-in;
				margin-bottom: 300px;
			}

			.category {
				width: 90%;
				position: relative;
			}

			.line-container {
				display: flex;
				justify-content: space-between;
				align-items: center;
			}

			.category-line {
				flex-grow: 1;
				border: none;
				border-top: 1px solid black; /* 선을 추가 */
				margin-right: 10px; /* 기호와 선 사이의 간격 */
			}

			.category-toggle-icon {
				background-image: url("/card/event-magazine_img/plus_toggle.png");
				background-size: contain;
				background-repeat: no-repeat;
				width: 12px;
				height: 12px;
			}
			.category-toggle-input {
				display: none;
			}
			.category-detail {
				display: none;
			}

			.category-toggle-input:checked ~ .category-detail {
				left: 0;
				padding-top: 0px;
				max-height: 250px;
				transition: max-height 0.3s ease-in;
			}

			.category-toggle-input:checked + .category-toggle-label .category-toggle-icon {
				background-image: url("/card/event-magazine_img/minus_toggle.png");
				background-size: contain;
				background-repeat: no-repeat;
			}

			.summary-content {
				padding: 15px 0px;
			}

			.secondary_nav_wrap ul .category-title {
				font-size: var(--font-size-l);
				font-weight: var(--font-bold);
				margin-bottom: 14px;
			}

			.secondary_nav_wrap ul .category-description {
				font-size: var(--font-size-xs);
				color: #5c5c5c;
			}
			.secondary_nav_wrap ul .category-detail {
				display: block;
				max-height: 0px;
				overflow: hidden;
				padding-top: 20px;
				transition: max-height 0.3s ease-out, padding-top 0.3s ease-out;
			}
			.secondary_nav_wrap ul .category-detail li {
				margin-bottom: 11px;
				margin-top: 10px;
			}

			.secondary_nav_wrap ul .category-detail li a {
				color: var(--black-color);
				font-size: var(--font-size-l);
			}

			@media screen and (max-width: 510px) {
				.logo {
					width: 100%;
					height: 100%;
					display: flex;
					padding-right: 20px;
				}
				.logo img {
					width: 75px;
					height: 100%;
				}
				.stickynav {
					height: 38px;
					padding-left: 0;
				}
				.stickynav-box {
					padding-top: 38px;
				}
				.primary_nav_wrap {
					display: none;
				}
				.secondary_nav_wrap {
					display: flex;
					width: 100%;
					padding: 10px 20px;
				}

				.logo {
					width: 100%;
					display: flex;
					justify-content: center;
				}
			}
			
			.menu .menu-border a b,
			.category-detail li a b {
				font-weight: 400;
				padding-right: 5px;
			}

			.category-detail li a b {
				padding-right: 0;
			}

			.menu .menu-border a br,
			.category-detail li a br {
				display: none;
			}

			/* e : navbar.css */