@charset "utf-8";
/*
Theme Name: Lifestyle Child
Template: lifestyle
*/

/* パンくず共通 */
.breadcrumb {
  font-size: 12px;
  margin: 10px 0;
  overflow-x: auto; /* スマホ横スクロール用 */
  white-space: nowrap;
  -webkit-overflow-scrolling: touch; /* iOS滑らかスクロール */
}

#breadcrumbs {
  margin: 0;
}

#breadcrumbs a {
  text-decoration: none;
  color: #555;
}

#breadcrumbs span, #breadcrumbs a {
    display: inline-block;
    padding-right: 5px;
    background: #333;
    color: #FFF;
}
/* スマホ表示（幅768px以下） */
@media (max-width: 768px) {
  .breadcrumb {
    padding: 8px 0;
    scrollbar-width: none; /* Firefox */
  }
  .breadcrumb::-webkit-scrollbar {
    display: none; /* Chrome・Safari */
  }
}

/* PC表示（幅769px以上） */
@media (min-width: 769px) {
  .breadcrumb {
    white-space: normal; /* 改行OK */
    overflow: visible;
  }
}


html, body {
  overflow-x: hidden;
}
h1{
	}
h2{
	
}
h3{
	
}
.fade-line {
  opacity: 0;
  transform: translateY(20px);
  animation: fadeUp 0.8s ease-out forwards;
}

.line1 { animation-delay: 0.2s; }
.line2 { animation-delay: 0.5s; }
.line3 { animation-delay: 0.8s; }
.line4 { animation-delay: 1.2s; }

*, *::before, *::after {
    box-sizing: border-box;
}
.toppage-list {
    list-style: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem; /* 項目間の隙間 */
}

.toppage-list li {
    border: 1px solid black;
    padding: 0.5rem 1rem;
    position: relative;
}

.toppage-list li::after {
    content: "＞";
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
}

/* Header */
#toppage_header {
  text-align: center;
  padding: 1em;
}
.toppage_logo-image {
  max-width: 200px;
  height: auto;
}

/* トップページ */
#toppage_hero-visual {
  position: relative;
  text-align: center;
  color: #24262a;
  border-bottom: solid 2px;
}
#toppage_hero-bg {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  /* filter: brightness(0.6); */
}
#toppage_hero-content {
  position: relative;
  padding: 3em 10% 14em;
  overflow: hidden;
}
/* フェードアップアニメーション定義 */
@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* アニメーション共通設定 */
.fade-line {
  opacity: 0;
  transform: translateY(20px);
  animation: fadeUp 0.8s ease-out forwards;
}

/* 各行ごとにディレイ設定（順番にふわっと） */
.line1 { animation-delay: 0.2s; }
.line2 { animation-delay: 0.5s; }
.line3 { animation-delay: 0.8s; }
.line4 { animation-delay: 1.2s; }

#toppage_hero-title {
  line-height: 89px;
  font-size: 80px;
  margin: 0;
}
#toppage_hero-subtitle {
  font-size: 18px
  margin-top: 1em;
}
.scroll-indicator {
  position: absolute;
  bottom: 0;
  left: 50%;
  height: 111px;
  transform: translateX(-50%);
  text-align: center;
  font-size: 14px;
  color: #000; /* 必要に応じて調整 */
}

.scroll-indicator::after {
  content: "";
  position: absolute;
  top: 44px;
  left: 50%;
  transform: translateX(-50%);
  width: 1px;
  height: 84px;
  background-color: #000; /* 線の色：必要に応じて変更 */
  opacity: 0;
  animation: pathmove 1.4s ease-in-out infinite;
}

@keyframes pathmove {
  0% {
    opacity: 0;
    transform: translate(-50%, 0);
  }
  50% {
    opacity: 1;
    transform: translate(-50%, 40px);
  }
  100% {
    opacity: 0;
    transform: translate(-50%, 80px);
  }
}

/* About Section */
#toppage_about {
  padding: 50px 0;
  /* background: #f9f9f9; */
  /* text-align: center; */
  width: 90%;
  margin: auto;
  border-bottom: solid 1px;
}
.toppage_intro-message{
    font-size: 2rem;
    font-weight: bold;
    margin: 0.5em 0;
    text-align: center;
}

.toppage_intro-title {
  font-size: 18px;
  margin: 0.5em 0;
  text-align: center;
  font-weight: bold;
}
.toppage_intro-description {
  font-size: 18px;
  width: 80%;
  text-align: center;
  margin: 50px auto;
  font-weight: bold;
  line-height: 43px;
}
footer{
	/* text-align:center; */
	font-size: 10px;
	text-align: center;
	margin-top: 50px;
}
/* 768px以下の画面幅で適用されるスタイル */
@media (max-width: 768px) {
  .toppage-list {

  }

  .toppage-list li {

  }

  .toppage-list li::after {

  }

  /* Header */
  #toppage_header {

  }

  .toppage_logo-image {

  }

  /* トップページ */
  #toppage_hero-visual {

  }

  #toppage_hero-bg {

  }

  #toppage_hero-content {

  }

  #toppage_hero-title {
    line-height: 40px;
    font-size: 40px;
    margin: 20px auto;
    text-align: left;
  }

  #toppage_hero-subtitle {

  }

  /* About Section */
  #toppage_about {width: 80%;}

  .toppage_intro-message {font-size: 25px;text-align: left;}

  .toppage_intro-title {font-size: 15px;text-align: left;line-height: 32px;}

  .toppage_intro-description {width: 100%;font-size: 15px;line-height: 33px;text-align: left;}

}



/* ===== 特集ページ　レイアウト全体 ===== */
#feature_upper {
    padding: 0 5%;
}
#feature_under {
    padding: 25px 5%;
    margin: 25px auto;
    background: #fbf9f9;
}
#feature_main{/* width: 90%; */margin: auto;padding: 25px 0;}
h2.feature-card__title {
    font-size: 30px;
    margin: 25px 0;
    /* background: #333; */
    /* color: #FFF; */
    display: inline;
    padding: 1px;
}
#feature_main p {
    font-size: 14px;
    line-height: 22px;
}
#feature_main h3 {
    font-size: 20px;
    margin: 20px 0;
}
.feature-card__area {
    background: #333;
    display: table;
    background: #333;
    color: #FFF;
    padding: 5px 10px;
}
.feature-grid {/* background: #f5f5f5; */}
.feature-card__pr-title {
						 font-size: 24px;
						 text-align: center;
						 width: 100%;
						 margin: 25px auto;
}
.feature-card {/* width: 90%; */margin: 25px auto;padding: 25px 0;border-top: solid;}
.feature-card ul {
  
}
.feature-card li {
	list-style: disc inside; /* リストマーカーを内側に */
	 font-size: 15px;
    margin: 9px 0px;}
.feature-card__link {
}
h3.feature-card__title {font-size: 28px;margin: 25px 0;border-bottom: solid;padding: 25px 0;}
.feature-card__excerpt {
}
.feature-card__mini-body {margin: 25px 0;}
.feature-card__mini-body img{
	margin:25px 0;
}
.feature-card__cta {margin: 25px 0;/* text-align: center; *//* border-bottom: solid; *//* display: inline-block; *//* color: #de4759; */font-size: 14px;}
.cta-line1 {
}
.cta-line2 a {color: #FFF;color: #FF2D55;margin-bottom: 20px;text-align: left;border-bottom: solid 2px #FF2D55;}
/* ===== クーポン（future-coupon） ===== */
.future-coupon-container {
}
.future-coupon {
}
.future-coupon--hidden {
}
.future-coupon__header {
}
.future-coupon__price {text-align: right;}
.future-coupon__title {
}
.future-coupon__cats {
}
.future-coupon__cat {
}
.future-coupon__note {
}
.future-coupon__actions {
}
a.future-coupon__btn {color: #000000;}
a.future-coupon__btn.future-coupon__btn--tel {
}
a.future-coupon__btn.future-coupon__btn--hp {
}
a.future-coupon__btn.future-coupon__btn--rakuten {
}
a.future-coupon__btn.future-coupon__btn--web {
}
.future-coupon__toggle {
}
.future-coupon__more {
}

/* ===== 店舗情報ブロック ===== */
.store-wrapper {width: 100%;}
.store-info {
}
.store-info img {
}
.store-name {
}
.store-address {
}
.store-phone {
}
.details-button {
}
.store-details {
}
.details_bg {
}
.column {
}
.left-column {
}
.right-column {
}
.map-container {
}

/* ===== パンくず・ヒーロー・イントロ ===== */
.breadcrumb {
}

#feature-hero-wrap{
	width: 90%;
	margin: auto;
}
.feature-hero-wrap {margin: 25px 0;}
.feature-hero {
}
.feature-title {font-size: 30px;}

.feature-intro { margin: 25px 0; }
.feature-intro img{
	margin: 25px 0; }

.feature-toc {/* background: #AAA; */padding: 25px 0;}
.feature-toc__list {list-style: none;font-size: 14px;}
.feature-empty {
}
#mokuji {
    background: #333;
    color: #FFF;
    font-size: 27px;
    padding: 8px;
    margin: 25px auto;
}
ul.feature-toc__list a {
    /* color: #861a1a; */
    color: #FF2D55;
    margin-bottom: 20px;
    text-align: left;
    border-bottom: solid 2px #FF2D55;
}
/* ===== ページネーション ===== */
.pagination {
}
/* ========== Future Coupon 基本設計 ========== */
.future-coupon-container{
  display: grid;
  gap: 16px;
}

.future-coupon{
  border: 1px solid #333;
  padding: 34px 16px;
  background: #f0f0f0;
  /* box-shadow: 0 3px 10px rgba(0,0,0,.04); */
  /* border: solid; */
  /* border-top: 20px solid; */
}

/* 初期非表示用（JSの保険） */
.future-coupon--hidden{ display:none; }

/* ヘッダー（カテゴリ＋タイトル） */
.future-coupon__header{
  display: grid;
  gap: 8px;
  margin-bottom: 8px;
}

/* カテゴリ（“箴言めいたタグ”の装い） */
.future-coupon__cat{
  display:inline-block;
  font-size: 12px;
  line-height: 1;
  letter-spacing: .02em;
  padding: 6px 10px;
  border-radius: 5px;
  background: #ffffff;
  color: #000000;
  border: 1px solid #000000;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* タイトル（本文） */
.future-coupon__title{
  font-size: 15px;
  line-height: 1.6;
  font-weight: 600;
  color: #1b1b1f;
  word-break: break-word;
}

/* 価格は大きめ・視線を吸う */
.future-coupon__price{
  margin-top: 6px;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: .01em;
  /* color: #FF2D55; */ /* 深い緑。金額＝安心の色相 */
  /* background: #FFF; */
}

/* 備考 */
.future-coupon__note{
  margin-top: 6px;
  font-size: 12.5px;
  line-height: 1.6;
  color: #5b5b66;
  background: #fafbfc;
  border: 1px dashed #e6e6ea;
  padding: 8px 10px;
  border-radius: 8px;
}

/* アクション列（電話・HP・楽天） */
.future-coupon__actions{
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  background: #FF;
}

.future-coupon__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px 14px;
  border-radius: 5px;
  font-size: 11px;
  font-weight: 600;
  text-decoration: none;
  border: 1px solid transparent;
  transition: transform .04s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
  will-change: transform;
  /* color: #FFF; */
  border: solid 1px;
  background: #FFF;
}

/* それぞれの“装い分け” */
.future-coupon__btn--tel{
  /* background: #000000; */
  color: #0f6a36;
  border-color: #000000;
  /* color: #FFF; */
}
.future-coupon__btn--tel:hover{
  box-shadow: 0 4px 14px rgba(15,106,54,.12);
  transform: translateY(-1px);
}

.future-coupon__btn--hp{
  /* background: #000000; */
  color: #c61f55; /* Hotpepperの気配 */
  border-color: #000000;
}
.future-coupon__btn--hp:hover{
  box-shadow: 0 4px 14px rgba(198,31,85,.12);
  transform: translateY(-1px);
}

.future-coupon__btn--rakuten{
  /* background: #000000; */
  color: #b60011; /* Rakutenの気配 */
  border-color: #000000;
}
.future-coupon__btn--rakuten:hover{
  box-shadow: 0 4px 14px rgba(182,0,17,.12);
  transform: translateY(-1px);
}

/* “もっと見る” トグル */
.future-coupon__toggle{
  text-align: center;
  margin-top: 2px;
}
.future-coupon__more{
  appearance: none;
  border: 1px solid #000000;
  background: #ffffff;
  color: #000000;
  border-radius: 5px;
  font-size: 13px;
  font-weight: 700;
  padding: 10px 38px;
  cursor: pointer;
  transition: box-shadow .2s ease, transform .04s ease, background .2s ease;
}
button.future-coupon__btn-more {
    font-size: 13px;
    color: #333;
    border: solid 1px;
    background: #ffffff;
    font-weight: 600;
    padding: 5px 15px;
    border-radius: 5px;
    width: 100%;
}
.future-coupon__more:hover{
  box-shadow: 0 4px 14px rgba(0,0,0,.08);
  transform: translateY(-1px);
}
/* =========================
   ① タブレット（iPad）用
   768px 以上
   ========================= */
@media (min-width: 768px) {

  /* 余白は控えめに（まずは10%） */
  #feature_upper { padding: 0 10%; }
  #feature_under { padding: 25px 10%; }

  /* 横並びにするための指定（これが重要） */
  .store-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;           /* 任意：カード間のすき間 */
    width: 100%;
  }
  /* 2列（幅50%）。gapの分だけ少し引くならcalcでもOK */
  .store-info {
    /* flex: 1 1 calc(50% - 24px); */
    padding: 30px 20px;
    margin: 20px;           /* 余白は親のgapで管理 */
    box-sizing: border-box;
    width: 50%;
    margin: 50px 0 25px;
  }
}

/* =========================
   ② PC 用
   1200px 以上
   ========================= */
@media (min-width: 1200px) {

  /* PC は左右の余白をちょい狭める（まずは4%〜8%程度がおすすめ） */
  #feature_upper { padding: 0 15%; }
  #feature_under { padding: 25px 25%; }

  .store-wrapper { gap: 28px; }

  /* 列数はそのまま2列。3列にしたいなら↓を使う
     .store-info { flex: 1 1 calc(33.333% - 28px); }
  */
  .store-info {
  /* flex: 1 1 calc(50% - 28px); */
  padding: 20px 20px;
  margin: 25px 0;
  width: 33.3%;
  }
}
@charset "utf-8";
/*
Theme Name: Lifestyle Child
Template: lifestyle
*/


html, body {
  overflow-x: hidden;
}

.fade-line {
  opacity: 0;
  transform: translateY(20px);
  animation: fadeUp 0.8s ease-out forwards;
}

.line1 { animation-delay: 0.2s; }
.line2 { animation-delay: 0.5s; }
.line3 { animation-delay: 0.8s; }
.line4 { animation-delay: 1.2s; }

*, *::before, *::after {
    box-sizing: border-box;
}
.toppage-list {
    list-style: none;
    padding: 0;
    display: flex;
    flex-wrap: wrap;
    gap: 1rem; /* 項目間の隙間 */
}

.toppage-list li {
    border: 1px solid black;
    padding: 0.5rem 1rem;
    position: relative;
}

.toppage-list li::after {
    content: "＞";
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
}

/* Header */
#toppage_header {
  text-align: center;
  padding: 1em;
}
.toppage_logo-image {
  max-width: 200px;
  height: auto;
}

/* トップページ */
#toppage_hero-visual {
  position: relative;
  text-align: center;
  color: #24262a;
  border-bottom: solid 2px;
}
#toppage_hero-bg {
  width: 100%;
  height: 100%;
  object-fit: cover;
  position: absolute;
  top: 0;
  left: 0;
  z-index: -1;
  /* filter: brightness(0.6); */
}
#toppage_hero-content {
  position: relative;
  padding: 3em 10% 14em;
  overflow: hidden;
}
/* フェードアップアニメーション定義 */
@keyframes fadeUp {
  from {
    opacity: 0;
    transform: translateY(20px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

/* アニメーション共通設定 */
.fade-line {
  opacity: 0;
  transform: translateY(20px);
  animation: fadeUp 0.8s ease-out forwards;
}

/* 各行ごとにディレイ設定（順番にふわっと） */
.line1 { animation-delay: 0.2s; }
.line2 { animation-delay: 0.5s; }
.line3 { animation-delay: 0.8s; }
.line4 { animation-delay: 1.2s; }

#toppage_hero-title {
  line-height: 89px;
  font-size: 80px;
  margin: 0;
}
#toppage_hero-subtitle {
  font-size: 18px
  margin-top: 1em;
}
.scroll-indicator {
  position: absolute;
  bottom: 0;
  left: 50%;
  height: 111px;
  transform: translateX(-50%);
  text-align: center;
  font-size: 14px;
  color: #000; /* 必要に応じて調整 */
}

.scroll-indicator::after {
  content: "";
  position: absolute;
  top: 44px;
  left: 50%;
  transform: translateX(-50%);
  width: 1px;
  height: 84px;
  background-color: #000; /* 線の色：必要に応じて変更 */
  opacity: 0;
  animation: pathmove 1.4s ease-in-out infinite;
}

@keyframes pathmove {
  0% {
    opacity: 0;
    transform: translate(-50%, 0);
  }
  50% {
    opacity: 1;
    transform: translate(-50%, 40px);
  }
  100% {
    opacity: 0;
    transform: translate(-50%, 80px);
  }
}

/* About Section */
#toppage_about {
  padding: 50px 0;
  /* background: #f9f9f9; */
  /* text-align: center; */
  width: 90%;
  margin: auto;
  border-bottom: solid 1px;
}
.toppage_intro-message{
    font-size: 2rem;
    font-weight: bold;
    margin: 0.5em 0;
    text-align: center;
}

.toppage_intro-title {
  font-size: 18px;
  margin: 0.5em 0;
  text-align: center;
  font-weight: bold;
}
.toppage_intro-description {
  font-size: 18px;
  width: 80%;
  text-align: center;
  margin: 50px auto;
  font-weight: bold;
  line-height: 43px;
}
footer{
	/* text-align:center; */
	font-size: 10px;
	text-align: center;
	margin-top: 50px;
}
/* 768px以下の画面幅で適用されるスタイル */
@media (max-width: 768px) {
  .toppage-list {

  }

  .toppage-list li {

  }

  .toppage-list li::after {

  }

  /* Header */
  #toppage_header {

  }

  .toppage_logo-image {

  }

  /* トップページ */
  #toppage_hero-visual {

  }

  #toppage_hero-bg {

  }

  #toppage_hero-content {

  }

  #toppage_hero-title {
    line-height: 40px;
    font-size: 40px;
    margin: 20px auto;
    text-align: left;
  }

  #toppage_hero-subtitle {

  }

  /* About Section */
  #toppage_about {width: 80%;}

  .toppage_intro-message {font-size: 25px;text-align: left;}

  .toppage_intro-title {font-size: 15px;text-align: left;line-height: 32px;}

  .toppage_intro-description {width: 100%;font-size: 15px;line-height: 33px;text-align: left;}

}



/* ===== 特集ページ　レイアウト全体 ===== */
#feature_upper {
    padding: 0 5%;
}
#feature_under {
    padding: 25px 5%;
    margin: 25px auto;
    background: #fbf9f9;
}
#feature_main{/* width: 90%; */margin: auto;padding: 25px 0;}
h2.feature-card__title {
    font-size: 30px;
    margin: 25px 0;
    /* background: #333; */
    /* color: #FFF; */
    display: inline;
    padding: 1px;
}
#feature_main p {
    font-size: 14px;
    line-height: 22px;
}
h2{ font-size: 24px;}
#feature_main h2 {
    /* font-size: 24px; */
}
#feature_main h3 {
    font-size: 18px;
}
.feature-card__area {
    background: #333;
    display: table;
    background: #333;
    color: #FFF;
    padding: 5px 10px;
}
.feature-grid {/* background: #f5f5f5; */}
.feature-card__pr-title {
						 font-size: 24px;
						 text-align: center;
						 width: 100%;
						 margin: 25px auto;
}
.feature-card {/* width: 90%; */margin: 25px auto;padding: 25px 0;border-top: solid;}
.feature-card ul {
  
}
.feature-card li {
	list-style: disc inside; /* リストマーカーを内側に */
	font-size: 15px;
	margin: 0px 0px;
	}
.feature-card__link {
}
h3.feature-card__title {font-size: 28px;margin: 25px 0;border-bottom: solid;padding: 25px 0;}
.feature-card__excerpt {
}
.feature-card__mini-body {margin: 25px 0;}
.feature-card__mini-body img{
	margin:25px 0;
}
.feature-card__cta {margin: 25px 0;/* text-align: center; *//* border-bottom: solid; *//* display: inline-block; *//* color: #de4759; */font-size: 14px;}
.cta-line1 {
}
.cta-line2 a {color: #FFF;color: #FF2D55;margin-bottom: 20px;text-align: left;border-bottom: solid 2px #FF2D55;}
/* ===== クーポン（future-coupon） ===== */
.future-coupon-container {
}
.future-coupon {
}
.future-coupon--hidden {
}
.future-coupon__header {
}
.future-coupon__price {text-align: right;}
.future-coupon__title {
}
.future-coupon__cats {
}
.future-coupon__cat {
}
.future-coupon__note {
}
.future-coupon__actions {
}
a.future-coupon__btn {color: #000000;}
a.future-coupon__btn.future-coupon__btn--tel {
}
a.future-coupon__btn.future-coupon__btn--hp {
}
a.future-coupon__btn.future-coupon__btn--rakuten {
}
a.future-coupon__btn.future-coupon__btn--web {
}
.future-coupon__toggle {
}
.future-coupon__more {
}

/* ===== 店舗情報ブロック ===== */
.store-wrapper {width: 100%;}
.store-info {width: 100%;padding: 20px;}
.store-info img {
}
.store-name {
}
.store-address {
}
.store-phone {
}
.details-button {
}
.store-details {
}
.details_bg {
}
.column {
}
.left-column {
}
.right-column {
}
.map-container {
}

/* ===== パンくず・ヒーロー・イントロ ===== */
.breadcrumb {
}

#feature-hero-wrap{
	width: 90%;
	margin: auto;
}
.feature-hero-wrap {margin: 25px 0;}
.feature-hero {
}
.feature-title {font-size: 30px;}

.feature-intro { margin: 25px 0; }
.feature-intro img{
	margin: 25px 0; }

.feature-toc {/* background: #AAA; */padding: 25px 0;}
.feature-toc__list {list-style: none;font-size: 14px;}
.feature-empty {
}
#mokuji {
    background: #333;
    color: #FFF;
    font-size: 27px;
    padding: 8px;
    margin: 25px auto;
}
ul.feature-toc__list a {
    /* color: #861a1a; */
    color: #FF2D55;
    margin-bottom: 20px;
    text-align: left;
    border-bottom: solid 2px #FF2D55;
}
/* ===== ページネーション ===== */
.pagination {
}
/* ========== Future Coupon 基本設計 ========== */
.future-coupon-container{
  display: grid;
  gap: 16px;
}

.future-coupon{
  border: 1px solid #333;
  padding: 34px 16px;
  background: #f0f0f0;
  /* box-shadow: 0 3px 10px rgba(0,0,0,.04); */
  /* border: solid; */
  /* border-top: 20px solid; */
}

/* 初期非表示用（JSの保険） */
.future-coupon--hidden{ display:none; }

/* ヘッダー（カテゴリ＋タイトル） */
.future-coupon__header{
  display: grid;
  gap: 8px;
  margin-bottom: 8px;
}

/* カテゴリ（“箴言めいたタグ”の装い） */
.future-coupon__cat{
  display:inline-block;
  font-size: 12px;
  line-height: 1;
  letter-spacing: .02em;
  padding: 6px 10px;
  border-radius: 5px;
  background: #ffffff;
  color: #000000;
  border: 1px solid #000000;
  max-width: 100%;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
}

/* タイトル（本文） */
.future-coupon__title{
  font-size: 15px;
  line-height: 1.6;
  font-weight: 600;
  color: #1b1b1f;
  word-break: break-word;
}

/* 価格は大きめ・視線を吸う */
.future-coupon__price{
  margin-top: 6px;
  font-size: 17px;
  font-weight: 700;
  letter-spacing: .01em;
  /* color: #FF2D55; */ /* 深い緑。金額＝安心の色相 */
  /* background: #FFF; */
}

/* 備考 */
.future-coupon__note{
  margin-top: 6px;
  font-size: 12.5px;
  line-height: 1.6;
  color: #5b5b66;
  background: #fafbfc;
  border: 1px dashed #e6e6ea;
  padding: 8px 10px;
  border-radius: 8px;
}

/* アクション列（電話・HP・楽天） */
.future-coupon__actions{
  margin-top: 10px;
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  background: #FF;
}

.future-coupon__btn{
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 10px 14px;
  border-radius: 5px;
  font-size: 11px;
  font-weight: 600;
  text-decoration: none;
  border: 1px solid transparent;
  transition: transform .04s ease, box-shadow .2s ease, background .2s ease, color .2s ease;
  will-change: transform;
  /* color: #FFF; */
  border: solid 1px;
  background: #FFF;
}

/* それぞれの“装い分け” */
.future-coupon__btn--tel{
  /* background: #000000; */
  color: #0f6a36;
  border-color: #000000;
  /* color: #FFF; */
}
.future-coupon__btn--tel:hover{
  box-shadow: 0 4px 14px rgba(15,106,54,.12);
  transform: translateY(-1px);
}

.future-coupon__btn--hp{
  /* background: #000000; */
  color: #c61f55; /* Hotpepperの気配 */
  border-color: #000000;
}
.future-coupon__btn--hp:hover{
  box-shadow: 0 4px 14px rgba(198,31,85,.12);
  transform: translateY(-1px);
}

.future-coupon__btn--rakuten{
  /* background: #000000; */
  color: #b60011; /* Rakutenの気配 */
  border-color: #000000;
}
.future-coupon__btn--rakuten:hover{
  box-shadow: 0 4px 14px rgba(182,0,17,.12);
  transform: translateY(-1px);
}

/* “もっと見る” トグル */
.future-coupon__toggle{
  text-align: center;
  margin-top: 2px;
}
.future-coupon__more{
  appearance: none;
  border: 1px solid #000000;
  background: #ffffff;
  color: #000000;
  border-radius: 5px;
  font-size: 13px;
  font-weight: 700;
  padding: 10px 38px;
  cursor: pointer;
  transition: box-shadow .2s ease, transform .04s ease, background .2s ease;
}
button.future-coupon__btn-more {
    font-size: 13px;
    color: #333;
    border: solid 1px;
    background: #ffffff;
    font-weight: 600;
    padding: 5px 15px;
    border-radius: 5px;
    width: 100%;
}
.future-coupon__more:hover{
  box-shadow: 0 4px 14px rgba(0,0,0,.08);
  transform: translateY(-1px);
}
/* =========================
   ① タブレット（iPad）用
   768px 以上
   ========================= */
@media (min-width: 768px) {

  /* 余白は控えめに（まずは10%） */
  #feature_upper { padding: 0 10%; }
  #feature_under { padding: 25px 10%; }

  /* 横並びにするための指定（これが重要） */
  .store-wrapper {
    display: flex;
    flex-wrap: wrap;
    gap: 24px;           /* 任意：カード間のすき間 */
    width: 100%;
  }
  /* 2列（幅50%）。gapの分だけ少し引くならcalcでもOK */
  .store-info {
    /* flex: 1 1 calc(50% - 24px); */
    padding: 30px 20px;
    margin: 20px;           /* 余白は親のgapで管理 */
    box-sizing: border-box;
    width: 50%;
    margin: 50px 0 25px;
  }
}

/* =========================
   ② PC 用
   1200px 以上
   ========================= */
@media (min-width: 1200px) {

  /* PC は左右の余白をちょい狭める（まずは4%〜8%程度がおすすめ） */
  #feature_upper { padding: 0 15%; }
  #feature_under { padding: 25px 25%; }

  .store-wrapper { gap: 28px; }

  /* 列数はそのまま2列。3列にしたいなら↓を使う
     .store-info { flex: 1 1 calc(33.333% - 28px); }
  */
  .store-info {
  /* flex: 1 1 calc(50% - 28px); */
  padding: 20px 20px;
  margin: 25px 0;
  width: 33.3%;
  }
}