@charset "utf-8";
/* CSS Document */
/*全称セレクター*/
*{
margin:0px;
padding:0px;
}
body {
    font-family: "Hiragino Sans", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
    color: #330099;
    background-color: #EFEFEF;
    /*background: url("../image/background/bg_gray.png")*/
    width: 750px;
    margin: 0;
    text-align: center;
}
#wrapper{/*全体を包む*/
width: 750px;
margin: 0 auto;
padding:0;
text-align: center;
background: #777777;
}
#header{
background:linear-gradient(#BBBBBB, #CCCCCC, #EEEEEE);
  /*url("../image/background/bg_gray.png") #CCCCCC;headerの背景色グレー文字は濃紺*/
color: #191970;
margin:0;
width:750px;
padding: 0;
display: flex;
text-align: left;
}
#header h1 {/*header内見出し1*/
    font-family: Georgia, "Times New Roman", Times, "serif";
    font-size: 1.8rem;
    margin: 0;
    padding: 40px 10px 50px 5px;
    line-height: 0.7em;
    font-weight: 600; 
    text-shadow: 2px 2px  2px #808080, 3px 3px 3px #444444;
}
#header h2{/*header内見出し2*/
font-family: Georgia, "Times New Roman", Times, "serif";
font-size: 0.8rem;
margin:0;
color: #ff1493;
line-height: 0.2em;
padding: 20px 10px 5px 10px;
text-shadow: 2px 2px  2px #bc8f8f;
letter-spacing: 3px;
}

#header img{/*header内image*/
    padding:10px 20px;
    float: left;
    filter: drop-shadow(4px 4px 3px rgba(29,29, 86, 0.8));
    max-width: 50%;
    max-height: 50%;
    }
#update{
  float: right;
  font: 0.5em;
  font-style: italic;
  font-family: Arial, Helvetica, "sans-serif";
  margin-top: 0;
  margin-right: 10px;
  margin-bottom: 0;
  margin-left: 320px;
}
#navigation{
  width: 750px;
  margin: 0;
  background-color: #CCCCCC;
}
#navigation ul{        
  float: left;
  list-style: none;
  margin: 0;
  padding: 0;
  color: #330099; 
  background-color: #CCCCCC;
  }
#navigation ul li{
        margin: 0;
        width: 148.5px;
        height: 15px;
        float: left;
        padding: 8px 0;
       text-align: center;
       background-color: #CCCCCC;
       color: #191970;
       font-weight: bold;
       font-size: 0.6em; 
       border-bottom: 3px solid #AAADBA;
       border-right:1px dotted #999999;
      display: inline-block;
        }
#navigation ul li a{
  text-decoration: none;
  color: #330099;
}
#navigation ul li a:link{
	background-color: #CCCCCC;
	text-decoration: none;
}
#navigation ul li a:hover{
	background-color: #C0DFFF;
}        
#navigation ul li a:visited{
  color:#602D75;    
}

#navigation ul li:first-child {
	border-left:solid 1px #999999;
	}
#navigation ul li:last-child {
	border-right:solid 1px #999999;
}
#main{
        background: url("../image/index/topback1.png");
        width: 100%;
        height: 600px;
        padding: 0;
        margin: 0;
        text-align: left;
        /*border:8px #ffffff solid;*/
        }
#main p{
  width: 350px;
  padding: 20px;
  background: rgba(80, 130, 180, 0.7);
  top: 240px;
  float: right;
  color: #E3F95F;
  border-radius: 20px;
  margin-top: 30px;
  margin-right: 40px;
  margin-bottom: 250px;
  margin-left: 400px;
  font-size: 95%;
}
#footer{/*トップページのフッター部分指定*/
			background:url(../image/background/bg_gray.png) bottom repeat-x;
			height:40px;
			width:100%;
			border-top:#696A70 1px;
			padding:0;
			margin:0;
			font-size:80%;
			font-family: "Times New Roman", Times, serif;			
						}			 
#footer img{
  text-align: center;
  margin: 10px auto;
  display:inline-block;
}
.clearAll{
clear:both;
}
.slider{
  margin: 0;
  padding: 0;
  border:#625E5E 1px;}
 @media screen and (min-width: 768px)
{
body{background:url(	../image/background/bg_blue1.jpg);
  width:80%;}

}

@media screen and (max-width: 768px)
{
body{background:url(	../image/background/bg_blue1.jpg);}
#wrapper{
max-width: 95%;
}
#header{
max-width:100%;
}
  #header h1 {
  font-size: 1.5rem;
  }
#navigation{
max-width:100%;
}

#navigation ul li{
	max-width:141px;
}
}
@media screen and (max-width: 639px)
{
#wrapper{
max-width: 78%;
}
#header{
max-width:100%;
}
#navigation{
max-width:100%;
}

#navigation ul li{
	max-width:115px;
}
}
@media screen and (max-width: 400px)
{
#mainbox{
max-width: 95%;
line-height: 0.6rem;
margin: 0;
font-size:0.7rem;
}
header{
max-width: 93%;
margin: 0 auto;
font-size:0.6rem;
}
#info{
margin: 0;
max-width:95%;
font-size:0.8rem;
}
table{
margin:0;
max-width:100%;
}
table th{
font-size:0.7rem;
width:20%;
}
}