@charset "utf-8";


/* 全体 *******************************************************************************************************************************/

html {
    font-size: calc(100vw / 32) !important;
}

.noto{
  font-family: 'Noto Sans JP', sans-serif;
}

section {
	position: sticky !important;
	top: -39%;
overflow:hidden;
}

@media screen and (max-width:1400px) {
section {
	top: -35%;
}
}

@media screen and (max-width:1400px) {
section {
	top: -29%;
}
}
@media screen and (max-width:1200px) {
section {
	top: -25%;
}
}
@media screen and (max-width:768px) {
section {
	position: relative !important;
}
section + section {
margin-top:-15%; 
}
}


/* ヘッダー *******************************************************************************************************************************/


/* 基本のヘッダー */
.header2 {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;             
  background: transparent;  
  transition: all 0.4s ease;
  z-index: 999;
  padding: 2% 2% 2% 20%;

	font-size:clamp(10px, 2.3vw, 14px);

}
.header2 i{
font-size:0.2rem !important;
}

.fa-chevron-down:before {
    content: "\f078";
    vertical-align: 20%;
}

/* ナビゲーション調整 */
.header2 nav ul {
  margin: 0;
  padding: 0;
  list-style: none;
  display: flex;
  gap: 1.5%;
}

.header2 nav a {
  text-decoration: none;
  color: #333;
  font-weight: bold;
}

/* 隠れるとき */
.header2.is-hidden {
  transform: translateY(-100%);
}

/* 500pxスクロール後の表示 */
.header2.scrolled {
  background: #fff;         /* 白背景 */
  width: 100%;              /* 幅100% */
  box-shadow: 0 2px 8px rgba(0,0,0,0.1);
  top: 0;
  left: 0;
  padding: 1% 1% 1% 20%;
}


@media screen and (max-width:768px) {
.header2 {
  padding: 6% 2% 2% 5%;
}
}

/* タイトルゾーン *******************************************************************************************************************************/

#mainimg {
    width: 100%;
    position: absolute;
padding-top: 34%;
position:relative;background:url(/event/files/back_line.png) no-repeat top right;background-size:48%;background-color: #eee;
}


#mainimg h1 {

    padding: 0;

    line-height: 1.5;
    font-weight: 700;
width:57%;position:absolute; right: 0;
  left: 0;bottom:8%;  margin: 0 auto;

font-size: 3.6vw;font-weight: 700;color:#313178;line-height:1.5;
}


span.title_2025{
font-size:2.7vw;color: #8891c3;margin-left:1em;letter-spacing: 1px;
}

.na_logo{
max-width:240px;margin:0.5em 2em;position:absolute;top:0;width:16%;
}


@keyframes mask {    
0%,100% {
	border-radius:6% 0% 10% 95% / 12% 0% 10% 85%;
}
50%{
	border-radius: 12% 0% 5% 85% / 15% 0% 5% 95%;
}  
}

.slide1 {
    width: 37%;
    height: auto;
    position: absolute;
    right: 0%;
    top: -7.5%;
}

.slide1 {
	animation: slide1 100s linear infinite, mask 10s linear infinite,opa1 1s linear;
}

.day_time{
border-radius:2px;  margin: 0;  
  padding: 0.1% 1.5% 0.1% 1.8%; position:absolute;   left: 16%;top:36%; 
font-weight: 700;color:#fff;background:#a0a7cd;letter-spacing:0.04rem;
	font-size:25px;
display:block;
}






@keyframes mask2 {  
  
0%, 100% {
	border-radius:50% 50% 50% 50% / 50% 50% 50% 50%;
}
50% {
	border-radius:45% 45% 35% 45% / 45% 45% 45% 42% ;
}  
}

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

}

.slide2 {
	animation: slide2 100s linear infinite, mask2 6s linear infinite,opa1 1s linear;
}


@keyframes mask3 {  
  
0%, 100% {
	border-radius:50% 50% 50% 50% / 50% 50% 50% 50%;
}
50% {
	border-radius:45% 45% 35% 45% / 45% 45% 45% 42% ;
}  
}

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

}

.slide3 {
	animation: slide3 100s linear infinite, mask3 6s linear infinite,opa1 1s linear;
}


.setsumei_txt{
position:absolute;width:40%;right:8%;top:12%;
}

.setsumei_txt p:nth-child(1){
.responsive-letter03{
	font-size:clamp(10px, 2.3vw, 12px);
display:block;
}

color: #000;text-indent:-1em !important;line-height: 1.8; 
}

.setsumei_txt p:nth-child(2){
line-height: 1.7; color: #6573bd;
}
.setsumei_txt p:nth-child(2) a{
 color: #6573bd;

}

.setsumei_txt p:nth-child(2) a:hover{
 color: #44379f;
}

.setsumei_txt p:nth-child(2) span.nichiji{
letter-spacing:0.33em;
}
span.s_br br{
display:none;
}

@media screen and (max-width:1200px) {
.setsumei_txt{
transition-duration:0.6s;
width:50%;
right:2%;
top:12%;
}
}

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

.day_time{
  padding: 0.1% 1.5% 0.1% 1.8%; position:absolute;   left: 10%;top:40%; 
	font-size:16px;

}



.setsumei_txt{
transition-duration:0.6s;
width:60%;
right:2%;
top:0;
}
}

@media screen and (max-width:1000px) {
span.title_2025{
font-size:3.2vw;
}
#mainimg {
    width: 100%;
    position: absolute;
padding-top: 44%;
position:relative;background:url(/event/files/back_line.png) no-repeat top right;background-size:48%;background-color: #eee;
transition-duration:0.6s;
}

#mainimg h1 {
transition-duration:0.6s;

    padding: 0;
    font-size: 4.4vw;
    line-height: 1.5;

width:72%;
position:absolute;
 right: 0;
  left: 0;bottom:13%; 
 margin: 0 auto;
font-weight: 700;
color:#313178;line-height:1.5;
}
}
@media screen and (max-width:950px) {
.setsumei_txt p:nth-child(1){
display:none;
}
}

@media screen and (max-width:768px) {
.na_logo{
transition-duration:0.6s;
max-width:240px;margin:0.5em 1em;position:absolute;top:0;width:16%;
}

span.title_2025{
font-size:3.2vw;
}

span.s_br br{
display:inline;
}
.setsumei_txt{
transition-duration:0.6s;
width:65%;
right:2%;
top:0%;
}
.setsumei_txt p:nth-child(2) span.nichiji{
letter-spacing:0;
}
.day_time{
display:none;
}
#mainimg h1 {
letter-spacing: -1px;
}
}
@media screen and (max-width:599px) {
span.title_2025{
font-size:4.0vw;
}

#mainimg h1 {
transition-duration:0.6s;

    padding: 0;
    font-size: 5.2vw;
    line-height: 1.5;

width:85%;
position:absolute;
 right: 0;
  left: 0;bottom:13%; 
 margin: 0 auto;

color:#313178;line-height:1.5;
}
}

/* Aboutゾーン *******************************************************************************************************************************/

#mainimg2 h3{
	font-size:clamp(13px, 2.3vw, 28px);
}


#mainimg2 {
    width: 100%;
    position: absolute;
padding-top: 55%;
position:relative;background:url(/event/files/back_line2.png) no-repeat top left;background-size:100%;background-color: #eee;
}



.circle_width {
width: 11.5%;
    position: absolute;
    top: 2.85%;
    left: 5.95%;
}
 
.circle_height {
position: relative;
padding-top: 100%;
height: 0;
}
 

.circle_width2 {
  width: 9.3%;
    position: absolute;
    top: 11.5%;
    left: 21.1%;
}

 
.circle_height2 {
position: relative;
padding-top: 100%;
height: 0;
}


#enter_btn{
position: absolute;top: 25%;
}

.niconico_enter{
border-radius: 2px;position: absolute;top: 49%;width: 20%;left: 13%;background:rgba(255,255,255,0.4);display: flex;justify-content: center;align-items: center;
}

.niconico_enter figure a:hover{
opacity:0.6;
}

.niconico_enter figcaption{
padding:0.2rem 0;color:#3c467c;font-weight:bold;line-height: 1.3;
	font-size:clamp(9px, 2.3vw, 18px);
}

.niconico_enter figcaption br{
display:none;
}

#about{
color:#fff;position: absolute;top: 66%; left: 42.5%;letter-spacing:0.03rem;font-weight:bold;
}


.gaiyo_txt{
color:#fff;position: absolute;top: 76%;width: 36%;left: 42%;
display:block;
}

.gaiyo_txt2{
display:none;
}




a.download{
letter-spacing:0;
}

@media screen and (max-width:1200px) {
#about{
top: 66%; left:39%;
}
.gaiyo_txt{
top: 76%;width: 55%;left: 38%;
}
.niconico_enter{
top: 38%;width: 25%;left: 5%;
}
}
@media screen and (max-width:1100px) {
.niconico_enter {
transition-duration:0.6s;
    width: 25%;
}


}
@media screen and (max-width:1050px) {
.gaiyo_txt{
top: 75%;width: 55%;left: 38%;
line-height:1.8;
}
}

@media screen and (max-width:768px) {
#mainimg2 h3{
	font-size:13px;
}

.setsumei_txt p:nth-child(2) {
    line-height: 1.6;
}
a.download{
letter-spacing:-1px;
}

#enter_btn{
top: 20%;
}
.gaiyo_txt2{
color:#fff;position: absolute;
top: 75%;width: 59%;left: 36.5%;
line-height:1.5;
text-indent: -0.5em;

display:block;
}
.gaiyo_txt{
display:none;
}
    #about {
        top: 66%;
        left: 35%;
    }

.niconico_enter figcaption{
padding:0.2rem 0;color:#3c467c;font-weight:bold;line-height: 1.3;
	font-size:80%;
}

}
@media screen and (max-width:560px) {
.niconico_enter figcaption br{
display:inline;
}

.gaiyo_txt{
top: 70%;width: 55%;left: 38%;
line-height:1.5;
}
#about{
letter-spacing:0px;
}

}


/* 注目企画 *******************************************************************************************************************************/
 
/**************/
.naname{
background:#eee;
position: relative;
padding-bottom: 30%;
}

.naname h2{
padding-top:1.2rem;
	font-size:clamp(22px, 2.3vw, 35px);
    font-weight: bold;
    letter-spacing: 0.1rem;
    color: #45495d;
}
.naname::before {
background:#eee;
    top: -6vw;
    clip-path: polygon(0 100%, 100% 0, 100% 100%);
content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: calc(6vw + 1px);
}

.naname_sakai{
background:#8992c4;height:150px;
}

.naname_sakai2{
background: transparent;
height:150px;
}
/**************/

#mainimg3 {
    width: 100%;
}

.chumoku_kikaku{
letter-spacing:1px;text-align:center;
	font-size:clamp(8px, 2.3vw, 14px);
color:#171e47;
}


.chumoku_wrap{
display: flex;justify-content: space-around;width:72%;margin:4% auto 0;
 flex-wrap: wrap;
}

.chumoku_waku{
width:40%;padding:0.4rem;border:solid 2px #646282;
margin-bottom: 0.7rem;
}


.chumoku_waku .chumoku_fff{
background:#fff;width:100%;height:100%;
}

.chumoku_waku figure figcaption span.font-weight-bold{
	font-size:clamp(15px, 2.3vw, 17px);
    line-height: 1.1;
}

.chumoku_waku figure figcaption p{
	font-size:clamp(14px, 2.3vw, 15px);
line-height:1.6;
text-align:left;
}
.chumoku_waku figure figcaption{
text-align:left;
}
.chumoku_waku figure div{
overflow:hidden;padding:0;
text-align:left;
}


.chumoku_waku figure div p{
line-height:1.5;
}


.chumoku_waku figure img{
width:100%;
margin-top:0;
}

@media screen and (max-width:1000px) {
.chumoku_waku figure figcaption{
text-align:center;
}

.chumoku_waku figure img{
transition-duration:0.6s;
}

.chumoku_waku figure div{
text-align:center;
}
.chumoku_wrap{
transition-duration:0.6s;
display: flex;justify-content: space-around;width:90%;margin:4% auto 0;
 flex-wrap: wrap;
}

.chumoku_waku{
transition-duration:0.6s;
width:45%;
padding:0.4rem;border:solid 2px #646282;
}
}

@media screen and (max-width:768px) {
.naname_sakai {
    height: 55px;
}
.naname_sakai2{
height:50px;
}
.chumoku_wrap{
width:98%;
}

.chumoku_waku figure img{
width:100%;
margin-top:0rem;
}
.chumoku_waku{
margin-bottom: 1rem;
}
.naname h2 {
    padding-top: 4.2rem;
}
}

/* 過去の動画ゾーン *******************************************************************************************************************************/

/**************/
.naname2{
background:#8992c4;
    position: relative;
}


.naname2::before {
background:#8992c4;
    top: -6vw;
    clip-path: polygon(0 100%, 100% 0, 100% 100%);
content: "";
    position: absolute;
    left: 0;
    width: 100%;
    height: calc(6vw + 1px);
}
/**************/



#past_videos{
letter-spacing:0.1rem;font-weight:bold;text-align:center;
	font-size:clamp(22px, 2.3vw, 35px);
color:#fff;padding-bottom:0.04rem;
}

.past .col-xl-4{
background:rgba(255,255,255,0.6);
}

#past_videos + h4{
letter-spacing:1px;text-align:center;
	font-size:clamp(8px, 2.3vw, 14px);

color:#fff;padding-bottom:0.7rem;
}

.video_txt{
background:rgba(255,255,255,0.8);

}


.video_txt h3{
padding-bottom:0.5rem;
	font-size:clamp(15px, 2.3vw, 17px);

color:rgb(83 92 149);border-bottom: dotted 1px rgb(74 81 124);padding-bottom: 0.2rem;margin-right: 0.2rem;    padding-left: 0.2rem;
}


.video_txt p{
color: #000;
	font-size:clamp(14px, 2.3vw, 17px);
line-height:2;
}

.video_txt ul li{
color: #000;
	font-size:clamp(14px, 2.3vw, 17px);
}


@media screen and (max-width:1000px) {
.video_txt p{
line-height:1.6;
}

}

/* お知らせゾーン *******************************************************************************************************************************/

.naname3{
background:#eee;padding-top:8%;
}

h3.news{
letter-spacing:0.1rem;font-weight:bold;text-align:center;
	font-size:clamp(22px, 2.3vw, 35px);
color:#7884c7;padding-bottom:0.04rem;
}
h3.news + h4{
letter-spacing:1px;text-align:center;
	font-size:clamp(8px, 2.3vw, 14px);

color:#5967b8;padding-bottom:0.7rem;
}


.news_2025{
width:55%;
margin:0 auto 10%;
background:rgba(255,255,255,0.6);
padding:0.7rem 1rem;
height:200px;overflow-y:scroll;
font-size:clamp(14px, 2.3vw, 16px);
}

.news_2025 dl dt{
clear:both;
float:left;
width:9em;
border-bottom:dotted 1px #bbb;
} 
.news_2025 dl dd{
float:left;
width:80%;
border-bottom:dotted 1px #bbb;
color: #000;
} 

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

.news_2025 dl dt{
clear:both;
float:none;
width:100%;
border-bottom:0;
} 
.news_2025 dl dd{
float:none;
width:100%;
border-bottom:dotted 1px #bbb;
} 
}

@media screen and (max-width:1000px) {
.news_2025{
transition-duration:0.6s;
width:75%;
}
}

@media screen and (max-width:768px) {
.news_2025{
width:85%;
}
}

/* SNSゾーン *******************************************************************************************************************************/

h3.sns{
letter-spacing:0.1rem;font-weight:bold;text-align:center;



	font-size:clamp(22px, 2.3vw, 35px);

color:#7884c7;padding-bottom:0.04rem;
}

h3.sns + h4{
letter-spacing:1px;text-align:center;
	font-size:clamp(8px, 2.3vw, 14px);

color:#5967b8;padding-bottom:0.7rem;
}


#icons {
    text-align: center;
    background: transparent;
position:relative;
    width: 100%;
   padding: 10px 0 5%;
}

#icons > div {
  display: inline-block;
  margin: 10px;
}

.flip-container {
  width: 100px;
  height: 100px;
}
.flip-container:hover {
cursor:pointer;
}
#flip,#flip2,#flip3 {
  width: 100px;
  height: 100px;
  position: relative;
  transition: all 0.275s ease-out;
  transform-style: preserve-3d;
color: #6470b2;
}
.flip-container:hover #flip2,.flip-container:hover #flip3,
.flip-container:hover #flip {
  transform: rotateX(180deg);
}
#flip2 i,#flip3 i,
#flip i {
  position: absolute;
  border: 1px solid #6470b2;
  line-height: 97px;
  font-size: 2.5em;
  display: block;
  width: 100%;
  height: 100%;
  text-align: center;
  -webkit-backface-visibility: hidden;
          backface-visibility: hidden;
}
#flip2 i:first-of-type,#flip3 i:first-of-type,
#flip i:first-of-type {
  z-index: 100;
}

#flip i:last-of-type {
  transform: rotateX(180deg);
  color: white;
  background: #000;
  border-color: #000;
}

#flip2 i:last-of-type{
  transform: rotateX(180deg);
  color: white;
  background: #3B579D;
  border-color: #3B579D;
}

#flip3 i:last-of-type{
  transform: rotateX(180deg);
  color: white;
  background: #BC0303;
  border-color: #BC0303;
}



/* フッター *******************************************************************************************************************************/
.copyright{
line-height:1.5;    text-align: center;  width: 100%;
    padding: 10px 0 20px;
}
