@charset "utf-8";

:root {
	--red: #D51C37;
	--red-dark: #A81330;
	--blue: #16599F;
	--blue-dark: #0D3760;
	--ink: #1A1B1F;
	--body: #4B4F58;
	--mute: #686E7A;
	--line: #E8E9EC;
	--bg-soft: #F4F5F7;
	--maxw: 1120px;
	--gut: clamp(18px, 4vw, 44px);
	--sec-y: clamp(72px, 10vw, 140px);
	--en: 'Archivo', sans-serif;
	--ja: 'Noto Sans JP', sans-serif;
}

* { box-sizing: border-box; }

html { scroll-behavior: smooth; }

body {
	margin: 0;
	background: #fff;
	color: var(--ink);
	font-family: var(--ja);
	overflow-x: clip;
	/* 日本語を文節単位で折り返す。非対応ブラウザは従来どおり */
	word-break: auto-phrase;
	-webkit-font-smoothing: antialiased;
}

img { max-width: 100%; height: auto; }
a { color: var(--blue); text-decoration: none; }
a:hover { color: var(--red); }
button { font-family: inherit; }
::selection { background: var(--red); color: #fff; }
section[id] { scroll-margin-top: 80px; }

.sr-only {
	position: absolute; width: 1px; height: 1px;
	padding: 0; margin: -1px; overflow: hidden;
	clip: rect(0 0 0 0); white-space: nowrap; border: 0;
}

/* ---------- keyframes ---------- */
@keyframes heroZoom { from { transform: scale(1); } to { transform: scale(1.06); } }
@keyframes lineUp { from { transform: translateY(112%); } to { transform: translateY(0); } }
@keyframes rise { from { opacity: 0; transform: translateY(36px); } to { opacity: 1; transform: translateY(0); } }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes floaty { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-12px); } }
@keyframes scrollPulse { 0% { transform: scaleY(0); transform-origin: top; } 45% { transform: scaleY(1); transform-origin: top; } 55% { transform: scaleY(1); transform-origin: bottom; } 100% { transform: scaleY(0); transform-origin: bottom; } }
@keyframes growX { to { transform: scaleX(1); } }
@keyframes heroLift { to { transform: translateY(-90px); opacity: .12; } }
@keyframes slideL { from { opacity: 0; transform: translateX(-64px); } }
@keyframes slideR { from { opacity: 0; transform: translateX(48px); } }
@keyframes cardIn { from { opacity: 0; transform: translateY(52px) rotate(-2.5deg) scale(.96); } }
@keyframes tiltL { from { opacity: 0; transform: translateY(44px) rotate(-5deg); } }
@keyframes tiltR { from { opacity: 0; transform: translateY(44px) rotate(5deg); } }
@keyframes prlxY { from { transform: translateY(70px); } to { transform: translateY(-70px); } }
@keyframes phList { to { transform: translateY(-230px); } }
@keyframes trackIn { from { opacity: 0; letter-spacing: .28em; } }
@keyframes wmX { from { transform: translateX(5vw); } to { transform: translateX(-7vw); } }
@keyframes spinSlow { to { transform: rotate(360deg); } }
@keyframes spinBack { to { transform: rotate(-360deg); } }

/* スクロール連動。overflow:clip を使うこと（hiddenだとスクロールコンテナ化して停止する） */
@supports (animation-timeline: view()) {
	.rv { animation: rise .9s cubic-bezier(.22,.65,.25,1) both; animation-timeline: view(); animation-range: cover 0% cover 35%; }
	.rv-l { animation: slideL 1s cubic-bezier(.22,.65,.25,1) both; animation-timeline: view(); animation-range: cover 0% cover 32%; }
	.rv-r { animation: slideR 1s cubic-bezier(.22,.65,.25,1) both; animation-timeline: view(); animation-range: cover 4% cover 40%; }
	.rv-card { animation: cardIn 1s cubic-bezier(.22,.65,.25,1) both; animation-timeline: view(); animation-range: cover 0% cover 38%; }
	.igt:nth-child(odd) { animation: tiltL 1s cubic-bezier(.22,.65,.25,1) both; animation-timeline: view(); animation-range: cover 0% cover 38%; }
	.igt:nth-child(even) { animation: tiltR 1s cubic-bezier(.22,.65,.25,1) both; animation-timeline: view(); animation-range: cover 0% cover 38%; }
	.hero-par { animation: heroLift linear both; animation-timeline: view(); animation-range: exit 0% exit 85%; }
	.prlx { animation: prlxY linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; }
	.phlist { animation: phList linear both; animation-timeline: --ph; animation-range: cover 15% cover 85%; }
	.track-in { animation: trackIn 1s cubic-bezier(.22,.65,.25,1) both; animation-timeline: view(); animation-range: cover 0% cover 45%; }
	.wm { animation: wmX linear both; animation-timeline: view(); animation-range: cover 0% cover 100%; }
}
@supports (animation-timeline: scroll(root)) {
	.pgbar { animation: growX linear both; animation-timeline: scroll(root); }
}
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation-duration: .01ms !important; animation-iteration-count: 1 !important; transition-duration: .01ms !important; }
}

/* ---------- layout ---------- */
.wrap { max-width: var(--maxw); margin-inline: auto; }
.sec { padding: var(--sec-y) var(--gut); }
.sec--soft { background: var(--bg-soft); }

.sec-head { display: flex; flex-direction: column; align-items: flex-start; gap: 14px; margin-bottom: clamp(32px, 4vw, 52px); }
.sec-head__en { display: inline-flex; align-items: center; gap: 12px; margin: 0; font-family: var(--en); font-weight: 800; font-size: clamp(12px, 1.5vw, 14px); line-height: 1; letter-spacing: .26em; color: var(--red); }
.sec-head__en::before { content: ""; width: 36px; height: 2px; background: var(--red); flex-shrink: 0; }
.sec-head__ja { font-size: clamp(27px, 4.2vw, 44px); font-weight: 900; color: var(--ink); letter-spacing: .05em; line-height: 1.4; }
.sec-head--tight { margin-bottom: 18px; }
.sec-head--center { align-items: center; text-align: center; }
.sec-head--center .sec-head__en::after { content: ""; width: 36px; height: 2px; background: var(--red); flex-shrink: 0; }
.sec--dark .sec-head--center .sec-head__en::after { background: #fff; }
.sec--dark .sec-head__en { color: #fff; }
.sec--dark .sec-head__en::before { background: #fff; }
.sec--dark .sec-head__ja { color: #fff; }

.btn {
	display: inline-flex; align-items: center; gap: 12px;
	border-radius: 60px; padding: 13px 32px;
	font-family: var(--en); font-weight: 700; font-size: 13px; letter-spacing: .18em;
	border: 1.5px solid var(--ink); color: var(--ink);
	transition: background .2s, color .2s, transform .2s;
}
.btn:hover { background: var(--ink); color: #fff; }
.btn--ghost-light { border-color: rgba(255,255,255,.8); color: #fff; }
.btn--ghost-light:hover { background: #fff; color: var(--red); }
.btn--red { background: var(--red); border-color: var(--red); color: #fff; padding: 15px 36px; font-size: 14px; box-shadow: 0 10px 26px rgba(213,28,55,.3); }
.btn--red:hover { background: #b8152e; color: #fff; transform: translateY(-2px); }

/* ---------- header ---------- */
.hdr {
	position: fixed; inset: 0 0 auto; z-index: 100;
	display: flex; align-items: center; justify-content: space-between;
	padding: clamp(10px, 1.1vw, 12px) var(--gut);
	transition: background .4s ease, backdrop-filter .4s ease;
}
.hdr.is-scrolled { background: rgba(10,14,24,.82); backdrop-filter: blur(12px); }
.hdr__logo img { height: clamp(52px, 6vw, 96px); width: auto; display: block; filter: drop-shadow(0 2px 10px rgba(0,0,0,.5)); }
.hdr__toggle {
	display: flex; flex-direction: column; align-items: flex-end; gap: 6px;
	background: rgba(26,27,31,.55); backdrop-filter: blur(8px);
	border: 1px solid rgba(255,255,255,.25); border-radius: 50px;
	padding: 17px 20px; cursor: pointer;
}
.hdr__toggle span { width: 26px; height: 2px; background: #fff; display: block; border-radius: 2px; }
.hdr__toggle span:nth-child(2) { width: 18px; }

.pgbar {
	position: fixed; inset: 0 0 auto; height: 3px; z-index: 220;
	background: linear-gradient(90deg, var(--red) 0%, var(--blue) 100%);
	transform: scaleX(0); transform-origin: 0 50%; pointer-events: none;
}

/* ---------- fullscreen menu ---------- */
.gnav {
	position: fixed; inset: 0; z-index: 300;
	background: rgba(255,255,255,.98); backdrop-filter: blur(10px);
	display: flex; flex-direction: column; padding: clamp(20px, 4vw, 44px);
	overflow: auto;
	visibility: hidden; opacity: 0; transition: opacity .3s ease, visibility .3s;
}
.gnav.is-open { visibility: visible; opacity: 1; }
.gnav__top { display: flex; align-items: center; justify-content: space-between; }
.gnav__top img { height: 58px; }
.gnav__close {
	background: var(--ink); color: #fff; border: none; border-radius: 50%;
	width: 52px; height: 52px; font-size: 26px; line-height: 1; cursor: pointer;
}
.gnav__list {
	margin: auto 0; padding: 40px 0; list-style: none;
	display: flex; flex-direction: column; gap: clamp(8px, 1.6vh, 18px);
}
.gnav__list a { display: flex; align-items: baseline; gap: 18px; color: var(--ink); }
.gnav__list a:hover { color: var(--red); }
.gnav__en { font-family: var(--en); font-weight: 900; font-size: clamp(30px, 5.5vw, 56px); letter-spacing: .04em; }
.gnav__ja { font-size: 13px; font-weight: 700; color: var(--mute); }
.gnav__meta { display: flex; flex-wrap: wrap; gap: 8px 24px; align-items: center; font-size: 13px; color: var(--mute); }
.gnav__meta strong { font-weight: 700; color: var(--ink); }

/* ---------- hero ---------- */
.hero { position: relative; height: 100svh; min-height: 600px; overflow: clip; display: flex; align-items: flex-end; }
.hero__slides { position: absolute; inset: 0; }
.hero__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(1) contrast(1.03) brightness(1.03); }
.hero__slide { opacity: 0; transition: opacity 1.6s ease; }
.hero__slide.is-active { opacity: 1; animation: heroZoom 18s ease-out both; }
/* トップの暗幕はキャッチコピーが乗る下側だけ。上半分は写真の色をそのまま見せる */
.hero__grad { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(6,10,20,.55) 0%, rgba(6,10,20,.28) 20%, rgba(6,10,20,0) 46%); }
.hero__inner { position: relative; z-index: 2; width: 100%; padding: clamp(28px,6vw,72px) var(--gut) clamp(48px,8vh,88px); }
.hero__bar { width: 40px; height: 2px; background: var(--red); flex-shrink: 0; }
.hero__eyebrow {
	display: inline-flex; align-items: stretch; gap: 0; margin-bottom: 26px; color: #fff;
	border-radius: 14px; overflow: hidden;
	background: rgba(10,14,24,.42); backdrop-filter: blur(10px);
	border: 1px solid rgba(255,255,255,.2);
	box-shadow: 0 12px 34px rgba(0,0,0,.32);
	animation: fadeIn .9s .1s both;
}
/* 頭文字のスタンプ。CARS の由来がここで伝わる */
.hero__stamp {
	position: relative; flex-shrink: 0; width: clamp(52px,6vw,64px);
	background: var(--red); display: grid; place-items: center; overflow: hidden;
}
.hero__letter {
	grid-area: 1 / 1; font-family: var(--en); font-weight: 900;
	font-size: clamp(26px,3.2vw,34px); line-height: 1; color: #fff;
	opacity: 0; transform: translateY(60%) rotate(-8deg);
	transition: opacity .45s ease, transform .55s cubic-bezier(.22,.65,.25,1);
}
.hero__letter.is-active { opacity: 1; transform: none; }

.hero__words { position: relative; display: grid; padding: 11px clamp(18px,2.2vw,26px) 13px; min-width: min(74vw, 420px); overflow: hidden; }
.hero__word {
	grid-area: 1 / 1; display: flex; flex-direction: column; gap: 3px; justify-content: center;
	opacity: 0; transform: translateY(100%);
	transition: opacity .45s ease, transform .6s cubic-bezier(.22,.65,.25,1);
}
.hero__word.is-active { opacity: 1; transform: none; }
.hero__word.is-out { opacity: 0; transform: translateY(-100%); }
.hero__word-en { font-family: var(--en); font-weight: 800; font-size: clamp(9.5px,1.1vw,11px); letter-spacing: .26em; color: rgba(255,255,255,.72); }
.hero__word-ja { font-size: clamp(17px,2.2vw,23px); font-weight: 900; letter-spacing: .04em; line-height: 1.35; white-space: nowrap; }

/* 切り替わりまでの残り時間 */
.hero__prog { position: absolute; left: 0; right: 0; bottom: 0; height: 2px; background: rgba(255,255,255,.16); }
.hero__prog i { display: block; height: 100%; width: 100%; background: var(--red); transform-origin: left center; transform: scaleX(0); }
.hero__prog i.run { animation: heroProg linear forwards; }
@keyframes heroProg { from { transform: scaleX(0); } to { transform: scaleX(1); } }

@media (prefers-reduced-motion: reduce) { .hero__prog { display: none; } }
.hero__title { margin: 0; color: #fff; font-weight: 900; font-size: clamp(27px,4.8vw,62px); line-height: 1.42; letter-spacing: .06em; text-shadow: 0 4px 36px rgba(0,0,0,.55), 0 1px 3px rgba(0,0,0,.3); }
.hero__title > span { display: block; overflow: hidden; padding-bottom: .1em; }
.hero__title > span:first-child { margin-bottom: -.1em; }
.hero__title i { font-style: normal; display: inline-block; animation: lineUp 1s .2s cubic-bezier(.22,.65,.25,1) both; }
.hero__title > span:nth-child(2) i { animation-delay: .38s; }
.hero__cta { display: flex; flex-wrap: wrap; align-items: center; gap: 14px 28px; margin-top: 30px; animation: rise .9s .65s cubic-bezier(.22,.65,.25,1) both; }
.hero__cta .btn { border-color: rgba(255,255,255,.7); color: #fff; padding: 14px 34px; font-size: 14px; }
.hero__cta .btn:hover { background: #fff; color: var(--ink); }
.hero__tag { color: rgba(255,255,255,.75); font-size: 12.5px; letter-spacing: .12em; }
.hero__scroll { position: absolute; bottom: 0; right: var(--gut); z-index: 2; display: flex; flex-direction: column; align-items: center; gap: 10px; }
.hero__scroll span:first-child { color: rgba(255,255,255,.7); font-family: var(--en); font-size: 10px; letter-spacing: .3em; writing-mode: vertical-rl; }
.hero__scroll span:last-child { width: 1px; height: 56px; background: linear-gradient(180deg, rgba(255,255,255,.8), rgba(255,255,255,0)); animation: scrollPulse 2.2s cubic-bezier(.6,0,.3,1) infinite; }

/* ---------- philosophy ---------- */
.ph { position: relative; overflow: clip; padding-bottom: clamp(48px,7vw,96px); }
.ph__lead { margin: 0 0 clamp(32px,5vw,56px); font-size: clamp(14px,1.7vw,16.5px); line-height: 2.1; color: var(--body); max-width: 640px; }
.ph__stack { display: flex; flex-direction: column; }
.ph__item { position: sticky; padding-bottom: 24px; }
.ph__item:nth-child(1) { top: clamp(72px,10vh,92px); }
.ph__item:nth-child(2) { top: calc(clamp(72px,10vh,92px) + 14px); }
.ph__item:nth-child(3) { top: calc(clamp(72px,10vh,92px) + 28px); }
.ph__item:nth-child(4) { top: calc(clamp(72px,10vh,92px) + 42px); }
.ph__card {
	display: grid; grid-template-columns: repeat(auto-fit, minmax(min(320px,100%), 1fr));
	min-height: min(62vh, 540px); border-radius: 22px; overflow: clip;
	color: #fff; box-shadow: 0 30px 70px rgba(26,27,31,.28);
}
.ph__card--c { background: linear-gradient(135deg, #D51C37 0%, #A81330 100%); }
.ph__card--a { background: linear-gradient(135deg, #16599F 0%, #0D3760 100%); }
.ph__card--r { background: linear-gradient(135deg, #1A1B1F 0%, #101116 100%); }
.ph__card--s { background: linear-gradient(135deg, #F6F7F9 0%, #ECEDF1 100%); color: var(--ink); }
.ph__body { position: relative; padding: clamp(26px,4vw,54px); display: flex; flex-direction: column; justify-content: space-between; gap: 26px; }
.ph__ghost { position: absolute; right: -.05em; bottom: -.16em; font-family: var(--en); font-weight: 900; font-size: clamp(180px,26vw,330px); line-height: 1; color: transparent; -webkit-text-stroke: 2px rgba(255,255,255,.22); pointer-events: none; }
.ph__card--r .ph__ghost { -webkit-text-stroke-color: rgba(213,28,55,.45); }
.ph__card--s .ph__ghost { -webkit-text-stroke-color: rgba(213,28,55,.22); }
.ph__meta { display: flex; align-items: center; gap: 14px; position: relative; }
.ph__num { font-family: var(--en); font-weight: 800; font-size: 12px; letter-spacing: .18em; border: 1.5px solid rgba(255,255,255,.5); border-radius: 40px; padding: 6px 14px; }
.ph__card--s .ph__num { border-color: rgba(26,27,31,.35); }
.ph__en { font-family: var(--en); font-weight: 800; font-size: clamp(13px,1.5vw,16px); letter-spacing: .22em; color: rgba(255,255,255,.85); }
.ph__card--s .ph__en { color: var(--red); }
.ph__txt { position: relative; }
.ph__ja { font-size: clamp(24px,3.4vw,42px); font-weight: 900; line-height: 1.6; letter-spacing: .04em; }
.ph__rule { margin-top: 16px; width: 56px; height: 3px; background: rgba(255,255,255,.6); }
.ph__card--r .ph__rule, .ph__card--s .ph__rule { background: var(--red); }
.ph__media { position: relative; min-height: 260px; }
.ph__media img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; }

/* ---------- news ---------- */
.nrow { display: flex; align-items: center; gap: clamp(14px,2.5vw,32px); padding: 22px 6px; border-bottom: 1px solid var(--line); color: var(--ink); transition: background .15s; }
.nrow:hover { background: #FAFAFB; color: var(--ink); }
.nrow__date { font-family: var(--en); font-weight: 700; font-size: 13px; letter-spacing: .08em; color: var(--mute); min-width: 88px; }
.nrow__tag { flex-shrink: 0; font-size: 11px; font-weight: 700; color: var(--red); border: 1px solid var(--red); border-radius: 30px; padding: 4px 12px; letter-spacing: .08em; }
.nrow__title { font-size: clamp(14px,1.6vw,16px); font-weight: 500; line-height: 1.6; flex: 1; min-width: 0; }
.narr { color: var(--red); font-family: var(--en); font-weight: 700; transition: transform .25s cubic-bezier(.2,.7,.2,1); }
.nrow:hover .narr { transform: translateX(8px); }

/* ---------- service ---------- */
.sec--service { background: linear-gradient(160deg, #D51C37 0%, #A81330 55%, #8C0F28 100%); color: #fff; position: relative; overflow: clip; }
.sec--wm { position: relative; overflow: clip; }
.sec--wm > .wrap { position: relative; z-index: 1; }
.wm { position: absolute; right: -4vw; bottom: -.16em; font-family: var(--en); font-weight: 900; font-size: clamp(100px,18vw,260px); line-height: 1; color: rgba(255,255,255,.06); letter-spacing: .02em; pointer-events: none; white-space: nowrap; }
.wm--light { color: rgba(26,27,31,.055); }
.svc__lead { margin: 0 0 clamp(36px,5vw,56px); font-size: clamp(16px,2vw,21px); font-weight: 700; line-height: 1.9; letter-spacing: .06em; max-width: 640px; }
.svc__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(300px,100%), 1fr)); gap: 14px; }
.scard { background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.22); border-radius: 10px; padding: 26px 24px; display: flex; flex-direction: column; gap: 10px; color: #fff; transition: background .2s, border-color .2s, transform .3s cubic-bezier(.2,.7,.2,1); }
.scard:hover { background: rgba(255,255,255,.18); border-color: rgba(255,255,255,.55); color: #fff; transform: translateY(-5px); }
.scard__top { display: flex; align-items: center; justify-content: space-between; }
.scard::after { content: "→"; font-family: var(--en); font-weight: 700; font-size: 13px; margin-top: auto; padding-top: 10px; opacity: .6; transition: transform .25s cubic-bezier(.2,.7,.2,1), opacity .25s; }
.scard:hover::after { opacity: 1; transform: translateX(6px); }
.scard__num { font-family: var(--en); font-weight: 800; font-size: 24px; opacity: .9; }
.scard__en { font-family: var(--en); font-size: 10px; font-weight: 700; letter-spacing: .16em; opacity: .65; }
.scard h3 { margin: 0; font-size: 18px; font-weight: 900; letter-spacing: .04em; }
.scard p { margin: 0; font-size: 13px; line-height: 1.8; color: rgba(255,255,255,.82); }

/* ---------- stock ---------- */
.stock { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(320px,100%), 1fr)); gap: clamp(36px,5vw,72px); align-items: center; }
.stock__lead { margin: 0 0 26px; font-size: 15.5px; line-height: 2; color: var(--body); max-width: 420px; }
.phone { display: flex; justify-content: center; position: relative; view-timeline: --ph; }
.phone__glow { position: absolute; top: 50%; left: 50%; transform: translate(-50%,-50%); width: min(460px,96%); aspect-ratio: 1; border-radius: 50%; background: radial-gradient(circle, rgba(22,89,159,.14) 0%, rgba(22,89,159,.06) 52%, transparent 70%); pointer-events: none; }
.phone__ring { position: absolute; top: 8%; right: 6%; width: 72px; height: 72px; border-radius: 50%; border: 2px dashed rgba(213,28,55,.35); pointer-events: none; }
.phone__body { position: relative; width: min(300px,80vw); background: var(--ink); border-radius: 42px; padding: 12px; box-shadow: 0 40px 80px rgba(26,27,31,.28); animation: floaty 6s ease-in-out infinite; }
.phone__screen { background: #fff; border-radius: 32px; overflow: hidden; }
.phone__notch { display: flex; justify-content: center; padding: 10px 0 6px; }
.phone__notch span { width: 88px; height: 22px; background: var(--ink); border-radius: 20px; display: block; }
.phone__head { padding: 12px 16px 8px; display: flex; align-items: center; justify-content: space-between; }
.phone__head b { font-family: var(--en); font-weight: 800; font-size: 14px; letter-spacing: .08em; color: var(--red); }
.phone__head span { font-size: 10px; color: var(--mute); }
.phone__vp { max-height: 470px; overflow: hidden; }
.phlist { display: flex; flex-direction: column; gap: 10px; padding: 4px 14px 20px; }
.pcar { border: 1px solid var(--line); border-radius: 12px; overflow: hidden; }
.pcar__img { aspect-ratio: 16/9; overflow: hidden; }
.pcar__img img { width: 100%; height: 100%; object-fit: cover; object-position: 60% center; }
.pcar__ph { aspect-ratio: 16/9; display: flex; align-items: center; justify-content: center; background: repeating-linear-gradient(135deg,#F2F3F5,#F2F3F5 10px,#E9EAEE 10px,#E9EAEE 20px); font-family: var(--en); font-size: 9px; letter-spacing: .14em; color: var(--mute); }
.pcar__body { padding: 10px 12px; }
.pcar__name { font-size: 12px; font-weight: 900; }
.pcar__price { font-family: var(--en); font-weight: 800; font-size: 15px; color: var(--red); margin-top: 2px; }
.pcar__price small { font-family: var(--ja); font-size: 9px; color: var(--mute); font-weight: 500; }

.stock__links { display: flex; flex-direction: column; gap: 14px; max-width: 400px; }
.slink {
	--brand: var(--red);
	position: relative; display: grid; grid-template-columns: auto 1fr auto; align-items: center; gap: 16px;
	background: #fff; border: 1.5px solid var(--line); border-radius: 14px;
	padding: 16px 20px 16px 26px; overflow: hidden;
	color: var(--ink); box-shadow: 0 8px 22px rgba(26,27,31,.06);
	transition: border-color .25s, box-shadow .25s, transform .25s, background .25s;
}
/* 左端にブランド色の帯を出し、ボタンごとの色を明確にする */
.slink::before { content: ""; position: absolute; left: 0; top: 0; bottom: 0; width: 6px; background: var(--brand); }
.slink:hover {
	color: var(--ink); transform: translateY(-3px);
	border-color: var(--brand);
	background: color-mix(in srgb, var(--brand) 5%, #fff);
	box-shadow: 0 16px 34px color-mix(in srgb, var(--brand) 26%, transparent);
}
.slink--goo { --brand: #DC0000; }
.slink--cs  { --brand: #FF6010; }
.slink__logo { display: block; width: auto; height: 30px; flex-shrink: 0; }
.slink--cs .slink__logo { height: 23px; }
.slink__txt { font-size: 13px; font-weight: 700; letter-spacing: .03em; line-height: 1.5; }
.slink__arw { color: var(--brand); font-family: var(--en); font-weight: 800; transition: transform .25s cubic-bezier(.2,.7,.2,1); }
.slink:hover .slink__arw { transform: translateX(6px); }

/* ---------- instagram ---------- */
.sec--ig { padding-top: 0; }
.ig__head { display: flex; align-items: baseline; justify-content: space-between; gap: 20px; flex-wrap: wrap; margin-bottom: clamp(28px,3.5vw,44px); }
.ig__grid { display: grid; grid-template-columns: repeat(6, 1fr); gap: 10px; }
@media (max-width: 900px) { .ig__grid { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 560px) { .ig__grid { grid-template-columns: repeat(2, 1fr); } }
.igt { aspect-ratio: 1; border-radius: 8px; overflow: hidden; }
.igt img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.igt:hover img { transform: scale(1.07); }
/* Smash Balloon の出力をテーマのデザインに合わせる（プラグイン有効時） */
.ig__grid #sb_instagram { grid-column: 1 / -1; width: 100%; padding: 0 !important; }
.ig__grid #sbi_images {
	display: grid; grid-template-columns: repeat(6, 1fr);
	gap: 10px !important; margin: 0 !important; padding: 0 !important; width: 100% !important;
}
@media (max-width: 900px) { .ig__grid #sbi_images { grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 560px) { .ig__grid #sbi_images { grid-template-columns: repeat(2, 1fr); } }
.ig__grid .sbi_item {
	width: auto !important; max-width: none !important; height: auto !important;
	margin: 0 !important; padding: 0 !important; float: none !important;
	aspect-ratio: 1; border-radius: 8px; overflow: hidden;
}
.ig__grid .sbi_photo_wrap { width: 100%; height: 100%; padding: 0 !important; }
.ig__grid .sbi_photo {
	display: block; width: 100%; height: 100%; padding: 0 !important;
	background-size: cover !important; background-position: center !important;
}
.ig__grid .sbi_photo img { width: 100%; height: 100%; object-fit: cover; display: block; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.ig__grid .sbi_photo:hover img { transform: scale(1.07); }
/* テーマ側に見出しとFOLLOWボタンがあるため、プラグインの同等要素は出さない */
.ig__grid #sbi_header_outer, .ig__grid .sbi_header_outer,
.ig__grid #sbi_load, .ig__grid .sbi_load_btn, .ig__grid .sbi_follow_btn { display: none !important; }

.igt--ph { display: flex; align-items: center; justify-content: center; background: repeating-linear-gradient(135deg,#F2F3F5,#F2F3F5 10px,#E9EAEE 10px,#E9EAEE 20px); font-family: var(--en); font-size: 9px; letter-spacing: .14em; color: var(--mute); }

/* ---------- company ---------- */
.cmp { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(300px,100%), 1fr)); gap: clamp(32px,5vw,64px); align-items: start; margin-top: clamp(28px,4vw,44px); }
.cmp__lead { margin: 0 0 26px; font-size: 15px; line-height: 2.1; color: var(--body); }
.cmp__link { display: inline-flex; align-items: center; gap: 10px; font-family: var(--en); font-weight: 700; font-size: 12px; letter-spacing: .16em; color: var(--ink); border-bottom: 2px solid var(--red); padding-bottom: 6px; }
.cmp__link:hover { color: var(--red); }
.cmp__table { background: #fff; border-radius: 12px; padding: clamp(24px,3vw,40px); box-shadow: 0 12px 34px rgba(26,27,31,.06); }
.cmp__row { display: flex; gap: 18px; padding: 15px 0; border-bottom: 1px solid #EDEEF1; }
.cmp__row:last-child { border-bottom: none; }
.cmp__row dt { font-family: var(--en); font-weight: 800; font-size: 11px; letter-spacing: .16em; color: var(--red); min-width: 92px; padding-top: 3px; margin: 0; }
.cmp__row dd { margin: 0; font-size: 14px; line-height: 1.7; color: var(--ink); font-weight: 500; }
.cmp__note { display: block; font-size: 11.5px; font-weight: 700; color: var(--blue); }
.cmp__note:hover { color: var(--red); }

/* ---------- access ---------- */
.acc { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(320px,100%), 1fr)); gap: clamp(24px,3vw,40px); align-items: stretch; }
.acc__map { position: relative; min-height: 340px; border-radius: 12px; overflow: hidden; border: 1px solid var(--line); }
.acc__map iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.cal { background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: clamp(20px,2.6vw,32px); }
.cal__head { display: flex; flex-wrap: wrap; align-items: baseline; justify-content: space-between; gap: 12px; margin-bottom: 18px; }
.cal__head h3 { margin: 0; font-size: clamp(17px,2vw,21px); font-weight: 900; }
.cal__nav { display: flex; align-items: center; gap: 10px; }
.cal__nav h3 { min-width: 8.5em; text-align: center; }
.cal__arrow {
	flex: none; width: 32px; height: 32px; border-radius: 50%; cursor: pointer;
	border: 1px solid var(--line); background: #fff; color: var(--ink);
	font-size: 18px; line-height: 1; display: flex; align-items: center; justify-content: center;
	transition: background .2s, color .2s, border-color .2s;
}
.cal__arrow:hover:not(:disabled) { background: var(--red); border-color: var(--red); color: #fff; }
.cal__arrow:disabled { opacity: .3; cursor: default; }
.cal__legend { display: flex; flex-wrap: wrap; gap: 14px; font-size: 11.5px; color: var(--body); font-weight: 700; }
.cal__legend span { display: inline-flex; align-items: center; gap: 6px; }
.cal__chip { width: 12px; height: 12px; border-radius: 3px; }
.cal__chip--open { background: #fff; border: 1px solid #D6D8DE; }
.cal__chip--closed { background: #F0F1F4; }
.cal__chip--temp { background: rgba(213,28,55,.12); border: 1px solid rgba(213,28,55,.5); }
.cal__chip--tempopen { background: rgba(22,89,159,.1); border: 1px solid rgba(22,89,159,.5); }
.cal__chip--event { background: rgba(240,160,0,.18); border: 1px solid rgba(200,120,0,.6); }
.cal__dow, .cal__grid { display: grid; grid-template-columns: repeat(7,1fr); gap: 5px; }
.cal__dow { margin-bottom: 5px; }
.cal__dow div { text-align: center; font-size: 11px; font-weight: 700; color: var(--mute); }
.cal__dow div:first-child { color: #D97785; }
.cal__dow div:nth-child(3), .cal__dow div:nth-child(4) { color: var(--red); }
.cal__dow div:last-child { color: var(--blue); }
.cal__cell {
	display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px;
	aspect-ratio: 1; border-radius: 8px;
	background: #fff; color: var(--ink); border: 1px solid var(--line);
}
.cal__cell--empty { background: transparent; border-color: transparent; }
.cal__cell--closed { background: #F0F1F4; color: #B4B8C0; }
.cal__cell--temp { background: rgba(213,28,55,.12); color: var(--red); }
/* 定休曜日でも営業する日（祝日など） */
.cal__cell--open { background: rgba(22,89,159,.1); color: var(--blue); }
/* フェアなどのイベント開催日 */
.cal__cell--event { background: rgba(240,160,0,.18); color: #A35F00; }
.cal__cell--today { border: 2px solid var(--red); }
.cal__cell b { font-family: var(--en); font-weight: 700; font-size: 13px; line-height: 1; }
.cal__cell small { font-size: 8.5px; font-weight: 700; opacity: .8; }
.cal__cell--event small { font-size: 10px; opacity: 1; }
.cal__events { list-style: none; margin: 14px 0 0; padding: 0; display: flex; flex-direction: column; gap: 6px; }
.cal__event { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; font-size: 12.5px; font-weight: 700; color: #A35F00; }
.cal__event-date { font-family: var(--en); font-weight: 800; font-size: 11.5px; letter-spacing: .04em; color: var(--mute); }
.cal__event a { color: inherit; border-bottom: 1px solid rgba(163,95,0,.4); }
.cal__event a:hover { color: var(--red); border-color: var(--red); }
.cal__note { margin: 16px 0 0; font-size: 11.5px; color: var(--mute); line-height: 1.7; }

/* ---------- contact ---------- */
.sec--contact { background: linear-gradient(150deg, #16599F 0%, #114679 55%, #0D3760 100%); color: #fff; text-align: center; }
.ct__lead { margin: 0 auto clamp(32px,4vw,48px); font-size: clamp(14px,1.7vw,17px); line-height: 2; color: rgba(255,255,255,.85); max-width: 560px; }
.ct__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(240px,100%), 1fr)); gap: 16px; max-width: 860px; margin: 0 auto; }
.ct__card { display: flex; flex-direction: column; align-items: center; gap: 10px; background: rgba(255,255,255,.08); border: 1px solid rgba(255,255,255,.3); border-radius: 14px; padding: 30px 22px; color: #fff; transition: background .2s; }
.ct__card:hover { background: rgba(255,255,255,.16); color: #fff; }
.ct__card--solid { background: #fff; border-color: #fff; color: var(--blue); }
.ct__card--solid:hover { background: rgba(255,255,255,.9); color: var(--blue); }
.ct__label { font-family: var(--en); font-weight: 800; font-size: 11px; letter-spacing: .2em; opacity: .75; }
.ct__tel { font-family: var(--en); font-weight: 800; font-size: clamp(22px,2.6vw,28px); letter-spacing: .04em; }
.ct__main { font-weight: 900; font-size: clamp(18px,2.2vw,22px); }
.ct__sub { font-size: 12px; opacity: .75; }

/* ---------- footer ---------- */
.ftr { background: #fff; border-top: 1px solid var(--line); padding: clamp(44px,6vw,72px) var(--gut) 36px; }
.ftr__top { display: grid; gap: 28px; padding-bottom: 36px; border-bottom: 1px solid #EDEEF1; }

/* 横幅が取れたら3列に。全幅のボタンが縦に伸びるのを避ける */
@media (min-width: 620px) {
	.ftr__sns .sns { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
}

/* PCはロゴとSNSを上段に横並べ、メニューを下段に回してバランスを取る */
@media (min-width: 1000px) {
	.ftr__top {
		grid-template-columns: auto 1fr;
		grid-template-areas: "logo sns" "nav nav";
		align-items: start;
		column-gap: 48px;
		row-gap: 34px;
	}
	.ftr__logo { grid-area: logo; }
	.ftr__top > nav { grid-area: nav; }
	.ftr__sns { grid-area: sns; align-items: flex-end; }
	.ftr__sns .sns { grid-template-columns: repeat(3, 214px); }
}
.ftr__logo img { height: 52px; margin-bottom: 14px; }
.ftr__addr { margin: 0; font-size: 12.5px; line-height: 1.9; color: var(--mute); }
.ftr__nav { display: flex; flex-wrap: wrap; gap: 10px 26px; list-style: none; margin: 0; padding: 0; }
.ftr__nav a { font-family: var(--en); font-weight: 700; font-size: 12px; letter-spacing: .14em; color: var(--body); }
.ftr__nav a:hover { color: var(--red); }
/* SNSは何のリンクか一目で分かるよう、アイコンに名前と用途を添える */
.ftr__sns { display: flex; flex-direction: column; gap: 10px; }
.ftr__sns-head { font-size: 11px; font-weight: 800; letter-spacing: .14em; color: var(--mute); }
.sns { list-style: none; margin: 0; padding: 0; display: grid; gap: 8px; }
.sns__btn {
	display: flex; align-items: center; gap: 12px;
	padding: 10px 14px; border: 1px solid var(--line); border-radius: 12px;
	background: #fff; color: var(--ink); text-decoration: none;
	transition: border-color .2s, box-shadow .2s, transform .2s;
}
.sns__btn:hover { border-color: var(--c, var(--red)); box-shadow: 0 8px 22px rgba(26,27,31,.08); transform: translateY(-1px); }
.sns__ico {
	flex: none; display: flex; align-items: center; justify-content: center;
	width: 36px; height: 36px; border-radius: 10px;
	background: var(--c, var(--red)); color: #fff;
}
.sns__ico .ico { width: 20px; height: 20px; }
.sns__txt { display: flex; flex-direction: column; gap: 1px; min-width: 0; }
.sns__name { font-size: 13.5px; font-weight: 800; letter-spacing: .02em; }
.sns__note { font-size: 11px; color: var(--mute); white-space: nowrap; }
.sns__arrow { margin-left: auto; font-size: 12px; color: var(--mute); }
.sns__btn:hover .sns__arrow { color: var(--c, var(--red)); }
.sns__btn--insta { --c: #C7368A; }
.sns__btn--fb    { --c: #1877F2; }
.sns__btn--line  { --c: #06C755; }
.ftr__btm { padding-top: 24px; display: flex; flex-wrap: wrap; gap: 10px; align-items: center; justify-content: space-between; }
.ftr__btm span { font-size: 11.5px; color: #B4B8C0; }
.ftr__btm span:last-child { font-family: var(--en); font-weight: 700; font-size: 10px; letter-spacing: .2em; }

/* ---------- 下層ページ共通 ---------- */
.page-hero { position: relative; padding: calc(clamp(72px,10vh,110px) + var(--sec-y)) var(--gut) var(--sec-y); background: var(--ink); color: #fff; overflow: clip; }
.page-hero__en { margin: 0; font-family: var(--en); font-weight: 900; font-size: clamp(44px,8vw,96px); line-height: .95; }
.page-hero__ja { font-size: 14px; font-weight: 700; color: rgba(255,255,255,.7); letter-spacing: .14em; }
.entry-content { font-size: 15.5px; line-height: 2; color: var(--body); }
.entry-content h2 { font-size: clamp(20px,2.6vw,28px); font-weight: 900; color: var(--ink); margin: 2em 0 .8em; padding-left: 14px; border-left: 4px solid var(--red); }
.entry-content h3 { font-size: clamp(17px,2.2vw,21px); font-weight: 900; color: var(--ink); margin: 1.8em 0 .6em; }
.entry-content img { border-radius: 10px; }
.entry-content a { text-decoration: underline; }

.post-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(280px,100%), 1fr)); gap: clamp(20px,3vw,32px); list-style: none; margin: 0; padding: 0; }
.pcard { display: block; color: var(--ink); }
.pcard__thumb { aspect-ratio: 4/3; border-radius: 10px; overflow: hidden; background: repeating-linear-gradient(135deg,#F2F3F5,#F2F3F5 10px,#E9EAEE 10px,#E9EAEE 20px); }
.pcard__thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.pcard:hover .pcard__thumb img { transform: scale(1.06); }
.pcard__meta { display: flex; align-items: center; gap: 10px; margin-top: 12px; }
.pcard__date { font-family: var(--en); font-weight: 700; font-size: 12px; color: var(--mute); }
.pcard__tag { font-size: 10.5px; font-weight: 700; color: var(--red); border: 1px solid var(--red); border-radius: 30px; padding: 3px 10px; }
.pcard__title { margin: 6px 0 0; font-size: 15px; font-weight: 700; line-height: 1.7; }

.pagination { margin-top: clamp(36px,5vw,56px); display: flex; justify-content: center; }
.pagination .page-numbers { display: inline-flex; align-items: center; justify-content: center; min-width: 40px; height: 40px; padding: 0 12px; margin: 0 3px; border: 1px solid var(--line); border-radius: 8px; font-family: var(--en); font-weight: 700; font-size: 13px; color: var(--ink); }
.pagination .page-numbers.current { background: var(--red); border-color: var(--red); color: #fff; }

/* ---------- 下層ページヒーロー ---------- */
.phero { position: relative; height: min(62svh, 560px); min-height: 400px; overflow: clip; display: flex; align-items: flex-end; }
.phero__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(1) contrast(1.03) brightness(1.03); animation: heroZoom 14s ease-out both; }
/* 暗幕は見出しが乗る下側だけ（トップと同じ考え方） */
.phero__grad { position: absolute; inset: 0; background: linear-gradient(0deg, rgba(6,10,20,.6) 0%, rgba(6,10,20,.3) 22%, rgba(6,10,20,0) 50%); }
.phero__inner { position: relative; z-index: 2; width: 100%; max-width: var(--maxw); margin: 0 auto; padding: clamp(28px,6vw,72px) var(--gut) clamp(38px,6vh,68px); }
.phero__crumb { display: flex; align-items: center; gap: 12px; margin-bottom: 18px; color: rgba(255,255,255,.8); font-size: 11.5px; letter-spacing: .1em; animation: fadeIn .9s .1s both; }
.phero__crumb a { color: rgba(255,255,255,.8); }
.phero__crumb a:hover { color: #fff; }
.phero__crumb span[aria-hidden] { opacity: .5; }
.phero__crumb span:last-child { color: #fff; }
.phero__en { margin: 0; color: #fff; font-family: var(--en); font-weight: 900; font-size: clamp(46px,9vw,116px); line-height: .92; letter-spacing: .01em; }
.phero__en > span { display: block; overflow: hidden; padding-bottom: .06em; margin-bottom: -.06em; }
.phero__en i { font-style: normal; display: inline-block; animation: lineUp 1s .15s cubic-bezier(.22,.65,.25,1) both; }
.phero__sub { display: flex; flex-wrap: wrap; align-items: center; gap: 10px 22px; margin-top: 18px; animation: rise .9s .5s cubic-bezier(.22,.65,.25,1) both; color: #fff; font-weight: 900; font-size: clamp(16px,2.2vw,21px); letter-spacing: .1em; }

/* ---------- 九つのサービス 一覧カード ---------- */
.promise { position: relative; overflow: clip; padding-block: clamp(64px,9vw,120px) clamp(48px,7vw,88px); }
.promise::before, .promise::after { content: ""; position: absolute; border-radius: 50%; pointer-events: none; }
.promise::before { width: 620px; height: 620px; right: -180px; top: -120px; border: 2px dashed rgba(213,28,55,.2); animation: spinSlow 90s linear infinite; }
.promise::after { width: 420px; height: 420px; left: -160px; bottom: 20px; border: 2px dashed rgba(22,89,159,.18); animation: spinBack 70s linear infinite; }
.promise__wrap { max-width: var(--maxw); margin: 0 auto; position: relative; padding-inline: 0; }
.promise__glow { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: min(900px,120vw); aspect-ratio: 1.6; border-radius: 50%; background: radial-gradient(circle, rgba(213,28,55,.05) 0%, rgba(22,89,159,.04) 45%, transparent 68%); pointer-events: none; }
.promise__lead { margin: 0 0 clamp(28px,4vw,44px); font-size: clamp(15px,1.9vw,19px); font-weight: 700; line-height: 2; letter-spacing: .04em; color: var(--body); max-width: 720px; }

.pgrid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(290px,100%), 1fr)); gap: clamp(14px,1.8vw,20px); perspective: 1200px; }

.pcard9 {
	--c: var(--red);
	position: relative; display: block; aspect-ratio: 5 / 6;
	border-radius: 18px; overflow: hidden; isolation: isolate;
	color: #fff; text-decoration: none;
	background: var(--ink);
	box-shadow: 0 12px 30px rgba(26,27,31,.16);
	transform-style: preserve-3d;
	transition: box-shadow .45s cubic-bezier(.2,.7,.2,1), transform .45s cubic-bezier(.2,.7,.2,1);
}
.pcard9--blue { --c: #16599F; }
.pcard9--red  { --c: #D51C37; }
.pcard9:hover { color: #fff; box-shadow: 0 28px 60px color-mix(in srgb, var(--c) 40%, rgba(26,27,31,.3)); }

/* 写真 */
.pcard9__media { position: absolute; inset: 0; z-index: 0; display: block; overflow: hidden; }
.pcard9__media img {
	width: 100%; height: 100%; object-fit: cover; display: block;
	filter: contrast(1.03) brightness(.98);
	transform: scale(1.04);
	transition: transform 1s cubic-bezier(.2,.7,.2,1), filter .6s ease;
}
.pcard9:hover .pcard9__media img { filter: contrast(1.02) brightness(.92); transform: scale(1.14); }

/* 写真の上6割はそのまま見せ、下4割にブランド色の帯を敷いて文字を乗せる */
.pcard9__veil {
	position: absolute; inset: 0; z-index: 1; display: block;
	background: linear-gradient(180deg,
		transparent 0%,
		transparent 42%,
		color-mix(in srgb, var(--c) 55%, rgba(10,14,24,.35)) 62%,
		color-mix(in srgb, var(--c) 82%, rgba(10,14,24,.6)) 100%);
	transition: opacity .5s ease;
}
.pcard9:hover .pcard9__veil { opacity: .9; }

/* 巨大なナンバー */
.pcard9__ghost {
	position: absolute; z-index: 2; right: 12px; top: -6px; pointer-events: none;
	font-family: var(--en); font-weight: 900; font-size: clamp(84px,9vw,120px); line-height: 1;
	color: transparent; -webkit-text-stroke: 2px rgba(255,255,255,.6); text-shadow: 0 2px 12px rgba(0,0,0,.35);
	transition: transform .55s cubic-bezier(.2,.7,.2,1), -webkit-text-stroke-color .5s ease;
}
.pcard9:hover .pcard9__ghost { transform: translate3d(0,10px,40px) rotate(-5deg); -webkit-text-stroke-color: rgba(255,255,255,.9); }

/* テキスト */
.pcard9__body {
	position: absolute; z-index: 3; inset: auto 0 0 0; display: flex; flex-direction: column; align-items: flex-start;
	gap: 7px; padding: clamp(22px,2.6vw,28px);
	transform: translate3d(0,0,30px);
	transition: transform .5s cubic-bezier(.2,.7,.2,1);
}
.pcard9:hover .pcard9__body { transform: translate3d(0,-6px,60px); }
.pcard9__ico {
	display: flex; align-items: center; justify-content: center;
	width: 46px; height: 46px; border-radius: 14px; margin-bottom: 4px;
	background: rgba(255,255,255,.16); color: #fff;
	backdrop-filter: blur(6px); border: 1px solid rgba(255,255,255,.25);
	transition: background .35s, color .35s, transform .5s cubic-bezier(.2,.7,.2,1);
}
.pcard9__ico .ico { width: 24px; height: 24px; }
.pcard9:hover .pcard9__ico { background: #fff; color: var(--c); transform: rotate(-8deg) scale(1.1); }
.pcard9__name { font-size: clamp(21px,2.4vw,25px); font-weight: 900; letter-spacing: .05em; line-height: 1.3; text-shadow: 0 2px 14px rgba(0,0,0,.4); }
.pcard9__en { font-family: var(--en); font-weight: 700; font-size: 10px; letter-spacing: .2em; color: rgba(255,255,255,.72); }
.pcard9__hl {
	margin-top: 4px; font-size: 13px; font-weight: 900; line-height: 1.7; letter-spacing: .02em;
	color: #fff; text-shadow: 0 2px 12px rgba(0,0,0,.45);
	max-height: 0; opacity: 0; overflow: hidden;
	transition: max-height .5s cubic-bezier(.2,.7,.2,1), opacity .4s ease, margin-top .5s ease;
}
.pcard9:hover .pcard9__hl { max-height: 6em; opacity: 1; }
.pcard9__more {
	display: inline-flex; align-items: center; gap: 8px; margin-top: 10px;
	font-size: 11.5px; font-weight: 800; letter-spacing: .12em; color: #fff;
	padding-bottom: 4px; border-bottom: 2px solid rgba(255,255,255,.45);
	transition: border-color .35s ease;
}
.pcard9:hover .pcard9__more { border-color: #fff; }
.pcard9__more i { font-style: normal; transition: transform .35s cubic-bezier(.2,.7,.2,1); }
.pcard9:hover .pcard9__more i { transform: translateX(5px); }

/* スクロールで1枚ずつ立ち上がる */
@keyframes p9In { from { opacity: 0; transform: translateY(46px) scale(.95); } }
@supports (animation-timeline: view()) {
	.pgrid .pcard9 { animation: p9In .9s cubic-bezier(.22,.65,.25,1) both; animation-timeline: view(); animation-range: cover 0% cover 34%; }
}
@media (hover: none) {
	.pcard9__hl { max-height: 6em; opacity: 1; }
	.pcard9__media img { filter: contrast(1.03) brightness(.96); }
}

/* ---------- ＋α ---------- */
.plus__head { display: flex; align-items: baseline; gap: 16px; flex-wrap: wrap; margin-bottom: 26px; }
.plus__mark { font-family: var(--en); font-weight: 900; font-size: clamp(28px,4vw,44px); line-height: 1; color: var(--red); }
.plus__note { font-size: 14px; font-weight: 700; color: var(--body); letter-spacing: .08em; }
.plus__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(210px,100%),1fr)); gap: 12px; }
/* 道順など長文を入れるカード。列を広くしないと文中で折り返してしまう */
.plus__grid--wide { grid-template-columns: repeat(auto-fit, minmax(min(420px,100%),1fr)); }
.plus__card { background: #fff; border-radius: 10px; padding: 22px 20px; }
.plus__en { font-family: var(--en); font-size: 10px; font-weight: 800; letter-spacing: .18em; color: var(--red); margin-bottom: 8px; }
.plus__name { font-size: 15px; font-weight: 900; margin-bottom: 6px; }
.plus__card p { margin: 0; font-size: 12.5px; line-height: 1.85; color: #6A6F79; }

.svc__grid--wide { grid-template-columns: repeat(auto-fill, minmax(min(300px,100%),1fr)); }
.svc__grid--wide .scard { padding: 28px 26px; }
.scard__note { margin-top: auto; padding-top: 12px; font-size: 11.5px; font-weight: 700; letter-spacing: .06em; color: rgba(255,255,255,.7); }

/* ---------- NEWS一覧 ---------- */
.counter { padding-block: clamp(56px,8vw,96px) clamp(24px,4vw,40px); }
/* 件数タイル。投稿数から自動で増える */
.stats { display: grid; grid-template-columns: repeat(4, minmax(0,1fr)); border: 1px solid var(--line); border-radius: 16px; overflow: clip; background: #fff; box-shadow: 0 12px 34px rgba(26,27,31,.06); }
.stat { --c: var(--ink); position: relative; display: flex; flex-direction: column; gap: 6px; padding: clamp(22px,3vw,34px) clamp(18px,2.4vw,28px); color: var(--ink); text-decoration: none; border-right: 1px solid var(--line); transition: background .25s; }
.stat:last-child { border-right: 0; }
.stat--red { --c: var(--red); }
.stat--blue { --c: var(--blue); }
.stat--soft { background: var(--bg-soft); }
.stat::before { content: ""; position: absolute; left: 0; top: 0; width: 100%; height: 4px; background: var(--c); transform: scaleX(0); transform-origin: left; transition: transform .4s cubic-bezier(.2,.7,.2,1); }
a.stat:hover { background: #FAFAFB; color: var(--ink); }
a.stat:hover::before { transform: scaleX(1); }
.stat__en { font-family: var(--en); font-weight: 800; font-size: 10.5px; letter-spacing: .2em; color: var(--c); }
.stat__num { display: flex; align-items: baseline; gap: 6px; margin-top: 6px; }
.stat__num b { font-family: var(--en); font-weight: 900; font-size: clamp(40px,4.6vw,60px); line-height: .9; letter-spacing: -.01em; font-variant-numeric: tabular-nums; }
.stat__num small { font-size: 13px; font-weight: 700; color: var(--mute); }
.stat__date { font-family: var(--en); font-weight: 900; font-size: clamp(24px,2.6vw,32px); line-height: 1.2; margin-top: 6px; letter-spacing: .02em; }
.stat__ja { font-size: 14px; font-weight: 900; letter-spacing: .04em; margin-top: 4px; }
.stat__desc { font-size: 12px; line-height: 1.8; color: #6A6F79; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.stat__more { margin-top: auto; padding-top: 12px; font-size: 11.5px; font-weight: 700; color: var(--c); }
.stat__more i { font-style: normal; display: inline-block; transition: transform .3s; }
.stat:hover .stat__more i { transform: translateX(4px); }
@media (max-width: 900px) { .stats { grid-template-columns: repeat(2, minmax(0,1fr)); } .stat:nth-child(2) { border-right: 0; } .stat:nth-child(-n+2) { border-bottom: 1px solid var(--line); } }
@media (max-width: 480px) { .stats { grid-template-columns: 1fr; } .stat { border-right: 0; border-bottom: 1px solid var(--line); } .stat:last-child { border-bottom: 0; } }

.pickup { padding-block: clamp(24px,4vw,48px) clamp(48px,7vw,88px); }
.pickup__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(300px,100%),1fr)); gap: clamp(14px,2vw,22px); }
.fcard { display: block; border-radius: 14px; overflow: clip; background: #fff; box-shadow: 0 12px 34px rgba(26,27,31,.08); color: var(--ink); }
.fcard:hover { color: var(--ink); }
.fcard__thumb { aspect-ratio: 4/3; overflow: clip; background: repeating-linear-gradient(135deg,#F2F3F5,#F2F3F5 10px,#E9EAEE 10px,#E9EAEE 20px); }
.fcard__thumb img { width: 100%; height: 100%; object-fit: cover; transition: transform .6s cubic-bezier(.2,.7,.2,1); }
.fcard:hover .fcard__thumb img { transform: scale(1.05); }
.fcard__body { padding: 20px 20px 24px; }
.fcard__meta { display: flex; align-items: center; gap: 10px; margin-bottom: 10px; }
.fcard__tag { font-size: 11px; font-weight: 700; color: #fff; background: var(--red); border-radius: 30px; padding: 4px 12px; }
.fcard__date { font-family: var(--en); font-size: 12px; font-weight: 700; color: var(--mute); }
.fcard__title { font-size: 15.5px; font-weight: 900; line-height: 1.7; }

.archive { position: relative; overflow: clip; padding-block: clamp(64px,9vw,120px); }
.wm--dark { top: -.1em; bottom: auto; font-size: clamp(90px,16vw,220px); color: rgba(26,27,31,.04); }
.tabs { display: flex; flex-wrap: wrap; gap: 10px; margin-bottom: clamp(20px,2.6vw,30px); }
.tab { border-radius: 60px; padding: 11px 26px; font-size: 13px; font-weight: 700; letter-spacing: .08em; border: 1.5px solid #D6D8DE; background: #fff; color: var(--body); }
.tab:hover { border-color: var(--red); color: var(--red); }
.tab span { font-family: var(--en); font-size: 11px; margin-left: 8px; opacity: .7; }
.tab--on { background: var(--red); border-color: var(--red); color: #fff; }
.tab--on:hover { background: var(--red); color: #fff; }
.archive__card { background: #fff; border-radius: 14px; padding: clamp(8px,1.4vw,18px) clamp(12px,2vw,28px); box-shadow: 0 12px 34px rgba(26,27,31,.05); }
.archive__card .nrow:last-child { border-bottom: none; }

.pager { display: flex; align-items: center; justify-content: center; gap: 8px; margin-top: clamp(28px,4vw,44px); flex-wrap: wrap; }
.pager .page-numbers {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 42px; height: 42px; border-radius: 50%;
	border: 1px solid #D6D8DE; background: #fff; color: var(--body);
	font-family: var(--en); font-weight: 800; font-size: 14px;
}
.pager .page-numbers:hover { border-color: var(--red); color: var(--red); }
.pager .page-numbers.current { background: var(--red); border-color: var(--red); color: #fff; }
.pager .page-numbers.dots { border: none; background: none; color: #B4B8C0; min-width: auto; }
.pager .prev, .pager .next { border-radius: 60px; padding: 0 22px; font-size: 12px; font-weight: 700; letter-spacing: .14em; }

/* ---------- COMPANY ---------- */
.cphil { position: relative; overflow: clip; }
.cphil__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(240px,100%),1fr)); gap: 14px; margin-top: clamp(24px,3vw,36px); }
.cphil__card { position: relative; overflow: clip; border-radius: 14px; padding: 28px 24px 32px; background: #fff; box-shadow: 0 12px 34px rgba(26,27,31,.06); }
.cphil__ch { position: absolute; right: -.06em; bottom: -.2em; font-family: var(--en); font-weight: 900; font-size: 150px; line-height: 1; color: transparent; -webkit-text-stroke: 2px rgba(213,28,55,.16); pointer-events: none; }
.cphil__card--a .cphil__ch, .cphil__card--s .cphil__ch { -webkit-text-stroke-color: rgba(22,89,159,.16); }
.cphil__meta { display: flex; align-items: center; gap: 12px; position: relative; }
.cphil__num { font-family: var(--en); font-weight: 800; font-size: 11px; letter-spacing: .18em; border: 1.5px solid rgba(26,27,31,.25); border-radius: 40px; padding: 5px 12px; }
.cphil__en { font-family: var(--en); font-weight: 800; font-size: 12px; letter-spacing: .2em; color: var(--red); }
.cphil__card--a .cphil__en, .cphil__card--s .cphil__en { color: var(--blue); }
.cphil__ja { position: relative; margin-top: 18px; font-size: clamp(16px,2vw,20px); font-weight: 900; line-height: 1.7; letter-spacing: .03em; }
.cphil__rule { position: relative; margin-top: 16px; width: 48px; height: 3px; background: var(--red); }
.cphil__card--a .cphil__rule, .cphil__card--s .cphil__rule { background: var(--blue); }

/* メンバー紹介。ひとり1本の全幅の帯。背景は本人の写真をぼかして黒を64%被せる。偶数行は写真を右に置く */
.members { display: flex; flex-direction: column; gap: clamp(16px,2.4vw,28px); margin: clamp(24px,3vw,40px) calc(-1 * var(--gut)) 0; }
.member { position: relative; isolation: isolate; overflow: clip; color: #fff; background: var(--ink); }
.member__bg { position: absolute; inset: -6%; z-index: -2; }
.member__bg img { width: 100%; height: 100%; object-fit: cover; object-position: 50% 30%; filter: blur(28px) saturate(1.1); }
.member::before { content: ""; position: absolute; inset: 0; z-index: -1; background: rgba(26,27,31,.64); }
.member__in { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); max-width: 1280px; margin-inline: auto; }
.member:nth-child(even) .member__photo { order: 2; }
/* 写真列は 4:5 の高さを最低限確保し、文章が長い時だけ下側を少し切る */
.member__photo { position: relative; align-self: stretch; }
.member__photo::before { content: ""; display: block; aspect-ratio: 4/5; }
.member__photo img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: 50% 15%; }
.member__photo::after { content: ""; position: absolute; inset: 0; background: linear-gradient(90deg, transparent 60%, rgba(26,27,31,.5) 100%); pointer-events: none; }
.member:nth-child(even) .member__photo::after { background: linear-gradient(270deg, transparent 60%, rgba(26,27,31,.5) 100%); }
.member__cap { position: absolute; left: clamp(20px,3vw,40px); bottom: clamp(18px,3vw,32px); z-index: 1; display: flex; align-items: center; gap: 10px; font-family: var(--en); font-weight: 800; font-size: 11px; letter-spacing: .22em; color: rgba(255,255,255,.85); }
.member__cap::before { content: ""; width: 22px; height: 2px; background: var(--red); }
.member__body { position: relative; padding: clamp(40px,5vw,72px) clamp(28px,5vw,80px); display: flex; flex-direction: column; justify-content: center; }
.member__wm { position: absolute; left: clamp(10px,2vw,40px); top: 18px; font-family: var(--en); font-weight: 900; font-size: clamp(64px,8.5vw,120px); line-height: 1; letter-spacing: .02em; color: transparent; -webkit-text-stroke: 1.5px rgba(255,255,255,.16); white-space: nowrap; pointer-events: none; }
.member__role { font-family: var(--en); font-weight: 800; font-size: 11px; letter-spacing: .24em; color: #FF6478; margin-top: 56px; }
.member__role span { font-family: var(--ja); font-weight: 700; letter-spacing: .08em; color: rgba(255,255,255,.72); margin-left: 14px; }
.member__name { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; margin: 10px 0 0; font-size: clamp(30px,3.6vw,44px); font-weight: 900; letter-spacing: .06em; line-height: 1.2; color: #fff; }
.member__name small { font-family: var(--en); font-weight: 700; font-size: 13px; letter-spacing: .14em; color: rgba(255,255,255,.55); }
.member__lead { margin: 22px 0 0; font-size: clamp(17px,2vw,22px); font-weight: 900; line-height: 1.7; letter-spacing: .03em; color: #fff; text-wrap: balance; }
.member__txt { margin-top: 16px; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.16); max-width: 60ch; }
.member__txt p { margin: 0 0 1em; font-size: 14px; line-height: 2; color: rgba(255,255,255,.82); }
.member__txt p:last-child { margin-bottom: 0; }
.member__txt strong { color: #FF6478; font-weight: 900; }
.member__sign { margin-top: 22px; font-size: 12.5px; font-weight: 700; letter-spacing: .06em; color: rgba(255,255,255,.6); }
@media (max-width: 900px) {
	.member__in { grid-template-columns: 1fr; }
	.member:nth-child(even) .member__photo { order: 0; }
	.member__photo::after, .member:nth-child(even) .member__photo::after { background: linear-gradient(180deg, transparent 60%, rgba(26,27,31,.85) 100%); }
	.member__role { margin-top: 40px; }
}

.outline { margin: 0; }
.outline__row { display: grid; grid-template-columns: minmax(120px, 180px) 1fr; gap: clamp(16px,3vw,40px); padding: 22px 0; border-bottom: 1px solid var(--line); }
.outline__row dt, .outline__row dd { margin: 0; }
.outline__en { font-family: var(--en); font-weight: 800; font-size: 11px; letter-spacing: .18em; color: var(--red); }
.outline__ja { font-size: 12px; font-weight: 700; color: var(--mute); margin-bottom: 4px; }
.outline__val { font-size: 15px; line-height: 1.9; color: var(--ink); font-weight: 500; }
.outline__links { list-style: none; margin: 0; padding: 0; display: flex; flex-wrap: wrap; gap: 6px 22px; }
.outline__links li { display: flex; align-items: baseline; gap: 8px; }
.outline__links a { color: var(--blue); text-decoration: none; border-bottom: 1px solid rgba(22,89,159,.3); transition: color .2s, border-color .2s; }
.outline__links a:hover { color: var(--red); border-color: var(--red); }
.outline__note { font-size: 12px; color: var(--mute); font-weight: 700; }

.faqnav { display: flex; flex-wrap: wrap; gap: 8px; margin: 0 0 clamp(28px,4vw,44px); }
.faqnav a {
	display: inline-block; padding: 8px 16px; border-radius: 999px;
	border: 1px solid var(--line); background: #fff; color: var(--body);
	font-size: 12.5px; font-weight: 700; text-decoration: none;
	transition: background .2s, color .2s, border-color .2s;
}
.faqnav a:hover { background: var(--red); border-color: var(--red); color: #fff; }
.faqgrp { margin-bottom: clamp(36px,5vw,60px); scroll-margin-top: clamp(80px,11vh,110px); }
.faqgrp__head { display: flex; align-items: baseline; gap: 12px; margin: 0 0 16px; }
.faqgrp__en { font-family: var(--en); font-weight: 800; font-size: 11px; letter-spacing: .18em; color: var(--red); }
.faqgrp__ja { font-size: clamp(17px,2.2vw,21px); font-weight: 900; letter-spacing: .02em; }

.shopgal { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(260px,100%),1fr)); gap: 12px; }
.shopgal .igt { aspect-ratio: 4/3; border-radius: 12px; }
.plus__hint { margin-top: 12px !important; font-size: 11.5px !important; color: var(--mute) !important; }

/* ---------- ACCESS ---------- */
.bigmap { position: relative; min-height: clamp(320px,44vw,520px); border-radius: 16px; overflow: hidden; border: 1px solid var(--line); }
.bigmap iframe { position: absolute; inset: 0; width: 100%; height: 100%; border: 0; }
.bigmap__card { position: absolute; left: clamp(12px,2vw,24px); bottom: clamp(12px,2vw,24px); background: rgba(255,255,255,.96); backdrop-filter: blur(8px); border-radius: 12px; padding: 18px 20px; box-shadow: 0 12px 34px rgba(26,27,31,.14); max-width: min(360px, calc(100% - 24px)); }
.bigmap__en { font-family: var(--en); font-weight: 900; font-size: 15px; letter-spacing: .1em; color: var(--red); }
.bigmap__addr { margin-top: 6px; font-size: 13.5px; font-weight: 700; line-height: 1.7; }
.bigmap__sub { margin-top: 4px; font-size: 12px; color: var(--mute); line-height: 1.7; }
/* サテライト展示場 */
.satmap { margin-top: clamp(36px,5vw,56px); padding-top: clamp(28px,4vw,40px); border-top: 1px solid var(--line); }
.satmap__head { display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 10px 24px; margin-bottom: 18px; }
.satmap__en { display: block; font-family: var(--en); font-weight: 800; font-size: 11px; letter-spacing: .22em; color: var(--red); margin-bottom: 6px; }
.satmap__name { margin: 0; font-size: clamp(18px,2.4vw,24px); font-weight: 900; letter-spacing: .03em; }
.satmap__note { margin: 0; font-size: 13px; line-height: 1.8; color: var(--body); max-width: 46ch; }
.satmap__body { display: grid; grid-template-columns: minmax(0,3fr) minmax(0,2fr); gap: clamp(16px,3vw,32px); align-items: start; }
.bigmap--sm { min-height: clamp(240px,30vw,340px); }
.satmap__info .bigmap__addr { font-size: 15px; }
.outline__memo { display: block; margin-top: 4px; font-size: 12px; color: var(--mute); }
@media (max-width: 720px) { .satmap__body { grid-template-columns: 1fr; } }
.cal2 { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(300px,100%),1fr)); gap: clamp(16px,2.4vw,28px); }
.cal2 .cal h3 { margin: 0 0 14px; font-size: clamp(16px,2vw,20px); font-weight: 900; }

/* ---------- CONTACT ---------- */
.ways { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(260px,100%),1fr)); gap: 14px; margin-top: clamp(24px,3vw,36px); }
.way { display: flex; flex-direction: column; gap: 10px; background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 28px 24px; color: var(--ink); box-shadow: 0 12px 34px rgba(26,27,31,.05); transition: transform .3s cubic-bezier(.2,.7,.2,1), box-shadow .3s; }
.way:hover { color: var(--ink); transform: translateY(-4px); box-shadow: 0 20px 44px rgba(26,27,31,.1); }
.way--solid { background: var(--blue); border-color: var(--blue); color: #fff; }
.way--solid:hover { color: #fff; }
.way__label { font-family: var(--en); font-weight: 800; font-size: 11px; letter-spacing: .2em; color: var(--red); }
.way--solid .way__label { color: rgba(255,255,255,.8); }
.way__main { font-size: clamp(18px,2.2vw,22px); font-weight: 900; }
.way__main--tel { font-family: var(--en); font-size: clamp(22px,2.8vw,30px); letter-spacing: .03em; }
.way__sub { font-size: 12.5px; line-height: 1.9; color: #6A6F79; }
.way--solid .way__sub { color: rgba(255,255,255,.85); }
.way__go { margin-top: auto; padding-top: 10px; font-family: var(--en); font-weight: 700; font-size: 11px; letter-spacing: .16em; }

.formcard { background: #fff; border-radius: 16px; padding: clamp(22px,3.4vw,44px); box-shadow: 0 12px 34px rgba(26,27,31,.06); }
.formcard__fallback { margin: 0; font-size: 14.5px; line-height: 2; }
.formcard p { font-size: 14px; }
.formcard label { display: block; font-size: 13px; font-weight: 700; margin-bottom: 8px; }
.formcard input[type="text"], .formcard input[type="email"], .formcard input[type="tel"], .formcard textarea, .formcard select {
	width: 100%; font: inherit; font-size: 15px; color: var(--ink);
	background: #FAFAFB; border: 1.5px solid #E2E4E9; border-radius: 10px;
	padding: 13px 14px; transition: border-color .2s, background .2s;
}
.formcard textarea { min-height: 170px; resize: vertical; }
.formcard input:focus, .formcard textarea:focus, .formcard select:focus { outline: none; border-color: var(--red); background: #fff; }
.formcard .wpcf7-list-item { display: inline-block; margin: 0 12px 8px 0; }
.formcard .wpcf7-list-item-label { font-size: 14px; }
.formcard .wpcf7-submit {
	display: inline-flex; align-items: center; justify-content: center;
	min-width: 240px; border: none; border-radius: 60px; padding: 17px 40px;
	background: var(--red); color: #fff; cursor: pointer;
	font-family: var(--en); font-weight: 700; font-size: 15px; letter-spacing: .16em;
	box-shadow: 0 10px 26px rgba(213,28,55,.3); transition: transform .2s, background .2s;
}
.formcard .wpcf7-submit:hover { background: #b8152e; transform: translateY(-2px); }
.formcard .wpcf7-not-valid-tip { color: var(--red); font-size: 12.5px; margin-top: 6px; }
.formcard .wpcf7-response-output { margin: 20px 0 0 !important; border-radius: 10px; padding: 14px 16px !important; font-size: 13.5px; }
.cars8-req { font-size: 10.5px; font-weight: 700; color: #fff; background: var(--red); border-radius: 30px; padding: 3px 9px; margin-left: 8px; vertical-align: 2px; }
.cars8-any { font-size: 10.5px; font-weight: 700; color: var(--mute); border: 1px solid #D6D8DE; border-radius: 30px; padding: 2px 8px; margin-left: 8px; vertical-align: 2px; }
.cars8-field { margin-bottom: 26px; }

.faq__item { border-bottom: 1px solid var(--line); }
.faq__item summary { display: flex; align-items: center; justify-content: space-between; gap: 16px; cursor: pointer; padding: 22px 4px; font-size: clamp(14.5px,1.8vw,16.5px); font-weight: 700; line-height: 1.7; list-style: none; }
.faq__item summary::-webkit-details-marker { display: none; }
.faq__item summary i { flex-shrink: 0; font-style: normal; font-family: var(--en); font-weight: 800; font-size: 20px; color: var(--red); transition: transform .3s cubic-bezier(.2,.7,.2,1); }
.faq__item[open] summary i { transform: rotate(45deg); }
.faq__item p { margin: 0; padding: 0 4px 24px; font-size: 14px; line-height: 2; color: var(--body); }

/* ---------- 記事詳細 ---------- */
.ahero { position: relative; height: min(66svh, 600px); min-height: 420px; overflow: clip; display: flex; align-items: flex-end; }
.ahero__bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; filter: saturate(1) contrast(1.03) brightness(1); animation: heroZoom 14s ease-out both reverse; }
.ahero__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 16px; animation: fadeIn .9s .25s both; }
.ahero__tag { font-size: 11.5px; font-weight: 700; color: #fff; background: var(--red); border-radius: 30px; padding: 5px 14px; letter-spacing: .08em; }
.ahero__date { font-family: var(--en); font-weight: 700; font-size: 13px; letter-spacing: .08em; color: rgba(255,255,255,.8); }
.ahero__title { margin: 0; color: #fff; font-size: clamp(21px,3.4vw,42px); font-weight: 900; line-height: 1.6; letter-spacing: .03em; text-shadow: 0 4px 30px rgba(0,0,0,.5); animation: rise .9s .35s cubic-bezier(.22,.65,.25,1) both; }

.abody__wrap { max-width: 820px; margin-inline: auto; }
.abody__eyecatch { margin: 0 0 clamp(28px,4vw,44px); border-radius: 14px; overflow: clip; box-shadow: 0 20px 48px rgba(26,27,31,.12); }
.abody__eyecatch img { display: block; width: 100%; height: auto; }

.agal { margin-top: clamp(36px,5vw,56px); }
.agal__head { display: flex; align-items: baseline; gap: 14px; margin-bottom: 16px; }
.agal__en { font-family: var(--en); font-weight: 800; font-size: 11px; letter-spacing: .2em; color: var(--red); }
.agal__ja { font-size: 13px; font-weight: 700; color: var(--mute); }
.agal__grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(200px,100%),1fr)); gap: 10px; }
.agal__grid .igt { aspect-ratio: 4/3; border-radius: 10px; }

.ashare { display: flex; align-items: center; gap: 10px; margin-top: clamp(36px,5vw,56px); padding-top: 26px; border-top: 1px solid var(--line); }
.ashare__label { font-family: var(--en); font-weight: 800; font-size: 11px; letter-spacing: .2em; color: var(--mute); margin-right: 6px; }
.ashare a { display: inline-flex; align-items: center; justify-content: center; width: 42px; height: 42px; border: 1px solid #D6D8DE; border-radius: 50%; font-family: var(--en); font-weight: 800; font-size: 11px; color: var(--body); }
.ashare a:hover { border-color: var(--red); color: var(--red); }

.pnavs { padding-block: clamp(40px,6vw,72px); }
.pnav__grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px,100%),1fr)); gap: 14px; }
.pnav { display: flex; align-items: center; gap: 16px; background: #fff; border: 1px solid var(--line); border-radius: 12px; padding: 20px 22px; color: var(--ink); transition: background .25s, transform .3s cubic-bezier(.2,.7,.2,1); }
.pnav:hover { background: #FAFAFB; color: var(--ink); }
.pnav--prev:hover { transform: translateX(-5px); }
.pnav--next { justify-content: flex-end; text-align: right; }
.pnav--next:hover { transform: translateX(5px); }
.pnav__arrow { flex-shrink: 0; font-family: var(--en); font-weight: 800; font-size: 20px; color: var(--red); }
.pnav__body { display: flex; flex-direction: column; gap: 6px; min-width: 0; }
.pnav__label { font-family: var(--en); font-weight: 800; font-size: 10px; letter-spacing: .2em; color: var(--mute); }
.pnav__title { font-size: 13.5px; font-weight: 700; line-height: 1.6; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
.pnavs__back { display: flex; justify-content: center; margin-top: 28px; }

.archive__count { margin: 0 0 clamp(20px,3vw,32px); font-size: 13px; color: var(--mute); }
.archive__count strong { font-family: var(--en); font-size: 22px; font-weight: 900; color: var(--ink); margin-right: 4px; }

.searchform { display: flex; gap: 10px; flex-wrap: wrap; margin-bottom: clamp(28px,4vw,44px); }
.searchform input[type="search"] { flex: 1; min-width: 220px; font: inherit; font-size: 15px; background: #FAFAFB; border: 1.5px solid #E2E4E9; border-radius: 60px; padding: 14px 22px; }
.searchform input[type="search"]:focus { outline: none; border-color: var(--red); background: #fff; }
.searchform button { border: none; border-radius: 60px; padding: 0 32px; background: var(--ink); color: #fff; cursor: pointer; font-family: var(--en); font-weight: 700; font-size: 13px; letter-spacing: .16em; }
.searchform button:hover { background: var(--red); }

/* ---------- 本文（Gutenberg） ---------- */
.entry-content > *:first-child { margin-top: 0; }
.entry-content p { margin: 0 0 1.6em; }
.entry-content figure { margin: 2em 0; }
.entry-content figure img { border-radius: 12px; display: block; }
.entry-content .aligncenter { margin-inline: auto; text-align: center; }
.entry-content .alignleft { float: left; margin: .5em 1.6em 1.2em 0; }
.entry-content .alignright { float: right; margin: .5em 0 1.2em 1.6em; }
.entry-content .alignwide, .entry-content .alignfull { margin-inline: 0; }
.entry-content .has-text-align-center { text-align: center; }
.entry-content .has-text-align-right { text-align: right; }
.entry-content figcaption { margin-top: 8px; font-size: 12.5px; color: var(--mute); text-align: center; }
.entry-content ul, .entry-content ol { margin: 0 0 1.6em; padding-left: 1.4em; }
.entry-content li { margin-bottom: .5em; }
.entry-content blockquote { margin: 2em 0; padding: 4px 0 4px 20px; border-left: 3px solid var(--red); color: var(--body); font-style: normal; }
.entry-content table { width: 100%; border-collapse: collapse; margin: 2em 0; font-size: 14px; }
.entry-content th, .entry-content td { border: 1px solid var(--line); padding: 12px 14px; text-align: left; }
.entry-content th { background: var(--bg-soft); font-weight: 700; }
.entry-content .wp-block-embed, .entry-content .wp-block-video { margin: 2em 0; }
.entry-content iframe { max-width: 100%; }
.entry-content::after { content: ""; display: table; clear: both; }

/* ---------- PCヘッダーナビ（1080px以上でハンバーガーから切り替え） ---------- */
.hdr__nav { display: none; }
.hdr__nav ul { display: flex; align-items: center; gap: clamp(14px, 1.9vw, 30px); margin: 0; padding: 0; list-style: none; }
.hdr__nav a { display: flex; flex-direction: column; align-items: center; gap: 3px; color: #fff; text-shadow: 0 1px 8px rgba(0,0,0,.45); }
.hdr__nav-en { font-family: var(--en); font-weight: 700; font-size: clamp(11px, .92vw, 13px); letter-spacing: .12em; white-space: nowrap; }
.hdr__nav-ja { font-size: 9.5px; font-weight: 700; letter-spacing: .06em; color: rgba(255,255,255,.72); white-space: nowrap; }
.hdr__nav a { position: relative; padding-bottom: 6px; }
.hdr__nav a::after {
	content: ""; position: absolute; left: 0; right: 0; bottom: 0; height: 2px;
	background: var(--red); transform: scaleX(0); transform-origin: 50% 50%;
	transition: transform .3s cubic-bezier(.2,.7,.2,1);
}
.hdr__nav a:hover { color: #fff; }
.hdr__nav a:hover::after, .hdr__nav .is-current a::after { transform: scaleX(1); }
.hdr__nav-cta a {
	background: var(--red); border-radius: 60px; padding: 9px 20px 8px;
	box-shadow: 0 8px 22px rgba(213,28,55,.34); text-shadow: none;
}
.hdr__nav-cta a::after { display: none; }
.hdr__nav-cta a:hover { background: #b8152e; }
.hdr__nav-cta .hdr__nav-ja { color: rgba(255,255,255,.85); }

@media (min-width: 1080px) {
	.hdr__nav { display: block; }
	.hdr__toggle { display: none; }
	.hdr { gap: 20px; }
	.hdr__logo img { height: clamp(48px, 4.4vw, 74px); }
}

/* ---------- アイコン ---------- */
.ico { width: 100%; height: 100%; display: block; }

/* ---------- RECRUIT ---------- */
.rcon__lead { margin: 0 0 18px; font-size: clamp(24px,4.4vw,48px); font-weight: 900; line-height: 1.5; letter-spacing: .04em; color: var(--red); }
.rcon__sub { margin: 0 0 clamp(32px,4.6vw,52px); font-size: clamp(14px,1.7vw,16px); line-height: 2.1; color: var(--body); max-width: 720px; }
.rcards { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(260px,100%),1fr)); gap: 14px; }
.rcard { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: 30px 26px; box-shadow: 0 12px 34px rgba(26,27,31,.05); }
.rcard__ico { display: flex; align-items: center; justify-content: center; width: 52px; height: 52px; border-radius: 14px; background: rgba(213,28,55,.08); color: var(--red); padding: 13px; margin-bottom: 18px; }
.rcard__en { display: block; font-family: var(--en); font-weight: 800; font-size: 10px; letter-spacing: .2em; color: var(--red); margin-bottom: 8px; }
.rcard h3 { margin: 0 0 12px; font-size: 18px; font-weight: 900; letter-spacing: .03em; }
.rcard p { margin: 0; font-size: 13.5px; line-height: 1.95; color: #6A6F79; }

.rsup { position: relative; overflow: clip; }
.rsup__list { display: flex; flex-direction: column; gap: 14px; }
.rsup__row { display: grid; grid-template-columns: auto auto 1fr; align-items: start; gap: clamp(14px,2.2vw,26px); background: #fff; border-radius: 14px; padding: clamp(22px,3vw,32px); box-shadow: 0 12px 34px rgba(26,27,31,.05); }
.rsup__num { font-family: var(--en); font-weight: 900; font-size: clamp(24px,3vw,34px); line-height: 1; color: rgba(213,28,55,.28); }
.rsup__ico { display: flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 50%; background: rgba(22,89,159,.08); color: var(--blue); padding: 11px; }
.rsup__en { font-family: var(--en); font-weight: 800; font-size: 10px; letter-spacing: .2em; color: var(--mute); margin-bottom: 6px; }
.rsup__body h3 { margin: 0 0 10px; font-size: clamp(16px,2vw,20px); font-weight: 900; letter-spacing: .03em; }
.rsup__body p { margin: 0; font-size: 13.5px; line-height: 2; color: #6A6F79; }
@media (max-width: 559px) {
	.rsup__row { grid-template-columns: auto 1fr; }
	.rsup__ico { grid-row: 1; }
	.rsup__body { grid-column: 1 / -1; }
}

.jobs { display: flex; flex-direction: column; gap: 14px; }
.jobs__lead { margin: 0 0 clamp(28px,4vw,44px); font-size: clamp(15px,1.9vw,19px); font-weight: 700; line-height: 2; letter-spacing: .04em; color: var(--body); }
.job { background: #fff; border: 1.5px solid var(--line); border-radius: 14px; overflow: hidden; box-shadow: 0 8px 24px rgba(26,27,31,.05); transition: border-color .3s, box-shadow .3s; }
.job[open] { border-color: color-mix(in srgb, var(--red) 40%, #fff); box-shadow: 0 14px 34px rgba(213,28,55,.12); }
.job summary { display: flex; align-items: center; gap: clamp(14px,2vw,22px); padding: clamp(20px,2.6vw,28px); cursor: pointer; list-style: none; }
.job summary::-webkit-details-marker { display: none; }
.job__ico { flex-shrink: 0; display: flex; align-items: center; justify-content: center; width: 48px; height: 48px; border-radius: 13px; background: #FFF2F4; color: var(--red); padding: 12px; }
.job__head { flex: 1; min-width: 0; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 14px; }
.job__en { flex-basis: 100%; font-family: var(--en); font-weight: 800; font-size: 10px; letter-spacing: .2em; color: var(--red); }
.job__name { font-size: clamp(17px,2.2vw,22px); font-weight: 900; letter-spacing: .03em; }
.job__type { font-size: 12px; font-weight: 700; color: var(--body); border: 1px solid var(--line); border-radius: 30px; padding: 3px 12px; }
.job__mark { flex-shrink: 0; font-family: var(--en); font-weight: 800; font-size: 22px; color: var(--red); transition: transform .3s cubic-bezier(.2,.7,.2,1); }
.job[open] .job__mark { transform: rotate(45deg); }
.job__inner { padding: 0 clamp(20px,2.6vw,28px) clamp(24px,3vw,32px); }
.job__tags { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0 0 18px; padding: 0; }
.job__tags li { font-size: 11.5px; font-weight: 700; background: #FFF2F4; color: var(--red); border-radius: 30px; padding: 5px 13px; }
.job__lead { margin: 0 0 24px; font-size: 14px; line-height: 2; color: var(--body); }
.job__block { margin-top: 24px; }
.job__label { font-family: var(--en); font-weight: 800; font-size: 10px; letter-spacing: .2em; color: var(--red); margin-bottom: 12px; padding-bottom: 10px; border-bottom: 1px solid var(--line); }
.job__tasks { margin: 0; padding: 0; list-style: none; display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px,100%),1fr)); gap: 8px 24px; }
.job__tasks li { position: relative; padding-left: 20px; font-size: 13.5px; line-height: 1.9; color: var(--body); }
.job__tasks li::before { content: ""; position: absolute; left: 4px; top: .78em; width: 6px; height: 6px; border-radius: 50%; background: var(--red); }
.job__terms { margin: 0; }
.job__term { display: grid; grid-template-columns: minmax(120px, 180px) 1fr; gap: 12px clamp(16px,2.4vw,32px); padding: 16px 0; border-bottom: 1px solid var(--line); }
.job__term:last-child { border-bottom: none; }
.job__term dt { display: flex; align-items: center; gap: 10px; margin: 0; font-size: 13px; font-weight: 800; letter-spacing: .04em; color: var(--ink); }
.job__term-ico { flex-shrink: 0; width: 22px; height: 22px; color: var(--red); }
.job__term dd { margin: 0; font-size: 13.5px; line-height: 1.95; color: var(--body); }
@media (max-width: 559px) {
	.job__term { grid-template-columns: 1fr; }
}

.entry { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(280px,100%),1fr)); gap: 16px; }
.entry__step { background: #fff; border: 1px solid var(--line); border-radius: 14px; padding: clamp(24px,3vw,32px); box-shadow: 0 12px 34px rgba(26,27,31,.05); }
.entry__num { font-family: var(--en); font-weight: 900; font-size: 30px; line-height: 1; color: rgba(213,28,55,.28); margin-bottom: 14px; }
.entry__step h3 { margin: 0 0 12px; font-size: 17px; font-weight: 900; letter-spacing: .03em; }
.entry__step p { margin: 0; font-size: 13.5px; line-height: 2; color: #6A6F79; }
.entry__items { margin: 14px 0 0; padding-left: 1.3em; font-size: 13.5px; line-height: 2; color: #6A6F79; }
.entry__note { display: flex; align-items: center; gap: 10px; margin: 26px 0 0; font-size: 12.5px; color: var(--mute); }
.entry__note-ico { flex-shrink: 0; width: 20px; height: 20px; }
.entry__cta { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 28px; }

/* ---------- プライバシーポリシー ---------- */
.pp__layout { display: grid; grid-template-columns: minmax(0,1fr); gap: clamp(28px,4vw,56px); }
@media (min-width: 1024px) { .pp__layout { grid-template-columns: 260px minmax(0,1fr); } }
.pp__index { align-self: start; background: var(--bg-soft); border-radius: 14px; padding: 24px 22px; }
@media (min-width: 1024px) { .pp__index { position: sticky; top: 110px; } }
.pp__index-label { font-family: var(--en); font-weight: 800; font-size: 10px; letter-spacing: .2em; color: var(--red); margin-bottom: 14px; }
.pp__index ol { margin: 0; padding-left: 1.2em; }
.pp__index li { margin-bottom: 10px; font-size: 12.5px; line-height: 1.7; }
.pp__index a { color: var(--body); }
.pp__index a:hover { color: var(--red); }

.pp__sec { padding-bottom: clamp(32px,4vw,48px); margin-bottom: clamp(32px,4vw,48px); border-bottom: 1px solid var(--line); }
.pp__sec:last-of-type { border-bottom: none; }
.pp__head { display: flex; align-items: center; gap: 16px; margin-bottom: 20px; }
.pp__ico { flex-shrink: 0; display: flex; align-items: center; justify-content: center; width: 46px; height: 46px; border-radius: 12px; background: rgba(22,89,159,.08); color: var(--blue); padding: 11px; }
.pp__en { font-family: var(--en); font-weight: 800; font-size: 10px; letter-spacing: .2em; color: var(--mute); margin-bottom: 5px; }
.pp__title { margin: 0; font-size: clamp(16px,2.1vw,21px); font-weight: 900; line-height: 1.6; letter-spacing: .03em; }
.pp__sec p { margin: 0 0 1.3em; font-size: 14px; line-height: 2.05; color: var(--body); }
.pp__sec p:last-child { margin-bottom: 0; }
.pp__list { margin: 0 0 1.3em; padding-left: 1.5em; }
.pp__list li { margin-bottom: .7em; font-size: 14px; line-height: 2; color: var(--body); }
.pp__subs { display: flex; flex-direction: column; gap: 14px; margin: 0 0 1.3em; }
.pp__sub { background: var(--bg-soft); border-radius: 12px; padding: 20px 22px; }
.pp__sub-k { font-size: 14px; font-weight: 900; letter-spacing: .03em; margin-bottom: 10px; }
.pp__sub p { margin: 0; font-size: 13.5px; line-height: 2; color: #6A6F79; }
.pp__ul { margin: 0; padding-left: 1.2em; }
.pp__ul li { margin-bottom: .6em; font-size: 13.5px; line-height: 1.95; color: #6A6F79; }
.pp__ul li:last-child { margin-bottom: 0; }
.pp__foot { background: var(--bg-soft); border-radius: 14px; padding: clamp(24px,3vw,34px); }
.pp__foot-co { font-size: 15px; font-weight: 900; letter-spacing: .03em; }
.pp__foot-ad { margin: 8px 0 20px; font-size: 13px; line-height: 1.9; color: var(--mute); }

/* ---------- 九つのサービス 詳細 ---------- */
.pdet { padding-inline: 0; }
.pdet > .wrap { padding-inline: var(--gut); }
.pdet__nav { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: clamp(28px,4vw,48px); }
.pdet__chip {
	display: inline-flex; align-items: center; gap: 9px;
	border: 1.5px solid var(--line); border-radius: 60px; padding: 9px 20px 9px 12px;
	font-size: 13.5px; font-weight: 700; letter-spacing: .04em; color: var(--ink);
	background: #fff; transition: border-color .25s, color .25s, transform .25s;
}
.pdet__chip-no { font-family: var(--en); font-weight: 800; font-size: 11px; letter-spacing: .1em; padding: 3px 8px; border-radius: 30px; color: #fff; }
.pdet__chip--blue .pdet__chip-no { background: var(--blue); }
.pdet__chip--red .pdet__chip-no { background: var(--red); }
.pdet__chip--blue:hover { border-color: var(--blue); color: var(--blue); transform: translateY(-2px); }
.pdet__chip--red:hover { border-color: var(--red); color: var(--red); transform: translateY(-2px); }

/* 明色基調。白と淡色を交互に敷き、写真は原色のまま見せる */
.pdet__item {
	--c: var(--red); --c-soft: #FFF2F4;
	position: relative; overflow: clip; padding-block: clamp(48px,6vw,86px);
	scroll-margin-top: 96px; color: var(--ink); background: #fff; isolation: isolate;
}
.pdet__item--blue { --c: var(--blue); --c-soft: #EFF5FC; }
.pdet__item--alt { background: var(--bg-soft); }

.pdet__ghost {
	position: absolute; right: 2vw; top: -.16em; pointer-events: none; z-index: 0;
	font-family: var(--en); font-weight: 900; font-size: clamp(140px,20vw,300px); line-height: 1;
	color: transparent; -webkit-text-stroke: 2px color-mix(in srgb, var(--c) 12%, transparent);
}
.pdet__item--alt .pdet__ghost { right: auto; left: 2vw; }

.pdet__grid { display: grid; grid-template-columns: minmax(0,1fr); gap: clamp(24px,3vw,40px); position: relative; z-index: 1; padding-inline: var(--gut); }
@media (min-width: 900px) {
	.pdet__grid { grid-template-columns: minmax(0,420px) minmax(0,1fr); gap: clamp(36px,4.5vw,68px); align-items: start; }
	.pdet__item--alt .pdet__side { order: 2; }
}

.pdet__side { align-self: start; }
@media (min-width: 900px) { .pdet__side { position: sticky; top: 108px; } }

/* 写真は原色・フル彩度で見せる */
.pdet__photo { position: relative; margin: 0 0 22px; border-radius: 18px; overflow: hidden; box-shadow: 0 16px 40px rgba(26,27,31,.14); }
.pdet__photo img { display: block; width: 100%; height: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.pdet__ico {
	position: absolute; left: 16px; top: 16px;
	display: flex; align-items: center; justify-content: center;
	width: 50px; height: 50px; border-radius: 15px; padding: 13px;
	background: rgba(255,255,255,.92); color: var(--c);
	box-shadow: 0 6px 18px rgba(26,27,31,.18);
}
.pdet__cap {
	position: absolute; left: 0; right: 0; bottom: 0; margin: 0;
	padding: 26px 16px 12px; font-size: 11px; letter-spacing: .06em; color: #fff;
	background: linear-gradient(0deg, rgba(10,14,24,.72) 0%, transparent 100%);
}
.pdet__cap::before { content: "PHOTO — "; font-family: var(--en); font-weight: 700; letter-spacing: .16em; }

.pdet__no { font-family: var(--en); font-weight: 900; font-size: clamp(34px,4.4vw,54px); line-height: 1; letter-spacing: .02em; color: var(--c); }
.pdet__name { margin: 6px 0 6px; font-size: clamp(24px,3.2vw,36px); font-weight: 900; letter-spacing: .04em; color: var(--ink); }
.pdet__en { font-family: var(--en); font-weight: 700; font-size: 11px; letter-spacing: .2em; color: var(--mute); }
.pdet__rule { width: 48px; height: 3px; margin: 18px 0; background: var(--c); }
.pdet__hl { margin: 0; font-size: clamp(15px,1.8vw,17px); font-weight: 900; line-height: 1.8; letter-spacing: .03em; color: var(--c); }

.pdet__block { margin-bottom: clamp(24px,3vw,36px); }
.pdet__k { position: relative; margin: 0 0 14px; padding-left: 16px; font-size: clamp(16px,2vw,19px); font-weight: 900; letter-spacing: .03em; color: var(--ink); }
.pdet__k::before { content: ""; position: absolute; left: 0; top: .18em; bottom: .18em; width: 4px; border-radius: 2px; background: var(--c); }
.pdet__block p { margin: 0 0 1.3em; font-size: 14.5px; line-height: 2.1; color: var(--body); }
.pdet__block p:last-child { margin-bottom: 0; }

.pdet__chips { display: flex; flex-wrap: wrap; gap: 8px; list-style: none; margin: 0 0 22px; padding: 0; }
.pdet__chips li { font-size: 12px; font-weight: 700; letter-spacing: .03em; border-radius: 30px; padding: 6px 14px; background: var(--c-soft); color: var(--c); }

.pdet__note { display: flex; flex-wrap: wrap; align-items: baseline; gap: 6px 16px; border: 1px dashed color-mix(in srgb, var(--c) 34%, transparent); border-radius: 12px; padding: 16px 20px; margin-bottom: 22px; background: var(--c-soft); }
.pdet__note-k { font-size: 11px; font-weight: 800; letter-spacing: .12em; color: var(--c); }
.pdet__note-v { font-size: 13.5px; font-weight: 700; line-height: 1.8; color: var(--ink); }

.pdet__foot { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 26px; padding-top: 22px; border-top: 1px solid var(--line); }
.pdet__cta { display: inline-flex; align-items: center; gap: 8px; font-size: 13.5px; font-weight: 800; letter-spacing: .03em; padding-bottom: 5px; border-bottom: 2px solid var(--c); color: var(--c); }
.pdet__cta:hover { color: var(--c); opacity: .7; }
.pdet__back { font-family: var(--en); font-size: 11px; font-weight: 700; letter-spacing: .12em; color: var(--mute); }
.pdet__back:hover { color: var(--c); }

/* ---------- CARS 八つの約束ごと（会社案内） ---------- */
.creed {
	position: relative; overflow: clip; color: var(--ink);
	background: linear-gradient(165deg, #FFFFFF 0%, #F6F7FA 55%, #FFFFFF 100%);
}
.creed__aura {
	position: absolute; inset: -20% -10% auto -10%; height: 120%; pointer-events: none;
	background:
		radial-gradient(60% 42% at 18% 12%, rgba(213,28,55,.09) 0%, transparent 62%),
		radial-gradient(52% 40% at 88% 74%, rgba(22,89,159,.09) 0%, transparent 62%);
}
.creed__lead { position: relative; margin: 0 0 clamp(34px,4.6vw,56px); font-size: clamp(14px,1.8vw,17px); font-weight: 700; letter-spacing: .06em; color: var(--body); }

.creed__list { list-style: none; margin: 0; padding: 0; display: grid; grid-template-columns: minmax(0,1fr); gap: 10px; }
@media (min-width: 860px) { .creed__list { grid-template-columns: repeat(2, minmax(0,1fr)); gap: 12px; } }

.creed__item {
	--c: var(--red);
	position: relative; overflow: hidden;
	display: grid; grid-template-columns: auto minmax(0,1fr); align-items: center;
	gap: clamp(14px,2vw,24px);
	padding: clamp(22px,2.8vw,32px) clamp(20px,2.4vw,30px);
	border: 1.5px solid var(--line); border-radius: 16px;
	background: #fff; box-shadow: 0 8px 24px rgba(26,27,31,.05);
	transition: border-color .35s ease, box-shadow .35s ease, transform .45s cubic-bezier(.2,.7,.2,1);
}
.creed__item:nth-child(even) { --c: var(--blue); }
.creed__item::before {
	content: ""; position: absolute; inset: 0; pointer-events: none; opacity: 0;
	background: color-mix(in srgb, var(--c) 5%, transparent);
	transition: opacity .4s ease;
}
.creed__item:hover { border-color: var(--c); transform: translateY(-4px); box-shadow: 0 18px 40px color-mix(in srgb, var(--c) 22%, rgba(26,27,31,.1)); }
.creed__item:hover::before { opacity: 1; }

.creed__no {
	position: relative; font-family: var(--en); font-weight: 900;
	font-size: clamp(38px,4.6vw,58px); line-height: 1; letter-spacing: .01em;
	color: transparent; -webkit-text-stroke: 1.6px color-mix(in srgb, var(--c) 42%, #fff);
	transition: color .4s ease, -webkit-text-stroke-color .4s ease;
}
.creed__item:hover .creed__no { color: var(--c); -webkit-text-stroke-color: var(--c); }

.creed__txt { position: relative; margin: 0; font-size: 13.5px; line-height: 1.95; color: var(--body); }
.creed__pre, .creed__post { display: inline; }
.creed__main {
	display: inline; font-size: clamp(17px,2.1vw,22px); font-weight: 900; letter-spacing: .02em; color: var(--ink);
	background-image: linear-gradient(transparent 70%, rgba(213,28,55,.28) 70%);
	background-repeat: no-repeat; background-size: 0% 100%;
	padding: 0 .06em; box-decoration-break: clone; -webkit-box-decoration-break: clone;
}
.creed__item:nth-child(even) .creed__main { background-image: linear-gradient(transparent 70%, rgba(22,89,159,.24) 70%); }

.creed__bar {
	position: absolute; left: 0; top: 12%; bottom: 12%; width: 3px; border-radius: 0 3px 3px 0;
	background: linear-gradient(180deg, var(--red), var(--blue));
	transform: scaleY(0); transform-origin: 50% 0;
	transition: transform .45s cubic-bezier(.2,.7,.2,1);
}
.creed__item:hover .creed__bar { transform: scaleY(1); }

@keyframes creedIn { from { opacity: 0; transform: translateY(28px) scale(.97); } }
@keyframes markerIn { from { background-size: 0% 100%; } to { background-size: 100% 100%; } }
@supports (animation-timeline: view()) {
	.creed__item { animation: creedIn .8s cubic-bezier(.22,.65,.25,1) both; animation-timeline: view(); animation-range: cover 0% cover 34%; }
	.creed__main { animation: markerIn .9s cubic-bezier(.4,0,.2,1) both; animation-timeline: view(); animation-range: cover 6% cover 40%; }
}