/* 원본 SNS 섹션의 반응형 CSS와 폰트를 독립 스코프로 보존한다. */
@font-face{font-family:PlanetPretendard;font-weight:900;font-style:normal;font-display:swap;src:local("Pretendard Black"),url(/assets/reference/planet/Pretendard-Black.woff2) format("woff2")}
@font-face{font-family:PlanetPretendard;font-weight:800;font-style:normal;font-display:swap;src:local("Pretendard ExtraBold"),url(/assets/reference/planet/Pretendard-ExtraBold.woff2) format("woff2")}
@font-face{font-family:PlanetPretendard;font-weight:700;font-style:normal;font-display:swap;src:local("Pretendard Bold"),url(/assets/reference/planet/Pretendard-Bold.woff2) format("woff2")}
@font-face{font-family:PlanetPretendard;font-weight:400;font-style:normal;font-display:swap;src:local("Pretendard Regular"),url(/assets/reference/planet/Pretendard-Regular.woff2) format("woff2")}
.planet-sns-reference{font:400 12px PlanetPretendard,sans-serif;word-break:keep-all;overflow-wrap:break-word;color:#191919;background:#f5f6f8;text-align:left}
.planet-sns-reference *{box-sizing:border-box;margin:0;padding:0;border:0}
.planet-sns-reference p{word-break:break-all}
.planet-sns-reference img{vertical-align:middle}
.planet-sns-reference{
			--f10px: 10px;
			--f11px: 11px;
			--f12px: 12px;
			--f13px: 13px;
			--f14px: 14px;
			--f15px: 15px;
			--f16px: 16px;
			--f17px: 17px;
			--f18px: 18px;
			--f19px: 19px;
			--f20px: 20px;
			--f21px: 21px;
			--f22px: 22px;
			--f23px: 23px;
			--f24px: 24px;
			--f25px: 25px;
			--f26px: 26px;
			--f27px: 27px;
			--f28px: 28px;
			--f29px: 29px;
			--f30px: 30px;
			--f32px: 32px;
			--f34px: 34px;
			--f36px: 36px;
			--f38px: 38px;
			--f40px: 40px;
			--f42px: 42px;
			--f44px: 44px;
			--f46px: 46px;
			--f48px: 48px;
			--f50px: 50px;
			--f60px: 60px;

			--color__basic: #020202;
			--color__hover: #575BDB;
			--color__white: #fff;
			--color__main: #575BDB;
			--color__sub01: #020202;

			--header__theight: 40px;
			--header__bheight: 90px;


			--bg__light: #F9FAFB;
			--text-dark: #1d1d1d;
			--shadow-default:0 4px 6px -1px rgba(0,0,0,.05),0 2px 4px -1px rgba(0,0,0,.03);
		}
@media  screen and (max-width:1600px){.planet-sns-reference{
				--f60px: 60px;
			}
}@media  screen and (max-width:1440px){.planet-sns-reference{
				--f60px: 55px;
			}
}@media  screen and (max-width:1280px){.planet-sns-reference{
				--f60px: 50px;
			}
}@media  screen and (max-width:1024px){.planet-sns-reference{
				--f60px: 45px;
			}
}@media  screen and (max-width:768px){.planet-sns-reference{
				--f60px: 40px;
			}
}@media  screen and (max-width:570px){.planet-sns-reference{
				--f60px: 35px;
			}
}@media  screen and (max-width:480px){.planet-sns-reference{
				--f60px: 14.2vw;
			}
}.planet-sns-reference .inner__cen1840{position:relative; width:90%; max-width:1840px; margin: 0 auto;}
@media  screen and (max-width:1840px){.planet-sns-reference .inner__cen1840{width:90%;}
}.planet-sns-reference{
	--f10px: 10px;
	--f11px: 11px;
	--f12px: 12px;
	--f13px: 13px;
	--f14px: 14px;
	--f15px: 15px;
	--f16px: 16px;
	--f17px: 17px;
	--f18px: 18px;
	--f19px: 19px;
	--f20px: 20px;
	--f21px: 21px;
	--f22px: 22px;
	--f23px: 23px;
	--f24px: 24px;
	--f25px: 25px;
	--f26px: 26px;
	--f27px: 27px;
	--f28px: 28px;
	--f29px: 29px;
	--f30px: 30px;
	--f32px: 32px;
	--f34px: 34px;
	--f36px: 36px;
	--f38px: 38px;
	--f40px: 40px;
	--f42px: 42px;
	--f44px: 44px;
	--f46px: 46px;
	--f48px: 48px;
	--f50px: 50px;
	--f60px: 60px;

	--color__basic: #191919;
	--color__hover: #034694;
	--color__white: #fff;
	--color__main: #034694;
	--color__sub01: #191919;

	--header__theight: 40px;
	--header__bheight: 90px;

	--mpx: 1px;
}
@media  screen and (max-width: 767px) {.planet-sns-reference{ --mpx: clamp(1px, calc(1px + (100vw - 375px) * 0.3 / 392), 1.3px); }
}.planet-sns-reference{ --mpy: var(--mpx); }
@media  screen and (max-width: 1600px) {.planet-sns-reference{ --f60px: 60px; }
}@media  screen and (max-width: 1440px) {.planet-sns-reference{ --f60px: 55px; }
}@media  screen and (max-width: 1280px) {.planet-sns-reference{ --f60px: 50px; }
}@media  screen and (max-width: 1024px) {.planet-sns-reference{ --f60px: 45px; }
}@media  screen and (max-width: 768px) {.planet-sns-reference{ --f60px: 40px; }
}@media  screen and (max-width: 570px) {.planet-sns-reference{ --f60px: 35px; }
}@media  screen and (max-width: 480px) {.planet-sns-reference{ --f60px: 14.2vw; }
}.planet-sns-reference .inner__cen1840{ position: relative; width: 95%; max-width: 1840px; margin: 0 auto; }
@media  screen and (max-width: 767px) {.planet-sns-reference [class*="inner__cen"]{ width: calc(100% - 40 * var(--mpx)); }
}.planet-sns-reference .main__contents__wr{
	padding: 160px 0;
}
.planet-sns-reference .main__sns__section.main__contents__wr{
	position: relative;
	height: 100svh;
	padding: 0;
	overflow: hidden;
	background: #f5f6f8;
	color: #000;
}
.planet-sns-reference .main__sns__inner{
	position: relative;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: clamp(40px, 10vw, 194px);
	padding: 100px clamp(24px, 14vw, 280px) 72px;
	box-sizing: border-box;
}
.planet-sns-reference .main__sns__copy{
	position: relative;
	z-index: 1;
	flex: 0 1 525px;
	width: min(525px, 100%);
}
.planet-sns-reference .main__sns__title{
	margin: 0;
	font-family: PlanetPretendard, sans-serif;
	font-size: clamp(36px, 3.33vw, 64px);
	font-weight: 800;
	line-height: 1.2;
	letter-spacing: -0.025em;
	color: #000;
}
.planet-sns-reference .main__sns__title__line{
	display: block;
}
.planet-sns-reference .main__sns__title__line--accent{
	color: #2b5fff;
}
.planet-sns-reference .main__sns__desc{
	margin: 40px 0 0;
	max-width: 509px;
	font-family: PlanetPretendard, sans-serif;
	font-size: clamp(16px, 1.25vw, 24px);
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: -0.025em;
	color: rgba(0, 0, 0, 0.8);
}
.planet-sns-reference .main__sns__desc__line{
	display: block;
}
.planet-sns-reference .main__sns__desc strong{
	font-weight: 700;
}
.planet-sns-reference .main__sns__panel{
	position: relative;
	flex: 0 0 394px;
	width: 394px;
	max-width: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 1;
}
.planet-sns-reference .main__sns__glow{
	position: absolute;
	left: 50%;
	top: 50%;
	width: 612px;
	height: 612px;
	border-radius: 50%;
	background: rgba(43, 95, 255, 0.1);
	pointer-events: none;
	z-index: 0;
}
.planet-sns-reference .main__sns__glow-ring{
	position: absolute;
	inset: 0;
	border: 2px solid rgba(43, 95, 255, 0.45);
	border-radius: 50%;
	opacity: 0;
	pointer-events: none;
}
.planet-sns-reference .main__sns__drop{
	position: absolute;
	left: 50%;
	top: 50%;
	border-radius: 50%;
	background: #2b5fff;
	pointer-events: none;
	will-change: transform, opacity;
}
.planet-sns-reference .main__sns__fx{
	position: absolute;
	inset: 0;
	z-index: 6;
	pointer-events: none;
}
.planet-sns-reference .main__sns__fx-ring,.planet-sns-reference .main__sns__fx-spark{
	position: absolute;
	left: 0;
	top: 0;
	will-change: transform, opacity;
}
.planet-sns-reference .main__sns__fx-ring{
	width: 120px;
	height: 120px;
	border: 2px solid rgba(43, 95, 255, 0.7);
	border-radius: 50%;
	box-sizing: border-box;
}
.planet-sns-reference .main__sns__web__ripple{
	position: absolute;
	left: 50%;
	top: 0;
	z-index: 1;
	width: 100px;
	height: 100px;
	border: 2px solid rgba(255, 255, 255, 0.55);
	border-radius: 50%;
	box-sizing: border-box;
	pointer-events: none;
	will-change: transform, opacity;
}
.planet-sns-reference .main__sns__web__shine{
	position: absolute;
	top: -20%;
	left: 0;
	z-index: 3;
	width: 45%;
	height: 140%;
	background: linear-gradient(100deg, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 0.28) 50%, rgba(255, 255, 255, 0) 100%);
	pointer-events: none;
	will-change: transform, opacity;
}
.planet-sns-reference .main__sns__fx-spark{
	width: 16px;
	height: 3px;
	margin-top: -1.5px;
	border-radius: 3px;
	background: linear-gradient(90deg, rgba(43, 95, 255, 0), #2b5fff 60%, #8fb0ff);
	transform-origin: 0 50%;
}
.planet-sns-reference .main__sns__list{
	position: relative;
	z-index: 5;
	display: flex;
	flex-direction: column;
	gap: 24px;
	width: 100%;
}
.planet-sns-reference .main__sns__card{
	position: relative;
	width: 100%;
	padding: 24px;
	border-radius: 16px;
	background: #fff;
	box-sizing: border-box;
	transform-origin: 50% 50%;
	will-change: transform, opacity;
}
.planet-sns-reference .main__sns__card__head{
	position: relative;
	padding: 0 80px 20px 0;
	border-bottom: 1px solid #ddd;
}
.planet-sns-reference .main__sns__card__en{
	margin: 0;
	font-family: PlanetPretendard, sans-serif;
	font-size: 12px;
	font-weight: 700;
	line-height: 1.2;
	letter-spacing: 0;
	text-transform: uppercase;
	color: #999;
}
.planet-sns-reference .main__sns__card__name{
	margin: 9px 0 0;
	font-family: PlanetPretendard, sans-serif;
	font-size: 24px;
	font-weight: 800;
	line-height: 1.2;
	color: #080808;
}
.planet-sns-reference .main__sns__card__icon{
	position: absolute;
	right: 0;
	top: -15px;
	width: 67px;
	height: 88px;
	object-fit: contain;
	mix-blend-mode: luminosity;
	pointer-events: none;
}
.planet-sns-reference .main__sns__card__desc{
	margin: 16px 0 0;
	font-family: PlanetPretendard, sans-serif;
	font-size: 14px;
	font-weight: 400;
	line-height: 22px;
	color: #686868;
}
.planet-sns-reference .main__sns__card__desc strong{
	font-weight: 700;
}
.planet-sns-reference .main__sns__web{
	position: absolute;
	left: 50%;
	top: 50%;
	width: 464px;
	height: 636px;
	margin: -318px 0 0 -232px;
	border-radius: 23px;
	overflow: hidden;
	background: #2b5fff;
	z-index: 2;
	pointer-events: none;
	will-change: transform, opacity;

	scale: var(--land-sx, 1) var(--land-sy, 1) !important;
	translate: 0 var(--land-y, 0px) !important;
}
.planet-sns-reference .main__sns__web__copy{
	position: relative;
	z-index: 2;
	padding: 77px 40px 0 58px;
}
.planet-sns-reference .main__sns__web__title{
	margin: 0;
	font-family: PlanetPretendard, sans-serif;
	font-size: 40px;
	font-weight: 900;
	line-height: 1.3;
	letter-spacing: -0.025em;
	color: #fff;
}
.planet-sns-reference .main__sns__web__desc{
	margin: 19px 0 0;
	max-width: 280px;
	font-family: PlanetPretendard, sans-serif;
	font-size: 17.5px;
	font-weight: 400;
	line-height: 1.3;
	letter-spacing: -0.025em;
	color: #fff;
}
.planet-sns-reference .main__sns__web__mark{
	position: absolute;
	left: 134px;
	top: 490px;
	z-index: 1;
	margin: 0;
	font-family: PlanetPretendard, sans-serif;
	font-size: 148px;
	font-weight: 700;
	line-height: 1.3;
	letter-spacing: 3.7px;
	color: #fff;
	white-space: nowrap;
	pointer-events: none;
}
.planet-sns-reference .main__sns__web__astro-wr{
	position: absolute;
	left: -42px;
	top: 238px;
	z-index: 2;
	width: 560px;
	pointer-events: none;
	will-change: transform;
	animation: sns-astro-float 2.5s ease-in-out infinite alternate;
}
.planet-sns-reference .main__sns__web__astro{
	display: block;
	width: 100%;
	max-width: none;
	height: auto;
	transform: scaleX(-1);
	transform-origin: 48% 56%;
	mix-blend-mode: lighten;
	will-change: transform;
	animation: sns-astro-drift 5.8s ease-in-out -1.4s infinite alternate;
}
@keyframes sns-astro-float {
	from {
		transform: translate3d(-2px, 5px, 0) rotate(-15.8deg);
	}
	to {
		transform: translate3d(5px, -18px, 0) rotate(-21.2deg);
	}
}@keyframes sns-astro-drift {
	from {
		transform: scaleX(-1) translate3d(-5px, 0, 0) rotate(-0.7deg) scale(0.998);
	}
	to {
		transform: scaleX(-1) translate3d(7px, 0, 0) rotate(0.8deg) scale(1.006);
	}
}@media  screen and (max-width: 1024px) {.planet-sns-reference .main__sns__inner{
		justify-content: center;
		gap: clamp(24px, 5vw, 64px);
		padding: 100px 0 72px;
	}
.planet-sns-reference .main__sns__copy{
		flex: 0 1 420px;
		min-width: 0;
	}
.planet-sns-reference .main__sns__title{
		font-size: clamp(28px, 3.5vw, 36px);
	}
.planet-sns-reference .main__sns__desc{
		font-size: 16px;
		word-break: keep-all;
	}
.planet-sns-reference .main__sns__panel{
		margin: 0 35px;
	}
.planet-sns-reference .main__sns__glow{
		width: 520px;
		height: 520px;
	}
}@media  screen and (min-width: 768px) and (max-width: 1024px) {.planet-sns-reference .main__sns__panel{
		margin: 0 -11px;
		scale: 0.8;
	}
.planet-sns-reference .main__sns__card__en{
		font-size: 17.5px;
	}
.planet-sns-reference .main__sns__card__desc{
		font-size: 17.5px;
		line-height: 1.5;
		word-break: keep-all;
	}
}@media  screen and (max-width: 767px) {.planet-sns-reference .main__sns__section.main__contents__wr{
		height: auto;
		min-height: 100svh;
	}
.planet-sns-reference .main__sns__inner{
		flex-direction: column;
		justify-content: flex-start;
		align-items: stretch;
		gap: calc(40 * var(--mpy));
		padding: calc(79 * var(--mpx)) 0 calc(36 * var(--mpy));
	}
.planet-sns-reference .main__sns__copy{
		flex: none;
		width: 100%;
	}
.planet-sns-reference .main__sns__title{
		font-size: calc(32 * var(--mpx));
		font-weight: 700;
	}
.planet-sns-reference .main__sns__title__line{
		display: inline;
	}
.planet-sns-reference .main__sns__title__line--accent:nth-child(3)::before{
		content: "\A ";
		white-space: pre;
	}
.planet-sns-reference .main__sns__desc{
		margin-top: calc(20 * var(--mpy));
		font-size: calc(14 * var(--mpx));
	}
.planet-sns-reference .main__sns__panel{
		flex: none;
		width: 100%;
		align-self: center;
	}
.planet-sns-reference .main__sns__glow{
		display: none;
	}
.planet-sns-reference .main__sns__list{
		gap: calc(8 * var(--mpy));
	}
.planet-sns-reference .main__sns__card{
		padding: calc(18 * var(--mpy)) calc(20.4 * var(--mpy));
		border-radius: calc(13.6 * var(--mpy));
	}
.planet-sns-reference .main__sns__card__head{
		padding: 0 calc(64 * var(--mpy)) calc(14 * var(--mpy)) 0;
		border-bottom-width: 0.85px;
	}
.planet-sns-reference .main__sns__card__en{
		font-size: calc(14 * var(--mpx));
	}
.planet-sns-reference .main__sns__card__name{
		margin-top: calc(6 * var(--mpy));
		font-size: calc(20 * var(--mpy));
	}
.planet-sns-reference .main__sns__card__icon{
		top: calc(-12.75 * var(--mpy));
		width: calc(57 * var(--mpy));
		height: calc(75 * var(--mpy));
	}
.planet-sns-reference .main__sns__card__desc{
		margin-top: calc(12 * var(--mpy));
		font-size: calc(14 * var(--mpx));
		line-height: 1.5;
		word-break: keep-all;
	}
.planet-sns-reference .main__sns__web{
		left: 0;
		top: 0;
		width: 100%;
		height: calc(459 * var(--mpy));
		margin: 0;
		border-radius: calc(16.6 * var(--mpy));
	}
.planet-sns-reference .main__sns__web__copy{
		padding: calc(55.6 * var(--mpy)) calc(20 * var(--mpy)) 0 calc(41.9 * var(--mpy));
	}
.planet-sns-reference .main__sns__web__title{
		font-size: calc(30 * var(--mpy));
	}
.planet-sns-reference .main__sns__web__desc{
		max-width: none;
		margin-top: calc(12 * var(--mpy));
		font-size: calc(14 * var(--mpx));
	}
.planet-sns-reference .main__sns__web__mark{
		left: auto;
		right: calc(-10.2 * var(--mpy));
		top: calc(353.8 * var(--mpy));
		font-size: calc(108 * var(--mpy));
		letter-spacing: calc(2.7 * var(--mpy));
	}
.planet-sns-reference .main__sns__web__astro-wr{
		left: calc(58% - 202 * var(--mpy));
		top: calc(189 * var(--mpy));
		width: calc(404 * var(--mpy));
	}
}
.reference-section.planet-sns-host{padding:0;min-height:0;display:block;background:none}
.reference-section.planet-sns-host>.section-content{width:100%;max-width:none;margin:0}
.planet-sns-reference{width:calc(100vw - 10px)} .reference-section.planet-sns-host{overflow-x:clip}

/* 실사 인물은 카드 하단에 정자세로 배치하고 기존 카드 전환은 유지한다. */
.planet-sns-reference .main__sns__web--portrait .main__sns__web__astro-wr {
  left: 4%;
  top: auto;
  bottom: 0;
  width: 92%;
  animation: none;
  transform: none !important;
}
.planet-sns-reference .main__sns__web--portrait .main__sns__web__astro {
  animation: none;
  transform: none;
  mix-blend-mode: normal;
  filter: drop-shadow(0 10px 16px #00113f29);
}
