@charset "UTF-8";
*,
*::before,
*::after {
  box-sizing: border-box;
}

ul,
ol {
  padding: 0;
}

body,
h1,
h2,
h3,
h4,
p,
ul,
ol,
figure,
blockquote,
dl,
dd {
  margin: 0;
}

ul,
ol {
  list-style: none;
}

a:not([class]) {
  -webkit-text-decoration-skip: ink;
          text-decoration-skip-ink: auto;
}

img {
  max-width: 100%;
  display: block;
  width: 100%;
}

input,
button,
textarea,
select {
  font: inherit;
}

input,
button,
select,
textarea {
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background: transparent;
  border: none;
  border-radius: 0;
  font: inherit;
  outline: none;
}

textarea {
  resize: vertical;
}

input[type=checkbox],
input[type=radio] {
  display: none;
}

input[type=submit],
input[type=button],
label,
button,
select {
  cursor: pointer;
}

select::-ms-expand {
  display: none;
}

:root {
  --base-font-family: "Noto Sans JP", sans-serif;
  --second-font-family: "Outfit", sans-serif;
  --font-weight-regular: 500;
  --line-height-regular: 1.5;
  --letter-spacing-regular: 0.04em;
  --color-black: #111;
  --color-white: #fff;
  --color-main: #e95513;
  --color-sub: #430014;
  --color-accent-red: #da1617;
  --color-accent-green: #008564;
  --color-tel-green: #11a239;
  --color-accent-orange: #de551a;
  --color-border-line: #ecd292;
  --color-bg-cream: #fcf8ee;
  --color-bg-highlight: #fff3c2;
  --color-bg-input: #eeeeef;
  --color-border: #b6b6b6;
  --color-gray: #ccc;
  --header-height: 5rem;
  --header-height-scrolled: 3.75rem;
}
@media screen and (min-width: 768px) {
  :root {
    --header-height: 6.875rem;
  }
}

html {
  font-size: 16px;
}
@media (max-width: 390px) {
  html {
    font-size: 4.1025641026vw;
  }
}
@media (min-width: 768px) and (max-width: 1250px) {
  html {
    font-size: 1.28vw;
  }
}

html {
  scrollbar-gutter: stable;
  scroll-padding-top: var(--header-height-scrolled);
}

body {
  container-type: inline-size;
  display: flex;
  flex-direction: column;
  min-height: 100vh;
  text-rendering: optimizeSpeed;
  overflow-wrap: anywhere;
  word-break: normal;
  line-break: strict;
  font-size: max(0.875rem, 10px);
  font-family: var(--base-font-family);
  font-weight: var(--font-weight-regular);
  line-height: var(--line-height-regular);
  letter-spacing: var(--letter-spacing-regular);
  color: var(--color-black);
  background-color: #fcf8ef;
}
@media screen and (min-width: 768px) {
  body {
    font-size: max(1rem, 10px);
  }
}

main {
  flex: 1;
}

html:has(body.is-fixed),
body.is-fixed {
  overflow: hidden;
}

a {
  text-decoration: none;
  color: inherit;
  transition: opacity 0.3s;
}

@media (hover: hover) {
  a:hover {
    opacity: 0.7;
  }
}
@media (hover: none) {
  a:active {
    opacity: 0.7;
  }
}
img {
  overflow-clip-margin: unset;
}

button {
  color: inherit;
}

address,
em {
  font-style: normal;
}

.l-cta {
  margin-top: 1.875rem;
}
@media screen and (min-width: 768px) {
  .l-cta {
    margin-top: 4.1875rem;
  }
}

.l-inner {
  margin-inline: auto;
  width: 100%;
  padding-inline: 1.25rem;
  max-width: 40rem;
}
@media screen and (min-width: 768px) {
  .l-inner {
    max-width: 78.125rem;
    padding-inline: 1.5625rem;
  }
}
@media screen and (min-width: 1441px) {
  .l-inner {
    max-width: 78.125rem;
    padding-inline: 1.5625rem;
  }
}

.l-inner-l {
  margin-inline: auto;
  width: 100%;
  padding-inline: 1.25rem;
  max-width: 40rem;
}
@media screen and (min-width: 768px) {
  .l-inner-l {
    max-width: 78.125rem;
    padding-inline: 1.5625rem;
  }
}
@media screen and (min-width: 1441px) {
  .l-inner-l {
    max-width: 78.125rem;
    padding-inline: 1.5625rem;
  }
}

/* 幅広インナー：SP・768は .l-inner と同じ。1441+ だけ内側1400 */
.l-inner-wide {
  margin-inline: auto;
  width: 100%;
  padding-inline: 1.25rem;
  max-width: 40rem;
}
@media screen and (min-width: 768px) {
  .l-inner-wide {
    max-width: 78.125rem;
    padding-inline: 1.5625rem;
  }
}
@media screen and (min-width: 1441px) {
  .l-inner-wide {
    max-width: 111.125rem;
    padding-inline: 1.5625rem;
  }
}

.l-sub-content {
  margin-block: 1.5625rem;
}
@media screen and (min-width: 768px) {
  .l-sub-content {
    margin-block: 6.25rem;
  }
}

.l-sub-content + .l-sub-content {
  margin-top: 3.125rem;
}

.l-sub-mv {
  margin-top: var(--header-height);
}
@media screen and (min-width: 768px) {
  .l-sub-mv {
    margin-top: var(--header-height-scrolled);
  }
}

.l-top-area {
  margin-top: 3.125rem;
}
@media screen and (min-width: 768px) {
  .l-top-area {
    margin-top: 6.25rem;
  }
}

.l-top-banner {
  margin-block: 1.875rem;
}
@media screen and (min-width: 768px) {
  .l-top-banner {
    margin-block: 3.125rem 0;
  }
}

.l-top-first {
  margin-top: 2.1875rem;
}
@media screen and (min-width: 768px) {
  .l-top-first {
    margin-top: 5.3125rem;
  }
}

@media screen and (min-width: 768px) {
  .l-top-flow-banner .l-top-flow,
  .l-top-flow-banner .l-top-banner {
    margin-top: 0;
  }
}

.l-top-flow {
  margin-top: 1.625rem;
}
@media screen and (min-width: 768px) {
  .l-top-flow {
    margin-top: 6.25rem;
  }
}

.l-top-free-inspection {
  margin-top: 1.6875rem;
}
@media screen and (min-width: 768px) {
  .l-top-free-inspection {
    margin-top: 5rem;
  }
}

.l-top-knowledge {
  margin-top: 2.1875rem;
}
@media screen and (min-width: 768px) {
  .l-top-knowledge {
    margin-top: 4.5625rem;
  }
}

.l-top-message {
  margin-top: 1.5625rem;
}
@media screen and (min-width: 768px) {
  .l-top-message {
    margin-top: 5.625rem;
  }
}

.l-top-reason {
  margin-block: 1.5625rem;
}
@media screen and (min-width: 768px) {
  .l-top-reason {
    margin: 0;
  }
}

.l-top-showroom {
  margin-top: 2.1875rem;
}
@media screen and (min-width: 768px) {
  .l-top-showroom {
    margin-top: 5.625rem;
  }
}

.l-top-simulation {
  margin-top: 2.8125rem;
}
@media screen and (min-width: 768px) {
  .l-top-simulation {
    margin-top: 4.375rem;
  }
}

.l-top-smile {
  margin-top: 2.8125rem;
}
@media screen and (min-width: 768px) {
  .l-top-smile {
    margin-top: 4.6875rem;
  }
}

.l-top-staff {
  margin-top: 1.875rem;
}
@media screen and (min-width: 768px) {
  .l-top-staff {
    margin-top: 3.625rem;
  }
}

.l-top-subsidy {
  margin-block: 3.125rem 2.625rem;
}
@media screen and (min-width: 768px) {
  .l-top-subsidy {
    margin-block: 5.9375rem 3.75rem;
  }
}

@media screen and (min-width: 768px) {
  .l-top-topics-area {
    margin-top: 3.75rem;
  }
}

@media screen and (min-width: 768px) {
  .l-top-topics-area .l-top-topics,
  .l-top-topics-area .l-top-area {
    margin-top: 0;
  }
}

.l-top-topics {
  margin-top: 1.875rem;
}
@media screen and (min-width: 768px) {
  .l-top-topics {
    margin-top: 3.125rem;
  }
}

.l-top-works {
  margin-top: 3.4375rem;
}
@media screen and (min-width: 768px) {
  .l-top-works {
    margin-top: 4.6875rem;
  }
}

.c-accordion::details-content {
  content-visibility: unset;
  display: block grid;
}

@media (prefers-reduced-motion: no-preference) {
  .c-accordion::details-content {
    transition: grid-template-rows 0.3s ease-in-out;
  }
}
.c-accordion:not([open])::details-content {
  grid-template-rows: 0fr;
}

.c-accordion[open]::details-content {
  grid-template-rows: 1fr;
}

.c-accordion {
  border: 1px solid var(--color-black);
  border-radius: 0.3125rem;
  padding: 0.625rem;
}
@media screen and (min-width: 768px) {
  .c-accordion {
    border-radius: 0.625rem;
    padding: 1.25rem;
  }
}

.c-accordion__summary {
  list-style: none;
  position: relative;
  cursor: pointer;
}

.c-accordion__summary::before,
.c-accordion__summary::after {
  content: "";
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  right: 0.625rem;
  width: 0.9375rem;
  height: 1px;
  background-color: var(--color-black);
  transition: transform 0.3s ease-in-out;
}
@media screen and (min-width: 768px) {
  .c-accordion__summary::before,
  .c-accordion__summary::after {
    right: 1.25rem;
    width: 1.25rem;
  }
}

.c-accordion__summary::before {
  transform: translateY(-50%) rotate(90deg);
}

.c-accordion[open] .c-accordion__summary::before {
  transform: translateY(-50%) rotate(0deg);
}

.c-accordion__body {
  overflow: hidden;
}

.c-accordion__wrap {
  padding-top: 1.25rem;
}

.c-arrow-button {
  width: 100%;
  max-width: 20.625rem;
  padding: 1.375rem;
  display: inline-block;
  font-size: max(0.875rem, 10px);
  line-height: 1;
  color: var(--color-white);
  background-color: var(--color-main);
  border: 1px solid var(--color-main);
  text-align: center;
  border-radius: 1.875rem;
  transition: right 0.3s;
  position: relative;
}
@media screen and (min-width: 768px) {
  .c-arrow-button {
    max-width: 26.25rem;
    font-size: max(1.125rem, 10px);
    padding: 1.25rem;
  }
}

.c-arrow-button:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 1.875rem;
  width: 0.625rem;
  height: 0.625rem;
  border-top: solid 2px currentColor;
  border-right: solid 2px currentColor;
  transform: translateY(-50%) rotate(45deg);
  transition: right 0.3s;
}

@media (any-hover: hover) {
  .c-arrow-button:hover {
    opacity: 1;
  }
  .c-arrow-button:hover:after {
    right: 1.25rem;
  }
}
@media screen and (min-width: 768px) {
  .c-background-beige {
    padding-block: 1.875rem 4.6875rem;
    background-color: #F9F1DE;
  }
}

.c-background-white {
  background-color: var(--color-white);
  border-radius: 0.625rem;
  padding-block: 0.625rem 1.875rem;
}
@media screen and (min-width: 768px) {
  .c-background-white {
    padding: 3.125rem 1.875rem 2.8125rem;
  }
}

.c-button {
  width: 100%;
  max-width: 21.875rem;
  padding: 1rem;
  display: inline-block;
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1;
  color: var(--color-white);
  background-color: var(--color-accent-green);
  border: 1px solid var(--color-accent-green);
  text-align: center;
  border-radius: 1.875rem;
  position: relative;
  transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out, transform 0.3s ease-in-out;
}
@media screen and (min-width: 768px) {
  .c-button {
    max-width: 28.125rem;
    font-size: max(1.25rem, 10px);
    padding: 1.25rem;
  }
}

.c-button:before {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 3.5625rem;
  height: auto;
  aspect-ratio: 114/126;
  background-image: url("../images/common/button-img.webp");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
@media screen and (min-width: 768px) {
  .c-button:before {
    width: 4.5625rem;
  }
}

.c-button:after {
  content: "";
  position: absolute;
  top: 50%;
  right: 1.25rem;
  width: 1.625rem;
  height: 1.625rem;
  background-image: url("../images/common/arrow-orange.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  transform: translateY(-50%);
}
@media screen and (min-width: 768px) {
  .c-button:after {
    right: 1.5625rem;
    width: 2.0625rem;
    height: 2.0625rem;
  }
}

@media (any-hover: hover) {
  .c-button:hover {
    opacity: 1;
    color: var(--color-main);
    background-color: var(--color-white);
    transform: scale(1.04);
  }
}
/* アバター（丸）＋白い角丸吹き出しのコメント行。尾なし・枠なし。FAQ・お客様の声などで共通利用 */
.c-comment {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .c-comment {
    gap: 1.25rem;
  }
}

.c-comment__avatar {
  flex-shrink: 0;
  width: 3.5rem;
  height: 3.5rem;
  border-radius: 50%;
  overflow: hidden;
  background-color: var(--color-bg-cream);
}
@media screen and (min-width: 768px) {
  .c-comment__avatar {
    width: 4.5rem;
    height: 4.5rem;
  }
}

.c-comment__avatar img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.c-comment__bubble {
  flex: 1;
  min-width: 0;
  background-color: var(--color-white);
  border-radius: 0.75rem;
  padding: 1rem 1.25rem;
}
@media screen and (min-width: 768px) {
  .c-comment__bubble {
    padding: 1.25rem 1.75rem;
  }
}

.c-comment__text {
  font-size: max(0.9375rem, 10px);
  font-weight: 500;
  line-height: 1.7333333333;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .c-comment__text {
    font-size: max(1.0625rem, 10px);
    line-height: 1.7647058824;
  }
}

.c-content-card {
  background: linear-gradient(to bottom, transparent 0.9375rem, var(--color-white) 0.625rem);
  border-radius: 0.625rem;
  position: relative;
}
@media screen and (min-width: 768px) {
  .c-content-card {
    padding-block: 3.5rem 4.6875rem;
    background-color: var(--color-white);
  }
}

.c-content-card__logo {
  width: 78%;
  height: auto;
  max-width: 25rem;
  margin-inline: auto;
  transform: translateX(1.25rem);
}
@media screen and (min-width: 768px) {
  .c-content-card__logo {
    max-width: 37.125rem;
    width: 100%;
    transform: translateX(1.5625rem);
  }
}

.c-content-card__logo img {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
}

/* あしらいキャラを文章ブロックの脇に添える。SPは上・中央、PCは絶対配置（デフォルト右／data-side="left"で左）。
   ※親要素に position: relative が必要 */
.c-deco-char {
  width: 6.875rem;
  margin: 0 auto 0.75rem;
}
@media screen and (min-width: 768px) {
  .c-deco-char {
    position: absolute;
    bottom: -1.5rem;
    right: 1.875rem;
    width: 10rem;
    margin: 0;
  }
}

@media screen and (min-width: 768px) {
  .c-deco-char[data-side=left] {
    right: auto;
    left: 1.875rem;
  }
}

.c-deco-char img {
  display: block;
  width: 100%;
  height: auto;
}

.c-dialog__open {
  width: 100%;
  max-width: 26.25rem;
  padding: 1.25rem;
  display: inline-block;
  font-size: max(1.125rem, 10px);
  line-height: 1;
  color: var(--color-white);
  background-color: var(--color-main);
  border: 1px solid var(--color-main);
  text-align: center;
  transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out;
}

.c-dialog__contents {
  --duration: 0.3s;
  --scale: 0.95;
  transition: display var(--duration) allow-discrete, overlay var(--duration) allow-discrete, opacity var(--duration) ease-in-out, scale var(--duration) ease-in-out;
  opacity: 0;
  scale: var(--scale);
  width: -moz-fit-content;
  width: fit-content;
  max-height: 80%;
  text-align: center;
}

.c-dialog__contents[open] {
  opacity: 1;
  scale: 1;
}
@starting-style {
  .c-dialog__contents[open] {
    opacity: 0;
    scale: var(--scale);
  }
}

.c-dialog__contents-inner {
  padding: 1.875rem;
}

.c-dialog__close {
  width: 100%;
  max-width: 12.5rem;
  padding: 1.25rem;
  display: inline-block;
  font-size: max(1.125rem, 10px);
  line-height: 1;
  color: var(--color-white);
  background-color: var(--color-main);
  border: 1px solid var(--color-main);
  text-align: center;
  transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out;
}

@media (any-hover: hover) {
  .c-dialog__open:hover {
    color: var(--color-main);
    background-color: var(--color-white);
  }
  .c-dialog__close:hover {
    color: var(--color-main);
    background-color: var(--color-white);
  }
}
.c-dialog__contents::backdrop {
  background-color: rgba(0, 0, 0, 0.2);
  opacity: 0;
  transition: opacity 0.3s ease-in-out;
}

.c-dialog__contents[open]::backdrop {
  opacity: 1;
}
@starting-style {
  .c-dialog__contents[open]::backdrop {
    opacity: 0;
  }
}

:root:has(dialog[open]) {
  overflow: hidden;
}

.c-grid {
  display: grid;
  gap: 1rem;
}
@media screen and (min-width: 768px) {
  .c-grid {
    grid-template-columns: repeat(var(--c-grid-cols, 3), 1fr);
    gap: 1.5rem;
  }
}

.c-grid__card {
  padding: 0.5rem 0.625rem 0.625rem;
  background-color: var(--color-white);
  border-radius: 0.625rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .c-grid__card {
    padding: 1.25rem;
    gap: 1rem;
  }
}

img.is-img-missing {
  display: flex;
  align-items: center;
  justify-content: center;
  box-sizing: border-box;
  padding: 0.625rem;
  background-color: var(--color-gray);
  border: 2px dashed var(--color-border);
  border-radius: 0.375rem;
  color: var(--color-border);
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
  overflow: hidden;
  -o-object-fit: contain;
     object-fit: contain;
}
@media screen and (min-width: 768px) {
  img.is-img-missing {
    font-size: max(0.9375rem, 10px);
  }
}

/* 共通ラベル（カテゴリ・タグ・ステータス）
   使用箇所：トップお知らせ / ブログ・お知らせ一覧 / 施工事例一覧・詳細 / お客様の声詳細 */
.c-label {
  display: block;
  font-size: max(0.75rem, 10px);
  font-weight: 700;
  line-height: 1;
  color: var(--color-white);
  background-color: var(--color-main);
  padding: 0.375rem 0.875rem;
  border-radius: 0.25rem;
}

/* ステータス用（施工完了 など） */
.c-label--sub {
  background-color: var(--color-sub);
}

.c-list-heading {
  text-align: left;
}

.c-list-heading__title {
  color: var(--color-main);
  font-size: max(1.5rem, 10px);
  font-weight: 700;
  line-height: 1.3;
}

.c-list-heading__en {
  margin-top: -0.25rem;
  color: var(--color-sub);
  font-size: max(1rem, 10px);
  font-weight: 700;
}

.c-logo-head {
  margin-block-start: -1.25rem;
  margin-inline: auto;
  width: 17.125rem;
  box-sizing: content-box;
  padding-inline-start: 2.375rem;
}
@media screen and (min-width: 768px) {
  .c-logo-head {
    width: 25rem;
  }
}

.c-logo-head img {
  display: block;
  width: 100%;
  height: auto;
}

.c-loop-slider {
  width: 100%;
}
@media screen and (min-width: 768px) {
  .c-loop-slider {
    width: 500px;
  }
}

.c-loop-slider__img {
  width: 100%;
  height: auto;
}

.c-loop-slider__img img {
  aspect-ratio: 3/2;
  -o-object-fit: cover;
     object-fit: cover;
  height: auto;
  width: 100%;
}

/*
  商品メニュー プランカード（parts/menu-plan-card.php）
  /menu・/menu/wall・/menu/roof・プラン詳細「他のメニュー」で共通利用
*/
.c-menu-plan-card {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
  height: 100%;
  overflow: hidden;
  background-color: var(--color-white);
  border-radius: 0.625rem;
  box-shadow: 0 0.125rem 0.625rem rgba(0, 0, 0, 0.08);
  padding-block-end: 1rem;
}

.c-menu-plan-card__head {
  padding: 0.625rem 0.75rem;
  text-align: center;
  color: var(--color-white);
  background-color: var(--color-main);
}

.c-menu-plan-card__maker {
  font-size: max(1rem, 10px);
}

.c-menu-plan-card__pack {
  font-size: max(1.375rem, 10px);
  font-weight: 700;
}

.c-menu-plan-card__catch {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 3rem;
  padding-inline: 0.75rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-sub);
  text-align: center;
}

.c-menu-plan-card__tag-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem;
  padding-inline: 0.75rem;
}

.c-menu-plan-card__tag {
  padding: 0.25rem 0.875rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  color: var(--color-sub);
  background-color: var(--color-bg-cream);
  border-radius: 62.4375rem;
}

/* __coat（三回塗り帯）はスプシ未記載のため一旦非表示中（PHP側コメント参照） */
.c-menu-plan-card__spec {
  display: grid;
  gap: 0.375rem;
  padding-inline: 0.75rem;
}

.c-menu-plan-card__spec-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.625rem;
  padding-block-end: 0.375rem;
  border-block-end: 1px dashed var(--color-border);
}

.c-menu-plan-card__spec-title {
  font-size: max(1rem, 10px);
  color: var(--color-sub);
}

.c-menu-plan-card__spec-data {
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  color: var(--color-sub);
}

.c-menu-plan-card__price {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 0.25rem;
  text-align: center;
  padding-inline: 0.75rem;
}

.c-menu-plan-card__price-label {
  font-size: max(1rem, 10px);
}

.c-menu-plan-card__price-num {
  font-family: var(--second-font-family);
  font-size: max(2.5rem, 10px);
  font-weight: 700;
  line-height: 1;
  color: var(--color-accent-red);
}

.c-menu-plan-card__price-unit {
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  color: var(--color-accent-red);
}

.c-menu-plan-card__price-tax {
  font-size: max(1rem, 10px);
  text-align: center;
  padding-inline: 0.75rem;
  margin-block-end: 0.625rem;
}

a.c-menu-plan-card {
  transition: opacity 0.3s;
}

@media (any-hover: hover) {
  a.c-menu-plan-card:hover {
    opacity: 0.7;
  }
}
.c-menu-plan-card__more {
  width: min(100% - 1.5rem, 15rem);
  margin-block-start: auto;
  margin-inline: auto;
  padding: 0.625rem;
  font-size: max(1rem, 10px);
  font-weight: 500;
  text-align: center;
  color: var(--color-white);
  background-color: var(--color-sub);
  border-radius: 1.875rem;
}

/* YouTube動画 共通パーツ（parts/movie.php）
   ※上マージンは各テンプレートの外側要素（例: .p-top-message__movie-wrap）で管理する */
@media screen and (min-width: 768px) {
  .c-movie-wrap {
    background-color: #F9F1DE;
    padding: 1.25rem;
    border-radius: 0.625rem;
    display: grid;
    gap: 1.25rem;
    grid-template-columns: 1fr 2fr;
    align-items: center;
  }
}

.c-movie-wrap__lead.c-section-title__en {
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .c-movie-wrap__lead.c-section-title__en {
    font-size: max(2.25rem, 10px);
    line-height: 1.25;
    text-align: center;
  }
}

@media screen and (min-width: 768px) {
  .c-movie-wrap__lead-img {
    margin-top: 1.25rem;
    width: 100%;
    height: auto;
    max-width: 7.875rem;
    margin-inline: auto;
  }
}

.c-movie-wrap__lead-img img {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
}

.c-movie-wrap__movie {
  margin-top: 0.625rem;
  width: 100%;
  height: auto;
}
@media screen and (min-width: 768px) {
  .c-movie-wrap__movie {
    margin-top: initial;
  }
}

.c-movie-wrap__movie iframe {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
  aspect-ratio: 350/197;
}
@media screen and (min-width: 768px) {
  .c-movie-wrap__movie iframe {
    aspect-ratio: 760/427;
  }
}

.c-no-post {
  margin-top: 1.875rem;
  font-size: max(1.125rem, 10px);
  font-weight: 500;
  line-height: 2;
  letter-spacing: 0.05em;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .c-no-post {
    font-size: max(1.25rem, 10px);
  }
}

.c-pagenavi {
  margin-top: 3.125rem;
  text-align: center;
}

.c-pagenavi .nav-links {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 0.3125rem;
  position: relative;
}
@media screen and (min-width: 768px) {
  .c-pagenavi .nav-links {
    gap: 0.5rem;
  }
}

.c-pagenavi a.page-numbers,
.c-pagenavi .page-numbers.current {
  width: 1.875rem;
  height: auto;
  aspect-ratio: 1/1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .c-pagenavi a.page-numbers,
  .c-pagenavi .page-numbers.current {
    width: 3.125rem;
    font-size: max(1rem, 10px);
  }
}

.c-pagenavi .page-numbers.current {
  background-color: var(--color-main);
  color: var(--color-white);
  border-radius: 50%;
}

.c-pagenavi .page-numbers.next,
.c-pagenavi .page-numbers.prev {
  position: absolute;
  top: 0;
}

.c-pagenavi .page-numbers.next {
  right: -2.1875rem;
}
@media screen and (min-width: 768px) {
  .c-pagenavi .page-numbers.next {
    right: -2.8125rem;
  }
}

.c-pagenavi .page-numbers.prev {
  left: -2.1875rem;
}
@media screen and (min-width: 768px) {
  .c-pagenavi .page-numbers.prev {
    left: -2.8125rem;
  }
}

.c-pagenavi a {
  transition: color 0.3s ease-in-out;
}

@media (any-hover: hover) {
  .c-pagenavi a:hover {
    color: var(--color-main);
    opacity: 1;
  }
}
/* 社長コメント（parts/president-comment.php）：丸写真＋吹き出し */
.c-president-comment {
  display: flex;
  align-items: center;
  gap: 0.625rem;
}
@media screen and (min-width: 768px) {
  .c-president-comment {
    gap: 1.75rem;
  }
}

.c-president-comment__avatar {
  flex-shrink: 0;
  width: 5rem;
  height: 5rem;
  border-radius: 50%;
  overflow: hidden;
  background-color: var(--color-bg-cream);
}
@media screen and (min-width: 768px) {
  .c-president-comment__avatar {
    width: 9.375rem;
    height: 9.375rem;
  }
}

.c-president-comment__avatar img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.c-president-comment__bubble {
  position: relative;
  flex: 1;
  min-width: 0;
  background-color: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: 1rem;
  padding: 1rem 1.125rem;
}
@media screen and (min-width: 768px) {
  .c-president-comment__bubble {
    padding: 1.75rem 2.5rem;
  }
}

/* 吹き出しの尾（左向き）。枠線付きなので border色三角（後ろ）＋白三角（前）の2枚重ね */
.c-president-comment__bubble::before,
.c-president-comment__bubble::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 100%;
  width: 0;
  height: 0;
  border-style: solid;
  transform: translateY(-50%);
}

.c-president-comment__bubble::before {
  border-width: 0.5625rem 0.6875rem 0.5625rem 0;
  border-color: transparent var(--color-border) transparent transparent;
}

.c-president-comment__bubble::after {
  margin-right: -0.0625rem;
  border-width: 0.5rem 0.625rem 0.5rem 0;
  border-color: transparent var(--color-white) transparent transparent;
}

.c-president-comment__text {
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.8571428571;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .c-president-comment__text {
    font-size: max(1.125rem, 10px);
    line-height: 1.875;
  }
}

.c-president-comment__accent {
  color: var(--color-accent-red);
  font-weight: 700;
}

.c-section-title[data-position=center] {
  text-align: center;
}

.c-section-title {
  display: flex;
  flex-direction: column;
  gap: 0.25rem;
}
@media screen and (min-width: 768px) {
  .c-section-title {
    text-align: center;
  }
}

.c-section-title__ja {
  margin: 0;
  font-size: max(1.5rem, 10px);
  font-weight: 700;
  line-height: 1.2;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .c-section-title__ja {
    font-size: max(3.125rem, 10px);
    font-weight: 900;
  }
}

.c-section-title__ja span {
  color: var(--color-sub);
}

.c-section-title__ja span[data-size=s] {
  font-size: max(1.125rem, 10px);
}
@media screen and (min-width: 768px) {
  .c-section-title__ja span[data-size=s] {
    font-size: max(2.1875rem, 10px);
  }
}

.c-section-title__en {
  margin: 0;
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.05em;
  color: var(--color-sub);
  font-family: var(--second-font-family);
}
@media screen and (min-width: 768px) {
  .c-section-title__en {
    font-size: max(1.875rem, 10px);
    letter-spacing: 0;
  }
}

.c-section-title__lead {
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1;
  color: var(--color-sub);
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
}
@media screen and (min-width: 768px) {
  .c-section-title__lead {
    font-size: max(1.1875rem, 10px);
  }
}

.c-section-title__lead::before {
  content: "";
  display: block;
  width: 0.125rem;
  height: 1.375rem;
  transform: rotate(-35deg);
  background-color: var(--color-sub);
}

.c-section-title__lead::after {
  content: "";
  display: block;
  width: 0.125rem;
  height: 1.375rem;
  transform: rotate(35deg);
  background-color: var(--color-sub);
}

.c-deco-lead {
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 0 0.375rem;
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1.8;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .c-deco-lead {
    font-size: max(1rem, 10px);
  }
}

.c-deco-lead::before,
.c-deco-lead::after {
  content: "";
  display: block;
  width: 0.125rem;
  height: 1rem;
  background-color: var(--color-sub);
  flex-shrink: 0;
}
@media screen and (min-width: 768px) {
  .c-deco-lead::before,
  .c-deco-lead::after {
    height: 1.375rem;
  }
}

.c-deco-lead::before {
  transform: rotate(-35deg);
}

.c-deco-lead::after {
  transform: rotate(35deg);
}

.c-deco-lead__accent {
  color: var(--color-main);
}

.c-slider-autoscroll {
  width: 100%;
}
@media screen and (min-width: 768px) {
  .c-slider-autoscroll {
    width: 500px;
  }
}

.c-slider-autoscroll__img {
  width: 100%;
  height: auto;
}

.c-slider-autoscroll__img img {
  aspect-ratio: 3/2;
  -o-object-fit: cover;
     object-fit: cover;
  height: auto;
  width: 100%;
}

.c-slider-overflow {
  margin-right: calc(50% - 50cqw);
}

.c-slider-overflow__img {
  width: 18.75rem;
  height: auto;
}

.c-slider-overflow__img img {
  aspect-ratio: 3/2;
  -o-object-fit: cover;
     object-fit: cover;
  height: auto;
  width: 100%;
}

.splide__arrows {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 10;
  width: 100%;
  display: flex;
  justify-content: space-between;
}

.splide__arrow {
  width: 2.8125rem;
  height: 2.8125rem;
  opacity: 1;
  background-color: transparent;
  background-image: url("../images/common/arrow-green.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  position: relative;
  transition: opacity 0.3s ease-in-out, transform 0.3s ease-in-out;
}

.splide__arrow:disabled {
  pointer-events: none;
}

.splide__arrow.splide__arrow--prev {
  left: -1.25rem;
  transform: scaleX(-1);
}

.splide__arrow.splide__arrow--next {
  right: -1.25rem;
  transform: none;
}

.splide__arrow svg {
  display: none;
}

@media (any-hover: hover) {
  .splide__arrow:not(:disabled):hover {
    opacity: 1;
  }
  .splide__arrow.splide__arrow--next:not(:disabled):hover {
    transform: scale(1.05);
  }
  .splide__arrow.splide__arrow--prev:not(:disabled):hover {
    transform: scaleX(-1) scale(1.05);
  }
}
.splide__pagination {
  justify-content: center;
  bottom: 1.5625rem;
  position: relative;
  gap: 0.625rem;
}

.splide__pagination__page {
  background-color: var(--color-white);
  border-radius: 50%;
  transition: background-color 0.3s ease-in-out;
  width: 0.625rem;
  height: 0.625rem;
  display: block;
  padding: 0;
}

.splide__pagination__page.is-active {
  background-color: var(--color-main);
}

.c-sub-heading {
  text-align: center;
}

.c-sub-heading__title {
  color: var(--color-sub);
  font-size: max(1.5rem, 10px);
  font-weight: 700;
  line-height: 1.25;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
@media screen and (min-width: 768px) {
  .c-sub-heading__title {
    font-size: max(2rem, 10px);
  }
}

.c-sub-heading__title em {
  color: var(--color-main);
  font-style: normal;
}

.c-sub-heading__en {
  margin-top: 0.25rem;
  color: var(--color-sub);
  font-size: max(0.875rem, 10px);
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .c-sub-heading__en {
    font-size: max(1.125rem, 10px);
  }
}

.c-table-horizontal {
  --cell-padding-block: 0.625rem;
  --cell-padding-inline: 1.25rem;
  width: 100%;
  border-collapse: collapse;
  background-color: var(--color-white);
  border-radius: 0.5rem;
  overflow: hidden;
}

.c-table-horizontal tr > * {
  padding: var(--cell-padding-block) var(--cell-padding-inline);
}

.c-table-horizontal thead th {
  background-color: var(--color-sub);
}

.c-table-horizontal tbody tr {
  position: relative;
}

.c-table-horizontal tbody tr:not(:last-child)::after {
  position: absolute;
  inset-inline: var(--cell-padding-inline);
  inset-block-end: 0;
  height: 1px;
  background-color: var(--color-border);
  content: "";
}

.c-table-horizontal th {
  color: var(--color-white);
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  text-align: left;
}
@media screen and (min-width: 768px) {
  .c-table-horizontal th {
    font-size: max(1rem, 10px);
  }
}

.c-table-horizontal td {
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .c-table-horizontal td {
    font-size: max(1rem, 10px);
  }
}

.c-table {
  width: 100%;
  border-collapse: collapse;
  font-size: max(0.75rem, 10px);
  line-height: 1.5;
}
@media screen and (min-width: 768px) {
  .c-table {
    font-size: max(0.875rem, 10px);
  }
}

.c-table th,
.c-table td {
  border: 1px solid var(--color-border);
  padding: 0.625rem;
  text-align: center;
  vertical-align: middle;
}

/* ヘッダー・見出しセル：淡いベージュ（メイン色より控えめに） */
.c-table th {
  background-color: #F9F1DE;
  color: var(--color-sub);
  font-weight: 700;
}

.c-table td {
  background-color: var(--color-white);
  color: var(--color-sub);
}

/* 本文の共通スタイル（単一ソース）。下層ページの本文 <p> / <li> に付与する。
   ※トップ（front-page）には使わない。
   p.c-text で .p-xxx__text（詳細度0-1-0）に勝たせ、各ページの font-size 上書き不要にしている */
.c-text,
p.c-text {
  font-size: max(0.875rem, 10px);
}
@media screen and (min-width: 768px) {
  .c-text,
  p.c-text {
    font-size: max(1.125rem, 10px);
  }
}

.c-title-deco {
  position: relative;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
}

.c-title-deco::before {
  content: "";
  position: absolute;
  top: 50%;
  right: calc(100% + 0.875rem);
  transform: translateY(-50%);
  width: 3rem;
  aspect-ratio: 254/439;
  background: url("../images/common/character02.webp") center/contain no-repeat;
  pointer-events: none;
}
@media screen and (min-width: 768px) {
  .c-title-deco::before {
    right: calc(100% + 3rem);
    width: 5.625rem;
  }
}

/* 顔だけキャラ */
.c-title-deco[data-char=face]::before {
  aspect-ratio: 1/1;
  width: 4rem;
  background-image: url("../images/common/character03.webp");
}
@media screen and (min-width: 768px) {
  .c-title-deco[data-char=face]::before {
    width: 7.5rem;
  }
}

/* 任意画像・右配置（HTML側で style="--deco-img:url(...)" を指定） */
.c-title-deco[data-char=custom]::before {
  right: auto;
  left: calc(100% + 0.875rem);
  width: 3.125rem;
  background-image: var(--deco-img);
}
@media screen and (min-width: 768px) {
  .c-title-deco[data-char=custom]::before {
    left: calc(100% + 0.625rem);
    width: 6.875rem;
  }
}

/* 注目アイコン（右） */
.c-title-deco[data-char=attention]::before {
  display: none;
}

.c-title-deco[data-char=attention]::after {
  content: "";
  position: absolute;
  top: 0.875rem;
  right: calc(100% + 0.5rem);
  transform: translateY(-50%);
  width: 3.25rem;
  aspect-ratio: 1/1;
  background: url("../images/common/attention-icon.webp") center/contain no-repeat;
  pointer-events: none;
}
@media screen and (min-width: 768px) {
  .c-title-deco[data-char=attention]::after {
    top: 1.875rem;
    right: calc(100% + 1rem);
    width: 5rem;
  }
}

.c-title-sub {
  font-size: max(1.5rem, 10px);
  font-weight: 700;
  line-height: 1.3;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
@media screen and (min-width: 768px) {
  .c-title-sub {
    font-size: max(3.125rem, 10px);
  }
}

.c-title-sub em {
  color: var(--color-main);
}

.c-title-sub span {
  font-size: max(1.0625rem, 10px);
}
@media screen and (min-width: 768px) {
  .c-title-sub span {
    font-size: max(2.25rem, 10px);
  }
}

.c-title {
  font-size: max(1.0625rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .c-title {
    font-size: max(1.375rem, 10px);
  }
}

.p-404 {
  margin-top: var(--header-height);
  padding-top: 2.5rem;
}
@media screen and (min-width: 768px) {
  .p-404 {
    margin-top: var(--header-height-scrolled);
    padding-top: 5rem;
  }
}

.p-404__inner {
  text-align: center;
}

.p-404__title {
  font-size: max(1.25rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-404__title {
    font-size: max(1.75rem, 10px);
  }
}

.p-404__text {
  margin-top: 1rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.8;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-404__text {
    margin-top: 1.25rem;
    font-size: max(1rem, 10px);
  }
}

.p-404__button {
  margin-top: 1.75rem;
}
@media screen and (min-width: 768px) {
  .p-404__button {
    margin-top: 2.5rem;
  }
}

.p-area-select__list {
  margin-top: 1.25rem;
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-area-select__list {
    margin-top: 1.875rem;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5625rem;
  }
}

.p-area-select__list[data-type=other] {
  grid-template-columns: repeat(2, 1fr);
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-area-select__list[data-type=other] {
    grid-template-columns: repeat(2, 21.25rem);
    justify-content: center;
    gap: 1.5625rem;
  }
}

.p-area-select__list[data-type=other] .p-area-select__name {
  padding-bottom: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-area-select__list[data-type=other] .p-area-select__name {
    padding-bottom: 1rem;
  }
}

.p-area-select__item a {
  position: relative;
  display: block;
  height: 100%;
  background-color: var(--color-white);
  border-radius: 0.625rem;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  overflow: hidden;
}

.p-area-select__item a::after {
  content: "";
  position: absolute;
  right: 0.875rem;
  bottom: 1rem;
  width: 1.75rem;
  height: 1.75rem;
  background-color: var(--color-main);
  border-radius: 50%;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='4 2 8 6 4 10'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-area-select__item a::after {
    width: 2rem;
    height: 2rem;
    background-size: 0.875rem;
  }
}

.p-area-select__thumb {
  overflow: hidden;
}

.p-area-select__thumb img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 343/200;
  -o-object-fit: cover;
     object-fit: cover;
  transition: scale 0.4s ease-in-out;
}

@media (any-hover: hover) {
  .p-area-select__item a:hover {
    opacity: 1;
  }
  .p-area-select__item a:hover .p-area-select__thumb img {
    scale: 1.08;
  }
}
.p-area-select__name {
  margin-top: 0.75rem;
  padding-inline: 1rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-area-select__name {
    font-size: max(1.25rem, 10px);
  }
}

.p-area-select__desc {
  margin-top: 0.375rem;
  padding: 0 3.25rem 1rem 1rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-area-select__desc {
    font-size: max(0.875rem, 10px);
  }
}

/* 地域子ページ クチコミ（上マージン） */
.p-area-review {
  margin-top: 2.5rem;
}
@media screen and (min-width: 768px) {
  .p-area-review {
    margin-top: 3.75rem;
  }
}

/* 地域子ページ MV */
.p-area-mv__image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
}

/* ===== カテゴリータブ ===== */
.p-blog-list__tabs {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  list-style: none;
}
@media screen and (min-width: 768px) {
  .p-blog-list__tabs {
    justify-content: center;
    gap: 0.75rem;
  }
}

.p-blog-list__tab a {
  display: block;
  background-color: var(--color-white);
  border: 1px solid var(--color-border-line);
  border-radius: 1.875rem;
  padding: 0.375rem 1.125rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-sub);
  transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}
@media screen and (min-width: 768px) {
  .p-blog-list__tab a {
    font-size: max(0.875rem, 10px);
    padding: 0.5rem 1.5rem;
  }
}

.p-blog-list__tab.is-current a,
.p-blog-list__tab a:hover {
  opacity: 1;
  background-color: var(--color-main);
  border-color: var(--color-main);
  color: var(--color-white);
}

/* ===== カードグリッド（2列） ===== */
.p-blog-list__cards {
  margin-top: 1.25rem;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.25rem 0.9375rem;
  list-style: none;
}
@media screen and (min-width: 768px) {
  .p-blog-list__cards {
    margin-top: 1.875rem;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.875rem 1.5rem;
  }
}

.p-blog-list__card a {
  display: block;
  height: 100%;
}

@media (any-hover: hover) {
  .p-blog-list__card a:hover {
    opacity: 0.85;
  }
}
.p-blog-list__thumb {
  position: relative;
}

.p-blog-list__cat {
  position: absolute;
  top: 0.5rem;
  left: 0.5rem;
  z-index: 1;
  background-color: var(--color-main);
  color: var(--color-white);
  font-size: max(0.6875rem, 10px);
  font-weight: 700;
  line-height: 1;
  border-radius: 0.1875rem;
  padding: 0.3125rem 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-blog-list__cat {
    font-size: max(0.75rem, 10px);
  }
}

.p-blog-list__thumb img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16/11;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.3125rem;
}

.p-blog-list__date {
  display: block;
  margin-top: 0.5rem;
  font-size: max(0.75rem, 10px);
  font-weight: 500;
  line-height: 1.4;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-blog-list__date {
    font-size: max(0.8125rem, 10px);
  }
}

.p-blog-list__title {
  margin-top: 0.25rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-blog-list__title {
    font-size: max(0.9375rem, 10px);
  }
}

.p-blog-list__pagenavi {
  margin-top: 1.875rem;
}
@media screen and (min-width: 768px) {
  .p-blog-list__pagenavi {
    margin-top: 2.8125rem;
  }
}

.p-breadcrumb {
  padding-top: 0.75rem;
  text-align: right;
}
@media screen and (min-width: 768px) {
  .p-breadcrumb {
    padding-top: 1.0625rem;
  }
}

.p-breadcrumb--white {
  background-color: var(--color-white);
}

/* 直後が c-background-beige のページ用（エリア詳細）。SP は beige が付かないため PC のみ */
@media screen and (min-width: 768px) {
  .p-breadcrumb--beige {
    background-color: #F9F1DE;
  }
}

.p-breadcrumb span {
  padding-inline: 0.3125rem;
  font-size: max(0.875rem, 10px);
  text-transform: uppercase;
  font-weight: 500;
  line-height: 1;
  display: inline-block;
}

.p-breadcrumb span.current-item {
  color: var(--color-main);
  max-width: 15em;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
  vertical-align: bottom;
}

.p-breadcrumb__between {
  display: inline-block;
  width: 0.5rem;
  height: 0.5rem;
  border-top: solid 1px currentColor;
  border-right: solid 1px currentColor;
  transform: translateY(-30%) rotate(45deg);
  margin-inline: 0.5rem;
}

/* ===== 開催中/終了 タブ ===== */
.p-campaign__tabs {
  display: flex;
  gap: 0.5rem;
  list-style: none;
}
@media screen and (min-width: 768px) {
  .p-campaign__tabs {
    justify-content: center;
    gap: 0.75rem;
  }
}

.p-campaign__tab {
  flex: 1;
}
@media screen and (min-width: 768px) {
  .p-campaign__tab {
    flex: 0 1 auto;
  }
}

.p-campaign__tab a {
  display: block;
  text-align: center;
  background-color: var(--color-white);
  border: 1px solid var(--color-border-line);
  border-radius: 1.875rem;
  padding: 0.5rem 1.125rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-sub);
  transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}
@media screen and (min-width: 768px) {
  .p-campaign__tab a {
    font-size: max(0.875rem, 10px);
    padding: 0.625rem 1.875rem;
  }
}

.p-campaign__tab.is-current a,
.p-campaign__tab a:hover {
  opacity: 1;
  background-color: var(--color-main);
  border-color: var(--color-main);
  color: var(--color-white);
}

/* ===== カード（縦積み） ===== */
.p-campaign__list {
  margin-top: 1.25rem;
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
  list-style: none;
}
@media screen and (min-width: 768px) {
  .p-campaign__list {
    margin-top: 1.875rem;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.875rem 1.5rem;
  }
}

.p-campaign__card a {
  position: relative;
  display: block;
  height: 100%;
  background-color: var(--color-white);
  border-radius: 0.625rem;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  overflow: hidden;
  padding-bottom: 1rem;
}
@media screen and (min-width: 768px) {
  .p-campaign__card a {
    padding-bottom: 1.25rem;
  }
}

@media (any-hover: hover) {
  .p-campaign__card a:hover {
    opacity: 1;
  }
  .p-campaign__card a:hover .p-campaign__thumb img {
    transform: scale(1.05);
  }
}
.p-campaign__thumb {
  position: relative;
  overflow: hidden;
}

/* 開催中バッジ（左上） */
.p-campaign__status {
  position: absolute;
  top: 0.625rem;
  left: 0.625rem;
  z-index: 2;
  background-color: var(--color-main);
  color: var(--color-white);
  font-size: max(0.75rem, 10px);
  font-weight: 700;
  line-height: 1;
  border-radius: 0.1875rem;
  padding: 0.375rem 0.75rem;
}

/* 終了：カード全体に黒オーバーレイ */
.p-campaign__card.is-ended a::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 2;
  background-color: rgba(0, 0, 0, 0.5);
  border-radius: 0.625rem;
  pointer-events: none;
}

/* 終了：カード中央の「開催終了」ラベル（オーバーレイより前面） */
.p-campaign__ended {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 3;
  background-color: var(--color-main);
  color: var(--color-white);
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1;
  border-radius: 1.875rem;
  padding: 0.625rem 1.375rem;
  white-space: nowrap;
}
@media screen and (min-width: 768px) {
  .p-campaign__ended {
    font-size: max(0.9375rem, 10px);
  }
}

.p-campaign__thumb img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 343/200;
  -o-object-fit: cover;
     object-fit: cover;
  transition: transform 0.4s ease;
}

.p-campaign__body {
  margin-top: 0.875rem;
  padding-inline: 1rem;
  text-align: center;
}

.p-campaign__title {
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-campaign__title {
    font-size: max(1.125rem, 10px);
  }
}

.p-campaign__meta {
  margin-top: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-campaign__meta {
    margin-top: 1rem;
  }
}

.p-campaign__meta-row {
  padding-block: 0.75rem;
  border-top: 1px solid var(--color-border-line);
}

.p-campaign__meta-label {
  font-size: max(0.75rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-campaign__meta-label {
    font-size: max(0.8125rem, 10px);
  }
}

.p-campaign__meta-value {
  margin-top: 0.25rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.5;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-campaign__meta-value {
    font-size: max(0.875rem, 10px);
  }
}

.p-campaign__more {
  margin-top: 0.875rem;
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-campaign__more {
    font-size: max(0.875rem, 10px);
  }
}

.p-campaign__more::after {
  content: "";
  width: 1.25rem;
  height: 1.25rem;
  border-radius: 50%;
  background-color: var(--color-main);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='4 2 8 6 4 10'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 0.625rem;
}

.p-campaign__pagenavi {
  margin-top: 1.875rem;
}
@media screen and (min-width: 768px) {
  .p-campaign__pagenavi {
    margin-top: 2.8125rem;
  }
}

/* ===== 詳細：開催終了/更新日 行 ===== */
.p-campaign-single__status-row {
  margin-top: 1.125rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-campaign-single__status-row {
    margin-top: 1.5rem;
    max-width: 50rem;
    margin-inline: auto;
  }
}

.p-campaign-single__ended,
.p-campaign-single__open {
  flex-shrink: 0;
  color: var(--color-white);
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1;
  border-radius: 1.875rem;
  padding: 0.5625rem 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-campaign-single__ended,
  .p-campaign-single__open {
    font-size: max(0.875rem, 10px);
    padding: 0.6875rem 1.625rem;
  }
}

.p-campaign-single__ended {
  background-color: var(--color-sub);
}

.p-campaign-single__open {
  background-color: var(--color-main);
}

.p-campaign-single__updated {
  font-size: max(0.75rem, 10px);
  font-weight: 500;
  line-height: 1.4;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-campaign-single__updated {
    font-size: max(0.875rem, 10px);
  }
}

/* ===== 詳細：期間/時間/場所 テーブル ===== */
.p-campaign-single__table {
  margin-top: 1rem;
  border: 1px solid var(--color-border-line);
  border-bottom: 0;
}
@media screen and (min-width: 768px) {
  .p-campaign-single__table {
    margin-top: 1.5rem;
    max-width: 50rem;
    margin-inline: auto;
  }
}

.p-campaign-single__row {
  display: grid;
  grid-template-columns: 6.875rem 1fr;
  border-bottom: 1px solid var(--color-border-line);
}
@media screen and (min-width: 768px) {
  .p-campaign-single__row {
    grid-template-columns: 12.5rem 1fr;
  }
}

.p-campaign-single__row dt {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  background-color: var(--color-bg-cream);
  color: var(--color-sub);
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  padding: 0.75rem 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-campaign-single__row dt {
    font-size: max(0.9375rem, 10px);
    padding: 1rem;
  }
}

.p-campaign-single__row dd {
  display: flex;
  align-items: center;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-sub);
  padding: 0.75rem 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-campaign-single__row dd {
    font-size: max(0.9375rem, 10px);
    padding: 1rem 1.25rem;
  }
}

.p-company-movie__movie {
  margin-top: 1.25rem;
  width: 100%;
  height: auto;
}
@media screen and (min-width: 768px) {
  .p-company-movie__movie {
    max-width: 45rem;
    margin-inline: auto;
    margin-top: 1.875rem;
  }
}

.p-company-movie__movie iframe {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
  aspect-ratio: 350/197;
}

.p-company-greeting__body {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-company-greeting__body {
    max-width: 56.25rem;
    margin-inline: auto;
  }
}

.p-company-greeting__body::after {
  content: "";
  display: block;
  clear: both;
}

.p-company-greeting__image {
  float: right;
  width: 10.625rem;
  margin-left: 0.625rem;
  margin-bottom: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-company-greeting__image {
    width: 18.75rem;
    margin-left: 1.875rem;
  }
}

.p-company-greeting__image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
  aspect-ratio: 170/200;
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (min-width: 768px) {
  .p-company-greeting__image img {
    aspect-ratio: 300/360;
  }
}

.p-company-greeting__role {
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-company-greeting__role {
    font-size: max(1rem, 10px);
  }
}

.p-company-greeting__role span {
  font-size: max(1.125rem, 10px);
}
@media screen and (min-width: 768px) {
  .p-company-greeting__role span {
    font-size: max(1.375rem, 10px);
  }
}

.p-company-greeting__text-wrap {
  margin-top: 0.75rem;
  display: grid;
  gap: 0.75rem;
}

.p-company-greeting__text {
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-company-greeting__text {
    font-size: max(1.125rem, 10px);
    line-height: 2;
  }
}

.p-company-record__badge {
  display: inline-block;
  margin-bottom: 0.5rem;
  padding: 0.25rem 1.125rem;
  background-color: var(--color-main);
  color: var(--color-white);
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1.6;
  border-radius: 0.1875rem;
}
@media screen and (min-width: 768px) {
  .p-company-record__badge {
    font-size: max(0.9375rem, 10px);
  }
}

.p-company-record__image {
  margin-top: 1.25rem;
  width: 100%;
  height: auto;
}
@media screen and (min-width: 768px) {
  .p-company-record__image {
    margin-top: 1.875rem;
    max-width: 56.25rem;
    margin-inline: auto;
  }
}

.p-company-record__image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.5rem;
}

.p-company-info__table {
  margin-top: 1.25rem;
  background-color: var(--color-white);
}
@media screen and (min-width: 768px) {
  .p-company-info__table {
    margin-top: 1.875rem;
    max-width: 56.25rem;
    margin-inline: auto;
  }
}

.p-company-info__table tr > * {
  border: 1px solid var(--color-border-line);
}

.p-company-info__table tr:has(> th) {
  background-color: transparent;
}

.p-company-info__table th {
  width: 5.625rem;
  background-color: var(--color-bg-cream);
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  color: var(--color-sub);
  text-align: left;
  vertical-align: top;
}
@media screen and (min-width: 768px) {
  .p-company-info__table th {
    width: 11.25rem;
    font-size: max(1.125rem, 10px);
    padding: 0.9375rem 1.25rem;
  }
}

.p-company-info__table td {
  background-color: var(--color-white);
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.6923076923;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-company-info__table td {
    font-size: max(1.125rem, 10px);
    line-height: 1.7333333333;
    padding: 0.9375rem 1.25rem;
  }
}

.p-company-info__table td a {
  color: var(--color-sub);
  text-decoration: underline;
}

.p-company-info__shop + .p-company-info__shop {
  margin-top: 0.625rem;
}

.p-company-info__shop-name {
  font-weight: 700;
}

.p-company-info__shop-map a {
  display: inline-block;
  font-size: max(0.75rem, 10px);
  font-weight: 700;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-company-info__shop-map a {
    font-size: max(0.8125rem, 10px);
  }
}

.p-company-info__shop-map a::after {
  content: " ▶";
  font-size: max(0.625rem, 10px);
}

.p-company-info__image-wrap {
  margin-top: 1.25rem;
  display: grid;
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-company-info__image-wrap {
    margin-top: 1.875rem;
    max-width: 56.25rem;
    margin-inline: auto;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.25rem;
  }
}

.p-company-info__image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 343/200;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.625rem;
}

.p-company-area__content {
  margin-top: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-company-area__content {
    margin-top: 2.5rem;
    flex-direction: row;
    align-items: center;
    gap: 2.5rem;
    max-width: 62.5rem;
    margin-inline: auto;
  }
}

@media screen and (min-width: 768px) {
  .p-company-area__image {
    width: 45%;
    flex-shrink: 0;
  }
}

.p-company-area__image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
}

@media screen and (min-width: 768px) {
  .p-company-area__body {
    flex: 1;
  }
}

.p-company-area__record {
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-company-area__record {
    font-size: max(1.375rem, 10px);
  }
}

.p-company-area__record span {
  font-family: var(--second-font-family);
  font-size: max(2rem, 10px);
  color: var(--color-accent-red);
  padding: 0 0.375rem;
}
@media screen and (min-width: 768px) {
  .p-company-area__record span {
    font-size: max(2.75rem, 10px);
  }
}

.p-company-area__lead {
  margin-top: 0.875rem;
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  line-height: 1.7;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-company-area__lead {
    font-size: max(1.125rem, 10px);
  }
}

.p-company-area__lead em {
  font-style: normal;
  color: var(--color-main);
}

.p-company-area__area {
  margin-top: 1rem;
}

.p-company-area__area-head {
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-company-area__area-head {
    font-size: max(0.9375rem, 10px);
  }
}

.p-company-area__area-text {
  margin-top: 0.25rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.7;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-company-area__area-text {
    font-size: max(0.9375rem, 10px);
  }
}

.p-company-area__note {
  margin-top: 0.75rem;
  font-size: max(0.75rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-company-area__note {
    font-size: max(0.8125rem, 10px);
  }
}

@media screen and (min-width: 768px) {
  .p-contact__inner.l-inner {
    max-width: 50rem;
  }
}

.p-contact__status-list {
  margin-top: 1.875rem;
  margin-inline: auto;
  display: flex;
  justify-content: space-between;
  max-width: 18.75rem;
  width: 100%;
  counter-reset: number;
}
@media screen and (min-width: 768px) {
  .p-contact__status-list {
    margin-top: 3.125rem;
    max-width: 25rem;
  }
}

.p-contact__status-item {
  width: 5rem;
  height: 5rem;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  border: 1px solid var(--color-main);
  font-size: max(1.25rem, 10px);
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .p-contact__status-item {
    width: 6.25rem;
    height: 6.25rem;
  }
}

.p-contact__status-item.p-contact__status-item--current {
  background-color: var(--color-main);
  color: var(--color-white);
}

.p-contact__banner {
  margin-top: 1.875rem;
}
@media screen and (min-width: 768px) {
  .p-contact__banner {
    margin-top: 3.125rem;
  }
}

.p-contact__banner img {
  width: 100%;
  height: auto;
}

.p-contact__attention {
  margin-top: 1.875rem;
}
@media screen and (min-width: 768px) {
  .p-contact__attention {
    margin-top: 3.125rem;
  }
}

.p-contact__attention-heading {
  font-size: max(1.125rem, 10px);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-contact__attention-heading {
    font-size: max(1.25rem, 10px);
  }
}

.p-contact__attention-item {
  padding-left: 1em;
  position: relative;
}

.p-contact__attention-item::before {
  content: "・";
  position: absolute;
  left: 0;
  top: 0;
}

.p-contact__form {
  margin-top: 3.125rem;
}

.p-contact__line-banner {
  margin-top: 2.5rem;
}
@media screen and (min-width: 768px) {
  .p-contact__line-banner {
    margin-top: 3.75rem;
  }
}

.p-contact__line-banner a {
  display: block;
  transition: 0.3s;
}

.p-contact__line-banner a:hover {
  opacity: 0.8;
}

.p-contact__line-banner img {
  width: 100%;
  height: auto;
}

.p-content h2 {
  margin-block: 3rem 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-content h2 {
    margin-block: 5rem 2rem;
  }
}

.p-content h3 {
  margin-block: 1.875rem 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-content h3 {
    margin-block: 3.75rem 1.25rem;
  }
}

.p-content h4 {
  margin-block: 1.25rem 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-content h4 {
    margin-block: 1.875rem 0.625rem;
  }
}

.p-content h5 {
  margin-block: 0.9375rem 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-content h5 {
    margin-block: 1.25rem 0.625rem;
  }
}

.p-content p {
  margin-block: 0.625rem;
}

.p-content figure,
.p-content > ul,
.p-content > ol,
.p-content .wp-block-table {
  margin-block: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-content figure,
  .p-content > ul,
  .p-content > ol,
  .p-content .wp-block-table {
    margin-block: 1.5rem;
  }
}

.p-content .wp-block-button {
  margin-block: 1.25rem 2rem;
}
@media screen and (min-width: 768px) {
  .p-content .wp-block-button {
    margin-block: 1.5rem 3.5rem;
  }
}

.p-content p,
.p-content li,
.p-content th,
.p-content td {
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 2;
}
@media screen and (min-width: 768px) {
  .p-content p,
  .p-content li,
  .p-content th,
  .p-content td {
    font-size: max(1rem, 10px);
  }
}

.p-content h2 {
  font-size: max(1.25rem, 10px);
  line-height: 2;
  font-weight: 700;
  background: var(--border-line);
}
@media screen and (min-width: 768px) {
  .p-content h2 {
    font-size: max(1.375rem, 10px);
  }
}

.p-content h3 {
  font-size: max(1.125rem, 10px);
  line-height: 2;
  font-weight: 700;
  position: relative;
  display: flex;
  gap: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-content h3 {
    font-size: max(1.25rem, 10px);
  }
}

.p-content h3::before {
  content: "";
  width: 0.3125rem;
  height: 1lh;
  border-radius: 0.625rem;
  background-color: var(--color-main);
}

.p-content h4 {
  font-size: max(1rem, 10px);
  line-height: 2;
  font-weight: 700;
  letter-spacing: 0.05em;
}
@media screen and (min-width: 768px) {
  .p-content h4 {
    font-size: max(1.125rem, 10px);
  }
}

.p-content h5 {
  font-size: max(1rem, 10px);
  line-height: 2;
  font-weight: 700;
  letter-spacing: 0.05em;
}
@media screen and (min-width: 768px) {
  .p-content h5 {
    font-size: max(1.0625rem, 10px);
  }
}

.p-content a:not(.wp-block-button *) {
  color: var(--color-main);
  text-decoration: underline;
  text-underline-offset: 0.125rem;
}

.p-content a[href^="tel:"] {
  text-decoration: underline;
}
@media screen and (min-width: 768px) {
  .p-content a[href^="tel:"] {
    text-decoration: none;
  }
}

.p-content .wp-block-button__link {
  width: 100%;
  min-width: 12.5rem;
  padding: 1.25rem;
  display: inline-block;
  font-size: max(1rem, 10px);
  line-height: 1;
  color: var(--color-white);
  background-color: var(--color-main);
  border: 1px solid var(--color-main);
  text-align: center;
  border-radius: 1.875rem;
  transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out;
}

@media (any-hover: hover) {
  .p-content .wp-block-button__link:hover {
    opacity: 1;
    color: var(--color-main);
    background-color: var(--color-white);
  }
}
.p-content img {
  width: auto;
}

.p-content figure.aligncenter,
.p-content img.aligncenter {
  margin-right: auto;
  margin-left: auto;
}

.p-content figure.alignright,
.p-content img.alignright {
  margin-left: auto;
}

.p-content ol,
.p-content ul {
  list-style: revert;
  padding-left: 1.5em;
}

.p-content .wp-block-table {
  border: none;
}

.p-content .wp-block-table table {
  width: 100%;
  border-spacing: 0;
  border-collapse: collapse;
  border: 1px solid var(--color-border);
}

.p-content .wp-block-table th,
.p-content .wp-block-table td {
  border: 1px solid var(--color-border);
}

.p-content .wp-block-table th:not(:last-child),
.p-content .wp-block-table td:not(:last-child) {
  border-right: 1px solid var(--color-border);
}

.p-content .wp-block-table th,
.p-content .wp-block-table tr:not(:last-child) td {
  border-bottom: 1px solid var(--color-border);
}

.p-content .wp-block-table thead {
  border-bottom: 2px solid var(--color-border);
}

.p-content .wp-block-table tr > * {
  padding: 0.625rem;
  text-align: center;
}

.p-content .wp-block-table tr:has(> th) {
  background-color: var(--color-gray);
}

.p-content em {
  font-style: italic;
}

.p-cta {
  position: relative;
  padding-block: 0.625rem;
  background-image: url("../images/common/cta-bg.webp");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
  color: var(--color-white);
  border-radius: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-cta {
    padding-block: 3.125rem 3.625rem;
    background-image: url("../images/common/cta-bg-pc.webp");
    border-radius: 0;
  }
}

.p-cta__inner.l-inner {
  padding-inline: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-cta__inner.l-inner {
    padding-inline: 1.5625rem;
  }
}

@media screen and (min-width: 768px) {
  .p-cta__content {
    position: relative;
  }
}

.p-cta__lead-wrap {
  margin-top: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-cta__lead-wrap {
    display: flex;
    align-items: center;
    gap: 0.625rem;
  }
}

.p-cta__lead {
  font-size: max(1.75rem, 10px);
  font-weight: 900;
  line-height: 1.3;
}
@media screen and (min-width: 768px) {
  .p-cta__lead {
    font-size: max(2.75rem, 10px);
  }
}

.p-cta__lead.p-cta__lead--large {
  font-size: max(1.875rem, 10px);
}
@media screen and (min-width: 768px) {
  .p-cta__lead.p-cta__lead--large {
    font-size: max(2.9375rem, 10px);
  }
}

.p-cta__lead + .p-cta__lead {
  margin-top: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-cta__lead + .p-cta__lead {
    margin-top: 0;
  }
}

.p-cta__lead-span {
  display: inline-block;
  padding: 0.5rem 0.625rem;
  font-size: max(1.875rem, 10px);
  font-weight: 900;
  line-height: 1;
  background-color: var(--color-main);
  border-radius: 0.3125rem;
}
@media screen and (min-width: 768px) {
  .p-cta__lead-span {
    font-size: max(2.9375rem, 10px);
    padding: 0.9375rem 1.125rem;
  }
}

@media screen and (min-width: 768px) {
  .p-cta__tel-wrap {
    margin-top: 1.5625rem;
    display: grid;
    grid-template-columns: 1.45fr 1fr;
    align-items: center;
    gap: 1.25rem;
  }
}

@media screen and (min-width: 768px) {
  .p-cta__tap-wrap {
    height: 100%;
  }
}

.p-cta__tap-wrap a {
  display: block;
  position: relative;
  z-index: 1;
  background-color: var(--color-tel-green);
  padding: 0.9375rem 0.3125rem;
  border-radius: 0.3125rem;
  text-align: center;
  margin-top: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-cta__tap-wrap a {
    margin-top: 0;
    height: 100%;
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
  }
}

.p-cta__tap {
  font-size: max(1.25rem, 10px);
  font-weight: 900;
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .p-cta__tap {
    font-size: max(1.9375rem, 10px);
  }
}

.p-cta__tel-num {
  margin-top: 0.375rem;
  display: inline-flex;
  align-items: center;
  gap: 0.3125rem;
  font-family: var(--second-font-family);
  font-size: max(2.6875rem, 10px);
  font-weight: 700;
  color: var(--color-white);
  line-height: 1;
  white-space: nowrap;
}
@media screen and (min-width: 768px) {
  .p-cta__tel-num {
    font-size: max(4.1875rem, 10px);
  }
}

.p-cta__tel-icon {
  width: 3.3125rem;
  height: auto;
}
@media screen and (min-width: 768px) {
  .p-cta__tel-icon {
    width: 5.125rem;
  }
}

.p-cta__hours {
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.4;
}
@media screen and (min-width: 768px) {
  .p-cta__hours {
    font-size: max(1.3125rem, 10px);
  }
}

.p-cta__buttons {
  margin-top: 0.375rem;
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-cta__buttons {
    margin-top: 0;
  }
}

.p-cta__button a {
  display: block;
  position: relative;
  z-index: 1;
  background-color: var(--color-white);
  border-radius: 0.3125rem;
}

.p-cta__button-img {
  overflow: hidden;
  border-radius: 0.3125rem 0.3125rem 0 0;
}

.p-cta__button-img img {
  aspect-ratio: 180/130;
  -o-object-fit: cover;
     object-fit: cover;
  height: auto;
  width: 100%;
  transition: transform 0.3s ease;
}
@media screen and (min-width: 768px) {
  .p-cta__button-img img {
    aspect-ratio: 23/13;
  }
}

@media (any-hover: hover) {
  .p-cta__button a:hover {
    opacity: 1;
  }
  .p-cta__button a:hover .p-cta__button-img img {
    transform: scale(1.08);
  }
}
.p-cta__button-label {
  padding: 0.9375rem;
  border-radius: 0.3125rem;
  font-size: max(1.25rem, 10px);
  font-weight: 700;
  color: var(--color-main);
  line-height: 1;
  position: relative;
}

.p-cta__button-label::after {
  content: "";
  position: absolute;
  right: 0.625rem;
  top: 50%;
  transform: translateY(-50%);
  display: inline-block;
  width: 1.625rem;
  height: 1.625rem;
  background-image: url("../images/common/arrow-orange.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}

/* 人物写真は3種あり、切り抜きの縦横比が微妙に違う。
   width 基準だと人物の大きさが揃わないので height 基準にする。
   SP の高さは top の計算にも使うので変数にまとめておく（2箇所で同じ式を書かないため）。 */
.p-cta__deco {
  position: absolute;
  /* SPは中央基準で配置（広めのSP幅でも右端に張り付いてはみ出さない）。
     height は vw で画面幅に追従（375px 時に約115px・上限200px）。
     top を固定にすると height が増えたぶん下に伸びて電話ボタンにかぶるので、
     「足元の位置（帯の上端から162px）」を固定して、大きくなるぶんは上へ伸ばす。
     162px = 375px 時のベスト値（top 47px ＋ height 約115px）。
     計算式にしてあるので、height を変えても足元はズレない。 */
  right: auto;
  left: min(50% + 4.375rem, 100% - 9.375rem);
  width: auto;
  height: min(30.7692307692vw, 12.5rem);
  top: calc(10.125rem - min(30.7692307692vw, 12.5rem));
  z-index: 0;
}
@media screen and (min-width: 768px) {
  .p-cta__deco {
    left: auto;
    right: 0;
    /* 人物の足元を「お問い合わせ/来店予約」バナーの上端にぴったり付ける。
       top ではなく bottom 基準にしているので、画像の高さを変えても接地位置はズレない。
       bottom の値＝バナー2枚（.p-cta__buttons）の高さ。バナーは l-inner 内のグリッドなので
       画面幅 768〜1250px では幅に比例して伸縮し、l-inner が 1250px で頭打ちになる 1250px 超では
       高さが固定になる。そのため fluid-size の上限ブレイクポイントを 1250px にしてある。
       実測値：768px→約108px / 1250px以上→約183px。
       ※ vwpc() は _function.scss が $width-pc を参照しているが実際の変数名は $pc-width で、未定義のため使えない。 */
    top: auto;
    bottom: clamp(108px, 108px + 75 * (100vw - 768px) / 482, 183px);
    height: clamp(178px, 178px + 122 * (100vw - 768px) / 482, 300px);
  }
}

.p-design-concerns {
  background-color: var(--color-bg-cream);
}

@media screen and (min-width: 768px) {
  .p-design-concerns__inner {
    max-width: 50rem;
  }
}

.p-design-concerns__box {
  margin-top: 1.25rem;
  padding: 1.25rem 1rem;
  background-color: var(--color-white);
  border-radius: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-design-concerns__box {
    margin-top: 2rem;
    padding: 2rem 2.5rem;
  }
}

.p-design-concerns__list .p-list__item em {
  color: var(--color-main);
  font-style: normal;
  font-weight: 700;
}

@media screen and (min-width: 768px) {
  .p-design-cta {
    padding-block-start: 2.5rem;
  }
}

.p-design-cta .p-cta {
  border-top-right-radius: 0;
  border-top-left-radius: 0;
}

.p-design-flow {
  padding-block: 2.5rem;
  background-color: var(--color-white);
}
@media screen and (min-width: 768px) {
  .p-design-flow {
    padding-block: 5rem;
  }
}

.p-design-flow__steps {
  margin-top: 0.625rem;
  counter-reset: none;
  display: grid;
  gap: 2.1875rem;
}
@media screen and (min-width: 768px) {
  .p-design-flow__steps {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 2.5rem;
    margin-top: 2.5rem;
  }
}

.p-design-flow__step {
  position: relative;
  display: grid;
  grid-template-columns: 1fr 1fr;
  background-color: var(--color-white);
  border-radius: 0.625rem;
  box-shadow: 0 0.625rem 0.625rem rgba(0, 0, 0, 0.1);
}
@media screen and (min-width: 768px) {
  .p-design-flow__step {
    grid-template-columns: 1fr;
    grid-template-rows: auto 1fr;
  }
}

.p-design-flow__step:not(:last-child)::after {
  content: "";
  position: absolute;
  bottom: -0.625rem;
  left: 50%;
  width: 2.1875rem;
  aspect-ratio: 35/18.36;
  background: url("../images/design/arrow_down.svg") center/contain no-repeat;
  transform: translate(-50%, 50%);
}
@media screen and (min-width: 768px) {
  .p-design-flow__step:not(:last-child)::after {
    top: 50%;
    right: -1.25rem;
    bottom: auto;
    left: auto;
    width: 3.75rem;
    transform: translate(50%, -50%) rotate(-90deg);
  }
}

.p-design-flow__step-body {
  display: flex;
  flex-direction: column;
  justify-content: center;
  padding: 1rem 0.75rem;
  background-color: var(--color-bg-cream);
  border-radius: 0.625rem 0 0 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-design-flow__step-body {
    align-self: start;
    height: 100%;
    padding: 1.25rem;
    border-radius: 0 0 0.625rem 0.625rem;
  }
}

.p-design-flow__step-num {
  color: var(--color-sub);
  font-size: max(0.875rem, 10px);
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .p-design-flow__step-num {
    font-size: max(1.25rem, 10px);
  }
}

.p-design-flow__step-title {
  margin-top: 0.25rem;
  color: var(--color-main);
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
@media screen and (min-width: 768px) {
  .p-design-flow__step-title {
    font-size: max(1.25rem, 10px);
  }
}

.p-design-flow__step-text {
  margin-top: 0.25rem;
  color: var(--color-sub);
  font-size: max(0.75rem, 10px);
  font-weight: 500;
  line-height: 1.6;
}
@media screen and (min-width: 768px) {
  .p-design-flow__step-text {
    flex: 1;
    font-size: max(1rem, 10px);
  }
}

.p-design-flow__step-image {
  overflow: hidden;
  aspect-ratio: 175/142;
  border-radius: 0 0.625rem 0.625rem 0;
}
@media screen and (min-width: 768px) {
  .p-design-flow__step-image {
    aspect-ratio: 16/11;
    order: -1;
    border-radius: 0.625rem 0.625rem 0 0;
  }
}

.p-design-flow__step-image img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.p-design-intro {
  margin-block-start: 0.625rem;
  position: relative;
  overflow: hidden;
  color: var(--color-white);
}
@media screen and (min-width: 768px) {
  .p-design-intro {
    margin-block-start: 1.875rem;
  }
}

.p-design-intro__inner {
  z-index: 1;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-design-intro__inner {
    position: relative;
    max-width: 50rem;
  }
}

.p-design-intro__bg {
  position: absolute;
  inset: 0;
  z-index: 0;
}

.p-design-intro__bg img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.p-design-intro__content {
  position: relative;
  padding-inline: 1.125rem;
  padding-block: 4.375rem 3.5rem;
}

/* 画像自体にオーバーレイを含んでいる */
.p-design-intro__en {
  font-size: max(0.875rem, 10px);
  font-family: var(--second-font-family);
  font-weight: 700;
  letter-spacing: 0.06em;
}

.p-design-intro__title {
  font-size: max(1.5rem, 10px);
  font-weight: 700;
  line-height: 1.35;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
@media screen and (min-width: 768px) {
  .p-design-intro__title {
    font-size: max(2.5rem, 10px);
  }
}

.p-design-intro__lead {
  margin-top: 1.625rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.6;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
@media screen and (min-width: 768px) {
  .p-design-intro__lead {
    font-size: max(1.25rem, 10px);
  }
}

.p-design-intro__text {
  margin-top: 0.625rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7;
  text-align: left;
}
@media screen and (min-width: 768px) {
  .p-design-intro__text {
    margin-inline: auto;
    max-width: 40rem;
    font-size: max(1rem, 10px);
    text-align: center;
  }
}

.p-design-points {
  background-color: var(--color-bg-cream);
}

.p-design-points__head {
  margin-inline: -0.75rem;
}
@media screen and (min-width: 768px) {
  .p-design-points__head {
    margin-inline: 0;
  }
}

.p-design-points__items {
  margin-top: 0.875rem;
}
@media screen and (min-width: 768px) {
  .p-design-points__items {
    margin-top: 5rem;
    display: flex;
    flex-direction: column;
    gap: 2.5rem;
  }
}

.p-design-points__item {
  margin-inline: calc(50% - 50vw);
  margin-inline: calc(50% - 50cqi);
  padding-inline: calc(50vw - 50%);
  padding-inline: calc(50cqi - 50%);
  padding-block: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-design-points__item {
    margin-inline: 0;
    padding-block: 0;
    padding-inline: 0;
    display: flex;
    align-items: center;
    gap: 2.5rem;
  }
}

.p-design-points__item:nth-child(odd) {
  background-color: #f3e2b9;
}
@media screen and (min-width: 768px) {
  .p-design-points__item:nth-child(odd) {
    background-color: transparent;
  }
}

.p-design-points__item:nth-child(even) {
  background-color: #fcf8ee;
}
@media screen and (min-width: 768px) {
  .p-design-points__item:nth-child(even) {
    background-color: transparent;
    flex-direction: row-reverse;
  }
}

.p-design-points__item-image {
  overflow: hidden;
  aspect-ratio: 350/200;
  border-radius: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-design-points__item-image {
    position: relative;
    flex: 1;
    min-width: 0;
  }
}

.p-design-points__item-image img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.p-design-points__item-body {
  margin-top: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-design-points__item-body {
    flex: 1;
    min-width: 0;
    margin-top: 0;
    min-height: 25rem;
    padding-block: 2.5rem;
    display: flex;
    flex-direction: column;
    gap: 1.25rem;
    justify-content: center;
  }
}

@media screen and (min-width: 768px) {
  .p-design-points__item:nth-child(odd) .p-design-points__item-body {
    margin-inline: -5rem calc(50% - 50vw);
    padding-inline: 5rem calc(50vw - 50%);
    background-color: #fff;
    border-radius: 1.25rem 0 0 1.25rem;
  }
}

@media screen and (min-width: 768px) {
  .p-design-points__item:nth-child(even) .p-design-points__item-body {
    margin-inline: calc(50% - 50vw) -5rem;
    padding-inline: calc(50vw - 50%) 5rem;
    background-color: #f3e2b9;
    border-radius: 0 1.25rem 1.25rem 0;
  }
}

.p-design-points__item-label {
  color: var(--color-main);
  font-size: max(0.625rem, 10px);
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .p-design-points__item-label {
    font-size: max(1.75rem, 10px);
  }
}

.p-design-points__item-title {
  margin-top: 0.125rem;
  color: var(--color-sub);
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
@media screen and (min-width: 768px) {
  .p-design-points__item-title {
    font-size: max(1.75rem, 10px);
  }
}

.p-design-points__item-text {
  margin-top: 0.3125rem;
  color: var(--color-sub);
  font-weight: 500;
  line-height: 1.4285714286;
}

.p-design-showroom {
  background-color: var(--color-bg-cream);
}

@media screen and (min-width: 768px) {
  .p-design-showroom__inner {
    margin-inline: auto;
    max-width: 43.75rem;
  }
}

.p-design-showroom__lead {
  margin-top: 0.3125rem;
  color: var(--color-sub);
  font-size: max(1.125rem, 10px);
  font-weight: 500;
  line-height: 1.7;
  text-align: center;
  margin-inline: -0.3125rem;
}
@media screen and (min-width: 768px) {
  .p-design-showroom__lead {
    margin-inline: 0;
    font-size: max(1.5rem, 10px);
  }
}

.p-design-showroom__name {
  margin-top: 0.8125rem;
  padding-block: 0.375rem;
  background-color: var(--color-main);
  border-radius: 0.5rem;
  color: var(--color-white);
  font-size: max(1rem, 10px);
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-design-showroom__name {
    font-size: max(1.25rem, 10px);
  }
}

.p-design-showroom__media {
  margin-top: 0.5rem;
  display: grid;
  gap: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-design-showroom__media {
    margin-top: 1.5rem;
    gap: 1.875rem;
  }
}

.p-design-showroom__image {
  overflow: hidden;
  aspect-ratio: 16/11;
  border-radius: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-design-showroom__image {
    aspect-ratio: auto;
  }
}

.p-design-showroom__image img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.p-design-showroom__map {
  overflow: hidden;
  aspect-ratio: 16/11;
  border-radius: 0.625rem;
}
.p-design-showroom__map iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

@media screen and (min-width: 768px) {
  .p-design-showroom__table {
    align-self: start;
    margin-top: 0;
  }
}

.p-design-showroom__row {
  display: grid;
  grid-template-columns: 4.75rem 1fr;
}
@media screen and (min-width: 768px) {
  .p-design-showroom__row {
    grid-template-columns: 8rem 1fr;
  }
}

.p-design-showroom__row dt {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 0.8125rem 0.5rem;
  background-color: var(--color-main);
  border-block-end: 1px solid #d7460a;
  color: var(--color-white);
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  text-align: left;
}
@media screen and (min-width: 768px) {
  .p-design-showroom__row dt {
    font-size: max(1.125rem, 10px);
  }
}

.p-design-showroom__row:first-child dt {
  border-block-start: 1px solid #d7460a;
}

.p-design-showroom__row dd {
  display: flex;
  align-items: center;
  padding: 0.8125rem 0.875rem;
  background-color: var(--color-white);
  border-block-end: 1px solid var(--color-border-line);
  color: var(--color-sub);
  font-size: max(0.875rem, 10px);
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  .p-design-showroom__row dd {
    font-size: max(1.125rem, 10px);
  }
}

.p-design-showroom__row:first-child dd {
  border-block-start: 1px solid var(--color-border-line);
}

.p-design-showroom__note {
  margin-top: 1rem;
  color: var(--color-sub);
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.4444444444;
  text-align: center;
  word-break: keep-all;
  overflow-wrap: anywhere;
}

.p-design-showroom__button {
  margin-top: 1.25rem;
  text-align: center;
}

.p-design-works__roofs {
  margin-top: 0.8125rem;
}
@media screen and (min-width: 768px) {
  .p-design-works__roofs {
    margin-inline: auto;
    margin-top: 2rem;
    max-width: 43.75rem;
  }
}

.p-design-works__roof-image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
}

.p-design-works__lead {
  margin-top: 0.4375rem;
  color: var(--color-sub);
  font-weight: 500;
  line-height: 1.4285714286;
}
@media screen and (min-width: 768px) {
  .p-design-works__lead {
    margin-top: 2.5rem;
    margin-inline: auto;
    max-width: 43.75rem;
    text-align: center;
  }
}

.p-design-works__bas {
  margin-top: 1.4375rem;
  display: grid;
  gap: 1.5rem;
}
@media screen and (min-width: 768px) {
  .p-design-works__bas {
    margin-top: 2.5rem;
    margin-inline: auto;
    gap: 1.5rem;
    max-width: 43.75rem;
  }
}

.p-design-works__ba-figure {
  position: relative;
}

.p-design-works__ba-image {
  overflow: hidden;
  border-radius: 0.625rem;
}

.p-design-works__ba-image img {
  display: block;
  width: 100%;
  height: auto;
}

.p-design-works__ba-badge {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  aspect-ratio: 1/1;
  width: 6rem;
  border-radius: 50%;
  background-color: #fff;
  text-align: center;
  line-height: 1.3;
}
@media screen and (min-width: 768px) {
  .p-design-works__ba-badge {
    width: 8rem;
  }
}

.p-design-works__ba-badge-num {
  color: var(--color-main);
  font-size: max(0.75rem, 10px);
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .p-design-works__ba-badge-num {
    font-size: max(1rem, 10px);
  }
}

.p-design-works__ba-badge-label {
  margin-top: 0.125rem;
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .p-design-works__ba-badge-label {
    font-size: max(1.125rem, 10px);
  }
}

.p-design-works__ba-labels {
  margin-top: 0.1875rem;
  display: grid;
  grid-template-columns: 1fr 1fr;
  padding-inline: 0.25rem;
  color: var(--color-black);
  font-weight: 700;
}

.p-design-works__ba-label {
  font-size: max(0.875rem, 10px);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-design-works__ba-label {
    font-size: max(1.25rem, 10px);
  }
}

.p-diagnosis-blog {
  margin-inline: calc(50% - 50vw);
  margin-inline: calc(50% - 50cqi);
  padding-block: 1.875rem;
  padding-inline: calc(50vw - 50%);
  padding-inline: calc(50cqi - 50%);
}
@media screen and (min-width: 768px) {
  .p-diagnosis-blog {
    margin-inline: 0;
    padding: 0;
  }
}

@media screen and (min-width: 768px) {
  .p-diagnosis-blog[data-bg="100"] {
    background-color: transparent;
  }
}

.p-diagnosis-blog__list {
  margin-top: 0.8125rem;
}

.p-diagnosis-blog__item {
  border-block-start: 1px solid var(--color-border-line);
}

.p-diagnosis-blog__link {
  display: grid;
  grid-template-columns: 9.375rem 1fr;
  gap: 0.75rem;
  padding-block: 0.875rem;
  text-decoration: none;
}

.p-diagnosis-blog__thumb {
  overflow: hidden;
  border-radius: 0.5rem;
}

.p-diagnosis-blog__thumb img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 3/2;
  -o-object-fit: cover;
     object-fit: cover;
}

.p-diagnosis-blog__body {
  padding-block-start: 0.25rem;
}

.p-diagnosis-blog__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  align-items: center;
}

.p-diagnosis-blog__date {
  color: var(--color-sub);
  font-size: max(0.875rem, 10px);
  font-weight: 700;
}

.p-diagnosis-blog__cat {
  display: inline-block;
  padding: 0.1875rem 0.75rem;
  background-color: var(--color-main);
  border-radius: 0.25rem;
  color: var(--color-white);
  font-size: max(0.75rem, 10px);
  font-weight: 700;
  line-height: 1.4;
}

.p-diagnosis-blog__item-title {
  margin-top: 0.375rem;
  color: var(--color-main);
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  overflow: hidden;
}
@media screen and (min-width: 768px) {
  .p-diagnosis-blog__item-title {
    -webkit-line-clamp: 2;
  }
}

.p-diagnosis-check {
  background-color: var(--color-bg-cream);
}

.p-diagnosis-check__inner {
  scroll-margin-top: 5rem;
}

.p-diagnosis-check__head {
  text-align: center;
}

.p-diagnosis-check__lead {
  color: var(--color-sub);
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.5;
}
@media screen and (min-width: 768px) {
  .p-diagnosis-check__lead {
    font-size: max(1.5rem, 10px);
  }
}

.p-diagnosis-check__groups {
  display: grid;
  gap: 1.875rem;
  margin-top: 1rem;
}

.p-diagnosis-check__group {
  display: grid;
  gap: 1rem;
}

.p-diagnosis-check__cat {
  padding-block: 0.5rem;
  background-color: var(--color-white);
  border-radius: 0.5rem;
  color: var(--color-main);
  font-size: max(1rem, 10px);
  font-weight: 700;
  text-align: center;
  scroll-margin-top: 5rem;
}
@media screen and (min-width: 768px) {
  .p-diagnosis-check__cat {
    font-size: max(1.875rem, 10px);
  }
}

.p-diagnosis-check__list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.25rem 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-diagnosis-check__list {
    grid-template-columns: repeat(4, 1fr);
    gap: 2.5rem 2rem;
  }
}

.p-diagnosis-check__item-image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.3125rem;
}
@media screen and (min-width: 768px) {
  .p-diagnosis-check__item-image img {
    border-radius: 0.625rem;
  }
}

.p-diagnosis-check__item-title {
  margin-top: 0.5rem;
  color: var(--color-sub);
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1.4;
}
@media screen and (min-width: 768px) {
  .p-diagnosis-check__item-title {
    font-size: max(1.125rem, 10px);
  }
}

.p-diagnosis-check__item-text {
  margin-top: 0.25rem;
  color: var(--color-sub);
  font-size: max(0.6875rem, 10px);
  font-weight: 500;
  line-height: 1.5;
}
@media screen and (min-width: 768px) {
  .p-diagnosis-check__item-text {
    font-size: max(0.875rem, 10px);
  }
}

.p-diagnosis-check__closing {
  margin-top: 2rem;
}
@media screen and (min-width: 768px) {
  .p-diagnosis-check__closing {
    display: grid;
    grid-template-columns: 1fr 1fr;
    gap: 2.5rem;
    align-items: center;
    margin-top: 3rem;
  }
}

.p-diagnosis-check__summary {
  display: flex;
  gap: 0.5rem;
  align-items: end;
}
@media screen and (min-width: 768px) {
  .p-diagnosis-check__summary {
    order: 2;
    align-items: center;
    justify-content: center;
  }
}

.p-diagnosis-check__summary-text {
  color: var(--color-sub);
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  word-break: keep-all;
  overflow-wrap: anywhere;
}

.p-diagnosis-check__summary-text + .p-diagnosis-check__summary-text {
  margin-top: 1rem;
}

.p-diagnosis-check__summary-text em {
  color: var(--color-main);
  font-style: normal;
}

.p-diagnosis-check__summary-mascot {
  width: 6.875rem;
}

.p-diagnosis-check__summary-mascot img {
  display: block;
  width: 100%;
  height: auto;
}

.p-diagnosis-check__point {
  margin-top: 1.5rem;
}
@media screen and (min-width: 768px) {
  .p-diagnosis-check__point {
    order: 1;
    margin-top: 0;
  }
}

.p-diagnosis-check__point-figure img {
  display: block;
  width: 100%;
  height: auto;
}

.p-diagnosis-check__point-caption {
  margin-top: 0.75rem;
  color: var(--color-sub);
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  text-align: center;
  word-break: keep-all;
  overflow-wrap: anywhere;
}

.p-diagnosis-detail {
  background-color: var(--color-bg-cream);
}

.p-diagnosis-detail__items {
  display: grid;
  gap: 1.0625rem;
}
@media screen and (min-width: 768px) {
  .p-diagnosis-detail__items {
    grid-template-columns: repeat(3, 1fr);
    gap: 2.5rem;
  }
}

.p-diagnosis-detail__title {
  color: var(--color-sub);
  font-size: max(1.375rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
@media screen and (min-width: 768px) {
  .p-diagnosis-detail__title {
    font-size: max(1.25rem, 10px);
    text-align: center;
  }
}

.p-diagnosis-detail__title em {
  color: var(--color-main);
}

.p-diagnosis-detail__title span {
  font-size: max(1.125rem, 10px);
}
@media screen and (min-width: 768px) {
  .p-diagnosis-detail__title span {
    font-size: max(1rem, 10px);
  }
}

.p-diagnosis-detail__media {
  margin-top: 0.625rem;
}

.p-diagnosis-detail__media img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
}

.p-diagnosis-detail__text {
  margin-top: 0.4375rem;
  color: var(--color-sub);
  font-weight: 500;
  line-height: 1.7;
}

.p-diagnosis-related {
  background-color: var(--color-bg-cream);
}

@media screen and (min-width: 768px) {
  .p-diagnosis-related__cols {
    display: grid;
    grid-template-columns: 1fr 21.875rem;
    gap: 3.75rem;
    align-items: start;
  }
}

.p-diagnosis-works {
  margin-top: 2.5rem;
}
@media screen and (min-width: 768px) {
  .p-diagnosis-works {
    margin-top: 0;
  }
}

.p-diagnosis-works__slider {
  margin-top: 1.25rem;
}

.p-diagnosis-works__link {
  display: block;
  text-decoration: none;
}

.p-diagnosis-works__image {
  overflow: hidden;
  aspect-ratio: 350/290;
  border-radius: 0.625rem;
}

.p-diagnosis-works__image img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.p-diagnosis-works__item-title {
  margin-top: 0.375rem;
  color: var(--color-sub);
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.5;
}

.p-diagnosis-works__item-text {
  margin-top: 0.5rem;
  color: var(--color-sub);
  font-weight: 500;
  line-height: 1.6;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
  overflow: hidden;
}

.p-diagnosis-works__slider .splide__arrows {
  top: 37%;
  inset-inline: -1.25rem;
  width: auto;
}

.p-diagnosis-works__slider .splide__arrow {
  width: 2.75rem;
  height: 2.75rem;
  background-color: var(--color-accent-green);
  opacity: 1;
}

.p-diagnosis-works__slider .splide__arrow svg {
  fill: var(--color-white);
  width: 0.875rem;
  height: 0.875rem;
}

.p-diagnosis-works__slider .splide__arrow--prev {
  left: 0.5rem;
}

.p-diagnosis-works__slider .splide__arrow--next {
  right: 0.5rem;
}

.p-faq__list {
  margin-top: 1.25rem;
  display: grid;
  gap: 1.75rem;
}
@media screen and (min-width: 768px) {
  .p-faq__list {
    margin-top: 1.875rem;
    gap: 2.5rem;
    max-width: 56.25rem;
    margin-inline: auto;
  }
}

/* 質問（白＋影バー） */
.p-faq__q {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  background-color: var(--color-white);
  border-radius: 0.5rem;
  box-shadow: 0 0 0.625rem 0 rgba(0, 0, 0, 0.08);
  padding: 1.125rem 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-faq__q {
    gap: 1.125rem;
    padding: 1.5rem 2rem;
  }
}

.p-faq__q-text {
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-faq__q-text {
    font-size: max(1.25rem, 10px);
  }
}

/* 回答（バーの下） */
.p-faq__a {
  margin-top: 0.75rem;
  display: flex;
  gap: 0.625rem;
  padding-inline: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-faq__a {
    margin-top: 0.875rem;
    gap: 1.125rem;
    padding-inline: 2rem;
  }
}

.p-faq__a-text {
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.8;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-faq__a-text {
    font-size: max(0.9375rem, 10px);
  }
}

/* p-content の上下 margin を先頭/末尾で打ち消してマークと揃える */
.p-faq__a-text > :first-child {
  margin-top: 0;
}

.p-faq__a-text > :last-child {
  margin-bottom: 0;
}

/* Q / A の丸マーク */
.p-faq__mark {
  flex-shrink: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.875rem;
  height: 1.875rem;
  border-radius: 50%;
  font-size: max(1rem, 10px);
  font-weight: 700;
  font-family: var(--second-font-family);
  line-height: 1;
  color: var(--color-white);
}
@media screen and (min-width: 768px) {
  .p-faq__mark {
    width: 2.375rem;
    height: 2.375rem;
    font-size: max(1.25rem, 10px);
  }
}

.p-faq__mark--q {
  background-color: var(--color-main);
}

.p-faq__mark--a {
  background-color: var(--color-sub);
}

@media screen and (min-width: 768px) {
  .p-first-intro__inner {
    max-width: 47.5rem;
  }
}

.p-first-intro__title {
  font-size: max(1.5rem, 10px);
  font-weight: 700;
  line-height: 1.3333333333;
  color: var(--color-sub);
  word-break: keep-all;
  overflow-wrap: anywhere;
}
@media screen and (min-width: 768px) {
  .p-first-intro__title {
    font-size: max(2rem, 10px);
    text-align: center;
  }
}

.p-first-intro__title em {
  color: var(--color-main);
}

.p-first-intro__text-wrap {
  margin-top: 0.5rem;
}
@media screen and (min-width: 768px) {
  .p-first-intro__text-wrap {
    margin-top: 1.5rem;
  }
}

.p-first-intro__text {
  font-weight: 500;
  line-height: 1.4285714286;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-first-intro__text {
    line-height: 1.875;
  }
}

.p-first-intro__worry {
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-first-intro__worry {
    line-height: 1.875;
  }
}

.p-first-secret[data-bg="100"] {
  padding-block: 1.25rem 1.875rem;
  margin-bottom: 0;
}
@media screen and (min-width: 768px) {
  .p-first-secret[data-bg="100"] {
    padding-block: 3.75rem;
    margin-bottom: 0;
  }
}

.p-first-secret__band {
  margin-inline: -0.625rem;
  padding: 0.3125rem;
  background-color: var(--color-main);
  border-radius: 0.5rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-white);
  text-align: center;
  font-family: var(--second-font-family);
}
@media screen and (min-width: 768px) {
  .p-first-secret__band {
    padding: 0.625rem;
    font-size: max(1.375rem, 10px);
    border-radius: 0.625rem;
  }
}

.p-first-secret__title {
  margin-top: 0.5rem;
  font-size: max(1.375rem, 10px);
  font-weight: 700;
  line-height: 1.1818181818;
  color: var(--color-sub);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-first-secret__title {
    margin-top: 1.875rem;
    font-size: max(2rem, 10px);
  }
}

.p-first-secret__title em {
  color: var(--color-main);
}

.p-first-secret__title span {
  font-size: max(1.125rem, 10px);
}
@media screen and (min-width: 768px) {
  .p-first-secret__title span {
    font-size: max(1.875rem, 10px);
  }
}

.p-first-secret__media {
  margin-top: 0.8125rem;
}
@media screen and (min-width: 768px) {
  .p-first-secret__media {
    margin-top: 1.875rem;
    display: grid;
    grid-template-columns: 23.75rem 1fr;
    gap: 2.5rem;
    align-items: start;
    max-width: 55rem;
    margin-inline: auto;
  }
}

@media screen and (min-width: 768px) {
  .p-first-secret__media--stack {
    grid-template-columns: 1fr;
    gap: 0;
    max-width: 43.75rem;
  }
}

.p-first-secret__media-image {
  margin-block-start: 0.8125rem;
}
@media screen and (min-width: 768px) {
  .p-first-secret__media-image {
    margin-block-start: 0;
    max-width: none;
  }
}

.p-first-secret__media-image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.5rem;
}

.p-first-secret__text-wrap {
  margin-top: 1.125rem;
  display: grid;
  gap: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-first-secret__text-wrap {
    margin-top: 1.875rem;
    max-width: 43.75rem;
    margin-inline: auto;
  }
}

.p-first-secret__media-text-wrap {
  margin-top: 1.125rem;
  display: grid;
  gap: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-first-secret__media-text-wrap {
    margin-top: 0;
    max-width: none;
  }
}

@media screen and (min-width: 768px) {
  .p-first-secret__media-text-wrap--stack {
    margin-top: 1.125rem;
  }
}

.p-first-secret__text {
  font-weight: 500;
  line-height: 1.4285714286;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-first-secret__text {
    line-height: 1.875;
  }
}

.p-first-secret__text--strong {
  font-weight: 700;
  font-size: max(1rem, 10px);
}
@media screen and (min-width: 768px) {
  .p-first-secret__text--strong {
    font-size: max(1.125rem, 10px);
    text-align: center;
  }
}

.p-first-secret__image {
  margin-block-start: 2.5rem;
}
@media screen and (min-width: 768px) {
  .p-first-secret__image {
    max-width: 36.25rem;
    margin-inline: auto;
  }
}

.p-first-secret__image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.5rem;
}

.p-first-secret__trouble-data {
  margin-top: 1.25rem;
  display: grid;
  gap: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-first-secret__trouble-data {
    margin-top: 1.875rem;
    gap: 1.25rem;
    /* PCは横並び。1枚を大きく出すと画像が拡大されてぼやけるため */
    grid-template-columns: repeat(2, 1fr);
    align-items: start;
    max-width: 55rem;
    margin-inline: auto;
  }
}

.p-first-secret__trouble-data-item img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.5rem;
  background-color: var(--color-white);
}

.p-first-secret__graph-note {
  margin-top: 0.5rem;
  display: grid;
  gap: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-first-secret__graph-note {
    margin-top: 1.875rem;
    max-width: none;
    margin-inline: 0;
    text-align: left;
  }
}

.p-first-secret__selection-points {
  margin-top: 1.875rem;
  display: grid;
  gap: 1.5625rem;
}
@media screen and (min-width: 768px) {
  .p-first-secret__selection-points {
    margin-top: 2.5rem;
    grid-template-columns: 1fr;
    gap: 2.5rem;
    max-width: 55rem;
    margin-inline: auto;
  }
}

@media screen and (min-width: 768px) {
  .p-first-secret__selection-point {
    display: grid;
    grid-template-columns: 1fr 23.75rem;
    -moz-column-gap: 2.5rem;
         column-gap: 2.5rem;
    align-items: start;
  }
}

.p-first-secret__selection-point-title {
  padding: 0.5rem;
  background-color: var(--color-white);
  border-radius: 0.5rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-main);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-first-secret__selection-point-title {
    grid-column: 1;
    grid-row: 1;
    margin-inline: 0;
    max-width: none;
    font-size: max(1.375rem, 10px);
    border-radius: 1.875rem;
  }
}

.p-first-secret__selection-point-text-wrap {
  margin-top: 1.125rem;
  display: grid;
  gap: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-first-secret__selection-point-text-wrap {
    grid-column: 1;
    grid-row: 2;
    margin-top: 0;
    max-width: none;
  }
}

.p-first-secret__selection-point-image {
  margin-block-start: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-first-secret__selection-point-image {
    grid-column: 2;
    grid-row: 1/span 2;
    margin-top: 0;
    max-width: none;
    align-self: start;
  }
}

.p-first-secret__selection-point-image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.5rem;
}

.p-first-secret__price-table {
  margin-top: 0.8125rem;
}
@media screen and (min-width: 768px) {
  .p-first-secret__price-table {
    margin-top: 1.875rem;
    max-width: 43.75rem;
    margin-inline: auto;
  }
}

.p-first-secret__maintenance-chart {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-first-secret__maintenance-chart {
    margin-top: 1.875rem;
    max-width: 43.75rem;
    margin-inline: auto;
  }
}

.p-first-secret__maintenance-chart img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.5rem;
  background-color: var(--color-white);
}

.p-first-secret__damage-photo {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-first-secret__damage-photo {
    margin-top: 1.875rem;
    max-width: 43.75rem;
    margin-inline: auto;
  }
}

.p-first-secret__damage-photo img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.5rem;
}

.p-first-secret__process-flow-wrap {
  margin-top: 0.5rem;
  padding: 0.1875rem 0.4375rem;
  background-color: var(--color-white);
  border-radius: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-first-secret__process-flow-wrap {
    margin-top: 2.5rem;
    max-width: 43.75rem;
    margin-inline: auto;
    padding: 1.5rem 1.25rem;
  }
}

.p-first-secret__process-flow-image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.5rem;
}

.p-first-secret__record-points {
  margin-top: 1.25rem;
  display: grid;
  gap: 1rem;
}
@media screen and (min-width: 768px) {
  .p-first-secret__record-points {
    margin-top: 1.875rem;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
  }
}

.p-first-secret__record-point {
  padding: 0.5rem 0.625rem 0.625rem;
  background-color: var(--color-white);
  border-radius: 0.625rem;
  display: flex;
  flex-direction: column;
}
@media screen and (min-width: 768px) {
  .p-first-secret__record-point {
    padding: 1.25rem;
  }
}

.p-first-secret__record-label {
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-main);
  text-align: center;
  font-family: var(--second-font-family);
}
@media screen and (min-width: 768px) {
  .p-first-secret__record-label {
    font-size: max(1.125rem, 10px);
  }
}

.p-first-secret__record-title {
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.25;
  color: var(--color-sub);
  text-align: center;
  letter-spacing: 0;
}
@media screen and (min-width: 768px) {
  .p-first-secret__record-title {
    margin-block-start: 0.5rem;
    flex: 1;
    font-size: max(1.0625rem, 10px);
  }
}

.p-first-secret__record-image {
  margin-top: 0.625rem;
  width: 100%;
  height: auto;
}
@media screen and (min-width: 768px) {
  .p-first-secret__record-image {
    margin-top: 1.25rem;
  }
}

.p-first-secret__record-image img {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.5rem;
}

.p-first-secret__neighbor-box {
  margin-top: 1.25rem;
  padding: 0.75rem 1.25rem 1.25rem;
  background-color: var(--color-white);
  border-radius: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-first-secret__neighbor-box {
    margin-top: 1.875rem;
    max-width: 36.25rem;
    margin-inline: auto;
    padding: 1.5rem 1.875rem;
  }
}

.p-first-secret__neighbor-box-title {
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-main);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-first-secret__neighbor-box-title {
    font-size: max(1.125rem, 10px);
  }
}

.p-first-secret__neighbor-list {
  margin-top: 0.375rem;
}
@media screen and (min-width: 768px) {
  .p-first-secret__neighbor-list {
    margin-top: 1rem;
  }
}

.p-first-secret__neighbor-lead {
  margin-top: 0.625rem;
  margin-bottom: 0.625rem;
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  line-height: 1.4285714286;
  letter-spacing: 0;
  color: var(--color-sub);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-first-secret__neighbor-lead {
    margin-top: 1rem;
    margin-bottom: 1rem;
    font-size: max(1rem, 10px);
    line-height: 1.875;
  }
}

.p-first-secret__efficiency-lead {
  margin-top: 0.875rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-sub);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-first-secret__efficiency-lead {
    font-size: max(1.125rem, 10px);
  }
}

.p-first-secret__structure-chart {
  margin-top: 1rem;
}
@media screen and (min-width: 768px) {
  .p-first-secret__structure-chart {
    margin-top: 1.5rem;
    max-width: 43.75rem;
    margin-inline: auto;
  }
}

.p-first-secret__structure-chart img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.5rem;
  background-color: var(--color-white);
}
@media screen and (min-width: 768px) {
  .p-first-secret__structure-chart img {
    padding: 1.25rem;
  }
}

.p-first-secrets {
  padding-block: 1.25rem 1.875rem;
  background-color: var(--color-white);
  border-radius: 0.625rem 0.625rem 0 0;
}
@media screen and (min-width: 768px) {
  .p-first-secrets {
    padding-block-end: 2.5rem;
  }
}

.p-first-secrets__title {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-first-secrets__title {
    margin-top: 1.875rem;
  }
}

.p-first-secrets__list {
  margin-top: 0.5rem;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.25rem 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-first-secrets__list {
    margin-top: 2.25rem;
    margin-inline: auto;
    max-width: 45rem;
    grid-template-columns: repeat(3, 1fr);
    gap: 2.25rem 1.25rem;
  }
}

.p-first-secrets__item {
  height: 100%;
}

.p-first-secrets__item[data-wide=true] {
  grid-column: 1/-1;
}

.p-first-secrets__link {
  position: relative;
  z-index: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;
  padding: 0.6875rem 0.75rem 1.125rem;
  background-color: var(--color-bg-cream);
  border-radius: 0.625rem;
  box-shadow: 0.625rem 0.625rem 0.625rem rgba(0, 0, 0, 0.1);
  text-align: center;
  transition: transform 0.3s, box-shadow 0.3s;
}
@media screen and (min-width: 768px) {
  .p-first-secrets__link {
    padding: 1.375rem 0.75rem 1.75rem;
  }
}

.p-first-secrets__item[data-wide=true] .p-first-secrets__link {
  flex-direction: row;
  justify-content: flex-start;
  text-align: left;
  padding: 1.375rem 1rem 1.1875rem;
}
@media screen and (min-width: 768px) {
  .p-first-secrets__item[data-wide=true] .p-first-secrets__link {
    margin-inline: auto;
    max-width: 25rem;
    padding: 1.25rem 1rem 1.75rem;
  }
}

.p-first-secrets__num {
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-first-secrets__num {
    font-size: max(0.9375rem, 10px);
  }
}

.p-first-secrets__name {
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-main);
  font-feature-settings: "palt";
}
@media screen and (min-width: 768px) {
  .p-first-secrets__name {
    font-size: max(1.375rem, 10px);
  }
}

.p-first-secrets__desc {
  margin-top: 0.125rem;
  font-size: max(0.75rem, 10px);
  font-weight: 700;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-first-secrets__desc {
    font-size: max(0.875rem, 10px);
  }
}

.p-first-secrets__item[data-wide=true] .p-first-secrets__desc {
  margin-top: 0;
  margin-left: 1rem;
}
@media screen and (min-width: 768px) {
  .p-first-secrets__item[data-wide=true] .p-first-secrets__desc {
    flex: 1;
    margin-left: 1.5rem;
  }
}

.p-first-secrets__arrow {
  position: absolute;
  bottom: -0.6875rem;
  left: 50%;
  transform: translateX(-50%);
  z-index: 1;
  display: grid;
  place-items: center;
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 50%;
  background-color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-first-secrets__arrow {
    width: 2rem;
    height: 2rem;
    bottom: -1rem;
  }
}

.p-first-secrets__arrow::before {
  content: "";
  display: block;
  width: 0.5rem;
  height: 0.5rem;
  margin-top: -0.25rem;
  border-right: 2px solid var(--color-white);
  border-bottom: 2px solid var(--color-white);
  transform: rotate(45deg);
}

@media (any-hover: hover) {
  .p-first-secrets__link:hover {
    opacity: 1;
    transform: translateY(0.25rem);
  }
}
.p-flow-step__list {
  margin-top: 1.25rem;
  display: grid;
  gap: 1.5rem;
}
@media screen and (min-width: 768px) {
  .p-flow-step__list {
    margin-top: 1.875rem;
    gap: 2.5rem;
  }
}

.p-flow-step__item {
  position: relative;
  background-color: var(--color-white);
  border-radius: 0.625rem;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  padding: 1.125rem 1rem;
}
@media screen and (min-width: 768px) {
  .p-flow-step__item {
    padding: 1.5625rem 1.875rem;
    display: grid;
    grid-template-columns: 18.75rem 1fr;
    grid-template-areas: "img header" "img text";
    -moz-column-gap: 1.875rem;
         column-gap: 1.875rem;
    align-items: start;
  }
}

.p-flow-step__item:not(:last-child)::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -1.1875rem;
  transform: translateX(-50%);
  border-style: solid;
  border-width: 0.625rem 0.75rem 0 0.75rem;
  border-color: var(--color-main) transparent transparent transparent;
}
@media screen and (min-width: 768px) {
  .p-flow-step__item:not(:last-child)::after {
    bottom: -1.875rem;
    border-width: 1.125rem 1.375rem 0 1.375rem;
  }
}

.p-flow-step__header {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-flow-step__header {
    grid-area: header;
    gap: 0.9375rem;
  }
}

.p-flow-step__badge {
  flex-shrink: 0;
  width: 2.5rem;
  height: 2.5rem;
  border-radius: 50%;
  display: grid;
  place-items: center;
  background-color: var(--color-sub);
  color: var(--color-white);
  font-size: max(1rem, 10px);
  font-weight: 700;
  font-family: var(--second-font-family);
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .p-flow-step__badge {
    width: 2.875rem;
    height: 2.875rem;
    font-size: max(1.125rem, 10px);
  }
}

.p-flow-step__title {
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-flow-step__title {
    font-size: max(1.375rem, 10px);
  }
}

.p-flow-step__image {
  margin-top: 0.75rem;
  width: 100%;
  height: auto;
}
@media screen and (min-width: 768px) {
  .p-flow-step__image {
    grid-area: img;
    margin-top: 0;
  }
}

.p-flow-step__image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.5rem;
}

.p-flow-step__text-wrap {
  margin-top: 0.5rem;
  display: grid;
  gap: 0.5rem;
}
@media screen and (min-width: 768px) {
  .p-flow-step__text-wrap {
    grid-area: text;
    margin-top: 0.75rem;
  }
}

.p-flow-step__text-wrap .p-flow-step__text {
  margin-top: 0;
  grid-area: auto;
}

.p-flow-step__text {
  margin-top: 0.5rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-flow-step__text {
    grid-area: text;
    margin-top: 0.75rem;
    font-size: max(1rem, 10px);
    line-height: 1.875;
  }
}

.p-flow-step__free {
  background-color: var(--color-main);
  color: var(--color-white);
  border-radius: 0.3125rem;
  padding: 0.75rem 0.625rem;
  text-align: center;
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  line-height: 1.4;
}
@media screen and (min-width: 768px) {
  .p-flow-step__free {
    font-size: max(1.125rem, 10px);
    padding: 0.9375rem 0.625rem;
  }
}

@media screen and (min-width: 768px) {
  .p-flow-process__inner {
    max-width: 56.25rem;
  }
}

.p-flow-process__lead {
  margin-top: 0.9375rem;
  text-align: center;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-flow-process__lead {
    margin-top: 1.25rem;
    font-size: max(1rem, 10px);
  }
}

.p-flow-process__slider {
  margin-top: 1.125rem;
}
@media screen and (min-width: 768px) {
  .p-flow-process__slider {
    margin-top: 1.5625rem;
  }
}

.p-flow-process__list {
  list-style: none;
}

.p-flow-process__item {
  height: auto;
  padding: 0.5rem;
}
@media screen and (min-width: 768px) {
  .p-flow-process__item {
    padding: 0.75rem;
  }
}
.p-flow-process__item {
  /* スライドは flex アイテムとして高さが揃うが、中のカードは中身なりの高さで止まる。
     カードを伸ばして、本文の長さが違っても隣と高さが揃うようにする（2026-08-27） */
  display: flex;
}

.p-flow-process__card {
  flex: 1;
  background-color: var(--color-white);
  border-radius: 0.625rem;
  padding: 0.875rem;
  box-shadow: 0 0 0.75rem 0 rgba(0, 0, 0, 0.12);
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-flow-process__card {
    padding: 1.125rem;
    gap: 1rem;
    box-shadow: 0 0 1rem 0 rgba(0, 0, 0, 0.13);
  }
}

.p-flow-process__image {
  width: 100%;
  height: auto;
}

.p-flow-process__image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16/10;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.5rem;
}

.p-flow-process__body {
  display: flex;
  flex-direction: column;
  gap: 0.625rem;
}

/* タイトルは「01 足場組立」のオレンジ帯（first-secret__band 準拠） */
.p-flow-process__title {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
  padding: 0.375rem 0.875rem;
  background-color: var(--color-main);
  border-radius: 0.375rem;
  color: var(--color-white);
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.4;
}
@media screen and (min-width: 768px) {
  .p-flow-process__title {
    padding: 0.5rem 1rem;
    border-radius: 0.5rem;
    font-size: max(1.25rem, 10px);
  }
}

.p-flow-process__num {
  font-family: var(--second-font-family);
  font-size: max(1.25rem, 10px);
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .p-flow-process__num {
    font-size: max(1.625rem, 10px);
  }
}

.p-flow-process__text {
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.6923076923;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-flow-process__text {
    font-size: max(0.9375rem, 10px);
    line-height: 1.7333333333;
  }
}

.p-flow-quality__movie {
  margin-top: 1.25rem;
  width: 100%;
}
@media screen and (min-width: 768px) {
  .p-flow-quality__movie {
    margin-top: 1.875rem;
    max-width: 45rem;
    margin-inline: auto;
  }
}

.p-flow-quality__movie iframe {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
  border-radius: 0.625rem;
}

.p-flow-quality__list {
  margin-top: 1.5rem;
}
@media screen and (min-width: 768px) {
  .p-flow-quality__list {
    margin-top: 2rem;
  }
}

.p-flow-quality__button {
  text-align: center;
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-flow-quality__button {
    margin-top: 1.875rem;
  }
}

.p-footer {
  padding-block: 1.875rem;
}
@media screen and (min-width: 768px) {
  .p-footer {
    padding-block: 2.8125rem 1.875rem;
  }
}

.p-footer__logo {
  max-width: 17.0625rem;
  width: 100%;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .p-footer__logo {
    max-width: 27.125rem;
  }
}

.p-footer__logo a {
  display: block;
}

.p-footer__logo img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.p-footer__copyright {
  display: block;
  margin-top: 2.5rem;
  font-size: max(0.625rem, 10px);
  line-height: 1.7;
  color: var(--color-sub);
  font-feature-settings: "palt";
  text-align: center;
}

/* 任意バッジ（u-required の任意版・グレー） */
.u-optional {
  display: inline-block;
  margin: 0 0.5rem 0 0;
  padding: 0.3125rem 0.9375rem;
  background-color: var(--color-border);
  color: var(--color-white);
  border: none;
  border-radius: 0.25rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .u-optional {
    padding: 0.5rem 0.75rem;
    font-size: max(0.9375rem, 10px);
  }
}

.p-form__message.c-text {
  text-align: center;
}

.p-form__contents {
  margin-top: 0.5rem;
}

.p-form__message + .p-form__contents {
  margin-top: 1rem;
}
@media screen and (min-width: 768px) {
  .p-form__message + .p-form__contents {
    margin-top: 2.5rem;
  }
}

.p-form__wrap {
  display: flex;
  flex-direction: column;
  align-items: stretch;
  max-width: none;
}
@media screen and (min-width: 768px) {
  .p-form__wrap {
    flex-direction: row;
    -moz-column-gap: 0.75rem;
         column-gap: 0.75rem;
  }
}

@media screen and (min-width: 768px) {
  .p-form__wrap:has(.p-form__checkbox) {
    align-items: flex-start;
  }
}

.p-form__wrap.p-form__wrap--textarea {
  align-items: stretch;
}

.p-form__wrap + .p-form__wrap {
  margin-top: 1rem;
}
@media screen and (min-width: 768px) {
  .p-form__wrap + .p-form__wrap {
    margin-top: 0.875rem;
  }
}

@media screen and (min-width: 768px) {
  .p-form__wrap + .p-form__wrap:has(.p-form__checkbox) {
    margin-top: 1.5625rem;
  }
}

.p-form__label {
  display: flex;
  gap: 0.625rem;
  align-items: center;
  max-width: none;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-form__label {
    flex-shrink: 0;
    width: 28%;
    align-items: center;
    justify-content: space-between;
    flex-direction: row-reverse;
  }
}

.p-form__wrap.p-form__wrap--textarea .p-form__label {
  margin-top: 0.625rem;
  align-items: flex-start;
}

@media screen and (min-width: 768px) {
  .p-form__label.p-form__label--plain {
    /* row-reverse のため flex-end が左端 */
    justify-content: flex-end;
  }
}

.u-required {
  display: inline-block;
  padding: 0.3125rem 0.9375rem;
  background-color: var(--color-accent-red);
  color: var(--color-white);
  border: none;
  border-radius: 0.25rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .u-required {
    padding: 0.5rem 0.75rem;
    font-size: max(0.9375rem, 10px);
  }
}

.u-optional {
  display: inline-block;
  padding: 0.3125rem 0.9375rem;
  background-color: var(--color-border);
  color: var(--color-white);
  border: none;
  border-radius: 0.25rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .u-optional {
    flex-shrink: 0;
    padding: 0.5rem 0.75rem;
    font-size: max(0.9375rem, 10px);
  }
}

.p-form__input,
.p-form__select,
.p-form__radio,
.p-form__checkbox,
.p-form__textarea,
.p-form__confirm-value,
.p-form__privacy-link {
  margin-top: 0.5rem;
}
@media screen and (min-width: 768px) {
  .p-form__input,
  .p-form__select,
  .p-form__radio,
  .p-form__checkbox,
  .p-form__textarea,
  .p-form__confirm-value,
  .p-form__privacy-link {
    margin-top: 0;
  }
}

.p-form__input,
.p-form__textarea,
.p-form__confirm-value,
.p-form__privacy-link {
  flex-grow: 1;
  width: 100%;
}

.p-form__confirm-value {
  font-size: max(0.9375rem, 10px);
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  .p-form__confirm-value {
    padding-top: 0.75rem;
    padding-left: 1.25rem;
  }
}

.p-form__privacy-link {
  font-size: max(0.875rem, 10px);
}
@media screen and (min-width: 768px) {
  .p-form__privacy-link {
    align-self: center;
    padding-left: 1.25rem;
  }
}

.p-form__privacy-link a {
  text-decoration: underline;
  text-decoration-color: var(--color-black);
  text-underline-offset: 2px;
  text-decoration-thickness: 1px;
}

.p-form__submit {
  position: relative;
  margin-top: 1rem;
  margin-inline: auto;
  max-width: 42.125rem;
  width: 100%;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-form__submit {
    margin-top: 1.75rem;
  }
}

.p-form__submit::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0.9375rem;
  transform: translateY(-50%);
  width: 0.90625rem;
  height: 1.456875rem;
  background-image: url("../images/common/arrow-white.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
  pointer-events: none;
}

.p-form__input input {
  padding: 0.875rem 0.75rem;
  width: 100%;
  font-size: max(1rem, 16px);
  line-height: 1;
  border-radius: 0.25rem;
  background-color: var(--color-bg-input);
  border: none;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
}

.p-form__input input:focus {
  box-shadow: none;
  outline: none;
}

.p-form__textarea textarea {
  padding: 0.875rem 0.75rem;
  width: 100%;
  height: 9.375rem;
  font-size: max(0.9375rem, 10px);
  border-radius: 0.25rem;
  background-color: var(--color-bg-input);
  border: none;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  field-sizing: content;
  resize: none;
}

.p-form__textarea textarea:focus {
  box-shadow: none;
  outline: none;
}

.p-form__select select {
  padding: 0.71875rem 3.125rem 0.71875rem 0.9375rem;
  width: 100%;
  font-size: max(0.9375rem, 10px);
  line-height: 1;
  border-radius: 0.25rem;
  background-color: var(--color-bg-input);
  border: none;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  cursor: pointer;
}

.p-form__select select::-ms-expand {
  display: none;
}

.p-form__select select:focus {
  box-shadow: none;
  outline: none;
}

.p-form__radio label {
  display: block;
}

.p-form__radio label:not(:first-of-type) {
  margin-top: 0.625rem;
  margin-left: 0;
}

.p-form__radio input {
  display: none;
}

.p-form__radio input + span {
  padding: 0 0 0 1.5625rem;
  position: relative;
  display: inline-block;
  font-size: max(0.875rem, 10px);
  line-height: 1;
  cursor: pointer;
}

.p-form__radio input + span::before {
  content: "";
  width: 1.125rem;
  height: 1.125rem;
  display: block;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  background: var(--color-bg-input);
  border: none;
  border-radius: 50%;
}

.p-form__radio input + span::after {
  content: "";
  width: 0.4375rem;
  height: 0.4375rem;
  position: absolute;
  top: 50%;
  left: 0.34375rem;
  transform: translateY(-50%);
  border-radius: 50%;
  background: var(--color-black);
  opacity: 0;
  transition: 0.3s;
}

.p-form__radio input:checked + span::after {
  opacity: 1;
}

.p-checkbox {
  display: grid;
  grid-template-columns: 1fr 1.3fr;
  gap: 0.375rem;
}
@media screen and (min-width: 768px) {
  .p-checkbox {
    grid-template-columns: 1fr 0.8fr 1.2fr;
    gap: 1.25rem 0.625rem;
  }
}

.p-checkbox .wpcf7-list-item {
  margin: 0;
}

.p-form__checkbox label {
  display: block;
  margin: 0;
}

.p-form__checkbox label:not(:first-of-type) {
  margin: 0;
}

.p-form__checkbox input {
  display: none;
}

.p-form__checkbox input + span {
  cursor: pointer;
  display: inline-block;
  padding: 0 0 0 1.5625rem;
  position: relative;
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  line-height: 1;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-form__checkbox input + span {
    padding-left: 2.125rem;
  }
}

.p-form__checkbox input + span::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%);
  background: var(--color-bg-input);
  border: none;
  border-radius: 0.1875rem;
  display: block;
  width: 1.125rem;
  height: 1.125rem;
}
@media screen and (min-width: 768px) {
  .p-form__checkbox input + span::before {
    width: 1.75rem;
    height: 1.75rem;
  }
}

.p-form__checkbox input + span::after {
  content: "";
  margin-top: -0.125rem;
  position: absolute;
  top: 50%;
  left: 0;
  transform: translateY(-50%) rotate(-45deg);
  display: block;
  width: 1.125rem;
  height: 0.625rem;
  border-bottom: 0.1875rem solid var(--color-black);
  border-left: 0.1875rem solid var(--color-black);
  transition: 0.3s;
  opacity: 0;
}
@media screen and (min-width: 768px) {
  .p-form__checkbox input + span::after {
    width: 1.75rem;
    height: 1rem;
  }
}

.p-form__checkbox input:checked + span::after {
  opacity: 1;
}

.p-contact__form-privacy {
  margin-top: 1.25rem;
  text-align: center;
}

.p-contact__form-checkbox-text.c-text {
  max-width: 25.625rem;
  margin-inline: auto;
  font-size: max(0.75rem, 10px);
}

.p-contact__form-checkbox-text.c-text a {
  text-decoration: underline;
  text-decoration-color: var(--color-black);
  text-underline-offset: 1px;
  text-decoration-thickness: 1px;
}

.p-contact__form-privacy label {
  margin-top: 0.625rem;
  display: block;
}

.p-contact__form-privacy input + span {
  position: relative;
  font-size: max(0.8125rem, 10px);
  padding-left: 1.5625rem;
  margin-left: 0.625rem;
}

.p-contact__form-privacy input + span::before {
  content: "";
  position: absolute;
  top: 55%;
  left: 0;
  transform: translateY(-50%);
  display: block;
  width: 1.25rem;
  height: 1.25rem;
  background-color: var(--color-white);
  border: 1px solid var(--color-black);
}

.p-contact__form-privacy input + span::after {
  content: "";
  margin-top: -0.125rem;
  position: absolute;
  top: 60%;
  left: 0.25rem;
  transform: translateY(-50%) rotate(-45deg);
  display: block;
  width: 0.8125rem;
  height: 0.4375rem;
  border-bottom: 2px solid var(--color-black);
  border-left: 2px solid var(--color-black);
  transition: 0.3s;
  opacity: 0;
}

.p-contact__form-privacy input:checked + span::after {
  opacity: 1;
}

.p-contact__form-submit {
  margin-top: 3.125rem;
  text-align: center;
}

.p-form__submit input {
  width: 100%;
  padding: 0.9375rem 1rem;
  background-color: var(--color-accent-green);
  color: var(--color-white);
  font-size: max(1.75rem, 10px);
  font-weight: 700;
  line-height: 1;
  border: none;
  border-radius: 0.25rem;
  text-decoration: none;
  cursor: pointer;
  transition: 0.3s;
}
@media screen and (min-width: 768px) {
  .p-form__submit input {
    padding: 1.5625rem 1.25rem;
    font-size: max(1.25rem, 10px);
  }
}

.p-form__submit input:hover,
.p-form__submit input:focus {
  outline: none;
}

.p-form__submit input:hover {
  opacity: 0.8;
}

.p-form__submit input::-moz-focus-inner {
  padding: 0;
  border: none;
}

.p-form__buttons {
  margin-top: 1rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-form__buttons {
    margin-top: 1.75rem;
    flex-direction: row;
    justify-content: center;
    gap: 1.25rem;
  }
}

.p-form__previous {
  margin-inline: auto;
  max-width: 42.125rem;
  width: 100%;
}
@media screen and (min-width: 768px) {
  .p-form__previous {
    flex: 1;
  }
}

.p-form__previous input {
  width: 100%;
  padding: 0.9375rem 1rem;
  background-color: var(--color-border);
  color: var(--color-white);
  font-size: max(1.75rem, 10px);
  font-weight: 700;
  line-height: 1;
  border: none;
  border-radius: 0.25rem;
  cursor: pointer;
  transition: 0.3s;
}
@media screen and (min-width: 768px) {
  .p-form__previous input {
    padding: 1.5625rem 1.25rem;
    font-size: max(1.25rem, 10px);
  }
}

.p-form__previous input:hover {
  opacity: 0.8;
}

.p-form__submit.p-form__submit--confirm {
  margin-top: 0;
}
@media screen and (min-width: 768px) {
  .p-form__submit.p-form__submit--confirm {
    flex: 1;
  }
}

.p-contact__form-message {
  margin-inline: auto;
  width: -moz-fit-content;
  width: fit-content;
}

.wpcf7 form.invalid .wpcf7-response-output {
  border-color: var(--color-accent-red);
  border-radius: 0.625rem;
}

.wpcf7 form .wpcf7-response-output {
  padding: 1.875rem;
  text-align: center;
  font-size: max(1.125rem, 10px);
  color: var(--color-accent-red);
  line-height: 1;
  margin: 1.25rem 0 0;
}

.wpcf7-spinner {
  display: none;
}

@media screen and (min-width: 768px) {
  .p-guarantee-support {
    overflow-x: clip;
  }
}

.p-guarantee-intro__text-wrap {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-guarantee-intro__text-wrap {
    margin-top: 1.875rem;
    text-align: center;
  }
}

.p-guarantee-intro__text {
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-guarantee-intro__text {
    line-height: 1.875;
  }
}

.p-guarantee-intro__text + .p-guarantee-intro__text {
  margin-top: 0.875rem;
}

.p-guarantee-warranty__head {
  margin-top: 1rem;
}
@media screen and (min-width: 768px) {
  .p-guarantee-warranty__head {
    margin-top: 1.5rem;
  }
}

.p-guarantee-warranty__band {
  padding: 0.3125rem;
  background-color: var(--color-main);
  border-radius: 0.5rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-white);
  text-align: center;
  font-family: var(--second-font-family);
}
@media screen and (min-width: 768px) {
  .p-guarantee-warranty__band {
    padding: 0.625rem;
    font-size: max(1.375rem, 10px);
    border-radius: 0.625rem;
  }
}

.p-guarantee-warranty__title {
  margin-top: 0.5rem;
  font-size: max(1.375rem, 10px);
  font-weight: 700;
  line-height: 1.1818181818;
  color: var(--color-sub);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-guarantee-warranty__title {
    margin-top: 1.875rem;
    font-size: max(2rem, 10px);
  }
}

.p-guarantee-warranty__lead {
  margin-top: 0.9375rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-guarantee-warranty__lead {
    font-size: max(1.125rem, 10px);
    line-height: 1.875;
  }
}

.p-guarantee-warranty__body {
  margin-top: 1.125rem;
}
@media screen and (min-width: 768px) {
  .p-guarantee-warranty__body {
    max-width: 50rem;
    margin-inline: auto;
  }
}

.p-guarantee-warranty__body::after {
  content: "";
  display: block;
  clear: both;
}

.p-guarantee-warranty__image {
  float: left;
  width: 45%;
  max-width: 17.5rem;
  margin-right: 1rem;
  margin-bottom: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-guarantee-warranty__image {
    margin-right: 1.875rem;
    margin-bottom: 1rem;
  }
}

.p-guarantee-warranty__image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
}

.p-guarantee-warranty__text {
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.6923076923;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-guarantee-warranty__text {
    font-size: max(0.9375rem, 10px);
    line-height: 1.8666666667;
  }
}

.p-guarantee-warranty__text + .p-guarantee-warranty__text {
  margin-top: 0.75rem;
}

/* このメンテナンス見出しだけ、SPで字間を詰めて折り返しを収める（共通c-section-titleには影響させない） */
.p-guarantee-maintenance .c-section-title__ja {
  letter-spacing: -0.03em;
}
@media screen and (min-width: 768px) {
  .p-guarantee-maintenance .c-section-title__ja {
    letter-spacing: normal;
  }
}

.p-guarantee-maintenance__band {
  padding: 0.3125rem;
  background-color: var(--color-main);
  border-radius: 0.5rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-white);
  text-align: center;
  font-family: var(--second-font-family);
}
@media screen and (min-width: 768px) {
  .p-guarantee-maintenance__band {
    padding: 0.625rem;
    font-size: max(1.375rem, 10px);
    border-radius: 0.625rem;
  }
}

.p-guarantee-maintenance__title {
  margin-top: 0.5rem;
  font-size: max(1.375rem, 10px);
  font-weight: 700;
  line-height: 1.1818181818;
  color: var(--color-sub);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-guarantee-maintenance__title {
    margin-top: 1.875rem;
    font-size: max(2rem, 10px);
  }
}

.p-guarantee-maintenance__lead {
  margin-top: 0.9375rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-guarantee-maintenance__lead {
    font-size: max(1.125rem, 10px);
    line-height: 1.875;
    text-align: center;
  }
}

.p-guarantee-maintenance__image {
  margin-top: 1.25rem;
  width: 100%;
  height: auto;
}
@media screen and (min-width: 768px) {
  .p-guarantee-maintenance__image {
    margin-top: 1.875rem;
    max-width: 43.75rem;
    margin-inline: auto;
  }
}

.p-guarantee-maintenance__image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
}

.p-guarantee-maintenance__row {
  margin-top: 1.25rem;
  display: grid;
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-guarantee-maintenance__row {
    margin-top: 1.875rem;
    grid-template-columns: 1fr 1fr;
    gap: 1.25rem;
  }
}

.p-guarantee-maintenance__row .p-guarantee-maintenance__image {
  margin-top: 0;
  max-width: none;
}

.p-guarantee-maintenance__row .p-guarantee-maintenance__image img {
  aspect-ratio: 700/467;
  -o-object-fit: cover;
     object-fit: cover;
  height: auto;
  width: 100%;
}

.p-guarantee-support__type-list {
  margin-top: 1.5rem;
}
@media screen and (min-width: 768px) {
  .p-guarantee-support__type-list {
    margin-top: 2.1875rem;
    --c-grid-cols: 2;
  }
}

.p-guarantee-support__type {
  background-color: var(--color-white);
  border: 1px solid var(--color-border-line);
  border-radius: 0.625rem;
  padding: 1.125rem 1rem;
}
@media screen and (min-width: 768px) {
  .p-guarantee-support__type {
    padding: 1.75rem 1.875rem;
  }
}

.p-guarantee-support__type-title {
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-main);
  border-bottom: 1px solid var(--color-border-line);
  padding-bottom: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-guarantee-support__type-title {
    font-size: max(1.25rem, 10px);
  }
}

.p-guarantee-support__type-title span {
  font-size: max(0.8125rem, 10px);
}
@media screen and (min-width: 768px) {
  .p-guarantee-support__type-title span {
    font-size: max(0.9375rem, 10px);
  }
}

.p-guarantee-support__type-image {
  margin-top: 0.875rem;
  width: 100%;
  height: auto;
}
@media screen and (min-width: 768px) {
  .p-guarantee-support__type-image {
    float: left;
    width: 8.125rem;
    margin-top: 1rem;
    margin-right: 1.125rem;
  }
}

.p-guarantee-support__type-image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.5rem;
}

.p-guarantee-support__type-text {
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.8461538462;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-guarantee-support__type-text {
    font-size: max(1.125rem, 10px);
    line-height: 1.875;
  }
}

.p-guarantee-support__type-note {
  margin-top: -0.25rem;
  font-size: max(0.75rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-guarantee-support__type-note {
    font-size: max(0.875rem, 10px);
  }
}

.p-guarantee-support__message-wrap {
  position: relative;
  margin-top: 1.5rem;
}
@media screen and (min-width: 768px) {
  .p-guarantee-support__message-wrap {
    margin-top: 5rem;
  }
}

.p-guarantee-support__message {
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.6;
  color: var(--color-sub);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-guarantee-support__message {
    font-size: max(1.375rem, 10px);
  }
}

.p-guarantee-support__message + .p-guarantee-support__message {
  margin-top: 0.875rem;
  color: var(--color-main);
}

.p-guarantee-support__button {
  margin-top: 1.5rem;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-guarantee-support__button {
    margin-top: 2.1875rem;
  }
}

.p-guarantee-faq__list {
  display: grid;
  gap: 1.75rem;
}
@media screen and (min-width: 768px) {
  .p-guarantee-faq__list {
    gap: 2.5rem;
    max-width: 50rem;
    margin-inline: auto;
  }
}

/* コメント行の見た目は共通パーツ c-comment に統一。ここは行間隔と質問の強調だけ */
.p-guarantee-faq__row + .p-guarantee-faq__row {
  margin-top: 0.875rem;
}
@media screen and (min-width: 768px) {
  .p-guarantee-faq__row + .p-guarantee-faq__row {
    margin-top: 1.125rem;
  }
}

.p-guarantee-faq__q {
  font-weight: 700;
}

.p-guarantee-faq__block {
  margin-top: 1rem;
}
@media screen and (min-width: 768px) {
  .p-guarantee-faq__block {
    margin-top: 1.25rem;
    padding-inline: 4.625rem;
  }
}

.p-guarantee-faq__block-image {
  width: 100%;
  height: auto;
}

.p-guarantee-faq__block-image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
}

.p-guarantee-faq__block-text {
  margin-top: 0.75rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.8461538462;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-guarantee-faq__block-text {
    font-size: max(1.125rem, 10px);
    line-height: 1.875;
  }
}

/* PCは2段ヘッダー（左＝ロゴ+TEL全高／右＝アクション上・ナビ下）。SPはロゴ+TEL+ハンバーガー */
.p-header {
  position: fixed;
  inset: 0 0 auto 0;
  z-index: 1001;
  width: 100%;
  height: var(--header-height);
  background-color: var(--color-bg-cream);
  transition: height 0.3s ease-in-out, background-color 0.3s ease-in-out, color 0.3s ease-in-out;
}
@media screen and (min-width: 1024px) {
  .p-header {
    background-color: var(--color-white);
    color: var(--color-black);
    display: flex;
    flex-direction: row;
    align-items: stretch;
    box-shadow: 0 2px 8px rgba(0, 0, 0, 0.06);
  }
}

.p-header__inner {
  padding-inline: 0.625rem;
  height: inherit;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.5rem;
}
@media screen and (min-width: 1024px) {
  .p-header__inner {
    flex: 0 0 auto;
    height: 100%;
    min-height: 0;
    padding: 0 0 0 clamp(12px, 12px + 18 * (100vw - 1024px) / 896, 30px);
    gap: clamp(8px, 8px + 12 * (100vw - 1024px) / 896, 20px);
    justify-content: flex-start;
  }
}

.p-header__nav-area {
  display: none;
}
@media screen and (min-width: 1024px) {
  .p-header__nav-area {
    flex: 1;
    min-width: 0;
    height: 100%;
    padding-top: 1.25rem;
    display: flex;
    flex-direction: column;
    align-items: flex-end;
    justify-content: space-between;
  }
}

.p-header__logo {
  flex-shrink: 0;
  max-width: 5.9375rem;
  width: 100%;
  height: inherit;
  /* 768-1023（ハンバーガー帯）は 200px 固定 */
}
@media screen and (min-width: 768px) {
  .p-header__logo {
    width: 200px;
    max-width: none;
    height: auto;
  }
}
.p-header__logo {
  /* 1024+ は可変（md を上書き） */
}
@media screen and (min-width: 1024px) {
  .p-header__logo {
    width: clamp(155px, 155px + 148 * (100vw - 1024px) / 896, 303px);
  }
}

.p-header__logo a {
  height: inherit;
  display: flex;
  align-items: center;
}
@media screen and (min-width: 1024px) {
  .p-header__logo a {
    height: auto;
  }
}

.p-header__logo img {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}
@media screen and (min-width: 1024px) {
  .p-header__logo img {
    height: auto;
  }
}

.p-header__contact {
  flex: 1;
  min-width: 0;
}
@media screen and (min-width: 1024px) {
  .p-header__contact {
    flex: 0 0 auto;
    margin-top: 0;
    margin-left: 0;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    line-height: 1.1;
  }
}

.p-header__contact-label {
  margin: 0;
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  color: var(--color-tel-green);
  line-height: 1.2;
}
@media screen and (min-width: 1024px) {
  .p-header__contact-label {
    font-size: clamp(15px, 15px + 7 * (100vw - 1024px) / 896, 22px);
  }
}

.p-header__contact-tel {
  display: inline-flex;
  align-items: center;
  gap: 0.375rem;
  font-family: var(--second-font-family);
  font-size: max(1.5625rem, 10px);
  font-weight: 700;
  color: var(--color-tel-green);
  line-height: 1.1;
  letter-spacing: 0.02em;
  white-space: nowrap;
}
@media screen and (min-width: 1024px) {
  .p-header__contact-tel {
    font-size: clamp(21px, 21px + 19 * (100vw - 1024px) / 896, 40px);
  }
}

.p-header__contact-tel-icon {
  width: 1.75rem;
  height: auto;
}
@media screen and (min-width: 1024px) {
  .p-header__contact-tel-icon {
    width: clamp(23px, 23px + 22 * (100vw - 1024px) / 896, 45px);
  }
}

.p-header__contact-time {
  margin: 0;
  font-size: max(0.75rem, 10px);
  font-weight: 500;
  color: var(--color-sub);
  line-height: 1.4;
  text-spacing-trim: trim-start;
  white-space: nowrap;
}
@media screen and (min-width: 1024px) {
  .p-header__contact-time {
    line-height: 1;
    gap: clamp(6px, 6px + 8 * (100vw - 1024px) / 896, 14px);
    font-size: clamp(10px, 10px + 2 * (100vw - 1024px) / 896, 12px);
  }
}
.p-header__contact-time {
  /* 1行にするのは1440〜。1024-1439は2行のまま（左カラムを狭くしてナビに幅を回す） */
}
@media screen and (min-width: 1440px) {
  .p-header__contact-time {
    display: flex;
  }
}

/* SPと1024-1439は2行。1440〜で1行にする */
.p-header__contact-time-item {
  display: block;
}
@media screen and (min-width: 1440px) {
  .p-header__contact-time-item {
    display: inline;
  }
}

/* アクションボタン（4つ・横型ピル：アイコン左＋ラベル右）。PC専用・右カラム上段 */
@media screen and (min-width: 1024px) {
  .p-header__actions {
    display: flex;
    align-items: center;
    gap: clamp(6px, 6px + 5 * (100vw - 1024px) / 896, 11px);
    margin: 0;
    padding-right: clamp(8px, 8px + 7 * (100vw - 1024px) / 896, 15px);
    list-style: none;
  }
}

@media screen and (min-width: 1024px) {
  .p-header__actions-link {
    min-width: clamp(100px, 100px + 70 * (100vw - 1024px) / 896, 170px);
    padding: clamp(6px, 6px + 1 * (100vw - 1024px) / 896, 7px) clamp(11px, 11px + 14 * (100vw - 1024px) / 896, 25px);
    display: flex;
    flex-direction: row;
    align-items: center;
    gap: clamp(6px, 6px + 9 * (100vw - 1024px) / 896, 15px);
    color: var(--color-white);
    background-color: var(--color-main);
    border: 1px solid var(--color-main);
    border-radius: 1.25rem;
    font-size: max(0.9375rem, 10px);
    font-weight: 700;
    line-height: 1;
    transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out, border-color 0.3s ease-in-out;
  }
}

/* アイコンは単色SVGを mask で着色（供給SVGが白塗り）。オレンジボタン上なので白 */
@media screen and (min-width: 1024px) {
  .p-header__actions-icon {
    width: clamp(18px, 18px + 7 * (100vw - 1024px) / 896, 25px);
    height: clamp(18px, 18px + 7 * (100vw - 1024px) / 896, 25px);
    flex-shrink: 0;
    background-color: var(--color-white);
    -webkit-mask: var(--header-icon) no-repeat center/contain;
    mask: var(--header-icon) no-repeat center/contain;
    transition: background-color 0.3s ease-in-out;
  }
}

@media screen and (min-width: 1024px) {
  .p-header__actions-text {
    font-size: clamp(12px, 12px + 1 * (100vw - 1024px) / 896, 13px);
    font-weight: 700;
    line-height: 1.2;
    white-space: nowrap;
  }
}

@media (any-hover: hover) {
  .p-header__actions-link:hover {
    background-color: var(--color-sub);
    border-color: var(--color-sub);
    opacity: 1;
  }
  .p-header__actions-link:hover .p-header__actions-icon {
    background-color: var(--color-white);
  }
}
.p-header__hamburger {
  display: block;
  margin: 0;
  padding: 0;
  outline: none;
  border: none;
  position: relative;
  z-index: 999;
  flex-shrink: 0;
  width: 3.5rem;
  height: 3.5rem;
  background-color: var(--color-accent-green);
  border-radius: 50%;
  cursor: pointer;
  transition: 0.3s;
}
@media screen and (min-width: 1024px) {
  .p-header__hamburger {
    display: none;
  }
}

.p-header__hamburger span {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: block;
  width: 1.25rem;
  height: 1px;
  background-color: var(--color-white);
  transition: background-color 0.3s ease-in-out;
}

.p-header__hamburger span::before,
.p-header__hamburger span::after {
  position: absolute;
  content: "";
  display: block;
  width: 1.25rem;
  height: 1px;
  background-color: var(--color-white);
  transition: transform 0.3s ease-in-out;
}

.p-header__hamburger span::before {
  transform: translateY(-0.5rem);
}

.p-header__hamburger span::after {
  transform: translateY(0.5rem);
}

.p-header__hamburger.is-open span {
  background-color: transparent;
}

.p-header__hamburger.is-open span::before {
  transform: translateY(0) rotate(45deg);
}

.p-header__hamburger.is-open span::after {
  transform: translateY(0) rotate(-45deg);
}

/* グローバルナビ（横一列8項目・右寄せ・濃色テキスト）。PC専用・右カラム下段 */
@media screen and (min-width: 1024px) {
  .p-header__gnav {
    display: flex;
    align-items: center;
    justify-content: flex-end;
  }
}

@media screen and (min-width: 1024px) {
  .p-header__gnav-list {
    display: flex;
    align-items: center;
  }
}

@media screen and (min-width: 1024px) {
  .p-header__gnav-link {
    padding-block: 0.9375rem 1.25rem;
    padding-inline: clamp(4px, 4px + 9 * (100vw - 1024px) / 896, 13px);
    display: block;
    font-size: clamp(11px, 11px + 4 * (100vw - 1024px) / 896, 15px);
    font-weight: 700;
    line-height: 1;
    white-space: nowrap;
    color: var(--color-sub);
    transition: color 0.3s ease-in-out;
  }
}

@media (any-hover: hover) {
  .p-header__gnav-link:hover {
    color: var(--color-main);
    opacity: 1;
  }
}
.p-header__drawer {
  display: none;
  position: fixed;
  z-index: 900;
  inset: var(--header-height) 0 0 0;
  background-color: var(--color-bg-cream);
  overflow-y: scroll;
  scrollbar-width: none;
}
@media screen and (min-width: 1024px) {
  .p-header__drawer {
    display: none !important;
  }
}

.p-header__drawer::-webkit-scrollbar {
  display: none;
}

.p-header__drawer-inner {
  padding: 1rem 0.625rem 3.75rem;
  margin-inline: auto;
  max-width: 62.5rem;
}

/* ===== 緑のTEL帯 ===== */
.p-header__drawer-tel {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 0.25rem;
  padding: 1rem 0.75rem 1.125rem;
  background-color: var(--color-tel-green);
  border-radius: 0.625rem;
  color: var(--color-white);
  text-align: center;
}

/* 番号の上に置く「タップしたら繋がります」。共通CTA（.p-cta__tap）と同じ役割 */
.p-header__drawer-tel-tap {
  font-size: max(1rem, 10px);
  font-weight: 900;
  line-height: 1;
}

.p-header__drawer-tel-num {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  font-family: var(--second-font-family);
  font-size: max(2.375rem, 10px);
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.02em;
}

.p-header__drawer-tel-icon {
  width: 2.5rem;
  height: auto;
}

.p-header__drawer-tel-time {
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.4;
}

/* ===== 白ボタングリッド ===== */
.p-header__drawer-menu {
  margin-top: 0.875rem;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 0.625rem;
}

.p-header__drawer-menu-item {
  width: calc((100% - 0.625rem) / 2);
}

.p-header__drawer-menu-item[data-size=full] {
  width: 100%;
}

.p-header__drawer-menu-link {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 3.5rem;
  padding-block: 0.625rem;
  padding-inline: 2.125rem 0.625rem;
  background-color: var(--color-white);
  border-radius: 0.5rem;
  box-shadow: 0 0.125rem 0.375rem rgba(0, 0, 0, 0.06);
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
  color: var(--color-sub);
  transition: background-color 0.3s ease, color 0.3s ease;
}

.p-header__drawer-menu-icon {
  position: absolute;
  top: 50%;
  left: 0.625rem;
  transform: translateY(-50%);
  width: 1.5rem;
  height: 1.5rem;
  background-color: var(--color-main);
  mask: var(--icon) center/contain no-repeat;
  -webkit-mask: var(--icon) center/contain no-repeat;
  transition: background-color 0.3s ease;
}

/* ===== オレンジボタン ===== */
.p-header__drawer-actions {
  margin-top: 0.625rem;
  list-style: none;
  display: flex;
  flex-wrap: wrap;
  gap: 0.625rem;
}

.p-header__drawer-actions-item {
  width: calc((100% - 0.625rem) / 2);
}

.p-header__drawer-actions-item[data-size=full] {
  width: 100%;
}

.p-header__drawer-actions-link {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 3.5rem;
  padding-block: 0.625rem;
  padding-inline: 2.125rem 0.625rem;
  background-color: var(--color-main);
  border-radius: 0.5rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.3;
  text-align: center;
  color: var(--color-white);
  transition: background-color 0.3s ease, color 0.3s ease, box-shadow 0.3s ease;
}

.p-header__drawer-actions-icon {
  position: absolute;
  top: 50%;
  left: 0.625rem;
  transform: translateY(-50%);
  width: 1.5rem;
  height: 1.5rem;
  background-color: var(--color-white);
  mask: var(--icon) center/contain no-repeat;
  -webkit-mask: var(--icon) center/contain no-repeat;
  transition: background-color 0.3s ease;
}

/* ===== 下部リンクリスト ===== */
.p-header__drawer-list {
  margin-top: 1.25rem;
  list-style: none;
}

.p-header__drawer-list-item {
  border-top: 1px solid var(--color-border-line);
}

.p-header__drawer-list-item:last-child {
  border-bottom: 1px solid var(--color-border-line);
}

.p-header__drawer-list-link {
  position: relative;
  display: block;
  padding: 0.875rem 1.75rem 0.875rem 0.5rem;
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-sub);
  transition: color 0.3s ease;
}

.p-header__drawer-list-link::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0.5rem;
  width: 0.5rem;
  height: 0.5rem;
  border-top: 2px solid var(--color-main);
  border-right: 2px solid var(--color-main);
  transform: translateY(-50%) rotate(45deg);
  transition: right 0.3s ease;
}

@media (any-hover: hover) {
  /* 共通の a:hover{opacity:0.7} を打ち消す */
  .p-header__drawer-menu-link:hover,
  .p-header__drawer-actions-link:hover,
  .p-header__drawer-list-link:hover {
    opacity: 1;
  }
  /* 白ボタン → オレンジ反転 */
  .p-header__drawer-menu-link:hover {
    background-color: var(--color-main);
    color: var(--color-white);
  }
  .p-header__drawer-menu-link:hover .p-header__drawer-menu-icon {
    background-color: var(--color-white);
  }
  /* オレンジボタン → 白反転（枠線で維持） */
  .p-header__drawer-actions-link:hover {
    background-color: var(--color-white);
    color: var(--color-main);
    box-shadow: inset 0 0 0 2px var(--color-main);
  }
  .p-header__drawer-actions-link:hover .p-header__drawer-actions-icon {
    background-color: var(--color-main);
  }
  /* 下部リンク：矢印が右へスライド */
  .p-header__drawer-list-link:hover {
    color: var(--color-main);
  }
  .p-header__drawer-list-link:hover::after {
    right: 0.25rem;
  }
}
.p-housemaker-intro__body {
  margin-top: 0.875rem;
}
@media screen and (min-width: 768px) {
  .p-housemaker-intro__body {
    margin-top: 1.5rem;
    display: grid;
    grid-template-columns: 1fr 30.75rem;
    gap: 2.5rem;
    align-items: center;
  }
}

.p-housemaker-intro__content {
  max-width: 36.25rem;
}

.p-housemaker-intro__catch {
  margin-top: 0.625rem;
  font-size: max(1.375rem, 10px);
  font-weight: 700;
  line-height: 1.45;
  color: var(--color-sub);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-housemaker-intro__catch {
    margin-top: 0.875rem;
    font-size: max(2.25rem, 10px);
  }
}

.p-housemaker-intro__catch strong {
  color: var(--color-main);
  font-weight: 700;
}

.p-housemaker-intro__image {
  width: 100%;
  height: auto;
}

.p-housemaker-intro__image img {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
}

.p-housemaker-intro__headline {
  margin-top: 0.875rem;
  font-size: max(0.9375rem, 10px);
  font-weight: 500;
  line-height: 1.8;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-housemaker-intro__headline {
    margin-top: 1.125rem;
    font-size: max(1.25rem, 10px);
    text-align: center;
  }
}

.p-housemaker-intro__headline strong {
  color: var(--color-main);
  font-size: inherit;
}

.p-housemaker-price__chart {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-housemaker-price__chart {
    margin-top: 1.875rem;
    max-width: 50rem;
    margin-inline: auto;
  }
}

.p-housemaker-price__chart img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
}

.p-housemaker-price__text-wrap {
  margin-top: 1rem;
}
@media screen and (min-width: 768px) {
  .p-housemaker-price__text-wrap {
    margin-top: 1.5625rem;
    max-width: 50rem;
    margin-inline: auto;
  }
}

.p-housemaker-price__text {
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-housemaker-price__text {
    font-size: max(1rem, 10px);
    line-height: 1.875;
  }
}

.p-housemaker-price__text + .p-housemaker-price__text {
  margin-top: 0.75rem;
}

.p-housemaker-quality__craftsman {
  margin-top: 1.5625rem;
}
@media screen and (min-width: 768px) {
  .p-housemaker-quality__craftsman {
    margin-top: 2.5rem;
    display: grid;
    grid-template-columns: 20rem 1fr;
    gap: 1.875rem;
    align-items: center;
    max-width: 56.25rem;
    margin-inline: auto;
  }
}

.p-housemaker-quality__craftsman-image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.3125rem;
}

.p-housemaker-quality__craftsman-text {
  margin-top: 0.75rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-housemaker-quality__craftsman-text {
    margin-top: 0;
    font-size: max(0.9375rem, 10px);
    line-height: 1.8666666667;
  }
}

.p-housemaker-quality__check-title {
  margin-top: 1.875rem;
  text-align: center;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-housemaker-quality__check-title {
    margin-top: 2.8125rem;
    font-size: max(1.625rem, 10px);
  }
}

.p-housemaker-quality__check-image {
  margin-top: 0.9375rem;
}
@media screen and (min-width: 768px) {
  .p-housemaker-quality__check-image {
    margin-top: 1.5625rem;
    max-width: 50rem;
    margin-inline: auto;
  }
}

.p-housemaker-quality__check-image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
}

.p-housemaker-quality__text {
  margin-top: 1rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-housemaker-quality__text {
    margin-top: 1.5625rem;
    font-size: max(0.9375rem, 10px);
    line-height: 1.8666666667;
    max-width: 50rem;
    margin-inline: auto;
  }
}

.p-housemaker-makers__group {
  margin-top: 1.5625rem;
}
@media screen and (min-width: 768px) {
  .p-housemaker-makers__group {
    margin-top: 2.5rem;
    max-width: 56.25rem;
    margin-inline: auto;
  }
}

.p-housemaker-makers__maker {
  background-color: var(--color-sub);
  border-radius: 1.875rem;
  text-align: center;
  padding: 0.5rem 0.9375rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.4285714286;
  color: var(--color-white);
}
@media screen and (min-width: 768px) {
  .p-housemaker-makers__maker {
    font-size: max(1.875rem, 10px);
    padding: 0.625rem 1.25rem;
  }
}

.p-housemaker-makers__maker[data-maker=sekisui] {
  background: linear-gradient(90deg, #005bac 0%, #005bac 50%, #e60012 50%, #e60012 100%);
}

.p-housemaker-makers__maker[data-maker=hebel] {
  background-color: #0071bc;
}

.p-housemaker-makers__maker[data-maker=sumitomo] {
  background-color: #007a3d;
}

.p-housemaker-makers__maker[data-maker=daiwa] {
  background-color: #d71920;
}

.p-housemaker-makers__cases {
  margin-top: 0.9375rem;
  display: grid;
  gap: 0.9375rem;
}
@media screen and (min-width: 768px) {
  .p-housemaker-makers__cases {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5625rem;
    margin-top: 1.25rem;
    max-width: 43.75rem;
    margin-inline: auto;
  }
}

.p-housemaker-makers__case-image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4/3;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.3125rem;
}
@media screen and (min-width: 768px) {
  .p-housemaker-makers__case-image img {
    border-radius: 0.625rem;
  }
}

/* diagnosis-check__item-title に完全に合わせる（背景バー無し） */
.p-housemaker-makers__case-title {
  margin-top: 0.5rem;
  color: var(--color-sub);
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1.4;
}
@media screen and (min-width: 768px) {
  .p-housemaker-makers__case-title {
    font-size: max(1.125rem, 10px);
  }
}

/* diagnosis-check__item-text に合わせる */
.p-housemaker-makers__case-text {
  margin-top: 0.25rem;
  color: var(--color-sub);
  font-size: max(0.6875rem, 10px);
  font-weight: 500;
  line-height: 1.5;
}
@media screen and (min-width: 768px) {
  .p-housemaker-makers__case-text {
    font-size: max(0.875rem, 10px);
  }
}

.p-housemaker-makers-works {
  background-image: url(../images/housemaker/housemaker-makers-works-bg.webp);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  padding-block: 2.5rem;
  position: relative;
  z-index: 0;
  margin-bottom: 0;
}
@media screen and (min-width: 768px) {
  .p-housemaker-makers-works {
    padding-block: 3.75rem;
  }
}

.p-housemaker-makers-works::before {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background-color: rgba(0, 0, 0, 0.5);
}

.p-housemaker-makers-works__inner {
  position: relative;
  z-index: 1;
}

/* 暗背景セクションのリードは白に（左右のスラッシュ装飾も白） */
.p-housemaker-makers-works .c-section-title__lead {
  color: var(--color-white);
}

.p-housemaker-makers-works .c-section-title__lead::before,
.p-housemaker-makers-works .c-section-title__lead::after {
  background-color: var(--color-white);
}

.p-housemaker-makers-works__text {
  margin-top: 1.5625rem;
  text-align: center;
  color: var(--color-white);
}
@media screen and (min-width: 768px) {
  .p-housemaker-makers-works__text {
    margin-top: 2.5rem;
  }
}

.p-housemaker-makers__image {
  margin-top: 1.125rem;
}
@media screen and (min-width: 768px) {
  .p-housemaker-makers__image {
    margin-top: 1.5rem;
    max-width: 56.25rem;
    margin-inline: auto;
  }
}

.p-housemaker-makers__image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
}

.p-housemaker-makers__button {
  text-align: center;
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-housemaker-makers__button {
    margin-top: 1.5625rem;
  }
}

.p-housemaker-company__record {
  margin-top: 0.9375rem;
  text-align: center;
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-housemaker-company__record {
    margin-top: 1.5625rem;
    font-size: max(1.25rem, 10px);
  }
}

.p-housemaker-company__record strong {
  font-size: max(1.875rem, 10px);
  font-family: var(--second-font-family);
  font-weight: 700;
  color: var(--color-accent-red);
  padding-inline: 0.25rem;
}
@media screen and (min-width: 768px) {
  .p-housemaker-company__record strong {
    font-size: max(2.5rem, 10px);
  }
}

.p-housemaker-company__movie {
  margin-top: 0.9375rem;
}
@media screen and (min-width: 768px) {
  .p-housemaker-company__movie {
    margin-top: 1.5625rem;
    max-width: 43.75rem;
    margin-inline: auto;
  }
}

.p-housemaker-company__movie iframe {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
  border-radius: 0.3125rem;
}

.p-housemaker-company__photos {
  margin-top: 0.9375rem;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-housemaker-company__photos {
    margin-top: 1.5625rem;
    gap: 1.25rem;
    max-width: 43.75rem;
    margin-inline: auto;
  }
}

.p-housemaker-company__photo img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4/3;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.3125rem;
}

.p-housemaker-company__text {
  margin-top: 1.25rem;
  text-align: center;
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-housemaker-company__text {
    margin-top: 1.875rem;
    font-size: max(1.125rem, 10px);
  }
}

.p-housemaker-company__button {
  text-align: center;
  margin-top: 1.5625rem;
}
@media screen and (min-width: 768px) {
  .p-housemaker-company__button {
    margin-top: 2.1875rem;
  }
}

.p-line-intro.c-background-white {
  padding-block: 2.5rem;
}
@media screen and (min-width: 768px) {
  .p-line-intro.c-background-white {
    padding-block: 6.25rem;
  }
}

.p-line-intro__banner {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-line-intro__banner {
    margin-top: 2.5rem;
    max-width: 56.25rem;
    margin-inline: auto;
  }
}

.p-line-intro__banner img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 1.875rem;
}

@media screen and (min-width: 768px) {
  .p-line-step__inner {
    max-width: 56.25rem;
  }
}

.p-line-step__logos {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.875rem;
}
@media screen and (min-width: 768px) {
  .p-line-step__logos {
    gap: 1.5625rem;
  }
}

.p-line-step__logo {
  width: 7.5rem;
  height: auto;
}
@media screen and (min-width: 768px) {
  .p-line-step__logo {
    width: 15rem;
  }
}

.p-line-step__logo img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1;
  -o-object-fit: contain;
     object-fit: contain;
  border-radius: 0.625rem;
}

.p-line-step__cross {
  font-size: max(1.375rem, 10px);
  font-weight: 700;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-line-step__cross {
    font-size: max(1.875rem, 10px);
  }
}

.p-line-step__title {
  margin-top: 0.9375rem;
}
@media screen and (min-width: 768px) {
  .p-line-step__title {
    margin-top: 1.25rem;
  }
}

.p-line-step__lead {
  margin-top: 0.5rem;
  text-align: center;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-line-step__lead {
    font-size: max(1rem, 10px);
    line-height: 1.875;
  }
}

.p-line-step__block {
  margin-top: 1.875rem;
}
@media screen and (min-width: 768px) {
  .p-line-step__block {
    margin-top: 3.125rem;
  }
}

.p-line-step__block + .p-line-step__block {
  margin-top: 2.5rem;
}
@media screen and (min-width: 768px) {
  .p-line-step__block + .p-line-step__block {
    margin-top: 3.75rem;
  }
}

.p-line-step__head {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  background-color: var(--color-white);
  border-radius: 0.3125rem;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  padding: 0.625rem 0.875rem;
}
@media screen and (min-width: 768px) {
  .p-line-step__head {
    gap: 0.9375rem;
    padding: 0.875rem 1.25rem;
  }
}

.p-line-step__head-num {
  flex-shrink: 0;
  background-color: var(--color-main);
  color: var(--color-white);
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  font-family: var(--second-font-family);
  line-height: 1;
  border-radius: 0.1875rem;
  padding: 0.375rem 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-line-step__head-num {
    font-size: max(1rem, 10px);
  }
}

.p-line-step__head-title {
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-line-step__head-title {
    font-size: max(1.25rem, 10px);
  }
}

.p-line-step__cards {
  margin-top: 0.9375rem;
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-line-step__cards {
    margin-top: 1.25rem;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.25rem;
  }
}

.p-line-step__card {
  background-color: var(--color-white);
  border-radius: 0.3125rem;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  padding: 0.625rem;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-line-step__card {
    padding: 1.25rem;
  }
}

.p-line-step__card-image img {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
  border-radius: 0.1875rem;
}

.p-line-step__media {
  margin-top: 0.9375rem;
  display: grid;
  gap: 0.9375rem;
  background-color: var(--color-white);
  border-radius: 0.3125rem;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  padding: 0.9375rem;
}
@media screen and (min-width: 768px) {
  .p-line-step__media {
    margin-top: 1.25rem;
    grid-template-columns: 21.875rem 1fr;
    align-items: center;
    gap: 1.875rem;
    padding: 1.875rem;
  }
}

.p-line-step__media-image img {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
  border-radius: 0.1875rem;
}

.p-line-step__catch {
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-line-step__catch {
    font-size: max(1.25rem, 10px);
  }
}

.p-line-step__example {
  margin-top: 0.625rem;
  background-color: var(--color-bg-cream);
  border-radius: 0.3125rem;
  padding: 0.625rem 0.875rem;
}

.p-line-step__example-title {
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-line-step__example-title {
    font-size: max(0.875rem, 10px);
  }
}

.p-line-step__example-list {
  margin-top: 0.25rem;
  list-style: none;
}

.p-line-step__example-list li {
  position: relative;
  padding-left: 0.875rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-line-step__example-list li {
    font-size: max(0.875rem, 10px);
  }
}

.p-line-step__example-list li::before {
  content: "";
  position: absolute;
  top: 0.6em;
  left: 0;
  width: 0.5rem;
  height: 0.5rem;
  border-radius: 50%;
  background-color: var(--color-tel-green);
}

.p-line-step__id {
  margin-top: 0.75rem;
  text-align: center;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.5;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-line-step__id {
    font-size: max(0.9375rem, 10px);
  }
}

.p-line-step__text {
  text-align: left;
  margin-top: 0.75rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-line-step__text {
    font-size: max(1rem, 10px);
    line-height: 1.875;
  }
}

@media screen and (min-width: 768px) {
  .p-line-quote__inner {
    max-width: 56.25rem;
  }
}

.p-line-quote__banner img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
}

.p-line-quote__flow {
  margin-top: 1.875rem;
}
@media screen and (min-width: 768px) {
  .p-line-quote__flow {
    margin-top: 3.125rem;
  }
}

.p-line-quote__flow-band {
  margin-top: 0.9375rem;
  background-color: var(--color-main);
  color: var(--color-white);
  border-radius: 0.1875rem;
  padding: 0.375rem 0.75rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1.5;
}
@media screen and (min-width: 768px) {
  .p-line-quote__flow-band {
    margin-top: 1.25rem;
    font-size: max(0.9375rem, 10px);
    padding: 0.5rem 1rem;
  }
}

.p-line-quote__flow-text {
  margin-top: 0.625rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.6923076923;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-line-quote__flow-text {
    margin-top: 0.875rem;
    font-size: max(0.875rem, 10px);
    line-height: 1.8571428571;
  }
}

.p-line-quote__cards {
  margin-top: 0.9375rem;
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.5rem;
}
@media screen and (min-width: 768px) {
  .p-line-quote__cards {
    margin-top: 1.5625rem;
    gap: 1.25rem;
  }
}

.p-line-quote__card {
  background-color: var(--color-white);
  border-radius: 0.3125rem;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  padding: 0.1875rem 0.1875rem 0.5rem;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-line-quote__card {
    padding: 1rem;
  }
}

.p-line-quote__card-image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1;
  -o-object-fit: contain;
     object-fit: contain;
  border-radius: 0.1875rem;
}

.p-line-quote__card-label {
  margin-top: 0.5rem;
  font-size: max(0.6875rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-line-quote__card-label {
    font-size: max(0.875rem, 10px);
  }
}

.p-line-feature__text {
  margin-top: 0.9375rem;
  text-align: center;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-line-feature__text {
    margin-top: 1.5625rem;
    font-size: max(1rem, 10px);
    line-height: 1.875;
  }
}

.p-line-feature__list {
  margin-top: 0.9375rem;
  list-style: none;
  counter-reset: line-feature;
  background-color: var(--color-white);
  border-radius: 0.3125rem;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  padding: 1rem 0.875rem;
  display: grid;
  gap: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-line-feature__list {
    margin-top: 1.5625rem;
    padding: 1.5625rem 1.875rem;
    gap: 0.75rem;
  }
}

.p-line-feature__item {
  counter-increment: line-feature;
  position: relative;
  padding-left: 1.875rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-line-feature__item {
    padding-left: 2.25rem;
    font-size: max(0.9375rem, 10px);
  }
}

.p-line-feature__item::before {
  content: counter(line-feature);
  position: absolute;
  top: 0.1em;
  left: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1.375rem;
  height: 1.375rem;
  background-color: var(--color-tel-green);
  color: var(--color-white);
  font-size: max(0.75rem, 10px);
  font-weight: 700;
  font-family: var(--second-font-family);
  line-height: 1;
  border-radius: 50%;
}
@media screen and (min-width: 768px) {
  .p-line-feature__item::before {
    width: 1.625rem;
    height: 1.625rem;
    font-size: max(0.875rem, 10px);
  }
}

@media screen and (min-width: 768px) {
  .p-line-feature__list-wrap {
    position: relative;
    max-width: 51.25rem;
    margin-inline: auto;
    margin-top: 6.25rem;
    padding-right: 9.375rem;
  }
}

.p-line-feature__chara {
  display: none;
}
@media screen and (min-width: 768px) {
  .p-line-feature__chara {
    display: block;
    position: absolute;
    right: 0;
    bottom: 0;
    width: 8.125rem;
    z-index: 1;
  }
}

.p-line-feature__chara img {
  display: block;
  width: 100%;
  height: auto;
}

.p-line-feature__button {
  text-align: center;
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-line-feature__button {
    margin-top: 1.5625rem;
  }
}

.p-list {
  display: grid;
  gap: 0.25rem;
}

.p-list__item {
  position: relative;
  z-index: 0;
  padding-left: 0.875rem;
  font-weight: 500;
  line-height: 1.6923076923;
  color: var(--color-sub);
  list-style: none;
}
@media screen and (min-width: 768px) {
  .p-list__item {
    line-height: 1.7333333333;
  }
}

.p-list__item::before {
  content: "";
  position: absolute;
  top: 0.5rem;
  left: 0;
  z-index: 0;
  width: 0.5rem;
  aspect-ratio: 1;
  border-radius: 50%;
  background-color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-list__item::before {
    top: 0.75rem;
  }
}

.p-loan-intro__pay-list {
  margin-top: 1.25rem;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-loan-intro__pay-list {
    margin-top: 1.875rem;
    grid-template-columns: repeat(4, 1fr);
    gap: 0.9375rem;
  }
}

.p-loan-intro__pay-item {
  position: relative;
  list-style: none;
  background-color: var(--color-white);
  border-radius: 0.625rem;
  box-shadow: 0.25rem 0.25rem 0.625rem rgba(0, 0, 0, 0.1);
  text-align: center;
  transition: transform 0.3s ease, box-shadow 0.3s ease;
}

/* 各支払い方法セクションへのアンカーリンク（カード全体をクリック領域に） */
.p-loan-intro__pay-link {
  display: block;
  padding: 1rem 0.625rem 1.25rem;
  color: inherit;
}

/* アンカーリンクの合図：下向き矢印（オレンジ丸＋白シェブロン）※p-first-secrets と同じ意匠 */
.p-loan-intro__pay-arrow {
  position: absolute;
  left: 50%;
  bottom: -0.6875rem;
  transform: translateX(-50%);
  z-index: 1;
  display: grid;
  place-items: center;
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 50%;
  background-color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-loan-intro__pay-arrow {
    width: 2rem;
    height: 2rem;
    bottom: -1rem;
  }
}

.p-loan-intro__pay-arrow::before {
  content: "";
  display: block;
  width: 0.5rem;
  height: 0.5rem;
  margin-top: -0.25rem;
  border-right: 2px solid var(--color-white);
  border-bottom: 2px solid var(--color-white);
  transform: rotate(45deg);
}

@media (any-hover: hover) {
  .p-loan-intro__pay-item:hover {
    transform: translateY(0.25rem);
    box-shadow: 0.25rem 0.5rem 0.75rem rgba(0, 0, 0, 0.16);
  }
  .p-loan-intro__pay-item:hover .p-loan-intro__pay-link {
    opacity: 1;
  }
}
/* アンカー先：固定ヘッダー分だけ余白を確保してジャンプ位置がヘッダーに隠れないように */
.p-loan-partner,
.p-loan-credit,
.p-loan-bank,
.p-loan-cash {
  scroll-margin-top: var(--header-height);
}

.p-loan-intro__pay-icon {
  width: 3.75rem;
  margin-inline: auto;
}

.p-loan-intro__pay-icon img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1/1;
  -o-object-fit: contain;
     object-fit: contain;
}

.p-loan-intro__pay-label {
  margin-top: 0.5rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-loan-intro__pay-label {
    font-size: max(0.9375rem, 10px);
  }
}

.p-loan-intro__quote {
  margin-top: 1.5625rem;
  display: grid;
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-loan-intro__quote {
    margin-top: 2.5rem;
    max-width: 47.5rem;
    margin-inline: auto;
    gap: 1rem;
  }
}

.p-loan-intro__quote-item {
  display: flex;
  align-items: flex-start;
  gap: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-loan-intro__quote-item {
    gap: 0.875rem;
  }
}

.p-loan-intro__quote-avatar {
  flex-shrink: 0;
  width: 3rem;
  height: 3rem;
  border-radius: 50%;
  overflow: hidden;
}
@media screen and (min-width: 768px) {
  .p-loan-intro__quote-avatar {
    width: 3.75rem;
    height: 3.75rem;
  }
}

.p-loan-intro__quote-avatar img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.p-loan-intro__quote-text {
  position: relative;
  max-width: calc(100% - 3.625rem);
  background-color: var(--color-white);
  border-radius: 0.75rem;
  box-shadow: 0 0.125rem 0.375rem rgba(0, 0, 0, 0.08);
  padding: 0.875rem 1.125rem;
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-loan-intro__quote-text {
    max-width: calc(100% - 4.625rem);
    padding: 1.125rem 1.375rem;
    font-size: max(1.0625rem, 10px);
    line-height: 1.6470588235;
  }
}

.p-loan-intro__quote-text::before {
  content: "";
  position: absolute;
  top: 1rem;
  left: -0.4375rem;
  border-style: solid;
  border-width: 0.375rem 0.5rem 0.375rem 0;
  border-color: transparent var(--color-white) transparent transparent;
}

.p-loan-intro__text-wrap {
  margin-top: 0.9375rem;
  display: grid;
  gap: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-loan-intro__text-wrap {
    margin-top: 1.5625rem;
  }
}

.p-loan-intro__text {
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-loan-intro__text {
    font-size: max(1.125rem, 10px);
    line-height: 1.875;
  }
}

.p-loan-partner__cat,
.p-loan-credit__cat,
.p-loan-bank__cat,
.p-loan-cash__cat {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.875rem;
  text-align: left;
}
@media screen and (min-width: 768px) {
  .p-loan-partner__cat,
  .p-loan-credit__cat,
  .p-loan-bank__cat,
  .p-loan-cash__cat {
    gap: 1.125rem;
  }
}

.p-loan-partner__cat-icon,
.p-loan-credit__cat-icon,
.p-loan-bank__cat-icon,
.p-loan-cash__cat-icon {
  flex-shrink: 0;
  width: 3.625rem;
}
@media screen and (min-width: 768px) {
  .p-loan-partner__cat-icon,
  .p-loan-credit__cat-icon,
  .p-loan-bank__cat-icon,
  .p-loan-cash__cat-icon {
    width: 4.5rem;
  }
}

.p-loan-partner__cat-icon img,
.p-loan-credit__cat-icon img,
.p-loan-bank__cat-icon img,
.p-loan-cash__cat-icon img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1/1;
  -o-object-fit: contain;
     object-fit: contain;
}

.p-loan-partner__cat-body,
.p-loan-credit__cat-body,
.p-loan-bank__cat-body,
.p-loan-cash__cat-body {
  min-width: 0;
}

.p-loan-partner__num,
.p-loan-credit__num,
.p-loan-bank__num,
.p-loan-cash__num {
  display: inline-block;
  padding: 0.375rem 0.875rem;
  background-color: var(--color-main);
  border-radius: 0.1875rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  font-family: var(--second-font-family);
  color: var(--color-white);
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .p-loan-partner__num,
  .p-loan-credit__num,
  .p-loan-bank__num,
  .p-loan-cash__num {
    font-size: max(0.9375rem, 10px);
  }
}

.p-loan-partner__title,
.p-loan-credit__title,
.p-loan-bank__title,
.p-loan-cash__title {
  margin-top: 0.5rem;
  font-size: max(1.5rem, 10px);
  font-weight: 700;
  line-height: 1.3;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-loan-partner__title,
  .p-loan-credit__title,
  .p-loan-bank__title,
  .p-loan-cash__title {
    margin-top: 0.625rem;
    font-size: max(2rem, 10px);
  }
}

.p-loan-partner__subtitle {
  margin-top: 1.5625rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-main);
  border-bottom: 1px solid var(--color-border-line);
  padding-bottom: 0.5rem;
}
@media screen and (min-width: 768px) {
  .p-loan-partner__subtitle {
    margin-top: 2.1875rem;
    font-size: max(1.375rem, 10px);
    padding-bottom: 0.625rem;
  }
}

.p-loan-partner__rate-card {
  margin-top: 0.875rem;
  background-color: var(--color-bg-cream);
  border-radius: 0.625rem;
  padding: 1.125rem 1rem;
  position: relative;
}
@media screen and (min-width: 768px) {
  .p-loan-partner__rate-card {
    margin-top: 1.125rem;
    padding: 1.75rem 2.125rem;
  }
}

.p-loan-partner__rate-badge {
  position: absolute;
  top: -0.75rem;
  right: -0.375rem;
  width: 4.625rem;
  height: 4.625rem;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  background-color: var(--color-main);
  color: var(--color-white);
  border-radius: 50%;
  font-size: max(0.75rem, 10px);
  font-weight: 700;
  line-height: 1.3;
  transform: rotate(8deg);
}
@media screen and (min-width: 768px) {
  .p-loan-partner__rate-badge {
    width: 9.375rem;
    height: 9.375rem;
    font-size: max(1.25rem, 10px);
    top: -1rem;
    right: -0.625rem;
  }
}

.p-loan-partner__rate-head {
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-loan-partner__rate-head {
    font-size: max(1.125rem, 10px);
  }
}

.p-loan-partner__rate-row {
  margin-top: 0.75rem;
  display: flex;
  flex-direction: column;
  gap: 0.375rem;
  background-color: var(--color-white);
  border-radius: 0.5rem;
  padding: 0.875rem 1rem;
}
@media screen and (min-width: 768px) {
  .p-loan-partner__rate-row {
    margin-top: 0.875rem;
    display: grid;
    grid-template-columns: 9.375rem 1fr;
    align-items: center;
    gap: 1.125rem;
    padding: 1.125rem 1.375rem;
  }
}

.p-loan-partner__rate-row:last-child {
  border-bottom: 0;
}

.p-loan-partner__rate-label {
  color: var(--color-accent-green);
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
}
@media screen and (min-width: 768px) {
  .p-loan-partner__rate-label {
    font-size: max(0.875rem, 10px);
  }
}

.p-loan-partner__rate-value {
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-loan-partner__rate-value {
    font-size: max(1rem, 10px);
  }
}

.p-loan-partner__rate-strong {
  font-size: max(1.75rem, 10px);
  font-weight: 700;
  font-family: var(--second-font-family);
  color: var(--color-accent-red);
  /* SPは u-sp の <br> で2行になるため行間を空ける。PCは1行なので従来どおり詰める */
  line-height: 1.5;
}
@media screen and (min-width: 768px) {
  .p-loan-partner__rate-strong {
    font-size: max(2.75rem, 10px);
    line-height: 1;
  }
}

.p-loan-partner__rate-strong span {
  font-size: max(1rem, 10px);
  font-weight: 700;
  font-family: var(--base-font-family);
}
@media screen and (min-width: 768px) {
  .p-loan-partner__rate-strong span {
    font-size: max(1.25rem, 10px);
  }
}

.p-loan-partner__rate-small {
  display: block;
  font-size: max(0.6875rem, 10px);
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-loan-partner__rate-small {
    font-size: max(0.75rem, 10px);
  }
}

.p-loan-partner__rate-note {
  margin-top: 0.625rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-loan-partner__rate-note {
    font-size: max(0.9375rem, 10px);
  }
}

.p-loan-partner__note-list {
  margin-top: 0.625rem;
}

.p-loan-partner__note-list li {
  list-style: none;
  font-size: max(0.6875rem, 10px);
  font-weight: 500;
  line-height: 1.7;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-loan-partner__note-list li {
    font-size: max(0.75rem, 10px);
  }
}

.p-loan-partner__merit-list {
  margin-top: 0.875rem;
  display: grid;
  gap: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-loan-partner__merit-list {
    margin-top: 1.125rem;
    gap: 0.875rem;
  }
}

.p-loan-partner__merit-item {
  list-style: none;
  background-color: var(--color-bg-cream);
  border-radius: 0.625rem;
  padding: 1rem;
}
@media screen and (min-width: 768px) {
  .p-loan-partner__merit-item {
    padding: 1.25rem 1.5rem;
  }
}

.p-loan-partner__merit-item:last-child {
  border-bottom: 0;
}

.p-loan-partner__merit-title {
  position: relative;
  padding-left: 1.875rem;
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-loan-partner__merit-title {
    padding-left: 2.125rem;
    font-size: max(1.125rem, 10px);
  }
}

.p-loan-partner__merit-title::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0.0625rem;
  width: 1.25rem;
  height: 1.25rem;
  background-color: var(--color-accent-green);
  color: var(--color-white);
  border-radius: 50%;
  font-size: max(0.625rem, 10px);
  text-align: center;
  line-height: 1.25rem;
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .p-loan-partner__merit-title::before {
    top: 0.125rem;
    width: 1.375rem;
    height: 1.375rem;
    line-height: 1.375rem;
  }
}

.p-loan-partner__merit-text {
  margin-top: 0.5rem;
  padding-left: 1.875rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.7;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-loan-partner__merit-text {
    padding-left: 2.125rem;
    font-size: max(0.9375rem, 10px);
  }
}

.p-loan-partner__merit-note-list {
  margin-top: 0.375rem;
  padding-left: 1.875rem;
}
@media screen and (min-width: 768px) {
  .p-loan-partner__merit-note-list {
    padding-left: 2.125rem;
  }
}

.p-loan-partner__merit-note-list li {
  list-style: none;
  font-size: max(0.6875rem, 10px);
  font-weight: 500;
  line-height: 1.7;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-loan-partner__merit-note-list li {
    font-size: max(0.75rem, 10px);
  }
}

.p-loan-partner__sim-lead {
  margin-top: 0.75rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-loan-partner__sim-lead {
    font-size: max(0.875rem, 10px);
  }
}

.p-loan-partner__sim-table {
  margin-top: 0.625rem;
  overflow-x: auto;
}

.p-loan-partner__sim-table table {
  white-space: nowrap;
}

.p-loan-credit__catch {
  margin-top: 1.25rem;
  text-align: center;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-loan-credit__catch {
    margin-top: 1.875rem;
    font-size: max(1.5rem, 10px);
  }
}

.p-loan-credit__image {
  position: relative;
  margin-top: 0.9375rem;
}
@media screen and (min-width: 768px) {
  .p-loan-credit__image {
    margin-top: 1.25rem;
  }
}

/* あしらいキャラ（PCのみ）：画像の後ろから頭だけ「ひょこっ」と覗かせる。装飾なので alt="" */
.p-loan-credit__deco {
  display: none;
}
@media screen and (min-width: 768px) {
  .p-loan-credit__deco {
    display: block;
    position: absolute;
    z-index: 0;
    top: 0;
    right: 2.5rem;
    width: 6.5rem;
    height: auto;
    transform: translateY(calc(-46% - 3.125rem));
    pointer-events: none;
  }
}

.p-loan-credit__image picture {
  display: block;
  position: relative;
  z-index: 1;
}

.p-loan-credit__image picture img {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
}

.p-loan-credit__text-wrap {
  margin-top: 0.9375rem;
  display: grid;
  gap: 0.5rem;
}
@media screen and (min-width: 768px) {
  .p-loan-credit__text-wrap {
    margin-top: 1.5625rem;
  }
}

.p-loan-credit__text {
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-loan-credit__text {
    font-size: max(1.125rem, 10px);
    line-height: 1.875;
  }
}

.p-loan-credit__note {
  font-size: max(0.75rem, 10px);
  font-weight: 500;
  line-height: 1.7;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-loan-credit__note {
    font-size: max(0.8125rem, 10px);
  }
}

.p-loan-credit__point {
  margin-top: 1.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  text-align: center;
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-accent-red);
}
@media screen and (min-width: 768px) {
  .p-loan-credit__point {
    margin-top: 1.875rem;
    font-size: max(1.375rem, 10px);
  }
}

.p-loan-credit__point::before {
  content: "";
  display: block;
  width: 0.125rem;
  height: 1.75rem;
  transform: rotate(-35deg);
  background-color: var(--color-accent-red);
}

.p-loan-credit__point::after {
  content: "";
  display: block;
  width: 0.125rem;
  height: 1.75rem;
  transform: rotate(35deg);
  background-color: var(--color-accent-red);
}

.p-loan-bank__text {
  margin-top: 0.9375rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-loan-bank__text {
    font-size: max(1.125rem, 10px);
    line-height: 1.875;
  }
}

.p-loan-bank__diff-list {
  margin-top: 0.625rem;
}

.p-loan-bank__diff-list li {
  list-style: none;
  position: relative;
  padding: 0.375rem 0 0.375rem 1.625rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-loan-bank__diff-list li {
    font-size: max(0.9375rem, 10px);
  }
}

.p-loan-bank__diff-list li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0.5rem;
  width: 1.125rem;
  height: 1.125rem;
  background-color: var(--color-main);
  color: var(--color-white);
  border-radius: 50%;
  font-size: max(0.625rem, 10px);
  text-align: center;
  line-height: 1.125rem;
  font-weight: 700;
}

.p-loan-bank__table {
  margin-top: 0.9375rem;
  overflow-x: auto;
}
@media screen and (min-width: 768px) {
  .p-loan-bank__table {
    margin-top: 1.25rem;
  }
}

.p-loan-bank__text-wrap {
  margin-top: 0.3125rem;
}
@media screen and (min-width: 768px) {
  .p-loan-bank__text-wrap {
    margin-top: 0.625rem;
  }
}

.p-loan-bank__strong {
  font-weight: 700;
  color: var(--color-accent-red);
}

.p-loan-cash__text {
  margin-top: 0.9375rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-loan-cash__text {
    font-size: max(1.125rem, 10px);
    line-height: 1.875;
  }
}

.p-loan-cash__image {
  margin-top: 0.9375rem;
  max-width: 28.125rem;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .p-loan-cash__image {
    margin-top: 1.25rem;
  }
}

.p-loan-cash__image img {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
  border-radius: 0.3125rem;
}

@media screen and (min-width: 768px) {
  .p-loan-cash__row {
    margin-top: 1.5625rem;
    max-width: 50rem;
    margin-inline: auto;
  }
}

@media screen and (min-width: 768px) {
  .p-loan-cash__row .p-loan-cash__text {
    margin-top: 0;
    text-align: center;
  }
}

@media screen and (min-width: 768px) {
  .p-loan-cash__row .p-loan-cash__image {
    margin-top: 0;
    margin-inline: 0;
    max-width: none;
  }
}

.p-loan-cash__comment {
  margin-top: 1.5625rem;
}
@media screen and (min-width: 768px) {
  .p-loan-cash__comment {
    margin-top: 2.1875rem;
  }
}

/*
  商品メニュー 下層（/menu/wall・/menu/wall/{plan}・/menu/roof・/menu/others・/menu/apartment）
  page-wall.php / page-menu-plan.php / page-roof.php / page-others.php / page-apartment.php
  ※骨組み（フォント/色）のみ。レイアウト調整はユーザー側で実施
*/
/* ============ ページ共通（事例・声・ボタン） ============ */
/* 声セクションはスライダーがはみ出すため親で切る */
.p-menu-wall-voice,
.p-menu-plan-voice,
.p-menu-roof-voice,
.p-menu-others-voice,
.p-menu-apartment-voice {
  overflow-x: clip;
}

.p-menu-wall-works__button,
.p-menu-plan-works__button,
.p-menu-roof-works__button,
.p-menu-others-works__button,
.p-menu-apartment-works__button,
.p-menu-wall-voice__button,
.p-menu-plan-voice__button,
.p-menu-roof-voice__button,
.p-menu-others-voice__button,
.p-menu-apartment-voice__button,
.p-menu-roof__contact-button,
.p-menu-roof-cover__contact-button,
.p-menu-others-repair__link-button,
.p-menu-others-option__contact-button,
.p-menu-apartment-plan__card-button {
  margin-block-start: 2rem;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-menu-wall-works__button,
  .p-menu-plan-works__button,
  .p-menu-roof-works__button,
  .p-menu-others-works__button,
  .p-menu-apartment-works__button,
  .p-menu-wall-voice__button,
  .p-menu-plan-voice__button,
  .p-menu-roof-voice__button,
  .p-menu-others-voice__button,
  .p-menu-apartment-voice__button,
  .p-menu-roof__contact-button,
  .p-menu-roof-cover__contact-button,
  .p-menu-others-repair__link-button,
  .p-menu-others-option__contact-button,
  .p-menu-apartment-plan__card-button {
    margin-block-start: 2.5rem;
  }
}

/* ============ おすすめポイント（parts/menu-included） ============ */
.p-menu-included__heading-sub {
  font-size: max(1rem, 10px);
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-menu-included__heading-sub {
    font-size: max(1.125rem, 10px);
  }
}

.p-menu-included__lead {
  margin-block-start: 1.5rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-menu-included__lead {
    font-size: max(1.375rem, 10px);
  }
}

.p-menu-included__lead-accent {
  color: var(--color-main);
}

.p-menu-included__note {
  margin-block-start: 0.5rem;
  font-size: max(1rem, 10px);
  text-align: center;
}

.p-menu-included__list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.75rem;
  max-width: 50rem;
  margin-inline: auto;
  margin-block-start: 1.5rem;
}
@media screen and (min-width: 768px) {
  .p-menu-included__list {
    grid-template-columns: repeat(3, 1fr);
    gap: 1.25rem;
    margin-block-start: 2.5rem;
  }
}

.p-menu-included__item-image img {
  width: 100%;
  height: auto;
  aspect-ratio: 3/2;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.5rem;
}

.p-menu-included__item-label {
  margin-block-start: 0.375rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  text-align: center;
}

/* ============ プラン詳細ブロック（parts/menu-plan-detail） ============ */
.p-menu-plan-detail {
  max-width: 62.5rem;
  margin-inline: auto;
}

.p-menu-plan-detail__about {
  margin-block-start: 2.5rem;
}

.p-menu-plan-detail__rating {
  margin-block-start: 2.5rem;
}

.p-menu-plan-detail__about-title {
  font-size: max(1.25rem, 10px);
  font-weight: 700;
  text-align: center;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-menu-plan-detail__about-title {
    font-size: max(1.625rem, 10px);
  }
}

.p-menu-plan-detail__about-title span {
  color: var(--color-main);
}

.p-menu-plan-about__text {
  font-size: max(1.125rem, 10px);
}

.p-menu-plan-detail__button {
  margin-block-start: 3rem;
  text-align: center;
}

/* 屋根：ページ内プラン詳細ブロックの縦積み */
.p-menu-roof-details__block {
  max-width: 68.75rem;
  margin-inline: auto;
  padding: 1.25rem 1rem;
  scroll-margin-top: 6.25rem;
  background-color: var(--color-white);
  border-radius: 0.625rem;
  box-shadow: 0 0.125rem 0.75rem rgba(0, 0, 0, 0.1);
}
@media screen and (min-width: 768px) {
  .p-menu-roof-details__block {
    padding: 2.5rem;
  }
}

.p-menu-roof-details__block + .p-menu-roof-details__block {
  margin-block-start: 2.5rem;
}
@media screen and (min-width: 768px) {
  .p-menu-roof-details__block + .p-menu-roof-details__block {
    margin-block-start: 3.5rem;
  }
}

/* ============ LINEバナー（menu下層共通） ============ */
.p-menu-line-banner__image {
  max-width: 43.75rem;
  margin-inline: auto;
}

.p-menu-line-banner__image img {
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
}

/* ============ コミコミパック帯（wall / roof 共通の型） ============ */
.p-menu-wall__pack,
.p-menu-roof__pack {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  max-width: 62.5rem;
  margin-inline: auto;
  margin-block-start: 1.5rem;
  padding: 1.25rem;
  background-color: var(--color-white);
  border-radius: 0.625rem;
  box-shadow: 0 0.125rem 0.75rem rgba(0, 0, 0, 0.1);
}
@media screen and (min-width: 768px) {
  .p-menu-wall__pack,
  .p-menu-roof__pack {
    gap: 2rem;
    margin-block-start: 2rem;
    padding: 1.75rem 2.5rem;
  }
}

.p-menu-wall__pack-char,
.p-menu-roof__pack-char {
  display: none;
}
@media screen and (min-width: 768px) {
  .p-menu-wall__pack-char,
  .p-menu-roof__pack-char {
    display: block;
    order: -1;
    flex-shrink: 0;
    width: 7.5rem;
  }
}

.p-menu-wall__pack-char img,
.p-menu-roof__pack-char img {
  width: 100%;
  height: auto;
}

.p-menu-wall__list,
.p-menu-roof__list {
  margin-block-start: 2rem;
}
@media screen and (min-width: 768px) {
  .p-menu-wall__list,
  .p-menu-roof__list {
    margin-block-start: 3rem;
  }
}

.p-menu-wall__pack-title,
.p-menu-roof__pack-title {
  font-size: max(1.25rem, 10px);
}
@media screen and (min-width: 768px) {
  .p-menu-wall__pack-title,
  .p-menu-roof__pack-title {
    font-size: max(1.625rem, 10px);
  }
}
.p-menu-wall__pack-title,
.p-menu-roof__pack-title {
  font-weight: 700;
  text-align: center;
  color: var(--color-main);
}

.p-menu-wall__pack-text,
.p-menu-roof__pack-text {
  margin-block-start: 0.5rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  text-align: center;
}

.p-menu-wall__pack-note,
.p-menu-roof__pack-note {
  font-size: max(1rem, 10px);
  text-align: center;
}

/* ============ プラン詳細（page-menu-plan） ============ */
/* tanaka準拠のヒーローカード */
.p-menu-plan-hero__card {
  max-width: 62.5rem;
  margin-inline: auto;
  overflow: hidden;
  background-color: var(--color-white);
  border-radius: 0.625rem;
  box-shadow: 0 0.125rem 0.75rem rgba(0, 0, 0, 0.1);
  padding-block-end: 1.5rem;
}

.p-menu-plan-hero__topbar {
  padding: 0.625rem 1rem;
  font-size: max(0.9375rem, 10px);
}
@media screen and (min-width: 768px) {
  .p-menu-plan-hero__topbar {
    font-size: max(1.25rem, 10px);
  }
}
.p-menu-plan-hero__topbar {
  font-weight: 700;
  color: var(--color-white);
  background-color: var(--color-main);
}

.p-menu-plan-hero__card-image {
  display: flex;
}

.p-menu-plan-hero__card-image-label {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.375rem;
  flex: 0 0 45%;
  padding: 1rem 0.625rem;
  background-color: var(--color-white);
}
@media screen and (min-width: 768px) {
  .p-menu-plan-hero__card-image-label {
    gap: 0.625rem;
  }
}

.p-menu-plan-hero__card-image-label span {
  display: grid;
  place-items: center;
  width: 2.25rem;
  height: 2.25rem;
  font-size: max(1.5rem, 10px);
  font-weight: 700;
  color: var(--color-white);
  background-color: var(--color-main);
  border-radius: 0.375rem;
}
@media screen and (min-width: 768px) {
  .p-menu-plan-hero__card-image-label span {
    width: 4rem;
    height: 4rem;
    font-size: max(2.5rem, 10px);
    border-radius: 0.625rem;
  }
}

.p-menu-plan-hero__card-image img {
  flex: 1;
  min-width: 0;
  height: auto;
  aspect-ratio: 21/9;
  -o-object-fit: cover;
     object-fit: cover;
}

.p-menu-plan-hero__titles {
  padding: 1.25rem 1rem 0;
  text-align: center;
}

.p-menu-plan-hero__name {
  font-size: max(1.5rem, 10px);
  font-weight: 700;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-menu-plan-hero__name {
    font-size: max(1.875rem, 10px);
  }
}

.p-menu-plan-hero__name span {
  color: var(--color-main);
}

.p-menu-plan-hero__product-badge {
  display: inline-block;
  margin-block-start: 0.625rem;
  padding: 0.25rem 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-menu-plan-hero__product-badge {
    padding: 0.25rem 1.25rem;
  }
}
.p-menu-plan-hero__product-badge {
  font-size: max(1rem, 10px);
  font-weight: 700;
  color: var(--color-main);
  border: 2px solid var(--color-main);
  border-radius: 0.375rem;
}

.p-menu-plan-hero__price-row {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: center;
  gap: 0.5rem 0.625rem;
  margin-block-start: 1.25rem;
  padding-inline: 1rem;
}
@media screen and (min-width: 768px) {
  .p-menu-plan-hero__price-row {
    flex-wrap: nowrap;
  }
}

.p-menu-plan-hero__price-row .p-menu-plan-hero__price-num,
.p-menu-plan-hero__price-row .p-menu-plan-hero__price-unit,
.p-menu-plan-hero__price-row .p-menu-plan-hero__price-tag {
  white-space: nowrap;
}

.p-menu-plan-hero__price-pill {
  flex: 0 0 100%;
  align-self: center;
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  padding: 0.375rem 1rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  white-space: nowrap;
  color: var(--color-white);
  background-color: var(--color-sub);
  border-radius: 62.4375rem;
}
@media screen and (min-width: 768px) {
  .p-menu-plan-hero__price-pill {
    flex: 0 0 auto;
    margin-inline: 0;
  }
}

.p-menu-plan-hero__card-note {
  margin-block-start: 0.625rem;
  padding-inline: 1rem;
  font-size: max(1rem, 10px);
  text-align: center;
}

.p-menu-plan-hero__pack-box {
  max-width: 62.5rem;
  margin-inline: auto;
}

.p-menu-plan-hero__inner {
  max-width: 50rem;
}

.p-menu-plan-hero__image img {
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.625rem;
}

.p-menu-plan-hero__head {
  margin-block-start: 1.25rem;
  padding: 1rem 0.625rem;
  border-radius: 0.625rem 0.625rem 0 0;
}

.p-menu-plan-hero__price-box {
  padding: 1.25rem;
  background-color: var(--color-white);
  border-radius: 0 0 0.625rem 0.625rem;
  box-shadow: 0 0.125rem 0.625rem rgba(0, 0, 0, 0.08);
}

.p-menu-plan-hero__price-label {
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  padding: 0.25rem 1rem;
  border-radius: 62.4375rem;
}

.p-menu-plan-hero__price {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 0.375rem;
  margin-block-start: 0.5rem;
}

.p-menu-plan-hero__price-note {
  margin-block-start: 0.5rem;
}

.p-menu-plan-hero__pack-box {
  margin-block-start: 1.5rem;
  padding: 1rem 1.25rem;
  background-color: var(--color-white);
  border: 2px solid var(--color-border-line);
  border-radius: 0.625rem;
}

.p-menu-plan-hero__pack-text {
  margin-block-start: 0.5rem;
}

.p-menu-plan-about__container {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 1rem;
  max-width: 43.75rem;
  margin-inline: auto;
  margin-block-start: 1.5rem;
}
@media screen and (min-width: 768px) {
  .p-menu-plan-about__container {
    flex-direction: row;
    gap: 2rem;
    margin-block-start: 2.5rem;
  }
}

.p-menu-plan-about__image {
  flex-shrink: 0;
  width: 10rem;
}
@media screen and (min-width: 768px) {
  .p-menu-plan-about__image {
    width: 13.75rem;
  }
}

.p-menu-plan-about__image img {
  width: 100%;
  height: auto;
  aspect-ratio: 1/1;
  -o-object-fit: contain;
     object-fit: contain;
  background-color: var(--color-white);
  border-radius: 0.625rem;
}

.p-menu-plan-about__spec {
  display: grid;
  gap: 0.75rem;
  max-width: 43.75rem;
  margin-inline: auto;
  margin-block-start: 1.5rem;
}
@media screen and (min-width: 768px) {
  .p-menu-plan-about__spec {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.25rem;
    margin-block-start: 2rem;
  }
}

.p-menu-plan-about__spec-row {
  display: flex;
  align-items: center;
  overflow: hidden;
  background-color: var(--color-white);
  border: 2px solid var(--color-border-line);
  border-radius: 0.5rem;
}

.p-menu-plan-about__spec-title {
  display: grid;
  place-items: center;
  align-self: stretch;
  flex-shrink: 0;
  width: 9.375rem;
  padding: 0.75rem 0.625rem;
  text-align: center;
}

.p-menu-plan-about__spec-data {
  flex-grow: 1;
  padding: 0.75rem 0.625rem;
  text-align: center;
}

.p-menu-plan-rating__list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.75rem;
  max-width: 56.25rem;
  margin-inline: auto;
  margin-block-start: 1.5rem;
}
@media screen and (min-width: 768px) {
  .p-menu-plan-rating__list {
    grid-template-columns: repeat(3, 1fr);
    gap: 1rem;
    margin-block-start: 2rem;
  }
}

.p-menu-plan-rating__row {
  overflow: hidden;
  background-color: var(--color-white);
  border-radius: 0.5rem;
  box-shadow: 0 0.125rem 0.625rem rgba(0, 0, 0, 0.08);
}

.p-menu-plan-rating__label {
  padding: 0.375rem 0.625rem;
}

.p-menu-plan-rating__stars {
  padding: 0.5rem 0.375rem;
  letter-spacing: 0.08em;
  white-space: nowrap;
}
@media screen and (min-width: 768px) {
  .p-menu-plan-rating__stars {
    padding: 0.5rem 0.625rem;
    letter-spacing: 0.2em;
  }
}

.p-menu-plan-other__list {
  margin-block-start: 2rem;
}
@media screen and (min-width: 768px) {
  .p-menu-plan-other__list {
    margin-block-start: 3rem;
  }
}

.p-menu-plan-hero__maker {
  font-size: max(1.125rem, 10px);
  color: var(--color-white);
}

.p-menu-plan-hero__pack {
  font-size: max(1.75rem, 10px);
  font-weight: 700;
  color: var(--color-white);
}

.p-menu-plan-hero__head {
  text-align: center;
  background-color: var(--color-main);
}

.p-menu-plan-hero__product {
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  color: var(--color-white);
}

.p-menu-plan-hero__price-label {
  font-size: max(1rem, 10px);
  font-weight: 700;
  color: var(--color-white);
  background-color: var(--color-sub);
}

.p-menu-plan-hero__price {
  text-align: center;
}

.p-menu-plan-hero__price-num {
  font-family: var(--second-font-family);
  font-size: max(3rem, 10px);
  font-weight: 700;
  color: var(--color-accent-red);
}

.p-menu-plan-hero__price-unit {
  font-size: max(1.25rem, 10px);
  font-weight: 700;
  color: var(--color-accent-red);
}

.p-menu-plan-hero__price-tag {
  font-size: max(1rem, 10px);
  font-weight: 700;
}

.p-menu-plan-hero__price-note {
  font-size: max(1.125rem, 10px);
  text-align: center;
}

.p-menu-plan-hero__pack-title {
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  text-align: center;
  color: var(--color-main);
}

.p-menu-plan-hero__pack-text {
  font-size: max(1.125rem, 10px);
  text-align: center;
}

.p-menu-plan-about__spec-title {
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  color: var(--color-white);
  background-color: var(--color-main);
}

.p-menu-plan-about__spec-data {
  font-size: max(1.25rem, 10px);
  font-weight: 700;
  color: var(--color-sub);
}

.p-menu-plan-rating__label {
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  text-align: center;
  color: var(--color-white);
  background-color: var(--color-sub);
}

.p-menu-plan-rating__stars {
  font-size: max(1.125rem, 10px);
  text-align: center;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-menu-plan-rating__stars {
    font-size: max(1.5rem, 10px);
  }
}

/* ============ 屋根（page-roof） ============ */
/* SP: カバー工法のスペックと価格を横並び */
.p-menu-roof-cover__info,
.p-menu-roof-digest__cover-info {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-end;
  gap: 0.5rem 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-menu-roof-cover__info,
  .p-menu-roof-digest__cover-info {
    display: block;
  }
}

.p-menu-roof-cover__desc,
.p-menu-roof-digest__cover-desc {
  flex-basis: 100%;
}

/* アンカーカード：first-secrets流用の上書き（白背景・大きめ） */
.p-menu-roof-nav__link {
  padding: 1.125rem 1.5rem;
  font-size: max(1.125rem, 10px);
  background-color: var(--color-white);
}
@media screen and (min-width: 768px) {
  .p-menu-roof-nav__link {
    padding: 1.5rem 2rem;
    font-size: max(1.25rem, 10px);
  }
}

.p-menu-roof-nav__list {
  display: flex;
  justify-content: center;
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-menu-roof-nav__list {
    gap: 1.5rem;
  }
}

.p-menu-roof-nav__item {
  width: min(100%, 13.75rem);
}

.p-menu-roof-cover__text-wrap {
  max-width: 50rem;
  margin-inline: auto;
  margin-block-start: 1.5rem;
}

.p-menu-roof-cover__text {
  text-align: center;
}

.p-menu-roof-cover__body {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  max-width: 50rem;
  margin-inline: auto;
  margin-block-start: 1.5rem;
}
@media screen and (min-width: 768px) {
  .p-menu-roof-cover__body {
    flex-direction: row;
    align-items: flex-start;
    gap: 1.5rem;
  }
}

@media screen and (min-width: 768px) {
  .p-menu-roof-cover__image {
    flex-shrink: 0;
    width: 50%;
  }
}

.p-menu-roof-cover__image img {
  width: 100%;
  height: auto;
  aspect-ratio: 3/2;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.5rem;
}

.p-menu-roof-cover__desc {
  font-size: max(1rem, 10px);
  font-weight: 700;
}

.p-menu-roof-cover__spec {
  margin-block-start: 0.75rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .p-menu-roof-cover__spec {
    font-size: max(1.25rem, 10px);
  }
}

.p-menu-roof-cover__price {
  margin-block-start: 0.75rem;
  line-height: 1;
}

.p-menu-roof-cover__note {
  max-width: 50rem;
  margin-inline: auto;
  margin-block-start: 0.625rem;
  font-size: max(1rem, 10px);
}

.p-menu-roof-nav__link {
  display: block;
  font-size: max(1rem, 10px);
  font-weight: 700;
  text-align: center;
  color: var(--color-main);
  border: 1px solid var(--color-main);
  border-radius: 62.4375rem;
}

.p-menu-roof-cover__price-num {
  font-family: var(--second-font-family);
  font-size: max(2.5rem, 10px);
  font-weight: 700;
  color: var(--color-accent-red);
}

.p-menu-roof-cover__note {
  font-size: max(1rem, 10px);
}

/* ============ 雨漏り・小工事（page-others） ============ */
.p-menu-others-repair__lead,
.p-menu-others-small__lead,
.p-menu-others-option__lead {
  margin-block-start: 1.25rem;
  text-align: center;
}

.p-menu-others-repair__list {
  display: grid;
  gap: 0.625rem;
  max-width: 43.75rem;
  margin-inline: auto;
  margin-block-start: 1.5rem;
}

.p-menu-others-repair__item {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.25rem 0.75rem;
  padding: 0.75rem 1rem;
  background-color: var(--color-white);
  border-radius: 0.5rem;
  box-shadow: 0 0.125rem 0.625rem rgba(0, 0, 0, 0.08);
}

.p-menu-others-small__list {
  display: grid;
  gap: 0.75rem;
  max-width: 50rem;
  margin-inline: auto;
  margin-block-start: 1.5rem;
}
@media screen and (min-width: 768px) {
  .p-menu-others-small__list {
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
    margin-block-start: 2rem;
  }
}

.p-menu-others-small__item {
  padding: 0.875rem 1rem;
  background-color: var(--color-white);
  border-radius: 0.5rem;
  box-shadow: 0 0.125rem 0.625rem rgba(0, 0, 0, 0.08);
}

.p-menu-others-small__price {
  margin-block-start: 0.25rem;
}

.p-menu-others-option__image {
  margin-block-start: 1.5rem;
  text-align: center;
}

.p-menu-others-option__image img {
  width: 100%;
  max-width: 37.5rem;
  height: auto;
}

.p-menu-others-option__table {
  max-width: 50rem;
  margin-inline: auto;
  margin-block-start: 1.5rem;
}

.p-menu-others-repair__name,
.p-menu-others-small__name {
  font-size: max(1rem, 10px);
  font-weight: 700;
}

.p-menu-others-small__time {
  font-size: max(1rem, 10px);
  font-weight: 400;
}

.p-menu-others-repair__price-num,
.p-menu-others-small__price-num {
  font-family: var(--second-font-family);
  font-size: max(1.5rem, 10px);
  font-weight: 700;
  color: var(--color-accent-red);
}

.p-menu-others-repair__price-tax {
  font-size: max(1rem, 10px);
}

.p-menu-others-option__table-note {
  font-size: max(1rem, 10px);
}

/* ============ アパート・マンション（page-apartment） ============ */
.p-menu-apartment-intro__lead {
  margin-block-start: 1.25rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-menu-apartment-intro__lead {
    font-size: max(1.375rem, 10px);
  }
}

.p-menu-apartment-intro__badge-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.625rem;
  margin-block-start: 1rem;
}

.p-menu-apartment-intro__text-wrap {
  display: grid;
  gap: 0.625rem;
  max-width: 50rem;
  margin-inline: auto;
  margin-block-start: 1.5rem;
}

.p-menu-apartment-plan__list {
  display: grid;
  gap: 1.5rem;
  max-width: 56.25rem;
  margin-inline: auto;
  margin-block-start: 2rem;
}
@media screen and (min-width: 768px) {
  .p-menu-apartment-plan__list {
    grid-template-columns: repeat(2, 1fr);
    gap: 2rem;
    margin-block-start: 3rem;
  }
}

.p-menu-apartment-plan__card-image-wrap {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.5rem;
  padding-inline: 1rem;
  margin-block-start: 1rem;
}

.p-menu-apartment-plan__card-image img {
  width: 100%;
  height: auto;
  aspect-ratio: 3/2;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.5rem;
}

.p-menu-apartment-plan__card-pack {
  margin-block-start: 1rem;
  font-size: max(1.5rem, 10px);
  font-weight: 700;
  text-align: center;
}

.p-menu-apartment-plan__card-pack-wall {
  color: var(--color-accent-green);
}

.p-menu-apartment-plan__card-pack-roof {
  color: var(--color-main);
}

.p-menu-apartment-plan__card-includes {
  margin-block-start: 0.75rem;
  padding-inline: 1rem;
  font-size: max(1rem, 10px);
  text-align: center;
}

.p-menu-apartment-plan__card-guarantee {
  margin-block-start: 0.25rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  text-align: center;
  color: var(--color-accent-red);
}

.p-menu-apartment-plan__card-breakdown-box {
  margin-inline: 1rem;
  margin-block-start: 1rem;
  padding: 1rem;
  background-color: var(--color-bg-cream);
  border-radius: 0.5rem;
}

.p-menu-apartment-plan__card-badges {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
}

.p-menu-apartment-plan__card-badge {
  padding: 0.25rem 1rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  color: var(--color-white);
  border-radius: 0.375rem;
}

.p-menu-apartment-plan__card-badge[data-type=wall] {
  background-color: var(--color-accent-green);
}

.p-menu-apartment-plan__card-badge[data-type=roof] {
  background-color: var(--color-main);
}

.p-menu-apartment-plan__card-breakdown {
  margin-block-start: 0.625rem;
  font-size: max(1.25rem, 10px);
  font-weight: 700;
  text-align: center;
}

.p-menu-apartment-plan__card-breakdown-label {
  margin-inline-end: 0.375rem;
  font-size: max(1rem, 10px);
}

.p-menu-apartment-plan__card-breakdown-tax {
  display: block;
  font-size: max(1rem, 10px);
  font-weight: 400;
}

.p-menu-apartment-plan__card-price {
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: 0.5rem;
  margin-block-start: 1rem;
  font-size: max(1.375rem, 10px);
  font-weight: 700;
  color: var(--color-accent-red);
}

.p-menu-apartment-plan__card-price-label {
  font-size: max(1.125rem, 10px);
  color: var(--color-sub);
}

.p-menu-apartment-plan__card-price-num {
  font-family: var(--second-font-family);
  font-size: max(3.5rem, 10px);
  font-weight: 700;
  line-height: 1;
}

.p-menu-apartment-plan__card-price-tax {
  margin-block-start: 0.375rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  text-align: center;
  color: var(--color-accent-red);
}

.p-menu-apartment-plan__card-note {
  margin-block-start: 0.75rem;
  font-size: max(1rem, 10px);
  text-align: center;
}

.p-menu-apartment-small__table,
.p-menu-apartment-warranty__table {
  max-width: 50rem;
  margin-inline: auto;
  margin-block-start: 1.5rem;
}

.p-menu-apartment-small__table th,
.p-menu-apartment-small__table td {
  font-size: max(1.125rem, 10px);
}
@media screen and (min-width: 768px) {
  .p-menu-apartment-small__table th,
  .p-menu-apartment-small__table td {
    font-size: max(1.25rem, 10px);
  }
}

.p-menu-apartment-warranty__table th,
.p-menu-apartment-warranty__table td {
  font-size: max(1.125rem, 10px);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-menu-apartment-warranty__table th,
  .p-menu-apartment-warranty__table td {
    font-size: max(1.25rem, 10px);
  }
}

.p-menu-apartment-small__lead,
.p-menu-apartment-small__more,
.p-menu-apartment-warranty__lead {
  margin-block-start: 1.25rem;
  text-align: center;
}

.p-menu-apartment-strength__list {
  display: grid;
  gap: 1.5rem;
  max-width: 50rem;
  margin-inline: auto;
  margin-block-start: 2rem;
}
@media screen and (min-width: 768px) {
  .p-menu-apartment-strength__list {
    gap: 2.5rem;
    margin-block-start: 3rem;
  }
}

.p-menu-apartment-strength__item {
  padding: 1.25rem;
  background-color: var(--color-white);
  border-radius: 0.625rem;
  box-shadow: 0 0.125rem 0.625rem rgba(0, 0, 0, 0.08);
}

.p-menu-apartment-strength__num {
  display: grid;
  place-items: center;
  width: 2.75rem;
  height: 2.75rem;
  margin-inline: auto;
  border-radius: 50%;
}

.p-menu-apartment-strength__item-title {
  margin-block-start: 0.625rem;
  font-size: max(1.25rem, 10px);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-menu-apartment-strength__item-title {
    font-size: max(1.625rem, 10px);
  }
}

.p-menu-apartment-strength__item-catch {
  margin-block-start: 0.375rem;
}

.p-menu-apartment-strength__item-image {
  margin-block-start: 1rem;
  text-align: center;
}

.p-menu-apartment-strength__item-image img {
  width: 100%;
  max-width: 37.5rem;
  height: auto;
  border-radius: 0.5rem;
}

.p-menu-apartment-strength__item-text {
  margin-block-start: 0.75rem;
}

.p-menu-apartment-design__image-wrap {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.75rem;
  max-width: 43.75rem;
  margin-inline: auto;
  margin-block-start: 1.5rem;
}

.p-menu-apartment-design__image img {
  width: 100%;
  height: auto;
  aspect-ratio: 3/2;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.5rem;
}

.p-menu-apartment-design__sub-title {
  margin-block-start: 2rem;
  text-align: center;
}

.p-menu-apartment-design__cycle,
.p-menu-apartment-design__point {
  max-width: 50rem;
  margin-inline: auto;
  margin-block-start: 1.5rem;
  padding: 1.25rem;
  background-color: var(--color-white);
  border-radius: 0.625rem;
  box-shadow: 0 0.125rem 0.625rem rgba(0, 0, 0, 0.08);
}

.p-menu-apartment-design__cycle-list {
  display: grid;
  gap: 1rem;
  max-width: 17.5rem;
  margin-inline: auto;
  margin-block-start: 1rem;
}
@media screen and (min-width: 768px) {
  .p-menu-apartment-design__cycle-list {
    grid-template-columns: repeat(3, 1fr);
    gap: 1.5rem;
    max-width: none;
  }
}

.p-menu-apartment-design__cycle-note,
.p-menu-apartment-design__point-note {
  margin-block-start: 0.75rem;
}

.p-menu-apartment-design__point-list {
  display: grid;
  gap: 0.75rem;
  margin-block-start: 1rem;
}

.p-menu-apartment-design__text-wrap {
  display: grid;
  gap: 0.625rem;
  max-width: 50rem;
  margin-inline: auto;
  margin-block-start: 1.5rem;
}

.p-menu-apartment-design__offer {
  max-width: 62.5rem;
  margin-inline: auto;
  margin-block-start: 2rem;
  background-color: var(--color-bg-cream);
  border-radius: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-menu-apartment-design__offer {
    padding: 1.25rem;
  }
}

.p-menu-apartment-design__offer-text {
  margin-block-start: 0.5rem;
  text-align: center;
}

.p-menu-apartment-design__offer-flow {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  margin-block-start: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-menu-apartment-design__offer-flow {
    gap: 1rem;
  }
}

.p-menu-apartment-design__offer-step {
  margin-block-start: 0.5rem;
  padding: 0.5rem 1.25rem;
  border-radius: 0.5rem;
}

.p-menu-apartment-design__offer-desc {
  margin-block-start: 1rem;
}

.p-menu-apartment-warranty__text-wrap {
  display: grid;
  gap: 0.625rem;
  max-width: 50rem;
  margin-inline: auto;
  margin-block-start: 1.5rem;
}

.p-menu-apartment-intro__badge {
  font-size: max(1rem, 10px);
  font-weight: 700;
  text-align: center;
  color: var(--color-white);
  background-color: var(--color-main);
}

.p-menu-apartment-plan__card {
  overflow: hidden;
  background-color: var(--color-white);
  border-radius: 0.625rem;
  box-shadow: 0 0.125rem 0.625rem rgba(0, 0, 0, 0.08);
  padding-block-end: 1.25rem;
}

.p-menu-apartment-plan__card-title {
  padding: 0.75rem;
  font-size: max(1.25rem, 10px);
  font-weight: 700;
  text-align: center;
  color: var(--color-white);
  background-color: var(--color-accent-green);
}

.p-menu-apartment-strength__num {
  font-family: var(--second-font-family);
  font-size: max(1.25rem, 10px);
  font-weight: 700;
  text-align: center;
  color: var(--color-white);
  background-color: var(--color-accent-green);
}

.p-menu-apartment-strength__item-catch {
  font-size: max(1rem, 10px);
  font-weight: 700;
  text-align: center;
}

/* イントロのアンカーナビ */
.p-menu-apartment-intro__nav-list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.625rem;
  max-width: 56.25rem;
  margin-inline: auto;
  margin-block-start: 2rem;
}
@media screen and (min-width: 768px) {
  .p-menu-apartment-intro__nav-list {
    grid-template-columns: repeat(5, 1fr);
    gap: 0.75rem;
  }
}

.p-menu-apartment-intro__nav-link {
  display: grid;
  place-items: center;
  height: 100%;
  padding: 0.75rem 0.5rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  text-align: center;
  color: var(--color-main);
  background-color: var(--color-white);
  border: 1px solid var(--color-main);
  border-radius: 0.5rem;
  transition: opacity 0.3s;
}

@media (any-hover: hover) {
  .p-menu-apartment-intro__nav-link:hover {
    opacity: 0.7;
  }
}
/* 防水・雨漏り */
.p-menu-apartment-waterproof__table,
.p-menu-apartment-waterproof__leak-table,
.p-menu-apartment-tile__table {
  max-width: 50rem;
  margin-inline: auto;
  margin-block-start: 1.5rem;
}

.p-menu-apartment-waterproof__table th,
.p-menu-apartment-waterproof__table td,
.p-menu-apartment-waterproof__leak-table th,
.p-menu-apartment-waterproof__leak-table td,
.p-menu-apartment-tile__table th,
.p-menu-apartment-tile__table td {
  font-size: max(1.25rem, 10px);
}

.p-menu-apartment-waterproof__leak-title {
  margin-block-start: 3.5rem;
}

.p-menu-apartment-waterproof__more {
  max-width: 50rem;
  margin-inline: auto;
  margin-block-start: 1.5rem;
  font-weight: 700;
  text-align: center;
}

/* 入居率デザイン塗装：追加ブロック */
.p-menu-apartment-design__image-caption {
  margin-block-start: 0.5rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  text-align: center;
}

.p-menu-apartment-design__table-note {
  margin-block-start: 0.75rem;
  font-size: max(1rem, 10px);
  text-align: center;
}

/* 表の横スクロールはSPのみ。PCは収める */
.p-menu-apartment-design__scroll {
  max-width: 50rem;
  margin-inline: auto;
  margin-block-start: 1rem;
  overflow-x: auto;
}
@media screen and (min-width: 768px) {
  .p-menu-apartment-design__scroll {
    overflow-x: visible;
  }
}

.p-menu-apartment-design__rate-table {
  --cell-padding-block: 0.875rem;
  --cell-padding-inline: 0.5rem;
  min-width: 37.5rem;
}
@media screen and (min-width: 768px) {
  .p-menu-apartment-design__rate-table {
    min-width: 0;
  }
}

.p-menu-apartment-design__rate-table th,
.p-menu-apartment-design__rate-table td {
  font-size: max(1rem, 10px);
  text-align: center;
  white-space: nowrap;
}
@media screen and (min-width: 768px) {
  .p-menu-apartment-design__rate-table th,
  .p-menu-apartment-design__rate-table td {
    white-space: normal;
  }
}

.p-menu-apartment-design__check-list {
  display: grid;
  gap: 0.625rem;
  max-width: 50rem;
  margin-inline: auto;
  margin-block-start: 1.25rem;
}

.p-menu-apartment-design__check-item {
  position: relative;
  padding-inline-start: 1.75rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
}

.p-menu-apartment-design__check-item::before {
  content: "";
  position: absolute;
  inset-block-start: 0.25rem;
  inset-inline-start: 0;
  width: 1rem;
  height: 1rem;
  background-color: var(--color-main);
  border-radius: 50%;
}

.p-menu-apartment-design__note-box {
  max-width: 50rem;
  margin-inline: auto;
  margin-block-start: 1.5rem;
  padding: 1.25rem;
  background-color: var(--color-white);
  border: 2px solid var(--color-main);
  border-radius: 0.625rem;
}

.p-menu-apartment-design__note-box-title {
  margin-block-end: 0.75rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  text-align: center;
  color: var(--color-main);
}

.p-menu-apartment-design__sim-wrap {
  display: grid;
  gap: 1.5rem;
  max-width: 75rem;
  margin-inline: auto;
  margin-block-start: 1.5rem;
}
@media screen and (min-width: 768px) {
  .p-menu-apartment-design__sim-wrap {
    grid-template-columns: repeat(2, 1fr);
    align-items: start;
  }
}

.p-menu-apartment-design__sim-title {
  padding: 0.625rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  text-align: center;
  color: var(--color-white);
  background-color: var(--color-sub);
  border-radius: 0.5rem 0.5rem 0 0;
}

.p-menu-apartment-design__sim-table th,
.p-menu-apartment-design__sim-table td {
  padding: 0.625rem 0.75rem;
  font-size: max(1rem, 10px);
}

/* 罫線はセル余白ぶん縮めず幅いっぱいに */
.p-menu-apartment-design__sim-table tbody tr:not(:last-child)::after {
  inset-inline: 0;
}

.p-menu-apartment-design__sim-total {
  font-weight: 700;
  color: var(--color-accent-red);
}

/* 保証書 */
.p-menu-apartment-warranty__band {
  max-width: 31.25rem;
  margin-inline: auto;
  margin-block-start: 2.5rem;
  padding: 0.625rem 1rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  text-align: center;
  color: var(--color-sub);
  background-color: var(--color-bg-cream);
  border-radius: 62.4375rem;
}
@media screen and (min-width: 768px) {
  .p-menu-apartment-warranty__band {
    font-size: max(1.25rem, 10px);
  }
}

.p-menu-apartment-warranty__image {
  margin-block-start: 1.25rem;
}

.p-menu-apartment-warranty__image img {
  display: block;
  width: 100%;
  max-width: 28.125rem;
  height: auto;
  margin-inline: auto;
  border-radius: 0.5rem;
}

.p-menu-apartment-design__cycle-title {
  font-size: max(1rem, 10px);
  font-weight: 700;
  text-align: center;
}

.p-menu-apartment-design__point-title {
  font-size: max(1.25rem, 10px);
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-menu-apartment-design__point-title {
    font-size: max(1.5rem, 10px);
  }
}

.p-menu-apartment-design__cycle-item {
  font-size: max(1rem, 10px);
  font-weight: 700;
  text-align: center;
}

.p-menu-apartment-design__cycle-note,
.p-menu-apartment-design__point-note {
  font-size: max(1.25rem, 10px);
  font-weight: 700;
  text-align: center;
  color: var(--color-main);
}

.p-menu-apartment-design__point-item {
  font-size: max(1rem, 10px);
  font-weight: 700;
}

.p-menu-apartment-design__offer-lead {
  font-size: max(1.4375rem, 10px);
  font-weight: 700;
  text-align: center;
  color: var(--color-main);
}

.p-menu-apartment-design__offer-step {
  font-size: max(1rem, 10px);
  font-weight: 700;
  text-align: center;
  color: var(--color-white);
  background-color: var(--color-sub);
}

.p-menu-apartment-design__offer-plus {
  flex-shrink: 0;
  font-size: max(1.5rem, 10px);
  font-weight: 700;
  text-align: center;
}

.p-menu-apartment-warranty__lead {
  font-weight: 700;
  text-align: center;
}

/* ============ アパマンFB反映（2026-08-18） ============ */
/* 施工事例（白）→入居率デザイン塗装（ベージュ）は間の地色を詰める */
@media screen and (min-width: 768px) {
  .p-menu-apartment-works {
    margin-block-end: 0;
  }
}

.p-menu-apartment-works + .p-menu-apartment-design {
  margin-block-start: 3.5rem;
}
@media screen and (min-width: 768px) {
  .p-menu-apartment-works + .p-menu-apartment-design {
    margin-block-start: 0;
    /* 直結のまま、ベージュの内側で上余白を確保 */
    padding-block-start: 4.375rem;
  }
}

.p-menu-apartment-plan__card-more {
  display: block;
  width: min(100% - 2rem, 15rem);
  margin-inline: auto;
  padding: 0.75rem;
  font-size: max(1rem, 10px);
  font-weight: 500;
  text-align: center;
  color: var(--color-white);
  background-color: var(--color-sub);
  border-radius: 1.875rem;
  transition: opacity 0.3s;
}

@media (any-hover: hover) {
  .p-menu-apartment-plan__card-more:hover {
    opacity: 0.7;
  }
}
.p-menu-apartment-small__sub-title {
  margin-block-start: 2.5rem;
  font-size: max(1.25rem, 10px);
  font-weight: 700;
  text-align: center;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-menu-apartment-small__sub-title {
    margin-block-start: 3.5rem;
    font-size: max(1.5rem, 10px);
  }
}

.p-menu-apartment-small__more-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  max-width: 50rem;
  margin-inline: auto;
  margin-block-start: 2.5rem;
}

.p-menu-apartment-small__more {
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-menu-apartment-small__more {
    font-size: max(1.4375rem, 10px);
  }
}

.p-menu-apartment-small__more-char {
  flex-shrink: 0;
  width: 5rem;
}
@media screen and (min-width: 768px) {
  .p-menu-apartment-small__more-char {
    width: 6.25rem;
  }
}

.p-menu-apartment-small__more-char img {
  width: 100%;
  height: auto;
}

.p-menu-apartment-strength__item-image img {
  display: block;
  margin-inline: auto;
}

.p-menu-apartment-design__cycle-image img {
  width: 100%;
  height: auto;
  aspect-ratio: 4/3;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.5rem;
}

.p-menu-apartment-design__cycle-label {
  margin-block-start: 0.5rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  text-align: center;
}

.p-menu-apartment-design__cycle-item[data-accent=true] .p-menu-apartment-design__cycle-label {
  color: var(--color-main);
}

.p-menu-apartment-design__point-item {
  display: flex;
  align-items: center;
  gap: 0.75rem;
  padding: 0.75rem 1rem;
  background-color: var(--color-white);
  border-radius: 0.5rem;
  box-shadow: 0 0.125rem 0.625rem rgba(0, 0, 0, 0.08);
}

.p-menu-apartment-design__point-badge {
  flex-shrink: 0;
  padding: 0.25rem 0.875rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  color: var(--color-white);
  background-color: var(--color-main);
  border-radius: 62.4375rem;
}

.p-menu-apartment-design__sim-row-em td {
  background-color: var(--color-bg-highlight);
}

.p-menu-apartment-design__note-box-image {
  margin-block: 1rem;
}

.p-menu-apartment-design__note-box-image img {
  display: block;
  width: 100%;
  max-width: 37.5rem;
  height: auto;
  margin-inline: auto;
  border-radius: 0.5rem;
}

.p-menu-apartment-design__offer-figure {
  flex: 1;
  min-width: 0;
  max-width: 17.5rem;
}

.p-menu-apartment-design__offer-image img {
  width: 100%;
  height: auto;
  aspect-ratio: 4/3;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.5rem;
}

/* 入居率デザイン塗装セクション：PCのみ全体的に+2px（表は除く） */
@media screen and (min-width: 768px) {
  .p-menu-apartment-design__image-caption {
    font-size: max(1.125rem, 10px);
  }
}

@media screen and (min-width: 768px) {
  .p-menu-apartment-design__sub-title {
    font-size: max(1.625rem, 10px);
  }
}

@media screen and (min-width: 768px) {
  .p-menu-apartment-design__cycle-title,
  .p-menu-apartment-design__cycle-label,
  .p-menu-apartment-design__cycle-note,
  .p-menu-apartment-design__point-note {
    font-size: max(1.125rem, 10px);
  }
}

@media screen and (min-width: 768px) {
  .p-menu-apartment-design__point-item,
  .p-menu-apartment-design__point-badge,
  .p-menu-apartment-design__table-note,
  .p-menu-apartment-design__check-item,
  .p-menu-apartment-design__offer-step {
    font-size: max(1.125rem, 10px);
  }
}

@media screen and (min-width: 768px) {
  .p-menu-apartment-design__note-box-title {
    font-size: max(1.25rem, 10px);
  }
}

@media screen and (min-width: 768px) {
  .p-menu-apartment-design__offer-lead {
    font-size: max(1.5625rem, 10px);
  }
}

@media screen and (min-width: 768px) {
  .p-menu-apartment-design__text,
  .p-menu-apartment-design__offer-text,
  .p-menu-apartment-design__offer-desc {
    font-size: max(1.25rem, 10px);
  }
}

/*
  商品メニュー（/menu 一覧＋共通後半ブロック）
  page-menu.php / parts/menu-quality.php / parts/menu-trust.php
*/
/* ============ カテゴリナビ ============ */
.p-menu-nav__list {
  display: grid;
  gap: 0.625rem;
  margin-block-start: 1.5rem;
}
@media screen and (min-width: 768px) {
  .p-menu-nav__list {
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
    margin-block-start: 2.5rem;
  }
}
@media screen and (min-width: 1024px) {
  .p-menu-nav__list {
    grid-template-columns: repeat(4, 1fr);
  }
}

.p-menu-nav__link {
  display: block;
  padding: 0.875rem 0.625rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  text-align: center;
  color: var(--color-white);
  background-color: var(--color-sub);
  border-radius: 0.5rem;
  transition: opacity 0.3s;
}
@media screen and (min-width: 768px) {
  .p-menu-nav__link {
    font-size: max(1.125rem, 10px);
    padding: 1.125rem 0.625rem;
  }
}

@media (any-hover: hover) {
  .p-menu-nav__link:hover {
    opacity: 0.7;
  }
}
/* ============ メニューのこだわり ============ */
.p-menu-policy__lead {
  margin-block-start: 1.5rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-menu-policy__lead {
    font-size: max(1.375rem, 10px);
  }
}

.p-menu-policy__lead-accent {
  color: var(--color-main);
}

.p-menu-policy__note {
  margin-block-start: 0.5rem;
  font-size: max(1rem, 10px);
  text-align: center;
}

.p-menu-policy__list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.75rem;
  max-width: 50rem;
  margin-inline: auto;
  margin-block-start: 1.5rem;
}
@media screen and (min-width: 768px) {
  .p-menu-policy__list {
    grid-template-columns: repeat(3, 1fr);
    gap: 1.25rem;
    margin-block-start: 2.5rem;
  }
}

.p-menu-policy__item-image img {
  width: 100%;
  height: auto;
  aspect-ratio: 3/2;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.5rem;
}

.p-menu-policy__item-label {
  margin-block-start: 0.375rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-menu-policy__item-label {
    font-size: max(1rem, 10px);
  }
}

/* ============ 品質ブロック（parts/menu-quality） ============ */
.p-menu-quality__block {
  max-width: 50rem;
  margin-inline: auto;
}

.p-menu-quality__block + .p-menu-quality__band,
.p-menu-quality__band + .p-menu-quality__block {
  margin-block-start: 2.5rem;
}
@media screen and (min-width: 768px) {
  .p-menu-quality__block + .p-menu-quality__band,
  .p-menu-quality__band + .p-menu-quality__block {
    margin-block-start: 3.5rem;
  }
}

.p-menu-quality__box {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
  margin-block-start: 1rem;
  padding: 1rem 1.25rem;
  background-color: var(--color-white);
  border-radius: 0.625rem;
  box-shadow: 0 0.125rem 0.625rem rgba(0, 0, 0, 0.08);
}

.p-menu-quality__text {
  text-align: center;
}

.p-menu-quality__char {
  flex-shrink: 0;
  width: 5rem;
}
@media screen and (min-width: 768px) {
  .p-menu-quality__char {
    width: 6.875rem;
  }
}

.p-menu-quality__char img {
  width: 100%;
  height: auto;
}

.p-menu-quality__band {
  font-size: max(1.4375rem, 10px);
  font-weight: 700;
  text-align: center;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-menu-quality__band {
    font-size: max(1.6875rem, 10px);
  }
}

.p-menu-quality__report-band {
  margin-block-start: 1rem;
  padding: 0.875rem 1rem;
  text-align: center;
  color: var(--color-white);
  background-color: var(--color-sub);
  border-radius: 0.375rem;
}

.p-menu-quality__report-band-title {
  font-size: max(1.125rem, 10px);
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .p-menu-quality__report-band-title {
    font-size: max(1.25rem, 10px);
  }
}

.p-menu-quality__report-band-text {
  margin-block-start: 0.25rem;
  font-size: max(1rem, 10px);
}

.p-menu-quality__photo-lead {
  margin-block-start: 1.5rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  text-align: center;
}

.p-menu-quality__text-wrap {
  display: grid;
  gap: 0.625rem;
  margin-block-start: 1rem;
}

.p-menu-quality__image {
  margin-block-start: 1.25rem;
  text-align: center;
}

.p-menu-quality__image img {
  display: block;
  width: 100%;
  max-width: 43.75rem;
  height: auto;
  margin-inline: auto;
  border-radius: 0.5rem;
}

/* ============ 信頼ブロック（parts/menu-trust） ============ */
.p-menu-quality__title,
.p-menu-trust__title {
  font-size: max(1.25rem, 10px);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-menu-quality__title,
  .p-menu-trust__title {
    font-size: max(1.625rem, 10px);
  }
}

.p-menu-trust__block {
  max-width: 50rem;
  margin-inline: auto;
}

.p-menu-trust__block + .p-menu-trust__block {
  margin-block-start: 3rem;
}
@media screen and (min-width: 768px) {
  .p-menu-trust__block + .p-menu-trust__block {
    margin-block-start: 4rem;
  }
}

.p-menu-trust__image {
  margin-block-start: 1.25rem;
  text-align: center;
}

.p-menu-trust__image img {
  display: block;
  width: 100%;
  max-width: 43.75rem;
  height: auto;
  margin-inline: auto;
  border-radius: 0.5rem;
}

/* 定期点検スケジュール図・保証書は縦長なので幅を絞る */
.p-menu-trust__image--maintenance img {
  max-width: 24.5rem;
}

.p-menu-trust__image--warranty img {
  max-width: 19.1875rem;
}

.p-menu-trust__figure-row {
  display: grid;
  gap: 1rem;
  margin-block-start: 1.5rem;
}
@media screen and (min-width: 768px) {
  .p-menu-trust__figure-row {
    grid-template-columns: repeat(2, 1fr);
    align-items: start;
    gap: 1.5rem;
  }
}

.p-menu-trust__image--photo {
  margin-block-start: 0;
}

.p-menu-trust__image--photo img {
  width: 100%;
  max-width: 31.25rem;
  aspect-ratio: 3/2;
  -o-object-fit: cover;
     object-fit: cover;
}

.p-menu-trust__caption {
  margin-block-start: 0.5rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  text-align: center;
}

.p-menu-trust__sub-band {
  max-width: 31.25rem;
  margin-inline: auto;
  margin-block-start: 2.5rem;
  padding: 0.625rem 1rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  text-align: center;
  color: var(--color-sub);
  background-color: var(--color-bg-cream);
  border-radius: 62.4375rem;
}
@media screen and (min-width: 768px) {
  .p-menu-trust__sub-band {
    font-size: max(1.25rem, 10px);
  }
}

.p-menu-trust__warranty-body {
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  margin-block-start: 1.5rem;
}
@media screen and (min-width: 768px) {
  .p-menu-trust__warranty-body {
    flex-direction: row;
    align-items: center;
    gap: 2rem;
  }
}

.p-menu-trust__warranty-body .p-menu-trust__image--warranty {
  margin-block-start: 0;
}
@media screen and (min-width: 768px) {
  .p-menu-trust__warranty-body .p-menu-trust__image--warranty {
    flex-shrink: 0;
    width: 19.1875rem;
  }
}

.p-menu-trust__warranty-content {
  flex-grow: 1;
}

.p-menu-trust__warranty-lead {
  font-size: max(1.25rem, 10px);
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-menu-trust__warranty-lead {
    font-size: max(1.375rem, 10px);
    text-align: start;
  }
}

.p-menu-trust__warranty-char {
  width: 5rem;
  margin-inline: auto;
  margin-block-start: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-menu-trust__warranty-char {
    width: 6.25rem;
    margin-inline: auto 0;
  }
}

.p-menu-trust__warranty-char img {
  width: 100%;
  height: auto;
}

.p-menu-trust__more {
  margin-block-start: 2rem;
  font-size: max(1.375rem, 10px);
  font-weight: 700;
  text-align: center;
}

.p-menu-trust__text-wrap {
  display: grid;
  gap: 0.625rem;
  margin-block-start: 1rem;
}

.p-menu-trust__button {
  margin-block-start: 1.5rem;
  text-align: center;
}

/* ============ 一覧ダイジェスト共通 ============ */
/* 背景色付きセクション同士は間を詰めて、地の色（3色目）が覗かないようにする */
@media screen and (min-width: 768px) {
  .p-menu-wall-digest {
    margin-block-end: 0;
  }
}

.p-menu-wall-digest + .p-menu-roof-digest {
  margin-block-start: 0;
}

.p-menu-wall-digest__lead,
.p-menu-roof-digest__lead {
  margin-block-start: 1.5rem;
  font-weight: 700;
  text-align: center;
}

.p-menu-wall-digest__note,
.p-menu-roof-digest__note {
  margin-block-start: 0.25rem;
  font-size: max(1rem, 10px);
  text-align: center;
}

.p-menu-wall-digest__list,
.p-menu-roof-digest__list {
  margin-block-start: 1.5rem;
}
@media screen and (min-width: 768px) {
  .p-menu-wall-digest__list,
  .p-menu-roof-digest__list {
    margin-block-start: 2.5rem;
  }
}

.p-menu-wall-digest__button,
.p-menu-roof-digest__button,
.p-menu-apartment-digest__button,
.p-menu-others-digest__button {
  margin-block-start: 2rem;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-menu-wall-digest__button,
  .p-menu-roof-digest__button,
  .p-menu-apartment-digest__button,
  .p-menu-others-digest__button {
    margin-block-start: 2.5rem;
  }
}

/* 屋根ダイジェスト：掲載価格＋カバー工法 */
.p-menu-roof-digest__more-button {
  margin-block-start: 2rem;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-menu-roof-digest__more-button {
    margin-block-start: 2.5rem;
  }
}

.p-menu-roof-digest__pack {
  max-width: 62.5rem;
  margin-inline: auto;
  margin-block-start: 2rem;
  overflow: hidden;
  border-radius: 0.625rem;
  box-shadow: 0 0.125rem 0.625rem rgba(0, 0, 0, 0.08);
}

.p-menu-roof-digest__pack-title {
  padding: 0.75rem;
  font-size: max(1.25rem, 10px);
  font-weight: 700;
  text-align: center;
  color: var(--color-white);
  background-color: var(--color-sub);
}

.p-menu-roof-digest__pack-list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 0.5rem;
  padding: 1rem;
  background-color: var(--color-white);
}

.p-menu-roof-digest__pack-item {
  padding: 0.5rem 1.25rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  background-color: var(--color-bg-cream);
  border-radius: 62.4375rem;
}

.p-menu-roof-digest__pack-note {
  padding: 0rem 1rem 1rem;
  font-size: max(1rem, 10px);
  background-color: var(--color-white);
  text-align: center;
}

.p-menu-roof-digest__cover {
  max-width: 50rem;
  margin-inline: auto;
  margin-block-start: 2.5rem;
  padding: 1.25rem;
  background-color: var(--color-white);
  border-radius: 0.625rem;
  box-shadow: 0 0.125rem 0.625rem rgba(0, 0, 0, 0.08);
}
@media screen and (min-width: 768px) {
  .p-menu-roof-digest__cover {
    padding: 2rem;
  }
}

.p-menu-roof-digest__cover-title {
  font-size: max(1.375rem, 10px);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-menu-roof-digest__cover-title {
    font-size: max(1.75rem, 10px);
  }
}

.p-menu-roof-digest__cover-text-wrap {
  margin-block-start: 0.625rem;
}

.p-menu-roof-digest__cover-text {
  text-align: center;
}

.p-menu-roof-digest__cover-body {
  display: flex;
  flex-direction: column;
  gap: 1rem;
  margin-block-start: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-menu-roof-digest__cover-body {
    flex-direction: row;
    align-items: flex-start;
    gap: 1.5rem;
  }
}

@media screen and (min-width: 768px) {
  .p-menu-roof-digest__cover-image {
    flex-shrink: 0;
    width: 50%;
  }
}

.p-menu-roof-digest__cover-image img {
  width: 100%;
  height: auto;
  aspect-ratio: 3/2;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.5rem;
}

.p-menu-roof-digest__cover-desc {
  font-size: max(1rem, 10px);
  font-weight: 700;
}

.p-menu-roof-digest__cover-spec {
  margin-block-start: 0.75rem;
  font-size: max(1.25rem, 10px);
  font-weight: 700;
}

.p-menu-roof-digest__cover-price {
  margin-block-start: 0.75rem;
}

.p-menu-roof-digest__cover-price-num {
  font-family: var(--second-font-family);
  font-size: max(3rem, 10px);
  font-weight: 700;
  line-height: 1;
  color: var(--color-accent-red);
}

.p-menu-roof-digest__cover-note {
  margin-block-start: 0.625rem;
  font-size: max(1rem, 10px);
}

/* アパマンダイジェスト */
.p-menu-apartment-digest__text-wrap {
  display: grid;
  gap: 0.625rem;
  max-width: 50rem;
  margin-inline: auto;
  margin-block-start: 1.5rem;
}

.p-menu-apartment-digest__list {
  display: grid;
  gap: 1rem;
  max-width: 50rem;
  margin-inline: auto;
  margin-block-start: 1.5rem;
}
@media screen and (min-width: 768px) {
  .p-menu-apartment-digest__list {
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5rem;
    margin-block-start: 2rem;
  }
}

.p-menu-apartment-digest__card {
  overflow: hidden;
  background-color: var(--color-white);
  border-radius: 0.625rem;
  box-shadow: 0 0.125rem 0.625rem rgba(0, 0, 0, 0.08);
  padding-block-end: 1rem;
}

.p-menu-apartment-digest__card-title {
  padding: 0.625rem 0.75rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  text-align: center;
  color: var(--color-white);
  background-color: var(--color-sub);
}

.p-menu-apartment-digest__card-pack {
  margin-block-start: 0.75rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  text-align: center;
}

.p-menu-apartment-digest__card-price {
  margin-block-start: 0.375rem;
  text-align: center;
}

.p-menu-apartment-digest__card-price-num {
  font-family: var(--second-font-family);
  font-size: max(2rem, 10px);
  font-weight: 700;
  line-height: 1;
  color: var(--color-accent-red);
}

.p-menu-apartment-digest__card-price-tax {
  display: block;
  font-size: max(1rem, 10px);
}

.p-menu-apartment-digest__card-note {
  margin-block-start: 0.25rem;
  font-size: max(1rem, 10px);
  text-align: center;
}

.p-menu-apartment-digest__margin-image {
  max-width: 43.75rem;
  margin-inline: auto;
  margin-block-start: 2rem;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-menu-apartment-digest__margin-image {
    margin-block-start: 3rem;
  }
}

.p-menu-apartment-digest__margin-image img {
  width: 100%;
  height: auto;
}

.p-menu-apartment-digest__repair-title {
  margin-block-start: 2.5rem;
  font-size: max(1.375rem, 10px);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-menu-apartment-digest__repair-title {
    margin-block-start: 3.5rem;
    font-size: max(1.75rem, 10px);
  }
}

.p-menu-apartment-digest__repair-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.75rem;
  max-width: 43.75rem;
  margin-inline: auto;
  margin-block-start: 1.5rem;
}
@media screen and (min-width: 768px) {
  .p-menu-apartment-digest__repair-list {
    gap: 2rem;
  }
}

.p-menu-apartment-digest__repair-image img {
  width: 100%;
  height: auto;
  aspect-ratio: 1/1;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 50%;
}

.p-menu-apartment-digest__repair-label {
  margin-block-start: 0.5rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  text-align: center;
}

/* ============ 雨漏り・小工事・オプション本体（parts/menu-others-content） ============ */
.p-menu-others {
  max-width: 50rem;
  margin-inline: auto;
}

.p-menu-others__repair-title,
.p-menu-others__small-title,
.p-menu-others__option-title {
  font-size: max(1.375rem, 10px);
  font-weight: 700;
  text-align: center;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-menu-others__repair-title,
  .p-menu-others__small-title,
  .p-menu-others__option-title {
    font-size: max(1.75rem, 10px);
  }
}

.p-menu-others__repair-title {
  margin-block-start: 1.5rem;
}

.p-menu-others__photo-list {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 0.5rem;
  margin-block-start: 1rem;
}
@media screen and (min-width: 768px) {
  .p-menu-others__photo-list {
    gap: 0.75rem;
  }
}

.p-menu-others__photo img {
  width: 100%;
  height: auto;
  aspect-ratio: 4/3;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.375rem;
}

.p-menu-others__repair-list {
  display: grid;
  gap: 0.625rem;
  margin-block-start: 1.25rem;
}

.p-menu-others__repair-item {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 0.25rem 0.75rem;
  padding: 0.875rem 1rem;
  background-color: var(--color-white);
  border-radius: 0.5rem;
  box-shadow: 0 0.125rem 0.625rem rgba(0, 0, 0, 0.08);
}

.p-menu-others__repair-name {
  font-size: max(1.25rem, 10px);
  font-weight: 700;
}

.p-menu-others__repair-unit {
  font-size: max(1.125rem, 10px);
  font-weight: 400;
}

.p-menu-others__repair-price {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 0.25rem;
}

.p-menu-others__repair-price-num,
.p-menu-others__repair-price-en,
.p-menu-others__repair-price-tag,
.p-menu-others__repair-price-tax {
  white-space: nowrap;
}

.p-menu-others__repair-price-num {
  font-family: var(--second-font-family);
  font-size: max(2.125rem, 10px);
  font-weight: 700;
  line-height: 1;
  color: var(--color-accent-red);
}

.p-menu-others__repair-price-en {
  font-size: max(1.25rem, 10px);
  font-weight: 700;
  color: var(--color-accent-red);
}

.p-menu-others__repair-price-tag {
  font-size: max(1.125rem, 10px);
}

.p-menu-others__repair-price-tax {
  font-size: max(1.125rem, 10px);
}

.p-menu-others__banner {
  margin-block-start: 2rem;
  text-align: center;
}

.p-menu-others__banner img {
  width: 100%;
  height: auto;
}

.p-menu-others__small-head {
  margin-block-start: 3rem;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-menu-others__small-head {
    margin-block-start: 4rem;
  }
}

.p-menu-others__small-lead {
  font-size: max(1rem, 10px);
  font-weight: 700;
}

.p-menu-others__small-list {
  display: grid;
  gap: 0.75rem;
  margin-block-start: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-menu-others__small-list {
    grid-template-columns: repeat(2, 1fr);
    gap: 1rem;
  }
}

.p-menu-others__small-item {
  overflow: hidden;
  background-color: var(--color-white);
  border-radius: 0.5rem;
  box-shadow: 0 0.125rem 0.625rem rgba(0, 0, 0, 0.08);
}

.p-menu-others__small-image img {
  width: 100%;
  height: auto;
  aspect-ratio: 5/2;
  -o-object-fit: cover;
     object-fit: cover;
}

.p-menu-others__small-body {
  padding: 0.75rem 1rem 1rem;
}

.p-menu-others__small-name {
  font-size: max(1.125rem, 10px);
  font-weight: 700;
}

.p-menu-others__small-time {
  display: block;
  font-size: max(1rem, 10px);
  font-weight: 400;
}

.p-menu-others__small-price {
  margin-block-start: 0.25rem;
  font-size: max(1rem, 10px);
}

.p-menu-others__small-price strong {
  font-family: var(--second-font-family);
  font-size: max(1.75rem, 10px);
  font-weight: 700;
  line-height: 1;
  color: var(--color-accent-red);
}

.p-menu-others__option-title {
  margin-block-start: 3rem;
}
@media screen and (min-width: 768px) {
  .p-menu-others__option-title {
    margin-block-start: 4rem;
  }
}

.p-menu-others__option-image {
  margin-block-start: 1.25rem;
  text-align: center;
}

.p-menu-others__option-image img {
  width: 100%;
  max-width: 37.5rem;
  height: auto;
  margin-inline: auto;
}

.p-menu-others__option-table {
  margin-block-start: 1.25rem;
}

.p-menu-others__option-table th {
  font-size: max(1.25rem, 10px);
}

.p-menu-others__option-table td {
  font-size: max(1.125rem, 10px);
}
@media screen and (min-width: 768px) {
  .p-menu-others__option-table td {
    font-size: max(1.25rem, 10px);
  }
}

.p-menu-others__option-table-note {
  font-size: max(1rem, 10px);
}

.p-menu-others__option-lead-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
  margin-block-start: 1.5rem;
}

.p-menu-others__option-lead {
  font-size: max(1.375rem, 10px);
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-menu-others__option-lead {
    font-size: max(1.5625rem, 10px);
  }
}

.p-menu-others__option-char {
  width: 4.375rem;
}
@media screen and (min-width: 768px) {
  .p-menu-others__option-char {
    width: 5.625rem;
  }
}

.p-menu-others__option-char img {
  width: 100%;
  height: auto;
}

/* 一覧の最終セクション：CTA（オレンジ）との間に地色の帯が出ないよう詰める */
.p-menu-others-digest {
  margin-block-end: 0;
}

.p-mv-slider {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0.625rem;
  z-index: 2;
}
@media screen and (min-width: 768px) {
  .p-mv-slider {
    position: static;
    background-color: #eea200;
    padding-block: 1.25rem 1.25rem;
  }
}

.p-mv-slider__inner {
  max-width: none;
  padding-inline: 0rem;
}
@media screen and (min-width: 768px) {
  .p-mv-slider__inner {
    max-width: 120rem;
    margin-inline: auto;
    padding-inline: 2.5rem;
  }
}

/* SPは splide が perPage:1 + padding15% で幅計算（width指定しない）。PCは autoWidth 無しの perPage */
@media screen and (min-width: 768px) {
  .p-mv-slider__item {
    width: auto;
  }
}

.p-mv-slider__link {
  display: block;
}

.p-mv-slider__img {
  display: block;
  width: 100%;
  /* 管理画面から差し替えても比率が変わらないよう現行バナー(1200×441)に固定 */
  aspect-ratio: 1200/441;
  height: auto;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.625rem;
}

/* Splideデフォルトの .splide:not(.is-overflow) .splide__pagination { display:none } を打ち消して常時表示 */
.p-mv-slider .splide:not(.is-overflow) .splide__pagination {
  display: flex;
}

.p-mv-slider .splide__pagination {
  position: static;
  margin-top: 0.75rem;
  padding: 0;
  gap: 0.5rem;
}
@media screen and (min-width: 768px) {
  .p-mv-slider .splide__pagination {
    margin-top: 1rem;
  }
}

.p-mv-slider .splide__pagination__page {
  width: 0.5rem;
  height: 0.5rem;
  margin: 0;
  background-color: var(--color-white);
  opacity: 1;
  transform: none;
  transition: background-color 0.3s;
}
@media screen and (min-width: 768px) {
  .p-mv-slider .splide__pagination__page {
    width: 0.875rem;
    height: 0.875rem;
  }
}
.p-mv-slider .splide__pagination__page.is-active {
  background-color: var(--color-main);
  transform: none;
}

.p-mv-slider .splide__arrows {
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
}

.p-mv {
  margin-top: var(--header-height);
  position: relative;
}

.p-mv__main {
  position: relative;
}
@media screen and (min-width: 768px) {
  .p-mv__main {
    position: relative;
  }
}

.p-mv__title {
  margin: 0;
  font-size: 0;
  line-height: 0;
}

.p-mv__img {
  display: block;
  width: 100%;
  height: auto;
}

.p-mv__img img {
  aspect-ratio: 780/1062;
  -o-object-fit: cover;
     object-fit: cover;
  height: auto;
  width: 100%;
}
@media screen and (min-width: 768px) {
  .p-mv__img img {
    aspect-ratio: 3396/1263;
  }
}

/* 下層ページ（バナースライダー無しのヒーロー）：SPだけ比率を変える。PCはそのまま */
.p-mv--sub .p-mv__img img {
  aspect-ratio: 780/800;
}
@media screen and (min-width: 768px) {
  .p-mv--sub .p-mv__img img {
    aspect-ratio: 3396/1263;
  }
}

/* エリア詳細ページのパンくずだけ背景色を付ける（PCのみ） */
@media screen and (min-width: 768px) {
  .p-mv--detail + .p-breadcrumb {
    background-color: #F9F1DE;
  }
}

.p-news-list {
  margin-top: 0.9375rem;
}
@media screen and (min-width: 768px) {
  .p-news-list {
    margin-top: 0.625rem;
  }
}

.p-news-list__item {
  border-block-end: 1px solid var(--color-border-line);
}

.p-news-list__item:first-child {
  border-block-start: 1px solid var(--color-border-line);
}

.p-news-list__item a {
  display: block;
  position: relative;
  padding-block: 0.8125rem;
  padding-inline-end: 1.875rem;
}
@media screen and (min-width: 768px) {
  .p-news-list__item a {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding-block: 1.25rem;
  }
}

.p-news-list__item a::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0.5rem;
  width: 0.4375rem;
  height: 0.4375rem;
  border-top: 1px solid var(--color-main);
  border-right: 1px solid var(--color-main);
  transform: translateY(-50%) rotate(45deg);
}

.p-news-list__meta {
  display: flex;
  align-items: center;
  gap: 1rem;
}
@media screen and (min-width: 768px) {
  .p-news-list__meta {
    flex-shrink: 0;
    min-width: 9.8125rem;
    gap: 0.3125rem;
  }
}

.p-news-list__date {
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  color: var(--color-sub);
  line-height: 1;
}

.p-news-list__cat-wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.5rem;
}

/* 見た目は c-label */
.p-news-list__title {
  margin-top: 0.5rem;
  font-size: max(1rem, 10px);
  font-weight: 500;
  color: var(--color-main);
  line-height: 1.4;
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
  overflow: hidden;
}
@media screen and (min-width: 768px) {
  .p-news-list__title {
    font-size: max(1.125rem, 10px);
  }
}

.p-news-list__pagenavi {
  margin-top: 3.125rem;
}

@media screen and (min-width: 768px) {
  .p-privacy__inner {
    max-width: 56.25rem;
  }
}

.p-privacy__lead {
  font-weight: 500;
  line-height: 1.8571428571;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-privacy__lead {
    line-height: 1.875;
  }
}

.p-privacy__list {
  margin-top: 1.75rem;
  display: grid;
  gap: 1.75rem;
}
@media screen and (min-width: 768px) {
  .p-privacy__list {
    margin-top: 2.5rem;
    gap: 2.5rem;
  }
}

.p-privacy__heading {
  padding-bottom: 0.5rem;
  border-bottom: 1px solid var(--color-border-line);
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-privacy__heading {
    padding-bottom: 0.625rem;
    font-size: max(1.25rem, 10px);
  }
}

.p-privacy__text {
  margin-top: 0.75rem;
  font-weight: 500;
  line-height: 1.8571428571;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-privacy__text {
    margin-top: 1rem;
    line-height: 1.875;
  }
}

.p-privacy__text a {
  color: var(--color-main);
  text-decoration: underline;
  font-weight: 700;
}

.p-privacy__ul {
  margin-top: 0.75rem;
  padding-left: 1.25rem;
  display: grid;
  gap: 0.375rem;
  list-style: disc;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-privacy__ul {
    margin-top: 1rem;
    font-size: max(1rem, 10px);
    line-height: 1.75;
  }
}

/* PC: 左カラム=タイトル(上)+テキスト(下)、右カラム=画像。
   SP: DOM順どおり タイトル→画像→テキスト の縦積み。 */
@media screen and (min-width: 768px) {
  .p-quote-compare-intro__top {
    display: grid;
    grid-template-columns: 1fr 25rem;
    grid-template-areas: "title image" "text  image";
    -moz-column-gap: 2.5rem;
         column-gap: 2.5rem;
    row-gap: 1.25rem;
    align-items: start;
  }
}

/* PCは左カラム上段。見出しも左寄せに */
@media screen and (min-width: 768px) {
  .p-quote-compare-intro__top > .c-section-title[data-position=center] {
    grid-area: title;
    text-align: left;
  }
}

.p-quote-compare-intro__top-image {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-quote-compare-intro__top-image {
    grid-area: image;
    align-self: center;
    margin-top: 0;
  }
}

.p-quote-compare-intro__top-image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
}

.p-quote-compare-intro__text-wrap {
  margin-top: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-quote-compare-intro__text-wrap {
    margin-top: 1.875rem;
    max-width: 56.25rem;
    margin-inline: auto;
  }
}

/* 2カラム内：左カラム下段。中央寄せ制約を解除 */
@media screen and (min-width: 768px) {
  .p-quote-compare-intro__top .p-quote-compare-intro__text-wrap {
    grid-area: text;
    max-width: none;
    margin-inline: 0;
    margin-top: 0;
  }
}

.p-quote-compare-intro__text {
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-quote-compare-intro__text {
    font-size: max(1rem, 10px);
    line-height: 1.875;
  }
}

.p-quote-compare-intro__catch {
  margin-top: 1.875rem;
  display: flex;
  align-items: flex-end;
  justify-content: center;
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-quote-compare-intro__catch {
    margin-top: 2.5rem;
    gap: 1.25rem;
  }
}

.p-quote-compare-intro__catch-text {
  font-size: max(1.25rem, 10px);
  font-weight: 700;
  line-height: 1.6;
  color: var(--color-sub);
  padding-bottom: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-quote-compare-intro__catch-text {
    font-size: max(1.875rem, 10px);
  }
}

.p-quote-compare-intro__catch-image {
  width: 5.625rem;
  flex-shrink: 0;
}
@media screen and (min-width: 768px) {
  .p-quote-compare-intro__catch-image {
    width: 9.375rem;
  }
}

.p-quote-compare-intro__catch-image img {
  display: block;
  width: 100%;
  height: auto;
}

@media screen and (min-width: 768px) {
  .p-quote-compare-intro__image {
    max-width: 56.25rem;
    margin-inline: auto;
  }
}

.p-quote-compare-intro__image img {
  display: block;
  width: 100%;
  height: auto;
}

.p-quote-compare-point__table .c-table tr > * {
  text-align: center;
}

@media screen and (min-width: 768px) {
  .p-quote-compare-point__inner {
    max-width: 56.25rem;
  }
}

/* アンカーナビ（first-secrets のリストを流用・quote-compare 用に上書き） */
.p-quote-compare-nav .p-first-secrets__link {
  background-color: var(--color-white);
}

/* SP/PC とも flex。SP=2列 / PC=3列（5項目=3+2）で下段が中央に来る */
.p-quote-compare-nav .p-first-secrets__list {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  align-items: stretch;
}

.p-quote-compare-nav .p-first-secrets__item {
  width: calc((100% - 0.75rem) / 2);
}
@media screen and (min-width: 768px) {
  .p-quote-compare-nav .p-first-secrets__item {
    width: calc((100% - 1.25rem * 2) / 3);
  }
}

/* 各Pointを全幅バンド化。data-bg="100" と地のクリームで交互（first-secret踏襲）。
   中身は __block-inner（l-inner）で中央寄せ。 */
.p-quote-compare-point__block {
  padding-block: 1.875rem;
}
@media screen and (min-width: 768px) {
  .p-quote-compare-point__block {
    padding-block: 3.125rem;
  }
}

/* first-secret の Secrets 帯に合わせた全幅オレンジ帯 */
.p-quote-compare-point__cat {
  margin-inline: -0.625rem;
  padding: 0.3125rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.5rem;
  background-color: var(--color-main);
  border-radius: 0.5rem;
  color: var(--color-white);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-quote-compare-point__cat {
    padding: 0.625rem;
    border-radius: 0.625rem;
  }
}

.p-quote-compare-point__label {
  color: var(--color-white);
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  font-family: var(--second-font-family);
}
@media screen and (min-width: 768px) {
  .p-quote-compare-point__label {
    font-size: max(1.375rem, 10px);
  }
}

.p-quote-compare-point__num {
  color: var(--color-white);
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  font-family: var(--second-font-family);
  line-height: 1.4;
}
@media screen and (min-width: 768px) {
  .p-quote-compare-point__num {
    font-size: max(1.375rem, 10px);
  }
}

/* first-secret のタイトルに合わせて中央寄せ */
.p-quote-compare-point__title {
  margin-top: 0.5rem;
  text-align: center;
  font-size: max(1.375rem, 10px);
  font-weight: 700;
  line-height: 1.1818181818;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-quote-compare-point__title {
    margin-top: 1.875rem;
    font-size: max(2rem, 10px);
  }
}

.p-quote-compare-point__title em {
  color: var(--color-main);
}

.p-quote-compare-point__text-wrap {
  margin-top: 0.9375rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-quote-compare-point__text-wrap {
    max-width: 56.25rem;
    margin-inline: auto;
  }
}

.p-quote-compare-point__text {
  margin-top: 0.9375rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-quote-compare-point__text {
    font-size: max(1rem, 10px);
    line-height: 1.875;
    max-width: 56.25rem;
    margin-inline: auto;
  }
}

.p-quote-compare-point__text-wrap .p-quote-compare-point__text {
  margin-top: 0;
}

.p-quote-compare-point__table {
  margin-top: 1rem;
}
@media screen and (min-width: 768px) {
  .p-quote-compare-point__table {
    margin-top: 1.5625rem;
    max-width: 56.25rem;
    margin-inline: auto;
  }
}

.p-quote-compare-point__table-head {
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  color: var(--color-sub);
  margin-bottom: 0.5rem;
}
@media screen and (min-width: 768px) {
  .p-quote-compare-point__table-head {
    font-size: max(1rem, 10px);
  }
}

.p-quote-compare-point__table .c-table {
  background-color: var(--color-white);
  font-size: max(0.8125rem, 10px);
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-quote-compare-point__table .c-table {
    font-size: max(0.9375rem, 10px);
  }
}

/* 順位列（「順位」「1位」等）が狭くて縦に段落ちするのを防ぐ＝1行固定。左右paddingも詰める */
.p-quote-compare-point__table .c-table-horizontal th:first-child,
.p-quote-compare-point__table .c-table-horizontal td:first-child {
  white-space: nowrap;
  padding-inline: 0.75rem;
  text-align: center;
}

/* 行間の罫線が左（順位列の下）まで届かずズレて見えるため、この表だけ全幅に */
.p-quote-compare-point__table .c-table-horizontal tbody tr:not(:last-child)::after {
  inset-inline: 0;
}

.p-quote-compare-point__table-note {
  margin-top: 0.375rem;
  font-size: max(0.6875rem, 10px);
  font-weight: 500;
  color: var(--color-sub);
  text-align: right;
}
@media screen and (min-width: 768px) {
  .p-quote-compare-point__table-note {
    font-size: max(0.75rem, 10px);
  }
}

.p-quote-compare-point__check {
  margin-top: 1.5rem;
  background-color: var(--color-white);
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  border-radius: 0.625rem;
  padding: 1.875rem 0.9375rem 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-quote-compare-point__check {
    margin-top: 1.5625rem;
    display: flex;
    align-items: center;
    gap: 1.5rem;
    padding: 1.25rem 1.875rem;
    max-width: 43.75rem;
    margin-inline: auto;
  }
}

/* SPは画像を左floatして負マージンで角から飛び出させる（重なり）＋テキスト回り込み。clearfix */
.p-quote-compare-point__check::after {
  content: "";
  display: block;
  clear: both;
}

/* SPは画像を左float＋負マージンで角に重ね、テキスト回り込み。PCは横並び（画像左） */
.p-quote-compare-point__check-head {
  float: left;
  width: 6.25rem;
  margin-top: -1.875rem;
  margin-left: -0.5rem;
  margin-right: 0.5rem;
}
@media screen and (min-width: 768px) {
  .p-quote-compare-point__check-head {
    float: none;
    flex-shrink: 0;
    width: 11.25rem;
    margin: 0;
  }
}

.p-quote-compare-point__check-head img {
  display: block;
  width: 100%;
  height: auto;
}

.p-quote-compare-point__check-text {
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.6923076923;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-quote-compare-point__check-text {
    font-size: max(0.9375rem, 10px);
    line-height: 1.7333333333;
  }
}

.p-quote-compare-point__judge-wrap {
  margin-top: 1rem;
  display: grid;
  gap: 0.9375rem;
}
@media screen and (min-width: 768px) {
  .p-quote-compare-point__judge-wrap {
    margin-top: 1.5625rem;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.25rem;
  }
}

.p-quote-compare-point__judge {
  background-color: var(--color-white);
  border-radius: 0.625rem;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  padding: 1rem;
}
@media screen and (min-width: 768px) {
  .p-quote-compare-point__judge {
    padding: 1.25rem 1.5625rem;
  }
}

.p-quote-compare-point__judge[data-type=ok] {
  border: 2px solid var(--color-accent-green);
}

.p-quote-compare-point__judge[data-type=ng] {
  border: 2px solid var(--color-main);
}

.p-quote-compare-point__judge-badge {
  display: inline-block;
  color: var(--color-white);
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  font-family: var(--second-font-family);
  line-height: 1;
  padding: 0.375rem 1rem;
  border-radius: 0.9375rem;
}

.p-quote-compare-point__judge[data-type=ok] .p-quote-compare-point__judge-badge {
  background-color: var(--color-accent-green);
}

.p-quote-compare-point__judge[data-type=ng] .p-quote-compare-point__judge-badge {
  background-color: var(--color-main);
}

.p-quote-compare-point__judge-title {
  margin-top: 0.625rem;
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-quote-compare-point__judge-title {
    font-size: max(1.25rem, 10px);
  }
}

.p-quote-compare-point__judge-text {
  margin-top: 0.5rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.6923076923;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-quote-compare-point__judge-text {
    font-size: max(0.875rem, 10px);
  }
}

.p-quote-compare-point__stat {
  margin-top: 1rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 1rem;
}
@media screen and (min-width: 768px) {
  .p-quote-compare-point__stat {
    margin-top: 1.5625rem;
    gap: 1.875rem;
  }
}

.p-quote-compare-point__stat-text {
  text-align: left;
}

.p-quote-compare-point__stat-image {
  width: 60%;
  max-width: 18.75rem;
}
@media screen and (min-width: 768px) {
  .p-quote-compare-point__stat-image {
    flex-shrink: 0;
    width: 25rem;
  }
}

.p-quote-compare-point__stat-image img {
  display: block;
  width: 100%;
  height: auto;
}

.p-quote-compare-point__stat-label {
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.6;
  color: var(--color-accent-red);
}
@media screen and (min-width: 768px) {
  .p-quote-compare-point__stat-label {
    font-size: max(1.25rem, 10px);
  }
}

.p-quote-compare-point__stat-num {
  margin-top: 0.25rem;
  font-size: max(1.875rem, 10px);
  font-family: var(--second-font-family);
  font-weight: 700;
  line-height: 1.2;
  color: var(--color-accent-red);
}
@media screen and (min-width: 768px) {
  .p-quote-compare-point__stat-num {
    font-size: max(2.5rem, 10px);
  }
}

.p-quote-compare-point__stat-num span {
  font-size: max(1rem, 10px);
  font-weight: 700;
  font-family: var(--base-font-family);
}

.p-quote-compare-point__compare {
  margin-top: 1.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-quote-compare-point__compare {
    margin-top: 1.875rem;
    gap: 1.875rem;
  }
}

.p-quote-compare-point__compare-item {
  text-align: center;
}

.p-quote-compare-point__compare-name {
  width: 7.5rem;
  height: 7.5rem;
  border-radius: 0.9375rem;
  overflow: hidden;
}
@media screen and (min-width: 768px) {
  .p-quote-compare-point__compare-name {
    width: 10rem;
    height: 10rem;
  }
}

.p-quote-compare-point__compare-name img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.p-quote-compare-point__compare-note {
  margin-top: 0.5rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-quote-compare-point__compare-note {
    font-size: max(0.9375rem, 10px);
  }
}

.p-quote-compare-point__compare-mark {
  font-size: max(1.875rem, 10px);
  font-weight: 700;
  color: var(--color-sub);
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .p-quote-compare-point__compare-mark {
    font-size: max(2.75rem, 10px);
  }
}

.p-quote-compare-summary__image {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-quote-compare-summary__image {
    margin-top: 1.875rem;
    max-width: 37.5rem;
    margin-inline: auto;
  }
}

.p-quote-compare-summary__image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 343/220;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.625rem;
}

.p-quote-compare-summary__text-wrap {
  margin-top: 0.9375rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-quote-compare-summary__text-wrap {
    margin-top: 1.5625rem;
    max-width: 43.75rem;
    margin-inline: auto;
  }
}

.p-quote-compare-summary__text {
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-quote-compare-summary__text {
    font-size: max(1rem, 10px);
    line-height: 1.875;
  }
}

.p-quote-compare-summary__banner {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-quote-compare-summary__banner {
    margin-top: 1.875rem;
    max-width: 43.75rem;
    margin-inline: auto;
  }
}

.p-quote-compare-summary__banner img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
}

.p-quote-compare-summary__button {
  text-align: center;
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-quote-compare-summary__button {
    margin-top: 1.875rem;
  }
}

.p-reason-nav__mv img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
}

.p-reason-nav__list {
  margin-top: 1.25rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.5rem 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-reason-nav__list {
    margin-top: 1.875rem;
    gap: 2.25rem 0.9375rem;
  }
}

.p-reason-nav__item {
  width: calc((100% - 0.625rem) / 2);
}
@media screen and (min-width: 768px) {
  .p-reason-nav__item {
    width: calc((100% - 2.8125rem) / 4);
  }
}

.p-reason-nav__item a {
  position: relative;
  z-index: 0;
  display: flex;
  flex-direction: column;
  align-items: center;
  height: 100%;
  padding: 0.75rem 0.625rem 1.125rem;
  background-color: var(--color-white);
  border-radius: 0.625rem;
  box-shadow: 0.375rem 0.375rem 0.5rem rgba(0, 0, 0, 0.1);
  text-align: center;
  transition: transform 0.3s, box-shadow 0.3s;
}
@media screen and (min-width: 768px) {
  .p-reason-nav__item a {
    padding: 0.875rem 0.75rem 1.375rem;
  }
}

/* アンカーの合図＝下向き矢印バッジ（オレンジ丸＋白シェブロン） */
.p-reason-nav__item a::after {
  content: "";
  position: absolute;
  bottom: -0.6875rem;
  left: 50%;
  transform: translateX(-50%);
  width: 1.75rem;
  height: 1.75rem;
  border-radius: 50%;
  background-color: var(--color-main);
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12 12' fill='none' stroke='%23ffffff' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'%3E%3Cpolyline points='2 4 6 8 10 4'/%3E%3C/svg%3E");
  background-repeat: no-repeat;
  background-position: center;
  background-size: 0.6875rem;
}
@media screen and (min-width: 768px) {
  .p-reason-nav__item a::after {
    bottom: -1rem;
    width: 2rem;
    height: 2rem;
    background-size: 0.8125rem;
  }
}

.p-reason-nav__item[data-size=full] {
  width: 100%;
}
@media screen and (min-width: 768px) {
  .p-reason-nav__item[data-size=full] {
    width: calc((100% - 2.8125rem) / 4);
  }
}

.p-reason-nav__num {
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  font-family: var(--second-font-family);
  line-height: 1.4;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-reason-nav__num {
    font-size: max(0.9375rem, 10px);
  }
}

.p-reason-nav__title {
  display: block;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-reason-nav__title {
    font-size: max(1.375rem, 10px);
  }
}

.p-reason-nav__desc {
  display: block;
  margin-top: 0.125rem;
  font-size: max(0.75rem, 10px);
  font-weight: 700;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-reason-nav__desc {
    font-size: max(0.875rem, 10px);
  }
}

@media (any-hover: hover) {
  .p-reason-nav__item a:hover {
    opacity: 1;
    transform: translateY(0.25rem);
  }
}
@media screen and (min-width: 768px) {
  .p-reason-detail__inner {
    max-width: 56.25rem;
  }
}

.p-reason-detail__block + .p-reason-detail__block {
  margin-top: 3.125rem;
}
@media screen and (min-width: 768px) {
  .p-reason-detail__block + .p-reason-detail__block {
    margin-top: 5rem;
  }
}

.p-reason-detail__block[data-bg=white] {
  background-color: var(--color-white);
  border-radius: 0.625rem;
  padding: 1.25rem 0.9375rem 1.875rem;
}
@media screen and (min-width: 768px) {
  .p-reason-detail__block[data-bg=white] {
    padding: 2.5rem 3.125rem 3.125rem;
  }
}

/* 「Reason 01 ｜ 専門性」のオレンジ帯（first-secret__band 準拠） */
.p-reason-detail__cat {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 0.625rem;
  padding: 0.3125rem;
  background-color: var(--color-main);
  border-radius: 0.5rem;
  color: var(--color-white);
}
@media screen and (min-width: 768px) {
  .p-reason-detail__cat {
    gap: 0.875rem;
    padding: 0.625rem;
    border-radius: 0.625rem;
  }
}

.p-reason-detail__num {
  font-family: var(--second-font-family);
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .p-reason-detail__num {
    font-size: max(1.5rem, 10px);
  }
}

.p-reason-detail__label {
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .p-reason-detail__label {
    font-size: max(1.5rem, 10px);
  }
}

.p-reason-detail__title {
  margin-top: 0.5rem;
  font-size: max(1.375rem, 10px);
  font-weight: 700;
  line-height: 1.1818181818;
  color: var(--color-sub);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-reason-detail__title {
    margin-top: 1.875rem;
    font-size: max(2rem, 10px);
  }
}

.p-reason-detail__image {
  margin-top: 0.875rem;
  width: 100%;
  height: auto;
}

.p-reason-detail__image img {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
  border-radius: 0.625rem;
}

/* 口コミ（3枚目）・ショールーム（4枚目）・保証書（5枚目）・明朗見積（7枚目）のドキュメント系画像は白地＋余白 */
#reason-3 .p-reason-detail__image,
#reason-4 .p-reason-detail__image,
#reason-5 .p-reason-detail__image,
#reason-7 .p-reason-detail__image {
  padding: 0.625rem;
  background-color: var(--color-white);
  border-radius: 0.625rem;
}
@media screen and (min-width: 768px) {
  #reason-3 .p-reason-detail__image,
  #reason-4 .p-reason-detail__image,
  #reason-5 .p-reason-detail__image,
  #reason-7 .p-reason-detail__image {
    padding: 1.875rem;
  }
}

.p-reason-detail__text {
  margin-top: 0.9375rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-reason-detail__text {
    font-size: max(1rem, 10px);
    line-height: 1.875;
  }
}

.p-reason-detail__points {
  margin-top: 1rem;
  background-color: var(--color-white);
  border: 1px solid var(--color-border-line);
  border-radius: 0.625rem;
  padding: 1rem;
}
@media screen and (min-width: 768px) {
  .p-reason-detail__points {
    padding: 1.5625rem 1.875rem;
  }
}

.p-reason-detail__points-head {
  font-size: max(1rem, 10px);
  font-weight: 700;
  color: var(--color-main);
  border-bottom: 1px solid var(--color-border-line);
  padding-bottom: 0.5rem;
}
@media screen and (min-width: 768px) {
  .p-reason-detail__points-head {
    font-size: max(1.25rem, 10px);
  }
}

.p-reason-detail__points-list li {
  list-style: none;
  position: relative;
  padding: 0.5rem 0 0.5rem 1.625rem;
  font-size: max(0.9375rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-sub);
  border-bottom: 1px dashed var(--color-border-line);
}
@media screen and (min-width: 768px) {
  .p-reason-detail__points-list li {
    font-size: max(1.0625rem, 10px);
    padding-block: 0.625rem;
  }
}

.p-reason-detail__points-list li:last-child {
  border-bottom: 0;
  padding-bottom: 0;
}

.p-reason-detail__points-list li::before {
  content: "✓";
  position: absolute;
  left: 0;
  top: 0.6875rem;
  width: 1.125rem;
  height: 1.125rem;
  background-color: var(--color-main);
  color: var(--color-white);
  border-radius: 50%;
  font-size: max(0.625rem, 10px);
  text-align: center;
  line-height: 1.125rem;
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .p-reason-detail__points-list li::before {
    top: 0.875rem;
  }
}

.p-reason-detail__button {
  text-align: center;
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-reason-detail__button {
    margin-top: 1.5625rem;
  }
}

/* design-intro に合わせた padding 式ヒーロー（固定比率をやめ内容ドリブンに） */
.p-showroom-intro__head {
  position: relative;
  overflow: hidden;
  text-align: center;
  padding-block: 3.125rem 2.5rem;
  padding-inline: 1.125rem;
}
@media screen and (min-width: 768px) {
  .p-showroom-intro__head {
    max-width: 50rem;
    margin-inline: auto;
    padding-block: 4.375rem 3.5rem;
    padding-inline: 1.875rem;
  }
}

.p-showroom-intro__head::after {
  content: "";
  position: absolute;
  inset: 0;
  background-color: rgba(0, 0, 0, 0.45);
  z-index: 1;
}

.p-showroom-intro__head-bg {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
  z-index: 0;
}

.p-showroom-intro__head-body {
  position: relative;
  z-index: 2;
}

.p-showroom-intro__head .c-section-title__ja {
  color: var(--color-white);
}

.p-showroom-intro__lead {
  margin-top: 1.25rem;
  text-align: center;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.6;
  color: var(--color-white);
}
@media screen and (min-width: 768px) {
  .p-showroom-intro__lead {
    margin-top: 1.625rem;
    font-size: max(1.25rem, 10px);
  }
}

.p-showroom-intro__head + .c-section-title {
  margin-top: 2.5rem;
}
@media screen and (min-width: 768px) {
  .p-showroom-intro__head + .c-section-title {
    margin-top: 3.4375rem;
  }
}

.p-showroom-intro__movie {
  margin: 1.5625rem auto 0;
  max-width: 43.75rem;
}
@media screen and (min-width: 768px) {
  .p-showroom-intro__movie {
    margin-top: 2.1875rem;
  }
}

/* 動画が用意できるまでは写真を入れる（2026-08-26 AUN#10）。iframe と同じ見え方に揃える */
.p-showroom-intro__movie iframe,
.p-showroom-intro__movie img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 350/197;
  border-radius: 0.625rem;
}

.p-showroom-intro__movie img {
  -o-object-fit: cover;
     object-fit: cover;
}

.p-showroom-intro__bonus {
  margin: 1.5625rem auto 0;
  max-width: 43.75rem;
}
@media screen and (min-width: 768px) {
  .p-showroom-intro__bonus {
    margin-top: 2.1875rem;
  }
}

.p-showroom-intro__bonus img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
}

.p-showroom-intro__button {
  text-align: center;
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-showroom-intro__button {
    margin-top: 1.5625rem;
  }
}

.p-showroom-merit {
  margin-bottom: 0;
}

.p-showroom-merit__list {
  margin-top: 1.125rem;
}
@media screen and (min-width: 768px) {
  .p-showroom-merit__list {
    margin-top: 3.125rem;
  }
}

.p-showroom-merit__thumb img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 343/200;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-showroom-merit__thumb img {
    aspect-ratio: 700/350;
  }
}

/* 順番: Merit帯 → タイトル → テキスト → 画像 */
.p-showroom-merit__thumb {
  margin-top: 0.875rem;
}
@media screen and (min-width: 768px) {
  .p-showroom-merit__thumb {
    margin-top: 1.25rem;
    max-width: 55rem;
    margin-inline: auto;
  }
}

.p-showroom-merit__item {
  padding-block: 1.125rem;
}
@media screen and (min-width: 768px) {
  .p-showroom-merit__item {
    padding-block: 1.5rem;
  }
}

/* p-first-secret__band に合わせた全幅オレンジ帯 */
.p-showroom-merit__num {
  padding: 0.3125rem;
  background-color: var(--color-main);
  border-radius: 0.5rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  font-family: var(--second-font-family);
  line-height: 1.4;
  color: var(--color-white);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-showroom-merit__num {
    padding: 0.625rem;
    font-size: max(1.375rem, 10px);
    border-radius: 0.625rem;
  }
}

/* p-first-secret__title に合わせて中央寄せ・下線なし */
.p-showroom-merit__title {
  margin-top: 0.5rem;
  font-size: max(1.375rem, 10px);
  font-weight: 700;
  line-height: 1.1818181818;
  color: var(--color-sub);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-showroom-merit__title {
    margin-top: 1.875rem;
    font-size: max(2rem, 10px);
    max-width: 55rem;
    margin-inline: auto;
  }
}

.p-showroom-merit__text {
  margin-top: 0.625rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.8;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-showroom-merit__text {
    font-size: max(0.9375rem, 10px);
    max-width: 55rem;
    margin-inline: auto;
  }
}

.p-showroom-merit__strong {
  font-weight: 700;
  color: var(--color-main);
}

.p-showroom-point__list {
  margin-top: 1.25rem;
  display: grid;
  grid-template-columns: 1fr;
  gap: 0.9375rem;
}
@media screen and (min-width: 768px) {
  .p-showroom-point__list {
    margin-top: 1.875rem;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.875rem;
  }
}

.p-showroom-point__item {
  position: relative;
}

.p-showroom-point__item::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 50%;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 100%);
  border-radius: 0.625rem;
  pointer-events: none;
}

.p-showroom-point__thumb {
  width: 100%;
  height: auto;
}

.p-showroom-point__thumb img {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: cover;
     object-fit: cover;
  aspect-ratio: 343/220;
  border-radius: 0.625rem;
}

.p-showroom-point__text {
  position: absolute;
  bottom: 0.875rem;
  left: 0;
  width: 100%;
  padding-inline: 1.0625rem;
  color: var(--color-white);
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  z-index: 1;
}
@media screen and (min-width: 768px) {
  .p-showroom-point__text {
    bottom: 1.25rem;
    padding-inline: 1.5625rem;
    font-size: max(0.9375rem, 10px);
  }
}

.p-showroom-point__button {
  text-align: center;
  margin-top: 1.5625rem;
}
@media screen and (min-width: 768px) {
  .p-showroom-point__button {
    margin-top: 2.1875rem;
  }
}

.p-showroom-shops__list {
  margin-top: 1.25rem;
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-showroom-shops__list {
    margin-top: 1.875rem;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.875rem;
  }
}

.p-showroom-shops__card {
  background-color: var(--color-white);
  border-radius: 0.625rem;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  overflow: hidden;
}

.p-showroom-shops__name {
  background-color: var(--color-main);
  color: var(--color-white);
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  padding: 0.75rem 0.875rem;
}
@media screen and (min-width: 768px) {
  .p-showroom-shops__name {
    font-size: max(1.375rem, 10px);
    padding: 0.875rem 1.25rem;
  }
}

.p-showroom-shops__image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 343/180;
  -o-object-fit: cover;
     object-fit: cover;
}

.p-showroom-shops__table {
  padding: 0.875rem;
}
@media screen and (min-width: 768px) {
  .p-showroom-shops__table {
    padding: 1rem 1.25rem;
  }
}

.p-showroom-shops__row {
  display: grid;
  grid-template-columns: 4rem 1fr;
  gap: 0.5rem;
  padding-block: 0.375rem;
  border-bottom: 1px dashed var(--color-border-line);
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-showroom-shops__row {
    font-size: max(1.125rem, 10px);
    grid-template-columns: 4.375rem 1fr;
    padding-block: 0.5rem;
  }
}

.p-showroom-shops__row:last-child {
  border-bottom: 0;
}

.p-showroom-shops__row dt {
  font-weight: 700;
  color: var(--color-main);
}

.p-showroom-shops__row a {
  color: var(--color-sub);
  text-decoration: underline;
}

.p-showroom-shops__map {
  aspect-ratio: 343/220;
  background-color: var(--color-border-line);
}
@media screen and (min-width: 768px) {
  .p-showroom-shops__map {
    aspect-ratio: 480/200;
  }
}

.p-showroom-shops__map iframe {
  display: block;
  width: 100%;
  height: 100%;
  border: 0;
}

/* 事前の来店予約がおすすめ（WEB予約メリット） */
@media screen and (min-width: 768px) {
  .p-showroom-web {
    margin-top: 9.375rem;
  }
}

.p-showroom-web__inner {
  position: relative;
}

.p-showroom-web__chara {
  display: none;
}
@media screen and (min-width: 768px) {
  .p-showroom-web__chara {
    display: block;
    position: absolute;
    top: -5rem;
    right: 5rem;
    z-index: 1;
    width: 13.75rem;
  }
}

.p-showroom-web__chara img {
  display: block;
  width: 100%;
  height: auto;
}

.p-showroom-web__card {
  border-radius: 0.625rem;
  overflow: hidden;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
}
@media screen and (min-width: 768px) {
  .p-showroom-web__card {
    margin-top: 3.125rem;
  }
}

.p-showroom-web__band {
  background-color: var(--color-main);
  color: var(--color-white);
  text-align: center;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  padding: 0.875rem 1rem;
}
@media screen and (min-width: 768px) {
  .p-showroom-web__band {
    font-size: max(1.625rem, 10px);
    padding: 1.25rem;
  }
}

.p-showroom-web__band strong {
  font-size: 1.15em;
}

.p-showroom-web__body {
  background-color: var(--color-white);
  padding: 1.25rem 1rem 1.5rem;
}
@media screen and (min-width: 768px) {
  .p-showroom-web__body {
    padding: 1.875rem 2.5rem 2.5rem;
  }
}

.p-showroom-web__label {
  width: -moz-fit-content;
  width: fit-content;
  background-color: var(--color-accent-green);
  color: var(--color-white);
  font-size: max(1.25rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  border-radius: 0.3125rem;
  padding: 0.375rem 0.875rem;
}
@media screen and (min-width: 768px) {
  .p-showroom-web__label {
    margin-inline: auto;
    font-size: max(1.5625rem, 10px);
    padding: 0.5rem 1.125rem;
  }
}

.p-showroom-web__list {
  margin-top: 1rem;
  display: grid;
  gap: 1.125rem;
}
@media screen and (min-width: 768px) {
  .p-showroom-web__list {
    margin-top: 1.5rem;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.875rem;
  }
}

.p-showroom-web__item {
  display: flex;
  align-items: flex-start;
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-showroom-web__item {
    gap: 0.875rem;
  }
}

.p-showroom-web__text-wrap {
  flex: 1;
}

.p-showroom-web__num {
  color: var(--color-accent-red);
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  font-family: var(--second-font-family);
  line-height: 1.2;
}
@media screen and (min-width: 768px) {
  .p-showroom-web__num {
    font-size: max(1.25rem, 10px);
  }
}

.p-showroom-web__text {
  margin-top: 0.25rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.7;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-showroom-web__text {
    font-size: max(0.875rem, 10px);
  }
}

.p-showroom-web__image {
  flex-shrink: 0;
  width: 6.25rem;
}
@media screen and (min-width: 768px) {
  .p-showroom-web__image {
    width: 6.875rem;
  }
}

.p-showroom-web__image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.3125rem;
}

/* 来店予約フォームへのアンカー（固定ヘッダー分オフセット） */
.p-showroom-form {
  scroll-margin-top: var(--header-height);
}

/* 来店予約フォーム */
.p-showroom-reserve__box {
  position: relative;
  padding: 2.5rem 1rem 1.5rem;
  background-color: var(--color-white);
  border: 0.25rem solid var(--color-main);
  border-radius: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-showroom-reserve__box {
    padding: 3.125rem 2.5rem 2.5rem;
  }
}

.p-showroom-reserve__heading {
  text-align: center;
  font-size: max(1.375rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-showroom-reserve__heading {
    font-size: max(2rem, 10px);
  }
}

.p-showroom-reserve__note {
  margin-top: 0.5rem;
  text-align: center;
  font-size: max(0.8125rem, 10px);
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-showroom-reserve__note {
    margin-top: 0.75rem;
    font-size: max(0.875rem, 10px);
  }
}

.p-showroom-reserve__tel {
  font-weight: 700;
  color: var(--color-main);
  white-space: nowrap;
}

.p-showroom-reserve .p-form {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-showroom-reserve .p-form {
    margin-top: 1.875rem;
  }
}

.p-showroom-reserve__datetime {
  display: flex;
  flex-wrap: wrap;
  gap: 0.625rem;
  width: 100%;
}

.p-showroom-reserve__datetime input,
.p-showroom-reserve__datetime select {
  flex: 1 1 13.75rem;
  min-width: 0;
  height: 3rem;
}

.p-showroom-reserve__datetime select {
  padding: 0 2.5rem 0 0.9375rem;
  font-size: max(1rem, 16px);
  line-height: 1;
  border-radius: 0.25rem;
  background-color: var(--color-bg-input);
  border: none;
  -webkit-appearance: none;
     -moz-appearance: none;
          appearance: none;
  cursor: pointer;
}

.p-showroom-reserve__datetime select:focus {
  box-shadow: none;
  outline: none;
}

/* ショールームフォーム内の select（来店希望ショールーム）も同じ高さに揃える。
   .p-form__select select は contact 共通のため、ここでは showroom スコープで上書き */
.p-showroom-reserve__box .p-form__select select {
  height: 3rem;
  padding-block: 0;
}

.p-showroom-reserve__privacy {
  margin-top: 1rem;
  text-align: center;
  font-size: max(0.8125rem, 10px);
}
@media screen and (min-width: 768px) {
  .p-showroom-reserve__privacy {
    font-size: max(0.875rem, 10px);
  }
}

.p-showroom-reserve__privacy a {
  color: var(--color-main);
  font-weight: 700;
  text-decoration: underline;
}

.p-simple-form__inner.l-inner {
  padding-inline: 0.625rem;
}
@media screen and (min-width: 1441px) {
  .p-simple-form__inner.l-inner {
    padding-inline: 1.5625rem;
  }
}

.p-simple-form__content {
  position: relative;
  margin-top: 1.875rem;
  padding: 2.1875rem 1rem 1.25rem;
  background-color: var(--color-white);
  border: 0.3125rem solid var(--color-main);
  border-radius: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-simple-form__content {
    padding-block: 2rem 2.375rem;
    padding-inline: 3.125rem 1.875rem;
    margin: 0;
    display: grid;
    gap: 0.625rem;
    grid-template-columns: 40% 1fr;
    align-items: center;
    position: static;
  }
}

.p-simple-form__heading {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translate(-50%, -50%);
  display: inline-flex;
  align-items: center;
  gap: 0.5rem;
  margin: 0;
  padding: 0 0.9375rem;
  color: var(--color-white);
  font-size: max(1.4375rem, 10px);
  font-weight: 700;
  font-feature-settings: "palt";
  white-space: nowrap;
  z-index: 1;
}
@media screen and (min-width: 768px) {
  .p-simple-form__heading {
    position: relative;
    left: 0;
    transform: none;
    top: 0;
    color: var(--color-main);
    font-size: max(3.125rem, 10px);
    font-weight: 900;
    line-height: 1;
    font-feature-settings: none;
    gap: 0 0.75rem;
    padding: 0;
    justify-content: flex-start;
    flex-wrap: wrap;
  }
}

@media screen and (min-width: 768px) {
  .p-simple-form__heading:after {
    content: "";
    position: absolute;
    top: 50%;
    right: 2.1875rem;
    transform: translateY(-50%);
    width: 8.375rem;
    height: 11.625rem;
    background-image: url(../images/common/character01.webp);
    background-repeat: no-repeat;
    background-position: center;
    background-size: contain;
  }
}

.p-simple-form__heading::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  width: 100%;
  height: 2.5rem;
  background-color: var(--color-main);
  border-radius: 0.3125rem;
  z-index: -1;
}
@media screen and (min-width: 768px) {
  .p-simple-form__heading::before {
    display: none;
  }
}

.p-simple-form__heading-num {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 3.6875rem;
  height: 3.6875rem;
  background-color: var(--color-white);
  outline: 5px solid var(--color-main);
  color: var(--color-main);
  border-radius: 50%;
  font-size: max(2.1875rem, 10px);
  font-family: var(--second-font-family);
  font-weight: 700;
  line-height: 1;
  padding-bottom: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-simple-form__heading-num {
    width: 5.3125rem;
    height: 5.3125rem;
    font-size: max(3.125rem, 10px);
    padding-bottom: 0.625rem;
  }
}

.p-simple-form__heading-unit {
  position: absolute;
  bottom: 0.3125rem;
  left: 50%;
  transform: translateX(-50%);
  font-size: max(0.75rem, 10px);
  font-weight: 700;
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .p-simple-form__heading-unit {
    font-size: max(1.0625rem, 10px);
  }
}

/* ===== intro（パワポ1枚目） ===== */
.p-simulation-intro__head {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-simulation-intro__head {
    margin-top: 1.875rem;
  }
}

@media screen and (min-width: 768px) {
  .p-simulation-intro__head-image {
    max-width: 43.75rem;
    margin-inline: auto;
  }
}

.p-simulation-intro__head-image img {
  display: block;
  width: 100%;
  height: auto;
}

.p-simulation-intro__lead-wrap {
  margin-top: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

.p-simulation-intro__lead {
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  text-align: center;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-simulation-intro__lead {
    font-size: max(1rem, 10px);
    line-height: 1.875;
  }
}

.p-simulation-intro__catch {
  margin-top: 1.875rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
  color: var(--color-accent-red);
}
@media screen and (min-width: 768px) {
  .p-simulation-intro__catch {
    margin-top: 2.5rem;
    font-size: max(1.25rem, 10px);
  }
}

.p-simulation-intro__button {
  margin-top: 0.25rem;
  text-align: center;
}

/* ===== recommend（こんな方にオススメ） ===== */
.p-simulation-recommend .c-section-title__ja {
  font-size: max(1.125rem, 10px);
}
@media screen and (min-width: 768px) {
  .p-simulation-recommend .c-section-title__ja {
    font-size: max(1.5rem, 10px);
  }
}

.p-simulation-recommend__body {
  margin-top: 1.25rem;
  padding: 1.5rem 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
  background-color: var(--color-white);
  border-radius: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-simulation-recommend__body {
    margin-top: 1.875rem;
    padding: 1.875rem 2.5rem;
    flex-direction: row;
    align-items: center;
    justify-content: center;
    gap: 2.5rem;
    max-width: 50rem;
    margin-inline: auto;
  }
}

.p-simulation-recommend__image {
  max-width: 8.75rem;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .p-simulation-recommend__image {
    max-width: 11.25rem;
    margin-inline: 0;
    flex-shrink: 0;
  }
}

.p-simulation-recommend__image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1/1;
  -o-object-fit: cover;
     object-fit: cover;
  -o-object-position: top;
     object-position: top;
  border-radius: 50%;
  background-color: var(--color-bg-cream);
}

.p-simulation-recommend__list {
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

.p-simulation-recommend__item {
  padding-left: 1.875rem;
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-sub);
  position: relative;
}
@media screen and (min-width: 768px) {
  .p-simulation-recommend__item {
    font-size: max(1rem, 10px);
  }
}

.p-simulation-recommend__item::before {
  content: "";
  position: absolute;
  left: 0;
  top: 50%;
  translate: 0 -50%;
  width: 1.25rem;
  height: 1.25rem;
  background-color: var(--color-main);
  border-radius: 50%;
}

.p-simulation-recommend__item::after {
  content: "";
  position: absolute;
  left: 0.375rem;
  top: 50%;
  translate: 0 -60%;
  width: 0.5rem;
  height: 0.3125rem;
  border-left: 2px solid var(--color-white);
  border-bottom: 2px solid var(--color-white);
  transform: rotate(-45deg);
}

/* ===== steps（シミュレーションの進め方） ===== */
.p-simulation-steps {
  background-color: var(--color-bg-cream);
}

.p-simulation-steps__list {
  margin-top: 1.875rem;
  display: grid;
  gap: 1.875rem;
}
@media screen and (min-width: 768px) {
  .p-simulation-steps__list {
    margin-top: 2.5rem;
    grid-template-columns: repeat(3, 1fr);
    gap: 2.5rem;
    max-width: 56.25rem;
    margin-inline: auto;
  }
}

.p-simulation-steps__step {
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
  color: var(--color-main);
  font-family: var(--second-font-family);
}
@media screen and (min-width: 768px) {
  .p-simulation-steps__step {
    font-size: max(1.125rem, 10px);
  }
}

.p-simulation-steps__image {
  margin-top: 0.75rem;
  max-width: 12.5rem;
  margin-inline: auto;
}

.p-simulation-steps__image img {
  display: block;
  width: 100%;
  height: auto;
  padding: 1rem;
  aspect-ratio: 1/1;
  -o-object-fit: contain;
     object-fit: contain;
  border-radius: 50%;
  background-color: var(--color-white);
}

.p-simulation-steps__title {
  margin-top: 0.75rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-simulation-steps__title {
    font-size: max(1.125rem, 10px);
  }
}

.p-simulation-steps__text {
  margin-top: 0.5rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.6923076923;
  text-align: center;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-simulation-steps__text {
    font-size: max(0.875rem, 10px);
  }
}

/* ===== reason（選ばれる理由） ===== */
.p-simulation-reason__list {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-simulation-reason__list {
    margin-top: 1.875rem;
  }
}

.p-simulation-reason__item-text {
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}

.p-simulation-reason__item-title {
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-simulation-reason__item-title {
    font-size: max(1.25rem, 10px);
  }
}

.p-simulation-reason__item-body {
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-simulation-reason__item-body {
    font-size: max(0.9375rem, 10px);
    line-height: 1.8666666667;
  }
}

.p-simulation-reason__item-image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4/3;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.5rem;
}

/* ===== form（パワポ2枚目） ===== */
/* フォーム導入ヘッダー（ワイヤー準拠・配色はサイトトーンに置換） */
.p-simulation-form__head {
  padding: 1.875rem 1.25rem 1.5rem;
  background-color: var(--color-main);
  border-radius: 0.625rem;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-simulation-form__head {
    padding: 2.5rem 2rem 2rem;
    max-width: 56.25rem;
    margin-inline: auto;
  }
}

.p-simulation-form__head-badge {
  display: inline-block;
  padding: 0.375rem 1rem;
  background-color: var(--color-white);
  border-radius: 6.25rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-simulation-form__head-badge {
    font-size: max(0.9375rem, 10px);
    padding: 0.5rem 1.5rem;
  }
}

.p-simulation-form__head-title {
  margin-top: 1rem;
  font-size: max(1.25rem, 10px);
  font-weight: 700;
  line-height: 1.6;
  color: var(--color-white);
}
@media screen and (min-width: 768px) {
  .p-simulation-form__head-title {
    font-size: max(1.75rem, 10px);
  }
}

.p-simulation-form__head-note {
  margin-top: 1rem;
  padding: 0.625rem 1rem;
  background-color: var(--color-bg-cream);
  border-radius: 0.375rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-simulation-form__head-note {
    margin-top: 1.25rem;
    font-size: max(0.9375rem, 10px);
    max-width: 40rem;
    margin-inline: auto;
  }
}

.p-simulation-form__head-catch-wrap {
  margin-top: 1rem;
  display: flex;
  justify-content: center;
  align-items: center;
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-simulation-form__head-catch-wrap {
    margin-top: 1.25rem;
    gap: 1rem;
  }
}

.p-simulation-form__head-character img {
  display: block;
  width: auto;
  height: 4.375rem;
}
@media screen and (min-width: 768px) {
  .p-simulation-form__head-character img {
    height: 5.625rem;
  }
}

.p-simulation-form__head-catch {
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-white);
}
@media screen and (min-width: 768px) {
  .p-simulation-form__head-catch {
    font-size: max(1.5rem, 10px);
  }
}

.p-simulation-form__head-start {
  font-size: max(1.375rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-white);
}
@media screen and (min-width: 768px) {
  .p-simulation-form__head-start {
    font-size: max(2rem, 10px);
  }
}

.p-simulation-form__body {
  margin-top: 1.875rem;
  display: flex;
  flex-direction: column;
  gap: 1.875rem;
}
@media screen and (min-width: 768px) {
  .p-simulation-form__body {
    margin-top: 2.5rem;
    max-width: 56.25rem;
    margin-inline: auto;
    gap: 2.5rem;
  }
}

/* CF7が先頭に出す管理用fieldset（中身はhiddenのみ）はflexの余白を食うので消す */
.p-simulation-form__body .hidden-fields-container {
  display: none;
}

/* CF7側（STEP4・5＋送信ボタン）も __body と同じ縦リズムで並べる */
.p-simulation-form__body .wpcf7-form {
  display: flex;
  flex-direction: column;
  gap: 1.875rem;
}
@media screen and (min-width: 768px) {
  .p-simulation-form__body .wpcf7-form {
    gap: 2.5rem;
  }
}

.p-simulation-form__group {
  margin: 0;
  padding: 0;
  border: none;
}

.p-simulation-form__legend {
  width: 100%;
  padding: 0 0 0.625rem;
  border-bottom: 2px solid var(--color-main);
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-simulation-form__legend {
    padding-bottom: 0.75rem;
    font-size: max(1.25rem, 10px);
  }
}

/* STEP直下の注釈帯（ワイヤー準拠） */
.p-simulation-form__group-note {
  margin-top: 1rem;
  padding: 0.75rem 1rem;
  background-color: var(--color-white);
  border-radius: 0.375rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-simulation-form__group-note {
    font-size: max(0.875rem, 10px);
    padding: 0.875rem 1.25rem;
  }
}

/* 設問ラベル＋選択肢の横並び行（SPは縦積み） */
.p-simulation-form__question {
  margin-top: 1rem;
}
@media screen and (min-width: 768px) {
  .p-simulation-form__question {
    margin-top: 1.25rem;
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: start;
    gap: 1.5rem;
  }
}

.p-simulation-form__question-label {
  margin-top: 1rem;
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-simulation-form__question-label {
    font-size: max(1rem, 10px);
  }
}

.p-simulation-form__question .p-simulation-form__question-label {
  margin-top: 0;
}

@media screen and (min-width: 768px) {
  .p-simulation-form__question .p-simulation-form__options {
    margin-top: 0;
  }
}

/* 2×2固定の選択肢（ワイヤー準拠・1個あたりの幅は控えめに） */
.p-simulation-form__options[data-cols="2"] {
  grid-template-columns: repeat(2, 1fr);
}
@media screen and (min-width: 768px) {
  .p-simulation-form__options[data-cols="2"] {
    grid-template-columns: repeat(2, minmax(0, 17.5rem));
    justify-content: end;
  }
}

.p-simulation-form__legend-num {
  margin-right: 0.5rem;
  color: var(--color-main);
  font-family: var(--second-font-family);
}

.p-simulation-form__options {
  margin-top: 0.75rem;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.5rem;
}
@media screen and (min-width: 768px) {
  .p-simulation-form__options {
    grid-template-columns: repeat(3, 1fr);
    gap: 0.75rem;
  }
}

.p-simulation-form__option {
  display: block;
  cursor: pointer;
}

.p-simulation-form__option input {
  position: absolute;
  width: 1px;
  height: 1px;
  margin: -1px;
  clip-path: inset(50%);
  overflow: hidden;
}

.p-simulation-form__option-label {
  height: 100%;
  padding: 0.75rem 0.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
  color: var(--color-sub);
  background-color: var(--color-white);
  border: 1px solid var(--color-border);
  border-radius: 0.5rem;
  transition: color 0.3s ease-in-out, background-color 0.3s ease-in-out, border-color 0.3s ease-in-out;
}
@media screen and (min-width: 768px) {
  .p-simulation-form__option-label {
    font-size: max(1rem, 10px);
  }
}

.p-simulation-form__option input:checked + .p-simulation-form__option-label {
  color: var(--color-white);
  background-color: var(--color-main);
  border-color: var(--color-main);
}

.p-simulation-form__option input:focus-visible + .p-simulation-form__option-label {
  outline: 2px solid var(--color-main);
  outline-offset: 2px;
}

@media (any-hover: hover) {
  .p-simulation-form__option:hover .p-simulation-form__option-label {
    border-color: var(--color-main);
  }
}
@media screen and (min-width: 768px) {
  .p-simulation-form__options[data-type=check] {
    grid-template-columns: repeat(3, 1fr);
  }
}

.p-simulation-form__option[data-type=image] .p-simulation-form__option-label {
  flex-direction: column;
  gap: 0.5rem;
  padding: 0.625rem 0.5rem;
}

.p-simulation-form__option[data-type=image] input:checked + .p-simulation-form__option-label {
  color: var(--color-main);
  background-color: var(--color-bg-cream);
  border-color: var(--color-main);
  outline: 2px solid var(--color-main);
  outline-offset: -2px;
}

.p-simulation-form__option-text {
  display: block;
  text-align: center;
}

.p-simulation-form__option-image {
  display: block;
  width: 100%;
}

.p-simulation-form__option-image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4/3;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.375rem;
}

.p-simulation-form__field {
  margin-top: 1rem;
}

.p-simulation-form__field-label {
  display: flex;
  align-items: center;
  gap: 0.5rem;
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-simulation-form__field-label {
    font-size: max(1rem, 10px);
  }
}

.p-simulation-form__required {
  padding: 0.125rem 0.5rem;
  font-size: max(0.75rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-white);
  background-color: var(--color-accent-red);
  border-radius: 0.25rem;
}

.p-simulation-form__input {
  margin-top: 0.5rem;
  width: 100%;
  padding: 0.75rem;
  font-size: max(1rem, 10px);
  font-weight: 500;
  line-height: 1.4;
  color: var(--color-black);
  background-color: var(--color-bg-input);
  border: none;
  border-radius: 0.25rem;
}

.p-simulation-form__field-note {
  margin-top: 0.25rem;
  font-size: max(0.75rem, 10px);
  font-weight: 500;
  line-height: 1.6666666667;
  color: var(--color-sub);
}

.p-simulation-form__note {
  margin-top: 1rem;
  font-size: max(0.75rem, 10px);
  font-weight: 500;
  line-height: 1.6666666667;
  color: var(--color-sub);
}

.p-simulation-form__button {
  text-align: center;
}

.p-simulation-form__button .c-button {
  cursor: pointer;
}

/* ===== result: 相場表示（パワポ3枚目） ===== */
/* 「相場をチェックする」で結果先頭（金額）へスクロールする際、固定ヘッダーに隠れないよう余白を確保 */
.p-simulation-result {
  scroll-margin-top: var(--header-height);
}

.p-simulation-result-price__inner {
  padding: 1.875rem 1.25rem;
  background-color: var(--color-white);
  box-shadow: 0 0.25rem 1.25rem rgba(0, 0, 0, 0.08);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-simulation-result-price__inner {
    padding: 2.5rem;
    max-width: 50rem;
    border-radius: 0.5rem;
  }
}

.p-simulation-result-price__title {
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-simulation-result-price__title {
    font-size: max(1.875rem, 10px);
  }
}

/* 金額行・ローン行（ラベル左＋大きな数字右）。参考スクショのレイアウトに準拠 */
.p-simulation-result-price__row {
  margin-top: 1.25rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 0.75rem;
  text-align: left;
}
@media screen and (min-width: 768px) {
  .p-simulation-result-price__row {
    gap: 1.5rem;
  }
}

/* display:flex が UA の [hidden]{display:none} に勝つため、hidden 時の非表示を明示 */
.p-simulation-result-price__row[hidden] {
  display: none;
}

/* 2行目（ローン）は上に区切り線 */
.p-simulation-result-price__row--loan {
  margin-top: 1.25rem;
  padding-top: 1.25rem;
  border-top: 1px solid var(--color-border-line);
}

.p-simulation-result-price__label {
  flex-shrink: 0;
  display: inline-flex;
  flex-direction: column;
  align-items: center;
  padding: 0.625rem 1.125rem;
  background-color: var(--color-main);
  border-radius: 0.375rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.3;
  color: var(--color-white);
}
@media screen and (min-width: 768px) {
  .p-simulation-result-price__label {
    font-size: max(1.25rem, 10px);
    padding: 0.875rem 1.75rem;
  }
}

.p-simulation-result-price__label-sub {
  font-size: max(0.8125rem, 10px);
}
@media screen and (min-width: 768px) {
  .p-simulation-result-price__label-sub {
    font-size: max(0.9375rem, 10px);
  }
}

.p-simulation-result-price__price,
.p-simulation-result-price__loan-price {
  display: flex;
  align-items: baseline;
  justify-content: flex-end;
  flex-wrap: wrap;
  gap: 0.375rem;
  font-weight: 700;
  line-height: 1.1;
  color: var(--color-sub);
}

.p-simulation-result-price__num {
  font-size: max(2.5rem, 10px);
  font-family: var(--second-font-family);
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-simulation-result-price__num {
    font-size: max(3.5rem, 10px);
  }
}

.p-simulation-result-price__unit {
  font-size: max(1rem, 10px);
}
@media screen and (min-width: 768px) {
  .p-simulation-result-price__unit {
    font-size: max(1.25rem, 10px);
  }
}

/* 工事内容「その他」／延べ床面積「わからない」選択時の表示（要お見積り） */
.p-simulation-result-price__quote {
  margin-top: 1rem;
  font-size: max(2rem, 10px);
  font-weight: 700;
  line-height: 1.2;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-simulation-result-price__quote {
    font-size: max(2.75rem, 10px);
  }
}

/* ===== result: 安くするには（パワポ3枚目） ===== */
/* タイトル横のキャラ装飾はSPだとはみ出すためPCのみ表示 */
.p-simulation-result-cheap .c-title-deco::before {
  display: none;
}
@media screen and (min-width: 768px) {
  .p-simulation-result-cheap .c-title-deco::before {
    display: block;
  }
}

/* この結果ブロックは PC で最大 800px に絞る */
@media screen and (min-width: 768px) {
  .p-simulation-result-cheap__inner {
    max-width: 50rem;
    margin-inline: auto;
  }
}

/* コメント（吹き出し／社長）ブロックの上に余白を確保 */
.p-simulation-result-cheap .c-comment,
.p-simulation-result-cheap .c-president-comment {
  margin-top: 1.875rem;
}
@media screen and (min-width: 768px) {
  .p-simulation-result-cheap .c-comment,
  .p-simulation-result-cheap .c-president-comment {
    margin-top: 2.5rem;
  }
}

.p-simulation-result-cheap__image {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-simulation-result-cheap__image {
    margin-top: 1.875rem;
    max-width: 31.25rem;
    margin-inline: auto;
  }
}

.p-simulation-result-cheap__image img {
  display: block;
  width: 100%;
  height: auto;
}

.p-simulation-result-cheap__balloon {
  margin-top: 1.25rem;
  display: flex;
  flex-direction: column;
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-simulation-result-cheap__balloon {
    max-width: 43.75rem;
    margin-inline: auto;
  }
}

.p-simulation-result-cheap__balloon-text {
  padding: 1rem 1.25rem;
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-sub);
  background-color: var(--color-bg-cream);
  border-radius: 1.875rem;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-simulation-result-cheap__balloon-text {
    font-size: max(1rem, 10px);
  }
}

.p-simulation-result-cheap__lead {
  margin-top: 1.25rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-simulation-result-cheap__lead {
    font-size: max(1.25rem, 10px);
  }
}

.p-simulation-result-cheap__point {
  margin-top: 1.875rem;
  padding: 1.25rem;
  background-color: var(--color-white);
  border: 1px solid var(--color-border-line);
  border-radius: 0.5rem;
}
@media screen and (min-width: 768px) {
  .p-simulation-result-cheap__point {
    margin-top: 2.5rem;
    padding: 1.875rem;
    max-width: 50rem;
    margin-inline: auto;
  }
}

.p-simulation-result-cheap__point-image {
  max-width: 18.75rem;
  margin-inline: auto;
}

.p-simulation-result-cheap__point-image img {
  display: block;
  width: 100%;
  height: auto;
}

.p-simulation-result-cheap__point-lead {
  margin-top: 0.75rem;
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
  color: var(--color-sub);
}

.p-simulation-result-cheap__point-title {
  margin-top: 0.75rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  text-align: center;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-simulation-result-cheap__point-title {
    font-size: max(1.25rem, 10px);
  }
}

.p-simulation-result-cheap__point-text {
  margin-top: 0.75rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  text-align: center;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-simulation-result-cheap__point-text {
    font-size: max(1rem, 10px);
  }
}

.p-simulation-result-cheap__point-ref {
  margin-left: 0.5rem;
  padding: 0.125rem 0.5rem;
  font-size: max(0.75rem, 10px);
  font-weight: 700;
  color: var(--color-white);
  background-color: var(--color-sub);
  border-radius: 0.25rem;
}

.p-simulation-result-cheap__conclusion {
  margin-top: 2.5rem;
  padding: 1.5rem 1.25rem;
  background-color: var(--color-main);
  border-radius: 0.5rem;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-simulation-result-cheap__conclusion {
    margin-top: 3.75rem;
    padding: 2rem;
    max-width: 50rem;
    margin-inline: auto;
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: center;
    -moz-column-gap: 1.5rem;
         column-gap: 1.5rem;
  }
}

/* CHECKキャラ（character05）＝SPは上に縦積み、PCは箱の左で横並び（2行ぶち抜き） */
.p-simulation-result-cheap__conclusion-character {
  width: 7.5rem;
  margin-inline: auto;
  margin-bottom: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-simulation-result-cheap__conclusion-character {
    grid-row: 1/3;
    width: 9.375rem;
    margin-inline: 0;
    margin-bottom: 0;
  }
}

.p-simulation-result-cheap__conclusion-character img {
  display: block;
  width: 100%;
  height: auto;
}

.p-simulation-result-cheap__conclusion-text {
  margin-top: 1rem;
  font-size: max(1.25rem, 10px);
  font-weight: 700;
  line-height: 1.6;
  color: var(--color-white);
}
@media screen and (min-width: 768px) {
  .p-simulation-result-cheap__conclusion-text {
    font-size: max(1.625rem, 10px);
  }
}

/* 実績バッジ（白ピル・数字だけ大きく） */
.p-simulation-result-cheap__conclusion-num {
  display: inline-block;
  padding: 0.375rem 1.25rem;
  background-color: var(--color-white);
  border-radius: 6.25rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-simulation-result-cheap__conclusion-num {
    font-size: max(1.25rem, 10px);
    padding: 0.5rem 1.75rem;
  }
}

.p-simulation-result-cheap__conclusion-strong {
  font-size: 1.5em;
  font-family: var(--second-font-family);
  line-height: 1;
}

/* ===== result: お客様の声（パワポ3枚目） ===== */
.p-simulation-result-voice {
  overflow-x: clip;
}

.p-simulation-result-voice__list {
  margin-top: 1.875rem;
  display: flex;
  flex-direction: column;
  gap: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-simulation-result-voice__list {
    margin-top: 2.5rem;
    max-width: 56.25rem;
    margin-inline: auto;
    gap: 1.875rem;
  }
}

.p-simulation-result-voice__item {
  padding: 1.25rem;
  background-color: var(--color-white);
  border: 1px solid var(--color-border-line);
  border-radius: 0.5rem;
}
@media screen and (min-width: 768px) {
  .p-simulation-result-voice__item {
    padding: 1.875rem;
  }
}

.p-simulation-result-voice__title {
  margin-top: 1rem;
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-simulation-result-voice__title {
    font-size: max(1.125rem, 10px);
  }
}

.p-simulation-result-voice__title:first-child {
  margin-top: 0;
}

.p-simulation-result-voice__text {
  margin-top: 0.5rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-simulation-result-voice__text {
    font-size: max(0.9375rem, 10px);
  }
}

/* =====================================================================
   結果ページ 下部ブロック（②費用内訳 / ④会社比較 / ⑤3STEP ほか）
   失敗例=c-comment / 劣化度=p-diagnosis-check / お問い合わせ=parts/cta /
   お客様の声=parts/voice-list を流用。ここは既存パーツで賄えない分の
   タイポ・色の骨のみ。レイアウト（グリッド幅・バー等）は TODO＝ユーザー仕上げ。
   ===================================================================== */
/* 失敗例（c-comment 流用）の見出し span と行間だけ */
.p-simulation-result-cheap__fail-list {
  margin-top: 1.25rem;
  display: grid;
  gap: 1rem;
}

/* 失敗例内の c-comment は gap で間隔管理するため、共通の上余白は打ち消す */
.p-simulation-result-cheap__fail-list .c-comment {
  margin-top: 0;
}

.p-simulation-result-cheap__fail-title {
  display: block;
  font-weight: 700;
  color: var(--color-main);
}

.p-simulation-result-cheap__fail-lead {
  margin-top: 1.875rem;
  text-align: center;
}

.p-simulation-result-cheap__fail-heading {
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  color: var(--color-sub);
}

.p-simulation-result-cheap__fail-catch {
  margin-top: 0.5rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-simulation-result-cheap__fail-catch {
    font-size: max(1.5rem, 10px);
  }
}

.p-simulation-result-cheap__lead {
  margin-top: 0.625rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-sub);
}

/* 劣化度：見出しだけ（本体は p-diagnosis-check を流用） */
.p-simulation-result-cheap__decline {
  margin-top: 1.875rem;
}

/* 黒帯見出し（参考スクショ準拠） */
.p-simulation-result-cheap__decline-title {
  padding: 0.75rem 0.5rem;
  background-color: var(--color-sub);
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-white);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-simulation-result-cheap__decline-title {
    font-size: max(1.25rem, 10px);
  }
}

/* 劣化度スケール＝横長支給画像 */
.p-simulation-result-cheap__decline-guide {
  margin-top: 1.25rem;
}

.p-simulation-result-cheap__decline-guide img {
  display: block;
  width: 100%;
  height: auto;
}

/* 劣化症状6項目カード（画像に赤帯ラベル＋★白帯を重ねるレイアウト） */
.p-simulation-result-cheap__decline-list {
  margin-top: 1.5rem;
  display: grid;
  grid-template-columns: 1fr;
  gap: 1.875rem;
}
@media screen and (min-width: 768px) {
  .p-simulation-result-cheap__decline-list {
    margin-top: 1.875rem;
    grid-template-columns: repeat(3, 1fr);
    gap: 2.5rem 1.875rem;
  }
}

.p-simulation-result-cheap__decline-item {
  display: flex;
  flex-direction: column;
}

.p-simulation-result-cheap__decline-image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4/3;
  -o-object-fit: cover;
     object-fit: cover;
}

/* 赤帯ラベル＋星白帯を画像下部に重ねる（ネガティブマージンで引き上げ） */
.p-simulation-result-cheap__decline-name {
  position: relative;
  z-index: 1;
  width: calc(100% - 3rem);
  margin: -4.875rem auto 0;
  padding: 0.5rem 0.25rem;
  background-color: var(--color-main);
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-white);
  text-align: center;
}

.p-simulation-result-cheap__decline-star {
  display: block;
  margin-top: 0.375rem;
  padding: 0.25rem;
  background-color: var(--color-white);
  font-size: max(1rem, 10px);
  line-height: 1.4;
  letter-spacing: 0.2em;
  text-indent: 0.2em;
  color: var(--color-main);
}

.p-simulation-result-cheap__decline-text {
  margin-top: 1.5rem;
}

/* ② 費用内訳（A社/B社）＝支給1枚画像。テキストは本文のまま */
.p-simulation-result-cheap__cost {
  margin-top: 1.875rem;
}
@media screen and (min-width: 768px) {
  .p-simulation-result-cheap__cost {
    margin-top: 5rem;
  }
}

.p-simulation-result-cheap__cost-image img {
  display: block;
  width: 100%;
  height: auto;
}

.p-simulation-result-cheap__cost-text {
  margin-top: 1rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.8461538462;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-simulation-result-cheap__cost-text {
    font-size: max(0.9375rem, 10px);
  }
}

.p-simulation-result-cheap__cost-conclusion {
  margin-top: 0.875rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-main);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-simulation-result-cheap__cost-conclusion {
    font-size: max(1.25rem, 10px);
  }
}

/* ④ 工事会社の比較＝支給1枚画像 */
.p-simulation-result-cheap__flow-image {
  margin-top: 1.25rem;
}

.p-simulation-result-cheap__flow-image img {
  display: block;
  width: 100%;
  height: auto;
}

/* ⑤ ご利用の3STEP */
.p-simulation-result-step__lead {
  margin-top: 1rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-sub);
  text-align: center;
}

.p-simulation-result-step__list {
  margin-top: 1.5rem;
  display: grid;
  gap: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-simulation-result-step__list {
    grid-template-columns: repeat(3, 1fr);
  }
}

.p-simulation-result-step__item {
  padding: 1.25rem 1rem;
  background-color: var(--color-white);
  border-radius: 0.625rem;
  box-shadow: 0 0 0.625rem 0 rgba(0, 0, 0, 0.1);
}

/* キャラ画像は縦横比がバラバラなので img 自体に高さ指定で揃える
   （grid + max-height:100% は暗黙行が不定サイズ扱いになり効かないため） */
.p-simulation-result-step__image {
  display: flex;
  justify-content: center;
}

.p-simulation-result-step__image img {
  width: auto;
  height: 7.5rem;
  -o-object-fit: contain;
     object-fit: contain;
}
@media screen and (min-width: 768px) {
  .p-simulation-result-step__image img {
    height: 10rem;
  }
}

.p-simulation-result-step__text {
  margin-top: 0.625rem;
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-sub);
  text-align: center;
}

.p-single__head {
  padding-bottom: 0.9375rem;
  border-bottom: 1px solid var(--color-border);
}
@media screen and (min-width: 768px) {
  .p-single__head {
    padding-inline: 1.25rem;
    padding-bottom: 1.875rem;
  }
}

.p-single__meta {
  display: flex;
  align-items: center;
  gap: 1.25rem;
}

.p-single__date {
  font-size: max(1rem, 10px);
  font-weight: 500;
  line-height: 1;
  letter-spacing: 0.05em;
}

.p-single__cat-wrap {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 0.625rem;
}

.p-single__cat {
  font-size: max(0.875rem, 10px);
  line-height: 1;
  color: var(--color-white);
  background-color: var(--color-main);
  padding: 0.625rem;
}

.p-single__title {
  margin-top: 1.375rem;
  font-size: max(1.375rem, 10px);
  font-weight: 700;
  color: var(--color-main);
}

.p-single__thumb {
  margin-top: 1.25rem;
  width: 100%;
  height: auto;
}

.p-single__thumb img {
  display: block;
  /* width:auto だと medium(300px) の実寸のまま小さく出るため幅いっぱいに */
  width: 100%;
  height: auto;
  border-radius: 0.3125rem;
}

.p-single__content {
  margin-top: 1.875rem;
  padding-inline: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-single__content {
    margin-top: 3.125rem;
    max-width: 50rem;
    margin-inline: auto;
    padding-inline: 0;
  }
}

.p-single__nav {
  margin-top: 3.125rem;
  padding-top: 1.875rem;
  border-top: 1px solid var(--color-border);
  text-align: center;
  position: relative;
}
@media screen and (min-width: 768px) {
  .p-single__nav {
    margin-top: 5rem;
  }
}

.p-single__nav-prev a,
.p-single__nav-next a,
.p-single__nav-center a {
  display: inline-block;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  letter-spacing: 0.05em;
  transition: color 0.3s ease-in-out;
  padding: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-single__nav-prev a,
  .p-single__nav-next a,
  .p-single__nav-center a {
    font-size: max(1rem, 10px);
  }
}

.p-single__nav-prev {
  position: absolute;
  left: 0;
  bottom: 0;
}

.p-single__nav-next {
  position: absolute;
  right: 0;
  bottom: 0;
}

@media (any-hover: hover) {
  .p-single__nav-prev a:hover,
  .p-single__nav-next a:hover,
  .p-single__nav-center a:hover {
    color: var(--color-main);
    opacity: 1;
  }
}
/* ブログ：タグ */
.p-single__tags {
  margin-top: 0.9375rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  list-style: none;
}

.p-single__tag {
  display: block;
  font-size: max(0.75rem, 10px);
  font-weight: 700;
  line-height: 1;
  color: var(--color-main);
  border: 1px solid var(--color-main);
  border-radius: 0.25rem;
  padding: 0.3125rem 0.75rem;
}

/* キャンペーン：期間 */
.p-single__period {
  margin-top: 0.9375rem;
  display: flex;
  align-items: center;
  gap: 0.625rem;
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-sub);
}

.p-single__period-label {
  flex-shrink: 0;
  background-color: var(--color-main);
  color: var(--color-white);
  font-size: max(0.75rem, 10px);
  line-height: 1;
  border-radius: 0.25rem;
  padding: 0.375rem 0.75rem;
}

.p-single__period + .p-single__period {
  margin-top: 0.375rem;
}

.p-staff-form__image {
  margin-block-end: -2rem;
}
@media screen and (min-width: 768px) {
  .p-staff-form__image {
    margin-block-end: -2.5rem;
    margin-inline: auto;
    max-width: 37.5rem;
  }
}

.p-staff-form__image img {
  display: block;
  width: 100%;
  height: auto;
}

@media screen and (min-width: 768px) {
  .p-staff-form__form {
    margin-top: 2.5rem;
  }
}

.p-staff__list {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 1.25rem 0.9375rem;
}
@media screen and (min-width: 768px) {
  .p-staff__list {
    /* 現状スタッフ6名。5列だと2段目が1名だけになって間延びするため3列（2段×3名）にする */
    grid-template-columns: repeat(3, 1fr);
    gap: 1.875rem 1.25rem;
  }
}

/* 役職の有無に関わらず、サムネ・役職・名前の行位置を全カードで揃える */
.p-staff__item {
  display: grid;
  grid-row: span 3;
  grid-template-rows: subgrid;
  gap: 0;
}

.p-staff__body {
  display: contents;
}

.p-staff__thumb img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 170/200;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.625rem;
}

.p-staff__role {
  margin-top: 0.625rem;
  text-align: center;
  font-size: max(0.75rem, 10px);
  font-weight: 500;
  line-height: 1.4;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-staff__role {
    /* 3列にして1カードが広くなったぶん、PCのみ +3px（2026-08-26） */
    font-size: max(1rem, 10px);
  }
}

.p-staff__name {
  margin-top: 0.125rem;
  text-align: center;
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-staff__name {
    /* 同上 +3px */
    font-size: max(1.1875rem, 10px);
  }
}

.p-staff__pagenavi {
  margin-top: 1.875rem;
}
@media screen and (min-width: 768px) {
  .p-staff__pagenavi {
    margin-top: 2.8125rem;
  }
}

.p-sub-banner__list {
  display: grid;
  gap: 0.9375rem;
  grid-template-columns: repeat(1, 1fr);
}
@media screen and (min-width: 768px) {
  .p-sub-banner__list {
    gap: 1.25rem;
    grid-template-columns: repeat(2, 1fr);
    max-width: 62.5rem;
    margin-inline: auto;
  }
}

.p-sub-banner__item {
  width: 100%;
  height: auto;
}

.p-sub-banner__item img {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
  box-shadow: 0 0.625rem 0.625rem rgba(0, 0, 0, 0.1);
  border-radius: 0.625rem;
}

.p-sub-mv {
  width: 100%;
  height: 8.125rem;
  background-image: url("../images/common/sub-mv.webp");
  background-size: cover;
  background-position: center;
  background-repeat: no-repeat;
}
@media screen and (min-width: 768px) {
  .p-sub-mv {
    height: 18.75rem;
    background-image: url("../images/common/sub-mv-pc.webp");
  }
}

.p-sub-mv__inner.l-inner {
  height: inherit;
}

.p-sub-mv__title-wrap {
  height: inherit;
  display: flex;
  align-items: flex-start;
  justify-content: center;
  flex-direction: column;
}

.p-sub-mv__title-ja {
  font-size: max(1.5rem, 10px);
  font-weight: 900;
  line-height: 1.25;
  letter-spacing: 0;
  color: var(--color-white);
}
@media screen and (min-width: 768px) {
  .p-sub-mv__title-ja {
    font-size: max(2.8125rem, 10px);
  }
}

.p-subsidy-cta {
  padding-block-start: 2.125rem;
}

@media screen and (min-width: 768px) {
  .p-subsidy-grant__inner {
    max-width: 56.25rem;
  }
}

.p-subsidy-grant__head {
  text-align: center;
}

.p-subsidy-grant__lead {
  margin-block-start: 0.5rem;
  color: var(--color-sub);
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
@media screen and (min-width: 768px) {
  .p-subsidy-grant__lead {
    font-size: max(2rem, 10px);
  }
}

.p-subsidy-grant__media {
  margin-top: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-subsidy-grant__media {
    margin-block-start: 2.5rem;
    display: grid;
    grid-template-columns: auto auto;
    align-items: center;
    -moz-column-gap: 2.5rem;
         column-gap: 2.5rem;
    row-gap: 2.5rem;
  }
}

@media screen and (min-width: 768px) {
  .p-subsidy-grant__media-image {
    grid-column: 2;
    grid-row: 1;
    width: 22.5rem;
  }
}

.p-subsidy-grant__media-image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
}

.p-subsidy-grant__list {
  margin-top: 1rem;
  padding: 0.875rem;
  background-color: var(--color-white);
  border-radius: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-subsidy-grant__list {
    grid-column: 1;
    grid-row: 1;
    margin-top: 0;
    margin-inline: auto;
    width: -moz-fit-content;
    width: fit-content;
    align-self: start;
  }
}

.p-subsidy-grant__text {
  margin-top: 0.625rem;
  font-weight: 500;
  line-height: 1.4285714286;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-subsidy-grant__text {
    grid-column: 1/-1;
    grid-row: 2;
    margin-top: 0;
    margin-inline: auto;
    width: -moz-fit-content;
    width: fit-content;
  }
}

.p-subsidy-grant__text em {
  color: var(--color-main);
  font-style: normal;
  font-weight: 700;
}

.p-subsidy-grant__image {
  margin-block-start: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-subsidy-grant__image {
    margin-block-start: 2.5rem;
    margin-inline: auto;
    width: 50%;
  }
}

.p-subsidy-grant__image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
}

.p-subsidy-grant__text2 {
  margin-block-start: 0.625rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
}
@media screen and (min-width: 768px) {
  .p-subsidy-grant__text2 {
    margin-block-start: 2.5rem;
    font-size: max(1.375rem, 10px);
    text-align: center;
    word-break: keep-all;
    overflow-wrap: anywhere;
  }
}

.p-subsidy-grant__text2 em {
  color: var(--color-main);
}

@media screen and (min-width: 768px) {
  .p-subsidy-insurance__inner {
    max-width: 56.25rem;
  }
}

@media screen and (min-width: 768px) {
  .p-subsidy-insurance__title {
    text-align: center;
  }
}

.p-subsidy-insurance__media-image {
  margin-top: 1rem;
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__media-image {
    margin-top: 1.5rem;
    margin-inline: auto;
    width: 50%;
  }
}

.p-subsidy-insurance__media-image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
}

.p-subsidy-insurance__lead {
  margin-top: 0.9375rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.4444444444;
  color: var(--color-sub);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__lead {
    margin-top: 1.25rem;
    font-size: max(1.375rem, 10px);
    line-height: 1.5;
  }
}

.p-subsidy-insurance__case-box {
  margin-top: 1rem;
  padding: 0.625rem 1rem;
  background-color: var(--color-white);
  border-radius: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__case-box {
    margin-top: 1.875rem;
    padding: 1.875rem;
  }
}

.p-subsidy-insurance__case-lead {
  color: var(--color-main);
  font-size: max(1rem, 10px);
  font-weight: 700;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__case-lead {
    font-size: max(1.5rem, 10px);
  }
}

.p-subsidy-insurance__compare {
  margin-top: 1rem;
  display: grid;
  gap: 0.5rem;
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__compare {
    margin-top: 1.5rem;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 1.6875rem;
  }
}

.p-subsidy-insurance__compare-heading {
  font-size: max(1.25rem, 10px);
  font-weight: 700;
  line-height: 1.6;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__compare-heading {
    font-size: max(1.5rem, 10px);
  }
}

.p-subsidy-insurance__compare-group[data-type=ok] .p-subsidy-insurance__compare-heading {
  color: var(--color-main);
}

.p-subsidy-insurance__compare-group[data-type=ng] .p-subsidy-insurance__compare-heading {
  color: #2b5080;
}

.p-subsidy-insurance__compare-item {
  margin-top: 0.125rem;
}

.p-subsidy-insurance__compare-label {
  display: flex;
  align-items: center;
  gap: 1.875rem;
  padding-block: 0.125rem;
  padding-inline: 0.9375rem;
  border-radius: 0.5rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.25;
  color: var(--color-white);
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__compare-label {
    padding: 0.9375rem;
    font-size: max(1.25rem, 10px);
    border-radius: 0.625rem;
  }
}

.p-subsidy-insurance__compare-group[data-type=ok] .p-subsidy-insurance__compare-label {
  background-color: var(--color-main);
}

.p-subsidy-insurance__compare-group[data-type=ng] .p-subsidy-insurance__compare-label {
  background-color: #2b5080;
}

.p-subsidy-insurance__compare-mark {
  position: relative;
  z-index: 0;
  flex-shrink: 0;
  width: 2.8125rem;
  aspect-ratio: 1;
}

.p-subsidy-insurance__compare-mark::before {
  position: absolute;
  z-index: -1;
  inset: 0;
  content: "";
  display: block;
  background-color: var(--color-white);
  border-radius: 50%;
  scale: 1.3;
}

.p-subsidy-insurance__compare-mark::after {
  position: absolute;
  z-index: -1;
  inset: 0;
  content: "";
  display: block;
}

.p-subsidy-insurance__compare-group[data-type=ok] .p-subsidy-insurance__compare-mark::after {
  border: 0.375rem solid var(--color-main);
  border-radius: 50%;
}

.p-subsidy-insurance__compare-group[data-type=ng] .p-subsidy-insurance__compare-mark::after {
  z-index: 1;
  border: none;
  border-radius: 0;
  background-color: transparent;
  content: "×";
  display: grid;
  place-items: center;
  font-size: max(2rem, 10px);
  font-weight: 700;
  line-height: 1;
  color: #2b5080;
  scale: 1.5;
  translate: 0 -0.1875rem;
}

.p-subsidy-insurance__compare-text {
  margin-top: 0.625rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.5384615385;
  color: var(--color-sub);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__compare-text {
    margin-top: 0.875rem;
    font-size: max(1rem, 10px);
    line-height: 1.7333333333;
  }
}

.p-subsidy-insurance__compare-image {
  margin-top: 0.3125rem;
  margin-inline: -0.1875rem;
}

.p-subsidy-insurance__compare-image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.5rem;
}

.p-subsidy-insurance__scaffold {
  margin-top: 0.5625rem;
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  gap: 0.5rem;
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__scaffold {
    margin-top: 2.5rem;
    max-width: 50rem;
    margin-inline: auto;
    align-items: center;
    gap: 1.25rem;
  }
}

.p-subsidy-insurance__scaffold-text {
  flex: 1;
  min-width: 0;
  font-size: max(1.25rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__scaffold-text {
    font-size: max(2.25rem, 10px);
    line-height: 1.6666666667;
    text-align: center;
  }
}

.p-subsidy-insurance__scaffold-text em {
  color: var(--color-main);
}

.p-subsidy-insurance__banner {
  margin-top: 1rem;
  position: relative;
  z-index: 0;
  aspect-ratio: 1440/516;
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__banner {
    margin-top: 8.125rem;
    margin-inline: auto;
    max-width: 31.25rem;
  }
}

.p-subsidy-insurance__banner::before {
  position: absolute;
  z-index: -1;
  top: -7.625rem;
  right: 0.375rem;
  display: block;
  width: 8.875rem;
  aspect-ratio: 270/374;
  background: url(../images/common/character01.webp) no-repeat center/contain;
  content: "";
}

.p-subsidy-insurance__banner-link {
  display: block;
}
@media (any-hover: hover) {
  .p-subsidy-insurance__banner-link figure {
    overflow: hidden;
  }
  .p-subsidy-insurance__banner-link img {
    transition: scale 0.3s ease-in-out;
  }
  .p-subsidy-insurance__banner-link:hover {
    opacity: 1;
  }
  .p-subsidy-insurance__banner-link:hover img {
    scale: 1.05;
  }
}
.p-subsidy-insurance__banner-link:focus-visible {
  opacity: 1;
}
.p-subsidy-insurance__banner-link:focus-visible img {
  scale: 1.05;
}

.p-subsidy-insurance__banner-thumb {
  position: absolute;
  z-index: -1;
  inset: 0;
  display: block;
  border-radius: 0.625rem;
  overflow: hidden;
}

.p-subsidy-insurance__banner-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.p-subsidy-insurance__banner-content {
  padding: 0.8125rem 2.25rem 0.6875rem 1rem;
  color: var(--color-white);
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__banner-content {
    padding: 1rem 3rem 1rem 1.25rem;
    gap: 0.25rem;
  }
}

.p-subsidy-insurance__banner-label {
  font-size: max(1.9375rem, 10px);
  font-weight: 700;
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__banner-label {
    font-size: max(2.875rem, 10px);
  }
}

.p-subsidy-insurance__banner-type {
  margin-block-start: 0.375rem;
  font-size: max(1.4375rem, 10px);
  font-weight: 700;
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__banner-type {
    margin-block-start: 1rem;
    font-size: max(1.75rem, 10px);
  }
}

.p-subsidy-insurance__banner-price {
  margin-top: 0.125rem;
  font-family: var(--second-font-family);
  font-size: max(2.6875rem, 10px);
  font-weight: 700;
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__banner-price {
    font-size: max(2.875rem, 10px);
  }
}

.p-subsidy-insurance__banner-price small {
  font-family: var(--base-font-family);
  font-size: max(1.4375rem, 10px);
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__banner-price small {
    font-size: max(1.625rem, 10px);
  }
}

.p-subsidy-insurance__banner-tax {
  margin-left: 0.125rem;
  font-size: max(0.625rem, 10px);
  font-weight: 700;
}

.p-subsidy-insurance__banner-icon {
  position: absolute;
  bottom: 0.8125rem;
  right: 0.625rem;
  width: 1.625rem;
  height: 1.625rem;
  background: url(../images/common/arrow-orange.svg) no-repeat center/contain;
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__banner-icon {
    width: 2.25rem;
    height: 2.25rem;
    right: 1rem;
  }
}

.p-subsidy-insurance__policy {
  margin-top: 0.375rem;
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__policy {
    margin-top: 1.875rem;
    text-align: center;
  }
}

.p-subsidy-insurance__text {
  font-weight: 500;
  line-height: 1.4285714286;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__text {
    font-size: max(1.25rem, 10px);
  }
}

.p-subsidy-insurance__text + .p-subsidy-insurance__text2 {
  margin-top: 1.25rem;
}

.p-subsidy-insurance__text2 {
  font-size: max(1.125rem, 10px);
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__text2 {
    font-size: max(1.5rem, 10px);
  }
}

.p-subsidy-insurance__text2 em {
  color: var(--color-main);
}

.p-subsidy-insurance__notes {
  margin-top: 1.25rem;
  padding: 1rem;
  background-color: var(--color-white);
  border-radius: 0.625rem;
  box-shadow: 0 0.125rem 0.5rem rgba(0, 0, 0, 0.08);
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__notes {
    margin-top: 2.5rem;
    margin-inline: auto;
    max-width: 37.5rem;
    padding: 1.875rem;
  }
}

.p-subsidy-insurance__notes-title {
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  line-height: 1.6;
  color: var(--color-sub);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__notes-title {
    font-size: max(1.25rem, 10px);
    line-height: 1.6;
  }
}

.p-subsidy-insurance__notes-list {
  margin-top: 0.75rem;
  display: grid;
  gap: 0.625rem;
  padding-left: 0;
  list-style: none;
}

.p-subsidy-insurance__note {
  position: relative;
  padding-left: 1rem;
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__note {
    line-height: 1.75;
  }
}

.p-subsidy-insurance__note::before {
  content: "";
  position: absolute;
  top: 0.5625rem;
  left: 0;
  width: 0.375rem;
  height: 0.375rem;
  border-radius: 50%;
  background-color: var(--color-main);
}

.p-subsidy-insurance__recommend {
  margin-top: 0.625rem;
  display: flex;
  align-items: flex-end;
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__recommend {
    margin-top: 2.5rem;
    max-width: 61.875rem;
    margin-inline: auto;
    display: grid;
    grid-template-columns: minmax(0, 1fr) 12.5rem;
    gap: 2.5rem;
    align-items: end;
  }
}

.p-subsidy-insurance__recommend-content {
  flex: 1;
  min-width: 0;
}

.p-subsidy-insurance__recommend-lead {
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__recommend-lead {
    line-height: 1.75;
  }
}

@media screen and (min-width: 768px) {
  .p-subsidy-insurance__recommend-brand {
    display: flex;
    align-items: center;
    gap: 1.5rem;
    margin-block-start: 1.875rem;
  }
}

.p-subsidy-insurance__recommend-catch {
  font-size: max(1.25rem, 10px);
  font-weight: 700;
  line-height: 1.2;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__recommend-catch {
    font-size: max(2.5rem, 10px);
  }
}

.p-subsidy-insurance__logo {
  margin-top: -2rem;
  width: 12.375rem;
  transform: none;
  margin-inline: 0;
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__logo {
    margin-top: 0;
    width: 15rem;
    max-width: none;
  }
}

.p-subsidy-insurance__logo img {
  display: block;
  width: 100%;
  height: auto;
}

.p-subsidy-insurance__recommend-entrust {
  margin-top: -0.125rem;
  font-size: max(1.25rem, 10px);
  font-weight: 700;
  line-height: 1.2;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__recommend-entrust {
    margin-top: 0;
    font-size: max(2rem, 10px);
    line-height: 1.25;
  }
}

.p-subsidy-insurance__recommend-image {
  flex-shrink: 0;
  width: 8.875rem;
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__recommend-image {
    width: 100%;
    flex-shrink: initial;
  }
}

.p-subsidy-insurance__recommend-image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
}

.p-subsidy-insurance__trust {
  margin-top: 1.5rem;
  font-weight: 500;
  line-height: 1.4285714286;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__trust {
    margin-top: 2.5rem;
  }
}

.p-subsidy-insurance__trust-media {
  margin-top: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__trust-media {
    margin-top: 1.5rem;
  }
}

.p-subsidy-insurance__trust-media img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
}

.p-subsidy-insurance__trust-image {
  margin-top: 1.5rem;
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__trust-image {
    margin-top: 2.5rem;
  }
}

@media screen and (min-width: 768px) {
  .p-subsidy-insurance__trust-image-title {
    text-align: center;
  }
}

.p-subsidy-insurance__trust-image-gallery {
  margin-top: 0.5625rem;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-subsidy-insurance__trust-image-gallery {
    margin-top: 1.5rem;
    gap: 1.25rem;
  }
}

.p-subsidy-insurance__trust-image-item img {
  display: block;
  width: 100%;
  /* 2枚並びのため、元画像の比率が違っても高さを揃える */
  aspect-ratio: 17/14;
  height: auto;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.625rem;
}

.p-subsidy-showroom__gallery {
  margin-top: 1rem;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-subsidy-showroom__gallery {
    gap: 1.25rem;
  }
}

.p-subsidy-showroom__gallery-item img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
}

.p-subsidy-staff__photo img {
  display: block;
  width: 100%;
  height: auto;
}

@media screen and (min-width: 768px) {
  .p-subsidy-voices__inner {
    max-width: 56.25rem;
  }
}

.p-subsidy-voices__consult {
  margin-inline: calc(50% - 50vw);
  margin-inline: calc(50% - 50cqi);
  padding-inline: calc(50vw - 50%);
  padding-inline: calc(50cqi - 50%);
  padding-block: 1px 1.75rem;
  background-color: var(--color-white);
  border-radius: 0.625rem;
}

.p-subsidy-voices__consult-lead {
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.3333333333;
  color: var(--color-sub);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-subsidy-voices__consult-lead {
    font-size: max(1.375rem, 10px);
  }
}

.p-subsidy-voices__consult-title {
  margin-top: 0.5rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.3333333333;
  color: var(--color-sub);
  text-align: center;
  word-break: keep-all;
  overflow-wrap: anywhere;
}
@media screen and (min-width: 768px) {
  .p-subsidy-voices__consult-title {
    margin-top: 0.75rem;
    font-size: max(1.25rem, 10px);
    line-height: 1.6;
  }
}

.p-subsidy-voices__bg {
  margin-inline: calc(50% - 50vw);
  margin-inline: calc(50% - 50cqi);
  padding-block: 1.25rem 1.875rem;
  padding-inline: calc(50vw - 50%);
  padding-inline: calc(50cqi - 50%);
}
@media screen and (min-width: 768px) {
  .p-subsidy-voices__bg {
    padding-block: 3.75rem 3.75rem;
  }
}

.p-subsidy-voices__quotes {
  display: grid;
  gap: 1rem;
}
@media screen and (min-width: 768px) {
  .p-subsidy-voices__quotes {
    gap: 1.5rem;
    margin-top: 0.625rem;
  }
}

.p-subsidy-voices__quote-item {
  display: flex;
  align-items: flex-end;
  gap: 0.875rem;
}
@media screen and (min-width: 768px) {
  .p-subsidy-voices__quote-item {
    gap: 1.5rem;
    align-items: center;
  }
}

@media screen and (min-width: 768px) {
  .p-subsidy-voices__quote-item:nth-child(2) {
    flex-direction: row-reverse;
  }
}

.p-subsidy-voices__quote-avatar {
  flex-shrink: 0;
  width: 3.4375rem;
  height: 3.4375rem;
  border-radius: 50%;
  overflow: hidden;
  background-color: var(--color-white);
}
@media screen and (min-width: 768px) {
  .p-subsidy-voices__quote-avatar {
    width: 5rem;
    height: 5rem;
  }
}

.p-subsidy-voices__quote-avatar img {
  display: block;
  width: 100%;
  height: 100%;
  -o-object-fit: cover;
     object-fit: cover;
}

.p-subsidy-voices__quote-text {
  position: relative;
  flex: 1;
  min-width: 0;
  padding: 0.875rem 1rem;
  background-color: var(--color-white);
  border-radius: 0.75rem;
  box-shadow: 0 0.125rem 0.375rem rgba(0, 0, 0, 0.08);
  font-weight: 500;
  line-height: 1.4285714286;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-subsidy-voices__quote-text {
    padding: 1.25rem 1.5rem;
  }
}

.p-subsidy-voices__quote-text::before {
  content: "";
  position: absolute;
  bottom: 1rem;
  left: -0.4375rem;
  border-style: solid;
  border-width: 0.375rem 0.5rem 0.375rem 0;
  border-color: transparent var(--color-white) transparent transparent;
}

@media screen and (min-width: 768px) {
  .p-subsidy-voices__quote-item:nth-child(2) .p-subsidy-voices__quote-text::before {
    left: auto;
    right: -0.4375rem;
    border-width: 0.375rem 0 0.375rem 0.5rem;
    border-color: transparent transparent transparent var(--color-white);
  }
}

.p-subsidy-voices__warning {
  margin-top: 1.25rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.625;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-subsidy-voices__warning {
    margin-top: 2.5rem;
    font-size: max(1.375rem, 10px);
    line-height: 1.5454545455;
    text-align: center;
  }
}

.p-subsidy-voices__lead {
  margin-top: 0.75rem;
  font-weight: 500;
  line-height: 1.4285714286;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-subsidy-voices__lead {
    margin-top: 1.25rem;
    text-align: center;
  }
}

.p-subsidy-voices__note {
  font-weight: 700;
  line-height: 1.4285714286;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-subsidy-voices__note {
    font-size: max(0.875rem, 10px);
    line-height: 1.7142857143;
    text-align: center;
  }
}

.p-subsidy-voices__button {
  margin-top: 1.5rem;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-subsidy-voices__button {
    margin-top: 1.875rem;
  }
}

.p-subsidy-voices__button .c-button {
  font-size: max(0.9375rem, 10px);
}

@media screen and (min-width: 768px) {
  .p-subsidy-works__inner {
    max-width: 65rem;
  }
}

@media screen and (min-width: 768px) {
  .p-subsidy-works__title {
    text-align: center;
  }
}

.p-subsidy-works__media-image {
  margin-top: 0.4375rem;
}
@media screen and (min-width: 768px) {
  .p-subsidy-works__media-image {
    margin-top: 1.5rem;
    max-width: 46.25rem;
    margin-inline: auto;
  }
}

.p-subsidy-works__media-image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
}

.p-subsidy-works__button {
  margin-top: 1rem;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-subsidy-works__button {
    margin-top: 1.5rem;
  }
}

.p-timing-meaning__image {
  width: 100%;
  height: auto;
}

.p-timing-meaning__image img {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
  border-radius: 0.5rem;
}

.p-timing-meaning__lead-wrap {
  margin-top: 1.125rem;
  display: grid;
  gap: 0.875rem;
}
@media screen and (min-width: 768px) {
  .p-timing-meaning__lead-wrap {
    margin-top: 1.5rem;
  }
}

.p-timing-meaning__lead {
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-timing-meaning__lead {
    font-size: max(1rem, 10px);
    line-height: 1.875;
  }
}

.p-timing-meaning__title {
  margin-top: 2.5rem;
}
@media screen and (min-width: 768px) {
  .p-timing-meaning__title {
    margin-top: 3.75rem;
  }
}

.p-timing-meaning__desc {
  margin-top: 0.875rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-timing-meaning__desc {
    margin-top: 1.125rem;
    font-size: max(1rem, 10px);
    line-height: 1.875;
  }
}

.p-timing-meaning__cards {
  margin-top: 1.25rem;
  display: grid;
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-timing-meaning__cards {
    margin-top: 1.875rem;
    grid-template-columns: repeat(2, 1fr);
    gap: 3.125rem;
  }
}

.p-timing-meaning__card {
  position: relative;
  background-color: var(--color-white);
  border-radius: 0.3125rem;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  padding: 0.875rem 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-timing-meaning__card {
    display: flex;
    align-items: center;
    padding: 1.25rem 1.5rem;
  }
}

/* SPは画像を右floatしてテキストを回り込ませる（社長挨拶=p-top-messageと同方式）ため clearfix */
.p-timing-meaning__card::after {
  content: "";
  display: block;
  clear: both;
}

@media screen and (min-width: 768px) {
  .p-timing-meaning__card-body {
    flex: 1;
  }
}

/* SPは画像を右float→テキスト回り込み（社長挨拶と同方式）、PCは横並び（画像右） */
.p-timing-meaning__card-image {
  float: right;
  width: 6.25rem;
}
@media screen and (min-width: 768px) {
  .p-timing-meaning__card-image {
    float: none;
    order: 2;
    flex-shrink: 0;
    width: 9.375rem;
    margin-left: 1.5rem;
    margin-bottom: 0;
  }
}

.p-timing-meaning__card-image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.5rem;
}

.p-timing-meaning__card-label {
  display: inline-block;
  color: var(--color-white);
  font-size: max(0.75rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  padding: 0.25rem 0.75rem;
  border-radius: 0.1875rem;
}
@media screen and (min-width: 768px) {
  .p-timing-meaning__card-label {
    font-size: max(0.875rem, 10px);
  }
}

.p-timing-meaning__card-label[data-type=good] {
  background-color: var(--color-main);
}

.p-timing-meaning__card-label[data-type=bad] {
  background-color: var(--color-border);
}

.p-timing-meaning__card-title {
  margin-top: 0.5rem;
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-timing-meaning__card-title {
    font-size: max(1.125rem, 10px);
  }
}

.p-timing-meaning__card-text {
  margin-top: 0.375rem;
  font-size: max(0.75rem, 10px);
  font-weight: 500;
  line-height: 1.55;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-timing-meaning__card-text {
    font-size: max(0.875rem, 10px);
  }
}

.p-timing-meaning__point {
  margin-top: 1.125rem;
}
@media screen and (min-width: 768px) {
  .p-timing-meaning__point {
    margin-top: 1.875rem;
    max-width: 47.5rem;
    margin-inline: auto;
  }
}

.p-timing-meaning__point-head {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  background-color: var(--color-main);
  color: var(--color-white);
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  padding: 0.625rem 0.875rem;
  border-radius: 0.3125rem 0.3125rem 0 0;
}
@media screen and (min-width: 768px) {
  .p-timing-meaning__point-head {
    font-size: max(1.5625rem, 10px);
    padding: 0.75rem 1.25rem;
    justify-content: center;
  }
}

.p-timing-meaning__point-badge {
  flex-shrink: 0;
  background-color: var(--color-white);
  color: var(--color-main);
  font-size: max(0.6875rem, 10px);
  padding: 0.125rem 0.5rem;
  border-radius: 0.125rem;
}
@media screen and (min-width: 768px) {
  .p-timing-meaning__point-badge {
    font-size: max(0.75rem, 10px);
  }
}

.p-timing-meaning__point-body {
  background-color: var(--color-white);
  border: 1px solid var(--color-border-line);
  border-top: 0;
  border-radius: 0 0 0.3125rem 0.3125rem;
  padding: 0.875rem;
}
@media screen and (min-width: 768px) {
  .p-timing-meaning__point-body {
    display: flex;
    align-items: center;
    padding: 1.25rem;
  }
}

/* SPは画像を右float→テキスト回り込み（社長挨拶と同方式）ため clearfix */
.p-timing-meaning__point-body::after {
  content: "";
  display: block;
  clear: both;
}

.p-timing-meaning__point-text {
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-timing-meaning__point-text {
    flex: 1;
    font-size: max(0.9375rem, 10px);
  }
}

/* SPは画像を右float→テキスト回り込み、PCは横並び（画像右） */
.p-timing-meaning__point-image {
  float: right;
  width: 4.5rem;
}
@media screen and (min-width: 768px) {
  .p-timing-meaning__point-image {
    float: none;
    order: 2;
    flex-shrink: 0;
    width: 12.5rem;
    margin-left: 1.25rem;
    margin-bottom: 0;
  }
}

.p-timing-meaning__point-image img {
  display: block;
  width: 100%;
  height: auto;
}

.p-timing-sign__lead {
  margin-top: 1.25rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-timing-sign__lead {
    margin-top: 1.875rem;
    font-size: max(1.25rem, 10px);
    line-height: 1.875;
  }
}

.p-timing-sign__list {
  margin-top: 1.125rem;
}
@media screen and (min-width: 768px) {
  .p-timing-sign__list {
    margin-top: 1.5625rem;
    --c-grid-cols: 1;
  }
}

.p-timing-sign__item {
  background-color: var(--color-white);
  border-radius: 0.3125rem;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  padding: 1rem;
  display: grid;
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-timing-sign__item {
    padding: 1.25rem 1.5rem;
    grid-template-columns: 1fr 12.5rem;
    align-items: center;
    gap: 1.5rem;
  }
}

.p-timing-sign__item-head {
  display: flex;
  align-items: center;
  gap: 0.625rem;
}

.p-timing-sign__item-check {
  flex-shrink: 0;
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-main);
  color: var(--color-white);
  border-radius: 50%;
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1;
}

.p-timing-sign__item-title {
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-timing-sign__item-title {
    font-size: max(1.0625rem, 10px);
  }
}

.p-timing-sign__item-text {
  margin-top: 0.5rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-timing-sign__item-text {
    font-size: max(0.875rem, 10px);
  }
}

.p-timing-sign__item-image {
  width: 100%;
  height: auto;
}

.p-timing-sign__item-image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4/3;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.3125rem;
}

.p-timing-sign__diagnosis {
  margin-top: 1.25rem;
  width: 100%;
  height: auto;
}
@media screen and (min-width: 768px) {
  .p-timing-sign__diagnosis {
    margin-top: 1.5625rem;
    max-width: 42.875rem;
    margin-inline: auto;
  }
}

.p-timing-sign__diagnosis img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 686/400;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.5rem;
}

.p-timing-sign__note-head {
  margin-top: 1.125rem;
  background-color: var(--color-main);
  color: var(--color-white);
  padding: 0.625rem 0.875rem;
  border-radius: 0.3125rem 0.3125rem 0 0;
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1.4;
}
@media screen and (min-width: 768px) {
  .p-timing-sign__note-head {
    max-width: 47.5rem;
    margin-inline: auto;
    margin-top: 1.5625rem;
    padding: 0.75rem 1.25rem;
    font-size: max(1.5625rem, 10px);
    text-align: center;
  }
}

.p-timing-sign__note-text {
  background-color: var(--color-white);
  border: 1px solid var(--color-border-line);
  border-top: 0;
  border-radius: 0 0 0.3125rem 0.3125rem;
  padding: 0.875rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-timing-sign__note-text {
    max-width: 47.5rem;
    margin-inline: auto;
    padding: 1.25rem;
    font-size: max(0.9375rem, 10px);
  }
}

.p-timing-sign__button {
  text-align: center;
  margin-top: 1.5625rem;
}
@media screen and (min-width: 768px) {
  .p-timing-sign__button {
    margin-top: 2.1875rem;
  }
}

.p-timing-early__lead {
  margin-top: 1rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-timing-early__lead {
    margin-top: 1.5rem;
    font-size: max(1rem, 10px);
    line-height: 1.875;
  }
}

.p-timing-early__list {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-timing-early__list {
    margin-top: 1.875rem;
    --c-grid-cols: 1;
  }
}

.p-timing-early__item {
  background-color: var(--color-white);
  border-radius: 0.3125rem;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  padding: 1rem;
  display: grid;
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-timing-early__item {
    padding: 1.25rem 1.5rem;
    grid-template-columns: 1fr 12.5rem;
    align-items: center;
    gap: 1.5rem;
  }
}

/* 画像なしのアイテムは1カラム（テキスト全幅） */
@media screen and (min-width: 768px) {
  .p-timing-early__item:not(:has(.p-timing-early__item-image)) {
    grid-template-columns: 1fr;
  }
}

.p-timing-early__item-head {
  display: flex;
  align-items: center;
  gap: 0.625rem;
}

.p-timing-early__item-check {
  flex-shrink: 0;
  width: 1.5rem;
  height: 1.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-border);
  color: var(--color-white);
  border-radius: 50%;
  font-size: max(0.75rem, 10px);
  font-weight: 700;
  line-height: 1;
}

.p-timing-early__item-title {
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-timing-early__item-title {
    font-size: max(1.0625rem, 10px);
  }
}

.p-timing-early__item-text {
  margin-top: 0.5rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-timing-early__item-text {
    font-size: max(0.875rem, 10px);
  }
}

.p-timing-early__item-image {
  width: 100%;
  height: auto;
}

.p-timing-early__item-image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4/3;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.3125rem;
}

.p-timing-early__sub-title {
  margin-top: 1.875rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-main);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-timing-early__sub-title {
    margin-top: 2.5rem;
    font-size: max(1.5rem, 10px);
  }
}

.p-timing-early__sub-lead {
  margin-top: 0.875rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-timing-early__sub-lead {
    margin-top: 1.125rem;
    font-size: max(1rem, 10px);
    line-height: 1.875;
  }
}

.p-timing-early__table {
  margin-top: 0.875rem;
  overflow-x: auto;
}
@media screen and (min-width: 768px) {
  .p-timing-early__table {
    margin-top: 1.25rem;
  }
}

.p-timing-early__table .c-table {
  background-color: var(--color-white);
  font-size: max(0.75rem, 10px);
  line-height: 1.5;
}
@media screen and (min-width: 768px) {
  .p-timing-early__table .c-table {
    font-size: max(0.9375rem, 10px);
  }
}

.p-timing-early__table .c-table td {
  text-align: center;
}

.p-timing-early__table-note {
  margin-top: 0.5rem;
  font-size: max(0.6875rem, 10px);
  font-weight: 500;
  line-height: 1.5;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-timing-early__table-note {
    font-size: max(0.75rem, 10px);
  }
}

.p-timing-early__image {
  margin-top: 1.125rem;
}
@media screen and (min-width: 768px) {
  .p-timing-early__image {
    margin-top: 1.5625rem;
  }
}

.p-timing-early__image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 343/180;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-timing-early__image img {
    aspect-ratio: 900/380;
  }
}

.p-timing-early__point {
  margin-top: 1.125rem;
}
@media screen and (min-width: 768px) {
  .p-timing-early__point {
    margin-top: 1.875rem;
    max-width: 47.5rem;
    margin-inline: auto;
  }
}

.p-timing-early__point-head {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  background-color: var(--color-main);
  color: var(--color-white);
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  padding: 0.625rem 0.875rem;
  border-radius: 0.3125rem 0.3125rem 0 0;
}
@media screen and (min-width: 768px) {
  .p-timing-early__point-head {
    justify-content: center;
    font-size: max(1.5625rem, 10px);
    padding: 0.75rem 1.25rem;
  }
}

.p-timing-early__point-badge {
  flex-shrink: 0;
  background-color: var(--color-white);
  color: var(--color-main);
  font-size: max(0.6875rem, 10px);
  padding: 0.125rem 0.5rem;
  border-radius: 0.125rem;
}
@media screen and (min-width: 768px) {
  .p-timing-early__point-badge {
    font-size: max(0.75rem, 10px);
  }
}

.p-timing-early__point-body {
  background-color: var(--color-white);
  border: 1px solid var(--color-border-line);
  border-top: 0;
  border-radius: 0 0 0.3125rem 0.3125rem;
  padding: 0.875rem;
}
@media screen and (min-width: 768px) {
  .p-timing-early__point-body {
    display: flex;
    align-items: center;
    gap: 1.25rem;
    padding: 1.25rem;
  }
}

/* SPは画像を右float→テキスト回り込み（社長挨拶と同方式）ため clearfix */
.p-timing-early__point-body::after {
  content: "";
  display: block;
  clear: both;
}

.p-timing-early__point-text {
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-timing-early__point-text {
    flex: 1;
    font-size: max(0.9375rem, 10px);
  }
}

/* SPは画像を右float→テキスト回り込み、PCは横並び（画像右） */
.p-timing-early__point-image {
  float: right;
  width: 4.5rem;
  margin-left: 0.625rem;
  margin-bottom: 0.375rem;
}
@media screen and (min-width: 768px) {
  .p-timing-early__point-image {
    float: none;
    order: 2;
    flex-shrink: 0;
    width: 12.5rem;
    margin-left: 0;
    margin-bottom: 0;
  }
}

.p-timing-early__point-image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1/1;
  -o-object-fit: contain;
     object-fit: contain;
}

.p-timing-season__lead {
  margin-top: 1.25rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-timing-season__lead {
    margin-top: 1.875rem;
    font-size: max(1rem, 10px);
    line-height: 1.875;
  }
}

.p-timing-season__sub-title {
  margin-top: 2.5rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-timing-season__sub-title {
    margin-top: 2.1875rem;
    font-size: max(1.25rem, 10px);
  }
}

.p-timing-season__list {
  position: relative;
  margin-top: 0.75rem;
  display: grid;
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-timing-season__list {
    margin-top: 1.125rem;
    gap: 0.9375rem;
  }
}

/* きりんが右上からひょっこり（上半分だけ見せて下は見切れ） */
.p-timing-season__deco {
  position: absolute;
  right: 0.25rem;
  top: -5rem;
  z-index: 1;
  width: 7.5rem;
  height: 5rem;
  overflow: hidden;
  pointer-events: none;
}
@media screen and (min-width: 768px) {
  .p-timing-season__deco {
    top: -9.375rem;
    right: 1rem;
    width: 15.625rem;
    height: 9.375rem;
  }
}

.p-timing-season__deco img {
  display: block;
  width: 100%;
  height: auto;
}

.p-timing-season__item {
  background-color: var(--color-white);
  border: 1px solid var(--color-border-line);
  border-radius: 0.3125rem;
  padding: 0.875rem;
  display: grid;
  grid-template-columns: 2.5rem 1fr;
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-timing-season__item {
    padding: 1.125rem 1.25rem;
  }
}

.p-timing-season__item-mark {
  width: 2.25rem;
  display: flex;
  justify-content: center;
  color: var(--color-main);
  font-size: max(2.5rem, 10px);
  font-weight: 700;
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .p-timing-season__item-mark {
    font-size: max(2rem, 10px);
  }
}

.p-timing-season__item[data-type=best] .p-timing-season__item-mark {
  color: var(--color-main);
}

.p-timing-season__item[data-type=sub] .p-timing-season__item-mark {
  color: var(--color-sub);
}

.p-timing-season__item-title {
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-timing-season__item-title {
    font-size: max(1.0625rem, 10px);
  }
}

.p-timing-season__item-text {
  margin-top: 0.25rem;
  font-size: max(0.75rem, 10px);
  font-weight: 500;
  line-height: 1.55;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-timing-season__item-text {
    font-size: max(0.875rem, 10px);
  }
}

/* 中身は共通パーツ c-president-comment。ここは上マージンだけ */
.p-timing-season__conclusion {
  margin-top: 1.25rem;
  max-width: 25rem;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .p-timing-season__conclusion {
    margin-top: 1.875rem;
    max-width: 37.5rem;
  }
}

.p-timing-season__point {
  position: relative;
  margin-top: 2.75rem;
}
@media screen and (min-width: 768px) {
  .p-timing-season__point {
    margin-top: 4rem;
    max-width: 47.5rem;
    margin-inline: auto;
  }
}

/* 「さらにお得なポイント」は point の右上に緑の丸バッジ配置 */
.p-timing-season__point .p-timing-season__sub-title {
  position: absolute;
  top: -2.75rem;
  right: -0.5rem;
  z-index: 1;
  margin-top: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 5.625rem;
  height: 5.625rem;
  background-color: var(--color-accent-green);
  color: var(--color-white);
  border-radius: 50%;
  font-size: max(0.9375rem, 10px);
  line-height: 1.3;
  text-align: center;
  box-shadow: 0 0.125rem 0.375rem rgba(0, 0, 0, 0.2);
}
@media screen and (min-width: 768px) {
  .p-timing-season__point .p-timing-season__sub-title {
    top: -4rem;
    right: -0.75rem;
    width: 7.25rem;
    height: 7.25rem;
    font-size: max(1.125rem, 10px);
  }
}

.p-timing-season__point-head {
  background-color: var(--color-main);
  color: var(--color-white);
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  padding: 0.625rem 0.875rem;
  border-radius: 0.3125rem 0.3125rem 0 0;
}
@media screen and (min-width: 768px) {
  .p-timing-season__point-head {
    font-size: max(1.5625rem, 10px);
    padding: 0.75rem 1.25rem;
    text-align: center;
  }
}

.p-timing-season__point-body {
  background-color: var(--color-white);
  border: 1px solid var(--color-border-line);
  border-top: 0;
  border-radius: 0 0 0.3125rem 0.3125rem;
  padding: 0.875rem;
}
@media screen and (min-width: 768px) {
  .p-timing-season__point-body {
    padding: 1.25rem;
  }
}

.p-timing-season__point-text-wrap {
  display: grid;
  gap: 0.625rem;
}

.p-timing-season__point-text {
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-timing-season__point-text {
    font-size: max(0.9375rem, 10px);
  }
}

@media screen and (min-width: 768px) {
  .p-timing-consult__inner {
    max-width: 56.25rem;
  }
}

.p-timing-consult__lead {
  margin-top: 1.25rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7142857143;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-timing-consult__lead {
    margin-top: 1.875rem;
    font-size: max(1rem, 10px);
    line-height: 1.875;
  }
}

.p-timing-consult__danger-list {
  margin-top: 1rem;
}
@media screen and (min-width: 768px) {
  .p-timing-consult__danger-list {
    margin-top: 1.25rem;
  }
}

.p-timing-consult__danger {
  background-color: var(--color-white);
  border-radius: 0.3125rem;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  padding: 1rem;
}
@media screen and (min-width: 768px) {
  .p-timing-consult__danger {
    padding: 1.25rem 1.5rem;
  }
}

.p-timing-consult__danger-head {
  display: flex;
  align-items: flex-start;
  gap: 0.625rem;
}

.p-timing-consult__danger-title {
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-timing-consult__danger-title {
    font-size: max(1.375rem, 10px);
  }
}

.p-timing-consult__danger-num {
  color: var(--color-accent-red);
}

.p-timing-consult__danger-text {
  margin-top: 0.5rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-timing-consult__danger-text {
    font-size: max(0.875rem, 10px);
  }
}

.p-timing-consult__sub-title {
  margin-top: 1.875rem;
  font-size: max(1.375rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-main);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-timing-consult__sub-title {
    margin-top: 3.125rem;
    font-size: max(2.1875rem, 10px);
  }
}

/* このタイトルだけキリン（c-title-deco face）を少し右へ寄せる（gapを詰める）。
   visiting の face には影響させないため timing 側でスコープ上書き */
.p-timing-consult__sub-title.c-title-deco[data-char=face]::before {
  right: calc(100% + 0.375rem);
}
@media screen and (min-width: 768px) {
  .p-timing-consult__sub-title.c-title-deco[data-char=face]::before {
    right: calc(100% + 2.25rem);
  }
}

.p-timing-consult__steps {
  margin-top: 1.125rem;
  display: grid;
  gap: 1rem;
}
@media screen and (min-width: 768px) {
  .p-timing-consult__steps {
    margin-top: 2.5rem;
    gap: 1.25rem;
  }
}

.p-timing-consult__step {
  display: grid;
  grid-template-columns: 2.25rem 1fr;
  gap: 0.75rem;
  align-items: start;
}
@media screen and (min-width: 768px) {
  .p-timing-consult__step {
    grid-template-columns: 2.75rem 1fr;
    gap: 1rem;
  }
}

.p-timing-consult__step-num {
  width: 2.25rem;
  height: 2.25rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-main);
  color: var(--color-white);
  border-radius: 50%;
  font-size: max(1rem, 10px);
  font-weight: 700;
  font-family: var(--second-font-family);
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .p-timing-consult__step-num {
    width: 2.75rem;
    height: 2.75rem;
    font-size: max(1.25rem, 10px);
  }
}

.p-timing-consult__step-title {
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-sub);
  padding-top: 0.375rem;
}
@media screen and (min-width: 768px) {
  .p-timing-consult__step-title {
    font-size: max(1.125rem, 10px);
    padding-top: 0.5rem;
  }
}

.p-timing-consult__step-text {
  margin-top: 0.375rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-timing-consult__step-text {
    font-size: max(0.9375rem, 10px);
  }
}

.p-timing-recommend {
  margin-bottom: 0;
}

.p-timing-recommend__banner {
  text-align: center;
  font-size: max(1.25rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-timing-recommend__banner {
    font-size: max(1.75rem, 10px);
  }
}

.p-timing-recommend__promo {
  margin-top: 1.125rem;
  max-width: 42.875rem;
  margin-inline: auto;
  background-color: var(--color-main);
  border-radius: 0.625rem;
  padding: 1rem;
  text-align: center;
  color: var(--color-white);
  outline: 0.125rem solid var(--color-white);
  outline-offset: -0.5rem;
}
@media screen and (min-width: 768px) {
  .p-timing-recommend__promo {
    margin-top: 1.5rem;
    padding: 1.375rem 1.25rem;
    outline-offset: -0.625rem;
  }
}

.p-timing-recommend__promo-catch {
  width: -moz-fit-content;
  width: fit-content;
  margin-inline: auto;
  background-color: var(--color-white);
  color: var(--color-main);
  border-radius: 6.25rem;
  padding: 0.1875rem 1rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
}
@media screen and (min-width: 768px) {
  .p-timing-recommend__promo-catch {
    font-size: max(1rem, 10px);
  }
}

.p-timing-recommend__promo-title {
  margin-top: 0.625rem;
  font-size: max(1.625rem, 10px);
  font-weight: 700;
  line-height: 1.3;
  letter-spacing: 0.05em;
}
@media screen and (min-width: 768px) {
  .p-timing-recommend__promo-title {
    margin-top: 0.75rem;
    font-size: max(2.375rem, 10px);
  }
}

.p-timing-recommend__promo-lead {
  margin-top: 0.625rem;
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  gap: 0.5rem 0.75rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
}
@media screen and (min-width: 768px) {
  .p-timing-recommend__promo-lead {
    margin-top: 0.875rem;
    font-size: max(1.625rem, 10px);
  }
}

/* 開催日時の下に添える注釈（2026-08-25 AUN#4「※予約優先制と注釈を入れてください」） */
.p-timing-recommend__promo-note {
  margin-top: 0.625rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
}
@media screen and (min-width: 768px) {
  .p-timing-recommend__promo-note {
    margin-top: 0.875rem;
    font-size: max(1rem, 10px);
  }
}

.p-timing-recommend__promo-lead span {
  background-color: var(--color-white);
  color: var(--color-main);
  border-radius: 0.25rem;
  padding: 0.125rem 0.75rem;
}

.p-timing-recommend__promo-lead em {
  font-style: normal;
  color: var(--color-accent-red);
  background-color: var(--color-white);
  border-radius: 50%;
  aspect-ratio: 1/1;
  padding: 0.375rem;
  line-height: 1;
  display: inline-flex;
  align-items: center;
  justify-content: center;
}

.p-timing-recommend__list {
  margin-top: 1.125rem;
  display: grid;
  gap: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-timing-recommend__list {
    margin-top: 1.5625rem;
    grid-template-columns: repeat(2, 1fr);
    gap: 1.5625rem;
  }
}

.p-timing-recommend__image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 343/200;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.625rem;
}

.p-timing-recommend__caption {
  margin-top: 0.5rem;
  text-align: center;
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-timing-recommend__caption {
    font-size: max(1.125rem, 10px);
  }
}

.p-timing-recommend__note {
  margin-top: 1.25rem;
  text-align: center;
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-timing-recommend__note {
    margin-top: 1.875rem;
    font-size: max(1.25rem, 10px);
  }
}

.p-timing-recommend__image[data-size=large] {
  margin-top: 1.125rem;
}
@media screen and (min-width: 768px) {
  .p-timing-recommend__image[data-size=large] {
    margin-top: 1.5625rem;
    max-width: 47.5rem;
    margin-inline: auto;
  }
}

.p-timing-recommend__button {
  text-align: center;
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-timing-recommend__button {
    margin-top: 1.875rem;
  }
}

@media screen and (min-width: 768px) {
  .p-top-area__heading {
    flex-direction: row;
    align-items: flex-end;
    gap: 0.3125rem;
  }
}

.p-top-area__image {
  margin-top: 0.625rem;
  width: 100%;
  height: auto;
}
@media screen and (min-width: 768px) {
  .p-top-area__image {
    margin-top: 0.9375rem;
  }
}

@media screen and (min-width: 768px) {
  .p-top-area.l-sub-content .p-top-area__image {
    max-width: 62.5rem;
    margin-inline: auto;
  }
}

@media screen and (min-width: 768px) {
  .p-top-area.l-sub-content .p-top-area__body {
    max-width: 50rem;
    margin-inline: auto;
    text-align: center;
  }
}

.p-top-area__image img {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
}

.p-top-area__body {
  margin-top: 0.625rem;
}

.p-top-area__text-main {
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  line-height: 1.3333333333;
  color: var(--color-main);
  font-feature-settings: "palt";
}

@media screen and (min-width: 768px) {
  .p-top-area.l-sub-content .p-top-area__text-main {
    font-size: max(1.5625rem, 10px);
    line-height: 1.5;
  }
}

/* 下層のこの本文だけ c-text(18) より少し大きく */
@media screen and (min-width: 768px) {
  .p-top-area.l-sub-content .p-top-area__text {
    font-size: max(1.25rem, 10px);
  }
}

.p-top-area__text {
  margin-top: 0.875rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.4285714286;
  color: var(--color-sub);
}

.p-top-area__button {
  margin-top: 1.25rem;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-top-area__button {
    margin-top: 1.875rem;
  }
}

/* SPだけ白背景＋上下余白30。PCは背景・余白なし */
.p-top-banner {
  background-color: var(--color-white);
  padding-block: 1.875rem;
}
@media screen and (min-width: 768px) {
  .p-top-banner {
    background-color: transparent;
    padding-block: 0;
  }
}

@media screen and (min-width: 768px) {
  .p-top-banner.c-background-beige {
    /* 下が 0 だと次セクション（施工の流れ）と詰まるため余白を確保 */
    padding-block: 3.75rem 2.375rem;
  }
}

.p-top-banner__list {
  display: grid;
  gap: 0.9375rem;
  grid-template-columns: repeat(1, 1fr);
}
@media screen and (min-width: 768px) {
  .p-top-banner__list {
    gap: 0.3125rem;
    grid-template-columns: repeat(4, 1fr);
  }
}

.p-top-banner__item {
  width: 100%;
  height: auto;
}

.p-top-banner__item img {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
  box-shadow: 0 0.625rem 0.625rem rgba(0, 0, 0, 0.1);
  border-radius: 0.625rem;
}

@media screen and (min-width: 768px) {
  .p-top-first__inner {
    display: grid;
    grid-template-columns: 1fr 30.75rem;
    grid-template-rows: auto auto auto 1fr;
    -moz-column-gap: 2.5rem;
         column-gap: 2.5rem;
    align-items: start;
  }
}

.p-top-first__image {
  width: 100%;
  height: auto;
}
@media screen and (min-width: 768px) {
  .p-top-first__image {
    grid-column: 2;
    grid-row: 1/5;
  }
}

.p-top-first__image img {
  aspect-ratio: 350/195;
  -o-object-fit: cover;
     object-fit: cover;
  height: auto;
  width: 100%;
  border-radius: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-top-first__image img {
    aspect-ratio: 492/394;
  }
}

.p-top-first__heading {
  margin-top: 0.1875rem;
}
@media screen and (min-width: 768px) {
  .p-top-first__heading {
    margin-top: 0;
    padding-top: 1.5625rem;
    grid-column: 1;
    grid-row: 1;
  }
}

.p-top-first__heading .c-section-title__ja {
  font-size: max(1.75rem, 10px);
}
@media screen and (min-width: 768px) {
  .p-top-first__heading .c-section-title__ja {
    font-size: max(2.5rem, 10px);
    text-align: left;
  }
}

.p-top-first__heading .c-section-title__ja span {
  font-size: max(1.125rem, 10px);
}
@media screen and (min-width: 768px) {
  .p-top-first__heading .c-section-title__ja span {
    font-size: max(1.625rem, 10px);
  }
}

.p-top-first__text {
  margin-top: 0.3125rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  font-feature-settings: "palt";
  line-height: 1.4285714286;
  font-weight: 500;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-top-first__text {
    margin-top: 0.5rem;
    grid-column: 1;
    grid-row: 2;
    font-size: max(1rem, 10px);
    line-height: 1.875;
    font-feature-settings: normal;
  }
}

.p-top-first__button {
  text-align: center;
  margin-top: 1.125rem;
}
@media screen and (min-width: 768px) {
  .p-top-first__button {
    margin-top: 2.5rem;
    grid-column: 1;
    grid-row: 3;
    text-align: left;
  }
}

@media screen and (min-width: 768px) {
  .p-top-flow-banner.c-background-beige {
    padding-block: 1.875rem 3.125rem;
  }
}

@media screen and (min-width: 768px) {
  .p-top-flow-banner__inner {
    display: grid;
    grid-template-columns: 1fr 29.1666666667%;
    -moz-column-gap: 1.875rem;
         column-gap: 1.875rem;
    align-items: start;
    max-width: 78.125rem;
    margin-inline: auto;
    padding-inline: 1.5625rem;
  }
}

@media screen and (min-width: 768px) {
  .p-top-flow-banner .l-inner {
    max-width: 39.5625rem;
    padding-inline: 0;
  }
}

@media screen and (min-width: 768px) {
  .p-top-flow-banner .p-top-banner {
    background-color: transparent;
    padding-block: 0;
  }
}

@media screen and (min-width: 768px) {
  .p-top-flow-banner .p-top-banner__list {
    grid-template-columns: 1fr;
    gap: 0.625rem;
  }
}

@media screen and (min-width: 768px) {
  .p-top-flow {
    background-color: var(--color-white);
    border-radius: 0.625rem;
    padding: 1.875rem 2.8125rem 2.8125rem;
  }
}

.p-top-flow__heading {
  position: relative;
}

@media screen and (min-width: 768px) {
  .p-top-flow__heading::before {
    content: "";
    position: absolute;
    z-index: 1;
    top: -0.25rem;
    left: 2.5rem;
    width: 7.875rem;
    height: auto;
    aspect-ratio: 126/218;
    background-image: url("../images/common/character02.webp");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
  }
}

@media screen and (min-width: 768px) {
  .p-top-flow__heading.c-section-title {
    align-items: center;
    text-align: center;
  }
}

.p-top-flow__lead {
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-top-flow__lead {
    font-size: max(1.1875rem, 10px);
  }
}

.p-top-flow__slider {
  margin-top: 1.125rem;
}
@media screen and (min-width: 768px) {
  .p-top-flow__slider {
    margin-top: 1.5625rem;
    position: relative;
    z-index: 2;
  }
}

.p-top-flow__item {
  position: relative;
}

.p-top-flow__item::after {
  content: "";
  position: absolute;
  bottom: 0;
  left: 0;
  width: 100%;
  height: 50%;
  background: linear-gradient(to bottom, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0.8) 100%);
  border-radius: 0.625rem;
  pointer-events: none;
}

.p-top-flow__thumb {
  width: 100%;
  height: auto;
}

.p-top-flow__thumb img {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: cover;
     object-fit: cover;
  aspect-ratio: 35/29;
  border-radius: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-top-flow__thumb img {
    aspect-ratio: 633/484;
  }
}

.p-top-flow__body {
  position: absolute;
  bottom: 1.25rem;
  left: 1.0625rem;
  right: 1.0625rem;
  width: auto;
  color: var(--color-white);
  z-index: 1;
}
@media screen and (min-width: 768px) {
  .p-top-flow__body {
    bottom: 1.875rem;
    left: 2.1875rem;
    right: 2.1875rem;
    width: auto;
  }
}

.p-top-flow__step {
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1;
  color: var(--color-white);
  font-family: var(--second-font-family);
  color: currentColor;
}
@media screen and (min-width: 768px) {
  .p-top-flow__step {
    font-size: max(1.5625rem, 10px);
  }
}

.p-top-flow__title {
  font-size: max(1.375rem, 10px);
  font-weight: 700;
  line-height: 1.1818181818;
  color: currentColor;
}
@media screen and (min-width: 768px) {
  .p-top-flow__title {
    font-size: max(2.125rem, 10px);
  }
}

.p-top-flow__text {
  margin-top: 0.5rem;
  font-size: max(0.9375rem, 10px);
  font-weight: 500;
  line-height: 1.2;
  font-weight: 500;
  color: currentColor;
}
@media screen and (min-width: 768px) {
  .p-top-flow__text {
    margin-top: 0.75rem;
    font-size: max(1.25rem, 10px);
    line-height: 1.5;
  }
}

.p-top-flow__button {
  text-align: center;
  margin-top: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-top-flow__button {
    margin-top: 1.875rem;
  }
}

.p-top-forms {
  margin-top: 2.625rem;
}
@media screen and (min-width: 768px) {
  .p-top-forms {
    margin-top: 4.1875rem;
  }
}

.p-top-forms__badges-inner.l-inner {
  padding-inline: 0.625rem;
}
@media screen and (min-width: 1441px) {
  .p-top-forms__badges-inner.l-inner {
    padding-inline: 1.5625rem;
  }
}

.p-top-forms__badges {
  display: flex;
  justify-content: center;
  align-items: flex-end;
  gap: 0.5rem;
}
@media screen and (min-width: 768px) {
  .p-top-forms__badges {
    gap: 1.875rem;
  }
}

.p-top-forms__badge {
  flex: 1;
  max-width: 7.1875rem;
}
@media screen and (min-width: 768px) {
  .p-top-forms__badge {
    max-width: 12.5rem;
  }
}

.p-top-forms__badge img {
  display: block;
  width: 100%;
  height: auto;
}

.p-top-forms__form-wrap {
  margin-top: 2.6875rem;
}
@media screen and (min-width: 768px) {
  .p-top-forms__form-wrap {
    margin-top: 3.125rem;
  }
}

.p-top-free-inspection {
  background-color: var(--color-main);
  padding-block: 1.875rem 1.25rem;
  border-radius: 0.625rem;
  color: var(--color-white);
}
@media screen and (min-width: 768px) {
  .p-top-free-inspection {
    background-color: transparent;
    padding-block: 0;
  }
}

@media screen and (min-width: 768px) {
  .p-top-free-inspection__box {
    background-color: var(--color-main);
    border-radius: 0.625rem;
    padding: 2.1875rem 1.25rem 1.6875rem;
    position: relative;
  }
}

@media screen and (min-width: 768px) {
  .p-top-free-inspection__box::before {
    content: "";
    position: absolute;
    z-index: 1;
    top: 1.125rem;
    right: 5.8125rem;
    width: 7.875rem;
    height: auto;
    aspect-ratio: 126/218;
    background-image: url("../images/common/character02-2.webp");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
  }
}

.p-top-free-inspection__heading .c-section-title__ja,
.p-top-free-inspection__heading .c-section-title__en {
  color: var(--color-white);
}

@media screen and (min-width: 768px) {
  .p-top-free-inspection__heading .c-section-title__en {
    margin-top: 0.625rem;
    width: 100%;
  }
}

.p-top-free-inspection__list {
  margin-top: 1.25rem;
  display: grid;
  gap: 0.625rem;
  grid-template-columns: repeat(1, 1fr);
  max-width: 31.25rem;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .p-top-free-inspection__list {
    margin-top: 2.3125rem;
    gap: 1.25rem;
    max-width: initial;
    grid-template-columns: repeat(2, 1fr);
    position: relative;
    z-index: 2;
  }
}

.p-top-free-inspection__item a {
  display: grid;
  align-items: center;
  grid-template-columns: 1fr 47.1428571429%;
  border-radius: 0.625rem;
  background-color: var(--color-white);
}

.p-top-free-inspection__body {
  padding: 0.9375rem;
  position: relative;
}
@media screen and (min-width: 768px) {
  .p-top-free-inspection__body {
    padding: 0.9375rem 1.6875rem;
  }
}

.p-top-free-inspection__body::after {
  content: "";
  position: absolute;
  top: 50%;
  right: -0.8125rem;
  transform: translateY(-50%);
  display: block;
  width: 1.625rem;
  height: 1.625rem;
  background-image: url("../images/common/arrow-orange.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
@media screen and (min-width: 768px) {
  .p-top-free-inspection__body::after {
    width: 2.625rem;
    height: 2.625rem;
    right: -1.25rem;
  }
}

.p-top-free-inspection__sub {
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-top-free-inspection__sub {
    font-size: max(1.125rem, 10px);
  }
}

.p-top-free-inspection__title {
  margin-top: 0.3125rem;
  font-size: max(1.5rem, 10px);
  font-weight: 700;
  line-height: 1;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-top-free-inspection__title {
    margin-top: 0.5rem;
    font-size: max(2.25rem, 10px);
  }
}

.p-top-free-inspection__thumb {
  width: 100%;
  height: auto;
}

.p-top-free-inspection__thumb img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 165/120;
  border-radius: 0 0.625rem 0.625rem 0;
  -o-object-fit: cover;
     object-fit: cover;
}

@media screen and (min-width: 768px) {
  .p-top-knowledge.c-background-white {
    padding-block: 3.4375rem 4.6875rem;
  }
}

.p-top-knowledge__title .c-section-title__ja {
  font-size: max(1.875rem, 10px);
}
@media screen and (min-width: 768px) {
  .p-top-knowledge__title .c-section-title__ja {
    font-size: max(3.125rem, 10px);
    line-height: 1;
  }
}

.p-top-knowledge__title .c-section-title__ja span {
  font-size: max(1.125rem, 10px);
  line-height: 2;
  font-feature-settings: "palt";
}
@media screen and (min-width: 768px) {
  .p-top-knowledge__title .c-section-title__ja span {
    font-size: max(1.875rem, 10px);
    font-feature-settings: normal;
  }
}

.p-top-knowledge__cross {
  display: inline-block;
  width: 1.25rem;
  margin-inline: 0.625rem;
  height: auto;
  vertical-align: middle;
}
@media screen and (min-width: 768px) {
  .p-top-knowledge__cross {
    width: 1.75rem;
  }
}

.p-top-knowledge__list {
  margin-top: 1.25rem;
  display: grid;
  gap: 0.5rem 0.625rem;
  grid-template-columns: repeat(2, 1fr);
}
@media screen and (min-width: 768px) {
  .p-top-knowledge__list {
    margin-top: 1.5625rem;
    gap: 3.625rem;
    grid-template-columns: repeat(3, 1fr);
  }
}

.p-top-knowledge__item:nth-child(1) {
  grid-area: 1/1/2/3;
}
@media screen and (min-width: 768px) {
  .p-top-knowledge__item:nth-child(1) {
    grid-area: auto;
  }
}

.p-top-knowledge__item:nth-child(2) {
  grid-area: 2/1/3/2;
}
@media screen and (min-width: 768px) {
  .p-top-knowledge__item:nth-child(2) {
    grid-area: auto;
  }
}

.p-top-knowledge__item:nth-child(3) {
  grid-area: 2/2/3/3;
}
@media screen and (min-width: 768px) {
  .p-top-knowledge__item:nth-child(3) {
    grid-area: auto;
  }
}

.p-top-knowledge__item iframe {
  display: block;
  aspect-ratio: 170/96;
  -o-object-fit: cover;
     object-fit: cover;
  height: auto;
  width: 100%;
  border-radius: 0.625rem;
}

c3-icon.ytmCuedOverlayPlayButtonIcon {
  width: 3.125rem;
}

.p-top-knowledge__button {
  text-align: center;
  margin-top: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-top-knowledge__button {
    margin-top: 2.5rem;
  }
}

@media screen and (min-width: 768px) {
  .p-top-menu {
    position: relative;
    padding-block: 4.25rem 0;
  }
}

@media screen and (min-width: 768px) {
  .p-top-menu::before {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 26.375rem;
    background-image: url("../images/top/menu-bg.webp");
    background-repeat: no-repeat;
    background-position: center;
    background-size: cover;
  }
}

@media screen and (min-width: 768px) {
  .p-top-menu__heading,
  .p-top-menu__inner {
    position: relative;
    z-index: 1;
  }
}

.p-top-menu__heading {
  background-image: url("../images/top/menu-bg.webp");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  width: 100%;
  height: 12.5rem;
  aspect-ratio: 390/200;
  padding: 2.5rem 0.625rem;
  color: var(--color-white);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-top-menu__heading {
    background-image: none;
    height: auto;
    aspect-ratio: auto;
    padding: 0;
  }
}

.p-top-menu__lead {
  font-size: max(0.9375rem, 10px);
  line-height: 1;
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .p-top-menu__lead {
    font-size: max(1.25rem, 10px);
  }
}

.p-top-menu__heading-title {
  font-size: max(1.5rem, 10px);
  font-weight: 700;
}
@media screen and (min-width: 768px) {
  .p-top-menu__heading-title {
    font-size: max(3.125rem, 10px);
  }
}

.p-top-menu__list {
  margin-top: -4.0625rem;
  max-width: 31.25rem;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .p-top-menu__list {
    margin-top: 2.5rem;
    max-width: initial;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 3.75rem 2.5rem;
  }
}

.p-top-menu__item + .p-top-menu__item {
  margin-top: 2.1875rem;
}
@media screen and (min-width: 768px) {
  .p-top-menu__item + .p-top-menu__item {
    margin-top: 0;
  }
}

.p-top-menu__item a {
  display: flex;
  align-items: center;
  border-radius: 0.625rem;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  background-color: var(--color-white);
  width: 94.2857142857%;
  margin-left: auto;
}
@media screen and (min-width: 768px) {
  .p-top-menu__item a {
    width: 100%;
    margin-left: 0;
    box-shadow: 0.625rem 0.625rem 0.125rem 0 rgba(0, 0, 0, 0.2);
  }
}

/* ホバーは透過ではなくサムネイルの拡大で見せる */
@media (any-hover: hover) {
  .p-top-menu__item a:hover {
    opacity: 1;
  }
  .p-top-menu__item a:hover .p-top-menu__thumb img {
    transform: scale(1.06);
  }
}
.p-top-menu__thumb {
  flex-shrink: 0;
  width: 45.4545454545%;
  height: auto;
  /* ホバー拡大が角丸からはみ出さないように */
  overflow: hidden;
  border-radius: 0.3125rem;
  transform: translate(-1.25rem, -1.25rem);
}
@media screen and (min-width: 768px) {
  .p-top-menu__thumb {
    transform: translate(-0.9375rem, -1.25rem);
    width: 39.3162393162%;
  }
}

.p-top-menu__thumb img {
  aspect-ratio: 15/18;
  -o-object-fit: cover;
     object-fit: cover;
  height: auto;
  width: 100%;
  border-radius: 0.3125rem;
  transition: transform 0.3s ease;
}
@media screen and (min-width: 768px) {
  .p-top-menu__thumb img {
    aspect-ratio: 230/250;
  }
}

.p-top-menu__body {
  padding-inline: 0 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-top-menu__body {
    padding-block: 1.5625rem;
    padding-inline: 1.5625rem;
  }
}

.p-top-menu__title {
  font-size: max(1.0625rem, 10px);
  font-weight: 700;
  color: var(--color-accent-green);
  display: flex;
  gap: 0.3125rem;
  white-space: nowrap;
}
@media screen and (min-width: 768px) {
  .p-top-menu__title {
    font-size: max(1.375rem, 10px);
  }
}

@media screen and (min-width: 768px) {
  .p-top-menu__title br {
    display: none;
  }
}

.p-top-menu__title::before {
  content: "";
  display: block;
  width: 1.625rem;
  height: 1.625rem;
  background-image: url("../images/common/arrow-green.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
@media screen and (min-width: 768px) {
  .p-top-menu__title::before {
    order: 1;
    margin-left: auto;
  }
}

.p-top-menu__text {
  margin-top: 0.625rem;
  font-size: max(0.75rem, 10px);
  font-weight: 500;
  line-height: 1.5;
  font-weight: 500;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-top-menu__text {
    font-size: max(1.125rem, 10px);
    line-height: 1.5555555556;
  }
}

.p-top-menu__text[data-space=s] {
  letter-spacing: -0.05em;
}

.p-top-menu__price {
  font-size: max(1.875rem, 10px);
  font-family: var(--second-font-family);
  font-weight: 700;
  color: var(--color-accent-red);
}
@media screen and (min-width: 768px) {
  .p-top-menu__price {
    font-size: max(2.5rem, 10px);
  }
}

.p-top-menu__price span {
  font-size: max(1rem, 10px);
  font-weight: 700;
  font-family: var(--base-font-family);
}

.p-top-menu__item:nth-of-type(even) a {
  flex-direction: row-reverse;
  margin-right: auto;
  margin-left: initial;
}
@media screen and (min-width: 768px) {
  .p-top-menu__item:nth-of-type(even) a {
    flex-direction: row;
    margin-right: 0;
  }
}

.p-top-menu__item:nth-of-type(even) .p-top-menu__thumb {
  transform: translate(1.25rem, -1.25rem);
}
@media screen and (min-width: 768px) {
  .p-top-menu__item:nth-of-type(even) .p-top-menu__thumb {
    transform: translate(-0.9375rem, -1.25rem);
  }
}

.p-top-menu__item:nth-of-type(even) .p-top-menu__body {
  padding-inline: 0.625rem 0;
}
@media screen and (min-width: 768px) {
  .p-top-menu__item:nth-of-type(even) .p-top-menu__body {
    padding-inline: 1.5625rem;
  }
}

.p-top-menu__button {
  text-align: center;
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-top-menu__button {
    margin-top: 3.4375rem;
  }
}

.p-top-message {
  padding-block: 0 1.875rem;
}
@media screen and (min-width: 768px) {
  .p-top-message {
    padding-block: 0 4.375rem;
  }
}

.p-top-message__heading {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-top-message__heading {
    margin-top: 2.0625rem;
  }
}

.p-top-message__body {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-top-message__body {
    margin-top: 1.5rem;
  }
}

.p-top-message__body::after {
  content: "";
  display: block;
  clear: both;
}

.p-top-message__image {
  float: right;
  width: 10.625rem;
  margin-left: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-top-message__image {
    width: 18.75rem;
    margin-left: 1.875rem;
  }
}

.p-top-message__image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
  aspect-ratio: 170/200;
  -o-object-fit: cover;
     object-fit: cover;
}
@media screen and (min-width: 768px) {
  .p-top-message__image img {
    aspect-ratio: 300/360;
  }
}

.p-top-message__text {
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.4285714286;
  color: var(--color-sub);
  font-feature-settings: "palt";
}
@media screen and (min-width: 768px) {
  .p-top-message__text {
    padding-top: 0.625rem;
    font-size: max(1.125rem, 10px);
    line-height: 1.8888888889;
  }
}

/* 上マージンのみ管理。箱・内部要素は共通パーツ c-movie-wrap（_c-movie-wrap.scss）側 */
.p-top-message__movie-wrap {
  margin-top: 1.5625rem;
}
@media screen and (min-width: 768px) {
  .p-top-message__movie-wrap {
    margin-top: 1.875rem;
  }
}

.p-top-message__button {
  text-align: center;
  margin-top: 1.5625rem;
}
@media screen and (min-width: 768px) {
  .p-top-message__button {
    margin-top: 2.1875rem;
    text-align: left;
  }
}

.p-top-reason__title {
  display: flex;
  align-items: center;
  gap: 0.625rem;
  padding-inline: 0.3125rem;
}
@media screen and (min-width: 768px) {
  .p-top-reason__title {
    display: contents;
  }
}

.p-top-reason__title-img {
  flex-shrink: 0;
  width: 6.75rem;
  height: auto;
}
@media screen and (min-width: 768px) {
  .p-top-reason__title-img {
    grid-area: logo;
    justify-self: center;
    width: 37.125rem;
    transform: translateX(1.625rem);
  }
}

.p-top-reason__title-img img {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
}

.p-top-reason__title-ja {
  font-size: max(1.5rem, 10px);
  line-height: 1.25;
  font-weight: 900;
}
@media screen and (min-width: 768px) {
  .p-top-reason__title-ja {
    grid-area: title;
    align-self: center;
    font-size: max(2.5rem, 10px);
  }
}

.p-top-reason__title-ja span {
  color: var(--color-main);
}

.p-top-reason__content {
  margin-top: 0.3125rem;
}
@media screen and (min-width: 768px) {
  .p-top-reason__content {
    margin-top: 1.5625rem;
    display: grid;
    grid-template-columns: 1fr 53.3333333333%;
    -moz-column-gap: 2.1875rem;
         column-gap: 2.1875rem;
    row-gap: 1.25rem;
    grid-template-areas: "logo  logo" "title image" "text  image";
    align-items: start;
  }
}

.p-top-reason__image {
  width: 100%;
  height: auto;
  margin-top: 0.9375rem;
}
@media screen and (min-width: 768px) {
  .p-top-reason__image {
    grid-area: image;
    margin-top: 0.625rem;
  }
}

@media screen and (min-width: 768px) {
  .p-top-reason__text-wrap {
    grid-area: text;
  }
}

.p-top-reason__image img {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
  border-radius: 0.3125rem;
}

.p-top-reason__text {
  margin-top: 0.625rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.4285714286;
  font-weight: 500;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-top-reason__text {
    font-size: max(1.125rem, 10px);
    line-height: 1.8888888889;
    margin-top: 0;
  }
}

.p-top-reason__button {
  text-align: center;
  margin-top: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-top-reason__button {
    margin-top: 1.75rem;
    text-align: left;
  }
}

.p-top-review {
  background-color: var(--color-white);
  padding-block-end: 1.0625rem;
}
@media screen and (min-width: 768px) {
  .p-top-review {
    padding-block: 3.125rem 4.375rem;
  }
}

/* SPはここがオレンジの箱。PCは幅だけ持たせて、オレンジは __box に渡す */
.p-top-review__inner {
  max-width: 37.5rem;
  margin-inline: auto;
  padding: 1.25rem;
  background-color: var(--color-main);
  border-radius: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-top-review__inner {
    max-width: 78.125rem;
    padding: 0 1.5625rem;
    background-color: transparent;
    border-radius: 0;
  }
}

@media screen and (min-width: 768px) {
  .p-top-review__box {
    background-color: var(--color-main);
    border-radius: 0.625rem;
    padding: 1.25rem;
  }
}

.p-top-review__content {
  background-color: var(--color-white);
  border-radius: 0.625rem;
  padding: 5.1875rem 1.25rem 1.25rem;
  position: relative;
}
@media screen and (min-width: 768px) {
  .p-top-review__content {
    padding-inline: 1.875rem;
  }
}

.p-top-review__logo {
  width: 65%;
  height: auto;
  max-width: 18.75rem;
  position: absolute;
  top: -1.25rem;
  left: 50%;
  transform: translateX(-50%);
}
@media screen and (min-width: 768px) {
  .p-top-review__logo {
    max-width: 14.5rem;
    width: 100%;
  }
}

.p-top-review__logo img {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
}

@media screen and (min-width: 768px) {
  .p-top-review__widget {
    max-width: 64.375rem;
    margin-inline: auto;
  }
}

.p-top-review__slider {
  margin-top: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-top-review__slider {
    margin-top: 0.625rem;
  }
}

.p-top-review__slider .splide__slide {
  height: auto;
}

/* 白ボックス上に直置き（枠線・影なし） */
.p-top-review__card {
  height: 100%;
}

/* アイコン → 名前 → 星 を縦積み・中央 */
.p-top-review__card-head {
  text-align: center;
}

.p-top-review__card-avatar {
  width: 3.125rem;
  height: 3.125rem;
  margin-inline: auto;
  display: grid;
  place-items: center;
  border-radius: 50%;
  background-color: var(--color-accent-green);
  color: var(--color-white);
  font-size: max(1.375rem, 10px);
  font-weight: 700;
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .p-top-review__card-avatar {
    font-size: max(1.5rem, 10px);
  }
}

.p-top-review__card-name {
  margin-top: 0.125rem;
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1.3;
  color: var(--color-sub);
}

.p-top-review__card-stars {
  margin-top: 0.1875rem;
  font-size: max(1.125rem, 10px);
  line-height: 1;
  letter-spacing: 0.04em;
}
@media screen and (min-width: 768px) {
  .p-top-review__card-stars {
    font-size: max(1.25rem, 10px);
  }
}

.p-top-review__card-stars-on {
  color: #fbbc04;
}

.p-top-review__card-stars-off {
  color: var(--color-gray);
}

.p-top-review__card-rating {
  margin-left: 0.25rem;
  color: #fbbc04;
  font-weight: 700;
}

/* このスライダーだけ矢印列を上寄せ・カード幅より外側に広げる */
.p-top-review__slider .splide__arrows {
  top: 10%;
  left: 50%;
  width: 115%;
  transform: translate(-50%, -50%);
}
@media screen and (min-width: 768px) {
  .p-top-review__slider .splide__arrows {
    top: 34%;
    width: 117%;
  }
}

/* 矢印：緑丸・左右にオーバーラップ */
.p-top-review__slider .splide__arrow {
  width: 2.75rem;
  height: 2.75rem;
  background-color: var(--color-accent-green);
  opacity: 1;
}

.p-top-review__slider .splide__arrow svg {
  width: 0.875rem;
  height: 0.875rem;
  fill: var(--color-white);
}
@media screen and (min-width: 768px) {
  .p-top-review__slider .splide__arrow svg {
    width: 1rem;
    height: 1rem;
  }
}

.p-top-review__slider .splide__arrow--prev {
  left: -0.5rem;
}

.p-top-review__slider .splide__arrow--next {
  right: -0.5rem;
}

.p-top-review__card-text {
  margin-top: 0.4375rem;
  font-size: max(0.75rem, 10px);
  font-weight: 500;
  line-height: 1.5;
  color: var(--color-sub);
  display: -webkit-box;
  -webkit-line-clamp: 8;
  line-clamp: 8;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

/* お客様の声一覧：声セクションの下に呼び出したとき上に余白 */
.p-voice-review {
  margin-top: 2.8125rem;
}
@media screen and (min-width: 768px) {
  .p-voice-review {
    margin-top: 3.75rem;
  }
}

@media screen and (min-width: 768px) {
  .p-top-showroom__inner {
    display: grid;
    grid-template-columns: 30.75rem 1fr;
    grid-template-rows: auto auto auto 1fr;
    -moz-column-gap: 2.5rem;
         column-gap: 2.5rem;
    align-items: start;
  }
}

.p-top-showroom__image {
  width: 100%;
  height: auto;
}
@media screen and (min-width: 768px) {
  .p-top-showroom__image {
    grid-column: 1;
    grid-row: 1/5;
  }
}

.p-top-showroom__image img {
  aspect-ratio: 350/195;
  -o-object-fit: cover;
     object-fit: cover;
  height: auto;
  width: 100%;
  border-radius: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-top-showroom__image img {
    aspect-ratio: 492/394;
  }
}

.p-top-showroom__heading {
  margin-top: 0.8125rem;
}
@media screen and (min-width: 768px) {
  .p-top-showroom__heading {
    margin-top: 0;
    grid-column: 2;
    grid-row: 1;
  }
}

.p-top-showroom__heading .c-section-title__ja {
  font-size: max(1.75rem, 10px);
}
@media screen and (min-width: 768px) {
  .p-top-showroom__heading .c-section-title__ja {
    font-size: max(2.5rem, 10px);
    text-align: left;
  }
}

.p-top-showroom__heading .c-section-title__ja span {
  font-size: max(1.125rem, 10px);
}
@media screen and (min-width: 768px) {
  .p-top-showroom__heading .c-section-title__ja span {
    font-size: max(2.1875rem, 10px);
  }
}

.p-top-showroom__text {
  margin-top: 0.3125rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  font-feature-settings: "palt";
  line-height: 1.4285714286;
  font-weight: 500;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-top-showroom__text {
    margin-top: 1.3125rem;
    grid-column: 2;
    grid-row: 2;
    font-size: max(1rem, 10px);
    line-height: 1.875;
    font-feature-settings: normal;
  }
}

.p-top-showroom__button {
  text-align: center;
  margin-top: 1.125rem;
}
@media screen and (min-width: 768px) {
  .p-top-showroom__button {
    margin-top: 2.5rem;
    grid-column: 2;
    grid-row: 3;
    text-align: left;
  }
}

.p-top-simulation__title .c-section-title__ja {
  font-size: max(1.375rem, 10px);
  letter-spacing: -0.01em;
}
@media screen and (min-width: 768px) {
  .p-top-simulation__title .c-section-title__ja {
    font-size: max(3.125rem, 10px);
    line-height: 1.2;
  }
}

@media screen and (min-width: 768px) {
  .p-top-simulation__title .c-section-title__en {
    margin-top: 1.25rem;
  }
}

.p-top-simulation__list {
  margin-top: 1.25rem;
  display: grid;
  gap: 0.6875rem;
  grid-template-columns: repeat(1, 1fr);
}
@media screen and (min-width: 768px) {
  .p-top-simulation__list {
    margin-top: 2.1875rem;
    gap: 1.0625rem;
    grid-template-columns: repeat(3, 1fr);
  }
}

.p-top-simulation__item {
  background-color: var(--color-white);
  padding: 1.25rem;
  border-radius: 0.625rem;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-top-simulation__item {
    padding: 2.5rem 1.375rem;
    gap: 0.9375rem;
  }
}

.p-top-simulation__step {
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  font-family: var(--second-font-family);
  color: var(--color-accent-green);
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .p-top-simulation__step {
    font-size: max(0.9375rem, 10px);
  }
}

.p-top-simulation__title {
  font-size: max(1.375rem, 10px);
  font-weight: 700;
  color: var(--color-accent-green);
}
@media screen and (min-width: 768px) {
  .p-top-simulation__title {
    font-size: max(1.75rem, 10px);
  }
}

.p-top-simulation__text {
  margin-top: 0.3125rem;
  font-size: max(0.9375rem, 10px);
  font-weight: 500;
  line-height: 1.2;
  font-weight: 500;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-top-simulation__text {
    margin-top: 0.625rem;
    font-size: max(1.0625rem, 10px);
    line-height: 1.6470588235;
  }
}

.p-top-simulation__icon {
  width: 3.4375rem;
  height: auto;
  aspect-ratio: 1;
  flex-shrink: 0;
}
@media screen and (min-width: 768px) {
  .p-top-simulation__icon {
    width: 3.75rem;
  }
}

.p-top-simulation__icon img {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
}

.p-top-simulation__button {
  text-align: center;
  margin-top: 1.5625rem;
}
@media screen and (min-width: 768px) {
  .p-top-simulation__button {
    margin-top: 1.875rem;
  }
}

.p-top-smile {
  padding-bottom: 1.75rem;
}
@media screen and (min-width: 768px) {
  .p-top-smile {
    padding-bottom: 0;
    overflow: hidden;
  }
}

.p-top-smile__heading {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-top-smile__heading {
    margin-top: 2.0625rem;
  }
}

.p-top-smile__list {
  margin-top: 0.625rem;
  display: grid;
  gap: 0.625rem 0.3125rem;
  grid-template-columns: repeat(2, 1fr);
}
@media screen and (min-width: 768px) {
  .p-top-smile__list {
    margin-top: 1.875rem;
    gap: 0;
  }
}

.p-top-smile__slider {
  margin-top: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-top-smile__slider {
    margin-top: 0.75rem;
  }
}

@media screen and (min-width: 768px) {
  .p-top-smile__slider .splide__track {
    overflow: visible;
  }
}

.p-top-smile__slider .p-top-smile__list {
  margin-top: 0;
}

.p-top-smile__slider.splide:not(.is-active) .p-top-smile__list {
  display: grid;
  gap: 0.625rem 0.3125rem;
  grid-template-columns: repeat(2, 1fr);
}

@media screen and (min-width: 768px) {
  .p-top-smile__slider.splide.is-active .p-top-smile__list {
    display: flex;
  }
}
.p-top-smile__slider .splide__arrow.splide__arrow--next {
  transform: none;
  right: -0.3125rem;
}

.p-top-smile__slider .splide__arrow.splide__arrow--prev {
  left: -0.3125rem;
}

.p-top-smile__item {
  /* グリッドの行内で高さが揃うよう、中のカード（a）を伸ばす。
     タイトルの行数が違っても外形が揃う（2026-08-27） */
  display: flex;
}
@media screen and (min-width: 768px) {
  .p-top-smile__item {
    padding: 0.9375rem;
  }
}

.p-top-smile__item a {
  flex: 1;
  display: flex;
  flex-direction: column;
  background-color: #F9F1DE;
  padding: 0.3125rem 0.3125rem 0.625rem;
  border-radius: 0.3125rem;
  box-shadow: 0 0 0.625rem 0 rgba(0, 0, 0, 0.2);
  position: relative;
}
@media screen and (min-width: 768px) {
  .p-top-smile__item a {
    background-color: #F9F1DE;
    padding: 0.3125rem 0.3125rem 1.125rem;
    box-shadow: 0.625rem 0.625rem 0.125rem 0 rgba(0, 0, 0, 0.2);
  }
}

.p-top-smile__thumb {
  width: 100%;
  height: auto;
  overflow: hidden;
  border-radius: 0.3125rem;
}

.p-top-smile__thumb img {
  aspect-ratio: 162/110;
  -o-object-fit: cover;
     object-fit: cover;
  height: auto;
  width: 100%;
  border-radius: 0.3125rem;
  transition: transform 0.3s ease;
}
@media screen and (min-width: 768px) {
  .p-top-smile__thumb img {
    border-radius: 0;
    aspect-ratio: 560/311;
  }
}

@media (any-hover: hover) {
  .p-top-smile__item a:hover {
    opacity: 1;
  }
  .p-top-smile__item a:hover .p-top-smile__thumb img {
    transform: scale(1.08);
  }
}
.p-top-smile__title {
  margin-top: 0.4375rem;
  padding-inline: 0.3125rem;
  font-size: max(0.75rem, 10px);
  font-weight: 500;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-top-smile__title {
    margin-top: 0.9375rem;
    font-size: max(1.25rem, 10px);
    font-weight: 700;
    text-align: center;
  }
}

.p-top-smile__button {
  text-align: center;
  margin-top: 0.9375rem;
}
@media screen and (min-width: 768px) {
  .p-top-smile__button {
    margin-top: 1.5625rem;
  }
}

.p-top-smile__pagenavi {
  margin-top: 1.5625rem;
}
@media screen and (min-width: 768px) {
  .p-top-smile__pagenavi {
    margin-top: 2.5rem;
  }
}

.p-top-staff__slider {
  margin-top: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-top-staff__slider {
    margin-top: 1.25rem;
  }
}

.p-top-staff__list {
  margin-top: 0.625rem;
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 1.25rem 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-top-staff__list {
    margin-top: 1.875rem;
    gap: 1.875rem 1.25rem;
  }
}

.p-top-staff__list .p-top-staff__item {
  width: calc((100% - 0.625rem) / 2);
}
@media screen and (min-width: 768px) {
  .p-top-staff__list .p-top-staff__item {
    width: calc((100% - 1.25rem * 4) / 5);
  }
}

/* 3〜5人：md以上でスライダー解除、静的グリッド（中央寄せ5列）として表示
   Splide本体の `.splide:not(.is-active) .splide__list{display:block}` を上書きするため詳細度を上げる */
@media screen and (min-width: 768px) {
  .p-top-staff__slider--sp-only.splide:not(.is-active) .splide__list {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    gap: 1.875rem 1.25rem;
  }
  .p-top-staff__slider--sp-only.splide:not(.is-active) .splide__slide {
    width: calc((100% - 1.25rem * 4) / 5);
  }
}
.p-top-staff__slider .splide__arrows {
  top: 40%;
}

.p-top-staff__thumb {
  width: 100%;
  height: auto;
}

.p-top-staff__thumb img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.625rem;
  aspect-ratio: 170/200;
  -o-object-fit: cover;
     object-fit: cover;
}

.p-top-staff__body {
  margin-top: 0.375rem;
}
@media screen and (min-width: 768px) {
  .p-top-staff__body {
    margin-top: 0.75rem;
    text-align: center;
  }
}

.p-top-staff__role {
  min-height: 1em;
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-top-staff__role {
    font-size: max(1rem, 10px);
  }
}

.p-top-staff__name {
  margin-top: 0.3125rem;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-top-staff__name {
    font-size: max(1.4375rem, 10px);
  }
}

.p-top-staff__button {
  text-align: center;
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-top-staff__button {
    margin-top: 2.1875rem;
  }
}

/* SP/PCで比率の違う art-directed picture（sp 700x300 / pc 1600x330）。
   グローバルリセットに height:auto が無く、img の height属性で縦伸びするため、
   表示中の画像の実比率でサイズさせる */
.p-top-subsidy__link img {
  height: auto;
}

@media screen and (min-width: 768px) {
  .p-top-topics-area {
    display: grid;
    grid-template-columns: 1.1fr 1fr;
    -moz-column-gap: 3.125rem;
         column-gap: 3.125rem;
    align-items: start;
    max-width: 78.125rem;
    margin-inline: auto;
    padding-inline: 1.5625rem;
  }
}

@media screen and (min-width: 768px) {
  .p-top-topics-area .l-inner {
    max-width: none;
    padding-inline: 0;
  }
}

@media screen and (min-width: 768px) {
  .p-top-topics-area .p-top-topics__inner.l-inner {
    display: block;
  }
}

@media screen and (min-width: 768px) {
  .p-top-topics-area .p-news-list__item a {
    display: block;
    padding-block: 2.1875rem;
  }
}

.p-top-topics-area .p-news-list__item:nth-child(n+4) {
  display: none;
}
@media screen and (min-width: 768px) {
  .p-top-topics-area .p-news-list__item:nth-child(n+4) {
    display: block;
  }
}

@media screen and (min-width: 768px) {
  .p-top-topics__inner.l-inner {
    display: grid;
    gap: 1.25rem;
    grid-template-columns: 14.0625rem 1fr;
  }
}

/* topics-area 内のニュース見出しだけ、施工エリア（p-top-area__heading）と同様にPC横並びにする。
   ※ページ上部の最初の新着情報は .p-top-topics-area の外なので影響なし */
@media screen and (min-width: 768px) {
  .p-top-topics-area .p-top-topics .c-section-title {
    flex-direction: row;
    align-items: flex-end;
    gap: 0;
  }
}

.p-top-works__list {
  margin-top: 0.625rem;
  display: grid;
  gap: 2.5rem 0.3125rem;
  grid-template-columns: repeat(2, 1fr);
}
@media screen and (min-width: 768px) {
  .p-top-works__list {
    margin-top: 2.8125rem;
    gap: 1.25rem;
    grid-template-columns: repeat(4, 1fr);
  }
}

.p-top-works__item a {
  display: block;
  /* テキスト量に関係なくカードの高さを揃える */
  height: 100%;
  background-color: var(--color-white);
  padding: 0.3125rem 0.3125rem 1.25rem;
  border-radius: 0.3125rem;
  box-shadow: 0 0 0.625rem 0 rgba(0, 0, 0, 0.1);
  position: relative;
}
@media screen and (min-width: 768px) {
  .p-top-works__item a {
    padding-bottom: 2.8125rem;
    padding: 0.625rem 0.625rem 1.25rem;
    box-shadow: 0.625rem 0.625rem 0.125rem 0 rgba(0, 0, 0, 0.2);
    /* ボタンを下端に揃えるため縦フレックスにする */
    display: flex;
    flex-direction: column;
  }
}

.p-top-works__list[data-label=none] .p-top-works__item a::after {
  content: none;
}

.p-top-works__item a:after {
  content: "";
  position: absolute;
  top: 0;
  left: 0;
  width: 4.375rem;
  height: 4.5625rem;
  background-image: url("../images/common/recommend.svg");
  background-size: contain;
  background-repeat: no-repeat;
  background-position: center;
}
@media screen and (min-width: 768px) {
  .p-top-works__item a:after {
    width: 6.75rem;
    height: 7.125rem;
  }
}

.p-top-works__thumb {
  width: 100%;
  height: auto;
  overflow: hidden;
  border-radius: 0.3125rem;
}

.p-top-works__thumb img {
  aspect-ratio: 162/110;
  -o-object-fit: cover;
     object-fit: cover;
  height: auto;
  width: 100%;
  border-radius: 0.3125rem;
  transition: transform 0.3s ease;
}
@media screen and (min-width: 768px) {
  .p-top-works__thumb img {
    aspect-ratio: 394/280;
  }
}

@media (any-hover: hover) {
  .p-top-works__item a:hover {
    opacity: 1;
  }
  .p-top-works__item a:hover .p-top-works__thumb img {
    transform: scale(1.08);
  }
}
.p-top-works__title {
  margin-top: 0.625rem;
  padding-inline: 0.125rem 0;
  font-size: max(0.75rem, 10px);
  font-weight: 500;
  color: var(--color-sub);
  /* タイトルは3行まで。超える分は省略 */
  display: -webkit-box;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 3;
  line-clamp: 3;
  overflow: hidden;
}
@media screen and (min-width: 768px) {
  .p-top-works__title {
    font-size: max(1.125rem, 10px);
    padding-inline: 0.625rem;
    /* ボタンとの最低限のあき（残りは __more の margin-top:auto が吸収） */
    margin-bottom: 1rem;
  }
}

.p-top-works__more {
  position: absolute;
  bottom: -1.25rem;
  left: 50%;
  transform: translateX(-50%);
  width: 9.5rem;
  background-color: var(--color-sub);
  border-radius: 1.875rem;
  text-align: center;
  padding: 0.5rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.4285714286;
  font-weight: 500;
  color: var(--color-white);
}
@media screen and (min-width: 768px) {
  .p-top-works__more {
    position: static;
    left: auto;
    transform: none;
    /* タイトルの行数に関係なくカード下端に揃える */
    margin-top: auto;
    font-size: max(1rem, 10px);
    padding: 0.75rem;
    width: 100%;
    max-width: 15rem;
    margin-inline: auto;
  }
}

.p-top-works__button {
  margin-top: 3.125rem;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-top-works__button {
    margin-top: 2.8125rem;
  }
}

.p-top-works__pagenavi {
  margin-top: 1.875rem;
}
@media screen and (min-width: 768px) {
  .p-top-works__pagenavi {
    margin-top: 2.8125rem;
  }
}

.p-visiting-intro__label {
  display: inline-block;
  background-color: var(--color-sub);
  color: var(--color-white);
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  padding: 0.3125rem 0.875rem;
  border-radius: 0.1875rem;
}
@media screen and (min-width: 768px) {
  .p-visiting-intro__label {
    font-size: max(0.9375rem, 10px);
  }
}

.p-visiting-intro__title {
  margin-top: 0.75rem;
  font-size: max(1.375rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-visiting-intro__title {
    margin-top: 1rem;
    font-size: max(2rem, 10px);
  }
}

.p-visiting-intro__lead {
  margin-top: 1rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.8571428571;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-visiting-intro__lead {
    margin-top: 1.5rem;
    font-size: max(1.125rem, 10px);
    line-height: 1.875;
  }
}

.p-visiting-trouble__lead {
  margin-top: 1.25rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.8571428571;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-visiting-trouble__lead {
    margin-top: 1.875rem;
    font-size: max(1.125rem, 10px);
    line-height: 1.875;
  }
}

.p-visiting-trouble__cards {
  margin-top: 1.25rem;
  display: grid;
  gap: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-visiting-trouble__cards {
    margin-top: 1.875rem;
    grid-template-columns: repeat(3, 1fr);
    gap: 1.25rem;
  }
}

.p-visiting-trouble__card {
  background-color: var(--color-white);
  border: 1px solid var(--color-border-line);
  border-radius: 0.5rem;
  padding: 1.125rem 1rem;
  text-align: center;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.08);
}

.p-visiting-trouble__card-num {
  font-family: var(--second-font-family);
  font-size: max(2.125rem, 10px);
  font-weight: 700;
  line-height: 1.1;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-visiting-trouble__card-num {
    font-size: max(2.5rem, 10px);
  }
}

.p-visiting-trouble__card-num span {
  font-family: var(--base-font-family);
  font-size: max(1rem, 10px);
  padding-left: 0.125rem;
}
@media screen and (min-width: 768px) {
  .p-visiting-trouble__card-num span {
    font-size: max(1.125rem, 10px);
  }
}

.p-visiting-trouble__card-label {
  margin-top: 0.5rem;
  font-size: max(0.75rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-visiting-trouble__card-label {
    font-size: max(0.8125rem, 10px);
  }
}

.p-visiting-trouble__image {
  margin-top: 1.25rem;
  width: 100%;
  height: auto;
}
@media screen and (min-width: 768px) {
  .p-visiting-trouble__image {
    margin-top: 1.875rem;
    max-width: 50rem;
    margin-inline: auto;
  }
}

.p-visiting-trouble__image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.5rem;
}

.p-visiting-trouble__note {
  margin-top: 1.125rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.8571428571;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-visiting-trouble__note {
    margin-top: 1.5625rem;
    font-size: max(1rem, 10px);
    line-height: 1.875;
  }
}

.p-visiting-trouble__source {
  margin-top: 0.5rem;
  font-size: max(0.6875rem, 10px);
  font-weight: 500;
  line-height: 1.5;
  color: var(--color-border);
}
@media screen and (min-width: 768px) {
  .p-visiting-trouble__source {
    font-size: max(0.75rem, 10px);
  }
}

.p-visiting-talk__lead {
  margin-top: 1rem;
  text-align: center;
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-visiting-talk__lead {
    margin-top: 1.25rem;
    font-size: max(1.125rem, 10px);
  }
}

.p-visiting-talk__image,
.p-visiting-talk__stop-image {
  margin-top: 1rem;
  width: 100%;
  height: auto;
}
@media screen and (min-width: 768px) {
  .p-visiting-talk__image,
  .p-visiting-talk__stop-image {
    margin-top: 1.5rem;
    max-width: 45rem;
    margin-inline: auto;
  }
}

.p-visiting-talk__stop-image {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-visiting-talk__stop-image {
    margin-top: 1.75rem;
  }
}

.p-visiting-talk__image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 2/1;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.5rem;
}

.p-visiting-talk__stop-image img {
  display: block;
  width: 100%;
  height: auto;
  border-radius: 0.5rem;
}

.p-visiting-talk__sub-title {
  margin-top: 1.25rem;
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-main);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-visiting-talk__sub-title {
    margin-top: 1.75rem;
    font-size: max(1.125rem, 10px);
  }
}

.p-visiting-talk__list {
  margin-top: 0.875rem;
  list-style: none;
  display: grid;
  gap: 1rem;
  max-width: 50rem;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .p-visiting-talk__list {
    margin-top: 1.25rem;
    gap: 1.25rem;
  }
}

.p-visiting-talk__item {
  position: relative;
  width: -moz-fit-content;
  width: fit-content;
  max-width: 85%;
  background-color: var(--color-bg-cream);
  border-radius: 0.625rem;
  padding: 1rem 1.375rem;
  font-size: max(1rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-visiting-talk__item {
    padding: 1.25rem 2rem;
    font-size: max(1.25rem, 10px);
  }
}

/* しっぽ（吹き出しの三角） */
.p-visiting-talk__item::before {
  content: "";
  position: absolute;
  top: 1rem;
  border: 0.75rem solid transparent;
}

/* 奇数＝左寄せ・しっぽ左 */
.p-visiting-talk__item:nth-child(odd) {
  margin-right: auto;
}

.p-visiting-talk__item:nth-child(odd)::before {
  right: 100%;
  border-right-color: var(--color-bg-cream);
}

/* 偶数＝右寄せ・しっぽ右 */
.p-visiting-talk__item:nth-child(even) {
  margin-left: auto;
}

.p-visiting-talk__item:nth-child(even)::before {
  left: 100%;
  border-left-color: var(--color-bg-cream);
}

.p-visiting-talk__warning {
  position: relative;
  margin-top: 1.25rem;
  background-color: var(--color-bg-cream);
  border: 0.125rem solid var(--color-main);
  border-radius: 0.625rem;
  padding: 1.25rem 1rem;
  box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.08);
}
@media screen and (min-width: 768px) {
  .p-visiting-talk__warning {
    margin-top: 6.25rem;
    padding: 1.75rem 2rem;
  }
}

.p-visiting-talk__warning-char {
  display: none;
}
@media screen and (min-width: 768px) {
  .p-visiting-talk__warning-char {
    display: block;
    position: absolute;
    right: 2rem;
    bottom: calc(100% - 0.75rem);
    width: 10.5rem;
    height: auto;
  }
}

.p-visiting-talk__alert {
  text-align: center;
}

.p-visiting-talk__alert-title {
  font-size: max(1.25rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-visiting-talk__alert-title {
    font-size: max(1.875rem, 10px);
  }
}

.p-visiting-talk__alert-text {
  margin-top: 0.5rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.7;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-visiting-talk__alert-text {
    font-size: max(0.9375rem, 10px);
  }
}

.p-visiting-talk__accent {
  margin-top: 1rem;
  padding-top: 1rem;
  border-top: 1px dashed var(--color-main);
  text-align: center;
  font-size: max(1.0625rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-visiting-talk__accent {
    margin-top: 1.25rem;
    padding-top: 1.25rem;
    font-size: max(1.375rem, 10px);
  }
}

.p-visiting-talk__text {
  margin-top: 0.625rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.7;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-visiting-talk__text {
    font-size: max(0.9375rem, 10px);
  }
}

.p-visiting-caution__list {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-visiting-caution__list {
    margin-top: 1.875rem;
    --c-grid-cols: 1;
  }
}

.p-visiting-caution__item {
  background-color: var(--color-white);
  border-radius: 0.5rem;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  padding: 1rem;
}
@media screen and (min-width: 768px) {
  .p-visiting-caution__item {
    padding: 1.5rem 1.75rem;
  }
}

.p-visiting-caution__head {
  display: flex;
  align-items: center;
  gap: 0.75rem;
}

.p-visiting-caution__num {
  flex-shrink: 0;
  width: 2rem;
  height: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-sub);
  color: var(--color-white);
  border-radius: 50%;
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  font-family: var(--second-font-family);
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .p-visiting-caution__num {
    width: 2.375rem;
    height: 2.375rem;
    font-size: max(1.125rem, 10px);
  }
}

.p-visiting-caution__text {
  margin-top: 0.75rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.7;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-visiting-caution__text {
    font-size: max(0.9375rem, 10px);
  }
}

.p-visiting-caution__banner {
  margin-top: 0.875rem;
}
@media screen and (min-width: 768px) {
  .p-visiting-caution__banner {
    margin-top: 1.125rem;
    max-width: 37.5rem;
    height: auto;
    margin-inline: auto;
  }
}

.p-visiting-caution__banner img {
  display: block;
  width: 100%;
  height: auto;
}

.p-visiting-caution__point {
  margin-top: 1.25rem;
  background-color: var(--color-bg-cream);
  border: 0.125rem solid var(--color-main);
  border-radius: 0.625rem;
  padding: 1.25rem 1rem;
  box-shadow: 0 0 12px 0 rgba(0, 0, 0, 0.08);
}
@media screen and (min-width: 768px) {
  .p-visiting-caution__point {
    margin-top: 1.875rem;
    padding: 1.75rem 2rem;
  }
}

.p-visiting-caution__point-head {
  text-align: center;
  font-size: max(1.25rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-visiting-caution__point-head {
    font-size: max(1.875rem, 10px);
  }
}

.p-visiting-caution__point-text {
  margin-top: 0.75rem;
  text-align: center;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.7;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-visiting-caution__point-text {
    font-size: max(1rem, 10px);
  }
}

.p-visiting-caution__movie-wrap {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-visiting-caution__movie-wrap {
    margin-top: 1.875rem;
  }
}

.p-visiting-caution__movie-lead {
  text-align: center;
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-visiting-caution__movie-lead {
    font-size: max(1rem, 10px);
  }
}

.p-visiting-caution__movie {
  margin-top: 0.75rem;
  width: 100%;
}
@media screen and (min-width: 768px) {
  .p-visiting-caution__movie {
    margin-top: 1rem;
    max-width: 45rem;
    margin-inline: auto;
  }
}

.p-visiting-caution__movie iframe {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16/9;
  border-radius: 0.5rem;
}

.p-visiting-check__lead {
  margin-top: 1.125rem;
  font-size: max(0.875rem, 10px);
  font-weight: 500;
  line-height: 1.8571428571;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-visiting-check__lead {
    margin-top: 1.5rem;
    font-size: max(1.125rem, 10px);
    line-height: 1.875;
  }
}

.p-visiting-check__sub-title {
  margin-top: 1.25rem;
  font-size: max(1.25rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-main);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-visiting-check__sub-title {
    margin-top: 1.75rem;
    font-size: max(1.625rem, 10px);
  }
}

.p-visiting-check__list {
  margin-top: 1rem;
  list-style: none;
  display: grid;
  gap: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-visiting-check__list {
    margin-top: 1.5rem;
    gap: 0.875rem;
  }
}

.p-visiting-check__item {
  position: relative;
  background-color: var(--color-white);
  border: 1px solid var(--color-border-line);
  border-radius: 0.3125rem;
  padding: 0.875rem 1rem 0.875rem 2.875rem;
}
@media screen and (min-width: 768px) {
  .p-visiting-check__item {
    padding: 1.125rem 1.375rem 1.125rem 3.5rem;
  }
}

.p-visiting-check__item::before {
  content: "";
  position: absolute;
  left: 1rem;
  top: 1rem;
  width: 1.25rem;
  height: 1.25rem;
  background-color: var(--color-main);
  border-radius: 50%;
}
@media screen and (min-width: 768px) {
  .p-visiting-check__item::before {
    left: 1.375rem;
    top: 1.25rem;
    width: 1.375rem;
    height: 1.375rem;
  }
}

.p-visiting-check__item::after {
  content: "";
  position: absolute;
  left: 1.375rem;
  top: 1.375rem;
  width: 0.5rem;
  height: 0.3125rem;
  border-left: 2px solid var(--color-white);
  border-bottom: 2px solid var(--color-white);
  transform: rotate(-45deg);
}
@media screen and (min-width: 768px) {
  .p-visiting-check__item::after {
    left: 1.78125rem;
    top: 1.6875rem;
  }
}

.p-visiting-check__item-title {
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-visiting-check__item-title {
    font-size: max(1rem, 10px);
  }
}

.p-visiting-check__item-text {
  margin-top: 0.375rem;
  font-size: max(0.75rem, 10px);
  font-weight: 500;
  line-height: 1.7;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-visiting-check__item-text {
    font-size: max(0.875rem, 10px);
  }
}

.p-visiting-check__note {
  margin-top: 1.125rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.7;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-visiting-check__note {
    margin-top: 1.5625rem;
    font-size: max(0.9375rem, 10px);
  }
}

.p-visiting-check__tel {
  margin-top: 1.25rem;
  background-color: var(--color-bg-cream);
  border-radius: 0.5rem;
  padding: 1.125rem;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-visiting-check__tel {
    margin-top: 1.875rem;
    padding: 1.5rem;
  }
}

.p-visiting-check__tel-lead {
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-visiting-check__tel-lead {
    font-size: max(0.9375rem, 10px);
  }
}

.p-visiting-check__tel-num {
  display: inline-block;
  margin-top: 0.375rem;
  font-family: var(--second-font-family);
  font-size: max(1.875rem, 10px);
  font-weight: 700;
  line-height: 1.2;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-visiting-check__tel-num {
    font-size: max(2.5rem, 10px);
  }
}

.p-visiting-check__tel-time {
  margin-top: 0.25rem;
  font-size: max(0.75rem, 10px);
  font-weight: 500;
  line-height: 1.5;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-visiting-check__tel-time {
    font-size: max(0.875rem, 10px);
  }
}

.p-visiting-cooling__sub-title {
  margin-top: 1.5rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-sub);
  border-left: 0.25rem solid var(--color-main);
  padding-left: 0.75rem;
}
@media screen and (min-width: 768px) {
  .p-visiting-cooling__sub-title {
    margin-top: 2.1875rem;
    font-size: max(1.25rem, 10px);
  }
}

.p-visiting-cooling__image {
  margin-top: 0.875rem;
  width: 100%;
  height: auto;
  background-color: var(--color-white);
  border-radius: 0.5rem;
  padding: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-visiting-cooling__image {
    margin-top: 1.25rem;
    max-width: 45rem;
    margin-inline: auto;
  }
}

.p-visiting-cooling__image img {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: cover;
     object-fit: cover;
}

.p-visiting-cooling__box {
  margin-top: 0.875rem;
  background-color: var(--color-white);
  border: 1px solid var(--color-border-line);
  border-radius: 0.5rem;
  padding: 1rem;
}
@media screen and (min-width: 768px) {
  .p-visiting-cooling__box {
    margin-top: 1.25rem;
    padding: 1.5rem 1.75rem;
  }
}

.p-visiting-cooling__box-title {
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-main);
}
@media screen and (min-width: 768px) {
  .p-visiting-cooling__box-title {
    font-size: max(1.125rem, 10px);
  }
}

.p-visiting-cooling__box-text {
  margin-top: 0.625rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.7;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-visiting-cooling__box-text {
    font-size: max(0.9375rem, 10px);
  }
}

.p-visiting-cooling__box-note {
  margin-top: 0.75rem;
  font-size: max(0.75rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-visiting-cooling__box-note {
    font-size: max(0.8125rem, 10px);
  }
}

.p-visiting-cooling__box-note a {
  color: var(--color-main);
  text-decoration: underline;
  font-weight: 700;
}

.p-visiting-cooling__text {
  margin-top: 0.875rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.7;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-visiting-cooling__text {
    margin-top: 1.25rem;
    font-size: max(0.9375rem, 10px);
  }
}

.p-visiting-cooling__grid {
  margin-top: 1rem;
}
@media screen and (min-width: 768px) {
  .p-visiting-cooling__grid {
    margin-top: 1.25rem;
    --c-grid-cols: 2;
  }
}

.p-visiting-cooling__card {
  gap: 0.5rem;
}
@media screen and (min-width: 768px) {
  .p-visiting-cooling__card {
    gap: 0.625rem;
  }
}

.p-visiting-cooling__card-cat {
  display: inline-block;
  background-color: var(--color-main);
  color: var(--color-white);
  font-size: max(0.6875rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  padding: 0.1875rem 0.625rem;
  border-radius: 0.1875rem;
  width: -moz-fit-content;
  width: fit-content;
}
@media screen and (min-width: 768px) {
  .p-visiting-cooling__card-cat {
    font-size: max(0.75rem, 10px);
  }
}

.p-visiting-cooling__card-name {
  margin-top: 0.5rem;
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-visiting-cooling__card-name {
    font-size: max(1rem, 10px);
  }
}

.p-visiting-cooling__card-desc {
  margin-top: 0.375rem;
  font-size: max(0.75rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-visiting-cooling__card-desc {
    font-size: max(0.8125rem, 10px);
  }
}

.p-visiting-cooling__card-link {
  display: inline-block;
  margin-top: 0.5rem;
  font-size: max(0.75rem, 10px);
  font-weight: 700;
  color: var(--color-main);
  text-decoration: underline;
}
@media screen and (min-width: 768px) {
  .p-visiting-cooling__card-link {
    font-size: max(0.8125rem, 10px);
  }
}

.p-visiting-cooling__note {
  margin-top: 1.125rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.7;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-visiting-cooling__note {
    margin-top: 1.5625rem;
    font-size: max(0.9375rem, 10px);
  }
}

.p-visiting-flow__banner-text {
  margin-top: 0.875rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.7;
  color: var(--color-sub);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-visiting-flow__banner-text {
    margin-top: 1.125rem;
    font-size: max(0.9375rem, 10px);
  }
}

.p-visiting-flow__sub-title {
  margin-top: 1.5rem;
  font-size: max(1rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-main);
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-visiting-flow__sub-title {
    margin-top: 2.1875rem;
    font-size: max(1.25rem, 10px);
  }
}

.p-visiting-flow__list {
  margin-top: 1rem;
  display: grid;
  gap: 1rem;
}
@media screen and (min-width: 768px) {
  .p-visiting-flow__list {
    margin-top: 1.25rem;
    gap: 1.25rem;
  }
}

.p-visiting-flow__step {
  display: grid;
  grid-template-columns: 2.5rem 1fr;
  gap: 0.75rem;
  align-items: start;
}
@media screen and (min-width: 768px) {
  .p-visiting-flow__step {
    grid-template-columns: 3rem 1fr;
    gap: 1.125rem;
  }
}

.p-visiting-flow__step-num {
  width: 2.5rem;
  height: 2.5rem;
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: var(--color-main);
  color: var(--color-white);
  border-radius: 50%;
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  font-family: var(--second-font-family);
  line-height: 1;
}
@media screen and (min-width: 768px) {
  .p-visiting-flow__step-num {
    width: 3rem;
    height: 3rem;
    font-size: max(1.375rem, 10px);
  }
}

.p-visiting-flow__step-title {
  font-size: max(0.9375rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-sub);
  padding-top: 0.5rem;
}
@media screen and (min-width: 768px) {
  .p-visiting-flow__step-title {
    font-size: max(1.125rem, 10px);
    padding-top: 0.625rem;
  }
}

.p-visiting-flow__step-text {
  margin-top: 0.375rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.7;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-visiting-flow__step-text {
    font-size: max(0.9375rem, 10px);
  }
}

/* ===== 詳細ヘッド（タイトル→タグ→コメント→画像→施工データ、PCも縦） ===== */
@media screen and (min-width: 768px) {
  .p-voice-single__inner {
    max-width: 50rem;
  }
}

.p-voice-single__title {
  font-size: max(1.375rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-voice-single__title {
    font-size: max(1.875rem, 10px);
  }
}

.p-voice-single__image {
  margin-top: 1.125rem;
}
@media screen and (min-width: 768px) {
  .p-voice-single__image {
    margin-top: 1.5rem;
  }
}

.p-voice-single__image img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 343/220;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-voice-single__image img {
    aspect-ratio: 760/440;
  }
}

.p-voice-single__tags {
  margin-top: 0.75rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  list-style: none;
}

/* 見た目は c-label */
/* ===== 施工データ（表） ===== */
.p-voice-single__data-table {
  margin-top: 1.25rem;
}
@media screen and (min-width: 768px) {
  .p-voice-single__data-table {
    margin-top: 1.75rem;
  }
}

.p-voice-single__data-row {
  display: grid;
  grid-template-columns: 5.625rem 1fr;
  gap: 0.625rem;
  padding-block: 0.75rem;
  border-bottom: 1px dashed var(--color-border-line);
  font-size: max(0.875rem, 10px);
  line-height: 1.7;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-voice-single__data-row {
    grid-template-columns: 6.875rem 1fr;
    font-size: max(0.9375rem, 10px);
  }
}

.p-voice-single__data-row:first-child {
  border-top: 1px dashed var(--color-border-line);
}

.p-voice-single__data-row dt {
  font-weight: 700;
  color: var(--color-main);
}

/* ===== コメント（クリーム地・左に差し色・左寄せ） ===== */
.p-voice-single__comment {
  margin-top: 1.125rem;
  background-color: var(--color-white);
  border-left: 4px solid var(--color-main);
  color: var(--color-sub);
  font-size: max(1.0625rem, 10px);
  font-weight: 700;
  line-height: 1.6;
  padding: 0.875rem 1.125rem;
  border-radius: 0 0.3125rem 0.3125rem 0;
}
@media screen and (min-width: 768px) {
  .p-voice-single__comment {
    margin-top: 1.5rem;
    font-size: max(1.375rem, 10px);
    padding: 1.125rem 1.625rem;
  }
}

/* ===== アンケート ===== */
.p-voice-single__survey-image {
  margin: 1.125rem auto 0;
  max-width: 43.75rem;
}
@media screen and (min-width: 768px) {
  .p-voice-single__survey-image {
    margin-top: 1.5625rem;
  }
}

.p-voice-single__survey-image img {
  display: block;
  width: 100%;
  height: auto;
  -o-object-fit: contain;
     object-fit: contain;
  max-width: 25rem;
  margin-inline: auto;
}
@media screen and (min-width: 768px) {
  .p-voice-single__survey-image img {
    max-width: 37.5rem;
  }
}

/* ===== RECOMMEND ===== */
.p-voice-recommend__list {
  margin-top: 1.25rem;
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 0.9375rem 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-voice-recommend__list {
    margin-top: 1.875rem;
    grid-template-columns: repeat(4, 1fr);
    gap: 1.25rem;
  }
}

.p-voice-recommend__item a {
  display: block;
  height: 100%;
  background-color: var(--color-white);
  border-radius: 0.3125rem;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.1);
  overflow: hidden;
}

@media (any-hover: hover) {
  .p-voice-recommend__item a:hover {
    opacity: 0.85;
  }
}
.p-voice-recommend__thumb img {
  display: block;
  width: 100%;
  height: auto;
  /* 元画像は動画のキャプチャ（16:9）。1/1 だと左右が大きく切れるため、
     一覧カード（.p-top-smile__thumb img）と同じ比率に揃える（2026-08-27） */
  aspect-ratio: 560/311;
  -o-object-fit: cover;
     object-fit: cover;
}

.p-voice-recommend__title {
  padding: 0.625rem;
  text-align: center;
  font-size: max(0.75rem, 10px);
  font-weight: 500;
  line-height: 1.5;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-voice-recommend__title {
    font-size: max(0.875rem, 10px);
  }
}

.p-voice-review {
  margin-top: 2.8125rem;
}
@media screen and (min-width: 768px) {
  .p-voice-review {
    margin-top: 3.75rem;
  }
}

/* ===== フィルタ（施工地域 / 工事内容） ===== */
.p-works-list__filters {
  display: grid;
  gap: 1.125rem;
}
@media screen and (min-width: 768px) {
  .p-works-list__filters {
    gap: 1.375rem;
  }
}

/* md以上は「見出し ╎ ピル群」の横並び */
@media screen and (min-width: 768px) {
  .p-works-list__filter {
    display: grid;
    grid-template-columns: auto 1fr;
    align-items: stretch;
    -moz-column-gap: 1.25rem;
         column-gap: 1.25rem;
  }
}

/* 見出しは「静」。ピルだけがオレンジ＝押せるもの、と役割を分ける */
.p-works-list__filter-head {
  font-size: max(0.875rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-sub);
  opacity: 0.7;
}
@media screen and (min-width: 768px) {
  .p-works-list__filter-head {
    font-size: max(0.9375rem, 10px);
    padding-block: 0.5rem;
    padding-right: 1.25rem;
    border-right: 1px solid var(--color-border-line);
    white-space: nowrap;
  }
}

.p-works-list__tabs {
  margin-top: 0.625rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  list-style: none;
}
@media screen and (min-width: 768px) {
  .p-works-list__tabs {
    margin-top: 0;
    gap: 0.625rem;
  }
}

.p-works-list__tab a {
  display: block;
  background-color: var(--color-white);
  border: 1px solid var(--color-border-line);
  border-radius: 1.875rem;
  padding: 0.375rem 1.125rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
  color: var(--color-sub);
  transition: background-color 0.3s ease, border-color 0.3s ease, color 0.3s ease;
}
@media screen and (min-width: 768px) {
  .p-works-list__tab a {
    font-size: max(0.875rem, 10px);
    padding: 0.5rem 1.5rem;
  }
}

.p-works-list__tab.is-current a,
.p-works-list__tab a:hover {
  opacity: 1;
  background-color: var(--color-main);
  border-color: var(--color-main);
  color: var(--color-white);
}

/* ===== 全幅リスト（1件ずつ縦積み） ===== */
.p-works-list__items {
  margin-top: 1.5rem;
  list-style: none;
}
@media screen and (min-width: 768px) {
  .p-works-list__items {
    margin-top: 1.875rem;
    max-width: 62.5rem;
    margin-inline: auto;
  }
}

/* 1件を枠で囲って境界を明確に */
.p-works-list__item {
  background-color: var(--color-white);
  border: 1px solid var(--color-border-line);
  border-radius: 0.625rem;
  box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0.06);
  padding: 1.125rem 1rem;
}
@media screen and (min-width: 768px) {
  .p-works-list__item {
    padding: 1.75rem 1.875rem;
  }
}

.p-works-list__item + .p-works-list__item {
  margin-top: 1.5rem;
}
@media screen and (min-width: 768px) {
  .p-works-list__item + .p-works-list__item {
    margin-top: 1.875rem;
  }
}

/* タイトル（セクションタイトルと同じ濃色の見出し・バンドなし） */
.p-works-list__item-title {
  color: var(--color-sub);
  font-size: max(1.125rem, 10px);
  font-weight: 700;
  line-height: 1.4;
}
@media screen and (min-width: 768px) {
  .p-works-list__item-title {
    font-size: max(1.5rem, 10px);
  }
}

/* タグ */
.p-works-list__item-tags {
  margin-top: 0.75rem;
  display: flex;
  flex-wrap: wrap;
  gap: 0.5rem;
  list-style: none;
}

/* 見た目は c-label / c-label--sub */
/* BEFORE / AFTER（before 小さめ・下揃え） */
.p-works-list__item-images {
  display: grid;
  grid-template-columns: 1fr;
  align-items: end;
  gap: 0.5rem;
  margin-top: 0.875rem;
}
@media screen and (min-width: 768px) {
  .p-works-list__item-images {
    margin-top: 1.125rem;
    gap: 0.875rem;
  }
}

.p-works-list__item-images:has(.p-works-list__ba--before) {
  grid-template-columns: 1fr 2fr;
}

.p-works-list__ba {
  position: relative;
  margin: 0;
  overflow: hidden;
  border-radius: 0.3125rem;
}

.p-works-list__ba img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16/11;
  -o-object-fit: cover;
     object-fit: cover;
  transition: transform 0.3s ease;
}

@media (any-hover: hover) {
  .p-works-list__item:hover .p-works-list__ba img {
    transform: scale(1.05);
  }
}
.p-works-list__ba-label {
  position: absolute;
  top: 0.375rem;
  left: 0.375rem;
  z-index: 1;
  color: var(--color-white);
  font-size: max(0.625rem, 10px);
  font-weight: 700;
  font-family: var(--second-font-family);
  line-height: 1;
  border-radius: 0.1875rem;
  padding: 0.25rem 0.5rem;
}
@media screen and (min-width: 768px) {
  .p-works-list__ba-label {
    top: 0.625rem;
    left: 0.625rem;
    font-size: max(0.75rem, 10px);
    padding: 0.3125rem 0.625rem;
  }
}

.p-works-list__ba--before .p-works-list__ba-label {
  background-color: var(--color-sub);
}

.p-works-list__ba--after .p-works-list__ba-label {
  background-color: var(--color-main);
}

/* 施工データ テーブル */
.p-works-list__item-data {
  margin-top: 0.875rem;
  border: 1px solid var(--color-border-line);
  border-bottom: 0;
}
@media screen and (min-width: 768px) {
  .p-works-list__item-data {
    margin-top: 1.25rem;
  }
}

.p-works-list__item-row {
  display: grid;
  grid-template-columns: 6rem 1fr;
  border-bottom: 1px solid var(--color-border-line);
}
@media screen and (min-width: 768px) {
  .p-works-list__item-row {
    grid-template-columns: 10rem 1fr;
  }
}

.p-works-list__item-row dt {
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  background-color: var(--color-bg-cream);
  color: var(--color-sub);
  font-size: max(0.8125rem, 10px);
  font-weight: 700;
  line-height: 1.5;
  padding: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-works-list__item-row dt {
    font-size: max(0.9375rem, 10px);
    padding: 0.875rem;
  }
}

.p-works-list__item-row dd {
  display: flex;
  align-items: center;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.6;
  color: var(--color-sub);
  padding: 0.625rem 0.875rem;
}
@media screen and (min-width: 768px) {
  .p-works-list__item-row dd {
    font-size: max(0.9375rem, 10px);
    padding: 0.875rem 1.25rem;
  }
}

/* 抜粋 */
.p-works-list__item-text {
  margin-top: 0.875rem;
  background-color: var(--color-bg-cream);
  border-radius: 0.3125rem;
  padding: 0.875rem 1rem;
  font-size: max(0.8125rem, 10px);
  font-weight: 500;
  line-height: 1.8;
  color: var(--color-sub);
}
@media screen and (min-width: 768px) {
  .p-works-list__item-text {
    margin-top: 1.25rem;
    font-size: max(0.875rem, 10px);
    padding: 1.125rem 1.5rem;
  }
}

/* 詳しくはコチラ（共通 c-button） */
.p-works-list__item-more {
  margin-top: 1rem;
  text-align: center;
}
@media screen and (min-width: 768px) {
  .p-works-list__item-more {
    margin-top: 1.5rem;
  }
}

.p-works-list__pagenavi {
  margin-top: 1.875rem;
}
@media screen and (min-width: 768px) {
  .p-works-list__pagenavi {
    margin-top: 2.8125rem;
  }
}

/* ===== 詳細：BEFORE / AFTER（before は小さめ・下揃え） ===== */
.p-works-single__ba {
  margin-top: 1.125rem;
  display: grid;
  grid-template-columns: 1fr 2fr;
  align-items: end;
  gap: 0.625rem;
}
@media screen and (min-width: 768px) {
  .p-works-single__ba {
    margin-top: 1.5rem;
    gap: 1rem;
  }
}

/* 画像が1枚だけのときは1カラム */
.p-works-single__ba:has(.p-works-single__ba-item:only-child) {
  grid-template-columns: 1fr;
}

.p-works-single__ba-item {
  position: relative;
  margin: 0;
}

.p-works-single__ba-item img {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 4/3;
  -o-object-fit: cover;
     object-fit: cover;
  border-radius: 0.625rem;
}

.p-works-single__ba-label {
  position: absolute;
  top: 0.5rem;
  left: 0.5rem;
  z-index: 1;
  color: var(--color-white);
  font-size: max(0.625rem, 10px);
  font-weight: 700;
  font-family: var(--second-font-family);
  line-height: 1;
  border-radius: 0.1875rem;
  padding: 0.25rem 0.5rem;
}
@media screen and (min-width: 768px) {
  .p-works-single__ba-label {
    top: 0.625rem;
    left: 0.625rem;
    font-size: max(0.8125rem, 10px);
    padding: 0.375rem 0.75rem;
  }
}

.p-works-single__ba-label--before {
  background-color: var(--color-sub);
}

.p-works-single__ba-label--after {
  background-color: var(--color-main);
}

[data-bg="100"] {
  background-color: #F9F1DE;
}

.js-fadein {
  opacity: 0;
  transform: translateY(2.5rem);
  transition: opacity 2s cubic-bezier(0.2, 0.6, 0.2, 1), transform 1s cubic-bezier(0.2, 0.6, 0.2, 1);
}

.js-fadein.is-scrolled {
  opacity: 1;
  transform: translateY(0);
}

.u-no-image {
  width: 100%;
  height: 100%;
  -o-object-fit: contain;
     object-fit: contain;
}

.u-pc {
  display: none;
}
@media screen and (min-width: 768px) {
  .u-pc {
    display: block;
  }
}

.u-sp {
  display: block;
}
@media screen and (min-width: 768px) {
  .u-sp {
    display: none;
  }
}
/*# sourceMappingURL=style.css.map */