/**
 * news-content.css
 *
 * ニュース本文（TinyMCEで作成されたリッチテキスト）専用スタイル
 *
 * ■ 背景
 * 管理画面では TinyMCE を使用してニュース本文を作成しているが、
 * フロント画面では Content-Security-Policy（CSP）により
 * style 属性が無効化されている。
 *
 * そのため、TinyMCE が生成する data-mce-style の内容をもとに
 * 独自ルールで class 名へ変換し、CSS でスタイルを適用している。
 *
 * ■ クラス命名ルール
 * - data-mce-style の値を加工して class 名を生成
 * - 「: 」→「--」
 * - 「;」削除
 * - 「px」「#」削除
 *
 * 例）
 *   data-mce-style="font-size: 18px;"
 *   → class="font-size--18"
 *
 * ■ 対応スタイル
 * - フォントサイズ（12 / 14 / 16 / 18 / 20 / 24 / 28px）
 * - 太字、下線
 * - 文字色（指定カラーパレットのみ）
 * - テキスト揃え（左 / 中央 / 右）
 * - リンク
 */


/* フォントサイズ */
.news-content .font-size--12 { font-size: 12px; }
.news-content .font-size--14 { font-size: 14px; }
.news-content .font-size--16 { font-size: 16px; }
.news-content .font-size--18 { font-size: 18px; }
.news-content .font-size--20 { font-size: 20px; }
.news-content .font-size--24 { font-size: 24px; }
.news-content .font-size--28 { font-size: 28px; }

/* 太字、下線 */
.news-content .font-weight--bold {
    font-weight: bold;
}
.news-content .text-decoration--underline {
    text-decoration: underline;
}

/* 文字色 */
.news-content .color--026934 { color: #026934; } /* 基本色 */
.news-content .color--e75611 { color: #e75611; } /* 補色 */
.news-content .color--f90000 { color: #f90000; } /* 赤 */
.news-content .color--0057b7 { color: #0057b7; } /* 青 */
.news-content .color--ffc300 { color: #ffc300; } /* 黄色 */
.news-content .color--ff5fa2 { color: #ff5fa2; } /* ピンク */
.news-content .color--7a3e9d { color: #7a3e9d; } /* 紫 */
.news-content .color--60432a { color: #60432a; } /* 茶 */
.news-content .color--9e9e9e { color: #9e9e9e; } /* グレー */
.news-content .color--000000 { color: #000000; } /* 黒 */

/* テキスト揃え */
.news-content .text-align--left {
    text-align: left;
}
.news-content .text-align--center {
    text-align: center;
}
.news-content .text-align--right {
    text-align: right;
}

/* リンク */
.news-content a {
    color: #0057B7;
    text-decoration: underline;
}
.news-content a:hover {
    opacity: 0.8;
}