/* 法人について専用
 * 通常の指定 → 条件別の調整の順序を保っています。
 * @media は画面幅などの条件です。追記前に同じセレクター名を検索してください。
 */

/* 理念のメッセージ */

.about-core {
  position: relative;
  width: 100%;
  display: flex;
  align-items: center;
  overflow: clip;
  scroll-margin-top: 92px;
  background: #1b1513;
  color: #fff;
}

.about-core > img,
.about-core-shade {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
}

.about-core > img {
  object-fit: cover;
  object-position: center 42%;
  transition: transform 1.4s cubic-bezier(0.22, 1, 0.36, 1);
}

.about-core:hover > img {
  transform: scale(1.018);
}

.about-core-shade {
  background: linear-gradient(90deg, rgba(16, 8, 7, 0.95) 0%, rgba(31, 8, 7, 0.81) 50%, rgba(25, 7, 5, 0.54) 100%),
    linear-gradient(0deg, rgba(17, 8, 6, 0.98) 0%, transparent 70%);
}

.about-core-inner {
  position: relative;
  z-index: 2;
  padding-block: clamp(32px, 4vw, 56px) clamp(48px, 5.2vw, 72px);
}

.about-core .is-core-reveal-ready {
  opacity: 0;
  transform: translateY(28px);
  transition: opacity 0.9s cubic-bezier(0.16, 1, 0.3, 1),
    transform 0.9s cubic-bezier(0.16, 1, 0.3, 1);
  will-change: opacity, transform;
}

.about-core .is-core-reveal-ready.is-core-revealed {
  opacity: 1;
  transform: translateY(0);
}

.about-core-label {
  display: flex;
  align-items: center;
  gap: 16px;
  margin-bottom: 0;
}

.about-core-label span {
  color: #e6b8ba;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.22em;
}

.about-core-label b {
  display: flex;
  align-items: center;
  gap: 12px;
  color: #fff;
  font-size: 12px;
}

.about-core-label b:before {
  content: "";
  width: 26px;
  height: 1px;
  background: var(--about-gold);
}

.about-k-principles {
  display: grid;
  gap: clamp(13px, 1.8vw, 24px);
  margin-block: clamp(42px, 5.5vw, 76px) clamp(52px, 6.5vw, 90px);
  text-align: center;
  animation: about-principles-reveal 1.6s cubic-bezier(0.22, 1, 0.36, 1) 0.38s both;
}

.about-k-principles article {
  min-width: 0;
  display: flex;
  align-items: baseline;
  justify-content: center;
  gap: clamp(8px, 1vw, 15px);
  padding: clamp(8px, 1vw, 13px) 0;
  color: #fff;
}

.about-k-principles strong,
.about-k-principles small {
  display: block;
  margin: 0;
  text-shadow: none;
  text-wrap: balance;
  word-break: keep-all;
  overflow-wrap: break-word;
}

.about-k-principles strong {
  font-size: clamp(27px, 3.3vw, 49px);
  font-weight: 900;
  line-height: 1.3;
  letter-spacing: -0.045em;
}

.about-k-principles small {
  font-size: clamp(13px, 1.25vw, 18px);
  font-weight: 800;
  line-height: 1.5;
  letter-spacing: 0.01em;
}

.about-purpose-origin {
  margin-top: 0;
  border-top: 1px solid rgba(255, 255, 255, 0.25);
}

/* ヘッダー・ナビゲーション */

.about-purpose-origin > header {
  display: flex;
  align-items: center;
  justify-content: flex-start;
  gap: 16px;
  padding: 24px 0;
}

.about-purpose-origin > header span {
  color: #e6b8ba;
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.22em;
}

.about-purpose-origin > header h3 {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0;
  color: #fff;
  font-size: 12px;
}

.about-purpose-origin > header h3:before {
  content: "";
  width: 26px;
  height: 1px;
  background: var(--about-gold);
}

.about-year-goal header span {
  color: #820006;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.2em;
}

.about-purpose-origin-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(0, 0.92fr);
  gap: 1px;
  background: rgba(255, 255, 255, 0.2);
  border: 1px solid rgba(255, 255, 255, 0.2);
}

.about-purpose-origin-grid > article {
  position: relative;
  min-width: 0;
  padding: clamp(30px, 4.2vw, 54px);
  overflow: hidden;
}

.about-purpose-origin-grid > article > span {
  display: block;
  margin-bottom: 24px;
  color: #e5b6b8;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.18em;
}

.about-purpose-origin-grid h4 {
  margin: 0 0 24px;
  font-size: clamp(21px, 2.5vw, 32px);
  line-height: 1.55;
  letter-spacing: -0.03em;
}

.about-purpose-origin-grid p {
  margin: 0;
  color: #d8ceca;
  font-size: 12px;
  font-weight: 600;
  line-height: 2;
}

.about-purpose-origin-grid p + p {
  margin-top: 14px;
}

.about-purpose-card {
  background: rgba(13, 10, 8, 0.87);
}

.about-purpose-card blockquote {
  margin: 0 0 22px;
  padding: 22px 0 22px clamp(18px, 2vw, 28px);
  border-left: 3px solid #b20c13;
  color: #fff;
  font-size: clamp(14px, 1.5vw, 18px);
  font-weight: 700;
  line-height: 2;
}

.about-purpose-card:after {
  content: "“";
  position: absolute;
  right: 18px;
  bottom: -72px;
  color: rgba(255, 255, 255, 0.045);
  font: italic 900 220px/1 Georgia,
    serif;
}

.about-origin-card {
  background: rgba(255, 255, 255, 0.96);
  color: #171413;
}

.about-origin-card > span {
  color: #730005;
}

.about-origin-card h4 em {
  color: #a0080e;
  font-style: normal;
}

.about-origin-card p {
  color: #514944;
  font-size: 13px;
}

.about-origin-mark {
  display: grid;
  grid-template-columns: max-content max-content max-content minmax(0, 1fr);
  align-items: baseline;
  column-gap: clamp(10px, 1vw, 14px);
  margin: -3px 0 20px;
  color: #8e0000;
}

.about-origin-mark strong {
  display: block;
  font: italic 900 clamp(42px, 4.8vw, 64px)/0.85 Arial,
    sans-serif;
  letter-spacing: 0;
}

.about-origin-mark i {
  margin-right: -5px;
  color: #7e746e;
  font-size: 28px;
  font-style: normal;
  font-weight: 800;
}

.about-origin-mark small {
  align-self: center;
  margin: 0;
  color: #730005;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.17em;
}

/* フッター */

.about-purpose-footer {
  display: grid;
  grid-template-columns: minmax(180px, 0.38fr) 1fr;
  gap: clamp(22px, 4vw, 50px);
  align-items: center;
  padding: clamp(22px, 3vw, 34px);
  background: #8e0000;
}

.about-purpose-footer span {
  color: #f0bfc1;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: 0.17em;
}

.about-purpose-footer p {
  margin: 0;
  color: #fff;
  font-size: 12px;
  line-height: 1.9;
}

.about-purpose-footer strong {
  color: #fff;
}

.about-year-goal {
  margin-top: clamp(36px, 5vw, 62px);
  padding: clamp(28px, 4vw, 50px);
  background: rgba(255, 255, 255, 0.96);
  color: #171413;
  box-shadow: 0 30px 70px rgba(0, 0, 0, 0.22);
}

.about-year-goal > header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 30px;
  padding-bottom: 27px;
  border-bottom: 1px solid #d9d1ca;
}

.about-year-goal > header h3 {
  margin: 9px 0 0;
  font-size: clamp(21px, 2.5vw, 31px);
}

.about-year-goal > header > strong {
  display: flex;
  align-items: baseline;
  gap: 17px;
  color: var(--about-red);
  font-size: clamp(31px, 4.5vw, 57px);
  line-height: 1;
}

.about-year-goal > header small {
  color: #5c554f;
  font-size: 10px;
  letter-spacing: 0.05em;
}

.about-goal-grid {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.about-goal-grid article {
  position: relative;
  min-height: 330px;
  padding: 32px 25px 25px;
  border-right: 1px solid #ddd5ce;
  overflow: hidden;
  transition: background 0.4s,
    color 0.4s,
    transform 0.4s;
}

.about-goal-grid article:last-child {
  border-right: 0;
}

.about-goal-grid article:is(:hover, .is-hover) {
  z-index: 1;
  transform: translateY(-5px);
  background: #8e0000;
  color: #fff;
}

.about-goal-grid article > span {
  display: grid;
  width: 42px;
  height: 42px;
  place-items: center;
  border: 1px solid #c8beb7;
  border-radius: 50%;
  color: #8e0000;
  font: italic 900 15px/1 Georgia,
    serif;
}

.about-goal-grid article:is(:hover, .is-hover) > span {
  border-color: rgba(255, 255, 255, 0.48);
  color: #fff;
}

.about-goal-grid h4 {
  margin: 25px 0 15px;
  font-size: clamp(17px, 1.8vw, 22px);
  line-height: 1.5;
}

.about-goal-grid p {
  margin: 0;
  color: #514a45;
  font-size: 12.5px;
  font-weight: 600;
  line-height: 1.95;
}

.about-goal-grid article:is(:hover, .is-hover) p {
  color: #f2dfe0;
}

.about-goal-grid article > b {
  position: absolute;
  right: 14px;
  bottom: 12px;
  color: rgba(142, 0, 0, 0.07);
  font-size: clamp(23px, 2.5vw, 38px);
  font-weight: 900;
  letter-spacing: -0.06em;
  writing-mode: vertical-rl;
}

.about-goal-grid article:is(:hover, .is-hover) > b {
  color: rgba(255, 255, 255, 0.08);
}

.about-page-layout {
  display: grid;
  grid-template-columns: minmax(176px, 206px) minmax(0, 1fr);
  align-items: start;
  gap: clamp(22px, 3vw, 42px);
  padding-block: clamp(42px, 5vw, 70px) clamp(58px, 7vw, 92px);
}

.about-side {
  position: sticky;
  top: 118px;
  z-index: 12;
}

.about-side .boys-side-box {
  overflow: hidden;
  background: #171413;
  color: #fff;
  box-shadow: 0 20px 46px rgba(25, 14, 10, 0.18);
}

.about-side .boys-side-box > p {
  margin: 0;
  padding: 21px 20px 18px;
  background: linear-gradient(135deg, #8e0000, #590000);
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.about-side .boys-side-box > p span {
  font-size: 8px;
  font-weight: 900;
  letter-spacing: 0.2em;
  color: #efc6c7;
}

.about-side .boys-side-box > p strong {
  font-size: 14px;
  letter-spacing: 0.05em;
}

.about-side nav {
  display: grid;
  padding: 8px;
}

.about-side nav a {
  position: relative;
  display: grid;
  grid-template-columns: 24px minmax(0, 1fr) 13px;
  align-items: center;
  gap: 7px;
  min-height: 65px;
  padding: 9px 8px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.09);
  transition: background 0.3s,
    color 0.3s,
    padding 0.3s;
}

.about-side nav a:last-child {
  border-bottom: 0;
}

.about-side nav a > span {
  font: italic 700 10px/1 Georgia,
    serif;
  color: #b9b0aa;
}

.about-side nav a strong {
  display: flex;
  min-width: 0;
  flex-direction: column;
  gap: 4px;
  font-size: 9px;
  letter-spacing: 0.07em;
}

.about-side nav a small {
  letter-spacing: 0.01em;
  color: #d8d2ce;
  font-size: 10px;
  font-weight: 700;
  line-height: 1.4;
}

.about-side nav a > b {
  font-size: 12px;
  color: #e0dad6;
  transition: transform 0.3s;
}

.about-side nav a:before {
  content: "";
  position: absolute;
  left: 0;
  top: 12px;
  bottom: 12px;
  width: 3px;
  background: var(--about-red);
  transform: scaleY(0);
  transition: transform 0.3s;
}

.about-side nav a:hover,
.about-side nav a:focus-visible,
.about-side nav a.is-current {
  background: #292321;
  padding-left: 12px;
}

.about-side nav a.is-current:before {
  transform: scaleY(1);
}

.about-side nav a.is-current > span,
.about-side nav a:hover > span {
  color: #efaeb0;
}

.about-side nav a:hover > b,
.about-side nav a.is-current > b {
  transform: translateX(3px);
  color: #fff;
}

.about-content-column {
  min-width: 0;
  display: grid;
  gap: clamp(20px, 2.6vw, 34px);
}

.about-content-section {
  scroll-margin-top: 118px;
  min-width: 0;
  padding: clamp(38px, 4.5vw, 62px);
  overflow: clip;
  background: #fff;
  border: 1px solid #e4ddd5;
  box-shadow: 0 18px 46px rgba(27, 17, 11, 0.06);
}

.about-section-head {
  display: grid;
  grid-template-columns: 1fr minmax(210px, 0.7fr);
  align-items: end;
  gap: 12px 35px;
  margin-bottom: clamp(30px, 4vw, 48px);
  padding-bottom: 23px;
  border-bottom: 1px solid var(--about-line);
}

.about-section-head > p {
  grid-column: 1/-1;
  margin: 0;
  color: var(--about-red);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.2em;
}

.about-section-head h2 {
  margin: 0;
  font-size: clamp(34px, 4.6vw, 56px);
  line-height: 1.15;
  letter-spacing: -0.04em;
}

.about-section-head > span {
  padding-left: 18px;
  border-left: 2px solid var(--about-red);
  color: #5c554f;
  font-size: 12px;
  font-weight: 700;
  line-height: 1.8;
}

/* 沿革・歴史 */

.history-section {
  background: #171413;
  color: #fff;
}

.history-section .about-section-head {
  border-bottom-color: #514a46;
}

.history-section .about-section-head > p {
  color: #ffc4c7;
}

.history-section .about-section-head > span {
  color: #fff;
  border-left-color: #d69a9e;
}

.history-intro {
  display: grid;
  grid-template-columns: minmax(180px, 0.55fr) 1fr;
  gap: 35px;
  align-items: end;
  margin-bottom: 38px;
}

.history-intro strong {
  color: #ffc4c7;
  font-size: clamp(28px, 4vw, 48px);
  line-height: 0.92;
  letter-spacing: -0.04em;
}

.history-intro p {
  margin: 0;
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.95;
}

.history-timeline {
  position: relative;
}

.history-timeline:before {
  content: "";
  position: absolute;
  left: 135px;
  top: 13px;
  bottom: 13px;
  width: 1px;
  background: linear-gradient(#8e0000, #8e0000 55%, #645d57);
}

.history-timeline article {
  position: relative;
  display: grid;
  grid-template-columns: 112px minmax(0, 1fr);
  gap: 45px;
  padding: 0 0 34px;
}

.history-timeline article:last-child {
  padding-bottom: 0;
}

.history-timeline article:before {
  content: "";
  position: absolute;
  left: 130px;
  top: 10px;
  width: 11px;
  height: 11px;
  border: 2px solid #d2c8c0;
  border-radius: 50%;
  background: #171413;
  transition: background 0.3s,
    box-shadow 0.3s,
    transform 0.3s;
}

.history-timeline article:hover:before {
  background: #d6bd8f;
  box-shadow: 0 0 0 7px rgba(214, 189, 143, 0.13);
  transform: scale(1.12);
}

.history-year {
  text-align: right;
}

.history-year span {
  display: block;
  color: #ffc0c3;
  font: italic 900 29px/1 Georgia,
    serif;
}

.history-year strong {
  display: block;
  margin-top: 7px;
  color: #fff;
  font-size: 11px;
  font-weight: 800;
  line-height: 1.55;
}

.history-story {
  padding: 1px 0 28px;
  border-bottom: 1px solid #4a433f;
  transition: padding 0.35s,
    background 0.35s;
}

.history-timeline article:hover .history-story {
  padding-left: 13px;
  background: linear-gradient(90deg, rgba(255, 255, 255, 0.04), transparent);
}

.history-story small {
  display: inline-flex;
  align-items: center;
  min-width: 47px;
  padding: 4px 10px 5px;
  background: #a40008;
  color: #fff;
  font-size: 12px;
  font-weight: 900;
  line-height: 1;
  letter-spacing: 0.08em;
}

.history-story h3 {
  margin: 11px 0 10px;
  color: #fff;
  font-size: clamp(17px, 2vw, 23px);
  line-height: 1.5;
}

.history-story p {
  margin: 0;
  color: #faf8f6;
  font-size: 13px;
  font-weight: 500;
  line-height: 1.9;
}

.history-story a {
  display: flex;
  width: max-content;
  align-items: center;
  gap: 20px;
  margin-top: 14px;
  padding-bottom: 5px;
  border-bottom: 1px solid #b6aea8;
  color: #fff;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.07em;
}

.history-story a b {
  color: #f0b9bc;
  transition: transform 0.3s;
}

.history-story a:hover b {
  transform: translate(3px, -3px);
}

.history-timeline article.is-milestone:before,
.history-timeline article.is-origin:before {
  border-color: #d6bd8f;
  background: #d6bd8f;
}

.history-timeline article.is-now .history-year span {
  color: #fff;
}

/* リーグ情報 */

.league-profile {
  position: relative;
  margin-top: 25px;
  padding: clamp(22px, 3vw, 32px);
  overflow: hidden;
  border: 1px solid #554b46;
  background: linear-gradient(145deg, #241f1c 0%, #100d0c 100%);
  box-shadow: 0 18px 38px rgba(0, 0, 0, 0.22);
}

.league-profile:before {
  content: "B";
  position: absolute;
  right: -18px;
  top: -48px;
  color: rgba(255, 255, 255, 0.025);
  font: italic 900 210px/1 Georgia,
    serif;
}

.league-profile-head {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 28px;
  align-items: end;
  padding-bottom: 23px;
  border-bottom: 1px solid #4f4641;
}

.league-profile-kicker {
  display: block;
  color: #ff777d;
  font-size: 9px;
  font-weight: 900;
  letter-spacing: 0.2em;
}

.league-profile-head h4 {
  margin: 10px 0 0;
  color: #fff;
  font-size: clamp(21px, 2.7vw, 30px);
  line-height: 1.45;
}

.history-story .league-official-link {
  position: relative;
  width: min(100%, 235px);
  min-height: 69px;
  margin: 0;
  padding: 13px 48px 13px 17px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  gap: 5px;
  border: 1px solid #766963;
  color: #fff;
  transition: background 0.35s,
    border-color 0.35s,
    color 0.35s,
    transform 0.35s;
}

.history-story .league-official-link > span {
  font-size: 8px;
  font-weight: 900;
  letter-spacing: 0.18em;
  color: #ff9ba0;
}

.history-story .league-official-link > strong {
  font-size: 11.5px;
  line-height: 1.45;
}

.history-story .league-official-link > b {
  position: absolute;
  right: 18px;
  top: 50%;
  color: #ff777d;
  font-size: 17px;
  transform: translateY(-50%);
  transition: transform 0.35s,
    color 0.35s;
}

.history-story .league-official-link:is(:hover, .is-hover) {
  padding-left: 17px;
  background: #a00007;
  border-color: #a00007;
  color: #fff;
  transform: translateY(-3px);
}

.history-story .league-official-link:is(:hover, .is-hover) > b {
  color: #fff;
  transform: translate(3px, -53%);
}

.league-profile-lead {
  position: relative;
  z-index: 1;
  max-width: 710px;
  margin: 22px 0 24px !important;
  color: #f8f5f2 !important;
  font-size: 12.5px !important;
  line-height: 1.95 !important;
}

.league-scale {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 7px;
}

.league-scale-card {
  position: relative;
  min-width: 0;
  padding: 19px 17px;
  background: #302a27;
  border-top: 2px solid #6e625c;
  transition: transform 0.35s,
    background 0.35s,
    border-color 0.35s;
}

.league-scale-card:is(:hover, .is-hover) {
  z-index: 2;
  transform: translateY(-5px);
  background: #3a322e;
  border-color: #ff777d;
}

.league-scale-card.is-local {
  border-top-color: #d4b179;
}

.league-scale-card.is-national {
  background: #790006;
  border-top-color: #e5363f;
}

.league-scale-card.is-national:is(:hover, .is-hover) {
  background: #950008;
}

.league-scale-card header {
  min-height: 49px;
  padding-bottom: 14px;
  border-bottom: 1px solid rgba(255, 255, 255, 0.13);
}

.league-scale-card header small {
  display: block;
  min-width: 0;
  padding: 0;
  background: none;
  color: #d9a8aa;
  line-height: 1.2;
  letter-spacing: 0.18em;
  font-size: 10px;
}

.league-scale-card header strong {
  display: block;
  margin-top: 6px;
  color: #fff;
  line-height: 1.4;
  font-size: 17px;
}

.league-scale-card dl {
  margin: 15px 0 0;
}

.league-scale-card dl > div {
  display: flex;
  min-height: 40px;
  align-items: center;
  justify-content: space-between;
  gap: 9px;
}

.league-scale-card dl > div + div {
  margin-top: 9px;
  padding-top: 9px;
  border-top: 1px solid rgba(255, 255, 255, 0.09);
}

.league-scale-card dt {
  flex: 0 0 auto;
  color: #d1c9c4;
  font-weight: 800;
  font-size: 10.5px;
}

.league-scale-card dd {
  margin: 0;
  display: flex;
  align-items: baseline;
  justify-content: flex-end;
  gap: 4px;
  color: #fff;
  font-size: 19px;
  font-weight: 900;
  text-align: right;
}

.league-scale-card dd > b {
  font: italic 900 24px/1 Georgia,
    serif;
  font-size: 28px;
  white-space: nowrap;
}

.league-scale-card dd > span {
  color: #e4deda;
  font-weight: 800;
  font-size: 10px;
}

.league-team-breakdown {
  align-items: flex-start !important;
}

.league-team-breakdown dd {
  display: grid;
  grid-template-columns: 1fr;
  gap: 8px;
}

.league-team-breakdown dd > span {
  display: flex;
  align-items: baseline;
  gap: 6px;
  white-space: nowrap;
}

.league-team-breakdown dd b {
  color: #fff;
  font: italic 900 22px/1 Georgia,
    serif;
  font-size: 26px;
}

.league-team-breakdown dd em {
  color: #e4deda;
  font-style: normal;
  font-weight: 800;
  font-size: 10.5px;
}

/* 組織図・理事長挨拶 */

.organization-section {
  background: linear-gradient(140deg, #fff, #f7f3ef);
}

.organization-lead {
  max-width: 720px;
  margin: -8px 0 34px;
  color: #39332f;
  font-size: 13px;
  line-height: 2;
}

.organization-chart {
  position: relative;
  padding: 36px;
  background: #171413;
  color: #fff;
}

.org-board {
  position: relative;
  width: min(430px, 76%);
  min-height: 145px;
  margin: auto;
  padding: 27px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
  text-align: center;
  background: linear-gradient(135deg, #92050a, #600004);
  box-shadow: 0 18px 34px rgba(0, 0, 0, 0.26);
  transition: transform 0.4s;
}

.org-board:is(:hover, .is-hover) {
  transform: translateY(-5px);
}

.org-board span,
.org-teams a > span {
  font-size: 8px;
  font-weight: 900;
  letter-spacing: 0.19em;
  color: #ffd0d2;
}

.org-board strong {
  margin-top: 12px;
  font-size: 24px;
}

.org-board small {
  margin-top: 7px;
  color: #fff;
  font-size: 9px;
}

.org-connector {
  display: block;
}

.org-connector-main {
  position: relative;
  width: calc(50% + 9px);
  height: 62px;
  margin: auto;
  border-bottom: 1px solid #a79e98;
}

.org-connector-main:before {
  content: "";
  position: absolute;
  left: 50%;
  top: 0;
  height: 62px;
  border-left: 1px solid #a79e98;
}

.org-teams {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  padding-top: 34px;
}

.org-teams a {
  position: relative;
  min-height: 155px;
  padding: 26px;
  display: flex;
  flex-direction: column;
  justify-content: center;
  background: #292421;
  border: 1px solid #625a55;
  transition: transform 0.4s,
    background 0.4s,
    border-color 0.4s;
}

.org-teams a:before {
  content: "";
  position: absolute;
  left: 50%;
  top: -34px;
  height: 34px;
  width: 1px;
  background: #a79e98;
}

.org-teams a:is(:hover, .is-hover),
.org-teams a:focus-visible {
  transform: translateY(-7px);
  background: #fff;
  border-color: #fff;
  color: #171413;
}

.org-teams a strong {
  margin-top: 13px;
  font-size: 20px;
}

.org-teams a small {
  margin-top: 6px;
  color: #e1dbd7;
  font-size: 8px;
  font-weight: 800;
  letter-spacing: 0.08em;
}

.org-teams a:is(:hover, .is-hover) small,
.org-teams a:focus-visible small {
  color: #5c554f;
}

.org-teams a > b {
  position: absolute;
  right: 24px;
  bottom: 21px;
  color: #f1bec1;
  font-size: 18px;
  transition: transform 0.3s;
}

.org-teams a:is(:hover, .is-hover) > b,
.org-teams a:focus-visible > b {
  transform: translateX(6px);
  color: #8e0000;
}

.organization-chairman {
  position: relative;
  display: grid;
  grid-template-columns: minmax(230px, 0.42fr) 1fr;
  margin-top: 26px;
  overflow: hidden;
  border: 1px solid #cfc5bc;
  border-top: 4px solid #a00007;
  background: #f7f3ef;
  box-shadow: 0 22px 48px rgba(35, 22, 14, 0.13);
}

.organization-chairman-head {
  position: relative;
  min-height: 330px;
  padding: 38px 32px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
  background: linear-gradient(145deg, #211d1b 0%, #110e0d 100%);
  color: #fff;
  padding-top: 104px;
}

.organization-chairman-head:before {
  content: "MESSAGE";
  position: absolute;
  left: -8px;
  top: 30px;
  color: rgba(255, 255, 255, 0.045);
  font: italic 900 62px/1 Georgia,
    serif;
  letter-spacing: -0.06em;
  white-space: nowrap;
}

.organization-chairman-head:after {
  content: "";
  position: absolute;
  left: 32px;
  top: 77px;
  width: 48px;
  height: 2px;
  background: #c8000a;
}

.organization-chairman-head > span {
  position: absolute;
  left: 32px;
  top: 46px;
  color: #ff7278;
  font-size: 8px;
  font-weight: 900;
  letter-spacing: 0.19em;
}

.organization-chairman-head > small {
  position: relative;
  z-index: 1;
  margin-bottom: 13px;
  color: #eee8e3;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: 0.1em;
}

/* 見出しの語句途中での改行を防ぐ */
.organization-chairman-head > strong > span {
  display: inline-block;
}

/* 理事長写真（丸型）：赤ライン＋細いリングで額装 */
.organization-chairman-photo {
  position: relative;
  z-index: 1;
  width: 148px;
  aspect-ratio: 1;
  margin: 0 0 24px;
  padding: 5px;
  border-radius: 50%;
  background: conic-gradient(from 210deg, #c8000a 0deg, #ff4d55 120deg, #6d0005 240deg, #c8000a 360deg);
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.14),
    0 16px 34px rgba(0, 0, 0, 0.45);
}

.organization-chairman-photo:after {
  content: "";
  position: absolute;
  inset: -9px;
  border: 1px solid rgba(255, 255, 255, 0.16);
  border-radius: 50%;
  pointer-events: none;
}

.organization-chairman-photo img {
  width: 100%;
  height: 100%;
  display: block;
  object-fit: cover;
  object-position: 50% 30%;
  border: 3px solid #161210;
  border-radius: 50%;
}

.organization-chairman-head > strong {
  position: relative;
  z-index: 1;
  font-size: clamp(20px, 1.9vw, 24px);
  line-height: 1.6;
  letter-spacing: 0.02em;
}

.organization-chairman-body {
  position: relative;
  align-self: stretch;
  padding: clamp(40px, 5vw, 60px);
  display: flex;
  flex-direction: column;
  justify-content: center;
}

.organization-chairman-quote {
  position: absolute;
  right: 32px;
  top: 13px;
  color: #b60008;
  font: italic 900 78px/1 Georgia,
    serif;
  opacity: 0.16;
}

.organization-chairman-body > p {
  position: relative;
  z-index: 1;
  margin: 0;
  color: #302a26;
  font-size: 13.5px;
  font-weight: 600;
  line-height: 2.15;
}

.organization-chairman-sign {
  display: flex;
  flex-direction: column;
  align-items: flex-end;
  margin-top: 26px;
  padding-top: 18px;
  border-top: 1px solid #d6ccc4;
}

.organization-chairman-sign small {
  color: #746b64;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: 0.08em;
}

.organization-chairman-sign strong {
  margin-top: 6px;
  color: #1b1715;
  font-size: 16px;
  letter-spacing: 0.08em;
}

.profile-section {
  background: #fff;
}

.profile-list {
  border-top: 1px solid #cfc7bf;
}

.profile-list > div {
  display: grid;
  grid-template-columns: minmax(145px, 0.34fr) 1fr;
  gap: 30px;
  align-items: center;
  min-height: 92px;
  padding: 18px 8px;
  border-bottom: 1px solid #ddd6ce;
  transition: padding 0.35s,
    background 0.35s,
    border-color 0.35s;
}

.profile-list > div:hover {
  padding-inline: 20px;
  background: #f6f2ee;
  border-bottom-color: #8e0000;
}

.profile-list span {
  display: flex;
  flex-direction: column;
  gap: 5px;
  color: #38322e;
  font-size: 12px;
  font-weight: 900;
}

.profile-list span small {
  color: #8e0000;
  font-size: 7px;
  letter-spacing: 0.15em;
}

.profile-list strong {
  font-size: 14px;
  line-height: 1.75;
}

@media (max-width: 1180px) {
  .about-side {
    top: 92px;
  }

  .about-content-section {
    scroll-margin-top: 92px;
  }
}

@media (max-width: 900px) {
  .about-core {
    scroll-margin-top: 68px;
  }

  .about-page-layout {
    display: block;
    width: 100%;
    padding-top: 0;
  }

  .about-side {
    top: 68px;
    margin-bottom: 18px;
    background: #171413;
  }

  .about-side .boys-side-box {
    width: 100%;
    min-width: 0;
    box-shadow: 0 9px 24px rgba(20, 10, 8, 0.18);
  }

  .about-side .boys-side-box > p {
    display: none;
  }

  .about-side nav {
    width: 100%;
    display: grid;
    padding: 5px;
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .about-side nav a {
    width: 100%;
    min-width: 0;
    max-width: none;
    min-height: 60px;
    padding: 8px;
    grid-template-columns: 20px minmax(0, 1fr) 11px;
    border-right: 1px solid rgba(255, 255, 255, 0.09);
    border-bottom: 1px solid rgba(255, 255, 255, 0.09);
  }

  .about-side nav a:nth-child(1) {
    grid-column: 1/3;
  }

  .about-side nav a:nth-child(2) {
    grid-column: 3/5;
  }

  .about-side nav a:nth-child(3) {
    grid-column: 5/7;
    border-right: 0;
  }

  .about-side nav a:before {
    left: 8px;
    right: 8px;
    top: auto;
    bottom: 0;
    width: auto;
    height: 3px;
    transform: scaleX(0);
  }

  .about-side nav a.is-current:before {
    transform: scaleX(1);
  }

  .about-side nav a strong {
    font-size: 10px;
  }

  .about-side nav a > span {
    font-size: 10px;
  }

  .about-purpose-origin-grid {
    grid-template-columns: 1fr;
  }

  .about-purpose-footer {
    grid-template-columns: 1fr;
  }

  .about-goal-grid {
    grid-template-columns: 1fr;
  }

  .about-goal-grid article {
    min-height: 0;
    display: grid;
    grid-template-columns: 46px minmax(0, 1fr);
    gap: 20px;
    padding: 26px 8px;
    border-right: 0;
    border-bottom: 1px solid #ddd5ce;
  }

  .about-goal-grid article:last-child {
    border-bottom: 0;
  }

  .about-goal-grid h4 {
    margin: 0 0 11px;
  }

  .about-goal-grid article > b {
    writing-mode: horizontal-tb;
  }

  .about-content-column {
    width: min(calc(100% - var(--gutter) * 2), 820px);
    margin-inline: auto;
  }

  .about-content-section {
    scroll-margin-top: 174px;
  }

  .history-intro {
    grid-template-columns: 1fr;
  }

  .organization-chart {
    padding: 28px;
  }
}

@media (max-width: 650px) {
  .about-core {
    scroll-margin-top: 60px;
  }

  .about-core > img {
    object-position: 58% top;
  }

  .about-core-shade {
    background: linear-gradient(0deg, rgba(18, 8, 6, 0.98) 0%, rgba(26, 8, 6, 0.88) 72%, rgba(22, 8, 5, 0.48) 100%);
  }

  .about-core-inner {
    padding-block: 32px 48px;
  }

  .about-k-principles {
    gap: 15px;
    margin-block: 38px 54px;
  }

  .about-k-principles article {
    align-items: center;
    flex-direction: column;
    gap: 2px;
    padding: 7px 0;
  }

  .about-k-principles strong {
    font-size: clamp(19px, 5.8vw, 30px);
    line-height: 1.4;
    letter-spacing: -0.045em;
    white-space: nowrap;
  }

  .about-k-principles small {
    font-size: clamp(12px, 3.6vw, 15px);
    line-height: 1.55;
    letter-spacing: 0.01em;
  }

  .about-purpose-origin > header {
    align-items: center;
    flex-direction: row;
    gap: 16px;
    padding: 19px 0;
  }

  .about-purpose-origin > header span {
    font-size: 9px;
    letter-spacing: 0.17em;
  }

  .about-purpose-origin-grid > article {
    padding: 27px 21px;
  }

  .about-purpose-origin-grid h4 {
    font-size: 21px;
  }

  .about-purpose-card blockquote {
    padding: 18px 0 18px 17px;
    font-size: 14px;
    line-height: 1.95;
  }

  .about-purpose-origin-grid p {
    font-size: 11.8px;
  }

  .about-origin-card p {
    font-size: 12.5px;
  }

  .about-purpose-footer {
    padding: 22px 20px;
  }

  .about-purpose-footer p {
    color: #fff;
    font-size: 11.5px;
  }

  .about-year-goal {
    margin-inline: -2px;
    padding: 26px 18px;
  }

  .about-year-goal > header {
    align-items: flex-start;
    flex-direction: column;
    gap: 19px;
  }

  .about-year-goal > header > strong {
    display: flex;
    width: 100%;
    justify-content: space-between;
    align-items: flex-end;
    font-size: 40px;
  }

  .about-year-goal > header small {
    max-width: 105px;
    font-size: 8px;
    line-height: 1.5;
    text-align: right;
  }

  .about-goal-grid article {
    grid-template-columns: 40px minmax(0, 1fr);
    gap: 13px;
    padding: 24px 0;
  }

  .about-goal-grid article > span {
    width: 36px;
    height: 36px;
  }

  .about-goal-grid h4 {
    font-size: 17px;
  }

  .about-goal-grid p {
    font-size: 12.5px;
  }

  .about-goal-grid article > b {
    right: 2px;
    font-size: 24px;
  }

  .about-side {
    top: 60px;
  }

  .about-side nav a {
    min-height: 57px;
    padding: 7px 5px;
    grid-template-columns: 17px minmax(0, 1fr);
    gap: 4px;
  }

  .about-side nav a > b {
    display: none;
  }

  .about-side nav a strong {
    font-size: 9px;
    letter-spacing: 0.04em;
  }

  .about-side nav a > span {
    font-size: 9px;
  }

  .about-content-column {
    width: calc(100% - 24px);
  }

  .about-content-section {
    scroll-margin-top: 158px;
    padding: 30px 18px;
  }

  .about-section-head {
    grid-template-columns: 1fr;
    gap: 15px;
    margin-bottom: 28px;
  }

  .about-section-head > p {
    grid-column: 1;
  }

  .about-section-head h2 {
    font-size: 35px;
  }

  .about-section-head > span {
    font-size: 12px;
  }

  .history-intro {
    gap: 20px;
  }

  .history-timeline:before {
    left: 7px;
  }

  .history-timeline article {
    grid-template-columns: 1fr;
    gap: 12px;
    padding: 0 0 32px 30px;
  }

  .history-timeline article:before {
    left: 1px;
    top: 7px;
  }

  .history-year {
    text-align: left;
  }

  .history-year span {
    font-size: 28px;
  }

  .history-year strong {
    font-size: 10.5px;
  }

  .history-story {
    padding-bottom: 24px;
  }

  .history-timeline article:hover .history-story {
    padding-left: 8px;
  }

  .history-story small {
    font-size: 11.5px;
  }

  .history-story p {
    font-size: 13px;
  }

  .league-profile {
    margin-top: 21px;
    padding: 20px 16px;
  }

  .league-profile-head {
    grid-template-columns: 1fr;
    gap: 18px;
  }

  .history-story .league-official-link {
    width: 100%;
  }

  .league-profile-lead {
    font-size: 12px !important;
  }

  .league-scale {
    grid-template-columns: 1fr;
  }

  .league-scale-card {
    padding: 18px;
  }

  .league-scale-card header {
    min-height: 0;
  }

  .league-scale-card dl {
    display: grid;
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 12px;
  }

  .league-scale-card dl > div {
    display: block;
    min-height: 0;
  }

  .league-scale-card dl > div + div {
    margin: 0;
    padding: 0 0 0 12px;
    border-top: 0;
    border-left: 1px solid rgba(255, 255, 255, 0.09);
  }

  .league-scale-card dt {
    display: block;
    margin-bottom: 8px;
  }

  .league-scale-card dd {
    justify-content: flex-start;
    text-align: left;
  }

  .organization-chart {
    padding: 22px 14px;
  }

  .org-board {
    width: 100%;
    min-height: 130px;
  }

  .org-connector-main {
    height: 44px;
  }

  .org-connector-main:before {
    height: 44px;
  }

  .org-teams {
    gap: 8px;
    padding-top: 28px;
  }

  .org-teams a {
    min-height: 145px;
    padding: 18px 14px;
  }

  .org-teams a strong {
    font-size: 16px;
    line-height: 1.45;
  }

  .org-teams a > b {
    right: 15px;
    bottom: 14px;
  }

  .profile-list > div {
    grid-template-columns: 1fr;
    gap: 10px;
    padding: 17px 5px;
  }

  .profile-list > div:hover {
    padding-inline: 12px;
  }

  .profile-list strong {
    font-size: 13px;
  }
}

@media (max-width: 370px) {
  .about-content-column {
    width: calc(100% - 20px);
  }

  .about-side {
    top: 58px;
  }

  .about-side nav a strong {
    font-size: 8px;
  }

  .org-teams {
    grid-template-columns: 1fr;
  }

  .org-connector-main {
    border-bottom: 0;
    border-left: 1px solid #6e6560;
  }

  .org-teams a:before {
    display: none;
  }
}

/* 決算報告 */

@media (max-width: 900px) {
  .about-side nav a:nth-child(n) {
    grid-column: auto;
    border-right: 1px solid rgba(255, 255, 255, 0.09);
    border-bottom: 1px solid rgba(255, 255, 255, 0.09);
  }

  .about-side nav a:nth-child(2n) {
    border-right: 0;
  }

  .about-side nav a:nth-child(n/**/+3) {
    border-bottom: 0;
  }

  .organization-chairman {
    grid-template-columns: 210px minmax(0, 1fr);
  }

  .organization-chairman-head {
    padding: 100px 25px 30px;
  }

  .organization-chairman-photo {
    width: 128px;
  }

  .organization-chairman-head > span {
    left: 25px;
  }

  .organization-chairman-head:after {
    left: 25px;
  }

  .organization-chairman-body {
    padding: 34px;
  }
}

@media (max-width: 650px) {
  .organization-chairman {
    grid-template-columns: 1fr;
  }

  .organization-chairman-head {
    min-height: 230px;
    padding: 96px 24px 30px;
  }

  .organization-chairman-photo {
    width: 120px;
    margin-bottom: 20px;
  }

  .organization-chairman-head > span {
    left: 24px;
    top: 34px;
  }

  .organization-chairman-head:after {
    left: 24px;
    top: 64px;
  }

  .organization-chairman-head:before {
    top: 24px;
    font-size: 51px;
  }

  .organization-chairman-body {
    padding: 34px 22px 28px;
  }

  .organization-chairman-body > p {
    font-size: 13px;
    line-height: 2;
  }

  .organization-chairman-quote {
    right: 18px;
    top: 7px;
  }

  .org-connector-main {
    width: calc(50% + 4px);
  }

  .org-teams a:before {
    top: -28px;
    height: 28px;
  }
}

.league-scale-card dd > .league-division-note {
  flex: 0 0 auto;
  color: #ddd5d0;
  font-size: 10px;
  line-height: 1;
  white-space: nowrap;
}

@media (max-width: 480px) {
  .league-scale-card dl {
    grid-template-columns: 1fr;
    gap: 0;
  }

  .league-scale-card dl > div {
    display: block;
  }

  .league-scale-card dl > div + div {
    margin-top: 13px;
    padding: 13px 0 0;
    border-top: 1px solid rgba(255, 255, 255, 0.09);
    border-left: 0;
  }

  .league-scale-card dt {
    margin-bottom: 9px;
  }

  .league-scale-card dd {
    min-width: 0;
    justify-content: flex-start;
    text-align: left;
  }

  .league-team-breakdown dd {
    display: grid;
    grid-template-columns: 1fr;
  }
}

@media (max-width: 900px) {
  .about-side nav a small {
    font-size: 10px;
  }
}

@media (max-width: 650px) {
  .about-side nav a small {
    font-size: 9.5px;
  }
}

@media (max-width: 370px) {
  .about-side nav a small {
    font-size: 9px;
  }
}

.org-teams a:is(:hover, .is-hover) > span,
.org-teams a:focus-visible > span {
  color: var(--about-red);
}

@keyframes about-principles-reveal {
  from {
    opacity: 0;
    transform: translateY(12px);
  }

  to {
    opacity: 1;
    transform: none;
  }
}

.about-k-char {
  position: relative;
  display: inline-block;
}

.about-k-char.is-space {
  width: 0.3em;
}

.about-k-principles article.is-k-active .about-k-char {
  animation-name: k-text-flicker;
  animation-duration: var(--k-duration, 1.55s);
  animation-timing-function: linear;
  animation-fill-mode: both;
  animation-delay: calc(0.38s + var(--k-delay, 0ms));
}

@keyframes k-text-flicker {
  0% {
    opacity: 0;
    color: var(--k-red-1, #ff2440);
    filter: brightness(1);
    text-shadow: none;
    transform: translateY(6px) rotate(var(--k-tilt-a, -1deg));
  }

  7% {
    opacity: 0.18;
    color: var(--k-red-2, #dc001e);
    filter: brightness(1.08);
  }

  13% {
    opacity: 1;
    color: var(--k-red-3, #ff6170);
    filter: brightness(1.28);
  }

  19% {
    opacity: 0.36;
    color: var(--k-red-1, #ff2440);
    filter: brightness(0.95);
  }

  27% {
    opacity: 0.92;
    color: var(--k-red-2, #dc001e);
    filter: brightness(1.18);
    transform: translateY(3px) rotate(var(--k-tilt-b, 0.6deg));
  }

  34% {
    opacity: 0.12;
    color: var(--k-red-3, #ff6170);
    filter: brightness(1);
  }

  42% {
    opacity: 1;
    color: var(--k-red-1, #ff2440);
    filter: brightness(1.32);
  }

  50% {
    opacity: 0.48;
    color: var(--k-red-3, #ff6170);
    filter: brightness(1.08);
  }

  58% {
    opacity: 0.96;
    color: var(--k-red-2, #dc001e);
    filter: brightness(1.24);
    transform: translateY(1px) rotate(var(--k-tilt-a, -1deg));
  }

  67% {
    opacity: 0.24;
    color: var(--k-red-1, #ff2440);
    filter: brightness(1);
  }

  75% {
    opacity: 1;
    color: var(--about-gold, #d6bd8f);
    filter: brightness(1.34);
    text-shadow: 0 0 11px rgba(214, 189, 143, 0.34);
  }

  83% {
    opacity: 0.82;
    color: #f0dfbd;
    filter: brightness(1.2);
    text-shadow: 0 0 7px rgba(214, 189, 143, 0.2);
  }

  100% {
    opacity: 1;
    color: #fff;
    filter: brightness(1);
    text-shadow: none;
    transform: translateY(0) rotate(0);
  }
}

/* =========================================================
   目次（900px以下）共通仕様：boys / guide / about で統一
   3列表示・/boys/準拠の余白、高さはboysより少し短く（48px → 44px）
   ※ boys.css / guide.css / about.css の末尾に同じ内容を記載しています
   ========================================================= */
@media (max-width: 900px) {
  .boys-side nav {
    grid-template-columns: repeat(3, minmax(0, 1fr));
    padding: 4px;
  }
  .boys-side nav a,
  .boys-side nav a:nth-child(n) {
    grid-column: auto;
    width: auto;
    min-width: 0;
    min-height: 44px;
    padding: 5px;
    grid-template-columns: 20px minmax(0, 1fr) 11px;
    gap: 7px;
    border-right: 1px solid rgba(255, 255, 255, 0.09);
    border-bottom: 1px solid rgba(255, 255, 255, 0.09);
  }
  .boys-side nav a:nth-child(3n) {
    border-right: 0;
  }
  .boys-side nav a:nth-last-child(-n + 3) {
    border-bottom: 0;
  }
  .boys-side nav a strong {
    gap: 3px;
    font-size: 10px;
  }
  .boys-side nav a > span {
    font-size: 10px;
  }
  .boys-side nav a small {
    font-size: 10px;
  }
}
@media (max-width: 650px) {
  .boys-side nav a,
  .boys-side nav a:nth-child(n) {
    padding: 5px;
    grid-template-columns: 17px minmax(0, 1fr);
    gap: 4px;
  }
  .boys-side nav a > b {
    display: none;
  }
  .boys-side nav a strong {
    font-size: 9px;
    letter-spacing: 0.03em;
  }
  .boys-side nav a > span {
    font-size: 9px;
  }
  .boys-side nav a small {
    font-size: 9.5px;
  }
}
@media (max-width: 370px) {
  .boys-side nav a strong {
    font-size: 8px;
  }
  .boys-side nav a small {
    font-size: 9px;
  }
}

/* 沿革：1998年 ロゴ（K.club レトロスポーツロゴ） */

.history-story-origin {
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(200px, 22vw, 270px);
  align-items: center;
  gap: clamp(20px, 3vw, 36px);
}

.history-origin-logo {
  margin: 6px 6px 0;
}

.history-origin-logo span {
  display: grid;
  place-items: center;
  padding: 18px 20px;
  background: #f6f1e8;
  border: 1px solid #d6bd8f;
  box-shadow: 0 0 0 5px #171413,
    0 0 0 6px rgba(214, 189, 143, 0.45),
    0 16px 32px rgba(0, 0, 0, 0.28);
}

.history-origin-logo img {
  width: 100%;
  height: auto;
}

@media (max-width: 650px) {
  .history-story-origin {
    grid-template-columns: 1fr;
    gap: 22px;
  }

  .history-origin-logo {
    width: min(260px, 78%);
    margin-inline: 6px;
  }
}

/* 沿革：2026年5月 新ロゴ誕生（クリックで OUR SYMBOL ポップアップ） */

.history-timeline article.history-new-logo:before {
  border-color: #d6bd8f;
  background: #d6bd8f;
}

.history-story-logo {
  display: grid;
  grid-template-columns: minmax(0, 1fr) clamp(230px, 26vw, 320px);
  align-items: center;
  gap: clamp(20px, 3vw, 36px);
}

.history-logo-trigger {
  display: block;
  width: 100%;
  margin: 6px 6px 0 0;
  padding: 0;
  border: 0;
  background: none;
  color: inherit;
  font: inherit;
  text-align: left;
  cursor: pointer;
}

.history-logo-frame {
  position: relative;
  display: grid;
  place-items: center;
  padding: clamp(16px, 2vw, 22px) clamp(14px, 1.8vw, 20px);
  overflow: hidden;
  background: #fff;
  border: 1px solid #d6bd8f;
  box-shadow: 0 0 0 5px #171413,
    0 0 0 6px rgba(214, 189, 143, 0.45),
    0 16px 32px rgba(0, 0, 0, 0.28);
  transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1),
    box-shadow 0.45s;
}

/* 光沢が横切る演出 */
.history-logo-frame:after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;
  left: -60%;
  width: 40%;
  background: linear-gradient(100deg, transparent, rgba(255, 255, 255, 0.75), transparent);
  transform: skewX(-18deg);
  transition: left 0.8s cubic-bezier(0.22, 1, 0.36, 1);
  pointer-events: none;
}

.history-logo-frame img {
  width: 100%;
  height: auto;
  transition: transform 0.45s cubic-bezier(0.22, 1, 0.36, 1);
}

.history-logo-cta {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 16px;
  padding: 10px 14px;
  background: #a40008;
  color: #fff;
  transition: background 0.3s;
}

.history-logo-cta b {
  font: italic 900 12px/1 Georgia,
    serif;
  letter-spacing: 0.1em;
}

.history-logo-cta em {
  flex: 1 1 auto;
  font-size: 12px;
  font-style: normal;
  font-weight: 800;
  letter-spacing: 0.04em;
}

.history-logo-cta i {
  display: grid;
  place-items: center;
  width: 22px;
  height: 22px;
  border: 1px solid rgba(255, 255, 255, 0.6);
  border-radius: 50%;
  font-size: 13px;
  font-style: normal;
  line-height: 1;
  transition: transform 0.35s,
    background 0.35s,
    color 0.35s;
}

.history-logo-trigger:hover .history-logo-frame,
.history-logo-trigger:focus-visible .history-logo-frame {
  transform: translateY(-3px);
  box-shadow: 0 0 0 5px #171413,
    0 0 0 6px rgba(214, 189, 143, 0.8),
    0 22px 40px rgba(0, 0, 0, 0.36);
}

.history-logo-trigger:hover .history-logo-frame:after,
.history-logo-trigger:focus-visible .history-logo-frame:after {
  left: 120%;
}

.history-logo-trigger:hover .history-logo-frame img {
  transform: scale(1.03);
}

.history-logo-trigger:hover .history-logo-cta,
.history-logo-trigger:focus-visible .history-logo-cta {
  background: #c51118;
}

.history-logo-trigger:hover .history-logo-cta i,
.history-logo-trigger:focus-visible .history-logo-cta i {
  background: #fff;
  color: #a40008;
  transform: rotate(90deg);
}

.history-logo-trigger:focus-visible {
  outline: 2px solid #d6bd8f;
  outline-offset: 10px;
}

@media (max-width: 650px) {
  .history-story-logo {
    grid-template-columns: 1fr;
    gap: 20px;
  }

  .history-logo-trigger {
    width: min(320px, calc(100% - 12px));
    margin-inline: 6px;
  }
}

/* ポップアップ：OUR SYMBOL */

.symbol-dialog {
  --symbol-navy: #16264a;
  --symbol-red: #b0101c;
  width: min(640px, calc(100% - 32px));
  max-width: none;
  max-height: calc(100dvh - 32px);
  margin: auto;
  padding: 0;
  overflow: auto;
  border: 0;
  background: #fff;
  color: var(--ink, #171413);
  box-shadow: 0 30px 80px rgba(0, 0, 0, 0.45);
  overscroll-behavior: contain;
}

.symbol-dialog::backdrop {
  background: rgba(13, 17, 30, 0.78);
  backdrop-filter: blur(4px);
}

.symbol-dialog[open] {
  animation: symbol-dialog-in 0.5s cubic-bezier(0.22, 1, 0.36, 1);
}

.symbol-dialog[open]::backdrop {
  animation: symbol-backdrop-in 0.4s ease;
}

@keyframes symbol-dialog-in {
  from {
    opacity: 0;
    transform: translateY(18px) scale(0.97);
  }
  to {
    opacity: 1;
    transform: none;
  }
}

@keyframes symbol-backdrop-in {
  from {
    opacity: 0;
  }
  to {
    opacity: 1;
  }
}

.symbol-dialog-inner {
  position: relative;
  border-top: 6px solid var(--symbol-red);
}

.symbol-dialog-inner:before {
  content: "";
  position: absolute;
  left: 0;
  right: 0;
  top: 0;
  height: 3px;
  background: var(--symbol-navy);
}

.symbol-dialog-close {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 1px solid #d9dde6;
  border-radius: 50%;
  background: #fff;
  color: var(--symbol-navy);
  font-size: 22px;
  line-height: 1;
  cursor: pointer;
  transition: background 0.25s,
    color 0.25s,
    transform 0.3s;
}

.symbol-dialog-close:hover,
.symbol-dialog-close:focus-visible {
  background: var(--symbol-navy);
  color: #fff;
  transform: rotate(90deg);
}

.symbol-dialog-visual {
  padding: clamp(36px, 6vw, 52px) clamp(24px, 6vw, 56px) clamp(24px, 4vw, 34px);
  background: linear-gradient(135deg, transparent 0 46%, rgba(176, 16, 28, 0.05) 46% 54%, transparent 54%), #f5f6f9;
  border-bottom: 1px solid #e3e6ee;
}

.symbol-dialog-visual img {
  display: block;
  width: 100%;
  max-width: 460px;
  height: auto;
  margin: 0 auto;
}

.symbol-dialog-body {
  padding: clamp(24px, 4vw, 36px) clamp(22px, 5vw, 48px) clamp(28px, 4.4vw, 40px);
}

.symbol-dialog-kicker {
  display: flex;
  align-items: center;
  gap: 10px;
  margin: 0;
  color: var(--symbol-red);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: 0.16em;
}

.symbol-dialog-kicker i {
  width: 28px;
  height: 1px;
  background: currentColor;
}

.symbol-dialog-body h2 {
  margin: 8px 0 16px;
  color: var(--symbol-navy);
  font: italic 900 clamp(30px, 5vw, 40px)/1 Georgia,
    serif;
  letter-spacing: 0.04em;
}

.symbol-dialog-lead {
  margin: 0;
  font-size: 15px;
  font-weight: 800;
  line-height: 1.9;
}

.symbol-dialog-lead span {
  display: inline-block;
  padding: 0 0.35em;
  margin: 0 0.1em;
  font-weight: 900;
}

.symbol-dialog-lead .is-red {
  background: var(--symbol-red);
  color: #fff;
}
.symbol-dialog-lead .is-navy {
  background: var(--symbol-navy);
  color: #fff;
}
.symbol-dialog-lead .is-white {
  background: #fff;
  color: var(--symbol-navy);
  box-shadow: inset 0 0 0 1px #c9cfdb;
}

.symbol-dialog-points {
  display: grid;
  gap: 12px;
  margin: 20px 0 0;
  padding: 0;
  list-style: none;
}

.symbol-dialog-points li {
  display: grid;
  grid-template-columns: 40px minmax(0, 1fr);
  align-items: start;
  gap: 14px;
  padding: 14px 16px;
  border-left: 3px solid var(--symbol-red);
  background: #f5f6f9;
}

.symbol-dialog-points b {
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  background: var(--symbol-navy);
  color: #fff;
  font: italic 900 20px/1 Georgia,
    serif;
}

.symbol-dialog-points p {
  margin: 0;
  color: #2f2926;
  font-size: 14px;
  font-weight: 600;
  line-height: 1.9;
}

.symbol-dialog-points strong {
  color: var(--symbol-navy);
  font-weight: 900;
}

@media (max-width: 650px) {
  .symbol-dialog-lead {
    font-size: 14px;
  }
  .symbol-dialog-points li {
    grid-template-columns: 34px minmax(0, 1fr);
    gap: 12px;
    padding: 12px;
  }
  .symbol-dialog-points b {
    width: 34px;
    height: 34px;
    font-size: 17px;
  }
  .symbol-dialog-points p {
    font-size: 13px;
  }
  .symbol-dialog-points strong {
    word-break: break-word;
  }
}

@media (prefers-reduced-motion: reduce) {
  .symbol-dialog[open],
  .symbol-dialog[open]::backdrop {
    animation: none;
  }
  .history-logo-frame,
  .history-logo-frame:after,
  .history-logo-frame img {
    transition: none;
  }
}

body.symbol-dialog-open {
  overflow: hidden;
}

.history-logo-title {
  display: inline-block;
}

/* 法人概要：理事（.profile-board-row 内）
 * .board-group が役職ひとつ分（人数は自由に増減できます）。
 * --lead（理事長・副理事長）は名前を大きく、--auditor（監事）は枠付きで表示します。
 */

.profile-list > .profile-board-row {
  align-items: start;
  padding-block: 30px 34px;
}

.profile-list > .profile-board-row:hover {
  padding-inline: 8px;
  background: transparent;
}

.board {
  display: grid;
  gap: 26px;
}

.board-group {
  min-width: 0;
}

.board-group h3 {
  display: flex;
  align-items: center;
  gap: 12px;
  margin: 0 0 6px;
  color: #1b1715;
  font-size: 14px;
  font-weight: 900;
  letter-spacing: 0.08em;
  line-height: 1.4;
}

.board-group h3::before {
  content: "";
  width: 3px;
  height: 14px;
  background: #8e0000;
}

.board-group h3::after {
  content: "";
  flex: 1;
  height: 1px;
  background: #ddd6ce;
}

.board-group ul {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(124px, 1fr));
  margin: 0;
  padding: 0;
  list-style: none;
}

.board-group li {
  position: relative;
  padding: 11px 8px 11px 16px;
  border-bottom: 1px solid #ebe5de;
  color: #2a2421;
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0.06em;
  line-height: 1.5;
  white-space: nowrap;
}

.board-group li::before {
  content: "";
  position: absolute;
  top: 50%;
  left: 4px;
  width: 4px;
  height: 4px;
  background: #8e0000;
  transform: translateY(-50%) rotate(45deg);
}

/* 理事長・副理事長 */
.board-group--lead ul {
  grid-template-columns: repeat(auto-fill, minmax(186px, 1fr));
}

.board-group--lead li {
  padding-block: 14px;
  padding-left: 20px;
  color: #1b1715;
  font-size: 18px;
  font-weight: 900;
  letter-spacing: 0.1em;
}

.board-group--lead li::before {
  width: 6px;
  height: 6px;
}

/* 監事 */
.board-group--auditor {
  padding: 16px 20px 6px;
  background: #faf8f5;
  border: 1px solid #ebe5de;
}

.board-group--auditor li {
  border-bottom: 0;
}

.board-group--auditor li::before {
  background: #c4b8ad;
}

@media (max-width: 900px) {
  .profile-list > .profile-board-row {
    grid-template-columns: 1fr;
    gap: 16px;
  }
}

@media (max-width: 650px) {
  .profile-list > .profile-board-row {
    padding: 22px 5px 26px;
  }

  .profile-list > .profile-board-row:hover {
    padding-inline: 5px;
  }

  .board {
    gap: 20px;
  }

  .board-group ul {
    grid-template-columns: repeat(auto-fill, minmax(112px, 1fr));
  }

  .board-group li {
    padding: 10px 6px 10px 15px;
    font-size: 13px;
  }

  .board-group--lead ul {
    grid-template-columns: repeat(auto-fill, minmax(140px, 1fr));
  }

  .board-group--lead li {
    padding-block: 12px;
    font-size: 16px;
  }

  .board-group--auditor {
    padding: 14px 14px 4px;
  }
}