/* =========================================================
   jmp theme — 共通スタイル
   色・書体の基本は theme.json。ここではセクション・カード・動きを定義。
   ========================================================= */

:root {
	--jmp-navy: var(--wp--preset--color--navy, #16324F);
	--jmp-navy-deep: var(--wp--preset--color--navy-deep, #0F2238);
	--jmp-accent: var(--wp--preset--color--accent, #C2571A);
	--jmp-accent-dark: var(--wp--preset--color--accent-dark, #A8480F);
	--jmp-peach: var(--wp--preset--color--peach, #F2B48A);
	--jmp-peach-soft: var(--wp--preset--color--peach-soft, #FFF4EC);
	--jmp-cream: var(--wp--preset--color--cream, #FBF8F3);
	--jmp-sand: var(--wp--preset--color--sand, #E6DFD3);
	--jmp-sand-deep: var(--wp--preset--color--sand-deep, #E9E2D6);
	--jmp-ink: var(--wp--preset--color--ink, #3C4E61);
	--jmp-muted: var(--wp--preset--color--muted, #5A6B7D);
	--jmp-latin: var(--wp--preset--font-family--latin, "Outfit", sans-serif);
	--jmp-heading: var(--wp--preset--font-family--heading, "Zen Kaku Gothic New", sans-serif);
	--jmp-ease: cubic-bezier(.2, .7, .2, 1);
}

body { overflow-x: hidden; }
img { height: auto; }
:where(.wp-site-blocks) > * { margin-block-start: 0; }
.wp-site-blocks > main { margin-block-start: 0; }

/* ---------- ヘッダー ---------- */
.jmp-sticky {
	position: sticky;
	top: 0;
	z-index: 50;
}
.admin-bar .jmp-sticky { top: var(--wp-admin--admin-bar--height, 32px); }
.jmp-header {
	background: rgba(251, 248, 243, .92);
	-webkit-backdrop-filter: blur(8px);
	backdrop-filter: blur(8px);
	border-bottom: 1px solid var(--jmp-sand);
}
.jmp-header__inner { padding-block: 14px; }
.jmp-header-cta .wp-block-button__link { padding: 10px 22px; font-size: 14px; }
.jmp-header .wp-block-navigation__submenu-container { border: 1px solid var(--jmp-sand) !important; border-radius: 14px; padding: 8px 0; }
.jmp-brand { margin: 0; line-height: 1; }
.jmp-brand a {
	font-family: var(--jmp-latin);
	font-weight: 800;
	font-size: 32px;
	letter-spacing: .02em;
	color: var(--jmp-navy);
	text-decoration: none;
}
.jmp-brand .dot, .jmp-dot { color: var(--jmp-accent); }
.jmp-brand-tag { margin: 0; font-size: 12px; color: var(--jmp-muted); }
.jmp-header .wp-block-navigation a { text-decoration: none; }
.jmp-header .wp-block-navigation a:hover { color: var(--jmp-accent-dark); }

/* ---------- セクション ---------- */
.jmp-section { padding-block: clamp(64px, 9vw, 104px); }
.jmp-section--white { background: #fff; }
.jmp-section--navy { background: var(--jmp-navy); color: #fff; }
.jmp-section--navy :where(h1, h2, h3, h4, p, li, a) { color: #fff; }
.jmp-section--dots {
	background-color: var(--jmp-cream);
	background-image: radial-gradient(#D9D0C2 1px, transparent 1px);
	background-size: 22px 22px;
}
.jmp-section--bordered { border-block: 1px solid var(--jmp-sand); }
.jmp-section > * + * { margin-block-start: 0; }

.jmp-eyebrow {
	margin: 0 0 6px;
	font-family: var(--jmp-latin);
	font-size: 14px;
	font-weight: 600;
	letter-spacing: .16em;
	text-transform: uppercase;
	color: var(--jmp-accent);
}
.jmp-section--navy .jmp-eyebrow { color: var(--jmp-peach); }
.jmp-lead { color: var(--jmp-ink); max-width: 640px; }
.jmp-section--navy .jmp-lead { color: rgba(255, 255, 255, .86); }
.jmp-note { font-size: 13px; color: var(--jmp-muted); }
.jmp-section--navy .jmp-note { color: rgba(255, 255, 255, .78); }
.jmp-section-head { margin-bottom: 44px; }
.jmp-center { text-align: center; }
.jmp-accent-text { color: var(--jmp-accent); }

/* 背景の大きな透かし文字 */
.jmp-watermark { position: relative; overflow: hidden; }
.jmp-watermark::before {
	content: attr(data-watermark);
	content: "JUMP";
	position: absolute;
	right: -40px;
	top: 40px;
	font-family: var(--jmp-latin);
	font-weight: 800;
	font-size: clamp(120px, 18vw, 240px);
	line-height: 1;
	color: rgba(255, 255, 255, .04);
	pointer-events: none;
	white-space: nowrap;
}
.jmp-watermark--seo::before { content: "SEO"; }
.jmp-watermark > * { position: relative; }

/* ---------- ヒーロー ---------- */
.jmp-hero { padding-block: clamp(64px, 9vw, 104px) clamp(72px, 10vw, 112px); }
.jmp-hero h1 { letter-spacing: .02em; }
.jmp-hero .jmp-lead { font-size: 17px; }
.jmp-pill {
	display: inline-flex !important;
	align-items: center;
	gap: 10px;
	margin: 0 0 22px;
	padding: 6px 16px 6px 12px;
	border: 1px solid #EAD9CC;
	border-radius: 999px;
	background: #fff;
	font-size: 13px;
	font-weight: 700;
	letter-spacing: .06em;
	color: var(--jmp-accent);
}
.jmp-section--navy .jmp-pill { background: transparent; border-color: rgba(242, 180, 138, .5); color: var(--jmp-peach); }
.jmp-pill::before {
	content: "";
	width: 10px;
	height: 10px;
	border-radius: 50%;
	background: currentColor;
	box-shadow: 0 0 0 0 currentColor;
	animation: jmp-pulse 2.4s ease-out infinite;
}

/* インスタ → マップ・HP の流れ図 */
.jmp-flow { position: relative; max-width: 520px; margin-inline: auto; }
.jmp-flow__badge-ring {
	position: absolute;
	right: -24px;
	top: -44px;
	width: 132px;
	height: 132px;
	animation: jmp-spin 22s linear infinite;
	pointer-events: none;
}
.jmp-flow__badge-ring text { font-family: var(--jmp-latin); font-size: 11.5px; font-weight: 600; letter-spacing: 3.2px; fill: var(--jmp-navy); }
.jmp-flow__source {
	display: flex;
	align-items: center;
	gap: 18px;
	padding: 26px 28px;
	border-radius: 24px;
	background: var(--jmp-navy);
	color: #fff;
	box-shadow: 0 24px 48px rgba(22, 50, 79, .22);
	animation: jmp-float 6s ease-in-out infinite;
}
.jmp-flow__icon {
	display: flex;
	align-items: center;
	justify-content: center;
	flex: none;
	width: 56px;
	height: 56px;
	border-radius: 16px;
	background: rgba(255, 255, 255, .12);
}
.jmp-flow__small { font-size: 13px; opacity: .75; }
.jmp-flow__big { font-size: 21px; font-weight: 700; }
.jmp-flow__tag {
	margin-left: auto;
	padding: 4px 10px;
	border-radius: 999px;
	background: var(--jmp-accent);
	font-family: var(--jmp-latin);
	font-size: 12px;
	font-weight: 600;
}
.jmp-flow__wire { position: relative; display: flex; justify-content: center; height: 70px; }
.jmp-flow__wire::before {
	content: "";
	position: absolute;
	top: 6px;
	bottom: 6px;
	width: 2px;
	background: repeating-linear-gradient(#C9BFAF 0 6px, transparent 6px 12px);
}
.jmp-flow__dot {
	position: absolute;
	top: 4px;
	width: 12px;
	height: 12px;
	border-radius: 50%;
	background: var(--jmp-accent);
	animation: jmp-drop 2.4s ease-in infinite;
}
.jmp-flow__dot:nth-child(2) { animation-delay: .8s; }
.jmp-flow__dot:nth-child(3) { animation-delay: 1.6s; }
.jmp-flow__targets { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 16px; }
.jmp-flow__target {
	position: relative;
	padding: 24px;
	border: 1px solid var(--jmp-sand);
	border-radius: 22px;
	background: #fff;
	animation: jmp-glow 4.8s ease-out infinite;
}
.jmp-flow__target + .jmp-flow__target, .jmp-flow__target + .jmp-flow__target .jmp-flow__updated { animation-delay: .4s; }
.jmp-flow__updated {
	position: absolute;
	top: -10px;
	right: 14px;
	padding: 3px 10px;
	border-radius: 999px;
	background: var(--jmp-accent);
	color: #fff;
	font-family: var(--jmp-latin);
	font-size: 11px;
	font-weight: 600;
	animation: jmp-ping 4.8s ease-out infinite;
}
.jmp-flow__target-label { margin-top: 10px; font-size: 13px; color: var(--jmp-muted); }
.jmp-flow__target-title { font-size: 17px; font-weight: 700; line-height: 1.5; }
.jmp-flow__caption { margin-top: 18px; font-size: 13px; color: var(--jmp-muted); text-align: center; }

/* ---------- 実績の帯（横に流れる） ---------- */
.jmp-marquee { overflow: hidden; padding: 18px 0; background: var(--jmp-navy); color: #fff; }
.jmp-marquee__track {
	display: flex;
	gap: 56px;
	width: max-content;
	white-space: nowrap;
	font-size: 15px;
	font-weight: 500;
	animation: jmp-marquee 38s linear infinite;
}
.jmp-marquee__track b { font-family: var(--jmp-latin); color: var(--jmp-peach); }

/* ---------- カード（グループのスタイル） ---------- */
:where(.is-style-jmp-card, .is-style-jmp-card-cream, .is-style-jmp-card-navy, .is-style-jmp-card-featured) {
	padding: 32px 28px;
	border-radius: 24px;
	transition: transform .35s var(--jmp-ease), box-shadow .35s;
}
.is-style-jmp-card { background: #fff; border: 1px solid var(--jmp-sand); }
.is-style-jmp-card-cream { background: var(--jmp-cream); }
.jmp-section--white .is-style-jmp-card-cream { background: var(--jmp-cream); }
.is-style-jmp-card-navy { background: var(--jmp-navy); color: #fff; }
.is-style-jmp-card-navy :where(h2, h3, h4, p, a, li) { color: #fff; }
.is-style-jmp-card-featured { position: relative; background: var(--jmp-peach-soft); border: 3px solid var(--jmp-accent); }
:where(.is-style-jmp-card, .is-style-jmp-card-cream, .is-style-jmp-card-navy, .is-style-jmp-card-featured):hover {
	transform: translateY(-8px);
	box-shadow: 0 22px 44px rgba(22, 50, 79, .14);
}
.jmp-section--navy .is-style-jmp-card,
.jmp-section--navy .is-style-jmp-card-featured { color: var(--jmp-navy); }
.jmp-section--navy .is-style-jmp-card :where(h2, h3, h4, p, a, li),
.jmp-section--navy .is-style-jmp-card-featured :where(h2, h3, h4, p, a, li) { color: var(--jmp-navy); }
.jmp-section--navy :where(.is-style-jmp-card, .is-style-jmp-card-featured) .jmp-card-sub { color: var(--jmp-muted); }

.jmp-card-label {
	margin: 0;
	font-family: var(--jmp-latin);
	font-size: 12px;
	font-weight: 600;
	letter-spacing: .14em;
	text-transform: uppercase;
	color: var(--jmp-accent);
}
.is-style-jmp-card-navy .jmp-card-label { color: var(--jmp-peach); }
.jmp-card-title { margin: 0; font-family: var(--jmp-heading); font-weight: 900; font-size: 24px; line-height: 1.4; }
.jmp-card-sub { margin: 0; font-size: 14px; color: var(--jmp-muted); }
.jmp-card-text { margin: 0; font-size: 15px; color: var(--jmp-ink); }
.is-style-jmp-card-navy .jmp-card-text { color: rgba(255, 255, 255, .9); }
.jmp-card-foot { margin: 0; margin-top: auto !important; padding-top: 14px; border-top: 1px solid var(--jmp-sand); font-weight: 700; }
.is-style-jmp-card-navy .jmp-card-foot { border-top-color: rgba(255, 255, 255, .2); }
.jmp-card-foot::after { content: " →"; display: inline-block; transition: transform .25s; }
:where(.is-style-jmp-card, .is-style-jmp-card-navy):hover .jmp-card-foot::after { transform: translateX(6px); }
.jmp-card-foot--plain::after { content: none; }
.jmp-card-link { color: inherit; text-decoration: none; }
.jmp-card-link::after { content: ""; position: absolute; inset: 0; }
.jmp-linkcard { position: relative; }

/* 大きい番号 */
.jmp-index { margin: 0; font-family: var(--jmp-latin); font-weight: 800; font-size: 44px; line-height: 1; color: var(--jmp-accent); }
.jmp-index--soft { color: var(--jmp-sand); font-size: 40px; }

/* ---------- 料金 ---------- */
.jmp-price-label { margin: 14px 0 0; font-size: 13px; color: var(--jmp-muted); }
.jmp-price { margin: 0; font-family: var(--jmp-latin); font-weight: 800; font-size: 42px; line-height: 1.2; }
.jmp-price--sub { font-size: 30px; }
.jmp-price--accent { color: var(--jmp-accent-dark); }
.is-style-jmp-card-navy .jmp-price--accent { color: var(--jmp-peach); }
.jmp-price small { font-family: var(--wp--preset--font-family--body); font-size: 15px; font-weight: 700; }
.jmp-badge {
	position: absolute;
	top: -16px;
	left: 50%;
	transform: translateX(-50%);
	margin: 0 !important;
	padding: 5px 20px;
	border-radius: 999px;
	background: var(--jmp-accent);
	color: #fff !important;
	font-size: 13px;
	font-weight: 700;
	white-space: nowrap;
}
.jmp-badge--left { left: 28px; transform: none; }

/* ---------- 流れ（ステップ） ---------- */
.jmp-step { padding: 26px 22px; border-radius: 22px; background: var(--jmp-cream); }
.jmp-section--dots .jmp-step, .jmp-section:not(.jmp-section--white) .jmp-step { background: #fff; border: 1px solid var(--jmp-sand); }
.jmp-section--white .jmp-step { background: var(--jmp-cream); border: 0; }
.jmp-step--goal { background: var(--jmp-accent) !important; border: 0 !important; color: #fff; }
.jmp-step--goal :where(p, h3) { color: #fff !important; }
.jmp-step-title { margin: 12px 0 0; font-weight: 700; font-size: 18px; }
.jmp-step-text { margin: 4px 0 0; font-size: 14px; color: var(--jmp-ink); }

/* ---------- 事例カード（クエリーループ） ---------- */
.jmp-works .wp-block-post {
	display: flex;
	flex-direction: column;
	overflow: hidden;
	border: 1px solid var(--jmp-sand);
	border-radius: 24px;
	background: #fff;
	transition: transform .35s var(--jmp-ease), box-shadow .35s;
}
.jmp-works .wp-block-post:hover { transform: translateY(-8px); box-shadow: 0 22px 44px rgba(22, 50, 79, .14); }
.jmp-works .wp-block-post-featured-image { margin: 0; }
.jmp-works .wp-block-post-featured-image img { width: 100%; aspect-ratio: 16 / 10; object-fit: cover; }
.jmp-work-body { padding: 24px 26px 28px; }
.jmp-work-scope { margin: 0; font-size: 12px; color: var(--jmp-muted); }
.jmp-works .wp-block-post-title { margin: 0; font-family: var(--wp--preset--font-family--body); font-size: 18px; font-weight: 700; }
.jmp-works .wp-block-post-title a { text-decoration: none; }
.jmp-work-num { margin: 0; font-family: var(--jmp-latin); font-weight: 800; font-size: 34px; line-height: 1.2; color: var(--jmp-accent); }
.jmp-work-num:empty { display: none; }
.jmp-works .wp-block-post-excerpt { font-size: 14px; color: var(--jmp-ink); }
.jmp-works .wp-block-post-excerpt__more-text { display: none; }

/* 自社メディアの帯 */
.jmp-selfmedia { padding: 26px 30px; border: 1px dashed #C9BFAF; border-radius: 24px; background: #fff; }

/* ---------- 代表紹介 ---------- */
.jmp-portrait { position: relative; }
.jmp-portrait::before {
	content: "";
	position: absolute;
	inset: 18px -18px -18px 18px;
	border: 2px solid var(--jmp-accent);
	border-radius: 28px;
}
.jmp-portrait img { position: relative; border-radius: 28px; aspect-ratio: 4 / 5; object-fit: cover; width: 100%; }
.jmp-chips { display: flex; flex-wrap: wrap; gap: 8px; padding: 0; list-style: none; }
.jmp-chips li { padding: 6px 14px; border: 1px solid var(--jmp-sand); border-radius: 999px; background: #fff; font-size: 13px; }

/* ---------- コラム一覧 ---------- */
.jmp-posts .wp-block-post { display: flex; flex-direction: column; gap: 10px; }
.jmp-posts .wp-block-post-featured-image img { border-radius: 20px; aspect-ratio: 3 / 2; object-fit: cover; width: 100%; transition: transform .5s var(--jmp-ease); }
.jmp-posts .wp-block-post-featured-image { overflow: hidden; border-radius: 20px; margin: 0; }
.jmp-posts .wp-block-post:hover .wp-block-post-featured-image img { transform: scale(1.04); }
.jmp-posts .wp-block-post-title { margin: 0; font-family: var(--wp--preset--font-family--body); font-size: 16px; font-weight: 700; line-height: 1.6; }
.jmp-posts .wp-block-post-title a { text-decoration: none; }
.jmp-posts .wp-block-post-terms { font-size: 12px; color: var(--jmp-muted); }
.jmp-posts .wp-block-post-terms a { color: var(--jmp-muted); text-decoration: none; }
.jmp-posts .wp-block-post-date { font-size: 12px; color: var(--jmp-muted); font-family: var(--jmp-latin); }

/* ---------- FAQ ---------- */
.jmp-faq .wp-block-details {
	padding: 22px 26px;
	border-radius: 18px;
	background: var(--jmp-cream);
}
.jmp-faq .wp-block-details + .wp-block-details { margin-top: 12px; }
.jmp-faq summary {
	display: flex;
	justify-content: space-between;
	align-items: center;
	gap: 16px;
	list-style: none;
	cursor: pointer;
	font-weight: 700;
	font-size: 17px;
}
.jmp-faq summary::-webkit-details-marker { display: none; }
.jmp-faq summary::after { content: "＋"; flex: none; font-size: 26px; line-height: 1; color: var(--jmp-accent); transition: transform .25s; }
.jmp-faq details[open] summary::after { transform: rotate(45deg); }
.jmp-faq details p { margin: 12px 0 0; font-size: 15px; color: var(--jmp-ink); }

/* ---------- 相談の帯 ---------- */
.jmp-cta {
	position: relative;
	overflow: hidden;
	padding: clamp(40px, 6vw, 72px) clamp(28px, 5vw, 56px);
	border-radius: 32px;
	background: var(--jmp-accent);
	color: #fff;
}
.jmp-cta :where(h2, p, a) { color: #fff; }
.jmp-cta::before, .jmp-cta::after {
	content: "";
	position: absolute;
	width: 280px;
	height: 280px;
	border-radius: 50%;
	border: 2px solid rgba(255, 255, 255, .25);
	right: -60px;
	bottom: -80px;
	pointer-events: none;
}
.jmp-cta::after { right: 40px; bottom: -140px; border-color: rgba(255, 255, 255, .15); }
.jmp-cta > * { position: relative; }
.jmp-cta .wp-block-buttons { flex-direction: column; align-items: stretch; }
.jmp-cta .wp-block-button__link { width: 100%; text-align: center; }
.jmp-tel a { color: #fff; font-weight: 700; text-decoration: none; }

/* ---------- ボタンのスタイル ---------- */
.wp-block-button__link { transition: transform .25s, box-shadow .25s, background-color .25s; }
.wp-block-button__link:hover { transform: translateY(-2px); box-shadow: 0 10px 24px rgba(22, 50, 79, .18); }
.is-style-jmp-outline .wp-block-button__link { background: #fff; color: var(--jmp-navy); border: 1px solid var(--jmp-navy); }
.is-style-jmp-outline .wp-block-button__link:hover { background: #fff; color: var(--jmp-navy); }
.is-style-jmp-navy .wp-block-button__link { background: var(--jmp-navy); color: #fff; }
.is-style-jmp-navy .wp-block-button__link:hover { background: var(--jmp-navy-deep); color: #fff; }
.is-style-jmp-white .wp-block-button__link { background: #fff; color: var(--jmp-navy); }
.is-style-jmp-white .wp-block-button__link:hover { background: #fff; color: var(--jmp-navy); }
.jmp-textlink { font-weight: 700; }
.jmp-section--navy .jmp-textlink a { color: #fff; }

/* ---------- 画像の仮枠 ---------- */
.jmp-ph img { width: 100%; border-radius: 20px; background: var(--jmp-sand-deep); object-fit: cover; }
.jmp-ph--card img { border-radius: 0; aspect-ratio: 16 / 10; }

/* ---------- 下層ページの見出し帯 ---------- */
.jmp-pagehead { padding-block: clamp(56px, 8vw, 88px) clamp(40px, 6vw, 64px); }
.jmp-pagehead h1 { font-size: clamp(2rem, 4vw, 3rem); }

/* ---------- 記事ページ ---------- */
.jmp-article { padding-block: 48px 88px; }
.jmp-article .wp-block-post-content :where(h2) {
	margin-top: 2.4em;
	padding: 14px 20px;
	border-radius: 14px;
	background: var(--jmp-navy);
	color: #fff;
	font-size: clamp(1.25rem, 2.4vw, 1.5rem);
}
.jmp-article .wp-block-post-content :where(h3) {
	margin-top: 2em;
	padding-left: 14px;
	border-left: 4px solid var(--jmp-accent);
	font-size: 1.2rem;
}
.jmp-article .wp-block-post-content :where(p, li) { color: var(--jmp-ink); }
.jmp-article .wp-block-post-content a { color: var(--jmp-accent-dark); }

/* ---------- フッター ---------- */
.jmp-footer { background: var(--jmp-navy-deep); color: #DCE3EA; padding-block: 64px 0; }
.jmp-footer-main { margin-bottom: 40px; }
.jmp-footer-bottom { padding-block: 18px 32px; }
.jmp-footer :where(p, a, li) { color: #DCE3EA; }
.jmp-footer a { text-decoration: none; }
.jmp-footer a:hover { color: #fff; text-decoration: underline; }
.jmp-footer .jmp-brand a { color: #fff; }
.jmp-footer .jmp-brand .dot { color: var(--jmp-peach); }
.jmp-footer-head { margin: 0 0 6px; font-size: 12px; font-weight: 700; color: #9FB0C2 !important; }
.jmp-footer-links { margin: 0; padding: 0; list-style: none; font-size: 14px; display: flex; flex-direction: column; gap: 8px; }
.jmp-footer-bottom { border-top: 1px solid #23395A; font-size: 12px; }
.jmp-footer-bottom :where(p, a) { color: #9FB0C2; }

/* ---------- スクロールで現れる演出 ---------- */
.jmp-js .jmp-reveal {
	opacity: 0;
	transform: translateY(28px);
	transition: opacity .9s var(--jmp-ease), transform .9s var(--jmp-ease);
	transition-delay: var(--jmp-delay, 0s);
}
.jmp-js .jmp-reveal.is-visible { opacity: 1; transform: none; }

/* ヒーローの見出しは読み込み時に順に出す */
.jmp-js .jmp-hero .jmp-intro { animation: jmp-fade-up .9s var(--jmp-ease) both; }
.jmp-js .jmp-hero .jmp-intro:nth-child(2) { animation-delay: .1s; }
.jmp-js .jmp-hero .jmp-intro:nth-child(3) { animation-delay: .22s; }
.jmp-js .jmp-hero .jmp-intro:nth-child(4) { animation-delay: .36s; }
.jmp-js .jmp-hero .jmp-intro:nth-child(5) { animation-delay: .5s; }

/* ---------- キーフレーム ---------- */
@keyframes jmp-fade-up { from { opacity: 0; transform: translateY(28px); } to { opacity: 1; transform: none; } }
@keyframes jmp-drop { 0% { transform: translateY(0); opacity: 0; } 20%, 80% { opacity: 1; } 100% { transform: translateY(54px); opacity: 0; } }
@keyframes jmp-ping { 0%, 55% { transform: scale(.4); opacity: 0; } 65% { transform: scale(1.15); opacity: 1; } 75%, 92% { transform: scale(1); opacity: 1; } 100% { opacity: 0; } }
@keyframes jmp-glow { 0%, 55% { box-shadow: 0 0 0 0 rgba(194, 87, 26, 0); } 68% { box-shadow: 0 0 0 6px rgba(194, 87, 26, .18); } 100% { box-shadow: 0 0 0 0 rgba(194, 87, 26, 0); } }
@keyframes jmp-float { 50% { transform: translateY(-10px); } }
@keyframes jmp-spin { to { transform: rotate(360deg); } }
@keyframes jmp-marquee { to { transform: translateX(-50%); } }
@keyframes jmp-pulse { 0% { box-shadow: 0 0 0 0 rgba(194, 87, 26, .45); } 100% { box-shadow: 0 0 0 9px rgba(194, 87, 26, 0); } }

/* ---------- スマホ ---------- */
@media (max-width: 781px) {
	.jmp-flow__badge-ring { width: 96px; height: 96px; right: -8px; top: -36px; }
	.jmp-flow__source { padding: 20px; }
	.jmp-flow__target { padding: 18px; }
	.jmp-portrait::before { inset: 12px -12px -12px 12px; }
	.jmp-brand-tag { display: none; }
}

/* 動きを控える設定 */
@media (prefers-reduced-motion: reduce) {
	*, *::before, *::after { animation: none !important; transition: none !important; }
	.jmp-js .jmp-reveal { opacity: 1; transform: none; }
}

/* =========================================================
   追加コンポーネント（サービス詳細ページ）
   ========================================================= */
.jmp-peach-text { color: var(--jmp-peach); }
.jmp-closing { margin-top: 48px !important; font-family: var(--jmp-heading); font-weight: 900; font-size: clamp(1.25rem, 2.4vw, 1.625rem); }
.jmp-section-head .jmp-eyebrow + h2 { margin-top: 0; }
.jmp-plan-btn { margin-top: 12px !important; }
.jmp-plan-btn .wp-block-button { width: 100%; }
.jmp-plan-btn .wp-block-button__link { width: 100%; text-align: center; padding: 13px; }
.jmp-plan-extra { margin-top: 28px !important; }
.jmp-notes { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 10px 24px; margin-top: 32px; padding-left: 1.2em; font-size: 14px; }
.jmp-section--navy .jmp-notes li { color: rgba(255, 255, 255, .88); }

/* インスタJUMP：投稿のモック */
.jmp-mock { max-width: 460px; margin-inline: auto; padding: 28px; border-radius: 28px; background: #fff; color: var(--jmp-navy); box-shadow: 0 30px 60px rgba(0, 0, 0, .25); animation: jmp-float 6s ease-in-out infinite; }
.jmp-mock__head { display: flex; align-items: center; gap: 12px; }
.jmp-mock__avatar { display: flex; align-items: center; justify-content: center; width: 40px; height: 40px; border-radius: 12px; background: var(--jmp-navy); }
.jmp-mock__name { font-size: 15px; font-weight: 700; color: var(--jmp-navy); }
.jmp-mock__sub { font-size: 12px; color: var(--jmp-muted); }
.jmp-mock__photo { height: 150px; margin-top: 16px; border-radius: 16px; background: var(--jmp-sand-deep); }
.jmp-section--navy .jmp-mock p.jmp-mock__text { margin: 12px 0 0; font-size: 14px; color: var(--jmp-navy); }
.jmp-mock__wire { position: relative; height: 34px; margin: 14px 0 6px; overflow: hidden; }
.jmp-mock__wire::before { content: ""; position: absolute; top: 16px; left: 0; right: 0; height: 2px; background: repeating-linear-gradient(90deg, var(--jmp-sand) 0 6px, transparent 6px 12px); }
.jmp-mock__wire span { position: absolute; top: 11px; left: 0; width: 12px; height: 12px; border-radius: 50%; background: var(--jmp-accent); animation: jmp-slide 2.6s ease-in-out infinite; }
.jmp-mock__wire span:nth-child(2) { animation-delay: .9s; }
.jmp-mock__wire span:nth-child(3) { animation-delay: 1.8s; }
.jmp-mock__targets { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.jmp-mock__targets > div { position: relative; display: flex; flex-direction: column; padding: 16px; border-radius: 16px; background: var(--jmp-cream); }
.jmp-mock__targets small { font-size: 12px; color: var(--jmp-muted); }
.jmp-mock__targets b { font-size: 14px; }
.jmp-mock__new { position: absolute; top: -9px; right: 10px; padding: 2px 9px; border-radius: 999px; background: var(--jmp-accent); color: #fff; font-family: var(--jmp-latin); font-size: 10px; font-weight: 600; animation: jmp-ping 5.2s ease-out infinite; }
.jmp-mock__targets > div + div .jmp-mock__new { animation-delay: .5s; }

/* ホームページ制作：ブラウザのモック */
.jmp-browser { overflow: hidden; border: 1px solid var(--jmp-sand); border-radius: 22px; background: #fff; box-shadow: 0 30px 60px rgba(22, 50, 79, .14); animation: jmp-float 6s ease-in-out infinite; }
.jmp-browser__bar { display: flex; align-items: center; gap: 6px; padding: 12px 16px; background: #F2EDE5; }
.jmp-browser__bar i { width: 10px; height: 10px; border-radius: 50%; background: #D5CBBB; }
.jmp-browser__bar span { flex: 1; margin-left: 12px; padding: 2px 14px; border-radius: 999px; background: #fff; font-size: 12px; color: var(--jmp-muted); }
.jmp-browser__body { display: flex; flex-direction: column; gap: 10px; padding: 24px; }
.jmp-browser__hero { display: flex; align-items: flex-end; height: 120px; margin-bottom: 8px; padding: 16px; border-radius: 14px; background: var(--jmp-navy); color: #fff; font-family: var(--jmp-heading); font-weight: 900; font-size: 20px; }
.jmp-browser__line { display: block; width: 100%; max-width: var(--w); height: 10px; border-radius: 999px; background: var(--jmp-sand); animation: jmp-bar 3.6s var(--jmp-ease) infinite; }
.jmp-browser__line.is-accent { background: var(--jmp-accent); animation-delay: .6s; }
.jmp-browser__line:nth-of-type(3) { animation-delay: .3s; }
.jmp-browser__tiles { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; margin-top: 8px; }
.jmp-browser__tiles span { height: 64px; border-radius: 10px; background: #F2EDE5; }

/* SEO：検索結果のイメージ */
.jmp-serp { max-width: 460px; margin-inline: auto; padding: 26px; border-radius: 26px; background: #fff; color: var(--jmp-navy); box-shadow: 0 30px 60px rgba(0, 0, 0, .25); animation: jmp-float 6s ease-in-out infinite; }
.jmp-serp__search { display: flex; align-items: center; gap: 10px; padding: 10px 16px; border: 1px solid var(--jmp-sand); border-radius: 999px; font-size: 14px; }
.jmp-serp__list { position: relative; display: flex; flex-direction: column; gap: 10px; height: 196px; margin-top: 14px; overflow: hidden; }
.jmp-serp__list i { display: block; height: 56px; border-radius: 14px; background: #F2EDE5; opacity: .6; }
.jmp-serp__list i:first-of-type { margin-top: 66px; }
.jmp-serp__you { position: absolute; left: 0; right: 0; top: 132px; display: flex; align-items: center; gap: 12px; padding: 12px 14px; border: 2px solid var(--jmp-accent); border-radius: 14px; background: var(--jmp-peach-soft); animation: jmp-climb 5s var(--jmp-ease) infinite; z-index: 1; }
.jmp-serp__you b { font-family: var(--jmp-latin); font-size: 20px; color: var(--jmp-accent); }
.jmp-serp__you span { display: flex; flex-direction: column; font-size: 14px; }
.jmp-serp__you small { font-size: 12px; color: var(--jmp-muted); }
.jmp-serp__bars { display: flex; align-items: flex-end; gap: 8px; height: 90px; margin-top: 10px; }
.jmp-serp__bars span { flex: 1; height: var(--h); border-radius: 6px 6px 0 0; background: var(--jmp-sand); animation: jmp-grow 4s var(--jmp-ease) infinite; }
.jmp-serp__bars span:nth-child(2) { animation-delay: .15s; }
.jmp-serp__bars span:nth-child(3) { animation-delay: .3s; }
.jmp-serp__bars span:nth-child(4) { animation-delay: .45s; }
.jmp-serp__bars span:nth-child(5) { animation-delay: .6s; }
.jmp-serp__bars span.is-accent { background: var(--jmp-accent); animation-delay: .75s; }
.jmp-section--navy .jmp-serp p.jmp-serp__cap { margin: 6px 0 0; font-size: 12px; color: var(--jmp-muted); text-align: right; }

/* 業務自動化：流れの図 */
.jmp-auto { padding: 30px 26px; border-radius: 26px; background: var(--jmp-navy); box-shadow: 0 30px 60px rgba(22, 50, 79, .25); animation: jmp-float 6s ease-in-out infinite; }
.jmp-auto p { margin: 0; color: #fff; font-size: 13px; opacity: .8; }
.jmp-auto__foot { margin-top: 18px !important; text-align: center; }
.jmp-auto__row { position: relative; display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; margin-top: 18px; }
.jmp-auto__wire { position: absolute; left: 12%; right: 12%; top: 50%; height: 2px; background: repeating-linear-gradient(90deg, rgba(255, 255, 255, .3) 0 6px, transparent 6px 12px); }
.jmp-auto__wire b { position: absolute; top: -5px; left: 0; width: 12px; height: 12px; border-radius: 50%; background: var(--jmp-accent); animation: jmp-run 3s linear infinite; }
.jmp-auto__node { position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 18px 12px; border-radius: 18px; background: #fff; color: var(--jmp-navy); font-size: 13px; font-weight: 700; text-align: center; animation: jmp-lit 3s linear infinite; }
.jmp-auto__node:nth-of-type(3) { animation-delay: 1s; }
.jmp-auto__node:nth-of-type(4) { animation-delay: 2s; }

/* 事業者情報の表 */
.jmp-table { width: 100%; border-collapse: collapse; border-top: 1px solid var(--jmp-sand); }
.jmp-table th, .jmp-table td { padding: 18px 8px; border-bottom: 1px solid var(--jmp-sand); text-align: left; vertical-align: top; }
.jmp-table th { width: 160px; font-size: 14px; }
.jmp-table td { color: var(--jmp-ink); }

/* フォームの置き場所 */
.jmp-form-area { min-height: 320px; }
.jmp-form-note { color: var(--jmp-muted); font-size: 14px; }
.jmp-form-area input:not([type="checkbox"]):not([type="radio"]):not([type="submit"]),
.jmp-form-area textarea,
.jmp-form-area select { width: 100%; padding: 14px 16px; border: 1px solid #D5CBBB; border-radius: 12px; background: var(--jmp-cream); font: inherit; }
.jmp-form-area [type="submit"], .jmp-form-area button { padding: 16px 40px; border: 0; border-radius: 999px; background: var(--jmp-accent); color: #fff; font: inherit; font-weight: 700; cursor: pointer; }

/* 記事ページまわり */
.jmp-meta { gap: 12px; font-size: 13px; }
.jmp-meta-cat a { padding: 2px 12px; border-radius: 999px; background: #fff; border: 1px solid var(--jmp-sand); text-decoration: none; }
.jmp-single-title { margin-top: 10px; font-size: clamp(1.625rem, 3.4vw, 2.375rem); }
.jmp-single-eyecatch img { border-radius: 20px; }
.jmp-related { margin-top: 72px; }
.jmp-related-title { font-size: 1.5rem; }
.jmp-article > .wp-block-post-content > :first-child { margin-top: 0; }

@keyframes jmp-slide { 0% { transform: translateX(0); opacity: 0; } 15%, 85% { opacity: 1; } 100% { transform: translateX(120px); opacity: 0; } }
@keyframes jmp-bar { 0% { max-width: 0; } 60%, 100% { max-width: var(--w); } }
@keyframes jmp-climb { 0% { transform: translateY(0); } 35%, 100% { transform: translateY(-132px); } }
@keyframes jmp-grow { 0% { height: 8%; } 60%, 100% { height: var(--h); } }
@keyframes jmp-run { 0% { left: 0; opacity: 0; } 10%, 90% { opacity: 1; } 100% { left: calc(100% - 12px); opacity: 0; } }
@keyframes jmp-lit { 0%, 100% { background: #fff; } 20%, 40% { background: var(--jmp-peach-soft); } }

/* ---------- 調整 ---------- */
.wp-block-post-content > .alignfull:first-child,
.wp-block-post-content > .alignfull + .alignfull,
.wp-block-post-content > .alignfull + .wp-block-group.alignfull { margin-block-start: 0; }
main.wp-block-group > .alignfull + .alignfull { margin-block-start: 0; }
:where(.is-style-jmp-card, .is-style-jmp-card-cream, .is-style-jmp-card-navy, .is-style-jmp-card-featured).is-layout-flex { gap: 10px; }
.jmp-step.is-layout-flex { gap: 6px; }
.jmp-step-title { margin-top: 8px; }
.jmp-work-body.is-layout-flex { gap: 8px; }
.jmp-work-num { font-size: 26px; line-height: 1.3; }
.jmp-flow__tag { flex: none; white-space: nowrap; }
.jmp-card-title { margin-bottom: 2px; }
@media (max-width: 781px) {
	.jmp-flow__badge-ring { display: none; }
	.jmp-flow__big { font-size: 18px; }
	.jmp-hero h1 { font-size: clamp(2rem, 8.4vw, 2.5rem); }
}

/* グリッドはタブレット・スマホで自動的に列数を減らす */
@media (max-width: 1024px) {
	.is-layout-grid {
		grid-template-columns: repeat(auto-fill, minmax(min(16rem, 100%), 1fr)) !important;
	}
}
.jmp-hero h1.jmp-hero-sm { font-size: clamp(1.875rem, 3.3vw, 2.875rem); line-height: 1.4; }
.jmp-lead.jmp-center { margin-inline: auto; }
@media (prefers-reduced-motion: reduce) {
	.jmp-serp__you { top: 0; }
	.jmp-browser__line { max-width: var(--w); }
}
.jmp-selfmedia { margin-top: 24px !important; }
.jmp-article:has(> .alignfull:last-child) { padding-bottom: 0; }
.jmp-article:has(> .alignfull:first-child) { padding-top: 0; }