@charset "utf-8";


/* ベース */
body{ height: 100%; background: #000; -webkit-text-size-adjust: 100%; }
*{ margin: 0; padding: 0; border:none; list-style: none; box-sizing: border-box; }
h1 , h2 , h3 , h4 , h5 , h6{ font-weight: normal; }
img{ vertical-align: text-bottom; }


/* フォント */
*{
font-family: "Noto Sans JP", sans-serif;
font-feature-settings: "palt";
font-weight: 500;
font-style: normal;
color: #573c61;
line-height: 1.8em;
}
::selection{ background: rgba(133, 133, 133, 0.5); color: #fff; }
/* ボタンリンク */
.bt-link{ transition: all 0.8s ease; animation: all 0.8s ease; box-shadow: 0px 0px 30px rgba(239, 61, 255, 0.0); }
.bt-link:hover{
-webkit-animation-name: pulse;
animation-name: pulse;
/*box-shadow: 0px 0px 30px #ff9dbf;*/
}
.no-link{ opacity: 0.2; cursor: default !important; }
.font-link{
color: #fff;
font-weight: 600;
transition: all 0.8s ease; animation: all 0.8s ease;
border-bottom: 1px #00d2ff solid !important;
}
.font-link:hover{ opacity: 0.5; }


/* main */
main{
width: 100%;
max-width: 2560px;
min-width: 700px;
min-height: 100vh;
position: relative;
margin: 0 auto;
}
/* main bg */
main > .bg{
width: 100%;
height: 100vh;
position: sticky;
top: 0;
}
main > .bg div{
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}
main > .bg div:nth-child(1){ background: linear-gradient(to bottom, #ef5769 0%, #b93e8c 50%, #533b60 100%); }
main > .bg div:nth-child(2){
background: url(../img/_bg.webp) center top;
mix-blend-mode: soft-light;
}


.wp{
width: 100%;
height: 100%;
position: absolute;
top: 0;
left: 0;
}


/* main -------------------- */


#top{
width: 1200px;
height: 1660px;
position: relative;
margin: -100vh auto 0;
}
#top > .bg{
width: 100%;
height: 100%;
background: url(../img/top_bg.jpg) no-repeat center top;
position: absolute;
top: 0;
left: 0;
}
#top > .bg p:nth-child(1){
width: 96px;
position: absolute;
top: 0.5%;
right: 0.5%;
}
#top > .bg p:nth-child(2){
width: 139px;
position: absolute;
top: 0.5%;
left: 0.5%;
}
#top > .bg p img{
display: block;
position: relative;
}
#top > .bg > div{
width: 100%;
height: 20%;
background: linear-gradient(to bottom, rgba(255,255,255,0) 0%, rgba(255,255,255,0.7) 100%);
position: absolute;
bottom: 0;
left: 0;
}

#top .item{
width: 100%;
position: relative;
margin: 0;
padding: 57% 5% 0;
}
#top .item > div{
width: 100%;
max-width: 926px;
position: relative;
margin: 0 auto;
}
#top .item p.staff{
width: 100%;
position: relative;
margin: 0 0 -40px;
}
#top .item h1{
width: 100%;
position: relative;
margin: 0 0 -40px;
}
#top .item p.day{
width: 100%;
position: relative;
}
#top .item h1 img,
#top .item p img{
width: 100%;
display: block;
position: relative;
}

#top .cg{
width: 100%;
height: 357px;
display: flex;
align-items: center;
justify-content: center;
position: relative;
margin: 0 0 25px;
}
#top .cg .bg{
width: 100%;
height: 100%;
background: url(../img/top_cg_bg.webp) no-repeat center;
position: absolute;
top: 0;
left: 0;
}
#top .cg ul{
width: 100%;
display: flex;
position: relative;
padding: 0 15px;
}
#top .cg ul li{
width: calc(33.33% - 20px);
position: relative;
margin: 0 10px;
}
#top .cg ul li img{
width: 100%;
display: block;
position: relative;
border-radius: 10px;
}

#top footer{
width: 100%;
position: relative;
}
#top footer p{
width: 100%;
font-size: 14px;
text-align: center;
position: relative;
padding: 0 5%;
text-shadow: 0 0 10px #ffffff , 0 0 5px #ffffff , 0 0 5px #ffffff , 0 0 5px #ffffff , 0 0 5px #ffffff , 0 0 5px #ffffff;
}


/* レスポンシブ */


/*
@media screen and (min-height: 1661px){

#top{
width: calc(100% - 60px);
overflow: hidden;
margin: calc(-100vh + 30px) 30px 30px;
border-radius: 30px;
}

}
*/


@media screen and (min-width: 2561px){



}


@media screen and (max-width: 1600px){



}


@media screen and (max-width: 1400px){



}


@media screen and (max-width: 1200px){



}


/* end */