/*
Theme Name: MARUYAMA Blocksy Child
Theme URI: https://maruyamatrade.jp/
Description: 合資会社丸山商店 MARUYAMA 公式サイト／オンラインショップ用の子テーマ。モダンで上質なファッション系のデザインシステムを提供します。
Author: MARUYAMA TRADE CO.,LTD.
Author URI: https://maruyamatrade.jp/
Template: blocksy
Version: 1.0.0
Text Domain: maruyamatrade
*/

/* =========================================================================
   1. デザイントークン
   ========================================================================= */
:root {
	--mt-ink: #101820;
	--mt-ink-2: #2b333b;
	--mt-cream: #faf7f2;
	--mt-sand: #efe9e0;
	--mt-line: #e4ddd3;
	--mt-gold: #a9824c;
	--mt-gold-2: #c6a87a;
	--mt-muted: #7c766d;
	--mt-white: #ffffff;

	--mt-serif: "Noto Serif JP", "Hiragino Mincho ProN", "Yu Mincho", "YuMincho", serif;
	--mt-sans: "Noto Sans JP", -apple-system, BlinkMacSystemFont, "Hiragino Kaku Gothic ProN",
		"Yu Gothic", "YuGothic", Meiryo, "Helvetica Neue", Arial, sans-serif;
	--mt-latin: "Cormorant Garamond", "Times New Roman", Georgia, serif;

	--mt-radius: 2px;
	--mt-shadow: 0 18px 40px -28px rgba(16, 24, 32, 0.35);
	--mt-container: 1200px;
}

/* =========================================================================
   2. ベース
   ========================================================================= */
body,
.ct-container,
.entry-content,
.woocommerce,
input,
select,
textarea,
button {
	font-family: var(--mt-sans);
}

body {
	color: var(--mt-ink-2);
	font-size: 15px;
	line-height: 1.95;
	letter-spacing: 0.01em;
	background-color: var(--mt-white);
	-webkit-font-smoothing: antialiased;
}

h1, h2, h3, h4, h5, h6,
.entry-content h1, .entry-content h2, .entry-content h3, .entry-content h4 {
	font-family: var(--mt-serif);
	color: var(--mt-ink);
	font-weight: 600;
	letter-spacing: 0.045em;
	line-height: 1.5;
}

h2 { font-size: clamp(22px, 2.4vw, 30px); }
h3 { font-size: clamp(18px, 1.8vw, 22px); }

a { color: var(--mt-ink); }
a:hover { color: var(--mt-gold); }

::selection { background: var(--mt-gold-2); color: #fff; }

.ct-container,
.ct-container-full > .ct-container {
	max-width: var(--mt-container);
}

/* セクション見出し（英字ラベル + 和文見出し + 罫線） */
.mt-section-head { text-align: center; margin: 0 auto 30px; max-width: 720px; }
.mt-eyebrow {
	font-family: var(--mt-latin);
	font-size: 13px;
	line-height: 1.2;
	letter-spacing: 0.3em;
	text-transform: uppercase;
	color: var(--mt-gold);
	display: block;
	margin-bottom: 8px;
}
.mt-section-head h2 {
	margin: 0 0 12px;
	font-size: clamp(24px, 2.8vw, 34px);
	line-height: 1.3;
}
.mt-section-head h2::after {
	content: "";
	display: block;
	width: 44px;
	height: 1px;
	background: var(--mt-gold);
	margin: 15px auto 0;
}
.mt-section-head p { color: var(--mt-muted); margin: 0; }

.mt-section { padding: 58px 0; }
.mt-section--cream { background: var(--mt-cream); }
.mt-section--sand { background: var(--mt-sand); }
.mt-section--tight { padding: 44px 0; }

/* =========================================================================
   3. ボタン
   ========================================================================= */
.mt-btn,
.wp-block-button__link,
.woocommerce a.button,
.woocommerce button.button,
.woocommerce input.button,
.woocommerce #respond input#submit,
.wc-block-components-button,
.ct-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 10px;
	padding: 15px 34px;
	background: var(--mt-ink);
	color: #fff;
	border: 1px solid var(--mt-ink);
	border-radius: var(--mt-radius);
	font-family: var(--mt-sans);
	font-size: 13px;
	font-weight: 500;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	line-height: 1;
	transition: all 0.25s ease;
	cursor: pointer;
}

.mt-btn:hover,
.wp-block-button__link:hover,
.woocommerce a.button:hover,
.woocommerce button.button:hover,
.woocommerce #respond input#submit:hover,
.wc-block-components-button:hover,
.ct-button:hover {
	background: var(--mt-gold);
	border-color: var(--mt-gold);
	color: #fff;
}

.mt-btn--ghost { background: transparent; color: var(--mt-ink); border-color: var(--mt-ink); }
.mt-btn--ghost:hover { background: var(--mt-ink); color: #fff; border-color: var(--mt-ink); }
.mt-btn--gold { background: var(--mt-gold); border-color: var(--mt-gold); }
.mt-btn--gold:hover { background: var(--mt-ink); border-color: var(--mt-ink); }
.mt-btn--light { background: #fff; border-color: #fff; color: var(--mt-ink); }
.mt-btn--light:hover { background: transparent; color: #fff; border-color: #fff; }

/* =========================================================================
   4. ヘッダー
   ========================================================================= */
.ct-header {
	background: rgba(255, 255, 255, 0.96);
	border-bottom: 1px solid var(--mt-line);
	backdrop-filter: saturate(180%) blur(8px);
}

/* ヘッダー行の高さ（Blocksy の動的 CSS より優先させる） */
.ct-header [data-row="middle"],
.ct-header[data-header] [data-row*="middle"] {
	--height: 100px !important;
}

/* ナビゲーション：項目間に十分な余白を確保
   ※ 水平パディングは Blocksy が --menu-items-spacing から算出するため、
     ここで padding を上書きする場合は左右も同じ変数から指定する。 */
.ct-header .header-menu-1,
.ct-header .header-menu-2 {
	--menu-items-spacing: 46px;
	--menu-items-gap: 0px;
}
.ct-header .header-menu-1 .menu,
.ct-header .header-menu-2 .menu { align-items: center; }
.ct-header .menu > li { display: flex; align-items: center; }
.ct-header .menu > li > a.ct-menu-link {
	font-size: 13.5px;
	letter-spacing: 0.09em;
	font-weight: 500;
	color: var(--mt-ink);
	padding-block: 16px;
	padding-inline: calc(var(--menu-items-spacing, 46px) / 2);
	line-height: 1.2;
	white-space: nowrap;
}
/* ドロップダウンもゆったりと */
.ct-header .sub-menu {
	--dropdown-items-spacing: 14px;
	min-width: 250px;
	padding: 12px 0 !important;
}
.ct-header .sub-menu li a {
	padding: 14px 28px;
	font-size: 13.5px;
	letter-spacing: 0.06em;
	white-space: nowrap;
}
/* 検索・カートとの間隔 */
.ct-header [data-id="search"],
.ct-header [data-id="cart"] { margin-inline-start: 6px; }

/* 画面幅に応じて段階的に詰める（折り返し防止） */
@media (max-width: 1300px) {
	.ct-header .header-menu-1 { --menu-items-spacing: 32px; }
}
@media (max-width: 1150px) {
	.ct-header .header-menu-1 { --menu-items-spacing: 24px; }
	.ct-header .menu > li > a { font-size: 13px; }
}
@media (max-width: 1000px) {
	.ct-header .header-menu-1 { --menu-items-spacing: 16px; }
	.ct-header .menu > li > a { font-size: 12.5px; letter-spacing: 0.04em; }
}
/* モバイルドロワー内の間隔 */
.ct-header .mobile-menu { --menu-items-spacing: 22px; }
.ct-header .mobile-menu .ct-menu-link { padding: 14px 0; font-size: 14.5px; }

.ct-header .site-title,
.ct-header .site-title a {
	font-family: var(--mt-serif);
	font-size: 22px;
	letter-spacing: 0.16em;
	color: var(--mt-ink);
	text-transform: uppercase;
}
.ct-header .site-description {
	font-size: 10px;
	letter-spacing: 0.24em;
	color: var(--mt-gold);
	text-transform: uppercase;
}

.ct-header .menu > li > a:hover,
.ct-header .current-menu-item > a { color: var(--mt-gold); }
.ct-header .menu > li > a::after {
	content: "";
	display: block;
	width: 0;
	height: 1px;
	background: var(--mt-gold);
	transition: width 0.25s ease;
	margin-top: 4px;
}
.ct-header .menu > li > a:hover::after,
.ct-header .current-menu-item > a::after { width: 100%; }

.ct-header .ct-header-cart .ct-cart-item,
.ct-header .ct-header-search { color: var(--mt-ink); }
.ct-header .ct-cart-item .ct-label { font-size: 12px; letter-spacing: 0.08em; }

/* =========================================================================
   4.5 ヘッダー上部バー（言語切替）
   ========================================================================= */
.mt-topbar {
	background: var(--mt-ink);
	color: rgba(255, 255, 255, 0.72);
	font-size: 11.5px;
	letter-spacing: 0.14em;
	line-height: 1;
}
.mt-topbar__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 16px;
	min-height: 40px;
	padding-top: 6px;
	padding-bottom: 6px;
}
.mt-topbar__brand {
	font-family: var(--mt-latin);
	font-size: 12.5px;
	letter-spacing: 0.2em;
	text-transform: uppercase;
}
.mt-topbar__lang { display: inline-flex; align-items: center; gap: 10px; white-space: nowrap; }
.mt-topbar__lang a { color: rgba(255, 255, 255, 0.8); text-decoration: none; letter-spacing: 0.12em; }
.mt-topbar__lang a:hover { color: var(--mt-gold-2); }
.mt-topbar__sep { color: rgba(255, 255, 255, 0.28); }

/* 右上：カート（数量バッジ付き）と言語切替 */
.mt-topbar__right { display: inline-flex; align-items: center; gap: 22px; }
.mt-topbar__cart {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: rgba(255, 255, 255, 0.86);
	text-decoration: none;
	letter-spacing: 0.12em;
}
.mt-topbar__cart:hover { color: var(--mt-gold-2); }
.mt-cart-icon { flex: 0 0 auto; opacity: 0.9; }
.mt-cart-count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 20px;
	height: 20px;
	padding: 0 5px;
	background: var(--mt-gold);
	color: #fff;
	border-radius: 10px;
	font-size: 11px;
	letter-spacing: 0;
	line-height: 1;
}
@media (max-width: 782px) {
	.mt-topbar__brand { display: none; }
	.mt-topbar__inner { justify-content: flex-end; }
	.mt-topbar__right { gap: 14px; }
	.mt-topbar__cart { gap: 6px; }
	.mt-topbar__cart-label { font-size: 11px; }
	.mt-topbar__lang { gap: 8px; }
}

/* =========================================================================
   5. ホーム：ヒーロー
   ========================================================================= */
.mt-hero {
	background: var(--mt-cream);
	padding: 76px 0 92px;
	border-bottom: 1px solid var(--mt-line);
}
.mt-hero__inner {
	display: grid;
	grid-template-columns: 1.05fr 0.95fr;
	gap: 68px;
	align-items: center;
}
.mt-hero__title {
	font-family: var(--mt-serif);
	font-size: clamp(30px, 4.2vw, 50px);
	line-height: 1.42;
	letter-spacing: 0.05em;
	margin: 0 0 26px;
	color: var(--mt-ink);
}
.mt-hero__lead {
	color: var(--mt-ink-2);
	font-size: 15px;
	line-height: 2.15;
	margin: 0 0 34px;
	max-width: 34em;
}
.mt-hero__actions { display: flex; gap: 16px; flex-wrap: wrap; }
.mt-hero__media { position: relative; }
.mt-hero__media img {
	width: 100%;
	aspect-ratio: 4 / 5;
	object-fit: cover;
	display: block;
	box-shadow: var(--mt-shadow);
}
.mt-hero__media::after {
	content: "";
	position: absolute;
	inset: 22px -22px -22px 22px;
	border: 1px solid var(--mt-gold-2);
	z-index: -1;
}
.mt-hero__badge {
	position: absolute;
	left: -26px;
	bottom: 34px;
	background: var(--mt-ink);
	color: #fff;
	padding: 16px 22px;
	font-family: var(--mt-latin);
	font-size: 13px;
	letter-spacing: 0.24em;
	text-transform: uppercase;
}

/* =========================================================================
   6. ホーム：カテゴリー
   ========================================================================= */
.mt-cats { display: grid; grid-template-columns: repeat(4, 1fr); gap: 26px; }
.mt-cat {
	position: relative;
	display: block;
	overflow: hidden;
	background: var(--mt-sand);
	text-decoration: none;
}
.mt-cat img {
	width: 100%;
	aspect-ratio: 3 / 4;
	object-fit: cover;
	display: block;
	transition: transform 0.6s ease;
}
.mt-cat:hover img { transform: scale(1.045); }
.mt-cat::after {
	content: "";
	position: absolute;
	inset: 0;
	background: linear-gradient(180deg, rgba(16, 24, 32, 0) 42%, rgba(16, 24, 32, 0.62) 100%);
}
.mt-cat__label {
	position: absolute;
	left: 0;
	right: 0;
	bottom: 26px;
	z-index: 2;
	text-align: center;
	color: #fff;
}
.mt-cat__label .en {
	display: block;
	font-family: var(--mt-latin);
	font-size: 12px;
	letter-spacing: 0.28em;
	text-transform: uppercase;
	color: var(--mt-gold-2);
	margin-bottom: 6px;
}
.mt-cat__label .ja {
	font-family: var(--mt-serif);
	font-size: 17px;
	letter-spacing: 0.08em;
}

/* =========================================================================
   7. ホーム：ブランドストーリー／バンド
   ========================================================================= */
.mt-story { display: grid; grid-template-columns: 0.95fr 1.05fr; gap: 64px; align-items: center; }
.mt-story img { width: 100%; aspect-ratio: 4 / 3; object-fit: cover; display: block; }
.mt-story__body h2 { margin-top: 0; }
.mt-story__body p { color: var(--mt-ink-2); }
.mt-story__meta {
	display: flex;
	gap: 34px;
	margin-top: 30px;
	padding-top: 26px;
	border-top: 1px solid var(--mt-line);
}
.mt-story__meta div { font-size: 13px; color: var(--mt-muted); letter-spacing: 0.06em; }
.mt-story__meta strong {
	display: block;
	font-family: var(--mt-latin);
	font-size: 22px;
	letter-spacing: 0.14em;
	color: var(--mt-gold);
	margin-bottom: 6px;
}

.mt-band { background: var(--mt-ink); color: #fff; padding: 68px 0; }
.mt-band__grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 40px; text-align: center; }
.mt-band__item .num {
	font-family: var(--mt-latin);
	font-size: 30px;
	letter-spacing: 0.16em;
	color: var(--mt-gold-2);
	display: block;
	margin-bottom: 10px;
}
.mt-band__item .ttl {
	font-family: var(--mt-serif);
	font-size: 16px;
	letter-spacing: 0.08em;
	margin-bottom: 10px;
}
.mt-band__item p { color: rgba(255, 255, 255, 0.72); font-size: 13.5px; margin: 0; }

.mt-wholesale { text-align: center; }
.mt-wholesale h2 { margin: 0 0 18px; }
.mt-wholesale p { max-width: 640px; margin: 0 auto 30px; color: var(--mt-ink-2); }

.mt-info-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.mt-info-card {
	background: #fff;
	border: 1px solid var(--mt-line);
	padding: 34px 30px;
}
.mt-info-card .en {
	font-family: var(--mt-latin);
	font-size: 12px;
	letter-spacing: 0.26em;
	text-transform: uppercase;
	color: var(--mt-gold);
	display: block;
	margin-bottom: 12px;
}
.mt-info-card h3 { margin: 0 0 12px; font-size: 17px; }
.mt-info-card p { margin: 0; font-size: 13.5px; color: var(--mt-muted); line-height: 1.9; }

/* お知らせ */
.mt-news-list { display: grid; grid-template-columns: repeat(3, 1fr); gap: 28px; }
.mt-news-item {
	background: #fff;
	border: 1px solid var(--mt-line);
	padding: 28px 26px;
	text-decoration: none;
	display: block;
	transition: box-shadow 0.25s ease, transform 0.25s ease;
}
.mt-news-item:hover { transform: translateY(-3px); box-shadow: var(--mt-shadow); }
.mt-news-item time { font-size: 12px; letter-spacing: 0.1em; color: var(--mt-gold); display: block; margin-bottom: 10px; }
.mt-news-item h3 { font-size: 16px; margin: 0; line-height: 1.7; }

/* =========================================================================
   8. 商品アーカイブ／商品カード
   ========================================================================= */
.woocommerce .woocommerce-result-count,
.woocommerce .woocommerce-ordering { font-size: 13px; color: var(--mt-muted); }
.woocommerce .woocommerce-ordering select { padding: 10px 14px; border: 1px solid var(--mt-line); background: #fff; }

ul.products { display: grid !important; grid-template-columns: repeat(4, minmax(0, 1fr)) !important; gap: 34px !important; margin: 0 !important; padding: 0 !important; }
ul.products::before, ul.products::after { display: none !important; }
ul.products li.product {
	width: 100% !important;
	margin: 0 !important;
	float: none !important;
	background: #fff;
	border: 1px solid var(--mt-line);
	display: flex;
	flex-direction: column;
	transition: transform 0.3s ease, box-shadow 0.3s ease;
}
ul.products li.product:hover { transform: translateY(-4px); box-shadow: var(--mt-shadow); }
ul.products li.product .ct-media-container,
ul.products li.product a img,
ul.products li.product .woocommerce-loop-product__link img {
	width: 100%;
	display: block;
	margin: 0 !important;
	transition: transform 0.6s ease;
}
ul.products li.product:hover img { transform: scale(1.03); }
ul.products li.product > a { overflow: hidden; display: block; }

.mt-card-body { padding: 22px 22px 26px; display: flex; flex-direction: column; gap: 8px; flex: 1; }
.mt-card-cat {
	font-family: var(--mt-latin);
	font-size: 11px;
	letter-spacing: 0.24em;
	text-transform: uppercase;
	color: var(--mt-gold);
}
/* Blocksy が出すカードタイトル（h2）をデザインに合わせる */
ul.products li.product .mt-card-body .woocommerce-loop-product__title,
ul.products li.product .mt-card-body h2.woocommerce-loop-product__title,
.mt-card-title {
	font-family: var(--mt-serif) !important;
	font-size: 15.5px !important;
	line-height: 1.65 !important;
	color: var(--mt-ink) !important;
	margin: 0 !important;
	letter-spacing: 0.03em;
}
ul.products li.product .mt-card-body .woocommerce-loop-product__title a { color: var(--mt-ink); }
ul.products li.product .mt-card-body .woocommerce-loop-product__title a:hover { color: var(--mt-gold); }

/* カード内のカテゴリ表記は上部ラベルに一本化（Blocksy の entry-meta は重複するため非表示） */
ul.products li.product .mt-card-body .entry-meta,
ul.products li.product .mt-card-body .meta-categories { display: none !important; }
ul.products li.product .price {
	font-size: 16px !important;
	color: var(--mt-ink) !important;
	font-weight: 500;
	letter-spacing: 0.04em;
	margin: 4px 0 0 !important;
}
ul.products li.product .price del { color: var(--mt-muted); font-size: 13px; }
ul.products li.product .price ins { text-decoration: none; color: var(--mt-gold); }
ul.products li.product .button,
ul.products li.product .add_to_cart_button {
	margin: 14px 0 0 !important;
	width: 100%;
	padding: 13px 20px;
	background: #fff;
	color: var(--mt-ink);
	border: 1px solid var(--mt-line);
	font-size: 12px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	border-radius: var(--mt-radius);
}
ul.products li.product .button:hover { background: var(--mt-ink); color: #fff; border-color: var(--mt-ink); }
ul.products li.product .onsale,
.woocommerce span.onsale {
	background: var(--mt-gold);
	color: #fff;
	border-radius: 0;
	font-size: 11px;
	letter-spacing: 0.14em;
	padding: 6px 12px;
	min-height: auto;
	line-height: 1;
	top: 12px;
	left: 12px;
}
.mt-badge {
	position: absolute;
	top: 12px;
	right: 12px;
	z-index: 3;
	background: rgba(255, 255, 255, 0.94);
	color: var(--mt-ink);
	border: 1px solid var(--mt-gold-2);
	font-size: 10.5px;
	letter-spacing: 0.16em;
	padding: 5px 10px;
	text-transform: uppercase;
}
li.product .ct-media-container { position: relative; }

.woocommerce nav.woocommerce-pagination ul { border: none; display: flex; gap: 8px; justify-content: center; }
.woocommerce nav.woocommerce-pagination ul li { border: none; }
.woocommerce nav.woocommerce-pagination ul li a,
.woocommerce nav.woocommerce-pagination ul li span {
	border: 1px solid var(--mt-line) !important;
	padding: 10px 16px !important;
	color: var(--mt-ink);
}
.woocommerce nav.woocommerce-pagination ul li span.current { background: var(--mt-ink); color: #fff; border-color: var(--mt-ink) !important; }

/* アーカイブ見出し */
.mt-archive-head { text-align: center; padding: 56px 0 10px; }
.mt-archive-head .mt-eyebrow { margin-bottom: 14px; }
.mt-archive-head h1 {
	font-family: var(--mt-serif);
	font-size: clamp(24px, 3vw, 34px);
	letter-spacing: 0.08em;
	margin: 0 0 18px;
}
.mt-archive-head p { color: var(--mt-muted); max-width: 680px; margin: 0 auto; font-size: 14px; }
.mt-tax-note { font-size: 12.5px; color: var(--mt-muted); letter-spacing: 0.04em; }

/* =========================================================================
   9. 商品詳細
   ========================================================================= */
.single-product div.product .product-entry-wrapper,
.single-product div.product .product-entry-wrapper.is-width-constrained {
	display: grid !important;
	grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
	gap: 56px;
	align-items: start;
	max-width: var(--mt-container) !important;
	width: 100%;
	margin: 0 auto !important;
	padding: 44px 0 20px;
}
.single-product div.product .woocommerce-product-gallery { width: 100% !important; float: none !important; min-width: 0; }
.single-product div.product .summary { width: 100% !important; float: none !important; margin: 0 !important; min-width: 0; }
.single-product .ct-product-gallery-container,
.single-product .flexy-container,
.single-product .flexy,
.single-product .flexy-view { max-width: 100% !important; overflow: hidden; }
.single-product .flexy-items { max-width: 100%; }
.single-product .flexy-pills { max-width: 100%; overflow-x: auto; overflow-y: hidden; }
.single-product div.product .woocommerce-product-gallery__image img { border: 1px solid var(--mt-line); }
.single-product .flex-control-thumbs { display: grid; grid-template-columns: repeat(5, 1fr); gap: 10px; margin-top: 12px !important; }
.single-product .flex-control-thumbs li { width: 100% !important; margin: 0 !important; }
.single-product .flex-control-thumbs img { border: 1px solid var(--mt-line); }
.single-product .flex-control-thumbs img.flex-active { outline: 1px solid var(--mt-gold); }

/* 関連商品はスマホでも表示する（Blocksy の既定は非表示） */
.related.products.ct-hidden-sm,
.related.products.ct-hidden-md,
.upsells.products.ct-hidden-sm,
.upsells.products.ct-hidden-md {
	display: block !important;
}

.mt-product-head { position: sticky; top: 104px; }
.product_title.entry-title {
	font-family: var(--mt-serif) !important;
	font-size: clamp(22px, 2.4vw, 30px) !important;
	line-height: 1.55;
	letter-spacing: 0.05em;
	margin: 0 0 14px !important;
}
.mt-product-meta {
	display: flex;
	flex-wrap: wrap;
	gap: 16px;
	font-size: 12px;
	letter-spacing: 0.1em;
	color: var(--mt-muted);
	margin-bottom: 18px;
	padding-bottom: 18px;
	border-bottom: 1px solid var(--mt-line);
}
.single-product .summary .price {
	font-family: var(--mt-serif);
	font-size: 28px !important;
	color: var(--mt-ink) !important;
	letter-spacing: 0.04em;
	margin: 0 0 8px !important;
}
.single-product .summary .price del { font-size: 16px; color: var(--mt-muted); }
.single-product .summary .price ins { text-decoration: none; color: var(--mt-gold); }
.mt-price-note { font-size: 12px; color: var(--mt-muted); letter-spacing: 0.06em; margin-bottom: 22px; }

.single-product .woocommerce-product-details__short-description {
	font-size: 14px;
	color: var(--mt-ink-2);
	border-left: 2px solid var(--mt-gold-2);
	padding-left: 16px;
	margin-bottom: 24px;
}

/* バリエーション（色・サイズ）選択 — 大きなスウォッチボタン */
.single-product table.variations { border: none; margin-bottom: 22px; }
.single-product table.variations th.label { padding: 0 0 12px; vertical-align: top; }
.single-product table.variations th.label label {
	font-family: var(--mt-sans);
	font-size: 14px;
	font-weight: 500;
	letter-spacing: 0.12em;
	color: var(--mt-ink);
	display: block;
	margin: 0 0 12px;
}
.mt-swatches {
	display: flex;
	flex-wrap: wrap;
	gap: 8px;
	margin: 0 0 6px;
}
.mt-swatches__head {
	display: flex;
	align-items: baseline;
	flex-wrap: wrap;
	gap: 12px;
	width: 100%;
	margin: 0 0 10px;
}
.mt-swatches__title {
	font-family: var(--mt-sans);
	font-size: 16px;
	font-weight: 700;
	letter-spacing: 0.1em;
	color: var(--mt-ink);
}
.mt-selected-color {
	font-family: var(--mt-sans);
	font-size: 14.5px;
	font-weight: 500;
	letter-spacing: 0.04em;
	color: var(--mt-ink-2);
}
.mt-selected-color.is-chosen {
	color: var(--mt-gold);
	font-weight: 500;
}
.mt-swatches__native {
	position: absolute;
	width: 1px;
	height: 1px;
	overflow: hidden;
	clip: rect(0 0 0 0);
	white-space: nowrap;
}
.mt-swatch {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	min-height: 44px;
	padding: 9px 14px;
	background: #fff;
	border: 1px solid var(--mt-line);
	border-radius: var(--mt-radius);
	color: var(--mt-ink);
	font-family: var(--mt-sans);
	font-size: 13.5px;
	font-weight: 500;
	letter-spacing: 0.02em;
	line-height: 1.2;
	cursor: pointer;
	transition: border-color 0.2s ease, background 0.2s ease, color 0.2s ease, box-shadow 0.2s ease;
}
.mt-swatch:hover { border-color: var(--mt-gold); box-shadow: 0 4px 12px -8px rgba(16, 24, 32, 0.45); }
.mt-swatch.is-selected {
	background: var(--mt-ink);
	border-color: var(--mt-ink);
	color: #fff;
}
.mt-swatch.is-selected .mt-swatch__dot { box-shadow: 0 0 0 2px #fff inset; }
.mt-swatch.is-disabled {
	opacity: 0.35;
	cursor: not-allowed;
	text-decoration: line-through;
}
.mt-swatch__dot {
	width: 20px;
	height: 20px;
	border-radius: 50%;
	border: 1px solid rgba(16, 24, 32, 0.22);
	background: #e6e2dc;
	flex: 0 0 auto;
}
.mt-swatch__name { white-space: nowrap; }

/* サイズは中央寄せのコンパクトなボタンで */
.mt-swatches--size .mt-swatch { min-width: 64px; justify-content: center; min-height: 44px; }

.single-product .woocommerce-variation-price .price { font-size: 26px !important; }
.single-product .woocommerce-variation-availability { font-size: 14px; color: var(--mt-muted); }
.single-product .woocommerce-variation-add-to-cart { margin-top: 10px; }

@media (max-width: 600px) {
	.mt-swatches { gap: 8px; }
	.mt-swatch {
		min-height: 50px;
		padding: 12px 14px;
		font-size: 14.5px;
		flex: 1 1 calc(50% - 8px);
		justify-content: flex-start;
	}
	.mt-swatch__dot { width: 22px; height: 22px; }
	.mt-swatches--size .mt-swatch { flex: 0 0 auto; }
}

form.cart { display: flex; gap: 14px; align-items: stretch; flex-wrap: wrap; margin: 22px 0 0 !important; }
form.cart .quantity input.qty {
	width: 84px;
	height: 100%;
	min-height: 52px;
	border: 1px solid var(--mt-line);
	text-align: center;
	font-size: 15px;
}
form.cart .single_add_to_cart_button {
	flex: 1;
	min-width: 220px;
	min-height: 52px;
	background: var(--mt-ink);
	color: #fff;
	border: 1px solid var(--mt-ink);
	font-size: 13px;
	letter-spacing: 0.16em;
	text-transform: uppercase;
}
form.cart .single_add_to_cart_button:hover { background: var(--mt-gold); border-color: var(--mt-gold); }
.single-product .product_meta { font-size: 12.5px; color: var(--mt-muted); letter-spacing: 0.04em; margin-top: 22px; }
.single-product .product_meta a { color: var(--mt-gold); }

.woocommerce-tabs { margin-top: 76px !important; }
.woocommerce-tabs ul.tabs { padding: 0 !important; margin: 0 0 34px !important; border-bottom: 1px solid var(--mt-line); display: flex; gap: 34px; }
.woocommerce-tabs ul.tabs::before { display: none !important; }
.woocommerce-tabs ul.tabs li {
	background: none !important;
	border: none !important;
	border-radius: 0 !important;
	margin: 0 !important;
	padding: 0 !important;
	box-shadow: none !important;
}
.woocommerce-tabs ul.tabs li a {
	font-family: var(--mt-serif);
	font-size: 15px;
	letter-spacing: 0.1em;
	color: var(--mt-ink) !important;
	padding: 14px 2px !important;
}
.woocommerce-tabs ul.tabs li.active a { color: var(--mt-gold) !important; box-shadow: inset 0 -1px 0 var(--mt-gold); }
.woocommerce-tabs .panel h2 { display: none; }
.woocommerce-tabs .panel { color: var(--mt-ink-2); font-size: 14.5px; }

table.woocommerce-product-attributes,
.mt-spec-table { width: 100%; border-collapse: collapse; margin: 18px 0 8px; font-size: 14px; }
table.woocommerce-product-attributes th,
table.woocommerce-product-attributes td,
.mt-spec-table th,
.mt-spec-table td {
	border: none;
	border-bottom: 1px solid var(--mt-line);
	padding: 14px 4px;
	text-align: left;
	vertical-align: top;
	background: none !important;
}
table.woocommerce-product-attributes th,
.mt-spec-table th {
	width: 180px;
	color: var(--mt-ink);
	font-weight: 500;
	letter-spacing: 0.06em;
}
table.woocommerce-product-attributes td p { margin: 0; }

.related.products, .upsells.products { margin-top: 80px; }
.related.products > h2, .upsells.products > h2 {
	font-family: var(--mt-serif);
	font-size: 22px;
	letter-spacing: 0.1em;
	text-align: center;
	margin-bottom: 34px;
}

/* =========================================================================
   10. カート／チェックアウト／マイアカウント
   ========================================================================= */
.woocommerce table.shop_table { border: 1px solid var(--mt-line); border-radius: 0; border-collapse: collapse; }
.woocommerce table.shop_table th,
.woocommerce table.shop_table td { border-color: var(--mt-line); padding: 16px 14px; }
.woocommerce table.shop_table thead th {
	font-family: var(--mt-sans);
	font-size: 12.5px;
	letter-spacing: 0.12em;
	text-transform: uppercase;
	color: var(--mt-ink);
	background: var(--mt-cream);
}
.woocommerce .cart_totals h2, .woocommerce #order_review_heading {
	font-family: var(--mt-serif);
	font-size: 20px;
	letter-spacing: 0.08em;
}
.wc-block-components-button,
.wc-block-cart__submit-button,
.wc-block-components-checkout-place-order-button {
	background: var(--mt-ink) !important;
	border-radius: var(--mt-radius) !important;
	letter-spacing: 0.14em;
	text-transform: uppercase;
	font-size: 13px;
}
.wc-block-cart__submit-button:hover,
.wc-block-components-checkout-place-order-button:hover { background: var(--mt-gold) !important; }
.wp-block-woocommerce-cart, .wp-block-woocommerce-checkout { font-family: var(--mt-sans); }
.wc-block-components-title, .wc-block-components-panel__button { font-family: var(--mt-serif); letter-spacing: 0.06em; }

.mt-notice-band {
	background: var(--mt-cream);
	border: 1px solid var(--mt-line);
	padding: 16px 20px;
	font-size: 13px;
	color: var(--mt-ink-2);
	letter-spacing: 0.03em;
	margin-bottom: 26px;
}
.mt-notice-band strong { color: var(--mt-ink); }

.woocommerce-info, .woocommerce-message, .woocommerce-error {
	border-top-color: var(--mt-gold) !important;
	background: var(--mt-cream) !important;
	color: var(--mt-ink) !important;
	font-size: 14px;
}
.woocommerce-info::before, .woocommerce-message::before { color: var(--mt-gold) !important; }
.woocommerce form .form-row input.input-text,
.woocommerce form .form-row textarea,
.woocommerce form .form-row select,
.woocommerce-page form .form-row input.input-text {
	border: 1px solid var(--mt-line);
	padding: 13px 14px;
	font-size: 14px;
	background: #fff;
}
.woocommerce form .form-row label { font-size: 13px; letter-spacing: 0.04em; color: var(--mt-ink); }

/* =========================================================================
   11. 固定ページ・投稿
   ========================================================================= */
.mt-page-head {
	background: var(--mt-cream);
	border-bottom: 1px solid var(--mt-line);
	padding: 64px 0 56px;
	text-align: center;
}
.mt-page-head h1 {
	font-family: var(--mt-serif);
	font-size: clamp(26px, 3.2vw, 38px);
	letter-spacing: 0.1em;
	margin: 0 0 14px;
}
.mt-page-head .mt-eyebrow { margin-bottom: 14px; }
.entry-content h3 { margin-top: 46px; }
.entry-content h3:first-child { margin-top: 0; }
.entry-content h3::before {
	content: "";
	display: inline-block;
	width: 22px;
	height: 1px;
	background: var(--mt-gold);
	vertical-align: middle;
	margin-right: 12px;
}
/* h4（商品説明内の小見出し） */
.entry-content h4 { margin-top: 30px; font-size: 15.5px; letter-spacing: 0.05em; }
.entry-content h4:first-child { margin-top: 0; }
.entry-content p { margin-bottom: 1.5em; }
.entry-content table { width: 100%; border-collapse: collapse; font-size: 14.5px; }
.entry-content table th, .entry-content table td { border-bottom: 1px solid var(--mt-line); padding: 14px 10px; text-align: left; }
.entry-content table th { width: 200px; color: var(--mt-ink); font-weight: 500; }
.entry-content a { color: var(--mt-gold); text-decoration: underline; text-underline-offset: 3px; }

.mt-legal-note {
	background: var(--mt-cream);
	border: 1px solid var(--mt-line);
	padding: 24px 26px;
	font-size: 13.5px;
	color: var(--mt-ink-2);
}
.mt-legal-note dt { font-weight: 500; color: var(--mt-ink); }

/* =========================================================================
   12. フッター
   ========================================================================= */
.ct-footer { background: var(--mt-ink); color: rgba(255, 255, 255, 0.78); }
.ct-footer .ct-footer-copyright { display: none; }

.mt-footer { background: var(--mt-ink); color: rgba(255, 255, 255, 0.76); padding: 72px 0 0; font-size: 13.5px; }
.mt-footer a { color: rgba(255, 255, 255, 0.76); text-decoration: none; }
.mt-footer a:hover { color: var(--mt-gold-2); }
.mt-footer__grid { display: grid; grid-template-columns: 1.5fr 1fr 1fr 1.2fr; gap: 44px; }
.mt-footer__brand .logo {
	font-family: var(--mt-serif);
	font-size: 20px;
	letter-spacing: 0.18em;
	color: #fff;
	text-transform: uppercase;
	display: block;
	margin-bottom: 16px;
}
.mt-footer__brand p { margin: 0 0 6px; line-height: 1.9; }
.mt-footer h4 {
	font-family: var(--mt-serif);
	font-size: 14px;
	letter-spacing: 0.16em;
	color: #fff;
	margin: 0 0 18px;
	text-transform: uppercase;
}
.mt-footer ul { list-style: none; margin: 0; padding: 0; }
.mt-footer li { margin-bottom: 11px; }
.mt-footer__bottom {
	margin-top: 56px;
	border-top: 1px solid rgba(255, 255, 255, 0.14);
	padding: 26px 0 30px;
	display: flex;
	justify-content: space-between;
	gap: 18px;
	flex-wrap: wrap;
	font-size: 12px;
	letter-spacing: 0.04em;
	color: rgba(255, 255, 255, 0.52);
}
.mt-footer__bottom .reg { letter-spacing: 0.02em; }

/* =========================================================================
   13. レスポンシブ
   ========================================================================= */
@media (max-width: 1024px) {
	.mt-hero__inner, .mt-story { grid-template-columns: 1fr; gap: 44px; }
	.mt-hero { padding: 56px 0 68px; }
	.mt-cats { grid-template-columns: repeat(2, 1fr); }
	.mt-band__grid, .mt-info-grid, .mt-news-list { grid-template-columns: 1fr 1fr; }
	.mt-footer__grid { grid-template-columns: 1fr 1fr; }
	ul.products { grid-template-columns: repeat(2, minmax(0, 1fr)) !important; gap: 22px !important; }
	.single-product div.product .product-entry-wrapper,
	.single-product div.product .product-entry-wrapper.is-width-constrained {
		grid-template-columns: minmax(0, 1fr) !important;
		gap: 30px;
		padding-top: 26px;
	}
	.mt-product-head { position: static; }
	.mt-section { padding: 42px 0; }
}

@media (max-width: 600px) {
	body { font-size: 14.5px; line-height: 1.9; }
	.mt-hero__media::after { display: none; }
	.mt-hero__badge { left: 12px; bottom: 12px; padding: 10px 14px; font-size: 11px; }
	.mt-band__grid, .mt-info-grid, .mt-news-list, .mt-footer__grid { grid-template-columns: 1fr; }
	.mt-cats { gap: 14px; }
	ul.products { gap: 14px !important; }
	.mt-card-body { padding: 14px 14px 18px; }
	.mt-card-title { font-size: 14px !important; }
	.mt-hero__actions .mt-btn { width: 100%; }
	.mt-footer { padding-top: 52px; }
}

/* =========================================================================
   9.5 パソコンソフト分類：商品ページの主画像を 800×800 で表示
   （mt-wide-gallery は functions.php が該当カテゴリの商品にのみ付与）
   ========================================================================= */

/* 主画像を正方形（1:1）で表示する。
   Blocksy は WooCommerce のサムネイル設定（600×800 = 3:4）に合わせて
   各ギャラリー画像へ aspect-ratio: 3/4 をインライン指定するため、
   1:1 の商品画像が左右にトリミングされてしまう（＝拡大表示に見える）。
   インラインstyleを打ち消すために !important を使用する。 */
.single-product.mt-wide-gallery div.product .woocommerce-product-gallery .flexy-item img,
.single-product.mt-wide-gallery div.product .woocommerce-product-gallery__image img,
.single-product.mt-wide-gallery div.product .woocommerce-product-gallery .ct-media-container {
	aspect-ratio: 1 / 1 !important;
}

/* 画像は全体を表示する（見切れ防止） */
.single-product.mt-wide-gallery div.product .woocommerce-product-gallery img {
	object-fit: contain !important;
}

/* 在庫数の表示を隠す（在庫あり）。
   在庫切れ（.stock.out-of-stock）は理由を伝える必要があるので残す。 */
.single-product.mt-wide-gallery div.product .stock.in-stock {
	display: none;
}

/* 一覧（商品カード）の画像も全体を表示する。
   Blocksy は 4:3 のコンテナに object-fit: cover で表示するため、
   正方形の商品画像が上下にトリミングされる。
   パソコンソフト分類の商品カードのみ 1:1 + contain にする。 */
ul.products li.product.product_cat-pc-software img {
	aspect-ratio: 1 / 1 !important;
	-o-object-fit: contain;
	object-fit: contain !important;
}



/* =========================================================================
   パソコンソフト分類：6列表示に合わせたコンパクトカード
   カード幅が約200pxになるため、売りタイトルが長くなりすぎる。
   タイトルを3行で切り上げ、余白・字サイズ・ボタンを縮めて卡の高さを抑える。
   ========================================================================= */
body.tax-product_cat.term-pc-software ul.products li.product .mt-card-body,
body.mt-wide-gallery .related.products ul.products li.product .mt-card-body,
body.mt-wide-gallery .upsells.products ul.products li.product .mt-card-body {
	padding: 12px 12px 14px;
	gap: 5px;
}

body.tax-product_cat.term-pc-software ul.products li.product .mt-card-cat,
body.mt-wide-gallery .related.products ul.products li.product .mt-card-cat,
body.mt-wide-gallery .upsells.products ul.products li.product .mt-card-cat {
	font-size: 9.5px;
	letter-spacing: 0.16em;
}

body.tax-product_cat.term-pc-software ul.products li.product .woocommerce-loop-product__title,
body.tax-product_cat.term-pc-software ul.products li.product h2.woocommerce-loop-product__title,
body.tax-product_cat.term-pc-software ul.products li.product .mt-card-title,
body.mt-wide-gallery .related.products ul.products li.product .woocommerce-loop-product__title,
body.mt-wide-gallery .related.products ul.products li.product h2.woocommerce-loop-product__title,
body.mt-wide-gallery .related.products ul.products li.product .mt-card-title,
body.mt-wide-gallery .upsells.products ul.products li.product .woocommerce-loop-product__title,
body.mt-wide-gallery .upsells.products ul.products li.product h2.woocommerce-loop-product__title,
body.mt-wide-gallery .upsells.products ul.products li.product .mt-card-title {
	font-size: 12.5px !important;
	line-height: 1.5 !important;
	display: -webkit-box;
	-webkit-line-clamp: 3;
	-webkit-box-orient: vertical;
	overflow: hidden;
}

body.tax-product_cat.term-pc-software ul.products li.product .price,
body.mt-wide-gallery .related.products ul.products li.product .price,
body.mt-wide-gallery .upsells.products ul.products li.product .price {
	font-size: 13.5px !important;
	margin: 2px 0 0 !important;
}

body.tax-product_cat.term-pc-software ul.products li.product .button,
body.tax-product_cat.term-pc-software ul.products li.product .add_to_cart_button,
body.mt-wide-gallery .related.products ul.products li.product .button,
body.mt-wide-gallery .related.products ul.products li.product .add_to_cart_button,
body.mt-wide-gallery .upsells.products ul.products li.product .button,
body.mt-wide-gallery .upsells.products ul.products li.product .add_to_cart_button {
	margin: 8px 0 0 !important;
	padding: 9px 10px;
	font-size: 10.5px;
	letter-spacing: 0.06em;
}

/* 800px の画像列 + 商品情報列を並べるため、十分な画面幅のときだけ適用 */
@media (min-width: 1360px) {
	.single-product.mt-wide-gallery div.product .product-entry-wrapper,
	.single-product.mt-wide-gallery div.product .product-entry-wrapper.is-width-constrained {
		max-width: 1400px !important;
		grid-template-columns: 800px minmax(0, 1fr) !important;
	}
	.single-product.mt-wide-gallery div.product .woocommerce-product-gallery__image img {
		width: 800px;
		height: 800px;
		max-width: 100%;
	}
}

/* =========================================================================
   サービス特徴（信頼バッジ）――トップページ
   ========================================================================= */
.mt-features {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 34px;
	text-align: center;
}
.mt-feature__icon {
	width: 64px;
	height: 64px;
	margin: 0 auto 18px;
	border: 1px solid var(--mt-gold-2);
	border-radius: 50%;
	display: flex;
	align-items: center;
	justify-content: center;
	color: var(--mt-gold);
	background: #fff;
	transition: background 0.25s ease, color 0.25s ease;
}
.mt-feature__icon svg { width: 26px; height: 26px; display: block; }
.mt-feature:hover .mt-feature__icon { background: var(--mt-gold); color: #fff; }
.mt-feature h3 {
	font-family: var(--mt-serif);
	font-size: 15.5px;
	letter-spacing: 0.06em;
	color: var(--mt-ink);
	margin: 0 0 10px;
}
.mt-feature p {
	font-size: 13px;
	line-height: 1.9;
	color: var(--mt-muted);
	margin: 0 auto;
	max-width: 250px;
}
.mt-features__contact {
	margin-top: 46px;
	padding-top: 30px;
	border-top: 1px solid var(--mt-line);
	text-align: center;
	font-size: 13.5px;
	letter-spacing: 0.04em;
	color: var(--mt-muted);
}
.mt-features__contact a { color: var(--mt-gold); text-decoration: none; }
.mt-features__contact a:hover { text-decoration: underline; }
.mt-features__contact span { margin: 0 10px; }

@media (max-width: 1024px) {
	.mt-features { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 30px; }
}
@media (max-width: 600px) {
	.mt-features { grid-template-columns: 1fr; gap: 26px; }
	.mt-features__contact span { display: block; margin: 6px 0; }
}

/* =========================================================================
   よくあるご質問（Q&A）
   ========================================================================= */
.mt-faq { margin: 0 0 10px; }
.mt-faq dt {
	position: relative;
	font-family: var(--mt-serif);
	font-size: 15px;
	line-height: 1.7;
	color: var(--mt-ink);
	padding: 20px 0 0 30px;
	margin-top: 4px;
	border-top: 1px solid var(--mt-line);
}
.mt-faq dt::before {
	content: "Q";
	position: absolute;
	left: 0;
	top: 20px;
	font-family: var(--mt-latin);
	font-size: 15px;
	color: var(--mt-gold);
}
.mt-faq dd {
	position: relative;
	margin: 10px 0 4px 30px;
	font-size: 13.5px;
	line-height: 1.95;
	color: var(--mt-muted);
}
.mt-faq dd::before {
	content: "A";
	position: absolute;
	left: -30px;
	top: 0;
	font-family: var(--mt-latin);
	font-size: 15px;
	color: var(--mt-gold-2);
}
.mt-faq dd + dd { margin-top: 6px; }

/* =========================================================================
   トップページ再設計用コンポーネント
   ========================================================================= */

/* --- 製品ラインアップ --- */
.mt-lineup {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 34px;
}
.mt-lineup__card {
	display: block;
	padding: 38px 34px;
	border: 1px solid var(--mt-line);
	background: #fff;
	text-decoration: none;
	transition: transform 0.25s ease, box-shadow 0.25s ease, border-color 0.25s ease;
}
.mt-lineup__card:hover {
	transform: translateY(-4px);
	box-shadow: var(--mt-shadow);
	border-color: var(--mt-gold-2);
}
.mt-lineup__en {
	font-family: var(--mt-latin);
	font-size: 11.5px;
	letter-spacing: 0.28em;
	text-transform: uppercase;
	color: var(--mt-gold);
	display: block;
	margin-bottom: 14px;
}
.mt-lineup__title {
	font-family: var(--mt-serif);
	font-size: 22px;
	letter-spacing: 0.04em;
	color: var(--mt-ink);
	margin: 0 0 12px;
}
.mt-lineup__desc {
	font-size: 13.5px;
	line-height: 1.9;
	color: var(--mt-muted);
	margin: 0 0 20px;
}
.mt-lineup__meta {
	font-size: 12px;
	letter-spacing: 0.1em;
	color: var(--mt-gold);
}

/* --- ご利用の流れ --- */
.mt-steps {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 34px;
}
.mt-step { text-align: center; }
.mt-step__num {
	display: block;
	font-family: var(--mt-latin);
	font-size: 32px;
	line-height: 1;
	color: var(--mt-gold-2);
	margin-bottom: 16px;
}
.mt-step__title {
	font-family: var(--mt-serif);
	font-size: 15.5px;
	letter-spacing: 0.05em;
	color: var(--mt-ink);
	margin: 0 0 10px;
}
.mt-step__desc {
	font-size: 13px;
	line-height: 1.9;
	color: var(--mt-muted);
	margin: 0 auto;
	max-width: 280px;
}

/* --- CTA --- */
.mt-cta {
	background: var(--mt-cream);
	border: 1px solid var(--mt-line);
	text-align: center;
	padding: 54px 30px;
}
.mt-cta h2 {
	font-family: var(--mt-serif);
	font-size: clamp(20px, 2.2vw, 26px);
	letter-spacing: 0.06em;
	color: var(--mt-ink);
	margin: 0 0 14px;
}
.mt-cta p {
	font-size: 14px;
	line-height: 1.95;
	color: var(--mt-muted);
	margin: 0 auto 26px;
	max-width: 640px;
}
.mt-cta__actions { display: flex; gap: 14px; justify-content: center; flex-wrap: wrap; }

@media (max-width: 1024px) {
	.mt-lineup, .mt-steps { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 26px; }
	.mt-lineup__card { padding: 30px 26px; }
}
@media (max-width: 600px) {
	.mt-lineup, .mt-steps { grid-template-columns: 1fr; gap: 22px; }
}

/* =========================================================================
   ヘッダー吸頂（スクロールしても固定）
   ========================================================================= */
/* body の overflow-x:hidden は position:sticky を無効化する。
   clip はスクロールコンテナを作らないため sticky が機能する。 */
body { overflow-x: clip; }

:root { --mt-topbar-h: 0px; }

/* 上段の細い帯（カート／言語切替）はスクロールで流れる */
.mt-topbar {
	position: relative;
	z-index: 60;
}

/* メインヘッダー（2 行）を画面上部に固定。
   Blocksy 本体の #header{position:relative; z-index:50} を
   上書きする必要があるため ID + クラスで指定する。 */
#header.ct-header {
	position: sticky;
	top: 0;
	z-index: 99;
}


/* =========================================================================
   ヘッダー 2 行レイアウト
   -------------------------------------------------------------------------
   1 行目 (middle-row) : ロゴ ＋ 検索ボックス
   2 行目 (bottom-row) : カテゴリナビゲーション
   ※ 構造は Blocksy のヘッダービルダー（header_placements）で設定。
   ========================================================================= */

/* ---- 1 行目：ロゴ ＋ 検索ボックス ---- */
.ct-header [data-row="middle"] {
	--height: 84px !important;
}
#header [data-row="middle"] > .ct-container {
	min-height: 84px;
	align-items: center;
}
.ct-header [data-row="middle"] [data-column="start"] {
	flex: 1 1 auto;
	min-width: 0;
}
.ct-header [data-row="middle"] [data-column="end"] {
	flex: 0 0 auto;
	margin-inline-start: 28px;
}
.mt-header-search { display: flex; align-items: center; }

/* ---- 2 行目：カテゴリナビゲーションバー ----
   ※ Blocksy 本体に
        #header [data-row] { border-top: var(--theme-border-top); ... }
     があるため、ID を含むセレクタで上書きする。 */
#header [data-row="bottom"] {
	--height: 48px !important;
	background: #fff;
	border-top: 1px solid var(--mt-line);
	border-bottom: none;
}
#header [data-row="bottom"] > .ct-container {
	min-height: 48px;
	align-items: center;
	justify-content: center;
}
#header [data-row="bottom"] [data-column="start"] {
	flex: 1 1 100%;
	justify-content: center;
}
#header [data-row="bottom"] [data-items="primary"] {
	width: 100%;
	justify-content: center;
}
/* 2 行目のメニュー項目を 48px のバーにぴったり収める */
#header [data-row="bottom"] .menu > li { height: 48px; }
#header [data-row="bottom"] .menu > li > a.ct-menu-link {
	display: flex;
	align-items: center;
	height: 48px;
	padding-block: 0;
}


/* =========================================================================
   ヘッダー検索ボックス
   ========================================================================= */
.mt-header-search .mt-nav-search { margin: 0; }
.mt-nav-search {
	display: flex;
	align-items: center;
	height: 44px;
	padding: 0 4px 0 16px;
	border: 1px solid var(--mt-line);
	border-radius: 6px;
	background: #fff;
	transition: border-color 0.2s ease;
}
.mt-nav-search:focus-within { border-color: var(--mt-gold-2); }
.mt-nav-search input[type="search"] {
	/* 画面幅に応じて伸縮（最小 260px / 最大 460px） */
	width: clamp(260px, 27vw, 460px);
	height: 100%;
	border: none;
	background: transparent;
	outline: none;
	font-family: var(--mt-sans);
	font-size: 13px;
	letter-spacing: 0.02em;
	color: var(--mt-ink);
	padding: 0;
}
.mt-nav-search input[type="search"]::placeholder { color: var(--mt-muted); }

/* 送信ボタン：塗り＋アイコン＋「検索」ラベル */
.mt-nav-search button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	flex: 0 0 auto;
	gap: 6px;
	height: 34px;
	margin-inline-start: 10px;
	padding: 0 15px;
	border: 1px solid var(--mt-gold);
	border-radius: 4px;
	background: var(--mt-gold);
	color: #fff;
	font-family: var(--mt-sans);
	font-size: 12.5px;
	font-weight: 600;
	letter-spacing: 0.1em;
	line-height: 1;
	white-space: nowrap;
	cursor: pointer;
	transition: background-color 0.2s ease, border-color 0.2s ease;
}
.mt-nav-search button:hover {
	background: var(--mt-ink);
	border-color: var(--mt-ink);
	color: #fff;
}
.mt-nav-search button svg { width: 15px; height: 15px; flex: 0 0 auto; }

/* 中間幅では区切りと会員メニューの間隔を詰める
   （検索ボックス本体は clamp() で自動調整される） */
@media (min-width: 1001px) and (max-width: 1300px) {
	.ct-header [data-row="middle"] [data-column="end"] { margin-inline-start: 18px; }
}

/* ---- 会員メニュー（会員登録 ／ ログイン ／ マイページ） ---- */
.mt-account {
	display: flex;
	align-items: center;
	gap: 14px;
	white-space: nowrap;
	/* 検索ボックスとの間隔は Blocksy がヘッダー要素間に自動付与する
	   マージン（10px 前後）で確保されるため、ここでは指定しない。 */
}
.mt-account__link {
	font-size: 13px;
	font-weight: 600;
	letter-spacing: 0.07em;
	color: var(--mt-ink);
	text-decoration: none;
	transition: color 0.2s ease;
}
.mt-account__link:hover { color: var(--mt-gold); }
.mt-account__divider {
	width: 1px;
	height: 14px;
	background: var(--mt-line);
}
/* ログイン済み：アイコン ＋ ラベルの縦並び */
.mt-account__item {
	display: flex;
	flex-direction: column;
	align-items: center;
	gap: 4px;
	color: var(--mt-ink);
	text-decoration: none;
	line-height: 1;
	transition: color 0.2s ease;
}
.mt-account__item:hover { color: var(--mt-gold); }
.mt-account__icon { display: flex; }
.mt-account__icon svg { width: 22px; height: 22px; }
.mt-account__label {
	font-size: 10.5px;
	font-weight: 600;
	letter-spacing: 0.06em;
}

@media (min-width: 1001px) and (max-width: 1300px) {
	.mt-account { gap: 10px; }
	.mt-account__link { font-size: 12px; letter-spacing: 0.04em; }
}

/* ---- モバイル：オフキャンバスメニュー内の検索ボックス ---- */
@media (max-width: 1000px) {
	.ct-header .mobile-menu .mt-nav-search-li {
		display: block;
		margin: 18px 0 6px;
		width: 100%;
	}
	.ct-header .mobile-menu .mt-nav-search {
		height: 46px;
		width: 100%;
		padding: 0 4px 0 14px;
	}
	.ct-header .mobile-menu .mt-nav-search button {
		height: 36px;
		margin-inline-start: 8px;
		padding: 0 13px;
	}
	.ct-header .mobile-menu .mt-nav-search input[type="search"] {
		flex: 1 1 auto;
		width: auto;
		min-width: 0;
		font-size: 14px;
	}
}

/* =========================================================================
   Office 2024 バナー
   -------------------------------------------------------------------------
   ヒーローの直下に置く横長プロモーション。
   左：商品ビジュアル（白背景の商品画像を multiply でクリーム地に馴染ませる）
   右：見出し・本文・新機能タグ・CTA
   ========================================================================= */
/* 背景・枠・角丸は「セクション」側に持たせる。
   .mt-banner は他の .mt-section とまったく同じバンド幅（min(1290px, 90%)）に
   なるため、これでサイト全体と幅が揃う。
   中の .ct-container が max-width:1200px でセンタリングするので、
   1440px では左右 45px が内側の余白になる。 */
.mt-banner {
	position: relative;
	/* 上方向の余白は Blocksy の .ct-container-full（padding-top: 60px）で
	   すでに確保されているため、ここでは追加しない。
	   ブロックを上に詰めたいときはこの margin を調整する。 */
	margin-block-start: 0;
	padding-block: 44px;
	/* バンド幅が 1200px を超える分だけ内側に余白を取ることで、
	   中の .ct-container（max-width:1200px）とサイト全体の内容幅を完全に揃える。
	   バンド幅が 1200px 以下のときは最小 24px の内側余白だけ確保する。
	   ※ border ではなく inset の box-shadow を使うことで、
	     枠の 1px が内容幅を削らないようにしている。 */
	padding-inline: max(24px, calc((min(1290px, 90vw) - 1200px) / 2));
	background: linear-gradient(135deg, #faf7f2 0%, #f2ece2 100%);
	box-shadow: inset 0 0 0 1px var(--mt-line);
	border-radius: var(--mt-radius);
	overflow: hidden;
}
/* 上端のアクセントライン */
.mt-banner::before {
	content: "";
	position: absolute;
	inset: 0 0 auto 0;
	height: 3px;
	background: linear-gradient(90deg, var(--mt-gold) 0%, var(--mt-gold-2) 55%, var(--mt-sand) 100%);
}

/* カード（＝スライドの中身）はレイアウト専用。背景と枠はセクション側にある。 */
.mt-banner__card {
	display: grid;
	/* 画像カラムは 400px。商品ビジュアルの左端がロゴや商品グリッドと
	   同じ位置（コンテナ左端）に揃う。 */
	grid-template-columns: minmax(0, 400px) minmax(0, 1fr);
	align-items: center;
	gap: 52px;
}

.mt-banner__media {
	display: flex;
	justify-content: center;
	align-items: center;
	gap: 16px;
}
.mt-banner__media img {
	display: block;
	width: 100%;
	min-width: 0;
	max-width: 100%;
	height: auto;
	mix-blend-mode: multiply; /* 白背景をクリーム地に溶け込ませる */
}
/* 商品ビジュアルが 2 枚並ぶときは折り返さず半分ずつ表示する
   （2 × (50% - 8px) + gap 16px = 100%） */
.mt-banner__media img:not(:only-child) {
	flex: 0 1 auto;
	max-width: calc(50% - 8px);
}

.mt-banner__eyebrow {
	display: block;
	margin-bottom: 12px;
	font-size: 11px;
	font-weight: 600;
	letter-spacing: 0.22em;
	text-transform: uppercase;
	color: var(--mt-gold);
}
.mt-banner__title {
	margin: 0 0 16px;
	font-family: var(--mt-serif);
	font-size: 42px;
	font-weight: 600;
	line-height: 1.15;
	letter-spacing: 0.02em;
	color: var(--mt-ink);
}
.mt-banner__lead {
	margin: 0 0 22px;
	max-width: 62ch;
	font-size: 14px;
	line-height: 2;
	color: var(--mt-ink-2);
}
.mt-banner__points {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 0 0 30px;
	padding: 0;
	list-style: none;
}
.mt-banner__points li {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	padding: 8px 15px;
	background: #fff;
	border: 1px solid var(--mt-line);
	font-size: 12px;
	letter-spacing: 0.04em;
	color: var(--mt-ink-2);
}
.mt-banner__points li::before {
	content: "";
	flex: 0 0 auto;
	width: 5px;
	height: 5px;
	border-radius: 50%;
	background: var(--mt-gold);
}
.mt-banner__actions {
	display: flex;
	align-items: center;
	flex-wrap: wrap;
	gap: 12px 24px;
}

@media (max-width: 1000px) {
	.mt-banner {
		margin-block-start: 0;
		padding-block: 32px 36px;
		padding-inline: 24px;
	}
	.mt-banner__card {
		grid-template-columns: minmax(0, 1fr);
		gap: 24px;
	}
	.mt-banner__media img:only-child { max-width: 230px; }
	.mt-banner__title { font-size: 32px; }
	.mt-banner__lead { font-size: 13.5px; line-height: 1.95; }
}

/* =========================================================================
   バナー スライダー（.mt-slider）
   -------------------------------------------------------------------------
   JS が有効なときだけ矢印・ドットを表示する（is-ready を付与）。
   JS 無効時は 1 枚目のバナーだけが見える。
   ========================================================================= */
.mt-slider__viewport {
	position: relative;
	overflow: hidden;
	border-radius: var(--mt-radius);
}
.mt-slider__track {
	display: flex;
	align-items: stretch;
	transition: transform 0.55s cubic-bezier(0.4, 0, 0.2, 1);
	will-change: transform;
}
.mt-slide {
	display: flex;
	flex: 0 0 100%;
	min-width: 0;
}
/* 高さの違うスライドでもカードの高さを揃える */
.mt-slide > .mt-banner__card { flex: 1 1 auto; width: 100%; }

/* 矢印（JS 有効時のみ） */
.mt-slider__arrow {
	display: none;
	position: absolute;
	top: 50%;
	z-index: 3;
	align-items: center;
	justify-content: center;
	width: 44px;
	height: 44px;
	margin-top: -22px;
	padding: 0;
	border: 1px solid var(--mt-line);
	border-radius: 50%;
	background: rgba(255, 255, 255, 0.94);
	color: var(--mt-ink);
	cursor: pointer;
	transition: background-color 0.2s ease, color 0.2s ease, border-color 0.2s ease;
}
.mt-slider.is-ready .mt-slider__arrow { display: flex; }
.mt-slider__arrow svg { width: 18px; height: 18px; }
.mt-slider__arrow:hover { background: var(--mt-gold); border-color: var(--mt-gold); color: #fff; }
.mt-slider__arrow:focus-visible { outline: 2px solid var(--mt-gold); outline-offset: 2px; }
.mt-slider__arrow--prev { left: 16px; }
.mt-slider__arrow--next { right: 16px; }

/* ドット（JS 有効時のみ） */
.mt-slider__dots {
	display: none;
	align-items: center;
	justify-content: center;
	gap: 10px;
	margin-top: 20px;
}
.mt-slider.is-ready .mt-slider__dots { display: flex; }
.mt-slider__dot {
	width: 9px;
	height: 9px;
	padding: 0;
	border: none;
	border-radius: 999px;
	background: var(--mt-line);
	cursor: pointer;
	transition: width 0.25s ease, background-color 0.25s ease;
}
.mt-slider__dot:hover { background: var(--mt-gold-2); }
.mt-slider__dot.is-active { width: 26px; background: var(--mt-gold); }
.mt-slider__dot:focus-visible { outline: 2px solid var(--mt-gold); outline-offset: 2px; }

/* スライドが 1 枚だけなら操作 UI は不要 */
.mt-slider.is-single .mt-slider__arrow,
.mt-slider.is-single .mt-slider__dots { display: none; }

@media (max-width: 1000px) {
	.mt-slider__arrow { width: 38px; height: 38px; margin-top: -19px; }
	.mt-slider__arrow svg { width: 16px; height: 16px; }
	.mt-slider__arrow--prev { left: 8px; }
	.mt-slider__arrow--next { right: 8px; }
	.mt-slider__dots { margin-top: 16px; }
}
@media (prefers-reduced-motion: reduce) {
	.mt-slider__track { transition: none; }
}

/* =========================================================================
   決済方法（チェックアウト）
   -------------------------------------------------------------------------
   各支払い方法をカード状にし、選択中のものはゴールドの枠＋淡いクリーム地で
   はっきり分かるようにする。色はサイトのアクセント（--mt-gold）を使用。
   ========================================================================= */
#payment { background: transparent; padding: 0; }

#payment ul.wc_payment_methods {
	margin: 0 0 28px;
	padding: 0;
	list-style: none;
	border: none;
}

#payment ul.wc_payment_methods li.wc_payment_method {
	position: relative;
	margin: 0 0 12px;
	padding: 18px 20px 18px 50px;
	background: #fff;
	border: 1px solid var(--mt-line) !important;
	border-radius: var(--mt-radius);
	transition: border-color 0.2s ease, background-color 0.2s ease, box-shadow 0.2s ease;
}

/* 選択中：ゴールドの枠 ＋ 淡いクリーム地 */
#payment ul.wc_payment_methods li.wc_payment_method:has(input.input-radio:checked) {
	border-color: var(--mt-gold) !important;
	background: var(--mt-cream);
	box-shadow: inset 0 0 0 1px var(--mt-gold);
}

/* 支払い方法名 */
#payment ul.wc_payment_methods li.wc_payment_method label {
	display: block;
	margin: 0;
	padding: 0;
	background: none;
	font-size: 14.5px;
	font-weight: 600;
	letter-spacing: 0.04em;
	line-height: 1.5;
	color: var(--mt-ink);
	cursor: pointer;
}

/* ラジオ印 */
#payment ul.wc_payment_methods li.wc_payment_method label::before {
	content: "";
	position: absolute;
	left: 20px;
	top: 20px;
	width: 17px;
	height: 17px;
	border: 1px solid var(--mt-line);
	border-radius: 50%;
	background: #fff;
	transition: border-color 0.2s ease, box-shadow 0.2s ease;
}
#payment ul.wc_payment_methods li.wc_payment_method:has(input.input-radio:checked) label::before {
	border-color: var(--mt-gold);
	box-shadow: inset 0 0 0 4px var(--mt-gold);
}

/* 説明文 */
#payment .payment_box {
	margin: 12px 0 0;
	/* Blocksy 側が padding-left を入れているため !important で打ち消す
	   （左端を支払い方法名と揃える） */
	padding: 0 !important;
	background: transparent !important;
	border: none !important;
	font-size: 13px;
	line-height: 1.95;
	color: var(--mt-muted);
}
#payment .payment_box::before { display: none !important; }
#payment .payment_box p { margin: 0 0 8px; }
#payment .payment_box p:last-child { margin-bottom: 0; }

/* :has() 非対応ブラウザではネイティブのラジオを表示する（選択状態が分からなくなるため） */
@supports not selector(:has(*)) {
	#payment ul.wc_payment_methods input.input-radio {
		display: inline-block !important;
		margin: 0 10px 0 0 !important;
		vertical-align: middle;
	}
	#payment ul.wc_payment_methods li.wc_payment_method { padding-left: 20px; }
	#payment ul.wc_payment_methods li.wc_payment_method label::before { display: none; }
}

/* =========================================================================
   お知らせ（NEWS）
   -------------------------------------------------------------------------
   [mt_news] ショートコードの出力。記事を投稿すると自動で反映される。
   ========================================================================= */
.mt-news-feed__list {
	max-width: 880px;
	margin: 0 auto;
	padding: 0;
	list-style: none;
	border-top: 1px solid var(--mt-line);
}
.mt-news-feed__item { border-bottom: 1px solid var(--mt-line); }
.mt-news-feed__item a {
	display: flex;
	align-items: baseline;
	gap: 26px;
	padding: 18px 6px;
	text-decoration: none;
	transition: background-color 0.2s ease;
}
.mt-news-feed__item a:hover { background: var(--mt-cream); }
.mt-news-feed__item time {
	flex: 0 0 auto;
	font-family: var(--mt-latin);
	font-size: 13px;
	letter-spacing: 0.08em;
	color: var(--mt-gold);
}
.mt-news-feed__title {
	font-size: 14.5px;
	line-height: 1.7;
	color: var(--mt-ink);
	transition: color 0.2s ease;
}
.mt-news-feed__item a:hover .mt-news-feed__title { color: var(--mt-gold); }
.mt-news-feed__empty {
	margin: 0;
	text-align: center;
	font-size: 14px;
	color: var(--mt-muted);
}
.mt-news-feed__more { margin: 30px 0 0; text-align: center; }
.mt-news-feed__more a {
	display: inline-block;
	padding-bottom: 3px;
	border-bottom: 1px solid var(--mt-gold);
	font-size: 13px;
	letter-spacing: 0.08em;
	color: var(--mt-ink);
	text-decoration: none;
	transition: color 0.2s ease;
}
.mt-news-feed__more a:hover { color: var(--mt-gold); }

@media (max-width: 600px) {
	.mt-news-feed__item a {
		flex-direction: column;
		gap: 6px;
		padding: 16px 2px;
	}
}