@charset "UTF-8";

body {
  font-size: 14px;
  line-height: 1.5;
  font-family: sans-serif;
  color: #19191a;
  /* -webkit-font-smoothing: antialiased;
  -webkit-text-size-adjust: 100%; */
}

.hide {
  display: none;
}

#page_homepage .ec-layoutRole {
  background: #fff;
  overflow: hidden;
}

#page_homepage .ec-layoutRole {
  /* background: #f8f8f8; */
}

#page_homepage .ec-layoutRole .ec-layoutRole__contents {
  margin-top: 0;
}

.ec-blockBtn {
  border-radius: 8px;
}

/* 画像hover 共通設定 */
a:hover > ul > li > img {
  opacity: 0.8;
}

a > ul > li > img {
  transition: opacity 0.3s ease-out 0s;
}

/* ヘッダー */
header.ec-layoutRole__header {
  background: #71c7d5;
}

.ec-headerNav .ec-headerNav__itemIcon {
  color: #000;
}

.ec-cartNavi {
  color: #000;
  height: auto;
  min-width: unset;
}

.ec-cartNavi .ec-cartNavi__icon {
  font-variation-settings: 'FILL' 1, 'wght' 300, 'GRAD' 0, 'opsz' 24;
  width: 2rem;
}

.ec-headerNaviRole {
  display: flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
  padding-bottom: 20px;
  line-height: unset;
}

.ticker {
  display: inline-flex;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  width: 100%;
  height: 40px;
  overflow: hidden;
  background-image: url(../img/top/tiker.svg);
  background-color: #000;
  background-repeat: repeat-x;
  background-size: contain;
}

.ec-headerNaviRole__logo {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: 100%;
}

.ec-headerNaviRole__logo_inner > h1 {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: 100%;
  margin: 0;
}

h1.header_logo > a {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: 100%;
  overflow: hidden;
}

h1.header_logo > a > img {
  width: 100%;
  max-height: 32px;
  object-fit: contain;
  object-position: top;
}

.ec-headerNaviRole__logo_inner {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 10rem;
  margin-left: 42.5px;
}



/* ヘッダーナビゲーション */
.ec-headerNaviRole .ec-headerNaviRole__left {
  width: fit-content;
}
.ec-headerNaviRole .ec-headerNaviRole__right {
  width: fit-content;
}

.ec-headerNaviRole .ec-headerNaviRole__nav {
  display: none;
}

/* スマホ用サイドナビゲーション */
.ec-input select, .ec-birth select, .ec-select select, .ec-halfInput select, .ec-numberInput select, .ec-zipInput select, .ec-telInput select {
  font-size: 13px;
}

.ec-headerSearch .ec-headerSearch__keyword input[type=search] {
  font-size: 13px;
}

.ec-headerSearch .ec-headerSearch__category .ec-select.ec-select_search::before {
  content: '\f13a';
  font-family: 'Font Awesome 5 Free';
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  position: absolute;
  top: 0;
  bottom: 0;
  right: 0.4em;
  width: fit-content;
  height: auto;
  padding: 0;
  border-left: 0;
  border-right: 0;
  border-top: 0;
  pointer-events: none;
}

.ec-headerSearch .ec-headerSearch__keyword {
  background: #fff;
  border: 1px solid #000;
  border-top-right-radius: 0.25rem;
  border-bottom-right-radius: 0.25rem;
  box-sizing: border-box;
}

.ec-headerSearch .ec-headerSearch__keyword .ec-icon {
  transform: scale(.7);
}

.ec-headerNavSP {
  /* -webkit-font-smoothing: antialiased;
  -webkit-text-stroke-color: #fff;
  -webkit-text-stroke-width: 0.5px; */
  top: 19px;
}

.ec-drawerRoleClose {
  /* -webkit-font-smoothing: antialiased;
  -webkit-text-stroke-color: #fff;
  -webkit-text-stroke-width: 0.5px; */
}

.ec-drawerRole {
  background: #fff;
  /* background: #888; */
}

.ec-drawerRole .ec-headerLinkArea {
  background: #fff;
}

.ec-drawerRole .ec-headerCategoryArea .ec-headerCategoryArea__heading {
    font-weight: bold;
    /* color: #a0a0a0; */
    color: #000;
    font-size: 12px;
    /* background: rgb(248 248 248); */
    background: #fff;
    padding: 10px 15px;
    line-height: 1.5;
    border-top: 1px solid rgba(45, 45, 45, 0.05);
    border-bottom: 2px solid rgba(45, 45, 45, 0.05);
    padding: 1em 10px;
    position: relative;
}

.ec-drawerRole .ec-headerCategoryArea .ec-headerCategoryArea__heading::after {
  content: "";
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 20%;
  border-top: 2px solid #000;
  position: absolute;
  bottom: -2px;
  left: 10px;
}



.ec-drawerRole .ec-headerCategoryArea .ec-itemNav__nav li a {
  background: #fff;
  font-size: 13px;
  font-weight: normal;
  line-height: 1.46;
  color: rgb(45, 45, 45);
  padding: 15px 15px;
  border-bottom: 1px solid rgba(45, 45, 45, 0.05);
  position: relative;
}

.ec-drawerRole .ec-headerCategoryArea .ec-itemNav__nav li a:after {
  content: '\f105';
  color: #71c7d5;
  font-family: 'Font Awesome 5 Free';
  font-size: 25px;
  font-weight: bold;
  display: flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: fit-content;
  position: absolute;
  top: 0;
  right: 15px;
  bottom: 0;
  -webkit-font-smoothing: antialiased;
  -webkit-text-stroke-color: #fff;
  -webkit-text-stroke-width: 1px;
}

h3.sideTtl_sp {
  font-weight: bold;
  /* color: #a0a0a0; */
  color: #000;
  font-size: 12px;
  /* background: rgb(248 248 248); */
  background: #fff;
  padding: 10px 15px;
  line-height: 1.5;
  border-bottom: 2px solid rgba(45, 45, 45, 0.05);
  padding: 1em 10px;
  margin: 0;
  position: relative;
}

h3.sideTtl_sp::after {
    content: "";
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    width: 20%;
    border-top: 2px solid #000;
    position: absolute;
    bottom: -2px;
    left: 10px;
}

.ec-drawerRole .ec-headerLinkArea .ec-headerLink__list {
  border-top: none;
}

.ec-drawerRole .ec-headerLinkArea .ec-headerLink__item {
  display: block;
  border-bottom: 1px solid rgba(45, 45, 45, 0.05);
  padding: 15px 15px;
  font-size: 13px;
  font-weight: normal;
  color: rgb(45, 45, 45);
}

.ec-drawerRole .ec-headerLinkArea .ec-headerLink__icon {
  display: inline-block;
  width: fit-content;
  font-size: 13px;
}

/* トップページブロック */

.ec-layoutRole__contents {
  margin-top: 25px;
}

.top_block_title {
  display: flex;
  flex-wrap: nowrap;
  width: 100%;
  align-items: center;
  justify-content: space-between;
  padding: 0;
  margin: 0 0 20px 0;
}

#page_product_detail .top_block_title {
    margin: 0 20px;
}

#page_product_list .top_block_title {
    margin: 0 20px;
}

#page_homepage #history .top_block_title {
    margin: 0 20px;
}

.top_block_title > h2 {
  font-weight: 600;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
  overflow-wrap: normal;
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  align-items: center;
  /* -webkit-box-orient: vertical; */
  /* -webkit-line-clamp: 2; */
  font-size: 16px;
  line-height: 1.6875;
  padding-bottom: 0;
  margin-top: 0;
  margin-bottom: 0;
  color: #19191a;
}

.top_block_title > h2 > i {
  margin-right: 0.5rem;
  margin-left: 0.25rem;
  background-image: linear-gradient(45deg, #ffd700, #ffcc00, #ffb700);
  -webkit-background-clip: text;
  color: transparent;
  animation: heartbeat 1.2s ease-in-out infinite;
  filter: drop-shadow(2px 2px 0.5px #bbb);
}

.ec-newsRole {
  border-top: 1px solid #f1f1f1;
}

/* 新着商品 */
.products_ttl {
  display: flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: 100%;
  margin-top: 32px;
}

.products_ttl img {
    width: 20rem;
}

div#new_item_wrap {
 display: flex;
 justify-content: flex-start;
 flex-wrap: wrap;
 width: 100%;
 padding: 20px;
 border-top: 1px solid #f1f1f1;
}

#new_item {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 15px;
  list-style: none;
  padding: 0;
  margin: 0;
  list-style: none;
  width: 100%;
}

/* 制限がかかっている商品リスト全体のうっすら不透明度 */
#new_item li.inview.is-restricted {
    opacity: 0.9;
}

/* 画像表示エリア（共通設定） */
#new_item li style-image-wrap {
    position: relative;
    overflow: hidden;
}

#new_item > li {
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
    list-style: none;
    position: relative;
}

#new_item > li > a {
  display: flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
}

#new_item > li > a > ul {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  list-style: none;
  padding: 0;
  flex-direction: column;
  position: relative;
}

#new_item > li > a > ul > li {
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
    list-style: none;
}

ul#new_item > li > a > ul > li.product_review_area_wrap {
	grid-row: 4;
	overflow: hidden;
	margin-bottom: 0px;
}

ul#new_item > li > a > ul > li.product_tags {
	grid-row: 5;
	margin-bottom: 5px;
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: max-content;
	overflow-x: auto;
	gap: 5px;
	width: 100%;
	list-style: none;
	scrollbar-width: none;
}

#new_item > li > a > ul > li:first-of-type {
    padding-right: 0;
    padding-left: 0;
    position: relative;
    overflow: hidden;
    border-radius: 0.25rem;
}

#new_item > li > a > ul > li:first-of-type > img {
    width: 100%;
    object-fit: cover;
    object-position: center;
    aspect-ratio: 1 / 1;
}

#new_item > li > a > ul > li:nth-of-type(2) {
    padding-top: 10px;
    margin-bottom: 5px;
}

#new_item > li > a > ul > li:nth-of-type(2) > h3 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
  overflow-wrap: normal;
  font-size: 13px;
  font-weight: normal;
  line-height: 1.5;
  color: #19191a;
  margin: 0;
}

#new_item > li > a > ul > li.description_list {
  grid-row: 3;
  overflow: hidden;
}

#new_item > li > a > ul > li.description_list > h4 {
  font-size: 12px;
  font-weight: normal;
  line-height: 1.5;
  color: #3360FF;
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  padding: 8px;
  margin: 0 0 5px 0;
  background: #3360FF12;
  border-radius: 0.25rem;
}

#new_item > li > a > ul > li.offprice {
  grid-row: 7;
  display: inline-flex;
  flex-direction: row;
  align-items: flex-end;
  margin-top: 0;
  margin-bottom: 5px;
}

#new_item > li > a > ul > li.offprice > span {
    color: rgba(255,255,255,0.8);
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-word;
    overflow-wrap: normal;
    font-size: 12px;
    font-weight: 600;
    display: -webkit-box;
    width: fit-content;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    background-color: #ff1493;
    background-image: linear-gradient(90deg, #ff3300 0%, #ff1493 100%);
    padding: 2px 5px;
    border-radius: 0.25rem;
}

#new_item > li > a > ul > li.list_price {
  grid-row: 8;
  flex-direction: row;
  align-items: flex-end;
  align-content: flex-end;
  margin-bottom: 0px;
}

ul#new_item > li > a > ul > li.list_price > span.price-display-wrap.normal-price {
	color: rgb(25, 25, 26);
	font-size: 16px !important;
	position: relative;
}

ul#new_item > li > a > ul > li.list_price > span.rank_price:has(span) {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	padding: 4px;
	font-size: 1.1rem !important;
	background: linear-gradient(90deg, rgb(17, 153, 142) 0%, rgb(56, 239, 125) 100%) rgb(74, 44, 0);
	border-radius: 0.25rem;
	color: rgb(255, 255, 255) !important;
	margin-top: 3px;
}

#new_item > li > a > ul > li.list_price > span {
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-word;
    overflow-wrap: normal;
    /* font-size: 14px; */
    font-size: 20px;
    color: #ed293e;
    font-weight: 600;
    line-height: 1.5;
    display: -webkit-box;
    width: 100%;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

#new_item > li > a > ul > li.list_price > span > .yen {
    font-size: 12px;
    margin-right: 2px;
}

#new_item > li > a > ul > li.list_point {
  grid-row: 9;
  flex-direction: row;
  align-items: flex-end;
  align-content: flex-end;
  margin-bottom: 15px;
}

#new_item > li > a > ul > li.list_point span.product_sub_info_icon::before {
    color: #fff;
    content: 'P';
    font-weight: bold;
    display: inline-flex;
    justify-content: center;
    flex-wrap: nowrap;
    align-items: center;
    width: fit-content;
    position: relative;
    top: 0;
    left: 0;
    bottom: 0;
    padding: 0;
    transform: scale(0.8);
    transform-origin: center;
}

/* 通常の商品画像 */
#new_item .product-img {
    width: 100%;
    height: auto;
    display: block;
}

/* 制限時の画像：1(通常)＝薄く、2(Black)＝真っ黒 */
#new_item .is-restricted .product-img.res-type-1 {
    opacity: 0.2;
}
#new_item .is-restricted .product-img.res-type-2 {
    filter: brightness(0);
}

/* 制限時のオーバーレイ（鍵アイコンの中央配置コンテナ） */
#new_item .restricted-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    pointer-events: none;
}
#new_item .restricted-overlay.res-bg-1 {
    background: rgba(0, 0, 0, 0.1);
}
#new_item .restricted-overlay.res-bg-2 {
    background: transparent;
}

/* 鍵アイコン */
#new_item .restricted-overlay i.fa-lock {
    font-size: 2.5rem;
    color: #ff0000;
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
}

/* バッジ：未開放 / ロック中 */
#new_item .lock-badge-red {
    font-size: 0.9rem;
    font-weight: bold;
    background: #c00;
    color: #fff;
    padding: 3px 12px;
    margin-top: 10px;
    border-radius: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.3);
}
#new_item .lock-badge-dark {
    font-size: 0.8rem;
    font-weight: bold;
    color: #fff;
    background: rgba(0,0,0,0.6);
    padding: 2px 10px;
    border-radius: 4px;
    margin-top: 10px;
    border: 1px solid rgba(255,255,255,0.3);
}

/* サブテキスト：ログイン必須 / ステータス不足 */
#new_item .lock-subtext-shadow {
    font-size: 0.8rem;
    font-weight: bold;
    color: #fff;
    padding: 2px 10px;
    margin-top: 5px;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
}
#new_item .lock-subtext-normal {
    font-size: 0.8rem;
    font-weight: bold;
    color: #fff;
    padding: 2px 10px;
    margin-top: 10px;
}

/* 価格表示：制限時のぼかし */
#new_item .price-display-wrap.is-blur {
    filter: blur(6px);
    user-select: none;
}


/* 心臓の鼓動アニメーション */
@keyframes heartbeat {
  0% {
    transform: scale(1); /* 最初は通常のサイズ */
  }
  25% {
    transform: scale(1.2); /* 少し大きく膨らむ */
  }
  50% {
    transform: scale(1); /* 元に戻る */
  }
  75% {
    transform: scale(1.1); /* 少し小さく膨らむ */
  }
  100% {
    transform: scale(1); /* 最後は元に戻る */
  }
}

#new_item > li > a > ul > li.description_list {
  margin-bottom: auto;
}


/* 新着情報 */
/* 1. タイトルエリア（新着ITEMSの左端のラインに完全同期） */
.top_block_title.news {
    margin: 8px 0;
    padding: 0 /* 全体のテキスタイルと左端を揃える */
}
.top_block_title.news h2 {
    font-family: -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN", sans-serif;
    font-size: 1.25rem;
    font-weight: 700;
    color: #000000;
    letter-spacing: 0.02em;
}

/* 2. ニュース全体枠（制限をすべて解除し、横幅いっぱいに広げる） */
.ec-newsRole {
    padding: 0;
    margin: 0;
    width: 100% !important;
    max-width: 100% !important;
    background-color: transparent;
    margin-bottom: 20px;
}
.ec-newsRole_inner {
    width: 100% !important;
    max-width: 100% !important;
    margin: 0;
}
.ec-newsRole__news {
    width: 100%;
    border-top: 1px solid #eeeeee; /* 画面端から端まで突き抜ける細い線 */
}

.ec-newsRole .ec-newsRole__newsDate {
  margin: 0;
}

/* 3. ニュースアイテム（1行の塊） */
.ec-newsRole__newsItem {
    width: 100%;
    border-bottom: 1px solid #eeeeee!important;
    background-color: #ffffff;
}

/* 4. ヘッダー（タップ領域：スマホに最適化した上下2段のflexレイアウト） */
.ec-newsRole__newsHeading {
    padding: 18px 15px; /* 左右に15pxの余白を持たせ、画面の端まで綺麗に見せる */
    cursor: pointer;
    display: flex;
    flex-direction: column; /* 上から下へ美しく流す */
    gap: 8px; /* 日付とタイトルの間の心地よい余白 */
}

/* 5. 1段目：メタ情報（日付 ＋ 黒バッジ） */
.ec-newsRole__meta {
    display: flex;
    align-items: center;
    gap: 8px;
}
.ec-newsRole__newsDate {
    font-family: 'Helvetica Neue', Arial, sans-serif;
    font-size: 0.75rem;
    color: #888888;
    font-weight: 500;
}
.ec-newsRole__newsCategory {
    font-size: 0.6rem;
    font-weight: 700;
    color: #ffffff;
    background-color: #111111; /* 浮かないシャープな黒 */
    padding: 2px 6px;
    border-radius: 2px;
    letter-spacing: 0.05em;
    line-height: 1;
}

/* 6. 2段目：タイトル ＋ 矢印（横幅いっぱいに美しく左右に引き離す） */
.ec-newsRole__newsColumn {
    display: flex;
    justify-content: space-between; /* タイトルを左端、矢印を右端へ */
    align-items: center; /* 縦の中央を揃える */
    width: 100%;
}
.ec-newsRole__newsTitle {
    font-size: 0.85rem;
    color: #333333;
    line-height: 1.4;
    font-weight: 400;
    padding-right: 15px; /* 矢印に絶対に被らないためのセーフティ */
}

/* 7. 矢印ボタン（右端に美しく固定） */
.ec-newsRole__newsClose {
    flex-shrink: 0; /* 画面が狭くなっても絶対に潰さない */
}
.ec-newsRole__newsCloseBtn {
    background: none;
    border: none;
    outline: none;
    padding: 4px;
    cursor: pointer;
    color: #999999;
    font-size: 0.85rem; /* 主張しない華奢なサイズ */
    transition: transform 0.3s cubic-bezier(0.25, 1, 0.5, 1);
}

/* アコーディオンオープン時の矢印の回転 */
.ec-newsRole__newsItem.is-active .ec-newsRole__newsCloseBtn {
    transform: rotate(180deg);
    color: #111111;
}

/* 8. 本文エリア（開閉スライド） */
.ec-newsRole__newsDescription {
    overflow: hidden;
    transition: height 0.3s cubic-bezier(0.25, 1, 0.5, 1);
    background-color: #fafafa; /* 開いた時に一目で本文だとわかる極薄のニュアンスグレー */
}
.ec-newsRole__newsDescriptionInner {
    padding: 15px 15px 20px 15px; /* 本文の左右の余白もヘッダーの15pxと完全同期 */
    font-size: 0.8rem;
    color: #555555;
    line-height: 1.6;
}

/* 詳しくはこちらリンク（値引きバッジのピンクに完全同期） */
.news_detail_link {
    display: inline-flex;
    align-items: center;
    gap: 4px;
    margin-top: 12px;
    color: #ff167f;
    font-size: 0.75rem;
    font-weight: 700;
    text-decoration: underline;
}

.ec-newsRole .ec-newsRole__newsCloseBtn {
    display: inline-flex;
    justify-content: center;
    flex-wrap: nowrap;
    align-items: center;
}

.ec-newsRole .ec-newsRole__newsCloseBtn > i {
    display: inline-flex;
    justify-content: center;
    flex-wrap: nowrap;
    align-items: center;
    width: fit-content;
}

.ec-newsRole .ec-newsRole__newsCloseBtn > i {
    display: inline-flex;
    justify-content: center;
    flex-wrap: nowrap;
    align-items: center;
    position: absolute;
    top: 4px;
}

/* トップページカテゴリ別商品 */

#top_item_wrap {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  padding-bottom: 34px;
  min-height: 50dvh;
}

#top_item_wrap.active {
  min-height: unset;
}

.top_category_items {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%; 
  opacity: 0;
}

.top_category_items.active {
  opacity: 1;
  transition: opacity 1s ease-in-out;
}

ul.category_item {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
  list-style: none;
  padding: 15px 0px;
  margin-top: 0;
  margin-bottom: 0;
  margin-right: 20px;
  margin-left: 20px;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: none;
  scrollbar-width: none;
  filter: drop-shadow(rgba(0, 0, 0, 0.03) 0px 3.5px 12px);
}

ul.category_item::-webkit-scrollbar {
  display:none;
}

ul.category_item > li {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
  flex: 0 0 40%;
  margin: 0 0 0 0;
  overflow: hidden;
  background: #fff;
  position: relative;
}

ul.category_item > li:first-of-type {
  border-top-left-radius: 10px;
  border-bottom-left-radius: 10px;
}

ul.category_item > li:last-of-type {
  border-top-right-radius: 10px;
  border-bottom-right-radius: 10px;
}

.category_item > li:first-of-type:before {
  content: '\f02e';
  font-family: 'Font Awesome 5 Free';
  color: #ffd700;
  font-size: 30px;
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  width: fit-content;
  height: fit-content;
  position: absolute;
  top: -8px;
  left: 0;
  z-index: 1;
  padding: 0;
}

.category_item > li:first-of-type:after {
  content: '1';
  color: #fff;
  font-family: 'Font Awesome 5 Free';
  font-size: 30px;
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  width: 20px;
  height: 20px;
  position: absolute;
  top: 3px;
  left: 1px;
  z-index: 1;
  padding: 0;
  transform: scale(0.4);
  transform-origin: center;
}

.category_item > li:nth-of-type(2):before {
  content: '\f02e';
  font-family: 'Font Awesome 5 Free';
  color: #c0c0c0;
  font-size: 30px;
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  width: fit-content;
  height: fit-content;
  position: absolute;
  top: -8px;
  left: 0;
  z-index: 1;
  padding: 0;
}

.category_item > li:nth-of-type(2):after {
  content: '2';
  color: #fff;
  font-family: 'Font Awesome 5 Free';
  font-size: 30px;
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  width: 20px;
  height: 20px;
  position: absolute;
  top: 3px;
  left: 1px;
  z-index: 1;
  padding: 0;
  transform: scale(0.4);
  transform-origin: center;
}

.category_item > li:nth-of-type(3):before {
  content: '\f02e';
  font-family: 'Font Awesome 5 Free';
  color: #DA744B;
  font-size: 30px;
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  width: fit-content;
  height: fit-content;
  position: absolute;
  top: -8px;
  left: 0;
  z-index: 1;
  padding: 0;
}

.category_item > li:nth-of-type(3):after {
  content: '3';
  color: #fff;
  font-family: 'Font Awesome 5 Free';
  font-size: 30px;
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  width: 20px;
  height: 20px;
  position: absolute;
  top: 3px;
  left: 1px;
  z-index: 1;
  padding: 0;
  transform: scale(0.4);
  transform-origin: center;
}

.category_item > li:before {
  content: '\f02e';
  font-family: 'Font Awesome 5 Free';
  color: rgba(0, 0, 0, 0.2);
  font-size: 30px;
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  width: fit-content;
  height: fit-content;
  position: absolute;
  top: -8px;
  left: 0;
  z-index: 1;
  padding: 0;
}

.category_item > li:after {
  color: #fff;
  font-family: 'Font Awesome 5 Free';
  font-size: 30px;
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  width: 20px;
  height: 20px;
  position: absolute;
  top: 3px;
  left: 1px;
  z-index: 1;
  padding: 0;
  transform: scale(0.4);
  transform-origin: center;
}

.category_item > li:nth-of-type(4):after {
  content: '4';
}

.category_item > li:nth-of-type(5):after {
  content: '5';
}

.category_item > li:nth-of-type(6):after {
  content: '6';
}

.category_item > li:nth-of-type(7):after {
  content: '7';
}

.category_item > li:nth-of-type(8):after {
  content: '8';
}

ul.category_item > li > a {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
}

ul.category_item > li > a > ul {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  list-style: none;
  padding: 0;
  flex-direction: column;
}

ul.category_item > li > a > ul > li {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  padding-right: 10px;
  padding-left: 10px;
  overflow: hidden;
}

ul.category_item > li > a > ul > li > img {
  width: 100%;
  object-fit: cover;
  object-position: center;
  aspect-ratio: 1 / 1;
}

ul.category_item > li > a > ul > li:first-of-type {
  padding-right: 0;
  padding-left: 0;
  position: relative;
}

ul.category_item > li > a > ul > li:first-of-type > span {
  color: rgba(255,255,255,0.8);
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
  overflow-wrap: normal;
  font-size: 12px;
  font-weight: 600;
  transform: scale(.8);
  transform-origin: left bottom;
  display: -webkit-box;
  width: fit-content;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  position: absolute;
  bottom: 0;
  left: 0;
  background: rgba(237,41,62,.9);
  padding: 2px 5px;
}

ul.category_item > li > a > ul > li:nth-of-type(2) {
  padding-top: 10px;
}

ul.category_item > li > a > ul > li:nth-of-type(2) > h3 {
  display: -webkit-box;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
  overflow-wrap: normal;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;
  color: #2d2d2d;
  margin: 0;
}

ul.category_item > li > a > ul > li:nth-of-type(3) {
  display: inline-flex;
  width: 100%;
  padding: 0;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin-bottom: 5px;
  background: rgba(255, 255, 255, 0.9);
  aspect-ratio: 1 / 1;
  overflow: hidden;
  opacity: 0;
  transition: all .5s ease;
}

ul.category_item > li > a > ul > li:nth-of-type(3).is-open {
  opacity: 1;
}

ul.category_item > li > a > ul > li:nth-of-type(3) > h4 {
  font-size: 10px;
  font-weight: normal;
  line-height: 1.5;
  color: #2d2d2d;
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  margin-bottom: 0;
  overflow-y: scroll;
  padding: 10px;
  aspect-ratio: 1 / 1;
  z-index: 1;
  box-sizing: border-box;
}

ul.category_item > li > a > ul > li:last-of-type {
  flex-direction: row;
  flex-grow: 1;
  align-items: flex-end;
  align-content: flex-end;
  margin-bottom: 15px;
}

ul.category_item > li > a > ul > li:last-of-type > span {
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
  overflow-wrap: normal;
  font-size: 14px;
  color: #ed293e;
  font-weight: 600;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  margin-top: 5px;
}

/* カテゴリコレクション */
.ec-categoryWrap {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
    position: relative;
    overflow: hidden;
}

.ec-categoryWrap .catWrap_inner {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
  width: 100%;
  padding: 0;
}

.catWrap_inner h2 {
  display: inline-flex;
  justify-content: center;
  flex-wrap: wrap;
  width: 100%;
  margin: 32px auto;
}

.catWrap_inner h2 img {
  width: 20rem;
  margin: 0 auto;
  object-fit: contain;
}

ul.collection_list {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  max-width: 1130px;
  margin: 0 auto;
  padding: 0;
  list-style: none;
  padding: 0 12px;
  z-index: 1;
}

ul.collection_list li {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: calc((100% / 2) - 6px);
  margin: 0 12px 12px 0;
  filter: drop-shadow(0px 0px 6px white);
  position: relative;
  flex-direction: row;
}

ul.collection_list li:nth-of-type(2)::after {
  content: '人気 No.1';
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: fit-content;
  position: absolute;
  top: 3%;
  right: -23%;
  color: #fff;
  font-weight: bold;
  font-size: 0.8rem;
  background: rgba(255,0,0,0.8);
  z-index: 8;
  padding: 8px;
  transform: translate(-50%,-50%) rotate(15deg);
  animation: move_tag 1.5s infinite;
}

@keyframes move_tag {
  0% {
      transform: translate(-50%,-50%) rotate(15deg) scale(1.2)
  }
  5% {

      transform: translate(-50%,-50%) rotate(15deg) scale(1)
  }
  95% {
      transform: translate(-50%,-50%) rotate(15deg) scale(1)
  }
  100% {
      -webkit-transform: translate(-50%,-50%) rotate(15deg) scale(1.2)
  }
}

ul.collection_list li:nth-of-type(2n) {
  margin-right: 0;
}

ul.collection_list li a {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
}

ul.collection_list li a dl {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
}

ul.collection_list li a dl dt {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  aspect-ratio: 1/1;
  width: 100%;
}

ul.collection_list li a dl dt img {
  object-fit: contain;
  width: 100%;
}

ul.collection_list li a dl dd {
  display: inline-flex;
  justify-content: center;
  flex-wrap: wrap;
  width: 100%;
  color: #fff;
  font-weight: bold;
  font-size: 1.2rem;
  padding-top: 0.5rem;
}


/* カテゴリブロック */
/* 全体を囲むコンテナ（左右の余白調整や、スクロールバーの隠し処理用） */
.category-scroll-container {
    width: 100%;
    overflow: hidden;
    padding: 15px 0;
    background-color: #fff;
}

/* スクロールリスト共通の設定 */
.category-scroll-list {
    display: grid;
    grid-auto-flow: column;     /* 基本は右方向（横）へ自動追加 */
    grid-auto-columns: 70px;    /* スマホ時の1マスの横幅 */
    gap: 10px 12px;
    padding: 0 15px;
    margin: 0;
    list-style: none;
    overflow-x: auto;           /* 横スクロールを有効化 */
    -webkit-overflow-scrolling: touch; /* iOSでのスクロールを滑らかに */
    scrollbar-width: none;      /* Firefox用：スクロールバー非表示 */
}

/* Chrome, Safari用：スクロールバーを非表示にする */
.category-scroll-list::-webkit-scrollbar {
    display: none;
}

/* 各アイテム（li）のスタイル */
.category-scroll-item {
    text-align: center;
}

.category-scroll-item a {
    display: flex;
    flex-direction: column;
    align-items: center;
    text-decoration: none;
    color: #333;
}

/* アイコン画像を囲む枠 */
.category-icon-wrapper {
    width: 55px;
    height: 55px;
    margin-bottom: 6px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.category-icon-wrapper img {
    width: 100%;
    height: 100%;
    object-fit: contain; /* イラストが潰れないように収める */
}

/* カテゴリ名（テキスト） */
.category-icon-name {
    font-size: 0.7rem;
    line-height: 1.2;
    white-space: normal;
    text-overflow: clip;
    overflow: visible;
    width: 100%;
}

.category-scroll-list.is-single {
    grid-template-rows: auto; /* 1段 */
    gap: 15px;                /* アイテム間の左右の隙間 */
    justify-content: start;   /* 常に左詰めで配置 */
}

/* 【パターンB】カテゴリが9個以上の場合（2段横スクロール・左詰め） */
.category-scroll-list.is-double {
    grid-template-rows: auto auto; /* 縦に2段 */
    gap: 10px 15px;                /* 上下の隙間10px、左右の隙間15px */
    justify-content: start;        /* 常に左詰めで配置 */
}


/* 新着ブロック */
/* .ec-newsRole {
    padding: 40px 0 30px 0;
    position: relative;
    left: 50%;
    right: 50%;
    margin-left: -50vw;
    margin-right: -50vw;
    width: 100vw;
    overflow: hidden;
    background: url(../img/top/info_bk.jpg);
    background-attachment: unset;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center top;
    min-height: 500px;
    padding: 16px;
} */

/* フッター */
#page_homepage .ec-footerRole {
  margin-top: 0;
}
.ec-footerRole {
  border-top: none;
  background: #ebebeb;
  /* margin-top: 0; */
}

#page_product_list .ec-footerRole {
  margin-top: 0;
}

#page_product_detail .ec-footerRole {
  margin-top: 0;
}

.ec-footerNavi {
  padding: 50px 10px 10px 10px;
}

.ec-footerNavi .ec-footerNavi__link a {
  font-size: 12px;
  color: #888;
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  border-bottom: 1px solid #e3e3e3;
  width: 100%;
  padding: 10px 8px;
}

.ec-footerNavi .ec-footerNavi__link:first-of-type {
  border-top: 1px solid #e3e3e3;
}

.ec-footerTitle {
  color: #888;
}

.ec-footerTitle .ec-footerTitle__logo a {
  font-size: 10px;
}

/* 商品一覧 */
.deliver_info {
  display: flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: 100%;
  margin: 0;
  padding: 0;
  background-color: #399837;
  background-image: linear-gradient(90deg, #399837 0%, #8bc34a 50%, #d4e157 100%);
  letter-spacing: 0.08em;
}

.deliver_info > h5 {
  color: #fff;
  font-weight: bold;
  display: flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: fit-content;
  padding: 8px 0;
  margin: 0;
  position: relative;
}

.deliver_info > h5::before {
  content: "box";
  font-family: 'Material Symbols Outlined';
  font-weight: normal;
  font-style: normal;
  font-size: 1.4rem;
  line-height: 1.5rem;
  text-transform: none;
  white-space: nowrap;
  direction: ltr;
  -webkit-font-feature-settings: 'liga';
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: fit-content;
  padding: 0;
  margin: 0 0.5rem 0 0;
  position: relative;
  animation: move-truck 2s linear infinite;
}

@keyframes move-truck {
  0% {
    transform: translateX(-20px); /* 元位置より左からスタート */
    opacity: 0;                   /* フェードインすると自然 */
  }
  30% {
    opacity: 1;
  }
  100% {
    transform: translateX(0);     /* 元の位置に到達 */
    opacity: 1;
  }
}

.ec-topicpath {
  border-top: 1px solid rgba(45,45,45,.05);
  border-bottom: 1px solid rgba(45,45,45,.05);
  background: #efefef;
  padding: 15px 20px;
  margin: 0;
}

.ec-topicpath__item {
  color: #4b93ff;
}

.ec-searchnavRole .ec-searchnavRole__infos {
  display: flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
  padding: 16px 20px;
  flex-direction: unset;
  border-bottom: 1px solid rgba(45,45,45,.05);
  background: #71c7d5;
  margin-bottom: 0;
}

.ec-searchnavRole .ec-searchnavRole__counter {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  align-items: center;
  width: calc(100% / 3);
  margin-bottom: 0;
  padding: 8px 8px 8px 0;
  color: #fff;
}

.ec-searchnavRole .ec-searchnavRole__counter > span:last-of-type {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: fit-content;
  height: 100%;
  align-items: center;
  font-size: 12px;
  transform: scale(.9);
  transform-origin: right bottom;
  margin-left: 0.1rem;
}

.ec-searchnavRole .ec-searchnavRole__actions {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: calc((100% / 3) * 2);
}

.ec-searchnavRole .ec-searchnavRole__actions > .ec-select {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
  margin-bottom: 0;
  padding: 8px 0 8px 0;
}

.ec-searchnavRole .ec-searchnavRole__actions > .ec-select > .order-by {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: fit-content;
  margin-bottom: 0;
  border: none;
}

.ec-searchnavRole .ec-searchnavRole__actions > .ec-select > .disp-number {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: fit-content;
  margin-left: auto;
  margin-bottom: 0;
  border: none;
}

body#page_product_list .ec-layoutRole {
    background: #fff;
}

/* ==========================================================================
   全体枠：flex から grid に変更し、行（縦の棚）の同期の起点にします
   ========================================================================== */
ul#product_lists_wrap {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 16px;
  grid-auto-rows: auto;
  
  width: 100%;
  overflow: hidden;
  padding: 0 20px;
  margin: 20px 0 0 0;
  list-style: none;
}

/* ==========================================================================
   各商品カード（li ＞ a ＞ ul まで親のグリッド行を貫通させます）
   JavaScriptでカウントダウン(.countdown)が挿入され、全9行になるため span 9 に拡張
   ========================================================================== */
ul#product_lists_wrap > li {
  display: grid;
  grid-row: span 9; 
  grid-template-rows: subgrid;
  list-style: none;
  position: relative;
  width: 100%;
}

ul#product_lists_wrap > li > a {
  display: grid;
  grid-row: span 9;
  grid-template-rows: subgrid;
  width: 100%;
}

ul#product_lists_wrap > li > a > ul {
  /* display: grid;
  grid-row: span 9;
  grid-template-rows: subgrid;
  width: 100%;
  padding: 0;
  position: relative;
  list-style: none; */
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  list-style: none;
  padding: 0;
  flex-direction: column;
  position: relative;
}

/* 各パーツ共通のli要素、および動的挿入されるカウントダウンへの基本指定 */
ul#product_lists_wrap > li > a > ul > li {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  list-style: none;
}

/* ==========================================================================
   🎯 実際のHTML＋JavaScript動的挿入に基づいた正確な割り当て（全9行）
   ========================================================================== */

/* 1行目: 商品画像 ＋ 各種オーバーレイ */
ul#product_lists_wrap > li > a > ul > li:first-of-type {
  grid-row: 1;
  padding-right: 0;
  padding-left: 0;
  position: relative;
  overflow: hidden;
  border-radius: 0.25rem;
  display: flex;
  flex-direction: column; 
}

ul#product_lists_wrap > li > a > ul > li:first-of-type > img {
  width: 100%;
  object-fit: cover;
  object-position: center;
  aspect-ratio: 1 / 1;
}

/* 2行目: 商品タイトル(h3) */
ul#product_lists_wrap > li > a > ul > li:nth-of-type(2) {
  grid-row: 2;
  padding-top: 5px;
  margin-bottom: 5px;
}

ul#product_lists_wrap > li > a > ul > li:nth-of-type(2) > h3 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
  overflow-wrap: normal;
  font-size: 13px;
  font-weight: normal;
  line-height: 1.5;
  color: #19191a;
  margin: 0;
}

/* 3行目: ブルーの説明文(description_list) */
ul#product_lists_wrap > li > a > ul > li.description_list {
  grid-row: 3;
  overflow: hidden;
  margin-bottom: auto;
}

ul#product_lists_wrap > li > a > ul > li.description_list > h4 {
  font-size: 12px;
  font-weight: normal;
  line-height: 1.5;
  color: #3360FF;
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  padding: 8px;
  margin: 0 0 5px 0;
  background: #3360FF12;
  border-radius: 0.25rem;
}

/* 4行目: レビューの星（★）エリア */
ul#product_lists_wrap > li > a > ul > li.product_review_area_wrap {
  grid-row: 4;
  overflow: hidden;
  margin-bottom: 0px;
}

/* 5行目: タグエリア（限定品・新商品など） */
ul#product_lists_wrap > li > a > ul > li.product_tags {
  grid-row: 5;
  margin-bottom: 5px;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: max-content;
  overflow-x: auto;
  
  /* スマホ用の慣性スクロール（必須） */
  -webkit-overflow-scrolling: touch; 
  gap: 5px;
  width: 100%;
  list-style: none;

  /* 👇 追加：スクロールバーを非表示にする設定（Firefox / IE・Edge用） */
  scrollbar-width: none;          /* Firefox */
  -ms-overflow-style: none;       /* IE, Edge */
}

ul#product_lists_wrap > li > a > ul > li::-webkit-scrollbar {
    display: none;
}

/* ⏳ 6行目: JavaScriptにより動的挿入されるタイムセールカウントダウン */
ul#product_lists_wrap > li > a > ul > .countdown {
  grid-row: 6;
  width: fit-content !important; /* 横いっぱいに広がってデザインが崩れるのを防ぐ */
  margin: 0 0 5px 0!important;
}

/* 7行目: ◯◯円OFFなどの割引率(offprice) */
ul#product_lists_wrap > li > a > ul > li.offprice {
  grid-row: 7;
  display: inline-flex;
  flex-direction: row;
  align-items: flex-end;
  margin-bottom: 5px;
}

ul#product_lists_wrap > li > a > ul > li.offprice > span {
  color: rgba(255,255,255,0.8);
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
  overflow-wrap: normal;
  font-size: 12px;
  font-weight: 600;
  display: -webkit-box;
  width: fit-content;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  background-color: #ff1493;
  background-image: linear-gradient(90deg, #ff3300 0%, #ff1493 100%);
  padding: 2px 5px;
  border-radius: 0.25rem;
}

/* 8行目: 通常価格・販売価格(list_price) */
ul#product_lists_wrap > li > a > ul > li.list_price {
  grid-row: 8;
  flex-direction: row;
  align-items: flex-end;
  align-content: flex-end;
  margin-bottom: 0px;
}

ul#product_lists_wrap > li > a > ul > li.list_price > span {
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
  overflow-wrap: normal;
  font-size: 20px;
  color: #ed293e;
  font-weight: 600;
  line-height: 1.5;
  display: -webkit-box;
  width: 100%;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

ul#product_lists_wrap > li > a > ul > li.list_price > span > .yen {
  font-size: 12px;
  margin-right: 2px;
}

/* より詳細度を強めた記述 */
ul#product_lists_wrap > li > a > ul > li.list_price > span.price-display-wrap.normal-price {
    color: #19191a;
    font-size: 16px !important; /* 一旦 !important で効くかテストしてみてください */
    position: relative;
}

ul#product_lists_wrap > li > a > ul > li.list_price > span.rank_price:has(span) {
    display: flex;
    justify-content: center;
    align-items: center;
    width: 100%;
    padding: 4px;
    font-size: 1.1rem!important;
    background: #4a2c00;
    border-radius: 0.25rem;
    background-color: #4a2c00;
    background-image: linear-gradient(90deg, #11998e 0%, #38ef7d 100%);
    color: #fff!important;
    margin-top: 3px;
}

/* 9行目: ポイント(list_point) */
ul#product_lists_wrap > li > a > ul > li.list_point {
  grid-row: 9;
  flex-direction: row;
  align-items: flex-end;
  align-content: flex-end;
  margin-bottom: 15px;
}

ul#product_lists_wrap > li > a > ul > li.list_point span.product_sub_info_icon::before {
  color: #fff;
  content: 'P';
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: fit-content;
  position: relative;
  top: 0;
  left: 0;
  bottom: 0;
  padding: 0;
  transform: scale(0.8);
  transform-origin: center;
}

.sale-timer-container {
  margin-top: auto;
}

/* ==========================================================================
   その他（絶対配置の装飾パーツ：SOLD OUT）
   ========================================================================== */
ul#product_lists_wrap > li > a > ul > li:first-of-type > span.soldout-label {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: 80%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform-origin: center center;
  transform: translate(-50%, -50%) rotate(-7deg);
  filter: drop-shadow(0 6px 12px rgba(0,0,0,.45));
}

ul#product_lists_wrap > li > a > ul > li:first-of-type > span.soldout-label > p {
  color: #ff0050;
  font-weight: bold;
  font-size: 0.6rem;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: fit-content;
  background-color: rgba(255, 255, 255, 0.8);
  border: 2px solid transparent;
  border-image: linear-gradient(90deg, rgb(253, 71, 82) 0%, rgb(241, 115, 208) 100%);
  border-image-slice: 1;
  letter-spacing: 0.1rem;
  border-radius: 0.25rem;
  padding: 4px 8px;
}

li.list_point {
    font-size: 0.8rem;
    font-weight: bold;
    display: inline-flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: nowrap;
    width: 100%;
    position: relative;
}

.product_sub_info_point {
    display: flex;
    align-items: center;
}


li.list_point span.product_sub_info_icon {
    display: inline-flex;
    justify-content: center;
    flex-wrap: nowrap;
    align-items: center;
    width: 14px;
    height: 14px;
    background: #ff422e;
    border-radius: 100%;
    margin-right: 4px;
    position: relative;
}

li.list_point .point_display_area {
  color: #ff422e;
}


/* 1. 一覧用のレビューエリア全体の配置（現在の右寄せを維持） */
.product_review_area_list {
    display: inline-flex;
    align-items: center;
    justify-content: flex-end; /* 右寄せを維持 */
    width: 100%;
    margin-top: 0;
    font-size: 14px;
    margin-bottom: 5px;
}

/* 2. 💎 核心：5連の星全体を一本のグラデーションで染めて切り抜く設定 */
div.product_review_area_list .review_stars_gradient {
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    
    /* 左から指定%まではピンクグラデーション、そこから右は一瞬で未評価グレー(#e0e0e0)に断ち切る */
    background-image: linear-gradient(
        90deg, 
        #ff3300 0%, 
        #ff1493 var(--rating-progress), 
        #e0e0e0 var(--rating-progress), 
        #e0e0e0 100%
    );
    
    /* 背景色を文字（星アイコン）の形にくり抜く */
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* 3. 星アイコンのサイズ調整（グローバルの!importantを打ち消してサイズを矯正） */
div.product_review_area_list .review_stars_gradient > .material-symbols-outlined {
    font-size: 1.2rem !important;  /* 現在設定されているサイズ感を維持 */
    line-height: 0.8rem !important;
    width: 0.9rem;                 /* 星同士の詰まり具合をキープ */
    height: 1.0rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    
    /* くり抜きのベースとして、すべての星の内部をあらかじめ満たしておきます */
    font-variation-settings: 'FILL' 1; 
}

/* 4. 平均点数：プラグイン側のグラデーションスタイルを完全移植 */
.product_review_area_list .recommend_average {
    margin-left: 16px; /* プラグインと同じ16pxの間隔 */
    font-weight: bold;
    color: #DE5D50; /* グラデーション非対応ブラウザ用のフォールバック */
    
    /* プラグインのビビッドなグラデーション仕様 */
    background-color: #ff1493;
    background-image: linear-gradient(90deg, #ff3300 0%, #ff1493 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* 5. 件数の表示：点数の直後に馴染むように調整 */
.product_review_area_list .review_count {
    margin-left: 6px;
    color: #888888;
    font-size: 12px;
}

li.product_tags {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  margin: 0;
}

li.product_tags > span {
  font-size: 0.6rem;
  color: #4b93ff;
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: fit-content;
  height: fit-content;
  /* margin: 8px 8px 0 0; */
  padding: 4px;
  border: 1px solid #4b93ff;
  border-radius: 0.25rem;
}

li.product_tags > span:last-of-type {
  /* margin-bottom: 8px; */
}




ol.tagBar {
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
    list-style: none;
    padding: 0 4px;
    margin: 0 0 8px 0;
}

ol.tagBar > li {
    color: #000;
    font-size: 0.6rem;
    font-weight: bold;
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    width: fit-content;
    padding: 4px;
    border-radius: 0.2rem;
    margin-right: 4px;
    background: #fff;
}

ol.tagBar > li:last-of-type {
  margin-right: 0;
}

/*===========
inview
===========*/

.fadeIn_up {
  opacity: 0;
  transform: translate(0, 50%);
  transition: 2s;
}
.fadeIn_up.is-show {
  transform: translate(0, 0);
  opacity: 1;
}

button.openButton,
button.newProdOpenButton,
button.topProdOpenButton,
button.relationProdOpenButton,
button.checkedHistoryProdOpenButton,
button.trendProdOpenButton {
  display: flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: fit-content;
  background: unset;
  border: none;
  position: absolute;
  bottom: 15px;
  right: 10px;
  padding: 0;
}

button.openButton:after,
button.newProdOpenButton:after,
button.topProdOpenButton:after,
button.relationProdOpenButton:after,
button.checkedHistoryProdOpenButton:after,
button.trendProdOpenButton:after {
  content: 'comment'; /* 💡ここにアイコン名（小文字・スネークケース）を入れます */
  font-family: 'Material Symbols Outlined'; /* 💡Googleのフォントファミリー名に変更 */
  color: #d1d1d1;
  font-size: 14px;
  font-weight: normal; /* 💡Material Symbolsはnormalのほうが綺麗に出ます */
  
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: fit-content;
  position: relative;
  top: 0;
  left: 0;
  bottom: 0;
  filter: drop-shadow(rgba(0, 0, 0, 0.03) 0px 1px 1px);
  z-index: 1;
}

button.openButton.close:after,
button.newProdOpenButton.close:after,
button.topProdOpenButton.close:after,
button.relationProdOpenButton.close:after,
button.checkedHistoryProdOpenButton.close:after,
button.trendProdOpenButton.close:after {
  content: 'close'; /* 💡バツマークのアイコン名 */
  font-family: 'Material Symbols Outlined'; /* 💡Googleのフォントファミリー名に変更 */
  color: #d1d1d1;
  font-size: 14px;
  font-weight: normal;
  
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: fit-content;
  position: relative;
  top: 0;
  left: 0;
  bottom: 0;
  filter: drop-shadow(rgba(0, 0, 0, 0.03) 0px 1px 1px);
  z-index: 1;
}

.ec-pagerRole {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: 100%;
  position: relative;
}

#ec-pagerRole_inner {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: 100%;
  border-top: 1px solid rgba(45,45,45,.05);
  border-bottom: 1px solid rgba(45,45,45,.05);
  position: relative;
}

ul.ec-pager {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: fit-content;
}

ul.pages_previous_wrap {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  align-items: center;
  width: fit-content;
  position: absolute;
  top: 0;
  left: 0;
  bottom: 0;
  padding: 0;
  margin: 0;
}

ul.pages_previous_wrap > li {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: fit-content;
  align-items: center;
  list-style: none;
  margin-left: 20px;
}

ul.pages_previous_wrap > li > a {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: fit-content;
  align-items: center;
  list-style: none;
}

ul.pages_previous_wrap > li > a > i {
  color: #4b93ff;
  transform: scale(1.5);
  transform-origin: left center;
  /* -webkit-font-smoothing: antialiased;
  -webkit-text-stroke-color: #fff;
  -webkit-text-stroke-width: 1px; */
}


ul.pages_next_wrap {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  align-items: center;
  width: fit-content;
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  bottom: 0;
  padding: 0;
  margin: 0;
}

ul.pages_next_wrap > li {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: fit-content;
  align-items: center;
  list-style: none;
  margin-right: 20px;
}

ul.pages_next_wrap > li > a {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: fit-content;
  align-items: center;
  list-style: none;
}

ul.pages_next_wrap > li > a > i {
  color: #71c7d5;
  transform: scale(1.5);
  transform-origin: right center;
  /* -webkit-font-smoothing: antialiased;
  -webkit-text-stroke-color: #fff;
  -webkit-text-stroke-width: 1px; */
}


.ec-pager .ec-pager__item > a {
  color: #71c7d5;
}

.ec-pager .ec-pager__item--active a {
  color: #a0a0a0;
}

.ec-pager .ec-pager__item, .ec-pager .ec-pager__item--active {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: fit-content;
  padding: 8px;
  margin: 0;
  line-height: unset;
}

.ec-pager .ec-pager__item a, .ec-pager .ec-pager__item--active a {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: fit-content;
  padding: 0;
  margin: 0;
}

.ec-pager .ec-pager__item--active {
  background: unset;
}

.product_page .ec-layoutRole__mainBottom {
  width: 100%;
  /* background: #f8f8f8; */
  padding-top: 50px;
  padding-bottom: 50px;
}


/* 商品詳細 */
#page_product_detail .ec-layoutRole {
  background: #fff;
}

#page_product_detail .ec-layoutRole__mainBottom {
  /* background: #111; */
}

#page_product_detail .ec-layoutRole__contents {
  margin-top: 0;
}

.product_page_wrap {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
}

.product_page_inner {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
}

.product_page_cell {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  align-content: flex-start;
  width: 100%;
}

.donot {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  align-content: flex-start;
  width: 100%;
  margin: 48px auto 16px auto;
}

.donot > img {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  align-content: flex-start;
  width: 100%;
  object-fit: contain;
}


#saleShop_sp {
  font-size: 10px;
  display: flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
  padding: 10px 20px;
  position: relative;
}

#saleShop_sp > p {
  color: #a0a0a0;
  display: inline-flex;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: nowrap;
  width: 100%;
  position: relative;
}

#saleShop_sp > p:before {
  content: '\f54f';
  font-family: 'Font Awesome 5 Free';
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: fit-content;
  position: relative;
  top: 0;
  left: 0;
  margin-right: 4px;
}

#saleShop_pc {
  display: none;
}

.product_page_cell > .item_visual {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
  padding: 0;
  margin: 0;
  position: relative;
}

.product_page_cell .slick-list {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
  padding: 0;
  margin: 0;
  position: relative;
}

.product_page_cell .slick-list .slick-track {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
}

.product_page_cell .slick-initialized .slick-slide {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
  margin: 0;
  padding: 0;
}

.product_page_cell .slick-initialized .slick-slide > div {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
  margin: 0;
  padding: 0;
}

.slick-slide img {
  object-fit: cover;
  width: 100%;
}

button.slick-arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 40px;
  height: 40px;
  padding: 0;
  margin: 0;
  position: absolute;
  z-index: 9999;
}

button.slick-arrow.slick-prev.slick-disabled,
button.slick-arrow.slick-next.slick-disabled
{
  opacity: 0;
}

button.slick-arrow.slick-prev {
  left: 10px;
}

button.slick-arrow.slick-prev:before {
  color: #fff;
  font-size: 18px;
  content: '\f053';
  font-family: 'Font Awesome 5 Free';
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: 40px;
  height: 40px;
  position: relative;
  top: 0;
  bottom: 0;
  left: -1px;
  background-color: rgba(45,45,45,.15);
  cursor: pointer;
  border: 1px solid #fff;
  border-radius: 100%;
  outline: 0;
  -webkit-appearance: none;
  appearance: none;
}

button.slick-arrow.slick-next {
  color: #fff;
  right: 10px;
}

button.slick-arrow.slick-next:before {
  color: #fff;
  font-size: 18px;
  content: '\f054';
  font-family: 'Font Awesome 5 Free';
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: 40px;
  height: 40px;
  position: relative;
  top: 0;
  right: -1px;
  bottom: 0;
  background-color: rgba(45,45,45,.15);
  cursor: pointer;
  border: 1px solid #fff;
  border-radius: 100%;
  outline: 0;
  -webkit-appearance: none;
  appearance: none;
}

.slick-prev:hover, .slick-prev:focus, .slick-next:hover, .slick-next:focus {
  color: unset;
  background: unset;
}

.slick-num {
  font-size: 12px;
  color: #a0a0a0;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: 100%;
  line-height: 1.6;
  padding: 10px 15px;
  letter-spacing: 0.5rem;
}

/* .item_nav {
  display: none;
} */

.item_nav {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  padding: 0 0 10px 0;
  position: relative;
}

.item_nav > .slideThumb {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  margin: 0;
  padding: 10px 20px;
  aspect-ratio: 1/1;
}

.item_nav > .slideThumb:first-of-type {
  padding-top: 0;
}

.item_nav > .slideThumb:nth-of-type(2n) {
  margin-right: 0;
}

.item_nav > .slideThumb > img {
    object-fit: cover;
    width: 100%;
    height: 100%;
    aspect-ratio: 1 / 1;
}

.item_nav.is-closed {
    overflow: hidden;
}

/* 3枚目以降を隠すためのグラデーションマスク */
.item_nav.is-closed {
    overflow: hidden;
    /* ボタンを最下部に配置するため、下にボタンの高さ分の余白を確保 */
    padding-bottom: 70px; 
}

/* 3枚目以降を隠すためのグラデーションマスク */
.item_nav.is-closed .nav_mask {
    display: block;
    position: absolute;
    /* ボタンのすぐ上からグラデーションが始まるように配置 */
    bottom: 50px; 
    left: 0;
    width: 100%;
    height: 80px; /* グラデーションの高さ */
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0) 0%, rgba(255, 255, 255, 1) 100%);
    pointer-events: none;
    z-index: 2;
}

/* 開いた後はマスクを非表示にする */
.item_nav:not(.is-closed) .nav_mask {
    display: none;
}

/* 「さらに表示」ボタンのデザイン（位置を最下部に固定） */
.item_nav.is-closed .btn_show_more {
    position: absolute;
    bottom: 10px; /* 最下部からの浮き具合 */
    left: 20px;   /* 左右のpadding(20px)に合わせる */
    right: 20px;  /* 左右のpadding(20px)に合わせる */
    width: auto;  /* 左右固定なのでwidthはautoに */
    margin: 0;
    z-index: 3;
}

/* 開いた後は通常のブロック要素として一番下に配置 */
.item_nav:not(.is-closed) .btn_show_more {
    display: flex;
    width: calc(100% - 40px);
    margin: 15px auto 0;
}

/* ボタンの共通装飾 */
.btn_show_more {
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 12px;
    background-color: #fff;
    border: 1px solid #333;
    color: #333;
    font-size: 14px;
    cursor: pointer;
    border-radius: 4px;
    transition: background-color 0.2s;
}

.btn_show_more:hover {
    background-color: #f9f9f9;
}

/* 下向きの三角矢印（ ∨ ） */
.btn_show_more .arrow_down {
    display: inline-block;
    width: 8px;
    height: 8px;
    border-bottom: 1px solid #333;
    border-right: 1px solid #333;
    transform: rotate(45deg);
    margin-right: 8px;
    margin-top: -4px;
}



.productDetail_wrap {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
}

.productDetail_wrap > .productDetail_inner {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
}

.productDetail_inner > .ec-headingTitle {
  color: #19191a;
  font-size: 14px;
  font-weight: bold;
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  padding: 10px 20px;
  border-bottom: 1px solid rgba(45,45,45,.05);
  border-top: 1px solid rgba(45,45,45,.05);
  margin-bottom: 10px;
}

.ec-productRole .ec-productRole__btn > button {
  border-radius: 8px;
}

.ec-productRole__btn .ec-blockBtn--action {
  /* background: #ff2d75; */
  border: none;
  background-color: #ff1493;
  background-image: linear-gradient(90deg, #ff3300 0%, #ff1493 100%);
  position: relative;
}

.forms_wrap > form#form1 > .ec-productRole__btn {
  position: relative;
}

.ec-blockBtn--action:hover {
  opacity: 0.9;
  background: #ff2d75;
  border-color: #ff2d75;
}

.ec-blockBtn--cancel:hover {
  color: #ff2d75;
  background-color: unset;
  border-color: #ff2d75;
  opacity: 0.9;
}

.ec-productRole__btn .ec-blockBtn--action::before {
  content: '\f07a';
  font-family: 'Font Awesome 5 Free';
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: fit-content;
  position: relative;
  top: 0;
  left: 0;
  transform: scale(1.3);
  transform-origin: center center;
  margin-right: 0.5rem;
}

.ec-productRole__btn .ec-blockBtn--cancel {
  color: #4b93ff;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: 100%;
  background: unset;
  border-color: #4b93ff;
  position: relative;
}

.ec-productRole__btn .ec-blockBtn--cancel::before {
  content: '\f004';
  font-family: 'Font Awesome 5 Free';
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: fit-content;
  position: relative;
  top: 0;
  left: 0;
  transform: scale(1.3);
  transform-origin: center center;
  margin-right: 0.5rem;
}

ul#category_tag {
  color: rgba(75, 147, 255, 1);
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  margin: 0;
  padding: 10px 20px 5px 20px;
  border-top: 1px solid rgba(45,45,45,.05);
}

ul#category_tag > li {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: fit-content;
  position: relative;
  list-style: none;
  margin-right: 1.0rem;
  margin-bottom: 5px;
}

ul#category_tag > li > a {
    color: #4b93ff;
    font-weight: bold;
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    width: fit-content;
    position: relative;
    border: 1px solid rgba(75, 147, 255, 0.4);
    border-radius: 50px;
    padding: 0 10px;
}

ul#category_tag > li > a::before {
  content: '\f02b';
  font-family: 'Font Awesome 5 Free';
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: fit-content;
  margin-right: 0.25rem;
}

div.product_regularPrice {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  align-items: baseline;
  width: 100%;
  padding: 10px 20px 0 20px;
}

div.product_regularPrice > .product_regularPrice_inner {
  /* 既存のスタイル */
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  align-items: baseline;
  width: fit-content;
  background: #f00;
  padding: 8px;
  /* 吹き出し用に追加 */
  position: relative; /* 三角の位置決めの基準になります */
  border-radius: 0.25rem; /* 角を少し丸くすると吹き出しらしくなります（任意） */
  margin-bottom: 10px; /* 三角が下の要素に重ならないよう余白を確保 */
}

/* 吹き出しの三角部分 */
div.product_regularPrice > .product_regularPrice_inner::after {
  content: "";
  position: absolute;
  top: 100%;
  left: 15px;
  /* 変更：上下は10pxのまま、左右を細く（例: 5px）する */
  border-width: 10px 15px 0 0px; 
  border-style: solid;
  border-color: #f00 transparent transparent transparent;
}

div.product_regularPrice > .product_regularPrice_inner > span {
  color: #fff;
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  align-items: center;
  width: fit-content;
  /* text-decoration: line-through; */
  /* text-decoration-color: red; */
  /* text-decoration-style: solid; */
  /* text-decoration-thickness: 2px; */
}

div.product_regularPrice > .product_regularPrice_inner > span:last-of-type {
  font-size: 10px;
  margin-left: 0.25rem;
}

h3.product_price {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
  padding: 0px 20px 0 20px;
  margin: 0;
}

h3.product_price .ec-productRole__price {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: fit-content;
  margin: 0;
  padding: 0;
}

h3.product_price .ec-price {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  align-items: baseline;
  width: fit-content;
  margin: 0;
  padding: 0;
}

h3.product_price span.ec-price__price {
  font-size: 25px;
  color: #ed293e;
  padding: 0;
}

h3.product_price span.ec-price__price > .yen {
    font-size: 16px;
    margin-right: 2px;
}

h3.product_price span.ec-price__tax {
  font-size: 10px;
  color: #ed293e;
  font-weight: bold;
  margin-left: 0.25rem;
  padding: 0;
}

.saleLabel {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
  padding: 0px 20px 0 20px;
}

.saleLabel > p {
  color: #fff;
  font-size: 12px;
  font-weight: bold;
  display: inline-flex;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: nowrap;
  width: fit-content;
  padding: 2px 5px;
  background-color: #ff1493;
  background-image: linear-gradient(90deg, #ff3300 0%, #ff1493 100%);
  border-radius: 0.25rem;
  letter-spacing: 0.05rem;
  position: relative;
}

.saleLabel > p > span.material-symbols-outlined {
    font-size: 19px !important;
    line-height: unset;
    position: relative;
    top: 1px;
    margin-right: 2px;
}

.detail_wholesale {
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
    padding: 20px;
    margin: 0;
}

.detail_wholesale .rank_info {
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    width: 100%;
    padding: 0;
    margin: 0;
}

.ec-price.rank-price-block {
    font-size: 1.4rem;
    display: flex;
    justify-content: center;
    align-items: baseline;
    width: 100%;
    padding: 4px;
    border-radius: 0.25rem;
    background-color: #11998e;
    background-image: linear-gradient(90deg, #11998e 0%, #38ef7d 100%);
    color: #fff !important;
    margin-top: 8px;
}

.ec-price.rank-price-block .yen {
  font-size: 16px;
  margin-right: 2px;
}

.ec-price.rank-price-block .ec-price__price {
  font-size: 1.4rem;
}




ul.product_sub_info {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  margin: 20px 0 0 0;
  padding: 8px 20px;
  border-top: 1px solid rgba(45, 45, 45, .05);
  border-bottom: 1px solid rgba(45, 45, 45, .05);
}

ul.product_sub_info > li {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
  list-style: none;
  margin-top: 5px;
  color: #19191a;
}

ul.product_sub_info > li:first-of-type {
  margin-top: 0;
}

ul.product_sub_info > li > p {
  font-size: 0.8rem;
  font-weight: bold;
  display: inline-flex;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: nowrap;
  width: 100%;
  position: relative;
  margin: 0;
}

span.product_sub_info_icon {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: 18px;
  height: 18px;
  background: #a0a0a0;
  border-radius: 100%;
  margin-right: 5px;
  position: relative;
}

li.product_sub_info_point > p > span.product_sub_info_icon::before {
  color: #fff;
  content: 'P';
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: fit-content;
  position: relative;
  top: 0;
  left: 0;
  bottom: 0;
  padding: 0;
  transform: scale(0.8);
  transform-origin: center;
}

li.product_sub_info_shipping > p > span.product_sub_info_icon::before {
  color: #fff;
  content: '\f0d1';
  font-family: 'Font Awesome 5 Free';
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: fit-content;
  position: relative;
  top: 0;
  left: 0;
  bottom: 0;
  padding: 0;
  transform: scale(0.7);
  transform-origin: center;
}

ul.product_sub_info > li > p > span:nth-of-type(2) {
  color: #ed293e;
  margin-left: auto;
}

ul.product_sub_info > li > p > span:nth-of-type(2) > span {
 color: #19191a;
}

.forms_wrap {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  padding: 20px 20px 30px 20px;
}

.forms_wrap > form#form1 {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
}

.forms_wrap > form#form1 > .ec-productRole__actions {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  margin-bottom: 20px;
}

.forms_wrap > form#form1 > .ec-productRole__btn {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
}

.forms_wrap > form#favorite_form {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  margin-top: 10px;
}

.forms_wrap .ec-productRole__btn > button {
  border-radius: 0.25rem;
}

.forms_wrap .ec-productRole__btn {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
}

.forms_wrap > form#form1 > .ec-productRole__actions > .ec-numberInput {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
  align-items: center;
}

.forms_wrap > form#form1 > .ec-productRole__actions > .ec-numberInput > span {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  align-items: center;
  width: fit-content;
  margin-right: 5px;
}

.forms_wrap > form#form1 > .ec-productRole__actions > .ec-numberInput > input {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  align-items: center;
  width: fit-content;
  margin: 0;
}

.product_description {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  padding: 20px;
  width: 100%;
  border-top: 2px solid rgba(45, 45, 45, .05);
  color: #19191a;
}

.product_description > h4 {
  color: #19191a;
  font-size: 14px;
  font-weight: bold;
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  padding: 0;
  margin: 0 0 20px 0;
}


.product_page .ec-blockBtn--cancel:active, .product_page button.ec-blockBtn--cancel:focus {
  color: #ff7683;
  background-color: unset;
  border-color: #ff7683;
}

.product_page button.ec-blockBtn--cancel:focus {
  box-shadow: 0 0 0 0.25rem rgba(255,118,131,0.5);
}

ul.free_area_images_wrap {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  padding: 0;
  margin: 0;
}

ul.free_area_images_wrap > li {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  list-style: none;
  padding: 0;
  margin-bottom: 30px;
}

ul.free_area_images_wrap > li:last-of-type {
  margin-bottom: 0;
}

ul.free_area_images_wrap > li > img {
  width: 100%;
  object-fit: contain;
}

#product_review_area {
  width: 100%;
}

.cart_in_count {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: 100%;
  margin-bottom: 8px;
  padding: 4px;
  border: 1px solid transparent;
  border-image: linear-gradient(90deg, rgb(253, 71, 82) 0%, rgb(241, 115, 208) 100%);
  border-image-slice: 1;
  animation: slideInLeft 0.5s ease-out forwards;
}

@keyframes slideInLeft {
  0% {
    opacity: 0; /* 最初は透明 */
    transform: translateX(50px); /* 右に50pxズレた位置からスタート */
  }
  100% {
    opacity: 1; /* くっきり表示 */
    transform: translateX(0); /* 本来の位置に戻る */
  }
}

.cart_in_count > p {
  color: #19191a;
  font-size: 0.9rem;
  font-weight: bold;
  margin-bottom: 0;
}

.cart_in_count > p > i {
  color: #ff6a00;
  font-size: 1.0rem;
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: fit-content;
  margin-right: 0.5rem;
}

.cart_in_count > p > span {
  color: #ff6a00;
  font-size: 1.0rem;
  font-weight: bold;
}

.heart-beat-txt {
  color: #d40000;
  display: inline-block;
  animation: heartbeat 1.6s infinite;
  filter: drop-shadow(0 0 6px rgba(255,0,0,0.4));
  width: 100%;
  position: relative;
  left: 0;
  text-align: center;
}

@keyframes heartbeat {
  0% {
      transform: scale(1);
  }
  10% {
      transform: scale(1.15);
  }
  18% {
      transform: scale(0.95);
  }
  28% {
      transform: scale(1.1);
  }
  40% {
      transform: scale(1);
  }
  100% {
      transform: scale(1);
  }
}

.slide-item {
  position: relative;
}

/* .slide-item span.soldout-label {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: 80%;
  background: url('../img/top/soldout.webp') no-repeat center;
  background-size: contain;
  aspect-ratio: 1 / 0.275;
  position: absolute;
  top: 50%;
  left: 50%;
  transform-origin: center center;
  transform: translate(-50%, -50%) rotate(-7deg);
  filter: drop-shadow(1px 1px 1px ());
  filter: drop-shadow(0 6px 12px rgba(0,0,0,.45));
  background-color: rgba(255,255,255,.7);
} */

.slide-item span.soldout-label {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: 80%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform-origin: center center;
  transform: translate(-50%, -50%) rotate(-7deg);
  filter: drop-shadow(1px 1px 1px ());
  filter: drop-shadow(0 6px 12px rgba(0,0,0,.45));
}

.slide-item span.soldout-label  > p {
    color: #ff0050;
    font-weight: bold;
    font-size: 2.5rem;
    display: inline-flex;
    justify-content: center;
    align-items: center;
    flex-wrap: nowrap;
    width: fit-content;
    background-color: rgba(255,255,255,0.8);
    border: 4px solid transparent;
    border-image: linear-gradient(90deg, rgb(253, 71, 82) 0%, rgb(241, 115, 208) 100%);
    border-image-slice: 1;
    letter-spacing: 0.1rem;
    border-radius: 0.25rem;
    padding: 4px 16px;
}

#relation_wrap {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  overflow: hidden;
}

#relation_items {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 40%;
  column-gap: 8px;
  width: 100%;
  padding: 15px 20px;
  margin-top: 0;
  margin-bottom: 0;
  list-style: none;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: none;
  scrollbar-width: none;
  filter: drop-shadow(rgba(0, 0, 0, 0.03) 0px 3.5px 12px);
}

/* 制限がかかっている商品リスト全体のうっすら不透明度 */
#relation_items li.inview.is-restricted {
    opacity: 0.9;
}

/* 画像表示エリア（共通設定） */
#relation_items li style-image-wrap {
    position: relative;
    overflow: hidden;
}

#relation_items > li {
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
    list-style: none;
    position: relative;
}

#relation_items > li > a {
  display: flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
}

#relation_items > li > a > ul {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  list-style: none;
  padding: 0;
  flex-direction: column;
  position: relative;
}

#relation_items > li > a > ul > li {
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
    list-style: none;
}

ul#relation_items > li > a > ul > li.product_review_area_wrap {
	grid-row: 4;
	overflow: hidden;
	margin-bottom: 0px;
}

ul#relation_items > li > a > ul > li.product_tags {
	grid-row: 5;
	margin-bottom: 5px;
	display: grid;
	grid-auto-flow: column;
	grid-auto-columns: max-content;
	overflow-x: auto;
	gap: 5px;
	width: 100%;
	list-style: none;
	scrollbar-width: none;
}

#relation_items > li > a > ul > li:first-of-type {
    padding-right: 0;
    padding-left: 0;
    position: relative;
    overflow: hidden;
    border-radius: 0.25rem;
}

#relation_items > li > a > ul > li:first-of-type > img {
    width: 100%;
    object-fit: cover;
    object-position: center;
    aspect-ratio: 1 / 1;
}

#relation_items > li > a > ul > li:nth-of-type(2) {
    padding-top: 10px;
    margin-bottom: 5px;
}

#relation_items > li > a > ul > li:nth-of-type(2) > h3 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
  overflow-wrap: normal;
  font-size: 13px;
  font-weight: normal;
  line-height: 1.5;
  color: #19191a;
  margin: 0;
}

#relation_items > li > a > ul > li.description_list {
  grid-row: 3;
  overflow: hidden;
  margin-bottom: auto;
  height: 0;
}

#relation_items > li > a > ul > li.description_list > h4 {
  font-size: 12px;
  font-weight: normal;
  line-height: 1.5;
  color: #3360FF;
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  padding: 8px;
  margin: 0 0 5px 0;
  background: #3360FF12;
  border-radius: 0.25rem;
}

#relation_items > li > a > ul > li.offprice {
  grid-row: 7;
  display: inline-flex;
  flex-direction: row;
  align-items: flex-end;
  margin-top: 0;
  margin-bottom: 5px;
}

#relation_items > li > a > ul > li.offprice > span {
    color: rgba(255,255,255,0.8);
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-word;
    overflow-wrap: normal;
    font-size: 12px;
    font-weight: 600;
    display: -webkit-box;
    width: fit-content;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 1;
    background-color: #ff1493;
    background-image: linear-gradient(90deg, #ff3300 0%, #ff1493 100%);
    padding: 2px 5px;
    border-radius: 0.25rem;
}

#relation_items > li > a > ul > li.list_price {
  grid-row: 8;
  flex-direction: row;
  align-items: flex-end;
  align-content: flex-end;
  margin-bottom: 0px;
}

ul#relation_items > li > a > ul > li.list_price > span.price-display-wrap.normal-price {
	color: rgb(25, 25, 26);
	font-size: 16px !important;
	position: relative;
}

ul#relation_items > li > a > ul > li.list_price > span.rank_price:has(span) {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	padding: 4px;
	font-size: 1.1rem !important;
	background: linear-gradient(90deg, rgb(17, 153, 142) 0%, rgb(56, 239, 125) 100%) rgb(74, 44, 0);
	border-radius: 0.25rem;
	color: rgb(255, 255, 255) !important;
	margin-top: 3px;
}

#relation_items > li > a > ul > li.list_price > span {
    overflow: hidden;
    text-overflow: ellipsis;
    word-break: break-word;
    overflow-wrap: normal;
    /* font-size: 14px; */
    font-size: 20px;
    color: #ed293e;
    font-weight: 600;
    line-height: 1.5;
    display: -webkit-box;
    width: 100%;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

#relation_items > li > a > ul > li.list_price > span > .yen {
    font-size: 12px;
    margin-right: 2px;
}

#relation_items > li > a > ul > li.list_point {
  grid-row: 9;
  flex-direction: row;
  align-items: flex-end;
  align-content: flex-end;
  margin-bottom: 15px;
}

#relation_items > li > a > ul > li.list_point span.product_sub_info_icon::before {
    color: #fff;
    content: 'P';
    font-weight: bold;
    display: inline-flex;
    justify-content: center;
    flex-wrap: nowrap;
    align-items: center;
    width: fit-content;
    position: relative;
    top: 0;
    left: 0;
    bottom: 0;
    padding: 0;
    transform: scale(0.8);
    transform-origin: center;
}

/* 通常の商品画像 */
#relation_items .product-img {
    width: 100%;
    height: auto;
    display: block;
}

/* 制限時の画像：1(通常)＝薄く、2(Black)＝真っ黒 */
#relation_items .is-restricted .product-img.res-type-1 {
    opacity: 0.2;
}
#relation_items .is-restricted .product-img.res-type-2 {
    filter: brightness(0);
}

/* 制限時のオーバーレイ（鍵アイコンの中央配置コンテナ） */
#relation_items .restricted-overlay {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
    pointer-events: none;
}
#relation_items .restricted-overlay.res-bg-1 {
    background: rgba(0, 0, 0, 0.1);
}
#relation_items .restricted-overlay.res-bg-2 {
    background: transparent;
}

/* 鍵アイコン */
#relation_items .restricted-overlay i.fa-lock {
    font-size: 2.5rem;
    color: #ff0000;
    text-shadow: 0 0 10px rgba(255, 255, 255, 0.5);
}

/* バッジ：未開放 / ロック中 */
#relation_items .lock-badge-red {
    font-size: 0.9rem;
    font-weight: bold;
    background: #c00;
    color: #fff;
    padding: 3px 12px;
    margin-top: 10px;
    border-radius: 20px;
    box-shadow: 0 2px 4px rgba(0,0,0,0.3);
}
#relation_items .lock-badge-dark {
    font-size: 0.8rem;
    font-weight: bold;
    color: #fff;
    background: rgba(0,0,0,0.6);
    padding: 2px 10px;
    border-radius: 4px;
    margin-top: 10px;
    border: 1px solid rgba(255,255,255,0.3);
}

/* サブテキスト：ログイン必須 / ステータス不足 */
#relation_items .lock-subtext-shadow {
    font-size: 0.8rem;
    font-weight: bold;
    color: #fff;
    padding: 2px 10px;
    margin-top: 5px;
    text-shadow: 1px 1px 2px rgba(0,0,0,0.8);
}
#relation_items .lock-subtext-normal {
    font-size: 0.8rem;
    font-weight: bold;
    color: #fff;
    padding: 2px 10px;
    margin-top: 10px;
}

/* 価格表示：制限時のぼかし */
#relation_items .price-display-wrap.is-blur {
    filter: blur(6px);
    user-select: none;
}





/* ==========================================================================
   関連商品PC表示用のレスポンシブ対応（画面幅 1025px 以上で4列風にスマート化）
   ========================================================================== */
@media screen and (min-width: 1025px) {
  ul#relation_items {
    grid-auto-columns: 18%; /* PC画面ではスクロール幅をスマートな18%に縮小 */
    column-gap: 12px;
  }
}


/* パック商品 */
div#pack_item_wrap {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  /* padding: 50px 0; */
}

ul#pack_item::-webkit-scrollbar {
  display:none;
}

ul#pack_item {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
  list-style: none;
  padding: 15px 20px;
  margin-top: 0;
  margin-bottom: 0;
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: none;
  scrollbar-width: none;
  filter: drop-shadow(rgba(0, 0, 0, 0.03) 0px 3.5px 12px);
}

ul#pack_item > li {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
  flex: 0 0 40%;
  margin: 0 8px 0 0;
  overflow: hidden;
  /* background: #fff; */
  position: relative;
  list-style: none;
}

ul#pack_item > li:first-of-type {
  /* border-top-left-radius: 10px;
  border-bottom-left-radius: 10px; */
}

ul#pack_item > li:last-of-type {
  /* border-top-right-radius: 10px;
  border-bottom-right-radius: 10px; */
  margin-right: 0;
}

ul#pack_item > li > a {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
}

ul#pack_item > li > a > ul {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  list-style: none;
  padding: 0;
  flex-direction: column;
}

ul#pack_item > li > a > ul > li {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  /* padding-right: 10px;
  padding-left: 10px; */
  overflow: hidden;
}

ul#pack_item > li > a > ul > li:first-of-type {
  padding-right: 0;
  padding-left: 0;
  position: relative;
}

ul#pack_item > li > a > ul > li > img {
  width: 100%;
  object-fit: cover;
  object-position: center;
  aspect-ratio: 1 / 1;
}

ul#pack_item > li > a > ul > li:first-of-type > span {
  color: rgba(255,255,255,0.8);
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
  overflow-wrap: normal;
  font-size: 12px;
  font-weight: 600;
  transform: scale(.8);
  transform-origin: left bottom;
  display: -webkit-box;
  width: fit-content;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  position: absolute;
  bottom: 0;
  left: 0;
  background: rgba(237,41,62,.9);
  padding: 2px 5px;
}

ul#pack_item > li > a > ul > li:nth-of-type(2) {
  padding-top: 10px;
}

ul#pack_item > li > a > ul > li:nth-of-type(2) > h3 {
  /* display: -webkit-box; */
  display: inline-block;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
  overflow-wrap: normal;
  white-space: nowrap;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;
  color: #fff;
  margin: 0;
}

ul#pack_item > li > a > ul > li:nth-of-type(3) {
  display: inline-flex;
  width: 100%;
  padding: 0;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin-bottom: 5px;
  background: rgba(255, 255, 255, 0.9);
  aspect-ratio: 1 / 1;
  overflow: hidden;
  opacity: 0;
  transition: all .5s ease;
}

ul#pack_item > li > a > ul > li:nth-of-type(3).is-open {
  opacity: 1;
}

ul#pack_item > li > a > ul > li:nth-of-type(3) > h4 {
  font-size: 10px;
  font-weight: normal;
  line-height: 1.5;
  color: #2d2d2d;
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  margin-bottom: 0;
  overflow-y: scroll;
  padding: 10px;
  aspect-ratio: 1 / 1;
  z-index: 1;
  box-sizing: border-box;
}

ul#pack_item > li > a > ul > li:last-of-type {
  flex-direction: row;
  flex-grow: 1;
  align-items: flex-end;
  align-content: flex-end;
  margin-bottom: 15px;
}

ul#pack_item > li > a > ul > li:last-of-type > span {
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
  overflow-wrap: normal;
  font-size: 14px;
  color: #ed293e;
  font-weight: 600;
  line-height: 1.5;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  margin-top: 5px;
}


/* チェックした商品 */
#page_product_detail #history_child {
  margin-top: 20px;
}

#history {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  padding-bottom: 0px;
}

#page_product_list #history {
  margin-bottom: 35px;
}

#page_product_list .ec-layoutRole__contents {
  margin-top: 0;
}


.top_block_title > span > button {
  font-size: 10px;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: fit-content;
  background: rgba(45,45,45,.07);
  /* background: #fff; */
  border: none;
  border-radius: 0.25rem;
  padding: 4px 10px;
}

#history_child {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
}

#page_homepage #history_items {
  margin-bottom: 35px;
}


ul#history_items::-webkit-scrollbar {
  display:none;
}

/* ==========================================================================
   閲覧履歴　全体枠：横スクロールを維持しつつ、Gridの起点にします
   ========================================================================== */
ul#history_items {
  display: grid;
  /* 横並びの一列にするため、行ではなく「自動拡張する列（カラム）」として定義 */
  grid-auto-flow: column;
  grid-auto-columns: 40%; /* スマホ表示時、1カードの横幅を40%に固定 */
  column-gap: 8px;
  
  width: 100%;
  padding: 15px 20px;
  margin-top: 0;
  margin-bottom: 0;
  list-style: none;
  
  overflow-x: auto;
  overflow-y: hidden;
  -webkit-overflow-scrolling: touch;
  -ms-overflow-style: none;
  scrollbar-width: none;
  filter: drop-shadow(rgba(0, 0, 0, 0.03) 0px 3.5px 12px);
}

/* ==========================================================================
   各商品カード（li ＞ a ＞ ul まで親のグリッド行を貫通させます）
   JavaScriptでカウントダウン(.countdown)が挿入されるため span 9 に設定
   ========================================================================== */
ul#history_items > li {
  display: grid;
  grid-row: span 9; 
  grid-template-rows: subgrid;
  list-style: none;
  position: relative;
  width: 100%;
}

ul#history_items > li > a {
  display: grid;
  grid-row: span 9;
  grid-template-rows: subgrid;
  width: 100%;
}

ul#history_items > li > a > ul {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  list-style: none;
  padding: 0;
  flex-direction: column;
  position: relative;
}

/* 各パーツ共通のli要素、および動的挿入されるカウントダウンへの基本指定 */
ul#history_items > li > a > ul > li {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  list-style: none;
}

.sale-timer.countdown {
  margin: 0 0 5px 0!important;
}

.sale-timer-container {
	grid-row: 6;
	width: fit-content !important;
	margin: 0px!important;
}

/* ⏳ JavaScriptにより動的挿入されるタイムセールカウントダウンの共通設定 */
ul#history_items > li > a > ul > .countdown {
  grid-row: 6;
  width: fit-content !important;
  margin: 6px 0 !important;
  display: inline-flex !important;
  flex-direction: row !important;
  flex-wrap: nowrap !important;
  align-items: center !important;
  justify-content: center !important;
}

/* ==========================================================================
   🎯 実際のHTML＋JavaScript動的挿入に基づいた正確な割り当て（全9行）
   ========================================================================== */

/* 1行目: 商品画像 ＋ 各種オーバーレイ */
ul#history_items > li > a > ul > li:first-of-type {
  grid-row: 1;
  padding-right: 0;
  padding-left: 0;
  position: relative;
  overflow: hidden;
  border-radius: 0.25rem;
  display: flex;
  flex-direction: column;
}

ul#history_items > li > a > ul > li > img {
  width: 100%;
  object-fit: cover;
  object-position: center;
  aspect-ratio: 1 / 1;
  border-radius: 0.25rem;
}

/* 2行目: 商品タイトル(h3) */
ul#history_items > li > a > ul > li:nth-of-type(2) {
  grid-row: 2;
  padding-top: 5px;
  margin-bottom: 5px;
}

ul#history_items > li > a > ul > li:nth-of-type(2) > h3 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
  overflow-wrap: normal;
  font-size: 13px;
  font-weight: normal;
  line-height: 1.5;
  color: #19191a;
  margin: 0;
}

/* 3行目: ブルーの説明文(description_list / nth-of-type(3)) */
ul#history_items > li > a > ul > li:nth-of-type(3) {
  grid-row: 3;
  width: 100%;
  padding: 0px;
  overflow: hidden;
  display: inline-flex;
}

ul#history_items > li > a > ul > li:nth-of-type(3) > h4 {
  font-size: 12px;
  font-weight: normal;
  line-height: 1.5;
  color: #3360FF;
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  padding: 8px;
  margin: 0 0 5px 0;
  background: #3360FF12;
  border-radius: 0.25rem;
}

/* 4行目: レビューの星（★）エリア */
ul#history_items > li > a > ul > li.product_review_area_wrap {
  grid-row: 4;
  /* margin-bottom: 5px; */
}

/* 5行目: タグエリア（限定品・新商品など） */
ul#history_items > li > a > ul > li.product_tags {
  grid-row: 5;
  margin-bottom: 5px;
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: max-content;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
  gap: 5px;
  width: 100%;
  list-style: none;
  scrollbar-width: none;
  -ms-overflow-style: none;
}

/* ⏳ 6行目: カウントダウンの表示席 */
ul#history_items > li > a > ul > .countdown {
  grid-row: 6;
}

ul#history_items > li > a > ul > li.description_list {
  margin-bottom: auto;
}

/* 7行目: ◯◯円OFFなどの割引率(offprice) */
ul#history_items > li > a > ul > li.offprice {
  grid-row: 7;
  display: inline-flex;
  flex-direction: row;
  align-items: flex-end;
  margin-bottom: 5px;
}

ul#history_items > li > a > ul > li.offprice > span {
  color: rgba(255,255,255,0.8);
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
  overflow-wrap: normal;
  font-size: 12px;
  font-weight: 600;
  display: -webkit-box;
  width: fit-content;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  background-color: #ff1493;
  background-image: linear-gradient(90deg, #ff3300 0%, #ff1493 100%);
  padding: 2px 5px;
  border-radius: 0.25rem;
}

/* 8行目: 通常価格・販売価格(list_price) */
ul#history_items > li > a > ul > li.list_price {
  grid-row: 8;
  flex-direction: row;
  align-items: flex-end;
  align-content: flex-end;
  margin-bottom: 0px;
}

ul#history_items > li > a > ul > li.list_price > span {
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
  overflow-wrap: normal;
  font-size: 20px;
  color: #ed293e;
  font-weight: 600;
  line-height: 1.5;
  display: -webkit-box;
  width: 100%;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

/* より詳細度を強めた記述 */
ul#history_items > li > a > ul > li.list_price > span.price-display-wrap.normal-price {
    color: #19191a;
    font-size: 16px !important; /* 一旦 !important で効くかテストしてみてください */
    position: relative;
}


ul#history_items > li > a > ul > li.list_price > span > .yen {
  font-size: 12px;
  margin-right: 2px;
}

ul#history_items > li > a > ul > li.list_price > span.rank_price:has(span) {
	display: flex;
	justify-content: center;
	align-items: center;
	width: 100%;
	padding: 4px;
	font-size: 1.1rem !important;
	background: #4a2c00;
	border-radius: 0.25rem;
	background-color: #4a2c00;
	background-image: linear-gradient(90deg, #11998e 0%, #38ef7d 100%);
	color: #fff !important;
	margin-top: 3px;
}

/* 9行目: ポイント(list_point) */
ul#history_items > li > a > ul > li.list_point {
  grid-row: 9;
  flex-direction: row;
  align-items: flex-end;
  align-content: flex-end;
  margin-bottom: 15px;
}

ul#history_items > li > a > ul > li.list_point span.product_sub_info_icon {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: 14px;
  height: 14px;
  background: #ff422e;
  border-radius: 100%;
  margin-right: 4px;
  position: relative;
}

ul#history_items > li > a > ul > li.list_point span.product_sub_info_icon::before {
  color: #fff;
  content: 'P';
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: fit-content;
  position: relative;
  top: 0;
  left: 0;
  bottom: 0;
  padding: 0;
  transform: scale(0.8);
  transform-origin: center;
}

/* ==========================================================================
   その他（装飾パーツ・バッジ関連）
   ========================================================================== */
ul#history_items > li > a > ul > li:first-of-type > span.soldout-label {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: 80%;
  position: absolute;
  top: 50%;
  left: 50%;
  transform-origin: center center;
  transform: translate(-50%, -50%) rotate(-7deg);
  filter: drop-shadow(0 6px 12px rgba(0, 0, 0, .45));
}

ul#history_items > li > a > ul > li:first-of-type > span.soldout-label > p {
  color: #ff0050;
  font-weight: bold;
  font-size: 0.6rem;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: fit-content;
  background-color: rgba(255, 255, 255, 0.8);
  border: 2px solid transparent;
  border-gradient: linear-gradient(90deg, rgb(253, 71, 82) 0%, rgb(241, 115, 208) 100%);
  border-image: linear-gradient(90deg, rgb(253, 71, 82) 0%, rgb(241, 115, 208) 100%);
  border-image-slice: 1;
  letter-spacing: 0.1rem;
  border-radius: 0.25rem;
  padding: 4px 8px;
}

#history_items > li > a > ul > li.product_review_area_wrap > .product_review_area_list > span.review_count_num {
  margin-left: 6px;
  color: #888888;
  font-size: 12px;
}

#history_items > li a > ul > li.product_tags > span {
  font-size: 0.6rem;
  color: #4b93ff;
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: fit-content;
  height: fit-content;
  /* margin: 8px 8px 0 0; */
  padding: 4px;
  border: 1px solid #4b93ff;
  border-radius: 0.25rem;
}

#history_items > li a > ul > li.product_tags > span:last-of-type {
  /* margin-bottom: 8px; */
}

/* フッター */
.ec-blockTopBtn {
  display: inline-flex;
  width: fit-content;
  height: fit-content;
  background-color: unset;
  right: 20px;
  bottom: 20px;
}

.ec-blockTopBtn > i {
  color: #9da3a9;
  font-size: 40px;
}

/* ローディング画像 */
.loading_wrap {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: 100%;
  height: auto;
  min-height: 200px;
}

.loading_wrap > img {
  object-fit: contain;
  object-position: center center;
  height: 30px;
}

/* トレンドブロック */
div#trend_wrap {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
}

ul#trend_item {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  overflow: hidden;
  padding: 0;
  margin: 0;
}

ul#trend_item > li {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: calc(100% /3);
  list-style: none;
  padding: 0;
  position: relative;
}

ul#trend_item > li > a {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
}

ul#trend_item > li > a > ul {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  padding: 0;
  flex-direction: column;
  position: relative;
}

ul#trend_item > li > a > ul > li {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  list-style: none;
  padding-right: 10px;
  padding-left: 10px;
}

ul#trend_item > li > a > ul > li:first-of-type {
  padding-right: 0;
  padding-left: 0;
  position: relative;
}

ul#trend_item > li > a > ul > li:first-of-type > img {
  width: 100%;
  object-fit: cover;
  object-position: center;
  aspect-ratio: 1 / 1;
}

ul#trend_item > li > a > ul > li:first-of-type > span {
  color: rgba(255,255,255,0.8);
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
  overflow-wrap: normal;
  font-size: 12px;
  font-weight: 600;
  transform: scale(.8);
  transform-origin: left bottom;
  display: -webkit-box;
  width: fit-content;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  position: absolute;
  bottom: 0;
  left: 0;
  background: rgba(237,41,62,.9);
  padding: 2px 5px;
}


ul#trend_item > li > a > ul > li:nth-of-type(2) {
  padding-top: 10px;
  margin-bottom: 5px;
}

ul#trend_item > li > a > ul > li:nth-of-type(2) > h3 {
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
  overflow-wrap: normal;
  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;
  color: #2d2d2d;
  margin: 0;
}

ul#trend_item > li > a > ul > li:nth-of-type(3) {
  display: inline-flex;
  width: 100%;
  padding: 0px;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  margin-bottom: 0;
  background: rgba(255, 255, 255, 0.9);
  overflow: hidden;
  box-sizing: border-box;
  z-index: 1;
  opacity: 0;
  transition: all .5s ease;
}

ul#trend_item > li > a > ul > li:nth-of-type(3).is-open {
  opacity: 1;
}

ul#trend_item > li > a > ul > li:nth-of-type(3) > h4 {
  font-size: 10px;
  font-weight: normal;
  line-height: 1.5;
  color: #2d2d2d;
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  margin-bottom: 0;
  overflow-y: scroll;
  padding: 10px;
  aspect-ratio: 1 / 1;
  z-index: 1;
  box-sizing: border-box;
}

ul#trend_item > li > a > ul > li:last-of-type {
  flex-direction: row;
  flex-grow: 1;
  align-items: flex-end;
  align-content: flex-end;
  margin-bottom: 15px;
}

ul#trend_item > li > a > ul > li:last-of-type > span {
  overflow: hidden;
  text-overflow: ellipsis;
  word-break: break-word;
  overflow-wrap: normal;
  font-size: 14px;
  color: #ed293e;
  font-weight: 600;
  line-height: 1.5;
  display: -webkit-box;
  width: 100%;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

ul#trend_item > li:before {
  content: 'AD';
  font-weight: bold;
  font-size: 10px;
  color: #fff;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  padding: 0 5px;
  height: 20px;
  background-color: rgba(45,45,45,.2);
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  transform: scale(.6);
  transform-origin: left top;
}

/* カート */
.ec-cartNavi .ec-cartNavi__badge{
  font-family: 'auto';
  background-color: #ff0033;
  background-image: linear-gradient(90deg, rgb(253, 71, 82) 0%, rgb(241, 115, 208) 100%);
}

.ec-cartNaviIsset.is-active {
  top: 5.0rem;
  z-index: 99999;
}

.ec-progress .ec-progress__item:after {
  top: 1.0em;
}

.ec-role2 {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: 100%;
  padding: 40px 20px;
}

#page_cart .ec-role {
  display: inline-flex;
  justify-content: flex-start;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  width: 100%;
  padding: 0;
}

#page_cart .ec-pageHeader {
  display: inline-flex;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: nowrap;
  width: 100%;
  padding: 0 20px;
}

#page_cart .ec-pageHeader h1, .ec-pageHeader .h1 {
  display: inline-flex;
  justify-content: flex-start;
  align-items: center;
  flex-wrap: nowrap;
  width: 100%;
  padding: 10px 0;
  margin: 0 0 15px 0;
  border-top: 0;
  border-bottom: 1px solid #f3f3f3;
}

#page_cart .ec-cartRole #form_cart {
  padding-right: 0;
  padding-left: 0;
}

.material-symbols-outlined {
    font-size: 1.8rem !important;
    /* line-height: 1.8rem; */
}

.ec-cartTable {
  border-top: 1px solid #f3f3f3;
}

.ec-cartRow .ec-cartRow__delColumn, .ec-cartRow .ec-cartRow__contentColumn, .ec-cartRow .ec-cartRow__amountColumn, .ec-cartRow .ec-cartRow__subtotalColumn {
  border-bottom: 1px solid #f3f3f3;
}

.ec-progress .ec-progress__label {
  font-size: 10px;
}

.ec-blockBtn--action {
  color: #fff;
  border: none;
  background-color: #ff1493;
  background-image: linear-gradient(90deg, #ff3300 0%, #ff1493 100%);
  border-radius: 0.25rem;
  /* animation: heartbeat2 1.2s ease-in-out infinite; */
  animation: btn_animation2 1.5s infinite;
}

@keyframes heartbeat2 {
  0% {
    transform: scale(1); /* 最初は通常のサイズ */
  }
  25% {
    transform: scale(1.04); /* 少し大きく膨らむ */
  }
  50% {
    transform: scale(1); /* 元に戻る */
  }
  75% {
    transform: scale(1.02); /* 少し小さく膨らむ */
  }
  100% {
    transform: scale(1); /* 最後は元に戻る */
  }
}

@keyframes btn_animation2 {
  0% {
    transform: scale(1.04)
  }
  5% {
    transform: scale(1)
  }
  95% {
    transform: scale(1)
  }
  100% {
    -webkit-transform: scale(1.04)
  }
}

.ec-blockBtn--cancel {
    color: #4b93ff;
    background-color: #fff;
    border-color: #4b93ff;
    border-radius: 0.25rem;
}

.ec-progress .is-complete .ec-progress__label {
  color: #ff2d75;
}

.ec-progress .is-complete .ec-progress__number {
  background: #ff2d75;
  color: #fff;
}

.ec-progress .ec-progress__number {
  background: #f7e4eb;
  color: #2d2d2d;
  border-radius: none;
}

.ec-progress .ec-progress__item:after {
  background: #f7e4eb;
}

.ec-cartRole .ec-cartRole__totalText {
  padding: 16px 0;
}

.ec-cartRole .ec-cartRole__totalAmount {
  color: #ff0033;
}


#page_cart  .ec-cartRole {
  font-size: 12px;
}

.ec-guest .ec-guest__actions a {
  color: #4b93ff;
}

.ec-totalBox .ec-totalBox__btn a {
  color: #4b93ff;
}

.cart_page .ec-blockBtn--cancel {
  color: #4b93ff;
  background-color: unset;
  border-color: #4b93ff;
  border-radius: 0;
}

/* .ec-blockBtn--action, .ec-productRole__btn .ec-blockBtn--cancel {
  border-radius: 0!important;
} */

.btn-check:focus + .ec-blockBtn--action, .ec-blockBtn--action:focus {
  background-color: #ff2d75;
  border-color: #ff2d75;
  box-shadow: 0 0 0 0.25rem rgb(35 171 221 / 50%);
}

.btn-check:checked + .ec-blockBtn--action, .btn-check:active + .ec-blockBtn--action, .ec-blockBtn--action:active, .ec-blockBtn--action.active, .show > .ec-blockBtn--action.dropdown-toggle {
  color: #fff;
  background-color: #ff2d75;
  border-color: #ff2d75;
}

.ec-totalBox .ec-totalBox__btn .ec-blockBtn--cancel {
  background-color: unset;
}

.btn-check:focus + .ec-inlineBtn--action, .ec-inlineBtn--action:focus {
  color: #fff;
  background-color: #ff2d75;
  border-color: #ff2d75;
  box-shadow: 0 0 0 0.25rem rgb(35 171 221 / 50%);
}

.ec-blockBtn--primary {
  background-color: #4b93ff;
  border-color: #4b93ff;
  border-radius: 8px;
}

a.ec-blockBtn--primary:active {
  color: #fff;
  background-color: #4b93ff;
  border-color: #4b93ff;
  opacity: 0.9;
}

.ec-blockBtn--primary:focus {
  color: #fff;
  background-color: #4b93ff;
  border-color: #4b93ff;
  opacity: 0.9;
}

.ec-blockBtn--primary:hover {
  color: #fff;
  background-color: #4b93ff;
  border-color: #4b93ff;
  opacity: 0.9;
}


/* お得額表示 */
.ec-cartRole__offtotal {
    width: 100%;
    margin: 15px 0;
    padding: 15px 10px;
    background: #fffcfc;
    border: 2px dashed #d9534f;
    border-radius: 12px;
    box-sizing: border-box;
}

.offtotal-content {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    gap: 4px;
}

.offtotal-label {
    color: #333;
    font-size: 0.85rem;
    font-weight: 500;
}

.offtotal-amount {
    display: flex;
    align-items: baseline;
    color: #d9534f;
    line-height: 1;
}

.offtotal-currency {
    font-size: 1.1rem; 
    font-weight: 700;
    margin-right: 2px;
}

.offtotal-number {
    font-size: 1.5rem;
    font-weight: 900;
    letter-spacing: -0.05em;
    font-family: 'Arial Black', sans-serif;
}

.ec-cartRole__actions {
    display: flex;
    flex-direction: column;
}



/*モーダルを開くボタン*/
.modal-open{
  position: fixed;
  display: flex;
  align-items: center;
  justify-content: center;
  top: 50%;
  left: 50%;
  width: 300px;
  height: 50px;
  font-weight: bold;
  color: #fff;
  background: #000;
  margin: auto;
  cursor: pointer;
  transform: translate(-50%,-50%);
}
/*モーダル本体の指定 + モーダル外側の背景の指定*/
.modal-container {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: center;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  text-align: center;
  background: rgba(0,0,0,50%);
  padding: 40px 20px;
  overflow: auto;
  opacity: 0;
  visibility: hidden;
  transition: .3s;
  box-sizing: border-box;
  z-index: 1000;
}
/*モーダル本体の擬似要素の指定*/
.modal-container:before{
  content: "";
  display: inline-block;
  vertical-align: middle;
  height: 100%;
}
/*モーダル本体に「active」クラス付与した時のスタイル*/
.modal-container.active{
  opacity: 1;
  visibility: visible;
}

/*モーダル枠の指定*/
.modal-body{
  position: relative;
  display: inline-block;
  vertical-align: middle;
  max-width: 500px;
  width: 90%;
}
/*モーダルを閉じるボタンの指定*/
.modal-close{
  position: absolute;
  display: flex;
  align-items: center;
  justify-content: center;
  top: -40px;
  right: 16px;
  width: fit-content;
  height: fit-content;
  font-size: 40px;
  color: #fff;
  cursor: pointer;
}
/*モーダル内のコンテンツの指定*/
.modal-content {
  /* background: #fff; */
  text-align: left;
  padding: 16px;
  border-radius: 8px;
  background-image: url(../img/common/campaign_bg.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  background-size: cover;
}

.modal-content_inner {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  padding: 15px;
  background: rgba(255, 255, 255, 0.9);
  border-radius: 6px;
}

.modal-content_inner > dl {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  padding: 0;
  margin: 0;
}

.modal-content_inner > dl > dt {
  color: #ed293e;
  display: inline-flex;
  justify-content: center;
  flex-wrap: wrap;
  width: 100%;
  padding: 15px 0;
  margin: 0;
  background: #f0f0f0;
  border-radius: 4px;
}

.modal-content_inner > dl > dd {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  padding: 0;
  margin: 30px 0 0 0;
}

.modal-content_inner > dl > dd > p {
  font-size: 14px;
  font-weight: bold;
  color: #ed293e;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: 100%;
}

.modal-content_inner > dl > dd > h3 {
  font-size: 25px;
  font-weight: bold;
  color: #ed293e;
  display: inline-flex;
  justify-content: center;
  flex-wrap: wrap;
  width: 100%;
  border: 3px solid #ed293e;
  margin: 32px 16px 32px 16px;
  padding: 16px;
  position: relative;
}

.modal-content_inner > dl > dd > h3:after {
  content: '\f06b';
  color: #fff;
  font-family: 'Font Awesome 5 Free';
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  width: 40px;
  height: 40px;
  position: absolute;
  top: -16px;
  left: -16px;
  border-radius: 50%;
  background: #ed293e;
  transform: rotate(-15deg);
}

.modal-content_inner > dl > dd > span {
  color: #ed293e;
  font-size: 12px;
  font-weight: bold;
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  padding: 0 16px;
  margin-bottom: 30px;
}

.modal-content_inner > dl > dd > a {
  color: #fff;
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  flex-wrap: wrap;
  width: 100%;
  background: #4b93ff;
  padding: 16px;
  border-radius: 4px;
}

.modal-content_inner > dl > dd > h3 > span:first-of-type {
  color: #fff;
  font-size: 12px;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: fit-content;
  padding: 4px 8px;
  margin-bottom: 8px;
  background: #66bc27;
  border-radius: 20px;
  position: absolute;
  top: -15px;
}

.modal-content_inner > dl > dd > h3 > span:first-of-type:after {
  border: 7px solid transparent;
  top: 100%;
  content: " ";
  height: 0;
  left: 50%;
  margin-left: -14px;
  position: absolute;
  width: 0;
  border-top-color: #66bc27;
}

.modal-content_inner > dl > dd > h3 > span:nth-of-type(2) {
  font-size: 11px;
  color: #fff;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: fit-content;
  padding: 4px 8px;
  position: absolute;
  bottom: -12px;
  border-radius: 12px;
  background: #ed293e;
}

span.ec-inlineBtn--cancel {
  color: #4b93ff;
  background-color: unset;
  border-color: #4b93ff;
  border-radius: 0.25rem;
}
 
.ec-inlineBtn--cancel:hover {
  color: #4b93ff;
  background-color: unset;
  border-color: #4b93ff;
  opacity: 0.9;
}

a.ec-inlineBtn--action {
    /* animation: heartbeat2 1.2s ease-in-out infinite; */
    position: relative;
    background-color: #ff1493;
    background-image: linear-gradient(90deg, #ff3300 0%, #ff1493 100%);
    border-radius: 0.25rem;
}

/* ==========================================================================
   詳細ページ用：無段階グラデーションレビュー星スタイル（Outlined版）
   ========================================================================== */

#product_review_area .ec-rectHeading > h4 {
  align-items: center;
}

/* 1. 詳細ページ用のレビューエリア全体の配置（見出しに合わせて左寄せ・幅自動） */
.detail_review_area_list {
    display: inline-flex;
    align-items: center;
    justify-content: flex-start; /* 詳細ページ用：左寄せ */
    width: auto;
    margin-left: 16px;           /* 「この商品のレビュー」テキストとの間隔 */
    font-size: 14px;
    vertical-align: middle;
}

/* 各個別レビュー（ループ内）の星エリア余白調整 */
.review_list .detail_review_area_list {
    margin-left: 16px;
}

/* 2. 💎 核心：5連の星全体を一本のグラデーションで染めて切り抜く設定 */
.detail_review_area_list .detail_review_stars_gradient {
    display: inline-flex;
    align-items: center;
    vertical-align: middle;
    font-family: 'Material Symbols Outlined', sans-serif; /* Outlinedに変更 */
    
    /* 左から指定%まではピンクグラデーション、そこから右は一瞬で未評価グレー(#e0e0e0)に断ち切る */
    background-image: linear-gradient(
        90deg, 
        #ff3300 0%, 
        #ff1493 var(--rating-progress), 
        #e0e0e0 var(--rating-progress), 
        #e0e0e0 100%
    );
    
    /* 背景色を文字（星アイコン）の形にくり抜く */
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
}

/* 3. 星アイコンのサイズ調整（一覧ページとサイズ感・重なり幅を完全同期） */
.detail_review_area_list .detail_review_stars_gradient > .material-symbols-outlined {
    font-size: 2.0rem !important;
    line-height: 0.8rem !important;
    width: 1.9rem;
    height: 2.0rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-variation-settings: 'FILL' 1;
}

/* ── B. 【追加】review_list内：個別レビュー用の星サイズ（ここでお好みの大きさに変更できます） ── */
.review_list .detail_review_area_list .detail_review_stars_gradient > .material-symbols-outlined {
    font-size: 1.0rem !important;
    line-height: 1.0rem !important;
    width: 0.9rem;
    height: 1.0rem;
    display: inline-flex;
    align-items: center;
    justify-content: center;
    font-variation-settings: 'FILL' 1;
}

/* 4. 平均点数および個別評価点数：プラグイン側のグラデーションスタイルを完全移植 */
.detail_review_area_list .detail_recommend_average,
.detail_review_area_list .detail_recommend_level {
    margin-left: 16px;  /* 星と数値の間の16px間隔 */
    font-weight: bold;
    color: #DE5D50;     /* グラデーション非対応ブラウザ用のフォールバック */
    
    /* プラグインのビビッドなグラデーション仕様 */
    background-color: #ff1493;
    background-image: linear-gradient(90deg, #ff3300 0%, #ff1493 100%);
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    display: inline-block;
}

/* 5. 件数の表示：点数の直後に馴染むように調整 */
.detail_review_area_list .detail_review_count {
    margin-left: 6px;
    color: #888888;
    font-size: 12px;
    font-weight: normal; /* h4の太字を解除 */
}

#product_review_area a.ec-inlineBtn--action.review_btn {
  background: #4b93ff;
  border: none;
  border-radius: 0.25rem;
  animation: none;
}

.ec-inlineBtn--action:hover {
  background: #ff2d75;
  border-color: #ff2d75;
  opacity: 0.9;
}

.ec-modal .ec-modal-wrap {
  border-radius: 4px;
}

/* ログインページ */
#page_mypage_login .ec-pageHeader > h1 {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: 100%;
  border: none;
}

#page_mypage_login .ec-login .ec-grid2__cell > .ec-login__link:first-of-type > a {
  color: #fff;
  font-size: 0.875rem;
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: 100%;
  background: #4b93ff;
  border-radius: 0.25rem;
  padding: 10px 16px;
  height: 56px;
  line-height: 56px;
  margin-top: 5px;
}

#page_mypage_login .ec-login .ec-grid2__cell > .ec-login__link:first-of-type > a:hover {
  opacity: 0.9;
}

button.ec-blockBtn--cancel:focus {
  color: #4b93ff;
  background-color: unset;
  border-color: #4b93ff;
}

.ec-blockBtn--cancel:active {
  color: #4b93ff;
  background-color: unset;
  border-color: #4b93ff;
}

.ec-link {
  color: #4b93ff;
}

/* マイページ */
.ec-pageHeader > h1 {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: 100%;
  border: none;
}

.btn-check:focus + .ec-blockBtn--cancel, .ec-blockBtn--cancel:focus {
  color: #4b93ff;
  background-color: unset;
  border-color: #4b93ff;
  box-shadow: 0 0 0 0.25rem rgb(35 171 221 / 50%);
}

.ec-navlistRole .active a {
  color: #ff0033;
}

.ec-welcomeMsg {
  border-bottom: 1px solid #f3f3f3;
}

.ec-imageGrid {
  border-top: 1px solid #f3f3f3;
}

.ec-orderMail {
  border-bottom: 1px solid #f3f3f3;
}

.ec-totalBox .ec-totalBox__total {
  border-top: 1px solid #fff;
}

.ec-totalBox .ec-totalBox__paymentTotal {
  border-top: 1px solid #fff;
}

/* 注文画面 */
.ec-orderRole .ec-borderedList {
  border-top: none;
}

.ec-borderedList li {
  border-bottom: 1px solid #f3f3f3;
}

.ec-selects {
  border-bottom: 1px solid #f3f3f3;
}

.ec-rectHeading h1, .ec-rectHeading .h1, .ec-rectHeading h2, .ec-rectHeading .h2, .ec-rectHeading h3, .ec-rectHeading .h3, .ec-rectHeading h4, .ec-rectHeading .h4, .ec-rectHeading h5, .ec-rectHeading .h5, .ec-rectHeading h6, .ec-rectHeading .h6 {
  border-radius: 4px;
}

.ec-totalBox {
  border-radius: 4px;
}

.ec-totalBox .ec-totalBox__pointBlock {
  border-radius: 4px;
}

.ec-reportHeading {
  border-top: 1px solid #f3f3f3;
}

.ec-historyRole .ec-historyRole__detail {
  border-top: 1px solid #f3f3f3;
}

.ec-borderedDefs {
  border-top: none;
}

.ec-borderedDefs dl {
  border-bottom: 1px solid #f3f3f3;
}

.ec-addressRole .ec-addressRole__actions {
  border-bottom: 1px solid #f3f3f3;
}

/* トップページスライダー */

.top_slider_wrap {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  padding: 35px 0;
  background: #fff;
  margin-bottom: 35px;
}

.main_visual_slider {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
}

.main_visual_slider .slick-dots li button:before {
  width: 8px;
  height: 8px;
}

.slide_bottom_btn {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: 100%;
  padding: 0 20px;
  margin-top: 35px;
}

.slide_bottom_btn > a {
  font-size: 12px;
  color: #fff;
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: 100%;
  max-width: 1110px;
  padding: 16px 0;
  border-radius: 4px;
  background: rgb(255,38,0);
  background: linear-gradient(90deg, rgba(255,38,0,1) 0%, rgba(255,115,0,1) 100%);
}

.slide_bottom_btn > a > span {
  font-size: 17px;
  text-shadow: 0px 0px 1px #fff;
}

/* スライダー */
.swiper {
  position: relative;
  width: 100%;
  overflow: hidden;
}

.swiper-wrapper {
  /* wrapperのサイズを調整 */
  width: 100%;
  height: auto;
}

.swiper-slide {
  /* スライドのサイズを調整、中身のテキスト配置調整、背景色 */
  color: #ffffff;
  width: 100%;
  height: auto;
  aspect-ratio: 1.618 / 1;
  text-align: center;
  text-align: center;
}

.swiper-slide img {
    display: inline-flex;
    justify-content: center;
    flex-wrap: nowrap;
    width: 100%;
}

/* .swiper-slide:nth-child(3n + 1) {
  background-color: #de4439;
}

.swiper-slide:nth-child(3n + 2) {
  background-color: #fcd500;
}

.swiper-slide:nth-child(3n + 3) {
  background-color: #53c638;
} */

.swiper-pagination-bullets {
  width: 100px;
}

.swiper-pagination-bullet {
  width: 12px !important;
  height: 12px !important;
  margin: 0 0 0 10px !important;
  background: #fff;
}

.swiper-pagination-bullet:first-child {
  margin: 0 !important;
}

/* トップページバナー */
.top_bnr {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  padding: 0 20px;
  margin: 0 0 35px 0;
}

.top_bnr > li {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
  list-style: none;
  filter: drop-shadow(rgba(0, 0, 0, 0.03) 0px 3.5px 12px);
  margin-bottom: 35px;
}

.top_bnr > li > a {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
}

.top_bnr > li > a > img {
  width: 100%;
  object-fit: contain;
  border-radius: 8px;
}

.top_bnr > li:last-of-type {
  margin-bottom: 0;
}


/* ミドルページバナー */
.middle_bnr {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  padding: 0 20px;
  margin: 0 0 35px 0;
  filter: drop-shadow(rgba(0, 0, 0, 0.03) 0px 3.5px 12px);
}

.middle_bnr > li {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
  list-style: none;
  filter: drop-shadow(rgba(0, 0, 0, 0.03) 0px 3.5px 12px);
  margin-bottom: 35px;
}

.middle_bnr > li > a {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
}

.middle_bnr > li > a > img {
  width: 100%;
  object-fit: contain;
  border-radius: 8px;
}

.middle_bnr > li:last-of-type {
  margin-bottom: 0;
}

/* 特定商 */
#page_help_tradelaw .ec-borderedDefs {
  /* display: inline-flex; */
  display: grid;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
}

.ec-off1Grid .ec-off1Grid__cell {
  width: 100%;
  margin-left: 0;
}

/* 年齢認証モーダル */
.modal-leave {
  position: fixed;
  display: none;
  z-index: 10000;
  justify-content: center;
  align-items: center;
  align-content: center;
  flex-wrap: wrap;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  width: 100%;
  height: 100%;
  margin: 0;
  /* padding: 20px; */
}

.modal-leave-inner {
  display: inline-flex;
  justify-content: center;
  flex-wrap: wrap;
  width: 80%;
  background: rgba(255, 255, 255, 0.9);
  padding: 20px;
  border-radius: 4px;
}

.modal-leave-inner p {
  font-size: 15px;
  color: #ff0033;
  display: inline-flex;
  justify-content: center;
  flex-wrap: wrap;
  width: 100%;
}

.modal-leave-inner p span {
  font-size: 16px;
  color: #2d2d2d;
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: 100%;
  margin-top: 30px;
  margin-bottom: 30px;
}

.modal-leave-inner a {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: calc(50% - 10px);
  cursor: pointer;
  margin-right: 20px;
  padding: 16px 8px;
  border-radius: 8px;
}

.modal-leave-inner a:first-of-type {
  font-weight: bold;
  color: #fff;
  background: #4b93ff;
}

.modal-leave-inner a:last-of-type {
  font-weight: bold;
  color: #fff;
  margin-right: 0;
  background: #3b3b3b;
}

.modal-leave-inner > img {
  width: 100%;
  object-fit: contain;
  object-position: center;
  margin-bottom: 30px;
}

/* 出品者登録について */
.page_center_ttl {
  font-size: 23px;
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: 100%;
  padding: 0;
  margin-top: 0;
  margin-bottom: 15px;
  line-height: unset;
}

.page_center_subttl {
  color: #4b93ff;
  font-size: 18px;
  font-weight: bold;
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  margin: 0 0 15px 0;
}

.manual_top_commission {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: 100%;
  background-image: url(../img/top/manual_top_commission.svg);
  background-repeat: no-repeat;
  background-size: contain;
  aspect-ratio: 1/0.429;
}

.page_text {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  margin: 0;
  padding: 15px;
}

.commission_dl {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
}

.commission_dl > dt {
  font-size: 20px;
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  padding: 4px 0;
  border-bottom: 4px solid #ff7683;
}

.commission_dl > dd {
  font-size: 18px;
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  margin: 15px 0 30px 0;
}

.commission_dl > dd > span {
  font-size: 14px;
}

.commission_dl.blue_dl > dt {
  border-bottom: 4px solid #4b93ff;
}

ul.stepList {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  margin: 0;
  padding: 0;
}

ul.stepList > li {
  display: inline-flex;
  justify-content: flex-start;
  align-content: flex-start;
  flex-wrap: wrap;
  width: calc((100% - 48px) / 3);
  margin: 0;
  list-style: none;
  margin: 0 22px 15px 0;
  padding: 0;
  background: #4b93ff;
  border-radius: 4px;
  position: relative;
}

ul.stepList > li::after {
  font-size: 22px;
  content: '\f0da';
  font-family: 'Font Awesome 5 Free';
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: fit-content;
  margin: 0;
  padding: 0;
  position: absolute;
  top: 0;
  bottom: 0;
  right: -16px;
}

ul.stepList > li:nth-of-type(3n) {
  margin-right: 0;
}

ul.stepList > li:nth-of-type(3n)::after {
  display: none;
}

ul.stepList > li > div:first-of-type {
  font-size: 11px;
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  align-items: center;
  flex-wrap: nowrap;
  width: 100%;
  padding: 4px;
  margin: 8px;
  background: #fff;
  border-radius: 21px;
}

ul.stepList > li > div:nth-of-type(2) {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: 100%;
  margin: 0;
  padding: 0;
  position: relative;
}

ul.stepList > li > div:nth-of-type(2):after {
  font-size: 40px;
  color: #fff;
  font-family: 'Font Awesome 5 Free';
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: 100%;
  margin: 0;
  padding: 0;
}

ul.stepList > li:first-of-type > div:nth-of-type(2):after {
  content: '\f030';
}

ul.stepList > li:nth-of-type(2) > div:nth-of-type(2):after {
  content: '\f044';
}

ul.stepList > li:nth-of-type(3) > div:nth-of-type(2):after {
  content: '\f0ae';
}

ul.stepList > li:nth-of-type(4) > div:nth-of-type(2):after {
  content: '\f0d1';
}

ul.stepList > li:nth-of-type(5) > div:nth-of-type(2):after {
  content: '\f49e';
}

ul.stepList > li:nth-of-type(6) > div:nth-of-type(2):after {
  content: '\f058';
}


ul.stepList > li:first-of-type > div:nth-of-type(2):after {
  content: '\f030';
}

ul.stepList > li:nth-of-type(2) > div:nth-of-type(2):after {
  content: '\f044';
}

ul.stepList > li:nth-of-type(3) > div:nth-of-type(2):after {
  content: '\f0ae';
}

ul.stepList > li > div:nth-of-type(3) {
  color: #fff;
  font-size: 14px;
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  flex-wrap: wrap;
  align-items: center;
  width: 100%;
  margin: 0;
  padding: 4px 8px;
}

ul.stepList.red > li {
  background: #ff7683;
}

ul.stepList.sellerStep > li:first-of-type > div:nth-of-type(2):after {
  content: '\f4ff';
}

ul.stepList.sellerStep > li:nth-of-type(2) > div:nth-of-type(2):after {
  content: '\f4fc';
}

ul.stepList.sellerStep > li:nth-of-type(3) > div:nth-of-type(2):after {
  content: '\f234';
}

.acd-check {
  display: none;
}

.acd-label {
  font-size: 15px;
    font-weight: bold;
  background: #5fceff;
  color: #fff;
  display: block;
  margin-bottom: 8px;
  padding: 10px;
  position: relative;
  width: 100%;
}

.acd-label:after {
  color: #fff;
  background: #4b93ff;
  box-sizing: border-box;
  content: '\f067';
  font-weight: bold;
  display: block;
  font-family: "Font Awesome 5 Free";
  height: fit-content;
  padding: 10px 20px;
  position: absolute;
  right: 0;
  top: 0px;
  bottom: 0;
}

.acd-content {
  /* border: 1px solid #333; */
  display: block;
  height: 0;
  opacity: 0;
  padding: 0 10px;
  transition: .5s;
  visibility: hidden;
}

.acd-check:checked + .acd-label:after {
  content: '\f068';
}

.acd-check:checked + .acd-label + .acd-content {
  height: fit-content;
  opacity: 1;
  padding: 0 8px 8px 8px;
  visibility: visible;
}

.acd-label::before {
  content: '\f059';
  font-weight: bold;
  font-family: 'Font Awesome 5 Free';
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: fit-content;
  margin-right: 8px;
  position: relative;
  top: 0;
  left: 0;
}

.acd-content > p {
  display: none;
  height: 0;
  opacity: 0;
  font-size: 13px;
}

.acd-check:checked + .acd-label + .acd-content > p {
  display: block;
  height: fit-content;
  opacity: 1;
  transition: .5s;
}

.btn_wrap {
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: 100%;
}

.btn_wrap > button {
  color: #fff;
  font-size: 20px;
  font-weight: bold;
  display: inline-flex;
  justify-content: center;
  flex-wrap: nowrap;
  align-items: center;
  width: 100%;
  border-radius: 8px;
  border: none;
  padding: 20px 0;
  margin-bottom: 30px;
  background: #ff7683;
}

.ec-checkbox.seller_terms_label {
  margin-top: 20px;
}

.id_sample {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
  background-image: url(../img/top/id_sample_sp.webp);
  background-repeat: no-repeat;
  background-size: contain;
  aspect-ratio: 1/1.429;
}

/* 閲覧人数 */
.count_user_wrap {
  display: flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: 100%;
  margin: 0 auto;
  line-height: 1.2rem;
  background-color: #ffffff;
  border-style: solid;
  border-width: 4px 0; 
  border-image: linear-gradient(90deg, #ff0055 0%, #ff00bb 100%);
  border-image-slice: 1;
}

.count_user_wrap > p {
  display: inline-flex;
  align-items: center;
  font-size: 0.8rem;
  font-weight: bold;
  color: #19191a;
  padding: 16px 0;
  margin-bottom: 0;
}

.count_user_wrap > p > span {
  font-size: 1.2rem;
  margin: 0 0.25rem;
  color: #ff1493;
}

/* カート人数 */
.count_incart_wrap {
  display: flex;
  justify-content: center;
  flex-wrap: nowrap;
  width: 100%;
  margin: 16px auto 0 auto;
  background: #fae0e3;
  line-height: 1.2rem;
  border-radius: 8px;
  border: 2px dashed #fc4a5c;
  position: relative;
}

.count_incart_wrap > p {
  display: inline-flex;
  align-items: center;
  align-items: center;
  font-size: 0.8rem;
  font-weight: bold;
  color: #000;
  padding: 16px 0;
  animation: slideIn 1s cubic-bezier(0.25, 1, 0.5, 1) forwards;
}

.count_incart_wrap > p > span {
  font-size: 1.2rem;
  margin: 0 0.25rem;
  color: #fc4a5c;
  animation: btn_animation 1.5s infinite;
}

.count_incart_wrap > p > i {
  color: #fc4a5c;
  display: block;
  font-size: 1.5rem;
  margin-right: 1.0rem;
  animation: btn_animation 1.5s infinite;
}

.balloon1 {
  display: inline-block;
  margin: 1.5em 0;
  padding: 3.5px 5px;
  width: fit-content;
  color: #fff;
  font-size: 12px;
  background: #fc4a5c;
  border-radius: 15px;
  position: absolute;
  top: -83%;
  left: -5%;
  transform: rotate(-7deg);
}

.balloon1:before {
  content: "";
  position: absolute;
  top: 100%;
  left: 50%;
  margin-left: -7.5px;
  border: 7.5px solid transparent;
  border-top: 7.5px solid #fc4a5c;
}

.balloon1 p {
  margin: 0;
  padding: 0;
}

@keyframes slideIn {
  0% {
    transform: translateX(180px);
    opacity: 0;
  }
  100% {
    transform: translateX(0);
  }
  40%,100% {
    opacity: 1;
  }
}

@keyframes btn_animation {
  0% {
      transform: scale(1.2)
  }
  5% {
      transform: scale(1)
  }
  95% {
      transform: scale(1)
  }
  100% {
      -webkit-transform: scale(1.2)
  }
}
 

/* 会員登録 */
.entry_top {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: nowrap;
  width: 100%;
  margin-bottom: 8px;
}

p.caution {
  color: #DE5D50;
  font-size: 0.8rem;
  font-weight: bold;
  display: inline-block;
  margin-bottom: 1rem;
  text-decoration: underline;
}

/* ポイント抽選 */
.PointGame {
  display: flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  padding: 20px;
  background: #ff0;
}

.PointGame > h1 {
  display: inline-flex;
  justify-content: center;
  flex-wrap: 100%;
  margin: 0 auto;
}

.PointGame > p {
  display: inline-flex;
  justify-content: center;
  flex-wrap: wrap;
  width: 100%;
  padding: 20px auto;
}

.button-lottery {
  position: relative;
  font-weight: bold;
  padding: 5px 15px;
  margin: 0px auto;
  border-radius: 30px;/*角の丸み*/
  font-size: 18px;/*文字サイズ*/
  background-color: #00a41a;/*背景色*/
  color: #fff;/*文字色*/
  display: inline-block;
  text-shadow: 1px 1px 0px rgb(0, 0, 0, 0.3);
  box-shadow: 0 3px 0 rgb(0, 0, 0, 0.3);
}

.button-lottery:before {
  font-family: "Font Awesome 5 Free";
  content: '\f144';/*好きなアイコン*/
  color: #eeee22;/*アイコンの色*/
  margin-right: 3px;
}

/* a:hover .button-lottery {
  background-color: #cc0000;
  color: #fff;
  box-shadow: 0 0px 0 rgb(0, 0, 0, 0.3);
  animation-play-state: paused;
  top: 3px;
} */

.lotteryButton {
  animation: dokidoki 1.5s infinite;
}

@keyframes dokidoki {
  0% {
      transform: scale(1.05)
  }
  5% {
      transform: scale(1)
  }
  95% {
      transform: scale(1)
  }
  100% {
      -webkit-transform: scale(1.05)
  }
}

hr {
    width: 100%;
    border-top: 1px solid #fff;
}

.list_bnr {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  margin: 0;
  padding: 20px;
}

.list_bnr > a {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  margin: 0;
  padding: 0;
}

.list_bnr > a > img {
  display: inline-flex;
  justify-content: flex-start;
  flex-wrap: wrap;
  width: 100%;
  object-fit: contain;
  object-position: center;
  margin: 0;
  padding: 0;
}


/* 既存の標準エラー枠を消す（二重表示防止） */
.alert-danger, .alert-error { display: none !important; }

.deepguide-critical-alert {
    background: #b22222; /* 重厚感のある赤 */
    color: #ffffff;
    padding: 15px 20px;
    position: sticky; /* 画面上部に留まる */
    top: 0;
    z-index: 10000;
    box-shadow: 0 4px 15px rgba(0,0,0,0.3);
    animation: slideDownFade 0.6s cubic-bezier(0.23, 1, 0.32, 1);
}

.deepguide-alert-inner {
    max-width: 1200px;
    margin: 0 auto;
    display: flex;
    align-items: center;
    justify-content: center;
}

.dg-icon-box {
    font-size: 24px;
    margin-right: 15px;
}

.pulse {
    animation: dg-pulse 1.5s infinite;
}

.dg-message-box {
    flex-grow: 1;
    line-height: 1.4;
}

.dg-message-box strong {
    display: block;
    font-size: 1.1rem;
    text-transform: uppercase;
    letter-spacing: 1px;
}

.dg-close-btn {
    background: rgba(255,255,255,0.2);
    border: none;
    color: white;
    padding: 5px 10px;
    border-radius: 4px;
    cursor: pointer;
    transition: 0.3s;
}

.dg-close-btn:hover { background: rgba(255,255,255,0.4); }

@keyframes slideDownFade {
    from { transform: translateY(-100%); opacity: 0; }
    to { transform: translateY(0); opacity: 1; }
}

@keyframes dg-pulse {
    0% { transform: scale(1); opacity: 1; }
    50% { transform: scale(1.2); opacity: 0.7; }
    100% { transform: scale(1); opacity: 1; }
}

/* タブレット */
@media screen and (min-width: 600px)
{
  .ec-headerNaviRole__logo {
    justify-content: flex-start;
  }

  .top_block_title > h2 {
    font-size: 2.0rem;
  }

  ul.collection_list li a dl dd {
    font-size: 2.0rem;
  }

  .ec-searchnavRole .ec-searchnavRole__counter {
    font-size: 1.5rem;
  }

  .ec-searchnavRole .ec-searchnavRole__counter > span:last-of-type {
    font-size: 1.2rem;
  }

  .ec-headerSearch .ec-headerSearch__category .ec-select.ec-select_search {
    border-radius: 0;
  }

  .ec-headerNaviRole .ec-headerNaviRole__right {
    margin-left: 32px;
  }

  .time_sale_ticker {
    width: calc(100% - 40px);
  }

  .ec-searchnavRole .ec-searchnavRole__infos *, .ec-searchnavRole .ec-searchnavRole__infos *::before, .ec-searchnavRole .ec-searchnavRole__infos *::after {
    font-size: 1.2rem;
  }

  ul#product_lists_wrap > li > a > ul > li:nth-of-type(2) > h3 {
    font-size: 1.0rem;
  }

  ul#product_lists_wrap > li > a > ul > li.description_list > h4 {
    font-size: 0.9rem;
  }

  ul#product_lists_wrap > li > a > ul > li.list_price > span {
    font-size: 1.4rem;
  }

  ul#product_lists_wrap > li > a > ul > li.list_price > span {
    font-size: 1.5rem!important;
  }

  ul.collection_list li:nth-of-type(2)::after {
    font-size: 1.5rem;
    right: -13%;
  }



}

/* PC */
@media screen and (min-width: 1025px)
{
  /* ヘッダー */
  .ec-layoutRole__header > .ec-headerNaviRole {
    justify-content: space-between;
    /* padding-bottom: 40px; */
    padding-bottom: 15px;
    padding-right: 0;
    padding-left: 0;
  }

  .ec-cartNavi {
    color: #000;
  }

  .ec-headerSearch .ec-headerSearch__category .ec-select.ec-select_search {
    background: #000;
    border-top-left-radius: 0.25rem;
    border-bottom-left-radius: 0.25rem;
  }

  .ec-headerSearch .ec-headerSearch__keyword input[type=search] {
    height: 34px;
  }

  .ec-headerNaviRole__logo {
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    align-items: center;
    width: fit-content;
    order: unset;
  }

  .ec-headerNaviRole__logo_inner {
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    /* width: fit-content; */
    margin-left: 0;
  }

  .ec-headerNaviRole__logo_inner > .ec-headerRole {
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    width: fit-content;
    padding-left: 0;
    padding-top: 0;
    padding-right: 0;
  }

  .ec-headerNaviRole__logo_inner > .ec-headerRole > .ec-headerRole__title {
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    width: fit-content;
  }

  .ec-headerNaviRole__logo_inner > .ec-headerRole > .ec-headerRole__title > .ec-headerTitle {
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    width: fit-content;
  }

  .ec-headerNaviRole__logo_inner > .ec-headerRole > .ec-headerRole__title > .ec-headerTitle > .ec-headerTitle__title {
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    width: fit-content;
  }

  .ec-headerNaviRole__logo_inner > .ec-headerRole > .ec-headerRole__title > .ec-headerTitle > .ec-headerTitle__title > h1 {
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    width: fit-content;
  }

  .ec-headerNaviRole__logo_inner > .ec-headerRole > .ec-headerRole__title > .ec-headerTitle > .ec-headerTitle__title > h1 > a {
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    width: fit-content;
    margin-bottom: 0;
  }

  .ec-headerNaviRole__nav {
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    align-items: center;
  }

  .ec-headerNav {
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    align-items: center;
  }

  .ec-headerNav .ec-headerNav__item {
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    align-items: center;
    margin-left: 0.5rem;
  }

  .ec-headerNaviRole .ec-headerNaviRole__nav a {
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    align-items: center;
  }

  .ec-headerNaviRole .ec-headerNaviRole__nav {
    display: inline-flex;
    margin-right: 1.5rem;
  }

  .ec-cartNavi {
    background: #e9ecef;
    /* padding: 16px 17px 10px; */
  }

  .ec-cartNavi .ec-cartNavi__icon {
    width: 2.5rem;
  }

  .ec-cartNavi .ec-cartNavi__badge {
    left: -2.5rem;
  }

  .ec-cartNaviIsset::before {
    right: 3.0rem;
  }

  .ec-headerNaviRole .ec-headerNaviRole__left {
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    align-items: center;
    width: calc(100% / 3);
  }

  .ec-headerNaviRole .ec-headerNaviRole__right {
    width: fit-content;
    align-items: baseline;
  }

  .ec-headerNaviRole .ec-headerNaviRole__search {
    width: 100%;
    margin-top: 0;
  }

  .ec-headerNaviRole:after {
    display: none;
  }

  /* サイドカテゴリ */
  .ec-categoryNaviRole.pc {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
  }

  h3.side_ttl.pc {
    color: #2d2d2d;
    font-size: 17px;
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    width: 100%;
    align-items: center;
    margin: 0 0 15px 0;
    font-weight: bold;
  }

  .ec-categoryNaviRole.pc > .ec-itemNav {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
  }

  .ec-categoryNaviRole.pc > .ec-itemNav {
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
  }

  .ec-categoryNaviRole.pc > .ec-itemNav > .ec-itemNav__nav {
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
  }

  .ec-categoryNaviRole.pc > .ec-itemNav > .ec-itemNav__nav > li {
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    width: 100%;
  }

  .ec-categoryNaviRole.pc > .ec-itemNav > .ec-itemNav__nav > li > a {
    color: #2d2d2d;
    font-size: 15px;
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    width: 100%;
    background: unset;
    padding: 7px 10px;
    font-weight: normal;
    position: relative;
  }

  .ec-categoryNaviRole.pc > .ec-itemNav > .ec-itemNav__nav > li > a::after {
    content: "expand_circle_right";
    font-family: "Material Symbols Outlined";
    font-weight: normal;
    font-style: normal;
    text-transform: none;
    white-space: nowrap;
    direction: ltr;
    -webkit-font-feature-settings: 'liga';
    font-size: 1.5rem;
    color: #a0a0a0;
    display: flex;
    justify-content: center;
    align-items: center;
    width: 1rem;
    height: 100%;
    position: absolute;
    top: 0px;
    right: 0;
    bottom: 0;
  }

  #page_homepage .ec-layoutRole .ec-layoutRole__contents {
    margin-top: 20px;
  }

  ul.category_item > li {
    flex: 0 0 22.5%;
  }

  /* 商品ページレイアウトボトム */
  .product_page .ec-layoutRole__mainBottom {
    background: unset;
  }

  /* フッター */
  .ec-blockTopBtn {
    right: 30px;
    bottom: 30px;
  }

  .ec-footerRole .ec-footerRole__inner {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
  }

  .ec-footerNavi {
    display: inline-flex;
    justify-content: center;
    flex-wrap: wrap;
    width: 100%;
    margin: 42px 0 0 0;
    padding: 8px 0px 8px 0px;
    /* border-top: 1px solid #e3e3e3;
    border-bottom: 1px solid #e3e3e3; */
    margin: 0;
  }

  .ec-footerNavi .ec-footerNavi__link:first-of-type {
    border-top: none;
  }

  .ec-footerNavi .ec-footerNavi__link a {
    border-bottom: none;
    text-decoration: none;
    border-right: 1px solid #e3e3e3;
    padding: 0 8px;
    margin: 0;
  }

  .ec-footerNavi .ec-footerNavi__link a:last-of-type {
    border-right: none;
  }

  .ec-footerTitle {
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    width: 100%;
    padding: 25px 0 50px 0;
  }

  /* カテゴリコレクション */
  .category-scroll-container {
        max-width: 980px;
        margin: 0 auto;
        padding: 30px 20px;
    }

    /* 1段・2段用の設定をPC用に上書きリセット */
    .category-scroll-list.is-single,
    .category-scroll-list.is-double {
        grid-auto-flow: row;        /* 下方向（縦）へ自動折り返しに変更 */
        grid-template-rows: none;   /* 縦の段数縛りを解除 */
        
        /*  スクロールを無くし、最低幅85pxで画面いっぱいに多段並びにする */
        grid-template-columns: repeat(auto-fill, minmax(85px, 1fr));
        
        gap: 25px 20px;             /* PC用に隙間を広げる（上下25px、左右20px） */
        padding: 0;
        overflow-x: visible;        /* 横スクロールを解除 */
    }

    /*  PC表示時はアイコンの表示サイズを少し大きくする */
    .category-icon-wrapper {
        width: 68px;
        height: 68px;
        margin-bottom: 8px;
    }

    /* PC表示時は文字サイズも少し大きくする */
    .category-icon-name {
        font-size: 0.85rem;
    }

  .deliver_info {
    border-radius: 0.25rem;
    width: calc(100% - 18px);
    margin: 0 auto 16px auto;
  }

  .ec-searchnavRole {
    padding-right: 8px;
    padding-left: 8px;
  }

  .ec-searchnavRole .ec-searchnavRole__infos {
    border-top: none;
    border-bottom: none;
    background: unset;
  }

  .ec-searchnavRole .ec-searchnavRole__infos .ec-searchnavRole__counter {
    color: #4b93ff;
  }

  .ec-topicpath {
    border-radius: 0.25rem;
  }

  ul#product_lists_wrap {
    padding: 0 20px;
  }

  #page_product_list .ec-layoutRole__contents {
    margin-top: 25px;
  }

  #page_product_detail .ec-layoutRole__contents {
    margin-top: 20px;
  }
  

  .ec-pagerRole {
    margin: 0 20px;
    width: calc(100% - 40px);
  }

  ul.ec-pager {
    justify-content: flex-end;
    border-top: none;
  }
  
  .ec-pager .ec-pager__item a, .ec-pager .ec-pager__item--active a {
    font-size: 18px;
    font-weight: bold;
  }

  ul.pages_previous_wrap > li:first-of-type {
    margin-left: 0;
  }

  ul.pages_previous_wrap > li > a {
    font-size: 18px;
    background: #4b93ff;
    padding: 0.2rem 1rem;
    border-radius: 4px;
  }

  ul.pages_previous_wrap > li > a > i {
    color: #fff;
    font-size: 25px;
    -webkit-text-stroke-color: #4b93ff;
    -webkit-text-stroke-width: 2px;
    transform: unset;
    transform-origin: unset;
  }

  ul.pages_next_wrap > li:last-of-type {
    margin-right: 0;
  }


  ul.pages_next_wrap > li > a {
    font-size: 18px;
    background: #4b93ff;
    padding: 0.2rem 1rem;
    border-radius: 4px;
  }

  ul.pages_next_wrap > li > a > i {
    color: #fff;
    font-size: 25px;
    -webkit-text-stroke-color: #4b93ff;
    -webkit-text-stroke-width: 2px;
    transform: unset;
    transform-origin: unset;
  }

  main.ec-layoutRole__mainWithColumn {
    display: flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    align-content: flex-start;
    width: 100%;
  }

  .product_page_cell {
    width: 50%;
  }

  .slick-num {
    padding: 15px 0 5px 0;
  }

  .product_page_cell .item_visual {
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    align-items: flex-start;
    align-content: flex-start;
    width: 100%;
  }

  .product_page_cell.visual_cell {
    padding: 0 10px 0 20px;
  }

  .product_page_cell.detail_cell {
    padding: 0 20px 0 10px;
  }
  
  #new_item {
      /* grid-template-columns: repeat(4, 1fr); */
      grid-template-columns: repeat(4, 1fr) !important; /* PCでは4列に拡張 */
      gap: 30px 20px; /* PC時は少しカードの余白を広く取ると綺麗に見えます */
  }

  .item_nav {
    display: inline-flex;
    justify-content: flex-start;
    flex-wrap: wrap;
    width: 100%;
    padding: 8px 0;
    margin-bottom: 20px;
  }

  .item_nav > .slideThumb {
    display: inline-flex;
    flex-wrap: nowrap;
    width: calc((100% / 3) - (20px / 3));
    margin-right: 10px;
    margin-top: 10px;
    padding: 0;
  }

  .item_nav > .slideThumb:nth-of-type(2n) {
    margin-right: 10px;
  }

  .item_nav > .slideThumb:nth-of-type(3n) {
    margin-right: 0;
  }

  .item_nav > .slideThumb > img {
    object-fit: cover;
    width: 100%;
    height: 100%;
  }

  .item_nav.is-closed {
    max-height: none !important;
    overflow: visible !important;
    padding-bottom: 0 !important; /* スマホ用につけた余白を消す */
  }

  /* PCの時はマスクとボタンを絶対に表示しない */
  .item_nav .nav_mask,
  .item_nav .btn_show_more {
    display: none !important;
  }

  #saleShop_sp {
    display: none;
  }

  #saleShop_pc {
    font-size: 10px;
    display: flex;
    justify-content: flex-start;
    flex-wrap: nowrap;
    width: 100%;
    padding: 0 20px 5px 20px;
    position: relative;
  }
  
  #saleShop_pc > p {
    color: #4b93ff;
    font-size: 14px;
    font-weight: bold;
    display: inline-flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: nowrap;
    width: 100%;
    position: relative;
  }
  
  #saleShop_pc > p:before {
    content: '\f54f';
    font-family: 'Font Awesome 5 Free';
    font-weight: bold;
    display: inline-flex;
    justify-content: center;
    flex-wrap: nowrap;
    align-items: center;
    width: fit-content;
    position: relative;
    top: 0;
    left: 0;
    margin-right: 0.25rem;
  }

  ul#category_tag {
    padding: 5px 20px 20px 20px;
    border-top: 0;
  }

  .productDetail_inner > .ec-headingTitle {
    font-size: 18px;
    border-top: 0;
    border-bottom: 0;
  }

  ul.product_sub_info > li {
    line-height: 1;
  }

  #page_product_list #history_child {
    padding-bottom: 50px;
  }

  .ec-layoutRole__mainBottom {
    width: 100%;
  }

  /* トレンドブロック */
  ul#trend_item {
    padding: 0 20px;
  }

  ul#trend_item > li {
    width: calc((100% - 60px) / 3);
    margin-right: 15px;
  }

  ul#trend_item > li:nth-of-type(3n) {
    margin-right: 0;
  }

  /* カート */
  .ec-role {
    max-width: unset;
  }

  #page_cart .ec-role:after {
    display: none;
  }

  .ec-progress .ec-progress__item:after {
    top: 1.5em;
  }

  .ec-progress {
    max-width: unset;
  }

  #page_cart .ec-pageHeader {
    display: inline-flex;
    justify-content: flex-start;
    align-items: center;
    flex-wrap: nowrap;
    width: 100%;
    padding: 0 20px;
  }

  #page_cart .ec-pageHeader h1, .ec-pageHeader .h1 {
    font-size: 28px;
    margin: 0 0 30px 0;
    padding: 0 0 30px 0;
  }

  .ec-cartRole .ec-cartRole__cart {
    margin: 0;
  }

  .ec-cartHeader {
    padding: 0;
  }

  .ec-cartRow {
    padding: 0;
  }

  .ec-cartHeader .ec-cartHeader__label {
    white-space: nowrap;
  }

  li.ec-cartRow__subtotalColumn {
    vertical-align: middle;
  }

  /* ログインページ */
  #page_mypage_login .ec-pageHeader > h1 {
    margin: 0 0 48px 0;
  }

  #page_mypage_login .ec-login .ec-grid2__cell > .ec-login__link:first-of-type {
    margin-top: 0;
  }

  #page_mypage_login .ec-login .ec-grid2__cell > .ec-login__link:first-of-type > a {
    margin-top: 0;
  }

  #page_mypage_login .ec-login .ec-grid2__cell > .ec-login__link:nth-of-type(2) {
    font-size: 12px;
    margin-top: 20px;
  }

  /* マイページ */
  .ec-pageHeader > h1 {
    margin: 0 0 48px 0;
    padding: 0 0 18px 0;
  }

  .ec-mypageRole .ec-pageHeader h1, .ec-mypageRole .ec-pageHeader .h1 {
    margin: 0 0 48px 0;
    padding: 0 0 18px 0;
  }

  /* 特定商 */
  #page_help_tradelaw .ec-borderedDefs {
    display: grid;
    justify-content: flex-start;
    flex-wrap: nowrap;
    width: 100%;
  }

  /* 年齢認証 */
  .modal-leave-inner {
    width: 20%;
    padding: 40px;
  }

  /* 出品者登録について */
  .page_center_subttl {
    font-size: 30px;
    justify-content: center;
    margin: 30px 0;
  }

  .commission_dl:first-of-type {
    margin-top: 38px;
  }

  /* 閲覧人数 */
  .count_user_wrap {
    margin: 0 auto;
  }

  /* コラム一覧用 */
  ul.talk_lists > li {
    width: 100%;
  }

  ul.talk_lists > li > a > dl {
    flex-wrap: nowrap;
    align-items: center;
    padding: 8px;
    background: #fff;
    border-radius: 8px;
  }

  ul.talk_lists > li > a > dl > dt {
    width: 10%;
  }

  ul.talk_lists > li > a > dl > dd {
    font-weight: bold;
    width: 90%;
    padding: 0 16px;
  }

  ul.talk_lists > li:nth-of-type(2n) {
    margin-left: 0;
    margin-top: 8px;
  }

  /* 新商品 */
  .products_ttl img, .catWrap_inner h2 img {
    width: 30rem;
  }

    
  ul.collection_list li:nth-of-type(2)::after {
    font-size: 2.0rem;
  }

  li.product_tags {
    /* margin-bottom: 8px; */
  }

  li.product_tags > span:last-of-type {
    /* margin-bottom: 0; */
  }

  .ec-newsRole__newsHeading,
  .ec-newsRole__newsDescriptionInner {
      padding-left: 25px;
      padding-right: 25px;
  }

  /* 商品一覧 */
  ul#product_lists_wrap {
    /* モバイルの2列（repeat(2, ...)）を、PCでは4列に変更 */
    grid-template-columns: repeat(4, minmax(0, 1fr));
    
    /* PCの広い画面に合わせて、隙間や余白を微調整したい場合はここで変更可能です */
    column-gap: 20px;
    max-width: 1200px; /* 必要に応じてコンテンツの最大幅を制限 */
    margin: 30px auto 0 auto;
  }

  ul#product_lists_wrap > li > a > ul > li:first-of-type > span.soldout-label > p {
    font-size: 1.2rem;
  }

  /* 閲覧履歴 */
  ul#history_items {
    /* PCでは1マスの横幅を18%程度に縮小し、より多くの履歴が一度に見えるように調整 */
    grid-auto-columns: 18%;
    column-gap: 12px;
  }

  ul#history_items > li > a > ul > li:first-of-type > span.soldout-label > p {
    font-size: 0.9rem;
  }

  ul#history_items {
    cursor: grab; /* 普段は「開いた手」 */
  }
  ul#history_items:active {
    cursor: grabbing; /* クリック中は「握った手」 */
  }

  /* 関連商品 */
  ul#relation_items {
    cursor: grab;
  }
  ul#relation_items:active {
    cursor: grabbing;
  }

  /* カート */
  .ec-cartNaviIsset.is-active {
    top: 3.5rem;
  }

}