@charset "utf-8";

/*------------------------------
サイト名：NMB48 MOBILE for SMARTPHONE
作成日：2011.12.20
修正日：2011.12.20
ガイドライン：Ver.01
------------------------------*/

/* ------------------------------------
 * 標準スタイルのリセット
 * ------------------------------------ */
@import "html5reset-1.6.1.css";


body {
	width: 100%;
    line-height: 1.6;
    color: #666;
	background: #fff7e7;
	overflow-x: hidden;
	text-align: center;
	font-family: Helvetica, ArialMT, "Hiragino Kaku Gothic ProN", "ヒラギノ角ゴ ProN W3", Droid Sans Japanese, sans-serif;
    font-size: 14px;
	text-align: center;
}

/* Clearfix */
.clearfix:after {
    content: ""; 
    display: block; 
    height: 0; 
    clear: both;
    visibility: hidden;
}

.clearfix {
    display: inline-block;
    min-height: 1%;
}

/* Hides from IE-mac \*/
* html .clearfix {
    height: 1%;
}

.clearfix {
    display: block;
}
/* End hide from IE-Mac */


/* ------------------------------------
 * TEXT LINK
 * ------------------------------------ */
 
a {
	cursor: pointer;
	outline: none;
}

a img {
	border: 0;
}

a:link,
a:visited {
	color: #e57e16;
	text-decoration: underline;
}


/* ------------------------------------
 * HEADINGS
 * ------------------------------------ */
 
#membersList h2,
#download h2,
#support h2 {
	padding: 0.8em 10px 0.6em;
	position: relative;
	line-height: 1.2;
	color: #fff;
	background: #000;
	-webkit-box-shadow: inset 0 -5px 5px -5px #bc7c3c;
	-moz-box-shadow: inset 0 -5px 5px -5px #bc7c3c;
	box-shadow: inset 0 -5px 5px -5px #bc7c3c;
	overflow: hidden;

}

#membersList h2:before,
#download h2:before,
#support h2:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 1px;
	background: #000;
	-webkit-box-shadow: 0 0 5px #5a3815;
	-moz-box-shadow: 0 0 5px #5a3815;
	box-shadow: 0 0 5px #5a3815;
}


/* ------------------------------------
 * HEADER
 * ------------------------------------ */
 
header {
	padding-bottom: 10px;
	background: #fff;
	-webkit-box-shadow: 0 0 5px #999;
	-moz-box-shadow: 0 0 5px #999;
	box-shadow: 0 0 5px #999;
}

header hgroup {
	display: block;
	height: 60px;
	background: #000;
	zoom: 1;
}

header hgroup:after {
    content: ""; 
    display: block; 
    height: 0; 
    clear: both;
    visibility: hidden;
}

header hgroup h1 {
	padding-left: 5px;
	display: inline;
	float: left;
	width: 188px;
	height: 55px;
	background: url(/img/logo.png) 5px 0 no-repeat;
	text-indent: -9999px
}

header hgroup nav ul {
	padding-top: 5px;
	display: inline;
	float: right;
	height: 50px;
	zoom: 1;
}

header hgroup nav ul:after {
    content: ""; 
    display: block; 
    height: 0; 
    clear: both;
    visibility: hidden;
}

header hgroup nav li {
	padding-right: 5px;
	display: inline;
	float: left;
}

header hgroup nav li a {
	display: block;
	width: 50px;
	height: 50px;
	background: url(/img/topNav.png) no-repeat;
	text-indent: -9999px;
}

header hgroup nav li.nmb48mobile a {
	background-position: 0 0;
}

header .message {
	clear: both;
	padding: 0.4em 0 0.3em;
	position: relative;
	color: #fff;
	background: #000;
	-webkit-box-shadow: inset 0 -5px 5px -5px #bc7c3c;
	-moz-box-shadow: inset 0 -5px 5px -5px #bc7c3c;
	box-shadow: inset 0 -5px 5px -5px #bc7c3c;
}

header .message:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 1px;
	background: #fff;
	-webkit-box-shadow: 0 0 5px #5a3815;
	-moz-box-shadow: 0 0 5px #5a3815;
	box-shadow: 0 0 5px #5a3815;
}

header .message h2 {
	display: none;
}

header .message li {
	height: 1.1em;
	line-height: 1.2;
	overflow: hidden;
	font-size: smaller;
}

header img#keyvisual {
	display: block;
	width: 100%;
	max-width: 100%;
	height: auto;
}


/* MEMBER NAVIGATION */

nav#memberNav ul {
	border-top: solid 1px #000;
	border-bottom: solid 1px #111;
	background: #000;
	background-image:-webkit-gradient(linear, left top, left bottom, from(#000), to(#111));
	background-image:-webkit-linear-gradient(top, #000, #111);
	background-image:-moz-linear-gradient(top, #000, #111);
	background-image:-ms-linear-gradient(top, #000, #111);
	background-image:-o-linear-gradient(top, #000, #111);
	background-image:linear-gradient(top, #000, #111);
	zoom: 1;
}

nav#memberNav ul:after {
    content: ""; 
    display: block; 
    height: 0; 
    clear: both;
    visibility: hidden;
}

nav#memberNav li {
	display: inline;
	float: left;
	width: 50%;
}

nav#memberNav li a {
	border-right: solid 1px #d4670c;
	border-left: solid 1px #a44e0b;
	display: block;
	height: 30px;
	background: url(/img/index/memberNav.png) no-repeat;
	text-align: center;
	text-indent: -9999px;
}

nav#memberNav li.register a {
	background-position: center 0;
}

nav#memberNav li.login a {
	background-position: center -30px;
}


/* TEXT LINK */

header nav.textlink {
	padding-top: 10px;
        text-align: center;
}

header nav.textlink p.registration {
	margin: 10px 0;
	padding: 10px 0;
	border-top: dotted 1px #999;
	border-bottom: dotted 1px #999;
}

header nav.textlink p.registration a {
	display: block;
}

header nav.textlink p.registration a span {
	margin: 2px auto 0;
	padding: 10px 15px;
	display: inline-block;
	line-height: 1.1;
	text-decoration: none;
	border: solid 1px #616161;
	border-radius: 0.3em;
	display: inline-block;
	color: #fff;
	background: #000;
	background-image:-webkit-gradient(linear, left top, left bottom, from(#616161), to(#000));
	background-image:-webkit-linear-gradient(top, #616161, #000);
	background-image:-moz-linear-gradient(top, #616161, #000);
	background-image:-ms-linear-gradient(top, #616161, #000);
	background-image:-o-linear-gradient(top, #616161, #000);
	background-image:linear-gradient(top, #616161, #000);
	text-shadow: 0 1px 1px #999;
	text-align: center;
	font-weight: bold;
	-webkit-box-shadow: 0 0 2px #999;
	-moz-box-shadow: 0 0 2px #999;
	box-shadow: 0 0 2px #999;
}


/* ------------------------------------
 * CONTENTS
 * ------------------------------------ */

article {
	background: #fff;
	text-align: left;
}

article section {
	padding-bottom: 10px;
}


/* ------------------------------------
 * ACCORDION NAVIGATION
 * ------------------------------------ */

#membersList li.team {
    margin-botom: 5px;
    display: block;
    background: #fff7e7;
}

#membersList li.team span {
    padding: 0 30px 0 10px;
    display: block;
    line-height: 44px;
    height: 44px;
    border-bottom: 1px solid #bc7c3c;
	color: #bc7c3c;
    background-image: url(/img/arrowDown.png);
    background-repeat: no-repeat;
    background-position: 100% 50%;
}

#membersList li.team a {
    text-decoration: none;
}

#membersList li.membersName {
    display: none;
	
}

#membersList li.membersName li {
    border-bottom: 1px solid #f0d283;
}

#membersList li.membersName li a {
    text-decoration: none;
    display: block;
    background: url(/img/arrowLink.png) no-repeat 100% 50%;
    padding: 10px 20px 10px 10px;
}


/* ------------------------------------
 * DOWNLOAD
 * ------------------------------------ */
 
#download {
	clear:both;
	position:relative;
	text-align: right;
}
 
#download h2 {
	text-align: left;
}
 
#download ul {
	text-align:center;
	margin: 5px 0;
	width:100%;
}
 
#download li {
	display:inline;
	margin:0 10px;
	text-align: center;
}
 
#download a.more {
	padding: 5px 10px;
	display: inline-block;
}

#download div {
	clear:both;
}

/* ------------------------------------
 * SUPPORT
 * ------------------------------------ */
nav#support {
	clear:both;
}


nav#support a,
nav#support a:visited {
	color: #bc7c3c;
	text-decoration: none;
}

nav#support ul {
	zoom: 1;
}

nav#support ul:after {
    content: ""; 
    display: block; 
    height: 0; 
    clear: both;
    visibility: hidden;
}

nav#support li {
	border-top: solid 1px #f0d283;
	float: left;
	width: 50%;
	text-align: center;
	font-size: smaller;
}

nav#support li.connect {
	width: 100%;
}

nav#support li a {
	padding: 0.8em 0 0.6em;
	border-right: solid 1px #f0d283;
	line-height: 1.2;
    display: block;
	overflow: hidden; 
}

/* ------------------------------------
 * COUNT DOWN IMAGE
 * ------------------------------------ */

.countdown_member {
	width:62.5%;
	float:left;
}
.countdown_day {
	width:37.5%;
	float:left;
}
.countdown_member img,.countdown_day img {
	width:100%;
}

/* ------------------------------------
 * FOOTER
 * ------------------------------------ */

footer {
	position: relative;
	color: #bc7c3c;
	line-height: 2;
	font-size: smaller;
	overflow: hidden;
	padding-top:1em;

}

footer:before {
	content: "";
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 1px;
	background: #fff7e7;
	-webkit-box-shadow: 0 0 3px #bc7c3c;
	-moz-box-shadow: 0 0 3px #bc7c3c;
	box-shadow: 0 0 3px #bc7c3c;
}

footer small {
	padding: 10px 0;
	position: relative;
	display: block;
}
