/* モーダルの背景 */
.modal {
display: none;
position: fixed;
z-index: 999;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: rgba(0,0,0,0.8);

/* ここで中央配置 */
justify-content: center; /* 横方向中央 */
align-items: center;     /* 縦方向中央 */
}

/* モーダル内の画像 */
.modal-content {
max-width: 95%;
max-height: 95%;
border: 2px solid #fff;
}

.close {
position: absolute;
top: 10px;
right: 10px;
color: #fff;
font-size: 30px;
cursor: pointer;
}