このページは kakuyasu テーマのブログ用 SCSS パーツが正しく表示されるかを確認するためのテストページです。テストテストテストテスト。
大見出し（h2）のサンプルテストテスト
テストテストテストテスト。h2 見出しはオレンジ左ボーダーで表示されます。テストテストテストテストテストテストテストテスト。
中見出し（h3）のサンプル
テストテストテストテスト。h3 見出しはネイビー下線で表示されます。テストテストテストテスト。
小見出し（h4）のサンプル
テストテストテストテスト。h4 見出しは左細線のみで表示されます。テストテストテストテスト。
文字装飾サンプル
通常テキストの中に蛍光マーカー強調テキストを入れるとこのように表示されます。 オレンジ太字テキスト（span.f）はアクセントカラーで強調します。 ネイビー太字テキスト（span.b）は重要な語句に使います。 テキストオレンジ（span.text-orange）も使用できます。
リストサンプル
チェックリスト（ul.check）
- テストテストテストテスト項目1
- テストテストテストテスト項目2
- テストテストテストテスト項目3
丸点リスト（ul.circle）
- テストテストテストテスト項目A
- テストテストテストテスト項目B
- テストテストテストテスト項目C
チェックリスト（ul.wp-check）
- wp-check 項目1：テストテストテスト
- wp-check 項目2：テストテストテスト
- wp-check 項目3：テストテストテスト
丸点リスト（ul.wp-bullet）
- wp-bullet 項目1：テストテストテスト
- wp-bullet 項目2：テストテストテスト
- wp-bullet 項目3：テストテストテスト
番号付きリスト（ol.wp-num）
- 手順1：テストテストテストテスト
- 手順2：テストテストテストテスト
- 手順3：テストテストテストテスト
ボックスパーツサンプル
wp-box（この記事でわかること）
- テストテスト：ポイント1
- テストテスト：ポイント2
- テストテスト：ポイント3
リード文（wp-lead）
テストテストテストテストテストテストテストテストテストテストテストテストテストテストテスト。
ポイントブロック（.point-block）
ポイント
テストテストテストテストテストテストテストテスト。重要な部分をマーカーで強調することもできます。
- テストテストポイント1
- テストテストポイント2
- テストテストポイント3
注意ボックス（.warn-block）
注意点
テストテストテストテスト。注意・警告事項を伝えるブロックです。テストテストテストテスト。
参考情報ボックス（.ref-block）
wp-point（重要ポイント）
- テストテスト：重要ポイント1
- テストテスト：重要ポイント2
- テストテスト：重要ポイント3
wp-warn（警告）
テストテスト。wp-warn は wp-* 系の警告パーツです。テストテストテストテスト。
引用サンプル
引用ボックス（blockquote.blog-quote）
テストテストテストテスト。blog-quote は外部の記事・書籍などからの引用に使います。テストテストテストテスト。
出典：テストテスト出典名
wp-quote（引用）
テストテストテストテスト。wp-quote は wp-* 系の引用パーツです。テストテストテストテスト。
出典：テストテスト出典名
ラベルサンプル（.label-*）
NEWテストテスト：label-new（オレンジ）
重要テストテスト：label-important（レッド）
おすすめテストテスト：label-recommend（グリーン）
POINTテストテスト：label-point（ブルー）
吹き出しサンプル（.speech-block）
テストテストテストテスト。左側にアバター、右側に吹き出しが表示されます。テストテストテストテスト。
テストテストテストテスト。speech-block--right で右側にアバターが表示される反転パターンです。テストテストテストテスト。
ステップボックス（.stepBox）
テストテストテストテスト。STEP 1 の説明文です。テストテストテストテストテストテストテストテスト。
テストテストテストテスト。STEP 2 の説明文です。テストテストテストテストテストテストテストテスト。
テストテストテストテスト。STEP 3 の説明文です。テストテストテストテストテストテストテストテスト。
ナンバー見出し（.pointBox）
1テストテストナンバー見出し1
テストテストテストテスト。pointBox の1つ目の項目です。テストテストテストテストテストテストテストテスト。
2テストテストナンバー見出し2
テストテストテストテスト。pointBox の2つ目の項目です。テストテストテストテストテストテストテストテスト。
3テストテストナンバー見出し3
テストテストテストテスト。pointBox の3つ目の項目です。テストテストテストテストテストテストテストテスト。
wp-step（ステップ）
テストテストステップ1タイトル
テストテストテストテスト。wp-step の1つ目の手順です。テストテストテストテスト。
テストテストステップ2タイトル
テストテストテストテスト。wp-step の2つ目の手順です。テストテストテストテスト。
テーブルサンプル
blog-table
| 項目 | 内容 | 備考 |
|---|---|---|
| テスト項目A | テストテストテスト | テスト |
| テスト項目B | テストテストテスト | テスト |
| テスト項目C | テストテストテスト | テスト |
wp-table
| 項目 | 内容 |
|---|---|
| テスト項目1 | テストテストテスト |
| テスト項目2 | テストテストテスト |
リンクサンプル
内部リンク（a.inner-link）のサンプルはこのように表示されます。
外部リンク（a.outer-link）のサンプルにはアイコンが付与されます。
メリット・デメリット（.pros-cons）
メリット（pros）
- テストテストメリット1
- テストテストメリット2
- テストテストメリット3
デメリット（cons）
- テストテストデメリット1
- テストテストデメリット2
- テストテストデメリット3
よくある質問（.faq-block）
Qテストテスト：質問1のサンプルテキストです。テストテストテストテスト？
テストテストテストテスト。質問1への回答サンプルです。テストテストテストテストテストテストテストテスト。
Qテストテスト：質問2のサンプルテキストです。テストテストテストテスト？
テストテストテストテスト。質問2への回答サンプルです。テストテストテストテストテストテストテストテスト。
まとめ（.matome-block）
テストテストテストテスト。matome-block はまとめエリアのパーツです。テストテストテストテスト。
- テストテスト：まとめポイント1
- テストテスト：まとめポイント2
- テストテスト：まとめポイント3
補助金CTAボックス（.subsidyCtaBox）
テストテスト：補助金・助成金でホームページが実質0円になる場合があります
テストテストテストテスト。subsidyCtaBox は補助金関連記事で使用するCTAボックスです。テストテストテストテストテストテスト。
まずは無料でご相談ください
ブログCTAバナー（.blogCta）