/* 間取りの記事への、AI間取り診断の案内枠。診断ページの枠（紺の見出し帯・方眼・赤いボタン）と同じ見た目にする。
   SWELLの本文スタイルに負けないよう、.post_content から指定する */
.post_content .bhm-banner{margin:2.2em 0;border:3px solid #1B2A4A;border-radius:14px;overflow:hidden;background-color:#F4F7FA;background-image:linear-gradient(rgba(27,42,74,.06) 1px,transparent 1px),linear-gradient(90deg,rgba(27,42,74,.06) 1px,transparent 1px);background-size:24px 24px;box-shadow:0 10px 28px rgba(27,42,74,.18);color:#1B2A4A}
.post_content .bhm-banner p{margin:0;line-height:1.65}
.post_content .bhm-banner__head{display:flex;align-items:center;gap:10px;background:#1B2A4A;color:#fff;padding:10px 20px}
.post_content .bhm-banner__name{font-size:18px;font-weight:900;letter-spacing:.06em}
.post_content .bhm-banner__badge{margin-left:auto;background:#D2372C;color:#fff;font-size:12px;font-weight:700;border-radius:999px;padding:3px 12px;white-space:nowrap}
.post_content .bhm-banner__main{display:flex;gap:20px;align-items:center;padding:22px 22px 8px}
.post_content .bhm-banner__icon{flex:none;width:96px;height:96px;border-radius:50%;background:#fff;border:2px solid #D6DDE7;display:flex;align-items:center;justify-content:center}
.post_content .bhm-banner__icon svg{width:64px;height:64px}
.post_content .bhm-banner__body{display:flex;flex-direction:column;gap:8px;min-width:0}
.post_content .bhm-banner__title{font-size:24px;font-weight:900;line-height:1.4;letter-spacing:.02em}
.post_content .bhm-banner__hl{color:#D2372C;background:linear-gradient(transparent 62%,rgba(210,55,44,.18) 62%)}
.post_content .bhm-banner__text{font-size:15px;color:#1B2A4A}
.post_content .bhm-banner__who{display:flex;align-items:center;gap:8px;font-size:12px;font-weight:700;color:#56637A}
.post_content .bhm-banner__who img{width:32px;height:32px;border-radius:50%;object-fit:cover;flex:none;margin:0}
.post_content .bhm-banner__btn{display:block;margin:14px 22px 22px;background:#D2372C;color:#fff !important;text-decoration:none !important;text-align:center;font-weight:900;font-size:18px;border-radius:999px;padding:15px 20px;box-shadow:0 4px 0 #9E2219}
.post_content .bhm-banner__btn span{margin-left:8px}
.post_content .bhm-banner__btn:hover{filter:brightness(1.07);transform:translateY(1px);box-shadow:0 3px 0 #9E2219}
@media (max-width:600px){
  .post_content .bhm-banner__head{padding:9px 14px}
  .post_content .bhm-banner__name{font-size:16px}
  .post_content .bhm-banner__main{flex-direction:column;align-items:flex-start;gap:12px;padding:16px 16px 4px}
  .post_content .bhm-banner__icon{width:64px;height:64px}
  .post_content .bhm-banner__icon svg{width:44px;height:44px}
  .post_content .bhm-banner__title{font-size:21px}
  .post_content .bhm-banner__l1{display:block}
  .post_content .bhm-banner__text{font-size:14px}
  .post_content .bhm-banner__btn{margin:12px 16px 16px;font-size:16px}
}
@media (prefers-reduced-motion:reduce){.post_content .bhm-banner__btn:hover{transform:none}}

/* 間取り3Dの小さな案内カード（2026-10-30）。記事の「まとめ」などの見出しの直前に出る */
.post_content .bhm-m3d{margin:2em 0;padding:16px 18px;border:2px solid #1B2A4A;border-left-width:8px;border-radius:12px;background:#F4F7FA;color:#1B2A4A}
.post_content .bhm-m3d p{margin:0 0 8px;line-height:1.65}
.post_content .bhm-m3d__lab{display:inline-block;font-size:11px;font-weight:700;color:#fff;background:#1B2A4A;border-radius:999px;padding:1px 10px}
.post_content .bhm-m3d__title{font-size:17px;font-weight:900}
.post_content .bhm-m3d__title b{color:#D2372C}
.post_content .bhm-m3d__text{font-size:14px}
.post_content .bhm-m3d__btn{display:block;text-align:center;background:#D2372C;color:#fff !important;text-decoration:none !important;font-weight:900;font-size:15px;border-radius:999px;padding:11px 16px;box-shadow:0 3px 0 #9E2219;margin-top:4px}
.post_content .bhm-m3d__btn span{margin-left:6px}
.post_content .bhm-m3d__btn:hover{filter:brightness(1.07)}