@charset "UTF-8";
/* -----------------------------------------------------------
	追従グローバルメニュー・予約検索・ベストレート保証（2026-10-19 追加）
	・PC（1025px以上）: スクロールするとグローバルメニューが上部に追従し、
	  ベストレート保証と空室検索フォームを表示する
	・タブレット/SP（1024px以下）: 下部固定ナビの「宿泊予約」の上にベストレート保証を表示する
	・館ごとの色は :root の変数で切り替える
----------------------------------------------------------- */
:root {
  --gf-nav-bg: #004097;       /* 追従メニューの背景（#gnav と同じ） */
  --gf-accent: #004097;       /* 検索ボタン */
  --gf-accent-hover: #0057cd;
  --gf-row-bg: #f5f4ee;       /* 検索段の背景 */
  --gf-row-line: #c5c3b9;
  --gf-gold: #b88a52;         /* プラン一覧ボタン（btn_res と同じ） */
  --gf-gold-hover: #c6965a;
  --gf-text: #4c4c4c;
}

/* 通常時は検索段を出さない */
#header #gnav .gnav-search {
  display: none;
}

/* ===== PC: 追従時 ===== */
@media only screen and (min-width: 1025px) {
  body.is-gnavFixed #header {
    z-index: 100;
  }
  body.is-gnavFixed #header #gnav {
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    background: var(--gf-nav-bg);
    animation: gfSlideDown .3s ease;
  }
  /* メニュー段は電話番号（2行）に高さを合わせる（通常時 約57px → 約50px） */
  body.is-gnavFixed #header #gnav ul li a {
    padding-top: .4em;
    padding-bottom: .4em;
    font-size: 115%;
  }
  body.is-gnavFixed #header #gnav .gnav-search {
    display: block;
  }
  /* 右上の固定ボタン（TEL・宿泊プラン・MENU）は追従メニューの中に入れたので、追従中は出さない */
  body.is-gnavFixed .btn_fixel {
    display: none;
  }
  /* 追従中はメニューを8項目（通常6項目＋電話・MENU）で1行に並べる */
  body.is-gnavFixed #header #gnav ul {
    display: flex;
  }
  body.is-gnavFixed #header #gnav ul li {
    float: none;
    width: auto;
    min-width: 0;
    flex: 1 1 0;
  }
  body.is-gnavFixed #header #gnav ul li.btn_res {
    flex-grow: 1.3;
  }
  body.is-gnavFixed #header #gnav ul li.gnav-fixonly {
    display: block;
    flex: 0 0 auto;
  }
  /* 各項目を同じ高さにそろえ、文字を上下中央に置く */
  body.is-gnavFixed #header #gnav ul li a,
  body.is-gnavFixed #header #gnav ul li.gnav-tel > span.tel {
    height: 100%;
    box-sizing: border-box;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    white-space: nowrap;
  }
}
@keyframes gfSlideDown {
  from { transform: translateY(-100%); }
  to { transform: translateY(0); }
}

/* 追従時のみの項目（お電話でのご予約・MENU） */
#header #gnav ul li.gnav-fixonly {
  display: none;
}
#header #gnav ul li.gnav-fixonly a {
  padding-left: 1.2em;
  padding-right: 1.2em;
}
#header #gnav ul li.gnav-fixonly a:before,
#header #gnav ul li.gnav-fixonly a:after {
  display: none;
}
/* PCでは config.js が電話リンクを span.tel に置き換えるため、span にも同じ見た目を当てる */
#header #gnav ul li.gnav-tel a,
#header #gnav ul li.gnav-tel > span.tel {
  display: block;
  padding: 1em 1.2em;
  text-align: center;
  font-family: "游明朝", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
  font-size: 124%;
  color: #FFF;
  text-decoration: none;
  background: #725f49;
  transition: background .3s ease;
}
#header #gnav ul li.gnav-tel a:hover {
  background: #84705a;
}
@media only screen and (min-width: 1025px) {
  body.is-gnavFixed #header #gnav ul li.gnav-tel > span.tel {
    padding-top: .4em;
    padding-bottom: .4em;
    font-size: 115%;
  }
}
/* 「お電話でのご予約」の下に電話番号を大きめに出す（2行） */
#header #gnav ul li .gnav-tel__txt {
  display: block;
  font-size: 68%;
  line-height: 1.3;
  letter-spacing: .05em;
}
#header #gnav ul li .gnav-tel__num {
  display: block;
  font-size: 128%;
  line-height: 1.25;
  letter-spacing: .03em;
}
#header #gnav ul li .gnav-tel__num:before {
  content: "\f095";
  font-family: FontAwesome;
  margin-right: .35em;
}
#header #gnav ul li.gnav-menu a {
  border-left: 1px solid var(--gf-accent-hover);
  cursor: pointer;
}
#header #gnav ul li.gnav-menu a:hover {
  background: var(--gf-accent-hover);
}
#header #gnav ul li.gnav-menu em {
  font-style: normal;
}
#header #gnav ul li.gnav-menu em:before {
  content: "\f0c9";
  font-family: FontAwesome;
  margin-right: .45em;
}

/* 検索段 */
#header #gnav .gnav-search {
  background: var(--gf-row-bg);
  border-top: 1px solid var(--gf-row-line);
  color: var(--gf-text);
}
#header #gnav .gnav-search__inner {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 14px;
  max-width: 1400px;
  margin: 0 auto;
  padding: 6px 2%;
  box-sizing: border-box;
}
#header #gnav .gnav-search__bestrate {
  flex: none;
  line-height: 0;
}
#header #gnav .gnav-search__bestrate img {
  height: 40px;
  width: auto;
}
#header #gnav .gnav-search__ttl {
  flex: none;
  margin: 0;
  font-family: "游明朝", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
  font-size: 115%;
  white-space: nowrap;
}
#header #gnav .gnav-search__ttl:before {
  content: "\f002";
  font-family: FontAwesome;
  margin-right: .4em;
}

/* フォーム（yprox_searchForm）を1行にまとめる */
#header #gnav .gnav-search__form {
  flex: 0 1 560px;
  min-width: 0;
}
#header #gnav .gnav-search .js-yprox-searchForm {
  max-width: none;
  width: 100%;
  margin: 0;
}
#header #gnav .gnav-search .js-yprox-searchForm .inner {
  display: flex !important;
  flex-wrap: nowrap !important;
  align-items: stretch;
  gap: 6px;
  margin: 0 !important;
}
#header #gnav .gnav-search .js-yprox-searchForm .inner > * {
  margin: 0 !important;
}
#header #gnav .gnav-search .js-yprox-searchForm .inner .js-yprox-searchForm__wrpCheckInn {
  flex: 1 1 230px !important;
  width: auto !important;
  min-width: 0;
}
#header #gnav .gnav-search .js-yprox-searchForm .inner .js-yprox-searchForm__wrpAdults,
#header #gnav .gnav-search .js-yprox-searchForm .inner .js-yprox-searchForm__wrpNights,
#header #gnav .gnav-search .js-yprox-searchForm .inner .js-yprox-searchForm__wrpRooms {
  flex: 0 0 78px !important;
  width: 78px !important;
}
#header #gnav .gnav-search .js-yprox-searchForm .inner input[type="text"],
#header #gnav .gnav-search .js-yprox-searchForm .inner select {
  height: 36px !important;
  min-height: 0 !important;
  font-size: 100% !important;
  background-color: #fff !important;
  color: var(--gf-text) !important;
}
#header #gnav .gnav-search .js-yprox-searchForm .inner button {
  flex: 0 0 104px;
  height: 36px;
  padding: 0;
  font-size: 100%;
  background: var(--gf-accent);
  border: none;
  cursor: pointer;
}
#header #gnav .gnav-search .js-yprox-searchForm .inner button:hover {
  background: var(--gf-accent-hover);
}
#header #gnav .gnav-search .js-yprox-searchForm .inner button:before {
  content: "\f002";
  margin-right: .4em;
}
/* カレンダーはメニューの下に出す */
#header #gnav .gnav-search .flatpickr-calendar.static {
  top: calc(100% + 6px);
  z-index: 10;
}

/* リンク */
#header #gnav .gnav-search__lnk {
  flex: none;
  display: flex;
  align-items: center;
  gap: 12px;
  white-space: nowrap;
}
#header #gnav .gnav-search__lnk a {
  color: var(--gf-text);
  text-decoration: none;
  font-size: 92%;
}
#header #gnav .gnav-search__lnk a.btn_plan {
  display: inline-block;
  background: var(--gf-gold);
  color: #fff;
  padding: 0 1.2em;
  line-height: 36px;
  font-size: 100%;
  transition: background .3s ease;
}
#header #gnav .gnav-search__lnk a.btn_plan:hover {
  background: var(--gf-gold-hover);
}
#header #gnav .gnav-search__lnk a.lnk_change:before {
  content: "\f138";
  font-family: FontAwesome;
  margin-right: .3em;
}
#header #gnav .gnav-search__lnk a.lnk_change:hover {
  text-decoration: underline;
}
/* 幅が狭いPCでは補助的な要素を省いて1行に収める */
@media only screen and (max-width: 1279px) {
  #header #gnav .gnav-search__ttl,
  #header #gnav .gnav-search__lnk a.lnk_change {
    display: none;
  }
}

/* ===== タブレット/SP: 宿泊予約ボタンの上のベストレート保証 ===== */
.fixbestrate-sp {
  position: fixed;
  right: 6px;
  bottom: 70px; /* JS で下部固定ナビの高さに合わせて上書き */
  width: 52%;
  max-width: 260px;
  z-index: 98;
  line-height: 0;
  box-shadow: 0 1px 6px rgba(0, 0, 0, 0.35);
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: opacity .4s ease, transform .4s ease, visibility .4s;
}
.fixbestrate-sp img {
  width: 100%;
  height: auto;
}
body.is-fixnavShow .fixbestrate-sp {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}
/* メニューを開いている間は隠す */
body.fix_active .fixbestrate-sp {
  opacity: 0;
  visibility: hidden;
}
@media only screen and (min-width: 1025px) {
  .fixbestrate-sp {
    display: none !important;
  }
}
