/* =========================================================
   店舗・現場調査
   /field-research/store-field-survey/
========================================================= */

:root {
  --sfs-navy: #0f3154;
  --sfs-navy-deep: #092846;
  --sfs-blue: #1d5e8c;
  --sfs-blue-light: #78aeca;
  --sfs-light-blue: #edf4f8;
  --sfs-gray: #f5f6f7;
  --sfs-border: #d9dfe4;
  --sfs-text: #26333c;
  --sfs-muted: #65747f;
}


/* =========================================================
   UNDER MV
========================================================= */

.underMV.sfs-mv .under-title h1 {
  line-height: 1.45;
}


/* =========================================================
   BASE
========================================================= */

.sfs-page {
  color: var(--sfs-text);
}

.sfs-page *,
.sfs-page *::before,
.sfs-page *::after {
  box-sizing: border-box;
}

.sfs-section {
  padding: 90px 0;
}

.sfs-section--gray {
  background: var(--sfs-gray);
}

.sfs-section--navy {
  background:
    linear-gradient(
      135deg,
      var(--sfs-navy-deep) 0%,
      var(--sfs-navy) 100%
    );
  color: #fff;
}


/* =========================================================
   LEAD
========================================================= */

.sfs-lead {
  padding: 90px 0 80px;
  background:
    linear-gradient(
      135deg,
      var(--sfs-navy-deep) 0%,
      var(--sfs-navy) 100%
    );
  color: #fff;
}

.sfs-lead__eyebrow {
  margin-bottom: 20px;
  color: #b7d3e5;
  font-size: 15px;
  font-weight: 700;
  letter-spacing: 0.12em;
}

.sfs-lead__title {
  margin-bottom: 30px;
  color: #fff;
  font-size: 42px;
  font-weight: 700;
  line-height: 1.5;
  letter-spacing: 0.025em;
}

.sfs-lead__copy {
  max-width: 950px;
  margin-bottom: 34px;
  color: #fff;
  font-size: 21px;
  font-weight: 600;
  line-height: 1.95;
}

.sfs-lead__text {
  max-width: 950px;
}

.sfs-lead__text p {
  margin-top: 18px;
  color: rgba(255, 255, 255, 0.86);
  font-size: 17px;
  line-height: 2;
}


/* =========================================================
   BUTTONS
========================================================= */

.sfs-button-row {
  display: flex;
  flex-wrap: wrap;
  gap: 20px;
  margin-top: 43px;
}

.sfs-button-row .parts-button {
  margin: 0;
}

.sfs-button-secondary .arrow {
  background: #fff;
  border: 1px solid rgba(255, 255, 255, 0.7);
  color: var(--sfs-navy);
}


/* =========================================================
   PAGE NAV
========================================================= */

.sfs-nav {
  background: #fff;
  border-bottom: 1px solid var(--sfs-border);
}

.sfs-nav ul {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 0;
  padding: 17px 0;
  list-style: none;
}

.sfs-nav li {
  position: relative;
}

.sfs-nav li:not(:last-child)::after {
  content: "";
  position: absolute;
  top: 50%;
  right: 0;
  width: 1px;
  height: 15px;
  background: var(--sfs-border);
  transform: translateY(-50%);
}

.sfs-nav a {
  display: block;
  padding: 7px 13px;
  color: var(--sfs-navy);
  font-size: 12px;
  font-weight: 600;
  line-height: 1.5;
  text-decoration: none;
  white-space: nowrap;
}

.sfs-nav a:hover {
  color: var(--sfs-blue);
}


/* =========================================================
   HEADINGS
========================================================= */

.sfs-heading {
  margin-bottom: 35px;
}

.sfs-heading small {
  display: block;
  margin-bottom: 11px;
  color: var(--sfs-blue);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.sfs-heading h2 {
  color: var(--sfs-navy);
  font-size: 31px;
  font-weight: 700;
  line-height: 1.6;
  letter-spacing: 0.025em;
}

.sfs-heading--light small {
  color: #9fc7df;
}

.sfs-heading--light h2 {
  color: #fff;
}

.sfs-subheading {
  margin-top: 65px;
  margin-bottom: 25px;
}

.sfs-subheading small {
  display: block;
  margin-bottom: 8px;
  color: var(--sfs-blue);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.1em;
  text-transform: uppercase;
}

.sfs-subheading h3 {
  color: var(--sfs-navy);
  font-size: 24px;
  font-weight: 700;
}


/* =========================================================
   TEXT
========================================================= */

.sfs-text {
  max-width: 950px;
}

.sfs-text p {
  margin-top: 18px;
  font-size: 17px;
  line-height: 2;
}

.sfs-text p:first-child {
  margin-top: 0;
}

.sfs-text--light p {
  color: rgba(255, 255, 255, 0.87);
}

.sfs-emphasis {
  color: var(--sfs-navy);
  font-size: 22px !important;
  font-weight: 700;
  line-height: 1.8 !important;
}


/* =========================================================
   MESSAGE BOX
========================================================= */

.sfs-message-box {
  margin-top: 40px;
  padding: 28px 32px;
  border-left: 4px solid var(--sfs-blue);
  background: var(--sfs-light-blue);
}

.sfs-message-box span {
  display: block;
  margin-bottom: 9px;
  color: var(--sfs-blue);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.06em;
}

.sfs-message-box p {
  margin: 0;
  color: var(--sfs-navy);
  font-size: 16px;
  font-weight: 600;
  line-height: 1.9;
}


/* =========================================================
   覆面調査との比較
========================================================= */

.sfs-method-compare {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 24px;
  margin-top: 45px;
}

.sfs-method-compare__item {
  padding: 32px;
  border-top: 3px solid var(--sfs-blue);
  background: var(--sfs-gray);
}

.sfs-method-compare__item span {
  display: block;
  margin-bottom: 8px;
  color: var(--sfs-muted);
  font-size: 13px;
  font-weight: 600;
}

.sfs-method-compare__item h3 {
  margin-bottom: 14px;
  color: var(--sfs-navy);
  font-size: 23px;
  font-weight: 700;
}

.sfs-method-compare__item p {
  font-size: 15px;
  line-height: 1.9;
}


/* =========================================================
   FIELD GAP
========================================================= */

.sfs-status-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 1px;
  margin-top: 42px;
  border: 1px solid var(--sfs-border);
  background: var(--sfs-border);
}

.sfs-status-card {
  min-height: 195px;
  padding: 27px 23px;
  background: #fff;
}

.sfs-status-card--good {
  border-top: 4px solid var(--sfs-blue);
}

.sfs-status-card span {
  display: block;
  margin-bottom: 17px;
  color: var(--sfs-blue);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.sfs-status-card h3 {
  margin-bottom: 12px;
  color: var(--sfs-navy);
  font-size: 18px;
  font-weight: 700;
}

.sfs-status-card p {
  font-size: 14px;
  line-height: 1.8;
}


/* =========================================================
   TABLE
========================================================= */

.sfs-table-wrap {
  width: 100%;
  margin-top: 40px;
  overflow-x: auto;
  -webkit-overflow-scrolling: touch;
}

.sfs-table {
  width: 100%;
  border-collapse: collapse;
  background: #fff;
}

.sfs-table th,
.sfs-table td {
  padding: 19px 22px;
  border: 1px solid var(--sfs-border);
  vertical-align: top;
  text-align: left;
  font-size: 15px;
  line-height: 1.8;
}

.sfs-table thead th {
  background: var(--sfs-navy);
  color: #fff;
  font-weight: 700;
}

.sfs-table tbody td:first-child {
  width: 36%;
  color: var(--sfs-navy);
  font-weight: 600;
}

.sfs-table--fact td {
  width: 50% !important;
}


/* =========================================================
   OBSERVATION AREAS
========================================================= */

.sfs-area-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  margin-top: 40px;
  border-top: 1px solid var(--sfs-border);
  border-left: 1px solid var(--sfs-border);
}

.sfs-area {
  min-height: 185px;
  padding: 26px 23px;
  border-right: 1px solid var(--sfs-border);
  border-bottom: 1px solid var(--sfs-border);
  background: #fff;
}

.sfs-area span {
  display: block;
  margin-bottom: 14px;
  color: var(--sfs-blue);
  font-size: 12px;
  font-weight: 700;
}

.sfs-area h3 {
  margin-bottom: 10px;
  color: var(--sfs-navy);
  font-size: 17px;
  font-weight: 700;
}

.sfs-area p {
  font-size: 14px;
  line-height: 1.8;
}


/* =========================================================
   EVIDENCE
========================================================= */

.sfs-evidence-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  margin-top: 43px;
  background: rgba(255, 255, 255, 0.15);
}

.sfs-evidence-grid > div {
  min-height: 205px;
  padding: 27px 24px;
  background: rgba(7, 36, 64, 0.72);
}

.sfs-evidence-grid span {
  display: block;
  margin-bottom: 16px;
  color: #8fc0de;
  font-size: 12px;
  font-weight: 700;
}

.sfs-evidence-grid h3 {
  margin-bottom: 11px;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
}

.sfs-evidence-grid p {
  color: rgba(255, 255, 255, 0.78);
  font-size: 14px;
  line-height: 1.8;
}

.sfs-evidence-message {
  margin-top: 38px;
  padding: 28px 30px;
  border-left: 4px solid var(--sfs-blue-light);
  background: rgba(255, 255, 255, 0.08);
}

.sfs-evidence-message span {
  display: block;
  margin-bottom: 9px;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
}

.sfs-evidence-message p {
  color: rgba(255, 255, 255, 0.82);
  font-size: 15px;
  line-height: 1.9;
}


/* =========================================================
   MULTI LOCATION
========================================================= */

.sfs-standard-flow {
  display: grid;
  grid-template-columns: repeat(7, 1fr);
  gap: 1px;
  margin-top: 45px;
  border: 1px solid var(--sfs-border);
  background: var(--sfs-border);
}

.sfs-standard-flow > div {
  min-height: 160px;
  padding: 22px 15px;
  background: #fff;
}

.sfs-standard-flow span {
  display: block;
  margin-bottom: 15px;
  color: var(--sfs-blue);
  font-size: 11px;
  font-weight: 700;
}

.sfs-standard-flow h3 {
  margin-bottom: 8px;
  color: var(--sfs-navy);
  font-size: 15px;
  font-weight: 700;
  line-height: 1.5;
}

.sfs-standard-flow p {
  font-size: 12px;
  line-height: 1.7;
}


/* =========================================================
   DESIGN FLOW
========================================================= */

.sfs-design-flow {
  display: flex;
  align-items: stretch;
  margin-top: 40px;
}

.sfs-design-flow > div:not(.sfs-design-flow__arrow) {
  display: flex;
  flex: 1;
  flex-direction: column;
  justify-content: center;
  min-height: 110px;
  padding: 20px 15px;
  background: #fff;
  border: 1px solid var(--sfs-border);
  text-align: center;
}

.sfs-design-flow span {
  display: block;
  margin-bottom: 9px;
  color: var(--sfs-blue);
  font-size: 11px;
  font-weight: 700;
}

.sfs-design-flow strong {
  color: var(--sfs-navy);
  font-size: 16px;
  font-weight: 700;
}

.sfs-design-flow__arrow {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 45px;
  color: var(--sfs-blue);
  font-size: 20px;
}


/* =========================================================
   EXAMPLES
========================================================= */

.sfs-example-grid {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  gap: 22px;
  margin-top: 40px;
}

.sfs-example {
  padding: 30px;
  border-top: 3px solid var(--sfs-blue);
  background: #fff;
}

.sfs-example > span {
  display: block;
  margin-bottom: 12px;
  color: var(--sfs-blue);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: 0.07em;
}

.sfs-example h3 {
  margin-bottom: 12px;
  color: var(--sfs-navy);
  font-size: 18px;
  font-weight: 700;
  line-height: 1.6;
}

.sfs-example p {
  font-size: 14px;
  line-height: 1.85;
}


/* =========================================================
   OUTPUT
========================================================= */

.sfs-output-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  margin-top: 40px;
  border-top: 1px solid var(--sfs-border);
  border-left: 1px solid var(--sfs-border);
}

.sfs-output-grid > div {
  min-height: 195px;
  padding: 28px 25px;
  border-right: 1px solid var(--sfs-border);
  border-bottom: 1px solid var(--sfs-border);
}

.sfs-output-grid span {
  display: block;
  margin-bottom: 15px;
  color: var(--sfs-blue);
  font-size: 12px;
  font-weight: 700;
}

.sfs-output-grid h3 {
  margin-bottom: 10px;
  color: var(--sfs-navy);
  font-size: 18px;
  font-weight: 700;
}

.sfs-output-grid p {
  font-size: 14px;
  line-height: 1.8;
}


/* =========================================================
   PROCESS
========================================================= */

.sfs-process {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 43px;
}

.sfs-process > div {
  min-height: 210px;
  padding: 28px;
  border: 1px solid var(--sfs-border);
  background: #fff;
}

.sfs-process > div:last-child {
  grid-column: 2;
}

.sfs-process span {
  display: block;
  margin-bottom: 17px;
  color: var(--sfs-blue);
  font-size: 12px;
  font-weight: 700;
}

.sfs-process h3 {
  margin-bottom: 11px;
  color: var(--sfs-navy);
  font-size: 18px;
  font-weight: 700;
}

.sfs-process p {
  font-size: 14px;
  line-height: 1.85;
}


/* =========================================================
   QUALITY
========================================================= */

.sfs-quality-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 1px;
  margin-top: 42px;
  background: rgba(255, 255, 255, 0.15);
}

.sfs-quality-grid > div {
  min-height: 195px;
  padding: 27px 24px;
  background: rgba(7, 36, 64, 0.72);
}

.sfs-quality-grid span {
  display: block;
  margin-bottom: 14px;
  color: #8fc0de;
  font-size: 12px;
  font-weight: 700;
}

.sfs-quality-grid h3 {
  margin-bottom: 10px;
  color: #fff;
  font-size: 18px;
  font-weight: 700;
}

.sfs-quality-grid p {
  color: rgba(255, 255, 255, 0.77);
  font-size: 14px;
  line-height: 1.8;
}

.sfs-quality-message {
  margin-top: 38px;
  padding: 29px 30px;
  border-left: 4px solid var(--sfs-blue-light);
  background: rgba(255, 255, 255, 0.08);
}

.sfs-quality-message span {
  display: block;
  margin-bottom: 9px;
  color: #fff;
  font-size: 20px;
  font-weight: 700;
}

.sfs-quality-message p {
  color: rgba(255, 255, 255, 0.82);
  font-size: 15px;
  line-height: 1.9;
}


/* =========================================================
   RULES
========================================================= */

.sfs-rule-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 20px;
  margin-top: 42px;
}

.sfs-rule-grid > div {
  min-height: 195px;
  padding: 28px 25px;
  border-top: 3px solid var(--sfs-navy);
  background: var(--sfs-gray);
}

.sfs-rule-grid span {
  display: block;
  margin-bottom: 8px;
  color: var(--sfs-blue);
  font-size: 12px;
  font-weight: 700;
}

.sfs-rule-grid h3 {
  margin-bottom: 11px;
  color: var(--sfs-navy);
  font-size: 17px;
  font-weight: 700;
  line-height: 1.55;
}

.sfs-rule-grid p {
  font-size: 14px;
  line-height: 1.8;
}


/* =========================================================
   FAQ
========================================================= */

.sfs-faq {
  padding: 0;
  background: transparent;
}

.sfs-faq .qa__card-wrapper {
  margin-top: 32px;
}

.sfs-faq .qa__card {
  background: #fff;
}


/* =========================================================
   RELATED
========================================================= */

.sfs-related-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 18px;
  margin-top: 40px;
}

.sfs-related-card {
  display: flex;
  flex-direction: column;
  min-height: 255px;
  padding: 28px;
  border: 1px solid var(--sfs-border);
  background: #fff;
  color: var(--sfs-text);
  text-decoration: none;
  transition:
    transform 0.25s ease,
    box-shadow 0.25s ease;
}

.sfs-related-card:hover {
  transform: translateY(-3px);
  box-shadow: 0 10px 26px rgba(15, 49, 84, 0.08);
}

.sfs-related-card > span {
  display: block;
  margin-bottom: 18px;
  color: var(--sfs-blue);
  font-size: 12px;
  font-weight: 700;
}

.sfs-related-card h3 {
  margin-bottom: 13px;
  color: var(--sfs-navy);
  font-size: 19px;
  font-weight: 700;
}

.sfs-related-card p {
  margin-bottom: 22px;
  font-size: 14px;
  line-height: 1.8;
}

.sfs-related-card div {
  margin-top: auto;
  color: var(--sfs-blue);
  font-size: 13px;
  font-weight: 700;
}


/* =========================================================
   FINAL CTA
========================================================= */

.sfs-final-cta {
  padding: 90px 0;
  background:
    linear-gradient(
      135deg,
      var(--sfs-navy-deep) 0%,
      var(--sfs-navy) 100%
    );
  color: #fff;
  text-align: center;
}

.sfs-final-cta__eyebrow {
  margin-bottom: 15px;
  color: #9fc7df;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0.12em;
}

.sfs-final-cta h2 {
  margin-bottom: 24px;
  color: #fff;
  font-size: 32px;
  font-weight: 700;
  line-height: 1.65;
}

.sfs-final-cta > .inner > p:not(.sfs-final-cta__eyebrow):not(.sfs-final-cta__note) {
  max-width: 850px;
  margin: 0 auto;
  color: rgba(255, 255, 255, 0.84);
  font-size: 16px;
  line-height: 2;
}

.sfs-final-cta__buttons {
  justify-content: center;
}

.sfs-final-cta__note {
  margin-top: 27px;
  color: rgba(255, 255, 255, 0.64);
  font-size: 13px;
  line-height: 1.8;
}


/* =========================================================
   TABLET
========================================================= */

@media screen and (max-width: 1100px) {

  .sfs-nav a {
    padding-left: 9px;
    padding-right: 9px;
    font-size: 11px;
  }

  .sfs-standard-flow {
    grid-template-columns: repeat(4, 1fr);
  }

  .sfs-standard-flow > div:last-child {
    grid-column: 2;
  }

}


@media screen and (max-width: 1024px) {

  .sfs-section {
    padding: 75px 0;
  }

  .sfs-lead {
    padding: 75px 0 70px;
  }

  .sfs-lead__title {
    font-size: 34px;
  }

  .sfs-lead__copy {
    font-size: 19px;
  }

  .sfs-heading h2 {
    font-size: 27px;
  }

  .sfs-status-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .sfs-area-grid {
    grid-template-columns: repeat(2, 1fr);
  }

  .sfs-standard-flow {
    grid-template-columns: repeat(3, 1fr);
  }

  .sfs-standard-flow > div:last-child {
    grid-column: 2;
  }

}


/* =========================================================
   SMARTPHONE
========================================================= */

@media screen and (max-width: 768px) {

  .underMV.sfs-mv .under-title h1 {
    font-size: 26px;
    line-height: 1.5;
  }


  /* base */

  .sfs-section {
    padding: 58px 0;
  }

  .sfs-lead {
    padding: 58px 0 55px;
  }


  /* lead */

  .sfs-lead__eyebrow {
    margin-bottom: 14px;
    font-size: 12px;
  }

  .sfs-lead__title {
    margin-bottom: 22px;
    font-size: 27px;
    line-height: 1.6;
  }

  .sfs-lead__copy {
    margin-bottom: 25px;
    font-size: 17px;
    line-height: 1.9;
  }

  .sfs-lead__text p {
    font-size: 14px;
    line-height: 1.95;
  }


  /* buttons */

  .sfs-button-row {
    flex-direction: column;
    gap: 12px;
    margin-top: 32px;
  }

  .sfs-button-row .parts-button {
    width: 100%;
  }


  /* navigation */

  .sfs-nav {
    overflow-x: auto;
    -webkit-overflow-scrolling: touch;
  }

  .sfs-nav .inner {
    width: max-content;
    min-width: 100%;
  }

  .sfs-nav ul {
    flex-wrap: nowrap;
    justify-content: flex-start;
    padding: 11px 5px;
  }

  .sfs-nav a {
    padding: 7px 12px;
    font-size: 12px;
  }


  /* heading */

  .sfs-heading {
    margin-bottom: 24px;
  }

  .sfs-heading small {
    margin-bottom: 8px;
    font-size: 11px;
  }

  .sfs-heading h2 {
    font-size: 22px;
    line-height: 1.65;
    letter-spacing: 0.01em;
  }

  .sfs-subheading {
    margin-top: 45px;
  }

  .sfs-subheading h3 {
    font-size: 20px;
  }


  /* text */

  .sfs-text p {
    margin-top: 14px;
    font-size: 14px;
    line-height: 1.95;
  }

  .sfs-emphasis {
    font-size: 18px !important;
    line-height: 1.85 !important;
  }


  /* messages */

  .sfs-message-box {
    margin-top: 28px;
    padding: 21px 19px;
  }

  .sfs-message-box span {
    font-size: 11px;
  }

  .sfs-message-box p {
    font-size: 14px;
    line-height: 1.85;
  }


  /* method compare */

  .sfs-method-compare {
    grid-template-columns: 1fr;
    gap: 13px;
    margin-top: 28px;
  }

  .sfs-method-compare__item {
    padding: 23px 20px;
  }

  .sfs-method-compare__item h3 {
    font-size: 20px;
  }

  .sfs-method-compare__item p {
    font-size: 13px;
  }


  /* status */

  .sfs-status-grid {
    grid-template-columns: 1fr;
    margin-top: 28px;
  }

  .sfs-status-card {
    min-height: 0;
    padding: 22px 19px;
  }

  .sfs-status-card h3 {
    font-size: 17px;
  }

  .sfs-status-card p {
    font-size: 13px;
  }


  /* table */

  .sfs-table-wrap {
    margin-top: 28px;
  }

  .sfs-table {
    min-width: 700px;
  }

  .sfs-table th,
  .sfs-table td {
    padding: 16px 15px;
    font-size: 13px;
    line-height: 1.7;
  }


  /* areas */

  .sfs-area-grid {
    grid-template-columns: 1fr;
    margin-top: 28px;
  }

  .sfs-area {
    min-height: 0;
    padding: 21px 19px;
  }

  .sfs-area h3 {
    font-size: 16px;
  }

  .sfs-area p {
    font-size: 13px;
  }


  /* evidence */

  .sfs-evidence-grid {
    grid-template-columns: 1fr;
    margin-top: 28px;
  }

  .sfs-evidence-grid > div {
    min-height: 0;
    padding: 22px 20px;
  }

  .sfs-evidence-grid h3 {
    font-size: 17px;
  }

  .sfs-evidence-grid p {
    font-size: 13px;
  }

  .sfs-evidence-message {
    margin-top: 28px;
    padding: 21px 19px;
  }

  .sfs-evidence-message span {
    font-size: 17px;
  }

  .sfs-evidence-message p {
    font-size: 13px;
  }


  /* multi location */

  .sfs-standard-flow {
    grid-template-columns: 1fr;
    margin-top: 28px;
  }

  .sfs-standard-flow > div,
  .sfs-standard-flow > div:last-child {
    grid-column: auto;
    min-height: 0;
    padding: 20px 18px;
  }

  .sfs-standard-flow h3 {
    font-size: 16px;
  }

  .sfs-standard-flow p {
    font-size: 13px;
  }


  /* design flow */

  .sfs-design-flow {
    flex-direction: column;
    gap: 0;
    margin-top: 28px;
  }

  .sfs-design-flow > div:not(.sfs-design-flow__arrow) {
    min-height: 75px;
  }

  .sfs-design-flow__arrow {
    width: 100%;
    height: 30px;
    transform: rotate(90deg);
  }


  /* examples */

  .sfs-example-grid {
    grid-template-columns: 1fr;
    gap: 13px;
    margin-top: 28px;
  }

  .sfs-example {
    padding: 22px 19px;
  }

  .sfs-example h3 {
    font-size: 17px;
  }

  .sfs-example p {
    font-size: 13px;
  }


  /* output */

  .sfs-output-grid {
    grid-template-columns: 1fr;
    margin-top: 28px;
  }

  .sfs-output-grid > div {
    min-height: 0;
    padding: 22px 19px;
  }

  .sfs-output-grid h3 {
    font-size: 17px;
  }

  .sfs-output-grid p {
    font-size: 13px;
  }


  /* process */

  .sfs-process {
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 28px;
  }

  .sfs-process > div,
  .sfs-process > div:last-child {
    grid-column: auto;
    min-height: 0;
    padding: 22px 19px;
  }

  .sfs-process h3 {
    font-size: 17px;
  }

  .sfs-process p {
    font-size: 13px;
  }


  /* quality */

  .sfs-quality-grid {
    grid-template-columns: 1fr;
    margin-top: 28px;
  }

  .sfs-quality-grid > div {
    min-height: 0;
    padding: 22px 20px;
  }

  .sfs-quality-grid h3 {
    font-size: 17px;
  }

  .sfs-quality-grid p {
    font-size: 13px;
  }

  .sfs-quality-message {
    margin-top: 28px;
    padding: 22px 19px;
  }

  .sfs-quality-message span {
    font-size: 18px;
  }

  .sfs-quality-message p {
    font-size: 13px;
  }


  /* rules */

  .sfs-rule-grid {
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 28px;
  }

  .sfs-rule-grid > div {
    min-height: 0;
    padding: 21px 19px;
  }

  .sfs-rule-grid h3 {
    font-size: 16px;
  }

  .sfs-rule-grid p {
    font-size: 13px;
  }


  /* faq */

  .sfs-faq .qa__card-wrapper {
    margin-top: 24px;
  }


  /* related */

  .sfs-related-grid {
    grid-template-columns: 1fr;
    gap: 12px;
    margin-top: 28px;
  }

  .sfs-related-card {
    min-height: 0;
    padding: 22px 19px;
  }

  .sfs-related-card > span {
    margin-bottom: 11px;
  }

  .sfs-related-card h3 {
    font-size: 17px;
  }

  .sfs-related-card p {
    font-size: 13px;
  }


  /* final CTA */

  .sfs-final-cta {
    padding: 60px 0;
  }

  .sfs-final-cta h2 {
    margin-bottom: 20px;
    font-size: 23px;
    line-height: 1.7;
  }

  .sfs-final-cta > .inner > p:not(.sfs-final-cta__eyebrow):not(.sfs-final-cta__note) {
    font-size: 14px;
    line-height: 1.95;
  }

  .sfs-final-cta__note {
    margin-top: 22px;
    font-size: 12px;
  }

}


/* =========================================================
   SMALL SMARTPHONE
========================================================= */

@media screen and (max-width: 390px) {

  .underMV.sfs-mv .under-title h1 {
    font-size: 23px;
  }

  .sfs-lead__title {
    font-size: 25px;
  }

  .sfs-heading h2 {
    font-size: 20px;
  }

  .sfs-final-cta h2 {
    font-size: 21px;
  }

}
/* =========================================================
   店舗・現場調査｜スマホ見出し微調整
========================================================= */

@media screen and (max-width: 768px) {

  .sfs-heading__about br {
    display: none;
  }

}