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

/* Reset
------------------------------------------------------------*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,form,fieldset,input,textarea,p,blockquote,th,td {
margin: 0;
padding: 0;
}
address,em { font-style: normal; }
strong,th { font-weight: normal; }
table {
border-collapse: collapse;
}
th { text-align: left; }
hr,legend { display: none;	}
h1,h2,h3,h4,h5,h6 { font-size: 100%; }
img,fieldset { border: 0; }
li { list-style-type: none; }

/* Fonts
------------------------------------------------------------*/
body {
font-size: 75%; /* IE */
font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","メイリオ",Meiryo,Osaka,"ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;
}
html>/**/body { font-size: 12px; } /* Except IE */

a:link { color: #333 ; text-decoration: none; }
a:visited { color: #555 ; text-decoration: none; }
a:hover { color: #555 ; text-decoration: underline; }
a:active { color: #555 ; text-decoration: none; }

/* clearfix
------------------------------------------------------------*/
.clearfix { 
	content: '';
	display: block;
	clear: both;
	height:0;
	overflow:hidden;
	/zoom: 1; /* IE */
}

/* layoutx
------------------------------------------------------------*/
body {
	background-color:#FFF;
	text-align: center;
}
#headerBlock {
  text-align: right;
  width: 100%;
  background: #000;
}

#headerLogo {
  width: 1000px;
  margin: 0 auto;
}
#page {
line-height: 1.3;
color: #333;
width: 1000px;
text-align: left;
margin-right: auto;
margin-left: auto;
}

ul#globalnavi{
overflow:hidden;
margin-top:30px;
}
ul#globalnavi li{
float:left;
height:60px;
display:block;
background-image:url(../images/b_menu.gif);
}
ul#globalnavi li a {
display: block;
overflow: hidden;
height: 0px;
background-image: url(../images/b_menu.gif);
padding-top:60px;
}
/* global navi normal
---------------------*/
#navi1 a { width:168px; background-position:0       0;}
#navi2 a { width:166px; background-position:-168px  0;}
#navi3 a { width:166px; background-position:-334px  0;}
#navi4 a { width:166px; background-position:-500px  0;}
#navi5 a { width:166px; background-position:-666px  0;}
#navi6 a { width:168px; background-position:-832px  0;}
/* global navi rollover
----------------------*/
#navi1 a:hover  { width:168px; background-position:0       -60px;}
#navi2 a:hover  { width:166px; background-position:-168px  -60px;}
#navi3 a:hover  { width:166px; background-position:-334px  -60px;}
#navi4 a:hover  { width:166px; background-position:-500px  -60px;}
#navi5 a:hover  { width:166px; background-position:-666px  -60px;}
#navi6 a:hover  { width:168px; background-position:-832px  -60px;}
/* global navi page
----------------------*/
#navi1 { width:168px; background-position:0       -120px;}
#navi2 { width:166px; background-position:-168px  -120px;}
#navi3 { width:166px; background-position:-334px  -120px;}
#navi4 { width:166px; background-position:-500px  -120px;}
#navi5 { width:166px; background-position:-666px  -120px;}
#navi6 { width:168px; background-position:-832px  -120px;}

#gra {
	width:1000px;
	height:30px;
	background-image:url(../images/gra_menu.gif);
	background-position:top;
	margin-bottom:20px;	
}

#sideContentsBack {
	clear:left;
	float:left;
	width:1000px;
	overflow:hidden;
	background:#000;
}
#mainContentsBack {
	float:left;
	width:1000px;
	position:relative;
	right:300px;
	background:#FFF;
}
#mainContents {
	float:left;
	width:670px;
	position:relative;
	left:300px;
	padding-right: 30px;
	}

#sideArea {
	float:left;
	width:280px;
	position:relative;
	left:310px;
	margin-top:10px;
}
ul#sideNavi{
overflow:hidden;
}
ul#sideNavi li{
display:block;
background-image: url(../images/b_side.gif);
margin-top: 10px;
}
ul#sideNavi li a {
display: block;
overflow: hidden;
background-image: url(../images/b_side.gif);
}
/* global navi normal
---------------------*/
#sideNavi2 a { height:70px; background-position:0 0;}
#sideNavi3 a { height:70px; background-position:0 -70px;}
#sideNavi4 a { height:70px; background-position:0 -140px;}
#sideNavi5 a { height:70px; background-position:0 -210px;}
/* global navi rollover
----------------------*/
#sideNavi2 a:hover  { height:70px; background-position:280px 0;}
#sideNavi3 a:hover  { height:70px; background-position:280px -70px;}
#sideNavi4 a:hover  { height:70px; background-position:280px -140px;}
#sideNavi5 a:hover  { height:70px; background-position:280px -210px;}

#sideContents li{ margin-top:10px; }
#sideContents .construction li { color:#FFF; margin:0 0 0 15px;
 list-style-type:disc; }
#sideContents h3 { font-size:16px; font-weight:bold; }
#sideContents h4 { font-size:14px; }

#bannerWorks a {
display: block;  
overflow: hidden;  
height: 150px;  
width: 670px;
background-image: url(../images/bannerWorks.jpg);
margin-bottom:20px;
}  
#bannerWorks a:hover {  
background-position:bottom;  
}

#bannerForm a {
display: block;  
overflow: hidden;  
height: 70px;  
width: 670px;
background-image: url(../images/bannerForm.gif);
margin-bottom:20px;
}  

#bannerForm a:hover {  
background-position:bottom;  
}

#copyright {
	margin-top:50px;
	margin-bottom: 50px;
}

#footerArea {
	background:url(../images/footer.png) repeat-x ;
	clear: both;
	width: 100%;
	height: 100px;
	position:fixed;
	bottom:0;
	}

.title { margin-bottom: 15px; }

.content { margin-bottom: 30px; }

.topText { margin-top: 5px; color: #999; font-size:14px;}
.topText a:link { color:#FFF; }
.topText a:visited { color:#C9F; }
.topText a:hover { color:#C9F; }
.topText a:active { color:#FFF; }

.sideText { margin-top: 5px; color: #999; }
.sideText a:link { color:#FFF; }
.sideText a:visited { color:#C9F; }
.sideText a:hover { color:#C9F; }
.sideText a:active { color:#FFF; }
h5 { font-size:10px; }

.downloadbox { margin:20px 10px; }
.readerbox { padding:20px; background-color:#FFF0E6; }
.readerText { float:left; margin-top:3px; }
.readerLink { float:right; }
.colorTitle {
	color:#5E318F; 
	font-weight:bold;
	font-size:14px;
	}