@media (max-width: 768px) {
/* モバイル版ポップアップのサイズを調整 */
#js-popup-mobile {
width: 100%; /* 画面幅いっぱいに広げる */
}
#js-popup-mobile .popup-content {
width: 95%; /* 横幅をさらに広げる */
max-width: 95vw; /* 画面の95%を最大幅に設定 */
height: auto;
max-height: 95vh; /* 画面の高さの95%まで広げる */
padding: 35px; /* 余白を広げる */
position: fixed;
top: 50%;
left: 50%;
transform: translate(-50%, -50%);
background: white;
box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
text-align: center;
z-index: 1001;
}
/* モバイル版の画像を大きくする */
#js-popup-mobile img {
width: 100%; /* 画像をポップアップ内いっぱいにする */
max-width: 110%; /* さらに画像を少し大きく */
height: auto;
}
/* 閉じるボタン */
#js-popup-mobile .close-btn {
display: block;
margin: 15px auto 0;
padding: 12px 25px;
background: #333;
color: white;
border: none;
cursor: pointer;
border-radius: 5px;
font-size: 16px;
}
#js-popup-mobile .close-btn:hover {
background: #555;
}
/* 背景オーバーレイ */
#js-black-bg {
display: none;
position: fixed;
top: 0;
left: 0;
width: 100%;
height: 100%;
background: rgba(0, 0, 0, 0.5);
z-index: 1000;
}
}
