/* =========================================
   GRM Simple Cart フロント
   ・色や角丸はテーマ（grm-theme-base の root.css）の変数を利用
   ・サイトごとの調整は下の --grmsc-* をテーマ側で上書きする
========================================= */
:root{
	--grmsc-accent:var(--color-main, #222222);
	--grmsc-accent-text:#ffffff;
	--grmsc-text:var(--color-text, #333333);
	--grmsc-sub:var(--color-sub, #666666);
	--grmsc-border:var(--color-border, #cccccc);
	--grmsc-bg:var(--color-gray, #f6f4ef);
	--grmsc-error:#c62828;
	--grmsc-radius:var(--radius-sm, 6px);
}

.grmsc [hidden]{ display:none !important; }
.grmsc{ color:var(--grmsc-text); }
.grmsc *,.grmsc *::before,.grmsc *::after{ box-sizing:border-box; }

/* =========================
   ボタン
========================= */
.grmsc-btn{
	display:inline-flex;
	align-items:center;
	justify-content:center;
	gap:.4em;
	min-height:48px;
	padding:.6em 1.6em;
	border:1px solid var(--grmsc-accent);
	border-radius:var(--grmsc-radius);
	background:#fff;
	color:var(--grmsc-accent);
	font-size:15px;
	line-height:1.4;
	text-align:center;
	text-decoration:none;
	cursor:pointer;
	transition:opacity .2s;
}
.grmsc-btn:hover{ opacity:.75; }
.grmsc-btn-primary{
	background:var(--grmsc-accent);
	color:var(--grmsc-accent-text);
}
/* テーマ側のリンク色・下線（.grm-page-content a 等）に負けないように */
.grmsc a.grmsc-btn,
.grmsc a.grmsc-btn:hover{
	color:var(--grmsc-accent) !important;
	text-decoration:none !important;
}
.grmsc a.grmsc-btn-primary,
.grmsc a.grmsc-btn-primary:hover{
	color:var(--grmsc-accent-text) !important;
}
.grmsc .grmsc-card-title a,
.grmsc .grmsc-cart-name{
	color:inherit !important;
	text-decoration:none !important;
}
.grmsc-btn:disabled{ opacity:.5; cursor:default; }

.grmsc-actions{
	display:flex;
	flex-wrap:wrap;
	justify-content:center;
	gap:16px;
	margin:40px 0 0;
}
.grmsc-actions form{ margin:0; }

/* Turnstile（スパム対策）の確認欄：上の入力欄と間を空けて中央に置く */
.grmsc-turnstile{
	display:flex;
	justify-content:center;
	margin:40px 0 0;
}
.grmsc-turnstile + .grmsc-actions{ margin-top:24px; }
.grmsc-register .grmsc-turnstile{ margin-top:24px; }

.grmsc-archive{ padding-bottom:100px; }
.grmsc-message{
	padding:40px 0;
	text-align:center;
}

/* =========================
   商品カード・一覧
========================= */
.grmsc-grid{
	display:grid;
	gap:40px 30px;
	grid-template-columns:repeat(var(--grmsc-cols, 2), minmax(0, 1fr));
}
.grmsc-cols-1{ --grmsc-cols:1; }
.grmsc-cols-2{ --grmsc-cols:2; }
.grmsc-cols-3{ --grmsc-cols:3; }
.grmsc-cols-4{ --grmsc-cols:4; }

.grmsc-card{
	display:flex;
	flex-direction:column;
}
.grmsc-card-image{
	display:block;
	aspect-ratio:4 / 3;
	overflow:hidden;
	border-radius:var(--grmsc-radius);
	background:var(--grmsc-bg);
}
.grmsc-card-image img{
	width:100%;
	height:100%;
	object-fit:cover;
	transition:transform .4s;
}
.grmsc-card-image:hover img{ transform:scale(1.03); }
.grmsc-noimage{
	display:block;
	width:100%;
	height:100%;
	min-height:200px;
	background:var(--grmsc-bg);
}
.grmsc-card-body{
	display:flex;
	flex-direction:column;
	flex:1;
	padding-top:16px;
}
.grmsc-card-title{
	margin:0 0 8px;
	font-size:20px;
	line-height:1.5;
}
.grmsc-card-title a{ color:inherit; text-decoration:none; }
.grmsc-subtitle{
	margin-left:.6em;
	color:var(--grmsc-sub);
	font-size:12px;
	letter-spacing:.1em;
	font-weight:normal;
}
.grmsc-contents{
	margin:0 0 8px;
	color:var(--grmsc-sub);
	font-size:14px;
	line-height:1.7;
}
.grmsc-price{
	margin:0 0 16px;
	font-size:22px;
	line-height:1.4;
}
.grmsc-price small{
	margin-left:.3em;
	color:var(--grmsc-sub);
	font-size:12px;
}
.grmsc-price-lg{ font-size:28px; }
.grmsc-soldout{
	margin:auto 0 0;
	color:var(--grmsc-error);
	font-weight:bold;
}

.grmsc-add{
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	gap:12px;
	margin:auto 0 0;
}
.grmsc-add-qty{
	display:inline-flex;
	align-items:center;
	gap:8px;
	font-size:14px;
}
.grmsc-add .grmsc-btn{ flex:1; min-width:180px; }
/* 商品ごとの上限数（例：1回のご注文につき1セットまで） */
.grmsc-add-limit{
	flex-basis:100%;
	color:var(--grmsc-sub);
	font-size:12px;
}

/* =========================
   商品一覧ページ
========================= */
.grmsc-archive-desc{ margin:0 0 30px; }
.grmsc-cat-nav{
	display:flex;
	flex-wrap:wrap;
	gap:10px;
	margin:0 0 40px;
	padding:0;
	list-style:none;
}
.grmsc-cat-nav a{
	display:inline-block;
	padding:.4em 1.2em;
	border:1px solid var(--grmsc-border);
	border-radius:999px;
	color:inherit;
	font-size:14px;
	text-decoration:none;
}
.grmsc-cat-nav a.is-current{
	border-color:var(--grmsc-accent);
	background:var(--grmsc-accent);
	color:var(--grmsc-accent-text);
}

/* =========================
   商品詳細ページ
========================= */
.grmsc-single{ padding:var(--grm-page-head-space, 40px) 0 60px; }
.grmsc-single-grid{
	display:grid;
	grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
	gap:50px;
	align-items:start;
}
.grmsc-single-main{
	overflow:hidden;
	border-radius:var(--grmsc-radius);
	background:var(--grmsc-bg);
}
.grmsc-single-main img{
	display:block;
	width:100%;
	height:auto;
}
.grmsc-single-thumbs{
	display:grid;
	grid-template-columns:repeat(5, minmax(0, 1fr));
	gap:8px;
	margin:10px 0 0;
	padding:0;
	list-style:none;
}
.grmsc-single-thumbs button{
	display:block;
	width:100%;
	padding:0;
	border:0;
	background:none;
	cursor:pointer;
}
.grmsc-single-thumbs img{
	display:block;
	width:100%;
	aspect-ratio:1;
	object-fit:cover;
	border-radius:4px;
}
.grmsc-single-cats{ margin:0 0 10px; font-size:13px; }
.grmsc-single-cats a{ margin-right:.8em; color:var(--grmsc-sub); }
.grmsc-single-title{
	margin:0 0 16px;
	font-size:28px;
	line-height:1.4;
}
.grmsc-single-excerpt{ margin:0 0 24px; }
.grmsc-single-content{ margin-top:60px; }

/* =========================
   カートアイコン
========================= */
.grmsc-cart-icon{
	position:relative;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	width:40px;
	height:40px;
	color:inherit;
	text-decoration:none;
}
.grmsc-cart-count{
	position:absolute;
	top:0;
	right:-2px;
	display:inline-flex;
	align-items:center;
	justify-content:center;
	min-width:18px;
	height:18px;
	padding:0 5px;
	border-radius:999px;
	background:var(--grmsc-error);
	color:#fff;
	font-size:11px;
	line-height:1;
}
.grmsc-cart-count.is-empty{ display:none; }

/* =========================
   カート
========================= */
.grmsc-cart-table{
	width:100%;
	border-collapse:collapse;
}
.grmsc .grmsc-cart-table{ border:0; }
.grmsc .grmsc-cart-table th,
.grmsc .grmsc-cart-table td{
	padding:16px 10px;
	border:0;
	border-bottom:1px solid var(--grmsc-border);
	background:none;
	vertical-align:middle;
	text-align:left;
}
.grmsc .grmsc-cart-table thead th{
	border-bottom-width:2px;
	color:var(--grmsc-sub);
	font-size:13px;
	font-weight:normal;
}
.grmsc-col-price,
.grmsc-col-total{ white-space:nowrap; text-align:right !important; }
.grmsc-col-qty{ white-space:nowrap; }
.grmsc-col-remove{ width:40px; text-align:center !important; }
.grmsc-cart-product{
	display:flex;
	align-items:center;
	gap:16px;
}
.grmsc-cart-thumb{
	flex:none;
	width:72px;
	height:72px;
	object-fit:cover;
	border-radius:4px;
}
.grmsc-cart-name{ color:inherit; font-weight:bold; text-decoration:none; }
.grmsc-cart-contents{
	display:block;
	color:var(--grmsc-sub);
	font-size:13px;
}
.grmsc-unit{ margin-left:.3em; font-size:13px; }
.grmsc-remove{
	width:32px;
	height:32px;
	padding:0;
	border:1px solid var(--grmsc-border);
	border-radius:50%;
	background:#fff;
	color:var(--grmsc-sub);
	font-size:16px;
	line-height:1;
	cursor:pointer;
}
.grmsc-cart-foot{
	display:flex;
	flex-wrap:wrap;
	justify-content:flex-end;
	align-items:center;
	gap:20px;
	margin-top:20px;
}
.grmsc-cart-subtotal{ margin:0; font-size:15px; }
.grmsc-cart-subtotal strong{ margin-left:1em; font-size:24px; }
.grmsc-cart-subtotal small{ margin-left:.3em; color:var(--grmsc-sub); font-size:12px; }

.grmsc select,
.grmsc input[type="text"],
.grmsc input[type="tel"],
.grmsc input[type="email"],
.grmsc input[type="password"],
.grmsc input[type="date"],
.grmsc input[data-grmsc-date],
.grmsc textarea{
	width:100%;
	min-height:44px;
	padding:8px 12px;
	border:1px solid var(--grmsc-border);
	border-radius:4px;
	background:#fff;
	color:inherit;
	font-size:16px;
	font-family:inherit;
}
.grmsc select{ width:auto; min-width:80px; padding-right:28px; }
.grmsc textarea{ min-height:120px; }

/* =========================
   ご注文手続き
========================= */
/* テーマ側の ol/ul のスタイル（番号・余白）を打ち消す */
.grmsc .grmsc-steps,
.grmsc .grmsc-dest-items,
.grmsc .grmsc-cat-nav,
.grmsc .grmsc-single-thumbs{
	padding-left:0;
	list-style:none;
}
.grmsc .grmsc-steps li,
.grmsc .grmsc-dest-items li,
.grmsc .grmsc-cat-nav li,
.grmsc .grmsc-single-thumbs li{
	margin:0;
	list-style:none;
}
.grmsc-steps{
	display:flex;
	margin:0 0 40px;
	padding:0;
	list-style:none;
	counter-reset:grmsc-step;
}
.grmsc-steps li{
	flex:1;
	padding:12px 8px;
	border-bottom:3px solid var(--grmsc-border);
	color:var(--grmsc-sub);
	font-size:14px;
	text-align:center;
	counter-increment:grmsc-step;
}
.grmsc-steps li::before{ content:counter(grmsc-step) ". "; }
.grmsc-steps li.is-current{
	border-bottom-color:var(--grmsc-accent);
	color:var(--grmsc-accent);
	font-weight:bold;
}

.grmsc-errors{
	margin:0 0 30px;
	padding:16px 20px;
	border:1px solid var(--grmsc-error);
	border-radius:var(--grmsc-radius);
	background:#fdf2f2;
	color:var(--grmsc-error);
	font-size:14px;
}
.grmsc-errors p{ margin:0 0 6px; font-weight:bold; }
.grmsc-errors ul{ margin:0; padding-left:1.2em; }

.grmsc-section{ margin:0 0 50px; }
.grmsc-section-title{
	margin:0 0 20px;
	padding:0 0 10px;
	border-bottom:2px solid var(--grmsc-accent);
	font-size:20px;
}
.grmsc-lead{ margin:0 0 30px; text-align:center; }

.grmsc-row{
	display:grid;
	grid-template-columns:220px minmax(0, 1fr);
	gap:10px 20px;
	align-items:center;
	padding:14px 0;
	border-bottom:1px solid var(--grmsc-border);
}
.grmsc-label{
	font-size:15px;
	font-weight:bold;
}
.grmsc-label em{
	display:inline-block;
	margin-left:.6em;
	padding:2px 6px;
	border-radius:3px;
	background:var(--grmsc-error);
	color:#fff;
	font-size:11px;
	font-style:normal;
	font-weight:normal;
	line-height:1.4;
	vertical-align:middle;
}
.grmsc-input-short input,
.grmsc-input-short select{ max-width:280px; }
.grmsc-row.is-error input,
.grmsc-row.is-error select,
.grmsc-payments.is-error{
	border-color:var(--grmsc-error);
	background:#fdf2f2;
}

.grmsc-note{
	margin:0 0 20px;
	padding:16px 20px;
	border-radius:var(--grmsc-radius);
	background:var(--grmsc-bg);
	font-size:14px;
}
.grmsc-note p{ margin:0 0 4px; }
.grmsc-note p:last-child{ margin-bottom:0; }

.grmsc-dest{
	margin:0 0 24px;
	padding:20px 24px;
	border:1px solid var(--grmsc-border);
	border-radius:var(--grmsc-radius);
	min-width:0;
}
.grmsc .grmsc-dest-title{ margin:0; }
.grmsc-dest-head{
	display:flex;
	justify-content:space-between;
	align-items:center;
	gap:10px;
	margin:0 0 10px;
}
.grmsc-dest-title{
	margin:0;
	font-size:17px;
}
.grmsc-dest-remove{
	padding:4px 12px;
	border:1px solid var(--grmsc-border);
	border-radius:4px;
	background:#fff;
	color:var(--grmsc-sub);
	font-size:13px;
	cursor:pointer;
}
.grmsc-check{
	display:inline-flex;
	align-items:center;
	gap:8px;
	margin:4px 0 6px;
	cursor:pointer;
}
.grmsc-check input{ width:18px; height:18px; margin:0; }
.grmsc-dest .grmsc-row:last-child{ border-bottom:0; }
.grmsc-dest-items{
	margin:0;
	padding:0;
	list-style:none;
}
.grmsc-dest-items li{
	display:flex;
	align-items:center;
	gap:24px;
	padding:6px 0;
}
.grmsc-dest-item-name{ min-width:12em; }
.grmsc-dest-item-name small{
	margin-left:.8em;
	color:var(--grmsc-sub);
	font-size:13px;
}
.grmsc-dest-item-qty{ white-space:nowrap; font-size:14px; }
.grmsc-dest-shipping{
	margin:10px 0 0;
	padding:8px 12px;
	border-radius:4px;
	background:var(--grmsc-bg);
	font-size:14px;
}
.grmsc-dest-add-wrap{ margin:0; text-align:center; }

.grmsc-payments{
	display:grid;
	gap:12px;
	padding:4px;
	border:1px solid transparent;
	border-radius:var(--grmsc-radius);
}
.grmsc-payment{
	display:flex;
	align-items:flex-start;
	gap:12px;
	padding:16px 20px;
	border:1px solid var(--grmsc-border);
	border-radius:var(--grmsc-radius);
	cursor:pointer;
}
.grmsc-payment input{ flex:none; width:18px; height:18px; margin:3px 0 0; }
.grmsc-payment:has(input:checked){ border-color:var(--grmsc-accent); }
.grmsc-payment.is-disabled{ opacity:.45; cursor:not-allowed; }
.grmsc-payment-label{ display:block; font-weight:bold; }
.grmsc-payment-label small{ font-weight:normal; color:var(--grmsc-sub); }
.grmsc-payment-note{
	display:block;
	margin-top:4px;
	color:var(--grmsc-sub);
	font-size:13px;
}

.grmsc-summary{
	margin:0 0 0 auto;
	max-width:420px;
	padding:20px 24px;
	border-radius:var(--grmsc-radius);
	background:var(--grmsc-bg);
}
.grmsc-summary dl{
	display:grid;
	grid-template-columns:1fr auto;
	gap:8px 0;
	margin:0;
}
.grmsc-summary dt,
.grmsc-summary dd{ margin:0; }
.grmsc-summary dd{ padding-left:20px; text-align:right; }
.grmsc-summary .grmsc-summary-total{
	padding-top:10px;
	border-top:1px solid var(--grmsc-border);
	font-weight:bold;
}
.grmsc-summary dd.grmsc-summary-total span{ font-size:24px; }
.grmsc-summary dd.grmsc-summary-total small{
	display:block;
	color:var(--grmsc-sub);
	font-size:12px;
	font-weight:normal;
}

/* 会員登録（注文時） */
.grmsc-register{
	margin:20px 0 0;
	padding:16px 20px;
	border:1px solid var(--grmsc-border);
	border-radius:var(--grmsc-radius);
}
.grmsc-register.is-error{ border-color:var(--grmsc-error); background:#fdf2f2; }
.grmsc-register .grmsc-row:last-child{ border-bottom:0; }
.grmsc-login-note a{ margin:0 .2em; }
.grmsc-help{
	display:block;
	margin-top:4px;
	color:var(--grmsc-sub);
	font-size:12px;
}
.grmsc-check-wrap{ margin:12px 0 0; }

/* マイページ */
.grmsc-member{ padding-bottom:60px; }
.grmsc-member-login{
	display:grid;
	grid-template-columns:minmax(0, 1fr) minmax(0, 1fr);
	gap:50px;
}
.grmsc-member-login .grmsc-row{ grid-template-columns:minmax(0, 1fr); gap:6px; }
.grmsc-link-center{ margin:16px 0 0; text-align:center; font-size:14px; }
.grmsc-member-head{
	display:flex;
	flex-wrap:wrap;
	justify-content:space-between;
	align-items:center;
	gap:16px;
	margin:0 0 40px;
	padding:0 0 16px;
	border-bottom:1px solid var(--grmsc-border);
}
.grmsc .grmsc-member-hello{ margin:0; font-weight:bold; }
.grmsc .grmsc-member-nav{
	display:flex;
	flex-wrap:wrap;
	gap:8px;
	margin:0;
	padding:0;
	list-style:none;
}
.grmsc .grmsc-member-nav li{ margin:0; list-style:none; }
.grmsc .grmsc-member-nav a{
	display:inline-block;
	padding:.4em 1.1em;
	border:1px solid var(--grmsc-border);
	border-radius:999px;
	color:inherit !important;
	font-size:14px;
	text-decoration:none !important;
}
.grmsc .grmsc-member-nav a.is-current{
	border-color:var(--grmsc-accent);
	background:var(--grmsc-accent);
	color:var(--grmsc-accent-text) !important;
}
.grmsc-notice{
	margin:0 0 30px;
	padding:14px 20px;
	border-radius:var(--grmsc-radius);
	background:var(--grmsc-bg);
}
.grmsc-btn-sm{
	min-height:34px;
	padding:.3em 1em;
	font-size:13px;
}
.grmsc-col-link{ width:1%; white-space:nowrap; }
.grmsc .grmsc-address-list{
	margin:0 0 20px;
	padding:0;
	list-style:none;
}
.grmsc .grmsc-address-list li{
	display:flex;
	justify-content:space-between;
	align-items:center;
	gap:16px;
	margin:0;
	padding:16px 0;
	border-bottom:1px solid var(--grmsc-border);
	list-style:none;
}
.grmsc-address-body span{ display:block; color:var(--grmsc-sub); font-size:14px; }
.grmsc-address-actions{ display:flex; gap:8px; }
.grmsc-address-actions form{ margin:0; }

/* 確認画面 */
.grmsc-confirm-list{
	display:grid;
	grid-template-columns:220px minmax(0, 1fr);
	margin:0;
}
.grmsc-confirm-list dt,
.grmsc-confirm-list dd{
	margin:0;
	padding:12px 0;
	border-bottom:1px solid var(--grmsc-border);
}
.grmsc-confirm-list dt{ font-weight:bold; }
.grmsc-confirm-dest{ margin:0 0 30px; }
.grmsc-confirm-dest .grmsc-dest-title{ margin:0 0 8px; }
.grmsc-confirm-items{ margin-top:10px; }

/* 完了画面 */
.grmsc-complete-box{
	max-width:640px;
	margin:0 auto;
	text-align:center;
}
.grmsc-complete-number{ font-size:18px; }
.grmsc-complete-number strong{ font-size:24px; letter-spacing:.05em; }
.grmsc-complete-box .grmsc-note{ margin-top:30px; text-align:left; }

/* =========================
   スマートフォン
========================= */
@media (max-width:767px){
	.grmsc-grid{ grid-template-columns:minmax(0, 1fr); }
	.grmsc-single-grid{ grid-template-columns:minmax(0, 1fr); gap:30px; }
	.grmsc-single-title{ font-size:24px; }

	.grmsc-cart-table thead{ display:none; }
	.grmsc-cart-table tr{
		display:grid;
		grid-template-columns:1fr auto;
		gap:6px 10px;
		padding:14px 0;
		border-bottom:1px solid var(--grmsc-border);
	}
	.grmsc .grmsc-cart-table td{
		padding:0;
		border:0;
	}
	.grmsc-cart-table .grmsc-col-product{ grid-column:1 / 2; }
	.grmsc-cart-table .grmsc-col-remove{ grid-column:2 / 3; grid-row:1; }
	.grmsc-cart-table .grmsc-col-price,
	.grmsc-cart-table .grmsc-col-qty,
	.grmsc-cart-table .grmsc-col-total{
		grid-column:1 / -1;
		display:flex;
		justify-content:space-between;
		align-items:center;
	}
	.grmsc-cart-table .grmsc-col-qty{ justify-content:flex-start; gap:8px; }
	.grmsc-cart-table td[data-label]::before{
		content:attr(data-label);
		margin-right:auto;
		color:var(--grmsc-sub);
		font-size:13px;
	}
	.grmsc-confirm-items tr{ grid-template-columns:1fr; }
	.grmsc-confirm-items .grmsc-col-price,
	.grmsc-confirm-items .grmsc-col-total{ justify-content:flex-end; }

	.grmsc-row,
	.grmsc-confirm-list{ grid-template-columns:minmax(0, 1fr); }
	.grmsc-row{ gap:8px; }
	.grmsc-confirm-list dt{ padding-bottom:0; border-bottom:0; }
	.grmsc-dest{ padding:16px; }
	.grmsc-summary{ max-width:none; }
	.grmsc-actions{ flex-direction:column-reverse; }
	.grmsc-actions .grmsc-btn,
	.grmsc-actions form{ width:100%; }
	.grmsc-steps li{ font-size:12px; }
	.grmsc-member-login{ grid-template-columns:minmax(0, 1fr); gap:20px; }
	.grmsc .grmsc-address-list li{ flex-direction:column; align-items:flex-start; }
	.grmsc-history .grmsc-col-link{ width:auto; }
}

/* =========================
   お知らせメールの受け取り
========================= */
.grmsc-check-wrap .grmsc-help{ display:block; margin:4px 0 0 1.8em; }