/* ポップアップ全体を画面いっぱいにする */
.popup {
 display: none;
 /* 初期は非表示 */
 position: fixed;
 top: 0;
 left: 0;
 width: 100%;
 height: 100%;
 background-color: rgba(0, 0, 0, 0.8);
 /* 背景を半透明の黒に */
 z-index: 9999;
 /* 最前面に表示 */
}

/* ポップアップのコンテンツ */
.popup-content {
 position: absolute;
 top: 50%;
 left: 50%;
 transform: translate(-50%, -50%);
 background-color: white;
 padding: 20px;
 border-radius: 10px;
 text-align: center;
 width: 70%;
 max-width: 400px;
}

/* 閉じるボタン */
.close-popup {
 margin: 0.8em auto 0;
 padding: 0.8em 3em;
 background-color: #ff4d4d;
 color: white;
 border: none;
 border-radius: 5px;
 cursor: pointer;
}