*,*::before,*::after{ box-sizing:border-box;}
html{ -webkit-text-size-adjust:100%; text-size-adjust:100%;}
body{ margin:0;font-family: sans-serif; line-height: 1.5;}
h1,h2,h3,h4,h5,h6,p,ul,ol,li,dl,dt,dd,figure,blockquote{ margin:0; padding:0;}
ul,ol{ list-style:none;}
img,picture{ display:block;height:auto; max-width:100%;}
button,input,textarea,select{ font:inherit;}
a{ color:inherit; text-decoration:none;}
html {scroll-behavior: smooth;}
*{box-sizing: border-box;}

body{
/*background-color: black;
background-image: url(../img/bg.webp);
background-position: top center;
background-size: 100%;
background-repeat: no-repeat;*/
}
.KozukaGothic_Pr6N{
font-family: "kozuka-gothic-pr6n", sans-serif;
font-weight: 300;
font-style: normal;
}
.onlyPc{display: block;}
.onlySp{display: none;}
@media (width < 599px) {/*782px <= */
	.onlyPc{
	display: none;
	}
	.onlySp{
	display: block;
	}
}
:root {
--c_ddred: #2a2425;
--c_red: #b92d39;
--c_yellow: #ffde00;
}
.c_red{color: var(--c_red);}
.c_white{color: white;}

/*-------------スクリーンリーダー専用（非表示）------------*/
.sr-only {
border: 0;
clip: rect(0, 0, 0, 0);
height: 1px;
margin: -1px;
overflow: hidden;
padding: 0;
position: absolute;
white-space: nowrap;
width: 1px;
}
#index nav {
background: url(../img/bg_nav.webp) no-repeat center / 110%;
font-family: "kozuka-gothic-pr6n", sans-serif;
padding: 6% 0;
text-align: center;
width: 100%;
}
#index nav ul{
display: flex;
flex-wrap: nowrap;
font-size: min(2.2em, 3.0vw);
margin: 0 auto;
max-width: 1600px;
width: 100%;
}
#index nav ul li{
color: white;
display: inline-block;
font-weight: bold;
text-align: center;
text-shadow: 1px 1px 0 var(--c_ddred);
width: 17%;
}
#index nav ul li a{
color: white;
text-decoration: none;
}
.fixed {
background: #b92d39;
position: fixed;
padding: 2%;
top: 0;
width: 100%;
z-index: 95;
}
main{
margin: 0 auto;
text-align: center;
width: 100%;
}
#footer{
background: #b60007;
color: white;
font-size: min(18px, 2.8vw);
text-align: center;
padding: 1% 0;
}

.pagetop {
align-items: center;
justify-content: center;
position: fixed;
right: 30px;
bottom: 30px;
width: min(20%, 150px);
z-index: 2;
}
.pagetop img{
-webkit-filter: drop-shadow(0 0 10px var(--c_yellow)) drop-shadow(0 0 10px var(--c_yellow));
filter: drop-shadow(0 0 10px var(--c_yellow)) drop-shadow(0 0 10px var(--c_yellow));
height: auto;
width: 100%;
}
.movie iframe {
aspect-ratio: 16 / 9;
height: auto;
width: 100%;
}

/*-- #loader ----------------------*/
#loader {
background-color: black;
height: 100%;
position: fixed;
width: 100%;
z-index: 1000;
}
.loader,
.loader:before,
.loader:after {
background: #aaa;
-webkit-animation: load1 1s infinite ease-in-out;
animation: load1 1s infinite ease-in-out;
height: 4em;
width: 1em;
top: 50%;
}
.loader {
color: #ccc;
font-size: 11px;
-webkit-transform: translateZ(0);-ms-transform: translateZ(0);transform: translateZ(0);
-webkit-animation-delay: -0.16s;animation-delay: -0.16s;
margin: auto;
position: absolute;
top: 50%;
left: 50%;
text-indent: -9999em;
transform: translate(-50%, -50%);
}
.loader:before,
.loader:after {
content: '';
position: absolute;
top: 0;
}
.loader:before {
left: -1.5em;
-webkit-animation-delay: -0.32s;animation-delay: -0.32s;
}
.loader:after {
left: 1.5em;
}
@-webkit-keyframes load1 {
	0%,
	80%,
	100% {
	box-shadow: 0 0;
	height: 4em;
	}
	40% {
	box-shadow: 0 -2em;
	height: 5em;
	}
}
@keyframes load1 {
	0%,
	80%,
	100% {
	box-shadow: 0 0;
	height: 4em;
	}
	40% {
	box-shadow: 0 -2em;
	height: 5em;
	}
}
/*--------------------------------------------------------*/


/* PC */
@media (min-width: 1024px) {

}

/* TAB  -------------------------------------------------- */
@media (min-width: 768px) and (max-width: 1023px) {

}
/* SP  -------------------------------------------------- */
@media (max-width: 767px) {

}