/* hitomi-free.jp 最小共通CSS（2026-08-21）
   旧SWELLテーマのCSSが失われたため、HTMLに残る意味構造だけを拾って
   「普通に読めるサイト」へ戻すための最小実装。デザイン再現は狙わない。 */

:root{
  --fg:#1f2328; --muted:#6b7280; --bg:#fff; --line:#e5e7eb;
  --accent:#c9366f; --accent-weak:#fdf2f6;
  --w:760px;
}
*{box-sizing:border-box}
html{-webkit-text-size-adjust:100%}
body{
  margin:0; background:var(--bg); color:var(--fg);
  font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Noto Sans JP",sans-serif;
  font-size:17px; line-height:1.9; letter-spacing:.02em;
}
/* 本文は中央の読みやすい幅に収める（旧テーマのラッパが無いのでbody直下を制御） */
body > *{max-width:var(--w); margin-left:auto; margin-right:auto; padding-left:20px; padding-right:20px}

h1{font-size:1.7em; line-height:1.45; margin:1.2em auto .8em; font-weight:700}
h2{font-size:1.32em; line-height:1.5; margin:2.4em auto .9em; padding:.5em .7em;
   background:var(--accent-weak); border-left:4px solid var(--accent); border-radius:4px; font-weight:700}
h3{font-size:1.13em; margin:2em auto .7em; padding-bottom:.3em; border-bottom:1px solid var(--line); font-weight:700}
h4,h5,h6{margin:1.6em auto .6em; font-weight:700}
p{margin:1.1em auto}
ul,ol{margin:1.2em auto; padding-left:1.6em}
li{margin:.45em 0}
a{color:var(--accent); text-decoration:underline; text-underline-offset:2px}
a:hover{opacity:.75}
strong{font-weight:700}
blockquote{margin:1.4em auto; padding:.9em 1.1em; background:#f8f9fa;
  border-left:3px solid var(--line); border-radius:4px; color:#374151}
hr{border:0; border-top:1px solid var(--line); margin:2.4em auto}

/* 画像：はみ出さない。壊れた画像は目立たせない */
img{max-width:100%; height:auto; border-radius:6px}
figure{margin:1.6em auto}
figcaption{font-size:.85em; color:var(--muted); text-align:center; margin-top:.5em}

/* テーブル：横スクロールで潰れないように */
table{width:100%; border-collapse:collapse; margin:1.6em auto; font-size:.94em}
th,td{border:1px solid var(--line); padding:.6em .7em; text-align:left}
th{background:#f8f9fa; font-weight:700}

/* WordPressブロックの配置クラス */
.has-text-align-center{text-align:center}
.has-text-align-right{text-align:right}
.has-text-align-left{text-align:left}
.wp-block-image{margin:1.6em auto}
.wp-block-list{margin:1.2em auto}

/* --- SWELL吹き出し：アイコン画像が消失しているのでカード型に読み替える --- */
.swell-block-balloon{margin:1.8em auto}
/* 壊れたアイコン画像は隠す（altの連番を見せない） */
.c-balloon__icon,.c-balloon__iconImg{display:none!important}
.c-balloon{display:block}
.c-balloon__body{
  position:relative; background:#f6f7f9; border:1px solid var(--line);
  border-radius:10px; padding:.9em 1.1em;
}
.c-balloon__body::before{
  content:""; position:absolute; left:22px; top:-9px;
  border-left:9px solid transparent; border-right:9px solid transparent;
  border-bottom:9px solid #f6f7f9;
}
.c-balloon.-bln-right .c-balloon__body::before{left:auto; right:22px}
.c-balloon__text{margin:0}
.c-balloon__text p{margin:.4em 0}
.c-balloon__shapes,.c-balloon__before,.c-balloon__after{display:none}

/* SWELLの文字サイズ指定 */
.u-fz-l{font-size:1.1em}
.u-fz-s{font-size:.9em}

/* リンクカード・広告まわりが横に溢れないように */
iframe,embed,object{max-width:100%}

@media (max-width:600px){
  body{font-size:16px; line-height:1.85}
  body > *{padding-left:16px; padding-right:16px}
  h2{font-size:1.22em}
}

/* --- 記事一覧（トップ・タグページ）のカード --- */
.p-postListWrap{max-width:none}
.p-postList{list-style:none; margin:1.6em auto; padding:0;
  display:grid; gap:22px; grid-template-columns:repeat(3,1fr)}
.p-postList__item{margin:0}
.p-postList__link{display:block; color:inherit; text-decoration:none;
  border:1px solid var(--line); border-radius:10px; overflow:hidden; height:100%;
  background:#fff; transition:box-shadow .15s}
.p-postList__link:hover{opacity:1; box-shadow:0 2px 12px rgba(0,0,0,.09)}
.p-postList__thumb{position:relative; margin:0; background:#f3f4f6; aspect-ratio:280/400; display:block}
.c-postThumb__figure{margin:0}
.c-postThumb__img{display:block; width:100%; aspect-ratio:280/400;
  object-fit:cover; border-radius:0}
.c-postThumb__cat{position:absolute; left:8px; bottom:8px; font-size:11px;
  background:rgba(0,0,0,.62); color:#fff; padding:2px 8px; border-radius:99px}
.p-postList__body{padding:12px 14px 14px}
.p-postList__title{font-size:14px; line-height:1.55; margin:0 0 8px; font-weight:700;
  background:none; border:0; padding:0; border-radius:0;
  display:-webkit-box; -webkit-line-clamp:3; -webkit-box-orient:vertical; overflow:hidden}
.p-postList__meta{font-size:11px; color:var(--muted)}
.p-postList__times time{color:var(--muted)}

/* --- タブ（JSが失われているのでCSSで最小限に見せる） --- */
.c-tabList{list-style:none; display:flex; flex-wrap:wrap; gap:8px; margin:1.6em auto .4em; padding:0}
.c-tabList__item{margin:0}
.c-tabList__button{border:1px solid var(--line); background:#fff; color:var(--fg);
  border-radius:99px; padding:6px 14px; font-size:13px; cursor:pointer}
.c-tabList__button[aria-selected="true"]{background:var(--accent); border-color:var(--accent); color:#fff}
.c-tabBody__item[aria-hidden="true"]{display:none}

@media (max-width:900px){ .p-postList{grid-template-columns:repeat(2,1fr)} }
@media (max-width:600px){
  .p-postList{grid-template-columns:repeat(2,1fr); gap:14px}
  .p-postList__title{font-size:13px}
}