/* 旧ブログ（AFFINGER5）の飾りのうち、残したページで使っているものだけを作り直す */
:root { --text:#222; --sub:#666; --line:#ddd; --bg:#fff; --soft:#f6f7f9; --accent:#1f6fb2; --red:#c62828; --marker:#fff59d; }
* { box-sizing: border-box; }
body { margin:0; background:var(--bg); color:var(--text); font-family:-apple-system,BlinkMacSystemFont,"Hiragino Sans","Hiragino Kaku Gothic ProN","Noto Sans JP",Meiryo,sans-serif; line-height:1.8; }
a { color:var(--accent); overflow-wrap:anywhere; }
.site-header { border-bottom:3px solid var(--accent); padding:12px 16px; font-weight:bold; }
.site-header a { color:var(--text); text-decoration:none; }
main { max-width:860px; margin:0 auto; padding:16px; }
h1 { font-size:1.5em; line-height:1.4; margin:.5em 0; }
.content h2 { font-size:1.3em; border-left:6px solid var(--accent); padding:.3em .6em; background:var(--soft); margin:2em 0 1em; }
.content h3 { font-size:1.15em; border-bottom:2px solid var(--line); padding-bottom:.2em; margin:1.8em 0 .8em; }
.date { color:var(--sub); font-size:.85em; }
img { max-width:100%; height:auto; }
.aligncenter { display:block; margin:1em auto; }
.center { text-align:center; }
.clearfix::after { content:""; display:table; clear:both; }
.hutoaka { font-weight:bold; color:var(--red); }
.huto { font-weight:bold; }
.st-mymarker-s { background:linear-gradient(transparent 60%, var(--marker) 60%); }
.code-wrap { position:relative; margin:1em 0; }
.code-wrap pre.code { margin:0; }
pre.code { background:var(--soft); border:1px solid var(--line); border-radius:6px; padding:2.2em 1em 1em; overflow-x:auto; font-size:.85em; line-height:1.6; white-space:pre; }
pre.code span { font-size:inherit !important; font-family:inherit !important; }
button.copy { position:absolute; top:.4em; right:.4em; font-size:.8em; padding:.2em .8em; border:1px solid var(--line); border-radius:4px; background:#fff; cursor:pointer; }
.graybox, .yellowbox, .st-mybox, .freebox, .st-memobox2, .st-cardbox { border:1px solid var(--line); border-radius:6px; padding:.8em 1em; margin:1.2em 0; }
.graybox { background:var(--soft); }
.yellowbox { background:#fffde7; border-color:#efe3a0; }
.st-mybox-title, .p-free, .st-memobox-title, .st-mcbox-title { font-weight:bold; margin:0 0 .4em; }
.st-kaiwa-box { display:flex; gap:.8em; align-items:flex-start; margin:1.5em 0; }
.st-kaiwa-area2 { flex:1; min-width:0; }
.st-kaiwa-hukidashi2 { background:#eef5fb; border-radius:10px; padding:.8em 1em; }
.st-kaiwa-face2 { flex:0 0 60px; text-align:center; font-size:.75em; color:var(--sub); }
.st-kaiwa-face2 img, .st-kaiwa-face img { border-radius:50%; }
.st-kaiwa-face { flex:0 0 60px; text-align:center; font-size:.75em; color:var(--sub); }
.st-kaiwa-area { flex:1; min-width:0; }
.st-kaiwa-hukidashi { background:#f3f3f3; border-radius:10px; padding:.8em 1em; }
.st-step { display:inline-block; background:var(--accent); color:#fff; border-radius:4px; padding:0 .5em; margin-right:.5em; font-size:.85em; }
.st-step-title { font-weight:bold; }
.st-cardbox dt.st-card-img { float:left; margin:0 1em .5em 0; max-width:120px; }
.st-cardbox dd { margin:0; }
.st-cardbox-t { margin:0 0 .3em; font-size:1em; }
.st-cardbox-site, .st-cardbox-host { color:var(--sub); font-size:.8em; }
.st-mybtn-mini a, a.button { display:inline-block; background:var(--accent); color:#fff; padding:.5em 1.4em; border-radius:6px; text-decoration:none; font-weight:bold; }
/* 旧テーマのボタンは、色が枠（p.st-mybtn の style）側に付いている */
p.st-mybtn { margin:1em auto; padding:.6em 1em; text-align:center; }
p.st-mybtn a { display:block; color:#fff; text-decoration:none; }
.table-wrap { overflow-x:auto; margin:1em 0; }
table { border-collapse:collapse; min-width:60%; }
th, td { border:1px solid var(--line); padding:.4em .6em; vertical-align:top; }
th { background:var(--soft); }
.video { position:relative; max-width:640px; aspect-ratio:16/9; margin:1em auto; }
.video iframe { position:absolute; inset:0; width:100%; height:100%; border:0; }
.download .file { color:var(--sub); font-size:.9em; margin-left:.5em; }
.notice { background:#fff4e5; border:1px solid #f3c98b; border-radius:6px; padding:.8em 1em; }
.book { color:var(--sub); font-size:.9em; }
.tag { display:inline-block; font-size:.75em; border:1px solid var(--accent); color:var(--accent); border-radius:3px; padding:0 .4em; margin-right:.3em; }
.login { max-width:420px; }
.login input[type=password] { width:100%; font-size:1.1em; padding:.5em; border:1px solid var(--line); border-radius:6px; }
.login button { margin-top:.8em; font-size:1em; padding:.5em 1.6em; border:0; border-radius:6px; background:var(--accent); color:#fff; font-weight:bold; cursor:pointer; }
.error { color:var(--red); font-weight:bold; }
.webparts { border:1px solid var(--line); border-left:6px solid #087f78; border-radius:6px; background:var(--soft); padding:.8em 1em; margin:1.2em 0; }
.webparts-title { font-weight:bold; margin:0 0 .4em; }
.webparts a.button { background:#087f78; }
.webparts p:last-child { margin-bottom:0; }
.site-footer { border-top:1px solid var(--line); margin-top:3em; padding:16px; color:var(--sub); font-size:.85em; text-align:center; }
.terms { border:1px solid var(--line); border-radius:6px; padding:.8em 1em; margin:1.2em 0; }
.terms-title { font-weight:bold; margin:0 0 .4em; }
.terms label { display:inline-block; margin-bottom:.6em; cursor:pointer; }
.terms:not(:has(.terms-check:checked)) .download { display:none; }