:root {
	--ink: #17212f;
	--muted: #5e6876;
	--line: #e5ebf0;
	--paper: #ffffff;
	--fog: #f7faf9;
	--navy: #193a5c;
	--blue: #2478d8;
	--green: #2f987f;
	--mint: #e9f7f0;
	--orange: #f39800;
	--orange-dark: #c97800;
	--orange-soft: #fff2dd;
	--cream: #fff9f0;
	--shadow: 0 24px 70px rgba(28, 43, 61, 0.1);
}

* {
	box-sizing: border-box;
}

html {
	scroll-behavior: smooth;
}

body {
	margin: 0;
	color: var(--ink);
	background: var(--fog);
	font-family: 'Noto Sans JP', 'Yu Gothic', 'Meiryo', sans-serif;
	line-height: 1.75;
}

a {
	color: inherit;
}

.site-header {
	position: fixed;
	inset: 0px 0px auto;
	z-index: 20;
	display: grid;
	grid-template-columns: auto 1fr auto;
	gap: 28px;
	align-items: center;
	min-height: 68px;
	border: 1px solid rgba(223, 229, 236, 0.78);

	padding: 10px 14px 10px 18px;
	background: rgba(255, 255, 255, 0.9);
	box-shadow: 0 16px 50px rgba(29, 53, 87, 0.12);
	backdrop-filter: blur(16px);
}

.brand {
	display: inline-flex;
	gap: 10px;
	align-items: center;
	min-width: 230px;
	text-decoration: none;
}

.brand-symbol {
	display: block;
	width: 42px;
	height: 42px;
	object-fit: contain;
}

.brand-logo {
	display: block;
	width: 176px;
	height: auto;
}

.nav {
	display: flex;
	justify-content: flex-end;
	gap: 18px;
	color: var(--muted);
	font-size: 14px;
}

.nav a {
	text-decoration: none;
}

.header-cta,
.button,
.contact-button {
	display: inline-flex;
	align-items: center;
	justify-content: center;
	min-height: 44px;
	border-radius: 6px;
	padding: 11px 18px;
	font-weight: 800;
	line-height: 1.3;
	text-decoration: none;
}

.header-cta,
.button.primary {
	background: var(--navy);
	color: #fff;
}

.header-cta,
.button.action,
.contact-button {
	background: var(--orange);
	color: #fff;
}

.button.secondary {
	border: 1px solid rgba(29, 53, 87, 0.28);
	background: rgba(255, 255, 255, 0.86);
	color: var(--navy);
}

.button.outline {
	border: 1px solid var(--line);
	background: #fff;
	color: var(--ink);
}

.menu-toggle {
	display: none;
	align-items: center;
	justify-content: center;
	flex-direction: column;
	gap: 5px;
	width: 44px;
	height: 44px;
	border: 1px solid rgba(29, 53, 87, 0.18);
	border-radius: 6px;
	padding: 0;
	background: rgba(255, 255, 255, 0.94);
	color: var(--navy);
	cursor: pointer;
	transition: background 0.2s ease;
}

.menu-toggle:hover {
	background: #fff;
}

.menu-toggle-bar {
	display: block;
	width: 22px;
	height: 2px;
	border-radius: 2px;
	background: currentColor;
	transition:
		transform 0.26s ease,
		opacity 0.2s ease;
}

.menu-toggle.open .menu-toggle-bar:nth-child(1) {
	transform: translateY(7px) rotate(45deg);
}

.menu-toggle.open .menu-toggle-bar:nth-child(2) {
	opacity: 0;
}

.menu-toggle.open .menu-toggle-bar:nth-child(3) {
	transform: translateY(-7px) rotate(-45deg);
}

.menu-overlay {
	position: fixed;
	inset: 0;
	z-index: 30;
	background: rgba(15, 22, 35, 0.5);
	opacity: 0;
	visibility: hidden;
	transition:
		opacity 0.28s ease,
		visibility 0.28s ease;
}

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

.menu-drawer {
	position: fixed;
	top: 0;
	left: 0;
	z-index: 40;
	display: flex;
	flex-direction: column;
	width: min(320px, 84vw);
	height: 100vh;
	height: 100dvh;
	margin: 0;
	background: #fff;
	box-shadow: 24px 0 60px rgba(15, 22, 35, 0);
	transform: translateX(-100%);
	transition:
		transform 0.32s cubic-bezier(0.22, 0.8, 0.32, 1),
		box-shadow 0.32s ease;
}

.menu-drawer.open {
	box-shadow: 24px 0 60px rgba(15, 22, 35, 0.22);
	transform: translateX(0);
}

.menu-drawer-head {
	display: flex;
	justify-content: flex-end;
	padding: 12px 14px;
}

.menu-close {
	width: 40px;
	height: 40px;
	border: none;
	border-radius: 6px;
	padding: 0;
	background: transparent;
	color: var(--ink);
	font-size: 28px;
	line-height: 1;
	cursor: pointer;
	transition: background 0.2s ease;
}

.menu-close:hover {
	background: var(--fog);
}

.drawer-nav {
	display: flex;
	flex-direction: column;
	padding: 4px 22px 16px;
}

.drawer-nav a {
	display: block;
	padding: 14px 6px;
	border-bottom: 1px solid var(--line);
	color: var(--ink);
	font-size: 15px;
	font-weight: 700;
	text-decoration: none;
}

.drawer-nav a:last-child {
	border-bottom: none;
}

.button.drawer-cta {
	width: auto;
	margin: 8px 22px 24px;
}

.hero {
	position: relative;
	display: grid;
	min-height: 780px;
	align-items: center;
	overflow: hidden;
	padding: 168px 0 112px;
	background: linear-gradient(90deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.92) 50%, rgba(255, 255, 255, 0.2) 100%), linear-gradient(135deg, #ffffff 0%, #edf8f4 48%, var(--orange-soft) 100%);
}

.hero-mark-wrap {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 1;
	width: 0;
	height: 0;
	pointer-events: none;
	transform: translate(-155px, 179px);
}

.hero-mark-ripple {
	position: absolute;
	top: 50%;
	left: 50%;
	width: 500px;
	height: 500px;
	border: 2px solid var(--orange);
	border-radius: 50%;
	opacity: 0;
	transform: translate(-50%, -50%) scale(0);
	animation: heroMarkRipple 7.2s ease-out infinite;
	will-change: transform, opacity;
}

.ripple-1 {
	animation-delay: 3.1s;
}

.ripple-2 {
	animation-delay: 5.5s;
}

.ripple-3 {
	animation-delay: 7.9s;
}

.hero::after {
	content: '';
	position: absolute;
	inset: auto 0 0;
	height: 160px;
	background: linear-gradient(0deg, #f7faf9, rgba(247, 250, 249, 0));
}

.hero-content,
.section-inner {
	position: relative;
	z-index: 2;
	width: min(1120px, calc(100% - 40px));
	margin: 0 auto;
}

.hero-content {
	max-width: 780px;
	margin-left: max(20px, calc((100% - 1120px) / 2));
}

.hero h1 {
	font-size: 50px;
}

.eyebrow {
	margin: 0 0 12px;
	color: var(--green);
	font-size: 13px;
	font-weight: 900;
	letter-spacing: 0.08em;
	text-transform: uppercase;
}

h1,
h2,
h3,
p {
	margin-top: 0;
}

h1 {
	margin-bottom: 22px;
	font-size: 50px;
	line-height: 1.16;
}

.hero-accent {
	color: var(--orange);
}

h2 {
	margin-bottom: 18px;
	font-size: 40px;
	line-height: 1.25;
}

h3 {
	margin-bottom: 12px;
	font-size: 22px;
	line-height: 1.35;
}

.lead {
	max-width: 640px;
	color: #394556;
	font-size: 18px;
}

.actions {
	display: flex;
	flex-wrap: wrap;
	gap: 12px;
	margin-top: 30px;
}

.actions.compact {
	margin-top: 24px;
}

.hero-scene {
	position: absolute;
	inset: 130px max(24px, calc((100% - 1220px) / 2)) 70px auto;
	width: min(520px, 42vw);
	z-index: 1;
}

.venue-panel,
.phone-panel,
.local-panel,
.transit-panel,
.stamp-panel,
.product-card,
.case-list article,
.service-grid article,
.company dl,
.news-list {
	border: 1px solid rgba(223, 229, 236, 0.92);
	border-radius: 8px;
	background: rgba(255, 255, 255, 0.92);
	box-shadow: var(--shadow);
}

.venue-panel {
	position: absolute;
	inset: 20px 0 auto auto;
	width: 420px;
	padding: 24px;
}

.venue-top {
	display: flex;
	justify-content: space-between;
	margin-bottom: 18px;
	color: var(--muted);
	font-size: 12px;
}

.venue-top strong {
	color: var(--ink);
}

.seat-map,
.mini-seat-map {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 10px;
}

.seat-map span,
.mini-seat-map span {
	display: block;
	aspect-ratio: 1;
	border-radius: 6px;
	background: #e5ebf0;
}

.seat-map .selected,
.mini-seat-map .active {
	background: var(--blue);
}

.seat-map .hold {
	background: var(--orange);
}

.phone-panel {
	position: absolute;
	right: 270px;
	bottom: 58px;
	width: 170px;
	min-height: 296px;
	padding: 18px 16px;
	border-radius: 24px;
	background: #17212f;
}

.phone-speaker {
	width: 44px;
	height: 5px;
	margin: 0 auto 22px;
	border-radius: 99px;
	background: #6a7484;
}

.ticket-card {
	border-radius: 8px;
	padding: 16px;
	background: #fff;
	color: var(--ink);
}

.ticket-card span,
.local-label {
	color: var(--muted);
	font-size: 12px;
	font-weight: 900;
}

.qr-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 5px;
	margin: 16px 0;
}

.qr-grid i {
	display: block;
	aspect-ratio: 1;
	background: var(--ink);
}

.qr-grid i:nth-child(2),
.qr-grid i:nth-child(4),
.qr-grid i:nth-child(8) {
	background: #dfe5ec;
}

.local-panel {
	position: absolute;
	right: 20px;
	bottom: 0;
	width: 280px;
	padding: 22px;
	background: var(--orange-soft);
}

.transit-panel,
.stamp-panel {
	position: absolute;
	padding: 18px;
	background: rgba(255, 255, 255, 0.94);
}

.transit-panel {
	left: 12px;
	top: 252px;
	width: 250px;
}

.stamp-panel {
	right: 0;
	top: 302px;
	width: 210px;
	background: #fffaf1;
}

.transit-panel span,
.stamp-panel span {
	display: block;
	color: var(--muted);
	font-size: 12px;
	font-weight: 900;
}

.transit-panel strong,
.stamp-panel strong {
	display: block;
	margin: 6px 0 12px;
	font-size: 16px;
	line-height: 1.45;
}

.transit-panel p,
.stamp-panel p {
	margin: 12px 0 0;
	color: var(--muted);
	font-size: 13px;
}

.route-line {
	display: grid;
	grid-template-columns: 14px 1fr 14px;
	gap: 8px;
	align-items: center;
}

.route-line i {
	display: block;
	width: 14px;
	height: 14px;
	border-radius: 50%;
	background: var(--green);
}

.route-line i:last-child {
	background: var(--blue);
}

.route-line b {
	display: block;
	height: 4px;
	border-radius: 99px;
	background: linear-gradient(90deg, var(--green), var(--blue));
}

.stamp-row {
	display: grid;
	grid-template-columns: repeat(6, 1fr);
	gap: 6px;
}

.stamp-row i {
	display: block;
	aspect-ratio: 1;
	border-radius: 50%;
	background: var(--orange);
	box-shadow: inset 0 0 0 4px rgba(255, 255, 255, 0.68);
}

.stamp-row .empty {
	background: #edf1f4;
	box-shadow: inset 0 0 0 2px #d7dfe6;
}

.local-panel strong {
	display: block;
	margin: 6px 0 8px;
	font-size: 26px;
}

.local-panel p {
	color: var(--muted);
	font-size: 14px;
}

.progress {
	height: 8px;
	overflow: hidden;
	border-radius: 99px;
	background: #f4d8ad;
}

.progress span {
	display: block;
	width: 78%;
	height: 100%;
	background: var(--orange);
}

.section {
	padding: 120px 0;
}

.intro {
	padding-top: 72px;
	padding-bottom: 112px;
	background: #fff;
}

.intro-grid,
.proof-grid,
.company-grid,
.news-grid,
.contact-grid {
	display: grid;
	grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
	gap: 50px;
	align-items: start;
}

.company-profile .company-grid {
	grid-template-columns: minmax(0, 0.7fr) minmax(0, 1.3fr);
}

.intro-copy p,
.proof-grid p,
.company-grid dd {
	color: var(--muted);
}

.intro-grid {
	grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
	align-items: center;
}

.intro-copy p {
	margin-bottom: 0;
}

.intro-illustration {
	grid-column: 2 / 3;
	justify-self: end;
	margin: 0;
	overflow: hidden;
	background: transparent;
}

.intro-illustration img {
	display: block;
	width: 100%;
	height: auto;
	max-width: 460px;
}

.intro-visual {
	grid-column: 1 / -1;
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 18px;
	margin-top: 48px;
}

.workflow-card {
	position: relative;
	min-height: 370px;
	border: 1px solid rgba(223, 229, 236, 0.92);
	border-radius: 8px;
	padding: 26px;
	background: rgba(255, 255, 255, 0.88);
	box-shadow: 0 20px 54px rgba(28, 43, 61, 0.08);
}

.workflow-illustration {
	margin: 0 0 24px;
	overflow: hidden;
	border: 1px solid rgba(223, 229, 236, 0.86);
	border-radius: 8px;
	background: #fff9f0;
}

.workflow-illustration img {
	display: block;
	width: 100%;
	aspect-ratio: 3 / 2;
	object-fit: cover;
	object-position: center;
}

.workflow-diagram {
	position: relative;
	height: 132px;
	margin: 2px 0 22px;
	overflow: hidden;
	border: 1px solid rgba(223, 229, 236, 0.86);
	border-radius: 8px;
	background: radial-gradient(circle at 82% 20%, rgba(243, 152, 0, 0.14), transparent 26%), linear-gradient(135deg, #f8fbff, #fff);
}

.workflow-diagram i {
	position: absolute;
	display: block;
}

.diagram-chaos {
	background: radial-gradient(circle at 18% 80%, rgba(47, 152, 127, 0.1), transparent 24%), linear-gradient(135deg, #fbfdff, #fff8ee);
}

.diagram-chaos .node {
	width: 16px;
	height: 16px;
	border-radius: 999px;
	background: var(--orange);
	box-shadow: 0 8px 20px rgba(243, 152, 0, 0.18);
}

.diagram-chaos .n1 {
	top: 24px;
	left: 28px;
}

.diagram-chaos .n2 {
	top: 70px;
	left: 68px;
	background: var(--green);
}

.diagram-chaos .n3 {
	top: 34px;
	right: 54px;
	background: var(--blue);
}

.diagram-chaos .n4 {
	right: 24px;
	bottom: 30px;
}

.diagram-chaos .line {
	height: 2px;
	border-radius: 999px;
	background: repeating-linear-gradient(90deg, rgba(25, 58, 92, 0.34) 0 6px, transparent 6px 12px);
	transform-origin: left center;
}

.diagram-chaos .l1 {
	top: 40px;
	left: 42px;
	width: 150px;
	transform: rotate(18deg);
}

.diagram-chaos .l2 {
	top: 88px;
	left: 80px;
	width: 130px;
	transform: rotate(-24deg);
}

.diagram-chaos .l3 {
	top: 66px;
	left: 36px;
	width: 190px;
	transform: rotate(42deg);
	opacity: 0.55;
}

.diagram-chaos .paper {
	width: 48px;
	height: 34px;
	border: 1px solid rgba(25, 58, 92, 0.12);
	border-radius: 6px;
	background: linear-gradient(90deg, rgba(243, 152, 0, 0.55) 0 30%, transparent 30%), repeating-linear-gradient(0deg, rgba(25, 58, 92, 0.14) 0 3px, transparent 3px 9px), rgba(255, 255, 255, 0.86);
	box-shadow: 0 10px 24px rgba(28, 43, 61, 0.08);
}

.diagram-chaos .p1 {
	top: 18px;
	left: 88px;
	transform: rotate(-8deg);
}

.diagram-chaos .p2 {
	right: 84px;
	bottom: 22px;
	transform: rotate(10deg);
}

.diagram-chaos .p3 {
	right: 18px;
	top: 52px;
	transform: rotate(-14deg);
}

.diagram-tool {
	background: radial-gradient(circle at 80% 74%, rgba(47, 152, 127, 0.13), transparent 28%), linear-gradient(135deg, #f8fbff, #eff8f5);
}

.diagram-tool .screen {
	top: 26px;
	left: 28px;
	width: 132px;
	height: 78px;
	border: 8px solid var(--navy);
	border-radius: 8px;
	background: linear-gradient(90deg, rgba(243, 152, 0, 0.78) 0 22%, transparent 22%), repeating-linear-gradient(90deg, rgba(36, 120, 216, 0.2) 0 9px, transparent 9px 19px), #fff;
	box-shadow: 0 18px 34px rgba(28, 43, 61, 0.13);
}

.diagram-tool .phone {
	top: 28px;
	right: 44px;
	width: 42px;
	height: 80px;
	border: 6px solid #111b27;
	border-radius: 12px;
	background: linear-gradient(180deg, rgba(47, 152, 127, 0.18), transparent), #fff;
	box-shadow: 0 16px 28px rgba(28, 43, 61, 0.12);
}

.diagram-tool .check {
	width: 18px;
	height: 18px;
	border-radius: 999px;
	background: var(--green);
}

.diagram-tool .check::after {
	content: '';
	position: absolute;
	top: 4px;
	left: 5px;
	width: 7px;
	height: 4px;
	border-bottom: 2px solid #fff;
	border-left: 2px solid #fff;
	transform: rotate(-45deg);
}

.diagram-tool .c1 {
	top: 44px;
	left: 66px;
}

.diagram-tool .c2 {
	right: 56px;
	bottom: 34px;
}

.diagram-tool .connector {
	top: 62px;
	left: 160px;
	width: 74px;
	height: 2px;
	background: repeating-linear-gradient(90deg, rgba(36, 120, 216, 0.42) 0 6px, transparent 6px 12px);
}

.diagram-tool .gear {
	right: 104px;
	top: 22px;
	width: 28px;
	height: 28px;
	border: 6px solid rgba(243, 152, 0, 0.76);
	border-radius: 999px;
	box-shadow:
		0 -14px 0 -10px var(--orange),
		0 14px 0 -10px var(--orange),
		14px 0 0 -10px var(--orange),
		-14px 0 0 -10px var(--orange);
}

.diagram-town {
	background: linear-gradient(180deg, rgba(233, 247, 240, 0.72) 0 62%, rgba(255, 249, 240, 0.86) 62%), #fff;
}

.diagram-town .road {
	right: -20px;
	bottom: -18px;
	left: 18px;
	height: 54px;
	border-radius: 999px 0 0 0;
	background: repeating-linear-gradient(90deg, rgba(255, 255, 255, 0.9) 0 18px, transparent 18px 42px), linear-gradient(135deg, #bfd4e8, #8fb0cb);
	transform: skewX(-18deg);
}

.diagram-town .building {
	bottom: 50px;
	width: 34px;
	border-radius: 5px 5px 0 0;
	background: repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.78) 0 5px, transparent 5px 13px), var(--navy);
}

.diagram-town .b1 {
	left: 34px;
	height: 48px;
}

.diagram-town .b2 {
	left: 78px;
	height: 68px;
	background: repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.8) 0 5px, transparent 5px 13px), var(--blue);
}

.diagram-town .b3 {
	left: 126px;
	height: 42px;
	background: repeating-linear-gradient(0deg, rgba(255, 255, 255, 0.8) 0 5px, transparent 5px 13px), var(--green);
}

.diagram-town .tree {
	bottom: 46px;
	width: 22px;
	height: 32px;
	border-radius: 999px 999px 4px 4px;
	background: var(--green);
}

.diagram-town .t1 {
	left: 180px;
}

.diagram-town .t2 {
	right: 36px;
	background: #74b89f;
}

.diagram-town .bus {
	right: 78px;
	bottom: 32px;
	width: 72px;
	height: 34px;
	border-radius: 8px 8px 5px 5px;
	background: linear-gradient(90deg, #fff 0 58%, rgba(255, 255, 255, 0.62) 58%), var(--blue);
	box-shadow:
		12px 26px 0 -10px #111b27,
		52px 26px 0 -10px #111b27;
}

.diagram-town .sun {
	top: 22px;
	right: 70px;
	width: 24px;
	height: 24px;
	border-radius: 999px;
	background: var(--orange);
	box-shadow: 0 0 0 10px rgba(243, 152, 0, 0.12);
}

.workflow-card:nth-child(3)::after {
	display: none;
}

.workflow-card span {
	display: inline-flex;
	margin-bottom: 18px;
	border-radius: 999px;
	padding: 4px 10px;
	background: var(--orange-soft);
	color: var(--orange-dark);
	font-size: 36px;
	font-weight: 900;
}

.workflow-card strong {
	display: block;
	margin-bottom: 10px;
	color: var(--ink);
	font-size: 22px;
	line-height: 1.4;
}

.workflow-card p {
	margin: 0;
	color: var(--muted);
	font-size: 15px;
}

.section-head {
	max-width: 680px;
	margin-bottom: 46px;
}

.section-head.split {
	display: grid;
	grid-template-columns: minmax(0, 1fr) auto;
	gap: 32px;
	align-items: end;
	max-width: none;
}

.section-head p {
	color: var(--muted);
}

.products,
.services,
.news {
	background: var(--paper);
}

.products {
	padding-top: 128px;
	padding-bottom: 136px;
}

.product-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 32px;
}

.product-card {
	overflow: hidden;
	background: #fff;
}

.product-visual {
	position: relative;
	min-height: 210px;
	overflow: hidden;
	padding: 24px;
	background: linear-gradient(180deg, rgba(25, 58, 92, 0.04), rgba(25, 58, 92, 0.1)), linear-gradient(135deg, #e8f1ff, #f8fbff);
}

.product-visual.market {
	background: linear-gradient(135deg, var(--orange-soft), #f3f8ec);
}

.product-visual img {
	display: block;
	width: 100%;
	/* height: 270px; */
	border: 1px solid rgba(223, 229, 236, 0.88);
	border-radius: 8px;
	object-fit: cover;
	object-position: top center;
	box-shadow: 0 18px 46px rgba(28, 43, 61, 0.14);
}

.product-badge,
.product-stat {
	position: absolute;
	border: 1px solid rgba(223, 229, 236, 0.9);
	border-radius: 8px;
	background: rgba(255, 255, 255, 0.9);
	box-shadow: 0 14px 34px rgba(28, 43, 61, 0.11);
	backdrop-filter: blur(12px);
}

.product-badge {
	top: 18px;
	left: 18px;
	padding: 7px 11px;
	color: var(--navy);
	font-size: 12px;
	font-weight: 900;
}

.product-stat {
	right: 18px;
	bottom: 18px;
	padding: 12px 14px;
}

.product-stat span,
.product-stat strong {
	display: block;
}

.product-stat span {
	color: var(--muted);
	font-size: 11px;
	font-weight: 900;
}

.product-stat strong {
	color: var(--ink);
	font-size: 14px;
	line-height: 1.5;
}

.product-body {
	padding: 36px;
}

.pill {
	display: inline-flex;
	margin-bottom: 14px;
	border-radius: 999px;
	padding: 5px 12px;
	background: #e8f1ff;
	color: #1e62b6;
	font-size: 12px;
	font-weight: 900;
}

.pill.warm {
	background: var(--orange-soft);
	color: var(--orange-dark);
}

.product-body p,
.product-body li,
.service-grid p {
	color: var(--muted);
}

.product-body ul {
	margin: 18px 0 0;
	padding-left: 1.15em;
}

.proof {
	background: linear-gradient(180deg, #eef8f4 0%, #f7faf9 100%);
}

.text-link {
	display: inline-flex;
	margin-top: 10px;
	color: var(--navy);
	font-weight: 900;
	text-decoration: none;
}

.case-list {
	display: grid;
	gap: 16px;
}

.case-list article {
	position: relative;
	overflow: hidden;
	padding: 26px 28px;
	box-shadow: none;
}

.case-list article::before {
	content: '';
	position: absolute;
	inset: 0 auto 0 0;
	width: 4px;
	background: var(--orange);
}

.service-grid span {
	display: block;
	margin-bottom: 8px;
	color: var(--green);
	font-size: 12px;
	font-weight: 900;
}

.case-list span {
	display: block;
	margin-bottom: 12px;
	color: var(--ink);
	font-size: 22px;
	font-weight: 900;
	line-height: 1.4;
}

.case-list p {
	margin: 0;
	color: var(--muted);
	font-size: 15px;
	line-height: 1.7;
}

.service-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 24px;
}

.service-grid article {
	position: relative;
	min-height: 250px;
	padding: 28px;
	box-shadow: none;
}

.service-grid h3 {
	font-size: 19px;
}

.service-grid small {
	position: absolute;
	right: 22px;
	bottom: 20px;
	left: 22px;
	border-top: 1px solid var(--line);
	padding-top: 14px;
	color: var(--navy);
	font-size: 12px;
	font-weight: 900;
	line-height: 1.45;
}

.company {
	background: #fbfdfc;
}

.company-grid p {
	color: var(--muted);
}

.company-panel {
	border: 1px solid rgba(223, 229, 236, 0.92);
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 20px 54px rgba(28, 43, 61, 0.08);
}

.company dl,
.company-panel dl {
	margin: 0;
	padding: 8px 28px;
	box-shadow: none;
}

.company dl div,
.company-panel dl div {
	display: grid;
	grid-template-columns: 110px 1fr;
	gap: 18px;
	border-bottom: 1px solid var(--line);
	padding: 20px 0;
}

.company dl div:last-child,
.company-panel dl div:last-child {
	border-bottom: 0;
}

.company-panel dl div.company-biz {
	grid-template-columns: 1fr;
	gap: 10px;
}

.company-panel dl div.company-biz dd {
	line-height: 1.95;
}

.company dt,
.company-panel dt {
	color: var(--muted);
	font-weight: 900;
}

.company dd,
.company-panel dd {
	margin: 0;
}

.company-tags {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 1px;
	overflow: hidden;
	border-top: 1px solid var(--line);
	border-radius: 0 0 8px 8px;
	background: var(--line);
}

.company-tags span {
	padding: 14px;
	background: #f8fbff;
	color: var(--navy);
	font-size: 13px;
	font-weight: 900;
	text-align: center;
}

/* company policy (2026 自己完結) */
.policy-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 24px;
}

.policy-item {
	border: 1px solid rgba(223, 229, 236, 0.92);
	border-radius: 8px;
	background: rgba(255, 255, 255, 0.92);
	box-shadow: 0 18px 48px rgba(28, 43, 61, 0.07);
	padding: 32px 26px;
	text-align: center;
}

.policy-icon {
	display: grid;
	place-items: center;
	width: 76px;
	height: 76px;
	margin: 0 auto 20px;
	border-radius: 999px;
	background: radial-gradient(circle at 50% 32%, rgba(243, 152, 0, 0.18), transparent 70%), #f3f9f6;
}

.policy-icon img {
	width: 40px;
	height: 40px;
	object-fit: contain;
}

.policy-title {
	margin: 0 0 10px;
	color: var(--green);
	font-size: 16px;
}

.policy-desc {
	margin: 0;
	color: var(--muted);
	font-size: 14px;
	line-height: 1.7;
}

.news-list {
	display: grid;
	box-shadow: none;
}

.news-list a {
	display: grid;
	grid-template-columns: 120px 1fr;
	gap: 18px;
	border-bottom: 1px solid var(--line);
	padding: 20px 24px;
	text-decoration: none;
}

.news-list a:last-child {
	border-bottom: 0;
}

.news-list time {
	color: var(--muted);
	font-weight: 900;
}

.contact {
	padding: 112px 0;
	background: var(--ink);
	color: #fff;
}

.contact .eyebrow {
	color: #9ee1c7;
}

.contact p {
	color: #d6dde6;
}

.contact-notes {
	display: flex;
	flex-wrap: wrap;
	gap: 10px;
	margin: 26px 0 0;
	padding: 0;
	list-style: none;
}

.contact-notes li {
	border: 1px solid rgba(255, 255, 255, 0.15);
	border-radius: 999px;
	padding: 8px 12px;
	color: #eef4f6;
	font-size: 13px;
	font-weight: 800;
}

.contact-grid {
	align-items: center;
}

.contact-button {
	justify-self: end;
	min-width: 220px;
	background: var(--orange);
}

.site-footer {
	padding: 72px 0 28px;
	background: #101926;
	color: #fff;
}

.footer-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.4fr) minmax(140px, 0.7fr) minmax(160px, 0.7fr) minmax(240px, 1fr);
	gap: 48px;
	align-items: start;
}

.footer-logo {
	display: inline-flex;
	gap: 12px;
	align-items: center;
	text-decoration: none;
}

.footer-logo img:first-child {
	width: 46px;
	height: 46px;
	object-fit: contain;
}

.footer-logo img:last-child {
	width: 184px;
	height: auto;
	filter: brightness(0) invert(1);
}

.footer-brand p,
.footer-contact p {
	max-width: 340px;
	color: #c9d3df;
}

.footer-nav,
.footer-services,
.footer-contact {
	display: grid;
	gap: 10px;
}

.footer-nav a,
.footer-services a {
	color: #eaf1f7;
	text-decoration: none;
}

.footer-services span,
.footer-contact span {
	color: #9ee1c7;
	font-size: 12px;
	font-weight: 900;
	text-transform: uppercase;
}

.footer-contact .button {
	justify-self: start;
	margin-top: 8px;
}

.footer-bottom {
	display: flex;
	justify-content: space-between;
	gap: 18px;
	margin-top: 56px;
	border-top: 1px solid rgba(255, 255, 255, 0.12);
	padding-top: 22px;
	color: #9faabc;
	font-size: 12px;
}

.service-hero {
	position: relative;
	overflow: hidden;
	padding: 168px 0 108px;
	background: linear-gradient(100deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.92) 56%, rgba(255, 242, 221, 0.72) 100%), linear-gradient(135deg, #ffffff 0%, #e8f1ff 50%, var(--orange-soft) 100%);
}

.showlot-hero {
	background: linear-gradient(100deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.92) 56%, rgba(233, 247, 240, 0.78) 100%), linear-gradient(135deg, #ffffff 0%, var(--orange-soft) 48%, #e9f7f0 100%);
}

.service-hero::after {
	content: '';
	position: absolute;
	inset: auto 0 0;
	height: 130px;
	background: linear-gradient(0deg, #fff, rgba(255, 255, 255, 0));
}

.service-hero-grid {
	display: grid;
	grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
	gap: 70px;
	align-items: center;
}

.service-hero-copy {
	position: relative;
	z-index: 2;
}

.service-hero-visual {
	position: relative;
	z-index: 2;
	min-height: 470px;
}

.service-hero-visual img {
	display: block;
	width: 100%;
	height: 430px;
	border: 1px solid rgba(223, 229, 236, 0.9);
	border-radius: 8px;
	object-fit: cover;
	object-position: top center;
	box-shadow: 0 28px 80px rgba(28, 43, 61, 0.16);
}

.showlot-visual img {
	background: #fff;
	object-position: center top;
}

.seat-floating-card {
	position: absolute;
	border: 1px solid rgba(223, 229, 236, 0.95);
	border-radius: 8px;
	padding: 14px 16px;
	background: rgba(255, 255, 255, 0.9);
	box-shadow: 0 18px 46px rgba(28, 43, 61, 0.12);
	backdrop-filter: blur(14px);
}

.seat-floating-card.primary {
	right: 22px;
	bottom: 16px;
}

.seat-floating-card.secondary {
	left: 22px;
	bottom: 84px;
}

.seat-floating-card span,
.seat-floating-card strong {
	display: block;
}

.seat-floating-card span {
	color: var(--muted);
	font-size: 12px;
	font-weight: 900;
}

.seat-floating-card strong {
	color: var(--ink);
	font-size: 16px;
	line-height: 1.45;
}

.showlot-hero .seat-floating-card.primary,
.showlot-flow article::after {
	background: rgba(255, 255, 255, 0.92);
}

.split-head {
	display: grid;
	grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
	gap: 64px;
	align-items: start;
	margin-bottom: 42px;
}

.split-head > p {
	margin: 0;
	color: var(--muted);
}

.page-problems,
.page-scenes,
.page-flow {
	background: #fff;
}

.page-features {
	background: #f7faf9;
}

.page-works {
	background: linear-gradient(180deg, #eef8f4 0%, #f7faf9 100%);
}

.page-concept {
	background: #fff;
}

.illustration-band,
.illustration-strip {
	margin-top: 28px;
	margin-bottom: 34px;
}

.section-head + .illustration-band {
	margin-top: 0;
}

.illustration-band img,
.illustration-strip img {
	display: block;
	width: 100%;
	border: 1px solid rgba(223, 229, 236, 0.78);
	border-radius: 8px;
	background: #fff;
	object-fit: cover;
	object-position: center;
	box-shadow: 0 18px 48px rgba(28, 43, 61, 0.06);
}

.illustration-band img {
	height: clamp(260px, 28vw, 390px);
}

.illustration-strip img {
	height: clamp(180px, 18vw, 260px);
}

.problem-grid,
.feature-grid,
.scene-grid,
.seat-works-list,
.flow-list {
	display: grid;
	gap: 18px;
}

.problem-grid {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.feature-grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.scene-grid {
	grid-template-columns: repeat(7, minmax(132px, 1fr));
}

.showlot-scenes {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.seat-works-list {
	grid-template-columns: repeat(2, minmax(0, 1fr));
}

.flow-list {
	grid-template-columns: repeat(4, minmax(0, 1fr));
}

.problem-grid article,
.feature-grid article,
.scene-grid article,
.seat-works-list article,
.flow-list article {
	border: 1px solid rgba(223, 229, 236, 0.92);
	border-radius: 8px;
	background: rgba(255, 255, 255, 0.92);
	box-shadow: 0 18px 48px rgba(28, 43, 61, 0.07);
}

.problem-grid article,
.feature-grid article,
.flow-list article {
	padding: 28px;
}

.problem-grid span,
.feature-grid span,
.flow-list span,
.seat-works-list span {
	display: inline-flex;
	margin-bottom: 14px;
	color: var(--green);
	font-size: 12px;
	font-weight: 900;
}

.problem-grid h3,
.feature-grid h3,
.flow-list h3,
.seat-works-list h3,
.scene-grid strong {
	margin-bottom: 10px;
	color: var(--ink);
	font-size: 19px;
	line-height: 1.45;
}

.problem-grid p,
.feature-grid p,
.flow-list p,
.seat-works-list p,
.scene-grid span {
	margin: 0;
	color: var(--muted);
	font-size: 14px;
}

.feature-grid article {
	min-height: 230px;
}

.feature-grid span {
	border-radius: 999px;
	padding: 4px 10px;
	background: #e8f1ff;
	color: var(--navy);
}

.scene-grid article {
	min-height: 170px;
	padding: 22px;
}

.scene-grid strong,
.scene-grid span {
	display: block;
}

.seat-works-list article {
	position: relative;
	overflow: hidden;
	padding: 26px 28px 26px 32px;
}

.seat-works-list article::before {
	content: '';
	position: absolute;
	inset: 0 auto 0 0;
	width: 4px;
	background: var(--orange);
}

.flow-list article {
	position: relative;
}

.flow-list article::after {
	content: '';
	position: absolute;
	top: 40px;
	right: -10px;
	width: 20px;
	height: 2px;
	background: linear-gradient(90deg, var(--line), var(--orange));
}

.flow-list article:last-child::after {
	display: none;
}

.concept-grid {
	display: grid;
	grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
	gap: 64px;
	align-items: center;
}

.concept-grid p {
	color: var(--muted);
}

.concept-card {
	border: 1px solid rgba(223, 229, 236, 0.92);
	border-radius: 8px;
	padding: 34px;
	background: linear-gradient(135deg, rgba(255, 242, 221, 0.72), rgba(233, 247, 240, 0.88)), #fff;
	box-shadow: 0 22px 58px rgba(28, 43, 61, 0.08);
}

.concept-card span {
	display: inline-flex;
	margin-bottom: 12px;
	color: var(--green);
	font-size: 12px;
	font-weight: 900;
}

.concept-card p {
	margin-bottom: 0;
}

.works-hero {
	padding: 168px 0 112px;
	background: linear-gradient(100deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.9) 58%, rgba(233, 247, 240, 0.72) 100%), linear-gradient(135deg, #fff, #e8f1ff 54%, var(--orange-soft));
}

.works-hero-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
	gap: 72px;
	align-items: center;
}

.works-summary {
	display: grid;
	gap: 14px;
}

.works-summary div {
	border: 1px solid rgba(223, 229, 236, 0.92);
	border-radius: 8px;
	padding: 22px 24px;
	background: rgba(255, 255, 255, 0.86);
	box-shadow: 0 18px 48px rgba(28, 43, 61, 0.08);
}

.works-summary span,
.works-summary strong {
	display: block;
}

.works-summary span {
	margin-bottom: 5px;
	color: var(--green);
	font-size: 12px;
	font-weight: 900;
}

.works-summary strong {
	color: var(--ink);
	line-height: 1.55;
}

.works-seat {
	background: #fff;
}

.works-seat-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 18px;
}

.works-seat-grid article {
	min-height: 220px;
	border: 1px solid rgba(223, 229, 236, 0.92);
	border-radius: 8px;
	overflow: hidden;
	padding: 0;
	background: linear-gradient(180deg, rgba(255, 242, 221, 0.34), rgba(255, 255, 255, 0.88)), #fff;
	box-shadow: 0 18px 48px rgba(28, 43, 61, 0.07);
}

.seat-work-visual {
	position: relative;
	min-height: 150px;
	overflow: hidden;
	background: radial-gradient(circle at 72% 28%, rgba(243, 152, 0, 0.2), transparent 24%), radial-gradient(circle at 24% 78%, rgba(47, 152, 127, 0.18), transparent 28%), linear-gradient(135deg, #e8f1ff, #fff9f0);
}

.seat-work-illust {
	position: absolute;
	inset: 0;
	display: block;
	width: 100%;
	height: 100%;
}

.seat-work-visual strong {
	position: absolute;
	z-index: 2;
	top: 14px;
	left: 14px;
	border-radius: 999px;
	padding: 6px 12px;
	background: rgba(255, 255, 255, 0.9);
	color: var(--navy);
	font-size: 12px;
	font-weight: 900;
	line-height: 1;
	box-shadow: 0 8px 20px rgba(28, 43, 61, 0.1);
}

.visual-musical,
.visual-concert {
	background: radial-gradient(circle at 72% 28%, rgba(36, 120, 216, 0.2), transparent 24%), radial-gradient(circle at 24% 78%, rgba(243, 152, 0, 0.18), transparent 28%), linear-gradient(135deg, #edf8ff, #fff9f0);
}

.visual-award {
	background: radial-gradient(circle at 72% 28%, rgba(243, 152, 0, 0.22), transparent 26%), radial-gradient(circle at 22% 80%, rgba(25, 58, 92, 0.14), transparent 28%), linear-gradient(135deg, #fff7ec, #fffdf8);
}

.visual-fashion {
	background: radial-gradient(circle at 72% 24%, rgba(47, 152, 127, 0.2), transparent 26%), radial-gradient(circle at 24% 82%, rgba(243, 152, 0, 0.16), transparent 28%), linear-gradient(135deg, #f1faf6, #fff9f0);
}

.visual-fireworks {
	background: radial-gradient(circle at 72% 28%, rgba(243, 152, 0, 0.26), transparent 24%), radial-gradient(circle at 24% 78%, rgba(36, 120, 216, 0.18), transparent 28%), linear-gradient(135deg, #f7fbff, #fff2dd);
}

.visual-cinema {
	background: radial-gradient(circle at 72% 28%, rgba(25, 58, 92, 0.18), transparent 24%), radial-gradient(circle at 24% 78%, rgba(47, 152, 127, 0.18), transparent 28%), linear-gradient(135deg, #f5faf8, #fff);
}

.works-seat-grid article > span,
.works-seat-grid article > h3,
.works-seat-grid article > p {
	margin-right: 24px;
	margin-left: 24px;
}

.works-seat-grid article > h3 {
	margin-top: 24px;
}

.works-seat-grid article > p {
	margin-bottom: 26px;
}

.works-seat-grid span,
.dx-project-list span,
.policy-cards span {
	display: inline-flex;
	margin-bottom: 12px;
	color: var(--green);
	font-size: 14px;
	font-weight: 900;
}

.works-seat-grid h3,
.dx-project-list h3 {
	font-size: 20px;
	line-height: 1.45;
}

.works-seat-grid p,
.dx-project-list p,
.works-policy p {
	color: var(--muted);
}

.works-dx {
	background: linear-gradient(180deg, #eef8f4 0%, #f7faf9 100%);
}

.dx-project-list {
	display: grid;
	grid-template-columns: repeat(3, minmax(0, 1fr));
	gap: 18px;
}

.dx-project-list article {
	border: 1px solid rgba(223, 229, 236, 0.92);
	border-radius: 8px;
	overflow: hidden;
	padding: 0;
	background: rgba(255, 255, 255, 0.92);
	box-shadow: 0 18px 48px rgba(28, 43, 61, 0.07);
}

.dx-project-list article.featured {
	grid-column: span 2;
	display: grid;
	grid-template-columns: minmax(0, 0.8fr) minmax(0, 1.2fr);
	gap: 26px;
	align-items: center;
	padding: 26px;
}

.project-image {
	overflow: hidden;
	border: 1px solid rgba(223, 229, 236, 0.92);
	border-radius: 8px;
	background: #fff;
}

.project-image img {
	display: block;
	width: 100%;
	height: 260px;
	object-fit: cover;
	object-position: top center;
}

.project-visual {
	position: relative;
	display: grid;
	min-height: 170px;
	place-items: center;
	overflow: hidden;
	background: radial-gradient(circle at 72% 24%, rgba(243, 152, 0, 0.18), transparent 24%), radial-gradient(circle at 22% 82%, rgba(47, 152, 127, 0.18), transparent 28%), linear-gradient(135deg, #fff, #e9f7f0);
}

.project-visual::after {
	content: '';
	position: absolute;
	inset: auto 0 0 0;
	height: 22px;
	background: linear-gradient(to top, rgba(28, 43, 61, 0.16), transparent);
	pointer-events: none;
}

.project-visual img {
	display: block;
	width: 100%;
	height: 220px;
	object-fit: cover;
	object-position: top center;
	filter: brightness(0.92);
}

.project-visual strong {
	border-radius: 999px;
	padding: 8px 14px;
	background: rgba(255, 255, 255, 0.88);
	color: var(--navy);
	font-size: 13px;
	line-height: 1;
	box-shadow: 0 10px 26px rgba(28, 43, 61, 0.08);
}

.visual-transit,
.visual-bus {
	background: linear-gradient(90deg, transparent 0 28%, rgba(255, 255, 255, 0.78) 28% 34%, transparent 34%), radial-gradient(circle at 74% 28%, rgba(36, 120, 216, 0.2), transparent 22%), linear-gradient(135deg, #e8f1ff, #f5faf8);
}

.visual-gourmet {
	background: radial-gradient(circle at 74% 30%, rgba(243, 152, 0, 0.22), transparent 22%), linear-gradient(135deg, #fff9f0, #e9f7f0);
}

.visual-link,
.visual-cleanup {
	background: radial-gradient(circle at 72% 24%, rgba(47, 152, 127, 0.2), transparent 24%), linear-gradient(135deg, #e9f7f0, #fff);
}

.visual-heart {
	background: radial-gradient(circle at 72% 24%, rgba(243, 152, 0, 0.22), transparent 24%), linear-gradient(135deg, #fff2dd, #fff);
}

.visual-paper {
	background: linear-gradient(135deg, rgba(255, 255, 255, 0.82), rgba(255, 255, 255, 0.36)), repeating-linear-gradient(0deg, rgba(25, 58, 92, 0.12) 0 2px, transparent 2px 18px), linear-gradient(135deg, #fff, #e8f1ff);
}

.dx-project-list article:not(.featured) > span,
.dx-project-list article:not(.featured) > h3,
.dx-project-list article:not(.featured) > p,
.dx-project-list article:not(.featured) > a {
	margin-right: 26px;
	margin-left: 26px;
}

.dx-project-list article:not(.featured) > h3 {
	margin-top: 21px;
}

.dx-project-list article:not(.featured) > span {
	/* margin-top: 24px; */
}

.dx-project-list article:not(.featured) > a {
	margin-top: 0;
}

.dx-project-list article:not(.featured) > a:last-child {
	margin-bottom: 24px;
}

.dx-project-list a {
	display: inline-flex;
	margin: 10px 12px 0 0;
	color: var(--navy);
	font-size: 13px;
	font-weight: 900;
	text-decoration: none;
}

.works-policy {
	background: #fff;
}

.policy-cards {
	display: grid;
	gap: 16px;
}

.policy-cards article {
	border: 1px solid rgba(223, 229, 236, 0.92);
	border-radius: 8px;
	padding: 26px;
	background: linear-gradient(135deg, rgba(255, 242, 221, 0.48), rgba(233, 247, 240, 0.72)), #fff;
	box-shadow: 0 18px 48px rgba(28, 43, 61, 0.07);
}

.policy-cards strong {
	display: block;
	font-size: 18px;
	line-height: 1.55;
}

.company-hero {
	padding: 168px 0 112px;
	background: linear-gradient(100deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.9) 58%, rgba(255, 242, 221, 0.72) 100%), linear-gradient(135deg, #fff, #e9f7f0 54%, var(--orange-soft));
}

.company-hero-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
	gap: 72px;
	align-items: center;
}

.company-hero-card {
	display: grid;
	min-height: 360px;
	place-items: center;
	border: 1px solid rgba(223, 229, 236, 0.92);
	border-radius: 8px;
	padding: 38px;
	background: radial-gradient(circle at 72% 24%, rgba(243, 152, 0, 0.18), transparent 28%), radial-gradient(circle at 24% 78%, rgba(47, 152, 127, 0.18), transparent 32%), rgba(255, 255, 255, 0.86);
	box-shadow: 0 24px 70px rgba(28, 43, 61, 0.1);
	text-align: center;
}

.company-logo-lockup {
	display: inline-flex;
	gap: 14px;
	align-items: center;
	border: 1px solid rgba(223, 229, 236, 0.82);
	border-radius: 8px;
	padding: 16px 20px 16px 16px;
	background: rgba(255, 255, 255, 0.84);
	box-shadow: 0 18px 46px rgba(28, 43, 61, 0.08);
}

.company-card-symbol {
	display: block;
	width: 72px;
	height: 72px;
	object-fit: contain;
}

.company-card-logo {
	display: block;
	width: 230px;
	height: auto;
}

.company-hero-card span,
.company-hero-card strong {
	display: block;
}

.company-hero-card span {
	color: var(--green);
	font-size: 12px;
	font-weight: 900;
	text-transform: uppercase;
}

.company-hero-card strong {
	max-width: 340px;
	color: var(--ink);
	font-size: 28px;
	line-height: 1.35;
}

.company-hero-card strong span {
	display: inline-block;
	color: inherit;
	font-size: inherit;
	font-weight: inherit;
	text-transform: none;
}

.company-about,
.company-services {
	background: #fff;
}

.company-profile {
	background: #f7faf9;
}

.company-message {
	background: linear-gradient(135deg, rgba(255, 242, 221, 0.42), rgba(233, 247, 240, 0.62)), #fff;
}

.representative-grid {
	display: grid;
	grid-template-columns: minmax(280px, 0.82fr) minmax(0, 1.18fr);
	gap: 64px;
	align-items: center;
}

.representative-photo {
	position: relative;
	margin: 0;
}

.representative-photo::before {
	content: '';
	position: absolute;
	inset: 22px -18px -22px 22px;
	z-index: -1;
	border-radius: 8px;
	background: var(--orange-soft);
}

.representative-photo img {
	display: block;
	width: 100%;
	aspect-ratio: 4 / 5;
	border: 1px solid rgba(223, 229, 236, 0.92);
	border-radius: 8px;
	object-fit: cover;
	object-position: center top;
	box-shadow: 0 24px 70px rgba(28, 43, 61, 0.12);
}

.representative-copy {
	border: 1px solid rgba(223, 229, 236, 0.92);
	border-radius: 8px;
	padding: 42px;
	background: rgba(255, 255, 255, 0.88);
	box-shadow: 0 22px 58px rgba(28, 43, 61, 0.08);
}

.representative-copy p {
	color: var(--muted);
}

.representative-name {
	display: grid;
	gap: 2px;
	margin-top: 28px;
}

.representative-name span {
	color: var(--green);
	font-size: 13px;
	font-weight: 900;
}

.representative-name strong {
	color: var(--ink);
	font-size: 24px;
	letter-spacing: 0.04em;
}

.company-about p {
	color: var(--muted);
}

.company-value-list {
	display: grid;
	gap: 16px;
}

.company-value-list article {
	border: 1px solid rgba(223, 229, 236, 0.92);
	border-radius: 8px;
	padding: 26px;
	background: rgba(255, 255, 255, 0.92);
	box-shadow: 0 18px 48px rgba(28, 43, 61, 0.07);
}

.company-value-list span {
	display: inline-flex;
	margin-bottom: 10px;
	color: var(--green);
	font-size: 12px;
	font-weight: 900;
}

.name-origin {
	display: grid;
	justify-items: center;
	gap: 24px;
	margin-top: 72px;
	border: 1px solid rgba(223, 229, 236, 0.92);
	border-radius: 8px;
	padding: 56px 42px;
	background: radial-gradient(circle at 86% 18%, rgba(243, 152, 0, 0.16), transparent 26%), radial-gradient(circle at 12% 82%, rgba(47, 152, 127, 0.14), transparent 28%), #fff;
	box-shadow: 0 22px 58px rgba(28, 43, 61, 0.08);
	text-align: center;
}

.name-origin-lockup {
	display: grid;
	justify-items: center;
	gap: 18px;
}

.name-origin-mark {
	width: min(200px, 48vw);
	height: auto;
}

.name-origin-logo {
	width: min(360px, 72%);
	height: auto;
}

.name-origin > div {
	max-width: 680px;
}

.name-origin p:last-child {
	margin-bottom: 0;
	max-width: 720px;
	color: var(--muted);
}

.services-hero {
	padding: 168px 0 112px;
	background: linear-gradient(100deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.9) 58%, rgba(233, 247, 240, 0.72) 100%), linear-gradient(135deg, #fff, #e8f1ff 54%, var(--orange-soft));
}

.services-hero-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
	gap: 72px;
	align-items: center;
}

.services-axis-card {
	display: grid;
	gap: 14px;
}

.services-axis-card div {
	border: 1px solid rgba(223, 229, 236, 0.92);
	border-radius: 8px;
	padding: 24px;
	background: rgba(255, 255, 255, 0.9);
	box-shadow: 0 18px 48px rgba(28, 43, 61, 0.08);
}

.services-axis-card span,
.services-axis-card strong {
	display: block;
}

.services-axis-card span {
	margin-bottom: 6px;
	color: var(--green);
	font-size: 12px;
	font-weight: 900;
}

.services-axis-card strong {
	color: var(--ink);
	font-size: 22px;
	line-height: 1.45;
}

.services-main,
.services-flow {
	background: #fff;
}

.services-support {
	background: #f7faf9;
}

.services-policy {
	background: linear-gradient(180deg, #eef8f4 0%, #f7faf9 100%);
}

.recruit-hero,
.news-hero {
	padding: 168px 0 112px;
	background: linear-gradient(100deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.9) 58%, rgba(255, 242, 221, 0.7) 100%), linear-gradient(135deg, #fff, #e9f7f0 54%, var(--orange-soft));
}

.recruit-hero-grid {
	display: grid;
	grid-template-columns: minmax(0, 1.05fr) minmax(0, 0.95fr);
	gap: 72px;
	align-items: center;
}

.recruit-hero-card {
	display: grid;
	min-height: 340px;
	place-items: center;
	border: 1px solid rgba(223, 229, 236, 0.92);
	border-radius: 8px;
	padding: 40px;
	background: radial-gradient(circle at 78% 22%, rgba(243, 152, 0, 0.18), transparent 28%), radial-gradient(circle at 18% 80%, rgba(47, 152, 127, 0.18), transparent 32%), rgba(255, 255, 255, 0.88);
	box-shadow: 0 24px 70px rgba(28, 43, 61, 0.1);
	text-align: center;
}

.recruit-hero-card img {
	width: 116px;
	height: 116px;
	object-fit: contain;
}

.recruit-hero-card span {
	display: block;
	max-width: 330px;
	color: var(--ink);
	font-size: 24px;
	font-weight: 900;
	line-height: 1.5;
}

.recruit-message,
.recruit-culture,
.news-archive {
	background: #fff;
}

.recruit-roles {
	background: #f7faf9;
}

.news-archive-list {
	display: grid;
	gap: 16px;
}

.news-archive-list a {
	display: grid;
	grid-template-columns: 120px 110px minmax(0, 1fr);
	gap: 18px;
	align-items: start;
	border: 1px solid rgba(223, 229, 236, 0.92);
	border-radius: 8px;
	padding: 26px;
	background: rgba(255, 255, 255, 0.94);
	box-shadow: 0 18px 48px rgba(28, 43, 61, 0.07);
	text-decoration: none;
}

.news-archive-list time {
	color: var(--muted);
	font-weight: 900;
}

.news-archive-list span {
	display: inline-flex;
	justify-content: center;
	border-radius: 999px;
	padding: 5px 10px;
	background: var(--orange-soft);
	color: var(--orange-dark);
	font-size: 12px;
	font-weight: 900;
}

.news-archive-list strong,
.news-archive-list p {
	display: block;
	grid-column: 3;
}

.news-archive-list strong {
	color: var(--ink);
	font-size: 20px;
	line-height: 1.55;
}

.news-archive-list p {
	margin: 4px 0 0;
	color: var(--muted);
}

.service-product-grid {
	display: grid;
	grid-template-columns: repeat(2, minmax(0, 1fr));
	gap: 32px;
}

.service-product-grid article {
	overflow: hidden;
	border: 1px solid rgba(223, 229, 236, 0.92);
	border-radius: 8px;
	background: #fff;
	box-shadow: 0 22px 58px rgba(28, 43, 61, 0.08);
}

.service-product-visual {
	padding: 24px;
	background: linear-gradient(135deg, #e8f1ff, #f8fbff);
}

.service-product-visual.showlot {
	background: linear-gradient(135deg, var(--orange-soft), #e9f7f0);
}

.service-product-visual img {
	display: block;
	width: 100%;
	height: 300px;
	border: 1px solid rgba(223, 229, 236, 0.92);
	border-radius: 8px;
	object-fit: cover;
	object-position: top center;
	box-shadow: 0 18px 46px rgba(28, 43, 61, 0.12);
}

.service-product-body {
	padding: 34px;
}

.service-product-body span {
	display: inline-flex;
	margin-bottom: 12px;
	border-radius: 999px;
	padding: 5px 12px;
	background: var(--orange-soft);
	color: var(--orange-dark);
	font-size: 12px;
	font-weight: 900;
}

.service-product-body p {
	color: var(--muted);
}

.service-product-body .button {
	margin-top: 16px;
}

.support-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 18px;
}

.support-grid article {
	min-height: 250px;
	border: 1px solid rgba(223, 229, 236, 0.92);
	border-radius: 8px;
	padding: 28px;
	background: rgba(255, 255, 255, 0.92);
	box-shadow: 0 18px 48px rgba(28, 43, 61, 0.07);
}

.support-grid span {
	display: inline-flex;
	margin-bottom: 14px;
	color: var(--green);
	font-size: 12px;
	font-weight: 900;
}

.support-grid p,
.services-policy p {
	color: var(--muted);
}

.contact-hero {
	padding: 168px 0 112px;
	background: linear-gradient(100deg, rgba(255, 255, 255, 0.98) 0%, rgba(255, 255, 255, 0.9) 58%, rgba(255, 242, 221, 0.72) 100%), linear-gradient(135deg, #fff, #e9f7f0 54%, var(--orange-soft));
}

.contact-hero-grid,
.contact-form-grid {
	display: grid;
	grid-template-columns: minmax(0, 0.9fr) minmax(0, 1.1fr);
	gap: 72px;
	align-items: start;
}

.contact-direct-card {
	border: 1px solid rgba(223, 229, 236, 0.92);
	border-radius: 8px;
	padding: 34px;
	background: radial-gradient(circle at 78% 24%, rgba(243, 152, 0, 0.16), transparent 28%), rgba(255, 255, 255, 0.9);
	box-shadow: 0 24px 70px rgba(28, 43, 61, 0.1);
}

.contact-direct-card span,
.contact-direct-card strong {
	display: block;
}

.contact-direct-card span {
	margin-bottom: 8px;
	color: var(--green);
	font-size: 12px;
	font-weight: 900;
}

.contact-direct-card strong {
	margin-bottom: 14px;
	color: var(--ink);
	font-size: 30px;
	line-height: 1.35;
}

.contact-direct-card p,
.contact-form-grid p,
.contact-faq p {
	color: var(--muted);
}

.contact-types,
.contact-faq {
	background: #fff;
}

.contact-form-section {
	background: #f7faf9;
}

.contact-type-grid,
.contact-faq-grid {
	display: grid;
	grid-template-columns: repeat(4, minmax(0, 1fr));
	gap: 18px;
}

.contact-faq-grid {
	grid-template-columns: repeat(3, minmax(0, 1fr));
}

.contact-type-grid article,
.contact-faq-grid article {
	border: 1px solid rgba(223, 229, 236, 0.92);
	border-radius: 8px;
	padding: 28px;
	background: rgba(255, 255, 255, 0.94);
	box-shadow: 0 18px 48px rgba(28, 43, 61, 0.07);
}

.contact-type-grid span {
	display: inline-flex;
	margin-bottom: 12px;
	border-radius: 999px;
	padding: 4px 10px;
	background: var(--orange-soft);
	color: var(--orange-dark);
	font-size: 12px;
	font-weight: 900;
}

.contact-form {
	display: grid;
	gap: 18px;
	border: 1px solid rgba(223, 229, 236, 0.92);
	border-radius: 8px;
	padding: 34px;
	background: #fff;
	box-shadow: 0 22px 58px rgba(28, 43, 61, 0.08);
}

.contact-form label,
.contact-form label span {
	display: grid;
	gap: 8px;
}

.contact-form label span {
	color: var(--ink);
	font-size: 13px;
	font-weight: 900;
}

.contact-form input,
.contact-form select,
.contact-form textarea {
	width: 100%;
	border: 1px solid rgba(202, 213, 224, 0.95);
	border-radius: 6px;
	padding: 13px 14px;
	background: #fff;
	color: var(--ink);
	font: inherit;
}

.contact-form textarea {
	resize: vertical;
}

.contact-form button {
	border: 0;
	cursor: pointer;
}

.contact-notes.dark-text li {
	border-color: rgba(25, 58, 92, 0.12);
	color: var(--navy);
}

.service-motion {
	display: grid;
	overflow: hidden;
	place-items: center;
	perspective: 1200px;
}

.motion-orbit {
	position: absolute;
	inset: 48px 22px 80px;
	overflow: visible;
	transform: rotate(-12deg);
}

.motion-orbit .orbit-ring {
	fill: none;
	stroke: rgba(36, 120, 216, 0.22);
	stroke-width: 2;
	stroke-linecap: round;
	stroke-dasharray: 1;
	stroke-dashoffset: 1;
	transform-origin: 260px 190px;
	animation: orbitStrokeClockwise 4.6s ease-in-out infinite;
}

.motion-orbit .secondary {
	stroke: rgba(47, 152, 127, 0.2);
	stroke-width: 1.6;
	animation: orbitStrokeCounter 5.8s ease-in-out infinite;
}

.motion-logo {
	position: absolute;
	top: 50%;
	left: 50%;
	z-index: 5;
	display: grid;
	place-items: center;
	filter: drop-shadow(0 28px 34px rgba(28, 43, 61, 0.16));
	opacity: 0;
	transform: translate(160px, -170px) scale(0.72) rotate(8deg);
	animation: motionLogo 3s cubic-bezier(0.18, 0.9, 0.22, 1) forwards;
	will-change: transform, opacity;
}

.motion-logo img {
	width: 300px;
	height: 300px;
	object-fit: contain;
}

.service-slide {
	position: absolute;
	top: 18px;
	left: 50%;
	display: grid;
	justify-items: center;
	width: 250px;
	opacity: 0;
	transform: translateX(-50%);
	animation: serviceSlide 56s cubic-bezier(0.22, 0.8, 0.24, 1) infinite;
	transform-origin: 50% 50%;
	transform-style: preserve-3d;
	will-change: transform, opacity;
}

.service-slide::after {
	content: '';
	position: absolute;
	top: 0;
	left: 50%;
	z-index: 4;
	width: 226px;
	height: 438px;
	border: 2px solid rgba(243, 152, 0, 0.62);
	border-radius: 28px;
	opacity: 0;
	pointer-events: none;
	transform: translateX(-50%) scale(1);
	animation: phoneRipple 56s ease-out infinite;
	animation-delay: inherit;
	box-shadow: 0 0 0 1px rgba(36, 120, 216, 0.2);
}

.slide-seat {
	animation-delay: 3s;
}

.slide-showlot {
	animation-delay: 10s;
}

.slide-busmo {
	animation-delay: 17s;
}

.slide-sumotsu {
	animation-delay: 24s;
}

.slide-stamp {
	animation-delay: 31s;
}

.slide-sumochii {
	animation-delay: 38s;
}

.slide-awajin {
	animation-delay: 45s;
}

.slide-koredocchi {
	animation-delay: 52s;
}

.motion-phone {
	position: relative;
	width: 206px;
	height: 367px;
	margin-top: 60px;
	overflow: hidden;
	outline: 10px solid #111b27;
	border-radius: 18px;
	background: #111b27;
	box-shadow:
		0 30px 70px rgba(25, 58, 92, 0.24),
		0 10px 24px rgba(25, 58, 92, 0.16);
	transform-style: preserve-3d;
}

.motion-phone img {
	position: relative;
	z-index: 2;
	display: block;
	width: 100%;
	height: 100%;
	object-fit: contain;
	object-position: top center;
	border-radius: 18px;
	backface-visibility: hidden;
}

.motion-phone::before {
	content: '';
	position: absolute;
	inset: 0;
	z-index: 1;
	border-radius: 18px;
	background: linear-gradient(135deg, rgba(255, 255, 255, 0.08), rgba(255, 255, 255, 0)), #111b27;
	backface-visibility: hidden;
	transform: rotateY(180deg);
}

.phone-notch {
	position: absolute;
	top: 8px;
	left: 50%;
	z-index: 2;
	width: 70px;
	height: 16px;
	border-radius: 0 0 12px 12px;
	background: #111b27;
	transform: translateX(-50%);
}

.motion-copy {
	position: absolute;
	right: 0;
	bottom: 28px;
	left: 0;
	z-index: 3;
	display: grid;
	justify-items: center;
	opacity: 0;
	transform: translateX(-110px);
	animation: copySlide 56s ease-in-out infinite;
}

.copy-seat {
	animation-delay: 3s;
}

.copy-showlot {
	animation-delay: 10s;
}

.copy-busmo {
	animation-delay: 17s;
}

.copy-sumotsu {
	animation-delay: 24s;
}

.copy-stamp {
	animation-delay: 31s;
}

.copy-sumochii {
	animation-delay: 38s;
}

.copy-awajin {
	animation-delay: 45s;
}

.copy-koredocchi {
	animation-delay: 52s;
}

.motion-copy h3 {
	min-width: 230px;
	margin: 0;
	border-radius: 8px;
	padding: 10px 16px;
	background: rgba(255, 255, 255, 0.92);
	color: var(--navy);
	font-size: 18px;
	font-weight: 900;
	line-height: 1.3;
	text-align: center;
	box-shadow: 0 18px 42px rgba(28, 43, 61, 0.11);
}

.motion-copy p {
	width: 0;
	max-width: min(390px, 92%);
	margin: 12px 0 0;
	overflow: hidden;
	white-space: nowrap;
	color: var(--muted);
	font-size: 14px;
	font-weight: 500;
	line-height: 1.7;
	text-align: center;
	animation: copyType 56s steps(28, end) infinite;
	animation-delay: inherit;
}

@keyframes orbitStrokeClockwise {
	0% {
		opacity: 0;
		stroke-dashoffset: 1;
		transform: rotate(0deg);
	}
	12% {
		opacity: 1;
	}
	44% {
		opacity: 1;
		stroke-dashoffset: 0;
		transform: rotate(108deg);
	}
	64% {
		opacity: 1;
		stroke-dashoffset: 0;
		transform: rotate(156deg);
	}
	100% {
		opacity: 0;
		stroke-dashoffset: -1;
		transform: rotate(260deg);
	}
}

@keyframes orbitStrokeCounter {
	0% {
		opacity: 0;
		stroke-dashoffset: -1;
		transform: rotate(0deg);
	}
	16% {
		opacity: 1;
	}
	48% {
		opacity: 1;
		stroke-dashoffset: 0;
		transform: rotate(-92deg);
	}
	68% {
		opacity: 1;
		stroke-dashoffset: 0;
		transform: rotate(-138deg);
	}
	100% {
		opacity: 0;
		stroke-dashoffset: 1;
		transform: rotate(-240deg);
	}
}

@keyframes motionLogo {
	0% {
		opacity: 0;
		transform: translate(160px, -170px) scale(0.72) rotate(8deg);
	}
	14% {
		opacity: 1;
		transform: translate(-54%, -46%) scale(1.08) rotate(-2deg);
	}
	21% {
		opacity: 1;
		transform: translate(-50%, -50%) scale(1) rotate(0deg);
	}
	88% {
		opacity: 1;
		transform: translate(-50%, -50%) scale(1) rotate(0deg);
	}
	100% {
		opacity: 1;
		transform: translate(-305px, 29px) scale(0.633) rotate(-8deg);
	}
}

@keyframes phoneRipple {
	0%,
	1.86% {
		opacity: 0;
		transform: translateX(-50%) scale(1);
	}
	1.92% {
		opacity: 0.82;
		transform: translateX(-50%) scale(1);
	}
	3.15% {
		opacity: 0;
		transform: translateX(-50%) scale(1.28);
	}
	100% {
		opacity: 0;
		transform: translateX(-50%) scale(1.28);
	}
}

@keyframes serviceSlide {
	0% {
		opacity: 0;
		transform: translateX(calc(-50% - 310px)) translateY(8px) rotateY(-80deg) scale(0.9);
	}
	0.33% {
		opacity: 1;
	}
	1.92% {
		opacity: 1;
		transform: translateX(-50%) translateY(0) rotateY(0deg) scale(1);
	}
	8.65% {
		opacity: 1;
		transform: translateX(-50%) translateY(0) rotateY(0deg) scale(1);
	}
	9.62% {
		opacity: 0;
		transform: translateX(calc(-50% + 170px)) translateY(0) rotateY(80deg) scale(0.96);
	}
	100% {
		opacity: 0;
		transform: translateX(calc(-50% + 170px)) translateY(0) rotateY(80deg) scale(0.96);
	}
}

@keyframes copySlide {
	0%,
	2.1% {
		opacity: 0;
		transform: translateX(-110px);
	}
	2.88%,
	8.65% {
		opacity: 1;
		transform: translateX(0);
	}
	9.62% {
		opacity: 0;
		transform: translateX(110px);
	}
	100% {
		opacity: 0;
		transform: translateX(110px);
	}
}

@keyframes copyType {
	0%,
	2.2% {
		width: 0;
	}
	2.88%,
	8.65% {
		width: min(390px, 92%);
	}
	100% {
		width: 0;
	}
}

@keyframes heroMarkRipple {
	0% {
		transform: translate(-50%, -50%) scale(0);
		opacity: 0.85;
	}
	100% {
		transform: translate(-50%, -50%) scale(1);
		opacity: 0;
	}
}

@media (max-width: 980px) {
	.site-header {
		grid-template-columns: auto 1fr;
		gap: 10px;
		inset: 0px 0px auto;
		padding: 8px 12px;
		min-height: 56px;
	}

	.brand {
		min-width: 0;
		justify-self: center;
	}

	.brand-logo {
		width: 148px;
	}

	.nav {
		display: none;
	}

	.header-cta {
		display: none;
	}

	.menu-toggle {
		display: inline-flex;
	}

	.hero {
		min-height: auto;
		padding: 92px 0 76px;
	}

	h1 {
		font-size: 46px;
	}

	h2 {
		font-size: 34px;
	}

	.hero-scene {
		position: relative;
		inset: auto;
		width: min(520px, calc(100% - 40px));
		height: 520px;
		margin: 0 auto;
	}

	.hero-content {
		width: min(1120px, calc(100% - 40px));
		margin: 0 auto;
	}

	.venue-panel {
		width: 100%;
	}

	.phone-panel {
		right: auto;
		left: 0;
	}

	.local-panel {
		right: 0;
	}

	.transit-panel {
		left: 24px;
		top: 304px;
	}

	.stamp-panel {
		right: 24px;
		top: 404px;
	}

	.intro-grid,
	.proof-grid,
	.company-grid,
	.news-grid,
	.contact-grid,
	.footer-grid,
	.product-grid,
	.service-hero-grid,
	.split-head,
	.concept-grid,
	.works-hero-grid,
	.company-hero-grid,
	.representative-grid,
	.name-origin,
	.services-hero-grid,
	.recruit-hero-grid,
	.contact-hero-grid,
	.contact-form-grid,
	.company-profile .company-grid {
		grid-template-columns: 1fr;
	}

	.news-archive-list a {
		grid-template-columns: 110px minmax(0, 1fr);
	}

	.news-archive-list span,
	.news-archive-list strong,
	.news-archive-list p {
		grid-column: 2;
	}

	.section-head.split {
		grid-template-columns: 1fr;
		gap: 12px;
	}

	.intro-visual {
		grid-template-columns: 1fr;
	}

	.intro-illustration {
		grid-column: 1 / -1;
		justify-self: center;
		margin-top: 8px;
	}

	.workflow-card::after {
		top: auto;
		right: auto;
		bottom: -18px;
		left: 28px;
		width: 2px;
		height: 18px;
		background: linear-gradient(180deg, var(--line), var(--orange));
	}

	.service-grid,
	.policy-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.problem-grid,
	.feature-grid,
	.seat-works-list,
	.flow-list {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.scene-grid {
		grid-template-columns: repeat(3, minmax(0, 1fr));
	}

	.works-seat-grid,
	.dx-project-list,
	.support-grid,
	.contact-type-grid {
		grid-template-columns: repeat(2, minmax(0, 1fr));
	}

	.contact-faq-grid {
		grid-template-columns: 1fr;
	}

	.dx-project-list article.featured {
		grid-column: span 2;
	}

	.contact-button {
		justify-self: start;
	}

	.footer-grid {
		gap: 34px;
	}

	.service-motion {
		height: 610px;
	}

	.service-slide {
		top: 30px;
	}

	.flow-list article::after {
		display: none;
	}
}

@media (max-width: 640px) {
	.section {
		padding: 88px 0;
	}

	.brand-logo {
		width: 148px;
	}

	.hero h1 {
		font-size: 36px;
		line-height: 1.3;
	}

	h1 {
		font-size: 36px;
	}

	.name-origin {
		padding: 28px;
	}

	.representative-copy {
		padding: 30px;
	}

	.representative-photo::before {
		inset: 16px -10px -16px 16px;
	}

	h2 {
		font-size: 28px;
	}

	.hero-scene {
		width: 100%;
		height: 1220px;
	}

	.phone-panel {
		top: 310px;
		bottom: auto;
	}

	.local-panel {
		top: 805px;
		bottom: auto;
		width: min(280px, 88%);
	}

	.transit-panel,
	.stamp-panel {
		width: min(250px, 82%);
	}

	.transit-panel {
		top: 630px;
		left: 0;
	}

	.stamp-panel {
		top: auto;
		right: 0;
		bottom: 0;
	}

	.service-grid,
	.problem-grid,
	.feature-grid,
	.scene-grid,
	.seat-works-list,
	.flow-list,
	.service-product-grid,
	.support-grid,
	.works-seat-grid,
	.dx-project-list,
	.contact-type-grid,
	.contact-faq-grid,
	.news-archive-list a,
	.news-list a,
	.policy-grid,
	.company dl div {
		grid-template-columns: 1fr;
	}

	.footer-bottom {
		flex-direction: column;
	}

	.news-archive-list span,
	.news-archive-list strong,
	.news-archive-list p {
		grid-column: auto;
		justify-self: start;
	}

	.works-hero {
		padding: 92px 0 82px;
	}

	.company-hero {
		padding: 92px 0 82px;
	}

	.company-hero-card {
		min-height: 300px;
		padding: 28px;
	}

	.company-logo-lockup {
		gap: 10px;
		padding: 14px;
	}

	.company-card-symbol {
		width: 56px;
		height: 56px;
	}

	.company-card-logo {
		width: 180px;
	}

	.services-hero {
		padding: 92px 0 82px;
	}

	.recruit-hero,
	.news-hero {
		padding: 92px 0 82px;
	}

	.contact-hero {
		padding: 92px 0 82px;
	}

	.service-product-visual img {
		height: 240px;
	}

	.dx-project-list article.featured {
		grid-column: auto;
		grid-template-columns: 1fr;
	}

	.project-image img {
		height: 230px;
	}

	.service-hero {
		padding: 92px 0 82px;
	}

	.service-hero-visual {
		min-height: 360px;
	}

	.service-hero-visual img {
		height: 330px;
	}

	.seat-floating-card {
		right: 14px;
		left: 14px;
		width: auto;
	}

	.seat-floating-card.primary {
		bottom: 0;
	}

	.seat-floating-card.secondary {
		bottom: 70px;
	}

	.product-visual {
		padding: 18px;
	}

	.product-visual img {
		/* height: 230px; */
	}

	.contact-direct-card,
	.contact-form {
		padding: 26px;
	}

	.contact-direct-card strong {
		font-size: 24px;
		word-break: break-all;
	}

	.product-stat {
		right: 14px;
		bottom: 14px;
		max-width: calc(100% - 28px);
	}

	.actions {
		align-items: stretch;
		flex-direction: column;
	}

	.button {
		width: 100%;
	}

	.service-motion {
		height: 600px;
	}

	.motion-orbit {
		inset: 42px 0 92px;
	}

	.motion-phone {
		width: 188px;
		height: 335px;
		margin-top: 9px;
		outline-width: 9px;
	}

	.motion-logo {
		filter: drop-shadow(0 22px 28px rgba(28, 43, 61, 0.15));
	}

	.motion-logo img {
		width: 220px;
		height: 220px;
	}

	.hero-mark-wrap {
		transform: translate(-115px, 9px);
	}

	@keyframes motionLogo {
		0% {
			opacity: 0;
			transform: translate(160px, -170px) scale(0.72) rotate(8deg);
		}
		14% {
			opacity: 1;
			transform: translate(-54%, -46%) scale(1.08) rotate(-2deg);
		}
		21% {
			opacity: 1;
			transform: translate(-50%, -50%) scale(1) rotate(0deg);
		}
		88% {
			opacity: 1;
			transform: translate(-50%, -50%) scale(1) rotate(0deg);
		}
		100% {
			opacity: 1;
			transform: translate(-225px, -101px) scale(0.5) rotate(-8deg);
		}
	}

	.service-slide::after {
		width: 206px;
		height: 400px;
		border-radius: 28px;
	}

	.motion-copy {
		margin-bottom: 70px;
	}

	.motion-copy h3 {
		font-size: 16px;
	}

	.motion-copy p {
		max-width: 320px;
		font-size: 13px;
	}
}