@charset "UTF-8";
/* CSS Document */

.pc,.twitter_side{
	display: none !important;
}

*{
	margin:0;
	padding:0;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

#gnavi{
	display: none;
}

#logo,#logo2,#hnavi,.title,.story_lead,.staff_name,#pre_regist,#regist,#regist,#title01,
#contents_title{
	white-space: nowrap;
	font: 0/0 a;
	text-shadow: none;
	color: transparent;
}

.small{
	font-size: 70% !important;
}

.fullscreen {
	min-height: 100vh;
	overflow: hidden;
}

header,header .fullscreen {
	min-height: 60px !important;
}

footer,footer .fullscreen {
	min-height: 420px !important;
}

article{
	width: 100% !important;
}

.movie_block {
	display: block;
	width: 100%;
	border-top: solid 7px #9BE2FE !important;
	float: left;
	clear: both;
}
#story_area {
	border-top: solid 7px #99763B !important;
}
#character_area {
	border-top: solid 7px #87C3C3 !important;
}
#staff_area {
	border-top: solid 7px #fff !important;
}

.cover {
	margin: 0;
	padding: 0;
}

.cover:first-child .fullscreen {
	max-height: 100%;
}

.cover.fullscreen {
	height: auto;
	padding: 0;
}

.parallax-section {
	padding-top: 0;
	padding-bottom: 0;
	border: 0;
}

section p,section h2 {
	margin: 0;
	padding: 0;
}

article{
	display: block;
	float: left;
	clear: both;
}

img{
	display:block;
	max-width:100%;
	height: auto;
	margin: 0 auto 0 auto;
}

img{
	border:0;
	border-style:none;
}

a img {
	border:0;
   border-style:none;
}

html{
	height:100%;
}

body{
	width:100%;
	height:100%;
	background-image: url(../images/spbg.png);
	background-position: top center;
	background-repeat: repeat-y;
	background-size: 100% 100%;
	background-color: #000;
	margin:0;
	padding: 0;
}

#movie,#story,#character,#staff{
	display: block;
	width: 100%;
	height: 0;
	float: left;
	clear: both !important;
}

ol,ul {
	list-style:none;
	margin: 0;
	padding: 0;
}


/* レイアウト */
#wrapper{
	display:block;
	width:100%;
	height:100%;
	background-color: #000;
	background-image: url(../images/spbg.png);
	background-position: top center;
	background-repeat: repeat-y;
	background-size: 100% 100%;
	padding: 0;
	margin:0;
	float:left;
	clear:both;
}

#logo{
	display:block;
	width:100%;
	height:70px;
	background-image: url("../images/logo.png");
	background-position:center center;
	background-repeat: no-repeat;
	background-size: auto 90%;
	float: left !important;
}

#logo2{
	display:block;
	width:100%;
	height:100px;
	zoom:0.7;
	background-image: url("../images/logo2.png");
	background-position:center center;
	background-repeat: no-repeat;
	float: left !important;
}

.copyright{
	display:block;
	width:98%;
	height:auto;
	text-align:center;
	color: #fff !important;
	font-size:10px;
	padding: 20px 1%;
	margin:0 0 0 0;
	float: left;
	clear: both;
}

#topimg{
	display: block;
	min-width: 100%;
	width: 100%;
	min-height: 320px; 
	overflow: hidden;
	padding: 0;
	float: left;
	clear: both:
}

.title{
	display: block;
	width: 100%;
	zoom:0.8;
	background-position: center center;
	background-repeat: no-repeat;
	float: left;
	clear: both;
}

#title02{
	height: 130px;
	background-image: url(../images/title02.png);
	background-position: center center !important;
	margin-top: 30px !important;
}
#title03{
	height: 130px;
	background-image: url(../images/title03.png);
}
#title04{
	height: 130px;
	background-image: url(../images/title04.png);
}
#title05{
	height: 130px;
	background-image: url(../images/title05.png);
}
#title06{
	height: 130px;
	background-image: url(../images/title06.png);
}

/* ナビ */
#fnavi{
	display: block;
	width: 100%;
	text-align: center;
	float: left;
	clear: both;
}

#fnavi a{
	color: #fff;
}

#fnavi a:hover{
	text-decoration: none;
}

.movie_block iframe{
	display:block;
	width: 90%;
	height: 220px;
	margin: 0 5% 30px 5% !important;
	float: left;
	clear: both;
}

/* キャラクター */
.character_img{
	display:block;
	width: 100%;
	height: auto;
	margin: 0 0 20px 0;
	float: left !important;
	clear: both;
}

.character_img ul{
	display: block;
	width: 97% !important;
	height: auto;
	margin: 0 1% 0 2%;
	float: left;
	clear: both;
}

.character_img ul li{
	display: block;
	width: 30%;
	height: auto;
	border: solid 1px #fff;
	margin: 1%;
	float: left !important;
}


.character_img ul li img{
	display: block;
	width: 100%;
	height: auto;
}

/* ヴィジョンズ */
.visions_block{
	display:block;
	width:92%;
	margin: 0 3% 0 5%;
	float: left !important;
	clear: both;
}

.visions_block ul{
	display: block;
	width: 100%;
	margin: 0 auto 0 auto;
	float: left;
	clear: both;
}

.visions_block ul li{
	display: block;
	width: 31%;
	margin: 0 1% 20px 1%;
	float: left;
}

/* ニュース */
.news_block{
	display: block;
	width: 100%;
	height: auto;
	margin: 0 auto;
	float: left;
	clear: both;
}

.news_area{
	display: block;
	width: 96% !important;
	height: auto !important;
	background-color: #000;
	background-image: url(../images/sp_news_bg.png);
	background-position: top center;
	background-repeat: no-repeat;
	background-size: 100% auto;
	padding: 65px 0 5px 0;
	margin: 15px 2% 0 2%;
	float: left;
	clear: both;
}

.twitter-timeline{
	display: block;
	width: 90% !important;
	height: 380px !important;
	padding: 0 0 0 0;
	margin: 20px 5% 15px 5% !important;
	float: left;
	clear: both;
}

.news_area dl{
	display: block;
	width: 94%;
	height: 300px !important;
	margin: 0 3%;
	overflow-x: hidden;
	overflow-y: scroll;
}


.news_area .topics{
	display: block;
	width: 100%;
	clear: both;
}

.news_area .topics .img_area{
	display: block;
	width: 19%;
	min-height: 35px !important;
	background-image:url(../images/headline_img.png);
	background-position:top center;
	background-repeat: no-repeat;
	background-size: 100% auto;
	border: solid 2px #99E5FF;
	margin: 0 10px 15px 0;
	float: left;
}

.news_area dt{
	display: block;
	width: 75%;
	font-size: 70%;
	line-height: 125%;
	color: #fff;
	margin-bottom: 3px;
	float: right;
}

.news_area dt strong{
	display: block;
	clear: both;
}

.news_area dt a{
	color: #fff;
}

.news_area dt a:hover{
	text-decoration: none;
}

.news_area dd{
	display: block;
	width: 75%;
	font-size: 60%;
	line-height: 150%;
	color: #ccc;
	margin-bottom: 15px;
	float: right;
}

/* 事前登録 */
#pre_regist{
	display: none;
	position:fixed;
	width: 100%;
	height: 180px;
	background-image:url(../images/pre_regist_bg.png);
	background-position:bottom center;
	background-repeat: no-repeat;
	background-size: 100% auto;
	right: 0;
	left: 0;
	bottom:0;
	z-index: 1000 !important;
}
#regist{
	display: none;
	position:fixed;
	width: 100%;
	height: 180px;
	background-image:url(../images/haishin_bg.png);
	background-position:bottom center;
	background-repeat: no-repeat;
	background-size: 100% auto;
	right: 0;
	left: 0;
	bottom:0;
	z-index: 1000 !important;
}

#pre_regist ul,#regist ul{
	display: block;
	position: absolute;
	width: 90%;
	margin: 0 5% 0 5%;
	bottom:18px !important;
}

#pre_regist li,#regist li{
	display: block;
	width: 50% !important;
	float: left;
}

#pre_regist li img,#regist li img{
	display: block;
	width: 100% !important;
	height: auto;
	float: left !important;
}

#contents_title{
	display: block;
	width: 100%;
	height: 120px;
	zoom:0.6;
	text-align: center;
	background-image: url(../images/contents_title_bg.jpg);
	background-position: top right;
	background-repeat: no-repeat;
	background-attachment: fixed;
	background-color: #000;
	border-top: solid 3px #fff;
	border-bottom: solid 1px #666;
	margin-bottom: 30px !important;
	float: left;
	clear: both;
}

.title_news{
	display: block;
	width: 100%;
	height: 120px;
	background-image: url(../images/title_news.png);
	background-position: center center;
	background-repeat: no-repeat;
}

.title_system{
	display: block;
	width: 100%;
	height: 120px;
	background-image: url(../images/title_system.png);
	background-position: center center;
	background-repeat: no-repeat;
}

.title_press{
	display: block;
	width: 100%;
	height: 120px;
	background-image: url(../images/title_press.png);
	background-position: center center;
	background-repeat: no-repeat;
}

#news_text{
	display: block;
	width: 90%;
	color: #fff !important;
	font-size: 70%;
	line-height: 180%;
	margin: 0 5%;
	float: left;
	clear: both;
}

#news_text p{
	margin-bottom: 20px;
}

#news_text h3{
	font-size: 20px;
	line-height: 150%;
	margin-bottom: 10px;
}

#news_text .date{
	display: block;
	width: 100%;
	font-size: 60%;
	line-height: 150%;
	text-align: right;
	margin-bottom: 30px;
	clear: both;
}



.headline_block{
	display: block;
	width: auto;
	height: auto;
	padding: 3%;
	margin: 0 0 15px 0;
	border: solid 2px #83B7B6;
	border-radius: 8px;        /* CSS3草案 */  
    -webkit-border-radius: 8px;    /* Safari,Google Chrome用 */  
    -moz-border-radius: 8px;   /* Firefox用 */ 
	float: left;
	clear: both;
}

.headline_wrapper{
	display: block;
	width: auto;
	margin: 0 5% 30px 5%;
	float: left;
	clear: both;
}

.headline_area{
	display: block;
	width: auto;
	float: left;
	clear: both;
}

#news_text{
	word-break: break-all;
}

.headline_img{
	display: block;
	width: auto;
	max-width: 100%;
	min-height: 120px;
	background-image:url(../images/headline_img.png);
	background-position:top center;
	background-repeat: no-repeat;
	margin: 0 auto !important;
	float: none;
	clear: both;
}
.headline_img img{
	display: block;
	width: 100%;
	height: auto;
	max-height: 180px;
}
.headline_title{
	font-size: 70% !important;
	line-height: 150%;
	font-weight: bolder;
	margin-top: 10px !important;
	margin-bottom: 10px !important;
}
.headline_title a{
	color: #fff;
}

.headline_title a:hover{
	text-decoration: none;
	color: #fff;
}

.headline_lead{
	font-size: 70% !important;
	line-height: 160%;
	color: #9FE6E4;
}

article h3{
	display: block;
	width: 96%;
	color: #FFF;
	background-color: #30C4BA;
	font-weight: normal;
	font-size: 90%;
	letter-spacing: 0;
	line-height: 120%;
	background-size: auto 90%;
	padding: 5px 2% 3px 2%;
	margin: 0 0 35px 0 !important;
	float: left;
	clear: both;
}

.link_list{
	margin-bottom: 30px !important;
	float: left;
	clear: both !important;
}

.link_list li{
	color: #fff;
	font-size: 80%;
	margin-bottom: 15px;
}

.link_list a{
	color: #fff;
}

.link_list a:hover{
	text-decoration: none;
}

.headline_wrapper a{
	color: #87C3C3 !important;
}

.headline_wrapper a:hover{
	text-decoration: none;
}

pager */
.pager{
	display:block;
	width:100%;
	height:50px;
	text-align:center !important;
	font-size:10px;
	margin:15px 0 0 0;
	float:left;
	clear:both;
}

a.page-numbers,
.pager .current{
	border:solid 1px #83B7B6;
	background:#fff;
	border-radius:3px;
	padding:3px 5px;
	margin:0 1px;
}
.pager .current{
	border:solid 1px #83B7B6;
	background:#83B7B6;
	color:#000;
}
.pager a{
	color:#000;
}

.post-navigation{
	display: block;
	width:240px;
	text-align: center !important;
	margin-top: 100px !important;
	margin: 100px auto 0 auto;
	overflow: auto;
	clear: both !important;
}

.prev_bt,.next_bt{
	display: block;
	width: 120px;
	text-align: center;
	float: left;
}