@charset "utf-8";
/* layout.php用 */

body {
	background: url(../images/bg_grad.jpg) left 20px repeat-x;
}

#root {
	background: url(../images/bg_hb.jpg) no-repeat center -25px scroll;
	width: 950px;
	min-height: 100px;
	margin: 0 auto;
}
	/* header */
	#header {
		height: 110px;
	}
		#header_left {
			float: left;
			width: 600px;
			height: 110px;
		}
			#global_navi {
				float: left;
				height: 25px;
			}
			#global_navi ul li {
				float: left;
				height: 25px;
				margin-left: 2px;
			}
			#global_navi ul li a {
				height: 25px;
				background-image: url(../images/common.gif);
				text-transform: uppercase;
			}

			#global_navi ul li.home a { width: 60px; background-position: 0px 0px; }
			#global_navi ul li.home a:hover,
			#global_navi ul li.home a.on { background-position: 0px -25px; }
			#global_navi ul li.info a { width: 120px; background-position: -60px 0px; }
			#global_navi ul li.info a:hover,
			#global_navi ul li.info a.on { background-position: -60px -25px; }
			#global_navi ul li.mygames a { width: 90px; background-position: -180px 0px; }
			#global_navi ul li.mygames a:hover,
			#global_navi ul li.mygames a.on { background-position: -180px -25px; }
			#global_navi ul li.charge a { width: 70px; background-position: -270px 0px; }
			#global_navi ul li.charge a:hover,
			#global_navi ul li.charge a.on { background-position: -270px -25px; }
			#global_navi ul li.myaccount a { width: 110px; background-position: -340px 0px; }
			#global_navi ul li.myaccount a:hover,
			#global_navi ul li.myaccount a.on { background-position: -340px -25px; }
			#global_navi ul li.help a { width: 60px; background-position: -450px 0px; }
			#global_navi ul li.help a:hover,
			#global_navi ul li.help a.on { background-position: -450px -25px; }

		#header_right {
			float: left;
			width: 340px;
			height: 90px;
			padding: 5px;
		}
			#header_right .banner {
				width: 340px;
				height: 90px;
				background: url(../images/header_banner.png) left top no-repeat;
			}

	#container_head, #container_foot {
		height: 10px;
		background: url(../images/common.png);
		font-size: 0px;
	}
	#container_head { background-position: 0px 0px; }

	#container_center {
		background: url(../images/container_bg.png) repeat-y left top;
	}
		#container_left {
			float: left;
			width: 200px;
			height: 10px;
			padding-left: 10px;
		}
			#submenu div.head,
			#submenu div.foot {
				background-image: url(../images/common.png);
			}
			#submenu div.head {
				height: 20px;
				background-position: 0px -20px;
			}
			#submenu div.foot {
				height: 15px;
				background-position: 0px -40px;
			}

			#submenu ul {
				display: none;
				background: url(../images/submenu_bg.png) repeat-y left top;
			}
			#submenu ul li {
				width: 170px;
				margin-left: 10px;
				border-top: #ffffff dotted 1px;
			}
			#submenu ul li.head {
				border: none;
			}
				#submenu ul li a {
					display: block;
					width: 170px;
					padding: 0.8em 0 0.8em 1em;
					text-transform: uppercase;
				}
		#container_right {
			float: left;
			width: 720px;
			padding-left: 10px;
		}

	#footer {
		background: url(../images/container_bg.png) repeat-y left top;
	}
		#footer .logo {
			float: left;
			width: 210px;
		}
			#footer .logo a {
				width: 173px;
				height: 29px;
				margin: 15px 0 0 25px; 
				background: url(../images/common.png) 0px -65px;
			}
		#footer .site_info {
			float: left;
			width: 705px;
			margin: 10px 0 0 15px;
		}
			#footer .site_info ul li {
				display: inline;
				margin: 2px 0;
				padding: 0 5px;
				border-left: #FFF solid 1px;
				line-height: 1em;
			}
			#footer .site_info ul li.head {
				border: none;
			}
				#footer ul li a { color: #FF9900; line-height: 1em; }
				#footer ul li a:hover { color: #FFFF00; }
			#footer .site_info .copyright {
				clear: both;
				padding-left: 5px;
				color: #FFF;
				font-size: 10px;
			}

	#container_foot { background-position: 0px -10px; }