i phone、i padだけメインビジュアルの上に隙間ができる

はじめまして。

スライダーのメインビジュアルの件で質問させて頂きます。
スマホ表示の際、
PC windows10、スマホ androidでは、
メインビジュアルは正常に表示されているのですが、
i phone11proとi padで確認したところ、
メインビジュアルの上に謎の隙間ができてしまいます。

Mac環境だと、上に謎の隙間ができてしまっているように思います。

https://micropreneur.xsrv.jp/

ul id="slide_wrapp"
直下に画像を入れるときちんと表示されるので、

li class="slide_item"
に問題があると思うのですが、
Mac環境での検証ツールが見れない為、
色々試しましたが、
解決できませんでした。

お分かりになる方いらっしゃいましたら、
ご教授頂ければ幸いです。

どうぞよろしくお願い致します。

page-top.php⇓

PHP
1<?php get_header(); ?>
2<!-- <img src="https://micropreneur.xsrv.jp/wp-content/uploads/2021/06/mv3_sp.jpg"> -->
3<div class="start">
4    <p><img src="https://micropreneur.xsrv.jp/wp-content/uploads/2021/06/Luire_logo_gray.svg"></p>
5</div>
6<div class="container">
7    <?php if ( !is_paged()): ?><section class="mv">
8        <ul id="slide_wrapp"><li class="slide_item"><img src="https://micropreneur.xsrv.jp/wp-content/uploads/2021/06/mv1-2.jpg" alt="痩身・ダイエットの理想の身体" class="mv_pc"><img src="https://micropreneur.xsrv.jp/wp-content/uploads/2021/06/mv1_sp.jpg" alt="痩身・ダイエットの理想の身体" class="mv_sp"></li>
9            <li class="slide_item"><img src="https://micropreneur.xsrv.jp/wp-content/uploads/2021/06/mv2-2.jpg" alt="フェイシャルエステ" class="mv_pc"><img src="https://micropreneur.xsrv.jp/wp-content/uploads/2021/06/mv2_sp.jpg" alt="フェイシャルエステ" class="mv_sp">
10                <p class="s-fade-text1">登別・室蘭<span class="s_letter">の</span>女性<span class="s_letter">の</span><br>コンプレックス<span class="s_letter">を</span>魅力<span class="s_letter">に</span>変<span class="s_letter">え</span><br>本来<span class="s_letter">の</span>美しさ<span class="s_letter">を</span>引き出すエステ</p>
11            </li>
12            <li class="slide_item"><img src="https://micropreneur.xsrv.jp/wp-content/uploads/2021/06/mv3-2.jpg" alt="ウェディングエステ" class="mv_pc"><img src="https://micropreneur.xsrv.jp/wp-content/uploads/2021/06/mv3_sp.jpg" alt="ウェディングエステ" class="mv_sp">
13                <p class="s-fade-text2">非日常感<span class="s_letter">の</span>心地よい空間<span class="s_letter">と</span><br>ファミリー<span class="s_letter">のような</span><br>アットホーム<span class="s_letter">さを</span>感<span class="s_letter">じられる</span><br>エステサロン</p>
14            </li>
15        </ul>
16        <p class="sp_logo"><img src="https://micropreneur.xsrv.jp/wp-content/uploads/2021/06/Luire_logo_sp.svg"></p>
17        <p class="scroll_sp"><a href="#contents" class="over">SCROLL</a></p>
18    </section>

css
1#slide_wrapp {
2    position: relative;
3    overflow: hidden;
4	margin:0;
5  padding:0;
6  list-style:none;
7  font-size:0;
8} 
9
10#slide_wrapp .slide_item {
11    opacity: 0;
12    -webkit-transform: scale(1);
13        -ms-transform: scale(1);
14            transform: scale(1);
15    -webkit-transition: opacity 2s linear, -webkit-transform 7.5s linear;
16    transition: opacity 2s linear, -webkit-transform 7.5s linear;
17    -o-transition: opacity 2s linear, transform 7.5s linear;
18    transition: opacity 2s linear, transform 7.5s linear;
19    transition: opacity 2s linear, transform 7.5s linear, -webkit-transform 7.5s linear;
20    position: relative;
21    z-index: 1;
22	list-style-type: decimal;
23	padding-left: 0;
24}
25
26#slide_wrapp .slide_item:not(:first-child) {
27    position: absolute;
28}
29
30#slide_wrapp .slide_item.show_{
31    opacity: 1;
32}
33
34#slide_wrapp .slide_item.zoom_ {
35    -webkit-transform: scale(1.1);
36        -ms-transform: scale(1.1);
37            transform: scale(1.1);
38}
39
40#slide_wrapp .slide_item img {
41    display: block;
42}
43::marker{
44	display: none!important;
45}
46
47img.mv_sp {
48    display: none!important;
49}
50
51.s-fade-text1 {
52    position: absolute;
53    top: 36%;
54    /* right: 53%; */
55    width: 50%;
56    text-align: center;
57    background: -webkit-gradient(linear, left top, right top, from(#7ca1e2), to(#e287b7));
58    background: -o-linear-gradient(left, #7ca1e2, #e287b7);
59    background: linear-gradient(to right, #7ca1e2, #e287b7);
60    -webkit-background-clip: text;
61    -webkit-text-fill-color: transparent;
62    font-size: 2.5rem;
63    line-height: 2;
64}
65
66.s-fade-text1 span,
67.s-fade-text2 span {
68    font-size: 2rem;
69    vertical-align: baseline;
70    padding-left: 1px;
71}
72
73.s-fade-text2 {
74    position: absolute;
75    top: 30%;
76    left: 50%;
77    width: 50%;
78    text-align: center;
79    background: -webkit-gradient(linear, left top, right top, from(#7ca1e2), to(#e287b7));
80    background: -o-linear-gradient(left, #7ca1e2, #e287b7);
81    background: linear-gradient(to right, #7ca1e2, #e287b7);
82    -webkit-background-clip: text;
83    -webkit-text-fill-color: transparent;
84    font-size: 2.5rem;
85    line-height: 2;
86}
87
88.swiper-slide-active .s-fade-text1 {
89    -webkit-animation: slideTextFade 1.75s ease 1s 2 normal;
90            animation: slideTextFade 1.75s ease 1s 2 normal;
91}
92
93@-webkit-keyframes slideTextFade {
94
95    0%,
96    25% {
97        opacity: 0;
98    }
99
100    100% {
101        opacity: 1;
102    }
103}
104
105@keyframes slideTextFade {
106
107    0%,
108    25% {
109        opacity: 0;
110    }
111
112    100% {
113        opacity: 1;
114    }
115}
116
117img.mv_sp {
118    display: block!important;
119/* 	height: 100vh; */
120	object-fit: unset;
121/* 	object-fit: cover; */
122	height: calc(var(--vh, 1vh) * 100);
123}
124		
125		img.mv_pc, p.s-fade-text1, p.s-fade-text2 {
126    display: none!important;
127}

javascript
1window.addEventListener('load', function () {
2   sliderStart();
3});
4
5function sliderStart() {
6
7    const slide = document.getElementById('slide_wrapp');      //スライダー親
8    const slideItem = slide.querySelectorAll('.slide_item');   //スライド要素
9    const totalNum = slideItem.length - 1;                     //スライドの枚数を取得
10    const FadeTime = 3000;                                     //フェードインの時間
11    const IntarvalTime = 8000;                                 //クロスフェードさせるまでの間隔
12    let actNum = 0;                                            //現在アクティブな番号
13    let nowSlide;                                              //現在表示中のスライド
14    let NextSlide;                                             //次に表示するスライド
15
16    // スライドの1枚目をフェードイン
17    slideItem[0].classList.add('show_');
18
19    // 処理を繰り返す
20    setInterval(() => {
21        if (actNum < totalNum) {
22
23            let nowSlide = slideItem[actNum];
24            let NextSlide = slideItem[++actNum];
25
26            //.show_削除でフェードアウト
27            nowSlide.classList.remove('show_');
28            // と同時に、次のスライドがズームしながらフェードインする
29            NextSlide.classList.add('show_');
30            //フェードアウト完了後、.zoom_削除
31            setTimeout(() => {
32                nowSlide.classList.remove();
33            }, FadeTime);
34
35        } else {
36
37            let nowSlide = slideItem[actNum];
38            let NextSlide = slideItem[actNum = 0];
39
40            //.show_削除でフェードアウト
41            nowSlide.classList.remove('show_');
42            // と同時に、次のスライドがズームしながらフェードインする
43            NextSlide.classList.add('show_');
44            //フェードアウト完了後、.zoom_削除
45            setTimeout(() => {
46                nowSlide.classList.remove('zoom_');
47            }, FadeTime);
48
49        };
50    }, IntarvalTime);
51
52}
53