.modal-window {
   display: none;
   width: 800px; /* ★ */
   height: 460px; /* ★ */
   padding: 10px; /* ★ */
   background: #ffffff;
   position: fixed;
   top: 55%; /* ★ */
   left: 50%;
   transform: translate(-50%, -50%);
   z-index: 100;
 }
 
 #modal-overlay {
   display: none;
   width: 100%;
   height: 100%;
   background: #000000;
   z-index: 99;
   position: fixed;
   top: 0;
   left: 0;
   opacity: 0.3;
 }
 
 .modal-open {
  a {
     display: block;
     margin:0 auto;
     width: 76px;
     height: 20px;
     line-height: 20px;
     border-radius: 8px;
     background: #3f51b5;
     box-shadow: 0 3px 6px #00000029;
     color: #fff;
     text-align:center;
     cursor: pointer;
   }
 }
 
 .modal-close {
  a {
     position:absolute;
     top: 90%;
     left: 50%;
     transform: translate(-50%, -50%);
     display: inline-block;
     width: 176px;
     height: 48px;
     line-height: 48px;
     border-radius: 8px;
     background: #c46e35;
     box-shadow: 0 3px 6px #00000029;
     color: #fff;
     text-align:center;
     cursor: pointer;
   }
 }
 
  .modal-content {
   text-align: center;
   width: 760px; /* ★ */
   height: 400px; /* ★ */
   overflow: scroll;
   margin: 0 auto;
 }

 .modal__main-title {
   font-weight: 700;
   font-size: 24px;
 }

 .modal__sub-title {
   font-size: 20px;
   font-weight: 700;
   &:nth-child(n + 2) {
     margin-top: 40px;
   }
 }