@charset "utf-8";

/* ------------------------------------------------------------------------------------------ */
/* 投稿ページ（single）（ブログ記事ページ） */

/* h1 */
.h1_single { margin-bottom: 1.2em; text-align: center; font-family: var(--font_serif); font-size: 2.6rem; font-weight: 700; line-height: 1.2em; letter-spacing: 0.1em; color: var(--c-sub); }
@media only screen and (max-width: 750px) { .h1_single { font-size: 4.2vw; } }

/* h2 */
.single-post section h2 { background-color: var(--c-main); margin-bottom: 0.5em; padding-inline: 0.35em; padding-block: 0 0.1em; color: white; transform: skewX(-15deg); font-family: var(--font_serif); font-weight: 500; font-size: 2rem; }
@media only screen and (max-width: 750px) { .single-post section h2 { font-size: 3.8vw; } } /* SP */

/* h3 */
.single-post section h3 { margin-bottom: 0.2em; font-family: var(--font_serif); font-size: var(--fs_m); font-weight: 700; color: var(--c-sub); letter-spacing: 0.1em; line-height: 1.5em; }
.single-post section h3::before { content: "⚫︎"; }

/* 本文・リンク・キャプション・引用 */
.single-post section.box_01 p { line-height: 1.75em; }
.single-post p > a { color: var(--c-sub); }
.single-post p > a:hover { color: var(--color2); }
.single-post :is(.wp-element-caption, .wp-block-image figcaption, figure figcaption) { font-size: var(--fs_xs); font-style: italic; } /* キャプション */
.single-post blockquote { padding: 15px; background-color: var(--color3); } /* 引用 */

/* 日付 */
.single-post .blog_box div { position: relative; }
.single-post .blog_date { position: absolute; writing-mode: vertical-rl; text-orientation: upright; left: -24px; top: 0px; font-size: 1.2rem; }

/* 区切り線 */
.single-post .wp-block-separator.has-alpha-channel-opacity { opacity: 1; border-top: 1px solid rgba(0, 0, 0, 1); font-size: var(--fs_s); /* <- margin em用 */ margin-block: 1.5em; }

/* コード */
.wp-block-code { background-color: var(--color3); border: 1px solid #000; padding: 1em; margin-block: 1em; font-family: Consolas, Monaco, monospace; font-size: var(--fs_xs); }
.wp-block-code code { color: #333; }

/* SP */
@media only screen and (max-width: 750px) {
.single-post blockquote { padding: 2vw; }
.single-post .blog_date { left: -3.45vw; font-size: 1.6vw; }
}