@charset "UTF-8";

/* ========================================
	common
======================================== */
body {
	background: #0d61ae;
}
#wrapper {
	position: relative;
	width: 100%;
	min-width: 960px;
	overflow: hidden;
	background-image: url(../img/under_footer_planet.png),
                      url(../img/under_footer_cloud.png),
                      url(../img/under_bg_middle.png),
                      url(../img/under_bg_top.png),
                      url(../img/under_bg_bottom.png);
	background-position: center bottom,
						 center bottom,
						 center top,
						 center top,
						 center bottom;
	background-repeat: no-repeat,
					   repeat-x,
					   repeat,
					   no-repeat,
					   no-repeat;
}
#contents {
	position: relative;
	z-index: 400;
	padding-bottom: 50px;
}
.inner {
	position: relative;
	width: 100%;
	max-width: 1145px;
	min-width: 960px;
	margin: 0 auto;
}

/* ====================
	#header
==================== */
#header {
	position: relative;
	z-index: 200;
	width: 100%;
}
#header .header-logo {
	padding: 12px 0 10px;
}

/* ====================
	#footer
==================== */
#footer {
	margin: 0 auto;
	height: 240px;
}
#footer #footer-nav {
	width: 578px;
	margin: 0 auto;
	padding-top: 194px;
}
#footer #footer-nav li {
	display: inline-block;
	padding-right: 40px;
}
#footer #footer-nav li:last-child {
	padding-right: 0;
}
#footer .copyright {
	position: absolute;
	bottom: 30px;
	right: 85px;
}
#footer-action #pagetop {
	position: absolute;
	bottom: 92px;
	left: 44.3%;
	width: 100%;
	height: auto;
	overflow: hidden;
}
	/* ====================
		max-width 960px
	==================== */
	@media only screen and (max-width: 980px) {
	#footer-action #pagetop {
		left: 43.5%;
	}
	} /* max-width 980px END */
	
	/* ====================
		max-width 1195px
	==================== */
	@media screen and (min-width: 981px) and (max-width: 1215px) {
	#footer-action #pagetop {
		left: 43.7%;
	}
	} /* max-width 1215px END */
	

#footer-action #pagetop a {
	display: block;
	width: 11.704%;
	height: 148px;
}
#footer-action #pagetop img {
	position: absolute;
	/*width: 100%;*/
}
#footer-action #pagetop .pagetop-icon {
	top: 0;
	left: 0;
}
#footer-action #pagetop .pagetop-chara {
	top: 67px;
	margin-left: 2.1%;
}

#footer-action #backnumber {
	position: absolute;
	bottom: 137px;
	right: 15px;
	z-index:500;
}


/* ====================
	#contents
==================== */
#main {
	width: 864px;
}
#main #title-area {
	position: relative;
	width: 100%;
}
#main #title-area .update {
	position: absolute;
	top: 12px;
	right: 10px;
}
#main .line-top img,
#main .line-bottom img {
	display: block;
}
#main #main-inner {
	border-left: #060001 5px solid;
	border-right: #060001 5px solid;
	background: #f0f0f0;
}

#main .under-vote-button-inner {
	padding: 17px 0 26px;
	text-align: center;
	background: url(../img/vote_bg.gif) center center repeat;
}
#main .under-vote-button-inner .vote-button {
	padding-top: 19px;
}
#main .vote-fin {
	display: none;
}
#main .under-relation-box {
	padding: 0 20px 20px;
}
#main .under-relation-box .relation-ttl-area {
	overflow: hidden;
	padding: 15px 0;
}
#main .under-relation-box .relation-ttl-area .relation-ttl {
	float: left;
}
#main .under-relation-box .relation-ttl-area .relation-ttl img {
	max-width: 610px;
	width: 100%;
	height: auto;
}
#main .under-relation-box .relation-ttl-area .relation-ttl-sub {
	margin-top: -2px;
}
#main .under-relation-box ul {
	overflow: hidden;
	border-radius: 7px;
	padding: 5px 0 5px 20px;
	background: #ffffff;
}
#main .under-relation-box li {
	float: left;
	width: 380px;
	margin-right: 20px;
	border-bottom: #b2b2b2 1px dotted;
}
#main .under-relation-box li.noline {
	border-bottom: none;
}
#main .under-relation-box li a {
	position: relative;
	display: block;
	padding: 10px 0;
	color: #000000;
	font-size: 16px;
	text-decoration: none;
}
#main .under-relation-box li .icon {
	position: absolute;
	top: 50%;
	width: 6px;
	height: 10px;
	margin-top: -5px;
}
#main .under-relation-box li .icon img {
	position: relative;
	top: -2px;
	left: -2px;
}
#main .under-relation-box li .title {
	display: block;
	line-height: 1.5;
	padding-left: 20px;
}
#main .under-relation-box li a:hover .title {
	text-decoration: underline;
}
#backnumber-article-area .back-pagetop {
	padding: 10px 0;
	text-align: right;
}

#sub {
	z-index: 400;
}
#sub .sub-title {
	position: relative;
	margin-bottom: 12px;
}
#sNav {
	margin-bottom: 25px;
	text-align: center;
}
#sNav li {
	margin-bottom: 6px;
}
#sub #sNav-rank {
}
#sub #sNav-rank .sNav-rank-ttl {
	margin-bottom: 7px;
	text-align: center;
}
#sub #sNav-rank ul {
	margin-bottom: 10px;
	border-top: #ffffff 1px dotted;
}
#sub #sNav-rank li {
	border-bottom: #ffffff 1px dotted;
}
#sub #sNav-rank li a {
	display: block;
	position: relative;
	width: 100%;
	overflow: hidden;
	padding: 10px 0;
	color: #ffffff;
	font-size: 14px;
}
#sub #sNav-rank li .icon {
	float: left;
	width: 50px;
	height: 50px;
	margin-right: 10px;
}
#sub #sNav-rank li .ranking-icon {
	position: absolute;
	top: 0;
	left: 0;
}
#sub #sNav-rank li .item-text {
	float: left;
	width: 180px;
}
#sub #sNav-rank li .item-text .title {
	display: block;
	line-height: 1.4;
}
#sub #sNav-rank li a:hover .item-text .title {
	text-decoration: underline;
}
#sNav-btn-close {
	display: none;
	position: absolute;
	width: 100%;
	cursor: pointer;
	z-index: 300;
}
#sub #sNav-rank .more-btn {
	text-align: center;
}
#sub .sub-bome-btn {
	text-align: center;
}

/* ====================
	.main-footer
==================== */
.main-footer {
	margin: 30px 0 0 0;
}
.footdata-logo {
	width: 260px;
	text-align: center;
	float: left;
}
.footdata-contents {
	width: 579px;
	float: right;
	position: relative;
}
.footdata-ttl {
	margin-bottom: 20px;
}
.footdata-hard {
	position: absolute;
	top: -15px;
	right: 0;
}
.footdata-edition {
	margin-bottom: 10px;
}
.footdata-spec {
	margin-bottom: 10px;
	color: #666;
}
.footdata-spec li {
	float: left;
	padding: 0 15px 10px 0;
	font-weight: bold;
}
.footdata-spec li em {
}
.main-copyright {
	margin-top: 20px;
	color: #8c8c8c;
	font-size: 10px;
	text-align: center;
}

/* ====================
	.footer-gameinfo
==================== */
.footer-gameinfo {
}
.footer-gameinfo .gameinfo-box {
	position: relative;
	padding: 56px 0;
	border-top: 1px solid #C1C1C1;
	overflow: hidden;
}
.footer-gameinfo .gameinfo-box:first-child {
	border-top: none;
}

.footer-gameinfo .f-hard {
	position: absolute;
	top: 20px;
	right: 0;
}
.footer-gameinfo .f-logo {
	float: left;
	width: 320px;
	text-align: center;
}
.footer-gameinfo .f-contents {
	float: right;
	width: 514px;
}
.footer-gameinfo .f-icon {
	float: left;
}
.footer-gameinfo .f-name {
	position: relative;
	float: right;
	width: 443px;
}
.footer-gameinfo .f-soft-ttl {
	margin-bottom: 8px;
	padding-top: 10px;
}
.footer-gameinfo .f-copyright {
	color: #8C8C8C;
	font-size: 9px;
}
.footer-gameinfo .f-btn {
	clear: both;
	padding-top: 15px;
}



/* ========================================
	#modal
======================================== */
#coverLayer {
	display: none;
	position: fixed;
	top: 0;
	left: 0;
	z-index: 9999;
	width: 100%;
	height: 100%;
	min-height: 100%;
	background: #000000;
	opacity: 0.8;
	filter: alpha(opacity=80);
	-ms-filter: "alpha(opacity=80)";
	cursor: pointer;
}
#modal {
	position: absolute;
	z-index: 9999;
	left: 50%;
}
#modal #modal-close {
	padding-top: 20px;
}
#modal #modal-close a {
	display: block;
	width: 180px;
	height: 40px;
	margin: 0 auto;
	background: url(../img/modal_close_off.png) center center no-repeat;
}
#modal #modal-close a:hover {
	background: url(../img/modal_close_on.png) center center no-repeat;
}
#modalBody {
	background: transparent;
}

/* ========================================
	.bnr-roop
======================================== */
.bnr-roop {
	position: relative;
	width: 100%;
	overflow: hidden;
}
.bnr-roop ul {
	position: relative;
	width: 100%;
	overflow: hidden;
}
.bnr-roop ul li {
	float: left;
}

/* ========================================
	max-width 1145px
======================================== */
@media screen and (max-width: 1165px) {
#header .inner,
#footer .inner,
#footer-action .inner {
	width: 960px;
}
#header .header-logo {
	position: relative;
	left: 10px;
}
#header .header-title {
	padding-left: 78px;
	padding-right: 18px;
}
#header .header-homelink {
	right: 18px;
}
#footer-nav .footer-nintendo {
	padding-right: 18px;
}
#footer-nav .footer-homelink {
	padding-right: 18px;
}
#footer-nav #fNav {
	padding-left: 78px;
}
#main {
	margin: 0 auto;
	padding:  0 18px 0 78px;
}
#sub {
	position: absolute;
	top: -90px;
	left: -280px;
	width: 276px;
	border-right: #FFF100 4px solid;
	background: rgba(5, 68, 147, 0.8);
}
#sub #menu {
	position: absolute;
	top: 68px;
	left: 0;
	width: 100%;
}
#menu #sNav-btn {
	display: block;
	position: absolute;
	top: 37px;
	right: -69px;
}
#menu #sNav-btn .close {
	display: none;
}
#menu .sub-title {
	padding-left: 20px;
}
#menu .sub-update {
	padding-left: 20px;
}
#menu #sNav-rank {
	width: 240px;
	margin-left: 20px;
}

} /* max-width 1165px END */

/* ========================================
	min-width 1146px
======================================== */
@media screen and (min-width: 1166px) {
#sub #sNav-btn {
	display: none;
}
#main {
	float: right;
}
#sub {
	position: relative;
	top: -6px;
	float: left;
	width: 240px;
}
#sub #menu {
	position: relative;
	top: 0;
	left: 0;
	width: 100%;
}
#menu .sNav-foot-btn {
	padding-left: 0;
}

} /* min-width 1166px END */

.under-noscript {
	padding: 100px 0 400px;
	text-align: center;
	font-size: 18px;
}