/* ******************************** */
@charset "utf-8";
/* ******************************** */

/* ******************************** */
/* 「class="wrapper"」部 (文章全体) */
/* ******************************** */
.wrapper {
  /* border: 1px dashed black; */           /* ******* 2023.03.24 削除(1px 黒) ******* */

  width: 1000px;                /* ラッパーの幅(1000px) */
  /* background-color: #fff; */ /* ラッパーの背景色(白) */
  margin-left: auto;            /* 左右中央揃え         */
  margin-right: auto;           /* 左右中央揃え         */
}

/* *********************************************************************************** */
/* *********************************************************************************** */

/* ******************************** */
/* ナビ部 */
/* ******************************** */
nav {
  /* border: 2px dashed red; */             /* ******* 2023.03.24 削除(2px 赤) ******* */

  padding: 0;                         /* プルダウンメニューの内部余白(0) */
  margin:  0;                         /* プルダウンメニューの外部余白(0) */

/* 上記以外の全て「menu.css」に記入 */
}

/* ******************************** */
/* ヘッダー部 */
/* ******************************** */
header {
  /* border: 1px dashed red; */             /* ******* 2023.03.24 削除(1px 赤) ******* */

	width:80%;                                    /* キャンパス（80%）       */
  height: auto;                                 /* 内部余白を含む高さ      */
  box-sizing: border-box;                       /* 内部余白を含むbox       */
  padding: 30px;                                /* 内部余白(上下左右) 30px */
  border-radius: 10px;                          /* 四つ角を角丸 10px       */
	text-align:center;                            /* 文字（中央揃え）        */
  margin-left: auto;                            /* 左右中央揃え            */
  margin-right: auto;                           /* 左右中央揃え            */
}

/* ******************************** */
/* ヘッダー部 見出し (h1) */
/* ******************************** */
header h1 {
  font-family: 'Zen Maru Gothic', sans-serif; /* 日本語フォントファミリー       */
  font-size: 3.8rem;                          /* 文字の大きさ(3.8rem)           */
  font-weight: normal;                        /* 文字の重さ(normal)             */
  color: white;                               /* 文字色(白)                     */
  text-shadow: 2px 2px 3px #333;              /* 文字の影(右・下・ぼかし・影色) */
  background-color: lightcoral;               /* 見出しの背景色(ライトコーラル) */
  display: inline-block;                      /* 見出しの幅を文字数の幅に       */
  border-radius: 10px;                        /* 見出しの四つ角を角丸(10px)     */
  padding: 5px;                               /* 見出しの内部余白(5px)          */
  margin: 0 0 20px 0;                         /* 見出しの外部余白(0 0 20px 0)   */
}

/* ******************************** */
/* ヘッダー部 文章 (p) */
/* ******************************** */
header p {
  font-family: 'Zen Maru Gothic', sans-serif;       /* 日本語フォントファミリー */
  font-size: 2.0rem;                                /* 文字の大きさ(2.0rem)     */
  color: #000;                                      /* 文字色(黒)               */
	text-align:left;                                  /* 文字（左揃え）           */
  background-color: rgba(255, 255, 255, 0.6);       /* ヘッダー部明細の背景色(白・半透明(0.6)) */
  display: inline-block;                            /* ヘッダー部明細の箱幅を文字数の幅に      */
  border-radius: 10px;                              /* ヘッダー部明細の四つ角を角丸 10px       */
  padding: 5px 5px 0 5px;                           /* ヘッダー部明細の内部余白(5px 5px 0 5px) */
}

/* *********************************************************************************** */
/* *********************************************************************************** */

/* ******************************** */
/* 「div class="content"」部 (文章中身) */
/* ******************************** */
div.content {
  /* border: 2px dashed red; */             /* ******* 2023.03.24 削除(2px 赤) ******* */

  margin: 0 30px 0 30px;           /* コンテント部の外部余白(右左)(0 30px 0 30px) */
}

/* ******************************** */
/* 「div class="marquee"」部 (流れる字幕) */
/* ******************************** */
div.marquee {
  /* border: 1px dashed black; */           /* ******* 2023.03.24 削除(1px 黒) ******* */

  margin: 0 0 0 0;                   /* 流れる字幕の外部余白(0 0 0 0) */
}

/* ******************************** */
/* article 部  */
/* ******************************** */
article {
  /* border: 2px dashed black; */           /* ******* 2023.03.24 削除(2px 黒) ******* */

  margin: 3px ;                    /* article部の外部余白(上下左右) 3px */
}

/* ******************************** */
/* article 部 見出し2 (article内 h2) */
/* ******************************** */
article h2 {
  line-height: 20px;               /* 見出し2の行の高さ(20px)                 */
  background-color: lightcoral;    /* 見出し2の背景色(ライトコーラル)         */
  border-radius: 10px;             /* 見出し2の背景の角丸(10px)               */
  color: white;                    /* 文字色(白)                              */
  font-size: 3.0rem;               /* 文字の大きさ(3.0rem)                    */
  text-shadow: 2px 2px 3px #333;   /* 文字の影(右、下、ぼかし幅、影色)        */
  display: inline-block;           /* 見出しの幅を文字数の幅に                */
  padding: 16px 30px 16px 30px;    /* 内部余白(16px 30px 16px 30px)           */
  margin:10px 10px 20px 10px;      /* 見出し2の外部余白 (10px 10px 20px 10px) */
}

/* ******************************** */
/* article 部 見出し3 (article内 h3) */
/* ******************************** */
article h3 {
  line-height: auto;                          /* 見出し3の行の高さ(auto)       */
  display: inline-block;                      /* 見出しの幅を文字数の幅に      */
  background-color: rgba(240, 128, 128, 0.4); /* 背景色(薄ピンク・透明度(0.4)) */
  border-radius: 5px;                         /* 見出し3の背景の角丸(5px)      */
  color: #000;                                /* 文字色(黒)                    */
  font-size: 1.8rem;                          /* 文字の大きさ(1.8rem)          */
  padding: 5px 20px 5px 20px;                 /* 内部余白(5px 20px 5px 20px)   */
  margin:0 0 15px 0;                          /* 見出し3の外部余白(0 0 15px 0) */
}

/* ******************************** */
/* article 部 見出し3 (article内 h3) インライン要素<a>の設定 */
/* ******************************** */
article h3 a {
  text-decoration: none; /* 文字の下線を非表示に */
}

/* ******************************** */
/* article 部  見出し3 (article内 h3) ホバーの設定 */
/* ******************************** */
article h3 a:hover {
  line-height: auto;                                  /* 見出し3の行の高さ(auto)       */
  color: red;                                         /* 文字色(赤)                    */
  /* background-color: rgba(240, 128, 128, 0.4); */   /* 背景色(薄ピンク・透明度(0.4)) */
  /* border-radius: 5px; */                           /* 四つ角を角丸 5px              */
  padding: 5px 0 5px 0;                               /* 内部余白(5px 0 5px 0)         */
}

/* *********************************************************************************** */
/* *********************************************************************************** */

/* *************************************************************** */
/* article 部 (テーブル部) (index.htmlのみ) */
/* *************************************************************** */
.menutbl{
  /* border: 1px dashed black; */           /* ******* 2023.03.24 削除(1px 黒) ******* */

	width:90%;         /* キャンパス（90%）      */
	margin-right:auto; /* 右余白（自動）         */
	margin-left:auto;  /* 左余白（自動）         */
	font-size: 1.9rem; /* 文字の大きさ           */
  padding: 10px 10px 10px 10px;                  /* 内部余白(10px 10px 10px 10px) */
  background-color: rgba(255, 255, 255, 0.6);    /* 背景色(白・半透明(0.6))       */
  border-radius: 10px;                           /* 四つ角を角丸 10px             */
}

/* ******************************** */
/* article 部 テーブル幅 (index.htmlのみ) */
/* ******************************** */
article table{
	width:100%;                /* テーブル幅(100%)       */
	text-align:left;           /* 文字（左揃え）         */
  padding: 5px 0 10px 0;     /* 内部余白(5px 0 10px 0) */
}

/* ******************************** */
/* article 部 テーブルの(table a)の設定 (index.htmlのみ) */
/* ******************************** */
article table a {
  text-decoration: none; /* 文字の下線を非表示に */
}

/* ******************************** */
/* article 部 テーブル(table a:hover)のホバーの設定 (index.htmlのみ) */
/* ******************************** */
article table a:hover {
  line-height: auto;                          /* 見出し3の行の高さ(auto)       */
  color: red;                                 /* 文字色(赤)                    */
  background-color: rgba(240, 128, 128, 0.4); /* 背景色(薄ピンク・透明度(0.4)) */
  border-radius: 5px;                         /* 四つ角を角丸 5px              */
}

/* *********************************************************************************** */
/* *********************************************************************************** */

/* ******************************** */
/* div.maegaki 各pgmの展覧会等の前書きの設定 */
/* ******************************** */
div.maegaki {
	width:70%;                                  /* キャンパス（70%）             */
  line-height: auto;                          /* 見出し3の行の高さ(auto)       */
  background-color: rgba(255, 255, 255, 0.6); /* 背景色(白・半透明(0.6))       */
  border-radius: 5px;                         /* 見出し3の背景の角丸(5px)      */
  color: #000;                                /* 文字色(黒)                    */
  font-size: 1.9rem;                          /* 文字の大きさ(1.9rem)          */
  padding: 5px 20px 5px 20px;                 /* 内部余白(5px 20px 5px 20px)   */
  margin:15px 0 15px 0;                       /* 外部余白(15px 0 15px 0)       */
	margin-right:auto;                          /* 右余白（自動）                */
	margin-left:auto;                           /* 左余白（自動）                */
}

/* ******************************** */
/* div.menu-list 各pgmの目次の設定 */
/* ******************************** */
div.menu-list {
  padding: 20px;                                    /*  */
  /* background-color: #fff; */                     /*  */
  border-radius: 10px;                              /*  */
  width: 80%;                                       /*  */
  height: auto;                                     /*  */
  margin-left: auto;            /* 左右中央揃え         */
  margin-right: auto;           /* 左右中央揃え         */
}

/* ******************************** */
/* div.menu-list a 各pgmの目次の設定 */
/* ******************************** */
div.menu-list a {
  text-decoration: none;                          /*  */
  background-color: rgba(255, 255, 255, 0.6);     /* 背景色(白・半透明(0.6))       */
  border-radius: 5px;                             /*  */
}

/* ******************************** */
/* div.menu-list a:hover 各pgmの目次の設定 */
/* ******************************** */
div.menu-list a:hover {
  color: red;                                 /* 文字色(赤) */
  background-color: rgba(240, 128, 128, 0.4); /* 背景色(薄ピンク・透明度(0.4)) */
}

/* ******************************** */
/* div.menu-list dl 各pgmの目次の設定 */
/* ******************************** */
div.menu-list dl {
  text-align: left;        /* 目次は左詰め   */
}

/* ******************************** */
/* div.menu-list dl dt 各pgmの目次の設定 */
/* ******************************** */
div.menu-list dl dt {
	font-size: 2.0rem;       /* 文字の大きさ   */
  color: crimson;          /* 文字色         */
}

/* *********************************************************************************** */
/* *********************************************************************************** */

/* ******************************** */
/* div.gazou-cut 各カット画像の設定 */
/* ******************************** */
div.gazou-cut {
  font-family: 'Zen Maru Gothic', sans-serif;       /* 日本語フォントファミリー */
  width: 80%;                                       /*  */
  height: auto;                                     /*  */
  padding: 20px;                                    /*  */
  margin: 10px;                                     /*  */
  background-color: rgba(204, 204, 204, 0.6);       /* 2023.05.28 update        */
  border-radius: 10px;                              /*  */
  margin-left: auto;            /* 左右中央揃え         */
  margin-right: auto;           /* 左右中央揃え         */
	font-size: 1.7rem;            /* 文字の大きさ         */
  color: #000;                  /* 文字色               */
}

/* ******************************** */
/* .l-img (画像が左)の設定 */
/* ******************************** */
.l-img {
	float: left;             /*    */
  margin-right: 1rem;      /*    */
}

/* ******************************** */
/* .r-img (画像が右)の設定 */
/* ******************************** */
.r-img {
	float: right;            /*    */
  margin-left: 1rem;       /*    */
}

/* ******************************** */
/* div.audio-con 各音声ファイルの設定 */
/* ******************************** */
div.audio-con {
  /* width: 90%; */                                 /*  */
  height: auto;                                     /*  */
  padding: 20px;                                    /*  */
  /* background-color: rgba(240,128,128,0.4); */    /*  */
  border-radius: 10px;                              /*  */
	font-size: 1.5rem;            /* 文字の大きさ         */
  color: #000;                  /* 文字色               */
}

/* ******************************** */
/* .jump-r-side ジャンプの設定(右端) */
/* ******************************** */
.jump-r-side {
	text-align: right;       /* 右端に設定 */
}

/* ******************************** */
/* .clear-all (オールクリア)の設定 */
/* ******************************** */
.clear-all {
	clear: both;             /*    */
}

/* ******************************** */
/* ページ・トップの位置 */
/* ******************************** */
#pagetop{
  /* border: 1px dashed red; */             /* ******* 2023.03.24 削除(1px 赤) ******* */

  hight: auto;            /* 文字の高さ(auto)             */
	text-align:right;       /* 文字（右揃え）               */
  margin: 10px 0 10px 0;  /* 外部余白(10px 0 10px 0)      */
}

/* ******************************** */
/* ページ・ラストの位置 */
/* ******************************** */
#pagelast{
  /* border: 1px dashed red; */             /* ******* 2023.03.24 削除(1px 赤) ******* */

  hight: auto;      /* 文字の高さ(auto) */
	text-align:right; /* 文字（右揃え）   */
}

/* *********************************************************************************** */
/* *********************************************************************************** */

/* ******************************** */
/* フォーム：ＳＯＮＧＳ */
/* ******************************** */
.songs{
  /* border: 1px dashed red; */             /* ******* 2023.03.24 削除(1px 赤) ******* */

	padding-top: 1rem;  /* トップからの位置(相対位置)    */
	width:85%;          /* 横幅(85%)              */
	margin-right:auto;  /* 右余白（自動）         */
	margin-left:auto;   /* 左余白（自動）         */
	font-size: 18px;    /* 文字の大きさ           */
	text-align:center;  /* 文字（中央揃え）       */
  padding: 0 0 0 0;   /* 内部余白(0 0 0 0)      */
}

/* ******************************** */
/* フォーム：入力項目 */
/* ******************************** */
.contents_frame{
  /* border: 1px dashed red; */             /* ******* 2023.03.24 削除(1px 赤) ******* */

	padding-top: 1rem;  /* トップからの位置(相対位置)    */
	width:60%;          /* 横幅(60%;)                    */
	margin-right:auto;  /* 右余白（自動）                */
	margin-left:auto;   /* 左余白（自動）                */
	font-size: 20px;    /* 文字の大きさ                  */
  padding: 10px 10px 10px 10px;                  /* 内部余白(10px 10px 10px 10px) */
  background-color: rgba(255, 255, 255, 0.6);    /* 背景色(白・半透明(0.6))       */
  border-radius: 10px;                           /* 四つ角を角丸 10px             */
}

/* ******************************** */
/* フォーム：入力項目(確認画面へ) */
/* ******************************** */
.submit{
  /* border: 1px dashed red; */             /* ******* 2023.03.24 削除(1px 赤) ******* */

  height: auto;           /* 内部余白を含む高さ      */
  margin: 0 0 25px 0;     /* 外部余白(0 0 25px 0)    */
}

/* ******************************** */
/* フォーム：入力項目(リセット) */
/* ******************************** */
.reset{
  /* border: 1px dashed red; */             /* ******* 2023.03.24 削除(1px 赤) ******* */

  height: auto;           /* 内部余白を含む高さ     */
  margin: 0 0 0 0;        /* 外部余白(0 0 0 0)      */
}

/* *********************************************************************************** */
/* *********************************************************************************** */

/* ******************************** */
/* フッター部 */
/* ******************************** */
footer {
  /* border: 1px dashed red; */             /* ******* 2023.03.24 削除(1px 赤) ******* */

  background-color: rgba(240, 128, 128, 0.4); /* 背景色(薄ピンク・透明度(0.4)) */
  hight: auto;                                /* フッター部の高さ(auto)        */
  width: 100%;                                /* フッター部の横幅(100%)        */
  border-radius: 10px;                        /* フッター部 角丸(10px)         */
  margin: 10px 0 0 0;                         /* 外部余白(上、右、下、左)      */
}

/* ******************************** */
/* フッター部 <small>はインライン要素なので、text-alignは動作しない */
/* ******************************** */
footer small {
  font-size: 1.6rem;　/* 文字の大きさ(1.6rem) */
  color: #000;        /* 文字色(黒)           */
  text-align: center; /* 文字を左右中央配置   */
  display: block;     /* text-alignを動作させる(文字を左右中央配置) */
}

/* *********************************************************************************** */
/* *********************************************************************************** */

/* ******************************** */
/* div.kenpo-bun 憲法文章中身の設定 */
/* ******************************** */
div.kenpo-bun {
  font-family: 'Zen Maru Gothic', sans-serif;       /* 日本語フォントファミリー */
  width: 80%;                                       /*  */
  height: auto;                                     /*  */
  padding: 20px;                                    /*  */
  background-color: rgba(255, 255, 255, 0.6);       /* 背景色(白・半透明(0.6))  */
  border-radius: 10px;                              /*  */
  margin-left: auto;            /* 左右中央揃え         */
  margin-right: auto;           /* 左右中央揃え         */
	font-size: 1.7rem;            /* 文字の大きさ         */
  color: #000;                  /* 文字色               */
}

/* *********************************************************************************** */
/* *********************************************************************************** */

/* ******************************** */
/* div.tanka-100 短歌の設定 */
/* ******************************** */
div.tanka-100 {
  font-family: 'Zen Maru Gothic', sans-serif;       /* 日本語フォントファミリー */
  width: 70%;                                       /*  */
  height: auto;                                     /*  */
  padding: 20px;                                    /*  */
  background-color: rgba(255, 255, 255, 0.6);       /* 背景色(白・半透明(0.6))  */
  border-radius: 10px;                              /*  */
  margin-left: auto;            /* 左右中央揃え         */
  margin-right: auto;           /* 左右中央揃え         */
}

/* ******************************** */
/* div.tanka-100 dl dt 短歌の設定(左) */
/* ******************************** */
div.tanka-100 dl dt {
	font-size: 1.9rem;       /* 文字の大きさ   */
  color: #000;             /* 文字色         */
  text-align: left;        /*                */
}

/* ******************************** */
/* div.tanka-100 dl dd 短歌の設定(右) */
/* ******************************** */
div.tanka-100 dl dd {
	font-size: 1.9rem;       /* 文字の大きさ   */
  color: #000;             /* 文字色         */
  text-align: right;       /*                */
}