
body {
  font-family:'メイリオ', 'Meiryo', 'Hiragino Kaku Gothic ProN', 'ヒラギノ角ゴ ProN W3', sans-serif;
}

body
{
background-color:#FFFFFF;
color: rgb(0,0,0);
font-size:10.5pt;
line-height:1.5;
font: "ＭＳ明朝";
}

/*------------------------------------------------------*/

/*---↓↓↓↓文字あける↓↓↓↓------<span class="moji-kan01">と</span>で挟む----------------------------*/

.moji-kan01 {
    letter-spacing: 0.8em;
}

.moji-kan02 {
    letter-spacing: 0.4em;
}

.moji-kan03 {
    letter-spacing: 0.2em;
}

.moji-kan04 {
    letter-spacing: 0.1em;
}

/*---↓↓↓↓見出し１↓↓↓↓----------------------------------*/

h1 {
    color:#FFFFFF;
    font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka,
        "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    font-size: 27.5px;
    font-weight: bold;
    letter-spacing: 0.15em;
    margin:0; /* ← ズレ防止のために0推奨 */
    white-space: nowrap;
}


/*---↓↓↓↓章トビラに入れる画像と文字↓↓↓↓----------------------------------*/

.tobira1 {
  position: relative;
  width: 350px;
  height: 128.5px;
}

.tobira1 img.bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.moji-row {
  position: absolute;
  top: 50%;
  left: 0;
  width: 350px;              /* ← 画像と同じ幅に固定 */
  transform: translateY(-50%);
  display: flex;
  justify-content: space-between; /* 左端と右端に配置 */
  align-items: center;            /* 垂直方向の中央揃え */
  padding: 0 10px;                /* 左右の余白（調整可） */
  white-space: nowrap;            /* 1行に収める */
  color: #fff;                    /* ← 文字色を白に */
  font-weight: bold;              /* ← 全体をボールドに */
  box-sizing: border-box;         /* ← はみ出し防止のため必須 */
}

.big {
  font-family: "MS Gothic", "HGｺﾞｼｯｸE", "HGゴシックE",
               "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro",
               "メイリオ", "Meiryo", "Osaka",
               "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
  font-size: 78px;
  vertical-align: -3px;
}

.small {
  font-family: "Yu Gothic", sans-serif;
  font-size: 25px;
}

.small-wrap {
  display: inline-block; /* ← flex の影響を遮断する */
}

.small2 {
  font-family: "Yu Gothic", sans-serif;
  font-size: 23px;
  display: inline-block;
  transform: scaleY(1.1);      /* ← 長体（確実に効く） */
  transform-origin: top center;
  line-height: 1;
  vertical-align: 2px;
}

/*---↓↓↓↓見出し１に入れる画像↓↓↓↓----------------------------------*/

.title1 {
  position:relative;
  width:769px;
  height:73.7px;
}

.title1 img.bg {
  position:absolute;
  left:0;
  top:0;
  width:100%;
  height:100%;
}

.title1 span.s1 {
  position:relative;
  padding-left:100px;
  line-height:73.7px;
  font-weight:bold;
  font-size:24px;
  color: #FFFFFF;
}

/*---↓↓↓↓見出し２↓↓↓↓----------------------------------*/

h2 {
    font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka,
        "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    color:#1F497D;
    font-size:26px;
    text-align:left;
    white-space: nowrap;
}

/*---↓↓↓↓見出し５↓↓↓↓----------------------------------*/

h5 {
    font-size:12pt;
    font-weight:bold;
    color:#003366;
    margin-top: 0;        /* ← これが重要 */
    margin-bottom: 0px;
    font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka,
        "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
    white-space: nowrap;
    padding-left: 0em;
}




/*---↓↓↓↓見出し２に入れる画像↓↓↓↓----------------------------------*/

.title2 {
    position: relative;
    margin:10px 0px;
    padding:5px 0 0 15px;
    background: linear-gradient(to right, #1A3A5E 30%, #fff);
    border-radius: 10px 0px 10px 10px;
    width: 750px;
    height: 55px;
    color:#ffffff;
    display: flex;          /* ← 追加：上下中央揃えの基盤 */
    align-items: center;    /* ← 追加：縦方向の中央揃え */
}

.title2 span.s2 {
    font-family: "Arial Black", Gadget, sans-serif;
    background-color:#ffffff;
    color:#003366;
    font-size:32px;
    width: 35px;
    height: 35px;
    border-radius: 5px;
    margin:-5px 20px 0 0;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    padding: 0;
}

/*---↓↓↓↓見出し３↓↓↓↓----------------------------------*/

/* h3 を見出しとして扱う */
.midashi3 {
  display: flex;
  align-items: center;
  white-space: nowrap;
  margin: 0;
  padding: 0;
}

/* アイコン画像の位置調整 */
.midashi3-icon {
  height: 30px;
  margin-bottom: 0px;
  margin-top: -5px;
  margin-left: 15px;
}

/* アイコン画像の位置調整 */
.midashi3-icon2 {
  height: 20px;
  margin-bottom: 0px;
  margin-bottom: -2.5px;
  margin-left: 0px;
}

/* アイコン画像の位置調整 */
.midashi3-icon3 {
  height: 15px;
  margin-bottom: 0px;
  margin-top: 1px;
  margin-left: 25px;
  margin-right: -5px;
}

/* アイコン画像の位置調整 */
.midashi3-icon4 {
  height: 13px;
  width: 15px;
  margin-bottom: 0px;
  margin-top: -.0.5px;
  margin-left: 25px;
  margin-right: -5px;
}

/* アイコン画像の位置調整 */
.midashi3-icon5 {
  height: 18px;
  margin-bottom: 0px;
  margin-top: -5px;
  margin-left: 0px;
}

/* テキスト部分のスタイル */
.midashi3-text {
  font-family: "メイリオ", Meiryo, sans-serif;
  font-size: 18px; /* size="4" 相当 */
  color: #003366;
  font-weight: bold;
  margin-left: 3px; /* &thinsp; の代わりに余白を安定させる */
}

/*---↓↓↓↓見出し４に入れる画像↓↓↓↓----------------------------------*/

.title4 {
  position: relative;
width: 759px;  /* ← pxを追加 */
  height: 64.5px; /* ← pxを追加 */
  /* 文字の垂直中央を揃える基準 */
  display: flex;
  align-items: center;
  overflow: hidden; /* はみ出し防止 */
}

.title4 img.bg {
  position: absolute;
  left: 24.5px;      /* 右にずらす分 */
  top: 0;
  width: 734.5px;    /* 759px から 24.5px 引いた数値 */
  height: 62.5px;
  object-fit: fill; /* 指定した幅に画像をギュッと収める */
  z-index: 1;
}

.title4 span.s4 {
  position: relative;
  z-index: 2;    /* 画像より上に表示 */
  padding-left: 125px;
  font-weight: bold;
  font-size: 21.5px;
  color: #003366;
line-height: 62.5px; /* 親の高さ 62.5px に合わせる */
}

/* 囲みによるラベル */
.label {
  /* --- 既存のスタイル --- */
  position: absolute;
  z-index: 3;
  right: 50px; 
  top: 50%;
  transform: translateY(-50%);
  border: 1.5px solid #003366; 
  background-color: #fff;
  font-size: 11px;
  color: #003366;
  font-weight: bold;
  white-space: nowrap;

  /* --- 文字数に応じた可変設定 --- */
  display: inline-flex;
  justify-content: center;
  align-items: center;

  /* 1. 短い文字の時の「3文字分の余白」を確保する最小幅 */
  /* 文字サイズ11pxで「3文字+前後3文字分(計9文字分)」なら 100px 前後 */
  min-width: 100px; 

  /* 2. 長い文字の時にパツパツにならないための最低限の左右余白 */
  padding: 1px 10px; 
  
  box-sizing: border-box; 
}

/*---↓↓↓↓見出し４に入れる画像その２↓↓↓↓----------------------------------*/

.title4_1 {
  position: relative;
  width: 769px;
  height: 73.7px;
  /* 文字の垂直中央を揃える基準 */
  display: flex;
  align-items: center;
  overflow: hidden; /* はみ出し防止 */
}

.title4_1 img.bg {
  position: absolute;
  left: 25px;
  top: 0;
  width: 719px;   /* 769pxから左右余白を引いた数値（枠が収まるサイズ） */
  height: 100%;
  object-fit: contain;
  z-index: 1;    /* 画像を下に */
}

.title4_1 span.s4 {
  position: relative;
  z-index: 2;    /* 画像より上に表示 */
  padding-left: 105px;
  font-weight: bold;
  font-size: 21.5px;
  color: #003366;
  line-height: 73.7px; /* 親の高さに合わせる */
}

/* 囲みによるラベル */
.label {
  /* --- 既存のスタイル --- */
  position: absolute;
  z-index: 3;
  right: 50px; 
  top: 50%;
  transform: translateY(-50%);
  border: 1.5px solid #003366; 
  background-color: #fff;
  font-size: 11px;
  color: #003366;
  font-weight: bold;
  white-space: nowrap;

  /* --- 文字数に応じた可変設定 --- */
  display: inline-flex;
  justify-content: center;
  align-items: center;

  /* 1. 短い文字の時の「3文字分の余白」を確保する最小幅 */
  /* 文字サイズ11pxで「3文字+前後3文字分(計9文字分)」なら 100px 前後 */
  min-width: 100px; 

  /* 2. 長い文字の時にパツパツにならないための最低限の左右余白 */
  padding: 1px 10px; 
  
  box-sizing: border-box; 
}

/*---↓↓↓↓見出し5(第2章テキストデータで使用)↓↓↓↓----------------------------------*/

.title5 {
  position: relative;
  width: 650px;
  height: 52px;
  margin-left: -20px; 
  /* CHMで中身が消えるのを防ぐため、あえて overflow は指定しません */
}

.title5 img.bg {
  position: absolute;
  left: 15px;
  /* (親の高さ52px - 画像の高さ40px) / 2 = 6px で上下中央になります */
  top: 8px; 
  
  /* 【重要】高さを指定し、幅を auto にすることで比率を維持します */
  height: 35px;
  width: auto; 
  
  z-index: 1;
  border: none; /* CHMで枠線が出るのを防止 */
}

.title5 span.s5 {
  position: relative;
  z-index: 2;    
  
  /* blockにして、親の高さに合わせる */
  display: block; 
  
  /* 青いアイコンに被らないよう、左側の余白を調整してください */
  padding-left: 55px;
  
  font-weight: bold;
  font-size: 20px;
  color: #000000;
  margin-left: -10px; 
  letter-spacing: 2px;
  
  /* 親の高さ52pxに合わせることで、文字が上下中央に配置されます */
  line-height: 52px; 
  
  /* 万が一、文字がはみ出しても折り返さないようにします */
  white-space: nowrap; 
}

/*---↓↓↓↓見出し6(入力レコード一覧で使用)↓↓↓↓----------------------------------*/

.title6 {
  position: relative;
  /* 全体を左に寄せるための調整 */
  margin-left: -20px; 
  /* 幅は指定し、高さ(height)は指定しません（画像の高さに自動で合わせるため） */
  width: 350px; 
}

.title6 img.bg {
  /* 画像の下にできる不要な隙間を消す */
  display: block; 
  
  /* 左に10pxの余白を作り、残りの幅すべてを画像にする */
  margin-left: 10px;
  width: calc(100% - 10px); 
  
  /* ★ここが重要：元の縦横比を完全に維持したままサイズが調整されます */
  height: auto; 
}

.title6 span.s6 {
  /* テキストの方を画像の上に浮かせる */
  position: absolute;
  z-index: 2;    
  
  /* 画像の高さがどう変わっても、常に縦方向の「ど真ん中」に配置する設定 */
  top: 55%;
  transform: translateY(-50%);
  
  /* 左の余白 (画像の配置10px + 文字の開始位置45px = 計55px) */
  left: 45px; 
  
  font-weight: bold;
  font-size: 25px;
  color: #FFFFFF;
  letter-spacing: 8px;
}

/*---↓↓↓↓見出し7(入力レコード一覧「カテゴリー順」で使用)↓↓↓↓----------------------------------*/

.title7 {
  position: relative;
  /* 全体を左に寄せるための調整 */
  margin-left: -5px; 
  /* 幅は指定し、高さ(height)は指定しません */
  width: 138px; 
}

.title7 img.bg {
  display: block; 
  /* 左に10pxの余白を作り、残りの幅すべてを画像にする */
  margin-left: 5px;
  width: calc(100% - 5px); 
  height: auto; 
}

/* ★修正: .title6 を .title7 に変更 */
.title7 span.s7 {
  position: absolute;
  z-index: 2;    
  
  /* --- センター合わせの指定 --- */
  top: 53%; /* 55%から50%に変更して上下ど真ん中に */
  /* 画像が左に10pxずれているため、中心も5px右にずらして画像の中心に合わせる */
  left: calc(50% + 5px); 
  transform: translate(-50%, -50%); /* 起点を文字の中心にする */
  
  /* --- フォントの指定 --- */
  font-family: 'Meiryo', sans-serif; /* メイリオを指定 */
  font-weight: bold;
  color: #000000;
  
  /* --- サイズ調整 --- */
  /* 168pxの幅に収めるため、サイズと文字間隔を調整 */
  font-size: 13px; 
  letter-spacing: 1.0px;
  
  /* テキストが途中で改行されるのを防ぐ */
  white-space: nowrap;
}

/*---↓↓↓↓見出し8(入力レコード一覧「カテゴリー順」で使用)↓↓↓↓----------------------------------*/

.title8 {
  position: relative;
  /* 全体を左に寄せるための調整 */
  margin-left: 55px; 
  /* 幅は指定し、高さ(height)は指定しません */
  width: 200px; 
}

.title8 img.bg {
  display: block; 
  /* 左に10pxの余白を作り、残りの幅すべてを画像にする */
  margin-left: 10px;
  width: calc(100% - 5px); 
  height: auto; 
}

/* ★修正: .title6 を .title7 に変更 */
.title8 span.s8 {
  position: absolute;
  z-index: 2;    
  
  /* --- センター合わせの指定 --- */
  top: 53%; /* 55%から50%に変更して上下ど真ん中に */
  /* 画像が左に10pxずれているため、中心も5px右にずらして画像の中心に合わせる */
  left: calc(50% + 5px); 
  transform: translate(-50%, -50%); /* 起点を文字の中心にする */
  
  /* --- フォントの指定 --- */
  font-family: 'Meiryo', sans-serif; /* メイリオを指定 */
  font-weight: bold;
  color: #000000;
  
  /* --- サイズ調整 --- */
  /* 168pxの幅に収めるため、サイズと文字間隔を調整 */
  font-size: 20px; 
  letter-spacing: 1.0px;
  
  /* テキストが途中で改行されるのを防ぐ */
  white-space: nowrap;
}

/*---↓↓↓↓見出し9(入力レコード一覧「カテゴリー順」で使用)↓↓↓↓----------------------------------*/

.heading-bullet {
  /* --- レイアウトの基本設定 --- */
  display: flex;
  align-items: center; /* 天地センター合わせ */
  /* gap: 9px; はCHMで効かないため削除します */
  
  /* --- フォントの設定 --- */
  font-size: 20px;
  font-weight: bold;
  
  /* --- 背景と文字色の設定 --- */
  color: #17375e;            /* テキストの色 */
  background-color: #ffffff; /* 背景を白に */

  /* 調整した上下余白 */
  padding: 10px 0; 
}

.heading-bullet::before {
  content: "";
  display: inline-block;
  
  /* ★変更: 内側の水色（コア）のサイズを指定します */
  width: 16px; 
  height: 16px;
  border-radius: 50%; /* 真円にする */
  background-color: #8eb4e3; 
  
  /* ★変更: box-shadowの代わりに「線（border）」で外側のリングを描画します */
  /* 線であれば、CHMでも「要素の幅」として物理的に計算されるため重なりません */
  border: 6px solid #17375e; 
  
  /* ★追加: gapの代わりに、●の右側に余白を作ります */
  margin-right: 6px;
  
  flex-shrink: 0; /* テキストが長くなっても潰れないようにする */
    
  /* ★微調整（そのまま維持） */
  transform: translateY(-2px); 
}

/*---↓↓↓↓本文のリードその１↓↓↓↓----<div class="lead1">と</div>で挟む------------------------------*/

.lead1
{
	margin-top: 0.8em;
	margin-left: 0.8em;
}

/*---↓↓↓↓本文のリードその２↓↓↓↓----------------------------------*/

.lead2
{
	margin-top: 0em;
	margin-left: 0em;
}

/*---↓↓↓↓本文のリードその３↓↓↓↓----------------------------------*/

.lead3
{
	margin-top: 0em;
	margin-left: 2.5em;
}


/*---↓↓↓↓本文のリードその４↓↓↓↓----------------------------------*/

.lead4 {
  margin-top: 0.20em;
  margin-left: 2.5em;
}

/*---↓↓↓↓本文のリードその５↓↓↓↓----------------------------------*/

.lead5
{
	margin-top: -0.3em;
	margin-left: -0.2em;
}

/*---↓↓↓↓本文のリードその２↓↓↓↓----------------------------------*/

.lead6
{
	margin-top: 0.6em;
	margin-left: 1.0em;
}

/*---↓↓↓↓トビラのリード↓↓↓↓----------------------------------*/

.tobira_lead1 {
  margin-top: 1em;
  margin-left: 3.5em;
  transform: translateY(-5px); /* ← 上に5px移動 */
}

/*---↓↓↓↓本文の書式その１↓↓↓↓----<div class="word01">と</div>で挟む------------------------------*/

.word01 
 {
    margin-left: 0.5em;   /* ブロック全体の位置 */
    padding-left: 1em;  /* 1行目も2行目以降も同じだけ下げる */
}

/*---↓↓↓↓本文の書式その２↓↓↓↓----------------------------------*/

.word02
 {
    margin-left: 3.0em;   /* ブロック全体の位置 */
    padding-left: 1em;  /* 1行目も2行目以降も同じだけ下げる */
}

/*---↓↓↓↓本文の書式その３↓↓↓↓----------------------------------*/

.word03
 {
    margin-left: 0.2em;   /* ブロック全体の位置 */
    padding-left: 1em;  /* 1行目も2行目以降も同じだけ下げる */
}

/*----表組その２------------------------------------------------------*/

.table1 {
  border-collapse: collapse;
  border: 2px solid #333;
  width: 100%;
  font-family: "メイリオ", sans-serif;
}

/* 見出し行（上段）＝中央寄せ */
.table1 th {
  border: 2px solid #333;
  padding: 6px 10px;
  text-align: center;   /* ← 見出しだけ中央 */
}

/* データ行（それ以外）＝左寄せ */
.table1 td {
  border: 2px solid #333;
  padding: 6px 10px;
  text-align: left;     /* ← データ行は左寄せ */
}

/* 見出し行（上段） */
.tb_iro001 {
  background-color:#B7D9FF;
  font-weight: bold;
  font-size: 16.5px;
}

/* 見出し以外の行 */
.tb_iro002 {
  background-color: #FFFFFF;
  font-size: 15px;
}

/* 偶数行の背景色（ほんのり薄い青） */
.table1 tr:nth-child(odd) td {
  background-color: #f3f8ff;
}

/*----表組その３---｢テキスト入力書式サンプル｣で使用。このページカットなら使わない---------------------------------------------------*/

table.design01 th,
table.design01 td {
/* width: 20%; */ /* セルの幅にする場合！E*/
	padding: 6px; /* セルのパディング上下、左右*/
	border: ridge 2px #003366; /* セルの線*/
	font-size: 10pt;
}

/*----表組その４------------------------------------------------------*/

table.sen_nashi {
    border-style: none;              /* 表の外枠なし */
    border-collapse: separate;       /* cellspacing を有効にする */
    border-spacing: 1px;             /* cellspacing="1" と同じ */
}

table.sen_nashi td {
    padding: 0;                      /* セル内余白 */
    font-family: "メイリオ", Meiryo, sans-serif;
    font-size: 18px;                 /* size="4" 相当 */
    color: #003366;
    font-weight: bold;
    margin-left: 3px;                /* &thinsp; の代わりに安定した余白 */
    line-height: 1.0;   /* ← 行間を詰める */
}

table.sen_nashi td a {
    color: inherit;   /* td の色をそのまま使う */
}

/*----表組その５------------------------------------------------------*/

table.sen_nashi2 {
    border-style: none;              /* 表の外枠なし */
    border-collapse: separate;       /* cellspacing を有効にする */
    border-spacing: 1px;             /* cellspacing="1" と同じ */
}

table.sen_nashi2 td {
    padding: 0;                      /* セル内余白 */
    font-family: "メイリオ", Meiryo, sans-serif;
    font-size: 18px;                 /* size="4" 相当 */
    color: #003366;
    font-weight: bold;
    margin-left: 3px;                /* &thinsp; の代わりに安定した余白 */
    line-height: 2.0;   /* ← 行間を詰める */
}

table.sen_nashi2 td a {
    color: inherit;   /* td の色をそのまま使う */
}

/*----表組その６------------------------------------------------------*/

.box5 {
    width: 100%;
    max-width: 600px;
    border-collapse: collapse;
    /* 外枠を透明にする */
    border: 2px solid transparent; 
    line-height: 1; 
  }

  .box5 td {
    /* セル同士の区切り線をすべて透明にする */
    border: 2px solid transparent; 
    /* paddingにマイナス値は使えないため、最小の0に設定 */
    padding: 0px 0px; 
    height: 1.6em; 
  }

  .side-column {
    width: 7.0%; 
  }

/*----表組その７------------------------------------------------------*/

table.box3 {
    margin-top: 5px;        /* 上方向の余白 */
    margin-bottom: 0px;    /* 下方向の余白 */
    margin-left: 10px;       /* 左方向の微調整 */
    margin-right: 0px;      /* 右方向の微調整 */

    border-collapse: collapse;
    border: 1px solid #333;
}

/* ヘッダ行だけ背景色＋線を付ける */
table.box3 th {
    border:1px solid #333;
    background-color: #F0F6FF; /* ← ヘッダだけ色を付ける */
    padding: 4px 8px;
}

/* データ行は白背景＋線だけ */
table.box3 td {
    border:1px solid #333;
    background-color: #FFFFFF; /* ← 白に固定 */
    padding: 4px 8px;
}

/*----表組その８(メッセージ一覧で使用)------------------------------------------------------*/

.iro-table {
  width: 100%;
  max-width: 900px;
  /* cellspacing="2" の再現 */
  border-collapse: separate;
  border-spacing: 2px;
  /* border="2" の再現 */
  border: 2px solid #333;
}

.iro-table th,
.iro-table td {
  /* border="2" の再現 */
  border: 2px solid #333;
  /* cellpadding="5" の再現 */
  padding: 5px;
  vertical-align: middle;
}

/* iro01: ヘッダー設定（中央揃え・太字） */
.iro01 {
  background-color: #f2f2f2; /* 元の背景色に合わせて調整してください */
  text-align: center;
  white-space: nowrap;
  font-weight: bold;
}

/* iro02: No.設定（太字・改行禁止） */
.iro02 {
  font-weight: bold;
}

/* iro20: メッセージ設定 */
.iro20 {
  text-align: left;
}

/*----表組その９(テキストデータの解説で使用)------------------------------------------------------*/

/* テーブル全体の基本設定 */
.original-style-table {
  /* cellspacing="2" の再現 */
  border-collapse: separate; 
  border-spacing: 2px;
  
  /* border="2" の再現（外枠） */
  border: 2px solid #888; /* 色は標準的なグレーを想定 */
}

/* 全セル共通設定（cellpadding="5" の再現） */
.original-style-table th,
.original-style-table td {
  border: 2px solid #888; /* border="2" は全セルに適用される */
  padding: 5px;           /* cellpadding="5" */
}
/* 解説行の最小幅 */
.original-style-table th:nth-child(4),
.original-style-table td:nth-child(4){
  min-width: 200px;
}
/* 省略値の最小幅*/ 
.original-style-table th:nth-child(5),
.original-style-table td:nth-child(5){
  min-width: 100px;
}
*/
/* ヘッダー行の色指定 (iro01) */
.iro01 {
  background-color: #d3d3d3; /* オリジナルの背景色に合わせて調整してください */
  text-align: center;
}

/* 項目列の色指定 (iro02) */
.iro02 {
  background-color: #f0f0f0; /* オリジナルの背景色に合わせて調整してください */
}

/* 中央揃えの指定（<div>タグの代替） */
.unit-cell,
.type-cell,
.default-cell {
  text-align: center;
}

/*----表組その10------------------------------------------------------*/

.box5_1 {
    width: 100%;
    max-width: 600px;
    border-collapse: collapse;
    /* 外枠を透明にする */
    border: 2px solid transparent;
    line-height: 1;
}

  .box5_1 td {
    /* セル同士の区切り線をすべて透明にする */
    border: 2px solid transparent; 
    padding: 0px 0px 0px 0px; 
    height: 1.9em; 
  }
  
  .box5_1 td img {
    padding-right: 2px; 
}

  .side-column {
    width: 7.0%; 
  }
  
  .box5_1 td a {
    color: #003366; /* ここに今の色（例: 濃い青）を指定してください */
    text-decoration: none; /* 下線を消したい場合はこれを追加 */
}

/* リンクの全状態（通常、訪問済み、マウスホバー、クリック時）の色を統一 */
.box5_1 td a, 
.box5_1 td a:visited, 
.box5_1 td a:hover, 
.box5_1 td a:active {
    color: #003366; /* ← ここに今使っている「青」のカラーコードを入れてください */
    text-decoration: underline; /* 下線を表示する設定 */
}

/* 1. 通常時：色は固定し、下線は「なし」に設定 */
.box5_1 td a, 
.box5_1 td a:visited {
    color: #003366; /* 今の青色のコードに書き換えてください */
    text-decoration: none; /* 下線を消す */
}

/* 2. カーソルを合わせた時（ホバー時）：色は変えず、下線だけ「あり」にする */
.box5_1 td a:hover {
    color: #003366; /* ここも通常時と同じ色を指定（色変え防止） */
    text-decoration: underline; /* 下線を出す */
}

/*----表組その10（第２章で使用）------------------------------------------------------*/

/* --- 表全体--- */

table.chart01 {
    margin-top: 10px;
    margin-bottom: 5px;
    border: 2px #345C8C solid;
    border-collapse: collapse;
    font-size: 10pt;
	
border-left: 10px solid #345C8C; /* 好きな太さと色に変更可能 */
}

/* --- 表タイトル --- */
table.chart01 caption {
    padding-bottom: 5px;
    white-space: nowrap;
    font-size: 10pt;
}

/* --- セル共通 --- */
table.chart01 th,
table.chart01 td {
    padding: 6px 6px;
    border: 1px #4F81BD solid;
    font-size: 10pt;
}

/* --- 見出しセル --- */
table.chart01 thead th {
    background-color: #deefff;
    text-align: center;
    white-space: nowrap;
    font-size: 10pt;
}

/* --- 通常セル --- */
table.chart01 tbody td {
    background-color: #ffffff;
    font-size: 10pt;
}

/* --- 色分けセル --- */
table.chart01 td.item {
    background-color: #BBD2EE;
    text-align: left;
    white-space: nowrap;
}

table.chart01 th.item1 {
    text-align: left;
    white-space: nowrap;
}

table.chart01 th.item2 {
    background-color: #BBD2EE;
    text-align: left;
    white-space: nowrap;
}

table.chart01 th.item3 {
    background-color: #E3EDFD;
	white-space: nowrap;
}

table.chart01 th.odd,
table.chart01 td.odd {
    background-color: #BBD2EE;
    font-size: 10pt;
}

table.chart01 th.odd2 {
    background-color: #BBD2EE;
    width: 65px;
    font-size: 10pt;
}

table.chart01 td.silver,
table.chart01 td.silver2 {
    background-color: #BBD2EE;
    font-size: 10pt;
}

table.chart01 td.silver2 {
    text-align: center;
}

/* --- データセル --- */
table.chart01 tr.datac,
table.chart01 td.datac {
    background-color: #ffffff;
    text-align: center;
    white-space: nowrap;
    font-size: 10pt;
}

/* --- 枠なしセル --- */
table.chart01 td.nb1,
table.chart01 td.nb2 {
    border: none;
    text-align: left;
    vertical-align: top;
    padding: 3px 0px;
    font-size: 10pt;
}











/*----表組（索引用）------------------------------------------------------*/

/* =========================================
   共通設定：画像サイズ
   ========================================= */
.img-cate {
    height: 50px;
    width: auto;
    border: none;
    margin: 0;
    padding: 0;
}

.img-50on {
    height: 35px;
    width: auto;
    border: none;
    margin-top: 0;
    padding: 0;
}

/* ★一番重要：罫線に「clear: both」を追加し、絶対に画像の下に敷く */
.box_sakuin {
    clear: both; 
    border-top: 5px solid #000000; /* 4pxから5pxに変更 */
    margin: 0;
    margin-top: -6px; /* 線を太くした分、重なり具合を微調整 (-3pxか-4pxでお好みで) */
    position: relative;
    z-index: 2;
    padding: 0;
    height: 0;
    font-size: 0;
    line-height: 0;
}

/* =========================================
   新旧共通：CHMで最強の「Float（左詰め）」設定
   ========================================= */
.tag_sakuin,
.tag_sakuin2 {
    margin-left: 40px;
}

/* 親枠の高さをはみ出させないための設定 */
.nobr_sakuin,
.nobr_sakuin2 {
    overflow: hidden; 
    position: relative;
    z-index: 1;
}

/* すべての画像とリンクを強制的に「左詰め（ブロック化）」 */
.nobr_sakuin > img,
.nobr_sakuin > a,
.nobr_sakuin2 > img,
.nobr_sakuin2 > a {
    float: left;
    display: block;
}

/* aタグの中の画像もブロック化して隙間を完全消去 */
.nobr_sakuin a img,
.nobr_sakuin2 a img {
    display: block;
}

/* =========================================
   古いページ用（カテゴリー順が左）
   ========================================= */
/* 1つ目(左)のカテゴリー順(45px)の右に20px隙間 */
.nobr_sakuin .img-cate {
    margin-right: 20px;
}
/* 2つ目(右)の「50音順(35px)」を上から10px押し下げて下を揃える */
.nobr_sakuin a {
    margin-top: 10px;
}

/* =========================================
   新しいページ用（50音順が左）
   ========================================= */
/* 1つ目(左)の「50音順(35px)」を上から10px押し下げ、右に20px隙間 */
.nobr_sakuin2 a {
    margin-top: 10px;
    margin-right: 20px;
}
/* 2つ目(右)の画像はそのまま(45pxなので押し下げ不要) */
.nobr_sakuin2 .img-cate {
    margin-top: 1;
}









  
/*----改行あたま落とし注意書き※文字小さい(落とし１文字)--<p class="note">と</p>--------------------------------------------------*/

.note {
  font-size: 12px;
  text-indent: -1em;
  padding-left: 1em;
  margin-top: 1px;
  margin-bottom: 2px;
}

/*----改行しない。<div class="nobr">と</div>で挟む--------------------------------------------*/

.nobr {
 white-space: nowrap;
}





/*------------------------------------------------------*/

























/*====================================================*/

a:link
{
	text-decoration:none; /*下線を消す*/
	color:#003CB9 ; /*未訪問リンクのカラー*/
}

a:visited
{
	text-decoration:none; /*下線を消す*/
	color:#003CB9 ; /*訪問済みリンクのカラー*/
}

a:active
{
	text-decoration:none; /*下線を消す*/
	color:#cc66ff ; /*クリックしたときのカラー*/
}

a:hover
{
	text-decoration: underline; /*下線を出す*/
	color: rgb(166,202,240); /*マウスが乗ったときのカラー*/
}





 /*----フッター-------------------------------------------*/

div#footer-bk
{
	background-color: #1c305c;   /* 背景色 */
	width: 100%;               /* 横の幅を100% */
	height: 35px;            /* 縦の幅を100px */
	position: fixed;       /* 絶対位置指定することを定義 */
	bottom: 0px;              /* 絶対位置指定(左0px,下0px) */
	padding: 0px 0;          /* 上下に余白を取る */
	margin-left:-8px;
}


div#footer-bk2
{
	background-color: #1c305c;   /* 背景色 */
	width: 100%;               /* 横の幅を100% */
	height: 50px;            /* 縦の幅を100px */
	position: fixed;       /* 絶対位置指定することを定義 */
	bottom: 0px;              /* 絶対位置指定(左0px,下0px) */
	padding: 0px 0;          /* 上下に余白を取る */
	margin-left:-8px;
}


div#footer
{
	border: 0px solid ; /* 表示領域を白枠で囲う */
	height:100px;          /* 縦幅の指定100px */
	width: 100%;           /* 横の幅970px */
	margin: auto;           /* 中央揃え */
}


 /*----フッタ(表紙用)ー-------------------------------------------*/

div#footer-bk_hyoshi {
    background-color: #1c305c;
    width: 100%;
    height: 35px;
    position: fixed;
    bottom: 0px;
    left: 0;
    text-align: right; 
    overflow: hidden;
}

div#footer_hyoshi {
    height: 35px;
    line-height: 35px; 
    padding-right: 20px;
    display: inline-block;
}

div#footer_hyoshi img {
    vertical-align: middle;
    margin-bottom: 2px;
}

div#footer_hyoshi span, 
div#footer_hyoshi a {
    vertical-align: middle;
}

/* リンクの設定 */
div#footer_hyoshi a {
    text-decoration: none; /* 通常は下線なし */
}

div#footer_hyoshi a:hover {
    text-decoration: underline; /* ホバーで下線あり */
}









/*----画像の下にテキストを回り込ませない-------------------------------------------*/

.float { float:left; }

p.keizoku{
    overflow: auto;
}

/*----改ページする-------------------------------------------*/

.page
	{
    PAGE-BREAK-BEFORE: always;
	}

/*----天地センター-------------------------------------------*/

.tenchi{
	height: 100px;
	display: flex;
	align-items: center;
}

/*----細い線を引く その１-----<p class="box99">と</p>で挟む-------------*/
p.box {
   border-bottom: 1px solid #000000;
}

/*----細い線を引く その２--------------------------------------------*/
p.box02 {
  border-bottom: 1px solid;
  color:#c0c6c9;
  margin: 10px auto;
  width:80%;
}

/*----細い線を引く その３--------------------------------------------*/
p.box03 {
  border-bottom: 1px solid;
  color:#0f2350;
  width:258px;
  margin-left:78px;
  margin-right:0px;
  margin-top:-3px;
  margin-bottom:0px;
}

/*----細い線を引く その３の２--------------------------------------------*/
p.box03_2 {
  border-bottom: 1px solid;
  color:#0f2350;
  width:237px;
  margin-left:78px;
  margin-right:0px;
  margin-top:-3px;
  margin-bottom:0px;
}

/*----細い線を引く その３の３--------------------------------------------*/
p.box03_3 {
  border-bottom: 1px solid;
  color:#0f2350;
  width:200px;
  margin-left:78px;
  margin-right:0px;
  margin-top:-3px;
  margin-bottom:0px;
}

/*----細い線を引く その４--------------------------------------------*/
p.box04 {
  border-bottom: 1px solid;
  color:#0f2350;
  width:220px;
  margin-left:78px;
  margin-right:0px;
  margin-top:-3px;
  margin-bottom:0px;
}

/*----細い線を引く その５--------------------------------------------*/
p.box05 {
  border-bottom: 1px solid;
  color:#0f2350;
  width:220px;
  margin-left:28px;
  margin-right:0px;
  margin-top:-3px;
  margin-bottom:0px;
}

/*----細い線を引く その５の２--------------------------------------------*/
p.box05_2 {
  border-bottom: 1px solid;
  color:#0f2350;
  width:205px;
  margin-left:28px;
  margin-right:0px;
  margin-top:-3px;
  margin-bottom:0px;
}

/*----細い線を引く その６--------------------------------------------*/
p.box06 {
  border-bottom: 1px solid;
  color:#0f2350;
  width:310px;
  margin-left:27px;
  margin-right:0px;
  margin-top:-3px;
  margin-bottom:0px;
}

/*----細い線を引く その７--------------------------------------------*/
p.box07 {
  border-bottom: 1px solid;
  color:#0f2350;
  width:330px;
  margin-left:7px;
  margin-right:0px;
  margin-top:-3px;
  margin-bottom:0px;
}

/*----細い線を引く その８--------------------------------------------*/
p.box08 {
  border-bottom: 1px solid;
  color:#0f2350;
  width:240px;
  margin-left:97px;
  margin-right:0px;
  margin-top:-3px;
  margin-bottom:0px;
}

/*----細い線を引く その９--------------------------------------------*/
p.box09 {
  border-bottom: 1px solid;
  color:#0f2350;
  width:220px;
  margin-left:116px;
  margin-right:0px;
  margin-top:-3px;
  margin-bottom:0px;
}

/*----細い線を引く その10--------------------------------------------*/
p.box10 {
  border-bottom: 1px solid;
  color:#0f2350;
  width:195px;
  margin-left:142px;
  margin-right:0px;
  margin-top:-3px;
  margin-bottom:0px;
}

/*----細い線を引く その11--------------------------------------------*/
p.box11 {
  border-bottom: 1px solid;
  color:#0f2350;
  width:233px;
  margin-left:103px;
  margin-right:0px;
  margin-top:-3px;
  margin-bottom:0px;
}

/*----細い線を引く その12--------------------------------------------*/
p.box12 {
  border-bottom: 1px solid;
  color:#0f2350;
  width:202px;
  margin-left:78px;
  margin-right:0px;
  margin-top:-5px;
  margin-bottom:px;
}

/*----細い線を引く その13--------------------------------------------*/
p.box13 {
  border-bottom: 1px dashed;
  color:#c0c6c9;
  margin: 10px auto;
  width:80%;
}






/*----↓↓↓↓トップへ戻るボタン↓↓↓↓-------------------------------------------*/
.pagetop {
	color: #FFFFFF;
	background-color: rgba(0,0,0,0.3);
	text-decoration: none;
	display: none;
	position: fixed;
	bottom: 3.5rem;
	right: 1rem;
	font-size: 1.5rem;
	width: 3.3rem;
	height: 3.3rem;
	line-height: 3.3rem;
	border-radius: 3.3rem;
	text-align: center;
	cursor: pointer;
}

.pagetop:hover {
	color: #FFFFFF !important;
	background-color: #161666;
	text-decoration: none;
}











/*----上へ戻るを常駐表示-------------------------------------------*/

.page-top
{
	margin: 0 ;
	padding: 0 ;
}
 
.page-top p
{
	margin: 0 ;
	padding: 0 ;

	position: fixed ;
	right: 16px ;
	bottom: 55px ;
}
 
.move-page-top
{
	display: block ;
	background: none ;
	width: 30px ;
	height: 50px ;

	color: none ;
	line-height: 50px ;
	text-decoration: none ;
	text-align: center ;

	-webkit-transition:all 0.5s ;
	-moz-transition:all 0.5s ;
	transition:all 0.5s ;
}

.move-page-top:hover
{
	opacity: 0.85 ;
}


/*----↓↓↓↓ページを改行させる↓↓↓↓-------------------------------------------*/
hr.page
{
    BORDER-TOP-WIDTH: 0px;
    BORDER-LEFT-WIDTH: 0px;
    BORDER-BOTTOM-WIDTH: 0px;
    PAGE-BREAK-BEFORE: always;
    WIDTH: 0px;
    BORDER-RIGHT-WIDTH: 0px;
}

/*----↓↓↓↓画像に囲み枠を入れない↓↓↓↓-------------------------------------------*/

img {border:0;}







/*----↓↓↓↓表組アレンジ----230613実用はしていない↓↓↓↓---------------------------*/

/*---------------------------------------------------------------------------------------*/

.design02 {
 width: 100%;
 text-align: center;
 border-collapse: collapse;
 border-spacing: 0;
 border: solid 1px #778ca3;
}
.design02 tr {
 border-top: dashed 1px #778ca3;
}
.design02 th {
 padding: 10px;
 background: #e9faf9;
}
.design02 td {
 padding: 10px;
}

/*---------------------------------------------------------------------------------------*/

.design03 {
 width: 100%;
 text-align: center;
 border-collapse: collapse;
 border-spacing: 0;
 border-top: solid 1px #778ca3;
}
.design03 tr:nth-child(2n+1) {
 background: #e9faf9;
}
.design03 th,
.design03 td {
 padding: 10px;
 border-bottom: solid 1px #778ca3;
}

/*---------------------------------------------------------------------------------------*/

.design04 {
 width: 100%;
 text-align: center;
 border-collapse: collapse;
 border-spacing: 0;
}
.design04 tr:nth-child(2n+1) {
 background: #e9faf9;
}
.design04 th {
 padding: 10px;
 background: #778ca3;
 border-right: solid 1px #778ca3;
 color: #ffffff;
}
.design04 th:last-child {
 border-right: none;
}
.design04 td {
 padding: 10px;
 border-right: solid 1px #778ca3; 
}
.design04 td:last-child {
 border-right: none;
}

/*---------------------------------------------------------------------------------------*/

.design05 {
 width: 100%;
 text-align: center;
 border-collapse: collapse;
 border-spacing: 0;
}
.design05 th {
 padding: 10px;
 background: #e9faf9;
 border-top: solid 3px #778ca3;
 border-right: solid 3px #778ca3;
}
.design05 th:last-child {
 border-right: none;
}
.design05 td {
 padding: 10px;
 border-right: solid 3px #778ca3; 
}
.design05 td:last-child {
 border-right: none;
}

/*---------------------------------------------------------------------------------------*/

.design06 {
 width: 100%;
 text-align: center;
 border-collapse: collapse;
 border-spacing: 0;
}
.design06 tr:last-child {
 background: #fafafb;
 border-top: double 3px #666666;
 font-weight: bold;
 color: #eb3b5a;
}
.design06 th {
 padding: 10px;
 background: #778ca3;
 border: solid 1px #666666;
 color: #ffffff;
}
.design06 td {
 padding: 10px;
 border: solid 1px #666666;
}

/*---------------------------------------------------------------------------------------*/

.design07 {
 width: 100%;
 text-align: center;
 border-collapse: collapse;
 border-spacing: 0;
}
.design07 th {
 padding: 10px;
 background: #778ca3;
 border: solid 1px #666666;
 color: #ffffff;
}
.design07 td {
 padding: 10px;
 border: solid 1px #666666;
}
.design07 tr:nth-child(2) {
 background: #e9faf9;
}

/*---------------------------------------------------------------------------------------*/

.design08 {
 width: 100%;
 text-align: center;
 border-collapse: collapse;
 border-spacing: 0;
}
.design08 th {
 padding: 10px;
 background: #778ca3;
 border: solid 1px #666666;
 color: #ffffff;
}
.design08 td {
 padding: 10px;
 border: solid 1px #666666;
}
.design08 td:first-child {
 background: #e9faf9;
}

/*---------------------------------------------------------------------------------------*/

.design09 {
 width: 100%;
 text-align: center;
 border-collapse: collapse;
 border-spacing: 0;
 border: solid 2px #778ca3;
}
.design09 th {
 padding: 10px;
 background: #e9faf9;
 border: solid 1px #778ca3;
 border-bottom: solid 2px #778ca3;
}
.design09 td {
 padding: 10px;
 border-left: solid 1px #778ca3;
}
.design09 tr {
 border-top: dashed 1px #778ca3;
}

/*---------------------------------------------------------------------------------------*/

.design10 {
 width: 100%;
 text-align: center;
 border-collapse: collapse;
 border-spacing: 0;
}
.design10 th {
 padding: 10px;
 border-bottom: solid 4px #778ca3;
 color: #778ca3
}
.design10 td {
 padding: 10px;
 border-bottom: solid 1px #778ca3;
}

/*---------------------------------------------------------------------------------------*/

.design11 {
 width: 100%;
 text-align: center;
 border-collapse: collapse;
 border-spacing: 0;
 border: solid 3px #778ca3;
}
.design11 th {
 padding: 10px;
 border: solid 1px #778ca3;
 background: #778ca3;
 color: #ffffff;
}
.design11 td {
 padding: 10px;
 border: solid 1px #778ca3;
 background: #e9faf9;
}

/*---------------------------------------------------------------------------------------*/

.design12 {
 width: 100%;
 text-align: center;
 border-collapse: collapse;
 border-spacing: 0;
 background: #cdf4f0;
}
.design12 tr:nth-child(2n+1) {
 background: #e9faf9;
}
.design12 th {
 padding: 10px;
 border: solid 1px #ffffff;
 background: #778ca3;
 color: #ffffff;
}
.design12 td {
 padding: 10px;
 border: solid 1px #ffffff;
}

/*---------------------------------------------------------------------------------------*/

.design13 {
 width: 100%;
 text-align: center;
 border-collapse: collapse;
 border-spacing: 0;
 background: #778ca3;
 color: #ffffff;
}
.design13 th {
 padding: 10px;
 background: #4b6584;
 border: solid 1px #ffffff;
}
.design13 td {
 padding: 10px;
 border: solid 1px #ffffff;
}

/*---------------------------------------------------------------------------------------*/

.design14 {
 width: 100%;
 text-align: center;
 border-collapse: collapse;
 border-spacing: 0;
 background: linear-gradient(to bottom right, #40d5ff, #00aad9);
 color: #ffffff;
}
.design14 th {
 padding: 10px;
 border: solid 1px #ffffff;
}
.design14 td {
 padding: 10px;
 border: solid 1px #ffffff;
}

/*---------------------------------------------------------------------------------------*/

.design15 {
 width: 100%;
 text-align: center;
 border-collapse: collapse;
 border-spacing: 0;
 background: linear-gradient(to bottom, #91e842, #d2ff52);
 color: #ffffff;
}
.design15 th {
 padding: 10px;
 border: solid 1px #ffffff;
 background: #6fcd19;
}
.design15 td {
 padding: 10px;
 border: solid 1px #ffffff;
}

/*---------------------------------------------------------------------------------------*/

.design16 {
 width: 100%;
 text-align: center;
 border-collapse: collapse;
 border-spacing: 0;
}
.design16 th {
 padding: 10px;
 border: solid 1px #ffffff;
}
.design16 th:nth-child(1) {
 background: #fd9644;
}
.design16 th:nth-child(2) {
 background: #fed330;
}
.design16 th:nth-child(3) {
 background: #26de81;
}
.design16 td {
 padding: 10px;
 border: solid 1px #ffffff;
}
.design16 td:nth-child(1) {
 background: #fec598;
}
.design16 td:nth-child(2) {
 background: #fee585;
}
.design16 td:nth-child(3) {
 background: #70e9ac;
}

/*---------------------------------------------------------------------------------------*/

.design17 {
 width: 100%;
 text-align: center;
 border-collapse: collapse;
 border-spacing: 0;
}
.design17 th {
 padding: 10px;
 background: #e9faf9;
 border: solid 1px #778ca3;
}
.design17 td {
 padding: 10px;
 border: solid 1px #778ca3;
}
.design17 tr:nth-child(2) td:nth-child(1),
.design17 tr:nth-child(3) td:nth-child(2),
.design17 tr:nth-child(4) td:nth-child(3){
 background: #fc5c65;
 color: #ffffff;
}

/*----改行しない。<div class="nobr">と</div>で挟む--------------------------------------------*/

.nobr {
 white-space: nowrap;
}

/*----文字に下線を入れる<div class="sen">と</div>で挟みます。表紙と章扉で使用------------------------------*/

.sen {
 border-bottom : solid 1px;
}






/*----↓↓↓↓html5に変更するにあたっての変更点↓↓↓↓--------------------------------*/

/*----bgcolorの代替----表組のセルの色を指定する----<td class="iro01">と</td>で指定----*/


td.iro01{
 background-color:#bcddff;
}

td.iro02{
 background-color:#d6eaff;
}

td.iro02_2{
 background-color:#d6eaff;
 white-space: nowrap;
 font-weight: bold;
 text-align: center;
}

td.iro03{
 background-color:#f0f8ff;
}

td.iro04{
 background-color:#ffeaea;
}

td.iro05{
 background-color:#7fffd4;
}

td.iro06{
 background-color:#dcfcf1;
}

td.iro07{
 background-color:#dcdcdc;
}

td.iro08{
 background-color:#f5f5f5;
}

td.iro09{
 background-color:#fff8dc;
}

td.iro10{
 background-color:#f4b3c2;
}

td.iro11{
 background-color:#e4d2d8;
}

td.iro12{
 background-color:#e5f2ff;
}

td.iro13{
 background-color:#ffe6ea;
}

td.iro14{
 background-color:#ffd5dc;
}

td.iro15{
 background-color:#ffe4e1;
}

td.iro16{
 background-color:#ffe0e0;
}

td.iro17{
 background-color:#a9a9a9;
}

td.iro18{
 background-color:#d3d3d3;
}

td.iro19{
 background-color:#66cdaa;
}

td.iro20{
 background-color:#ffe0ef;
}

td.iro21{
 background-color:#ffffff;
}

td.iro22{
 background-color:#f0f8ff;
}

td.iro23{
 background-color:#1e90ff;
}

td.iro24{
 background-color:#003366;
}

.iro25 {
  background-color: #3A6FB8 !important; /* 他のスタイルに負けないよう !important をつけると確実です */
  text-align: center;
  font-weight: bold;
}

td.iro26{
 background-color:#9BBBE2;
}

.iro27 {
  background-color: #bcddff !important; /* 他のスタイルに負けないよう !important をつけると確実です */
  text-align: center;
  font-weight: bold;
}

/*----align="left"の代替----表組を横に並べるときに使用。<div class="yoko_table">と</div>で２つの表組を挟む----*/

.yoko_table{
    display: flex;
    align-items: flex-start;
}



/*----<td valign="****">の代替----表組の天地位置を調整する----<td valign="top">と</td>で指定----*/



/*----↓1行目のベースラインを揃える。よくわからない----*/
.baseline {
 vertical-align:baseline;
}

	
.style {
  vertical-align: top;
}



/*----↓天地センター----*/
.middle {
  vertical-align:middle;
}

/*----↓下寄せ----*/
.bottom {
  vertical-align:bottom;
}

/*----↓↓↓↓ページ切り替えにフェード効果を出すためのもの↓↓↓↓----*/
body {
  opacity: 0;
  transition: opacity 0.8s ease-in-out;
}

body.fade-in {
  opacity: 1;
}






/*----改行あたま落とし注意書き※文字小さい(落とし２文字)----------------------------------------------------*/

.note2 {
  font-size: 12px;
  text-indent: -2em;
  padding-left: 2em;
  margin-top: 1px;
  margin-bottom: 2px;
}

/*----改行あたま落とし注意書き※文字小さい(落とし３文字)----------------------------------------------------*/

.note3 {
  font-size: 12px;
  text-indent: -3em;
  padding-left: 3em;
  margin-top: 1px;
  margin-bottom: 2px;
}

/*----改行あたま落とし注意書き※文字小さい(落とし４文字)----------------------------------------------------*/

.note4 {
  font-size: 12px;
  text-indent: -4em;
  padding-left: 4em;
  margin-top: 1px;
  margin-bottom: 2px;
}

/*----改行あたま落とし注意書き※文字小さい(落とし６文字)--------------------------------------*/

.note6 {
  font-size: 12px;
  text-indent: -6em;
  padding-left: 6em;
  margin-top: 1px;
  margin-bottom: 2px;
}

/*----改行あたま落とし注意書き※文字小さい(落とし７文字)--------------------------------------*/

.note7 {
  font-size: 12px;
  text-indent: -7em;
  padding-left: 7em;
  margin-top: 1px;
  margin-bottom: 2px;
}

/*----改行あたま落とし注意書き※文字小さい(落とし８文字)--------------------------------------*/

.note8 {
  font-size: 12px;
  text-indent: -8em;
  padding-left: 8em;
  margin-top: 1px;
  margin-bottom: 2px;
}

/*----改行あたま落とし注意書き※文字デフォルト(落とし１文字)--------------------------------------*/

.note_b_100 {
  text-indent: -1em;
  padding-left: 1em;
  margin-top: 1px;
  margin-bottom: 2px;
}

/*----改行あたま落とし注意書き※文字デフォルト(落とし1.5文字)--------------------------------------*/

.note_b_150 {
  text-indent: -1.4em;
  padding-left: 1.5em;
  margin-top: 1px;
  margin-bottom: 2px;
}

/*----改行あたま落とし注意書き※文字デフォルト(落とし２文字)--------------------------------------*/

.note_b_200 {
  text-indent: -2em;
  padding-left: 2em;
  margin-top: 1px;
  margin-bottom: 2px;
}

/*----改行あたま落とし注意書き※文字デフォルト(落とし2.25文字)--------------------------------------*/

.note_b_225 {
  text-indent: -2.25em;
  padding-left: 2.25em;
  margin-top: 1px;
  margin-bottom: 2px;
}

/* ----↓↓↓↓カーソルを合わせると色変わる見出し↓↓↓↓-------------------------------------------------- */

#menu1 li a {
    position: relative;
    padding-top: 2px;
    padding-left: 20px;
    text-decoration: none;
    color: #333;
    display: block;
    background-color: #fff;
    border-left: none;
}

#menu1 li a::before {
    content: "";
    position: absolute;
    left: 0;
    top: 50%;
    transform: translateY(-50%);
    border-top: 8px solid transparent;
    border-bottom: 8px solid transparent;
    border-left: 16px solid #EF3340; /* 通常時の三角形 */
    
    /* ★ここを追加（0.4秒かけて色が変化する） */
    transition: border-left-color 0.4s ease; 
}

#menu1 li a:hover {
    background-color: #fff;
    border-left: none;
}

#menu1 li a:hover::before {
    border-left-color: #004EA8; /* hover時の三角形の色 */
}

#menu1 ul {
    list-style: none;
    padding-left: 0;
    margin-left: 0;
}

/*----cellspacing="0"の代替----表組の間隔-上-右-下-左の順----<div class="hyo-aida01">と</div>で指定----*/

/*----<td>と</td>の内側に入れる必要があるようだ----*/

/*----↓↓↓↓まだ理解できてない。使えてないです↓↓↓↓----*/

div.hyo-aida01 { 
 margin-top:5px; margin-right:px; margin-bottom:px; margin-left:px;
}

div.hyo-aida02 { 
 margin-top:-3px; margin-right:0px; margin-bottom:0px; margin-left:-7px;
}

div.hyo-aida03 { 
 margin-top:0px; margin-right:0px; margin-bottom:0px; margin-left:-7px;
}

div.hyo-aida04 { 
 margin-top:1px; margin-right:0px; margin-bottom:0px; margin-left:-2px;
}

div.hyo-aida05 { 
 margin-top:2px; margin-right:0px; margin-bottom:-1px; margin-left:-2px;
}

div.hyo-aida06 { 
 margin-top:1px; margin-right:0px; margin-bottom:-1px; margin-left:-5px;
}

div.hyo-aida07 { 
 margin-top:-6px; margin-right:0px; margin-bottom:0px; margin-left:-1px;
}


div.hyo-aida99 {
padding: 21px 0px 10px 0px;
}

/*----↑↑↑↑まだ理解できてない。使えてないです↑↑↑↑----*/














/*----ゴミ置き場------------------------------*/
.center {
    text-align: center;
}
.center table,
.center div,
.center p {
    margin-right: auto;
    margin-left: auto;
}

