@charset "utf-8";
/*
.product 製品情報
============================*/
/* フィルター -------------------------------- */
#Filters{
	height:54px;
	background:url("../img/filters_bg.gif") no-repeat;
}

#Filters:after {
	content: "."; 
	display: block; 
	height: 0; 
	clear: both; 
	visibility: hidden;
}

#Filters .drop_down{
	position: relative;
	float:left;
	width:440px;
	height:28px;
	margin:8px 17px;
	background:#000;
	z-index:10;
}

#Filters .drop_down p.refine{
	position: absolute;
	margin:0;
	top:4px;
	left:14px;
	color:#fff;
    font-size:14px;
    font-weight:bold;
}

#Filters .drop_down ul{
	position: absolute;
	top:4px;
	right:20px;
    width:180px;
	border:1px #333 solid;
	max-height: 18px;
	overflow: hidden;
	cursor: pointer;
	background:#fff url("../img/dropdown_arrow.png") top right no-repeat;
}

#Filters .drop_down ul:hover{
	max-height: 360px;
}

#Filters .drop_down ul li{
	padding:2px 0 2px 8px;
	list-style:none;
}

#Filters .drop_down li:hover {
	background: #90ff00;
}

#Filters .drop_down li:before{
	content: '';
	position: relative;
	display: inline-block;
	width: 10px;
	height: 10px;
	top: 1px;
	margin-right: 6px;
	border: 1px solid #ccc;
	
	-webkit-border-radius: 2px;
	-moz-border-radius: 2px;
	border-radius: 2px;
}

#Filters .drop_down li.active{
	color: #93d000;
    font-weight:bold;
}

#Filters .drop_down li.active:before{
	background: #93d000;
	border-color: #93d000;
}

.fail_element{
	opacity: 0;
	text-align: center;
	width: 100%;
    height:0;
	top: 100px;
    left: 25%;
	line-height: 1.4;
	font-size: 30px;
}

.fail .fail_element{
	opacity: 1;
    height:80px;
}

/* 製品リスト -------------------------------- */
#productList{
	width: 950px;
	text-align: justify;
	margin-top:20px;
}

#productList:after{
	content: '';
	display: inline-block;
	width: 100%;
}

#productList .mix{
	display: none;
	opacity: 0;
	width: 455px;
	eight: 200px;
	vertical-align: top;
	margin-bottom: 20px;
}

#productList .gap{
	display: inline-block;
	width: 200px;
}

#productList li h4{
	clear:both;
    margin:0;
   	padding:8px 0 0 30px;
   	height:28px;
	background:url("../img/h4.gif") bottom no-repeat;
	font-size:18px;
}

#productList li .gameImg{
	float:left;
    width:225px;
    height:132px;
}

#productList p.platform:after {
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

#productList p.platform span{
	float:left;
	width:105px;
	height:17px;
	background:#fff url("../img/platform.png")no-repeat;
	text-indent:-9999px;
	margin-bottom:8px;
}

#productList p.platform span.PS4	{background-position:0 0;}
#productList p.platform span.PS3	{background-position:0 -17px;}
#productList p.platform span.PS2	{background-position:0 -34px;}
#productList p.platform span.PS	{background-position:0 -51px;}
#productList p.platform span.PSP	{background-position:0 -68px;}
#productList p.platform span.PSV	{background-position:0 -85px;}
#productList p.platform span.XBOX	{background-position:0 -102px;}
#productList p.platform span.DS3	{background-position:0 -119px;}
#productList p.platform span.DS	{background-position:0 -136px;}
#productList p.platform span.WiiU	{background-position:0 -153px;}
#productList p.platform span.Wii	{background-position:0 -170px;}
#productList p.platform span.iOS	{background-position:0 -187px;}
#productList p.platform span.and	{background-position:0 -204px;}
#productList p.platform span.kind	{background-position:0 -221px;}
#productList p.platform span.CUBE	{background-position:0 -238px;}
#productList p.platform span.BOY	{background-position:0 -255px;}
#productList p.platform span.Mob	{background-position:0 -272px;}
#productList p.platform span.Switch	{background-position:0 -289px;}


#productList div.spec{
	float:right;
	width:210px;
    padding:0;
}

#productList dl dt{
	margin-top:8px;
	font-weight:bold;
}

#productList dl dd{
	margin-left:0;
}

p.info a{
	display:block;
	width:84px;
	height:20px;
	background:url("../img/btn_deriv.png") top no-repeat;
	text-indent:-9999px;
}

.forSite a{
	display:block;
	width:84px;
	height:20px;
	background:url("../img/btn_deriv.png") 0 -20px no-repeat;
	text-indent:-9999px;
}

.forGoods a{
	display:block;
	width:84px;
	height:20px;
	background:url("../img/btn_deriv.png") 0 -40px no-repeat;
	text-indent:-9999px;
}

/*
 製品解説（タイトル個別ページ）
============================*/
.interpretation{
	position:relative;
    padding:0 1em 1em 1em;
}

.interpretation p{
    font-size:14px;
    line-height:1.5;
}

.interpretation img {
	margin-left: 50px;
}

.interpretation span.copy{
	clear:both;
   	font-size:11px;
}

/* 個別ページ大 */
.gameTitle{
   	width:950px;
	margin-bottom:30px;
}

.gameTitle:after{
    content: "."; 
    display: block; 
    height: 0; 
    clear: both; 
    visibility: hidden;
}

.specBox{
	float:left;
	width:290px;
    height:188px;
    margin-left:20px;
	background:url("../img/spec_bg.png") no-repeat;
}

.specBox dl{
	margin-left:6px;
    font-size:14px;
    color:#fff;
}

.specBox dl dt{
	margin:0;
	padding-left:22px;
    background:url("../img/spec_li_style.png") no-repeat;
}

.specBox dl dd{
	margin:0 0 8px 22px;
	padding-right:22px;
    line-height:1.2;
}

.posiR{
	position:relative;
}

.posiR .btn{
	position:absolute;
	right:30px;
    bottom:16px;
}

/* 個別ページ小 */
.gameTitleMini{
	position: relative;
   	width:950px;
	height:360px;
	background:url("../img/titleImg.jpg") no-repeat;
}

.gameTitleMini .artwork{
	position:absolute;
	top:60px;
    left:60px;
	width:306px;
	height:212px;
    text-align:center;
	vertical-align: middle;
}

.gameTitleMini dl{
	position:absolute;
	top:60px;
    left:440px;
   	font-size:13px;
	color:#fff;
}

.gameTitleMini dl dt{
	float:left;
    width:120px;
    margin-bottom:10px;
    margin-right:16px;
    text-align:right;
}

.gameTitleMini dl dd{
    width:320px;
    margin:0 0 10px 120px;
}

.gameTitleMini .forSite{
   	position:absolute;
	bottom:60px;
    right:70px;
}

/*
.main
============================*/
/* ローテーション */
.container .main .rotation{
	position:relative;
    width:680px;
    height:430px;
}


.container .main .rotation .rotationMask{
	position:absolute;
    margin-left:-80px;
    top:0;
}

.container .main .rotation ul li img{
	osition:absolute;
	margin-top:24px;
}

/* PAGER jquery.bxslider.css上書き用 */
.bx-wrapper .bx-pager,
.bx-wrapper .bx-controls-auto {
	position: absolute;
	bottom: 40px;
    right:20px;
	width: 80%;
    z-index:100;
}

.bx-wrapper .bx-pager {
	text-align: right;
	font-size: .85em;
	font-family: Arial;
	font-weight: bold;
	color: #666;
	padding-top: 0px;
}

.bx-wrapper .bx-pager .bx-pager-item,
.bx-wrapper .bx-controls-auto .bx-controls-auto-item {
	display: inline-block;
	*zoom: 1;
	*display: inline;
}

.bx-wrapper .bx-pager.bx-default-pager a {
	background: #666;
	text-indent: -9999px;
	display: block;
	width: 14px;
	height: 14px;
	margin: 0 5px;
	outline: 0;
	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;
	border-radius: 5px;
}

.bx-wrapper .bx-pager.bx-default-pager a:hover,
.bx-wrapper .bx-pager.bx-default-pager a.active {
	background: #000;
}