/* =============================
   Base tokens
============================= */
:root{
  --c-bg:#ffffff;
  --c-text:#222;
  --c-muted:#f5f5f7;
  --c-border:#e5e7eb;
  --c-key:#0f766e;      /* ティール系 */
  --c-key-weak:#def2f0; /* 薄いティール */
  --c-link:#0a66c2;
  --radius:14px;
  --shadow:0 8px 20px rgba(0,0,0,.08);
  --maxw:960px;

  /* Mega menu */
  --header-h:64px;
  --mega-bg:#0f766e;
  --mega-bg-to:#0a4f49;
  --mega-fg:#ffffff;
  --mega-maxw:1440px;   /* 中身の最大幅（広め） */
}

*{box-sizing:border-box}
html,body{margin:0;padding:0}
body{
  font-family: system-ui, -apple-system, "Segoe UI", Roboto, "Noto Sans JP", "Hiragino Kaku Gothic ProN", Meiryo, sans-serif;
  color:var(--c-text);
  background:var(--c-bg);
  line-height:1.7;
  font-size:16px;
}
img{max-width:100%;height:auto;display:block}
a{color:var(--c-link);text-decoration:none}
a:hover{opacity:.85}
.container{max-width:var(--maxw);margin:0 auto;padding:0 16px}

/* =============================
   Accessibility
============================= */
.skip-link{
  position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden
}
.skip-link:focus{
  position:static;width:auto;height:auto;padding:.5em 1em;background:#000;color:#fff;display:inline-block
}

/* =============================
   Header / Global Nav
============================= */
.site-header{
  border-bottom:1px solid var(--c-border);
  background:#fff;
  position:sticky;top:0;z-index:50;
}
.header-inner{
  display:flex;align-items:center;justify-content:space-between;
  height:64px;gap:12px;
}
.logo{display:flex;align-items:center;gap:10px;color:inherit}
.logo-mark{
  width:28px;height:28px;border-radius:50%;
  display:inline-grid;place-items:center;
  background:var(--c-key);color:#fff;font-weight:700;
}
.logo-text{font-weight:700;letter-spacing:.04em}

.global-nav ul{display:flex;gap:22px;list-style:none;margin:0;padding:0}
.global-nav a{display:inline-block;padding:10px 0;color:inherit}
.global-nav a:hover{color:var(--c-key)}
@media (max-width: 767px){
.global-nav ul{display:flex;gap:22px;list-style:none;margin:0;padding:0}

}
.nav-toggle{display:none}
.nav-toggle-label{
  display:none;cursor:pointer;width:36px;height:36px;gap:5px;align-items:center;justify-content:center;
}
.nav-toggle-label span{
  display:block;width:24px;height:2px;background:#222;border-radius:2px;position:relative
}
@media (max-width: 767px){
  .nav-toggle-label{display:flex}
  .global-nav{
    position:fixed;inset:64px 0 auto 0;background:#fff;border-top:1px solid var(--c-border);
    transform:translateY(-10px);opacity:0;pointer-events:none;transition:.2s ease;box-shadow:var(--shadow)
  }
  .global-nav ul{
    flex-direction:column;
    gap: 0em;
  }
  .global-nav a{
    padding:14px 16px;
    width: 100%;
  }
  .nav-toggle:checked ~ .global-nav{transform:translateY(0);opacity:1;pointer-events:auto}
}

/* =============================
   Hero
============================= */

/* HERO 全幅 */
.hero{
  width:100%;
  padding:0;
}

.hero-box{
  width:100%;
}

.hero-box img{
  width:100%;
  height:auto;
  display:block;
}

/* -------------------------
   HERO スマホ余白削除
------------------------- */
@media (max-width: 768px){

  .hero{
    padding:0;
    margin:0;
  }

  .hero .container{
    padding:0;
  }

  .hero-box{
    margin:0;
    padding:0;
  }

  .hero-box img{
    display:block;
    width:100%;
    height:auto;
  }

}


/* =============================
   Sections
============================= */
.section{padding:40px 0}
.section-muted{background:var(--c-muted)}
.sec-title{
  font-size:1.25rem;
  margin: 1.5em 0 1.5em;
  font-weight:700;
  border-left:6px solid var(--c-key);
  padding-left:10px;
}
.section-head{
  display:flex;align-items:flex-end;justify-content:space-between;gap:16px;margin-bottom:8px;
}
.more-link{font-size:.95rem}
@media (max-width: 767px){
  .section{padding:1em 0}
}

/* =============================
   News list
============================= */
.news-list{
  list-style:none;
  margin:0;
  padding:0;
  border-top:1px solid var(--c-border);
}

.news-list li{
  display:grid;
  grid-template-columns: 5.2em 4.5em 1fr;
  column-gap:12px;
  row-gap:6px;
  align-items:start;
  padding:14px 8px;
  border-bottom:1px dotted #d6d6d6;
}

.news-list time{
  grid-column:1;
  grid-row:1;
  font-variant-numeric:tabular-nums;
  color:#334155;
  white-space:nowrap;
}

.news-list .category{
  grid-column:2;
  grid-row:1;
  display:inline-block;
  min-width:3.5em;
  text-align:center;
  padding:.2em .6em;
  border-radius:999px;
  background:var(--c-key-weak);
  color:#0b4f4a;
  font-size:.8rem;
  white-space:nowrap;
}

.news-list .news-title-text{
  grid-column:3;
  grid-row:1;
  min-width:0;
  line-height:1.6;
  overflow-wrap:anywhere;
}

/* SP */
@media (max-width: 768px){
  .news-list li{
    grid-template-columns:auto auto 1fr;
    column-gap:8px;
    row-gap:6px;
  }

  .news-list time{
    grid-column:1;
    grid-row:1;
  }

  .news-list .category{
    grid-column:2;
    grid-row:1;
  }

  .news-list .news-title-text{
    grid-column:1 / -1;
    grid-row:2;
  }
}



/* =============================
   Card grid (a–f)
============================= */
.card-grid{
  display:grid;gap:16px;margin-top:12px;
  grid-template-columns: repeat(3, 1fr);
}
.card{
  display:block;padding:18px;border:1px solid var(--c-border);border-radius:var(--radius);background:#fff;box-shadow:var(--shadow);
}
.card h3{margin:.2em 0 .4em;font-size:1.05rem}
.card p{margin:0;color:#475569;font-size:.95rem}
@media (max-width: 1024px){
  .card-grid{grid-template-columns: repeat(2, 1fr);}
}
@media (max-width: 599px){
  .card-grid{grid-template-columns: 1fr;}
}

/* =============================
   CTA（共通ボタン）
============================= */
.cta-wrap{
  display:flex;gap:12px;justify-content:center;align-items:center;flex-wrap:wrap
}
.btn-primary,.btn-outline{
  display:inline-block;padding:12px 20px;border-radius:999px;font-weight:700;text-align:center;
}
.btn-primary{background:var(--c-key);color:#fff}
.btn-primary:hover{filter:brightness(.96)}
.btn-outline{border:2px solid var(--c-key);color:var(--c-key);background:#fff}
.btn-outline:hover{background:var(--c-key-weak)}

/* =============================
   Footer
============================= */
.site-footer{border-top:1px solid var(--c-border);background:#fff; padding: 0em 1em;}
.footer-inner{padding:24px 0}
.footer-title{margin:0 0 .4em;font-size:1.05rem}
.office p{margin:.2em 0}
.address-note{color:#64748b}
copyright, .copyright{display:block;margin-top:12px;color:#64748b}

/* =============================
   Utilities
============================= */
.section + .section{border-top:1px solid var(--c-border)}
.section + .info-group{border-top:none}
.info-group + .banner-section{margin-top:-4px}

/* =============================
   Info group (4本まとめ)
============================= */
.info-group{
  background: var(--c-muted);
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  overflow: clip;
  margin: 32px auto 36px;
}
.info-group .section{
  padding: 28px 0;
  border-top: 1px solid var(--c-border);
  background: transparent;
}
.info-group .section:first-child{ border-top: 0; }

/* =============================
   Banner section（従来ボックス版）
============================= */
.banner-section.banner-contrast{
  background: linear-gradient(180deg, #eef6ff 0%, #ffffff 60%);
  padding: 44px 0;
  border-top: 1px solid var(--c-border);
}
.banner-section{
  background: var(--c-muted);
  border-top: 1px solid var(--c-border);
  border-bottom: 1px solid var(--c-border);
}
.banner-section .sec-title{ text-align:left; margin-bottom:20px; }
.banner-section .panel{
  background:#fff; border:1px solid var(--c-border);
  border-radius:var(--radius); box-shadow:var(--shadow);
  padding:20px 16px 24px;
}
.banner-area{
  display:flex; flex-wrap:wrap; justify-content:center;
  gap:16px; margin-top:14px;
}
.banner{
  display:block; flex:1 1 45%; max-width:460px;
  border-radius:12px; overflow:hidden; box-shadow:var(--shadow);
  transition:transform .2s ease, opacity .2s ease;
}
.banner img{width:100%;height:auto;display:block}
.banner:hover{transform:scale(1.02);opacity:.92}
@media (max-width: 767px){
  .banner-area{flex-direction:column;gap:12px}
  .banner{flex:1 1 100%;max-width:100%}
}

/* =============================
   情報グループ（縦積みBOXリンク）
============================= */
.info-links { background: var(--c-muted); padding: 50px 0; border-top: 1px solid var(--c-border); border-bottom: 1px solid var(--c-border); }
.info-vertical { display: flex; flex-direction: column; gap: 16px; }
.info-box{
  display:block; background:#fff; border:1px solid var(--c-border);
  border-radius:var(--radius); box-shadow:var(--shadow);
  padding:24px 20px; color:inherit; text-decoration:none;
  transition: transform 0.2s ease, box-shadow 0.2s ease, border-color 0.2s ease;
}
.info-box:hover{ transform: translateY(-2px); box-shadow: 0 6px 20px rgba(0, 0, 0, 0.12); border-color: var(--c-key); }
.info-box h3{ margin:0 0 10px; font-size:1.1rem; color:var(--c-key); font-weight:700; }
.info-box p{ margin:0; font-size:.95rem; color:#475569; }

/* =============================
   コンテンツ：写真付きカード
============================= */
.content-grid{ display:grid; gap:20px; grid-template-columns: repeat(3, 1fr); }
.content-card{
  display:flex; flex-direction:column; background:#fff; border:1px solid var(--c-border);
  border-radius:var(--radius); box-shadow:var(--shadow); overflow:hidden; text-decoration:none; color:inherit;
  transition: transform .25s ease, box-shadow .25s ease;
}
.content-card:hover{ transform: translateY(-4px); box-shadow: 0 8px 24px rgba(0,0,0,.15); }
.content-img{ aspect-ratio:16/9; background-size:cover; background-position:center; background-color:#ddd; }
.content-body{ padding:18px; }
.content-body h3{ margin:0 0 6px; font-size:1.05rem; color:var(--c-key); font-weight:700; }
.content-body p{ margin:0; color:#475569; font-size:.95rem; }
@media (max-width: 1024px){ .content-grid{ grid-template-columns: repeat(2, 1fr); } }
@media (max-width: 599px){ .content-grid{ grid-template-columns: 1fr; } }

/* =============================
   CTAセクション（背景画像つき）
============================= */
.cta-section{
  position:relative; overflow:hidden; padding:80px 0; text-align:center; color:#fff;
}
.cta-bg{
  position:absolute; inset:0; background-image:url("images/wakayama_castle.jpg");
  background-size:cover; background-position:center; background-attachment:fixed; z-index:0; filter:brightness(.55);
}
.cta-wrap{
  position:relative; z-index:1; display:flex; justify-content:center; gap:20px; flex-wrap:wrap;
}
.btn-primary{
  background:var(--c-key); color:#fff; font-size:1.1rem; padding:14px 28px; border:none;
  box-shadow:0 4px 10px rgba(0,0,0,.25);
}
.btn-outline{
  border:2px solid #fff; color:#fff; background:transparent; font-size:1.1rem; padding:12px 26px; transition:background .3s ease;
}
.btn-outline:hover{ background:rgba(255,255,255,.15); }
@media (max-width: 767px){
  .cta-section{ padding:60px 0; }
  .btn-primary,.btn-outline{ width:100%; max-width:300px; }
}

/* =============================
   Mega Menu（通常の小パネル）
============================= */
.mega-parent{ position:relative; }
.nav-parent{
  background:none; border:0; color:inherit; font:inherit; cursor:pointer;
  display:inline-flex; align-items:center; gap:6px; padding:10px 0;
}
.nav-parent:hover{ color:var(--c-key); }
.nav-caret{ font-size:.8em; opacity:.8; }
@media (max-width:767px){
.nav-caret{ display: none; }
}
.mega-panel{
  position:absolute;
  left:0;
  top:100%;
  background:#fff;
  border:1px solid var(--c-border);
  /*
  border-radius:8px;
  */
  box-shadow:var(--shadow);
  padding:10px 16px;
  min-width:200px;
  display:none;
  z-index:40;
}
.mega-inner{ display:block; }
.mega-links{ list-style:none; margin:0; padding:0; }
.mega-links li a{
  display:block; padding:8px 0; color:inherit; text-decoration:none;
}
.mega-links li a:hover{ color:var(--c-key); }

@media (min-width:768px){
  .mega-parent:hover > .mega-panel{ display:block; }
  .mega-parent.open > .mega-panel{ display:block; }
}
@media (max-width:767px){
  .mega-panel{
    position:static; display:none; box-shadow:none; border:none;
    padding:0 16px 10px; background:#fff;
  }
  .mega-parent.open > .mega-panel{ display:block; }
  .nav-parent{ width:100%; text-align:left; padding:14px 16px; }
  .nav-parent::after{ content:"＋"; margin-left:auto; }
  .mega-parent.open .nav-parent::after{ content:"－"; }
}

/* =============================
   Mega Menu: Full-width panel（緑背景・白リンク）
============================= */
.mega-parent--fw{ position: static; } /* 画面いっぱいに出すため static 推奨 */
.mega-panel--fw{
  position: absolute; left: 0; right: 0; top: var(--header-h);
  background: linear-gradient(135deg, var(--mega-bg), var(--mega-bg-to));
  color: var(--mega-fg);
  display: none; z-index: 40; box-shadow: var(--shadow);
  padding: 0;
}
@media (min-width: 768px){
  .mega-parent--fw:hover > .mega-panel--fw,
  .mega-parent--fw.open > .mega-panel--fw{ display: block; }
}

.mega-content{
  max-width: var(--mega-maxw);
  margin: 0 auto;
  padding: 24px 16px;
  max-width: 964px;
}

/* 左右2カラム：1200px以上で 30:70（右を広く） */
.mega-split{
  display:grid; gap:28px; align-items:stretch;
  grid-template-columns: minmax(320px, 38%) 1fr; /* 初期 */
}
@media (min-width:1200px){
  .mega-split{ grid-template-columns: 0.30fr 0.70fr; }
}

/* 左のビジュアル */
.mega-visual{
  position:relative; display:block; border-radius:16px; overflow:hidden; box-shadow:var(--shadow);
}
.mega-visual img{ display:block; width:100%; height:100%; max-height:360px; object-fit:cover; }
.mega-cap{
  position:absolute; left:12px; bottom:12px; background:rgba(0,0,0,.45);
  color:#fff; padding:6px 10px; border-radius:999px; font-size:.9rem;
}

/* 右のメニュー群：最大4カラム */
.mega-menu{ display:grid; gap:18px 28px; justify-content:space-between; }
@media (min-width:1280px){ .mega-menu{ grid-template-columns: repeat(4, minmax(230px, 1fr)); } }
@media (min-width:992px) and (max-width:1279px){ .mega-menu{ grid-template-columns: repeat(3, minmax(230px, 1fr)); } }
@media (min-width:768px) and (max-width:991px){ .mega-menu{ grid-template-columns: repeat(2, minmax(200px, 1fr)); } }
@media (max-width:767px){ .mega-menu{ grid-template-columns: 1fr; gap:12px; } }
.mega-right h3{
  border-left: none;
  padding-left: 0px;
}
.mega-title{
  margin:0 0 8px; font-size:1.05rem; font-weight:800; letter-spacing:.02em; color:#e8fffb;
  border-bottom:2px solid rgba(255,255,255,.7);
}
.mega-col{ min-width:230px; }
.mega-links li a{
  display:block; padding:8px 0; color: var(--mega-fg);
  text-decoration: underline; text-decoration-color:#fff; text-underline-offset:3px;
  opacity:.95; transition: opacity .15s ease, transform .15s ease;
}
.mega-links li a:hover{ opacity:1; transform:translateX(2px); }

/* SP：ハンバーガー内では白基調でシンプル表示 */
@media (max-width:767px){
  .mega-panel--fw{ position:static; background:#fff; color:inherit; box-shadow:none; }
  .mega-content{ 
    max-width: var(--maxw);
    padding: 8px 16px 16px;
    background-color: #0f766e;
  }
  .mega-split{ display:block; }
  .mega-visual{ display:none; }
  .mega-menu{ display:block; }
  .mega-right h3{
    display: none;
    color: #fff;
  }
  .mega-title{
    color: var(--c-key);
    border-bottom-color: var(--c-key);
  }
  .mega-links li a{
    color: inherit; text-decoration:none; opacity:1; transform:none;
  }
}

/* =============================
   バナー（シンプル：h2/枠/影なし、3枚目以降は下段）
============================= */
.banner-section-simple{ background:none; border:none; box-shadow:none; padding:30px 0; }
.banner-area-simple{
  display:grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr));
  gap:20px; justify-content:center;
}
.banner-simple{ display:block; border:none; border-radius:0; box-shadow:none; overflow:visible; transition:opacity .2s ease; }
.banner-simple img{ display:block; width:100%; height:auto; }
.banner-simple:hover{ opacity:.9; }
@media (max-width: 767px){
  .banner-area-simple{ grid-template-columns: 1fr; gap:12px; }
}

/* =============================
   見出し内リンク装飾（共通）
============================= */
.sec-title a{
  color:inherit; text-decoration:none; display:inline-block; transition:color .2s ease;
}
.sec-title a:hover{ color:var(--c-key); text-decoration:underline; }
/* =============================
   ロゴ画像調整
============================= */
.logo {
  display: flex;
  align-items: center;
  gap: 12px;
  color: inherit;
  text-decoration: none;
}

.logo-img {
  height: 40px; /* ロゴ画像の高さを統一 */
  width: auto;
  display: block;
}

.logo-text {
  font-weight: 700;
  font-size: 1rem;
  letter-spacing: 0.03em;
  color: #222;
  white-space: nowrap;
}

@media (max-width: 767px) {
  .logo-text {
    font-size: 0.85rem;
    max-width: 180px;
    white-space: normal;
    line-height: 1.3;
  }
}
/* =============================
   News List Page (news_list.html)
============================= */
.subhero { padding: 28px 0; background: linear-gradient(180deg,#fff,var(--c-muted)); }
.breadcrumbs { font-size: .9rem; color: #64748b; }
.breadcrumbs a { color: inherit; text-decoration: underline; text-underline-offset: 2px; }

.news-layout { display: grid; grid-template-columns: 1fr 320px; gap: 24px; }
@media (max-width: 1024px){ .news-layout { grid-template-columns: 1fr; } }

.side-col { display: grid; gap: 20px; }
.widget { background: #fff; border: 1px solid var(--c-border); border-radius: var(--radius); box-shadow: var(--shadow); padding: 16px; }
.widget h3 { margin: .2em 0 .6em; font-size: 1.05rem; font-weight: 700; color: var(--c-key); }

.mini-list { list-style: none; margin: 0; padding: 0; }
.mini-list li + li { border-top: 1px solid var(--c-border); }
.mini-list a { display: block; padding: 10px 2px; color: inherit; text-decoration: none; }
.mini-list time { display: inline-block; min-width: 6.2em; font-variant-numeric: tabular-nums; color: #475569; }

.archive-list { list-style: none; margin: 0; padding: 0; display: grid; gap: 6px; grid-template-columns: repeat(2, minmax(0,1fr)); }
.archive-list a { display: inline-block; padding: 6px 8px; border: 1px solid var(--c-border); border-radius: 999px; background: #fff; color: inherit; text-decoration: none; }
.archive-list a:hover { background: var(--c-key-weak); }
@media (max-width: 599px){ .archive-list { grid-template-columns: 1fr; } }

.pager { display: flex; gap: 8px; flex-wrap: wrap; align-items: center; justify-content: center; margin-top: 16px; }
.pager a, .pager span { display: inline-block; min-width: 40px; text-align: center; padding: 8px 12px; border: 1px solid var(--c-border); border-radius: 8px; background: #fff; text-decoration: none; color: inherit; }
.pager .is-current { background: var(--c-key); color: #fff; border-color: var(--c-key); }
/* =============================
   Article (news_detail.html)
============================= */
.article-layout{
  display:grid;
  grid-template-columns: 1fr 320px;
  gap:24px;
}
@media (max-width: 1024px){
  .article-layout{ grid-template-columns: 1fr; }
}

.article{
  background:#fff;
  border:1px solid var(--c-border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 22px 18px;
}
.article-header{ margin-bottom: 10px; }
.article-title{
  margin: .1em 0 .2em;
  font-size: clamp(1.25rem, 2.6vw, 1.6rem);
  line-height: 1.35;
  font-weight: 800;
}
.article-meta{
  display:flex; flex-wrap:wrap; gap:10px 14px; align-items:center;
  color:#475569; font-size:.95rem;
}
.cat{ display:inline-block; padding:.2em .6em; border-radius:999px; font-size:.8rem; }
.cat-important{ background:#fde68a; color:#633112; }
.cat-lecture{ background:#c7d2fe; color:#1e1b4b; }
.cat-office{ background:#e2e8f0; color:#0f172a; }

.article-figure{ margin: 12px 0 16px; }
.article-figure img{ width:100%; height:auto; display:block; border-radius: 10px; }

.article-body{
  line-height:1.9;
}
.article-body h2{
  font-size:1.15rem; margin:1.6em 0 .6em;
  font-weight:700; border-left:6px solid var(--c-key); padding-left:10px;
}
.article-body p{ margin: .8em 0; }
.article-body ul, .article-body ol{ padding-left: 1.2em; }

.attachments{ margin-top: 20px; }
.attachments h3{ margin: 0 0 8px; font-size:1.05rem; color: var(--c-key); }
.download-list{ list-style:none; margin:0; padding:0; }
.download-list li+li{ margin-top:6px; }
.download-list a{ text-decoration: none; }
.download-list a:hover{ text-decoration: underline; }

.tag-list{
  display:flex; flex-wrap:wrap; gap:8px; margin: 16px 0 4px; padding:0; list-style:none;
}
.tag-list a{
  display:inline-block; padding:6px 10px; border:1px solid var(--c-border); border-radius:999px; background:#fff; text-decoration:none; color:inherit;
}
.tag-list a:hover{ background: var(--c-key-weak); }

.post-nav{
  display:flex; justify-content:space-between; align-items:center; gap:12px;
  margin-top: 18px; padding-top: 14px; border-top:1px solid var(--c-border);
}
.post-nav a{
  display:inline-block; padding:8px 12px; border:1px solid var(--c-border); border-radius:8px; background:#fff; text-decoration:none; color:inherit;
}
.post-nav .to-list{ font-weight:700; }
.post-nav a:hover{ background: var(--c-key-weak); }
/* 一覧レイアウト（親） */
.news-layout{
  display: grid;
  grid-template-columns: minmax(0,1fr) 320px; /* 右幅はお好みで */
  gap: 24px;
  align-items: start;             /* ← ここがポイント */
}

/* 右カラムが伸びないように */
.side-col{
  align-self: start;              /* 念のため明示 */
}
/* ヘッダー高さに合わせて適宜調整 */
:root{ --header-h: 64px; }

.side-col .sticky{
  position: sticky;
  top: calc(var(--header-h) + 16px);     /* ヘッダー＋余白分だけ下げて固定 */
  max-height: calc(100vh - var(--header-h) - 32px);
  overflow: auto;                         /* はみ出しは内側スクロール */
}

/* モバイルは追従オフ（使い勝手優先） */
@media (max-width: 1024px){
  .side-col .sticky{
    position: static;
    max-height: none;
    overflow: visible;
  }
}

/* ===== パンくずリスト ===== */
.breadcrumbs {
  font-size: 0.9rem;
  color: #444;
  margin-bottom: 12px;
}
.breadcrumbs a {
  color: var(--c-key);
  text-decoration: none;
}
.breadcrumbs a:hover {
  text-decoration: underline;
}
.breadcrumbs span {
  color: #333;
  font-weight: 600;
}

/* ===== 見出しスタイル ===== */
h3 {
  font-size: 1.25rem;
  margin-top: 2em;
  padding-left: 8px;
  border-left: 4px solid var(--c-key);
  font-weight: 700;
  color: #222;
}

h4 {
  font-size: 1.1rem;
  margin-top: 1.5em;
  border-left: 3px solid #0f766e;
  padding-left: 6px;
  font-weight: 600;
  color: #0f766e;
}

h5 {
  font-size: 1rem;
  margin-top: 1.2em;
  font-weight: 600;
  color: #333;
  position: relative;
}
h5::before {
  content: "▸";
  color: #0f766e;
  margin-right: 6px;
}

/* ====== 挨拶ページ ====== */
/*******************************
 * 挨拶ページ（Greeting）専用CSS
 * 依存トークン（:rootで定義済み想定）:
 * --c-key, --c-border, --c-muted, --radius, --shadow
 *******************************/

/* 全体レイアウト */
.greeting{
  display: grid;
  gap: 40px;
}

/* セクション */
.speech{
  padding: 8px 0;
}

/* セクション見出し */
.speech-title{
  font-size: 1.25rem;
  margin: 0 0 8px;
  font-weight: 800;
  border-left: 6px solid var(--c-key);
  padding-left: 10px;
}

/* プロフィール行：写真＋本文（横並び） */
.profile{
  display: flex;                 /* フレックスで統一 */
  align-items: flex-start;
  gap: 14px;                     /* 写真と本文の距離（12〜20pxで調整可） */
}

/* 画像を右、本文を左にしたい場合に付与 */
.profile--reverse{
  flex-direction: row-reverse;
}

/* 写真ボックス（可変幅） */
.profile-photo{
  margin: 0;                     /* figureの既定余白をリセット */
  width: clamp(200px, 24vw, 340px);
  height: auto;                  /* 中身に追随 */
  border-radius: 14px;
  overflow: hidden;
  box-shadow: var(--shadow);
  border: 1px solid var(--c-border);
  flex: 0 0 auto;                /* つぶれ防止 */
}

.profile-photo img{
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}

/* 本文カード */
.profile-body{
  background: #fff;
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
  padding: 16px 18px;
  flex: 1 1 auto;                /* 余白を本文側に配分 */
  min-width: 0;                  /* 長文でのはみ出し防止 */
}

/* 肩書・氏名 */
.profile-meta{
  margin: 2px 0;
  color: #64748b;
  font-size: .95rem;
}

.profile-name{
  margin: 0 0 8px;
  font-weight: 700;
  font-size: 1.05rem;
}

/* リード／本文／署名 */
.speech-lead{
  margin: 10px 0 12px;
  padding: 10px 12px;
  background: var(--c-muted);
  border-left: 4px solid var(--c-key);
  color: #111;
  font-style: normal;
}

.speech-body p{
  margin: .7em 0;
}

.speech-sign{
  margin-top: 12px;
  color: #475569;
  font-size: .95rem;
  text-align: right;
}

/* パンくず（挨拶ページ内で使用する場合） */
.breadcrumbs{
  font-size: 0.8rem;
  color: #444;
  margin-bottom: 12px;
}
.breadcrumbs a{
  color: var(--c-key);
  text-decoration: none;
}
.breadcrumbs a:hover{
  text-decoration: underline;
}
.breadcrumbs [aria-current="page"]{
  color: #333;
  font-weight: 600;
}

/* タブレット以下は縦積み */
@media (max-width: 899px){
  .profile{
    flex-direction: column;
    gap: 12px;
  }
  .profile-photo{
    width: min(92vw, 520px);     /* 画面幅に応じて広め表示 */
  }
}

/* モバイル微調整 */
@media (max-width: 599px){
  .speech-title{
    font-size: 1.2rem;
  }
  .profile-body{
    padding: 14px;
  }
}
/* ===== ページタイトル（H1：挨拶など） ===== */
h1.sec-title {
  font-size: 1.8rem;
  font-weight: 800;
  text-align: left;
  border: none;              /* 左の棒線は削除 */
  padding-top: 1.0em;
  padding-left: 0;
  margin-bottom: 20px;
  color: var(--c-key);
  position: relative;
}

/* 下線をアクセントに（H1専用） */
h1.sec-title::after {
  content: "";
  display: block;
  width: 80px;
  height: 3px;
  background: var(--c-key);
  margin-top: 8px;
  border-radius: 2px;
}

/* スマホでの調整 */
@media (max-width: 599px){
  h1.sec-title {
    font-size: 1.5rem;
  }
}
/* ===== 事務局ページ：ページ内リンク（タブ風） ===== */
.inpage-nav{
  display:flex; flex-wrap:wrap; gap:10px;
  margin: 10px 0 20px;
}
.inpage-nav a{
  display:inline-block;
  padding:8px 14px;
  border:1px solid var(--c-border);
  border-radius:999px;
  background:#fff;
  color:inherit;
  text-decoration:none;
  box-shadow: var(--shadow);
}
.inpage-nav a:hover{ background: var(--c-key-weak); }

/* ===== 事務局：カード＋定義リスト（簡素化版） ===== */
.office-card {
  border: 1px solid var(--c-border);
  padding: 16px 18px;
}

.def {
  margin: 0;
}

.def > div {
  display: grid;
  grid-template-columns: 8em 1fr;
  gap: 10px;
  padding: 10px 0;
  border-top: 1px solid var(--c-border);
}

.def > div:first-child {
  border-top: 0;
}

.def dt {
  font-weight: 700;
  color: #334155;
}

.def dd {
  margin: 0;
}

/* モバイル対応 */
@media (max-width: 599px) {
  .def > div {
    grid-template-columns: 1fr;
  }
}


/* ===== Google Map 埋め込み ===== */
.map-embed{
/*
  border:1px solid var(--c-border);
  border-radius: var(--radius);
  box-shadow: var(--shadow);
*/
  overflow:hidden;
}
.map-embed iframe{
  display:block; width:100%; height:420px; border:0;
}
@media (max-width: 599px){
  .def > div{ grid-template-columns: 1fr; }
  .map-embed iframe{ height:320px; }
}
/* ===== ボタン（共通） ===== */
.btn-outline {
  display: inline-block;
  border: 2px solid var(--c-key);
  color: var(--c-key);
  background: #fff;
  border-radius: 999px;
  font-weight: 700;
  padding: 12px 20px;
  text-align: center;
}
.btn-outline:hover {
  background: var(--c-key-weak);
  color: var(--c-key);
}

/* CTAセクションなど、暗い背景上にある場合 */
.cta-section .btn-outline {
  border-color: #fff;
  color: #fff;
  background: transparent;
}
.cta-section .btn-outline:hover {
  background: rgba(255,255,255,0.15);
  color: #fff;
}
.pdf-link {
  display: inline-flex;
  align-items: center;
  gap: 0.35em;
  font-weight: 600;
  color: var(--c-key);
  text-decoration: none;
}

.pdf-link:hover {
  text-decoration: underline;
}

.icon-pdf {
  width: 1.2em;
  height: auto;
  vertical-align: middle;
}
.ext-link {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  text-decoration: none;
}
.ext-link .icon-ext {
  flex: 0 0 auto;
  vertical-align: middle;
  color: var(--c-key, #0f766e);
}
.ext-link:hover {
  opacity: .9;
}
html {
  scroll-behavior: smooth;
}
/* =============================
   Departments: sport tile grid
============================= */
.sport-grid{
  display: grid;
  gap: 14px;
  grid-template-columns: repeat(6, minmax(0, 1fr));
}
@media (max-width: 1280px){ .sport-grid{ grid-template-columns: repeat(5, 1fr); } }
@media (max-width: 1024px){ .sport-grid{ grid-template-columns: repeat(4, 1fr); } }
@media (max-width: 799px){  .sport-grid{ grid-template-columns: repeat(3, 1fr); } }
@media (max-width: 599px){  .sport-grid{ grid-template-columns: repeat(2, 1fr); } }

.sport-card{
  display: grid;
  place-items: center;
  min-height: 78px;
  padding: 14px 10px;
  border: 1px solid var(--c-border);
  border-radius: var(--radius);
  background: #fff;
  box-shadow: var(--shadow);
  text-decoration: none;
  color: inherit;
  text-align: center;
  font-weight: 700;
  transition: transform .18s ease, box-shadow .18s ease, border-color .18s ease, background .18s ease;
}
.sport-card:hover{
  transform: translateY(-2px);
  box-shadow: 0 8px 22px rgba(0,0,0,.12);
  border-color: var(--c-key);
  background: var(--c-key-weak);
}
.sport-card span{
  display: inline-block;
  line-height: 1.4;
  padding: 2px 6px;
  word-break: keep-all;
  overflow-wrap: anywhere;
}

/* 薄い注記 */
.note-muted{ color:#475569; font-size:.93rem; }
/* スマホ時にメガメニュー左側画像を非表示 */
@media (max-width: 767px) {
  .mega-visual {
    display: none !important;
  }
}
/* ===== メガメニュー右側リンク群：横並びレイアウト ===== */
.mega-links {
  display: flex;
  flex-wrap: wrap;         /* 折り返し対応（スマホで崩れにくく） */
  gap: 24px;               /* ← 横間隔。20〜32pxで好みに調整可 */
  margin-top: 12px;        /* タイトルとの余白 */
  padding-bottom: 16px;    /* 下余白でゆとり感 */
}

.mega-links li {
  list-style: none;
  margin: 0;
  padding: 0;
}

.mega-links li a {
  display: inline-block;
  padding: 6px 0;
  color: var(--mega-fg);
  text-decoration: underline;
  text-decoration-color: #fff;
  text-underline-offset: 3px;
  opacity: .95;
  transition: opacity .15s ease, transform .15s ease;
}

.mega-links li a:hover {
  opacity: 1;
  transform: translateY(-1px);
}
@media (max-width: 767px) {
  .mega-links li {
    list-style: none;
    padding: 0.25em 0.5em 0.25em 0.5em;
}
  .mega-links li a {
  display:block;
  }
}

/* スマホ時にメガメニュー左側画像を非表示 */
@media (max-width: 767px) {
  .mega-content .mega-split img{
    display: none !important;
  }
}

/* =============================
   Download list
============================= */

.download-list{
  list-style:none;
  margin:0;
  padding:0;
}

.download-list li{
  border-bottom:1px dotted #d6d6d6;
}

.download-list a{
  display:flex;
  align-items:center;
  gap:10px;
  padding:14px 8px;
  color:inherit;
  text-decoration:none;
}

.download-list a:hover{
  background:#fafafa;
}

.download-list svg{
  flex-shrink:0;
}