@charset "UTF-8";
/* 全ての要素でサイズ設定 */
* {
  box-sizing: border-box;
}
body{
  margin: 0;
  background-color:#ede7ce;
  font-family: "BIZ UDPGothic", "Hiragino Kaku Gothic ProN", "Yu Gothic Medium", "Meiryo", sans-serif;
  line-height: 1.8;
}

  /* 全体を囲む箱の設定 */
.container {
  width: 100%;
  max-width: 610px; /* PC幅スマホでは100% */
  margin: 0 auto;   /* 中央寄せ */
  padding: 10px;  /* スマホ用左右余白 */
  word-break: break-all;
}

nav ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center; 
  align-items: center;  
  color : #ede7ce;
  background-color : #d2b48c;
  padding: 5px 5px;
  width: 100%;
  list-style: none;
  margin: 15px 0; 
}

nav ul li{
  font-size:small;
  margin: 5px;
  list-style: none;
    }

nav ul li a {
  display: inline-block;   /* 余白 */
  padding: 0px 3px;       
  text-decoration: none;   /* 下線消 */
  color: inherit;          /* 親の色 */
  background-color: rgba(255, 255, 255, 0.2); 
  border-radius: 3px;      
}

/* ヘッダー画像を画面内 */
.header-img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* メイン内の画像 */
img {
  max-width: 100%; /* 親要素よりは大きくしないスマホ用 */
  width: auto; 
  height: auto; 
}
/* 検索フォーム全体の囲み */
form {
  display: flex;
  max-width: 600px; /* 検索窓最大幅 */
  margin: 15px 0px;
}

/* 検索テキストボックス */
input[type="text"] {
  background-color: #f3f0e3;
  flex: 1; /* 横幅最大幅 */
  padding: 1px 5px;
  border: 1px solid #ede7ce;
  color: #333;
  outline: none; /* クリックした時の青い枠を消す */
}

/* 検索ボタン */
button[type="submit"] {
  padding: 10px 18px;
  background-color: #96cf9e; /* ボタンの色*/
  color: white;
  border: 1px solid #ede7ce;
  cursor: pointer;
  transition: background-color 0.3s;
}

/*マウスオーバー*/
 button[type="submit"]:hover {
 background-color: #fbb400;
}
  
a{
  text-decoration:underline;
}
a:link{
  color:#666;
}
a:visited{
  color:#666;
}
a:active{
  color:#ffff00;
}
a:hover{
  color:#ffa500;
  background-color:#f3f0e3;
}
h1,h2,h3,h4,h5{
  font-size: medium;
  padding-left: 1em;
  margin-bottom: 5px;
}
h1{
  color:#987;
  border-left:solid 1em #d2b48c;
  }
h2{
  color:#bc5e00;
  padding-top:10px;
  border-top:solid 1px;
  border-left:solid 1em #bc5e00;
}
h3{
  color:#998765;
  border-left:solid 1em #bab093;
  }
h4{
  color:#666;
  font-weight:700;
}
h5{
  color:#777;
  background-color:#f3f0e3;
  border-left:solid 1em #bab093;
}
p{
  width: 100%;
  font-size:small;
  color:#666;
  line-height: 1.8;
}
.b{
  color:#23659c;
}
.mlg{
  width: 100%;
  color:#23659c;
  background-color: #f3f0e3;
  padding: 2px;
  margin-right:3px;
  margin-top:3px;
  margin-bottom:3px;
}
.up{
  width: 100%;
  color:#23659c;
  background-color: #f3f0e3;
  padding: 2px;
}
.blue{
  color:#0000ff;
}
.red{
  color:#ff0000;
}
.green{
  color:#008000;
}
.limegreen{
  color:#32cd32;
}
.purple{
  color:#800080;
}
.fuchsia{
  color:#ff00ff;
}
.teal{
  color:#008080;
}
.maroon{
  color:#800000;
}
.olive{
  color:#808000;
}
.h2iro{
  color:#bc5e00;
}
ul{
list-style:none;
  font-size:small;
  color:#777;
  line-height: 1.8; 
  padding: 0;
}

ul.index{
  list-style:none;
  font-size:small;
  color:#777;
  line-height: 1.8; 
  padding: 0;
}

ul.info{
  list-style:none;
  font-size:small;
  color:#777;
  line-height: 1.8;
  padding: 0;
}
li.infohd{
  width: auto;
  background-color:#f3f0e3;
  padding-left:1em;
  border-left:solid 1em #bab093;
  margin-top: 10px;
}
li.info{
  padding-left: 2em;
  word-break: break-all;
  color:#4682b4;
}
.date{
  color:#50a85b;
  padding-left:5px;
  clear:both;