@charset "UTF-8";

.modal-overlay {
  overflow-y: auto;
  padding-top: calc(28 / 16 * 1rem);
}

.modal-overlay::before {
  content: none;
}

.modal-bg {
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
}

.modal-wrapper {
  max-width: 793px;
  max-width: calc(793 / 16 * 1rem);
  position: relative;
}

.modal-container {
  overflow-y: initial;
}

.p-sub-works__slick {
  padding: 0;
}

.modal-close {
  transform: translate(50%, -50%);
}

/* 768px以上の閉じるボタン */
.modal-close2 {
  display: none;
}

/* 768px以上の場合 */
@media (min-width: 768px) {
  .modal-overlay {
    overflow-y: auto;
    padding-top: calc(56 / 16 * 1rem);
  }
  
  /* 768px未満の閉じるボタン */
  .modal-close1 {
    display: none;
  }

  .modal-close2 {
    display: block;
  }

}