@charset "UTF-8";

/*==============================================================================
  > INDEX
  ----------------------------------------------------------------------------
    0. Coding Rules
    1. Base Style
    2. Layouts
    3. Styles       (header area | content area | button in/out)
                    (game-package list | bland-logo list | others)
==============================================================================*/

/*==============================================================================
  > Coding Rules (Order to describe the properties of this CSS)
  ----------------------------------------------------------------------------
    1. display
    2. position
    3. top, right, bottom, left
    4. z-index
    5. float, clear
    6. margin (top - right - bottom - left)
    7. padding (top - right - bottom - left)
    8. border (width - style - color)
    9. width, max-width, min-width
   10. height, max-height, min-height
   11. overflow
   12. visibility
   13. tabe-layout, border-collapse, caption-side, empty-cells
   14. list-style, list-style-type, list-style-image, list-style-position
   15. color
   16. background (color - image - position - repeat - attachment)
   17. font-size, font-family, font-weight, font-style, font-variant, (font)
   18. text-indent, text-align, text-decoration, text-transform, white-space
   19. line-height, vertical-align
   20. content, quotes, cursor, outline (width - style - color)
==============================================================================*/


/* Base Style
------------------------*/

body {
	margin: 0;
	padding-top: 10px;
	background: #ffe4b1;
	font-size: 14px;
	font-family: Verdana, arial, sans-serif, "ヒラギノ角ゴ Pro W3", "ＭＳ ゴシック", "Osaka";
	text-align: center;
}


/* Layouts
------------------------*/

div#wrap {
	margin: 0 auto;
	padding-top: 60px;
	border: none;
	width: 830px;
	background: url(../img/bg.png) no-repeat;
}

div#header {
	position: relative;
	margin: 0;
	height: 80px;
}

div#main {
	margin: 0;
	padding-top: 15px;
	height: 520px;
}

div#footer {
	margin: 0 auto;
	padding: 0;
	width: 800px;
	text-align: center;
}

/* Styles
------------------------*/

/*-- header area --*/

div#header h1 {
	position: absolute;
	top: 15px;
	left: 245px;
	z-index: 1;
	margin: 0;
	padding: 0;
	width: 340px;
	height: 75px;
}

div#header h1 span {
	display: none;
}

div#header h1 img {
	margin: 0;
}

div#header div#top-logo {
	position: absolute;
	top: 15px;
	left: 245px;
	z-index: 0;
	padding: 0;
	border: none;;
	width: 340px;
	height: 75px;
	background: url(../img/bb-logo-bg.png) no-repeat;
	filter: alpha(opacity=60);
	opacity: 0.60;
}

/*-- content area --*/

div#main p {
	margin: 5px 0;
	padding: 0 140px;
	font-weight: 700;
}

div#main p.warning {
	margin: 0 140px;
	padding: 3px 0;
	border: 3px double #333;
	background: #eeeeff;
}

div#main p strong {
	color: #ff0000;
	font-size: 15px;
	font-weight: 700;
}

/*-- button in/out --*/

div#main ul#navi {
	margin: 10px auto 0;
	padding: 0;
	width: 220px;
	height: 60px;
	list-style-type: none;
}
div#main ul#navi li {
	float: left;
	margin: 0 10px;
	width: 90px;
	text-align: center;
}

*html div#main ul#navi li {
	margin: 0 8px;
}

div#main ul#navi li a {
	display: block;
	padding-top: 45px;
	width: 100%;
	height: 0 !important;
	height /**/: 45px;
	overflow: hidden;
	background-image: url(../img/button.png);
}

div#main ul#navi li#in a {
	background-position: 0 0;
	text-decoration: none;
}

div#main ul#navi li#out a {
	background-position: -90px 0;
	text-decoration: none;
}

div#main ul#navi li#in a:hover {
	background-position: 0 -45px;
}

div#main ul#navi li#out a:hover {
	background-position: -90px -45px;
}

div#main ul#navi li#in a.navi span,
div#main ul#navi li#out a.navi span {
	display: none;
	margin: 5px 0 0 8px;
	padding: 2px 5px;
	width: auto;
	font-size: 13px;
	text-align: left;
	line-height: 1.5;
}

div#main ul#navi li#in a.navi:hover span,
div#main ul#navi li#out a.navi:hover span {
	display: inline;
	position: absolute;
	background: #ffeeee;
	border: 3px outset #aaa;
	color:#000;
}


/*-- game-package list --*/

div#main ul#image {
	margin: 10px auto;
	padding: 0;
	width: 720px;
	height: 200px;
	list-style-type: none;
}

*html div#main ul#image {
	margin: 0 auto;
}

div#main ul#image li {
	float: left;
}

div#main ul#image li img {
	margin: 0 10px;
}

/*-- bland-logo list --*/

div#main ul#bland-logo {
	margin: 10px auto;
	padding: 0;
	width: 710px;
	height: 60px;
	list-style-type: none;
}

div#main ul#bland-logo li {
	float: left;
	width: 140px;
}

div#main ul#bland-logo li img {
	margin: 0;
}

/*-- others --*/

div#main hr {
	margin: 0 auto 0;
	border: none;
	border-top: 2px dotted #666;
	width: 720px;
}

div#footer p {
	margin: 0 auto;
	padding: 10px 0;
	width: 780px;
	font-size: 13px;
	text-align: right;
}