クラスbox-ivoryは、背景に色面を敷きます。さらにp-deepを指定すると、PCとスマホで余白を変えることができます。
PC ⇒ 2em。スマホ ⇒ 2em 1em。
  • ノーマルの黒丸リストです。ulタグにクラスtype-discを当てます
  • このサンプルではulタグの親要素にdivタグ（クラスbox-ibory）を当てています
  • リストテスト
  • アイコン付きのリストです。アイコンリストはulタグにクラスtype-iconsを当てます
  • ulタグのクラス名（icon__○○）変更でアイコンを変えられます
  • チェックボックス（icon__checkbox）／マル（icon__circle）／×（icon__cross）
  • このサンプルではulタグの親要素にdivタグ（クラスbox-ibory）を当てています
  • アイコン付きのリストです。アイコンリストはulタグにクラスtype-iconsを当てます
  • ulタグのクラス名（icon__○○）変更でアイコンを変えられます
  • チェックボックス（icon__checkbox）／マル（icon__circle）／×（icon__cross）
  • このサンプルではulタグの親要素にdivタグ（クラスbox-ibory）を当てています
  • アイコン付きのリストです。アイコンリストはulタグにクラスtype-iconsを当てます
  • ulタグのクラス名（icon__○○）変更でアイコンを変えられます
  • チェックボックス（icon__checkbox）／マル（icon__circle）／×（icon__cross）
  • このサンプルではulタグの親要素にdivタグ（クラスbox-ibory）を当てています

11つ目タイトル

内容がここに入ります。タイトルはh3になっています。

22つ目タイトル

内容がここに入ります。タイトルはh3になっています。

33つ目タイトル

内容がここに入ります。タイトルはh3になっています。

44つ目タイトル

内容がここに入ります。タイトルはh3になっています。

STEP
タイトル
  • ここにステップの内容を記載します。本サンプルではリストを採用しています。
  • ステップは追加できます。番号は自動的に振られます
STEP
タイトル
  • ここにステップの内容を記載します。本サンプルではリストを採用しています。
  • ステップは追加できます。番号は自動的に振られます
キャプションタイトル

ここにキャプションコンテンツの内容が入ります。デフォルトでは余白ナシのpタグです

キャプションタイトル

ここにキャプションコンテンツの内容が入ります。クラスcap_redを取るとグレーになります