/* ----------------------------------------
WPのスタイル利用時のテンプレート(クラス名wp-contentの中)
---------------------------------------- */

/* 見出し */
h1.wp-block-heading {
    font-size: var(--fontSize-xl);
    font-weight: var(--wght-bold);
    line-height: 1.5;
    margin: var(--space-3xl) 0 var(--space-lg);
}

h2.wp-block-heading {
    --font-min:20;
    --font-max:36;
    font-size: var(--font-size);
    line-height: 1.5;
    margin: 1em 0 0.5em;
}

h3.wp-block-heading {
    --font-min:20;
    --font-max:24;
    font-size: var(--font-size);
    line-height: 1.5;
    margin: 1em 0 0.5em;    
}

h4.wp-block-heading,
h5.wp-block-heading,
h6.wp-block-heading {
    --font-min:18;
    --font-max:20;
    font-size: var(--font-size);
    margin: 1em 0 0.5em;
}

/* リスト */
ol.wp-block-list,
ul.wp-block-list {
    padding-left: 2em;
    margin-bottom: var(--space-md);
    line-height: 1.5;
}

ol.wp-block-list li::marker {
    content: counter(list-item) ". ";  /* 括弧を削除: (1) → 1. */
}

ul.wp-block-list li::marker {
    content: "・ ";
    /* disc風の記号 */
}

/* 段落 */
.wp-content p {
    margin-bottom: 0.5em;
    line-height: 1.8;
}

/* リンク */
.wp-content a:not(.wp-element-button) {
    color: var(--color-main);
    text-decoration: underline;
    text-underline-offset: 5px;
    cursor: pointer;
}

@media (hover: hover) and (pointer: fine) {
    .wp-content p>a:hover {
        filter: brightness(1.5);
    }
}

/* 画像 */
.wp-block-image {
    margin-bottom: var(--space-md);
}

.wp-block-image img {
    max-width: 100%;
    height: auto;
}

/* 引用 */
.wp-block-quote {
    border-left: 2px solid var(--color-main);
    padding-left: 1em;
    margin: 1em 0 2em;
    font-style: italic;
    --font-min: 12;
    --font-max: 14;
    font-size: var(--font-size);
}

/* テーブル */
.wp-block-table {
    margin-bottom: var(--space-md);
    width: 100%;
    border-collapse: collapse;
}

.wp-block-table th,
.wp-block-table td {
    border: 1px solid #ddd;
    padding: var(--space-sm);
    text-align: left;
}

.wp-block-table th {
    background-color: var(--color-gray-light);
    font-weight: var(--wght-bold);
}