/* ==============================================
メインスライダー
============================================== */
@media (min-width: 821px) {
.p-top-slider .swiper--pagination{
	display: flex;
	flex-direction: column;
    justify-content: center;
    gap: 16px;
    width: 10px;
    height: auto;
    top: 0;
    left: auto;
    right: 40px;
    bottom: 0;
	}
}
	
.ls_normal{
	letter-spacing: normal;
	}
.swiper-slide{position: relative;}

.brand-story-box {
  display: flex; 
  align-items: center;
  justify-content: space-between;
  background-color: rgba(255, 255, 255, 0.75);
  padding: 15px 25px;
  width: 430px;
  box-sizing: border-box;
  position: absolute;
  bottom: 5%;
  left: 50%;
  transform: translateX(-50%);
}

/* 左側のテキストエリア */
.box-text-content {
  flex: 1;
  line-height: 1.6;
  text-align: left;
}
.box-category {
  font-size: 16px;
  margin: 0 0 10px 0;
  letter-spacing: 0.05em;
}
.box-title {
  font-size: 16px;
  letter-spacing: 0.05em;
  white-space: nowrap;
}
.box-text-content .new_ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-main); 
  color: #fff;
  font-size: 12px;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  flex-shrink: 0;
  font-family: Optima, Zen Old Mincho, serif;
  margin-right: 20px;
  line-height: 1;
}

/* 右側のmoreリンクエリア */
.box-more{
  border-left: 1px solid #d8d8d8;
  padding: 10px 3px 10px 25px;
  display: flex;
  align-items: center;
  justify-content: center;
}
.box-more img {
  display: block;
  width: 35px;
  height: auto;
}
.slide-text {
	position: absolute;
	top: 12%;
	left: 5%;
	opacity: 1;/*時限式の時は0を設定*/
}
.slide-text_note{
	font-size: 0.6rem;
	line-height: 15px;
	display: block;
	margin: 25px 0 0;
	color: var(--color-text-sub);
	font-family: Yu Gothic Medium, YuGothic, Yu Gothic, Noto Sans JP, sans-serif;
}

/*FV 時限出現*/
/*
.slide-img-box {
	opacity: 0;
}
.swiper-slide-active .slide-text {
	animation: fadeIn 1s ease-in-out 0.7s forwards;
}
.swiper-slide-active .slide-img-box {
    animation: fadeIn 1s ease-in-out 1.0s forwards;
}
.swiper-slide-prev .slide-text,
.swiper-slide-next .slide-text,
.swiper-slide-prev .slide-img-box,
.swiper-slide-next .slide-img-box {
	opacity: 1;
}
@keyframes fadeIn {
	0% { opacity: 0; }
    100% { opacity: 1; }
}*/

.text-02 picture img { width: 300px; }
.text-03 picture img { width: 450px; }
.text-04 picture img { width: 300px; }


/* ==================================
メインスライダー：スマホ用
================================== */
@media screen and (max-width: 768px) {
  .p-top-slider .swiper--pagination {
    position: absolute;
    right: 0;
    left: 0;
    bottom: 16px;
    z-index: 101;
    margin: 0 auto;
    height: 10px;
    font-size: 0;
    text-align: center;
}
.slide-text {
	position: absolute;
	top: 8%;
	left: 50%;
    transform: translateX(-50%);
	opacity: 1;/*時限式出現の時は0*/
	width: 85%;
}
.slide_box__wrapper{
	padding: 0 min(10%, 60px);
	position: absolute;
    bottom: 7%;
	left: 0;
	transform: translateX(0);
	width: 100%;
}
.brand-story-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    background-color: rgba(255, 255, 255, 0.75);
    padding: 4% 5%;
    width: 100%;
    box-sizing: border-box;
	position: relative;
    /*position: absolute;
    bottom: 7%;
    left: 50%;
    transform: translateX(-50%);*/
}
.box-text-content {
  flex: 1;
  line-height: 1.6;
  text-align: left;
  padding: 0 10px 0 0;
}
.box-title {
    font-size: 12px;
    letter-spacing: 0.05em;
    white-space: nowrap;
}
.box-more img {
    display: block;
    width: 27px;
    height: auto;
}
.box-more {
    border-left: 1px solid #d8d8d8;
	padding: 2% 0 2% 6%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.box-text-content .new_ico {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  background-color: #c00;
  color: #fff;
  font-size: 12px;
  width: 50px;
  height: 50px;
  border-radius: 50%;
  flex-shrink: 0;
  font-family: Optima, Zen Old Mincho, serif;
  margin-right: 15px;
  line-height: 1;
}
.slide-text picture {
  display: block;
  text-align: center;
}
.slide-text picture img {
  height: auto;
  margin: 0 auto;
  display: inline-block;
}
.text-02 picture img { width: 67%; }
.text-03 picture img { width: 100%; }
.text-04 picture img { width: 67%; }

.slide-text_note {
    font-size: 0.6rem;
    line-height: 15px;
    display: block;
    margin: 25px 0 0;
    color: var(--color-text-sub);
    font-family: Yu Gothic Medium, YuGothic, Yu Gothic, Noto Sans JP, sans-serif;
    text-align: center;
	letter-spacing: -0.05em;
}
	
}



/* ==============================================
TOPICS
============================================== */
  .aurelie-topic-card {
    text-align: left;
    display: flex;
    flex-direction: column;
    height: 100%;
    font-family: Yu Gothic Medium, YuGothic, Yu Gothic, Noto Sans JP, sans-serif;
  }
  .aurelie-card-img-wrapper {
    aspect-ratio: 3 / 2;
    overflow: hidden;
    margin-bottom: 20px;
  }
  .aurelie-card-img-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: transform 0.3s ease;
  }
  .aurelie-card-meta {
    font-size: 15px;
    color: #8f8f8f;
    margin-bottom: 12px;
    display: flex;
    justify-content: space-between;
  }
	.aurelie-card-meta .date{
		font-family: Optima, Zen Old Mincho, serif;
	}
  .aurelie-card-title {
    font-size: 15px;
    line-height: 1.6;
    margin: 0 0 7px;
    display: -webkit-box !important;
    -webkit-box-orient: vertical !important;
    -webkit-line-clamp: 2 !important; /* 2行制限 */
    overflow: hidden !important;
  }
  .aurelie-read-more {
    font-size: 13px;
    text-align: center;
    display: block;
    margin-top: auto;
    text-decoration: none;
    border-bottom: 1px solid #8f8f8f; /* 下線を引く */
    width: fit-content;
    margin-inline: auto;
    padding-bottom: 2px;
    transition: opacity 0.3s;
  }
  .aurelie-custom-fraction {
    font-size: 16px;
    color: #8f8f8f;
    letter-spacing: 0.2em;
	  text-align: center;
	  font-family: Optima, Zen Old Mincho, serif;
  }
  .swiper-button-next::after, 
  .swiper-button-prev::after {
    color: #2d2d2d;
    font-size: 20px !important;
  }
  .aurelie-topicsSwiper {
    padding-bottom: 10px;
  }
  .aurelie-slider-wrapper {
    position: relative;
  }
#p-topics .aurelie-slider-wrapper{
	margin-bottom: 20px;
}

.swiper-button-disabled::after {
  color: #d4d4d4!important;
}
  
/* PC・タブレットで左右に矢印のスペース（約50pxずつ）を確保 */
@media screen and (min-width: 768px) {
    .aurelie-slider-wrapper {
      padding: 0 50px; 
    }
    .aurelie-slider-wrapper .swiper-button-prev {
      left: 0;
    }
    .aurelie-slider-wrapper .swiper-button-next {
      right: 0;
    }
  }

  /* 矢印の縦位置を画像の中央付近に合わせる微調整（必要に応じて%を変更してください） */
  #p-topics .aurelie-slider-wrapper .swiper-button-next,
  #p-topics .aurelie-slider-wrapper .swiper-button-prev {
    top: 29%; 
  }

/* ==================================
TOPICS：スマホ用
================================== */
@media screen and (max-width: 768px) {
  #p-topics .aurelie-slider-wrapper .swiper-button-next,
  #p-topics .aurelie-slider-wrapper .swiper-button-prev {
    top: 27%; 
  }
.swiper-button-next, .swiper-rtl .swiper-button-prev {
    right: 10.3%;
    left: auto;
}
.swiper-button-prev, .swiper-rtl .swiper-button-next {
    left: 10.3%;
    right: auto;
}
.aurelie-card-meta {
    font-size: 15px;
    color: #8f8f8f;
    margin-bottom: 7px;
    display: flex;
    justify-content: space-between;
}
#p-topics .aurelie-slider-wrapper{
	margin-bottom: 25px;
}
  .swiper-button-next::after, 
  .swiper-button-prev::after {
    color: #2d2d2d;
    font-size: 16px !important;
  }

}


/* ==============================================
レコメンド・NEW ITEM
============================================== */
  .product-section-inner {
    max-width: 800px;
    margin: 0 auto;
  }

  /* 商品リスト（ul） */
  .product-list {
    display: flex;
    flex-wrap: wrap;
	  justify-content: center;
    list-style: none;
    padding: 0;
    gap: 20px;
  }

  /* 商品アイテム（li） */
  .product-item {
  /* 4枚並んだ時の1枚あたりの幅を計算 (隙間20px * 3個分を引いて4等分) */
  width: calc((100% - 60px) / 4); 
  display: flex;
  flex-direction: column;
  height: auto;
}

  /* 商品画像エリア */
  .product-image {
    width: 100%;
    aspect-ratio: 1 / 1;
    margin-bottom: 20px;
    overflow: hidden;
    background-color: #f7f7f7; 
  }
.product-image {
  overflow: hidden; 
}
.product-image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transform: scale(1.15); 
}

@keyframes imageZoomOut {
  0% {
    transform: scale(1.15);
  }
  100% {
    transform: scale(1);
  }
}

.is-active .product-image img {
  /* 2.5秒かけてズームアウトし、開始を0.3秒遅らせる */
  animation: imageZoomOut 2.5s cubic-bezier(0.25, 1, 0.5, 1) 0.3s forwards;
}

  /* テキストエリア */
  .product-info {
    display: flex;
    flex-direction: column;
    flex-grow: 1;
}

  .product-name {
    font-size: 19px;
    line-height: 1.5;
    margin-bottom: 12px;
    font-weight: normal;
    min-height: 3em;
	  font-family: Optima, Zen Old Mincho, serif;
	  letter-spacing: -0.2em;
  }

  .product-desc {
    font-size: 13px;
    line-height: 1.6;
    color: #8f8f8f;
    margin-bottom: 15px;
  }

  .product-list .note {
    font-size: 10px;
    display: block;
	width: 100%;
	  text-align: left;
	  color: var(--color-text-sub);
  }

  .product-price {
    margin-top: auto;
    font-size: 13px;
    font-family: Zen Old Mincho, serif;
  display: flex;
  justify-content: space-between;
  align-items: baseline;
  }
	
.price-group {
  text-align: right;
}

  .price-value {
    font-size: 18px;
  }

  .tax {
    font-size: 9px;
  }
	.p-top-lineUp__btn_02{
		max-width: 512px;
    width: 48.3018867925%;
    margin: 0 auto;
    padding: 23px 0;
    font-size: 1.125rem;
		margin-top: 50px;
	}
.product-item > a {
  display: flex;
  flex-direction: column;
  height: 100%;
  text-decoration: none;
  color: inherit;
}

.product-info {
  display: flex;
  flex-direction: column;
  flex-grow: 1; 
}
	
/* ==================================
レコメンド・NEW ITEM：スマホ用
================================== */
@media screen and (max-width: 768px) {
#p-top-recommend .product-item {
	width: calc((100% - 20px) / 2);
    display: flex;
    flex-direction: column;
    height: auto;
    margin-bottom: 40px; /* ここを追加 */
}

/* 最後の2つのアイテム（最後の行）の下余白を消す */
#p-top-recommend .product-item:nth-last-child(-n+2) {
    margin-bottom: 0;
}
  .product-section-inner {
    margin: 0 auto;
    padding: 0 min(10%, 60px);
  }
	
.product-item {
    width: calc((100% - 20px) / 2);
    display: flex;
    flex-direction: column;
    height: auto;
}
.product-name {
    font-size: 3.7vw;
    line-height: 1.5;
    margin-bottom: 12px;
    font-weight: normal;
    min-height: 3em;
	font-family: Optima, Zen Old Mincho, serif;
	letter-spacing: -0.2em;
}
.product-desc {
    font-size: 3vw;
    line-height: 1.6;
    color: #8f8f8f;
    margin-bottom: 15px;
}
.product-list .note {
    font-size: 2.2580645161vw;
    display: block;
    width: 100%;
    text-align: left;
    color: var(--color-text-sub);
}
.product-price {
    margin-top: auto;
    font-family: Zen Old Mincho, serif;
    display: flex;
    justify-content: space-between;
    align-items: baseline;
    font-size: 11px;
}
.price-value {
    font-size: 16px;
}
.p-top-lineUp__btn_02 {
    max-width: 512px;
    width: 100%;
    margin: 0 auto;
    padding: 15px 0;
    font-size: 0.9rem;
    margin-top: 50px;
}

}


/* ==============================================
ランキング
============================================== */
.ranking-section-inner{
    max-width: 685px;
    margin: 0 auto;
  }
.ranking-item {
    width: calc((100% - 80px) / 5);
    display: flex;
    flex-direction: column;
    height: auto;
	position: relative;
}
.badge {
  position: absolute;
  top: 5px;
  left: 5px;
  z-index: 10;
  width: 20px;
  height: 20px;
}
.ranking-name {
    font-size: 12px;
    line-height: 1.5;
    margin-bottom: 12px;
    font-weight: normal;
    min-height: 3em;
	font-family: Optima, Zen Old Mincho, serif;
	letter-spacing: -0.2em;
}
.ranking-desc {
    font-size: 9px;
    line-height: 1.6;
    color: #8f8f8f;
}
.ranking-note {
  font-size: 10px;
  color: #8f8f8f;
  text-align: left;
  margin-top: 15px;
  display: block;
}

/* ==================================
ランキング：スマホ用
================================== */
@media screen and (max-width: 768px) {
  .ranking-section-inner {
    padding-right: 0; 
    box-sizing: border-box;
    overflow: hidden; /* 親のハミ出しを防止 */
  }

  .ranking-section-inner .product-list {
    display: flex; /* 明示的に指定 */
    flex-wrap: nowrap; 
    overflow-x: auto;  
    justify-content: flex-start; 
    -webkit-overflow-scrolling: touch; 
    gap: 15px;
    list-style: none;
    margin: 0;
	padding: 0 min(10%, 60px);
  }

/* 既存のデフォルトスクロールバーを完全に隠す */
  .ranking-section-inner .product-list::-webkit-scrollbar {
    display: none;
  }
  .ranking-section-inner .product-list {
    -ms-overflow-style: none; /* IE, Edge用 */
    scrollbar-width: none; /* Firefox用 */
    padding-bottom: 10px; /* 余白を調整 */
  }

  /* ★ここに追加：カスタムスクロールバーのデザイン */
  .custom-scrollbar {
    /*width: calc(100% - 30px);*/
    height: 3px; /* お好みの太さに */
    background: #f0f0f0;
    border-radius: 2px;
    position: relative;
    overflow: hidden;
	margin: 5px min(10%, 60px) 15px;
  }

  .custom-scrollbar-thumb {
    width: 50%; /* 赤いバーの長さ（JSで動的に計算も可能ですが、固定のほうが見栄えが良いことが多いです） */
    height: 100%;
    background: #c00;
    border-radius: 2px;
    position: absolute;
    top: 0;
    left: 0;
    /* スクロールに滑らかに追従させる */
    will-change: transform;
  }

  /* アイテムの幅設定 */
  .ranking-item {
    flex: 0 0 35%; 
    width: 35%; 
    position: relative; /* badgeの基準 */
  }

  /* --- 以下、既存のスタイルを維持 --- */
  .badge {
    position: absolute;
    top: 5px;
    left: 5px;
    z-index: 10;
    width: 17px;
    height: 17px;
  }

  .ranking-name {
    font-size: 3.1vw;
    line-height: 1.5;
    margin-top: 10px;
    margin-bottom: 12px;
    font-weight: normal;
    min-height: 3em;
    font-family: Optima, Zen Old Mincho, serif;
    /* letter-spacing: -0.2em; は文字が重なりすぎるため-0.02em等の誤記か確認してください */
  }
  .ranking-note {
  font-size: 2.2580645161vw;
  color: #8f8f8f;
  text-align: left;
  margin-top: 15px;
  display: block;
  padding: 0 0 0 min(10%, 60px);
}
.ranking-desc {
    font-size: 2.5vw;
    line-height: 1.6;
    color: #8f8f8f;
}
  
  /* アニメーション関連 */
  /*.ranking-section-inner.js-fadeUp .ranking-item {
    opacity: 0;
    transform: translateX(80px); 
  }
  .ranking-section-inner.js-fadeUp.is-active .ranking-item {
    animation: fadeRightElegant 2.5s cubic-bezier(0.22, 1, 0.36, 1) forwards;
  }
  @keyframes fadeRightElegant {
    0% { opacity: 0; transform: translateX(80px); }
    100% { opacity: 1; transform: translateX(0); }
  }*/
}


/* ==============================================
プロダクトコンセプト
============================================== */
.p-top-concept__title {
    margin-bottom: 30px;
    font-family: Zen Old Mincho, serif;
    font-size: 2rem;
    color: var(--color-text-main);
    letter-spacing: .04em;
    line-height: 1.6;
	    text-align: center;
}
.p-top-concept-slider__ttl {
    text-align: center;
    color: var(--color-text-main);
    font-size: 1.4rem;
     margin: 0 auto;
	letter-spacing: .1em;
}
#p-product-concept .aurelie-slider-wrapper .swiper-button-next, .aurelie-slider-wrapper .swiper-button-prev {
    top: 31%;
}

/* ==================================
プロダクトコンセプト：スマホ用
================================== */
@media screen and (max-width: 768px) {
	.p-top-concept__title {
    margin-bottom: 30px;
    font-family: Zen Old Mincho, serif;
    font-size: 1.3rem;
    color: var(--color-text-main);
    letter-spacing: .04em;
    line-height: 1.6;
	    text-align: center;
}
.p-top-concept-slider__ttl {
    text-align: center;
    color: var(--color-text-main);
    font-size: 1.1rem;
    margin: 0 auto;
	letter-spacing: .1em;
}
	
  #p-product-concept .aurelie-slider-wrapper .swiper-button-next,
  #p-product-concept .aurelie-slider-wrapper .swiper-button-prev {
    top: 32%; 
  }
	
}


/* ==============================================
LINE UP
============================================== */
	.lineup-section-inner{
    max-width: 560px; /* 少し広げると4枚が綺麗に収まります */
    margin: 0 auto;
  }
	.lineup-item {
    width: calc((100% - 60px) / 4);
    display: flex;
    flex-direction: column;
    height: auto;
	position: relative;
}
.lineup-section-inner .badge {
  position: absolute;
  top: 5px;    /* 上からの距離 */
  left: 5px;   /* 左からの距離 */
  z-index: 10;  /* 画像より上に重ねる */
  
  /* 見た目の装飾 */
  background-color: #c80019; /* 赤色 */
  color: white;
  width: 20px;
  height: 20px;
  border-radius: 50%; /* 丸くする */
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 15px;
  font-family: Optima, Zen Old Mincho, serif;
  font-weight: bold;
}
.lineup-name {
    font-size: 12px;
    line-height: 1.5;
    margin-bottom: 12px;
    font-weight: normal;
    min-height: 3em;
}
.lineup-desc {
    font-size: 9px;
    line-height: 1.6;
    color: #8f8f8f;
    margin-bottom: 15px;
}
	.lineup-section-inner .product-image{
		width: 100%;
    aspect-ratio: 1 / 1;
    margin-bottom: 10px;
    overflow: hidden;
	}
	.lineup-c-name{
		font-family: Optima, Zen Old Mincho, serif;
		font-size: 1.4rem;
		margin-bottom: 30px;
	}
	.mb_40{
		margin-bottom: 40px;
	}

/* ==================================
LINE UP：スマホ用
================================== */
@media screen and (max-width: 768px) {
	.lineup-section-inner {
    max-width: 560px;
    margin: 0 auto;
	padding: 0 min(10%, 60px);
}
.lineup-item {
    width: calc((100% - 30px) / 3);
    display: flex;
    flex-direction: column;
    height: auto;
    position: relative;
}
	.lineup-section-inner .product-list{
		gap: 15px;
		justify-content: flex-start;
	}
.lineup-name {
    font-size: 2.8vw;
    line-height: 1.5;
    margin-bottom: 7px;
    font-weight: normal;
    min-height: 3em;
	font-family: Optima, Zen Old Mincho, serif;
	letter-spacing: -0.23em;
}
.lineup-c-name {
    font-family: Optima, Zen Old Mincho, serif;
    font-size: 1.2rem;
    margin-bottom: 30px;
}
.lineup-desc {
    font-size: 2.2vw;
    line-height: 1.6;
    color: #8f8f8f;
    margin-bottom: 15px;
}
}


/* ==============================================
バナー
============================================== */
.l-container__type10{
	max-width: 560px;
	margin: 72px auto 0;
	}

@media screen and (max-width: 768px) {
	.l-container__type10 {
    max-width: 560px;
    margin: 72px auto 0;
    padding: 0 min(10%, 60px);
}

}


/* ==============================================
SHOPリスト
============================================== */
/* セクション全体のスタイル（背景色など） */
.shop-list-section {
  background-color: #f4f4f4; /* 薄いグレーの背景 */
  padding: 10px min(10%, 60px);
  text-align: center;
}

.shop-category {
  margin: 0 auto 50px;
	width: 400px;
}

/* サブタイトル（両脇の線） */
.category-title {
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 1.4rem;
  color: #555;
  margin-bottom: 30px;
  letter-spacing: 0.1em;
  font-weight: normal;
font-family: Optima, Zen Old Mincho, serif;
}

.category-title::before{
  content: "";
  height: 1px;
  background-color: #aaa;
  width: 80px; /* 線の長さ */
  margin: 0 10px 0 0;
	flex: 1;
}

.category-title::after {
  content: "";
  height: 1px;
  background-color: #aaa;
  width: 80px; /* 線の長さ */
  margin: 0 0 0 10px;
	flex: 1;
}

/* リストの初期化 */
.offline-shop-list,
.online-shop-list {
  list-style: none;
  padding: 0;
  margin: 0;
}

/* --- オフラインショップ --- */
.offline-shop-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  gap: 44px; /* アイコン同士の余白 */
}

.offline-shop-list li a {
  display: block;
  transition: opacity 0.3s ease;
}

.offline-shop-list li {
  /*width: 28%;*/
  object-fit: contain;
}

.offline-shop_logo01{
	width: 20%;
}
.offline-shop_logo02{
	width: 32%;
}
.offline-shop_logo03{
	width: 26%;
}

/* --- オンラインショップ（白円の背景） --- */
.online-shop-list {
  display: grid;
  grid-template-columns: repeat(3, 110px); /* 100pxの円を3列 */
  gap: 20px 35px;
  justify-content: center;
}

.online-shop-list li a {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 110px;
  height: 110px;
}

.online-shop-list li {
  max-width: 100%;
  object-fit: contain;
}

/* 注意書きテキスト */
.shop-notice {
	font-family: Yu Gothic Medium, YuGothic, Yu Gothic, Noto Sans JP, sans-serif;
	font-size: 11px;
	color: #888;
	margin-top: 30px;
	margin-bottom: 60px;
	line-height: 1.6;
	max-width: 400px;
	margin-left: auto;
	margin-right: auto;
	text-align: left;
}
	.productList__return{
		margin: 115px 0 40px!important;
	}

/* ==================================
SHOPリスト：スマホ用
================================== */
@media screen and (max-width: 768px) {
  /* --- セクション全体 --- */
  .shop-category {
    margin: 0 auto 50px;
    width: 100%;
    padding: 0; 
    box-sizing: border-box;
  }

  /* --- タイトル --- */
  .category-title {
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 4vw;
    color: #555;
    margin-bottom: 30px;
    letter-spacing: 0.1em;
    font-weight: normal;
    font-family: Optima, Zen Old Mincho, serif;
  }

  /* --- オフラインショップ --- */
  .offline-shop-list {
    display: flex;
    justify-content: space-between; /* 均等に配置 */
    gap: 0; /* gapではなくspace-betweenで隙間を作る */
  }
  .offline-shop-list li {
    /*width: 30%;*/
  }
  .offline-shop-list li img {
    width: 100%; /* 親(li)に合わせて画像を伸縮させる */
    height: auto;
  }

  /* --- オンラインショップ --- */
  .online-shop-list {
    display: grid;
    grid-template-columns: repeat(3, 1fr); /* 画面幅を3等分（1fr）して伸縮させる */
    gap: 6%; /* gapもpxではなく%で指定 */
	padding: 0;
  }
  .online-shop-list li a {
    width: 100%; /* PC版の100pxを上書きして可変に */
    height: auto; /* PC版の100pxを上書き */
    aspect-ratio: 1 / 1; /* 幅に合わせて高さを自動設定し、正方形を保つ */
  }
  .online-shop-list li img {
    width: 100%;
    height: 100%;
    object-fit: contain;
  }
}

/* ==================================
フッター：スマホ用
================================== */
@media screen and (max-width: 768px) {
	.l-footerWrap{
		padding: 64px min(10%, 60px)!important;
	}
}