.ssa-root {
	--ssa-color-main: #7024f5;
	--ssa-main-gradient-w: linear-gradient(110deg, rgb(139, 47, 241), rgb(196, 35, 218));
	--ssa-main-gradient-w2: linear-gradient(90deg, #671d9a 0%, #691c97 20%, #000 100%);
	--ssa-main-gradient-h: linear-gradient(180deg, #481ca7 0%, #ac1d7b 100%);
	--ssa-sub-gradient-w: linear-gradient(135deg,#7c3aed,#c026d3);
	--ssa-main: #6d3de9;
	--ssa-color-sub-text: #898989;
	--ssa-color-sub-text-light: #aaaaaa;
	--ssa-color-gray: #cbcbcd;
	--ssa-color-gray-light: #f7f7fb;
	--ssa-color-black: #000;
	--ssa-color-white: #fff;
	--ssa-color-border: #e4e4e4;
	--ssa-font-size-max: clamp(42px, 4.5vw, 76px);
	--ssa-font-size-max-s: clamp(42px, 4.5vw, 76px);
	--ssa-font-size-3xl: clamp(38px, 4vw, 64px);
	--ssa-font-size-2xl: clamp(30px, 3vw, 48px);
	--ssa-font-size-xl: clamp(26px, 2.3vw, 36px);
	--ssa-font-size-lg: clamp(24px, 2vw, 32px);
	--ssa-font-size-md: clamp(20px, 1.5vw, 26px);
	--ssa-font-size-sm: clamp(17px, 1.2vw, 21px);
	--ssa-font-size-xs2: clamp(16px, 1.1vw, 20px);
	--ssa-font-size-xs: clamp(15px, 1vw, 18px);
	--ssa-font-size-xss: clamp(13px, .85vw, 16px);
	--ssa-font-size-base: clamp(12px, .75vw, 14px);
	--ssa-container-width-max: min(100% - 32px, 1920px);
	--ssa-contents-width-inner: min(100% - 32px, 1200px);
	--ssa-contents-width-in: min(100% - 32px, 980px);
	--ssa-space-3xs: clamp(4px,.3vw,6px);
	--ssa-space-2xs: clamp(6px,.5vw,10px);
	--ssa-space-xs: clamp(8px,.8vw,16px);
	--ssa-space-sm: clamp(12px,1.25vw,24px);
	--ssa-space-md: clamp(20px,1.7vw,32px);
	--ssa-space-lg: clamp(24px,2.5vw,48px);
	--ssa-space-xl: clamp(32px,3.4vw,64px);
	--ssa-space-2xl: clamp(48px,5vw,96px);
	--ssa-space-3xl: clamp(64px,6.7vw,128px);
	--ssa-space-4xl: clamp(96px,10vw,192px);
	--ssa-space-max: clamp(116px,12vw,224px);
	--ssa-radius-8: clamp(5px, 1.5vw, 8px);
	--ssa-radius-10: clamp(5px, 2vw, 10px);
	--ssa-radius-15: clamp(8px, 2.5vw, 15px);
	--ssa-radius-30: clamp(15px, 3vw, 30px);
	--ssa-radius-50: clamp(25px, 4vw, 50px);
	--ssa-radius-70: clamp(40px, 5vw, 70px);
	--ssa-radius-full: 9999px;
	--ssa-gap-xs: clamp(6px,.5vw,10px);
	--ssa-gap-sm: clamp(10px,.85vw,16px);
	--ssa-gap-md: clamp(16px,1.25vw,24px);
	--ssa-gap-lg: clamp(24px,1.9vw,36px);
	--ssa-gap-xl: clamp(32px,2.5vw,48px);
	--ssa-line-height-tight: 1.2;
	--ssa-line-height-title: 1.35;
	--ssa-line-height-base: 1.85;
	--ssa-line-height-text: 1.7;
	--ssa-line-height-loose: 2;
}

/* 1920px and above: bounded scaling also caps 2560px / 3840px displays. */
@media (min-width:1920px) {
	.ssa-root {
		--ssa-font-size-max: clamp(80px,4.17vw,96px);
		--ssa-font-size-3xl: clamp(68px,3.55vw,80px);
		--ssa-font-size-2xl: clamp(42px, 2.61vw, 50px);
		--ssa-font-size-xl: clamp(38px,1.98vw,44px);
		--ssa-font-size-md: clamp(28px,1.46vw,32px);
		--ssa-font-size-sm: clamp(22px,1.15vw,24px);
		--ssa-font-size-xs2: clamp(21px,1.1vw,24px);
		--ssa-font-size-xs: clamp(19px,.99vw,22px);
		--ssa-font-size-xss: clamp(17px,.89vw,20px);
		--ssa-font-size-base: clamp(15px,.79vw,18px);
		--ssa-space-xs: clamp(16px,.84vw,20px);
		--ssa-space-sm: clamp(24px,1.25vw,28px);
		--ssa-space-md: clamp(32px,1.67vw,40px);
		--ssa-space-lg: clamp(48px,2.5vw,56px);
		--ssa-space-xl: clamp(64px,3.34vw,80px);
		--ssa-space-2xl: clamp(96px,5vw,112px);
		--ssa-space-3xl: clamp(128px,6.67vw,160px);
		--ssa-space-4xl: clamp(192px,10vw,224px);
		--ssa-space-max: clamp(224px,11.67vw,256px);
		--ssa-gap-xs: clamp(10px,.53vw,12px);
		--ssa-gap-sm: clamp(16px,.84vw,20px);
		--ssa-gap-md: clamp(24px,1.25vw,32px);
		--ssa-gap-lg: clamp(36px,1.88vw,44px);
		--ssa-gap-xl: clamp(48px,2.5vw,64px);
	}

}


.ssa-root {
	color:var(--ssa-color-black);
	background:var(--ssa-color-white);
	color-scheme:light
}

.ssa-inner-max{
  width: 1920px;
  max-width:100%;
  margin: 0 auto;
  padding:0 var(--space-md);
}

.ssa-main-content {
	margin-top:90px;
	padding-bottom:0;
}

.ssa-slider-inner {
	height: auto;
    margin: 0 auto;
}



/* =========================================================
   SSA Àüü CSS Á¤¸®º»
   PC + TABLET + MOBILE
   ---------------------------------------------------------
   Á¤¸® ¿øÄ¢
   1. PC ±âº» ½ºÅ¸ÀÏÀ» ¸ÕÀú ¹èÄ¡
   2. breakpointº° ¹Ìµð¾îÄõ¸®¸¦ µÚÂÊ¿¡ ºÐ¸®
   3. µ¿ÀÏ ¹Ìµð¾îÁ¶°Ç + µ¿ÀÏ ¼±ÅÃÀÚÀÇ Áߺ¹ ¼±¾ð ÅëÇÕ
   4. µ¿ÀÏ ¼Ó¼º Ãæµ¹Àº ¿øº»¿¡¼­ °¡Àå ¸¶Áö¸· ¼±¾ð°ª À¯Áö
   5. keyframes / Á¢±Ù¼º °ü·Ã ±ÔÄ¢ º¸Á¸
   ========================================================= */

/* ==================== PC / BASE ==================== */
.ssa-slider {
	position: relative;
	isolation: isolate;
	overflow: hidden;
	border-radius: var(--ssa-radius-15);
	color: var(--ssa-color-white);
	touch-action: pan-y;
	display: flex;
	flex-direction: column;
}

.ssa-slider-background,.ssa-slider-shade {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	z-index: -1;
	pointer-events: none;
}

.ssa-slider-background {
	object-fit: cover;
	object-position: center;
	transition: transform 5.5s ease;
	transform: scale(1.015);
}

.ssa-slider-shade {
	background: color-mix(in srgb,var(--ssa-color-black) 0%,transparent);
	transition: background .65s ease;
}

.ssa-slide-active .ssa-slider-background {
	transform: scale(1.06);
}

.ssa-slide:nth-child(3) .ssa-slider-background {
	object-position: 65% center;
}

.ssa-slide-panels {
	display: flex;
	width: 100%;
	position: relative;
	align-items: stretch;
	flex: 1;
	transition-property: transform;
	box-sizing: content-box;
}

.ssa-slide {
	flex-shrink: 0;
	width: 100%;
	position: relative;
	transition-property: opacity,transform;
	isolation: isolate;
	overflow: hidden;
	min-width: 0;
	min-height: calc(clamp(500px,calc(100svh - 230px),790px) + 80px);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	text-align: center;
	padding-bottom: calc(var(--ssa-space-2xl) + 80px);
	padding: clamp(34px, 4vw, 64px) 0;
}

.ssa-slide[hidden] {
	display: none;
}

.ssa-swiper-ready .ssa-slide {
	pointer-events: none;
}

.ssa-swiper-ready .ssa-slide-active {
	pointer-events: auto;
}

.ssa-slide.ssa-slide-active .ssa-slide-line {
	animation: ssa-slide-text-in .7s cubic-bezier(.2,.7,.2,1) both;
}

.ssa-slide.ssa-slide-active .ssa-slide-line:nth-child(2) {
	animation-delay: .12s;
}

.ssa-slide.ssa-slide-active .ssa-title-description {
	animation: ssa-slide-text-in .7s .24s both;
}

.ssa-slide.ssa-slide-active .ssa-slide-cta {
	animation: ssa-slide-text-in .7s .36s both;
}

.ssa-tab-progress {
	position: absolute;
	inset: auto 0 0;
	height: 3px;
	background: var(--ssa-color-white);
	transform: scaleX(0);
	transform-origin: left;
	pointer-events: none;
}

.ssa-autoplay-toggle {
	position: absolute;
	top: var(--ssa-space-sm);
	right: var(--ssa-space-sm);
	z-index: 5;
	display: grid;
	place-items: center;
	width: 44px;
	height: 44px;
	border: 1px solid color-mix(in srgb,var(--ssa-color-white) 40%,transparent);
	border-radius: var(--ssa-radius-full);
	background: color-mix(in srgb,var(--ssa-color-black) 25%,transparent);
	color: var(--ssa-color-white);
	font-size: var(--ssa-font-size-xs);
	backdrop-filter: blur(12px);
}

.ssa-slide .ssa-title {
	color: var(--ssa-color-white);
	font-size: var(--font-size-3xl);
	line-height: var(--ssa-line-height-title);
	text-shadow: 0 2px 16px color-mix(in srgb,var(--ssa-color-black) 18%,transparent);
}

.ssa-slide-line {
	display: block;
	animation: none;
}

.ssa-slide-line:nth-child(2) {
	animation-delay: .12s;
}

.ssa-slide .ssa-title-description {
	color: var(--ssa-color-white);
	font-size: var(--font-size-md);
	margin-top: var(--ssa-space-sm);
	font-weight: 500;
	max-width: 850px;
	animation: none;
}

.ssa-slide-cta {
	display: flex;
	align-items: center;
	justify-content: center;

	width: 160px;
	min-height: 50px;
	gap: 8px;
	padding: 0;

	border: 1px solid var(--color-border);
	border-radius: var(--ssa-radius-full);
	background:#fff;
	font-size: var(--ssa-font-size-xss);
	font-weight: 700;
	margin-top:var(--ssa-space-md);
	cursor: pointer;

}

.ssa-root .ssa-slide-cta {
	color: var(--ssa-color-black);
	cursor: default;
}

.ssa-slide-cta span {
	display: grid;
	place-items: center;
	width: 30px;
	height: 30px;
	background: var(--ssa-color-black);
	color: var(--ssa-color-white);
	border-radius: var(--ssa-radius-full);
	font-size: var(--ssa-font-size-xs);
}

.ssa-slide-tabs {
	position: absolute;
	inset: auto 0 0;
	z-index: 3;
	display: flex;
	grid-template-columns: repeat(2,minmax(0,1fr));
	border-top: 1px solid color-mix(in srgb,var(--ssa-color-white) 30%,transparent);
	background: transparent;
	backdrop-filter: none;
	-webkit-backdrop-filter: none;
	top: 93%;
	left: 50px;
	right: auto;
	bottom: auto;
	align-items: center;
	gap: 10px;
	width: auto;
	border: 0;
}

.ssa-slide-tab {
	position: relative;
	min-height: 11px;
	padding: 0;
	font-size: 0;
	line-height: var(--ssa-line-height-title);
	color: transparent;
	transition: background .25s ease;
	width: 11px;
	min-width: 11px;
	height: 11px;
	overflow: hidden;
	border: 2px solid rgb(255 255 255 / 82%);
	border-radius: var(--ssa-radius-full);
	background: transparent;
}

.ssa-slide-tab+.ssa-slide-tab {
	border-left: 1px solid color-mix(in srgb,var(--ssa-color-white) 25%,transparent);
}

.ssa-slide-tab::before {
	content: "";
	position: absolute;
	top: 14px;
	left: calc(50% - 3px);
	width: 6px;
	height: 6px;
	border-left: 2px solid currentColor;
	border-top: 2px solid currentColor;
	transform: translateY(5px) rotate(45deg);
	opacity: 0;
	transition: opacity .2s ease,transform .2s ease;
	display: none;
}

.ssa-slide-tab[aria-selected=true] {
	background: color-mix(in srgb,var(--ssa-color-white) 12%,transparent);
	font-weight: 700;
}

.ssa-slide-tab[aria-selected=true]::before {
	opacity: 1;
	transform: translateY(0) rotate(45deg);
}

.ssa-slide-tab:hover {
	background: color-mix(in srgb,var(--ssa-color-white) 18%,transparent);
}

.ssa-slide-process {
	--ssa-slide-process-duration: 5s;
	color: var(--ssa-color-white);
	text-align: left;
	--ssa-hero-duration: 15s;
}

.ssa-slide-process-layout {
	display: grid;
	grid-template-columns: minmax(0, 1.18fr) minmax(300px, .82fr);
	align-items: center;
	gap: clamp(42px, 6vw, 92px);
	width: var(--ssa-contents-width-inner);
}

.ssa-slide-process-copy {
	position: relative;
	z-index: 2;
	grid-column: 2;
	grid-row: 1;
}

.ssa-slide-process .ssa-title {
	margin: 0;
	color: var(--ssa-color-white);
	text-shadow: none;
}

.ssa-slide-process .ssa-title-description {
	margin-top: var(--ssa-space-lg);
	color: rgb(255 255 255 / 66%);
	line-height: var(--ssa-line-height-text);
}

.ssa-slide-process-visual {
	position: relative;
	width: 100%;
	height: 580px;
	overflow: hidden;
	border-radius: var(--ssa-radius-30);
	background: url("../images/main4/slide-process-bg.jpg") center / cover no-repeat;
	display: grid;
	place-items: center;
	grid-column: 1;
	grid-row: 1;
}

.ssa-slide-process-visual > .ssa-slide-process-frame,
.ssa-slide-process-visual > .ssa-slide-process-status {
	display: none;
}

.ssa-slide-process-visual > .ssa-slide-process-frame-3 {
	display: block;
	z-index: 8;
	pointer-events: none;
}

.ssa-slide-process-visual > .ssa-slide-process-status {
	display: grid;
	z-index: 9;
	opacity: 0;
}

.ssa-slide-process-demo {
	--ssa-process-flow-duration: 3s;
	width: 100%;
	height: 100%;
	min-height: 0;
	border-radius: 0;
	background: transparent;
	animation: ssa-hero-demo-before-render 3s ease both;
}

.ssa-slide-active .ssa-slide-process-frame-3 {
	animation: ssa-hero-rendering-board 3s ease both;
}

.ssa-slide-active .ssa-slide-process-status {
	animation: ssa-hero-rendering-status 3s ease both;
}

.ssa-slide-active .ssa-slide-process-status span:nth-child(1) {
	animation: ssa-hero-board-label-1 3s ease both;
}

.ssa-slide-active .ssa-slide-process-status span:nth-child(2) {
	animation: ssa-hero-board-label-2 3s ease both;
}

.ssa-slide-active .ssa-slide-process-status span:nth-child(3) {
	animation: ssa-hero-board-label-3 3s ease both;
}

.ssa-slide-active .ssa-slide-process-status span:nth-child(4) {
	animation: ssa-hero-board-label-4 3s ease both;
}

.ssa-slide-active .ssa-slide-process-status span:nth-child(5) {
	animation: ssa-hero-board-label-5 3s ease both;
}

.ssa-process-flow-script,
.ssa-process-flow-editor,
.ssa-process-flow-sns {
	position: absolute;
	inset: 0;
	opacity: 0;
}

.ssa-process-flow-script {
	display: grid;
	align-content: center;
	gap: var(--ssa-space-xs);
	padding: var(--ssa-space-lg);
	background: color-mix(in srgb, var(--ssa-color-black) 78%, transparent);
}

.ssa-process-flow-script i {
	display: block;
	height: var(--ssa-space-2xs);
	border-radius: var(--ssa-radius-full);
	background: var(--ssa-color-white);
}

.ssa-process-flow-script i:nth-child(2) {
	width: 82%;
}

.ssa-process-flow-script i:nth-child(3) {
	width: 92%;
}

.ssa-process-flow-script i:nth-child(4) {
	width: 62%;
}

.ssa-process-flow-editor {
	display: grid;
	grid-template-rows: 1fr auto;
	gap: var(--ssa-space-xs);
	padding: var(--ssa-space-sm);
	background: #f2eff8;
}

.ssa-process-flow-editor > img {
	width: 100%;
	height: 100%;
	min-height: 0;
	object-fit: cover;
	border-radius: var(--ssa-radius-15);
}

.ssa-process-flow-editor > span {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: var(--ssa-gap-xs);
}

.ssa-process-flow-editor > span i {
	height: var(--ssa-space-md);
	border-radius: var(--ssa-radius-15);
	background: var(--ssa-main-gradient-w);
}

.ssa-process-flow-sns {
	display: grid;
	place-content: center;
	gap: var(--ssa-space-lg);
	background: var(--ssa-color-white);
	color: var(--ssa-color-black);
	text-align: center;
}

.ssa-process-flow-sns > span {
	display: flex;
	justify-content: center;
	gap: var(--ssa-gap-sm);
}

.ssa-process-flow-sns i {
	display: grid;
	place-items: center;
	width: var(--ssa-space-xl);
	aspect-ratio: 1;
	border-radius: var(--ssa-radius-full);
	background: color-mix(in srgb, var(--ssa-color-main) 18%, var(--ssa-color-white));
	color: var(--ssa-color-main);
}

.ssa-slide-process-demo .ssa-process-flow-wave {
	opacity: 0;
	animation: ssa-hero-render-wave 3s ease both;
}

.ssa-slide-process-demo .ssa-process-flow-script {
	animation: ssa-hero-render-script 3s ease both;
}

.ssa-slide-process-demo .ssa-process-flow-scenes {
	animation: ssa-hero-render-scenes 3s ease both;
}

.ssa-slide-process-demo .ssa-process-flow-editor {
	animation: ssa-hero-render-editor 3s ease both;
}

.ssa-slide-process-demo .ssa-process-flow-sns {
	animation: ssa-hero-render-sns 3s ease both;
}

.ssa-slide-process-demo .ssa-process-flow-timeline span {
	animation-delay: 0s;
	padding: var(--ssa-space-2xs) var(--ssa-space-xs);
}

.ssa-slide-process-demo .ssa-process-flow-timeline span:nth-child(1) {
	animation: ssa-hero-timeline-1 3s ease both;
}

.ssa-slide-process-demo .ssa-process-flow-timeline span:nth-child(2) {
	animation: ssa-hero-timeline-2 3s ease both;
}

.ssa-slide-process-demo .ssa-process-flow-timeline span:nth-child(3) {
	animation: ssa-hero-timeline-3 3s ease both;
}

.ssa-slide-process-demo .ssa-process-flow-timeline span:nth-child(4) {
	animation: ssa-hero-timeline-4 3s ease both;
}

.ssa-slide-process-demo .ssa-process-flow-timeline span:nth-child(5) {
	animation: ssa-hero-timeline-5 3s ease both;
}

.ssa-slide-process-demo .ssa-process-flow-phone {
	--ssa-process-flow-phone-width: min(64%, 360px);
	height: 96%;
	max-height: 560px;
}

.ssa-slide-process-demo .ssa-process-flow-track {
	position: relative;
	display: block;
	width: 100%;
	transform: none;
	animation: none;
}

.ssa-slide-process-demo .ssa-process-flow-page {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	transform: none;
}

.ssa-slide-process-demo .ssa-process-flow-shop {
	z-index: 3;
	animation: ssa-hero-shop-out 3s cubic-bezier(.76, 0, .24, 1) both;
}

.ssa-slide-process-demo .ssa-process-flow-register {
	z-index: 2;
	animation: ssa-hero-register-scene 3s ease both;
}

.ssa-slide-process-demo .ssa-process-flow-making {
	z-index: 1;
	animation: ssa-hero-making-scene 3s ease both;
}

.ssa-slide-process-demo .ssa-process-flow-timeline {
	flex-wrap: wrap;
	gap: var(--ssa-gap-xs);
}

.ssa-slide-process-frame {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	opacity: 0;
	transform: translateX(var(--ssa-space-lg)) scale(.985);
	will-change: opacity, transform;
}

.ssa-slide-process-frame > img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
}

.ssa-slide-process-cursor {
	position: absolute;
	z-index: 3;
	width: clamp(24px, 3vw, 38px);
	height: auto;
	opacity: 0;
	filter: drop-shadow(0 2px 2px rgb(0 0 0 / 22%));
	transform-origin: left top;
}

.ssa-slide-process-cursor-copy {
	left: 52%;
	top: 69%;
}

.ssa-slide-process-cursor-register {
	left: 56%;
	top: 66%;
}

.ssa-slide-active .ssa-slide-process-cursor-copy {
	animation: ssa-slide-process-copy-click var(--ssa-slide-process-duration) ease both;
}

.ssa-slide-active .ssa-slide-process-cursor-register {
	animation: ssa-slide-process-register-click var(--ssa-slide-process-duration) ease both;
}

.ssa-slide-active .ssa-slide-process-frame-3 > img {
	animation: ssa-slide-process-render var(--ssa-slide-process-duration) ease both;
}

.ssa-slide-process-frame-3::after {
	position: absolute;
	left: 8%;
	right: 8%;
	bottom: var(--ssa-space-lg);
	height: var(--ssa-space-3xs);
	border-radius: var(--ssa-radius-full);
	background: var(--ssa-main-gradient-w);
	content: "";
	transform: scaleX(0);
	transform-origin: left;
}

.ssa-slide-active .ssa-slide-process-frame-3::after {
	animation: ssa-slide-process-render-progress var(--ssa-slide-process-duration) ease both;
}

.ssa-slide-process-status {
	position: absolute;
	left: 50%;
	bottom: var(--ssa-space-sm);
	z-index: 5;
	display: grid;
	place-items: center;
	min-width: min(76%, 390px);
	min-height: calc(var(--ssa-font-size-sm) * 2.8);
	padding: var(--ssa-space-xs) var(--ssa-space-md);
	border-radius: var(--ssa-radius-full);
	background: color-mix(in srgb, var(--ssa-color-black) 84%, transparent);
	color: var(--ssa-color-white);
	font-size: var(--ssa-font-size-sm);
	font-weight: 700;
	box-shadow: 0 var(--ssa-space-xs) var(--ssa-space-lg) rgb(20 18 28 / 15%);
	transform: translateX(-50%);
}

.ssa-slide-process-status span {
	position: absolute;
	opacity: 0;
	transform: translateY(var(--ssa-space-xs));
}

.ssa-slide-active .ssa-slide-process-status span:nth-child(6) {
	animation: ssa-slide-process-status-6 var(--ssa-slide-process-duration) ease both;
}

.ssa-slide-active .ssa-slide-process-frame-1 {
	animation: ssa-slide-process-frame-1 var(--ssa-slide-process-duration) ease both;
}

.ssa-slide-active .ssa-slide-process-frame-2 {
	animation: ssa-slide-process-frame-2 var(--ssa-slide-process-duration) ease both;
}

.ssa-slider[data-ssa-slide="0"] .ssa-slide-tabs {
	border-color: rgb(255 255 255 / 16%);
	background: rgb(17 17 22 / 78%);
}

.ssa-slider[data-ssa-slide="0"] .ssa-slide-tab {
	color: var(--ssa-color-white);
}

.ssa-slider[data-ssa-slide="0"] .ssa-slide-tab + .ssa-slide-tab {
	border-color: rgb(255 255 255 / 16%);
}

.ssa-slide-process-visual .ssa-hero-scene-register {
	padding-inline: clamp(18px, 2.2vw, 28px);
}

.ssa-slide-process-visual .ssa-hero-register-form {
	gap: clamp(11px, 1.2vw, 16px);
	margin-top: clamp(42px, 5.2vw, 62px);
	padding: clamp(18px, 2vw, 26px) 0 clamp(52px, 6vw, 74px);
	background: #020202;
}

.ssa-slide-process-visual .ssa-hero-register-form > b {
	color: var(--ssa-color-white);
	font-size: clamp(12px, 1.15vw, 16px);
}

.ssa-slide-process-visual .ssa-hero-register-form > div {
	position: relative;
	display: flex;
	align-items: center;
	min-height: clamp(58px, 6.3vw, 76px);
	padding: clamp(13px, 1.5vw, 18px);
	border: clamp(2px, .25vw, 3px) solid #733cff;
	border-radius: clamp(18px, 2vw, 25px);
	background: #050506;
	box-shadow: 0 0 0 3px rgb(115 60 255 / 12%),
		0 0 30px rgb(115 60 255 / 24%);
	color: #7957ff;
}

.ssa-slide-process-visual .ssa-hero-register-form > div span {
	font-size: clamp(16px, 1.75vw, 23px);
}

.ssa-hero-paste-badge {
	position: absolute;
	right: 10px;
	top: -28px;
	z-index: 3;
	padding: 5px 9px;
	border: 1px solid rgb(255 255 255 / 14%);
	border-radius: var(--ssa-radius-full);
	background: rgb(35 35 40 / 96%);
	box-shadow: 0 7px 18px rgb(0 0 0 / 28%);
	color: var(--ssa-color-white);
	font-size: clamp(9px, .75vw, 11px);
	font-style: normal;
	font-weight: 700;
	opacity: 0;
	animation: ssa-hero-paste-badge var(--ssa-hero-duration) ease infinite;
}

.ssa-slide-process-visual .ssa-hero-register-form button {
	min-height: clamp(52px, 5.7vw, 68px);
	border-radius: clamp(15px, 1.7vw, 21px);
	background: linear-gradient(100deg, #4e39ff 0%, #a94dff 100%);
	box-shadow: 0 12px 28px rgb(91 57 255 / 24%);
	color: var(--ssa-color-white);
	font-size: clamp(14px, 1.35vw, 18px);
}

.ssa-slide-process .ssa-hero-phone-logo,
.ssa-slide-trend .ssa-trend-logo {
	color: #b86cff;
}

.ssa-slide-process-visual .ssa-hero-scene-render {
	padding-top: clamp(64px, 7vw, 84px);
	padding-inline: clamp(18px, 2.2vw, 28px);
}

.ssa-hero-render-heading {
	display: flex;
	align-items: center;
	justify-content: space-between;
	margin-bottom: clamp(14px, 1.6vw, 20px);
	color: var(--ssa-color-white);
}

.ssa-hero-render-heading b {
	font-size: clamp(16px, 1.55vw, 21px);
}

.ssa-hero-render-heading strong {
	color: #7646ff;
	font-size: clamp(14px, 1.4vw, 19px);
}

.ssa-slide-process-visual .ssa-hero-render-media {
	aspect-ratio: 1.04;
	border-radius: clamp(26px, 2.8vw, 36px);
}

.ssa-slide-process-visual .ssa-hero-render-media img {
	width: 86%;
	height: 86%;
}

.ssa-slide-process-visual .ssa-hero-render-progress {
	height: clamp(7px, .75vw, 10px);
	margin-top: clamp(18px, 2vw, 26px);
}

.ssa-slide-process-visual .ssa-hero-render-progress > b {
	color: var(--ssa-color-white);
	font-size: clamp(10px, .9vw, 13px);
}

.ssa-slide-process-visual .ssa-hero-render-labels {
	display: none;
}

.ssa-slide-process-visual .ssa-hero-upload-status {
	color: var(--ssa-color-white);
	margin-top: 25px;
}


/* Ä«µå ¿ÜÇüÀº ±âÁ¸ .ssa-process-box ½ºÅ¸ÀÏ À¯Áö */
.ssa-root .ssa-sns-card {
    display: grid;
    place-items: center;
}

/* À§ 1°³ / ¾Æ·¡ 2°³ */
.ssa-root .ssa-sns-card-icons {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 8%;
    width: 52%;
    max-width: 340px;
    aspect-ratio: 1;
}

.ssa-root .ssa-sns-card-tile {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    min-width: 0;
    aspect-ratio: 1;
    border-radius: 20%;
    background: #fff;
}

/* ƽÅåÀº À­ÁÙ Áß¾Ó */
.ssa-root .ssa-sns-card-tiktok {
    grid-column: 1 / -1;
    justify-self: center;
    width: 46%;
    gap: 8px;
}

.ssa-root .ssa-sns-card-tiktok > i {
    font-size: clamp(30px, 5vw, 60px);
    color: #111;
    text-shadow: -2px -1px #25f4ee, 2px 1px #fe2c55;
}

.ssa-root .ssa-sns-card-tiktok > strong {
    color: #111;
    font-family: Arial, sans-serif;
    font-size: clamp(13px, 2vw, 24px);
    font-weight: 800;
    line-height: 1;
}

.ssa-root .ssa-sns-card-youtube > i {
    color: #ff0033;
    font-size: clamp(40px, 7vw, 84px);
}

.ssa-root .ssa-sns-card-instagram > i {
    font-size: clamp(44px, 7vw, 88px);
    background: linear-gradient(
        30deg,
        #ffcf00 5%,
        #ff7a00 25%,
        #ff0069 50%,
        #d300c5 75%,
        #7638fa 100%
    );
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    color: transparent;
}


.ssa-slide-trend .ssa-trend-logo {
	display: none;
}

.ssa-slide-trend .ssa-trend-categories {
	margin-top: clamp(42px, 5vw, 58px);
	padding: clamp(12px, 1.35vw, 17px) clamp(8px, 1vw, 12px) 0;
	border: 0;
	border-radius: clamp(10px, 1.2vw, 15px);
	background: #242427;
	color: #99999f;
	font-weight: 700;
}

.ssa-slide-trend .ssa-trend-categories b {
	color: var(--ssa-color-white);
}

.ssa-slide-trend .ssa-trend-categories b::after {
	display: none;
}

.ssa-slide-trend .ssa-trend-heading {
	margin-top: clamp(22px, 2.5vw, 30px);
	color: var(--ssa-color-white);
}

.ssa-slide-trend .ssa-trend-heading > span {
	color: #8d8d94;
}

.ssa-slide-trend .ssa-trend-list {
	margin-top: clamp(9px, 1vw, 13px);
}

.ssa-slide-trend .ssa-trend-row {
	padding-inline: clamp(13px, 1.5vw, 18px);
	border-radius: clamp(12px, 1.4vw, 18px);
	color: var(--ssa-color-white);
}

.ssa-slide-trend .ssa-trend-row > b,
.ssa-slide-trend .ssa-trend-row > small {
	color: var(--ssa-color-white);
}

.ssa-slide-trend .ssa-trend-row-first > b span:first-child,
.ssa-slide-trend .ssa-trend-row-rising > b span:last-child {
	color: var(--ssa-color-black);
}

.ssa-slide-trend .ssa-trend-row mark {
	background: #ff6b24;
	color: var(--ssa-color-white);
}

.ssa-slide-trend .ssa-trend-row mark.ssa-is-live {
	background: linear-gradient(135deg, #e7ff74 0%, #baff6a 100%);
	box-shadow: 0 5px 14px rgb(184 255 96 / 24%);
	color: #10110d;
}

.ssa-slide-trend .ssa-trend-up {
	color: #78ffbd;
	filter: drop-shadow(0 0 5px rgb(120 255 189 / 42%));
}

.ssa-slider .ssa-slide-tabs .ssa-slide-tab,
.ssa-slider[data-ssa-slide="0"] .ssa-slide-tabs .ssa-slide-tab,
.ssa-slider[data-ssa-slide="1"] .ssa-slide-tabs .ssa-slide-tab {
	border: 2px solid #71717a;
	background: #f5f5f6;
	box-shadow: none;
}

.ssa-slider .ssa-slide-tabs .ssa-slide-tab[aria-selected="true"],
.ssa-slider[data-ssa-slide="0"] .ssa-slide-tabs .ssa-slide-tab[aria-selected="true"],
.ssa-slider[data-ssa-slide="1"] .ssa-slide-tabs .ssa-slide-tab[aria-selected="true"] {
	border-color: #cfc2ff;
	background: #7447ff;
	box-shadow: 0 0 0 4px rgb(116 71 255 / 13%);
}

.ssa-hero-phone {
	position: relative;
	width: min(58%, 360px);
	aspect-ratio: .64;
	overflow: hidden;
	border: clamp(5px, .65vw, 10px) solid var(--ssa-color-black);
	border-bottom: 0;
	border-radius: var(--ssa-radius-50) var(--ssa-radius-50) 0 0;
	background: var(--ssa-color-white);
	box-shadow: 0 10px 24px rgb(20 18 28 / 7%),
		0 28px 64px rgb(20 18 28 / 11%);
	transform: translateY(20px);
}

.ssa-hero-phone-logo {
	position: absolute;
	left: 50%;
	top: clamp(24px, 4vw, 38px);
	z-index: 19;
	display: flex;
	align-items: center;
	gap: var(--ssa-gap-xs);
	color: var(--ssa-color-main);
	font-size: var(--ssa-font-size-lg);
	transform: translateX(-50%);
	animation: ssa-hero-logo var(--ssa-hero-duration) linear infinite;
}

.ssa-hero-scene {
	position: absolute;
	inset: 0;
	box-sizing: border-box;
	padding: clamp(62px, 9vw, 86px) var(--ssa-space-lg) var(--ssa-space-lg);
	background: var(--ssa-color-white);
	opacity: 0;
}

.ssa-hero-scene-copy {
	z-index: 4;
	animation: ssa-hero-cut-copy var(--ssa-hero-duration) cubic-bezier(.65, 0, .35, 1) infinite;
}

.ssa-hero-scene-register {
	z-index: 3;
	animation: ssa-hero-cut-register var(--ssa-hero-duration) cubic-bezier(.22, 1, .36, 1) infinite;
}

.ssa-hero-scene-render {
	z-index: 2;
	animation: ssa-hero-cut-render var(--ssa-hero-duration) cubic-bezier(.22, 1, .36, 1) infinite;
}

.ssa-hero-scene-complete {
	z-index: 1;
	animation: ssa-hero-cut-complete var(--ssa-hero-duration) cubic-bezier(.22, 1, .36, 1) infinite;
}

.ssa-hero-shop-brand {
	font-size: var(--ssa-font-size-xs);
	font-weight: 800;
	text-align: center;
}

.ssa-hero-shop-brand b {
	padding-inline: var(--ssa-space-3xs);
	background: #03a94f;
	color: var(--ssa-color-white);
}

.ssa-hero-shop-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: var(--ssa-gap-xs);
	margin-top: var(--ssa-space-lg);
}

.ssa-hero-shop-grid i {
	display: block;
	aspect-ratio: 1;
	border-radius: var(--ssa-radius-15);
	background: linear-gradient(145deg, #ececef, #d9d9dd);
}

.ssa-hero-product-card {
	position: absolute;
	left: 50%;
	top: 34%;
	width: 72%;
	box-sizing: border-box;
	padding: var(--ssa-space-md);
	border-radius: var(--ssa-radius-30);
	background: var(--ssa-color-white);
	box-shadow: 0 var(--ssa-space-sm) var(--ssa-space-2xl) rgb(20 18 28 / 18%);
	transform: translateX(-50%);
}

.ssa-hero-product-card img {
	display: block;
	width: 100%;
	height: clamp(112px, 15vw, 168px);
	object-fit: contain;
}

.ssa-hero-product-card span,
.ssa-hero-register-form button {
	display: block;
	width: 100%;
	box-sizing: border-box;
	margin-top: var(--ssa-space-sm);
	padding: var(--ssa-space-xs) var(--ssa-space-sm);
	border: 0;
	border-radius: var(--ssa-radius-full);
	background: #f26422;
	color: var(--ssa-color-white);
	font: inherit;
	font-size: var(--ssa-font-size-sm);
	font-weight: 700;
	text-align: center;
}

.ssa-hero-copy-button {
	position: relative;
	min-height: 42px;
}

.ssa-hero-copy-button b {
	position: absolute;
	inset: 0;
	z-index: 1;
	display: grid;
	place-items: center;
	font: inherit;
	opacity: 1;
}

.ssa-hero-register-form {
	display: grid;
	gap: var(--ssa-space-sm);
	margin-top: clamp(72px, 10vw, 112px);
}

.ssa-hero-register-form > b {
	font-size: var(--ssa-font-size-xs);
}

.ssa-hero-register-form > div {
	min-height: clamp(48px, 6vw, 64px);
	box-sizing: border-box;
	padding: var(--ssa-space-sm);
	border-radius: var(--ssa-radius-15);
	box-shadow: 0 0 var(--ssa-space-lg) rgb(20 18 28 / 8%);
	color: var(--ssa-color-main);
	font-size: var(--ssa-font-size-md);
	font-weight: 800;
}

.ssa-hero-register-form > div span {
	display: inline-block;
	overflow: hidden;
	white-space: nowrap;
	animation: ssa-hero-url-paste var(--ssa-hero-duration) cubic-bezier(.22, 1, .36, 1) infinite;
}

.ssa-hero-register-form button {
	position: relative;
	margin-top: 0;
	border-radius: var(--ssa-radius-15);
	background: var(--ssa-sub-gradient-w);
	animation: ssa-hero-register-press var(--ssa-hero-duration) ease infinite;
}

.ssa-hero-render-media {
	position: relative;
	display: grid;
	place-items: center;
	width: 100%;
	aspect-ratio: 1;
	overflow: hidden;
	background: #fff;
}

.ssa-hero-render-media img {
	display: block;
	width: 78%;
	height: 78%;
	object-fit: contain;
}

.ssa-hero-scan {
	position: absolute;
	left: 0;
	top: 5%;
	width: 100%;
	height: 3px;
	background: var(--ssa-main-gradient-w);
	box-shadow: 0 0 var(--ssa-space-sm) var(--ssa-color-main);
	opacity: 0;
	animation: ssa-hero-camera-scan var(--ssa-hero-duration) ease-in-out infinite;
}

.ssa-hero-render-progress {
	position: relative;
	height: var(--ssa-space-xs);
	margin-top: var(--ssa-space-md);
	border-radius: var(--ssa-radius-full);
	background: #e1e5df;
}

.ssa-hero-render-progress > i {
	display: block;
	width: 100%;
	height: 100%;
	border-radius: inherit;
	background: var(--ssa-main-gradient-w);
	transform: scaleX(0);
	transform-origin: left;
}

.ssa-hero-render-progress > b {
	position: absolute;
	right: 0;
	top: calc(100% + var(--ssa-space-2xs));
	font-size: var(--ssa-font-size-xss);
}

.ssa-hero-render-labels {
	position: absolute;
	left: 50%;
	bottom: var(--ssa-space-sm);
	width: max-content;
	transform: translateX(-50%);
}

.ssa-hero-render-labels span {
	position: absolute;
	left: 50%;
	bottom: 0;
	width: max-content;
	padding: var(--ssa-space-xs) var(--ssa-space-sm);
	border-radius: var(--ssa-radius-full);
	background: var(--ssa-color-black);
	color: var(--ssa-color-white);
	font-size: var(--ssa-font-size-xss);
	font-weight: 700;
	opacity: 0;
	transform: translate(-50%, var(--ssa-space-xs));
}

.ssa-hero-render-labels span:nth-child(1) {
	animation: ssa-hero-label-1 var(--ssa-hero-duration) ease infinite;
}

.ssa-hero-render-labels span:nth-child(2) {
	animation: ssa-hero-label-2 var(--ssa-hero-duration) ease infinite;
}

.ssa-hero-render-labels span:nth-child(3) {
	animation: ssa-hero-label-3 var(--ssa-hero-duration) ease infinite;
}

.ssa-hero-render-labels span:nth-child(4) {
	animation: ssa-hero-label-4 var(--ssa-hero-duration) ease infinite;
}

.ssa-hero-complete-media {
	position: relative;
	width: 100%;
	aspect-ratio: 1.1;
	overflow: hidden;
	border-radius: var(--ssa-radius-15);
}

.ssa-hero-complete-media img {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	opacity: 0;
	transform: scale(.97);
	animation: ssa-hero-complete-image var(--ssa-hero-duration) ease infinite;
}

.ssa-hero-complete-media strong {
	position: absolute;
	background: Red;
	font-size: var(--ssa-font-size-sm);
	opacity: 0;
	transform: translateY(var(--ssa-space-xs));
	animation: ssa-hero-complete-title var(--ssa-hero-duration) ease infinite;
}

.ssa-hero-complete-play {
	position: absolute;
	left: 50%;
	top: 50%;
	z-index: 2;
	display: grid;
	place-items: center;
	width: clamp(48px, 7vw, 66px);
	aspect-ratio: 1;
	border: 1px solid rgb(255 255 255 / 70%);
	border-radius: var(--ssa-radius-full);
	background: rgb(255 255 255 / 88%);
	box-shadow: 0 var(--ssa-space-xs) var(--ssa-space-lg) rgb(0 0 0 / 20%);
	color: var(--ssa-color-black);
	opacity: 0;
	transform: translate(-50%, -50%) scale(.72);
	animation: ssa-hero-complete-play var(--ssa-hero-duration) cubic-bezier(.22, 1, .36, 1) infinite;
}

.ssa-hero-complete-play i {
	margin-left: .12em;
	font-size: clamp(16px, 2.4vw, 22px);
}

.ssa-hero-complete-media video {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.ssa-hero-scene-complete p {
	position: relative;
	min-height: 1.5em;
	margin: var(--ssa-space-lg) 0 var(--ssa-space-sm);
	font-size: var(--ssa-font-size-sm);
	font-weight: 700;
	text-align: center;
}

.ssa-hero-upload-status span {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	opacity: 0;
	font-size: var(--ssa-font-size-sm);
}

.ssa-hero-upload-status span:first-child {
	animation: ssa-hero-uploading var(--ssa-hero-duration) ease infinite;
}

.ssa-hero-upload-status span:last-child {
	animation: ssa-hero-uploaded var(--ssa-hero-duration) ease infinite;
}

.ssa-hero-sns {
	display: flex;
	justify-content: center;
	gap: var(--ssa-gap-sm);
}

.ssa-hero-sns > span {
	position: relative;
	display: grid;
	place-items: center;
	width: var(--ssa-space-xl);
	aspect-ratio: 1;
	border-radius: var(--ssa-radius-full);
	background: #FFF;
}

.ssa-hero-sns b {
	position: absolute;
	right: calc(var(--ssa-space-3xs) * -1);
	top: calc(var(--ssa-space-3xs) * -1);
	display: grid;
	place-items: center;
	width: var(--ssa-space-sm);
	aspect-ratio: 1;
	border-radius: var(--ssa-radius-full);
	background: var(--ssa-color-main);
	color: var(--ssa-color-white);
	font-size: 10px;
	opacity: 0;
	transform: scale(.4);
}

.ssa-hero-sns b i {
	font-size: 10px;
}

.ssa-hero-sns span:nth-child(1) b {
	animation: ssa-hero-sns-check var(--ssa-hero-duration) 0s ease infinite;
}

.ssa-hero-sns span:nth-child(2) b {
	animation: ssa-hero-sns-check var(--ssa-hero-duration) .08s ease infinite;
}

.ssa-hero-sns span:nth-child(3) b {
	animation: ssa-hero-sns-check var(--ssa-hero-duration) .16s ease infinite;
}

.ssa-hero-sns span:nth-child(4) b {
	animation: ssa-hero-sns-check var(--ssa-hero-duration) .24s ease infinite;
}

.ssa-hero-button-cursor {
	position: absolute;
	left: 72%;
	top: 52%;
	z-index: 5;
	width: clamp(22px, 3vw, 32px);
	filter: drop-shadow(0 2px 2px rgb(0 0 0 / 22%));
	opacity: 0;
	pointer-events: none;
}

.ssa-hero-copy-cursor {
	animation: ssa-hero-copy-pointer var(--ssa-hero-duration) ease infinite;
}

.ssa-hero-register-cursor {
	animation: ssa-hero-register-pointer var(--ssa-hero-duration) ease infinite;
}

.ssa-slide-trend {
	--ssa-trend-duration: 8s;
	color: var(--ssa-color-black);
	text-align: left;
}

.ssa-slide-trend .ssa-title {
	margin: 0;
	color: var(--ssa-color-black);
	text-shadow: none;
}

.ssa-slide-trend .ssa-title-description {
	margin-top: var(--ssa-space-lg);
	color: var(--ssa-color-sub-text);
	line-height: var(--ssa-line-height-text);
}

.ssa-slide-process .ssa-title-description strong {
	color: var(--ssa-color-black) !important;
	font-weight: 600;
	display: block;
}

.ssa-slide-trend .ssa-title-description strong {
	color: var(--ssa-color-black) !important;
	font-weight: 600;
	display: block;
}

.ssa-slider[data-ssa-slide="1"] .ssa-slide-tabs {
	border-color: var(--ssa-color-border);
	background: color-mix(in srgb, var(--ssa-color-white) 76%, transparent);
}

.ssa-slider[data-ssa-slide="1"] .ssa-slide-tab {
	color: var(--ssa-color-black);
}

.ssa-slider[data-ssa-slide="1"] .ssa-slide-tab + .ssa-slide-tab {
	border-color: var(--ssa-color-border);
}

.ssa-trend-phone {
	box-sizing: border-box;
	padding: clamp(28px, 4vw, 42px) clamp(18px, 2.4vw, 28px);
}

.ssa-trend-logo {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--ssa-gap-xs);
	color: var(--ssa-color-main);
	font-size: clamp(18px, 2.2vw, 26px);
}

.ssa-trend-categories {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	margin-top: clamp(34px, 5vw, 54px);
	border-bottom: 1px solid var(--ssa-color-border);
	color: var(--ssa-color-gray);
	font-size: clamp(12px, 1.2vw, 15px);
	text-align: center;
}

.ssa-trend-categories > * {
	position: relative;
	padding-bottom: var(--ssa-space-xs);
}

.ssa-trend-categories b {
	color: var(--ssa-color-black);
}

.ssa-trend-categories b::after {
	position: absolute;
	left: 0;
	right: 0;
	bottom: -1px;
	height: 3px;
	background: var(--ssa-color-black);
	content: "";
}

.ssa-trend-heading {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: var(--ssa-gap-xs);
	margin-top: var(--ssa-space-lg);
	font-size: clamp(11px, 1.2vw, 15px);
}

.ssa-trend-heading > span {
	display: flex;
	align-items: center;
	gap: var(--ssa-gap-2xs);
	color: var(--ssa-color-gray);
	white-space: nowrap;
}

.ssa-trend-list {
	position: relative;
	margin: var(--ssa-space-xs) 0 0;
	padding: 0;
	list-style: none;
}

.ssa-trend-row {
	position: relative;
	z-index: 1;
	display: grid;
	grid-template-columns: 24px minmax(0, 1fr) auto auto 18px;
	align-items: center;
	height: clamp(44px, 5.4vw, 54px);
	box-sizing: border-box;
	padding: 0 var(--ssa-space-xs);
	border-radius: var(--ssa-radius-10);
	font-size: clamp(12px, 1.28vw, 16px);
	opacity: 0;
}

.ssa-trend-row > * {
	position: relative;
	z-index: 1;
}

.ssa-trend-row > b {
	position: relative;
	height: 1.3em;
	color: var(--ssa-color-gray-dark);
}

.ssa-trend-row-first > b span:first-child,
.ssa-trend-row-rising > b span:last-child {
	color: #f26422;
}

.ssa-trend-row > b span {
	position: absolute;
	inset: 0;
}

.ssa-trend-row > b span:last-child {
	opacity: 0;
}

.ssa-trend-row > strong {
	overflow: hidden;
	font-weight: 700;
	text-overflow: ellipsis;
	white-space: nowrap;
}

.ssa-trend-row > small {
	grid-column: 4;
	color: var(--ssa-color-gray-dark);
	font-size: .88em;
	white-space: nowrap;
}

.ssa-trend-row em {
	font-style: normal;
}

.ssa-trend-up {
	grid-column: 5;
	color: var(--ssa-color-main);
	font-style: normal;
	font-weight: 900;
	opacity: 0;
}

.ssa-trend-row mark {
	position: relative;
	grid-column: 3;
	grid-row: 1;
	z-index: 3;
	margin-right: var(--ssa-space-2xs);
	padding: var(--ssa-space-2xs) var(--ssa-space-xs);
	border-radius: var(--ssa-radius-10);
	background: #ff6b24;
	color: var(--ssa-color-white);
	font-size: .84em;
	font-weight: 800;
	opacity: 0;
	transform: scale(.85);
}

.ssa-trend-row mark.ssa-is-live {
	background: var(--ssa-sub-gradient-w);
	box-shadow: 0 var(--ssa-space-2xs) var(--ssa-space-sm) rgb(111 66 255 / 20%);
}

.ssa-trend-row-rising::after {
	position: absolute;
	inset: 3px 0;
	z-index: 0;
	border-radius: var(--ssa-radius-10);
	background: linear-gradient(100deg, transparent 0%, rgb(117 38 245 / 10%) 36%, rgb(255 107 36 / 16%) 54%, transparent 82%);
	background-position: 140% 0;
	background-size: 240% 100%;
	content: "";
	opacity: 0;
}

.ssa-slide-active .ssa-trend-heading .fa-clock {
	animation: ssa-trend-clock var(--ssa-trend-duration) ease-in-out infinite;
}

.ssa-slide-active .ssa-trend-row-first {
	animation: ssa-trend-first var(--ssa-trend-duration) cubic-bezier(.22, 1, .36, 1) infinite;
}

.ssa-slide-active .ssa-trend-row-rising {
	animation: ssa-trend-rising var(--ssa-trend-duration) cubic-bezier(.22, 1, .36, 1) infinite;
}

.ssa-slide-active .ssa-trend-row-third {
	animation: ssa-trend-row-third var(--ssa-trend-duration) ease infinite;
}

.ssa-slide-active .ssa-trend-row-fourth {
	animation: ssa-trend-row-fourth var(--ssa-trend-duration) ease infinite;
}

.ssa-slide-active .ssa-trend-row-fifth {
	animation: ssa-trend-row-fifth var(--ssa-trend-duration) ease infinite;
}

.ssa-slide-active .ssa-trend-row-first > b span:first-child,
.ssa-slide-active .ssa-trend-row-rising > b span:first-child {
	animation: ssa-trend-rank-old var(--ssa-trend-duration) ease infinite;
}

.ssa-slide-active .ssa-trend-row-first > b span:last-child,
.ssa-slide-active .ssa-trend-row-rising > b span:last-child {
	animation: ssa-trend-rank-new var(--ssa-trend-duration) ease infinite;
}

.ssa-slide-active .ssa-trend-up {
	animation: ssa-trend-up var(--ssa-trend-duration) ease infinite;
}

.ssa-slide-active .ssa-trend-row-rising::after {
	animation: ssa-trend-highlight var(--ssa-trend-duration) ease infinite;
}

.ssa-slide-active .ssa-trend-row-rising mark {
	animation: ssa-trend-badge var(--ssa-trend-duration) cubic-bezier(.22, 1, .36, 1) infinite;
}

.ssa-slide-active .ssa-trend-row-first mark {
	animation: ssa-trend-first-badge var(--ssa-trend-duration) ease infinite;
}

.ssa-slide-process,
.ssa-slide-trend {
	color: var(--ssa-color-black);
}

.ssa-slide-process-visual .ssa-hero-phone {
	box-sizing: border-box;
	border-bottom: 0;
	border-radius: clamp(46px, 5vw, 62px) clamp(46px, 5vw, 62px) 0 0;
	box-shadow: 0 0 0 2px rgb(255 255 255 / 7%) inset,
		0 24px 58px rgb(3 5 14 / 34%);
	border-color: #08090b;
}

.ssa-hero-phone-status {
	position: absolute;
	left: 0;
	top: 0;
	z-index: 40;
	display: flex;
	align-items: center;
	justify-content: space-between;
	box-sizing: border-box;
	width: 100%;
	height: clamp(34px, 4vw, 46px);
	padding: 0 clamp(13px, 1.5vw, 19px);
	color: #161616;
	font-size: clamp(8px, .72vw, 11px);
	font-style: normal;
	pointer-events: none;
}

.ssa-hero-phone-status span {
	position: absolute;
	right: 0%;
	top: clamp(7px, .8vw, 10px);
	transform: translateX(-50%);
	font-size: .98em;
	letter-spacing: 1px;
}

.ssa-slide-process-visual .ssa-hero-phone-logo,
.ssa-slide-process-visual .ssa-trend-logo {
	top: clamp(48px, 5.2vw, 66px);
}

.ssa-slide-process-visual .ssa-hero-scene {
	padding-top: clamp(82px, 10.5vw, 108px);
}

.ssa-slide-trend .ssa-slide-process-visual {
	background: url("../images/main4/slide-trend-bg.jpg") center / cover no-repeat;
}

.ssa-slide-process .ssa-title,
.ssa-slide-trend .ssa-title {
	color: var(--ssa-color-black);
	font-size: clamp(38px, 3.6vw, 58px);
	line-height: 1.2;
}

.ssa-slide-process .ssa-title-description,
.ssa-slide-trend .ssa-title-description {
	color: var(--ssa-color-sub-text);
	font-size: clamp(15px, 1.15vw, 18px);
	line-height: 1.7;
}

.ssa-slide-process-copy .ssa-slide-cta {
	padding-left: 0;
	background: transparent;
}

.ssa-slide-tab + .ssa-slide-tab {
	border-left-width: 2px;
}

.ssa-slide-tab[aria-selected="true"] {
	background: var(--ssa-color-white);
	box-shadow: 0 0 0 3px rgb(255 255 255 / 16%);
}

.ssa-slider[data-ssa-slide="0"] .ssa-slide-tabs,
.ssa-slider[data-ssa-slide="1"] .ssa-slide-tabs {
	border: 0;
	background: transparent;
}

.ssa-slider[data-ssa-slide="0"] .ssa-slide-tab,
.ssa-slider[data-ssa-slide="1"] .ssa-slide-tab {
	border-color: rgb(255 255 255 / 82%);
	color: transparent;
}

.ssa-slider-pause {
	display: grid;
	place-items: center;
	width: 30px;
	height: 30px;
	margin-left: 4px;
	border: 1px solid rgb(255 255 255 / 46%);
	border-radius: var(--ssa-radius-full);
	background: rgb(17 17 22 / 34%);
	color: var(--ssa-color-white);
	font-size: 11px;
	backdrop-filter: blur(8px);
}

.ssa-slider :focus-visible {
	outline: 2px solid var(--ssa-color-white);
	outline-offset: -5px;
}

.ssa-inner-a > .ssa-slider,
.ssa-inner-a > .ssa-slider .ssa-slide-process,
.ssa-inner-a > .ssa-slider .ssa-slide-trend {
	background: transparent;
}

.ssa-inner-a > .ssa-slider {
	border-radius: 0;
}

.ssa-slide-process-visual .ssa-hero-phone,
.ssa-slide-process-visual .ssa-hero-scene {
	background: #08090b;
}

.ssa-slide-process-visual .ssa-hero-scene .ssa-trend-logo {
	width: 100px;
	display: block;
	margin: 0 auto;
}

.ssa-slide-process-visual .ssa-hero-phone-status {
	color: var(--ssa-color-white);
}

.ssa-slide-process-visual .ssa-hero-phone-status i {
	background: #000;
}

.ssa-slide-process-visual .ssa-hero-phone-logo,
.ssa-slide-process-visual .ssa-trend-logo,
.ssa-slide-process-visual .ssa-hero-register-form > b,
.ssa-slide-process-visual .ssa-trend-categories,
.ssa-slide-process-visual .ssa-trend-categories b,
.ssa-slide-process-visual .ssa-trend-heading,
.ssa-slide-process-visual .ssa-trend-row,
.ssa-slide-process-visual .ssa-trend-row > small {
	color: var(--ssa-color-white);
}

.ssa-slide-process-visual .ssa-trend-categories {
	border-bottom-color: rgb(255 255 255 / 18%);
}

.ssa-slide-process-visual .ssa-trend-row-rising::after {
	background: linear-gradient(90deg, rgb(111 66 255 / 24%), rgb(255 124 52 / 22%));
}

.ssa-slide-process-visual .ssa-hero-scene-copy {
	padding-top: clamp(48px, 5.4vw, 66px);
	padding-inline: clamp(14px, 2vw, 24px);
}

.ssa-slide-process-visual .ssa-hero-shop-brand {
	position: relative;
	z-index: 2;
	width: fit-content;
	margin: 0 auto;
	padding: clamp(13px, 1.5vw, 18px) clamp(18px, 2.1vw, 26px);
	background: #020202;
	color: var(--ssa-color-white);
	font-size: clamp(13px, 1.2vw, 18px);
}

.ssa-slide-process-visual .ssa-hero-shop-brand b {
	margin-right: 3px;
	background: #78f532;
	color: #050505;
}

.ssa-slide-process-visual .ssa-hero-shop-grid {
	gap: clamp(8px, 1vw, 12px);
	margin-top: clamp(18px, 2vw, 28px);
	opacity: .72;
}

.ssa-slide-process-visual .ssa-hero-shop-grid i {
	position: relative;
	border: 1px solid rgb(255 255 255 / 8%);
	border-radius: 0;
	background: linear-gradient(rgb(0 0 0 / 8%), rgb(0 0 0 / 8%)),
		#e7e7e8 url("../assets/process-retro-camera.png") center 36% / 78% auto no-repeat;
}

.ssa-slide-process-visual .ssa-hero-shop-grid i:nth-child(2) {
	filter: grayscale(1) brightness(1.18);
}

.ssa-slide-process-visual .ssa-hero-shop-grid i:nth-child(3) {
	filter: sepia(.55) saturate(.9);
}

.ssa-slide-process-visual .ssa-hero-shop-grid i:nth-child(4) {
	filter: grayscale(.72) brightness(1.32);
}

.ssa-slide-process-visual .ssa-hero-shop-grid i::after {
	position: absolute;
	left: 7%;
	right: 7%;
	bottom: 8%;
	height: 12%;
	border-radius: var(--ssa-radius-full);
	background: linear-gradient(#b8b8bb 0 0) left top / 78% 4px no-repeat,
		linear-gradient(#ceced0 0 0) left bottom / 52% 4px no-repeat;
	content: "";
}

.ssa-slide-process-visual .ssa-hero-product-card {
	top: 23%;
	z-index: 3;
	width: 70%;
	padding: clamp(13px, 1.6vw, 20px);
	border-radius: clamp(30px, 3.2vw, 42px);
	box-shadow: 0 22px 56px rgb(0 0 0 / 34%);
}

.ssa-hero-product-image {
	display: grid;
	place-items: center;
	box-sizing: border-box;
	min-height: clamp(102px, 11.5vw, 140px);
	border: 2px solid #ededee;
	border-radius: clamp(17px, 1.8vw, 24px);
}

.ssa-hero-product-card .ssa-hero-product-image img {
	width: 76%;
	height: clamp(86px, 9.8vw, 120px);
}

.ssa-hero-product-meta {
	display: grid;
	gap: 6px;
	margin: clamp(12px, 1.4vw, 18px) 6px 0;
}

.ssa-hero-product-meta i {
	display: block;
	height: clamp(5px, .55vw, 7px);
	border-radius: var(--ssa-radius-full);
	background: #c8c8ca;
}

.ssa-hero-product-meta i:first-child {
	width: 82%;
}

.ssa-hero-product-meta i:last-child {
	width: 56%;
}

.ssa-slide-process-visual .ssa-hero-copy-button {
	min-height: clamp(46px, 5vw, 62px);
	margin-top: clamp(14px, 1.6vw, 20px);
	font-size: clamp(13px, 1.25vw, 17px);
}

.ssa-slider .ssa-slide-tabs {
	bottom: clamp(52px, 5.6vw, 76px);
}

.ssa-slider .ssa-slide-tab,
.ssa-slider[data-ssa-slide="0"] .ssa-slide-tab,
.ssa-slider[data-ssa-slide="1"] .ssa-slide-tab {
	border-color: rgb(23 23 29 / 52%);
	background: rgb(23 23 29 / 24%);
}

.ssa-slider .ssa-slide-tab[aria-selected="true"] {
	border-color: #6f42ff;
	background: #6f42ff;
	box-shadow: 0 0 0 4px rgb(111 66 255 / 16%);
}

.ssa-slider .ssa-slider-pause {
	border-color: rgb(255 255 255 / 32%);
	background: rgb(10 10 13 / 82%);
	box-shadow: 0 6px 16px rgb(0 0 0 / 18%);
}

.ssa-swiper-ready .ssa-slide:not(.ssa-slide-active) .ssa-title,
.ssa-swiper-ready .ssa-slide:not(.ssa-slide-active) .ssa-title-description,
.ssa-swiper-ready .ssa-slide:not(.ssa-slide-active) .ssa-slide-cta {
	visibility: hidden;
}

/* ÷ºÎÇÑ TABLET ±¸°£ºÎÅÍ KEYFRAMES ³¡±îÁö ±³Ã¼ÇÏ´Â Àüü ¼öÁ¤º» */
/* ==================== TABLET <= 1024px ==================== */
@media (max-width: 1024px) {
  .ssa-main-content { padding-top: 0; }
}

/* ==================== MOBILE <= 768px ==================== */
@media (max-width: 768px) {
  .ssa-root .ssa-main-content {
    margin-top: 0;
    padding-bottom: 0
  }

	 .ssa-root .ssa-inner-a:has(> .ssa-slider) {
    display: flow-root;
    padding-bottom: clamp(56px, 12vw, 80px);
  }

  .ssa-root .ssa-inner-a > .ssa-slider {
    height: auto;
    max-height: none;
    flex-shrink: 0;
  }

  .ssa-root .ssa-inner-a > .ssa-slider,
  .ssa-root .ssa-slider {
    height: auto;
    min-height: 0;
    max-height: none;
    padding-bottom:var(--ssa-space-3xl);
    box-sizing: border-box;
  }

  .ssa-root .ssa-slide-panels {
    height: auto;
    align-items: stretch;
  }

  .ssa-root .ssa-slide.ssa-slide-process,
  .ssa-root .ssa-slide.ssa-slide-trend {
    height: auto;
    min-height: 0;
    max-height: none;
    margin-top: 0;
    padding: 100px 0 0;
    align-items: stretch;
    justify-content: flex-start;
    box-sizing: border-box;
  }

  .ssa-root .ssa-slide .ssa-slide-process-layout {
    display: grid;
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto;
    align-content: start;
    align-items: start;
    gap: 32px;
    width: 100%;
    height: auto;
    min-height: 0;
    padding: 0;
    margin: 0;
    box-sizing: border-box;
  }

  .ssa-root .ssa-slide .ssa-slide-process-copy {
    position: relative;
    inset: auto;
    grid-column: 1;
    grid-row: 1;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 0;
    width: 100%;
    height: auto;
    min-height: 0;
    padding: 0 4px;
    text-align: center;
    box-sizing: border-box;
  }

  .ssa-root .ssa-slide.ssa-slide-process .ssa-title,
  .ssa-root .ssa-slide.ssa-slide-trend .ssa-title {
    margin: 0;
    font-size: clamp(28px, 7.2vw, 36px);
    line-height: 1.3;
    letter-spacing: -0.04em;
    word-break: keep-all;
    overflow-wrap: anywhere;
  }

  .ssa-root .ssa-slide.ssa-slide-process .ssa-title-description,
  .ssa-root .ssa-slide.ssa-slide-trend .ssa-title-description {
    width: 100%;
    max-width: 34ch;
    margin: 20px auto 0;
    font-size: 16px;
    line-height: 1.8;
    color: #595959;
    word-break: keep-all;
    overflow-wrap: anywhere;
  }

  .ssa-root .ssa-slide .ssa-title-description strong {
    font-size: 17px;
    line-height: 1.7;
    color: #222;
  }

  .ssa-root .ssa-slide .ssa-slide-process-copy .ssa-slide-cta {
    position: relative;
    inset: auto;
    flex: none;
    align-self: center;
    justify-content: center;
    gap: 12px;
    min-height: 48px;
    margin: 24px auto 0;
    padding: 8px 12px 8px 20px;
    font-size: 15px;
    line-height: 1.4;
    box-sizing: border-box;
  }

  .ssa-root .ssa-slide .ssa-slide-cta span {
    flex: 0 0 32px;
    width: 32px;
    height: 32px;
    font-size: 18px;
  }

  .ssa-root .ssa-slide .ssa-slide-process-visual {
    position: relative;
    inset: auto;
    grid-column: 1;
    grid-row: 2;
    width: 100%;
    height: clamp(430px, 118vw, 560px);
    min-height: 430px;
    max-height: none;
    margin: 0;
    overflow: hidden;
    border-radius: 28px;
    box-sizing: border-box;
  }

  .ssa-root .ssa-slide-process-visual .ssa-hero-phone {
    position: absolute;
    left: 50%;
    right: auto;
    top: 24px;
    bottom: auto;
    width: min(86%, 360px);
    height: calc(100% + 32px);
    min-width: 0;
    margin: 0;
    transform: translateX(-50%);
    border-width: 7px;
    border-bottom-width: 0;
    border-radius: 38px 38px 0 0;
    box-sizing: border-box;
  }


  .ssa-root .ssa-slide-process-visual .ssa-hero-phone-status {
    position: absolute;
    inset: 0 0 auto;
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    gap: 12px;
    width: 100%;
    height: 34px;
    padding: 0 14px;
    box-sizing: border-box;
  }

  /* ½Ã°£ */
  .ssa-root .ssa-slide-process-visual .ssa-hero-phone-status > b {
    position: static;
    grid-column: 1;
    grid-row: 1;
    width: auto;
    margin: 0;
    font-size: 11px;
    white-space: nowrap;
  }

  /* °¡¿îµ¥ Ä«¸Þ¶ó */
  .ssa-root .ssa-slide-process-visual .ssa-hero-phone-status > i {
    position: absolute;
    left: 50%;
    right: auto;
    top: 7px;
    width: 54px;
    height: 15px;
    margin: 0;
    transform: translateX(-50%);
  }

  /* Åë½Å¡¤¿ÍÀÌÆÄÀÌ¡¤¹èÅ͸® ¹­À½ */
  .ssa-root .ssa-slide-process-visual .ssa-hero-phone-status > span {
    position: static;
    grid-column: 2;
    grid-row: 1;
    justify-self: end;
    display: flex;
    align-items: center;
    justify-content: flex-end;
    gap: 5px;
    width: max-content;
    min-width: 0;
    margin: 0;
	margin-right:-15px;
    padding: 0;
    white-space: nowrap;
    line-height: 1;
  }

  /* ¾ÆÀÌÄÜ¿¡ Àû¿ëµÈ °øÅë ³Êºñ¡¤À§Ä¡ ÃʱâÈ­ */
  .ssa-root .ssa-slide-process-visual .ssa-hero-phone-status > span > * {
    position: static;
    flex: 0 0 auto;
    width: auto;
    min-width: 0;
    max-width: none;
    margin: 0;
    transform: none;
  }


  .ssa-root .ssa-slide-trend .ssa-trend-row {
    min-height: 46px;
    height: 46px;
    padding: 10px 8px;
    border-radius: 11px;
    font-size: 14px;
    line-height: 1.5;
    box-sizing: border-box;
  }

  .ssa-root .ssa-slide-trend .ssa-trend-row mark {
    font-size: 12px;
    padding: 3px 6px;
  }

  .ssa-root .ssa-slide-trend .ssa-trend-list {
    margin-top: 10px;
    gap: 0;
  }

  .ssa-root .ssa-slider .ssa-slide-tabs,
  .ssa-root .ssa-slider[data-ssa-slide] .ssa-slide-tabs {
    position: absolute;
    left: 24px;
    right: auto;
    top: auto;
    bottom: 10px;
    display: flex;
    align-items: center;
    gap: 4px;
    width: auto;
    height: 44px;
    padding: 0 6px;
    border: 0;
    border-radius: 999px;
    background: #242128;
    z-index: 5;

	display:none
  }

  .ssa-root .ssa-slider[data-ssa-slide] .ssa-slide-tabs .ssa-slide-tab {
    position: relative;
    flex: 0 0 44px;
    width: 44px;
    min-width: 44px;
    max-width: 44px;
    height: 44px;
    min-height: 44px;
    max-height: 44px;
    padding: 0;
    border: 0;
    border-radius: 50%;
    background: radial-gradient(circle, transparent 3px, #fff 3px, #fff 5px, transparent 5px);
  }

  .ssa-root .ssa-slider[data-ssa-slide] .ssa-slide-tabs .ssa-slide-tab[aria-selected="true"] {
    background: radial-gradient(circle, #fff 0 5px, transparent 5px);
  }

  .ssa-root .ssa-slider .ssa-slide-tab::before {
    display: none;
  }

  .ssa-root .ssa-slider .ssa-slider-pause {
    flex: 0 0 44px;
    width: 44px;
    min-width: 44px;
    height: 44px;
    min-height: 44px;
    margin: 0;
    padding: 0;
    color: #fff;
  }

  /* ¸ñ¾÷ ³»ºÎ Àå¸é: ±âÁ¸ ±¸¼º À¯Áö */
  .ssa-slide-process-visual .ssa-hero-register-form {
		margin-top: 34px;
		padding: 16px 0 48px;
	  }

  .ssa-slide-process-visual .ssa-hero-register-form > div {
		min-height: 52px;
		border-radius: 16px;
	  }

  .ssa-slide-process-visual .ssa-hero-register-form > div span {
		font-size: 16px;
	  }

  .ssa-hero-paste-badge {
		top: -25px;
		font-size: 11px;
	  }

  .ssa-slide-process-visual .ssa-hero-register-form button {
		min-height: 48px;
		font-size: 13px;
	  }

  .ssa-slide-process-visual .ssa-hero-scene-render {
		padding-top: 54px;
		padding-inline: 14px;
	  }

  .ssa-hero-render-heading {
		margin-bottom: 12px;
	  }

  .ssa-hero-render-heading b {
		font-size: 14px;
	  }

  .ssa-hero-render-heading strong {
		font-size: 13px;
	  }

  .ssa-slide-process-visual .ssa-hero-render-media {
		border-radius: 24px;
	  }

  .ssa-slide-trend .ssa-trend-categories {
		margin-top: 34px;
		padding: 10px 6px 0;
	  }

  .ssa-slide-trend .ssa-trend-heading {
		margin-top: 16px;
	  }

  .ssa-trend-phone {
		padding: clamp(22px, 6vw, 30px) clamp(13px, 4vw, 18px);
	  }

  .ssa-hero-phone-status i {
		top: 7px;
		width: 54px;
		height: 15px;
	  }

  .ssa-slide-process-visual .ssa-hero-phone-logo, .ssa-slide-process-visual .ssa-trend-logo {
		top: 43px;
	  }

  .ssa-slide-process-visual .ssa-hero-scene {
		padding-top: 72px;
	  }

  .ssa-slide-process-visual .ssa-hero-shop-brand {
		padding: 10px 14px;
		font-size: 13px;
	  }

  .ssa-slide-process-visual .ssa-hero-product-card {
		top: 24%;
		width: 72%;
		padding: 12px;
		border-radius: 28px;
	  }

  .ssa-hero-product-image {
		min-height: 88px;
		border-radius: 16px;
	  }

  .ssa-hero-product-card .ssa-hero-product-image img {
		height: 78px;
	  }

  .ssa-slide-process-visual .ssa-hero-copy-button {
		min-height: 44px;
		font-size: 13px;
	  }

  .ssa-root .ssa-slider-container {
		padding-inline: var(--ssa-space-xs);
	  }

  .ssa-slider-background {
		object-position: 62% center;
	  }

	.ssa-slide-cta{
		margin:30px auto 0;
	}


}

@media (max-width: 768px) {
  /* ½½¶óÀÌ´õ Àüü ³ôÀÌ ÀÚµ¿ */
  .ssa-root .ssa-inner-a > .ssa-slider {
    height: auto;
    min-height: 0;
    max-height: none;
  }

  .ssa-root .ssa-slider .ssa-slide-panels {
    height: auto;
    min-height: 0;
    align-items: flex-start;
  }

  /* °³º° ½½¶óÀÌµå ³ôÀÌ ÀÚµ¿ */
  .ssa-root .ssa-slider .ssa-slide {
    height: auto;
    min-height: 0;
    max-height: none;
    margin-top: 0;
  }

  /* ÅؽºÆ®¿Í ¸ñ¾÷À» ³»¿ë ¼ø¼­´ë·Î ¹èÄ¡ */
  .ssa-root .ssa-slide .ssa-slide-process-layout {
    height: auto;
    min-height: 0;
    max-height: none;
    grid-template-rows: auto auto;
    align-items: start;
    gap: 32px;
  }

  .ssa-root .ssa-slide .ssa-slide-process-copy {
    height: auto;
    min-height: 0;
    max-height: none;
  }

  /* ´ÙÀ½ ¼½¼Ç°ú °£°Ý */
  .ssa-root .ssa-inner-a:has(> .ssa-slider) {
    display: flow-root;
    padding-bottom: clamp(56px, 12vw, 80px);
  }
}

/* ==================== ACCESSIBILITY / REDUCED MOTION ==================== */
@media (prefers-reduced-motion: reduce) {
  .ssa-slide-process-frame-1,
  .ssa-slide-process-frame-2 { display: none; }

  .ssa-slide-process-frame-3 { opacity: 1; transform: none; }

  .ssa-slide.ssa-slide-active .ssa-slide-line,
  .ssa-slide.ssa-slide-active .ssa-title-description,
  .ssa-slide.ssa-slide-active .ssa-slide-cta { animation: none; }

  .ssa-slider-background,
  .ssa-slider-shade,
  .ssa-slide-tab,
  .ssa-slide-tab::before { transition: none; }
}

/* ==================== KEYFRAMES ==================== */
@keyframes ssa-hero-demo-before-render {
	0%, 55% { opacity: 1; }
	61%, 100% { opacity: 0; }
}

@keyframes ssa-hero-rendering-board {
	0%, 55% {
		opacity: 0;
		transform: translateY(var(--ssa-space-sm)) scale(.985);
	}

	61%, 100% {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

@keyframes ssa-hero-rendering-status {
	0%, 57% { opacity: 0; }
	61%, 100% { opacity: 1; }
}

@keyframes ssa-hero-board-label-1 {
	0%, 58%, 69%, 100% { opacity: 0; transform: translateY(var(--ssa-space-xs)); }
	61%, 67% { opacity: 1; transform: translateY(0); }
}

@keyframes ssa-hero-board-label-2 {
	0%, 66%, 77%, 100% { opacity: 0; transform: translateY(var(--ssa-space-xs)); }
	69%, 75% { opacity: 1; transform: translateY(0); }
}

@keyframes ssa-hero-board-label-3 {
	0%, 74%, 85%, 100% { opacity: 0; transform: translateY(var(--ssa-space-xs)); }
	77%, 83% { opacity: 1; transform: translateY(0); }
}

@keyframes ssa-hero-board-label-4 {
	0%, 82%, 93%, 100% { opacity: 0; transform: translateY(var(--ssa-space-xs)); }
	85%, 91% { opacity: 1; transform: translateY(0); }
}

@keyframes ssa-hero-board-label-5 {
	0%, 90% { opacity: 0; transform: translateY(var(--ssa-space-xs)); }
	94%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes ssa-hero-render-wave {
	0%, 57%, 65%, 100% { opacity: 0; }
	59%, 63% { opacity: 1; }
}

@keyframes ssa-hero-render-script {
	0%, 63%, 73%, 100% { opacity: 0; transform: translateY(var(--ssa-space-xs)); }
	66%, 71% { opacity: 1; transform: translateY(0); }
}

@keyframes ssa-hero-render-scenes {
	0%, 71%, 82%, 100% { opacity: 0; transform: translateY(var(--ssa-space-xs)); }
	74%, 80% { opacity: 1; transform: translateY(0); }
}

@keyframes ssa-hero-render-editor {
	0%, 80%, 91%, 100% { opacity: 0; transform: translateY(var(--ssa-space-xs)); }
	83%, 89% { opacity: 1; transform: translateY(0); }
}

@keyframes ssa-hero-render-sns {
	0%, 88% { opacity: 0; transform: scale(.96); }
	92%, 100% { opacity: 1; transform: scale(1); }
}

@keyframes ssa-hero-timeline-1 {
	0%, 57%, 67%, 100% { opacity: .25; transform: translateY(var(--ssa-space-xs)); }
	59%, 65% { opacity: 1; color: var(--ssa-color-main); transform: translateY(0); }
}

@keyframes ssa-hero-timeline-2 {
	0%, 64%, 75%, 100% { opacity: .25; transform: translateY(var(--ssa-space-xs)); }
	67%, 73% { opacity: 1; color: var(--ssa-color-main); transform: translateY(0); }
}

@keyframes ssa-hero-timeline-3 {
	0%, 72%, 83%, 100% { opacity: .25; transform: translateY(var(--ssa-space-xs)); }
	75%, 81% { opacity: 1; color: var(--ssa-color-main); transform: translateY(0); }
}

@keyframes ssa-hero-timeline-4 {
	0%, 80%, 92%, 100% { opacity: .25; transform: translateY(var(--ssa-space-xs)); }
	83%, 90% { opacity: 1; color: var(--ssa-color-main); transform: translateY(0); }
}

@keyframes ssa-hero-timeline-5 {
	0%, 89% { opacity: .25; transform: translateY(var(--ssa-space-xs)); }
	92%, 100% { opacity: 1; color: var(--ssa-color-main); transform: translateY(0); }
}

@keyframes ssa-hero-shop-out {
	0%, 23% {
		opacity: 1;
		transform: translateX(0);
	}

	31%, 100% {
		opacity: 0;
		transform: translateX(108%);
	}
}

@keyframes ssa-hero-register-scene {
	0%, 22% {
		opacity: 0;
		transform: scale(.985);
	}

	29%, 53% {
		opacity: 1;
		transform: scale(1);
	}

	58%, 100% {
		opacity: 0;
	}
}

@keyframes ssa-hero-making-scene {
	0%, 53% {
		opacity: 0;
		transform: translateY(var(--ssa-space-xs));
	}

	59%, 100% {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes ssa-slide-process-frame-1 {
	0% {
		opacity: 0;
		transform: translateX(var(--ssa-space-lg)) scale(.985);
	}

	4%, 25% {
		opacity: 1;
		transform: translateX(0) scale(1);
	}

	29%, 100% {
		opacity: 0;
		transform: translateX(calc(var(--ssa-space-lg) * -1)) scale(.985);
	}
}

@keyframes ssa-slide-process-frame-2 {
	0%, 27% {
		opacity: 0;
		transform: translateX(var(--ssa-space-lg)) scale(.985);
	}

	32%, 55% {
		opacity: 1;
		transform: translateX(0) scale(1);
	}

	60%, 100% {
		opacity: 0;
		transform: translateX(calc(var(--ssa-space-lg) * -1)) scale(.985);
	}
}

@keyframes ssa-slide-process-frame-3 {
	0%, 58% {
		opacity: 0;
		transform: translateX(var(--ssa-space-lg)) scale(.985);
	}

	64%, 100% {
		opacity: 1;
		transform: translateX(0) scale(1);
	}
}

@keyframes ssa-slide-process-copy-click {
	0%, 4%, 24%, 100% {
		opacity: 0;
		transform: translate(var(--ssa-space-lg), var(--ssa-space-md)) scale(1);
	}

	8%, 18% {
		opacity: 1;
		transform: translate(0, 0) scale(1);
	}

	13% {
		opacity: 1;
		transform: translate(0, 0) scale(.78);
	}
}

@keyframes ssa-slide-process-register-click {
	0%, 31%, 57%, 100% {
		opacity: 0;
		transform: translate(var(--ssa-space-lg), var(--ssa-space-md)) scale(1);
	}

	36%, 52% {
		opacity: 1;
		transform: translate(0, 0) scale(1);
	}

	47% {
		opacity: 1;
		transform: translate(0, 0) scale(.78);
	}
}

@keyframes ssa-slide-process-render {
	0%, 58% {
		filter: saturate(.72);
		transform: scale(.98) translateX(1.5%);
	}

	100% {
		filter: saturate(1);
		transform: scale(1.02) translateX(-1.5%);
	}
}

@keyframes ssa-slide-process-render-progress {
	0%, 60% {
		transform: scaleX(0);
	}

	100% {
		transform: scaleX(1);
	}
}

@keyframes ssa-slide-process-status-1 {
	0%, 4%, 25%, 100% { opacity: 0; transform: translateY(var(--ssa-space-xs)); }
	7%, 22% { opacity: 1; transform: translateY(0); }
}

@keyframes ssa-slide-process-status-2 {
	0%, 27%, 57%, 100% { opacity: 0; transform: translateY(var(--ssa-space-xs)); }
	31%, 54% { opacity: 1; transform: translateY(0); }
}

@keyframes ssa-slide-process-status-3 {
	0%, 58%, 68%, 100% { opacity: 0; transform: translateY(var(--ssa-space-xs)); }
	61%, 66% { opacity: 1; transform: translateY(0); }
}

@keyframes ssa-slide-process-status-4 {
	0%, 66%, 76%, 100% { opacity: 0; transform: translateY(var(--ssa-space-xs)); }
	69%, 74% { opacity: 1; transform: translateY(0); }
}

@keyframes ssa-slide-process-status-5 {
	0%, 74%, 86%, 100% { opacity: 0; transform: translateY(var(--ssa-space-xs)); }
	77%, 84% { opacity: 1; transform: translateY(0); }
}

@keyframes ssa-slide-process-status-6 {
	0%, 83%, 100% { opacity: 0; transform: translateY(var(--ssa-space-xs)); }
	87%, 98% { opacity: 1; transform: translateY(0); }
}

@keyframes ssa-hero-paste-badge {
	0%, 21.5%, 28.5%, 100% {
		opacity: 0;
		transform: translateY(5px) scale(.9);
	}

	23%, 26.5% {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

@keyframes ssa-hero-cut-copy {
	0%, 16% {
		opacity: 1;
		transform: translateX(0);
	}

	21.6%, 100% {
		opacity: 0;
		transform: translateX(-108%);
	}
}

@keyframes ssa-hero-cut-register {
	0%, 16.8% {
		opacity: 0;
		transform: translateY(var(--ssa-space-sm)) scale(.985);
	}

	21.6%, 34.4% {
		opacity: 1;
		transform: translateY(0) scale(1);
	}

	38.4%, 100% {
		opacity: 0;
		transform: translateY(calc(var(--ssa-space-xs) * -1)) scale(1);
	}
}

@keyframes ssa-hero-cut-render {
	0%, 34.4% {
		opacity: 0;
		transform: translateY(var(--ssa-space-sm)) scale(.985);
	}

	39.2%, 60.8% {
		opacity: 1;
		transform: translateY(0) scale(1);
	}

	64.8%, 100% {
		opacity: 0;
		transform: translateY(calc(var(--ssa-space-xs) * -1)) scale(1);
	}
}

@keyframes ssa-hero-cut-complete {
	0%, 60.8% {
		opacity: 0;
		transform: translateY(var(--ssa-space-sm)) scale(.985);
	}

	65.6%, 100% {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

@keyframes ssa-hero-logo {
	0%, 19.2% { opacity: 0; }
	23.2%, 34.4% { opacity: 1; }
	38.4%, 100% { opacity: 0; }
}

@keyframes ssa-hero-url-paste {
	0%, 25% {
		opacity: 0;
		transform: translateY(var(--ssa-space-xs)) scale(.98);
	}

	26.5%, 100% {
		opacity: 1;
		transform: translateY(0) scale(1);
	}
}

@keyframes ssa-hero-register-press {
	0%, 29.6%, 37.6%, 100% { transform: scale(1); filter: brightness(1); }
	33.6% { transform: scale(.94); filter: brightness(.82); }
}

@keyframes ssa-hero-camera-scan {
	0%, 38.4% { top: 5%; opacity: 0; }
	39.2% { top: 5%; opacity: 1; }
	46% { top: 88%; opacity: 1; }
	52.8% { top: 5%; opacity: 1; }
	53.6%, 100% { top: 5%; opacity: 0; }
}

@keyframes ssa-hero-gauge {
	0%, 38.4% { transform: scaleX(.01); }
	52.8%, 100% { transform: scaleX(1); }
}

@keyframes ssa-hero-label-1 {
	0%, 38.4%, 44.8%, 100% { opacity: 0; }
	40%, 43.2% { opacity: 1; transform: translate(-50%, 0); }
}

@keyframes ssa-hero-label-2 {
	0%, 43.2%, 50.4%, 100% { opacity: 0; }
	45.6%, 48.8% { opacity: 1; transform: translate(-50%, 0); }
}

@keyframes ssa-hero-label-3 {
	0%, 48.8%, 56%, 100% { opacity: 0; }
	51.2%, 54.4% { opacity: 1; transform: translate(-50%, 0); }
}

@keyframes ssa-hero-label-4 {
	0%, 54.4%, 62.4%, 100% { opacity: 0; }
	56.8%, 60.8% { opacity: 1; transform: translate(-50%, 0); }
}

@keyframes ssa-hero-complete-image {
	0%, 64% { opacity: 0; transform: scale(.97); }
	66.4%, 100% { opacity: 1; transform: scale(1); }
}

@keyframes ssa-hero-complete-title {
	0%, 67.2% { opacity: 0; transform: translateY(var(--ssa-space-xs)); }
	69.6%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes ssa-hero-complete-play {
	0%, 66.4% {
		opacity: 0;
		transform: translate(-50%, -50%) scale(.72);
	}

	69.2%, 100% {
		opacity: 1;
		transform: translate(-50%, -50%) scale(1);
	}
}

@keyframes ssa-hero-uploading {
	0%, 69.6%, 75.2%, 100% { opacity: 0; transform: translateY(var(--ssa-space-xs)); }
	71.2%, 73.6% { opacity: 1; transform: translateY(0); }
}

@keyframes ssa-hero-uploaded {
	0%, 74.4% { opacity: 0; transform: translateY(var(--ssa-space-xs)); }
	76.8%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes ssa-hero-sns-check {
	0%, 75.2% { opacity: 0; transform: scale(.4); }
	78%, 100% { opacity: 1; transform: scale(1); }
}

@keyframes ssa-hero-copy-pointer {
	0%, 4.8%, 14.4%, 100% {
		opacity: 0;
		transform: translate(18px, 18px) scale(1);
	}

	7.2%, 8.8%, 12% {
		opacity: 1;
		transform: translate(0, 0) scale(1);
	}

	10% {
		opacity: 1;
		transform: translate(0, 0) scale(.76);
	}
}

@keyframes ssa-hero-register-pointer {
	0%, 24%, 36%, 100% {
		opacity: 0;
		transform: translate(18px, 18px) scale(1);
	}

	27.2%, 31.2%, 34.4% {
		opacity: 1;
		transform: translate(0, 0) scale(1);
	}

	32.8% {
		opacity: 1;
		transform: translate(0, 0) scale(.76);
	}
}

@keyframes ssa-trend-clock {
	0%, 18%, 30%, 100% { transform: rotate(0); }
	22% { transform: rotate(22deg); }
	26% { transform: rotate(-10deg); }
}

@keyframes ssa-trend-first {
	0% { opacity: 0; transform: translateY(-10px); }
	6%, 45% { opacity: 1; background: linear-gradient(100deg, #9632f4 0%, #5c00ff 100%); transform: translateY(0); }
	58%, 100% { opacity: 1; background: transparent; transform: translateY(100%); }
}

@keyframes ssa-trend-rising {
	0%, 4% { opacity: 0; transform: translateY(-10px); }
	10%, 45% { opacity: 1; background: transparent; transform: translateY(0); }
	58%, 100% { opacity: 1; background: linear-gradient(100deg, #9632f4 0%, #5c00ff 100%); transform: translateY(-100%); }
}

@keyframes ssa-trend-row-third {
	0%, 8% { opacity: 0; transform: translateY(-10px); }
	14%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes ssa-trend-row-fourth {
	0%, 12% { opacity: 0; transform: translateY(-10px); }
	18%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes ssa-trend-row-fifth {
	0%, 16% { opacity: 0; transform: translateY(-10px); }
	22%, 100% { opacity: 1; transform: translateY(0); }
}

@keyframes ssa-trend-rank-old {
	0%, 49% { opacity: 1; }
	53%, 100% { opacity: 0; }
}

@keyframes ssa-trend-rank-new {
	0%, 49% { opacity: 0; }
	53%, 100% { opacity: 1; }
}

@keyframes ssa-trend-up {
	0%, 34% { opacity: 0; transform: translateY(5px); }
	39%, 68% { opacity: 1; transform: translateY(0); }
	72%, 100% { opacity: 0; transform: translateY(-3px); }
}

@keyframes ssa-trend-highlight {
	0%, 57% { opacity: 0; background-position: 140% 0; }
	60% { opacity: 1; }
	69% { opacity: 1; background-position: -40% 0; }
	73%, 100% { opacity: 0; background-position: -40% 0; }
}

@keyframes ssa-trend-badge {
	0%, 62% { opacity: 0; transform: scale(.85); }
	65% { opacity: 1; transform: scale(1.08); }
	68%, 100% { opacity: 1; transform: scale(1); }
}

@keyframes ssa-trend-first-badge {
	0%, 4% { opacity: 0; transform: scale(.85); }
	7%, 45% { opacity: 1; transform: scale(1); }
	52%, 100% { opacity: 0; transform: scale(.9); }
}

@keyframes ssa-slide-text-in {
	from {
		opacity:0;
		transform:translateY(22px);
		filter:blur(5px)
	}

	to {
		opacity:1;
		transform:translateY(0);
		filter:blur(0)
	}

}




























/* ==================== º»¹®°øÅë ==================== */
.ssa-title {
	font-size:var(--ssa-font-size-2xl);
	font-weight:700;
	line-height:var(--ssa-line-height-title);
	letter-spacing:-0.045em;
}

.ssa-card-title {
	font-size:var(--ssa-font-size-lg);
	font-weight:600;
	line-height:var(--ssa-line-height-title);
	letter-spacing:-0.045em;
}

.ssa-description{
	font-size: var(--ssa-font-size-sm);
    font-weight: 500;
	color:var(--ssa-color-sub-text)
}

.ssa-card_description{
	font-size: var(--ssa-font-size-xs);
    font-weight: 500;
	color:var(--ssa-color-sub-text)
}

.ssa-section-padding{
	padding-top:var(--ssa-space-3xl);
}

.ssa-section-padding-b{
	padding-bottom:var(--ssa-space-3xl);
}

@media (max-width:768px) {
	.ssa-title {
		font-size:var(--ssa-font-size-xl);
	}

	.ssa-card-title{
		font-size:var(--ssa-font-size-md);
	}

}


/* ==================== °í¹Î ¼½¼Ç : ½ºÅ©·Ñ °íÁ¤ / ¸»Ç³¼± ==================== */
.ssa-concerns {
	--ssa-concerns-scroll-distance:700px;
	--ssa-concerns-bubble-width:clamp(220px, 16.3vw, 320px);
	--ssa-concerns-shadow:0 16px 48px rgb(25 16 45 / 7%);
	position:relative;
	height: 220vh;
	background:var(--ssa-color-white);
}

.ssa-concerns-sticky {
	position:sticky;
	top:0;
	height:100svh;
	min-height:620px;
}

.ssa-concerns-stage {
	position:relative;
	height:100%;
	box-sizing:border-box;
}

.ssa-concerns .ssa-title {
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%, -50%);
	width:calc(100% - var(--ssa-space-xl));
	margin:0;
	color:var(--ssa-color-black);
	text-align:center;
	word-break:keep-all;

}

.ssa-concerns-bubbles {
	margin:0;
	padding:0;
	list-style:none;
}

.ssa-concerns-bubble {
	position:absolute;
	display:flex;
	align-items:center;
	justify-content:center;
	width:var(--ssa-concerns-bubble-width);
	min-height:70px;
	box-sizing:border-box;
	padding:var(--ssa-space-sm) var(--ssa-space-xs);
	border-radius:var(--ssa-radius-15);
	background:var(--ssa-color-white);
	box-shadow:var(--ssa-concerns-shadow);
	color:var(--ssa-color-black);
	font-size:var(--ssa-font-size-xs);
	font-weight:700;
	line-height:var(--ssa-line-height-title);
	text-align:center;
	word-break:keep-all;
	transform:translate(-50%, -50%);
	transition:opacity .5s ease, transform .6s cubic-bezier(.22, 1, .36, 1);
}

.ssa-concerns-bubble:nth-child(1) {
	top:23%;
	left:27%;
}

.ssa-concerns-bubble:nth-child(2) {
	top:29%;
	left:51%;
}

.ssa-concerns-bubble:nth-child(3) {
	top:21%;
	left:75%;
}

.ssa-concerns-bubble:nth-child(4) {
	top:68%;
	left:27%;
}

.ssa-concerns-bubble:nth-child(5) {
	top:84%;
	left:51%;
}

.ssa-concerns-bubble:nth-child(6) {
	top:71%;
	left:75%;
}

/* JS ½ÇÇà ½Ã¿¡¸¸ ¼û±è : ½ºÅ©·ÑÀ» µÇµ¹¸®¸é ¿ª¼øÀ¸·Î »ç¶óÁý´Ï´Ù. */
.ssa-concerns-ready .ssa-concerns-bubble {
	opacity:0;
	transform:translate(-50%, calc(-50% + 24px)) scale(.96);
}

.ssa-concerns-ready .ssa-concerns-bubble.ssa-is-visible {
	opacity:1;
	transform:translate(-50%, -50%) scale(1);
}

/* ==================== °í¹Î ¼½¼Ç : ÅÂºí¸´ / ¸ð¹ÙÀÏ ==================== */
@media (max-width:1024px) {
	.ssa-concerns {
		--ssa-concerns-bubble-width:28%;
	}

	.ssa-concerns-bubble:nth-child(1),
	.ssa-concerns-bubble:nth-child(4) {
		left:18%;
	}

	.ssa-concerns-bubble:nth-child(3),
	.ssa-concerns-bubble:nth-child(6) {
		left:82%;
	}
}

@media (max-width:768px) {
	.ssa-concerns {
		height:auto;
		min-height:0;
		padding:0 0 var(--ssa-space-3xl) 0;

	}

	.ssa-concerns-sticky {
		position:relative;
		height:auto;
		min-height:0;
	}

	.ssa-concerns-stage {
		height:auto;
		overflow:visible;
	}

	.ssa-concerns .ssa-title {
		position:static;
		width:100%;
		margin:0 0 var(--ssa-space-xl);
		transform:none;
	}

	.ssa-concerns-bubbles {
		display:flex;
		flex-direction:column;
		align-items:center;
		gap:var(--ssa-gap-md);
		width:100%;
	}

	.ssa-concerns .ssa-concerns-bubble {
		position:relative;
		top:auto;
		left:auto;
		width:100%;
		min-height:70px;
		margin:0;
		padding:var(--ssa-space-md);
		transform:none;
	}

	.ssa-concerns-ready .ssa-concerns-bubble {
		transform:translateY(24px);
	}

	.ssa-concerns-ready .ssa-concerns-bubble.ssa-is-visible {
		transform:none;
	}
}

@media (prefers-reduced-motion:reduce) {
	.ssa-concerns {
		height:auto;
		min-height:0;
	}

	.ssa-concerns-sticky {
		position:relative;
	}

	.ssa-concerns-ready .ssa-concerns-bubble {
		opacity:1;
		transform:translate(-50%, -50%);
		transition:none;
	}
}


/* ==================== ¸µÅ© ¡æ ¼îÃ÷ : ÆäÀÌÁö Àü¿ë ¼³Á¤ ==================== */
.ssa-link-story {
	--ssa-link-bg:#0e0e0e;
	--ssa-link-muted:#454545;
	--ssa-link-line:rgb(255 255 255 / 14%);
	--ssa-link-card-width:clamp(130px, 14vw, 260px);
	--ssa-link-scroll:360svh;
	position:relative;
	background:var(--ssa-link-bg);
	color:var(--ssa-color-white);
}

.ssa-link-sticky {
	position:relative;
}

ssa-link-sticky

.ssa-link-stage {
	position:relative;
	box-sizing:border-box;
	padding-inline:var(--ssa-space-md);
}

.ssa-link-intro,
.ssa-link-result {
	position:relative;
	z-index:2;
	text-align:center;
}

.ssa-link-story .ssa-title {
	margin:0;
	color:var(--ssa-color-white);
	word-break:keep-all;
}

.ssa-link-type-line {
	display:block;
}

.ssa-link-type-char {
	color:var(--ssa-link-muted);
}

.ssa-link-type-char.ssa-is-typed {
	color:var(--ssa-color-white);
}

.ssa-link-type-char.ssa-is-cursor {
	box-shadow:2px 0 var(--ssa-color-white);
}

.ssa-link-demo {
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:var(--ssa-gap-sm);
	width:min(390px, 100%);
	box-sizing:border-box;
	margin:var(--ssa-space-xl) auto 0;
	padding:var(--ssa-space-2xs);
	padding-left:var(--ssa-space-lg);
	border-radius:var(--ssa-radius-full);
	background:var(--ssa-color-white);
	color:var(--ssa-main);
	font-size:var(--ssa-font-size-sm);
	font-weight:700;
}

.ssa-link-register {
	padding:var(--ssa-space-xs) var(--ssa-space-md);
	border-radius:var(--ssa-radius-full);
	background:var(--ssa-main);
	color:var(--ssa-color-white);
}

.ssa-link-result {
	margin-block:var(--ssa-space-3xl) var(--ssa-space-xl);
}

.ssa-link-result em {
	color:var(--ssa-color-main);
	font-style:normal;
}

.ssa-link-cards {
	display:grid;
	grid-template-columns:repeat(4, minmax(0, 1fr));
	gap:var(--ssa-gap-md);
}

.ssa-link-card {
	position:relative;
	margin:0;
	aspect-ratio:3 / 4;
	overflow:hidden;
	border-radius:var(--ssa-radius-50);
	background:var(--ssa-link-muted);
	isolation:isolate;
}

.ssa-link-card img,
.ssa-link-video {
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
}

.ssa-link-card-label {
	position:absolute;
	bottom:0;
	left:0;
	right:0;
	padding:var(--ssa-space-md) var(--ssa-space-sm) var(--ssa-space-sm);
	background:linear-gradient(transparent, rgb(0 0 0 / 55%));
	font-size:var(--ssa-font-size-xss);
	font-weight:700;
	pointer-events:none;
}

/* ==================== ¸µÅ© ¡æ ¼îÃ÷ : ½ºÅ©·Ñ ÇÏ´Ü Ãß°¡ Ä«µå ==================== */
.ssa-link-feed {
	margin-top:-1px;
	padding-block:var(--ssa-space-xl) var(--ssa-space-3xl);
	background:var(--ssa-link-bg, #0e0e0e);
	color:var(--ssa-color-white);
}

.ssa-link-feed-grid {
	display:grid;
	grid-template-columns:repeat(4, minmax(0, 1fr));
	align-items:start;
	gap:var(--ssa-space-xl) var(--ssa-gap-xl);
}

.ssa-link-feed-card {
	width:100%;
}

.ssa-link-feed-card-small {
	width:80%;
}

.ssa-link-feed-card:nth-child(4n + 2),
.ssa-link-feed-card:nth-child(4n + 4) {
	margin-top:var(--ssa-space-2xl);
}

.ssa-link-feed-card:nth-child(4n + 3) {
	justify-self:end;
}

.ssa-link-play {
	position:absolute;
	top:50%;
	left:50%;
	transform:translate(-50%, -50%);
	display:grid;
	place-items:center;
	width:52px;
	height:52px;
	border:1px solid rgb(255 255 255 / 40%);
	border-radius:var(--ssa-radius-full);
	background:rgb(0 0 0 / 25%);
	color:var(--ssa-color-white);
	font-size:var(--ssa-font-size-sm);
	cursor:pointer;
}

.ssa-link-play:focus-visible {
	outline:3px solid var(--ssa-color-white);
	outline-offset:4px;
}

.ssa-link-play[aria-pressed="true"] {
	top:auto;
	left:auto;
	right:var(--ssa-space-xs);
	bottom:var(--ssa-space-xl);
	transform:none;
}

/* PC : ÇϳªÀÇ °íÁ¤ È­¸é¿¡¼­ ½ºÅ©·Ñ·Î Àå¸é Àüȯ */
@media (min-width:769px) and (prefers-reduced-motion:no-preference) {
	.ssa-link-story.ssa-link-ready {
		height:calc(100svh + var(--ssa-link-scroll));
		box-sizing:content-box;
	}

	.ssa-link-ready .ssa-link-sticky {
		position:sticky;
		top:0;
		height:100svh;
		min-height:560px;
		overflow:hidden;
	}

	.ssa-link-ready .ssa-link-stage {
		height:100%;
		overflow:hidden;
	}

	.ssa-link-ready .ssa-link-stage::before {
		content:"";
		position:absolute;
		inset:0;
		background:linear-gradient(var(--ssa-link-line), var(--ssa-link-line)) 0 36% / 100% 1px no-repeat,
			linear-gradient(var(--ssa-link-line), var(--ssa-link-line)) 0 56% / 100% 1px no-repeat,
			linear-gradient(var(--ssa-link-line), var(--ssa-link-line)) 34% 0 / 1px 100% no-repeat,
			linear-gradient(var(--ssa-link-line), var(--ssa-link-line)) 66% 0 / 1px 100% no-repeat;
		opacity:var(--ssa-link-grid-opacity, 1);
		pointer-events:none;
	}

	.ssa-link-ready .ssa-link-intro,
	.ssa-link-ready .ssa-link-result {
		position:absolute;
		top:50%;
		left:50%;
		width:44%;
		max-width:660px;
		margin:0;
		transform:translate(-50%, -50%);
	}

	.ssa-link-ready .ssa-link-result {
		opacity:0;
		pointer-events:none;
	}

	.ssa-link-ready .ssa-link-cards {
		display:block;
	}

	.ssa-link-ready .ssa-link-card {
		position:absolute;
		top:50%;
		left:50%;
		width:var(--ssa-link-card-width);
		opacity:0;
		will-change:transform, opacity;
	}
}

/* ¸ð¹ÙÀÏ / µ¿ÀÛ ÁÙÀ̱â : Àüȯ ¾øÀÌ Á¤Àû ¹èÄ¡, ¿µ»óÀº ÅÍÄ¡ Àç»ý */
@media (max-width:768px) {
	.ssa-link-story{
		padding-block:var(--ssa-space-3xl)
	}

	.ssa-link-feed {
		display:none;
	}

	.ssa-link-cards {
		grid-template-columns:repeat(2, minmax(0, 1fr));
		gap:var(--ssa-gap-sm);
	}

	.ssa-link-card {
		border-radius:var(--ssa-radius-30);
	}

	.ssa-link-demo {
		padding-left:var(--ssa-space-md);
	}

	
	.ssa-link-result2{
		text-align:center;
		margin-top:var(--ssa-space-3xl)
	} 

}


/* ==================== ¸µÅ© µî·Ï : ¸¶¿ì½º Ä¿¼­ Ŭ¸¯ ¿¬Ãâ ==================== */
.ssa-link-register {
	position:relative;
}

.ssa-link-cursor,
.ssa-link-click-ring {
	display:none;
	position:absolute;
	left:60%;
	top:65%;
	opacity:0;
	pointer-events:none;
}

.ssa-link-cursor {
	z-index:2;
	width:32px;
	height:40px;
	transform-origin:3px 2px;
	filter:drop-shadow(0 3px 3px rgb(0 0 0 / 25%));
}

.ssa-link-cursor svg {
	display:block;
	width:100%;
	height:100%;
}

.ssa-link-click-ring {
	width:30px;
	height:30px;
	border:2px solid var(--ssa-color-white);
	border-radius:var(--ssa-radius-full);
}

@media (min-width:769px) and (prefers-reduced-motion:no-preference) {
	.ssa-link-ready .ssa-link-cursor,
	.ssa-link-ready .ssa-link-click-ring {
		display:block;
	}
}

/* ==================== ¸ð¹ÙÀÏ ¼îÃ÷ °á°ú : ¿µ»ó 3Àå °ãħ ¡æ ÇÏ´Ü Å¸ÀÌƲ ==================== */
@media (max-width:768px) {
	.ssa-link-stage {
		display:flex;
		flex-direction:column;
	}

	.ssa-link-intro {
		order:0;
	}

	.ssa-link-cards {
		order:1;
		display:grid;
		grid-template-columns:minmax(0, 1fr);
		justify-items:center;
		align-items:center;
		gap:0;
		margin-top:var(--ssa-space-xl);
		padding-block:var(--ssa-space-md);
		isolation:isolate;
	}

	.ssa-link-card:not(.ssa-link-card-video) {
		display:none;
	}

	.ssa-link-card-video {
		grid-area:1 / 1;
		width:min(54%, 230px);
		box-shadow:0 12px 32px rgb(0 0 0 / 35%);
	}

	.ssa-link-card-video[data-ssa-card="0"] {
		z-index:1;
		transform:translate(-32%, 8px);
	}

	.ssa-link-card-video[data-ssa-card="2"] {
		z-index:3;
	}

	.ssa-link-card-video[data-ssa-card="3"] {
		z-index:2;
		transform:translate(32%, 8px);
	}

	.ssa-link-card-video:focus-within {
		z-index:4;
	}

	.ssa-link-card-video[data-ssa-card="0"] .ssa-link-play {
		left:16%;
		right:auto;
	}

	.ssa-link-card-video[data-ssa-card="5"] .ssa-link-play {
		left:84%;
		right:auto;
	}

	.ssa-link-card-video .ssa-link-play {
		top:50%;
		left:50%;
		right:auto;
		bottom:auto;
		width:44px;
		height:44px;
		transform:translate(-50%, -50%);
		display:none
	}

	.ssa-link-result {
		order:2;
		margin:var(--ssa-space-lg) 0 0;
	}
}


/* ==================== ÆǸŠ¼º°ú : °øÅë °£°Ý / 2¿­ ±¸¼º ==================== */
.ssa-inner-a {
	width:var(--ssa-contents-width-inner);
	margin-inline:auto;
}

.ssa-sales {
	/*background:var(--ssa-color-gray-light);*/
}

.ssa-sales-inner {
	display:grid;
	grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
	align-items:center;
	gap:var(--ssa-space-3xl);
}

.ssa-sales-media {
	--ssa-sales-scale:1;
	position:relative;
	aspect-ratio:1;
	overflow:hidden;
	border-radius:var(--ssa-radius-30);
	box-shadow:0 24px 40px rgb(0 0 0 / 7%);
}

.ssa-sales-zoom {
	position:absolute;
	inset:0;
	transform:scale(var(--ssa-sales-scale));
	transform-origin:center;
}

.ssa-sales-image {
	width:100%;
	height:100%;
	object-fit:cover;
}

/* ½Ã¾È Àüü À̹ÌÁö¿¡¼­ »çÁø ¿µ¿ª¸¸ Ç¥½Ã. ¿øº» »çÁø ±³Ã¼ ½Ã ÀÌ Å¬·¡½º Á¦°Å. */
.ssa-sales-reference {
	position:absolute;
	width:344.086%;
	max-width:none;
	height:auto;
	left:-60.394%;
	top:-36.738%;
}

.ssa-sales-copy {
	min-width:0;
	word-break:keep-all;
}

.ssa-sales-copy .ssa-title {
	margin:0;
}

.ssa-sales-dot {
	color:var(--ssa-color-main);
}

.ssa-sales-copy .ssa-description {
	margin:var(--ssa-space-2xl) 0 0;
	line-height:var(--ssa-line-height-text);
}

/* ==================== ÆǸŠ¼º°ú : ÅÂºí¸´ / ¸ð¹ÙÀÏ ==================== */
@media (max-width:1024px) {
	.ssa-sales-inner {
		gap:var(--ssa-space-xl);
	}
}

@media (max-width:768px) {
	.ssa-sales{
		padding:0;
		display:flex;
		flex-direction:column;
		justify-content:center;
	}
	.ssa-sales-inner {
		 display: flex;
        flex-direction: column-reverse;
		gap:var(--ssa-space-xl);
	}

	.ssa-sales-media {
		width:100%;
		max-width:520px;
		height:240px;
		margin-inline:auto;
	}
	
	.ssa-sales-media img {
		transform: translate(0, 0) scale(1.4);
		height:220px;
	}

	.ssa-sales-copy .ssa-description {
		margin-top:var(--ssa-space-md);
	}
}


/* ==================== Á¦ÀÛ °úÁ¤ : ¿ÞÂÊ °íÁ¤ / ¿À¸¥ÂÊ ¼¼·Î Ä«µå ==================== */


.ssa-process-step .ssa-card-title {
	margin:var(--ssa-space-lg) 0;
	word-break:keep-all;
}


/* ¸ð¹ÙÀÏ ¹× °¡·Î·Î ±ä ³·Àº È­¸é¿¡¼­´Â Á¦¸ñÀ» ÀÚ¿¬½º·´°Ô ½ºÅ©·Ñ */
@media (max-width:768px) {

	.ssa-process-intro {
		position:static;
		text-align:center
	}


	.ssa-sales-copy{
		text-align:center
	}
}


/* ==================== STEP 01 : »óÇ° ¸µÅ© º¹»ç / ½ºÆ©µð¿À ÀÔ·Â ¾Ö´Ï¸ÞÀÌ¼Ç ==================== */
.ssa-demo {
	--ssa-demo-orange:#e96323;
	--ssa-demo-green:#03a94f;
	position:relative;
	overflow:hidden;
	container-type:inline-size;
}

.ssa-demo-scene {
	position:absolute;
	inset:0;
	transform-origin:center;
}

.ssa-demo-phone {
	position:absolute;
	box-sizing:border-box;
	overflow:hidden;
	border:1cqw solid var(--ssa-color-black);
	border-radius:var(--ssa-radius-30);
	background:var(--ssa-color-white);
}

.ssa-demo-phone.ssa-demo-shop{
	border-radius:5cqw
}

.ssa-demo-phone.ssa-demo-studio{
	border-radius:7cqw
}

.ssa-demo-shop {
	--ssa-demo-shop-dim:0;
	left:15%;
	top:10%;
	width:29%;
	height:77%;
	transform-origin:50% 50%;
}

.ssa-demo-shop::after {
	content:"";
	position:absolute;
	inset:1cqw;
	z-index:2;
	border-radius:4cqw;
	background:rgb(0 0 0 / 18%);
	opacity:var(--ssa-demo-shop-dim);
	pointer-events:none;
}
.ssa-demo-island {
	width:30%;
	height:3.2cqw;
	margin:2cqw auto;
	border-radius:var(--ssa-radius-full);
	background:var(--ssa-color-black);
}

.ssa-demo-brand {
	font-size:1.4cqw;
	font-weight:800;
	text-align:center;
}

.ssa-demo-brand b {
	padding:0 .3cqw;
	background:var(--ssa-demo-green);
	color:var(--ssa-color-white);
}

.ssa-demo-products {
	display:grid;
	grid-template-columns:repeat(2, minmax(0, 1fr));
	gap:1cqw;
	padding:2cqw 1cqw;
}

.ssa-demo-product {
	min-width:0;
	display:grid;
	gap:.7cqw;
}

.ssa-demo-product-thumb {

	border-radius:1.5cqw;
	border:solid 1px var(--ssa-color-border);
}

.ssa-demo-product-name {
	display:grid;
	align-content:center;
	justify-items:start;
	gap:.45cqw;
	min-height:2.8cqw;
	box-sizing:border-box;
	overflow:hidden;
	padding:.5cqw .7cqw;
	border-radius:.7cqw;
	background:transparent;
}

.ssa-demo-product-name i {
	display:block;
	width:88%;
	height:.75cqw;
	border-radius:var(--ssa-radius-full);
	background:var(--ssa-color-gray);
}

.ssa-demo-product-name i:nth-child(2) {
	width:58%;
}

.ssa-demo-selection-name {
	margin:1cqw 0;
}

.ssa-demo-product img,
.ssa-demo-chair img {
	display:block;
	width:100%;
	height:100%;
	object-fit:contain;
}

.ssa-demo-selection {
	position:absolute;
	left:10%;
	top:29%;
	z-index:3;
	width:23%;
	box-sizing:border-box;
	padding:2cqw;
	border-radius:4cqw;
	background:var(--ssa-color-white);
	box-shadow:0 1cqw 5cqw rgb(0 0 0 / 20%);
	transform-origin:center;
}

.ssa-demo-chair {
	width:100%;
	aspect-ratio:1.35;
	box-sizing:border-box;
	overflow:hidden;
	padding:1cqw;
	border-radius:1.5cqw;
	border:solid 1px var(--ssa-color-border)
}

.ssa-demo-copy,
.ssa-demo-generate {
	display:block;
	padding:1.8cqw .5cqw;
	border-radius:var(--ssa-radius-full);
	background:var(--ssa-demo-orange);
	color:var(--ssa-color-white);
	font-size:2cqw;
	font-weight:700;
	line-height:var(--ssa-line-height-tight);
	text-align:center;
}

.ssa-demo-studio {
	left:50%;
	top:10%;
	width:45%;
	height:105%;
	transform-origin:50% 45%;
}

.ssa-demo-studio .ssa-demo-island {
	height:4cqw;
	margin-top:3cqw;
}

.ssa-demo-studio-logo {
	margin:2cqw auto 0;
	padding-bottom:5cqw;
	color:var(--ssa-color-main);
	font-size:3.4cqw;
	font-weight:800;
	text-align:center;
	width:100px;
}

.ssa-demo-form {
	padding:7cqw 5cqw 0;
}

.ssa-demo-label {
	display:block;
	margin:0 0 2cqw;
	font-size:2.2cqw;
	font-weight:700;
}

.ssa-demo-input {
	display:flex;
	align-items:center;
	min-height:8cqw;
	box-sizing:border-box;
	padding:1cqw 2cqw;
	border-radius:2cqw;
	box-shadow:0 0 5cqw rgb(0 0 0 / 7%);
	color:var(--ssa-main);
	font-size:3cqw;
	font-weight:700;
	white-space:nowrap;
}

.ssa-demo-generate {
	margin-top:3cqw;
	border-radius:2cqw;
	background:var(--ssa-sub-gradient-w);
	font-size:2.5cqw;
}

.ssa-demo-pointer {
	position:absolute;
	z-index:5;
	width:4.6%;
	height:auto;
	opacity:0;
	pointer-events:none;
	filter:drop-shadow(0 2px 2px rgb(0 0 0 / 25%));
	transform-origin:0 0;
}


/* ==================== Á¦ÀÛ °úÁ¤ : ¿ÞÂÊ °íÁ¤ / ¿À¸¥ÂÊ ¼¼·Î Ä«µå ==================== */
.ssa-process {
	--ssa-process-header-height:100px;
	background:var(--ssa-color-white);
	padding-bottom:var(--ssa-space-3xl)
}

.ssa-process-inner {
	display:grid;
	grid-template-columns:minmax(0, 0.8fr) minmax(0, 1.2fr);
	align-items:start;
	gap:var(--ssa-space-2xl);
	overflow:visible;
}

.ssa-process-intro {
	position:sticky;
	top:calc(var(--ssa-process-header-height) + var(--ssa-space-md));
	min-width:0;
	word-break:keep-all;
}

.ssa-process-intro .ssa-title {
	margin:0;
}

.ssa-process-dot {
	color:var(--ssa-color-main);
}

.ssa-process-intro .ssa-description {
	margin:var(--ssa-space-lg) 0 0;
	line-height:var(--ssa-line-height-text);
}

.ssa-process-steps {
	display:flex;
	flex-direction:column;
	gap:var(--ssa-space-2xl);
	min-width:0;
}

.ssa-process-box {
	width:100%;
	aspect-ratio:1.4;
	border-radius:var(--ssa-radius-50);
	background:var(--ssa-color-gray-light);
}

.ssa-process-step .ssa-card-title {
	margin:var(--ssa-space-md) 0 ;
	word-break:keep-all;
}

.ssa-process-step .ssa-description {
	margin:var(--ssa-space-sm) 0 0;
	line-height:var(--ssa-line-height-text);
	word-break:keep-all;
}

/* ¸ð¹ÙÀÏ ¹× °¡·Î·Î ±ä ³·Àº È­¸é¿¡¼­´Â Á¦¸ñÀ» ÀÚ¿¬½º·´°Ô ½ºÅ©·Ñ */
@media (max-width:768px) {
	.ssa-process {
		padding-bottom:0
	}
	.ssa-process-inner {
		grid-template-columns:minmax(0, 1fr);
		gap:var(--ssa-space-xl);
	}

	.ssa-process-intro {
		position:static;
	}

	.ssa-process-box {
		border-radius:var(--ssa-radius-30);
	}

	.ssa-demo-studio-logo{
		width:70px;
	}
}

@media (max-height:600px) {
	.ssa-process-intro {
		position:static;
	}
}


/* ==================== STEP 02 : AI ¿µ»ó Á¦ÀÛ ´Ü°è ¾Ö´Ï¸ÞÀÌ¼Ç ==================== */
.ssa-ai-demo {
	position:relative;
	overflow:hidden;
	container-type:inline-size;
}

.ssa-ai-phone {
	position:absolute;
	left:17%;
	top:5%;
	width:52%;
	height:104%;
	box-sizing:border-box;
	overflow:hidden;
	border:1.2cqw solid var(--ssa-color-black);
	border-radius:8cqw 8cqw 0 0;
	background:var(--ssa-color-white);
	box-shadow:0 2cqw 6cqw rgb(0 0 0 / 8%);
}

.ssa-ai-island {
	width:30%;
	height:4.2cqw;
	margin:3.2cqw auto 0;
	border-radius:var(--ssa-radius-full);
	background:var(--ssa-color-black);
}

.ssa-ai-logo {
	display:flex;
	align-items:center;
	justify-content:center;
	gap:1.2cqw;
	margin:5cqw 4cqw 3cqw;
	color:var(--ssa-color-main);
	font-size:3.6cqw;
}

.ssa-ai-logo img{
	width:100px;
}

.ssa-ai-media {
	position:relative;
	width:82%;
	aspect-ratio:1 / 1.05;
	margin-inline:auto;
	overflow:hidden;
	background:#e9e6e2;
}

.ssa-ai-media img {
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
}

.ssa-ai-scan {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	height:.5cqw;
	background:var(--ssa-main-gradient-w);
	box-shadow:0 0 2.2cqw var(--ssa-color-main);
	opacity:0;
	transform:translateY(-1cqw);
}

.ssa-ai-point {
	display:none;
}

.ssa-ai-point-a {
	left:24%;
	top:32%;
}

.ssa-ai-point-b {
	left:65%;
	top:45%;
}

.ssa-ai-point-c {
	left:48%;
	top:72%;
}

.ssa-ai-script-panel,
.ssa-ai-scenes,
.ssa-ai-editor {
	position:absolute;
	inset:0;
	opacity:0;
}

.ssa-ai-script-panel {
	display:grid;
	align-content:center;
	gap:2cqw;
	padding:5cqw;
	background:rgb(19 12 32 / 78%);
	backdrop-filter:blur(.8cqw);
}

.ssa-ai-script-panel span {
	display:block;
	width:100%;
	height:1.3cqw;
	border-radius:var(--ssa-radius-full);
	background:rgb(255 255 255 / 88%);
	transform:scaleX(0);
	transform-origin:left;
}

.ssa-ai-script-panel span:nth-child(2) {
	width:82%;
}

.ssa-ai-script-panel span:nth-child(3) {
	width:92%;
}

.ssa-ai-script-panel span:nth-child(4) {
	width:58%;
}

.ssa-ai-scenes {
	display:block;
	padding:2.5cqw;
	background:rgb(245 245 247 / 88%);
	backdrop-filter:blur(.8cqw);
}

.ssa-ai-scenes span {
	--ssa-ai-scene-rotate:-7deg;
	position:absolute;
	left:13%;
	top:14%;
	width:45%;
	aspect-ratio:9 / 14;
	border:.35cqw solid var(--ssa-color-white);
	border-radius:1.2cqw;
	background-image:var(--ssa-ai-scene-image);
	background-position:center;
	background-size:cover;
	box-shadow:0 1cqw 2.5cqw rgb(0 0 0 / 16%);
	opacity:0;
}

.ssa-ai-scenes span:nth-child(2) {
	--ssa-ai-scene-rotate:2deg;
	left:28%;
	top:10%;
	z-index:2;
}

.ssa-ai-scenes span:nth-child(3) {
	--ssa-ai-scene-rotate:8deg;
	left:43%;
	top:15%;
	z-index:3;
}

.ssa-ai-voice {
	position:absolute;
	left:18%;
	right:18%;
	bottom:10%;
	z-index:3;
	display:flex;
	align-items:center;
	justify-content:center;
	gap:.8cqw;
	height:8cqw;
	border:1px solid rgb(0 0 0 / 7%);
	border-radius:var(--ssa-radius-full);
	background:rgb(255 255 255 / 90%);
	backdrop-filter:blur(.8cqw);
	box-shadow:0 1cqw 3cqw rgb(0 0 0 / 12%);
	opacity:0;
}

.ssa-ai-voice i {
	width:.8cqw;
	height:5cqw;
	border-radius:var(--ssa-radius-full);
	background:linear-gradient(180deg, #c849f2, #6d3de9);
	transform:scaleY(.25);
	transform-origin:center;
}

.ssa-ai-final-video {
	position:absolute;
	top:0;
	inset:0;
	z-index:4;
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
	object-position: center 30%;
	opacity:0;
	transform:scale(1.06);
}

.ssa-ai-video-toggle {
	position:absolute;
	right:2cqw;
	bottom:2cqw;
	z-index:8;
	display:grid;
	place-items:center;
	width:6cqw;
	aspect-ratio:1;
	padding:0;
	border:1px solid rgb(255 255 255 / 30%);
	border-radius:var(--ssa-radius-full);
	background:rgb(0 0 0 / 58%);
	color:var(--ssa-color-white);
	font-size:1.8cqw;
	opacity:0;
	pointer-events:none;
	backdrop-filter:blur(.8cqw);
	cursor:pointer;
	transition:background .2s ease, transform .2s ease;
}

.ssa-ai-video-toggle:hover {
	background:rgb(0 0 0 / 75%);
}

.ssa-ai-video-toggle:active {
	transform:scale(.92);
}

.ssa-ai-video-toggle:focus-visible {
	outline:2px solid var(--ssa-color-main);
	outline-offset:2px;
}

.ssa-ai-cut-editor {
	position:absolute;
	left:2%;
	right:2%;
	bottom:7%;
	z-index:5;
	display:grid;
	grid-template-rows:9cqw 6cqw;
	gap:1cqw;
	padding:1.5cqw;
	border:1px solid rgb(255 255 255 / 12%);
	border-radius:1.5cqw;
	background:rgb(24 24 29 / 96%);
	box-shadow:0 1.5cqw 4cqw rgb(0 0 0 / 28%);
	opacity:0;
	backdrop-filter:blur(.8cqw);
}

.ssa-ai-cut-clips {
	display:grid;
	grid-template-columns:1fr 1fr;
	gap:.6cqw;
}

.ssa-ai-cut-clips i {
	border-radius:.8cqw;
	background:url('../images/main4/ssa_seo3_camera.jpg') center 35% / cover;
}

.ssa-ai-cut-clips i:nth-child(2) {
	background-image:url('../images/main4/ssa_seo3_woman2.jpg');
}

.ssa-ai-cut-audio {
	position:relative;
	display:flex;
	align-items:center;
	overflow:hidden;
	gap:1cqw;
	padding-inline:1.4cqw;
	border-radius:1.4cqw;
	background:#6842a5;
	color:var(--ssa-color-white);
	font-size:1.15cqw;
	font-weight:600;
}

.ssa-ai-cut-audio::after {
	content:"";
	position:absolute;
	left:34%;
	right:5%;
	top:22%;
	bottom:22%;
	background:linear-gradient(135deg, transparent 0 8%, rgb(255 255 255 / 18%) 9% 17%, transparent 18% 26%, rgb(255 255 255 / 22%) 27% 38%, transparent 39% 48%, rgb(255 255 255 / 16%) 49% 61%, transparent 62% 72%, rgb(255 255 255 / 20%) 73% 84%, transparent 85%);
}

.ssa-ai-cut-playhead {
	position:absolute;
	left:4%;
	top:.6cqw;
	bottom:.6cqw;
	width:.35cqw;
	border-radius:var(--ssa-radius-full);
	background:var(--ssa-color-main);
	box-shadow:0 0 1cqw rgb(112 36 245 / 45%);
}

.ssa-ai-cut-playhead::before {
	content:"";
	position:absolute;
	left:50%;
	top:0;
	width:1.5cqw;
	aspect-ratio:1;
	border-radius:var(--ssa-radius-full);
	background:var(--ssa-color-main);
	transform:translate(-50%, -45%);
}

.ssa-ai-guide {
	display:none;
}

.ssa-ai-guide-count {
	flex:0 0 auto;
	color:#c990ff;
}

.ssa-ai-editor {
	top:auto;
	height:43%;
	padding:2cqw;
	background:rgb(15 13 19 / 92%);
	color:var(--ssa-color-white);
}

.ssa-ai-caption {
	margin-bottom:1.4cqw;
	font-size:1.4cqw;
	font-weight:700;
	text-align:center;
}

.ssa-ai-timeline {
	display:grid;
	grid-template-columns:1.2fr .8fr 1fr;
	gap:.5cqw;
	height:3.4cqw;
}

.ssa-ai-timeline i {
	border-radius:.5cqw;
	background:var(--ssa-main-gradient-w);
}

.ssa-ai-wave {
	display:flex;
	align-items:center;
	gap:.5cqw;
	height:3.5cqw;
	margin-top:1cqw;
}

.ssa-ai-wave i {
	width:.65cqw;
	height:42%;
	border-radius:var(--ssa-radius-full);
	background:#57e1d2;
}

.ssa-ai-wave i:nth-child(2n) {
	height:85%;
}

.ssa-ai-wave i:nth-child(3n) {
	height:62%;
}

.ssa-ai-playhead {
	position:absolute;
	left:8%;
	top:5cqw;
	bottom:1.5cqw;
	width:.35cqw;
	background:var(--ssa-color-white);
	box-shadow:0 0 1cqw rgb(255 255 255 / 70%);
}

.ssa-ai-play {
	position:absolute;
	left:50%;
	top:50%;
	display:grid;
	place-items:center;
	width:9cqw;
	aspect-ratio:1;
	border-radius:var(--ssa-radius-full);
	background:rgb(255 255 255 / 90%);
	color:var(--ssa-color-main);
	font-size:3cqw;
	opacity:0;
	transform:translate(-50%, -50%) scale(.65);
	box-shadow:0 1cqw 3cqw rgb(0 0 0 / 18%);
}

.ssa-ai-status {
	position:absolute;
	left:60%;
	top:20%;
	z-index:7;
	display:grid;
	gap:1.3cqw;
	width:32%;
}

.ssa-ai-task {
	display:grid;
	grid-template-columns:minmax(0, 1fr) auto;
	align-items:center;
	min-height:7cqw;
	box-sizing:border-box;
	padding:1.5cqw 2cqw;
	border:1px solid rgb(0 0 0 / 6%);
	border-radius:1.4cqw;
	background:rgb(255 255 255 / 96%);
	color:#202024;
	font-size:1.9cqw;
	font-weight:600;
	box-shadow:0 .8cqw 2.4cqw rgb(0 0 0 / 10%);
	opacity:0;
	transform:translateX(7cqw);
}

.ssa-ai-loading {
	display:none;
	align-items:center;
	gap:.45cqw;
}

.ssa-ai-loading i {
	width:.7cqw;
	aspect-ratio:1;
	border-radius:var(--ssa-radius-full);
	background:var(--ssa-color-main);
	animation:ssa-ai-dot .75s ease-in-out infinite alternate;
}

.ssa-ai-loading i:nth-child(2) {
	animation-delay:.15s;
}

.ssa-ai-loading i:nth-child(3) {
	animation-delay:.3s;
}

.ssa-ai-check {
	display:none !important;
	color:var(--ssa-color-main);
	font-size:2.2cqw;
	opacity:0;
	visibility:hidden;
}

.ssa-ai-task.ssa-is-active .ssa-ai-loading {
	display:flex;
}

.ssa-ai-task.ssa-is-done .ssa-ai-check {
	display:inline-flex !important;
	opacity:1;
	visibility:visible;
}

.ssa-ai-task.ssa-is-current {
	box-shadow:0 1cqw 3cqw rgb(0 0 0 / 14%);
	transform:translateX(-.6cqw) !important;
}

.ssa-ai-task:not(.ssa-is-current) {
	filter:none;
}

@keyframes ssa-ai-dot {
	to {
		opacity:.35;
		transform:translateY(-.35cqw);
	}
}

@media(max-width:768px) {
	.ssa-ai-logo img{
		width:70px;
	}
}


@media (prefers-reduced-motion:reduce) {
	.ssa-ai-loading i {
		animation:none;
	}
}


/* ==================== ÀÚµ¿ ¾÷·Îµå : ½æ³×ÀÏ¿¡¼­ Àüü È­¸éÀ¸·Î ==================== */
.ssa-publish-story {
	position:relative;
	background:var(--ssa-color-white);
}

.ssa-publish-transition {
	height:720svh;
}

.ssa-publish-sticky {
	position:sticky;
	top:0;
	height:100svh;
	overflow:hidden;
	background:var(--ssa-color-white);
}

.ssa-publish-glow {
	position:absolute;
	left:50%;
	top:50%;
	width:min(90vw, 90vh, 1480px);
	height:auto;
	aspect-ratio:1;
	border-radius:var(--ssa-radius-full);
	background:radial-gradient(circle at center, rgb(255 255 255) 0%, rgb(255 255 255 / 98%) 30%, rgb(248 248 249 / 92%) 43%, rgb(218 218 223 / 60%) 62%, rgb(231 231 234 / 32%) 77%, transparent 100%);
	box-shadow:0 0 clamp(160px, 18vw, 340px) clamp(40px, 5vw, 96px) rgb(160 160 172 / 20%);
	filter:blur(clamp(24px, 3vw, 48px));
	opacity:var(--ssa-publish-ripple-glow-opacity, .72);
	transform:translate(-50%, -50%) scale(var(--ssa-publish-ripple-glow-scale, .82));
	pointer-events:none;
	will-change:transform, opacity;
}

.ssa-publish-glow::before,
.ssa-publish-glow::after {
	content:"";
	position:absolute;
	inset:-20%;
	border-radius:var(--ssa-radius-full);
	pointer-events:none;
}

.ssa-publish-glow::before {
	background:repeating-radial-gradient(circle at center, transparent 0%, transparent 10%, rgb(192 192 198 / 14%) 13%, rgb(176 176 184 / 28%) 16%, transparent 22%);
	filter:blur(clamp(18px, 2.2vw, 38px));
	opacity:var(--ssa-publish-ripple-inner-opacity, .42);
	transform:scale(var(--ssa-publish-ripple-inner-scale, .68));
	will-change:transform, opacity;
}

.ssa-publish-glow::after {
	background:repeating-radial-gradient(circle at center, transparent 0%, transparent 17%, rgb(205 205 211 / 20%) 21%, rgb(169 169 179 / 24%) 24%, transparent 31%);
	filter:blur(clamp(28px, 3vw, 52px));
	opacity:var(--ssa-publish-ripple-outer-opacity, .28);
	transform:scale(var(--ssa-publish-ripple-outer-scale, .54));
	will-change:transform, opacity;
}

.ssa-publish-intro {
	position:absolute;
	inset:0;
	z-index:2;
	opacity:var(--ssa-publish-intro-opacity, 1);
	transform:translateY(var(--ssa-publish-intro-y, 0));
	pointer-events:none;
}

.ssa-publish-copy {
	position:absolute;
	left:50%;
	top:50%;
	width:min(760px, 70vw);
	text-align:center;
	word-break:keep-all;
	transform:translate(-50%, -50%);
}

.ssa-publish-copy .ssa-title {
	margin:0;
}

.ssa-publish-copy .ssa-description {
	margin:var(--ssa-space-md) 0 0;
	line-height:var(--ssa-line-height-text);
}

.ssa-publish-dot {
	color:var(--ssa-color-main);
}

.ssa-publish-channel {
	position:absolute;
	display:grid;
	place-items:center;
	width:clamp(76px, 9vw, 150px);
	aspect-ratio:1;
	border-radius:var(--ssa-radius-30);
	background:color-mix(in srgb, var(--ssa-color-white) 92%, transparent);
	font-size:var(--ssa-font-size-3xl);
	box-shadow:0 20px 48px rgb(24 16 45 / 10%);
	opacity:var(--ssa-publish-item-opacity, var(--ssa-publish-items-opacity, 0));
	transform:translateY(var(--ssa-publish-item-offset, var(--ssa-publish-item-y, 0))) scale(var(--ssa-publish-item-size, var(--ssa-publish-item-scale, 1)));
	animation:ssa-publish-float 4.8s ease-in-out infinite alternate;
	will-change:translate;
	overflow:hidden;

}

.ssa-publish-channel-threads {
	left:6%;
	top:10%;
}

.ssa-publish-channel-upload {
	left:19%;
	top:31%;
	color:#4096f4;
	animation-delay:-1.1s;
	animation-duration:5.4s;
}

.ssa-publish-channel-youtube {
	left:45%;
	top:10%;
	color:#ff1020;
	animation-delay:-2.2s;
	animation-duration:4.4s;
}

.ssa-publish-channel-tiktok {
	left:6%;
	top:56%;
	background:var(--ssa-color-black);
	color:var(--ssa-color-white);
	animation-delay:-.7s;
	animation-duration:5.8s;
}

.ssa-publish-channel-instagram {
	right:5%;
	top:58%;
	color:#e1306c;
	animation-delay:-3.1s;
	animation-duration:5.1s;
}

.ssa-publish-channel-shorts {
	right:14%;
	top:72%;
	background:var(--ssa-color-black);
	color:#78f83b;
	animation-delay:-1.8s;
	animation-duration:4.7s;
}

@keyframes ssa-publish-float {
	0% {
		translate:0 -5px;
	}

	100% {
		translate:0 7px;
	}
}

.ssa-publish-thumb {
	position:absolute;
	width:clamp(92px, 10vw, 168px);
	aspect-ratio:1;
	margin:0;
	overflow:hidden;
	border-radius:var(--ssa-radius-30);
	background:var(--ssa-color-gray);
	box-shadow:0 20px 48px rgb(24 16 45 / 11%);
	opacity:var(--ssa-publish-item-opacity, var(--ssa-publish-items-opacity, 0));
	transform:translateY(var(--ssa-publish-item-offset, var(--ssa-publish-item-y, 0))) scale(var(--ssa-publish-item-size, var(--ssa-publish-item-scale, 1)));
	animation:ssa-publish-float 5.2s -1.4s ease-in-out infinite alternate;
	will-change:translate;
}

.ssa-publish-thumb img {
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
}

.ssa-publish-thumb span {
	position:absolute;
	left:50%;
	top:50%;
	display:grid;
	place-items:center;
	width:38%;
	aspect-ratio:1;
	border-radius:var(--ssa-radius-full);
	background:color-mix(in srgb, var(--ssa-color-white) 62%, transparent);
	color:var(--ssa-color-black);
	transform:translate(-50%, -50%);
	backdrop-filter:blur(8px);
}

.ssa-publish-thumb-shoes {
	right:4%;
	top:6%;
	animation-delay:-2.6s;
}

.ssa-publish-thumb-fashion {
	right:17%;
	top:34%;
	animation-duration:5.8s;
}

.ssa-publish-thumb-life {
	left:46%;
	top:73%;
	animation-delay:-3.4s;
	animation-duration:4.9s;
}


/* ==================== ¸¸µç µÚ °ü¸® °á°ú : ¿ÞÂÊ °íÁ¤ / ¿À¸¥ÂÊ ÀÏ¹Ý ½ºÅ©·Ñ ==================== */


@media (max-width:768px) {

	.ssa-publish-story{
		margin-top:0
	}
	.ssa-publish-transition {
		height:auto;
		padding-top:0;
	}

	.ssa-publish-results {
		margin-top:0;
		padding:var(--ssa-space-3xl) var(--ssa-space-md) var(--ssa-space-4xl);
		background:var(--ssa-color-black);
	}

	 .ssa-demo-shop .ssa-demo-products {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 6px;
    width: 100%;
    min-width: 0;
    box-sizing: border-box;
  }

  .ssa-demo-shop .ssa-demo-product {
    display: block;
    min-width: 0;
    width: auto;
  }

  .ssa-demo-shop .ssa-demo-product-thumb {
    position: relative;
    width: 100%;
    height: auto;
    aspect-ratio: 1 / 1;
    overflow: hidden;
    box-sizing: border-box;
  }

  .ssa-demo-shop .ssa-demo-product-thumb img {
    position: absolute;
    inset: 0;
    display: block;
    width: 100%;
    height: 100%;
    max-width: none;
    object-fit: cover;
    object-position: center;
  }


}


/* ==================== ¼º°ú ¼îÃ÷ : °íÁ¤ ŸÀÌƲ / ¿µ»ó Çǵå ==================== */
.ssa-shorts {
	position:relative;
	height:auto;
	padding-block:var(--ssa-space-3xl);
	background:var(--ssa-color-gray-light);
}

.ssa-shorts-sticky {
	position:relative;
	display:grid;
	grid-template-columns:minmax(300px, .8fr) minmax(520px, 1.2fr);
	align-items:start;
	gap:var(--ssa-space-3xl);
	height:auto;
	overflow:visible;
}

.ssa-shorts-copy {
	position:sticky;
	z-index:2;
	top:calc(var(--ssa-process-header-height, 76px) + var(--ssa-space-lg));
	padding-top:0;
	word-break:keep-all;
}

.ssa-shorts-copy .ssa-title {
	margin:0;
	line-height:var(--ssa-line-height-title);
}

.ssa-shorts-feed {
	display:grid;
	grid-template-columns:repeat(2, minmax(0, 1fr));
	gap:var(--ssa-gap-md);
	height:auto;
	padding-inline:var(--ssa-space-xs);
}

.ssa-shorts-column {
	display:grid;
	align-content:start;
	gap:var(--ssa-gap-md);
	transform:none;
}

.ssa-shorts-column-second {
	padding-top:var(--ssa-space-3xl);
	transform:none;
}

.ssa-shorts-card {
	overflow:hidden;
	border-radius:var(--ssa-radius-30);
	background:#fff;
}

.ssa-shorts-card header,
.ssa-shorts-card footer {
	display:flex;
	align-items:center;
	height:54px;
	padding-inline:var(--ssa-space-md);
}

.ssa-shorts-card header {
	gap:var(--ssa-gap-xs);
}

.ssa-shorts-card header > span {
	display:grid;
	place-items:center;
	width:26px;
	aspect-ratio:1;
	border-radius:var(--ssa-radius-full);
	background:var(--ssa-color-black);
	color:var(--ssa-color-white);
}

.ssa-shorts-card header > strong {
	font-size:var(--ssa-font-size-base);
}

.ssa-shorts-card header > i {
	margin-left:auto;
}

.ssa-shorts-media {
	position:relative;
	aspect-ratio:9 / 14.5;
	overflow:hidden;
	border-radius:var(--ssa-radius-30);
	background:var(--ssa-color-black);
}

.ssa-shorts-media::after {
	position:absolute;
	inset:auto 0 0;
	height:34%;
	background:linear-gradient(transparent, rgb(0 0 0 / 52%));
	content:"";
	pointer-events:none;
}

.ssa-shorts-media img{
	width:40px;
}

.ssa-shorts-media video {
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
}

.ssa-shorts-media button {
	position:absolute;
	z-index:3;
	left:50%;
	top:50%;
	display:grid;
	place-items:center;
	width:68px;
	aspect-ratio:1;
	border:1px solid rgb(255 255 255 / 76%);
	border-radius:var(--ssa-radius-full);
	background:rgb(28 28 30 / 52%);
	color:var(--ssa-color-white);
	font-size:var(--ssa-font-size-xs);
	transform:translate(-50%, -50%);
	backdrop-filter:blur(7px);
	cursor:pointer;
	transition:width .25s ease, left .25s ease, top .25s ease, background .25s ease;
}

.ssa-shorts-card.ssa-is-playing .ssa-shorts-media button {
	left:auto;
	right:14px;
	top:auto;
	bottom:14px;
	width:44px;
	background:rgb(20 20 22 / 66%);
	transform:none;
}

.ssa-shorts-media > b {
	position:absolute;
	z-index:2;
	left:18px;
	bottom:16px;
	color:var(--ssa-color-white);
	font-size:var(--ssa-font-size-md);
	text-shadow:0 2px 9px rgb(0 0 0 / 55%);
}

.ssa-shorts-card footer {
	justify-content:space-between;
	font-size:var(--ssa-font-size-sm);
}

.ssa-shorts-card footer span {
	display:flex;
	gap:var(--ssa-gap-sm);
}

@media (max-width:768px) {
	.ssa-shorts {
		height:auto;
		padding:var(--ssa-space-3xl) var(--ssa-space-xs) var(--ssa-space-3xl);
	}

	.ssa-shorts-sticky {
		position:relative;
		display:block;
		height:auto;
		overflow:visible;
	}

	.ssa-shorts-copy {
		position:inherit;
		top:auto;
		padding-top:0;
		margin-bottom:var(--ssa-space-lg);
		text-align:center;
	}

	.ssa-shorts-feed {
		display:block;
		height:auto;
		padding:0;
	}

	.ssa-shorts-column {
		display:contents;
		transform:none;
	}

	.ssa-shorts-column-second {
		padding-top:0;
	}

	.ssa-shorts-card {
		width:250px;
		margin:0 auto var(--ssa-space-md);
		border-radius:var(--ssa-radius-30);
	}

	.ssa-shorts-media {
		aspect-ratio:9 / 13.2;
		border-radius:var(--ssa-radius-30);
	}
}

@media (max-width:768px) and (prefers-reduced-motion:reduce) {
	.ssa-concerns .ssa-concerns-bubble {
		transform:none;
	}
}

/* ==================== ÄÜÅÙÃ÷ È®Àå : Èå·ÁÁö´Â ŸÀÌƲ / ½ºÅ©·Ñ Ä«µå ==================== */
.ssa-content-flow {
	position:relative;
	height:auto;
	padding:var(--ssa-space-3xl) 0 var(--ssa-space-3xl);
	background:var(--ssa-color-white);
}

.ssa-content-flow-b{
	padding-bottom:0
}

.ssa-content-flow-sticky {
	position:relative;
	display:block;
	width:100%;
	height:auto;
	margin:0 auto;
	overflow:visible;
}

.ssa-content-flow-title {
	position:sticky;
	z-index:1;
	top:calc(var(--ssa-process-header-height, 76px) + var(--ssa-space-lg));
	width:var(--ssa-contents-width-in);
	margin:0 auto;
	color:var(--ssa-color-black);
	line-height:var(--ssa-line-height-title);
	opacity:var(--ssa-content-title-opacity, 1);
	text-align:center;
	transform:translateY(var(--ssa-content-title-y, 0));
	will-change:opacity, transform;
}

.ssa-content-flow-cards {
	position:relative;
	z-index:2;
	display:grid;
	grid-template-columns:repeat(2, minmax(0, 1fr));
	align-items:start;
	gap:var(--ssa-space-xl);
	width:var(--ssa-contents-width-inner);
	margin:var(--ssa-space-xl) auto 0;
	transform:none;
	will-change:auto;
}

.ssa-content-flow-column {
	display:grid;
	gap:var(--ssa-space-xl);
}

.ssa-content-flow-column-offset {
	/*padding-top:var(--ssa-space-xl);*/
}

.ssa-content-flow-card {
	color:var(--ssa-color-black);
}

.ssa-content-flow-visual {
	border-radius:var(--ssa-radius-50);
	background:var(--ssa-color-gray-light);
}

.ssa-content-flow-card-wide .ssa-content-flow-visual {
	height:360px;
}

.ssa-content-flow-card-tall .ssa-content-flow-visual {
	height:500px;
}

.ssa-content-flow-card h3 {
	margin:var(--ssa-space-lg) 0 0;
}

.ssa-content-flow-card p {
	margin:var(--ssa-space-sm) 0 0;
	line-height:var(--ssa-line-height-text);
}

.ssa-content-flow-visual img {
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
}

.ssa-content-shopping {
	position:relative;
	overflow:hidden;
	padding:var(--ssa-space-xl);
}

.ssa-content-shopping-track {
	display:grid;
	grid-template-columns:repeat(4, 28%);
	gap:var(--ssa-gap-xs);
	height:80%;
	transform:translateY(8%);
}

.ssa-content-shopping-track img {
	border-radius:var(--ssa-radius-15);
	box-shadow:0 12px 28px rgb(20 22 30 / 14%);
}

.ssa-content-shopping-track img:nth-child(even) {
	transform:translateY(14%);
}

.ssa-content-flow-card.ssa-is-active .ssa-content-shopping-track {
	animation:ssa-content-shopping 5s ease-in-out infinite;
}


.ssa-content-slides {
	display:grid;
	align-content:center;
	gap:var(--ssa-gap-md);
	padding:var(--ssa-space-xl);
}

.ssa-content-slides-screen {
	position:relative;
	width:100%;
	height:200px;
	overflow:hidden;
	border-radius:var(--ssa-radius-30);
	background:var(--ssa-color-white);
}

.ssa-content-slides-screen img {
	position:absolute;
	inset:0;
	opacity:0;
}

.ssa-content-slides-play {
	position:absolute;
	z-index:4;
	left:50%;
	top:50%;
	display:grid;
	place-items:center;
	width:68px;
	aspect-ratio:1;
	border:1px solid rgb(255 255 255 / 75%);
	border-radius:var(--ssa-radius-full);
	background:color-mix(in srgb, var(--ssa-color-white) 78%, transparent);
	color:var(--ssa-color-black);
	transform:translate(-50%, -50%);
	backdrop-filter:blur(8px);
}

.ssa-content-flow-card.ssa-is-active .ssa-content-slides-screen img:nth-child(1) {
	animation:ssa-content-slide-one 6s infinite;
}

.ssa-content-flow-card.ssa-is-active .ssa-content-slides-screen img:nth-child(2) {
	animation:ssa-content-slide-two 6s infinite;
}

.ssa-content-flow-card.ssa-is-active .ssa-content-slides-screen img:nth-child(3) {
	animation:ssa-content-slide-three 6s infinite;
}

.ssa-content-slides-timeline {
	position:relative;
	display:grid;
	grid-template-columns:repeat(3, 1fr);
	gap:var(--ssa-gap-xs);
	height:45px;
}

.ssa-content-slides-timeline span {
	overflow:hidden;
	border-radius:var(--ssa-radius-8);
	background:var(--ssa-color-border);
	border:solid 2px #fff
}

.ssa-content-slides-timeline span img {
	position:relative;
	inset:auto;
	opacity:.72;
}

.ssa-content-slides-timeline i {
	position:absolute;
	left:0;
	top:-5px;
	width:2px;
	height:48px;
	background:var(--ssa-color-main);
}

.ssa-content-flow-card.ssa-is-active .ssa-content-slides-timeline i {
	animation:ssa-content-playhead 6s linear infinite;
}

.ssa-content-news {
	display:grid;
	place-items:center;
	padding:var(--ssa-space-xl);
}

.ssa-content-news-frame {
	width:80%;
	overflow:hidden;
	border-radius:var(--ssa-radius-30) var(--ssa-radius-30) 0 0;
	background:var(--ssa-color-white);
	box-shadow:0 18px 40px rgb(25 25 35 / 8%);
}

.ssa-content-news-head {
	display:flex;
	align-items:center;
	gap:var(--ssa-gap-xs);
	height:64px;
	padding-inline:var(--ssa-space-md);
}

.ssa-content-news-scenes {
	position:relative;
	aspect-ratio:1 / .88;
	overflow:hidden;
}

.ssa-content-news-track {
	display:flex;
	height:100%;
	transition:transform .65s cubic-bezier(.22, 1, .36, 1);
}

.ssa-content-news-track img {
	flex:0 0 100%;
	opacity:1;
	transform:none;
}

.ssa-content-news-scenes button {
	position:absolute;
	z-index:3;
	top:50%;
	display:grid;
	place-items:center;
	width:44px;
	border:0;
	background:transparent;
	color:var(--ssa-color-white);
	font-size:var(--ssa-font-size-xl);
	filter:drop-shadow(0 2px 5px rgb(0 0 0 / 30%));
	transform:translateY(-50%);
	cursor:pointer;
}

.ssa-content-news-prev {
	left:8px;
}

.ssa-content-news-next {
	right:8px;
}

.ssa-content-news-hand {
	position:absolute;
	z-index:4;
	right:22%;
	top:58%;
	color:var(--ssa-color-white);
	font-size:var(--ssa-font-size-lg);
	filter:drop-shadow(0 3px 7px rgb(0 0 0 / 38%));
	opacity:0;
	pointer-events:none;
}

.ssa-content-flow-card.ssa-is-active .ssa-content-news-hand {
	animation:ssa-content-swipe 2.6s ease-in-out infinite;
}

.ssa-content-news-dots {
	display:flex;
	justify-content:center;
	gap:var(--ssa-gap-xs);
	padding:var(--ssa-space-sm);
}

.ssa-content-news-dots i {
	width:9px;
	aspect-ratio:1;
	border-radius:var(--ssa-radius-full);
	background:var(--ssa-color-border);
}

.ssa-content-news-dots i.ssa-is-active {
	background:var(--ssa-color-sub-text);
}

.ssa-content-story {
	display:grid;
	align-content:center;
	gap:var(--ssa-gap-md);
	padding:var(--ssa-space-xl);
}

.ssa-content-story {
	display:grid;
	place-items:center;
	padding:var(--ssa-space-xl);
}

.ssa-content-story-panel {
	position:relative;
	width:88%;
	height:90%;
	padding:var(--ssa-space-lg) var(--ssa-space-md);
	border-radius:var(--ssa-radius-30);
	background:var(--ssa-color-white);
	box-shadow:0 16px 38px rgb(25 27 36 / 8%);
}

.ssa-content-ai-badge {
	position:absolute;
	right:-6%;
	top:-12%;
	display:grid;
	place-items:center;
	width:66px;
	aspect-ratio:1;
	border-radius:var(--ssa-radius-15);
	background:var(--ssa-color-black);
	color:var(--ssa-color-white);
	font-size:var(--ssa-font-size-md);
	font-weight:900;
	letter-spacing:-.08em;
	box-shadow:0 12px 24px rgb(17 24 39 / 18%);
}

.ssa-content-ai-badge::first-letter {
	color:var(--ssa-color-main);
}

.ssa-content-story-clips {
	display:grid;
	grid-template-columns:repeat(3, 1fr);
	gap:var(--ssa-gap-xs);
}

.ssa-content-story-clips > img,
.ssa-content-story-clips > span {
	display:flex;
	align-items:center;
	justify-content:center;
	aspect-ratio:1.25 / 1;
	border-radius:var(--ssa-radius-10);
	background:var(--ssa-color-gray-light);
}

.ssa-content-story-clips > span {
	gap:var(--ssa-space-3xs);
}

.ssa-content-story-clips > span i {
	width:2px;
	height:18%;
	border-radius:var(--ssa-radius-8);
	background:var(--ssa-color-main);
}

.ssa-content-story-clips > span i:nth-child(2),
.ssa-content-story-clips > span i:nth-child(4) {
	height:42%;
}

.ssa-content-story-clips > span i:nth-child(3) {
	height:68%;
}

.ssa-content-story-progress {
	height:7px;
	margin-top:var(--ssa-space-md);
	overflow:hidden;
	border-radius:var(--ssa-radius-full);
	background:var(--ssa-color-gray-light);
}

.ssa-content-story-progress i {
	display:block;
	width:100%;
	height:100%;
	border-radius:inherit;
	background:var(--ssa-color-main);
	transform:scaleX(0);
	transform-origin:left;
}

.ssa-content-story-controls {
	display:flex;
	align-items:center;
	justify-content:center;
	gap:var(--ssa-gap-lg);
	margin-top:var(--ssa-space-md);
	font-size:var(--ssa-font-size-sm);
}

.ssa-content-story-controls > span {
	display:grid;
	place-items:center;
	width:50px;
	aspect-ratio:1;
	border-radius:var(--ssa-radius-full);
	background:var(--ssa-color-black);
	color:var(--ssa-color-white);
	box-shadow:0 8px 20px rgb(0 0 0 / 18%);
}

.ssa-content-flow-card.ssa-is-active .ssa-content-story-progress i {
	animation:ssa-content-progress 5s linear infinite;
}

.ssa-content-flow-card.ssa-is-active .ssa-content-story-clips > span i {
	animation:ssa-content-wave 1.2s ease-in-out infinite alternate;
}

@keyframes ssa-content-shopping {
	0%, 16%, 100% {
		transform:translateY(8%);
	}

	50%, 72% {
		transform:translateY(-8%);
	}
}

@keyframes ssa-content-swipe {
	0%, 48%, 100% {
		opacity:0;
		transform:translateX(18px) rotate(-12deg);
	}

	58% {
		opacity:.9;
	}

	82% {
		opacity:.9;
		transform:translateX(-44px) rotate(-12deg);
	}

	92% {
		opacity:0;
		transform:translateX(-54px) rotate(-12deg);
	}
}

@keyframes ssa-content-wave {
	0% {
		transform:scaleY(.55);
	}

	100% {
		transform:scaleY(1.25);
	}
}

@keyframes ssa-content-slide-one {
	0%, 28% {
		opacity:1;
	}

	34%, 100% {
		opacity:0;
	}
}

@keyframes ssa-content-slide-two {
	0%, 28%, 68%, 100% {
		opacity:0;
	}

	34%, 62% {
		opacity:1;
	}
}

@keyframes ssa-content-slide-three {
	0%, 62% {
		opacity:0;
	}

	68%, 94% {
		opacity:1;
	}

	100% {
		opacity:0;
	}
}

@keyframes ssa-content-playhead {
	0% {
		left:0;
	}

	100% {
		left:100%;
	}
}

@keyframes ssa-content-news-one {
	0%, 28% {
		opacity:1;
		transform:translateX(0);
	}

	34%, 100% {
		opacity:0;
		transform:translateX(-5%);
	}
}

@keyframes ssa-content-news-two {
	0%, 28%, 68%, 100% {
		opacity:0;
		transform:translateX(8%);
	}

	34%, 62% {
		opacity:1;
		transform:translateX(0);
	}
}

@keyframes ssa-content-news-three {
	0%, 62% {
		opacity:0;
		transform:translateX(8%);
	}

	68%, 94% {
		opacity:1;
		transform:translateX(0);
	}

	100% {
		opacity:0;
	}
}

@keyframes ssa-content-clip {
	0%, 100% {
		opacity:.62;
		transform:translateY(0);
	}

	20%, 42% {
		opacity:1;
		transform:translateY(-5px);
	}
}

@keyframes ssa-content-progress {
	0% {
		transform:scaleX(0);
	}

	86%, 100% {
		transform:scaleX(1);
	}
}

@keyframes ssa-content-format-short {
	0%, 42%, 100% {
		opacity:1;
		transform:translateY(0) scale(1);
	}

	58%, 88% {
		opacity:.72;
		transform:translateY(3px) scale(.97);
	}
}

@keyframes ssa-content-format-long {
	0%, 42%, 100% {
		opacity:.72;
		transform:translateY(3px) scale(.97);
	}

	58%, 88% {
		opacity:1;
		transform:translateY(0) scale(1);
	}
}

@media (max-width:768px) {

	.ssa-content-shopping{
		height:260px !important
	}

	.ssa-content-slides{
		height:290px !important
	}

	.ssa-content-news{
		height:290px !important;
		overflow:hidden
	}
	
	.ssa-content-story{
		height:260px !important
	}

	.ssa-content-flow-card.ssa-is-active .ssa-content-shopping-track{
		animation:none
	}

	.ssa-content-flow-cards{
		grid-template-columns:1fr;
	}

	.ssa-content-flow{
		padding-top:0;
		padding-bottom:0
	}

	/* ========================================
	   ¸ðµç Ä«µå ºñÁÖ¾ó 1:1 ÅëÀÏ
	======================================== */

	.ssa-content-flow-card-wide .ssa-content-flow-visual,
	.ssa-content-flow-card-tall .ssa-content-flow-visual {
		width:100%;
		height:230px !important;
		aspect-ratio:1 / 0.87 !important
	}

	.ssa-content-news-track img {
		display: block !important;
		flex: 0 0 100% !important;
		width:100% !important;
		height: 180px !important;
		opacity: 1 !important;
		object-fit: contain;
		object-position: center;
	}

	/* ========================================
	   01. ¼îÇÎ Ä«µå
	======================================== */

	.ssa-content-shopping {
		padding:6%;
	}

	.ssa-content-shopping-track {
		grid-template-columns:repeat(3, 32%);
		gap:2.5%;
		height:70%;
		transform:translateY(6%);
	}

	.ssa-content-shopping-track img {
		border-radius:10px;
		box-shadow:0 8px 18px rgb(20 22 30 / 12%);
	}

	.ssa-content-shopping-track img:nth-child(even) {
		transform:translateY(25%);
	}


	/* ========================================
	   02. ½½¶óÀ̵å / ¿µ»ó Á¦ÀÛ Ä«µå
	======================================== */

	.ssa-content-slides {
		align-content:center;
		gap:3%;
		padding:10%;
	}

	.ssa-content-slides-screen {
		width:100%;
		height:auto;
		aspect-ratio:16 / 8;
	}

	.ssa-content-slides-play {
		width:14%;
		max-width:54px;
	}

	.ssa-content-slides-timeline {
		gap:2%;
		height:auto;
		aspect-ratio:8 / 1;
	}

	.ssa-content-slides-timeline i {
		top:-10%;
		height:120%;
	}


	/* ========================================
	   03. ´º½º / SNS Ä«µå
	======================================== */

	.ssa-content-news {
		padding:7%;
	}


	.ssa-content-news-frame {
		width:220px;
		max-height:100%;
		border-radius:18px 18px 0 0;
	}

	.ssa-content-news-head {
		height:auto;
		min-height:42px;
		padding:3% 5%;

		display:none
	}

	.ssa-content-news-scenes {
		width:100%;
		aspect-ratio:1 / .75;
	}

	.ssa-content-news-scenes button {
		width:12%;
		max-width:38px;
		font-size:18px;
	}

	.ssa-content-news-prev {
		left:2%;
	}

	.ssa-content-news-next {
		right:2%;
	}

	.ssa-content-news-hand {
		right:20%;
		top:58%;
		font-size:18px;
	}

	.ssa-content-news-dots {
		gap:6px;
		padding:5%;
	}

	.ssa-content-news-dots i {
		width:7px;
	}


	/* ========================================
	   04. AI / ½ºÅ丮 Ä«µå
	======================================== */

	.ssa-content-story {
		padding:7%;
	}

	.ssa-content-story-panel {
		width:88%;
		padding:6% 5%;
		border-radius:18px;
	}

	.ssa-content-ai-badge {
		right:-5%;
		top:-10%;
		width:15%;
		max-width:54px;
		border-radius:10px;
		font-size:14px;
	}

	.ssa-content-story-clips {
		gap:2%;
	}

	.ssa-content-story-clips > img,
	.ssa-content-story-clips > span {
		aspect-ratio:1.25 / 1;
		border-radius:7px;
	}

	.ssa-content-story-progress {
		height:5px;
		margin-top:5%;
	}

	.ssa-content-story-controls {
		gap:8%;
		margin-top:5%;
		font-size:12px;
	}

	.ssa-content-story-controls > span {
		width:13%;
		max-width:42px;
	}

	.ssa-content-flow-title{
		position:inherit;
		top:auto
	}
}


/* ==================== ±Û·Î¹ú ½ÃÀÛ : ¿µ»ó ¹Ú½º / ÅؽºÆ® ³ëÃâ ==================== */
.ssa-global-video {
	background:#fff;
}

.ssa-global-video-box {
	position:relative;
	height:min(660px, 68vw);
	min-height:460px;
	overflow:hidden;
	border-radius:clamp(28px, 3vw, 54px);
}

.ssa-global-video-box video {
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
}

.ssa-global-video-box .ssa-global-intro-copy {
	top:58%;
	opacity:var(--ssa-global-video-copy-opacity, 0);
	transform:translate(-50%, calc(-50% + var(--ssa-global-video-copy-y, 42px)));
	margin:0 auto;
}

/* ==================== ±Û·Î¹ú Àüȯ : »ç°¢ À̹ÌÁö ¡æ Àüü È­¸é ==================== */
.ssa-global-story {
	position:relative;
	height:300svh;
	background:#fff;
}

.ssa-global-sticky {
	position:sticky;
	top:0;
	height:100svh;
	overflow:hidden;
	background:#fff;
}

.ssa-global-expand-stage {
	position:absolute;
	inset:0;
}

.ssa-global-expand-media img {
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
}

.ssa-global-shade {
	position:absolute;
	inset:0;
	background:linear-gradient(90deg, rgb(0 0 0 / 58%), rgb(0 0 0 / 18%) 68%, rgb(0 0 0 / 8%));
}

.ssa-global-intro-copy {
	position:absolute;
	z-index:2;
	left:50%;
	top:54%;
	color:#fff;
	will-change:opacity, transform;
}

.ssa-global-intro-copy .ssa-title {
	margin:0;
	color:#fff;
}

.ssa-global-intro-copy .ssa-description {
	margin:var(--ssa-space-md) 0 0;
	color:rgb(255 255 255 / 78%);
	line-height:1.7;
}

.ssa-global-expand-stage {
	z-index:3;
	width:100%;
	max-width:none;
}

.ssa-global-copy {
	position:absolute;
	z-index:3;
	left:0;
	right:0;
	margin:0 auto;
	top:50%;
	width:1200px;
	transform:translateY(-50%);
	word-break:keep-all;
	padding-left:var(--space-md);
}

.ssa-global-copy .ssa-title {
	margin:0;
}

.ssa-global-copy-first {
	opacity:var(--ssa-global-first-opacity, 1);
	transform:translateY(calc(-50% + var(--ssa-global-first-y, 24px)));
}

.ssa-global-copy-final {
	color:#fff;
	opacity:var(--ssa-global-final-opacity, 0);
	transform:translateY(calc(-50% + var(--ssa-global-final-y, 28px)));
}

.ssa-global-copy-final .ssa-title {
	color:#fff;
}

.ssa-global-expand-media {
	position:absolute;
	left:var(--ssa-global-media-left, 54vw);
	top:var(--ssa-global-media-top, 18vh);
	width:var(--ssa-global-media-width, 36vw);
	height:var(--ssa-global-media-height, 64vh);
	overflow:hidden;
	border-radius:var(--ssa-global-media-radius, 50px);
	box-shadow:0 30px 70px rgb(25 28 38 / 14%);
	will-change:left, top, width, height, border-radius;
}

.ssa-global-expand-media::after {
	position:absolute;
	inset:0;
	background:rgb(0 0 0 / var(--ssa-global-media-shade, 0));
	content:"";
}

@media (max-width:768px) {
	.ssa-global-video {
		padding:var(--ssa-space-3xl) var(--ssa-space-md) 
	}

	.ssa-global-video-box {
		height:450px;
		min-height:450px;
		border-radius:28px;
	}

	.ssa-global-story {
		display:flex;
		flex-direction:column;
		justify-content:center;
		height: auto;
		padding:0 var(--ssa-space-3xl) ;
		background: var(--ssa-color-white);
	}

	.ssa-global-sticky {
		position: relative;
		top: auto;
		height: auto;
		overflow: visible;
		background: var(--ssa-color-white);
	}

	.ssa-global-expand-stage {
		position: relative;
		inset: auto;
		display: flex;
		flex-direction: column;
		align-items: center;
		gap:30px;
		width: 100%;
		padding: 0;
	}

	.ssa-global-intro-copy {
		top:50%;
		bottom:auto;
		padding-inline:22px;
		transform:translate(-50%, var(--ssa-global-video-copy-y, 42px));
		text-align:center
	}

	.ssa-global-intro-copy .ssa-description {
		font-size:14px;
	}

	.ssa-global-copy {
		left:24px;
		top:18%;
		width:calc(100% - 48px);
		transform:none;
	}

	.ssa-global-copy-first {
		display: none;
	}

	.ssa-global-copy-final {
		position: relative;
		left: auto;
		top: auto;
		order: 1;
		width: 100%;
		color: var(--ssa-color-black);
		text-align: center;
		opacity: 1;
		transform: none;
	}

	.ssa-global-copy-final .ssa-title {
		color: var(--ssa-color-black);
	}

	.ssa-global-expand-media {
		position: relative;
		left: auto;
		top: auto;
		order: 2;
		width: min(100%, 420px);
		height: auto;
		aspect-ratio: 5 / 6;
		border-radius: 20px;
	}

	.ssa-global-expand-media::after {
		display: none;
	}

	.ssa-global-expand-media img {
		object-position: center;
	}
}


/* ==================== ÆîÃÄÁø ¼îÃ÷ : ¹®±¸ Àüȯ / Ä«µå ½ºÅ©·Ñ ==================== */
.ssa-link-showcase {
	position:relative;
	height:500vh;
	background:var(--ssa-color-black);
	color:var(--ssa-color-white);
}

.ssa-link-showcase-sticky {
	position:sticky;
	top:0;
	height:100svh;
	overflow:hidden;
}

.ssa-link-showcase-stage {
	position:relative;
	width:100%;
	height:100%;
	overflow:hidden;
}

.ssa-link-showcase-copy {
	position:absolute;
	z-index:3;
	left:50%;
	top:50%;
	width:var(--ssa-contents-width-in);
	text-align:center;
	transform:translate(-50%, -50%);
	pointer-events:none;
}

.ssa-link-showcase-heading {
	position:absolute;
	left:50%;
	top:0;
	width:100%;
	margin:0;
	word-break:keep-all;
	will-change:opacity, transform;
}

.ssa-link-showcase-heading span,
.ssa-link-showcase-heading em {
	color:var(--ssa-color-main);
	font-style:normal;
}

.ssa-link-showcase-heading .ssa-link-showcase-type-line {
	color:inherit;
}

.ssa-link-showcase-heading .ssa-link-showcase-type-letter {
	position:relative;
	color:var(--ssa-color-sub-text);
}

.ssa-link-showcase-heading .ssa-link-showcase-type-letter.ssa-is-visible {
	color:var(--ssa-color-white);
}

.ssa-link-showcase-heading .ssa-link-showcase-type-letter.ssa-is-cursor {
	box-shadow:none;
}

.ssa-link-showcase-heading .ssa-link-showcase-type-letter.ssa-is-cursor::after {
	position:absolute;
	right:-3px;
	top:.08em;
	width:2px;
	height:.9em;
	border-radius:var(--ssa-radius-full);
	background:var(--ssa-color-white);
	content:"";
}

.ssa-link-showcase-heading-first {
	opacity:var(--ssa-link-showcase-first-opacity, 1);
	transform:translate(-50%, calc(-50% + var(--ssa-link-showcase-first-y, 0px)));
}

.ssa-link-showcase-heading-second {
	opacity:var(--ssa-link-showcase-second-opacity, 0);
	transform:translate(-50%, calc(-50% + var(--ssa-link-showcase-second-y, 24px)));
}

.ssa-link-showcase-register {
	position:absolute;
	left:50%;
	top:clamp(72px, 7vw, 90px);
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:var(--ssa-gap-sm);
	width:min(350px, 100%);
	box-sizing:border-box;
	padding:var(--ssa-space-2xs);
	padding-left:var(--ssa-space-lg);
	border:0;
	border-radius:var(--ssa-radius-full);
	background:var(--ssa-color-white);
	opacity:var(--ssa-link-showcase-register-opacity, 1);
	transform:translateX(-50%);
	transition:opacity .1s linear;
}

.ssa-link-showcase-url {
	flex:1;
	padding:0;
	color:var(--ssa-color-main);
	font-size:var(--ssa-font-size-sm);
	font-weight:700;
	text-align:left;
}

.ssa-link-showcase-button {
	position:relative;
	padding:var(--ssa-space-xs) var(--ssa-space-sm);
	border-radius:var(--ssa-radius-full);
	background:var(--ssa-color-main);
	color:var(--ssa-color-white);
	font-size:var(--ssa-font-size-sm);
	font-weight:700;
	transform:scale(var(--ssa-link-showcase-button-scale, 1));
}

.ssa-link-showcase-cursor {
	position:absolute;
	z-index:2;
	left:60%;
	top:65%;
	display:block;
	width:32px;
	height:40px;
	opacity:var(--ssa-link-showcase-cursor-opacity, 0);
	transform:translate(var(--ssa-link-showcase-cursor-x, 64px), var(--ssa-link-showcase-cursor-y, 52px)) scale(var(--ssa-link-showcase-cursor-scale, 1));
	transform-origin:3px 2px;
	filter:drop-shadow(0 3px 3px rgb(0 0 0 / 25%));
	will-change:opacity, transform;
}

.ssa-link-showcase-cursor svg {
	display:block;
	width:100%;
	height:100%;
}

.ssa-link-showcase-click-ring {
	position:absolute;
	left:60%;
	top:65%;
	width:30px;
	height:30px;
	border:2px solid var(--ssa-color-white);
	border-radius:var(--ssa-radius-full);
	opacity:var(--ssa-link-showcase-ring-opacity, 0);
	transform:translate(-50%, -50%) scale(var(--ssa-link-showcase-ring-scale, .5));
	pointer-events:none;
}

.ssa-link-showcase-cards {
	position:absolute;
	z-index:2;
	inset:0;
	transform:translate3d(0, var(--ssa-link-showcase-cards-y, 0), 0);
	will-change:transform;
}

.ssa-link-showcase-card {
	position:absolute;
	width:clamp(128px, 13vw, 240px);
	aspect-ratio:.72;
	margin:0;
	overflow:hidden;
	border-radius:var(--ssa-radius-50);
	background:var(--ssa-color-gray-light);
	box-shadow:0 var(--ssa-space-sm) var(--ssa-space-xl) rgb(0 0 0 / 24%);
	filter:grayscale(calc(1 - var(--ssa-link-showcase-card-active, 0))) brightness(calc(.55 + var(--ssa-link-showcase-card-active, 0) * .45));
	opacity:calc(.32 + var(--ssa-link-showcase-card-active, 0) * .68);
	transform:translate(-50%, -50%) scale(calc(.92 + var(--ssa-link-showcase-card-active, 0) * .08));
	transform-origin:center;
	will-change:filter, opacity, transform;
}

.ssa-link-showcase-card::after {
	position:absolute;
	inset:48% 0 0;
	background:linear-gradient(180deg, transparent, rgb(0 0 0 / 74%));
	content:"";
}

.ssa-link-showcase-card img,
.ssa-link-showcase-card video {
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
}

.ssa-link-showcase-card figcaption {
	position:absolute;
	z-index:1;
	left:var(--ssa-space-sm);
	bottom:var(--ssa-space-sm);
	color:var(--ssa-color-white);
	font-size:var(--ssa-font-size-base);
	font-weight:700;
}

.ssa-link-showcase-card:nth-child(1) { left:7%; top:24%; width:calc(clamp(128px, 13vw, 240px) * .8); }
.ssa-link-showcase-card:nth-child(2) { left:23%; top:82%; }
.ssa-link-showcase-card:nth-child(3) { left:37%; top:2%; width:calc(clamp(128px, 13vw, 240px) * .9); }
.ssa-link-showcase-card:nth-child(4) { left:88%; top:25%; }
.ssa-link-showcase-card:nth-child(5) { left:94%; top:6%; width:calc(clamp(128px, 13vw, 240px) * .8); }
.ssa-link-showcase-card:nth-child(6) { left:87%; top:85%; }
.ssa-link-showcase-card:nth-child(7) { left:70%; top:103%; width:calc(clamp(128px, 13vw, 240px) * .9); }
.ssa-link-showcase-card:nth-child(8) { left:4%; top:103%; width:calc(clamp(128px, 13vw, 240px) * .8); }
.ssa-link-showcase-card:nth-child(9) { left:12%; top:138%; width:calc(clamp(128px, 13vw, 240px) * .8); }
.ssa-link-showcase-card:nth-child(10) { left:27%; top:155%; }
.ssa-link-showcase-card:nth-child(11) { left:75%; top:132%; width:calc(clamp(128px, 13vw, 240px) * .9); }
.ssa-link-showcase-card:nth-child(12) { left:94%; top:164%; width:calc(clamp(128px, 13vw, 240px) * .8); }

@media (max-width:768px) {
	.ssa-link-showcase {
		height:auto;
		padding:var(--ssa-space-3xl) var(--ssa-space-sm) var(--ssa-space-4xl);
	}

	.ssa-link-showcase-sticky {
		position:relative;
		height:auto;
		overflow:visible;
	}

	.ssa-link-showcase-stage {
		height:auto;
		overflow:visible;
	}

	.ssa-link-showcase-copy {
		position:relative;
		left:auto;
		top:auto;
		display:flex;
		flex-direction:column;
		align-items:center;
		width:100%;
		transform:none;
	}

	.ssa-link-showcase-heading {
		position:relative;
		left:auto;
		top:auto;
		transform:none;
	}

	.ssa-link-showcase-heading-first {
		display:block;
		order:1;
		opacity:1;
		transform:none;
	}

	.ssa-link-showcase-register {
		position:relative;
		left:auto;
		top:auto;
		display:flex;
		order:2;
		width:min(100%, 280px);
		height:52px;
		margin-top:var(--ssa-space-sm);
		padding-left:var(--ssa-space-sm);
		opacity:1;
		transform:none;
	}

	.ssa-link-showcase-url,
	.ssa-link-showcase-button {
		font-size:var(--ssa-font-size-base);
	}

	.ssa-link-showcase-cursor {
		left:auto;
		right:-8px;
		top:60%;
		width:24px;
		height:30px;
		opacity:1;
		transform:none;
	}

	.ssa-link-showcase-type-letter {
		visibility:visible;
	}


	.ssa-link-showcase-heading-second {
		order:3;
		margin-top:var(--ssa-space-3xl);
		opacity:1;
		transform:none;
	}

	.ssa-link-showcase-cards {
		position:relative;
		display:block;
		width:min(100%, 360px);
		height:240px;
		margin:var(--ssa-space-lg) auto 0;
		transform:none;
	}

	.ssa-link-showcase-card,
	.ssa-link-showcase-card:nth-child(n) {
		display:none;
	}

	.ssa-link-showcase-card:nth-child(10),
	.ssa-link-showcase-card:nth-child(6),
	.ssa-link-showcase-card:nth-child(1) {
		position:absolute;
		top:50%;
		display:block;
		width:clamp(112px, 34vw, 138px);
		border-radius:var(--ssa-radius-30);
		filter:none;
		opacity:1;
		transform:translate(-50%, -50%);
	}

	.ssa-link-showcase-card:nth-child(10) {
		z-index:1;
		left:28%;
		top:55%;
	}

	.ssa-link-showcase-card:nth-child(6) {
		z-index:3;
		left:50%;
	}

	.ssa-link-showcase-card:nth-child(1) {
		z-index:2;
		left:72%;
		top:55%;
	}
}

@media (min-width:769px) and (prefers-reduced-motion:reduce) {
	.ssa-link-showcase-heading-first {
		display:none;
	}

	.ssa-link-showcase-heading-second {
		opacity:1;
		transform:translate(-50%, -50%);
	}

	.ssa-link-showcase-cards {
		transform:none;
		will-change:auto;
	}

	.ssa-link-showcase-register {
		display:none;
	}

	.ssa-link-showcase-card {
		filter:none;
		opacity:1;
		transform:none;
	}
}


/* ==================== ÃÖÁ¾ CTA ==================== */
.ssa-final-cta {
	position:relative;
	display:grid;
	place-items:center;
	min-height:100svh;
	overflow:hidden;
	background:var(--ssa-color-black);
	color:var(--ssa-color-white);
	margin-top:var(--space-3xl)

}

.ssa-final-cta-gallery {
	position:absolute;
	left:50%;
	top:50%;
	width:var(--ssa-container-width-max);
	height:min(52vw, 620px);
	perspective:1400px;
	transform-style:preserve-3d;
	transform:translate(-50%, -50%);
}

.ssa-final-cta-card {
	position:absolute;
	top:50%;
	aspect-ratio:16 / 9;
	margin:0;
	overflow:hidden;
	border-radius:var(--ssa-radius-30);
	background:var(--ssa-color-gray);
	box-shadow:0 var(--ssa-space-lg) var(--ssa-space-3xl) rgb(0 0 0 / 54%);
	transform:translateY(-50%);
	transform-style:preserve-3d;
}

.ssa-final-cta-card::after {
	position:absolute;
	inset:0;
	background:linear-gradient(180deg, rgb(3 13 28 / 30%) 0, transparent 24%, rgb(0 0 0 / 18%) 100%);
	content:"";
	pointer-events:none;
}

.ssa-final-cta-card img {
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
}

.ssa-final-cta-card-main {
	z-index:2;
	left:50%;
	width:min(36vw, 547px);
	filter:brightness(.78) saturate(.92);
	transform:translate3d(-50%, -50%, 80px);
}

.ssa-final-cta-card-left,
.ssa-final-cta-card-right {
	z-index:1;
	width:min(34vw, 520px);
	filter:blur(3px) brightness(.58) saturate(.72);
	opacity:.82;
}

.ssa-final-cta-card-left {
	left:4%;
	transform:translateY(-50%) rotateY(10deg) translateZ(-130px);
	transform-origin:right center;
}

.ssa-final-cta-card-right {
	right:4%;
	transform:translateY(-50%) rotateY(-10deg) translateZ(-130px);
	transform-origin:left center;
}

.ssa-final-cta-card-left-back,
.ssa-final-cta-card-right-back {
	z-index:0;
	width:min(27vw, 420px);
	filter:blur(7px) brightness(.40) saturate(.58);
	opacity:.62;
}

.ssa-final-cta-card-left-back {
	left:-5%;
	transform:translateY(-50%) rotateY(13deg) translateZ(-230px);
	transform-origin:right center;
}

.ssa-final-cta-card-right-back {
	right:-5%;
	transform:translateY(-50%) rotateY(-13deg) translateZ(-230px);
	transform-origin:left center;
}

.ssa-final-cta-shade {
	position:absolute;
	z-index:3;
	inset:0;
	background:
		radial-gradient(ellipse 48% 42% at 50% 50%, rgb(0 0 0 / 12%) 0, rgb(0 0 0 / 38%) 64%, rgb(0 0 0 / 78%) 100%),
		linear-gradient(180deg, var(--ssa-color-black) 0, transparent 28%, transparent 68%, var(--ssa-color-black) 100%),
		linear-gradient(90deg, var(--ssa-color-black) 0, transparent 28%, transparent 72%, var(--ssa-color-black) 100%);
	pointer-events:none;
}

.ssa-final-cta-copy {
	position:relative;
	z-index:4;
	width:var(--ssa-contents-width-inner);
	text-align:center;
	display:flex;
	flex-direction:column;
	align-items:center;
}

.ssa-final-cta-eyebrow {
	margin:0 0 var(--ssa-space-sm);
	color:rgb(255 255 255 / 68%);
	font-size:var(--ssa-font-size-base);
	font-weight:700;
	letter-spacing:.18em;
}

.ssa-final-cta-copy .ssa-title {
	margin:0;
	font-size:var(--ssa-font-size-2xl);
	line-height:var(--ssa-line-height-title);
	word-break:keep-all;
}

.ssa-final-cta-button {
	display:inline-flex;
	align-items:center;
	gap:var(--ssa-gap-sm);
	margin-top:var(--ssa-space-xl);
	padding:var(--ssa-space-xs) var(--ssa-space-sm) var(--ssa-space-xs) var(--ssa-space-md);
	border-radius:var(--ssa-radius-full);
	background:var(--ssa-color-white);
	color:var(--ssa-color-black);
	font-size:var(--ssa-font-size-xs);
	font-weight:700;
	text-decoration:none;
}

.ssa-final-cta-button.bl{
	background:var(--color-black);
	color:#fff;
	margin:0 auto;
}

.ssa-final-cta-button.bl span {
	color:var(--color-black);
	background:#fff
}

.ssa-final-cta-button span {
	display:grid;
	place-items:center;
	width:clamp(32px, 2.8vw, 44px);
	aspect-ratio:1;
	border-radius:var(--ssa-radius-full);
	background:var(--ssa-color-black);
	color:var(--ssa-color-white);
	transition:transform .25s ease;
}

.ssa-final-cta-button:hover span {
	transform:rotate(45deg);
}

@media (max-width:768px) {
	.ssa-final-cta {
		min-height:500px;
	}

	.ssa-final-cta-gallery {
		height:56svh;
	}

	.ssa-final-cta-card-main {
		width:52vw;
		transform:translate3d(-50%, -50%, 40px);
	}

	.ssa-final-cta-card-left,
	.ssa-final-cta-card-right {
		width:48vw;
	}

	.ssa-final-cta-card-left {
		left:-20%;
		transform:translateY(-50%) rotateY(8deg) translateZ(-80px);
	}

	.ssa-final-cta-card-right {
		right:-20%;
		transform:translateY(-50%) rotateY(-8deg) translateZ(-80px);
	}

	.ssa-final-cta-card-left-back,
	.ssa-final-cta-card-right-back {
		width:40vw;
	}

	.ssa-final-cta-card-left-back {
		left:-34%;
	}

	.ssa-final-cta-card-right-back {
		right:-34%;
	}

	.ssa-final-cta-copy .ssa-title {
		font-size:var(--ssa-font-size-xl);
	}
}


/* ==================== ¸µÅ© µî·Ï ¡æ Æȸ®´Â ¼îÃ÷ : ½Å±Ô Àüȯ ==================== */
.ssa-link-reveal {
	position:relative;
	height:520svh;
	background:var(--ssa-color-black);
	color:var(--ssa-color-white);

}

.ssa-link-reveal::after {
    content: "";

    position: absolute;
    top: -1px;
    left: 0;

    width: 100%;
    height: 280px;

    background: linear-gradient(
        180deg,
        #000 0%,
        #000 5%,
        rgba(0, 0, 0, .92) 18%,
        rgba(0, 0, 0, .68) 38%,
        rgba(0, 0, 0, .35) 60%,
        rgba(0, 0, 0, .12) 78%,
        rgba(0, 0, 0, 0) 100%
    );

    pointer-events: none;
    z-index: 10;
}

.ssa-link-reveal-sticky {
	position:sticky;
	top:0;
	height:100svh;
	overflow:hidden;
}

.ssa-link-reveal-stage {
	position:relative;
	width:100%;
	height:100%;
	overflow:hidden;
}

.ssa-link-reveal-cards {
	position:absolute;
	inset:0;
	z-index:2;
	opacity:var(--ssa-link-reveal-cards-opacity, .18);
	transform:translate3d(0, var(--ssa-link-reveal-cards-y, 0), 0);
	will-change:opacity, transform;
}

.ssa-link-reveal-card {
	position:absolute;
	width:clamp(104px, 10.4vw, 192px);
	aspect-ratio:.72;
	margin:0;
	overflow:hidden;
	border-radius:var(--ssa-radius-30);
	background:var(--ssa-color-gray-light);
	box-shadow:0 var(--ssa-space-sm) var(--ssa-space-xl) color-mix(in srgb, var(--ssa-color-black) 24%, transparent);
	filter:grayscale(var(--ssa-link-reveal-card-gray, 1)) brightness(var(--ssa-link-reveal-card-light, .55));
	transform:translate(-50%, -50%) scale(var(--ssa-link-reveal-card-scale, .92));
	will-change:filter, transform;
}

.ssa-link-reveal-card::after {
	position:absolute;
	inset:48% 0 0;
	background:linear-gradient(180deg, transparent, color-mix(in srgb, var(--ssa-color-black) 74%, transparent));
	content:"";
}

.ssa-link-reveal-card img,
.ssa-link-reveal-card video,
.ssa-link-reveal-feature video {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
	transform: scale(1.08);
}

.ssa-link-reveal-card figcaption {
	position:absolute;
	z-index:1;
	left:var(--ssa-space-sm);
	bottom:var(--ssa-space-sm);
	color:var(--ssa-color-white);
	font-size:var(--ssa-font-size-base);
	font-weight:700;
}

.ssa-link-reveal-card:nth-child(1) {
	left:7%;
	top:24%;
	width:clamp(83px, 8.32vw, 154px);
}

.ssa-link-reveal-card:nth-child(2) {
	left:23%;
	top:82%;
}

.ssa-link-reveal-card:nth-child(3) {
	left:37%;
	top:2%;
	width:clamp(94px, 9.36vw, 173px);
}

.ssa-link-reveal-card:nth-child(4) {
	left:88%;
	top:25%;
}

.ssa-link-reveal-card:nth-child(5) {
	left:94%;
	top:6%;
	width:clamp(83px, 8.32vw, 154px);
}

.ssa-link-reveal-card:nth-child(6) {
	left:87%;
	top:85%;
}

.ssa-link-reveal-card:nth-child(7) {
	left:70%;
	top:112%;
	width:clamp(94px, 9.36vw, 173px);
}

.ssa-link-reveal-card:nth-child(8) {
	left:4%;
	top:118%;
	width:clamp(83px, 8.32vw, 154px);
}

.ssa-link-reveal-card:nth-child(9) {
	left:12%;
	top:158%;
	width:clamp(83px, 8.32vw, 154px);
}

.ssa-link-reveal-card:nth-child(10) {
	left:27%;
	top:182%;
}

.ssa-link-reveal-card:nth-child(11) {
	left:75%;
	top:152%;
	width:clamp(94px, 9.36vw, 173px);
}

.ssa-link-reveal-card:nth-child(12) {
	left:94%;
	top:190%;
	width:clamp(83px, 8.32vw, 154px);
}

.ssa-link-reveal-feature {
	position:absolute;
	left:var(--ssa-link-reveal-feature-left, 50%);
	top:var(--ssa-link-reveal-feature-top, 50%);
	z-index:1;
	width:var(--ssa-link-reveal-feature-width, min(calc(100vw - var(--ssa-space-md)), 1200px));
	height:var(--ssa-link-reveal-feature-height, min(67.5vw, 675px));
	margin:0;
	overflow:hidden;
	border-radius:var(--ssa-link-reveal-feature-radius, var(--ssa-radius-50));
	background:var(--ssa-color-black);
	box-shadow:0 var(--ssa-space-md) var(--ssa-space-2xl) color-mix(in srgb, var(--ssa-color-black) 32%, transparent);
	transform:translate(-50%, calc(-50% + var(--ssa-link-reveal-cards-y, 0)));
	will-change:left, top, width, height, border-radius, transform;
}

.ssa-link-reveal-feature-shade {
	position:absolute;
	inset:0;
	background:var(--ssa-color-black);
	opacity:var(--ssa-link-reveal-feature-shade, .48);
}

.ssa-link-reveal-intro {
	position:absolute;
	left:50%;
	top:50%;
	z-index:3;
	width:var(--ssa-contents-width-in);
	text-align:center;
	opacity:var(--ssa-link-reveal-intro-opacity, 1);
	transform:translate(-50%, calc(-50% + var(--ssa-link-reveal-intro-y, 0px)));
	pointer-events:none;
}

.ssa-link-reveal-intro .ssa-title {
	margin:0;
	color:var(--ssa-color-white);
	line-height:var(--ssa-line-height-title);
	word-break:keep-all;
}

.ssa-link-reveal-register {
	position:relative;
	display:flex;
	align-items:center;
	justify-content:space-between;
	gap:var(--ssa-gap-sm);
	width:min(390px, 100%);
	box-sizing:border-box;
	margin:var(--ssa-space-lg) auto 0;
	padding:var(--ssa-space-2xs);
	padding-left:var(--ssa-space-lg);
	border-radius:var(--ssa-radius-full);
	background:var(--ssa-color-white);
	color:var(--ssa-color-main);
	box-shadow:0 var(--ssa-space-xs) var(--ssa-space-lg) color-mix(in srgb, var(--ssa-color-main) 24%, transparent);
	font-size:var(--ssa-font-size-sm);
	font-weight:700;
	text-align:left;
}

.ssa-link-reveal-register > span {
	flex:1;
	padding:0;
	font-size:var(--ssa-font-size-sm);
}

.ssa-link-reveal-register strong {
	position:relative;
	padding:var(--ssa-space-xs) var(--ssa-space-sm);
	border-radius:var(--ssa-radius-full);
	background:var(--ssa-main-gradient-w);
	color:var(--ssa-color-white);
	transform:scale(var(--ssa-link-reveal-button-scale, 1));
}

.ssa-link-reveal-cursor {
	position:absolute;
	z-index:2;
	left:60%;
	top:65%;
	right:auto;
	bottom:auto;
	display:block;
	width:32px;
	height:40px;
	opacity:var(--ssa-link-reveal-cursor-opacity, 0);
	transform:translate(var(--ssa-link-reveal-cursor-x, 56px), var(--ssa-link-reveal-cursor-y, 48px));
	transform-origin:3px 2px;
	filter:drop-shadow(0 3px 3px rgb(0 0 0 / 25%));
	font-style:normal;
	will-change:opacity, transform;
}

.ssa-link-reveal-cursor svg {
	display:block;
	width:100%;
	height:100%;
}

.ssa-link-reveal-message {
	position:absolute;
	left:50%;
	top:50%;
	z-index:4;
	width:var(--ssa-contents-width-in);
	margin:0;
	color:var(--ssa-color-white);
	line-height:var(--ssa-line-height-title);
	text-align:center;
	transform:translate(-50%, -50%);
	pointer-events:none;
}

.ssa-link-reveal-message span {
	display:block;
	opacity:0;
	transform:translateY(var(--ssa-space-md));
	transition:opacity .45s ease, transform .45s ease;
	will-change:opacity, transform;
}

.ssa-link-reveal-message.ssa-is-visible span {
	opacity:1;
	transform:translateY(0);
}

.ssa-link-reveal-message.ssa-is-visible span:nth-child(1) {
	transition-delay:0s;
}

.ssa-link-reveal-message.ssa-is-visible span:nth-child(2) {
	transition-delay:.32s;

}

.ssa-link-reveal-message.ssa-is-visible span:nth-child(3) {
	transition-delay:.64s;
}

.ssa-link-reveal-message em {
	color:var(--ssa-color-main);
	font-style:normal;
}



.ssa-link-reveal-subtext {
	position: absolute;
	left: 50%;
	top: 50%;
	z-index: 4;
	display: flex;
	flex-direction: column;
	gap: var(--space-md);
	width: var(--contents-width-in);
	margin: 0;
	color: var(--color-white);
	font-size: var(--font-size-lg);
	line-height: var(--line-height-text);
	text-align: center;
	opacity: 0;
	transform: translate(-50%, calc(-50% + var(--space-md)));
	transition: opacity .55s ease, transform .55s ease;
	pointer-events: none;
}

.ssa-link-reveal-subtext span {
	display: block;
}

.ssa-link-reveal-subtext.ssa-is-visible {
	opacity: 1;
	transform: translate(-50%, -50%);
}




@media (max-width:768px) {
	.ssa-link-reveal {
		height:auto;
		padding:0 var(--ssa-space-sm) 0 var(--ssa-space-sm);
		display: flex;
		flex-direction: column;
		justify-content: center; /* ¼¼·Î °¡¿îµ¥ */
	}

	.ssa-link-reveal:after{
		display:none
	}

	.ssa-link-reveal-sticky {
		position:relative;
		height:auto;
		overflow:visible;
	}

	.ssa-link-reveal-stage {
		display:flex;
		flex-direction:column;
		height:auto;
		overflow:visible;
	}

	.ssa-link-reveal-feature {
		position:relative;
		left:auto;
		top:auto;
		order:1;
		width:100%;
		height:100px;
		aspect-ratio:1.3;
		border-radius:var(--ssa-radius-30);
		transform:none;
	}

	.ssa-link-reveal-intro {
		position:absolute;
		left:50%;
		top:clamp(30px, 15vw, 220px);
		width:calc(100% - var(--ssa-space-md));
		opacity:1;
		transform:translate(-50%, -50%);
	}


	.ssa-link-reveal-register {
		width:min(100%, 280px);
		margin-top:var(--ssa-space-sm);
		font-size:var(--ssa-font-size-base);
	}

	.ssa-link-reveal-cursor {
		opacity:1;
		transform:none;
	}

	.ssa-link-reveal-message {
		position:relative;
		left:auto;
		top:auto;
		order:2;
		width:100%;
		margin:var(--ssa-space-xl) 0 var(--ssa-space-lg);
		transform:none;
	}

	.ssa-link-reveal-message span,
	.ssa-link-reveal-message span:nth-child(n) {
		opacity:1;
		transform:none;
	}

	.ssa-link-reveal-cards {
		position:relative;
		order:3;
		width:min(100%, 360px);
		height:150px;
		margin-inline:auto;
		opacity:1;
		transform:none;
	}

	.ssa-link-reveal-card,
	.ssa-link-reveal-card:nth-child(n) {
		display:none;
	}

	.ssa-link-reveal-card:nth-child(10),
	.ssa-link-reveal-card:nth-child(6),
	.ssa-link-reveal-card:nth-child(1) {
		position:absolute;
		top:50%;
		display:block;
		width:clamp(96px, 30vw, 124px);
		border-radius:var(--ssa-radius-30);
		filter:none;
		transform:translate(-50%, -50%);
	}

	.ssa-link-reveal-card:nth-child(10) {
		z-index:1;
		left:28%;
	}

	.ssa-link-reveal-card:nth-child(6) {
		z-index:3;
		left:50%;
	}

	.ssa-link-reveal-card:nth-child(1) {
		z-index:2;
		left:72%;
	}

	.ssa-link-reveal-subtext {
		position: relative;
		left: auto;
		top: auto;
		order: 3;
		width: 100%;
		margin: 0 0 0;
		opacity: 1;
		transform: none;
		font-size:var(--font-size-sm)
	}

	.ssa-link-reveal-stage > .ssa-link-reveal-cards {
		order: 4;
	}

	.ssa-link-reveal-message{
		font-size:var(--font-size-md)
	}


}


/* ==================== ǪÅÍ ==================== */

.ssa-footer {
	background:var(--ssa-color-white);
	color:var(--ssa-color-black);
}


/* ====================
   ±âº» ·¹À̾ƿô
==================== */

.ssa-footer-inner {
	display:grid;
	grid-template-columns:
		minmax(280px, .8fr)
		minmax(560px, 1.2fr);
	gap:var(--ssa-space-3xl);
	width: 1920px;
    max-width: 100%;
    margin: 0 auto;
	padding:var(--ssa-space-3xl) var(--ssa-space-lg) ;
}


/* ====================
   ½½·Î°Ç
==================== */

.ssa-footer-slogan {
	margin:0;

	font-size:var(--ssa-font-size-xl);
	font-weight:600;
	line-height:var(--ssa-line-height-title);

	word-break:keep-all;
}

.ssa-footer-slogan span {
	color:var(--ssa-color-main);
}


/* ====================
   ¿ìÃø ÄÜÅÙÃ÷
==================== */

.ssa-footer-content {
	display:flex;
	flex-direction:column;
	align-items:flex-end;

	gap:var(--ssa-space-xl);

	text-align:right;
}


/* ====================
   ¸Þ´º
==================== */

.ssa-footer-nav {
	display:flex;
	flex-wrap:wrap;
	justify-content:flex-end;

	column-gap:var(--ssa-gap-md);
	row-gap:var(--ssa-gap-sm);
}


.ssa-footer-nav a,
.ssa-footer-business-button {
	padding:0;

	border:0;
	background:none;

	color:inherit;

	font:inherit;
	font-size:var(--ssa-font-size-xs);
	font-weight:600;

	text-decoration:none;

	cursor:pointer;
}


/* ====================
   »ç¾÷ÀÚ Á¤º¸ ¹öÆ°
==================== */

.ssa-footer-business-button {
	display:inline-flex;
	align-items:center;

	gap:var(--ssa-gap-xs);
}


.ssa-footer-business-icon {
	display:inline-flex;
	align-items:center;
	justify-content:center;

	color:var(--ssa-color-main);

	font-size:var(--ssa-font-size-base);
	font-weight:500;
	line-height:1;

	transition:transform .25s ease;
}


/* ¿­·ÈÀ» ¶§ ¾ÆÀÌÄÜ »ì¦ ȸÀü */
.ssa-footer-business-button[aria-expanded="true"]
.ssa-footer-business-icon {
	transform:rotate(180deg);
}


/* ====================
   ¼­ºñ½º ¾È³»
==================== */

.ssa-footer-guide strong {
	display:block;

	font-size:var(--ssa-font-size-xs);
	line-height:var(--ssa-line-height-title);
}


.ssa-footer-guide p {
	margin:var(--ssa-space-xs) 0 0;
	font-size:var(--ssa-font-size-base);
	line-height:var(--ssa-line-height-text);
	color:var(--color-gray)
}


/* ====================
   copyright
==================== */

.ssa-footer-copyright {
	margin:0;

	color:var(--ssa-color-gray);

	font-size:var(--ssa-font-size-base);
}


/* ====================
   »ç¾÷ÀÚ Á¤º¸ ÆгÎ
==================== */

.ssa-footer-business {
	width:100%;

	max-height:0;

	overflow:hidden;

	background:#141416;
	color:var(--ssa-color-white);

	opacity:0;

	text-align:left;

	transition:
		max-height .45s ease,
		opacity .3s ease;
}


/*
hidden »óÅ¿¡¼­´Â DOM ·¹À̾ƿô¿¡¼­ Á¦°Å
*/
.ssa-footer-business[hidden] {
	display:none;
}


/*
OPEN
*/
.ssa-footer-business.ssa-is-open {
	max-height:280px;
	opacity:1;
}


/* ====================
   »ç¾÷ÀÚÁ¤º¸ ¾ÈÂÊ
==================== */

.ssa-footer-business-inner {
	width:var(--ssa-contents-width-inner);

	margin:0 auto;

	padding:
		var(--ssa-space-md)
		0;
}


.ssa-footer-business-inner strong {
	display:block;

	margin-bottom:var(--ssa-space-sm);

	font-size:var(--ssa-font-size-xs);
}


.ssa-footer-business-inner div {
	display:flex;
	flex-wrap:wrap;

	gap:var(--ssa-gap-lg);

	font-size:var(--ssa-font-size-base);
}


/* ====================
   MOBILE
==================== */

@media (max-width:768px) {

	.ssa-footer {
		padding-bottom:var(--ssa-space-4xl) ;
	}


	.ssa-footer-inner {
		grid-template-columns:minmax(0, 1fr);

		gap:var(--ssa-space-xl);

		padding-block:0;
		padding-inline:var(--ssa-space-md);
	}


	.ssa-footer-content {
		align-items:flex-start;

		gap:var(--ssa-space-lg);

		text-align:left;
	}


	.ssa-footer-nav {
		justify-content:flex-start;
	}


	.ssa-footer-guide br {
		display:none;
	}


	.ssa-footer-business-inner {
		width:100%;

		padding:
			var(--ssa-space-sm)
			var(--ssa-space-xs);
	}


	.ssa-footer-business-inner div {
		flex-direction:column;

		gap:var(--ssa-gap-xs);
	}


	.ssa-footer-business.ssa-is-open {
		max-height:400px;
	}

}


/*½ºÅ©·Ñ ´Ù¿î*/
.scroll-guide-wrap {
	position:relative;
}
.scroll-guide-wrap .scroll-guide {
position:absolute;
left:0;
right:0;
top:0;
bottom:0;
display: flex;
flex-direction: column;
align-items: center;
gap: 8px;
height:55px;
margin:30px 0;
font-size: 12px;
letter-spacing: 0.12em;
color:var(--ssa-color-gray);
z-index: 10;
}

.scroll-guide-wrap .scroll-guide i {
	font-size: 11px;
	animation: scrollDown 1.4s ease-in-out infinite;
}

@keyframes scrollDown {
	0%, 100% {
		transform: translateY(0);
		opacity: .4;
	}
	50% {
		transform: translateY(6px);
		opacity: 1;
	}
}


/* ==================== ÀÚµ¿ ¾÷·Îµå : ¿ÞÂÊ °íÁ¤ / ¿À¸¥ÂÊ ºó Ä«µå ==================== */
.ssa-publish-results {
	position:absolute;
	inset:0;
	z-index:7;
	padding-block:var(--ssa-space-3xl);
	color:var(--ssa-color-white);
	opacity:var(--ssa-publish-results-opacity, 0);
	pointer-events:none;
}

.ssa-publish-results-inner {
	display:grid;
	grid-template-columns:minmax(0, .8fr) minmax(0, 1.2fr);
	align-items:start;
	gap:var(--ssa-space-2xl);
	height:100%;
	overflow:visible;
}

.ssa-publish-results-copy {
	position:relative;
	align-self:start;
	margin-top:calc(100px + var(--ssa-space-md));
	word-break:keep-all;
	opacity:var(--ssa-publish-results-copy-opacity, 0);
	transform:translateY(var(--ssa-publish-results-copy-y, 30px));
	will-change:transform;
}

.ssa-publish-result-copy-panel {
	position:absolute;
	left:0;
	top:0;
	width:100%;
	opacity:var(--ssa-publish-copy-panel-opacity, 0);
	transform:translateY(var(--ssa-publish-copy-panel-y, 20px));
	transition:opacity .45s ease, transform .45s ease;
}

.ssa-publish-result-copy-panel-first {
	opacity:var(--ssa-publish-first-copy-opacity, 1);
	transform:translateY(var(--ssa-publish-first-copy-y, 0));
}

.ssa-publish-result-copy-panel-second {
	opacity:var(--ssa-publish-second-copy-opacity, 0);
	transform:translateY(var(--ssa-publish-second-copy-y, 20px));
}

.ssa-publish-results-copy .ssa-title {
	margin:0;
}

.ssa-publish-results-copy .ssa-description {
	margin:var(--ssa-space-md) 0 0;
	color:color-mix(in srgb, var(--ssa-color-white) 76%, transparent);
	line-height:var(--ssa-line-height-text);
}

.ssa-publish-result-cards {
	display:grid;
	gap:var(--ssa-space-xl);
	transform:translateY(var(--ssa-publish-cards-y, 80vh));
	will-change:transform;
}

.ssa-publish-result-mobile-copy {
	display:none;
}

.ssa-publish-result-card {
	position:relative;
	min-height:clamp(380px, 58svh, 620px);
	overflow:hidden;
	border:1px solid color-mix(in srgb, var(--ssa-color-white) 56%, transparent);
	border-radius:var(--ssa-radius-30);
	background:color-mix(in srgb, var(--ssa-color-white) 94%, transparent);
}

.ssa-publish-message-card {
	display:grid;
	place-items:center;
	background:color-mix(in srgb, var(--ssa-color-white) 97%, transparent);
}

.ssa-publish-message-card .ssa-publish-phone-mock,
.ssa-publish-message-card .ssa-publish-message,
.ssa-publish-message-complete {
	opacity:0;
}

.ssa-publish-message-card.ssa-is-active .ssa-publish-phone-mock {
	animation:ssa-publish-phone-in .65s cubic-bezier(.22, 1, .36, 1) forwards;
}

.ssa-publish-message-card.ssa-is-active .ssa-publish-message-alert {
	animation:ssa-publish-alert-loop 4.8s .55s ease-in-out infinite;
}

.ssa-publish-message-card.ssa-is-active .ssa-publish-detected {
	animation:ssa-publish-detected-loop 4.8s .55s ease-in-out infinite;
}

.ssa-publish-message-card.ssa-is-active .ssa-publish-message-reply {
	animation:ssa-publish-reply-loop 4.8s .55s ease-in-out infinite;
}

.ssa-publish-message-card.ssa-is-active .ssa-publish-message-reply strong {
	animation:ssa-publish-customer-loop 4.8s .55s ease-in-out infinite;
}

.ssa-publish-message-card.ssa-is-active .ssa-publish-message-complete {
	animation:ssa-publish-complete-in .45s 2.75s cubic-bezier(.22, 1, .36, 1) forwards;
}

.ssa-publish-phone-mock {
	position:absolute;
	left:46%;
	top:6%;
	width:42%;
	height:100%;
	border:8px solid #17171b;
	border-radius:38px;
	background:linear-gradient(180deg, #08090b 0 54%, #0c111b 74%, #142033 100%);
	box-shadow:0 8px 18px rgb(0 0 0 / 18%);
	transform:translateX(-50%);
}

.ssa-publish-phone-mock > .ssa-publish-phone-island {
	position:absolute;
	z-index:3;
	left:50%;
	top:2.6%;
	width:31%;
	height:5.2%;
	border-radius:var(--ssa-radius-full);
	background:var(--ssa-color-black);
	transform:translateX(-50%);
}

.ssa-publish-phone-status {
	position:absolute;
	z-index:2;
	inset:3.8% 7% auto;
	height:18px;
	color:var(--ssa-color-white);
	font-size:var(--ssa-font-size-base);
}

.ssa-publish-phone-status > b {
	position:absolute;
	left:0;
	top:0;
	line-height:1;
}

.ssa-publish-phone-status > span {
	position:absolute;
	right:0;
	top:0;
	display:flex;
	align-items:center;
	gap:var(--ssa-space-3xs);
	line-height:1;
}

.ssa-publish-phone-clock {
	position:absolute;
	z-index:2;
	left:0;
	top:17%;
	display:grid;
	justify-items:center;
	width:100%;
	color:var(--ssa-color-white);
	text-shadow:0 2px 12px rgb(0 0 0 / 34%);
}

.ssa-publish-phone-clock strong {
	font-size:clamp(34px, 4vw, 58px);
	font-weight:300;
	line-height:1;
}

.ssa-publish-phone-clock small {
	margin-top:var(--ssa-space-2xs);
	font-size:var(--ssa-font-size-base);
}

.ssa-publish-phone-home {
	position:absolute;
	z-index:2;
	left:50%;
	bottom:2%;
	width:34%;
	height:4px;
	border-radius:var(--ssa-radius-full);
	background:rgb(255 255 255 / 88%);
	transform:translateX(-50%);
}

.ssa-publish-message {
	position:absolute;
	z-index:2;
	display:flex;
	align-items:center;
	gap:var(--ssa-gap-sm);
	padding:var(--ssa-space-xs) var(--ssa-space-sm);
	border:1px solid rgb(0 0 0 / 5%);
	border-radius:var(--ssa-radius-30);
	background:rgb(255 255 255 / 94%);
	color:var(--ssa-color-black);
	box-shadow:0 18px 42px rgb(25 18 40 / 12%);
}

.ssa-publish-message-alert {
	left:17%;
	top:43%;
	min-width:48%;
}

.ssa-publish-message-alert i {
	color:#d62976;
	font-size:var(--ssa-font-size-md);
}

.ssa-publish-message-alert p {
	margin:0;
	font-size:var(--ssa-font-size-base);
	line-height:1.45;
}

.ssa-publish-message-alert strong {
	display:block;
	font-size:var(--ssa-font-size-xss);
}

.ssa-publish-message-alert span {
	color:#404048;
}



/* ¿ÜÇüÀº ±âÁ¸ .ssa-publish-result-card ±×´ë·Î »ç¿ë */
.ssa-root .ssa-publish-result-card.ssa-trending-card {
    position: relative;
    padding: 0;
    overflow: hidden;
    container-type: inline-size;
	    padding: clamp(28px, 4vw, 64px);
    background: var(--ssa-color-gray-light);
}

/* °ËÀº ÈÞ´ëÆù ? ¾Æ·¡ÂÊÀº Ä«µå °æ°è¿¡¼­ À߸² */
.ssa-root .ssa-trending-phone {
    position: absolute;
    top: 8%;
    left: 50%;
    width: 48%;
    height: 112%;
    box-sizing: border-box;
    padding: 3.5% 3% 0;
    border-radius: 8cqw 8cqw 0 0;
    background: #050505;
    color: #fff;
    transform: translateX(-50%);
}

/* ÈÞ´ëÆù »óÅ ǥ½ÃÁÙ */
.ssa-root .ssa-trending-status {
    display: flex;
    justify-content: space-between;
    align-items: center;
    font-size: 1.6cqw;
    line-height: 1;
}

.ssa-root .ssa-trending-status > span {
    display: flex;
    gap: 1cqw;
}

/* È­¸é Á¦¸ñ */
.ssa-root .ssa-trending-head {
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    height: 12cqw;
}

.ssa-root .ssa-trending-head > strong {
    font-size: 2.5cqw;
    white-space: nowrap;
}

.ssa-root .ssa-trending-back {
    position: absolute;
    left: 0;
    display: grid;
    place-items: center;
    width: 6cqw;
    height: 6cqw;
    border-radius: 50%;
    background: #393939;
    font-size: 4cqw;
    line-height: 1;
}

/* ¹àÀº »óÇ° ¸ñ·Ï È­¸é */
.ssa-root .ssa-trending-screen {
    min-height: 65cqw;
    padding: 2cqw;
    border-radius: 4cqw 4cqw 0 0;
    background: #f5f5f7;
    color: #111;
}

.ssa-root .ssa-trending-tabs {
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding: 1.2cqw;
    border-radius: 2cqw;
    background: #eaeaed;
    color: #888;
    font-size: 1.9cqw;
}

.ssa-root .ssa-trending-tabs > span {
    padding: 1.6cqw 2cqw;
    white-space: nowrap;
}

.ssa-root .ssa-trending-tabs .ssa-trending-tab-active {
    border-radius: 1.8cqw;
    background: #f8f8fa;
    color: #111;
    font-weight: 700;
}

.ssa-root .ssa-trending-tabs .ssa-trending-tab-arrow {
    padding: 0 1cqw;
    color: #c6c8ce;
    font-size: 3.5cqw;
}

/* »óÇ° ¼øÀ§ */
.ssa-root .ssa-trending-ranking {
    margin-top: 3cqw;
}

.ssa-root .ssa-trending-row {
    position: relative;
    display: flex;
    align-items: center;
    gap: 3.5cqw;
    min-height: 18.5cqw;
    padding: 0 2cqw;
}

.ssa-root .ssa-trending-row > b {
    position: relative;
    z-index: 1;
    width: 3cqw;
    font-size: 3.8cqw;
}

.ssa-root .ssa-trending-row > div {
    position: relative;
    z-index: 1;
    display: flex;
    flex-direction: column;
    gap: 1cqw;
}

.ssa-root .ssa-trending-row strong {
    font-size: 5cqw;
}

.ssa-root .ssa-trending-row small {
    color: #888;
    font-size: 3cqw;
}

/* Âü°í À̹ÌÁöó·³ 1À§ ¹è°æ¸¸ ÈÞ´ëÆù ¹ÛÀ¸·Î µ¹Ãâ */
.ssa-root .ssa-trending-row-first::before {
    position: absolute;
    inset: 0 -7cqw;
    border: 1px solid rgb(255 255 255 / 70%);
    border-radius: 2cqw;
    background: rgb(245 245 247 / 88%);
    box-shadow: 0 3cqw 5cqw rgb(0 0 0 / 10%);
    content: "";
}

.ssa-publish-detected {
	position:absolute;
	left:12px;
	top:calc(100% + 10px);
	display:flex;
	align-items:center;
	gap:6px;
	padding:var(--ssa-space-2xs) var(--ssa-space-xs);
	border-radius:var(--ssa-radius-full);
	background:var(--ssa-color-main);
	color:var(--ssa-color-white);
	font-size:var(--ssa-font-size-base);
	font-style:normal;
	font-weight:700;
	opacity:0;
	box-shadow:0 10px 24px rgb(112 36 245 / 22%);
}

.ssa-publish-detected i {
	color:var(--ssa-color-white);
	font-size:var(--ssa-font-size-base);
}

.ssa-publish-message-reply {
	right:11%;
	top:22%;
	width:39%;
	min-height:50%;
	flex-direction:column;
	align-items:flex-start;
	justify-content:center;
	padding:var(--ssa-space-sm) var(--ssa-space-md);
	border-color:rgb(255 255 255 / 70%);
	border-radius:var(--ssa-radius-30);
	background:rgb(255 255 255 / 88%);
	backdrop-filter:blur(14px);
}

.ssa-publish-message-reply strong {
	align-self:flex-end;
	padding:var(--ssa-space-xs) var(--ssa-space-sm);
	border-radius:var(--ssa-radius-full);
	background:linear-gradient(100deg, #2784e8, var(--ssa-color-main));
	color:var(--ssa-color-white);
	font-size:var(--ssa-font-size-base);
}

.ssa-publish-message-profile {
	display:flex;
	align-items:center;
	gap:var(--ssa-space-xs);
	margin-bottom:var(--ssa-space-xs);
}

.ssa-publish-message-profile span {
	display:grid;
	place-items:center;
	width:28px;
	aspect-ratio:1;
	border-radius:var(--ssa-radius-full);
	background:#e5ddca;
	font-size:var(--ssa-font-size-xss);
}

.ssa-publish-message-profile b {
	font-size:var(--ssa-font-size-xss);
}

.ssa-publish-message-reply p {
	margin:0;
	padding:var(--ssa-space-2xs) var(--ssa-space-sm);
	border-radius:14px 14px 14px 4px;
	background:var(--ssa-color-gray-light);
	font-size:var(--ssa-font-size-xss);
}

.ssa-publish-message-complete {
	display:none;
}

@keyframes ssa-publish-phone-in {
	from {
		opacity:0;
		transform:translate(-50%, 28px) scale(.94);
	}
	to {
		opacity:1;
		transform:translate(-50%, 0) scale(1);
	}
}

@keyframes ssa-publish-alert-in {
	from {
		opacity:0;
		transform:translateX(-28px) scale(.96);
	}
	to {
		opacity:1;
		transform:translateX(0) scale(1);
	}
}

@keyframes ssa-publish-alert-loop {
	0%, 8%, 96%, 100% {
		opacity:0;
		transform:translateX(-26px) scale(.97);
	}
	18%, 86% {
		opacity:1;
		transform:translateX(0) scale(1);
	}
}

@keyframes ssa-publish-detected-loop {
	0%, 27%, 86%, 100% {
		opacity:0;
		transform:translateY(-5px) scale(.94);
	}
	34%, 78% {
		opacity:1;
		transform:translateY(0) scale(1);
	}
}

@keyframes ssa-publish-reply-in {
	from {
		opacity:0;
		transform:translateX(28px) scale(.96);
	}
	to {
		opacity:1;
		transform:translateX(0) scale(1);
	}
}

@keyframes ssa-publish-reply-loop {
	0%, 43%, 96%, 100% {
		opacity:0;
		transform:translateX(26px) scale(.97);
	}
	52%, 86% {
		opacity:1;
		transform:translateX(0) scale(1);
	}
}

@keyframes ssa-publish-customer-in {
	from {
		opacity:0;
		transform:translateY(8px) scale(.96);
	}
	to {
		opacity:1;
		transform:translateY(0) scale(1);
	}
}

@keyframes ssa-publish-customer-loop {
	0%, 63%, 96%, 100% {
		opacity:0;
		transform:translateY(8px) scale(.96);
	}
	72%, 86% {
		opacity:1;
		transform:translateY(0) scale(1);
	}
}

@keyframes ssa-publish-complete-in {
	from {
		opacity:0;
		transform:translateY(10px);
	}
	to {
		opacity:1;
		transform:translateY(0);
	}
}

.ssa-publish-chart-card {
	display:flex;
	flex-direction:column;
	padding:clamp(28px, 3vw, 35px);
	background:var(--ssa-color-gray-light);
	color:var(--ssa-color-black);
}

.ssa-publish-chart-head {
	display:flex;
	align-items:flex-start;
	justify-content:space-between;
}

.ssa-publish-chart-head div {
	display:grid;
	gap:var(--ssa-space-xs);
}

.ssa-publish-chart-head strong {
	font-size:var(--ssa-font-size-sm);
}

.ssa-publish-chart-head span {
	color:var(--ssa-color-sub-text);
}

.ssa-publish-chart-head b {
	padding:10px 15px;
	border-radius:var(--ssa-radius-full);
	background:rgb(112 36 245 / 9%);
	color:var(--ssa-color-main);
	opacity:0;
}

.ssa-publish-chart-card.ssa-is-active .ssa-publish-chart-head b {
	animation:ssa-publish-trend-in .45s 1.65s ease-out forwards;
}

.ssa-publish-line-chart {
	position:absolute;
	left:clamp(28px, 4vw, 64px);
	right:clamp(28px, 4vw, 64px);
	top:29%;
	bottom:48px;
}

.ssa-publish-line-chart svg {
	display:block;
	width:100%;
	height:100%;
	overflow:visible;
}

.ssa-publish-line-chart path {
	fill:none;
	stroke:var(--ssa-color-main);
	stroke-width:5px;
	stroke-linecap:round;
	stroke-linejoin:round;
	clip-path:inset(0 100% 0 0);
	vector-effect:non-scaling-stroke;
}

.ssa-publish-line-chart circle {
	fill:#fff;
	stroke:var(--ssa-color-main);
	stroke-width:2px;
	vector-effect:non-scaling-stroke;
}

.ssa-publish-line-chart g {
	opacity:0;
	transform-box:fill-box;
	transform-origin:center;
}

.ssa-publish-line-chart text {
	fill:#596172;
	font-size:var(--ssa-font-size-base);
	font-weight:700;
	text-anchor:middle;
}

.ssa-publish-chart-card.ssa-is-active .ssa-publish-line-chart path {
	animation:ssa-publish-line-in 1.45s .3s cubic-bezier(.22, 1, .36, 1) forwards;
}

.ssa-publish-chart-card.ssa-is-active .ssa-publish-line-chart g {
	animation:ssa-publish-line-point-in .36s ease-out forwards;
}

.ssa-publish-chart-card.ssa-is-active .ssa-publish-line-chart g:nth-of-type(1) {
	animation-delay:.75s;
}

.ssa-publish-chart-card.ssa-is-active .ssa-publish-line-chart g:nth-of-type(2) {
	animation-delay:.92s;
}

.ssa-publish-chart-card.ssa-is-active .ssa-publish-line-chart g:nth-of-type(3) {
	animation-delay:1.09s;
}

.ssa-publish-chart-card.ssa-is-active .ssa-publish-line-chart g:nth-of-type(4) {
	animation-delay:1.26s;
}

.ssa-publish-chart-card.ssa-is-active .ssa-publish-line-chart g:nth-of-type(5) {
	animation-delay:1.43s;
}

.ssa-publish-line-dates {
	display:flex;
	justify-content:space-between;
	margin-top:3px;
	color:var(--ssa-color-sub-text);
	font-size:var(--ssa-font-size-base);
}

@keyframes ssa-publish-line-in {
	from {
		clip-path:inset(0 100% 0 0);
	}
	to {
		clip-path:inset(0 0 0 0);
	}
}

@keyframes ssa-publish-line-point-in {
	from {
		opacity:0;
		transform:scale(.65);
	}
	to {
		opacity:1;
		transform:scale(1);
	}
}

@keyframes ssa-publish-trend-in {
	from {
		opacity:0;
		transform:translateY(6px);
	}
	to {
		opacity:1;
		transform:translateY(0);
	}
}

.ssa-publish-chart-grid {
	position:absolute;
	left:clamp(28px, 4vw, 64px);
	right:clamp(28px, 4vw, 64px);
	top:34%;
	display:grid;
	align-content:space-between;
	height:42%;
	opacity:0;
}

.ssa-publish-chart-grid i {
	display:block;
	border-top:1px dashed #dfe3ec;
}

.ssa-publish-chart-card.ssa-is-active .ssa-publish-chart-grid {
	animation:ssa-publish-grid-loop 4.8s ease-in-out infinite;
}

.ssa-publish-chart-bars {
	position:absolute;
	left:clamp(28px, 4vw, 64px);
	right:clamp(28px, 4vw, 64px);
	top:31%;
	bottom:52px;
	display:flex;
	align-items:flex-end;
	justify-content:space-around;
	gap:clamp(14px, 2vw, 30px);
	height:auto;
	margin-top:0;
	border-bottom:1px solid var(--ssa-color-border);
}

.ssa-publish-chart-bars > div {
	position:relative;
	display:flex;
	align-items:center;
	flex:1;
	flex-direction:column;
	justify-content:flex-end;
	height:100%;
}

.ssa-publish-chart-bars > div > i {
	display:block;
	width:min(64%, 54px);
	height:var(--ssa-chart-height);
	border-radius:12px 12px 0 0;
	background:#a8bff6;
	transform:scaleY(0);
	transform-origin:center bottom;
}

.ssa-publish-chart-bars > .ssa-is-highlight > i {
	background:linear-gradient(180deg, #8e6cf5, var(--ssa-color-main));
}

.ssa-publish-chart-bars > div > b {
	margin-bottom:var(--ssa-space-xs);
	color:var(--ssa-color-sub-text);
	font-size:var(--ssa-font-size-base);
	opacity:0;
}

.ssa-publish-chart-bars > div > span {
	position:absolute;
	top:calc(100% + 9px);
	color:var(--ssa-color-sub-text);
	font-size:var(--ssa-font-size-base);
}

.ssa-publish-chart-card.ssa-is-active .ssa-publish-chart-bars > div > i {
	animation:ssa-publish-bar-loop 4.8s var(--ssa-chart-delay) cubic-bezier(.22, 1, .36, 1) infinite;
	will-change:transform;
}

.ssa-publish-chart-card.ssa-is-active .ssa-publish-chart-bars > div > b {
	animation:ssa-publish-value-loop 4.8s var(--ssa-chart-delay) ease-in-out infinite;
}

@keyframes ssa-publish-grid-loop {
	0%, 8%, 94%, 100% {
		opacity:0;
	}
	18%, 88% {
		opacity:1;
	}
}

@keyframes ssa-publish-bar-loop {
	0%, 4%, 94%, 100% {
		transform:scaleY(0);
	}
	14%, 88% {
		transform:scaleY(1);
	}
}

@keyframes ssa-publish-value-loop {
	0%, 16%, 94%, 100% {
		opacity:0;
		transform:translateY(6px);
	}
	26%, 86% {
		opacity:1;
		transform:translateY(0);
	}
}

@keyframes ssa-publish-trend-loop {
	0%, 46%, 94%, 100% {
		opacity:0;
		transform:translateY(6px);
	}
	58%, 86% {
		opacity:1;
		transform:translateY(0);
	}
}

.ssa-publish-chart-channels {
	display:flex;
	flex-wrap:wrap;
	gap:var(--ssa-gap-xs);
	margin-top:var(--ssa-space-sm);
}

.ssa-publish-chart-channels span {
	padding:var(--ssa-space-xs) var(--ssa-space-sm);
	border-radius:var(--ssa-radius-full);
	background:var(--ssa-color-gray-light);
	font-size:var(--ssa-font-size-base);
}

@media (max-width:768px) {
	.scroll-guide-wrap{
		display:none
	}

	.ssa-root .ssa-trending-phone{
		width:200px;
	}
	
	.ssa-publish-story{
		display:flex;
		flex-direction:column;
		justify-content:center;
	}

	.ssa-publish-transition {
		padding:0;
	}

	.ssa-publish-sticky {
		position:relative;
		display:flex;
		flex-direction:column;
		justify-content:center;
		gap:var(--ssa-space-xl);
		height:100vh;
		overflow:hidden;
	}

	.ssa-publish-glow {
		top:28%;
		width:120vw;
	}

	.ssa-publish-intro {
		position:relative;
		display:grid;
		grid-template-columns:repeat(3, minmax(0, 80px));
		justify-content:center;
		gap:var(--ssa-space-sm);
		padding-inline:var(--ssa-space-md);
		opacity:1;
		transform:none;
	}

	.ssa-publish-copy {
		position:relative;
		left:auto;
		top:auto;
		grid-column:1 / -1;
		grid-row:1;
		width:100%;
		margin-bottom:var(--ssa-space-md);
		transform:none;
	}

	.ssa-publish-copy .ssa-description {
		margin-top:var(--ssa-space-sm);
	}

	.ssa-publish-channel {
		position:relative;
		left:auto;
		right:auto;
		top:auto;
		width:64px;
		border-radius:var(--ssa-radius-30);
		font-size:var(--ssa-font-size-lg);
		opacity:1;
		transform:none;
		animation:none;
	}

	.ssa-publish-thumb {
		display:none;
	}
.ssa-publish-results {
		position:relative;
		inset:auto;
		min-height:auto;
		padding:0;
		opacity:1;
		background:var(--ssa-color-white);
	}

	.ssa-publish-results-inner {
		grid-template-columns:minmax(0, 1fr);
		gap:var(--ssa-space-xl);
		width:100%;
		height:auto;
	}

	.ssa-publish-results-copy {
		display:none;
	}

	.ssa-publish-result-cards {
		display:block;
		transform:none;
	}

	.ssa-publish-result-item {
		display:flex;
		flex-direction:column;
		padding:var(--ssa-space-xl) var(--ssa-space-xs) var(--ssa-space-2xl);
		color:var(--ssa-color-white);
	}

	.ssa-publish-result-mobile-copy {
		display:block;
		order:2;
		margin:var(--ssa-space-md) 0 0;
		word-break:keep-all;
	}

	.ssa-publish-result-mobile-copy .ssa-card-title {
		margin:0;
		color:var(--ssa-color-white);
	}

	.ssa-publish-result-mobile-copy .ssa-description {
		margin:var(--ssa-space-sm) 0 0;
		color:rgb(255 255 255 / 74%);
		line-height:var(--ssa-line-height-text);
	}

	.ssa-publish-result-card {
		order:1;
		min-height:min(84vw, 520px);
	}

	.ssa-publish-phone-mock {
		width:44%;
		border-width:5px;
		border-radius:var(--ssa-radius-30);
	}

	.ssa-publish-message {
		gap:var(--ssa-space-xs);
		padding:var(--ssa-space-2xs) var(--ssa-space-sm);
		border-radius:var(--ssa-radius-15);
		font-size:var(--ssa-font-size-base);
	}

	.ssa-publish-message-alert {
		left:4%;
	}

	.ssa-publish-message-reply {
		right:4%;
	}

	.ssa-publish-detected,
	.ssa-publish-message-reply strong {
		display:none;
	}

	.ssa-publish-message-card.ssa-is-active .ssa-publish-phone-mock {
		animation:ssa-publish-phone-in .55s ease-out forwards;
	}

	.ssa-publish-message-card.ssa-is-active .ssa-publish-message-alert {
		animation:ssa-publish-alert-in .45s .4s ease-out both;
	}

	.ssa-publish-message-card.ssa-is-active .ssa-publish-message-reply {
		animation:ssa-publish-reply-in .45s .95s ease-out both;
	}

	.ssa-publish-chart-card {
		padding:var(--ssa-space-md);
	}

	.ssa-publish-chart-head strong {
		font-size:var(--ssa-font-size-sm);
	}

	.ssa-publish-chart-head b {
		padding:var(--ssa-space-2xs) var(--ssa-space-xs);
		font-size:var(--ssa-font-size-base);
	}

	.ssa-publish-line-chart {
		left:22px;
		right:22px;
		top:30%;
		bottom:42px;
	}

	.ssa-publish-line-chart text {
		font-size:var(--ssa-font-size-base);
	}

	.ssa-publish-line-chart circle {
		stroke-width:2.5px;
	}

	.ssa-publish-line-dates {
		margin-top:var(--ssa-space-2xs);
		font-size:var(--ssa-font-size-base);
	}

	.ssa-publish-chart-bars {
		height:58%;
	}
}

@media (prefers-reduced-motion:reduce) {
	.ssa-publish-channel {
		animation:none;
	}

	.ssa-publish-thumb {
		animation:none;
	}

	.ssa-publish-glow::before,
	.ssa-publish-glow::after {
		animation:none;
	}
}

/* ==================== ¸¸µç µÚ °ü¸® °á°ú : ¿ÞÂÊ °íÁ¤ / ¿À¸¥ÂÊ ÀÏ¹Ý ½ºÅ©·Ñ ==================== */
.ssa-publish-transition {
	height:180svh;
}

.ssa-publish-results {
	position:relative;
	inset:auto;
	z-index:1;
	isolation:isolate;
	min-height:0;
	margin:0;
	padding:var(--ssa-space-3xl) 0 var(--ssa-space-4xl);
	background:var(--ssa-color-black);
	opacity:1;
	pointer-events:auto;
	overflow:visible;
}

.ssa-publish-results::before {
	display:none;
}

.ssa-publish-results-background {
	position:absolute;
	z-index:0;
	inset:0;
	height:100%;
	margin:0;
	overflow:hidden;
	background:var(--ssa-color-black);
	pointer-events:none;
}

.ssa-publish-results-background::after {
	position:absolute;
	inset:0;
	background:rgb(0 0 0 / 46%);
	content:"";
}

.ssa-publish-results-background video {
	display:block;
	width:100%;
	height:100%;
	object-fit:cover;
	transform:scale(1.045);
}

.ssa-publish-results-inner {
	position:relative;
	z-index:1;
	display:grid;
	grid-template-columns:minmax(300px, .8fr) minmax(520px, 1.2fr);
	align-items:start;
	gap:var(--ssa-space-3xl);
	height:auto;
}

.ssa-publish-results-copy {
	position:sticky;
	top:calc(var(--ssa-process-header-height, 76px) + var(--ssa-space-lg));
	align-self:start;
	padding-top:0;
	color:var(--ssa-color-white);
	opacity:1;
	transform:none;
}

.ssa-publish-results-copy .ssa-title {
	margin:0;
	color:var(--ssa-color-white);
	line-height:var(--ssa-line-height-title);
}

.ssa-publish-result-cards {
	display:grid;
	gap:var(--ssa-space-xl);
	transform:none;
}

.ssa-publish-result-item {
	display:flex;
	flex-direction:column;
	gap:var(--ssa-space-md);
}

.ssa-publish-result-card {
	width:100%;
}

.ssa-publish-result-mobile-copy {
	position:relative;
	z-index:2;
	display:block !important;
	min-height:calc(var(--ssa-font-size-lg) * 4.8);
	margin:0;
	color:var(--ssa-color-white);
	word-break:keep-all;
}

.ssa-publish-result-mobile-copy .ssa-card-title {
	margin:0;
	color:var(--ssa-color-white);
}

.ssa-publish-result-mobile-copy .ssa-description {
	margin:var(--ssa-space-sm) 0 0;
	color:var(--ssa-color-sub-text-light);
	line-height:var(--ssa-line-height-text);
}

@media (max-width:768px) {
	.ssa-publish-transition {
		height:auto;
	}

	.ssa-publish-results {
		margin-top:0;
		padding:0 var(--ssa-space-md) 0 var(--ssa-space-md);
		background:var(--ssa-color-black);
	}

	.ssa-publish-results::before {
		display:none;
	}

	.ssa-publish-results-background {
		display:none;
	}

	.ssa-publish-results-inner {
		grid-template-columns:minmax(0, 1fr);
		gap:var(--ssa-space-xl);
	}

	.ssa-publish-results-copy {
		display:block;
		position:relative;
		top:auto;
	}

	.ssa-publish-result-cards {
		display:grid;
		gap:var(--ssa-space-2xl);
	}

	.ssa-publish-result-item {
		padding:0;
		background:none;
	}

	.ssa-publish-result-card {
		min-height:min(84vw, 520px);
	}
}

/* ==================== ¸ð¹ÙÀÏ Ç÷ÎÆà ³»ºñ°ÔÀÌ¼Ç ==================== */
.ssa-mobile-dock {
	display:none;
}

@media (max-width:768px) {
	.ssa-root {
		--ssa-mobile-dock-height:72px;
	}

	.ssa-main-content {
		padding-bottom:var(--ssa-space-3xl)
	}

	.ssa-mobile-dock {
		width:auto;
		position:fixed;
		left:11px;
		right:11px;
		bottom:11px;
		z-index:100;
		display:grid;
		grid-template-columns:repeat(4, minmax(0, 1fr));
		align-items:center;
		height:63px;
		padding:7px 8px;
		border-radius:10px;
		background:rgb(255 255 255 / 72%);
		box-shadow:0 10px 30px rgb(20 20 24 / 12%), inset 0 1px 0 rgb(255 255 255 / 78%);
		backdrop-filter:blur(18px) saturate(115%);
		-webkit-backdrop-filter:blur(18px) saturate(115%);
	}

	.ssa-mobile-dock-item {
		display:flex;
		flex-direction:column;
		align-items:center;
		justify-content:center;
		gap:3px;
		min-width:0;
		min-height:48px;
		padding:5px 3px;
		border-radius:18px;
		color:#3f3949;
		font-size:11px;
		font-weight:600;
		line-height:1;
		text-align:center;
		text-decoration:none;
		transition:background .2s ease, color .2s ease, transform .2s ease;
	}

	.ssa-mobile-dock-item i {
		display:grid;
		place-items:center;
		width:20px;
		height:20px;
		border-radius:var(--ssa-radius-full);
		font-size:16px;
		line-height:1;
		transition:background .2s ease, color .2s ease, box-shadow .2s ease, transform .2s ease;
	}

	.ssa-mobile-dock-item span {
		overflow:hidden;
		max-width:100%;
		white-space:nowrap;
		text-overflow:ellipsis;
	}

	.ssa-mobile-dock-item.ssa-is-active {
		background:transparent;
		color:var(--ssa-color-main);
	}

	.ssa-mobile-dock-item.ssa-is-active i {
		transform:translateY(-2px);
	}

	.ssa-mobile-dock-item:active {
		transform:scale(.96);
	}

	.ssa-mobile-dock-item:focus-visible {
		outline:2px solid var(--ssa-color-main);
		outline-offset:1px;
	}
}

@media (max-width:360px) {
	.ssa-mobile-dock-item {
		font-size:10px;
	}

	.ssa-mobile-dock-item i {
		font-size:18px;
	}
}

@media (prefers-reduced-motion:reduce) {
	.ssa-mobile-dock-item {
		transition:none;
	}
}
/* ==================== ¸¸µç µÚÀÇ °ü¸® : È帣´Â ¹®±¸ ==================== */

.ssa-management-story {
	position: relative;
	background: var(--ssa-color-white);
}

.ssa-management-intro {
	position: relative;
	height: 180svh;
	overflow: clip;
	background: var(--ssa-color-white);
}

.ssa-management-intro-sticky {
	position: sticky;
	top: 0;
	display: flex;
	align-items: center;
	height: 100svh;
	overflow: hidden;
}

.ssa-management-story .ssa-publish-results {
	z-index: 1;
	margin-top: -38svh;
	padding-top: 0;
	background: var(--ssa-color-white);
	opacity: 1;
}

.ssa-management-story .ssa-publish-results-inner {
	display: block;
	height: auto;
}

.ssa-management-story .ssa-publish-result-cards {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 20px;
	width: 100%;
	margin: 0 auto;
}


.ssa-management-story .ssa-publish-result-cards2 {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 20px;
	width: 100%;
	margin: 0 auto;
}



.ssa-management-story .ssa-publish-result-mobile-copy {
	color: var(--ssa-color-black);
}

.ssa-management-story .ssa-publish-result-mobile-copy .ssa-card-title {
	color: var(--ssa-color-black);
}

.ssa-management-story .ssa-publish-result-mobile-copy .ssa-description {
	color: var(--ssa-color-sub-text);
}

.ssa-management-title {
	display: flex;
	flex-direction: column;
	align-items: stretch;
	width: 100%;
	margin: 0;
	color: var(--ssa-color-black);
	font-size: var(--ssa-font-size-max);
	font-weight:700;
	line-height: var(--ssa-line-height-title);
	letter-spacing: -0.045em;
	opacity: 1;
	transform: scale(var(--ssa-management-title-scale, 1));
	transform-origin: center;
	will-change: transform;
}

.ssa-management-line {
	display: block;
	width: max-content;
	white-space: nowrap;
	will-change: transform;
}

.ssa-management-line-first {
	transform: translateX(
		var(--ssa-management-first-x, -100%)
	);
}

.ssa-management-line-second {
	transform: translateX(
		var(--ssa-management-second-x, 100vw)
	);
}


/* ==================== ¸ð¹ÙÀÏ ==================== */

@media (max-width: 768px) {
	.ssa-management-story{
		display:flex;
		flex-direction:column;
		justify-content:center;
		padding-bottom:0 !important
	}
	.ssa-management-intro {
		height: auto;
		padding:var(--ssa-space-xl) 0 
			var(--ssa-space-lg) 0;
	}

	.ssa-management-story .ssa-publish-results {
		margin-top: 0;
	}

	.ssa-management-story .ssa-publish-result-cards {
		grid-template-columns: minmax(0, 1fr);
		width:100%
	}

	.ssa-management-intro-sticky {
		position: relative;
		height: auto;
		text-align:center;
		display:flex;
		justify-content:center
	}

	.ssa-management-title {
		width: auto;
		font-size: var(--ssa-font-size-xl);
		transform: none;
		word-break: keep-all;
	}

	.ssa-management-line {
		width: auto;
		white-space: normal;
		transform: none;
	}
}


/* ==================== ¸ð¼Ç ÃÖ¼ÒÈ­ ==================== */

@media (prefers-reduced-motion: reduce) {

	.ssa-management-line {
		transform: none;
		will-change: auto;
	}

}

/* ==================== °ü¸® Ä«µå µðÀÚÀÎ ==================== */
.ssa-management-story .ssa-publish-result-card {
	width: 100%;
	min-height: 0;
	aspect-ratio: 10 / 7;
}

.ssa-management-story .ssa-publish-message-card {
	border-radius: var(--ssa-radius-50);
    background: var(--ssa-color-gray-light);
}

.ssa-management-story .ssa-publish-phone-mock {
	left: 50%;
	top: 10%;
	width: 48%;
	height: 110%;
	border-radius: clamp(30px, 4vw, 45px) clamp(30px, 4vw, 45px) 0 0;
}

.ssa-management-story .ssa-publish-message-alert {
	left: 4%;
	top: 30%;
	width: 54%;
	min-width: 0;
	padding: var(--ssa-space-sm);
	border: 0;
	border-radius: var(--ssa-radius-15);
}

.ssa-management-story .ssa-publish-message-alert > i {
	flex: none;
	font-size: var(--ssa-font-size-lg);
}

.ssa-management-story .ssa-publish-message-alert p {
	display: grid;
	flex: 1;
	gap: var(--ssa-space-3xs);
	margin: 0;
	font-size: var(--ssa-font-size-base);
}

.ssa-management-story .ssa-publish-message-alert p span:first-child {
	color: var(--ssa-color-black);
}

.ssa-management-story .ssa-publish-message-alert p strong {
	display: inline;
	font-size: inherit;
}

.ssa-management-story .ssa-publish-message-alert time {
	flex: none;
	align-self: center;
	color: var(--ssa-color-sub-text);
	font-size: var(--ssa-font-size-base);
}

.ssa-management-story .ssa-publish-message-reply {
	right: 3%;
	top: 50%;
	display: grid;
	grid-template-columns: 1fr auto;
	width: 50%;
	min-height: 0;
	padding: var(--ssa-space-sm);
	border: 0;
	border-radius: var(--ssa-radius-15);
	background: var(--ssa-color-white);
}

.ssa-management-story .ssa-publish-message-profile {
	grid-column: 1;
	margin: 0 0 var(--ssa-space-3xs);
}

.ssa-management-story .ssa-publish-message-reply p {
	grid-column: 1;
	margin: 0;
	padding: 0;
	background: none;
	font-size: var(--ssa-font-size-xss);
}

.ssa-management-story .ssa-publish-message-reply > i {
	grid-column: 2;
	grid-row: 1 / span 2;
	align-self: center;
	color: #142c53;
	font-size: var(--ssa-font-size-lg);
	transform: rotate(-14deg);
}

.ssa-management-story .ssa-publish-line-chart text {
	font-size: var(--ssa-font-size-xs);
}

@media (max-width: 768px) {
	.ssa-management-story .ssa-publish-result-card {
		min-height: 0;
		aspect-ratio: 10 / 7;
	}

	.ssa-management-story .ssa-publish-phone-mock {
		width: 46%;
	}

	.ssa-management-story .ssa-publish-message-alert {
		left: 3%;
		width: 68%;
	}

	.ssa-management-story .ssa-publish-message-reply {
		right: 3%;
		width: 64%;
	}

	.ssa-management-story .ssa-publish-line-chart text {
		font-size: clamp(18px, 4vw, 24px);
	}
}


/* ==================== TEXTTYPE HERO ==================== */

@property --ssa-texttype-angle {
	syntax: "<angle>";
	initial-value: 0deg;
	inherits: true;
}

.ssa-texttype-hero {
	--ssa-texttype-morph-left: 9px;
	--ssa-texttype-morph-width: 90px;
	--ssa-texttype-morph-right: 99px;
	--ssa-texttype-duration: var(--texttype-duration, 15s);
	position: relative;
	display: grid;
	place-items: center;
	min-height: 700px;
	box-sizing: border-box;
	overflow: hidden;
	background: radial-gradient(circle at 50% 43%, rgb(91 45 255 / 11%), transparent 32%),
		var(--color-black);
	color: var(--color-white);
	padding:0 var(--space-md)
}

.ssa-texttype-hero::before,
.ssa-texttype-hero::after {
	position: absolute;
	width: clamp(130px, 14vw, 240px);
	aspect-ratio: .72;
	border-radius: var(--radius32);
	background: linear-gradient(145deg, var(--black-300), var(--color-black));
	box-shadow: 0 20px 60px rgb(0 0 0 / 60%);
	opacity: .28;
	content: "";
	animation: ssa-texttype-card-in var(--ssa-texttype-duration) ease infinite;

	display:none;
}

.ssa-texttype-hero::before {
	left: 5%;
	bottom: -12%;
	transform: rotate(-7deg);
}

.ssa-texttype-hero::after {
	right: 5%;
	bottom: -13%;
	transform: rotate(7deg);
	animation-delay: .14s;
}


.ssa-texttype-hero-inner .fast{
	font-size:var(--font-size-md);
	color:#b383ff;
	font-weight:700;
}

.ssa-texttype-hero-inner {
	position: relative;
	z-index: 1;
	width: min(1180px, 100%);
	text-align: center;
}

.ssa-texttype-title{
	color: var(--color-white);
	font-size: 100px;
	line-height: 1.08;
	letter-spacing: -.065em;
	font-weight:600;
}


.ssa-texttype-second-line > p{
	margin: 0;
	color: var(--color-white);
	font-size: 100px;
	line-height: 1.08;
	letter-spacing: -.065em;
	font-weight:600;
}


.ssa-texttype-title > span {
	display: block;
	opacity: 0;
	transform: translateY(24px);
	filter: blur(6px);
	animation: ssa-texttype-copy-in var(--ssa-texttype-duration) cubic-bezier(.22, 1, .36, 1) infinite;
}

.ssa-texttype-title > span:nth-child(2) {
	animation-delay: .16s;
}

.ssa-texttype-dot {
	color: var(--color-main);
	text-shadow: 0 0 18px rgb(138 66 255 / 76%);
}

.ssa-texttype-search {

--ssa-texttype-angle: 0deg;

	position: relative;
	isolation: isolate;
	display: flex;
	align-items: center;
	width: min(400px, 100%);
	height: 76px;
	box-sizing: border-box;
	margin: 0 auto;
	padding: var(--space-xs);
	padding-left: var(--space-md);
	border-radius: var(--radius-full);
	background: var(--color-black);
	box-shadow: 0 0 28px rgb(98 52 255 / 22%), 0 18px 42px rgb(0 0 0 / 55%);
	opacity: 0;
	transform: translateY(16px);
}

/* ³×¿Â Å׵θ® */
.ssa-texttype-search::before {
	position: absolute;
	inset: -2px;
	z-index: -1;

	padding: 2px;

	border-radius: inherit;

	background:
		conic-gradient(
			from var(--ssa-texttype-angle),
			transparent 0deg 190deg,
			#8b2ff1 230deg,
			#7024f5 260deg,
			#c423da 285deg,
			#fff 300deg,
			transparent 330deg 360deg
		);

	filter:
		drop-shadow(
			0 0 8px rgb(112 36 245 / 80%)
		);

	-webkit-mask:
		linear-gradient(#000 0 0) content-box,
		linear-gradient(#000 0 0);

	-webkit-mask-composite: xor;

	mask:
		linear-gradient(#000 0 0) content-box,
		linear-gradient(#000 0 0);

	mask-composite: exclude;

	content: "";

	animation:
		ssa-texttype-neon-rotate
		3.2s
		linear
		infinite;
}


@keyframes ssa-texttype-neon-rotate {

	from {
		--ssa-texttype-angle: 0deg;
	}

	to {
		--ssa-texttype-angle: 360deg;
	}

}

.ssa-texttype-url {
	color: var(--main-light);
	opacity: 0;
}

.ssa-texttype-search button {
	position: relative;
	width: 118px;
	height: 60px;
	border: 0;
	border-radius: var(--radius-full);
	background: var(--black-300);
	color: var(--color-white);
	font: inherit;
	font-size: var(--font-size-xs2);
	font-weight: 800;
	transform: scale(1);
}

.ssa-texttype-search button span {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
}

.ssa-texttype-search button span:last-child {
	opacity: 0;
}

.ssa-texttype-search button span:first-child {
}

.ssa-texttype-paste {
	position: absolute;
	left: 28px;
	top: -28px;
	padding: var(--space-3xs) var(--space-xs);
	border: 1px solid rgb(255 255 255 / 12%);
	border-radius: var(--radius-full);
	background: var(--black-300);
	color: var(--color-gray);
	font-size: var(--font-size-base);
	font-weight: 750;
	opacity: 0;
}

.ssa-texttype-description {
	margin: var(--space-sm) 0 0;
	color: var(--color-gray-light);
	font-size: var(--font-size-md);
	font-weight: 600;
	line-height: var(--line-height-text);
	opacity: 0;
	animation: ssa-texttype-copy-in var(--ssa-texttype-duration) ease .28s infinite;
}

@keyframes ssa-texttype-copy-in {

	0%,
	4%,
	96%,
	100% {
		opacity: 0;
		transform: translateY(20px);
		filter: blur(6px);
	}

	10%,
	91% {
		opacity: 1;
		transform: none;
		filter: none;
	}

}

@keyframes ssa-texttype-card-in {

	0%,
	68%,
	100% {
		opacity: .08;
		filter: grayscale(1);
	}

	78%,
	94% {
		opacity: .36;
		filter: grayscale(0);
	}

}


@media (max-width:768px) {

	 .ssa-texttype-hero {
		/* ±¸Çü ºê¶ó¿ìÀú¿ë */
		min-height: 100vh;
		height: 100vh;

		/* ÇöÀç º¸ÀÌ´Â È­¸é ³ôÀÌ ±âÁØ */
		min-height: 100dvh;
		height: 100dvh;

		display: grid;
		place-items: center;
		padding: 0 var(--space-md);
	  }

	.ssa-texttype-title {
		font-size: var(--font-size-3xl);
		line-height: 1.13;
	}

	.ssa-texttype-search {
		height: 62px;
		margin-top: var(--space-md);
		padding: var(--space-2xs) var(--space-2xs) var(--space-2xs) var(--space-md);
	}

	.ssa-texttype-search button {
		width: 86px;
		height: 50px;
		font-size: var(--font-size-xs);
	}

	.ssa-texttype-paste {
		left: 20px;
		top: -25px;
	}

	.ssa-texttype-description {
		margin-top: var(--space-xl);
		font-size: var(--font-size-sm);
	}

	.ssa-texttype-hero::before {
		left: -12%;
	}

	.ssa-texttype-hero::after {
		right: -12%;
	}

}

@media (max-width:390px) and (max-height:760px) {


	.ssa-texttype-title {
		font-size: var(--font-size-2xl);
	}

	.ssa-texttype-search {
		margin-top: var(--space-sm);
	}


}


/* ==================== NEW HERO : ·¹ÆÛ·±½º ÅؽºÆ® ¹è¿­ / 3ÃÊ Àü´Þ ==================== */

.ssa-texttype-hero-inner {
	width: min(1220px, 100%);
	text-align: left;
}

.ssa-texttype-title {
	text-align: left;
}

.ssa-texttype-second-line {
	display: grid;
	grid-template-columns: 480px auto;
	align-items: center;
	gap: 0;
	margin-top: clamp(var(--space-sm), 1.4vw, var(--space-sm));
}

.ssa-texttype-second-line > p {
	margin: 0;
	white-space: nowrap;
	opacity: 0;
	transform: translateY(24px);
	filter: blur(6px);
	animation: ssa-texttype-copy-in var(--ssa-texttype-duration) .1s cubic-bezier(.22, 1, .36, 1) infinite;
}

.ssa-texttype-search button {
	width: 116px;
	white-space: nowrap;
}


@media (max-width:1100px) and (min-width:769px) {

	.ssa-texttype-title,
	.ssa-texttype-second-line > p {
		font-size: var(--font-size-max);
	}

	.ssa-texttype-second-line {
		grid-template-columns: 340px auto;
	}

	.ssa-texttype-description {
		white-space: normal;
	}

}

/* ==================== µî·Ïâ ³»ºÎ : ½Ç½Ã°£ Ãßõ ¡æ ¸µÅ© µî·Ï ==================== */

.ssa-texttype-title > span,
.ssa-texttype-second-line > p,
.ssa-texttype-description {
	opacity: 1;
	transform: none;
	filter: none;
	animation: none;
}

.ssa-texttype-search {
	display: block;
	padding: 0;
	overflow: visible;
	background: color-mix(in srgb, var(--color-black) 62%, var(--black-300));
	border-radius: var(--radius-full);
	opacity: 1;
	transform: none;
	animation: ssa-texttype-capsule-cycle var(--ssa-texttype-duration) ease infinite;

	justify-self: start;
}

.ssa-texttype-rank-stage,
.ssa-texttype-register-stage,
.ssa-texttype-final-stage {
	position: absolute;
	inset: 0;
	border-radius: inherit;
}

.ssa-texttype-rank-stage {
	overflow: visible;
	animation: ssa-texttype-rank-stage var(--ssa-texttype-duration) ease infinite;
}

.ssa-texttype-rank-roll {
	position: absolute;
	inset: 0;
	overflow: hidden;
	border-radius: inherit;
}

.ssa-texttype-rank-roll > span {
	position: absolute;
	inset: 0;
	display: flex;
	align-items: center;
	gap: var(--space-sm);
	padding: 0 var(--space-md);
	color: var(--color-white);
	font-size: var(--font-size-xs);
	font-weight: 750;
	opacity: 0;
	transform: translateY(60%);
}

.ssa-texttype-rank-roll b {
	color: var(--color-main);
}

.ssa-texttype-rank-roll > span:nth-child(1) {
	animation: ssa-texttype-rank-3 var(--ssa-texttype-duration) cubic-bezier(.22, 1, .36, 1) infinite;
}

.ssa-texttype-rank-roll > span:nth-child(2) {
	animation: ssa-texttype-rank-2 var(--ssa-texttype-duration) cubic-bezier(.22, 1, .36, 1) infinite;
}

.ssa-texttype-rank-roll > span:nth-child(3) {
	display: none;
}

.ssa-texttype-winner {
	position: absolute;
	inset: 0;
	display: grid;
	grid-template-columns: 48px minmax(0, 1fr) 104px;
	align-items: center;
	gap: var(--space-2xs);
	padding: var(--space-xs);
	opacity: 0;
	animation: ssa-texttype-winner var(--ssa-texttype-duration) cubic-bezier(.22, 1, .36, 1) infinite;
}

.ssa-texttype-winner em {
	display: inline-flex;
	align-items: center;
	gap: var(--space-3xs);
	padding: 0;
	background: none;
	box-shadow: none;
	color: var(--color-gray);
	font-size: var(--font-size-base);
	font-style: normal;
	font-weight: 850;
	white-space: nowrap;
	opacity: 0;
	transform: translateY(3px) scale(.94);
	animation: ssa-texttype-rise-badge var(--ssa-texttype-duration) cubic-bezier(.22, 1, .36, 1) infinite;
}

.ssa-texttype-winner em i {
	color: var(--color-main);
	font-size: var(--font-size-base);
	font-style: normal;
	line-height: 1;
}

.ssa-texttype-rank-number {
	display: grid;
	place-items: center;
	width: 46px;
	height: 46px;
	border-radius: 50%;
	background: var(--sub-gradient-w);
	box-shadow: 0 0 14px rgb(127 60 255 / 40%);
	color: var(--color-white);
	font-size: var(--font-size-base);
}

.ssa-texttype-winner > span {
	display: flex;
	min-width: 0;
	flex-direction: column;
	gap: var(--space-3xs);
}

.ssa-texttype-item-line {
	display: flex;
	align-items: center;
	gap: var(--space-2xs);
	min-width: 0;
}

.ssa-texttype-item-line strong {
	flex: 1;
	min-width: 0;
}

.ssa-texttype-item-line em {
	flex: none;
}

.ssa-texttype-winner strong {
	overflow: hidden;
	color: var(--color-white);
	font-size: var(--font-size-xs);
	text-overflow: ellipsis;
	white-space: nowrap;
}

.ssa-texttype-winner small {
	color: var(--color-gray);
	font-size: var(--font-size-base);
}

.ssa-texttype-search .ssa-texttype-copy-button,
.ssa-texttype-search .ssa-texttype-register-button {
	position: relative;
	width: auto;
	height: 46px;
	padding: 0 var(--space-sm);
	border: 0;
	border-radius: var(--radius-full);
	background: var(--black-300);
	color: var(--color-white);
	font: inherit;
	font-size: var(--font-size-base);
	font-weight: 800;
	white-space: nowrap;
}

.ssa-texttype-copy-button {
	animation: ssa-texttype-copy-press var(--ssa-texttype-duration) ease infinite;
}

.ssa-texttype-copy-button span {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
}

.ssa-texttype-copy-button span:last-child {
	opacity: 0;
	animation: ssa-texttype-copy-done var(--ssa-texttype-duration) ease infinite;
}

.ssa-texttype-copy-button span:first-child {
	animation: ssa-texttype-copy-old var(--ssa-texttype-duration) ease infinite;
}

.ssa-texttype-morph {
	position: absolute;
	left: var(--ssa-texttype-morph-left);
	top: 50%;
	z-index: 5;
	display: grid;
	place-items: center;
	width: 46px;
	height: 46px;
	border-radius: var(--radius-full);
	background: var(--sub-gradient-w);
	box-shadow: 0 0 15px rgb(126 55 255 / 48%);
	color: var(--color-white);
	font-size: var(--font-size-base);
	font-weight: 850;
	opacity: 0;
	transform: translateY(-50%);
	animation: ssa-texttype-morph var(--ssa-texttype-duration) cubic-bezier(.22, 1, .36, 1) infinite;
}

.ssa-texttype-morph::after {
	position: absolute;
	inset: 0;
	display: grid;
	place-items: center;
	font-size: var(--font-size-base);
	color: var(--color-white);
	opacity: 0;
	content: "µî·Ï";
	animation: ssa-texttype-morph-label var(--ssa-texttype-duration) ease infinite;
}

.ssa-texttype-register-stage {
	display: flex;
	align-items: center;
	padding: var(--space-2xs) var(--space-2xs) var(--space-2xs) var(--space-sm);
	opacity: 0;
	animation: ssa-texttype-register-stage var(--ssa-texttype-duration) ease infinite;
}

.ssa-texttype-register-stage .ssa-texttype-url {
	position: relative;
	flex: 1;
	overflow: hidden;
	color: var(--main-light);
	font-size: var(--font-size-xs);
	font-weight: 800;
	white-space: nowrap;
	opacity: 1;
	clip-path: inset(0 100% 0 0);
	animation:
		ssa-texttype-url-reveal
		var(--ssa-texttype-duration)
		cubic-bezier(.22, 1, .36, 1)
		infinite;
}

.ssa-texttype-register-stage .ssa-texttype-paste {
	left: 18px;
	top: -27px;
}

.ssa-texttype-search .ssa-texttype-register-button {
	width: 92px;
	background: linear-gradient(135deg, var(--theme-primary), var(--theme-secondary));
	box-shadow: 0 0 15px rgb(113 55 255 / 22%);
	animation: ssa-texttype-register-press var(--ssa-texttype-duration) ease infinite;
}

.ssa-texttype-final-stage {
	display: flex;
	align-items: center;
	justify-content: center;
	gap: var(--space-2xs);
	color: var(--color-white);
	font-size: var(--font-size-xs);
	font-weight: 800;
	opacity: 0;
	animation: ssa-texttype-final var(--ssa-texttype-duration) cubic-bezier(.22, 1, .36, 1) infinite;
}

.ssa-texttype-final-stage i {
	display: grid;
	place-items: center;
	width: 28px;
	height: 28px;
	border-radius: 50%;
	background: var(--sub-gradient-w);
	box-shadow: 0 0 14px rgb(127 60 255 / 40%);
	color: var(--color-white);
	font-size: var(--font-size-base);
	transform: scale(.7);
	animation: ssa-texttype-final-check var(--ssa-texttype-duration) cubic-bezier(.22, 1, .36, 1) infinite;
}

.ssa-texttype-pointer {
	position: absolute;
	left: calc(100% - 53px);
	top: 56%;
	z-index: 12;
	display: grid;
	place-items: center;
	width: 24px;
	height: 28px;
	color: var(--color-white);
	font-size: var(--font-size-sm);
	filter: drop-shadow(0 2px 2px var(--color-black)) drop-shadow(0 0 2px var(--color-black));
	opacity: 0;
	pointer-events: none;
	transform: translate(-50%, -50%) rotate(-12deg);
	animation: ssa-texttype-pointer var(--ssa-texttype-duration) cubic-bezier(.22, 1, .36, 1) infinite;
}

@keyframes ssa-texttype-rank-3 {

	0%,
	6% {
		opacity: 1;
		transform: translateY(0);
	}

	12%,
	100% {
		opacity: 0;
		transform: translateY(-115%);
	}

}

@keyframes ssa-texttype-rank-2 {

	0%,
	5% {
		opacity: 0;
		transform: translateY(115%);
	}

	11%,
	14% {
		opacity: 1;
		transform: translateY(0);
	}

	20%,
	100% {
		opacity: 0;
		transform: translateY(-115%);
	}

}

@keyframes ssa-texttype-rank-stage {

	0%,
	43% {
		opacity: 1;
	}

	48%,
	100% {
		opacity: 0;
	}

}

@keyframes ssa-texttype-winner {

	0%,
	13% {
		opacity: 0;
		transform: translateY(115%);
	}

	19%,
	43% {
		opacity: 1;
		transform: translateY(0);
	}

	48%,
	100% {
		opacity: 0;
		transform: translateY(-8%);
	}

}

@keyframes ssa-texttype-rise-badge {

	0%,
	23% {
		opacity: 0;
		transform: translateY(3px) scale(.94);
	}

	27%,
	43% {
		opacity: 1;
		transform: none;
	}

	47%,
	100% {
		opacity: 0;
	}

}

@keyframes ssa-texttype-copy-press {

	0%,
	33%,
	37%,
	100% {
		transform: scale(1);
	}

	35% {
		transform: scale(.94);
		background: var(--color-main);
	}

}

@keyframes ssa-texttype-copy-old {

	0%,
	35% {
		opacity: 1;
	}

	37%,
	100% {
		opacity: 0;
	}

}

@keyframes ssa-texttype-copy-done {

	0%,
	35% {
		opacity: 0;
	}

	37%,
	44% {
		opacity: 1;
	}

	48%,
	100% {
		opacity: 0;
	}

}

@keyframes ssa-texttype-morph {

	0%,
	41% {
		left: var(--ssa-texttype-morph-left);
		width: 46px;
		opacity: 0;
	}

	43% {
		left: var(--ssa-texttype-morph-left);
		width: 46px;
		opacity: .72;
	}

	52% {
		left: calc(100% - var(--ssa-texttype-morph-right));
		width: var(--ssa-texttype-morph-width);
		opacity: 1;
	}

	58%,
	100% {
		left: calc(100% - var(--ssa-texttype-morph-right));
		width: var(--ssa-texttype-morph-width);
		opacity: 0;
	}

}

@keyframes ssa-texttype-morph-label {

	0%,
	52% {
		opacity: 0;
	}

	54%,
	57% {
		opacity: 1;
	}

	60%,
	100% {
		opacity: 0;
	}

}

@keyframes ssa-texttype-register-stage {

	0%,
	50% {
		opacity: 0;
	}

	56%,
	76% {
		opacity: 1;
	}

	81%,
	100% {
		opacity: 0;
	}

}

@keyframes ssa-texttype-paste-fast {

	0%,
	52%,
	64%,
	100% {
		opacity: 0;
		transform: translateY(5px);
	}

	56%,
	61% {
		opacity: 1;
		transform: none;
	}

}

@keyframes ssa-texttype-url-reveal {

	0%,
	57% {
		clip-path: inset(0 100% 0 0);
	}

	64%,
	79% {
		clip-path: inset(0);
	}

	82%,
	100% {
		clip-path: inset(0);
	}

}

@keyframes ssa-texttype-register-press {

	0%,
	69%,
	75%,
	100% {
		transform: scale(1);
		filter: brightness(1);
	}

	72% {
		transform: scale(.94);
		filter: brightness(1.35);
	}

}

@keyframes ssa-texttype-capsule-cycle {

	0%,
	69%,
	75%,
	100% {
		box-shadow: 0 0 28px rgb(98 52 255 / 22%), 0 18px 42px rgb(0 0 0 / 55%);
	}

	72% {
		box-shadow: 0 0 38px rgb(119 61 255 / 58%), 0 18px 42px rgb(0 0 0 / 55%);
	}

}

@keyframes ssa-texttype-final {

	0%,
	76% {
		opacity: 0;
		transform: translateY(7px);
	}

	81%,
	95% {
		opacity: 1;
		transform: none;
	}

	99%,
	100% {
		opacity: 0;
		transform: translateY(-3px);
	}

}

@keyframes ssa-texttype-final-check {

	0%,
	78% {
		transform: scale(.7);
	}

	83%,
	95% {
		transform: scale(1);
	}

	99%,
	100% {
		transform: scale(.7);
	}

}

@keyframes ssa-texttype-pointer {

	0%,
	27% {
		left: calc(100% - 53px);
		top: 56%;
		opacity: 0;
		transform: translate(-50%, -50%) rotate(-12deg) scale(.86);
	}

	30%,
	33% {
		left: calc(100% - 53px);
		top: 56%;
		opacity: 1;
		transform: translate(-50%, -50%) rotate(-12deg) scale(1);
	}

	35% {
		left: calc(100% - 53px);
		top: 56%;
		opacity: 1;
		transform: translate(-50%, -50%) rotate(-12deg) scale(.8);
	}

	38% {
		left: calc(100% - 53px);
		top: 56%;
		opacity: 1;
		transform: translate(-50%, -50%) rotate(-12deg) scale(1);
	}

	48% {
		left: 28%;
		top: 50%;
		opacity: 1;
		transform: translate(-50%, -50%) rotate(-12deg) scale(1);
	}

	54% {
		left: 28%;
		top: 50%;
		opacity: 1;
		transform: translate(-50%, -50%) rotate(-12deg) scale(1);
	}

	57% {
		left: 28%;
		top: 50%;
		opacity: 1;
		transform: translate(-50%, -50%) rotate(-12deg) scale(.78);
	}

	60% {
		left: 28%;
		top: 50%;
		opacity: 1;
		transform: translate(-50%, -50%) rotate(-12deg) scale(1);
	}

	68% {
		left: calc(100% - 53px);
		top: 56%;
		opacity: 1;
		transform: translate(-50%, -50%) rotate(-12deg) scale(1);
	}

	72% {
		left: calc(100% - 53px);
		top: 56%;
		opacity: 1;
		transform: translate(-50%, -50%) rotate(-12deg) scale(.8);
	}

	75% {
		left: calc(100% - 53px);
		top: 56%;
		opacity: 1;
		transform: translate(-50%, -50%) rotate(-12deg) scale(1);
	}

	79%,
	100% {
		left: calc(100% - 53px);
		top: 56%;
		opacity: 0;
		transform: translate(-50%, -50%) rotate(-12deg) scale(.9);
	}

}

@media (max-width:768px) {

	.ssa-texttype-hero {
		--ssa-texttype-morph-width: 78px;
		--ssa-texttype-morph-right: 85px;
	}

	.ssa-texttype-hero .inner-a{
		width:100%
	}

	.ssa-texttype-winner {
		grid-template-columns: 42px minmax(0, 1fr) 88px;
		gap: var(--space-2xs);
		padding: var(--space-2xs);
	}

	.ssa-texttype-rank-number {
		width: 40px;
		height: 40px;
		font-size: var(--font-size-base);
	}

	.ssa-texttype-winner strong {
		font-size: var(--font-size-base);
	}

	.ssa-texttype-winner small {
		font-size: var(--font-size-base);
	}

	.ssa-texttype-search .ssa-texttype-copy-button {
		height: 40px;
		padding-inline: var(--space-xs);
		font-size: var(--font-size-base);
	}

	.ssa-texttype-rank-roll > span {
		padding-inline: var(--space-md);
		font-size: var(--font-size-base);
	}

	.ssa-texttype-register-stage {
		padding-left: var(--space-md);
	}

	.ssa-texttype-search .ssa-texttype-register-button {
		width: 78px;
		height: 40px;
		font-size: var(--font-size-base);
	}

	.ssa-texttype-final-stage {
		gap: var(--space-xs);
		font-size: var(--font-size-base);
	}

	.ssa-texttype-final-stage i {
		width: 24px;
		height: 24px;
		font-size: var(--font-size-base);
	}

	.ssa-texttype-pointer {
		font-size: var(--font-size-xs2);
	}

	.ssa-texttype-winner em {
		font-size: var(--font-size-base);
	}

	.ssa-texttype-winner em i {
		font-size: var(--font-size-base);
	}

	.ssa-texttype-item-line {
		gap: var(--space-3xs);
	}

}


@media (max-width:768px) {

	.ssa-texttype-hero-inner {
		text-align: center;
	}

	.ssa-texttype-title,
	.ssa-texttype-second-line > p {
		font-size:38px;
		line-height: 1.13;
		text-align: center;
	}

	.ssa-texttype-second-line {
		display: flex;
		flex-direction: column;
		gap: var(--space-sm);
		margin-top: var(--space-3xs);
	}

	.ssa-texttype-second-line > p {
		order: -1;
		white-space: normal;
	}

	.ssa-texttype-search {
		width: min(100%, 430px);
		height: 62px;
	}


}

@media (max-width:768px) and (prefers-reduced-motion:no-preference) {

	.ssa-texttype-search,
	.ssa-texttype-rank-roll > span,
	.ssa-texttype-winner,
	.ssa-texttype-winner em,
	.ssa-texttype-copy-button,
	.ssa-texttype-copy-button span,
	.ssa-texttype-morph,
	.ssa-texttype-morph::after,
	.ssa-texttype-register-stage,
	.ssa-texttype-register-stage .ssa-texttype-url,
	.ssa-texttype-register-stage .ssa-texttype-paste,
	.ssa-texttype-register-button,
	.ssa-texttype-final-stage,
	.ssa-texttype-final-stage i,
	.ssa-texttype-pointer {
		animation-duration: var(--ssa-texttype-duration);
		animation-play-state: running;
	}

}

























/* ==================== X : ½Ç½Ã°£ Ãßõ »óÇ° ¼øÀ§ ==================== */

.x-trend {
	min-height: 600px;
	margin-top: var(--space-3xl);
	padding-top: var(--space-3xl);
	overflow: hidden;
	background:
		linear-gradient(
			180deg,
			var(--color-gray-light2) 0%,
			var(--color-white) 100%
		);
	color: var(--color-black);
}

.x-trend-inner {
	width: var(--contents-width-inner);
	margin: 0 auto;
}

.x-trend-copy {
	position: relative;
	z-index: 4;
	text-align: center;
}

.x-trend-title {
	margin: 0;
}

.x-trend-description {
	margin: var(--space-sm) 0 0;
}

.x-trend-visual {
	position: relative;
	height: 600px;
}

.x-trend-phone {
	position: absolute;
	left: 50%;
	bottom: 0;
	z-index: 2;
	width: 370px;
	height: 550px;
	padding: var(--space-sm);
	overflow: visible;
	border-radius:
		var(--radius-50)
		var(--radius-50)
		0
		0;
	background: var(--color-black);
	color: var(--color-white);
	box-shadow:
		0
		0
		var(--space-lg)
		rgb(0 0 0 / 12%);
	transform: translateX(-50%);
}

.x-trend-status,
.x-trend-phone-title {
	display: flex;
	align-items: center;
	justify-content: space-between;
}

.x-trend-status {
	padding: 0 var(--space-xs);
	font-size: var(--font-size-base);
}

.x-trend-status-icons {
	display: inline-flex;
	align-items: center;
	gap: var(--space-2xs);
}

.x-trend-status-icons i {
	font-size: var(--font-size-xs);
}

.x-trend-phone-title {
	position: relative;
	justify-content: center;
	min-height: var(--space-2xl);
	font-size: var(--font-size-sm);
}

.x-trend-phone-title i {
	position: absolute;
	left: 0;
	display: grid;
	place-items: center;
	width: var(--space-lg);
	height: var(--space-lg);
	border-radius: var(--radius-full);
	background: var(--black-300);
	font-size: var(--font-size-xs);
	font-style: normal;
}

.x-trend-screen {
	height: calc(100% - var(--space-3xl));
	padding: var(--space-xs);
	border-radius:
		var(--radius-30)
		var(--radius-30)
		0
		0;
	background: var(--color-white);
	color: var(--color-black);
}

.x-trend-tabs {
	display: grid;
	grid-template-columns: repeat(3, 1fr) auto;
	align-items: center;
	gap: var(--space-xs);
	padding: var(--space-2xs);
	border-radius: var(--radius-15);
	background: rgba(000,000,000,0.04);
	color: var(--color-gray);
	font-size: var(--font-size-xs);
}

.x-trend-tabs b {
	padding:
		var(--space-2xs)
		var(--space-sm);
	border-radius: var(--radius-15);
	background: var(--color-white);
	color: var(--color-black);
	text-align: center;
}

.x-trend-tabs span {
	text-align: center;
}

.x-trend-tabs > i {
	padding: 0 var(--space-xs);
	color: var(--color-mainborder);
	font-size: var(--font-size-sm);
}

.x-trend-ranking {
	position: relative;
	height: 264px;
	margin: var(--space-sm) 0 0;
	padding: 0;
	list-style: none;
}

/* ¸ðµç ¼øÀ§ ÄÜÅÙÃ÷´Â ÈÞ´ëÆù ¾ÈÂÊ¿¡ °íÁ¤ */
.x-trend-rank {
	position: absolute;
	left: 0;
	top: 0;
	isolation: isolate;
	display: grid;
	grid-template-columns:
		var(--space-lg)
		minmax(0, 1fr)
		auto;
	align-items: center;
	gap: var(--space-xs);
	width: 100%;
	height: 88px;
	background: transparent;
	will-change: transform, opacity;
}

.x-trend-rank::before {
	position: absolute;
	left: -55px;
	right: -55px;
	top: 0;
	bottom: 0;
	z-index: 0;
	border: 1px solid rgb(255 255 255 / 64%);
	border-radius: var(--radius-15);
	background:
		color-mix(
			in srgb,
			var(--color-white) 80%,
			transparent
		);
	box-shadow:
		0
		var(--space-sm)
		var(--space-lg)
		rgb(0 0 0 / 12%);
	-webkit-backdrop-filter: blur(50px);
	backdrop-filter: blur(50px);
	opacity: 0;
	content: "";
}

.x-trend-rank > * {
	position: relative;
	z-index: 1;
}

.x-trend-rank > b {
	position: relative;
	font-size: var(--font-size-lg);
	text-align: center;
}

/* ½ÇÁ¦ ÅؽºÆ®´Â ¼û±â°í ¾Ö´Ï¸ÞÀÌ¼Ç ¹øÈ£¸¦ Ç¥½Ã */
.x-trend-rank-first > b,
.x-trend-rank-rising > b {
	color: transparent;
}

.x-trend-rank-first > b::before,
.x-trend-rank-rising > b::before {
	position: absolute;
	left: 50%;
	top: 50%;
	color: var(--color-black);
	transform: translate(-50%, -50%);
}

.x-trend-rank-first > b::before {
	content: "1";
	animation:
		x-trend-number-first
		8s
		linear
		infinite;
}

.x-trend-rank-rising > b::before {
	content: "2";
	animation:
		x-trend-number-rising
		8s
		linear
		infinite;
}

.x-trend-rank > span {
	display: flex;
	min-width: 0;
	flex-direction: column;
}

.x-trend-rank strong {
	font-size: var(--font-size-sm);
	white-space: nowrap;
}

.x-trend-rank small {
	color: var(--color-gray);
	font-size: var(--font-size-xs);
}

.x-trend-rank em {
	font-style: normal;
}

.x-trend-rank mark {
	display: inline-flex;
	align-items: center;
	gap: var(--space-2xs);
	padding:
		var(--space-2xs)
		var(--space-xs);
	border-radius: var(--radius-10);
	background: var(--main-light);
	color: var(--color-main);
	font-size: var(--font-size-xs);
	font-weight: 850;
	line-height: 1;
	white-space: nowrap;
	opacity: 0;
	transform: scale(.72);
	transform-origin: center;
	animation:
		x-trend-badge
		8s
		cubic-bezier(.22, 1, .36, 1)
		infinite;
}

.x-trend-rank mark i {
	color: var(--color-main);
	font-size: var(--font-size-xs);
}

.x-trend-rank-first {
	animation:
		x-trend-rank-first
		8s
		cubic-bezier(.22, 1, .36, 1)
		infinite;
}

.x-trend-rank-first::before {
	animation:
		x-trend-card-first
		8s
		cubic-bezier(.22, 1, .36, 1)
		infinite;
}

.x-trend-rank-rising {
	z-index: 2;
	animation:
		x-trend-rank-rising
		8s
		cubic-bezier(.22, 1, .36, 1)
		infinite;
}

.x-trend-rank-rising::before {
	animation:
		x-trend-card-rising
		8s
		cubic-bezier(.22, 1, .36, 1)
		infinite;
}

.x-trend-rank-third {
	animation:
		x-trend-rank-third
		8s
		cubic-bezier(.22, 1, .36, 1)
		infinite;
}

.x-trend-rank,
.x-trend-rank mark,
.x-trend-rank::before,
.x-trend-rank > b::before {
	animation-play-state: paused;
}

.x-trend.x-trend-active .x-trend-rank,
.x-trend.x-trend-active .x-trend-rank mark,
.x-trend.x-trend-active .x-trend-rank::before,
.x-trend.x-trend-active .x-trend-rank > b::before {
	animation-play-state: running;
}

.x-trend-count {
	display: inline-block;
}

.x-trend.x-trend-active .x-trend-count {
	animation:
		x-trend-count-rise
		8s
		cubic-bezier(.22, 1, .36, 1)
		infinite;
}

.x-trend-rising-count {
	color: var(--color-gray);
}

.x-trend.x-trend-active .x-trend-rising-count {
	animation:
		x-trend-count-color
		8s
		linear
		infinite;
}

/* ==================== ÁÖº¯ »óÇ° À̹ÌÁö ==================== */

.x-trend-float {
	position: absolute;
	z-index: 1;
	width: 150px;
	margin: 0;
	overflow: hidden;
	border-radius: var(--radius-15);
	box-shadow:
		0
		var(--space-sm)
		var(--space-lg)
		rgb(0 0 0 / 8%);
}

.x-trend-float img {
	display: block;
	width: 100%;
	aspect-ratio: .72;
	object-fit: cover;
}

.x-trend-float-a {
	left: 18%;
	top: 13%;
}

.x-trend-float-b {
	left: 2%;
	top: 32%;
	filter: blur(1.5px);
	opacity: .76;
	transform: scale(.92);
}

.x-trend-float-c {
	right: 18%;
	top: 54%;
}

.x-trend-float-d {
	right: 2%;
	top: 32%;
	filter: blur(1.5px);
	opacity: .76;
	transform: scale(.82);
}

.x-trend-float-e {
	left: 18%;
	top: 54%;
}

.x-trend-float-f {
	right: 18%;
	top: 13%;
}

/* ==================== ¼øÀ§ À̵¿ ==================== */

@keyframes x-trend-rank-first {
	0%,
	32%,
	100% {
		opacity: 1;
		transform: translateY(0);
	}

	40%,
	68% {
		opacity: 1;
		transform: translateY(88px);
	}
}

@keyframes x-trend-rank-rising {
	0%,
	32%,
	100% {
		opacity: 1;
		transform: translateY(88px);
	}

	40%,
	68% {
		opacity: 1;
		transform: translateY(0);
	}
}

@keyframes x-trend-rank-third {
	0%,
	100% {
		opacity: 1;
		transform: translateY(176px);
	}
}



/* ==================== 1À§ µ¹Ãâ ¹Ú½º À̵¿ ==================== */

@keyframes x-trend-card-first {
	0%,
	32%,
	100% {
		opacity: 1;
	}

	40%,
	68% {
		opacity: 0;
	}
}

@keyframes x-trend-card-rising {
	0%,
	32%,
	100% {
		opacity: 0;
	}

	40%,
	68% {
		opacity: 1;
	}
}

/* ==================== ¼øÀ§ ¹øÈ£ º¯°æ ==================== */

@keyframes x-trend-number-first {
	0%,
	37%,
	72%,
	100% {
		content: "1";
	}

	38%,
	71% {
		content: "2";
	}
}

@keyframes x-trend-number-rising {
	0%,
	37%,
	72%,
	100% {
		content: "2";
	}

	38%,
	71% {
		content: "1";
	}
}

/* ==================== ±Þ»ó½Â ¹îÁö ==================== */

@keyframes x-trend-badge {
	0%,
	36%,
	72%,
	100% {
		opacity: 0;
		transform:
			translateY(var(--space-2xs))
			scale(.72);
	}

	40% {
		opacity: 1;
		transform:
			translateY(0)
			scale(1.08);
	}

	44%,
	68% {
		opacity: 1;
		transform:
			translateY(0)
			scale(1);
	}
}

/* ==================== Á¶È¸¼ö ==================== */

@keyframes x-trend-count-rise {
	0% {
		transform: scale(1);
	}

	18% {
		transform: scale(1.08);
	}

	28% {
		transform: scale(1);
	}

	38% {
		transform: scale(1.1);
	}

	48%,
	100% {
		transform: scale(1);
	}
}

@keyframes x-trend-count-color {
	0%,
	34% {
		color: var(--color-main);
	}

	38%,
	100% {
		color: var(--color-gray);
	}
}

/* ==================== ÅÂºí¸´ ==================== */

@media (max-width: 1024px) and (min-width: 769px) {
	.x-trend {
		min-height: 760px;
		padding-top: var(--space-2xl);
	}

	.x-trend-inner {
		width: var(--contents-width-in);
	}

	.x-trend-title {
		max-width: 720px;
		margin: 0 auto;
	}

	.x-trend-description {
		max-width: 620px;
		margin: var(--space-sm) auto 0;
		font-size: var(--font-size-xs);
	}

	.x-trend-visual {
		height: 540px;
		margin-top: var(--space-md);
	}

	.x-trend-phone {
		width: 370px;
		height: 520px;
		padding: var(--space-sm);
		border-radius: 60px 60px 0 0;
	}

	.x-trend-phone-title {
		min-height: var(--space-2xl);
		font-size: var(--font-size-xs);
	}

	.x-trend-screen {
		height: calc(100% - var(--space-3xl));
		padding: var(--space-xs);
	}

	.x-trend-float {
		display: none;
	}
}

/* ==================== ¸ð¹ÙÀÏ ==================== */

@media (max-width: 768px) {
	.x-trend {
		min-height: auto;
		padding-top: var(--space-3xl);
	}

	.x-trend-inner {
		width: min(100% - 32px, 720px);
	}

	.x-trend-title {
		max-width: 620px;
		margin: 0 auto;
		word-break: keep-all;
	}

	.x-trend-description {
		max-width: 560px;
		margin: var(--space-md) auto 0;
		color: var(--color-sub-text2);
		font-size: var(--font-size-xs2);
		line-height: var(--line-height-text);
		word-break: keep-all;
	}

	.x-trend-copy {
		margin-bottom: 0
	}

	.x-trend-visual {
		height: 402px;
		margin: 0 var(--space-md);
	}

	.x-trend-phone {
		width: 260px;
		height: 400px;
		margin-bottom:-50px;
		padding: var(--space-sm);
		border-radius: 30px 30px 0 0;
	}

	.x-trend-status {
		font-size: var(--font-size-base);
	}

	.x-trend-phone-title {
		min-height: var(--space-2xl);
		font-size: var(--font-size-sm);
	}

	.x-trend-phone-title i {
		width: var(--space-lg);
		height: var(--space-lg);
		font-size: var(--font-size-xs);
	}

	.x-trend-screen {
		height: calc(100% - var(--space-3xl));
		padding: var(--space-xs);
	}

	.x-trend-tabs {
		gap: var(--space-2xs);
		padding: var(--space-2xs);
		font-size: var(--font-size-base);
	}

	.x-trend-tabs b {
		padding:
			var(--space-2xs)
			var(--space-xs);
	}

	.x-trend-ranking {
		height: 204px;
		margin-top: var(--space-sm);
	}

	/* ¸ð¹ÙÀÏ¿¡¼­µµ ¼øÀ§ ÄÜÅÙÃ÷´Â ÈÞ´ëÆù ³»ºÎ */
	.x-trend-rank {
		left: 0;
		grid-template-columns:
			var(--space-lg)
			minmax(0, 1fr)
			auto;
		gap: var(--space-xs);
		width: 100%;
		height: 65px;
		padding: 0 var(--space-sm);
	}

	/* ¸ð¹ÙÀÏ¿¡¼­µµ 1À§ ¹è°æ¸¸ µ¹Ãâ */
	.x-trend-rank::before {
		left: -36px;
		right: -36px;
	}

	.x-trend-rank > b {
		font-size: var(--font-size-lg);
	}

	.x-trend-rank strong {
		font-size: var(--font-size-sm);
	}

	.x-trend-rank small,
	.x-trend-rank mark {
		font-size: 11px
	}

	.x-trend-rank mark i{
		font-size: 9px
	}

	.x-trend-float {
		display: none;
	}

}


@media (max-width: 768px) {

	.x-trend-ranking {
		height: 192px;
		margin-top: var(--space-sm);
	}

	.x-trend-rank {
		height: 64px;
	}

	.x-trend-rank-first {
		animation-name: x-trend-rank-first-mobile;
	}

	.x-trend-rank-rising {
		animation-name: x-trend-rank-rising-mobile;
	}

	.x-trend-rank-third {
		animation-name: x-trend-rank-third-mobile;
	}

	@keyframes x-trend-rank-first-mobile {
		0%,
		32%,
		100% {
			opacity: 1;
			transform: translateY(0);
		}

		40%,
		68% {
			opacity: 1;
			transform: translateY(64px);
		}
	}

	@keyframes x-trend-rank-rising-mobile {
		0%,
		32%,
		100% {
			opacity: 1;
			transform: translateY(64px);
		}

		40%,
		68% {
			opacity: 1;
			transform: translateY(0);
		}
	}

	@keyframes x-trend-rank-third-mobile {
		0%,
		100% {
			opacity: 1;
			transform: translateY(128px);
		}
	}

}
/* ==================== X : ¼îÃ÷ ¼º°ú ½ºÅ©·Ñ ½ºÅ丮 ==================== */

.x-shorts-story {
	position: relative;
	height: 360vh;
	background: var(--color-white);
	margin-bottom:var(--space-2xl);
	padding-bottom:var(--space-2xl)
}

.x-shorts-story-sr {
	position: absolute;
	width: 1px;
	height: 1px;
	padding: 0;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.x-shorts-story-sticky {
	position: sticky;
	top: 0;
	height: 100vh;
	min-height: 680px;
	overflow: hidden;
}

.x-shorts-story-half {
	position: absolute;
	top: 0;
	bottom: 0;
	width: 50%;
}

.x-shorts-story-half-left {
	left: 0;
	 background: var(--color-white);
}

.x-shorts-story-half-right {
	right: 0;
	background: var(--color-white);
}

.x-shorts-story-copy {
	position: absolute;
	top: 50%;
	z-index: 2;
	display: flex;
	flex-direction: column;
	margin: 0;
	font-size: var(--font-size-max);
	font-weight: 850;
	line-height: var(--line-height-tight);
	letter-spacing: -0.05em;
	transform: translateY(-50%);
	transform-origin: center;
	will-change: transform;
}

.x-shorts-story-copy-left {
	left: 18%;
	text-align: right;
	transform-origin: right center;
}

.x-shorts-story-copy-right {
	right: 18%;
	color: var(--color-black);
	text-align: left;
	transform-origin: left center;
}

.x-shorts-story-copy i {
	position: absolute;
	right: calc(var(--space-lg) * -1);
	top: calc(var(--space-lg) * -1);
	color: var(--color-main);
	font-size: var(--font-size-lg);
}

.x-shorts-story-rail {
	position: absolute;
	left: 50%;
	top: 0;
	z-index: 4;
	width: 1px;
	height: 100%;
}

.x-shorts-story-card {
	position: absolute;
	left: 0;
	top: 0;
	width: 270px;
	margin: 0;
	overflow: visible;
	border: 1px solid var(--color-border);
	border-radius: var(--radius-15);
	background: var(--color-white);
	color: var(--color-black);
	box-shadow: 0 var(--space-sm) var(--space-xl) rgb(0 0 0 / 13%);
	opacity: 1;
	transform: translate(-50%, 110vh);
	will-change: transform;
}

.x-shorts-story-floats {
	position: absolute;
	left: 50%;
	top: 50%;
	z-index: 6;
	width: 360px;
	height: 420px;
	pointer-events: none;
	transform: translate(-50%, -50%);
}

.x-shorts-story-floats img{
	position: absolute;
	width:50px;
	filter: drop-shadow(0 var(--space-2xs) var(--space-xs) rgb(112 36 245 / 24%));
}

.x-shorts-story-floats .fa-fire {
	left: -50%;
	top: 10%;
	animation: x-shorts-story-float-left 3.2s ease-in-out infinite;
}

.x-shorts-story-floats .fa-heart {
	right: -50%;
	top: 80%;
	animation: x-shorts-story-float-right 3.8s ease-in-out infinite;
}

@keyframes x-shorts-story-float-left {
	0%, 100% {
		transform: translateY(0) rotate(-8deg);
	}

	50% {
		transform: translateY(-16px) rotate(7deg);
	}
}

@keyframes x-shorts-story-float-right {
	0%, 100% {
		transform: translateY(0) rotate(8deg) scale(.92);
	}

	50% {
		transform: translateY(14px) rotate(-6deg) scale(1.06);
	}
}

.x-shorts-story-card header,
.x-shorts-story-card footer {
	display: flex;
	align-items: center;
	justify-content: space-between;
	padding: var(--space-xs);
	font-size: var(--font-size-base);
}

.x-shorts-story-card header span,
.x-shorts-story-card footer span {
	display: inline-flex;
	align-items: center;
	gap: var(--space-xs);
}

.x-shorts-story-card header strong {
	font-size: var(--font-size-base);
}

.x-shorts-story-card footer {
	font-size: var(--font-size-xs);
}

.x-shorts-story-media {
	position: relative;
	overflow: hidden;
	background: var(--color-black);
}

.x-shorts-story-media video {
	display: block;
	width: 100%;
	aspect-ratio: 9 / 14.5;
	object-fit: cover;
}

.x-shorts-story-media button {
	position: absolute;
	left: 50%;
	top: 50%;
	display: grid;
	place-items: center;
	width: 54px;
	height: 54px;
	padding: 0;
	border: 1px solid rgb(255 255 255 / 55%);
	border-radius: var(--radius-full);
	background: rgb(0 0 0 / 42%);
	color: var(--color-white);
	font-size: var(--font-size-sm);
	cursor: pointer;
	transform: translate(-50%, -50%);
	transition: opacity .2s ease, transform .2s ease;
}

.x-shorts-story-card.x-shorts-story-playing .x-shorts-story-media button {
	opacity: .18;
}

.x-shorts-story-media button:hover {
	opacity: 1;
	transform: translate(-50%, -50%) scale(1.06);
}

.x-shorts-story-media b {
	position: absolute;
	left: var(--space-xs);
	bottom: var(--space-xs);
	color: var(--color-white);
	font-size: var(--font-size-sm);
	text-shadow: 0 2px 8px rgb(0 0 0 / 65%);
}

.x-shorts-story-media b img{
	width:25px;
	margin-right:5px;
}


@media (max-width: 1024px) {
	.x-shorts-story {
		height: 330vh;
	}

	.x-shorts-story-copy-left {
		left: 10%;
	}

	.x-shorts-story-copy-right {
		right: 10%;
	}
}

@media (max-width: 768px) {
	.x-shorts-story {
		height: auto;
		background: var(--color-black);
	}

	.x-shorts-story-sticky {
		position: relative;
		top: auto;
		display: flex;
		flex-direction: column;
		align-items: center;
		height: auto;
		min-height: 0;
		padding:0 var(--space-md);
		overflow: visible;
		background: var(--color-black);
	}

	.x-shorts-story-half-left,
	.x-shorts-story-half-right {
		display: none;
	}

	.x-shorts-story-copy {
		position: static;
		left: auto;
		top: auto;
		right: auto;
		width: calc(100% - 32px);
		color: var(--color-white);
		font-size: var(--font-size-xl);
		line-height: 1;
		font-weight:700;
		text-align: center;
		transform: none;
	}

	.x-shorts-story-copy-left {
		flex-direction: row;
		justify-content: center;
		gap: var(--space-xs);
	}

	.x-shorts-story-copy-right {
		flex-direction: row;
		justify-content: center;
		gap: var(--space-xs);
		margin-top: var(--space-xs);
	}

	.x-shorts-story-copy-left i {
		position: static;
		align-self: center;
		margin-left: var(--space-2xs);
	}

	.x-shorts-story-floats {
		display: none;
	}

	.x-shorts-story-rail {
		position: relative;
		left: auto;
		top: auto;
		display: flex;
		flex-direction: column;
		align-items: center;
		gap: var(--space-2xl);
		width: 100%;
		height: auto;
		margin-top: var(--space-xl);
	}

	.x-shorts-story-card {
		position: relative;
		left: auto;
		top: auto;
		width: 180px;
		opacity: 1;
		transform: none;
		margin:0 auto
	}

	.x-shorts-story-card header,
	.x-shorts-story-card footer {
		padding: var(--space-2xs) var(--space-xs);
	}
}

@media (min-width: 769px) and (prefers-reduced-motion: reduce) {

	.x-shorts-story {
		height: 100vh;
	}

	.x-shorts-story-card:not(:first-child) {
		display: none;
	}

	.x-shorts-story-floats i {
		animation: none;
	}

}



/* 261013¸ð¹ÙÀÏ¿¡¼­¸¸ ¼½¼Ç ´ÜÀ§ ½ºÅ©·Ñ */
@media (max-width: 768px) {
    html:has(.ssa-root) {
        scroll-snap-type: y mandatory;

        /* »ó´Ü °íÁ¤ Çì´õ°¡ ÀÖ´Ù¸é ÇØ´ç ³ôÀÌ·Î º¯°æ */
        scroll-padding-top: 0px;
    }

    .ssa-root .ssa-main-content > section {
        box-sizing: border-box;

        /* ªÀº ¼½¼ÇÀº ÇÑ È­¸é, ±ä ¼½¼ÇÀº ÄÜÅÙÃ÷ ³ôÀÌ À¯Áö */
        min-height: 100vh;
        min-height: 100svh;

        scroll-snap-align: start;
        scroll-snap-stop: always;
    }
}


@media (max-width: 768px) {
    .ssa-mobile-slider {
        display: block !important;
        width: 100%;
        min-width: 0;
        max-width: 100%;
        overflow: hidden !important;
		padding-inline:0
    }

    .ssa-mobile-slider > .swiper-wrapper {
        display: flex;
        align-items: flex-start;
        width: 100%;
        box-sizing: content-box;
        transition-property: transform;
    }

    .ssa-mobile-slider > .swiper-wrapper > .swiper-slide {
        flex-shrink: 0;
        min-width: 0;
        height: auto;
    }

    .ssa-mobile-slider .ssa-process-step,
    .ssa-mobile-slider .ssa-content-flow-card {
        width: 100%;
        margin: 0;
        box-sizing: border-box;
    }

	.ssa-content-flow{
		padding-inline:var(--space-md);
	}

    .ssa-mobile-slider .ssa-slider-controls {
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 16px;
        margin: 20px 0;
    }

    .ssa-slider-controls button {
        width: 36px;
        height: 36px;
        border: 1px solid #ddd;
        border-radius: 50%;
        background: #fff;
        color: #222;
        cursor: pointer;
    }

    .ssa-slider-controls button:disabled {
        opacity: .3;
        cursor: default;
    }

    .ssa-slider-count {
        font-size: 14px;
        color: #777;
    }
}

]

@media (max-width: 768px) {
    /* Ä«µå ¸ñ·ÏÀ» ¸ð¹ÙÀÏ ½½¶óÀÌ´õ·Î */
    .ssa-root .ssa-management-story
    .ssa-publish-result-cards.ssa-mobile-slider {
        display: block;
        width: 100%;
        max-width: 100%;
        min-width: 0;
        padding: 0;
        gap: 0;
    }

    /* °¢ ½½¶óÀ̵忡 À̹ÌÁö Ä«µå + ¼³¸íÀ» ÇÔ²² Ç¥½Ã */
    .ssa-root .ssa-management-story
    .ssa-mobile-slider .ssa-publish-result-item {
        display: flex;
        flex-direction: column;
        box-sizing: border-box;
        width: 100%;
        min-width: 0;
        max-width: none;
        margin: 0;
    }

    .ssa-root .ssa-management-story
    .ssa-mobile-slider .ssa-publish-result-card {
        box-sizing: border-box;
        width: 100%;
        max-width: none;
        margin-inline: 0;
    }

    .ssa-root .ssa-management-story
    .ssa-mobile-slider .ssa-publish-result-mobile-copy {
        display: block;
        width: 100%;
        box-sizing: border-box;
    }
}


/* ±âÁ¸ Ä«µå Å©±â¡¤¸ð¼­¸® À¯Áö */
.ssa-management-story .ssa-publish-result-card.ssa-link-register-card {
    display: grid;
    place-items: center;
    box-sizing: border-box;
    padding: 0;
    overflow: hidden;
    background: var(--ssa-color-gray-light, #f7f7fb);
    container-type: inline-size;
}

/* ÷ºÎ À̹ÌÁö ÇüÅÂÀÇ ¸µÅ© µî·Ï UI */
.ssa-management-story .ssa-link-register-ui {
    display: flex;
    align-items: center;
    width: 80%;
    box-sizing: border-box;
    padding: 1.8cqw;
    border-radius: 4cqw;
    background: #fff;
}

.ssa-management-story .ssa-link-register-address {
    position: relative;
    flex: 1;
    min-width: 0;
    height: 15cqw;
    margin-left: 4cqw;
    color: #5700f5;
    font-family: inherit;
    font-size: 3.8cqw;
    font-weight: 700;
    letter-spacing: -0.04em;
}

.ssa-management-story .ssa-link-register-button {
    position: relative;
    flex: 0 0 32%;
    height: 15cqw;
    border-radius: 3cqw;
    background: linear-gradient(110deg, #4d08cb, #9900bf);
    color: #fff;
    font-family: inherit;
    font-size: 3.8cqw;
    font-weight: 700;
    animation: ssa-link-register-press 8s ease-in-out infinite;
}

/* ¼¼ ´Ü°è ¹®±¸¸¦ °°Àº À§Ä¡¿¡ ¹èÄ¡ */
.ssa-management-story .ssa-link-register-address > span,
.ssa-management-story .ssa-link-register-button > span {
    position: absolute;
    inset: 0;
    display: flex;
    align-items: center;
    white-space: nowrap;
}

.ssa-management-story .ssa-link-register-button > span {
    justify-content: center;
}

.ssa-management-story .ssa-link-register-copy {
    animation: ssa-link-register-copy-stage 8s linear infinite;
}

.ssa-management-story .ssa-link-register-paste {
    opacity: 0;
    animation: ssa-link-register-paste-stage 8s linear infinite;
}

.ssa-management-story .ssa-link-register-done {
    opacity: 0;
    animation: ssa-link-register-done-stage 8s linear infinite;
}

.ssa-management-story
.ssa-link-register-address > .ssa-link-register-paste {
    color: #aaa;
    font-weight: 500;
}

/* ±âÁ¸ Ä«µå °üÂû ½ºÅ©¸³Æ®ÀÇ ssa-is-active¿Í ¿¬µ¿ */
.ssa-management-story .ssa-link-register-button,
.ssa-management-story .ssa-link-register-address > span,
.ssa-management-story .ssa-link-register-button > span {
    animation-play-state: paused;
}

.ssa-management-story
.ssa-link-register-card.ssa-is-active .ssa-link-register-button,
.ssa-management-story
.ssa-link-register-card.ssa-is-active .ssa-link-register-address > span,
.ssa-management-story
.ssa-link-register-card.ssa-is-active .ssa-link-register-button > span {
    animation-play-state: running;
}

/* 1´Ü°è : ¸µÅ© º¹»ç */
@keyframes ssa-link-register-copy-stage {
    0%, 27% { opacity: 1; }
    31%, 96% { opacity: 0; }
    100% { opacity: 1; }
}

/* 2´Ü°è : ºÙ¿©³Ö±â */
@keyframes ssa-link-register-paste-stage {
    0%, 27% { opacity: 0; }
    31%, 57% { opacity: 1; }
    61%, 100% { opacity: 0; }
}

/* 3´Ü°è : µî·Ï ¿Ï·á */
@keyframes ssa-link-register-done-stage {
    0%, 57% { opacity: 0; }
    61%, 92% { opacity: 1; }
    96%, 100% { opacity: 0; }
}

/* º¹»ç / ºÙ¿©³Ö±â ½Ã ¹öÆ°À» ´©¸£´Â È¿°ú */
@keyframes ssa-link-register-press {
    0%, 22%, 30%, 52%, 60%, 100% {
        transform: scale(1);
    }

    26%, 56% {
        transform: scale(.94);
    }
}

/* ¸ð¼Ç ÃÖ¼ÒÈ­ ¼³Á¤¿¡¼­´Â Ãʱâ È­¸é À¯Áö */
@media (prefers-reduced-motion: reduce) {
    .ssa-management-story .ssa-link-register-button,
    .ssa-management-story .ssa-link-register-address > span,
    .ssa-management-story .ssa-link-register-button > span {
        animation: none;
    }

    .ssa-management-story .ssa-link-register-copy {
        opacity: 1;
    }

    .ssa-management-story .ssa-link-register-paste,
    .ssa-management-story .ssa-link-register-done {
        opacity: 0;
    }
}


.nu-tb-sections {
    color:var(--theme-text);
    background:var(--theme-bg);
    font-family:inherit
}

.nu-tb-sections * {
    box-sizing:border-box
}

.nu-tb-sections button,.nu-tb-sections a {
    font:inherit
}

.nu-tb-sections button {
    cursor:pointer
}

.nu-tb-sections a {
    text-decoration:none
}

.nu-tb-sections button:focus-visible,.nu-tb-sections a:focus-visible,.nu-tb-review-row:focus-visible {
    outline:3px solid var(--color-main);
    outline-offset:5px
}

.nu-tb-title {
    text-align:center;
    font-size:var(--font-size-2xl);
    font-weight:800;
    line-height:var(--line-height-title);
    margin:0 0 var(--space-xl);
    letter-spacing:-.045em
}

.nu-tb-reward {
    position:relative;
    min-height:540px;
    isolation:isolate;
    overflow:hidden;
    background:#334a36;
    color:#fff;
	margin:var(--space-3xl) 0
}

/* ¿øº» »çÁø ÆÄÀÏ °æ·Î¸¦ ½ÇÁ¦ ÆÄÀÏ·Î º¯°æÇϼ¼¿ä. »çÁøÀÌ ¾ø¾îµµ ±×¶óµ¥À̼ÇÀº Ç¥½ÃµË´Ï´Ù. */
.nu-tb-reward-bg {
    position:absolute;
    inset:-5%;
    z-index:-2;
    background:url('../images/main4/main_bg_reward.jpg') center/cover;
    animation:tb-reward-drift 22s ease-in-out infinite alternate
}

.nu-tb-reward-inner {
    padding:var(--space-2xl) 0 170px
}

.nu-tb-reward h2 {
    font-size:var(--font-size-2xl);
    line-height:1.5;
    letter-spacing:-.035em;
    margin:0;
    font-weight:800
}
.nu-tb-reward-bottom {
    position: relative;
    display: block;
    height: 150px;
    margin: 0 auto;
    padding: 0;
    background: transparent;
    overflow: visible;
}

.nu-tb-reward-bottom > div {
    position: absolute;
    right: 0;
    bottom: 0;

    display: flex;
    align-items: center;
    justify-content: space-between;
    gap: var(--space-md);

    width: 50%;
    box-sizing: border-box;
    padding: var(--space-md) var(--space-xl);

    background: var(--theme-bg);
    color: var(--theme-text-body);

    /* ¹è°æ È®Àå¿ë °¡»ó ¿ä¼Ò¸¦ µÚ¿¡ ¹èÄ¡ */
    isolation: isolate;
}

/* ³»¿ë À§Ä¡´Â ±×´ë·Î, ¹è°æ¸¸ ¿À¸¥ÂÊ ³¡±îÁö È®Àå */
.nu-tb-reward-bottom > div::after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 100%;
    width: max(0px, calc((100vw - 200%) / 2));
    background: var(--theme-bg);
    z-index: -1;
    pointer-events: none;
}

.nu-tb-reward-bottom p {
    min-width: 0;
    margin: 0;
    font-size: var(--font-size-xs2);
    line-height: var(--line-height-loose);
    word-break: keep-all;
}

.nu-tb-reward-bottom .nu-tb-reward-link {
    flex-shrink: 0;
}

.nu-tb-reward-bottom p {
    font-size:var(--font-size-xs2);
    line-height:var(--line-height-loose);
    margin:0
}

.nu-tb-reward-link {
    display:flex;
    align-items:center;
    justify-content:center;
    gap:var(--gap-lg);
    flex-shrink:0;
    background:#000;
    color:#fff;
    border-radius:var(--radius-full);
    padding:12px 24px;
    font-weight:700;
    transition:transform .25s
}

.nu-tb-reward-link:hover {
    transform:translateY(-3px)
}

.nu-tb-reward-link span {
    display:grid;
    place-items:center;
    width:30px;
    height:30px;
    background:#fff;
    color:#000;
    border-radius:50%
}

@keyframes tb-reward-drift {
    from {
        transform:scale(1) translateX(-1%)
    }

    to {
        transform:scale(1.05) translateX(1%)
    }

}

.nu-tb-reviews,.nu-tb-pricing,.nu-tb-faq {
    padding:var(--space-3xl) 0
}

.nu-tb-pricing .ssa-slide-cta{
	margin-top:0;
	width: 170px;
	font-size:var(--font-size-xs) !important;
	font-weight:600;
}

.nu-tb-pricing .nu-tb-title{
	display:flex;
	flex-direction:column;
	justify-content:center;
	align-items:center;
	gap:20px;
}

.nu-tb-pricing .nu-tb-title-s{
	font-size:var(--font-size-sm);
	text-align:center;
	font-weight:400 !important
}

.nu-tb-pricing .nu-tb-title-s strong{
	font-size:var(--font-size-sm);
	text-align:center;
	font-weight:400 !important
}


.nu-tb-faq-more {
    display: flex;
    justify-content: center;
    width: 100%;
    margin-top: var(--space-lg);
}

.nu-tb-reviews {
    overflow:hidden
}

.nu-tb-review-row {
    overflow:hidden;
    padding:8px 0;
    margin:0 0 var(--space-md)
}

.nu-tb-review-track {
    display:flex;
    width:max-content;
    animation:tb-marquee 48s linear infinite
}

.nu-tb-review-group {
    display:flex;
    align-items:center;
    gap:var(--gap-xl);
    padding-right:var(--gap-xl);
    flex-shrink:0
}

.nu-tb-review-group p {
    position:relative;
    background: var(--ssa-color-gray-light, #f7f7fb);
    color:var(--theme-text);
    border-radius:var(--radius-full);
    padding:var(--space-sm) var(--space-lg);
    margin:0;
    min-width:340px;
    font-size:var(--font-size-sm);
    line-height:var(--line-height-text)
}

.nu-tb-review-group p:before {
    content:'';
    position:absolute;
    bottom:0;
    left:18px;
    width:24px;
    height:24px;
    background: var(--ssa-color-gray-light, #f7f7fb);
    clip-path:polygon(100% 0,100% 100%,0 100%)
}

.nu-tb-review-reverse .nu-tb-review-track {
    animation-direction:reverse;
    animation-duration:55s
}

.nu-tb-review-row:hover .nu-tb-review-track,.nu-tb-review-row:focus-visible .nu-tb-review-track,.nu-tb-review-row.nu-is-paused .nu-tb-review-track {
    animation-play-state:paused
}

@keyframes tb-marquee {
    to {
        transform:translateX(-50%)
    }

}

.nu-tb-plans {
    width:var(--contents-width-inner);
    margin:0 auto;
    display:grid;
    grid-template-columns:repeat(3,minmax(0,1fr));
    gap:var(--gap-xl);
    align-items:start
}

.nu-tb-plan {
    border:1px solid var(--color-border);
    border-radius:var(--radius-50);
    padding:var(--space-lg);
    background:var(--theme-bg)
}

.nu-tb-plan-head {
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:8px
}

.nu-tb-plan-head h3 {
    margin:0;
    font-size:var(--font-size-lg);
    letter-spacing:-.04em
}

.nu-tb-plan-head>span {
    white-space:nowrap;
    border-radius:var(--radius-full);
    background:linear-gradient(110deg,#ffd34b,#ffbd00);
    color:#000;
    padding:9px 15px;
    font-size:var(--font-size-base);
    font-weight:800;
    box-shadow:0 8px 24px #ffc40030
}

.nu-tb-price {
    margin:var(--space-sm) 0;
    font-size:var(--font-size-md);
    font-weight:700;
    white-space:nowrap
}

.nu-tb-price small {
    font-size:var(--font-size-xs);
    font-weight:600
}

.nu-tb-price em {
    font-style:normal;
    font-size:var(--font-size-xss);
    color:var(--color-gray);
    font-weight:400
}

.nu-tb-buy {
    display:block;
    text-align:center;
    padding:20px 8px;
    background:#111;
    color:#fff;
    border-radius:var(--radius-15);
    font-size:var(--font-size-sm);
    font-weight:800;
    transition:background .25s,transform .25s
}

.nu-tb-buy:hover {
    background:var(--color-main);
    transform:translateY(-2px)
}

.nu-tb-benefit-toggle {
    display:flex;
    justify-content:space-between;
    align-items:center;
    width:100%;
    border:0;
    border-top:1px solid var(--color-border);
    background:none;
    color:var(--color-gray);
    padding:var(--space-md) 0 0;
    margin-top:var(--space-md);
    font-size:var(--font-size-xss)!important;
    font-weight:700!important;
    text-align:left
}

.nu-tb-benefit-toggle span {
    font-size:22px;
    transition:transform .4s
}

.nu-tb-plan.nu-is-open .nu-tb-benefit-toggle span {
    transform:rotate(180deg)
}

.nu-tb-benefits {
    display:grid;
    grid-template-rows:0fr;
    opacity:0;
    visibility:hidden;
    transition:grid-template-rows .45s cubic-bezier(.22,1,.36,1),opacity .35s,visibility .45s
}

.nu-tb-benefits>div {
    min-height:0;
    overflow:hidden
}

.nu-tb-plan.nu-is-open .nu-tb-benefits {
    grid-template-rows:1fr;
    opacity:1;
    visibility:visible
}

.nu-tb-benefits ul {
    list-style:none;
    padding:var(--space-sm) 0 0;
    margin:0;
    font-size:var(--font-size-xss);
    line-height:var(--line-height-text)
}

.nu-tb-benefits li {
    position:relative;
    padding-left:24px;
    margin:8px 0
}

.nu-tb-benefits li:before {
    content: "\f00c";
    font-family: "Font Awesome 6 Free";
    font-weight: 900;
    position: absolute;
    left: 0;
    color: #3462ff;
}

.nu-tb-faq-list {
    margin:0 auto
}

.nu-tb-faq-item {
    display:grid;
    grid-template-columns:42% 58%;
    border-top:1px solid var(--color-border);
    align-items:start
}

.nu-tb-faq-item:last-child {
    border-bottom:1px solid var(--color-border)
}

.nu-tb-faq-item>button {
    grid-column:1/-1;
    display:flex;
    align-items:center;
    justify-content:space-between;
    gap:20px;
    border:0;
    background:none;
    color:var(--theme-text);
    padding:var(--space-md) var(--space-xs);
    text-align:left;
    font-size:var(--font-size-sm);
    font-weight:700;
    line-height:var(--line-height-text)
}

.nu-tb-faq-item.nu-is-open>button {
    grid-column:1;
    grid-row:1
}

.nu-tb-faq-item>button span {
    color:#bbb;
    font-size:25px;
    font-weight:300;
    transition:transform .3s
}

.nu-tb-faq-item.nu-is-open>button span {
    display:none
}

.nu-tb-faq-answer {
    grid-column:2;
    grid-row:1;
    display:grid;
    grid-template-rows:0fr;
    opacity:0;
    visibility:hidden;
    transform:translateY(8px);
    transition:grid-template-rows .4s,opacity .3s,transform .4s,visibility .4s
}

.nu-tb-faq-answer>div {
    min-height:0;
    overflow:hidden
}

.nu-tb-faq-answer p {
    margin:0;
    padding:var(--space-sm) var(--space-xs);
    font-size:var(--font-size-xss);
    line-height:var(--line-height-loose);
    color:var(--theme-text-body)
}

.nu-tb-faq-item.nu-is-open .nu-tb-faq-answer {
    grid-template-rows:1fr;
    opacity:1;
    visibility:visible;
    transform:none
}

.nu-tb-benefit-toggle span {
    display: block;
    flex: 0 0 9px;
    width: 9px;
    height: 9px;
    font-size: 0;
    border-right: 2px solid currentColor;
    border-bottom: 2px solid currentColor;
    transform: rotate(45deg);
    transition: transform .35s ease;
}

.nu-tb-plan.nu-is-open .nu-tb-benefit-toggle span {
    /* ¾Æ·¡ È­»ìÇ¥¿¡¼­ 180µµ ȸÀüÇÏ¿© À§ È­»ìÇ¥·Î */
    transform: rotate(225deg);
}

.nu-tb-mobile-reviews {
    display: none;
}

/* ========================================
   ¸ð¹ÙÀÏ : °íÁ¤ ¸Þ´º ³ôÀÌ / ¼½¼Ç Áß¾Ó Á¤·Ä
======================================== */
@media (max-width: 768px) {
    html:has(.nu-tb-sections) {
        /* ½ÇÁ¦ ¸Þ´º ³ôÀÌ¿¡ ¸ÂÃç Á¶Á¤Çϼ¼¿ä */
        --nu-header-height: 60px;
        --nu-bottom-height: 80px;
        --nu-section-space: 24px;

        /* ¼½¼Ç ½ÃÀÛÁ¡ÀÌ »ó´Ü Çì´õ ¾Æ·¡¿¡ ¿Àµµ·Ï */
        scroll-padding-top:
            calc(
                var(--nu-header-height)
                + var(--nu-section-space)
            );

        scroll-padding-bottom:
            calc(
                var(--nu-bottom-height)
                + env(safe-area-inset-bottom, 0px)
                + var(--nu-section-space)
            );
    }

    .nu-tb-sections {
        width: 100%;
        min-width: 0;

        /* ¸¶Áö¸· ¼½¼Çµµ ÇÏ´Ü ¸Þ´º À§·Î ¿Ã¶ó¿Ã ¼ö ÀÖµµ·Ï */
        padding-bottom:
            calc(
                var(--nu-bottom-height)
                + env(safe-area-inset-bottom, 0px)
                + var(--nu-section-space)
            );
    }

    .nu-tb-sections > section {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;

        width: 100%;
        height: auto;

        /* °íÁ¤ ¸Þ´º¿Í ¿©À¯ °ø°£À» Á¦¿ÜÇÑ ³ôÀÌ */
        min-height:
            calc(
                100svh
                - var(--nu-header-height)
                - var(--nu-bottom-height)
                - env(safe-area-inset-bottom, 0px)
                - var(--nu-section-space) * 2
            );

        margin: 0;
        padding: var(--nu-section-space) 20px;

        scroll-snap-align: start;
        scroll-snap-stop: normal;
    }

    .nu-tb-sections .nu-tb-title {
        width: 100%;
        margin: 0 0 28px;
        font-size: var(--font-size-xl);
        line-height: 1.4;
        text-align: center;
        word-break: keep-all;
    }

    /* ========================================
       Å©¸®¿¡ÀÌÅÍ ¸®¿öµå
       Á¦¸ñ ¡æ ¼³¸í ¡æ ¹öÆ°À» °°Àº ¹è°æ ¾È¿¡
    ======================================== */
    .nu-tb-sections > .nu-tb-reward {
        gap: 24px;
        padding: 36px 24px;
        text-align: center;
		height:100vh;
		margin:0
    }

    .nu-tb-reward-inner {
        width: 100%;
        max-width: 440px;
        margin: 0;
        padding: 0;
    }

    .nu-tb-reward h2 {
        font-size: var(--font-size-xl);
        line-height: 1.5;
        text-align: center;
    }

    .nu-tb-reward-bottom {
        position: relative;
        display: block;
        width: 100%;
        max-width: 440px;
        height: auto;
        margin: 0;
        padding: 0;
    }

    .nu-tb-reward-bottom > div {
        position: relative;
        right: auto;
        bottom: auto;

        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 24px;

        width: 100%;
        padding: 0;

        background: transparent;
        color: #fff;
    }

    .nu-tb-reward-bottom > div::after {
        display: none;
    }

    .nu-tb-reward-bottom p {
        margin: 0;
        font-size: var(--font-size-xs);
        line-height: 1.8;
        text-align: center;
        word-break: keep-all;
    }

    .nu-tb-reward-link {
        padding: 12px 22px;
        gap: 16px;
    }

    /* ========================================
       Èıâ : ¼¼·ÎÇü 5°³
       ±âÁ¸ JS°¡ ¸¸µç ¸ð¹ÙÀÏ Èı⠸ñ·Ï »ç¿ë
    ======================================== */
    .nu-tb-reviews > .nu-tb-review-row {
        display: none;
    }

    .nu-tb-mobile-reviews {
        display: grid;
        gap: 14px;
        width: 100%;
        max-width: 440px;
        margin: 0;
    }

    .nu-tb-mobile-reviews p {
        position: relative;
        min-width: 0;
        margin: 0;
        padding: 16px 20px;

        border-radius: var(--radius-30);
        background: var(--color-gray-light2);
        color: var(--theme-text);

        font-size: var(--font-size-xs);
        line-height: 1.6;
        word-break: keep-all;
        overflow-wrap: anywhere;
    }

    .nu-tb-mobile-reviews p:nth-child(n + 6) {
        display: none;
    }

    /* ========================================
       ÀÌ¿ë±Ç : ¼¼·Î ¹è¿­ / ÆîÄ¡¸é ³ôÀÌ È®Àå
    ======================================== */
    .nu-tb-plans {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        align-items: start;
        gap: 20px;

        width: 100%;
        max-width: 440px;
        margin: 0;
    }

    .nu-tb-plan {
        min-width: 0;
        padding: 24px;
        border-radius: var(--radius-30);
    }

    .nu-tb-plan-head {
        flex-wrap: wrap;
        gap: 12px;
    }

    .nu-tb-plan-head h3 {
        font-size: var(--font-size-lg);
    }

    .nu-tb-price {
        margin: 20px 0;
        white-space: normal;
    }

    .nu-tb-buy {
        padding: 16px 12px;
    }

    .nu-tb-benefit-toggle {
        margin-top: 24px;
        padding-top: 20px;
    }

    .nu-tb-benefits ul {
        font-size: var(--font-size-xss);
        line-height: 1.7;
    }

    /* ========================================
       FAQ : Áú¹® ¾Æ·¡¿¡ ´äº¯ Ç¥½Ã
    ======================================== */
    .nu-tb-faq-list {
        width: 100%;
        max-width: 560px;
        margin: 0;
    }

    .nu-tb-faq-item {
        grid-template-columns: minmax(0, 1fr);
    }

    .nu-tb-faq-item > button,
    .nu-tb-faq-item.nu-is-open > button {
        grid-column: 1 / -1;
        grid-row: auto;

        align-items: flex-start;
        gap: 16px;
        padding: 20px 0;

        font-size: var(--font-size-xs);
        line-height: 1.6;
        word-break: keep-all;
    }

    .nu-tb-faq-item > button span {
        display: block;
        flex-shrink: 0;
        line-height: 1;
    }

    .nu-tb-faq-item.nu-is-open > button span {
        display: block;
        transform: rotate(45deg);
    }

    .nu-tb-faq-answer {
        grid-column: 1 / -1;
        grid-row: auto;
        min-width: 0;
    }

    .nu-tb-faq-answer p {
        padding: 0 0 24px;
        font-size: var(--font-size-xss);
        line-height: 1.9;
        word-break: keep-all;
        overflow-wrap: anywhere;
    }
}


@media (max-width: 768px) {
    html:has(.ssa-root),
    html:has(.nu-tb-sections) {
        --ssa-fixed-header: 60px;
        --ssa-fixed-bottom: 80px;
        --ssa-section-gap: 24px;

        scroll-snap-type: y proximity;

        /* ¼½¼Ç ½ÃÀÛÁ¡À» Çì´õ ¹Ù·Î ¾Æ·¡¿¡ ¸ÂÃã */
        scroll-padding-top: var(--ssa-fixed-header);

        scroll-padding-bottom:
            calc(
                var(--ssa-fixed-bottom)
                + var(--ssa-section-gap)
            );
    }

    .ssa-root .ssa-main-content > section {
        box-sizing: border-box;
	}

    .ssa-root .ssa-main-content > section,
    .nu-tb-sections > section {
        scroll-snap-align: start;
        scroll-snap-stop: normal;
        scroll-margin-top: 0;
    }

    .ssa-root .ssa-content-flow-title {
        position: relative;
        top: auto;
    }
}

@media (max-width: 768px) {
    html:has(.ssa-root),
    html:has(.nu-tb-sections) {
        scroll-snap-type: y mandatory !important;
        scroll-padding-top: 0 !important;
        scroll-padding-bottom: 0 !important;
    }

    .ssa-root .ssa-main-content > section,
    .nu-tb-sections > section {
        display: flex;
        flex-direction: column;
        justify-content: center;

        box-sizing: border-box;
        min-height: 100vh !important;
        height: auto !important;

        padding-top: 0 !important;
        padding-bottom: 0 !important;
        margin-top: 0 !important;
        margin-bottom: 0 !important;

        scroll-snap-align: start !important;
        scroll-snap-stop: always !important;
        scroll-margin-top: 0 !important;
    }

    .nu-tb-sections {
        padding-bottom: 0 !important;
    }
}



/* ========================================
   ¸ð¹ÙÀÏ ÀÌ¿ë±Ç : 100vh ¾È¿¡ 3°³ Ç¥½Ã
======================================== */
@media (max-width: 768px) {
    .nu-tb-sections > .nu-tb-pricing {
        display: flex;
        flex-direction: column;
        align-items: center;
        justify-content: center;
        gap: 16px;

        box-sizing: border-box;
        width: 100%;
        height: auto !important;
        min-height: 100vh !important;

        margin: 0 !important;

        /* °íÁ¤ ¸Þ´º¿¡ ³»¿ëÀÌ °¡¸®Áö ¾Êµµ·Ï ³»ºÎ ¿©¹é */
        padding: 76px 20px 96px !important;

        scroll-snap-align: start !important;
        scroll-snap-stop: always !important;
        scroll-margin-top: 0 !important;
    }

    .nu-tb-pricing .nu-tb-title {

        text-align: center;
    }

    .nu-tb-pricing .nu-tb-plans {
        display: grid;
        grid-template-columns: minmax(0, 1fr);
        gap: 12px;

        width: 100%;
        max-width: 400px;
        margin: 0;
    }

    .nu-tb-pricing .nu-tb-plan {
        display: grid;
        grid-template-columns: minmax(0, 1fr) auto;
        align-items: center;
        gap: 12px;

        min-width: 0;
        margin: 0;
        padding: 18px;
        border-radius: 20px;
    }

    /* ÀÌ¿ë±Ç À̸§°ú ±¸µ¶±Ç ¹èÁö */
    .nu-tb-pricing .nu-tb-plan-head {
        grid-column: 1 / -1;
        display: flex;
        flex-wrap: wrap;
        align-items: center;
        justify-content: space-between;
        gap: 8px;
    }

    .nu-tb-pricing .nu-tb-plan-head h3 {
        margin: 0;
        font-size: 22px;
        line-height: 1.2;
    }

    .nu-tb-pricing .nu-tb-plan-head > span {
        padding: 6px 10px;
        font-size: 10px;
        line-height: 1.3;
        box-shadow: none;
    }

    /* °¡°ÝÀº ¿ÞÂÊ, ±¸¸Å ¹öÆ°Àº ¿À¸¥ÂÊ */
    .nu-tb-pricing .nu-tb-price {
        min-width: 0;
        margin: 0;
        font-size: 20px;
        line-height: 1.4;
        white-space: normal;
    }

    .nu-tb-pricing .nu-tb-price small {
        font-size: 12px;
    }

    .nu-tb-pricing .nu-tb-price em {
        font-size: 11px;
    }

    .nu-tb-pricing .nu-tb-buy {
        display: flex;
        align-items: center;
        justify-content: center;

        min-height: 44px;
        padding: 10px 12px;
        border-radius: 12px;

        font-size: 12px;
        line-height: 1.4;
        white-space: nowrap;
    }

    /* Æ÷ÇÔ ÇýÅà ¹öÆ°°ú ³»¿ë ¸ðµÎ ¼û±è */
    .nu-tb-pricing .nu-tb-benefit-toggle,
    .nu-tb-pricing .nu-tb-benefits {
        display: none !important;
    }
}

/* ¼¼·Î ³ôÀÌ°¡ ÀÛÀº ¸ð¹ÙÀÏ */
@media (max-width: 768px) and (max-height: 700px) {
    .nu-tb-sections > .nu-tb-pricing {
        gap: 12px;
    }

    .nu-tb-pricing .nu-tb-title {
        font-size: 24px;
    }

    .nu-tb-pricing .nu-tb-plans {
        gap: 20px;
    }

    .nu-tb-pricing .nu-tb-plan {
        padding:var(--space-lg);
        gap: 8px;
    }

    .nu-tb-pricing .nu-tb-plan-head h3 {
        font-size: 20px;
    }

    .nu-tb-pricing .nu-tb-price {
        font-size: 18px;
    }

    .nu-tb-pricing .nu-tb-buy {
        min-height: 40px;
    }
}


/* ========================================
   ºê·£µå ±¤°í¿µ»ó : ÁÖ¼Ò µî·Ï ¾Ö´Ï¸ÞÀ̼Ç
======================================== */
.ssa-content-flow-visual.nu-brand-demo {
    display: grid;
    place-items: center;
    padding: 0;
    overflow: hidden;
    container-type: inline-size;

    background: var(--ssa-color-gray-light, #f7f7fb);
}

.nu-brand-address-ui {
    display: flex;
    align-items: center;
    gap: 3cqw;

    width: 82%;
    padding: 2cqw;
    border-radius: 4.5cqw;
    background: #fff;
}

.nu-brand-address {
    display: flex;
    align-items: center;
    gap: 2.5cqw;

    flex: 1;
    min-width: 0;
    padding-left: 3cqw;
}

.nu-brand-pin {
    flex-shrink: 0;
    width: 5cqw;
    height: 6cqw;
    color: #03c923;
}

.nu-brand-address strong {
    min-width: 0;
    color: #111;
    font-size: var(--font-size-sm);
    font-weight: 600;
    letter-spacing: -0.04em;
    white-space: nowrap;
	opacity: 1 !important;

    animation: nu-brand-address-show 7s ease infinite;
}

.nu-brand-register {
    position: relative;
    flex: 0 0 31%;
    height: 15cqw;
    border-radius: 3cqw;

    background: linear-gradient(110deg, #7bc900, #12c500);
    color: #fff;
    font-size: 3.9cqw;
    font-weight: 700;

    animation: nu-brand-button-press 7s ease infinite;
}

.nu-brand-register > span {
    position: absolute;
    inset: 0;

    display: flex;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
}

.nu-brand-register-label {
    animation: nu-brand-register-label 7s linear infinite;
}

.nu-brand-complete-label {
    opacity: 0;
    animation: nu-brand-complete-label 7s linear infinite;
}

/* ÁÖ¼Ò°¡ ÇÑ ¹ø¿¡ ³ªÅ¸³ª´Â È¿°ú */
@keyframes nu-brand-address-show {
    0%, 8% {
        opacity: 0;
        transform: translateY(4px);
    }

    16%, 90% {
        opacity: 1;
        transform: translateY(0);
    }

    100% {
        opacity: 0;
        transform: translateY(4px);
    }
}

/* ¹öÆ° ´©¸§ */
@keyframes nu-brand-button-press {
    0%, 40%, 52%, 100% {
        transform: scale(1);
        filter: brightness(1);
    }

    46% {
        transform: scale(.94);
        filter: brightness(.9);
    }
}

/* ÁÖ¼Ò µî·Ï ¡æ µî·Ï ¿Ï·á */
@keyframes nu-brand-register-label {
    0%, 47% {
        opacity: 1;
    }

    52%, 90% {
        opacity: 0;
    }

    96%, 100% {
        opacity: 1;
    }
}

@keyframes nu-brand-complete-label {
    0%, 47% {
        opacity: 0;
    }

    52%, 90% {
        opacity: 1;
    }

    96%, 100% {
        opacity: 0;
    }
}

/* È­¸é ¹Û¿¡¼­´Â Á¤Áö */
.nu-brand-demo:not(.nu-is-visible) .nu-brand-address strong,
.nu-brand-demo:not(.nu-is-visible) .nu-brand-register,
.nu-brand-demo:not(.nu-is-visible) .nu-brand-register > span {
    animation-play-state: paused;
}

/* ¸ð¼Ç ÃÖ¼ÒÈ­ */
@media (prefers-reduced-motion: reduce) {
    .nu-brand-demo .nu-brand-address strong,
    .nu-brand-demo .nu-brand-register,
    .nu-brand-demo .nu-brand-register > span {
        animation: none;
        transform: none;
    }

    .nu-brand-register-label {
        opacity: 1;
    }

    .nu-brand-complete-label {
        opacity: 0;
    }
}


/* ´Ù¾çÇÑ ÄÜÅÙÃ÷ : Ä«µå À̹ÌÁö ¿µ¿ª ºñÀ² ÅëÀÏ */
.ssa-content-flow .ssa-content-flow-card .ssa-content-flow-visual {
    box-sizing: border-box;
    width: 100%;
    height: auto !important;
    min-height: 0 !important;
    max-height: none !important;

    /* °¡·Î 10 : ¼¼·Î 7 */
    aspect-ratio: 10 / 6 !important;

    overflow: hidden;
}

/* ========================================
   Á¦°ø ÇýÅà : PC 4¿­ / ¸ð¹ÙÀÏ 2¿­
======================================== */
.nu-feature-grid {
    display: grid;
    grid-template-columns: repeat(4, minmax(0, 1fr));
    gap: var(--gap-md);
    margin: 0 auto;
}

.nu-feature-card {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: flex-start;
    gap: 18px;

    box-sizing: border-box;
    min-width: 0;
    padding: 36px 20px;

    border-radius: var(--radius-30);
    background: var(--ssa-color-gray-light, #f7f7fb);

    text-align: center;

    transition:
        transform .3s ease,
        border-color .3s ease,
        box-shadow .3s ease;
}

.nu-feature-card:hover {
    border-color: var(--color-main);
}

.nu-feature-icon {
    display: grid;
    place-items: center;
    flex-shrink: 0;

    width: 68px;
    height: 68px;
    border-radius: var(--radius-20);

    color: var(--color-main);
    font-size: 28px;
}

.nu-feature-card h3 {
    display: flex;
    align-items: center;
    justify-content: center;

    min-height: 3em;
    margin: 0;

    color: var(--theme-text);
    font-size: var(--font-size-sm);
    font-weight: 700;
    line-height: 1.5;
    letter-spacing: -.04em;
    word-break: keep-all;
    overflow-wrap: anywhere;
}

.nu-feature-card p {
    margin: 0;
    color: var(--theme-text-body);
    font-size: var(--font-size-xss);
    line-height: 1.8;
    word-break: keep-all;
    overflow-wrap: anywhere;
}

/* ¸ð¹ÙÀÏ */
@media (max-width: 768px) {
    .nu-feature-grid {
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 12px;

        width: 100%;
        max-width: 480px;
		padding:0
    }

    .nu-feature-card {
        gap: 12px;
        padding: 10px 12px;
        border-radius: 18px;
		flex-direction: row;
		text-align:left;
    }

	 .nu-feature-grid > .nu-feature-card:last-child {
        grid-column: 1 / -1;
    }

    .nu-feature-icon {
        width: 30px;
        height: 30px;
        border-radius: 14px;
        font-size: 16px;


    }

    .nu-feature-card h3 {
        font-size: 14px;
    }

    .nu-feature-card p {
        font-size: 12px;
        line-height: 1.6;

		display:none
    }
}

@media (prefers-reduced-motion: reduce) {
    .nu-feature-card {
        transition: none;
    }

    .nu-feature-card:hover {
        transform: none;
    }
}


@media (max-width: 768px) {
    footer {
        scroll-snap-align: end !important;
        scroll-snap-stop: normal !important;
        scroll-margin: 0 !important;
    }
}