@charset "utf-8";
/*! destyle.css v4.0.1 | MIT License | https://github.com/nicolas-cusan/destyle.min.css */
*,::before,::after{box-sizing:border-box;}body{margin:0}main{display:block}p,table,blockquote,address,pre,iframe,form,figure,dl{margin:0}h1,h2,h3,h4,h5,h6{font-size:inherit;font-weight:inherit;margin:0}ul,ol{margin:0;padding:0;list-style:none}dt{font-weight:700}dd{margin-left:0}hr{box-sizing:content-box;height:0;overflow:visible;border-top-width:1px;margin:0;clear:both;color:inherit}pre{font-family:monospace,monospace;font-size:inherit}address{font-style:inherit}abbr[title]{text-decoration:underline dotted}b,strong{font-weight:bolder}code,kbd,samp{font-family:monospace,monospace;font-size:inherit}small{font-size:80%}sub,sup{font-size:75%;line-height:0;position:relative;vertical-align:baseline}sub{bottom:-.25em}sup{top:-.5em}svg,img,embed,object,iframe{vertical-align:bottom}button,input,optgroup,select,textarea{-webkit-appearance:none;appearance:none;vertical-align:middle;color:inherit;font:inherit;background:transparent;padding:0;margin:0;border-radius:0;text-align:inherit;text-transform:inherit}button,[type="button"],[type="reset"],[type="submit"]{cursor:pointer}button:disabled,[type="button"]:disabled,[type="reset"]:disabled,[type="submit"]:disabled{cursor:default}:-moz-focusring{outline:auto}select:disabled{opacity:inherit}option{padding:0}fieldset{margin:0;padding:0;min-width:0}legend{padding:0}progress{vertical-align:baseline}textarea{overflow:auto}[type="number"]::-webkit-inner-spin-button,[type="number"]::-webkit-outer-spin-button{height:auto}[type="search"]{outline-offset:-2px}[type="search"]::-webkit-search-decoration{-webkit-appearance:none}::-webkit-file-upload-button{-webkit-appearance:button;font:inherit}[type="number"]{-moz-appearance:textfield}label[for]{cursor:pointer}details{display:block}summary{display:list-item}[contenteditable]:focus{outline:auto}table{border-color:inherit;border-collapse:collapse}caption{text-align:left}td,th{vertical-align:top;padding:0}th{text-align:left;font-weight:700}

:root {
	/* Default Setting */
	/* Color */
	--color-white: #ffffff;
	--color-white-alpha10: rgb(255, 255, 255, 0.1);
	--color-white-alpha20: rgb(255, 255, 255, 0.2);
	--color-white-alpha30: rgb(255, 255, 255, 0.3);
	--color-white-alpha40: rgb(255, 255, 255, 0.4);
	--color-white-alpha50: rgb(255, 255, 255, 0.5);
	--color-white-alpha60: rgb(255, 255, 255, 0.6);
	--color-white-alpha70: rgb(255, 255, 255, 0.7);
	--color-white-alpha80: rgb(255, 255, 255, 0.8);
	--color-white-alpha90: rgb(255, 255, 255, 0.9);
	--color-black: #000000;
	--color-black-alpha10: rgb(0, 0, 0, 0.1);
	--color-black-alpha20: rgb(0, 0, 0, 0.2);
	--color-black-alpha30: rgb(0, 0, 0, 0.3);
	--color-black-alpha40: rgb(0, 0, 0, 0.4);
	--color-black-alpha50: rgb(0, 0, 0, 0.5);
	--color-black-alpha60: rgb(0, 0, 0, 0.6);
	--color-black-alpha70: rgb(0, 0, 0, 0.7);
	--color-black-alpha80: rgb(0, 0, 0, 0.8);
	--color-black-alpha90: rgb(0, 0, 0, 0.9);
	--color-grey100: #e6e6e6;
	--color-grey200: #cccccc;
	--color-grey300: #b3b3b3;
	--color-grey400: #999999;
	--color-grey500: #7f7f7f;
	--color-grey600: #666666;
	--color-grey700: #4d4d4d;
	--color-grey800: #333333;
	--color-grey900: #1a1a1a;
	/* Text */
	--leading-trim: calc((1em - 1lh) / 2);
	--leading-xs: 1;
	--leading-s: 1.25;
	--leading-m: 1.5;
	--leading-l: 1.625;
	--leading-xl: 2;
	/* Animation */
	--duration-100: 100ms;
	--duration-150: 150ms;
	--duration-250: 250ms;
	--duration-300: 300ms;
	--duration-500: 500ms;
	--duration-600: 600ms;
	--duration-750: 750ms;
	--duration-900: 900ms;
	--duration-1000: 1000ms;
	--duration-1250: 1250ms;
	--duration-1500: 1500ms;
	--duration-1750: 1750ms;
	--ease-in-cubic: cubic-bezier(0.32, 0, 0.67, 0);
	--ease-in-quart: cubic-bezier(0.5, 0, 0.75, 0);
	--ease-in-expo: cubic-bezier(0.7, 0, 0.84, 0);
	--ease-in-circ: cubic-bezier(0.55, 0, 1, 0.45);
	--ease-in-back: cubic-bezier(0.36, 0, 0.66, -0.56);
	--ease-out-cubic: cubic-bezier(0.33, 1, 0.68, 1);
	--ease-out-quart: cubic-bezier(0.25, 1, 0.5, 1);
	--ease-out-expo: cubic-bezier(0.16, 1, 0.3, 1);
	--ease-out-circ: cubic-bezier(0, 0.55, 0.45, 1);
	--ease-out-back: cubic-bezier(0.34, 1.56, 0.64, 1);
	--ease-in-out-cubic: cubic-bezier(0.65, 0, 0.35, 1);
	--ease-in-out-quart: cubic-bezier(0.76, 0, 0.24, 1);
	--ease-in-out-expo: cubic-bezier(0.87, 0, 0.13, 1);
	--ease-in-out-circ: cubic-bezier(0.85, 0, 0.15, 1);
	--ease-in-out-back: cubic-bezier(0.68, -0.6, 0.32, 1.6);
}

:root {
	--breakpoint: 960;
	--px: calc(100vw / var(--breakpoint));

	--is-vwmin: initial;
	--is-vwmax: ;

	--color-red: #cd1419;
	--color-yellow: #c79522;
	--color-kyotoanimation: #e5461e;
	--color-denki-black: #0d0d0d;
	--color-rgb-denki-black: 13, 13, 13;
	--color-link: var(--color-yellow);

	--color-kihachi: #b7282d;
	--color-rgb-kihachi: 183, 40, 45;
	--color-inako: #249dd9;
	--color-rgb-inako: 36, 157, 217;
	--color-yosuke: #c491c0;
	--color-rgb-yosuke: 196, 145, 192;
	--color-seiroku: #f18d00;
	--color-rgb-seiroku: 241, 141, 0;
	--color-kengo: #006B58;
	--color-rgb-kengo: 0, 107, 88;
	--color-noriko: #72c7d1;
	--color-rgb-noriko: 114, 199, 209;
	--color-suzu: #7559a4;
	--color-rgb-suzu: 117, 89, 164;
	--color-kate: #fff363;
	--color-rgb-kate: 255, 243, 99;
	--color-yajiro: #6f8a1d;
	--color-rgb-yajiro: 111, 138, 29;
	--color-izo: #88888a;
	--color-rgb-izo: 136, 136, 136;

	--color-wire: #828689;

	--font-mplus1: YakuHanJPs, "M PLUS 1", sans-serif;
	--font-murecho: "Murecho", sans-serif;
	--font-oswald: "Oswald", sans-serif;

	--z-background: -1;
	--z-bottom-level: 1;
	--z-lower-level: 2;
	--z-middle-level: 3;
	--z-upper-level: 4;
	--z-top-level: 5;

	--z-aside: 10;
	--z-kv: 98;
	--z-logo-fixed: 99;
	--z-overlay: 100;
	--z-header: 101;
	--z-modal: 1000;

	--trans-default: 500ms cubic-bezier(0.65, 0, 0.35, 1);
}
:root:lang(ja) {
	--font-base: var(--font-mplus1);
}
:root:lang(en) {
	--font-base: var(--font-murecho);
}

@media (max-width: 959px) {
}
@media not (min-width: 960px) {
}
@media (min-width: 960px) {
	:root {
		--breakpoint: 1920;

		--is-vwmin: ;
		--is-vwmax: initial;
	}
}
html {
	scrollbar-gutter: stable;
}
body {
	position: fixed;
	width: 100%;
	font-family: var(--font-base);
	font-optical-sizing: auto;
	font-weight: 400;
	font-style: normal;
	line-height: var(--leading-l);
	color: var(--color-white);
	background-color: var(--color-denki-black);
	text-spacing-trim: trim-start;
	text-autospace: normal;
	overflow-wrap: anywhere;
  word-break: normal;
  line-break: strict;
	overflow-x: clip;
	overflow-y: scroll;
	-webkit-tap-highlight-color: transparent;
}
body.-loaded {
	position: static;
}
body.-menu-open,
body.-modal-open {
	overflow-y: hidden;
}

body,
.overlay-wrapper {
	--sb-track-color: var(--color-denki-black);
  --sb-thumb-color: var(--color-yellow);
  --sb-size: 8px;
}
body::-webkit-scrollbar,
.overlay-wrapper::-webkit-scrollbar {
  width: var(--sb-size)
}
body::-webkit-scrollbar-track,
.overlay-wrapper::-webkit-scrollbar-track {
  background: var(--sb-track-color);
  border-radius: 1px;
}
body::-webkit-scrollbar-thumb,
.overlay-wrapper::-webkit-scrollbar-thumb {
  background: var(--sb-thumb-color);
  border-radius: 1px;
}
@supports not selector(::-webkit-scrollbar) {
  body,
	.overlay-wrapper {
    scrollbar-color: var(--sb-thumb-color)
                     var(--sb-track-color);
  }
}

a {
	color: var(--color-link);
	background-color: transparent;
	text-decoration: none;
	cursor: pointer;
}
button{
	border: none;
	cursor: pointer;
}

img,
iframe {
	display: block;
	inline-size: 100%;
	block-size: auto;
	border: 0;
}
svg {
	inline-size: 100%;
	block-size: auto;
}

@media not (min-width: 960px) {
	.pc-only {
		display: none !important;
	}
}
@media (min-width: 960px) {
	.sp-only {
		display: none !important;
	}
}
.visually-hidden {
  position: fixed !important;
  top: 0px !important;
  left: 0px !important;
  width: 4px !important;
  height: 4px !important;
  opacity: 0 !important;
  overflow: hidden !important;
  border: 0 !important;
  margin: 0 !important;
  padding: 0 !important;
  display: block !important;
  visibility: visible !important;
}
.fade-in {
	opacity: 1 !important;
	pointer-events: auto !important;
	transition: opacity var(--duration-500) linear;
}
.fade-out {
	opacity: 0 !important;
	pointer-events: none !important;
	transition: opacity var(--duration-500) linear;
}

/* __________ 英語タイトル イタリック体 __________ */
.font-italic {
	font-style: italic;
	margin-inline-end: 0.1em;
}

/* __________ 行間 __________ */
.leading-xs { line-height: var(--leading-xs); }
.leading-s { line-height: var(--leading-s); }
.leading-m { line-height: var(--leading-m); }
.leading-l { line-height: var(--leading-l); }
.leading-xl { line-height: var(--leading-xl); }

/* __________ レイアウト、グリッド __________ */
.main {
	padding-bottom: calc(320 * var(--px));
}
.site-wrapper ~ .site-wrapper {
	margin-top: calc(96 * var(--px));
}
.site-container {
	position: relative;
	overflow: clip;
	padding-bottom: calc(32 * var(--px));
}
.subpage .site-container {
	padding-block: calc(128 * var(--px));
}
.body-content {
	margin-top: calc(24 * var(--px));
}
@media (min-width: 960px) {
	.site-wrapper ~ .site-wrapper {
		margin-top: calc(192 * var(--px));
	}
	.body-content {
		margin-top: calc(48 * var(--px));
	}
}
.grid {
	--columns: 28;
	display: grid;
	grid-template-columns: repeat(var(--columns), minmax(0, 1fr));
	grid-template-rows: repeat(var(--rows, 1), minmax(0, 1fr));
}
.grid > * {
	--col-start: 2;
	--col-end: calc(var(--columns) - var(--col-start) + 2);
	grid-column: var(--col-start) / var(--col-end);
}
.body-content.grid > * {
	--col-start: 3;
}
@media (min-width: 960px) {
	.grid {
		--columns: 30;
	}
	.grid > * {
		--col-start: 5;
	}
}

/* __________ リンク、ボタン __________ */
/* ボタン */
.btn {
	display: flex;
	justify-content: center;
	align-items: center;
	inline-size: 100%;
	block-size: 100%;
	padding-block: .3125em;
	padding-inline: .625em;
	letter-spacing: .04em;
	color: var(--color-red);
	background-color: transparent;
	border: 2px solid var(--color-red);
	aspect-ratio: var(--btn-as);
	transition: var(--trans-default);
}
@media (any-hover: hover) {
	.btn:hover {
		color: var(--color-red) !important;
		background-color: var(--color-white) !important;
	}
}
/* ボタン - ヘッダーメニュー */
.link-menu.btn {
	inline-size: fit-content;
	color: var(--color-denki-black);
	background-color: var(--color-white);
	border-color: var(--color-white);
	font-family: var(--font-oswald);
	font-weight: 700;
	font-size: calc(18 * var(--px));
}
@media (any-hover: hover) {
	.link-menu.btn:hover {
		color: var(--color-red) !important;
	}
}
.link-menu.btn.-active {
	color: var(--color-red);
	background-color: var(--color-white);
}
/* ボタン - アイコン */
.btn.-icon {
	justify-content: space-between;
	padding-block: calc(16 * var(--px));
}
.btn.-icon .btn-text {
	margin-block: var(--leading-trim);
}
.btn.-icon .svg-icon {
	font-size: 0.667em;
}
.btn.-active,
.btn.-jp:lang(ja),
.btn.-en:lang(en) {
	color: var(--color-white);
	background-color: var(--color-red);
}
/* カード */
.card {
	--columns: 6;
	display: grid;
	align-items: start;
	align-content: center;
	grid-template-columns: repeat(var(--columns), minmax(0, 1fr));
	background-color: var(--color-denki-black);
}
.card > * {
	grid-column: var(--col-start) / var(--col-end);
}
.card .card-thumb {
	--col-start: 1;
	--col-end: -1;
	position: relative;
	width: 100%;
	height: 100%;
	overflow: hidden;
}
.card .card-thumb.-border {
	border: 1px solid var(--color-red);
}
.card-thumb.-standard {
}
.card-thumb.-wide {
	aspect-ratio: 16 / 9;
}
.card .card-thumb img {
	transform: scale(1.01) translate3d(0, 0, 0);
	transition: var(--trans-default);
}
.card .card-text {
	--col-start: 1;
	--col-end: var(--columns);
	display: flex;
	align-items: center;
	gap: calc(8 * var(--px));
	height: 100%;
	padding: calc(8 * var(--px));
	color: var(--color-white);
	font-size: calc(22 * var(--px));
	font-weight: 500;
	line-height: var(--leading-s);
	transition: var(--trans-default);
}
.card .card-text-note {
	font-size: calc(18 * var(--px));
	font-weight: 400;
}
.card .card-icon {
	--col-start: var(--columns);
	--col-end: -1;
	display: grid;
	align-items: center;
	justify-items: center;
	width: 100%;
	height: auto;
	color: var(--color-white);
	background-color: var(--color-red);
	font-size: calc(20 * var(--px));
	aspect-ratio: 1;
	transition: var(--trans-default);
}
@media (any-hover: hover) {
	.card .card-text {
		padding: calc(16 * var(--px));
		font-size: calc(24 * var(--px));
	}
	.card:hover .card-thumb img {
		transform: scale(1.06) translate3d(0, 0, 0) !important;
	}
	.card:hover .card-text {
		color: var(--color-red) !important;
	}
	.card:hover .card-icon {
		color: var(--color-red) !important;
		background-color: var(--color-white) !important;
	}
}
@media (min-width: 960px) {
	.card {
		--columns: 7;
	}
}
/* SVG Icon */
.svg-icon {
	display: block;
	width: 1em;
	height: auto;
	line-height: 1;
	aspect-ratio: 1;
}
.sns-btn {
	display: grid;
	align-items: center;
	justify-items: center;
	aspect-ratio: 1;
	transition: var(--trans-default);
}


/* __________ マーカー __________ */
.marker {
	padding-inline: .25em;
	background: linear-gradient(transparent 10%, var(--color-marker) 10%, var(--color-marker) 98%, transparent 98%);
	filter: drop-shadow(1px 1px 0px var(--color-denki-black)) drop-shadow(0px -1px 0px var(--color-denki-black)) drop-shadow(-1px 0px 0px var(--color-denki-black));
}
.marker.-red {
	color: var(--color-denki-black);
	--color-marker: var(--color-red);
}
.marker.-yellow {
	color: var(--color-denki-black);
	--color-marker: var(--color-yellow);
}
.marker.-white {
	color: var(--color-denki-black);
	--color-marker: var(--color-white);
}
.marker.-black {
	color: var(--color-white);
	--color-marker: var(--color-denki-black);
}


/* __________ ローディング・ヘッダー・ロゴ __________ */
:root {
	--loader-animation-duration: 750ms;
	--loader-sub-animation-duration: 650ms;
	--loader-animation-timing: var(--ease-in-out-cubic);
	--loader-animation-delay: 300ms;
	--loader-sub-animation-delay: 400ms;
	--loader-fade-animation-delay: 300ms;

	--logo-filter-animation-duration: 400ms;
	--logo-filter-animation-timing: var(--ease-in-out-cubic);
	--logo-filter-animation-delay: 250ms;
	--logo-filter-blur: 6px;

	--kv-start-animation-duration: 1200ms;
	--kv-end-animation-duration: 1000ms;
	--kv-start-animation-timing: cubic-bezier(0.6, 0, 0.37, 1);
	--kv-end-animation-timing: cubic-bezier(0.4, 0, 0.24, 1);
	--kv-start-animation-delay: 300ms;
	--kv-end-animation-delay: 2000ms;

	--transform-origin: 50% 50%;

	--source-kv-width: 960;
	--source-kv-height: 1359;
	--source-logo-pos: 1320;
	--source-kv-start-pos: 1230;
	--source-kv-kihachi-inako-pos: 880;

	--kv-scale: 1.75;
	--logo-scale: 1.3;

	--z-loader-filter: 1001;
	--z-loader-bg: 1002;
	--z-logo: 1003;

	--kv-height: calc(100vw / var(--source-kv-width) * var(--source-kv-height));
	--resized-logo-pos: calc(var(--source-logo-pos) * var(--kv-height) / var(--source-kv-height));
	--logo-pos: min(calc(50vh - var(--resized-logo-pos)), 0px);
	--resized-kv-start-pos: calc(var(--source-kv-start-pos) * var(--kv-height) / var(--source-kv-height));
	--kv-start-pos: min(calc(50vh - var(--resized-kv-start-pos)), 0px);
	--resized-kv-kihachi-inako-pos: calc(var(--source-kv-kihachi-inako-pos) * var(--kv-height) / var(--source-kv-height));
	--kv-kihachi-inako-pos: min(calc(50vh - var(--resized-kv-kihachi-inako-pos)), 0px);
}
@media (min-width: 960px) {
	:root {
		--logo-filter-blur: 10px;

		--transform-origin: 50% 100%;

		--source-kv-width: 1920;
		--source-kv-height: 2718;
		--source-logo-pos: 2360;
		--source-kv-start-pos: 1600;
		--source-kv-kihachi-inako-pos: 830;

		--kv-scale: 1.4;
		--logo-scale: 0.75;
	}
}

.loader {
	position: fixed;
	width: 100%;
	height: 100%;
}
/* フィルタ */
.loader.-filter {
	background-color: var(--color-black-alpha50);
	-webkit-backdrop-filter: blur(var(--logo-filter-blur));
	backdrop-filter: blur(var(--logo-filter-blur));
	z-index: var(--z-loader-filter);
}
/* フィルタ トップページ */
.homepage.-load .loader.-filter {
	animation: animationTopLoader var(--loader-animation-duration) var(--loader-animation-timing) var(--loader-animation-delay) forwards;
}
.homepage.-loaded .loader.-filter {
	transform: translate3d(0, 100%, 0);
}
/* フィルタ セカンドページ */
.subpage.-load .loader.-filter {
	animation: animationSubLoader var(--loader-animation-duration) var(--loader-animation-timing) var(--loader-animation-delay) forwards;
}
.subpage.-loaded .loader.-filter {
	transform: translate3d(0, -100%, 0);
}

/* オーバーレイ */
.loader.-overlay {
	background-color: var(--color-denki-black);
	z-index: var(--z-loader-bg);
}
/* オーバーレイ トップページ */
.homepage.-load .loader.-overlay {
	animation: animationTopLoader var(--loader-animation-duration) var(--loader-animation-timing) forwards;
}
.homepage.-loaded .loader.-overlay {
	transform: translate3d(0, 100%, 0);
}
@keyframes animationTopLoader {
	to { transform: translate3d(0, 100%, 0); }
}
/* オーバーレイ セカンドページ */
.subpage.-load .loader.-overlay {
	animation: animationSubLoader var(--loader-animation-duration) var(--loader-animation-timing) forwards;
}
.subpage.-loaded .loader.-overlay {
	transform: translate3d(0, -100%, 0);
}
@keyframes animationSubLoader {
	to { transform: translate3d(0, -100%, 0); }
}

/* ロゴ */
.loader.-logo {
	z-index: var(--z-logo);
}
.loader-logo-image img {
	filter: contrast(0) brightness(2);
}
.-load .loader-logo-image img {
	animation: animationTopLogoFilter var(--logo-filter-animation-duration) var(--logo-filter-animation-timing) var(--logo-filter-animation-delay) forwards;
}
.-loaded .loader-logo-image img {
	filter: unset;
}
@keyframes animationTopLogoFilter {
	to { filter: unset; }
}
/* ロゴ トップページ */
.homepage.-load .loader.-logo {
	clip-path: inset(0% 0 0 0);
	opacity: 1;
	animation: animationTopLogoClip var(--loader-animation-duration) var(--loader-animation-timing) var(--loader-animation-delay) forwards;
}
.homepage.-loaded .loader.-logo {
	opacity: 0;
	clip-path: inset(100% 0 0 0);
}
@keyframes animationTopLogoClip {
	to { opacity: 0; clip-path: inset(100% 0 0 0); }
}
.homepage .loader-logo-image {
	position: absolute;
	inset: 0;
	width: calc(640 * var(--px));
	height: auto;
	display: grid;
	align-items: center;
	margin: auto;
	transform: translate3d(0, 0%, 0);
}
.homepage.-load .loader-logo-image {
	animation: animationTopLogoTrans var(--loader-animation-duration) var(--loader-animation-timing) var(--loader-animation-delay) forwards;
}
.homepage.-loaded .loader-logo-image {
	transform: translate3d(0, 25%, 0);
}
@keyframes animationTopLogoTrans {
	to { transform: translate3d(0, 25%, 0); }
}
/* ロゴ セカンドページ */
.subpage.-loaded .loader.-logo {
	position: absolute;
	pointer-events: none;
	z-index: var(--z-top-level);
}
.subpage .loader-logo-image {
	position: absolute;
	top: 50%;
	left: 0;
	right: 0;
	width: calc(640 * var(--px));
	height: auto;
	margin: auto;
	transform: translate3d(0, -50%, 0);
}
.subpage.-load .loader-logo-image {
	animation: animationSubLogoTrans var(--loader-animation-duration) var(--loader-animation-timing) var(--loader-animation-delay) forwards,
						 animationSubLogoWidthTrans var(--loader-sub-animation-duration) var(--loader-animation-timing) var(--loader-sub-animation-delay) forwards;
}
.subpage.-loaded .loader-logo-image {
	top: calc(32 * var(--px));
	width: calc(196 * var(--px));
	transform: translate3d(0, 0%, 0);
	pointer-events: auto;
}
@keyframes animationSubLogoTrans {
	to { top: calc(32 * var(--px)); transform: translate3d(0, 0%, 0); }
}
@keyframes animationSubLogoWidthTrans {
	to { width: calc(196 * var(--px)); }
}
.loader-logo-image a {
	pointer-events: none;
}
.-loaded .loader-logo-image a {
	pointer-events: auto;
}
/* メイン セカンドページ */
.subpage.-load .main {
	transform: scale(1.2) translate3d(0, 64px, 0);
	transform-origin: top;
	animation: animationEndMainScale var(--duration-1000) var(--loader-animation-timing) var(--duration-300) forwards;
}
@keyframes animationEndMainScale {
	to { transform: scale(1.0) translate3d(0, 0px, 0); }
}
.subpage.-load .body-content {
	transform: translate3d(0, 80px, 0);
	transform-origin: top;
	animation: animationEndMainBody var(--duration-1000) var(--loader-animation-timing) var(--duration-300) forwards;
}
@keyframes animationEndMainBody {
	to { transform: translate3d(0, 0px, 0); }
}
@media (min-width: 960px) {
	.subpage.-load .body-content {
		transform: translate3d(0, 240px, 0);
	}
}


/* __________ ローディング・キービジュアル __________ */
.hero-kv-container {
	position: relative;
	width: 100%;
	height: 100%;
	aspect-ratio: var(--source-kv-width) / var(--source-kv-height);
	overflow-x: clip;
	z-index: var(--z-kv);
}
.hero-kv-container .splide__track {
	overflow: visible;
}
.-loaded .hero-kv-container .splide__track {
	overflow: hidden;
}
.hero-kv-image {
	transform: translate3d(0, var(--kv-start-pos), 0) scale(var(--kv-scale));
	transform-origin: var(--transform-origin);
}
.homepage.-load.-landing .hero-kv-image {
	animation: animationStartKV var(--kv-start-animation-duration) var(--kv-start-animation-timing) var(--kv-start-animation-delay) forwards,
						 animationEndHomepage var(--kv-end-animation-duration) var(--kv-end-animation-timing) var(--kv-end-animation-delay) forwards;
}
.homepage.-load.-skip .hero-kv-image {
	transform: translate3d(0, -3%, 0) scale(1.0);
	animation: animationEndHomepage var(--kv-start-animation-duration) var(--kv-end-animation-timing) var(--kv-start-animation-delay) forwards;
}
.homepage.-loaded .hero-kv-image {
	transform: translate3d(0, 0, 0) scale(1.0);
}
@keyframes animationStartKV {
	to { transform: translate3d(0, var(--kv-kihachi-inako-pos), 0) scale(var(--kv-scale)); }
}
@keyframes animationEndHomepage {
	to { transform: translate3d(0, 0, 0) scale(1.0); }
}
/* キービジュアル サムネイル */
.splide__thumbnails {
	position: sticky;
	left: calc(32 * var(--px));
	bottom: calc(32 * var(--px));
	width: calc(80 * var(--px));
	display: grid;
	gap: calc(16 * var(--px));
	opacity: 0;
	visibility: hidden;
	transition: var(--trans-default);
}
.-loaded .splide__thumbnails {
	opacity: 1;
	visibility: visible;
}
.hero-wrapper.-splide .splide__thumbnails {
	position: absolute;
}
.thumbnail__btn {
	width: 100%;
	height: 100%;
	aspect-ratio: 1;
	border: 2px solid var(--color-denki-black);
	transition: border var(--trans-default);
}
.thumbnail__btn.-active {
	border-color: var(--color-red);
}
@media (any-hover: hover) {
	.thumbnail__btn:hover {
		border-color: var(--color-white);
	}
}


/* __________ 背景・見出し表示 __________ */
/* 背景 */
.bg-wrapper {
	position: fixed;
	inset: 0;
	width: 100%;
	height: 100vh;
	overflow: hidden;
	pointer-events: none;
}
.bg-wrapper.type-bg > img {
	width: 100%;
	height: 100vh;
	object-fit: cover;
	object-position: center 0;
}
/* 背景 トップページ */
.homepage .bg-wrapper.type-bg {
	filter: grayscale(1) contrast(1.1) brightness(0.9);
	z-index: var(--z-background);
}
/* 背景 セカンドページ */
.subpage .bg-wrapper.type-bg {
	z-index: var(--z-background);
}
.subpage.-load .bg-wrapper.type-bg {
	filter: grayscale(0) contrast(1) brightness(1);
	animation: animationSubBg var(--duration-750) var(--ease-in-out-cubic) var(--duration-500) forwards;
}
.subpage.-loaded .bg-wrapper.type-bg {
	filter: grayscale(1) contrast(1.1) brightness(0.9);
}
@keyframes animationSubBg {
	to { filter: grayscale(1) contrast(1.1) brightness(0.9); }
}
.bg-wrapper.type-bg:after {
	content: "";
	position: absolute;
	inset: 0;
	background-image: url(/_assets_official/images/bg/noise.webp);
	background-repeat: repeat;
	background-position: 0 0;
	animation: animationNoise 1s steps(5) infinite;
}
@keyframes animationNoise {
	0%   { background-position: 0 0; }
	20%  { background-position: 5% -20%; }
	40%  { background-position: -20% 30%; }
	60%  { background-position: 20% -10%; }
	80%  { background-position: -10% 20%; }
	100% { background-position: 0 0; }
}
.subpage.-load .bg-wrapper.type-bg:after {
	opacity: 0;
	animation: animationSubBgNoise var(--duration-750) var(--ease-in-out-cubic) var(--duration-500) forwards;
}
.subpage.-loaded .bg-wrapper.type-bg:after {
	opacity: 1;
}
@keyframes animationSubBgNoise {
	to { opacity: 1; }
}
/* 背景 フッター */
.homepage.-loaded .bg-wrapper.type-bg,
.subpage.-loaded .bg-wrapper.type-bg {
	transition: filter var(--trans-default) var(--duration-250);
}
.homepage.-loaded.-bulb .bg-wrapper.type-bg,
.subpage.-loaded.-bulb .bg-wrapper.type-bg {
	filter: grayscale(0) contrast(1) brightness(1);
}
.homepage.-loaded .bg-wrapper.type-bg:after,
.subpage.-loaded .bg-wrapper.type-bg:after {
	transition: opacity var(--trans-default) var(--duration-250);
}
.homepage.-loaded.-bulb .bg-wrapper.type-bg:after,
.subpage.-loaded.-bulb .bg-wrapper.type-bg:after {
	opacity: 0;
}


/* 見出し */
.headline-content {
	position: relative;
	font-family: var(--font-oswald);
	font-weight: 700;
	font-style: italic;
	overflow-wrap: normal;
	word-break: normal;
	white-space: nowrap;
	z-index: var(--z-upper-level);
}
.bg-wrapper.type-headline {
	position: absolute;
	display: flex;
	justify-content: center;
	font-size: calc(300 * var(--px));
	letter-spacing: .04em;
	background-clip: text;
	background-size: cover;
	background-position: center 0;
	background-image: var(--bg-image-url, url(/_assets_official/images/bg/bg-1.webp));
	-webkit-text-fill-color: rgb(255, 255, 255, 0.2);
	filter: saturate(1.2) brightness(1.05);
}
.homepage .headline-content.-active .bg-wrapper.type-headline {
	animation: animationHeadlineSize var(--duration-750) var(--ease-in-out-cubic) forwards;
}
.subpage.-load .headline-content .bg-wrapper.type-headline {
	animation: animationEndSubpage var(--duration-1000) var(--ease-in-out-cubic) var(--duration-500) forwards;
}
.subpage.-loaded .headline-content .bg-wrapper.type-headline {
	font-size: calc(152 * var(--px));
}
@keyframes animationHeadlineSize {
	to { font-size: calc(152 * var(--px)); }
}
@keyframes animationEndSubpage {
	to { font-size: calc(152 * var(--px)); }
}
.headline-hidden {
	display: flex;
	justify-content: center;
	font-size: calc(152 * var(--px));
	letter-spacing: .04em;
	color: transparent;
	opacity: 0;
	visibility: hidden;
}
.headline {
	position: absolute;
	inset: 0;
	top: .5em;
	width: 100vw;
	height: 1.25em;
	display: flex;
	justify-content: center;
	align-items: center;
	margin: auto;
	background-image: linear-gradient(90deg, rgb(var(--color-rgb-denki-black), .25) 15%, var(--color-denki-black) 30%, var(--color-denki-black) 70%, rgb(var(--color-rgb-denki-black), .25) 85%);
	font-size: calc(40 * var(--px));
	letter-spacing: .1em;
	transform: scale3d(0, 0, 1);
}
.homepage .headline-content.-active .headline {
	animation: animationHeadlineInAnim var(--duration-500) var(--ease-in-out-cubic) var(--duration-500) forwards;
}
.subpage.-load .headline-content .headline {
	animation: animationHeadlineInAnim var(--duration-500) var(--ease-in-out-cubic) var(--duration-1000) forwards;
}
.subpage.-loaded .headline-content .headline {
	transform: scale3d(1, 1, 1);
}
@keyframes animationHeadlineInAnim {
	to { transform: scale3d(1, 1, 1); }
}
@media (min-width: 960px) {
	.homepage .bg-wrapper.type-headline {
		font-size: calc(360 * var(--px));
	}
	.subpage .bg-wrapper.type-headline {
		font-size: calc(480 * var(--px));
	}
	@keyframes animationHeadlineSize {
		to { font-size: calc(192 * var(--px)); }
	}
	.subpage.-loaded .headline-content .bg-wrapper.type-headline {
		font-size: calc(192 * var(--px));
	}
	@keyframes animationEndSubpage {
		to { font-size: calc(192 * var(--px)); }
	}
	.headline-hidden {
		font-size: calc(192 * var(--px));
	}
	.headline {
		font-size: calc(32 * var(--px));
	}
}


/* __________ サブ見出し __________ */
.sub-headline {
	position: relative;
	display: grid;
	justify-items: center;
	row-gap: calc(8 * var(--px));
	padding-bottom: .75em;
	color: var(--color-red);
	font-weight: 700;
	font-size: calc(48 * var(--px));
	text-align: center;
}
.sub-headline.-jp {
	font-family: var(--font-mplus1);
}
.sub-headline.-en {
	font-family: var(--font-oswald);
}
.sub-headline > span {
	margin-block: var(--leading-trim);
}
.sub-headline:after {
	content: "";
	position: absolute;
	inset: auto 0 0;
	width: 100%;
	height: 1px;
	background-color: currentColor;
}


/* __________ ナビゲーション・アンカーリンク __________ */
.navigation {
	--columns-size: calc(100vw / 16);
	display: flex;
	flex-wrap: wrap;
	gap: calc(32 * var(--px));
}
.navigation.-header {
	justify-content: center;
	margin-bottom: calc(96 * var(--px));
	font-family: var(--font-oswald);
	font-weight: 700;
	font-size: calc(28 * var(--px));
}
.navigation.-more {
	justify-content: center;
	margin-top: calc(48 * var(--px));
	font-weight: 500;
	font-size: calc(24 * var(--px));
}
.navigation.-external {
	margin-top: calc(96 * var(--px));
	font-family: var(--font-oswald);
	font-weight: 700;
	font-size: calc(24 * var(--px));
}
.navigation.-footer {
	justify-content: center;
	margin-top: calc(96 * var(--px));
	font-family: var(--font-oswald);
	font-weight: 700;
	font-size: calc(24 * var(--px));
}
.navigation.-size-1 .navigation-item { inline-size: calc(1 * var(--columns-size)); }
.navigation.-size-2 .navigation-item  { inline-size: calc(2 * var(--columns-size)); }
.navigation.-size-3 .navigation-item  { inline-size: calc(3 * var(--columns-size)); }
.navigation.-size-4 .navigation-item  { inline-size: calc(4 * var(--columns-size)); }
.navigation.-size-5 .navigation-item { inline-size: calc(5 * var(--columns-size)); }
.navigation.-size-6 .navigation-item { inline-size: calc(6 * var(--columns-size)); }
@media (min-width: 960px) {
	.navigation {
		--columns-size: calc(100vw / 30);
	}
	.navigation.-external {
		font-size: calc(20 * var(--px));
	}
}


/* __________ ヘッダーメニュー・ハンバーガーメニュー __________ */
/* ヘッダーメニュー */
.header-wrapper {
	position: fixed;
	top: 0;
	width: 100%;
	z-index: var(--z-header);
}
.header-logo-fixed {
	position: fixed;
	top: 0;
	left: 0;
	width: calc(400 * var(--px));
	padding-inline: calc(32 * var(--px));
	padding-block: calc(16 * var(--px));
	filter: drop-shadow(0px 0px 1px var(--color-white)) drop-shadow(0px 0px 1px var(--color-white)) drop-shadow(0px 0px 4px var(--color-white));
	z-index: var(--z-logo-fixed);
	opacity: 1;
	visibility: visible;
	transform: translate3d(0, 0, 0);
	transition: var(--trans-default);
}
.-menu .header-logo-fixed {
	width: calc(240 * var(--px));
	filter: unset;
}
.-menu.-bulb .header-logo-fixed {
	opacity: 0;
	visibility: hidden;
	transform: translate3d(0, -100%, 0);
}
.header-nav {
	display: none;
}
@media (min-width: 960px) {
	.header-logo-fixed {
		width: calc(764 * var(--px));
		filter: drop-shadow(0px 0px 2px var(--color-white)) drop-shadow(0px 0px 4px var(--color-white)) drop-shadow(0px 0px 6px var(--color-white));
	}
	.header-nav {
		position: absolute;
		top: 0;
		right: 0;
		display: flex;
		justify-content: flex-end;
		align-items: stretch;
		column-gap: calc(48 * var(--px));
		padding-inline: calc(32 * var(--px));
		padding-block: calc(16 * var(--px));
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		transform: translate3d(0, 0%, 0);
		transition: var(--trans-default);
	}
	.-menu .header-nav,
	.subpage .header-nav {
		opacity: 0;
		visibility: hidden;
		pointer-events: none;
		transform: translate3d(0, -100%, 0);
	}
	.header-menu-list {
		display: flex;
		column-gap: calc(16 * var(--px));
	}
	.header-lang-list {
		display: grid;
		grid-template-columns: repeat(2, calc(48 * var(--px)));
	}
	.header-lang-list .btn {
		--btn-as: 1;
		font-family: var(--font-oswald);
		font-weight: 700;
		font-size: calc(16 * var(--px));
	}
}
/* ハンバーガーメニューボタン */
.hamburger-menu {
	position: absolute;
	top: 0;
	right: 0;
	transition: var(--trans-default);
}
.-menu.-bulb .hamburger-menu {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translate3d(0, -100%, 0);
}
.hamburger-btn.btn {
	padding-block: calc(24 * var(--px));
	padding-inline: calc(16 * var(--px));
}
.hamburger-icon {
	position: relative;
	display: block;
	width: calc(80 * var(--px));
	height: calc(28 * var(--px));
}
.hamburger-icon-line {
	position: absolute;
	width: 100%;
	height: calc(6 * var(--px));
	margin-block: auto;
	background-color: currentColor;
}
.hamburger-icon-line.-line1 {
	top: 0;
	bottom: 100%;
	width: 100%;
	transform: rotate(0deg);
	transition: 250ms var(--ease-in-out-cubic) 350ms bottom,
							250ms var(--ease-in-out-cubic) transform;
}
.-menu-open .hamburger-icon-line.-line1 {
	bottom: 0%;
	transform: rotate(24deg);
	transition: 250ms var(--ease-in-out-cubic) bottom,
							250ms var(--ease-in-out-cubic) 350ms transform;
}
.hamburger-icon-line.-line2 {
	top: 100%;
	bottom: 0;
	right: 0;
	width: 80%;
	transition: 250ms var(--ease-in-out-cubic) 350ms top,
							0ms var(--ease-in-out-cubic) 350ms width,
							250ms var(--ease-in-out-cubic) transform;
}
.-menu-open .hamburger-icon-line.-line2 {
	top: 0%;
	width: 100%;
	transform: rotate(-24deg);
	transition: 250ms var(--ease-in-out-cubic) top,
							0ms var(--ease-in-out-cubic) 350ms width,
							250ms var(--ease-in-out-cubic) 350ms transform;
}
@media (min-width: 960px) {
	.hamburger-menu {
    opacity: 0;
    visibility: hidden;
    pointer-events: none;
    transform: translate3d(0, -100%, 0);
	}
	.-menu .hamburger-menu,
	.subpage .hamburger-menu {
		opacity: 1;
		visibility: visible;
		pointer-events: auto;
		transform: translate3d(0, 0%, 0);
	}
}


/* __________ フッター __________ */
.footer {
	position: relative;
	width: 100%;
	height: calc(100vh + calc(110 * var(--px)));
	grid-template-rows: calc(100 * var(--px)) 1px auto;
}
/* 電球 */
.footer-bulb {
	position: relative;
	width: auto;
	height: calc(100 * var(--px));
	aspect-ratio: 100 / 172;
	margin-inline: auto 0;
	z-index: var(--z-middle-level);
}
.-bulb .bulb-s,
.bulb {
	display: none;
}
.bulb-s,
.-bulb .bulb {
	display: block;
}
.footer-bulb-wire {
	position: relative;
	width: 100%;
	z-index: var(--z-bottom-level);
}
.footer-bulb-wire:before,
.wire {
	content: "";
	position: absolute;
	top: -2px;
	left: 0;
	height: 1px;
}
.footer-bulb-wire:before {
	width: 100%;
	background-color: var(--color-wire);
}
.wire {
	width: 0%;
	background-color: var(--color-yellow);
	border-top: 2px solid var(--color-yellow);
	filter: blur(1px);
	mix-blend-mode: plus-lighter;
}
@media (min-width: 960px) {
	.footer {
		height: calc(100vh + calc(74 * var(--px)));
		grid-template-rows: calc(72 * var(--px)) 1px auto;
	}
	.footer-bulb {
		--col-start: 3;
		height: calc(72 * var(--px));
	}
	.footer-bulb-wire {
		--col-start: 3;
	}
}
/* ナビゲーション */
.footer-content {
	position: sticky;
	top: calc(100dvh - (985 * var(--px)));
	left: 0;
	display: grid;
	justify-items: start;
	row-gap: calc(32 * var(--px));
	padding-top: calc(320 * var(--px));
	padding-bottom: calc(64 * var(--px));
}
.footer-logo-image {
	width: calc(360 * var(--px));
	height: auto;
	filter: contrast(0) brightness(2);
}
.footer-nav-list {
	display: flex;
	align-items: center;
	background-color: var(--color-white);
}
.footer-nav-list .link-menu {
	color: var(--color-denki-black);
	font-family: var(--font-oswald);
	font-weight: 700;
	font-size: calc(26 * var(--px));
	padding-inline: calc(8 * var(--px));
	padding-block: calc(28 * var(--px)) calc(24 * var(--px));
	line-height: 1;
	transition: var(--trans-default);
}
.footer-nav-list .link-menu:first-child {
	padding-left: calc(16 * var(--px));
}
.footer-nav-list .link-menu:last-child {
	padding-right: calc(16 * var(--px));
}
.footer-nav-list .link-menu.-active,
.footer-nav-list .link-menu.-jp:lang(ja),
.footer-nav-list .link-menu.-en:lang(en) {
	color: var(--color-red);
}
@media (any-hover: hover) {
	.footer-nav-list .link-menu:hover {
		color: var(--color-red) !important;
	}
}
@media (min-width: 960px) {
	.footer-container {
		--col-start: 3;
	}
	.footer-content {
		top: calc(100dvh - (866 * var(--px)));
	}
	.footer-logo-image {
		width: calc(256 * var(--px));
	}
	.footer-nav-list .link-menu {
		font-size: calc(18 * var(--px));
		padding-block: calc(16 * var(--px)) calc(14 * var(--px));
	}
}

.share-lang-block {
	display: flex;
	column-gap: calc(48 * var(--px));
}
.share {
	display: flex;
	align-items: center;
	column-gap: calc(8 * var(--px));
	padding-inline: calc(16 * var(--px));
	background-color: var(--color-white);
}
.share-head {
	color: var(--color-denki-black);
	font-family: var(--font-oswald);
	font-weight: 700;
	font-size: calc(20 * var(--px));
	letter-spacing: .04em;
}
.share-list {
	display: flex;
}
.link-share {
	display: grid;
	align-items: center;
	justify-items: center;
	width: calc(64 * var(--px));
	height: calc(64 * var(--px));
	color: var(--color-denki-black);
	font-size: calc(40 * var(--px));
	transition: var(--trans-default);
}
.link-share.-facebook .path-inner {
	fill: transparent;
}
.link-share.-line .path-inner {
	fill: var(--color-white);
	transition: var(--trans-default);
}
.lang-separate {
	width: 2px;
	height: 60%;
	margin-inline: calc(16 * var(--px));
	background-color: var(--color-denki-black);
}
@media (min-width: 960px) {
	.share-lang-block {
		column-gap: calc(24 * var(--px));
	}
	.share-head {
		font-size: calc(14 * var(--px));
	}
	.link-share {
		width: calc(40 * var(--px));
		height: calc(40 * var(--px));
		font-size: calc(24 * var(--px));
	}
	.lang-separate {
		margin-inline: 0;
	}
}
.kyotoanimation {
	padding-inline: calc(16 * var(--px));
	padding-block: calc(14 * var(--px));
	background-color: var(--color-white);
}
.link-corp {
	display: flex;
	color: var(--color-denki-black);
	width: calc(328 * var(--px));
	aspect-ratio: 224 / 34;
	transition: var(--trans-default);
}
.copyright {
	padding-inline: calc(16 * var(--px));
	padding-block: calc(28 * var(--px));
	font-size: calc(22 * var(--px));
	line-height: 1;
	color: var(--color-denki-black);
	background-color: var(--color-white);
}
@media (min-width: 960px) {
	.kyotoanimation {
		padding-block: calc(8 * var(--px));
	}
	.link-corp {
		width: calc(210 * var(--px));
	}
	.copyright {
		padding-block: calc(16 * var(--px));
		font-size: calc(12 * var(--px));
	}
}
@media (any-hover: hover) {
	.link-share:hover,
	.link-corp:hover {
		color: var(--color-red) !important;
	}
	.link-share.-line:hover .path-inner {
		fill: var(--color-white) !important;
	}
}


/* __________ 公式アカウント __________ */
/* サイドエリア */
.aside-wrapper {
	position: fixed;
	right: calc(32 * var(--px));
	bottom: calc(64 * var(--px));
	z-index: var(--z-aside);
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translate3d(100%, 0, 0);
	transition: var(--trans-default);
}
.subpage .aside-wrapper {
	display: none !important;
}
.-aside .aside-wrapper {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
	transform: translate3d(0, 0%, 0);
}
.-aside.-bulb .aside-wrapper {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	transform: translate3d(100%, 0, 0);
}
.aside-sns {
	display: flex;
	flex-direction: column;
	align-items: center;
	row-gap: calc(16 * var(--px));
	padding-block: calc(8 * var(--px));
	background-color: var(--color-denki-black);
}
.sns-title {
	font-family: var(--font-oswald);
	font-size: calc(16 * var(--px));
	font-weight: 700;
	letter-spacing: .04em;
	writing-mode: vertical-rl;
}
.sns-list {
	display: grid;
	row-gap: calc(16 * var(--px));
}
.aside-sns .sns-btn {
	width: calc(64 * var(--px));
	height: calc(64 * var(--px));
	color: var(--color-white);
	font-size: calc(48 * var(--px));
}
@media (any-hover: hover) {
	.aside-sns .sns-btn:hover {
		color: var(--color-red) !important;
	}
}
@media (min-width: 960px) {
	.subpage .aside-wrapper {

	}
	.sns-list {
		display: block;
	}
	.aside-sns .sns-btn {
		width: calc(48 * var(--px));
		height: calc(48 * var(--px));
		font-size: calc(32 * var(--px));
	}
}


/* __________ メニューウインドウ __________ */
.overlay-wrapper {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-color: rgb(var(--color-rgb-denki-black), .9);
	overflow-y: auto;
	overscroll-behavior: contain;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	z-index: var(--z-overlay);
	transition: var(--trans-default);
}
.-menu-open .overlay-wrapper {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}
.overlay-menu {
	display: grid;
	align-content: center;
	width: 100%;
	height: 100%;
}
.overlay-menu-content {
	align-items: center;
	row-gap: calc(96 * var(--px));
	padding-block: calc(96 * var(--px));
}
.menu-lang {
	--col-start: 7;
	grid-row: 1 / 2;
}
.menu-list {
	grid-row: 2 / -1;
}
.menu-lang-list {
	display: flex;
	margin-top: calc(40 * var(--px));
}
@media (min-width: 960px) {
	.menu-lang {
		--col-start: 5;
		--col-end: 12;
		grid-row: 1 / -1;
	}
	.menu-list {
		--col-start: 14;
		--col-end: 27;
		grid-row: 1 / -1;
	}
}

.menu-lang-list .btn {
	font-family: var(--font-oswald);
	font-weight: 700;
	font-size: calc(20 * var(--px));
	letter-spacing: .04em;
}
.menu-table {
	width: 100%;
	font-family: var(--font-oswald);
	font-weight: 700;
}
.menu-table-head,
.menu-table-item {
	border: 1px solid var(--color-white);
	border-collapse: collapse;
}
.menu-table-head {
	padding-block: calc(16 * var(--px));
	padding-inline: calc(24 * var(--px));
	color: var(--color-red);
	font-size: calc(20 * var(--px));
}
.menu-table-group {
	display: none;
}
.menu-table-item.-text {
	width: calc(306 * var(--px));
}
.menu-table-item.-icon {
	width: calc(96 * var(--px));
}
.menu-table-item > a {
	display: flex;
	align-items: center;
	column-gap: calc(16 * var(--px));
	height: calc(96 * var(--px));
	font-size: calc(40 * var(--px));
	letter-spacing: .04em;
	background-color: var(--color-denki-black);
	transition: color var(--trans-default), background-color var(--trans-default);
}
.menu-table-item.-text > a {
	padding-inline: calc(24 * var(--px));
	color: var(--color-white);
}
.menu-table-item.-icon > a {
	justify-content: center;
	color: var(--color-red);
}
.menu-table-item.-text > a.-active {
	color: var(--color-red);
}
.menu-table-item.-icon > a.-active {
	background-color: var(--color-red);
	color: var(--color-white);
}
@media (any-hover: hover) {
	.menu-table-item.-text > a:hover {
		color: var(--color-red) !important;
	}
	.menu-table-item.-text:has( > a:hover) + .menu-table-item.-icon > a {
		background-color: var(--color-white) !important;
		color: var(--color-red) !important;
	}
	.menu-table-item.-text:has(+ .menu-table-item.-icon > a:hover) > a {
		color: var(--color-red) !important;
	}
	.menu-table-item.-icon > a:hover {
		background-color: var(--color-white) !important;
		color: var(--color-red) !important;
	}
}
@media (min-width: 960px) {
	.menu-lang-list .btn {
		font-size: calc(16 * var(--px));
	}
	.menu-table-head {
		padding-block: calc(8 * var(--px));
		font-size: calc(16 * var(--px));
	}
	.menu-table-item.-text {
		width: calc(328 * var(--px));
	}
	.menu-table-item.-icon {
		width: calc(66 * var(--px));
	}
	.menu-table-item > a {
		column-gap: calc(8 * var(--px));
		height: calc(66 * var(--px));
		font-size: calc(28 * var(--px));
	}
}


/* __________ モーダルウインドウ __________ */
.modal-wrapper {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: flex;
	align-items: center;
	justify-content: center;
	background-color: rgb(var(--color-rgb-denki-black), .9);
	overflow-y: auto;
	overscroll-behavior: contain;
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
	z-index: var(--z-modal);
	transition: var(--trans-default);
}
.-modal-open .modal-wrapper {
	opacity: 1;
	visibility: visible;
	pointer-events: auto;
}
.modal-container {
	position: relative;
}
.-modal-youtube .modal-wrapper .modal-content-image,
.-modal-image .modal-wrapper .modal-content-youtube {
	display: none;
}
.modal-content-image {
	max-width: 90vw;
	max-height: 90vh;
}
.modal-content-youtube {
	width: 90vw;
	max-width: 1280px;
	max-height: 90vh;
	aspect-ratio: 16 / 9;
}
.modal-image {
	display: block;
	max-width: 90vw;
	max-height: 90vh;
	inline-size: auto;
	block-size: auto;
}
.modal-youtube {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}
.modal-close-container {
	position: absolute;
	top: 0;
	right: 0;
}
.modal-btn.btn {
	padding-block: calc(24 * var(--px));
	padding-inline: calc(16 * var(--px));
}
.modal-icon {
	position: relative;
	display: block;
	width: calc(80 * var(--px));
	height: calc(28 * var(--px));
}
.modal-icon-line {
	position: absolute;
	top: 0;
	bottom: 0;
	width: 100%;
	height: calc(6 * var(--px));
	margin-block: auto;
	background-color: currentColor;
}
.modal-icon-line.-line1 {
	transform: rotate(24deg);
}
.modal-icon-line.-line2 {
	transform: rotate(-24deg);
}