/*////////////////////////////////////////////////////////////////////////
reset
////////////////////////////////////////////////////////////////////////*/
html {
	overflow-y: scroll;
	overflow-x: hidden;
}

html,body {
	font-size-adjust:100%;
	-webkit-font-size-adjust: 100%;
}

body,h1,h2,h3,h4,h5,h6,p,img,
hr,li,ul,dl,dt,dd{
	padding: 0;
	margin: 0;
	border: 0;
	list-style: none;
}


img{
	/*vertical-align:bottom;*/
	border:0px;
}


/*////////////////////////////////////////////////////////////////////////
基本
////////////////////////////////////////////////////////////////////////*/
html{
	height:auto;
	background-repeat:repeat-x;
	height:100%;
	background-color:#000000;
}

body{
	font-family: Arial, Helvetica, sans-serif;
	font-size-adjust:100%;
	-webkit-font-size-adjust: 100%;
	color:#000;
}

a{
	color: #fff;
	text-decoration:none;
	outline:none;
}

a:hover{
	color:#e2d6bc;
	text-decoration: none;
}

.new{
	width:27px !important;
	height:14px;
	position:absolute;
	top:40px;
	z-index:1;
	background-image:url(../img/new_.jpg);
	background-repeat:no-repeat;
}

.non{opacity:0.5;}
.txtCut{display:none;}
.txtCutNone{display:block;}

.clear{clear:both;}

.clearfix:after {
  content: "";
  clear: both;
  display: block;
}


::selection {
	color: #FFF;
	background-color: #4f3169;
	text-shadow: #5f001d 0px 0px 3px;
}
::-moz-selection {
	color: #FFF;
	background-color: #4f3169;
	text-shadow: #5f001d 0px 0px 3px;
}


/*////////////////////////////////////////////////////////////////////////
全体ボックス
////////////////////////////////////////////////////////////////////////*/
#wrapper{
	width:100%;
	height:auto;
	/*background-image:url(../img/bg.jpg);*/
	background-position:center center;
	background-repeat:no-repeat;
	background-attachment:fixed;
}

#mainBox{
	width: 100%;
	float: left;
}

#contents{
	position: relative;
}


.bgCommon{
	background-image:url(../img/bg.jpg);
	background-position:center center;
	background-repeat:no-repeat;
	background-attachment:fixed;
}

/*////////////////////////////////////////////////////////////////////////
共通
////////////////////////////////////////////////////////////////////////*/
/*---------------------------------------------
ヘッター
---------------------------------------------*/
header {
	width:100%;
	height:auto;
	background-color:#000;
	border-bottom:#bdae7f 1px solid;
	padding-top:5px;
	z-index:1;
	position:relative;
}

/*---------------------------------------------
フッター
---------------------------------------------*/
footer {
	width:auto;
	height:auto;
	padding:20px;
	text-align:center;
	background-color:#000;
	font-size:13px;
	color:#fff;
	border-top:#bdae7f 1px solid;
	position:relative;
	z-index:1;
}

footer img{
    margin-right: 15px;
	margin-bottom:15px;
}
footer a:hover img {
opacity: .5;
-webkit-opacity: .5;
-moz-opacity: .5;
filter: alpha(opacity=50);	/* IE lt 8 */
-ms-filter: "alpha(opacity=50)"; /* IE 8 */
}
 
footer a img {
-webkit-transition: opacity 0.2s ease-out;
-moz-transition: opacity 0.2s ease-out;
-ms-transition: opacity 0.2s ease-out;
transition: opacity 0.2s ease-out;
}

#backTop {
	width:50px;
	height:50px;
	background-image:url(../img/backtop.jpg);
	background-position:center center;
	position:fixed;
	bottom:25px;
	right:25px;
	z-index:150;
	cursor:pointer;
}

.text_st { font-size:15px; font-weight: bold; margin-bottom:5px;}

/*---------------------------------------------
ローディング
---------------------------------------------*/
.loading{
	width:100%;
	height:851px;
	padding-top:250px;
	background-position:center center;
	background-attachment:fixed;
	background-color:#000000;
	position:absolute;
	z-index:998;
	text-align:center;
}

.loading p{
	width:100%;
	height:50px;
	background-image:url(../img/load.gif);
	background-repeat:no-repeat;
	background-position:center center;
	border-radius:5px;        /* 角丸 */  
    -webkit-border-radius:5px;    /* Safari,Google Chrome用 */  
    -moz-border-radius:5px;   /* Firefox用 */
}


/*---------------------------------------------
ロゴ
---------------------------------------------*/
#logoTop {
	float:left;
	position:absolute;
	left:5px;
	top:10px;
	z-index: 10;
}
#releaseTop {
	position:absolute;
	margin-left:10px;
	margin-top:220px;
	z-index: 10;
}
/*---------------------------------------------
グローバルナビ
---------------------------------------------*/
nav {
	width:auto;
	height:70px !important;
	border-bottom:#bdae7f 5px solid;
	position:static;
	text-align:center;
	background-image:url(../img/nav_bg.png);
	background-repeat: no-repeat;
	background-size: cover;
}

nav img{
	height:100px;
	display:inline-block;
	margin:0 10px 0 20px;
	}



#navBox{
	display:block;
	padding-top:7px;
}
nav p{
	display:none;
}
nav ul{
	width:auto;
	height:101px;
	margin-top:0;
	margin-bottom:10px;
	color:#fff;
}



nav li{
	display:inline-block;
	margin:auto;
	margin-bottom:50px;
	margin-right:10px;
	height:60px;
	opacity:0;
	background-image:url(../img/nav.png);
	background-repeat:no-repeat;
}

nav a{
	display:inline-block;
	color:#666;
	height:101px;
}

nav a:hover{
	cursor:pointer;
}

nav li.non a:hover{
	background-image:none;
	cursor:default;
}
.br_sp { display:none; }
.nav_txt {display:none;}
#smpBt {display:none;}



/*---------------------------------------------
サブナビまとめ
---------------------------------------------*/
#subNaviBox{
	width:48px;
	height:100%;
	float:right;
	background-color:#000000;
	top:0;
	z-index:0;
}




/*////////////////////////////////////////////////////////////////////////
トップページ
////////////////////////////////////////////////////////////////////////*/
/*---------------------------------------------
キービジュ
---------------------------------------------*/
#keyBg{
	width:100%;
	height:1100px;
	background-image:url(../img/top/key.jpg);
	background-repeat:no-repeat;
	background-position:center top;
	background-size: cover;
	position: relative;
}

#keyImg{display:none;}


.keyBgAll{
	width:100%;
	height:1100px;
	background-image:url(../img/top/key_bg.jpg);
	background-repeat:no-repeat;
	background-position:center top;
	position: relative;
}

/*---------------------------------------------
新着
---------------------------------------------*/
#news{
	width:auto;
	height:15px !important;
	position:static;
	z-index:997;
	background-image:url(../img/white_50.png);
	padding:10px 12px 10px 12px;
}

#news a:hover{
	cursor:pointer;
	opacity:0.8;
}

#news a{
	color:#000;
}


.newsY{
	font-size:15px;
	color:#464444;
	line-height:1.1em;
	background-image:url(../img/top/news.png);
	background-repeat:no-repeat;
	margin-top:-2px;
	padding-left: 100px;
	padding-top:3px;
	font-weight:bold;
}


.newsD,.newsTxt{
	line-height:1.1em;
	margin-top:15px;
}


#news2nd{display:none;}

.more { position:relative; float: right; top:-20px;}

/*---------------------------------------------
更新履歴
---------------------------------------------*/
.oldNews{
	color:#fff;
	height:1061px;
	width:15px;
	background-image:url(../img/top/black_60.png);
	padding:10px 0px 30px 5px;
	float:right;
	position:absolute;
	right:39px;
	z-index:999;
	display:none;
}

.oldNews .newsY{
	font-size:15px;
	color:#fff;
	line-height:1.1em;
	margin-top:15px;
	padding-top:90px;
	background-image:none;
}


#oldNews{
	color:#fff;
	background-position:center center;
	padding:10px;
	min-height:360px;
	font-size:13px;
}

.oldDate{margin-right:10px; font-size:15px;}

.oldTxt{font-size:15px;}

.newsLine{
	border-bottom:1px solid #fff;
	margin-bottom:5px;
}

/*---------------------------------------------
ツイッター
---------------------------------------------*/
#twAria{
	width:300px;
	height:220px;
	float:left;
	position:absolute;
	bottom:10px;
	left:10px;
	padding:10px;
	background-image:url(../img/top/tw_bg.jpg);
	border:double 3px #bdae7f;
}


/*---------------------------------------------
バナーエリア
---------------------------------------------*/
#bannerAria{
	width:auto;
	height:auto;
	background-color:#000000;
	text-align:center;
	margin-right:200px;
	padding:20px;
	border-top:#bdae7f 1px solid;
}


/*---------------------------------------------
DLC情報
---------------------------------------------*/
#dlcBan{
	width:10%;
	max-width:140px;
	position:absolute;
	left:10px;
	top:10px;
}

#dlcBan img{
	width:100%;
	max-width:145px;
	border:solid 1px #fff;
}

#dlcBan a img:hover{
	border:solid 1px #5F4076;
	opacity:0.8;
}

/*////////////////////////////////////////////////////////////////////////
ストーリー
////////////////////////////////////////////////////////////////////////*/
#story{
	height:auto;
	text-align:center;
	padding:50px 0;
}

.stBox{
	width:100%;
	max-width:1200px;
	margin:auto;
	height:auto;
	text-align:center;
}

/*---------------------------------------------
ストーリーナビ
---------------------------------------------*/
#storyNavi{
	width:30px;
	margin:auto;
	margin-top:10px;
	height:auto;
}


#storyNavi ul li{
	height:100px;
	cursor:pointer;
	display:block;
	border-top:1px solid #fff;
	margin-bottom:20px;
}

#storyNavi ul li{
	background-color:#fff;
}

#storyNavi ul li:hover,#storyNavi ul li.select{
	background-color:#bdae7f;
}


/*////////////////////////////////////////////////////////////////////////
キャラクター
////////////////////////////////////////////////////////////////////////*/
#chara{
	height:auto;
	text-align:center;
}

.charaAll{
	width:100%;
	margin:auto;
	height:auto;
	min-height:1100px;
	text-align:center;
	max-width:728px;
	position:relative;
	background-repeat:no-repeat;
	background-size:100% auto;
}


.subCharaBox{
	padding-top:50px;
	padding-bottom:50px;
	width:705px;
}

.subCharaBox p{
	display:inline-block;
	margin:0 5px;
	float:left;
}

.subCharaBox img{
	border-right:1px solid #000;
	border-bottom:1px solid #000;
}


/*---------------------------------------------
キャラナビ
---------------------------------------------*/
#subNaviBoxC{
	width:100%;
	height:auto;
	text-align:center;
	background-image:none;
	position:relative;
	z-index:998;
	z-index:0;
}


#subNaviBoxC #charaNavi{
	width:100%;
	height:auto;
	padding-top:5px;
	text-align: center;
}

#charaNavi ul {
	width:auto;
	height:auto;
	margin-top:0px;
	text-align: center;
	display:inline-block;
	margin-right:5px;
}


#charaNavi ul li{
	width:48px;
	height:48px;
	cursor:pointer;
	display:block;
	background-repeat:no-repeat;
	margin-bottom:5px;
		float: left;
	margin-right:5px;
	border:solid 1px #bdae7f;
	background-image:url(../img/chara/nav_1.jpg);
	opacity:0.6;
}

#charaNavi ul li:hover{
	border:solid 1px #bdae7f;
	opacity:1;
}

#charaNavi .select{
	border:solid 1px #bdae7f;
	opacity:1;
}

#charaNavi .non{
	opacity:0.6;
	cursor:default;
}

#charaNavi .non:hover{
	border:solid 1px #fff;
	opacity:0.6;
	cursor:default;
}
#charaNavi .tab { 
    width:50px; 
    float:left;
	margin-right:5px;
}


/*---------------------------------------------
---------------------------------------------*/
.cName{
	width:100%;
	position:absolute;
}

.cData{
	max-width:339px;
	border-top:1px solid #fff;
}

.txt2, .txt3, .cCosBox, .svBox{
	display:inline-block;
}

/*ボイスないとき*/
.txt2 img{
    margin-top: 5px;
}

/*ボイスあるとき*/
/*
.txt2{
	margin-right:20px;
	margin-left:20px;
	padding-bottom:50px;
}
*/


.cCosBox{
	height:auto;
	background-image:url(../img/chara/cos/cos.png);
	background-position:left 10px;
	background-repeat:no-repeat;
	padding-top:35px;
	text-align:left;
	margin-left:10px;
	float:left;
}

.cCosBox span{
	height:58px;
	width:58px;
	cursor:pointer;
	display:inline-block;
	border:solid 1px #2c2e46;
	background-image:url(../img/chara/cos/cc_off.jpg);
}

.cCosBox span:hover , .cCosBox .select{
	opacity:1;
	border:solid 1px #ce5656;
	background-image:url(../img/chara/cos/cc_on.jpg);
}

/*---------------------------------------------
サンプルボイス
---------------------------------------------*/
.svBox {
	height:auto;
	width:80px;
	background-image:url(../img/chara/voice_title.png);
	background-position:right 30px;
	background-repeat:no-repeat;
	padding-top:35px;
	text-align:left;
	float:right;
}

.svBox .play-bt,
.svBox .stop-bt {
	height:58px;
	width:58px;
	cursor: pointer;
	display:block;
	margin-bottom:5px;
	background-image:url(../img/chara/sv_off.jpg);
	border:solid 1px #2c2e46;
}


.svBox .play-bt:hover{
	background-image:url(../img/chara/sv_on.jpg);
	background-repeat:no-repeat;
	border:solid 1px #ce5656;
}
	
.svBox .stop-bt:hover{
}


.svBox .sv .play-bt {
	background-repeat: no-repeat;
}

.svBox .sv .stop-bt{
	height:58px;
	width:58px;
	background-image:url(../img/chara/sv_on.jpg);
	background-repeat:no-repeat;
	border:solid 1px #ce5656;
}


/*////////////////////////////////////////////////////////////////////////
ギャラリー
////////////////////////////////////////////////////////////////////////*/
#gallery{
	min-height:700px;
	height:auto;
	text-align:center;
	padding-top:50px;
	padding-bottom: 30px;
}

.galleryBox{
	width:100%;
	max-width:1200px;
	margin:auto;
	min-height:250px;
	text-align:center;
}

#gallery img{
	border:solid 1px #000;
	float: left;
	margin:0 5px 5px 0;
	width:24%;
	max-width:290px;
	position: relative;
}

#gallery img:hover{
	border:solid 1px #bdae7f;
}
.thumb {
   position: relative!important;
   margin-left:-55px;
}
.thumb img.ss_new{
	width:27px !important;
	height:14px;
	position: absolute;
	top: 5px;
	left: 55px;
	z-index:9999999!important;
}
.ss_new img:hover{
    border:none;
}

/*////////////////////////////////////////////////////////////////////////
システム
////////////////////////////////////////////////////////////////////////*/
#system{
	height:auto;
	text-align:center;
}

.sysBox{
	width:100%;
	max-width:790px;
	margin:auto;
	height:auto;
	text-align:center;
	padding:55px 0;
}

#system img{
	float:right;
	margin:0 5px 5px 0;
	max-width:568px;
}



/*////////////////////////////////////////////////////////////////////////
主題歌
////////////////////////////////////////////////////////////////////////*/
#sound{
	height:auto;
	min-height:700px;
	text-align:center;
	padding-top:50px;
}

.soundBox{
	width:770px;
	max-width:1050px;
	margin:auto;
	height:auto;
	text-align:center;
	position:relative;
}

.soundLink1{
	height:230px;
	width:17px;
	position:absolute;
	right:24.5%;
	top:50%;
}

.soundLink2{
	height:300px;
	width:17px;
	position:absolute;
	right:29.5%;
	top:50%;
}

.soundLink1:hover,.soundLink2:hover{
	background-color:#BEA04B;
	opacity:0.3;
}


/*////////////////////////////////////////////////////////////////////////
ムービー
////////////////////////////////////////////////////////////////////////*/
#movie{
	text-align:center;
	padding:50px 0;
	min-height:700px;
}

#movieBox{
	width:80%;
	margin:auto;
}

#movie img{
	width:45%;
	border:solid 1px #000;
}

#movie img:hover{
	opacity:0.8;
	border:solid 1px #bdae7f;
}

.youtube-container {
	display:none;
}



/*////////////////////////////////////////////////////////////////////////
スペシャル
////////////////////////////////////////////////////////////////////////*/


#special{
	height:auto;
	text-align:center;
	padding-top:50px;
	margin-right:50px;
}

.spBox{
	width:100%;
	max-width:780px;
	text-align:center;
	margin:auto;
	height:auto;
	text-align:center;
	min-height:700px;
}

.wallBox{
	padding-bottom:50px;
}

.iconBox img, .wallBox img{
	float:right;
	margin:0 4px 4px 0;
	border:solid 1px #000;
}

.wallBox img:hover{
	opacity:0.6;
	border:solid 1px #bdae7f;
}




.smpWallBox table{
	float:right;
}

.smpWallBox table tr{
	float:right;
	background-color:#000;
	color:#fff;
	margin:3px;
	padding:5px;
	width:30%;
}

.smpWallBox table td{
	float:right;
	display:block;
}

.smpWallBox table td.link:hover{
	opacity:0.5;
}

.smpWallBox table td{
	width:60%;
}

.smpWallBox table td img{
	width:100%;
}

.smpWallBox table td.link{
	width:8%;
	max-width:20px;
}


.smpWallBox table {
	text-align:center;
}


p.keyWall img{
	float:none;
}

.bannerBox .banTxt{
	width:100%;
	font-size:12px;
	color:#fff;
	margin-bottom:20px;
	margin-right:50px;
	border:#bdae7f solid 1px;
	background-color:#000;
	text-align:left;
}

.banPoint{
	padding:5px;
	background-color:#382131;
	color:#fff;
}

.bannerBox{
	background-repeat:no-repeat;
	background-position:right top;
	background-image:url(../img/special/ban_txt.png);
	padding-right:100px;
	text-align:right;
}


/*---------------------------------------------
スペシャルナビ
---------------------------------------------*/
#specialNavi{
	width:30px;
	height:auto;
	margin:auto;
	margin-top:10px;
}


#specialNavi ul li{
	cursor:pointer;
	display:block;
	border-top:1px solid #fff;
	margin-bottom:20px;
}

#specialNavi ul li img{
	vertical-align:bottom;
}

#specialNavi ul li{
	background-color:#fff;
}

#specialNavi ul li:hover,#specialNavi ul li.select{
	background-color:#bdae7f;
}


#specialNavi ul .non:hover{
	background-color:#fff;
	cursor:default;
}



/*////////////////////////////////////////////////////////////////////////
製品情報
////////////////////////////////////////////////////////////////////////*/
#info{
	height:auto;
	text-align:center;
	padding:50px 0;
}

#infoBox{
	width:100%;
	max-width:1200px;
	margin:auto;
	height:auto;
	text-align:center;
}

/*---------------------------------------------
インフォナビ
---------------------------------------------*/
#infoNavi{
	width:30px;
	height:auto;
	margin:auto;
	margin-top:10px;
}


#infoNavi ul li{
	height:auto;
	cursor:pointer;
	display:block;
	border-top:1px solid #fff;
	margin-bottom:20px;
}

#infoNavi ul li img{
	vertical-align:bottom;
}


#infoNavi ul li{
	background-color:#fff;
}

#infoNavi ul li:hover,#infoNavi ul li.select{
	background-color:#bdae7f;
}


#infoNavi ul .non:hover{
	background-color:#fff;
	cursor:default;
}


/*////////////////////////////////////////////////////////////////////////
特典情報
////////////////////////////////////////////////////////////////////////*/
#shop{
	height:auto;
	padding-top:50px;
	margin-right:50px;
}

.shopBox{
	width:100%;
	max-width:900px;
	margin:auto;
	height:auto;
}

.shopList{
	background-image:url(../img/info/shopbg.png);
	background-repeat:no-repeat;
	background-size:100%;
}


.shopBoxIn{
	width:90%;
	max-width:770px;
	margin:auto;
	height:auto;
	text-align:center;
}

.shopBoxIn img:hover{opacity:0.5;}

.shopBoxIn img{width:32.5%;}
.longItem img{width:100%;}

.shopTxt{
	display:none;
}


.bannerBox{
	background-repeat:no-repeat;
	background-position:right top;
	background-image:url(../img/special/ban_txt.png);
	padding-right:100px;
	text-align:right;
}



/*****************************************************************************************/
/*メディアクエリ*/
/*****************************************************************************************/
@media screen and (max-width: 1600px) {
/*////////////////////////////////////////////////////////////////////////
全体ボックス
////////////////////////////////////////////////////////////////////////*/
#contents{
	position: relative;
	min-height:700px;
}
/*////////////////////////////////////////////////////////////////////////
トップページ
////////////////////////////////////////////////////////////////////////*/
/*---------------------------------------------
キービジュ
---------------------------------------------*/
#keyBg{
	height:100%;
	background-size:100%; 
}

.keyBgAll{
	height:100%;
}

#keyCover{
	width:95%;
	max-width:1600px;
}

#keyCover img{
	width:95%;
	max-width:1600px;
	vertical-align:bottom;
}

#news{
	height:100%;
}



}
@media screen and (max-width: 1200px) {
/*////////////////////////////////////////////////////////////////////////
全体ボックス
////////////////////////////////////////////////////////////////////////*/
#contents{
	position: relative;
	min-height:600px;
}
nav {
	width:auto;
	height:100px !important;
}
#navBox{
	padding-top:0px;
}
nav ul{
	width:auto;
	margin-top:0;
	padding-top:70px;
}



nav li{
	display:inline-block;
	margin:auto;
	margin-bottom:50px;
	margin-top:-70px;
	margin-right:10px;
	height:60px;
	opacity:0;
	background-image:url(../img/nav.png);
	background-repeat:no-repeat;
	z-index: 9999 !important;
}
#logoTop {
    top:66%;
	left:27%;
	width: 100%;
}
#logoTop img { 
    width:50%;
}
#releaseTop {
	margin-top:0px;
}

/*////////////////////////////////////////////////////////////////////////
トップページ
////////////////////////////////////////////////////////////////////////*/
/*---------------------------------------------
ツイッター
---------------------------------------------*/
#twAria{
	width:100%;
	height:230px;
	position:inherit;
}

iframe.twitter-timeline {
	width: 90% !important;
}
.new { display:none;}
.br_sp { display: inline-block ;}
#spVitaBan img { margin-top:-30px;}

/*---------------------------------------------
DLC情報
---------------------------------------------*/
#dlcBan{
	width:30%;
	bottom:10px;
	top:inherit;
	max-width:250px;
}

#dlcBan img{
	width:40%;
	vertical-align:bottom;
}

.txtCutNone2{
	display:none;
}


/*////////////////////////////////////////////////////////////////////////
ギャラリー
////////////////////////////////////////////////////////////////////////*/
.galleryBox{
	width:90%;
}

#gallery img{
	width:31.5%;
	max-width:280px;
}

/*////////////////////////////////////////////////////////////////////////
ムービー
////////////////////////////////////////////////////////////////////////*/
.movieBox img{width:45%;}
	
	
}
@media screen and (max-width: 1100px) {
.iconBox img {width:18%;}
.wallBox img {width:32%;}
.inBox img{width:14%;}
.inBox2 img{width:23%;}



/*////////////////////////////////////////////////////////////////////////
キャラクター
////////////////////////////////////////////////////////////////////////*/
.subCharaBox{
	text-align:center;
	width:auto;
	margin:auto;
}

.subCharaBox p{
	display:block;
	margin:auto;
	float:none;
}


/*////////////////////////////////////////////////////////////////////////
システム
////////////////////////////////////////////////////////////////////////*/

#system img{
	float:none;
	display:block;
	max-width:none;
	margin:5px 0;
	width:100%;
	max-width:385px;
}


.sysBox{
	max-width:385px;
	margin:auto;
	text-align:center;
	float:none;
}


.sysBox p{
	display:block;
	margin:auto;
	float:none;
}



/*////////////////////////////////////////////////////////////////////////
ムービー
////////////////////////////////////////////////////////////////////////*/
.movieBox img{width:45%;}
	
	
p.keyWall img{
	width:90%;
}
	
	
}
@media screen and (max-width: 1000px) {
/*////////////////////////////////////////////////////////////////////////
全体ボックス
////////////////////////////////////////////////////////////////////////*/
#contents{
	position: relative;
	min-height:400px;
}

.inBox img{width:13%;}


	
/*////////////////////////////////////////////////////////////////////////
主題歌
////////////////////////////////////////////////////////////////////////*/
.soundBox{width:100%;}

.soundLink1{
	width:15px;
	height:25%;
}

.soundLink2{
	width:15px;
	height:35%;
}



}
@media screen and (max-width: 800px) {
/*////////////////////////////////////////////////////////////////////////
基本
////////////////////////////////////////////////////////////////////////*/
.txtCut{display:block;}
.txtCutNone{display:none;}
#contents{ width:100%;min-height:inherit;}

#mainBox{
	margin-right:0;
	float:none;
	margin:auto;
} 


.loading p{
	width:100%;
}

/*////////////////////////////////////////////////////////////////////////
全体ボックス
////////////////////////////////////////////////////////////////////////*/
#wrapper{
	background-position:-150px top;
}

/*////////////////////////////////////////////////////////////////////////
共通
////////////////////////////////////////////////////////////////////////*/
/*---------------------------------------------
フッター
---------------------------------------------*/
footer {margin-right:0;}
.br_sp2 { display: none;} 

/*---------------------------------------------
グローバルナビ
---------------------------------------------*/
nav {
	width:auto;
	border-bottom:#bdae7f 5px solid;
	border-left:none;
	border-right:none;
	position:static;
	float:none;
	background-image:url(../img/nav_bg_re.jpg);
}

nav ul{
	width:auto;
	margin-top:0;
	padding-top:70px;
}



nav li{
	display:inline-block;
	margin:auto;
	margin-bottom:50px;
	margin-top:-70px;
	margin-right:10px;
	height:60px;
	opacity:0;
	background-image:url(../img/nav.png);
	background-repeat:no-repeat;
	z-index: 9999 !important;
}

/*---------------------------------------------
ロゴ
---------------------------------------------*/
#logoTop {
    top:40%;
}
#releaseTop {
    display:none;
}

/*////////////////////////////////////////////////////////////////////////
トップページ
////////////////////////////////////////////////////////////////////////*/
#keyCover img{
	border-bottom:1px solid #000;
}

/*---------------------------------------------
新着
---------------------------------------------*/
#topInfo{
	width:90%;
	margin:auto;
	padding:20px 0;
}


#news{display:none;}

#news2nd{
	width:100%;
	background-color:#000000;
	display:block;
	border:#bdae7f 1px solid;
	margin-right:2%;
	float:left;
	margin-bottom:10px;
	color:#fff;
	font-size:13px;
	text-align:left;
}


#news2ndIn{
	width:auto;
	height:233px;
	overflow-y:scroll;
	background-color:#000000;
	padding:10px;
}

.newsY{
	line-height:1.3em;
	background-image:none;
	margin-top:0px;
	padding-top:0px;
	padding-bottom:10px;
	margin-bottom:5px;
	border-bottom:1px solid #333;
	padding-left: 10px;	
}


/*---------------------------------------------
ツイッター
---------------------------------------------*/
#twAria{
	width:50%;
	height:225px;
	position:relative;
	bottom:0;
	left:0;
	border:#bdae7f 1px solid;
	padding:2% 0 2% 2%;
	float:right;
	margin-bottom:10px;
}

iframe.twitter-timeline {
	height: 200px !important;
	width: 98% !important;
}


/*---------------------------------------------
DLC情報
---------------------------------------------*/
#dlcBan{
	width:30%;
	left:5px;
	bottom:5px;
	max-width:inherit;
	max-width:600px;
}

#dlcBan img{vertical-align:bottom;}

#dlcBan img{
	width:auto;
	width:40%;
}

/*---------------------------------------------
バナーエリア
---------------------------------------------*/
#bannerAria{margin-right:0;}
#bannerAria img{ width:45%; max-width:195px;}
#bannerAria .non{display:none;}



/*////////////////////////////////////////////////////////////////////////
////////////////////////////////////////////////////////////////////////*/
#cNavi ul li span.new{
	margin-left:-14px;
	background-color:#000000;
}


/*---------------------------------------------
サブナビボックス
---------------------------------------------*/
#subNaviBox{
	width:100%;
	height:120px;
	position:relative;
	right:inherit;
	float:none;
	margin-top:-10px;
}

#subNaviBoxC{
	width:100%;
	min-height:inherit;
	height:auto;
	position:relative;
	right:inherit;
	float:none;
	padding:5px 0;
}


/*////////////////////////////////////////////////////////////////////////
ストーリー
////////////////////////////////////////////////////////////////////////*/
#story{margin-right:0px;}
.stBox img{width:100%;}

/*---------------------------------------------
ストーリーナビ
---------------------------------------------*/
#storyNavi{
	width:90%;
	margin:auto;
	margin-top:10px;
}


#storyNavi ul li{
	width:30px;
	display:inline-block;
	border-top:none;
	float:right;
}


/*////////////////////////////////////////////////////////////////////////
キャラクター
////////////////////////////////////////////////////////////////////////*/

#chara{margin-right:0px;}

.charaAll{
	height:auto;
	min-height:0px;
	background-size:80% auto;
	background-position:center top;
}

.cName{
	height:auto;
	width:100%;
	position:relative;
	padding-bottom:50px;
}

.txt2 img , .txt1 img{
	width:100%;
}

.cCosBox{
	background-size:100%;
}


.subCharaBox p{
	width:90%;
	float:none;
}

/*---------------------------------------------
キャラナビ
---------------------------------------------*/

#subNaviBoxC #charaNavi{
	width:100%;
	height:auto;
	margin-top:5px;
	display:block;
}

#charaNavi ul {
	width:100%;
	height:auto;
	margin-top:0px;
	float: left;
	text-align: left;
	display:inline-block;
	margin-right:5px;
}

#charaNavi ul img{
	float: left;
}

#charaNavi ul .2nd {
	width:auto;
	display:inline-block;
	float:left;
	margin-right:3px;
}

#charaNavi ul li{
	float: left;
	margin-right:5px;
}



/*////////////////////////////////////////////////////////////////////////
主題歌
////////////////////////////////////////////////////////////////////////*/
#sound{
	padding-top:10px;
}

.soundLink1{
	width:16px;
	height:27%;
}

.soundLink2{
	width:16px;
	height:35%;
}


/*////////////////////////////////////////////////////////////////////////
ムービー
////////////////////////////////////////////////////////////////////////*/

#movie{
	min-height:inherit;
}

#movieBox{
	width:100%;
}

/*
#movie .youtube{
	display:none;
}
*/
.youtube-container {
	display:block;
	margin:auto;
	width:95%;
	max-width:800px;
	position: relative;
	padding-bottom: 56.25%;
	height: 0;
	text-align:center;
	overflow: hidden;
}

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


/*////////////////////////////////////////////////////////////////////////
スペシャル
////////////////////////////////////////////////////////////////////////*/
#special{margin-right:0px;}

.spBox{
	max-width:auto;
	text-align:center;
	margin:auto;
	height:auto;
	margin-top:0;
	min-height:inherit;
	padding-bottom:50px;
}


.inBox img{
	width:12%;
	}

.smpWallBox table tr{
	width:44%;
}


/*---------------------------------------------
ナビ
---------------------------------------------*/
#specialNavi{
	width:90%;
	margin:auto;
	margin-top:10px;
}


#specialNavi ul li{
	width:30px;
	display:inline-block;
	border-top:none;
	float:right;
}




/*////////////////////////////////////////////////////////////////////////
製品情報
////////////////////////////////////////////////////////////////////////*/
#infoBox img{width:100%;}
#infoBox .specBox{width:120px;}


#info{
	margin-right:0px;
}


/*---------------------------------------------
インフォナビ
---------------------------------------------*/
#infoNavi{
	width:90%;
	margin:auto;
	margin-top:10px;
}


#infoNavi ul li{
	width:30px;
	display:inline-block;
	border-top:none;
	float:right;
}




/*////////////////////////////////////////////////////////////////////////
特典情報
////////////////////////////////////////////////////////////////////////*/
#shop{margin-right:0px; padding-top:100px;}
.shopBox img{width:100%;}


.shopTxt{
	display:block;
	color:#000;
	font-size:12px;
	text-align:left;
}


.shopList{
	background-image:none;
}

.shopBoxIn img{width:32%;}
.longItem img{width:100%;}


}

@media screen and (max-width: 671px) {	
/*////////////////////////////////////////////////////////////////////////
キャラクター
////////////////////////////////////////////////////////////////////////*/
#chara{
	background-position:center top;
	background-repeat:repeat;
}


#system{
	background-position:center top;
	background-repeat:repeat;
}

#charaNavi ul img{
	margin-bottom:50px;
}



.charaAll{
	background-size:95% auto;
	background-position:center top;
}
nav {
	height:140px !important;
}
.br_sp { display:none; }
}
@media screen and (max-width: 600px) {	
/*////////////////////////////////////////////////////////////////////////
トップページ
////////////////////////////////////////////////////////////////////////*/
/*---------------------------------------------
ツイッター
---------------------------------------------*/
#twAria{
	width:98%;
	float:none;
}

/*---------------------------------------------
新着
---------------------------------------------*/
#news2nd{
	width:100%;
	float:none;
}

#news2ndIn{height:150px;}



/*////////////////////////////////////////////////////////////////////////
ギャラリー
////////////////////////////////////////////////////////////////////////*/
#gallery img{
	width:47%;
	max-width:280px;
}

/*////////////////////////////////////////////////////////////////////////
主題歌
////////////////////////////////////////////////////////////////////////*/
.soundLink1{width:12px;}
.soundLink2{width:12px;}


/*////////////////////////////////////////////////////////////////////////
御土産
////////////////////////////////////////////////////////////////////////*/
/*---------------------------------------------
壁紙
---------------------------------------------*/
.wallBox img {
	width:96%;
	margin:2%;
}
.wallBox p{
	width:30%;
	display:inline-block;
}
.wallBox p.keyWall{
	width:90%;
	display:inline-block;
}


}
@media screen and (max-width: 480px) {
#contents{ margin-top:45px;}
#keyBg{
   margin-top: -5px;
}
#logoTop {
    top:35%;
}
.br_sp { display: none;} 
.nav_txt {display:block;}
nav {
	width:100%;
	height:auto!important;
	margin:auto;
	font-family: 'Play', sans-serif;
	font-size:30px;
	line-height:1em;
	position:absolute;
	z-index:999;
	top:0;
	left:0;
	padding:10px 0;
	text-align:left;
	background-color: #000;
	background-image:none;
}

nav p#menu{
	display:block;
	height:50px;
	text-align:center;
	font-size:20px;
	line-height:2em;
	color:#fff;
	cursor:pointer;
	letter-spacing:1px;
}

nav ul{
	display:none;
	margin-bottom:170px;
	margin-top:-50px;
}

nav li{
	display:block;
	margin:auto;
	height:30px;
	padding-left:10px;
	background-image:none;
}
nav a{
	display:block;
	color: #fff;
	font-size: 15px;
}

nav a:hover{
	cursor:pointer;
	color:#afa083;
	text-decoration: none;
	text-shadow: 0px 0px 5px #333;
	background-image:none;
	background-image:url(../img/top/point.png);
	background-repeat:no-repeat;
	background-position:-20px -18px;
}

nav li.non a:hover{
	cursor:default;
}


nav .select{
	padding-left:10px;
	background-image:none;
	background-image:url(../img/top/point.png);
	background-repeat:no-repeat;
	background-position:-20px -18px;
}
    #smpBt {
        position:relative;
        width:25px;
        height:3px;
        top:20px;
        left:20px;
        transform:translate(-50%,-50%);
        -webkit-transform:translate(-50%,-50%);
        transition:linear .5s;
        -webkit-transition:all linear .5s;
        background:#fff;
        cursor: pointer;
		display:block;
        
    }
    #smpBt::after {
        content:' ';
        position:absolute;
        width:25px;
        height:3px;
        top:300%;
        left:0;
        background:#fff;
        cursor: pointer;
    }
    #smpBt::before {
        content:' ';
        position:absolute;
        width:25px;
        height:3px;
        top:-300%;
        left:0;
        background:#fff;
        cursor: pointer;
    }
    #smpBt.action {
        position:absolute;
        width:25px;
        height:3px;
        transform:translate(-50%,-50%) rotate(45deg);
        -webkit-transform:translate(-50%,-50%) rotate(45deg);
        transition:linear .5s;
        -webkit-transition:all linear .5s;
        background:none;
        cursor: pointer;
    }
    #smpBt.action::after {
        content:' ';
        position:absolute;
        width:25px;
        height:3px;
        top:50%;
        left:50%;
        transform:translate(-50%,-50%) rotate(90deg);
        -webkit-transform:translate(-50%,-50%) rotate(90deg);
        transition:linear .5s;
        -webkit-transition:all linear .5s;
        background:#fff;
        cursor: pointer;
    }
    #smpBt.action::before {
        content:' ';
        position:absolute;
        width:25px;
        height:3px;
        top:50%;
        left:50%;
        transform:translate(-50%,-50%) rotate(180deg);
        -webkit-transform:translate(-50%,-50%) rotate(180deg);
        transition:linear .5s;
        -webkit-transition:all linear .5s;
        background:#fff;
        cursor: pointer;
    }
	.stBox img{ display: none;}
	.smp_txt { display:block; color:#FFFFFF; font-size: 14px; padding-bottom:30px; padding-left:20px;}
	.smp_txt h1 { font-size:19px; margin-bottom:5px;}
	.smp_txt p { margin-bottom:15px;}
	#subNaviBox #stNavi{ margin-top:40px;}
	#spNaviBox #spNavi{ margin-top:40px;}

/*////////////////////////////////////////////////////////////////////////
サブナビまとめ
////////////////////////////////////////////////////////////////////////*/
#subNaviBox #stNavi, #subNaviBoxC , #keyImg img,
#sysNaviBox #sysNavi, #spNaviBox #spNavi, #shopNaviBox #shopNavi{
	margin-top:0px;
}

#stNavi ul {margin-right:0px;}


/*////////////////////////////////////////////////////////////////////////
キャラクター
////////////////////////////////////////////////////////////////////////*/


.txt2 , .txt1{
	margin-right:0;
}

.cData{
	float:left;
	margin:0 5px;
	padding:0 5px;
}


/*ボイスあるとき*/
.txt2{margin-left:5px;}
.cCosBox{margin-left:0px;}



/*////////////////////////////////////////////////////////////////////////
システム
////////////////////////////////////////////////////////////////////////*/
.sysBox{
	width:90%;
	margin:auto;
}



/*////////////////////////////////////////////////////////////////////////
主題歌
////////////////////////////////////////////////////////////////////////*/
.soundLink1{width:10px;}
.soundLink2{width:10px;}


/*////////////////////////////////////////////////////////////////////////
御土産
////////////////////////////////////////////////////////////////////////*/
/*---------------------------------------------
応援バナー
---------------------------------------------*/
.iconBox img{width:18%;}
.inBox img{width:12%;}

/*

.smpWallBox table{
	float:none;
	margin:auto;
}

.smpWallBox table tr{
	float:none;
	width:100%;
}
*/

}

@media screen and (max-width: 396px) {	
/*////////////////////////////////////////////////////////////////////////
キャラクター
////////////////////////////////////////////////////////////////////////*/
#charaNavi ul img{
	margin-bottom:100px;
}
#logoTop {
    top:30%;
	left: 60px;
}


@media screen and (max-width: 330px) {	
/*////////////////////////////////////////////////////////////////////////
ナビを1段に収めるため最小幅設定
////////////////////////////////////////////////////////////////////////*/
html{
	overflow-x:scroll;
	min-width:330px;
}

}