@charset "UTF-8";

/* =====================================================
  VIP ROOM
===================================================== */

.oj-viproom-page{
  background:var(--fb-bg);
  color:var(--fb-text);

  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
  font-feature-settings:"kern" 1, "liga" 1, "palt" 1;
}

/* =====================================================
  VIP HERO / IMAGE
===================================================== */

.oj-viproom-page > .oj-inside-section{
  padding-top:14px;
}

.oj-viproom-page .bar-shell > .oj-inside-section__head{
  margin-bottom:34px;
}

/* ▼ INSIDE と見出しトーン統一 */
.oj-viproom-page .oj-inside-section__eyebrow{
  margin:0 0 2px;
  font-size:8px;
  line-height:1.4;
  letter-spacing:.16em;
  color:rgba(244,243,239,.36);
  font-weight:400;
}

.oj-viproom-page .oj-inside-section__title{
  margin:0;

  font-family:var(--fb-en);
  font-size:20px;
  line-height:1.14;
  letter-spacing:.015em;

  color:rgba(244,243,239,.78);

  font-weight:400;
  font-synthesis:none;

  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}

.oj-viproom-image{
  margin:0;
  width:100%;
  aspect-ratio:1.85 / 1;
  overflow:hidden;
  background:rgba(255,255,255,.02);
}

.oj-viproom-image img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block;
}

/* =====================================================
  VIP DETAIL GRID
===================================================== */

.oj-viproom-detail-grid{
  margin-top:34px;
}

.oj-viproom-detail-grid .oj-inside-section__head{
  transform:translateY(1px);
  margin-bottom:0;
}

.oj-viproom-detail-grid .oj-inside-section__body{
  padding-top:13px;
}

.oj-viproom-detail-grid .oj-room-lead{
  margin-top:0;
  margin-bottom:10px;
}

/* ▼ ROOM TITLE も INSIDE に寄せる */
.oj-viproom-page .oj-inside-room-title{
  font-size:15px;
  line-height:1.5;
  letter-spacing:.03em;

  font-weight:400;
  font-synthesis:none;

  color:rgba(244,243,239,.82);

  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  text-rendering:optimizeLegibility;
}

/* =====================================================
  VIP RESERVE
===================================================== */

.oj-viproom-page #reserve{
  padding-top:22px;
  padding-bottom:65px;
}

.oj-viproom-page #reserve .oj-inside-meta__row{
  border-bottom:none;
}

.oj-viproom-page #reserve .oj-inside-meta__desc p:nth-of-type(3){
  margin-top:18px;
}

.oj-viproom-page #reserve .oj-inside-meta__desc p:nth-of-type(4){
  margin-top:6px;
}

/* =====================================================
  CTA REFINED（TEXT UNIFY）
===================================================== */

.oj-viproom-page #reserve .oj-inside-meta__desc a[href^="tel"]{
  display:inline-block;
  margin-top:6px;

  font-family:var(--fb-en);
  font-size:11px;
  line-height:1.8;
  letter-spacing:.04em;

  color:rgba(244,243,239,.72);
  text-decoration:none;

  border-bottom:1px solid rgba(255,255,255,.12);

  transition:opacity .4s ease, border-color .4s ease;
}

.oj-viproom-page #reserve .oj-inside-meta__desc a[href^="tel"]:hover{
  opacity:.7;
  border-color:rgba(255,255,255,.24);
}

.oj-viproom-page #reserve .oj-inside-meta__desc a[href*="hotpepper"]{
  display:inline-block;
  margin-top:6px;

  font-family:var(--fb-en);
  font-size:11px;
  line-height:1.8;
  letter-spacing:.04em;

  color:rgba(244,243,239,.56);
  text-decoration:none;

  border-bottom:1px solid rgba(255,255,255,.12);

  transition:opacity .4s ease, border-color .4s ease;
}

.oj-viproom-page #reserve .oj-inside-meta__desc a[href*="hotpepper"]:hover{
  opacity:.7;
  border-color:rgba(255,255,255,.24);
}

/* =====================================================
  SP
===================================================== */

@media (max-width:960px){

  .oj-viproom-detail-grid{
    display:flex;
    flex-direction:column;
    gap:18px;
  }

  .oj-viproom-detail-grid .oj-inside-section__body{
    padding-top:0;
  }

}

@media (max-width:768px){

  .oj-viproom-page .bar-shell > .oj-inside-section__head{
    margin-bottom:18px;
  }

  .oj-viproom-image{
    aspect-ratio:4 / 3;
  }

  .oj-viproom-detail-grid{
    margin-top:24px;
  }

  .oj-viproom-page #reserve{
    padding-top:18px;
    padding-bottom:54px;
  }

}