body{
background-image:url(image/haikei11.jpg);
background-color:darkgray;
background-repeat:no-repeat;
background-position:center top;
background-attachment:fixed;

}

header{
width:800px;
margin-right:auto;
margin-left:auto;

}

div{
max-width:1000px;
margin-right:auto;
margin-left:auto;
color:white;
border-radius:0px;

}
#wrap{
max-width:1070px;
float:center;

}
#side{
width:350px;
float:left;
color:black;
background-color:whitesmoke;

}
#content{
width:640px;
float:right;
color:black;
background-color:whitesmoke;

}
#foot{
width:800px;
float:right;

}
#adress{
width:640px;
float:right;
background-color:dimgray;

}
clearfix:after{
clear:both;
display:block;
}

footer{
width:auto;
color:white;

}


h1{
color:white;
font-size:300%;
text-align:left;
font-family: 'Sawarabi Mincho', sans-serif;

}

h2{
color:white;
font-size:100%;
text-align:right;

}

h3{
color:white;
font-size:160%;
text-align:right;
}

h4{
color:white;
font-size:180%;
text-align:left;

}

h5{
text-align:left;
color:black;
font-size:120%;
}
#red{
color:crimson;
}
#blue{
color:blue;
}
#white{
color:black;
}
#green{
color:greenyellow;
}

h6{
text-align:left;
color:black;
font-size:100%;
}
#red{
color:red;
}
#blue{
color:blue;
}
#white{
color:black;
}
#green{
color:greenyellow;
}

h7{
color:white;
font-size:200%;
text-align:left;

}

h8{
text-align:left;
font-size:100%;
color:greenyellow;
}

h9{
font-size:300%;
}

h10{
font-size:300%;
}

h11{
text-align:left;
color:black;
font-size:120%;
}
#red{
color:crimson;
}
#blue{
color:blue;
}
#white{
color:black;
}
#green{
color:greenyellow;
}

h12{
text-align:left;
color:black;
font-size:100%;
}
#red{
color:red;
}
#blue{
color:blue;
}
#white{
color:black;
}
#green{
color:greenyellow;
}

li{
background-color:#696969;
text-align:center;
padding-top:10px;
padding-right:1px;
padding-bottom:10px;
padding-left:1px;
list-style:none;
opacity:0.9;
width:15.7%;
float:left;
border:solid 1px white;
border-radius:0px;

}

ul{
font-size:100%;
text-decoration:none;

}

ul:after{
content:"";
display:block;
clear:both;
color:black;
font-size:100%;

}

li a{
color:white;
font-size:120%;
text-decoration:none;

}

li a:hover{
color:darkorange;

}

section{
background-position:left top;
padding-top:0px;
padding-right:20px;
padding-bottom:0px;
padding-left:20px;
border-radius:0px;
border:solid 1px #696969;
border-top:solid 3px;

}
#sample{
background-position:left top;
padding-top:0px;
padding-right:20px;
padding-bottom:0px;
padding-left:20px;
border-radius:0px;
border:solid 0px;
}
#map{
background-position:left top;
padding-top:0px;
padding-right:0px;
padding-bottom:0px;
padding-left:0px;
border-radius:0px;
border:solid 3px steelblue;
}
#top{
background-position:left top;
background-image:url(image/top_moyousky.png);
padding-top:0px;
padding-right:20px;
padding-bottom:0px;
padding-left:20px;
border:solid 1px #696969;
border-top:solid 3px;
}

#int{
background-position:left top;
background-image:url(image/int_moyou.png);
padding-top:0px;
padding-right:20px;
padding-bottom:0px;
padding-left:20px;
border:solid 1px #696969;
border-top:solid 3px;

}

#news{
background-position:left top;
background-image:url(image/mes_momiji.png);
padding-top:0px;
padding-right:20px;
padding-bottom:0px;
padding-left:20px;
border:solid 1px #696969;
border-top:solid 3px;
}

table{
text-align:left;
width:none;

}

img{
max-width:100%;

}

iframe{
max-width:100%;

}


@media(max-width:1020px){

header{
width:auto;
margin-right:auto;
margin-left:auto;
padding-top:0px;
padding-right:0;
padding-bottom:0px;
padding-left:0;

}

div{
width:auto;
float:none;
}

#wrap{
width:auto;
float:none;
text-aligin:center;
text-decoration:none;
}

#side{
width:auto;
float:none;
}

#content{
width:auto;
float:none;
}

#foot{
width:auto;
float:none;
color:#696969;

}

#adress{
width:auto;
padding-top:5px;
padding-bottom:5px;
float:none;
text-aligin:center;
}

clearfix:after{
clear:both;
display:block;

}

footer{
width:100%;
color:gainsboro;
float:center;
text-align:center;

}

li{
background-color:#696969;
padding-top:1px;
padding-right:0px;
padding-bottom:1px;
padding-left:0px;
width:60%;
opacity:0.9;
float:none;

border:solid 1px white;
border-radius:0px;

}

li a{
padding:0em;
margin-bottom:0em;
display:block;
background-color:#696969;
border-radius:0px;
text-aligin:center;
text-decoration:none;

}

li a:hover{
color:darkorange;

}

h1{
color:white;
font-size:150%;
text-aligin:center;

}

h2{
color:white;
font-size:90%;
text-align:right;

}

h3{
font-size:140%;
text-align:right;
text-decoration:none;

}

h4{
color:white;
font-size:180%;
text-aligin:left;

}

h5{
text-align:left;
color:black;
font-size:100%;
}
#red{
color:crimson;
}
#blue{
color:blue;
}
#white{
color:black;
}
#green{
color:greenyellow;
}

h6{
text-align:left;
color:black;
font-size:80%;
}
#red{
color:crimson;
}
#blue{
color:blue;
}
#white{
color:black;
}
#green{
color:greenyellow;
}

h7{
color:white;
font-size:140%;

}

h8{
font-size:110%;
text-align:left;

}

h9{
font-size:360%;

}

h10{
font-size:200%;

}

h11{
text-align:left;
color:black;
font-size:100%;
}
#red{
color:crimson;
}
#blue{
color:blue;
}
#white{
color:black;
}
#green{
color:greenyellow;
}

h12{
text-align:left;
color:black;
font-size:80%;
}
#red{
color:red;
}
#blue{
color:blue;
}
#white{
color:black;
}
#green{
color:greenyellow;
}

li a{
color:white;
font-size:120%;
text-decoration:none;

}

li a:hover{
color:darkorange;

}



table{
width:100%;

}

th{
text-align:left;
float:left;
}

td{
text-align:left;
float:left;
}

section{
background-position:left top;
padding-top:0px;
padding-right:10px;
padding-bottom:0px;
padding-left:10px;
border-radius:0px;
border:solid 1px #696969;
border-top:solid 3px;

}
#sample{
background-position:left top;
padding-top:0px;
padding-right:0px;
padding-bottom:0px;
padding-left:0px;
border-radius:0px;
border:solid 0px;
}

}