@charset "UTF-8";



.number-animation{
	position: absolute;
	width:6.5%;
	right:34.5%;
	top:20.7%;
}


.count-base{
	height:auto;
	width: 100%;
	display: block;
	position: relative;
	line-height: 0;
	opacity: 0;
}

.count{
	 position: absolute;
    line-height: 0;
	 top:0;
	left:0;
	opacity: 0;
}



@media screen and (max-width: 767px) {
	
	
	
	.number-animation{
	position: absolute;
	width:13%;
	right:19%;
	top:36%;
}
	
	
	
	
	

.modaal-inner-wrapper {
    display: table-cell;
    width: 100%;
    height: 100%;
    position: relative;
    vertical-align: middle;
    text-align: center;
    padding: 80px 0px !important;
}
	
}



/*news*/
/* =========================================
   TOP NEWS LIST
   通常：画像なし
   .newsThumbList--grid：画像ありグリッド
========================================= */

#news {
  /* background-color: var(--background-color); */
}

.news-top {
  width: 90%;
  max-width: 1280px;
  margin: auto;
}

.container-news {
  margin-top: 5rem;
  min-height: 50vh;
}

/* -----------------------------------------
   共通
----------------------------------------- */

.newsThumbList {
  display: flex;
  flex-direction: column;
  gap: 14px;
}

.newsThumbCard {
  position: relative;
  display: block;
  color: #fff;
  text-decoration: none;
  overflow: hidden;
  border: 1px solid hsla(0, 0%, 100%, 0.14);
  background: var(--color-06);
  transition:
    border-color 0.3s ease,
    background-color 0.3s ease,
 /*   transform 0.3s ease,*/
 /*   box-shadow 0.3s ease;*/
}

.newsThumbCard:hover {
  border-color: hsla(0, 0%, 100%, 0.24);
  background: var(--color-05b);
}

.newsThumbCard__date {
  color:var(--color-07);
  font-size: clamp(1rem, 0.964rem + 0.18vw, 1.1rem);
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.05em;
  font-family: var(--base-font-family2);
}

.newsThumbCard__title {
  color: #ffffff;
  font-size: var(--font-size-large);
  font-weight: 600;
  line-height: 1.45;
  letter-spacing: 0.02em;
  word-break: break-word;
}

.newsThumbCard__arrow {
  position: absolute;
  top: 50%;
  right: 28px;
  z-index: 3;
  transform: translateY(-50%);
  color: rgba(255, 255, 255, 0.72);
  font-size: 3.4rem;
  line-height: 1;
  transition:
    transform 0.25s ease,
    color 0.25s ease,
    opacity 0.25s ease;
}

.newsThumbCard:hover .newsThumbCard__arrow {
  transform: translateY(-50%) translateX(4px);
  color: rgba(255, 255, 255, 1);
  opacity: 1;
}

/* -----------------------------------------
   通常版（画像なし）
----------------------------------------- */

.newsThumbList:not(.newsThumbList--grid) .newsThumbCard {
  min-height: 148px;
}

.newsThumbList:not(.newsThumbList--grid) .newsThumbCard__thumb {
  display: none;
}

.newsThumbList:not(.newsThumbList--grid) .newsThumbCard::before {
  display: none;
}

.newsThumbList:not(.newsThumbList--grid) .newsThumbCard__label {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 3;
  min-width: 188px;
  padding: 10px 18px 9px;
  background: var(--color-04);
  color: #fff;
  font-family: var(--base-font-family2);
  font-size: clamp(0.9rem, 0.864rem + 0.18vw, 1rem);
  line-height: 1;
  letter-spacing: 0.04em;
  text-align: center;
}

.newsThumbList:not(.newsThumbList--grid) .newsThumbCard__body {
  position: relative;
  z-index: 3;
  min-height: 148px;
  padding: 38px 96px 30px 42px;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.newsThumbList:not(.newsThumbList--grid) .newsThumbCard__date {
  margin-bottom: 16px;
}

/* -----------------------------------------
   グリッド版（画像あり）
----------------------------------------- */

.newsThumbList--grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 14px;
}

.newsThumbList--grid .newsThumbCard {
  min-height: auto;
  height: 100%;
  display: flex;
  flex-direction: column;
  background: transparent;
}

.newsThumbList--grid .newsThumbCard__thumb {
  display: block;
  position: relative;
  overflow: hidden;
  aspect-ratio: 16 / 9;
  background: #000;
  line-height: 0;
}

.newsThumbList--grid .newsThumbCard__thumb img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  transition: transform 0.35s ease, opacity 0.35s ease;
}

.newsThumbList--grid .newsThumbCard:hover .newsThumbCard__thumb img {
  transform: scale(1.05);
  opacity: 0.95;
}

.newsThumbList--grid .newsThumbCard__body {
  position: relative;
  z-index: 3;
  padding: 20px 18px 22px;
  min-height: 0;
  display: flex;
  flex-direction: column;
  justify-content: flex-start;
  background: var(--color-06);
  flex: 1 1 auto;
  transition:
    background-color 0.3s ease,
    border-color 0.3s ease;
}

/* ラベルは本文ボックス右上に貼り付け */
.newsThumbList--grid .newsThumbCard__label {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 4;
  min-width: 132px;
  padding: 9px 14px 8px;
  background: var(--color-04);
  color: #fff;
  font-family: var(--base-font-family2);
  font-size: clamp(0.72rem, 0.684rem + 0.18vw, 0.82rem);
  line-height: 1;
  letter-spacing: 0.04em;
  text-align: center;
  white-space: nowrap;
  transition:
    background-color 0.3s ease,
    color 0.3s ease;
}

/* 日付は左 */
.newsThumbList--grid .newsThumbCard__date {
  margin-bottom: 12px;
  font-size: clamp(0.8rem, 0.764rem + 0.18vw, 0.9rem);
  line-height: 1;
  padding-right: 148px;
}

.newsThumbList--grid .newsThumbCard__title {
  font-size: clamp(0.95rem, 0.877rem + 0.36vw, 1.15rem);
  line-height: 1.6;
}

/* 画像以外の部分の hover を画像なし版に寄せる */
.newsThumbList--grid .newsThumbCard:hover .newsThumbCard__body {
  background: var(--color-05b);
}

.newsThumbList--grid .newsThumbCard:hover .newsThumbCard__label {
  background: var(--color-04);
  color: #fff;
}

.newsThumbList--grid .newsThumbCard__arrow {
  top: auto;
  bottom: 14px;
  right: 16px;
  transform: none;
  font-size: 2rem;
}

.newsThumbList--grid .newsThumbCard:hover .newsThumbCard__arrow {
  transform: translateX(4px);
}

/* -----------------------------------------
   Tablet
----------------------------------------- */

@media screen and (max-width: 1024px) {
  .newsThumbList:not(.newsThumbList--grid) .newsThumbCard {
    min-height: 132px;
  }

  .newsThumbList:not(.newsThumbList--grid) .newsThumbCard__body {
    min-height: 132px;
    padding: 30px 74px 24px 28px;
  }

  .newsThumbList:not(.newsThumbList--grid) .newsThumbCard__label {
    min-width: 168px;
    padding: 9px 14px 8px;
  }

  .newsThumbList:not(.newsThumbList--grid) .newsThumbCard__title {
    font-size: clamp(1.25rem, 1.105rem + 0.73vw, 1.65rem);
  }

  .newsThumbList:not(.newsThumbList--grid) .newsThumbCard__arrow {
    right: 22px;
    font-size: 2.8rem;
  }

  .newsThumbList--grid {
    grid-template-columns: repeat(2, 1fr);
    gap: 12px;
  }

  .newsThumbList--grid .newsThumbCard__body {
    padding: 18px 16px 20px;
  }

  .newsThumbList--grid .newsThumbCard__label {
    min-width: 120px;
    padding: 8px 12px 7px;
    font-size: 0.74rem;
  }

  .newsThumbList--grid .newsThumbCard__date {
    padding-right: 132px;
  }
}

/* -----------------------------------------
   SP
----------------------------------------- */

@media screen and (max-width: 767px) {
  .news-top {
    width: 95%;
  }

  .container-news {
    margin-top: 3rem;
    min-height: 50vh;
  }

  .newsThumbList {
    gap: 10px;
      width:90%;
      margin: auto;
  }

  /* 画像なし */
  .newsThumbList:not(.newsThumbList--grid) .newsThumbCard {
    min-height: 104px;
  }

  .newsThumbList:not(.newsThumbList--grid) .newsThumbCard__label {
    min-width: 116px;
    padding: 8px 10px 7px;
    font-size: 0.72rem;
  }

  .newsThumbList:not(.newsThumbList--grid) .newsThumbCard__body {
    min-height: 104px;
    padding: 20px 42px 18px 16px;
  }

  .newsThumbList:not(.newsThumbList--grid) .newsThumbCard__date {
    margin-bottom: 10px;
    font-size: 0.8rem;
  }

  .newsThumbList:not(.newsThumbList--grid) .newsThumbCard__title {
    font-size: 1rem;
    line-height: 1.45;
  }

  .newsThumbList:not(.newsThumbList--grid) .newsThumbCard__arrow {
    right: 12px;
    font-size: 2rem;
  }

  /* 画像あり */
  .newsThumbList--grid {
    grid-template-columns: 1fr;
    gap: 10px;
  }

  .newsThumbList--grid .newsThumbCard__body {
    padding: 14px 14px 18px;
  }

  .newsThumbList--grid .newsThumbCard__label {
    min-width: 108px;
    padding: 7px 10px 6px;
    font-size: 0.68rem;
  }

  .newsThumbList--grid .newsThumbCard__date {
    margin-bottom: 10px;
    font-size: 0.8rem;
    padding-right: 118px;
  }

  .newsThumbList--grid .newsThumbCard__title {
    font-size: 1rem;
    line-height: 1.5;
  }

  .newsThumbList--grid .newsThumbCard__arrow {
    right: 10px;
    bottom: 10px;
    font-size: 1.6rem;
  }
}
/*----------------------------
*/



.container-news{
	margin-top: 5rem;
	min-height: 50vh;
}



.news-set{
    position: relative;
    border: 1px solid hsla(0,0%,100%,0.2);
    padding: 3rem 3rem;
    background: hsla(0, 0%, 0%, 0.32); /* box-shadow: 0px 0px 16px hsla(206, 100%, 50%, 0.55);*/
}


.news-set{
  position: relative;
  padding: 4.5rem 3rem 3rem;
}

.news-set .newsThumbCard__label{
  position: absolute;
  top: 0;
  right: 0;
  z-index: 3;
  min-width: 188px;
  padding: 10px 18px 9px;
  background: var(--color-04);
  color: #fff;
  font-family: var(--base-font-family2);
  font-size: clamp(0.9rem, 0.864rem + 0.18vw, 1rem);
  line-height: 1;
  letter-spacing: 0.04em;
  text-align: center;
}


@media screen and (max-width: 767px) {
  .news-set{
    padding: 3.25rem 1rem 1rem;
  }

  .news-set .newsThumbCard__label{
    min-width: 116px;
    padding: 8px 10px 7px;
    font-size: 0.72rem;
  }
}


.news-set hr{
  border: none;
  height: 1px;
  background: hsla(0,0%,100%,0.20);
  margin: 1.5rem 0;
}

.news-text-item{
	position: relative;
	width: 100%;
	line-height: 1.9rem;
 /* text-shadow: 0px 0px 5px rgba(255, 255, 255, 0.6);*/
}

.news-text-item.about{
	position: relative;
	width: 100%;
	line-height: 1.8rem;
/*font-size: clamp(1rem, 0.818rem + 0.91vw, 1.5rem);*/
}



.news-name{
	
	margin-bottom: 1rem;
	position: relative;
	color:#525252;
    
	

	
	
	font-size:clamp(1.4rem, 1.327rem + 0.36vw, 1.6rem);
	line-height: 2rem;
}

.news-name.about{
	text-align: center;
}


.name2{
	font-size:70%;
	margin-left: 0rem;
}



.news__title{
	color: var(--title-font-color);
  font-weight: 700;
	margin-bottom: 1.5rem;
	font-size:clamp(1.3rem, 1.045rem + 1.27vw, 2rem);
	text-align: left;
	line-height: 2.5rem;
	/*font-family: var(--base-font-family2);*/
   /*  text-shadow: 0px 0px 5px rgba(255, 255, 255, 0.6);*/
}

.news__bold,
strong{
	color: var(--color-02);
	font-weight:var(--font-weight-bold2);
    
}

.news__yellow{
	color: var(--color-02)!important;   
}


.news__white{
	color: var(--color-02)!important; 
}

.news__large{
font-size:clamp(1.125rem, 1.08rem + 0.23vw, 1.25rem);
 color: var(--link-font-color);
font-weight:var(--font-weight-bold2);
}


.news__small{
	font-weight: 500;
	font-size:clamp(0.7rem, 0.664rem + 0.18vw, 0.8rem);
	line-height: 1.5;
}

.news-text-item p{
	margin-bottom: 1rem;
}


p.news__margin {
	margin-bottom: 1.25rem;
}



.news__img{
	position: relative;
	width:100%;
	margin:2rem auto;
	
	
	 display: flex;
  justify-content: center;
  align-items: center;
	
	
}

.news__img_v{
	width:80%;
	/*max-width:600px;*/
}

.news__img_v2{
	width:70%;
/*	max-width:500px;*/
}


.news-footer__set{
	display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
 /* justify-content: space-between;*/
	justify-content: center;
	
}

.news-footer_bt1{
	/*width:48px;*/
}

.news-footer_bt2{
	/*width:200px;*/
	margin:0 1rem;
	line-height:100px;
}

.news-footer_bt2 a{
	
}


.news__youtube{
	width: 82%;
	margin: 2rem auto;
	
}

#traileriframe{
	/*border: 1px solid #000;*/
	/*border: 1px solid hsla(178,87%,67%,0.3);*/
}


.trailer_narrow{
	max-width: 800px;
}




.news__date {
	/*font-size: clamp(0.7rem, 0.664rem + 0.18vw, 0.8rem); */
	/*margin: 0px 0px 3px;*/
	font-family: var(--base-font-family);
	margin-bottom: 0.5rem;
}


@media screen and (max-width: 767px) {
	
	
	.container-news{
	margin-top: 3rem;
	min-height: 50vh;
}

	.news-set{
	/*padding:1rem 1rem;*/
		
	padding: 1rem 1rem;
	
}

	.news__title{
	
	margin-bottom: 1rem;
	line-height: 1.6rem;
}
	
	.news-text-item{
	line-height: 1.7rem;

}
	
	.news__img{
	position: relative;
	width:100%;
	margin:1.5rem auto;	
}
	
	.news__img_v{
	width:85%;
}
	
	
	.news-footer__set{

	margin:2rem 0;
}
	
	.news-footer_bt1{
	width:46px;
}

.news-footer_bt2{
/*	width:160px;*/
	margin:0 0.5rem;
	height: 100%;
}
	
	.news__youtube{
	width:100%;
	margin:1rem auto;
}
	
}



/*about the movie*/



.bg-color_black{
	position: relative;
	background-color: hsla(0,0%,0%,0.4);	
}

.bg-color_black2{
    position: relative;
    background-color: hsla(240,2%,11%,1.00);
}

#about{
	position: relative;
	
}

.bg-wrapper{
    position: fixed;
    width: 100%;
    top: 0;
    background-image: url("../img/common/base_01.webp");
    background-repeat: no-repeat;
    background-position: center center;
    background-size: cover;
    /*    background-color: hsla(0,0%,0%,1.00);*/
    background-attachment: fixed;
    height: 100vh;
    z-index: 0;
}


.scroll-contents {
    position:relative;
    margin: auto;
    left: 0;
    right: 0;
    overflow: hidden;
	/*max-width: 1000px;*/
	width:100%;
    z-index: 10;
	height:auto;
	

}


.center-max{
	 position:relative;
	margin:auto;
	width:95%;
	max-width: 1200px;
}


.contents__about{
	position: relative;
	width: 100%;
	max-width: 1200px;
	margin: auto;
	
	}


#intro_01{
    margin-top:10vh;
}


#intro_02{
    margin-top:40vh;
     margin-bottom:10vh;
}

	
#story{
	position: relative;
	background-color:hsla(51,100%,50%,0.87);	
    padding-top:10vh;
    padding-bottom:10vh;
}


@media screen and (max-width: 767px) {
	
	.bg-wrapper{
    position: fixed;
    width: 100%;
    top: 0;
    background-image : none;
}
    
    
      .bg-wrapper::before {
	content: "";
	display: block;
	position: fixed;
	top: 0;
	left: 0;
	z-index: -1;
	width: 100%;
	height: 100vh;
	background-repeat: no-repeat;
	background-position: center bottom;
	background-image: url(../img/common/base_01_sp.webp);
	background-size: cover;
    }
    
    
    .scroll-contents {
    position:relative;
    margin: auto;
    left: 0;
    right: 0;
    overflow: hidden;
	max-width: 100%;
	width:100%;
    z-index: 10;
	height:auto;
}
	
	

	
}







/*ムビチケ*/



.mvtk__area{
	position: relative;
	max-width: 840px;
	width: 100%;
	/*background-color: hsla(0,0%,14%,1.00);*/
	/*border: 1px solid hsla(0,0%,20%,1.00);*/
	
	margin-left: auto;
	 margin-right: auto;
}

.mvtk__bnr{
	/*border-radius: 6px;*/
	/*    border: 1px solid #ccc;*/
max-width: 480px;
	
}

#mvtk-widgets-container{
	width: 342px;
		margin:auto;
	left:0;
	right:0;

}








@media screen and (max-width: 767px) {
	.mvtk__area{
	position: relative;
	max-width:342px;
	width: 100%;
	/*background-color: hsla(0,0%,14%,1.00);*/
/*	border: 0px solid hsla(0,0%,20%,1.00);*/
}
	
}


/*tween24*/

#box{
	
	/*top:20%;
	left:10%;*/
}

.box{
	opacity: 0;
	position: relative;
	width:50px;
	height:50px;
	margin-bottom: 1rem;
	background-color: aqua;
}





/*gallery*/


/*thumb*/

.gallery-thumb{
	
display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  justify-content: space-between;
	
	}


.gallery-thumb__item{
	
	width:19.5%;
	
	border: 1px solid hsla(43,100%,66%,0.6);
	transition: all .3s;
	opacity: 0.8;
	margin-bottom: 5px;
}

.gallery-thumb__item:hover {
border: 1px solid hsla(43,100%,66%,1.00);
	opacity: 1;
}



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

	
	
	.gallery-thumb__item{
	
	width:49%;
		
		}
	
}


/*slick*/


.top-gallery{
	position: absolute;
	right: 0.5%;
	top: 45%;
	width: 25%;
	
	
}

.top-gallery-inner{
		position: absolute;
		width:80%;
	top:20%;
	left:10%;
}

.slideWrapper2{
	position: relative;
	width:100%
	

}


.modal-gallery{
	position: relative;
	width:100%;
	height: 100%;
/*	background-color: hsla(359,89%,33%,1.00);	*/
	
	max-width: 1200px;
	margin: auto;
	

	
}


.modal-gallery-inner{
	position: relative;
	 width: 100%;
    position: relative;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
		
}

.gallerytitle{
	text-align: center;

}


.modaal-fullscreen .modaal-container {
    max-width: none;
    height: 100vh;
    overflow: auto;
}


.modaal-fullscreen .next-arrow {
    right: 10px;
}

.modaal-fullscreen .prev-arrow{
	left: 10px;
}


.modaal-content,
.modaal-content-container{
	 height: 100%;
	padding:0;
}


@media screen and (max-width: 767px) {
	
	
	.top-gallery{
	position: relative;
	right:auto;
	top:auto;
	width:100%;
	
	
}

.top-gallery-inner{
	position: absolute;
		width:100%;
	top:18%;
	left:0;
	right:0;
	margin: auto;
}

.slideWrapper2{
	position: relative;
	width:100%
	

}
	
	
#gallery-item_sp .slick-slide img {
    	border: 1px solid hsla(43,100%,66%,0.6);
}
	
	
}








/*gallery-item*/



#gallery-item .slick-arrow {
    position: absolute;
    width: auto !important;
    max-width: auto !important;
    top: 0;
    bottom: 0;
    margin: auto;
    cursor: pointer;
    transition: 0.2s ease-in-out;
}


#gallery-item .next-arrow {
    right:-4%;
}


#gallery-item .prev-arrow {
    left:-4%;
}


/*dots*/


#gallery-item .slick-dots {
    position: absolute;
     bottom:auto; 
    display: block;
    width: 100%;
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: center;
    z-index: 100;
	line-height: 0;
	margin-top:6px;
}

#gallery-item .slick-dots li {
    position: relative;
    display: inline-block;
    width: 12px;
    height: auto;
    margin: 0 0px;
    padding: 0;
    cursor: pointer;
}




#gallery-item .slick-dots li button {
    font-size: 0;
    line-height: 0;
    display: block;

      width: 12px;
    height: auto;
    padding: 0px;
    cursor: pointer;
    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
}


#gallery-item .slick-dots li button:before {
    font-family: 'slick';	
    font-size:clamp(0.313rem, 0.196rem + 0.24vw, 0.5rem);
    line-height:0;
    position: absolute;
    top: 0;
    left: 0;
    content: '•';
    text-align: center;
/*    opacity: .3;*/
  /*  color: hsla(68,100%,63%,1.00);*/
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
	
}



@media screen and (max-width: 767px) {
	
	
	
	#gallery-item .slick-arrow {
    position: absolute;
    width: auto !important;
    max-width: auto !important;
    top: 0;
    bottom: 0;
    margin: auto;
    cursor: pointer;
    transition: 0.2s ease-in-out;
}


#gallery-item .next-arrow {
    right:-4%;
}


#gallery-item .prev-arrow {
    left:-4%;
}


/*dots*/


#gallery-item .slick-dots {
    position: absolute;
     bottom:auto; 
    display: block;
    width: 100%;
    padding: 0;
    margin: 0;
    list-style: none;
    text-align: center;
    z-index: 100;
	line-height: 0;
	margin-top:6px;
}

#gallery-item .slick-dots li {
    position: relative;
    display: inline-block;
    width: 12px;
    height: auto;
    margin: 0 0px;
    padding: 0;
    cursor: pointer;
}




#gallery-item .slick-dots li button {
    font-size: 0;
    line-height: 0;
    display: block;

      width: 12px;
    height: auto;
    padding: 0px;
    cursor: pointer;
    color: transparent;
    border: 0;
    outline: none;
    background: transparent;
}


#gallery-item .slick-dots li button:before {
    font-family: 'slick';	
    font-size:clamp(0.313rem, 0.196rem + 0.24vw, 0.5rem);
    line-height:0;
    position: absolute;
    top: 0;
    left: 0;
    content: '•';
    text-align: center;
/*    opacity: .3;*/
  /*  color: hsla(68,100%,63%,1.00);*/
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
	
}
	
	
	
	
}






/*countdown*/


.countdown{
	position: absolute;
	width:15%;
	top:40px;
	left:1%;
}

.countdown_base{
	position: absolute;
	top:0;
	left:0;
	
}


.countdown_text{
	position: absolute;
		top:35%;
	left:31%;
	font-size:clamp(0.8rem, 0.152rem + 3.24vw, 4.2rem);
	color: #fff;
text-shadow: 0px 0px 10px #ff4800;

}



.countdown_text2{
	position: absolute;
		top:47%;
	left:61%;
	font-size:clamp(0.4rem, 2vw, 2.5rem);
	color: #fff;
text-shadow: 0px 0px 10px #ff4800;

}








@media screen and (max-width: 767px) {
	.countdown{
	position: absolute;
	width:35%;
	top:22%;
	left:auto;
		right:3%;
}
	
	.countdown_text{
	position: absolute;
		top:35%;
	left:32%;
	font-size:clamp(1.4rem, -0.142rem + 8.22vw, 3.8rem);
	color: #fff;
text-shadow: 0px 0px 10px #ff4800;

}



.countdown_text2{
	position: absolute;
		top:47%;
	left:62%;
	font-size:clamp(0.8rem, -0.164rem + 5.14vw, 2.3rem);
	color: #fff;
text-shadow: 0px 0px 10px #ff4800;

}
	
}








/*bannerエリア*/



.section__dark{
	background-color:#652133;	
}


.tab-content {
  max-width: 1200px;
  margin: auto;
width:90%;
	padding:3rem 0 1rem;
}

.tab-content2 {
  max-width: 1400px;
 
}





.category__list {
 max-width: 1000px;
  margin: auto;
width:90%;

    display: flex;
}





.category__link,
.category__link2{
	display: block;
	padding: 10px;
	text-align: center;
	text-decoration: none;
	line-height: 1.2;
	color: hsla(0,0%,82%,1.00);
	
	    -webkit-box-flex: 1;
        -ms-flex-positive: 1;
            flex-grow: 1;
    padding: 20px 5px 15px;
    border-radius: 6px 6px 0 0;
 /*   font-size:var(--16px);*/
 transition-duration: 0.3s;
	cursor: pointer;
}


.category__link:hover,
.category__link2:hover{
	
	color: hsla(0,0%,100%,1);
}



.category__link[aria-current],
.category__link.current{
 background-color:#652133;	
color:var(--link-font-color);
}

.category__link2[aria-current],
.category__link2.current{
 background-color:#652133;	
color:var(--link-font-color);
}


  .category__item {
  
    width: calc((100% - 0px) / 3);
  }



@media screen and (max-width: 767px) {
	
.category__list {
 max-width: 1000px;
  margin: auto;
width:100%;

  flex-wrap: nowrap; 
}	
	
	
	.category__link,
	.category__link2{
		
		padding: 10px 5px;
		
		
	}

	  .category__item {
  
    width: 100%;
  }
}


.cardList .card {
	display: block;
	border: 1px solid var(--link-border-color);
	/*border-radius: 5px;*/
	/*color: inherit;*/
	text-decoration: none;
	transition: color .3s;
	/*	background-color: #000;*/
	background-color:var(--background-color2);
	height: 100%;
	/*color: #C80404;*/
	transition: all .3s;
/*	font-weight: 100;*/
}


.cardList .card:hover {
		border: 1px solid var(--link-border-color2);
}


.cardList.tab_list{
	grid-template-columns: repeat(4,1fr); /*均等2カラム指定*/
	grid-auto-rows: minmax(100px, auto);
	
}


.tab_list .card__text__base{
	position: relative;
	padding: 15px 15px;
	height: auto;
	min-height: auto;
	/*background-color: hsla(344,52%,26%,1.00);*/
}

.tab_list .card__text__base .card__text__base2{
	min-height: 3rem;
}

.tab_list .card__txt {
	font-size: clamp(0.85rem, 0.795rem + 0.27vw, 1rem); 
	line-height: 1.5rem;
text-align: center;
}


@media screen and (max-width: 767px) {
	
.cardList.tab_list{
	grid-template-columns: repeat(2,1fr); /*均等2カラム指定*/
	grid-auto-rows: minmax(100px, auto);
	
}	
	
	
	
}





.home_logo{
   position: fixed;
    left:25px;
    top:13px;
    width:46px;
    z-index: 990;
}



@media screen and (max-width: 767px) {
    
  .home_logo{
   position: fixed;
    left:10px;
    top:10px;
    width:40px;

}  
    
}


/* =========================================
   NAV OVERLAY
========================================= */




#g-nav.nav-overlay {
  position: fixed;
  inset: 0;
  z-index: 998;
  width: 100% !important;
  height: 100vh !important;
  background: none !important;
  right: auto !important;
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transition: opacity 0.35s ease, visibility 0.35s ease;
}

#g-nav.nav-overlay.panelactive {
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
}

.nav-overlay__bg {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 50% 18%, rgba(255,255,255,0.06), rgba(255,255,255,0) 32%),
    linear-gradient(180deg, rgba(0,0,0,0.70) 0%, rgba(0,0,0,0.92) 100%);
  backdrop-filter: blur(8px);
  -webkit-backdrop-filter: blur(8px);
  opacity: 1;
}

.nav-overlay__inner {
  position: relative;
  z-index: 2;
  width: 100%;
  height: 100%;
  padding: 24px 56px 36px;
  display: flex;
  flex-direction: column;
  justify-content: space-between;
}

.nav-overlay__top {
  display: flex;
  align-items: flex-start;
  justify-content: flex-start;
}

#g-nav.nav-overlay .g-nav_logo {
  position: relative;
  top: auto;
  left: auto;
  width: 130px;
  max-width: 38vw;
  display: block;
  opacity: 1;
  z-index: auto;
}

#g-nav.nav-overlay .g-nav-menu {
  list-style: none;
  width: min(560px, 100%);
  margin: 0 auto;
  padding: 0;
  position: static;
  display: block;
  text-align: center;
}

/* =========================================
   NAV ITEM
========================================= */

#g-nav.nav-overlay .nav-item {
  position: relative;
  list-style: none;
  text-align: center;
  opacity: 1;
  transform: none;
}

#g-nav.nav-overlay .nav-item::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 100%;
  height: 1px;
  background: linear-gradient(
    90deg,
    rgba(255,255,255,0) 0%,
    hsla(0,0%,100%,0.22) 20%,
    hsla(0,0%,100%,0.28) 50%,
    hsla(0,0%,100%,0.22) 80%,
    rgba(255,255,255,0) 100%
  );
  transform: translateX(-50%) translateY(0);
  transition:
    transform 0.28s ease,
    filter 0.28s ease,
    background 0.28s ease;
}

#g-nav.nav-overlay .nav-item a {
  position: relative;
  display: block;
  width: 100%;
  padding: 18px 0 16px;
  margin: 0;
  color: hsla(0,0%,100%,0.5);
  text-decoration: none;
  font-family: var(--base-font-family2);
  font-size: clamp(1.15rem, 1.032rem + 0.59vw, 1.5rem);
  font-weight: 700;
  letter-spacing: 0.14em;
  line-height: 1.15;
  transition:
    color 0.45s ease,
    text-shadow 0.45s ease,
    transform 0.25s ease;
}

#g-nav.nav-overlay .nav-label {
  display: inline-block;
  font-size: inherit;
}

#g-nav.nav-overlay .underline {
  display: none !important;
}

#g-nav.nav-overlay .nav-item:hover a {
  color: #ffffff;
  text-shadow:
    0 0 10px rgba(255,255,255,0.45),
    0 0 18px rgba(255,255,255,0.28),
    0 0 26px rgba(255,255,255,0.14);
}

#g-nav.nav-overlay .nav-item:hover::after {
  transform: translateX(-50%) translateY(-4px);
  filter: brightness(1.5);
  background: linear-gradient(
    90deg,
    rgba(255,255,255,0) 0%,
    hsla(0,0%,100%,0.34) 20%,
    hsla(0,0%,100%,0.48) 50%,
    hsla(0,0%,100%,0.34) 80%,
    rgba(255,255,255,0) 100%
  );
}

/* =========================================
   SUB MENU
========================================= */

.nav-overlay__sub {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 18px 22px;
  flex-wrap: wrap;
  opacity: 1;
  transform: none;
}

.nav-overlay__sub a {
  position: relative;
  color: hsla(0,0%,100%,0.58);
  text-decoration: none;
  font-size: 0.78rem;
  letter-spacing: 0.14em;
  line-height: 1.2;
}

.nav-overlay__sub a::after {
  content: "";
  position: absolute;
  left: 0;
  bottom: -4px;
  width: 0;
  height: 1px;
  background: hsla(0,0%,100%,0.7);
  transition: width 0.22s ease;
}

.nav-overlay__sub a:hover {
  color: #fff;
}

.nav-overlay__sub a:hover::after {
  width: 100%;
}

/* body lock */
body.is-nav-open {
  overflow: hidden;
}




/* =========================================
   OPEN BUTTON
========================================= */

.openbtn {
  position: fixed;
  top: 3px;
  right: 0;
  z-index: 999;
  width: 100px;
  height: 76px;
  padding: 0;
  border: 0;
  background: transparent;
  cursor: pointer;
  appearance: none;
  -webkit-appearance: none;
}

.openbtn span {
  position: absolute;
  left: 50%;
  height: 3px;
  background: #fff;
  transform: translateX(-50%);
  transition:
    transform 0.28s ease,
    opacity 0.22s ease,
    top 0.28s ease,
    width 0.28s ease,
    background-color 0.2s ease;
}

/* 1本目 */
.openbtn span:nth-child(1) {
  top: 23px;
  width: 44px;
}

/* 2本目 */
.openbtn span:nth-child(2) {
  top: 35px;
  width: 44px;
}

/* 3本目 */
.openbtn span:nth-child(3) {
  top: 47px;
  width: 14px;
  left: calc(50% - 15px);
}

/* hover */
.openbtn:hover span {
  background: hsla(0,0%,100%,0.85);
}

/* active時にX */
.openbtn.active span:nth-child(1) {
  top: 35px;
  width: 44px;
  left: 50%;
  transform: translateX(-50%) rotate(45deg);
}

.openbtn.active span:nth-child(2) {
  opacity: 0;
}

.openbtn.active span:nth-child(3) {
  top: 35px;
  width: 44px;
  left: 50%;
  transform: translateX(-50%) rotate(-45deg);
}

/* =========================================
   RESPONSIVE
========================================= */

@media screen and (max-width: 767px) {
  .nav-overlay__inner {
    padding: 18px 22px 26px;
  }

  #g-nav.nav-overlay .g-nav_logo {
    width: 110px;
    max-width: 52vw;
  }

  #g-nav.nav-overlay .g-nav-menu {
    width: 100%;
    max-width: 420px;
  }

  #g-nav.nav-overlay .nav-item a {
    padding: 16px 0 14px;
    font-size: clamp(1rem, 0.891rem + 0.55vw, 1.25rem);
    letter-spacing: 0.12em;
  }

  .nav-overlay__sub {
    gap: 12px 16px;
  }

  .nav-overlay__sub a {
    font-size: 0.72rem;
    letter-spacing: 0.10em;
  }

  .openbtn {
        top: 0px;
    width: 64px;
    height: 64px;
      
 
  }

  .openbtn span {
    height: 3px;
  }

  .openbtn span:nth-child(1) {
    top: 19px;
    width: 36px;
  }

  .openbtn span:nth-child(2) {
    top: 29px;
    width: 36px;
  }

  .openbtn span:nth-child(3) {
    top: 39px;
    width: 12px;
    left: calc(50% - 12px);
  }

  .openbtn.active span:nth-child(1) {
    top: 29px;
    width: 36px;
    left: 50%;
  }

  .openbtn.active span:nth-child(3) {
    top: 29px;
    width: 36px;
    left: 50%;
  }
}

/* =========================================
   MODAAL FRONT
========================================= */

.modaal-wrapper,
.modaal-outer-wrapper,
.modaal-inner-wrapper,
.modaal-container {
  z-index: 99990 !important;
}

.modaal-close {
  z-index: 100000 !important;
  opacity: 1 !important;
}

.modaal-close:focus,
.modaal-close:hover {
  opacity: 1 !important;
}




/* =========================================
   NAV OVERLAY EFFECT
========================================= */

/* 背景を少し演出 */
.nav-overlay__bg {
  position: absolute;
  inset: 0;
  background:
    radial-gradient(circle at 88% 10%, rgba(255,255,255,0.10), rgba(255,255,255,0) 22%),
    linear-gradient(180deg, rgba(0,0,0,0.58) 0%, rgba(0,0,0,0.82) 100%);
  backdrop-filter: blur(10px);
  -webkit-backdrop-filter: blur(10px);

  opacity: 0;
  clip-path: circle(0% at 100% 0%);
  transform: scale(1.12);
  filter: brightness(1.12);

  transition:
    clip-path 0.82s cubic-bezier(0.16, 1, 0.3, 1),
    opacity 0.32s ease,
    transform 0.82s cubic-bezier(0.16, 1, 0.3, 1),
    filter 0.82s cubic-bezier(0.16, 1, 0.3, 1);
}

#g-nav.nav-overlay.panelactive .nav-overlay__bg {
  opacity: 1;
  clip-path: circle(170% at 100% 0%);
  transform: scale(1);
  filter: brightness(1);
}

/* ロゴ */
#g-nav.nav-overlay .g-nav_logo {
  position: relative;
  top: auto;
  left: auto;
  width: 130px;
  max-width: 38vw;
  display: block;
  opacity: 0;
  transform: translateY(10px);
  transition:
    opacity 0.4s ease,
    transform 0.4s ease;
  transition-delay: 0s;
}


@media screen and (max-width: 767px) {
    
  #g-nav.nav-overlay .g-nav_logo {

  width: 90px;
margin-bottom: 0rem;
}  
    
}

#g-nav.nav-overlay.panelactive .g-nav_logo {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.12s;
}

/* menu item */
#g-nav.nav-overlay .nav-item {
  position: relative;
  list-style: none;
  text-align: center;
  opacity: 0;
  transform: translateY(12px);
  transition:
    opacity 0.38s ease,
    transform 0.38s ease;
}

#g-nav.nav-overlay.panelactive .nav-item {
  opacity: 1;
  transform: translateY(0);
}

/* 順番に出す */
#g-nav.nav-overlay.panelactive .nav-item:nth-child(1) {
  transition-delay: 0.18s;
}

#g-nav.nav-overlay.panelactive .nav-item:nth-child(2) {
  transition-delay: 0.26s;
}

#g-nav.nav-overlay.panelactive .nav-item:nth-child(3) {
  transition-delay: 0.34s;
}

/* 閉じる時は遅延なし */
#g-nav.nav-overlay .nav-item:nth-child(1),
#g-nav.nav-overlay .nav-item:nth-child(2),
#g-nav.nav-overlay .nav-item:nth-child(3) {
  transition-delay: 0s;
}

/* sub menu */
.nav-overlay__sub {
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 18px 22px;
  flex-wrap: wrap;
  opacity: 0;
  transform: translateY(8px);
  transition:
    opacity 0.35s ease,
    transform 0.35s ease;
}

#g-nav.nav-overlay.panelactive .nav-overlay__sub {
  opacity: 1;
  transform: translateY(0);
  transition-delay: 0.42s;
}





/*YTPlayer*/


.ytplayer-wrapper {
	position: absolute;
   /* position: relative;*/
    top: 0;
    left: 0;
    width: 100%;
   /* height: 50vh;*/
    height: 100%;
    z-index: 0;
    opacity: 1;
	/*	overflow-x: hidden;
	overflow-y: hidden;*/
    background-color: hsla(0,0%,0%,0.3); 
}


.ytplayer-overlay {
 /*   background-color: #000;*/
	 background-color: #000;
    opacity: 0.2;
    position: absolute; 
    top: 0; left: 0;
    bottom: 0; right: 0;
    width: 100%;
    height: 100%;
    z-index: 5;
}





/* top-bt scroll control */
#top-bt{
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
  transform: translateY(12px);
  transition:
    opacity 0.3s ease,
    visibility 0.3s ease,
    transform 0.3s ease;
}

#top-bt.is-show{
  opacity: 1;
  visibility: visible;
  pointer-events: auto;
  transform: translateY(0);
}



/* ===============================
   YouTube background
   #pc_top_00 の透過PNGを基準にする版
=============================== */

/* mainVisual 自体を基準にする */
.mainVisual{
	position: relative;
	overflow: hidden;
    
    margin-top:80px;
}

/* 透過PNGで高さを作る本体 */
#pc_top_00{
	position: relative;
	z-index: 2;
	line-height: 0;
}

#pc_top_00 picture,
#pc_top_00 img{
	display: block;
	width: 100%;
	height: auto;
}

/* 動画は #pc_top_00 が作った表示領域いっぱいに敷く */
.ytplayer-wrapper{
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	z-index: 1;
	/*background-color: #000;*/
	pointer-events: none;
}

#videoPlay{
	position: absolute;
	inset: 0;
	width: 100%;
	height: 100%;
	overflow: hidden;
	pointer-events: none;
	z-index: 1;
}

#videoPlay iframe{
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	border: 0;
	max-width: none;
	pointer-events: none;
}

/* 黒オーバーレイ */
.ytplayer-overlay{
	position: absolute;
	inset: 0;
	background: rgba(0,0,0,0.2);
	z-index: 2;
	pointer-events: none;
}

/* ロゴなどは動画より上 */
.top_logo,
.mainVisual__layer{
	position: absolute;
	z-index: 3;
}

/* SPも同じ考え方でOK */
@media screen and (max-width: 767px){

	.mainVisual{
		position: relative;
		overflow: hidden;
         margin-top:0px;
	}

	#pc_top_00{
		position: relative;
		z-index: 2;
	}

	.ytplayer-wrapper{
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
		overflow: hidden;
	}

	#videoPlay{
		position: absolute;
		inset: 0;
		width: 100%;
		height: 100%;
	}
}



#videoPlay{
	opacity: 0;
	transition: opacity 0.35s ease;
}

#videoPlay.is-ready{
	opacity: 1;
}




.header-base{
  overflow: hidden;
}

.header-base_black{
  height: 80px;
  opacity: 1;
}

.header-base_shadow picture,
.header-base_shadow img{
  display: block;
}