*0
	margin: 0px;
	padding:0px;

}
body {
	background:repeat #ffffff;
		line-height: 150%;
	font-size:100%;
	color: #000066;
	margin: 25px;
        }

.container{
display:flex;
flex-direction:row;
}

.main-nav a {
  margin: 3px;
  border-radius: 5px;
  background: #00008b;
  color: #fff;
  display: block;
  padding: 10px;
  text-decoration: none;
}
.main-nav .logo {
  background: #4584b1;
}

.main-nav {
  display: flex;
 justify-content:center;
 flex-grow: 1;
}

.main-nav.{
-webkit-flex: 1;
  flex: 1;
  
}





.cssgrid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  grid-auto-rows: 1fr;
  grid-gap: 0.8em;
  border: 1px solid #ffffff;
  padding: 0.8em;
  margin: 0 0 2em;
}

.cssgrid > div {
  background: #ffffff;
  overflow: auto;
  min-width: 0;
  padding: 1em;
  border:1px solid #ffffff;
}

.cssgrid2{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  grid-auto-rows: 1fr;
  grid-gap: 0.8em;
  border: 1px solid #ffffff;
  padding: 0.8em;
  margin: 0 0 2em;
}

.cssgrid2 > div {
  background: #fff;
  overflow: auto;
  min-width: 0;
  padding: 1em;
}

.cssgridm{
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(480px, 1fr));
  grid-auto-rows: 1fr;
  grid-gap: 0.8em;
  border: 1px solid #ddd;
  padding: 0.8em;
  margin: 0 0 2em;
}

.cssgridm > div {
  background: #f11;
  overflow: auto;
  min-width: 0;
  padding: 1em;
}

.cssgrid3 {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(130px, 1fr));
  grid-auto-rows: 1fr;
  grid-gap: 0.8em;
  border: 1px solid #ddd;
  padding: 0.8em;
  margin: 0 0 2em;
}

.cssgrid3 > div {
  background: #ffffff;
  overflow: auto;
  min-width: 0;
  padding: 1em;
  border:1px solid #dcdcdc;
}

.cssgridb {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  grid-auto-rows: 1fr;
  grid-gap: 0.8em;
  border: 1px solid #00ff7f;
  padding: 0.8em;
  margin: 0 0 2em;
}

.cssgridb > div {
  background: #ffffff;
  overflow: auto;
  min-width: 0;
  padding: 1em;
  border:1px solid #008000;
  color: #000088;
 
}

.cssgridd {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  grid-auto-rows: 1fr;
  grid-gap: 0.8em;
  border: 1px solid #ddd;
  padding: 0.8em;
  margin: 0 0 2em;
}

.cssgridd > div {
  background: #ffffff;
  min-width: 0;
  padding:1em;
  border:1px solid #008842;
  background-size:cover;
  background-position:center;  
  color: #008842;    
  text-align:center;          
}

.cssgride {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  grid-auto-rows: 1fr;
  grid-gap: 0.8em;
  border: 1px solid #00ff7f;
  padding: 0.8em;
  margin: 0 0 2em;


  }

.cssgride > div {
  background: #ffffff;
  overflow: auto;
  min-width: 0;
    border:1px solid #008000;
  color: #000088;
 font-size: clamp(8px, 0.591rem + 1.42vw, 10px);
 height:auto;
}


.btn-square {
  display: inline-block;
  padding: 0.5em 1em;
  text-decoration: none;
  background: #005bac;/*ボタン色*/
  color: #FFF;
  border-bottom: solid 4px #627295;
  border-radius: 3px;
}
.btn-square:active {
  /*ボタンを押したとき*/
  -webkit-transform: translateY(4px);
  transform: translateY(4px);/*下に動く*/
  border-bottom: none;/*線を消す*/
}

.resizeimage img { width: 100%; }

@media screen and (min-width: 300px) {
.full-width-img {
margin: auto;
width: 90%;
}


h1 {
	font-size: 120%;
	padding: 25px 15px 5px;
	border-bottom: 4px solid #008842;
	background: #008842;
	font-weight: bold;
        font-family:"MS Pゴシック",Osaka,sans-serif;
        text-align: center;
        color: #ffffff;
        border-radius: 3px;
}
h2 {
	font-size: 105%;
	margin:10px 0px 20px 20px;
	color: #008842;
	border-bottom: 1px dashed #008842;
	padding:10px 0px 0px 5px;
	clear: both;
        font-family:"MS Pゴシック",Osaka,sans-serif;
}

h3{
        font-size: 100%;
	padding: 10px 15px 10px;
	border-bottom: 1px solid #008842;
	background: #008842;
	font-weight: bold;
        font-family:"MS Pゴシック",Osaka,sans-serif;
        color: #ffffff;
}    

h4{
        font-size: 90%;
	padding: 25px 15px 5px;
	border-bottom: 1px solid #cccccc;
	background:#ffffff;
	font-weight: bold;
        font-family:"MS Pゴシック",Osaka,sans-serif;
}    

h5{
        font-size: 95%;
	padding: 10px 15px 0px;
	border-bottom: 1px solid #CCCCCC;
	background: #ffffff;
	font-weight: bold;
        font-family:"MS Pゴシック",Osaka,sans-serif;
}

p {
  font-size: 16px;
  font-weight: ;
  text-align: center;
  margin: 5px auto 0px;
}

table {
  margin:auto;
width: 100%;
table-layout: fixed;
word-break: break-all;
word-wrap: break-all;
}
}
.tbl-r02 th {
  background: #e9727e;
  border: solid 1px #ccc;
  color: #fff;
  padding: 10px;
}
.tbl-r02 td {
　border: solid 1px #ccc;
  padding: 10px;
  color: #000000;

}
 
@media screen and (max-width: 640px) {
  .last td:last-child {
    border-bottom: solid 1px #ccc;
    width: 100%;
  }
  .tbl-r02 {
    width: 80%;
  }
  .tbl-r02 th,
  .tbl-r02 td {
　　border-bottom: none;
    display: block;
    width: 100%;
  }
}



table{
  border-collapse: collapse;
  width: 100%;
}
.tb01 th,
.tb01 td{
  padding: 10px;
  border: solid 1px #ccc;
  text-align:center;
  box-sizing:border-box;
  background:#ffffff
}
.tb01 th {
  background: #008842;
  color: #fff;
  
}

table{
  border-collapse: collapse;
  width: 100%;


.tb02 th,
.tb02 td{
  padding: 10px;
  border: solid 1px #ccc;
  text-align:center;
  box-sizing:border-box;
  background:#ffffff
}
.tb02 th {
  background: #ffffff;
  color: #008842;
  
}


@media screen and (max-width: 640px) {
  .tb01 .head{
    display:none;
  }
  .tb01 {
    width: 100%;
  }
  table.tb01 td {
    display: block;
    width: 100%;
    border-bottom:none;
  }
  table.tb01 td:first-child{
    background: #008842;
    color:#fff;
    font-weight:bold;
  }
  .tb01 tr:last-child{
    border-bottom: solid 1px #ccc;
  }
}

table {
  margin:auto;
}
.tbl-r03 th {
  background: #e9727e;
  border: solid 1px #ccc;
  color: #fff;
  padding: 10px;
  
}
.tbl-r03 td {
　border: solid 1px #ccc;
  padding: 10px;
}
 
@media screen and (max-width: 640px) {
  .last td:last-child {
    border-bottom: solid 1px #ccc;
    width: 100%;
  }
  .tbl-r03 {
    width: 80%;
  }
  .tbl-r03 th,
  .tbl-r03 td {
border:　solid 1px #ccc;　
border-bottom: solid 1px #ccc;
    border-left:solid 1px #ccc;
    border-right:solid 1px #ccc;
    display: block;
    width: 100%;
  }
}