/* フォント設定・余白の削除・幅と高さの初期化 */
html, body{
    font: 11pt "ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS P Gothic", sans-serif;
    margin: 0;         /* 余白の削除 */
    padding: 0;        /* 余白の削除 */
    margin:auto;
}
body {
    -webkit-text-size-adjust: 100%;
}
/* テーブルの要素の初期化 */
th, td {
    text-align: left;
    vertical-align: top;
}

/* ヘッダーの固定 */
div#header-fixed
{
    position: fixed;            /* ヘッダーの固定 */
    top: 0px;                   /* 位置(上0px) */
    left: 0px;                  /* 位置(右0px) */
    width: 100%;                /* 横の幅を100% */
    height: 100px;              /* 縦幅180px */
    margin:auto;
    z-index: 1;
}
div#header-bk {
    color: #2b4066;
    background-color: #3F51B5;
    /* Webkit系 */
    background: -webkit-gradient(linear, left top, right bottom, from(#6495ed), to(#acb4e5));
    /* Mozilla系 */
    background: -moz-linear-gradient(left, #6495ed, #acb4e5);
    /* IE10+ */
    background: -ms-linear-gradient(left,  #6495ed, #acb4e5);
    /* IE8-9 */
    -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#6495ed, endColorstr=#acb4e5, GradientType=1);
    /* IE5.5-7 */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#6495ed, endColorstr=#acb4e5, GradientType=1);
    padding:5px 0 5px;       /* 上5px、下15pxをあける */
    height:86px;              /* 縦の高さ160px */
    width:100%;                /* 横の幅を100% */
}
div#header {
    height: 100%;              /* 縦の表示領域はheader-bkと同じ */
    margin:0px auto;              /* 中央揃え */
}

div#header-bk-w {
    color: #FFFFFF;
    background-color: #0D5F99;
    /* Webkit系 */
    background: -webkit-gradient(linear, left top, right bottom, from(#0D5F99), to(#419DCD));
    /* Mozilla系 */
    background: -moz-linear-gradient(left, #0D5F99, #419DCD);
    /* IE10+ */
    background: -ms-linear-gradient(left,  #0D5F99, #419DCD);
    /* IE8-9 */
    -ms-filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0D5F99, endColorstr=#419DCD, GradientType=1);
    /* IE5.5-7 */
    filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#0D5F99, endColorstr=#419DCD, GradientType=1);
    padding:5px 0 5px;       /* 上5px、下15pxをあける */
    height:86px;              /* 縦の高さ160px */
    width:100%;                /* 横の幅を100% */
}

/* ボディの定義 */
div#body-bk{
    padding:100px 0 0 0;    /* 上に180pxを余白を取る */
}
div#body{
    margin:6px auto;
}

/* テーブル */
table {
    border: 1px #303F9F solid;
    border-collapse: collapse;
}
th {
    border: 1px #303F9F solid;
    padding: 6px;
    text-align: left;
    vertical-align: top;
    color: #212121;
    background-color: #C5CAE9;
}
td {
    border: 1px #303F9F solid;
    padding: 6px;
    background-color: #F5F5F5;
}


/***** レスポンシブ 幅の設定*****/

/* 全てに適用するCSS */
html, body, table{
    width: 576px;              /* 横の幅 */
}
div#header {
    width: 576px;              /* 横の幅 */
}
div#body{
    width: 576px;              /* 横の幅 */
}

/* ウィンドウ幅が320px以下の場合に適用するCSS */
@media screen and ( max-width:480px ){
    html, body, table{
        width: 97.5%;              /* 横の幅 */
    }
    div#header {
        width: 96.5%;              /* 横の幅 */
    }
    div#body{
        width: 97.5%;              /* 横の幅 */
    }
}

/***** ボタン *****/
input[type="button"],input[type="submit"]{
    padding:8px;
    margin-bottom: 5px;
    font-weight: bold;
    
}