navとh1を並列にしたいです。

現状

上記写真ではビゲーションとｈ１が2列になって配置されています。
ナビゲーションとｈ１をdivタグで囲み、display:flex;やfloatなどを試しましたが、意図した挙動にはなりませんでした。

コード

<div class="humberger">
            <input type="checkbox" name="" id="input">
                <div class="label_line"><!-- divタグで囲み、サイズ指定できるようにする -->
                    <label for="input">
                        <!-- 三本線の為のdivタグ -->
                        <div class="line"></div>
                        <div class="line"></div>
                        <div class="line"></div>
                    </label>
                </div>

                <label for="input" class="back"><div></div></label>
                <div class="nav_content">
                    <nav>
                        <ul>
                            <li class="list">
                                <span><img src="image/login.png" alt="login" class="nav_img"></span>
                                <a href="#">ログイン</a>
                            </li>
                            <li class="list">
                                <span><img src="image/cart.png" alt="cart" class="nav_img"></span>
                                <a href="#">カートを見る</a>
                            </li>
                        </ul>
                    </nav>
                </div>
                <h1>ThePromontroy</h1>
        </div>

#input{
        display: none;
    }

    .line{
        width: 20px;
        height: 3px;
        background-color: black;
        margin:3px ;
    }

    .nav_content{
        width: 200px;
        height: 500px;
        background-color:orange;
        transform: translateX(-200px);
        position: fixed;
    }

    input#input:checked ~ .nav_content{
            /* checkboxのinputが押されると紐付けたnavが開く */
           transform: translateX(0px); 
           transition:all 0.3s ease-out;
    }

    input#input:checked ~ .back{
        /* ラベルをnav以外の場所に行き渡る設定　ここでは黒い画面をタッチしたらnavが閉じる */
        position: absolute;
        width: 100%;
        height: 1500px;
        background-color: rgba(0, 0, 0, 0.6);
    }

実現したいこと

こちらのサイトのようにハンバーガーメニューとh1を並列にしたいです。
自分のコードで言うと、<label for="input">と<h1>ThePromontroy</h1>を並列にしたいです。

質問

どのような方法でナビゲーションとｈ１を並列にすることができますか？