@charset "UTF-8";
/* =====================================================================
 * Fortune Shop 共通スタイル
 * 配色・タイポグラフィ・レイアウト・ヘッダー・フッター・ボタン・カード
 * ボタン以外の border-radius は 0。
 * ===================================================================== */

/* -------------------- CSS 変数 -------------------- */

@font-face {
  font-family: "Antro Vectra";
  src: url("../fonts/Antro_Vectra.otf") format("opentype");
  font-weight: 400;
  font-style: normal;
  font-display: swap;
}

@import url('https://fonts.cdnfonts.com/css/antro-vectra');
@import url("https://fonts.googleapis.com/css2?family=Shippori+Mincho:wght@400;500;600;700&display=swap");
@import url("https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@400;500;600;700&display=swap");
:root {
	/* 濃紺 */
	--c-navy: #061F5C;
	--c-navy-2: #08256B;
	--c-navy-3: #0A2B78;
	/* 白・アイボリー */
	--c-white: #FFFFFF;
	--c-ivory: #F8F3E8;
	--c-ivory-2: #FBF7EF;
	/* ゴールド */
	--c-gold: #D8B75A;
	--c-gold-2: #C9A646;
	--c-gold-3: #B6933B;
	/* ボタン立体用の濃い影色 */
	--c-gold-shadow: #937629;
	--c-navy-shadow: #03133F;
	--c-line-green: #06C755;
	--c-line-shadow: #04913C;
	/* ブルー */
	--c-blue: #EEF6FF;
	--c-blue-2: #F5FAFF;
	/* テキスト */
	--c-charcoal: #333333;
	--c-gray: #666666;
	/* 罫線 */
	--c-line: #E6DCC4;
	--c-line-gold: rgba(216, 183, 90, .5);

	/* フォント */
	--font-mincho: "Shippori Mincho", serif;
	--font-gothic: "Noto Sans JP", sans-serif;

	/* レイアウト */
	--container: 1200px;
	--container-narrow: 800px;
	--gutter: 24px;
	--header-h: 84px;

	/* 効果 */
	--shadow-soft: 0 18px 40px rgba(6, 31, 92, .08);
	--ease: cubic-bezier(.22, .61, .36, 1);
}

/* -------------------- リセットと基本 -------------------- */
*,
*::before,
*::after {
	box-sizing: border-box;
}

html {
	font-size: 16px;
	scroll-behavior: smooth;
	-webkit-text-size-adjust: 100%;
}

body {
	margin: 0;
	font-family: var(--font-gothic);
	color: var(--c-charcoal);
	background: var(--c-white);
	line-height: 1.9;
	letter-spacing: .02em;
	overflow-x: hidden;
	font-feature-settings: "palt";
	-webkit-font-smoothing: antialiased;
}

img {
	max-width: 100%;
	height: auto;
	vertical-align: bottom;
	border-radius: 0;
}

a {
	color: var(--c-navy);
	text-decoration: none;
	transition: color .3s var(--ease), opacity .3s var(--ease);
}

a:hover {
	color: var(--c-gold-3);
}

h1, h2, h3, h4, h5, h6 {
	font-family: "shippori-mincho", sans-serif!important;
	font-weight: 500;
	line-height: 1.5;
	letter-spacing: .06em;
	margin: 0;
}

p {
	margin: 0 0 1em;
}

ul, ol {
	margin: 0;
	padding: 0;
	list-style: none;
}

button {
	font-family: inherit;
	cursor: pointer;
}

/* すべての要素の角丸を 0 に（ボタン等は個別で許可） */
input, textarea, select, table, th, td, article, section, figure, .card {
	border-radius: 0;
}

/* -------------------- アクセシビリティ -------------------- */
.screen-reader-text {
	position: absolute !important;
	width: 1px;
	height: 1px;
	padding: 0;
	margin: -1px;
	overflow: hidden;
	clip: rect(0, 0, 0, 0);
	white-space: nowrap;
	border: 0;
}

.skip-link {
	position: absolute;
	left: -9999px;
	top: 0;
	z-index: 100000;
	background: var(--c-navy);
	color: #fff;
	padding: 10px 16px;
}

.skip-link:focus {
	left: 8px;
	top: 8px;
	color: #fff;
}

/* -------------------- レイアウト -------------------- */
.container {
	width: 100%;
	max-width: var(--container);
	margin: 0 auto;
	padding-left: var(--gutter);
	padding-right: var(--gutter);
}

.container--narrow {
	max-width: var(--container-narrow);
}

.site-content-wrap {
	min-height: 50vh;
}

.section {
	position: relative;
	padding: 96px 0;
	overflow: hidden;
}

.section--ivory {
	background: var(--c-ivory-2);
}

.section--dark {
	background: linear-gradient(180deg, var(--c-navy) 0%, var(--c-navy-2) 60%, var(--c-navy-3) 100%);
	color: var(--c-white);
}

.section__more {
	text-align: center;
	margin-top: 48px;
}

/* 光の演出 */
.section__glow {
	position: absolute;
	top: -20%;
	left: 50%;
	width: 90%;
	height: 60%;
	transform: translateX(-50%);
	background: radial-gradient(ellipse at center, rgba(216, 183, 90, .18) 0%, rgba(216, 183, 90, 0) 70%);
	pointer-events: none;
	filter: blur(6px);
}

/* -------------------- セクション見出し -------------------- */
.section-head {
	text-align: center;
	max-width: 720px;
	margin: 0 auto 56px;
}

.section-head__en {
	display: block;
	font-family: 'Antro Vectra', sans-serif;
	font-size: 20px;
	letter-spacing: 0em;
	color: var(--c-gold-3);
	font-weight:700;
	margin-bottom: 14px;
}

.section-head__en--light {
	color: var(--c-gold);
}

.section-head__title {
	font-size: 2rem;
	color: var(--c-navy);
	position: relative;
	display: inline-block;
	padding-bottom: 20px;
	letter-spacing: 5px;
}

.section-head__title::after {
	content: "";
	position: absolute;
	left: 50%;
	bottom: 0;
	width: 48px;
	height: 1px;
	transform: translateX(-50%);
	background: linear-gradient(90deg, transparent, var(--c-gold), transparent);
}

.section-head__title--light {
	color: var(--c-white);
}

.section-head__desc {
	margin-top: 24px;
	color: var(--c-gray);
	font-size: 1rem;
}

.section-head__desc--light {
	color: rgba(255, 255, 255, .82);
}

/* -------------------- ボタン（上品なピル型・角丸はボタンのみ許可） -------------------- */
.btn {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 12px;
	min-width: 240px;
	padding: 17px 44px 17px 36px;
	font-family: var(--font-gothic);
	font-weight: 600;
	font-size: .95rem;
	letter-spacing: .14em;
	line-height: 1.4;
	text-align: center;
	border: 0;
	border-radius: 999px;
	position: relative;
	overflow: hidden;
	transition: transform .4s var(--ease), box-shadow .4s var(--ease), background-color .4s var(--ease), color .4s var(--ease);
}

/* 上品な光のスイープ（細く・ゆっくり） */
.btn::before {
	content: "";
	position: absolute;
	top: 0;
	left: -140%;
	width: 45%;
	height: 100%;
	background: linear-gradient(115deg, transparent, rgba(255, 255, 255, .35), transparent);
	transform: skewX(-24deg);
	transition: left 1s var(--ease);
	pointer-events: none;
	z-index: 1;
}

.btn:hover::before {
	left: 150%;
}

.btn .icon,
.btn__text,
.btn__arrow {
	position: relative;
	z-index: 2;
}

.btn .icon {
	flex: none;
	opacity: .9;
}

/* 丸囲みの矢印（右端） */
.btn__arrow {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 30px;
	height: 30px;
	margin-left: 4px;
	margin-right: -18px;
	border: 1px solid rgba(255, 255, 255, .55);
	border-radius: 50%;
	transition: transform .4s var(--ease), background-color .4s var(--ease), border-color .4s var(--ease), color .4s var(--ease);
}

.btn__arrow .icon {
	width: 14px;
	height: 14px;
}

.btn:hover .btn__arrow {
	transform: translateX(4px);
	background: rgba(255, 255, 255, .92);
}

.btn--icon {
	justify-content: center;
}

.btn--sm {
	min-width: 0;
	padding: 15px 24px;
	font-size: .9rem;
	letter-spacing: .1em;
}

.btn--sm .btn__arrow {
	width: 22px;
	height: 22px;
	margin-right: -10px;
}

.btn--sm .btn__arrow .icon {
	width: 11px;
	height: 11px;
}

.btn--large {
	padding: 19px 50px 19px 42px;
	font-size: 1.02rem;
}

/* ゴールド */
.btn--gold {
	background: linear-gradient(115deg, var(--c-gold) 0%, var(--c-gold-2) 55%, var(--c-gold-3) 100%);
	color: #fff;
}

.btn--gold:hover {
	color: #fff;
	transform: translateY(-3px);
}

.btn--gold .btn__arrow:hover,
.btn--gold:hover .btn__arrow {
	color: var(--c-gold-3);
	border-color: rgba(255, 255, 255, .92);
}

/* 濃紺 */
.btn--navy {
	background: linear-gradient(115deg, var(--c-navy-3) 0%, var(--c-navy) 100%);
	color: #fff;
}

.btn--navy:hover {
	color: #fff;
	transform: translateY(-3px);
}

.btn--navy:hover .btn__arrow {
	color: var(--c-navy);
}

/* 濃紺背景では濃紺ボタンが沈むため、ゴールド罫線で輪郭を出す */
.section--dark .btn--navy {
	background: rgba(255, 255, 255, .05);
	box-shadow: inset 0 0 0 1px var(--c-gold), 0 8px 26px rgba(3, 19, 63, .35);
}

.section--dark .btn--navy:hover {
	background: var(--c-gold);
	box-shadow: inset 0 0 0 1px var(--c-gold), 0 12px 30px rgba(182, 147, 59, .35);
}

.section--dark .btn--navy:hover .btn__arrow {
	color: var(--c-gold-3);
}

/* アウトライン（細いゴールド罫線） */
.btn--outline {
	background: rgba(255, 255, 255, .85);
	color: var(--c-gold);
	border-color: var(--c-gold);
	border:solid 1px #d8b75a
}

.btn--outline .btn__arrow {
	border-color: var(--c-gold);
	color: var(--c-gold-3);
}

.section--dark .btn--outline {
	background: transparent;
	color: var(--c-gold)!important;
}

.section--dark .btn--outline .btn__arrow {
	border-color: var(--c-gold);
	color: var(--c-gold)!important;
}

.btn--outline:hover {
	background: var(--c-gold);
	color:#fff!important;
	transform: translateY(-3px);
}

.btn--outline:hover .btn__arrow {
	border-color: rgba(255, 255, 255, .92);
	color: var(--c-gold-3);
}

/* LINE */
.btn--line {
	background: linear-gradient(115deg, #1ecf67 0%, var(--c-line-green) 55%, #05a848 100%);
	color: #fff
}

.btn--line:hover {
	color: #fff;
	transform: translateY(-3px);
}

.btn--line:hover .btn__arrow {
	color: var(--c-line-shadow);
}

/* -------------------- 吹き出しタブ付きCTA -------------------- */
.cta-tab {
	display: inline-flex;
	flex-direction: column;
	align-items: stretch;
}

.cta-tab--center {
	align-items: center;
}

.cta-tab__label {
	position: relative;
	align-self: center;
	background: #fff;
	color: var(--c-navy);
	font-family: var(--font-mincho);
	font-size: .85rem;
	letter-spacing: .1em;
	line-height: 1.4;
	padding: 10px 26px;
	margin-bottom: 0px;
	border-radius: 999px;
	box-shadow: 0 1px 0 rgba(216, 183, 90, .5) inset, 0 6px 18px rgba(6, 31, 92, .12);
	z-index:1
}

/* 吹き出しの下向き三角 */
.cta-tab__label::after {
	content: "";
	position: absolute;
	top: 100%;
	left: 50%;
	transform: translateX(-50%);
	border-left: 7px solid transparent;
	border-right: 7px solid transparent;
	border-top: 8px solid #fff;
}

.section--dark .cta-tab__label {
	color: var(--c-navy);
}

.cta-tab .btn {
	width: 100%;
}

/* テキストリンク */
.text-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: .92rem;
	letter-spacing: .08em;
	color: var(--c-gold-3);
	position: relative;
	padding-bottom: 3px;
}

.text-link::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 1px;
	background: var(--c-gold);
	transform: scaleX(.4);
	transform-origin: left;
	transition: transform .4s var(--ease);
}

.text-link:hover::after {
	transform: scaleX(1);
}

.text-link::before {
	content: "";
	display: inline-block;
	width: 18px;
	height: 1px;
	background: var(--c-gold);
	vertical-align: middle;
}

/* -------------------- ローディング画面 -------------------- */
.loading {
	position: fixed;
	inset: 0;
	z-index: 99999;
	display: flex;
	align-items: center;
	justify-content: center;
	background: var(--c-ivory-2);
	transition: opacity .8s var(--ease), visibility .8s var(--ease);
}

.loading.is-hidden {
	opacity: 0;
	visibility: hidden;
	pointer-events: none;
}

.loading__inner {
	position: relative;
	width: 300px;
	height: 300px;
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
}

.loading__glow {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 320px;
	height: 320px;
	transform: translate(-50%, -50%);
	background: radial-gradient(circle, rgba(216, 183, 90, .28) 0%, rgba(216, 183, 90, 0) 65%);
	border-radius: 50%;
	animation: loadingGlow 3.2s ease-in-out infinite;
}

/* 細いゴールドの二重リング（逆回転） */
.loading__ring {
	position: absolute;
	top: 50%;
	left: 50%;
	border-radius: 50%;
	border: 1px solid transparent;
}

.loading__ring--outer {
	width: 240px;
	height: 240px;
	margin: -120px 0 0 -120px;
	border-top-color: rgba(216, 183, 90, .9);
	border-right-color: rgba(216, 183, 90, .25);
	animation: ringSpin 3.6s linear infinite;
}

.loading__ring--inner {
	width: 204px;
	height: 204px;
	margin: -102px 0 0 -102px;
	border-bottom-color: rgba(182, 147, 59, .7);
	border-left-color: rgba(182, 147, 59, .18);
	animation: ringSpin 2.6s linear infinite reverse;
}

/* サイト名：文字間がゆっくり開きながら現れ、光が横切る */
.loading__name {
	position: relative;
	display: block;
	font-family: var(--font-mincho);
	font-size: 1.4rem;
	letter-spacing: .3em;
	white-space: nowrap;
	color: var(--c-navy);
	opacity: 0;
	background: linear-gradient(100deg,
		var(--c-navy) 0%,
		var(--c-navy) 42%,
		var(--c-gold-2) 50%,
		var(--c-navy) 58%,
		var(--c-navy) 100%);
	background-size: 300% 100%;
	-webkit-background-clip: text;
	background-clip: text;
	-webkit-text-fill-color: transparent;
	animation:
		loadingName 1.8s var(--ease) forwards,
		nameShimmer 2.8s ease-in-out 1s infinite;
}

/* 名前の下に伸びる細い罫線 */
.loading__line {
	position: relative;
	display: block;
	width: 120px;
	height: 1px;
	margin-top: 20px;
	background: linear-gradient(90deg, transparent, var(--c-gold), transparent);
	transform: scaleX(0);
	animation: lineGrow 1.4s var(--ease) .5s forwards;
}

@keyframes ringSpin {
	0% { transform: rotate(0deg); }
	100% { transform: rotate(360deg); }
}

@keyframes loadingGlow {
	0%, 100% { opacity: .45; transform: translate(-50%, -50%) scale(.92); }
	50% { opacity: .9; transform: translate(-50%, -50%) scale(1.06); }
}

@keyframes loadingName {
	0% { opacity: 0; letter-spacing: .55em; filter: blur(3px); }
	100% { opacity: 1; letter-spacing: .3em; filter: blur(0); }
}

@keyframes nameShimmer {
	0% { background-position: 120% 0; }
	100% { background-position: -60% 0; }
}

@keyframes lineGrow {
	0% { transform: scaleX(0); }
	100% { transform: scaleX(1); }
}

/* -------------------- ヘッダー -------------------- */
.site-header {
	position: sticky;
	top: 0;
	z-index: 9000;
	background: #fff;
	backdrop-filter: saturate(180%) blur(10px);
	border-bottom: 1px solid var(--c-line);
	transition: box-shadow .4s var(--ease), background .4s var(--ease);
}

.site-header.is-scrolled {
	box-shadow: 0 6px 20px rgba(6, 31, 92, .07);
}

.site-header__inner {
	display: flex;
	align-items: center;
	justify-content: space-between;
	min-height: var(--header-h);
	gap: 24px;
}

.site-branding .site-title {
	margin: 0;
	font-size: 1.35rem;
	letter-spacing: .12em;
	font-family: "shippori-mincho", sans-serif!important;
}

.site-branding .site-title a {
	color: var(--c-navy);
}

.custom-logo {
	max-height: 56px;
	width: auto;
}

.global-nav {
	display: flex;
	align-items: center;
	gap: 28px;
}

.global-nav__list {
	display: flex;
	align-items: center;
	gap: 26px;
}

.global-nav__link,
.global-nav .menu-item a {
	position: relative;
	font-size: .92rem;
	letter-spacing: .08em;
	color: var(--c-navy);
	padding: 6px 0;
}

.global-nav__link::after,
.global-nav .menu-item a::after {
	content: "";
	position: absolute;
	left: 0;
	bottom: 0;
	width: 100%;
	height: 1px;
	background: var(--c-gold);
	transform: scaleX(0);
	transform-origin: left;
	transition: transform .35s var(--ease);
}

.global-nav__link:hover::after,
.global-nav .menu-item a:hover::after {
	transform: scaleX(1);
}

.global-nav .menu {
	display: flex;
	align-items: center;
	gap: 26px;
}

/* ヘッダー SNS アイコン */
.global-nav__sns {
	display: flex;
	align-items: center;
	gap: 14px;
	padding-left: 20px;
	border-left: 1px solid var(--c-line);
	margin-left: 2px;
}

.global-nav__sns-link {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	width: 34px;
	height: 34px;
	color: var(--c-navy);
	border: 1px solid transparent;
	transition: color .3s var(--ease), border-color .3s var(--ease), transform .3s var(--ease);
}

.global-nav__sns-link .icon {
	width: 18px;
	height: 18px;
}

.global-nav__sns-link:hover {
	color: var(--c-gold-3);
	transform: translateY(-2px);
}

/* カートリンク */
.global-nav__cart .cart-link {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	font-size: .88rem;
	color: #fff;
	border: 1px solid var(--c-gold);
	padding: 8px 14px;
	transition: background .3s var(--ease), color .3s var(--ease);
	background:var(--c-gold);
}


.cart-link__count {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 20px;
	height: 20px;
	padding: 0 5px;
	font-size: .72rem;
	background: #fff;
    color: #d8b759;
}

/* ハンバーガー */
.nav-toggle {
	display: none;
	width: 44px;
	height: 44px;
	background: #fff;
	border: 0;
	position: relative;
	z-index: 9500;
}

.nav-toggle__bar {
	display: block;
	width: 26px;
	height: 1.5px;
	margin: 6px auto;
	background: var(--c-navy);
	transition: transform .4s var(--ease), opacity .3s var(--ease);
}

.nav-toggle.is-open .nav-toggle__bar:nth-child(1) {
	transform: translateY(7.5px) rotate(45deg);
}

.nav-toggle.is-open .nav-toggle__bar:nth-child(2) {
	opacity: 0;
}

.nav-toggle.is-open .nav-toggle__bar:nth-child(3) {
	transform: translateY(-7.5px) rotate(-45deg);
}

/* -------------------- フッター -------------------- */
.site-footer {
	position: relative;
	background: linear-gradient(180deg, var(--c-navy) 0%, var(--c-navy-2) 100%);
	color: rgba(255, 255, 255, .82);
	padding: 80px 0 0;
	overflow: hidden;
}

.site-footer__glow {
	position: absolute;
	top: -40%;
	left: 50%;
	width: 80%;
	height: 80%;
	transform: translateX(-50%);
	background: radial-gradient(ellipse at center, rgba(216, 183, 90, .14) 0%, rgba(216, 183, 90, 0) 70%);
	pointer-events: none;
}

.site-footer__inner {
	position: relative;
	display: grid;
	grid-template-columns: 1.4fr 1fr 1fr;
	gap: 48px;
	padding-bottom: 56px;
}

.site-footer__name {
	font-family: var(--font-mincho);
	font-size: 1.4rem;
	letter-spacing: .12em;
	color: #fff;
	margin-bottom: 16px;
}

.site-footer__desc {
	font-size: .88rem;
	line-height: 2;
	margin-bottom: 24px;
	max-width: 34em;
}

.site-footer__heading {
	font-family: var(--font-mincho);
	font-size: 1rem;
	letter-spacing: .1em;
	color: var(--c-gold);
	margin-bottom: 18px;
	padding-bottom: 12px;
	border-bottom: 1px solid rgba(216, 183, 90, .3);
}

.site-footer__list li {
	margin-bottom: 12px;
}

.site-footer__list a {
	font-size: .88rem;
	color: rgba(255, 255, 255, .82);
}

.site-footer__list a:hover {
	color: var(--c-gold);
}

.social-list li {
	margin-bottom: 12px;
}

.social-list a {
	display: inline-flex;
	align-items: center;
	gap: 10px;
	font-size: .88rem;
	color: rgba(255, 255, 255, .82);
}

.social-list a:hover {
	color: var(--c-gold);
}

.social-list .icon {
	color: var(--c-gold);
}

.site-footer__bottom {
	border-top: 1px solid rgba(255, 255, 255, .12);
	padding: 24px 0;
	text-align: center;
}

.site-footer__copyright {
	margin: 0;
	font-size: .78rem;
	letter-spacing: .08em;
	color: rgba(255, 255, 255, .6);
}

/* -------------------- 商品カード -------------------- */
.product-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 32px;
}

.product-card {
	background: var(--c-white);
	border: 1px solid var(--c-line);
	display: flex;
	flex-direction: column;
	transition: transform .5s var(--ease), box-shadow .5s var(--ease), border-color .5s var(--ease);
}

.section--dark .product-card {
	background: rgba(255, 255, 255, .96);
}


.product-card__thumb {
	display: block;
	overflow: hidden;
	aspect-ratio: 4 / 3;
	background: var(--c-ivory);
}

.product-card__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .8s var(--ease);
}

.product-card:hover .product-card__thumb img {
	transform: scale(1.05);
}

.product-card__body {
	padding: 24px 22px 26px;
	display: flex;
	flex-direction: column;
	flex: 1;
}

.product-card__title {
	font-size: 1.12rem;
	color: var(--c-navy);
	margin-bottom: 12px;
	line-height: 1.6;
}

.product-card__title a {
	color: inherit;
}

.product-card__excerpt {
	font-size: .86rem;
	color: var(--c-gray);
	line-height: 1.9;
	margin-bottom: 16px;
}

.product-card__price {
	font-family: "EB Garamond", serif;
	font-size: 1.15rem;
	color: var(--c-gold-3);
	margin: 0 0 18px;
}

.product-card__price .woocommerce-Price-amount {
	color: var(--c-gold-3);
}

.product-card__price del {
	color: var(--c-gray);
	opacity: .7;
	font-size: .9rem;
	margin-right: 8px;
}

.product-card__actions {
	margin-top: auto;
	display: flex;
	gap: 10px;
	flex-wrap: wrap;
}

.product-card__actions .btn,
.product-card__actions .button,
.product-card__actions .added_to_cart {
	flex: 1 1 auto;
	min-width: 0;
}

/* ループの add_to_cart を btn 風に */
.product-card__actions a.add_to_cart_button,
.product-card__actions a.button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	padding: 11px 20px;
	font-size: .82rem;
	letter-spacing: .08em;
	border-radius: 4px;
	background: linear-gradient(135deg, var(--c-gold) 0%, var(--c-gold-2) 50%, var(--c-gold-3) 100%);
	color: #fff;
	border: 0;
}

.product-card__actions a.added_to_cart {
	background: var(--c-navy);
	color: #fff;
}

/* -------------------- 口コミカード -------------------- */
.voice-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 28px;
}

.voice-card {
	background: #fff;
	border: 1px solid var(--c-line-gold);
	padding: 32px 28px;
	display: flex;
	flex-direction: column;
	position: relative;
	transition: transform .5s var(--ease), box-shadow .5s var(--ease);
}

.voice-card::before {
	content: "\201C";
	position: absolute;
	top: 10px;
	right: 20px;
	font-family: var(--font-mincho);
	font-size: 3.4rem;
	line-height: 1;
	color: rgba(216, 183, 90, .3);
}


.voice-card__image {
	margin: -32px -28px 20px;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: var(--c-ivory);
}

.voice-card__image img {
	width: 100%;
	height: 100%;
	object-fit: cover;
}

.voice-card__stars {
	display: inline-flex;
	gap: 2px;
	margin-bottom: 14px;
	font-size: .95rem;
	letter-spacing: 1px;
}

.voice-card__stars .star.is-filled {
	color: var(--c-gold-2);
}

.voice-card__stars .star.is-empty {
	color: rgba(6, 31, 92, .18);
}

.voice-card__body {
	color: var(--c-charcoal);
	font-size: .92rem;
	line-height: 2;
	flex: 1;
}

.voice-card__body p {
	margin: 0 0 .8em;
}

.voice-card__meta {
	margin-top: 18px;
	padding-top: 16px;
	border-top: 1px solid var(--c-line);
	display: flex;
	align-items: center;
	gap: 14px;
}

/* 人アイコン／写真は円形に切り抜いて表示（角丸の例外） */
.voice-card__avatar {
	flex: none;
	width: 56px;
	height: 56px;
	border-radius: 50%;
	overflow: hidden;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	background: #fff;
	border: 1px solid var(--c-line-gold);
	color: var(--c-gold-3);
}

.voice-card__avatar img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 50%;
}

.voice-card__avatar .icon {
	width: 30px;
	height: 30px;
}

.voice-card__names {
	display: flex;
	flex-direction: column;
	gap: 3px;
	min-width: 0;
}

.voice-card__name {
	font-family: var(--font-mincho);
	font-size: 1rem;
	color: var(--c-navy);
	letter-spacing: .06em;
}

.voice-card__age {
	font-size: .8rem;
	color: var(--c-gray);
}

/* -------------------- 投稿カード -------------------- */
.post-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 32px;
}

.post-card {
	background: #fff;
	border: 1px solid var(--c-line);
	transition: transform .5s var(--ease), box-shadow .5s var(--ease);
}

.post-card:hover {
	transform: translateY(-5px);
	box-shadow: var(--shadow-soft);
}

.post-card__thumb {
	display: block;
	aspect-ratio: 4 / 3;
	overflow: hidden;
	background: var(--c-ivory);
}

.post-card__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	transition: transform .8s var(--ease);
}

.post-card:hover .post-card__thumb img {
	transform: scale(1.05);
}

.post-card__body {
	padding: 22px 22px 26px;
}

.post-card__date {
	font-size: .78rem;
	letter-spacing: .1em;
	color: var(--c-gold-3);
}

.post-card__title {
	font-size: 1.1rem;
	margin: 8px 0 12px;
	color: var(--c-navy);
	line-height: 1.6;
}

.post-card__excerpt {
	font-size: .86rem;
	color: var(--c-gray);
	margin: 0;
}

/* -------------------- 3カラム特徴 -------------------- */
.feature-columns {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 28px;
}

.feature-columns__item {
	background: #fff;
	border: 1px solid var(--c-line);
	border-top: 3px solid var(--c-gold);
	padding: 34px 28px;
}

.section--dark .feature-columns__item,
.section--ivory .feature-columns__item {
	background: #fff;
}

/* 特徴カードの画像（カード幅いっぱいにブリード。角丸なし） */
.feature-columns__thumb {
	margin: -34px -28px 24px;
	aspect-ratio: 16 / 10;
	overflow: hidden;
	background: var(--c-ivory);
	border-radius: 0;
}

.feature-columns__thumb img {
	width: 100%;
	height: 100%;
	object-fit: cover;
	border-radius: 0;
	transition: transform .8s var(--ease);
}

.feature-columns__item:hover .feature-columns__thumb img {
	transform: scale(1.04);
}

.feature-columns__title {
	font-size: 1.15rem;
	color: var(--c-navy);
	margin-bottom: 12px;
}

.feature-columns__item p {
	font-size: .9rem;
	color: var(--c-gray);
	margin: 0;
}

/* -------------------- リードブロック / お問い合わせ -------------------- */
.lead-block {
	max-width: 760px;
	margin: 0 auto 56px;
	text-align: center;
}

.lead-block__text {
	margin: 24px 0 32px;
	line-height: 2.1;
}

.section--dark .lead-block__text {
	color: rgba(255, 255, 255, .86);
}

.contact-block {
	max-width: 720px;
	margin: 0 auto;
	text-align: center;
}

.contact-block__text {
	margin: 24px 0 34px;
	color: rgba(255, 255, 255, .86);
	line-height: 2.1;
}

.contact-block__sns {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 24px;
	margin-top: 34px;
}

.contact-block__sns a {
	display: inline-flex;
	align-items: center;
	gap: 8px;
	color: rgba(255, 255, 255, .86);
	font-size: .88rem;
}

.contact-block__sns a:hover {
	color: var(--c-gold);
}

.contact-block__sns .icon {
	color: var(--c-gold);
}

/* -------------------- LINE CTA セクション -------------------- */
.section--line-cta {
	padding: 80px 0;
	background: var(--c-ivory-2);
}

.line-cta {
	text-align: center;
	max-width: 640px;
	margin: 0 auto;
	background: #fff;
	border: 1px solid var(--c-line);
	border-top: 3px solid #06C755;
	padding: 48px 32px;
}

.line-cta__title {
	font-size: 1.5rem;
	color: var(--c-navy);
	margin-bottom: 14px;
}

.line-cta__text {
	color: var(--c-gray);
	font-size: .92rem;
	margin-bottom: 28px;
}

/* -------------------- 汎用 -------------------- */
.notice-empty {
	text-align: center;
	color: var(--c-gray);
	padding: 40px 0;
}

.pc-only { display: inline; }
.sp-only { display: none; }

/* -------------------- ページ送り -------------------- */
.pagination {
	margin-top: 56px;
}

.pagination__list {
	display: flex;
	justify-content: center;
	flex-wrap: wrap;
	gap: 8px;
}

.pagination__item a,
.pagination__item span {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-width: 44px;
	height: 44px;
	padding: 0 10px;
	border: 1px solid var(--c-line);
	color: var(--c-navy);
	font-size: .9rem;
	transition: background .3s var(--ease), color .3s var(--ease), border-color .3s var(--ease);
}

.pagination__item .current {
	background: var(--c-navy);
	color: #fff;
	border-color: var(--c-navy);
}

.pagination__item a:hover {
	background: var(--c-gold);
	color: #fff;
	border-color: var(--c-gold);
}

/* -------------------- 検索フォーム -------------------- */
.search-form {
	display: flex;
	gap: 8px;
	max-width: 420px;
	margin: 0 auto;
}

.search-form .search-field {
	flex: 1;
	padding: 12px 14px;
	border: 1px solid var(--c-line);
	font-family: inherit;
}

.search-form .search-submit {
	padding: 12px 20px;
	background: var(--c-navy);
	color: #fff;
	border: 0;
	border-radius: 4px;
}

/* -------------------- フェードイン -------------------- */
.fade-up,
.fade-in {
	opacity: 0;
	will-change: opacity, transform;
}

.fade-up {
	transform: translateY(28px);
	transition: opacity .9s var(--ease), transform .9s var(--ease);
}

.fade-in {
	transition: opacity 1s var(--ease);
}

.fade-up.is-visible,
.fade-in.is-visible {
	opacity: 1;
	transform: translateY(0);
}

.fade-up[data-delay="1"] { transition-delay: .12s; }
.fade-up[data-delay="2"] { transition-delay: .24s; }
.fade-up[data-delay="3"] { transition-delay: .36s; }
.fade-up[data-delay="4"] { transition-delay: .48s; }

@media (prefers-reduced-motion: reduce) {
	*,
	*::before,
	*::after {
		animation-duration: .001ms !important;
		animation-iteration-count: 1 !important;
		transition-duration: .001ms !important;
		scroll-behavior: auto !important;
	}
	.fade-up,
	.fade-in {
		opacity: 1;
		transform: none;
	}
}

/* =====================================================================
 * レスポンシブ
 * ===================================================================== */

/* タブレット 768〜1024 */
@media screen and (max-width: 1024px) {
	:root {
		--header-h: 72px;
	}

	.section {
		padding: 72px 0;
	}

	.product-grid,
	.voice-grid,
	.post-grid,
	.feature-columns {
		grid-template-columns: repeat(2, 1fr);
	}

	.site-footer__inner {
		grid-template-columns: 1fr 1fr;
	}

	.site-footer__brand {
		grid-column: 1 / -1;
	}

	/* ハンバーガー表示 */
	.nav-toggle {
		display: block;
	}

	.global-nav {
		position: fixed;
		top: 0;
		right: 0;
		width: min(82vw, 360px);
		height: 100vh;
		flex-direction: column;
		align-items: flex-start;
		justify-content: flex-start;
		gap: 0;
		padding: calc(var(--header-h) + 24px) 32px 40px;
		background: linear-gradient(180deg, var(--c-navy) 0%, var(--c-navy-2) 100%);
		transform: translateX(100%);
		transition: transform .5s var(--ease);
		overflow-y: auto;
	}

	.global-nav.is-open {
		transform: translateX(0);
		box-shadow: -10px 0 40px rgba(0, 0, 0, .25);
	}

	.global-nav__list,
	.global-nav .menu {
		flex-direction: column;
		align-items: flex-start;
		gap: 0;
		width: 100%;
	}

	.global-nav__item,
	.global-nav .menu-item {
		width: 100%;
		border-bottom: 1px solid rgba(255, 255, 255, .12);
	}

	.global-nav__link,
	.global-nav .menu-item a {
		display: block;
		width: 100%;
		padding: 16px 0;
		color: #fff;
	}

	.global-nav__link::after,
	.global-nav .menu-item a::after {
		display: none;
	}

	/* ドロワー内の SNS アイコン */
	.global-nav__sns {
		width: 100%;
		margin-top: 24px;
		padding-left: 0;
		border-left: 0;
		gap: 10px;
	}

	.global-nav__sns-link {
		color: #fff;
	}

	.global-nav__sns-link:hover {
		color: var(--c-gold);
	}

	.global-nav__cart {
		margin-top: 20px;
	}

	.global-nav__cart .cart-link {
		color: #fff;
	}

	body.nav-open {
		overflow: hidden;
	}

	.nav-overlay {
		position: fixed;
		inset: 0;
		background: rgba(6, 31, 92, .45);
		opacity: 0;
		visibility: hidden;
		transition: opacity .5s var(--ease), visibility .5s var(--ease);
		z-index: 8500;
	}

	.nav-overlay.is-open {
		opacity: 1;
		visibility: visible;
	}
}

/* スマホ 767以下 */
@media screen and (max-width: 767px) {
	html {
		font-size: 15px;
	}

	.section {
		padding: 56px 0;
	}

	.section-head {
		margin-bottom: 40px;
	}

	.section-head__title {
		font-size: 1.6rem;
	}

	.product-grid,
	.voice-grid,
	.post-grid,
	.feature-columns {
		grid-template-columns: 1fr;
		gap: 20px;
	}

	.btn {
		width: 100%;
		min-width: 0;
	}

	.fv__cta .btn,
	.line-cta .btn,
	.error-404__links .btn {
		width: 100%;
	}

	.site-footer__inner {
		grid-template-columns: 1fr;
		gap: 36px;
	}

	.pc-only { display: none; }
	.sp-only { display: inline; }

	.line-cta {
		padding: 36px 22px;
	}
}