@charset "shift_jis";

/* ========================================
	base
======================================== */
html {
	/*background: url(../common/bg_foot_gr01.jpg) 0 0 repeat;*/
}

body {
	background-color:#FFF;
}

.inner {
	margin: 0 auto;
	width: 960px;
}

.disnon {
	display: none;
}

.disblock {
	display: block;
}

#wrapper1 {
	height:100%;/* for IE6 */
	min-height:100%;
}
#wrapper {
	margin: 0 auto;
	width: 100%;
	min-width: 960px;
	position: relative;

	overflow: hidden;
}

/* ========================================
	#header-logo
======================================== */
#header-logo {
	margin: 0 auto;
	min-width: 960px;
	width: 100%;
	position: relative;
	top: 0;
	z-index: 20;
}

#header-logo .nintendo {
	position: absolute;
	top: 16px;
	left: 20px;
}

#header-logo .hard1 {
	position: absolute;
	top: 10px;
	right: 186px;
	border-right: 1px solid #9fa0a0;
	width: 121px;
}

#header-logo .hard2 {
	position: absolute;
	top: 16px;
	right: 20px;
}

.ncommon-ghdr-header-menu-btn {
	top: 0px !important;
}


/* ========================================
	#mainimage
======================================== */
#mainimage {
	height: 1056px;
	background: url(../images/mainimage_bg.jpg) 0 0 repeat-x;
	position: relative;
}

#mainimage .inner {
	position: relative;
}

#mainimage .mainimage-bg1 {
	background:url(../images/mainimage_bg1.jpg) center 0 no-repeat;
}

#mainimage .mainimage-bg2 {
	background:url(../images/mainimage_bg2.jpg) center 300px no-repeat;
	height: 1056px;
}

#mainimage .mainimage-bg3 {
	background:url(../images/mainimage_bg3.jpg) center 600px no-repeat;
	height: 1056px;
}

#mainimage .mainimage-film {
	position: absolute;
	top: 45px;
	left: -43px;
}

#mainimage .mainimage-logo {
	position: absolute;
	top: 458px;
	left: 32px;
}

#mainimage .mainimage-copy {
	position: absolute;
	top: 725px;
	left: 39px;
}

#mainimage .mainimage-btn {
	position: absolute;
	top: 726px;
	left: 733px;
}
#mainimage .notice-text {
	position: absolute;
	top: 936px;
	left: 50%;
	transform: translateX(-50%);
}

.notice-text {
	width: 880px;
	box-sizing: border-box;
	text-align: center;
	padding: 14px;
	font-size: 16px;
	line-height: 1.6;
	background: #fff;
	border: 2px solid #ff7d00;
	border-radius: 15px;
	color: #ff7d00;
	font-weight: bold;
	line-height: 1.8;
}

a.youtube-link {
	text-decoration: none;
	color: #ff7d00;
	padding-bottom: 4px;
	border-bottom: solid 1px #ff7d00;
}
.youtube-link:hover {
	opacity: .8;
}

/* ========================================
	#story
======================================== */
#story {
	height: 372px;
	background: url(../images/story_bg.png) center 0 repeat;
	position: relative;
}

#story .inner {
	position: relative;
}

#story .story01 {
	position: absolute;
	top: 50px;
	left: 0;
}

#story .story02 {
	position: absolute;
	top: 50px;
	left: 330px;
}

#story .story03 {
	position: absolute;
	top: 50px;
	left: 661px;
}
#story a:hover .story-img::after {
	content: '';
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	display: block;
	background-color: #FFF;
	opacity: 0.2;
	z-index: 999;
}
.story-img {
	position: relative;
}
.story-img::before {
	content: url(../images/play-btn.png);
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
}


/* ========================================
	#about
======================================== */
#about {
}

#about .inner {
	position: relative;
}

#about .nozokimi {
	height: 340px;
	position: relative;
	z-index: 10;
}

#about .tokuten {
	position: absolute;
	top: 195px;
	left: 742px;
}

#about .btn-nozokimi {
	padding: 92px 0 0 155px;
}

#about .btn-omake {
	position: absolute;
	top: 195px;
	left: 746px;
}


#about .message {
    margin-top: 130px;
	height: 521px;
	background: url(../images/message_bg.png) 0 0 repeat;
	position: relative;
}

#about .message-miyamoto1 {
	position: absolute;
	top: 40px;
	left: 50px;
}

#about .message-miyamoto2 {
	position: absolute;
	top: 290px;
	left: 50px;
}

#about .message-miyamoto3 {
	position: absolute;
	top: 40px;
	left: 360px;
}

#about .pik-yellow {
	position: absolute;
	top: -165px;
	left: 320px;
}
#about .pik-blue {
	position: absolute;
	top: -157px;
	left: -120px;
}

#about .pik-red {
	position: absolute;
	top: -70px;
	right: -165px;
}


/* ========================================
	#trial
======================================== */
#trial {
}

#trial .inner {
	position: relative;
}

#trial .trial-btn {
	margin: 30px 0;
}


/* ========================================
	#download
======================================== */
#download {
	height: 404px;
	background: url(../images/download_bg.jpg) 0 0 repeat;
}
#download .inner {
	position: relative;
}

#download .download-wiiu {
	position: absolute;
	top: 29px;
	left: 39px;
}

#download .download-3ds {
	position: absolute;
	top: 29px;
	left: 479px;
}

#download .spec {
	height: 194px;
	background: url(../images/spec_bg.png) 0 0 no-repeat;
	position: relative;
	top: 180px;
}

#download .spec-ttl {
	position: absolute;
	top: 28px;
	left: 40px;
}

#download .spec1 {
	position: absolute;
	top: 57px;
	left: 40px;
}

#download .spec2 {
	position: absolute;
	top: 81px;
	left: 40px;
}

#download .spec3 {
	position: absolute;
	top: 105px;
	left: 40px;
}

#download .spec4 {
	position: absolute;
	top: 155px;
	left: 583px;
}

#download #howtobuy {
	position: absolute;
	top: 172px;
	left: 70px;
}

#download .eshop {
	width: 410px;
	height: 104px;
	background: url(../images/eshop_bg.png) 0 0 no-repeat;
	position: relative;
	top: 40px;
	left: 510px;
}

#download .eshop .eshop_ttl {
	position: absolute;
	top: 16px;
	left: 56px;
}

#download .eshop .eshop_ttl2 {
	position: absolute;
	top: 43px;
	left: 22px;
}

#download .eshop .detail_ttl2 {
	position: absolute;
	top: 43px;
	left: 22px;
}

#download .eshop .eshop_copy {
	position: absolute;
	top: 43px;
	left: 187px;
}

#download .download-chara {
	position: absolute;
	top: -30px;
	right: 0;
}

#download .eshop-wiiu {
	position: absolute;
	top: 41px;
	left: 195px;
}

#download .eshop-3ds {
	position: absolute;
	top: 41px;
	left: 267px;
}

/* ========================================
	#footer
======================================== */
#footer {
}
#footer .inner {
	position: relative;
}

#footer .more {
	position: relative;
	/*z-index: 10;*/
}

#footer .more-ttl {
	margin: 29px 0 9px 0;
	text-align: center;
}

#footer .more-bnr {
}

#footer .more-bnr li {
	width: 299px;
	margin: auto;
}


#footer .foot-navi {
	margin: 15px 0;
	text-align: center;
}

#footer .pagetop {
	position: relative;
	width: 82px;
	height: 130px;
	left: 878px;
	top: -60px;
}

#footer .pagetop .pagetop-pk {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
}

#footer .pagetop .pagetop-btn {
	position: absolute;
	top: 0;
	left: 0;
	display: block;
}

#footer .foot-btm {
	margin-top: -90px;
}

#footer .foot-clover {
	margin-top: -35px;
	position: relative;
}
#footer .foot-clover {
	height: 63px;
	background: url(../images/foot_clover.png) center top no-repeat;
}



/* ========================================
	popWrap
======================================== */
iframe {
	position: relative;
}
#modal {
	display: none;
	position: absolute;
		z-index: 9200;
	left: 50%;
	width: 960px;
	height: 1110px;
	margin-left: -480px;
}

#popBody {
	padding-top: 58px;
	background: transparent;
}

#popWrap {
	margin: 0 auto;
	width: 960px;
	position: relative;
}

#popBody .modal1,
#popBody .modal2,
#popBody .modal3 {
	margin: 0 auto;
	width: 960px;
	/*height: 411px;*/
	position: relative;
}

#popBody .modal-ttl {
	padding: 21px 0 13px 0;
	text-align: center;
}

#popBody #modal-movie {
	position: absolute;
	top: 60px;
	left: 33px;
}

#popBody .modal-btn li {
	position: absolute;
}


#popBody #pop-close {
	position: absolute;
	top: -58px;
	right: 0px;
}


#popBody .modal2 {
	height: 665px;
	background: url(../images/modal2_bg.png) 0 0 no-repeat;
}

#popBody .modal2-inner {
	padding: 30px 0 0 30px;
	position: relative;
}

#popBody #note {
	position: absolute;
	top: 30px;
	left: 30px;
}

#popBody .modal2-copy {
	margin: 20px 0 0 131px;
}

#popBody .modal3 {
	width: 691px;
	height: 366px;
	background: url(../images/modal3_bg.png) 0 0 no-repeat;
}

#popBody .modal3-inner {
	padding: 30px 0 0 30px;
}

#popBody .modal3-ttl {
	position: absolute;
	top: 30px;
	left: 252px;
}

#popBody .modal3-movie1 {
	position: absolute;
	top: 73px;
	left: 30px;
}

#popBody .modal3-movie2 {
	position: absolute;
	top: 73px;
	left: 361px;
}


#coverLayer {
	display: none;
	position: fixed;
		top: 0;
		left: 0;
		z-index: 9000;
	height: auto;
	height: 100%;
	min-height: 100%;
	width: 100%;
	background: #000;
	opacity: .7;
	filter: alpha(opacity=70);
	-ms-filter: "alpha(opacity=70)";
}

#ncommon-purchase {
	height: 174px !important;
}