/* Japanese storefront polish — visual only, no layout rewrites */
:root {
  --jp-ink: #2b2b2b;
  --jp-muted: #6b6560;
  --jp-paper: #f7f5f2;
  --jp-surface: #ffffff;
  --jp-line: #e6e1db;
  --jp-line-strong: #d4cdc4;
  --jp-accent: #9c2b33;
  --jp-accent-hover: #7e2128;
  --jp-price: #b4232c;
  --jp-gold: #8d7350;
  --jp-radius: 6px;
  --jp-shadow: 0 8px 24px rgba(43, 38, 33, 0.06);
  --jp-font: "Hiragino Sans", "Hiragino Kaku Gothic ProN", "Noto Sans JP", "Yu Gothic Medium", "Yu Gothic", Meiryo, sans-serif;
}

html {
  -webkit-text-size-adjust: 100%;
  text-size-adjust: 100%;
}

body {
  font-family: var(--jp-font) !important;
  color: var(--jp-ink);
  background: var(--jp-paper) !important;
  letter-spacing: 0.03em;
  line-height: 1.75;
  -webkit-font-smoothing: antialiased;
}

a {
  color: inherit;
  transition: color .15s ease, opacity .15s ease;
}

img {
  image-rendering: auto;
}

input, select, textarea, button {
  font-family: inherit;
}

/* —— Header / nav —— */
#headerWrapper {
  background: #f3f0eb !important;
  border-bottom: 1px solid var(--jp-line);
}

#navMainWrapper {
  background: #2f2c29 !important;
}

#topsaletext,
#toptext,
#toptext p {
  letter-spacing: 0.06em;
}

.p-scroll-nav {
  background: #9c2b33 !important;
}

.u-badge__icon {
  background: var(--jp-accent) !important;
  color: #fff !important;
  font-weight: 600;
  min-width: 18px;
  line-height: 1;
  padding: 4px 6px !important;
  box-sizing: border-box;
}

#js-header-regis i.fa,
#js-header-login i.fa,
#js-header-cart i.fa-shopping-cart,
#navMainbox i.fa {
  box-shadow: none;
}

.logorighttop strong,
.header-main_brand h1,
.header-main_tool_brand.until-pc h1,
.footer-brand_logo {
  color: var(--jp-ink) !important;
  font-weight: 600;
  letter-spacing: 0.08em;
}

/* —— Product cards —— */
.proBox {
  background: var(--jp-surface);
  border: 1px solid var(--jp-line);
  border-radius: var(--jp-radius);
  padding: 10px 10px 14px;
  box-sizing: border-box;
  transition: box-shadow .2s ease, border-color .2s ease;
}

.proBox:hover {
  border-color: var(--jp-line-strong);
  box-shadow: var(--jp-shadow);
}

.proBox .pro_img {
  background: #faf9f7;
  border-radius: 4px;
  overflow: hidden;
}

.proBox .prod-info .price a,
.proBox .prod-info a {
  color: var(--jp-ink) !important;
  font-size: 13px;
  line-height: 1.5;
  text-decoration: none !important;
}

.price_special .pickup_p2,
.normalprice {
  color: var(--jp-muted) !important;
  text-decoration: line-through;
  font-weight: 400 !important;
}

.new_productsprice,
.new_productsprice span,
.productSpecialPrice,
.productSalePrice,
.products_price .price,
.strong,
#cartSubTotal,
.total_price {
  color: var(--jp-price) !important;
}

.io-center a {
  display: inline-block;
  margin-top: 6px;
  font-size: 12px;
  color: var(--jp-gold) !important;
  letter-spacing: 0.08em;
  text-decoration: none !important;
  border-bottom: 1px solid transparent;
}

.io-center a:hover {
  border-bottom-color: var(--jp-gold);
}

.block-goods-detail--icons-border,
.proBox .icon {
  border-radius: 2px !important;
  font-weight: 500;
  letter-spacing: 0.04em;
}

/* —— Buttons —— */
.cssButton,
.cssButtonHover,
#shoppingCartDefault input.cssButton,
#shoppingCartDefault input.cssButtonHover,
.addtocart .button_in_cart,
.onePageall .confirmation .button_confirm_order {
  background: var(--jp-accent) !important;
  border: none;
  border-radius: 2px !important;
  letter-spacing: 0.12em;
  font-weight: 600 !important;
  box-shadow: none;
}

.cssButton:hover,
.cssButtonHover:hover,
.button.m-warning-fill:hover {
  background: var(--jp-accent-hover) !important;
  opacity: 1 !important;
}

.button.m-warning-fill {
  background-color: var(--jp-accent) !important;
  border-radius: 2px;
  letter-spacing: 0.1em;
}

.button.m-fill {
  background: #2f2c29 !important;
  border-radius: 2px;
}

/* —— Forms —— */
input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="number"],
select,
textarea {
  border-color: var(--jp-line-strong) !important;
  border-radius: 2px !important;
  color: var(--jp-ink);
  background: #fff;
}

input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
select:focus,
textarea:focus {
  outline: none;
  border-color: #b5aaa0 !important;
  box-shadow: 0 0 0 3px rgba(141, 115, 80, 0.12);
}

/* —— Cart / checkout —— */
.cart_itembox {
  background: #fff;
  border-color: var(--jp-line) !important;
}

.total_area .total_box {
  background: #fff;
  border: 1px solid var(--jp-line) !important;
  border-radius: var(--jp-radius);
}

.total_area .total_list {
  border-bottom: 1px dotted var(--jp-line-strong) !important;
}

.quantity_list input[type="button"] {
  background: #fff;
  border: 1px solid var(--jp-line-strong) !important;
  color: var(--jp-ink);
  cursor: pointer;
}

.cart-qty-input {
  border: 1px solid var(--jp-line-strong) !important;
  border-radius: 2px;
}

.box.m-primary.total-amount-box,
.total-amount-box {
  background: #fff;
  border: 1px solid var(--jp-line);
  border-radius: var(--jp-radius);
}

.total-amount-price_number {
  color: var(--jp-price) !important;
  font-weight: 700;
  letter-spacing: 0.04em;
}

.cart-product,
.cart-product-list_item {
  border-color: var(--jp-line) !important;
}

/* —— Notice banners: quieter, still visible —— */
.bannerAttention {
  background: #faf7f2;
  border: 1px solid #e4d8c8;
  padding: 18px 16px !important;
  margin-bottom: 16px;
}

.bannerAttention h1,
.bannerAttention h3,
.bannerAttention p {
  color: var(--jp-ink) !important;
  border: none !important;
  background: none !important;
  font-weight: 600;
  line-height: 1.7 !important;
}

.bannerAttention h1 {
  font-size: 18px !important;
  letter-spacing: 0.08em;
  color: var(--jp-accent) !important;
}

.bannerAttention h3 {
  font-size: 15px !important;
  color: var(--jp-gold) !important;
}

.bannerAttention p {
  font-size: 13px !important;
  font-weight: 400 !important;
  color: var(--jp-muted) !important;
}

.bannerAttention span,
.bannerAttention .attentionText {
  background: transparent !important;
  border: none !important;
  color: inherit !important;
  padding: 0 !important;
}

.bannerAttention .attentionText {
  color: var(--jp-accent) !important;
  font-weight: 700 !important;
}

/* —— Product detail —— */
#cartAdd .cart_num {
  background: #faf8f5 !important;
  border-color: var(--jp-line) !important;
}

#productAttributes .wrapperAttribsOptions {
  border-radius: 4px !important;
}

/* —— Footer —— */
#footer_box,
.pane-footer,
.footerinfo {
  background: #f3f0eb;
  color: var(--jp-ink);
}

#footer_info h3,
.panel-title {
  letter-spacing: 0.08em;
  font-weight: 600;
}

/* —— Pagination —— */
.el-pager li.active,
.el-pager li:hover,
.el-pagination button:hover {
  background: var(--jp-accent) !important;
}

/* —— Bell page chrome —— */
.main-wrapper,
.ccm-page,
.page-type-general-top-pagetype {
  background-color: var(--jp-paper);
}

.heading-1,
.title,
h1.title {
  letter-spacing: 0.08em;
  font-weight: 600;
  color: var(--jp-ink);
}

.section.card,
.card {
  border-color: var(--jp-line) !important;
  box-shadow: none;
}

/* —— Gift campaign —— */
.gift-campaign {
  background: #fff;
  border: 1px solid var(--jp-line);
  border-radius: var(--jp-radius);
  padding: 16px !important;
}

.gift-campaign-title {
  letter-spacing: 0.1em;
  font-weight: 600 !important;
}

.gift-none-btn {
  border-color: var(--jp-line-strong) !important;
  border-radius: 2px !important;
  letter-spacing: 0.06em;
}

.gift-none-btn.is-active {
  background: #2f2c29 !important;
  border-color: #2f2c29 !important;
}

.gift-card.active {
  border-color: var(--jp-accent) !important;
  box-shadow: 0 0 0 2px rgba(156, 43, 51, 0.12) !important;
}

.gift-card-price b,
.gift-promo-price b,
.gift-promo-tag {
  color: var(--jp-price) !important;
}

.gift-promo-mark {
  background: var(--jp-gold) !important;
  border: none !important;
  letter-spacing: 0.12em;
}

.gift-promo-banner h2 {
  color: var(--jp-accent) !important;
}

/* —— Mobile —— */
@media (max-width: 767px) {
  body {
    line-height: 1.7;
  }

  input[type="text"],
  input[type="password"],
  input[type="email"],
  input[type="tel"],
  select,
  textarea,
  .cart-qty-input {
    font-size: 16px !important; /* iOS zoom prevention */
    min-height: 40px;
  }

  .cssButton,
  .button.m-size-xl,
  .button.m-full {
    min-height: 48px;
    font-size: 15px !important;
  }

  .proBox {
    padding: 8px 6px 12px;
  }

  .bannerAttention {
    padding: 14px 12px !important;
  }

  .bannerAttention h1 {
    font-size: 16px !important;
  }

  .cart_itembox {
    padding: 12px !important;
  }

  .total-amount-box {
    padding: 16px !important;
  }

  .gift-campaign {
    padding: 12px !important;
  }

  .u-badge__icon {
    top: 2px !important;
    right: 0 !important;
  }
}

@media (min-width: 768px) {
  .l-container,
  #main_center .l-container {
    max-width: 1180px;
  }
}