/**
* Browser reset 
*/

html, body, body div, span, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, abbr, address, cite, code, del, dfn, em, img, ins, kbd, q, samp, small, strong, sub, sup, var, b, i, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, figure, footer, header, hgroup, menu, nav, section, time, mark, audio, video {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}									


/** 
* Typography  
*/

body,html{ width: 100%; height: 100%; }
body { font: 14px/22px "Arial", sans-serif; color: #999; }
h1,h2,h3,h4 { color: #666; font-weight: bold; padding-top: 22px;}
h1 { font-size: 28px; line-height: 35px; }
h2 { font-size: 22px; }
h3 { font-size: 18px; }
h4 { font-size: 100%; padding-top: 0; margin: 11px 0; }
h1,h2,h3,p,ul,ol,code,img { margin: 0 0 22px; }
img { border: 0; vertical-align: middle; width: 100%; height: auto; }
small { font-size: 11px; }
em { font-style: italic; }
strong {font-weight: bold;}
ul { list-style: inside square; }
ol { list-style-position: inside; }
hr { margin: 22px 0; height: 1px; border:0; width: 100%; background-color: #eee; }
a {  color: #999; text-decoration: underline; }
a:hover {color: #777; }
code { display: block; white-space: pre-wrap; font-size: 12px; margin-top: 22px; color: #777; border: 1px solid #eee; padding: 5px 10px; }
.right {float: right;}
.left {float: left;}
.clear {clear: both;}


/**
* Classes 
*/

.center-wrapper {  padding: 0 40px; border-left: 1px solid #eee; border-right: 1px solid #eee; width: 50%; margin-left: 25%; min-width: 700px; }
.header { padding: 0 0 22px; text-align: justify; }
.header h1 { margin-bottom: 44px; text-align: left; }
.contents { position: fixed; left: 1em; top: 0; background: #fff; min-width: 230px; margin-top: 20px; }
.contents .contents-header {margin: 0; padding: 11px 0; border-bottom: 2px solid #eee; text-align: center; margin-bottom: 20px; }
.contents .menu { list-style: none; color: #666; border-bottom: 1px solid #EEE; padding-bottom: 22px; }
.contents .menu li { margin: 2px 0; }
.contents .menu .sub { margin-left: 1em; font-size: 85%; color: #999; }
.contents .menu a { display: inline-block; text-decoration: none; color: inherit; padding: 0 5px; }
.contents .menu a:hover { color: #eee; background: #666; }
.footer { font-size: 11px; border-top: 1px solid #eee; margin-top: 44px; padding: 10px 0; overflow: hidden; }
.footer ul { float: left; list-style: inside none; position: relative; left: 50%; }
.footer ul li { position: relative; left: -50%; float: left; padding-right: 10px; margin-right: 10px; border-right: 1px solid #eee; }
.footer ul li:last-child { border-right: 0; }
.notice { font-size: 13px; line-height: 20px; padding: 10px; background: #ADD8E6; color: white; }



/**
* Media queries 
*/

@media only screen and (max-width: 1024px) {
	.contents { display: none; }
	.center-wrapper { width: 75%; min-width: 0; margin: 0 auto; }
}