@charset "UTF-8";
/* CSS Document */

/*リセット*/
*:where(:not(html, iframe, canvas, img, svg, video, audio):not(svg *, symbol *)) {
all: unset;
display: revert;
}
*,
*::before,
*::after {
box-sizing: border-box;
margin: 0;
padding: 0
}
html {
-moz-text-size-adjust: none;
-webkit-text-size-adjust: none;
text-size-adjust: none;
font-size: 62.5%;
}
a, button {
cursor: revert;
}
ol, ul, menu, summary {
list-style: none;
}
img {
max-inline-size: 100%;
max-block-size: 100%;
}
table {
border-collapse: collapse;
}
input, textarea {
-webkit-user-select: auto;
}
textarea {
white-space: revert;
}

/*共通*/
/*font-family: 'IBM Plex Sans JP', sans-serif;*/
/*font-family: 'Shippori Mincho B1', serif;*/
body {
font-size: 16px;
font-family: 'IBM Plex Sans JP', sans-serif;
color: #fff;
position: relative;
background-image: url("/img/back_bottom.png"),url("/img/main_back.jpg");
background-repeat: no-repeat,no-repeat;
background-position: bottom center,top center;
background-size: 100%,cover;
background-color: #060037;
min-height: 100vh;
letter-spacing: .1rem;
}
section{
width: 100%;
max-width: 1060px;
text-align: center;
padding: 3rem;
margin: 0 auto;
}
a{
color: #fff;
transition: all 0.5s 0s ease;
}
a:hover{
opacity: 0.7;
transition: all 0.5s 0s ease;
}
@media (max-width: 768px) {
body{
background-image: url("/img/main_back_sp.jpg");
background-repeat: no-repeat;
background-position: top center;
background-size: cover;
font-size: 14px;
}
section{padding: 1.5rem;}
}

#sns{
position: relative;
min-height: 100vh;
}
#sns .sns-index{
position: absolute;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
width: 100%;
text-align: center;
padding: 3rem;
}
#sns div img{
width: 100%;
max-width: 150px;
}
#sns div a{
display: inline-block;
text-align: center;
padding: 15px;
}
@media (max-width: 768px) {
#sns{background: url(/img/main23_back_sp.jpg) no-repeat top center / cover;}
#sns div{padding: 0;}
}


@media (max-width: 768px) {
.sns-index a img{
max-width: 30%;
}
}


/*メイン*/
.back_bottom_img{
padding: 1.5rem 1.5rem 3rem;
background-image: url("/img/back_bottom.png");
background-repeat: no-repeat;
background-position: bottom center;
background-size: 100%;
}
@media (max-width: 768px) {
.back_bottom_img{padding: 0 0 3rem;}
}

.sns{
position: absolute;
top: 10px;
right: 10px;
}
.sns img{
width: 30px;
}
header{
max-width: 800px;
margin: 5rem auto 0;
}
@media (max-width: 768px) {
.sns{
position: absolute;
top: 0;
right: 10px;
}
.sns img{
width: 20px;
}
}

/*nwes*/
#news h2{
margin: 3rem auto 1rem;
}
#news .box{
background-color: rgba(37, 30, 28, 0.36);
background-blend-mode: multiply;
border-radius: 3rem;
padding: 1.5rem 3rem;
}
#news table{
width: 100%;
}
#news tr{
border-bottom: 1px solid #3f76bb;
}
#news tr:last-of-type{
border-bottom: none;
}
#news th,#news td{
padding: 1.5rem 1rem;
}
#news th{
font-weight: 600;
font-size: 2rem;
}
#news th span{
font-size: 1.4rem;
background: #000;
border-radius: 3rem;
padding: .3rem 1rem;
}
#news td{
text-align: left;
}
@media (max-width: 768px) {
#news h2{margin: 1rem auto 0;}
#news .box{padding: 0 3rem;}
#news th,#news td{
display: block;
width: 100%;
text-align: left;
padding: .5rem;
}
#news th{font-size: 1.8rem;padding-top: 1.5rem;}
#news th span{
font-size: 1.2rem;
padding: .3rem 1rem;
display: inline-block;
line-height: 120%;;
}
#news td{padding-bottom: 1.5rem;}
}

/*poster*/
#poster{
margin: auto;
padding: 3rem;
width: 100%;
}
#poster img{
width: 100%;
max-width: 500px;
}

/*start*/
#start{
margin: auto;
padding: 3rem;
width: 100%;
color: rgba(003, 019, 071, 1);
}
#start img{
width: 100%;
max-width: 350px;
float: left;
display: inline-block;
margin: 0 30px 30px 0;
}
#start div{
padding: 3rem;
background: rgba(255, 255, 255, 0.9);
border-radius: 3rem;
text-align: left;
vertical-align: baseline;
}
#start div span{
font-size: 140%;
font-weight: 700;
letter-spacing: 0.3rem;
}
@media (max-width: 768px) {
#start{
padding: 1.5rem;
}
#start img{
width: 80%;
float: none;
display: block;
margin: 15px auto 15px;
}
#start div{
padding: 1.5rem 2rem;
border-radius: 3rem;
}
}


/*eve01*/

/*final*/

footer{
position: relative;
background-blend-mode: multiply;
background: #222951;
width: 100vw;
margin: 0 calc(50% - 50vw);
padding: 3rem;
}
footer .info img{
width: 100%;
max-width: 500px;
}
footer .sns{
position: absolute;
top: 3rem;
right: 3rem;
height: 30px;
}
footer .sns img{
width: 30px;
}
@media (max-width: 768px) {
footer{margin: 0;}
footer .info {font-size: 90%;}
footer .sns{top: 1rem;right: 1rem;}

}

.sp-show{display: none;}
@media (max-width: 768px) {
.sp-show{display: inline}
.pc-show{display: none}
}
