:root{
	--header-height: clamp(80rem, calc(100 / var(--container) * 100vw), 100rem);
	--hero-bottom-padding: clamp(38rem, calc(209 / var(--container) * 100vw), 209rem);
	--msb: 70rem; /* mob-section-block */
}

#header-new{ position: fixed; inset: 0 0 auto; z-index: 10; background: #0000000D; color: #fff;
	.container{ display: flex; align-items: center; justify-content: space-between; height: var(--header-height); }
	.logo{ justify-self: start; position: relative; display: inline-block; }
	.logo__img{ display: block; width: auto; height: clamp(24rem, calc(40 / var(--container) * 100vw), 40rem); }
	.main-nav{
		.main-menu{ display: flex; gap: 100rem; }
		.main-menu a{ display: flex; align-items: center; height: var(--header-height); font: var(--font_size18) var(--font-wav); }
	}
	@media(prefers-reduced-motion:no-preference){
		.menu-bar{ transition: .4s; }
	}
	@media(max-width:1279px){
		.main-nav{ display: none; }
	}

	.offcanvas{ --border-color: #eaeaea; justify-self: end;
		.offcanvas-toggle{ position: relative; z-index: 11; display: block; width: 30rem; aspect-ratio: 1; cursor: pointer; }
		.bar{ position: absolute; inset: 0; margin: auto; height: 2px; background: currentColor; }
		.bar-1{ translate: 0 -8rem; }
		.bar-2{ transform-origin: left; }
		.bar-3{ translate: 0 8rem; }
		&[open] .offcanvas-toggle{ color: var(--black);
			.bar-1{ translate: 0; rotate: 45deg; }
			.bar-2{ scale: 0 1; }
			.bar-3{ translate: 0; rotate: -45deg; }
		}
		.offcanvas-content{ --padding-block: 15rem; --padding-inline: 16rem; overflow: hidden auto; position: fixed; inset: 0; margin: auto; margin-right: 0; z-index: 10; max-width: 280rem; background: #fff; color: #000; }
		.offcanvas-header{ display: grid; align-items: center; justify-content: flex-end; height: var(--header-height); }
		.offcanvas-close{ position: relative; margin-right: 16px; display: block; width: 30rem; aspect-ratio: 1; background: 0;
			&::before, &::after{ content: ''; position: absolute; top: 50%; left: 0; display: block;  width: 100%; height: 2px; background: currentColor; transform: translateY(-50%) rotate(45deg); }
			&::after{ transform: translateY(-50%) rotate(-45deg); }
		}
		.main-menu{
			& > li{ border-top: 1px solid var(--border-color); }
			& > li:last-child{ border-bottom: 1px solid var(--border-color); }
			a{ position: relative; display: block; width: 100%; padding: var(--padding-block) 30rem var(--padding-block) var(--padding-inline); box-sizing: border-box; text-align: left; font-size: 16rem; }
		}
		@media(prefers-reduced-motion:no-preference){
			.offcanvas-toggle, .bar{ transition: .4s; }
			&::details-content, .offcanvas-content{ transition: .4s; transition-behavior: allow-discrete; }
			.offcanvas-content{ translate: 100%; }
			&[open] .offcanvas-content{ translate: 0; }
			.main-menu{
				[data-nav-level="1"], summary::before, ::details-content{ transition: .4s; transition-behavior: allow-discrete; }
				::details-content{ overflow: clip; height: 0; }
				[open]::details-content{ height: auto; }
			}
		}
		@media(width>=1280px){
			&{ display: none; }
		}
	}
	.backdrop{ position: fixed; inset: 0; background: #000; opacity: 0; visibility: hidden;
		#header:has(.offcanvas[open]) &{ opacity: .6; visibility: visible; }
		@media(prefers-reduced-motion:no-preference){
			transition: .4s;
		}
	}
}

main{ contain: content; }

.hero{ --bg: #6F1814 url('/images/main-new/hero-noise.png'); position: relative; margin-bottom: calc(var(--hero-bottom-padding) * -1); padding-top: clamp(var(--msb), calc(278 / var(--container) * 100vw), 278rem);
	&::before{ content: ''; position: absolute; inset: 0 0 var(--hero-bottom-padding); background: var(--bg); }
	.container{ z-index: 2; }
	.logo{ margin-inline: auto; display: block; max-width: 633rem; width: 100%; height: auto; }
	.stew-block{ position: relative; z-index: 1; margin: clamp(50rem, calc(131 / var(--container) * 100vw), 131rem) auto 0; max-width: 861rem; aspect-ratio: 861/620; }
	.stew-text-block{ position: absolute; top: 0; left: 6%; width: 80.95238095%; background: var(--bg); }
	.stew-text{ width: 100%; height: auto; mix-blend-mode: soft-light; }
	.stew-photo{ position: absolute; bottom: 0; left: 0; width: 100%; height: auto; }
	.brand-name-block{ position: absolute; inset: auto 0 0 50%; height: var(--hero-bottom-padding); background: #5D0C09; }
	.brand-name{ position: absolute; inset: 0; margin: auto 0 auto auto; width: 83.54166667%; height: auto; mix-blend-mode: soft-light; }
	@media(prefers-reduced-motion:no-preference){
		.stew-block.effect_active{}
	}
	@media(width>=1280px){
		.stew-block{ translate: -1px; }
	}
}

/* #region global */
.global-heading{ margin-inline: auto; width: fit-content; min-width: 5ch; padding: 0.45714286em .972em 0.47142857em; background: #D9D9D903; border: 2px solid currentColor; font: var(--font_size70)/1 var(--font-wav); text-align: center; }

.global-quotation{ margin-top: 2.07142857em; display: grid; grid-template-columns: 1fr auto 1fr; gap: clamp(10rem, calc(80 / var(--container) * 100vw), 80rem); font: var(--font_size28)/1.42857143 var(--font-wav); text-align: center;
	&::before, &::after{ content: '“'; width: 0.35675676em; height: 0.30810811em; font-size: 6.60714286em; line-height: 1; color: #B22F2F; }
	&::before{ justify-self: right; translate: -26%; }
	&::after{ rotate: 180deg; translate: 26%; }
	@media(prefers-reduced-motion:no-preference){
		&::before{ translate: -126%; opacity: 0; transition: .6s .2s; }
		&::after{ translate: 126%; opacity: 0; transition: .6s .2s; }
		&.effect_active::before{ translate: -26%; opacity: 1; }
		&.effect_active::after{ translate: 26%; opacity: 1; }
	}
	@media(width<768px){
		&{ gap: 10rem; }
		&::before, &::after{ font-size: 5em; }
	}
}
/* #endregion */

.vision{ padding-block: calc(var(--hero-bottom-padding) + clamp(var(--msb), calc(150 / var(--container) * 100vw), 150rem)) clamp(var(--msb), calc(149 / var(--container) * 100vw), 149rem); background: #29221b url('/images/main-new/vision-bg.webp') no-repeat 50% / cover; color: #fff;
	.container{ display: grid; align-items: start; gap: 40rem clamp(10rem, calc(213 / var(--container) * 100vw), 213rem); }
	.global-heading{ padding-inline: .4em; }
	.description{ font: var(--font_size22)/1.81818182 var(--font-pre); }
	.thank-you{ margin-top: 2.10714286em; display: block; font: 500 var(--font_size28)/1.07142857 var(--font-gmk); }
	@media(width>=1280px){
		.container{ grid-template-columns: auto 1fr; }
		.description{ margin-top: 3rem; }
	}
}

.support{ padding-block: clamp(var(--msb), calc(160 / var(--container) * 100vw), 160rem) clamp(var(--msb), calc(100 / var(--container) * 100vw), 100rem); background: #000 url('/images/main-new/support-bg.webp') no-repeat 50% / cover; color: #fff;
	.text-1{ margin: clamp(40rem, calc(100 / var(--container) * 100vw), 100rem) auto 0; display: block; max-width: 10.83333333em; width: 100%; height: auto; font-size: var(--font_size60) }
	.list{ counter-reset: index; margin: clamp(40rem, calc(75 / var(--container) * 100vw), 75rem) auto 0; display: grid; gap: 10rem; max-width: min(830rem, 80%); font: var(--font_size32) var(--font-wav); text-align: center; }
	.list > li{ display: flex; flex-direction: column; gap: 0.34375000em; padding: 1.28125000em 0.4ch; background: #CE0F0F; border: 3rem solid #FF0000; border-radius: 10rem; }
	.list > li::before{ counter-increment: index; content: counter(index, decimal-leading-zero); font: var(--font_size22) var(--font-wav); color: #FF5E5E; }
	.text-2{ margin: clamp(40rem, calc(75 / var(--container) * 100vw), 75rem) auto 0; display: block; max-width: 10.83333333em; width: 100%; height: auto; font-size: var(--font_size60); }
	@media(width>=768px){
		.list{ grid-template-columns: repeat(4, 1fr); }
	}
	@media(width<768px){
		.list{ grid-template-columns: repeat(2, 1fr); }
	}
}

.additional-benefits{ padding-block: clamp(var(--msb), calc(160 / var(--container) * 100vw), 160rem); background: #000; color: #fff;
	.text-1{ margin-inline: auto; display: block; max-width: 1000rem; width: 100%; height: auto; }
}

.startup{ padding-block: clamp(var(--msb), calc(160 / var(--container) * 100vw), 160rem); background: #000 url('/images/main-new/startup-bg.webp') no-repeat 50% / cover; color: #fff;
	.diag{ margin: clamp(50rem, calc(100 / var(--container) * 100vw), 100rem) auto 0; display: block; max-width: 1050rem; width: 100%; height: auto; }
	.middle-block{ margin-top: clamp(var(--msb), calc(100 / var(--container) * 100vw), 100rem); padding-block: 63rem 57rem; background: #00000080; font: var(--font_size22)/1.81818182 var(--font-pre); text-align: center; }
	.middle-description{ margin-inline: auto; max-width: 64ch; }
	u{ font-weight: 700; color: #ffe138; text-underline-offset: 0.2em; }
	.bottom-block{ margin-top: clamp(var(--msb), calc(100 / var(--container) * 100vw), 100rem); }
	.list{ margin: clamp(50rem, calc(100 / var(--container) * 100vw), 100rem) auto 0; display: grid; gap: 32rem; max-width: 1120rem; color: #fff; text-align: center; }
	.list > li{ background: #000; }
	.title-block{ align-content: center; padding: 0.38ch .4ch .4ch; background: no-repeat 50% / cover; box-sizing: border-box; font: var(--font_size40) var(--font-wav); }
	.title-block-1{ background-image: url('/images/main-new/startup-title-1.webp'); }
	.title-block-2{ background-image: url('/images/main-new/startup-title-2.webp'); }
	.title-block-3{ background-image: url('/images/main-new/startup-title-3.webp'); }
	.body-block{ padding: 35rem 1.6ch 62rem; font: var(--font_size18)/1.38888889 var(--font-gmk); }
	.sub-title{ color: #FF0000; }
	.description{ margin-top: 30rem; }
	@media(width>=768px){
		.list{ grid-template-columns: repeat(3, 1fr); }
		.title-block{ aspect-ratio: 352/278; }
	}
	@media(width>=1280px){
		.diag{ translate: 2.9%; }
	}
	@media(width<768px){
		.title-block{ padding-block: 1em; }
	}
}

.promo{ padding-block: clamp(var(--msb), calc(100 / var(--container) * 100vw), 100rem) clamp(var(--msb), calc(160 / var(--container) * 100vw), 160rem); background: linear-gradient(#B22F2F, #B22F2F) no-repeat 50% 100% / 100% var(--bg-color-size), url('/images/main-new/promo-bg.webp') repeat, #000; color: #fff;
	.logo{ margin: 0 auto clamp(50rem, calc(101 / var(--container) * 100vw), 101rem); display: block; max-width: 457rem; width: 100%; height: auto; }
	.list{ margin: clamp(50rem, calc(95 / var(--container) * 100vw), 95rem) auto 0; display: flex; justify-content: center; gap: 116rem; max-width: 837rem; }
	.image-baemin, .image-coupon{ margin-inline: auto; display: block; width: 100%; height: auto; }
	.image-baemin{ max-width: 360rem; }
	.image-coupon{ max-width: 361rem; }
	@media(width>=768px){
		--bg-color-size: clamp(465rem, calc(515 / var(--container) * 100vw), 515rem);
	}
	@media(width>=1280px){
		--bg-color-size: 515rem;
	}
	@media(width<768px){
		--bg-color-size: clamp(425rem, calc(465 / var(--container) * 100vw), 465rem);
		.list{ flex-direction: column; }
	}
}

.network{ padding-top: clamp(var(--msb), calc(160 / var(--container) * 100vw), 160rem); background: #16233e url('/images/main-new/network-bg.webp') no-repeat 50% / cover; color: #fff;
	.heading-image{ margin-inline: auto; display: block; max-width: 11.81666667em; width: 100%; height: auto; font-size: var(--font_size60); }
	.description{ margin-top: clamp(50rem, calc(112 / var(--container) * 100vw), 112rem); font: var(--font_size40) var(--font-wav); text-align: center; }
	.description-bg{ position: relative; margin: 0 auto 1em; display: block; width: fit-content; isolation: isolate; }
	.description-bg::before{ content: ''; position: absolute; inset: -0.22500000em -1.02500000em; z-index: -1; background: #FF0000; }
	.nationwide-block{ margin-top: clamp(50rem, calc(112 / var(--container) * 100vw), 112rem); background: url('/images/main-new/network-elliptical-half.webp') no-repeat 50% / auto 100%; }
	.nationwide{ margin-inline: auto; display: block; max-width: 846rem; width: 100%; height: auto; }
}

.supply{ contain: content; padding-block: clamp(var(--msb), calc(162 / var(--container) * 100vw), 162rem) clamp(var(--msb), calc(160 / var(--container) * 100vw), 160rem); background: #000 url('/images/main-new/supply-bg.webp') no-repeat 50% / cover; color: #fff;
	.heading{ font: 800 var(--font_size60)/1.16666667 var(--font-tnd); text-align: center; }
	.separator{ margin: 0 auto; border-top: 1px solid currentColor; font-size: var(--font_size60); }
	.separator--wide{ margin-top: 38rem; width: 3.33333333em; }
	.separator--narrow{ margin-block: 0.43333333em .5em; width: 1.66666667em; }
	.list{ margin: clamp(50rem, calc(60 / var(--container) * 100vw), 60rem) auto 0; display: flex; flex-wrap: wrap; justify-content: center; text-align: center; }
	.list > li{ align-content: center; aspect-ratio: 1; padding-bottom: 0.2%; background: #D01616B2; border-radius: 50%; box-sizing: border-box; }
	.title{ font: 800 var(--font_size30) var(--font-tnd); }
	.description{ font: var(--font_size22)/1.36363636 var(--font-wav); }
	@media(width>=1280px){
		.list{ max-width: 1392rem; }
		.list > li{ margin-inline: -20rem; width: 27.1552%; }
	}
	@media(width<1280px){
		.list{ max-width: 500rem; }
		.list > li{ margin-inline: -5rem; width: 51.2376%; }
		.list > li:nth-child(n+3){ margin-top: -10rem; }
	}
}

.sample-request{ padding-block: clamp(var(--msb), calc(160 / var(--container) * 100vw), 160rem) clamp(var(--msb), calc(212 / var(--container) * 100vw), 212rem); background: url('/images/main-new/sample-request-food.webp') no-repeat 0 100% / min(1195rem, 80%), url('/images/main-new/sample-request-bg.webp'), #000; color: #fff;
	.heading-image{ margin-inline: auto; display: block; max-width: 9.26666667em; width: 100%; height: auto; font-size: var(--font_size60); }
	.link{ margin: 57rem auto 0; display: block; max-width: 808rem; width: 100%; background: #CB2717CC no-repeat calc(100% - 12rem) 100% / auto 95.22673031%; box-sizing: border-box; }
	.text-block{ display: block; }
	.text-1{ font: var(--font_size40)/1.5 var(--font-wav); }
	.separator{ margin-block: 41rem 45rem; border: 0 solid currentColor; border-top-width: 1px; font-size: var(--font_size40); }
	.separator{ margin-block: 1.02500000em 1.12500000em; border: 0 solid currentColor; border-top-width: 1px; font-size: var(--font_size40); }
	.text-2{ position: relative; font: var(--font_size50)/1.6 var(--font-wav); }
	.text-2::before{ content: ''; position: absolute; top: 93%; left: 76.5%; width: 2.94em; aspect-ratio: 147/16; background: url('/images/main-new/sample-request-arrow.png') no-repeat 50% / contain; }
	@media(width>=768px){
		.link{ background-image: url('/images/main-new/sample-request-soojeo.webp'); }
		.text-block{ padding: 8.16831683% 29.08415842% 8.16831683% 10.14851485%; }
	}
	@media(width<768px){
		.text-block{ padding: 8.16831683% 10.14851485%; }
	}
}

.menu-section{ padding-block: clamp(var(--msb), calc(160 / var(--container) * 100vw), 160rem); background: #000 url('/images/main-new/menu-bg.jpg') no-repeat 50% / cover; color: #fff;
	.global-heading{ padding-inline: 0.25714286em; }
	.swiper{ margin: 100rem auto 0; max-width: 1400rem; }
	.swiper-wrapper{ max-height: 284rem; }
	.figure-block{ position: relative; aspect-ratio: 440/284; }
	.image{ display: block; width: 84.77272727%; height: auto; filter: drop-shadow(0 0 6rem #000); }
	.caption{ position: absolute; right: 0; bottom: 0; max-width: 335rem; width: 100%; text-align: center; }
	.name{ margin-bottom: 0.35000000em; font: 800 var(--font_size40) var(--font-tnd); text-shadow:1px 2px #0000009e; }
	.separator{ margin: 0 auto; max-width: 250rem; border-top: 1px solid #FF0000; border-bottom: 0; }
	.description{ margin-top: 0.83333333em; font: var(--font_size24) var(--font-wav); }
	.controls{ margin-top: 100rem; display: flex; align-items: end; justify-content: space-between; }
	.swiper-button{ width: 106rem; aspect-ratio: 106/16; background: url('/images/main-new/menu-left-arrow.png') no-repeat 50% / contain; }
	.swiper-button--next{ scale: -1 1; }
	.swiper-pagination{ all: unset; display: flex; flex-wrap: wrap; gap: 10rem 20rem; }
	.swiper-pagination-bullet{ width: 15rem; height: 15rem; background: 0; border: 1px solid currentColor; border-radius: 50%; box-sizing: border-box; opacity: 1; }
	#wrap & .swiper-pagination-bullet{ margin-inline: 0; }
	.swiper-pagination-bullet-active{ background: #fff; }
	@media(width<768px){
		.controls{ justify-content: center; }
		.swiper-pagination{ gap: 10rem; }
		.swiper-button{ display: none; }
	}
}

.signature{ position: relative; padding-bottom: clamp(var(--msb), calc(179 / var(--container) * 100vw), 179rem); background: #000 url('/images/main-new/signature-bg.png'); color: #fff;
	.top-block{ position: relative; }
	.top-block::after{ content: ''; position: absolute; aspect-ratio: 814/768; background: url('/images/main-new/signature-top-food.webp') no-repeat 100% 50% / contain; pointer-events: none; }
	.heading-block{ position: relative; padding-block: clamp(var(--msb), calc(76.5 / var(--container) * 100vw), 76.5rem); background: linear-gradient(0deg, #D21107, #6F0000); box-sizing: border-box; }
	.heading{ font: var(--font_size60) var(--font-wav); }
	.heading small{ margin-bottom: 0.72500000em; display: block; font-size: 0.66666667em; }
	.separator{ margin: 0.58333333em auto 0.71666667em; max-width: 542rem; width: 100%; border-top: 1px solid currentColor; border-bottom-width: 0; font-size: var(--font_size60); }
	.sub-heading{ font: var(--font_size24)/1.66666667 var(--font-wav); }
	.list{ margin: var(--msb) auto 0; display: grid; gap: 40rem 52rem; max-width: 1139rem; text-align: center; }
	.item{ container: item / inline-size; margin-inline: auto; max-width: 345rem; width: 100%; aspect-ratio: 345/578; padding: 76rem 32rem 0; background: no-repeat 50% 100% / cover; box-sizing: border-box; }
	.item-1{ background-image: url('/images/main-new/signature-list-1.webp'); }
	.item-2{ background-image: url('/images/main-new/signature-list-2.webp'); }
	.item-3{ background-image: url('/images/main-new/signature-list-3.webp'); }
	.title{ font: 800 15.65836299cqw var(--font-tnd); }
	.item .separator{ margin-block: 12.22222222cqw 14.81481481cqw; max-width: 268rem; }
	.description{ font: 7.11743772cqw/1.75 var(--font-wav); text-wrap: balance; }
	@media(width>=768px){
		.top-block{ background: url('/images/main-new/signature-bg-food.webp') no-repeat 100% 0 / auto 100%; }
		.top-block::after{ inset: 0 0 0 auto; }
		.heading-block{ max-width: 61.92708333%; padding-inline: clamp(10ch, calc(200 / 1920 * 100vw), 200rem); }
		.list{ grid-template-columns: repeat(3, 1fr); }
	}
	@media(width>=1280px){
		.top-block{ padding-block: clamp(var(--msb), calc(112 / var(--container) * 100vw), 112rem); }
		.heading-block{ padding-inline: clamp(10ch, calc(324 / 1920 * 100vw), 324rem); }
		.list{ margin-top: 4rem; }
	}
	@media(width<768px){
		.top-block::after{ top: calc(100% - 190rem); right: 0; width: 60%; }
		.heading-block{ padding-inline: 10ch; padding-bottom: 150rem; }
	}
}

.feature{ padding-block: clamp(var(--msb), calc(160 / var(--container) * 100vw), 160rem); background: #000 url('/images/main-new/feature-bg.webp') no-repeat 50% / cover; color: #fff; text-align: center;
	.text-block{ margin: 99rem auto 0; max-width: 962rem; padding: 52rem clamp(20rem, calc(190 / var(--container) * 100vw), 190rem) 80rem; background: #000000B2; box-sizing: border-box; }
	.key{ font: var(--font_size50) var(--font-wav); }
	.spacer{ margin-bottom: 10rem; display: block; }
	.key strong{ translate: -0.5% 8%; display: inline-block; font-size: 1.4em; color: #FF0000; }
	.separator{ margin-block: 45rem 40rem; max-width: 581rem; border-top: 1px solid currentColor; border-bottom: 0; }
	.description{ margin-top: 3em; font: var(--font_size20)/1.75 var(--font-wav); text-wrap: balance; }
	@media(width<768px){
		.text-block{ padding-inline: 20rem; }
	}
}

.cooking{ padding-block: clamp(var(--msb), calc(160 / var(--container) * 100vw), 160rem); background: #000 url('/images/main-new/cooking-bg.webp') no-repeat 50% / cover; color: #fff;
	.logo{ margin-inline: auto; display: block; max-width: 457rem; width: 100%; height: auto; }
	.intro-message{ margin: 1.78571429em auto 0; width: fit-content; font: var(--font_size28)/1.78571429 var(--font-wav); text-align: center; }
	.ingredients-list{ margin-top: 50rem; display: flex; flex-wrap: wrap; justify-content: center; gap: 20rem clamp(10rem, calc(30 / var(--container) * 100vw), 30rem); }
	.ingredient-image{ display: block; max-width: 271rem; width: 100%; height: auto; }
	.quick-summary{ margin: 67rem auto 0; width: fit-content; padding: 0.71250000em 16rem; background: #FF0000; border-radius: 10rem; font: var(--font_size40) var(--font-wav); text-align: center; }
	.steps-block{ position: relative; margin: 94rem auto 0; max-width: 1353rem; padding: clamp(50rem, calc(77 / var(--container) * 100vw), 77rem) clamp(10rem, calc(91 / var(--container) * 100vw), 91rem) clamp(50rem, calc(89 / var(--container) * 100vw), 89rem); background: #000000B2; box-sizing: border-box; }
	.cooking-steps{ display: grid; gap: 32rem; }
	.cooking-item{ display: flex; gap: 1.4ch; }
	.cooking-item:first-child{ margin-bottom: 4rem; gap: 4.1ch; }
	dt{ font: 800 var(--font_size32) var(--font-tnd); white-space: nowrap; }
	dt::after{ content: ' : '; }
	dd{ font: var(--font_size32) var(--font-wav); }
	.font-size-big{ font: 800 var(--font_size50) var(--font-tnd); }
	.color-red{ color: #B22F2F; }
	.closing-message{ margin-top: 1.90625000em; font: var(--font_size32) var(--font-wav); }
	@media(width>=768px){
		.quick-summary{ padding-inline: 1.5375em }
		.steps-block::before{ content: ''; position: absolute; right: 0; bottom: 0; translate: 3.85%; width: 44%; aspect-ratio: 647/475; background: url('/images/main-new/cooking-food.webp') no-repeat 50% / contain; user-select: none; pointer-events: none; }
	}
	@media(width>=1280px){
		.steps-block::before{ width: 47.81966001%; }
	}
}

.revenue{ padding-block: clamp(var(--msb), calc(170 / var(--container) * 100vw), 170rem) clamp(var(--msb), calc(160 / var(--container) * 100vw), 160rem); background: #000 url('/images/main-new/revenue-bg.webp'); color: #fff;
	.sales-map{ margin: clamp(50rem, calc(100 / var(--container) * 100vw), 100rem) auto 0; display: block; max-width: 832rem; width: 100%; height: auto; }
}

.store{ padding-block: clamp(var(--msb), calc(170 / var(--container) * 100vw), 170rem) clamp(var(--msb), calc(166 / var(--container) * 100vw), 166rem); background: #000 url('/images/main-new/store-bg.webp') no-repeat 50% / cover; color: #fff;
	.distribution{ margin: clamp(50rem, calc(100 / var(--container) * 100vw), 100rem) auto 0; display: block; height: auto; }
	@media(width>=768px){
		.distribution{ max-width: 1064rem; width: 100%; }
	}
	@media(width<768px){
		.distribution{ max-width: 477rem; width: 80%; }
	}
}

/* #region franchise */
.main_franchise{ padding: clamp( 70rem, calc( 121 / var(--inner) * 100vw ), 121rem) 0 clamp( 70rem, calc( 130 / var(--inner) * 100vw ), 130rem); background: #8d8d8d url('/images/main/img_franchise_bg.jpg') repeat 50% / 100%; text-align: center; }
.main_franchise__h2{ margin-bottom: 1.07142857em; color: #fff; }
.main_franchise__h2{ font-size: var(--font_size70); font-weight: 500; line-height: 1.35714286; }
.main_franchise__h2 strong{ color: var(--secondary); }
.main_franchise__ul{ display: grid; gap: clamp( 10rem, calc( 40 / var(--inner) * 100vw ), 40rem); font-weight: 700; counter-reset: list_num; }
.main_franchise__ul li > *{ display: flex; justify-content: center; align-items: center; box-sizing: border-box; }
.main_franchise__number{ height: 2.2em; padding-top: 3%; background: #222; font-size: var(--font_size30); color: var(--secondary); counter-increment: list_num; }
.main_franchise__number::before{ content: counter(list_num); }
.main_franchise__location{ height: 3.95em; padding-top: 2%; background: rgba(255, 255, 255, 0.6); font-size: var(--font_size40); }
@media(prefers-reduced-motion:no-preference){
	.main_franchise__ul li,
	.main_franchise__number,
	.main_franchise__location{ transition: .4s; }
}
@media(hover:hover){
	.main_franchise__ul li:hover{ box-shadow: 25rem 25rem 36rem 4rem rgba(0, 0, 0, 0.2); }
	.main_franchise__ul li:hover .main_franchise__number{ background: var(--primary); }
	.main_franchise__ul li:hover .main_franchise__location{ background: rgba(255, 255, 255, 1); }
}
@media(min-width:768px){
	.main_franchise__ul{ grid-template-columns: repeat(4, 1fr); }
}
@media(max-width:767px){
	.main_franchise__ul{ grid-template-columns: repeat(2, 1fr); }
}
/* #endregion */

/* #region inquiry */
.main_inquiry{ position: sticky; bottom: 0; padding: 25rem 0 18rem; background: #222; color: #fff; z-index: 9; }
.main_inquiry .inr{ position: static; display: flex; justify-content: space-between; align-items: center; max-width: 1600rem; }
.main_inquiry .inr::before{ content: ''; position: absolute; inset: 0; background: #222; }
.main_inquiry h2{ position: relative; z-index: 2; }
.main_inquiry__tel{ display: flex; align-items: center; box-sizing: border-box; font-size: var(--font_size35); font-weight: 500; }
.main_inquiry__tel::before{ content: ''; margin-right: 0.65714286em; position: relative; top: -0.11428571em; display: inline-block; width: 1.25714286em; height: 1.14285714em; background: url('/images/main/icon_tel.png') no-repeat 50% / contain; }
.main_inquiry_form{ position: relative; display: grid; justify-content: start; align-content: center; gap: 6rem; z-index: 1; }
.main_inquiry_form *{ margin: 0; }
.main_inquiry_form :where(.name, .location, #online_btn){ border-radius: 8rem; }
.main_inquiry_form :where(.name, .location, .phone1, .phone2, .phone3, #online_btn){ height: 40rem; padding: 7rem 14rem 0; border: 0; background: #fff; box-sizing: border-box; font-family: 'GmarketSans', 'Pretendard', '맑은 고딕', '돋움', 'Dotum', '굴림', 'Gulim', Sans-serif;; font-size: 18rem; color: #111; }
.main_inquiry_form :where(.name, .location, .phone1, .phone2, .phone3, #online_btn)::placeholder{ color: #888; }
.main_inquiry_form .location{ appearance: none; padding-right: 30rem; background: #fff url('/images/main/icon_select_arrow.png') no-repeat calc( 100% - 14rem ) 50% / 9rem 5rem; }
.main_inquiry_form .phone{ display: flex; }
.main_inquiry_form .phone *{ width: 1px; border-radius: 0; }
.main_inquiry_form .phone1{ flex: 3; padding-right: 0; border-radius: 8rem 0 0 8rem; }
.main_inquiry_form .phone2{ flex: 4; padding-inline: 0; }
.main_inquiry_form .phone3{ flex: 4; padding-left: 0; border-radius: 0 8rem 8rem 0; }
#online_btn{ padding-top: 4rem; background: var(--primary); color: #fff; }
.main_inquiry_form__p{ margin-top: 10rem; font-size: 18rem; opacity: .7; }
.main_inquiry_form__btn{ position: absolute; inset: 0 0 0 auto; display: flex; flex-direction: column; justify-content: center; align-items: center; gap: 5rem; padding: 0 .5em; background: var(--primary); font-size: 18rem; color: #fff; }
.main_inquiry_form__btn::after{ content: '보기'; }
.show.main_inquiry_form__btn::after{ content: '숨기기'; }
@media(prefers-reduced-motion:no-preference){
	.main_inquiry{ animation: frame_in_inquiry .4s .6s both; }
	@keyframes frame_in_inquiry {
		0%{ transform: translateY(100%); }
		100%{ transform: translateY(0%); }
	}
	.main_inquiry_form{ transition: .4s; }
}
@media(min-width:768px){
	.main_inquiry_form{ grid-template-columns: repeat(4, auto); }
	.main_inquiry_form :where(.name, .location){ width: 170rem; }
	.main_inquiry_form .phone{ width: 230rem; }
	.main_inquiry_form__p{ grid-column: 1/5; }
	#online_btn{ width: 140rem; }
}
@media(min-width:1280px){
	.main_inquiry_form__btn{ display: none; }
	.sample_quick{ display: none; }
}
@media(max-width:1279px){
	.main_inquiry .inr::before{ border-top: 1rem solid #ddd; }
	.main_inquiry_form:not(.show){ clip-path: inset(100% 0 0); }
	.main_inquiry_form{ position: absolute; inset: auto 0 calc( 100% - 1rem); padding: 20rem 4vw; background: #222; box-sizing: border-box; clip-path: inset(0); }

	.sample_quick {display: block; position: fixed; right: 10px; bottom: 12vh; width: 50px; z-index: 9; animation: bounce 2s infinite; z-index: -1; }
	.sample_quick img {width: 100%;}
	@keyframes bounce {
		0%, 60% {transform: translateY(0);}
		20%, 80% {transform: translateY(5px);}
		40%, 100% {transform: translateY(-3px);}
	}
}
@media(max-width:767px){
	.main_inquiry_form{ display: flex; flex-direction: row; flex-wrap: wrap; justify-content: space-between; }
	.main_inquiry_form :where(.name, .location) {width: 49%;}
	.main_inquiry_form .phone {width: 100%;}
	#online_btn{ width: 100%; }
}
/* #endregion */

#footer-new{ padding-block: 49rem 67rem; background: #000; font: 16rem/1.5 var(--font-pre); color: #B8B8B8;
	.container{ display: flex; flex-direction: column; gap: 40rem; }
	.links-list{ display: flex; gap: 10rem 10rem; }
	.link{ display: block; padding: 12.5rem; background: #FFFFFF12; box-sizing: border-box; font-weight: 700; text-align: center; }
	.logo{ display: block; max-width: 229rem; width: 100%; height: auto; }
	dl{ margin-top: 38rem; display: flex; flex-wrap: wrap; gap: 15rem 30.6rem; max-width: 850rem; }
	dt{ font-weight: 700; }
	.dl-item{ display: flex; gap: 11rem; }
	.copyright{ margin-top: 35rem; font-weight: 500; }
	@media(width>=768px){
		.link{ min-width: 180rem; }
	}
	@media(width>=1280px){
		.container{ flex-direction: row-reverse; justify-content: space-between; }
		.links-list{ margin-top: 6rem; flex-direction: column; }
	}
}




.shopin{ padding-block: clamp(var(--msb), calc(160 / var(--container) * 100vw), 160rem); background: #000 url('/images/main-new/shopin_bg.png') no-repeat 40% -4% / 100%; color: #fff;
	 .text-1{margin: clamp(40rem, calc(100 / var(--container) * 100vw), 100rem) auto 0; display: block; max-width: 10.83333333em; width: 100%; height: auto; font-size: var(--font_size60);}
	.diag{ margin: clamp(50rem, calc(100 / var(--container) * 100vw), 100rem) auto 0; display: block; max-width: 1050rem; width: 100%; height: auto; }
	.middle-block{ margin-top: clamp(var(--msb), calc(100 / var(--container) * 100vw), 70rem); padding-block: 0; background: #00000080; font: var(--font_size22)/1.81818182 var(--font-pre); text-align: center; }
	.middle-description{ margin-inline: auto; max-width: 64ch; }
	u{ font-weight: 700; color: #ffe138; text-underline-offset: 0.2em; }
	.bottom-block{ margin-top: clamp(var(--msb), calc(100 / var(--container) * 100vw), 100rem); }
	.list{ margin: clamp(50rem, calc(60 / var(--container) * 100vw), 60rem) auto 0; display: flex; flex-wrap: wrap; justify-content: center; text-align: center; }
	.list > li{ align-content: center; aspect-ratio: 1; padding-bottom: 0.2%;  box-sizing: border-box; }
	.description{ margin-top: clamp(36rem, calc(112 / var(--container) * 100vw), 32rem); font: var(--font_size40) var(--font-wav); text-align: center; margin-bottom:120rem; }
	.description-bg{ position: relative; margin: 0 auto 1em; display: block; width: fit-content; isolation: isolate; }
	.description-bg::before{ content: ''; position: absolute; inset: -0.22500000em -1.02500000em; z-index: -1; background: #FF0000; }
	@media(width>=1280px){
		.list{max-width: 1262rem;}
		.list > li{margin-inline: -20rem;width: 20.1552%;}
		.list > li img{width:100%;}
	}
	@media(width<1280px){
		.list > li{ margin-inline: -5rem; width: 18%; }
		.list > li > img{width: 100%; }
		.description{margin-bottom:58rem; }
		.middle-block{padding-block:0;}
	}
	@media(width<768px){
		.text-1{max-width:90%;}
		.list > li{ margin-inline: -5rem; width: 34%; }
		.list > li > img{width: 100%; }		
	}
}


.consult_graph{padding-block: clamp(var(--msb), calc(160 / var(--container) * 100vw), 160rem); background: #000 url('/images/main-new/consult_graph_bg.jpg') no-repeat 40% -4% / cover; color: #fff;
	.top-block{ position: relative; display:flex; align-items:center;}
	.heading-block{ position: relative; padding-block: clamp(var(--msb), calc(76.5 / var(--container) * 100vw), 76.5rem);box-sizing: border-box; }
	.heading{ font: var(--font_size35) var(--font-wav); }
	.heading img{max-width:100%; margin-bottom:53rem;}
	.heading small{ margin-bottom: 0.72500000em; display: block; font: var(--font_size25) var(--font-pre); }
	.separator{ margin: 0.58333333em auto 0.71666667em; max-width: 542rem; width: 100%; border-top: 1px solid currentColor; border-bottom-width: 0; font-size: var(--font_size60); }
	.sub-heading{ font: var(--font_size30)/1.66666667 var(--font-wav); }
	.sub-heading em{background:#ff0000; padding:10rem; margin:0 10rem; border-radius:30rem;}
	.list{ margin: var(--msb) auto 0; display: grid; gap: 40rem 52rem; max-width: 1139rem; text-align: center; }
	.description{ font:var(--font_size35); text-wrap: balance; background:#f40000;}
	.right-block{display:flex;}
	@media(width>=768px){
		.top-block::after{ inset: 0 0 0 auto; }
		.heading-block{ max-width: 61.92708333%; padding-inline: clamp(10ch, calc(200 / 1920 * 100vw), 200rem); }
		.sub-heading em{margin:11rem; display:block; text-align:center;}
		.list{ grid-template-columns: repeat(3, 1fr); }
	}
	@media(width>=1280px){
		.top-block{ padding-block: clamp(var(--msb), calc(112 / var(--container) * 100vw), 112rem); }
		.heading-block{ padding-inline: clamp(10ch, calc(244 / 1920 * 100vw), 244rem); }
		.list{ margin-top: 4rem; }
	}
	@media(width<768px){
		.top-block{flex-direction:column;}
		.heading-block{ padding-inline: 10ch; padding: 40rem; }
		.heading small{font: var(--font_size20) var(--font-pre); text-align:center;}
		.right-block{display:flex; justify-content:center;}
		.right-block img{max-width:67%;}
		.sub-heading em{margin:11rem; display:block; text-align:center;}
	}
}


.sample-request_v2{padding-block: clamp(var(--msb), calc(160 / var(--container) * 100vw), 160rem) clamp(var(--msb), calc(212 / var(--container) * 100vw), 212rem);background: url('/images/main-new/sample_button_bg.jpg') no-repeat 0 0 / cover;color: #fff;
	.heading{ font: 800 var(--font_size60)/1.16666667 var(--font-tnd); text-align: center; }
	.heading span{color:#fb0000;}
	.heading-image{ margin-inline: auto; display: block; max-width: 9.26666667em; width: 100%; height: auto; font-size: var(--font_size60); }
	.link{margin: 57rem auto 0;display: block;max-width:500rem;width: 100%;background: #CB2717CC no-repeat calc(100% - 12rem) 100% / auto 95.22673031%;box-sizing: border-box;border-radius: 245rem;}
	.text-block{display: block;border-radius: 80rem;text-align: center;}
	.text-1{font: var(--font_size60)/1.5 var(--font-wav);text-align: center;}
	.separator{ margin-block: 41rem 45rem; border: 0 solid currentColor; border-top-width: 1px; font-size: var(--font_size40); }
	.separator{ margin-block: 1.02500000em 1.12500000em; border: 0 solid currentColor; border-top-width: 1px; font-size: var(--font_size40); }
	.text-2{ position: relative; font: var(--font_size50)/1.6 var(--font-wav); }
	.text-2::before{ content: ''; position: absolute; top: 93%; left: 76.5%; width: 2.94em; aspect-ratio: 147/16; background: url('/images/main-new/sample-request-arrow.png') no-repeat 50% / contain; }
	@media(width>=768px){
		.link{/* background-image: url('/images/main-new/sample-request-soojeo.webp'); */}
		.text-block{padding: 25rem;}
	}
	@media(width<768px){
		.text-block{ padding: 30rem; }
		.heading span{font-size:70rem;}
		.link{margin:17rem auto 0; max-width:340rem;}
		
	}
}