@charset "utf-8";

/* ●内部余白、外部余白の初期化 */

*
{
  margin:0px;
  padding:0px;
}

/* ●背景画像の定義 */

body
{
  background-image:url("gazou/BACK4.png"); /* 幅32px */
  background-repeat:repeat-y;
  background-color:#ffffff;
  font-family:meiryo;
}

/* ●ボタンの文字列のフォントの定義 */

input
{
  font-family:meiryo;
}

/* ●タイトルの定義 */

div.midashi
{
  font-family:sans-selif;
/*font-size:40px;*/
  font-size:32px;
  font-weight:bold;
  border-left:solid 8px #006666;
  border-bottom:solid 3px #006666;
/*padding-left:5px;*/
  padding-bottom:4px;

  /* 改造で追加（2020/May）*/
  line-height:60px; /* 行の高さ（これを使って１行の文字列を上下中央に配置！）*/

  /* 改造で追加（2020/May）*/
  width:600px;
  margin:auto;
/*margin-left:64px;*/
/*width:928px;     */
}

/* ●固定表示エリアの定義（2020/May）*/

div.no-scroll-area
{
/*width:1068px;*/
  width:942px; /* 見出しの線が完全に隠れる最小値 */

  background-color:#ffffff;
  position:fixed; /* 固定表示を指定 */
  margin-left:63px; /* (1068-942) / 2 = 63 */

  z-index: 1; /* 流れるテキストが固定表示エリアの上に表示されないようにする */
}

/* ●オーバーラップエリアの定義（2020/May）*/

div.overlap-area
{
  /* 固定表示エリアと重なるエリアの高さを定義 */
  height:44px; // 10+22+12 = 44（= margin-top + height + margin-bottom）
}

/* ●トップリンク表の定義 */

table.p-link-tbl
{ 
  margin:auto;
  border-collapse:collapse;
  width:608px; /* 600 + 4 + 4 */
  margin-top:10px;
  margin-bottom:12px;
  font-size:7pt;

  -webkit-user-select: none; /* テキスト（文字列）を選択できないようにする */
     -moz-user-select: none; /* テキスト（文字列）を選択できないようにする */
      -ms-user-select: none; /* テキスト（文字列）を選択できないようにする */
          user-select: none; /* テキスト（文字列）を選択できないようにする */
}

/* ●トップリンク表の各列の書式 */

td.top-index1
{
  height:22px;
  text-align:left;
  padding-left:12px;
  border-left:solid 5px #666666;
/*width:1px;*/ /* ピクセル数はいくつでもよいが、指定は必要らしい？ */
  font-family:sans-serif; /* ゴシック系のフォント */
  font-weight:bold;
  color:#666666;
}

/* ●トップリンク表の書式定義 */

span.menu /* マウスオーバーしていない時のリンクの定義 */
{
  text-decoration:none; /* 下線なし */
}

span.menu:hover /* マウスオーバー時のリンクの定義 */
{
  color:blue;     /* フォントの色を青色にする                          */
  cursor:pointer; /* aタグでリンク指定していなくても指マークを表示する */
}

a.menu2 /* マウスオーバーしていない時のリンクの定義 */ /* ☆未使用 */
{
  text-decoration:none; /* 下線なし */
  color:#666666;
}

a.menu2:hover /* マウスオーバー時のリンクの定義 */ /* ☆未使用 */
{
  color:blue;     /* フォントの色を青色にする                          */
  cursor:pointer; /* aタグでリンク指定していなくても指マークを表示する */
}

/* ●リンクボタン（画面右下）の書式定義（2020/May）（↓ここから）*/

.message
{
  position:relative;
  cursor:pointer; /* aタグでリンク指定していなくても指マークを表示する */
}

.message span.remark
{
  display:none; /* 非表示状態にする */
}

/* マークにマウスポインターをかざしたときの設定 */
.message a:hover span.remark, 
.message:hover   span.remark
{
  display:block; /* 非表示から表示状態に変更する */

  /* メッセージ表示エリアの大きさの定義 */
  width: 152px;
  height:30px;

  /* メッセージの背景の設定 */
  background-color:#EEFFEE;  /* 背景色     */
  border: 1px solid #CCCCCC; /* 背景の枠線 */

  /* メッセージの文字の設定 */
  color: #000000;   /* 文字色（黒）*/
  font-size:10pt;   /* 文字サイズ  */
  font-weight:bold; /* 太字        */
  line-height:30px; /* 行の高さ（これを使って１行の文字列を上下中央に配置！）*/

  /* メッセージの表示位置の指定 */
  position:absolute;
  top: 0px;    /* 基準（マーク）からの垂直位置 */
  left:-176px; /* 基準（マーク）からの水平位置 */

  text-align:center;
}
/* リンクボタン（画面右下）の書式定義（↑ここまで）*/


/* ●背景変更ボタンの文言 */

div.haikei-mongon
{
  text-align:center;
  padding-top:10px;
  padding-bottom:10px;
  font-size:14px;
  font-weight:bold;
  color:blue;
  width:200px; /* android端末で画面を縦方向にしたときの対応（フォントサイズが優先され表示が大きかった）*/
  margin:auto; /* android端末で画面を縦方向にしたときの対応（フォントサイズが優先され表示が大きかった）*/
}

/* ●背景変更ボタンの定義 */

input.BG-buton
{
  width:120px;
  height:30px;
  font-size:13px;
  margin-left:2px;
  margin-right:2px;
}

/* ●目次の定義 */

a.mokuji:hover,a.mokuji2:hover /* 目次の下位レベルの項目にマウスオーバーしたときの書式 */
{
  text-decoration:underline; /* 下線    の表示 */
  cursor:pointer;            /* 指マークの表示 */
}

a.mokuji
{
  text-decoration:none; /* 装飾なし   */
  color:#000000;        /* 文字色：黒 */
}

a.mokuji2
{
  color:#0000ff; /* 文字色：青 */
}

span.mokuji-daikoumoku /* 目次の大項目の書式定義 */
{
  color:blue;                /* 文字色：青 */
  text-decoration:underline; /* 下線あり   */
  cursor:pointer;
}

/* ●項目番号の書式定義 */

a.anchor
{
  padding-top:44px; /* 44px = 10+22+12（トップリンク表の高さ）*/
  font-weight:bold;

/*display:block;   */
/*padding-top:56px;*/
/*padding-top:64px;*/
/*margin-top:-70px;*/
}

/* ●アニメの定義（ここから）*/

.marquee
{
/*background-color: #cee4ae;*/ /* 背景色 */
  width: 180px;                /* 横幅   */
  overflow: hidden; /* 要素のボックスからはみ出た部分は隠して見えなくする */
}

.marquee > span
{
  display: inline-block;
  white-space: nowrap; /* ソース中の連続する半角スペース、タブ、改行を一つの半角スペースにまとめて表示 */
  padding-left: 100%;
  animation-name: MarqueeScroll;
  animation-timing-function: linear;   /* アニメーションが変化する速度：一定の割合で直線的に再生 */
  animation-duration: 5s;              /* １周するのにかかる時間 */
  animation-iteration-count: infinite; /* 繰り返す回数           */
}

@keyframes MarqueeScroll
{
  from { transform: translateX(0);}
  to { transform: translateX(-100%);}
}
/* アニメの定義（ここまで）*/

/* ●写真（小）の表定義 */

table.closeup
{
  border-collapse:collapse;
  margin:auto;
  width:608px;
}

td.closeup1a /* 写真（小）の表の列定義 */
{
  text-align:center;
  line-height:0; /* ★これをしないと下側に空きができる */
  border:solid 4px #0000ff;
  padding-top:8px;    /* (282 * 2) + (4 * 3) = 576 */ /* 608 - 576 = 32 */ /* よって左右の空白は、32/4 = 8 */ /* top   も 8px で合わせる */
  padding-bottom:8px; /* (282 * 2) + (4 * 3) = 576 */ /* 608 - 576 = 32 */ /* よって左右の空白は、32/4 = 8 */ /* bottomも 8px で合わせる */
}

/* ●ファン速度を自動制御する場合の基準温度表 */

table.zone
{
  border-collapse:collapse; /* 表のセルとセルの間の間隔をなくす                                 */

/*width:850px;*/            /* 表全体の横幅                                                     */
  width:480px;              /* 表全体の横幅                                                     */

  margin:auto;              /* 表を中央に配置                                                   */
  font-family:sans-serif;   /* 表内の文字のフォント（Webフォントのゴシック系フォントを使用する）*/
  font-size:11pt;           /* 表内の文字のフォントサイズ                                       */
}

td.zone1 /* ゾーン構成表の１列目独自の定義 */
{
  width:50%; /* 表の横幅全体に占める１列目の割合を指定する */
}

td.zone2 /* ゾーン構成表の２列目独自の定義 */
{
  width:50%; /* 表の横幅全体に占める２列目の割合を指定する */
}

td.zone1,td.zone2 /* ,td.zone3 */ /* ゾーン構成表の１、２、３列目の共通定義 */ /* ３列目なし */
{
  vertical-align:center;    /* セル内の文字をセルの上下中央に配置する */
  height:34px;              /* セルの高さ                             */
  border:solid 2px #000000; /* 表の枠線の太さ、色                     */
  padding-left:12px;        /* セル内の文字の先頭（左側）を空ける     */
  text-align:left;          /* セル内の文字を左寄せにする             */
}

/* ●箇条書きの書式定義 */

ul.kajyogaki
{
  margin:auto;
  width:528px;
  line-height:1.3;
  padding-left:20px;
}
li.kajyogaki
{
  padding-bottom:8px;
}