@charset "UTF-8";

/* ==========================================================================
   Wisebox Exhibition Stylesheet
   --------------------------------------------------------------------------
   1. Fonts / Base / Layout
   2. Hero / Content Sections
   3. Product Carousel (.wb-pc) — reusable
   4. Banner Slider (.wb-banner) — reusable
   5. Tab Menu & Product List (content_04)
   6. Exhibition Banner / Guide
   7. Exhibition 02 (page-specific)
   8. Responsive (tablet / mobile)
   ========================================================================== */

/* ==========================================================================
   Fonts
   ========================================================================== */

@font-face {
	font-family: 'Cafe24Surround';
	src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2105_2@1.0/Cafe24Ssurround.woff') format('woff');
	font-weight: normal;
	font-display: swap;
}

@font-face {
	font-family: 'Cafe24SurroundAir';
	src: url('https://gcore.jsdelivr.net/gh/projectnoonnu/noonfonts_2105_2@1.0/Cafe24SsurroundAir.woff') format('woff');
	font-weight: normal;
	font-display: swap;
}

@font-face {
	font-family: 'NanumSquareRound';
	src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_two@1.0/NanumSquareRound.woff') format('woff');
	font-weight: normal;
	font-display: swap;
}

@font-face {
	font-family: 'PartialSans';
	src: url('https://cdn.jsdelivr.net/gh/projectnoonnu/noonfonts_2307-1@1.1/PartialSansKR-Regular.woff2') format('woff2');
	font-weight: normal;
	font-display: swap;
}

/* ==========================================================================
   Base
   ========================================================================== */

html,
body {
	margin: 0;
	padding: 0;
	height: 100%;
	background: transparent;
}

/* ==========================================================================
   Layout - 2026년 06월 기획전 1
   ========================================================================== */

#Exhibition_body {
	overflow-x: hidden;
	width: 100%;
}

#Exhibition_body > div {
	display: flex;
	justify-content: center;
}

.content_inner {
	width: 100%;
	max-width: 1080px;
}

/* ==========================================================================
   Hero Section
   ========================================================================== */

#hero_section {
	position: relative;
	overflow: hidden;
	width: 100%;
	height: 1250px;
	display: flex;
	align-items: center;
	justify-content: center;
	background: #EDFEFE;
}

#hero_section .content_inner {
	position: relative;
	z-index: 3;
	display: flex;
	flex-direction: column;
	align-items: center;
	padding-bottom: 100px;
}

.hero-video {
	position: absolute;
	top: 50%;
	left: 50%;
	min-width: 100%;
	min-height: 100%;
	width: auto;
	height: auto;
	object-fit: cover;
	transform: translate(-50%, -50%) scale(1.06);
	-webkit-transform: translate(-50%, -50%) scale(1.06);
	z-index: 0;
	display: block;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}

.hero-video--desktop {
	display: block;
}

.hero-video--mobile {
	display: none;
}

.cover-gradient {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: linear-gradient(180deg, rgba(255, 255, 255, 0.00) 95.96%, #EDFEFE 98.39%);
	z-index: 2;
	pointer-events: none;
}

.hero_title {
	max-width: 500px;
	width: 80%;
}

.hero_description {
	font-family: 'Cafe24SurroundAir';
	font-weight: 300;
	font-size: 20px;
	color: #FEFEFE;
	text-align: center;
	line-height: 170%;
	letter-spacing: -0.02em;
	margin: 25px auto;
}

.hero_date {
	font-family: 'Cafe24Surround';
	font-weight: 700;
	font-size: 32px;
	color: #fff;
	letter-spacing: 0.02em;
	margin-bottom: 55px;
}

.hero_mini_banner {
	padding: 24px 52px;
	border: 1px solid rgba(255, 255, 255, 0.8);
	border-radius: 16px;
	background: rgba(255, 255, 255, 0.02);
	backdrop-filter: blur(4px);
	-webkit-backdrop-filter: blur(4px);
	text-align: center;
}

.hero_mini_banner .sub {
	font-family: "Noto Sans KR", sans-serif;
	font-size: 20px;
	color: #E9F2F9;
	font-weight: 600;
	letter-spacing: -0.02em;
}

.hero_mini_banner .main {
	font-family: "Noto Sans KR", sans-serif;
	font-size: 28px;
	color: #D9FF00;
	font-weight: 800;
	letter-spacing: -0.02em;
}

/* ==========================================================================
   Content Sections
   ========================================================================== */

.exhibition_content {
	overflow-x: hidden;
	max-width: 100%;
}

.exhibition_content.content_01 {
	background:
		url('../../resources/images/event/landingPage/wisebox/June_Exhibition_01/JUN_Fist_02_bg.png') no-repeat center/cover,
		linear-gradient(180deg, #EDFEFE 0%, #DFFFFF 100%);
	padding: 110px 0;
}

.exhibition_content.content_02 {
	background:
		url('../../resources/images/event/landingPage/wisebox/June_Exhibition_01/JUN_Fist_03_bg.png') no-repeat center/cover,
		linear-gradient(180deg, #FFF8EF 0%, #FFF4E6 100%);
	padding: 110px 0;
}

.exhibition_content.content_03 {
	background:
		url('../../resources/images/event/landingPage/wisebox/June_Exhibition_01/JUN_Fist_04_bg.png') no-repeat center/cover,
		linear-gradient(180deg, #F7FFF5 0%, #EEFFF4 100%);
	padding: 110px 0;
}

.exhibition_content.content_04 {
	background: linear-gradient(169.24deg, #FAFDFF 0.96%, #F8FBFD 95.89%);
	padding: 60px 0 90px;
}

/* ==========================================================================
   Product Carousel (.wb-pc) — reusable
   ========================================================================== */

.wb-pc {
	width: 100%;
	max-width: 100%;
	font-family: var(--font-sans, 'pretendard', sans-serif);
	overflow-x: hidden;
	border-radius: var(--border-radius-lg, 12px);
	--carousel-card-w: 360px;
	--carousel-card-h: 360px;
	--carousel-reflect-h: 95px;
	--carousel-track-h: 455px;
	--carousel-spacing: 360px;
	--carousel-info-margin-top: 20px;
}

/* Theme variables */
.wb-pc--blue {
	--reflect-overlay-start: rgba(237, 254, 254, 0);
	--reflect-overlay-mid: rgba(237, 254, 254, 0.55);
	--reflect-overlay-late: rgba(223, 255, 255, 0.88);
	--reflect-overlay-end: #DFFFFF;
	--track-edge-fade: #E5FEFE;
}

.wb-pc--peach {
	--reflect-overlay-start: rgba(255, 248, 239, 0);
	--reflect-overlay-mid: rgba(255, 248, 239, 0.55);
	--reflect-overlay-late: rgba(255, 244, 230, 0.88);
	--reflect-overlay-end: #FFF4E6;
	--track-edge-fade: #FFF6EA;
}

.wb-pc--green {
	--reflect-overlay-start: rgba(247, 255, 245, 0);
	--reflect-overlay-mid: rgba(247, 255, 245, 0.55);
	--reflect-overlay-late: rgba(238, 255, 244, 0.88);
	--reflect-overlay-end: #EEFFF4;
	--track-edge-fade: #F1FFF5;
}

/* Title */
.wb-pc__title {
	text-align: center;
}

.wb-pc__title .small_title {
	margin: 0 0 4px;
	font-size: 26px;
	font-weight: 500;
	color: #333;
	letter-spacing: -0.02em;
	font-family: "Noto Sans KR", sans-serif;
}

.wb-pc__title .main_title {
	margin: 0;
	font-size: 64px;
	font-weight: 700;
	color: #111;
	font-family: 'Cafe24Surround';
	letter-spacing: -0.01em;
}

/* Slider nav buttons (shared: .wb-pc / .wb-banner) */
.wb-pc__slider,
.wb-banner {
	position: relative;
	--slider-btn-outset: 24px;
}

.exhibition_content:has(.wb-pc__slider),
.exhibition_content:has(.wb-banner) {
	overflow-x: visible;
}

.wb-slider__btn,
.wb-pc__btn,
.wb-banner__btn {
	position: absolute;
	top: 50%;
	z-index: 20;
	display: flex;
	align-items: center;
	justify-content: center;
	width: 48px;
	height: 48px;
	margin: 0;
	padding: 0;
	border: 0;
	border-radius: 50%;
	background: #fff;
	border: 0.8px solid #E5DDD3;
	cursor: pointer;
	transform: translateY(-50%);
	box-shadow: 0px 0px 12.8px 0px rgba(0, 0, 0, 0.1);
	box-sizing: border-box;
}

.wb-banner__btn {
	z-index: 5;
}

.wb-slider__btn img,
.wb-pc__btn img,
.wb-banner__btn img {
	display: block;
}

.wb-pc__prev,
.wb-banner__prev {
	left: calc(var(--slider-btn-outset) * -1);
}

.wb-pc__next,
.wb-banner__next {
	right: calc(var(--slider-btn-outset) * -1);
}

.wb-pc.is-single .wb-pc__btn,
.wb-banner.is-single .wb-banner__btn {
	display: none;
}

.wb-pc:has(.wb-pc__slider) {
	overflow-x: visible;
}

/* Track & edge fade */
.wb-pc__track {
	position: relative;
	width: 100%;
	height: var(--carousel-track-h, 360px);
	overflow: hidden;
}

.wb-pc__track::before,
.wb-pc__track::after {
	content: '';
	position: absolute;
	top: 0;
	bottom: 0;
	width: 100px;
	z-index: 15;
	pointer-events: none;
}

.wb-pc__track::before {
	left: 0;
	right: auto;
	background: linear-gradient(
		to right,
		var(--track-edge-fade, #fff) 0%,
		transparent 100%
	);
}

.wb-pc__track::after {
	right: 0;
	left: auto;
	background: linear-gradient(
		to left,
		var(--track-edge-fade, #fff) 0%,
		transparent 100%
	);
}

/* Card */
.wb-pc__card {
	position: absolute;
	top: 0;
	left: 0;
	width: var(--carousel-card-w, 360px);
	will-change: transform, opacity;
	transform: translateZ(0);
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}

.wb-pc__main {
	width: var(--carousel-card-w, 360px);
	height: var(--carousel-card-h, 360px);
	border-radius: 16px 16px 0 0;
	overflow: visible;
	position: relative;
	background: transparent;
	transform: translateZ(0);
	transform-origin: top left;
}

.wb-pc__main.is-clickable,
.wb-pc__main.is-activatable {
	cursor: pointer;
}

.wb-pc__main img {
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: center bottom;
	pointer-events: none;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}

.wb-pc__ph {
	width: 100%;
	height: 100%;
	display: none;
	align-items: center;
	justify-content: center;
	font-size: 13px;
	font-weight: 600;
	text-align: center;
	padding: 12px;
	box-sizing: border-box;
	line-height: 1.5;
	white-space: pre-line;
	position: absolute;
	inset: 0;
}

/* Reflect */
.wb-pc__reflect {
	width: var(--carousel-card-w, 360px);
	height: var(--carousel-reflect-h, 90px);
	overflow: hidden;
	position: relative;
	line-height: 0;
	transform-origin: top left;
}

.wb-pc__reflect-img {
	position: absolute;
	left: 0;
	bottom: 100%;
	display: block;
	object-fit: contain;
	object-position: center bottom;
	pointer-events: none;
	opacity: 0.2;
	transform: scaleY(-1);
	-webkit-transform: scaleY(-1);
	transform-origin: center bottom;
	-webkit-transform-origin: center bottom;
}

.wb-pc__ph--reflect {
	position: absolute;
	left: 0;
	bottom: 100%;
	width: 100%;
	margin: 0;
	transform: scaleY(-1);
	-webkit-transform: scaleY(-1);
	transform-origin: center bottom;
	-webkit-transform-origin: center bottom;
}

.wb-pc__fade {
	position: absolute;
	inset: 0;
	z-index: 2;
	pointer-events: none;
	background: linear-gradient(
		to bottom,
		var(--reflect-overlay-start) 0%,
		var(--reflect-overlay-start) 10%,
		var(--reflect-overlay-mid) 32%,
		var(--reflect-overlay-late) 62%,
		var(--reflect-overlay-end) 85%,
		var(--reflect-overlay-end) 100%
	);
}

.wb-pc--blue .wb-pc__fade {
	background: linear-gradient(
		to bottom,
		rgba(237, 254, 254, 0) 0%,
		rgba(237, 254, 254, 0) 10%,
		rgba(237, 254, 254, 0.55) 32%,
		rgba(223, 255, 255, 0.88) 62%,
		#DFFFFF 85%,
		#DFFFFF 100%
	);
}

.wb-pc--peach .wb-pc__fade {
	background: linear-gradient(
		to bottom,
		rgba(255, 248, 239, 0) 0%,
		rgba(255, 248, 239, 0) 10%,
		rgba(255, 248, 239, 0.55) 32%,
		rgba(255, 244, 230, 0.88) 62%,
		#FFF4E6 85%,
		#FFF4E6 100%
	);
}

.wb-pc--green .wb-pc__fade {
	background: linear-gradient(
		to bottom,
		rgba(247, 255, 245, 0) 0%,
		rgba(247, 255, 245, 0) 10%,
		rgba(247, 255, 245, 0.55) 32%,
		rgba(238, 255, 244, 0.88) 62%,
		#EEFFF4 85%,
		#EEFFF4 100%
	);
}

/* Info & price */
.wb-pc__info {
	text-align: center;
	min-height: 56px;
}

.wb-pc__name {
	font-size: 38px;
	font-weight: 700;
	color: #333;
	margin-bottom: 6px;
	letter-spacing: -0.02em;
	font-family: "Noto Sans KR";
	transition: opacity 0.25s ease;
}

.wb-pc__price {
	color: #333;
	font-size: 26px;
	font-weight: 500;
	transition: opacity 0.25s ease;
}

.wb-pc__discount {
	font-family: "Noto Sans KR";
	color: #2B398F;
	font-weight: 700;
	font-size: 24px;
	letter-spacing: -0.02em;
	margin-right: 4px;
}

.wb-pc__old-price {
	font-family: "Noto Sans KR";
	font-weight: 400;
	color: #666;
	text-decoration: line-through;
	font-size: 24px;
	margin-left: 6px;
}

/* Dots */
.wb-pc__dots {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 6px;
	margin-top: 48px;
}

.wb-pc__dot {
	border: none;
	padding: 0;
	cursor: pointer;
	background: #D2D2D2;
	width: 12px;
	height: 6px;
	transition: width 0.35s ease, border-radius 0.35s ease, background 0.35s ease;
	flex-shrink: 0;
	border-radius: 4px;
}

.wb-pc__dot.is-active {
	background: #3a3a3a;
	width: 32px;
	border-radius: 4px;
}

/* ==========================================================================
   Banner Slider (.wb-banner) — reusable
   ========================================================================== */

.wb-banner {
	overflow: visible;
}

.wb-banner__view {
	position: relative;
	overflow: hidden;
}

.wb-banner__track {
	display: flex;
	margin: 0;
	padding: 0;
	list-style: none;
	transition: transform 0.45s ease;
	will-change: transform;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}

.wb-banner__track > li {
	flex: 0 0 100%;
	width: 100%;
	min-width: 100%;
	box-sizing: border-box;
}

.wb-banner__track > li.wb-banner__clone {
	pointer-events: none;
	user-select: none;
}

/* ==========================================================================
   Tab Menu & Product List (content_04)
   ========================================================================== */

.exhibition_content.content_04 .tab_menu {
	position: relative;
	font-family: "Noto Sans KR";
	font-weight: 600;
	color: #999;
	margin-bottom: 72px;
}

.exhibition_content.content_04 .tab_menu ul {
	display: flex;
	align-items: center;
	gap: 32px;
}

.exhibition_content.content_04 .tab_menu ul li a {
	display: block;
	padding-bottom: 16px;
	font-size: 24px;
	line-height: 140%;
	letter-spacing: -0.02em;
	transition: color 0.25s ease;
}

.exhibition_content.content_04 .tab_menu ul li a:focus {
	outline: none;
}

.exhibition_content.content_04 .tab_menu ul li.on a {
	color: #111;
}

.exhibition_content.content_04 .tab_menu .tab_indicator {
	position: absolute;
	bottom: 0;
	left: 0;
	height: 4px;
	background: #111;
	border-radius: 2px;
	width: 0;
	transform: translateX(0);
	transition: transform 0.35s ease, width 0.35s ease;
	pointer-events: none;
}

.exhibition_content.content_04 .tab_menu:not(.is-ready) .tab_indicator {
	transition: none;
}

.exhibition_content.content_04 .tab_panels {
	position: relative;
	overflow: hidden;
}

.exhibition_content.content_04 .tab_content {
	display: block;
	opacity: 0;
	visibility: hidden;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	overflow: hidden;
	pointer-events: none;
	transition: opacity 0.35s ease, visibility 0.35s ease;
}

.exhibition_content.content_04 .tab_content.is-active {
	opacity: 1;
	visibility: visible;
	position: relative;
	pointer-events: auto;
	z-index: 1;
}

.exhibition_content.content_04 .tab_panels:not(.is-ready) .tab_content {
	transition: none;
}

@media (prefers-reduced-motion: reduce) {
	.exhibition_content.content_04 .tab_menu ul li a,
	.exhibition_content.content_04 .tab_menu .tab_indicator,
	.exhibition_content.content_04 .tab_content {
		transition: none;
	}
}

.tab_content .tab_list_title {
	font-family: 'Cafe24Surround';
	font-size: 40px;
	font-weight: 700;
	color: #111;
	margin-bottom: 24px;
}

.tab_content .tab_list_title .count_num {
	font-family: "Noto Sans KR";
	font-weight: 400;
	font-size: 24px;
	letter-spacing: -0.01em;
	color: #333;
}

.tab_list {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	column-gap: 20px;
	row-gap: 60px;
	list-style: none;
	padding: 0;
	margin: 0;
}

.tab_list li a:focus {
	outline: none;
}

.tab_list .img_box {
	position: relative;
	border: 1px solid #ddd;
	border-radius: 8px;
	overflow: hidden;
	margin-bottom: 20px;
}

.tab_list .img_box .level_info {
	position: absolute;
	top: 12px;
	left: 12px;
	width: 60px;
	height: 30px;
	background-color: #0DB4C0;
	border-radius: 14px;
	color: #fff;
	font-family: "Noto Sans KR";
	font-size: 15px;
	font-weight: 500;
	letter-spacing: -0.02em;
	text-align: center;
	line-height: 30px;
}

.product_info .p_name {
	font-family: "Noto Sans KR";
	font-size: 18px;
	font-weight: 700;
	color: #111;
	line-height: 140%;
	letter-spacing: -0.02em;
	margin-bottom: 8px;
}

.product_info .p_price {
	display: flex;
	gap: 6px;
	font-family: "Noto Sans KR";
	margin-bottom: 16px;
}

.product_info .p_price .drate {
	font-size: 16px;
	font-weight: 700;
	color: #2B398F;
	line-height: 140%;
	letter-spacing: -0.02em;
}

.product_info .p_price .dprice {
	font-size: 16px;
	font-weight: 500;
	line-height: 140%;
	letter-spacing: -0.02em;
	color: #111;
}

.product_info .p_price .oprice {
	font-size: 16px;
	font-weight: 400;
	line-height: 140%;
	letter-spacing: -0.02em;
	color: #666;
	text-decoration: line-through;
}

.product_info .p_detail {
	font-family: "Noto Sans KR";
	font-size: 14px;
	font-weight: 500;
	line-height: 140%;
	letter-spacing: -0.02em;
}

.product_info .p_detail > div {
	display: flex;
	gap: 8px;
}

.product_info .p_detail > div + div {
	margin-top: 8px;
}

.product_info .p_detail .dtitle {
	color: #999;
}

.product_info .p_detail .dcont {
	color: #777;
}

/* ==========================================================================
   Exhibition Banner
   ========================================================================== */

.exhibition_banner {
	background: #F8FBFD;
	padding: 40px 0 130px;
}

.exhibition_banner .event_title {
	font-family: 'Cafe24Surround';
	font-size: 40px;
	font-weight: 700;
	color: #111;
	letter-spacing: -0.02em;
	margin-bottom: 23px;
}

.exhibition_banner .event_banner a:focus {
	outline: none;
}

/* ==========================================================================
   Exhibition Guide
   ========================================================================== */

.exhibition_guide {
	background-color: #243C4C;
}

.exhibition_guide .content_inner {
	padding: 50px 50px 70px 50px;
}

.exhibition_guide .exhibition_guide_title {
	color: #D6DFE6;
	font-family: 'pretendard', sans-serif;
	font-size: 24px;
	font-weight: 700;
	margin-bottom: 16px;
	display: flex;
	align-items: center;
	gap: 8px;
}

.exhibition_guide .exhibition_guide_list {
	color: #D6DFE6;
	list-style: disc;
	font-family: 'pretendard', sans-serif;
	font-size: 20px;
	font-weight: 400;
	padding-left: 20px;
	word-break: keep-all;
}

/* ==========================================================================
   Exhibition 02 — Page-specific
   ========================================================================== */

/* --- Exhibition 02: Base & Hero --- */

#wrap.Exhibition_02 {
	font-family: 'pretendard', sans-serif;
}

#wrap.Exhibition_02 #hero_section {
	flex-direction: column;
}

.exhibition_02 .hero_title {
	max-width: 836px;
}

.exhibition_02 .hero_date {
	font-family: "Montserrat";
	font-size: 40px;
	font-weight: 700;
	letter-spacing: 0.02em;
	color: #0E0E0E;
	margin: 32px auto 48px;
}

.exhibition_02 .hero_description {
	font-family: 'NanumSquareRound';
	font-size: 34px;
	font-weight: 700;
	color: #2E2E2E;
	letter-spacing: -4%;
	margin: 0;
}

.exhibition_02 .hero_mini_banner {
	background-color: #181B1C;
	padding: 40px;
}

.exhibition_02 .hero_mini_banner .sub {
	font-family: 'NanumSquareRound';
	font-weight: 800;
	font-size: 32px;
	letter-spacing: -0.02em;
	line-height: 110%;
	margin-bottom: 4px;
}

.exhibition_02 .hero_mini_banner .main {
	font-family: 'PartialSans';
	font-weight: 400;
	font-size: 48px;
	line-height: 120%;
	letter-spacing: 4%;
	background: linear-gradient(91.32deg, #EDB12F -8.67%, #FFD643 25.88%);
	-webkit-background-clip: text;
	-webkit-text-fill-color: transparent;
}

#wrap.Exhibition_02 .exhibition_content.content_01 {
	background-image: none;
	background-color: #ECF6F7;
}

#wrap.Exhibition_02 .exhibition_content.content_02 {
	background-image: none;
	background-color: #FFFBF7;
	padding: 110px 0;
}

#wrap.Exhibition_02 .exhibition_content.content_03 {
	background-image: none;
	background-color: #F7FFF2;
	padding: 110px 0;
}

#wrap.Exhibition_02 .exhibition_content.content_04 {
	background-image: none;
	background: linear-gradient(169.24deg, #FAFDFF 0.96%, #F8FBFD 95.89%);
	padding: 60px 0 90px;
}

#wrap.Exhibition_02 .hero_bottom {
	z-index: 3;
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 90px;
	object-fit: cover;
}
#wrap.Exhibition_02 .slider_title {
	margin-bottom: 70px;
}

/* --- Exhibition 02: Slider card (banner slide content) --- */

#wrap.Exhibition_02 .slider_wrap .slider li {
	border-radius: 24px;
	box-shadow: 0px 0px 16px 0px rgba(226, 236, 237, 0.5);
	display: flex;
	overflow: hidden;
	height: 620px;
}

#wrap.Exhibition_02 .slider_wrap .slider li > div {
	width: 50%;
}

#wrap.Exhibition_02 .slider_wrap .slider li .img_box {
	display: flex;
	justify-content: center;
	align-items: center;
}

#wrap.Exhibition_02 .slider_wrap .slider li .img_box.blue {
	background-color: #D8ECEE;
}

#wrap.Exhibition_02 .slider_wrap .slider li .img_box.pink {
	background-color: #FAEBE4;
}

#wrap.Exhibition_02 .slider_wrap .slider li .img_box.green {
	background-color: #ECF7E6;
}

#wrap.Exhibition_02 .slider_wrap .slider li .info_box {
	background-color: #fff;
	padding: 0 50px;
	box-sizing: border-box;
	display: flex;
	align-items: center;
}

#wrap.Exhibition_02 .slider_wrap .slider li .info_box .banner_counter {
	display: inline-flex;
	justify-content: center;
	align-items: center;
	font-family: "Montserrat";
	font-size: 15px;
	font-weight: 500;
	border: 1px solid #000;
	border-radius: 100px;
	height: 30px;
	min-width: 53px;
	box-sizing: border-box;
	gap: 6px;
	margin-bottom: 18px;
	color: #6E6E6E;
}

#wrap.Exhibition_02 .slider_wrap .slider li .info_box .banner_counter .current_num {
	color: #1E1E1E;
}

#wrap.Exhibition_02 .slider_wrap .slider li .info_box .p_name {
	font-size: 36px;
	font-weight: 700;
	line-height: 140%;
	letter-spacing: -0.02em;
	color: #111;
	margin-bottom: 16px;
}

#wrap.Exhibition_02 .slider_wrap .slider li .info_box .p_desc {
	font-size: 18px;
	font-weight: 400;
	line-height: 160%;
	letter-spacing: -0.02em;
	color: #6E6E6E;
	margin-bottom: 32px;
	word-break: keep-all;
}

#wrap.Exhibition_02 .slider_wrap .slider li .info_box .p_detail {
	border-top: 2px dashed #CECECE;
	border-bottom: 2px dashed #CECECE;
	padding: 16px 0;
	margin-bottom: 16px;
}

#wrap.Exhibition_02 .slider_wrap .slider li .info_box .p_detail > div {
	display: flex;
	gap: 16px;
}

#wrap.Exhibition_02 .slider_wrap .slider li .info_box .p_detail > div + div {
	margin-top: 4px;
}

#wrap.Exhibition_02 .slider_wrap .slider li .info_box .p_detail .s_title {
	font-size: 18px;
	font-weight: 500;
	line-height: 140%;
	letter-spacing: -0.02em;
	color: #999;
	min-width: 62px;
}

#wrap.Exhibition_02 .slider_wrap .slider li .info_box .p_detail .s_content {
	font-size: 18px;
	font-weight: 500;
	line-height: 140%;
	letter-spacing: -0.02em;
	color: #3E3E3E;
}

#wrap.Exhibition_02 .slider_wrap .slider li .info_box .p_price .o_price {
	font-size: 20px;
	font-weight: 400;
	line-height: 140%;
	letter-spacing: -0.02em;
	color: #9E9E9E;
	text-decoration: line-through;
}

#wrap.Exhibition_02 .slider_wrap .slider li .info_box .p_price .price {
	font-size: 30px;
	font-weight: 700;
	line-height: 140%;
	letter-spacing: -0.02em;
	color: #111;
	display: flex;
	gap: 8px;
}

#wrap.Exhibition_02 .slider_wrap .slider li .info_box .p_price .price .rate {
	color: #D42323;
}

#wrap.Exhibition_02 .slider_wrap .slider li .info_box .btn_detail_view {
	background-color: #000;
	border-radius: 8px;
	color: #fff;
	font-size: 16px;
	font-weight: 600;
	line-height: 140%;
	letter-spacing: -0.01em;
	padding: 11px 22px;
	margin-top: 48px;
}
/* ==========================================================================
   Responsive - Tablet (max-width: 1080px)
   ========================================================================== */

@media all and (max-width: 1080px) {
	.wb-pc__title {
		margin-bottom: 0;
	}

	.exhibition_content.content_04 .content_inner {
		width: calc(100% - 32px);
	}
}

/* ==========================================================================
   Responsive - Mobile (max-width: 680px)
   ========================================================================== */

@media all and (max-width: 680px) {
	/* Hero */
	#hero_section {
		height: 640px;
	}

	#bg-video {
		top: 65px;
	}

	.cover-gradient {
		background: linear-gradient(180deg, rgba(255, 255, 255, 0.00) 90.5%, #EDFEFE 99.88%);
	}

	.hero_title {
		max-width: 265px;
	}

	.hero_description {
		font-size: 13px;
		margin: 32px 0 16px;
	}

	.hero_date {
		font-size: 16px;
		margin-bottom: 32px;
	}

	.hero_mini_banner {
		padding: 10px 24px;
		backdrop-filter: blur(2px);
		-webkit-backdrop-filter: blur(2px);
	}

	.hero_mini_banner .sub {
		font-size: 12px;
	}

	.hero_mini_banner .main {
		font-size: 20px;
	}
	.hero-video--desktop {
		display: none;
	}

	.hero-video--mobile {
		display: block;
		width: 100%;
		top: 40%;
	}

	/* Content sections */
	.exhibition_content.content_01,
	.exhibition_content.content_02,
	.exhibition_content.content_03 {
		padding: 50px 0;
	}

	.exhibition_content.content_04 {
		padding: 24px 0;
	}

	/* Product Carousel */
	.wb-pc {
		--carousel-card-w: clamp(170px, 72vw, 360px);
		--carousel-card-h: var(--carousel-card-w);
		--carousel-reflect-h: calc(var(--carousel-card-w) * 0.264);
		--carousel-track-h: calc(var(--carousel-card-h) + var(--carousel-reflect-h));
		--carousel-spacing: calc(var(--carousel-card-w) * 0.72);
	}

	.wb-pc__title .small_title {
		font-size: 15px;
	}

	.wb-pc__title .main_title {
		font-size: 38px;
	}

	.wb-pc__name {
		font-size: 20px;
	}

	.wb-pc__price {
		font-size: 16px;
	}

	.wb-pc__discount,
	.wb-pc__price {
		font-size: 15px;
	}

	.wb-pc__old-price {
		font-size: 15px;
	}

	.wb-pc__track::before,
	.wb-pc__track::after {
		width: clamp(50px, 15vw, 100px);
	}

	.wb-pc__btn {
		display: flex;
		width: 32px;
		height: 32px;
		box-shadow: 0 0 8px rgba(0, 0, 0, 0.1);
	}

	.wb-pc__btn img {
		width: 12px;
		height: auto;
	}

	.wb-pc__prev {
		left: 4px;
	}

	.wb-pc__next {
		right: 4px;
	}

	/* Tab menu & list */
	.exhibition_content.content_04 .content_inner {
		width: calc(100% - 32px);
	}

	.exhibition_content.content_04 .tab_menu {
		margin-bottom: 32px;
	}

	.exhibition_content.content_04 .tab_menu ul {
		gap: 20px;
	}

	.exhibition_content.content_04 .tab_menu ul li a {
		font-size: 16px;
		padding-bottom: 6px;
	}

	.tab_content .tab_list_title {
		font-size: 22px;
	}

	.tab_content .tab_list_title .count_num {
		font-size: 14px;
	}

	.tab_list {
		grid-template-columns: repeat(2, 1fr);
		column-gap: 16px;
		row-gap: 32px;
	}

	.tab_list .img_box img {
		display: block;
		width: 100%;
	}

	.tab_list .img_box .level_info {
		width: 40px;
		height: 20px;
		line-height: 20px;
		font-size: 10px;
	}

	.product_info .p_name {
		font-size: 15px;
		margin-bottom: 2px;
	}

	.product_info .p_price {
		margin-bottom: 8px;
	}

	.product_info .p_price .drate,
	.product_info .p_price .dprice {
		font-size: 13px;
	}

	.product_info .p_price .oprice,
	.product_info .p_detail span {
		font-size: 11px !important;
	}

	.product_info .p_detail > div + div {
		margin-top: 2px;
	}

	/* Banner */
	.exhibition_banner {
		padding: 24px 0 50px;
	}

	.exhibition_banner .content_inner {
		width: calc(100% - 32px);
	}

	.exhibition_banner .event_title {
		font-size: 16px;
		margin-bottom: 16px;
	}

	/* Guide */
	.exhibition_guide .content_inner {
		padding: 32px 20px;
	}

	.exhibition_guide .exhibition_guide_title {
		font-size: 14px;
		gap: 4px;
	}

	.exhibition_guide .exhibition_guide_list {
		font-size: 14px;
	}

	.exhibition_guide_title svg {
		width: 18px;
		height: 18px;
	}

	.wb-pc__dots {
		margin-top: 24px;
	}

	/* Exhibition 02 */
	#wrap.Exhibition_02 .hero_bottom {
		height: 60px;
	}

	/* Banner slider */
	.wb-pc__slider,
	.wb-banner {
		--slider-btn-outset: 20px;
		width: calc(100% - 40px);
		margin: 0 auto;
	}

	.wb-pc__slider {
		width: 100%;
		margin: 0;
	}

	.wb-slider__btn,
	.wb-pc__btn,
	.wb-banner__btn {
		width: 32px;
		height: 32px;
		box-sizing: border-box;
	}

	.wb-slider__btn img,
	.wb-pc__btn img,
	.wb-banner__btn img {
		width: 70%;
	}

	#wrap.Exhibition_02 .slider_title {
		margin-bottom: 20px;
		display: flex;
		justify-content: center;
	}

	#wrap.Exhibition_02 .slider_wrap .slider li {
		flex-direction: column;
		height: auto;
	}

	#wrap.Exhibition_02 .slider_wrap .slider li > div {
		width: 100%;
	}

	#wrap.Exhibition_02 .slider_wrap .slider.blue li .info_box {
		padding: 32px 24px 40px;
	}

	.exhibition_02 .hero_description {
		font-size: 14px;
	}

	.exhibition_02 .hero_date {
		font-size: 16px;
		margin: 12px auto 24px;
	}

	.exhibition_02 .hero_mini_banner {
		padding: 20px 24px;
	}

	.exhibition_02 .hero_mini_banner .sub {
		font-size: 16px;
	}

	.exhibition_02 .hero_mini_banner .main {
		font-size: 26px;
	}

	#wrap.Exhibition_02 #hero_section .content_inner {
		padding-bottom: 40px;
	}

	/* Slider cards */
	#wrap.Exhibition_02 .slider_wrap .slider li .img_box {
		max-height: 190px;
	}

	#wrap.Exhibition_02 .slider_wrap .slider li .img_box img {
		height: 80%;
	}

	#wrap.Exhibition_02 .slider_wrap .slider li .img_box img.big {
		height: 100%;
	}

	#wrap.Exhibition_02 .slider_wrap .slider li .info_box {
		padding: 24px 16px;
		box-sizing: border-box;
		height: calc(100% - 190px);
	}

	#wrap.Exhibition_02 .slider_wrap .slider li .info_box .banner_counter {
		min-width: 48px;
		height: 25px;
		font-size: 11px;
		margin-bottom: 12px;
	}

	#wrap.Exhibition_02 .slider_wrap .slider li .info_box .banner_counter span {
		font-size: 11px;
	}

	#wrap.Exhibition_02 .slider_wrap .slider li .info_box .p_name {
		font-size: 24px;
		margin-bottom: 8px;
	}

	#wrap.Exhibition_02 .slider_wrap .slider li .info_box .p_desc {
		font-size: 14px;
		margin-bottom: 16px;
	}

	#wrap.Exhibition_02 .slider_wrap .slider li .info_box .p_detail {
		border-top-width: 1px;
		border-bottom-width: 1px;
		padding: 12px 0;
		margin-bottom: 12px;
	}

	#wrap.Exhibition_02 .slider_wrap .slider li .info_box .p_detail .s_title,
	#wrap.Exhibition_02 .slider_wrap .slider li .info_box .p_detail .s_content {
		font-size: 14px;
	}

	#wrap.Exhibition_02 .slider_wrap .slider li .info_box .p_price {
		display: inline-flex;
		flex-direction: row-reverse;
		align-items: center;
		gap: 8px;
	}

	#wrap.Exhibition_02 .slider_wrap .slider li .info_box .btn_detail_view {
		display: block;
		text-align: center;
		margin-top: 28px;
		height: 50px;
		line-height: 50px;
		font-size: 14px;
		padding: 0;
	}

	#wrap.Exhibition_02 .slider_wrap .slider li .info_box .p_price .price span {
		font-size: 20px;
	}

	#wrap.Exhibition_02 .slider_wrap .slider li .info_box .p_price .o_price {
		font-size: 18px;
	}

	.wb-banner__prev {
		top: 90px;
		left: calc(var(--slider-btn-outset) * -0.8);
	}

	.wb-banner__next {
		top: 90px;
		right: calc(var(--slider-btn-outset) * -0.8);
	}

	#wrap.Exhibition_02 .exhibition_content.content_02 {
		padding: 50px 0;
	}

	#wrap.Exhibition_02 .exhibition_content.content_03 {
		padding: 50px 0;
	}

	#wrap.Exhibition_02 .exhibition_content.content_04 {
		padding: 24px 0;
	}

	#wrap.Exhibition_02 .tab_content .tab_list_title {
		display: flex;
		align-items: center;
		gap: 8px;
	}

	.exhibition_banner .event_title svg {
		width: auto;
		height: 24px;
	}

	.tab_content .tab_list_title svg {
		width: auto;
		height: 22px;
	}
}