Bootstrap4におけるDrawers.jsのドロップダウン内のリストの位置について

現状

Drawers.jsでドロップダウンメニューは実現できています。
DREAMWEAVERでのプレビュー（chrome、Firefox Developer Edition）、さらにサーバーに上げて閲覧してPC上でブレイクポイントを変えても問題なくメニューは展開されています。
しかし実機（iPhone6s）になると展開されたメニューがドロップダウンの真下に来ず、下の方に離れて表示されてしまいます

この展開されたメニューがドロップダウンの真下（画像で言えばDELIVERY GROUPの真下）に来るように解決したいです。
ご存知の方いらっしゃいましたらよろしくお願いいたします。

<head>内には下記を読み込んでいます。 <script src="js/jquery-3.3.1.min.js"></script> <script src="js/popper.min.js"></script> <link href="css/bootstrap-4.3.1.css" rel="stylesheet"> <link rel="stylesheet" href="css/drawer.min.css"> <script src="js/iscroll.js"></script> <script src="js/drawer.min.js"></script>

HTML
1<body class="drawer drawer--right drawer--navbarTopGutter" style="padding-top: 100px">
2
3<header class="drawer-navbar drawer-navbar--fixed" role="banner">
4
5<div class="drawer-navbar-header">
6<a class="drawer-brand" href="#"><img src="img/ra_class6_logo.png" width="70" height="50" alt="logo"></a>
7<button type="button" class="drawer-toggle drawer-hamburger">
8<span class="sr-only">toggle navigation</span><span class="drawer-hamburger-icon"></span>
9</button>
10</div>
11
12<nav class="drawer-nav" role="navigation">
13<ul class="drawer-menu">
14    
15<li class="drawer-dropdown">
16<a class="drawer-menu-item"  href="#" data-toggle="dropdown" role="button" aria-expanded="false">
17DELIVERY GROUP<span class="drawer-caret"></span></a>
18    <ul class="drawer-dropdown-menu dropdown-menu">
19  <li><a class="drawer-dropdown-menu-item" href="#">SEPTEMBER</a></li>
20    <li><a class="drawer-dropdown-menu-item" href="#">OCTOBER</a></li>
21  <li><a class="drawer-dropdown-menu-item" href="#">NOVEMBER</a></li>
22</ul>
23</li>
24<li class="drawer-dropdown">
25<a class="drawer-menu-item" data-target="#" href="#" data-toggle="dropdown" role="button" aria-expanded="false">
26    ORDER SHEET<span class="drawer-caret"></span></a>
27    <ul class="drawer-dropdown-menu dropdown-menu">
28<li><a class="drawer-dropdown-menu-item" href="#">FOR SHOP</a></li>
29<li><a class="drawer-dropdown-menu-item" href="#">FOR CUSTOMER</a></li>
30</ul>
31</li>
32    <li><a class="drawer-menu-item" href="#">ONLINE STORE</a></li><li><a class="drawer-menu-item" href="#">CONTACT US</a></li>
33
34</ul>
35</nav>
36
37
38
39</header>
40
41<script>                                                                                                                                    
42      $(document).ready(function() {                                                                                                               
43    $('.drawer').drawer();
44                                                                         
45    $('.drawer-dropdown').on('show.bs.dropdown', function(){                                                                                       
46      $(this).addClass("open");                                                                                                                    
47    });
48    $('.drawer-dropdown').on('hide.bs.dropdown', function(){                                                                                       
49      $(this).removeClass("open");                                                                                                                 
50    });
51      });
52    </script>
53        
54        <script>$(document).ready(function() {
55
56  
57</script>
58</body>