@charset "UTF-8";

/*!
Theme Name: Cocoon Child
Description: Cocoon専用の子テーマ
Theme URI: https://wp-cocoon.com/
Author: わいひら
Author URI: https://nelog.jp/
Template:   cocoon-master
Version:    1.1.3
*/

/************************************
** 子テーマ用のスタイルを書く
************************************/

:root {
  --main-color: #f19ec2;
  --sub-color: #fce0ea;
  --line-color: #cecece;
  --sub-color-color: #ed5a9a;
  --text-color: #666;
  --white-color: #fff;
}

body {
  font-family: "Zen Maru Gothic", serif;
  font-weight: 500;
  font-style: normal;
}

h1,
h2,
h3,
h4,
h5 {
  font-family: "Zen Maru Gothic", serif;
  font-weight: 700;
  font-style: normal;
  color: var(--main-color);
}

.content {
  margin: 0;
}

/*フォルダアイコンはすべてタグアイコンに*/
.fa-folder:before {
  content: "\f02b" !important;
  color: var(--line-color);
}

/*パンくずリストのタグアイコンを消す*/
.breadcrumb .fa-folder {
  display: none;
}

/*記事のタイトル*/
h1.entry-title {
  padding: 6px 0;
}

.article h2 {
  background-color: none;
  font-size: 22px;
  margin-bottom: 16px;
  padding: 0;
}

.article h3 {
  border-radius: 4px;
  color: var(--text-color);
  background-color: var(--sub-color);
  font-size: 18px;
  border: 1px solid var(--sub-color);
  width: 100%;
  margin-bottom: 12px;
  padding: 6px 14px;
}

#en-US .article-header h1.entry-title {
  display: none;
  }

.article h4 {
  border: none;
  border-bottom: 1px solid var(--sub-color);
  width: fit-content;
  font-size: 18px;
}

.article h2,
h4 {
  border-top: none;
  border-bottom: none;
  background-color: var(--white-color);
}

a:hover {
  color: var(--sub-color-color);
}

.header-in {
  display: flex;
  justify-content: flex-start;
  flex-direction: row;
}

.logo-header img {
  width: 200px;
}

.logo-image {
  text-align: left;
  padding-left: 20px;
}

/*固定ページの日付非表示*/
.date-tags {
  display: none;
}

.footer-meta .author-info {
  display: none;
}

/*bogo言語スイッチの表示順*/
.bogo-language-switcher .ja {
  order: 1;
}

.bogo-language-switcher .en {
  order: 2;
}

/*言語スイッチの間隔*/
.bogo-language-switcher .en {
  margin-left: 10px;
}

/*言語スイッチの横並び*/
.bogo-language-switcher {
  display: none;
  height: 40px;
  line-height: 40px;
  padding-left: 10px;
}

.sidebar .bogo-language-switcher {
  display: flex;
}

li.ja.current.last {
  display: flex;
}

li.ja.last {
  display: flex;
}

li.en-US.en.first {
  display: flex;
}

.bogo-language-name {
  font-size: 12px;
  font-weight: bold;
  color: var(--text-color);
}

.ja .bogo-language-name a {
  padding: 0;
  color: #1967d2;
  text-decoration: underline;
}

.en .bogo-language-name a {
  padding: 0;
  color: #1967d2;
  text-decoration: underline;
}

.bogo-language-switcher .current a {
  padding: 0;
  text-decoration: none;
}

/* 言語リンクのスタイル */
.bogo-language-switcher .bogo-language-name a {
  display: flex;
  align-items: center;
  text-decoration: none;
  font-size: 12px;
  color: var(--text-color);
  font-weight: bold;
}

/* 円の外枠 */
.bogo-language-switcher .bogo-language-name a::before {
  content: "";
  display: inline-block;
  width: 10px;
  height: 10px;
  border: 2px solid var(--text-color);
  border-radius: 50%;
  margin-right: 4px;
  /* テキストとの間隔 */
  background-color: transparent;
  /* デフォルトでは空 */
}

/* 現在選択されている言語のスタイル */
.bogo-language-switcher .current .bogo-language-name a::before {
  background-color: var(--main-color);
  /* 円の背景色 */
  border-color: var(--text-color);
  /* 円の枠の色 */
}

#wpdcom .wpdiscuz-item.wpd-field-group.wpd-field-rating {
  display: flex;
  margin-left: 10px;
  height: auto !important;
}

#wpdcom .wpdiscuz-item .wpdiscuz-rating {
  margin-left: 5px !important;
}

.wpd-cf-label {
  width: 55px;
  padding-top: 5px !important;
}

.wpd-cf-value {
  width: auto;
}

.entry-card-content {
  padding-bottom: 0em !important;
}

.entry-card-concepts {
  bottom: 0;
  position: absolute;
  right: 0;
  text-align: right;
  line-height: 1;
}

.concept-term {
  position: relative;
  display: inline-block;
  margin-left: 15px;
  padding: 0 8px 0 8px;
  color: var(--white-color);
  background: #89c997;
  line-height: 18px;
  font-size: 12px;
}

.concept-term:before {
  position: absolute;
  top: 0;
  left: -8px;
  content: "";
  border-width: 9px 8px 9px 0;
  border-style: solid;
  border-color: transparent #89c997 transparent transparent;
}

.concept-term:after {
  position: absolute;
  top: calc(50% - 2px);
  left: -1px;
  width: 4px;
  height: 4px;
  content: "";
  border-radius: 50%;
  background: var(--white-color);
}

/*ヘッダー検索フォーム*/
.search-submit .fa-search:before {
  font-size: 12px;
}

.search-box {
  display: flex;
  height: 28px;
  line-height: 0;
  max-width: 600px;
  width: 100%;
  padding-left: 10px;
  margin: 28px 0 0 0;
  align-items: center;
  overflow: hidden;
}

.search-box label {
  width: 86%;
}

.search-box label input {
  width: 100%;
  height: 28px;
  font-size: 10px !important;
  padding: 5px 15px;
  border: 1px solid var(--line-color);
  border-radius: 3px 0 0 3px;
  box-sizing: border-box;
  background-color: var(--white-color);
  font-size: 1em;
  outline: none;
}

.search-box button {
  display: block;
  background-color: var(--main-color);
  border: none;
  color: var(--white-color);
  padding: 4px 6px;
  font-size: 10px;
  display: flex;
  justify-content: center;
  align-items: center;
  width: 28px;
  height: 28px;
  border-radius: 0 4px 4px 0;
  background-color: var(--main-color);
  cursor: pointer;
}

/*カスタム検索フォーム*/
/* 全体の検索フォームスタイル */
.custom-search-form {
  max-width: 600px;
  margin: auto;
}

.custom-search-form .title-search {
  background-color: var(--sub-color);
  color: var(--main-color);
  text-align: center;
  height: 48px;
  line-height: 48px;
  border-radius: 6px 6px 0 0;
  font-size: 16px;
}

table.popup-selection-table {
  margin-bottom: 10px;
  border-collapse: separate;
  border: none;
  background-color: var(--white-color);
  border-radius: 6px;
}

.popup-selection-table td {
  background-color: var(--white-color);
  height: 40px;
  padding-left: 20px;
  font-size: 13px;
  border: none;
  border-bottom: 1px solid #eee;
  border-right: 1px solid #eee;
  border-left: 1px solid #eee;
  position: unset;
}

/*3行目1番下の要素左下角*/
.popup-selection-table tr:last-child > *:first-child {
  border-radius: 0 0 0 6px;
}

/*3行目1番下の要素右下角*/
.popup-selection-table tr:last-child > *:last-child {
  border-radius: 0 0 6px 0;
}

.popup-selection-table td:first-child,
.popup-selection-table th:first-child {
  width: 120px;
  border-right: none;
}

/*三角*/
.popup-selection-table td:first-child::before,
.popup-selection-table th:first-child::before {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 8px solid var(--sub-color);
  margin-right: 4px;
  /* テキストとの間隔 */
}

.popup-selection-table td:nth-child(2),
.popup-selection-table th:nth-child(2) {
  border-left: none;
}

.popup-selection-table button {
  background-color: var(--white-color);
  color: var(--main-color);
  border: none;
  font-family: "Zen Maru Gothic", serif;
  font-weight: 500;
  font-style: normal;
  cursor: pointer;
}

/* 検索ボタンのスタイル */
.popup-actions {
  width: 134px;
  margin: auto;
}

.popup-actions .fa-search {
  margin-left: 2px;
}

.custom-search-form .search-submit {
  width: fit-content;
  padding: 10px 20px;
  margin-bottom: 30px;
  border: none;
  border-radius: 4px;
  color: white;
  background: var(--main-color);
  cursor: pointer;
  transition: background 0.3s ease;
  box-sizing: border-box;
  position: static;
  font-size: 16px;
  display: block;
}

.custom-search-form .search-submit:hover {
  background: var(--sub-color-color);
}

.custom-search-form .expand-summary:hover {
  background: #333333;
}

/*ポップアップ表示*/
.search-popup {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 1000;
  justify-content: center;
  align-items: center;
}

.search-popup h4 {
  color: var(--main-color);
  border: none;
  text-align: center;
  margin-bottom: 0;
  width: 100%;
}

.search-popup-content {
  background: var(--white-color);
  padding: 20px;
  border-radius: 10px;
  max-width: 400px;
  width: 90%;
  position: relative;
}

.search-popup-content .area-container .area-option {
  padding: 0 18px;
  cursor: pointer;
}

.search-popup-content .confirm-button {
  background-color: var(--main-color);
  color: var(--white-color);
  padding: 6px 14px;
  border: none;
  border-radius: 4px;
  display: block;
  margin: 20px auto 0;
  cursor: pointer;
}

.close-button {
  color: var(--text-color);
  background: none;
  border: none;
  font-size: 26px;
  position: absolute;
  top: 10px;
  right: 10px;
  cursor: pointer;
}

/*チェックボタン*/
.checkbox-label input {
  accent-color: var(--text-color);
}

/*ラジオボタン*/
.condition-type {
  font-size: 10px;
  margin: 16px 0;
}

.condition-type input {
  accent-color: var(--text-color);
  cursor: pointer;
}

.checkbox-label .value {
  cursor: pointer;
}

/* 展開されたコンテンツのスタイル */
.custom-search-form .expand-content {
  padding: 5px;
  background: #f7f7f7;
  border-top: 1px solid #ccc;
  /* アニメーションを滑らかにする場合 */
  transition: max-height 3s ease;
  color: #555;
}

/* チェックボックスラベルのスタイル */
.custom-search-form .checkbox-label {
  display: inline-block;
  margin-right: 10px;
  font-size: 12px;
}

/* セレクトボックスの背景色を統一 */
.custom-search-form .region-select {
  background: #eaeaea;
}

/* 検索ボックスの位置を上の方に */
.search-menu-content {
  top: 12%;
}

/* 展開ボタンのカスタムマーカーを追加 */
.custom-search-form .expand-summary::before {
  content: "＋";
  /* 折りたたみ状態のマーカー */
  font-size: 1.2em;
  /* 必要に応じてサイズ調整 */
  transition: transform 0.3s ease;
}

/* 展開状態のマーカーを変更 */
.custom-search-form details[open] .expand-summary::before {
  content: "− ";
  /* 展開状態のマーカー */
}

/*トップページ*/
/*トップページランキングのタブ*/
.custom-tab-nav {
  width: 100%;
  overflow: scroll;
  scrollbar-width: none;
  display: flex;
  list-style: none;
  padding: 0;
  white-space: nowrap;
  padding: 0 !important;
  margin-bottom: 0 !important;
}

.custom-tab-nav .custom-tab-button {
  background-color: var(--white-color);
  color: var(--main-color);
  border: 1px solid var(--main-color);
  border-bottom: none;
  border-radius: 6px 6px 0 0;
  padding: 8px 14px;
  margin-bottom: 0 !important;
  cursor: pointer;
  font-size: 12px;
}

.custom-tab-nav .custom-tab-button.active {
  background-color: var(--main-color);
  color: var(--white-color);
  border: 1px solid var(--main-color);
  border-bottom: none;
}

.custom-tab-nav .custom-tab-button:hover {
  transition: 0.2s;
  background-color: var(--main-color);
  color: var(--white-color);
}

/*ランキングのアイテム*/
.custom-tab-content-group {
  border: none;
  padding: 0;
  margin: 0px -18px;
  border-top: 1px solid var(--main-color);
  border-bottom: 1px solid var(--main-color);
}

.custom-tab-content {
  display: none;
}

.custom-tab-content.active {
  display: block;
  padding: 20px;
}

/*トップページのエリアランキング一時的なページ*/
.area-rank .area-block {
  column-count: 2;
}

.area-rank .area-block .custom-box .custom-box-title {
  border: 1px solid var(--sub-color);
  width: fit-content;
  padding: 4px 10px;
  border-radius: 4px;
  margin-bottom: 8px;
}

.area-rank .area-block .custom-box .custom-box-title a {
  text-decoration: none;
  color: var(--text-color);
}

/* 特集リンク */
.photoItem a {
  color: var(--text-color);
  text-decoration: none;
  font-size: 0.8em;
}

.tabs {
  list-style: none;
  margin: 0;
  padding: 0;
  text-align: center;
  font-weight: 700;
  font-size: 16px;
  position: sticky;
  top: 0;
  z-index: 1;
  background: var(--white-color);
  display: flex;
  padding: 10px 0;
}

.tab-link {
  cursor: pointer;
  display: inline-block;
  padding: 10px 15px;
  background-color: var(--main-color);
  color: var(--white-color);
  margin: 0;
  white-space: nowrap;
  /* 余計なスペースを防ぐ */
  border: 1px solid var(--main-color);
}

.tab-link:hover {
  background-color: var(--white-color);
  color: var(--main-color);
  transition: 0.2s;
}

.tab-link + .tab-link {
  margin-left: 2px;
  /* タブ間の余白を調整 */
}

/*カスタムタクソノミーコンセプトから探す*/
.custom-taxonomies .taxonomy-block a {
  color: var(--text-color);
}

/* カスタムタクソノミー */
.taxonomy-block {
  margin-bottom: 10px;
  font-size: 0.8em;
}

.taxonomy-link {
  display: inline-block;
  margin: 0px 5px 5px 0px;
  padding: 0px 5px;
  background-color: var(--white-color);
  color: var(--main-color);
  border-radius: 5px;
  text-decoration: none;
  border: 0.5px solid var(--main-color);
}

/*フッターメニュー*/
.mobile-footer-menu-buttons {
  background-color: var(--white-color);
}

.menu-icon {
  color: var(--main-color);
}

.menu-caption {
  color: #707070;
  font-size: 10px;
}

/*エリアから探す*/
.area-container {
  width: 100%;
}

.area-container .area-block {
  display: flex;
  overflow: hidden;
  flex-wrap: wrap;
}

.area-container summary {
  background-color: var(--sub-color);
  border-radius: 5px;
  margin: 4px 0;
  font-size: 12px;
  padding: 2px 10px;
  list-style: none;
  cursor: pointer;
}

.area-container summary::before {
  font-family: "Font Awesome 5 Free";
  font-weight: 900;
  content: "\f067";
  font-size: 1.2em;
  margin-right: 0.5em;
  color: var(--white-color);
}

/*エリア開いた時*/
.area-container details[open] summary::before {
  content: "\f068";
}

.area-container .box-title {
  border: 1px solid var(--sub-color);
  font-size: 12px;
  border-radius: 5px;
  margin: 4px 6px 4px 0;
}

.area-container .box-title a {
  color: var(--text-color);
  text-decoration: none;
  padding: 2px 18px;
}

/*特集記事スライド*/
.slide-report {
  width: 100%;
  height: 300px;
  overflow: scroll;
  display: flex;
  flex-wrap: wrap;
  scrollbar-width: none;
  /*スクロールバー非表示*/
}

.slide-report .slide-report-item {
  width: 280px;
  height: 280px;
  border: 1px solid var(--line-color);
  border-radius: 8px;
  display: block;
}

.slide-report .slide-report-item img {
  width: 100%;
  height: 164px;
  object-fit: cover;
  border-radius: 8px 8px 0 0;
}

.slide-report .slide-report-item .title {
  height: 56px;
  overflow: hidden;
}

.slide-report .slide-report-item .title-d {
  height: 48px;
  overflow: hidden;
}

/*店舗ページ*/
/*店舗トップページのタブ*/
.custom-tabs ul.tabs {
  margin: 0;
  padding: 0;
  border-bottom: 1px solid var(--main-color);
  overflow: scroll;
  scrollbar-width: none;
}

.custom-tabs ul.tabs li.tab-link {
  border-radius: 5px 5px 0 0;
  font-size: 12px;
  padding: 10px 8px;
  margin-bottom: 0;
  border-bottom: none;
  background-color: var(--white-color);
  color: var(--main-color);
}

.custom-tabs ul.tabs li.tab-link:hover {
  background-color: var(--main-color);
  color: var(--white-color);
  transition: 0.2;
}

.custom-tabs ul.tabs li.current {
  background-color: var(--main-color);
  color: var(--white-color);
}

.custom-tabs .tab-content .tab-content-inner {
  margin: 16px 0 30px;
}

/* まず全てのタブコンテンツを隠す */
.tab-content-inner {
  display: none !important;
}

/* current クラスが付いたものを表示（デフォルトは block） */
.tab-content-inner.current {
  display: block !important;
}

/* tab-cast の場合、active 時には grid レイアウトに戻す */
.tab-content-inner.current.tab-cast {
  display: grid !important;
}

/*情報がない場合タブをグレーアウトする*/
.custom-tabs ul.tabs li.not-applicable {
  background-color: var(--line-color);
  color: var(--white-color);
  border: 1px solid var(--line-color);
}

.custom-tabs ul.tabs li.not-applicable:hover {
  background-color: var(--line-color);
  color: var(--white-color);
}

.custom-tabs .tab-content .tab-cast {
  display: grid;
  /* ２列にする */
  grid-template-columns: repeat(2, 1fr);
  /* アイテム間の隙間 */
  gap: 1rem;
  /* 必要なら上下のマージン */
  margin: 2rem 0;
}

.cast-item {
  border: 1px solid var(--line-color);
  border-radius: 4px;
  position: relative;
  width: 100%;
  padding: 14px;
}

.cast-item h3 {
  background-color: var(--white-color);
  border: none;
  color: var(--main-color);
  text-align: center;
  padding: 0;
}

.cast-item img {
  object-fit: cover;
  width: 100%;
  aspect-ratio: 1 / 1 !important;
}

/*キャストのポップ*/
.cast-popup-content {
  position: fixed;
  top: 56px;
  left: 50%;
  transform: translateX(-50%);
  width: 90%;
  background: var(--white-color);
  padding: 1em;
  box-shadow: 0 2px 8px rgba(0, 0, 0, 0.2);
  z-index: 100;
  border-radius: 6px;
  max-height: 80vh;
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
  scrollbar-width: none;
}

.cast-popup-content img {
  aspect-ratio: 3 / 4 !important;
  object-fit: contain;
}

.cast-popup-close {
  position: absolute;
  color: var(--main-color);
  top: 5px;
  right: 16px;
  background-color: var(--white-color);
  border: none;
  font-size: 38px;
}

/* 閉じるボタン */
.cast-popup-close {
  position: absolute;
  top: 0.5em;
  right: 0.5em;
  background: none;
  border: none;
  font-size: 1.5em;
  cursor: pointer;
}

/* オーバーレイ初期非表示・全画面覆う */
.cast-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: var(--white-color);
  opacity: 0.65;
  z-index: 999;
}

/* ポップアップはオーバーレイより手前 */
.cast-popup-content {
  display: none;
  z-index: 1000;
}

/* ギャラリー本体を相対位置に */
.my-gallery-extra {
  position: relative;
  display: flex;
  flex-wrap: wrap;
  transition: max-height 0.3s ease;
}

/* 折りたたみ時の最大高さ */
.my-gallery-extra.collapsed {
  overflow: hidden;
}

/* グラデーションのオーバーレイ */
.my-gallery-extra .gallery-gradient {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 4rem; /* お好みで調整 */
  background: linear-gradient(transparent, white);
  background: linear-gradient(
    to bottom,
    rgba(255, 255, 255, 0) 30%,
    rgba(255, 255, 255, 0.6) 50%,
    rgba(255, 255, 255, 0.8) 60%,
    rgba(255, 255, 255, 1) 100%
  );
  pointer-events: none;
}

/* トグルボタン */
.gallery-toggle-btn,
.gallery-toggle-btn-close {
  background: none;
  cursor: pointer;
  color: var(--text-color);
  border: none;
  font-family: "Zen Maru Gothic", serif;
  font-weight: 500;
  font-style: normal;
  width: 100%;
  text-align: right;
  margin-bottom: 20px;
  font-size: 10px;
}

.gallery-toggle-btn::before {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 8px solid var(--sub-color);
  margin-right: 4px;
}

.gallery-toggle-btn-close::before {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-bottom: 8px solid var(--sub-color);
  margin-right: 4px;
}

.post .tab-cast .wp-block-table {
  border: none;
}

.post .tab-cast .wp-block-table table td:first-child {
  width: auto;
}

/*クーポン*/
.coupon {
  display: inline-block;
  background: var(--white-color);
  border: 1px solid var(--line-color);
  border-radius: 6px;
  width: 324px;
  margin: 0 20px 20px 0;
  position: relative;
  overflow: hidden;
  vertical-align: top;
}

.coupon header {
  text-align: center;
  padding: 1.2rem 1rem 0;
}

.coupon header h1 {
  margin: 0;
  font-size: 1.3rem;
  color: var(--main-color);
}

.coupon header p {
  margin: 4px 0 10px;
  font-size: 10px;
  color: var(--text-color);
}

.coupon .illust {
  width: 100%;
  display: block;
  margin: 0 auto;
  object-fit: cover;
}

.coupon .details {
  padding: 10px;
}

.coupon .details .conditions {
  margin: 0.2em;
  margin: 0.2em;
  background-color: var(--sub-color);
  width: fit-content;
  padding: 2px 10px;
  border-radius: 4px;
  font-size: 12px;
}

.coupon .details .highlight {
  font-size: 24px;
  line-height: 32px;
  font-weight: bold;
  color: var(--main-color);
  margin: 0.4rem 0 16px;
  text-align: center;
}

.coupon ul {
  list-style: none;
  margin: 6px 0;
  padding: 0;
}

.coupon ul li {
  position: relative;
  margin-bottom: 0.4rem;
  color: var(--text-color);
  font-size: 12px;
  line-height: 16px;
}

.coupon .store {
  font-size: 0.9rem;
  line-height: 1.4;
  margin-top: 0.8rem;
  color: var(--text-color);
}

.coupon .cta {
  background: var(--main-color);
  color: var(--white-color);
  text-align: center;
  padding: 0.8rem;
  font-weight: bold;
  font-size: 12px;
  letter-spacing: 0.5px;
}

.coupon .cta p {
  margin: 0 0 2px;
}

/*店舗ページの下部にギャラリーを設置*/
.my-gallery-extra {
  padding-bottom: 0.5rem;
  width: 100%;
  margin: auto;
}

.my-gallery-extra img {
  width: 31%;
  height: auto;
  aspect-ratio: 1/1;
  object-fit: cover;
  margin: 0.2rem;
}

/*もっと見るボタン*/
.shop-info-more,
.shop-info-close {
  background: none;
  cursor: pointer;
  color: var(--text-color);
  border: none;
  font-family: "Zen Maru Gothic", serif;
  font-weight: 500;
  font-style: normal;
  width: 100%;
  text-align: right;
  margin-bottom: 20px;
  font-size: 10px;
}

.shop-info-more::before {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-top: 8px solid var(--sub-color);
  margin-right: 4px;
}

.shop-info-close::before {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  border-left: 5px solid transparent;
  border-right: 5px solid transparent;
  border-bottom: 8px solid var(--sub-color);
  margin-right: 4px;
}

/*店舗情報テーブル*/
h2.shop-info {
  text-align: center;
  background-color: var(--sub-color);
  height: 34px;
  line-height: 34px;
  border: 1px solid var(--main-color) !important;
  border-radius: 5px 5px 0 0;
  font-size: 16px;
  margin-bottom: 0;
  border-bottom: none !important;
}

/*料金やメニュー表など*/
h3.shop-table-title {
  text-align: center;
  background-color: var(--sub-color);
  height: 34px;
  border: 1px solid var(--main-color) !important;
  border-radius: 5px 5px 0 0;
  font-size: 16px;
  margin-bottom: 0;
  border-bottom: none !important;
  color: var(--main-color);
}

/*料金タブ*/
.wp-block-table table.price-table td:nth-child(2) {
  text-align: right;
}

.post .wp-block-table,
.page .wp-block-table {
  border: 1px solid var(--main-color);
  border-radius: 0 0 6px 6px;
  margin-bottom: 20px !important;
}

.post .wp-block-table table,
.page .wp-block-table table {
  width: 94%;
  margin: auto;
}

.post .wp-block-table table td,
.page .wp-block-table table td {
  background-color: var(--white-color);
  border: none;
  border-bottom: 1px solid var(--main-color);
}

.price-table td:first-child {
  width: 80%;
}

.price-table td:nth-child(2) {
 text-align: right;
}

.wp-block-table table.price-table td:first-child div {
  font-size: 11px !important;
}

.post .wp-block-table table tr:last-child {
  border-bottom: none;
}

/*一番下の線だけ消す*/
.post .wp-block-table table tr:last-child td:nth-child(1),
.post .wp-block-table table tr:last-child td:nth-child(2) {
  border-bottom: none;
}

/*エリアのタグ*/
.cat-link {
  background-color: var(--white-color);
  color: var(--text-color);
  border: 1px solid var(--sub-color);
  border-radius: 5px;
  font-size: 0.8em;
  padding: 0 6px;
}

.cat-link:hover {
  background-color: var(--sub-color);
  color: var(--text-color);
}

/*コンセプトとこだわり条件のタグ*/
.custom-taxonomies .taxonomy-block {
  margin-bottom: 10px;
  font-size: 0.8em;
}

.custom-taxonomies .taxonomy-block a {
  display: inline-block;
  margin: 0px 5px 5px 0px;
  padding: 0px 6px;
  border-radius: 5px;
  text-decoration: none;
  border: 0.5px solid var(--main-color);
  background-color: var(--white-color);
  color: var(--text-color);
  border: 1px solid var(--sub-color);
}

.custom-taxonomies .taxonomy-block a:hover {
  background-color: var(--sub-color);
}

/*おすすめのお店*/
.related-list {
  display: flex;
  flex-direction: row;
  width: 100%;
  overflow: scroll;
  scrollbar-width: none;
  /*スクロールバー非表示*/
}

.related-entry-card {
  aspect-ratio: 4 / 3;
  height: 110px;
  border: 1px solid var(--line-color);
  border-radius: 6px;
  overflow: hidden;
}

.related-entry-card-thumb {
  width: 100%;
  height: 55px;
  margin: 0;
}

.related-entry-card-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.related-entry-card-content {
  margin: 0;
}

.related-entry-card-title {
  white-space: nowrap;
  /* 改行しない */
  overflow: hidden;
  /* はみ出した部分を非表示 */
  text-overflow: ellipsis;
  color: var(--main-color);
  padding: 6px 8px 0;
  line-height: 18px;
  margin-bottom: 6px;
  display: block;
}

.related-entry-card-snippet {
  padding: 0 8px;
  box-sizing: border-box;
  font-size: 12px;
}

/*チェックしたページ（履歴）*/
#viewed-pages-list ul {
  display: flex;
  flex-direction: row;
  width: 100%;
  overflow: scroll;
  scrollbar-width: none;
  /*スクロールバー非表示*/
  padding: 0;
  margin: 0;
  list-style: none;
}

#viewed-pages-list ul li {
  padding: 1.5%;
  box-sizing: content-box;
}

#viewed-pages-list ul li a {
  aspect-ratio: 4 / 3;
  height: 110px;
  padding: 0;
  border: 1px solid var(--line-color);
  border-radius: 6px;
  overflow: hidden;
  color: var(--text-color);
  text-decoration: none;
  display: block;
}

#viewed-pages-list ul li a .viewed-pages-title {
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  color: var(--main-color);
  padding: 6px 8px 0;
  font-size: 16px;
  font-weight: 600;
  line-height: 18px;
  margin-bottom: 2px;
}

#viewed-pages-list ul li a .viewed-pages-meta {
  font-size: 12px;
  padding: 0 8px;
}

#viewed-pages-list ul li a:before {
  display: none;
}

#viewed-pages-list ul li a img {
  width: 100%;
  height: 55px;
  object-fit: cover;
}

/*履歴を消去ボタン*/
#clear-viewed-pages {
  font-family: "Zen Maru Gothic", serif;
  font-weight: 500;
  font-style: normal;
  background-color: var(--white-color);
  border: none;
  padding: 2px 6px;
  color: var(--text-color);
  float: inline-end;
  cursor: pointer;
  font-size: 10px;
}

#clear-viewed-pages:before {
  content: "";
  display: inline-block;
  width: 0;
  height: 0;
  border-top: 5px solid transparent;
  border-bottom: 5px solid transparent;
  border-left: 8px solid var(--sub-color);
  margin-right: 4px;
}

/*お気に入りハートボタン*/
.post .article-header {
  position: relative;
}

/*固定ページ*/
.page .article-header h1.entry-title {
  width: 100%;
}

/*店舗ページ*/
.post .article-header h1.entry-title {
  max-width: 80%;
  display: inline-block;
}

.article-header .simplefavorite-button {
  width: 64px;
  display: inline-block;
  float: inline-end;
  position: absolute;
  top: 2px;
  right: 0;
  padding: 0;
  border: none;
}

.article-header button.simplefavorite-button.has-count {
  background-color: var(--white-color);
  transition: 0.5s;
  cursor: pointer;
  transition: 0.5s;
  vertical-align: middle;
}

.article-header button.simplefavorite-button.has-count .icon-heart:before {
  display: block;
  font-size: 20px;
  margin-bottom: 4px;
}

.article-header .active .icon-heart:before {
  color: var(--main-color);
}

.article-header button.simplefavorite-button.has-count .icon-heart,
.article-header
  button.simplefavorite-button.has-count
  .simplefavorite-button-count {
  font-size: 0.6em;
}

.footer-menu {
  list-style: none;
  width: 100%;
  padding: 20px 0 0;
  text-align: center;
  display: flex;
  justify-content: center;
}

.footer-menu li {
  padding: 0 10px;
}

.footer-menu li a {
  text-decoration: none;
  font-size: 12px;
}

.footer {
  padding: 0;
  background-color: var(--sub-color);
}

/*ページ送りデザイン*/
.pagination a {
  font-size: 14px;
}

.pagination a.page-numbers {
  border: none;
  color: var(--text-color);
  width: 40px;
  height: 40px;
  line-height: 40px;
}

.pagination a.prev.page-numbers,
.pagination a.next.page-numbers {
  background-color: var(--main-color);
  color: var(--white-color);
  border-radius: 50px;
}

.pagination span.page-numbers.current {
  border-radius: 50px;
  background-color: var(--sub-color);
  border: none;
  width: 40px;
  height: 40px;
  line-height: 40px;
  font-size: 14px;
}

.pagination span.page-numbers.dots {
  background-color: var(--white-color);
  border: none;
}

/*次のページ*/
.pagination-next {
  width: fit-content;
  margin: auto;
}

.pagination-next a {
  border-radius: 50px;
  background-color: var(--white-color);
  border: 1px var(--sub-color) solid;
  font-size: 14px;
  padding: 10px 20px;
}

.pagination-next a:hover {
  background-color: var(--sub-color);
}

/*検索結果ページ*/
/*タグ・エリアクリックした時のページも*/
.content .archive-title {
  color: var(--main-color);
}

.content .archive-title span {
  display: block;
  font-size: 14px;
  color: var(--text-color);
  font-weight: 500;
  margin: 10px 0;
}

.archive-title .fa-tags:before .archive-title .fa-folder-open:before {
  display: none;
}

.content .admin-pv,
.content .post-date {
  display: none;
}

.content .list .entry-card {
  border: 1px solid var(--line-color);
  border-radius: 8px;
  display: flex;
}

.a-wrap:hover {
  background-color: var(--white-color);
}

.entry-card-title {
  font-size: 20px;
  color: var(--main-color);
}

.content .list .entry-card .entry-card-thumb {
  width: 230px;
  margin: 0;
}

.content .list .entry-card .entry-card-thumb img {
  width: 230px;
  min-width: 230px;
  border-radius: 7px 0 0 0;
}

.content .list .entry-card .entry-card-content {
  margin: 0;
  padding: 10px;
}

.content .list .entry-card .entry-card-content .entry-card-snippet {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
  line-height: 20px;
  margin-bottom: 10px;
}

.content .list .entry-card .entry-card-content .entry-card-categorys {
  font-size: 12px;
}

.content .list .entry-card .entry-card-content .entry-card-categorys span {
  display: inline-block;
  margin: 0 6px 6px;
  background-color: var(--white-color);
  border: 1px solid var(--sub-color);
  border-radius: 5px;
  padding: 0 8px;
}

.content
  .list
  .entry-card
  .entry-card-content
  .entry-card-categorys
  .entry-card-area,
.content
  .list
  .entry-card
  .entry-card-content
  .entry-card-categorys
  .entry-card-concept,
.content
  .list
  .entry-card
  .entry-card-content
  .entry-card-categorys
  .entry-card-condition {
  margin-bottom: 8px;
}

.entry-content {
  margin-bottom: 0;
}

/*お気に入り一覧ページ*/
.article ul.favorites-list {
  padding: 0;
}

.article ul.favorites-list li {
  border: 1px solid var(--line-color);
  border-radius: 8px;
  margin: 26px 0;
  padding: 0 0 6px;
  list-style: none;
}

.article ul.favorites-list li img {
  border-radius: 7px 0 0 0;
}

.article ul.favorites-list li p {
  margin: 0;
}

.article ul.favorites-list li p a {
  font-size: 20px;
  padding: 0 10px;
  text-decoration: none;
}

.article ul.favorites-list li .simplefavorite-button {
  background-color: var(--white-color);
  border: none;
  font-size: 16px;
}

.article ul.favorites-list li .simplefavorite-button i {
  color: var(--text-color) !important;
  font-size: 16px;
}

.article
  ul.favorites-list
  li
  .simplefavorite-button
  .simplefavorite-button-count {
  color: var(--text-color);
}

.article ul.favorites-list li .simplefavorite-button .icon-heart:before {
  color: var(--main-color);
}

/*トップページのヘッダーを消す*/
#post-2035 .article-header {
  display: none;
}

#main-scroll .photoItem {
  border: 1px solid var(--line-color);
  border-radius: 6px;
  overflow: hidden;
}

#main-scroll .photoText {
  padding: 6px 8px;
  color: var(--main-color);
  text-decoration: none;
}

.wp-block-button__link {
  border: 1px solid var(--sub-color);
  width: fit-content;
  padding: 4px 10px;
  border-radius: 4px;
  margin-bottom: 8px;
  background-color: var(--white-color);
}

.blogcard-wrap {
  margin-left: 0;
}

/************************************
** レスポンシブデザイン用のメディアクエリ
************************************/

@media screen and (max-width: 1023px) {
  /*必要ならばここにコードを書く*/
  main.main {
    padding: 0 16px;
    margin: 0;
  }

  .logo-header img {
    width: 100%;
    max-width: 220px;
  }

  .logo-image {
    text-align: left;
    padding: 0;
  }

  .logo-image .site-name-text-link {
    padding: 0;
  }

  .header-in {
    height: 42px;
    line-height: 36px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    padding: 6px 16px 0;
  }

  .search-box {
    margin: 8px 0;
  }

  /*パンくずリスト上部に設置してる*/
  .breadcrumb {
    background-color: var(--main-color);
    color: var(--white-color);
    margin: 14px -18px;
    padding: 4px 16px;
    font-size: 10px;
  }

  .breadcrumb a {
    color: var(--white-color);
  }

  .bogo-language-switcher {
    display: flex;
  }

  .footer-menu {
    display: block;
  }

  /*検索ページ*/
  .content .list .entry-card {
    flex-direction: column;
  }

  .content .list .entry-card .entry-card-thumb {
    width: 100%;
    margin: 0;
  }

  .content .list .entry-card .entry-card-thumb img {
    border-radius: 7px 7px 0 0;
    width: 100%;
  }

  /*ブログカード*/
  .blogcard {
    max-width: 400px;
    padding: 0;
    border-radius: 8px;
  }

  .blogcard .blogcard-thumbnail {
    float: none;
    width: 100%;
    margin: 0;
  }

  .blogcard .blogcard-thumbnail img {
    border-radius: 7px 7px 0 0;
    height: 140px;
  }

  .blogcard .blogcard-content {
    margin: 0;
    height: auto;
    min-height: auto;
    padding: 10px;
  }

  .blogcard .blogcard-content .blogcard-title {
    color: var(--main-color);
    font-size: 14px;
    margin-bottom: 4px;
  }

  .blogcard .blogcard-footer {
    display: none;
  }

  /*お気に入り一覧ページ*/
  .article ul.favorites-list li img {
    float: none !important;
    border-radius: 7px 7px 0 0;
    width: 100%;
  }
}

@media screen and (max-width: 834px) {
  /*必要ならばここにコードを書く*/
}

@media screen and (max-width: 480px) {
  .internal-blogcard:after {
    bottom: 20px;
    padding: 0.2em 1em;
  }

  .pagination span.page-numbers.dots {
    display: block;
  }
}

/*キャスト表示のポップアップPC時横並びにする*/
@media screen and (min-width: 835px) {
  .cast-item {
    padding: 30px;
  }

  .cast-popup-content {
    width: 840px;
  }

  .cast-popup-content img {
    width: 400px;
  }

  .cast-popup-content .wp-block-column {
    width: 400px;
    display: inline-block;
    vertical-align: top;
  }
}

/* テーブル内クーポンリンクをボタン風に */
/* -------------------------------
   ボタン本体
---------------------------------*/
.coupon-button {
  position: relative; /* ::before/after 描画の基準にする */
  display: inline-block;
  padding: 0.1em 1em; /* 左右のパディングは丸の直径の半分＋余白を目安に */
  background-color: #e69cb4; /* ピンク色 */
  color: #fff;
  text-decoration: none;
  overflow: visible; /* 丸がはみ出しても表示 */
  transition: filter 0.2s;
}
.coupon-button:hover {
  filter: brightness(1.1);
}

/* -------------------------------
   左右の白丸
---------------------------------*/
.coupon-button::before,
.coupon-button::after {
  content: "";
  position: absolute;
  top: 50%;
  width: 1.2em; /* ボタン高さ ≒ padding*2 + font-size*line-height */
  height: 1.2em;
  background-color: #fff;
  border-radius: 50%;
  transform: translateY(-50%);
  pointer-events: none; /* 丸部分もリンク判定したい場合は外す */
}

.coupon-button::before {
  left: -0.8em; /* 幅の半分だけ左にはみ出す */
}
.coupon-button::after {
  right: -0.8em; /* 幅の半分だけ右にはみ出す */
}

/* 広告出稿用PRウィジェット */
.pr-banner-wrap {
  position: fixed;
  bottom: 66px;
  right: 16px;
  width: 160px;
  height: 97px;
  box-shadow: 2px 2px 3px rgba(176,176,176,0.4);
  z-index: 9999; /* 手前に出す */
}

.pr_banner {
  display: block;
  width: 100%;
  height: 100%;
}

.pr_banner img {
  object-fit: cover;
  width: 100%;
  height: 100%;
  overflow: hidden;
  display: block;
}

.pr_banner-close {
  position: absolute;
  top: -10px;
  right: -10px;
  width: 24px;
  height: 24px;
  border-radius: 9999px;
  border: none;
  background: #ffffff;
  font-size: 16px;
  line-height: 1;
  cursor: pointer;
  box-shadow: 0 2px 4px rgba(0,0,0,0.25);
}

/* ===================================================
  Conconcafe Ranking Card (Cocoon) - Simple
  - 余計な重複を削除して統合
  - 1位/2位/3位/その他で --accent を切り替え対応
=================================================== */

.entry-content .concafe-ranking{
  /* 共通カラー */
  --link: #2d66d1;
  --coupon: #f39b12;
  --border: #e9e9e9;
  --shadow: 0 8px 24px rgba(0,0,0,.08);

  /* ラベル（dt）の色（順位色とは別で固定） */
  --label-bg: #f19ec2;
  --label-txt: #ffffff;

  /* レイアウト調整用（ここだけ触れば全体調整しやすい） */
  --rank-col: 92px;      /* 左の順位枠の幅（PC） */
  --rank-col-sp: 76px;   /* 左の順位枠の幅（SP） */
  --head-h: 96px;        /* headの高さ（PC） */
  --head-h-sp: 82px;     /* headの高さ（SP） */
  --head-bar-h: 75%;     /* titlebar/rankをhead内で何%の高さにするか */

  max-width: 1100px;
  margin: 0 auto;
}

/* ------------------------------
  カードごとの順位色（ここを好きな色に変更）
  ※「順番で自動」＋「クラス指定でも可」の両対応
------------------------------ */

/* その他（デフォルト） */
.entry-content .concafe-ranking .concafe-card{
  --accent: #f19ec2;
  --accent-dark: #ed5a9a;
  --accent-light: #fce0ea;
}

/* 1位 */
.entry-content .concafe-ranking .concafe-card.is-rank1,
.entry-content .concafe-ranking .concafe-card:nth-of-type(1){
  --accent: #d4af37;       /* ゴールド */
  --accent-dark: #a67c00;
  --accent-light: #f7e6a1;
}

/* 2位 */
.entry-content .concafe-ranking .concafe-card.is-rank2,
.entry-content .concafe-ranking .concafe-card:nth-of-type(2){
  --accent: #b9c0c8;       /* シルバー */
  --accent-dark: #7a828c;
  --accent-light: #edf0f4;
}

/* 3位 */
.entry-content .concafe-ranking .concafe-card.is-rank3,
.entry-content .concafe-ranking .concafe-card:nth-of-type(3){
  --accent: #cd7f32;       /* ブロンズ */
  --accent-dark: #8a4b18;
  --accent-light: #e6b07b;
}

/* ------------------------------
  Cocoon / ブロックの余白干渉をカード内だけリセット
------------------------------ */
.entry-content .concafe-ranking .concafe-card,
.entry-content .concafe-ranking .concafe-card *{
  box-sizing: border-box;
}

.entry-content .concafe-ranking .concafe-card :where(h1,h2,h3,h4,h5,h6,p,figure,dl,dt,dd,ul,ol,li){
  margin: 0 !important;
}
.entry-content .concafe-ranking .concafe-card :where(ul,ol){
  padding: 0 !important;
  list-style: none !important;
}

/* ------------------------------
  card
------------------------------ */
.entry-content .concafe-ranking .concafe-card{
  background: #fff;
  border: 1px solid var(--border);
  border-radius: 10px;
  box-shadow: var(--shadow);
  overflow: hidden;
}

.entry-content .concafe-ranking .concafe-card + .concafe-card{
  margin-top: 34px;
}

/* ------------------------------
  head（順位＋タイトルバー）
------------------------------ */
.entry-content .concafe-ranking .concafe-card__head{
  display: grid !important;
  grid-template-columns: var(--rank-col) 1fr !important;
  height: var(--head-h);
  align-items: stretch;
}

/* 左：順位 */
.entry-content .concafe-ranking .concafe-rank{
  background: #fff;
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  align-self: end;                 /* 下寄せ */
  height: var(--head-bar-h);
  padding: 0 6px;
}

.entry-content .concafe-ranking .concafe-rank i{
  color: var(--accent);
  font-size: 30px;
  line-height: 1;
}

.entry-content .concafe-ranking .concafe-rank__num{
  color: var(--accent);
  font-weight: 900;
  font-size: 56px;
  line-height: .8;
  margin-top: 0;
  letter-spacing: .02em;
}

/* 右：タイトルバー */
.entry-content .concafe-ranking .concafe-titlebar{
  position: relative;
  display: flex;
  align-items: center;
  align-self: end;                 /* 下寄せ */
  height: var(--head-bar-h);
  padding: 0 24px;
  background: linear-gradient(180deg, var(--accent-light), var(--accent-dark));
}

/* h3のCocoon装飾を無効化して自前に */
.entry-content .concafe-ranking h3.concafe-title{
  all: unset;
  display: block;
  color: #fff;
  font-weight: 900;
  font-size: 26px;
  line-height: 1.25;
}

.entry-content .concafe-ranking h3.concafe-title a{
  color: #fff;
  text-decoration: none;
  display: inline-block;
}

/* ★は使わない（HTMLに残っていても消す） */
.entry-content .concafe-ranking .concafe-fav{
  display: none !important;
}

/* ------------------------------
  main（画像 + 情報）
------------------------------ */
.entry-content .concafe-ranking .concafe-card__main{
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) 420px !important;
  gap: 22px !important;
  align-items: start !important;
  padding: 18px 20px 0 !important;
}

@media (max-width: 1100px){
  .entry-content .concafe-ranking .concafe-card__main{
    grid-template-columns: minmax(0, 1fr) 360px !important;
  }
}

/* 画像 */
.entry-content .concafe-ranking figure.concafe-thumb{
  overflow: hidden;
  padding-bottom: 12px;        /* ← figureの直後に12px空ける（margin競合回避） */
}

.entry-content .concafe-ranking .concafe-card__main br{
  display: none !important;    /* WPの混入br対策 */
}

.entry-content .concafe-ranking .concafe-thumb img{
  display: block;
  width: 100% !important;
  height: 210px !important;
  object-fit: cover;
}

/* 情報 */
.entry-content .concafe-ranking .concafe-info{
  display: block !important;
}

.entry-content .concafe-ranking .concafe-info__row{
  display: grid !important;
  grid-template-columns: 92px minmax(0, 1fr) !important;
  gap: 6px !important;
  align-items: start !important;
  margin: 0 0 2px !important;
}

.entry-content .concafe-ranking .concafe-info__row dt{
  background: var(--label-bg);
  color: var(--label-txt);
  font-weight: 900;
  text-align: center;
  height: 38px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0 8px;
  letter-spacing: .02em;
}

.entry-content .concafe-ranking .concafe-info__row dd{
  color: #111;
  font-size: 16px;
  line-height: 1.6;
  padding-top: 4px;
  word-break: break-word;
}

.entry-content .concafe-ranking .concafe-info__row dd p{
  margin: 0 !important;
}

.entry-content .concafe-ranking .concafe-info__row dd a{
  color: var(--link);
  font-weight: 800;
  text-decoration: none;
}

.entry-content .concafe-ranking .concafe-muted{
  color: #666;
  font-weight: 500;
}

/* ------------------------------
  coupon（通常版）
  ※もし「シンプル版（ラベル＋ボタンだけ）」を使うなら下の .concafe-coupon--simple を使ってください
------------------------------ */
.entry-content .concafe-ranking .concafe-coupon{
  margin: 20px auto 0;
  max-width: 760px;
  background: #fff;
  border: 3px solid #f3d2ac;
  border-radius: 16px;
  box-shadow: 0 6px 16px rgba(0,0,0,.08);
  padding: 14px 18px 16px;
}

.entry-content .concafe-ranking .concafe-coupon__label{
  text-align: center;
  font-weight: 900;
  margin: 0 0 8px !important;
  letter-spacing: .02em;
}

.entry-content .concafe-ranking .concafe-coupon__inner{
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  flex-wrap: wrap;
}

.entry-content .concafe-ranking .concafe-badge{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 10px;
  background: var(--coupon);
  color: #fff;
  border-radius: 999px;
  padding: 10px 16px;
  font-weight: 900;
  line-height: 1.15;
  min-width: 190px;
}

.entry-content .concafe-ranking .concafe-badge i{
  font-size: 22px;
}

.entry-content .concafe-ranking .concafe-coupon__price{
  flex: 1;
  min-width: 220px;
  text-align: right;
}

.entry-content .concafe-ranking .concafe-before{
  font-size: 20px;
  font-weight: 900;
  text-decoration: line-through;
  text-decoration-color: #d10000;
  text-decoration-thickness: 3px;
}

.entry-content .concafe-ranking .concafe-arrow{
  margin-top: 2px;
  font-size: 18px;
  color: #111;
}

.entry-content .concafe-ranking .concafe-after{
  display: flex;
  align-items: flex-end;
  justify-content: flex-end;
  gap: 8px;
  color: var(--coupon);
  font-weight: 900;
}

.entry-content .concafe-ranking .concafe-after .min{ font-size: 28px; }
.entry-content .concafe-ranking .concafe-after .num{ font-size: 58px; line-height: 1; }
.entry-content .concafe-ranking .concafe-after .yen{ font-size: 28px; }

/* シンプル版クーポン（ラベル＋ボタンだけ）を使う場合 */
.entry-content .concafe-ranking .concafe-coupon--simple .concafe-coupon__inner{
  justify-content: center;
}
.entry-content .concafe-ranking .concafe-coupon--simple .concafe-coupon__price{
  display: none !important;
}

/* ------------------------------
  desc / tags
------------------------------ */
.entry-content .concafe-ranking .concafe-desc{
  padding: 18px 20px 0;
  font-size: 16px;
  line-height: 1.9;
  color: #222;
}

.entry-content .concafe-ranking .concafe-desc-more{
  display: none;
  padding: 8px 20px 0;
  text-align: center;
  color: var(--link);
  font-weight: 900;
  text-decoration: none;
}

.entry-content .concafe-ranking .concafe-tags{
  padding: 18px 20px 26px;
  display: flex;
  gap: 14px;
  flex-wrap: wrap;
  align-items: center;
}

.entry-content .concafe-ranking .concafe-tags__label{
  border: 2px solid #999;
  padding: 6px 12px;
  font-weight: 900;
  border-radius: 0;
  background: #fff;
}

.entry-content .concafe-ranking .concafe-taglist{
  display: flex;
  gap: 12px;
  flex-wrap: wrap;
}

.entry-content .concafe-ranking .concafe-taglist a{
  color: var(--link);
  text-decoration: none;
  font-weight: 900;
}
.entry-content .concafe-ranking .concafe-taglist a:hover{
  text-decoration: underline;
}

/* ------------------------------
  SP
------------------------------ */
@media (max-width: 768px){
  .entry-content .concafe-ranking{
    --head-h: var(--head-h-sp);
  }

  .entry-content .concafe-ranking .concafe-card__head{
    grid-template-columns: var(--rank-col-sp) 1fr !important;
    height: var(--head-h-sp);
  }

  .entry-content .concafe-ranking .concafe-titlebar{
    padding: 0 16px;
  }

  .entry-content .concafe-ranking h3.concafe-title{
    font-size: 20px;
    line-height: 1.25;
  }

  /* タイトルを1行固定（溢れたら…） */
  .entry-content .concafe-ranking h3.concafe-title a{
    max-width: 100%;
  /*     white-space: nowrap; */
    overflow: hidden;
    text-overflow: ellipsis;
  }

  /* SPは1カラム＋画像は横長バナー感 */
  .entry-content .concafe-ranking .concafe-card__main{
    grid-template-columns: 1fr !important;
    padding: 16px 16px 0 !important;
    gap: 0 !important;
  }

  .entry-content .concafe-ranking .concafe-thumb img{
    height: auto !important;
    aspect-ratio: 3 / 1;
    object-fit: cover;
    border-radius: 6px;
  }

  .entry-content .concafe-ranking .concafe-info__row{
    grid-template-columns: 86px minmax(0, 1fr) !important;
    gap: 4px !important;
    margin-bottom: 2px !important;
  }

  .entry-content .concafe-ranking .concafe-info__row dt{
    height: 34px;
    font-size: 13px;
  }

  .entry-content .concafe-ranking .concafe-info__row dd{
    font-size: 15px;
    padding-top: 3px;
  }

  /* 説明文は2行省略＋続きを読む表示 */
  .entry-content .concafe-ranking .concafe-desc{
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
    overflow: hidden;
  }
  .entry-content .concafe-ranking .concafe-desc-more{
    display: block;
  }

  .entry-content .concafe-ranking .concafe-coupon{
    max-width: 100%;
    margin: 16px 16px 0;
    padding: 14px 14px 14px;
  }

  .entry-content .concafe-ranking .concafe-before{
    font-size: 18px;
  }
  .entry-content .concafe-ranking .concafe-after .num{
    font-size: 54px;
  }
  .entry-content .concafe-ranking .concafe-after .min,
  .entry-content .concafe-ranking .concafe-after .yen{
    font-size: 26px;
  }
}