画面を小さくした時に2つ目の画像が文章に重なってしまう。
画像の隣に文章を表示する形で合計3つ縦に並べたいのですが画面を小さくした時に2つ目の画像が文章に重なってしまいます。どう修正すればよろしいでしょうか。

<!DOCTYPE html>
<html lang="ja">
<head>
  <meta charset="utf-8">
  <title>あいうえお商店</title>
  <link href="css/bootstrap.min.css" rel="stylesheet">
  <link type="text/css" rel="stylesheet" href="css/bootstrap-timepicker.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script>
  <script src="js/bootstrap.min.js"></script>
  <style type="text/css">
    section{
      width: 80%;
      margin: 0 auto;
    }
    p{
       width: 45%;
    }
    img{
      width: 50%;
    }
    .right-p{
      padding-left: 5%;
      float: right;
    }
    .left-p{
      padding-right: 5%;
      float: left;
    }
  </style>

</head>
<body>
  <section>
      <img src="GAZOU.JPG">
      <p class="right-p">1aaaaaaaaaaaaaaaaaavaaavaaaaaaaaaaaa
        aaaaaaaaaaaaaaaaaavaaavaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
        aaaaaaaaaaaaaaaaaavaaavaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
        aaaaaaaaaaaaaaaaaavaaavaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
        aaaaaaaaaaaaaaaaaavaaavaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
        aaaaaaaaaaaaaaaaaavaaavaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
      </p>
  </section>
  <section>
      <img src="GAZOU.JPG">
      <p class="left-p">2aaaaaaaaaaaaaaaaaavaaavaaaaaaaaaaaaa
        aaaaaaaaaaaaaaaaaavaaavaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
        aaaaaaaaaaaaaaaaaavaaavaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
        aaaaaaaaaaaaaaaaaavaaavaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
        aaaaaaaaaaaaaaaaaavaaavaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
        aaaaaaaaaaaaaaaaaavaaavaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
      </p>
  </section>
  <section>
      <img src="GAZOU.JPG">
      <p class="right-p">3aaaaaaaaaaaaaaaaaavaaavaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
        aaaaaaaaaaaaaaaaaavaaavaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
        aaaaaaaaaaaaaaaaaavaaavaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
        aaaaaaaaaaaaaaaaaavaaavaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
        aaaaaaaaaaaaaaaaaavaaavaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
        aaaaaaaaaaaaaaaaaavaaavaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa
      </p>
  </section>
  <p>bbb</p>
</body>
</html>