.input-prepend.input-append input {
    font-size: 24px;
    padding-top: 11px;
    padding-bottom: 11px;
    width: 100px;
    text-align: right;
  }
  .stock_error {
    color: #DB5656;
  }

/* 非同期カートインボタン */
.btn-addcart {
    background-color: var(--accent-color);
    color: #fff;
    border: none;
    transition: background-color 0.3s;
}

.btn-addcart:hover {
    background-color: #8B2E2D;
    color: #fff;
}

.cart_in_with_async {
    position: relative;
}

.cart_in_with_async.loading {
    opacity: 0.7;
    pointer-events: none;
}

.cart_in_with_async.loading::after {
    content: "";
    position: absolute;
    top: 50%;
    left: 50%;
    width: 20px;
    height: 20px;
    margin: -10px 0 0 -10px;
    border: 2px solid #fff;
    border-top-color: transparent;
    border-radius: 50%;
    animation: button-loading 0.6s linear infinite;
}

@keyframes button-loading {
    0% {
        transform: rotate(0deg);
    }
    100% {
        transform: rotate(360deg);
    }
}

/* 商品詳細ページ */
.product-details {
  max-width: 1400px;
  margin: 0 auto;
  padding: 16px 8px 120px 8px !important;
  overflow: visible !important;
  position: relative;
  background: #fff;
}

/* パンくずリスト */
.breadcrumb {
  margin-bottom: 20px;
  padding: 0 20px;
}

.breadcrumb-list {
  display: flex;
  align-items: center;
  list-style: none;
  margin: 0;
  padding: 12px 0;
  font-size: 14px;
  color: #666;
}

.breadcrumb-list li {
  display: flex;
  align-items: center;
}

.breadcrumb-list li:not(:last-child)::after {
  content: '>';
  margin: 0 8px;
  color: #999;
  font-size: 12px;
}

.breadcrumb-list a {
  color: #666;
  text-decoration: none;
  transition: color 0.3s;
}

.breadcrumb-list a:hover {
  color: var(--accent-color);
}

.breadcrumb-list .current-page {
  color: #333;
  font-weight: 500;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
  max-width: 200px;
}

/* 商品タイトル */
.product-title {
  font-size: 18px;
  font-weight: 600;
  color: #1a1d21;
  margin: 0;
  line-height: 1.4;
  padding: 12px 0;
  border: none;
}

/* 商品画像 */
.product-gallery {
  width: 100%;
  margin-bottom: 32px;
}

.product-main-image {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  text-align: center;
  margin-bottom: 16px;
  position: relative;
  aspect-ratio: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  overflow: hidden;
}

.product-main-image img {
  max-width: 100%;
  max-height: 100%;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0;
  transition: transform 0.2s;
}

.product-main-image:hover img {
  transform: scale(1.02);
}

.product-sub-images {
  display: flex;
  gap: 10px;
}

.sub-image img {
  width: 70px;
  height: 70px;
  object-fit: cover;
  border-radius: 6px;
  border: 1.5px solid #eee;
  background: #fff;
}

/* 商品説明 */
.product-description {
  font-size: 1.08rem;
  color: #444;
  margin-bottom: 10px;
  line-height: 1.8;
}

/* 商品情報テーブル */
.product-info-table {
  margin-bottom: 40px;
}

.product-info-table table {
  width: 100%;
  border-collapse: separate;
  border-spacing: 0;
  background: #fafafa;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0 1px 4px rgba(0,0,0,0.03);
}

.product-info-table th,
.product-info-table td {
  padding: 16px 18px;
  border-bottom: 1px solid #eee;
  font-size: 1rem;
}

.product-info-table th {
  width: 120px;
  background: #f5f5f5;
  color: #666;
  font-weight: 500;
  border-right: 1px solid #eee;
}

.product-info-table tr:last-child th,
.product-info-table tr:last-child td {
  border-bottom: none;
}

.regular-price {
  text-decoration: line-through;
  color: #565959;
  font-size: 14px;
}

.sales-price {
  color: #B12704;
  font-size: 28px;
  font-weight: 400;
  line-height: 1.2;
}

.discount-rate {
  background: #CC0C39;
  color: #fff;
  font-size: 12px;
  font-weight: 700;
  border-radius: 4px;
  padding: 2px 6px;
  margin-left: 8px;
}

/* 商品オプション */
.product-options {
  margin: 0;
  background: #f8f9fa;
  padding: 16px 18px;
  border-bottom: 1px solid #e9ecef;
}

.option-item {
  margin-bottom: 12px;
}

.option-item:last-child {
  margin-bottom: 0;
}

.option-label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: #495057;
  margin-bottom: 6px;
}

.option-select {
  width: 100%;
  padding: 14px 15px;
  min-height: 48px;
  border: 1px solid #ced4da;
  border-radius: 4px;
  font-size: 13px;
  background: #fff;
  color: #495057;
}

.option-select:focus {
  outline: none;
  border-color: #007bff;
  box-shadow: 0 0 0 2px rgba(0,123,255,0.25);
}

/* カートエリア */
.product-cart-area {
  margin-top: 18px;
  padding: 18px 0 0 0;
  border-top: 1.5px solid #eee;
  display: flex;
  flex-direction: column;
  gap: 18px;
}

.quantity-select {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-bottom: 10px;
}

.quantity-select input {
  width: 70px;
  padding: 8px;
  text-align: center;
  border: 1px solid #ddd;
  border-radius: 4px;
  font-size: 1.1rem;
}

.quantity-up,
.quantity-down {
  width: 36px;
  height: 36px;
  padding: 0;
  border: 1.5px solid #ddd;
  background: #fff;
  border-radius: 50%;
  font-size: 1.3rem;
  color: #333;
  cursor: pointer;
  transition: background 0.2s, color 0.2s;
}

.quantity-up:hover,
.quantity-down:hover {
  background: var(--accent-color);
  color: #fff;
}

.unit {
  margin-left: 5px;
  color: #666;
  font-size: 1rem;
}

.cart-buttons {
  display: flex;
  gap: 16px;
}

.btn-cart,
.btn-quick {
  padding: 14px 36px;
  border: none;
  border-radius: 6px;
  font-size: 1.08rem;
  font-weight: 600;
  cursor: pointer;
  text-decoration: none;
  text-align: center;
  background: var(--accent-color);
  color: #fff;
  box-shadow: 0 2px 8px rgba(171,59,58,0.07);
  transition: background 0.2s, box-shadow 0.2s;
}

.btn-cart:hover,
.btn-quick:hover {
  background: #8B2E2D;
  color: #fff;
  box-shadow: 0 4px 16px rgba(171,59,58,0.13);
}

.btn-quick {
  background: #666;
}

.btn-quick:hover {
  background: #444;
}

.btn-soldout {
  background: #bbb;
  color: #fff;
  border: none;
  border-radius: 6px;
  font-size: 1.08rem;
  font-weight: 600;
  padding: 14px 36px;
  cursor: not-allowed;
}

.login-required {
  color: #666;
  margin: 0;
}

/* 商品関連リンク */
.product-links {
  margin: 4px 18px 0 18px;
  background: none;
  border: none;
  border-radius: 0;
  padding: 12px 0;
  box-shadow: none;
  transition: none;
}

.product-links:hover {
  box-shadow: none;
  transform: none;
}

.product-links ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.product-links li {
  margin-bottom: 2px;
  position: relative;
}

.product-links li:last-child {
  margin-bottom: 0;
}

.link-secondary {
  color: #495057;
  text-decoration: none;
  font-size: 13px;
  font-weight: 500;
  display: block;
  padding: 8px 0;
  border-radius: 0;
  transition: color 0.2s ease;
  position: relative;
  letter-spacing: -0.01em;
}

.link-secondary::before {
  display: none;
}

.link-secondary:hover {
  color: #007bff;
  background: none;
  text-decoration: none;
  padding-left: 0;
}

.link-secondary:hover::before {
  display: none;
}

/* SNSボタン */
.product-social {
  margin-bottom: 40px;
}

/* レスポンシブ対応 */
@media (max-width: 1024px) {
  .product-detail-2col {
    flex-direction: column;
    gap: 24px;
  }
  
  .product-detail-right {
    max-width: 100%;
    min-width: 0;
    width: 100%;
    flex: none;
  }
  
  .product-sticky-box {
    position: static !important;
  }
  
  .product-header-section {
    padding: 16px 16px;
  }
  
  .product-pricing {
    padding: 16px 16px;
  }
  
  .product-info-compact {
    padding: 14px 16px;
  }
  
  .purchase-section {
    padding: 16px 16px;
  }
  
  .service-info {
    margin: 12px 16px;
    padding: 14px;
  }
  
  .product-links {
    margin: 12px 16px 0 16px;
    padding: 14px;
  }
  
  .quantity-input {
    width: 70px;
    padding: 10px 14px;
    font-size: 15px;
  }
}

@media (max-width: 768px) {
  .product-details {
    padding: 16px 8px 120px 8px !important;
    margin: 0 !important;
  }
  
  .main-content {
    padding-bottom: 120px !important;
  }
  
  /* パンくずリストの改行防止と横スクロール */
  .breadcrumb-list {
    flex-wrap: nowrap;      /* 要素を折り返さず、一行に強制する */
    overflow-x: auto;       /* 横方向にはみ出した部分をスクロール可能にする */
    -webkit-overflow-scrolling: touch; /* iOSでスムーズなスクロールを実現 */
    padding-bottom: 10px;   /* スクロールバーの表示領域を確保 */
    gap: 8px; /* リストアイテム間の余白 */
  }

  /* スクロールバー自体を非表示にして、見た目をスッキリさせる */
  .breadcrumb-list::-webkit-scrollbar {
    display: none; /* Chrome, Safari */
  }
  .breadcrumb-list {
    scrollbar-width: none; /* Firefox */
  }

  .breadcrumb-list li {
    flex: none; /* アイテム幅を固定して縮まないように */
  }

  /* === モバイル専用商品画像ギャラリーの表示制御 === */
  .mobile-gallery {
    display: block !important;
    width: 100% !important;
    margin: 0 0 20px 0 !important;
    padding: 0 !important;
  }

  .mobile-gallery .product-main-image {
    width: 100% !important;
    margin: 0 auto 16px auto !important;
    padding: 0 !important;
    display: flex !important;
    align-items: center !important;
    justify-content: center !important;
  }

  .mobile-gallery .product-main-image img {
    width: 100% !important;
    height: auto !important;
    object-fit: cover !important;
  }

  .mobile-gallery .product-thumbnails {
    display: flex !important;
    justify-content: center !important;
    flex-wrap: wrap !important;
    gap: 8px !important;
    margin: 0 auto !important;
    padding: 0 !important;
  }
  
  /* === 順序制御 === */
  .product-detail-2col {
    display: flex !important;
    flex-direction: column !important;
    gap: 20px !important;
  }

  /* デスクトップ用の画像ギャラリーを非表示 */
  .product-detail-left .product-gallery {
    display: none !important;
  }

  /* 左カラム（商品詳細）を最後に表示 */
  .product-detail-left {
    order: 3 !important;
  }

  /* 右カラム（カート要素）を2番目に表示 - デスクトップ設定をリセット */
  .product-detail-right {
    order: 2 !important;
    flex: none !important;
    width: 100% !important;
    max-width: none !important;
    min-width: 0 !important;
  }

  .product-sticky-box {
    position: static !important;
    width: 100% !important;
    margin: 0 !important;
    border: 1px solid #e1e5e9 !important;
    border-radius: 8px !important;
    background: #fff !important;
  }

  /* === モバイル用パディング統一（8px基準） === */
  .product-header-section {
    padding: 16px 8px 12px 8px !important;
  }

  .product-pricing {
    padding: 14px 8px !important;
  }

  .product-info-compact {
    padding: 12px 8px !important;
  }

  .purchase-section {
    padding: 16px 8px !important;
  }

  .service-info {
    margin: 16px 8px 4px 8px !important;
    padding: 12px 0 !important;
  }

  .product-links {
    margin: 4px 8px 0 8px !important;
    padding: 12px 0 !important;
  }

  /* モバイルビューでのみカートに追加ボタンの高さを+8px */
  .btn-cart-primary {
    padding: 16px 16px !important;
  }
}

@media (max-width: 480px) {
  .product-details {
    padding: 12px 8px 120px 8px !important;
    margin: 0 !important;
  }

  .mobile-gallery {
    padding: 0 !important;
  }
}

/* 2カラムレイアウト */
.product-detail-2col {
  display: flex;
  gap: 32px;
  align-items: flex-start;
  overflow: visible !important;
  position: relative;
  min-height: 100vh;
}

.product-detail-left {
  flex: 1 1 0;
  min-width: 0;
  overflow: visible !important;
  max-width: none;
}

.product-detail-right {
  flex: 0 0 280px;
  min-width: 260px;
  max-width: 300px;
  position: relative;
  height: fit-content;
  overflow: visible !important;
}

/* 右カラムSticky Box - シンプルデザイン */
.product-sticky-box {
  background: #fff;
  border: 1px solid #e1e5e9;
  border-radius: 8px;
  padding: 0;
  display: flex;
  flex-direction: column;
  overflow: visible !important;
  height: fit-content;
  transition: all 0.3s ease;
}

.product-sticky-box[style*="position: fixed"] {
  border-color: #d1d7db;
}

/* ヘッダーセクション */
.product-header-section {
  background: #fff;
  border-radius: 8px 8px 0 0;
  padding: 20px 18px 16px 18px;
}

/* レビュー・評価 - シンプルデザイン */
.product-rating {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin: 0;
}

.rating-stars {
  display: flex;
  align-items: center;
  gap: 8px;
  background: #fff3e0;
  padding: 6px 10px;
  border-radius: 6px;
  border: 1px solid #ffcc02;
}

.stars {
  color: #ff9800;
  font-size: 14px;
  letter-spacing: 1px;
}

.rating-count {
  color: #2c3e50;
  font-size: 13px;
  font-weight: 600;
}

.reviews-link {
  color: #1976d2;
  text-decoration: none;
  font-size: 12px;
  font-weight: 500;
  transition: color 0.2s;
}

.reviews-link:hover {
  color: #1565c0;
  text-decoration: underline;
}

/* 価格セクション - シンプルデザイン */
.product-pricing {
  background: #fff;
  border-top: 1px solid #f0f0f0;
  border-bottom: 1px solid #e9ecef;
  padding: 18px 18px;
  margin: 0;
}

.price-section {
  display: flex;
  align-items: baseline;
  gap: 8px;
  margin-bottom: 8px;
}

.price-section.main-price {
  margin-bottom: 12px;
  align-items: center;
}

.price-label {
  font-size: 12px;
  color: #6c757d;
  font-weight: 500;
}

.sales-price {
  color: #dc3545;
  font-size: 22px;
  font-weight: 700;
  line-height: 1.2;
}

.discount-rate {
  background: #dc3545;
  color: #fff;
  font-size: 10px;
  font-weight: 700;
  border-radius: 4px;
  padding: 3px 8px;
  margin-left: 6px;
}

.shipping-info {
  margin-top: 8px;
  background: #e8f5e8;
  border: 1px solid #c3e6cb;
  border-radius: 4px;
  padding: 6px 10px;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
}

.shipping-free {
  color: #155724;
  font-size: 12px;
  font-weight: 700;
  display: flex;
  align-items: center;
  gap: 4px;
}

.shipping-free::before {
  content: '';
  width: 12px;
  height: 12px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='12' height='12'%3E%3Cpath fill='%23155724' d='M9 16.17L4.83 12l-1.42 1.41L9 19 21 7l-1.41-1.41z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 12px;
}

/* 商品基本情報 - シンプルデザイン */
.product-info-compact {
  margin: 0;
  background: #fff;
  padding: 16px 18px;
  border-bottom: 1px solid #e9ecef;
}

.info-row {
  display: flex;
  justify-content: space-between;
  margin-bottom: 8px;
  font-size: 12px;
  padding: 4px 0;
}

.info-row:last-child {
  margin-bottom: 0;
}

.info-label {
  color: #495057;
  font-weight: 600;
}

.info-value {
  color: #212529;
  font-weight: 500;
}

.stock-status {
  color: #28a745;
  font-weight: 700;
}

/* 購入セクション - シンプルデザイン */
.purchase-section {
  background: #fff;
  border-radius: 0 0 8px 8px;
  padding: 20px 18px;
}

.quantity-selector {
  margin-bottom: 16px;
}

.quantity-label {
  display: block;
  font-size: 13px;
  font-weight: 600;
  color: #495057;
  margin-bottom: 8px;
}

.quantity-controls {
  display: flex;
  align-items: center;
  gap: 8px;
  justify-content: center;
}

.quantity-btn {
  width: 32px;
  height: 32px;
  padding: 0;
  border: 1px solid #ced4da;
  background: #fff;
  border-radius: 50%;
  font-size: 16px;
  color: #495057;
  cursor: pointer;
  display: flex;
  align-items: center;
  justify-content: center;
  transition: all 0.2s;
}

.quantity-btn:hover {
  background: #f8f9fa;
  border-color: #adb5bd;
}

.quantity-input {
  width: 80px;
  padding: 12px 16px;
  text-align: center;
  border: 2px solid #e9ecef;
  border-radius: 12px;
  font-size: 16px;
  font-weight: 700;
  background: linear-gradient(135deg, #fff 0%, #f8f9fa 100%);
  color: #495057;
  box-shadow: 
    inset 0 2px 4px rgba(0,0,0,0.06),
    0 1px 3px rgba(0,0,0,0.1);
  transition: all 0.2s ease;
}

.quantity-input:focus {
  outline: none;
  border-color: #007bff;
  box-shadow: 
    0 0 0 3px rgba(0,123,255,0.25),
    inset 0 2px 4px rgba(0,0,0,0.06),
    0 2px 8px rgba(0,123,255,0.15);
  background: #fff;
  transform: scale(1.05);
}

/* アクションボタン - シンプルデザイン */
.action-buttons {
  display: flex;
  flex-direction: column;
  gap: 10px;
}

.btn-cart-primary {
  width: 100%;
  background: #ffd700;
  border: 1px solid #f1c40f;
  border-radius: 25px;
  padding: 12px 16px;
  font-size: 13px;
  font-weight: 700;
  color: #2c3e50;
  cursor: pointer;
  transition: all 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  box-shadow: 0 0 20px rgba(255, 215, 0, 0.4);
}

.btn-cart-primary::before {
  content: '';
  width: 16px;
  height: 16px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='16' height='16'%3E%3Cpath fill='%232c3e50' d='M7 18c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2zM1 2v2h2l3.6 7.59-1.35 2.45c-.16.28-.25.61-.25.96 0 1.1.9 2 2 2h12v-2H7.42c-.14 0-.25-.11-.25-.25l.03-.12L8.1 13h7.45c.75 0 1.41-.41 1.75-1.03L21.7 4H5.21l-.94-2H1zm16 16c-1.1 0-2 .9-2 2s.9 2 2 2 2-.9 2-2-.9-2-2-2z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px;
}

.btn-cart-primary:hover {
  background: #f1c40f;
  transform: translateY(-1px);
  box-shadow: 0 0 30px rgba(255, 215, 0, 0.6), 0 0 60px rgba(255, 215, 0, 0.3);
}

/* === 商品URLコピーボタンスタイルは下部に移動しました === */

/* 画像ギャラリー */
.product-gallery {
  width: 100%;
  margin-bottom: 32px;
}

.product-main-image {
  background: transparent;
  border: none;
  border-radius: 0;
  padding: 0;
  text-align: center;
  margin-bottom: 16px;
  position: relative;
  aspect-ratio: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  overflow: hidden;
}

.product-main-image img {
  max-width: 100%;
  max-height: 100%;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: 0;
  transition: transform 0.2s;
}

.product-main-image:hover img {
  transform: scale(1.02);
}

.product-thumbnails {
  display: flex;
  gap: 8px;
  flex-wrap: wrap;
  justify-content: flex-start;
  margin-top: 12px;
}

.thumbnail-image {
  width: 70px;
  height: 70px;
  object-fit: cover;
  border-radius: 4px;
  border: 2px solid #e0e0e0;
  background: #fff;
  cursor: pointer;
  transition: all 0.2s ease;
  flex-shrink: 0;
}

.thumbnail-image.active,
.thumbnail-image:hover {
  border-color: #007185;
  box-shadow: 0 0 0 1px #007185;
  transform: scale(1.05);
}

html, body {
  overflow: visible !important;
}

#wrapper {
  overflow: visible !important;
}

.container {
  overflow: visible !important;
}

/* 右カラム内の商品タイトルは少し小さめに */
.product-sticky-box .product-title {
  font-size: 1.4rem;
  margin: 0 0 16px 0;
  padding-bottom: 0;
  border-bottom: none;
}

/* サービス情報 - シンプルデザイン（外枠なし） */
.service-info {
  margin: 20px 18px 4px 18px;
  background: none;
  border-radius: 0;
  padding: 16px 0;
  border: none;
  box-shadow: none;
  transition: none;
}

.service-info:hover {
  box-shadow: none;
  transform: none;
}

.service-item {
  display: flex;
  align-items: center;
  gap: 14px;
  margin-bottom: 16px;
  padding: 8px 0;
  position: relative;
}

.service-item:last-child {
  margin-bottom: 0;
}

.service-item::after {
  content: '';
  position: absolute;
  bottom: 0;
  left: 40px;
  right: 0;
  height: 1px;
  background: #e9ecef;
}

.service-item:last-child::after {
  display: none;
}

.service-icon {
  width: 24px;
  height: 24px;
  flex-shrink: 0;
  border-radius: 50%;
  display: flex;
  align-items: center;
  justify-content: center;
  position: relative;
}

.service-icon.truck {
  background: #e8f5e8;
  border: none;
}

.service-icon.truck::before {
  content: '';
  width: 16px;
  height: 16px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='16' height='16'%3E%3Cpath fill='%232e7d32' d='M20 8h-3V4H3c-1.1 0-2 .9-2 2v11h2c0 1.66 1.34 3 3 3s3-1.34 3-3h6c0 1.66 1.34 3 3 3s3-1.34 3-3h2v-5l-3-4zM6 18.5c-.83 0-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5 1.5.67 1.5 1.5-.67 1.5-1.5 1.5zm13.5-9l1.96 2.5H17V9.5h2.5zm-1.5 9c-.83 0-1.5-.67-1.5-1.5s.67-1.5 1.5-1.5 1.5.67 1.5 1.5-.67 1.5-1.5 1.5z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px;
}

.service-icon.package {
  background: #e3f2fd;
  border: none;
}

.service-icon.package::before {
  content: '';
  width: 16px;
  height: 16px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='16' height='16'%3E%3Cg fill='%231976d2'%3E%3C!-- 箱の正面 --%3E%3Crect x='3' y='9' width='12' height='10' fill='%231976d2' stroke='%231565c0' stroke-width='0.5'/%3E%3C!-- 箱の上面 --%3E%3Cpath d='M3 9 L7 5 L19 5 L15 9 Z' fill='%232196f3' stroke='%231565c0' stroke-width='0.5'/%3E%3C!-- 箱の右側面 --%3E%3Cpath d='M15 9 L19 5 L19 15 L15 19 Z' fill='%231565c0' stroke='%231565c0' stroke-width='0.5'/%3E%3C!-- フラップの線 --%3E%3Cline x1='6' y1='9' x2='6' y2='5.5' stroke='%231565c0' stroke-width='0.5'/%3E%3Cline x1='9' y1='9' x2='9' y2='5.5' stroke='%231565c0' stroke-width='0.5'/%3E%3Cline x1='12' y1='9' x2='12' y2='5.5' stroke='%231565c0' stroke-width='0.5'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px;
}

.service-icon.security {
  background: #fff3e0;
  border: none;
}

.service-icon.security::before {
  content: '';
  width: 16px;
  height: 16px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='16' height='16'%3E%3Cpath fill='%23e65100' d='M12,1L3,5V11C3,16.55 6.84,21.74 12,23C17.16,21.74 21,16.55 21,11V5L12,1M10,17L6,13L7.41,11.59L10,14.17L16.59,7.58L18,9L10,17Z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px;
}

.service-text {
  flex: 1;
}

.service-text strong {
  display: block;
  font-size: 14px;
  font-weight: 600;
  color: #2c3e50;
  margin-bottom: 4px;
  letter-spacing: -0.01em;
}

.service-text p {
  font-size: 12px;
  color: #5a6c7d;
  margin: 0;
  line-height: 1.5;
  font-weight: 400;
}

/* その他リンク - シンプルデザイン（外枠なし） */
.product-links {
  margin: 4px 18px 0 18px;
  background: none;
  border: none;
  border-radius: 0;
  padding: 12px 0;
  box-shadow: none;
  transition: none;
}

.product-links:hover {
  box-shadow: none;
  transform: none;
}

.product-links ul {
  list-style: none;
  padding: 0;
  margin: 0;
}

.product-links li {
  margin-bottom: 2px;
  position: relative;
}

.product-links li:last-child {
  margin-bottom: 0;
}

.link-secondary {
  color: #495057;
  text-decoration: none;
  font-size: 13px;
  font-weight: 500;
  display: block;
  padding: 8px 0;
  border-radius: 0;
  transition: color 0.2s ease;
  position: relative;
  letter-spacing: -0.01em;
}

.link-secondary::before {
  display: none;
}

.link-secondary:hover {
  color: #007bff;
  background: none;
  text-decoration: none;
  padding-left: 0;
}

.link-secondary:hover::before {
  display: none;
}

.product-grid {
  grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  gap: 12px;
}

/* シェアセクション */
.share-section {
  margin-top: 20px;
  padding-top: 16px;
  border-top: 1px solid #e9ecef;
}

.share-title {
  font-size: 14px;
  font-weight: 600;
  color: #495057;
  margin: 0 0 12px 0;
  letter-spacing: -0.01em;
}

.social-buttons {
  display: flex;
  flex-direction: row;
  flex-wrap: wrap;
  gap: 8px;
  align-items: flex-start;
}

.social-buttons > * {
  margin: 0;
  flex-shrink: 0;
}

/* レスポンシブ対応でソーシャルボタンを調整 */
@media (max-width: 768px) {
  .social-buttons {
    flex-direction: row;
    flex-wrap: wrap;
    gap: 6px;
  }
}

/* モバイル用のおすすめ商品セクション */
.recommendations-section {
  margin-top: 32px;
  padding-top: 24px;
  border-top: 1px solid #e9ecef;
}

.recommendations-section .section-title {
  font-size: 18px;
  font-weight: 600;
  color: #333;
  margin: 0 0 20px 0;
  padding: 0 0 12px 0;
  border-bottom: 2px solid var(--accent-color);
  line-height: 1.4;
}

/* おすすめ商品グリッドをモバイル時は縦並びに */
.recommendations-section .product-grid {
  display: flex;
  flex-direction: column;
  gap: 16px;
}

/* おすすめ商品カードをTOPページと同じスタイルに */
.recommendations-section .product-card {
  border: none;
  border-radius: 0;
  background-color: white;
  padding: 0;
  overflow: visible;
  box-shadow: none;
  transition: background-color 0.2s ease;
  position: relative;
  width: 100%;
  border-bottom: 1px solid #e0e0e0;
  display: flex;
  align-items: center;
  gap: 16px;
}

.recommendations-section .product-card:hover {
  background-color: #f8f9fa;
  box-shadow: none;
  transform: none;
}

.recommendations-section .product-card .product-card__image {
  width: 120px;
  height: 120px;
  flex-shrink: 0;
  background: #f8f9fa;
  border-radius: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  overflow: hidden;
}

.recommendations-section .product-card .product-card__image img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  transition: none;
}

.recommendations-section .product-card .product-card__body {
  flex: 1;
  padding: 16px 0;
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.recommendations-section .product-card .product-card__title {
  font-size: 1.2em;
  font-weight: 600;
  margin: 0;
  line-height: 1.4;
  color: #333;
}

.recommendations-section .product-card .product-card__title a {
  color: inherit;
  text-decoration: none;
}

.recommendations-section .product-card .product-card__title a:hover {
  color: var(--accent-color);
}

/* 480px以下でのおすすめ商品セクション */
.recommendations-section .section-title {
  font-size: 16px;
  margin: 0 0 16px 0;
  padding: 0 0 10px 0;
}

.recommendations-section .product-card .product-card__image {
  width: 100px;
  height: 100px;
}

.recommendations-section .product-card .product-card__title {
  font-size: 1.1em;
}

/* モバイル専用要素の初期状態設定 */
.mobile-gallery {
  display: none;
}

/* モバイル専用ラッパーはPC時には無効化 */
.mobile-cart-wrapper {
  /* PC時は通常のブロック要素として動作 */
}

/* 2カラムレイアウト */

.btn-copy-url {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 11px 19px;
  background: transparent;
  color: #667eea;
  border: none;
  border-radius: 25px;
  font-size: 14px;
  font-weight: 600;
  text-decoration: none;
  cursor: pointer;
  transition: all 0.3s cubic-bezier(0.4, 0, 0.2, 1);
  position: relative;
  overflow: hidden;
  min-width: 158px;
  letter-spacing: 0.02em;
  box-shadow: inset 0 0 0 2px #667eea;
  box-sizing: border-box;
}

.btn-copy-url::before {
  content: '';
  position: absolute;
  top: 0;
  left: -100%;
  width: 100%;
  height: 100%;
  background: linear-gradient(90deg, transparent, rgba(102, 126, 234, 0.1), transparent);
  transition: left 0.5s ease;
}

.btn-copy-url:hover {
  background: rgba(102, 126, 234, 0.05);
  box-shadow: inset 0 0 0 2px #5a67d8;
  color: #5a67d8;
  transform: translateY(-1px);
}

.btn-copy-url:hover::before {
  left: 100%;
}

.btn-copy-url:active {
  transform: translateY(0);
  background: rgba(102, 126, 234, 0.1);
}

.btn-copy-url.copied {
  background: rgba(16, 185, 129, 0.05);
  box-shadow: inset 0 0 0 2px #10b981;
  color: #10b981;
  transform: translateY(-1px) scale(0.98);
}

.btn-copy-url.copied:hover {
  background: rgba(16, 185, 129, 0.08);
  box-shadow: inset 0 0 0 2px #059669;
  color: #059669;
  transform: translateY(-1px) scale(0.98);
}

.copy-icon {
  display: flex;
  align-items: center;
  justify-content: center;
  transition: transform 0.3s ease;
}

.btn-copy-url:hover .copy-icon {
  transform: rotate(5deg) scale(1.1);
}

.btn-copy-url.copied .copy-icon {
  transform: scale(1.2);
}

.copy-text {
  font-weight: 600;
  white-space: nowrap;
  transition: all 0.3s ease;
}

/* SVGアイコンのスタイル */
.copy-icon svg {
  transition: all 0.3s ease;
}

/* レスポンシブ対応 */
@media (max-width: 768px) {
  .btn-copy-url {
    padding: 9px 15px;
    font-size: 13px;
    min-width: 138px;
    border-radius: 25px;
  }
  
  .copy-icon svg {
    width: 14px;
    height: 14px;
  }
}

@media (max-width: 480px) {
  .btn-copy-url {
    padding: 7px 13px;
    font-size: 12px;
    min-width: 118px;
    border-radius: 25px;
    gap: 6px;
  }
  
  .copy-icon svg {
    width: 12px;
    height: 12px;
  }
}

.btn-buy-now {
  width: 100%;
  background: #ff6b35;
  border: 1px solid #e67e22;
  border-radius: 25px;
  padding: 12px 16px;
  font-size: 13px;
  font-weight: 700;
  color: #fff;
  text-decoration: none;
  text-align: center;
  cursor: pointer;
  transition: all 0.2s;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
}

.btn-buy-now::before {
  content: '';
  width: 16px;
  height: 16px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 24 24' width='16' height='16'%3E%3Cpath fill='%23fff' d='M11 21h-1l1-7H7.5c-.58 0-.57-.32-.38-.66.19-.34.05-.08.07-.12C8.48 10.94 10.42 7.54 13 3h1l-1 7h3.5c.49 0 .56.33.47.51l-.07.15C12.96 17.55 11 21 11 21z'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 16px;
}

.btn-buy-now:hover {
  background: #e67e22;
  transform: translateY(-1px);
  color: #fff;
}

/* === 商品URLコピーボタンスタイルは下部に移動しました === */
