@charset "UTF-8";

@media screen and (max-width:750px) { 

body {
	font-size: 14px;
	font-size: 1.9vw;
	font-weight: 500;
	font-family: "游ゴシック体", "Yu Gothic", YuGothic,"メイリオ","Meiryo","ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック","MS PGothic", sans-serif;
}
.pc {
	display: none!important;
}
.sp {
	display: block!important;
}
a {
	color: #000;
}


.clear {
	clear: both;
}

html,body {
	background: #000;
}
#wrapper {
	background: #fff;
}
#wrapper.top {
	opacity: 1;
}
#wrapper.top.off {
	opacity: 0;
}
#loading {
	opacity: 0;
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	display: none;
	z-index: -1;
}
#loading div.logo {
	position: absolute;
	top: 50%;
	left: 0;
	width: 750px;
	width: 100.0vw;
	height: 375px;
	height: 50.0vw;
	z-index: 2;
	margin: -188px 0 0;
	margin: -25.1vw 0 0;
	background: url(../images/loading_sp.gif) no-repeat;
	background-size: 750px 375px;
	background-size: 100.0vw 50.0vw;
	text-indent: -9999px;

	-webkit-transition: opacity 0.2s linear;
	-o-transition: opacity 0.2s linear;
	transition: opacity 0.2s linear;
}
#loading div.logo.off {
	opacity: 0;
}

#page-header h1 {
	display: none;
}
#contentsBody h1 {
	width: 311px;
	width: 41.5vw;
	position: absolute;
	top: 67px;
	top: 8.9vw;
	left: 17px;
	left: 2.3vw;
	z-index: 302;
}
#contentsBody h1 a {
	display: block;
	width: 311px;
	width: 41.5vw;
	height: 102px;
	height: 13.6vw;
	text-indent: -9999px;
	background: url(../images/logo_sp.png) no-repeat;
	background-size: 311px 102px;
	background-size: 41.5vw 13.6vw;
}

#contentsBody {
	position: relative;
	width: 100%;
}
#contentsBody .contents_bottom {
	position: absolute;
	bottom: -1px;
	bottom: -0.1vw;
	left: 0;
	line-height: 0;
}
#container {
}

#contentsBody .information_text {
	position: absolute;
	top: 73px;
	top: 9.7vw;
	right: 142px;
	right: 18.9vw;
	font-family: "Noto Sans JP",sans-serif;
	font-size: 28px;
	font-size: 3.7vw;
	font-weight: 900;
	line-height: 1.4;
	letter-spacing: -0.05em;
	text-align: left;
	z-index: 302;
}
#contentsBody .information_text a {
	text-decoration: none;
}
#contentsBody .information_text img {
	width: 24px;
	width: 3.2vw;
	height: auto;
	margin: 0 0 0 3px;
	margin: 0 0 0 0.4vw;
	vertical-align: inherit;
}

/*---- header ----*/
#page-header {
	position: absolute;
	top: 0;
	width: 100%;
}
#page-header > .line {
	position: fixed;
	top: 0;
	z-index: 300;
	width: 100%;
	height: 10px;
	height: 1.3vw;
	background: #000;
}
#menu_open {
	position: fixed;
	top: 0;
	right: 0;
	z-index: 301;
	width: 125px;
	width: 16.7vw;
	height: 126px;
	height: 16.8vw;
	background: url(../images/btn_menu_sp.png) no-repeat;
	background-size: 125px 126px;
	background-size: 16.7vw 16.8vw;
	text-indent: -9999px;
}
#page-header .contents_top {
	position: fixed;
	top: 9px;
	top: 1.2vw;
	z-index: 300;
	left: 0;
	line-height: 0;
}
#page-header .inner {
}
#page-header #menu {
	background: #000;
	width: 100%;
	position: absolute;
	top: -101vh;
	left: 0;
	z-index: -10;

	-webkit-transition: top .3s linear;
	-moz-transition: top .3s linear;
	-ms-transition: top .3s linear;
	transition: top .3s linear;
}
#page-header #menu.on {
	top: 0;
}

#page-header #menu .menu_inner {
	position: relative;
	padding: 109px 0 120px;
	padding: 14.5vw 0 16.0vw;

	opacity: 0;
	-webkit-transition: opacity .3s linear;
	-moz-transition: opacity .3s linear;
	-ms-transition: opacity .3s linear;
	transition: opacity .3s linear;
}
#page-header #menu .menu_inner.on {
	opacity: 1;
}
#page-header #menu .menu_inner .menu_footer {
	position: absolute;
	bottom: -79px;
	bottom: -10.5vw;
	left: 0;
	line-height: 0;
}
#page-header #menu h2.menu_title {
	width: 461px;
	width: 61.5vw;
	margin: 0 auto 0;
}
#page-header #menu h2.menu_title a {
	display: block;
	width: 461px;
	width: 61.5vw;
	height: 151px;
	height: 20.1vw;
	text-indent: -9999px;
	background: url(../images/menu/menu_logo_sp.png) no-repeat;
	background-size: 461px 151px;
	background-size: 61.5vw 20.1vw;
}
#page-header #menu .menu_inner > ul.menu1 {
	width: 490px;
	width: 65.3vw;
	margin: 40px auto 25px;
	margin: 5.3vw auto 3.3vw;
	border-bottom: #fff 2px solid;
	border-bottom: #fff 0.3vw solid;
}
#page-header #menu .menu_inner > ul.menu2 {
	margin: 38px auto 0;
	margin: 5.1vw auto 0;
	width: 490px;
	width: 65.3vw;
}
#page-header #menu .menu_inner > ul li {
	color: #fff;
	margin: 0 auto 14px;
	margin: 0 auto 1.9vw;
	width: 490px;
	width: 65.3vw;
	height: 40px;
	height: 5.3vw;
}
#page-header #menu .menu_inner > ul.menu2 li {
	margin: 0 auto 27px;
	margin: 0 auto 3.6vw;
}
#page-header #menu .menu_inner > ul li a {
	display: block;
	width: 100%;
	height: 100%;
	text-indent: -9999px;
	color: #fff;
	text-decoration: none;
}
#page-header #menu .menu_inner > ul li.product.cs {
	background: url(../images/menu/menu_product_sp.png) no-repeat;
	background-size: 490px 40px;
	background-size: 65.3vw 5.3vw;
	text-indent: -9999px;
	opacity: 0.5;
}
#page-header #menu .menu_inner > ul li.top a {
	background: url(../images/menu/menu_top_sp.png) no-repeat;
	background-size: 490px 40px;
	background-size: 65.3vw 5.3vw;
}
#page-header #menu .menu_inner > ul li.news a {
	background: url(../images/menu/menu_news_sp.png) no-repeat;
	background-size: 490px 40px;
	background-size: 65.3vw 5.3vw;
}
#page-header #menu .menu_inner > ul li.story a {
	background: url(../images/menu/menu_story_sp.png) no-repeat;
	background-size: 490px 40px;
	background-size: 65.3vw 5.3vw;
}
#page-header #menu .menu_inner > ul li.character a {
	background: url(../images/menu/menu_character_sp.png) no-repeat;
	background-size: 490px 40px;
	background-size: 65.3vw 5.3vw;
}
#page-header #menu .menu_inner > ul li.staffcast a {
	background: url(../images/menu/menu_staffcast_sp.png) no-repeat;
	background-size: 490px 40px;
	background-size: 65.3vw 5.3vw;
}
#page-header #menu .menu_inner > ul li.movie a {
	background: url(../images/menu/menu_movie_sp.png) no-repeat;
	background-size: 490px 40px;
	background-size: 65.3vw 5.3vw;
}
#page-header #menu .menu_inner > ul li.music a {
	background: url(../images/menu/menu_music_sp.png) no-repeat;
	background-size: 490px 40px;
	background-size: 65.3vw 5.3vw;
}
#page-header #menu .menu_inner > ul li.product a {
	background: url(../images/menu/menu_product_sp.png) no-repeat;
	background-size: 490px 40px;
	background-size: 65.3vw 5.3vw;
}
#page-header #menu .menu_inner > ul li.goods a {
	background: url(../images/menu/menu_goods_sp.png) no-repeat;
	background-size: 490px 40px;
	background-size: 65.3vw 5.3vw;
}
#page-header #menu .menu_inner > ul li.onair a {
	background: url(../images/menu/menu_onair_sp.png) no-repeat;
	background-size: 490px 40px;
	background-size: 65.3vw 5.3vw;
}
#page-header #menu .menu_inner > ul li.eventcampaign a {
	background: url(../images/menu/menu_eventcampaign_sp.png) no-repeat;
	background-size: 490px 40px;
	background-size: 65.3vw 5.3vw;
}
#page-header #menu .menu_inner > ul li.theater a {
	background: url(../images/menu/menu_theater_sp.png) no-repeat;
	background-size: 490px 40px;
	background-size: 65.3vw 5.3vw;
}
#page-header #menu .menu_inner > ul li.official a {
	background: url(../images/menu/menu_official_sp.png) no-repeat;
	background-size: 490px 40px;
	background-size: 65.3vw 5.3vw;
}
#page-header #menu .menu_inner > ul li.twitter a {
	background: url(../images/menu/menu_twitter_sp.png) no-repeat;
	background-size: 490px 40px;
	background-size: 65.3vw 5.3vw;
}
#page-header .language_area {
    position: absolute;
    top: 0;
	left: 18px;
	left: 2.4vw;
}
#page-header .language_area ul li {
	display: inline-block;
	position: relative;
	width: 91px;
	width: 12.1vw;
	height: 55px;
	height: 7.3vw;
}
#page-header .language_area ul li + li {
	margin: 0 0 0 11px;
	margin: 0 0 0 1.5vw;
}
#page-header .language_area ul li.jp {
	background: url(../images/menu/menu_jp_sp.png) no-repeat;
	background-size: 91px 55px;
	background-size: 12.1vw 7.3vw;
}
/*
#page-header .language_area ul li.jp:hover {
	background: url(../images/menu/menu_jp_no_sp.png) no-repeat;
	background-size: 91px 55px;
	background-size: 12.1vw 7.3vw;
}
*/
#page-header .language_area ul li.en {
	background: url(../images/menu/menu_en_no_sp.png) no-repeat;
	background-size: 91px 55px;
	background-size: 12.1vw 7.3vw;
}
/*
#page-header .language_area ul li.en:hover {
	background: url(../images/menu/menu_en_sp.png) no-repeat;
	background-size: 91px 55px;
	background-size: 12.1vw 7.3vw;
}
*/

#page-header .share_area {
	margin: 87px auto 0;
	margin: 11.6vw auto 0;
}
#page-header .share_area h3.title {
	margin: 0 auto 0;
	width: 79px;
	width: 10.5vw;
	height: 17px;
	height: 2.3vw;
	background: url(../images/header_share_title_sp.png) no-repeat left center;
	background-size: 79px 17px;
	background-size: 10.5vw 2.3vw;
	text-indent: -9999px;
}
#page-header .share_area ul {
	margin: 28px auto 0;
	margin: 3.7vw auto 0;
	text-align: center;
}
#page-header .share_area ul li {
	display: inline-block;
	vertical-align: top;
	width: 85px;
	width: 11.3vw;
	height: 85px;
	height: 11.3vw;
}
#page-header .share_area ul li + li {
	margin: 0 0 0 54px;
	margin: 0 0 0 7.2vw;
}
#page-header .share_area ul li a {
	display: block;
	width: 100%;
	height: 100%;
	text-indent: -9999px;
}
#page-header .share_area ul li.tw {
	background: url(../images/header_share_tw_sp_off.png) no-repeat;
	background-size: 85px 85px;
	background-size: 11.3vw 11.3vw;
}
#page-header .share_area ul li.tw:hover {
	background: url(../images/header_share_tw_sp_on.png) no-repeat;
	background-size: 85px 85px;
	background-size: 11.3vw 11.3vw;
}
#page-header .share_area ul li.fb {
	background: url(../images/header_share_fb_sp_off.png) no-repeat;
	background-size: 85px 85px;
	background-size: 11.3vw 11.3vw;
}
#page-header .share_area ul li.fb:hover {
	background: url(../images/header_share_fb_sp_on.png) no-repeat;
	background-size: 85px 85px;
	background-size: 11.3vw 11.3vw;
}
#page-header .share_area ul li.line {
	background: url(../images/header_share_line_sp_off.png) no-repeat;
	background-size: 85px 85px;
	background-size: 11.3vw 11.3vw;
}
#page-header .share_area ul li.line:hover {
	background: url(../images/header_share_line_sp_on.png) no-repeat;
	background-size: 85px 85px;
	background-size: 11.3vw 11.3vw;
}

/*---- footer ----*/
#page-footer {
	position: relative;
}
#page-footer .inner {
	padding: 56px 0 60px 0;
	padding: 7.5vw 0 8.0vw 0;
	background-color: #000;
	text-align: center;
	color: #fff;
	font-size: 18px;
	font-size: 2.4vw;
}
#totop {
	position: absolute;
	bottom: 28px;
	bottom: 3.7vw;
	right: 18px;
	right: 2.4vw;
	z-index: 10;
	width: 90px;
	width: 12.0vw;
	height: 90px;
	height: 12.0vw;
}
#totop a {
	display: block;
	width: 100%;
	height: 100%;
	background: url(../images/btn_pagetop_sp.png) no-repeat;
	background-size: 90px 90px;
	background-size: 12.0vw 12.0vw;
	text-indent: -9999px;
}

/* .image img */
.image img {
	width: 100%;
	height: auto;
}

/* movie ico */
.movie_thumb {
	position: relative;
	cursor: pointer;
}
.movie_thumb .image {
	position: relative;
}
.movie_thumb .ico_arr {
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -72px 0 0 -72px;
	margin: -9.6vw 0 0 -9.6vw;
	width: 144px;
	width: 19.2vw;
	height: 144px;
	height: 19.2vw;
	border: #fff 1px solid;
	border: #fff 1px solid;
	border-radius: 50%;
	background: rgba(0, 0, 0, 0.2);
	-webkit-transform: scale(0.9);
	-ms-transform: scale(0.9);
	-o-transform: scale(0.9);
	transform: scale(0.9);
	-webkit-transition: all 0.3s linear;
	-o-transition: all 0.3s linear;
	transition: all 0.3s linear;
}
.movie_thumb:hover .ico_arr {
	background: rgba(0, 0, 0, 0.8);
	-webkit-transform: scale(1);
	-ms-transform: scale(1);
	-o-transform: scale(1);
	transform: scale(1);
}
.movie_thumb .play_ico {
	position: absolute;
	top: 50%;
	left: 50%;
	margin: -19px 0 0 -16px;
	margin: -2.5vw 0 0 -2.1vw;
	width: 32px;
	width: 4.3vw;
	height: 39px;
	height: 5.2vw;
	background: url(../images/ico_movie_play_sp.png) no-repeat;
	background-size: 32px 39px;
	background-size: 4.3vw 5.2vw;
}


/*------- pagination --------*/
.btn_backindex {
	margin: 96px auto 0;
	margin: 12.80vw auto 0;
	text-align: center;
}
.btn_backindex a {
	display: inline-block;
	text-decoration: none;
	font-size: 28px;
	font-size: 3.73vw;
	line-height: 54px;
	line-height: 7.20vw;
	color: #fff;
	background-color: #000;
	height: 54px;
	height: 7.20vw;
	padding: 0 32px;
	padding: 0 4.27vw;
}

.pagination_area {
	text-align: center;
}
.pagination_area {
	margin: 96px auto 0;
	margin: 12.8vw auto 0;
}
.pagination_area ul li {
	display: inline-block;
	position: relative;
	vertical-align: top;
}
.pagination_area ul li + li {
	margin: 0 0 0 19px;
	margin: 0 0 0 2.5vw;
}
.pagination_area ul li a {
	display: block;
	text-decoration: none;
	font-size: 28px;
	font-size: 3.7vw;
	color: #fff;
	background-color: #000;
	width: 54px;
	width: 7.2vw;
	height: 54px;
	height: 7.2vw;
	line-height: 54px;
	line-height: 7.2vw;
}
.single-news .pagination_area ul li.index a {
	width: auto;
	padding: 0 32px;
	padding: 0 4.3vw;
}
.pagination_area ul li.prev a,
.pagination_area ul li.next a {
	width: 117px;
	width: 15.6vw;
}
.pagination_area ul li span.current {
	display: block;
	font-size: 28px;
	font-size: 3.7vw;
	color: #fff;
	background-color: #9fa9b7;
	width: 54px;
	width: 7.2vw;
	height: 54px;
	height: 7.2vw;
	line-height: 54px;
	line-height: 7.2vw;
}
.pagination_area ul li.prev {
	margin: 0px 5px 0 0;
	margin: 0 0.7vw 0 0;
}
.pagination_area ul li.next {
	margin: 0 0 0 24px
	margin: 0 0 0 3.2vw
}

/* popup */
#popup_close {
	position: absolute;
	top: 0;
	right: 0;
	width: 126px;
	width: 16.8vw;
	height: 127px;
	height: 16.9vw;
	background: url(../images/btn_popup_sp_off.png) no-repeat;
	background-size: 126px 127px;
	background-size: 16.8vw 16.9vw;
	text-indent: -9999px;
}
#popup_close:hover {
	background: url(../images/btn_popup_sp_on.png) no-repeat;
	background-size: 126px 127px;
	background-size: 16.8vw 16.9vw;
}
.popup_movie_area {
	display: none;
}


} /* @media screen end */

