@charset "UTF-8";

/* default
---------------------------------------------------- */

body {
  margin: 0;
}

.sp {
  display: none;
}

.pc {
  display: block;
}

.fs-life-detail .fs-privilege-gallery {
  display: none;

}


/* main
---------------------------------------------------- */
#hilton {
  width: min(100%, 940px);
  margin: 0 auto;
  background: #41232f;

}

.hilton {
  font-family: "游明朝", "ヒラギノ明朝 ProN W3", "MS 明朝", serif;
  font-feature-settings: "palt";
  color: #fff;
}

img.hilton_img {
  width: 100%;
}



/* モーダル */
.modal_area {
  background: linear-gradient(to bottom, #41232d, #3b2537);
  text-align: center;
  padding: 0 0 50px 0;

}

.modal_area p {
  font-size: 34px;
  text-align: center;
  padding-bottom: 48px;
  font-weight: bold;
  color: #fff;
}


/* 横並びの画像 */
.image-row {
  display: flex;
  /* gap: 10px; */
  justify-content: space-between;
  width: min(90%, 825px);
  margin: 0 auto;
}

.image-row img {
  width: calc((100% - 40px * 2) / 3);
  margin: 0 20px 0 0;
  height: auto;
  cursor: pointer;
  /* border: 2px solid #ccc; */
  border-radius: 4px;
  transition: border-color 0.3s;
}


/* 最後の画像の右マージンを0にする */
.image-row img:last-child {
  margin-right: 0;
}

.image-row img:hover {
  border-color: #e8af52;
}

/* モーダル全体 */
.modal {
  display: none;
  /* 初期は非表示 */
  position: fixed;
  z-index: 9999;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  overflow: auto;
  background-color: rgba(0, 0, 0, 0.8);
  justify-content: center;
  align-items: center;
}

/* モーダルが表示されているときにflex化 */
.modal.show {
  display: flex;
}

/* モーダル内の画像 */
.modal-content {
  width: 290px;
  margin: 0 auto;
  border-radius: 8px;
}



/* モーダル内の画像を包む親要素 */
.modal-content-wrapper {
  position: relative;
  display: inline-block;
  /* 画像サイズに合わせる */
}

/* 閉じるボタンを画像の右上に配置 */
.close-btn {
  position: absolute;
  top: -10px;
  right: -10px;
  font-size: 28px;
  font-weight: bold;
  color: white;
  cursor: pointer;
  user-select: none;
  z-index: 10;
  background: #B3864B;
  border-radius: 50%;
  width: 29px;
  height: 29px;
  line-height: 30px;
  text-align: center;
}

.close-btn:hover {
  opacity: .7;
}








/* ---------------------------------------------------
                             SP
---------------------------------------------------- */
@media screen and (max-width: 767px) {
  .pc {
    display: none;
  }

  .sp {
    display: block;
    width: 100%;
  }

  img.hilton_img {
    width: 100%;
  }

  .fs-life-detail .fs-static-01 {
    margin: 0 0 10px;
  }




  .modal_area {
    background: linear-gradient(to bottom, #3d2533, #372942);
    text-align: center;
    padding: 10px 0;
  }


  /* モーダル内の画像 */
  .modal-content {
    width: 73vw;

  }



  .modal_area p {
    font-size: 18px;
    padding-bottom: 10px;
  }

  .image-row {
    display: block;
  }



  .image-row img {
    width: 100%;
    margin: 0 0 30px 0;
  }


  .image-row img:last-child {
    margin-bottom: 0;
  }









}