こんにちは。
iOSでは背景画像の固定についてのご相談です。

background-attachment:fixed;
background-size:cover;

この二つを使うと固定されないバグがあるようですが、検索すると、疑似要素を背景に固定するという解決方法をよく見ます。
参照： https://y-com.info/contents/?p=5941

しかし、色々試したのですが、私のやり方では、どうしてもうまくいかず、こちらに相談にあがりました。

【やりたいこと】

セクションごとに背景画像を固定にして、パララックス風に見せたいと思いカスタマイズしています。

・1番上の室内の写真のセクションと「ごあいさつ」というセクションを横幅いっぱいにして表示

・そのセクションの背景画像を固定

・セクションには別のdivを含み、文章を見せる

PCのChromeではうまくのですが、iphoneではうまくいきません。
body::beforeに入れると何の画像も表示されず（背景にはきちんと入ってはいるみたいですが）、
セクションに::beforeを入れると、contentなのか、後ろに画像が全面表示されてしまい、ヘッダーメニューなどにも被って使えなくなってしまいます。

Cocoonのdivの構成上不可能なのでしょうか？？
何か解決方法ご存じの方がいらっしゃいましたら、教えていただけますと幸いです。

【スマホでうまくいってないCSS】

@media screen and (min-width:834px) {
.gal-aisatsu{
background: center/cover no-repeat;
background-image:url( );
background-attachment:fixed;
background-repeat: no-repeat;
background-position:right;
background-size:cover;
margin-right: calc(50% - 50vw);
margin-left: calc(50% - 50vw);
padding-right: calc(50vw - 50%);
padding-left: calc(50vw - 50%);
text-shadow: 0 0 15px #333, 0 0 10px #333,0 0 5px #333;
}
}

@media screen and (max-width:834px) {

.gal-aisatsu::before{
content: "";
display: block;
position: fixed;
top: 0;
left: 0;
z-index: -99;
width: 100%;
height: 100%;
background: url("https://gallery-piednu.com/wp-content/uploads/2020/10/gal-c-sp.png") center no-repeat;
background-size: auto;
background-size: cover;

}

}

【サイト】
https://gallery-piednu.com/pied-nu/

ID/PASS：test