@charset "UTF-8";
html {
	font-size: 62.5%;
}
body {
	font-size: 14px;
	font-size: 1.4em;
}
.wrapper {
	min-width: 1100px;
}
.section-body {
	margin: 0 auto;
	position: relative;
}
.clearfix:after {
	content: '';
	display: table;
	clear: both;
}

/* BGM PLAYER
=================================================================== */
.soundBox-wrapper {
	width: 125px;
	height: 19px;
	position: relative;
}
.soundBox-title {
	position: absolute;
	left: 0;
	top: 0;
	font-size: 0.01%;
	line-height: 0.01%;
	margin: 0;
}
.soundBox-onBtn {
	position: absolute;
	left: 53px;
	top: 0;
}
.soundBox-offBtn {
	position: absolute;
	left: 89px;
	top: 0;
}
.soundBox-onBtn a,
.soundBox-offBtn a {
	display: block;
	text-indent: 100%;
	white-space: nowrap;
	overflow: hidden;
	font-size: 0px;
	line-height: 0px;
	width: 36px;
	height: 19px;
	background-image: url(../img/soundbox-btn.png);
	background-repeat: no-repeat;
}
.soundBox-onBtn a {
	background-position: 0 -19px;
}
.soundBox-offBtn a {
	background-position: -36px -19px;
}
.is-bgm-off .soundBox-onBtn a {
	background-position: 0 -19px;
}
.is-bgm-off .soundBox-offBtn a {
	background-position: -36px 0;
}
.is-bgm-on .soundBox-onBtn a {
	background-position: 0 0;
}
.is-bgm-on .soundBox-offBtn a {
	background-position: -36px -19px;
}
.is-bgm-off .soundBox-onBtn a:hover {
	background-position: 0 -36px;
}
.is-bgm-on .soundBox-offBtn a:hover {
	background-position: -36px -36px;
}

/* layout + common
=================================================================== */
.section-body {
	margin: 0 auto;
	position: relative;
}

/* hero-section
=================================================================== */
.hero-section {
	height: 545px;
	background: url(../img/hero_repeat-x_bg.png) repeat-x center -24px;
}
.section-body--hero {
	width: 1100px;
	height: 545px;
	position: relative;
	margin: auto;
	background: url(../img/hero_bg.png) no-repeat 0 0;
}

.hero-3dsLogo,
.hero-wiiuLogo,
.hero-shovelKnight {
	position: absolute;
	top: 15px;
	z-index: 999;
}
.hero-3dsLogo {
	left: 215px;
	top: 13px;
}
.hero-wiiuLogo {
	left: 95px;
}
.hero-wiiuLogo:after {
	content: '';
	display: block;
	position: absolute;
	top: -1px;
	right: -16px;
	width: 1px;
	height: 25px;
	background: #fff;
}
.hero-shovelKnight {
	width: 507px;
	height: 578px;
	top: -28px;
	left: -39px;
	z-index: 0;
	background: url(../img/hero-shovel-knight_bg.png) no-repeat 0 0;
}

.hero-title {
	top: 100px;
	right: 120px;
	position: absolute;
	z-index: 0;
}
.hero-soundBox {
	position: absolute;
	top: 13px;
	left: 892px;
}
.menu {
	width: 855px;
	height: 102px;
	position: absolute;
	bottom: 50px;
	left: 123px;
	background: #000 url(../img/navi_bg.png) no-repeat 0 0;
}
.menu li {
	position: absolute;
	top: 43px;
}
.menu li a {
	width: 100%;
	height: 200%;
	display: block;
	position: relative;
}
.navi-item1 {left: 66px;}
.navi-item2 {left: 225px;}
.navi-item3 {left: 378px;}
.navi-item4 {
	top: 37px !Important;
	left: 514px;
}
.navi-item5 {left: 660px;}

/* contents
=================================================================== */
.main-section {
	padding: 22px 0 74px 0;
	background: url(../img/main-section_repeated_bg.png) repeat center 23px;
	position: relative;
}
.main-section:before {
	content: "";
	width: 100%;
	height: 37px;
	display: block;
	position: absolute;
	top: -16px;
	left: 0;
	background: url(../img/main-section_before_bg.png) repeat 0 0;
}
.main-section:after {
	content: "";
	width: 100%;
	height: 24px;
	display: block;
	position: absolute;
	bottom: 0;
	left: 0;
	background: url(../img/section-body_after_bg.png) repeat center 0;
}

.section-inner {
	position: relative;
}
.section-inner.movie {
	width: 916px;
	height: 627px;
	position: relative;
	top: 22px;
	margin: auto;
	background: #000 url(../img/movie_frame_bg.png) no-repeat 0  0;
}
.section-inner.story {
	width: 916px;
	height: 794px;
	margin: auto;
	margin-top: 89px;
	top: 2px;
	background: #000 url(../img/story_frame_bg.png) no-repeat 0  0;
}
.section-inner.about {
	width: 916px;
	height: 745px;
	padding-bottom: 0;
	margin: auto;
	margin-top: 69px;
	background: #000 url(../img/about_frame_bg.png) no-repeat 0 0;
	top: 3px;
}
.section-inner.amiibo {
	width: 916px;
	height: 600px;
	margin: auto;
	margin-top: 71px;
	background: #000 url(../img/amiibo_frame_bg.png) no-repeat 0 0;
	top: 3px;
}
.section-inner.products {
	width: 916px;
	height: 843px;
	margin: auto;
	margin-top: 74px;
	top: 1px;
	background: #000 url(../img/products_frame_bg.png) no-repeat center 0;
}

.scrolling-anim-item {
	z-index: 999;
}
.scrolling-anim-item--01 {
	width: 48px;
	height: 198px;
	display: block;
	position: absolute;
	right: 150px;
	bottom: -153px;
	background: url(../img/ladder_1_bg.png) no-repeat center  0;
}
.scrolling-anim-item--02 {
	width: 58px;
	height: 288px;
	display: block;
	position: absolute;
	left: 120px;
	bottom: -245px;
	background: url(../img/ladder_2_bg.png) no-repeat center  0;
}
.scrolling-anim-item--03 {
	width: 79px;
	height: 302px;
	display: block;
	position: absolute;
	bottom: -259px;
	background: url(../img/ladder_3_bg.png) no-repeat center  0;
	right: 0;
}
.climbing-knight {
	width: 72px;
	height: 99px;
	display: block;
	position: absolute;
	bottom: 0;
	left: -10px;
	background: transparent url(../img/knight_climing_anim.gif) no-repeat center  0;
}
.scrolling-anim-item--03 .climbing-knight {
	left: 0;
}

/* section-inner
=================================================================== */
.section-inner h3 {
	padding-top: 10px;
	text-align: center;
}

.centered-img {
	margin-top: 20px;
	text-align: center;
}
.centered-img--movie{
	width: 770px;
	margin: 10px auto 0 auto;
}
.centered-img--mt15 {
	margin-top: 15px;
}

.story_slideshow {
	width: 808px;
	height: 607px;
	position: relative;
	overflow: hidden;
	margin: 0 auto;
	display: none;
}
.story_slideshow .slide {
	position: relative;
	height: auto;
}
.story_slideshow .item {
	width: 100%;
	height: 607px;
	position: absolute;
	top: 0;
	left: 0;
}

.about-contents_block {
	margin-top: 50px;
}

.gallery {
	width: 810px;
	margin: 20px auto 0 auto;
}
.gallery-item {
	box-sizing: border-box;
	display: inline-block;
	margin: 0 0 15px 27px;
	width: 252px;
	height: 152px;
}
.gallery-item:nth-child(3n+1) {
	margin-left: 0;
}
.gallery-item img {
		border: 1px solid #fff;
		display: block;
}

.amiibo-contents h3 {
	text-align: left;
	margin-left: 35px;
}

.amiibo-contents {
	position: relative;
}
.amiibo_img1 {
	position: absolute;
	top: 170px;
	left: 190px;
}
.amiibo_img2 {
	left: 440px;
	position: absolute;
	top: 140px;
}
.amiibo_img3 {
	position: absolute;
	top: 370px;
	left: 440px;
}

/* products area */
.products-contents {
	width: 806px;
	margin: auto;
}
.products-contents .table {
	width: 100%;
	display: table;
	color: #fff;
	border-bottom:3px solid #fff;
	padding: 30px 0 40px 0;
}
.products-contents .cell {
	display: table-cell;
	vertical-align: top;
}
.cell.valign-middle {
	vertical-align: middle;
}
.table.wiiU-box {
	padding: 10px 0 20px 0;
}
.table.N3ds-box {
	padding: 50px 0 25px 0;
}
.table.amiibo-box {
	padding: 15px 0 40px 0;
	border-bottom: none;
}

.products-contents .cell.brand {
	width: 200px;
	text-align: center;
}
.cell-copy {
	margin-top: 20px;
}
.cell-brand-link-btn {
	margin-top: 20px;
	transition: all 1s ease;
}

.cell-title {
	position: relative;
	margin-left: 5px;
}
.products-contents .cell.options {
	padding-left: 35px;
}

.call-to-buy {
	margin-top: 10px;
}
.call-to-buy:after {
	content: "";
	display: table;
	clear: both;
}
.call-to-buy .icn {
	float: left;
}
.buy-link {
	margin: 15px 0 0 0;
}
.alps-is-guest .buy-link {
	display: none;
}
.alps-is-loggedin .buy-link{
	display: block;
}
.buy-box {
	float: left;
	margin-left: 10px;
}

.cell.prod-details {
	width: 280px;
}
.N3ds-box .media {
	margin-top: 10px;
}
.N3ds-box .caption-area {
	margin-top: 10px;
}

.amiibo-box .brand {
	padding-top: 5px;
}
.amiibo-box .options {
	padding-top: 15px;
}

/* footer
=================================================================== */
footer {
	position: relative;
	background: url(../img/main-section_repeated_bg.png) repeat center 0;
	padding-bottom: 20px;
}

.section-inner.footer {
	width: 916px;
	height: 72px;
	margin: 0 auto 0 auto;
	position: relative;
	background: #000 url(../img/footer_frame_bg.png) no-repeat center top;
}
.footer-indeback {
	position: absolute;
	bottom: 14px;
	left: 25px;
	margin-left: 25px;
	padding-top: 10px;
	padding-left: 15px;
	background: url(../img/footer-item_icn.png) no-repeat 0 75%;
}
.section-inner.footer .logo{
  position: absolute;
  top: 10px;
  left: 44px;
}

.footer-link-list {
	width: 63%;
	position: absolute;
	bottom: 13px;
	right: 40px;
	box-sizing: border-box;
	padding-left: 16px;
}
.footer-link-item {
	position: relative;
	margin-left: 25px;
	padding-left: 15px;
	background: url(../img/footer-item_icn.png) no-repeat 0 55%;
	display: inline-block;
}
.footer-pagetop {
	background: url(../img/pagetop_icn.png) no-repeat 0 55%;
}

/* state
=================================================================== */
.is-climbing-1 {
	transition: all 1.5s cubic-bezier(0.250, 0.250, 0.750, 0.750);
	transform: translate3d(0, -100px, 0);
}
.is-climbing-2,
.is-climbing-3 {
	transition: all 3s cubic-bezier(0.250, 0.250, 0.750, 0.750);
	transform: translate3d(0, -200px, 0);
}

/* hover
=================================================================== */
.no-touchevents  a.hvr-opacity img {
	-webkit-transition:  all 0.5s ease;
}
.no-touchevents a.hvr-opacity:hover img {
	opacity: 0.8;
}

.no-touchevents .hvr-arcadeRetro-in {
	-webkit-transform: translateZ(0);
	transform: translateZ(0);
	-webkit-backface-visibility: hidden;
	backface-visibility: hidden;
}
.no-touchevents .hvr-arcadeRetro-in:before,
.no-touchevents .hvr-arcadeRetro-in:after,
.no-touchevents .hvr-arcadeRetro-in a:before,
.no-touchevents .hvr-arcadeRetro-in a:after {
	content: '';
	width: 10px;
	height: 10px;
	display: block;
	position: absolute;
	z-index: 999;
	pointer-events: none;
  opacity: 0;
	-webkit-transition: top 0.05s ease, right 0.05s ease, bottom 0.05s ease, left 0.05s ease;
							transition: top 0.05s ease, right 0.05s ease, bottom 0.05s ease, left 0.05s ease;
}
.no-touchevents .hvr-arcadeRetro-in:before {
	top: -20px;
	left: -20px;
	background: url(../img/nav_hover_part1_bg.png);
}
.no-touchevents .hvr-arcadeRetro-in:hover:before {
	top: -10px;
	left: -10px;
	opacity: 1;
	background: url(../img/nav_hover_part1_bg.png);
}
.no-touchevents .hvr-arcadeRetro-in a:before {
	top: -20px;
	right: -20px;
	background: url(../img/nav_hover_part2_bg.png);
}
.no-touchevents .hvr-arcadeRetro-in a:hover:before {
	top: -10px;
	right: -10px;
	opacity: 1;
	background: url(../img/nav_hover_part2_bg.png);
}
.no-touchevents .hvr-arcadeRetro-in:after {
	bottom: -16px;
	left: -20px;
	background: url(../img/nav_hover_part3_bg.png);
}
.no-touchevents .hvr-arcadeRetro-in:hover:after {
	bottom: -8px;
	left: -10px;
	opacity: 1;
	background: url(../img/nav_hover_part3_bg.png);
}
.no-touchevents .hvr-arcadeRetro-in a:after {
	bottom: -14px;
	right: -20px;
	background: url(../img/nav_hover_part4_bg.png);
}
.no-touchevents .hvr-arcadeRetro-in a:hover:after {
	bottom: -7px;
	right: -10px;
	opacity: 1;
	background: url(../img/nav_hover_part4_bg.png);
}
