/* 広いPC */
@media (min-width: 1680px) {
  :root {
    --space-nav-gap: 42px;
  }
}

/* タブレット */
@media (max-width: 1199px) {
  :root {
    --inner-padding: var(--inner-padding-tablet);
    --space-section: 120px;
    --space-header-pad-top: var(--space-m);
    --space-header-pad-bottom: var(--space-s);
    --space-header-scroll-pad: calc((var(--space-m) + var(--space-s)) / 2);
    --space-footer-nav-x: var(--space-s);
    --size-top-w: var(--content-width);
    --size-mv: 600px;
    --size-mv-top: 600px;
    --space-top-mv-copy-y: 0px;
    --space-faq-mv-copy-y: 0px;
    --space-top-about-t: calc(var(--space-section) / 2);
    --space-top-more-b: var(--space-section);
    --space-top-support-t: calc(var(--space-section) / 2);
    --space-top-support-gap: 0px;
    --space-top-band-b: 85px;
    --space-top-plan-buttons: 21px;
    --space-top-plans-b: 85px;
    --space-top-faq-heading: 59px;
    --space-top-support-b: calc(var(--space-section) / 2);
    --space-top-news-t: calc(var(--space-section) / 2);
    --space-top-news-b: 0px;
    --space-top-news-x: var(--space-m);
    --space-top-news-gap: var(--space-m);
    --space-top-vertical-gap: var(--space-m);
    --space-top-support-x: var(--space-m);
    --font-top-btn: min(22px, 2.35vw);
    --space-btn-chevron-r: min(21px, 1.43vw);
    --font-vertical: 32px;
    --lh-vertical: 58px;
    --size-vertical-w: 160px;
    --size-vertical-h: 450px;
    --space-vertical: 80px;
    --size-points-photo-w: 280px;
    --size-check-photo-w: 290px;
    --space-points-x: 30px;
    --size-step-icon: 160px;
    --size-concept-card-image-w: min(320px, 38vw);
    --size-concept-card-image-h: auto;
    --space-concept-card-x: min(40px, 5vw);
    --space-concept-card-y: 64px;
    --space-about-office-label: 40px;
    --space-about-office-top: 96px;
    --space-about-office-bottom: var(--space-m);
    --space-about-profile-x: 7.76%;
    --size-about-profile-image-w: 56.9%;
    --size-about-profile-text-w: 29%;
    --space-about-map-bottom: 80px;
    --space-illust-x: var(--space-card-x);
    --space-circle-x: var(--space-card-x);
    --space-flow-gap: var(--space-stack);
    --space-flow-pad-x: var(--space-s);
    --size-flow-arrow-w: 24px;
    --size-flow-arrow-h: 35px;
  }

  /* TOP */
  body.home .fv-copy p,
  body.home .fv-copy::before {
    font-size: min(4.4vw, calc((100vw - 100px) / 21));
    line-height: 1.7;
  }

  .top-about .card-box-pair-wrapper,
  .top-support .card-box-pair-wrapper {
    flex-direction: column;
    align-items: stretch;
  }

  .top-about .card-box-pair-wrapper .card-box:first-child {
    flex: none;
    width: 100%;
    height: auto;
    aspect-ratio: var(--num-top-about-photo-w) / var(--num-top-about-photo-h);
    margin-bottom: var(--space-m);
  }

  .top-about .card-box-pair-wrapper .card-box:last-child {
    flex: none;
  }

  .top-about .card-box-pair-wrapper .card-content {
    justify-content: center;
  }

  .top-support .card-box-pair-wrapper .card-box:last-child {
    flex: none;
    width: 100%;
    height: auto;
    aspect-ratio: var(--num-top-support-photo-w) / var(--num-top-support-photo-h);
    order: -1;
  }

  .top-support .card-box-pair-wrapper .card-box:first-child {
    flex: none;
  }

  /* ヘッダー */
  .global-header.menu-type3 .inner,
  .global-header.menu-type3.scrolled .inner,
  .global-header.menu-type3.scrolled.active-scroll .inner {
    min-height: 0;
    padding: var(--space-header-pad-top) var(--inner-padding-tablet) var(--space-header-pad-bottom) !important;
  }

  .global-header.menu-type3 .site-logo {
    width: auto;
    max-width: var(--size-logo-max-w-tablet);
    height: var(--size-logo-h-tablet);
  }

  .global-header.menu-type3 .menu-toggle {
    order: 4;
    margin-left: auto;
  }
}

/* スマートフォン */
@media (max-width: 767px) {
  :root {
    --inner-padding: var(--inner-padding-sp);
    --space-section: 80px;
    --font-cta-size: 26px;
    --lh-cta: 1.7;
    --font-cta-lead: 18px;
    --lh-cta-lead: 32px;
    --space-cta-top: var(--space-stack);
    --space-cta-bottom: var(--space-stack);
    --space-cta-copy-y: 0px;
    --space-header-pad-top: var(--space-s);
    --space-header-pad-bottom: var(--space-s);
    --space-header-scroll-pad: var(--space-s);
    --card-width-2: 100%;
    --card-width-3: 100%;
    --slider-basis: 100%;
    --static-direction: column;
    --size-mv: 400px;
    --size-mv-top: 420px;
    --font-top-vertical: 22px;
    --lh-top-vertical: 44px;
    --space-top-vertical-gap: var(--space-s);
    --size-top-pill-w: 48px;
    --size-top-pill-h: 150px;
    --space-top-news-x: var(--space-s);
    --space-top-news-gap: var(--space-s);
    --space-top-more-b: var(--space-section);
    --font-top-btn: 18px;
    --space-btn-chevron-r: 21px;
    --lh-page-title: 40px;
    --font-heading-size: 24px;
    --lh-heading: 40px;
    --font-vertical: 20px;
    --lh-vertical: 40px;
    --size-vertical-w: 110px;
    --size-vertical-h: 350px;
    --space-vertical: 48px;
    --points-photo-position: static;
    --points-side: 0;
    --size-points-photo-h: auto;
    --size-points-photo-w: 100%;
    --size-check-photo-w: 240px;
    --space-check-photo-r: 0px;
    --space-check-row: calc(var(--space-s) / 2);
    --size-check-photo-h: auto;
    --font-lead: 18px;
    --lh-lead: 32px;
    --space-points-photo-gap: var(--space-m);
    --size-band-h: 56px;
    --font-band: 20px;
    --lh-band: 30px;
    --font-card-heading: 20px;
    --lh-card-lead-m: 30px;
    --direction-step: column;
    --size-step-icon: 100%;
    --space-step-l: var(--space-s);
    --space-step-r: var(--space-s);
    --space-step-y: var(--space-s);
    --font-step-title: 20px;
    --lh-step-title: 30px;
    --space-note-x: var(--space-s);
    --size-table-label-w: 78px;
    --space-table-y: var(--space-s);
    --space-table-x: 8px;
    --font-table: 14px;
    --lh-table: 26px;
    --lh-note-label: var(--lh-table);
    --space-note-row-x: calc(var(--space-stack) / 2);
    --font-body-large: 18px;
    --font-plan-step: var(--font-table);
    --space-table-label-x: 0px;
    --size-table-row-plain: 0px;
    --space-note-before: 80px;
    --space-note-after: 40px;
    --space-note-band-before: 0px;
    --size-note-label-max-w: none;
    --space-band-after-fill: var(--space-stack);
    --space-band-after-flush: var(--space-stack);
    --space-plan-step-gap: var(--space-s);
    --space-plan-step-label-x: 0px;
    --font-plan-group: 12px;
    --font-plan-mark: 13px;
    --space-plan-step-note-after: calc(var(--space-section) / 2);
    --space-plan-step-row: var(--space-s);
    --size-faq-h: 80px;
    --font-faq-q: 18px;
    --font-faq-mark: 20px;
    --space-faq-x: var(--space-s);
    --space-faq-item: var(--space-m);
    --space-faq-answer-b: 0px;
    --space-footer-top: var(--space-stack);
    --space-footer-bottom: var(--space-stack);
    --font-intro: 17px;
    --lh-intro: 32px;
    --space-intro-after: var(--space-stack);
    --direction-flow: column;
    --space-flow-bottom: var(--space-stack);
    --size-flow-card-h: auto;
    --size-concept-card-image-w: 100%;
    --size-concept-card-image-h: auto;
    --font-concept-card-title: 24px;
    --space-concept-card-x: 0px;
    --space-concept-card-y: var(--space-section);
    --space-about-message-label: 24px;
    --space-about-office-label: 24px;
    --space-about-message-top: 90px;
    --lh-about-message-text: var(--lh-body-tight);
    --space-about-profile-x: var(--space-m);
    --size-about-profile-image-w: 100%;
    --size-about-profile-text-w: 100%;
    --space-about-profile-text-x: var(--inner-padding-sp);
    --font-about-profile-name: 28px;
    --space-about-history-x: var(--space-m);
    --size-about-history-card-w: 100%;
    --size-about-history-card-h: auto;
    --space-card-pad-s: var(--space-m) var(--space-s);
    --space-about-office-top: var(--space-section);
    --space-about-office-bottom: var(--space-s);
    --font-about-office-title: var(--font-about-sub);
    --lh-about-office-title: var(--lh-body-tight);
    --space-about-map-top: var(--space-m);
    --space-about-map-bottom: var(--space-section);
    --space-flow-pad-x: var(--space-stack);
    --font-line: 20px;
    --lh-line: 28px;
    --size-line-icon-w: 44px;
    --size-line-banner-h: 64px;
    --space-line-pad-x: var(--space-s);
    --font-form: 16px;
    --font-form-note: 14px;
    --font-form-button: 22px;
    --font-form-privacy: 16px;
    --lh-form-label: 24px;
    --lh-form-option: 40px;
    --size-form-textarea-h: 240px;
    --space-form-field: 32px;
    --space-form-inline: var(--space-s);
    --space-form-referrer-before: 0px;
    --space-form-referrer-after: 0px;
  }

  .c-note--label .card-content {
    grid-template-columns: minmax(0, 1fr);
    gap: var(--space-s);
  }

  .plan-comparison,
  .plan-fees {
    --space-table-label-x: 10px;
  }

  .plan-comparison-wrap,
  .plan-fees-wrap {
    margin-inline: calc(-1 * var(--inner-padding-sp));
    width: calc(100% + (var(--inner-padding-sp) * 2));
    padding-inline: var(--inner-padding-sp);
  }

  /* 料金比較表：プランのタブ切り替え（JSが .plan-tabs と .is-tabbed を付ける） */
  .plan-tabs {
    display: flex;
    gap: var(--space-plan-gap);
  }

  .plan-tabs__tab {
    flex: 1 1 0;
    box-sizing: border-box;
    min-width: 0;
    min-height: var(--size-plan-tab-h);
    padding: 0;
    border: var(--border-2) solid var(--plan-tab-color);
    border-radius: 0 var(--radius-plan-column) 0 0;
    background: var(--color-white);
    color: var(--plan-tab-color);
    font-family: var(--font-heading);
    font-size: var(--font-table);
    font-weight: var(--font-heading-weight);
    line-height: 1.3;
    cursor: pointer;
  }

  .plan-tabs__tab--start { --plan-tab-color: var(--main-color); }
  .plan-tabs__tab--growth { --plan-tab-color: var(--color-plan-grow); }
  .plan-tabs__tab--scale { --plan-tab-color: var(--sub-color); }

  .plan-tabs__tab[aria-selected="true"] {
    background: var(--plan-tab-color);
    color: var(--color-white);
  }

  .plan-tabs__tab:focus-visible,
  .plan-comparison-wrap.is-tabbed:focus-visible {
    outline: var(--focus-ring);
    outline-offset: var(--focus-offset);
  }

  .plan-comparison-wrap.is-tabbed {
    margin-inline: 0;
    width: 100%;
    padding-inline: 0;
    overflow-x: visible;
  }

  .plan-comparison-note {
    text-align: left;
  }

  .plan-comparison-note__item {
    display: inline-block;
  }

  .is-tabbed .plan-comparison .plan-row-income td {
    font-size: var(--font-plan-group);
  }

  .is-tabbed .plan-comparison {
    --plan-col-cat: 22;
    --plan-col-label: 40;
    --plan-col-value: 38;
    --space-plan-table-x: 4px;
    min-width: 0;
  }

  .is-tabbed .plan-comparison tbody .plan-row-income th {
    background: var(--color-plan-table-head);
  }

  .is-tabbed .plan-comparison .plan-row-income + tr > .plan-row-group {
    border-top-left-radius: 0;
  }

  .is-tabbed .plan-comparison .plan-row-meeting > .plan-row-group {
    border-bottom-left-radius: var(--radius-plan-column);
  }

  .is-tabbed .plan-comparison tbody tr:last-child > td {
    border-bottom-right-radius: var(--radius-plan-column);
  }

  .is-tabbed .plan-comparison thead th:first-child,
  .is-tabbed .plan-comparison tbody td {
    display: none;
  }

  .is-tabbed .plan-comparison thead th.plan-column {
    display: none;
    width: auto;
    border-left: 0;
    border-radius: 0;
  }

  .is-tabbed .plan-comparison .plan-column__name {
    display: none;
  }

  .is-tabbed[data-plan="start"] .plan-comparison thead th.plan-column--start,
  .is-tabbed[data-plan="growth"] .plan-comparison thead th.plan-column--growth,
  .is-tabbed[data-plan="scale"] .plan-comparison thead th.plan-column--scale,
  .is-tabbed[data-plan="start"] .plan-comparison tbody td:nth-of-type(1),
  .is-tabbed[data-plan="growth"] .plan-comparison tbody td:nth-of-type(2),
  .is-tabbed[data-plan="scale"] .plan-comparison tbody td:nth-of-type(3) {
    display: table-cell;
  }

  /* TOP */
  body.home .fv-copy p,
  body.home .fv-copy::before {
    font-size: var(--font-size-sp2);
    line-height: 1.7;
    word-break: auto-phrase;
    text-wrap: balance;
  }

  .top-news .news-list .news-item a.news-title {
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    gap: 0;
    height: auto;
    padding-block: var(--space-s);
    line-height: var(--lh-body-tight);
  }

  /* ヘッダー */
  body:not(.header-light) .global-header.menu-type3:not(.scrolled) {
    background: transparent;
  }

  .global-header.menu-type3 .inner,
  .global-header.menu-type3.scrolled .inner,
  .global-header.menu-type3.scrolled.active-scroll .inner {
    display: flex;
    flex-wrap: nowrap;
    width: 100%;
    padding: var(--space-header-pad-top) var(--inner-padding-sp) var(--space-header-pad-bottom) !important;
  }

  .global-header.menu-type3 .site-logo {
    position: static;
    flex: 1 1 auto;
    max-width: calc(100% - var(--size-line) - var(--space-s));
    overflow: hidden;
  }

  .global-header.menu-type3 .menu-toggle {
    position: static;
    top: auto;
    right: auto;
    transform: none;
    flex: 0 0 auto;
    align-self: center;
    margin: 0 0 0 auto;
  }

  /* 下層MV */
  .fv-copy .fv-title {
    font-size: var(--font-page-title-sp);
  }

  .c-steps .campaign-card .card-image {
    margin-block: var(--space-s);
  }

  /* お問い合わせ */
  .c-flow .card-box + .card-box::before {
    top: auto;
    right: auto;
    bottom: 100%;
    left: 50%;
    margin: 0 0 calc((var(--space-stack) - var(--size-flow-arrow-h)) / 2);
    transform: translateX(-50%) rotate(90deg);
  }

  .c-flow .card-box-group-wrapper.has-3 .card-box {
    width: 100%;
  }

  .c-form__referrer {
    position: static;
    margin-top: var(--space-form-label);
  }

  /* フッター */
  .site-footer .footer-menu-list {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: var(--space-s) 0;
  }

  .site-footer .footer-menu-list li {
    width: auto;
  }

  .site-footer .footer-menu-list li:last-child {
    grid-column: 1 / -1;
  }

  .site-footer .footer-menu-list li::after {
    content: none;
  }

  /* ページ専用：サービス一覧・選ばれる理由・事務所紹介 */
  .site-main .service-cards .card-box-group-wrapper {
    row-gap: var(--space-section);
  }

  .site-main .concept-cards .card-box-group-wrapper.has-3 .card-box {
    grid-template-columns: minmax(0, 1fr);
    row-gap: var(--space-s);
  }

  .site-main .concept-cards .card-image {
    grid-column: 1;
    grid-row: 2;
  }

  .site-main .about-message .section-inner,
  .site-main .about-office-heading .section-inner {
    padding-inline: var(--inner-padding-sp);
  }
}

/* 動きを抑える設定 */
@media (prefers-reduced-motion: reduce) {
  :root {
    --motion: 0ms;
    --motion-open: 0ms;
    --btn-hover-x: 0px;
  }
}