@charset "UTF-8";
/*---------------------------
quality.css  ガーラ・レジデンス川口 設備・仕様ページ
---------------------------*/

:root {
  /* 機能タグの座布団（ユーティリティシンク・コンロ・食洗機） */
  --q-navy: #004472;
  /* 設備名見出し */
  --q-head: #4d92a5;
  /* タブ */
  --q-tab-off: #c0dde9;
  --q-tab-on: #62abc9;
  /* 見出し帯グラデーション（中心が明るく左右が濃い） */
  --q-band-center: #2c63ac;
  --q-band-side: #143069;
  --q-text: #231815;
  --q-sub: #595757;
  --q-line: #c9d2de;
  /* セクション背景（グラデーション終点／ベタ塗り共通） */
  --q-bg: #c5eaec;
  /* 帯（ユーティリティシンク・コンロ・食洗機） */
  --q-bar-gold: #ddd0b6;
  --q-bar-ttl: #6a3906;
  --q-bar-light: #ebe8e2;
  --q-duo-bg: #efefee;
}


/*==========================
 メインビジュアル
==========================*/
#qualityMainvisual {
  position: relative;
  width: 100%;
  overflow: hidden;
  line-height: 0;
}

#qualityMainvisual img {
  width: 100%;
  height: auto;
  display: block;
}


/*==========================
 タブ
==========================*/
#qua_tabArea {
  background: #fff;
  padding: 3.4em 0 0;
}

.qua_tabs {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  gap: 18px;
  list-style: none;
}

.qua_tabs li {
  width: 300px;
}

.qua_tabs button {
  position: relative;
  display: block;
  width: 100%;
  padding: 1.05em 0.5em;
  font-family: "a-otf-ryumin-pr6n", serif;
  font-weight: 300;
  font-size: 17px;
  letter-spacing: 0.1em;
  color: var(--q-text);
  background: var(--q-tab-off);
  border: none;
  border-radius: 6px;
  cursor: pointer;
  transition: all 0.35s;
  -webkit-appearance: none;
  appearance: none;
}

.qua_tabs button:hover {
  opacity: 0.8;
}

/* ON：白罫線をボタン内側に表示 */
.qua_tabs li.is_active button {
  background: var(--q-tab-on);
  color: #fff;
}

.qua_tabs li.is_active button::after {
  content: "";
  position: absolute;
  top: 5px;
  right: 5px;
  bottom: 5px;
  left: 5px;
  border: 1px solid #fff;
  border-radius: 4px;
  pointer-events: none;
}


/*==========================
 パネル
==========================*/
.qua_panel {
  display: none;
}

.qua_panel.is_active {
  display: block;
}

.qua_wrap {
  width: 1170px;
  margin: 0 auto;
}

/* 同一背景ブロック内に2セクションを並べる場合の間隔 */
.qua_wrap.is_next {
  margin-top: 5em;
}

/* 背景 */
.qua_bgArea {
  background: linear-gradient(180deg, #ffffff 0%, #ffffff 55%, var(--q-bg) 100%);
  padding: 3.5em 0 5em;
}

.qua_bgArea.is_plain {
  background: #fff;
}

/* グラデーションの開始位置を下げた背景（COMFORT／ECO） */
.qua_bgArea.is_lowGrad {
  background: linear-gradient(180deg, #ffffff 0%, #ffffff 82%, var(--q-bg) 100%);
}

.qua_bgArea.is_tint {
  background: var(--q-bg);
}


/*==========================
 セクション見出し帯
==========================*/
.qua_secbar {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1.2em;
  background: linear-gradient(90deg,
      var(--q-band-side) 0%,
      var(--q-band-center) 50%,
      var(--q-band-side) 100%);
  color: #fff;
  padding: 0.85em 1.5em;
  margin-bottom: 2.6em;
}

.qua_secbar .en {
  font-family: "adobe-garamond-pro", serif;
  font-weight: 400;
  font-style: normal;
  font-size: 26px;
  letter-spacing: 0.16em;
  color: #fff;
  line-height: 1;
  white-space: nowrap;
}

.qua_secbar .jp {
  font-size: 15px;
  letter-spacing: 0.06em;
  line-height: 1.45;
}

/* 中見出し */
.qua_leadTtl {
  font-size: 20px;
  letter-spacing: 0.1em;
  color: var(--q-head);
  text-align: center;
  line-height: 1.7;
  margin-bottom: 1.4em;
}


/*==========================
 ヒーロー（大写真＋ピックアップ）
==========================*/
.qua_hero {
  display: flex;
  gap: 28px;
  align-items: flex-start;
}

.qua_hero_img {
  width: 55%;
  flex-shrink: 0;
}

/* 横位置の大写真（キッチン） */
.qua_hero.is_wide {
  gap: 20px;
}

.qua_hero.is_wide .qua_hero_img {
  width: 74%;
}

.qua_hero_img img {
  width: 100%;
  display: block;
}

.qua_hero_side {
  flex: 1;
}

/* 機能紹介ボックス（ユーティリティシンク） */
.qua_featBox {
  box-sizing: border-box;
}

.qua_featBox_img {
  margin-bottom: 0.9em;
}

.qua_featBox_img img {
  width: 100%;
  display: block;
}

/* 見出し（ベージュ帯） */
.qua_featBox_ttl {
  background: var(--q-bar-gold);
  font-size: 16px;
  letter-spacing: 0.08em;
  color: var(--q-bar-ttl);
  text-align: center;
  line-height: 1.5;
  padding: 0.6em 0.4em;
  margin-bottom: 0.9em;
}

.qua_featBox_txt {
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.02em;
}

/* 小見出し（罫線のみ） */
.qua_featBox_sub {
  background: none;
  border: 1px solid var(--q-text);
  font-size: 13px;
  letter-spacing: 0.04em;
  color: var(--q-text);
  text-align: center;
  line-height: 1.5;
  padding: 0.65em 0.4em;
  margin-top: 1.2em;
}

/* 機能リスト（縦積み・全幅） */
.qua_chips {
  margin-top: 8px;
  list-style: none;
}

.qua_chips li {
  background: var(--q-navy);
  color: #fff;
  font-size: 13px;
  letter-spacing: 0.02em;
  line-height: 1.5;
  text-align: center;
  padding: 0.65em 0.4em;
}

.qua_chips li + li {
  margin-top: 8px;
}


/*==========================
 4分割の帯（洗う・切る・捨てる）
==========================*/
.qua_stripTtl {
  text-align: center;
  font-size: 18px;
  letter-spacing: 0.12em;
  color: var(--q-sub);
  margin: 3em 0 1.4em;
}

.qua_strip {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 20px;
  list-style: none;
}

.qua_strip .img img {
  width: 100%;
  display: block;
}

.qua_strip .ttl {
  font-size: 15px;
  letter-spacing: 0.06em;
  color: var(--q-head);
  line-height: 1.5;
  margin: 0.9em 0 0.4em;
}

.qua_strip .txt {
  font-size: 13px;
  line-height: 1.75;
}


/*==========================
 2カラムの大ブロック（食洗機・コンロ）
==========================*/
.qua_duo {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 26px;
  margin-top: 3em;
  list-style: none;
}

.qua_duo li {
  background: var(--q-duo-bg);
  padding: 2.2em 2em;
  box-sizing: border-box;
}

/* 上段：写真＋見出し・本文 */
.qua_duo_head {
  display: flex;
  gap: 20px;
  align-items: flex-start;
}

.qua_duo .img {
  width: 48%;
  flex-shrink: 0;
}

.qua_duo .img img {
  width: 100%;
  display: block;
}

.qua_duo .txtArea {
  flex: 1;
}

.qua_duo .ttl {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 5.7em;
  background: var(--q-bar-gold);
  font-size: 17px;
  letter-spacing: 0.06em;
  color: var(--q-bar-ttl);
  text-align: center;
  line-height: 1.5;
  padding: 0.6em 0.4em;
  box-sizing: border-box;
  margin-bottom: 0.9em;
}

.qua_duo .txt {
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.02em;
}

/* 下段：機能リスト */
.qua_merit {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 8px;
  list-style: none;
  margin-top: 1.4em;
}

.qua_merit li {
  background: var(--q-navy);
  color: #fff;
  font-size: 13px;
  letter-spacing: 0.02em;
  line-height: 1.5;
  text-align: center;
  padding: 0.65em 0.4em;
  border: none;
}


/*==========================
 カードグリッド（共通）
==========================*/
.qua_grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 34px 24px;
  list-style: none;
  margin-top: 2.6em;
}

.qua_grid.col3 {
  grid-template-columns: repeat(3, 1fr);
}

.qua_grid.col2 {
  grid-template-columns: repeat(2, 1fr);
}

/* セクション先頭に置く場合 */
.qua_grid.is_top {
  margin-top: 0;
}

.qua_card_img img {
  width: 100%;
  display: block;
}

/* 大写真：左2コマ分・3行ぶんの高さを使用 */
.qua_card.is_main {
  grid-column: span 2;
  grid-row: span 3;
  overflow: hidden;
}

.qua_card.is_main img {
  width: 100%;
  height: 100%;
  min-height: 100%;
  object-fit: cover;
  object-position: center;
  display: block;
}

.qua_card_img.is_frame img {
  border: 1px solid var(--q-line);
  box-sizing: border-box;
}

/* 画像内の長文キャプション（TES床暖房）：PC時のみ表示、「image photo」の上に重ねる */
.imageCap .cap_n.qua_capNote {
  left: 0;
  right: 0;
  bottom: 1.7em;
  font-size: 10px;
  line-height: 1.45;
  letter-spacing: 0;
  text-align: left;
}

.qua_card_ttl {
  /* 2行ぶん(1.5em×2)＋下パディングの高さを確保。
     1行の見出しは上下中央に置かれ、罫線の位置が行数に関わらず揃う */
  display: flex;
  align-items: center;
  min-height: 3.45em;
  box-sizing: border-box;
  font-size: 16px;
  letter-spacing: 0.06em;
  color: var(--q-head);
  line-height: 1.5;
  margin: 0.9em 0 0.5em;
  padding-bottom: 0.45em;
  border-bottom: 1px solid var(--q-line);
}

.qua_card_txt {
  font-size: 13.5px;
  line-height: 1.8;
  letter-spacing: 0.02em;
}

.qua_card_note,
.qua_note {
  display: block;
  font-size: 11px;
  line-height: 1.7;
  color: var(--q-sub);
  margin-top: 0.5em;
}

.qua_note.is_right {
  text-align: right;
}

/* 画像なしテキストカード */
.qua_card.is_txtonly .qua_card_ttl {
  margin-top: 0;
}


/*==========================
 STRUCTURE 3カラム
 （強固な地盤と耐震基礎／かぶり厚／外壁・戸境壁）
 ※中央「かぶり厚」は図版が小さいため細めのカラム
==========================*/
.qua_str3 {
  display: grid;
  grid-template-columns: 0.91fr 0.8fr 1.29fr;
  gap: 34px 24px;
  list-style: none;
  margin-top: 0;
}

/* 図版の下端を揃えて、見出しの水平位置を合わせる */
.qua_str3 .qua_card_img {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  height: 29vw;
  max-height: 340px;
}

.qua_str3 .qua_card_img img {
  width: auto;
  height: auto;
  max-width: 100%;
  max-height: 100%;
}

.qua_str3 .qua_card_img.is_frame img {
  border: 1px solid var(--q-line);
  box-sizing: border-box;
}


/*==========================
 全幅図版（MULTIMEDIA / ECO など）
==========================*/
.qua_figure {
  margin-top: 2.6em;
}

.qua_figure img {
  width: 100%;
  display: block;
}

.qua_figure.is_first {
  margin-top: 0;
}

/* 全幅図版に添えるテキスト・キャプション（トリプルセキュリティ）
   PC用画像には見出し・本文・「概念図」が含まれるため、PC時は非表示 */
.qua_figTxt,
.qua_figCap {
  display: none;
}

.qua_figDuo {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 26px;
  align-items: start;
  margin-top: 2.6em;
}

.qua_figDuo img {
  width: 100%;
  display: block;
}

/* 図版の高さを揃えて、下のテキスト開始位置を左右で合わせる */
.qua_figDuo.is_align .qua_figDuo_img {
  position: relative;
  padding-top: 50.15%;
  /* 1023:513（縦長の図版に合わせる） */
}

.qua_figDuo.is_align .qua_figDuo_img img {
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  width: 100%;
  height: auto;
}


/*==========================
 SECURITY 下部（インターホン＋玄関ドア）
==========================*/
.qua_secLow {
  display: flex;
  gap: 24px;
  align-items: flex-start;
  margin-top: 2.6em;
}

/* 左カラムはカードグリッド1コマ分と同じ幅に揃える */
.qua_secLow_left {
  width: calc((100% - 72px) / 4);
  flex-shrink: 0;
}

/* 縦位置写真を他のカード画像と同じ高さに収める */
.qua_secLow_left .qua_card_img {
  position: relative;
  padding-top: 69%;
  /* 503:347（他カード画像と同比率） */
  overflow: hidden;
}

.qua_secLow_left .qua_card_img img {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%);
  width: auto;
  height: 100%;
}

.qua_secLow_left .qua_card + .qua_card {
  margin-top: 1.8em;
}

.qua_secLow_right {
  flex: 1;
}

.qua_secLow_right img {
  width: 100%;
  display: block;
}


/*==========================
 QUALITY（第三者機関評価）
==========================*/
.qua_certPanel {
  background: var(--q-duo-bg);
  padding: 3em 3.2em;
}

.qua_certCols {
  display: grid;
  grid-template-columns: 1fr 1fr 1.3fr;
  gap: 2.8em 2.6em;
}

/* 右カラムの埼玉県CASBEEは2行ぶんを使用 */
.qua_certSide {
  grid-column: 3;
  grid-row: 1 / 3;
}

.qua_certItem {
  display: flex;
  flex-direction: column;
}

.qua_cert_img img {
  max-width: 100%;
  height: auto;
  display: block;
}

/* 上段2点はロゴの高さを揃える（設計／建設住宅性能評価の比率 573:144 を基準） */
.qua_certItem.is_top .qua_cert_img {
  position: relative;
  padding-top: 25.13%;
  margin-bottom: 1.2em;
}

.qua_certItem.is_top .qua_cert_img img {
  position: absolute;
  bottom: 0;
  left: 50%;
  transform: translateX(-50%);
  width: auto;
  height: 100%;
  max-width: 100%;
}

/* 埼玉県CASBEEの図版は一回り小さく中央配置
   （環境性能表示＋省エネ性能ラベルの2点を縦に並べる） */
.qua_certSide .qua_cert_img.is_stack {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 16px;
}

.qua_certSide .qua_cert_img img {
  width: 55%;
  margin: 0 auto;
}

/* アイコン＋見出しを横並びにするタイプ */
.qua_cert_head {
  display: flex;
  align-items: center;
  gap: 1em;
  margin-bottom: 1.1em;
}

.qua_cert_icon {
  flex-shrink: 0;
  width: 54px;
}

.qua_cert_icon img {
  width: 100%;
  height: auto;
  display: block;
}

.qua_cert_ttl {
  font-size: 17px;
  letter-spacing: 0.05em;
  color: var(--q-head);
  line-height: 1.6;
  margin-bottom: 0.9em;
}

.qua_cert_head .qua_cert_ttl {
  margin-bottom: 0;
}

.qua_cert_txt {
  font-size: 14px;
  line-height: 1.8;
  letter-spacing: 0.02em;
}

.qua_cert_note {
  font-size: 11px;
  line-height: 1.7;
  color: var(--q-sub);
  margin: 0.6em 0 1.1em;
}


/*==========================
 ページ内注釈
==========================*/
.qua_pageNote {
  font-size: 11px;
  line-height: 1.8;
  color: var(--q-sub);
  margin-top: 2em;
}


/*==========================
 タブ（下部繰り返し）
==========================*/
.qua_tabs.is_bottom {
  margin-top: 4em;
}


/*==========================
 Tab（〜1170px）
==========================*/
@media screen and (max-width: 1170px) {

  .qua_wrap {
    width: 92%;
  }

  .qua_secbar {
    flex-wrap: wrap;
    gap: 0.4em 1.2em;
  }
}


/*==========================
 SP（〜768px）
==========================*/
@media only screen and (max-width: 768px) {

  #qua_tabArea {
    padding: 2.2em 0 0;
  }

  .qua_tabs {
    gap: 10px;
  }

  .qua_tabs li {
    width: 100%;
  }

  .qua_tabs button {
    font-size: 4vw;
    padding: 0.95em 0.5em;
  }

  .qua_bgArea {
    padding: 2.4em 0 3.4em;
  }

  .qua_wrap.is_next {
    margin-top: 3em;
  }

  .qua_secbar {
    display: block;
    text-align: center;
    padding: 0.9em 1em;
    margin-bottom: 1.8em;
  }

  .qua_secbar .en {
    display: block;
    font-size: 5.4vw;
    letter-spacing: 0.12em;
    margin-bottom: 0.3em;
  }

  .qua_secbar .jp {
    display: block;
    font-size: 3.2vw;
    letter-spacing: 0.03em;
    line-height: 1.45;
  }

  .qua_leadTtl {
    font-size: 4.4vw;
  }

  /* ヒーロー */
  .qua_hero {
    display: block;
  }

  .qua_hero_img,
  .qua_hero.is_wide .qua_hero_img {
    width: 100%;
  }

  .qua_hero_side {
    margin-top: 1.4em;
  }

  .qua_featBox_ttl {
    font-size: 3.5vw;
  }

  .qua_featBox_txt {
    font-size: 2.8vw;
    line-height: 1.75;
  }

  .qua_featBox_sub {
    font-size: 3.5vw;
  }

  .qua_chips li {
    font-size: 3.5vw;
  }

  /* 帯 */
  .qua_stripTtl {
    font-size: 4vw;
    margin: 2em 0 1em;
  }

  .qua_strip {
    grid-template-columns: repeat(2, 1fr);
    gap: 18px 12px;
  }

  .qua_strip .ttl {
    font-size: 3vw;
  }

  .qua_strip .txt {
    font-size: 2.5vw;
    line-height: 1.7;
  }

  /* 2カラム大ブロック */
  .qua_duo {
    grid-template-columns: 1fr;
    gap: 18px;
    margin-top: 2em;
  }

  .qua_duo li {
    padding: 1.3em 1.1em;
  }

  .qua_duo_head {
    display: block;
  }

  .qua_duo .img {
    width: 100%;
  }

  .qua_duo .txtArea {
    margin-top: 1em;
  }

  .qua_duo .ttl {
    min-height: 0;
    font-size: 3.5vw;
    padding: 0.7em 0.4em;
  }

  .qua_duo .txt {
    font-size: 2.8vw;
    line-height: 1.75;
  }

  .qua_merit {
    margin-top: 1em;
  }

  .qua_merit li {
    font-size: 3.3vw;
  }

  /* グリッド */
  .qua_grid,
  .qua_grid.col3,
  .qua_grid.col2 {
    grid-template-columns: repeat(2, 1fr);
    gap: 22px 12px;
    margin-top: 1.8em;
  }

  /* 大写真：SPは全幅・高さなり */
  .qua_card.is_main {
    grid-column: 1 / -1;
    grid-row: auto;
  }

  .qua_card.is_main img {
    height: auto;
    min-height: 0;
    object-fit: fill;
  }

  /* 画像内の長文キャプション（TES床暖房）はPC時のみ表示 */
  .imageCap .cap_n.qua_capNote {
    display: none;
  }

  /* SPのみ画像を少し小さく表示（マルチメディアコンセント） */
  .qua_card_img.is_spSmall img {
    width: 72%;
    margin: 0 auto;
  }

  .qua_card_ttl {
    font-size: 3.1vw;
    margin: 0.7em 0 0.4em;
  }

  .qua_card_txt {
    font-size: 2.5vw;
    line-height: 1.7;
  }

  .qua_card_note,
  .qua_note {
    font-size: 2.5vw;
    line-height: 1.6;
  }

  /* STRUCTURE 3カラム → SPは1カラム */
  .qua_str3 {
    grid-template-columns: 1fr;
    gap: 1.8em;
  }

  /* 図版は一回り小さく中央寄せ（画像 → 見出し → 本文 の順） */
  .qua_str3 .qua_card_img {
    display: block;
    height: auto;
    max-height: none;
    max-width: 82%;
    margin: 0 auto;
  }

  .qua_str3 .qua_card_img img {
    width: 100%;
    max-height: none;
  }

  /* かぶり厚は図版が小さいためさらに絞る */
  .qua_str3 .qua_card.is_spSwap .qua_card_img {
    max-width: 58%;
  }

  /* 図版 */
  .qua_figure,
  .qua_figDuo {
    margin-top: 1.8em;
  }

  .qua_figDuo {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  /* 全幅図版に添えるテキスト・キャプション（トリプルセキュリティ）はSP時のみ表示 */
  .qua_figTxt,
  .qua_figCap {
    display: block;
  }

  /* 「概念図」は画像内ではなく画像下の右端に置く */
  .qua_figCap {
    font-size: 2.4vw;
    line-height: 1.6;
    color: var(--q-sub);
    text-align: right;
    margin-top: 0.4em;
  }

  .qua_figTxt {
    margin-top: 0.9em;
  }

  .qua_figTxt_ttl {
    font-size: 3.1vw;
    letter-spacing: 0.06em;
    line-height: 1.5;
    color: var(--q-head);
    margin-bottom: 0.5em;
    padding-bottom: 0.45em;
    border-bottom: 1px solid var(--q-line);
  }

  .qua_figTxt_txt {
    font-size: 2.7vw;
    line-height: 1.75;
    letter-spacing: 0.02em;
  }

  /* SPは縦並びのため高さ揃えは解除 */
  .qua_figDuo.is_align .qua_figDuo_img {
    padding-top: 0;
  }

  .qua_figDuo.is_align .qua_figDuo_img img {
    position: static;
    transform: none;
  }

  /* SECURITY 下部 */
  .qua_secLow {
    display: block;
    margin-top: 1.8em;
  }

  .qua_secLow_left {
    width: 100%;
  }

  .qua_secLow_left .qua_card {
    max-width: 320px;
    margin-left: auto;
    margin-right: auto;
  }

  /* SPは画像を原寸比率で表示 */
  .qua_secLow_left .qua_card_img {
    padding-top: 0;
    max-width: 230px;
    margin: 0 auto;
  }

  .qua_secLow_left .qua_card_img img {
    position: static;
    transform: none;
    width: 100%;
    height: auto;
  }

  .qua_secLow_right {
    margin-top: 1.6em;
  }

  /* 第三者評価 */
  .qua_certPanel {
    padding: 2.6em 1.4em;
  }

  .qua_certCols {
    grid-template-columns: 1fr;
    gap: 3.4em;
  }

  .qua_certSide {
    grid-column: auto;
    grid-row: auto;
  }

  .qua_certItem.is_top .qua_cert_img {
    position: static;
    padding-top: 0;
    margin-bottom: 1em;
  }

  .qua_certItem.is_top .qua_cert_img img {
    position: static;
    transform: none;
    width: auto;
    height: auto;
    max-height: 130px;
    margin: 0 auto;
  }

  .qua_certSide .qua_cert_img img {
    width: 78%;
  }

  .qua_cert_icon {
    width: 44px;
  }

  .qua_cert_ttl {
    font-size: 3.5vw;
  }

  .qua_cert_txt {
    font-size: 2.7vw;
    line-height: 1.75;
  }

  .qua_cert_note {
    font-size: 2.4vw;
  }

  .qua_pageNote {
    font-size: 2.8vw;
  }

  .qua_tabs.is_bottom {
    margin-top: 2.6em;
  }
}


/*==========================
 フッター エントリーボタン（帯）
 ※他ページ（#design / #plan / #select 等）と同一の指定に統一。
==========================*/
#quality .footer_BtnLink {
  display: block;
  width: 100%;
  margin: 0;
  padding-top: 4em;
  gap: 0;
}

#quality .footer_BtnLink li {
  width: 100%;
  margin: 0;
}

#quality .footer_BtnLink .btn_entryLink {
  width: 100%;
}

#quality .footer_BtnLink .btn_entryLink a {
  border-radius: 0;
  background: linear-gradient(90deg, #e2d2aa 0%, #d8c18f 42%, #f3ecdc 100%);
  color: #0f3f7c !important;
  border: 0;
}

#quality .footer_BtnLink .click_badge {
  background-color: #0f3f7c;
  font-style: normal;
  font-family: "Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", sans-serif;
  font-weight: bold;
}

/* ご来場予約ボタン（エントリーボタンの上） */
#quality .footer_BtnLink .btn_reseLink {
  width: 100%;
}

#quality .footer_BtnLink .btn_reseLink a {
  position: relative;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.8em;
  width: 100%;
  padding: 0.9em 1em;
  border: 0;
  border-radius: 0;
  background: linear-gradient(90deg, #a50f36 0%, #cd2350 50%, #a50f36 100%);
  color: #fff !important;
  font-size: 20px;
  letter-spacing: 0.08em;
  box-sizing: border-box;
  transition: opacity 0.4s;
}

#quality .footer_BtnLink .btn_reseLink a:hover {
  opacity: 0.75;
}

#quality .footer_BtnLink .btn_reseLink .click_badge {
  background: linear-gradient(90deg, #e2d2aa 0%, #d8c18f 42%, #f3ecdc 100%);
  color: #a50f36;
}

/* sp */
@media only screen and (max-width: 768px) {
  #quality .footer_BtnLink {
    padding-top: 2.5em;
  }

  #quality .footer_BtnLink .btn_reseLink a {
    font-size: 4.3vw;
    padding: 1.1em 1em;
  }
}