/* CSS Document */





/* .mainvision
==============================*/

#main .mainvision .left-part {
	float: left;
	width: 40.81632653061224%;
	padding-left: 2.040816326530612%;
	padding-right: 3.0612244898%;/* 30/980 */
}

#main .main-inner .right-part {
	float: right;
}


#main .mainvision .right-part {
	float: right;
	width:48.8775510204%;/* 479/980 */
	padding-left:	0px;
	padding-right: 5.10204081633%;/* 50/980 */
	padding-right: 2.6%\9;
	*padding-right: 2.6%;
}



#main .main-inner .right-part .tori{
	padding-top: 20px;
	display: block;
	height: auto;
}
#main .main-inner .right-part .tori a{
	height: auto;
}
#main .main-inner .right-part .banner{
	display: block;
	text-align: center;
}
#main .main-inner .right-part .b2{
	margin: 20px 0 0 0;
}
#main .mainvision .right-part .lead {
	text-indent: -0.5em;
	padding-left: 0;
	font-size:	18px;
	text-align:	center;
	padding-bottom:	30px !important;
}
#main .mainvision .right-part .store-button{
	margin:		5px auto 0;
}

#main .mainvision .right-part .store-text{
	text-align: center;
	padding-top: 10px;
	font-size: 14px;
	font-weight: bold;
}

#main .mainvision .right-part .release-date{
	font-size:	15px;
	font-weight:	bold;
	color:		#c90002;
	text-align:	center;
	display:	block;
	padding:	50px 0 5px;
}


/*
.gall
スライドjs
--------------------*/
#rim-tpl-header #rim-tpl-categorynav{
	z-index: 1100;
}

#rim-tpl-header #rim-tpl-categorynav .rim-tpl-sub-box{
	z-index: 1101;
}

#head-area .inner{
	z-index: 1000;
}


#gall .bx-controls-direction {
    display: none;
}

.mainvision .left-part #gall{
	position:		relative;
	transform-origin: 0 0;
	-webkit-transform-origin: 0 0;
	-o-transform-origin: 0 0;
	-ms-transform-origin: 0 0;
}

.mainvision .left-part #gall .stage{
	margin:			0 auto;
	position:		relative;
}


.mainvision .left-part #gall .stage{
}


.mainvision .left-part #gall .thumbs{
	margin:			0 auto;
	width:			100%;
	text-align:		center;
	white-space:		nowrap;
}

.mainvision .left-part #gall .thumbs a{
	float:			left;
	display:		inline-block;
	margin:			0 2px 2px 0;
	width:			74px;
	height:			74px;
	overflow:		hidden;
	border:			1px solid #cccccc;
}


.mainvision .left-part #gall .thumbs a.active{
	border-color:		#666666;
}



@media screen and (max-width: 640px) {
	.mainvision .left-part #gall .thumbs ul{
		text-align:center;
		margin:0 auto;

		max-width:300px;
		width:100%;
	}

	.mainvision .left-part #gall .thumbs ul li{
		display:inline-block;
		*display:inline;
		*zoom:1;
		float:none;
		width:18.5%;/* 78/400 */
		padding:0 0 0 0;/* 4/400 */
	}

	.mainvision .left-part #gall .thumbs ul li a{
		width: 100%;
		height: 100%
	}

	.mainvision .left-part #gall .thumbs ul li a img{
		width: 100%;
		height: auto;
		max-width: 74px;
	}

}


#main .main-inner .news{

}

#main .main-inner .news dd.newsblock ul li a {
	background: url("/common/img/icon-cursor.png") no-repeat scroll 0 6px;
	padding-left: 12px;
	margin-right: 12px;
}


/*
.award
--------------------*/



#main .mainvision .award{
	display: table;
	margin: 25px auto 20px;
}
#main .mainvision .award span{
	display: table-cell;
	vertical-align: middle;
}
#main .mainvision .award span.awa-logo{
	width: 62px;
}
#main .mainvision .award span.awa-text{
	font-size: 16px;
	padding-top: 11px;
	font-weight: bold;
	line-height: 1.4;
	padding-left: 10px;
}



@media screen and (max-width: 640px) {
	#main .mainvision .left-part,
	#main .mainvision .right-part {
		float: none;
		width: 100% !important;
	}

	#main .mainvision .left-part #gall {
		width: 100% !important;
	}
	#main .mainvision .left-part #gall {
		position: relative;
		transform-origin: 0 0 0;
	}

	#main .mainvision .right-part {
		padding-right: 0;
	}

	#main .mainvision .right-part img {
		margin-top: 0;
	}


			#gall img {
				max-width: 84.375%;
				margin: 0 auto;
			}
			#gall .bx-controls-direction{
				display: block;
			}
			#gall .bx-controls-direction .bx-prev {
				width: 30px;
				display: block;
				overflow: hidden;
				height: 0;
				padding: 60px 0 0 0;
				background: url(/english/products/common/img/bod_acc_pre.jpg) no-repeat;
				position: absolute;
				left: 0;
				top: 35%;
				margin-top:-15%;
				z-index:55;
			}
			#gall .bx-controls-direction .bx-next {
				width: 30px;
				display: block;
				overflow: hidden;
				height: 0;
				padding: 60px 0 0 0;
				background: url(/english/products/common/img/bod_acc_nex.jpg) no-repeat;
				position: absolute;
				right: 0;
				top: 35%;
				margin-top:-15%;
				z-index:55;
			}

}


/* .campaign
==============================*/

#main .campaign{
	margin-bottom: 50px;
}

#main .campaign .cam-section{
	display: table;
}

#main .campaign .cam-section .cam-visual,
#main .campaign .cam-section .cam-text{
	display: table-cell;
	vertical-align: middle;
	width: 50%; /* 490/980 */
}

#main .campaign .cam-section .cam-visual .cam-inner{
	padding-left: 4.081633%; /* 20/490 */
}
#main .campaign .cam-section .cam-text .cam-inner{
	padding-left: 5.510204%; /* 27/490 */
	padding-right: 4.081633%; /* 20/490 */
}

#main .campaign .cs-revers .cam-visual .cam-inner{
	padding-left: 0;
	padding-right: 4.081633%; /* 20/490 */
}
#main .campaign .cs-revers .cam-text .cam-inner{
	padding-left: 4.081633%; /* 20/490 */
	padding-right: 5.510204%; /* 27/490 */
}

#main .campaign .cam-section .cam-text p{
	font-size: 14px;
	line-height: 1.4;
}

#main .campaign .cam-section .cam-text a{
	display: inline-block;
	margin-top: 10px;
}



@media screen and (max-width: 640px) {
	#main .campaign .cam-section,
	#main .campaign .cam-section .cam-visual,
	#main .campaign .cam-section .cam-text{
		display: block;
	}

	#main .campaign .cam-section{
		position: relative;
	}

	#main .campaign .cam-section .cam-visual,
	#main .campaign .cam-section .cam-text{
		width: 100%;
	}


	#main .campaign .cs-revers .cam-visual{
		position: absolute;
		top: 0;
	}
	#main .campaign .cam-section .cam-visual .cam-inner{
		padding: 0;
	}

	#main .campaign .cam-section .cam-text .cam-inner{
		padding: 10px 0;
		text-align: left;
	}

}



/* .campaign-col2
==============================*/

#main .main-inner .campaign-col2{
	border-top: solid 1px #CCC;
	padding: 30px 0;
}

#main .main-inner .campaign-col2 .left-part,
#main .main-inner .campaign-col2 .right-part{
		width: 46.94%;/* 460/980* */
}
#main .main-inner .campaign-col2 img{
	width: 100%;
}
#main .main-inner .campaign-col2 .right-part{
	margin-left: 2.04%;/* 20/980 */
}
#main .main-inner .campaign-col2 h3{
	font-size: 16px;
	font-weight: bold;
	padding-bottom: 10px;
}
#main .main-inner .campaign-col2 p{
	padding-top: 10px;
	line-height: 1.6;
}
#main .main-inner .campaign-col2 .link-cursor{
	display: inline-block;
	margin-top: 10px;
}


@media screen and (max-width: 640px) {
	#main .main-inner .campaign-col2{
		padding: 30px 0;
	}

	#main .main-inner .campaign-col2 .left-part,
	#main .main-inner .campaign-col2 .right-part{
			width: 100%;
	}
	#main .main-inner .campaign-col2 .right-part{
		margin-top: 20px;
		margin-left: 0;
	}
	#main .main-inner .campaign-col2 h3{
		font-size: 18px;
		padding-bottom: 10px;
	}
	#main .main-inner .campaign-col2 p{
		padding-top: 10px;
	}
	#main .main-inner .campaign-col2 .link-cursor{
		display: inline-block;
		margin-top: 10px;
	}
}




/*
.article
--------------------*/

#main .main-inner .article .text-title-lv2{
	font-size:32px;
}


#main .main-inner .article .img-box-col2{
	margin-bottom: 10px;
	width: 750px;
	margin: 0 auto;
}
#main .main-inner .article p{
	font-size: 24px;
    color: #999;
	line-height: 1.4;
}
	#main .main-inner .article .img-box-col2 .left{
		width: 30.266666666%;/* 227/750 */
		float: left;
	}
	#main .main-inner .article .img-box-col2 .left p{
		margin-bottom: 12px;
	}
	#main .main-inner .article .img-box-col2 .right{
		width: 65.866666666%;/* 494/750 */
		float: right;
	}
#main .main-inner .article .img-box-col3{
	padding: 5px 0;
	background-color: #eee;
}
	#main .main-inner .article .img-box-col3 .title{
		padding: 5px 0 5px 10px;
	}
	#main .main-inner .article .img-box-col3 p{
		width:32%;
		float: left;
		margin-left: 1%;
		text-align: center;
	}
#main .main-inner .article .text-box-col2{
}
	#main .main-inner .article .text-box-col2 .text-box{
		width: 72%;
	}
	#main .main-inner .article .text-box-col2 .img-box{
		width: 26%;
	}

	#main .main-inner .article .text-box-col2 p.left{
		float: left;
	}
	#main .main-inner .article .text-box-col2 p.right{
		float: right;
	}



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

	#main .main-inner .article .img-box-col2 {
		margin-bottom: 10px;
		width: 100%;
	}

	#main .main-inner .article .img-box-col2 .left{
		width: 100%;
		float: none;
		max-width: 460px;
		margin: 0 auto;
	}

	#main .main-inner .article .img-box-col2 .left p{
		margin-bottom: 12px;
		float: left;
	}

	#main .main-inner .article .img-box-col2 .left p.sp-left{
		width: 48.913043478%;/* 225/460 */
		float: left;
	}

	#main .main-inner .article .img-box-col2 .left p.sp-right{
		width: 48.913043478%;/* 225/460 */
		float: right;
	}

	#main .main-inner .article .img-box-col2 .left p img{
		max-width: 225px;
	}

	#main .main-inner .article .img-box-col2 .right{
		width: 100%;
		float: none;
	}

	#main .main-inner .article .img-box-col2 .right img{
	}

	#main .main-inner .article .img-box-col2 .img-box img,
	#main .main-inner .article .img-box-col3 .img-box img,
	#main .main-inner .article .text-box-col2 .img-box img{
		min-width: 0;
	}
}




/*
.lineup
--------------------*/

#main .main-inner .lineup ul {
	padding: 20px 0 50px;
}

#main .main-inner .lineup ul li {
	display: inline-block;
	margin: 0 0.91836734693%;
	text-align: center;
	vertical-align: top;
	width: 29.79%;/* 292/980 */
}
#main .main-inner .lineup ul li img {
	width: 100%;
}



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

	#main .main-inner .lineup ul {
	text-align: center;
	padding: 0 0 40px;
	}
	#main .main-inner .lineup ul li {
		width: 100%;
		display: inline-block;
		vertical-align: top;
		padding: 10px 0;
		margin: 0;
	}
	.ie7 #main .main-inner .lineup ul li {
		width: 100%;
		display: inline;
		margin-bottom: 20px;
		zoom:1;
	}
	#main .main-inner .lineup ul li img {
		max-width: 292px;
	}

}

/*
ss
*/

    #main .main-inner .introduction{
		border-top: solid 1px #CCC;
		padding-top: 30px;
    }

    #main .main-inner .introduction .inner{
        width:95.9%;/* 490/980 */
		margin: 0 auto;
    }

    #main .main-inner .introduction h2{
        font-size: 34px;
        font-weight: bold;
    }
    #main .main-inner .introduction h3{
        font-size: 18px;
        padding-bottom: 8px;
        margin-top: 6px;
		font-weight: bold;
    }
    #main .main-inner .introduction p.body{
        font-size: 14px;
        line-height: 1.8;
        margin-top: 10px;
    }
	#main .main-inner .introduction .intro_img{
		margin-top: 20px;
		margin-bottom: 30px;
	}

	#main .main-inner .introduction .intro_img img{
		width: 100%;
	}


	/* .article
	-----------------------*/
	#main .main-inner .article.k1_01{
		padding: 0 0 0;
	}

    /* left-part
    -----------------------*/
    #main .main-inner .article .left-part{
        float:left;
        width:50.0%;/* 490/980 */
        padding-left:2.040816326530612%;/* 20/980 */
    }

    /* right-part
    -----------------------*/
    #main .main-inner .right-part{
		position: relative;
        float:left;
        width:45.918%;/* 450/980 */
        padding-right:0;/* 20/980 */
        padding-left:0;/* 0/980 */
		min-height: 340px;
    }

    #main .main-inner .article.k1_01.box3 .right-part{
		min-height: 287px;
    }

    #main .main-inner .article.k1_01 .right-part img{
		position: absolute;
		bottom: 0;
    }


    #main .main-inner .article.k1_01.last-article .right-part img{
		    top:0;
    }

	#main .main-inner .right-part p.date {
		color: #c90002;
		font-size: 14px;
		font-weight: bold;
		padding: 10px 0 !important;
		text-align: center;
	}


    @media only screen and (max-width: 640px){
        #main .main-inner .article .left-part {
            float: none;
            width: 100%;
            padding: 0 !important;
        }
        #main .main-inner .right-part{
            width: 100%;
        }

        #main .main-inner .introduction{
            background: none;
            height: auto;
            padding-left: 0;
            padding-top: 20px;
            margin-bottom: 0;
			width: 100%;
        }

        #main .main-inner .introduction h2{
            font-size: 34px;
            font-weight: bold;
            letter-spacing: 0.0em;
            margin-bottom: 5px;
        }

        #main .main-inner .introduction h3{
            font-size: 18px;
            letter-spacing: 0.0em;
            display: block;
            padding-bottom: 3px;
            margin-top: 4px;
        }

        #main .main-inner .introduction p.body{
            font-size: 13px;
            letter-spacing: 0.0em;
            line-height: 1.6;
            margin-top: 10px;
        }

        #main .main-inner .article .text-title-lv2{
            font-size:24px;
        }

        #main .main-inner .article p{
            font-size: 16px;
            color: #999;
            line-height: 1.4;
        }

		#main .main-inner .article.k1_01 .right-part img{
			position: static;
			bottom: 0;
		}

		#main .main-inner .article.k1_01.box1 .right-part{
			min-height: 0;
		}

		#main .main-inner .article.k1_01.box2 .right-part{
			min-height: 0;
		}

		#main .main-inner .article.k1_01.box3 .right-part{
			min-height: 0;
		}

		#main .main-inner .mainvision .right-part{
			position: static;
			float:left;
			width:45.918%;/* 450/980 */
			padding-right:2.040816326530612%;/* 20/980 */
			padding-left:0;/* 0/980 */
			min-height: 0;
		}
		#main .mainvision .right-part .lead {
			padding-bottom: 0 !important;
		}
    }

    /*
.banner-group
--------------------*/
#main .main-inner .banner-group{
	display: flex;
	flex-wrap: wrap;
	justify-content: space-between;
	width: 100%;
	margin: 20px 0;
}
#main .main-inner .banner-group .banner-item{
		width: 49.5%;
		margin-bottom: 10px;
	}
	#main .main-inner .banner-group .banner-item img{
			width: 100%;
		}

@media screen and (max-width: 640px){
	#main .main-inner .banner-group{
		margin-bottom: 20px;
	}
	#main .main-inner .banner-group .banner-item{
		width: 100%;
	}
}