@charset "UTF-8";
/* =========================================================
   かんばん製作のワンズ  main.css
   --u : デザイン単位。PCはワイヤー(1334幅)基準で 1000〜1920px の間を可変、
         SPはワイヤー(392幅)基準で 100vw に追従します。
   ========================================================= */

:root {
	--red: #d51618;
	--red-d: #b40f12;
	--orange: #f56400;
	--orange-d: #dd3900;
	--pink: #f1c1c2;
	--pink-l: #f7dadb;
	--peach: #fdeddd;
	--beige: #e7d6c6;
	--dark: #2b211d;
	--text: #231815;
	--bg: #fbfbfb;
	--white: #fff;
	--gray: #e6e6e6;
	--ph: #8a8a8a;
	--green: #00a33e;
	--u: calc(clamp(1000px, 100vw, 1920px) / 1334);
	--font: "Zen Kaku Gothic New", "Hiragino Kaku Gothic ProN", "Hiragino Sans", "Noto Sans JP", Meiryo, sans-serif;
	--slab: "Alfa Slab One", "Rockwell", serif;
	--thin: "Jost", "Helvetica Neue", Arial, sans-serif;
	--cond: "Oswald", "Arial Narrow", sans-serif;
	--script: "Kaushan Script", cursive;
	--ease: cubic-bezier(.22, .61, .36, 1);
}
@media (max-width: 768px) {
	:root { --u: calc(100vw / 392); }
}

/* ---------- reset ---------- */
*, *::before, *::after { box-sizing: border-box; }
html { scroll-behavior: smooth; scroll-padding-top: 20px; -webkit-text-size-adjust: 100%; }
body { margin: 0; background: var(--bg); color: var(--text); font-family: var(--font); font-weight: 500; font-size: max(14px, calc(var(--u) * 11)); line-height: 2; letter-spacing: .04em; overflow-x: hidden; }
h1, h2, h3, h4, p, ul, ol, figure, address { margin: 0; padding: 0; }
ul, ol { list-style: none; }
address { font-style: normal; }
img { max-width: 100%; height: auto; vertical-align: bottom; }
a { color: inherit; text-decoration: none; }
button { font: inherit; color: inherit; background: none; border: 0; padding: 0; cursor: pointer; }
.skip-link { position: absolute; left: -9999px; top: 0; z-index: 1000; background: var(--dark); color: #fff; padding: 8px 16px; }
.skip-link:focus { left: 8px; }
:focus-visible { outline: 3px solid var(--orange); outline-offset: 2px; }

.sp { display: none; }
@media (max-width: 768px) {
	.pc { display: none; }
	.sp { display: inline; }
}

.container { width: min(92%, calc(var(--u) * 1222)); margin-inline: auto; }
.container--narrow { width: min(92%, calc(var(--u) * 716)); }
@media (max-width: 768px) {
	.container, .container--narrow { width: calc(100% - var(--u) * 48); }
}

/* 仮画像 */
.ph { background: var(--ph); color: rgba(255, 255, 255, .75); display: grid; place-items: center; width: 100%; height: 100%; font-size: 12px; letter-spacing: .1em; }

/* ---------- ボタン ---------- */
.btn-wrap { text-align: center; margin-top: calc(var(--u) * 45); }
.btn { display: inline-flex; align-items: center; justify-content: center; gap: 1.2em; min-width: calc(var(--u) * 266); min-height: calc(var(--u) * 33); padding: .5em 2em; font-weight: 700; font-size: max(13px, calc(var(--u) * 11)); line-height: 1.5; transition: background .25s, color .25s; }
.btn--line { border: 1px solid var(--dark); color: var(--dark); background: var(--white); }
.btn--line:hover { background: var(--dark); color: #fff; }
.btn--arrow::after { content: "→"; font-size: 1.3em; }
.btn--orange { background: var(--orange); color: #fff; }
@media (max-width: 768px) {
	.btn-wrap { margin-top: calc(var(--u) * 32); }
	.btn { min-width: calc(var(--u) * 320); min-height: calc(var(--u) * 48); font-size: calc(var(--u) * 15); }
	.btn-wrap .btn--line { background: var(--red); border-color: var(--red); color: #fff; }
}

/* ---------- セクション見出し（看板型） ---------- */
.sec { padding-top: calc(var(--u) * 100); }
.sec-ttl { text-align: center; margin-bottom: calc(var(--u) * 58); }
.sec-ttl__en { display: block; font-family: var(--slab); font-size: calc(var(--u) * 96); line-height: 1; color: var(--pink); letter-spacing: 0; }
.sec-ttl__ja { position: relative; z-index: 1; display: inline-block; margin-top: calc(var(--u) * -50); background: var(--dark); color: #fff; font-size: max(18px, calc(var(--u) * 20)); font-weight: 500; line-height: 1; padding: calc(var(--u) * 15) calc(var(--u) * 26); letter-spacing: .08em; min-width: calc(var(--u) * 166); }
.sec-ttl__ja::before, .sec-ttl__ja::after { content: ""; position: absolute; z-index: -1; top: calc(var(--u) * -12); bottom: calc(var(--u) * -36); width: calc(var(--u) * 4); min-width: 3px; background: var(--dark); }
.sec-ttl__ja::before { left: calc(var(--u) * 22); }
.sec-ttl__ja::after { right: calc(var(--u) * 22); }
.sec-ttl--onred .sec-ttl__en { color: rgba(255, 255, 255, .22); }
.sec-ttl--onorange .sec-ttl__en { color: #f9c79f; }
@media (max-width: 768px) {
	.sec { padding-top: calc(var(--u) * 52); }
	.sec-ttl { margin-bottom: calc(var(--u) * 40); }
	.sec-ttl__en { font-size: calc(var(--u) * 36); }
	.sec-ttl__ja { font-size: calc(var(--u) * 14); margin-top: calc(var(--u) * -18); padding: calc(var(--u) * 10) calc(var(--u) * 18); min-width: calc(var(--u) * 120); }
	.sec-ttl__ja::before, .sec-ttl__ja::after { width: 2px; min-width: 2px; top: calc(var(--u) * -8); bottom: calc(var(--u) * -16); }
	.sec-ttl__ja::before { left: calc(var(--u) * 16); }
	.sec-ttl__ja::after { right: calc(var(--u) * 16); }
}

/* ---------- フリーダイヤル ---------- */
.freedial { display: inline-flex; flex-direction: column; color: var(--dark); line-height: 1; }
.freedial__top { display: flex; justify-content: space-between; align-items: flex-end; gap: 1em; margin-bottom: calc(var(--u) * 4); padding-left: calc(var(--u) * 72); white-space: nowrap; }
.freedial__hours { font-size: max(11px, calc(var(--u) * 11)); letter-spacing: 0; }
.freedial__row { position: relative; display: flex; align-items: center; gap: calc(var(--u) * 6); }
.freedial__icon { width: calc(var(--u) * 66); }
.freedial__num { font-family: var(--cond); font-weight: 600; font-size: calc(var(--u) * 46); letter-spacing: -.01em; line-height: 1; }
.freedial__kana { font-size: max(9px, calc(var(--u) * 10)); font-weight: 700; letter-spacing: .1em; padding-right: .2em; }
.freedial--contact { position: relative; }
.freedial--contact .freedial__top { display: contents; }
.freedial--contact .freedial__kana { position: absolute; right: 0; top: calc(var(--u) * -14); }

/* ---------- 看板型CTA（吊り下げ） ---------- */
.cta-sign { position: relative; display: inline-grid; place-items: center; background: var(--orange); color: #fff; font-weight: 700; font-size: calc(var(--u) * 20); letter-spacing: .06em; width: calc(var(--u) * 253); height: calc(var(--u) * 66); transition: transform .3s var(--ease); transform-origin: top center; }
.cta-sign::before, .cta-sign::after { content: ""; position: absolute; bottom: 100%; width: 2px; height: calc(var(--u) * 40); background: var(--dark); }
.cta-sign::before { left: calc(var(--u) * 44); }
.cta-sign::after { right: calc(var(--u) * 44); }
.cta-sign:hover { transform: rotate(-2deg); }

/* =========================================================
   HEADER
   ========================================================= */
.header { position: relative; z-index: 50; background: var(--bg); }
.header__inner { display: flex; align-items: center; justify-content: space-between; height: calc(var(--u) * 117); padding: 0 calc(var(--u) * 56) 0 calc(var(--u) * 52); }
.header__logo img { width: calc(var(--u) * 420); }
.header__contact { display: flex; align-items: center; gap: calc(var(--u) * 32); align-self: stretch; padding-top: calc(var(--u) * 28); }
.header__contact .cta-sign { align-self: flex-start; }
.header__contact .cta-sign::before, .header__contact .cta-sign::after { height: calc(var(--u) * 28); }
.header__sp { display: none; }

.gnav { background: var(--gray); }
.gnav__list { display: flex; justify-content: center; }
.gnav__list li a { display: grid; place-items: center; width: calc(var(--u) * 139); height: calc(var(--u) * 44); font-size: max(12px, calc(var(--u) * 11)); font-weight: 700; letter-spacing: .1em; transition: background .2s, color .2s; }
.gnav__list li a:hover { background: #d9d9d9; }
.gnav__list .current-menu-item a, .gnav__list .current_page_item a { background: var(--red); color: #fff; }
.gnav__sp-contact { display: none; }

@media (max-width: 1100px) and (min-width: 769px) {
	.gnav__list li a { width: auto; padding: 0 1.4em; }
}

@media (max-width: 768px) {
	.header { position: sticky; top: 0; box-shadow: 0 1px 0 rgba(0, 0, 0, .06); }
	.header__inner { height: calc(var(--u) * 48); padding: 0 calc(var(--u) * 16); }
	.header__logo img { width: calc(var(--u) * 170); }
	.header__contact { display: none; }
	.header__sp { display: flex; gap: calc(var(--u) * 16); }
	.sp-btn { display: grid; place-items: center; width: calc(var(--u) * 32); height: calc(var(--u) * 32); border-radius: 4px; background: var(--orange); color: #fff; }
	.sp-btn svg { width: 62%; }
	.sp-btn--menu { position: relative; }
	.sp-btn--menu span { position: absolute; left: 22%; width: 56%; height: 3px; border-radius: 2px; background: #fff; transition: transform .3s, opacity .3s; }
	.sp-btn--menu span:nth-child(1) { top: 28%; }
	.sp-btn--menu span:nth-child(2) { top: calc(50% - 1.5px); }
	.sp-btn--menu span:nth-child(3) { bottom: 28%; }
	.is-menu-open .sp-btn--menu span:nth-child(1) { transform: translateY(calc(var(--u) * 6.4)) rotate(45deg); }
	.is-menu-open .sp-btn--menu span:nth-child(2) { opacity: 0; }
	.is-menu-open .sp-btn--menu span:nth-child(3) { transform: translateY(calc(var(--u) * -6.4)) rotate(-45deg); }

	.gnav { position: fixed; inset: calc(var(--u) * 48) 0 0; background: rgba(251, 251, 251, .98); overflow-y: auto; padding: calc(var(--u) * 16) calc(var(--u) * 24) calc(var(--u) * 40); opacity: 0; visibility: hidden; transition: opacity .3s, visibility .3s; }
	.is-menu-open .gnav { opacity: 1; visibility: visible; }
	.gnav__list { display: block; }
	.gnav__list li a { width: auto; height: auto; display: block; padding: calc(var(--u) * 16) 0; font-size: calc(var(--u) * 15); border-bottom: 1px solid var(--gray); }
	.gnav__list .current-menu-item a { background: none; color: var(--red); }
	.gnav__sp-contact { display: grid; gap: calc(var(--u) * 20); justify-items: center; margin-top: calc(var(--u) * 32); }
	.gnav__sp-contact .btn { width: 100%; }
}

/* ---------- サイドタブ ---------- */
.side-tabs { position: fixed; right: 0; top: 50%; z-index: 40; display: grid; gap: calc(var(--u) * 17); transform: translateY(-40%); }
.side-tab { display: block; writing-mode: vertical-rl; font-size: max(12px, calc(var(--u) * 11)); font-weight: 700; letter-spacing: .15em; line-height: 1; padding: calc(var(--u) * 20) calc(var(--u) * 14); box-shadow: -1px 4px 0 var(--dark); transition: transform .25s var(--ease); }
.side-tab:hover { transform: translateX(-4px); }
.side-tab--red { background: var(--red); color: #fff; border: 2px solid var(--red-d); border-right: 0; }
.side-tab--white { background: #fff; color: var(--dark); border: 2px solid var(--dark); border-right: 0; }
@media (max-width: 768px) {
	.side-tabs { display: none; }
}

/* =========================================================
   HERO
   ========================================================= */
.hero { position: relative; }
.hero__visual { position: relative; height: calc(var(--u) * 505); border-bottom-left-radius: calc(var(--u) * 50); overflow: hidden; background: var(--ph); }
.hero__img { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; opacity: 0; transition: opacity 1.2s ease; }
.hero__img.is-active { opacity: 1; }
.hero__placeholder { align-items: start; justify-items: center; padding: 16px; }
.hero__copy { position: absolute; left: calc(var(--u) * 120); bottom: calc(var(--u) * 80); color: #fff; text-shadow: 0 2px 12px rgba(0, 0, 0, .35); pointer-events: none; }
.hero__catch { font-size: calc(var(--u) * 46); font-weight: 900; line-height: 1.45; letter-spacing: .06em; }
.hero__h1 { margin-top: calc(var(--u) * 14); font-size: max(13px, calc(var(--u) * 15)); font-weight: 700; line-height: 1.6; letter-spacing: .08em; }
.hero__h1 span { display: inline-block; margin-left: 1em; padding: .1em .7em; background: var(--red); text-shadow: none; }
.hero__mascot { position: absolute; right: calc(var(--u) * 178); bottom: calc(var(--u) * -50); width: calc(var(--u) * 245); transition: transform .3s var(--ease); }
.hero__mascot:hover { transform: translateY(-6px); }

@media (max-width: 768px) {
	.hero__visual { height: calc(var(--u) * 180); border-radius: 0 0 calc(var(--u) * 8) calc(var(--u) * 8); margin: 0 calc(var(--u) * 0); }
	.hero__copy { left: calc(var(--u) * 16); bottom: calc(var(--u) * 16); }
	.hero__catch { font-size: calc(var(--u) * 20); }
	.hero__h1 { font-size: calc(var(--u) * 10); margin-top: 4px; }
	.hero__h1 span { display: none; }
	.hero__mascot { right: calc(var(--u) * 8); bottom: calc(var(--u) * -30); width: calc(var(--u) * 110); }
}

/* =========================================================
   PRODUCTS
   ========================================================= */
.products { padding-top: calc(var(--u) * 100); }
.products__lead { text-align: center; font-size: max(14px, calc(var(--u) * 11)); line-height: 2; margin-bottom: calc(var(--u) * 35); margin-top: calc(var(--u) * -12); }
.products__list { display: grid; grid-template-columns: repeat(3, 1fr); gap: calc(var(--u) * 22) calc(var(--u) * 25); }
.products__item a { display: flex; flex-direction: column; align-items: center; justify-content: flex-end; height: calc(var(--u) * 167); padding-bottom: calc(var(--u) * 20); background: var(--white); border-radius: calc(var(--u) * 6); box-shadow: 3px 3px 7px rgba(0, 0, 0, .13); transition: transform .3s var(--ease), box-shadow .3s; }
.products__item a:hover { transform: translateY(-4px); box-shadow: 4px 8px 16px rgba(0, 0, 0, .14); }
.products__item img { width: calc(var(--u) * 156); height: calc(var(--u) * 100); object-fit: contain; margin-bottom: calc(var(--u) * 6); }
.products__name { color: var(--red); font-size: max(14px, calc(var(--u) * 16)); font-weight: 700; line-height: 1.4; text-align: center; letter-spacing: .06em; }
@media (max-width: 768px) {
	.products__lead { text-align: left; font-size: calc(var(--u) * 13); margin-top: calc(var(--u) * -8); margin-bottom: calc(var(--u) * 30); }
	.products__list { grid-template-columns: 1fr; gap: calc(var(--u) * 32); justify-items: center; }
	.products__item { width: calc(var(--u) * 240); }
	.products__item.is-pc-only { display: none; }
	.products__item a { height: calc(var(--u) * 180); padding-bottom: calc(var(--u) * 20); }
	.products__item img { width: calc(var(--u) * 170); height: calc(var(--u) * 110); }
	.products__name { font-size: calc(var(--u) * 17); }
}

/* =========================================================
   SPEED 見積りバナー
   ========================================================= */
.speed { display: block; margin-top: calc(var(--u) * 85); position: relative; }
.speed__photo { display: block; overflow: hidden; }
.speed__photo img { width: 100%; height: calc(var(--u) * 205); object-fit: cover; object-position: center 60%; transition: transform .6s var(--ease); }
.speed:hover .speed__photo img { transform: scale(1.03); }
.speed__bar { display: block; background: var(--orange); color: #fff; }
.speed__inner { display: flex; align-items: center; justify-content: center; gap: calc(var(--u) * 22); height: calc(var(--u) * 66); font-style: italic; }
.speed__sub { font-weight: 900; font-size: calc(var(--u) * 22); transform: skewX(-8deg); letter-spacing: .02em; }
.speed__main { font-weight: 900; font-size: calc(var(--u) * 46); transform: skewX(-10deg); letter-spacing: -.01em; line-height: 1; }
.speed__more { font-style: normal; font-weight: 700; font-size: calc(var(--u) * 20); border: 2px solid #fff; border-radius: 999px; padding: calc(var(--u) * 4) calc(var(--u) * 36); margin-left: calc(var(--u) * 10); line-height: 1.4; }
.speed__more i { font-style: normal; margin-left: .6em; }
@media (max-width: 768px) {
	.speed { margin-top: calc(var(--u) * 48); }
	.speed__photo img { height: calc(var(--u) * 112); object-position: 70% 60%; }
	.speed__inner { justify-content: space-between; height: auto; padding: calc(var(--u) * 8) calc(var(--u) * 16) calc(var(--u) * 8) calc(var(--u) * 36); flex-wrap: wrap; gap: 0; }
	.speed__sub { font-size: calc(var(--u) * 12); width: 100%; margin-top: calc(var(--u) * -30); text-shadow: 0 1px 3px rgba(0, 0, 0, .3); }
	.speed__main { font-size: calc(var(--u) * 24); }
	.speed__more { font-size: calc(var(--u) * 13); padding: 2px calc(var(--u) * 16); }
}

/* =========================================================
   REASON
   ========================================================= */
.reason { margin-top: calc(var(--u) * 45); background: var(--red); border-radius: 0 calc(var(--u) * 50) 0 calc(var(--u) * 50); padding: calc(var(--u) * 95) 0 calc(var(--u) * 122); overflow: hidden; }
.reason .sec-ttl { margin-bottom: calc(var(--u) * 40); }
.reason__item { position: relative; display: grid; grid-template-columns: 1fr calc(var(--u) * 500); align-items: start; gap: calc(var(--u) * 60); background: var(--bg); padding: calc(var(--u) * 61) calc(var(--u) * 100) calc(var(--u) * 56) calc(var(--u) * 128); min-height: calc(var(--u) * 450); overflow: hidden; }
.reason__item + .reason__item { margin-top: calc(var(--u) * 67); }
.reason__item::before { /* ⊕ */
	content: ""; position: absolute; top: calc(var(--u) * 17); left: calc(var(--u) * 17); width: calc(var(--u) * 26); height: calc(var(--u) * 26); border-radius: 50%; border: 2px solid #c9c9c9;
	background: linear-gradient(#c9c9c9, #c9c9c9) center / 50% 2px no-repeat, linear-gradient(#c9c9c9, #c9c9c9) center / 2px 50% no-repeat;
}
.reason__item--odd { margin-left: calc(var(--u) * 180); border-top-left-radius: calc(var(--u) * 30); }
.reason__item--even { margin-right: calc(var(--u) * 181); border-top-right-radius: calc(var(--u) * 30); grid-template-columns: calc(var(--u) * 500) 1fr; padding: calc(var(--u) * 39) calc(var(--u) * 128) calc(var(--u) * 56) calc(var(--u) * 122); }
.reason__item--even::before { left: auto; right: calc(var(--u) * 17); }
.reason__item--even .reason__img { order: -1; }
.reason__body { padding-top: calc(var(--u) * 2); }
.reason__title { font-size: max(18px, calc(var(--u) * 20)); font-weight: 700; line-height: 1.6; letter-spacing: .05em; margin-bottom: calc(var(--u) * 18); }
.reason__title span { background: linear-gradient(transparent 55%, var(--gray) 55%); padding: 0 .1em; -webkit-box-decoration-break: clone; box-decoration-break: clone; }
.reason__text { font-size: max(14px, calc(var(--u) * 11.5)); line-height: 2; }
.reason__title, .reason__text { position: relative; z-index: 1; }
.reason__num { position: absolute; z-index: 0; bottom: calc(var(--u) * -56); font-family: var(--thin); font-weight: 200; font-size: calc(var(--u) * 250); line-height: .8; color: var(--pink-l); letter-spacing: -.02em; pointer-events: none; }
.reason__item--odd .reason__num { left: calc(var(--u) * -4); }
.reason__item--even .reason__num { right: calc(var(--u) * -4); }
.reason__img { position: relative; aspect-ratio: 500 / 350; }
.reason__img::before { content: ""; position: absolute; z-index: 0; inset: 0; transform: translate(calc(var(--u) * 22), calc(var(--u) * 22)); background: repeating-linear-gradient(-45deg, rgba(213, 22, 24, .6) 0 1px, transparent 1px 7px); }
.reason__item--even .reason__img::before { transform: translate(calc(var(--u) * -22), calc(var(--u) * 22)); }
.reason__img > * { position: relative; z-index: 1; width: 100%; height: 100%; object-fit: cover; }
@media (max-width: 1100px) and (min-width: 769px) {
	.reason__item { grid-template-columns: 1fr calc(var(--u) * 420); padding-right: calc(var(--u) * 60); }
	.reason__item--even { grid-template-columns: calc(var(--u) * 420) 1fr; padding-left: calc(var(--u) * 60); }
}
@media (max-width: 768px) {
	.reason { margin-top: calc(var(--u) * 45); padding: calc(var(--u) * 50) 0 calc(var(--u) * 16); border-radius: 0 calc(var(--u) * 20) 0 0; }
	.reason .sec-ttl { margin-bottom: calc(var(--u) * 42); }
	.reason__item, .reason__item--even { display: block; margin: 0 calc(var(--u) * 16); padding: calc(var(--u) * 32) calc(var(--u) * 20) calc(var(--u) * 36); min-height: 0; border-radius: calc(var(--u) * 8); }
	.reason__item + .reason__item { margin-top: calc(var(--u) * 24); }
	.reason__item::before { top: calc(var(--u) * 8); left: calc(var(--u) * 8); width: calc(var(--u) * 16); height: calc(var(--u) * 16); border-width: 1.5px; }
	.reason__item--even::before { left: calc(var(--u) * 8); right: auto; }
	.reason__img { margin-bottom: calc(var(--u) * 28); }
	.reason__img::before { display: none; }
	.reason__title { text-align: center; font-size: calc(var(--u) * 17); margin-bottom: calc(var(--u) * 14); }
	.reason__title span { background: none; display: block; border-bottom: calc(var(--u) * 8) solid var(--gray); line-height: 1.5; padding-bottom: 0; }
	.reason__text { font-size: calc(var(--u) * 13.5); line-height: 1.9; }
	.reason__num, .reason__item--odd .reason__num, .reason__item--even .reason__num { font-size: calc(var(--u) * 96); right: calc(var(--u) * 12); left: auto; bottom: calc(var(--u) * -14); }
}

/* =========================================================
   WORKS
   ========================================================= */
.works { padding-bottom: calc(var(--u) * 100); }
.works__viewport { overflow: hidden; padding: 0 0 calc(var(--u) * 4); }
.works__track { display: flex; gap: calc(var(--u) * 37); width: max-content; padding-left: calc(var(--u) * 56); }
.works__viewport.is-running .works__track { animation: ones-marquee var(--marquee-dur, 50s) linear infinite; }
.works__viewport.is-running:hover .works__track { animation-play-state: paused; }
@keyframes ones-marquee { to { transform: translateX(var(--marquee-dist, -50%)); } }
@media (prefers-reduced-motion: reduce) {
	.works__viewport { overflow-x: auto; }
	.works__viewport.is-running .works__track { animation: none; }
}
.works-card { width: calc(var(--u) * 278); flex-shrink: 0; }
.works-card__img { aspect-ratio: 278 / 200; overflow: hidden; background: var(--ph); }
.works-card__img.ph { height: auto; }
.works-card__img img, .works-card__img .ph { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.works-card a:hover .works-card__img img { transform: scale(1.05); }
.works-card__meta { display: flex; flex-wrap: wrap; gap: 0 1.4em; align-items: center; margin-top: calc(var(--u) * 10); font-size: max(12px, calc(var(--u) * 11)); line-height: 1.6; }
.works-card__title { font-size: max(15px, calc(var(--u) * 16)); font-weight: 700; line-height: 1.5; letter-spacing: .05em; }
@media (max-width: 768px) {
	.works { padding-bottom: calc(var(--u) * 56); }
	.works__viewport { overflow: visible; }
	.works__track { flex-direction: column; width: auto; gap: calc(var(--u) * 28); padding: 0 calc(var(--u) * 24); animation: none !important; }
	.works-card { width: 100%; }
	.works__track .works-card:nth-child(n+4) { display: none; }
	.works-card__meta { font-size: calc(var(--u) * 12); margin-top: calc(var(--u) * 12); }
	.works-card__title { font-size: calc(var(--u) * 15); }
}

/* =========================================================
   FLOW
   ========================================================= */
.flow { background: var(--peach); border-radius: calc(var(--u) * 70) calc(var(--u) * 70) 0 0; padding-top: calc(var(--u) * 75); }
.flow .sec-ttl { margin-bottom: calc(var(--u) * 30); }
.flow__list { display: grid; grid-template-columns: repeat(4, 1fr); gap: calc(var(--u) * 30) calc(var(--u) * 31); }
.flow__item { position: relative; background: var(--orange); color: #fff; border-radius: calc(var(--u) * 6); padding: calc(var(--u) * 82) calc(var(--u) * 16) calc(var(--u) * 20); margin-top: calc(var(--u) * 45); min-height: calc(var(--u) * 205); }
.flow__item:not(:nth-child(4n))::after { content: ""; position: absolute; top: 50%; left: calc(100% + var(--u) * 9); width: calc(var(--u) * 14); height: calc(var(--u) * 42); transform: translateY(-50%); background: var(--beige); clip-path: polygon(0 0, 100% 50%, 0 100%); }
.flow__icon { position: absolute; top: calc(var(--u) * -45); left: 50%; transform: translateX(-50%); display: grid; place-items: center; width: calc(var(--u) * 100); height: calc(var(--u) * 100); border-radius: 50%; background: var(--white); border: calc(var(--u) * 8) solid var(--orange); }
.flow__icon img { width: calc(var(--u) * 50); }
.flow__num { position: absolute; top: calc(var(--u) * 30); left: 0; right: 0; text-align: center; font-family: var(--cond); font-weight: 600; font-size: calc(var(--u) * 40); line-height: 1; color: var(--orange-d); }
.flow__title { text-align: center; font-size: max(15px, calc(var(--u) * 16)); font-weight: 900; line-height: 1.4; letter-spacing: .06em; margin-bottom: calc(var(--u) * 8); }
.flow__text { font-size: max(12px, calc(var(--u) * 11)); line-height: 1.6; font-weight: 700; }
@media (max-width: 1100px) and (min-width: 769px) {
	.flow__list { width: 92%; }
}
@media (max-width: 768px) {
	.flow { border-radius: calc(var(--u) * 20) calc(var(--u) * 20) 0 0; padding-top: calc(var(--u) * 40); margin: 0 calc(var(--u) * 12); }
	.flow__list { grid-template-columns: 1fr; gap: calc(var(--u) * 32); width: calc(100% - var(--u) * 16); }
	.flow__item { margin: 0 0 0 calc(var(--u) * 26); min-height: calc(var(--u) * 80); padding: calc(var(--u) * 12) calc(var(--u) * 12) calc(var(--u) * 12) calc(var(--u) * 50); border-radius: calc(var(--u) * 4); overflow: visible; }
	.flow__item::after, .flow__item:not(:nth-child(4n))::after { content: ""; top: calc(100% + var(--u) * 8); left: 50%; width: calc(var(--u) * 40); height: calc(var(--u) * 14); transform: translateX(-50%); clip-path: polygon(0 0, 100% 0, 50% 100%); }
	.flow__item:last-child::after { display: none; }
	.flow__icon { top: calc(var(--u) * 6); left: calc(var(--u) * -30); transform: none; width: calc(var(--u) * 64); height: calc(var(--u) * 64); border-width: calc(var(--u) * 5); }
	.flow__icon img { width: calc(var(--u) * 32); }
	.flow__num { top: auto; bottom: calc(var(--u) * 6); left: auto; right: calc(var(--u) * 8); font-size: calc(var(--u) * 50); color: var(--orange-d); opacity: .9; }
	.flow__body { position: relative; z-index: 1; }
	.flow__title { text-align: left; font-size: calc(var(--u) * 15); margin-bottom: calc(var(--u) * 4); }
	.flow__text { font-size: calc(var(--u) * 12); }
}

/* ---------- 開業・リニューアル ---------- */
.open { position: relative; margin-top: calc(var(--u) * 78); height: calc(var(--u) * 416); overflow: hidden; }
.open__head { position: absolute; z-index: 3; top: 0; left: 0; width: 79%; height: calc(var(--u) * 45); background: var(--orange); color: #fff; font-size: calc(var(--u) * 25); font-weight: 900; letter-spacing: .04em; line-height: 1; display: flex; align-items: center; padding-left: calc((100vw - min(92vw, var(--u) * 716)) / 2); }
.open__photos { position: absolute; inset: 0 0 0 36%; display: flex; }
.open__man { flex: 1 1 auto; width: 67%; height: 100%; object-fit: cover; object-position: 55% 40%; -webkit-mask-image: linear-gradient(to right, transparent 0, #000 42%); mask-image: linear-gradient(to right, transparent 0, #000 42%); }
.open__woman { width: 33%; height: 100%; object-fit: cover; object-position: 50% 20%; }
.open__script { position: absolute; left: 22%; bottom: calc(var(--u) * 20); font-family: var(--script); color: var(--orange); font-size: calc(var(--u) * 64); line-height: .95; transform: rotate(-14deg); text-shadow: 0 2px 0 rgba(255, 255, 255, .6); pointer-events: none; white-space: nowrap; }
.open__script span { display: block; }
.open__script span + span { margin-left: 1.6em; }
.open__body { position: relative; z-index: 2; padding-top: calc(var(--u) * 67); }
.open__tags { display: flex; flex-wrap: wrap; gap: calc(var(--u) * 7) calc(var(--u) * 7); align-items: center; }
.open__tags li.br { flex-basis: 100%; height: 0; border: 0; padding: 0; background: none; }
.open__tags li.br--gap { height: calc(var(--u) * 10); }
.open__tags li { border: 2px solid var(--orange); color: var(--orange); background: rgba(255, 255, 255, .5); border-radius: 999px; font-size: calc(var(--u) * 16); font-weight: 900; line-height: 1; padding: calc(var(--u) * 6) calc(var(--u) * 22); letter-spacing: .1em; }
.open__tags li.open__tags-tail { border: 0; background: none; color: var(--dark); font-size: calc(var(--u) * 15); font-weight: 700; padding: 0 0 0 calc(var(--u) * 4); letter-spacing: .04em; white-space: nowrap; }
.open__text { margin: calc(var(--u) * 20) 0 calc(var(--u) * 22); font-size: calc(var(--u) * 15.5); font-weight: 700; line-height: 1.8; }
.open__body .btn { min-width: calc(var(--u) * 188); }
@media (max-width: 768px) {
	.open { height: auto; margin: calc(var(--u) * 40) calc(var(--u) * -12) 0; padding-bottom: calc(var(--u) * 48); }
	.open__head { position: static; width: 100%; height: auto; padding: calc(var(--u) * 10) 0; justify-content: center; text-align: center; font-size: calc(var(--u) * 17); line-height: 1.4; }
	.open__photos { position: relative; inset: auto; height: calc(var(--u) * 150); }
	.open__man { width: 55%; -webkit-mask-image: none; mask-image: none; }
	.open__woman { width: 45%; }
	.open__script { left: 6%; bottom: calc(var(--u) * 4); font-size: calc(var(--u) * 26); transform: rotate(-8deg); }
	.open__script span { display: inline; }
	.open__script span + span { margin-left: .3em; }
	.open__body { padding-top: calc(var(--u) * 20); width: calc(100% - var(--u) * 48); }
	.open__tags { max-width: none; gap: calc(var(--u) * 6); }
	.open__tags li { font-size: calc(var(--u) * 11); padding: calc(var(--u) * 3) calc(var(--u) * 14); border-width: 1.5px; }
	.open__tags li.br { display: none; }
	.open__tags li.open__tags-tail { font-size: calc(var(--u) * 11.5); }
	.open__text { font-size: calc(var(--u) * 12.5); }
	.open__body .btn { width: 100%; background: transparent; }
}

/* =========================================================
   AREA
   ========================================================= */
.area { padding-bottom: calc(var(--u) * 90); }
.area__inner { display: grid; grid-template-columns: calc(var(--u) * 335) 1fr; gap: calc(var(--u) * 38); align-items: center; }
.area__pref + .area__pref { margin-top: calc(var(--u) * 50); }
.area__pref-name { background: var(--red); color: #fff; text-align: center; font-size: max(14px, calc(var(--u) * 16)); font-weight: 500; line-height: 1.75; letter-spacing: .1em; }
.area__cities { margin-top: calc(var(--u) * 12); font-size: max(13px, calc(var(--u) * 11)); line-height: 2.2; letter-spacing: .02em; }
@media (max-width: 768px) {
	.area { padding-bottom: calc(var(--u) * 50); }
	.area__inner { grid-template-columns: 1fr; gap: calc(var(--u) * 24); }
	.area__map { width: calc(var(--u) * 240); margin: 0 auto; }
	.area__pref + .area__pref { margin-top: calc(var(--u) * 20); }
	.area__pref-name { font-size: calc(var(--u) * 14); }
	.area__cities { font-size: calc(var(--u) * 12); line-height: 1.8; margin-top: calc(var(--u) * 6); }
}

/* =========================================================
   CONTACT
   ========================================================= */
.contact { background: var(--red); color: #fff; text-align: center; padding: calc(var(--u) * 70) 0 calc(var(--u) * 72); }
.contact .sec-ttl { margin-bottom: calc(var(--u) * 40); }
.contact__lead { font-size: max(15px, calc(var(--u) * 16)); font-weight: 700; line-height: 1.8; letter-spacing: .08em; }
.contact__btns { display: flex; justify-content: center; gap: calc(var(--u) * 28); margin-top: calc(var(--u) * 26); }
.contact__tel { display: grid; place-items: center; background: var(--white); width: calc(var(--u) * 378); height: calc(var(--u) * 105); }
.freedial--contact { flex-direction: column-reverse; }
.freedial--contact .freedial__hours { margin: calc(var(--u) * 8) 0 0; text-align: center; }
.freedial--contact .freedial__num { font-size: calc(var(--u) * 46); }
.contact__mail { display: grid; place-items: center; width: calc(var(--u) * 311); height: calc(var(--u) * 105); background: var(--orange); border: 3px solid #fff; font-size: calc(var(--u) * 25); font-weight: 900; line-height: 1.5; letter-spacing: .06em; transition: background .25s; }
.contact__mail:hover { background: #ff7a1f; }
.contact__sp { display: none; }
@media (max-width: 768px) {
	.contact { padding: calc(var(--u) * 40) 0 calc(var(--u) * 44); }
	.contact .sec-ttl { margin-bottom: calc(var(--u) * 28); }
	.contact__lead { font-size: calc(var(--u) * 12); }
	.contact__btns { display: none; }
	.contact__sp { display: flex; justify-content: center; gap: calc(var(--u) * 56); margin-top: calc(var(--u) * 24); }
	.contact__sp-btn { display: grid; place-items: center; width: calc(var(--u) * 54); height: calc(var(--u) * 54); border-radius: 4px; color: #fff; }
	.contact__sp-btn svg { width: 56%; }
	.contact__sp-btn--tel { background: var(--green); }
	.contact__sp-btn--mail { background: var(--orange); }
}

/* =========================================================
   FOOTER
   ========================================================= */
.footer { position: relative; padding: calc(var(--u) * 70) 0 calc(var(--u) * 30); }
.footer__top { display: flex; align-items: center; justify-content: space-between; width: min(92%, calc(var(--u) * 974)); }
.footer__logo img { width: calc(var(--u) * 355); }
.footer__cta { position: relative; }
.footer__dog { display: none; }
.cta-sign--footer { width: calc(var(--u) * 234); height: calc(var(--u) * 50); font-size: calc(var(--u) * 19); }
.cta-sign--footer::before, .cta-sign--footer::after { height: calc(var(--u) * 12); }
.cta-sign--footer { box-shadow: none; }
.footer__cta::before, .footer__cta::after { content: ""; position: absolute; top: 100%; width: 2px; height: calc(var(--u) * 34); background: var(--dark); }
.footer__cta::before { left: calc(var(--u) * 55); }
.footer__cta::after { right: calc(var(--u) * 55); }
.freedial--footer .freedial__num { font-size: calc(var(--u) * 40); }
.freedial--footer .freedial__icon { width: calc(var(--u) * 56); }
.freedial--footer .freedial__top { padding-left: calc(var(--u) * 62); }
.footer__bottom { display: flex; justify-content: space-between; align-items: flex-start; gap: 40px; margin-top: calc(var(--u) * 44); width: min(92%, calc(var(--u) * 974)); }
.footer__name { font-size: max(15px, calc(var(--u) * 16)); font-weight: 500; line-height: 1.75; letter-spacing: .06em; }
.footer__address { margin-top: calc(var(--u) * 12); font-size: max(12px, calc(var(--u) * 11)); line-height: 1.55; }
.footer__list { display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 0 calc(var(--u) * 28); }
.footer__list a { font-size: max(12px, calc(var(--u) * 11)); font-weight: 700; letter-spacing: .08em; transition: color .2s; }
.footer__list a:hover, .footer__list .current-menu-item a { color: var(--red); }
.footer__list .current-menu-item a { background: none; }
.footer__copy { text-align: center; margin-top: calc(var(--u) * 50); font-size: 11px; color: #8a8a8a; }
.pagetop { position: fixed; right: 16px; bottom: 16px; z-index: 30; width: 48px; height: 48px; border-radius: 50%; background: var(--dark); opacity: 0; visibility: hidden; transition: opacity .3s, visibility .3s; }
.pagetop::before { content: ""; position: absolute; left: 50%; top: 55%; width: 12px; height: 12px; border-top: 3px solid #fff; border-left: 3px solid #fff; transform: translate(-50%, -50%) rotate(45deg); }
.is-scrolled .pagetop { opacity: 1; visibility: visible; }
@media (max-width: 768px) {
	.footer { padding: calc(var(--u) * 40) 0 calc(var(--u) * 80); }
	.footer__top { flex-direction: column; gap: calc(var(--u) * 20); width: calc(100% - var(--u) * 48); }
	.footer__logo img { width: calc(var(--u) * 260); }
	.freedial--footer .freedial__num { font-size: calc(var(--u) * 36); }
	.freedial--footer .freedial__icon { width: calc(var(--u) * 46); }
	.freedial--footer .freedial__top { padding-left: calc(var(--u) * 52); }
	.freedial--footer .freedial__hours { font-size: calc(var(--u) * 9); }
	.footer__cta { display: flex; align-items: flex-end; margin-top: calc(var(--u) * 20); padding-left: calc(var(--u) * 0); }
	.footer__dog { display: block; width: calc(var(--u) * 64); margin-right: calc(var(--u) * -10); position: relative; z-index: 2; }
	.cta-sign--footer { width: calc(var(--u) * 190); height: calc(var(--u) * 42); font-size: calc(var(--u) * 16); margin-bottom: calc(var(--u) * 20); }
	.cta-sign--footer::before, .cta-sign--footer::after { height: calc(var(--u) * 12); }
	.footer__cta::before, .footer__cta::after { top: auto; bottom: calc(var(--u) * -8); height: calc(var(--u) * 30); }
	.footer__cta::before { left: calc(var(--u) * 96); }
	.footer__cta::after { right: calc(var(--u) * 42); }
	.footer__bottom { flex-direction: column; align-items: center; text-align: center; width: calc(100% - var(--u) * 48); margin-top: calc(var(--u) * 36); }
	.footer__nav { display: none; }
	.footer__name { font-size: calc(var(--u) * 14); }
	.footer__address { font-size: calc(var(--u) * 12.5); }
	.pagetop { width: 40px; height: 40px; }
}

/* =========================================================
   下層ページ
   ========================================================= */
.page-head { position: relative; text-align: center; padding: calc(var(--u) * 70) 0 calc(var(--u) * 50); background: var(--peach); border-bottom-left-radius: calc(var(--u) * 50); }
.page-head__en { font-family: var(--slab); color: #f9c79f; font-size: calc(var(--u) * 80); line-height: 1; }
.page-head__ttl { display: inline-block; position: relative; margin-top: calc(var(--u) * -34); background: var(--dark); color: #fff; font-size: max(18px, calc(var(--u) * 22)); font-weight: 500; line-height: 1.3; padding: calc(var(--u) * 12) calc(var(--u) * 30); }
.page-body { padding: calc(var(--u) * 70) 0 calc(var(--u) * 100); }
.entry { font-size: max(15px, calc(var(--u) * 12)); }
.entry > * + * { margin-top: 1.4em; }
.entry h2 { font-size: 1.5em; line-height: 1.5; padding: .4em .8em; border-left: 6px solid var(--red); background: #fff; margin-top: 2.4em; }
.entry h3 { font-size: 1.25em; line-height: 1.5; padding-bottom: .3em; border-bottom: 2px solid var(--gray); margin-top: 2em; }
.entry a { color: var(--red); text-decoration: underline; }
.entry img { border-radius: 4px; }
.entry__date { display: block; font-size: .85em; color: #777; }
.entry__title { font-size: max(22px, calc(var(--u) * 26)); line-height: 1.5; margin: .3em 0 1.2em; }
.works-single__img { margin-bottom: 2em; }
.tag { display: inline-block; font-size: 11px; line-height: 1; padding: .4em .8em; background: var(--red); color: #fff !important; text-decoration: none !important; border-radius: 2px; }
.post-list li a { display: flex; gap: 2em; padding: 1.2em .4em; border-bottom: 1px solid var(--gray); }
.post-list time { color: #777; flex-shrink: 0; }
.term-filter { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-bottom: calc(var(--u) * 50); }
.term-filter a { display: block; border: 2px solid var(--red); color: var(--red); border-radius: 999px; font-size: 13px; font-weight: 700; line-height: 1; padding: .7em 1.4em; transition: background .2s, color .2s; }
.term-filter a:hover, .term-filter a.is-current { background: var(--red); color: #fff; }
.term-desc { max-width: 760px; margin: 0 auto 50px; }
.works-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); gap: 44px 32px; }
.works-grid .works-card { width: auto; }
.empty { text-align: center; }
.nav-links { display: flex; justify-content: center; gap: 8px; margin-top: 60px; }
.page-numbers { display: grid; place-items: center; min-width: 40px; height: 40px; border: 1px solid var(--dark); font-weight: 700; }
.page-numbers.current { background: var(--dark); color: #fff; }
@media (max-width: 768px) {
	.page-head { padding: calc(var(--u) * 40) 0 calc(var(--u) * 30); border-radius: 0; }
	.page-head__en { font-size: calc(var(--u) * 40); }
	.page-head__ttl { margin-top: calc(var(--u) * -16); font-size: calc(var(--u) * 17); }
	.page-body { padding: calc(var(--u) * 40) 0 calc(var(--u) * 60); }
	.term-filter { justify-content: flex-start; }
}

/* ---------- スクロールフェード ---------- */
.js-fade { opacity: 0; transform: translateY(24px); transition: opacity .8s var(--ease), transform .8s var(--ease); }
.js-fade.is-inview { opacity: 1; transform: none; }
.no-js .js-fade { opacity: 1; transform: none; }
@media (prefers-reduced-motion: reduce) {
	.js-fade { opacity: 1; transform: none; transition: none; }
}


/* =========================================================
   下層ページ共通
   ========================================================= */
.breadcrumb { width: min(92%, calc(var(--u) * 1100)); margin: 14px auto 0; font-size: 12px; line-height: 1.6; color: #777; }
.breadcrumb ol { display: flex; flex-wrap: wrap; gap: 0 .6em; }
.breadcrumb li + li::before { content: "›"; margin-right: .6em; color: #bbb; }
.breadcrumb a { color: var(--dark); text-decoration: underline; text-underline-offset: 2px; }
.lower { padding-block: calc(var(--u) * 60) 0; }
.lower:last-of-type { padding-bottom: calc(var(--u) * 90); }
.lower__lead { text-align: center; font-size: max(15px, calc(var(--u) * 12)); line-height: 2; margin-bottom: calc(var(--u) * 40); }
.lower-ttl { position: relative; text-align: center; font-size: max(20px, calc(var(--u) * 22)); font-weight: 900; line-height: 1.5; letter-spacing: .06em; margin: calc(var(--u) * 70) 0 calc(var(--u) * 36); padding-bottom: .6em; text-wrap: balance; }
.lower-ttl::after { content: ""; position: absolute; left: 50%; bottom: 0; width: 48px; height: 4px; transform: translateX(-50%); background: repeating-linear-gradient(90deg, var(--red) 0 16px, var(--orange) 16px 32px, var(--dark) 32px 48px); }
.lower-ttl--left { text-align: left; }
.lower-ttl--left::after { left: 0; transform: none; }
.lower > .lower-ttl:first-child, .lower .container > .lower-ttl:first-child { margin-top: 0; }
.btn--big { min-width: min(100%, calc(var(--u) * 360)); min-height: 64px; font-size: max(16px, calc(var(--u) * 17)); border-radius: 4px; }
.note { font-size: 12px; color: #777; margin-top: 1em; }
.check-list li { position: relative; padding-left: 1.8em; line-height: 1.8; }
.check-list li + li { margin-top: .5em; }
.check-list li::before { content: ""; position: absolute; left: .2em; top: .45em; width: .9em; height: .5em; border-left: 3px solid var(--orange); border-bottom: 3px solid var(--orange); transform: rotate(-45deg); }
.check-list strong { background: linear-gradient(transparent 60%, #ffe0c7 60%); }
.dot-list li { position: relative; padding-left: 1.1em; }
.dot-list li::before { content: ""; position: absolute; left: 0; top: .8em; width: 6px; height: 6px; border-radius: 50%; background: var(--red); }

/* 看板の種類 */
.type-index { display: grid; grid-template-columns: repeat(3, 1fr); gap: 10px; }
.type-index a { display: flex; align-items: center; gap: 10px; padding: 10px 14px; background: var(--white); border-radius: 6px; box-shadow: 2px 2px 6px rgba(0, 0, 0, .1); font-weight: 700; font-size: 14px; line-height: 1.4; color: var(--red); transition: transform .2s var(--ease); }
.type-index a:hover { transform: translateY(-2px); }
.type-index img { width: 56px; height: 40px; object-fit: contain; flex-shrink: 0; }
.type-list { padding-top: calc(var(--u) * 50); display: grid; gap: calc(var(--u) * 70); }
.type-item { display: grid; grid-template-columns: 44% 1fr; gap: calc(var(--u) * 48); align-items: start; scroll-margin-top: 30px; }
.type-item:nth-child(even) .type-item__img { order: 2; }
.type-item__img { position: relative; }
.type-item__img::before { content: ""; position: absolute; inset: 0; transform: translate(14px, 14px); background: repeating-linear-gradient(-45deg, rgba(213, 22, 24, .55) 0 1px, transparent 1px 7px); }
.type-item__img > * { position: relative; width: 100%; aspect-ratio: 800 / 576; object-fit: cover; }
.type-item__icon { display: grid; place-items: center; background: var(--white); box-shadow: 3px 3px 7px rgba(0, 0, 0, .12); }
.type-item__icon img { width: 55%; height: auto; }
.type-item__num { font-family: var(--thin); font-weight: 200; font-size: calc(var(--u) * 64); line-height: 1; color: var(--pink); }
.type-item__name { font-size: max(22px, calc(var(--u) * 26)); font-weight: 900; color: var(--red); line-height: 1.4; margin: 4px 0 12px; }
.type-item__lead { font-weight: 700; font-size: max(15px, calc(var(--u) * 13)); line-height: 1.8; margin-bottom: 10px; }
.type-item__text { line-height: 2; }
.type-item__use-label { margin-top: 16px; font-size: 12px; font-weight: 700; color: #777; }
.type-item__use { display: flex; flex-wrap: wrap; gap: 6px; margin: 6px 0 22px; }
.type-item__use li { font-size: 12px; line-height: 1; padding: .55em .9em; border-radius: 999px; background: var(--peach); color: var(--orange-d); font-weight: 700; }
.note-box { margin-top: calc(var(--u) * 30); padding: calc(var(--u) * 34) calc(var(--u) * 40); border: 3px solid var(--dark); background: var(--white); text-align: center; }
.note-box__ttl { font-size: max(17px, calc(var(--u) * 18)); font-weight: 900; margin-bottom: 10px; }

/* スピード見積り */
.est-hero { text-align: center; padding: calc(var(--u) * 40) 20px; background: var(--orange); color: #fff; border-radius: 8px; }
.est-hero__catch { font-style: italic; font-weight: 900; font-size: max(30px, calc(var(--u) * 44)); line-height: 1.2; transform: skewX(-8deg); }
.est-hero__catch span { display: block; font-size: .45em; margin-bottom: .3em; }
.est-hero__text { margin-top: 18px; font-weight: 700; line-height: 1.9; }
.est-hero__text small { font-size: 12px; opacity: .9; }
.steps { display: grid; grid-template-columns: repeat(3, 1fr); gap: 20px; counter-reset: none; }
.steps__item { position: relative; background: var(--white); border: 2px solid var(--dark); padding: 22px 20px 20px; }
.steps__item:not(:last-child)::after { content: ""; position: absolute; top: 50%; right: -17px; width: 12px; height: 24px; transform: translateY(-50%); background: var(--dark); clip-path: polygon(0 0, 100% 50%, 0 100%); }
.steps__num { display: inline-block; font-family: var(--cond); font-weight: 600; font-size: 14px; letter-spacing: .1em; color: #fff; background: var(--red); padding: 2px 10px; }
.steps__ttl { font-size: 18px; font-weight: 900; margin: 10px 0 6px; }
.steps p { line-height: 1.8; }
.tips { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; margin-top: calc(var(--u) * 40); }
.tips__col { background: var(--peach); padding: 24px 26px; border-radius: 8px; }
.tips__ttl { font-size: 17px; font-weight: 900; margin-bottom: 12px; color: var(--orange-d); }
.lower--form { background: var(--peach); margin-top: calc(var(--u) * 80); padding-block: calc(var(--u) * 70) calc(var(--u) * 90) !important; }

/* フォーム */
.form { background: var(--white); padding: calc(var(--u) * 44) calc(var(--u) * 50); border-radius: 8px; box-shadow: 0 2px 10px rgba(0, 0, 0, .06); }
.form__row { display: grid; grid-template-columns: 13em 1fr; gap: 8px 24px; align-items: start; padding: 16px 0; border-bottom: 1px solid var(--gray); margin: 0; border-left: 0; border-right: 0; border-top: 0; min-width: 0; }
.form__row > label, .form__label { font-weight: 700; line-height: 1.5; padding-top: .7em; }
.form__row em { display: inline-block; margin-left: .6em; font-style: normal; font-size: 11px; line-height: 1; color: #fff; background: var(--red); padding: .35em .5em; border-radius: 2px; vertical-align: .15em; }
.form__row small { display: block; font-size: 11px; font-weight: 500; color: #777; }
fieldset.form__row legend { float: left; }
.form input[type="text"], .form input[type="email"], .form input[type="tel"], .form input[type="number"], .form select, .form textarea { width: 100%; font: inherit; font-size: 16px; line-height: 1.6; padding: .6em .8em; border: 1px solid #cfcfcf; border-radius: 4px; background: #fafafa; color: var(--text); }
.form input:focus, .form select:focus, .form textarea:focus { outline: none; border-color: var(--orange); background: #fff; box-shadow: 0 0 0 3px rgba(245, 100, 0, .18); }
.form input[type="file"] { font-size: 14px; padding: .6em 0; }
.form__size { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.form__size label { display: flex; align-items: center; gap: 6px; font-weight: 700; }
.form__size input { width: 7em !important; }
.form__radios { display: flex; flex-wrap: wrap; gap: 8px 20px; padding-top: .6em; }
.form__radios label { display: flex; align-items: center; gap: 6px; cursor: pointer; }
.form__thumbs { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 8px; }
.form__thumbs img { width: 96px; height: 72px; object-fit: cover; border-radius: 4px; }
.form__thumbs-note { font-size: 12px; color: var(--red); align-self: center; }
.form__agree { text-align: center; margin-top: 28px; }
.form__agree a { color: var(--red); text-decoration: underline; }
.form__submit { text-align: center; margin-top: 18px; }
.form__submit .btn { border: 0; cursor: pointer; }
.form__submit .btn:hover { background: #ff7a1f; }
.form-notice { padding: 16px 20px; margin-bottom: 24px; border-radius: 6px; font-weight: 700; }
.form-notice--ok { background: #e8f6ec; color: #1d6b37; border: 2px solid #1d6b37; }
.form-notice--ng { background: #fdeceb; color: var(--red-d); border: 2px solid var(--red); }
.hp { position: absolute !important; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

/* お問い合わせ */
.contact-boxes { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.contact-box { display: grid; justify-items: center; align-content: start; gap: 14px; text-align: center; background: var(--white); border: 3px solid var(--dark); padding: 28px 20px; }
.contact-box--est { border-color: var(--orange); }
.contact-box__ttl { font-size: 17px; font-weight: 900; }
.contact-box p { line-height: 1.7; font-weight: 700; }

/* 開業・リニューアル */
.open-intro { padding-top: calc(var(--u) * 50); }
.open-intro__photos { position: relative; display: grid; grid-template-columns: 1.6fr 1fr; height: calc(var(--u) * 360); }
.open-intro__photos img { width: 100%; height: 100%; object-fit: cover; }
.open-intro__photos img:first-child { object-position: 55% 40%; }
.open-intro__photos img:nth-child(2) { object-position: 50% 20%; }
.open-intro__photos .open__script { left: 6%; bottom: calc(var(--u) * 24); }
.open-intro__text { margin-top: calc(var(--u) * 44); text-align: center; font-size: max(16px, calc(var(--u) * 15)); font-weight: 700; line-height: 2.1; }
.worry { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px; }
.worry li { position: relative; background: var(--white); border-radius: 8px; padding: 20px 18px 20px 52px; font-weight: 700; line-height: 1.6; box-shadow: 2px 2px 6px rgba(0, 0, 0, .08); }
.worry li::before { content: "?"; position: absolute; left: 16px; top: 50%; transform: translateY(-50%); display: grid; place-items: center; width: 26px; height: 26px; border-radius: 50%; background: var(--orange); color: #fff; font-family: var(--cond); font-size: 16px; }
.support { display: grid; grid-template-columns: 1fr 1fr; gap: 20px; }
.support__item { position: relative; background: var(--white); border-top: 6px solid var(--orange); padding: 24px 26px 26px; box-shadow: 2px 2px 8px rgba(0, 0, 0, .08); }
.support__num { position: absolute; right: 16px; top: 4px; font-family: var(--thin); font-weight: 200; font-size: 56px; line-height: 1; color: #fad5b8; }
.support__ttl { font-size: 19px; font-weight: 900; margin-bottom: 12px; color: var(--orange-d); }
.support__item p { line-height: 1.9; }
.open__tags--static { margin-bottom: 12px; }
.open__tags--static li { font-size: 13px; padding: 5px 14px; }
.timeline { position: relative; display: grid; gap: 16px; }
.timeline::before { content: ""; position: absolute; left: calc(9em + 11px); top: 10px; bottom: 10px; width: 3px; background: var(--peach); }
.timeline li { display: grid; grid-template-columns: 9em 1fr; gap: 30px; align-items: start; }
.timeline__when { position: relative; justify-self: end; font-weight: 900; color: #fff; background: var(--red); padding: .25em .8em; border-radius: 3px; white-space: nowrap; font-size: 14px; }
.timeline__when::after { content: ""; position: absolute; right: -24px; top: 50%; width: 14px; height: 14px; transform: translateY(-50%); border-radius: 50%; background: var(--orange); border: 3px solid var(--bg); }
.timeline h3 { font-size: 17px; font-weight: 900; line-height: 1.6; }
.timeline p { line-height: 1.8; }

/* 会社概要 */
.greeting { display: grid; grid-template-columns: 1fr 160px; gap: 30px; align-items: end; }
.greeting__body p { line-height: 2.1; }
.greeting__body p + p { margin-top: 1em; }
.greeting__dog { width: 160px; }
.info-table { width: 100%; border-collapse: collapse; background: var(--white); }
.info-table th, .info-table td { text-align: left; vertical-align: top; padding: 18px 20px; border-bottom: 1px solid var(--gray); line-height: 1.8; }
.info-table th { width: 10em; background: #f3f0ec; font-weight: 700; }
.info-table tr:first-child th, .info-table tr:first-child td { border-top: 3px solid var(--dark); }
.info-table a { color: var(--red); text-decoration: underline; }
.info-table--works { margin: 30px 0; }
.info-table--works .tag { margin-right: 6px; }
.access-map { aspect-ratio: 16 / 7; max-width: 100%; background: var(--ph); }
.access-map iframe { width: 100%; height: 100%; border: 0; }
.access-addr { margin-top: 10px; font-weight: 700; }

/* プライバシーポリシー */
.privacy h2 { font-size: 1.2em; margin-top: 2em; }
.privacy ul { list-style: disc; padding-left: 1.5em; }
.privacy__date { text-align: right; color: #777; }

/* 施工実績 詳細 */
.works-single .entry__title { margin-bottom: .8em; }
.works-single__img img { width: 100%; }
.post-nav { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 16px; margin-top: 60px; padding-top: 30px; border-top: 1px solid var(--gray); font-weight: 700; }
.post-nav__next { text-align: right; grid-column: 3; }
.post-nav a:not(.btn):hover { color: var(--red); }

@media (max-width: 768px) {
	.breadcrumb { width: calc(100% - var(--u) * 48); font-size: 11px; }
	.lower { padding-top: calc(var(--u) * 36); }
	.lower__lead { text-align: left; font-size: calc(var(--u) * 13.5); margin-bottom: calc(var(--u) * 28); }
	.lower-ttl { font-size: calc(var(--u) * 19); margin: calc(var(--u) * 50) 0 calc(var(--u) * 24); }
	.type-index { grid-template-columns: 1fr 1fr; gap: 8px; }
	.type-index a { font-size: 12px; padding: 8px; gap: 6px; }
	.type-index img { width: 40px; height: 30px; }
	.type-list { gap: calc(var(--u) * 50); padding-top: calc(var(--u) * 36); }
	.type-item { grid-template-columns: 1fr; gap: 20px; }
	.type-item:nth-child(even) .type-item__img { order: 0; }
	.type-item__img::before { transform: translate(8px, 8px); }
	.type-item__num { font-size: calc(var(--u) * 44); }
	.type-item .btn { width: 100%; }
	.steps, .tips, .contact-boxes, .worry, .support { grid-template-columns: 1fr; }
	.steps { gap: 26px; }
	.steps__item:not(:last-child)::after { top: auto; bottom: -21px; right: 50%; width: 24px; height: 12px; transform: translateX(50%); clip-path: polygon(0 0, 100% 0, 50% 100%); }
	.form { padding: 20px 16px; }
	.form__row { grid-template-columns: 1fr; gap: 6px; padding: 14px 0; }
	.form__row > label, .form__label { padding-top: 0; }
	.form__radios { flex-direction: column; gap: 10px; padding-top: 4px; }
	.btn--big { width: 100%; }
	.open-intro__photos { height: calc(var(--u) * 200); }
	.open-intro__text { text-align: left; font-size: calc(var(--u) * 14); }
	.timeline::before { left: 7px; }
	.timeline li { grid-template-columns: 1fr; gap: 6px; padding-left: 28px; position: relative; }
	.timeline__when { justify-self: start; }
	.timeline__when::after { right: auto; left: -28px; }
	.greeting { grid-template-columns: 1fr; }
	.greeting__dog { width: 110px; justify-self: end; }
	.info-table th, .info-table td { display: block; width: 100%; padding: 10px 12px; }
	.info-table th { border-bottom: 0; }
	.info-table tr:first-child td { border-top: 0; }
	.access-map { aspect-ratio: 4 / 3; }
	.post-nav { grid-template-columns: 1fr 1fr; }
	.post-nav .btn { grid-column: 1 / -1; grid-row: 2; width: 100%; }
}
.contact-box .freedial { max-width: 100%; }
.contact-box .freedial__num { font-size: clamp(28px, calc(var(--u) * 34), 44px); white-space: nowrap; }
.contact-box .freedial__icon { width: clamp(44px, calc(var(--u) * 50), 62px); }
.page-head__ttl::before, .page-head__ttl::after { content: ""; position: absolute; z-index: -1; top: calc(var(--u) * -12); bottom: calc(var(--u) * -30); width: calc(var(--u) * 4); min-width: 3px; background: var(--dark); }
.page-head__ttl { z-index: 1; }
.page-head__ttl::before { left: calc(var(--u) * 22); }
.page-head__ttl::after { right: calc(var(--u) * 22); }
.page-head { padding-bottom: calc(var(--u) * 70); }
@media (max-width: 768px) {
	.page-head__ttl::before, .page-head__ttl::after { width: 2px; min-width: 2px; top: -8px; bottom: -16px; }
	.page-head { padding-bottom: calc(var(--u) * 36); }
}

/* ---------- ヘッダー高さ 2/3 調整（PC） ---------- */
@media (min-width: 769px) {
	.header__inner { height: calc(var(--u) * 78); }
	.header__logo img { width: calc(var(--u) * 280); }
	.header__contact { gap: calc(var(--u) * 22); padding-top: calc(var(--u) * 16); }
	.freedial--header .freedial__icon { width: calc(var(--u) * 44); }
	.freedial--header .freedial__num { font-size: calc(var(--u) * 31); }
	.freedial--header .freedial__top { padding-left: calc(var(--u) * 50); margin-bottom: calc(var(--u) * 2); }
	.freedial--header .freedial__hours, .freedial--header .freedial__kana { font-size: max(10px, calc(var(--u) * 9)); }
	.header__contact .cta-sign { width: calc(var(--u) * 170); height: calc(var(--u) * 44); font-size: max(12px, calc(var(--u) * 14)); }
	.header__contact .cta-sign::before, .header__contact .cta-sign::after { height: calc(var(--u) * 16); }
	.header__contact .cta-sign::before { left: calc(var(--u) * 30); }
	.header__contact .cta-sign::after { right: calc(var(--u) * 30); }
	.gnav__list li a { height: calc(var(--u) * 30); min-height: 32px; font-size: max(12px, calc(var(--u) * 10.5)); }
}

/* ---------- 表示チェック後の修正 ---------- */
p, li, dd, td { text-wrap: pretty; }
.note-box__ttl, .type-item__name, .worry li { text-wrap: balance; }
.greeting .lower-ttl { margin-top: 0; }
.open-intro__photos { grid-template-rows: 100%; overflow: hidden; }
.open-intro__photos img { min-height: 0; }
.post-nav .btn { grid-column: 2; grid-row: 1; }
.post-nav__prev { grid-column: 1; grid-row: 1; }
.post-nav__next { grid-column: 3; grid-row: 1; }
.contact-boxes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.contact-box { min-width: 0; }
.page-head__en { white-space: nowrap; }
@media (max-width: 768px) {
	.contact-boxes { grid-template-columns: minmax(0, 1fr); }
	.contact-box { padding: 22px 12px; }
	.contact-box .freedial__num { font-size: calc(var(--u) * 30); }
	.contact-box .freedial__icon { width: calc(var(--u) * 40); }
	.page-head__en--long { font-size: calc(var(--u) * 30); }
	.page-head__en--xlong { font-size: calc(var(--u) * 22); }
	.page-head__en--long + .page-head__ttl, .page-head__en--xlong + .page-head__ttl { margin-top: calc(var(--u) * -12); }
	.footer__cta::before, .footer__cta::after { display: none; }
	.cta-sign--footer { margin-bottom: 0; }
	.post-nav { grid-template-columns: 1fr 1fr; }
	.post-nav .btn { grid-column: 1 / -1; grid-row: 2; }
	.post-nav__prev { grid-column: 1; grid-row: 1; }
	.post-nav__next { grid-column: 2; grid-row: 1; }
	.form__size input { width: 6em !important; }
}
.type-item { grid-template-columns: 44% minmax(0, 1fr); }
.type-item__body { min-width: 0; }
.type-item .btn { max-width: 100%; white-space: normal; }
@media (max-width: 768px) { .type-item { grid-template-columns: minmax(0, 1fr); } }
@media (max-width: 768px) {
	.est-hero__catch { font-size: calc(var(--u) * 34); white-space: nowrap; }
	.est-hero__text { text-align: left; }
}

/* 選ばれる理由：番号をカード内に収める */
.reason__item, .reason__item--even { padding-bottom: calc(var(--u) * 190); }
.reason__num { bottom: calc(var(--u) * 26); line-height: 1; }
.reason__item--odd .reason__num { left: calc(var(--u) * 40); }
.reason__item--even .reason__num { right: calc(var(--u) * 40); }
@media (max-width: 768px) {
	.reason__item, .reason__item--even { padding-bottom: calc(var(--u) * 96); }
	.reason__num, .reason__item--odd .reason__num, .reason__item--even .reason__num { bottom: calc(var(--u) * 10); right: calc(var(--u) * 16); left: auto; }
}

/* 開業・リニューアル帯：内容量に応じて高さを伸ばす */
@media (min-width: 769px) {
	.open { height: auto; min-height: calc(var(--u) * 416); padding-bottom: calc(var(--u) * 44); }
}

/* 選ばれる理由：番号サイズと余白の調整 */
.reason__item, .reason__item--even { min-height: 0; padding-bottom: calc(var(--u) * 116); }
.reason__num { font-size: calc(var(--u) * 140); bottom: calc(var(--u) * 22); }
.reason__item--odd .reason__num { left: calc(var(--u) * 128); }
.reason__item--even .reason__num { right: calc(var(--u) * 128); }
@media (max-width: 1100px) and (min-width: 769px) {
	.reason__item, .reason__item--even { grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: calc(var(--u) * 40); padding: calc(var(--u) * 56) calc(var(--u) * 56) calc(var(--u) * 116); }
	.reason__item--odd { margin-left: calc(var(--u) * 60); }
	.reason__item--even { margin-right: calc(var(--u) * 60); }
	.reason__item--odd .reason__num { left: calc(var(--u) * 56); }
	.reason__item--even .reason__num { right: calc(var(--u) * 56); }
}
@media (max-width: 768px) {
	.reason__item, .reason__item--even { padding-bottom: calc(var(--u) * 64); }
	.reason__num, .reason__item--odd .reason__num, .reason__item--even .reason__num { font-size: calc(var(--u) * 60); bottom: calc(var(--u) * 8); right: calc(var(--u) * 16); left: auto; }
}
@media (max-width: 1100px) and (min-width: 769px) {
	.reason__num { font-size: calc(var(--u) * 96); bottom: calc(var(--u) * 20); }
	.reason__item, .reason__item--even { padding-bottom: calc(var(--u) * 124); }
}

/* =========================================================
   エリア別ページ
   ========================================================= */
.area__cities a { text-decoration: underline; text-decoration-color: rgba(213, 22, 24, .35); text-underline-offset: 3px; transition: color .2s; }
.area__cities a:hover { color: var(--red); }
.area__more { margin-top: calc(var(--u) * 30); }
.area-index { display: grid; grid-template-columns: minmax(0, 300px) minmax(0, 1fr); gap: 40px; align-items: start; }
.area-index__pref + .area-index__pref { margin-top: 36px; }
.area-links { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 14px; }
.area-links a { display: block; padding: .5em 1em; border: 1px solid #d8d2cb; background: var(--white); border-radius: 4px; font-weight: 700; font-size: 14px; line-height: 1.4; transition: border-color .2s, color .2s, background .2s; }
.area-links a::after { content: "›"; margin-left: .5em; color: var(--red); }
.area-links a:hover { border-color: var(--red); color: var(--red); }
.area-links a.is-all { background: var(--dark); color: #fff; border-color: var(--dark); }
.area-links a.is-all::after { color: #fff; }
.area-links--center { justify-content: center; }
.area-page__pref { display: inline-block; font-size: 13px; font-weight: 700; color: #fff; background: var(--red); padding: .3em .9em; line-height: 1.4; }
.area-page__catch { font-size: max(22px, calc(var(--u) * 26)); font-weight: 900; line-height: 1.5; margin: 14px 0 18px; text-wrap: balance; }
.area-page__intro { font-size: max(15px, calc(var(--u) * 12.5)); line-height: 2.1; }
.area-points { display: grid; gap: 14px; }
.area-points li { display: grid; grid-template-columns: 7.5em minmax(0, 1fr); gap: 18px; align-items: center; background: var(--white); border-left: 5px solid var(--orange); padding: 18px 22px; box-shadow: 2px 2px 8px rgba(0, 0, 0, .06); }
.area-points__num { font-family: var(--cond); font-weight: 600; font-size: 16px; letter-spacing: .08em; color: var(--orange-d); }
.area-points p { line-height: 1.9; }
.area-types { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.area-types a { display: flex; flex-direction: column; align-items: center; gap: 10px; padding: 22px 12px 18px; background: var(--white); border-radius: 6px; box-shadow: 3px 3px 7px rgba(0, 0, 0, .12); font-weight: 700; color: var(--red); text-align: center; transition: transform .25s var(--ease); }
.area-types a:hover { transform: translateY(-3px); }
.area-types img { width: 110px; height: 70px; object-fit: contain; }
.area-page__empty { text-align: center; background: var(--white); padding: 34px 20px; border: 1px dashed #cfc8c0; line-height: 1.9; }
.area-cta { text-align: center; background: var(--peach); border-radius: 8px; padding: 36px 24px; display: grid; gap: 14px; justify-items: center; }
.area-cta__ttl { font-size: max(18px, calc(var(--u) * 20)); font-weight: 900; }
@media (max-width: 768px) {
	.area-index { grid-template-columns: minmax(0, 1fr); gap: 24px; }
	.area-index__map { width: 220px; margin: 0 auto; }
	.area-links a { font-size: 13px; padding: .45em .8em; }
	.area-page__catch { font-size: calc(var(--u) * 20); }
	.area-page__intro { font-size: calc(var(--u) * 14); }
	.area-points li { grid-template-columns: minmax(0, 1fr); gap: 4px; padding: 14px 16px; }
	.area-types { grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 8px; }
	.area-types a { padding: 14px 6px; font-size: 12px; }
	.area-types img { width: 64px; height: 42px; }
	.area__more { width: 100%; }
}
@media (max-width: 768px) { .area-cta .btn { font-size: calc(var(--u) * 15); white-space: nowrap; padding-inline: 1em; } }

/* エリアページ：イラスト・FAQ・カード */
.area-hero { margin-top: calc(var(--u) * 36); }
.area-hero img { width: 100%; height: auto; aspect-ratio: 5 / 2; object-fit: cover; border-radius: 10px; box-shadow: 0 4px 16px rgba(0, 0, 0, .08); }
.area-hero + .lower { padding-top: calc(var(--u) * 40); }
.faq { display: grid; gap: 10px; }
.faq__item { background: var(--white); border: 1px solid #e3ddd6; border-radius: 6px; }
.faq__q { position: relative; display: flex; align-items: center; gap: 14px; padding: 16px 48px 16px 18px; font-weight: 700; line-height: 1.6; cursor: pointer; list-style: none; }
.faq__q::-webkit-details-marker { display: none; }
.faq__q::after { content: ""; position: absolute; right: 20px; top: 50%; width: 10px; height: 10px; border-right: 2px solid var(--dark); border-bottom: 2px solid var(--dark); transform: translateY(-70%) rotate(45deg); transition: transform .2s; }
.faq__item[open] .faq__q::after { transform: translateY(-30%) rotate(-135deg); }
.faq__mark { flex-shrink: 0; display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: var(--red); color: #fff; font-family: var(--cond); font-size: 16px; }
.faq__mark--a { background: var(--orange); }
.faq__a { display: flex; gap: 14px; padding: 0 20px 18px 18px; }
.faq__a p { line-height: 1.9; padding-top: 2px; }
.area-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; margin-top: 16px; }
.area-cards a { display: block; background: var(--white); border-radius: 6px; overflow: hidden; box-shadow: 2px 2px 8px rgba(0, 0, 0, .1); transition: transform .25s var(--ease), box-shadow .25s; }
.area-cards a:hover { transform: translateY(-3px); box-shadow: 4px 8px 16px rgba(0, 0, 0, .12); }
.area-cards img { width: 100%; aspect-ratio: 5 / 2; object-fit: cover; object-position: 20% 50%; }
.area-cards span { display: block; padding: 10px 12px; font-weight: 700; line-height: 1.4; }
.area-cards span::after { content: "›"; margin-left: .4em; color: var(--red); }
@media (max-width: 1100px) { .area-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 768px) {
	.area-hero { margin-top: calc(var(--u) * 20); width: 100%; }
	.area-hero img { border-radius: 0; }
	.area-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
	.area-cards span { font-size: 13px; padding: 8px 10px; }
	.faq__q { padding: 14px 40px 14px 12px; gap: 10px; font-size: 14px; }
	.faq__a { padding: 0 14px 14px 12px; gap: 10px; }
	.faq__mark { width: 26px; height: 26px; font-size: 14px; }
}
.faq + .area-cta { margin-top: calc(var(--u) * 44); }
.lower--end { padding-bottom: calc(var(--u) * 90); }
@media (max-width: 768px) { .lower--end { padding-bottom: calc(var(--u) * 56); } }

/* 施工事例グリッド：横並びは最大5件（カードサイズは維持） */
.works-grid { grid-template-columns: repeat(auto-fill, minmax(260px, 1fr)); max-width: calc(265px * 5 + 32px * 4); margin-inline: auto; }

/* =========================================================
   費用相場
   ========================================================= */
.price-summary { background: var(--white); border: 3px solid var(--dark); border-radius: 8px; padding: 28px 30px 22px; }
.price-summary__ttl { font-weight: 900; font-size: max(17px, calc(var(--u) * 17)); text-align: center; margin-bottom: 18px; }
.price-bars { display: grid; gap: 10px; }
.price-bars li { display: grid; grid-template-columns: 15em minmax(0, 1fr) 7.5em; gap: 14px; align-items: center; }
.price-bars__name { font-weight: 700; font-size: 14px; line-height: 1.4; }
.price-bars__bar { height: 18px; background: #f3ede6; border-radius: 9px; overflow: hidden; }
.price-bars__bar span { display: block; height: 100%; background: linear-gradient(90deg, var(--orange), var(--red)); border-radius: 9px; }
.price-bars__val { font-family: var(--cond); font-weight: 600; font-size: 24px; color: var(--red); text-align: right; line-height: 1; font-variant-numeric: tabular-nums; }
.price-bars__val small { font-family: var(--font); font-size: 12px; color: var(--dark); margin-left: 2px; }
.price-summary__note { margin-top: 16px; padding-top: 14px; border-top: 1px dashed #d8d2cb; font-size: 13px; text-align: center; }
.price-summary__note strong { color: var(--red); }
.price-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 14px; }
.price-card { display: flex; flex-direction: column; align-items: center; text-align: center; background: var(--white); border-radius: 8px; box-shadow: 2px 2px 8px rgba(0, 0, 0, .1); padding: 20px 14px 16px; }
.price-card img { width: 96px; height: 60px; object-fit: contain; }
.price-card__name { font-size: 15px; font-weight: 900; line-height: 1.4; margin: 10px 0 6px; min-height: 2.8em; display: grid; place-items: center; }
.price-card__price { font-family: var(--cond); font-weight: 600; font-size: 34px; color: var(--red); line-height: 1.1; font-variant-numeric: tabular-nums; }
.price-card__price span { font-family: var(--font); font-size: 13px; font-weight: 700; color: var(--dark); margin-left: 2px; }
.price-card__price em { display: block; font-style: normal; font-family: var(--font); font-size: 11px; color: #777; font-weight: 500; }
.price-card__spec { margin: 12px 0 12px; font-size: 12px; line-height: 1.6; text-align: left; width: 100%; display: grid; grid-template-columns: auto 1fr; gap: 4px 8px; }
.price-card__spec dt { font-weight: 700; color: var(--orange-d); white-space: nowrap; }
.price-card__spec dd { margin: 0; }
.price-card__link { margin-top: auto; font-size: 12px; font-weight: 700; color: var(--red); text-decoration: underline; text-underline-offset: 3px; }
.cost-flow { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 12px; }
.cost-flow li { position: relative; background: var(--white); border: 2px solid #e3ddd6; border-radius: 8px; padding: 22px 16px 16px; }
.cost-flow li.is-main { border-color: var(--red); }
.cost-flow__num { position: absolute; top: -14px; left: 16px; display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; background: var(--dark); color: #fff; font-family: var(--cond); font-size: 15px; }
.cost-flow li.is-main .cost-flow__num { background: var(--red); }
.cost-flow h3 { font-size: 16px; font-weight: 900; margin-bottom: 6px; }
.cost-flow p { font-size: 13px; line-height: 1.8; }
.tips-list { display: grid; gap: 10px; }
.tips-list li { display: grid; grid-template-columns: 14em minmax(0, 1fr); gap: 16px; align-items: center; background: var(--white); border-left: 5px solid var(--orange); padding: 16px 20px; }
.tips-list strong { font-weight: 900; color: var(--orange-d); }
.price-cta { margin-top: calc(var(--u) * 56); }

/* =========================================================
   看板の点検
   ========================================================= */
.insp-hero { text-align: center; background: var(--dark); color: #fff; border-radius: 8px; padding: 34px 24px; }
.insp-hero__label { display: inline-block; font-size: 13px; font-weight: 700; background: var(--red); padding: .3em 1em; border-radius: 999px; }
.insp-hero__catch { font-size: max(26px, calc(var(--u) * 34)); font-weight: 900; margin: 14px 0; line-height: 1.4; }
.insp-hero__catch span { color: #ffd766; }
.insp-hero__text { line-height: 2; font-size: 14px; }
.insp-changes { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.insp-changes li { background: var(--white); border-top: 6px solid var(--red); padding: 20px 18px; box-shadow: 2px 2px 8px rgba(0, 0, 0, .08); }
.insp-changes__num { font-family: var(--cond); font-weight: 600; font-size: 28px; color: var(--red); line-height: 1; }
.insp-changes h3 { font-size: 16px; font-weight: 900; margin: 8px 0; line-height: 1.5; }
.insp-changes p { font-size: 13.5px; line-height: 1.8; }
.insp-signs { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 10px; }
.insp-signs li { position: relative; background: var(--white); border: 2px solid #f2c9c9; border-radius: 6px; padding: 14px 14px 14px 44px; line-height: 1.6; font-size: 14px; }
.insp-signs li::before { content: "!"; position: absolute; left: 12px; top: 50%; transform: translateY(-50%); display: grid; place-items: center; width: 22px; height: 22px; border-radius: 50%; background: var(--red); color: #fff; font-weight: 900; font-size: 13px; }
.insp-signs strong { color: var(--red); }
.insp-warn { margin-top: 16px; background: #fff4e5; border: 1px solid #f5c89a; padding: 14px 18px; border-radius: 6px; line-height: 1.8; font-size: 14px; }
.insp-items { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; }
.insp-items div { background: var(--white); padding: 18px 20px; border-radius: 6px; box-shadow: 2px 2px 8px rgba(0, 0, 0, .06); }
.insp-items h3 { font-size: 16px; font-weight: 900; color: var(--orange-d); margin-bottom: 6px; }
.insp-items p { font-size: 13.5px; line-height: 1.8; }
.insp-src { margin-top: 30px; font-size: 12px; color: #777; line-height: 1.8; }
.insp-src a { color: var(--dark); text-decoration: underline; }

/* 代表あいさつ */
.greeting { grid-template-columns: minmax(0, 1fr) 220px; align-items: start; }
.greeting__photo { margin: 0; }
.greeting__photo img, .greeting__photo .ph { width: 100%; aspect-ratio: 3 / 4; object-fit: cover; border-radius: 6px; }
.greeting__photo figcaption { margin-top: 8px; text-align: center; font-size: 13px; line-height: 1.6; }
.greeting__photo figcaption strong { display: block; font-size: 17px; font-weight: 900; }

@media (max-width: 1100px) {
	.price-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); }
	.cost-flow { grid-template-columns: repeat(2, minmax(0, 1fr)); row-gap: 24px; }
}
@media (max-width: 768px) {
	.price-summary { padding: 20px 14px 16px; }
	.price-bars li { grid-template-columns: minmax(0, 1fr) auto; gap: 4px 10px; }
	.price-bars__name { grid-column: 1 / -1; font-size: 13px; }
	.price-bars__val { font-size: 20px; }
	.price-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
	.price-card { padding: 16px 10px 14px; }
	.price-card__name { font-size: 13px; }
	.price-card__price { font-size: 28px; }
	.cost-flow { grid-template-columns: minmax(0, 1fr); }
	.tips-list li { grid-template-columns: minmax(0, 1fr); gap: 4px; }
	.insp-changes, .insp-signs, .insp-items { grid-template-columns: minmax(0, 1fr); }
	.insp-hero__text { text-align: left; }
	.greeting { grid-template-columns: minmax(0, 1fr); }
	.greeting__photo { width: 180px; margin: 0 auto; }
}
/* 料金カード：横長2列 */
.price-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.price-card { display: grid; grid-template-columns: 88px minmax(0, 1fr); grid-template-areas: "img name" "img price" "spec spec" "link link"; column-gap: 16px; align-items: center; text-align: left; padding: 18px 20px 14px; }
.price-card img { grid-area: img; width: 88px; height: 64px; }
.price-card__name { grid-area: name; margin: 0; min-height: 0; display: block; font-size: 15px; }
.price-card__price { grid-area: price; font-size: 32px; }
.price-card__price em { display: inline; margin-left: 6px; }
.price-card__spec { grid-area: spec; margin: 12px 0 8px; padding-top: 10px; border-top: 1px dashed #e3ddd6; }
.price-card__link { grid-area: link; justify-self: end; }
@media (max-width: 1100px) { .price-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 768px) {
	.price-cards { grid-template-columns: minmax(0, 1fr); }
	.price-card { grid-template-columns: 64px minmax(0, 1fr); padding: 14px; column-gap: 12px; }
	.price-card img { width: 64px; height: 48px; }
	.price-card__price { font-size: 28px; }
}

/* =========================================================
   レイアウト再調整（コンテンツ増加に合わせて）
   ========================================================= */
/* ヘッダーナビ：8項目を均等配置 */
@media (min-width: 769px) {
	.gnav__list { max-width: calc(var(--u) * 1180); margin-inline: auto; }
	.gnav__list li { flex: 1 1 0; }
	.gnav__list li a { width: auto; padding: 0 .6em; white-space: nowrap; letter-spacing: .06em; }
	.header__contact .cta-sign { white-space: nowrap; }
}
@media (max-width: 1100px) and (min-width: 769px) {
	.gnav__list li a { font-size: 12px; letter-spacing: .02em; padding: 0 .3em; }
	.header__contact { gap: 14px; }
	.freedial--header .freedial__num { font-size: 26px; }
	.freedial--header .freedial__icon { width: 36px; }
	.freedial--header .freedial__top { padding-left: 42px; }
	.header__contact .cta-sign { width: auto; padding: 0 1.2em; font-size: 13px; height: 38px; }
}

/* 下層ページの本文幅を広げる */
@media (min-width: 769px) {
	.lower.container--narrow, .lower .container--narrow, .page-body.container--narrow { width: min(92%, 1000px); }
	.lower__lead { max-width: 46em; margin-inline: auto; }
}

/* フッター：サイトマップ型 */
.footer__bottom { align-items: flex-start; gap: 60px; }
.footer__info { flex: 0 0 auto; }
.footer__name { white-space: nowrap; }
.footer__sitemap { display: grid; grid-template-columns: repeat(3, auto); gap: 0 calc(var(--u) * 56); }
.footer__group-ttl { font-size: 12px; font-weight: 900; color: var(--red); letter-spacing: .1em; margin-bottom: 8px; padding-bottom: 6px; border-bottom: 2px solid var(--dark); }
.footer__group li a { display: block; font-size: 13px; font-weight: 700; line-height: 2.2; white-space: nowrap; transition: color .2s; }
.footer__group li a::before { content: "›"; margin-right: .5em; color: var(--red); }
.footer__group li a:hover { color: var(--red); }
@media (max-width: 1100px) and (min-width: 769px) {
	.footer__bottom { flex-direction: column; gap: 30px; }
	.footer__top { gap: 16px; }
}
@media (max-width: 768px) {
	.footer__nav { display: block; width: 100%; }
	.footer__sitemap { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 20px 16px; text-align: left; margin-top: 8px; }
	.footer__group:last-child { grid-column: 1 / -1; }
	.footer__group li a { font-size: 13px; line-height: 2.1; }
	.footer__name { white-space: normal; }
}

/* =========================================================
   トップ：お役立ち情報
   ========================================================= */
.guide { padding-bottom: calc(var(--u) * 100); }
.guide__cards { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: calc(var(--u) * 32); width: min(92%, calc(var(--u) * 1000)); margin-inline: auto; }
.guide-card { position: relative; display: flex; flex-direction: column; padding: calc(var(--u) * 36) calc(var(--u) * 40) calc(var(--u) * 30); border-radius: 12px; overflow: hidden; transition: transform .3s var(--ease), box-shadow .3s; }
.guide-card:hover { transform: translateY(-4px); box-shadow: 0 12px 28px rgba(0, 0, 0, .12); }
.guide-card--price { background: var(--peach); }
.guide-card--insp { background: var(--dark); color: #fff; }
.guide-card__label { font-family: var(--slab); font-size: calc(var(--u) * 44); line-height: 1; color: #f9c79f; position: absolute; right: calc(var(--u) * 24); top: calc(var(--u) * 20); opacity: .8; }
.guide-card--insp .guide-card__label { color: rgba(255, 255, 255, .12); opacity: 1; }
.guide-card__ttl { position: relative; font-size: max(20px, calc(var(--u) * 24)); font-weight: 900; line-height: 1.4; }
.guide-card__ttl::after { content: ""; display: block; width: 40px; height: 4px; margin-top: 10px; background: var(--red); }
.guide-card--insp .guide-card__ttl::after { background: #ffd766; }
.guide-card__text { position: relative; margin: 14px 0 18px; font-size: max(14px, calc(var(--u) * 12)); line-height: 1.9; }
.guide-card__prices { display: grid; gap: 8px; margin-bottom: 22px; }
.guide-card__prices li { display: flex; justify-content: space-between; align-items: baseline; background: var(--white); border-radius: 6px; padding: 10px 16px; font-weight: 700; font-size: 14px; }
.guide-card__prices b { font-family: var(--cond); font-weight: 600; font-size: 26px; color: var(--red); line-height: 1; font-variant-numeric: tabular-nums; }
.guide-card__prices small { font-family: var(--font); font-size: 12px; color: var(--dark); margin-left: 2px; }
.guide-card__checks { display: grid; gap: 8px; margin-bottom: 22px; }
.guide-card__checks li { position: relative; background: rgba(255, 255, 255, .08); border: 1px solid rgba(255, 255, 255, .18); border-radius: 6px; padding: 12px 16px 12px 44px; font-size: 14px; font-weight: 700; }
.guide-card__checks li::before { content: "!"; position: absolute; left: 14px; top: 50%; transform: translateY(-50%); display: grid; place-items: center; width: 20px; height: 20px; border-radius: 50%; background: var(--red); font-size: 12px; font-weight: 900; }
.guide-card__more { margin-top: auto; align-self: flex-start; display: inline-flex; align-items: center; gap: .8em; font-weight: 900; font-size: 14px; padding: .8em 1.6em; border-radius: 999px; background: var(--red); color: #fff; }
.guide-card--insp .guide-card__more { background: #ffd766; color: var(--dark); }
.guide-card__more::after { content: "→"; transition: transform .25s var(--ease); }
.guide-card:hover .guide-card__more::after { transform: translateX(4px); }
@media (max-width: 768px) {
	.guide { padding-bottom: calc(var(--u) * 56); }
	.guide__cards { grid-template-columns: minmax(0, 1fr); gap: 16px; width: calc(100% - var(--u) * 32); }
	.guide-card { padding: 26px 20px 22px; }
	.guide-card__label { font-size: 28px; right: 14px; top: 14px; }
	.guide-card__more { align-self: stretch; justify-content: center; }
}
.works + .guide { padding-top: calc(var(--u) * 20); }
@media (min-width: 769px) {
	.type-list.container--narrow { width: min(92%, 1000px); }
	.type-item { grid-template-columns: 42% minmax(0, 1fr); }
}

/* 電柱看板・専門家紹介 */
.type-item__price { margin-top: 12px; display: inline-block; background: #fff4e5; border: 1px solid #f5c89a; color: var(--orange-d); font-weight: 900; font-size: 14px; padding: .5em 1em; border-radius: 4px; }
.price-card__pre { font-family: var(--font); font-size: 14px; font-weight: 700; color: var(--dark); margin-right: 2px; }
.partner-tags { display: flex; flex-wrap: wrap; gap: 6px; margin-bottom: 12px; }
.partner-tags li { font-size: 12px; font-weight: 700; line-height: 1; padding: .55em .9em; border-radius: 999px; background: var(--peach); color: var(--orange-d); }
/* トップの看板の種類：10種を5列×2段 */
@media (min-width: 769px) {
	.products .container--narrow { width: min(92%, calc(var(--u) * 1000)); }
	.products__list { grid-template-columns: repeat(5, minmax(0, 1fr)); gap: calc(var(--u) * 18); }
	.products__item a { height: calc(var(--u) * 150); }
	.products__item img { width: calc(var(--u) * 130); height: calc(var(--u) * 84); }
	.products__name { font-size: max(13px, calc(var(--u) * 14)); }
}
.price-card--wide { grid-column: 1 / -1; border: 2px solid var(--orange); }
@media (min-width: 769px) { .price-card--wide { grid-template-columns: 88px minmax(0, 1fr) minmax(0, 1.2fr); grid-template-areas: "img name spec" "img price spec" "link link link"; } .price-card--wide .price-card__spec { margin: 0; padding: 0 0 0 16px; border-top: 0; border-left: 1px dashed #e3ddd6; } }

/* =========================================================
   看板お役立ちコラム
   ========================================================= */
.columns { padding-bottom: calc(var(--u) * 100); }
.guide + .columns { padding-top: 0; }
.column-card { width: calc(var(--u) * 300); flex-shrink: 0; }
.column-card a { display: block; background: var(--white); border-radius: 8px; overflow: hidden; box-shadow: 2px 2px 8px rgba(0, 0, 0, .08); height: 100%; transition: box-shadow .25s; }
.column-card a:hover { box-shadow: 4px 8px 18px rgba(0, 0, 0, .12); }
.column-card__img { position: relative; aspect-ratio: 16 / 10; overflow: hidden; background: var(--ph); }
.column-card__img img, .column-card__img .ph { width: 100%; height: 100%; object-fit: cover; transition: transform .5s var(--ease); }
.column-card a:hover .column-card__img img { transform: scale(1.05); }
.column-card__cat { position: absolute; left: 10px; top: 10px; font-size: 11px; font-weight: 700; line-height: 1; color: #fff; background: var(--orange); padding: .5em .8em; border-radius: 3px; }
.column-card__date { display: block; padding: 12px 16px 0; font-size: 12px; color: #777; }
.column-card__title { padding: 4px 16px 18px; font-size: max(14px, calc(var(--u) * 13)); font-weight: 700; line-height: 1.6; display: -webkit-box; -webkit-line-clamp: 3; -webkit-box-orient: vertical; overflow: hidden; }
.columns .works__track { align-items: stretch; }
.column-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(280px, 1fr)); gap: 32px 28px; max-width: calc(300px * 4 + 28px * 3); margin-inline: auto; }
.column-grid .column-card { width: auto; }
.column-single__meta { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; font-size: 13px; color: #777; }
.column-single__img { margin: 0 0 2em; }
.column-single__img img { width: 100%; border-radius: 8px; }
.column-single__cta { margin-top: 50px; text-align: center; background: var(--peach); border-radius: 8px; padding: 30px 20px; }
.column-single__cta-ttl { font-size: 18px; font-weight: 900; margin-bottom: 8px; }
.column-single__cta-btns { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; margin-top: 16px; }
.column-single__cta-btns .btn--orange { border: 0; }
/* よくある質問 */
.faq-index { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; }
.faq-index a { display: block; padding: .7em 1.4em; border: 2px solid var(--dark); border-radius: 999px; font-weight: 700; font-size: 14px; line-height: 1; transition: background .2s, color .2s; }
.faq-index a:hover { background: var(--dark); color: #fff; }
.faq-index + .lower-ttl { margin-top: calc(var(--u) * 50); }
.lower-ttl[id] { scroll-margin-top: 20px; }
@media (max-width: 768px) {
	.columns { padding-bottom: calc(var(--u) * 56); }
	.columns .works-card:nth-child(n+4), .columns .column-card:nth-child(n+4) { display: none; }
	.columns .works__track { padding: 0 calc(var(--u) * 24); }
	.column-card { width: 100%; }
	.column-grid { grid-template-columns: minmax(0, 1fr); gap: 20px; }
	.faq-index a { font-size: 13px; padding: .6em 1em; }
}
@media (min-width: 769px) and (max-width: 1100px) {
	.gnav__list li a { font-size: 11px; letter-spacing: 0; }
}
/* 各ページ最後のコンテンツと下の帯（お問い合わせ・フッター）の間に余白 */
.lower:not(.lower--form):not(:has(~ .lower)) { padding-bottom: calc(var(--u) * 90); }
@media (max-width: 768px) { .lower:not(.lower--form):not(:has(~ .lower)) { padding-bottom: calc(var(--u) * 56); } }
/* 施工事例：横並び最大4件／絞り込みタグは2段 */
.works-grid { max-width: calc(265px * 4 + 32px * 3); }
.term-filter { max-width: calc(265px * 4 + 32px * 3); margin-inline: auto; }
@media (min-width: 1200px) { .term-filter { max-width: 900px; } }

/* =========================================================
   看板の種類（トップ）：11種を4列で中央寄せ
   ========================================================= */
@media (min-width: 769px) {
	.products .container--narrow { width: min(92%, calc(var(--u) * 900)); }
	.products__list { display: flex; flex-wrap: wrap; justify-content: center; gap: calc(var(--u) * 18); }
	.products__item { flex: 0 0 calc((100% - var(--u) * 54) / 4); }
}
.products .btn-wrap { display: flex; flex-wrap: wrap; justify-content: center; gap: 12px; }

/* =========================================================
   業種から探す
   ========================================================= */
.industry-cards { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; }
.industry-cards a { display: flex; flex-direction: column; align-items: center; text-align: center; height: 100%; background: var(--white); border-radius: 8px; box-shadow: 3px 3px 8px rgba(0, 0, 0, .1); padding: 22px 14px 20px; transition: transform .25s var(--ease), box-shadow .25s; }
.industry-cards a:hover { transform: translateY(-3px); box-shadow: 4px 8px 16px rgba(0, 0, 0, .12); }
.industry-cards img { width: 96px; height: 60px; object-fit: contain; }
.industry-cards__name { margin: 12px 0 8px; font-size: 16px; font-weight: 900; color: var(--red); line-height: 1.4; text-wrap: balance; min-height: 2.8em; display: grid; place-items: center; }
.industry-cards__catch { font-size: 12.5px; line-height: 1.7; }
.industry-note { text-align: center; margin-top: 20px; }
.area-types--4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
@media (max-width: 1100px) { .industry-cards { grid-template-columns: repeat(3, minmax(0, 1fr)); } }
@media (max-width: 768px) {
	.industry-cards { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 10px; }
	.industry-cards a { padding: 16px 10px; }
	.industry-cards__name { font-size: 14px; }
	.industry-cards__catch { display: none; }
	.area-types--4 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

/* =========================================================
   お客様の声
   ========================================================= */
.voices { padding-bottom: calc(var(--u) * 100); }
.voice-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: calc(var(--u) * 28); width: min(92%, calc(var(--u) * 1080)); margin-inline: auto; }
.lower .voice-grid { width: 100%; max-width: 1080px; }
.voice-card { position: relative; display: flex; flex-direction: column; background: var(--white); border-radius: 10px; overflow: hidden; box-shadow: 2px 2px 10px rgba(0, 0, 0, .08); }
.voice-card__img { aspect-ratio: 16 / 9; overflow: hidden; }
.voice-card__img img { width: 100%; height: 100%; object-fit: cover; }
.voice-card__body { position: relative; flex: 1; display: flex; flex-direction: column; padding: 22px 22px 20px; }
.voice-card__body::before { content: "\201C"; position: absolute; top: -34px; left: 18px; font-family: var(--slab); font-size: 72px; line-height: 1; color: var(--red); }
.voice-card__catch { font-size: 16px; font-weight: 900; line-height: 1.5; color: var(--red); margin-bottom: 10px; text-wrap: balance; }
.voice-card__text { font-size: 13.5px; line-height: 1.9; flex: 1; }
.voice-card__who { margin-top: 14px; padding-top: 12px; border-top: 1px dashed #e3ddd6; display: flex; flex-direction: column; gap: 2px; }
.voice-card__shop { font-weight: 900; font-size: 14px; }
.voice-card__meta { font-size: 12px; color: #777; }
@media (max-width: 1100px) and (min-width: 769px) { .voice-grid { gap: 16px; } .voice-card__body { padding: 18px 16px; } }
@media (max-width: 768px) {
	.voices { padding-bottom: calc(var(--u) * 56); }
	.voice-grid { grid-template-columns: minmax(0, 1fr); gap: 18px; width: calc(100% - var(--u) * 48); }
}

/* =========================================================
   公式LINE
   ========================================================= */
:root { --line: #06c755; }
.sp-btn--line { background: var(--line) !important; }
.sp-btn--line svg { width: 72% !important; }
.btn--line-app { display: inline-flex; align-items: center; justify-content: center; gap: .5em; background: var(--line); color: #fff; font-weight: 700; border: 0; }
.btn--line-app svg { width: 1.6em; height: 1.6em; }
.btn--line-app:hover { background: #05b04b; }
.contact__line { display: grid; grid-template-columns: auto auto; align-items: center; justify-content: center; gap: 10px; width: calc(var(--u) * 240); height: calc(var(--u) * 105); background: var(--line); border: 3px solid #fff; color: #fff; font-size: calc(var(--u) * 20); font-weight: 900; line-height: 1.4; text-align: left; transition: background .25s; }
.contact__line svg { width: calc(var(--u) * 46); height: calc(var(--u) * 46); }
.contact__line:hover { background: #05b04b; }
.contact__sp-btn--line { background: var(--line); }
.contact__sp-btn--line svg { width: 70% !important; }
.line-box { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 20px; background: #eafbf1; border: 2px solid var(--line); border-radius: 10px; padding: 22px 26px; }
.line-box__icon { display: grid; place-items: center; width: 64px; height: 64px; border-radius: 16px; background: var(--line); color: #fff; }
.line-box__icon svg { width: 44px; height: 44px; }
.line-box__ttl { font-weight: 900; font-size: 17px; margin-bottom: 4px; }
.line-box p:not(.line-box__ttl) { font-size: 13.5px; line-height: 1.8; }
.line-box__btn { display: inline-block; background: var(--line); color: #fff; font-weight: 900; padding: .9em 1.6em; border-radius: 999px; white-space: nowrap; }
.contact-boxes:has(.contact-box--line) { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.contact-box--line { border-color: var(--line); }
.contact-box--line .btn { min-width: 0; }
.contact__btns { flex-wrap: wrap; }
@media (max-width: 1100px) and (min-width: 769px) { .contact__line { width: calc(var(--u) * 200); } }
@media (max-width: 768px) {
	.contact__sp { gap: calc(var(--u) * 28); }
	.line-box { grid-template-columns: auto minmax(0, 1fr); padding: 18px; gap: 14px; }
	.line-box__btn { grid-column: 1 / -1; text-align: center; }
	.contact-boxes:has(.contact-box--line) { grid-template-columns: minmax(0, 1fr); }
	.header__sp { gap: calc(var(--u) * 10); }
}
/* お問い合わせページ：3つの枠を崩れないように */
.contact-box { padding: 26px 18px 22px; overflow: hidden; }
.contact-box .btn { min-width: 0; width: 100%; max-width: 240px; padding-inline: 1em; }
.contact-box .freedial { align-items: center; }
.contact-boxes:has(.contact-box--line) .contact-box .freedial__num { font-size: clamp(22px, 2.3vw, 32px); }
.contact-boxes:has(.contact-box--line) .contact-box .freedial__icon { width: clamp(34px, 3vw, 46px); }
.contact-box .freedial--contact .freedial__kana { top: -12px; font-size: 10px; }
.contact-box p { text-align: center; }
.insp-hero__reg { display: inline-block; margin-top: 14px; font-size: 13px; font-weight: 700; color: var(--dark); background: #ffd766; padding: .4em 1em; border-radius: 4px; }
/* 件数が少なくスライドしないときは中央寄せ */
@media (min-width: 769px) {
	.works__viewport:not(.is-running) .works__track { margin-inline: auto; padding-inline: 16px; max-width: 100%; flex-wrap: wrap; justify-content: center; }
}

/* 看板の種類カード：高さをそろえ、件数が少ない時は中央寄せ */
.area-types { display: flex; flex-wrap: wrap; justify-content: center; }
.area-types > li { display: flex; flex: 0 0 calc((100% - 32px) / 3); }
.area-types--4 > li { flex-basis: calc((100% - 48px) / 4); }
.area-types a { flex: 1; width: 100%; justify-content: flex-start; }
.area-types span { line-height: 1.5; font-size: .95em; }
@media (max-width: 768px) {
	.area-types > li { flex-basis: calc((100% - 16px) / 3); }
	.area-types--4 > li { flex-basis: calc((100% - 8px) / 2); }
}

/* ページ送り */
.nav-links { flex-wrap: wrap; align-items: center; }
.page-numbers.prev, .page-numbers.next { padding: 0 16px; }
.page-numbers.dots { border: 0; min-width: 24px; }
a.page-numbers:hover { background: var(--dark); color: #fff; }
@media (max-width: 768px) {
	.nav-links { gap: 6px; margin-top: 40px; }
	.page-numbers { min-width: 36px; height: 36px; font-size: 14px; }
}
