*{
 /*margin: 0; */
 margin: 0 auto;
 padding: 0;
}
    
body{
 width: 1200px;
 background-color:#919191;
}
   
/* ------------------------------------ */
/*   画面　　全体レイアウト               */
/* ------------------------------------ */
/*
/* 画面構成設定 */
header,footer,nav,main,section,article,aside{
 display:block;
}

/* HTML5 header ヘッダー　サイズ */
header{
/*position: fixed; /* ヘッダーを固定する */   
 display:block;
 width: 1200px;
 height: 90px;
 background: #eeeeee;
}

/* HTML5 nav  メニューリスト サイズ （パディング- 48) */
nav{
 width: 1200px;
 height: 40px;
 background: #0c0a61;
}

header-img{
 width: 1200px;
 height: 50px;
 background: #0c0a61;

 float: left;
 width: 1200px;
 height: auto;
 /* height: 900px; */
 background: #ecebeb;
 /*overflow: auto; /* コンテンツの表示を自動に設定（スクロール） */
 border-top:2px solid #010a53; /* 本文　上の線　*/
}



/* HTML5 main と aside  高さ均等にする */
.container{
  overflow:hidden;
} 

/* HTML5 main  メインエリア サイズ */
main{
 float: left;
 width: 950px;
 height: auto;
 /* height: 900px; */
 background: #ecebeb;
 /*overflow: auto; /* コンテンツの表示を自動に設定（スクロール） */
 border-top:2px solid #010a53; /* 本文　上の線　*/
}

/* HTML5 aside  右メニューリスト サイズ */
aside{
 float: left;
 width: 250px;
 height: auto;
 background: #dad9d99f;
  /* main と aside  高さ均等にする */
 /*/*padding-bottom: 10000px;
 margin-bottom: -10000px;*/
}
    
footer{
 clear: both;
 width: 1200px;
 height: 24px;
 background: #020144;
}


/* -------------------------------------------------------- */
/*  【ヘッダー   レイアウト】 　                              */
/* -------------------------------------------------------- */
.header-logo {
    float: left;
    padding: 15px 20px;
}

.header-name {
    color: rgb(24, 25, 27);
    font-family:  sans-serif;    /* フォントの種類指定 */
    font-size: 20px;
    float: left;
    padding: 10px 70px;
    font-weight: bold;
}

.header-add {
    color: rgb(25, 24, 27);
    font-family:  sans-serif;    /* フォントの種類指定 */
    font-size: 12px;
    padding: 10px 50px 20px 100px;
}


/* ------------------------------------------------------------ */
/*   ページ上部　   　　画像： 【タイトル表示】                    */
/* ------------------------------------------------------------ */

div {
  position: relative;
}
img {
  width: 100%; /* divの幅に対する割合 */
}

p {
  position: absolute;
  left: 15%;
  top: 50%;
  transform: translate(-50%,-50%);
  color: rgb(2, 2, 36);   /* 画像の上にページタイトルの文字色 */
  font-family:  sans-serif;    /* フォントの種類指定 sans-serif */
  font-size: 35px;
  font-weight: 800;   /* 太さ 100-900 */
  text-shadow: #fff 2px 0, #fff -2px 0, #fff 0 -2px, #fff 0 2px, #fff 2px 2px, #fff -2px 2px, #fff 2px -2px, #fff -2px -2px, #fff 1px 2px, #fff -1px 2px, #fff 1px -2px, #fff -1px -2px, #fff 2px 1px, #fff -2px 1px, #fff 2px -1px, #fff -2px -1px, rgba(0, 0, 0, .5) 3px 3px 3px;
};




/* ------------------------------------------------------------ */
/*   ナビ　     【トップメニュー】                                */
/* ------------------------------------------------------------ */
/* 横並び  flex  使用 */
.top-nav {
  width: 1100px;
  margin: 0 auto;
}
.top-nav-list {
  display: flex;
  list-style-type: none;   /* LIST●マーク消す */
}
.top-nav-item {
  width: 20%;
  height: 40px;
  background-color: #061f64;
  position: relative;
  transition: all .3s;
}
.top-nav-item:hover {
  background-color: #0071BB;
}
.top-nav-item:not(:first-child)::before {
  content: "";
  width: 1px;
  height: 100%;
  background-color: #fff;
  position: absolute;
  top: 0;
  left: 0;
  transition: all .3s;
}
.top-nav-item:hover::before {
  background-color: #0071BB;
}
.top-nav-item a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  text-decoration: none;   /* LINQ アンダーライン消す */
  color: #eef2f5;
  font-size: 15px;
  letter-spacing: 0.05em;
  font-weight: 500;
  transition: all .3s;
}
.top-nav-item:hover a {
  color: #030955;
}

/* -------------------------------------------------------------- */
/*   メインコンテンツ                                               */
/* -------------------------------------------------------------- */
.main{
  border-top:2px solid #010a53; /* 本文　上の線　*/
}
.left{
  border-top:2px solid #010a53; /* 右エリア　上の線　*/
  padding-bottom: 10000px;
  margin-bottom: -10000px;
}
  

/* -------------------------------------------------------------- */
/*   右　【リストメニュー】              上  (1グループ)              */
/* -------------------------------------------------------------- */
.left-nav {
  margin-top: 5px;    /* 上からの距離 */
  margin-left: 0px;
  /* padding-left:20px; */
  width: 250px;
  background-color: #f7f3f3;
  /* margin: 0 auto; */ 
}
/* ul要素に設定  */
.left-nav-list {
  display: flex;
  flex-flow: column;    /* 縦並び  */
  /* justify-content:space-around; /* 両端余白均等間隔配置  */
  justify-content: space-evenly;  /* 各アイテムを均等に配置し
  各アイテムの周りに同じ大きさの間隔を置く */

  list-style-type: none;   /* LIST●マーク消す */
}

.left-nav-item {
  /*width: 100%;  /* 横幅 */
  width: 248px; /* 横幅 */
  height: 35px;
  background-color: #c7ced3;
  position: relative;
  top: 2px; /*追記*/
  bottom: 2px; /*追記*/

  border-right:1px solid #dde0f7;
	border-bottom:2px solid #f8f9fa;
	border-left:1px solid #e6e4e4;


  transition: all .3s;
}
.left-nav-item:hover {
  background-color: #0071BB;
}

.left-nav-item:not(:first-child)::before {
  content: "";
  width: 0px;
  height: 100%;
  background-color: #fff;
  position: relative;
  left: 0;
  transition: all .3s;
}
.left-nav-item:hover::before {
  background-color: #0071BB;
}
.left-nav-item a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;   /* 変更　100%  */
  text-decoration: none;
  color: #04001a;
  font-size: 16px;
  line-height: 1.5;  /* 行間　単位なしにして0.25づつ上下に行間を */
  font-weight: 450;   /* 太さ 100-900 */
  transition: all .3s;
}
.left-nav-item:hover a {
  color: #fff;
}


/* -------------------------------------------------------------- */
/*   右　【サブタイトル】                中  (2グループ)             */
/* -------------------------------------------------------------- */
h4 {
  margin-top: 20px;    /* 上からの距離 */
  border-bottom: 6px double #000;
}

/* -------------------------------------------------------------- */
/*   右　【リストメニュー】              中  (2グループ)              */
/* -------------------------------------------------------------- */
.live-menu {
  margin-top: 5px;    /* 上からの距離 */
  margin-left: 0px;
  /* padding-left:20px; */
  width: 250px;
  background-color: #e2e2e1;
  /* margin: 0 auto; */ 
}
/* ul要素に設定  */
.live-menu-list {
  display: flex;
  flex-flow: column;    /* 縦並び  */
  /* justify-content:space-around; /* 両端余白均等間隔配置  */
  justify-content: space-evenly;  /* 各アイテムを均等に配置し
  各アイテムの周りに同じ大きさの間隔を置く */

  list-style-type: none;   /* LIST●マーク消す */
}

.live-menu-item {
  /*width: 100%;  /* 横幅 */
  width: 248px; /* 横幅 */
  height: 35px;
  background-color: #c7ced3;
  position: relative;
  top: 2px; /*追記*/
  bottom: 2px; /*追記*/
  border-right:1px solid #dde0f7;
	border-bottom:1px solid #f8f9fa;
	border-left:1px solid #e6e4e4;
  transition: all .3s;
}

.live-menu-item:hover {
  background-color: #0071BB;
}

.live-menu-item:not(:first-child)::before {
  content: "";
  width: 0px;
  height: 100%;
  background-color: #fff;
  position: relative;
  left: 0;
  transition: all .3s;
}
.live-menu-item:hover::before {
  background-color: #0071BB;
}
.live-menu-item a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;   /* 変更　100%  */
  text-decoration: none;
  color: #030033;
  font-size: 16px;
  line-height: 1.5;  /* 行間　単位なしにして0.25づつ上下に行間を */
  font-weight: 450;   /* 太さ 100-900 */
  transition: all .3s;
}
.live-menu-item:hover a {
  color: #fff;
}


/* -------------------------------------------------------------- */
/*   右　【リストメニュー】              下  (3グループ)             */
/* -------------------------------------------------------------- */
.tax-menu {
  width: 250px;
  /* margin: 0 auto; */ 
}
/* ul要素に設定  */
.tax-menu-list {
  display: flex;
  flex-flow: column;    /* 縦並び  */
  /* justify-content:space-around; /* 両端余白均等間隔配置  */
  justify-content: space-evenly;  /* 各アイテムを均等に配置し
  各アイテムの周りに同じ大きさの間隔を置く */

  list-style-type: none;   /* LIST●マーク消す */
}

.tax-menu-item {
  /*width: 100%;  /* 横幅 */
  width: 248px; /* 横幅 */
  height: 35px;
  background-color: #c7ced3;
  position: relative;
  top: 2px; /*追記*/
  bottom: 2px; /*追記*/

  border-right:1px solid #dde0f7;
	border-bottom:1px solid #f8f9fa;
	border-left:1px solid #e6e4e4;


  transition: all .3s;
}
.tax-menu-item:hover {
  background-color: #0071BB;
}

.tax-menu-item:not(:first-child)::before {
  content: "";
  width: 0px;
  height: 100%;
  background-color: #fff;
  position: relative;
  left: 0;
  transition: all .3s;
}
.tax-menu-item:hover::before {
  background-color: #0071BB;
}
.tax-menu-item a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;   /* 変更　100%  */
  text-decoration: none;
  color: #025506;
  font-size: 16px;
  line-height: 1.5;  /* 行間　単位なしにして0.25づつ上下に行間を */
  font-weight: 600;   /* 太さ 100-900 */
  transition: all .3s;
}
.tax-menu-item:hover a {
  color: #fff;
}



/* -------------------------------------------------------------- */
/*   <<<<<<<   記事 頁　   　>>>>>>             >>> index  <<<<    */
/* -------------------------------------------------------------- */
.main-title{
  margin-top: 20px;  
}

/* 記事タイトルの中央寄せ */
h2 {
    margin: auto;   /* 上からの距離 */
 }


 /* 記事文章の位置 */
 .article-1{
  margin-top: 20px;
  padding: 5px 50px 10px 50px;    /* [上]、[右]、[下]、[左]の順に余白を指定 */

}

font {
  line-height: 1.5;
}

/* -------------------------------------------------------------- */
/*   index.html    【画像アニメーション】       (　2グループ)        */
/* -------------------------------------------------------------- */
.topimg {
	position: relative;
	width: 880px;
	max-width: 100%;
	height: 500px;
}

.image {
	position: absolute;
	width: 100%;
	opacity: 0;
	animation: change-img-anim 15s infinite;
}

.image:nth-of-type(1) {
	animation-delay: 0s;
}
.image:nth-of-type(2) {
	animation-delay: 5s;
}
.image:nth-of-type(3) {
	animation-delay: 10s;
}

@keyframes change-img-anim {
	0%{ opacity: 0;}
	10%{ opacity: 1;}
	90%{ opacity: 1;}
	100%{ opacity: 0;}
}

/* -------------------------------------------------------------- */
/*   footer                                                       */
/* -------------------------------------------------------------- */
.footer-title{
    color: rgb(226, 223, 223);
    font-family:  sans-serif;    /* フォントの種類指定 */
    font-size: 12px;
    border-top:1px solid #e20404;
    border-bottom:2px solid #e20404;
}





/* -------------------------------------------------------------- */
/*   list.html    【５０音　ボタン用】             ( あ～わ )        */
/* -------------------------------------------------------------- */
/* 横並び  flex  使用 */
.name50-nav {
  width: 850px;
  margin: 0 auto;
}
.name50-nav-list {
  display: flex;
  list-style-type: none;   /* LIST●マーク消す */
}
.name50-nav-item {
  width: 20%;
  height: 40px;
  background-color: #E5F0F8;
  position: relative;
  transition: all .3s;
}
.name50-nav-item:hover {
  background-color: #0071BB;
}
.name50-nav-item:not(:first-child)::before {
  content: "";
  width: 1px;
  height: 100%;
  background-color: #fff;
  position: absolute;
  top: 0;
  left: 0;
  transition: all .3s;
}
.name50-nav-item:hover::before {
  background-color: #0071BB;
}
.name50-nav-item a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
  text-decoration: none;   /* LINQ アンダーライン消す */
  color: #002e4d;
  font-size: 15px;
  letter-spacing: 0.05em;
  font-weight: 500;
  transition: all .3s;
}
.name50-nav-item:hover a {
  color: #fff;
}



/* -------------------------------------------------------------- */
/*   list.html    【５０音　ボタン用】             ( あ～わ )        */
/* -------------------------------------------------------------- */
table{
  border-collapse: collapse;
  width: 100%;
  font-size: 14px;  /*-- size Test ----*/
}

.tb01 th,
.tb01 td{
  padding: 2px;
  border: solid 1px #ccc;
  text-align:left; /*-- 位置左 Test ( center ) ----*/
  box-sizing:border-box;
}
.tb01 th {
  background: #0c1591;
  color: #fff;
  
}
@media screen and (max-width: 800px) {
  .tb01 .head{
    display:none;
  }
  .tb01 {
    width: 100%;
  }
  table.tb01 td {
    display: block;
    width: 100%;
    border-bottom:none;
  }
  table.tb01 td:first-child{
    background: #0c1591;
    color:#fff;
    font-weight:bold;
  }
  .tb01 tr:last-child{
    border-bottom: solid 1px #ccc;
  }
}



/*-- ボタン ( center ) ----*/
.btn a {
	display: flex;
	justify-content: center;
	align-items: center;
	position: relative;
	width: 300px;
	height: 60px;
	color: #fdfcfc;
	font-size: 18px;
	font-weight: 700;
	text-decoration: none;
	transition: 0.3s;
  /*-- ボタン初期 ( color ) ----*/
  background-color: #1d49db;
	border: 1px solid transparent;
}

.btn a:hover {
	color: #c9c5c5;
}

.btn06 a::after {
	content: '';
	position: absolute;
	top: 50%;
	right: 20px;
	transform: rotate(45deg) translateY(-50%);
	width: 6px;
	height: 6px;
	border-width: 2px 2px 0 0;
	border-style: solid;
	border-color: #047c58;
}

.btn06 a:hover {
	background-color: #00831c;
	border: 1px solid #57d68c;
}

.btn06 a:hover::after {
	border-color: #3e2ab1 #604adf transparent transparent;
}
/*-- -------------------------------------------- ----*/


.face img{ 
  width: 210px;
  background-color:#919191;
  margin-top:0px;

  margin-right: 0;
  margin-left: auto;

  display: block;
}