@charset "utf-8";
html, body { margin: 0; padding: 0; background: #FFFFFF; }
  body { font-family: "Zen Kaku Gothic New", "游ゴシック体", "Yu Gothic", "ヒラギノ角ゴ ProN", sans-serif; color: #000000; line-height: 1.9; font-feature-settings: "palt" 1; -webkit-font-smoothing: antialiased; }
  * { box-sizing: border-box; }
  a { color: #6320E6; text-decoration: none; }
  a:hover { color: #000000; }
  :focus-visible { outline: 2px solid #6320E6; outline-offset: 3px; }
  @keyframes fxn-cue { 0%, 100% { opacity: .25 } 50% { opacity: 1 } }
  @media (max-width: 1180px) { [data-nav] { display: none !important } }
  @media (max-width: 860px) { [data-flow] { grid-template-columns: 1fr 1fr !important } [data-flow-line] { display: none !important } [data-why], [data-works], [data-team] { grid-template-columns: 1fr !important } [data-co], [data-cta] { grid-template-columns: 1fr !important } [data-cta-dl] { margin-top: 0 !important } [data-ai-row] { grid-template-columns: 44px 1fr !important } [data-ai-p] { grid-column: 2 !important } [data-news] { grid-template-columns: 1fr !important; gap: 6px !important } }
  @media (prefers-reduced-motion: reduce) { * { animation: none !important; transition: none !important } }
@media (max-width: 1180px) { #nav-toggle { display: grid !important; order: 2; margin-left: 0 !important } header .x2 { order: 1 } }
#nav-drawer.is-open { display: flex !important }
@media (hover: hover) { #nav-toggle:hover span, #nav-toggle:hover span span { border-color: #6320E6 !important; background: #6320E6 !important } }
#nav-toggle[aria-expanded="true"] { background: #6320E6 !important }
#nav-toggle[aria-expanded="true"] span, #nav-toggle[aria-expanded="true"] span span { border-color: #FFFFFF !important; background: #FFFFFF !important }
input:focus, textarea:focus { outline: 3px solid #000000; outline-offset: 2px }
.x1:hover { color: #6320E6 !important }
.x2:hover { background: #FFFFFF !important; color: #6320E6 !important }
.x3:hover { background: #000000 !important; border-color: #000000 !important; color: #FFFFFF !important }
.x4:hover { background: #FFFFFF !important; border-color: #FFFFFF !important; color: #6320E6 !important }
.x5:focus { border-color: #000000 !important }
.x6:hover { background: #FFFFFF !important; color: #6320E6 !important; border-color: #FFFFFF !important }
.x7:hover { color: #000000 !important }

@media (max-width: 900px) {
  #top { padding-bottom: 56px !important }
  [data-scroll-cue] { position: static !important; left: auto !important; bottom: auto !important; transform: none !important; margin: 30px auto 0 !important }
}
@media (max-width: 520px) { header .x2 { padding: 10px 16px !important; font-size: 12px !important } }

/* 縦の狭いノートPC画面でも、ヒーローとスクロール矢印が1画面に収まるようにする */
@media (min-width: 901px) and (max-height: 980px) {
  #top { padding-top: 52px !important; padding-bottom: 86px !important }
  #top h1 { font-size: clamp(32px, 4.4vw, 62px) !important }
  #top > div { gap: 22px !important }
  [data-scroll-cue] { bottom: 22px !important }
}

/* ヒーローを常に「画面ぴったり1枚」にする */
#top > div { width: 100% }
#top {
  min-height: calc(100vh - var(--header-h, 70px));
  min-height: calc(100svh - var(--header-h, 70px));
  display: flex;
  flex-direction: column;
  justify-content: center;
}

#faq summary::-webkit-details-marker { display: none }
#faq summary::marker { content: "" }
#faq details[open] summary span:last-child { color: #6320E6 }
@media (hover: hover) { #faq summary:hover span:last-child { color: #6320E6 } }

/* 事例セクションの本文を15pxに（比較検証用） */
#works [data-work-dl] { grid-template-columns: 76px 1fr !important; gap: 14px 16px !important }
#works [data-work-dl] dt { font-size: 12.5px !important; padding-top: 5px !important }
#works [data-work-dl] dd { font-size: 15px !important; line-height: 1.9 !important }

/* 本文サイズの引き上げ（全セクション） */
#approach article { min-height: 0 !important }
#approach article p { font-size: 14px !important; line-height: 1.9 !important }
#approach > div > div:first-child p { font-size: 16.5px !important }
#approach [data-flow] h3 { font-size: 20px !important }
#approach [data-flow] p { font-size: 14.5px !important }

#ai > div > p { font-size: 16.5px !important }
#ai [data-ai-row] h3 { font-size: 18px !important }
#ai [data-ai-p] { font-size: 15.5px !important; line-height: 1.9 !important }

#why article h3 { font-size: 19px !important }
#why article p { font-size: 15px !important; line-height: 1.9 !important }

#team > div > p { font-size: 16.5px !important }
#team article p { font-size: 15px !important; line-height: 1.9 !important }
#team article > div { font-size: 12.5px !important }

#news { font-size: 15px }
#company dl { font-size: 15px !important }
#company dl dt { font-size: 12.5px !important }

#faq [open] p, #faq details p { font-size: 15px !important; line-height: 1.9 !important; max-width: 45em !important }
#faq summary span:last-child { font-size: clamp(16px, 1.5vw, 18.5px) !important }

#contact form label { font-size: 13.5px !important }
#contact > div p { font-size: 15.5px !important }

/* サービスカードは常に4列。カード内の高さも揃える */
#approach > div > div:last-child { grid-template-columns: repeat(4, 1fr) !important; align-items: stretch !important }
#approach article { display: flex !important; flex-direction: column !important }
#approach article > div:last-child { margin-top: auto !important }
@media (max-width: 1000px) { #approach > div > div:last-child { grid-template-columns: repeat(2, 1fr) !important } }
@media (max-width: 560px) { #approach > div > div:last-child { grid-template-columns: 1fr !important } }

/* 選ばれる理由・メンバー・事例：カード高さを揃える */
#why > div > div:last-child, #team > div > div:last-child, #works > div > div:last-child { align-items: stretch !important }
#why article, #team article, #works article { height: 100% !important }
#why article h3 { min-height: 3.2em !important }
#works [data-work-dl] { flex: 1 !important }

/* 最終調整：本文まわりの下限を14px、注記を13pxに */
#news [data-news] > div:last-child { font-size: 15px !important }
#news [data-news] em { font-size: 13px !important; margin-top: 4px !important }
#news [data-news] > div:first-child { font-size: 12.5px !important }
#works article > div:first-child span:last-child { font-size: 12px !important }
#works article span[style*="border: 1.5px"], #works article span[style*="border:1.5px"] { font-size: 12.5px !important }
#why article p:nth-of-type(2), #why article > div:last-child { font-size: 14px !important }
#team article > div:nth-of-type(2) { font-size: 13px !important }
#approach [data-flow] p { font-size: 14.5px !important }
#contact form label span { font-size: 12px !important }
#contact [data-cta-dl] dt { font-size: 12px !important }
#contact [data-cta-dl] dd { font-size: 15.5px !important }
footer, footer a, footer div { font-size: 13.5px !important }

/* 小さすぎる箇所の追加調整 */
#works article > div:first-child span:last-child { font-size: 13px !important }
#team article > div:first-child span:last-child { font-size: 12.5px !important }
#team article > div:nth-of-type(2) { font-size: 13.5px !important }

/* 折り返し位置を自然にする（文節単位で折る） */
#contact > div p, #team > div > p, #approach > div > div:first-child p, #ai > div > p, #why article p {
  word-break: normal !important;
  line-break: strict !important;
  overflow-wrap: anywhere !important;
  text-wrap: pretty !important;
}
#contact > div p { max-width: 30em !important }
#team > div > p { max-width: 34em !important }

/* リード文は1文1行。折り返しは文末のbrに任せる */
#approach > div > div:first-child p, #ai > div > p, #team > div > p, #contact > div p {
  max-width: none !important;
  line-height: 1.95 !important;
}
#contact > div p { max-width: 46em !important }
@media (max-width: 1100px) {
  #approach > div > div:first-child p, #ai > div > p, #team > div > p { font-size: 15.5px !important }
}

/* Safariでch単位が狭く計算され余計に折り返すのを防ぐ */
#approach h2 { max-width: none !important; white-space: normal !important; align-self: stretch !important; width: 100% !important }

/* スマホ：支援の流れ 01〜04 を縦1列、番号は左に配置 */
@media (max-width: 700px) {
  #approach [data-flow] { grid-template-columns: 1fr !important; gap: 26px !important }
  #approach [data-flow] > div[data-flow-line] { display: none !important }
  #approach [data-flow] > div:not([data-flow-line]) { display: grid !important; grid-template-columns: 56px 1fr !important; column-gap: 18px !important; row-gap: 6px !important; padding-right: 0 !important; align-items: start }
  #approach [data-flow] > div:not([data-flow-line]) > div:first-child { grid-row: span 2 }
  #approach [data-flow] h3 { margin: 0 !important; line-height: 1.3 !important }
  #approach [data-flow] p { margin: 8px 0 0 !important }
}

/* スマホ：事例の「課題／支援内容／成果」はラベルを上、本文を下の1列に */
@media (max-width: 700px) {
  #works [data-work-dl] { grid-template-columns: 1fr !important; gap: 4px 0 !important }
  #works [data-work-dl] dt { padding-top: 10px !important }
  #works [data-work-dl] dd { padding-bottom: 2px !important }
}

/* Safariのtext-wrap:prettyがbrで指定した改行位置を無視して再折り返しするのを止める */
h1, h2, h3, p, dd, li { text-wrap: normal !important }