﻿body {
	font-size: 120%;
	font-family: "Hiragino kaku Gothic Pro";
	background-color: #f0fff0;
}
#topt { font-size:95%;
}
#navi {
	display: flex;
	flex-direction: row;
	text-align: center;
	align-items: center;
	justify-content: center;
	font-size:100%

}
#navin {
	display: flex;
	flex-direction: row;
	text-align: center;
	align-items: center;
	justify-content: center;
	font-size:100%

}
#navi div{
	
        width:250px;
	height: 80px;
	line-height:80px;
        color: #FFFFFF;
 	margin-bottom:10px;
}
#navin div{	
        width: 250px;
	height: 80px;
	line-height:80px;
        color: #FFFFFF;
}
#navi1{	
	background-color:#660000;
	order: 0;
}
#navi2{
	background-color:#000033;
	order: 0;
}
#navi3{
  	vertical-align: middle;
	background-color:#cc3300;
	order: 0;
}
#navi4{
  	vertical-align: middle;
	background-color:#333300;
	order: 0;
}
#navi5{
  	vertical-align: middle;
	background-color:#483d8b;
	order: 0;
}
#navi6{
  	vertical-align: middle;
	background-color:#a0522d;
	order: 0;
}
#navi7{
  	vertical-align: middle;
	background-color:#006400;
	order: 0;
}
#navi8{
  	vertical-align: middle;
	background-color:#c71585;
	order: 0;
}
#navi a{ text-decoration: none;}
#navi a:link { color: #ffffff; underline}
#navi a:visited { color: #ffffff;} 
#navi a:hover { color: #ffffff; }
#navi a:active { color: #ffffff; }

#navin a{ text-decoration: none;}
#navin a:link { color: #ffffff; underline}
#navin a:visited { color: #ffffff;} 
#navin a:hover { color: #ffffff; }
#navin a:active { color: #ffffff; }

H1{
 	font-size: 150%;
	text-align: center;
}
H2{
 	font-size: 110%;
	text-align: center;
}
H3{
	font-size:105%;
	margin-bottom: 0.2em;
}
ul{
	margin-top: 0em;
	margin-left: -1em;
}
li{
	padding: 0.1em;
}
#cont1{ text-align: center;
	line-height:2em;
	margin-bottom:3em;}

#cont2{ text-align: center;
	line-height:2em;
	margin-bottom:0em;
	background-color: #FFFFFF;
	}
#cont3{ text-align: left;
	line-height:2em;
	margin-bottom:3em;
	font-size: 80%;
	background-color: #FFFFFF;
	}

footer{ 
	font-size: 90%;
	text-align: left;
}
dl{
 	background-color: #FFFFFF;
}
dt{	padding: 1em 1em 0.5em 1em;
	background-color: #ffefff;
	font-weight: bold;
}
dd{	
	padding: 0.5em 1em 0.5em 0.5em;
	margin-bottom:1em;
}
#con {
	margin-left:1em;
	margin-right:1em;
}

#con_text {
	padding: 1em 1em 0em 1em;
}
#in_image img {
	border-radius: 8em;
}
@media screen and (min-width: 600px){
img{
	width:90%
}
#navi {
	font-size:110%

}
#navin {
	font-size:110%
}
dl{
	margin-left:3em;
	margin-right:3em;
}
#con {
	margin-left:3em;
	margin-right:3em;
}
#conpic1 {
	display: flex;
	flex-direction: row;
}
#conpic2 {
	display: flex;
	flex-direction: row;
}
#conpic3 {
	display: flex;
	flex-direction: row;
}
#con_image{
	flex-basis:40%;
}
#con_text{
	flex-basis:60%;
}

}
 }
#con_text{
	flex-basis:40%;
}

}
 