@charset "utf-8";

/* 
############################################################################

Base CSS

############################################################################
*/



/* Structure
****************************************************************************/
html {
	background: #000000;
}

body {
	background: #FFFFFF;
	color: #666666;
	min-width: 940px;
}

#globalHeader {
	font:13px/1 "MS UI Gothic","Hiragino Kaku Gothic Pro","ヒラギノ角ゴ Pro W3",sans-serif;
}

#document {
}

#header {
}

#container {
	margin: 10px auto 0;
	width: 906px;
	zoom: 1;
}
#container:after {
	content: "."; display: block; clear: both; height: 0; visibility: hidden; font-size: 0;
}

#contents {
	float: right;
	width: 675px;
}

#navigation {
	float: left;
	background: #111a5f url(/common/images/base/navigation_bg.png) repeat 0 0;
	width: 213px;
	border: 4px solid #D4D4D4;
}

#footer {
}

ul#globalnavi {
}



/* Global Header
****************************************************************************/
#globalHeader .mk_header_bar #menu_container #title_submenu ul li {
	vertical-align: bottom;
}



/* Header
****************************************************************************/
#header {
	padding: 16px 0 18px;
	min-height: 21px;
	background: #F1F1F1 url(../images/base/header_bg_01.gif) repeat-x 0 100%;
}
* html #header {height: 21px;}

#header .inner {
	margin: 0 auto;
	width: 940px;
}

#header p {
	font-size: 120%;
	line-height: 1.5;
}

	/* Site Logo
	---------------------------------------- */
	#header p#siteLogo {
		margin: 0 0 0 27px;
	}
	
	/* Topicpath
	---------------------------------------- */
	#header p#topicpath {
		position: relative;
		margin: -18px 6px 0 200px;
		font-weight: bold;
		text-align: right;
	}
	
	#header p#topicpath a {
		margin: 0 4px 0 0;
		padding: 0 13px 0 0;
		background: url(../images/base/topicpath_ico_01.gif) no-repeat 100% 49%;
		color: #666666;
		font-weight: normal;
		text-decoration: none;
	}
	
	#header p#topicpath a:hover {
		text-decoration: underline;
	}


/* Navigation
****************************************************************************/
#navigation {
	background:url(../images/base/navigation_bg.png) repeat 0 0; 
}


/* LogoUnit
========================================== */
#navigation #logoUnit {
	border-bottom:4px solid #D4D4D4;
}

#navigation #logoUnit a{
	width:213px;
	height:167px;
	background:url(../images/base/logoUnit.png) 0 0 no-repeat;
	text-indent:-9999px;
	overflow:hidden;
	display:block;
}

#navigation #logoUnit a:hover{
	background:url(../images/base/logoUnit.png) 0 -167px no-repeat;
}

/* Login Unit
========================================== */
#navigation #loginUnit {
	position: relative;
	padding: 10px;
	height: 70px;
	background: url(../images/base/loginUnit_bg_01.jpg);
	zoom: 1;
}

#navigation #loginUnit h2 {
	margin: 0 6px 5px;
	font-size: 80%;
	line-height: 1.25;
}

	/* inputAccount
	---------------------------------------- */
	#navigation #loginUnit ul#inputAccount {
		position: relative;
		margin: 0 2px 4px 3px;
		width: 242px;
		height: 36px;
		background: url(../images/base/loginUnit_bg_02.png) no-repeat;
	}
	
	#navigation #loginUnit ul#inputAccount li {
		position: absolute;
		top: 10px;
		width: 76px;
		height: 16px;
		font-size: 90%;
		line-height: 1.334;
	}
	#navigation #loginUnit ul#inputAccount li.loginId   {left:  8px;}
	#navigation #loginUnit ul#inputAccount li.loginPass {left: 92px;}
	
	#navigation #loginUnit ul#inputAccount li label {
		display: inline-block;
	}
	
	#navigation #loginUnit ul#inputAccount li label input {
		margin: 0;
		padding: 0;
		background: transparent no-repeat 50% 50%;
		border: none;
		width: 76px;
		color: #FF9900;
		text-align: center;
	}
	
	#navigation #loginUnit ul#inputAccount li.loginId   label input.blur { background-image: url(/common/images/base/id.gif);}
	#navigation #loginUnit ul#inputAccount li.loginPass label input.blur { background-image: url(/common/images/base/password.gif);}
	
	#navigation #loginUnit ul#inputAccount li.loginId   label input.focus {}
	#navigation #loginUnit ul#inputAccount li.loginPass label input.focus {}
	
	#navigation #loginUnit ul#inputAccount li.loginId   label input.inputTrue {	background-image: none;}
	#navigation #loginUnit ul#inputAccount li.loginPass label input.inputTrue {	background-image: none;}

	
	/* Message (log out)
	---------------------------------------- */
	#navigation #loginUnit p.message {
		margin: 0 2px 5px 3px;
		padding: 10px 75px 10px 8px;
		min-height: 16px;
		background: url(../images/base/loginUnit_bg_04.jpg) no-repeat;
		color: #8391A1;
		font-size: 120%;
		line-height: 1.335;
	}
	
	/* Button Submit
	---------------------------------------- */
	#navigation #loginUnit p.buttonSubmit {
	position: absolute;
	top: 34px;
	left: 15px;
	width: 155px;

}

	.sublogout {left:183px !important;}
	.usebtn{ background-color:#1a222a; border:1px #151b22 solid;padding:5px 30px;top:28px !important;}
	.useMsg{position: absolute; bottom:4px; font-size:88%;width: 220px;left: 15px;}
	
	/*#navigation #loginUnit p.buttonSubmit input {
		width: 155px;
		height: 24px;
	}*/
	
	/* Button Unit
	---------------------------------------- */
	#navigation #loginUnit ul.buttonUnit {
		margin: 0 7px 0 10px;
		background: url(../images/base/loginUnit_bg_03.jpg) no-repeat 0 100%;
		zoom: 1;
	}
	#navigation #loginUnit ul.buttonUnit:after {content: "."; display: block; clear: both; height: 0px; visibility: hidden;}
	
	#navigation #loginUnit ul.buttonUnit li {
		padding: 3px 0 2px;
		width: 112px;
		background: url(../images/base/loginUnit_bg_03_top.gif) no-repeat;
		font-size: 90%;
		line-height: 1.334;
		text-align: center;
	}
	
	#navigation #loginUnit ul.buttonUnit li.forgetPass {
		float: left;
	}
	
	#navigation #loginUnit ul.buttonUnit li.newEntry {
		float: right;
		background-position: -118px 0;
	}
	
	#navigation #loginUnit ul.buttonUnit li a {
		text-decoration: none;
	}
	
	#navigation #loginUnit ul.buttonUnit li.forgetPass a {
		padding: 0 0 0 14px;
		background: url(../images/base/loginUnit_ico_01.gif) no-repeat 0 49%;
		color: #515D6A;
	}
	
	#navigation #loginUnit ul.buttonUnit li.newEntry a {
		color: #8A5E18;
	}
	
	#navigation #loginUnit ul.buttonUnit li a:hover {
		text-decoration: underline;
	}
	
	/* Status (logout)
	---------------------------------------- */
	#navigation #loginUnit ul.status {
		margin: 0 10px 0 4px;
	}
	
	#navigation #loginUnit ul.status li {
		display: inline;
		margin: 0 0 0 8px;
		color: #8391A1;
		font-size: 120%;
		line-height: 1.335;
	}
	
	#navigation #loginUnit ul.status li.rank {
		padding: 0 0 0 10px;
		border-left: 1px solid #8391A1;
	}
	
	#navigation #loginUnit ul.status li img {
		position: relative;
		top: -3px;
	}
	*:first-child + html #navigation #loginUnit ul.status li img {top: -4px;}
	
	#navigation #loginUnit ul.status li span.levelNum {
		color: #FFCB00;
	}


/* Localnavi
========================================== */
#navigation #localnavi {
	margin: 1px 0 20px;
	padding: 12px 0 0;
	background:url(../images/base/navigation_bg.png) repeat 0 0; 
	overflow: hidden;
}

#navigation #localnavi h2 {
	margin: 0 0 15px;
}

#navigation #localnavi ul.menu {
	margin: 0 14px;
	padding: 0;

}

#navigation #localnavi ul.menu li {
 
	padding: 10px 0 3px 16px;
		background: url(../images/base/bg2.png) no-repeat;
		font-size: 12px;
		line-height: 1.334;
		zoom: 1;
		
}


		
/**
	 * nav
	 */
 

	#navigation #localnavi .a {
		position: relative;
		padding: 0 0 0 18px;
		color: #9999ff;
		text-decoration: none;
		font-weight: bold;
	}
	#navigation #localnavi .a:hover {
		color: #FFFFFF;
	}

	#navigation #localnavi .a .icon {
		display: block;
		position: absolute;
		top: -1px;
		left: 0;
		width: 10px;
		height: 10px;
		border: 2px solid #3194FF;
		-webkit-border-radius: 4px;
		   -moz-border-radius: 4px;
		    -ms-border-radius: 4px;
		     -o-border-radius: 4px;
		        border-radius: 4px;
		color: #3194FF;
		line-height: 10px;
		text-align: center;
		font-family: "ＭＳ ゴシック", sans-serif;
		font-weight: normal;
	}
	#navigation #localnavi .a:hover .icon {
		color: #FFFFFF;
		border-color: #FFFFFF;
	}

 

 
	#navigation #localnavi .item.disabled .a .icon {
		border-color: #999999;
		color: #999999;
	}
	

/* BannerArea
========================================== */
#navigation ul#bannerArea {
	margin: 0 21px 30px;
}

#navigation ul#bannerArea li {
	margin: 10px 0 0;
}


/* Footer
****************************************************************************/
#footer {
	background: #000000;
	position:relative;
}

#footer .inner {
	position: relative;
	margin: 0 auto;
	padding: 14px 35px 50px 120px;
	width: 785px;
}

#footer p {
	color: #666666;
}

#footer p#footerLogo01 {
	position: absolute;
	top: 19px;
	left: 13px;
	width: 104px;
}

#footer .unit {
	display: table;
	margin: 0 0 0 auto;
	text-align: right;
}

#footer ul#footerLogo02 {
	display: inline;
}

#footer ul#footerLogo02 li {
	display: inline;
	margin: 0 8px 0 0;
}

#footer ul#footerLogo02 li img {
	position: relative;
	top: -1px;
	vertical-align: middle;
}

#footer p#copyright {
	display: inline;
}