@font-face { font-family:SumikaCategory; src:local("MarvinRound"),local("Marvin Round Regular"); font-weight:400; }
/* The header, action buttons, navigation and footer use the same canvas as できること. */
.articles-page .f-canvas { height:auto; }
.articles-page .f-footer { position:relative; top:auto; transform:none; }
.posts-main { --ink-green:#357a36; --rule:#c8d9c5; max-width:1260px; margin:0 auto; padding:426px 40px 100px; }
.posts-main a:focus-visible { outline-offset:4px; }
.archive-title { position:relative; width:fit-content; max-width:100%; margin:0 auto calc(54px + 20px + var(--post-small) * 1.75); text-align:center; }
.archive-word { width:auto; height:27px; margin:0 auto 20px; }
.archive-title h1 { color:var(--green); font:800 78px/1.12 var(--hira); letter-spacing:.075em; }
.hand-news-title { width:320px; height:auto; margin:auto; }
.archive-title p { margin-top:20px; color:#555; font-size:var(--post-small); font-weight:500; }
.archive-owl { position:absolute; top:10px; left:calc(100% + 35px); width:100px; height:auto; transform:rotate(4deg); }
.archive-layout { display:grid; grid-template-columns:minmax(0,1fr) 230px; grid-template-areas:'cards categories' 'pager .'; column-gap:74px; align-items:start; }
.archive-results { grid-area:cards; min-width:0; }
.archive-count { margin:0 0 23px; padding-bottom:12px; border-bottom:2px solid var(--ink-green); font-size:var(--post-small); font-weight:700; }
.post-grid { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:48px 36px; }
.post-card a { display:block; }
.post-category { color:var(--ink-green); margin-bottom:var(--label-gap); font:800 var(--post-label)/1.4 var(--hira); }
.post-picture { margin:0; position:relative; isolation:isolate; overflow:hidden; aspect-ratio:1.6; background:#eff1e9; }
.post-picture img { display:block; width:100%; height:100%; }
.venue-image img { object-fit:cover; object-position:center 46%; }
.post-picture:not(.venue-image) img { position:absolute; inset:16% 12% 19%; width:76%; height:65%; object-fit:contain; }
.post-picture figcaption { position:absolute; right:10px; bottom:8px; padding:2px 7px; background:#fff; color:#464b44; font:600 var(--photo-note)/1.5 var(--yu); }
.art-design,.art-startup { background:#eaf0e4; }
.art-photo,.art-school { background:#f3eedf; }
.art-movie { background:#e9eff0; }
.art-friends { background:#fff; box-shadow:inset 0 0 0 1px var(--rule); }
.post-date { margin:13px 0 5px; color:#515751; font-size:var(--post-small); }
.post-card h2 { font:800 var(--post-card-title)/1.45 var(--hira); overflow-wrap:anywhere; }
.post-card a:is(:hover,:focus-visible) h2,.post-back:hover { color:var(--ink-green); text-decoration:underline; text-underline-offset:.2em; }
.post-categories { grid-area:categories; padding-top:2px; }
.post-categories h2 { padding:1px 0 20px; border-bottom:3px solid #252825; }
.post-categories h2 img { width:156px; height:auto; }
.category-lettering { display:block; font:400 29px/1 SumikaCategory,sans-serif; }
.post-categories h2 img[hidden] { display:none; }
.post-categories ul { list-style:none; margin:0; padding:6px 0 0; }
.post-categories li { border-bottom:1px solid var(--rule); }
.post-categories a { display:flex; justify-content:space-between; align-items:center; gap:12px; padding:13px 8px; min-height:48px; font:800 var(--post-label)/1.5 var(--hira); }
.post-categories a[aria-current] { color:var(--ink-green); background:#f1f6eb; }
.post-categories a:hover { background:#f1f6eb; }
.post-arrow { width:12px; height:auto; flex:none; }
.post-pager { grid-area:pager; display:flex; align-items:center; justify-content:center; flex-wrap:wrap; gap:9px; margin-top:50px; }
.post-pager a,.post-pager span { display:inline-flex; align-items:center; justify-content:center; gap:10px; min-width:48px; min-height:48px; border:2px solid #3e743b; border-radius:5% 6% 4% 5% / 8% 5% 8% 5%; padding:6px 13px; font-size:var(--post-label); }
.post-pager [aria-current] { color:#fff; background:var(--ink-green); }
.post-pager a:hover { background:#eff5ec; }
.post-detail { max-width:972px; margin:0 auto; }
.post-detail>.post-picture { aspect-ratio:1.95; }
.post-detail h1 { margin:32px auto 14px; font:800 var(--post-title)/1.4 var(--hira); overflow-wrap:anywhere; text-wrap:balance; word-break:auto-phrase; }
.post-meta { display:flex; flex-wrap:wrap; align-items:center; gap:6px 18px; padding-bottom:21px; border-bottom:2px solid var(--ink-green); color:#535951; font-size:var(--post-small); }
.post-meta a { color:var(--ink-green); font-weight:800; text-decoration:underline; text-underline-offset:.22em; }
.post-prose { max-width:790px; margin:30px auto 0; font-size:var(--post-body); line-height:1.9; overflow-wrap:anywhere; }
.event-info,.event-apply { margin-top:34px; }
.post-prose h2 { font:800 var(--post-card-title)/1.5 var(--hira); }
.post-blocks > * { margin:0; }
.post-blocks > * + * { margin-top:1em; }
.post-blocks > h2:not(:first-child),.post-blocks > .post-inline-image:not(:first-child) { margin-top:1.6em; }
.post-blocks > h2 + p { margin-top:.45em; }
.post-inline-image img { display:block; width:100%; height:auto; }
.post-inline-image figcaption { margin-top:.55em; color:#50564e; font-size:var(--post-small); line-height:1.65; }
.event-info dl { margin:14px 0 0; border-top:2px solid var(--ink-green); }
.event-info dl div { display:grid; grid-template-columns:minmax(8em,30%) minmax(0,1fr); gap:0 1.5em; border-bottom:1px solid var(--rule); padding:.7em 4px; line-height:1.65; }
.event-info dt { color:var(--ink-green); font-weight:800; }
.event-info dd { margin:0; }
.event-apply { background:#eff4e9; padding:20px 24px; }
.event-apply p,.event-apply a { margin-top:6px; }
.event-apply a,.post-back { display:inline-flex; align-items:center; gap:12px; padding:6px 0; color:var(--ink-green); font-weight:800; }
.post-back { margin-top:32px; min-height:44px; }
.post-back .post-arrow { transform:rotate(180deg); }
@media(min-width:1200px) {
  .posts-main {
    --post-label:max(20px,calc(16px / var(--type-scale)));
    --post-small:max(16px,calc(14px / var(--type-scale)));
    --photo-note:max(14px,calc(12px / var(--type-scale)));
    --post-card-title:max(24px,calc(18px / var(--type-scale)));
    --post-title:max(42px,calc(28px / var(--type-scale)));
    --post-body:max(20px,calc(16px / var(--type-scale)));
    --label-gap:calc(8px / var(--type-scale));
  }
  .post-pager a,.post-pager span,.post-categories a { min-height:max(48px,calc(44px / var(--type-scale))); }
}
@media(max-width:1199px) {
  .posts-main {
    --post-label:16px; --post-small:14px; --photo-note:12px; --post-card-title:20px; --post-title:30px; --post-body:16px; --label-gap:8px;
    width:min(100%,720px); padding:38px 24px 0;
  }
  .archive-title { margin-bottom:calc(32px + 14px + var(--post-small) * 1.75); }
  .archive-word { height:19px; margin-bottom:14px; }
  .archive-title h1 { font-size:48px; }
  .hand-news-title { width:205px; }
  .archive-title p { margin:14px 0 0; }
  .archive-owl { position:static; display:block; width:64px; margin:10px auto 0; }
  .archive-layout { display:flex; flex-direction:column; gap:32px; }
  .archive-layout>* { width:100%; }
  .post-grid { grid-template-columns:minmax(0,1fr); gap:32px; }
  .post-categories h2 { padding-bottom:14px; }
  .post-categories h2 img { width:132px; }
  .category-lettering { font-size:24px; }
  .post-categories a { padding:12px 4px; }
  .archive-count { margin-bottom:18px; }
  .post-pager { margin:0; }
  .post-detail>.post-picture { aspect-ratio:1.5; }
  .post-detail h1 { margin:20px 0 10px; }
  .post-prose { margin-top:22px; }
  .event-apply { padding:16px; }
}
@media(max-width:520px) {
  .event-info dl div { grid-template-columns:1fr; row-gap:.4em; }
}

.event-state { margin-top:1.5em; color:var(--ink-green); font-weight:800; }
.event-apply .apply-button {
  display:inline-flex; align-items:center; justify-content:center; gap:.8em; max-width:100%;
  margin:.55em 0 .25em; padding:.65em 1.1em; min-height:48px; font:800 1em/1.6 var(--hira);
  color:white; background:#356f36; border:0; border-radius:2% 1% 2% 1% / 5% 4% 6% 4%;
}
.event-apply .apply-button:disabled { cursor:default; }
.apply-button .post-arrow { filter:brightness(0) invert(1); }
