@media screen and (max-width:800px) {
    
    header ul {
        display: none;
    }

    li#SPMenu {
        text-align:center;
    }

}

@media screen and (max-width:800px) {

    /****サイト本体****/
    #main {
        /*アニメーション*/
        -webkit-transition: all 0.3s ease 0s;
        transition: all 0.3s ease 0s;
        /*配置*/
        width: 100%;
        position: absolute;
        right: 0;
    }

    /****メニュー全体****/
    #menu {
        /*配置*/
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        pointer-events: none;
        z-index: 100;
    }

        /****メニュー開閉ボタン****/
        #menu div {
            /*アニメーション*/
            -webkit-transition: all 0.3s ease 0s;
            transition: all 0.3s ease 0s;
            /*デザイン*/
            width: 37px;
            height: 37px;
            background: rgba(200,200,200,1);
            /*配置*/
            overflow: hidden;
            position: absolute;
            top: 20px;
            right: 0;
        }

        #menu .menuopen {
            /*デザイン*/
            color: rgba(255,255,255,1);
            font-size: 20px;
            /*配置*/
            display: block;
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0;
            left: 0;
            pointer-events: auto;
        }

        #menu .menuclose {
            /*デザイン*/
            color: rgba(255,255,255,1);
            font-size: 20px;
            /*配置*/
            display: none;
            width: 100%;
            height: 100%;
            position: absolute;
            top: 0;
            left: 0;
            pointer-events: auto;
        }

        /****メニュー一覧****/
        #menu ul {
            /*アニメーション*/
            -webkit-transition: all 0.3s ease 0s;
            transition: all 0.3s ease 0s;
            /*デザイン*/
            
            width: 50%; /*#menu ul(メニュー一覧)の幅*/
            /*配置*/
            position: absolute;
            top: 0;
            right: -50%; /*#menu ul(メニュー一覧)の幅*/
            list-style:none;
            margin:0;
        }

        #menu li {
            /*デザイン*/
            padding: 10px;
            color: rgba(0,0,0,1);
            border-bottom: 1px rgba(255,255,255,1) solid;
            /*配置*/
            pointer-events: auto;
            background: #67a8e2;
        }

        /****メニューオープン時****/
        #menu:target ~ #main {
            right: 50%; /*#menu ul(メニュー一覧)の幅*/
        }

        #menu:target div {
            /*配置*/
            right: 50%; /*#menu ul(メニュー一覧)の幅*/
        }

        #menu:target .menuopen {
            /*配置*/
            display: none;
        }

        #menu:target .menuclose {
            /*配置*/
            display: block;
        }

        #menu:target ul {
            /*配置*/
            right: 0;
        }
}

@media screen and (max-width:800px) {

 header h1 img{
     display:none;
 }
}