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

/*HTMLの初期スタイルをリセット↓ここから↓*/
*{
	margin:0px;
	padding:0px;
}
body {
	background-color: #FFFFFF;
	color: #000000;
	font-family: "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	height: auto;
	width: auto;
}
img {
	border:none;
     max-width: 100%;
     height: auto;
}
ol,ul{
	list-style-type:none;
}
html {
-webkit-text-size-adjust: 100%; /* iPhone */
}
a{
	text-decoration:none;
	color:#333;

}
/*HTMLの初期スタイルをリセット↑ここまで↑*/

#wrap{
	height:100%;
	width:auto;
}
/*↓ここからヘッダー↓*/
#header{
	height:100%;
	width:auto;
}
h1{
	height:100%;
	width:auto;
	padding:10px;
	font-size:18px;
	text-align:left;
	color: #ffffff;
	background-color:#3399CC;
	background: -moz-linear-gradient(
		top,
		#79c7d8 0%,
		#459fbb 50%,
		#007099 50%,
		#0085ad);
	background: -webkit-gradient(
		linear, left top, left bottom, 
		from(#79c7d8),
		color-stop(0.50, #459fbb),
		color-stop(0.50, #007099),
		to(#0085ad));
	text-shadow:
		0px 0px 3px rgba(000,000,000,0.5),
		0px 1px 0px rgba(255,255,255,0.3);
}
#header p{
	height:100%;
	width:auto;
}
#header p img{
	height:auto;
	width:auto;
}
/*ヘッダー↑ここまで↑*/

/*↓ここからコンテンツ↓*/
#contents{
	height:100%;
	width:auto;
}
.clearFix:after{  
display:block;  
clear:both;  
height:0;  
visibility:hidden;  
content:".";  
zoom:1;  
}
/*↓ページ内で各カテゴリにジャンプするボタン↓*/
#contents #head_btn{
	height:100%;
	width:auto;
	margin:0 auto;
	
}
#contents #head_btn ul{
	height:100%;
	width:95%;
	margin:3px auto;
	overflow:hidden;
	border:solid 1px #ccc;
	border-radius:10px;
	-moz-border-radius:10px;
	-webkit-border-radius:10px;

}
#contents #head_btn ul li{
	height:100%;
	width:auto;
	border-top:solid 1px #ddd;
	/*float:left;*/
}
#contents #head_btn ul li:nth-child(1){
	border-top:solid 0px #ddd;
}
#contents #head_btn ul li a{
	height:52px;
	width:auto;
	line-height:52px;
	text-align:center;
	text-decoration:none;
	display:block;
	padding-left:3px;
	position:relative;
	box-sizing: border-box;
	-moz-box-sizing:border-box;
	-webkit-box-sizing:border-box;
	background: -moz-linear-gradient(
		top,
		#f5f5f5 0%,
		#d2ecfa);
	background: -webkit-gradient(
		linear, left top, left bottom, 
		from(#f5f5f5),
		to(#d2ecfa));
}
#contents #head_btn ul li a::after {
  content: "";
  position: absolute;
  right: 10px;
  top: 50%;
  display: block;
  width: 6px;
  height: 6px;
  margin-top: -4px;
  border-top: solid 2px #999999;
  border-right: solid 2px #999999;
  -webkit-transform: rotate(135deg);
   transform: rotate(135deg);
  -moz-transform: rotate(135deg);
}
/*↓ここから各カテゴリごとのボックス↓*/
#contents #categorybox{
	clear:both;
}
/*↓背景付タイトル部分↓*/
#contents #categorybox h2{
	height:100%;
	width:auto;
	font-size:130%;
	font-weight:bold;
	text-align:right;
	line-height:50px;
	padding-right:10px;
	color:#FFF;
	text-shadow: 1px 1px 1px #333333;
}
#contents #categorybox p{
	text-align:center;
	font-size:14px;
	padding:5px 10px;
	border-bottom: thin solid #999;
}
#contents #categorybox .title1{
	height:100%;
	width:auto;
	background-image:url(../image/syurui-betsu.png);
	background-repeat:no-repeat;
	background-position:center center;
-o-background-size: 100% 100%, auto;
-moz-background-size: 100% 100%, auto;
-webkit-background-size: 100% 100%, auto;
background-size: 100% 100%, auto;
}
#contents #categorybox .title2{
	height:100%;
	width:auto;
	background-image:url(../image/sonota.png);
	background-repeat:no-repeat;
	background-position:center center;
-o-background-size: 100% 100%, auto;
-moz-background-size: 100% 100%, auto;
-webkit-background-size: 100% 100%, auto;
background-size: 100% 100%, auto;
}
#contents #categorybox .title3{
	height:100%;
	width:auto;
	background-image:url(../image/sippai.png);
	background-repeat:no-repeat;
	background-position:center center;
-o-background-size: 100% 100%, auto;
-moz-background-size: 100% 100%, auto;
-webkit-background-size: 100% 100%, auto;
background-size: 100% 100%, auto;
}
/*↑背景付タイトル部分↑*/
#contents #categorybox .category{
	height:100%;
	width:auto;
	background-color:#f5f5f5;
	border: thin solid #999;
	margin:3px;
}
#contents #categorybox ul{
	height:100%;
	width:auto;
}
#contents #categorybox ul li{
	height:40px;
	width:auto;
	border-bottom: thin solid #999;
}
#contents #categorybox ul li:nth-last-child(1){
	border-bottom: 0px solid #999;
}
#contents #categorybox .category a{
	text-decoration:none;
	display:block;
	height:40px;
	margin:0 auto;
	line-height:40px;
	padding-left:10px;
	position:relative;
	background:#FFFFFF;
	list-style-type: none;
}
#contents #categorybox .category a::after {
  content: "";
  position: absolute;
  right: 10px;
  top: 50%;
  display: block;
  width: 6px;
  height: 6px;
  margin-top: -4px;
  border-top: solid 2px #3399FF;
  border-right: solid 2px #3399FF;
  -webkit-transform: rotate(45deg);
   transform: rotate(45deg);
  -moz-transform: rotate(45deg);
}
/*各カテゴリごとのボックス↑ここまで↑*/
/*↓ページ内でTOPにジャンプするボタン↓*/
#contents #categorybox .pagetop{
	text-align:right;
	font-size:14px;
	padding:5px;
}
#contents #categorybox .pagetop a{
	color:#39F;
	text-decoration:underline;
}
/*↑ここまでTOPページのスタイル↑*/

/*↓ここから下層目次ページ↓*/
#contents #bookindex{
	height:100%;
	width:auto;
	background-color:#f5f5f5;
	border: thin solid #999;
	margin:3px;
}
h3{
	height:100%;
	width:auto;
	font-weight:bold;
	font-size:18px;
	text-align:right;
	line-height:50px;
	padding-right:10px;
	color:#FFF;
	text-shadow: 1px 1px 1px #333333;
	background-color:#699;
}
#contents #bookindex p{
	text-align:center;
	font-size:14px;
	padding:10px 10px;
	border-bottom: thin solid #999;
}
#contents #bookindex ul{
	height:100%;
	width:auto;
}
#contents #bookindex ul li{
	height:40px;
	width:auto;
	border-bottom: thin solid #999;
}
#contents #bookindex ul li:nth-last-child(1){
	border-bottom: 0px solid #999;
}
#contents #bookindex ul li a{
	text-decoration:none;
	display:block;
	height:40px;
	margin:0 auto;
	line-height:40px;
	padding-left:10px;
	position:relative;
	background:#FFFFFF;
	list-style-type: none;
}
#contents #bookindex ul li a::after {
  content: "";
  position: absolute;
  right: 10px;
  top: 50%;
  display: block;
  width: 6px;
  height: 6px;
  margin-top: -4px;
  border-top: solid 2px #3399FF;
  border-right: solid 2px #3399FF;
  -webkit-transform: rotate(45deg);
   transform: rotate(45deg);
  -moz-transform: rotate(45deg);
}
/*↑ここまで下層目次ページ↑*/
/*↓ここから読み物内容ページ↓*/
#contents #book{
	height:100%;
	width:auto;
	text-align:left;
	background-color:#f5f5f5;
	border: thin solid #999;
	margin:3px;
}
h4{
	height:100%;
	width:auto;
	font-weight:bold;
	font-size:18px;
	padding:10px;
	color:#FFF;
	text-shadow: 1px 1px 1px #333333;
	background-color:#6CF;
}
#contents #book p{
	font-size:16px;
	line-height:18px;
	padding:10px;
}
/*ここまで読み物内容ページ*/
/*下層ページ戻りボタン*/
#contents #back_top a{
	text-decoration:none;
	position:relative;
	display:block;
	width:auto;
	height:100%;
	color: #ffffff;
	font-size:100%;
	padding: 10px 30px;
	background-color:#6d98e3;
	background: -moz-linear-gradient(
		top,
		#6d98e3 0%,
		#4775ad);
	background: -webkit-gradient(
		linear, left top, left bottom, 
		from(#6d98e3),
		to(#4775ad));
	border: 1px solid #5c60a8;
	-moz-box-shadow:
		0px 1px 1px rgba(000,000,000,0),
		inset 0px 0px 1px rgba(255,255,255,0.8);
	-webkit-box-shadow:
		0px 1px 1px rgba(000,000,000,0),
		inset 0px 0px 1px rgba(255,255,255,0.8);
	box-shadow:
		0px 1px 1px rgba(000,000,000,0),
		inset 0px 0px 1px rgba(255,255,255,0.8);
	text-shadow:
		0px 0px 0px rgba(000,000,000,0),
		0px 1px 1px rgba(095,100,163,1);

}
#contents #back_top a::before {
  content: "";
  position: absolute;
  left: 10px;
  top: 50%;
  display: block;
  width: 6px;
  height: 6px;
  margin-top: -4px;
  border-top: solid 2px #CCCCCC;
  border-right: solid 2px #CCCCCC;
  -webkit-transform: rotate(-135deg);
   transform: rotate(-135deg);
  -moz-transform: rotate(-135deg);
}
/*戻りボタン↑ここまで↑*/	


/*↓ここからフッターエリア↓*/
#footer{
	width:auto;
	height:100%;
	text-align:center;
	line-height:25px;
	padding:20px;
	background-color:#666;
}
#footer li a{
	font-size:14px;
	color:#FFF;
}
#footer #copy{
	font-size:12px;
	padding-top:5px;
}
/*↑ここまでフッターエリア↑*/