@charset "Shift_JIS";
/* -------------------------------------------
ベース（もともとのCSS)
------------------------------------------- */
body,
html {
  margin: 0;
  padding: 0;
  background-color: #000000;
  font-size: small;
}
.newsdate {
  color: #666666;
}
.newsdate2 {
  font-size: x-small;
  color: #666666;
}
.newstitle2 {
  padding: 5px 0px 3px 0px;
}
.newsshop {
  font-size: x-small;
}
a:link {
  color: #006699;
}
a:visited {
  color: #006699;
}
a:hover {
  color: #ff9900;
}
a:active {
  color: #ff9900;
}
.topictitle {
  font-weight: bold;
}
.topicphon {
  font-size: x-small;
  padding-top: 5px;
}
.topictxt {
  font-size: x-small;
  color: #777728;
  padding-top: 5px;
}
.listtitle {
  font-size: medium;
  font-weight: bold;
}
/* -------------------------------------------
パンくず　言語切り替えボタン
------------------------------------------- */
/* table全体（今の雰囲気キープ） */
table.breadcrumb {
  border-collapse: separate; /* cellspacing=1 を活かす */
  background: #ccc;
}

/* td内を左右に分割 */
.breadcrumb__inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

/* 左：パンくず */
.breadcrumb__path {
  min-width: 0;
  font-size: 14px;
  line-height: 1.4;
}

/* 右：言語切替 */
.breadcrumb__lang {
  flex: 0 0 auto;
  font-size: 12px;
  line-height: 1;
  white-space: nowrap;
  color: #666;
}

.breadcrumb__langLink {
  color: #006699;
  text-decoration: none;
}

.breadcrumb__langLink:hover {
  text-decoration: underline;
}

.breadcrumb__langLink.is-current {
  color: #333;
  font-weight: bold;
  pointer-events: none; /* 現在言語はクリック不可 */
  cursor: default;
}

.breadcrumb__sep {
  margin: 0 6px;
  color: #888;
}

/* -------------------------------------------
ここからマップ用のCSS
------------------------------------------- */
.title_area p {
  margin-bottom: 0;
  margin-top: 0;
  color: #888;
  font-size: 11px;
}
:root {
  --bg: #ffffff;
  --ink: #111;
  --muted: #b5bcbb;
  --line: #d9d9d9;
  --panel: #f5f5eb;
  --link: #2a94c9;
  --active: #111;
  --activeInk: #fff;
}

.wrap {
  /* max-width: 980px; */
  margin: 0 auto;
  /* padding: 14px 14px 40px; */
}

/* 昼/夜（ページリンク） */
.tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 14px;
  margin: 10px 0 14px;
}
.tabLink {
  display: block;
  text-align: center;
  border: 1px solid var(--line);
  background: #fff;
  padding: 14px 10px;
  font-size: 16px;
  text-decoration: none;
  color: var(--ink);
}
.tabLink.is-active {
  background: var(--panel);
  border-color: #cfcfcf;
  font-weight: 700;
  pointer-events: none;
}

.tabLink:hover {
  background: var(--panel);
}
/* フォーカス（リーフレット） */
.item.is-focus {
  outline: 2px solid #2a94c9;
  outline-offset: 2px;
}
.pinPopup__title {
  font-weight: 700;
  margin-bottom: 6px;
}
.pinPopup__btn {
  cursor: pointer;
  padding: 6px 10px;
}
.item.is-focus {
  outline: 2px solid #2a94c9;
  outline-offset: 2px;
}

/* マイマップ */
.mapBox {
  border: 1px solid var(--line);
  background: #fff;
}
.mapBox iframe {
  width: 100%;
  height: 420px;
  border: 0;
  display: block;
}
/* マイマップボタン */
.map-open {
  margin: 12px 0 16px;
}

.map-open__btn {
  display: block;
  text-align: center;
  padding: 14px 12px;

  border: 1px solid #d6d6d6;
  border-radius: 2px;
  background: #f7f7f7;
  color: #111;
  text-decoration: none;
  font-weight: 700;
}

.map-open__btn:hover {
  background: #efefef;
}

.map-open__btn:focus-visible {
  outline: 2px solid #000;
  outline-offset: 2px;
}

.map-open__note {
  margin: 8px 0 0;
  font-size: 12px;
  color: #666;
}

/* カテゴリチップ */
.chips {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  margin: 12px 0 10px;
}
.chip {
  border: 1px solid var(--line);
  background: #fff;
  padding: 8px 12px;
  font-size: 14px;
  cursor: pointer;
  white-space: nowrap;
}
.chip.is-active {
  background: var(--active);
  color: var(--activeInk);
  border-color: var(--active);
}
#chips {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 10px;
  margin: 12px 0 10px;
}

/* 一覧（ul/li版） */
#list {
  margin: 0;
  padding: 0;
  list-style: none;
  border: 1px solid var(--line);
  background: var(--panel);
}

/* liの区切り線 */
#list .item {
  margin: 0;
  padding: 0;
  border-top: 1px solid var(--line);
}
#list .item:first-child {
  border-top: 0;
}

/* summary */
#list summary {
  cursor: pointer;
  padding: 14px 14px;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  font-weight: 600;
  list-style: none;
  color: #22242b;
}
#list summary div {
  text-align: right;
}

/* デフォルトのマーカー消す */
#list summary::-webkit-details-marker {
  display: none;
}

/* ▼ここから追加 */
/* ===== details 標準マーカーを消す（2個出る原因を潰す） ===== */
#list details > summary::-webkit-details-marker {
  display: none; /* Chrome/Edge/Safari */
}
#list details > summary::marker {
  content: ""; /* Firefox */
}
#list details > summary {
  list-style: none; /* 念のため */
}

/* ===== 自作の三角（回転する方） ===== */
#list details > summary {
  position: relative;
  padding-left: 34px; /* 三角分の余白 */
}

/* もし前に「?」文字版が残ってても上書きされる */
#list details > summary::before {
  content: "";
  width: 0;
  height: 0;
  border-left: 6px solid #006699;
  border-top: 4px solid transparent;
  border-bottom: 4px solid transparent;
  position: absolute;
  left: 14px;
  top: 50%;
  transform: translateY(-50%) rotate(0deg);
  transform-origin: center;
  transition: transform 180ms ease;
}

/* 開いたら90度回転 */
#list details[open] > summary::before {
  transform: translateY(-50%) rotate(90deg);
}

/* カテゴリバッジ */
.badge {
  font-size: 10px;
  color: #777777;
  border: 1.5px solid #7a98a7;
  background: #f5f5f5d9;
  padding: 2px 8px;
  border-radius: 999px;
  flex: 0 0 auto;
  margin: 3px;
  display: inline-block;
}
/* カテゴリカラー */
.purple {
  color: #a78fa7;
  border-color: #a78fa7;
}
.red {
  color: #a77a7a;
  border-color: #a77a7a;
}
.blue {
  color: #7a8fa7;
  border-color: #7a8fa7;
}
.pink {
  color: #8f7aa7;
  border-color: #8f7aa7;
}
.brown {
  color: #a79b7a;
  border-color: #a79b7a;
}
.green {
  color: #7aa78f;
  border-color: #7aa78f;
}

/* 詳細 */
.detailBody {
  padding: 1px 14px 14px;
  font-size: 14px;
  line-height: 1.7;
  background-color: var(--bg);
  color: #2d3527;
}
.meta {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 16px;
  margin: 10px 0 8px;
  font-size: 13px;
}
.meta span {
  color: var(--muted);
  margin-right: 6px;
}
.actions {
  display: flex;
  gap: 14px;
  font-size: 13px;
}
.actions a {
  text-decoration: none;
}
.actions a:hover {
  text-decoration: underline;
}