/* SPの最終調整。PCの文字・余白・構成には適用しない。 */
.menu-link-description, .menu-link-arrow { display: none; }
.mobile-phrase { display: contents; }

@media (max-width: 760px) {
  html { scroll-padding-top: 96px; }
  body { line-break: strict; }
  .mobile-phrase { display: inline-block; }

  /* 本文とロゴの基準線を揃え、問い合わせを一度のタップで開けるようにする。 */
  .site-header { padding: 12px 12px 0; }
  .header-inner { height: 60px; gap: 8px; padding: 0 8px 0 12px; }
  .site-header .wordmark img { width: 104px; }
  .header-actions { display: flex; margin-left: auto; }
  .header-actions .recruit-link { display: none; }
  .header-actions .contact-link { gap: 8px; min-height: 44px; padding: 10px 14px; font-size: 11px; }
  .header-actions .contact-link .button-arrow { width: 12px; height: 12px; }
  .menu-toggle { margin-left: 0; }
  .ui-button { min-height: 52px; }
  .ui-button-external { min-height: 60px; }
  /* SPでも矢印の枠と実際のSVGを同じ寸法にし、中心を一致させる。 */
  .contact-arrow .button-arrow { width: 23px; height: 23px; }
  .page-next-arrow .button-arrow { width: 22px; height: 22px; }
  .news-row-arrow .button-arrow { width: 17px; height: 17px; }

  /* 短い画面でもFVの終わりが見える高さ。支給コピーは変形させない。 */
  .hero { min-height: 560px; height: 100svh; max-height: 1000px; }
  .hero .hero-content-lockup { bottom: 88px; }
  .intro-panel { margin-top: -88px; }
  .hero-bottom { min-height: 88px; padding-block: 20px; }
  .scroll-circle { width: 56px; height: 56px; margin-top: -60px; }
  .intro-panel .about-intro { padding-top: 48px; padding-bottom: 80px; }
  .intro-panel .statement-copy { font-size: clamp(17px, 4.6vw, 20px); line-height: 1.95; }
  .intro-panel .statement-copy p:first-child { margin-bottom: 40px; font-size: clamp(24px, 7vw, 36px); }
  .intro-panel .about-signature { margin-top: 64px; }
  .services { padding-top: 88px; padding-bottom: 88px; }
  .services-intro { font-size: clamp(22px, 6.1vw, 32px); line-height: 1.7; }
  .service-grid { gap: 28px; }
  .service-card { border-radius: 20px; box-shadow: none; }
  .service-card h3 { font-size: clamp(20px, 5.5vw, 28px); }
  .service-description { font-size: 15px; line-height: 1.95; text-wrap: pretty; }
  .service-tags { gap: 6px; margin-block: 20px 24px; }
  .service-tags li { padding: 6px 9px; }
  .service-card .service-link { width: 100%; justify-content: space-between; padding-inline: 20px; }

  /* 読む章は同じ左の基準線へ。日付は補助情報として本文と区別する。 */
  .news-section { padding-top: 72px; padding-bottom: 36px; }
  .news-heading, .note-heading { margin-bottom: 32px; text-align: left; }
  .section-title { font-size: clamp(44px, 12vw, 64px); }
  .news-heading > p, .note-heading > p { margin-top: 12px; font-size: 13px; }
  .news-row { row-gap: 10px; font-size: 15px; line-height: 1.8; }
  .news-date { color: var(--sub); font-size: 12px; }
  .news-more { margin-top: 32px; }
  .note-section { padding-top: 36px; padding-bottom: 80px; }
  .note-grid { gap: 32px; }
  .note-intro-title { font-size: clamp(21px, 5.7vw, 28px); line-height: 1.65; text-wrap: pretty; }
  .note-excerpt { font-size: 15px; line-height: 1.95; text-wrap: pretty; }
  .note-introduction .text-link { margin-top: 24px; }
  .note-meta { margin: 16px 0 10px; }
  .note-article-title { font-size: 20px; line-height: 1.7; text-wrap: pretty; }
  .note-card:not(.has-cursor-follow) .note-view-more { left: auto; top: auto; right: 12px; bottom: 12px; min-height: 36px; gap: 8px; padding: 9px 14px; font-size: 11px; opacity: 1; transform: none; }
  .note-card .note-view-more svg { width: 13px; height: 13px; }
  .note-card:not(.has-cursor-follow):focus-visible .note-view-more { transform: none; }

  /* 採用は写真と本文をひと続きにし、問い合わせは見出しと矢印を同じ行へ。 */
  .recruit-photo { aspect-ratio: 4 / 3; border-radius: 20px; }
  .recruit-content { padding-top: 32px; }
  .recruit-heading { font-size: clamp(44px, 12vw, 64px); }
  .recruit-content h3 { margin-top: 28px; font-size: clamp(26px, 7.2vw, 36px); line-height: 1.65; }
  .recruit-description { font-size: 15px; line-height: 1.95; text-wrap: pretty; }
  .recruit-description br { display: none; }
  .recruit-button { width: 100%; max-width: 360px; min-height: 60px; }
  .contact-panel { grid-template-columns: minmax(0, 1fr) 56px; gap: 28px 16px; min-height: 0; padding: 32px 24px; border-radius: 20px; }
  .contact-heading { grid-column: 1; grid-row: 1; }
  .contact-heading h2 { width: 6ch; font-size: clamp(36px, 10.6vw, 56px); line-height: 1.05; white-space: normal; }
  .contact-heading p { margin-top: 16px; font-size: 13px; }
  .contact-arrow { grid-column: 2; grid-row: 1; align-self: center; }
  .contact-copy { grid-column: 1 / -1; grid-row: 2; font-size: 14px; line-height: 1.95; text-wrap: pretty; }
  .contact-copy br { display: none; }
  .site-footer { padding-top: 64px; padding-bottom: max(24px, env(safe-area-inset-bottom)); }
  .footer-main { row-gap: 32px; }
  .footer-nav li > a { min-height: 48px; font-size: 15px; }
  .footer-nav .footer-service-link { min-height: 44px; padding-block: 8px; }
  .footer-bottom { margin-top: 36px; }

  /* 英語＋日本語で移動先を説明。短い画面でも閉じる操作を残す。 */
  #site-menu { height: 100dvh; max-height: 100dvh; padding: max(12px, env(safe-area-inset-top)) 24px max(28px, env(safe-area-inset-bottom)); }
  #site-menu[open] { animation: mobile-menu-in .3s cubic-bezier(.16, 1, .3, 1); }
  .menu-header { position: sticky; z-index: 2; top: 0; height: 60px; background: var(--paper); }
  .menu-header .wordmark { margin-left: 0; }
  .menu-header .wordmark img { width: 104px; }
  .menu-nav { margin-top: 24px; }
  .menu-nav > a { position: relative; display: grid; gap: 6px; padding: 20px 32px 20px 0; font-size: 28px; font-weight: 400; line-height: 1.25; }
  .menu-nav > a .link-label { width: fit-content; }
  .menu-link-description { display: block; color: var(--sub); font-size: 11px; line-height: 1.5; }
  .menu-nav > a .menu-link-arrow { position: absolute; display: block; right: 0; top: 50%; width: 20px; height: 20px; fill: none; stroke: currentColor; stroke-width: 1.5; transform: translateY(-50%); }
  .menu-actions { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin-top: 28px; }
  .menu-actions .ui-button { width: 100%; min-height: 52px; justify-content: space-between; padding-inline: 18px; }

  /* 下層のヒーローを短くし、本文へ自然につなぐ。 */
  .page-hero, .page-hero.has-hero-motion { min-height: 384px; }
  .page-hero-inner { padding-top: 120px; }
  .page-hero h1, .page-hero-title { font-size: clamp(44px, 13vw, 76px); }
  .breadcrumb { margin-top: 24px; font-size: 11px; }
  .breadcrumb li > a { display: inline-flex; align-items: center; min-height: 32px; }
  .breadcrumb li { display: inline-flex; align-items: center; }
  .page-section-heading { margin-bottom: 28px; }
  .page-section-heading p { font-size: 12px; }
  .page-section-heading h2 { font-size: 23px; }
  .page-next-title { font-size: clamp(40px, 12vw, 56px); }

  /* 会社情報は行を区切り、代表写真と氏名はコンパクトな一組へ。 */
  .company-overview { padding-top: 40px; }
  .company-facts { margin-block: 0; }
  .company-facts > div { grid-template-columns: 80px minmax(0, 1fr); gap: 16px; padding-block: 16px; border-bottom: 1px solid var(--line); font-size: 14px; line-height: 1.85; }
  .company-facts > div:first-child { padding-top: 0; }
  .company-facts > div:last-child { padding-bottom: 0; border-bottom: 0; }
  .company-body, .company-prose { font-size: 15px; line-height: 1.95; text-wrap: pretty; }
  .vision-catch { font-size: clamp(22px, 6.4vw, 34px); }
  .vision-english { font-size: 14px; }
  .mission-catch { font-size: clamp(18px, 5.2vw, 28px); }
  .company-values li { align-items: center; gap: 20px; }
  .value-letter { flex-basis: 36px; width: 36px; height: 36px; }
  .company-values h4 { font-size: 16px; line-height: 1.6; }
  .company-portrait { display: grid; grid-template-columns: minmax(0, 1.25fr) minmax(0, 1fr); align-items: end; gap: 24px; max-width: 480px; }
  .company-portrait img { border-radius: 16px; }
  .company-portrait figcaption { margin-top: 0; padding-bottom: 8px; }
  .company-portrait figcaption span { font-size: 11px; }
  .company-portrait figcaption strong { font-size: clamp(19px, 5.6vw, 24px); }
  .message-content { margin-top: 32px; }
  .message-content h3 { margin-bottom: 24px; font-size: clamp(21px, 5.9vw, 30px); line-height: 1.75; }
  .company-profile .company-prose { font-size: 13px; line-height: 1.95; }
  .history-list li { grid-template-columns: 80px minmax(0, 1fr); gap: 16px; font-size: 14px; }

  /* 英語＋日本語の見出しは左端を揃える。IP原画像とロゴの比率は維持。 */
  .service-introduction { padding-top: 48px; }
  .service-intro-catch { font-size: clamp(20px, 5.6vw, 32px); }
  .service-intro-description { font-size: 15px; line-height: 1.95; }
  .service-name { font-size: clamp(28px, 8vw, 36px); }
  .service-detail-heading h2 { margin-top: 8px; font-size: 14px; }
  .service-illustration { margin-bottom: 28px; }
  .service-detail-copy h3 { font-size: clamp(22px, 6vw, 32px); line-height: 1.75; }
  .service-prose { font-size: 15px; line-height: 1.95; text-wrap: pretty; }
  .service-capabilities dt { font-size: 15px; }
  .service-capabilities dd, .service-development p { font-size: 14px; line-height: 1.9; }
  .service-project-links { display: flex; gap: 10px; }
  .service-page .ui-button-external { width: fit-content; min-width: min(200px, 100%); min-height: 48px; gap: 16px; padding: 8px 8px 8px 18px; font-size: 13px; }
  .service-page .ui-button-external .button-external-icon { width: 32px; height: 32px; }

  /* 記事とフォームは読む文字を優先。入力文字16pxと大きな操作面を保つ。 */
  .news-index-content, .news-article-content, .contact-form-layout { padding-top: 48px; }
  .news-index-intro > p { font-size: 14px; }
  .news-index-list .news-row { font-size: 15px; column-gap: 16px; }
  .news-article-header time { font-size: 12px; }
  .news-article-header h1 { font-size: clamp(22px, 6vw, 30px); line-height: 1.65; }
  .news-article-body { font-size: 15px; line-height: 1.95; text-wrap: pretty; }
  .news-back .ui-button { width: 100%; justify-content: space-between; }
  .contact-introduction .page-section-heading h2 { font-size: clamp(22px, 6.2vw, 30px); }
  .contact-introduction > p { font-size: 15px; line-height: 1.95; }
  .contact-email { min-height: 44px; }
  .contact-form-column { margin-top: 40px; }
  .contact-steps { justify-content: space-between; gap: 20px; }
  .contact-field-hint { font-size: 12px; text-wrap: pretty; }
  .contact-consent label { min-height: 44px; padding-block: 8px; font-size: 13px; }
  .contact-confirm-button { min-height: 56px; }
  .policy-content { font-size: 15px; line-height: 1.95; text-wrap: pretty; }
  .policy-index { padding-block: 12px; }
  .policy-index ol { gap: 0; }
  .policy-index a { display: flex; align-items: center; min-height: 48px; padding-block: 12px; font-size: 13px; }
  .policy-section h2 { font-size: 19px; text-wrap: balance; }
  .policy-business > div { display: block; }
  .policy-business dt { font-size: 12px; }
  .policy-business dd { margin-top: 8px; }
  .policy-back .ui-button { width: 100%; justify-content: space-between; }
}

@keyframes mobile-menu-in {
  from { opacity: 0; transform: translateY(-8px); }
  to { opacity: 1; transform: none; }
}