html{
  height:100%; 
}
body { 
	width:100%; 
	height:100%;
	margin: 0; 
	padding:0;
	font-family: 'Yu Mincho Light','YuMincho','Yu Mincho','游明朝体','ヒラギノ明朝 ProN','Hiragino Mincho ProN',sans-serif;
	overflow-x:hidden;
	background-color: #000;
}
body > footer {
	position: sticky;
	top: 100vh;
}	
img {
    image-rendering: -webkit-optimize-contrast;
}
br.clear {
	clear:both;
}
br.sponly {display:none;}
br.sponly2 {display:none;}
br.pconly {display:inline;}
.img {
	width: 100%;
	height: auto;
	vertical-align: bottom;
}

@-webkit-keyframes flash {
	0% {
	  opacity: .4;
	}
	100% {
	  opacity: 1;
	}
  }
  @keyframes flash {
	0% {
	  opacity: .4;
	}
	100% {
	  opacity: 1;
	}
}
@keyframes loop-slide {
	from {
		transform: translateX(0);
	}
	to {
		transform: translateX(-100%);
	}
}
@keyframes loop-slide-rev {
	from {
		transform: translateX(-100%);
	}
	to {
		transform: translateX(0);
	}
}
@keyframes loop-slide-tate {
	from {
		transform: translate3d(0, 0, 0);
		-webkit-transform: translate3d(0, 0, 0); 
		background-color: transparent;
	}
	to {
		transform: translate3d(0, -100% , 0);
		-webkit-transform: translate3d(0, -100%, 0); 
		background-color: transparent;
	}
}
@keyframes loop-slide-tate-rev {
	from {
		transform: translate3d(0, -100%, 0);
		-webkit-transform: translate3d(0, -100%, 0);
		background-color: transparent;

	}
	to {
		transform: translate3d(0, 0, 0);
		-webkit-transform: translate3d(0, 0, 0);
		background-color: transparent;
	}
}
@keyframes fadeIn {
	from {
	opacity: 0;
	}

	to {
	opacity: 1;
	}
}
.fadeIn {
	animation-name:fadeIn;
	animation-duration:1.1s;
	animation-fill-mode:forwards;
	animation-timing-function: ease-out;
}
.fadeInFast {
	animation-name:fadeIn;
	animation-duration:0.2s;
	animation-fill-mode:forwards;
	animation-timing-function: ease-out;
}
@keyframes fadeOut {
	from {
	opacity: 1;
	}

	to {
	opacity: 0;
	}
}
.fadeOutFast {
	animation: fadeOut 0.1s forwards;
}



@media (max-width: 1024px) {
	body { 
		margin: 0; 
		padding:0;
		width:100%; 
		height:100vh;
		overflow-x:hidden;
		background-color: #000;
	}
	br.sponly {display:inline;}
	br.sponly2 {display:none;}
	br.pconly {display:none;}
}
@media (max-width: 610px) {
	br.sponly2 {display:inline;}
}




/* ========================================
ローディング
========================================== */

/* 非表示 */
.is-hidee {
    display: none;
}
/* ローディング画面をフェードアウト */
.fadeout-bg {
    transition-property: opacity;
    transition-delay: 0s;
    transition-duration: 1s;
    opacity: 0;
    pointer-events: none;
}
/* ローダーをフェードアウト */
.fadeout-loader {
    transition-property: opacity;
    transition-delay: 0.2s;
    transition-duration: 1.0s;
    opacity: 0;
    pointer-events: none;
}
/* ローディング画面 */
#loader-bg {
    background: #000;
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000000;
	display: grid;
	place-items: center;
}
#loader {
	width:20%;
	height:auto;
	position: relative;
}
#loader #load1 {
	width:100%;
	height:auto;
	animation: load1 2.0s ease forwards;
}
@keyframes load1 {
	0% {opacity: 0;}
	5% {opacity: 0;}
	20% {opacity: 1;}
	100% {opacity: 1;}
}




/* 以下スマホ */
@media (max-width: 1024px) {
	#loader-bg {
		background: #000;
	}
	#loader {
		width:40%;
		height:auto;
		margin:0;
		padding:0;
	}
}

@media (max-width: 600px) {
	#loader-bg {
		background: #000;
	}
	#loader {
		width:50%;
		height:auto;
		margin:0;
		padding:0;
	}
}



/* ========================================
トップ
========================================== */
#top {
	width:100%;
	height:56.25vw;
	padding:0;
	margin:0;
	position:relative;
	overflow: hidden;
	perspective: 300px;
}
#top #top__tanizaki {
	width: 100%;
	height: auto;
	margin: 7vw 0 4vw;
	text-align: center;
	opacity: 0;
}
#top #top__tanizaki img {
	width: 20%;
	height: auto;
}
#top #top__title {
	width: 28%;
	height: auto;
	margin: 0 36% 2.5vw;
	position: relative;
}
#top #top__title #letter1 {
	width: 100%;
	height: auto;
	opacity: 0;
}
#top #top__title #letter2 ,
#top #top__title #letter3 ,
#top #top__title #letter4 ,
#top #top__title #letter5 ,
#top #top__title #letter6 ,
#top #top__title #letter7 ,
#top #top__title #letter8 {
	width: 100%;
	height: auto;
	position: absolute;
	top: 0;
	left: 0;
	opacity: 0;
}
#top #top__bb {
	width: 100%;
	height: auto;
	text-align: center;
	margin: 0 0 6vw;
	opacity: 0;
}
#top #top__bb img {
	width: 32%;
	height: auto;
}
#top #top__date {
	width: 100%;
	height: auto;
	margin: 0 0 2vw;
	text-align: center;
	opacity: 0;
}
#top #top__date img {
	width: 42%;
	height: auto;
	aspect-ratio: 1227 / 141;
}
#top #top__sns {
	width: 100%;
	height: auto;
	display: flex;
	justify-content: center;
	opacity: 0;
}
#top #top__sns a {
	display: block;
	width: 4%;
	height: auto;
	margin: 0 1.0%;
}
#top #top__sns a:hover {
	animation: flash 1.5s;
}
.letter1 {
	animation: fadeIn 0.7s ease 0s forwards;
}
.letter2 {
	animation: fadeIn 0.7s ease 0.2s forwards;
}
.letter3 {
	animation: fadeIn 0.7s ease 0.4s forwards;
}
.letter4 {
	animation: fadeIn 0.7s ease 0.6s forwards;
}
.letter5 {
	animation: fadeIn 0.7s ease 0.8s forwards;
}
.letter6 {
	animation: fadeIn 0.7s ease 1.0s forwards;
}
.letter7 {
	animation: fadeIn 0.7s ease 1.2s forwards;
}
.letter8 {
	animation: fadeIn 0.7s ease 1.4s forwards;
}
@keyframes top__tanizaki {
	0% {
		transform: rotateX(100deg);
		transform-origin: bottom;
		backface-visibility: hidden;
		opacity: 0;
	}
	100% {
		transform: rotateX(0);
		transform-origin: bottom;
		backface-visibility: hidden;
		opacity: 1;
	}
}
.top__tanizaki {
	animation: top__tanizaki 0.8s ease-out 1.5s both;
}
.top-last-anime {
	animation: fadeIn 1.0s ease 2.4s forwards;
}



/* 以下タブレット・スマホ */
@media (max-width: 1024px) {
	#top {
		width:100%;
		height:196.58vw;
		padding:0;
		margin:0;
		position:relative;
		overflow: hidden;
		perspective: 300px;
	}
	#top #top__tanizaki {
		width: 100%;
		height: auto;
		margin: 20vw 0 15vw;
		text-align: center;
		opacity: 0;
	}
	#top #top__tanizaki img {
		width: 70%;
		height: auto;
	}
	#top #top__title {
		width: 90%;
		height: auto;
		margin: 0 5% 6vw;
		position: relative;
	}
	#top #top__bb {
		width: 100%;
		height: auto;
		text-align: center;
		margin: 0 0 20vw;
		opacity: 0;
	}
	#top #top__bb img {
		width: 86%;
		height: auto;
	}
	#top #top__date {
		width: 100%;
		height: auto;
		margin: 0 0 20vw;
		text-align: center;
		opacity: 0;
	}
	#top #top__date img {
		width: 60%;
		height: auto;
		aspect-ratio: 978 / 578;
	}
	#top #top__sns {
		width: 100%;
		height: auto;
		display: flex;
		justify-content: center;
		opacity: 0;
	}
	#top #top__sns a {
		display: block;
		width: 13%;
		height: auto;
		margin: 0 2.0%;
	}

}

/* 以下タブレット・スマホ */
@media (max-width: 600px) {

}


/* ========================================
ブリッジ
========================================== */
#bridge {
	width: 100%;
	height: auto;
	padding: 0;
	position: relative;
}
#bridge #mubi {
	width: 100%;
	height: auto;
	margin: 0 0 2vw;
	text-align: center;
}
#bridge #mubi #mvtk-widgets-container {
	display: inline-block;
}


/* 以下タブレット・スマホ */
@media (max-width: 1024px) {
	#bridge {
		width: 100%;
		height: auto;
		padding: 5vw 0 5vw;
		position: relative;
	}
}

/* 以下タブレット・スマホ */
@media (max-width: 1024px) {
	#bridge {
		width: 100%;
		height: auto;
		padding: 10vw 0 5vw;
		position: relative;
	}

}


/* ========================================
SNSボタンアリア
========================================== */
.fadeInButton {
	animation-name:fadeIn;
	animation-duration:1.8s;
	animation-fill-mode:forwards;
	animation-delay: 2.7s;
}
#button-area {
	width:100%;
	height:auto;
	margin:0;
	padding:1vw 0;
	opacity: 1;
}
#button-area ul.social_sq_buttons {
	width:100%;
	height:auto;
	padding:0;
	margin:0;
	list-style-type: none;
	display:flex;
	justify-content: center;
	flex-wrap:wrap;
}
#button-area ul.social_sq_buttons li {
	width:140px;
	height: 20px;
	margin:0 3px;
	padding:0;
	display: flex;
	justify-content: center;
}
#button-area ul.social_sq_buttons li.fb {
	background:#1877F2;
}
#button-area ul.social_sq_buttons li.tw {
	background:#000;
}
#button-area ul.social_sq_buttons li.line {
	background:#06C755;
}
#button-area ul.social_sq_buttons li.checkin {
	background:#10519D;
}
#button-area ul.social_sq_buttons li.filmarks {
	background:#FFE100;
	text-align: center;
}
#button-area ul.social_sq_buttons li.filmarks img {
	width: 60%;
}
#button-area ul.social_sq_buttons li.fb .fb_iframe_widget > span {
  vertical-align: baseline !important;
}


/* 以下タブレット・スマホ */
@media (max-width: 800px) {
	#button-area {
		width:100%;
		height:auto;
		margin:0;
		padding:10px 0 10px;
	}
	#button-area ul.social_sq_buttons {
		width:100%;
		height:auto;
		padding:0;
		margin:0;
		list-style-type: none;
		display:flex;
		justify-content: center;
		flex-wrap:wrap;
	}
	#button-area ul.social_sq_buttons li {
		width:160px;
		height: 20px;
		margin:5px;
		padding:3px 0;
		display: flex;
		justify-content: center;
	}
}



/* ========================================
フッター
========================================== */
footer {
	width:100%;
	height:auto;
	padding:0;
	margin:0;
	position: relative;
	overflow: hidden;
}

@media (max-width: 1024px) {

	
}
@media (max-width: 600px) {

}