@charset 'utf-8';

/*-----------------------------------------
 	ageGate
-----------------------------------------*/

#ageGate {
	width:100%;
}

#ageGate .wrapper {
	background:url(../images/agegate/bg_agegate.png) no-repeat center 15px #000;
	-webkit-background-size:contain;
	-moz-background-size:contain;
	-o-background-size:contain;
	-ms-background-size:contain;
	background-size:contain;
}

#ageGate .wrapper #contents {
	background:none;
	
}

#ageGate .inner {
	width:92.5%;
	margin:0 auto;
	position:relative;
}

#ageGate #titleArea {
	width:100%;
	text-align:center;
	padding-top:10px;
	margin-bottom:65px;
}

#ageGate .selectArea {
	width:100%;
}

#ageGate .selectArea .selectInner {
	width:100%;
}

#ageGate .selectArea .selectInner #language {
	width:100%;
	margin-bottom:15px;
}


#ageGate .selectArea .selectInner .text {
	text-align:center;
	width:100%;
	margin-bottom:10px;
}

#ageGate .selectArea .selectInner #language ul {
	width:100%;
	border:2px solid #666;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
}

#ageGate .selectArea .selectInner #language ul li {
	width:50%;
	border-bottom:2px solid #666;
	-webkit-background-size:23px 16px;
	-moz-background-size:23px 16px;
	-o-background-size:23px 16px;
	-ms-background-size:23px 16px;
	background-size:23px 16px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	float:left;
}

#ageGate .selectArea .selectInner #language ul li:nth-of-type(2n) {
	border-left:2px solid #666;
}

#ageGate .selectArea .selectInner #language ul li div {
	width:95.945945945%;
	margin:0 auto;
}

#ageGate .selectArea .selectInner #language ul li div p {
	display:inline-block;
}

#ageGate .selectArea .selectInner #language ul li div .img {
	width:18%;
	margin-right:5px;
	
}


#ageGate .selectArea .selectInner #language ul li:nth-last-child(2) {
	border-bottom:none;
}
#ageGate .selectArea .selectInner #language ul li:last-child {
	border-bottom:none;
}

#ageGate .selectArea .selectInner #language ul li a {
	display:block;
	padding:10px 10px 10px 10px;
	width:100%;
	text-align:left;
	background:url(../images/agegate/check_off.png) no-repeat 96%;
	-webkit-background-size:20px 20px;
	-moz-background-size:20px 20px;
	-o-background-size:20px 20px;
	-ms-background-size:20px 20px;
	background-size:20px 20px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
}

#ageGate .selectArea .selectInner #language ul li a.select {
	background:url(../images/agegate/check_on.png) no-repeat 96%;
	-webkit-background-size:20px 20px;
	-moz-background-size:20px 20px;
	-o-background-size:20px 20px;
	-ms-background-size:20px 20px;
	background-size:20px 20px;
}



#ageGate .selectArea .selectInner #age {
	width:100%;
	margin-bottom:15px;
}

#ageGate .selectArea .selectInner #age .selectList {
	width:100%;
	border:2px solid #666;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	padding:10px 0;
}

#ageGate .selectArea .selectInner #age ul {
	width:90%;
	margin:0 auto;
}

#ageGate .selectArea .selectInner #age ul li {
	display:inline-block;
}

#ageGate .selectArea .selectInner #age ul li select {
	font-size:14px;
	width:80px;
}

#ageGate .selectArea .btnEnter {
	width:100%;
	margin:0 auto 15px;
	
}

#ageGate .selectArea .rating {
	text-align:center;
	margin:0 auto 37px;
}

#ageGate .selectArea .rating .imgRp {
	width:146px;
	height:64px;
}

#ageGate .selectArea .rating .img18 {
	width:46px;
	height:64px;
}

#ageGate .selectArea .selectInner #age .refuse {
	text-align:center;
	font-size:12px;
	padding-top:10px;
}

/*-----------------------------------------
 	index
-----------------------------------------*/

.wrapper {
	background:url(../images/bg_teaser3_tb.jpg) no-repeat 0 44px #000;
	-webkit-background-size:contain;
	-moz-background-size:contain;
	-o-background-size:contain;
	-ms-background-size:contain;
	background-size:contain;
}


.inner {
	width:92.5%;
	margin:0 auto;
	position:relative;
}

.inner .linkPortal {
	width:60%;
	float:left;
	text-align:left;
	margin-top:11px;
	color:#ebebeb;
	line-height:1.25;
	
}
.inner .linkPortal a {
	color:#A8A8A8;
}

#titleArea {
	width:100%;
	text-align:center;
}


#titleArea {
	width:100%;
	text-align:center;
	margin:0 auto;
	padding-top:40%;
	padding-bottom:10px;
}


#titleArea .textCopy {
	width:76%;
	margin:0 auto 0;
	font-size:12px;
	line-height:1.3;
	
}

#titleArea h1 {
	width:90%;
	margin:0 auto;
	
}

#titleArea h2 {
	width:80%;
	margin:0 auto 5px;	
}

.top_notice {
	margin:0 0 15px 0;
}

.top_notice p{
	background-color:#000;
	margin:10px;
	padding:8px 4px;
	text-align:center;
	border:solid 1px #666;
	font-size:0.9em;
	line-height:1.5em;
}

.top_notice p{
	display:block;
	padding:8px 4px;
}

.top_notice .t-bold{
	font-weight:bold;
}

.top_notice .t-red{
	color:#f00;
}

.topBuyArea {
	width:100%;
	margin:0 auto 20px;
	padding-bottom:10px;
	border-bottom:1px solid #222222;
}

.topBuyArea p {
	width:93.4375%;
	margin:0 auto 10px;
}

.topBuyArea p .imgTb {
	display:none;
	
}


.topLinkArea  {
	width:93.75%;
	margin:0 auto 20px;
}

.topLinkArea div {
	width:100%;
	margin:0 auto 10px;
}

.topLinkArea .linkSubTb {
	display:none;
}

.topLinkArea .introLink {
	width:100%;
	margin:0 auto 10px;
	
}
.topLinkArea .buyLink {
	width:100%;
	margin-bottom:10px;
}

.topLinkArea .newsLink {
	width:100%;
	position:relative;
}

.topLinkArea .newsLink .upDate {
	padding:4% 20px 4% 0;
	width:100%;
	position:absolute;
	top:0;
	left:0;
	text-align:right;
	display:block;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	color:#ff0000;
	font-size:16px;
	line-height:1.2;
}


#titleArea .linkTrailer {
	width:91.5625%;
	margin:0 auto 0;
}


#info h3 {
	width:27.1875%;
	margin:0 auto 10px;
}

#info #newsArea {
	width:100%;
	margin:0 auto 25px;
	text-align:left;	
}
#info #newsArea h4 {
	width:100%;
	margin-bottom:10px;
}

#info #newsArea ul li {
	line-height:1.5;
	font-size:12px;
	padding:8px 0;
	background:#111111;
	border-bottom:1px solid #3c3c3c;
}

#info #newsArea ul li:last-child {
	border-bottom:none;
}

#info #newsArea ul li a {
	display:block;
	width:100%;
	background:url(../images/news_arrow.png) no-repeat 96%;
	-webkit-background-size:17px 23px;
	-moz-background-size:17px 23px;
	-o-background-size:17px 23px;
	-ms-background-size:17px 23px;
	background-size:17px 23px;
}

#info #newsArea ul li .date {
	color:#B71515;
	width:92.8125%;
	margin:0 auto;
}

#info #newsArea ul li .text {
	color:#ededed;
	width:92.8125%;
	margin:0 auto;
}



#info #newsArea ul li .text span {
	background:#ff0000;
	color: #ebebeb;
	padding: 1px 2px;
	text-align: center;
	font-size: 9px;
	line-height:1.2;
}

#episodeLink {
	width:100%;
	background:url(../images/bg_episode.jpg) no-repeat center top;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	-ms-background-size:cover;
	background-size:cover;
	padding-bottom:5px;
	margin-bottom:15px;
}

#episodeLink h3 {
	width:100%;
	margin:0 auto 10px;	
}

#episodeLink .episodeBox {
	width:96.875%;
	margin:0 auto 5px;
	padding-bottom:5px;	
	position:relative;
}

#episodeLink .episode04 {
	margin:0 auto;
}

#episodeLink .episodeBox .graBg {
	width:100%;
	position:absolute;
	bottom:0;
	left:0;
	z-index:1;
	opacity:0.5;
	
}

#episodeLink .eArrow {
	width:100%;
	position:absolute;
	left:0;
	top:96.5%;
	z-index:1;
}

#episodeLink .eArrow01 {
}

#episodeLink .eArrow02 {
}

#episodeLink .eArrow03 {
}

#episodeLink .eArrow span {
	width:10.9375%;
	display:block;
	margin:0 auto;
}


#episodeLink .episodeBox .text {
	width:96%;
	padding-top:10px;
	margin:0 auto 10px;
}

#episodeLink .episodeBox.episodeOff .text {
	margin-bottom:20px;
	padding-top:20px;
}



#episodeLink .episode01 .text span {
	width:60.967741935%;
	display:block;
	float:right;
	
}

#episodeLink .episode02 .text span {
	width:54.53125%;
	display:block;
	float:left;
}

#episodeLink .episode03 .text span {
	width:57.5%;
	display:block;
	float:right;
	
}

#episodeLink .episode04 .text span {
	width:58.28125%;
	display:block;
	float:left;
}




#episodeLink .episodeBox .linkBtn {
	width:96%;
	margin:0 auto;
	position:relative;
	z-index:100;
}


@media only screen and (orientation:landscape){

#episodeLink .episodeBox .linkBtn {
	margin:0 auto 10px;
}

}


#episodeLink .episodeBox .linkBtn a {
	width:100%;
	display:block;
	background:url(../images/btn_bg.png) no-repeat center top;
	-webkit-background-size:contain;
	-moz-background-size:contain;
	-o-background-size:contain;
	-ms-background-size:contain;
	background-size:contain;
	font-size:14px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	padding:19px 0;
}


#episodeLink .episode01 {
	background:url(../images/bg_episode01.jpg) no-repeat center top;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	-ms-background-size:cover;
	background-size:cover;
}

#episodeLink .episode02 {
	background:url(../images/bg_episode02.jpg) no-repeat center top;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	-ms-background-size:cover;
	background-size:cover;
}

#episodeLink .episode03 {
	background:url(../images/bg_episode03.jpg) no-repeat center top;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	-ms-background-size:cover;
	background-size:cover;
}

#episodeLink .episode04 {
	background:url(../images/bg_episode04.jpg) no-repeat center top;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	-ms-background-size:cover;
	background-size:cover;
}

#episodeLink .episode04.episodeOff {
	background:url(../images/bg_episode04_off.jpg) no-repeat center top;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	-ms-background-size:cover;
	background-size:cover;
}
.bnrPackage {
	width:93.75%;
	margin:0 auto 25px;
	background:url(../images/bg_bnr.png) no-repeat right top;
	-webkit-background-size:contain;
	-moz-background-size:contain;
	-o-background-size:contain;
	-ms-background-size:contain;
	background-size:contain;
	border:1px solid #555555;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	padding:20px 0 0 10px;
}

.bnrPackage .text {
	width:63.33333%;
	margin-bottom:10px;	
}

.bnrPackage  .linkBtn {
	width:100%;
	margin:0 auto 10px;
	
}

.bnrPackage  .linkBtn a {
	width:100%;
	display:block;
	background:url(../images/btn_bnr.png) no-repeat center top;
	-webkit-background-size:contain;
	-moz-background-size:contain;
	-o-background-size:contain;
	-ms-background-size:contain;
	background-size:contain;
	font-size:14px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	padding:14px 0;
}

.pageTop {
	margin-bottom:15px;
	
}

.qaArea {
	width:100%;
	padding-top: 5px;
	padding-bottom:15px;
	line-height: 1.5;
	margin:0 auto 15px;
	border-bottom:2px solid #333;
}


.qaArea .title {
	width:75%;
	margin:0 auto 15px;
}

.qaArea ul {
	width:93.75%;
	margin:0 auto;
	
}


.qaArea ul  li {
	width:30%;
	text-align:center;
	font-size:12px;
	line-height:1;
	display:inline-block;
	margin:0 1% 10px;
}

.qaArea ul li a {
	width:auto;
	border:1px solid #fff;
	padding:15px 0;
	display:block;
}


/*----------------
	ipad
-----------------*/

@media only screen and (min-device-width: 768px) and (max-device-width: 1024px) {

#ageGate .wrapper {
	background:url(../images/agegate/bg_agegate_tb.png) no-repeat center -10px #000;
	-webkit-background-size:contain;
	-moz-background-size:contain;
	-o-background-size:contain;
	-ms-background-size:contain;
	background-size:contain;
}
 
body {
	font-size:16px;
	line-height:16px;
}

#ageGate #titleArea {
	width:100%;
	text-align:center;
	margin-bottom:125px;
	padding-top:45px;
}

#ageGate #titleArea h1 {
	margin-top:-15px;
	
}


#ageGate .selectArea .selectInner .text {
	text-align:center;
	width:75%;
	margin:0 auto 10px;
}

#ageGate .selectArea .selectInner #language ul li a {
	padding:15px 10px;	
}

#ageGate .selectArea .selectInner #language ul li div .img {
	width:8%;
	
}

#ageGate .selectArea .selectInner #age ul li select {
	font-size:14px;
	width:100px;
}

#ageGate .selectArea .btnEnter {
	width: 50%;
	margin: 0 auto 15px;
}

footer .logoCapcom {
	width: 16.05%;
}

footer .copy {
	width: 45.932432%;
	margin-top: 25px;
	float: right;
}

footer .re_copy {
	width: 45.932432%;
	margin-top: 25px;
	float: right;
}


.wrapper {
	background:url(../images/bg_teaser3_tb.jpg) no-repeat 0 44px #000;
	-webkit-background-size:contain;
	-moz-background-size:contain;
	-o-background-size:contain;
	-ms-background-size:contain;
	background-size:contain;
}

#titleArea {
	width:100%;
	text-align:center;
	margin:0 auto 20px;
}




#titleArea h1 {
	width:75%;
	margin-bottom:0;	
}

#titleArea h2 {
	width:65%;
	margin:0 auto;	
}

.topBuyArea p {
	margin-bottom:10px;
	
}

.topBuyArea p .imgSp {
	display:none;
}

.topBuyArea p .imgTb {
	display:block;
}



.topLinkArea .linkSubTb {
	display:block;
}




.topLinkArea .newsLink .upDate {
	padding:2.5% 20px 4% 0;
	width:100%;
	position:absolute;
	top:0;
	left:0;
	text-align:right;
	display:block;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	color:#ff0000;
	font-size:24px;
	line-height:1.2;
}



.topLinkArea .linkSubSp {
	display:none;
}

#titleArea .topLinkArea div .title {
	margin-bottom:10px;
}

#episodeLink .episode01 {
	background:url(../images/bg_episode01_tb.jpg) no-repeat center top;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	-ms-background-size:cover;
	background-size:cover;
}

#episodeLink .episode02 {
	background:url(../images/bg_episode02_tb.jpg) no-repeat center top;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	-ms-background-size:cover;
	background-size:cover;
}

#episodeLink .episode03 {
	background:url(../images/bg_episode03_tb.jpg) no-repeat center top;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	-ms-background-size:cover;
	background-size:cover;
}

#episodeLink .episode04 {
	background:url(../images/bg_episode04_tb.jpg) no-repeat center top;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	-ms-background-size:cover;
	background-size:cover;
}

#episodeLink .episode04.episodeOff {
	background:url(../images/bg_episode04_off_tb.jpg) no-repeat center top;
	-webkit-background-size:cover;
	-moz-background-size:cover;
	-o-background-size:cover;
	-ms-background-size:cover;
	background-size:cover;
}

#episodeLink .episodeBox .text {
	width:90%;
	padding-top:30px;
	margin-bottom:10px;
}

#episodeLink .episodeBox.episodeOff .text {
	margin-bottom:0;
}

#episodeLink .episode01.episodeOff .text {
	padding-top:40px;
	margin-bottom:60px !important;
}


#episodeLink .episode01 .text span {
	width:46%;
	
}

#episodeLink .episode02 .text span {
	width:42.674731182%;
}

#episodeLink .episode02.episodeOff .text span {
	padding: 4% 0 7%;
}

#episodeLink .episode03 .text span {
	width:45.900537634%;
	
}

#episodeLink .episode03.episodeOff .text span {
	padding: 4% 0 7%;
}



#episodeLink .episode04 .text span {
	width:45.900537634%;
}

#episodeLink .episode04.episodeOff .text span {
	padding: 4% 0 7%;
}



#episodeLink .episodeBox .linkBtn {
	width:90%;
	margin:0 auto 40px;
}

#episodeLink .episodeBox .linkBtn a {
	width:46%;
	display:block;
}

#episodeLink .episode01 .linkBtn a {
	float:right;
}

#episodeLink .episode02 .linkBtn a {
	float:left;
}

#episodeLink .episode03 .linkBtn a {
	float:right;
}

#episodeLink .episode04 .linkBtn a {
	float:left;
}

#episodeLink .eArrow {
	top:93.5%;
}

.bnrPackage {
	width:93.75%;
	margin:0 auto 15px;
	background:url(../images/bg_bnr_tb.jpg) no-repeat right top;
	-webkit-background-size:contain;
	-moz-background-size:contain;
	-o-background-size:contain;
	-ms-background-size:contain;
	background-size:contain;
	border:1px solid #555555;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	padding:20px 0 0 30px;
}


.bnrPackage .text {
	width:59.33333%;
	margin-bottom:10px;	
}

.bnrPackage .linkBtn {
	width:86%;
	margin:0 0 10px;
	
}

.bnrPackage  .linkBtn a {
	width:69%;
	display:block;
	background:url(../images/btn_bnr.png) no-repeat center top;
	-webkit-background-size:contain;
	-moz-background-size:contain;
	-o-background-size:contain;
	-ms-background-size:contain;
	background-size:contain;
	font-size:14px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	-o-box-sizing: border-box;
	-ms-box-sizing: border-box;
	padding:14px 0;
}



}

@media only screen and 
(min-device-width : 768px) and 
(max-device-width : 1024px) and 
(orientation : landscape) {
	

#episodeLink .episode01 .text span {
	width:40%;
	
}

#episodeLink .episode02 .text span {
	width:36.674731182%;
}

#episodeLink .episode03 .text span {
	width:39.900537634%;
	
}

#episodeLink .episode04 .text span {
	width:39.900537634%;
}


#episodeLink .episode02.episodeOff .text span {
	padding: 6% 0 9%;
}


#episodeLink .episode03.episodeOff .text span {
	padding: 6% 0 9%;
}

#episodeLink .episode04.episodeOff .text span {
	padding: 6% 0 9%;
}




#episodeLink .episode02 .linkBtn a,
#episodeLink .episode04 .linkBtn a {
	width:34%;
	
}


}