CSS background-imageで背景画像をセットした下に少し隙間ができる

CSSについてお願いします。

section: "need"とsection: "campaign"の間にほんの少し隙間が空いているように見えます。

ディベロッパーツールを見ますと、section: "need"とsection: "campaign"の間に隙間はありません。

section: "need"にはbackground-imageで背景色（白っぽい背景色）をセットしているので、
その背景色が、sectionの縦範囲いっぱいにまでひろがっていないのだと思います。
以下、コードです。

この隙間をなくすにはどうしたらよいか、アドバイスをいただけますと幸いです。

■html

<!DOCTYPE html>
<html lang="ja">
    <head>
        ※省略
    </head>
    <body>
        <!-- ヘッダーStart -->
        <header id="header" class="width_100">
            ※省略
        </header>
        <!-- ヘッダーEnd -->
        <!-- メインStart -->
        <div id="main">
            <section class="need">
                <div class="container">
                    <h2 class="need_title color_accent">
                        <span class="need_title_text">年齢に合わせたシャンプーが必要</span>
                    </h2>
                    <div class="need_contents">
                        <div class="need_contents_img fade_in_l animate__animated animate__slow">
                            <img class="" src="assets/img/exhibit-sample2.jpg" alt="年齢に合わせたシャンプー">
                        </div>
                        <div class="need_contents_text">
                            プレミアムbioシャンプーは年齢髪のために100%天然成分。地肌に潤いを与え、髪本来の輝きを引き出します。
                            <br/>
                            <br/>厳選された黒髪成分配合で髪も肌もやさしく洗浄。「若見え髪」へと導きます。
                        </div>
                    </div>
                </div>
            </section>
            <section class="campaign">
                <div class="container">
                    <h2 class="campaign_title txt_center">
                        <img class="" src="assets/img/ribbon.png" alt="初回限定キャンペーン実施中">
                    </h2>
                    <div class="campaign_image animate__animated">
                        <img class="" src="assets/img/sample_cv.png" alt="bioシャンプー">
                    </div>
                    <div class="campaign_youryo">
                        容量：200g(約1ヶ月分)
                    </div>
                    <div class="campaign_itemtitle">
                        <p class="itemtitle_main">プレミアムbioシャンプー</p>
                        <p class="itemtitle_sub">(オーガニックシャンプー)</p>
                    </div>
                    <div class="nomal_price_area">
                        <p class="nomal_price">通常：5,478円(税込)</p>
                        <p class="course">→定期コース初回</p>
                    </div>
                    <div class="syokai_price_area">
                        <span class="syokai_price philosopher">1,980</span><span class="price_en">円</span><span class="price_tax">(税込)</span>
                    </div>
                    <div class="campaign_btn">
                        <p class="btn_text">今すぐ試す▼</p>
                    </div>
                    <div class="campaign_kaiyaku_area">
                        <p class="kaiyaku">途中解約可能</p>
                        <p class="kaiyaku_desc">最低購入回数の縛りはありません</p>
                    </div>
                </div>
            </section>        
        </div>
        <!-- メインーEnd -->
        <!-- フッターStart -->
        <footer class="footer">
            ※省略
        </footer>
        <!-- フッターEnd -->                   
    </body>   
</html>

■CSS

/*ページ全体*/
body {
    font-family: "NotoSansJP Medium";
    color: #212529;
    font-size: calc(27 / 1366 * 100vw);
}

.container {
    padding: 0 calc(137 / 1366 * 100vw);
}

/*初回限定キャンペーン*/
.campaign {
    background-image: url("../img/cv.jpg");
    background-size: cover;
    padding-top: calc(40 / 1366 * 100vw);
    position:  relative;
    height: calc(818 / 1366 * 100vw);
}
.campaign_title img {
    width: calc(946 / 1366 * 100vw);
}

.campaign_image img {
    width: calc(401 / 1366 * 100vw);
    /*アニメーションで追加*/
    display: none;
}

/*必要*/
.need {
    background-image: url("../img/exhibit2.jpg");
    background-size: cover;
    padding: calc(80.6 / 1366 * 100vw) 0 calc(87 / 1366 * 100vw) 0;
    
}
.need_title {
    font-size: calc(48 / 1366 * 100vw);
    font-family: "Hannari Mincho Regular";
}
.need_title_text {
    display: inline-block;
    line-height: 1;
    border-bottom: calc(15 / 1366 * 100vw) solid #B391A2;
}
.need_contents {
    display: flex;
    justify-content: space-between;
    margin-top: calc(46.5 / 1366 * 100vw);
}
.need_contents_text {
    width: calc(612.18 / 1366 * 100vw);
}
.need_contents_img img {
    width: calc(408 / 1366 * 100vw);
}