@charset "UTF-8";
/* =========================================================================
   淡海ふれあい病院 TOP  style.css
   ※汎用は common.css。本ファイルはサイト固有スタイル。
   ※ font-size基準：html=ブラウザ既定(16px)／body=1rem。各値は rem(1rem=16px)。
   ========================================================================= */

/* ----------------------------------------------- Google アイコン（Material Symbols / ローカルwoff2） */
.material-symbols-outlined{ font-family:'Material Symbols Rounded'; font-weight:400; font-variation-settings:'wght' 400,'opsz' 24,'GRAD' 0,'FILL' 0; font-style:normal; line-height:1; letter-spacing:normal; text-transform:none; display:inline-block; white-space:nowrap; word-wrap:normal; direction:ltr; -webkit-font-feature-settings:'liga'; font-feature-settings:'liga'; -webkit-font-smoothing:antialiased; vertical-align:middle; }

/* ---------------------------------------------------------------- base */
:root{ 
  --green:#8c3; 
  --green-d:#7b2;
  --green-l:#e9f4cb; 
  --green-ll:#f6faee;
  --red:#f55;
  --ink:#333; 
  --gray:#777; 
  --line:rgba(0,0,0,0.1);
  --line-t:rgba(0,0,0,0.04); 
  --wrap:1200px; }

*{ box-sizing:border-box; }
html{ scroll-behavior:smooth; overflow-x:clip; }
body{ margin:0; /*font-family:"Noto Sans JP",-apple-system,"Hiragino Kaku Gothic ProN","Meiryo",sans-serif;*/ font-family: "游ゴシック体", YuGothic, "游ゴシック Medium", "Yu Gothic Medium", "游ゴシック", "Yu Gothic", sans-serif; font-size:clamp(0.9rem,1.6vw,1rem); font-weight:400; line-height:1.8; color:var(--ink); background:#f9fbef; -webkit-font-smoothing:antialiased; overflow-x:clip; }
a{ color:inherit; text-decoration:none; transition:.25s; }
a:hover{ opacity:.75; }
ul,dl,dd,figure{ margin:0; padding:0; list-style:none; }
/* 見出しは一括でサイズ指定（clamp で可変） */
h1,h2,h3,h4{ margin:0 0 0.75rem 0; font-weight:600; line-height:1.4; }
h1{ font-size:clamp(1.5rem,4vw,2rem); }
h2{ font-size:clamp(1.25rem,3vw,1.75rem); }
h3{ font-size:clamp(1.125rem,2.4vw,1.5rem); }
h4{ font-size:clamp(1rem,2vw,1.25rem); }
.green { color:var(--green-d);}
.red { color:var(--red);}

.wrap{ max-width:var(--wrap); margin-inline:auto; padding-inline:20px; }


/* ================================================================ HEADER */
.header{ position:sticky; top:0; background:#fff; box-shadow:0 1px 8px rgba(0,0,0,.06); z-index:100; }
.header .inner{ max-width:1400px; margin-inline:auto; padding:clamp(0.5rem,1.6vw,1rem) clamp(0.75rem,2.4vw,1.5rem); display:flex; align-items:center; justify-content:space-between; min-height:5rem; gap:1rem; }

/* ロゴ */
.logo { width: 35%; max-width: 400px; margin-bottom:0;}
.logo a,.f_logo{ display:flex; align-items:center; }
.logo img{ height:auto; width:100%; display:block; }
.f_logo img{ width:auto; display:block; }

/* グローバルナビ */
.hm .gnav{ display:flex; align-items:center; gap:1.5rem; }
.hm .gnav a{ display:flex; align-items:center; gap:6px; font-size:1rem; font-weight:600; }
.hm .gnav .material-symbols-outlined{ font-size:1.5rem; color:var(--green); width:1.5rem; height:1.5rem; overflow: hidden; }
.hm .gnav a:hover{ color:var(--green-d); opacity:1; }
/* 現在地ハイライトはトップ項目のみ（> で直下に限定。プルダウン内には効かない） */
.hm .gnav > .current-menu-item > a, .hm .gnav > li > a[aria-current="page"]{ color:var(--green-d); }

/* プルダウン（サブメニュー）＝PCはホバーで表示 */
.gnav li{ position:relative; }
.gnav .caret{ font-size:1.1rem !important; color:var(--green) !important; }
.submenu_toggle{ display:none; } /* ＋ボタンはSP（バーガー）でのみ表示 */
.gnav .sub-menu{ position:absolute; top:120%; left:0; min-width:160px; margin:0; padding:0.5rem 0; list-style:none; background:#fff; box-shadow:0 10px 24px rgba(0,0,0,.14); border-radius:0.5rem; opacity:0; visibility:hidden; transform:translateY(8px); transition:.2s; z-index:120; }
.gnav li:nth-last-child(2) .sub-menu { left:-3rem; }
.gnav li:hover > .sub-menu, .gnav li:focus-within > .sub-menu{ opacity:1; visibility:visible; transform:none; }
.gnav .sub-menu li{ display:block; }
.gnav .sub-menu a{ display:block; padding:0.5rem 1.25rem 0.5rem 0.75rem; font-size:0.95rem; font-weight:500; white-space:nowrap; color:var(--ink); line-height:1.25; }
.gnav .sub-menu a::before{ content:"chevron_right"; font-family:'Material Symbols Rounded'; font-size:1.1em; color:var(--green); vertical-align:-0.2em; margin-right:0.15em; -webkit-font-feature-settings:'liga'; font-feature-settings:'liga'; }
.gnav .sub-menu a:hover{ background:var(--green-ll); color:var(--green-d); opacity:1; }

/* ハンバーガー */
.hm_btn{ display:none; }

/* 検索パネル */
.search_panel{ position:absolute; top:100%; left:0; right:0; background:var(--green-ll); border-top:1px solid var(--line); box-shadow:0 8px 16px rgba(0,0,0,.08); overflow:hidden; }
.search_panel[hidden]{ display:none; }
.search_panel{ max-height:0; transition:max-height .3s ease; }
.search_panel.is-open{ max-height:200px; }
.search_inner{ max-width:1400px; margin-inline:auto; padding:1.25rem 1.5rem; display:flex; align-items:center; gap:12px; }
.search_form{ flex:1; display:flex; align-items:center; gap:12px; }
.search_field{ flex:1; display:flex; align-items:center; gap:8px; padding:0 1rem; background:#fff; border:1px solid var(--line); border-radius:999px; }
.search_field .material-symbols-outlined{ font-size:1.5rem; color:var(--green-d); }
.search_field input{ flex:1; border:0; outline:0; padding:0.75rem 0; font-size:1rem; background:transparent; color:var(--ink); width:calc(100% - 5rem); }
.search_submit{ padding:0.75rem 1.75rem; border:0; border-radius:999px; background:var(--green); color:#fff; font-size:1rem; font-weight:600; cursor:pointer; transition:.25s; }
.search_submit:hover{ background:var(--green-d); }
.search_close{ flex:0 0 auto; display:flex; align-items:center; justify-content:center; width:2.5rem; height:2.5rem; border:0; border-radius:50%; background:transparent; color:var(--gray); cursor:pointer; transition:.25s; }
.search_close:hover{ background:#fff; color:var(--ink); }
.search_close .material-symbols-outlined{ font-size:1.5rem; }
body.search-results .index_box .date { display:none;}

/* バーガーメニュー内の検索枠：PCでは非表示（PCは上部の検索トグルパネルを使用） */
.hm_search{ display:none; }


/* ============================================================= 右サイド固定 */
.side_fix{ position:fixed; top:5rem; right:0; z-index:110; display:flex; flex-direction:column; gap:0.5rem; }
.side_fix a{ display:flex; flex-direction:column; align-items:center; justify-content:center; gap:0.5rem; width:3.5rem; padding:1rem 0; background:linear-gradient(180deg,#8c3 0%,#7b2 100%); color:#fff; border-radius:8px 0 0 8px; box-shadow:0 2px 6px rgba(0,0,0,.12); }
.side_fix a:hover{ /*background:var(--green-d); opacity:1;*/ }
.side_fix .material-symbols-outlined{ font-size:1.5rem; }
.side_fix .side_label{ writing-mode:vertical-rl; font-weight:600; letter-spacing:.08rem; }
/* PCではお問い合わせリンクを表示、SP用の電話リンクは隠す */
.side_fix a.side_contact_sp{ display:none; }


/* ============================================================= メインビジュアル */
.mv{ position:relative; width:100%; padding:0 5vw; margin-inline:auto; background:#fff; margin-bottom:1px; }
.mv .inner { max-width:1400px; margin: auto; position: relative;}
.mv_slider{ position:relative; /*height:50vw;*/ height:60vh; min-height:30vw; overflow:hidden; }
.mv_item{ position:absolute; inset:0; background-size:cover; background-position:center; opacity:0; transition:opacity .8s ease; }
.mv_item.is-active{ opacity:1; }
.mv_copy{ position:absolute; top:10%; left:5%; color:#fff; text-shadow:0 2px 8px rgba(0,0,0,.3); z-index:3; }
.mv_copy p{ font-size:clamp(1rem,3vw,2rem); font-weight:600; line-height:1.6; letter-spacing:.04rem; margin:0; }
/* 下部の波（wave.svg） */
.mv_wave{ position:absolute; left:0; bottom:-1px; left:-1%; right:-1%; width:102%; aspect-ratio:10/1; background:url(../img/wave.svg) bottom center/cover no-repeat; pointer-events:none; z-index:2; }
.mv_dots{ position:absolute; right:0; bottom:clamp(0.5rem,1.6vw,2rem); display:flex; gap:10px; z-index:4; }
.mv_dots li{ width:11px; height:11px; border-radius:50%; background:rgba(0,0,0,.1); /*box-shadow:0 0 0 1px rgba(0,0,0,.12);*/ cursor:pointer; transition:.25s; }
.mv_dots li.is-active{ background:var(--green); }


/* ============================================================= 共通 見出し */
.g_head{ justify-content:space-between; /*border-bottom:2px solid var(--green); padding-bottom:12px; */ }
.g_head h2,.ttl{ display:flex; align-items:center; gap:0.5rem; }
.g_more{ font-size:0.875rem; font-weight:600; color:var(--green-d); display:inline-flex; align-items:center; }
.g_more .material-symbols-outlined{ font-size:1.25rem; }


/* ============================================================= 外来診療／問い合わせ */
.wrap > section{ padding-bottom:3rem; }

.guide_box{ width:calc(50% - 10px); background:#fff; border-radius:1rem; padding:clamp(0.75rem,1.6vw,1rem) clamp(1rem,2.4vw,1.5rem); border: 1px solid var(--line-t); box-shadow:0 1rem 0.5rem -0.75rem rgba(0,0,0,0.05); }
/* 左カラム：外来診療／面会時間を別カードで縦積み */
.guide_col{ width:calc(50% - 10px); display:flex; flex-direction:column; gap:20px; }
.guide_col .guide_box{ width:100%; }
/* 箱全体をリンク化 */
.guide_link{ display:block; color:inherit; transition:.25s; }
.guide_link:hover{ opacity:1; border-color:var(--green); box-shadow:0 1rem 1rem -0.75rem rgba(0,0,0,0.12); }
.guide_link:hover .g_more{ color:var(--green); }
.guide_box h2 { display:flex; align-items:center; gap:0.5rem; }
h2 .material-symbols-outlined{ font-size:2.5rem; color:var(--green); }

.g_hours{ margin-bottom:1rem; border-top:1px solid var(--line); }
.g_hours:last-child { margin-bottom: 0;}
.g_hours > div{ display:flex; padding:0.5rem 0; border-bottom:1px solid var(--line); }
.g_hours dt { flex:0 0 auto; min-width:6rem; font-weight:600; color:var(--green-d); }
.g_hours.ot dt { min-width:4rem;}
.g_hours dd{ flex:1; font-weight:600; }
.g_hours .note{ font-size:0.8125rem; color:var(--gray); }


/* 電話 */
.g_tel{ margin-bottom:2rem; margin-top:0; padding-bottom:0.8rem; border-bottom:1px solid var(--line); line-height:1.25; }
.g_tel a{ font-size:2.5rem; font-weight:600; color:var(--green-d); letter-spacing:.02em; }
.g_tel span{ font-size:1rem; font-weight:600; }
/* 電話番号：PCはタップ無効、スマホのみ tel: リンク有効 */
.g_tel a,.f_tel a{ pointer-events:none; cursor:default; }

/* よく使う項目 */
.use_list { gap:clamp(0.5rem,1.6vw,1rem);}
.use_list li{ flex:1; }
.use_list a{ display:flex; flex-direction:column; align-items:center; font-size:1rem; /*justify-content:center;*/ gap:8px; height:100%; min-height:110px; padding:1rem; background:var(--green-ll); /*border:1px solid var(--line-t);*/ border-radius:10px; text-align:center; font-weight:600; line-height:1.5; }
.use_list .material-symbols-outlined{ font-size:3.5rem; color:var(--green); }
.use_list a:hover{ background:var(--green-l); opacity:1; }


/* ============================================================= 当院を利用される方へ */
.usefor .ttl{ margin-bottom:1rem; }

.usefor_list{ margin-bottom:3rem; }
.usefor_list li { width:calc(25% - 15px); background:var(--green-l); border-radius:0.75rem;border: 1px solid var(--line-t); box-shadow:0 1rem 0.5rem -0.75rem rgba(0,0,0,0.05); transition: 0.25s; }
.usefor_list li.uf_outpatient { width:18%;} 
.usefor_list li.uf_inpatient { width:18%;} 
.usefor_list li.uf_about { width:18%;} 
.usefor_list li.uf_tsunagu { width:18%;} 
.usefor_list li.uf_homecare { width:22%;} 


.usefor_list a{ display:flex; flex-flow: row wrap; align-items:center; gap:1rem; padding:0.75rem 1.25rem; font-size:clamp(1rem,2.4vw,1.25rem); font-weight:600; line-height:1.3; min-height:6rem; }
.usefor_list .material-symbols-outlined{ font-size:3rem; color:var(--green); }
/*.usefor_list li:hover{ background:var(--green); color:#fff; opacity:1; }
.usefor_list li:hover a { opacity:1;}
.usefor_list li:hover .material-symbols-outlined{ color:#fff; }*/

.usefor_wide li{ width:calc(50% - 10px); }
.usefor_wide a{ display:flex; align-items:center; justify-content:space-between; padding:1rem 1.25rem; background:#fff; border:1px solid var(--line-t); border-radius:0.75rem; box-shadow:0 1rem 0.5rem -0.75rem rgba(0,0,0,0.05); font-size:1.25rem; font-weight:600; min-height:6rem; }
.usefor_wide .ic{ display:flex; align-items:center; gap:1rem; }
.usefor_wide .ic .material-symbols-outlined{ font-size:2.5rem; color:var(--green); }
.usefor_wide .arrow{ font-size:1.5rem; color:var(--green-d); }
/*.usefor_wide a:hover{ background:var(--green); color:#fff; opacity:1; }
.usefor_wide a:hover .material-symbols-outlined{ color:#fff; }*/


/* ============================================================= お知らせ／バナー */
.info_box{ width:calc(50% - 10px); background:#fff; border-radius:1rem; padding:clamp(0.75rem,1.6vw,1rem) clamp(1rem,2.4vw,1.5rem); border: 1px solid var(--line-t); box-shadow:0 1rem 0.5rem -0.75rem rgba(0,0,0,0.05); }
.bnr_box{ width:calc(50% - 10px); display:flex; flex-direction:column; gap:16px; }

/* タブ */
.tab{ display:flex; gap:6px; border-bottom: 1px solid var(--line); }
.tab li a{ display:block; padding:0.5rem 0.75rem; font-size:0.875rem; font-weight:600; color:var(--gray); border-bottom:3px solid transparent; }
.tab li.is-active a{ color:var(--green-d); border-color:var(--green); }

.tab_content > li{ display:none; }
.tab_content > li.is-active{ display:block; }

/* お知らせリスト */
.index_box{ border-bottom:1px solid var(--line); }
.index_box a{ display:flex; align-items:baseline; gap:0.5rem; flex-wrap:wrap; padding:0.75rem 0; }
.index_box a:hover{ opacity:1; color:var(--green-d); }
.index_box dt{ display:flex; align-items:center; gap:10px; flex:0 0 auto; }
.index_box .date{ font-size:0.875rem; color:var(--gray); font-weight:500; }
.index_box .cat{ font-size:0.6875rem; font-weight:600; /*color:#fff;*/ padding:2px 12px; border-radius:20px; white-space:nowrap; }
.index_box .cat01{ background:var(--green); background:#e9f4cb; }            /* 患者・一般 */
.index_box .cat02{ background:#6aa6c8; background:#fae8ca; }                 /* 医療関係者 */
.index_box dd{ flex:1; min-width:200px; }

/* ============================================================= 検索結果ページ */
.search_count{ margin:0 0 1.25rem; font-size:0.95rem; color:var(--gray); }
.search_count strong{ color:var(--ink); }
.search_result { margin-bottom:2rem;}
.search_result .index_box dd{ display:flex; flex-direction:column; gap:0.25rem; }
.search_result .index_box .title{ font-size:clamp(1.125rem,2vw,1.25rem); font-weight:700; color:var(--ink); line-height:1.5; }
.search_result .index_box a:hover .title{ color:var(--green-d); }
.search_result .index_box .excerpt{ color:var(--gray); line-height:1.6; }
.search_none{ padding:1.5rem 0; color:var(--ink); }
/* ページ送り */
.of_pager{ display:flex; flex-wrap:wrap; justify-content:center; gap:0.5rem; margin-top:2rem; }
.of_pager .page-numbers{ display:flex; align-items:center; justify-content:center; min-width:2.5rem; height:2.5rem; padding:0 0.5rem; border:1px solid var(--line); border-radius:8px; font-weight:600; color:var(--ink); }
.of_pager a.page-numbers:hover{ background:var(--green-ll); color:var(--green-d); opacity:1; }
.of_pager .page-numbers.current{ background:var(--green); border-color:var(--green); color:#fff; }
.of_pager .page-numbers.dots{ border:0; }
/* 再検索フォーム */
.search_again{ display:flex; align-items:center; gap:8px; margin-top:1.5rem; }
.search_again .search_submit{ white-space:nowrap; }

/* ============================================================= お知らせ一覧 */
/* カテゴリー切替タブ（すべて／患者・一般／医療関係者） */
.news_nav{ display:flex; flex-wrap:wrap; gap:0.5rem; margin:0 0 1.5rem; border-bottom:1px solid var(--line); padding-bottom:0.75rem; }
.news_nav a{ display:inline-flex; align-items:center; padding:0.5rem 1.25rem; border:1px solid var(--line); border-radius:999px; font-weight:600; color:var(--ink); }
.news_nav a:hover{ background:var(--green-ll); color:var(--green-d); opacity:1; }
.news_nav li.is-active a{ background:var(--green); border-color:var(--green); color:#fff; }
/* お知らせが無いとき */
.news_none{ padding:1.5rem 0; color:var(--gray); }

/* バナー */
.bnr{ display:flex; align-items:center; position: relative; min-height:clamp(5rem,10vw,6rem); padding:clamp(0.75rem,1.6vw,1rem) clamp(1rem,2.4vw,1.5rem); border-radius:0.75rem; color:#fff; background:linear-gradient(120deg,var(--green) 0%,var(--green-d) 100%); box-shadow:0 1rem 0.5rem -0.75rem rgba(0,0,0,0.05); }
.bnr::after { content:""; position:absolute; inset:0; border: 1px solid var(--line-t); border-radius:0.75rem; z-index:1; }
.bnr_ttl{ display:flex; align-items:center; gap:14px; font-size:1.25rem; font-weight:600; line-height:1.25; }
.bnr_ttl .material-symbols-outlined{ font-size:3rem; }
.bnr_ttl small{ font-size:clamp(1rem,1.8vw,1.125rem); font-weight:600; display: block; }
.bnr strong { font-size:clamp(1.25rem,2.4vw,1.5rem); display: block; }
.bnr_mark{ width:3rem; height:3rem; object-fit:contain; flex:0 0 auto; }

.bnr_see { background:linear-gradient(90deg, #8c3 0%, rgba(136,204,51,1) 56%, rgba(136,204,51,0) 70%), url(../img/fureai_top01.webp) right center / 50% no-repeat, #8c3; overflow:hidden; color:#fff; }
.bnr_pr { background:#f6eee2 url(../img/bg_maga.webp) right top / clamp(8rem,45%,16rem) no-repeat; color: #333; overflow:hidden; }
.bnr_pr .bnr_ttl { position:relative; z-index:1; }
.bnr_pr .material-symbols-outlined { color:var(--green-d);}
.bnr_group { background:linear-gradient(90deg, #7b2 0%, rgba(119,187,34,1) 56%, rgba(119,187,34,0) 70%), url(../img/bg_group.webp) right center / 50% no-repeat, #7b2;; }
.bnr_group strong { font-size:clamp(1.5rem,3vw,2rem); }

/* ================================================================ FOOTER */
.footer{ position:relative; margin-top:clamp(1.5rem,5vw,3rem); padding:clamp(1.5rem,5vw,3rem) 0; background:#fff; border-top:1px solid var(--line); line-height:1.5; }
.f_info{ width:24rem; }
.f_logo{ display:flex; align-items:center; margin-bottom:16px; width:80%; max-width:400px; }
.f_address{ }
.f_tel{ margin:0; }
.f_tel a{ display:inline-flex; align-items:center; gap:6px; font-size:2rem; font-weight:600; color:var(--green-d); }
.f_tel .material-symbols-outlined{ font-size:1.5rem; }
.f_tel span{ font-size:0.8125rem; font-weight:600; }
.f_copy{ font-size:0.75rem; color:var(--gray); margin-top:10px; }
.f_mark{ margin-top:16px; }

.f_links{ flex:1; max-width:45rem; }
.f_links h3{ margin-bottom: 1rem; }
.f_links ul{ /*display:flex; flex-wrap:wrap;*/ column-count:2; }
.f_links li{ /*width:50%;*/ }
.f_links li a{ display: block; text-decoration:none; padding:0.25rem 1rem 0.25rem 1.5rem; }
.f_links li a::before{ content:""; display:inline-block; vertical-align:middle; width:1rem; border-top:1px solid var(--green); margin:0 0.5rem 0.25rem -1.5rem; }

/* ページトップ */
.pagetop{ position:fixed; right:0; bottom:0; display:flex; flex-direction:column; align-items:center; justify-content:center; min-width:5rem; padding:0.5rem; background:var(--green); color:#fff; font-size:0.75rem; font-weight:600; line-height:1.5; text-align:center; z-index:10000  }
.pagetop:hover{ background:var(--green-d); opacity:1; }
.pagetop .material-symbols-outlined{ font-size:2rem; margin-top:-0.5rem; width:2rem; height:1.5rem; overflow: hidden; }


/* ================================================================ TABLET 1140 */
@media screen and (max-width:1140px), print{
  .header .inner{ min-height: auto; }
  .logo { width: 80%;}
  .logo img{  }

  /* ハンバーガー表示 */
  .hm_btn{ display:block; position:relative; width:40px; height:40px; border:0; padding:0; background:transparent; cursor:pointer; }
  .hm_btn span{ position:absolute; left:5px; right:5px; height:2px; border-radius:2px; background:var(--green-d); transition:.3s; }
  .hm_btn span:nth-child(1){ top:10px; }
  .hm_btn span:nth-child(2){ top:19px; }
  .hm_btn span:nth-child(3){ top:28px; }
  .hm_btn[aria-expanded="true"] span:nth-child(1){ top:19px; transform:rotate(45deg); }
  .hm_btn[aria-expanded="true"] span:nth-child(2){ opacity:0; }
  .hm_btn[aria-expanded="true"] span:nth-child(3){ top:19px; transform:rotate(-45deg); }

  .hm{ position:absolute; top:100%; left:0; right:0; background:#fff; box-shadow:0 8px 16px rgba(0,0,0,.12); max-height:0; overflow:hidden; transition:max-height .35s; }
  .hm.is-open{ max-height:500px; }
  .hm .gnav{ flex-direction:column; align-items:stretch; gap:0; }
  .hm .gnav li{ border-bottom:1px solid var(--line); }
  .hm .gnav a{ padding:16px 20px; font-size:1rem; }

  /* SP：プルダウンは＋ボタンで開閉するアコーディオン */
  .hm.is-open{ max-height:1600px; overflow:auto; }
  .hm .gnav .menu-item-has-children{ display:flex; flex-wrap:wrap; align-items:stretch; }
  .hm .gnav .menu-item-has-children > a{ flex:1 1 auto; }
  .hm .gnav .submenu_toggle{ flex:0 0 auto; display:flex; align-items:center; justify-content:center;
	width:56px; border:0; border-left:1px dashed var(--line); background:transparent; color:var(--green-d); cursor:pointer; }
  .hm .gnav .submenu_toggle .material-symbols-outlined{ font-size:1.6rem; color:var(--green-d); }
  .hm .gnav .sub-menu{ flex:0 0 100%; position:static; visibility:visible; transform:none;
	box-shadow:none; border-radius:0; padding:0; min-width:0; background:var(--green-ll);
	max-height:0; overflow:hidden; opacity:1; transition:max-height .3s ease; }
  .hm .gnav .menu-item-has-children.is-open > .sub-menu{ max-height:600px; }
  .hm .gnav .sub-menu a{ padding:0.75rem 1.5rem; font-size:0.95rem; }
  .hm .gnav .caret{ display:none; }

  /* SPはメニュー内に検索枠を出すので、トグルの「検索」項目は隠す */
  .hm .gnav .m_search{ display:none; }
  /* メニューを開くと検索枠も一緒に表示 */
  .hm_search{ display:block; padding:16px 20px; background:var(--green-ll); }
  .hm_search .search_form{ gap:8px; }
  .hm_search .search_submit{ padding:0.65rem 1.25rem; white-space:nowrap; }

  .side_fix{ top:auto; bottom:0; right:0; left:0; flex-direction:row; gap:0; }
  .side_fix li{ flex:1; }
  .side_fix a{ flex-direction:row; width:auto; border-radius:0; padding:12px 0; }
  .side_fix .side_label{ writing-mode:horizontal-tb; font-size:0.8125rem; }
  /* SPはお問い合わせを「電話する」（tel:）に切り替え */
  .side_fix a.side_contact_pc{ display:none; }
  .side_fix a.side_contact_sp{ display:flex; }
	
  .mv { padding:0;}
  .mv_slider,.mv_item{ height:50vw; /*min-height:320px;*/ }
	.mv_dots { right:5vw;}


  /* 2カラム→調整 */
  .guide_box{ width:calc(50% - 10px); }



  .guide.flex,.info_bnr.flex{ flex-direction:column; }
  .guide_col,.guide_box,.info_box,.bnr_box{ width:100%; }

  .usefor_list li{ width:calc(50% - 10px); }
  .usefor_list a{ flex-direction:column; text-align:center; gap:0.5rem; padding:0.75rem; }
  .usefor_wide li{ width:100%; }

.usefor_list { gap:1rem; }
.usefor_list li.uf_outpatient { width:calc(50% - 0.5rem);} 
.usefor_list li.uf_inpatient { width:calc(50% - 0.5rem);} 
.usefor_list li.uf_about { width:calc(50% - 0.5rem);} 
.usefor_list li.uf_tsunagu { width:calc(50% - 0.5rem);} 
.usefor_list li.uf_homecare { width:100%;} 

  .g_tel a{ font-size:2rem; }
  /* スマホ・タブレットは電話番号をタップで発信可能に */
  .g_tel a,.f_tel a{ pointer-events:auto; cursor:pointer; }

  .footer { padding-bottom:5rem;}


  .f_links li{ width:100%; }
	body.page .f_links, body.archive .f_links, body.category .f_links, body.single .f_links { display:none;}
  .pagetop{ /*position:static; width:100%; flex-direction:row; gap:6px; margin-top:24px; min-height:auto; padding:14px;*/ bottom:3rem; }
}




@media screen and (max-width:640px){
	.footer .flex{ flex-direction:column; }
	.f_info{ width:100%; }
	.f_links { width:100%; column-count:1;}
}
/* SP 480 ＝ よく使う項目を縦 */
@media screen and (max-width:480px){
  .use_list{ flex-direction:column; }
  .use_list li{ flex:0 0 auto; width:100%; }
  .use_list a{ flex-direction:row; justify-content:flex-start; align-items:center; min-height:0; text-align:left; gap:1rem; }
  .use_list .material-symbols-outlined{ font-size:2.5rem; flex:0 0 auto; }
  .mv_copy { position: relative; color:#333; left:0; top:0; text-shadow: none; padding:0 0 1.5rem 5vw; background:#f9fbef;}
  .mv_copy br {}
  .mv_dots { bottom:auto; top:51vw;}
body.home .mv_wave { bottom:auto; top:40vw; }
}


/* =========================================================================
   下層ページ共通（外来など）
   ========================================================================= */
.sub .main{ overflow:hidden; }

/* ページヘッダー */
.page_head{ position:relative; background:linear-gradient(180deg,var(--green-ll) 0%,var(--green-l) 100%); padding:clamp(1.5rem,5vw,3rem) 0 clamp(3rem,10vw,6rem); }
.page_head .inner{ max-width:var(--wrap); margin-inline:auto; padding-inline:20px; text-align:center; }
.page_head_ico{ display:flex; align-items:center; justify-content:center; line-height:1; margin:0 0 0.5rem; position:relative; z-index:10; font-size:clamp(1.5rem,4vw,2rem); }
.page_head_ico .material-symbols-outlined{ font-size:1.4em; color:var(--green); }
.page_head_ico .page_head_ico_svg{ height:1.4em; width:auto; flex:0 0 auto; }
.page_head_ttl{ margin:0; position:relative; z-index:10; }
.page_head .mv_wave{  }

/* パンくず */
.breadcrumb{ font-size:0.8125rem; color:var(--gray); padding:0; }
.breadcrumb .wrap{ display:flex; align-items:center; flex-wrap:wrap; gap:2px; }
.breadcrumb a{ color:var(--green-d); }
.breadcrumb .material-symbols-outlined{ font-size:1.1rem; color:var(--gray); }
.breadcrumb br { display:none;}

.sub_wrap{ padding:clamp(0.5rem,1.6vw,1rem) clamp(0.5rem,2.4vw,1.5rem); }

/* ページ内ナビ */
.page_nav{ display:flex; flex-flow:row wrap; gap:0.75rem; margin-bottom:2rem; padding-bottom:2rem; border-bottom:1px solid var(--line); line-height:1.5; }
.page_nav li{ /*flex:1 1 auto;*/ }
.page_nav a{ display:flex; align-items:center; /*justify-content:center;*/ gap:0.5rem; height:100%; padding:0.75rem 1.25rem; background:var(--green-ll); border:1px solid var(--line-t); border-radius:1.75rem; font-weight:600; white-space:nowrap; }
.page_nav a:hover{ background:var(--green); color:#fff; opacity:1; }
.page_nav a .material-symbols-outlined{ flex:0 0 auto; font-size:1.75rem; line-height:1; color:var(--green); }
.page_nav a:hover .material-symbols-outlined{ color:#fff; }

body.page-id-2883 .page_nav li {  min-width:calc((100% - 0.75rem * 5)/6); }


/* セクション */
.sec{ margin-bottom:clamp(2.5rem,5vw,4rem); scroll-margin-top:6rem; }
.sec_ttl{ display:flex; align-items:center; gap:0.5rem; margin-bottom:1.5rem; }
.sec_ttl::after{ content:""; flex:1; height:2px; background:var(--green); }
.sec_ttl .material-symbols-outlined { font-size:clamp(2rem,5vw,3rem); color:var(--green); } 

/* グループ見出し（旧 .card 見出し）
   白枠(.sub_panel)内の入れ子を避けるため箱(.card)は廃止。見出し＋本文をフラットに
   並べ、グループの区切りは .card_ttl の上マージンで表現する。 */
.card_ttl{ margin:1.75rem 0 0.75rem; }
.card_ttl:first-child{ margin-top:0; }       /* 親要素の先頭にある見出しは詰める */
.sec_ttl + .card_ttl{ margin-top:0; }        /* セクション見出し直後は詰める */

/* 強調ボックス（連絡先・お申し込みなど）だけ淡いグリーンの枠を残す（入れ子は1段まで） */
.card_accent{ background:var(--green-ll); border-radius:1rem; padding:clamp(0.75rem,2.4vw,1.5rem); margin:0 0 1.5rem 0; }
.card_accent > :first-child{ margin-top:0; }
.card_accent > :last-child{ margin-bottom:0; }

/* リスト */
.list_dot{ margin:0 0 0.5rem; padding:0; }
.list_dot li{ position:relative; padding-left:1.25rem; margin-bottom:0.4rem; }
.list_dot li::before{ content:""; position:absolute; left:0.2rem; top:0.75em; width:7px; height:7px; border-radius:50%; background:var(--green); }
.list_check{ margin:0.75rem 0; padding:0; }
.list_check li{ position:relative; padding-left:1.75rem; margin-bottom:0.6rem; }
.list_check li::before{ content:"check_circle"; font-family:'Material Symbols Rounded'; position:absolute; left:0; top:0; font-size:1.5rem; line-height:1.2; color:var(--green); }

/* 番号リスト：緑丸の中に白い数字（<ol class="list_num">）
   base で ol の list-style を none にしているため、カウンターで番号を再現。 */
ol.list_num{ counter-reset:list_num; margin:0.75rem 0; padding:0; list-style:none; }
ol.list_num li{ position:relative; padding-left:2rem; margin-bottom:0.5rem; }
ol.list_num li::before{ counter-increment:list_num; content:counter(list_num); position:absolute; left:0; top:0.15em; width:1.5rem; height:1.5rem; display:flex; align-items:center; justify-content:center; font-size:0.8rem; font-weight:600; line-height:1; color:#fff; background:var(--green); border-radius:50%; }


/* 標準のディスク（・）箇条書きを使いたいとき：<ul class="disc">
   base で ul の list-style を none にしているため、このクラスで復活させる。 */
ul.disc{ list-style:disc; margin:0 0 1.5rem; padding-left:1.5em; }
ul.disc li{ margin:0.25em 0; }
ul.disc ul{ list-style:circle; margin:0.25em 0; padding-left:1.5em; }   /* 入れ子は白丸 */
ul.disc ul ul{ list-style:square; }                                     /* さらに入れ子は四角 */

.attn{ font-size:0.875rem; color:var(--gray); }
.sub_note{ font-size:0.875rem; color:var(--gray); }

/* ご持参いただくもの */
.bring{ margin-top:1rem; padding:1.25rem; background:var(--green-ll); border-radius:0.75rem; }
.bring_ttl{ display:flex; align-items:center; gap:0.4rem; margin:0 0 0.75rem; }
.bring_ttl .material-symbols-outlined{ font-size:1.6rem; color:var(--green-d); }
.bring_list{ counter-reset:bring; margin:0; padding:0; }
.bring_list li{ position:relative; padding-left:2rem; margin-bottom:0.5rem; }
.bring_list li::before{ counter-increment:bring; content:counter(bring); position:absolute; left:0; top:0.15em; width:1.4rem; height:1.4rem; display:flex; align-items:center; justify-content:center; font-size:0.8rem; font-weight:600; color:#fff; background:var(--green); border-radius:50%; }

/* 時間テーブル */
.hours_table, table { width:100%; border-collapse:collapse; background:#fff; border:1px solid var(--line); overflow:hidden; }
.hours_table caption, table caption{ text-align:left; font-weight:600; padding:0 0 0.75rem; }
.hours_table th,.hours_table td, table th, table td{ padding:clamp(0.5rem,1.6vw,1rem) clamp(0.75rem,2vw,1.25rem); border-bottom:1px solid var(--line); text-align:left; }
.hours_table tr:last-child th,.hours_table tr:last-child td{ border-bottom:0; }
.hours_table th { width:8rem; background:var(--green-ll); color:var(--green-dd,var(--green-d)); font-weight:600; }
table th { width:auto;background:var(--green-ll); color:var(--green-dd,var(--green-d)); font-weight:600; vertical-align:top; }
.hours_table .note{ font-size:0.875rem; color:var(--gray); margin-left:0.25rem; }

/* 外来担当医表 */
.table_lead{ font-weight:600; margin-bottom:0.75rem; }
.table_scroll{ overflow-x:auto; -webkit-overflow-scrolling:touch; border:1px solid var(--line); /*border-radius:1rem;*/ }
.doctor_table{ width:100%; min-width:760px; border-collapse:collapse; background:#fff; }
.doctor_table th,.doctor_table td{ padding:0.85rem 0.9rem; border-bottom:1px solid rgba(0,0,0,.18); border-right:1px solid var(--line); text-align:center; vertical-align:top; line-height:1.5; }
.doctor_table thead th{ background:var(--green); color:#fff; font-weight:600; white-space:nowrap; }
.doctor_table tbody th{ background:var(--green-ll); color:var(--green-dd,var(--green-d)); font-weight:600; white-space:nowrap; line-height:1.4; }
.doctor_table tbody th.ampm{ background:#fff; font-size:0.875rem; font-weight:600; color:var(--ink); }
.doctor_table tr:last-child th,.doctor_table tr:last-child td{ border-bottom:0; }
.doctor_table th:last-child,.doctor_table td:last-child{ border-right:0; }
.doctor_table .dr{ display:block; font-weight:600; }
.doctor_table .dpt{ display:block; font-size:0.75rem; color:var(--gray); margin-top:2px; }
.doctor_table .cond{ display:block; font-size:0.75rem; color:var(--green-d); margin-top:2px; }
.doctor_table .off{ color:var(--gray); }


/* スタッフ紹介 */
.staff_list{ display:grid; gap:1.5rem; }
.staff{ display:grid; grid-template-columns:120px 1fr; grid-template-rows:auto 1fr; column-gap:clamp(1rem,2.5vw,1.5rem); row-gap:0.75rem; align-items:start; background:#fff; border:1px solid var(--line); border-radius:1rem; padding:clamp(1rem,2.5vw,1.5rem); box-shadow:0 1rem 0.5rem -0.75rem rgba(0,0,0,0.05); }
.staff_photo{ grid-column:1; grid-row:1 / span 2; width:120px; }
.staff_photo img{ width:120px; aspect-ratio:3/4; object-fit:cover; border-radius:0.5rem; display:block; background:var(--green-ll); }
.staff_photo.no_photo{ display:flex; align-items:center; justify-content:center; width:120px; aspect-ratio:2/3; border-radius:0.5rem; background:var(--green-ll); color:var(--green); }
.staff_photo.no_photo .material-symbols-outlined{ font-size:3.5rem; }
.staff_head{ grid-column:2; grid-row:1; display:flex; flex-flow:row wrap; gap:0.5rem 0.75rem; padding-bottom:0.75rem; margin-bottom:0; border-bottom:1px solid var(--line); line-height:1.5; }
.staff_name{ font-size:1.25rem; font-weight:600; line-height:1.3; margin:0 !important; }
.staff_name .kana{ font-size:0.8125rem; color:var(--gray); font-weight:400; margin-left:0.5rem; }
.staff_role{ display:inline-block; padding:0.15rem 0.75rem; background:var(--green-ll); font-size:0.8125rem; font-weight:600; border-radius:999px; }
.staff_dl{ grid-column:2; grid-row:2; display:grid; grid-template-columns:auto 1fr; gap:0.5rem 1rem; }
.staff_dl dt{ font-weight:600; color:var(--green-d); white-space:nowrap; }
.staff_dl dd{ margin:0; }
.staff_dl dd ul{ margin:0; padding:0; }
.staff_dl dd li{ position:relative; padding:0.25rem 0 0.25rem 0.9rem; line-height:1.5; }
.staff_dl dd li::before{ content:""; position:absolute; left:0; top:0.7em; width:5px; height:5px; border-radius:50%; background:var(--green); }
@media (max-width:600px){
  /* スマホ：写真30%＋右に名前・肩書きを下揃え、資格は下に全幅 */
  .staff{ grid-template-columns:30% 1fr; align-items:end; column-gap:1rem; }
  .staff_photo{ grid-row:1; width:100%; }
  .staff_photo img,.staff_photo.no_photo{ width:100%; }
  .staff_head{ grid-row:1; align-self:end; padding-bottom:0; border-bottom:0; }
  .staff_name { width:100%;}
  .staff_name .kana { display: block; margin-left:0;}
  .staff_dl{ grid-column:1 / -1; grid-row:2; grid-template-columns:1fr; gap:0.15rem; padding-top:0.5rem; border-top:1px solid var(--line); }
  .staff_dl dt{ margin-top:0.5rem; }
  .staff_dl dt:first-child{ margin-top:0; }
}




/* カード内の画像 */
.card_img{ margin:1rem auto; }
.card_img img{ width:100%; max-width:450px !important; height:auto; display:block; }

/* 注意ボックス */
.note_box{ margin-bottom:1.5rem; padding:1rem 1.25rem; background:#fff8ec; border:1px solid #f0e2c2; border-radius:0.75rem; }
.note_box_ttl{ display:flex; align-items:center; gap:0.4rem; font-weight:600; }
.note_box_ttl .material-symbols-outlined{ color:#d49a2a; font-size:1.75rem; }

/* 電話行 */
.tel_line a, .fax_line { display:inline-flex; align-items:center; gap:0.4rem; font-size:clamp(1.75rem,5vw,2.25rem); font-weight:600; color:var(--green-d); pointer-events:none; cursor:default; line-height:1.25; }
.tel_line a > .material-symbols-outlined, .fax_line .material-symbols-outlined { font-size:1.5rem !important; }

/* PDF・リンクボタン */
.btn_row{ margin:1rem 0; }
.pdf_btn{ display:inline-flex; align-items:center; gap:0.5rem; padding:0.75rem 1.5rem; background:var(--green); color:#fff; border-radius:999px; font-weight:600; }
.pdf_btn:hover{ background:var(--green-d); opacity:1; }
/* ボタン内の旧アイコン（picture_as_pdf 等）は、本文と同じ [PDF]/[Word]/[Excel]
   バッジに統一するため非表示。種類ラベルは下記の自動バッジが付ける。 */
.pdf_btn .material-symbols-outlined{ display:none; }

/* 外部リンクアイコン */
.sub a .material-symbols-outlined[translate="no"],
.sub a > .material-symbols-outlined{ font-size:1rem; vertical-align:-1px; }

/* 本文をまとめる白枠 */
.sub_panel{ background:#fff; border:1px solid var(--line-t); border-radius:1rem; padding:clamp(1rem,3vw,2rem); box-shadow:0 1rem 0.5rem -0.75rem rgba(0,0,0,0.05); }
.sub_panel .sec:last-child{ margin-bottom:0; }
/* 段落の余白（:where で 0 特異度＝ .btn_row / .card_img など個別指定を壊さない） */
.sub_panel :where(p){ margin:0 0 1.5rem; }
.sub_panel :where(p:last-child){ margin-bottom:0; }

/* セクション内の小見出し（「主なご依頼内容」「ご利用にあたって」等） */
.sec_sub{ font-weight:600; color:var(--gray); margin:1.5rem 0 0.5rem; }
.sec_ttl + .sec_sub{ margin-top:0; }
.sec_sub + .card_ttl{ margin-top:0.5rem; }   /* 小見出し直後のグループ見出しは詰める */

/* リード文 */
.lead{ font-weight:600; color:var(--green-dd,var(--green-d)); }

/* リンクボタン（PDF以外の遷移） */
.link_btn{ display:inline-flex; align-items:center; gap:0.4rem; padding:0.6rem 1.25rem; background:var(--green-ll); border:1px solid var(--green); border-radius:999px; font-weight:600; color:var(--green-d); }
.link_btn:hover{ background:var(--green); color:#fff; opacity:1; }
.link_btn .material-symbols-outlined{ font-size:1.25rem; }

/* 本文・お知らせ一覧のファイルリンクに、種類別ラベルを自動付与（href の拡張子で判定）
   ─ 現行サイト同様、リンクの書き方は変えずCSSだけで判定（大小文字無視 [i]）。
   ─ 表示は「白背景＋色枠＋文字」のバッジ（[PDF] [WORD] [EXCEL]）で視認性を確保。
   ─ (A) 本文中のインラインリンク・ボタン（.pdf_btn / .link_btn 含む）… リンク文字の
   　   直後（a::after）。ボタン内の旧アイコンは上で非表示にし、本文と同じ表記に統一。
   　   画像リンク・お知らせ項目（dd内包）は対象外。
   ─ (B) お知らせ一覧 … .index_box a は display:flex のため a::after だと右端に寄る。
   　   タイトル（dd）の直後（dd::after）に付ける。トップ／一覧／検索で共通に効く。
   ─ 対応：PDF（.pdf）／Word（.doc・.docx）／Excel（.xls・.xlsx）。 */
.sub_panel a[href$=".pdf" i]:not(:has(img)):not(:has(dd))::after,
.sub_panel a[href$=".doc" i]:not(:has(img)):not(:has(dd))::after,
.sub_panel a[href$=".docx" i]:not(:has(img)):not(:has(dd))::after,
.sub_panel a[href$=".xls" i]:not(:has(img)):not(:has(dd))::after,
.sub_panel a[href$=".xlsx" i]:not(:has(img)):not(:has(dd))::after,
.index_box a[href$=".pdf" i] dd::after,
.index_box a[href$=".doc" i] dd::after,
.index_box a[href$=".docx" i] dd::after,
.index_box a[href$=".xls" i] dd::after,
.index_box a[href$=".xlsx" i] dd::after{
	display:inline-block;
	margin-left:0.4em;
	padding:0 0.4em;
	font-family:inherit;
	font-size:0.7em; font-weight:700; line-height:1.6; letter-spacing:0.04em;
	background:#fff;
	border:1px solid currentColor;   /* 枠は文字色（種類別）に追従 */
	border-radius:0.25em;
	vertical-align:0.12em;
	text-decoration:none;
	white-space:nowrap;
}
/* PDF（赤） */
.sub_panel a[href$=".pdf" i]:not(:has(img)):not(:has(dd))::after,
.index_box a[href$=".pdf" i] dd::after{
	content:"PDF"; color:#d6402f;
}
/* Word（ブルー） */
.sub_panel a[href$=".doc" i]:not(:has(img)):not(:has(dd))::after,
.sub_panel a[href$=".docx" i]:not(:has(img)):not(:has(dd))::after,
.index_box a[href$=".doc" i] dd::after,
.index_box a[href$=".docx" i] dd::after{
	content:"Word"; color:#2b579a;
}
/* Excel（グリーン） */
.sub_panel a[href$=".xls" i]:not(:has(img)):not(:has(dd))::after,
.sub_panel a[href$=".xlsx" i]:not(:has(img)):not(:has(dd))::after,
.index_box a[href$=".xls" i] dd::after,
.index_box a[href$=".xlsx" i] dd::after{
	content:"Excel"; color:#217346;
}

/* 任意でバッジを付けたいとき用のクラス（拡張子に関係なく明示的に付与）
   ─ 自動判定（href の拡張子）では拾えないリンクに使う。
   　 例）転送ページ：<a class="is-pdf" href="/op/table">外来担当医表</a>
   　 例）ボタン併用：<a class="pdf_btn is-pdf" href="/op/table">…</a>
   ─ 見た目・位置は自動バッジと同じ（リンク文字の直後）。 */
a.is-pdf::after,
a.is-word::after,
a.is-excel::after{
	display:inline-block;
	margin-left:0.4em;
	padding:0 0.4em;
	font-family:inherit;
	font-size:0.7em; font-weight:700; line-height:1.6; letter-spacing:0.04em;
	background:#fff;
	border:1px solid currentColor;
	border-radius:0.25em;
	vertical-align:0.12em;
	text-decoration:none;
	white-space:nowrap;
}
a.is-pdf::after{ content:"PDF"; color:#d6402f; }
a.is-word::after{ content:"Word"; color:#2b579a; }
a.is-excel::after{ content:"Excel"; color:#217346; }

/* 入院当日の流れ */
.flow_list{ counter-reset:flow; margin:0; padding:0; list-style:none; }
.flow_step{ position:relative; display:flex; align-items:flex-start; gap:0.5rem; padding:clamp(0.75rem,2vw,1.25rem); background:var(--green-ll); border-radius:0.75rem; margin-bottom:1.25rem; }
.flow_step:last-child{ margin-bottom:0; }
/*.flow_step:not(:last-child)::after{ content:"expand_more"; font-family:'Material Symbols Rounded'; position:absolute; left:50%; bottom:-1.1rem; transform:translateX(-50%); font-size:1.5rem; color:var(--green); z-index:1; }*/
.flow_num{ flex:0 0 auto; width:2.25rem; height:2.25rem; display:flex; align-items:center; justify-content:center; font-weight:600; color:#fff; background:var(--green); border-radius:50%; }
.flow_body{ flex:1; }
.flow_ttl{ margin:0 0 0.25rem; color:var(--green-dd,var(--green-d)); }
.flow_body p{ margin:0; }

/* 定義リスト（窓口情報など） */
.info_list{ margin:1rem 0; border:1px solid var(--line); border-radius:0.75rem; overflow:hidden; display: flex; flex-flow:row wrap; }
.info_list dt{ width:8rem; background:var(--green-ll); color:var(--green-dd,var(--green-d)); font-weight:600; padding:0.65rem 1.25rem; border-bottom:1px solid var(--line); }
.info_list dd{ margin:0; padding:0.65rem 1.25rem; border-bottom:1px solid var(--line); flex-grow:1; }
.info_list dd:last-child{ border-bottom:0; }
.info_list .note{ font-size:0.875rem; color:var(--gray); margin-left:0.25rem; }

@media screen and (max-width:600px){
  .page_nav{ gap:0.5rem; }
  .page_nav li{ flex:0 1 calc(50% - 0.25rem); }
  .page_nav li.wide { flex:0 1 100%; }
  .page_nav a{ width:100%; padding:0.5rem 0.75rem; white-space:normal; /*text-align:center;*/ }
  .tel_line a{ pointer-events:auto; cursor:pointer; }
  .sub_panel{ border-radius:1rem; }
}

/* ---------------------------------------------------------------- 埋込（広報など） */
.of_embed{ margin:1.25rem 0; }
.of_embed_insta{ display:flex; justify-content:center; }
.of_embed_insta .instagram-media{ margin:0 auto !important; }

/* 広報誌あおばな 最新号 表紙（ショートコード [of_aobana_latest]） */
.aobana_latest{ margin:0; text-align:center; }
.aobana_latest a{ display:inline-block; }
.aobana_latest img{ width:auto; max-width:300px; height:auto; border:1px solid var(--line); border-radius:0.5rem; box-shadow:0 0.75rem 1rem -0.75rem rgba(0,0,0,0.25); transition:transform .25s,box-shadow .25s; }
.aobana_latest a:hover img{ transform:translateY(-3px); box-shadow:0 1rem 1.25rem -0.75rem rgba(0,0,0,0.3); opacity:1; }
.aobana_latest figcaption{ margin-top:0.5rem; font-size:0.875rem; font-weight:600; color:var(--green-d); }
.aobana_latest_fallback{ text-align:left; }

/* ---------------------------------------------------------------- 投稿（single） */
.of_post_head{ margin-bottom:1.5rem; padding-bottom:1.25rem; border-bottom:1px solid var(--line); }
.of_post_meta{ display:flex; align-items:center; gap:0.75rem; flex-wrap:wrap; margin-bottom:0.5rem; }
.of_post_meta .date{ font-size:0.875rem; color:var(--gray); font-weight:500; }
.of_post_meta .cat{ font-size:0.6875rem; font-weight:600; padding:2px 12px; border-radius:20px; white-space:nowrap; }
.of_post_meta .cat01{ background:#e9f4cb; }   /* 患者・一般 */
.of_post_meta .cat02{ background:#fae8ca; }   /* 医療関係者 */
.of_post_ttl{ margin:0; }
.of_post_body{ line-height:1.9; }
.of_post_body > *:first-child{ margin-top:0; }
.of_post_body img{ max-width:100%; height:auto; border-radius:0.5rem; }
.of_post_body a{ color:var(--green-d); text-decoration:underline; }
.of_post_body a:hover{ opacity:0.75; }
.of_post_pages{ display:flex; flex-wrap:wrap; gap:0.5rem; margin-top:1.5rem; }
.of_post_back{ margin-top:2.5rem; padding-top:1.5rem; border-top:1px solid var(--line); }
.of_post_back a{ display:inline-flex; align-items:center; gap:0.25rem; padding:0.6rem 1.5rem; background:var(--green-ll); border:1px solid var(--green-l); border-radius:999px; font-weight:600; color:var(--green-d); }
.of_post_back a:hover{ background:var(--green); color:#fff; border-color:var(--green); opacity:1; }
.of_post_back .material-symbols-outlined{ font-size:1.25rem; }


/* ---------------------------------------------------------------- 404 */
.of_404{ text-align:center; }
.of_404_code{ margin:0; font-size:clamp(3.5rem,12vw,6rem); font-weight:700; line-height:1; color:var(--green); letter-spacing:0.05em; }
.of_404_lead{ margin:0.75rem 0 0; font-size:1.25rem; font-weight:600; color:var(--ink); }
.of_404_text{ margin:1rem 0 0; color:var(--gray); line-height:1.9; }
.of_404_links{ list-style:none; margin:2rem auto 0; padding:0; display:flex; flex-flow:row wrap; justify-content:center; gap:0.75rem; }
.of_404_links li{ flex:0 1 auto; }
.of_404_links a{ display:inline-flex; align-items:center; gap:0.5rem; padding:0.75rem 1rem; border:1px solid var(--green-l); border-radius:3rem; background:var(--green-ll); font-weight:600; text-decoration:none; transition:background .2s,color .2s; }
.of_404_links a:hover{ background:var(--green); color:#fff; border-color:var(--green); }
.of_404_links .material-symbols-outlined{ font-size:1.25rem;  color:var(--green-d); }
.of_404_search{ margin:2.25rem auto 0; max-width:520px; }


/* =========================================================================
   数値で見る淡海ふれあい病院（固定ページ slug=visual / body.page-visual）
   ─ デザイン案：アイコン＋数値カードで実績を可視化。
   ─ 数値は [of_stat] ショートコードで出力（編集画面で num="…" を毎年更新）。
   ========================================================================= */
/* 本文の白枠（.sub_panel）は既定どおり白枠のまま使う（このページ専用の上書きはしない）。 */

/* リード文（サブタイトル）と導入文 */
.num_lead{ font-weight:700; color:var(--green-d); font-size:clamp(1rem,2.4vw,1.25rem); margin:0 0 1rem; }
.num_intro{ margin:0 0 1.75rem; }

/* ---- 統計カード（共通） ---- */
.stats_grid{ display:flex; flex-wrap:wrap; gap:1rem; margin:0 0 1rem 0; width:100%; }
.stats_grid .stat{width:calc((100% - 2rem)/3); }
.num_hero_stats .stats_grid .stat{ width:calc((100% - 3rem)/4); background:var(--green-ll); }
.stat{ display:flex; flex-direction:column; align-items:center; justify-content:center; text-align:center; gap:0.15rem; border:1px solid var(--line); border-radius:1rem; padding:1rem; box-shadow:0 0.75rem 1rem -0.75rem rgba(0,0,0,0.1); }
.num_sec .stat { /*background:#fff;*/ } 
.stat_ico{ font-size:2rem; color:var(--green); margin-bottom:0.25rem; }
.stat_num{ display:flex; align-items:baseline; gap:0.1em; color:var(--green-d); font-weight:700; line-height:1.1; }
.stat_num .num{ font-size:clamp(2.5rem,7vw,4.5rem); }
.stat_num .unit{ font-size:1rem; font-weight:600; }
.stat_label{ /*font-size:0.85rem;*/ font-weight:600; color:var(--ink); line-height:1.5; margin-bottom:0.25rem; }
.stat_note{ font-size:0.75rem; color:var(--gray); }

/* ヒーロー直下の規模カード（床／時間）まわりの余白 */
.num_hero_stats{ margin:0 0 2.25rem; }

/* ---- 入院から在宅までのフロー ---- */
.num_flow{ display:flex; flex-wrap:wrap; align-items:center; gap:0.5rem; margin:0 0 2rem; padding:0; list-style:none; }
.num_flow li{ background:var(--green); color:#fff; font-weight:600; padding:0.75rem 1.5rem; border-radius:999px; font-size:clamp(1rem,2vw,1.25rem); }
.num_flow li.ar{ background:none; color:var(--green); padding:0; }
.num_flow li.ar .material-symbols-outlined{ font-size:1.5rem; }

/* ---- セクション大見出し（緑下線） ---- */
.num_h2{ display:flex; align-items:center; gap:0.5rem; color:var(--green-d); border-bottom:2px solid var(--green-l); padding-bottom:0.5rem; margin:2.5rem 0 1.25rem; }

/* ---- 実績サブセクション（淡緑パネル） ---- */
/* 実績セクションを横2列で並べる（狭い画面では1列） */
.num_secs{ display:grid; grid-template-columns:repeat(2,1fr); gap:clamp(1.5rem,5vw,3rem); align-items:stretch; margin-bottom:1.5rem; }
.num_secs .num_sec{ margin-bottom:0; }

	

/* num_sec は枠なし（背景・ボーダー・影なし）。白枠は親の .sub_panel が担当。 */
.num_sec{ background:transparent; border:0; border-radius:0; padding:0; margin-bottom:3rem; box-shadow:none; }
.num_sec_ttl{ display:flex; align-items:center; gap:0.5rem; color:var(--green-d); margin:0 0 0.5rem; }
.num_sec_ttl .material-symbols-outlined{ font-size:1.75rem; color:var(--green); flex:0 0 auto; }
.num_sec > p{ margin:0 0 1.25rem; }

/* カード群＋サイド注記の横並び */
.num_body{ display:flex; flex-wrap:wrap; gap:1rem 1.5rem; align-items:center; width:100%; }
.num_body .stats_grid{ /*flex:1 1 320px;*/ }
.num_aside{ flex:1 1 180px; /*max-width:240px; font-size:0.85rem; color:var(--green-d);*/ line-height:1.7; margin:0; }

/* ---- 締めの緑ボックス ---- */
.num_closing{ background:linear-gradient(135deg,var(--green) 0%,var(--green-d) 100%); color:#fff;
	border-radius:1.25rem; padding:clamp(1.5rem,4vw,2.5rem); margin:2.5rem 0 1.5rem; }
.num_closing h2{ color:#fff; margin:0 0 0.75rem; }
.num_closing p{ margin:0; opacity:.95; }

/* ---- 機能評価の注記 ---- */
.num_foot{ font-size:0.85rem; color:var(--gray); line-height:1.8; }

@media (max-width:760px){ 
.num_secs{ grid-template-columns:1fr; } 
.num_hero_stats .stats_grid .stat, .stats_grid .stat { width:calc((100% - 1rem)/2); }
	
}

@media (max-width:640px){
.num_body{ flex-direction:column; align-items:stretch; }
.num_aside{ max-width:none; }
}


/* ---- 診療科・部門 ---- */
section#dep .page_nav a, section#center .page_nav a, section#support .page_nav a { font-size: clamp(1rem,1.8vw,1.125rem); gap: clamp(0.5rem,1vw,0.6rem); padding-right:clamp(1.5rem,3vw,2rem); }
section#dep .page_nav a .material-symbols-outlined, section#center .page_nav a .material-symbols-outlined, section#support .page_nav a .material-symbols-outlined { font-size: clamp(1.75rem,3vw,2rem);}

.back_dep{text-align:center;margin:2rem 0 0.5rem;}
.back_dep a{ display:inline-flex;align-items:center; gap:0.5rem; padding:1rem 2rem;border-radius:4rem; background:#fff; border:1px solid var(--line); font-weight:500; text-decoration:none;line-height:1; box-shadow:0 1rem 0.5rem -0.75rem rgba(0,0,0,0.05); transition:background .2s,transform .2s;}
.back_dep a:hover{transform:translateY(-1px);}
.back_dep .material-symbols-outlined{font-size:1rem;}




@media print{
.pagetop, .side_fix { display:none;}
	
}
