@charset "utf-8";

body{margin: 0px; padding: 0px;
                                text-align: center;
	font-size: 90%; line-height: 180%; color: #7b7e83; 
	background-color: #000000;
	display:none; /*FI*/
	font-family: "Sawarabi Mincho", 游明朝,"Yu Mincho",YuMincho,"Hiragino Mincho ProN","Hiragino Mincho Pro",HGS明朝E,メイリオ,Meiryo,serif;}

a:link {color: #9eb7ca; text-decoration: none;}
a:visited {color: #a7aab0; text-decoration: none;}
a:hover {color: #bfdbf0; text-decoration: none;
	-webkit-transition: 0.2s;
	transition: 0.2s;}

/*menu*/
.menu-container {margin: 0; padding: 0;
	width: 1080px; height: 60px;
                                text-align: left;}
.menu00 {margin: 0; padding: 0; float: left; width: 190px;}
.menu00 img {width: 100%;}
.menu01 {margin: 0; /*padding-left: 49px;*/ float: left; }
.menu02 {margin: 0; padding: 0; float: left;}

/*common*/
.main-container-full {margin: 0 auto; padding: 0;
	width: 100%;}
.main-container-1080 {margin: 0 auto; padding: 0;
	width: 1080px;}
/*top*/
.keyvisual {margin: 0; padding: 0;}
.keyvisual img{margin: 0; width: 100%; height: auto;}

.keyvisual-promo {margin: 0 auto;
                                padding-top: 44%;
                                text-align: center;
                                position: absolute;}
.keyvisual-promo img{margin: 0; width: 100%; height: auto;}

/*promo*/
.promo{margin: 0 auto;
                                padding: 50px 0px 50px 0px;
                                width: 1040px; height: auto;
                                border-bottom: 0px solid #3c3c3c;}

.promo2{margin: 0 auto;
                                padding: 50px 0px 50px 0px;
                                width: 1040px; height: auto;
                                border-bottom: 1px solid #3c3c3c;}

/*title*/
.contents-title {margin: 0 auto; padding: 70px 0px 70px 0px;
	font-size: 180%; line-height: 100%; color: #cccccc;
	letter-spacing: 10px;}

/*btn*/
.btn1 {margin: 40px 0px 30px 0px;
                                font-size: 90%; line-height: 100%;
	letter-spacing: 5px;
	text-align: center; 
                                cursor: pointer;
	-webkit-transition: 0.2s;
	transition: 0.2s;
	border:1px solid #a7a7a7;}

.btn1 a {padding: 10px 20px 10px 20px; color: #ffffff;
	display: block;}
.btn1 a:hover {background: #145170; color: #ffffff;}

.btn-width200 {width: 200px;}
.btn-top {margin: 0px 0px 30px 0px; width: 200px; font-size: 100%;}
.btn-top2 {margin: 0px 0px 30px 0px; width: 260px; font-size: 100%;}

.btn-story {margin: 0px 0px 100px 0px; width: 500px; font-size: 100%;
                                line-height: 150%;}

/*news*/
.news-container {margin: 0 auto; 
                                padding: 0px 0px 0px 0px;
	width: 1080px;}

.news-box {margin: 0px 20px 0px 20px;
                                padding: 0px 0px 0px 0px;
	width: 230px; height: auto;
                                float: left;
                                                                background-color: #000000;
                                }

.news-container2 {margin: 0 auto; 
                                padding: 50px 0px 0px 0px;
	width: 1080px;}

.news-box2 {margin: 0px 20px 0px 20px;
                                padding: 0px 0px 0px 0px;
	width: 230px; height: 320px;
                                float: left;
                                }

.news-container3 {margin: 0 auto; 
                                padding: 0px 0px 0px 0px;
	width: 960px;}

/*movie*/
.mov-container {margin: 0 auto; padding: 0;
	width: 100%; background: #111d2a; }

.movbox {margin: 0 auto; padding: 0;
	width: 1080px;}

.mov-harf {margin: 0px 20px 20px 20px; padding: 0;
	width: 500px;
                                float: left;}

.mov-full {position: relative;
	padding-bottom: 56.25%;
	padding-top: 30px;
	border: solid 1px #3c3c3c;
	overflow: hidden;}

.mov-full iframe {position: absolute;
	top: 0; left: 0;
	width: 100%; height: 100%;}

/*twitter*/
.twi-container {margin: 0 auto; padding-bottom: 40px;
	width: 520px;}

.twitter-full {position: relative;
	padding-bottom: 20px;
	padding-top: 20px;
	border: solid 1px #3c3c3c;
	overflow: hidden;}

.twitter-full iframe {position: absolute;
	top: 0; left: 0;
	width: 100%; height: 100%;}

/*sns*/
.sns-container {margin: 0; padding: 0;
	width: 640px;}

.sns-box {margin: 0; padding: 100px 176px 90px 176px;
	text-align: center;
	width: 288px;}

.sns-btn {margin: 0; padding: 0px 25px 0px 25px;
	float: left;}
.follow-btn {margin: 0; padding: 0px 39px 55px 39px;}

/*footer*/
.ban-container {margin: 0; padding: 0;
	text-align: center;
	width: 888px;}

.ban-box {margin: 0; padding: 0px 0px 30px 0px;
	text-align: center;
	width: 888px;}

.ban-box2 {margin: 0; padding: 0px 0px 30px 0px;
	text-align: left;
	width: 888px;}

.footer-ban {margin: 0; padding: 0px 28px 0px 28px;
	float: left;}

.footer-ban2 {margin: 0; padding: 30px 0px 40px 0px;
	float: none;}

.footer-ban3 {margin: 0 auto; padding: 10px 0px 50px 0px;
	width: 400px;}

.footer-ban3 img {width: 100%;}

.footer-ban4 {margin: 0 auto; padding: 40px 22px 60px 22px;
	width: 400px;
	float: left;}
.footer-ban4 img {width: 100%;}

.footer-txt {margin: 0px 0px 60px 0px;
	font-size: 75%; line-height: 160%;}

.ban-box5 {margin: 0; padding: 50px 0px 30px 0px;
	text-align: center;
	width: 1059px;}
.footer-ban5 {margin: 0 auto; padding: 20px 20px 20px 20px;
	width: 313px;
	float: left;}
.footer-ban5 img {width: 100%;}

.ban-box6 {margin: 0; padding: 50px 0px 0px 0px;
	text-align: center;
	width: 1050px;}
.ban-box6b {margin: 0; padding: 0px 0px 30px 0px;
	text-align: center;
	width: 1050px;}
.ban-box6c {margin: 0; padding: 0px 0px 30px 0px;
	text-align: center;
	width: 840px;}
.ban-box6d {margin: 0; padding: 0px 0px 10px 0px;
	text-align: center;
	width: 630px;}
.footer-ban6 {margin: 0 auto; padding: 20px 10px 20px 10px;
	width: 190px;
	float: left;}
.footer-ban6 img {width: 100%;}


/*pagetop*/
#page-top {margin: 0px; padding: 0px;
	position: fixed;
	bottom: 110px;
	right: 50px;}

#page-top a {margin: 0px; padding: 0px;
	width: 110px; height: 110px;
	display: block;}

/*subpage*/
.bg-lightning{margin: 0; padding: 0;
	background-image: url(../images/bg2.jpg);
	background-repeat: no-repeat;
	background-position: top center;
	width: 100%;}

.contents-subtitle {margin: 0 auto; padding: 60px 0px 70px 0px;
	font-size: 180%; line-height: 100%; color: #f6eec4;
	letter-spacing: 10px;}

.contents-subtitle2 {margin: 0 auto; padding: 70px 0px 60px 0px;
	font-size: 160%; line-height: 170%; color: #c3c5c8;
	letter-spacing: 5px;}

.footer-hr {margin: 0; padding: 0px 0px 0px 0px;
                                border-bottom: solid 1px #3c3c3c;
	width: 960px;}
.footer-hr2 {margin-bottom: 100px; padding: 0px;
                                border-bottom: solid 1px #3c3c3c;
	width: 960px;}
.footer-hr3 {margin: 0; padding: 0px 0px 0px 0px;
                                border-bottom: solid 1px #3c3c3c;
	width: 1040px;}
.footer-hr4 {margin: 0; padding: 0px 0px 0px 0px;
                                border-bottom: solid 1px #3c3c3c;
	width: 860px;}
/*comment*/
.comment-container {margin: 0; padding: 100px 0px 100px 30px;
	text-align: left;
	font-size: 100%; line-height: 180%; color: #a4a6ab;
	width: 660px;}

.staff1 {margin: 0; padding: 5px 30px 0px 0px;
	float: left;
	text-align: right;
	font-size: 90%; line-height: 180%; color: #a4a6ab;
	width: 160px;}

.staff2 {margin: 0; padding: 0px 0px 0px 0px;
	float: left;
	text-align: left;
	font-size: 130%; line-height: 180%; color: #c3c5c8;
	letter-spacing: 3px;
	width: 470px;}

/*gallery*/
.gallery-container {margin: 0; padding: 50px 0px 0px 0px;
	text-align: left;
	font-size: 100%; line-height: 180%; color: #a4a6ab;
	width: 860px;}

.art-box {margin: 0 auto; 
                                padding: 100px 0px 40px 0px;
	width: 1080px;}


.art-harf {margin: 0px 20px 60px 20px; padding: 0;
	width: 500px;
                                float: left;}
.art-harf img {width: 100%;}
.art-tri {margin: 0px 20px 60px 20px; padding: 0;
	width: 320px;
                                float: left;}
.art-tri img {width: 100%;}

.pabro-container {margin: 0; padding: 100px 0 0px 0;
	background-color: #111d2a;
	width: 100%;}
/*230205追加*/
.board-container {margin: 0; padding: 100px 0 0px 0;
	width: 100%;}
/*230205追加：ここまで*/
.contents-subtitle3 {margin: 0 auto; padding: 0px 0px 0px 0px;
	font-size: 160%; line-height: 170%; color: #c3c5c8;
	letter-spacing: 5px;}

                                /*present*/
                                .present {margin: 0; padding: 30px 0% 30px 0%;
                                	width: 100%;
                                	text-align: center;
                                	line-height: 140%;
                                	border-bottom: 1px #96bedc solid;
                                	border-top: 1px #96bedc solid;}
                                
                                .present a:link {color: #96bedc; text-decoration: none;}
                                .present a:visited {color: #96bedc; text-decoration: none;}
                                .present a:hover {color: #beddf4; text-decoration: none;
                                	-webkit-transition: 0.5s;
                                	transition: 0.5s;}
                                
                                .present2 {font-size: 150%; line-height: 160%; color: #96bedc;}
                                
                                .present2 a:link {color: #96bedc; text-decoration: none;}
                                .present2 a:visited {color: #96bedc; text-decoration: none;}
                                .present2 a:hover {color: #beddf4; text-decoration: none;
                                	-webkit-transition: 0.5s;
                                	transition: 0.5s;}

/*theater*/
.theater-container {margin: 0; padding: 0px 0px 30px 0px;
	text-align: center;
	width: 1080px;}
.banner-container {margin: 0; padding: 70px 60px 0px 60px;
	text-align: center;
	width: 960px;}
.banner-container img {width: 100%;}

.goods-title {margin: 0 auto; padding: 70px 0px 60px 0px;
	font-size: 180%; line-height: 100%; color: #cccccc;
	letter-spacing: 10px;}
.goods-titleS {padding: 20px 0px 0px 0px;
	font-size: 60%}
.goods-txt {padding: 0px 0px 0px 0px;
	font-size: 80%; line-height: 180%; color: #a4a6ab;}

.goods-box {margin: 0 auto; 
                                padding: 0px 0px 70px 0px;
	width: 720px;}

.goods-harf {margin: 0px 30px 40px 30px; padding: 0;
	width: 300px;
                                float: left;}
.goods-harf img {width: 100%;}

.bluray-title {margin: 0 auto; padding: 40px 0px 30px 0px;
	font-size: 190%; line-height: 140%; color: #cccccc;
	letter-spacing: 10px;}

.bluray-title2 {padding: 0px 0px 0px 0px;
	font-size: 110%; line-height: 180%; color: #cccccc;
                                letter-spacing: 4px;}

.bluray-box {margin: 0 auto;
                                padding: 0px 0px 0px 0px;
	text-align: left;
	font-size: 100%; line-height: 180%; color: #c3c5c8;
	width: 860px;}

.bluray-left {margin: 0; padding: 0px 0px 30px 0px;
                                float: left; width: 140px;}
.bluray-right {margin: 0; padding: 0px 0px 30px 0px;
                                float: left; width: 720px;}

.bluray-txtS {padding: 0px 0px 8px 0px;
	font-size: 80%; line-height: 170%; color: #a4a6ab;
                                letter-spacing: 1px;}

.bluray1 {padding: 50px 0px 50px 0px;}
.bluray2 {padding: 50px 0px 30px 0px;}
.bluray3 {padding: 50px 0px 50px 0px;}

.bluray-hr {margin: 0; padding: 20px 0px 20px 0px;
                                border-bottom: solid 1px #3c3c3c;
	width: 860px;}

.bluray-box2 {margin: 0 auto;
                                padding: 0px 0px 0px 0px;
	text-align: left;
	font-size: 100%; line-height: 180%; color: #c3c5c8;
	width: 590px;}
.bluray-left2 {margin: 0; padding: 0px 0px 5px 0px;
                                float: left; width: 120px;}
.bluray-right2 {margin: 0; padding: 0px 0px 5px 0px;
                                float: left; width: 470px;}

.tokuten-title {padding: 0px 0px 10px 0px;
	font-size: 110%; line-height: 180%; color: #cccccc;
                                letter-spacing: 4px;}
.tokuten-title2 {padding: 2px 0px 5px 0px;
	font-size: 110%; line-height: 180%; color: #cccccc;}

.tokuten-left {margin: 0; padding: 10px 0px 20px 0px;
                                float: right; width: 210px;}
.tokuten-right {margin: 0; padding: 10px 0px 20px 0px;
                                float: right; width: 650px;}

/*tab*/
.tab-container {margin: 0 auto; padding: 0px 0px 30px 0px;
	text-align: center;
	width: 1080px;}
ul.top-tab {margin: 50px; padding: 0px; list-style: none;}
ul.top-tab li {margin: 0px 5px 2px 5px; padding: 20px 35px 20px 35px;
                                width: auto; height: 30px;
	float: left; text-align: center;
	font-size: 100%; line-height: 130%;
	cursor: pointer;}

ul.top-tab li.valign {padding: 27px 35px 20px 35px;
                                height: 23px;}

ul.top-tab li:hover {background-color: #145170; color: #ffffff;}
ul.top-tab li.active {background-color: #145170; color: #ffffff;}

div.top-tabContent {clear: both; 
	margin: 0px; padding: 0px;
	width: 1080px; height: auto; display: none;
	text-align: left;
	font-size: 95%; line-height: 180%; color: #ffffff;
	}

div.top-tabContent {border-top: 0px #d70c73 solid;}/*タブ無し*/

div.active {display: block;}


.bn-blu {margin: 0 auto; padding: 70px 0px 0px 0px;
	width: 500px;}
.mov-blu {margin: 0 auto; padding: 70px 0px 0px 0px;
	width: 500px;}
/*story*/
.story-container {margin: 0; padding: 60px 0px 0px 0px;
	text-align: left;
	font-size: 105%; line-height: 200%; color: #c3c5c8;
	width: 700px;}

.story-pic {margin: 0; padding: 70px 10px 120px 0px;
	width: 400px;}

/*music*/
.music-box {margin: 0 auto; 
                                padding: 0px;
                                padding-bottom: 80px;
	width: 960px;}

.music-alex {padding-top: 30px;}

.music-left {margin: 0; padding: 50px 0px 0px 0px;
	text-align: left;
                                float: none;
	font-size: 100%; line-height: 200%; color: #c3c5c8;
	width: 700px;}

.music-right {margin: 0; padding: 0px 10px 0px 0px;
	text-align: left;
                                float: none;
	width: 400px;}

.music-right img{width: 100%;}

.music-txts {padding: 30px 0px 0px 0px;
                                font-size: 90%; line-height: 170%;}

.music-comment {margin: 60px 0px 80px 0px; padding: 20px 30px 25px 30px;
	text-align: left;
                                background: #111d2a;
                                border: solid 1px #3c3c3c;
	color: #c7c7c7; font-size: 100%; line-height: 200%;}

/*chara*/
.chara-box {margin: 0 auto; 
                                padding: 0px;
	width: 960px;}

.chara-name {padding: 65px 0px 0px 40px;
	text-align: left;
                                float: left;
	font-size: 115%; line-height: 150%; color: #c3c5c8;}

.chara-m {padding: 10px 0px 0px 0px;}

.chara-left {padding: 30px 20px 80px 40px;
	text-align: left;
                                float: left;
	font-size: 100%; line-height: 200%; color: #c3c5c8;
	width: 320px;}

.chara-right {padding: 30px 0px 80px 0px;
	text-align: left;
                                float: right;
	width: 580px;}
.chara-right2 {padding: 30px 0px 80px 0px;
	text-align: left;
                                float: right;
	width: 580px;}

.chara-txtl {font-size: 135%; line-height: 160%; color: #e5e6e8;}

/*mecha*/
.mecha-name {padding: 50px 0px 0px 40px;
	text-align: left;
                                float: left;
	font-size: 115%; line-height: 150%; color: #c3c5c8;}

.mecha-left1 {padding: 30px 10px 80px 40px;
	text-align: left; float: left;
	font-size: 100%; line-height: 200%; color: #c3c5c8;
	width: 230px;}
.mecha-right1 {padding: 20px 0px 80px 0px;
	text-align: left; float: right;
	width: 680px;}

.mecha-left2 {padding: 30px 10px 80px 40px;
	text-align: left; float: left;
	font-size: 100%; line-height: 200%; color: #c3c5c8;
	width: 330px;}
.mecha-right2 {padding: 20px 0px 80px 0px;
	text-align: left; float: right;
	width: 580px;}

/*list*/
.list-container1 {margin: 0; padding: 50px 0 100px 0;
	background-color: #111d2a;
	width: 100%;}

.list-container2 {margin: 0; padding: 0;
	width: 960px;}

.list-title {margin: 0; padding: 10px 0% 40px 0%;
	width: 100%;
	font-size: 140%; color: #efefef; 
	text-align: center;}

.list-sub {margin: 0; padding: 40px 0% 0px 0%;
	width: 90%;
	font-size: 100%; color: #d0d0d0; 
	text-align: center;}

p.list {margin: 8px 0px 0px 0px; padding: 15px 20px 10px 30px;
	text-align: center; cursor: pointer;
	letter-spacing: 2px;
	background: #1f3750;
	background: #162a3f;
	font-size: 120%; color: #efefef; font-weight: normal;
	-webkit-transition: 0.2s;
	transition: 0.2s;
	border-bottom: 0px solid #a7a7a7;}

p.list:hover {background: #2a4766;
                                background: #145170;
	color: #ffffff;
	border-bottom: 0px solid #627991;}

p.list-text {margin: 0px 0px 25px 0px; padding: 15px 20px 10px 100px;
	color: #c7c7c7; font-size: 100%; line-height: 160%;
	display: none; text-align: left;}

/*tomino*/
.tomino-container {margin: 0 auto; padding: 0;
	width: 100%; background: #111d2a; }

.tomino-comment {margin: 0px; padding: 20px 0px 100px 0px;
	width: 700px; height: auto;
	text-align: left;
	color: #c7c7c7; font-size: 105%; line-height: 220%;
                                letter-spacing: 1px;
	}

.tomino {margin: 0px; padding: 0px 0 70px 0;
	text-align: center;}

.hr {margin: 6px 0px;}

.left {float: left;}
.right {float: right;}
.center {text-align: center;}
.clear{clear:both;}

.space20 {width: 20px; height: 20px;}
.space10 {width: 10px; height: 10px;}


/*●751px以上
================================================*/
@media only screen and (min-width: 751px) {
.sponly{display: none;}
.sponly2{display: none;}

/**/}


/*●750px以下（SP）
================================================*/
@media only screen and (max-width: 750px) {
.pconly{display: none;}

/*drawerMenu*/
.sp-header{width: 100%; height: 100px;
	text-align: right;}

.sp-header-logo{padding: 4% 3% 0% 47%;
	width: 50%; height: auto;
	position: absolute;
	z-index: 99;
	text-align: right;}

.btn {background:transparent url(../images/btn1.png) no-repeat 0 0;
	top: 20px; left: 20px;
	width: 60px; height: 60px;
	display: block;
	position: absolute;
	cursor: pointer;
	z-index: 200;}

.peke {background: transparent url(../images/btn2.png) no-repeat 0 0;}

.drawr {display: none;
	padding: 87px 0 0 0;
	background-color: rgba(40,40,40,1.0);
	position: absolute;
	top: 0; left: 0px; width: 280px; height: auto;
	z-index: 100;}

#menu li {list-style: none;}
#menu li a {margin: 0px 0px 0px -20px;
	padding: 17px 0px 17px 20px;
	width: 240px;
	display: block;
	text-align: left;
	border-bottom: solid 1px #666666;
                                letter-spacing: 5px;
	font-size: 140%; color: #ffffff;}

#menu li:nth-child(1) a {border-top: solid 1px #666666;}
#menu li:nth-child(9) a {border-bottom: solid 0px #666666;}

img{margin: 0; padding: 0; width: 100%;}

/*common*/
.main-container-full, .main-container-1080 {
	padding: 0; width: 100%;}

/*top*/
.keyvisual-promo {margin: 0 auto;
                                padding-top: 117%;
                                position: absolute;}
.keyvisual-promo img{margin: 0; width: 100%; height: auto;}

/*promo*/
.promo{margin: 0 auto;
                                padding: 5% 10% 0% 10%;
                                width: 80%; height: auto;}

.promo2{margin: 0 auto;
                                padding: 6% 0% 6% 0%;
	font-size: 110%;
                                text-align: center;
                                width: 100%; height: auto;}
/*title*/
.contents-title {margin: 0 auto; padding: 15% 0% 13% 0%;
	font-size: 170%;}

/*btn*/
.btn1 {margin: 7% 0% 7% 0%; font-size: 85%;}
.btn1 a {padding: 10% 5% 10% 5%;}

.btn-width200 {width: 60%;}
.btn-top {margin: 7% 0% 7% 0%; width: 60%; font-size: 90%;}
.btn-top2 {margin: 7% 0% 7% 0%; width: 60%; font-size: 90%;}
.btn-story {margin: 5% 0% 10% 0%; width: 80%; font-size: 90%;}

/*news*/
.news-container {margin: 0 auto; 
                                padding: 0% 10% 0% 10%;
	width: 80%;}

.news-box {margin: 0% 0% 13% 0%;
                                padding: 0% 0% 0% 0%;
	width: 100%; height: auto;
                                float: none;}

.news-container2 {margin: 0 auto; 
                                padding: 11% 5% 0% 5%;
	width: 90%;}

.news-box2 {margin: 0% 0% 0% 0%;
                                padding: 0% 5% 0% 5%;
	width: 40%; height: auto;
                                float: left;}

.news-container3 {margin: 0 auto; 
                                padding: 11% 5% 0% 5%;
	width: 90%;}
/*movie*/
.mov-container {margin: 0 auto; padding: 0% 0% 0% 0%;
	width: 100%; background: #111d2a; }

.movbox {margin: 0 auto; padding: 0% 0% 0% 0%;
	width: 100%;}

.mov-harf {margin: 0% 0% 5% 0%; padding: 0% 10% 0% 10%;
	width: 80%;
                                float: none;}

/*twitter*/
.twi-container {margin: 0 auto; padding: 0% 10% 10% 10%;
	width: 80%;}

/*sns*/
.sns-container {padding: 15% 0% 15% 0%; width: 100%;}

.sns-box {margin: 0; padding: 0% 0% 0% 0%;
	width: 288px;}

.follow-btn {margin: 0; padding: 25% 39px 10% 39px;}

/*footer*/
.ban-container {margin: 0; padding: 0;
	text-align: center;
	width: 608px;}

.ban-box {margin: 0; padding: 0px 0px 30px 0px;
	text-align: center;
	width: 608px;}

.ban-box2 {margin: 0; padding: 0%;
	width: 100%;}

.footer-ban {margin: 0; padding: 0px 45px 0px 45px;
	float: left;}

.footer-ban4 {margin: 0 auto; padding: 20px 3% 40px 4%;
	width: 97%;
	float: none;}

.ban-box5 {margin: 0; padding: 0px 0% 10% 0%;
	width: 100%;}
.footer-ban5 {margin: 0 auto; padding: 4% 10% 4% 10%;
	width: 80%;
	float: none;}
.footer-ban5 img {width: 100%;}


.ban-box6 {margin: 0; padding: 0px 0% 0% 0%;
	width: 100%;}
.ban-box6b {margin: 0; padding: 0px 0% 10% 0%;
	width: 100%;}
.ban-box6c {margin: 0; padding: 0px 0% 0% 0%;
	width: 100%;}
.ban-box6d {margin: 0; padding: 0px 0% 0% 0%;
	width: 100%;}
.footer-ban6 {margin: 0 auto; padding: 6% 10% 6% 10%;
	width: 80%;
	float: none;}
.footer-ban6 img {width: 100%;}

/*pagetop*/
#page-top {bottom: 80%; right: 0%;}
#page-top a {width: 80%; height: 80%;}
#page-top img {width: 80%; height :auto;}

/*subpage*/
.bg-lightning{margin: 0; padding: 0;
	background-size: 180% auto;}

.contents-subtitle {margin: 0 auto; padding: 5% 0% 5% 0%;
	font-size: 160%;}

.contents-subtitle2 {margin: 0 auto; padding: 11% 0% 10% 0%;
	font-size: 140%;}

.footer-hr {margin: 0;
                                border-bottom: solid 1px #3c3c3c;
	width: 90%;}

.footer-hr2 {margin-bottom: 15%;
                                border-bottom: solid 1px #3c3c3c;
	width: 90%;}
.footer-hr3 {margin: 0;
                                border-bottom: solid 1px #3c3c3c;
	width: 90%;}
.footer-hr4 {margin: 0;
                                border-bottom: solid 1px #3c3c3c;
	width: 100%;}
/*comment*/
.comment-container {margin: 0; padding: 20% 10% 20% 10%;
	font-size: 90%; line-height: 160%; color: #a4a6ab;
	width: 80%;}

.staff1 {margin: 0; padding: 0px 0px 0px 0px;
	float: none;
	text-align: center;
	font-size: 100%; line-height: 160%;
	width: 100%;}

.staff2 {margin: 0; padding: 0px 0px 20px 0px;
	float: none;
	text-align: center;
	font-size: 130%;
	letter-spacing: 3px;
	width: 100%;}
/*gallery*/
.gallery-container {margin: 0; padding: 16% 10% 20% 10%;
	width: 80%;}

.art-box {margin: 0 0 0 0; 
                                padding: 10% 0% 10% 0%;
	width: 100%;}

.art-harf {margin: 0% 0% 10%0%; padding: 0;
	width: 100%;
                                float: none;}

.art-tri {margin: 0% 10% 12%10%; padding: 0;
	width: 80%;
                                float: none;}

.pabro-container {margin-top: 0%; padding: 3% 0% 0% 0%;
	width: 100%;}
.contents-subtitle3 {margin: 0 auto; padding: 10% 0% 0% 0%;
	font-size: 130%;}


                                /*present*/
                                .present {margin: 0; padding: 5% 10% 5% 10%;
                                	width: 80%;}
                                .present2 {font-size: 110%; line-height: 160%;}

/*theater*/
.theater-container {margin: 0; padding: 0% 3% 5% 3%;
	width: 94%;}
.banner-container {margin: 0; padding: 10% 7% 3% 7%;
	width: 86%;}

.goods-title {margin: 0 auto; padding: 15% 0% 13% 0%;
	font-size: 170%;}

.goods-box {margin: 0 0 0 0; 
                                padding: 4% 0% 4% 0%;
	width: 100%;}

.goods-harf {margin: 0% 10% 10% 10%; padding: 0;
	width: 80%;
                                float: none;}

.bluray-title {margin: 0 auto; padding: 6% 0% 6% 0%;
	font-size: 180%;}
.bluray-title2 {margin: 0 auto; padding: 0%;
	font-size: 100%;}
.bluray-box, .bluray-box2 {margin: 0; padding: 0% 0% 0% 0%;
	width: 100%;}
.bluray-left {margin: 0; padding: 0% 8% 2% 8%; font-size: 115%;
                                float: none; width: 84%;}
.bluray-right {margin: 0; padding: 0% 8% 8% 8%;
                                float: none; width: 84%;}
.bluray-left2 {margin: 0; padding: 0% 8% 2% 8%; font-size: 115%;
                                float: none; width: 84%;}
.bluray-right2 {margin: 0; padding: 0% 8% 5% 8%;
                                float: none; width: 84%;}
.bluray1 {padding: 8% 20% 8% 20%; width: 60%;}
.bluray2 {padding: 8% 10% 5% 10%; width: 80%;}
.bluray3 {padding: 8% 25% 10% 25%; width: 50%;}
.bluray1 img {width: 100%;}
.bluray2 img {width: 100%;}
.bluray3 img {width: 100%;}

.tokuten-title {padding: 0% 8% 2% 8%; width: 84%;
	font-size: 105%;}
.tokuten-title2 {padding: 3% 0% 3% 0%;
	font-size: 115%;}
.tokuten-left {margin: 0; padding: 3% 20% 4% 20%;
                                float: none; width: 60%;}
.tokuten-right {margin: 0; padding: 6% 8% 2% 8%;
                                float: none; width: 84%;}

/*tab*/
.tab-container {margin: 0 auto; padding: 0% 3% 5% 3%;
	width: 94%;}

ul.top-tab {margin: 12% 8% 0% 8%; padding: 0px; list-style: none;}
ul.top-tab li {margin: 1% 0% 5% 0%; padding: 4% 0% 4% 0%;
                                height: auto;
	float: none; text-align: center;
                                width: 98%;
	font-size: 100%; line-height: 150%;
	cursor: pointer;}

ul.top-tab li.valign {padding: 4% 0% 4% 0%;}

div.top-tabContent {border-top: 0px #d70c73 solid;
                                width: 100%;}

.bn-blu {padding: 10% 10% 0% 10%;
	width: 80%;}
.mov-blu {padding: 15% 10% 10% 10%;
	width: 80%;}

/*story*/
.story-container {margin: 0; padding: 20% 10% 0% 10%;
	font-size: 100%; line-height: 200%;
	width: 80%;}

.story-pic {margin: 0; padding: 15% 0% 20% 0%;
	width: 100%;}

.story-pic img{width: 100%;}

/*music*/
.music-box {padding: 0% 10% 8% 10%;
	width: 80%;}

.music-alex {padding: 4% 25% 0% 25%;
                                width: 50%;}

.music-left {padding: 10% 0% 5% 0%;
                                float: none;
	width: 100%;}

.music-right {margin: 0; padding: 0% 0% 0% 0%;
                                float: none;
	width: 100%;}

.music-txts {padding: 4% 0% 0% 6%;
                                font-size: 100%; line-height: 200%;}

.music-comment {margin: 5% 0% 8% 0%; padding: 6% 5% 7% 5%;
	color: #c7c7c7; font-size: 95%; line-height: 190%;}

/*chara*/
.chara-box {padding: 17% 10% 8% 10%;
	width: 80%;}

.chara-name {padding: 0% 0% 5% 0%;
                                font-size: 125%;
                                float: none;}

.chara-m {padding: 3% 0% 0% 0%;}

.chara-left {padding: 5% 0% 5% 0%;
                                float: none;
	width: 100%;}

.chara-right {padding: 3% 0% 0% 0%;
                                float: none;
	width: 100%;}
.chara-right2 {margin: 0% 25% 0% 25%;
                                padding: 3% 0% 0% 0%;
                                float: none;
	width: 50%;}


.chara-txtl {font-size: 140%;}

/*mecha*/
.mecha-name {padding: 0% 0% 5% 0%;
                                font-size: 125%;
                                float: none;}

.mecha-left1 {padding: 5% 0% 5% 0%;
                                float: none; width: 100%;}
.mecha-right1 {padding: 0% 5% 2% 5%;
                                float: none; width: 90%;}
.mecha-left2 {padding: 5% 0% 5% 0%;
                                float: none; width: 100%;}
.mecha-right2 {padding: 0% 5% 2% 5%;
                                float: none; width: 90%;}

.chara-txtl {font-size: 140%;}

/*ticket*/
.ticket-container {margin: 0; padding: 0;}

.ticket-box {margin: 0; padding: 1% 5% 2% 5%;
	text-align: left; width: 90%;
	font-size: 70%; line-height: 160%; color: #c7c7c7;}

.ticket-box img{margin: 2% 0% 0% 0%;
	max-width: 100%; width: 100%; height: auto;}

/*list*/
.list-container1 {margin: 0; padding: 0;
	width: 100%;}

.list-container2 {margin: 0; padding: 0% 5% 0% 5%;
	width: 90%;}

.list-title {margin: 0; padding: 12% 0% 8% 0%;
	font-size: 110%;}
.list-sub {margin: 0; padding: 5% 0% 15% 0%;
	font-size: 90%;}

p.list {margin: 2% 0% 0% 0%; padding: 3% 4% 3% 4%;
	background: #0b3c55;
	font-size: 110%;}
p.list-text {margin: 0; padding: 3% 5% 5% 7%;
	font-size: 85%; line-height: 190%;}

/*tomino*/
.tomino-container {margin: 0 auto; padding: 0% 5% 10% 5%;
	width: 90%; }

.tomino-comment {margin: 0%; padding: 7% 5% 10% 5%;
	font-size: 90%; line-height: 190%;
	width: 90%; height: auto;}

.tomino1 {margin: 0px; padding: 0% 0% 7% 0%;}
.tomino1 img{margin: 0; padding: 0;
	width: 100%; height: auto;}
.tomino2 {margin: 0px; padding: 0% 25% 10% 25%;}
.tomino2 img{margin: 0; padding: 0;
	width: 100%; height: auto;}

/*footer*/
.ban-container {margin: 0; padding: 0;
	text-align: center; width: 100%;}

.ban-box {margin: 0 5% 8% 5%; padding: 0;
	text-align: center; width: 90%;}

.ban-box-half {margin: 0; padding: 0 0 0 0;
	text-align: center; width: 50%;
	float: left;}

.footer-ban {margin: 0; padding: 0 0 5% 0;
	text-align: center; width: 100%;}

	.footer-ban img{margin: 0; padding: 0 0 0 0;
		width: auto;}
.footer-ban3 {margin: 0; padding: 5% 15% 0% 15%;
	text-align: center; width: 70%;}

.footer-txt {font-size: 75%; line-height: 160%;}

/**/}


/*●400px以下（SP）
================================================*/
@media only screen and (max-width: 400px) {

.ban-box {margin: 0 10% 8% 5%; padding: 0;
	text-align: center; width: 85%;}

#page-top {right: -33px;}
#page-top img {width: 70%; height :auto;}

/**/}

/*● デバイス横向きの場合
================================================*/
@media (orientation: landscape){
 
.sp-header-logo{padding: 2% 3% 0% 64%;
	width: 33%; height: auto;}


}



/*20221222追加*/
.tv-text {margin: 0; padding: 50px 0px 0px 0px;
	text-align: center;
                                float: none;
	font-size: 100%; line-height: 200%; color: #c3c5c8;
	width: 700px;}
.tv-title {font-size: 30px;}
.tv-title span { display: inline-block;}
.tv-schedule1 {font-size: 150%;}
.tv-schedule1 span:not(.pconly) {font-size: 150%;}

@media (max-width:750px) {
.tv-text {padding: 10% 0% 5% 0%;
                                float: none;
	width: 100%;}
.tv-title {font-size: min(30px, 4.3vw);font-weight: bold;}
.tv-schedule1 {font-size: 130%;}
.tv-schedule2 span {display: inline-block;}
.contents-subtitle2.tv {line-height: 1.2; font-size: min(140%, 5vw);}
.contents-subtitle2.tv span {display: block;}
}



/*20230115追加*/
.story-text {margin: 0; padding: 0 0 30px;
	text-align: center; float: none;
	font-size: 100%; width: 700px; position: relative}
.story-text::after {position: absolute; z-index: -1;
	font-size: 600%; font-weight: 900;
	left: 0;top: 0; opacity: .3;}
.story-text.story01::after { content: '1';}
.story-text.story02::after { content: '2';}
.story-text.story03::after { content: '3';}
.story-text.story04::after { content: '4';}
.story-text::before {position: absolute; z-index: -1;
	font-size: 300%; font-weight: 900;
	left: 1em;top: .75em; opacity: .3;
	content: '/4';}
.story-title {font-size: 30px; color: #c3c5c8;}
.story-description {text-align: left; color: #c3c5c8; line-height: 200%;}
ul.story-images,.story-images li { list-style-type: none; margin: 0; padding: 0}
ul.story-images {display: flex; flex-wrap: wrap}
.story-images li {width: calc(50% - 10px); padding:5px;line-height: 0}
.story-images li img {max-width: 100%;}
@media (max-width:750px) {
.story-text {padding: 0% 5% 5% 5%; float: none; width: auto;}
.story-title {font-size: min(30px, 4.3vw);font-weight: bold;}
.story-text::after {font-size: 400%; left: 5%;top: 0;}
.story-text::before {font-size: 200%; left: calc(1em + 5%);top: .75em;}
.story-images li {width: 100%; padding: 0 0 5px;}
}



/*20230328追加*/
.tv-attention {
    text-align: center;
    margin: 15px 0;
    font-size: 150%;
    color: #c3c5c8;
}