/* 水谷研究室 K1（スイス×シグナル） */
:root{--ink:#111;--sub:#444;--mute:#6b6b6b;--line:#ddd;--blue:#009ede;--green:#03715b;--bg:#fff;--max:1440px;--pad:clamp(20px,3.2vw,56px)}
*{box-sizing:border-box;margin:0;padding:0}.wvw{overflow:hidden}
html[lang=ja] .en,html[lang=en] .ja{display:none!important}
body{font-family:"Inter","Noto Sans JP",sans-serif;color:var(--ink);background:var(--bg);font-size:15.5px;line-height:1.75;-webkit-text-size-adjust:100%}
img{max-width:100%;display:block}a{color:inherit;text-decoration:none}ul,ol{list-style:none}
a:focus-visible,button:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.skip{position:absolute;left:-999px}.skip:focus{left:8px;top:8px;background:#fff;padding:6px 10px;z-index:99}
/* header */
.hd{position:sticky;top:0;z-index:20;display:flex;justify-content:space-between;align-items:center;padding:10px var(--pad);background:#fff;border-bottom:2px solid var(--ink)}
.brand img{height:56px;width:auto}
.nav{display:flex;gap:24px;align-items:center}.nav ul{display:flex;gap:18px}.nav li a{font-size:13px;font-weight:600}.nav li a.on{color:var(--blue)}.nav li a:hover{color:var(--blue)}
.lang{border:1.5px solid var(--ink);background:none;border-radius:999px;padding:3px 12px;font:inherit;font-size:12px;font-weight:600;cursor:pointer;color:inherit}
.menu{display:none;background:none;border:0;width:44px;height:44px;cursor:pointer}.menu i{display:block;width:22px;height:2px;background:var(--ink);margin:5px auto}
/* grid */
.g{max-width:var(--max);margin:0 auto;padding:0 var(--pad);display:grid;grid-template-columns:repeat(12,1fr);column-gap:24px}
.g>*{grid-column:1/-1}
.k{font-size:12px;font-weight:700;letter-spacing:.2em}
.dot{color:var(--blue)}
.hero{padding-top:88px;align-items:end}.hero h1{grid-column:1/9;font-size:clamp(44px,7vw,96px);font-weight:800;line-height:1;letter-spacing:-.03em;margin-top:14px}.hero p{grid-column:9/13;font-size:14.5px;color:#333;padding-bottom:10px}
.wv{display:block;width:100%;height:clamp(110px,12.5vw,260px);margin-top:24px}.wv.thin{height:clamp(60px,6.5vw,130px);margin-top:8px}
.phd{padding-top:64px}.phd h1{font-size:clamp(38px,5.5vw,72px);font-weight:800;letter-spacing:-.03em;line-height:1.05;margin-top:10px}.phd .sub{font-size:14px;font-weight:700;margin-top:8px}.phd p{max-width:720px;color:var(--sub);margin-top:8px}
.bar{display:flex;justify-content:space-between;align-items:baseline;border-top:2px solid var(--ink);padding-top:10px;margin:64px 0 20px}.bar h2{font-size:13px;font-weight:700;letter-spacing:.08em}.bar a{font-size:13px;font-weight:700}.bar a:hover{color:var(--blue)}
.note{font-size:13px;color:var(--mute);margin-top:28px}.note a{text-decoration:underline}
/* 写真・地図は最初からカラー（2026-09-22 教授） */
/* research cards (home) — subgrid で行をそろえる */
.rg{display:grid;grid-template-columns:repeat(3,1fr);column-gap:24px}
.rc{display:grid;grid-row:span 4;grid-template-rows:subgrid;row-gap:0;border-top:1px solid var(--ink);padding-top:14px}
.n{display:flex;justify-content:space-between;font-size:13px;font-weight:700}.n span:last-child{color:var(--blue);letter-spacing:.12em}
.rc h3{font-size:19px;line-height:1.4;margin:8px 0 12px}.rc p{font-size:14px;color:var(--sub);margin-top:12px}
.im{height:0;padding-top:75%;background-size:cover;background-position:center}.rc:hover h3{color:var(--blue)}
/* timeline */
.tl li a{display:grid;grid-template-columns:3fr 9fr;column-gap:24px;padding:16px 0;border-bottom:1px solid var(--line)}
.tl time{font-weight:700;font-variant-numeric:tabular-nums;display:flex;align-items:center;gap:12px}.tl time:before{content:"";width:9px;height:9px;border-radius:50%;border:2px solid var(--blue);flex:none}.tl li:first-child time:before{background:var(--blue)}
.tl h3{font-size:16px;font-weight:500}.tl a:hover h3{text-decoration:underline}
/* news page */
.art{margin-top:40px}.na{display:grid;grid-template-columns:3fr 6fr 3fr;column-gap:24px;padding:28px 0;border-top:1px solid var(--line);scroll-margin-top:90px}
.na .meta{display:flex;flex-direction:column;gap:6px}.na time{font-weight:700;font-variant-numeric:tabular-nums}.tag{align-self:flex-start;font-size:11.5px;font-weight:700;border:1.5px solid var(--ink);padding:0 8px;letter-spacing:.06em}
.na h2{font-size:19px;line-height:1.45;margin-bottom:8px}.na .tx{font-size:14.5px;color:#222}.na .tx ul{margin:8px 0;padding-left:1.2em;list-style:disc}.na .tx a{text-decoration:underline}
.na figure img{width:100%;aspect-ratio:4/3;object-fit:cover}.na figcaption{font-size:11px;color:var(--mute);margin-top:4px}
.na:target{background:linear-gradient(90deg,rgba(0,158,222,.06),transparent)}
/* research page */
.rs{display:grid;grid-template-columns:2fr 6fr 4fr;column-gap:24px;padding:32px 0;border-top:1px solid var(--ink);margin-top:40px;scroll-margin-top:90px}
.rs .n{flex-direction:column;gap:4px;justify-content:flex-start}.rs h2{font-size:22px;line-height:1.45;margin-bottom:12px}.rs p{color:#222}
.fund{margin-top:18px;border-left:3px solid var(--blue);padding-left:12px;font-size:13.5px;color:var(--sub)}.fund b{display:block;font-size:12px;letter-spacing:.06em;color:var(--ink)}
/* publications */
.toc{display:flex;flex-wrap:wrap;gap:8px;margin-top:40px}.toc a{font-size:13px;font-weight:600;border:1.5px solid var(--ink);padding:3px 12px}.toc a:hover{background:var(--ink);color:#fff}
.ps{scroll-margin-top:80px}.pl li{display:grid;grid-template-columns:64px 1fr;gap:12px;padding:12px 0;border-bottom:1px solid var(--line);font-size:14.5px}.pid{font-weight:700;color:var(--blue);font-variant-numeric:tabular-nums}.pl b{font-weight:600}
/* members */
.staff{display:grid;grid-template-columns:2fr 10fr;column-gap:28px}.staff .ph img{width:100%;aspect-ratio:3/4;object-fit:cover;}
.gr{font-size:12.5px;font-weight:700;letter-spacing:.06em;color:var(--mute)}.nm{font-size:22px;font-weight:700;margin:2px 0 4px}
.mail{display:block;font-family:ui-monospace,Menlo,monospace;font-size:13px;color:var(--sub);line-height:1.6}.mail{font-size:12.5px}.mail img{display:inline-block;width:auto;height:18px;max-width:100%;vertical-align:-4px}
.lk{display:flex;flex-wrap:wrap;gap:8px;margin:14px 0}.lk a{font-size:12.5px;font-weight:600;border-bottom:1.5px solid var(--blue)}
.cv{border-collapse:collapse;font-size:13.5px;margin:10px 0 14px;width:100%}.cv th{text-align:left;font-weight:700;padding:5px 16px 5px 0;white-space:nowrap;vertical-align:top;font-variant-numeric:tabular-nums}.cv td{padding:5px 0;border-bottom:1px solid #eee}
.bio{font-size:13.5px;color:var(--sub)}
.grp{font-size:14px;font-weight:700;margin:26px 0 12px}.sg{display:grid;grid-template-columns:repeat(4,1fr);gap:24px}
.sc .ph{overflow:hidden}.sc .ph img{width:100%;aspect-ratio:4/3;object-fit:cover;transition:transform .3s}
.sc .gr{margin-top:10px}.sc .nm{font-size:17px}
/* lab */
.intro{max-width:800px}.intro p{margin-bottom:12px}
.gal{display:grid;grid-template-columns:repeat(4,1fr);gap:12px}.gal .gc{position:relative;height:0;padding-top:75%;overflow:hidden}.gal .gc img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover;display:block}.gal .gc:first-child{grid-column:span 2;grid-row:span 2;padding-top:calc(75% + 3px)}.gal .gc:nth-child(6),.gal .gc:nth-child(7){grid-column:span 2;padding-top:calc(37.5% - 4.5px)}
/* lectures */
.lt{width:100%;border-collapse:collapse;font-size:14px}.lt th{text-align:left;font-size:12px;letter-spacing:.06em;border-bottom:2px solid var(--ink);padding:6px 10px 6px 0}.lt td{padding:12px 10px 12px 0;border-bottom:1px solid var(--line);vertical-align:top}.lt td:first-child a{font-weight:600;border-bottom:1.5px solid var(--blue)}
/* access */
.acc{grid-template-columns:repeat(12,1fr)}.acc>div:first-child{grid-column:1/7}.acc .map{grid-column:7/13;margin-top:64px;min-height:420px}.acc iframe{width:100%;height:100%;min-height:420px;border:0;}
.rooms li{display:flex;gap:16px;padding:8px 0;border-bottom:1px solid var(--line)}.rooms b{font-variant-numeric:tabular-nums;min-width:40px}.acc p a{display:inline-block;margin-top:8px;font-weight:600;border-bottom:1.5px solid var(--blue)}
/* footer */
.ft{margin-top:112px;background:#0f1a24;color:#9fb0bf;text-align:center;padding:48px 20px 32px}.ft-logos{display:flex;justify-content:center;align-items:center;gap:22px;margin-bottom:22px}.ft-logos img{height:38px;width:auto}.ft-logos .sep{width:1px;height:28px;background:#3a4a58}.ft-addr{font-size:12.5px;margin-bottom:8px}.copy{font-size:11.5px;opacity:.7}
/* tablet / phone */
@media(max-width:1000px){.sg{grid-template-columns:repeat(3,1fr)}}
@media(max-width:900px){
 .hd{padding:8px 20px}.brand img{height:44px}.menu{display:block}
 .nav{display:none;position:absolute;left:0;right:0;top:100%;background:#fff;border-bottom:2px solid var(--ink);padding:4px 20px 18px;flex-direction:column;align-items:flex-start;gap:12px}.nav.open{display:flex}.nav ul{flex-direction:column;width:100%;gap:0}.nav li a{display:block;padding:11px 0;border-bottom:1px solid #eee;font-size:15px}
 .g{padding:0 20px}.hero{padding-top:48px}.hero h1,.hero p{grid-column:1/-1}.hero p{margin-top:16px}
 .wv{height:120px;width:240%;margin-left:-70%}.wv.thin{height:70px}
 
 .tl li a{grid-template-columns:1fr;row-gap:2px}
 .na{grid-template-columns:1fr;row-gap:10px}.na figure{max-width:240px}
 .rs{grid-template-columns:1fr;row-gap:12px}.rs .n{flex-direction:row;justify-content:space-between}
 .staff{grid-template-columns:1fr}.staff .ph{max-width:200px;margin-bottom:16px}
 .sg{grid-template-columns:1fr 1fr;gap:16px}
 .gal{grid-template-columns:1fr 1fr}
 .lt thead{display:none}.lt tr{display:block;padding:12px 0;border-bottom:1px solid var(--line)}.lt td{display:block;border:0;padding:1px 0}.lt td:first-child{font-size:15px;margin-bottom:4px}
 .acc>div:first-child,.acc .map{grid-column:1/-1}
}
@media(prefers-reduced-motion:reduce){*{transition:none!important}}
/* ニュースの写真ギャラリー（flex の行で組む。Safari 対策） */
.ngal{grid-column:2/4;display:flex;flex-direction:column;gap:8px;margin-top:18px}
/* 行の高さは幅に比例（ブラウザの幅に合わせて写真ごと拡大・縮小） */
.grow{position:relative;height:0;padding-top:34.48%}.grow.s{padding-top:17.24%}
.gin{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;gap:8px}
.gin>.gi{flex:1 1 0;min-width:0}.gin>.gi.m{flex:2 1 0}
.stk{flex:1 1 0;min-width:0;display:flex;flex-direction:column;gap:8px}.stk>.gi{flex:1 1 0;min-height:0}
.gi{position:relative;overflow:hidden;background:#eef2f4}.gi img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}
.ph-empty{background:repeating-linear-gradient(135deg,#f3f6f8 0 10px,#e9eef1 10px 20px);display:grid;place-items:center;border:1px dashed #b9c6ce}.ph-empty span{font-size:12px;font-weight:700;color:#6b7c86;letter-spacing:.08em}
.na.draft{outline:2px dashed #f2b233;outline-offset:6px}.na.draft:before{content:"下書き（公開されません）";grid-column:1/-1;font-size:11px;font-weight:700;color:#b07a00;margin-bottom:6px}
@media(max-width:900px){.ngal{grid-column:1/-1;gap:6px}.gin{gap:6px}.stk{gap:6px}}
/* 研究テーマの数に応じた列数（ホーム） */
.rg.c1,.rg.c2{grid-template-columns:repeat(2,1fr)}.rg.c4{grid-template-columns:repeat(4,1fr)}
.rg.c4 .rc h3{font-size:17px}
@media(max-width:1100px){.rg.c4{grid-template-columns:repeat(2,1fr);row-gap:32px}}
.rc.draft,.rs.draft{outline:2px dashed #f2b233;outline-offset:6px}
/* ヘッダー: 文字版（シンボル＋テキスト） */
.brand.txt{display:flex;align-items:center;gap:12px}.brand.txt img{height:46px}
.bt{display:flex;flex-direction:column;line-height:1.3}.bt b{font-size:18px;font-weight:700;letter-spacing:.02em}.bt small{font-size:11px;color:#444;letter-spacing:.02em}
@media(max-width:900px){.brand.txt img{height:38px}.bt b{font-size:16px}.bt .l3{display:none}}
/* ヘッダー: 折衷（PC は正式ロゴ画像、スマホはシンボル＋研究室名） */
.brand.hy .b-sp{display:none}
@media(max-width:900px){.brand.hy .b-pc{display:none}.brand.hy .b-sp{display:flex;align-items:center;gap:10px}.brand.hy .b-sp img{height:38px}.brand.hy .b-sp b{font-size:16px;font-weight:700;letter-spacing:.02em;white-space:nowrap}}
@media(max-width:360px){.brand.hy .b-sp b{font-size:14px}}
@media(max-width:900px){.sc .mail{font-size:11.5px}.sc .mail img{height:15.5px;vertical-align:-3px}}
@media(max-width:600px){.grow{padding-top:45.45%}.grow.s{padding-top:22.73%}}
/* ホームの研究カード: 641〜900px も3列（幅に合わせて縮む）、640px 以下で1列 */
@media(max-width:900px){.rc h3{font-size:16px}.rc p{font-size:13px}}
@media(max-width:640px){.rg,.rg.c4{grid-template-columns:1fr}.rc{grid-row:auto;grid-template-rows:auto;margin-bottom:28px}.rc h3{font-size:19px}.rc p{font-size:14px}}
.pl a{border-bottom:1.5px solid var(--blue)}.pl a:hover{color:var(--blue)}
.gcap{font-size:11px;color:var(--mute);text-align:right;margin-top:4px}
.grow.one{padding-top:0;height:auto;max-width:560px}.grow.one .gin{position:static;aspect-ratio:4/3}
@media(max-width:600px){.grow.one .gin{aspect-ratio:4/3}}
/* ニュース: 本文の右に小さく置く写真 */
.nside{grid-column:3/4;display:flex;flex-direction:column;gap:8px}
.nside .gi{position:relative;overflow:hidden;background:#eef2f4;aspect-ratio:4/3}
.nside .gi img{position:absolute;top:0;left:0;width:100%;height:100%;object-fit:cover}
.nside .gcap{text-align:left}
@media(max-width:900px){.nside{grid-column:1/-1;flex-direction:row;flex-wrap:wrap;max-width:330px;gap:6px}.nside .gi{flex:1 1 0}.nside .gcap{width:100%;text-align:left}}
/* 右に写真を置かない記事は、本文を右端まで使う */
.na .meta{grid-column:1/2}.na .nb{grid-column:2/3}.na.wide .nb{grid-column:2/4}
.noph{background:#eef2f4;aspect-ratio:4/3;display:grid;place-items:center}
.noph svg{width:46%;fill:#c3ced6}
