常連

`<p>menu</p>`というのが見当たりませんが、質問者さんが想像する動作は以下のような動作でしょうか？
```HTML
<!DOCTYPE html>
<html lang="ja">
<head>
    <meta charset="utf-8">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <link rel="stylesheet" href="https://cdn.jsdelivr.net/jquery.meanmenu/2.0.6/meanmenu.min.css">
    <link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.min.css">
    <title>RWD</title>
    <style type="text/css">
        /*１----------------------------------------------------------------------------------*/
        /*common*/

        body { /*初期設定、余計なmargin,paddingを0に*/
            font-size: 14px;
            font-family: Verdana, sans-serif;
            margin: 0;
            padding: 0;
            color: #F2F2F2;
            background: #F2F2F2;
            /*初期設定*/
        }

        p { /*行間がゆったりする*/
            line-height: 2;
        }

        .container {
            /*ここで90％の意味はmysiteという上の文字や写真、写真のコメントなどをかこんでいて
              左右に一定の空きができる*/
            width: 90%;
            margin: 0 auto;
        }

        header {
            /*背景画像*/
            background-image: url("https://placehold.jp/ed76ae/ffffff/150x150.png?text=../img/background.jpg");
            background-repeat: no-repeat;
            background-attachment: fixed; /*背景を固定している*/
            background-position: center; /*背景が中央に設定される*/
            background-size: cover; /*背景画像をちゃんと表示*/
            padding-bottom: 50px; /*ここでpaddingを設定したからsectionのpaddingが無効に*/
        }

        /*aburasoba_main トップの背景*/
        .aburasoba_main {
            background-color: black;
            /*margin: 10px;*//*ここにマージンを入れるとblackの余白を入れられる*/
        }

        .aburasoba_main_about img {

            display: block;
            margin-left: auto;
            margin-right: auto;
            max-width: 100%;
        }

        /*aburasoba_main トップの背景のウィンドウを小さくしたときに表示させたいやつ*/
        .aburasoba_main2 {
            background-color: black;
            /*margin: 10px;*//*ここにマージンを入れるとblackの余白を入れられる*/
            padding-left: 50px;
            padding-right: 50px;
        }

        .aburasoba_main_about2 img {

            display: block;
            margin-left: auto;
            margin-right: auto;
            max-width: 100%;
        }

        /*header-mobile-menuはアイコン右寄せ*/
        .mobile-menu {
            float: right;
            font-size: 24px;
            cursor: pointer;
        }

        .pc-menu {
            display: block; /*要素の表示形式をしていするっぽい、ブロック要素を表示,,*/
            /*46行目にheader-pc-menuを見えない設定をして、ここで820px以上いくとここで表示させる*/
            list-style: none;
            padding: 10px;
            margin: 0;
            /*余計なマージンパディング取る、*/
            float: center; /*mysiteも入っているpc-menuの中に右にする設定*/
        }

        .pc-menu > li {
            display: inline-block; /*横にする設定*/
            width: 60px;
            text-align: center;
            cursor: pointer;
        }

        /*sita ...imgと指定すれば画像が指定できた*/
        .sita img {
            display: block;
            height: 90px;
            margin: 0 auto;
            width: 160px;
        }

        /*レスポンシブデザインの3本線の設定*/
        .mean-container a.meanmenu-reveal span {
            display: block;
            background: #cccccc;
            height: 3px;
            margin-top: 3px;
        }

        /*テキストの枠組みの設定*/
        .box {
            margin: 2em 0; /*線？*/
            margin: 50px; /*左右余白*/
        }

        .box .box-title {
            font-size: 1.2em;
            background: rgba(51, 51, 51, 0.85);
            padding: 4px;
            text-align: center;
            color: #cccccc;
            font-weight: bold;
            letter-spacing: 0.05em;
        }

        .box p {
            padding: 15px 20px;
            margin: 0;
            background: rgba(51, 51, 51, 0.85);
            color: #cccccc;
        }

        /*レスポンシブルデザイン設定①*/
        /*幅の大きさが変わる設定*/
        /*画面が570px以下になったとき*/
        @media (max-width: 414px) {
            .pc-menu {
                color: #cccccc;
            }

            .aburasoba { /*アイコンを消す*/
                display: none;
            }

            /*.pull-right*/
            .right-side {
                float: right;
                padding-left: 5%;
            }

            /*.pull-left*/
            .left-side {
                float: left;
                padding-right: 5%;
            }

            .news .container {
                display: flex;
                justify-content: space-between; /*均等に余白が空く設定*/
            }

            .news .item { /*newsに入っている画像と文字に対して30%*/
                width: 30%;
            }

            .news .item img { /*画像が30％だとちゃんと見えないので画像だけ100%に*/
                width: 100%;
            }

            .aburasoba_main_about img {
                display: none;
            }

        }

        /*画面が570px以上になったとき
        min-widthが〇〇以上、max-widthが〇〇までという認識*/
        @media (min-width: 414px) {
            .container {
                width: 414px;
            }

            .mobile-menu { /*アイコンを消す*/
                display: none;
            }

            .aburasoba_main_about2 img {
                display: none;
            }

        }

        /*

        /*footer*/

        footer {
            text-align: center;
            padding: 10px 0;
        }

        /* 追加ここから */
        .aburasoba {
            text-align: center;
        }

        .pc-menu {
            text-align: center;
        }

        /* 追加ここまで */
    </style>
</head>
<body>
<header>
    <div class="aburasoba_main">
        <div class="aburasoba_main_about">
            <img src="https://placehold.jp/3d4070/ffffff/150x150.png?text=img/wallpaper.jpg">
        </div>
    </div>
    <div class="aburasoba_main2">
        <div class="aburasoba_main_about2">
            <img src="https://placehold.jp/3d4070/ffffff/150x150.png?text=img/wallpaper.jpg">
        </div>
    </div>
    <div class="container">
        
        <ul class="pc-menu">
            <li>Menu</li>
            <li>Menu</li>
            <li>Menu</li>
        </ul>
        <h1 class="aburasoba">油そば池袋</h1></div>
    <div class="box">
        <div class="box-title">About BANKARA</div>
        <p>“元気を食べてもらいたい ──”<br> これが「ばんから」の原点であり、創業以来の精神です。<br>
            麺、スープ、具。ラーメンというシンプルな料理ゆえ、これまで幾多もの苦労や苦難にぶつかるたびに、全力で向き合いながら“最高の一杯” を追い求めてきました。そのスタンスは、今も変わることはありません。<br>
            「おいしかったよ」<br> このひと言がうれしくて、私たちは常に考え、工夫を凝らし、試行錯誤を繰り返しながら、日々おいしさに磨きをかけています。<br></p></div>
</header>
<footer>
    <div class="sita"><img src="https://placehold.jp/3d4070/ffffff/150x150.png?text=img/footer.png"></div>
</footer>
<script src="https://code.jquery.com/jquery-3.2.1.min.js"></script>
<script src="https://cdn.jsdelivr.net/jquery.meanmenu/2.0.6/jquery.meanmenu.js"></script>
<script>
    $(function () {
        $("div.container").meanmenu({});
    });
</script>
</body>
</html>
```

回答編集履歴