.align-left{float:left;margin:0 1em .5em 0; display: inline; }
.align-right{float:right;margin:0 0 .5em 1em; display: inline; }
.align-center{display:block;margin:0 auto;max-width:100%; }
img{max-width:100%;height:auto; }
/* div#content { width:800px; padding:12px 24px 12px 24px; border-left:1px solid silver; } */
#content img:not(.align-left):not(.align-right):not(.align-center),
.contentbody img:not(.align-left):not(.align-right):not(.align-center) {
  display:block;
  margin-left:auto;
  margin-right:auto;
  float:none;
}
.contentbody img { max-width:100%; height:auto; }
/* div.contentbody { width:1024px; margin-left:auto; margin-right:auto; padding:12px 24px 12px 24px; border-left:1px solid silver; border-right:1px solid silver; } */
/* 段落・画像まわりの余白 */
.contentbody p{ margin: 1em 0 1.25em; line-height: 1.2; }
.contentbody .align-left{ float:left; margin:.2em 1em .6em 0; display:inline; }
.contentbody .align-right{ float:right; margin:.2em .8em .6em 1em; display:inline; }
.content body.align-center{ margin:.8em auto; float:none; }

/* divで来ても最小限は空ける（保険） */
.content > div{ margin: 1em 0; }

p.meta { text-align:right; color:gray; margin-right:10%; }

/* --- 修正追記 --- */
img.align-center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  float: none !important;
}

#footer {
  clear: both;
}

/* 画像の古いグローバル float を打ち消す（コンテンツ領域だけ） */
/* #content img { float: none !important; }  */

/* align-center ユーティリティ */
img.align-center {
  display: block;
  margin-left: auto;
  margin-right: auto;
}

/* フッターを確実に回り込ませる保険 */
.clearfix::after { content: ""; display: block; clear: both; }
#footer { clear: both !important; }

/* 本文コンテナを self-clear（BFC）させる */
#content,
.contentbody,
#wrapper {
  display: flow-root;      /* これが一番簡単で安全 */
}

/* 念のため：本文領域内の画像は float 無効化 */
/* #content img,
.contentbody img {
  float: none !important;
} */

/* align-center のタイポを修正（効いていないので） */
.contentbody .align-center {
  display: block;
  margin: .8em auto;
  font-size:2em;
}

/* フッターを最終防衛ラインで回り込ませる */
#footer { clear: both !important; display: block; }

/* --- サイドバーとの2カラム維持 --- */

/* wrapper が float を内包（BFC） */
#wrapper {
  display: flow-root; /* ←これを残す */
}

/* content は flow-root を外す（float解除しない） */
#content {
  display: block; /* ←明示的に戻す */
  margin-right: 230px;
  padding: 25px 0;
}
div.content { font-size:1.2em; line-height:170%; }
div.after-figure { font-size:1.2em; line-height:170%; }
/* サイドバーは右に浮かせたまま */
#sidebar {
  float: right;
  width: 229px;
  padding: 25px 0;
  text-align: left;
  border-left: 1px solid silver;
}

/* footer は floatを解除して下に回り込む */
#footer {
  clear: both;
  display: block;
  text-align: center;
  padding-top: 20px;
width:90%;
  margin-left: auto;
  margin-right: auto;
background-color:white;
}

/* サイドバー左罫線を全体の高さまで伸ばす */
#wrapper {
  position: relative;
  display: flow-root; /* floatの内包 */
}

/* サイドバー左境界線を wrapper 高さ分で描画 */
#wrapper::after {
  content: "";
  position: absolute;
  top: 0;
  bottom: 0;           /* ← wrapper 高さぶんで終わる */
  right: 229px;        /* ← sidebar の左端位置に合わせる */
  width: 1px;
  background: silver;  /* ← 元のサイドバー線と同じ色 */
  z-index: 0;
/*   pointer-events: none;  */
}

/* サイドバー自体の border-left は消して二重線防止 */
#sidebar {
  border-left: none;
}

/* 画像ラッパー（p/div.figure）で左右寄せする */
/* 新: figure */
figure.align-left   { float:left;  margin:.2em 1em .6em 0; }
figure.align-right  { float:right; margin:.2em .8em .6em 1em; }
figure.align-center { float:none; text-align:center; margin:1em auto; }
figure img{ display:inline-block; margin:0; max-width:100%; height:auto; }
figure figcaption{ font-size:.92em; line-height:1.5; color:#666; }


/* 既存ユーティリティ（img直付け）も残すなら */
img.align-left  { float:left;  margin:0 1em .5em 0;  display:inline; }
img.align-right { float:right; margin:0 0 .5em 1em; display:inline; }
img.align-center{ display:block; margin:0 auto; max-width:100%; float:none; }

/* ラッパーで左右・中央寄せ */
p.figure.align-left,
div.figure.align-left  { float:left;  margin:0 0 .6em 0; }

p.figure.align-right,
div.figure.align-right { float:right; margin:2em 1em .6em 1em !important; }

p.figure.align-center,
div.figure.align-center { float:none; text-align:center; margin:.6em auto; }

/* ラッパー内の画像は素直に表示 */
p.figure img,
div.figure img { display:inline-block; margin:0; max-width:100%; height:auto; }

/* クラス無し画像だけセンター（既存を置き換え or 追加） */
#content img:not(.align-left):not(.align-right):not(.align-center),
.contentbody img:not(.align-left):not(.align-right):not(.align-center) {
  display:block; margin-left:auto; margin-right:auto; float:none;
}

.sml { font-size:0.8em; }
figure figcaption { font-size: 0.7em; line-height: 1.5; color:#666666; }
figure figcaption.sml { font-size: 0.8em; opacity: 0.95; }
figure figcaption { font-size: 0.8em; line-height: 1.5; color:#666666; }
figure figcaption.sml { font-size: 0.75em; opacity: 0.95; } /* ←小さめ */

/* --- 強制適用：figcaption の既定サイズ --- */
figcaption{
  font-size:0.85em !important;
  line-height:1.5 !important;
  color:#666666 !important;
  margin-top:0.4em !important;
  text-align:left !important;
}

/* --- 「小さめ」：figcaption 自体に .sml が付く場合 --- */
figcaption.sml{
  font-size:0.76em !important;  /* ←お好みで .70em などに */
  opacity:0.95;
}

/* --- 「小さめ」：figcaption の中に <span class="sml"> が入っている場合 --- */
figcaption .sml{
  font-size:0.76em !important;
}


/* 小さめキャプションの場合（figcaption自体に.sml or 中にspan.sml） */
figure figcaption.sml,
figure figcaption .sml {
  font-size: 0.76em !important;
  opacity: 0.95;
}


/* A: デスクトップ幅をそのまま維持（モバイルは横スクロール） */
html, body { min-width: 980px; }          /* 既定幅：980px に合わせる */
.wrapper, #wrapper, .container { width: 1024px; margin: 0 auto; } /* 既存ラッパー名に合わせる */
body { -webkit-text-size-adjust: 100%; }  /* モバイルによるテキスト自動拡大を抑制（任意） */

/* overflow処理（全体） */
html { overflow-x: auto; }