/* =========================================================

WAVE LIFE

========================================================= */

/* 基本設定
-------------------------------------- */
:root {
	--font-en: "Zalando Sans Expanded", sans-serif;
	--font-jp: "Noto Sans JP", sans-serif;
	--me-text-color: #000;
	--bg-color: #000;
	--dark-bg: #1a1f24;
	--accent-color: #fff;
}

#life_index {
	font-family: "Zalando Sans Expanded", "Noto Sans JP", sans-serif;
	overflow-x: clip;
	-webkit-font-smoothing: antialiased;
	cursor:
		url("/life/index/img/cursor.svg") 3 2,
		auto;
	background-color: #fff;
	-webkit-user-select: none;
	-ms-user-select: none;
	user-select: none;
}
img{
	display: block;
	-webkit-user-drag: none;
	user-drag: none;
}

input,
textarea,
[contenteditable="true"] {
	-webkit-user-select: text;
	-ms-user-select: text;
	user-select: text;
}

.main_content{
	background:#fff;
}

/* 共通
-------------------------------------- */
.me_section {
	overflow-x: clip;
	background-color: #fff;
	position: sticky;
}

.dc_item {
	position: absolute;
}

.sp_only {
	display: none;
}

.pc_only {
	display: block;
}

@media (pointer: coarse) {
	#life_index {
		cursor: auto;
	}
}

@media (max-width: 1024px) {
	.sp_only {
		display: block;
	}

	.pc_only {
		display: none;
	}
}

/* 青背景 */
.blue_wave_bg {
	position: absolute;
	top: 50%;
	left: 50%;
	width: max(1500px,118.85vw);
	height: 100%;
	transform: translate(-50%, -50%) rotate(-15deg);
	transform-origin: center center;
	z-index: 0;
	pointer-events: none;
}

.blue_wave_bg_box {
	width: 100%;
	height: 100%;
	background: #0000fe;
}

.blue_wave_bg .blue_wave_bg_svg {
	position: absolute;
	width: max(1500px,108.6vw);
	height: max(220px,11.8vw);
	display: block;
	transform-origin: center top;
}
.blue_wave_bg .blue_wave_bg_svg_left {
	top: -5.9vw;
	right: 50%;
	transform: translateX(57%);
}
.blue_wave_bg .blue_wave_bg_svg_right {
	bottom: -5.9vw;
	left: 50%;
	transform: translateX(-57%);
}
.blue_wave_bg svg path {
	width: 100%;
	height: 100%;
}
.blue_wave_bg svg .uneune_sp {
	display: none;
}
.dc_me_line {
	width: min(2.9vw, 42.5px);
	height: fit-content;
	top: 0;
	bottom: 0;
	margin: auto;
}
.dc_me_line_left {
	left: -36.56%;
}
.dc_me_line_right {
	right: -36.56%;
}
.text_section .dc_me_line_left {
	top: 50%;
}
.text_section .dc_me_line_right {
	top: -100%;
}
@media (max-width: 1024px) {
	.blue_wave_bg {
		margin-top: 26.8%;
		width: 141.42vw;
	}
	.blue_wave_bg svg .uneune_pc {
		display: none;
	}
	.blue_wave_bg svg .uneune_sp {
		display: block;
	}
	.blue_wave_bg .blue_wave_bg_svg {
		position: absolute;
		width: 129.1vw;
		height: 23.68vw;
	}
	.blue_wave_bg .blue_wave_bg_svg_left{
		top: -9.84vw;
		left: 50%;
		transform: translateX(-35%);
	}
	.blue_wave_bg .blue_wave_bg_svg_right {
		bottom: -9.84vw;
		left: 50%;
		transform: translateX(-62%);
	}
}

/* ローディング画面
-------------------------------------- */
.is_paused,
.is_paused *,
.is_paused *::before,
.is_paused *::after {
	animation-play-state: paused !important;
}

html {
	scrollbar-gutter: stable;;	/* 画面ロック */
}
#life_index.is_opening_locked {
	overflow: hidden;	/* 画面ロック */
}

.opening_overlay {
	position: fixed;
	inset: 0;
	z-index: 100000;
	background: transparent;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: center;
	opacity: 1;
	font-family: var(--font-en);
}
.opening_overlay.is_hidden {
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.6s ease;
}
.opening_overlay_bg {
	position: absolute;
	inset: 0;
	background: #fff;
	z-index: 0;
}
.opening_overlay_inner {
	position: relative;
	z-index: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: clamp(16px, 3vw, 34px);
	padding: 0 25px;
}
.opening_heart_wrap {
	position: relative;
	width: clamp(120px, 26vw, 200px);
	aspect-ratio: 1 / 1;
}
.opening_heart {
	width: 100%;
	height: 100%;
	animation: openingHeartBeat 1.2s ease-in-out infinite;
	transform-origin: center 58%;
}
.opening_heart_svg {
	display: block;
	width: 100%;
	height: 100%;
	overflow: visible;
}
.opening_heart_base {
	fill: #a8a8a8;
}
.opening_heart_fill {
	will-change: y, height;
	fill: #00ffff;
	animation: meHeartColor 4s linear infinite;
}
.opening_heart_outline {
	fill: none;
	stroke-width: 0.35;
	stroke-linejoin: round;
}
.opening_overlay.is_complete .opening_heart {
	animation: openingHeartBeatOnce 0.5s cubic-bezier(0.34, 1.56, 0.64, 1) forwards;
}
.opening_overlay.is_heart_out .opening_heart {
	animation: openingHeartVanish 0.36s cubic-bezier(0.5, 0, 0.75, 0.4) forwards;
}
.opening_overlay.is_heart_out .opening_overlay_heading {
	animation: opening_headingFade 0.28s ease forwards;
}
.opening_overlay_heading {
	/* JS が表示判定するまでチラつき（"0%" の一瞬表示）を防ぐ */
	visibility: hidden;
	position: absolute;
	top: 50%;
	left: 51%;
	transform: translate(-50%, -50%);
	font-family: var(--font-en);
	font-style: normal;
	font-weight: 800;
	font-size: clamp(1.25rem, 4vw, 2.4rem);
	letter-spacing: 0.04em;
	margin: 0;
	line-height: 1;
	display: inline-flex;
	align-items: baseline;
	color: #fff;
	z-index: 2;
	pointer-events: none;
}
.opening_overlay_pct {
	font-size: 0.55em;
	margin-left: 0.1em;
}

/* Animation */
@keyframes openingHeartBeat {
	0%, 100% { transform: scale(1); }
	50% { transform: scale(1.07); }
}
@keyframes openingHeartBeatOnce {
	0% { transform: scale(1); }
	42% { transform: scale(1.34); }
	100% { transform: scale(1); }
}
@keyframes openingHeartVanish {
	0% { transform: scale(1); opacity: 1; }
	18% { transform: scale(1.3); opacity: 1; }
	88% { transform: scale(0.1); opacity: 1; }
	100% { transform: scale(0); opacity: 0; }
}
@keyframes opening_headingFade {
	to { opacity: 0; }
}

@media (prefers-reduced-motion: reduce) {
	.opening_heart {
		animation: none;
	}
	.opening_overlay.is_complete .opening_heart,
	.opening_overlay.is_heart_out .opening_heart,
	.opening_overlay.is_heart_out .opening_overlay_heading {
		animation: none;
	}
}

/* ハートカーソル
-------------------------------------- */
a,
button,
label,
summary,
[role="button"],
[role="link"],
[onclick],
[tabindex],
input[type="button"],
input[type="submit"],
input[type="reset"],
.closing_heart,
.closing_for_me,
.gglobe {
	cursor:
		url("/life/index/img/cursor.svg") 3 2,
		auto!important;
}

#me_cursor {
	display: block;
	position: fixed;
	pointer-events: none;
	z-index: 10001;
	top: 0;
	left: 0;
	width: 31.25px;
	height: 31.25px;
	opacity: 0;
	transition: opacity 0.4s ease;
	will-change: transform;
}

.me_cursor_heart_svg {
	position: absolute;
	top: 20px;
	left: 20px;
	width: 31.25px;
	height: 31.25px;
	animation: meHeartPulse 1.2s ease-in-out infinite;
	transition:
		width 0.2s ease,
		height 0.2s ease;
}

#life_index.is_link_hover #me_cursor .me_cursor_heart_svg {
	width: 106.25px;
	height: 106.25px;
}

.me_cursor_heart_svg path {
	animation: meHeartColor 4s linear infinite;
	mix-blend-mode: difference;
}

#life_index.is_cursor_visible #me_cursor {
	opacity: 1;
}

.me_cursor_oshi {
	position: absolute;
	top: 60px;
	left: 60px;
	width: 112.5px;
	height: auto;
	transform: translate(-50%, -50%);
	opacity: 0;
	pointer-events: none;
	transition: opacity 0.2s ease;
	animation: meCursorOshiSpin 7s linear infinite;
}
#life_index.is_oshi_cursor .me_cursor_heart_svg path {
	animation: none;
	fill: #fff;
	mix-blend-mode: normal;
}

.me_cursor_oshi {
	transition:
		opacity 0.2s ease,
		width 0.2s ease;
}
#life_index.is_link_hover #me_cursor .me_cursor_oshi {
	width: 225px;
}

.me_cursor_spawn {
	position: fixed;
	pointer-events: none;
	z-index: 10001;
	top: 0;
	left: 0;
	width: 31.25px;
	height: 31.25px;
	opacity: 1;
	transition: opacity 0.35s ease;
	will-change: transform, opacity;
}
.me_cursor_spawn.is_fading {
	opacity: 0;
}

.me_cursor_spawn .me_cursor_heart_svg {
	top: auto;
	left: auto;
	bottom: 50%;
	right: 50%;
}
.me_cursor_spawn .me_cursor_oshi {
	top: 0;
	left: 0;
	bottom: auto;
	right: auto;
	transform: translate(-50%, -50%);
	opacity: 0;
}
.me_cursor_spawn.is_oshi .me_cursor_heart_svg path {
	animation: none;
	fill: #fff;
	mix-blend-mode: normal;
}

@media (pointer: coarse) {
	#life_index.is_link_hover #me_cursor .me_cursor_heart_svg {
		width: 31.25px;
		height: 31.25px;
	}
	#life_index.is_link_hover #me_cursor .me_cursor_oshi {
		width: 112.5px;
	}
}

/* Animation */
@keyframes meHeartColor {
	0% { fill: #00ffff; }
	25% { fill: #ff00ff; }
	50% { fill: #00ff00; }
	75% { fill: #dfff00; }
	100% { fill: #00ffff; }
}

@keyframes meHeartPulse {
	0%, 100% { transform: scale(1); }
	50% { transform: scale(1.3); }
}
@keyframes meCursorOshiSpin {
	from { transform: translate(-50%, -50%) rotate(0deg); }
	to { transform: translate(-50%, -50%) rotate(720deg); }
}

/* ヘッダー調整
-------------------------------------- */
#life_index.page_top .site_header {
	mix-blend-mode: difference;
	filter: brightness(10);
	background-color: transparent;
	border-bottom: none;
}

#life_index.page_top .nav_logo_pc,
#life_index.page_top .nav_logo_sp {
	filter: invert(1);
}

#life_index.page_top .gglobe::before {
	color: #fff;
}

#life_index.page_top .nturl {
	color: #fff !important;
}

#life_index.page_top .site_header .nav_link {
	color: #fff;
}

#life_index.page_top .site_header a[href]:hover {
	color: #fff;
	opacity: 0.6;
}

#life_index.page_top .menu_btn_sp {
	background: #fff;
	color: var(--me-text-color);
}

@media (max-width: 1024px) {
	#life_index.page_top .site_header {
		filter: none;
	}

	#life_index.page_top .header_nav.left_nav .nav_link {
		color: var(--me-text-color);
	}
}

/* メインビジュアル
-------------------------------------- */
.mv_section {
	height: 100svh;
	position: relative;
	background-color: #d9d8d4;
	overflow-x: clip;
	display: flex;
	justify-content: center;
	align-items: center;
	z-index: 10;
	pointer-events: none;
	margin-bottom: min(26.5%, 170px);
	background: url(/life/index/img/me_main.jpg) center center / cover no-repeat;
	overflow: hidden;
}

.mv_img {
	position: absolute;
	z-index: 1;
	box-shadow: 0 0 40px 0px #48484875;
}
.mv_img img {
	display: block;
	margin: auto;
	width: auto;
	height: 100svh;
	object-fit: cover;
}
.mv_video_el {
	position: relative;
	margin: auto;
	width: auto;
	height: calc(100vh + 3px);
	height: calc(100svh + 3px);
	object-fit: cover;
	opacity: 0;
	transition: opacity 0.8s ease;
	pointer-events: none;
	z-index: 2;
}

.mv_video.is_video_playing .mv_video_el {
	opacity: 1;
}

@media (max-width: 1024px) {
	.mv_section {
		overflow: clip;
		width: 100vw;
		background: url(/life/index/img/sp_me_main.jpg) center center / cover no-repeat;
	}
	.mv_img img{
		width: calc(100vw + 2px);
		margin-left: -1px;
	}
	.mv_video_el {
		width: calc(100vw + 2px);
		margin-left: -1px;
	}
}

/* リード
-------------------------------------- */

.lead_section {
	text-align: center;
}
.lead_logo {
	display: flex;
	width: min(41.6vw, 297.5px);
	margin: 0 auto min(10.4%, 72px);
	align-items: center;
	justify-content: space-between;
}
.lead_logo_wave {
	display: block;
	width: min(14.1vw, 97.5px);
}
.lead_logo_me {
	display: block;
	width: min(24.16vw, 166.25px);
}

.typography {
	font-size: min(21vw, 13.8rem);
	line-height: 1;
	white-space: nowrap;
	margin-bottom: min(22%, 150px);
	letter-spacing: 0.02em;
	height: fit-content;
	font-weight: 400;
}

.typography span {
	display: inline-block;
	vertical-align: bottom;
}

@media (max-width: 1350px) {
.typography .sp_only{
	display:block;
	}
}
.typography .typography_v {
	vertical-align: bottom;
	width: min(11.8vw, 74px);
	height: min(13.2vw, 84px);
	line-height: 1;
}
.typography .typography_v img {
	height: 100%;
	width: 100%;
	display: inline-block;
	vertical-align: top;
}
.f_big {
	font-size: 1.11em;
}

.f_serif {
	font-family: Georgia, "Times New Roman", serif;
	font-weight: 400;
}

.f_sans {
	font-family: var(--font-en);
}

.f_pixel {
	font-family: "Silkscreen", monospace;
}

.f_swirl {
	font-family: var(--font-en);
	font-weight: 800;
}

.c_blue {
	color: #0000ff;
}

.c_green {
	color: #00ff00;
}

.c_magenta {
	color: #ff00ff;
}

.c_cyan {
	color: #00ffff;
}

.catch {
	text-align: center;
	margin-bottom: 125px;
	display: flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
}
.catch_sp {
	display: inline-block;
}
.catch img {
	display: inline-block;
	height: min(6.54vw, 50px);
	width: auto;
	position: relative;
	z-index: 1;
}
.catch .hl{
	padding: 2.5px 0px 3px 4px;
}

.hl {
	padding: 2.5px 0px 1.25px;
	display: inline-block;
	position: relative;
	background: transparent !important;
	z-index: 2;
	/* iOS Safari で ::before(z-index:-1) が親文脈を抜けて文字より手前に出る挙動の対策 */
	isolation: isolate;
}

.hl::before {
	content: "";
	position: absolute;
	inset: 0;
	transform: scaleX(0);
	transform-origin: left center;

	transition: transform 1.15s cubic-bezier(0.22, 1, 0.28, 1);
	z-index: -1;
}

.hl.hl_active::before {
	transform: scaleX(1);
}

.catch .hl.hl_active .hl_char {
	animation: hlColorCycle_text 5s linear infinite;
}

.catch .hl.hl_active::before {
	animation: hlColorCycle 5s linear infinite;
}
@keyframes textJumpDaisuki {
	0%, 80% { transform: translateY(0) scale(1, 1); }
	86% { transform: translateY(-7px) scale(0.95, 1.06); }
	92% { transform: translateY(0) scale(1.06, 0.94); }
	96% { transform: translateY(0) scale(1, 1); }
	100% { transform: translateY(0) scale(1, 1); }
}
@keyframes textPulseDaisuki {
	0%, 86% { transform: scale(1) rotate(0deg); }
	91% { transform: scale(1.22) rotate(6deg); }
	95% { transform: scale(0.96) rotate(-2deg); }
	100% { transform: scale(1) rotate(0deg); }
}
@keyframes textPulseTokimeki {
	0%, 82% { transform: scale(1) rotate(0deg); }
	85% { transform: scale(1.14) rotate(-4deg); }
	88% { transform: scale(0.96) rotate(2deg); }
	91% { transform: scale(1.09) rotate(-2deg); }
	95% { transform: scale(1) rotate(0deg); }
	100% { transform: scale(1) rotate(0deg); }
}
@keyframes hlLineOvershoot {
	0%, 90% { transform: scaleX(1); }
	97% { transform: scaleX(1.04); }
	100% { transform: scaleX(1); }
}
@media (max-width: 1024px) {
	@keyframes hlLineOvershoot {
		0%, 90% { transform: scaleX(1); }
		97% { transform: scaleX(1.02); }
		100% { transform: scaleX(1); }
	}
}

@keyframes hlColorCycle {
	0% { background-color: #00ff00; }

	25% { background-color: #00ffff; }

	50% { background-color: #ff00ff; }

	75% { background-color: #dfff00; }

	100% { background-color: #00ff00; }
}

@keyframes hlColorCycle_text {
	0% { color: #000 !important; }

	20% { color: #000 !important; }

	40% { color: #fff !important; }

	60% { color: #000 !important; }

	80% { color: #000 !important; }

	100% { color: #000 !important; }
}

/* 表示Animation */
.lead_section .typography span {
	overflow: hidden;
	padding-bottom: 0.16em;
	margin-bottom: -0.16em;
}
.lead_section .typography span > .ttg_mask_inner {
	display: inline-block;
	transform: translateY(110%) rotate(6deg);
	will-change: transform;
}
.lead_section .typography .typography_v {
	padding-bottom: 0;
	margin-bottom: 0;
	transform: translateY(8%);
}
.lead_section .typography .typography_v > .ttg_mask_inner {
	display: block;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
}
.lead_section .typography span:nth-of-type(even) > .ttg_mask_inner {
	--ttg-tilt: -6deg;
	transform: translateY(110%) rotate(-6deg);
}
.lead_section.is_revealed .typography span > .ttg_mask_inner {
	animation: leadLetterMaskUp 0.62s cubic-bezier(0.7, 0, 0.2, 1) forwards;
}
.lead_section.is_revealed .typography span:nth-of-type(1) > .ttg_mask_inner {
	animation-delay: 0s;
}
.lead_section.is_revealed .typography span:nth-of-type(2) > .ttg_mask_inner {
	animation-delay: 0.05s;
}
.lead_section.is_revealed .typography span:nth-of-type(3) > .ttg_mask_inner {
	animation-delay: 0.1s;
}
.lead_section.is_revealed .typography span:nth-of-type(4) > .ttg_mask_inner {
	animation-delay: 0.15s;
}
.lead_section.is_revealed .typography span:nth-of-type(5) > .ttg_mask_inner {
	animation-delay: 0.2s;
}
.lead_section.is_revealed .typography span:nth-of-type(6) > .ttg_mask_inner {
	animation-delay: 0.25s;
}
.lead_section.is_revealed .typography span:nth-of-type(7) > .ttg_mask_inner {
	animation-delay: 0.3s;
}
.lead_section.is_revealed .typography span:nth-of-type(8) > .ttg_mask_inner {
	animation-delay: 0.35s;
}
.lead_section.is_revealed .typography span:nth-of-type(9) > .ttg_mask_inner {
	animation-delay: 0.4s;
}
.lead_section.is_revealed .typography span:nth-of-type(10) > .ttg_mask_inner {
	animation-delay: 0.45s;
}
.lead_section.is_revealed .typography span:nth-of-type(11) > .ttg_mask_inner {
	animation-delay: 0.5s;
}
.lead_section.is_revealed .typography span:nth-of-type(12) > .ttg_mask_inner {
	animation-delay: 0.55s;
}

.lead_section .lead_logo,
.lead_section .catch {
	opacity: 0;
	transform: translateY(40px);
	will-change: opacity, transform;
}
.lead_section .lead_logo.is_revealed {
	animation: leadFadeUp 0.7s cubic-bezier(0.22, 0.61, 0.36, 1) forwards;
}
.lead_section .catch.is_revealed {
	animation: leadFadeUp 0.7s cubic-bezier(0.22, 0.61, 0.36, 1) 0.2s forwards;
}
@keyframes leadFadeUp {
	0% { opacity: 0; transform: translateY(40px); }
	100% { opacity: 1; transform: translateY(0); }
}

/* 汎用 reveal：.js_reveal が表示領域に入ったら発火 */
.js_reveal {
	opacity: 0;
	transform: translateY(22.5px);
	will-change: opacity, transform;
	transition:
		opacity 0.8s cubic-bezier(0.22, 0.9, 0.3, 1),
		transform 0.8s cubic-bezier(0.22, 0.9, 0.3, 1);
}
.js_reveal.is_revealed {
	opacity: 1;
	transform: none;
}

@keyframes leadFadeUp {
	0% { opacity: 0; transform: translateY(22.5px) scale(0.94); }
	60% { opacity: 1; transform: translateY(-3.75px) scale(1.02); }
	100% { opacity: 1; transform: translateY(0) scale(1); }
}
@keyframes leadLetterMaskUp {
	0%   { transform: translateY(110%) rotate(var(--ttg-tilt, 6deg)); }
	60%  { transform: translateY(-4%) rotate(calc(var(--ttg-tilt, 6deg) * -0.25)); }
	100% { transform: translateY(0) rotate(0); }
}

@keyframes closingForDrop {
	0% { opacity: 0; transform: translateY(-40px) rotate(-3deg); }
	60% { opacity: 1; transform: translateY(7.5px) rotate(2deg); }
	80% { transform: translateY(-2.5px) rotate(-1deg); }
	100% { opacity: 1; transform: translateY(0) rotate(0deg); }
}

@keyframes closingMeStamp {
	0% { opacity: 0; transform: scale(0.3) rotate(-18deg); }
	55% { opacity: 1; transform: scale(1.5) rotate(5deg); }
	75% { transform: scale(0.95) rotate(-2deg); }
	100% { opacity: 1; transform: scale(1) rotate(0deg); }
}

@media (max-width: 1024px) {
	.catch {
		display: block;
	}
	.catch_sp {
		display: flex;
		align-items: center;
		justify-content: center;

		margin-bottom: 1.9%;
	}
	.hl img {
		display: inline;
	}
	.catch_minimatou {
		display: block;
		margin: 10px auto 0;
	}

	.typography {
		white-space: normal;
		font-size: clamp(2rem, 21.4vw, 12rem);
		text-align: center;
	}

	.catch {
		margin-bottom: 40px;
	}
}

/*  ラインナップ
-------------------------------------- */
.dc_lineup {
	position: relative;
	width: 100%;
	max-width: 1022.5px;
	margin: 0 auto;
}

.lineup_area {
	position: relative;
	width: min(100%, 1022.5px);
	margin: 0 auto 0;
	padding: 0 50px min(20%, 375px);
	box-sizing: border-box;
}

.lineup_image {
	width: 182%;
	margin-left: -83.5%;
	margin-top: 24%;
}
.lineup_image img {
	display: block;
	width: 100%;
	height: auto;
	margin-top: -107.5px;
	position: relative;
}
.lineup_image img:nth-of-type(1) {
	margin-left: -30.2%;
	z-index: 6;
}
.lineup_image img:nth-of-type(2) {
	margin-left: -24.1%;
	z-index: 5;
	margin-top: -111.25px;
}
.lineup_image img:nth-of-type(3) {
	margin-left: -17%;
	z-index: 4;
	margin-top: -116.25px;
}
.lineup_image img:nth-of-type(4) {
	margin-left: -11%;
	z-index: 3;
	margin-top: -108.75px;
}
.lineup_image img:nth-of-type(5) {
	margin-left: -5.2%;
	z-index: 2;
	margin-top: -108.75px;
}
.lineup_image img:nth-of-type(6) {
	z-index: 1;
	margin-top: -108.75px;
	margin-left: 0.8%;
}

.feature_badge {
	position: absolute;
	top: 15%;
	right: -7.18%;
	width: 30vw;
	height: 30vw;
	margin-top: -19.2%;
	max-width: 400px;
	max-height: 400px;
	z-index: 20;
	pointer-events: none;
	display: grid;
	place-items: center;
}
.feature_badge > img {
	display: block;
	width: 100%;
	height: 100%;
	animation: wmFeatureRotate 18s linear infinite;
}
@keyframes wmFeatureRotate {
	to { transform: rotate(360deg); }
}
.feature_badge .feature_badge_star {
	width: 100%;
	height: 100%;
	object-fit: contain;
	mix-blend-mode: multiply;
	position: absolute;
}
.feature_badge_label {
	width: 30%;
}

.dc_havefun {
	width: min(32.5vw, 331.25px);
	top: 53%;
	right: -28%;
	transform-origin: 50% 50%;
}
.dc_havefun img {
	display: block;
	width: 100%;
	transform-origin: 50% 50%;
	animation: kzDokidoki 1.6s ease-in-out infinite;
}
@keyframes kzDokidoki {
	0%   { transform: scale(1); }
	8%   { transform: scale(1.12); }
	16%  { transform: scale(0.98); }
	24%  { transform: scale(1); }
	32%  { transform: scale(1.12); }
	40%  { transform: scale(0.98); }
	48%  { transform: scale(1); }
	100% { transform: scale(1); }
}
.dc_first_sticker {
	width: min(44vw, 343.75px);
	height: min(28.8vw, 242.5px);
	right: -8.5%;
	margin-top: -32%;
}
.dc_first_sticker_item {
	position: absolute;
	opacity: 0;
	transform: rotate(var(--sticker-rot, 0deg)) scale(0.5);
	transform-origin: center center;
}
.dc_first_sticker.is_slammed .dc_first_sticker_item_1 {
	animation:
		stickerSlam 0.8s linear 0s forwards,
		stickerFade 0.12s linear 0s forwards,
		stickerPulse 3s ease-in-out 2.8s infinite;
}
.dc_first_sticker.is_slammed .dc_first_sticker_item_2 {
	animation:
		stickerSlam 0.8s linear 0.3s forwards,
		stickerFade 0.12s linear 0.3s forwards,
		stickerPulse 3s ease-in-out 3.4s infinite;
}
.dc_first_sticker.is_slammed .dc_first_sticker_item_3 {
	animation:
		stickerSlam 0.8s linear 0.6s forwards,
		stickerFade 0.12s linear 0.6s forwards,
		stickerPulse 3s ease-in-out 2.3s infinite;
}
@keyframes stickerSlam {
	0% { transform: rotate(var(--sticker-rot, 0deg)) scale(0.5); }
	20% { transform: rotate(var(--sticker-rot, 0deg)) scale(1.63); }
	35% { transform: rotate(var(--sticker-rot, 0deg)) scale(0.955); }
	50% { transform: rotate(var(--sticker-rot, 0deg)) scale(1.03); }
	65% { transform: rotate(var(--sticker-rot, 0deg)) scale(0.99); }
	80% { transform: rotate(var(--sticker-rot, 0deg)) scale(1.005); }
	100% { transform: rotate(var(--sticker-rot, 0deg)) scale(1); }
}
@keyframes stickerFade {
	0% { opacity: 0; }
	100% { opacity: 1; }
}
@keyframes stickerPulse {
	0% { transform: rotate(var(--sticker-rot, 0deg)) scale(1); }
	7% { transform: rotate(var(--sticker-rot, 0deg)) scale(1.22); }
	14% { transform: rotate(var(--sticker-rot, 0deg)) scale(0.96); }
	22% { transform: rotate(var(--sticker-rot, 0deg)) scale(1); }
	100% { transform: rotate(var(--sticker-rot, 0deg)) scale(1); }
}

.dc_first_sticker_item_1 {
	width: min(26.5vw, 208.75px);
	--sticker-rot: -15deg;
	top: 7%;
	left: 0;
}
.dc_first_sticker_item_2 {
	width: min(27.5vw, 215px);
	--sticker-rot: 0deg;
	top: 27.3%;
	left: 21%;
}
.dc_first_sticker_item_3 {
	width: min(28.1vw, 216.25px);
	--sticker-rot: 15deg;
	right: 0;
	bottom: 7%;
}

.dc_minna {
	width: min(37.8vw, 322px);
	height: min(45.6vw, 390px);
	margin-top: -68.2%;
	left: -5.5%;
}
.dc_minna_area {
	width: 100%;
	height: 100%;
	position: relative;
	z-index: 2;
	perspective: 1000px;
}
.dc_minna_area_bg {
	position: absolute;
	width: 100%;
	height: 100%;
	top: 0;
	margin-left: -3.88%;
	margin-top: 3.5%;
	z-index: 1;
	perspective: 1000px;
}
.dc_minna_area img,
.dc_minna_area_bg img {
	display: block;
	position: absolute;
	width: min(23.3vw, 202.5px);
	transform-origin: 50% 100%;
}
/* 1番目: 左右にゆらゆら踊る（スウェイ） */
.dc_minna_area img:nth-of-type(1),
.dc_minna_area_bg img:nth-of-type(1) {
	bottom: 0;
	left: 0;
	animation: minnaSway 2.6s ease-in-out infinite;
}
/* 2番目: しゃがみジャンプ */
.dc_minna_area img:nth-of-type(2),
.dc_minna_area_bg img:nth-of-type(2) {
	top: 0;
	left:0;
	right: 0;
	bottom: 0;
	margin: auto;
	animation: minnaRelayJump 3s ease-in-out infinite;
}
/* 3番目: ターン（縦軸ぐるり、右端から30%を軸に1回転） */
.dc_minna_area img:nth-of-type(3),
.dc_minna_area_bg img:nth-of-type(3) {
	top: 0;
	right: 0;
	transform-origin: 70% 50%;
	animation: minnaTurn 3.6s ease-in-out infinite;
}
@keyframes minnaRelayJump {
	0%        { transform: translateY(0) scaleY(1); }
	5%        { transform: translateY(0) scaleY(0.9); }
	15%       { transform: translateY(-28px) scaleY(1.06); }
	25%       { transform: translateY(0) scaleY(0.92); }
	30%, 100% { transform: translateY(0) scaleY(1); }
}
@keyframes minnaSway {
	0%, 100% { transform: rotate(0deg); }
	25%      { transform: rotate(-7deg); }
	75%      { transform: rotate(7deg); }
}
/* dc_people_4 と同じ「静止 → なめらかな半周 → なめらかな半周 → 静止」 */
@keyframes minnaTurn {
	0%, 25%   { transform: rotateY(0deg); }
	50%       { transform: rotateY(180deg); }
	75%, 100% { transform: rotateY(360deg); }
}
.dc_minna_text {
	position: absolute;
	width: min(20.7vw, 180px);
	margin-left: -13%;
	margin-top: -10%;
	left: 0;
	top: 0;
	opacity: 0;
	transform: translateY(-50px) rotate(15deg) scale(0.7);
	transform-origin: center center;
	will-change: transform, opacity;
}

.dc_minna_text img {
	display: block;
}
.dc_minna_text.is_revealed {
	animation:
		minnaIn 1s cubic-bezier(0.34, 1.56, 0.64, 1) 0.45s forwards,
		minnaWobble 3.2s ease-in-out 1.5s infinite;
}

@keyframes minnaIn {
	0% { opacity: 0; transform: translateY(-50px) rotate(15deg) scale(0.7); }
	60% { opacity: 1; transform: translateY(12.5px) rotate(-8deg) scale(1.08); }
	80% { opacity: 1; transform: translateY(-5px) rotate(4deg) scale(0.97); }
	100% { opacity: 1; transform: translateY(0) rotate(0deg) scale(1); }
}
@keyframes minnaWobble {
	0%, 100% { transform: translateY(0) rotate(0deg); }
	25% { transform: translateY(-10px) rotate(4deg); }
	50% { transform: translateY(0) rotate(0deg); }
	75% { transform: translateY(-5px) rotate(-4deg); }
}

.me_tilt_wrap {
	position: relative;
	height: calc(var(--app-vh, 100vh) * 2.6 + 257.5px);
}
.lineup_section {
	position: relative;
    overflow-x: clip;
    background-color: #fff;
}
.tilt_sticky {
	position: sticky;
	/* top は JS で整数 px に設定（calc + var の再計算ジッタ回避） */
	top: 0;
	width: 37.5px;
	height: 157.5px;
	margin: 50px auto;
	/* 独立した合成レイヤを確保し iOS Safari の sticky 揺れを抑制 */
	transform: translateZ(0);
	-webkit-transform: translateZ(0);
	will-change: transform;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
}
.tilt_block {
	display: block;
	width: 37.5px;
	height: 145.25px;
	position: relative;
	transform-origin: center center;
	will-change: transform;
	overflow: visible;
}
.tilt_block_circle {
	position: absolute;
	top: 50%;
	left: 50%;
	width: min(20.8vw, 160px);
	height: min(20.8vw, 160px);
	transform: translate(-50%, -50%);
	transform-origin: center center;
	pointer-events: none;
	overflow: visible;
	display: block;
	will-change: width, height;
}
.tilt_block_oshi {
	position: absolute;
	top: 50%;
	left: 50%;
	width: min(20.8vw, 160px);
	height: min(20.8vw, 160px);
	transform: translate(-50%, -50%);
	transform-origin: center center;
	pointer-events: none;
	overflow: visible;
	display: flex;
	align-items: center;
	justify-content: center;
	will-change: width, height;
	z-index: 1;
}
.tilt_block_oshi_svg {
	display: block;
	width: 48%;
	height: auto;
	overflow: visible;
	animation: osuRecordSpin 6s linear infinite;
	transform-origin: center center;
}

.lineup_area {
	visibility: hidden;
}

.tilt_block_content {
	position: absolute;
	top: 50%;
	left: 50%;
	width: min(87.08vw, 1022.5px);
	transform: translate(-50%, -50%);
	transform-origin: center center;
	opacity: 0;
	pointer-events: none;
	z-index: 1;
}
.tilt_block_content .lineup_area {
	visibility: visible;
	position: relative;
	margin: 0;
	padding: 0;
}
.tilt_block_content .lineup_image img {
	opacity: 0;
	transform: translateX(-160%);
}
@media (max-width: 1024px) {

	.lineup_area {
		padding-bottom: min(54.8%, 350px);
	}

	.lineup_image {
		width: 194%;
		max-width: initial;
		margin-left: -92.5%;
		margin-top: 0;
	}
	.lineup_image img {
		display: block;
		width: 100%;
		height: auto;
		margin-top: -86px;
		position: relative;
	}
	.lineup_image img:nth-of-type(1) {
		margin-left: -24%;
		z-index: 6;
	}
	.lineup_image img:nth-of-type(2) {
		margin-left: -19.5%;
		z-index: 5;
		margin-top: -6.5%;
	}
	.lineup_image img:nth-of-type(3) {
		margin-left: -14.5%;
		z-index: 4;
		margin-top: -6%;
	}
	.lineup_image img:nth-of-type(4) {
		margin-left: -9.5%;
		z-index: 3;
		margin-top: -6.5%;
	}
	.lineup_image img:nth-of-type(5) {
		margin-left: -4.8%;
		z-index: 2;
		margin-top: -5.8%;
	}
	.lineup_image img:nth-of-type(6) {
		z-index: 1;
		margin-top: -5%;
	}

	.feature_badge {
		top: 8%;
		right: 8%;
	}

	.dc_havefun {
		top: initial;
		margin-top: 10%;
		right: 3%;
	}

	.dc_first_sticker {
		right: -2%;
		margin-top: -34%;
	}

	.dc_minna {
		margin-top: -83.2%;
		left: 8%;
	}

}

/* ストラップバッグセクション
-------------------------------------- */
.strapbag_section {
    position: relative;
    overflow-x: clip;
    background-color: #fff;
}

/* タイトル */
.strap_title_area {
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	margin-bottom: min(30%, 112.5px);
	position: relative;
	transform: rotate(5deg);
}
.strap_title_area .strap_title {
	margin: 0;
}
.strap_title {
	width: 100vw;
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	margin-bottom: min(8%, 75px);
	overflow-x: clip;
	position: relative;
	z-index: 5;
}
.strap_title_track {
	display: flex;
	align-items: center;
	gap: min(10vw, 93.75px);
	width: max-content;
	padding-left: min(10vw, 93.75px);
	will-change: transform;
}
.strap_title_tile {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
	gap: min(1.5vw, 15px);
	width: min(77.8vw, 657.5px);
	flex-shrink: 0;
}
.strap_title_tile img {
	width: 100%;
	height: auto;
	display: block;
	pointer-events: none;
	user-select: none;
}
.strap_title_tile .strap_subtitle {
	width: 45%;
	margin-left: 4%;
	clip-path: inset(0 100% 0 0);
	-webkit-clip-path: inset(0 100% 0 0);
	will-change: clip-path;
}


/* イメージエリア */
.img_section {
	display: block;
	position: relative;
	margin: 0 auto;
	width: 100%;
	max-width: 1022.5px;
}

.img_section_bg {
	position: absolute;
	width: min(20%, 187.5px);
	aspect-ratio: 1 / 1;
	z-index: 0;
	pointer-events: none;
	transform: rotate(15deg);
}
.img_section_bg_inner {
	width: 100%;
	height: 100%;
	will-change: transform;
}
.img_section_bg_01 {
	top: 30%;
	left: -10%;
}
.img_section_bg_01 .img_section_bg_inner {
	background: #07fdfc;
	background: url(/life/index/img/strapbag_img_01_02.jpg) center/cover;
	border-radius: 50%;
}
.img_section_bg_02 {
	top: 53%;
	left: 105%;
}
.img_section_bg_02 .img_section_bg_inner {
	background: #ff00ff;
	background: url(/life/index/img/strapbag_img_01_02.jpg) center/cover;
}

.img_card {
	position: relative;
	perspective: 1750px;
}

.img_card_01 {
	width: min(85vw,680px);
	margin-left: 0;
	z-index: 3;
}

.img_card_02 {
	width: min(70.8vw, 570px);
	height: min(70.8vw, 570px);
	margin-right: 0;
	margin-left: auto;
	margin-top: min(3.5%, 27.5px);
	border-radius: 50%;
	z-index: 2;
}

.img_card_movie {
	width: min(60.4vw, 486px);
	height: min(90.6vw, 730px);
	margin-right: auto;
	margin-left: 8.92%;
	margin-top: -5px;
	z-index: 1;
	overflow: hidden;
}

.img_card_movie .img_card_frame {
	height: 100%;
}
.img_card_movie video {
	display: block;
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.img_card_movie_pop {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 7%;
	margin: auto;
	width: 80%;
	z-index: 2;
}

.img_card_03 {
	width: 62.24%;
	max-width: 512.5px;
	margin-left: 4.76%;
	margin-top: 0;
	z-index: 6;
}

.img_card_04 {
	width: 75.5%;
	max-width: 632.5px;
	margin-left: auto;
	margin-top: -7%;
	margin-right: 0;
	z-index: 5;
}

.img_card .img_card_frame > img {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	display: block;
	object-fit: cover;
	transform-origin: center center;
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	transform: rotateY(180deg);
}

.img_card .img_card_frame > img:first-of-type {
	position: relative;
	height: auto;
}

.img_card_02 .img_card_frame > img:first-of-type {
	position: absolute;
	height: 100%;
}

.img_card .img_card_frame > img.is_front {
	transform: rotateY(0deg);
}

.img_card_frame {
	position: relative;
	width: 100%;
	overflow: hidden;
}
.img_card_02 .img_card_frame {
	height: 100%;
	border-radius: 50%;
}

.img_card_pop {
	position: absolute;
	top: 0;
	left: 0;
	width: min(29.1vw, 235px);
	height: min(29.1vw, 235px);
	background: url(/life/index/img/dc_togetoge_img.png) center no-repeat;
	background-size: contain;
	z-index: 4;
	display: grid;
	place-items: center;
}
.img_card_pop img {
	display: block;
	width: 63.8%;
}

.img_card_bg {
	position: absolute;
	inset: 0;
	pointer-events: none;
	width: 100%;
	height: 100%;
}
.img_card > .img_card_bg {
	transform-origin: center center;
	will-change: transform;
}
.img_card_01 > .img_card_bg {
	background: #ff0000;
	--bg-rot: 15deg;
}
.img_card_02 > .img_card_bg {
	background: #ffff00;
	border-radius: 50%;
	margin-left: min(-10.3%, 50px);
	margin-top: min(7.35%, 35px);
	--bg-rot: 0deg;
}
.img_card_03 > .img_card_bg {
	background: #ff00fe;
	--bg-rot: -10deg;
}
.img_card_04 > .img_card_bg {
	background: #07fdfc;
	--bg-rot: 10deg;
}

.img_card .cover_slide {
	display: none;
}
.img_card_01 .cover_slide { background: #00ffff; }
.img_card_02 .cover_slide { background: #00ff00; }
.img_card_movie .cover_slide { background: #000; }
.img_card_03 .cover_slide { background: #dfff00; }
.img_card_04 .cover_slide { background: #ff00fe; }

.img_card .img_card_frame > .img_card_frame_img2,
.dc_img .img_card_px > .img_card_frame_img2 {
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	object-fit: cover;
	display: block;
	transform: none;
	backface-visibility: visible;
	-webkit-backface-visibility: visible;
	pointer-events: none;
	z-index: 2;

	clip-path: polygon(0 0, 0 0, 0 0, 0 0);
}
.dc_img .img_card_px > .img_card_frame_img2 {
	margin-top: 0%;
}

.tokimeki_img {
	width: 38%;
	max-width: 450px;
	position: absolute;
	z-index: 10;
	right: -34%;
	top: 13%;
	opacity: 0;
	transform: scale(0.3) rotate(-30deg);
	transform-origin: center center;
	will-change: transform, opacity;
}
.tokimeki_img img {
	display: block;
	width: 100%;
	height: auto;
}
.img_card.is_revealed .tokimeki_img {
	animation:
		tokimekiHeartIn 0.9s cubic-bezier(0.34, 1.56, 0.64, 1) 0.15s forwards,
		tokimekiHeartBeat 1.6s ease-in-out 1.1s infinite;
}
@keyframes tokimekiHeartIn {
	0% { opacity: 0; transform: scale(0.3) rotate(-30deg); }
	60% { opacity: 1; transform: scale(1.18) rotate(10deg); }
	80% { opacity: 1; transform: scale(0.94) rotate(-5deg); }
	100% { opacity: 1; transform: scale(1) rotate(0deg); }
}

@keyframes tokimekiHeartBeat {
	0%, 100% { transform: scale(1) rotate(0deg); }
	12% { transform: scale(1.14) rotate(-4deg); }
	24% { transform: scale(0.96) rotate(2deg); }
	36% { transform: scale(1.09) rotate(-2deg); }
	48% { transform: scale(1) rotate(0deg); }
}

.itudatte_text {
	width: 187.5px;
	position: absolute;
	z-index: 2;
	right: -28%;
	top: -24%;
	opacity: 0;
	transform: translateY(-50px) rotate(-15deg) scale(0.7);
	transform-origin: center center;
	will-change: transform, opacity;
}
.img_card.is_revealed .itudatte_text {
	animation:
		itudatteIn 1s cubic-bezier(0.34, 1.56, 0.64, 1) 0.45s forwards,
		itudatteWobble 3.2s ease-in-out 1.5s infinite;
}
@keyframes itudatteIn {
	0% { opacity: 0; transform: translateY(-50px) rotate(-15deg) scale(0.7); }
	60% { opacity: 1; transform: translateY(12.5px) rotate(8deg) scale(1.08); }
	80% { opacity: 1; transform: translateY(-5px) rotate(-4deg) scale(0.97); }
	100% { opacity: 1; transform: translateY(0) rotate(0deg) scale(1); }
}
@keyframes itudatteWobble {
	0%, 100% { transform: translateY(0) rotate(0deg); }
	25% { transform: translateY(-10px) rotate(-4deg); }
	50% { transform: translateY(0) rotate(0deg); }
	75% { transform: translateY(-5px) rotate(4deg); }
}

.tokimeki_text {
	width: min(3.85vw, 33.75px);
	position: absolute;
	z-index: 2;
	right: -59%;
	top: -18%;
	opacity: 0;
	transform: scale(0.2) rotate(-180deg);
	transform-origin: center center;
	will-change: transform, opacity;
}
.img_card.is_revealed .tokimeki_text {
	animation:
		tokimekiTextIn 0.9s cubic-bezier(0.34, 1.56, 0.64, 1) 0.75s forwards,
		tokimekiTextSparkle 2.4s ease-in-out 1.7s infinite;
}
@keyframes tokimekiTextIn {
	0% { opacity: 0; transform: scale(0.2) rotate(-180deg); }
	60% { opacity: 1; transform: scale(1.3) rotate(20deg); }
	80% { opacity: 1; transform: scale(0.9) rotate(-8deg); }
	100% { opacity: 1; transform: scale(1) rotate(0deg); }
}
@keyframes tokimekiTextSparkle {
	0%, 100% { transform: scale(1) rotate(0deg); }
	20% { transform: scale(1.2) rotate(10deg); }
	40% { transform: scale(0.92) rotate(-6deg); }
	60% { transform: scale(1.12) rotate(5deg); }
	80% { transform: scale(0.98) rotate(-2deg); }
}

/* テキストエリア */
.text_section {
	display: block;
	position: relative;
	margin: -8% auto min(63.64%, 452.5px);
	padding: max(240px,10%) 0 max(80px,3%);
	width: 100%;
}

.blue_wave_bg_textarea {
	--bg-clip-progress: 0;
	clip-path: inset(-30% -187.5px -30% calc(150% - var(--bg-clip-progress) * 180%));
	-webkit-clip-path: inset(-30% -187.5px -30% calc(150% - var(--bg-clip-progress) * 180%));
	transform: translate(-50%, -50%) rotate(-15deg) translateZ(0);
	-webkit-transform: translate(-50%, -50%) rotate(-15deg) translateZ(0);
	backface-visibility: hidden;
	-webkit-backface-visibility: hidden;
	will-change: clip-path, transform;
}

.text_section_area {
	position: relative;
	z-index: 3;
	margin: 0 auto;
	padding-left: 4.92%;
	width: min(100%, 1022.5px);
}

.text_section_body p {
	font-size: clamp(1.0625rem, 4.16vw, 2.8rem);
	line-height: 1.1;
	width: fit-content;
	margin-bottom: min(6.75vw, 56px);
	font-weight: 400;
	letter-spacing: 0;
	color: var(--me-text-color);
	background: #fff;

	clip-path: inset(0 100% 0 0);
	-webkit-clip-path: inset(0 100% 0 0);
}
.text_section_body p:last-of-type {
	margin-bottom: 0;
}
.text_section_body p.white_text_sp_only .white_text_sp_only_item {
	background: initial;
}

.text_pulse_daisuki {
	display: inline-block;
	transform-origin: center bottom;
	will-change: transform;
	animation: textJumpDaisuki 5s ease-in-out 2s infinite;
}
.text_jump_a { animation-delay: 2s; }
.text_jump_b { animation-delay: 2.13s; }
.text_jump_c { animation-delay: 2.26s; }

.text_pulse_daisuki--b {
	transform-origin: center center;
	animation: textPulseDaisuki 4.8s ease-in-out 3.2s infinite;
}

.hl_tokimeki .hl_char:nth-child(-n+4) {
	transform-origin: center center;
	will-change: transform;
	animation: textPulseTokimeki 4.2s ease-in-out 0.6s infinite;
}


.hl_bounce.hl_active::before {
	animation: hlLineOvershoot 4.5s ease-in-out 1.2s infinite;
}
.hl .hl_char {
	opacity: 0;
	display: inline-block;
	position: relative;
	z-index: 1;
}

.hl .hl_overlay {
	position: absolute;
	inset: 0;
	z-index: -1;
	transform: scaleX(0);
	transform-origin: left center;
	transition: transform 1.15s cubic-bezier(0.22, 1, 0.28, 1);
	pointer-events: none;
}

.hl_green::before {
	background-color: #00ff00;
}

.hl_green {
	color: var(--me-text-color);
}

.hl_cyan::before {
	background-color: #00ffff;
}

.hl_cyan {
	color: var(--me-text-color);
}

.hl_magenta::before {
	background-color: #ff00ff;
}

.hl_magenta {
	color: var(--me-text-color);
}

.hl_yellow::before {
	background-color: #dfff00;
}

.hl_yellow {
	color: var(--me-text-color);
}

.dc_oshi {
	width: min(20.8vw, 160px);
	height: min(20.8vw, 160px);
	top: -31.3%;
	right: 18.3%;
	animation: osuRecordSpin 6s linear infinite;
}
@keyframes osuRecordSpin {
	from { transform: rotate(0deg); }
	to { transform: rotate(360deg); }
}

.dc_strapbag {
	position: relative;
	width: 100%;
	padding-bottom: min(94.1vw, 850px);
	pointer-events: none;
	z-index: 10;
}

/* 装飾エリア */
.dc_strapbag img {
	display: block;
	width: 100%;
	height: auto;
}

.dc_strapbag_star {
	position: absolute;
	top: 0;
	left: 36%;
	margin-top: -3%;
	width: min(28.64vw, 275px);
	z-index: 3;
	will-change: transform;
}
.dc_strapbag_text {
	position: absolute;
	margin-top: min(9.16%, 97.5px);
	left: 4.8%;
	width: min(44.3vw, 492.5px);
	z-index: 4;
}
.dc_second_sticker {
	position: absolute;
	left: 0;
	margin-top: min(36.9%, 325px);
	width: min(52.8vw, 462.5px);
	height: min(29.9vw, 250px);
	z-index: 5;
}
.dc_strapbag_me {
	position: absolute;
	width: 70%;

	opacity: 0;
	transform: rotate(var(--sticker-rot, 0deg)) scale(0.5);
	transform-origin: center center;
}

.dc_second_sticker.is_slammed .dc_strapbag_me_1 {
	animation:
		stickerSlam 0.8s linear 0s forwards,
		stickerFade 0.12s linear 0s forwards,
		stickerPulse 4.5s ease-in-out 2.8s infinite;
}
.dc_second_sticker.is_slammed .dc_strapbag_me_2 {
	animation:
		stickerSlam 0.8s linear 0.3s forwards,
		stickerFade 0.12s linear 0.3s forwards,
		stickerPulse 4s ease-in-out 3.4s infinite;
}
.dc_second_sticker.is_slammed .dc_strapbag_me_3 {
	animation:
		stickerSlam 0.8s linear 0.6s forwards,
		stickerFade 0.12s linear 0.6s forwards,
		stickerPulse 5.2s ease-in-out 2.3s infinite;
}
/* SP では dc_second_sticker の連打テンポが速く感じるため、stagger 間隔を広げる */
@media (max-width: 1024px) {
	.dc_second_sticker.is_slammed .dc_strapbag_me_2 {
		animation:
			stickerSlam 0.8s linear 0.4s forwards,
			stickerFade 0.12s linear 0.4s forwards,
			stickerPulse 4s ease-in-out 3.5s infinite;
	}
	.dc_second_sticker.is_slammed .dc_strapbag_me_3 {
		animation:
			stickerSlam 0.8s linear 0.8s forwards,
			stickerFade 0.12s linear 0.8s forwards,
			stickerPulse 5.2s ease-in-out 2.5s infinite;
	}
}
.dc_strapbag .dc_strapbag_me_1 {
	top: 2%;
	left: 0.5%;
	width: min(25vw, 222.5px);
	--sticker-rot: 4.9deg;
}
.dc_strapbag .dc_strapbag_me_2 {
	top: 17%;
	left: 1%;
	width: min(46.8vw, 403.75px);
	--sticker-rot: -18deg;
}
.dc_strapbag .dc_strapbag_me_3 {
	right: -2.5%;
	bottom: 21%;
	width: min(26vw, 227.5px);
	--sticker-rot: -38.8deg;
}
.dc_strapbag_jump {
	position: absolute;
	top: 0;
	right: 9%;
	margin-top: min(18%, 212.5px);
	width: min(44.2vw, 362.5px);
	z-index: 6;
}
.dc_strapbag_jump_img {
	width: 100%;
}
.dc_strapbag_jump_img_color {
	position: absolute;
	top: 0;
	left: 0;
}
.dc_strapbag_wow_wrap {
	position: absolute;
	right: -27%;
	top: 7%;
	width: 105px;
	height: 401.25px;
	z-index: 7;
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.dc_strapbag_wow_wrap .dc_strapbag_wow_img {
	position: absolute;
	width: 46.25px;
	height: fit-content;
}
.dc_strapbag_wow_wrap img:first-of-type {
	bottom: 0;
}
.dc_strapbag_wow_wrap img:last-of-type {
	top: 0;
	right: 0;
}
.dc_strapbag_jump .dc_strapbag_jump_img_color {
	position: relative;
	z-index: 3;
}
.dc_strapbag_jump .dc_strapbag_jump_img_mono_1 {
	margin-top: 7%;
	top: 0;
	left: -7%;
	position: absolute;
	z-index: 2;
}
.dc_strapbag_jump .dc_strapbag_jump_img_mono_2 {
	margin-top: 14%;
	top: 0;
	left: -14%;
	position: absolute;
	z-index: 1;
}

.dc_img {
	position: absolute;
}
.dc_img_1 {
	width: 328.75px;
	height: 328.75px;
	top: 15%;
	right: -46.36%;
	z-index: 5;
}
.dc_img_1 .img_card_bg {
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 1;
	background: #000;
	border-radius: 50%;
	margin-left: -33.75px;
	margin-top: 25px;
}
.dc_img_1 img {
	position: relative;
	z-index: 2;
}
.dc_img_2 {
	width: 390px;
	height: 390px;
	top: 44.81%;
	left: -48.36%;
	z-index: 5;
}
.dc_img_2 .img_card_bg {
	width: 100%;
	height: 100%;
	position: absolute;
	z-index: 1;
	background: #02fe02;
	border-radius: 50%;
	margin-left: -33.75px;
	margin-top: 25px;
}
.img_card_px {
	overflow: hidden;
	border-radius: 50%;
	width: 100%;
	height: 100%;
}
.dc_img_2 img {
	position: relative;
	z-index: 2;
}
.dc_people_1 {
	width: 105px;
	height: 307.5px;
	top: -28.81%;
	right: -21.8%;
	z-index: 5;
}
.dc_jump {
	width: 147.5px;
	height: 55px;
	top: -18.27%;
	right: -35.74%;
	z-index: 5;
}
.dc_jump img {
	width: 80%;
	display: block;
}
.dc_jump img:last-of-type {
	right: 0;
	position: absolute;
	margin-top: -3.75px;
}
.dc_people_2 {
	width: 133px;
	height: 255px;
	top: -14.13%;
	right: -32.8%;
	z-index: 5;
}
.dc_people_3 {
	width: 104px;
	height: 236.25px;
	top: -4.94%;
	right: -19.8%;
	z-index: 5;
}
.dc_people_4 {
	width: 123px;
	height: 250px;
	top: 40%;
	left: -25.92%;
	z-index: 5;
}
.dc_people_4_back {
	width: 123px;
	height: 250px;
	top: 40%;
	left: -25.92%;
	margin-top: 7.5px;
	margin-left: 6.25px;
	z-index: 1;
}
.dc_people_5 {
	width: 108px;
	height: 295px;
	top: 50%;
	left: -38.67%;
	z-index: 5;
}

.dc_people {
	opacity: 0;
}
.dc_people.is_popped {
	opacity: 1;
}

.dc_people_1.is_popped,
.dc_people_2.is_popped,
.dc_people_3.is_popped,
.dc_people_5.is_popped {
	animation: dcPeoplePop 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}

.dc_people_4.is_popped img,
.dc_people_4_back.is_popped img {
	animation: dcPeoplePop 0.6s cubic-bezier(0.34, 1.56, 0.64, 1);
}
@keyframes dcPeoplePop {
	0% { transform: scale(0); }
	55% { transform: scale(1.22); }
	75% { transform: scale(0.92); }
	100% { transform: scale(1); }
}

.dc_people img {
	display: block;
}
.dc_people img:first-of-type {
	position: relative;
	z-index: 2;
}
.dc_people img:last-of-type {
	position: absolute;
	display: block;
	top: 0;
	left: 0;
	margin-top: 7.5px;
	margin-left: 6.25px;
	z-index: 1;
}

.dc_people_1 img {
	transform-origin: 50% 100%;
	animation: dcPeopleJump 2.6s infinite;
}
.dc_people_1 img:last-of-type {
	animation-delay: 0.1s;
}

.dc_people_2 img {
	transform-origin: 50% 0%;
	animation: dcPeopleSway 2.8s ease-in-out infinite;
}
.dc_people_2 img:last-of-type {
	animation-delay: 0.1s;
}

.dc_people_3 img {
	animation: dcPeopleShake 1.6s linear infinite;
}
.dc_people_3 img:last-of-type {
	animation-delay: 0.1s;
}

.dc_people_4 {
	transform-origin: 50% 50%;
	transform-style: preserve-3d;
	animation: dcPeopleFlip 3.6s ease-in-out infinite;
}
.dc_people_4_back {
	transform-origin: 50% 50%;
	transform-style: preserve-3d;
	animation: dcPeopleFlip 3.6s ease-in-out infinite 0.1s;
}

.dc_people_5 img {
	transform-origin: 50% 80%;
	animation: dcPeopleShoulder 2.8s ease-in-out infinite;
}
.dc_people_5 img:last-of-type {
	animation-delay: 0.1s;
}

/* Animation */
@keyframes dcPeopleJump {
	0% { transform: translateY(0); animation-timing-function: ease-out; }
	8% { transform: translateY(-27.5px); animation-timing-function: ease-in; }
	15% { transform: translateY(0); }
	38% { transform: translateY(0); animation-timing-function: ease-out; }
	46% { transform: translateY(-27.5px); animation-timing-function: ease-in; }
	53% { transform: translateY(0); animation-timing-function: ease-out; }
	60% { transform: translateY(-27.5px); animation-timing-function: ease-in; }
	67%, 100% { transform: translateY(0); }
}
@keyframes dcPeopleSway {
	0%, 100% { transform: rotate(-4deg); }
	50% { transform: rotate(4deg); }
}
@keyframes dcPeopleShake {
	0%, 20%, 40%, 60% { transform: translateX(-1.25px) rotate(-1.5deg); animation-timing-function: steps(1, end); }
	10%, 30%, 50% { transform: translateX(1.25px) rotate(1.5deg); animation-timing-function: steps(1, end); }
	60%, 100% { transform: translate(0, 0) rotate(0); }
}
@keyframes dcPeopleFlip {
	0%, 25% { transform: rotateY(0); }
	50% { transform: rotateY(180deg); }
	75%, 100% { transform: rotateY(360deg); }
}
@keyframes dcPeopleShoulder {
	0%, 100% { transform: translateY(0) rotate(0deg); }
	10% { transform: translateY(3.75px) rotate(-1.5deg); }
	30% { transform: translateY(-6.25px) rotate(3deg); }
	42% { transform: translateY(-2.5px) rotate(2deg); }
	55% { transform: translateY(0) rotate(0deg); }
}
@media (max-width: 1024px) {

	.strap_title {
		margin-bottom: min(8%, 40px);
		margin-left: 0%;
	}

	.strap_title_tile .strap_subtitle {
		width: 55%;
		margin-left: 0;
	}

	.img_section_bg {
		width: min(60%, 260px);
	}

	.img_card_movie {
		margin-top: min(3.5%, 22px);
		margin-left: 6.5%;
	}

	.img_card {
		position: relative !important;
	}

	.img_card_01 {
		width: 85%;
		margin-left: 0;
		margin-bottom: min(15%, 100px);
	}

	.img_card_03 {
		width: 62.5%;
		margin-left: 6.25%;
		margin-bottom: 0;
		z-index: 5;
	}
	.img_card_04 {
		width: 80.9%;
		margin-top: -13%;
		margin-right: 0;
		z-index: 6;
	}

	.itudatte_text {
		width: 43.1%;
	}

	.tokimeki_text {
		right: -44%;
	}

	.text_section {
		margin: -8% auto min(33.3%, 500px);
		padding: 18% 0 26%;
	}

	.text_section_area {
		padding: 0;
		width: 87.08%;
	}
	.blue_wave_bg_textarea {
		margin-top: -15%;
	}

	.text_section_body p.white_text_sp_only {
		background: initial;
	}
	.text_section_body p.white_text_sp_only .white_text_sp_only_item {
		background: #fff;
		width: fit-content;
		display: block;
	}
	.text_section_body p.white_text_sp_only span.white_text_sp_only_item:first-of-type {
		display: block;
		margin-bottom: min(6.75vw, 56.25px);
	}

	.dc_oshi {
		top: -29.1%;
		right: -3.2%;
	}
	.dc_me_line {
		top: 0%;
		right: auto;
		left: auto;
	}
	.dc_me_line_left {
		bottom: 10%;
		left: -3%;
		top: auto;
	}
	.dc_me_line_right {
		right: -3%;
		top: 31%;
	}

	.dc_strapbag {
		margin-top: 0;
	}
	.dc_second_sticker {
		left: 5.5%;
	}
	.dc_strapbag_jump {
		right: 27%;
		margin-top: min(87%, 520px);
	}

}

/* ヒーロー画像
-------------------------------------- */
.hero_section {
    overflow-x: clip;
    background-color: #fff;
    position: sticky;
}
.large_hero_wrap {
	position: relative;
	width: 100vw;
	height: min(129vw, 932.5px);
	margin-left: calc(50% - 50vw);
	margin-right: calc(50% - 50vw);
	margin-bottom: min(34%, 390px);
	box-sizing: border-box;
	line-height: 0;
	z-index: 10;
	clip-path: border-box;

	overflow: visible;
}
.large_hero {
	width: 100%;
	/* svh/lvh で background-size のがくつきを防止 */
	height: 100lvh;
	background-image: url(/life/index/img/me_img_max.jpg);
	background-position: center;
	background-repeat: repeat;
	background-size: 721.25px auto;
	/* iOS の background-attachment:fixed 不具合を position:fixed で回避 */
	position: fixed;
	top: 0;
	left: 0;
	z-index: -1;
	will-change: transform;
}

.osu_marquee {
	position: absolute;
	left: 0;
	right: 0;
	bottom: max(-6%, -58.75px);
	transform: translateY(50%);
	overflow-x: clip;
	pointer-events: none;
	z-index: 30;
}
.osu_marquee_top {
	bottom: auto;
	top: max(-6%, -58.75px);
	transform: translateY(-50%);
}
.osu_marquee_track {
	display: flex;
	align-items: center;
	width: max-content;
	gap: 37.5px;
	will-change: transform;
}

.osu_marquee_item {
	flex: 0 0 auto;
	width: 157.5px;
	height: 157.5px;
	border-radius: 50%;
	border: 2.5px solid var(--osu-c);
	background: transparent;
	display: flex;
	align-items: center;
	justify-content: center;
	box-sizing: border-box;
}

.osu_marquee_item img {
	width: 100%;
	height: 100%;
	border-radius: 50%;
}
.osu_marquee_track.is_spinning .osu_marquee_item img {
	animation: osuRecordSpin 6s linear infinite;
}
.osu_marquee_track.is_spinning .osu_marquee_item:nth-child(4n + 1) img {
	animation-duration: 6s;
	animation-delay: 0s;
}
.osu_marquee_track.is_spinning .osu_marquee_item:nth-child(4n + 2) img {
	animation-duration: 7.3s;
	animation-delay: -1.8s;
}
.osu_marquee_track.is_spinning .osu_marquee_item:nth-child(4n + 3) img {
	animation-duration: 5.2s;
	animation-delay: -2.6s;
}
.osu_marquee_track.is_spinning .osu_marquee_item:nth-child(4n) img {
	animation-duration: 8.1s;
	animation-delay: -6s;
}

@media (max-width: 1024px) {
	.large_hero {
		background-size: 102vw auto;
	}

	.osu_marquee_track {
		gap: 20px;
	}

	.osu_marquee_item {
		width: min(20.6vw, 200px);
		height: min(20.6vw, 200px);
	}
}

/* Products
-------------------------------------- */
.product_section {
	position: relative;
	overflow-x: clip;
}

.blue_wave_bg_product {
	margin-top:2%;
}

.product_section_inner > .product_section_title,
.product_section_inner > .product_slider {
	position: relative;
	z-index: 2;
}

.product_section_inner {
	position: sticky;
	top: 0;
	width: 100%;
	height: var(--app-vh, 100vh);
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	transform: translateZ(0);
	will-change: transform;
}

.product_section_title {
	margin: 0 auto min(26%, 140px);
	padding-top: 0%;
	width: min(80%, 665px);
	font-size: 3.75rem;
	line-height: 1;
	font-weight: bold;
	letter-spacing: 0.1em;
	color: var(--me-text-color);
	z-index: 50;
	position: relative;
}
.product_section_title .product_section_title_sub {
	width: min(45.9%,665px);
	margin: 0 auto min(4.9%, 33.75px);
}

.product_section_title_sub,
.product_section_title_main {
	display: block;
	overflow: hidden;
}
.product_section_title_sub > img,
.product_section_title_main > img {
	display: block;
	transform: translateY(110%);
	will-change: transform;
}
.product_section_title.is_revealed .product_section_title_sub > img {
	animation: productsTitleMaskUp 0.95s cubic-bezier(0.22, 1, 0.28, 1) 0.05s forwards;
}
.product_section_title.is_revealed .product_section_title_main > img {
	animation: productsTitleMaskUp 1.05s cubic-bezier(0.22, 1, 0.28, 1) 0.25s forwards;
}
.product_section_title.is_revealed .product_section_title_sub {
	animation: productsSubShake 1.8s ease-in-out 1.2s infinite;
}
@keyframes productsTitleMaskUp {
	0% { transform: translateY(110%); }
	100% { transform: translateY(0); }
}

@keyframes productsSubShake {
	0%, 100% { transform: scaleX(1) scaleY(1) rotate(0deg); }
	15% { transform: scaleX(1.07) scaleY(0.95) rotate(0.6deg); }
	30% { transform: scaleX(0.97) scaleY(1.03) rotate(-0.4deg); }
	45% { transform: scaleX(1.05) scaleY(0.97) rotate(0.3deg); }
	60% { transform: scaleX(0.98) scaleY(1.02) rotate(-0.2deg); }
	80% { transform: scaleX(1.02) scaleY(0.99) rotate(0.15deg); }
}

.product_slider {
	position: relative;
	width: 100%;
	flex: 1;
	display: flex;
	align-items: center;
}

#product_slider_track {
	position: relative;
	display: flex;
	align-items: center;
	gap: 225px;
	padding: 0 calc(50vw - 234.375px);
	will-change: transform;
}

#product_slider {
	transform: perspective(1200px) rotateX(18deg) translateY(60px);
	transform-origin: center bottom;
	opacity: 0;
	transition:
		transform 1.1s cubic-bezier(0.22, 1, 0.32, 1),
		opacity 0.8s ease-out;
	will-change: transform, opacity;
}
#product_slider.is_revealed {
	transform: perspective(1200px) rotateX(0deg) translateY(0);
	opacity: 1;
}

.product_slider_slide {
	position: relative;
	flex: 0 0 auto;
	width: 468.75px;
	height: min(80vh, 700px);
	will-change: opacity, filter;
}
.product_slider_slide.product_slider_slide_more{
	display: grid;
	place-items: center;
}
.product_slider_slide.product_slider_slide_more a{
	border-radius: 50%;
	text-decoration: none;
}
.product_slider_slide.product_slider_slide_more a .product_slider_img_wrap{
	transition: transform 0.3s ease;
}
.product_slider_slide.product_slider_slide_more a:hover .product_slider_img_wrap{
	transform: rotateY(-360deg);
}

.product_slider_img_wrap {
	filter:grayscale(100%);
	transition: filter 400ms ease;
}
.product_slider_slide.product_slider_slide_active .product_slider_img_wrap {
	filter: grayscale(0%);
}
a.product_slider_slide {
	pointer-events: none;
}
a.product_slider_slide.product_slider_slide_active {
	pointer-events: auto;
}

.product_slider_text {
	opacity: 0;
	transform: translateY(2.5rem);
	transition:
		opacity 400ms ease,
		transform 400ms ease;
}
.product_slider_slide.product_slider_slide_active .product_slider_text {
	opacity: 1;
	transform: translateY(0);
}

.product_slider_icon {
	position: absolute;
	top: 0;
	right: min(5.83%, 31.25px);
	margin-top: min(5.83%, 31.25px);
	width: min(12.2vw, 97.5px);
	height: min(12.2vw, 97.5px);
	border-radius: 50%;
	border: 2.5px solid var(--shape-color, #000);
	color: var(--shape-color, #000);
	display: flex;
	align-items: center;
	justify-content: center;
	font-family: "Noto Sans JP", "Noto Sans", sans-serif;
	font-size: min(6.25vw, 50px);
	font-weight: 500;
	line-height: 1;
	z-index: 3;
	opacity: 0;
	transform: translateY(0) scale(0.5);
	transition:
		opacity 400ms ease,
		transform 400ms ease;
	pointer-events: none;
}
.product_slider_slide_more .product_slider_icon {
	display: none;
}
.product_slider_slide.product_slider_slide_active .product_slider_icon {
	opacity: 1;
	transform: translateY(0) scale(1);
}
.product_slider_slide:hover .product_slider_icon {
	transform: scale(1.1);
}

.product_slider_img_wrap {
	width: 100%;
	height: 100%;
	overflow: hidden;
	position: relative;
	z-index: 2;
	background-color: #fff;
}
.product_slider_slide_more .product_slider_img_wrap{
	width: min(41.6vw,319px);
	height: min(41.6vw,319px);
	border-radius: 50%;
	display: grid;
	place-items: center;
	font-family: var(--font-en);
	font-size: min(5.6vw, 30px);
	color: #0000fe;
	font-weight: 700;
	letter-spacing: 0.1em;
	line-height: 1;
	pointer-events: none;
	filter: initial;
}

.product_slider_slide.is_red {
	--shape-color: #d82c2c;
}
.product_slider_slide.is_yellow {
	--shape-color: #ffff00;
}
.product_slider_slide.is_black {
	--shape-color: #000000;
}
.product_slider_slide.is_crimson_red {
	--shape-color: #7b1e2b;
}
.product_slider_slide.is_purple {
	--shape-color: #ff00fe;
}
.product_slider_slide.is_white {
	--shape-color: #ffffff;
}
.product_slider_slide.is_more {
	--shape-color: #cecece;
}
.product_slider_slide .product_slider_text {
	color: var(--shape-color);
}
a.product_slider_slide {
	text-decoration: none;
	display: block;
}

.product_slider_bg_shape {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: var(--shape-color, #ff00fe);
	z-index: 1;
	transform: rotate(0deg) scale(0.6);
	transform-origin: center center;
	pointer-events: none;
	will-change: transform;
}
.product_slider_slide.product_slider_slide_active .product_slider_bg_shape {
	animation: secMeShapeKata 380ms cubic-bezier(0.2, 0.8, 0.3, 1.2) 220ms forwards;
}
@keyframes secMeShapeKata {
	0% { transform: rotate(0deg) scale(0.6); }
	55% { transform: rotate(15deg) scale(1.1); }
	78% { transform: rotate(6.5deg) scale(0.99); }
	100% { transform: rotate(8deg) scale(1); }
}

.product_slider_img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	pointer-events: none;
	object-position: top;
}

.product_slider_text {
	position: absolute;
	bottom: 8%;
	left: -10%;
	right: 0;
	width: 120%;
	z-index: 20;
	margin: 0;
	pointer-events: none;
}

@media (max-width: 1024px) {
	.blue_wave_bg_product {
		margin-top: 30.3%;
		height: 122vw;
	}

	.product_section_inner {
		height: 135.4svw;
	}

	.product_section_title {
		padding-top: 9.58%;
	}

	#product_slider_track {
		gap: 60px;
		padding: 0 calc(50vw - 31.25vw);
	}

	.product_slider_slide {
		width: 62.5vw;
		height: min(93.7vw, 680px);
	}

	.product_slider_text {
		bottom: initial;
		top: 96%;
	}
	.product_slider_icon {
		font-weight:400;
		border: 1px solid var(--shape-color, #000);
	}
}

/* クロージング
-------------------------------------- */
.closing {
	text-align: center;
	margin: min(70.8%, 625px) 0px min(24.5%,225px);
	color: #111;
}
.closing_catch {
	font-weight: 500;
	font-size: min(6vw, 4.125rem);
	margin: 0 0 min(20.6%, 162.5px);
}
.closing_catch img {
	display: inline-block;
	height: min(7vw, 50px);
	width: auto;
	vertical-align: middle;
}
.closing_catch img:last-of-type {
	margin-top: min(4.7%, 25px);
}
.closing_heart {
	display: inline-block;
	animation:
		wmHeartColor 4s linear infinite,
		wmHeartPulse 1.5s ease-in-out infinite;
	will-change: color, transform;
	vertical-align: middle;
}
.closing_for {
	margin: 0;
	line-height: 1;
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 0.15em;
}
.closing_for_img {
	display: block;
	width: min(9.47vw, 80px);
	height: auto;
	margin-bottom: min(4vw, 37.5px);
}
.closing_for_me {
	display: block;
	width: min(26vw, 197.5px);
	height: auto;
}

.closing .closing_for {
	opacity: 1;
}
.closing .closing_for_img {
	opacity: 0;
	transform: translateY(-40px) rotate(-3deg);
	will-change: opacity, transform;
}
.closing .closing_for_me {
	opacity: 0;
	transform: scale(0.3) rotate(-18deg);
	transform-origin: center center;
	will-change: opacity, transform;
}

.closing.is_revealed .closing_for_img {
	animation: closingForDrop 0.85s cubic-bezier(0.34, 1.56, 0.64, 1) 1.5s forwards;
}
.closing .closing_for_me_wrap {
	display: inline-block;
	transform-origin: center center;
	will-change: transform;
}
.closing.is_revealed .closing_for_me {
	animation: closingMeStamp 0.85s cubic-bezier(0.22, 1.4, 0.36, 1) 1.95s forwards;
}
.closing.is_revealed .closing_for_me_wrap {
	animation: closingMeRattle 4.5s ease-in-out 3.6s infinite;
}
.closing .closing_heart {
	opacity: 0;
	transform: scale(0);
	transform-origin: center center;
	position: relative;
	animation: none;
}
.closing .closing_heart::before,
.closing .closing_heart::after {
	content: "";
	position: absolute;
	top: 50%;
	left: 50%;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: currentColor;
	color: inherit;
	opacity: 0;
	pointer-events: none;
	transform: translate(-50%, -50%) scale(0.3);
	will-change: opacity, transform;
}

.closing .closing_heart::before {
	box-shadow:
		-27.5px -20px 0 currentColor,
		27.5px -20px 0 currentColor,
		-37.5px 5px 0 currentColor,
		37.5px 5px 0 currentColor;
}

.closing .closing_heart::after {
	width: 3.75px;
	height: 3.75px;
	box-shadow:
		0px -32.5px 0 currentColor,
		-20px 20px 0 currentColor,
		20px 20px 0 currentColor,
		0px 27.5px 0 currentColor;
}
.closing.is_revealed .closing_heart {
	animation:
		closingHeartPop 0.6s cubic-bezier(0.22, 1.6, 0.36, 1) 0.5s forwards,
		wmHeartColor 4s linear 0s infinite,
		wmHeartPulse 1.9s ease-in-out 2.2s infinite;
}
.closing.is_revealed .closing_heart::before {
	animation: closingHeartSparkle 0.55s ease-out 0.65s forwards;
}
.closing.is_revealed .closing_heart::after {
	animation: closingHeartSparkle 0.55s ease-out 0.75s forwards;
}

.closing .closing_heart,
.closing .closing_for_me {
	-webkit-tap-highlight-color: transparent;
	tap-highlight-color: transparent;
}
.closing .closing_heart.is_replay_a {
	animation:
		closingHeartPopA 0.5s cubic-bezier(0.22, 1.6, 0.36, 1) 0s forwards,
		wmHeartColor 4s linear 0s infinite,
		wmHeartPulse 1.9s ease-in-out 0.9s infinite;
}
.closing .closing_heart.is_replay_b {
	animation:
		closingHeartPopB 0.5s cubic-bezier(0.22, 1.6, 0.36, 1) 0s forwards,
		wmHeartColor 4s linear 0s infinite,
		wmHeartPulse 1.9s ease-in-out 0.9s infinite;
}
.closing .closing_heart.is_replay_a::before {
	animation: closingHeartSparkleA 0.55s ease-out 0.3s forwards;
}
.closing .closing_heart.is_replay_a::after {
	animation: closingHeartSparkleA 0.55s ease-out 0.4s forwards;
}
.closing .closing_heart.is_replay_b::before {
	animation: closingHeartSparkleB 0.55s ease-out 0.3s forwards;
}
.closing .closing_heart.is_replay_b::after {
	animation: closingHeartSparkleB 0.55s ease-out 0.4s forwards;
}
.closing .closing_for_me.is_replay_a {
	animation: closingMeStampA 0.85s cubic-bezier(0.22, 1.4, 0.36, 1) 0s forwards;
}
.closing .closing_for_me.is_replay_b {
	animation: closingMeStampB 0.85s cubic-bezier(0.22, 1.4, 0.36, 1) 0s forwards;
}
/* ハートのエモート */
@keyframes closingHeartPopA {
	0% { opacity: 1; transform: scale(1, 1.3); }
	30% { opacity: 1; transform: scale(1.4, 1.65); }
	55% { opacity: 1; transform: scale(0.88, 1.18); }
	75% { opacity: 1; transform: scale(1.06, 1.36); }
	100% { opacity: 1; transform: scale(1, 1.3); }
}
@keyframes closingHeartPopB {
	0% { opacity: 1; transform: scale(1, 1.3); }
	30% { opacity: 1; transform: scale(1.4, 1.65); }
	55% { opacity: 1; transform: scale(0.88, 1.18); }
	75% { opacity: 1; transform: scale(1.06, 1.36); }
	100% { opacity: 1; transform: scale(1, 1.3); }
}
@keyframes closingHeartSparkleA {
	0% { opacity: 0; transform: translate(-50%, -50%) scale(0.3); }
	30% { opacity: 0.95; transform: translate(-50%, -50%) scale(1); }
	100% { opacity: 0; transform: translate(-50%, -50%) scale(1.9); }
}
@keyframes closingHeartSparkleB {
	0% { opacity: 0; transform: translate(-50%, -50%) scale(0.3); }
	30% { opacity: 0.95; transform: translate(-50%, -50%) scale(1); }
	100% { opacity: 0; transform: translate(-50%, -50%) scale(1.9); }
}
@keyframes closingMeStampA {
	0% { opacity: 0; transform: scale(0.3) rotate(-18deg); }
	55% { opacity: 1; transform: scale(1.5) rotate(5deg); }
	75% { transform: scale(0.95) rotate(-2deg); }
	100% { opacity: 1; transform: scale(1) rotate(0deg); }
}
@keyframes closingMeStampB {
	0% { opacity: 0; transform: scale(0.3) rotate(-18deg); }
	55% { opacity: 1; transform: scale(1.5) rotate(5deg); }
	75% { transform: scale(0.95) rotate(-2deg); }
	100% { opacity: 1; transform: scale(1) rotate(0deg); }
}

/* Meのループ*/
@keyframes closingMeRattle {
	0% { transform: scale(1) rotate(0deg); }
	2% { transform: scale(1.04) rotate(-6deg); }
	4% { transform: scale(1.04) rotate(5deg); }
	6% { transform: scale(1.04) rotate(-4deg); }
	8% { transform: scale(1.03) rotate(4deg); }
	10% { transform: scale(1.03) rotate(-3deg); }
	12% { transform: scale(1.02) rotate(2deg); }
	14% { transform: scale(1) rotate(0deg); }
	100% { transform: scale(1) rotate(0deg); }
}
@keyframes closingHeartPop {
	0%   { opacity: 0; transform: scale(0); }
	25%  { opacity: 1; transform: scale(1.5, 2); }
	100% { opacity: 1; transform: scale(1, 1.3); }
}
@keyframes closingHeartSparkle {
	0% { opacity: 0; transform: translate(-50%, -50%) scale(0.3); }
	30% { opacity: 0.95; transform: translate(-50%, -50%) scale(1); }
	100% { opacity: 0; transform: translate(-50%, -50%) scale(1.9); }
}

/* ハートのループ */
@keyframes wmHeartColor {
	0% { color: #00ffff; }
	25% { color: #ff00ff; }
	50% { color: #00ff00; }
	75% { color: #dfff00; }
	100% { color: #00ffff; }
}

/* 二段ハートビート：「ドクッ・ドクン・休」の生っぽい鼓動 */
@keyframes wmHeartPulse {
	0%       { transform: scale(1, 1.3); }
	8%       { transform: scale(1.22, 1.55); }  /* 1拍目（強め） */
	18%      { transform: scale(1.04, 1.34); }  /* わずかに引き */
	26%      { transform: scale(1.16, 1.48); }  /* 2拍目（弱め） */
	40%      { transform: scale(1, 1.3); }       /* 静止に戻る */
	100%     { transform: scale(1, 1.3); }       /* 拍と拍の間の休止 */
}

/* 横無限スクロールマーキー（4画像をループ）*/
.me_loop_marquee {
	width: 100%;
	height: min(15.7vw, 150px);
	background-color: #fff;
	position: relative;
	z-index: 20;
	overflow-x: clip;
	margin-bottom: min(8.75%, 100px);
}
.me_loop_marquee_track {
	display: flex;
	align-items: center;
	height: 100%;
	width: max-content;
	will-change: transform;
	perspective: 1000px;
}
.me_loop_marquee_track img {
	display: block;
	height: 100%;
	width: auto;
	flex: 0 0 auto;
	pointer-events: none;
	user-select: none;
	backface-visibility: visible;
}
.me_loop_marquee_track.is_spinning > img:nth-child(4n + 1) {
	animation: meLoopBlueFlip 5s ease-in-out infinite alternate;
}
@keyframes meLoopBlueFlip {
	0%, 25% { transform: rotateY(0deg); }
	75%, 100% { transform: rotateY(360deg); }
}