@charset "utf-8";

/*================================================
PC：インデックスヘッダーレイアウト
================================================*/
@media screen and (min-width: 737px){
#header_index {
	background: url(../img/top/head-bg_1stAniv.jpg) center top no-repeat;/*デフォルトはhead-bg_.jpg*/
	margin: 0 auto;
	height: 760px;
	text-align: center;
	position: relative;
}
#head-inner_index {
	margin: 0 auto;
	width: 960px;
	/*height: 646px;*/
	/*height: 906px;*/
	position: relative;
}
#head-inner_index h1 {
	background: url(../img/top/logo.png) center no-repeat;
	width: 593px;
	height: 281px;
	text-indent: -99999em;
	position: absolute;
	top: 65px;
	left: 0px;
}
/*アイコン設定*/
#head-inner_index .pcBnr img.icon-head {
	position: absolute;
	top: 20px;
	right: 20px;
}
.spBnr img.icon-head {
	display: none;
}
#head-inner_index h2 {
	background: url(../img/top/title-sub-pc_.png) center no-repeat;
	width: 507px;
	height: 147px;
	text-indent: -99999em;
	position: absolute;
	top: 470px; /*バナー無　600px*/ /*バナー有り　470px*/
	left: 400px;
}
#contents #bnrArea{
	position: absolute;
	top: -140px;
	left: 420px;
	}
#contents #bnrArea .bnrNew{
	position: absolute;
	top: 0px;
	left: 0px;}
#area-top_movie {
	position: absolute;
	top: 350px;
	left: 80px;
}
#area-top_movie_sp {
	display:none;
}
#area-twnav{
	width: 960px;
	margin: 0 auto;
	position: relative;
	}
#area-timeline {
	background: url(../img/top/bg-timeline.png) center no-repeat;
	width: 370px;
	height: 260px;
	position: absolute;
	top: -270px;
	left: 0px;
}
#area-timeline h3 {
	background: url(../img/top/title-twitter.png) left center no-repeat;
	margin: 20px 0 0 10px;
	width: 88px;
	height: 22px;
	text-indent: -9999em;
	float: left;
}
#area-timeline #area-follow {
	margin: 15px 10px 0 0;
	height: 32px;
	float: right;
}
.tweet-contenter {
	margin: 0 10px 0 10px;
	width: 350px;
	height: 200px !important;
	font-size: 10px;
	line-height: 1.4em;
	overflow: hidden;
}


/*banner*/
/*#Bnr ul{
  display: -webkit-box;
  display: -moz-box;
  width: 100%;
  margin: 0 auto;
  text-align: center;
  padding: 3px 0;
}*/
#Bnr li{
  display: inline-block;
  width: 32%;
  position: relative;
}
#Bnr{
	position: relative;
	padding: 5px 0 0px;
	}
#Bnr img{
	max-width: 100%;
	}
#Bnr .bnrNew{
	position: absolute;
	top: -5px;
	left: 0px;
	width: 60px;
	height: 44px;
	}
}
/*================================================
SP：インデックスヘッダーレイアウト：736
================================================*/
@media screen and (max-width:736px){
#header_index {
	background: url(../img/common/head-bg-sp__1stAniv.jpg) center top no-repeat;/*デフォルトはhead-bg-sp__.jpg*/
	background-size: contain;
	width: 100%;
	text-align: center;
	/*float:left;*/
	height: 0;
	padding-top: 99.2%;

}
#head-inner_index {
	/*margin: 0 auto;
	width: 100%;
	position: relative;*/
}
#head-inner_index h1 {
	background: none;
	width: 100%;
	text-indent: -99999em;
}
#head-inner_index h1 a {
	display: block;
	width: 100%;
}
/*アイコン設定*/
#head-inner_index .pcBnr img.icon-head {
	display: none;
}
#contents #bnrArea{
	position: relative;
	}
#contents #bnrArea .bnrNew{
	position: absolute;
	top: 0;
	left: 5%;
	width: 13%;
	}
#bnrArea img{
	width: 90%;
}
.spBnr img.icon-head {
	width: 90%;
}
#head-inner_index h2 {
	text-indent: -99999em;
}
#area-top_movie {
	display:none;
}
#area-top_movie_sp {
	/*margin: 38em 0 1em 0;*/
}
#area-top_movie_sp img.pv {
	width: 38%;
	height: 3.3%;
	position: absolute;
	top: 7.7%;
	left: 8%;
}
#area-timeline {
	margin-top: 1em;
	margin-bottom: 1em;
}
.tweet-head {
	background: url(../img/common/bg-paper_head-sp.jpg) center top no-repeat;
	background-size: contain;
	padding-top: 7em;
}
.tweet-body {
	background: url(../img/common/bg-paper_body-sp.jpg) center top repeat-y;
	background-size: contain;
}
.tweet-foot {
	background: url(../img/common/bg-paper_foot-sp.jpg) center bottom no-repeat;
	background-size: contain;
	padding-bottom: -4em;
}
#area-timeline h3 {
	background: url(../img/top/title-twitter.png) left center no-repeat;
	margin: -5em 0 0.5em 2em;
	width: 88px;
	height: 22px;
	text-indent: -9999em;
	float: left;
}
#area-timeline #area-follow {
	margin: -5em 2em 0 0;
	height: 32px;
	float: right;
}
.tweet-contenter {
	margin: -2em 103px 4em 103px;
	padding: 0 auto 4em auto;
	width: 515px !important;
	font-size: 0.8em;
	line-height: 1.2em;
	text-align: left;
	overflow: hidden;
}


/*banner*/
/*#Bnr ul{
  display: -webkit-box;
  display: -moz-box;
  width: 100%;
  margin: 0 auto;
  text-align: center;
  padding: 3px 0;
}*/
#Bnr li{
  display: inline-block;
  width: 48%;
  position: relative;
}
#Bnr{
	position: relative;
	padding: 5px 0 0px;
	}
#Bnr img{
	max-width: 100%;
	}
#Bnr .bnrNew{
	position: absolute;
	top: 0;
	left: 0px;
	width: 10%;
	}
	
}
/*================================================
SP：インデックスヘッダーレイアウト:667;
================================================*/
@media screen and (max-width:667px){
#area-top_movie_sp {
	/*margin: 36em 0 1em 0;*/
}
#area-timeline h3 {
	margin: -5em 0 0.5em 1.5em;
}
.tweet-contenter {
	margin: -2em 76px 4em 76px;
	width: 500px !important;
}
}
/*================================================
SP：インデックスヘッダーレイアウト：640
================================================*/
@media screen and (max-width:640px){
/*アイコン設定*/
#head-inner_index .pcBnr img.icon-head {
	display: none;
}
#bnrArea img{
	max-width: 90%;
}
.spBnr img.icon-head {
	max-width: 90%;
}
#area-top_movie_sp {
	/*margin: 20em 0 1em 0;*/
}
}
/*================================================
SP：インデックスヘッダーレイアウト：568
================================================*/
@media screen and (max-width:568px){
#area-top_movie_sp {
	/*margin: 31em 0 1em 0;*/
}
.tweet-contenter {
	margin: -2em 30px 3em 30px;
	width: 493px !important;
}
}
/*================================================
SP：インデックスヘッダーレイアウト：480
================================================*/
@media screen and (max-width:480px){
#area-top_movie_sp {
	/*margin: 26em 0 1em 0;*/
}
.tweet-contenter {
	margin: 1em 30px 2em 30px;
	width: 405px !important;
}
}
/*================================================
SP：インデックスヘッダーレイアウト：414
================================================*/
@media screen and (max-width:414px){
#area-top_movie_sp {
	/*margin: 22em 0 1em 0;*/
}
.tweet-contenter {
	margin: -4em 40px 2em 40px;
	width: 334px !important;
}
}
/*================================================
SP：インデックスヘッダーレイアウト：375
================================================*/
@media screen and (max-width:375px){
#area-top_movie_sp {
	/*margin: 19em 0 1em 0;*/
}
.tweet-head {
	padding-top: 6em;
}
#area-timeline h3 {
	margin: -4em 0 0.5em 1.5em;
}
#area-timeline #area-follow {
	margin: -4em 2em 0 0;
}
.tweet-contenter {
	margin: -3em 40px 2em 40px;
	width: 295px !important;
}
}
/*================================================
SP：インデックスヘッダーレイアウト：320
================================================*/
@media screen and (max-width:320px){
#area-top_movie_sp {
	/*margin: 16em 0 1em 0;*/
}
.tweet-head {
	padding-top: 5em;
}
#area-timeline h3 {
	margin: -2em 0 0.5em 0;
}
#area-timeline #area-follow {
	margin: -3em 2em 0 0;
}
.tweet-contenter {
	margin: -4em 30px 2em 30px;
	width: 260px !important;
}
}
/*================================================
PC：SPECレイアウト；737
================================================*/
@media screen and (min-width:737px){
#area-spec {
	background: url(../img/top/bg-spec.jpg) center 10px no-repeat;
	margin-bottom: 50px;
}
.inner-spec {
	margin: 0 auto;
	width: 960px;
}
.inner-spec h1 {
	background: url(../img/top/title-spec.png) center no-repeat;
	padding-top: 22px;
	width: 366px;
	height: 134px;
	text-indent: -99999em;
}
.inner-spec h1.no_nav {
	padding-top: 22px;
}
.detail-spec {
	margin: -144px 100px 30px 100px;
	width: 760px;
	position: relative;
}
.detail-spec .icon-app {
	float: left;
}
.detail-spec table {
	width: 560px;
	float: right;
}
.detail-spec table th {
	padding-bottom: 10px;
	width: 160px;
	height: 48px;
	text-indent: -99999em;
}
.detail-spec table th.spec-th_title {
	background: url(../img/top/spec-th_title.png) center top no-repeat;
}
.detail-spec table th.spec-th_genre {
	background: url(../img/top/spec-th_genre.png) center top no-repeat;
}
.detail-spec table th.spec-th_price {
	background: url(../img/top/spec-th_price.png) center top no-repeat;
}
.detail-spec table th.spec-th_delivery {
	background: url(../img/top/spec-th_delivery.png) center top no-repeat;
}
.detail-spec table th.spec-th_terminal {
	background: url(../img/top/spec-th_terminal.png) center top no-repeat;
}
.detail-spec table td {
	width: 400px;
	text-indent: -9999em;
}
.detail-spec table td.and_text {
	display: none;
}
.detail-spec table td.spec-td_title {
	background: url(../img/top/spec-td_title.png) 10px 8px no-repeat;
}
.detail-spec table td.spec-td_genre {
	background: url(../img/top/spec-td_genre.png) 10px 8px no-repeat;
}
.detail-spec table td.spec-td_price {
	background: url(../img/top/spec-td_price.png) 10px 8px no-repeat;
}
.detail-spec table td.spec-td_delivery {
	background: url(../img/top/spec-td_delivery.png) 10px 8px no-repeat;
}
.detail-spec table td.spec-td_terminal {
	background: url(../img/top/spec-td_terminal.png) 10px 8px no-repeat;
	height: 140px;
}
.android_terminal {
	position: absolute;
	top: 274px;
	left: 470px;
}
}
/*================================================
SP：SPECレイアウト：736
================================================*/
@media screen and (max-width:736px){
#area-spec {
	background: none;
	margin-bottom: 1em;
	width: 100%;
	float: left;
}
.inner-spec {
	margin: 0 auto;
	width: 100%;
}
.inner-spec h1 {
	background: url(../img/top/title-spec-sp.png) center 10px no-repeat;
	background-size: 181px 67px;
	margin-bottom: -0.5em;
	padding: 5px 0 0 0;
	width: 100%;
	height: 67px;
	text-indent: -99999em;
	position: relative;
	z-index: 1000;
}
.detail-spec {
	margin: -2em 0 0 0;
	width: 100%;
	text-align: center;
}
.detail-spec .icon-app {
}
.detail-spec .icon-app img {
	display: none;
}
.detail-spec table {
	margin: 0 auto 2em auto;
	width: 90%;
	color: #000000;
	float: none;
}
.detail-spec table th {
	padding-bottom: 0.5em;
	width: 25%;
	text-indent: 0;
}
.detail-spec table th.spec-th_title {
	background: none;
}
.detail-spec table th.spec-th_genre {
	background: none;
}
.detail-spec table th.spec-th_price {
	background: none;
}
.detail-spec table th.spec-th_delivery {
	background: none;
}
.detail-spec table th.spec-th_terminal {
	background: none;
}
.detail-spec table td {
	width: 65%;
	text-indent: 0;
	text-align: left;
}
.detail-spec table td .and_text {
	display: block;
}
.detail-spec table td.spec-td_title {
	background: none;
}
.detail-spec table td.spec-td_genre {
	background: none;
}
.detail-spec table td.spec-td_price {
	background: none;
}
.detail-spec table td.spec-td_delivery {
	background: none;
}
.detail-spec table td.spec-td_terminal {
	background: none;
}
.detail-spec table td a {
	color: #017211;
	text-decoration: underline;
}
.android_terminal {
	display: none;
}
}
/*================================================
SP：SPECレイアウト
================================================*/
@media screen and (max-width:640px){
#area-spec {
	background: none;
	margin-bottom: 1em;
	width: 100%;
	float: left;
}
.inner-spec {
	margin: 0 auto;
	width: 100%;
}
.inner-spec h1 {
	background: url(../img/top/title-spec-sp.png) center 10px no-repeat;
	background-size: 181px 67px;
	margin-bottom: -0.5em;
	padding: 5px 0 0 0;
	width: 100%;
	height: 67px;
	text-indent: -99999em;
	position: relative;
	z-index: 1000;
}
.detail-spec {
	margin: -2em 0 0 0;
	width: 100%;
	text-align: center;
}
.detail-spec .icon-app {
}
.detail-spec .icon-app img {
	display: none;
}
.detail-spec table {
	margin: 0 auto 2em auto;
	width: 90%;
	color: #000000;
	float: none;
}
.detail-spec table th {
	padding-bottom: 0.5em;
	width: 25%;
	text-indent: 0;
}
.detail-spec table th.spec-th_title {
	background: none;
}
.detail-spec table th.spec-th_genre {
	background: none;
}
.detail-spec table th.spec-th_price {
	background: none;
}
.detail-spec table th.spec-th_delivery {
	background: none;
}
.detail-spec table th.spec-th_terminal {
	background: none;
}
.detail-spec table td {
	width: 65%;
	text-indent: 0;
	text-align: left;
}
.detail-spec table td .and_text {
	display: block;
}
.detail-spec table td.spec-td_title {
	background: none;
}
.detail-spec table td.spec-td_genre {
	background: none;
}
.detail-spec table td.spec-td_price {
	background: none;
}
.detail-spec table td.spec-td_delivery {
	background: none;
}
.detail-spec table td.spec-td_terminal {
	background: none;
}
.detail-spec table td a {
	color: #017211;
	text-decoration: underline;
}
.android_terminal {
	display: none;
}
}
/*================================================
PC：キャラクターレイアウト
================================================*/
@media screen and (min-width:737px){
#area-character {
	background: url(../img/character/bg-character.jpg) center 10px no-repeat;
	margin-bottom: 0px;
}
.bg-character_glay {
	/*background: url(../img/character/bg-character_glay.png) center no-repeat;*/
}
.bg-character_foot {
	/*background: url(../img/common/bg-character_foot.png) center 90% no-repeat;*/
}
.inner-character {
	margin: 0 auto;
	width: 960px;
}
.inner-character h4 {
	background: url(../img/character/title-character.png) center no-repeat;
	padding-top: 22px;
	width: 546px;
	height: 130px;
	text-indent: -99999em;
}
#bg-character_all {
	background: url(../img/character/bg-character_all.png) center top no-repeat;
	margin: -48px -10px 0 -10px;
	width: 980px;
	height: 866px;
	text-align: center;
	position: relative;
}
#bg-character_all a {
	position: absolute;
	top: 550px;
	left: 258px;
}

/*追記*/
h5{
	text-indent: -99999em;
	}
#area-point1 {
	background: url(../img/top/point1.jpg) center top no-repeat;
	height: 974px;
}
#area-point2 {
	background: url(../img/top/point2.jpg) center top no-repeat;
	height: 740px;
}
#area-point3 {
	background: url(../img/top/point3.jpg) center top no-repeat;
	height: 740px;
}
#area-point4 {
	background: url(../img/top/point4.jpg) center top no-repeat;
	height: 740px;
}
}
/*================================================
 SP：キャラクターレイアウト：736
================================================*/
@media screen and (max-width:736px){
#area-character {
	background: url(../img/character/bg-character.jpg) center 10px no-repeat;
	background-size: contain;
	width: 100%;
	/*margin-bottom: 1em;
	float: left;*/
}
.bg-character_glay {
	background: none;
}
.bg-character_foot {
	background: none;
}
.inner-character {
	margin: 0 auto;
	width: 100%;
}
.inner-character h4 {
	background: url(../img/character/title-character-sp.png) center 10px no-repeat;
	background-size: 274px 67px;
	margin-bottom: -0.5em;
	padding: 5px 0 0 0;
	width: 100%;
	height: 67px;
	text-indent: -99999em;
	position: relative;
	z-index: 1000;
}
#bg-character_all {
	background: url(../img/character/bg-character_all_sp.png) center top no-repeat;
	background-size: contain;
	/*margin: -24px 0 0 0;
	width: 100%;
	height: 1214px;
	text-align: center;*/
	position: relative;


	height: 0;
	padding-top: 165%;/*背景画像の高さ÷幅を%表記*/
}
#bg-character_all a {
	/*width: 60%;
	position: absolute;
	top: 860px;
	left: 20%;*/
}
#bg-character_all a img {
	width: 82%;
	position: absolute;
	/*top: 860px;
	left: 20%;*/

	height: 10%;

	top: 70%;
	left: 8%;
}
h5{
	text-indent: -99999em;
	}
#area-point1 {
	background: url(../img/common/point1.jpg) center top no-repeat;
	background-size: contain;
	width: 100%;
	height: 0;
	padding-top: 100%;/*背景画像の高さ÷幅を%表記*/
}
#area-point2 {
	background: url(../img/common/point2.jpg) center top no-repeat;
	background-size: contain;
	width: 100%;
	height: 0;
	padding-top: 75.1%;
}
#area-point3 {
	background: url(../img/common/point3.jpg) center top no-repeat;
	background-size: contain;
	width: 100%;
	height: 0;
	padding-top: 75.1%;
}
#area-point4 {
	background: url(../img/common/point4.jpg) center top no-repeat;
	background-size: contain;
	width: 100%;
	height: 0;
	padding-top: 75.1%;
}
}