固定ページサンプル

▼画像のmax-width1200px, center配置/SPは100%表示かつ左右2remの余白設定▼

▼画像のmax-width800px, center配置/SPは100%表示かつ左右4remの余白設定▼

▼画像のmax-width500px, center配置/SPは100%表示かつ左右8remの余白設定▼

見出しテキスト見出しテキスト

見出しテキスト見出しテキスト見出しテキスト

見出しテキスト見出しテキスト

テキストテキスト

▼20230529追加　本文テキスト中サイズ（2rem/見出しh4サイズ相当）

本文テキストMサイズ本文テキストMサイズ本文テキストMサイズ本文テキストMサイズ本文テキストMサイズ本文テキストMサイズ本文テキストMサイズ本文テキストMサイズ本文テキストMサイズ本文テキストMサイズ本文テキストMサイズ本文テキストMサイズ本文テキストMサイズ本文テキストMサイズ本文テキストMサイズ本文テキストMサイズ本文テキストMサイズ本文テキストMサイズ本文テキストMサイズ本文テキストMサイズ

▼20230529追加　本文テキスト大サイズ（2.4rem/見出しh2サイズ相当）

本文テキストLサイズ本文テキストLサイズ本文テキストLサイズ本文テキストLサイズ本文テキストLサイズ本文テキストLサイズ本文テキストLサイズ本文テキストLサイズ本文テキストLサイズ本文テキストLサイズ本文テキストLサイズ本文テキストLサイズ本文テキストLサイズ本文テキストLサイズ本文テキストLサイズ本文テキストLサイズ本文テキストLサイズ本文テキストLサイズ本文テキストLサイズ本文テキストLサイズ

▼202300906追加　本文テキスト行間広め（line-height:2.5）

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト
本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト
本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

▼202300906追加　本文テキスト行間広めM（line-height:2.5）

▼202300906追加　本文テキスト行間広めL（line-height:2.5）

ページタイトルh1

見出しテキスト大h2

見出しテキスト中h3

見出しテキスト小h4

見出しテキストh5

見出しテキストh6

ページタイトルh1

見出しテキスト大h2

見出しテキスト中h3

見出しテキスト小h4

見出しテキストh5

見出しテキストh6

▼20230906追加　游明朝見出し

ページタイトルh1

見出しテキスト大h2

見出しテキスト中h3

見出しテキスト小h4

見出しテキストh5

見出しテキストh6

ページタイトルh1

見出しテキスト大h2

見出しテキスト中h3

見出しテキスト小h4

見出しテキストh5

見出しテキストh6

▼リンク画像にマウスを載せた時に拡大するエフェクトを付ける▼
下記以外のイメージ・テキストパーツでも、aタグ内に class=”enlargeImg”の記述を追加すると適用できます。

リンク画像拡大サンプル

▼本文テキストの量が違っても次の行の開始位置を揃える仕様　2個並び▼

見出しテキスト小 h4 見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小 h4 見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小 h4 見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小 h4 見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小 h4 見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小 h4 見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小 h4 見出しテキスト小

▼本文テキストの量が違っても次の行の開始位置を揃える仕様　3個並び▼
M2　スマホ版は画像左で右にテキスト

見出しテキスト小 h4 (全角13文字以内推奨)

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小 h4 (全角13文字以内推奨)

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

▼本文テキストの量が違っても次の行の開始位置を揃える仕様　3個並び▼
M2-2　スマホ版で縦1列並びで文字も画像の下

見出しテキスト小 h4 (全角13文字以内推奨)

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小 h4 (全角13文字以内推奨)

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

▼本文テキストの量が違っても次の行の開始位置を揃える仕様　3個並び▼
imgTextGroupM3 スマホ版でも3つ横並び

見出しテキスト小 h4 (全角13文字以内推奨)

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小 h4 (全角13文字以内推奨)

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

▼本文テキストの量が違っても次の行の開始位置を揃える仕様　4個並び▼

長い見出しは改行されます。 h4 スマホでの文字数表示など確認してください

見出しテキスト小 h4 見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小 h4

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小 h4 見出しテキスト小

見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小 h4 見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小 h4 見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小 h4

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小 h4

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小 h4 見出しテキスト小

▼本文テキストの量が違っても次の行の開始位置を揃える仕様　4個並び左右余白▼

見出しテキスト小 h4

見出しテキスト小 h4 見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小 h4

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小 h4

見出しテキスト小 h4 見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小 h4

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

▼PC2列 SP1列　[画像][テキスト] 横並び▼

見出しテキスト小 h4

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小 h4

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小 h4 見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小 h4 見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

▼max-width:1200pxの2個横並び(画像・見出し・本文は縦並び)レイアウト▼

見出しテキスト中　h3

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト中　h3

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト中　h3

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト中　h3

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

▼▼ここから既存のimgTextGroupイメージ▼▼

見出しテキスト見出しテキスト

見出しテキスト小見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小見出しテキスト小

見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト小

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

imgTextGroupM5 2023/6/16 assiette追加

横浜本店のご案内

画像のリンクにホバーで拡大を入れたい場合

会員登録のご案内

通常のリンク

年間営業日カレンダー

リンク無しの場合

h5だけでもOKです。

pだけでもOKです。

見出しテキスト小
本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト
見出しテキスト小
本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト
見出しテキスト小
本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト
見出しテキスト小
本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト
見出しテキスト小
本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト
見出しテキスト小
本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

テキストテキスト

テキストテキストテキスト

テキストテキストテキストテキスト

テキストテキストテキストテキストテキストテキストテキストテキストテキストテキスト

▼20230823追加　ピンクボタン

テキストテキストテキストテキストテキスト

テキストテキスト
テキストテキスト
テキストテキスト
テキストテキスト

見出しテキスト見出しテキストtab01

見出しテキスト見出しテキストtab02

見出しテキスト見出しテキストtab03

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

見出しテキスト見出しテキストtab04

テキスト

リンクなし
テキスト
テキストテキストテキストテキストテキスト
テキストテキスト

テキスト

リンクあり
テキストテキスト
テキストテキスト
テキストテキスト

テキスト

テキスト
テキストテキストテキストテキストテキスト
テキストテキスト
テキストテキスト
テキストテキスト
テキストテキスト

テキスト

テキストテキスト
テキスト
テキストテキスト
テキストテキスト
テキストテキスト
テキスト
テキストテキスト
テキストテキスト

テキスト

テキストテキスト
テキスト
テキストテキスト
テキストテキスト
テキストテキスト
テキスト
テキストテキスト
テキストテキスト
テキストテキスト
テキスト

テキスト

テキストテキストテキストテキストテキスト
テキストテキストテキストテキストテキスト
テキストテキストテキストテキストテキスト

テキスト

テキストテキストテキストテキストテキスト
テキストテキストテキストテキストテキスト
テキストテキストテキストテキストテキスト

テキスト

テキストテキスト
テキストテキスト
テキストテキスト
テキストテキスト
テキストテキスト
テキストテキスト

テキスト

テキストテキスト
テキストテキスト
テキストテキスト
テキストテキスト
テキストテキスト
テキストテキスト

テキスト

テキスト
テキストテキスト
テキストテキスト

テキスト

テキストテキスト
テキスト
テキストテキスト

テキスト

テキストテキスト
テキストテキスト
テキスト

テキスト

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト
本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト
本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

テキスト

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト
本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト
本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

テキスト

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト
本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト
本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

テキスト

本文テキスト本文テキスト本文テキスト
本文テキスト本文テキスト本文テキスト
本文テキスト本文テキスト本文テキスト

テキスト

本文テキスト本文テキスト本文テキスト
本文テキスト本文テキスト本文テキスト
本文テキスト本文テキスト本文テキスト

テキスト

本文テキスト本文テキスト本文テキスト
本文テキスト本文テキスト本文テキスト
本文テキスト本文テキスト本文テキスト

▼20230620追加　小画像＋テキストレイアウト（画像サイズ50～100px推奨）

本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト本文テキスト

固定ページサンプル

▼画像のmax-width1200px, center配置/SPは100%表示かつ左右2remの余白設定▼

▼画像のmax-width800px, center配置/SPは100%表示かつ左右4remの余白設定▼

▼画像のmax-width500px, center配置/SPは100%表示かつ左右8remの余白設定▼

見出しテキスト見出しテキスト

見出しテキスト見出しテキスト見出しテキスト

見出しテキスト見出しテキスト

テキストテキスト

テキストテキスト

▼20230529追加 本文テキスト中サイズ（2rem/見出しh4サイズ相当）

▼20230529追加 本文テキスト大サイズ（2.4rem/見出しh2サイズ相当）

▼202300906追加 本文テキスト行間広め（line-height:2.5）

▼202300906追加 本文テキスト行間広めM（line-height:2.5）

▼202300906追加 本文テキスト行間広めL（line-height:2.5）

ページタイトルh1

見出しテキスト大h2

見出しテキスト中h3

見出しテキスト小h4

見出しテキストh5

見出しテキストh6

ページタイトルh1

見出しテキスト大h2

見出しテキスト中h3

見出しテキスト小h4

見出しテキストh5

見出しテキストh6

▼20230906追加 游明朝見出し

ページタイトルh1

見出しテキスト大h2

見出しテキスト中h3

見出しテキスト小h4

見出しテキストh5

見出しテキストh6

ページタイトルh1

見出しテキスト大h2

見出しテキスト中h3

見出しテキスト小h4

見出しテキストh5

見出しテキストh6

▼リンク画像にマウスを載せた時に拡大するエフェクトを付ける▼下記以外のイメージ・テキストパーツでも、aタグ内に class=”enlargeImg”の記述を追加すると適用できます。

リンク画像拡大サンプル

▼本文テキストの量が違っても次の行の開始位置を揃える仕様 2個並び▼

見出しテキスト小 h4 見出しテキスト小

見出しテキスト小 h4 見出しテキスト小

見出しテキスト小 h4 見出しテキスト小

見出しテキスト小 h4 見出しテキスト小

見出しテキスト小 h4 見出しテキスト小

見出しテキスト小 h4 見出しテキスト小

見出しテキスト小 h4 見出しテキスト小

見出しテキスト小 h4 見出しテキスト小

▼本文テキストの量が違っても次の行の開始位置を揃える仕様 3個並び▼M2 スマホ版は画像左で右にテキスト

見出しテキスト小 h4 (全角13文字以内推奨)

見出しテキスト小 h4 (全角13文字以内推奨)

見出しテキスト小 h4 (全角13文字以内推奨)

見出しテキスト小 h4 (全角13文字以内推奨)

見出しテキスト小 h4 (全角13文字以内推奨)

▼本文テキストの量が違っても次の行の開始位置を揃える仕様 3個並び▼M2-2 スマホ版で縦1列並びで文字も画像の下

見出しテキスト小 h4 (全角13文字以内推奨)

見出しテキスト小 h4 (全角13文字以内推奨)

見出しテキスト小 h4 (全角13文字以内推奨)

見出しテキスト小 h4 (全角13文字以内推奨)

見出しテキスト小 h4 (全角13文字以内推奨)

▼本文テキストの量が違っても次の行の開始位置を揃える仕様 3個並び▼imgTextGroupM3 スマホ版でも3つ横並び

見出しテキスト小 h4 (全角13文字以内推奨)

見出しテキスト小 h4 (全角13文字以内推奨)

見出しテキスト小 h4 (全角13文字以内推奨)

見出しテキスト小 h4 (全角13文字以内推奨)

見出しテキスト小 h4 (全角13文字以内推奨)

▼本文テキストの量が違っても次の行の開始位置を揃える仕様 4個並び▼

長い見出しは改行されます。 h4 スマホでの文字数表示など確認してください

見出しテキスト小 h4 見出しテキスト小

見出しテキスト小 h4

見出しテキスト小 h4 見出しテキスト小

見出しテキスト小

見出しテキスト小 h4 見出しテキスト小

見出しテキスト小 h4 見出しテキスト小

見出しテキスト小 h4 見出しテキスト小

見出しテキスト小 h4

見出しテキスト小 h4

見出しテキスト小 h4

▼20230529追加　本文テキスト中サイズ（2rem/見出しh4サイズ相当）

▼20230529追加　本文テキスト大サイズ（2.4rem/見出しh2サイズ相当）

▼202300906追加　本文テキスト行間広め（line-height:2.5）

▼202300906追加　本文テキスト行間広めM（line-height:2.5）

▼202300906追加　本文テキスト行間広めL（line-height:2.5）

▼20230906追加　游明朝見出し

▼リンク画像にマウスを載せた時に拡大するエフェクトを付ける▼
下記以外のイメージ・テキストパーツでも、aタグ内に class=”enlargeImg”の記述を追加すると適用できます。

▼本文テキストの量が違っても次の行の開始位置を揃える仕様　2個並び▼

▼本文テキストの量が違っても次の行の開始位置を揃える仕様　3個並び▼
M2　スマホ版は画像左で右にテキスト

▼本文テキストの量が違っても次の行の開始位置を揃える仕様　3個並び▼
M2-2　スマホ版で縦1列並びで文字も画像の下

▼本文テキストの量が違っても次の行の開始位置を揃える仕様　3個並び▼
imgTextGroupM3 スマホ版でも3つ横並び

▼本文テキストの量が違っても次の行の開始位置を揃える仕様　4個並び▼

▼本文テキストの量が違っても次の行の開始位置を揃える仕様　4個並び左右余白▼

▼PC2列 SP1列　[画像][テキスト] 横並び▼

見出しテキスト中　h3

見出しテキスト中　h3

見出しテキスト中　h3

見出しテキスト中　h3

▼20230823追加　ピンクボタン