/*
<?php
    require_once("gs_function.php");
    header('Content-Type: text/css; charaset=utf-8'); 
    //header(‘Content-Type: text/css; charset=shift-jis’);//ブラウザにphpをcssと認識させる。
?>
*/
charset "UTF-8";
<style type="text/css">
    {}
    /* 全体のヘッダーとフッター start */
    div#header-01
    {
        position:fixed;
        /*
        color: #606468;
        background-color:black;
        */
        color: #f0f0f0;
        background-color:#7fbfff;
        width:100%;
        height:20%;
        top:0px;
        border-bottom: 3px solid #696969; /* ヘッダーの境界線（下部）を指定する */
        box-shadow:0 7px 100px 2px #808080; /* 影を指定（[右][下][ぼかし][広がり][影の色]） */
        z-index:-10;/* 表示順序 */
    }
    div#footer-01
    {
        position:fixed;
        /*
        color: #606468;
        background-color:black;
        */
        color: #f0f0f0;
        background-color:#7fbfff;
        width:100%;
        height:20%;
        bottom:0px;
        /* background-image: url("cherry.PNG");  *//* フッターの背景画像を指定する */
        border-top: 3px solid #696969; /* フッターの境界線（上部）を指定する */
        z-index:-10;/* 表示順序 */
    }
    div#header-01-margin
    {
       height:20%;
       width:100%;
    }
    /*
    @media screen and (max-width: 1099px) 
    {
        div#header-01
        {
            height:15%;
        }
        div#footer-01
        {
            height:12%;
        }
        div#header-01-margin
        {
           height:15%;
        }
    }
    */
    /* 全体のヘッダーとフッター end */
    
    /* メッセージ */
    .normal-message-01
    {
        color:black;
    }
    .error-message-01
    {
        color:red;
        margin:5px;
        font-size:20px;
        font-weigth:bold;
    }
</style>