@charset "UTF-8";

/*
=====================================================================
*
*    MainBlock
*
* ===================================================================

*/

#Header .mainBlock .container{
	width: 320px;
}

	#Header .mainBlock .image{
		width: 320px;
		margin: 0 auto;
	}

	#Header .mainBlock .container{
		width: 100%;
		height: 90px;
		margin: 0 auto;
		padding-top: 285px;
	}

	#Header .mainBlock .container .ds3inner{
		width: 50%;
		background-image: url(../images/common/bg/bg-top-3ds.png);
		background-position: left top;
		background-size: 5px 90px;
		float: left;
	}

		#Header .mainBlock .container .ds3inner .date3ds{
			text-align: right;
		}


	#Header .mainBlock .container .wiiuinner{
		width: 50%;
		background-image: url(../images/common/bg/bg-top-wiiu.png);
		background-position: left top;
		background-size: 5px 90px;
		float: right;
	}

		#Header .mainBlock .container .ds3inner .dateWiiu{
			text-align: left;
		}

	#Header .mainBlock{
		height: 336px;
	}


	.ds3 #Header .mainBlock{
		height: 285px;
	}


/*
=====================================================================
*
*
*
* ===================================================================

*/

#Wrapper{
	background-color: #F4F4F4;
}

/*---------------------------------------------------
*   captureBlock
---------------------------------------------------*/
#IndexSection .captureBlock {
	margin-bottom: 12px;
}
	#IndexSection .captureBlock .container {
		width: 306px;
	}

	body.wiidaily #IndexSection .captureBlock .container {
		height: 175px;
		background: url(../images/index/bg/capture-wii.png) no-repeat 0px 0px;
		background-size: 306px 175px;
	}
	body.ds3daily #IndexSection .captureBlock .container {
		height: 187px;
		background: url(../images/index/bg/capture-3ds.png) no-repeat 0px 0px;
		background-size: 306px 187px;
	}

		#IndexSection .captureBlock .container a {
			display: block;
			width: 290px;
			margin-left: auto;
			margin-right: auto;
			padding-top: 6px;
		}
			#IndexSection .captureBlock .container a .icon {
				position: absolute;
				display: block;
				width: 47px;
				height: 47px;
			}
			body.wiidaily #IndexSection .captureBlock .container a .icon {
				background: url(../images/index/image/icon-capture-wii.png) no-repeat 0px 0px;
				background-size: 47px 47px;
			}
			body.ds3daily #IndexSection .captureBlock .container a .icon {
				background: url(../images/index/image/icon-capture-3ds.png) no-repeat 0px 0px;
				background-size: 47px 47px;
			}


/*---------------------------------------------------
*   bannerBlock
---------------------------------------------------*/
#IndexSection .developerBlock {
	margin-bottom: 15px;
}
	#IndexSection .developerBlock a {
		display: block;
		width: 302px;
		height: 111px;
		margin-left: auto;
		margin-right: auto;
	}

#IndexSection .switch {
    width: 300px;
    margin: 15px auto;
}

#IndexSection .bnr-direct {
    width: 300px;
    margin: 15px auto;
}

/*---------------------------------------------------
*   newCharacterBannerBlock
---------------------------------------------------*/
#IndexSection .newCharacterBannerBlock {
	margin-bottom: 15px;
	display: none;
}

.ds3 #IndexSection .newCharacterBannerBlock {
	margin-bottom: 15px;
}
	#IndexSection .newCharacterBannerBlock ul{
		width: 300px;
		margin: 0 auto;
	}

	#IndexSection .newCharacterBannerBlock ul li{
		width: 300px;
		margin-bottom: 1px;
		display: block;
	}

	#IndexSection .newCharacterBannerBlock ul li.last{
		margin-bottom: 0px;
	}

/*---------------------------------------------------
*   newsBlock
---------------------------------------------------*/
#IndexSection .newsBlock {
	margin-bottom: 8px;
}
	#IndexSection .newsBlock .container {
		width: 303px;
		height: 33px;
		background: url(../images/index/bg/news.png) no-repeat 0px 0px;
		background-size: 303px 33px;
	}

		#IndexSection .newsBlock .left {
			width: 270px;
			height: 33px;
		}

			#IndexSection .newsBlock ul {
				position: absolute;
				width: 260px;
				height: 33px;
				overflow: hidden;
				margin-left: 8px;
			}

				#IndexSection .newsBlock ul li {
					height: 33px;
					margin-right: 10px;
					line-height: 34px;
				}

					#IndexSection .newsBlock ul li div {
						float: left;
					}

					#IndexSection .newsBlock ul li .type {
						display: block;
						width: 64px;
						height: 16px;
						margin: 8px 10px 0 0;
						background: url(../images/index/image/news-type.png) no-repeat;
						background-size: cover;
					}

						#IndexSection .newsBlock ul li.global .type {
							background-position: 0 0;
						}

						#IndexSection .newsBlock ul li.ds3 .type {
							background-position: 0 -16px;
						}

						#IndexSection .newsBlock ul li.wiiu .type {
							background-position: 0 -32px;
						}

					#IndexSection .newsBlock ul li .date {
						margin-right: 10px;
						font-size: 10px;
						font-weight: bold;
					}

					#IndexSection .newsBlock ul li .text {
						font-size: 11px;
						color: #1A1A1A;
					}
						#IndexSection .newsBlock ul li .text a {
							color: #1A1A1A;
							text-decoration: underline;
						}


		#IndexSection .newsBlock .right {
			float: left;
			width: 31px;
		}
			#IndexSection .newsBlock .right a {
				display: block;
				height: 32px;
				background: url(../images/index/btn/news.png) no-repeat 0px 0px;
				background-size: 31px 32px;
			}


#IndexSection.miiverse .newsBlock .container {
	height: 46px;
	background: none;
	box-shadow:1px 1px 0 0 rgba(0,0,0,0.2);
	-moz-box-shadow:1px 1px 0 0 rgba(0,0,0,0.2);
	-webkit-box-shadow:1px 1px 0 0 rgba(0,0,0,0.2);
}
#IndexSection.miiverse .newsBlock .left {
	height: 46px;
}
#IndexSection.miiverse .newsBlock ul{
	height: 46px;
}
#IndexSection.miiverse .newsBlock ul li{
	height: 46px;
	line-height: 20px;
}
/*---------------------------------------------------
*   movieBtn
---------------------------------------------------*/

#IndexSection .movieBtn {
	width: 300px;
	margin: 0 auto 15px auto;
}

/*---------------------------------------------------
*   modalNewsBtn
---------------------------------------------------*/

#IndexSection .modalNewsBtn {
	width: 300px;
	margin: 0 auto 30px auto;
}

/*---------------------------------------------------
*   characterBlock
---------------------------------------------------*/
#IndexSection .characterBlock {
}
	#IndexSection .characterBlock .title {
		text-align: center;
		margin-bottom: 5px;
	}
	#IndexSection .characterBlock .container {
		width: 303px;
	}
		#IndexSection .characterBlock .container ul {}

			#IndexSection .characterBlock .container ul li {
				float: left;
				margin-right: 9px;
			}
			#IndexSection .characterBlock .container ul li.turn {
				margin-right: 0px;
			}
				#IndexSection .characterBlock .container ul li .update {
					display: block;
					margin-left: -3px;
					margin-top: 5px;
				}

/*
=====================================================================
*
*    CaptuerSection
*
* ===================================================================
*/

#CaptuerSection{
}

	#CaptuerSection .content {
		background: #333;
		padding-top: 50px;
	}

	#CaptuerSection .bg {
		background: #333;
	}


	#CaptuerSection .headerBlock .logoBlock {
		padding-left: 10px;
		padding-right: 5px;
		padding-top: 5px;
		margin-bottom: 18px;
	}

		#CaptuerSection .headerBlock .left {
			padding-top: 4px;
		}

		#CaptuerSection .headerBlock .logoBlock .left a {}

		#CaptuerSection .headerBlock .logoBlock .right {}

			#CaptuerSection .headerBlock .logoBlock .right .flL {
				padding-right: 5px;
				background: url(../images/common/bg/header-border.png) no-repeat right center;
			}

			#CaptuerSection .headerBlock .logoBlock .right .flR {
				padding-left: 5px;
			}


		#CaptuerSection .content .contentBlock {
			width:90%;
			margin-left: auto;
			margin-right: auto;
			margin-bottom: 40px;
		}

		#CaptuerSection .content .contentBlock .title {
			width: 192px;
			margin-left: auto;
			margin-right: auto;
			margin-top: 30px;
			margin-bottom: 30px;
		}

			#CaptuerSection .content .contentBlock .text{
				margin-left: auto;
				margin-right: auto;
				color: #F7F8F8;
 				margin-top: 30px;
 				text-align: center;
			}

			#CaptuerSection .content .contentBlock .text a{
				color: #FFFD38;
				text-decoration: underline;
			}

			body.ds3daily #CaptuerSection .content .contentBlock .image{
				margin-left: auto;
				margin-right: auto;
				border: 3px solid #D31320;
			}

			body.ds3daily #CaptuerSection .content .contentBlock .label{
				position: absolute;
				display: block;
				width: 47px;
				height: 47px;
				margin-top: 0px;
				margin-left: 0px;
				background: url(../images/index/image/icon-daily-3ds.png) no-repeat;
				background-size: 47px 47px;
			}

			body.wiidaily #CaptuerSection .content .contentBlock .image{
				margin-left: auto;
				margin-right: auto;
				border: 3px solid #0097CB;
			}

			body.wiidaily #CaptuerSection .content .contentBlock .label{
				position: absolute;
				display: block;
				width: 47px;
				height: 47px;
				margin-top: 0px;
				margin-left: 0px;
				background: url(../images/index/image/icon-daily-wii.png) no-repeat;
				background-size: 47px 47px;
			}

	#CaptuerSection .content .closeBtnBlock{
		width: 29px;
		margin-left: auto;
		margin-right: auto;
		padding-bottom: 80px;
	}

/*
=====================================================================
*
*    NewsSection
*
* ===================================================================
*/
#NewsSection {
}

	#NewsSection .content {
		background-color: #333;
		padding-top: 50px;
	}

	#NewsSection .bg {
		background-color: #333;
	}

	#NewsSection .headerBlock .logoBlock {
		padding-left: 10px;
		padding-right: 5px;
		padding-top: 5px;
		margin-bottom: 18px;
	}

		#NewsSection .headerBlock .left {
			padding-top: 4px;
		}

		#NewsSection .headerBlock .logoBlock .left a {}

		#NewsSection .headerBlock .logoBlock .right {}

			#NewsSection .headerBlock .logoBlock .right .date {
				padding-right: 5px;
				background: url(../images/common/bg/header-border.png) no-repeat right center;
			}

			#NewsSection .headerBlock .logoBlock .right .text {
				padding-left: 5px;
			}


		#NewsSection .content .contentBlock{
			width: 300px;
			margin-left: auto;
			margin-right: auto;
			margin-bottom: 20px;
		}


		#NewsSection .content .contentBlock .news {
		    margin-top: 40px;
		    margin-left: auto;
		    margin-right: auto;
		}

		#NewsSection .content .contentBlock .news ul li{
			width: 300px;
		}

		#NewsSection .content .contentBlock .news ul li .type{
			display: block;
			float: left;
			height: 16px;
			width: 64px;
			margin: 0px 10px 5px 0px;
			background: url( ../images/index/image/news-type.png ) no-repeat;
			background-size: cover;
		}

			#NewsSection .content .contentBlock .news ul li.global .type{
				background-position: 0 0;
			}

			#NewsSection .content .contentBlock .news ul li.ds3 .type{
				background-position: 0 -16px;
			}

			#NewsSection .content .contentBlock .news ul li.wiiu .type{
				background-position: 0 -32px;
			}

		#NewsSection .content .contentBlock .news ul li .date{
			float: none;
			color: #fff;
			margin-bottom: 5px;
			font-size: 12px;
			font-weight: bold;
		}

		#NewsSection .content .contentBlock .news ul li .text {
			float: none;
			color: #FFF;
			font-size: 13px;
			margin-bottom: 30px;
		}
			#NewsSection .content .contentBlock .news ul li .text a {
				color: #FFF;
				text-decoration: underline;
				font-weight: normal;
			}

	#NewsSection .content .closeBtnBlock{
		width: 29px;
		padding-bottom: 30px;
		margin-left: auto;
		margin-right: auto;
		margin-bottom: 10px;
	}

/*
=====================================================================
*
*    MovieLinkSection
*
* ===================================================================
*/
#MovieLinkSection {}

	#MovieLinkSection .link{
		margin-top: 25px;
		margin-bottom: 35px;
	}

/*
=====================================================================
*
*    ModalNewsSection
*
* ===================================================================
*/
#ModalNewsSection {
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: auto;
}

#ModalNewsSection .content {
	padding-bottom: 90px;
}

	#ModalNewsSection .inner {
		position: relative;
	}

		#ModalNewsSection .inner .title{
			width: 280px;
			padding: 15px 10px;
			text-align: center;
			margin: 0 auto;
			background-color: #000000;
			color: #FFFFFF;
			font-weight: bold;
		}

		#ModalNewsSection .inner .texts p,
		#ModalNewsSection .inner .texts .imageWrapper {
			width: 280px;
			margin: 0 auto 15px;
		}
		
		/*
=====================================================================
*
*    ModalMovieSection
*
* ===================================================================
*/
.ds3 #ModalMovieSection {
	display: none;
}

#ModalMovieSection {
	-webkit-overflow-scrolling: auto;
	overflow: visible;
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

#ModalMovieSection .content {
	position: relative;
	background: transparent;
}

#ModalMovieSection .bg {
	width: 100%;
	height: 200%;
	background: rgba( 102,102,102,.8 );
}

	#ModalMovieSection .content iframe,
	#ModalMovieSection .content>img {
		display: block;
		position: absolute;
		top: 50%;
		left: 50%;
		margin-top: -150px;
		margin-left: -160px;
	}

	#ModalMovieSection .content .closeBtnBlock{
		position: absolute;
		top: 50%;
		left: 50%;
		width: 29px;
		margin-top: 40px;
		margin-left: -14px;
	}




/*
=====================================================================
*
*    3DS
*
* ===================================================================
*/
.news3dsBlock{
	width: 300px;
	margin: 0 auto;
}

	.news3dsBlock .title{
		width: 300px;
		margin: 0 auto;
	}

	.news3dsBlock .list{
		width: 303px;
		margin: 0 auto;
		background:  url(../images/index/bg/news-shadow-bottom.png);
		background-repeat: no-repeat;
		background-position: left bottom;
		background-size: 303px 8px;
		padding-bottom: 8px;
	}

		.news3dsBlock .list ul{
			width: 303px;
			margin: 0 auto;
			background-image: url(../images/index/bg/news-shadow-body.png);
			background-size: 303px 10px;
			background-position: right top;
			background-repeat: repeat-y;
		}

		.news3dsBlock .list ul li{
			width: 302px;
			list-style: none;
			border-bottom: 1px solid #D6D6D6;
			padding-bottom: 8px;
		}

		.news3dsBlock .list ul li.last{
			border-bottom: none;
		}

/*---------------------------------------------------
*   secretBlock
---------------------------------------------------*/
#Wrapper .secretBlock{
	margin-bottom: 30px;
}
#Wrapper .secretBlock .characterList {
}
	#Wrapper .secretBlock .characterList .title {
		text-align: center;
		margin: 24px auto;
	}
	#Wrapper .secretBlock .characterList .dlc-title {
		margin: 24px auto;
		color: #333333;
		font-size: 19px;
		font-weight: bold;
		text-align: center;
	}
	#Wrapper .secretBlock .characterList .dlc-title span {
		display: block;
		font-size: 13px;
	}
	#Wrapper .secretBlock .characterList .container {
		width: 303px;
	}
		#Wrapper .secretBlock .characterList .container ul {}

			#Wrapper .secretBlock .characterList .container ul li {
				float: left;
				margin-right: 9px;
			}
			#Wrapper .secretBlock .characterList .container ul li.turn {
				margin-right: 0px;
			}
				#Wrapper .secretBlock .characterList .container ul li .update {
					display: block;
					margin-left: -3px;
					margin-top: 5px;
				}