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

/* id */
#wrap{
	width: 920px;
	margin: 10px auto 10px auto;
	overflow: hidden;
	background-image: url(styleimage/back_wrap.jpg);
}

#header{
	width: 900px;
	float: left;
	height: auto;
	padding: 0px 0px 0px 0px;
	margin: 10px 10px 10px 10px;
	/*background-color: gray; */ 
}

#menu{
	width: 240px;
	float: left;
	text-align: left;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 10px 10px;
	/*background-color: green;*/  
}

#main{
	width: 650px;
	float: right;
	text-align: left;
	padding: 0px 0px 0px 0px;
	margin: 0px 10px 10px 0px;
	/*background-color: green;*/  
}

/*type*/

body{
	color: black;
	font-size: medium;
	font-family: "UD デジタル 教科書体 N-B";/*	font-family: "Meiryo UI";*/
	text-align: center;
	background-image: url(styleimage/back_body.jpg);
}

a{
	color: #0058b0;
	text-decoration: none;
}

a:hover{
	color: #00cccc;
}

/* header */

h1{
	color: aqua;/*	font-family: HG丸ｺﾞｼｯｸM-PRO;*/
	font-size: x-large;
	text-align: left;
	height: 60px;
	padding-top: 40px;
	padding-right: 0px;
	padding-bottom: 0px;
	padding-left: 20px;
	margin-top: 0px;
	margin-right: 0px;
	margin-bottom: 0px;
	margin-left: 0px;
	background-image: url(styleimage/h1_bgimg.png);
	background-repeat: no-repeat;
}

h2{
	color: black;
	font-size: large;
	font-weight: bold;
	text-align: left;
	height: 25px;
	padding-top: 5px;
	padding-right: 0px;
	padding-bottom: 5px;
	padding-left: 20px;
	background-image: url(styleimage/h2_bgimg.png);
	background-repeat: no-repeat;
}

h3{
	color: black;
	font-size: medium;
	text-align: left;
	padding: 0px 0px 0px 0px; 
	text-decoration: underline;
}

/* table  general*/

table{
	font-family: "UD デジタル 教科書体 N-B";/*font-family: "Meiryo UI";*/
	border-width: 1px 0px 0px 1px;
	border-style: solid;
	border-color: gray;
	margin: 10px 0px 10px 0px;
}

th{
	color: black;
	background-color: #cccccc;
	border-width: 0px 1px 1px 0px;
	border-style: solid;
	border-color: gray;
	height: 30px;
	text-align: center;
}

td{
	color: black;
	background-color: transparent;
	border-width: 0px 1px 1px 0px;
	border-style: solid;
	border-color: gray;
	height: 30px;
	text-align: left;
}

/* table  invisible*/

table.invis{
	font-family: "UD デジタル 教科書体 N-B";/*font-family: "Meiryo UI";*/
	border-width: 0px 0px 0px 0px;
	border-style: solid;
	border-color: gray;
	margin: 10px 0px 10px 0px;
}
th.invis{
	color: black;
	background-color: #cccccc;
	border-width: 0px 0px 0px 0px;
	border-style: solid;
	border-color: gray;
	text-align: center;
}
td.invis{
	color: black;
	background-color: transparent;
	border-width: 0px 0px 0px 0px;
	border-style: solid;
	border-color: gray;
	text-align: left;
}

/* table for menu */

table.index{
	table-layout: fixed;
	border-width: 0px;
	border-style: solid;
	border-color: black;
	font-family: "UD デジタル 教科書体 N-B";
	height: auto;
	margin-top: 10px;
	margin-right: 0px;
	margin-bottom: 10px;
	margin-left: 0px;
	font-weight: bold;
}
td.index{
	color: black;
	font-weight: bold;
	border-width: 1px 1px 1px 1px;
	border-style: solid;
	border-color: white gray gray white;
	text-decoration: none; 
	width: 240px;
	height: 35px;
	text-indent: 0px;
	text-align: center;
	padding: 3px 0px 0px 0px;
	background-color: #cccccc;
}
td.index:hover{
	color: #0058b0;
	border-color: gray white white gray;
	background-image: none;
	background-color: #cccccc;
}	

/* table inside scroll */

tbody.scrollbody{
	overflow-y: scroll;
	height: 146px;
	width: 100%;
	border-style: hidden;
	border-width: 0px;
	border-color: aqua;
	display:block;
}

p{
	color:black;
	padding: 0px 0px 0px 0px;
	margin: 10px 0px 10px 0px;
}
	
img{
	max-width: 100%;
	height: auto;
	padding: 0px 0px 0px 0px;
	margin: 0px 0px 0px 0px;
}	

/* menu area link color */

#menu a{
	color: black;
	text-decoration: none;
}

*#menu a{
	display: block;
}

#menu a:hover{
	color: #0058b0;
} 

/* responsive -smart phone*/

@media only screen and (max-width: 480px) {
 
	#wrap{
 		width: 100%;
		padding: 0px 0px 0px 0px;
		margin:0px 0px 0px 0px;
 	}

	#header{
		float: none;
		width: 100%;
		padding: 0px 0px 0px 0px;
		margin:0px 0px 0px 0px;
	}

	#menu{
		float: none;
		width: 100%;
		padding: 0px 0px 0px 0px;
		margin: 0px 0px 0px 0px;
	}

	#main{
    		float: none;
		width: 100%;
		padding: 0px 0px 0px 0px;
		margin:0px 0px 0px 0px;
	}
 
	img{
		max-width: 100%;
		height: auto;
	}	

	td.index{
		width: 460px;
	}

}