.fancybox__content {
    width: 90%;         /* 幅を90%に設定 */
    max-width: 500px !important;   /* 最大幅を500pxに設定 */
    max-height: 90vh;   /* 最大高さをビューポートの90%に設定 */
    min-height: 500px !important;
  }

  /* スマートフォンなど小さな画面での調整 */
  @media (max-width: 600px) {
    .fancybox__content {
      width: 95%;       /* 幅を95%に設定 */
      max-width: none;  /* 最大幅制限なし */
      min-height:auto !important;
    }
  }

  @media (max-width: 400px){
    .fancybox__content{
      padding: 0 !important;
      min-height:auto !important;
    }
  }