@charset "UTF-8";
/* 京都薬科大学 薬理学分野 サイト共通スタイル (2026 リニューアル) */

:root{
  --ink:#1f2a30;
  --ink-soft:#57646c;
  --line:#e3ded7;
  --bg:#f8f7f4;
  --paper:#ffffff;
  --navy:#16324f;
  --navy-dark:#102639;
  --accent:#8c2f39;
  --accent-soft:#f5edec;
  --maxw:1140px;
}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth}
body{
  margin:0;background:var(--bg);color:var(--ink);
  font-family:"Hiragino Kaku Gothic ProN","Hiragino Sans","Noto Sans JP","Yu Gothic Medium",YuGothic,Meiryo,sans-serif;
  font-size:17px;line-height:1.95;letter-spacing:.02em;
  -webkit-text-size-adjust:100%;-webkit-font-smoothing:antialiased;
}
img{max-width:100%;height:auto}
a{color:var(--accent);text-underline-offset:.2em}
a:hover{color:#a8404a}
.wrap{max-width:var(--maxw);margin:0 auto;padding:0 24px}
.skip{position:absolute;left:-9999px}
.skip:focus{left:8px;top:8px;z-index:100;background:#fff;padding:8px 14px}

/* ===== ヘッダー ===== */
.site-header{background:var(--navy);border-bottom:3px solid var(--accent)}
.header-inner{display:flex;flex-wrap:wrap;align-items:center;justify-content:space-between;gap:10px 24px;padding-top:16px;padding-bottom:16px}
.brand{display:block;color:#fff;text-decoration:none;line-height:1.4}
.brand-ja{display:block;font-size:1.55rem;font-weight:700;letter-spacing:.1em}
.brand-sub{display:block;font-size:.76rem;color:#b3c5d6;letter-spacing:.14em}
.gnav ul{display:flex;flex-wrap:wrap;gap:2px;margin:0;padding:0;list-style:none}
.gnav a{display:block;padding:8px 15px;color:#e6edf4;font-size:.95rem;text-decoration:none;border-radius:4px}
.gnav a:hover{background:rgba(255,255,255,.14);color:#fff}
.gnav a[aria-current="page"]{background:#fff;color:var(--navy);font-weight:700}

/* ===== ヒーロー / ページ見出し ===== */
.hero{background:#fff;border-bottom:1px solid var(--line)}
.hero img{display:block;width:100%;margin:0 auto;max-width:1140px}
.page-head{background:#fff;border-bottom:1px solid var(--line)}
.page-head .wrap{padding-top:30px;padding-bottom:26px}
.page-head .en{display:block;font-size:.72rem;letter-spacing:.2em;color:var(--ink-soft);text-transform:uppercase;margin-bottom:4px}
.page-head h1{margin:0;font-size:1.9rem;line-height:1.45;letter-spacing:.06em}

/* ===== レイアウト ===== */
.layout{display:grid;grid-template-columns:minmax(0,1fr) 268px;gap:44px;align-items:start;padding-top:40px;padding-bottom:64px}
.content{background:var(--paper);border:1px solid var(--line);border-radius:6px;padding:36px 42px}
.content>*:first-child{margin-top:0}
.content>div>*:first-child{margin-top:0}

/* ===== 本文タイポグラフィ ===== */
.content h2{margin:2.4em 0 .8em;padding-left:14px;font-size:1.34rem;line-height:1.55;letter-spacing:.05em;border-left:5px solid var(--accent)}
.content h3{margin:2.1em 0 .7em;padding-bottom:.35em;font-size:1.16rem;line-height:1.6;letter-spacing:.04em;border-bottom:1px solid var(--line)}
.content h4{margin:1.9em 0 .5em;font-size:1.06rem;color:var(--navy);letter-spacing:.04em}
.content h5,.content h6{margin:1.6em 0 .4em;font-size:1.02rem;color:var(--navy);letter-spacing:.04em}
.content p{margin:0 0 1.4em}
.content ul,.content ol{margin:0 0 1.6em;padding-left:1.5em}
.content li{margin-bottom:.5em}
.content li ul,.content li ol{margin-top:.5em}
.content img{margin:1.8em 0;border:1px solid var(--line);border-radius:4px}
.content sup{font-size:.72em;vertical-align:super;line-height:0}
.content dl{display:grid;grid-template-columns:max-content minmax(0,1fr);gap:.15em 1.4em;margin:.6em 0 1.6em}
.content dt{font-weight:700;color:var(--navy);white-space:nowrap}
.content dd{margin:0}
.content table{width:100%;border-collapse:collapse;margin:1.5em 0}
.content th,.content td{border:1px solid var(--line);padding:.6em .9em;text-align:left}
.content th{background:#f3f1ed}

.content h2,.content h3,.content h4{clear:both}
.content img.fig-left{float:left;max-width:48%;margin:.4em 1.9em 1.3em 0}
.content img.fig-right{float:right;max-width:48%;margin:.4em 0 1.3em 1.9em}
.content::after{content:"";display:block;clear:both}
.content p{overflow-wrap:break-word}
.portrait{float:right;width:190px;margin:.3em 0 1.2em 1.8em}

/* ===== トップページ用パーツ ===== */
.lead{font-size:1.12rem;line-height:2.05;margin:0 0 2em}
.cards{display:grid;font-size:.97rem;grid-template-columns:repeat(auto-fit,minmax(190px,1fr));gap:16px;margin:0 0 2em;padding:0;list-style:none}
.cards li{margin:0}
.cards .card-static{display:block;height:100%;padding:18px 20px;background:#fdfcfb;border:1px solid var(--line);border-radius:6px;line-height:1.7}
.cards a{display:block;height:100%;padding:18px 20px;background:#fdfcfb;border:1px solid var(--line);border-radius:6px;color:var(--ink);text-decoration:none;line-height:1.7}
.cards a:hover{border-color:var(--accent);background:var(--accent-soft);color:var(--accent)}
.cards .card-en{display:block;font-size:.68rem;letter-spacing:.16em;color:var(--ink-soft);text-transform:uppercase;margin-bottom:6px}
.cards a:hover .card-en{color:var(--accent)}
.notice{margin:0 0 1.6em;padding:20px 24px;background:var(--accent-soft);border-left:5px solid var(--accent);border-radius:0 6px 6px 0}
.notice p:last-child{margin-bottom:0}
.notice .notice-title{margin:0 0 .4em;font-size:1.05rem;font-weight:700;color:var(--accent)}
.staff-list{margin:0 0 1.6em;padding:0;list-style:none}
.staff-list li{display:flex;flex-wrap:wrap;gap:.2em 1.2em;padding:.65em 0;border-bottom:1px dotted var(--line)}
.staff-list .role{color:var(--ink-soft);font-size:.92rem}

/* ===== 目次 ===== */
.toc{margin:0 0 2em;padding:16px 20px;background:#f6f4f0;border:1px solid var(--line);border-radius:6px}
.toc-title{font-size:.85rem;font-weight:700;letter-spacing:.1em;color:var(--ink-soft);margin-bottom:.4em}
.toc ul{display:flex;flex-wrap:wrap;gap:8px 10px;margin:0;padding:0;list-style:none}
.toc li{margin:0}
.toc a{display:block;padding:4px 12px;background:#fff;border:1px solid var(--line);border-radius:999px;font-size:.88rem;text-decoration:none;color:var(--navy)}
.toc a:hover{border-color:var(--accent);color:var(--accent)}

/* ===== サイドバー ===== */
.side{position:sticky;top:18px}
.side .box{margin-bottom:20px;background:#fff;border:1px solid var(--line);border-radius:6px;overflow:hidden}
.side h2{margin:0;padding:11px 15px;background:var(--navy);color:#fff;font-size:.95rem;letter-spacing:.08em}
.side ul{margin:0;padding:6px 0;list-style:none}
.side li{margin:0}
.side li a{position:relative;display:block;padding:9px 15px 9px 27px;border-bottom:1px dotted var(--line);color:var(--ink);font-size:.92rem;line-height:1.65;text-decoration:none}
.side li:last-child a{border-bottom:0}
.side li a::before{content:"";position:absolute;left:14px;top:1.02em;width:5px;height:5px;border-right:1.5px solid var(--accent);border-bottom:1.5px solid var(--accent);transform:rotate(-45deg)}
.side li a:hover{background:var(--accent-soft);color:var(--accent)}
.side li a[aria-current="page"]{background:var(--accent-soft);color:var(--accent);font-weight:700}
.side .box-contact{padding:15px}
.side .box-contact p{margin:0 0 .5em;font-size:.86rem;line-height:1.8}
.side .box-contact p:last-child{margin-bottom:0}

/* ===== フッター ===== */
.site-footer{background:var(--navy-dark);color:#c3d0dc;font-size:.9rem}
.site-footer .wrap{padding-top:36px;padding-bottom:26px}
.site-footer a{color:#e6edf4}
.foot-grid{display:flex;flex-wrap:wrap;gap:14px 48px;justify-content:space-between}
.foot-name{font-size:1.05rem;font-weight:700;color:#fff;letter-spacing:.08em;margin:0 0 .3em}
.site-footer p{margin:0 0 .3em;line-height:1.8}
.foot-nav ul{display:flex;flex-wrap:wrap;gap:6px 18px;margin:0;padding:0;list-style:none}
.foot-nav a{font-size:.88rem;text-decoration:none}
.foot-nav a:hover{text-decoration:underline}
.copyright{margin-top:22px;padding-top:16px;border-top:1px solid rgba(255,255,255,.16);font-size:.78rem;color:#8ba0b3;letter-spacing:.04em}

/* ===== レスポンシブ ===== */
@media (max-width:960px){
  .layout{grid-template-columns:1fr;gap:28px;padding-top:28px;padding-bottom:48px}
  .side{position:static}
}
@media (max-width:640px){
  body{font-size:16px;line-height:1.9}
  .wrap{padding:0 16px}
  .header-inner{padding-top:12px;padding-bottom:12px}
  .brand-ja{font-size:1.3rem}
  .brand-sub{font-size:.62rem;letter-spacing:.06em}
  .gnav a{padding:7px 11px;font-size:.9rem}
  .page-head h1{font-size:1.5rem}
  .content{padding:24px 20px}
  .content h2{font-size:1.2rem}
  .content dl{grid-template-columns:1fr;gap:0}
  .content dd{margin:0 0 .9em}
  .content img.fig-left,.content img.fig-right{float:none;max-width:100%;margin:1.5em 0}
  .portrait{float:none;width:60%;max-width:200px;margin:1em 0}
  .lead{font-size:1.05rem}
}
@media (max-width:430px){
  .brand-sub{display:none}
}
@media print{
  .site-header,.side,.site-footer,.toc{display:none}
  body{background:#fff;font-size:11pt}
  .content{border:0;padding:0}
}
