@charset "utf-8";



/********************** top *******************************/
main img{ width: 100%;}

.container{width:90%; margin:0 auto;}

.top_main{ width:100%; position:relative; }
.top_main img{ width:100%;}
.top_main .main_l{  width:56%; margin: 0 auto;display: flex; align-items: center;height: 100vh; max-height: 61vw; position: absolute; right: 0vw; top: 0;justify-content: center;}
.top_main .top_cast{ width: 45%; line-height: 0; padding: 1vw;}

.top_main .main_l h1{ width: 90%; margin: 0 auto;}

@media only screen and (max-width: 768px){
    .top_main{ }
    .top_main .main_l{ position: inherit; height: auto; top: 0; max-height: none; width: 100%; left: 0;}
    .top_main .main_l .date{ width: 80%;}
    .top_main .top_cast{ width: 100%; padding: 0;}
	.top_main .main_l h1 {  margin: 10vw auto 8vw;  transform: translate(2%, 0px);}

}

.comingsoon { margin-bottom: 13vw; margin-top: -2.5vw; position: relative; z-index: 2;}
.comingsoon .txt1{ width: 100%; margin: 0 auto 15vw;}
.comingsoon .txt2{ width: 80%; margin: 0 auto ; }

.sns{font-family:var(--font_en); font-size: 3vw; line-height: 1em; }
.sns h2{ margin-bottom: 0.5em;}
.sns ul{ display: flex; justify-content: center;}
.sns li{ width: 70px;}

@media only screen and (max-width: 768px){
    .comingsoon { width: 100%; margin: 0 auto 15vw;}
	.comingsoon .txt1{ width: 80%; margin-bottom: 10vw; }
	.comingsoon .txt2{ width: 100%; }
	
	.sns{ font-size: 8vw;}
	.sns li{ width: 60px;}
}



/* ---------- TEXT SLIDE ---------- */
.textslide { width: 100vw; height: auto;padding: 0; transform-origin: center; pointer-events: none;font-family:var(--font_en); font-size:10vw; line-height: 1; top: 0; left: 0; display: flex; flex-wrap: wrap; align-content: center; position: absolute;}
.textslide .inner { display: flex; }
.textslide .inner span {  color: /*rgba(0, 0, 0, 0)*/#fff; /*text-stroke: 5px #fff; -webkit-text-stroke: 5px #fff; */font-weight: bold;  white-space: nowrap; margin-bottom: 0; line-height: 1em; display: block; margin-right: 0.25em; width: auto; opacity: 1;}
.textslide .inner .slide_l { display: block; animation: slide_l1 80s linear infinite; }
.textslide .inner .slide_r { display: block; animation: slide_r1 80s linear infinite; }

.textslide.bgslide{transform: translate(-50%, -50%) rotate(-20deg);
    width: 100vw;
    position: fixed;
    z-index: -1;
    left: 50%;
    top: 50%;}
.textslide.bgslide .inner{height: 10vw; width: 100vw; }
.textslide.bgslide .inner:first-of-type{ height: 60vw;}
.textslide .inner:nth-of-type(3) span{}

.textslide.movie_bg { overflow: hidden; font-size: 1rem; line-height: 1;    transform: translate(0,-50%); top: 50%;}
.textslide.movie_bg span{ width: 90vw; opacity: 1;}

@keyframes slide_l1 { 0% { transform: translateX(-100%); }
  to { transform: translateX(-200%); } }
@keyframes slide_r1 { 0% { transform: translateX(-100%); }
  to { transform: translateX(0%); } }

@media only screen and (max-width: 768px){
    .textslide.bgslide{  width: 100lvh; height: 100lvh; font-size: 10lvh; }
	.textslide.bgslide .inner{  height: 10lvh }
	.textslide.bgslide .inner:first-of-type{ height: 80lvh;}
}


/* アニメーション */
.loader{background-image:url(../images/logo.webp);background-repeat : no-repeat; background-size:16%; background-position : 50% 46%; z-index:9999; position:absolute; top:0; left:0; width: 100%; height: 100vh;  }
.loader_bg{ background-color:#fff; /*background-image: url("../images/load_bg.webp");*/ background-size: cover; background-position: center;width:0%; height:100vh; position:absolute; top:0; z-index: 1000; transition: 0.5s ease-out; }
.loader_bg.left{ left:0;}
.loader_bg.right{ right:0;}


.intro_loader{ overflow:hidden; height:100vh;}
.intro_loader .loader_bg{ width: 50%;}

.intro00 .top_cast{ opacity: 0; transform: scale(1.7);}
.intro00 .main_l{ opacity: 0; top: 15vw; }
.intro00 .catch{ opacity: 0; top:-5vw;}
.intro00 .bgslide{ opacity: 0;}

.intro01 .main_l,
.intro01 .catch,
.intro01 .top_cast,
.intro00 .bgslide{ transition: 2s;}

@media only screen and (max-width: 768px){
    .loader{ background-size:40%;}
    .intro00 .main_l{  top: 130vw; }
    .intro00 .catch{  top:60vw;}
}