@charset "Shift_JIS";

/* ============== */
/* タイプセレクタ */
/* ============== */

body{
font-family: sans-serif;
color: #383838;  /* フォント色：黒に近いグレー */
} 

/* =============================================== */
/* IDセレクタ（一つのファイルで一度だけ使用できる）*/
/* =============================================== */

#outer {
width: 750px; /* ボックスの幅 */
padding: 10px; /* 内側の余白(上下左右) */
margin: 0 auto; /* 外側の余白（上下、左右） */
text-align: center;  /* テキストの水平位置：中央 */
}

#pagenavi {
margin-bottom: 5px;
font-size: 10pt; /* フォントサイズ */
text-align: left; /* テキストの水平位置：左 */
}

#title{
width: 700px;  /* ボックスの幅 */
border: 3px solid #336699;  /* 枠線：太さ3px、1本線、深い青紫系 */
padding: 3px 15px;  /* 内側の余白（上下、左右） */
background-color: #cce6ff;  /* 背景色：薄いブルー */
color: #003366;  /* フォント色：紺色 */
font-size: 16pt;  /* フォントサイズ */
font-weight: bold;  /* フォント太さ：強調 */
text-align: center;  /* テキストの水平位置：中央 */
}

#subtitle {
margin-top: 14px;  /* 上外側の余白 */
color: #336699; /* フォントの色：深い青紫系 */
font-size: 12pt; /* フォントサイズ */
font-weight: bold; /* フォント太さ：強調 */
}

#footer {
font-size: 10pt; /* フォントサイズ */
text-align: center;  /* テキストの水平位置：中央 */
}

/* ==================================================== */
/* クラスセレクタ（一つのファイルで何度でも使用できる） */
/* ==================================================== */

.area_title{
border: 2px solid #336699;  /* 枠線：太さ2px、1本線、深い青紫系 */
padding: 3px 15px;  /* 内側の余白（上下、左右） */
background-color: #f0f8ff;  /* 背景色：アリスブルー（薄い水色） */
font-size: 12pt;  /* フォントサイズ */
font-weight: bold;  /* フォント太さ：強調 */
text-align: center;  /* テキストの水平位置：中央 */
}

.area1{
border-left: 15px solid #336699;  /* 枠線：太さ15px、1本線、深い青紫系 */
padding: 3px;  /* 内側の余白 */
background-color: #d8eeff;  /* 背景色：水色 */
font-size: 10pt;  /* フォントサイズ */
font-weight: bold;  /* フォント太さ：強調 */
}

.area2{
padding: 3px;  /* 内側の余白 */
background-color: #f0f8ff;  /* 背景色：アリスブルー（薄い水色） */
font-size: 9pt;  /* フォントサイズ */
font-weight: bold;  /* フォント太さ：強調 */
text-align: center;  /* テキストの水平位置：中央 */
}


/* ============ */
/* 表(テーブル) */
/* ============ */

table.main {
width: 100%; /* 表の幅 */
border: 0; /* 罫線の幅 */
border-collapse: separate; /* 隣接するセルの罫線を間隔をあけて表示 */
border-spacing: 10px; /* 隣接するセルの罫線の間隔 */
}

td.left {
width: 55%; /* セルの幅：表全体の60% */
vertical-align: top;  /* テキストの垂直位置：上寄せ */
line-height: 1.2; /* 行の高さ */
}

td.right {
vertical-align: top;  /* テキストの垂直位置：上寄せ */
line-height: 1.2; /* 行の高さ */
}
