@import url(//fonts.googleapis.com/css?family=Lato:400,700);
@import url(//fonts.googleapis.com/earlyaccess/notosansjp.css);
:root {
	color-scheme: light;
	--ink: #10231b;
	--muted: #566a61;
	--green-950: #053c2d;
	--green-900: #07553d;
	--green-700: #087a54;
	--green-600: #0b9364;
	--green-100: #dff3e9;
	--green-050: #f2faf6;
	--line-green: #06c755;
	--yellow: #f5b82e;
	--yellow-soft: #fff4d2;
	--paper: #fff;
	--line: #d7e5de;
	--red: #a83a31;
	--shadow: 0 18px 52px rgba(8, 85, 61, 0.13);
	--radius: 24px;
	--max: 1160px;
}
* {
	box-sizing: border-box;
}
html {
	scroll-behavior: smooth;
	scroll-padding-top: 16px;
}
body {
	margin: 0;
	color: var(--ink);
	background: #fff;
	font-family:
		"Noto Sans JP", "Hiragino Kaku Gothic ProN", "Yu Gothic", Meiryo,
		sans-serif;
	font-size: 16px;
	line-height: 1.7;
}
button,
input,
select,
textarea {
	font: inherit;
}
button,
a {
	-webkit-tap-highlight-color: transparent;
}
img {
	display: block;
	max-width: 100%;
}
a {
	color: inherit;
}
:focus-visible {
	outline: 3px solid rgba(245, 184, 46, 0.9);
	outline-offset: 3px;
}
.shell {
	width: min(calc(100% - 2rem), var(--max));
	margin-inline: auto;
}
.skip-link {
	position: fixed;
	top: 0.7rem;
	left: 0.7rem;
	z-index: 100;
	padding: 0.7rem 1rem;
	border-radius: 999px;
	color: #fff;
	background: var(--ink);
	transform: translateY(-160%);
}
.skip-link:focus {
	transform: translateY(0);
}
/* =========================================================
 ピタットハウス共通パーツ（header / nav.global / footer）
 参照: ress.css v1.2.2 + common.css
 ・このページ側の body / a / img / フォーム要素などの指定を打ち消し、参照の状態に揃える
 ・参照は html{font-size:62.5%}（1rem = 10px）のため、rem は px に換算
 ========================================================= */

/* ---- 背景（common.css: .bg-city）フッター直前の街並み ---- */
.bg-city {
	background: url(../../common/imgs/bg-footer-city.png) left bottom repeat-x;
	padding-bottom: 100px;
}

/* ---- ベース（common.css: html / body 相当） ---- */
.wrapper,
footer {
	font-size: 10px;
	font-family:
		Lato, "Noto Sans JP", "游ゴシック Medium", "游ゴシック体",
		"Yu Gothic Medium", YuGothic, "ヒラギノ角ゴ ProN",
		"Hiragino Kaku Gothic ProN", "メイリオ", Meiryo, "ＭＳ Ｐゴシック",
		"MS PGothic", sans-serif;
	line-height: 1.6;
	color: initial;
	overflow-wrap: break-word;
	word-wrap: break-word;
	-webkit-text-size-adjust: 100%;
}

/* ---- ress.css 相当（対象エリアのみ） ---- */
:where(.wrapper, footer) *,
:where(.wrapper, footer) ::before,
:where(.wrapper, footer) ::after {
	background-repeat: no-repeat;
	margin: 0;
	padding: 0;
}
:where(.wrapper, footer) ::before,
:where(.wrapper, footer) ::after {
	text-decoration: inherit;
	vertical-align: inherit;
}
.wrapper a,
footer a {
	background-color: transparent;
	text-decoration: none;
	color: #39c;
}
.wrapper a:active,
.wrapper a:hover,
footer a:active,
footer a:hover {
	outline-width: 0;
}
.wrapper address,
footer address {
	font-style: normal;
}
.wrapper li,
footer li {
	list-style: none;
}
.wrapper img,
footer img {
	display: inline;
	max-width: none;
	border-style: none;
	vertical-align: bottom;
}
.wrapper small,
footer small {
	font-size: 80%;
}
.wrapper b,
.wrapper strong,
footer b,
footer strong {
	font-weight: bolder;
}
.wrapper button,
.wrapper input,
.wrapper select,
.wrapper textarea,
footer button,
footer input,
footer select,
footer textarea {
	font: inherit;
	background-color: transparent;
	border-style: none;
	color: inherit;
}
.wrapper input,
footer input {
	border-radius: 0;
}
.wrapper button,
.wrapper [type="button"],
.wrapper [type="reset"],
.wrapper [type="submit"],
footer button,
footer [type="button"],
footer [type="reset"],
footer [type="submit"] {
	cursor: pointer;
	-webkit-appearance: button;
}
.wrapper button,
footer button {
	overflow: visible;
	text-transform: none;
}

/* ---- common.css: 共通 ---- */
.wrapper :hover,
.wrapper a:hover,
footer :hover,
footer a:hover {
	transition: all 0.3s;
	-webkit-transition: all 0.3s;
}
.wrapper .container,
footer .container {
	margin: 0 auto;
	width: 980px;
	max-width: 100%;
}

/* ---- ヘッダー ---- */
.wrapper {
	position: relative;
	z-index: 10;
	border-bottom: 1px solid rgba(215, 229, 222, 0.9);
}
.wrapper > header {
	display: block;
	background-color: #fff;
}
.wrapper > header > .container {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 80px;
}
.wrapper > header .logo-area {
	display: flex;
	align-items: center;
	flex-wrap: nowrap;
	width: 600px;
}
.wrapper > header .logo-area > .title {
	margin-left: 6px;
	line-height: 1.3;
}
.wrapper > header .logo-area > .title > p {
	font-size: 10px;
	font-weight: bold;
}
.wrapper > header .logo-area > .title p > span {
	display: block;
	letter-spacing: 1px;
}
.wrapper > header .logo-area > .title p > .description {
	color: #6e6e6e;
	font-size: 10px;
	font-weight: normal;
}
.wrapper > header .logo-area > .title p > .shop-name {
	border-bottom: 1px solid #ccc;
	font-size: 16px;
	padding-bottom: 2px;
	margin-bottom: 4px;
}
.wrapper > header .logo-area > .title p > .company-name {
	color: #6e6e6e;
	font-size: 10px;
	font-weight: normal;
	text-align: left;
}
.wrapper > header address {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	width: 200px;
}
.wrapper > header address > .tel {
	font-size: 24px;
	font-weight: 900;
	letter-spacing: 1px;
	line-height: 1.2;
	margin-bottom: 4px;
	position: relative;
	padding-left: 30px;
	width: 200px;
}
.wrapper > header address > .tel::before {
	color: #6eb92b;
	content: "\f095";
	font: normal normal normal 14px/1 FontAwesome;
	font-size: 26px;
	font-weight: bold;
	text-rendering: auto;
	-moz-osx-font-smoothing: grayscale;
	-webkit-font-smoothing: antialiased;
	position: absolute;
	left: 2px;
	top: 2px;
}
.wrapper > header address > dl.hours {
	display: table;
	table-layout: fixed;
	font-size: 12px;
}
.wrapper > header address > dl.hours dt,
.wrapper > header address > dl.hours dd {
	display: table-cell;
	font-size: 12px;
	text-align: center;
	vertical-align: middle;
}
.wrapper > header address > dl.hours dt {
	background-color: #6eb92b;
	color: #fff;
	font-size: 11px;
	width: 80px;
}
.wrapper > header address > dl.hours dt span,
.wrapper > header address > dl.hours dd span {
	vertical-align: middle;
}
.wrapper > header address > dl.hours dt::before {
	content: "\f017";
	font-size: 14px;
	padding-right: 4px;
}
.wrapper > header address > dl.hours dd {
	background-color: #d7e8c7;
	width: 120px;
}

/* ---- グローバルナビゲーション（SPのみ表示） ---- */
.wrapper > nav.global {
	display: none;
}

/* ---- フッター ---- */
footer {
	display: block;
	background-color: #83b633;
	color: #fff;
}
footer a,
footer a:visited {
	color: #fff;
}
footer .flex {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 240px;
}
footer .company-data {
	width: 500px;
}
footer .company-data address {
	font-size: 14px;
}
footer .company-data dt {
	font-weight: bold;
	margin-bottom: 8px;
	width: 340px;
}
footer .company-data dt > span {
	display: block;
}
footer .company-data dt > .shop-name {
	border-bottom: 1px solid #fff;
	font-size: 24px;
}
footer .company-data dt > .company-name {
	font-size: 16px;
	font-weight: normal;
	padding-top: 2px;
	text-align: left;
}
footer .company-data .number {
	border: 1px solid #fff;
	display: inline-block;
	font-size: 12px;
	padding: 4px 8px;
	margin: 6px 0;
}
footer .company-data .tel,
footer .company-data .fax {
	display: inline;
}
footer .company-data .tel {
	margin: 0 10px;
	pointer-events: none;
}
footer .company-data ul {
	border-top: 1px solid #fff;
	border-bottom: 1px solid #fff;
	display: flex;
}
footer .company-data .site-link {
	font-size: 12px;
	display: flex;
	padding: 10px 0 10px 10px;
	margin-top: 10px;
}
footer .company-data .site-link > li {
	display: flex;
	align-items: center;
	height: 12px;
	margin-right: 20px;
}
footer .company-data .site-link > li:last-child {
	margin-right: 0;
}
footer .company-data .site-link > li::before {
	content: "\f105";
	font-size: 18px;
	padding-right: 6px;
}
footer .external-link {
	line-height: 1.4;
	width: 440px;
}
footer .external-link > dt {
	border-bottom: 1px solid #fff;
	display: block;
	font-weight: bold;
	padding-bottom: 10px;
	margin-bottom: 6px;
	font-size: 16px;
}
footer .external-link > dt::before {
	content: "\f0c1";
	font-weight: normal;
	padding-right: 10px;
}
footer .external-link > dd {
	font-size: 12px;
	line-height: 1.4;
}
footer .external-link > dd::before {
	content: "\f105";
	font-size: 18px;
	padding-right: 6px;
}
footer .external-link > dd::after {
	content: "\f08e";
	padding-left: 6px;
}
footer .external-link > dd > a {
	text-decoration: underline;
}
footer .external-link > dd > a:hover {
	text-decoration: none;
}
footer .bottom {
	background-color: #588f22;
}
footer .bottom .flex {
	display: flex;
	align-items: center;
	justify-content: space-between;
	height: 40px;
}
footer .bottom p small {
	font-size: 10px;
}

/* ---- SP（max-width: 767px） ---- */
@media (max-width: 767px) {
	.bg-city {
		background-size: 200%;
	}
	.wrapper .container,
	footer .container {
		width: 100%;
	}
	.sp-break {
		display: block;
	}

	/* ヘッダー */
	.wrapper {
		height: 50px;
		border-bottom: 0;
		box-shadow:
			0 2px 2px 0 rgba(0, 0, 0, 0.05),
			0 1px 4px 0 rgba(0, 0, 0, 0.08),
			0 3px 1px -2px rgba(0, 0, 0, 0.2);
	}
	.wrapper > header {
		width: 100%;
		position: absolute;
		top: 0;
		left: 0;
	}
	.wrapper > header address {
		display: none;
	}
	.wrapper > header > .container {
		height: 50px;
	}
	.wrapper > header .logo-area > a {
		margin-left: 10px;
		width: 96px;
	}
	.wrapper > header .logo-area > a > img {
		max-width: 100%;
	}
	.wrapper > header .logo-area > .title > p {
		font-weight: normal;
	}
	.wrapper > header .logo-area > .title p > span {
		display: block;
		font-size: 7px;
		font-weight: bold;
	}
	.wrapper > header .logo-area > .title p > .description {
		display: none;
	}
	.wrapper > header .logo-area > .title p > .shop-name {
		font-size: 12px;
		letter-spacing: 0;
		margin-bottom: 2px;
	}
	.wrapper > header .logo-area > .title p > .company-name {
		font-size: 10px;
		letter-spacing: 0;
	}

	/* ナビ */
	.wrapper > nav.global {
		display: block;
		position: absolute;
		top: 0;
		right: 0;
		width: 64px;
		height: 50px;
		background-color: #6eb92b;
		box-shadow: none;
	}
	.wrapper > nav.global > .container {
		display: block;
		width: 64px;
		height: 46px;
	}
	.wrapper > nav.global > .container > li {
		display: flex;
		align-items: center;
		height: 50px;
		border-left: 1px solid #4b9f00;
		border-right: none;
		text-align: center;
	}
	.wrapper > nav.global > .container > li:hover {
		background: #3d8001;
	}
	.wrapper > nav.global li > a,
	.wrapper > nav.global li > a > form {
		display: flex;
		align-items: center;
		justify-content: center;
		height: 50px;
		width: 100%;
	}
	.wrapper > nav.global li > a > form > input[type="image"] {
		display: none;
	}
	.wrapper > nav.global .sp-menu {
		color: #fff;
		display: block;
		font-size: 8px;
		height: 50px;
		padding: 4px 7px;
	}
	.wrapper > nav.global .sp-menu::before {
		content: "\f003";
		display: block;
		font: normal normal normal 14px/1 FontAwesome;
		font-size: 24px;
		text-rendering: auto;
		-webkit-font-smoothing: antialiased;
		-moz-osx-font-smoothing: grayscale;
		margin-bottom: 2px;
	}

	/* フッター */
	footer .flex {
		flex-direction: column;
		height: 340px;
	}
	footer .company-data {
		width: 100%;
	}
	footer .company-data dl {
		font-size: 8px;
		overflow: hidden;
	}
	footer .company-data dt {
		font-size: 10px;
		text-align: center;
		margin: 20px auto 10px;
	}
	footer .company-data dt > .shop-name {
		font-size: 18px;
	}
	footer .company-data dt > .company-name {
		font-size: 14px;
		text-align: center;
		letter-spacing: 2px;
	}
	footer .company-data dd {
		display: block;
		text-align: center;
		margin: 0;
	}
	footer .company-data dd.number {
		display: block;
		font-size: 10px;
		margin: 4px auto 16px;
		width: 60%;
	}
	footer .company-data dd.tel,
	footer .company-data dd.fax {
		border-top: 1px solid #fff;
		border-bottom: 1px solid #fff;
		float: left;
		margin: 0;
		width: 50%;
		height: 46px;
		display: table;
		table-layout: fixed;
	}
	footer .company-data dd.tel span,
	footer .company-data dd.fax span {
		display: table-cell;
		vertical-align: middle;
	}
	footer .company-data dd.tel {
		border-right: 1px solid #fff;
		pointer-events: painted;
	}
	footer .company-data dd.fax {
		pointer-events: none;
	}
	footer .company-data dd.tel:last-child {
		width: 100%;
		border-right: 0;
	}
	footer .company-data ul {
		border-top: none;
	}
	footer .company-data .site-link {
		align-items: center;
		clear: both;
		display: table;
		height: 40px;
		table-layout: fixed;
		margin-top: 0;
		padding: 0;
		width: 100%;
	}
	footer .company-data .site-link > li {
		display: table-cell;
		font-size: 7px;
		text-align: center;
		margin: 0;
		vertical-align: middle;
	}
	footer .company-data .site-link > li > a,
	footer .company-data .site-link > li > form {
		display: initial;
		font-size: 10px;
		vertical-align: middle;
	}
	footer .company-data .site-link li:not(:last-child) {
		border-right: 1px solid #fff;
	}
	footer .external-link {
		padding: 10px;
		width: 100%;
	}
	footer .external-link dt {
		display: none;
	}
	footer .external-link dd {
		display: block;
		font-size: 10px;
		margin-bottom: 10px;
	}
	footer .external-link > dd::before {
		font-size: 10px;
	}
	footer .bottom .flex {
		flex-direction: column;
		height: auto;
		padding: 10px;
	}
	footer .bottom p {
		text-align: center;
	}
	footer .bottom p small {
		font-size: 10px;
	}
}
.button {
	min-height: 48px;
	padding: 0.75rem 1.2rem;
	border: 0;
	border-radius: 999px;
	display: inline-flex;
	align-items: center;
	justify-content: center;
	gap: 0.45rem;
	font-weight: 900;
	text-decoration: none;
	cursor: pointer;
	transition:
		0.18s transform,
		0.18s background,
		0.18s box-shadow;
}
.button:hover {
	transform: translateY(-1px);
}
.button-primary {
	color: #fff;
	background: var(--green-700);
	box-shadow: 0 10px 24px rgba(8, 122, 84, 0.22);
}
.button-primary:hover {
	background: var(--green-900);
}
.button-secondary {
	color: var(--green-950);
	background: var(--yellow);
}
.button-light {
	color: var(--green-900);
	background: #fff;
	border: 1px solid var(--line);
}
.button-ghost {
	color: #fff;
	background: rgba(255, 255, 255, 0.12);
	border: 1px solid rgba(255, 255, 255, 0.28);
}
.button-line {
	color: #fff;
	background: var(--line-green);
	box-shadow: 0 10px 24px rgba(6, 199, 85, 0.22);
}
.button-line:hover {
	background: #05a847;
}
.hero {
	padding: clamp(2.2rem, 5vw, 4.7rem) 0 3.6rem;
	background:
		radial-gradient(
			circle at 88% 8%,
			rgba(245, 184, 46, 0.22),
			transparent 23rem
		),
		linear-gradient(180deg, #f7fcf9, #fff);
}
.hero-grid {
	display: grid;
	grid-template-columns: 1.04fr 0.96fr;
	gap: clamp(2rem, 5vw, 4.5rem);
	align-items: start;
}
.eyebrow {
	margin: 0 0 0.8rem;
	display: inline-flex;
	align-items: center;
	gap: 0.5rem;
	color: var(--green-900);
	font-size: 0.87rem;
	font-weight: 900;
	letter-spacing: 0.06em;
}
.eyebrow:before {
	content: "";
	width: 28px;
	height: 3px;
	border-radius: 3px;
	background: var(--yellow);
}
h1 {
	margin: 0;
	font-size: clamp(2rem, 3.6vw, 2.9rem);
	line-height: 1.12;
	letter-spacing: -0.045em;
}
h1 .nowrap {
	font-size: 0.9em;
	white-space: nowrap;
}
.hero-catch {
	margin: 0.75rem 0 0;
	font-size: clamp(1.28rem, 2.5vw, 1.75rem);
	font-weight: 900;
	color: var(--green-700);
}
.hero-note {
	display: inline-block;
	margin: 0.9rem 0 0;
	padding: 0.45rem 0.75rem;
	border-radius: 10px;
	background: var(--yellow-soft);
	font-weight: 900;
}
.lead {
	margin: 1.15rem 0 0;
	max-width: 42rem;
	color: var(--muted);
	font-size: 1.04rem;
}
.hero-actions {
	margin: 1.5rem 0 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.65rem;
}
.trust-row {
	margin: 1.1rem 0 0;
	display: flex;
	flex-wrap: wrap;
	gap: 0.45rem;
}
.mini-trust {
	padding: 0.32rem 0.58rem;
	border-radius: 999px;
	background: var(--green-100);
	color: var(--green-900);
	font-size: 0.78rem;
	font-weight: 900;
}
.hero-visual {
	display: grid;
	justify-items: center;
	align-content: start;
	gap: 0.65rem;
}
.hero-visual img {
	width: min(100%, 390px);
	height: auto;
	object-fit: contain;
	margin: auto;
	border: 1px solid var(--line);
	border-radius: 24px;
	box-shadow: var(--shadow);
}
.visual-sticker {
	position: static;
	max-width: 360px;
	padding: 0.7rem 1rem;
	border-radius: 999px;
	background: var(--green-900);
	color: #fff;
	text-align: center;
	font-size: 0.82rem;
	font-weight: 900;
	box-shadow: 0 10px 24px rgba(5, 60, 45, 0.18);
}
.quick-nav {
	padding: 1rem 0 0;
}
.quick-list {
	display: grid;
	grid-template-columns: repeat(4, 1fr);
	gap: 0.65rem;
}
.quick-list a {
	padding: 0.8rem;
	border: 1px solid var(--line);
	border-radius: 14px;
	text-align: center;
	text-decoration: none;
	background: #fff;
	color: var(--green-900);
	font-size: 0.86rem;
	font-weight: 900;
}
.quick-list a:hover {
	border-color: var(--green-700);
	background: var(--green-050);
}
section.content-section {
	padding: clamp(3.8rem, 8vw, 6.7rem) 0;
}
.section-soft {
	background: var(--green-050);
}
.section-dark {
	background: var(--green-950);
	color: #fff;
}
.section-head {
	max-width: 790px;
	margin-bottom: 2rem;
}
.section-kicker {
	margin: 0 0 0.45rem;
	color: var(--green-700);
	font-size: 0.83rem;
	font-weight: 900;
	letter-spacing: 0.09em;
}
.section-dark .section-kicker {
	color: #8fe0bc;
}
.section-head h2 {
	margin: 0;
	font-size: clamp(1.8rem, 4vw, 3rem);
	line-height: 1.25;
	letter-spacing: -0.03em;
}
.section-head p {
	margin: 0.8rem 0 0;
	color: var(--muted);
}
.section-dark .section-head p {
	color: #cde5da;
}
.area-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1rem;
}
.area {
	padding: clamp(1.25rem, 3vw, 2rem);
	border: 1px solid var(--line);
	border-radius: 24px;
	background: #fff;
	box-shadow: 0 10px 30px rgba(8, 85, 61, 0.07);
}
.area-top {
	display: flex;
	align-items: center;
	gap: 0.8rem;
}
.area-icon {
	width: 48px;
	height: 48px;
	flex: 0 0 auto;
	display: grid;
	place-items: center;
	border-radius: 15px;
	background: var(--green-100);
	font-size: 1.35rem;
}
.area h3 {
	margin: 0;
	font-size: 1.3rem;
}
.area-sub {
	margin: 0.1rem 0 0;
	color: var(--muted);
	font-size: 0.84rem;
}
.area ul {
	margin: 1rem 0 0;
	padding-left: 1.25rem;
}
.area li + li {
	margin-top: 0.45rem;
}
.fit {
	margin: 1rem 0 0;
	padding: 0.8rem 1rem;
	border-radius: 14px;
	background: var(--yellow-soft);
	font-size: 0.9rem;
	font-weight: 800;
}
.area .button {
	margin-top: 1rem;
	width: 100%;
}
.map-card {
	margin: 1rem 0 0;
	padding: 1rem;
	border: 1px solid var(--line);
	border-radius: 24px;
	background: #fff;
}
.map-card img {
	width: 100%;
	border-radius: 16px;
	background: var(--green-050);
}
.map-card figcaption {
	padding: 0.8rem 0.3rem 0;
	color: var(--muted);
	font-size: 0.84rem;
}
.compare-wrap {
	overflow-x: auto;
	border: 1px solid var(--line);
	border-radius: 22px;
	background: #fff;
	box-shadow: 0 10px 30px rgba(8, 85, 61, 0.06);
}
table {
	width: 100%;
	min-width: 720px;
	border-collapse: collapse;
}
th,
td {
	padding: 1rem;
	border-bottom: 1px solid var(--line);
	vertical-align: top;
	text-align: left;
}
thead th {
	background: var(--green-900);
	color: #fff;
}
thead th:first-child {
	background: var(--green-950);
}
tbody th {
	width: 22%;
	background: var(--green-050);
	color: var(--green-900);
}
tr:last-child th,
tr:last-child td {
	border-bottom: 0;
}
.compare-note {
	margin: 0.8rem 0 0;
	color: var(--muted);
	font-size: 0.82rem;
}
.finder-wrap {
	display: grid;
	grid-template-columns: 0.9fr 1.1fr;
	gap: 1rem;
	align-items: start;
}
.finder-intro {
	padding: clamp(1.3rem, 3vw, 2rem);
	border-radius: 24px;
	background: var(--green-900);
	color: #fff;
}
.finder-intro h3 {
	margin: 0;
	font-size: 1.55rem;
}
.finder-intro p {
	margin: 0.65rem 0 0;
	color: #d3eadf;
}
.finder-steps {
	margin: 1.2rem 0 0;
	padding: 0;
	list-style: none;
	display: grid;
	gap: 0.6rem;
}
.finder-steps li {
	display: flex;
	gap: 0.65rem;
	align-items: center;
	font-weight: 800;
}
.step-num {
	width: 30px;
	height: 30px;
	display: grid;
	place-items: center;
	border-radius: 50%;
	background: var(--yellow);
	color: var(--green-950);
	font-size: 0.8rem;
	font-weight: 900;
}
.finder {
	padding: clamp(1.2rem, 3vw, 2rem);
	border: 1px solid var(--line);
	border-radius: 26px;
	background: #fff;
	box-shadow: var(--shadow);
}
.finder h3 {
	margin: 0;
	font-size: 1.4rem;
}
.field {
	margin: 1.15rem 0 0;
	padding: 0;
	border: 0;
}
.field legend {
	margin-bottom: 0.55rem;
	font-size: 0.91rem;
	font-weight: 900;
}
.choice-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0.55rem;
}
.choice-grid.two {
	grid-template-columns: repeat(2, 1fr);
}
.choice {
	position: relative;
}
.choice input {
	position: absolute;
	opacity: 0;
	pointer-events: none;
}
.choice span {
	min-height: 48px;
	padding: 0.6rem 0.45rem;
	display: grid;
	place-items: center;
	border: 1.5px solid var(--line);
	border-radius: 13px;
	background: #fff;
	text-align: center;
	color: #31463d;
	font-size: 0.84rem;
	font-weight: 850;
	cursor: pointer;
}
.choice input:checked + span {
	border-color: var(--green-700);
	background: var(--green-050);
	color: var(--green-900);
	box-shadow: inset 0 0 0 1px var(--green-700);
}
.choice input:focus-visible + span {
	outline: 3px solid rgba(245, 184, 46, 0.8);
	outline-offset: 2px;
}
.finder-result {
	margin-top: 1rem;
	padding: 1rem;
	border-radius: 17px;
	background: var(--green-950);
	color: #fff;
}
.finder-result small {
	display: block;
	color: #a9dbc5;
	font-weight: 900;
}
.finder-result strong {
	display: block;
	margin: 0.2rem 0 0;
	line-height: 1.5;
}
.memo {
	margin: 0.5rem 0 0;
	color: #d9efe5;
	font-size: 0.85rem;
}
.finder-actions {
	margin-top: 0.75rem;
	display: grid;
	grid-template-columns: 1fr auto;
	gap: 0.55rem;
}
.copy-status {
	min-height: 1.4rem;
	margin: 0.4rem 0 0;
	color: var(--green-700);
	font-size: 0.8rem;
	font-weight: 900;
}
.search-grid {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0.75rem;
}
.search-link {
	min-height: 76px;
	padding: 0.95rem;
	display: flex;
	align-items: center;
	justify-content: space-between;
	gap: 0.7rem;
	border: 1px solid var(--line);
	border-radius: 18px;
	background: #fff;
	color: var(--green-900);
	font-weight: 900;
	text-decoration: none;
	box-shadow: 0 7px 20px rgba(8, 85, 61, 0.05);
}
.search-link:hover {
	border-color: var(--green-700);
	background: var(--green-050);
}
.search-link span:last-child {
	font-size: 1.2rem;
}
.search-note {
	margin: 1rem 0 0;
	color: var(--muted);
	font-size: 0.85rem;
}
.cost-grid {
	max-width: 900px;
	margin-inline: auto;
}
.cost-panel {
	padding: clamp(1.3rem, 3vw, 2.2rem);
	border-radius: 26px;
	background: #fff;
	color: var(--ink);
}
.cost-panel h2 {
	margin: 0;
	font-size: clamp(1.8rem, 4vw, 2.8rem);
	line-height: 1.22;
	color: var(--green-900);
}
.cost-panel > p {
	margin: 0.55rem 0 0;
	color: var(--muted);
}
.cost-list {
	margin: 1.2rem 0 0;
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0.6rem;
}
.cost-item {
	padding: 0.7rem 0.8rem;
	border-radius: 12px;
	background: var(--green-050);
	font-size: 0.88rem;
	font-weight: 900;
}
.cost-message {
	margin: 1.1rem 0 0 !important;
	padding: 1rem;
	border-radius: 14px;
	background: var(--yellow-soft);
	color: var(--green-950) !important;
	font-weight: 900;
}
.cost-actions {
	margin-top: 1rem;
	display: flex;
	flex-wrap: wrap;
	gap: 0.6rem;
}
.service-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 1rem;
}
.service-card {
	padding: clamp(1.25rem, 3vw, 2rem);
	border: 1px solid var(--line);
	border-radius: 24px;
	background: #fff;
}
.service-badge {
	width: 46px;
	height: 46px;
	display: grid;
	place-items: center;
	border-radius: 14px;
	background: var(--yellow);
	font-size: 1.2rem;
}
.service-card h3 {
	margin: 0.9rem 0 0.35rem;
	font-size: 1.25rem;
}
.service-card p {
	margin: 0;
	color: var(--muted);
}
.send-list,
.remote-list {
	margin: 1rem 0 0;
	padding: 0;
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 0.5rem;
	list-style: none;
}
.send-list li,
.remote-list li {
	padding: 0.65rem;
	border-radius: 12px;
	background: var(--green-050);
	text-align: center;
	font-size: 0.85rem;
	font-weight: 900;
}
.service-card .button {
	margin-top: 1rem;
	width: 100%;
}
.faq-list {
	display: grid;
	gap: 0.65rem;
}
.faq-list details {
	border: 1px solid var(--line);
	border-radius: 16px;
	background: #fff;
	overflow: hidden;
}
.faq-list summary {
	padding: 1rem 3rem 1rem 1rem;
	position: relative;
	cursor: pointer;
	font-weight: 900;
	list-style: none;
}
.faq-list summary::-webkit-details-marker {
	display: none;
}
.faq-list summary:after {
	content: "＋";
	position: absolute;
	right: 1rem;
	top: 0.9rem;
	color: var(--green-700);
	font-size: 1.3rem;
}
.faq-list details[open] summary:after {
	content: "−";
}
.faq-answer {
	padding: 0 1rem 1rem;
	color: var(--muted);
}
.faq-answer p {
	margin: 0;
}
.faq-answer a {
	color: var(--green-700);
	font-weight: 900;
}
.contact-grid {
	display: grid;
	grid-template-columns: 0.82fr 1.18fr;
	gap: clamp(1.5rem, 5vw, 4rem);
	align-items: start;
}
.store-card {
	padding: 1.5rem;
	border-radius: 24px;
	background: var(--green-950);
	color: #fff;
}
.store-card h3 {
	margin: 0;
	font-size: 1.5rem;
}
.store-card dl {
	margin: 1rem 0 0;
}
.store-card dt {
	margin-top: 0.7rem;
	color: #a9dbc5;
	font-size: 0.78rem;
	font-weight: 900;
}
.store-card dd {
	margin: 0.12rem 0 0;
	font-weight: 800;
}
.store-card a {
	color: #fff;
}
.line-box {
	margin-top: 1.2rem;
	padding: 1rem;
	border-radius: 18px;
	background: #fff;
	color: var(--ink);
}
.line-layout {
	display: grid;
	grid-template-columns: 110px 1fr;
	gap: 0.85rem;
	align-items: center;
}
.line-qr {
	width: 110px;
	height: auto;
	aspect-ratio: 1;
	object-fit: contain;
	border: 1px solid var(--line);
	border-radius: 12px;
}
.line-copy h4 {
	margin: 0;
	color: var(--green-950);
	font-size: 1.15rem;
}
.line-copy p {
	margin: 0.25rem 0 0;
	color: var(--muted);
	font-size: 0.84rem;
}
.line-name-note {
	margin: 0.8rem 0 0;
	padding: 0.7rem 0.8rem;
	border-radius: 12px;
	background: var(--yellow-soft);
	color: var(--green-950);
	font-size: 0.88rem;
	font-weight: 900;
}
.line-box .button {
	width: 100%;
	margin-top: 0.8rem;
}
.store-actions {
	margin-top: 1.2rem;
	display: grid;
	grid-template-columns: 1fr 1fr;
	gap: 0.6rem;
}
.contact-form {
	padding: clamp(1.2rem, 3vw, 2rem);
	border: 1px solid var(--line);
	border-radius: 26px;
	background: #fff;
	box-shadow: var(--shadow);
}
.contact-form h3 {
	margin: 0;
	font-size: 1.4rem;
}
.form-intro {
	margin: 0.3rem 0 1.1rem;
	color: var(--muted);
	font-size: 0.9rem;
}
.form-grid {
	display: grid;
	grid-template-columns: repeat(2, 1fr);
	gap: 0.8rem;
}
.form-control.full {
	grid-column: 1/-1;
}
.form-control label {
	display: block;
	margin-bottom: 0.3rem;
	font-size: 0.83rem;
	font-weight: 900;
}
.required {
	color: var(--red);
	font-size: 0.72rem;
}
input[type="text"],
select,
textarea {
	width: 100%;
	padding: 0.78rem 0.82rem;
	border: 1.5px solid var(--line);
	border-radius: 12px;
	color: var(--ink);
	background: #fbfdfc;
}
textarea {
	min-height: 135px;
	resize: vertical;
}
input:focus,
select:focus,
textarea:focus {
	outline: 0;
	border-color: var(--green-700);
	box-shadow: 0 0 0 4px rgba(8, 122, 84, 0.1);
}
.form-note {
	margin: 0.8rem 0 0;
	color: var(--muted);
	font-size: 0.78rem;
}
.form-submit {
	width: 100%;
	margin-top: 0.8rem;
}
.form-status {
	min-height: 1.4rem;
	margin: 0.4rem 0 0;
	color: var(--green-700);
	font-size: 0.82rem;
	font-weight: 900;
}
.mobile-bar {
	display: none;
}
@media (max-width: 920px) {
	.hero-grid,
	.finder-wrap,
	.contact-grid {
		grid-template-columns: 1fr;
	}
	.hero-copy {
		max-width: 760px;
	}
	.hero-visual {
		max-width: 600px;
		margin: auto;
	}
	.hero-visual img {
		width: min(82vw, 330px);
	}
	.quick-list {
		grid-template-columns: repeat(2, 1fr);
	}
	.service-grid {
		grid-template-columns: 1fr;
	}
	.contact-grid {
		gap: 1rem;
	}
}
@media (max-width: 680px) {
	html {
		scroll-padding-top: 12px;
	}
	.shell {
		width: min(calc(100% - 1.15rem), var(--max));
	}
	.hero {
		padding-top: 2rem;
	}
	.hero-actions {
		display: grid;
	}
	.hero-actions .button {
		width: 100%;
	}
	.visual-sticker {
		right: 0.4rem;
		bottom: 0.4rem;
	}
	.quick-list {
		grid-template-columns: 1fr 1fr;
	}
	.area-grid,
	.search-grid {
		grid-template-columns: 1fr;
	}
	.choice-grid {
		grid-template-columns: 1fr 1fr;
	}
	.choice-grid .choice:last-child:nth-child(odd) {
		grid-column: 1/-1;
	}
	.finder-actions {
		grid-template-columns: 1fr;
	}
	.cost-list {
		grid-template-columns: 1fr;
	}
	.send-list,
	.remote-list {
		grid-template-columns: 1fr;
	}
	.form-grid {
		grid-template-columns: 1fr;
	}
	.form-control.full {
		grid-column: auto;
	}
	.store-actions {
		grid-template-columns: 1fr;
	}
	.line-layout {
		grid-template-columns: 92px 1fr;
	}
	.line-qr {
		width: 92px;
	}
	footer .bottom {
		padding-bottom: 80px;
	}
	.mobile-bar {
		position: fixed;
		left: 0.5rem;
		right: 0.5rem;
		bottom: 0.5rem;
		z-index: 40;
		display: grid;
		grid-template-columns: 0.78fr 1fr 1fr;
		gap: 0.38rem;
		padding: 0.45rem;
		border: 1px solid rgba(215, 229, 222, 0.9);
		border-radius: 19px;
		background: rgba(255, 255, 255, 0.95);
		backdrop-filter: blur(12px);
		box-shadow: 0 12px 34px rgba(16, 35, 27, 0.18);
	}
	.mobile-bar .button {
		min-height: 50px;
		padding: 0.55rem 0.35rem;
		font-size: 0.82rem;
	}
	.map-card {
		padding: 0.6rem;
	}
	table {
		font-size: 0.9rem;
	}
	th,
	td {
		padding: 0.8rem;
	}
}
@media (prefers-reduced-motion: reduce) {
	html {
		scroll-behavior: auto;
	}
	*,
	*:before,
	*:after {
		transition: none !important;
	}
}