/* CSS Document */
body        {font-family: 'メイリオ',
            'Hiragino Kaku Gothic Pro', sans-serif;
            background-color:#ffffff;
            margin: 0;
}

p.map { max-width: 650px; }

p.map img { width: 100%; }

.new   {color:red;
        font-weight: bold}

.l200   {line-height: 200%;
            margin-left: 1em}

h2   {margin: 0 0 0 20px;
            font-size: 16px;
            font-weight: normal}

header img  {display: block;
            margin-top: 40px}

nav         {margin-top: 3px;
            margin-left: 20px;
            }


nav ul li a	{
    width:auto;
    font-size: 14px;
	display: block;
	color:#FFFFFF;
    padding: 10px 10px;
	background-color: #003399;
    border-radius: 5px;
	text-decoration: none;
	}

nav ul li a:hover   {background-color: cornflowerblue}

.tera {background-color:darkorchid}

nav:after {
    content: ".";
    clear: both;
    height: 10px;
    display: block;
    visibility: hidden;
}

article		{
	width: 100%;
    clear: both;
}

article:after {
    content: ".";
    clear: both;
    height: 30px;
    display: block;
    visibility: hidden;
}

h3  {font-size: 18px;
    font-weight: normal;
    display: block;
    color:white;
    background-color: #1c5ed4;
    margin: 0px 0px 10px 0px;
    padding: 0 10px
    }

h4.sub  {font-size: 16px;
    font-weight: normal;
    color:white;
    background-color: #12449f;
    margin: 30px 10px 10px 10px;
    padding: 0 10px
    }

h4.top  {margin: 5px 0px}

h5  {font-size: 17px;
    font-weight: normal;
    color:blueviolet;
    margin: 0 0.5em}

section a:hover {color:white;
                background-color:cornflowerblue}

section p   {margin: 0 0.5em}

section.circle  {width:95%;
    float:none;
	margin: 0px;
    padding: 0px;
	border: none;
    border-radius: none;
    box-shadow: none;
            background: none;
    }

section.wide		{
    width: 96%;
    float:left;
	margin: 5px;
    padding: 10px;
	border: 1px solid #008800;
    border-radius: 5px;
    box-shadow: 5px 5px 5px #ddddff;
            background: -webkit-linear-gradient(#ffffff 0%, #fffae6 50%);
            background: -moz-linear-gradient(#ffffff 0%, #fffae6 50%);
            background: -o-linear-gradient(#ffffff 0%, #fffae6 50%);
            background: -ms-linear-gradient(#ffffff 0%, #fffae6 50%);
    }

p           {margin: 0}

footer      {width: 100%;
            clear: both;
            }

nav#form ul	{width: 100%;
		margin: 0;
		padding: 0;
        list-style-type: none;
}
    
nav#form ul li   {width:30%;
            border: 0px;
            margin: 5px;
            float:left;
            text-align:center;
}

nav#form ul li a	{
    width:auto;
    font-size: 16px;
	display: block;
	color:#FFFFFF;
    padding: 40px 10px;
	background-color: #9d4507;
    border-radius: 30px;
	text-decoration: none;
	}

nav#form ul li a:hover   {background-color: #f08941}

nav#form:after {
    content: ".";
    clear: both;
    height: 10px;
    display: block;
    visibility: hidden;
}

.lesson {font-family: "游明朝", YuMincho, "ヒラギノ明朝 ProN W3", "Hiragino Mincho ProN", serif;
    font-weight: bold;
}

/*パソコン*/
@media only screen and (min-width: 850px){
div#container   {width: 800px;
                margin-left: auto;
                margin-right: auto;
                padding: 20px;
                webkit-box-shadow: 0px 0px 30px #bbbbbb;
                box-shadow: 0px 0px 30px #bbbbbb;
}

h1	{margin: 0 0 0 20px;
    font-size: 35px;
    color:#9d4507;
    text-shadow: 5px 10px 10px rgba(181, 132, 132, 0.5);
}

header		{width: 100%;
			padding: 10px 0 0 0;
            background-color:aliceblue;
    box-shadow: 5px 5px 5px #bbbbbb;
}
    
.greet  {margin: 20px 150px 0px;
    padding:10px;
    line-height: 180%;
    background-color: beige;
    border-radius: 20px;
    box-shadow: 5px 5px 5px #ddddff}

nav ul	{width: 750px;
		margin: 0;
		padding: 0;
        list-style-type: none;
}
    
nav ul li   {width:148px;
            border: 1px;
            margin: 1px;
            float:left;
            text-align:center;
}

section		{
    width: 46%;
    float:left;
	margin: 5px;
    padding: 10px;
	border: 1px solid #008800;
    border-radius: 5px;
    box-shadow: 5px 5px 5px #ddddff;
            background: -webkit-linear-gradient(#ffffff 0%, #f3fae0 50%);
            background: -moz-linear-gradient(#ffffff 0%, #f3fae0 50%);
            background: -o-linear-gradient(#ffffff 0%, #f3fae0 50%);
            background: -ms-linear-gradient(#ffffff 0%, #f3fae0 50%);
    }

section a   {font-size: 18px;
            font-weight: bold;
            color:blue;
            text-decoration:none;
            padding: 5px 10px}

section.blank   {
    width: 46%;
    float:left;
	margin: 5px;
    padding: 10px;
	border: none;
    border-radius: 5px;
    box-shadow: 5px 5px 5px #ffffff;
    background: none}

address {font-size: 14px;
        font-style: normal;
    padding-left: 10px;
	border-top-width: 1px;
	border-top-style: groove;
}

  .flex{
    display:flex;
    flex-wrap:nowrap;
    justify-content:space-between;
  }
    

}
 /*タブレット*/
@media only screen and (min-width: 600px) and (max-width: 849px){

h1	{margin: 0 0 0 20px;
    font-size: 35px;
    color:#9d4507;
    text-shadow: 5px 10px 10px rgba(181, 132, 132, 0.5);
}

header		{
			padding: 10px 0 0 0;
            margin: 0 30px 0 0;
            background-color:aliceblue;
    box-shadow: 5px 5px 5px #bbbbbb;
}
    
div#container   {width: 100%;
                margin-left: auto;
                margin-right: auto;
                padding: 20px;
                webkit-box-shadow: 0px 0px 30px #bbbbbb;
                box-shadow: 0px 0px 30px #bbbbbb;
}

.greet  {
    margin: 20px 30px 0px 0px;
    padding:10px;
    line-height: 180%;
    background-color: beige;
    border-radius: 20px;
    box-shadow: 5px 5px 5px #ddddff}

nav ul	{
		margin: 0;
		padding: 0;
        list-style-type: none;
}

nav ul li   {width: 32%;
            border: 1px;
            margin: 1px;
            float:left;
            text-align:center;
}

section		{
    width: 90%;
    float:left;
	margin: 5px;
    padding: 10px;
	border: 1px solid #008800;
    border-radius: 5px;
    box-shadow: 5px 5px 5px #ddddff;
            background: -webkit-linear-gradient(#ffffff 0%, #f3fae0 50%);
            background: -moz-linear-gradient(#ffffff 0%, #f3fae0 50%);
            background: -o-linear-gradient(#ffffff 0%, #f3fae0 50%);
            background: -ms-linear-gradient(#ffffff 0%, #f3fae0 50%);
    }

section a   {font-size: 18px;
            font-weight: bold;
            color:blue;
            padding: 5px 10px}

section.blank   {display: none}

address {font-size: 14px;
        font-style: normal;
    padding-left: 10px;
	border-top-width: 1px;
	border-top-style: groove;
}
    }
 /*スマートホン*/
@media only screen and (max-width: 599px){

h1	{margin: 0 0 0 20px;
    font-size: 20px;
    color:#9d4507;
    text-shadow: 5px 10px 10px rgba(181, 132, 132, 0.5);
}

header		{
			padding: 10px 0 0 0;
            margin: 0 0 0 0;
            background-color:aliceblue;
    box-shadow: 5px 5px 5px #bbbbbb;
}
    
div#container   {width: 100%;
                margin-left: auto;
                margin-right: auto;
                padding: 20px;
                webkit-box-shadow: 0px 0px 30px #bbbbbb;
                box-shadow: 0px 0px 30px #bbbbbb;
}

.greet  {
    margin: 20px 0px 0px 0px;
    padding:10px;
    line-height: 180%;
    background-color: beige;
    border-radius: 20px;
    box-shadow: 5px 5px 5px #ddddff}

nav ul	{
		margin: 0;
		padding: 0;
        list-style-type: none;
}

nav ul li   {width:45%;
            border: 1px;
            margin: 1px;
            float:left;
            text-align:center;
}
    
section		{
    width: 95%;
    float:left;
	margin: 5px;
    padding: 10px;
	border: 1px solid #008800;
    border-radius: 5px;
    box-shadow: 5px 5px 5px #ddddff;
            background: -webkit-linear-gradient(#ffffff 0%, #f3fae0 50%);
            background: -moz-linear-gradient(#ffffff 0%, #f3fae0 50%);
            background: -o-linear-gradient(#ffffff 0%, #f3fae0 50%);
            background: -ms-linear-gradient(#ffffff 0%, #f3fae0 50%);
    }

section a   {font-size: 18px;
            font-weight: bold;
            color:blue;
            padding: 5px 10px}

section.blank   {display: none}

address {font-size: 12px;
        font-style: normal;
	border-top-width: 1px;
	border-top-style: groove;
}
}