@charset "utf-8";

/* __________ インフォメーション __________ */
.onair-image {
	--col-start: 3;
	margin-top: calc(96 * var(--px));
}
.topics-list {
	--col-start: 1;
	margin-top: calc(96 * var(--px));
	font-size: calc(32 * var(--px));
}
@media (min-width: 960px) {
	.onair-image {
		--col-start: 9;
		margin-top: calc(112 * var(--px));
	}
	.topics-list {
		--col-start: 5;
		margin-top: calc(112 * var(--px));
	}
	.topics-list:not(.is-overflow) .splide__list {
		justify-content: center;
	}
	.topics-list:not(.is-overflow) .splide__slide:last-child {
		margin: 0 !important;
	}
}
/* ムービー */
.movie-content {
	--col-start: 1;
	margin-top: calc(128 * var(--px));
}
.movie-item {
	position: relative;
	width: 100%;
	height: 40vw;
	display: flex;
	align-items: center;
	overflow: hidden;
}
.iframe-player {
	width: 100%;
	aspect-ratio: 16 / 9;
	pointer-events: none;
}
@media (min-width: 960px) {
	.movie-content {
		margin-top: calc(192 * var(--px));
	}
	.movie-item {
		height: 32vw;
	}
}
.movie-play-icon {
	position: absolute;
	inset: 0;
	margin: auto;
	font-size: calc(192 * var(--px));
}
.movie-play-icon .svg-play {
	overflow: visible;
}
.path-play-movie {
	fill: var(--color-white);
}
.path-play-outer,
.path-play-inner,
.path-play-arrow {
	fill: var(--color-white);
	transform: scale(1);
	transform-origin: center;
	transition: var(--duration-500) var(--ease-out-back);
}
.path-play-outer {
	fill: var(--color-white);
}
.path-play-inner {
	fill: var(--color-denki-black);
}
.path-play-arrow {
	fill: var(--color-yellow);
}
@media (any-hover: hover) {
	.movie-item:hover .path-play-outer {
		transform: scale(1.36);
	}
	.movie-item:hover .path-play-inner {
		transform: scale(1.1);
	}
	.movie-item:hover .path-play-arrow {
		transform: scale(1.1);
	}
}


/* __________ ニュース __________ */
.news-list {
	display: grid;
	row-gap: calc(32 * var(--px));
}
.link-news {
	--columns: 12;
	column-gap: calc(16 * var(--px));
	background-color: var(--color-denki-black);
}
.news-date {
	--col-start: 1;
	--col-end: calc(var(--col-start) + 2);
	display: grid;
	align-items: center;
	justify-items: center;
	height: 100%;
	padding-block: calc(24 * var(--px));
	color: var(--color-red);
	font-family: var(--font-oswald);
	font-weight: 700;
}
.date-yyyy {
	display: flex;
	justify-content: space-between;
	margin-block-start: var(--leading-trim);
	margin-block-end: -.25em;
	padding-inline: .25em;
	font-size: calc(20 * var(--px));
}
.date-md {
	margin-block: var(--leading-trim);
	font-size: calc(48 * var(--px));
}
.link-news .card-text {
	--col-start: 3;
	--col-end: var(--columns);
	padding-block: calc(16 * var(--px));
	font-size: calc(28 * var(--px));
	font-weight: 500;
	line-height: var(--leading-l);
}
.link-news .card-icon {
	height: 100%;
	font-size: calc(24 * var(--px));
}
@media (min-width: 960px) {
	.news-list {
		row-gap: calc(16 * var(--px));
	}
	.link-news {
		--columns: 10;
	}
	.news-date {
		--col-end: calc(var(--col-start) + 1);
	}
	.link-news .card-text {
		--col-start: 2;
		font-size: calc(24 * var(--px));
	}
	.link-news .card-icon {
		height: auto;
		font-size: calc(28 * var(--px));
	}
}


/* __________ イントロダクション・ストーリー __________ */
/* 共通 */
.text-line {
	margin-block: var(--leading-trim);
}
.text-line:lang(en) {
	line-height: var(--leading-xl);
}
.color.-white {
	color: var(--color-white);
}
.color.-yellow {
	color: var(--color-yellow);
}
.color.-red {
	color: var(--color-red);
}
.excl.-start {
	margin-inline-start: -.25em;
}
.excl.-end {
	margin-inline-end: -.25em;
}
.inc.-start {
	margin-inline-start: .25em;
}
.inc.-end {
	margin-inline-end: .25em;
}
.dash-1,
.dash-2 {
	display: inline grid;
	position: relative;
	height: .75em;
	margin-inline: .2em;
}
.dash-1 {
	width: 1em;
}
.dash-2 {
	width: 2em;
}
.dash-1:after,
.dash-2:after {
	content: "";
	position: absolute;
	top: 0;
	bottom: 0;
	width: 100%;
	height: .08em;
	margin: auto;
	background-color: currentColor;
}
/* パララックス */
.parallax {
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
}
/* イントロダクション */
.intro-01 {
	font-size: calc(48 * var(--px));
	font-weight: 700;
}
.intro-02 {
	margin-top: calc(96 * var(--px));
	font-size: calc(28 * var(--px));
	font-weight: 500;
}
.intro-03 {
	margin-top: calc(96 * var(--px));
	font-size: calc(28 * var(--px));
	font-weight: 500;
}
.intro-separate {
	width: 100%;
	margin-top: calc(96 * var(--px));
	aspect-ratio: 1120 / 360;
	overflow: hidden;
}
.intro-bg {
	position: relative;
	width: 100vw;
	margin-left: calc((50vw - 50%) * -1);
	margin-top: calc(160 * var(--px));
	aspect-ratio: 1920 / 600;
}
.intro-text {
	display: grid;
}
.intro-01 .intro-text {
	row-gap: calc(32 * var(--px));
}
.intro-02 .intro-text,
.intro-03 .intro-text {
	row-gap: calc(36 * var(--px));
}
@media (min-width: 960px) {
	.body-content.grid .intro-content {
		--col-start: 8;
	}
}
/* ストーリー */
.story-01 {
	font-size: calc(28 * var(--px));
	font-weight: 500;
}
.story-02 {
	margin-top: calc(96 * var(--px));
	font-size: calc(28 * var(--px));
	font-weight: 500;
}
.story-03 {
	margin-top: calc(96 * var(--px));
	font-size: calc(28 * var(--px));
	font-weight: 500;
}
.story-04 {
	margin-top: calc(96 * var(--px));
	font-size: calc(48 * var(--px));
	font-weight: 700;
}
.story-05 {
	margin-top: calc(64 * var(--px));
	font-size: calc(48 * var(--px));
	font-weight: 800;
}
.story-text {
	display: grid;
}
.story-01 .story-text,
.story-02 .story-text,
.story-03 .story-text {
	row-gap: calc(36 * var(--px));
}
.story-04 .story-text {
	row-gap: calc(32 * var(--px));
}
@media (min-width: 960px) {
	.body-content.grid .story-content {
		--col-start: 8;
	}
}