:root {
  --itoba-navy-950: #032c3c;
  --itoba-navy-900: #04384c;
  --itoba-navy-800: #0a536b;
  --itoba-teal: #0b8e89;
  --itoba-lime: #d9ef8d;
  --itoba-lime-soft: #ebf7bd;
  --itoba-cream: #f8f5ed;
  --itoba-mist: #f2f7f6;
  --itoba-ink: #18333d;
  --itoba-muted: #60757d;
  --itoba-line: #d9e5e7;
  --itoba-white: #ffffff;
  --itoba-radius-sm: 14px;
  --itoba-radius-md: 21px;
  --itoba-radius-lg: 30px;
  --itoba-radius-pill: 999px;
  --itoba-shadow: 0 24px 65px rgba(6, 46, 59, .14);
  --itoba-shadow-soft: 0 11px 32px rgba(6, 46, 59, .08);
  --itoba-content: 1160px;
  --itoba-global-navy: var(--itoba-navy-900);
  --itoba-global-teal: var(--itoba-teal);
  --itoba-global-lime: var(--itoba-lime);
  --itoba-global-line: var(--itoba-line);
}

#header {
  color: var(--itoba-global-navy);
  background: rgba(255, 255, 255, .98);
  border-bottom: 1px solid var(--itoba-global-line);
  box-shadow: 0 7px 25px rgba(4, 56, 76, .06);
}

#header .l-header__bar {
  display: none;
}

#header .l-header__inner {
  min-height: 96px;
}

#header .c-headLogo,
#fix_header .c-headLogo {
  position: relative;
  display: grid;
  grid-template-columns: 62px minmax(0, 1fr);
  align-items: center;
  column-gap: 15px;
}

#header .c-headLogo::before,
#fix_header .c-headLogo::before {
  width: 58px;
  height: 58px;
  content: "";
  background:
    url("../images/shuttle-mark.png") center / 43px 43px no-repeat,
    var(--itoba-global-lime);
  border-radius: 15px;
  transform: rotate(-5deg);
}

#header .c-headLogo__link,
#fix_header .c-headLogo__link {
  display: grid;
  color: transparent;
  font-size: 0;
  line-height: 1.25;
}

/* 本番に登録済みの旧ロゴ画像と、リニューアル用ロゴ表現の重複を防ぎます。 */
#header .c-headLogo__img,
#fix_header .c-headLogo__img {
  display: none !important;
}

/* 画像ロゴ設定時に残るSWELLの固定高を解除し、文字ロゴ時と同じ高さに揃えます。 */
#header .c-headLogo.-img {
  height: 40px !important;
}

#header .c-headLogo.-img .c-headLogo__link {
  height: auto !important;
}

#header .c-headLogo__link::before,
#fix_header .c-headLogo__link::before {
  content: "伊東市バドミントン協会";
  color: var(--itoba-global-navy);
  font-family: "Zen Kaku Gothic New", "Yu Gothic UI", "Yu Gothic", Meiryo, sans-serif;
  font-size: clamp(18px, 1.75vw, 25px);
  font-weight: 700;
  letter-spacing: .055em;
  white-space: nowrap;
}

#header .c-headLogo__link::after,
#fix_header .c-headLogo__link::after {
  margin-top: 5px;
  content: "ITO CITY BADMINTON ASSOCIATION";
  color: var(--itoba-muted);
  font-family: Arial, sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .15em;
  white-space: nowrap;
}

#header .c-gnav > li > a {
  padding-inline: 13px;
  color: var(--itoba-global-navy);
  font-size: 12px;
  font-weight: 700;
}

#header .c-gnav > li > a::after {
  background: var(--itoba-global-teal);
}

/* メニュー項目に残っている旧サイト用の英語説明は表示しません。 */
#header .c-smallNavTitle,
#fix_header .c-smallNavTitle {
  display: none;
}

/* ステージングと同じく、スクロール追従ヘッダーは使用しません。 */
#fix_header {
  display: none !important;
}

#fix_header .c-headLogo {
  grid-template-columns: 46px minmax(0, 1fr);
  column-gap: 11px;
}

#fix_header .c-headLogo::before {
  width: 42px;
  height: 42px;
  background-size: 31px 31px;
  border-radius: 11px;
}

#fix_header .c-headLogo__link::before {
  font-size: 17px;
}

#fix_header .c-headLogo__link::after {
  margin-top: 2px;
  font-size: 11px;
}

/* 本番の旧フッターウィジェットを候補テーマ内だけで除外します。 */
#footer {
  color: var(--itoba-global-navy);
  background: var(--itoba-white);
  border-top: 1px solid var(--itoba-global-line);
}

#footer .l-footer__widgetArea {
  display: none !important;
}

#footer .l-footer__foot {
  padding: 30px 0 24px;
  color: var(--itoba-global-navy);
  background: var(--itoba-white);
}

#footer .l-footer__foot > .l-container {
  display: flex;
  flex-direction: column;
  align-items: center;
}

#footer .l-footer__nav {
  order: 1;
  margin-bottom: 22px;
}

#footer .l-footer__nav a {
  color: var(--itoba-global-navy) !important;
}

#footer .itoba-footer-social {
  display: flex;
  order: 2;
  align-items: center;
  gap: 14px;
  margin-bottom: 20px;
}

#footer .itoba-footer-social__title {
  color: var(--itoba-muted);
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .08em;
}

#footer .itoba-footer-social__list {
  display: flex;
  gap: 10px;
  margin: 0;
  padding: 0;
  list-style: none;
}

#footer .itoba-footer-social a {
  display: inline-flex;
  min-height: 40px;
  padding: 8px 14px;
  align-items: center;
  gap: 7px;
  color: var(--itoba-global-navy);
  background: var(--itoba-mist);
  border: 1px solid var(--itoba-global-line);
  border-radius: var(--itoba-radius-pill);
  font-size: 12px;
  font-weight: 700;
  text-decoration: none;
  transition: color .2s ease, background-color .2s ease, border-color .2s ease;
}

#footer .itoba-footer-social a:hover,
#footer .itoba-footer-social a:focus-visible {
  color: var(--itoba-white);
  background: var(--itoba-global-teal);
  border-color: var(--itoba-global-teal);
}

#footer .itoba-footer-social svg {
  width: 18px;
  height: 18px;
  flex: 0 0 auto;
  fill: currentColor;
}

#footer .copyright {
  order: 3;
  color: var(--itoba-muted);
}

@media (max-width: 959px) {
  #header .l-header__inner {
    min-height: 72px;
    padding-inline: 14px;
  }

  #header .c-headLogo {
    grid-template-columns: 47px minmax(0, 1fr);
    column-gap: 11px;
  }

  #header .c-headLogo::before {
    width: 44px;
    height: 44px;
    background-size: 32px 32px;
    border-radius: 11px;
  }

  #header .c-headLogo__link::before {
    font-size: clamp(15px, 4.2vw, 19px);
    letter-spacing: .025em;
  }

  #header .c-headLogo__link::after {
    margin-top: 2px;
    font-size: 11px;
    letter-spacing: .1em;
  }

  #footer .itoba-footer-social {
    flex-direction: column;
    gap: 8px;
  }
}

@media (max-width: 390px) {
  #header .c-headLogo__link::before {
    font-size: 14px;
  }

  #header .c-headLogo__link::after {
    letter-spacing: .055em;
  }
}

/* DESIGN-SYSTEM.md: standard post pages, 2026-09-08 */
#body_wrap.single-post {
  color: var(--itoba-ink);
  background: var(--itoba-white);
  font-family: "Zen Kaku Gothic New", "Yu Gothic UI", "Yu Gothic", Meiryo, sans-serif;
}

#body_wrap.single-post #content {
  width: min(var(--itoba-content), calc(100% - 40px));
  max-width: var(--itoba-content);
  padding-top: 56px;
  padding-bottom: 100px;
}

#body_wrap.single-post .l-mainContent {
  width: min(100%, 860px);
  max-width: 860px;
  margin-inline: auto;
}

#body_wrap.single-post .l-sidebar,
#body_wrap.single-post .c-shareBtns.-fix {
  display: none !important;
}

#body_wrap.single-post .p-articleHead {
  display: flex;
  margin-bottom: 14px;
  padding-bottom: 28px;
  flex-direction: column;
  gap: 13px;
  border-bottom: 1px solid var(--itoba-line);
}

#body_wrap.single-post .c-postTitle__ttl {
  order: 2;
  margin: 0;
  color: var(--itoba-navy-900);
  font-size: clamp(34px, 4.2vw, 46px);
  font-weight: 700;
  line-height: 1.32;
  letter-spacing: -.025em;
}

#body_wrap.single-post .c-postTitle__date {
  position: static !important;
  display: flex;
  order: 1;
  align-items: baseline;
  gap: 7px;
  color: var(--itoba-teal);
  font-family: Arial, sans-serif;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.5;
  transform: none !important;
}

#body_wrap.single-post .c-postTitle__date .__y,
#body_wrap.single-post .c-postTitle__date .__md {
  display: inline;
  font-size: inherit;
}

#body_wrap.single-post .p-articleMetas.-top {
  margin: 0 0 44px;
  color: var(--itoba-muted);
  font-size: 12px;
}

#body_wrap.single-post .c-categoryList__link {
  min-height: 28px;
  padding: 5px 12px;
  color: var(--itoba-white) !important;
  background: var(--itoba-navy-900) !important;
  border-radius: var(--itoba-radius-pill);
  font-size: 11px;
  font-weight: 700;
}

#body_wrap.single-post .post_content {
  color: var(--itoba-ink);
  font-size: 16px;
  line-height: 1.85;
}

#body_wrap.single-post .post_content p,
#body_wrap.single-post .post_content li {
  line-height: 1.85;
}

#body_wrap.single-post .post_content h2 {
  margin-top: 64px;
  padding: 18px 20px;
  color: var(--itoba-navy-900);
  background: var(--itoba-mist);
  border-left: 5px solid var(--itoba-teal);
  border-radius: 0 var(--itoba-radius-sm) var(--itoba-radius-sm) 0;
  font-size: 30px;
  line-height: 1.4;
}

#body_wrap.single-post .post_content h3 {
  margin-top: 48px;
  padding: 0 0 12px;
  color: var(--itoba-navy-900);
  background: transparent;
  border: 0;
  border-bottom: 2px solid var(--itoba-teal);
  font-size: 24px;
  line-height: 1.45;
}

#body_wrap.single-post .post_content h4 {
  margin-top: 38px;
  color: var(--itoba-navy-900);
  font-size: 19px;
  line-height: 1.5;
}

#body_wrap.single-post .post_content a:not(.wp-block-button__link):not(.wp-block-file__button) {
  color: var(--itoba-teal);
  text-decoration: underline;
  text-decoration-thickness: 1px;
  text-underline-offset: .18em;
}

#body_wrap.single-post .post_content a:focus-visible,
#body_wrap.single-post .c-shareBtns__btn:focus-visible {
  outline: 3px solid var(--itoba-teal);
  outline-offset: 3px;
}

#body_wrap.single-post .post_content img {
  height: auto;
  border-radius: var(--itoba-radius-sm);
}

#body_wrap.single-post .post_content blockquote {
  padding: 24px 26px;
  color: var(--itoba-ink);
  background: var(--itoba-cream);
  border: 0;
  border-left: 5px solid var(--itoba-lime);
  border-radius: 0 var(--itoba-radius-sm) var(--itoba-radius-sm) 0;
}

#body_wrap.single-post .post_content table {
  border-color: var(--itoba-line);
  font-size: 15px;
}

#body_wrap.single-post .post_content th {
  color: var(--itoba-navy-900);
  background: var(--itoba-mist);
  border-color: var(--itoba-line);
}

#body_wrap.single-post .post_content td {
  border-color: var(--itoba-line);
}

#body_wrap.single-post .post_content .wp-block-file {
  display: flex;
  min-height: 72px;
  margin: 28px 0;
  padding: 16px 18px;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  background: var(--itoba-cream);
  border: 1px solid var(--itoba-line);
  border-radius: var(--itoba-radius-sm);
}

#body_wrap.single-post .post_content .wp-block-file a:first-child {
  color: var(--itoba-navy-900);
  font-weight: 700;
}

#body_wrap.single-post .post_content .wp-block-file__button,
#body_wrap.single-post .post_content .wp-block-button__link {
  display: inline-flex;
  min-height: 48px;
  padding: 10px 22px;
  align-items: center;
  justify-content: center;
  color: var(--itoba-white) !important;
  background: var(--itoba-navy-900) !important;
  border-radius: var(--itoba-radius-pill) !important;
  font-weight: 700;
  text-decoration: none;
}

#body_wrap.single-post .p-articleFoot,
#body_wrap.single-post .c-shareBtns.-bottom,
#body_wrap.single-post .l-articleBottom__section {
  margin-top: 64px;
}

@media (max-width: 760px) {
  #body_wrap.single-post #content {
    width: min(100% - 28px, 860px);
    padding-top: 38px;
    padding-bottom: 77px;
  }

  #body_wrap.single-post .p-articleHead {
    padding-bottom: 22px;
  }

  #body_wrap.single-post .c-postTitle__ttl {
    font-size: 31px;
    line-height: 1.38;
  }

  #body_wrap.single-post .p-articleMetas.-top {
    margin-bottom: 36px;
  }

  #body_wrap.single-post .post_content {
    font-size: 15px;
    line-height: 1.8;
  }

  #body_wrap.single-post .post_content h2 {
    margin-top: 52px;
    padding: 15px 16px;
    font-size: 27px;
  }

  #body_wrap.single-post .post_content h3 {
    margin-top: 42px;
    font-size: 22px;
  }

  #body_wrap.single-post .post_content .wp-block-file {
    align-items: stretch;
    flex-direction: column;
  }

  #body_wrap.single-post .post_content .wp-block-file__button,
  #body_wrap.single-post .post_content .wp-block-button__link {
    width: 100%;
  }
}

@media (prefers-reduced-motion: reduce) {
  #body_wrap.single-post *,
  #body_wrap.single-post *::before,
  #body_wrap.single-post *::after {
    transition: none !important;
    animation: none !important;
    scroll-behavior: auto !important;
  }
}

#body_wrap.single-post .p-articleHead {
  align-items: flex-start;
}
