/* ===== アメブロ風の2段組み＋ティファニーブルーの壁紙（2026-10-27） ===== */
body::before, body::after { display: none !important; }
body {
  background-color: #9ED9D3;
  background-image:
    repeating-linear-gradient(135deg, rgba(255,255,255,.22) 0 1px, transparent 1px 14px),
    linear-gradient(160deg, #B5E4DF 0%, #8FD1CA 55%, #7FC6BF 100%);
  background-attachment: fixed;
}
.wrap {
  max-width: 1020px;
  margin: 28px auto 40px;
  padding: 0 28px 40px;
  background: #FFFFFF;
  border-radius: 4px;
  border-top: 4px solid #0FA39B;
  box-shadow: 0 10px 40px rgba(20,90,85,.18);
}
.layout { display: grid; grid-template-columns: 260px minmax(0,1fr); gap: 30px; align-items: start; margin-top: 8px; }
.main { min-width: 0; }
.side { order: -1; display: flex; flex-direction: column; gap: 18px; padding-top: 34px; }

.box { background: #fff; border: 1px solid #D5ECEA; border-radius: 4px; padding: 14px 14px 12px; }
.box-h {
  margin: -14px -14px 12px; padding: 9px 14px; border-radius: 3px 3px 0 0;
  background: #0FA39B; color: #fff; text-align: center;
  font-family: "Hiragino Kaku Gothic ProN", "Hiragino Sans", sans-serif;
  font-size: 13px; font-weight: 600; letter-spacing: .2em; line-height: 1.6;
  border: 0;
}
.box-h::before, .box-h::after { display: none; }

.side-prof { text-align: center; }
.side-prof img { width: 88px; height: 88px; border-radius: 50%; object-fit: cover; border: 2px solid #CDEBE8; display: block; margin: 4px auto 6px; }
.side-prof .nm { font-weight: 600; font-size: 15px; margin: 0 0 6px; }
.side-prof .bio { font-size: 12.5px; line-height: 1.8; color: #6F686C; text-align: left; margin: 0 0 8px; }
.side-prof .more { font-size: 12.5px; font-weight: 600; color: #0B857E; text-decoration: none; }

.side-list { list-style: none; margin: 0; padding: 0; }
.side-list li { border-bottom: 1px dashed #E3E8E7; margin: 0; }
.side-list li:last-child { border-bottom: 0; }
.side-list a { display: block; padding: 7px 2px; font-size: 12.5px; line-height: 1.6; color: #443F42; text-decoration: none; }
.side-list a:hover { color: #0B857E; }
.side-list a.is-current { color: #0B857E; font-weight: 600; }
.side-list .d { display: block; font-size: 10.5px; color: #8A8387; letter-spacing: .05em; }

.side details { border-bottom: 1px solid #E3E8E7; }
.side details:last-child { border-bottom: 0; }
.side summary { cursor: pointer; padding: 8px 2px; font-size: 13px; font-weight: 600; color: #443F42; list-style: none; }
.side summary::-webkit-details-marker { display: none; }
.side summary::before { content: "▸ "; color: #0FA39B; }
.side details[open] summary::before { content: "▾ "; }
.side summary .n { font-weight: 400; color: #8A8387; font-size: 12px; }
.side details .side-list { padding: 0 0 6px 12px; }

.side-cats { display: flex; flex-wrap: wrap; gap: 7px; }
.side-cats a { font-size: 12px; font-weight: 600; text-decoration: none; border-radius: 999px; padding: 4px 12px; }
.side-cats .n { font-weight: 400; opacity: .75; margin-left: 4px; font-size: 11px; }
.side-cats .c-pink  { color: #A06A68; background: #F2E2E1; }
.side-cats .c-gold  { color: #96793C; background: #F1E7D3; }
.side-cats .c-blue  { color: #5F7793; background: #E1E8EF; }
.side-cats .c-sage  { color: #6E8059; background: #E5EBDF; }
.side-cats .c-mauve { color: #8A6E90; background: #EAE2EC; }
.side-cats .c-lavender { color: #7C72AC; background: #E7E4F3; }

/* スマホ・タブレット：一覧は記事の下へ */
@media (max-width: 820px) {
  .wrap { margin: 0; border-radius: 0; padding: 0 16px 40px; box-shadow: none; }
  .layout { grid-template-columns: 1fr; gap: 0; }
  .side { order: 0; padding-top: 34px; }
}
