/* =========================================================
   WordPress 化にともなう補足（静的サイトの CSS は変更せず、ここで補う）
   ========================================================= */

/* 「本文へスキップ」：キーボードで最初に Tab を押したときだけ左上に出る */
.skip-link { position: absolute; left: 8px; top: -200px; z-index: 100; padding: 10px 16px; background: #fff; color: var(--ink); border: 2px solid #285f7b; font-size: 14px; font-weight: 700; line-height: 1.5; }
.skip-link:focus { top: 8px; }
main:focus { outline: none; }

/* 本文：段落・リストが続くとき */
.copy-section .explanation + .explanation,
.copy-section .explanation + .explanation-list,
.copy-section .explanation-list + .explanation { margin-top: 1em; }
.explanation-list { margin: 0; padding-left: 1.4em; font-size: 16px; line-height: 2.1; letter-spacing: .015em; }
.explanation-list li + li { margin-top: .3em; }
.detail-body > .detail-link { margin-top: 32px; }

/* 固定ページ（プライバシーポリシーなど）・404 */
.generic-page h1 { margin-bottom: 26px; }
.generic-body { max-width: 900px; font-size: 16px; line-height: 2.1; }
.generic-body > * + * { margin-top: 1em; }
.generic-body h2, .generic-body h3 { font-size: 21px; line-height: 1.7; margin-top: 2em; }
.generic-body ul, .generic-body ol { padding-left: 1.4em; }

/* メディア：画像・見出し・パネルとの間 */
:where(.p-media) :where(img) { width: 100%; height: auto; }
.c-mediaLead__title a { display: block; color: inherit; }
.c-mediaList__empty { margin: 0; }
.p-media + .contact { margin-top: var(--space-section); }
.c-mediaList__pager a:hover { color: var(--media-accent, #c2456a); }

/* ログイン中（管理バー表示時）に、固定ヘッダーが管理バーに隠れないように */
@media (max-width: 760px) {
  .admin-bar .header { top: 46px; }
  .explanation-list { font-size: 15px; line-height: 2; }
  .generic-body { font-size: 15px; line-height: 2; }
  .profile-detail .page-lead .copy-section > p { grid-column: 1 / -1; grid-row: 5; margin-top: 20px; }
}
@media (max-width: 600px) {
  .admin-bar .header { top: 0; }
}
@media (max-width: 767px) {
  .c-mediaList__title { font-size: max(14px, 3.7vw); }
  }


/* トップメニュー：項目名を折り返さない。タブレット幅（761〜960px）では詰めて1段に収める */
.header nav > a, .work-menu-label > a { white-space: nowrap; }
@media (min-width: 761px) and (max-width: 960px) {
  .header { gap: 18px; padding-inline: 3%; }
  .logo { width: 188px; }
  .header nav { gap: 11px; font-size: 13px; letter-spacing: 0; }
  .work-menu-label { gap: 0; }
  .work-menu-toggle { width: 22px; }
}

/* メディアの見出し：ロゴ（media-logo.svg）の下に説明文、右に検索窓 */
.p-media .c-mediaLead { align-items: center; gap: 40px; }
.p-media .c-mediaLead__brand { display: flex; flex-direction: column; align-items: flex-start; gap: clamp(10px, 1vw, 16px); min-width: 0; }
.p-media .c-mediaLead__title { flex: none; width: clamp(342px, 34.2vw, 504px); margin: 0 0 0 -10px; }
.p-media .c-mediaLead__title a:hover { opacity: .85; }
.p-media .c-mediaLead__logo { display: block; width: 100%; height: auto; }
.p-media .c-mediaLead__text { margin: 0 0 0 4px; font-size: clamp(15px, 1.25vw, 18px); font-weight: 700; letter-spacing: .2em; line-height: 1.6; white-space: normal; color: var(--ink); }
@media (max-width: 767px) {
  .p-media .c-mediaLead { flex-direction: column; align-items: stretch; gap: 0; padding-block: 32px 28px; }
  .p-media .c-mediaLead__title { width: min(90%, 324px); margin-left: -6px; }
  .p-media .c-mediaLead__text { font-size: 14px; letter-spacing: .12em; line-height: 1.8; }
}

/* ---------- お問い合わせフォーム（page-contact.php） ---------- */
.contact-page { padding-block: 22px var(--space-section); }
.contact-page > .section-label { margin-bottom: 5px; }
.contact-page h1 { font-size: 38px; letter-spacing: .07em; line-height: 1.6; margin: 0 0 22px; }
.contact-intro { max-width: 760px; font-size: 16px; line-height: 2.1; }
.contact-intro p + p { margin-top: 1em; }
.contact-form-wrap { max-width: 760px; margin-top: 40px; scroll-margin-top: 120px; }
.contact-form { display: grid; gap: 28px; padding: 40px; background: #f5f9fb; }
.form-row { display: grid; gap: 10px; margin: 0; padding: 0; border: 0; min-width: 0; }
.form-label { display: flex; align-items: center; gap: 10px; padding: 0; font-size: 15px; font-weight: 700; letter-spacing: .04em; }
.form-badge { display: inline-block; padding: 2px 8px; font-size: 11px; font-weight: 700; line-height: 1.6; letter-spacing: .08em; color: #fff; background: #c2456a; }
.form-badge.is-optional { color: var(--muted); background: #e3e8ea; }
.form-input { width: 100%; padding: 14px 16px; font: inherit; font-size: 16px; line-height: 1.7; color: var(--ink); background: #fff; border: 1px solid #cfd8dc; border-radius: 0; -webkit-appearance: none; appearance: none; transition: border-color .2s ease, box-shadow .2s ease; }
.form-input--short { max-width: 320px; }
.form-textarea { min-height: 220px; resize: vertical; }
.form-input:focus { outline: none; border-color: var(--blue); box-shadow: 0 0 0 3px #5fb6e040; }
.form-input[aria-invalid="true"], .form-topics[aria-invalid="true"] .form-choice span { border-color: #c2456a; }
.form-choices { display: flex; flex-wrap: wrap; gap: 10px; }
.form-choice { position: relative; }
.form-choice input { position: absolute; opacity: 0; inset: 0; margin: 0; cursor: pointer; }
.form-choice span { display: inline-block; padding: 10px 18px; font-size: 15px; line-height: 1.5; background: #fff; border: 1px solid #cfd8dc; cursor: pointer; transition: background-color .2s ease, border-color .2s ease, color .2s ease; }
.form-choice input:checked + span { color: var(--ink); background: var(--yellow); border-color: var(--yellow); font-weight: 700; }
.form-choice input:focus-visible + span { outline: 3px solid #285f7b; outline-offset: 2px; }
.form-error { margin: 0; font-size: 14px; font-weight: 700; color: #c2456a; }
.form-alert { margin: 0 0 20px; padding: 14px 18px; font-size: 15px; font-weight: 700; color: #a3304f; background: #fbe9ee; }
.form-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }
.form-submit { padding-top: 4px; }
.form-submit .contact-link { border: 0; cursor: pointer; font-family: inherit; }
.form-done { padding: 40px; background: #f5f9fb; font-size: 16px; line-height: 2.1; }
.form-done__title { margin-bottom: 10px; font-size: 22px; font-weight: 700; letter-spacing: .06em; }
.form-done .detail-link { margin-top: 18px; }
@media (max-width: 1100px) { .contact-page h1 { font-size: 34px; } }
@media (max-width: 760px) {
  .contact-page { padding-block: 10px var(--space-section); }
  .contact-page h1 { font-size: 30px; margin-bottom: 18px; }
  .contact-intro { font-size: 15px; line-height: 2; }
  .contact-form-wrap { margin-top: 28px; }
  .contact-form, .form-done { padding: 26px 20px; gap: 24px; }
  .form-choice span { padding: 9px 14px; font-size: 14px; }
  .form-submit .contact-link { width: 100%; text-align: center; }
}

/* SNS：note・Facebook・Instagram・X の4つ。丸は元の85%、間隔も詰める。Facebook の「f」の文字だけ115% */
.social-links a{flex:0 0 auto;aspect-ratio:1}
@media(min-width:761px){.social-links{gap:14px}.social-links a{width:65px;height:65px}.social-links .sns-fb svg{width:41px;height:41px}}
@media(max-width:760px){.social-links{gap:8px}.social-links a{width:min(49px,calc((100% - 24px) / 4));height:auto}.social-links .sns-fb svg{width:35px;height:35px}}