@charset "utf-8";
/* MZ4 CSS Document */

/*
=======================================================================
Redefinition
=======================================================================
*/

* { margin: 0; padding: 0; }

html, body { height: 100%; }

body {
	background: #333;
	color: #fff;
	font-size: 62.5%;/* 16px * 62.5% = 10px */
	font-family: verdana, helvetica, arial, Meiryo, 'メイリオ', 'MS PGothic', 'ＭＳ Ｐゴシック', 'Hiragino Kaku Gothic Pro', 'ヒラギノ角ゴ Pro W3', Osaka, sans-serif;
	line-height: 1.6;
}

h1, h2, h3, h4, h5, h6, p, ul, ol, pre, blockquote { margin: 0 0 1.5em 0; font-style: normal; font-weight: normal; }

table { border-collapse: collapse; }

a { color: #fff; text-decoration: none; }

a:hover { text-decoration: underline; }

a img { border: 0; }

a:hover img{ opacity: 0.6; filter: alpha(opacity=60); }

/*
=======================================================================
Generic
=======================================================================
*/

.clr { clear: both; width: 1px; height: 1px; margin: 0 -1px -1px 0; padding: 0; border: 0; font-size: 0; line-height: 0; overflow: hidden;/* <div class="clr">&nbsp;</div> */ }

/*
=======================================================================
Font
=======================================================================
*/

h1 { font-size: 2.2em; font-weight: 900; }

h2 { font-size: 1.8em; font-weight: 600; }

h3 {  }

h4 { font-size: 1.2em; font-family: 'Verdana', 'helvetica', 'MS PGothic', "Osaka", "sans-serif"; }

h5 { font-size: 1.1em; }

h6 { font-size: 1.2em; }

p, td { font-size: 1.4em; }

#section1 li { font-size: 1.8em; font-weight: 100; }

#menu li { font-size: 1.2em; }

/*
=======================================================================
Contents
=======================================================================
*/

.section { position: absolute; width: 90%; height: 90%; border-left: 5em solid #888; background: #111; overflow: auto; }

.section { scrollbar-base-color: #111; scrollbar-highlight-color: #888; scrollbar-arrow-color: #fff; }


.section-inner { margin: 8em 5em; }

* html .section-inner { margin-top: 10em; }


#section1 { top: 0; left: 2px; background: #111 url(/mz4/images/bg-section1.gif) repeat left top; }

#section2 { top: 0; left: 100%; }

#section3 { top: 0; left: 200%; background: #111 url(/mz4/images/bg.gif) no-repeat right bottom; }

#section4 { top: 100%; left: 0; }

#section5 { top: 100%; left: 100%; background: #111 url(/mz4/images/bg.gif) no-repeat right bottom; }

#section6 { top: 100%; left: 200%; }

#section7 { top: 200%; left: 0; background: #111 url(/mz4/images/bg.gif) no-repeat right bottom; }

#section8 { top: 200%; left: 100%; }

#section9 { top: 200%; left: 200%; }


#menu { z-index: 3; top: 1em; }

#footer { z-index: 2; bottom: 2em; }

#menu, #footer { width: 100%; padding: 1em; background: #222; position: fixed; }

* html #menu, * html #footer  { position: absolute; }


h4 { float: left; margin: 0 3em 0 0; padding: 0; }

h6 { float: right; margin-right: 5em; padding: 0.3em; border: 1px solid #333; background: #222; display: block; }

#menu ul { margin: 0; padding: 0; list-style: none; }

#menu li { float: left; margin: 0 3em 0 0; padding: 0; }