@charset "UTF-8";
@import url('https://fonts.googleapis.com/css2?family=Zen+Maru+Gothic:wght@500;700;900&display=swap');
/* -----------------------------------------------------------------
フォント設定
----------------------------------------------------------------- */
/* -----------------------------------------------------------------
メディアクエリ
----------------------------------------------------------------- */
/* media query */
/* -----------------------------------------------------------------
ホバー
----------------------------------------------------------------- */
/* -----------------------------------------------------------------
ホバーアニメーション
----------------------------------------------------------------- */
/* 半透明になる - 優先度の低いバナーなど */
/* 押しボタン - UIパーツなど */
@keyframes hoverPush {
	30% {
		transform: scale(0.92);
	}

	100% {
		transform: scale(1);
	}
}
/* 飛び出し - 目立たせたい要素など */
@keyframes hoverOutBack {
	50% {
		translate: 0 -10%;
	}

	100% {
		translate: 0 0%;
	}
}
/* -----------------------------------------------------------------
テキスト内リンク設定
----------------------------------------------------------------- */
/* -----------------------------------------------------------------
リンクアイコン付与
----------------------------------------------------------------- */
/* aタグ内のspanにアイコン付与したい際にselectorWrapは使用する */
/* -----------------------------------------------------------------
拡張子別リンクアイコンカラー設定
----------------------------------------------------------------- */
/* -----------------------------------------------------------------
子要素のマージントップを0に強制
----------------------------------------------------------------- */
/* -----------------------------------------------------------------
次要素のマージントップを0に強制
----------------------------------------------------------------- */
/* -----------------------------------------------------------------
カラム別マージントップ設定
----------------------------------------------------------------- */
/* -----------------------------------------------------------------
テキスト非表示
----------------------------------------------------------------- */
/* -----------------------------------------------------------------
クリック・タッチの最小ターゲット設定
----------------------------------------------------------------- */
/* -----------------------------------------------------------------
Webフォント設定
----------------------------------------------------------------- */
/* -----------------------------------------------------------------
CSS変数設定
----------------------------------------------------------------- */
:root {
	--primary: #e8380d;
	--secondary: #94252a;
	--txtColor: #3b3d48;
	--borderColor: #c6c6c6;
	--bgColor: #fff;
	--bgColorSecondary: #3b3d48;
	--bgColorTertiary: #f5f5f5;
	--bgColorTh: #e6e6e6;
	--bgColorThSub: rgba(230,230,230, 0.25);
	--white: #fff;
	--black: #3b3d48;
	--fontFamily: 'Zen Maru Gothic', 'ヒラギノ角 Pro W3', 'Hiragino Kaku Pro W3', 'メイリオ', Meiryo, 'MS Pゴシック',
		'MS PGothic', sans-serif;
	--txtSizeSp: 1.4rem;
	--txtSizePc: 1.6rem;
	--lineHeight: 1.75;
	--lineHeightTitle: 1.5;
	--letterSpacing: 0.01em;
	--fixedWidth: 1040px;
	--fixedWidthInner: 880px;
	--fixedWidthMain: 800px;
	--zIndexLv0: 0;
	--zIndexLv1: 1;
	--zIndexLv2: 10;
	--zIndexLv3: 100;
	--zIndexLv4: 1000;
	--zIndexLv5: 10000;
	--breakTabLength: 768;
	--breakPcLength: 1025;
	/* 個人設定 */
	--colorKey: #f46ca9;
	--colorKey50: #f9b5d4;
	--colorKey25: #fcdae9;
	--colorKeyText: #ea4f98;
	/* キャラ設定 */
	--colorCurewonderful: #ff326b;
	--colorCurewonderfulUiBg: #FFFCDF;
	--colorCurefriendly: #aa57ff;
	--colorCurefriendlyUiBg: #F4DAFA;
	--colorCurenyami: #29b6ff;
	--colorCurenyamiUiBg: #fdfedf;
	--colorCurelillian: #25e9e8;
	--colorCurelillianUiBg: #ffd3ff;
	--colorCurelillianText: #0fbdd0;
	
	--colorTorame: #d6deeb;
	--colorTorameBg: #d6deeb;
	--colorTorameText:#08184e;
	
	--colorTorame: #e8e3ab;
	--colorTorameBg: #e8e3ab;
	--colorTorameText:#735a04;
	
	--colorZakuro: #96003d;
	--colorZakuroBg: #e2c2c9;
	--colorZakuroText:#96003d;

	--colorniko: #b07cea;
	--colornikoUiBg: #dffaff;



	/* イージング */
	--easeOutBack: cubic-bezier(0.4, 1.5, 0.64, 1.5);
	/* アスペクト比計算用 */
	--widthPC: 1440;
	--widthSP: 750;
	--heightCharacterPc: 700;
	--heightCharacterSp: 856;
}
.l-content {
	padding-bottom: 110px;
}
.l-content.is-curewonderful {
		--colorCharacter: var(--colorCurewonderful);
		--colorCharacterBg: #FADAE8;
		--colorCharacterUiBg: var(--colorCurewonderfulUiBg);
		--colorCharacterTableBg: #fff8c5;
		--colorCharacterTableBorder: #fc79b4;
		--imgCharacterCurtain: url("/tv/wonderful_precure/assets/images/character/curewonderful/p_curtain_top.webp");
	}
.l-content.is-curewonderful .p-nav__character-link.is-curewonderful {
			opacity: .5;
		}
.l-content.is-curewonderful .swiper-pagination-bullet:nth-child(1)::after {
					background: url("/tv/wonderful_precure/assets/images/character/curewonderful/p_tumb01.webp") no-repeat center center / contain;
				}
.l-content.is-curewonderful .swiper-pagination-bullet:nth-child(2)::after {
					background: url("/tv/wonderful_precure/assets/images/character/curewonderful/p_tumb02.webp") no-repeat center center / contain;
				}
.l-content.is-curewonderful .swiper-pagination-bullet:nth-child(3)::after {
					background: url("/tv/wonderful_precure/assets/images/character/curewonderful/p_tumb03.webp") no-repeat center center / contain;
				}
.l-content.is-curewonderful .swiper-pagination-bullet:nth-child(4)::after {
					background: url("/tv/wonderful_precure/assets/images/character/curewonderful/p_tumb04.webp") no-repeat center center / contain;
				}
				
.l-content.is-curewonderful .swiper-pagination-bullet:nth-child(5)::after {
					background: url("/tv/wonderful_precure/assets/images/character/curewonderful/p_tumb05.webp") no-repeat center center / contain;
				}
				
.l-content.is-curefriendly {
		--colorCharacter: var(--colorCurefriendly);
		--colorCharacterBg: #F4DAFA;
		--colorCharacterUiBg: var(--colorCurefriendlyUiBg);
		--colorCharacterTableBg: #fdd3ff;
		--colorCharacterTableBorder: #aa56ff;
		--imgCharacterCurtain: url("/tv/wonderful_precure/assets/images/character/curefriendly/p_curtain_top.webp");
	}
.l-content.is-curefriendly .p-nav__character-link.is-curefriendly {
			opacity: .5;
		}
.l-content.is-curefriendly .swiper-pagination-bullet:nth-child(1)::after {
					background: url("/tv/wonderful_precure/assets/images/character/curefriendly/p_tumb01.webp") no-repeat center center / contain;
				}
.l-content.is-curefriendly .swiper-pagination-bullet:nth-child(2)::after {
					background: url("/tv/wonderful_precure/assets/images/character/curefriendly/p_tumb02.webp") no-repeat center center / contain;
				}
.l-content.is-curefriendly .swiper-pagination-bullet:nth-child(3)::after {
					background: url("/tv/wonderful_precure/assets/images/character/curefriendly/p_tumb03.webp") no-repeat center center / contain;
				}
.l-content.is-curefriendly .swiper-pagination-bullet:nth-child(4)::after {
					background: url("/tv/wonderful_precure/assets/images/character/curefriendly/p_tumb04.webp") no-repeat center center / contain;
				}
.l-content.is-curenyami {
		--colorCharacter: var(--colorCurenyami);
		--colorCharacterBg: #D4E6F9;
		--colorCharacterUiBg: var(--colorCurenyamiUiBg);
		--colorCharacterTableBg: #fcfddf;
		--colorCharacterTableBorder: #29b6ff;
		--imgCharacterCurtain: url("/tv/wonderful_precure/assets/images/character/curenyami/p_curtain_top.webp");
	}
.l-content.is-curenyami .p-nav__character-link.is-curenyami {
			opacity: .5;
		}
.l-content.is-curenyami .swiper-pagination-bullet:nth-child(1)::after {
					background: url("/tv/wonderful_precure/assets/images/character/curenyami/p_tumb01.webp") no-repeat center center / contain;
				}
.l-content.is-curenyami .swiper-pagination-bullet:nth-child(2)::after {
					background: url("/tv/wonderful_precure/assets/images/character/curenyami/p_tumb02.webp") no-repeat center center / contain;
				}
.l-content.is-curenyami .swiper-pagination-bullet:nth-child(3)::after {
					background: url("/tv/wonderful_precure/assets/images/character/curenyami/p_tumb03.webp") no-repeat center center / contain;
				}
.l-content.is-curenyami .swiper-pagination-bullet:nth-child(4)::after {
					background: url("/tv/wonderful_precure/assets/images/character/curenyami/p_tumb04.webp") no-repeat center center / contain;
				}
.l-content.is-curenyami .swiper-pagination-bullet:nth-child(5)::after {
					background: url("/tv/wonderful_precure/assets/images/character/curenyami/p_tumb05.webp") no-repeat center center / contain;
				}
				
				
.l-content.is-curelillian {
		--colorCharacter: var(--colorCurelillianText);
		--colorCharacterBg: #E6F6DE;
		--colorCharacterUiBg: var(--colorCurelillianUiBg);
		--colorCharacterTableBg: #ffd2ff;
		--colorCharacterTableBorder: #24e9e8;
		--imgCharacterCurtain: url("/tv/wonderful_precure/assets/images/character/curelillian/p_curtain_top.webp");
	}
.l-content.is-curelillian .p-nav__character-link.is-curelillian {
			opacity: .5;
		}
.l-content.is-curelillian .swiper-pagination-bullet:nth-child(1)::after {
					background: url("/tv/wonderful_precure/assets/images/character/curelillian/p_tumb01.webp") no-repeat center center / contain;
				}
.l-content.is-curelillian .swiper-pagination-bullet:nth-child(2)::after {
					background: url("/tv/wonderful_precure/assets/images/character/curelillian/p_tumb02.webp") no-repeat center center / contain;
				}
.l-content.is-curelillian .swiper-pagination-bullet:nth-child(3)::after {
					background: url("/tv/wonderful_precure/assets/images/character/curelillian/p_tumb03.webp") no-repeat center center / contain;
				}
.l-content.is-curelillian .swiper-pagination-bullet:nth-child(4)::after {
					background: url("/tv/wonderful_precure/assets/images/character/curelillian/p_tumb04.webp") no-repeat center center / contain;
				}
				
				
.l-content.is-niko {
		--colorCharacter: var(--colorniko);
		--colorCharacterBg: #feeeff;
		--colorCharacterUiBg: var(--colornikoUiBg);
		--colorCharacterTableBg: #dffaff;
		--colorCharacterTableBorder: #ceb8fd;
		--imgCharacterCurtain: url("/tv/wonderful_precure/assets/images/character/niko/p_curtain_top.webp");
	}
.l-content.is-niko .p-nav__character-link.is-niko {
			opacity: .5;
		}
.l-content.is-niko .swiper-pagination-bullet:nth-child(1)::after {
					background: url("/tv/wonderful_precure/assets/images/character/niko/p_tumb01.webp") no-repeat center center / contain;
				}
.l-content.is-niko .swiper-pagination-bullet:nth-child(2)::after {
					background: url("/tv/wonderful_precure/assets/images/character/niko/p_tumb02.webp") no-repeat center center / contain;
				}
.l-content.is-niko .p-character__table {
			background: var(--colorCharacterBg);
		}				
				
				
				
.l-content.is-gaou {
    --colorCharacter: var(--colorGaouText);
    --colorCharacterBg: #d6deeb;
    --colorCharacterUiBg: var(--colorrGaouBg);
    --colorCharacterTableBg: #acb5c3;
    --colorCharacterTableBorder: #08184e;
    --imgCharacterCurtain: url(/tv/wonderful_precure/assets/images/character/gaou/p_repeat_sp.png);
}

.l-content.is-gaou .p-nav__character-link.is-gaou {
			opacity: .5;
		}
.l-content.is-gaou .swiper-pagination-bullet:nth-child(1)::after {
					background: url("/tv/wonderful_precure/assets/images/character/gaou/p_tumb01.webp") no-repeat center center / contain;
				}
.l-content.is-gaou .swiper-pagination-bullet:nth-child(2)::after {
					background: url("/tv/wonderful_precure/assets/images/character/gaou/p_tumb02.webp") no-repeat center center / contain;
				}
.l-content.is-gaou .swiper-pagination-bullet:nth-child(3)::after {
					background: url("/tv/wonderful_precure/assets/images/character/gaou/p_tumb03.webp") no-repeat center center / contain;
				}
				

.l-content.is-gaou2 {
    --colorCharacter: var(--colorGaouText);
    --colorCharacterBg: #d6deeb;
    --colorCharacterUiBg: var(--colorrGaouBg);
    --colorCharacterTableBg: #acb5c3;
    --colorCharacterTableBorder: #08184e;
    --imgCharacterCurtain: url(/tv/wonderful_precure/assets/images/character/gaou/p_repeat_sp.png);
}

.l-content.is-gaou2 .p-nav__character-link.is-gaou2 {
			opacity: .5;
		}
.l-content.is-gaou2 .swiper-pagination-bullet:nth-child(1)::after {
					background: url("/tv/wonderful_precure/assets/images/character/gaou/p_tumb01.webp") no-repeat center center / contain;
				}
.l-content.is-gaou2 .swiper-pagination-bullet:nth-child(2)::after {
					background: url("/tv/wonderful_precure/assets/images/character/gaou/p_tumb02.webp") no-repeat center center / contain;
				}
.l-content.is-gaou2 .swiper-pagination-bullet:nth-child(3)::after {
					background: url("/tv/wonderful_precure/assets/images/character/gaou/p_tumb03.webp") no-repeat center center / contain;
				}
				





				
.l-content.is-torame {
    --colorCharacter: var(--colorTorameText);
    --colorCharacterBg: #e1dfc2;
    --colorCharacterUiBg: var(--colorTorameBg);
    --colorCharacterTableBg: #e8e3ab;
    --colorCharacterTableBorder: #735a04;
    --imgCharacterCurtain: url(/tv/wonderful_precure/assets/images/character/torame/p_repeat_sp.png)
				}

.l-content.is-torame .p-nav__character-link.is-torame {
			opacity: .5;
		}
.l-content.is-torame .swiper-pagination-bullet:nth-child(1)::after {
					background: url("/tv/wonderful_precure/assets/images/character/torame/p_tumb01.webp") no-repeat center center / contain;
				}
.l-content.is-torame .swiper-pagination-bullet:nth-child(2)::after {
					background: url("/tv/wonderful_precure/assets/images/character/torame/p_tumb02.webp") no-repeat center center / contain;
				}
.l-content.is-torame .swiper-pagination-bullet:nth-child(3)::after {
					background: url("/tv/wonderful_precure/assets/images/character/torame/p_tumb03.webp") no-repeat center center / contain;
				}
				
				

.l-content.is-zakuro {
    --colorCharacter: var(--colorZakuroText);
    --colorCharacterBg: #ceb7ba;
    --colorCharacterUiBg: var(--colorZakuroBg);
    --colorCharacterTableBg: #e2c2c9;
    --colorCharacterTableBorder: #95003c;
    --imgCharacterCurtain: url(/tv/wonderful_precure/assets/images/character/zakuro/p_repeat_sp.png);
}


.l-content.is-zakuro .p-nav__character-link.is-zakuro {
			opacity: .5;
		}
.l-content.is-zakuro .swiper-pagination-bullet:nth-child(1)::after {
					background: url("/tv/wonderful_precure/assets/images/character/zakuro/p_tumb01.webp") no-repeat center center / contain;
				}
.l-content.is-zakuro .swiper-pagination-bullet:nth-child(2)::after {
					background: url("/tv/wonderful_precure/assets/images/character/zakuro/p_tumb02.webp") no-repeat center center / contain;
				}
.l-content.is-zakuro .swiper-pagination-bullet:nth-child(3)::after {
					background: url("/tv/wonderful_precure/assets/images/character/zakuro/p_tumb03.webp") no-repeat center center / contain;
				}
				
				
				
				
				
				
				
				
.l-content.is-garugaru {
		--colorCharacter: #3b365b;
		--colorCharacterBg: #c4c3db;
		--colorCharacterUiBg: #3b365b;
		--colorCharacterTableBg: #dedae8;
		--colorCharacterTableBorder: #3a4448;
		--imgCharacterCurtain: url("/tv/wonderful_precure/assets/images/character/garugaru/p_curtain_top.webp");
	}
.l-content.is-garugaru .p-nav__character-link.is-garugaru {
			opacity: .5;
		}
.l-content.is-garugaru .p-character__table {
			background: var(--colorCharacterBg);
		}
.p-nav {
	margin-top: 50px;
}
@media print, screen and (min-width: 1025px) {
.p-nav {
		margin-top: 60px;
}
	}
.p-nav .p-nav__inner {
		max-width: 1100px;
	}
.p-nav .p-nav__border {
		display: block;
		width: 100%;
		margin-top: 24px;
	}
@media print, screen and (min-width: 1025px) {
.p-nav .p-nav__border {
			margin-top: 42px;
	}
	}
.p-nav .p-nav__border img {
			display: block;
			width: 100%;
		}
/* ------------------------------
		カテゴリ選択
------------------------------ */
.p-nav__category {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	row-gap: 40px;
}
@media print, screen and (min-width: 1025px) {
.p-nav__category {
		grid-template-columns: repeat(5, 1fr);
}
	}
.p-nav__category .p-nav__category-item .p-nav__category-link {
			position: relative;
			z-index: var(--zIndexLv1);
			display: block;
			width: -moz-fit-content;
			width: fit-content;
			margin-inline: auto;
			opacity: .5;
		}
.p-nav__category .p-nav__category-item .p-nav__category-link.is-current {
				opacity: 1;
			}
.p-nav__category .p-nav__category-item .p-nav__category-link.is-current::before {
					position: absolute;
					top: calc(50% - 4px);
					left: 50%;
					z-index: -1;
					display: block;
					width: 60px;
					aspect-ratio: 1/1;
					content: "";
					background: #ffdada;
					translate: -50% -50%;
					-webkit-mask-image: url('/tv/wonderful_precure/assets/images/common/i_pawpad.svg');
					        mask-image: url('/tv/wonderful_precure/assets/images/common/i_pawpad.svg');
					-webkit-mask-repeat: no-repeat;
					        mask-repeat: no-repeat;
					-webkit-mask-position: center;
					        mask-position: center;
					-webkit-mask-size: contain;
					        mask-size: contain;
				}
@media print, screen and (min-width: 1025px) {
.p-nav__category .p-nav__category-item .p-nav__category-link.is-current::before {
						top: calc(50% - 8px);
						width: 80px
				}
	}
.is-niko .p-nav__category .p-nav__category-item .p-nav__category-link.is-current::before {
						translate: -58% -50%;
					}
.p-nav__category .p-nav__category-item .p-nav__category-link .p-nav__category-img {
				height: 20px;
			}
@media print, screen and (min-width: 1025px) {
.p-nav__category .p-nav__category-item .p-nav__category-link .p-nav__category-img {
					height: 30px
			}
	}
/* ------------------------------
		キャラクター選択
------------------------------ */
.p-nav__character {
	display: flex;
	gap: 10px;
	align-items: center;
	justify-content: center;
	margin-top: 24px;
}
@media print, screen and (min-width: 1025px) {
.p-nav__character {
		gap: 20px;
		margin-top: 30px;
}
	}
.p-nav__character .p-nav__character-item .p-nav__character-link {
			display: block;
			max-width: 80px;
		}
@media print, screen and (min-width: 1025px) {
.p-nav__character .p-nav__character-item .p-nav__character-link {
				max-width: none;
		}
	}
.p-nav__character .p-nav__character-item .p-nav__character-link > * {
				display: block;
			}
.p-nav__character .p-nav__character-item .p-nav__character-link:focus-visible {
		animation: hoverOutBack 300ms var(--easeOutBack);
	}
@media (hover: hover) and (pointer: fine) {
		.p-nav__character .p-nav__character-item .p-nav__character-link:hover {
		animation: hoverOutBack 300ms var(--easeOutBack);
		}
	}
.p-nav__character .p-nav__character-item .p-nav__character-link.is-curewonderful .p-nav__character-img {
					background: #fdfedf;
					border-color: var(--colorCurewonderful);
				}
.p-nav__character .p-nav__character-item .p-nav__character-link.is-curewonderful .p-nav__character-name {
					color: var(--colorCurewonderful);
				}
.p-nav__character .p-nav__character-item .p-nav__character-link.is-curefriendly .p-nav__character-img {
					background: #fedeff;
					border-color: var(--colorCurefriendly);
				}
.p-nav__character .p-nav__character-item .p-nav__character-link.is-curefriendly .p-nav__character-name {
					color: var(--colorCurefriendly);
				}
.p-nav__character .p-nav__character-item .p-nav__character-link.is-curenyami .p-nav__character-img {
					background: var(--colorCurenyamiUiBg);
					border-color: var(--colorCurenyami);
				}
.p-nav__character .p-nav__character-item .p-nav__character-link.is-curenyami .p-nav__character-name {
					color: var(--colorCurenyami);
				}
.p-nav__character .p-nav__character-item .p-nav__character-link.is-curelillian .p-nav__character-img {
					background: var(--colorCurelillianUiBg);
					border-color: var(--colorCurelillian);
				}
.p-nav__character .p-nav__character-item .p-nav__character-link.is-curelillian .p-nav__character-name {
					color: var(--colorCurelillianText);
				}
.p-nav__character .p-nav__character-item .p-nav__character-link.is-garugaru .p-nav__character-img {
					background: #c4c3db;
					border-color: #3b365b;
				}
.p-nav__character .p-nav__character-item .p-nav__character-link.is-garugaru .p-nav__character-name {
					color: #3b365b;
				}
				
.p-nav__character .p-nav__character-item .p-nav__character-link.is-gaou .p-nav__character-img {
					background: #acb5c3;
					border-color: #08184e;
				}
.p-nav__character .p-nav__character-item .p-nav__character-link.is-gaou .p-nav__character-name {
					color: #08184e;;
				}


.p-nav__character .p-nav__character-item .p-nav__character-link.is-gaou2 .p-nav__character-img {
					background: #acb5c3;
					border-color: #08184e;
				}
.p-nav__character .p-nav__character-item .p-nav__character-link.is-gaou2 .p-nav__character-name {
					color: #08184e;;
				}

.p-nav__character .p-nav__character-item .p-nav__character-link.is-torame .p-nav__character-img {
					background: #e8e3ab;
					border-color: #735a04;
				}
.p-nav__character .p-nav__character-item .p-nav__character-link.is-torame .p-nav__character-name {
					color: #735a04;
				}

.p-nav__character .p-nav__character-item .p-nav__character-link.is-zakuro .p-nav__character-img {
					background: #e2c2c9;
					border-color: #95003c;
				}
.p-nav__character .p-nav__character-item .p-nav__character-link.is-zakuro .p-nav__character-name {
					color: #95003c;
				}

				
				
				
				
.p-nav__character .p-nav__character-item .p-nav__character-link .p-nav__character-img {
				box-sizing: border-box;
				margin-inline: auto;
				overflow: hidden;
				border: 2px solid transparent;
				border-radius: 50%;
			}
@media print, screen and (min-width: 1025px) {
.p-nav__character .p-nav__character-item .p-nav__character-link .p-nav__character-img {
					width: 90px;
			}
	}
.p-nav__character .p-nav__character-item .p-nav__character-link .p-nav__character-img img {
					border: 2px solid #fff;
					border-radius: 50%;
				}
.p-nav__character .p-nav__character-item .p-nav__character-link .p-nav__character-name {
				margin-top: 10px;
				font-size: 1.1rem;
				font-weight: bold;
				line-height: 1.25;
				text-align: center;
			}
@media print, screen and (min-width: 1025px) {
.p-nav__character .p-nav__character-item .p-nav__character-link .p-nav__character-name {
					margin-top: 6px;
					font-size: 1.4rem
			}
	}
/* ------------------------------
		キャラクター画面（上部）
------------------------------ */
.p-character {
	position: relative;
	z-index: var(--zIndexLv1);
	margin-top: 24px;
	--heightTablePc: 740;
	--heightTableSp: 1136;
}
@media print, screen and (min-width: 1025px) {
.p-character {
		margin-top: 56px
}
	}
.p-character__table {
	position: relative;
	z-index: var(--zIndexLv0);
	width: 100%;
	aspect-ratio: var(--widthSP)/var(--heightTableSp);
	background: var(--colorCharacterBg) url("/tv/wonderful_precure/assets/images/character/bg_heart_sp.webp") repeat-x bottom center / contain;
	translate: 0% 0%;
}
@media print, screen and (min-width: 1025px) {
.p-character__table {
		aspect-ratio: var(--widthPC)/var(--heightTablePc);
		background: var(--colorCharacterBg) url("/tv/wonderful_precure/assets/images/character/bg_heart.webp") repeat-x bottom center / contain;
}
	}
/* 上側の幕 */
.p-character__table::before {
		position: absolute;
		top: 0%;
		left: 50%;
		z-index: var(--zIndexLv3);
		display: block;
		width: 100%;
		height: calc(108 / var(--heightTableSp) * 100%);
		content: "";
		background: var(--imgCharacterCurtain) repeat-x top center / contain;
		translate: -50% 0%;
	}
@media print, screen and (min-width: 1025px) {
.p-character__table::before {
			height: calc(84 / var(--heightTablePc) * 100%)
	}
	}
	
	
	
/* 下側のレース */
.p-character__table::after {
		position: absolute;
		bottom: 0%;
		left: 50%;
		z-index: var(--zIndexLv1);
		display: block;
		width: 100%;
		height: calc(50 / var(--heightTableSp) * 100%);
		content: "";
		background: url("/tv/wonderful_precure/assets/images/common/p_lace.webp") repeat-x top center / contain;
		translate: -50% 0%;
	}
@media print, screen and (min-width: 1025px) {
.p-character__table::after {
			height: calc(50 / var(--heightTablePc) * 100%)
	}
	}
	
.p-character__table .p-character__table-inner {
		position: relative;
		width: 100%;
		height: 100%;
		overflow: hidden;
	}
	
	
	
	
	
	
	
	
	/* ガオウ背景 */
	.g-character__table {
	position: relative;
	z-index: var(--zIndexLv0);
	width: 100%;
	aspect-ratio: var(--widthSP)/var(--heightTableSp);
	background: var(--colorCharacterBg) url("/tv/wonderful_precure/assets/images/character/bg_jag2_sp.png") no-repeat center 30% / 100%;
}
@media print, screen and (min-width: 1025px) {
.g-character__table {
		aspect-ratio: var(--widthPC)/var(--heightTablePc);
		background: var(--colorCharacterBg) url("/tv/wonderful_precure/assets/images/character/bg_jag2.png") no-repeat center 25% / 100% ;
}
	}
/* 上側の幕 */
.g-character__table::before {
		position: absolute;
		top: 0%;
		left: 50%;
		z-index: var(--zIndexLv3);
		display: block;
		width: 100%;
		height: calc(108 / var(--heightTableSp) * 100%);
		content: "";
		background: var(--imgCharacterCurtain) repeat-x top center / contain;
		translate: -50% 0%;
	}
@media print, screen and (min-width: 1025px) {
.g-character__table::before {
			height: calc(84 / var(--heightTablePc) * 100%)
	}
	}
	
	
	
/* 下側のレース */
.g-character__table::after {
		position: absolute;
		bottom: 0%;
		left: 50%;
		z-index: var(--zIndexLv1);
		display: block;
		width: 100%;
		height: calc(50 / var(--heightTableSp) * 100%);
		content: "";

		translate: -50% 0%;
	}
@media print, screen and (min-width: 1025px) {
.g-character__table::after {
			height: calc(50 / var(--heightTablePc) * 100%)
	}
	}
	
.g-character__table .p-character__table-inner {
		position: relative;
		width: 100%;
		height: 100%;
		overflow: hidden;
	}
	
	
	
	
	
	
	
	
	
.p-table {
	position: absolute;
	bottom: calc(150 / var(--heightTableSp) * 100%);
	left: 50%;
	width: calc(690 / var(--widthSP) * 100%);
	aspect-ratio: 1/1;
	background: var(--colorCharacterTableBg);
	border: 20px solid var(--colorCharacterTableBorder);
	border-radius: 50%;
	transform-origin: center bottom;
	scale: 1 calc(128 / 880 * 100%);
	translate: -50% 0;
}
@media print, screen and (min-width: 1025px) {
.p-table {
		bottom: calc(40 / var(--heightTablePc) * 100%);
		width: calc(800 / var(--widthPC) * 100%)
}
	}
.p-style {
	position: absolute;
	z-index: var(--zIndexLv3);
}
@media screen and (max-width: 1024px) {
.p-style {
		top: calc(40 / var(--heightTableSp) * 100%);
		left: 50%;
		width: calc(690 / var(--widthSP) * 100%);
		translate: -50% 0;
}
	}
@media print, screen and (min-width: 1025px) {
.p-style {
		top: calc(120 / var(--heightTablePc) * 100%);
		right: calc(200 / var(--widthPC) * 100%);
}
	}
.p-style .p-style__list {
		display: grid;
		grid-template-columns: repeat(3, 1fr);
		gap: 20px calc(30 / var(--widthSP) * 100vw);
	}
@media print, screen and (min-width: 1025px) {
.p-style .p-style__list {
			grid-template-columns: repeat(1, 1fr);
			gap: 20px 30px;
	}
	}
.p-style .p-style__list .p-style__list-item:not(:first-child) .p-style__item .p-style__item-icon span {
							position: absolute;
							bottom: 50%;
							left: 50%;
							z-index: -1;
							width: 2px;
							height: 60px;
							background: var(--colorCharacter);
							translate: -50% 0%;
						}
.p-style .p-style__item {
		padding: 0;
		background: none;
		border: none;
	}
@media print, screen and (min-width: 1025px) {
.p-style .p-style__item {
			display: flex;
			gap: 30px;
			align-items: center;
	}
	}
@media print, screen and (min-width: 1025px) {
					.p-style .p-style__item.is-active .p-style__item-icon::before {
						transition: scale 300ms var(--easeOutBack);
						scale: 1;
					}

					.p-style .p-style__item.is-active .p-style__item-icon::after {
						width: 36px;
						background: var(--colorCharacter);
						transition: width 300ms var(--easeOutBack);
					}
	}
.p-style .p-style__item.is-active .p-style__item-img .is-off {
					display: none;
				}
.p-style .p-style__item.is-active .p-style__item-img .is-on {
					display: block;
				}
@media print, screen and (min-width: 1025px) {
.p-style .p-style__item.is-active .p-style__item-img{
					opacity: 1;
	}
	}
.p-style .p-style__item .p-style__item-icon {
			display: none;
		}
@media print, screen and (min-width: 1025px) {
.p-style .p-style__item .p-style__item-icon {
				position: relative;
				display: block;
				width: 16px;
				aspect-ratio: 1/1
		}

				.p-style .p-style__item .p-style__item-icon::before {
					position: absolute;
					top: 50%;
					left: 50%;
					z-index: 2;
					display: block;
					width: 16px;
					aspect-ratio: 1/1;
					content: "";
					background: #fff;
					transition: scale 100ms ease-out;
					scale: 0;
					translate: -50% -50%;
					-webkit-mask-image: url('/tv/wonderful_precure/assets/images/common/i_pawpad.svg');
					        mask-image: url('/tv/wonderful_precure/assets/images/common/i_pawpad.svg');
					-webkit-mask-repeat: no-repeat;
					        mask-repeat: no-repeat;
					-webkit-mask-position: center;
					        mask-position: center;
					-webkit-mask-size: contain;
					        mask-size: contain;
				}

				.p-style .p-style__item .p-style__item-icon::after {
					position: absolute;
					top: 50%;
					left: 50%;
					z-index: 1;
					display: block;
					width: 100%;
					aspect-ratio: 1/1;
					content: "";
					background: var(--colorCharacterUiBg);
					border: 3px solid #fff;
					border-radius: 50%;
					box-shadow: 0 0 0 3px var(--colorCharacter);
					transition: width 100ms ease-out;
					translate: -50% -50%;
				}
	}
.p-style .p-style__item .p-style__item-img {
			width: 106px;
			transition: opacity 100ms ease-out;
		}
@media print, screen and (min-width: 1025px) {
.p-style .p-style__item .p-style__item-img {
				opacity: .5;
		}
	}
.p-style .p-style__item .p-style__item-img .is-on {
				display: none;
			}
.p-curtain {
	position: absolute;
	top: calc(50 / var(--widthSP) * 100%);
	left: 0;
	z-index: var(--zIndexLv1);
	display: block;
	width: calc(156 / var(--widthSP) * 100%);
	aspect-ratio: 156 / 934;
	pointer-events: none;
}
@media print, screen and (min-width: 1025px) {
.p-curtain {
		top: 0;
		z-index: var(--zIndexLv2);
		width: calc(250 / var(--widthPC) * 100%);
		aspect-ratio: 250 / 850;
}
	}
.p-curtain img {
		width: 100%;
	}
.p-curtain + .p-curtain {
		left: 100%;
		scale: -1 1;
		translate: -100% 0;
	}
.p-stage {
	position: absolute;
	bottom: calc(176 / var(--heightTableSp) * 100%);
	left: 50%;
	z-index: var(--zIndexLv1);
	width: 100%;
	height: calc(720 / var(--heightTableSp) * 100%);
	translate: -50% 0%;
}
@media print, screen and (min-width: 1025px) {
.p-stage {
		bottom: calc(50 / var(--heightTablePc) * 100%);
		width: calc(800 / var(--widthPC) * 100vw);
		height: calc(570 / var(--heightTablePc) * 100%);
}
	}
.p-stage .p-stage__inner {
		position: relative;
		width: 100%;
		height: 100%;
	}
.p-stage__item {
	position: absolute;
	bottom: 0;
	left: 0%;
	z-index: 1;
	width: 100%;
	height: 100%;
}
.p-stage__item.is-current .p-characterform__style {
			transition: scale 400ms var(--easeOutBack), opacity 200ms ease-out;
			transition-delay: 100ms;
			scale: 1;
		}
.p-stage__item.is-current .p-characterform__style .p-characterform__style-img {
				opacity: 1;
			}
.p-stage__item.is-current .p-characterform__style .p-characterform__style-catch {
				opacity: 1;
			}
.p-stage__item.is-current .p-characterform__style .p-characterform__style-shadow {
				opacity: 0;
			}
.p-stage__item .p-characterform__inner {
		position: relative;
		width: 100%;
		height: 100%;
	}
.p-stage__item .p-characterform__style {
		position: absolute;
		bottom: 0;
		left: 0;
		width: 100%;
		height: 100%;
		opacity: 0;
		transition: scale 400ms ease-out, opacity 200ms ease-out;
		transform-origin: bottom;
		scale: 0.5;
	}
.p-stage__item .p-characterform__style.is-active {
			opacity: 1;
		}
.p-stage__item .p-characterform__style .p-characterform__style-catch {
			position: absolute;
			left: 0;
			z-index: var(--zIndexLv2);
			width: 100%;
			opacity: 0;
			transition: opacity 200ms ease-out;
		}
.p-stage__item .p-characterform__style .p-characterform__style-catch img {
				width: 100%;
			}
.p-stage__item .p-characterform__style .p-characterform__style-img {
			position: absolute;
			left: 0;
			z-index: var(--zIndexLv1);
			width: 100%;
			opacity: 0;
			transition: opacity 200ms ease-out;
		}
.p-stage__item .p-characterform__style .p-characterform__style-img img {
				width: 100%;
			}
.p-stage__item .p-characterform__style .p-characterform__style-shadow {
			position: absolute;
			left: 0;
			width: 100%;
			opacity: 1;
			transition: opacity 200ms ease-out;
		}
.p-stage__item .p-characterform__style .p-characterform__style-shadow img {
				width: 100%;
			}
.p-pagenation {
	position: absolute;
	bottom: calc(64 / var(--heightTableSp) * 100%);
	left: 50%;
	z-index: var(--zIndexLv2);
	translate: -50% 0;
}
@media print, screen and (min-width: 1025px) {
.p-pagenation {
		bottom: calc(84 / var(--heightTablePc) * 100%);
		left: calc(200 / var(--widthPC) * 100%);
		translate: 0 0;
}
	}
.p-pagenation .p-pagenation-bullets {
		display: flex;
		gap: calc(24 / var(--widthSP) * 100vw);
		align-items: center;
	}
@media print, screen and (min-width: 1025px) {
.p-pagenation .p-pagenation-bullets {
			gap: calc(16 / var(--widthPC) * 100vw);
	}
	}
.p-pagenation .p-pagenation-bullets .swiper-pagination-bullet {
			position: relative;
			display: block;
			width: calc(100 / var(--widthSP) * 100vw);
			height: initial;
			aspect-ratio: 1/1;
			padding: 0 !important;
			margin: 0 !important;
			overflow: hidden;
			background: var(--colorCharacterUiBg);
			border: 2px solid var(--white);
			box-shadow: 0 0 0 2px var(--colorCharacter);
			opacity: 1;
		}
.p-pagenation .p-pagenation-bullets .swiper-pagination-bullet:focus-visible {
		animation: hoverOutBack 300ms var(--easeOutBack);
	}
@media (hover: hover) and (pointer: fine) {
		.p-pagenation .p-pagenation-bullets .swiper-pagination-bullet:hover {
		animation: hoverOutBack 300ms var(--easeOutBack);
		}
	}
@media print, screen and (min-width: 1025px) {
.p-pagenation .p-pagenation-bullets .swiper-pagination-bullet {
				width: calc(56 / var(--widthPC) * 100vw);
		}
	}
.p-pagenation .p-pagenation-bullets .swiper-pagination-bullet.swiper-pagination-bullet-active::after {
					opacity: .5;
				}
.p-pagenation .p-pagenation-bullets .swiper-pagination-bullet::after {
				position: absolute;
				top: 50%;
				left: 50%;
				z-index: 1;
				display: block;
				width: 100%;
				height: 100%;
				content: "";
				translate: -50% -50%;
			}
.p-character__navi {
	position: absolute;
	top: 0;
	left: 0;
	z-index: var(--zIndexLv2);
	width: 100%;
	height: 100%;
	padding-inline: 16px;
	pointer-events: none;
}
@media print, screen and (min-width: 1025px) {
.p-character__navi {
		padding-inline: 0px;
}
	}
.p-character__navi .p-character__navi-inner {
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 100%;
		height: 100%;
		margin-inline: auto;
	}
@media print, screen and (min-width: 1025px) {
.p-character__navi .p-character__navi-inner {
			max-width: calc(1040 / var(--widthPC) * 100%)
	}
	}
.p-character__navi .p-character__navi-item {
		width: 24px;
		aspect-ratio: 1/1;
		pointer-events: visible;
		cursor: pointer;
		filter: drop-shadow(0px 0px 16px rgba(244, 108, 168, 0.35));
		filter: drop-shadow(0px 0px 6px rgba(244, 108, 168, 1)) drop-shadow(0px 0px 6px rgba(244, 108, 168, 1));
		border-top: 6px solid var(--white);
		border-left: 6px solid var(--white);
		border-radius: 4px;
		rotate: -45deg;
	}
@media print, screen and (min-width: 1025px) {
.p-character__navi .p-character__navi-item {
			top: 50%;
			width: calc(60 / var(--widthPC) * 100vw);
			background: url("/tv/wonderful_precure/assets/images/common/b_arrow.webp") no-repeat center center / contain;
			filter: drop-shadow(0px 0px 16px rgba(244, 108, 168, 0.35));
			border: none;
			rotate: 0deg;
	}
	}
.p-character__navi .p-character__navi-item:focus-visible {
		animation: hoverPush 340ms linear;
	}
@media (hover: hover) and (pointer: fine) {
		.p-character__navi .p-character__navi-item:hover {
		animation: hoverPush 340ms linear;
		}
	}
.p-character__navi .p-character__navi-item:nth-child(2) {
			rotate: 135deg;
		}
@media print, screen and (min-width: 1025px) {
.p-character__navi .p-character__navi-item:nth-child(2) {
				rotate: 0deg;
				scale: -1 1
		}
	}
/* ------------------------------
		キャラクター画面（下部）
------------------------------ */
.p-character__content {
	position: relative;
	z-index: var(--zIndexLv5);
	margin-top: -18px;
}
@media print, screen and (min-width: 1025px) {
.p-character__content {
		margin-top: -40px;
}
	}
.p-character__content .p-character__content-inner {}
.p-character__content .p-character__content-swiper {
		overflow: hidden;
	}
.p-character__content .p-character__name {
		text-align: center;
	}
.p-character__content .p-character__name img {
			display: block;
			height: 50px;
			margin-inline: auto;
		}
@media print, screen and (min-width: 1025px) {
.p-character__content .p-character__name img {
				height: 72px
		}
	}
	
.p-character__content .p-character__name img.ribon-style {
			display: block;
			height: 70px;
			margin-inline: auto;
		}
@media print, screen and (min-width: 1025px) {
.p-character__content .p-character__name img.ribon-style {
				height: 98px
		}
	}
	
.p-character__content .p-character__cv {
		margin-top: 12px;
		font-size: 1.8rem;
		font-weight: bold;
		color: var(--colorCharacter);
		text-align: center;
	}
@media print, screen and (min-width: 1025px) {
.p-character__content .p-character__cv {
			margin-top: 40px;
			font-size: 3rem;
	}
	}
.p-character__content .p-character__cv .p-character__cv-kana {
			font-size: 1.2rem;
		}
@media print, screen and (min-width: 1025px) {
.p-character__content .p-character__cv .p-character__cv-kana {
				font-size: 1.8rem
		}
	}
.p-character__content .p-character__desc {
		margin-top: 24px;
	}
@media print, screen and (min-width: 1025px) {
.p-character__content .p-character__desc {
			margin-top: 40px;
	}
	}
.p-character__content .p-character__desc .p-character__desc-text.is-birthday {
				color: var(--colorCharacter);
			}
.p-character__content .p-character__desc .p-character__desc-text + .p-character__desc-text {
				margin-top: 1.5em;
			}
/* ------------------------------
		アイテム
------------------------------ */
.p-item {
	margin-top: 40px;
}
@media print, screen and (min-width: 1025px) {
.p-item {
		margin-top: 20px;
}
	}
.p-item .p-item__inner {}
.p-item .p-item__title {}
.p-item .p-item__modal {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		gap: 20px;
		margin-top: 24px;
	}
@media print, screen and (min-width: 1025px) {
.p-item .p-item__modal {
			grid-template-columns: repeat(4, 1fr);
			margin-top: 64px;
	}
	}
.p-item .p-item__modal.is-people {
			grid-template-columns: repeat(3, 1fr);
			gap: 30px 10px;
		}
@media print, screen and (min-width: 1025px) {
.p-item .p-item__modal.is-people {
				grid-template-columns: repeat(4, 1fr);
				gap: 56px 20px
		}
	}
.p-modal {
	position: relative;
	display: grid;
	grid-template-rows: subgrid;
	grid-row: span 2;
	row-gap: 0;
	padding: 10px;
	cursor: pointer;
	background: var(--white);
	border: 3px solid #e9569a;
	border-radius: 10px;
	box-shadow: 0px 0px 10px 0px rgba(244, 108, 169, 0.15);
}
@media print, screen and (min-width: 1025px) {
.p-modal {
		padding: 16px;
		border-width: 4px;
		box-shadow: 0px 0px 20px 0px rgba(244, 108, 169, 0.15);
}
	}
.p-modal:focus-visible .p-modal__img {
			animation: hoverPush 340ms linear;
		}
@media (hover: hover) and (pointer: fine) {
		.p-modal:hover .p-modal__img {
			animation: hoverPush 340ms linear;
		}
	}
.p-modal::after {
		position: absolute;
		top: 10px;
		right: 10px;
		z-index: 1;
		display: block;
		width: 26px;
		aspect-ratio: 50/46;
		content: "";
		background: url("/tv/wonderful_precure/assets/images/character/i_modal_open.webp") no-repeat center center / contain;
	}
@media print, screen and (min-width: 1025px) {
.p-modal::after {
			width: 32px
	}
	}
.p-modal .p-modal__img {
		display: block;
		width: 100%;
	}
.p-modal .p-modal__title {
		display: grid;
		place-items: center;
		height: 100%;
	}
.p-modal .p-modal__title .p-modal__title-text {
			width: -moz-fit-content;
			width: fit-content;
			font-weight: bold;
			line-height: 1.5;
			color: #000;
		}
@media print, screen and (min-width: 1025px) {
.p-modal .p-modal__title .p-modal__title-text {
				line-height: 2
		}
	}
.p-dialog {
	width: 100%;
	height: 100%;
	padding: 0;
	overflow: visible;
	background: none;
	border: none;
}
.p-dialog::backdrop {
		background: #3b3d48;
		opacity: .5;
	}
.p-dialog .p-dialog__inner {
		width: 100%;
		height: 100%;
		max-height: calc(100vh - 20px);
		padding-inline: 10px;
		margin-inline: auto;
		overflow-y: scroll;
	}
@media print, screen and (min-width: 1025px) {
.p-dialog .p-dialog__inner {
			max-height: calc(100vh - 40px);
			padding-inline: 40px;
			margin-inline: -40px;
	}
	}
.p-dialog .p-dialog__inner::-webkit-scrollbar {
			display: none;
		}
.p-dialog .p-dialog__content {
		position: relative;
		z-index: var(--zIndexLv1);
		padding: 10px;
		overflow: visible;
		background: var(--white);
		border: 1px solid #e9569a;
		border-radius: 10px;
	}
@media print, screen and (min-width: 1025px) {
.p-dialog .p-dialog__content {
			min-height: 400px;
			padding-block: 24px;
			padding-inline: 48px;
			border-width: 4px;
	}
	}
@media print, screen and (min-width: 1025px) {
.p-dialog .p-dialog__content .p-dialog__item .p-dialog__item-inner {
					display: grid;
					grid-template-columns: repeat(2, 1fr);
					gap: 20px
			}
	}
.p-dialog .p-dialog__content .p-dialog__content-nav {
			position: absolute;
			top: 50%;
			z-index: var(--zIndexLv1);
			width: 24px;
			aspect-ratio: 1/1;
			padding: 0;
			cursor: pointer;
			background: none;
			filter: drop-shadow(0px 0px 6px rgba(244, 108, 168, 1)) drop-shadow(0px 0px 6px rgba(244, 108, 168, 1));
			border: none;
			border-top: 6px solid var(--white);
			border-left: 6px solid var(--white);
			border-radius: 4px;
			rotate: -45deg;
			translate: 0 -50%;
		}
@media print, screen and (min-width: 1025px) {
.p-dialog .p-dialog__content .p-dialog__content-nav {
				top: 50%;
				width: 60px;
				background: url("/tv/wonderful_precure/assets/images/common/b_arrow.webp") no-repeat center center / contain;
				filter: drop-shadow(0px 0px 16px rgba(244, 108, 168, 0.35));
				border: none;
				rotate: 0deg;
		}
	}
.p-dialog .p-dialog__content .p-dialog__content-nav:focus-visible {
		animation: hoverPush 340ms linear;
	}
@media (hover: hover) and (pointer: fine) {
		.p-dialog .p-dialog__content .p-dialog__content-nav:hover {
		animation: hoverPush 340ms linear;
		}
	}
.p-dialog .p-dialog__content .p-dialog__content-nav:nth-child(1) {
				left: 0;
			}
@media print, screen and (min-width: 1025px) {
.p-dialog .p-dialog__content .p-dialog__content-nav:nth-child(1) {
					translate: -50% -50%
			}
	}
.p-dialog .p-dialog__content .p-dialog__content-nav:nth-child(2) {
				right: 0;
				rotate: 135deg;
			}
@media print, screen and (min-width: 1025px) {
.p-dialog .p-dialog__content .p-dialog__content-nav:nth-child(2) {
					rotate: 0deg;
					scale: -1 1;
					translate: 50% -50%
			}
	}
.p-dialog .p-dialog__img {
		width: 100%;
	}
.p-dialog .p-dialog__img img {
			display: block;
			width: 100%;
		}
.p-dialog .p-dialog__desc {
		display: flex;
		flex-direction: column;
		gap: 20px;
		justify-content: center;
	}
.p-dialog .p-dialog__desc .p-dialog__title {
			position: relative;
			padding-bottom: 30px;
			font-size: 1.8rem;
			font-weight: bold;
			line-height: 1.5;
		}
@media print, screen and (min-width: 1025px) {
.p-dialog .p-dialog__desc .p-dialog__title {
				padding-bottom: 60px;
				font-size: 2.4rem;
		}
	}
.p-dialog .p-dialog__desc .p-dialog__title::after {
				position: absolute;
				bottom: 0%;
				left: 50%;
				z-index: 1;
				display: block;
				width: 100%;
				height: 18px;
				content: "";
				background: url("/tv/wonderful_precure/assets/images/common/bg_heart_border.webp") repeat-x top left / contain;
				translate: -50% 0%;
			}
.p-dialog .p-dialog__desc .p-dialog__title .p-dialog__title-cv {
				display: block;
				margin-top: 1em;
				font-size: 1.4rem;
			}
@media print, screen and (min-width: 1025px) {
.p-dialog .p-dialog__desc .p-dialog__title .p-dialog__title-cv {
					font-size: 1.6rem
			}
	}
.p-dialog .p-dialog__desc .p-dialog__explain {
			line-height: 1.75;
		}
.p-dialog .p-dialog__close {
		display: block;
		max-width: 230px;
		padding: 0;
		margin-inline: auto;
		margin-top: 28px;
		text-align: center;
		background: none;
		border: none;
	}
@media print, screen and (min-width: 1025px) {
.p-dialog .p-dialog__close {
			max-width: none;
	}
	}
.p-dialog .p-dialog__close:focus-visible {
		animation: hoverPush 340ms linear;
	}
@media (hover: hover) and (pointer: fine) {
		.p-dialog .p-dialog__close:hover {
		animation: hoverPush 340ms linear;
		}
	}
/* スクロールロック */
body:has(dialog:modal) {
	overflow: hidden;
	overscroll-behavior: none;
	touch-action: none;
	-webkit-overflow-scrolling: none;
}
/* ------------------------------
		へんしんシーン
------------------------------ */
.p-movie {
	margin-top: 42px;
}
@media print, screen and (min-width: 1025px) {
.p-movie {
		margin-top: 50px;
}
	}
.p-movie .p-movie__inner {}
.p-movie .p-movie__title {}
.p-movie .p-movie__content {
		margin-top: 40px;
	}
@media print, screen and (min-width: 1025px) {
.p-movie .p-movie__content {
			margin-top: 80px
	}
	}
.u-henshin {
	position: relative;
	display: flex;
	align-items: center;
	justify-content: center;
	max-height: 500px;
	overflow: hidden;
}
.u-henshin::after {
		position: absolute;
		top: 50%;
		left: 50%;
		z-index: 1;
		display: block;
		width: 40px;
		aspect-ratio: 1/1;
		pointer-events: none;
		content: "";
		background: url("/tv/wonderful_precure/assets/images/common/i_play.webp") no-repeat center center / contain;
		border-radius: 50%;
		translate: -50% -50%;
	}
@media print, screen and (min-width: 1025px) {
.u-henshin::after {
			width: 80px
	}
	}
.u-henshin .u-henshin__btn {
		width: 100%;
		padding: 0;
		background: none;
		border: none;
	}
.u-henshin .u-henshin__btn:focus-visible img {
				transition: scale 200ms var(--easeOutBack);
				scale: 1.1;
			}
@media (hover: hover) and (pointer: fine) {
			.u-henshin .u-henshin__btn:hover img {
				transition: scale 200ms var(--easeOutBack);
				scale: 1.1;
			}
	}
.u-henshin .u-henshin__btn iframe {
			width: 100%;
			aspect-ratio: 16/9;
			pointer-events: none;
		}
/* ------------------------------
		people
------------------------------ */
.p-people {
	position: relative;
	display: grid;
	row-gap: 12px;
	cursor: pointer;
}
.p-people:focus-visible .p-people__img {
			animation: hoverOutBack 300ms var(--easeOutBack);
		}
@media (hover: hover) and (pointer: fine) {
		.p-people:hover .p-people__img {
			animation: hoverOutBack 300ms var(--easeOutBack);
		}
	}
.p-people .p-people__img {
		display: block;
		width: 100%;
	}
.p-people .p-people__title {
		display: block;
	}
.p-people .p-people__title > * {
			display: block;
			margin-inline: auto;
			text-align: center;
		}
.p-people .p-people__title .p-people__title-text {
			width: -moz-fit-content;
			width: fit-content;
			font-weight: bold;
			color: var(--txtColor);
		}
@media print, screen and (min-width: 1025px) {
.p-people .p-people__title .p-people__title-text {
				font-size: 2.4rem
		}
	}
.p-people .p-people__title .p-people__title-cv {
			margin-top: 6px;
			line-height: 1;
			color: var(--txtColor);
		}