@charset "UTF-8";
/* ========================================
	common
======================================== */
@media screen and (min-width: 480px) and (max-width: 480px){
body {
	-webkit-text-size-adjust: 100%;
}
#wrap,
#wrap.second {
	background:none
}
img {
	width:100%;
	height:auto;
}
.pc {
	display:none;
}
.sp {
	display:block;
}
#header {
	width:100%;
}
#header .logo_capcom {
	width:100px;
	margin:0 0 0 10px;
}
#header ul {
	display:none;
}
#contents {
	width:100%;
	padding:105px 0 0 0;
	background:url(../img/sp_bg_top.png) no-repeat center 170px;
	background-size:100%;
}
#contents h1 {
	margin:0 0 270px 0;
}
/*nav*/
#nav {
	display:none;
	position:absolute;
	top:133px;
	left:0;
	width:100%;
	margin:0;
	/*border-top:3px double #111;*/
	z-index:10;
}
.top #nav {
	top:91px;
}
#nav li {
	float:none;
}
#nav li.active span {
	background:#333;
	color:#fff;
}
#nav li.pre {
	background::000;
	color:#333;
}
#nav a {
	text-decoration:none;
}
#nav span {
	display:block;
	width:94%;
	padding:20px 3%;
	border-bottom:1px solid #484646;
	background:#000;
}
#nav img {
	display:none;
}
#nav span {
	display:block;
}
#nav li span.update {
	display:none;
}
#sp_nav {
	position:absolute;
	top:0;
	left:0;
	width:100%;
	border-bottom:3px double #333;
	line-height:1;
}
.sp_nav {
	display:block;
	float:left;
	width:30px;
	margin:15px 0;
	padding:20px;
}
.top .sp_nav {
	float:none;
}
#sp_nav .logo {
	display:block;
	float:left;
	width:100px;
	margin:0;
}
.top #sp_nav .logo {
	top:0!important;
	left:50%!important;
	float:none;
	margin:0 0 0 -50px;
}
.second .tit {
	position:static;
	float:left;
	width:250px;
	margin:10px 0 0 -40px;
}
.top .news {
	width:96%;
	margin:0 2% 20px 2%;
}
.top .news span {
	width:80px;
	top:-20px;
	left:0;
}
.top .pv {
	width:96%;
	margin:0 2%;
}
.top .spec p {
	width:50%;
	margin:80px 0 0 0;
}
.top .spec div {
	width:45%;
	padding:30px 2%;
	margin:30px 0 0 0;
}
.top .spec div #bg {
	top:-60px;
	left:30px;
	width:80%;
	margin:0;
}
#footer .sublink {
	width:100%;
	margin:0;
}
#footer .sublink li {
	width:50%;
	margin:0;
}
#footer .sublink li a {
	padding:10px 5px 10px 20px;
	border:1px solid #1f1f1f;
	background:url(../img/sp_link_blank.gif) no-repeat right center;
	color:#dbdbdb;
	text-decoration:none;
}
#footer .social {
	display:none;
	width:180px;
	margin:20px auto;
	padding:0 0 0 45px;
}
#footer .social li{
	float:left;
	width:30px;
	margin:0 30px 0 0;
}
#footer p {
	width:96%;
	margin:0 2%;
}
/* ========================================
	news
======================================== */
#contents.news {
	width:98%;
	margin:0 auto;
	padding:105px 0 0 0;
}
#contents.news #sp_nav {
	left:-2%;
	width:103%;
}
#contents.news .sp_nav {
	margin:15px 0 15px 2px;
}
.news .news_top {
	/*mid*/
	position:relative;
	padding:0;
	background:url(../img/sp_bg_news_mid.jpg) repeat-y left 39px;
	background-size:100%;
}
.news .news_btm {
	/*top*/
	padding:100px 0 0 0;
	background:url(../img/sp_bg_news_top.jpg) no-repeat left top;
	background-size:100%;
}
.news .news_mid {
	/*btm*/
	padding:0;
	background:url(../img/sp_bg_news_btm.jpg) no-repeat left bottom;
	background-size:100%;
}
.news .news_top02 {
	/*mid*/
	position:relative;
	padding:0;
	background:url(../img/sp_bg_news_mid02.jpg) repeat-y left 39px;
	background-size:100%;
}
.news .news_mid02 {
	/*btm*/
	padding:100px 0 0 0;
	background:url(../img/sp_bg_news_top02.jpg) no-repeat left top;
	background-size:100%;
}
.news .date {
	top:55px;
	width:100%;
}
.second #contents.news h1 {
	margin:0 0 20px 0;
}
.news div.left {
	float:none;
	width:96%;
	margin:0 2% 20px 2%;
}
.news div.left li.left {
	float:none;
	width:96%;
	margin:0 2% 30px 2%;
	padding:0 0 30px 0;
	border:none;
	border-bottom:1px solid #776e52;
}
.news div.left li.right {
	float:none;
	width:96%;
	margin:0 2% 30px 2%;
	padding:0 0 30px 0;
	border-bottom:1px solid #776e52;
}
.news div.left li.right .img {
	width:140px;
	padding:10px 0 0 0;
}
.news div.left .img.ex01 {
	width:100%;
	margin:0 0 5px 0;
}
.news div.right {
	float:none;
	width:96%;
	margin:0 2% 30px 2%;
	padding:0 0 30px 0;
}
.news div.right dt {
	width:150px;
}
/*backNumber*/
#backNumber {
	margin:0 0 50px 0;
}
#backNumber dt {
	width:50%;
	margin:0 auto;
}
#backNumber li {
	float:none;
	width:92%;
	margin:0 2% 10px 2%;
	padding:2%;
}
#backNumber li:hover {
	border:2px solid #000;
	box-shadow:none;
}
#backNumber li:nth-of-type(2n) {
	margin:0 2% 10px 2%;
}
#backNumber li .img {
	width:48%;
	margin:0 2% 0 0;
}
#backNumber li ul {
	width:50%;
}
#backNumber li .title {
	margin:0;
	line-height:55px;
}
#backNumber li .title img {
	width:70%;
}
#backNumber li:nth-of-type(2) .title img {
	width:90%;
}
/* ========================================
	play
======================================== */
#contents.play {
	width:92%;
	margin:105px 2% 30px 2%;
	padding:20px 2%;
}
#contents.play  #sp_nav {
	left:-3%;
	width:104.5%;
	margin:-107px 0 0 0;
}
.play h2 {
	width:74%;
}
.play .ob {
	width:33%;
	top:-14px;
	right:0;
}
.play .controll {
	position:relative;
}
.play .controll li {
	position:absolute;
	bottom:0;
	left:0;
	width:52%;
}
.play .controll li.pv {
	position:relative;
	width:40%;
	margin:73px 0 20px 260px;
}
.play .flow li {
	width:50%;
}
.play .items {
	height:auto;
	padding:20px 2% 0 2%;
	border-radius:4px;
	border:3px solid #353d22;
	background:url(../img/bg_blk.jpg) repeat left top;
}
.play .items li {
	float:none;
	width:100%;
	margin:0 0 20px 0;
}
.play .items li:after {
	content:'';
	display:block;
	clear:both;
}
.play .items li p {
	float:left;
	width:30%;
}
.play .items li dl {
	float:left;
	width:70%;
}
.play .items li dt {
	height:40px;
}
.play .items li dt img {
	width:auto;
	height:100%;
}
.play .simple  dl {
	width:32%;
	height:490px;
	margin:0 2% 0 0;
}
.play .simple  dl:nth-of-type(3) {
	margin:0;
}
.play .simple  dt {
	left:0;
	width:90%;
	margin:0 5%;
}
.play .simple dl:nth-of-type(1) dd li.type01 span {
	width:50%;
	right:-40px;
}
.play .simple dl:nth-of-type(2) dd li.type01 span {
	width:50%;
	right:-40px;
}
.play .simple .btnArea {
	top:220px;
	left:-20px;
	width:8%;
}
.play .simple .btnArea li:nth-of-type(1) {
	margin:0 0 100px 0;
}
.play .simple dl:nth-of-type(3) dd li.type02 {
	left:-30px;
	width:120%;
}
/* ========================================
	monster
======================================== */
#contents.monster {
	width:92%;
	margin:105px 2% 30px 2%;
	padding:20px 2%;
}
#contents.monster  #sp_nav {
	left:-3%;
	width:104.5%;
	margin:-107px 0 0 0;
}
.monster h2 {
	width:74%;
}
.monster .tit {
	margin:10px 0 0 -20px;
}
.monster .mstlst li {
	position:relative;
	background:url(../img/line_monster.png) no-repeat center bottom;
	background-size:100%;
}
.monster .mstlst li.lst07 {
	padding:20px 0 30px 0;
}
.monster .mstlst .img {
	position:absolute;
	top:0;
	left:0;
	width:40%;
}
.monster .lst03 .img {
	top:40px;
	left:auto;
	right:-10px;
}
.monster .mstlst li.lst07 .img,
.monster .mstlst li.lst08 .img {
	width:38%;
}
.monster .mstlst dl {
	float:none;
	width:58%;
	padding:0 0 0 42%;
}
.monster .lst03 dl {
	padding:0 0 0 20px;
}
.monster .mstlst dt {
	width:50%;
	margin:0 0 10px -15px;
}
.monster .mstlst li.lst07 dt {
	width:72%;
}
.monster .mstlst li.lst08 dt {
	width:102%;
}
.monster .mstlst dd {
	font-size:14px;
	line-height:1.5;
}
.monster .mstlst ul.thumb {
	float:none;
	/*width:96%;*/
	width:327px;
	/*height:auto;*/
	margin:20px auto 0 auto;
	/*padding:10px 2% 40px 2%;*/
	/*background:#000;*/
}
.monster .mstlst ul.thumb.one {
	width:171px;
	/*background:#000;*/
}
.monster .mstlst ul.thumb.long {
	width:286px;
	margin:20px auto 0 auto;
}
.monster .mstlst ul.thumb.flow {
	width:333px;
	margin:20px auto 0 auto;
}
.monster .mstlst ul.thumb li span {
	font-size:14px;
}
.monster .mstlst .lst08 ul.thumb {
	margin:30px auto 0 auto;
}
/* ========================================
	shop
======================================== */
#contents.shop {
	width:92%;
	margin:105px 2% 30px 2%;
	padding:20px 2%;
}
#contents.shop  #sp_nav {
	left:-3%;
	width:104.5%;
	margin:-107px 0 0 0;
}
#contents.shop  #sp_nav .tit {
	margin:10px 0 0 -10px;
}
.shop h2 {
	width:74%;
}
.shop #shopnav {
	width:100%;
	margin:0 auto;
}
.shop #shopnav select {
	width:94%;
	margin:0 auto 10px auto;
	padding:10px 3%;
	font-size:14px;
}
.shop #shopnav p {
	width:90%;
	margin:0 auto;
}
.shop h3 {
	display:none;
	width:100%;
}
.shop h3 img {
	width:50%;
}
.shop .regionCol {
	display:none;
	width:94%;
	padding:10px 3%;
}
.shop .regionCol table {
	width:100%;
}
.shop .regionCol th.name {
	width:40%;
}
.shop .regionCol .tBody td {
	line-height:1.5;
}
.shop .regionCol .tBody td.name {
	width:40%;
}
.shop .btntop {
	display:none;
	width:150px;
	margin:0 auto;
}
#mdl_body.shop {
	position:absolute;
	top:0;
	left:auto;
	width:90%;
	margin:0 3%;
	padding:10px 2%;
}
#mdl_body.shop .shop_titshop {
	position:absolute;
	top:-20px;
	left:50%;
	width:130px;
	margin:0 0 0 -65px;
}
#mdl_body.shop .close {
	position:absolute;
	top:10px;
	right:10px;
	cursor:pointer;
}
#mdl_body.shop dl {
	float:none;
	width:100%;
	margin:0 0 20px 0;
}
#mdl_body.shop dt.name {
	margin:30px 0 20px 0;
	font-size:24px;
}
#mdl_body.shop .link {
	float:none;
	width:150px;
	margin:20px auto;
}
#mdl_body.shop #gMap {
	width:100%!important;
}


}