﻿@charset "utf-8";
* {
	min-height:0;
	min-width : 0;
	}

body{
	height: 100%;
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
	background: #103e3b url(../images/apps/img_200107_toho_bg.jpg) no-repeat top center;
	background-size: 100%;
	background-position-x: 50%;
	background-position-y: 0%;
	background-attachment:fixed;
	/*font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", "HG明朝E", "ＭＳ Ｐ明朝", "ＭＳ 明朝", serif;*/
	/*font-family: 'M PLUS Rounded 1c', sans-serif;*/
	font-size: 1.2em;
	color:#000;
	}

/*body:before {
	position: fixed;
	top: 0; left: 0;
	width: 100%; height: 100%;
	content: "";
	background: #8ebfe5;
	background: -moz-linear-gradient(top,  #8ebfe5 0%, #bff1ff 20%, #ffffff 100%);
	background: -webkit-linear-gradient(top,  #8ebfe5 0%,#bff1ff 20%,#ffffff 100%);
	background: linear-gradient(to bottom,  #8ebfe5 0%,#bff1ff 20%,#ffffff 100%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#8ebfe5', endColorstr='#ffffff',GradientType=0 );
	}*/

a {
	color: #0b338e;
	text-decoration: none;
	cursor: pointer;
	}
a:visited	{color: #0b338e;}
a:hover		{color: #345ab2;}
a:focus, *:focus { outline:none; }

rt {font-size: 0.4em}


h2 {
	box-sizing: border-box;
	width: 100%;
	max-width: 1280px;
	padding: 0;
	margin: -100px auto 2em;
	}

h2 img {display: block;width: 50%;max-width: 500px;}
h3 {
	box-sizing: border-box;
	width: 98%;
	color:#fff;
	font-size: 1.8em;
	line-height: 1.4;
	margin: 0 auto;
	flex-basis: 100%;
	position: relative;
	background: url(../images/apps/img_200107_toho_ball01.png) no-repeat left center;
	position: absolute;
	top: -50px;
	left: 10px;
	padding: 0.5em 0.5em 0.5em 55px;
	text-shadow: 
    #000 2px 0px,  #000 -2px 0px,
    #000 0px -2px, #000 0px 2px,
    #000 2px 2px , #000 -2px 2px,
    #000 2px -2px, #000 -2px -2px,
    #000 1px 2px,  #000 -1px 2px,
    #000 1px -2px, #000 -1px -2px,
    #000 2px 1px,  #000 -2px 1px,
    #000 2px -1px, #000 -2px -1px;
	}

h3.jw01 {background-image: url(../images/apps/img_200107_toho_ball01.png)}
h3.jw02 {background-image: url(../images/apps/img_200107_toho_ball02.png)}
h3.jw03 {background-image: url(../images/apps/img_200107_toho_ball03.png)}
h3.jw04 {background-image: url(../images/apps/img_200107_toho_ball04.png)}
h3.jw05 {background-image: url(../images/apps/img_200107_toho_ball05.png)}

h3>span {font-size:0.8em;}

h3 img {
	display: block;
	width: 100%;
	max-width: 400px;
	}

h4{
	font-size: 1em;
	line-height: 1.2;
	margin: 0;
	padding: 0 0.5em 0 1.5em;
	color: #d20030;
	text-shadow: 
    #fff 2px 0px,  #fff -2px 0px,
    #fff 0px -2px, #fff 0px 2px,
    #fff 2px 2px , #fff -2px 2px,
    #fff 2px -2px, #fff -2px -2px,
    #fff 1px 2px,  #fff -1px 2px,
    #fff 1px -2px, #fff -1px -2px,
    #fff 2px 1px,  #fff -2px 1px,
    #fff 2px -1px, #fff -2px -1px;
	}

h5 {
	margin: 0;
	padding: 0 0.5em 0 1.2em;
	font-size: 1em;
	font-weight: bold;
	color: #000;
	}

p {
	padding: 20px 40px 0 40px;
	line-height: 1.6;
	font-size: 0.9em;
	margin: 0 0 20px;
	}

dl {
	padding: 20px 40px 0 40px;
	line-height: 1.6;
	font-size: 0.8em;
	}

dt {
	font-weight: bold;
	margin: 0 0 0.5em;
	color: #419ee5;
	text-shadow: 
    #fff 2px 0px,  #fff -2px 0px,
    #fff 0px -2px, #fff 0px 2px,
    #fff 2px 2px , #fff -2px 2px,
    #fff 2px -2px, #fff -2px -2px,
    #fff 1px 2px,  #fff -1px 2px,
    #fff 1px -2px, #fff -1px -2px,
    #fff 2px 1px,  #fff -2px 1px,
    #fff 2px -1px, #fff -2px -1px;
	}

dd {margin: 0px;
	margin-bottom: 1em;
	font-size: 0.9em;
	/*color: #4D4D4D;*/
	}

dl.deco {
	margin: 30px;
	padding-bottom: 20px;
	/*border: 1px #419ee5 solid;*/
	background-color: rgba(168,223,254,0.15)
	}
@media only screen and (max-width: 768px){
	dl.deco	{margin: 10px;padding: 20px;}
}

ul {padding-left: 3em;padding-right: 1em; font-size: 0.9em;}
li {margin-bottom: 0.5em; line-height: 1.6em;}

ul.readme {
	float: right;
	font-size: 0.9em;
	}

ul.readme li {
	margin-bottom: 0.5em;
	line-height: 1.4em;
	}

ul.listM,ul.listM2,ul.listL,ul.listCast {
	list-style-type: none;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	text-align: center;
	padding: 0;
	margin: 0;
	}

ul.listL	{font-size: 2em;}
ul.listL>li	{flex-basis: 7em;}

ul.listM	{font-size: 1.2em;max-width: 30em;margin: 0 auto;}
ul.listM>li {flex-basis: 6em;}
ul.listM2	{font-size: 1.2em;;margin: 0 auto;}
ul.listM2>li {flex-basis:15em;}


ul.listCast			{font-size: 1.2em;}
ul.listCast>li		{flex-basis: 8em;}
ul.listCast>li>span	{display: block;font-size: 0.6em;line-height: 1.4;}	

table {
	border: none;
	border-collapse: collapse;
	margin: 1em auto 1em;
	}

th, td {
	border: none;
	padding: 5px 20px;
	vertical-align: top;
	}

th {
	word-break: keep-all;
	text-align: right;
	}

.dlctable {margin-left: 1em;margin-right: 1em;}
.dlctable th, .dlctable td {
	font-size: 0.9em;
	}


strong, .errorTxt {color:#D20030;}
em {text-decoration: none;font-style: normal;}
strong, em {
	font-weight: bold;
	}

/*フェード*/
a, .chronology h3, .modal img, #openBtn, nav ul li>a, nav ul li.dllink {
    -webkit-transition: all 0.5s ease;
    -moz-transition: all 0.5s ease;
    -o-transition: all 0.5s ease;
    transition: all  0.5s ease;
	}

/*MS Edgeのバグ対応とりあえず*/
@supports (-ms-ime-align: auto) {
	a{transition: none;}
	}


/*上へもどる*/
#pageTop {
	position: fixed;
	bottom: 15px;
	right: 15px;
	padding: 0;
	margin: 0;
	z-index: 999;
	}

#pageTop a {
	display: block;
	height: 40px;
	width: 40px;
	background: #d71318 url(../images/apps/arrow.svg) no-repeat center center;
	background: url(../images/apps/arrow.svg) no-repeat center center,-moz-linear-gradient(top,  #d71318 0%, #be0000 99%);
	background: url(../images/apps/arrow.svg) no-repeat center center,-webkit-linear-gradient(top,  #d71318 0%,#be0000 99%);
	background: url(../images/apps/arrow.svg) no-repeat center center,linear-gradient(to bottom,  #d71318 0%,#be0000 99%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d71318', endColorstr='#be0000',GradientType=0 );
	/*background-size: 80%;*/
	padding: 20px 20px;
	border: 3px rgb(255,255,255) solid;
	border-radius: 2px;
	box-shadow: 5px 10px 0px 0px rgba(0,0,0,0.2);
	font-size: 1em;
	font-weight: bold;
	line-height: 1.4;
	text-align: center;
	color: #fff;
	text-decoration: none;
	}

#pageTop a:hover {
	margin-bottom: 5px;
	background-color: #293f8d;
	}


/*汎用ボタン*/
.button {padding: 0;margin: 10px auto 0;}
.button a {
	display: block;
	box-sizing: border-box;
	width: 93%;
	max-width: 600px;
	margin: 0 auto;
	padding: 15px 20px;
	border: 3px rgb(255,255,255) solid;
	border-radius: 2px;
	background: #d71318;
	background: -moz-linear-gradient(top,  #d71318 0%, #be0000 99%);
	background: -webkit-linear-gradient(top,  #d71318 0%,#be0000 99%);
	background: linear-gradient(to bottom,  #d71318 0%,#be0000 99%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d71318', endColorstr='#be0000',GradientType=0 );
	box-shadow: 5px 8px 0px 0px rgba(0,0,0,0.2);
	font-size: 1em;
	font-weight: bold;
	line-height: 1.4;
	text-align: center;
	color: #fff;
	text-decoration: none;
	}

.button a span {font-size:1.8em;}

.button.tweet a {
	background-color: #1da1f2;
	color: #fff;
	}
.button.disabled a {
	background-color: #666;
	}

.button a:hover {box-shadow: 5px 8px 0px 0px rgba(0,0,0,0.25);}
.button.disabled a:hover {opacity:1;cursor:default;}


.map .button {
	display: inline-block;
	margin: 0;
	vertical-align:baseline;
	}

.map .button a {
	font-size: 0.8em;
	font-weight: normal;
	padding: 0;
	width: 4em;
	line-height: 1.6;
	}


.twitterLink {
	margin-top: 0px;
	margin-bottom: 60px;
	}

.twitterLink a{
	max-width: 900px;
	margin: 0 auto 0;
	font-size: 1em;
	}

/*記事用*/
.small	{font-size: 0.6em;}
.large	{font-size: 1.2em;}
.big	{font-weight: bold;font-size: 1.8em;}
.center	{text-align: center;padding-left: 0.5em;padding-right: 0.5em;}
.spaced {padding: 1em;}
.left	{text-align: left;}
.right	{text-align: right;}
.attention {color: #FF0000;}
.clear {clear: both;}
.url{color: #FF0308;font-style: italic;}
.bold{font-weight: bold;}
.hide {display: none;}
.sun {color: #f00;}
.sat {color: #008FEB;}
.price {font-size: 1.4em;font-weight: bold;}
.sponly {display:none;}
.nosp{display:inherit;}
.markup{display:inline-block;font-size: 0.9em;color:#f60;}
.new {display:inline-block;background-color: #d71318;font-size: 0.6em;font-weight: bold;color:#fff;text-shadow: none;vertical-align:text-top;padding: 3px 10px;border-radius: 10px;margin-left: 0.5em;}

.marker {
	display: inline-block;
	padding: 5px 10px;
	margin-right: 5px;
	text-shadow: none;
	color: #fff;
	}
	span.red 		{background-color: #cd0808;}
	span.blue 		{background-color: #08aacd;}
	span.green 		{background-color: #08cd2d;}
	span.yellow 	{background-color: #ffe300;color: #000;}


/*ボタン用*/
.common {margin: 2.5% 2% 2.5% 2%;}

/*記事の関連URLリンク用大型ボタン*/
.big a {
	padding: 10px;
	margin: 2.5% 2% 2.5% 2%;
	}

.oldVersion {
	text-align: center;
	color: rgb(255,0,4);
	padding: 10px;
	}

/*大枠*/
.primaryContainer {
	margin: 0 auto;
	padding: 0;
	position: relative;
	line-height: 1.6;
	overflow: hidden;
	}

/*ヘッダ*/
header {
	box-sizing: border-box;
	width: 100%;
	max-width: 1280px;
	margin: 0 auto 20px;
	position: relative;
	}

/*Nintendo Switch ロゴ*/
.nslogo {
	position: absolute;
	z-index: 101;
	top:10px;
	left:10px;
	width: 10%;
	max-width: 100px;
	max-height: 100px;
	}



/*キャラクター画像*/
.kv1 {
	display: block;
	position: absolute;
	width: 55%;
	max-width: 600px;
	z-index: 99;
	top: 60px;
	right: 0;
	}

.short .kv1 {width: 28%;top: 0;right: 12%;}

h1 {
	position: absolute;
	z-index: 100;
	max-width: 600px;
	width: 50%;
	left: 5%;
	/*top: 33%;*//*ダウンロードリンクありの場合*/
	top:26%;/*ダウンロードリンクなしの場合*/
	}
/*@media only screen and (max-width: 1200px) {h1 {top: 28%;}}*/

.short h1 {position: relative;margin: 0 0 0 12%;width: 50%;padding-top: 20px;}

h1 img {display:block;width: 100%;}


/*ヘッダのキャプション*/
.catch {
	box-sizing: border-box;
	width: 50%;
	max-width: 1280px;
	text-align: center;
	padding: 50% 0 0 0%;
	margin-left: 5%;
	margin-bottom: 4%;
	position: relative;
	}

.catch img {display: block;width:100%;position: absolute;bottom: 0;left: 0;z-index: 300;}

.catch2 {
	box-sizing: border-box;
	width: 8%;
	max-width: 125px;
	text-align: center;
	position: absolute;
	top:25%;
	left:0.5%;
	padding: 0;
	margin: 0;
	transform: rotate(-12deg);
	z-index: 350;
	}

.catch2 img {display: block;width:100%;position: relative;}

/*ナビゲーションメニュー*/
nav {padding: 30px 0;position: relative;margin: 0 auto;
	/*width:666px;*/
	/*width: 830px;*/
	/*width: 936px;*/
	/*width: 1092px;*/
	width: 100%;
	max-width: 1092px;
	}

#toggle {
	display: none;
	padding: 20px;
	position: fixed;
	top:5px;
	right:5px;
	z-index: 499;
	width: 50px;
	height: 50px;
	background: #d71318 url(../images/apps/toggle.svg) center center no-repeat;
	background: url(../images/apps/toggle.svg) center center no-repeat,-moz-linear-gradient(top,  #d71318 0%, #be0000 99%);
	background: url(../images/apps/toggle.svg) center center no-repeat,-webkit-linear-gradient(top,  #d71318 0%,#be0000 99%);
	background: url(../images/apps/toggle.svg) center center no-repeat,linear-gradient(to bottom,  #d71318 0%,#be0000 99%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d71318', endColorstr='#be0000',GradientType=0 );
	background-size: 73%;
	box-shadow: 3px 8px 0px 0px rgba(0,0,0,0.2);
	border: 3px rgb(255,255,255) solid;
	}

#toggle:hover {cursor: pointer;}

#menu img {
	height:28px;
	width:130px;
	vertical-align: top;
	}


#menu {
	position: absolute;
	z-index: 200;
	left:0;
	top:0;
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	}

#menu li {
	margin: 0 0 10px 0;
	position: relative;
	}

#menu li>a {
	display: block;
	box-sizing: border-box;
	margin: 0 5px;
	padding: 10px 5px;
	border: 3px rgb(255,255,255) solid;
	border-radius: 2px;
	background: #d71318;
	background: -moz-linear-gradient(top,  #d71318 0%, #be0000 99%);
	background: -webkit-linear-gradient(top,  #d71318 0%,#be0000 99%);
	background: linear-gradient(to bottom,  #d71318 0%,#be0000 99%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d71318', endColorstr='#be0000',GradientType=0 );
	box-shadow: 3px 5px 0px 0px rgba(0,0,0,0.2);
	font-size: 1em;
	font-weight: bold;
	line-height: 1.2;
	text-align: center;
	color: #fff;
	text-decoration: none;
	}

#menu li>a img {}

#menu li>a:hover {color:#fff;box-shadow: 3px 5px 0px 0px rgba(0,0,0,0.4);}
#menu li>a:visited {color:#fff;}
#menu li.disabled a:hover {opacity:1;cursor:default;}

/*ダウンロードリンクのみ上に固定*/
#menu li.dllink {
	position: fixed;
	top: -5px;
	right: 20px;
	z-index: 199;
	}
#menu li.dllink:hover {
	top: 0px;
	}

#menu li.dllink a{
	padding: 20px 10px;
	border-radius: 0 0 4px 4px;
	background: #d71318;
	background: -moz-linear-gradient(top,  #d71318 0%, #be0000 99%);
	background: -webkit-linear-gradient(top,  #d71318 0%,#be0000 99%);
	background: linear-gradient(to bottom,  #d71318 0%,#be0000 99%);
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d71318', endColorstr='#be0000',GradientType=0 );
	box-shadow: 0px 5px 0px 0px rgba(0,0,0,0.2);
	border: 3px rgb(255,255,255) solid;
	border-top: none;
	}

#menu li.dllink a img {width: 180px;heiht:30px;}

p.langlink {
    position: absolute;
    bottom: -30px;
    right: 5%;
    padding: 0;
    margin: 0;
    z-index: 198;
    font-size: 0.8em;
    }

p.langlink a {
    color: #fff;
    text-shadow: 0px 0px 5px rgba(0,0,0,0.8),0px 0px 1px rgba(0,0,0,1);
    }

@media only screen and (max-width: 768px) {
    p.langlink {bottom: -30px;font-size: 0.6em;right: calc(50% - 4em);}
    }


#menu li:nth-child(6)>a:after {
	content:"新着!";
	height: 40px;
	width: 40px;
	font-size: 0.7em;
	position: absolute;
	top: -25px;
	right: -10px;
	background: url(../images/apps/img_200107_toho_ball03.png) no-repeat top center;
	background-size: cover;
	line-height: 40px;
	padding: 0;
	margin: 0;
	border-radius: 25px;
	color: #fff;
	text-shadow: 
    #000 2px 0px,  #000 -2px 0px,
    #000 0px -2px, #000 0px 2px,
    #000 2px 2px , #000 -2px 2px,
    #000 2px -2px, #000 -2px -2px,
    #000 1px 2px,  #000 -1px 2px,
    #000 1px -2px, #000 -1px -2px,
    #000 2px 1px,  #000 -2px 1px,
    #000 2px -1px, #000 -2px -1px;
	box-shadow: -5px 5px 5px rgba(0,0,0,0.5);
	animation: jewel 1s ease 0s infinite normal;
	z-index: 200;
	}

@keyframes jewel {
	0% {top: -25px;}
	50% {top: -20px;}
	100% {top: -25px;}
	}

@media only screen and (max-width: 768px) {
	#toggle {display: block;}
	nav {padding: 0;}
	#menu {
		display: none;
		width: 98%;
		position: fixed;
		top: 58px;
		left: 1.0%;
		z-index: 999;
		}
	
	#menu li {margin: 0;}
	
	#menu li.dllink {
		display: block;
		position: static;
		top: auto;
		right: inherit;
		}
	#menu li>a, #menu li.dllink a {
		border-radius: 0;
		border: none;
		/*border-bottom: 1px rgb(115, 201, 217) solid;*/
		border-bottom: 1px #fff solid;
		padding: 15px;
		margin: 0;
		background: #d71318;
		box-shadow: none;
		}
	#menu li.dllink a {box-shadow: 3px 5px 0px 0px rgba(0,0,0,0.3);}
	#menu li>a:hover {background-color: #FF3636;}
	#menu li.manual {
		background-color: #fff;
		padding-bottom: 30px;
		font-size: 1em;
		}

	#menu li:nth-child(6)>a:after {
		right: 10px;
		}
	@keyframes jewel {
		0% {top: -10px;}
		50% {top: -5px;}
		100% {top: -10px;}
		}
	
	h3 img {max-width: 300px;}
	.short .nslogo {width: 13%;top:10px;left:10px;}
	.nslogo {width: 15%;top:10px;left:10px;}
	.kv1 {top:20px;}
	.top .kv1 {width: 90%;max-width: inherit;top: 0px;left: 5%;}
	h1 {top:30%}
	.top h1 {top: 55%;width:80%;left:10%;}
	.catch {width: 70%;padding-top: 56%;margin-left: 10px;}
	.top .catch {width: 80%;margin: 0 auto;padding-top: 120%;}
	.catch2 {display:none;}
	.top .catch2 {display: block;width: 15%;top:32%;left:2%;}
}

@media only screen and (max-width: 480px) {
	.nslogo {width: 18%;top:10px;left:10px;}
	.short .nslogo {width: 12%;top:10px;left:10px;}
	.short .kv1 {width: 36%;top: 20%;right: 0;}
	.short h1 {margin: 0 0 0 -3%;width: 75%;padding-top: 50px;}
	.top .kv1 {width: 100%;top: 30px;left: 0;}
	.top h1 {top: 60%;width:95%;left:2.5%;}
	.top .catch {width: 90%;margin: 0 auto;padding-top: 150%;}
	.top .catch2 {width: 17%;top:43%;left:1%;}
	}





/*コンテンツ全体をラップ*/
main {
    float: none;
    height: auto;
    margin: 0px auto;
    clear: none;
	width: 100%;
    display: block;
	overflow: visible;
	}

section {
	box-sizing: border-box;
    max-width: 1280px;
	margin: 0 auto 80px;
	padding: 40px;
	align-items: flex-start;
	flex-wrap: wrap;
	background: rgba(248,226,232,0.95) url(../images/apps/img_200106_toho_cont_bg.png) no-repeat right bottom;
	border: 5px #000 solid;
	position: relative;
	/*box-shadow: 20px 20px 0 5px rgba(10,87,142,0.15);*/
	}

@media only screen and (max-width: 768px) {
	section {width: 98%;}
	}

section img {
	display: block;
	width: 100%;
	margin: 5px;
	}

section img.fire {
	border: 1px rgba(0,0,0,0.5) solid;
	box-shadow: 8px 8px 0 0 rgba(0,0,0,0.11);
	}


section.wigets {
	border: none;
	background: rgba(0,0,0,0.25);
	width: 100%;
	max-width: inherit;
	margin: 0 auto 80px;
	padding: 20px 0;
	}

section.wigets>div {max-width: 1280px;margin: 0 auto;}

/*Twitter*/
.twitter {
	margin: 0 auto;
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
	border-radius: 6px;
	border: 1px rgba(0,0,0,0.25) solid;
	}

.twitter iframe {width: 740px !important;height: auto;}

/*楽曲紹介の動画*/
.movie {
	width: 80%;
	margin: 0 auto;
	border: 1px rgba(0,0,0,0.5) solid;
	box-shadow: 8px 8px 0 0 rgba(0,0,0,0.11);
	}

/*DLCのムービー*/
.dlcmovie {
	width: 95%;
	margin: 0 auto;
	border: 1px rgba(0,0,0,0.5) solid;
	box-shadow: 8px 8px 0 0 rgba(0,0,0,0.11);
	}

/*youtube*/
.youtube {
	margin: 0 auto;
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	overflow: hidden;
	border-radius: 6px;
	}

.movie .youtube, .dlcmovie .youtube {border-radius: 0;}

.youtube iframe {
	position:absolute !important;
	top:0 !important;
	left:0 !important;
	width:100% !important;
	height:100% !important;
	}
/*YouTube無い時*/
.flexBox> div.comingsoon　{}
.flexBox> div.comingsoon img{margin: 0;width: 100%;border-radius: 6px;}

/**/
section div.movieOuter .youtube {margin: 10px;padding-bottom: 50%;}
section div.movieOuter h4 {margin-bottom:20px;}

section.news {
	margin-top: 30px;
	padding: 40px 20px 10px 0;
	}

section.news h3 {
	}

section.news ul {padding-left: 1.5em;margin-top: 5px;font-size: 0.9em;color: #4998d5;list-style-type: none;}
section.news li {margin-bottom: 0.25em;}
section.news li>span {
	font-weight: bold;
	margin-right: 1em;
	color:#d20030;
	text-shadow:
	#fff 2px 0px,  #fff -2px 0px,
    #fff 0px -2px, #fff 0px 2px,
    #fff 2px 2px , #fff -2px 2px,
    #fff 2px -2px, #fff -2px -2px,
    #fff 1px 2px,  #fff -1px 2px,
    #fff 1px -2px, #fff -1px -2px,
    #fff 2px 1px,  #fff -2px 1px,
    #fff 2px -1px, #fff -2px -1px;
}

#newsOpen {box-sizing: border-box;display: block;margin: 0 0 20px;padding: 0;text-align: center;width: 100%;font-weight: bold;font-size: 0.8em;}
#newsBox {height: 3.5em;overflow: hidden;}




section.characters {
	}

section.characters h4 {
	padding: 0 0.5em;
	}

section.characters p {
	}

section.links {
	background: none;
	border: none;
	}

section.copyrights {
	background: none;
	border: none;
	}
section.copyrights .flexBox {align-items: flex-start;}
section.copyrights ul {list-style-type: none;font-size: 0.6em;}
section.copyrights li {margin-bottom: 0.1em;}
section.copyrights p {font-size: 0.6em;}


/*SNSシェアボタン*/
.shareBox {
	font-family: -apple-system, BlinkMacSystemFont, "Helvetica Neue", YuGothic, "ヒラギノ角ゴ ProN W3", Hiragino Kaku Gothic ProN, Arial, "メイリオ", Meiryo, sans-serif;
	float: none;
	width: auto;
	height: auto;
	margin: 70px auto 50px;
	clear: both;
	padding: 0 2px 0;
	text-align: center;
	position: relative;
	}
@media only screen and (max-width: 768px) {
	.shareBox {margin-top: 50px;}
}

	.shareButtons {
		position: relative;
		width: auto;
		height: auto;
		margin: 0px auto;
		clear: none;
		display: inline-block;
		z-index: 400;
		/*background: rgba(255,255,255,0.4);
		border-radius: 5px;*/
	
		}

	.shareButtons div {
		line-height: 1;
		margin: 5px;
		border: 1px rgba(255,255,255,0.8) solid;
		border-radius: 4px;
		}

	.shareButtons div:last-child {
		}

		.fb-like, .fb-share-button {
			float: left;
			}

		.googleBtn {
			float: left;
			width: 52px;
			overflow: hidden;
			}

/*オリジナルボタン化*/
		.tweetBtn, .lineBtn {
			float: left;
			border-radius: 2px;
			}

		.tweetBtn {
			background: url(../images/ico_sns_twitter.png) left top no-repeat #000;
			background-size: contain;
			}

		.lineBtn {
			background: url(../images/ico_sns_line.png) left top no-repeat #00C300;
			background-size: contain;
			display: none;
			}

		.tweetBtn a, .lineBtn a {
				display: inline-block;
				color: #fff;
				line-height: 20px;
				text-align: right;
				vertical-align: middle;
				text-decoration: none;
				}

		.tweetBtn a {
				width: 57px;
				height: 0;
				padding: 20px 5px 0 5px;
				font-size: 0.6em;
				position: relative;
				overflow: hidden;
				}

		.tweetBtn a::after{
    			display: block;
    			position: absolute;
    			right: 1.25em;
    			bottom: 0;
    			color: #fff;
    			content: "Post";
    			letter-spacing: 0.05em;
    			}

		.lineBtn a {
			width: 67px;
			padding: 0 5px 0 5px;
			font-size: 0.5em;
			}


footer {
	box-sizing: border-box;
	padding: 100px 0 100px;
	background: url(../images/apps/img_200106_toho_footbg.png) no-repeat top center;
	background-size: cover;
	text-align: center;
	color: #eee;
	text-shadow: 
    #000 2px 0px,  #000 -2px 0px,
    #000 0px -2px, #000 0px 2px,
    #000 2px 2px , #000 -2px 2px,
    #000 2px -2px, #000 -2px -2px,
    #000 1px 2px,  #000 -1px 2px,
    #000 1px -2px, #000 -1px -2px,
    #000 2px 1px,  #000 -2px 1px,
    #000 2px -1px, #000 -2px -1px;
}

footer .makerLogo {
	width: 200px;
	margin: 0 auto 30px;
	}

footer p.typex	{margin-bottom: 30px;}
footer p.typex img {
	width: 100%;
	max-width: 310px;
	}

footer p.copyright {
	margin: auto;
	font-size: 0.6em;
	}

footer ul {
	flex: 1;
	height: 1em;
	padding: 0;
	margin: 10px auto;
	text-align: center;
	font-size: 0.8em;
	}

footer ul li {
	display: inline-block;
	list-style-type: none;
	border-right: 1px #fff solid;
	padding: 0 5px;
	text-align: center;
	line-height: 1;
	}

footer ul li:last-child {
	border: none;
	}

footer ul li a, footer ul li a:visited,footer ul li a:hover {
	color: #fff;
	text-decoration: none;
	}


/*ul.footerMenu {
	flex: 1;
	height: 1em;
	padding: 0;
	margin: 10px auto;
	text-align: center;
	font-size: 0.9em;

	}

ul.footerMenu li {
	display: inline-block;
	list-style-type: none;
	padding: 0 5px;
	text-align: center;
	line-height: 1;
	}

ul.footerMenu li {padding: 0 10px;border: none;}
ul.footerMenu li a, ul.footerMenu li a:visited, ul.footerMenu li a:hover {
	color: #d71318;
	font-weight: bold;
	text-shadow:
    #fff 2px 0px,  #fff -2px 0px,
    #fff 0px -2px, #fff 0px 2px,
    #fff 2px 2px , #fff -2px 2px,
    #fff 2px -2px, #fff -2px -2px,
    #fff 1px 2px,  #fff -1px 2px,
    #fff 1px -2px, #fff -1px -2px,
    #fff 2px 1px,  #fff -2px 1px,
    #fff 2px -1px, #fff -2px -1px;
	}*/


@media only screen and (max-width: 768px) {
body{background-size: 130%;}
section{padding: 40px 20px 40px 20px;}
h2 {font-size:1.4em;margin: -30px auto 1.5em;}
h2 img {width: 60%;}
ul {padding-left: 2.5em;padding-right: 1em;}
ul.listL	{font-size: 1.6em;}
ul.listM	{font-size: 1.0em;max-width: 30em;margin: 0 auto;}
ul.listM2	{font-size: 1.0em;}
ul.listM2>li {font-size: 1.0em;}
ul.listCast			{font-size: 1.0em;}
ul.listCast>li>span	{font-size: 0.6em;}	

.capcom-taito	{width:60%;margin:15% auto 0;}
.sponly {display: block;}
.nosp {display:none;}
main {width:100%;}
rt {font-size: 0.5em}

h3 {font-size:1.2em;background-size: 50px; padding: 0.5em 0.5em 0.5em 40px;top:-40px;}
.lineBtn {display: block;}
.button {padding: 0;margin: 10px auto 0;}
.button.fixed {position:inherit;width: 95%;margin: 20px auto 40px;}
.sub p {text-align: center;}

section.musicList h4 {font-size: 0.9em;}
section.musicList p {font-size: 0.7em;}
	
#newsBox {height: 6em;}
.andmore img {max-width:250px;}
footer {background-size: 130%;background-position: bottom center;}
#pageTop{bottom:5px;right: 5px;}
#pageTop a{height: 15px;width: 15px;}
.flexBox> div.comingsoon, .flexBox> div.comingsoon img　{display: none;}
.movie {width: 95%;}
}

@media only screen and (max-width: 480px) {
body{background-size: 150%;}
section{padding: 40px 0 40px 0;}
p {	padding: 20px 20px 0 20px;}
table {width: 95%;margin: 0 auto;box-sizing: border-box;}
.dlctable {margin-left: 0.5em;}
th, td {display: block;width: 100%;box-sizing: border-box;font-size: 0.9em;}
th {padding:20px 0.75em 0 0.75em;word-break: normal;text-align: left;}
td {padding:0 0.75em 10px 0.75em;border-bottom: 1px #999 solid;}
h2 img {width: 90%;}
h3 {font-size:1.0em;background-size: 45px; padding: 0.5em 0.5em 0.5em 30px;left: 5px;top:-35px;}
.button a {font-size: 0.9em;}
.shareButtons div {margin-right: 10px;}
.artist>div>div h3 {font-size: 0.8em;}
footer {padding-bottom: 100px;}
footer ul {font-size:0.7em}
footer p.copyright {font-size: 0.6em;}
	.large {font-size: 1em;}
}

/*FlexBox*/
.flexBox {
	display: flex;
	box-sizing: border-box;
	justify-content:center;
	/*align-items: flex-start;*/
	align-items:flex-start;
	flex-wrap: wrap;
	margin-bottom: 0;
	}

.characters>.flexBox {
	align-items: flex-start;
	}

	.flexBox>div, .flexBox>p {
		display: block;
		box-sizing: border-box;
		flex-basis: 25%;
		height: auto;
		padding: 0;
		margin: 0 0 0;
		word-break: break-all;
		}
.flexBox.reverse>div:nth-child(1){order:2;}
.flexBox.reverse>div:nth-child(2){order:1;}
.flexBox.reverse>div:nth-child(3){order:3;}
.flexBox.reverse>div:nth-child(4){order:4;}
.flexBox.reverse>div:nth-child(5){order:6;}
.flexBox.reverse>div:nth-child(6){order:5;}
.flexBox.reverse>div:nth-child(7){order:7;}
.flexBox.reverse>div:nth-child(8){order:8;}
.flexBox.reverse>div:nth-child(9){order:10;}
.flexBox.reverse>div:nth-child(10){order:9;}


.characters>.flexBox>div {
	margin-bottom: 20px;
	}

.flexBox>div img {
	display: block;
	width: 95%;
	height: 95%;
	margin: 2.5%;
	}

.bottom {
	align-items: flex-end;
	}

.top {
	align-items: flex-start;
	} 

.characters .flexBox>div img {
	box-shadow: 10px 10px 0 rgba(0,0,0,0.1);
	}

.boxset5>div {flex-basis: 20%;}
.boxset4>div {flex-basis: 25%;}
.boxset3>div {flex-basis: 33.3%;}
.boxset2>div {flex-basis: 50%;}
/*ウィジェット埋め込み用*/
section.wigets>div>div {flex-basis: 48%;margin: 0 1%;}
section.movieContents>div>div {flex-basis: 48%;margin: 0px 1% 40px;}
section.movieContents>div>div>div{box-shadow: 8px 8px 0 0 rgba(0,0,0,0.11);}
section.movieContents>div>div h4 {margin-bottom: 10px;padding-left: 0.25em;}

@media only screen and (max-width: 768px){
.flexBox.reverse>div:nth-child(1){order:1;}
.flexBox.reverse>div:nth-child(2){order:2;}
.flexBox.reverse>div:nth-child(3){order:3;}
.flexBox.reverse>div:nth-child(4){order:4;}
.flexBox.reverse>div:nth-child(5){order:5;}
.flexBox.reverse>div:nth-child(6){order:6;}
.flexBox.reverse>div:nth-child(7){order:7;}
.flexBox.reverse>div:nth-child(8){order:8;}
.flexBox.reverse>div:nth-child(9){order:9;}
.flexBox.reverse>div:nth-child(10){order:10;}

.boxset5>div {flex-basis: 33.3%;}
.boxset4>div {flex-basis: 33.3%;}
.boxset3>div {flex-basis: 50%;}
.boxset2>div {flex-basis: 100%;}
/*ウィジェット埋め込み用*/
section.wigets {padding-bottom: 0;}
section.wigets>div>div, section.movieContents>div>div {flex-basis: 98%;margin: 0 1%;margin-bottom: 20px;}
}

@media only screen and (max-width: 480px){
.boxset5>div {flex-basis: 50%;}
.boxset4>div {flex-basis: 50%;}
.boxset3>div {flex-basis: 100%;}
.boxset2>div {flex-basis: 100%;}	
}

/*楽曲リスト用*/
.musicList {
	justify-content: flex-start;
	align-items: stretch;
	}

.musicList>div {
	margin: 0 2.5% 1em 2.5%;
	flex-basis: 45%;
	border-bottom: 1px #999 solid;
}

.musicList>div.sample {
	background-color: rgba(0,0,0,0.2);
	padding: 10px 2.5%;
	border: none;
}	

.musicList>div h4 {
	padding: 0;
	margin-bottom: 0.5em
	}

.musicList>div h4.newSong:before {
	content: "新曲";
	color:#fff;
	text-shadow: none;
	font-size: 0.8em;
	background: #008CFF;
	padding: 0 10px;
	margin: 0 0.5em 0 0;
	border-radius: 2px;
	vertical-align: top
	}

.musicList>div h4.addSong:before {
	content: "追加";
	color:#fff;
	text-shadow: none;
	font-size: 0.8em;
	background: #FF3700;
	padding: 0 10px;
	margin: 0 0.5em 0 0;
	border-radius: 2px;
	vertical-align: top
	}

.musicList>div p.artist {
	padding: 0 0 0.25em 1em;
	margin: 0 0 0 1em;
	font-size: 0.7em;
	font-weight: bold
	}
.musicList>div p.artist:before {
	content:"アーティスト";
	color: rgba(248,226,232,1);
	background: #000;
	padding: 0 5px;
	margin: 0 0.5em 0 0;
	border-radius: 2px;
	}

.musicList>div p.original {
	padding: 0 0 1em 0;
	margin: 0 0 0 2em;
	font-size: 0.7em;
	color: #333;
	}

.musicList>div p.original:before {
	content:"原曲";
	color: rgba(248,226,232,1);
	background: #333;
	padding: 0 5px;
	margin: 0 0.5em 0 0;
	border-radius: 2px;
	}


@media only screen and (max-width: 768px){
	.musicList>div h4 {font-size:0.9em;}
	.musicList>div p.artist {padding-left:0;font-size: 0.7em;}
	.musicList>div p.original {margin-left:1em;font-size: 0.7em;}
	}

@media only screen and (max-width: 480px){
	.musicList>div {flex-basis: 96%;}
	}




.andmore {}
.andmore img {display: block;margin-left: auto;width: 100%;max-width:400px;}




.slideContent {width: 400px;}



/*モーダル*/
/*new mordal*/
.mfp-container {
	padding:0!important;
	}

button.mfp-close {
	width: 50px;
	height: 0px;
	padding-top: 50px;
	overflow: hidden;
	background: #4557d8 url(../images/apps/toho_close.svg)  no-repeat;
	margin-top: 5px;
	margin-right: 5px;
	opacity: 1;
    position: fixed;
	}


.mfp-arrow {
	top: 50%;
	opacity: 1;
    position: fixed;
	}

.mfp-arrow::after {
    border-top-width: 13px;
    border-bottom-width: 13px;
	top: 8px;
	}

.mfp-arrow::before {
    border-top-width: 21px;
    border-bottom-width: 21px;
	opacity: 1;
	}

.mfp-arrow-right::after {
	border-left: 17px solid #d71318;
	margin-left: 39px;
	}

.mfp-arrow-right::before {
	border-left: 27px solid #fff;
	}


.mfp-arrow-left::after {
	border-right: 17px solid #d71318;
	margin-left: 31px;
	}

.mfp-arrow-left::before {
    margin-left: 25px;
    border-right: 27px solid #fff;
	}


.modal-wrap {
	position: relative;
	margin: auto;
	text-align: left;
	/*display: flex;
	justify-content: center;
	align-items: center;*/
	}

.modal-wrap>div {
	background: url(../images/apps/img_200106_toho_cont_bg2.png) no-repeat right bottom;
	background: url(../images/apps/img_200106_toho_cont_bg2.png) no-repeat,-moz-linear-gradient(45deg,  #d34566 0%, #4557d8 100%);
	background: url(../images/apps/img_200106_toho_cont_bg2.png) no-repeat,-webkit-linear-gradient(45deg,  #d34566 0%,#4557d8 100%);
	background: url(../images/apps/img_200106_toho_cont_bg2.png) no-repeat,linear-gradient(45deg,  #d34566 0%,#4557d8 100%);
	background-size: contain,100%;
	background-position: left bottom,0 0;
  	display: flex;
	justify-content: center;
	align-items: center;
	margin: 0;
	padding: 0;
	height: 100vh;
    width: 100vw;
    position: fixed;
    left: 0;
    top: 0;
	}

.charaWrap {
	box-sizing: border-box;
	height: 600px;
	width: 98%;
	max-width: 800px;
	font-size: 1.9em;
	font-size: 1.9em;
	color: #fff;
	display: flex;
	align-items: center;
	justify-content: flex-start;
	}

.chara01 {background: url(../images/apps/img_200117_toho_character01.png) no-repeat right bottom;}
.chara02 {background: url(../images/apps/img_200117_toho_character02.png) no-repeat right bottom;}
.chara03 {background: url(../images/apps/img_200117_toho_character03.png) no-repeat right bottom;}
.chara04 {background: url(../images/apps/img_200117_toho_character04.png) no-repeat right bottom;}
.chara05 {background: url(../images/apps/img_200117_toho_character05.png) no-repeat right bottom;}
.chara06 {background: url(../images/apps/img_200117_toho_character06.png) no-repeat right bottom;}
.chara07 {background: url(../images/apps/img_200117_toho_character07.png) no-repeat right bottom;}
.chara08 {background: url(../images/apps/img_200117_toho_character08.png) no-repeat right bottom;}
.chara09 {background: url(../images/apps/img_200117_toho_character09.png) no-repeat right bottom;}
.chara10 {background: url(../images/apps/img_200117_toho_character10.png) no-repeat right bottom;}
.chara11 {background: url(../images/apps/img_200117_toho_character11.png) no-repeat right bottom;}
.chara12 {background: url(../images/apps/img_200117_toho_character12.png) no-repeat right bottom;}
.chara13 {background: url(../images/apps/img_200117_toho_character13.png) no-repeat right bottom;}
.chara14 {background: url(../images/apps/img_200117_toho_character14.png) no-repeat right bottom;}
.chara15 {background: url(../images/apps/img_200117_toho_character15.png) no-repeat right bottom;}
.chara16 {background: url(../images/apps/img_200117_toho_character16.png) no-repeat right bottom;}
.chara17 {background: url(../images/apps/img_200117_toho_character17.png) no-repeat right bottom;}
.chara18 {background: url(../images/apps/img_200117_toho_character18.png) no-repeat right bottom;}
.chara19 {background: url(../images/apps/img_200117_toho_character19.png) no-repeat right bottom;}
.chara20 {background: url(../images/apps/img_200117_toho_character20.png) no-repeat right bottom;}

.charaWrap>div {flex-basis: 98%;margin-left: 2%;}
.charaWrap p{padding: 0;margin: 0;}
.charaWrap p.charaCatch {
	ine-height: 1.0;
	font-weight: bold;
	text-shadow: 
    #000 2px 0px,  #000 -2px 0px,
    #000 0px -2px, #000 0px 2px,
    #000 2px 2px , #000 -2px 2px,
    #000 2px -2px, #000 -2px -2px,
    #000 1px 2px,  #000 -1px 2px,
    #000 1px -2px, #000 -1px -2px,
    #000 2px 1px,  #000 -2px 1px,
    #000 2px -1px, #000 -2px -1px;
	}
.charaWrap h5{
	font-size: 1.8em;
	font-weight: bold;
	padding: 0;
	margin: 0;
	line-height: 1.2em;
	text-shadow: 
    #fff 2px 0px,  #fff -2px 0px,
    #fff 0px -2px, #fff 0px 2px,
    #fff 2px 2px , #fff -2px 2px,
    #fff 2px -2px, #fff -2px -2px,
    #fff 1px 2px,  #fff -1px 2px,
    #fff 1px -2px, #fff -1px -2px,
    #fff 2px 1px,  #fff -2px 1px,
    #fff 2px -1px, #fff -2px -1px;
	}

.charaWrap h5.tooLong {font-size: 1.2em;}

.charaWrap p.charaCast {font-size:0.8em;line-height: 1.2;margin-top: 1em; margin-bottom: 1em;text-shadow: 0px 0px 2px rgba(0,0,0,1),2px 2px 4px rgba(0,0,0,1);}
.charaWrap p.charaCaption {font-size:0.6em;text-shadow: 0px 0px 2px rgba(0,0,0,1),2px 2px 4px rgba(0,0,0,1);}


@media only screen and (max-width: 768px){
	.charaWrap {font-size: 1.5em;align-items:flex-end;background-position: bottom center;}
	.modal-wrap>div {
		background-size: 200%,100%;
		background-position: right top,0 0;
		}
}
@media only screen and (max-width: 480px){
	.mfp-arrow {top:35%;}
	.charaWrap {font-size: 1.2em;height: 100%;max-height: 500px;background-size:cover;background-position: top center;flex-basis: 100%;}
	.charaWrap>div {background: rgba(0,0,0,0.25);flex-basis: 100%;margin: 0;padding: 0.5em 1em;}
}

/*story*/
.boxset2 > div.storyBoard {
	position: relative;
	min-height: 450px;
	height: 40%;
	flex-basis: 49%;
	background: url(../images/apps/img_2000121_toho_storybg.jpg) no-repeat top center;
	background-size: cover;
	}

@media only screen and (max-width: 768px){
	.boxset2 > div.storyBoard {flex-basis: 100%;}
}
@media only screen and (max-width: 480px){
	.boxset2 > div.storyBoard {min-height: 300px;}
}


.flexBox > div.storyBoard img {
	width: 100%;
	display: block;
	}

.flexBox > div.storyBoard div {
	height: auto;
	margin: auto;
	position: absolute;
	}

.sc1{width: 35%;left:-8%;top:-10%;}
.sc2{width: 60%;right:-8%;top:-20%;}
.sc3{width: 25%;left:30%;bottom:5%;}