@charset "UTF-8";

:root {
  --reference-green: #a2e879;
  --reference-green-dark: #5da86f;
  --reference-ink: #45494b;
  --reference-muted: #74797c;
  --reference-line: #bfc2bf;
  --reference-gray: #eeeeec;
}

body {
  padding: 12px 18px 24px;
  background: #fff;
  color: var(--reference-ink);
  font-family: Arial, "Meiryo", "メイリオ", sans-serif;
  font-size: 16px;
  line-height: 1.75;
}

a, a:visited { color: #4b626d; }
a:hover { color: #2b713d; }

.site-shell {
  width: min(1180px, 100%);
  padding: 0 0 22px;
  background: #fff;
  box-shadow: none;
}

.site-header {
  display: flex;
  align-items: center;
  min-height: 0;
  padding: 0 0 8px;
  border: 0;
  border-bottom: 1px solid #d0d2cd;
  background: #fff;
}

.brand-row { display: flex; align-items: center; gap: 12px; min-height: 0; }
.brand-copy { padding: 0; }
.brand-copy p { margin: 0; color: #646a6b; font-size: 12px; line-height: 1.35; }
.brand-copy h1 {
  margin: 0;
  color: #333b38;
  font-size: 23px;
  font-weight: 700;
  line-height: 1.25;
}
.brand-copy h1 a, .brand-copy h1 a:visited { color: inherit; text-decoration: none; }
.home-page .brand-copy h1 { font-size: 23px; }

.logo-slot {
  flex: 0 0 52px;
  width: 52px;
  height: 52px;
  display: block;
  border: 0;
  background: #fff;
}
.logo-slot img { display: block; width: 52px; height: 52px; object-fit: contain; }

.page-nav {
  display: flex;
  flex-wrap: wrap;
  gap: 0;
  padding: 3px 0 5px;
  border: 0;
  border-bottom: 1px solid #d0d2cd;
  background: #fff;
}
.page-nav a, .page-nav a:first-child {
  padding: 2px 14px 2px 0;
  margin-right: 14px;
  border: 0;
  background: transparent;
  color: #4a626b;
  font-size: 12px;
  text-decoration: underline;
}
.page-nav a::before { content: "■ "; color: var(--reference-green-dark); font-size: 9px; }
.page-nav a:hover, .page-nav a.current { background: transparent; color: #337247; }

.top-feature {
  display: block;
  padding: 10px 0 0;
}
.main-image-slot { width: 100%; margin: 0; }
.main-image-slot .hero-photo {
  display: block;
  width: 100%;
  max-width: none;
  height: auto;
  border: 2px solid #5ca95c;
}
.main-image-slot figcaption { padding-top: 4px; color: var(--reference-muted); font-size: 11px; }

.updates { margin: 20px 0 0; }
.updates h2, .block-title {
  margin: 0 0 10px;
  padding: 4px 12px;
  border: 0;
  background: var(--reference-gray);
  color: #4f5555;
  font-size: 21px;
  font-weight: 500;
  line-height: 1.5;
}
.updates h2::before, .block-title::before {
  content: "";
  display: inline-block;
  width: 12px;
  height: 12px;
  margin: 0 8px 1px 0;
  background: #8ddd49;
  vertical-align: middle;
}
.updates-subtitle { margin: 2px 0 4px; color: #697071; font-size: 13px; }
.updates-list {
  height: 190px;
  padding: 0 10px;
  overflow-y: auto;
  border: 1px solid #aaa;
  background: #fff;
  scrollbar-color: #999 #eee;
}
.update-item { padding: 8px 0 10px; border-bottom: 1px solid #c9c9c6; }
.update-item time { color: #59666c; font-size: 13px; }
.update-item p { margin: 2px 0 0; color: #555b60; font-size: 13px; line-height: 1.7; }

.home-about, .home-contents { margin: 19px 0 0; }
.home-about p { margin: 0 0 7px; }
.more-link { font-size: 13px; }
.home-card-list {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0 22px;
}
.home-card {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 2px 10px;
  padding: 9px 2px;
  border-bottom: 1px solid #d2d2cf;
  color: #4c5e64;
  text-decoration: none;
}
.home-card:hover { background: #f8f8f6; }
.card-label { grid-column: 1 / 3; color: #858a85; font-size: 11px; letter-spacing: .08em; }
.home-card strong { font-size: 15px; }
.home-card > span:nth-of-type(2) { grid-column: 1; color: #656d70; font-size: 12px; }
.home-card b { grid-column: 2; grid-row: 2 / 4; align-self: center; color: #519455; }

.inner-page { padding: 6px 0 28px; }
.breadcrumb { margin: 0 0 2px; color: #555b5b; font-size: 12px; line-height: 1.4; }
.breadcrumb::before { content: "■ "; color: #8ddd49; }
.page-heading { margin: 0 0 13px; padding: 0; border: 0; }
.page-kicker { margin: 0; color: #686f70; font-size: 10px; letter-spacing: .05em; line-height: 1.3; }
.page-heading h2 {
  margin: 1px 0 8px;
  padding: 2px 12px 4px;
  border: 0;
  border-bottom: 7px solid var(--reference-green-dark);
  border-radius: 4px 4px 0 0;
  background: var(--reference-green);
  color: #303b33;
  font-size: 25px;
  font-weight: 700;
  line-height: 1.45;
  text-shadow: 1px 1px 0 rgba(255,255,255,.8);
}
.page-heading > p:last-child { margin: 0; color: #52595b; font-size: 15px; }
.content-block { margin: 14px 0 0; }
.content-block > p { margin: 0 0 10px; }
.profile-table { font-size: 14px; }
.profile-table th, .profile-table td { padding: 8px 11px; border: 1px solid #ccc; }
.profile-table th { background: #f1f1ef; }
.city-item { padding: 10px 4px; border-bottom: 1px solid #d1d1cd; }
.city-item h3 { font-size: 17px; }
.city-item p { font-size: 14px; }
.external-list { padding-left: 25px; }
.external-list li { padding: 8px 3px; border-bottom: 1px solid #d1d1ce; }
.external-list p { color: #626a6c; font-size: 13px; }
.update-note { border-left: 4px solid #8ddd49; background: #f2f2ef; }

.bbs-form { padding: 16px; border: 1px solid #c8c9c5; background: #f8f8f6; }
.bbs-form label { color: #4e5655; font-size: 14px; }
.bbs-form input[type="text"], .bbs-form textarea { font-size: 15px; }
.bbs-form button { border-color: #4d925a; background: #86d76e; color: #243b2a; font-weight: 600; }
.bbs-form button:hover { background: #75c95e; }
.bbs-entry { padding: 13px 4px; border-bottom: 1px solid #d0d1cd; }
.bbs-entry-head strong { color: #3e5c47; font-size: 14px; }
.bbs-entry-head time { color: #777d7d; font-size: 11px; }
.bbs-entry-message { font-size: 14px; }
.bbs-status { border-color: #a6ce99; background: #f1f8ec; }
.bbs-empty { border-color: #bfc2bd; font-size: 13px; }

.page-return { margin-top: 22px; }
.site-footer { margin: 26px 0 0; padding: 10px 0 0; border-top: 2px solid #6cae72; }
.site-footer p { font-size: 12px; }
.site-footer small { font-size: 10px; }

@media (max-width: 720px) {
  body { padding: 10px 12px 18px; }
  .site-shell { width: 100%; }
  .brand-copy h1, .home-page .brand-copy h1 { font-size: 21px; }
  .logo-slot, .logo-slot img { width: 46px; height: 46px; }
  .logo-slot { flex-basis: 46px; }
  .page-nav a, .page-nav a:first-child { margin-right: 10px; padding-right: 2px; }
  .top-feature { padding-top: 10px; }
  .home-card-list { grid-template-columns: 1fr; }
}
@media (max-width: 560px) {
  body { padding: 10px; }
  .brand-row { gap: 8px; }
  .brand-copy h1, .home-page .brand-copy h1 { font-size: 18px; }
  .logo-slot, .logo-slot img { width: 40px; height: 40px; }
  .logo-slot { flex-basis: 40px; }
  .page-nav { gap: 3px 10px; }
  .page-nav a, .page-nav a:first-child { margin: 0; font-size: 11px; }
  .page-heading h2 { padding: 5px 10px; border-bottom-width: 9px; font-size: 23px; }
  .updates h2, .block-title { font-size: 18px; }
  .profile-table th { width: 32%; }
}
