@charset "UTF-8";


/**---------- ある一つの用途に特化した部品の設定 ----------**/


/**
 * ページ上部のタイトル
 */
h1.title {
    margin:  0.7em  0px;
    padding: 0.4em 20px;
    color:            #F5F5F5;     /* 白系統の色 */
    background-color: #8F3D17;     /* 茶系統の色 */
    font-style:  italic;
    font-size:   150%;
    font-family: 'Comic Sans MS',
                  cursive;
}


/**
 * タイトル横のメッセージ欄
 */
div.message {
    position: relative;
    top:         -2.5em;
    margin-left: 300px;
    color:            #F5F5F5; /* 白系統の色 */
    background-color: #8F3D17; /* 茶系統の色 */
    font-size:   90%;
    font-family: monospace;
}


/**
 * ページの注釈事項
 */
div.annotation {
    position: absolute;
    top:      0em;
    right:    0px;
    padding-right: 190px;  /* コンテンツバーに合わせた設定 */
    font-size: 80%;
    font-family: monospace;
    text-align: right;
}


/**
 * 更新履歴のキャプション
 */
h2.updates {
    position: relative;            /* ul.updatesより前面表示するための設定 */
    z-index: 3;                    /* 念のため設定 */
    font-family: 'Comic Sans MS',
                  cursive;
}


/**
 * 更新履歴のリスト
 */
ul.updates {
    border: 1px solid #8F3D17;   /* 茶系統の色 */
    margin-top:  -2.5em;         /* キャプションとボーダが重なるように設定 */
    margin-left:   32px;         /* キャプションとボーダが重なるように設定 */
    padding-top:  2.5em;         /* heightに関するブラウザ間の差異をなくすために */
                                 /* 0.0emにしたいがデザイン上不可能              */
    padding-left:   0px;         /* widthに関するブラウザ間の差異をなくす設定 */
    width:  200px;
    height: 25em;
    font-family: monospace;
    
}


/**
 * 更新履歴のアイテム
 */
ul.updates li {
    margin: 0.0em 0.0px 1.3em 30px;
}
ul.date li {
    margin-left: -20px;
    list-style:  none;
}


/**
 * コンテンツのキャプション
 */
h2.contents {
    position: absolute;
    top:   3.5em;
    right:  25px;
    margin:  0.0em 0px;
    padding: 0.2em 0px;
    width: 150px;
    color:            #F5F5F5;     /* 白系統の色       */
    background-color: #FF6000;     /* オレンジ系統の色 */
    font-family: 'Comic Sans MS',
                  cursive;
}


/**
 * コンテンツのリスト
 */
ul.contents {
    position: absolute;
    top: 10em;
    right: 25px;
    width: 130px;
    padding-left: 0px;       /* こうしないと表示がずれる@IE */
    font-family: monospace;
}


/**
 * コンテンツのアイテム
 */
ul.contents li {
    list-style:    none;
    margin-top:    6px;  /* こうしないと表示が崩れる@IE */
    margin-bottom: 20px;
    cursor: default;
}


/**
 * コンテンツアイテムのリンクとロールオーバー
 */
ul.contents a {
    padding: 5px;
    cursor:  default;
}
ul.contents a:hover {
    background-color: #FF6000;  /* オレンジ系統の色 */
}

/* 表示中のページが対象コンテンツに関するページの場合 */
ul.contents span {
    padding: 5px;
    background-color: #F4E6CC;  /* ベージュ系統の色 */
    border: 1px solid #FF6000;  /* オレンジ系統の色 */
}


/**
 * トップページのコンテンツ内容
 */
div.main_of_top {
    position: relative;
    top:  -19.2em;
    margin-left:  250px;
    margin-right: 180px;
    padding: 0em 20px;
    border: 1px solid #8F3D17;  /* 茶系統の色 */
    border-right-style: none;
    height: 18em;
    text-align: left;
    overflow:   scroll;    /* Opera向けの八苦 */
    overflow-x: visible;
    overflow-y: scroll;
    margin-bottom: -18em;  /* 次の要素を更新履歴直下に配置する */
}


/**
 * トップページ以外のコンテンツ内容
 */
div.main {
    margin: 20px 180px 100px 20px;
}


/**
 * 著作権表示用のフッタ
 */
div.footer {
    padding: 10px 20px;
    border-top:    5px solid #8F3D17;  /* HRの代替 茶系統の色 */
    font-family: 'Comic Sans MS',
                  cursive;
}




/**---------- CGI用の設定 ----------**/


/**
 * アンケート結果出力用テーブル（人気投票CGIの投票結果にも使用）
 */
table.input_params {
    width:      500px;
}
table.input_params th,
table.input_params td {
    padding:        2px 10px;
    font-size:      90%;
}
table.input_params th {
    text-align:     right;
    vertical-align: middle;
    width:          130px;
}


/**
 * 人気投票CGIの投票数のバー
 */
div.graph_bar {
    background-color: #FFBE7D;             /* 肌色系統の色 */
    border:           1px solid #8F3D17;   /* 茶系統の色   */
    text-align:       center;
}


/**
 * いちげんスクリプト埋め込みDIVタグ用
 */
div.itigen {
    margin:     60px 240px 60px 60px;
    padding:    1em  20px;
    border:     1px  solid #8F3D17;    /* 茶系統の色 */
    height:     33em;
    overflow-y: scroll;
    min-width:  565px;
}
