
:root{--ink:#1D2622;--main:#285848;--deep:#1F463A;--sub:#8E7246;--bg:#F8F4EA;--rule:#DCD3BE;--mute:#6A6657;--line:rgba(248,244,234,.28)}
*{box-sizing:border-box}
body{margin:0;background:var(--bg);color:var(--ink);font-family:"Noto Sans JP",sans-serif;font-size:17px;line-height:1.9}
a{color:inherit;text-decoration:none}
img{max-width:100%;display:block}
.wrap{max-width:1200px;margin:0 auto;padding:0 28px}
.co{font-family:"Noto Sans JP",sans-serif;font-weight:900;letter-spacing:.04em}

.site .wrap{display:flex;justify-content:space-between;align-items:flex-end;gap:24px;padding-top:24px;padding-bottom:18px;flex-wrap:wrap}
.brand{font-size:26px;font-weight:900;color:var(--main);letter-spacing:.06em;line-height:1.2}
.brand small{display:block;font-size:13px;font-weight:400;letter-spacing:.04em;color:var(--mute);margin-top:4px}
.nav{display:flex;gap:22px;font-size:15px;font-weight:700;color:var(--main);flex-wrap:wrap}
.nav a:hover{text-decoration:underline;text-underline-offset:5px}


.atlas{background:var(--main);color:var(--bg);padding:36px 0 44px}
.band-h{margin:0 0 20px;font-size:20px;font-weight:700;letter-spacing:.04em}
.cats{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:28px}
.cat h3{margin:0 0 6px;padding-bottom:8px;font-size:16px;font-weight:700;border-bottom:1px solid var(--line)}
.cat ol{list-style:none;margin:0;padding:0;counter-reset:r}
.cat li{counter-increment:r}
.cat li a{display:block;position:relative;padding:9px 0 9px 26px;border-bottom:1px solid var(--line);font-size:14px;line-height:1.65}
.cat li a::before{content:counter(r);position:absolute;left:0;top:9px;font-weight:700;opacity:.6}
.cat li small{opacity:.65}
.cat li a:hover{text-decoration:underline;text-underline-offset:4px}
.cat .empty{margin:0;padding:9px 0;font-size:13px;opacity:.6}

.recent{list-style:none;margin:36px 0 0;padding:0;display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:0 36px}
.recent li a{display:grid;grid-template-columns:120px 1fr;gap:16px;align-items:center;padding:16px 0;border-top:1px solid var(--rule)}
.recent .thumb{display:block;aspect-ratio:16/10;background:#E6DFCD}
.recent img{width:100%;aspect-ratio:16/10;object-fit:cover}
.recent .c{margin:0 0 4px;font-size:12.5px;font-weight:700;color:var(--main)}
.recent h3{margin:0;font-size:15.5px;line-height:1.6;font-weight:700}
.recent small{font-weight:400;color:var(--mute)}
.recent a:hover h3{color:var(--main)}

.map{display:grid;grid-template-columns:44px repeat(4,minmax(0,1fr));border-top:1px solid var(--line);border-left:1px solid var(--line)}
.map>*{border-right:1px solid var(--line);border-bottom:1px solid var(--line)}
.corner{background:var(--deep)}
.colh{background:var(--deep);padding:14px 16px 16px}
.colh .co{font-size:30px;line-height:1;color:var(--bg)}
.colh h2{margin:8px 0 2px;font-size:17px;font-weight:700}
.colh p{margin:0;font-size:12.5px;line-height:1.6;opacity:.75}
.rowh{background:var(--deep);display:flex;align-items:center;justify-content:center;font-size:20px;font-weight:900}
.cell{position:relative;min-height:168px;padding:12px 14px 14px}
.cell .xy{font-size:12px;font-weight:700;letter-spacing:.1em;opacity:.38}
a.cell{background:var(--bg);color:var(--ink);display:flex;flex-direction:column;border-right-color:var(--main);border-bottom-color:var(--main)}
a.cell .xy{opacity:1;color:var(--sub)}
a.cell b{margin-top:6px;font-size:15.5px;line-height:1.6;font-weight:700}
a.cell small{font-weight:400;color:var(--mute)}
a.cell time{margin-top:auto;padding-top:8px;font-size:12.5px;color:var(--mute)}
a.cell:hover b{color:var(--main);text-decoration:underline;text-underline-offset:4px}
.index h1{margin:0 0 4px;font-size:28px;font-weight:900;letter-spacing:.04em;line-height:1.4}
.index .sub{margin:0 0 22px;font-size:14px;line-height:1.75;opacity:.8}
.index h2{margin:0;padding-bottom:8px;font-size:13px;letter-spacing:.3em;border-bottom:1px solid var(--bg)}
.index ol{list-style:none;margin:0;padding:0}
.index li a{display:grid;grid-template-columns:46px 1fr;gap:8px;padding:11px 0;border-bottom:1px solid var(--line);font-size:14px;line-height:1.6}
.index li .co{font-size:15px}
.index li a:hover span:last-child{text-decoration:underline;text-underline-offset:4px}

.latest{padding:52px 0 72px}
.latest h2,.related h2{margin:0 0 22px;font-size:15px;font-weight:700;letter-spacing:.14em;color:var(--sub)}
.feature{display:grid;grid-template-columns:1.25fr 1fr;gap:44px;align-items:center}
.feature img{width:100%;aspect-ratio:16/10;object-fit:cover}
.feature .c{font-size:14px;font-weight:700;color:var(--main);margin:0 0 8px}
.feature h3{margin:0 0 14px;font-size:27px;line-height:1.5;font-weight:900}
.feature p.e{margin:0 0 14px;font-size:16px;color:#3c443f}
.feature time{font-size:13px;color:var(--mute)}
.feature a:hover h3{color:var(--main)}


.here{background:var(--main);color:var(--bg)}
.here .wrap{display:grid;grid-template-columns:150px 1fr;gap:36px;align-items:center;padding-top:36px;padding-bottom:40px;max-width:1000px}
.mini{display:grid;grid-template-columns:repeat(4,1fr);gap:3px}
.mini i{display:block;aspect-ratio:1;background:var(--deep)}
.mini i.on{background:var(--bg)}
.mini i.has{background:rgba(248,244,234,.35)}
.here .pos{margin:0 0 8px;font-size:15px;font-weight:700;display:flex;gap:14px;align-items:baseline;flex-wrap:wrap}
.here .pos .co{font-size:28px;line-height:1}
.here .pos span:not(.co){font-weight:400;opacity:.8;font-size:13.5px}
.here h1{margin:0;font-size:32px;line-height:1.5;font-weight:900}
.article{padding-top:40px;padding-bottom:80px}
.hero{width:100%;max-width:1000px;margin:0 auto 40px;aspect-ratio:16/8;object-fit:cover}
.article-body{max-width:740px;margin:0 auto}
.article-body p{margin:0 0 1.5em}
.article-body h2{font-size:24px;line-height:1.55;font-weight:900;margin:2.8em 0 1em;padding-left:16px;border-left:8px solid var(--main)}
.article-body h3{font-size:19px;font-weight:700;margin:2em 0 .8em;color:var(--main)}
.article-body a{color:var(--main);text-decoration:underline;text-underline-offset:4px}
.article-body ul,.article-body ol{padding-left:1.4em;margin:0 0 1.5em}
.article-body li{margin-bottom:.4em}
.article-body figure{margin:2.2em -130px}
.article-body figure img{width:100%}
.article-body figcaption{font-size:13px;color:var(--mute);margin-top:8px}
.article-body table{width:calc(100% + 130px);margin:1.6em -65px .6em;border-collapse:collapse;background:#FFFDF7;font-size:15px;line-height:1.65}
.article-body caption{text-align:left;font-weight:700;font-size:15px;padding-bottom:10px}
.article-body th{background:var(--main);color:var(--bg);font-weight:700;text-align:left;padding:11px 14px}
.article-body td{padding:11px 14px;border-bottom:1px solid var(--rule);vertical-align:top}
.article-body .source{font-size:13px;line-height:1.7;color:var(--mute)}
.article-body .source a{color:var(--mute)}
.related{max-width:740px;margin:64px auto 0;padding-top:28px;border-top:3px solid var(--main)}
.related ul{list-style:none;margin:0;padding:0}
.related li a{padding:14px 0;border-bottom:1px solid var(--rule);display:grid;grid-template-columns:60px 1fr;gap:12px;align-items:baseline;font-weight:700;line-height:1.65}
.related li .co{color:var(--sub)}
.related li small{font-weight:400;color:var(--mute)}

footer{border-top:1px solid var(--rule);padding:26px 0 40px;font-size:13px;color:var(--mute)}
footer .wrap{display:flex;gap:24px;flex-wrap:wrap}

@media(max-width:1040px){
  .cats{grid-template-columns:repeat(2,minmax(0,1fr))}
  .article-body figure{margin-left:0;margin-right:0}
  .article-body table{width:100%;margin-left:0;margin-right:0}
}
@media(max-width:820px){
  body{font-size:16px}
  .wrap{padding:0 20px}
  .brand{font-size:22px}
  .nav{gap:14px;font-size:14px}
  .atlas{padding:28px 0 32px}
  .cats{grid-template-columns:1fr;gap:22px}
  .recent{grid-template-columns:1fr}
  .recent li a{grid-template-columns:96px 1fr}
  .feature{grid-template-columns:1fr;gap:20px}
  .feature h3{font-size:21px}
  .here .wrap{grid-template-columns:72px 1fr;gap:18px;padding-top:24px;padding-bottom:26px}
  .here h1{font-size:22px}
  .article-body h2{font-size:20px;border-left-width:6px}
  .article-body table{display:block;overflow-x:auto;white-space:nowrap}
}


.cat h3 a:hover{text-decoration:underline;text-underline-offset:4px}
.feature .thumb{display:block;width:100%;aspect-ratio:16/10;background:#E6DFCD}
.latest .imap-arch-h{margin-bottom:4px}


.imap-pager{margin:40px 0 0}
.imap-pager ul{list-style:none;display:flex;flex-wrap:wrap;gap:8px;margin:0;padding:0}
.imap-pager a,.imap-pager span{display:block;min-width:42px;padding:8px 12px;text-align:center;border:1px solid var(--rule);font-size:14px;line-height:1.4}
.imap-pager .current{background:var(--main);border-color:var(--main);color:#fff}
.imap-pager a:hover{border-color:var(--main);color:var(--main)}
.imap-disclaimer{margin:48px 0 0;padding-top:16px;border-top:1px solid var(--rule);font-size:13px;line-height:1.75;color:var(--mute,var(--sub))}
.imap-page{max-width:800px;margin:0 auto;padding:44px 24px 80px}
.imap-page h1{margin:0 0 24px;font-size:28px;line-height:1.5}
.imap-page .article-body,.imap-page .entry{font-size:inherit}
.imap-page p{margin:0 0 1.5em}
.imap-arch-h{margin:0 0 6px;font-size:26px;line-height:1.5}
.imap-arch-d{margin:0 0 24px;font-size:14px;color:var(--mute,var(--sub))}
.imap-empty{padding:24px 0;color:var(--mute,var(--sub))}
.imap-search{display:flex;max-width:480px;margin:18px 0 0;border:1px solid var(--rule);background:#fff}
.imap-search input{flex:1;min-width:0;border:0;padding:10px 12px;font:inherit;font-size:15px}
.imap-search button{border:0;background:var(--main);color:#fff;font:inherit;font-size:14px;padding:0 16px;cursor:pointer}
.screen-reader-text{position:absolute!important;width:1px;height:1px;overflow:hidden;clip:rect(1px,1px,1px,1px)}
.article-body img{max-width:100%;height:auto}
