@charset "UTF-8";
/*********************************************************************

	会場利用・料金ページ（/rental/）専用スタイル
	2026-07 デザイン刷新（モバイルファースト・BEM）

*********************************************************************/

.rentalPage {
  color: #eaeaea;
  line-height: 1.8;
}

.rentalPage .mainTitle01 {
  padding: 1.8em 0 1.2em;
}

/* セクション共通
----------------------------------------------*/
.rentalSection {
  padding: 0 0 3.5em;
  scroll-margin-top: 70px;
}

.rentalSection:nth-of-type(odd) {
  background: #211816;
}

.rentalSection__lead {
  max-width: 760px;
  margin: 0 auto 1.5em;
  text-align: center;
  font-size: 0.95rem;
}

.rentalSection__note {
  max-width: 760px;
  margin: 1.5em auto 0;
  font-size: 0.82rem;
  color: #bdbdbd;
  text-align: center;
}

/* イントロ（非日常感漂う秘密基地）
----------------------------------------------*/
.rentalIntro {
  background:
    linear-gradient(rgba(20, 10, 10, 0.55), rgba(28, 28, 28, 0.9)),
    url(/images/rental/img_rental_image01.jpg) center center no-repeat;
  background-size: cover;
  padding: 0 0 2.5em;
}

.rentalIntro__lead {
  max-width: 760px;
  margin: 0 auto 1.5em;
  padding: 0 10px;
  text-align: center;
  font-size: 0.95rem;
  text-shadow: 0 1px 3px rgba(0, 0, 0, 0.8);
}

/* できること／できないこと */
.rentalCheck {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
  max-width: 860px;
  margin: 2em auto 0;
}

.rentalCheck__list {
  margin: 0;
  padding: 1.2em 1.5em 1.4em;
  border-radius: 6px;
  box-sizing: border-box;
}

.rentalCheck__list--ok {
  background: rgba(51, 81, 104, 0.88);
}

.rentalCheck__list--ng {
  background: rgba(104, 62, 68, 0.88);
}

.rentalCheck__list dt {
  font-size: 1.15rem;
  font-weight: bold;
  text-align: center;
  padding: 0 0 0.8em;
}

.rentalCheck__list dd {
  position: relative;
  margin: 0;
  padding: 0.35em 0 0.35em 1.6em;
  font-size: 0.92rem;
}

.rentalCheck__list dd::before {
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  position: absolute;
  left: 0;
}

.rentalCheck__list--ok dd::before {
  content: '\f058'; /* check-circle */
  color: #8fc1e8;
}

.rentalCheck__list--ng dd::before {
  content: '\f057'; /* times-circle */
  color: #e0a1a8;
}

@media (min-width: 768px) {

  .rentalCheck {
    grid-template-columns: 1fr 1fr;
    gap: 24px;
  }

}

/* ページ内ナビ（スティッキー）
----------------------------------------------*/
.rentalNav {
  position: sticky;
  top: 0;
  z-index: 100;
  background: rgba(28, 28, 28, 0.95);
  border-bottom: 1px solid rgba(222, 156, 8, 0.4);
  backdrop-filter: blur(4px);
  -webkit-backdrop-filter: blur(4px);
}

.rentalNav__list {
  list-style: none;
  display: flex;
  gap: 4px;
  max-width: 1140px;
  margin: 0 auto;
  padding: 0 10px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.rentalNav__list::-webkit-scrollbar {
  display: none;
}

.rentalNav__list a {
  display: block;
  padding: 0.9em 0.9em;
  color: #eaeaea;
  font-size: 0.85rem;
  white-space: nowrap;
  text-decoration: none;
  border-bottom: 2px solid transparent;
  transition: color 0.2s, border-color 0.2s;
}

.rentalNav__list a:hover {
  color: #de9c08;
  border-bottom-color: #de9c08;
}

/* 料金
----------------------------------------------*/
.rentalSection--price {
  background: linear-gradient(180deg, #1c1c1c 0%, #380000 15%, #380000 90%, #1c1c1c 100%);
}

.rentalHighlight {
  max-width: 760px;
  margin: 0 auto 1.5em;
  padding: 1em 1.2em;
  border: 1px solid #de9c08;
  border-radius: 6px;
  background: rgba(222, 156, 8, 0.08);
  color: #f5d9a0;
  text-align: center;
  font-size: 0.92rem;
}

.priceGrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 20px;
  margin: 2em 0 0;
}

.priceCard {
  background: rgba(0, 0, 0, 0.35);
  border: 1px solid rgba(255, 255, 255, 0.15);
  border-top: 3px solid #de9c08;
  border-radius: 6px;
  padding: 1.4em 1.4em 1.6em;
  box-sizing: border-box;
}

.priceCard__name {
  font-size: 1.3rem;
  text-align: center;
  margin: 0 0 0.3em;
  font-feature-settings: "palt";
  font-family: 'Cardo', "Sawarabi Mincho", "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
  -webkit-font-smoothing: antialiased;
}

.priceCard__time {
  text-align: center;
  font-size: 0.85rem;
  color: #bdbdbd;
  margin: 0 0 1em;
  padding: 0 0 0.8em;
  border-bottom: 1px dotted rgba(255, 255, 255, 0.3);
}

.priceCard__rows {
  margin: 0 0 0.8em;
}

.priceCard__row {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1em;
  padding: 0.4em 0;
  margin: 0;
}

.priceCard__label {
  font-size: 0.9rem;
  color: #bdbdbd;
}

.priceCard__price {
  font-size: 1.45rem;
  font-weight: bold;
  color: #fff;
}

.priceCard__price small {
  font-size: 0.75rem;
  font-weight: normal;
  color: #bdbdbd;
}

.priceCard__table {
  width: 100%;
  border-collapse: collapse;
  margin: 0 0 0.8em;
  font-size: 0.92rem;
}

.priceCard__table th,
.priceCard__table td {
  padding: 0.55em 0.5em;
  border-bottom: 1px solid rgba(255, 255, 255, 0.15);
  text-align: center;
}

.priceCard__table thead th {
  color: #de9c08;
  font-size: 0.82rem;
  font-weight: normal;
  letter-spacing: 1px;
}

.priceCard__table tbody th {
  font-weight: bold;
}

.priceCard__table tbody td {
  font-weight: bold;
  color: #fff;
}

.priceCard__note {
  font-size: 0.8rem;
  color: #bdbdbd;
  margin: 0 0 1em;
}

.priceCard__figure {
  margin: 0 0 1em;
}

.priceCard__figure img {
  width: 100%;
  height: auto;
  border-radius: 4px;
}

.priceCard__uses {
  border: 1px solid rgba(255, 255, 255, 0.2);
  border-radius: 4px;
  padding: 0.9em 1.1em 1em;
}

.priceCard__usesTitle {
  font-size: 0.8rem;
  color: #de9c08;
  letter-spacing: 1px;
  margin: 0 0 0.5em;
}

.priceCard__uses ul {
  list-style: none;
  margin: 0;
  padding: 0;
}

.priceCard__uses li {
  position: relative;
  padding: 0.25em 0 0.25em 1.2em;
  font-size: 0.88rem;
}

.priceCard__uses li::before {
  content: '・';
  position: absolute;
  left: 0;
  color: #de9c08;
}

.rentalNotes {
  list-style: none;
  max-width: 760px;
  margin: 2em auto 0;
  padding: 0;
}

.rentalNotes li {
  position: relative;
  padding: 0.35em 0 0.35em 1.4em;
  font-size: 0.85rem;
  color: #d5d5d5;
}

.rentalNotes li::before {
  content: '\f05a'; /* info-circle */
  font-family: 'Font Awesome 5 Free';
  font-weight: 900;
  position: absolute;
  left: 0;
  color: #de9c08;
}

@media (min-width: 768px) {

  .priceGrid {
    grid-template-columns: repeat(2, 1fr);
    gap: 24px;
    align-items: start;
  }

}

/* 利用例タブ
----------------------------------------------*/
.usageTabs {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 8px;
  margin: 0 0 1.5em;
  padding: 0;
}

.usageTabs__button {
  appearance: none;
  border: 1px solid rgba(255, 255, 255, 0.3);
  border-radius: 50px;
  background: rgba(0, 0, 0, 0.3);
  color: #eaeaea;
  font-size: 0.85rem;
  font-family: inherit;
  padding: 0.55em 1.1em;
  cursor: pointer;
  transition: all 0.25s;
}

.usageTabs__button:hover {
  border-color: #de9c08;
  color: #de9c08;
}

.usageTabs__button.is-active {
  background: #de9c08;
  border-color: #de9c08;
  color: #1c1c1c;
  font-weight: bold;
}

.usagePanel {
  display: none;
  grid-template-columns: 1fr;
  gap: 12px;
  max-width: 1024px;
  margin: 0 auto;
}

.usagePanel.is-open {
  display: grid;
}

.usagePanel a {
  display: block;
  border-radius: 4px;
  overflow: hidden;
}

.usagePanel img {
  display: block;
  width: 100%;
  height: auto;
  transition: transform 0.3s ease, opacity 0.3s ease;
}

.usagePanel a:hover img {
  transform: scale(1.02);
  opacity: 0.9;
}

@media (min-width: 768px) {

  .usagePanel {
    grid-template-columns: repeat(2, 1fr);
    gap: 16px;
  }

}

/* フロアマップ（cameraPoint配置は style.css を継続利用）
----------------------------------------------*/
.rentalPage .sectionFloorMap {
  background: #1c1c1c url(/images/rental/bg_floormap01.jpg) center center no-repeat;
  background-size: cover;
}

.rentalPage .floorMapBox {
  margin: 0 auto;
}

.rentalPage .floorMapBox > img {
  width: 100%;
  height: auto;
}

/* 基本設備
----------------------------------------------*/
.equipGrid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 16px;
}

.equipGroup {
  background: rgba(255, 255, 255, 0.04);
  border: 1px solid rgba(255, 255, 255, 0.12);
  border-radius: 6px;
  padding: 1.1em 1.3em 1.3em;
}

.equipGroup__title {
  font-size: 1rem;
  color: #de9c08;
  margin: 0 0 0.6em;
  padding: 0 0 0.5em;
  border-bottom: 1px solid rgba(222, 156, 8, 0.35);
}

.equipGroup__list {
  list-style: none;
  margin: 0;
  padding: 0;
}

.equipGroup__list li {
  position: relative;
  padding: 0.3em 0 0.3em 1.2em;
  font-size: 0.9rem;
}

.equipGroup__list li::before {
  content: '・';
  position: absolute;
  left: 0;
  color: #de9c08;
}

.equipGroup__list a {
  color: #8fc1e8;
  text-decoration: underline;
}

@media (min-width: 768px) {

  .equipGrid {
    grid-template-columns: repeat(2, 1fr);
    gap: 20px;
    align-items: start;
  }

}

/* オプション
----------------------------------------------*/
.optionBlock {
  max-width: 860px;
  margin: 0 auto 2.5em;
}

.optionBlock__title {
  font-size: 1.15rem;
  text-align: center;
  margin: 0 0 1em;
  padding: 0 0 0.5em;
  border-bottom: 2px solid #de9c08;
  font-feature-settings: "palt";
  font-family: 'Cardo', "Sawarabi Mincho", "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
}

.optionList {
  list-style: none;
  margin: 0;
  padding: 0;
}

.optionList__item {
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  gap: 1em;
  padding: 0.65em 0.2em;
  border-bottom: 1px dotted rgba(255, 255, 255, 0.25);
  font-size: 0.92rem;
}

.optionList__name a {
  color: #8fc1e8;
  text-decoration: underline;
}

.optionList__price {
  white-space: nowrap;
  font-weight: bold;
  color: #fff;
}

/* お支払い方法
----------------------------------------------*/
.paymentList {
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 12px;
  margin: 0 0 1.5em;
  padding: 0;
}

.paymentList__item {
  border: 1px solid rgba(255, 255, 255, 0.35);
  border-radius: 50px;
  padding: 0.6em 1.5em;
  font-size: 0.95rem;
  background: rgba(255, 255, 255, 0.05);
}

/* キャンセル
----------------------------------------------*/
.cancelBlock {
  max-width: 860px;
  margin: 0 auto 2.5em;
}

.cancelBlock__title {
  font-size: 1.15rem;
  text-align: center;
  margin: 0 0 1em;
  padding: 0 0 0.5em;
  border-bottom: 2px solid #de9c08;
  font-feature-settings: "palt";
  font-family: 'Cardo', "Sawarabi Mincho", "ヒラギノ明朝 ProN W3", "HiraMinProN-W3", "HG明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "MS 明朝", serif;
}

.cancelTable {
  width: 100%;
  border-collapse: collapse;
  font-size: 0.9rem;
}

.cancelTable th,
.cancelTable td {
  padding: 0.75em 0.8em;
  border: 1px solid rgba(255, 255, 255, 0.2);
  text-align: left;
}

.cancelTable thead th {
  background: rgba(222, 156, 8, 0.15);
  color: #f5d9a0;
  text-align: center;
}

.cancelTable tbody th {
  background: rgba(255, 255, 255, 0.05);
  font-weight: bold;
  width: 45%;
}

.cancelBlock__figure {
  margin: 1.5em 0;
}

.cancelBlock__figure img {
  width: 100%;
  height: auto;
  border-radius: 4px;
}

.oazukariCase {
  margin: 1.5em 0 0;
}

.oazukariCase dt {
  font-weight: bold;
  color: #f5d9a0;
  padding: 0.8em 0 0.3em;
}

.oazukariCase dd {
  margin: 0;
  padding: 0 0 0.5em 1em;
  font-size: 0.9rem;
  border-left: 2px solid rgba(222, 156, 8, 0.4);
}

/* 最下部CTA
----------------------------------------------*/
.rentalCta {
  background: linear-gradient(180deg, #1c1c1c 0%, #241a10 100%);
  padding: 3em 0;
  text-align: center;
}

.rentalCta__text {
  margin: 0 0 1.5em;
  font-size: 0.95rem;
}

.rentalCta__text a {
  color: #de9c08;
  text-decoration: underline;
}

.rentalCta__line {
  display: inline-block;
  background: #06C755;
  color: #fff;
  font-weight: bold;
  font-size: 1.05rem;
  padding: 1em 2.5em;
  border-radius: 50px;
  text-decoration: none;
  transition: opacity 0.2s, transform 0.2s;
}

.rentalCta__line:link,
.rentalCta__line:visited {
  color: #fff;
  text-decoration: none;
}

.rentalCta__line:hover {
  opacity: 0.85;
  transform: translateY(-2px);
}