@charset "UTF-8";

html,
body,
div,
span,
object,
iframe,
h1,
h2,
h3,
h4,
h5,
h6,
p,
blockquote,
pre,
abbr,
address,
cite,
code,
del,
dfn,
em,
img,
ins,
kbd,
q,
samp,
small,
strong,
sub,
sup,
var,
b,
i,
dl,
dt,
dd,
ol,
ul,
li,
fieldset,
form,
label,
legend,
table,
caption,
tbody,
tfoot,
thead,
tr,
th,
td,
article,
aside,
canvas,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section,
summary,
time,
mark,
audio,
video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	font-weight: normal;
	font-style: normal;
	vertical-align: baseline;
	background: transparent;
}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
menu,
nav,
section {
	display: block;
}

nav ul {
	list-style: none;
}

blockquote,
q {
	quotes: none;
}

blockquote:before,
blockquote:after,
q:before,
q:after {
	content: "";
	content: none;
}

a {
	outline: none;
	margin: 0;
	padding: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

hr {
	display: block;
	height: 1px;
	border: 0;
	border-top: 1px solid #cccccc;
	margin: 1em 0;
	padding: 0;
}

input,
select {
	vertical-align: middle;
}

img {
	vertical-align: top;
}

ul,
dl,
ol {
	text-indent: 0;
}

li {
	list-style: none;
}

sup {
	vertical-align: text-top;
}

sub {
	vertical-align: text-bottom;
}

input,
textarea,
select {
	font-family: inherit;
	font-size: inherit;
	font-weight: inherit;
}

* html input,
* html textarea,
* html select {
	font-size: 100%;
}

*:first-child + html + input,
*:first-child html + textarea,
*:first-child + html select {
	font-size: 100%;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
	font-size: inherit;
}

th,
td {
	text-align: left;
	vertical-align: top;
}

caption {
	text-align: left;
}

pre,
code,
kbd,
samp,
tt {
	font-family: monospace;
}

* html pre,
* html code,
* html kbd,
* html samp,
* html tt {
	font-size: 100%;
	line-height: 100%;
}

*:first-child + html pre,
*:first-child html + code,
*:first-child html + kbd,
*:first-child + html + samp,
*:first-child + html tt {
	font-size: 108%;
	line-height: 100%;
}

@media screen {
	.scIn.accInTop {
		position: relative;
		clip-path: inset(0% 0% 100% 0%);
	}

	.scIn.accInTop.move {
		clip-path: inset(0% 0% 0% 0%);
		transition: clip-path 1000ms cubic-bezier(0.77, 0, 0.175, 1);
	}

	.scIn.accInLeft {
		position: relative;
		clip-path: inset(0% 100% 0% 0%);
	}

	.scIn.accInLeft.move {
		clip-path: inset(0% 0% 0% 0%);
		transition: clip-path 1000ms cubic-bezier(0.77, 0, 0.175, 1);
	}

	.scIn.accInBottom {
		position: relative;
		clip-path: inset(100% 0% 0% 0%);
	}

	.scIn.accInBottom.move {
		clip-path: inset(0% 0% 0% 0%);
		transition: clip-path 1000ms cubic-bezier(0.77, 0, 0.175, 1);
	}

	.scIn.accInRight {
		position: relative;
		clip-path: inset(0% 0% 0% 100%);
	}

	.scIn.accInRight.move {
		clip-path: inset(0% 0% 0% 0%);
		transition: clip-path 1000ms cubic-bezier(0.77, 0, 0.175, 1);
	}

	.scIn.fadeIn {
		opacity: 0;
	}

	.scIn.fadeIn.move {
		opacity: 1;
		transition: opacity 1000ms cubic-bezier(0.25, 0.25, 0.75, 0.75);
	}

	.scIn.zoomIn {
		transform: scale(0);
	}

	.scIn.zoomIn.move {
		transform: scale(1);
		transition: transform 1000ms cubic-bezier(0.165, 0.84, 0.44, 1);
	}

	.scIn.slideInTop {
		opacity: 0;
		transform: translateY(-50px);
	}

	.scIn.slideInTop.move {
		opacity: 1;
		transform: translateY(0px);
		transition:
			opacity 1000ms cubic-bezier(0.165, 0.84, 0.44, 1),
			transform 1000ms cubic-bezier(0.165, 0.84, 0.44, 1);
	}

	.scIn.slideInBottom {
		opacity: 0;
		transform: translateY(50px);
	}

	.scIn.slideInBottom.move {
		opacity: 1;
		transform: translateY(0px);
		transition:
			opacity 1000ms cubic-bezier(0.165, 0.84, 0.44, 1),
			transform 1000ms cubic-bezier(0.165, 0.84, 0.44, 1);
	}

	.scIn.slideInLeft {
		opacity: 0;
		transform: translateX(-50px);
	}

	.scIn.slideInLeft.move {
		opacity: 1;
		transform: translateX(0px);
		transition:
			opacity 1000ms cubic-bezier(0.165, 0.84, 0.44, 1),
			transform 1000ms cubic-bezier(0.165, 0.84, 0.44, 1);
	}

	.scIn.slideInRight {
		opacity: 0;
		transform: translateX(50px);
	}

	.scIn.slideInRight.move {
		opacity: 1;
		transform: translateX(0px);
		transition:
			opacity 1000ms cubic-bezier(0.165, 0.84, 0.44, 1),
			transform 1000ms cubic-bezier(0.165, 0.84, 0.44, 1);
	}

	.scIn.move.delay100 {
		transition-delay: 100ms !important;
	}

	.scIn.move.delay200 {
		transition-delay: 200ms !important;
	}

	.scIn.move.delay300 {
		transition-delay: 300ms !important;
	}

	.scIn.move.delay400 {
		transition-delay: 400ms !important;
	}

	.scIn.move.delay500 {
		transition-delay: 500ms !important;
	}

	.scIn.move.delay600 {
		transition-delay: 600ms !important;
	}

	.scIn.move.delay700 {
		transition-delay: 700ms !important;
	}

	.scIn.move.delay800 {
		transition-delay: 800ms !important;
	}

	.scIn.move.delay900 {
		transition-delay: 900ms !important;
	}

	.scIn.move.delay1000 {
		transition-delay: 1000ms !important;
	}

	.scIn.move.delay1100 {
		transition-delay: 1100ms !important;
	}

	.scIn.move.delay1200 {
		transition-delay: 1200ms !important;
	}

	.scIn.move.delay1300 {
		transition-delay: 1300ms !important;
	}

	.scIn.move.delay1400 {
		transition-delay: 1400ms !important;
	}

	.scIn.move.delay1500 {
		transition-delay: 1500ms !important;
	}

	.scIn.move.delay1600 {
		transition-delay: 1600ms !important;
	}

	.scIn.move.delay1700 {
		transition-delay: 1700ms !important;
	}

	.scIn.move.delay1800 {
		transition-delay: 1800ms !important;
	}

	.scIn.move.delay1900 {
		transition-delay: 1900ms !important;
	}

	.scIn.move.delay2000 {
		transition-delay: 2000ms !important;
	}
}

body {
	background-color: #fff;
	color: #000;
	font:
		16px/1.4em "Yu Gothic",
		"游ゴシック",
		YuGothic,
		"游ゴシック体",
		"ヒラギノ角ゴ Pro W3",
		"Hiragino Kaku Gothic",
		"メイリオ",
		Meiryo,
		Helvetica,
		sans-serif;
	visibility: hidden;
}

body.loaded {
	visibility: inherit;
}

@media print, screen and (min-width: 768px) {
	.sp {
		display: none !important;
	}
}

@media only screen and (max-width: 767px) {
	body {
		-webkit-tap-highlight-color: rgba(0, 0, 0, 0);
		-webkit-text-size-adjust: 100%;
		-webkit-touch-callout: none;
		-webkit-user-select: none;
	}

	.pc {
		display: none !important;
	}
}

img {
	width: 100%;
}

#content {
	overflow: clip;
	position: relative;
}

@media only screen and (max-width: 767px) {
	#content {
		padding-bottom: 1px;
	}
}

body {
	overflow: clip;
	position: relative;
}

body.openingEnd {
	overflow: inherit;
	position: relative;
	left: inherit;
	top: inherit;
}

.effect {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	pointer-events: none;
	overflow: clip;
	container-type: inline-size;
}

.effect.effect-backtop {
	z-index: 0;
}

.effect.effect-backbottom {
	z-index: 0;
}

.effect.effect-front {
	z-index: 2;
}

@media only screen and (max-width: 767px) {
	.effect.effect-front {
		display: none;
	}
}

@media only screen and (max-width: 767px) {
	.effect.effect-backtop {
		background: url(../img/img_back_sp_top.png) center top/100vw auto no-repeat;
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
	}

	.effect.effect-backbottom {
		background: url(../img/img_back_sp_bottom.png) center bottom/100vw auto
			no-repeat;
		position: absolute;
		top: 0;
		bottom: 0;
		width: 100%;
		height: 100%;
		transform-origin: center bottom;
		transform: scale(1, 1.25);
	}

	.effect.effect-fronttop {
		z-index: 2;
		background: url(../img/img_back_sp_01.png) center top/100vw auto no-repeat;
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
	}

	.effect.effect-frontbottom {
		z-index: 2;
		background: url(../img/img_back_sp_02.png) center calc(100% - 100vw) / 100vw
			auto no-repeat;
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
	}
}

.article {
	padding: 0 100px;
	position: relative;
	z-index: 10;
}

@media only screen and (max-width: 767px) {
	.article {
		padding: 0 6.6666666667vw;
	}
}

.article-inner {
	margin: 0 auto;
}

@media print, screen and (min-width: 768px) {
	.article-inner {
		max-width: 1024px;
	}
}

.article-hdg {
	display: flex;
	flex-direction: column;
	gap: 20px;
	margin-bottom: 60px;
	width: -moz-fit-content;
	width: fit-content;
}

@media only screen and (max-width: 767px) {
	.article-hdg {
		gap: 2.6666666667vw;
		margin-bottom: 5.3333333333vw;
	}
}

.article-hdg h2 {
	width: -moz-fit-content;
	width: fit-content;
	font:
		400 48px "游明朝",
		YuMincho,
		"ヒラギノ明朝 ProN W3",
		"Hiragino Mincho ProN",
		"HG明朝E",
		"ＭＳ Ｐ明朝",
		"ＭＳ 明朝",
		serif;
	letter-spacing: 0.2em;
	line-height: 1.2em;
}

@media only screen and (max-width: 767px) {
	.article-hdg h2 {
		font-size: 6.6666666667vw;
	}
}

.article-hdg .en {
	width: -moz-fit-content;
	width: fit-content;
	font:
		18px "georgia",
		sans-serif;
	line-height: 1em;
	letter-spacing: 0.2em;
}

@media only screen and (max-width: 767px) {
	.article-hdg .en {
		font-size: 2.9333333333vw;
	}
}

.article-hdg:after {
	content: "";
	width: 270px;
	height: 1px;
	background: linear-gradient(to right, #cc1433 0%, #003366 100%);
}

@media only screen and (max-width: 767px) {
	.article-hdg:after {
		width: 40vw;
	}
}

.header {
	container-type: inline-size;
	position: fixed;
	left: 0;
	width: 100%;
	z-index: 999;
	display: flex;
	align-items: center;
	top: -100px;
}

body.openKV .header {
	top: 30px;
	transition: top 400ms 1600ms;
}

@media only screen and (max-width: 767px) {
	body.openKV .header {
		top: 0;
	}
}

.header-logos {
	width: -moz-fit-content;
	width: fit-content;
	border-radius: 0 100px 100px 0;
	height: 72px;
	background-color: rgba(255, 255, 255, 0.7);
	backdrop-filter: blur(8px);
	padding: 0px 30px;
	display: flex;
	align-items: center;
	gap: 20px;
	box-sizing: border-box;
	position: relative;
	z-index: 1;
}

@media only screen and (max-width: 767px) {
	.header-logos {
		top: 4vw;
		height: 12vw;
		gap: 2.6666666667vw;
		padding: 0px 4vw;
	}
}

.header-logo-orixrentec {
	display: block;
	background: url(../img/img_orlogo.svg) 0 0/100% 100%;
	width: 218.581px;
	aspect-ratio: 218.581/38.165;
	text-indent: -9999px;
	overflow: clip;
	position: relative;
}

@media only screen and (max-width: 767px) {
	.header-logo-orixrentec {
		width: 32vw;
	}
}

.header-logo-50th {
	position: relative;
	background: url(../img/img_50thlogo_01.svg) 0 0/100% 100%;
	width: 62px;
	aspect-ratio: 498.91/377.94;
	text-indent: -9999px;
	overflow: clip;
}

@media only screen and (max-width: 767px) {
	.header-logo-50th {
		width: 10.4vw;
	}
}

@media print, screen and (min-width: 768px) {
	.header-nav {
		flex: 1;
	}
}

@media only screen and (max-width: 767px) {
	.header-nav::before {
		content: "";
		position: fixed;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		background-color: rgba(0, 51, 102, 0.1);
		opacity: 0;
		transition: opacity 400ms;
		pointer-events: none;
	}

	body.openMenu .header-nav::before {
		opacity: 1;
	}
}

.header-nav ul {
	align-items: center;
	display: flex;
}

@media print, screen and (min-width: 768px) {
	.header-nav ul {
		margin-left: 30px;
		margin-right: 30px;
		gap: 10px 30px;
		flex: 1;
		justify-content: flex-end;
		flex-wrap: wrap;
	}
}

@media only screen and (max-width: 767px) {
	.header-nav ul {
		position: fixed;
		right: -45%;
		top: 4vw;
		width: 45%;
		height: 120vw;
		background-color: rgba(255, 255, 255, 0.7);
		backdrop-filter: blur(8px);
		align-items: flex-start;
		justify-content: center;
		flex-direction: column;
		gap: 8cqw;
		box-sizing: border-box;
		padding: 6.6666666667vw;
		transition: right 400ms;
		border-radius: 30px 0 0 30px;
	}

	body.openMenu .header-nav ul {
		right: -1px;
	}

	body.openMenu {
		overflow: clip;
	}
}

.header-nav ul li a {
	color: #003366;
	font:
		500 18px "georgia",
		sans-serif;
	text-decoration: none;
	line-height: 1em;
	letter-spacing: 0.1em;
	transition: color 400ms linear;
	position: relative;
}

@media print, screen and (min-width: 768px) {
	.header-nav ul li a::after {
		content: "";
		width: 0;
		height: 1px;
		background-color: #003366;
		display: block;
		transition: width 250ms;
	}

	.header-nav ul li a:hover::after {
		width: 100%;
	}
}

@media only screen and (max-width: 767px) {
	.header-nav ul li a {
		color: #003366;
		font-weight: 600;
		font-size: 4.2666666667vw;
	}
}

.header-menubtn {
	position: absolute;
	right: 4vw;
	top: 4vw;
	width: 10.6666666667vw;
	height: 10.6666666667vw;
	display: block;
}

@media print, screen and (min-width: 768px) {
	.header-menubtn {
		display: none;
	}
}

.header-menubtn-ln {
	display: block;
	width: 10.6666666667vw;
	margin-left: -5.3333333333vw;
	height: 1px;
	background-color: #003366;
	position: absolute;
	left: 50%;
	top: 50%;
	transition:
		transform 400ms ease,
		margin-top 400ms ease,
		background-color 400ms ease;
}

.header-menubtn-ln:nth-child(1) {
	margin-top: -2vw;
}

.header-menubtn-ln:nth-child(3) {
	margin-top: 2vw;
}

body.openMenu .header-menubtn-ln {
	background-color: #003366 !important;
}

body.openMenu .header-menubtn-ln:nth-child(1) {
	margin-top: 0vw;
	transform: rotate(30deg);
}

body.openMenu .header-menubtn-ln:nth-child(2) {
	transform: scale(0, 1);
}

body.openMenu .header-menubtn-ln:nth-child(3) {
	margin-top: 0vw;
	transform: rotate(-30deg);
}

.header.white .header-menubtn-ln {
	background-color: #fff;
}

@media print, screen and (min-width: 768px) {
	.header.white .header-nav li a {
		color: #fff;
	}

	.header.white .header-nav li a::after {
		background-color: #fff;
	}
}

.footer {
	box-sizing: border-box;
	color: #fff;
	z-index: 999;
	position: relative;
	margin-top: 60px;
}

@media only screen and (max-width: 767px) {
	.footer {
		margin-top: 5.3333333333vw;
	}
}

.footer .article-inner {
	position: relative;
}

@media print, screen and (min-width: 768px) {
	.footer .article-inner {
		padding-top: 60px;
		margin-bottom: 40px;
	}
}

@media only screen and (max-width: 767px) {
	.footer .article-inner {
		padding-top: 2.6666666667vw;
		margin-bottom: 6.6666666667vw;
	}
}

.footer .article-inner::before {
	content: "";
	background-color: #fff;
	height: 1px;
	width: 100%;
	position: absolute;
	left: 0;
	top: 0;
}

@media only screen and (max-width: 767px) {
	.footer .article-inner::before {
		width: 100%;
	}
}

.footer-totop {
	display: block;
	background: url(../img/btn_totop.svg) center 46%/31px 24px no-repeat;
	aspect-ratio: 1;
	width: 80px;
	position: absolute;
	right: 0;
	top: 100px;
	border: 1px solid #fff;
	border-radius: 100%;
	transition: background-color 250ms;
}

@media print, screen and (min-width: 768px) {
	.footer-totop span {
		display: block;
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
	}

	.footer-totop span::before {
		content: "";
		position: absolute;
		left: calc(50% - 36px);
		top: calc(50% - 36px);
		width: 70px;
		height: 70px;
		border: 1px solid #fff;
		border-radius: 100%;
	}

	.footer-totop span:nth-child(1) {
		clip-path: inset(0 0 100% 50%);
		transition: clip-path 150ms;
	}

	.footer-totop span:nth-child(2) {
		clip-path: inset(100% 50% 0 0);
		transition: clip-path 150ms;
	}

	.footer-totop:hover {
		background-color: rgba(23, 26, 31, 0.5);
	}

	.footer-totop:hover span:nth-child(1) {
		clip-path: inset(0 0 0 50%);
		transition-delay: 0ms;
	}

	.footer-totop:hover span:nth-child(2) {
		clip-path: inset(0 50% 0 0);
		transition-delay: 150ms;
	}
}

.footer ul {
	display: flex;
	flex-direction: column;
	gap: 10px;
}

@media only screen and (max-width: 767px) {
	.footer ul {
		gap: 0.9333333333vw;
		margin-top: 2.6666666667vw;
	}
}

.footer ul li a {
	text-decoration: none;
	color: #fff;
	font-weight: 500;
	line-height: 1.35em;
	width: -moz-fit-content;
	width: fit-content;
	display: block;
}

@media print, screen and (min-width: 768px) {
	.footer ul li a::after {
		content: "";
		width: 0;
		height: 1px;
		background-color: #fff;
		display: block;
		transition: width 250ms;
	}

	.footer ul li a:hover::after {
		width: 100%;
	}
}

@media only screen and (max-width: 767px) {
	.footer ul li a {
		font-size: 3.2vw;
	}
}

.footer-copyright {
	margin-top: 20px;
	font:
		14px "georgia",
		sans-serif;
}

@media print, screen and (min-width: 768px) {
	.footer-copyright {
		text-align: right;
		letter-spacing: 0.1em;
	}
}

@media only screen and (max-width: 767px) {
	.footer-copyright {
		margin-top: 4vw;
		font-size: 2.5333333333vw;
	}
}

.ef {
	z-index: 1;
	position: absolute;
	left: 0;
	top: 0;
	width: 200px;
	height: 173.21px;
	margin: -86.605px 0 0 -100px;
}

.ef.col-01 {
	background: url(../img/img_effect_01.webp) no-repeat;
}

.ef.blur.col-01 {
	background: url(../img/img_effect_01_blur.webp) no-repeat;
}

.ef.col-02 {
	background: url(../img/img_effect_02.webp) no-repeat;
}

.ef.blur.col-02 {
	background: url(../img/img_effect_02_blur.webp) no-repeat;
}

.ef.col-03 {
	background: url(../img/img_effect_03.webp) no-repeat;
}

.ef.blur.col-03 {
	background: url(../img/img_effect_03_blur.webp) no-repeat;
}

.ef.col-04 {
	background: url(../img/img_effect_04.webp) no-repeat;
}

.ef.blur.col-04 {
	background: url(../img/img_effect_04_blur.webp) no-repeat;
}

.ef.col-05 {
	background: url(../img/img_effect_05.webp) no-repeat;
}

.ef.blur.col-05 {
	background: url(../img/img_effect_05_blur.webp) no-repeat;
}

.ef.col-06 {
	background: url(../img/img_effect_06.webp) no-repeat;
}

.ef.blur.col-06 {
	background: url(../img/img_effect_06_blur.webp) no-repeat;
}

.ef.col-07 {
	background: url(../img/img_effect_07.webp) no-repeat;
}

.ef.blur.col-07 {
	background: url(../img/img_effect_07_blur.webp) no-repeat;
}

.ef.col-08 {
	background: url(../img/img_effect_08.webp) no-repeat;
}

.ef.blur.col-08 {
	background: url(../img/img_effect_08_blur.webp) no-repeat;
}

.ef.col-09 {
	background: url(../img/img_effect_09.webp) no-repeat;
}

.ef.blur.col-09 {
	background: url(../img/img_effect_09_blur.webp) no-repeat;
}

.ef.col-10 {
	background: url(../img/img_effect_10.webp) no-repeat;
}

.ef.blur.col-10 {
	background: url(../img/img_effect_10_blur.webp) no-repeat;
}

.ef.col-11 {
	background: url(../img/img_effect_11.webp) no-repeat;
}

.ef.blur.col-11 {
	background: url(../img/img_effect_11_blur.webp) no-repeat;
}

.ef.fall {
	z-index: 4;
}

.lef {
	background-size: 100% 100%;
	position: absolute;
	box-sizing: border-box;
	left: 0;
	top: 0;
}

.efo {
	pointer-events: none;
	z-index: 1;
	position: absolute;
	left: -25px;
	top: -25px;
	background-position: center;
	background-size: auto;
	background-repeat: no-repeat;
	width: 50px;
	height: 50px;
}

.opening {
	pointer-events: none;
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 99999;
	background-color: rgb(255, 255, 255);
	display: flex;
	justify-content: center;
	align-items: center;
	container-type: inline-size;
}

body.openingEnd .opening {
	opacity: 0;
	visibility: hidden;
	transition:
		opacity 1000ms,
		visibility 1000ms;
}

.opening-envelope {
	width: min(46cqw, 76.2986666667cqh);
	aspect-ratio: 622/375;
	position: relative;
	transform: translateY(30cqh);
	opacity: 0;
}

@media only screen and (max-width: 767px) {
	.opening-envelope {
		width: 64cqw;
	}
}

body.loaded .opening-envelope {
	opacity: 1;
	transition-timing-function: cubic-bezier(0.165, 0.84, 0.44, 1);
	transform: translateY(20cqh);
	transition:
		opacity 1000ms,
		transform 1000ms;
}

.opening-base {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 0;
}

.opening-base::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: url(../img/img_opening_01.svg) 0 0/100% 100%;
}

.opening-base::after {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: url(../img/img_opening_01_02.svg) 0 0/100% 100%;
	opacity: 0;
}

body.loaded .opening-base::after {
	transition: opacity 2000ms 1000ms;
	opacity: 1;
}

.opening-body {
	position: absolute;
	left: 0;
	top: 0;
	background: url(../img/img_opening_02.svg) 0 0/100% 100%;
	width: 100%;
	height: 100%;
	z-index: 2;
}

.opening-flap {
	background-color: #f00;
	position: absolute;
	left: 0;
	bottom: calc(100% - 1cqw);
	background: url(../img/img_opening_03.svg) 0 0/100% 100%;
	width: calc(100% - 0.05cqw);
	aspect-ratio: 622/224;
	transform-origin: center bottom;
	transform: scale(1, -1);
	z-index: 3;
}

body.loaded .opening-flap {
	z-index: 0;
	bottom: calc(100% - 0.5cqw);
	transform: scale(1, 1);
	transition:
		transform 1000ms cubic-bezier(0.645, 0.045, 0.355, 1) 1000ms,
		bottom 1000ms cubic-bezier(0.645, 0.045, 0.355, 1) 1000ms,
		z-index 0ms ease 2000ms;
}

.opening-effects {
	position: absolute;
	left: 50%;
	top: 50%;
}

.kv {
	position: relative;
	container-type: size;
	z-index: inherit;
	height: 100dvh;
}

@media print, screen and (min-width: 768px) {
	.kv {
		min-height: 600px;
	}
}

@media only screen and (max-width: 767px) {
	.kv {
		min-height: 160vw;
	}
}

.kv-inner {
	display: flex;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	z-index: 10;
	box-sizing: border-box;
}

.kv-back {
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: url(../img/img_kv_back.webp) center/cover no-repeat fixed;
	z-index: -1;
}

.kv-hdg {
	font:
		400 min(80px, 5cqw) "游明朝",
		YuMincho,
		"ヒラギノ明朝 ProN W3",
		"Hiragino Mincho ProN",
		"HG明朝E",
		"ＭＳ Ｐ明朝",
		"ＭＳ 明朝",
		serif;
	letter-spacing: 0.2em;
	line-height: 1.25em;
	color: #fff;
	opacity: 0;
	text-align: center;
	position: absolute;
	left: 0;
	width: 100%;
	top: calc(50% - 0.65em);
}

@media print, screen and (min-width: 768px) {
	.kv-hdg {
		filter: blur(8px);
	}
}

@media only screen and (max-width: 767px) {
	.kv-hdg {
		font-size: 9.3333333333vw;
		top: 40%;
	}
}

.kv-doc {
	width: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	position: absolute;
	left: 0;
	bottom: calc(140px + (100% - 140px) * 0.05);
	width: 100%;
}

@media only screen and (max-width: 767px) {
	.kv-doc {
		bottom: calc(140px + (100% - 140px) * 0.15);
	}
}

.kv-doc p {
	color: #fff;
	font-family:
		"游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN",
		"HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	line-height: 1.2em;
	text-align: center;
}

.kv-doc p:nth-child(1) {
	letter-spacing: 0.1em;
	font-size: 40px;
	opacity: 0;
}

@media print, screen and (min-width: 768px) {
	.kv-doc p:nth-child(1) {
		filter: blur(8px);
	}
}

@media only screen and (max-width: 767px) {
	.kv-doc p:nth-child(1) {
		font-size: 5.3333333333vw;
	}
}

.kv-doc p:nth-child(2) {
	letter-spacing: 0.1em;
	font-size: 35px;
	opacity: 0;
}

@media print, screen and (min-width: 768px) {
	.kv-doc p:nth-child(2) {
		filter: blur(8px);
	}
}

@media only screen and (max-width: 767px) {
	.kv-doc p:nth-child(2) {
		font-size: 4.8vw;
	}
}

.kv-scroll {
	position: absolute;
	left: 50%;
	bottom: 0;
	width: 1px;
	height: 110px;
	transition:
		opacity 400ms linear,
		visibility 400ms linear;
}

.kv-scroll-inner {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	background-color: #fff;
}

.kv-scroll span {
	width: 23px;
	height: 23px;
	border: 1px solid #fff;
	border-radius: 100%;
	margin-left: -11.5px;
	margin-top: -11.5px;
	display: block;
	position: absolute;
	display: flex;
	align-items: center;
	justify-content: center;
	animation-name: anm_scroll;
	animation-duration: 2000ms;
	animation-iteration-count: infinite;
}

.kv-scroll span::before {
	background: #2392d8;
	content: "";
	display: block;
	width: 5px;
	height: 5px;
	border-radius: 100%;
	border: 1px solid #fff;
}

body.openKV.scroll .kv .kv-scroll {
	opacity: 0;
	visibility: hidden;
}

@keyframes anm_scroll {
	0% {
		transform: translateY(0) scale(0);
		animation-timing-function: cubic-bezier(0.25, 0.25, 0.75, 0.75);
	}

	20% {
		transform: translateY(0) scale(1);
		animation-timing-function: cubic-bezier(0.645, 0.045, 0.355, 1);
	}

	80% {
		transform: translateY(110px) scale(1);
		animation-timing-function: cubic-bezier(0.25, 0.25, 0.75, 0.75);
	}

	100% {
		transform: translateY(110px) scale(0);
	}
}

body.openKV .kv .kv-hdg {
	transition:
		filter 1000ms linear,
		opacity 1000ms linear;
	filter: blur(0px);
	opacity: 1;
}

body.openKV .kv .kv-doc p:nth-child(1) {
	transition:
		filter 1000ms linear 400ms,
		opacity 1000ms linear 400ms;
	filter: blur(0px);
	opacity: 1;
}

body.openKV .kv .kv-doc p:nth-child(2) {
	transition:
		filter 1000ms linear 800ms,
		opacity 1000ms linear 800ms;
	filter: blur(0px);
	opacity: 1;
}

body.openKV .kv .kv-scroll-inner {
	transition: opacity 1000ms linear 1200ms;
	opacity: 1;
}

.intro {
	padding: 800px 0 400px 0;
}

@media only screen and (max-width: 767px) {
	.intro {
		padding: 50vw 0 50vw 0;
	}
}

.intro-doc {
	display: flex;
	flex-direction: column;
	gap: 60px;
}

@media only screen and (max-width: 767px) {
	.intro-doc {
		gap: 8vw;
	}
}

.intro-doc p {
	color: #003366;
	font:
		500 20px "游明朝",
		YuMincho,
		"ヒラギノ明朝 ProN W3",
		"Hiragino Mincho ProN",
		"HG明朝E",
		"ＭＳ Ｐ明朝",
		"ＭＳ 明朝",
		serif;
	text-align: center;
	line-height: 2.4em;
}

@media only screen and (max-width: 767px) {
	.intro-doc p {
		font-size: 4.2666666667vw;
	}
}

.intro-doc p {
	transition: color 400ms linear;
}

.anc#message {
	position: relative;
	top: -130px;
}

@media only screen and (max-width: 767px) {
	.anc#message {
		top: -26.6666666667vw;
	}
}

.message {
	position: relative;
	z-index: 11;
}

.message .article-hdg {
	grid-area: hdg;
	color: #003366;
}

.message-doc {
	grid-area: doc;
	flex-direction: column;
	position: relative;
	display: block;
}

.message-doc-text {
	font-size: 18px;
	line-height: 2em;
	position: relative;
	z-index: 1;
	margin-bottom: 20px;
	opacity: 0;
}

@media only screen and (max-width: 767px) {
	.message-doc-text {
		font-size: 3.7333333333vw;
	}
}

.message-doc.move .message-doc-text {
	opacity: 1;
	transition: opacity 1000ms cubic-bezier(0.25, 0.25, 0.75, 0.75);
}

.message-doc.move .message-doc-text.message-doc-text-01 {
	transition-delay: 200ms;
}

.message-doc.move .message-doc-text.message-doc-text-02 {
	transition-delay: 400ms;
}

.message-doc.move .message-doc-text.message-doc-text-03 {
	transition-delay: 600ms;
}

.message-doc.move .message-doc-text.message-doc-text-04 {
	transition-delay: 800ms;
}

.message-ceo {
	text-align: center;
	position: relative;
	opacity: 0;
}

@media print, screen and (min-width: 768px) {
	.message-ceo {
		aspect-ratio: 517/727;
		margin-left: 100px;
		margin-right: 50px;
		float: right;
		width: 258.5px;
	}
}

@media print, screen and (min-width: 768px) {
	.message-ceo figure {
		position: absolute;
		right: 0;
		bottom: 0;
		width: 258.5px;
	}
}

@media only screen and (max-width: 767px) {
	.message-ceo figure {
		position: relative;
		width: 45.8666666667vw;
		margin-left: auto;
	}
}

.message-ceo figure img {
	position: relative;
	z-index: 1;
}

.message-ceo figure::after {
	z-index: 2;
	content: "";
	position: absolute;
	right: -100px;
	bottom: -50px;
	background: url(../img/img_message_tri_01_pc.webp) 0 0/100% 100%;
	aspect-ratio: 951/335;
	width: 475.5px;
}

@media only screen and (max-width: 767px) {
	.message-ceo figure::after {
		background: url(../img/img_message_tri_01_sp.webp) 0 0/100% 100%;
		aspect-ratio: 479/177;
		width: 63.8666666667vw;
		right: -5.3333333333vw;
		bottom: -13.3333333333vw;
	}
}

.message-ceo figure::before {
	content: "";
	position: absolute;
	right: -160px;
	bottom: -240px;
	background: url(../img/img_message_tri_02_pc.webp) 0 0/100% 100%;
	aspect-ratio: 465/750;
	width: 465px;
}

@media only screen and (max-width: 767px) {
	.message-ceo figure::before {
		background: url(../img/img_message_tri_02_sp.webp) 0 0/100% 100%;
		aspect-ratio: 894/1268;
		width: 119.2vw;
		right: -26.6666666667vw;
		bottom: -20vw;
	}
}

.message-ceo-names {
	position: absolute;
	z-index: 4;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

@media print, screen and (min-width: 768px) {
	.message-ceo-names {
		right: 40px;
		bottom: 0;
		color: #fff;
	}
}

@media only screen and (max-width: 767px) {
	.message-ceo-names {
		gap: 2.6666666667vw;
		left: 0;
		top: 13.3333333333vw;
	}
}

.message-ceo-job {
	font-size: 18px;
	font-weight: 600;
	position: relative;
	clip-path: inset(0% 100% 0% 0%);
}

@media only screen and (max-width: 767px) {
	.message-ceo-job {
		font-size: 3.7333333333vw;
	}
}

.message-ceo-name {
	font-size: 24px;
	font-weight: 600;
	position: relative;
	clip-path: inset(0% 100% 0% 0%);
}

@media only screen and (max-width: 767px) {
	.message-ceo-name {
		font-size: 4.8vw;
	}
}

.message-ceo.move {
	opacity: 1;
	transition: opacity 1000ms cubic-bezier(0.25, 0.25, 0.75, 0.75);
}

.message-ceo.move .message-ceo-job {
	clip-path: inset(0% 0% 0% 0%);
	transition: clip-path 1000ms cubic-bezier(0.77, 0, 0.175, 1);
	transition-delay: 200ms;
}

.message-ceo.move .message-ceo-name {
	clip-path: inset(0% 0% 0% 0%);
	transition: clip-path 1000ms cubic-bezier(0.77, 0, 0.175, 1);
	transition-delay: 600ms;
}

.anc#logostory {
	position: relative;
	top: -130px;
}

@media only screen and (max-width: 767px) {
	.anc#logostory {
		top: -13.3333333333vw;
	}
}

@media print, screen and (min-width: 768px) {
	.logostory .article-inner {
		padding: 500px 0 300px;
		display: grid;
		grid-template: "hdg hdg hdg" "... ... ..." 70px "logo ... doc"/360px 80px 1fr;
	}
}

@media only screen and (max-width: 767px) {
	.logostory .article-inner {
		padding: 20vw 0;
	}
}

.logostory .article-hdg {
	grid-area: hdg;
	color: #003366;
}

@media print, screen and (min-width: 768px) {
	.logostory .article-hdg {
		text-align: center;
		margin-left: auto;
		margin-right: auto;
	}

	.logostory .article-hdg .en {
		margin: 0 auto;
	}

	.logostory .article-hdg::after {
		margin: 0 auto;
	}
}

.logostory-logo {
	z-index: -1;
	grid-area: logo;
	position: relative;
	width: 360px;
	aspect-ratio: 498.91/377.94;
}

@media only screen and (max-width: 767px) {
	.logostory-logo {
		margin-top: 10.6666666667vw;
		width: 53.3333333333vw;
		margin: 0 auto;
	}
}

.logostory-logo figure {
	width: 360px;
	aspect-ratio: 498.91/377.94;
	position: fixed;
	left: 50%;
	top: 50%;
	transform: translate(-50%, -50%);
	transition: opacity 400ms linear;
	opacity: 0.1;
}

@media only screen and (max-width: 767px) {
	.logostory-logo figure {
		width: 53.3333333333vw;
	}
}

.logostory-logo figure.fixedEnd {
	position: absolute;
	left: 0;
	top: 0;
	transform: translate(0px, 0px);
	opacity: 1;
}

.logostory-logo figure img {
	display: block;
	width: 360px;
	aspect-ratio: 498.91/377.94;
	will-change: transform;
	transform: scale(2);
}

@media only screen and (max-width: 767px) {
	.logostory-logo figure img {
		width: 53.3333333333vw;
	}
}

.logostory-doc {
	grid-area: doc;
	display: flex;
	flex-direction: column;
	gap: 40px;
}

@media only screen and (max-width: 767px) {
	.logostory-doc {
		margin-top: 10.6666666667vw;
	}
}

.logostory-doc p {
	font-size: 18px;
	line-height: 2em;
	opacity: 0;
}

@media only screen and (max-width: 767px) {
	.logostory-doc p {
		font-size: 3.7333333333vw;
	}
}

.logostory-doc.move p {
	opacity: 1;
	transition: opacity 1000ms cubic-bezier(0.25, 0.25, 0.75, 0.75);
}

.logostory-doc.move p:nth-child(2) {
	transition-delay: 200ms;
}

.history-cover {
	position: relative;
	height: 1200dvh;
}

@media only screen and (max-width: 767px) {
	.history-cover {
		height: 2400vw;
	}
}

.history-cover .history {
	position: sticky;
	left: 0;
	top: 0;
}

.history {
	padding: 0;
	container-type: size;
	overflow: hidden;
	height: 100cqh;
}

@media print, screen and (min-width: 768px) {
	.history {
		min-height: 660px;
	}
}

@media only screen and (max-width: 767px) {
	.history {
		height: 100dvh;
	}
}

.history {
	background: rgb(0, 51, 102);
}

.history-back {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	content: "";
	background: url(../img/img_history_triangles.webp) 0 center/auto 100%;
	opacity: 0.75;
}

.history .article-outer {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	display: flex;
}

.history-nav {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	box-sizing: border-box;
	z-index: 2;
	pointer-events: none;
}

.history-nav ul {
	position: absolute;
	right: 0;
	bottom: 5cqh;
	display: flex;
	width: 100%;
	justify-content: space-between;
}

@media only screen and (max-width: 767px) {
	.history-nav ul {
		bottom: 6.6666666667vw;
	}
}

.history-nav ul li {
	width: 120px;
}

.history-nav ul::before {
	content: "";
	position: absolute;
	right: 63px;
	bottom: 8px;
	width: calc(100% - 120px - 6px);
	height: 1px;
	background-color: #fff;
	display: block;
}

@media only screen and (max-width: 767px) {
	.history-nav ul::before {
		width: calc(100% - 16.6666666667vw - 0.8vw);
		right: 8.7333333333vw;
		bottom: 0.8vw;
	}
}

.history-nav ul li a {
	pointer-events: all;
	width: 120px;
	display: block;
	text-align: center;
	text-decoration: none;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

@media only screen and (max-width: 767px) {
	.history-nav ul li a {
		gap: 1.3333333333vw;
		width: 16.6666666667vw;
	}
}

.history-nav ul li a .text {
	color: #fff;
	letter-spacing: 0.1em;
	font:
		500 18px/1em "georgia",
		sans-serif;
}

@media only screen and (max-width: 767px) {
	.history-nav ul li a .text {
		font-size: 2.6666666667vw;
	}
}

.history-nav ul li a .marker {
	display: block;
	width: 20px;
	height: 20px;
	margin: 0 auto;
	position: relative;
}

@media only screen and (max-width: 767px) {
	.history-nav ul li a .marker {
		width: 2.6666666667vw;
		height: 2.6666666667vw;
	}
}

.history-nav ul li a .marker::before {
	display: block;
	content: "";
	width: 6px;
	height: 6px;
	border-radius: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -3px;
	margin-top: -3px;
	border: 1px solid #fff;
	background-color: #003366;
	transition:
		width 200ms ease,
		height 200ms ease,
		margin-left 200ms ease,
		margin-top 200ms ease;
}

@media only screen and (max-width: 767px) {
	.history-nav ul li a .marker::before {
		width: 0.8vw;
		height: 0.8vw;
		margin-left: -0.4vw;
		margin-top: -0.4vw;
	}
}

.history-nav ul li a .marker::after {
	display: block;
	content: "";
	width: 6px;
	height: 6px;
	border-radius: 100%;
	position: absolute;
	left: 50%;
	top: 50%;
	margin-left: -3px;
	margin-top: -3px;
	border: 1px solid #fff;
	transition:
		width 200ms ease,
		height 200ms ease,
		margin-left 200ms ease,
		margin-top 200ms ease;
}

@media only screen and (max-width: 767px) {
	.history-nav ul li a .marker::after {
		width: 0.8vw;
		height: 0.8vw;
		margin-left: -0.4vw;
		margin-top: -0.4vw;
	}
}

.history-nav ul li a.active .marker::before {
	width: 12px;
	height: 12px;
	margin-left: -6px;
	margin-top: -6px;
	background-color: #cc1433;
}

@media only screen and (max-width: 767px) {
	.history-nav ul li a.active .marker::before {
		width: 1.6vw;
		height: 1.6vw;
		margin-left: -0.8vw;
		margin-top: -0.8vw;
	}
}

.history-nav ul li a.active .marker::after {
	width: 20px;
	height: 20px;
	margin-left: -10px;
	margin-top: -10px;
}

@media only screen and (max-width: 767px) {
	.history-nav ul li a.active .marker::after {
		width: 2.6666666667vw;
		height: 2.6666666667vw;
		margin-left: -1.3333333333vw;
		margin-top: -1.3333333333vw;
	}
}

.history .article-hdg {
	color: #fff;
	z-index: 2;
	padding: calc(35cqh - 100px) 100px 0 100px;
}

@media only screen and (max-width: 767px) {
	.history .article-hdg {
		padding: 15cqh 13.3333333333vw 0 6.6666666667vw;
	}
}

.history .article-hdg h2 {
	white-space: nowrap;
	font-size: 48px;
}

@media only screen and (max-width: 767px) {
	.history .article-hdg h2 {
		font-size: 6.6666666667vw;
	}
}

.history .article-hdg .history-subtitle {
	white-space: nowrap;
	font-size: 24px;
	letter-spacing: 0.1em;
}

@media only screen and (max-width: 767px) {
	.history .article-hdg .history-subtitle {
		font-size: 3.7333333333vw;
	}
}

.history .set1 {
	display: flex;
	position: relative;
}

.history .set2 {
	position: relative;
	display: flex;
	gap: 20px;
	padding: calc(35cqh - 100px) 100px 0 0;
}

@media only screen and (max-width: 767px) {
	.history .set2 {
		padding: 15cqh 13.3333333333vw 0 0;
	}
}

.history-gens {
	display: flex;
	position: relative;
	overflow-y: hidden;
	overflow-x: auto;
	height: 100%;
	box-sizing: border-box;
	z-index: 1;
}

.history-gens::-webkit-scrollbar {
	height: 0;
}

.history-gen {
	box-sizing: border-box;
	position: relative;
	display: flex;
	justify-content: center;
	box-sizing: border-box;
	height: 100%;
}

.history-gen.rev .history-year-inner {
	padding: 40px 0 40px 60px;
}

@media only screen and (max-width: 767px) {
	.history-gen.rev .history-year-inner {
		padding: 5.3333333333vw 0 5.3333333333vw 5.3333333333vw;
	}
}

.history-gen.rev .history-year-inner::after {
	bottom: inherit;
	top: 0;
}

.history-gen.rev .history-year-inner h3 {
	top: inherit;
	bottom: 0px;
}

.history-gen.rev .history-year-inner h3 span {
	margin: calc(-0.5em + 6px) 0 0 40px;
}

@media only screen and (max-width: 767px) {
	.history-gen.rev .history-year-inner h3 span {
		margin: calc(-0.5em + 6px) 0 0 6.6666666667vw;
	}
}

.history-gen.rev .history-year-inner h3::before {
	top: 6px;
}

@media only screen and (max-width: 767px) {
	.history-gen.rev .history-year-inner h3::before {
		top: 1.2vw;
	}
}

.history-gen.rev .history-year-inner h3::after {
	top: 6px;
}

@media only screen and (max-width: 767px) {
	.history-gen.rev .history-year-inner h3::after {
		top: 1.2vw;
	}
}

.history-gen-back-under {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

.history-gen-back-under-inner {
	display: block;
	position: sticky;
	left: 0;
	top: 0;
	width: 100cqw;
	height: 100%;
}

.history-gen-back-under-inner::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	display: block;
	width: 100%;
	height: 100%;
	background: rgba(0, 51, 102, 0.5);
}

.history-gen-back-over {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

.history-gen-back-over-inner {
	display: block;
	position: sticky;
	left: 0;
	top: 0;
	width: 100cqw;
	height: 100%;
}

.history-gen-back-over .tri {
	content: "";
	position: absolute;
	left: 0px;
	top: -50px;
}

@media only screen and (max-width: 767px) {
	.history-gen-back-over .tri {
		top: 0vw;
		left: -10cqw;
	}
}

.history-gen-back-over p {
	font:
		220px "georgia",
		sans-serif;
	color: #fff;
	opacity: 0.2;
	position: absolute;
	left: 0;
	top: 10cqh;
	line-height: 1em;
	display: block;
}

@media only screen and (max-width: 767px) {
	.history-gen-back-over p {
		font-size: 29.3333333333vw;
		top: 5cqh;
	}
}

.history-gen-title {
	pointer-events: all;
	color: #fff;
	position: relative;
	z-index: 1;
	margin: 0 100px 0;
	box-sizing: border-box;
	display: flex;
	flex-direction: column;
	gap: 20px;
}

@media print, screen and (min-width: 768px) {
	.history-gen-title {
		min-width: 450px;
	}
}

@media only screen and (max-width: 767px) {
	.history-gen-title {
		width: 58.6666666667vw;
		margin: 0 10.6666666667vw 0 10.6666666667vw;
		gap: 2.6666666667vw;
	}
}

.history-gen-title .num {
	font:
		500 18px "georgia",
		sans-serif;
	letter-spacing: 0.1em;
}

@media only screen and (max-width: 767px) {
	.history-gen-title .num {
		font-size: 2.9333333333vw;
	}
}

.history-gen-title .num span {
	font:
		500 28px "georgia",
		sans-serif;
	letter-spacing: 0.1em;
}

@media only screen and (max-width: 767px) {
	.history-gen-title .num span {
		font-size: 4.2666666667vw;
	}
}

.history-gen-title h3 {
	font:
		500 28px "游明朝",
		YuMincho,
		"ヒラギノ明朝 ProN W3",
		"Hiragino Mincho ProN",
		"HG明朝E",
		"ＭＳ Ｐ明朝",
		"ＭＳ 明朝",
		serif;
	letter-spacing: 0.1em;
	white-space: nowrap;
}

@media only screen and (max-width: 767px) {
	.history-gen-title h3 {
		font-size: 4.8vw;
	}
}

.history-gen-title .lead {
	line-height: 2em;
	font-size: 18px;
}

@media print, screen and (min-width: 768px) {
	.history-gen-title .lead {
		letter-spacing: 0.1em;
	}
}

@media only screen and (max-width: 767px) {
	.history-gen-title .lead {
		font-size: 3.7333333333vw;
	}
}

.history-years {
	display: flex;
	align-items: flex-start;
	gap: 100px;
	position: relative;
	z-index: 1;
}

@media only screen and (max-width: 767px) {
	.history-years {
		gap: 13.3333333333vw;
	}
}

.history-year {
	pointer-events: all;
	display: flex;
	position: relative;
}

.history-year-next {
	position: relative;
	display: flex;
	align-items: center;
}

.history-year-next::after {
	position: absolute;
	left: 0;
	bottom: 0;
	content: "";
	width: 1px;
	height: 60%;
	background-color: #fff;
}

@media only screen and (max-width: 767px) {
	.history-year-next::after {
		height: 100%;
	}
}

.history-year-next p {
	position: relative;
	display: block;
	padding: 20px 40px;
	color: #fff;
	font-size: 16px;
	white-space: nowrap;
	font-weight: bold;
}

@media only screen and (max-width: 767px) {
	.history-year-next p {
		font-size: 4vw;
		padding: 2.6666666667vw 5.3333333333vw;
		padding-top: 5.3333333333vw;
	}
}

.history-year-next p::after {
	position: absolute;
	left: 0;
	bottom: 0;
	content: "";
	width: 100%;
	height: 1px;
	background-color: #fff;
}

.history-year-inner {
	display: flex;
	flex-direction: column;
	gap: 20px;
	position: relative;
	padding: 50px 0 40px 40px;
	box-sizing: border-box;
}

@media only screen and (max-width: 767px) {
	.history-year-inner {
		gap: 5.3333333333vw;
		padding: 5.3333333333vw 0 5.3333333333vw 5.3333333333vw;
	}
}

.history-year-inner::before {
	content: "";
	position: absolute;
	left: 0;
	top: 0;
	width: 1px;
	height: 100%;
	background-color: #fff;
}

.history-year-inner::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100px;
	height: 1px;
	background-color: #fff;
}

@media only screen and (max-width: 767px) {
	.history-year {
		margin-top: 13.3333333333vw;
	}
}

.history-year.down1 {
	margin-top: 30px;
}

@media only screen and (max-width: 767px) {
	.history-year.down1 {
		margin-top: 17.3333333333vw;
	}
}

.history-year.down2 {
	margin-top: 60px;
}

@media only screen and (max-width: 767px) {
	.history-year.down2 {
		margin-top: 21.3333333333vw;
	}
}

.history-year.up1 {
	margin-top: -30px;
}

@media only screen and (max-width: 767px) {
	.history-year.up1 {
		margin-top: 9.3333333333vw;
	}
}

.history-year.up2 {
	margin-top: -60px;
}

@media only screen and (max-width: 767px) {
	.history-year.up2 {
		margin-top: 5.3333333333vw;
	}
}

@media only screen and (max-width: 767px) {
	.history-year.next {
		flex-direction: column;
		align-items: flex-end;
	}
}

@media print, screen and (min-width: 768px) {
	.history-year.next .history-year-inner {
		padding-right: 40px;
	}
}

.history-year.next .history-year-inner::after {
	width: 100%;
}

@media only screen and (max-width: 767px) {
	.history-year.next .history-year-inner::after {
		width: 80%;
	}
}

.history-year h3 {
	position: absolute;
	left: 0;
	top: 0;
	height: 0;
}

.history-year h3 span {
	font:
		40px/1em "georgia",
		sans-serif;
	color: #fff;
	letter-spacing: 0.1em;
	margin: calc(-0.5em - 6px) 0 0 40px;
	display: block;
	width: -moz-fit-content;
	width: fit-content;
}

@media only screen and (max-width: 767px) {
	.history-year h3 span {
		font-size: 5.3333333333vw;
		margin: calc(-0.5em - 6px) 0 0 6.6666666667vw;
	}
}

.history-year h3::before {
	content: "";
	position: absolute;
	left: 0;
	top: -6px;
	width: 12px;
	height: 12px;
	border-radius: 100%;
	border: 1px solid #fff;
	margin: -7px 0 0 -7px;
}

@media only screen and (max-width: 767px) {
	.history-year h3::before {
		width: 2.1333333333vw;
		height: 2.1333333333vw;
		margin: -1.2vw 0 0 -1.2vw;
		top: -1.2vw;
	}
}

.history-year h3::after {
	content: "";
	position: absolute;
	left: 0;
	top: -6px;
	width: 90px;
	height: 90px;
	border-radius: 100%;
	border: 1px solid #fff;
	margin: -46px 0 0 -46px;
	clip-path: inset(0 10px 0 0);
}

@media only screen and (max-width: 767px) {
	.history-year h3::after {
		width: 13.3333333333vw;
		height: 13.3333333333vw;
		margin: -6.8vw 0 0 -6.8vw;
		top: -1.2vw;
		clip-path: inset(0 1.3333333333vw 0 0);
	}
}

.history-year.large h3 span {
	font-size: 54px;
}

@media only screen and (max-width: 767px) {
	.history-year.large h3 span {
		font-size: 8.5333333333vw;
	}
}

.history-year.large h4 {
	font-size: 18px;
}

@media only screen and (max-width: 767px) {
	.history-year.large h4 {
		font-size: 3.7333333333vw;
	}
}

.history-items {
	display: flex;
}

@media print, screen and (min-width: 768px) {
	.history-items {
		gap: 20px;
	}
}

.history-item {
	pointer-events: all;
	display: flex;
	flex-direction: column;
	gap: 20px;
	position: relative;
}

@media only screen and (max-width: 767px) {
	.history-item {
		gap: 4vw;
	}
}

.history-item h4 {
	font-size: 16px;
	font-weight: 600;
	letter-spacing: 0.1em;
	line-height: 1.5em;
	color: #fff;
	white-space: nowrap;
}

.history-item h4 a {
	text-decoration: underline;
	color: #fff;
}

@media only screen and (max-width: 767px) {
	.history-item h4 {
		font-size: 3.7333333333vw;
	}
}

.history-item-images {
	display: flex;
}

.history-item figure {
	position: relative;
}

@media only screen and (max-width: 767px) {
	.history-item figure {
		max-width: 72vw !important;
		max-width: 64vw !important;
	}
}

.history-item figure figcaption {
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	background-color: rgba(0, 0, 0, 0.8);
	color: #fff;
	font-size: 13px;
	line-height: 1.35em;
	padding: 4px 10px;
	box-sizing: border-box;
}

@media only screen and (max-width: 767px) {
	.history-item figure figcaption {
		font-size: 2.6666666667vw;
	}
}

.history #g1970s .history-gen-back-under-inner {
	background: url(../img/img_history_1970s_back.webp) center/cover;
}

.history #g1970s .history-gen-back-over-inner .tri {
	background: url(../img/img_history_1970s_tri.webp) 0 0/100% 100%;
	aspect-ratio: 739/594;
	width: 739px;
}

@media only screen and (max-width: 767px) {
	.history #g1970s .history-gen-back-over-inner .tri {
		width: 100cqw;
	}
}

@media only screen and (max-width: 767px) {
	.history #g1970s .history-year#y1979 .history-item:nth-child(2) figure {
		max-width: 50vw !important;
	}

	.history #g1970s .history-year#y1979 .history-item:nth-child(2) {
		top: 26.6666666667vw;
		margin-left: -6.6666666667vw;
	}

	.history #g1970s .history-year#y1979 .history-item:nth-child(2) h4 {
		padding-left: 9.3333333333vw;
	}
}

.history #g1980s .history-gen-back-under-inner {
	background: url(../img/img_history_1980s_back.webp) center/cover;
}

.history #g1980s .history-gen-back-over-inner .tri {
	background: url(../img/img_history_1980s_tri.webp) 0 0/100% 100%;
	aspect-ratio: 657/529;
	width: 657px;
}

@media only screen and (max-width: 767px) {
	.history #g1980s .history-gen-back-over-inner .tri {
		width: 100cqw;
	}
}

.history #g1990s .history-gen-back-under-inner {
	background: url(../img/img_history_1990s_back.webp) center/cover;
}

.history #g1990s .history-gen-back-over-inner .tri {
	background: url(../img/img_history_1990s_tri.webp) 0 0/100% 100%;
	aspect-ratio: 650/512;
	width: 650px;
}

@media only screen and (max-width: 767px) {
	.history #g1990s .history-gen-back-over-inner .tri {
		width: 100cqw;
	}
}

.history #g2000s .history-gen-back-under-inner {
	background: url(../img/img_history_2000s_back.webp) center/cover;
}

.history #g2000s .history-gen-back-over-inner .tri {
	background: url(../img/img_history_2000s_tri.webp) 0 0/100% 100%;
	aspect-ratio: 632/587;
	width: 632px;
}

@media only screen and (max-width: 767px) {
	.history #g2000s .history-gen-back-over-inner .tri {
		width: 100cqw;
	}
}

.history #g2010s .history-gen-back-under-inner {
	background: url(../img/img_history_2010s_back.webp) center/cover;
}

.history #g2010s .history-gen-back-over-inner .tri {
	background: url(../img/img_history_2010s_tri.webp) 0 0/100% 100%;
	aspect-ratio: 646/540;
	width: 646px;
}

@media only screen and (max-width: 767px) {
	.history #g2010s .history-gen-back-over-inner .tri {
		width: 100cqw;
	}
}

@media only screen and (max-width: 767px) {
	.history #g2010s .history-year#y2016 .history-item figure {
		max-width: 50vw !important;
	}
}

.history #g2010s .history-year#y2016 .history-item figure:nth-child(2) {
	left: -90px;
	top: 90px;
}

@media only screen and (max-width: 767px) {
	.history #g2010s .history-year#y2016 .history-item figure:nth-child(2) {
		left: -21.3333333333vw;
		top: 21.3333333333vw;
	}
}

.history #g2020s .history-gen-back-under-inner {
	background: url(../img/img_history_2020s_back.webp) center/cover;
}

.history #g2020s .history-gen-back-over-inner::before {
	background: url(../img/img_history_2020s_back.webp) center/cover;
}

.history #g2020s .history-gen-back-over-inner .tri {
	background: url(../img/img_history_2020s_tri.webp) 0 0/100% 100%;
	aspect-ratio: 668/540;
	width: 668px;
}

@media only screen and (max-width: 767px) {
	.history #g2020s .history-gen-back-over-inner .tri {
		width: 100cqw;
	}
}

.data {
	background-color: rgba(255, 255, 255, 0.75);
	backdrop-filter: blur(8px);
	container-type: inline-size;
}

.data .article-inner {
	padding: 100px 0;
}

.data .article-hdg {
	grid-area: hdg;
	color: #003366;
}

@media print, screen and (min-width: 768px) {
	.data .article-hdg {
		margin-left: auto;
		text-align: right;
	}

	.data .article-hdg h2 {
		position: relative;
		right: -0.5em;
	}

	.data .article-hdg .en {
		margin-left: auto;
	}

	.data .article-hdg::after {
		margin-left: auto;
	}
}

@media only screen and (max-width: 767px) {
	.data .article-hdg h2 {
		letter-spacing: 0.1em;
	}
}

.data-numbers {
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	gap: 30px;
}

.data-numbers-item {
	border: 1px solid #000;
	position: relative;
	z-index: 1;
	box-sizing: border-box;
}

@media only screen and (max-width: 767px) {
	.data-numbers-item {
		width: 100%;
		flex-direction: column;
	}
}

.data-numbers-item h3 {
	font-size: 28px;
	font-weight: 600;
	color: #003366;
	font-family:
		"游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN",
		"HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;
	line-height: 1em;
	box-sizing: border-box;
	padding: min(50px, 4.8828125cqw) 0 0 min(50px, 4.8828125cqw);
	height: 100px;
}

@media only screen and (max-width: 767px) {
	.data-numbers-item h3 {
		height: 11.3333333333vw;
		padding: 0;
		padding-left: 4vw;
		font-size: 4.2666666667vw;
		margin-top: 4vw;
		display: flex;
		align-items: center;
	}
}

.data-numbers-item-inner {
	padding: 10px min(40px, 3.90625cqw);
}

@media only screen and (max-width: 767px) {
	.data-numbers-item-inner {
		padding: 4vw;
	}
}

.data-numbers-item table {
	color: #003366;
}

@media print, screen and (min-width: 768px) {
	.data-numbers-item table {
		width: 100%;
	}
}

@media only screen and (max-width: 767px) {
	.data-numbers-item table {
		margin-left: auto;
		margin-right: auto;
	}
}

.data-numbers-item table.type1 th {
	font:
		600 min(18px, 1.7578125cqw)/1em "Yu Gothic",
		"游ゴシック",
		YuGothic,
		"游ゴシック体",
		"ヒラギノ角ゴ Pro W3",
		"Hiragino Kaku Gothic",
		"メイリオ",
		Meiryo,
		Helvetica,
		sans-serif;
	vertical-align: bottom;
	padding-bottom: 20px;
	white-space: nowrap;
	line-height: 1.5em;
	padding-right: min(10px, 0.9765625cqw);
}

@media only screen and (max-width: 767px) {
	.data-numbers-item table.type1 th {
		font-size: 3.7333333333vw;
		padding-bottom: 5.3333333333vw;
		padding-right: 2.6666666667vw;
	}
}

.data-numbers-item table.type1 td {
	white-space: nowrap;
	padding-bottom: 20px;
	vertical-align: bottom;
	font:
		600 min(20px, 1.953125cqw)/1em "游明朝",
		YuMincho,
		"ヒラギノ明朝 ProN W3",
		"Hiragino Mincho ProN",
		"HG明朝E",
		"ＭＳ Ｐ明朝",
		"ＭＳ 明朝",
		serif;
}

@media only screen and (max-width: 767px) {
	.data-numbers-item table.type1 td {
		font-size: 3.7333333333vw;
	}
}

.data-numbers-item table.type1 td .att {
	padding: 0 min(10px, 0.9765625cqw);
	margin: 0 min(10px, 0.9765625cqw);
	display: inline-block;
	font-size: min(50px, 4.8828125cqw);
	font-weight: 600;
	position: relative;
}

.data-numbers-item table.type1 td .att::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 20px;
	display: block;
	background-color: rgba(204, 20, 51, 0.2);
}

@media only screen and (max-width: 767px) {
	.data-numbers-item table.type1 td .att::after {
		height: 2.6666666667vw;
	}
}

@media only screen and (max-width: 767px) {
	.data-numbers-item table.type1 td .att {
		font-size: 6.6666666667vw;
	}
}

.data-numbers-item table.type1 td .att .value {
	z-index: 1;
	font:
		400 min(100px, 9.765625cqw)/1em "georgia",
		sans-serif;
	position: relative;
	top: -0.1em;
}

@media only screen and (max-width: 767px) {
	.data-numbers-item table.type1 td .att .value {
		font-size: 13.3333333333vw;
	}
}

.data-numbers-item table.type2 {
	display: block;
	width: 100%;
}

@media print, screen and (min-width: 768px) {
	.data-numbers-item table.type2 {
		margin-bottom: 30px;
	}
}

.data-numbers-item table.type2 thead,
.data-numbers-item table.type2 tbody {
	display: flex;
}

.data-numbers-item table.type2 tr {
	flex: 1;
	display: flex;
	flex-direction: column-reverse;
	align-items: center;
}

.data-numbers-item table.type2 tr th {
	padding-top: 10px;
	border-top: 1px solid #003366;
	display: block;
	text-align: center;
	font-size: 14px;
	width: 100%;
}

@media only screen and (max-width: 767px) {
	.data-numbers-item table.type2 tr th {
		font-size: 3.2vw;
		padding-top: 1.3333333333vw;
	}
}

.data-numbers-item table.type2 tr td {
	display: block;
	background-color: rgba(204, 20, 51, 0.2);
	position: relative;
	width: min(50px, 4.8828125cqw);
}

@media only screen and (max-width: 767px) {
	.data-numbers-item table.type2 tr td {
		width: 8vw;
	}
}

.data-numbers-item table.type2 tr td span {
	display: block;
	font:
		400 min(30px, 2.9296875cqw)/1em "georgia",
		sans-serif;
	text-align: center;
	position: absolute;
	left: 0;
	width: 100%;
	top: 10px;
}

@media only screen and (max-width: 767px) {
	.data-numbers-item table.type2 tr td span {
		top: 1.3333333333vw;
	}
}

.data-numbers-item table.type2 tr:nth-child(1) td {
	height: 0.6px;
}

@media only screen and (max-width: 767px) {
	.data-numbers-item table.type2 tr:nth-child(1) td {
		height: 0.3px;
	}
}

.data-numbers-item table.type2 tr:nth-child(2) td {
	height: 63.6px;
}

@media only screen and (max-width: 767px) {
	.data-numbers-item table.type2 tr:nth-child(2) td {
		height: 31.8px;
	}
}

.data-numbers-item table.type2 tr:nth-child(3) td {
	height: 127.4px;
}

@media only screen and (max-width: 767px) {
	.data-numbers-item table.type2 tr:nth-child(3) td {
		height: 63.7px;
	}
}

.data-numbers-item table.type2 tr:nth-child(4) td {
	height: 169.8px;
}

@media only screen and (max-width: 767px) {
	.data-numbers-item table.type2 tr:nth-child(4) td {
		height: 84.9px;
	}
}

.data-numbers-item table.type2 tr:nth-child(5) td {
	height: 175.4px;
}

@media only screen and (max-width: 767px) {
	.data-numbers-item table.type2 tr:nth-child(5) td {
		height: 87.7px;
	}
}

.data-numbers-item table.type2 tr:nth-child(6) td {
	height: 197.6px;
}

@media only screen and (max-width: 767px) {
	.data-numbers-item table.type2 tr:nth-child(6) td {
		height: 98.8px;
	}
}

.data-numbers-item table.type2 tr:nth-child(1) td {
	height: 5px;
}

.data-numbers-item table.type2 tr:nth-child(1) td span {
	top: -1.5em;
}

.data-numbers-item table.type2 tr:nth-child(6) {
	flex: auto;
	width: min(120px, 11.71875cqw);
}

@media only screen and (max-width: 767px) {
	.data-numbers-item table.type2 tr:nth-child(6) {
		width: 16vw;
	}
}

.data-numbers-item table.type2 tr:nth-child(6) th {
	font-size: 18px;
	font-weight: 600;
}

@media only screen and (max-width: 767px) {
	.data-numbers-item table.type2 tr:nth-child(6) th {
		font-size: 3.2vw;
	}
}

.data-numbers-item table.type2 tr:nth-child(6) td {
	width: min(120px, 11.71875cqw);
}

@media only screen and (max-width: 767px) {
	.data-numbers-item table.type2 tr:nth-child(6) td {
		width: 16vw;
	}
}

.data-numbers-item table.type2 tr:nth-child(6) td span {
	transform: scale(3);
	top: -1em;
}

@media only screen and (max-width: 767px) {
	.data-numbers-item table.type2 tr:nth-child(6) td span {
		transform: scale(5);
	}
}

.data-numbers-item .note {
	text-align: right;
	font-size: 14px;
}

@media only screen and (max-width: 767px) {
	.data-numbers-item .note {
		font-size: 10px;
		position: absolute;
		right: 4vw;
		top: 4vw;
	}
}

@media print, screen and (min-width: 768px) {
	.data-numbers-item.item1 {
		width: calc((100% - 34px) / 2);
	}
}

.data-numbers-item.item1 h3 {
	background: url(../img/img_data_numbers_01.svg) right bottom/auto 75px
		no-repeat;
	width: 310px;
	max-width: calc(100% - 20px);
}

@media only screen and (max-width: 767px) {
	.data-numbers-item.item1 h3 {
		background: url(../img/img_data_numbers_01_sp.svg) right bottom/auto 100%
			no-repeat;
		width: 43.2vw;
	}
}

@media print, screen and (min-width: 768px) {
	.data-numbers-item.item2 {
		width: calc((100% - 34px) / 2);
	}
}

.data-numbers-item.item2 h3 {
	background: url(../img/img_data_numbers_02.svg) right bottom/auto 85.674px
		no-repeat;
	width: 288.316px;
	max-width: calc(100% - 20px);
}

@media only screen and (max-width: 767px) {
	.data-numbers-item.item2 h3 {
		background: url(../img/img_data_numbers_02_sp.svg) right bottom/auto 100%
			no-repeat;
		width: 41.1088vw;
	}
}

.data-numbers-item.item3 {
	flex: 1;
}

.data-numbers-item.item3 h3 {
	background: url(../img/img_data_numbers_03.svg) right bottom/auto 60.5px
		no-repeat;
	width: 350.5px;
	max-width: calc(100% - 20px);
}

@media only screen and (max-width: 767px) {
	.data-numbers-item.item3 h3 {
		background: url(../img/img_data_numbers_03_sp.svg) right bottom/auto 100%
			no-repeat;
		width: 46.5049333333vw;
	}
}

.data-numbers-mes {
	position: relative;
	display: flex;
	justify-content: center;
	align-items: center;
	color: #003366;
	font-size: 18px;
	font-weight: bold;
	line-height: 1.75em;
	text-align: center;
}

@media print, screen and (min-width: 768px) {
	.data-numbers-mes {
		width: 300px;
	}
}

@media only screen and (min-width: 768px) and (max-width: 889px) {
	.data-numbers-mes {
		width: 100%;
	}
}

@media only screen and (max-width: 767px) {
	.data-numbers-mes {
		font-size: 3.7333333333vw;
		width: 100%;
	}
}

.data-numbers-mes::before {
	content: "";
	position: absolute;
	right: -60%;
	bottom: -10%;
	background: url(../img/img_data_tri.png) 0 0/100% 100%;
	width: 491px;
	aspect-ratio: 491/402;
}

@media only screen and (max-width: 767px) {
	.data-numbers-mes::before {
		width: 66.6666666667vw;
		right: -21.3333333333vw;
		bottom: -10.6666666667vw;
	}
}

.data-trivia {
	margin-top: 80px;
}

@media print, screen and (min-width: 768px) {
	.data-trivia {
		display: grid;
		grid-template-columns: repeat(2, 1fr);
		grid-gap: 26px 36px;
	}
}

@media only screen and (max-width: 767px) {
	.data-trivia {
		margin-top: 9vw;
		display: flex;
		flex-direction: column;
		gap: 6vw;
	}
}

.data-trivia-item {
	perspective: 800px;
	cursor: pointer;
	aspect-ratio: 500/360;
	container-type: size;
	position: relative;
}

.data-trivia-item-inner {
	transition-duration: 600ms;
	transition-timing-function: cubic-bezier(0.77, 0, 0.175, 1);
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

.data-trivia-item-omote {
	background-color: #fff;
	border: 1px solid #003366;
	transition-property: visibility;
	transition-delay: 300ms;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	display: flex;
	justify-content: center;
	align-items: center;
	flex-direction: column;
	gap: 6.0483870968cqw;
}

.data-trivia-item-omote .lines .ln {
	position: absolute;
	width: 1px;
	height: 1px;
	background-color: #003366;
	transition:
		width 150ms,
		height 150ms;
}

.data-trivia-item-omote .lines .ln.ln1 {
	left: 1.0080645161cqw;
	top: 1.0080645161cqw;
	width: 0;
	transition-delay: 150ms;
}

.data-trivia-item-omote .lines .ln.ln2 {
	right: 1.0080645161cqw;
	top: 1.0080645161cqw;
	height: 0;
	transition-delay: 0ms;
}

.data-trivia-item-omote .lines .ln.ln3 {
	right: 1.0080645161cqw;
	bottom: 1.0080645161cqw;
	width: 0;
	transition-delay: 150ms;
}

.data-trivia-item-omote .lines .ln.ln4 {
	left: 1.0080645161cqw;
	bottom: 1.0080645161cqw;
	height: 0;
	transition-delay: 0ms;
}

.data-trivia-item-omote .q {
	font:
		600 5.6451612903cqw "游明朝",
		YuMincho,
		"ヒラギノ明朝 ProN W3",
		"Hiragino Mincho ProN",
		"HG明朝E",
		"ＭＳ Ｐ明朝",
		"ＭＳ 明朝",
		serif;
	color: #003366;
	text-align: center;
	background: url(../img/img_data_trivia_q.svg) center center/auto 100%
		no-repeat;
	aspect-ratio: 93.242/125.645;
	height: 25.3316532258cqw;
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
}

.data-trivia-item-omote .click {
	display: block;
	position: absolute;
	right: 3.2258064516cqw;
	bottom: 3.2258064516cqw;
	display: flex;
	justify-content: center;
	align-items: center;
	font:
		600 3.2258064516cqw "游明朝",
		YuMincho,
		"ヒラギノ明朝 ProN W3",
		"Hiragino Mincho ProN",
		"HG明朝E",
		"ＭＳ Ｐ明朝",
		"ＭＳ 明朝",
		serif;
	color: #003366;
	line-height: 1em;
	padding-top: 0.1em;
	box-sizing: border-box;
	width: 18.1451612903cqw;
	aspect-ratio: 1;
	letter-spacing: 0.1em;
	opacity: 0.5;
	transition: opacity 250ms;
}

.data-trivia-item-omote .click .ln {
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	transform: scale(0.8);
	transition:
		clip-path 250ms,
		transform 250ms;
}

.data-trivia-item-omote .click .ln.ln1 {
	clip-path: inset(0 0 75% 0);
}

.data-trivia-item-omote .click .ln.ln2 {
	clip-path: inset(75% 0 0 0);
}

.data-trivia-item-omote .click .ln::before {
	content: "";
	border: 1px solid #003366;
	position: absolute;
	left: 5px;
	top: 5px;
	width: calc(100% - 10px);
	height: calc(100% - 10px);
	border-radius: 100%;
}

@media print, screen and (min-width: 768px) {
	.data-trivia-item:hover .lines .ln1 {
		width: calc(100% - 2.0161290323cqw);
		transition-delay: 0ms;
	}

	.data-trivia-item:hover .lines .ln2 {
		height: calc(100% - 2.0161290323cqw);
		transition-delay: 150ms;
	}

	.data-trivia-item:hover .lines .ln3 {
		width: calc(100% - 2.0161290323cqw);
		transition-delay: 0ms;
	}

	.data-trivia-item:hover .lines .ln4 {
		height: calc(100% - 2.0161290323cqw);
		transition-delay: 150ms;
	}

	.data-trivia-item:hover .click {
		opacity: 1;
	}

	.data-trivia-item:hover .click .ln {
		transform: scale(1);
	}

	.data-trivia-item:hover .click .ln.ln1 {
		clip-path: inset(0 0 0 0);
	}

	.data-trivia-item:hover .click .ln.ln2 {
		clip-path: inset(0 0 0 0);
		transform: scale(1);
	}
}

.data-trivia-item-ura {
	transition-property: visibility;
	transition-delay: 300ms;
	visibility: hidden;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	transform: scale(-1, 1);
	gap: 4.0322580645cqw;
	padding-bottom: 12.0967741935cqw;
	box-sizing: border-box;
}

.data-trivia-item-ura .data-trivia-close {
	display: block;
	position: absolute;
	bottom: 4.0322580645cqw;
	left: calc(50% - 2.6209677419cqw);
	background: url(../img/img_data_trivia_close.svg) 0 0/100% 100%;
	aspect-ratio: 26.707/26.707;
	width: 5.3844758065cqw;
	text-indent: -9999px;
	overflow: hidden;
}

.data-trivia-item-ura .nums {
	font:
		600 4.0322580645cqw "游明朝",
		YuMincho,
		"ヒラギノ明朝 ProN W3",
		"Hiragino Mincho ProN",
		"HG明朝E",
		"ＭＳ Ｐ明朝",
		"ＭＳ 明朝",
		serif;
	color: #fff;
	letter-spacing: 0.1em;
}

.data-trivia-item-ura .nums .att {
	margin: 0 2.0161290323cqw;
	font:
		600 5.2419354839cqw "游明朝",
		YuMincho,
		"ヒラギノ明朝 ProN W3",
		"Hiragino Mincho ProN",
		"HG明朝E",
		"ＭＳ Ｐ明朝",
		"ＭＳ 明朝",
		serif;
	position: relative;
}

.data-trivia-item-ura .nums .att::before {
	content: "";
	position: absolute;
	left: 0;
	bottom: -2.0161290323cqw;
	width: 100%;
	height: 4.0322580645cqw;
	display: block;
	background-color: #e58898;
}

.data-trivia-item-ura .nums .att > span {
	position: relative;
}

.data-trivia-item-ura .nums .att .up {
	position: relative;
	top: -0.12em;
}

.data-trivia-item-ura .nums .att .down {
	position: relative;
	top: 0.12em;
}

.data-trivia-item-ura .nums .att .value {
	font:
		400 16.1290322581cqw "georgia",
		sans-serif;
}

.data-trivia-item-ura .body {
	color: #fff;
	font-weight: 600;
	font-size: 3.2258064516cqw;
	line-height: 1.5em;
}

.data-trivia-item-ura figure {
	max-width: 57.8629032258cqw;
}

.data-trivia-item-ura .clm {
	width: 80.6451612903cqw;
	display: flex;
	gap: 4.0322580645cqw;
	align-items: center;
}

.data-trivia-item-ura .clm figure {
	width: 50%;
}

.data-trivia-item-ura .pbox {
	display: flex;
	border: 1px solid #fff;
}

.data-trivia-item-ura .pbox figure {
	width: 20.1612903226cqw;
	background-color: #fff;
	display: flex;
	justify-content: center;
	align-items: center;
}

.data-trivia-item-ura .pbox .texts {
	padding: 3.2258064516cqw 6.4516129032cqw;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.data-trivia-item-ura .pbox .texts-inner {
	color: #fff;
}

.data-trivia-item-ura .pbox .texts-inner .ttl {
	font-size: 3.6290322581cqw;
	font-weight: 600;
	line-height: 1.5em;
}

.data-trivia-item-ura .pbox .texts-inner .desc {
	font-size: 2.8225806452cqw;
	line-height: 1.5em;
}

.data-trivia-item-ura .pbox.nophoto .texts {
	text-align: center;
	padding: 3.2258064516cqw 3.2258064516cqw;
}

.data-trivia-item.open .data-trivia-item-inner {
	transform: rotateY(180deg);
}

.data-trivia-item.open .data-trivia-item-omote {
	visibility: hidden;
}

.data-trivia-item.open .data-trivia-item-ura {
	visibility: inherit;
}

.data-trivia-item.item1 .data-trivia-item-omote figure {
	aspect-ratio: 161.375/84;
	width: 32.5352822581cqw;
}

.data-trivia-item.item1 .data-trivia-item-ura {
	background: url(../img/img_data_trivia_01_back.webp) center/cover;
}

.data-trivia-item.item2 .data-trivia-item-omote figure {
	aspect-ratio: 129.513/94.978;
	width: 26.1114919355cqw;
}

.data-trivia-item.item2 .data-trivia-item-ura {
	background: url(../img/img_data_trivia_02_back.webp) center/cover;
}

.data-trivia-item.item3 .data-trivia-item-omote figure {
	aspect-ratio: 92.371/81.028;
	width: 18.6231854839cqw;
}

.data-trivia-item.item3 .data-trivia-item-ura {
	background: url(../img/img_data_trivia_03_back.webp) center/cover;
}

.data-trivia-item.item4 .data-trivia-item-omote figure {
	aspect-ratio: 152/78.375;
	width: 30.6451612903cqw;
}

.data-trivia-item.item4 .data-trivia-item-ura {
	background: url(../img/img_data_trivia_04_back.webp) center/cover;
}

.data-trivia-item.item5 .data-trivia-item-omote figure {
	aspect-ratio: 89/84.001;
	width: 17.9435483871cqw;
}

.data-trivia-item.item5 .data-trivia-item-ura {
	background: url(../img/img_data_trivia_05_back.webp) center/cover;
}

.data-trivia-item.item6 .data-trivia-item-omote figure {
	aspect-ratio: 102/81.152;
	width: 20.564516129cqw;
}

.data-trivia-item.item6 .data-trivia-item-ura {
	background: url(../img/img_data_trivia_06_back.webp) center/cover;
}

.data-trivia-item.item6 .data-trivia-item-ura .clm {
	margin-left: auto;
	margin-right: auto;
	width: -moz-fit-content;
	width: fit-content;
}

.data-trivia-item.item6 .data-trivia-item-ura .clm figure {
	max-width: 27.2177419355cqw;
}

.data-trivia-item.item6 .data-trivia-item-ura .clm .body {
	width: -moz-fit-content;
	width: fit-content;
}

.data-trivia-item.item6 .nums {
	position: relative;
	left: -6.0483870968cqw;
}

.data-trivia-item.item6 .cap {
	position: absolute;
	right: 6.0483870968cqw;
	top: 12.0967741935cqw;
	font-size: 2.8225806452cqw;
	color: #fff;
	line-height: 1.5em;
}

.data-note {
	margin-top: 20px;
	font-size: 12px;
	text-align: right;
	line-height: 1.25em;
}

@media only screen and (max-width: 767px) {
	.data-note {
		font-size: 9px;
	}
}

.anc#anv50th {
	position: relative;
	top: -130px;
}

@media only screen and (max-width: 767px) {
	.anc#anv50th {
		top: -26.6666666667vw;
	}
}

.anv50th {
	background: url(../img/img_anv50th_back.webp) center/cover;
}

@media only screen and (max-width: 767px) {
	.anv50th {
		background-image: url(../img/img_anv50th_back_sp.webp);
	}
}

.anv50th .article-inner {
	padding: 100px 0;
}

@media only screen and (max-width: 767px) {
	.anv50th .article-inner {
		padding: 10.6666666667vw 0;
	}
}

.anv50th .article-hdg {
	color: #fff;
}

@media print, screen and (min-width: 768px) {
	.anv50th .article-hdg {
		margin-left: auto;
		margin-right: auto;
		text-align: center;
	}

	.anv50th .article-hdg .en {
		margin: 0 auto;
	}

	.anv50th .article-hdg::after {
		margin: 0 auto;
	}
}

.anv50th .coming {
	font:
		400 32px/1em "游明朝",
		YuMincho,
		"ヒラギノ明朝 ProN W3",
		"Hiragino Mincho ProN",
		"HG明朝E",
		"ＭＳ Ｐ明朝",
		"ＭＳ 明朝",
		serif;
	color: #fff;
	line-height: 1.5em;
	letter-spacing: 0.2em;
}

@media print, screen and (min-width: 768px) {
	.anv50th .coming {
		text-align: center;
	}
}

@media only screen and (max-width: 767px) {
	.anv50th .coming {
		font-size: 4.2666666667vw;
	}
}

.next .article-inner {
	padding: 120px 0;
	padding-top: 200px;
	container-type: inline-size;
}

@media only screen and (max-width: 767px) {
	.next .article-inner {
		padding: 24vw 0;
		padding-bottom: 53.3333333333vw;
	}
}

.next .article-hdg {
	color: #003366;
	text-align: center;
}

@media print, screen and (min-width: 768px) {
	.next .article-hdg {
		margin-left: auto;
		margin-right: auto;
	}

	.next .article-hdg .en {
		margin: 0 auto;
	}

	.next .article-hdg::after {
		margin: 0 auto;
	}
}

.next-logo {
	width: 280px;
	aspect-ratio: 498.91/377.94;
	margin: 0 auto;
	position: relative;
	z-index: -1;
	transition-duration: 400ms;
	transition-property: opacity;
}

.next-logo.active {
	opacity: 0.1;
}

@media only screen and (max-width: 767px) {
	.next-logo {
		margin-top: 8vw;
		width: 42.6666666667vw;
		display: none;
	}
}

.next-logo-inner {
	position: relative;
	width: 280px;
	aspect-ratio: 498.91/377.94;
	background: url(../img/img_50thlogo_01.svg) 0 0/100% 100%;
}

@media only screen and (max-width: 767px) {
	.next-logo-inner {
		width: 42.6666666667vw;
	}
}

.next-doc {
	margin-top: 40px;
	color: #003366;
	letter-spacing: 0.1em;
	font:
		400 28px/2.4em "游明朝",
		YuMincho,
		"ヒラギノ明朝 ProN W3",
		"Hiragino Mincho ProN",
		"HG明朝E",
		"ＭＳ Ｐ明朝",
		"ＭＳ 明朝",
		serif;
	text-align: center;
}

@media only screen and (max-width: 767px) {
	.next-doc {
		font-size: 4.2666666667vw;
	}
}

.next .thanks {
	margin-top: 50px;
	text-align: center;
	line-height: 1em;
	letter-spacing: 0.2em;
	color: #003366;
	font:
		400 72px "georgia",
		sans-serif;
	aspect-ratio: 498.92/295.41;
	display: flex;
	flex-direction: column;
	justify-content: center;
	align-items: center;
	position: relative;
}

@media only screen and (max-width: 767px) {
	.next .thanks {
		font-size: 9.6vw;
		margin-bottom: 13.3333333333vw;
	}

	.next .thanks::before {
		content: "";
		position: absolute;
		left: 0;
		top: 0;
		width: 100%;
		height: 100%;
		background: url(../img/img_50thlogo_01.svg) 0 0/100% 100%;
		opacity: 0.1;
	}
}

.links {
	position: relative;
}

.links-totop {
	display: block;
	background: url(../img/btn_totop_sp.svg) center 45%/16px 12.5px no-repeat;
	aspect-ratio: 1;
	width: 10.6666666667vw;
	position: absolute;
	right: 6.6666666667vw;
	top: 0;
	border: 1px solid #fff;
	border-radius: 100%;
}

.links .article-hdg {
	color: #fff;
	width: auto;
}

.links .article-hdg::after {
	width: 100%;
	background: #fff;
}

@media print, screen and (min-width: 768px) {
	.links-list {
		display: grid;
		grid-template-columns: 1fr 1fr;
		gap: 20px;
	}
}

@media only screen and (max-width: 767px) {
	.links-list {
		display: flex;
		flex-direction: column;
		gap: 2.6666666667vw;
	}
}

.links-list .links-link a {
	position: relative;
	display: block;
	background-color: #fff;
	text-align: center;
	border: 1px solid #fff;
	background-color: rgba(255, 255, 255, 0.3);
	text-decoration: none;
	box-sizing: border-box;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100px;
	line-height: 1.75em;
}

@media print, screen and (min-width: 768px) {
	.links-list .links-link a {
		transition: background-color 250ms;
	}
}

@media only screen and (max-width: 767px) {
	.links-list .links-link a {
		height: 16vw;
	}
}

.links-list .links-link a::after {
	content: "";
	background: url(../img/icon_outside.svg) 0 0/100% 100%;
	aspect-ratio: 22.5/19.501;
	width: 22.5px;
	position: absolute;
	right: 5px;
	bottom: 5px;
}

@media only screen and (max-width: 767px) {
	.links-list .links-link a::after {
		width: 3.0666666667vw;
		background: url(../img/icon_outside_sp.svg) 0 0/100% 100%;
		aspect-ratio: 23/20.001;
	}
}

.links-list .links-link a .links-link-text {
	font-size: 17px;
	font-weight: 500;
	letter-spacing: 0.05em;
	color: #fff;
	position: relative;
}

@media only screen and (max-width: 767px) {
	.links-list .links-link a .links-link-text {
		line-height: 1.35em;
		font-size: 3.7333333333vw;
	}
}

.links-list .links-link a .links-link-ln {
	display: block;
	position: absolute;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
}

.links-list .links-link a .links-link-ln span {
	position: absolute;
	display: block;
	background-color: #fff;
}

.links-list .links-link a .links-link-ln span:nth-child(1) {
	left: 4px;
	top: 4px;
	height: 1px;
	width: calc(100% - 8px);
	clip-path: inset(0 100% 0 0);
	transition: clip-path 250ms cubic-bezier(0.25, 0.25, 0.75, 0.75);
}

.links-list .links-link a .links-link-ln span:nth-child(2) {
	left: 4px;
	bottom: 4px;
	height: 1px;
	width: calc(100% - 40px);
	clip-path: inset(0 0 0 100%);
	transition: clip-path 250ms cubic-bezier(0.25, 0.25, 0.75, 0.75);
}

.links-list .links-link a .links-link-ln span:nth-child(3) {
	left: 4px;
	top: 4px;
	height: calc(100% - 8px);
	width: 1px;
	clip-path: inset(100% 0 0 0);
	transition: clip-path 150ms cubic-bezier(0.165, 0.84, 0.44, 1);
}

.links-list .links-link a .links-link-ln span:nth-child(4) {
	right: 4px;
	top: 4px;
	height: calc(100% - 36px);
	width: 1px;
	clip-path: inset(0 0 100% 0);
	transition: clip-path 150ms cubic-bezier(0.165, 0.84, 0.44, 1);
}

@media print, screen and (min-width: 768px) {
	.links-list .links-link a:hover {
		background-color: rgba(23, 26, 31, 0.5);
	}

	.links-list .links-link a:hover .links-link-ln span {
		clip-path: inset(0 0 0 0) !important;
	}

	.links-list .links-link a:hover .links-link-ln span:nth-child(3) {
		transition-delay: 250ms;
	}

	.links-list .links-link a:hover .links-link-ln span:nth-child(4) {
		transition-delay: 250ms;
	}
}