body {
}

/* モーダル全体 */
.modal-main-original {
    display: none;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100vh;
    z-index: 8;
}

/* 背景グレー */
.modal-bk-original {
    position: absolute;
    background-color: #d3d3d3;
    opacity: 0.5;
    height: 100vh;
    width: 100%;
}

/* モーダルメイン */
.modal-contents-original {
    position: absolute;
    background-color: #fff;
    border-radius: 10px; /*角丸*/
    padding: 20px;
    top: 50%;
    left: 50%;
    transform: translate(-50%,-50%);
    z-index: 9;

}

dialog::backdrop {
    background: rgba(0,0,40,0.5);
}


/*

<div class="modal-main-original">
    <div class="modal-bk-original"></div>
        <div class="modal-contents-original">
            --モーダルで表示したい内容--       
    </div>
</div>

*/