html {
 overflow: auto;
}
body {
 overflow-x: hidden;
 margin: 0;
 font-size: 14px;
 font-family: "Helvetica Neue", Arial, "ヒラギノ角ゴシック", "Hiragino Sans", "ヒラギノ角ゴ ProN W3", "Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, sans-serif;
 letter-spacing: 0.05em;
 line-height: 1.8;
 color: #333;
 background-color: #FAFAFA;
}
.bg-beige { background-color: #F6F4EE !important; } 
.bg-green { background-color: #EDF0EA !important; }

h1, h2, h3, h4 {
 font-weight: normal !important;
 letter-spacing: 0.1em;
}

img {
 max-width: 100%;
 vertical-align: top;
 -webkit-backface-visibility: hidden;
 image-rendering: -webkit-optimize-contrast;
}
ul, ol, dl {
 list-style: none;
 margin: 0;
 padding: 0;
}
a {
 color: #333;
 transition: all 0.5s ease;
}
a:hover, a:focus {
 color: #999999;
 text-decoration: none !important;
}
[data-whatinput=mouse] *:focus, [data-whatinput=touch] *:focus {
 outline: none;
}
button {
 font-family: "Helvetica Neue", "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Meiryo", sans-serif;
}
@media screen and (max-width: 767px) {
 .js-scroll-prevent {
  overflow: hidden;
 }
}

/******************************/
/* Utility */
/******************************/
.pc-only { 
 display: block !important; 
}
.sp-only { 
 display: none !important; 
}
@media screen and (max-width: 767px) {
 .pc-only { 
  display: none !important; 
 }
 .sp-only { 
  display: block !important; 
 }
}

.u-container {
 max-width: 1280px;
 margin-inline: auto;
 padding: 0 max(16px, 2%);
}

.u-contents {
 padding-top: 75px;
 padding-bottom: 75px;

 @media screen and (min-width: 768px) {
  padding-top: 150px;
  padding-bottom: 150px;
 }
}

.u-contents-s {
 padding-top: 45px;
 padding-bottom: 45px;
}

.u-attention {
 font-weight: normal;
 font-style: normal;
 color: #B94646;
}

.u-bold {
 font-weight: bold;
 font-style: normal;
}

.u-red {
 color: #B94646;
}

.u-text-left {
 text-align: left !important;
}

.u-text-right {
 text-align: right !important;
}

.u-text-center {
 text-align: center !important;
}

.u-strikethrough {
 text-decoration: line-through;
}

.u-marker {
 background: linear-gradient(transparent 70%, #EACD3E 70%);
}

.u-visually-hidden {
 position: absolute;
 white-space: nowrap;
 width: 1px;
 height: 1px;
 overflow: hidden;
 border: 0;
 padding: 0;
 clip: rect(0 0 0 0);
 clip-path: inset(50%);
 margin: -1px;
}

.u-pc-only {
 display: none;

 @media screen and (min-width: 768px) {
  display: block;
 }
}

.u-pc-only-inline {
 display: none;

 @media screen and (min-width: 768px) {
  display: inline;
 }
}

.u-pc-only-inline-block {
 display: none;

 @media screen and (min-width: 768px) {
  display: inline-block;
 }
}

.u-pc-only-flex {
 display: none;

 @media screen and (min-width: 768px) {
  display: flex;
 }
}

.u-sp-only {
 display: block;

 @media screen and (min-width: 768px) {
  display: none;
 }
}

.u-sp-only-inline {
 display: inline;

 @media screen and (min-width: 768px) {
  display: none;
 }
}

.u-sp-only-inline-block {
 display: inline-block;

 @media screen and (min-width: 768px) {
  display: none;
 }
}

.u-sp-only-flex {
 display: flex;

 @media screen and (min-width: 768px) {
  display: none;
 }
}

.u-hidden {
 overflow: hidden;
}

.u-opa img {
 opacity: 1;
 transition: all 0.3s ease;

 &:hover {
  opacity: 0.8;
 }
}

/* overflow slide */
.u-overflow-slide {
 @media screen and (max-width: 1023px) {
  overflow-x: auto;
  white-space: nowrap;
  padding-bottom: 20px;
  width: 100%;
 }

 &.is-product-thumb {
  @media screen and (max-width: 1023px) {
   padding-bottom: 10px;
  }
 }

 &.is-option-tbl {
  @media screen and (max-width: 1023px) {
   padding-bottom: 15px;
  }
 }

 &::-webkit-scrollbar {
  @media screen and (max-width: 1023px) {
   height: 8px;
  }
 }


 &::-webkit-scrollbar-track {
  @media screen and (max-width: 1023px) {
   background: #F4F4F4;
  }
 }

 &::-webkit-scrollbar-thumb {
  @media screen and (max-width: 1023px) {
   border-radius: 4px;
   background: #8F8F8F;
  }
 }
}

/***** 正方形画像 *****/
.u-square-img {
 position: relative;

 &::before {
  display: block;
  padding-top: 100%;
  content: "";
  background: #F5F5F5;
 }

 a {
  display: block;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
 }

 img {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  left: 0;
  max-width: 100%;
  max-height: 100%;
  margin: auto;
 }
}

/******************************/
/* Layout */
/******************************/
.l-main.is-top {
 margin: 0;
 padding: 0;
}

/* ページ読み込み時のカクつき防止 */
.l-main {
 margin-top: 60px;
}
@media screen and (min-width: 768px) {
 .l-main {
  margin-top: 80px;
 }
}

.l-bottom {
 box-sizing: content-box;
 margin: 64px 0;

 @media screen and (min-width: 768px) {
  margin-top: 96px;
  margin-bottom: 96px;
 }
}

/******************************/
/* お気に入り / 最近チェックした商品（横スクロール） */
/******************************/
.c-scroll-list {
 display: flex;
 flex-wrap: nowrap;
 gap: 16px;
 overflow-x: auto;
 -webkit-overflow-scrolling: touch;
 padding: 0 0 16px 0;
 margin: 0;
 list-style: none;
 margin-right: -16px;
 padding-right: 16px;
 cursor: grab;/* マウスカーソルを「掴める手の形」にする */
}

/* マウスで掴んでいる最中のカーソル変化 */
.c-scroll-list.is-active {
 cursor: grabbing;
}

/* ▼ 画像やリンクの標準ドラッグを無効化し、変な動きを防ぐ */
.c-scroll-list img,
.c-scroll-list a {
 -webkit-user-drag: none;
 user-select: none;
 pointer-events: auto; /* リンクとしてのクリックは有効にする */
}

/* スクロールバーのデザイン */
.c-scroll-list::-webkit-scrollbar { height: 8px; }
.c-scroll-list::-webkit-scrollbar-track { background: #F4F4F4; border-radius: 4px; }
.c-scroll-list::-webkit-scrollbar-thumb { background: #8F8F8F; border-radius: 4px; }

/* ▼ スマホ用（デフォルト：2.5個表示） */
.c-scroll-item {
 width: 36vw;
 flex-shrink: 0;
}

/* ▼ 768px以上：4.3個表示 */
@media screen and (min-width: 768px) {
 .c-scroll-list { gap: 24px; }
 .c-scroll-item {
  width: calc((100% - (24px * 3.5)) / 4.5);
 }
}
/* ▼ 1075px以上：5.3個表示 */
@media screen and (min-width: 1075px) {
 .c-scroll-item {
 width: calc((100% - (24px * 4.5)) / 5.5);
 }
}

/******************************/
/* お取り扱い商品 */
/******************************/
.c-products-available-layout {
 display: flex;
 flex-direction: column;
 gap: 48px;
 width: 100%;
}

.c-products-available {
 display: flex;
 flex-direction: column;
 align-items: stretch;
 gap: 24px;
 width: 100%;
}

.c-products-available__title {
 display: flex;
 gap: 16px;
 align-items: center;
 margin: 0;
 font-size: 18px;
 font-weight: normal;

 span {
  flex: 0 0 auto;
 }

 &::after {
  flex: 1 1 auto;
  content: "";
  display: block;
  width: 100%;
  height: 1px;
  background: #CBDBD3;
 }
}

.c-products-available__list {
 display: grid;
 grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
 gap: 32px;
 width: 100%;
}

.c-products-available__item {
 display: flex;
 align-items: center;
 gap: 12px;

 .c-section--bgcolor & {
  border-radius: 4px;
  background: rgba(255,255,255,0.4);
  padding: 8px;
 }
}

.c-products-available__link {
 display: flex;
 align-items: center;
 gap: 8px;
 width: 100%;
}

.c-products-available__image {
 border-radius: 4px;
 width: 80px;
 height: 80px;
 object-fit: cover;
 aspect-ratio: 1 / 1;
}

.c-products-available__label {
 font-size: 14px;
}

/******************************/
/* 営業日カレンダー */
/******************************/
.p-calendar {
 display: flex;
 flex-direction: column;
 gap: 24px;
 box-sizing: border-box;
 flex: 1;

 @media screen and (min-width: 768px) {
  gap: 40px;
 }
}

.side_cal {
 display: block;

 @media screen and (min-width: 601px) {
  display: flex;
  justify-content: center;
 }
}

.tbl_calendar {
 margin-bottom: 30px;
 margin-left: auto;
 margin-right: auto;
 width: auto;
 text-align: center;
 border-spacing: 1px;
 border-collapse: separate;

 @media screen and (min-width: 768px) {
  margin-top: 30px;
  margin-bottom: 0;
  width: 300px;
 }

 @media screen and (min-width: 1024px) {
  margin-top: 0;
  margin-left: 120px;
  margin-right: 120px;
  width: 330px;
 }

 caption {
  margin-bottom: 10px;
  font-size: 16px;
  text-align: center;

  @media screen and (min-width: 768px) {
   margin-bottom: 20px;
  }
 }

 th {
  padding: 5px 12px;
  font-size: 13px;
  font-weight: normal;
  border-bottom: 1px solid #B3B2B2;

  @media screen and (min-width: 768px) {
   padding-bottom: 15px;
   padding-left: 0;
   padding-right: 0;
   font-size: 16px;
  }
 }

 td {
  padding: 5px 12px;
  font-size: 13px;

  @media screen and (min-width: 768px) {
   padding: 8px 5px;
   font-size: 16px;
  }
 }
}

.side_cal_memo {
 @media screen and (min-width: 1024px) {
  margin-left: 100px;
  margin-right: 100px;
  text-align: center;
  color: #666;
 }
}
.side_cal_memo {
 @media screen and (max-width: 1023px) {
  text-align: center;
  color: #666;
 }
}

/******************************/
/* タイトルの上部にラインを入れる装飾 */
/******************************/
.c-section-title--border {
 border-top: 1px solid #cccccc;
 padding-top: 80px!important;
}

/******************************/
/* ショッピングガイド */
/******************************/
.p-shopguide {
 position: relative;
 z-index: 10;
 display: flex;
 flex-direction: column;
 gap: 32px;

 @media screen and (min-width: 768px) {
  flex-direction: row;
  gap: 40px;

  > * {
   flex: 1 1 calc((100% / 3) - 40px);
  }
 }
}

.p-shopguide-column {
 box-sizing: border-box;
 font-feature-settings: "palt"1;
 max-width: 960px;
}

.p-shopguide-box__ttl {
 margin-top: 0;
 margin-bottom: 25px;
 line-height: 1.4;
 font-size: 20px;
 font-weight: normal;
 text-align: center;

 span {
  font-size: 12px;
  color: #909090;
 }
}

.p-shopguide__icon {
 margin-bottom: 20px;
}

.p-shopguide__ttl {
 margin-top: 0;
 margin-bottom: 5px;
 font-size: 14px;
 font-weight: bold;
}

.p-shopguide__body {
 margin-bottom: 20px;
 margin-left: 0;
 line-height: inherit;
 font-size: 14px;
}

.p-shopguide__img {
 margin-bottom: 10px;

 img {
  margin-right: 5px;
 }

 &:last-child {
  margin-right: 0;
 }
}

.p-shopguide__point-ttl {
 margin-top: 0;
 margin-bottom: 10px;
 font-weight: bold;
}

.p-shopguide-cregit-list {
 display: flex;
 flex-wrap: wrap;
}

.p-shopguide-cregit-list__item {
 margin-right: 7px;
 margin-bottom: 10px;
}

.p-shopguide__attention {
 font-size: 12px;
}

/******************************/
/* fade animation */
/******************************/
.fadeIn {
 opacity: 0;
 transition: all 2.3s cubic-bezier(0.07, 0.92, 0.46, 0.95) 0.4s;
}
.fromLeft {
 transform: translate(-20px, 0);
}
.fromRight {
 transform: translate(20px, 0);
}
.fromTop {
 transform: translate(0, -20px);
}
.fromBottom {
 transform: translate(0, 20px);
}
.fromForeground {
 transform: scale(1.6);
}
.faded {
 opacity: 1;
}
.fadedWithTransform {
 opacity: 1;
 transform: translate(0, 0) scale(1);
}

/******************************/
/* popup animation */
/******************************/
/* overlay at start */
.mfp-bg {
 opacity: 0;
 transition: all 0.15s ease-out;
}
/* overlay animate in */
.mfp-bg.mfp-ready {
 opacity: 0.8;
}
/* overlay animate out */
.mfp-bg.mfp-removing {
 opacity: 0;
}
/* content at start */
.mfp-wrap .mfp-content {
 opacity: 0;
 transition: all 0.15s ease-out;
}
/* content animate it */
.mfp-wrap.mfp-ready .mfp-content {
 opacity: 1;
}
/* content animate out */
.mfp-wrap.mfp-removing .mfp-content {
 opacity: 0;
}
/* custom */
.mfp-zoom-out-cur .mfp-image-holder .mfp-close .mfp-close, .mfp-zoom-out-cur .mfp-iframe-holder .mfp-close .mfp-close {
 right: 0 !important;
 width: 15px;
}
.mfp-zoom-out-cur .mfp-bottom-bar {
 font-family: "游明朝", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "Shippori Mincho", serif;
}
.mfp-zoom-out-cur .mfp-arrow-right:after {
 left: -10px;
 border-left: 1px solid #FFF;
 border-top: 1px solid #FFF;
 border-bottom: 0;
 border-right: 0;
 width: 30px;
 height: 30px;
 transform: rotate(135deg);
}
.mfp-zoom-out-cur .mfp-arrow-left:after {
 left: 0px;
 border-left: 1px solid #FFF;
 border-top: 1px solid #FFF;
 border-bottom: 0;
 border-right: 0;
 width: 30px;
 height: 30px;
 transform: rotate(-45deg);
}

/******************************/
/* Color me icons */
/******************************/
/* 24px black */
.icon-lg-b.icon-instagram {
 background-position: -168px -288px;
}
.icon-lg-b.icon-twitter {
 background-position: -144px -264px;
}
.icon-lg-b.icon-facebook {
 background-position: -192px -264px;
}
.icon-lg-b.icon-video {
 background-position: -456px -144px;
}
.icon-lg-b.icon-pinterest {
 background-position: -312px -264px;
}
.icon-b, .icon-w {
 width: 16px;
 height: 16px;
 display: inline-block;
 *display: inline;
 *zoom: 1;
}
.icon-lg-b, .icon-lg-w {
 width: 24px;
 height: 24px;
 display: inline-block;
 *display: inline;
 *zoom: 1;
}
.icon-b {
 background-image: url(https://img.shop-pro.jp/tmpl_img/73/icon16_b.png);
}
.icon-w {
 background-image: url(https://img.shop-pro.jp/tmpl_img/73/icon16_w.png);
}
.icon-lg-b {
 background-image: url(https://img.shop-pro.jp/tmpl_img/73/icon24_b.png);
}
.icon-lg-w {
 background-image: url(https://img.shop-pro.jp/tmpl_img/73/icon24_w.png);
}
@media only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (min--moz-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min-device-pixel-ratio: 2), only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx) {
 .icon-b, .icon-w {
  -webkit-background-size: 368px 320px;
  background-size: 368px 320px;
 }
 .icon-lg-b, .icon-lg-w {
  -webkit-background-size: 552px 480px;
  background-size: 552px 480px;
 }
 .icon-b {
  background-image: url(https://img.shop-pro.jp/tmpl_img/73/icon16_2x_b.png);
 }
 .icon-w {
  background-image: url(https://img.shop-pro.jp/tmpl_img/73/icon16_2x_w.png);
 }
 .icon-lg-b {
  background-image: url(https://img.shop-pro.jp/tmpl_img/73/icon24_2x_b.png);
 }
 .icon-lg-w {
  background-image: url(https://img.shop-pro.jp/tmpl_img/73/icon24_2x_w.png);
 }
}
@media (max-width: 767px) {
 .icon-b {
  background-image: url(https://img.shop-pro.jp/tmpl_img/73/icon24_b.png);
 }
 .icon-w {
  background-image: url(https://img.shop-pro.jp/tmpl_img/73/icon24_w.png);
 }
}
@media only screen and (max-width: 767px) and (-webkit-min-device-pixel-ratio: 2), only screen and (max-width: 767px) and (min--moz-device-pixel-ratio: 2), only screen and (max-width: 767px) and (-o-min-device-pixel-ratio: 2/1), only screen and (max-width: 767px) and (min-device-pixel-ratio: 2), only screen and (max-width: 767px) and (min-resolution: 192dpi), only screen and (max-width: 767px) and (min-resolution: 2dppx) {
 .icon-b {
  background-image: url(https://img.shop-pro.jp/tmpl_img/73/icon24_2x_b.png);
 }
 .icon-w {
  background-image: url(https://img.shop-pro.jp/tmpl_img/73/icon24_2x_w.png);
 }
}

/******************************/
/* Components */
/******************************/
/********** セクションレイアウト **********/
.c-section {
 box-sizing: content-box;
 margin: 0;
 padding: 50px 0 80px;

 /*
 @media screen and (min-width: 768px) {
  margin-top: 96px;
  margin-bottom: 96px;
 }
 */

 &:has(.c-breadcrumb) {
 margin: 0;
  padding: 24px 0;

  @media screen and (min-width: 768px) {
   margin: 0;
   padding: 30px 0;
  }
 }
}

.c-section--bgcolor {
 background: #E9EDE8;
 margin: 0;
 padding: 64px 0;

 @media screen and (min-width: 768px) {
  margin-top: 0;
  margin-bottom: 0;
  padding-top: 96px;
  padding-bottom: 96px;
 }
}

.c-section--width-full {
 .c-section__container {
  max-width: 540px;
  margin-inline: auto;
  padding: 0;
 }
}

.c-section--margin-none {
 margin: 0;

 @media screen and (min-width: 768px) {
  margin-top: 0;
  margin-bottom: 0;
 }
}

.c-section--compact {
 margin: 48px 0;

 @media screen and (min-width: 768px) {
  margin-top: 64px;
  margin-bottom: 64px;
 }
}

.c-section__container {
 display: flex;
 flex-direction: column;
 gap: 32px;
 max-width: 1280px;
 margin-inline: auto;
 padding: 0 max(16px, 2%);
}

.c-section__container--compact {
 gap: 16px;
}

.c-section__header {
 display: flex;
 justify-content: center;
 align-items: center;
}

.c-section__body {
 display: flex;
 flex-direction: column;
 align-items: stretch;
 justify-content: center;
 gap: 32px;
}

.c-section__footer {
 align-self: center;
}

/********** title **********/
.c-section-title {
 display: flex;
 flex-direction: column;
 justify-content: center;
 align-items: center;
 gap: 16px;
 margin: 8px 0;
 line-height: 1.2;
 font-size: 26px;
 color: #333;
 font-weight: normal;
 letter-spacing: 0.1em;
 font-family: "游明朝", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "Shippori Mincho", serif;
 text-align: center;

 @media screen and (min-width: 500px) {
  margin: 24px 0;
  font-size: 32px;
 }

 &::after {
  content: "";
  display: block;
  width: 100px;
  height: 2px;
  background-color: #CBDBD3;
 }

 span {
  display: inline-block;
 }
}

.c-section-title--small {
 font-size: 21px;

 @media screen and (min-width: 500px) {
  margin: 16px 0;
  font-size: 26px;
 }
}

.c-section-title--sub {
 display: block;
 margin-top: 0;
 line-height: 1.4;
 font-size: 18px;
 text-align: left;

 @media screen and (min-width: 500px) {
  margin-top: 0;
  font-size: 24px;
 }

 &::after {
  display: none;
 }
}

/********** 商品一覧 **********/
.c-product-item {
 cursor: pointer;
 display: flex;
 flex-direction: column;
 gap: 8px;
 width: 100%;

 @media screen and (min-width: 500px) {
  gap: 12px;
 }

 &:hover {
  .c-product-item__image {
   transform: scale(0.9);

   &::before,
   &::after {
    opacity: 1;
   }

   &::after {
    letter-spacing: 0.1em;
   }
  }

  .c-product-item__body {
   opacity: 0.6;
  }
 }

 a:hover {
  text-decoration: none;
 }
}

.c-product-item__image {
 position: relative;
 overflow: hidden;
 background: #F5F5F5;
 border-radius: 12px;
 aspect-ratio: 1 / 1;
 transition: 0.6s cubic-bezier(0.33, 1, 0.68, 1);

 &::before,
 &::after {
  content: "";
  display: block;
  position: absolute;
  margin: auto;
  top: 0;
  left: 0;
  margin: auto;
  transition: 0.6s cubic-bezier(0.33, 1, 0.68, 1);
  opacity: 0;
  pointer-events: none;
 }

 &::before {
  background: rgba(0,0,0,0.4);
  width: 100%;
  height: 100%;
 }

 &::after {
  color: #FFF;
  content: "詳細を見る";
  font-size: 14px;
  display: flex;
  text-align: center;
  justify-content: center;
  align-items: center;
  bottom: 0;
  right: 0;
 }

 a {
  display: flex;
  justify-content: center;
  align-items: center;
  width: 100%;
  height: 100%;
 }

 img {
  width: 100%;
  height: auto;
 }

 .c-favorite-icon {
  position: absolute;
  bottom: 8px;
  right: 8px;

  @media screen and (min-width: 500px) {
   bottom: 16px;
   right: 16px;
  }
 }

 .c-product-item__number {
  position: absolute;
  top: 8px;
  left: 8px;
  display: flex;
  justify-content: center;
  align-items: center;
  background: #CBDBD3;
  border-radius: 100vmax;
  width: 32px;
  height: 32px;
  font-size: 14px;
  line-height: 1;
  color: #212121;

  &.is-1 {
   background: #EACD3E;
   color: #212121;
  }

  &.is-2 {
   background: #C7C7C7;
   color: #212121;
  }

  &.is-3 {
   background: #D9AC8A;
   color: #212121;
  }
 }
}

.c-product-item__body {
 flex: 1 1 auto;
 display: flex;
 flex-direction: column;
 gap: 8px;
 transition: 0.3s;
 overflow: hidden;

 @media screen and (min-width: 500px) {
  gap: 12px;
 }
}

.c-product-item__text {
 display: flex;
 flex-direction: column;
 gap: 8px;
}

.c-product-item__title {
 overflow: hidden;
 display: -webkit-box;
 -webkit-box-orient: vertical;
 max-height: 2.5em;
 margin: 0;
 -webkit-line-clamp: 2;
 text-overflow: ellipsis;
 line-height: 1.2;
 font-weight: normal;
 font-size: 14px;

 @media screen and (min-width: 500px) {
  font-size: 16px;
 }
}

.c-product-item__description {
 margin: 0;
 font-size: 12px;
 line-height: 1.6;
}

.c-product-item__price {
 display: flex;
 flex-direction: column;
 gap: 8px;
}

.c-product-item__price-unit {
 display: flex;
 flex-wrap: wrap;
 align-items: center;
 gap: 4px;
}

.c-price-text {
 margin: 0;
 font-size: 12px;
 line-height: 1.2;

 @media screen and (min-width: 500px) {
  font-size: 14px;
 }
}

.c-price-text--soldout,
.stock_zero {
 color: #B94646;
}

.c-price-text--regular {
 font-size: 80%;
 color: #999999;

 span {
  text-decoration: line-through;
 }
}

.c-price-text--discount-rate {
 display: flex;
 align-items: center;
 justify-content: center;
 background: #CBDBD3;
 border-radius: 4px;
 padding: 4px 8px;
 font-size: 11px;
 line-height: 1;
 color: #333;
 font-weight: normal;

 @media screen and (min-width: 500px) {
  font-size: 12px;
 }
}

.c-product-item--size-s {
 .c-product-item__title {
  font-size: 14px;
 }

 .c-product-item__price-text {
  font-size: 12px;
 }
}

.c-product-item--size-l {
 overflow: hidden;
 box-sizing: border-box;
 max-width: 250px;
 transition: 0.4s;
 border-radius: 12px;

 @media screen and (min-width: 500px) {
  max-width: 950px;
 }

 &:hover {
  transform: scale(1.025);
  box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.12),
        0 4px 6px -2px rgba(0, 0, 0, 0.12),
        0 0 0 0 rgba(0, 0, 0, 0.12);

  .c-product-item__image {
   transform: scale(1);

   &::before,
   &::after {
    opacity: 0;
   }
  }

  .c-product-item__body {
   opacity: 1;
  }
 }

 a {
  display: flex;
  flex-direction: column;
  gap: 16px;
  background: #E9EDE8;
  padding: 18px 16px;

  @media screen and (min-width: 500px) {
   flex-direction: row;
   align-items: center;
   gap: 32px;
   padding: 16px;
  }
 }

 .c-product-item__image {
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 8px;

  @media screen and (min-width: 500px) {
   flex: 0 0 40%;
   aspect-ratio: 3 / 2;
  }
 }

 .c-product-item__title {
  font-size: 16px;

  @media screen and (min-width: 500px) {
   font-size: 18px;
  }

  @media screen and (min-width: 768px) {
   font-size: 21px;
  }
 }

 .c-product-item__price-text {
  @media screen and (min-width: 500px) {
   font-size: 16px;
  }
 }
}

svg:not(:root) {
 overflow: hidden;
}

/***** お気に入りアイコン *****/
.c-favorite-icon {
 display: flex;
 flex-direction: column;
 justify-content: center;
 align-items: center;
 gap: 10px;
 border-radius: 100vmax;
 border: none;
 background: #FFF;
 color: #E9EDE8;
 width: 30px;
 height: 30px;

 @media screen and (min-width: 500px) {
  width: 40px;
  height: 40px;
 }

 svg {
  width: 12px;
  height: 12px;
  fill: currentColor;

  @media screen and (min-width: 500px) {
   width: 16px;
   height: 16px;
  }
 }

 &.is-added {
  color: #B94646;
 }
}

.c-favorite-list__item {
 position: relative;
 box-sizing: border-box;
 word-break: break-all;
}

/********** タグ **********/
.c-tag {
 display: inline-block;
 justify-content: center;
 align-items: center;
 border-radius: 4px;
 background-color: #CBDBD3;
 margin: 0;
 padding: 8px 16px;
 color: #333;
 font-size: 12px;
 line-height: 1.2;
}

.c-tag--warning {
 background: #B94646;
 color: #FFF;
}

/********** リンクボタン **********/
.c-button {
 cursor: pointer;
 position: relative;
 z-index: 1;
 box-sizing: border-box;
 display: inline-flex;
 padding:16px 24px;
 justify-content: center;
 align-items: center;
 gap: 4px;
 border-radius: 100px;
 border: 1px solid #333;
 background: #FFF;
 text-decoration: none;
 font-size: 14px;
 line-height: 1.2;
 color: #333;

 &::after {
  position: absolute;
  top: 0;
  left: 0;
  content: "";
  border-radius: 100vmax;
  width: 100%;
  height: 100%;
  background-image: linear-gradient(to right,#0000 50%,#3D3A3813 50%);
  z-index: -1;
  background-position: 0 0;
  background-size: 200% auto;
  transition: 0.3s;
 }

 &:hover {
  text-decoration: none;

  &::after {
   background-position: -100% 0;
  }
 }
}

.c-button--cart {
 gap: 8px;
 border-color: #EACD3E;
 background: #EACD3E;
 color: #333;
 line-height: 24px;

 &[disabled] {
  cursor: default;
  border-color: #F5F5F5;
  background: #F5F5F5;
  color: #7D7D7D;

  &:hover {
   &::after {
    content: none;
   }
  }
 }

 svg {
  fill: currentColor;
 }
}


/******************************/
/* カートに入れるボタンのカスタム（会社のHPと統一） */
/******************************/
.c-button.c-button--cart {
 background-color: #2c3e50 !important;
 color: #fff !important;
 border-color: #2c3e50 !important;
 border-radius: 40px !important;
 font-size: 16px !important;
 letter-spacing: 2px !important;
 padding: 18px 24px !important;
 box-shadow: 0 4px 10px rgba(0,0,0,0.1);
 transition: background 0.3s, transform 0.3s !important;
}

/* ホバーしたときの動き */
.c-button.c-button--cart:hover {
 background-color: #cda434 !important;
 border-color: #cda434 !important;
 transform: translateY(-3px);
 box-shadow: 0 8px 20px rgba(0,0,0,0.15);
}

/* カートアイコンの色も白に合わせる */
.c-button.c-button--cart svg {
 fill: #fff !important;
}


/********** お気に入りボタン（テキスト付き） **********/
.c-button--favorite {
 gap: 8px;
 border-color: #E9EDE8;
 background: #E9EDE8;
 line-height: 24px;
 color: #728270;
 transition: opacity 0.3s ease !important;
 
 &::after {
  display: none !important;
 }

 svg {
  width: 16px;
  height: 16px;
  fill: #728270;
 }


 /* お気に入り登録済み（済み）の状態 */
 &.is-added {
  border-color: #333;
  background: #FFF;
  color: #333;

  svg {
   fill: #B94646;
  }
 }
}


/********** 空のメッセージ **********/
.c-empty-message {
 margin-top: 128px;
 margin-bottom: 128px;
 text-align: center;
}

.c-not-found {
 margin-top: 120px;
 margin-bottom: 120px;
 text-align: center;
}

/********** table **********/
.c-tbl-list {
 @media screen and (min-width: 768px) {
  border-top: 1px solid #BBB2AE;
 }
}

.c-tbl-list__tr {
 @media screen and (min-width: 768px) {
  display: flex;
  border-bottom: 1px solid #BBB2AE;
 }
}

.c-tbl-list__th {
 box-sizing: border-box;
 margin: 0 0 15px 0;
 padding: 5px 15px;
 border-bottom: 1px solid #BBB2AE;
 font-size: 14px;
 font-weight: bold;

 @media screen and (min-width: 768px) {
  margin-bottom: 0;
  padding: 20px 20px 20px 0px;
  border-bottom: none;
  width: 270px;
 }
}

.c-tbl-list__td {
 margin-bottom: 30px;
 padding: 0 15px;

 @media screen and (min-width: 768px) {
  flex: 1;
  margin-bottom: 0;
  padding: 20px;
 }
}

/********** パンくずリスト **********/
.c-breadcrumb {
 overflow: hidden;
 overflow-x: auto;
}

.c-breadcrumb__list {
 display: flex;
 gap: 8px;
 align-items: center;
}

.c-breadcrumb__item {
 display: flex;
 align-items: center;
 gap: 4px;

 &:not(:last-child) {
  &::after {
   content: "";
   width: 6px;
   height: 6px;
   border-top: 1px solid #333;
   border-right: 1px solid #333;
   transform: translate(0, -10%) rotate(45deg);
  }
 }
}

.c-breadcrumb__link {
 line-height: 1;
 color: #333;

 &:hover {
  text-decoration: none;
  opacity: 0.6;
 }
}

.c-breadcrumb__label {
 white-space: nowrap;
 overflow: hidden;
 text-overflow: ellipsis;
 box-sizing: border-box;
}

/********** ページャー **********/
.c-pager {
 display: flex;
 flex-direction: column;
 justify-content: center;
 gap: 12px;
 margin: 32px 0 0;

 @media screen and (min-width: 768px) {
  gap: 16px;
  margin-top: 64px;
 }
}

.c-pager__number {
 text-align: center;
 font-size: 12px;

 @media screen and (min-width: 768px) {
  font-size: 14px;
 }
}

.c-pager-list {
 display: flex;
 flex-wrap: wrap;
 justify-content: center;
 align-items: center;
 gap: 24px;
}

.c-pager-list__item {
 display: none;

 &.is-visible {
  display: block;
 }
}

.c-pager-list__link {
 box-sizing: border-box;
 display: block;
 position: relative;
 font-size: 16px;
 color: #333;
 text-decoration: none;
 transition: all 0.3s ease;

 @media screen and (min-width: 768px) {
  font-size: 18px;
 }

 &.is-prev,
 &.is-next {
  position: relative;
  border-radius: 100vmax;
  background: #E9EDE8;
  width: 32px;
  height: 32px;
  text-decoration: none;

  &:hover {
   background: #CBDBD3;
   text-decoration: none;
  }

  &::before {
   content: "";
   transition: all 0.3s ease;
   position: absolute;
   top: 50%;
   border-right: 1px solid #728270;
   border-bottom: 1px solid #728270;
   width: 8px;
   height: 8px;
  }
 }

 &.is-prev::before {
  right: 6px;
  transform: translate(-50%, -50%) rotate(135deg);
 }

 &.is-next::before {
  left: 14px;
  transform: translate(-50%, -50%) rotate(-45deg);
 }

 &.is-disabled {
  cursor: inherit;
  background: transparent;

  &::before {
   opacity: 0.5;
  }

  &:hover {
   background: transparent;
  }
 }
}

.c-pager-list__page {
 font-size: 12px;

 @media screen and (min-width: 768px) {
  font-size: 14px;
 }
}

/******************************/
/* header */
/******************************/
.l-header {
 position: fixed;
 top: 0;
 z-index: 1000;
 width: 100%;
 transition: all ease 0.5s;
 background: #FFF;
 box-shadow: 4px 0 16px rgba(0, 0, 0, 0.05);
}
@media screen and (max-width: 767px) {
 .l-header {
  top: 0;
  left: 0;
  right: 0;
  min-width: ;
 }
}
.l-header.is-top {
 box-shadow: none;
}
.l-header.is-open .l-header-logo {
 margin-bottom: 0;
 display: block;
}
.l-header.is-open .l-header-logo__img.is-txt {
 margin-bottom: 0;
}
@media screen and (max-width: 767px) {
 .l-header.is-open .l-main-navi-list {
  display: none;
 }
}
@media screen and (max-width: 767px) {
 .l-header.is-open .l-menu-btn {
  display: block;
 }
}
.l-header.is-fixed {
 box-shadow: 0 3px 10px rgba(0, 0, 0, 0.05);
}
@media screen and (max-width: 767px) {
 .l-header.is-fixed {
  background: #FFF;
 }
}
.l-header-main {
 box-sizing: border-box;
 margin-left: auto;
 margin-right: auto;
 padding: 10px 0;
 height: 80px;
}
@media screen and (max-width: 767px) {
 .l-header-main {
  padding: 5px 0;
  height: auto;
  min-height: 55px;
 }
}
.l-header-main__in {
 display: flex;
 justify-content: ;
 align-items: center;
 position: relative;
 z-index: 100;
 max-width: 1280px;
 margin: 0 auto;
 width: 100%;
}
@media screen and (max-width: 767px) {
 .l-header-main__in {
  width: 100%;
 }
}
.l-header-logo {
 text-align: center;
}
.l-header-logo__img {
 display: flex;
 align-items: center;
 margin: 0;
 padding-left: 15px;
 padding-right: 135px;
 height: 60px;
}
.l-header-logo__img:hover img {
  opacity: 0.85; 
  transform: scale(0.98); 
  transition: all 0.3s ease; 
}

@media screen and (max-width: 767px) {
 .l-header-logo__img {
  padding-left: 10px;
  padding-right: 110px;
  height: auto;
  min-height: 45px;
 }
}
.l-header-logo__img img {
 max-width: 270px;
 max-height: 60px;
}
@media screen and (max-width: 767px) {
 .l-header-logo__img img {
  max-width: 150px;
  max-height: 40px;
 }
}
.l-header-logo__txt {
 word-break: break-all;
 display: inline-block;
 max-width: 900px;
 line-height: 1.2;
 font-size: 14px;
}


/* PC用：ヘッダー追加メニュー（右寄せ設定） */
@media screen and (max-width: 767px) {
 .header-pc-menu {
  display: none;
 }
}

@media screen and (min-width: 768px) {
 .header-pc-menu {
  display: flex;
  margin-left: auto;
  padding-right: 250px;
 }
 
 .pc-nav-list {
  display: flex;
  list-style: none;
  margin: 0;
  padding: 0;
  gap: 25px;
 }
 
 .pc-nav-item {
  position: relative;
  display: flex;
  align-items: center;
 }
 
 .pc-nav-link {
  display: flex;
  align-items: center;
  color: #333;
  text-decoration: none;
  font-size: 15px;
  padding: 20px 0;
 }
 
 .pc-nav-link:hover {
  color: #333;
  opacity: 0.6;
  text-decoration: none !important;
 }
 
.pc-nav-link:focus,
.pc-nav-link:active {
 text-decoration: none !important;
 outline: none !important;
}

 /* --- Vマーク（矢印）の作成とアニメーション --- */
 .has-dropdown .pc-nav-link::after {
  content: "";
  display: block;
  margin-left: 15px;
  margin-top: -7px;
  width: 6px;
  height: 6px;
  border-right: 2px solid #666;
  border-bottom: 2px solid #666;
  transform: rotate(45deg);
  transition: all 0.3s ease;
 }

 .has-dropdown:hover .pc-nav-link::after {
  transform: rotate(-135deg);
  margin-top: 2px;
 }

 /* --- プルダウンの枠設定（フェードイン・スライド付き） --- */
 .pc-dropdown {
  display: block !important;
  visibility: hidden;
  opacity: 0;
  position: absolute;
  top: 100%;
  left: -75px;
  width: 240px;
  background: #FFF;
  box-shadow: 0 5px 20px rgba(0,0,0,0.15);
  z-index: 1000;
  padding: 10px 0;
  border-radius: 4px;
  margin-top: 0px;
  transform: translateY(-10px);
  transition: all 0.4s cubic-bezier(0.16, 1, 0.3, 1);
 }
 .has-dropdown:hover .pc-dropdown {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
 }

 /* --- プルダウン内のテキスト（左寄せ） --- */
 .pc-dropdown-list li a {
  display: block;
  padding: 10px 20px;
  color: #333;
  text-decoration: none;
  text-align: left;
  font-size: 14px;
  border-bottom: 1px solid #f5f5f5;
 }
 
 .pc-dropdown-list li:last-child a {
  border-bottom: none;
 }
 
 .pc-dropdown-list li a:hover {
  background: #F6F4EE;
 }
}


@media screen and (max-width: 1023px) {
 .l-header-logo__txt {
  max-width: inherit;
  font-size: 12px;
 }
}
.l-menu-btn {
 position: absolute;
 top: -8px;
 right: 0;
 z-index: 10000;
 padding: 0;
 width: 80px;
 height: 80px;
 border: 0;
 background: transparent;
}
@media screen and (max-width: 767px) {
 .l-menu-btn {
  top: -4px;
  width: 45px;
  height: 55px;
 }
}
.l-menu-btn span {
 box-sizing: border-box;
 display: inline-block;
 transition: all 0.3s cubic-bezier(0.25, 0.46, 0.45, 0.94);
 position: absolute;
 left: 30px;
 width: 20px;
 height: 2px;
 background-color: #000;
}
@media screen and (max-width: 767px) {
 .l-menu-btn span {
  left: 14px;
 }
}
.l-menu-btn span:nth-of-type(1) {
 top: 31px;
}
@media screen and (max-width: 767px) {
 .l-menu-btn span:nth-of-type(1) {
  top: 19px;
 }
}
.l-menu-btn span:nth-of-type(2) {
 top: 39px;
}
@media screen and (max-width: 767px) {
 .l-menu-btn span:nth-of-type(2) {
  top: 26px;
 }
}
.l-menu-btn span:nth-of-type(3) {
 top: 47px;
}
@media screen and (max-width: 767px) {
 .l-menu-btn span:nth-of-type(3) {
  top: 32px;
 }
}
.l-menu-btn.is-on span:nth-of-type(1) {
 top: 40px;
 transform: rotate(-45deg);
}
@media screen and (max-width: 767px) {
 .l-menu-btn.is-on span:nth-of-type(1) {
  top: 28px;
 }
}
.l-menu-btn.is-on span:nth-of-type(2) {
 width: 0;
 opacity: 0;
}
.l-menu-btn.is-on span:nth-of-type(3) {
 top: 40px;
 transform: rotate(45deg);
}
@media screen and (max-width: 767px) {
 .l-menu-btn.is-on span:nth-of-type(3) {
  top: 28px;
 }
}
/********** メインナビ **********/
.l-main-navi {
 display: none;
 z-index: 100;
}
.l-main-navi.is-open {
 box-sizing: border-box;
 overflow-y: auto;
 display: block;
 position: fixed;
 top: 80px;
 left: 0;
 z-index: 10;
 padding: 100px 20px 0 20px;
 width: 100%;
 height: calc(100vh - 80px);
}
@media screen and (max-width: 767px) {
 .l-main-navi.is-open {
  top: 55px;
  left: 0;
  z-index: 10;
  padding: 20px 20px 20px 20px;
  width: 100%;
  height: calc(100vh - 55px);
 }
}
.l-main-navi__wrap {
 margin-left: auto;
 margin-right: auto;
 padding-left: 15px;
 padding-right: 15px;
 max-width: 1280px;
}
@media screen and (max-width: 767px) {
 .l-main-navi__wrap {
  padding-left: 0;
  padding-right: 0;
 }
}
.l-main-navi-list {
 display: flex;
 flex-wrap: wrap;
 margin-left: -30px;
 margin-right: -30px;
}
@media screen and (max-width: 767px) {
 .l-main-navi-list {
  display: block;
  margin-left: 0;
  margin-right: 0;
 }
}
.l-main-navi-list__ttl {
 margin-bottom: 20px;
 font-size: 18px;
 font-weight: bold;
}
@media screen and (max-width: 767px) {
 .l-main-navi-list__ttl {
  display: none;
 }
}
.l-main-navi-list__item {
 box-sizing: border-box;
 padding-left: 30px;
 padding-right: 30px;
 width: 33.3333%;
}
@media screen and (max-width: 767px) {
 .l-main-navi-list__item {
  padding-left: 0;
  padding-right: 0;
  width: auto;
 }
}
.l-main-navi-list__link {
 display: none;
 transition: all ease 0.2s;
}
@media screen and (max-width: 767px) {
 .l-main-navi-list__link {
  display: block;
  position: relative;
  padding: 18px 45px 16px 0px;
  border: 0;
  font-weight: normal;
  background: transparent;
  color: #333;
  width: 100%;
  font-size: 18px;
  text-align: left;
 }
}
.l-main-navi-list__link:hover:before, .l-main-navi-list__link.is-on:before {
 border-right-color: #333;
 border-bottom-color: #333;
}
@media screen and (max-width: 767px) {
 .l-main-navi-list__link:before {
  content: "";
  position: absolute;
  top: 50%;
  right: 10px;
  margin-top: -10px;
  width: 8px;
  height: 8px;
  border-right: 2px solid #000;
  border-bottom: 2px solid #000;
  transform: rotate(45deg);
  transition: all cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.3s;
 }
}
.l-main-navi-list__link.is-on:before {
 transform: rotate(-135deg);
 margin-top: -4px;
}
.l-main-navi__overlay {
 display: none;
 position: fixed;
 top: 0;
 left: 0;
 right: 0;
 bottom: 0;
 background: #E9EDE8;
 opacity: 0;
}

/* ----------------------------------- */
/* メニュー展開時、ヘッダーを白いままにする */
/* ----------------------------------- */
.l-main-navi__overlay {
 top: 80px !important;
}

@media screen and (max-width: 767px) {
 .l-main-navi__overlay {
  top: 55px !important;
 }
}

.l-main-navi__overlay.is-on {
 display: block;
 animation: anime-fade 0.2s ease forwards;
}
@keyframes anime-fade {
 0% {
  opacity: 0;
 }
 100% {
  opacity: 1;
 }
}


/******************************/
/* スマホ・PC共通：全展開（フラット）メニュー用（最終調整版） */
/******************************/

/* メニューのタイトル部分 */
.l-main-navi-list__ttl--flat {
 margin-bottom: 15px;
 font-size: 18px;
 font-weight: bold;
 color: #333;
 letter-spacing: 0.05em;
 display: block;
}

@media screen and (max-width: 767px) {
 .l-main-navi-list__ttl--flat {
  margin-bottom: 5px;
  padding-bottom: 10px;
  font-size: 15px;
  
 }
}


/******************************/
/* PC用：メニューの右側スライド（左チラつき完全消滅版） */
/******************************/
@media screen and (min-width: 768px) {
 
 /* 1. 画面全体を覆う暗いオーバーレイは完全に非表示にする */
 .l-main-navi__overlay.is-on,
 .l-main-navi__overlay {
  display: none !important;
 }

 /* 2. メニューパネルの基本設定（閉じている時は、常に画面の右外に隠す） */
 .l-main-navi {
  display: block !important;
  position: fixed !important;
  top: 80px !important;
  left: auto !important;
  right: -420px !important;
  width: 330px !important;
  height: calc(100vh - 80px) !important;
  overflow-y: auto !important;
  background: #E9EDE8 !important;
  box-shadow: -5px 0 20px rgba(0, 0, 0, 0.15);
  padding: 40px 30px !important;
  box-sizing: border-box !important;
  
  /* 右へ左へスライドする動きだけをなめらかにする */
  transition: right 0.4s cubic-bezier(0.16, 1, 0.3, 1) !important;
 }

 /* 3. メニューが開いた時：右枠外から「右端(0)」へスッと滑り込んでくる */
 .l-main-navi.is-open {
  right: 0 !important;
 }

 /* 4. 内部の幅制限を解除して縦並びにする */
 .l-main-navi__wrap {
  max-width: 100% !important;
  padding: 0 !important;
 }

 .l-main-navi-list {
  display: flex;
  flex-direction: column;
  margin: 0 !important;
 }

 .l-main-navi-list__item {
  width: 100% !important;
  padding: 0 !important;
  margin-bottom: 25px;
 }

 /* ヘルプエリアの調整 */
 .l-header-help {
  margin-top: 0px !important;
  padding-top: 20px !important;
 }

 .l-header-help-box {
  display: flex;
  flex-direction: column;
  gap: 15px;
 }

 .l-header-help-list {
  width: 100% !important;
 }
}




/* メニューの各項目 */
.l-flat-menu-list__item {
 margin-bottom: 8px;
}

@media screen and (max-width: 767px) {
 /* 1. 【変更】子項目のリスト全体の上と下に白い線を引く */
 .l-flat-menu-list {
  border-top: 1px solid #FFF;
  border-bottom: 1px solid #FFF;
 }

 /* 2. 各子項目の間の線 */
 .l-flat-menu-list__item {
  margin-bottom: 0;
  border-bottom: 1px solid #FFF;
 }

 /* 3. 一番下の子項目の下の線は、リスト全体の底線と重なるので消す */
 .l-flat-menu-list__item:last-child {
  border-bottom: none; 
 }

 /* 4. タイトル（商品一覧など）と線の間の余白調整 */
 .l-main-navi-list__ttl--flat {
  margin-bottom: 10px;
  padding-bottom: 0;
  font-size: 15px;
 }

 /* 5. 大枠（各ブロック）の余白調整 */
 .l-main-navi-list__item {
  padding-bottom: 0;
  margin-bottom: 25px;
 }
}


/* メニューのリンクテキスト */
.l-flat-menu-list__link {
 display: block;
 font-size: 14px;
 color: #333;
 transition: all 0.3s ease;
}

@media screen and (max-width: 767px) {
 .l-flat-menu-list__link {
  padding: 14px 0px 11px 15px; 
  font-size: 14px;
  color: #444; 
 }
}

.l-flat-menu-list__link:hover,
.l-flat-menu-list__link:focus {
 opacity: 0.6;
 text-decoration: none !important;
 color: #333;
}



/********** ドロップダウンメニュー **********/
@media screen and (min-width: 768px) {
 .l-dropdown-menu {
  display: block !important;
 }
}
@media screen and (max-width: 767px) {
 .l-dropdown-menu {
  display: none;
  margin-bottom: 20px;
  color: #333;
 }
}
@media screen and (max-width: 767px) {
 .l-dropdown-menu-list {
  padding: 0 0 10px 0;
 }
}
.l-dropdown-menu-list__item {
 margin-bottom: 5px;
}
@media screen and (max-width: 1023px) {
 .l-dropdown-menu-list__item {
  margin-bottom: 15px;
 }
}
@media screen and (max-width: 767px) {
 .l-dropdown-menu-list__item {
  box-sizing: border-box;
  margin-bottom: 0;
  margin-left: 15px;
  line-height: 1.3;
  font-size: 14px;
  word-break: break-all;
 }
}
@media screen and (max-width: 767px) {
 .l-dropdown-menu-list__item:last-child {
  margin-bottom: 0;
 }
}
@media screen and (max-width: 767px) {
 .l-dropdown-menu-list__link {
  display: block;
  padding: 15px 0;
  color: #333;
 }
}
@media screen and (max-width: 767px) {
 .l-dropdown-menu-list__link:hover, .l-dropdown-menu-list__link:focus {
  color: #333;
 }
}
/********** 検索フォーム **********/
.l-header-search {
 position: absolute;
 top: 10px;
 right: 175px;
}
@media screen and (max-width: 767px) {
 .l-header-search {
  top: 0px;
  right: 128px;
 }
}

/* 検索開閉ボタン */
.l-header-search__btn {
 box-sizing: border-box;
 position: relative;
 padding: 2px 0 0 0;
 width: 50px;
 height: 45px;
 border: 0;
 background: none;
 transition: all ease 0.3s;
}
@media screen and (max-width: 767px) {
 .l-header-search__btn {
  padding-top: 3px;
  width: 45px;
 }
}
.l-header-search__btn::before, .l-header-search__btn::after {
 content: "";
 position: absolute;
 top: 21px;
 left: 15px;
 width: 20px;
 height: 2px;
 background-color: #000;
 opacity: 0;
 transition: all cubic-bezier(0.25, 0.46, 0.45, 0.94) 0.1s;
}
@media screen and (max-width: 767px) {
 .l-header-search__btn::before, .l-header-search__btn::after {
  top: 23px;
  left: 13px;
 }
}
.l-header-search__btn::before {
 transform: rotate(-45deg);
}
.l-header-search__btn::after {
 transform: rotate(45deg);
}
.l-header-search__btn.is-on img {
 display: none;
}
.l-header-search__btn.is-on::before, .l-header-search__btn.is-on::after {
 opacity: 1;
}
.l-header-search__btn img {
 width: 24px;
}
@media screen and (max-width: 767px) {
 .l-header-search__btn img {
  width: 20px;
 }
}

/* 検索コンテンツ（窓）の全体枠 */
.l-header-search__contents {
 display: none;
}

/* ▼ PC用：ボタンの下にカード型で展開 */
@media screen and (min-width: 768px) {
 .l-header-search__contents.is-on {
  box-sizing: border-box;
  display: block;
  position: absolute;
  top: 60px;
  right: -150px;
  z-index: 10;
  width: 380px;
  padding: 15px;
  background: #FFF;
  box-shadow: 0 10px 25px rgba(0, 0, 0, 0.15);
  border-radius: 6px;
  animation: anime-fade 0.2s ease forwards;
 }
}

/* ▼ スマホ用：全画面幅でヘッダーの下に展開（元の設定を維持） */
@media screen and (max-width: 767px) {
 .l-header-search__contents.is-on {
  box-sizing: border-box;
  display: block;
  position: fixed;
  left: 0;
  top: 55px;
  z-index: 10;
  padding: 10px 20px 15px 20px;
  width: 100%;
  background: #FFF;
  box-shadow: 0 5px 5px rgba(0, 0, 0, 0.05);
  animation: anime-fade 0.2s ease forwards;
 }
}

/* フォーム本体の枠線 */
.l-header-search__form {
 box-sizing: border-box;
 display: flex;
 flex-wrap: wrap;
 margin-left: auto;
 margin-right: auto;
 margin-bottom: 0;
 transition: all ease 0.4s;
}
@media screen and (min-width: 768px) {
 .l-header-search__form {
  border: 1px solid #ddd;
  border-radius: 4px;
  overflow: hidden;
  background: #fff;
 }
}
@media screen and (max-width: 767px) {
 .l-header-search__form {
  border-bottom: 1px solid #B3B2B2;
  max-width: 1280px;
 }
}

.l-header-search__form input::placeholder {
 color: #777;
}
.l-header-search__form input:-ms-input-placeholder {
 color: #777;
}
.l-header-search__form input::-ms-input-placeholder {
 color: #777;
}

/* 入力欄（テキストボックス） */
.l-header-search__input {
 flex: 1;
}
.l-header-search__input input {
 box-sizing: border-box;
 width: 100%;
 border: none;
 background: transparent;
 color: #333;
}
.l-header-search__input input:focus {
 outline: none;
}
@media screen and (min-width: 768px) {
 .l-header-search__input input {
  height: 44px;
  padding: 0 15px;
  font-size: 14px;
 }
}
@media screen and (max-width: 767px) {
 .l-header-search__input input {
  height: 50px;
 }
}

/* 送信ボタン（虫眼鏡） */
.l-header-search__submit {
 box-sizing: border-box;
 padding: 0;
 border: 0;
}
@media screen and (min-width: 768px) {
 .l-header-search__submit {
  width: 44px;
  height: 44px;
  background: #f5f5f5;
  cursor: pointer;
 }
}
@media screen and (max-width: 767px) {
 .l-header-search__submit {
  width: 50px;
  height: 50px;
  background: #FFF;
 }
}
.l-header-search__submit img {
 width: 21px;
}

/* 検索用背景の暗転（必要に応じて使用） */
.l-header-search__overlay {
 display: none;
 position: fixed;
 top: 0;
 left: 0;
 z-index: 10;
 width: 100%;
 height: 100%;
 background: rgba(0, 0, 0, 0.2);
 cursor: default;
}

/******************************/
/* アカウントボタン（ヘッダーアイコン） */
/******************************/
.l-header-account {
 position: absolute;
 top: 10px;
 right: 125px;
}

@media screen and (max-width: 767px) {
 .l-header-account {
  top: 0px;
  right: 86px;
 }
}

.l-header-account-btn {
 box-sizing: border-box;
 display: flex;
 align-items: center;
 justify-content: center;
 width: 45px;
 height: 45px;
 text-decoration: none;
 transition: opacity 0.3s ease;
}

.l-header-account-btn:hover,
.l-header-account-btn:focus {
 opacity: 0.6;
}

.l-header-account-btn img {
 width: 24px;
}

@media screen and (max-width: 767px) {
 .l-header-account-btn img {
  width: 20px;
 }
}

/********** カートボタン **********/
.l-header-cart {
 position: absolute;
 top: 10px;
 right: 75px;
}
@media screen and (max-width: 767px) {
 .l-header-cart {
  top: 0px;
  right: 47px;
 }
}
.l-header-cart form {
 margin: 0;
}
.l-header-cart-btn {
 box-sizing: border-box;
 display: flex;
 align-items: center;
 justify-content: center;
 position: relative;
 padding: 0;
 width: 45px;
 height: 45px;
 border: 0;
 background: none;
 text-align: center;
}
.l-header-cart-btn img {
 width: 26px;
}
@media screen and (max-width: 767px) {
 .l-header-cart-btn img {
  width: 22px;
 }
}
.l-header-cart-btn__count {
 box-sizing: border-box;
 position: absolute;
 top: 5px;
 right: 0px;
 padding: 3px 2px 0px 2px;
 height: 14px;
 min-width: 14px;
 border-radius: 10px;
 line-height: 1;
 font-size: 10px;
 background: #F00;
 color: #FFF;
 text-align: center;
}
/********** ヘルプナビ **********/
.l-header-help {
 display: flex;
 flex-wrap: wrap;
 justify-content: space-between;
 margin-top: 60px;
 padding: 60px 0;
 border-top: 1px solid #B3B2B2;
}

@media screen and (min-width: 768px) {
 .l-header-help {
 margin-top: 0;
 padding: 0;
 border-top: none;
 }
 
}



@media screen and (max-width: 1023px) {
 .l-header-help {
  display: block;
 }
}
@media screen and (max-width: 767px) {
 .l-header-help {
  margin-top: 44px;
  padding: 15px 0 0;
 }
}
.l-header-help-box {
 display: flex;
 flex-wrap: wrap;
 padding-bottom: 30px;
}
@media screen and (max-width: 767px) {
 .l-header-help-box {
  display: block;
 }
}
.l-header-help-list {
 width: 250px;
}
@media screen and (max-width: 1023px) {
 .l-header-help-list {
  width: 33.3333%;
 }
}
@media screen and (max-width: 767px) {
 .l-header-help-list {
  width: auto;
 }
}
@media screen and (max-width: 1023px) {
 .l-header-help-list__item {
  margin-bottom: 15px;
 }
}
@media screen and (max-width: 767px) {
 .l-header-help-list__item {
  margin-bottom: 0;
 }
}
.l-header-help-list__link {
 display: block;
 font-size: 14px;
}

.l-header-help-list__link {
  padding: 8px 0;
}


/***** SNSアイコン *****/
.l-header-sns-list {
 display: flex;
}
@media screen and (max-width: 1023px) {
 .l-header-sns-list {
  justify-content: center;
 }
}
.l-header-sns-list__item {
 margin-left: 20px;
}
@media screen and (max-width: 1023px) {
 .l-header-sns-list__item:first-child {
  margin-left: 0;
 }
}

/******************************/
/* 上に戻るボタン */
/******************************/
.page-top {
 position: fixed; 
 right: 30px; 
 bottom: 30px; 
 width: 60px; 
 height: 60px; 
 z-index: 999;
 opacity: 0; 
 visibility: hidden; 
 transition: opacity 0.5s ease, visibility 0.5s ease, transform 0.3s ease;
 filter: drop-shadow(0 4px 10px rgba(0,0,0,0.15)); 
}
.page-top.is-show { 
 opacity: 1; 
 visibility: visible; 
}
.page-top:hover { 
 transform: translateY(-5px); 
 filter: drop-shadow(0 6px 15px rgba(0,0,0,0.2)); 
}
.page-top .btn-bg { 
 fill: rgba(44, 62, 80, 0.85); 
 transition: fill 0.3s ease; 
}
.page-top:hover .btn-bg { 
 fill: rgba(44, 62, 80, 1); 
}


/* スマホ用のサイズ・位置調整 */
@media screen and (max-width: 767px) {
 .page-top { 
  right: 15px; 
  bottom: 20px; 
  width: 45px; 
  height: 45px; 
 }
}

/******************************/
/* footer */
/******************************/
.l-footer {
 padding-top: 60px;
 background: #505748;
 color: #FFF;

 @media screen and (min-width: 1023px) {
  padding-top: 90px;
 }

 a {
  color: #FFF;
 }
}

.l-footer a:hover,
.l-footer a:focus {
 color: #999999;
}

.l-footer-main {
 display: flex;
 flex-wrap: wrap;
 justify-content: space-between;
 position: relative;
 padding-bottom: 60px;
}
@media screen and (max-width: 1023px) {
 .l-footer-main {
  display: block;
 }
}
.l-footer-shopinfo {
 width: 370px;
}
@media screen and (max-width: 1280px) {
 .l-footer-shopinfo {
  width: 240px;
 }
}
@media screen and (max-width: 1023px) {
 .l-footer-shopinfo {
  width: auto;
  text-align: center;
 }
}
.l-footer-shopinfo__logo {
 word-break: break-all;
}
.l-footer-shopinfo__logo img {
 max-width: 210px;
 background: #FFF;
}
.l-footer-shopinfo__logo-txt {
 margin-top: 10px;
 font-size: 12px;
}
@media screen and (max-width: 767px) {
 .l-footer-shopinfo__logo-txt {
  text-align: center;
 }
}
.l-footer-shopinfo__txt {
 margin-top: 10px;
 font-size: 12px;
 color: #757575;
}
.l-footer-sns-list {
 display: flex;
 margin-top: 20px;
}
@media screen and (max-width: 1023px) {
 .l-footer-sns-list {
  margin-top: 35px;
  justify-content: center;
 }
}
.l-footer-sns-list__item {
 margin-right: 15px;

 svg {
  fill: currentColor;
 }
}
@media screen and (max-width: 1023px) {
 .l-footer-sns-list__item {
  margin-right: 25px;
 }
}
.l-footer-sns-list__item:last-child {
 margin-right: 0;
}
.l-footer-qr {
 padding: 15px;
 width: 150px;
 background: #F5F5F5;
}
@media screen and (max-width: 1023px) {
 .l-footer-qr {
  display: none;
 }
}
/***** footer ナビ *****/
.l-footer-navi {
 flex: 1;
 display: flex;
 flex-wrap: wrap;
}
@media screen and (max-width: 1023px) {
 .l-footer-navi {
  display: none;
 }
}
.l-footer-navi-list {
 width: 33.3333%;
}
.l-footer-navi-list__item {
 margin-bottom: 10px;
 font-size: 13px;
}
.l-footer-navi-list__item:last-child {
 margin-bottom: 0;
}
/***** コピーライト *****/
.l-copyright {
 background: #FFF;
 color: #333;
 padding: 30px 0;
 font-size: 12px;
 text-align: center;

 a {
  color: #333;
 }
}
@media screen and (max-width: 1023px) {
 .l-copyright {
  position: static;
  padding-bottom: 25px;
 }
}
@media screen and (max-width: 767px) {
 .l-copyright {
  font-size: 11px;
 }
}

/******************************/
/* フリーページ */
/******************************/
.p-freepage {
 a {
  text-decoration: underline;

  &:hover {
   text-decoration: none;
  }
 }
}

.p-freepage__contents {
 padding-top: 30px;

 @media screen and (min-width: 768px) {
  padding-top: 45px;
 }
}

.p-freepage__attention {
 margin-top: 15px;
 margin-bottom: 30px;
 color: #B94646;
 font-weight: bold;
 text-align: center;
}

.p-freepage__img {
 margin-top: 30px;
 margin-bottom: 30px;
 text-align: center;

 img {
  border: 1px solid #CCC;
 }
}

.p-freepage__body {
 margin-top: 30px;
 margin-bottom: 30px;
}

.p-freepage-ol {
 padding-left: 25px;
 list-style-type: decimal;
}

.p-freepage-ol__item {
 margin-top: 20px;
 margin-bottom: 20px;
 letter-spacing: 0.1em;
}

/******************************/
/* クイックカートイン */
/******************************/
.cart_in_modal, .cart_in_error_modal {
 position: fixed;
 width: 100%;
 height: 100%;
 top: 0;
 left: 0;
 background-color: rgba(0, 0, 0, 0.7);
 z-index: 20000;
 display: flex;
 overflow: auto;

 @media screen and (min-width: 960px) {
  align-items: center;
 }
}

.cart_in_modal__bg {
 background-color: rgba(0, 0, 0, 0.7);
 position: fixed;
 width: 100%;
 height: 100%;
 z-index: 20000;
}

.cart_in_modal__outline {
 width: 90%;
 margin: 20px 5%;
 padding: 20px;
 background-color: #FFF;
 border-radius: 5px;
 box-shadow: 0 2px 5px rgba(0, 0, 0, 0.4);
 box-sizing: border-box;
 text-align: center;
 position: absolute;

 @media screen and (min-width: 960px) {
  width: 900px;
  margin: auto;
  padding: 20px 70px;
  position: relative;
 }
}

.cart_in_modal__heading {
 font-size: 20px;
 font-weight: bold;
 margin: 20px 0;
 line-height: 1.4;

 @media screen and (min-width: 960px) {
  font-size: 26px;
  margin: 30px 0;
  line-height: 1.2;
 }
}

.cart_in_error_modal__heading {
 font-size: 20px;
 font-weight: bold;
 margin: 40px 0 20px;
 line-height: 1.4;

 @media screen and (min-width: 960px) {
   margin: 30px 0;
   line-height: 1.2;
 }
}

.cart_in_modal__detail {
 display: flex;
 padding: 20px;
 border-top: 1px solid #CCC;
 border-bottom: 1px solid #CCC;
 align-items: center;
 flex-direction: column;

 @media screen and (min-width: 960px) {
  flex-direction: row;
 }
}

.cart_in_modal__name {
 font-size: 16px;
 flex: 1;
 line-height: 1.4;
 text-align: left;
 margin: 0;

 @media screen and (min-width: 960px) {
  font-size: 18px;
 }
}

.cart_in_modal__image-wrap {
 padding: 5px;
 width: 170px;
 height: 170px;
 background: rgba(0, 0, 0, 0.1);
 position: relative;
 border: 5px solid transparent;
 box-sizing: border-box;

 @media screen and (min-width: 960px) {
  margin: 0 30px 0 0;
  flex-basis: 170px;
 }
}

.cart_in_modal__image {
 width: auto;
 height: auto;
 max-width: 100%;
 max-height: 100%;
 position: absolute;
 top: 0;
 bottom: 0;
 left: 0;
 right: 0;
 margin: auto;
}

.cart_in_modal__text-link {
 color: #2169F3;
 cursor: pointer;
 position: relative;
 display: inline-block;
 margin: 20px 0 0;
 padding: 0 0 0 20px;
 line-height: 1.15;

 &::before {
  content: "";
  position: absolute;
  top: 3px;
  left: 3px;
  width: 8px;
  height: 8px;
  border-top: 2px solid #2169F3;
  border-right: 2px solid #2169F3;
  -webkit-transform: rotate(225deg);
  transform: rotate(225deg);
 }
}

.cart_in_modal__button-wrap {
 width: 100%;
 margin: 30px auto;
 font-size: 17px;

 @media screen and (min-width: 960px) {
  width: 350px;
 }
}

.cart_in_modal__button {
 font-size: 17px;
 font-weight: bold;
 line-height: 23px;
 display: inline-block;
 box-sizing: border-box;
 cursor: pointer;
 vertical-align: middle;
 text-decoration: none;
 color: #FFF;
 border: 0;
 border-radius: 4px;
 width: 100%;
 height: 58px;
 padding: 15px;
 background: #2169F3;
 box-shadow: 0 2px 0 #1A54C2;
 outline: none;
 -webkit-appearance: none;
 -moz-appearance: none;
 appearance: none;

 &:hover,
 &:focus {
  height: 58px;
  color: #E9F0FE;
  background-color: #1E5FBD;
  box-shadow: none;
  transform: translate3d(0, 2px, 0);
 }
}

.cart_in_modal__close-icon {
 cursor: pointer;

 &::before,
 &::after {
  content: "";
  width: 35px;
  height: 6px;
  display: block;
  position: absolute;
  top: 30px;
  right: 20px;
  background: #EEE;
  border-radius: 4px;
 }

 &::before {
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
 }

 &::after {
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
 }
}

.spinner::before {
 content: "";
 box-sizing: border-box;
 position: absolute;
 top: 50%;
 left: 50%;
 height: 100px;
 width: 100px;
 margin-top: -50px;
 margin-left: -50px;
 border-radius: 50%;
 border: 5px solid #EEE;
 border-top-color: #FD7F23;
 animation: spinner 0.5s linear infinite;
}
@keyframes spinner {
 to {
  transform: rotate(360deg);
 }
}
@media screen and (min-width: 960px) {
 .sp-br {
  display: none;
 }
}

/******************************/
/* category */
/******************************/
.p-category {
 overflow: hidden;

 details {
  border-radius: 4px;
  background: rgba(255,255,255,0.4);
  padding: 16px;

  summary {
   cursor: pointer;
   font-size: 14px;
   color: #505748;

   & + .p-category-list {
    margin-top: 16px;
   }
  }
 }
}

/******************************/
/* ページヘッダー */
/******************************/
.p-page-header {
 background: #E9EDE8;
 padding: 40px 0;

 @media screen and (min-width: 768px) {
  padding: 64px 0;
 }
}

.p-page-header__container {
 display: flex;
 flex-direction: column;
 gap: 32px;
 max-width: 1280px;
 margin-inline: auto;
 padding: 0 max(16px, 2%);

 @media screen and (min-width: 768px) {
  gap: 48px;
 }
}

.p-page-header__meta {
 display: flex;
 flex-direction: column;
 align-items: stretch;
 gap: 8px;
}

.p-page-header__title {
 margin: 0;
 font-family: "游明朝", "Yu Mincho", "YuMincho", "Hiragino Mincho ProN", "Shippori Mincho", serif;
 font-size: 26px;
 line-height: 1.3;
 color: #333;
 font-weight: normal;
 letter-spacing: 0.1em;

 @media screen and (min-width: 500px) {
  font-size: 32px;
 }
}

.p-page-header__description {
 font-size: 12px;

 @media screen and (min-width: 768px) {
  font-size: 14px;
 }
}

/******************************/
/* カテゴリー一覧 */
/******************************/
.p-category-list {
 display: grid;
 grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
 gap: 16px 24px;
}

.p-category-list__item {
 display: flex;
}

.p-category-list__link {
 display: flex;
 align-items: center;
 gap: 8px;
}

.p-category-list__image {
 border-radius: 4px;
 width: 48px;
 height: 48px;
 object-fit: cover;
 aspect-ratio: 1 / 1;
}

.p-category-list__label {
 font-size: 12px;
}

/******************************/
/* 商品件数・ソート */
/******************************/
.p-product-option {
 display: flex;
 flex-direction: column;
 justify-content: space-between;
 gap: 4px;
 width: 100%;
 max-width: 1280px;
 margin-inline: auto;

 @media screen and (min-width: 500px) {
  flex-direction: row;
  align-items: center;
 }
}

.p-product-option__number {
 font-size: 14px;
}

.p-product-option__sort {
 display: flex;
 align-items: center;
 gap: 4px;
}

.p-product-option__title {
 flex: 0 0 auto;
 font-size: 14px;
}

.p-product-option__select {
 border: 1px solid #B3B2B2;
 border-radius: 4px;
 min-width: 180px;
 height: auto;
 padding: 8px;
 line-height: 1.4;
 color: #333;
}

/******************************/
/* 商品一覧 */
/******************************/
.p-product-list {
 display: grid;
 grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
 justify-content: center;
 gap: 32px 16px;
 width: 100%;

 @media screen and (min-width: 500px) {
  grid-template-columns: repeat(auto-fill, minmax(190px, 1fr));
  gap: 48px 24px;
 }

 @media screen and (min-width: 800px) {
  grid-template-columns: repeat(auto-fill, minmax(240px, 1fr));
 }
}

.p-product-list__item {
 flex: 0 0 auto;
 display: flex;
}