Myコミュファ
Webメール
よくあるご質問
飾り見出し
備考無し
STEP1
備考無し
Point.1
備考無し
h2見出しサブテキスト
h2見出しテキスト
備考無し
h2見出しテキスト
備考無し
段落 (左揃え)になるテキストです。段落 (左揃え)になるテキストです。
段落 (左揃え)になるテキストです。
備考無し
段落 (中央揃え)になるテキストです。段落 (中央揃え)になるテキストです。
段落 (中央揃え)になるテキストです。
備考無し
段落 (右揃え)になるテキストです。段落 (右揃え)になるテキストです。
段落 (右揃え)になるテキストです。
備考無し
備考無し
テキスト
備考無し
テキスト
備考無し
テキスト
備考無し
テキスト
備考無し
テキスト
備考無し
テキスト
備考無し
フォントサイズは26pxです。
備考無し
フォントサイズは24pxです。
備考無し
フォントサイズは20pxです。
備考無し
フォントサイズは18pxです。
備考無し
フォントサイズは16pxです。
備考無し
フォントサイズは14pxです。
備考無し
フォントサイズは12pxです。
備考無し
PCは50px、SPは26px。
備考無し
PCは45px、SPは24px。
備考無し
PCは40px、SPは20px。
備考無し
PCは30px、SPは18px。
備考無し
PCは28px、SPは18px。
備考無し
PCは22px、SPは16px。
備考無し
PCは16px、SPは13px。
備考無し
PCは16px、SPは14px。
備考無し
Tel.0120-218-919
備考：
「no_link」が付くと電話が無効になる。safariで電話番号が自動でリンクになる仕様を防ぐクラス。
備考無し
備考無し
マーカー付きテキスト
備考無し
h4と同じフォントサイズの
装飾付きテキストです
備考無し
タイトルテキスト
- ダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキスト
- ダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキストダミーテキスト
備考：
pc：高さ250pxで表示されます。
備考：
縦に長い画像を入れ込むときに使用します。pc：横幅350pxで表示されます。
imageクラスが付いているdivタグに「w350」を指定します。
備考：
横に長い画像を入れ込むときに使用します。pc：横幅700pxで表示されます。
imageクラスが付いているdivタグに「w700」を指定します。
-
ダミーテキスト
-
ダミーテキスト
備考：
①画像のhover指定
親に「bnr_imgae」クラスがあるのと、imgをaタグで囲むことで、hoverアニメーションがつきます。
②角丸指定
imageクラスが付いているdivタグに「round_10」を指定します。
③カラム設定
pc：標準では高さ250pxを基準に横並びになり、幅が狭くなるとカラム落ちします。
sp：標準では1カラムで表示されます。ulタグに「sp2column」をつけることで2カラム表示になります。
備考
下層用コンテナー（ctc_bottom_page_container・container.ctc_side_container）の中にあるテキストは、下線ありの青い文字で表示されます。
備考
どのページでもaタグにクラスを付ければ、オレンジの矢印アイコンがつきます。
注意：文字サイズを変更してもアイコンのサイズは変わりません。
備考
どのページでもaタグにクラスを付ければ、オレンジのウインドウアイコンがつきます。
注意：文字サイズを変更してもアイコンのサイズは変わりません
備考
Plain HTMLを使用する。
aタグのURLが一致した場合クラス「active」がaタグの一つ上の階層に自動付与されるように、common.js内に記述しています。
備考
Plain HTMLを使用する。
aタグのURLが一致した場合クラス「active」がaタグの一つ上の階層に自動付与されるように、common.js内に記述しています。
備考
Plain HTMLを使用する。
aタグのURLが一致した場合クラス「active」がaタグの一つ上の階層に自動付与されるように、common.js内に記述しています。
備考
Plain HTMLを使用する。
aタグのURLが一致した場合クラス「active」がaタグの一つ上の階層に自動付与されるように、common.js内に記述しています。
備考
Plain HTMLを使用する。
aタグのURLが一致した場合クラス「active」がaタグの一つ上の階層に自動付与されるように、common.js内に記述しています。
備考
Plain HTMLを使用する。
aタグのURLが一致した場合クラス「active」がaタグの一つ上の階層に自動付与されるように、common.js内に記述しています。
備考
Plain HTMLを使用する。
aタグのURLが一致した場合クラス「active」がaタグの一つ上の階層に自動付与されるように、common.js内に記述しています。
備考
Plain HTMLを使用する。
aタグのURLが一致した場合クラス「active」がaタグの一つ上の階層に自動付与されるように、common.js内に記述しています。
備考
Plain HTMLを使用する。
aタグのURLが一致した場合クラス「active」がaタグの一つ上の階層に自動付与されるように、common.js内に記述しています。
備考
Plain HTMLを使用する。
aタグのURLが一致した場合クラス「active」がaタグの一つ上の階層に自動付与されるように、common.js内に記述しています。
- 順不同リスト
- 順不同リスト
start="数字"を任意の数字に変更可能
style="counter-reset: i 数字;"はjsで自動的に置き換わるので変更不要
- 順不同リスト
- 順不同リスト
備考無し
- 順序付きリスト
- 順序付きリスト
備考無し
- 順序付きリスト
- 順序付きリスト
備考無し
- 順序付きリスト
- 順序付きリスト
備考無し
備考無し
| 光ネット開始月 | 2カ月目～13カ月目 | 14カ月目～ | |
|---|---|---|---|
| 月額料金 | 日割り計算 | 5,170円 | 5,170円 |
| 初期費用/ 工事費 |
契約事務手数料 770円
光ネット工事費 27,500円 |
− | − |
| キャンペーン/ 割引※12 |
●初期費用0円キャンペーン
●光ネット工事費割引 |
●コミュファ光 |
− |
| お支払料金 | 月額料金の日割り請求 | 980円 | 5,170円 |
備考：
Plain HTMLを使用する。
PC表示：横幅いっぱいに広がります。
スマホ表示：画面幅に合わせてテーブルが縮みます。
| 光ネット開始月 | 2カ月目～13カ月目 | 14カ月目～ | |
|---|---|---|---|
| 月額料金 | 日割り計算 | 5,170円 | 5,170円 |
| 初期費用/
工事費 |
契約事務手数料 770円
光ネット工事費 27,500円 |
− | − |
| キャンペーン/
割引 ※12 |
●初期費用0円キャンペーン
●光ネット工事費割引
|
●コミュファ光
|
− |
| お支払料金 | 月額料金の日割り請求 | 980円 | 5,170円 |
備考：
Plain HTMLを使用する。
PC表示：横幅いっぱいに広がります。
スマホ表示：画面幅に合わせてテーブルが縮みます。
| 光ネット開始月 | 2カ月目～13カ月目 | 14カ月目～ | |
|---|---|---|---|
| 月額料金 | 日割り計算 | 5,170円 | 5,170円 |
| 初期費用/
工事費 |
契約事務手数料 770円
光ネット工事費 27,500円 |
− | − |
| キャンペーン/
割引 ※12 |
●初期費用0円キャンペーン
●光ネット工事費割引
|
●コミュファ光
|
− |
| お支払料金 | 月額料金の日割り請求 | 980円 | 5,170円 |
備考：
Plain HTMLを使用する。
PC表示：横幅いっぱいに広がります。
スマホ表示：画面幅に合わせてテーブルが縮みます。
| 光ネット開始月 | 2カ月目～13カ月目 | 14カ月目～ | |
|---|---|---|---|
| 月額料金 | 日割り計算 | 5,170円 | 5,170円 |
| 初期費用/ 工事費 |
契約事務手数料 770円
光ネット工事費 27,500円 |
− | − |
| キャンペーン/ 割引※12 |
●初期費用0円キャンペーン
●光ネット工事費割引 |
●コミュファ光 |
− |
| お支払料金 | 月額料金の日割り請求 | 980円 | 5,170円 |
備考：
Plain HTMLを使用する。
PC表示：横幅いっぱいに広がります。
スクロールをつけたい場合「class="js-scrollable"」でtableを囲ってください。
スマホ表示：以下のクラス名を入れることでスクロールが発生します。
table_width_sm：スマホの時テーブル幅560px
table_width_md：スマホの時テーブル幅720px
table_width_lg：スマホの時テーブル幅860px
<div class="js-scrollable">
<table class="table_bordered table_responsive table_width_md">
<thead class="thead_primary">
<tr>
<th></th>
<th> class="text_align_center">光ネット開始月</th>
<th> class="text_align_center">2カ月目～13カ月目</th>
<th> class="text_align_center">14カ月目～</th>
</tr>
</thead>
<tbody>
<tr>
<th> class="table_primary">月額料金</th>
<td>日割り計算</td>
<td>5,170円</td>
<td>5,170円</td>
</tr>
<tr>
<th class="table_primary">初期費用/<br>工事費</th>
<td>契約事務手数料 770円
<br>光ネット工事費 27,500円</td>
<td>−</td>
<td>−</td>
</tr>
<tr>
<th class="table_primary">キャンペーン/<br>割引<sup>※12</sup></th>
<td>
<div class="em1_text_indent-1 mb_10">
<p>
●初期費用0円キャンペーン<br><b> class="text_color_primary">契約事務手数料
-770円</b>
</p>
</div>
<div class="em1_text_indent-1 mb_10">
<p>
●光ネット工事費割引<br><b> class="text_color_primary">-27,500円</b>
</p>
</div>
</td>
<td>
<div class="em1_text_indent-1">
<p>
●コミュファ光<br>1年間980円キャンペーン<br><b>
class="text_color_primary">月額料金 -4,190円</b>
</p>
</div>
</td>
<td>−</td>
</tr>
<tr>
<th> class="table_primary">お支払料金</th>
<td>月額料金の日割り請求</td>
<td><b> class="text_color_primary">980円</b></td>
<td>5,170円</td>
</tr>
</tbody>
</table>
</div>
| SP用：110px固定のタイトル | タイトル | タイトル | タイトル |
|---|---|---|---|
| SP用：110px固定のタイトル1 | 2 | 4 | 4 |
| SP用：110px固定のタイトル2 | 2 | 4 | 4 |
| SP用：110px固定のタイトル3 | 〇 | 〇 | 〇 |
| SP用：110px固定のタイトル4 | 〇 | 〇 | 〇 |
| SP用：110px固定のタイトル5 | 〇 | 〇 | 〇 |
| SP用：110px固定のタイトル6 | × | 〇 | 〇 |
備考：
Plain HTMLを使用する。
・セルの結合する場合、SP表示の際に表示崩れの原因となるため、「table_sticky」は外してください。
・「table_sticky」を外すと、「テーブル：SP表示時スクロールなし」と同じく、テーブルの横幅は画面サイズに依存します。
・画面幅640px以下になった時、左固定が適用されます。
<div class="js-scrollable">
<table class="table_bordered table_responsive table_sticky table_width_md">
<thead>
<tr>
<th class="table_width_2 table_black text_align_center table_middle">110px固定のタイトル</th>
<th class="text_align_center table_middle table_width_2 table_gray">タイトル</th>
<th class="text_align_center table_middle table_width_2 table_gray">タイトル</th>
<th class="text_align_center table_middle table_width_2 table_gray">タイトル</th>
</tr>
</thead>
<tbody>
<tr>
<th>110px固定のテキスト1</th>
<td class="text_align_center table_middle">2</td>
<td class="text_align_center table_middle">4</td>
<td class="text_align_center table_middle">4</td>
</tr>
<tr>
<th>110px固定のテキスト2</th>
<td class="text_align_center table_middle">2</td>
<td class="text_align_center table_middle">4</td>
<td class="text_align_center table_middle">4</td>
</tr>
<tr>
<th>110px固定のテキスト3</th>
<td class="text_align_center table_middle">〇</td>
<td class="text_align_center table_middle">〇</td>
<td class="text_align_center table_middle">〇</td>
</tr>
<tr>
<th>110px固定のテキスト4</th>
<td class="text_align_center table_middle">〇</td>
<td class="text_align_center table_middle">〇</td>
<td class="text_align_center table_middle">〇</td>
</tr>
<tr>
<th>110px固定のテキスト5</th>
<td class="text_align_center table_middle">〇</td>
<td class="text_align_center table_middle">〇</td>
<td class="text_align_center table_middle">〇</td>
</tr>
<tr>
<th>110px固定のテキスト6</th>
<td class="text_align_center table_middle">×</td>
<td class="text_align_center table_middle">〇</td>
<td class="text_align_center table_middle">〇</td>
</tr>
</tbody>
</table>
</div>
| select1の票が入ります | ||||||
| 見出し1 | 見出し2 | 見出し3 | ||||
| 見出し | テキスト | テキスト | テキスト | テキスト | テキスト | テキスト |
| 見出し | ||||||
| 見出し | ||||||
| 見出し | ||||||
| 見出し | ||||||
見出し1
| 見出し | 見出し | 見出し |
|---|---|---|
| 見出し | ||
| 見出し | ||
| 見出し | ||
| 見出し |
見出し2
| 見出し | 見出し | 見出し |
|---|---|---|
| 見出し | ||
| 見出し | ||
| 見出し | ||
| 見出し |
見出し3
| 見出し | 見出し | 見出し |
|---|---|---|
| 見出し | ||
| 見出し | ||
| 見出し | ||
| 見出し |
備考：
コンテンツの最大は5つまでです。
Plain HTMLを使用する。
・セルの結合する場合、SP表示の際に表示崩れの原因となるため、「table_sticky」は外してください。
・「table_sticky」を外すと、「テーブル：SP表示時スクロールなし」と同じく、テーブルの横幅は画面サイズに依存します。
注意：
PC用テーブル、SP用テーブルとわかれています。PC用、SP用の入れ込みが必要です。
<div class="selectBox mb_sm_15">
<select class="form-control selectBox mb_20" id="selectBox1">
<option value="select1">select1</option>
<option value="select2">select2</option>
<option value="select3">select3</option>
</select>
</div>
<div class="select-content">
<!-- 1：ここからselect1のコンテンツ -->
<div class="select-content">
<!-- 1：ここからselect1のコンテンツ -->
<div class="box select1">
<!-- 1：ここからselect1のテーブル（PC用） -->
<table class="table_bordered table_responsive lp_page pc_only">
<tbody>
<tr>
<td class="" rowspan="2"></td>
<td class="text_align_center table_middle table_primary" colspan="6">select1の票が入ります</td>
</tr>
<tr>
<td class="text_align_center table_middle table_primary_deep" colspan="2">見出し1</td>
<td class="text_align_center table_middle table_primary_deep" colspan="2">見出し2</td>
<td class="text_align_center table_middle table_primary_deep" colspan="2">見出し3</sup>
</td>
</tr>
<tr>
<td>見出し</td>
<td class="text_align_center table_middle">テキスト</td>
<td class="text_align_center table_middle">テキスト
</td>
<td class="text_align_center table_middle">テキスト</td>
<td class="text_align_center table_middle">テキスト
</td>
<td class="text_align_center table_middle">テキスト</td>
<td class="text_align_center table_middle">テキスト
</td>
</tr>
<tr>
<td>見出し</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td>見出し</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td>見出し</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td>見出し</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
<!-- 1：ここまでselect1のテーブル（PC用） -->
<!-- 1：ここからselect1のテーブル（SP用） -->
<div class="table_sticky_topLeft sp_only">
<div class="table_sticky_title table_orange_deep">
<p>見出し1</p>
</div>
<div class="js-scrollable lp_page">
<table class="table_bordered table_responsive table_sticky table_width_sm">
<tbody>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle table_orange_pale">
見出し</td>
<td class="text_align_center table_middle table_orange_pale">
見出し</td>
</tr>
<tr>
<th class="table_orange_pale">見出し
</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="table_sticky_topLeft sp_only">
<div class="table_sticky_title table_orange_deep">
<p>見出し2</p>
</div>
<div class="js-scrollable lp_page">
<table class="table_bordered table_responsive table_sticky table_width_sm">
<tbody>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle table_orange_pale">
見出し</td>
<td class="text_align_center table_middle table_orange_pale">
見出し</td>
</tr>
<tr>
<th class="table_orange_pale">見出し
</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="table_sticky_topLeft sp_only">
<div class="table_sticky_title table_orange_deep">
<p>見出し3</p>
</div>
<div class="js-scrollable lp_page">
<table class="table_bordered table_responsive table_sticky table_width_sm">
<tbody>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle table_orange_pale">
見出し</td>
<td class="text_align_center table_middle table_orange_pale">
見出し</td>
</tr>
<tr>
<th class="table_orange_pale">見出し
</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
</tbody>
</table>
</div>
</div>
<!-- 1：ここまでselect1のテーブル（SP用） -->
</div>
<!-- 1：ここまでselect1のコンテンツ -->
</div>
<!-- 1：ここまでselect1のコンテンツ -->
<!-- 2：ここからselect2のコンテンツ -->
<div class="select-content">
<!-- 2：ここからselect2のコンテンツ -->
<div class="box select2" style="display: none;">
<!-- 2：ここからselect2のテーブル（PC用） -->
<table class="table_bordered table_responsive lp_page pc_only">
<tbody>
<tr>
<td class="" rowspan="2"></td>
<td class="text_align_center table_middle table_primary" colspan="6">select2の票が入ります</td>
</tr>
<tr>
<td class="text_align_center table_middle table_primary_deep" colspan="2">見出し1</td>
<td class="text_align_center table_middle table_primary_deep" colspan="2">見出し2</td>
<td class="text_align_center table_middle table_primary_deep" colspan="2">見出し3</sup>
</td>
</tr>
<tr>
<td>見出し</td>
<td class="text_align_center table_middle">テキスト</td>
<td class="text_align_center table_middle">テキスト
</td>
<td class="text_align_center table_middle">テキスト</td>
<td class="text_align_center table_middle">テキスト
</td>
<td class="text_align_center table_middle">テキスト</td>
<td class="text_align_center table_middle">テキスト
</td>
</tr>
<tr>
<td>見出し</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td>見出し</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td>見出し</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td>見出し</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
<!-- 2：ここまでselect2のテーブル（PC用） -->
<!-- 2：ここからselect2のテーブル（SP用） -->
<div class="table_sticky_topLeft sp_only">
<div class="table_sticky_title table_orange_deep">
<p>見出し1</p>
</div>
<div class="js-scrollable lp_page">
<table class="table_bordered table_responsive table_sticky table_width_sm">
<tbody>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle table_orange_pale">
見出し</td>
<td class="text_align_center table_middle table_orange_pale">
見出し</td>
</tr>
<tr>
<th class="table_orange_pale">見出し
</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="table_sticky_topLeft sp_only">
<div class="table_sticky_title table_orange_deep">
<p>見出し2</p>
</div>
<div class="js-scrollable lp_page">
<table class="table_bordered table_responsive table_sticky table_width_sm">
<tbody>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle table_orange_pale">
見出し</td>
<td class="text_align_center table_middle table_orange_pale">
見出し</td>
</tr>
<tr>
<th class="table_orange_pale">見出し
</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="table_sticky_topLeft sp_only">
<div class="table_sticky_title table_orange_deep">
<p>見出し3</p>
</div>
<div class="js-scrollable lp_page">
<table class="table_bordered table_responsive table_sticky table_width_sm">
<tbody>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle table_orange_pale">
見出し</td>
<td class="text_align_center table_middle table_orange_pale">
見出し</td>
</tr>
<tr>
<th class="table_orange_pale">見出し
</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
</tbody>
</table>
</div>
</div>
<!-- 2：ここまでselect2のテーブル（SP用） -->
</div>
<!-- 2：ここまでselect2のコンテンツ -->
</div>
<!-- 2：ここまでselect2のコンテンツ -->
<!-- 3：ここからselect3のコンテンツ -->
<div class="select-content">
<!-- 3：ここからselect3のコンテンツ -->
<div class="box select3" style="display: none;">
<!-- 3：ここからselect3のテーブル（PC用） -->
<table class="table_bordered table_responsive lp_page pc_only">
<tbody>
<tr>
<td class="" rowspan="2"></td>
<td class="text_align_center table_middle table_primary" colspan="6">select3の票が入ります</td>
</tr>
<tr>
<td class="text_align_center table_middle table_primary_deep" colspan="2">見出し1</td>
<td class="text_align_center table_middle table_primary_deep" colspan="2">見出し2</td>
<td class="text_align_center table_middle table_primary_deep" colspan="2">見出し3</sup>
</td>
</tr>
<tr>
<td>見出し</td>
<td class="text_align_center table_middle">テキスト</td>
<td class="text_align_center table_middle">テキスト
</td>
<td class="text_align_center table_middle">テキスト</td>
<td class="text_align_center table_middle">テキスト
</td>
<td class="text_align_center table_middle">テキスト</td>
<td class="text_align_center table_middle">テキスト
</td>
</tr>
<tr>
<td>見出し</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td>見出し</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td>見出し</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
<tr>
<td>見出し</td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
<td></td>
</tr>
</tbody>
</table>
<!-- 3：ここまでselect3のテーブル（PC用） -->
<!-- 3：ここからselect3のテーブル（SP用） -->
<div class="table_sticky_topLeft sp_only">
<div class="table_sticky_title table_orange_deep">
<p>見出し1</p>
</div>
<div class="js-scrollable lp_page">
<table class="table_bordered table_responsive table_sticky table_width_sm">
<tbody>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle table_orange_pale">
見出し</td>
<td class="text_align_center table_middle table_orange_pale">
見出し</td>
</tr>
<tr>
<th class="table_orange_pale">見出し
</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="table_sticky_topLeft sp_only">
<div class="table_sticky_title table_orange_deep">
<p>見出し2</p>
</div>
<div class="js-scrollable lp_page">
<table class="table_bordered table_responsive table_sticky table_width_sm">
<tbody>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle table_orange_pale">
見出し</td>
<td class="text_align_center table_middle table_orange_pale">
見出し</td>
</tr>
<tr>
<th class="table_orange_pale">見出し
</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
</tbody>
</table>
</div>
</div>
<div class="table_sticky_topLeft sp_only">
<div class="table_sticky_title table_orange_deep">
<p>見出し3</p>
</div>
<div class="js-scrollable lp_page">
<table class="table_bordered table_responsive table_sticky table_width_sm">
<tbody>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle table_orange_pale">
見出し</td>
<td class="text_align_center table_middle table_orange_pale">
見出し</td>
</tr>
<tr>
<th class="table_orange_pale">見出し
</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
<tr>
<th class="table_orange_pale">
見出し</th>
<td class="text_align_center table_middle"></td>
<td class="text_align_center table_middle"></td>
</tr>
</tbody>
</table>
</div>
</div>
<!-- 3：ここまでselect3のテーブル（SP用） -->
</div>
<!-- 3：ここまでselect3のコンテンツ -->
</div>
<!-- 3：ここまでselect3のコンテンツ -->
</div>
| 見出し | 見出し | 見出し |
|---|---|---|
| 見出し | 見出し | 見出し |
| 見出し | 見出し | 見出し |
| 見出し | 見出し | 見出し |
| 見出し | 見出し | 見出し |
備考：
テーブルの見出しの色を設定できます。
見出しの色を変えたいとき、theadタグに以下のclass名を設定してください。
thead_primary：オレンジ色の見出し
thead_primary_deep：濃いオレンジ
thead_gray：灰色の見出し
thead_border_black：見出しのボーダーを黒にしたい場合
| テキスト | テキスト | テキスト | テキスト | テキスト | テキスト |
備考：
テーブルのセルの色をth,tdに設定できます。
table_primary：オレンジ色のセル
table_primary_deep：濃いオレンジのセル
table_black：黒のセル
table_gray：灰色のセル
class名なし：白色のセル
table_border_black：セルのボーダーを黒にしたい場合
| 横方向 揃え位置 |
左 | 中央 | 右 |
|---|---|---|---|
| 縦方向 揃え位置 |
上 | 中央 | 下 |
備考：
セル内のテキストの揃える位置を設定できます。
何も指定しない場合は左寄せになります。
横方向 揃え位置
text_align_left：左
text_align_center：中央
text_align_right：右
縦方向 揃え位置
table_top：上
table_middle：中央
table_bottom：下
| 見出し | table_width_2 |
|---|
| 見出し | table_width_4 |
|---|
| 見出し | table_width_6 |
|---|
| 見出し | table_width_8 |
|---|
| 見出し | table_width_10 |
|---|
| 見出し | table_width_12 |
|---|
| 見出し | table_width_16 |
|---|
| 見出し | table_width_18 |
|---|
| 見出し | table_width_20 |
|---|
| 見出し | table_width_22 |
|---|
| 見出し | table_width_24 |
|---|
| word-break | 123456789数字を折り返します。 |
|---|
| word-breakなし | 123456789数字を折り返します。 |
|---|
備考：
表の幅を変更できます。
table_width_2：2文字分の幅
table_width_4：4文字分の幅
table_width_6：6文字分の幅
table_width_8：8文字分の幅
table_width_10：10文字分の幅
table_width_12：12文字分の幅
table_width_14：14文字分の幅
table_width_16：16文字分の幅
table_width_18：18文字分の幅
table_width_20：20文字分の幅
table_width_22：22文字分の幅
table_width_24：24文字分の幅
word-break：英数字を折り返すことができる。
※英数字（半角）と全角では折り返す文字数が異なります。
| 光ネット開始月 | 2カ月目～13カ月目 | 14カ月目～ | |
|---|---|---|---|
| 月額料金 | 日割り計算 | 5,170円 | 5,170円 |
| 初期費用/ 工事費 |
契約事務手数料 770円
光ネット工事費 27,500円 |
− | − |
| キャンペーン/ 割引※12 |
●初期費用0円キャンペーン
●光ネット工事費割引 |
●コミュファ光 |
− |
| お支払料金 | 月額料金の日割り請求 | 980円 | 5,170円 |
備考
PC表示：横幅いっぱいに広がります。
スマホ表示：はみ出た箇所がスクロールで表示されます。
| 光ネット開始月 | 2カ月目～13カ月目 | 14カ月目～ | |
|---|---|---|---|
| 月額料金 | 日割り計算 | 5,170円 | 5,170円 |
| 初期費用/ 工事費 |
契約事務手数料 770円
光ネット工事費 27,500円 |
− | − |
| キャンペーン/ 割引※12 |
●初期費用0円キャンペーン
●光ネット工事費割引 |
●コミュファ光 |
− |
| お支払料金 | 月額料金の日割り請求 | 980円 | 5,170円 |
備考
PC表示：横幅いっぱいに広がります。
スマホ表示：はみ出た箇所がスクロールで表示されます。
| 光ネット開始月 | 2カ月目～13カ月目 | 14カ月目～ | |
|---|---|---|---|
| 月額料金 | 日割り計算 | 5,170円 | 5,170円 |
| 初期費用/ 工事費 |
契約事務手数料 770円
光ネット工事費 27,500円 |
− | − |
| キャンペーン/ 割引※12 |
●初期費用0円キャンペーン
●光ネット工事費割引 |
●コミュファ光 |
− |
| お支払料金 | 月額料金の日割り請求 | 980円 | 5,170円 |
備考
PC表示：横幅いっぱいに広がります。
スマホ表示：はみ出た箇所がスクロールで表示されます。
トリガー側の属性にdata-toggle="modal" data-target="#exampleModal"を追加。
data-target="#exampleModal"の直は、ターゲットのmodalのidと合わせる。
-
ダミーテキスト
トリガー側の属性に（aタグ）data-toggle="modal" data-target="#exampleModal"を追加。
data-target="#exampleModal"の直は、ターゲットのmodalのidと合わせる。
modalにclassyoutube-modalを追加する（モーダル閉じたら再生を停止）
<div class="card_default_carousel">
<ul class="js_slick_default js_slick_default_3">
<!---------------------------- １：ここから１枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_light_blue ctc_card_link">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="https://placehold.jp/420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから１枚目のタイトル -->
<p class="card_title field-text">
ポップアップ動画01
</p>
<!-- ここまで１枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから１枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで１枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから１枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで１枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから１枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで１枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
<div class="component link card_link_wide col-12">
<div class="component-content">
<div class="field-link">
<!-- [1：モーダルtrigger] data-toggle="modal"と data-target="modal IDと合わせる" -->
<a href="" data-toggle="modal" data-target="#videoModal01">LINK</a>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- １：ここまで１枚目のカード ---------------------------->
<!---------------------------- ２：ここから２枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_light_blue ctc_card_link">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="https://placehold.jp/420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから２枚目のタイトル -->
<p class="card_title field-text">
ポップアップ動画02
</p>
<!-- ここまで２枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから２枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで２枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから２枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで２枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから２枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで２枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
<div class="component link card_link_wide col-12">
<div class="component-content">
<div class="field-link">
<!-- [２：モーダルtrigger] data-toggle="modal"と data-target="modal IDと合わせる" -->
<a href="" data-toggle="modal" data-target="#videoModal02">LINK</a>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ２：ここまで２枚目のカード ---------------------------->
<!---------------------------- ３：ここから３枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_light_blue ctc_card_link">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="https://placehold.jp/420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから３枚目のタイトル -->
<p class="card_title field-text">
ポップアップ動画03
</p>
<!-- ここまで３枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから３枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで３枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから３枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで３枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから３枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで３枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
<div class="component link card_link_wide col-12">
<div class="component-content">
<div class="field-link">
<!-- [３：モーダルtrigger] data-toggle="modal"と data-target="modal IDと合わせる" -->
<a href="" data-toggle="modal" data-target="#videoModal03">LINK</a>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ３：ここまで３枚目のカード ---------------------------->
<!---------------------------- ４：ここから４枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_light_blue ctc_card_link">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="https://placehold.jp/420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから４枚目のタイトル -->
<p class="card_title field-text">
ポップアップ動画04
</p>
<!-- ここまで４枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから４枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで４枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから４枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで４枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから４枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで４枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
<div class="component link card_link_wide col-12">
<div class="component-content">
<div class="field-link">
<!-- [４：モーダルtrigger] data-toggle="modal"と data-target="modal IDと合わせる" -->
<a href="" data-toggle="modal" data-target="#videoModal04">LINK</a>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ４：ここまで４枚目のカード ---------------------------->
</ul>
<!-- [モーダルtarget] -->
<!-- [１：モーダルtarget] id="data-targetの直と合わせる" -->
<div class="modal fade youtube-modal" id="videoModal01" tabindex="-1" role="dialog" aria-labelledby="videoModal01Label" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="ratio ratio-16x9">
<iframe width="560" height="315" src="https://www.youtube.com/embed/WJ6vRYWvEx0?si=Ku-EMytOuefSHmua" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
</div>
</div>
</div>
</div>
</div>
<!-- [２：モーダルtarget] id="data-targetの直と合わせる" -->
<div class="modal fade youtube-modal" id="videoModal02" tabindex="-1" role="dialog" aria-labelledby="videoModal01Label" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="ratio ratio-16x9">
<iframe width="560" height="315" src="https://www.youtube.com/embed/X30kTIWFuGQ?si=IKey7rj0n-2-pdpW" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
</div>
</div>
</div>
</div>
</div>
<!-- [３：モーダルtarget] id="data-targetの直と合わせる" -->
<div class="modal fade youtube-modal" id="videoModal03" tabindex="-1" role="dialog" aria-labelledby="videoModal01Label" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="ratio ratio-16x9">
<iframe width="560" height="315" src="https://www.youtube.com/embed/gdCtRpQhDDA?si=vK6bpSFHNtu1cSuT" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
</div>
</div>
</div>
</div>
</div>
<!-- [４：モーダルtarget] id="data-targetの直と合わせる" -->
<div class="modal fade youtube-modal" id="videoModal04" tabindex="-1" role="dialog" aria-labelledby="videoModal01Label" aria-hidden="true">
<div class="modal-dialog" role="document">
<div class="modal-content">
<div class="modal-header">
<button type="button" class="close" data-dismiss="modal" aria-label="Close">
<span aria-hidden="true">×</span>
</button>
</div>
<div class="modal-body">
<div class="ratio ratio-16x9">
<iframe width="560" height="315" src="https://www.youtube.com/embed/VBg2BEC9LKM?si=IsigDyyGo05YWXZe" title="YouTube video player" frameborder="0" allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture; web-share" referrerpolicy="strict-origin-when-cross-origin" allowfullscreen></iframe>
</div>
</div>
</div>
</div>
</div>
</div>
トリガー側の属性に（aタグ）data-toggle="modal" data-target="#exampleModal"を追加。
data-target="#exampleModal"の直は、ターゲットのmodalのidと合わせる。
modalにclassyoutube-modalを追加する（モーダル閉じたら再生を停止）
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
備考：
Plain HTMLを使用する。
カードの枚数は最大7つまで。
<div class="card_default_carousel">
<ul class="js_slick_default js_slick_default_3 card_slider">
<!---------------------------- １：ここから１枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_light_blue ctc_card_link">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから１枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで１枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから１枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで１枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから１枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで１枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから１枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで１枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
<div class="component link card_link_wide col-12">
<div class="component-content">
<div class="field-link">
<a href=" ">LINK</a>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- １：ここまで１枚目のカード ---------------------------->
<!---------------------------- ２：ここから２枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_light_blue ctc_card_link">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから２枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで２枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから２枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで２枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから２枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで２枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから２枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで２枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
<div class="component link card_link_wide col-12">
<div class="component-content">
<div class="field-link">
<a href=" ">LINK</a>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ２：ここまで２枚目のカード ---------------------------->
<!---------------------------- ３：ここから３枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_light_blue ctc_card_link">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから３枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで３枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから３枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで３枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから３枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで３枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから３枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで３枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
<div class="component link card_link_wide col-12">
<div class="component-content">
<div class="field-link">
<a href=" ">LINK</a>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ３：ここまで３枚目のカード ---------------------------->
<!---------------------------- ４：ここから４枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_light_blue ctc_card_link">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから４枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで４枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから４枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで４枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから４枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで４枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから４枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで４枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
<div class="component link card_link_wide col-12">
<div class="component-content">
<div class="field-link">
<a href=" ">LINK</a>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ４：ここまで４枚目のカード ---------------------------->
<!---------------------------- ５：ここから５枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_light_blue ctc_card_link">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから５枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで５枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから５枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで５枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから５枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで５枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから５枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで５枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
<div class="component link card_link_wide col-12">
<div class="component-content">
<div class="field-link">
<a href=" ">LINK</a>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ５：ここまで５枚目のカード ---------------------------->
<!---------------------------- ６：ここから６枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_light_blue ctc_card_link">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから６枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで６枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから６枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで６枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから６枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで６枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから６枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで６枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
<div class="component link card_link_wide col-12">
<div class="component-content">
<div class="field-link">
<a href=" ">LINK</a>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ６：ここまで６枚目のカード ---------------------------->
<!---------------------------- ７：ここから７枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_light_blue ctc_card_link">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから７枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで７枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから７枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで７枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから７枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで７枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから７枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで７枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
<div class="component link card_link_wide col-12">
<div class="component-content">
<div class="field-link">
<a href=" ">LINK</a>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ７：ここまで７枚目のカード ---------------------------->
</ul>
</div>
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
備考：
Plain HTMLを使用する。
カードの枚数は最大7つまで。
<div class="card_default_carousel">
<ul class="js_slick_default js_slick_default_3 card_slider">
<!---------------------------- １：ここから１枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_orange ctc_card_link">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから１枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで１枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから１枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで１枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから１枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで１枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから１枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで１枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
<div class="component link card_link_wide col-12">
<div class="component-content">
<div class="field-link">
<a href=" ">LINK</a>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- １：ここまで１枚目のカード ---------------------------->
<!---------------------------- ２：ここから２枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_orange ctc_card_link">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから２枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで２枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから２枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで２枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから２枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで２枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから２枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで２枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
<div class="component link card_link_wide col-12">
<div class="component-content">
<div class="field-link">
<a href=" ">LINK</a>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ２：ここまで２枚目のカード ---------------------------->
<!---------------------------- ３：ここから３枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_orange ctc_card_link">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから３枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで３枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから３枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで３枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから３枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで３枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから３枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで３枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
<div class="component link card_link_wide col-12">
<div class="component-content">
<div class="field-link">
<a href=" ">LINK</a>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ３：ここまで３枚目のカード ---------------------------->
<!---------------------------- ４：ここから４枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_orange ctc_card_link">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから４枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで４枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから４枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで４枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから４枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで４枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから４枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで４枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
<div class="component link card_link_wide col-12">
<div class="component-content">
<div class="field-link">
<a href=" ">LINK</a>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ４：ここまで４枚目のカード ---------------------------->
<!---------------------------- ５：ここから５枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_orange ctc_card_link">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから５枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで５枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから５枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで５枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから５枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで５枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから５枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで５枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
<div class="component link card_link_wide col-12">
<div class="component-content">
<div class="field-link">
<a href=" ">LINK</a>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ５：ここまで５枚目のカード ---------------------------->
<!---------------------------- ６：ここから６枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_orange ctc_card_link">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから６枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで６枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから６枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで６枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから６枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで６枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから６枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで６枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
<div class="component link card_link_wide col-12">
<div class="component-content">
<div class="field-link">
<a href=" ">LINK</a>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ６：ここまで６枚目のカード ---------------------------->
<!---------------------------- ７：ここから７枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_orange ctc_card_link">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから７枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで７枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから７枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで７枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから７枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで７枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから７枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで７枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
<div class="component link card_link_wide col-12">
<div class="component-content">
<div class="field-link">
<a href=" ">LINK</a>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ７：ここまで７枚目のカード ---------------------------->
</ul>
</div>
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
備考：
Plain HTMLを使用する。
カードの枚数は最大7つまで。
<div class="card_default_carousel">
<ul class="js_slick_default js_slick_default_3 card_slider">
<!---------------------------- １：ここから１枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_light_blue">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから１枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで１枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから１枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで１枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから１枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで１枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから１枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで１枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- １：ここまで１枚目のカード ---------------------------->
<!---------------------------- ２：ここから２枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_light_blue">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから２枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで２枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから２枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで２枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから２枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで２枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから２枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで２枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ２：ここまで２枚目のカード ---------------------------->
<!---------------------------- ３：ここから３枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_light_blue">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから３枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで３枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから３枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで３枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから３枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで３枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから３枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで３枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ３：ここまで３枚目のカード ---------------------------->
<!---------------------------- ４：ここから４枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_light_blue">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから４枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで４枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから４枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで４枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから４枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで４枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから４枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで４枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ４：ここまで４枚目のカード ---------------------------->
<!---------------------------- ５：ここから５枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_light_blue">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから５枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで５枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから５枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで５枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから５枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで５枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから５枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで５枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ５：ここまで５枚目のカード ---------------------------->
<!---------------------------- ６：ここから６枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_light_blue">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから６枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで６枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから６枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで６枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから６枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで６枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから６枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで６枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ６：ここまで６枚目のカード ---------------------------->
<!---------------------------- ７：ここから７枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_light_blue">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから７枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで７枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから７枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで７枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから７枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで７枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから７枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで７枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ７：ここまで７枚目のカード ---------------------------->
</ul>
</div>
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
-
作品タイトルテキスト
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
配信条件：Netflix
COPYRIGHT©text
備考：
Plain HTMLを使用する。
カードの枚数は最大7つまで。
<div class="card_default_carousel">
<ul class="js_slick_default js_slick_default_3 card_slider">
<!---------------------------- １：ここから１枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_orange">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから１枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで１枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから１枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで１枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから１枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで１枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから１枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで１枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- １：ここまで１枚目のカード ---------------------------->
<!---------------------------- ２：ここから２枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_orange">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから２枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで２枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから２枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで２枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから２枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで２枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから２枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで２枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ２：ここまで２枚目のカード ---------------------------->
<!---------------------------- ３：ここから３枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_orange">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから３枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで３枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから３枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで３枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから３枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで３枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから３枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで３枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ３：ここまで３枚目のカード ---------------------------->
<!---------------------------- ４：ここから４枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_orange">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから４枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで４枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから４枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで４枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから４枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで４枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから４枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで４枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ４：ここまで４枚目のカード ---------------------------->
<!---------------------------- ５：ここから５枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_orange">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから５枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで５枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから５枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで５枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから５枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで５枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから５枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで５枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ５：ここまで５枚目のカード ---------------------------->
<!---------------------------- ６：ここから６枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_orange">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから６枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで６枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから６枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで６枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから６枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで６枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから６枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで６枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ６：ここまで６枚目のカード ---------------------------->
<!---------------------------- ７：ここから７枚目のカード ---------------------------->
<li class="card_slider_item">
<div class="component container col-12 ctc_card_plane bd_orange">
<div class="component-content">
<div class="row">
<div class="component image file-type-icon-media-link col-12 card_image">
<div class="component-content">
<img src="/-/media/Project/commufa/commufa/images/2022/common/dev/img_dev_420x236.png" alt="" width="420" height="236">
</div>
</div>
<div class="component container col-12 card_body">
<div class="component-content">
<div class="row">
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから７枚目のタイトル -->
<p class="card_title field-text">
作品タイトルテキスト
</p>
<!-- ここまで７枚目のタイトル -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<div class="card_outline">
<!-- ここから７枚目の説明文 -->
<p class="field-text">
作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト作品紹介テキスト
</p>
<!-- ここまで７枚目の説明文 -->
</div>
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから７枚目の配信条件 -->
<p class="card_label field-text">
配信条件：Netflix
</p>
<!-- ここまで７枚目の配信条件 -->
</div>
</div>
<div class="component rich-text col-12">
<div class="component-content">
<!-- ここから７枚目のコピーライト -->
<p class="card_copyright field-text">
COPYRIGHT©text
</p>
<!-- ここまで７枚目のコピーライト -->
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</li>
<!---------------------------- ７：ここまで７枚目のカード ---------------------------->
</ul>
</div>
備考無し
備考無し
備考無し
上下左右
備考
全画面サイズに指定するクラスを使ってスマホの余白を指定します。
例）PCの余白は0px、スマホだけに15px余白を付けるときは「m_15」「m_sm_0」の2つを併用します。
smサイズ：画面サイズ641px~
m：マージン（外側）
p：パディング（内側）
mの値をpに置き換えると内側に余白が付くようになります。
上下
備考
y：縦軸
左右
備考
x：横軸
上
備考
t：top
下
備考
b：bottom
左
備考
l：left
右
備考
r：right
上下左右
備考
全画面サイズに指定するクラスを使ってスマホの余白を指定します。
例）PCの余白は0px、スマホだけに15px余白を付けるときは「m_15」「m_sm_0」の2つを併用します。
smサイズ：画面サイズ641px~
m：マージン（外側）
p：パディング（内側）
mの値をpに置き換えると内側に余白が付くようになります。
上下
備考
y：縦軸
左右
備考
x：横軸
上
備考
t：top
下
備考
b：bottom
左
備考
l：left
右
備考
r：right
備考：
コンテンツの最大は5つまでです。
<div class="selectBox mb_sm_15">
<select class="form-control selectBox" id="selectBox2">
<option value="select1">select1</option>
<option value="select2">select2</option>
<option value="select3">select3</option>
<option value="select4">select4</option>
<option value="select5">select5</option>
</select>
</div>
<div class="select-content">
<!---------------------------- １：ここからselect1のコンテンツ ---------------------------->
<div class="box select1">
<!-- select1のコンテンツが入ります -->
</div>
<!---------------------------- １：ここまでselect1のコンテンツ ---------------------------->
<!---------------------------- 2：ここからselect2のコンテンツ ---------------------------->
<div class="box select2" style="display: none;">
<!-- select2のコンテンツが入ります -->
</div>
<!---------------------------- 2：ここまでselect2のコンテンツ ---------------------------->
<!---------------------------- 3：ここからselect3のコンテンツ ---------------------------->
<div class="box select3" style="display: none;">
<!-- select3のコンテンツが入ります -->
</div>
<!---------------------------- 3：ここまでselect3のコンテンツ ---------------------------->
<!---------------------------- 4：ここからselect4のコンテンツ ---------------------------->
<div class="box select4" style="display: none;">
<!-- select4のコンテンツが入ります -->
</div>
<!---------------------------- 4：ここまでselect4のコンテンツ ---------------------------->
<!---------------------------- 5：ここからselect5のコンテンツ ---------------------------->
<div class="box select5" style="display: none;">
<!-- select5のコンテンツが入ります -->
</div>
<!---------------------------- 5：ここまでselect5のコンテンツ ---------------------------->
</div>
お住まいの形態は?
備考：Plain HTMLを使用する。
最大4カラムまで。
list_col_02：2カラム
list_col_03：3カラム
list_col_04：4カラム
<div class="ctc_web_simulation_area ctc_standard_contact typeA">
<div class="ctc_web_simulation_inner">
<div class="ctc_web_simulation_panel">
<!-- 最初の選択肢 -->
<div id="qutstion_step01" class="ctc_web_simulation_nav">
<div class="ctc_web_simulation_header">
<p>お住まいの形態は?</p>
</div>
<div class="ctc_web_simulation_link_area">
<ul class="ctc_web_simulation_link_list list_col_02">
<li>
<a data-target="#qutstion_step02"
class="ctc_web_simulation_link_box ctc_web_simulation_link_transitions">
<div class="ctc_web_simulation_link_image"><img
src="-/media/Project/commufa/commufa/images/pr/user/10gmenu/img_wifi_01.png"
alt=""></div>
<p class="ctc_web_simulation_link_top_title">
10ギガ・5ギガメニュー
</p>
</a>
</li>
<li>
<a data-target="#qutstion_step03"
class="ctc_web_simulation_link_box ctc_web_simulation_link_transitions">
<div class="ctc_web_simulation_link_image"><img
src="-/media/Project/commufa/commufa/images/pr/user/10gmenu/img_wifi_02.png"
alt=""></div>
<p class="ctc_web_simulation_link_top_title">
それ以外・わからない
</p>
</a>
</li>
</ul>
</div>
</div>
<!-- 次の選択肢 qutstion_step02 -->
<div id="qutstion_step02"
class="ctc_web_simulation_nav ctc_web_simulation_nav_category"
style="display: none;">
<div class="ctc_web_simulation_header">
<p>
気になるネットの
症状は？</p>
</div>
<div class="ctc_web_simulation_link_area">
<ul class="ctc_web_simulation_link_list list_col_02">
<li>
<a data-target="#diagnostic_result01"
class="ctc_web_simulation_link_box ctc_web_simulation_link_transitions">
<div class="ctc_web_simulation_link_image"><img
src="-/media/Project/commufa/commufa/images/pr/user/10gmenu/img_04.png"
alt=""></div>
<p class="ctc_web_simulation_link_title">繋がりにくい部屋がある
</p>
</a>
</li>
<li>
<a data-target="#diagnostic_result02"
class="ctc_web_simulation_link_box ctc_web_simulation_link_transitions">
<div class="ctc_web_simulation_link_image"><img
src="-/media/Project/commufa/commufa/images/pr/user/10gmenu/img_02.png"
alt=""></div>
<p class="ctc_web_simulation_link_title">
ゴールデンタイムにネットが遅いと感じる
、オンラインゲームにラグがある</p>
</a>
</li>
</ul>
<div class="btn_accent btn_c arrow_bottom">
<span
class="btn_link_wide field-link ctc_web_simulation_back_btn">
<a data-target="#qutstion_step01" data-variantitemid=""
data-variantfieldname="Link">前の選択肢へ戻る</a>
</span>
</div>
</div>
</div>
<!-- 次の選択肢 qutstion_step03 -->
<div id="qutstion_step03"
class="ctc_web_simulation_nav ctc_web_simulation_nav_category"
style="display: none;">
<div class="ctc_web_simulation_header">
<p>コミュファのご利用年数と気になるネットの症状は？</p>
</div>
<div class="ctc_web_simulation_link_area">
<ul class="ctc_web_simulation_link_list list_col_03">
<li>
<a data-target="#diagnostic_result03"
class="ctc_web_simulation_link_box ctc_web_simulation_link_transitions">
<div class="ctc_web_simulation_link_image"><img
src="-/media/Project/commufa/commufa/images/pr/user/10gmenu/img_01.png"
alt=""></div>
<p class="ctc_web_simulation_link_title">ご利用年数8年以上
</p>
</a>
</li>
<li>
<a data-target="#diagnostic_result04"
class="ctc_web_simulation_link_box ctc_web_simulation_link_transitions">
<div class="ctc_web_simulation_link_image"><img
src="-/media/Project/commufa/commufa/images/pr/user/10gmenu/img_02.png"
alt=""></div>
<p class="ctc_web_simulation_link_title">
ご利用年数8年未満・ネットが遅いと感じる</p>
</a>
</li>
<li>
<a data-target="#diagnostic_result05"
class="ctc_web_simulation_link_box ctc_web_simulation_link_transitions">
<div class="ctc_web_simulation_link_image"><img
src="-/media/Project/commufa/commufa/images/pr/user/10gmenu/img_04.png"
alt=""></div>
<p class="ctc_web_simulation_link_title">
ご利用年数8年未満・繋がりにくい部屋がある</p>
</a>
</li>
</ul>
<div class="btn_accent btn_c arrow_bottom">
<span
class="btn_link_wide field-link ctc_web_simulation_back_btn">
<a data-target="#qutstion_step01" data-variantitemid=""
data-variantfieldname="Link">前の選択肢へ戻る</a>
</span>
</div>
</div>
</div>
<!-- 診断結果 #diagnostic_result01-->
<div id="diagnostic_result01"
class="ctc_web_simulation_nav ctc_web_simulation_nav_category ctc_web_simulation_nav_result"
style="display: none;">
<div class="ctc_web_simulation_header">
<p>診断結果</p>
</div>
<div class="ctc_web_simulation_link_area">
<p class="ctc_web_simulation_text"><span
class="ctc_marker">おすすめ改善案②：メッシュWi-Fi導入</span></p>
<div class="ctc_web_simulation_link_image text_align_center">
<img src="-/media/Project/commufa/commufa/images/pr/user/10gmenu/img_wifi_03.png"
alt=""></div>
<p class="mb_10">建物の構造や壁の材質の影響で、Wi-Fiの電波が届いていない可能性があります。</p>
<p>メッシュWi-Fi機器を設置することでWi-Fiの届く範囲を広げます。寝室や書斎、お風呂、トイレなど、今までWi-Fiが届きにくかった場所でも快適にネットがご利用いただけるようになります。ご利用のメッシュWi-Fi機器でご自宅内をカバーできない場合は台数の追加も可能です。
</p>
<div class="btn_accent btn_orange bg_left arrow_right mt_10">
<span
class="btn_link_wide field-link ctc_web_simulation_internal_link">
<a data-target="#recommended_improvements02"
data-variantitemid=""
data-variantfieldname="Link">サービス内容を確認する</a>
</span>
</div>
<div class="btn_accent btn_c arrow_bottom mt_10">
<span
class="btn_link_wide field-link ctc_web_simulation_back_btn">
<a data-target="#qutstion_step02" data-variantitemid=""
data-variantfieldname="Link">前の選択肢へ戻る</a>
</span>
</div>
</div>
</div>
<!-- 診断結果 #diagnostic_result02-->
<div id="diagnostic_result02"
class="ctc_web_simulation_nav ctc_web_simulation_nav_category ctc_web_simulation_nav_result"
style="display: none;">
<div class="ctc_web_simulation_header">
<p>診断結果</p>
</div>
<div class="ctc_web_simulation_link_area">
<p class="ctc_web_simulation_text"><span
class="ctc_marker">おすすめ改善案③：ゲーミングカスタム導入</span></p>
<div class="ctc_web_simulation_link_image text_align_center">
<img src="-/media/Project/commufa/commufa/images/pr/user/10gmenu/img_wifi_03.png"
alt=""></div>
<p class="mb_10">
オンラインゲームの通信容量の問題や混線により時間帯によって回線が重くなっている可能性があります。</p>
<p class="mb_10">
コミュファでは瞬間的に回線が混雑した場合でも、優先的に通信を通して速度と安定を維持するオプションを用意しています。これが、国内初のQoS技術を用いたファストコネクトオプション「ゲーミングカスタム」です。
</p>
<p class="mb_10">混み合う時間帯でも些細なラグさえあってほしくない、という方々に支持されています。</p>
<div class="btn_accent btn_orange bg_left arrow_right mt_10">
<span
class="btn_link_wide field-link ctc_web_simulation_internal_link">
<a data-target="#recommended_improvements03"
data-variantitemid=""
data-variantfieldname="Link">サービス内容を確認する</a>
</span>
</div>
<div class="btn_accent btn_c arrow_bottom mt_10">
<span
class="btn_link_wide field-link ctc_web_simulation_back_btn">
<a data-target="#qutstion_step02" data-variantitemid=""
data-variantfieldname="Link">前の選択肢へ戻る</a>
</span>
</div>
</div>
</div>
<!-- 診断結果 #diagnostic_result03-->
<div id="diagnostic_result03"
class="ctc_web_simulation_nav ctc_web_simulation_nav_category ctc_web_simulation_nav_result"
style="display: none;">
<div class="ctc_web_simulation_header">
<p>診断結果</p>
</div>
<div class="ctc_web_simulation_link_area">
<p class="ctc_web_simulation_text"><span
class="ctc_marker">おすすめ改善案①：10ギガメニューにグレードアップ</span></p>
<div class="ctc_web_simulation_link_image text_align_center">
<img src="-/media/Project/commufa/commufa/images/pr/user/10gmenu/img_wifi_03.png"
alt=""></div>
<p class="mb_10">
長らくお使いいただきありがとうございます。ご契約変更されていない場合は、ホームゲートウェイが古くなっている可能性があります。
</p>
<p>通信速度不足や電波干渉を起こしている可能性があります。また、建物の構造や壁の材質の影響で、Wi-Fiの電波が届いていない可能性があります。
</p>
<div class="btn_accent btn_orange bg_left arrow_right mt_10">
<span
class="btn_link_wide field-link ctc_web_simulation_internal_link">
<a data-target="#recommended_improvements01"
data-variantitemid=""
data-variantfieldname="Link">サービス内容を確認する</a>
</span>
</div>
<div class="btn_accent btn_c arrow_bottom mt_10">
<span
class="btn_link_wide field-link ctc_web_simulation_back_btn">
<a data-target="#qutstion_step03" data-variantitemid=""
data-variantfieldname="Link">前の選択肢へ戻る</a>
</span>
</div>
</div>
</div>
<!-- 診断結果 #diagnostic_result04-->
<div id="diagnostic_result04"
class="ctc_web_simulation_nav ctc_web_simulation_nav_category ctc_web_simulation_nav_result"
style="display: none;">
<div class="ctc_web_simulation_header">
<p>診断結果</p>
</div>
<div class="ctc_web_simulation_link_area">
<p class="ctc_web_simulation_text"><span
class="ctc_marker">おすすめ改善案①：10ギガメニューにグレードアップ</span></p>
<div class="ctc_web_simulation_link_image text_align_center">
<img src="-/media/Project/commufa/commufa/images/pr/user/10gmenu/img_wifi_03.png"
alt=""></div>
<p class="mb_10">
長らくお使いいただきありがとうございます。ご契約変更されていない場合は、ホームゲートウェイが古くなっている可能性があります。
</p>
<p>通信速度不足や電波干渉を起こしている可能性があります。また、建物の構造や壁の材質の影響で、Wi-Fiの電波が届いていない可能性があります。
</p>
<div class="btn_accent btn_orange bg_left arrow_right mt_10">
<span
class="btn_link_wide field-link ctc_web_simulation_internal_link">
<a data-target="#recommended_improvements01"
data-variantitemid=""
data-variantfieldname="Link">サービス内容を確認する</a>
</span>
</div>
<div class="btn_accent btn_c arrow_bottom mt_10">
<span
class="btn_link_wide field-link ctc_web_simulation_back_btn">
<a data-target="#qutstion_step03" data-variantitemid=""
data-variantfieldname="Link">前の選択肢へ戻る</a>
</span>
</div>
</div>
</div>
<!-- 診断結果 #diagnostic_result05-->
<div id="diagnostic_result05"
class="ctc_web_simulation_nav ctc_web_simulation_nav_category ctc_web_simulation_nav_result"
style="display: none;">
<div class="ctc_web_simulation_header">
<p>診断結果</p>
</div>
<div class="ctc_web_simulation_link_area">
<p class="ctc_web_simulation_text"><span
class="ctc_marker">おすすめ改善案②：メッシュWi-Fi導入</span></p>
<div class="ctc_web_simulation_link_image text_align_center">
<img src="-/media/Project/commufa/commufa/images/pr/user/10gmenu/img_wifi_03.png"
alt=""></div>
<p class="mb_10">建物の構造や壁の材質の影響で、Wi-Fiの電波が届いていない可能性があります。</p>
<p>メッシュWi-Fi機器を設置することでWi-Fiの届く範囲を広げます。寝室や書斎、お風呂、トイレなど、今までWi-Fiが届きにくかった場所でも快適にネットがご利用いただけるようになります。ご利用のメッシュWi-Fi機器でご自宅内をカバーできない場合は台数の追加も可能です。
</p>
<div class="btn_accent btn_orange bg_left arrow_right mt_10">
<span
class="btn_link_wide field-link ctc_web_simulation_internal_link">
<a data-target="#recommended_improvements02"
data-variantitemid=""
data-variantfieldname="Link">サービス内容を確認する</a>
</span>
</div>
<div class="btn_accent btn_c arrow_bottom mt_10">
<span
class="btn_link_wide field-link ctc_web_simulation_back_btn">
<a data-target="#qutstion_step03" data-variantitemid=""
data-variantfieldname="Link">前の選択肢へ戻る</a>
</span>
</div>
</div>
</div>
</div>
</div>
</div>