.parent {
    display: grid;
    grid-template-columns: repeat(1, 1fr) !important;
    grid-template-rows: auto;
    gap: 4px 0px;
    width: 100%;         /* 親要素に合わせる */
    max-width: 900px;   /* 最大幅を設定できる */
    margin: 0 auto;      /* 中央に配置 */
}
.parent > div {
    padding:10px;
    display: grid;
    place-items: center;
    background: #fff;
}
.parent > div > a {
    text-align: center;
}
.parent > div > a:hover {
    opacity: 0.7;
}

@media (max-width: 670px) {
  .parent {
    grid-template-columns: 1fr;
  }
  .parent > div {
    grid-column: auto !important;
    grid-row: auto !important;
  }
}

.header,.nav,.footer {
    grid-column: span 4 / span 4 !important;
}

.div3 {
    grid-column: span 2 / span 2;
    grid-row-start: 3;
    padding: 0;          /* ← 親の余白を消す */
  display: block;      /* ← grid/center寄せを解除 */
  background: none;    /* 背景色も不要なら外す */
}

.div3 .slideshow {
  width: 100%;   /* div3いっぱいに広げる */
  height: 100%;  /* div3の高さも目一杯 */
}
.div3 .slide img {
  width: 100%;
  height: 100%;
  object-fit: cover;  /* 縦横比を崩さず埋める */
}

a.gobacknews {
  display: block;
  font-size: 14px;
  text-decoration: underline;
  color:#4169e1;
}
.newstopimg {
  width:100%;
  max-width: 500px;
}

img.brlogo {
    width:60%;
    padding-top:10px;
}
img.brtop {
    width:80%;
}


h1 {
    margin: 20px 0;
    font-size:1.17em;  
    letter-spacing: 3px;
}
h3 {
    border-bottom: 4px solid #000;
    padding: 0 0 10px 0;
    margin-bottom: 20px;
}
h4 {
    text-align: left;
}
div.oslist {
    text-align: center;
    margin:0 auto;
}
div.oslist > a {
    display: block;
    border-bottom: 1px solid #666;
}
div.oslist > a:hover {
    opacity: 0.4;
}
div.oslist img {
    width:50%;
}

@media (max-width: 670px) {
  h1 {font-size:1em}
}

.txt-center {text-align: center;}
p.date {
  border-radius: 30px;
  padding:4px 12px;
  border:1px solid #333;
  margin: 30px 0 0 0; 
  font-size: 10px;
}
p.desc {
  width:98%;
  max-width:500px;
  letter-spacing: 1px;
  font-size:13px;
  line-height: 2.2em;
}
.desc > a {
  text-decoration: underline;
  color:#666;
  font-weight: bold;
  font-size:16px;
}
img.descimg {
   width:98%;
   max-width:500px;
}
img.descimg2 {
   width:90%;
   max-width:400px;
}
.mid1 {
    padding:4px 15px;
    border-radius: 20px;
    letter-spacing: 3px;
    background: #666;
    color:#fff;
}
.marker {
    background: linear-gradient(transparent 50%, #ffd700 70%);
}

/* ベース */
.deflist, .deflist dt, .deflist dd { margin: 0; }
.deflist {
  max-width: 550px;
  display: grid;
  grid-template-columns: 140px 1fr; /* 左:見出し/右:内容 */
  gap: 12px 20px;                   /* 行間 / 列間 */
  align-items: start;               /* 上揃え */
  padding: 16px 0;
  font-size: 15px;
  line-height: 1.7;
}

/* 左カラム(dt)見た目 */
.deflist dt {
  font-weight: 600;
  color: #333;
  /* 行の上下ボーダーと揃えるために下線 */
  padding: 10px 0;
}

/* 右カラム(dd)見た目 */
.deflist dd {
  padding: 10px 0;
  border-bottom: 1px solid #f0f0f0;
  color: #555;
}

/* 行頭アイコンやコロンを入れたい場合（任意） */
/* .deflist dt::after { content: "："; color:#999; margin-left:.25em; } */

/* 2行以上のddにも対応：折返しても行高はautoのまま */
.deflist { grid-auto-rows: auto; }

/* 背景のゼブラ（任意）
.deflist dt:nth-of-type(4n+1),
.deflist dd:nth-of-type(4n+2) { background: #fafafa; } */

/* スマホ：縦積み（見出し→内容） */
@media (max-width: 640px) {
  .deflist {
    grid-template-columns: 1fr; /* 1カラム */
    gap: 0;                      /* 隙間を詰める */
  }
  .deflist dt, .deflist dd {
    border-bottom: none;
    padding: 10px 0;
  }
  .deflist dt {
    color: #666;
    font-weight: 600;
  }
  .deflist dd {
    padding-top: 0;
    padding-bottom: 14px;
    border-bottom: 1px solid #eee; /* 項目ごとの区切り */
  }
}


.news {
  max-width: 900px;
  margin: 2rem auto;
  padding: 0 1rem;
}
.news h2 {
  font-size: 1.6rem;
  margin-bottom: 1.5rem;
  border-left: 4px solid #333;
  padding-left: 10px;
}

/* 一覧 */
.news-list {
  list-style: none;
  margin: 0;
  padding: 0;
}
.news-list li {
  border-bottom: 1px solid #e5e5e5;
}
.news-list li a {
  display: flex;
  align-items: flex-start;
  gap: 16px;
  text-decoration: none;
  color: #333;
  padding: 16px 0;
  transition: background 0.2s;
}
.news-list li a:hover {
  background: #fafafa;
}

/* サムネイル */
.news-list .thumb {
  flex-shrink: 0;
  width: 140px;
  height: 80px;
  overflow: hidden;
  border-radius: 4px;
  background: #ddd;
}
.news-list .thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

/* テキスト部分 */
.news-list .meta {
  flex: 1;
  display: flex;
  flex-direction: column;
}
.news-list .date {
  font-size: 0.7rem;
  color: #888;
  margin-bottom: 6px;
}
.news-list .title {
  letter-spacing: 0.7px;
  font-size: 0.85rem;
  font-weight: 500;
  line-height: 1.6;
  color: #222;
}

/* スマホ対応（縦積み） */
@media (max-width: 640px) {
  .news-list li a {
    flex-direction: column;
  }
  .news-list .thumb {
    width: 100%;
    height: auto;
    max-height: 220px;
  }
}

.map {
    position: relative;
    width: 100%;
    max-width: 500px;
    padding-top: 56.25%;
    /* 16:9のアスペクト比 */
    height: 0;
    margin:15px 0;
}

.map iframe {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
}

/* ---------- フォーム用スタイル（レスポンシブ） ---------- */
:root{
  --form-bg: #ffffff;
  --accent: #2d8cff;
  --muted: #8f9bb3;
  --border: #e6e9ee;
  --shadow: 0 6px 20px rgba(18,36,63,0.06);
  --radius: 12px;
  --gap: 12px;
  --pad: 18px;
  --font: "Yu Gothic UI", "Hiragino Kaku Gothic ProN", "Segoe UI", sans-serif;
}

form[name="form1"]{
  box-sizing: border-box;
  font-family: var(--font);
  width: 100%;
  max-width: 500px;              /* HTML に合わせた最大幅 */
  margin: 24px auto;
  background: var(--form-bg);
  border-radius: var(--radius);
  padding: calc(var(--pad) * 0.8);
  box-shadow: var(--shadow);
  border: 1px solid var(--border);
  color: #132033;
}

/* 全体の段落（ラベル） */
form[name="form1"] p {
  margin: 0 0 8px 0;
  font-size: 0.95rem;
  color: #233049;
}

/* 入力行のコンテナを柔軟にする */
form[name="form1"] p {
  display: flex;
  gap: var(--gap);
  align-items: center;
  flex-wrap: wrap; /* 小さい画面で縦に折返す */
}

/* テキスト入力の基本スタイル */
form[name="form1"] input[type="text"],
form[name="form1"] input[type="email"],
form[name="form1"] input[type="tel"],
form[name="form1"] textarea {
  -webkit-appearance: none;
  appearance: none;
  border: 1px solid var(--border);
  background: #fff;
  padding: 10px 12px;
  border-radius: 8px;
  font-size: 0.95rem;
  color: #142433;
  transition: border-color .18s ease, box-shadow .18s ease;
  box-sizing: border-box;
}

/* 入力のフォーカス */
form[name="form1"] input:focus,
form[name="form1"] textarea:focus {
  outline: none;
  border-color: var(--accent);
  box-shadow: 0 4px 14px rgba(45,140,255,0.12);
}

/* 姓・名フィールド：横並びで等分割 */
form[name="form1"] p:nth-of-type(2) > input[type="text"] {
  flex: 1 1 48%;           /* ほぼ半分ずつ（gapに応じて縮む） */
  min-width: 110px;
}

/* TELフィールド：小さめの入力を指定 */
form[name="form1"] input[name^="field_50144_"] {
  flex: 0 0 28%;           /* 幅固定寄り（3分割で表示） */
  min-width: 64px;
  text-align: center;
}

/* TELのハイフン等の扱いで余白を調整（見た目） */
form[name="form1"] p:nth-of-type(4) { margin-top: 8px; }

/* レスポンシブ：小さい画面では各入力を全幅にする */
@media (max-width: 520px) {
  form[name="form1"] {
    padding: 14px;
    border-radius: 10px;
  }
  /* 各行を縦並びに */
  form[name="form1"] p {
    flex-direction: column;
    align-items: stretch;
  }
  /* 姓・名は縦並びで全幅 */
  form[name="form1"] p:nth-of-type(2) > input[type="text"] {
    flex: 1 1 100%;
    min-width: 0;
  }
  /* TELの各部も全幅に */
  form[name="form1"] input[name^="field_50144_"] {
    flex: 1 1 100%;
    width: 100%;
  }
}

/* プレースホルダの色 */
form[name="form1"] ::placeholder {
  color: #b8c2d6;
}

/* submit（もしあれば）のボタンスタイル */
form[name="form1"] input[type="submit"],
form[name="form1"] button[type="submit"] {
  display: inline-block;
  background: linear-gradient(135deg, var(--accent), #1c6fe0);
  color: #fff;
  border: none;
  padding: 12px 18px;
  border-radius: 10px;
  font-weight: 600;
  cursor: pointer;
  box-shadow: 0 8px 18px rgba(29,85,180,0.12);
  transition: transform .12s ease, box-shadow .12s ease, opacity .12s ease;
  margin-top: 10px;
}
form[name="form1"] input[type="submit"]:hover,
form[name="form1"] button[type="submit"]:hover {
  transform: translateY(-2px);
  box-shadow: 0 12px 26px rgba(29,85,180,0.16);
}

/* 補足：長いラベルが崩れないように調整 */
form[name="form1"] p:first-child { /* 「お名前」などの見出しテキスト */
  font-weight: 600;
  color: #2b3b4a;
  margin-bottom: 6px;
  display: block;
}

/* optional: 各行の下に薄い区切り線を入れる（見やすさ） */
form[name="form1"] > p + p,
form[name="form1"] > p + br + p { /* safe fallback */
  border-bottom: none;
}
.red {color:red;}