使い方!
- 専用プラグインをインストールして有効化
- コピーボタンをクリック
- 「Shift + Ctrl + V」でテキストとして投稿画面で貼り付け
このページのもくじ
ノーマル
①アイコンver1
タイトル
<!-- wp:list {"className":"bflist-icon-chevron","plusbfClassName":"bflist-icon-chevron","plusbfStyle":"ul.bflist-icon-chevron {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\n.bflist-icon-chevron li {\n display: flex;\n position: relative;\n margin: 4px 0;\n padding-left: 25px;\n align-items: center;\n}\n.bflist-icon-chevron li:before {\n display: flex;\n position: absolute;\n left: 0;\n font-family: \u0022font awesome 5 free\u0022;\n font-weight: 600;\n content: \u0022\\f138\u0022;\n}\n.has-background .bflist-icon-chevron {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ul.bflist-icon-chevron,\nul.bflist-icon-chevron {\n border: none;\n}\n.cps-post-main ul.bflist-icon-chevron li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-icon-chevron"><li>サンプルテキスト</li><li>サンプルテキスト</li><li>サンプルテキスト</li></ul>
<!-- /wp:list -->
タイトル
<!-- wp:group {"style":{"color":{"text":"#60a7d6"}}} -->
<div class="wp-block-group has-text-color" style="color:#60a7d6"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-icon-chevron","plusbfClassName":"bflist-icon-chevron","plusbfStyle":"ul.bflist-icon-chevron {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\n.bflist-icon-chevron li {\n display: flex;\n position: relative;\n margin: 4px 0;\n padding-left: 25px;\n align-items: center;\n}\n.bflist-icon-chevron li:before {\n display: flex;\n position: absolute;\n left: 0;\n font-family: \u0022font awesome 5 free\u0022;\n font-weight: 600;\n content: \u0022\\f138\u0022;\n}\n.has-background .bflist-icon-chevron {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ul.bflist-icon-chevron,\nul.bflist-icon-chevron {\n border: none;\n}\n.cps-post-main ul.bflist-icon-chevron li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-icon-chevron"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
タイトル
<!-- wp:group {"style":{"color":{"text":"#76ced3"}}} -->
<div class="wp-block-group has-text-color" style="color:#76ced3"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-icon-chevron","plusbfClassName":"bflist-icon-chevron","plusbfStyle":"ul.bflist-icon-chevron {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\n.bflist-icon-chevron li {\n display: flex;\n position: relative;\n margin: 4px 0;\n padding-left: 25px;\n align-items: center;\n}\n.bflist-icon-chevron li:before {\n display: flex;\n position: absolute;\n left: 0;\n font-family: \u0022font awesome 5 free\u0022;\n font-weight: 600;\n content: \u0022\\f138\u0022;\n}\n.has-background .bflist-icon-chevron {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ul.bflist-icon-chevron,\nul.bflist-icon-chevron {\n border: none;\n}\n.cps-post-main ul.bflist-icon-chevron li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-icon-chevron"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
タイトル
<!-- wp:group {"style":{"color":{"text":"#60a7d6","background":"#f3f8fc"}}} -->
<div class="wp-block-group has-text-color has-background" style="background-color:#f3f8fc;color:#60a7d6"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-icon-chevron","plusbfClassName":"bflist-icon-chevron","plusbfStyle":"ul.bflist-icon-chevron {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\n.bflist-icon-chevron li {\n display: flex;\n position: relative;\n margin: 4px 0;\n padding-left: 25px;\n align-items: center;\n}\n.bflist-icon-chevron li:before {\n display: flex;\n position: absolute;\n left: 0;\n font-family: \u0022font awesome 5 free\u0022;\n font-weight: 600;\n content: \u0022\\f138\u0022;\n}\n.has-background .bflist-icon-chevron {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ul.bflist-icon-chevron,\nul.bflist-icon-chevron {\n border: none;\n}\n.cps-post-main ul.bflist-icon-chevron li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-icon-chevron"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
タイトル
<!-- wp:group {"style":{"color":{"text":"#76ced3","background":"#f4fbfc"}}} -->
<div class="wp-block-group has-text-color has-background" style="background-color:#f4fbfc;color:#76ced3"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-icon-chevron","plusbfClassName":"bflist-icon-chevron","plusbfStyle":"ul.bflist-icon-chevron {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\n.bflist-icon-chevron li {\n display: flex;\n position: relative;\n margin: 4px 0;\n padding-left: 25px;\n align-items: center;\n}\n.bflist-icon-chevron li:before {\n display: flex;\n position: absolute;\n left: 0;\n font-family: \u0022font awesome 5 free\u0022;\n font-weight: 600;\n content: \u0022\\f138\u0022;\n}\n.has-background .bflist-icon-chevron {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ul.bflist-icon-chevron,\nul.bflist-icon-chevron {\n border: none;\n}\n.cps-post-main ul.bflist-icon-chevron li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-icon-chevron"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
対応テーマ | SANGO・JIN・COCOON・THE SONIC |
②アイコンver2
タイトル
<!-- wp:list {"className":"bflist-icon-angle-right","plusbfClassName":"bflist-icon-angle-right","plusbfStyle":"ul.bflist-icon-angle-right {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\n.cps-post-main ul.bflist-icon-angle-right li,\nul.bflist-icon-angle-right li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-icon-angle-right li:before,\n.bflist-icon-angle-right li:after {\n display: flex;\n position: absolute;\n left: 0;\n top: 0.25rem;\n width: 1rem;\n height: 1rem;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n}\n.bflist-icon-angle-right li:before {\n z-index: 1;\n font-family: \u0022font awesome 5 free\u0022;\n font-weight: 600;\n font-size: 0.75rem;\n content: \u0022\\f105\u0022;\n}\n.bflist-icon-angle-right li:after {\n z-index: 0;\n background: currentColor;\n opacity: 0.2;\n content: \u0022\u0022;\n}\n.has-background .bflist-icon-angle-right {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ul.bflist-icon-angle-right,\nul.bflist-icon-angle-right {\n border: none;\n}\n.cps-post-main ul.bflist-icon-angle-right li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-icon-angle-right"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list -->
タイトル
<!-- wp:group {"style":{"color":{"text":"#60a7d6"}}} -->
<div class="wp-block-group has-text-color" style="color:#60a7d6"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-icon-angle-right","plusbfClassName":"bflist-icon-angle-right","plusbfStyle":"ul.bflist-icon-angle-right {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\n.cps-post-main ul.bflist-icon-angle-right li,\nul.bflist-icon-angle-right li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-icon-angle-right li:before,\n.bflist-icon-angle-right li:after {\n display: flex;\n position: absolute;\n left: 0;\n top: 0.25rem;\n width: 1rem;\n height: 1rem;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n}\n.bflist-icon-angle-right li:before {\n z-index: 1;\n font-family: \u0022font awesome 5 free\u0022;\n font-weight: 600;\n font-size: 0.75rem;\n content: \u0022\\f105\u0022;\n}\n.bflist-icon-angle-right li:after {\n z-index: 0;\n background: currentColor;\n opacity: 0.2;\n content: \u0022\u0022;\n}\n.has-background .bflist-icon-angle-right {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ul.bflist-icon-angle-right,\nul.bflist-icon-angle-right {\n border: none;\n}\n.cps-post-main ul.bflist-icon-angle-right li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-icon-angle-right"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
タイトル
<!-- wp:group {"style":{"color":{"text":"#76ced3"}}} -->
<div class="wp-block-group has-text-color" style="color:#76ced3"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-icon-angle-right","plusbfClassName":"bflist-icon-angle-right","plusbfStyle":"ul.bflist-icon-angle-right {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\n.cps-post-main ul.bflist-icon-angle-right li,\nul.bflist-icon-angle-right li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-icon-angle-right li:before,\n.bflist-icon-angle-right li:after {\n display: flex;\n position: absolute;\n left: 0;\n top: 0.25rem;\n width: 1rem;\n height: 1rem;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n}\n.bflist-icon-angle-right li:before {\n z-index: 1;\n font-family: \u0022font awesome 5 free\u0022;\n font-weight: 600;\n font-size: 0.75rem;\n content: \u0022\\f105\u0022;\n}\n.bflist-icon-angle-right li:after {\n z-index: 0;\n background: currentColor;\n opacity: 0.2;\n content: \u0022\u0022;\n}\n.has-background .bflist-icon-angle-right {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ul.bflist-icon-angle-right,\nul.bflist-icon-angle-right {\n border: none;\n}\n.cps-post-main ul.bflist-icon-angle-right li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-icon-angle-right"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
タイトル
<!-- wp:group {"style":{"color":{"text":"#60a7d6","background":"#f3f8fc"}}} -->
<div class="wp-block-group has-text-color has-background" style="background-color:#f3f8fc;color:#60a7d6"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-icon-angle-right","plusbfClassName":"bflist-icon-angle-right","plusbfStyle":"ul.bflist-icon-angle-right {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\n.cps-post-main ul.bflist-icon-angle-right li,\nul.bflist-icon-angle-right li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-icon-angle-right li:before,\n.bflist-icon-angle-right li:after {\n display: flex;\n position: absolute;\n left: 0;\n top: 0.25rem;\n width: 1rem;\n height: 1rem;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n}\n.bflist-icon-angle-right li:before {\n z-index: 1;\n font-family: \u0022font awesome 5 free\u0022;\n font-weight: 600;\n font-size: 0.75rem;\n content: \u0022\\f105\u0022;\n}\n.bflist-icon-angle-right li:after {\n z-index: 0;\n background: currentColor;\n opacity: 0.2;\n content: \u0022\u0022;\n}\n.has-background .bflist-icon-angle-right {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ul.bflist-icon-angle-right,\nul.bflist-icon-angle-right {\n border: none;\n}\n.cps-post-main ul.bflist-icon-angle-right li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-icon-angle-right"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
タイトル
<!-- wp:group {"style":{"color":{"text":"#76ced3","background":"#f4fbfc"}}} -->
<div class="wp-block-group has-text-color has-background" style="background-color:#f4fbfc;color:#76ced3"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-icon-angle-right","plusbfClassName":"bflist-icon-angle-right","plusbfStyle":"ul.bflist-icon-angle-right {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\n.cps-post-main ul.bflist-icon-angle-right li,\nul.bflist-icon-angle-right li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-icon-angle-right li:before,\n.bflist-icon-angle-right li:after {\n display: flex;\n position: absolute;\n left: 0;\n top: 0.25rem;\n width: 1rem;\n height: 1rem;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n}\n.bflist-icon-angle-right li:before {\n z-index: 1;\n font-family: \u0022font awesome 5 free\u0022;\n font-weight: 600;\n font-size: 0.75rem;\n content: \u0022\\f105\u0022;\n}\n.bflist-icon-angle-right li:after {\n z-index: 0;\n background: currentColor;\n opacity: 0.2;\n content: \u0022\u0022;\n}\n.has-background .bflist-icon-angle-right {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ul.bflist-icon-angle-right,\nul.bflist-icon-angle-right {\n border: none;\n}\n.cps-post-main ul.bflist-icon-angle-right li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-icon-angle-right"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
対応テーマ | SANGO・JIN・COCOON・THE SONIC |
③2重丸ver1
- サンプルテキストサンプルテキストサンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:list {"className":"bflist-double-circle","plusbfClassName":"bflist-double-circle","plusbfStyle":"ul.bflist-double-circle {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\n.cps-post-main ul.bflist-double-circle li,\nul.bflist-double-circle li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-double-circle li:before,\n.bflist-double-circle li:after {\n display: flex;\n position: absolute;\n justify-content: center;\n border-radius: 50%;\n background: currentColor;\n content: \u0022\u0022;\n}\n.bflist-double-circle li:before {\n z-index: 1;\n width: .5rem;\n height: .5rem;\n left: .25rem;\n top: 0.5rem;\n border: 4px solid;\n box-sizing: border-box;\n}\n.bflist-double-circle li:after {\n z-index: 0;\n opacity: 0.2;\n width: 1rem;\n height: 1rem;\n left: 0;\n top: 0.25rem;\n}\n.has-background .bflist-double-circle {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ul.bflist-double-circle,\nul.bflist-double-circle {\n border: none;\n}\n.cps-post-main ul.bflist-double-circle li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-double-circle"><li>サンプルテキストサンプルテキストサンプルテキスト</li><li>サンプルテキスト</li><li>サンプルテキスト</li></ul>
<!-- /wp:list -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#60a7d6"}}} -->
<div class="wp-block-group has-text-color" style="color:#60a7d6"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-double-circle","plusbfClassName":"bflist-double-circle","plusbfStyle":"ul.bflist-double-circle {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\n.cps-post-main ul.bflist-double-circle li,\nul.bflist-double-circle li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-double-circle li:before,\n.bflist-double-circle li:after {\n display: flex;\n position: absolute;\n justify-content: center;\n border-radius: 50%;\n background: currentColor;\n content: \u0022\u0022;\n}\n.bflist-double-circle li:before {\n z-index: 1;\n width: .5rem;\n height: .5rem;\n left: .25rem;\n top: 0.5rem;\n border: 4px solid;\n box-sizing: border-box;\n}\n.bflist-double-circle li:after {\n z-index: 0;\n opacity: 0.2;\n width: 1rem;\n height: 1rem;\n left: 0;\n top: 0.25rem;\n}\n.has-background .bflist-double-circle {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ul.bflist-double-circle,\nul.bflist-double-circle {\n border: none;\n}\n.cps-post-main ul.bflist-double-circle li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-double-circle"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#76ced3"}}} -->
<div class="wp-block-group has-text-color" style="color:#76ced3"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-double-circle","plusbfClassName":"bflist-double-circle","plusbfStyle":"ul.bflist-double-circle {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\n.cps-post-main ul.bflist-double-circle li,\nul.bflist-double-circle li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-double-circle li:before,\n.bflist-double-circle li:after {\n display: flex;\n position: absolute;\n justify-content: center;\n border-radius: 50%;\n background: currentColor;\n content: \u0022\u0022;\n}\n.bflist-double-circle li:before {\n z-index: 1;\n width: .5rem;\n height: .5rem;\n left: .25rem;\n top: 0.5rem;\n border: 4px solid;\n box-sizing: border-box;\n}\n.bflist-double-circle li:after {\n z-index: 0;\n opacity: 0.2;\n width: 1rem;\n height: 1rem;\n left: 0;\n top: 0.25rem;\n}\n.has-background .bflist-double-circle {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ul.bflist-double-circle,\nul.bflist-double-circle {\n border: none;\n}\n.cps-post-main ul.bflist-double-circle li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-double-circle"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#60a7d6","background":"#f3f8fc"}}} -->
<div class="wp-block-group has-text-color has-background" style="background-color:#f3f8fc;color:#60a7d6"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-double-circle","plusbfClassName":"bflist-double-circle","plusbfStyle":"ul.bflist-double-circle {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\n.cps-post-main ul.bflist-double-circle li,\nul.bflist-double-circle li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-double-circle li:before,\n.bflist-double-circle li:after {\n display: flex;\n position: absolute;\n justify-content: center;\n border-radius: 50%;\n background: currentColor;\n content: \u0022\u0022;\n}\n.bflist-double-circle li:before {\n z-index: 1;\n width: .5rem;\n height: .5rem;\n left: .25rem;\n top: 0.5rem;\n border: 4px solid;\n box-sizing: border-box;\n}\n.bflist-double-circle li:after {\n z-index: 0;\n opacity: 0.2;\n width: 1rem;\n height: 1rem;\n left: 0;\n top: 0.25rem;\n}\n.has-background .bflist-double-circle {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ul.bflist-double-circle,\nul.bflist-double-circle {\n border: none;\n}\n.cps-post-main ul.bflist-double-circle li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-double-circle"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#76ced3","background":"#f4fbfc"}}} -->
<div class="wp-block-group has-text-color has-background" style="background-color:#f4fbfc;color:#76ced3"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-double-circle","plusbfClassName":"bflist-double-circle","plusbfStyle":"ul.bflist-double-circle {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\n.cps-post-main ul.bflist-double-circle li,\nul.bflist-double-circle li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-double-circle li:before,\n.bflist-double-circle li:after {\n display: flex;\n position: absolute;\n justify-content: center;\n border-radius: 50%;\n background: currentColor;\n content: \u0022\u0022;\n}\n.bflist-double-circle li:before {\n z-index: 1;\n width: .5rem;\n height: .5rem;\n left: .25rem;\n top: 0.5rem;\n border: 4px solid;\n box-sizing: border-box;\n}\n.bflist-double-circle li:after {\n z-index: 0;\n opacity: 0.2;\n width: 1rem;\n height: 1rem;\n left: 0;\n top: 0.25rem;\n}\n.has-background .bflist-double-circle {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ul.bflist-double-circle,\nul.bflist-double-circle {\n border: none;\n}\n.cps-post-main ul.bflist-double-circle li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-double-circle"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
対応テーマ | SANGO・JIN・COCOON・THE SONIC |
④2重丸ver2
- サンプルテキストサンプルテキストサンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:list {"className":"bflist-double-circle2","plusbfClassName":"bflist-double-circle2","plusbfStyle":"ul.bflist-double-circle2 {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\n.cps-post-main ul.bflist-double-circle2 li,\nul.bflist-double-circle2 li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-double-circle2 li:before,\n.bflist-double-circle2 li:after {\n display: flex;\n position: absolute;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n content: \u0022\u0022;\n}\n.bflist-double-circle2 li:before {\n z-index: 1;\n width: .5rem;\n height: .5rem;\n left: .25rem;\n top: 0.5rem;\n border: 1px solid;\n box-sizing: border-box;\n}\n.bflist-double-circle2 li:after {\n z-index: 0;\n opacity: 0.2;\n width: 1rem;\n height: 1rem;\n left: 0;\n top: 0.25rem;\n background: currentColor;\n}\n.has-background .bflist-double-circle2 {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ul.bflist-double-circle2,\nul.bflist-double-circle2 {\n border: none;\n}\n.cps-post-main ul.bflist-double-circle2 li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-double-circle2"><li>サンプルテキストサンプルテキストサンプルテキスト</li><li>サンプルテキスト</li><li>サンプルテキスト</li></ul>
<!-- /wp:list -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#60a7d6"}}} -->
<div class="wp-block-group has-text-color" style="color:#60a7d6"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-double-circle2","plusbfClassName":"bflist-double-circle2","plusbfStyle":"ul.bflist-double-circle2 {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\n.cps-post-main ul.bflist-double-circle2 li,\nul.bflist-double-circle2 li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-double-circle2 li:before,\n.bflist-double-circle2 li:after {\n display: flex;\n position: absolute;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n content: \u0022\u0022;\n}\n.bflist-double-circle2 li:before {\n z-index: 1;\n width: .5rem;\n height: .5rem;\n left: .25rem;\n top: 0.5rem;\n border: 1px solid;\n box-sizing: border-box;\n}\n.bflist-double-circle2 li:after {\n z-index: 0;\n opacity: 0.2;\n width: 1rem;\n height: 1rem;\n left: 0;\n top: 0.25rem;\n background: currentColor;\n}\n.has-background .bflist-double-circle2 {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ul.bflist-double-circle2,\nul.bflist-double-circle2 {\n border: none;\n}\n.cps-post-main ul.bflist-double-circle2 li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-double-circle2"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#76ced3"}}} -->
<div class="wp-block-group has-text-color" style="color:#76ced3"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-double-circle2","plusbfClassName":"bflist-double-circle2","plusbfStyle":"ul.bflist-double-circle2 {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\n.cps-post-main ul.bflist-double-circle2 li,\nul.bflist-double-circle2 li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-double-circle2 li:before,\n.bflist-double-circle2 li:after {\n display: flex;\n position: absolute;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n content: \u0022\u0022;\n}\n.bflist-double-circle2 li:before {\n z-index: 1;\n width: .5rem;\n height: .5rem;\n left: .25rem;\n top: 0.5rem;\n border: 1px solid;\n box-sizing: border-box;\n}\n.bflist-double-circle2 li:after {\n z-index: 0;\n opacity: 0.2;\n width: 1rem;\n height: 1rem;\n left: 0;\n top: 0.25rem;\n background: currentColor;\n}\n.has-background .bflist-double-circle2 {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ul.bflist-double-circle2,\nul.bflist-double-circle2 {\n border: none;\n}\n.cps-post-main ul.bflist-double-circle2 li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-double-circle2"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#60a7d6","background":"#f3f8fc"}}} -->
<div class="wp-block-group has-text-color has-background" style="background-color:#f3f8fc;color:#60a7d6"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-double-circle2","plusbfClassName":"bflist-double-circle2","plusbfStyle":"ul.bflist-double-circle2 {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\n.cps-post-main ul.bflist-double-circle2 li,\nul.bflist-double-circle2 li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-double-circle2 li:before,\n.bflist-double-circle2 li:after {\n display: flex;\n position: absolute;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n content: \u0022\u0022;\n}\n.bflist-double-circle2 li:before {\n z-index: 1;\n width: .5rem;\n height: .5rem;\n left: .25rem;\n top: 0.5rem;\n border: 1px solid;\n box-sizing: border-box;\n}\n.bflist-double-circle2 li:after {\n z-index: 0;\n opacity: 0.2;\n width: 1rem;\n height: 1rem;\n left: 0;\n top: 0.25rem;\n background: currentColor;\n}\n.has-background .bflist-double-circle2 {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ul.bflist-double-circle2,\nul.bflist-double-circle2 {\n border: none;\n}\n.cps-post-main ul.bflist-double-circle2 li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-double-circle2"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#76ced3","background":"#f4fbfc"}}} -->
<div class="wp-block-group has-text-color has-background" style="background-color:#f4fbfc;color:#76ced3"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-double-circle2","plusbfClassName":"bflist-double-circle2","plusbfStyle":"ul.bflist-double-circle2 {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\n.cps-post-main ul.bflist-double-circle2 li,\nul.bflist-double-circle2 li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-double-circle2 li:before,\n.bflist-double-circle2 li:after {\n display: flex;\n position: absolute;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n content: \u0022\u0022;\n}\n.bflist-double-circle2 li:before {\n z-index: 1;\n width: .5rem;\n height: .5rem;\n left: .25rem;\n top: 0.5rem;\n border: 1px solid;\n box-sizing: border-box;\n}\n.bflist-double-circle2 li:after {\n z-index: 0;\n opacity: 0.2;\n width: 1rem;\n height: 1rem;\n left: 0;\n top: 0.25rem;\n background: currentColor;\n}\n.has-background .bflist-double-circle2 {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ul.bflist-double-circle2,\nul.bflist-double-circle2 {\n border: none;\n}\n.cps-post-main ul.bflist-double-circle2 li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-double-circle2"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
対応テーマ | SANGO・JIN・COCOON・THE SONIC |
⑤下線
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#60a7d6"}}} -->
<div class="wp-block-group has-text-color" style="color:#60a7d6"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-circle-underline","plusbfClassName":"bflist-circle-underline","plusbfStyle":"ul.bflist-circle-underline {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\n.cps-post-main ul.bflist-circle-underline li,\nul.bflist-circle-underline li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 0;\n padding: 4px;\n padding-left: 25px;\n}\nul.bflist-circle-underline li:not(:last-child) {\n border-bottom: 1px dashed #eee;\n}\n.has-background ul.bflist-circle-underline li:not(:last-child) {\n border-bottom: 1px dashed;\n}\n.bflist-circle-underline li:before {\n display: flex;\n position: absolute;\n left: 0.25rem;\n z-index: 1;\n width: 0.5rem;\n height: 0.5rem;\n justify-content: center;\n align-items: center;\n border: 4px solid;\n border-radius: 50%;\n content: \u0022\u0022;\n box-sizing: border-box;\n}\n.has-background .bflist-circle-underline {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ul.bflist-circle-underline,\nul.bflist-circle-underline {\n border: none;\n}\n.cps-post-main ul.bflist-circle-underline li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-circle-underline"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#76ced3"}}} -->
<div class="wp-block-group has-text-color" style="color:#76ced3"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-circle-underline","plusbfClassName":"bflist-circle-underline","plusbfStyle":"ul.bflist-circle-underline {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\n.cps-post-main ul.bflist-circle-underline li,\nul.bflist-circle-underline li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 0;\n padding: 4px;\n padding-left: 25px;\n}\nul.bflist-circle-underline li:not(:last-child) {\n border-bottom: 1px dashed #eee;\n}\n.has-background ul.bflist-circle-underline li:not(:last-child) {\n border-bottom: 1px dashed;\n}\n.bflist-circle-underline li:before {\n display: flex;\n position: absolute;\n left: 0.25rem;\n z-index: 1;\n width: 0.5rem;\n height: 0.5rem;\n justify-content: center;\n align-items: center;\n border: 4px solid;\n border-radius: 50%;\n content: \u0022\u0022;\n box-sizing: border-box;\n}\n.has-background .bflist-circle-underline {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ul.bflist-circle-underline,\nul.bflist-circle-underline {\n border: none;\n}\n.cps-post-main ul.bflist-circle-underline li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-circle-underline"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#60a7d6","background":"#f3f8fc"}}} -->
<div class="wp-block-group has-text-color has-background" style="background-color:#f3f8fc;color:#60a7d6"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-circle-underline","plusbfClassName":"bflist-circle-underline","plusbfStyle":"ul.bflist-circle-underline {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\n.cps-post-main ul.bflist-circle-underline li,\nul.bflist-circle-underline li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 0;\n padding: 4px;\n padding-left: 25px;\n}\nul.bflist-circle-underline li:not(:last-child) {\n border-bottom: 1px dashed #eee;\n}\n.has-background ul.bflist-circle-underline li:not(:last-child) {\n border-bottom: 1px dashed;\n}\n.bflist-circle-underline li:before {\n display: flex;\n position: absolute;\n left: 0.25rem;\n z-index: 1;\n width: 0.5rem;\n height: 0.5rem;\n justify-content: center;\n align-items: center;\n border: 4px solid;\n border-radius: 50%;\n content: \u0022\u0022;\n box-sizing: border-box;\n}\n.has-background .bflist-circle-underline {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ul.bflist-circle-underline,\nul.bflist-circle-underline {\n border: none;\n}\n.cps-post-main ul.bflist-circle-underline li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-circle-underline"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#76ced3","background":"#f4fbfc"}}} -->
<div class="wp-block-group has-text-color has-background" style="background-color:#f4fbfc;color:#76ced3"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-circle-underline","plusbfClassName":"bflist-circle-underline","plusbfStyle":"ul.bflist-circle-underline {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\n.cps-post-main ul.bflist-circle-underline li,\nul.bflist-circle-underline li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 0;\n padding: 4px;\n padding-left: 25px;\n}\nul.bflist-circle-underline li:not(:last-child) {\n border-bottom: 1px dashed #eee;\n}\n.has-background ul.bflist-circle-underline li:not(:last-child) {\n border-bottom: 1px dashed;\n}\n.bflist-circle-underline li:before {\n display: flex;\n position: absolute;\n left: 0.25rem;\n z-index: 1;\n width: 0.5rem;\n height: 0.5rem;\n justify-content: center;\n align-items: center;\n border: 4px solid;\n border-radius: 50%;\n content: \u0022\u0022;\n box-sizing: border-box;\n}\n.has-background .bflist-circle-underline {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ul.bflist-circle-underline,\nul.bflist-circle-underline {\n border: none;\n}\n.cps-post-main ul.bflist-circle-underline li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-circle-underline"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
対応テーマ | SANGO・JIN・COCOON・THE SONIC |
ナンバー
①丸
- サンプルテキストサンプルテキストサンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:list {"ordered":true,"className":"bflist-num-circle","plusbfClassName":"bflist-num-circle","plusbfStyle":"ol.bflist-num-circle {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n counter-reset: num;\n}\n.cps-post-main ol.bflist-num-circle li,\nol.bflist-num-circle li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-num-circle li:before,\n.bflist-num-circle li:after {\n display: flex;\n position: absolute;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n top: 0.125rem;\n}\n.bflist-num-circle li:before {\n left: 0;\n z-index: 1;\n width: 1.25rem;\n height: 1.25rem;\n color: #fff;\n font-size: 0.75rem;\n content: counter(num)\u0022\u0022;\n counter-increment: num;\n box-sizing: border-box;\n}\n.bflist-num-circle li:after {\n left: 0;\n z-index: 0;\n width: 1.25rem;\n height: 1.25rem;\n background: currentColor;\n content: \u0022\u0022;\n}\n.has-background .bflist-num-circle {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ol.bflist-num-circle,\nol.bflist-num-circle {\n border: none;\n}\n.cps-post-main ol.bflist-num-circle li:before {\n background-color: transparent!important;\n}"} -->
<ol class="bflist-num-circle"><li>サンプルテキストサンプルテキストサンプルテキスト</li><li>サンプルテキスト</li><li>サンプルテキスト</li></ol>
<!-- /wp:list -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#60a7d6"}}} -->
<div class="wp-block-group has-text-color" style="color:#60a7d6"><div class="wp-block-group__inner-container"><!-- wp:list {"ordered":true,"className":"bflist-num-circle","plusbfClassName":"bflist-num-circle","plusbfStyle":"ol.bflist-num-circle {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n counter-reset: num;\n}\n.cps-post-main ol.bflist-num-circle li,\nol.bflist-num-circle li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-num-circle li:before,\n.bflist-num-circle li:after {\n display: flex;\n position: absolute;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n top: 0.125rem;\n}\n.bflist-num-circle li:before {\n left: 0;\n z-index: 1;\n width: 1.25rem;\n height: 1.25rem;\n color: #fff;\n font-size: 0.75rem;\n content: counter(num)\u0022\u0022;\n counter-increment: num;\n box-sizing: border-box;\n}\n.bflist-num-circle li:after {\n left: 0;\n z-index: 0;\n width: 1.25rem;\n height: 1.25rem;\n background: currentColor;\n content: \u0022\u0022;\n}\n.has-background .bflist-num-circle {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ol.bflist-num-circle,\nol.bflist-num-circle {\n border: none;\n}\n.cps-post-main ol.bflist-num-circle li:before {\n background-color: transparent!important;\n}"} -->
<ol class="bflist-num-circle"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ol>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#76ced3"}}} -->
<div class="wp-block-group has-text-color" style="color:#76ced3"><div class="wp-block-group__inner-container"><!-- wp:list {"ordered":true,"className":"bflist-num-circle","plusbfClassName":"bflist-num-circle","plusbfStyle":"ol.bflist-num-circle {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n counter-reset: num;\n}\n.cps-post-main ol.bflist-num-circle li,\nol.bflist-num-circle li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-num-circle li:before,\n.bflist-num-circle li:after {\n display: flex;\n position: absolute;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n top: 0.125rem;\n}\n.bflist-num-circle li:before {\n left: 0;\n z-index: 1;\n width: 1.25rem;\n height: 1.25rem;\n color: #fff;\n font-size: 0.75rem;\n content: counter(num)\u0022\u0022;\n counter-increment: num;\n box-sizing: border-box;\n}\n.bflist-num-circle li:after {\n left: 0;\n z-index: 0;\n width: 1.25rem;\n height: 1.25rem;\n background: currentColor;\n content: \u0022\u0022;\n}\n.has-background .bflist-num-circle {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ol.bflist-num-circle,\nol.bflist-num-circle {\n border: none;\n}\n.cps-post-main ol.bflist-num-circle li:before {\n background-color: transparent!important;\n}"} -->
<ol class="bflist-num-circle"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ol>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#60a7d6","background":"#f3f8fc"}}} -->
<div class="wp-block-group has-text-color has-background" style="background-color:#f3f8fc;color:#60a7d6"><div class="wp-block-group__inner-container"><!-- wp:list {"ordered":true,"className":"bflist-num-circle","plusbfClassName":"bflist-num-circle","plusbfStyle":"ol.bflist-num-circle {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n counter-reset: num;\n}\n.cps-post-main ol.bflist-num-circle li,\nol.bflist-num-circle li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-num-circle li:before,\n.bflist-num-circle li:after {\n display: flex;\n position: absolute;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n top: 0.125rem;\n}\n.bflist-num-circle li:before {\n left: 0;\n z-index: 1;\n width: 1.25rem;\n height: 1.25rem;\n color: #fff;\n font-size: 0.75rem;\n content: counter(num)\u0022\u0022;\n counter-increment: num;\n box-sizing: border-box;\n}\n.bflist-num-circle li:after {\n left: 0;\n z-index: 0;\n width: 1.25rem;\n height: 1.25rem;\n background: currentColor;\n content: \u0022\u0022;\n}\n.has-background .bflist-num-circle {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ol.bflist-num-circle,\nol.bflist-num-circle {\n border: none;\n}\n.cps-post-main ol.bflist-num-circle li:before {\n background-color: transparent!important;\n}"} -->
<ol class="bflist-num-circle"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ol>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#76ced3","background":"#f4fbfc"}}} -->
<div class="wp-block-group has-text-color has-background" style="background-color:#f4fbfc;color:#76ced3"><div class="wp-block-group__inner-container"><!-- wp:list {"ordered":true,"className":"bflist-num-circle","plusbfClassName":"bflist-num-circle","plusbfStyle":"ol.bflist-num-circle {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n counter-reset: num;\n}\n.cps-post-main ol.bflist-num-circle li,\nol.bflist-num-circle li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-num-circle li:before,\n.bflist-num-circle li:after {\n display: flex;\n position: absolute;\n justify-content: center;\n align-items: center;\n border-radius: 50%;\n top: 0.125rem;\n}\n.bflist-num-circle li:before {\n left: 0;\n z-index: 1;\n width: 1.25rem;\n height: 1.25rem;\n color: #fff;\n font-size: 0.75rem;\n content: counter(num)\u0022\u0022;\n counter-increment: num;\n box-sizing: border-box;\n}\n.bflist-num-circle li:after {\n left: 0;\n z-index: 0;\n width: 1.25rem;\n height: 1.25rem;\n background: currentColor;\n content: \u0022\u0022;\n}\n.has-background .bflist-num-circle {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ol.bflist-num-circle,\nol.bflist-num-circle {\n border: none;\n}\n.cps-post-main ol.bflist-num-circle li:before {\n background-color: transparent!important;\n}"} -->
<ol class="bflist-num-circle"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ol>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
対応テーマ | SANGO・COCOON・THE SONIC |
men
JINの場合はもともと似たようなやつがあります♪
②横線
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:list {"ordered":true,"className":"bflist-num-rightborder","plusbfClassName":"bflist-num-rightborder","plusbfStyle":"ol.bflist-num-rightborder {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n counter-reset: num;\n list-style-type: none;\n}\n.cps-post-main ol.bflist-num-rightborder li,\nol.bflist-num-rightborder li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 0.5rem 0;\n padding-left: 1.75rem;\n}\n.cps-post-main ol.bflist-num-rightborder li:before,\n.bflist-num-rightborder li:before {\n display: flex;\n position: absolute;\n left: 0;\n z-index: 1;\n width: 1.25rem;\n height: 1.25rem;\n align-items: center;\n border-right: 2px solid;\n border-radius: 0;\n content: counter(num)\u0022\u0022;\n counter-increment: num;\n box-sizing: border-box;\n}\n.has-background .bflist-num-rightborder {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ol.bflist-num-rightborder,\nol.bflist-num-rightborder {\n border: none;\n}\n.cps-post-main ol.bflist-num-rightborder li:before {\n background-color: transparent!important;\n}"} -->
<ol class="bflist-num-rightborder"><li>サンプルテキスト</li><li>サンプルテキスト</li><li>サンプルテキスト</li></ol>
<!-- /wp:list -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#60a7d6"}}} -->
<div class="wp-block-group has-text-color" style="color:#60a7d6"><div class="wp-block-group__inner-container"><!-- wp:list {"ordered":true,"className":"bflist-num-rightborder","plusbfClassName":"bflist-num-rightborder","plusbfStyle":"ol.bflist-num-rightborder {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n counter-reset: num;\n list-style-type: none;\n}\n.cps-post-main ol.bflist-num-rightborder li,\nol.bflist-num-rightborder li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 0.5rem 0;\n padding-left: 1.75rem;\n}\n.cps-post-main ol.bflist-num-rightborder li:before,\n.bflist-num-rightborder li:before {\n display: flex;\n position: absolute;\n left: 0;\n z-index: 1;\n width: 1.25rem;\n height: 1.25rem;\n align-items: center;\n border-right: 2px solid;\n border-radius: 0;\n content: counter(num)\u0022\u0022;\n counter-increment: num;\n box-sizing: border-box;\n}\n.has-background .bflist-num-rightborder {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ol.bflist-num-rightborder,\nol.bflist-num-rightborder {\n border: none;\n}\n.cps-post-main ol.bflist-num-rightborder li:before {\n background-color: transparent!important;\n}"} -->
<ol class="bflist-num-rightborder"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ol>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#76ced3"}}} -->
<div class="wp-block-group has-text-color" style="color:#76ced3"><div class="wp-block-group__inner-container"><!-- wp:list {"ordered":true,"className":"bflist-num-rightborder","plusbfClassName":"bflist-num-rightborder","plusbfStyle":"ol.bflist-num-rightborder {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n counter-reset: num;\n list-style-type: none;\n}\n.cps-post-main ol.bflist-num-rightborder li,\nol.bflist-num-rightborder li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 0.5rem 0;\n padding-left: 1.75rem;\n}\n.cps-post-main ol.bflist-num-rightborder li:before,\n.bflist-num-rightborder li:before {\n display: flex;\n position: absolute;\n left: 0;\n z-index: 1;\n width: 1.25rem;\n height: 1.25rem;\n align-items: center;\n border-right: 2px solid;\n border-radius: 0;\n content: counter(num)\u0022\u0022;\n counter-increment: num;\n box-sizing: border-box;\n}\n.has-background .bflist-num-rightborder {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ol.bflist-num-rightborder,\nol.bflist-num-rightborder {\n border: none;\n}\n.cps-post-main ol.bflist-num-rightborder li:before {\n background-color: transparent!important;\n}"} -->
<ol class="bflist-num-rightborder"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ol>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#60a7d6","background":"#f3f8fc"}}} -->
<div class="wp-block-group has-text-color has-background" style="background-color:#f3f8fc;color:#60a7d6"><div class="wp-block-group__inner-container"><!-- wp:list {"ordered":true,"className":"bflist-num-rightborder","plusbfClassName":"bflist-num-rightborder","plusbfStyle":"ol.bflist-num-rightborder {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n counter-reset: num;\n list-style-type: none;\n}\n.cps-post-main ol.bflist-num-rightborder li,\nol.bflist-num-rightborder li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 0.5rem 0;\n padding-left: 1.75rem;\n}\n.cps-post-main ol.bflist-num-rightborder li:before,\n.bflist-num-rightborder li:before {\n display: flex;\n position: absolute;\n left: 0;\n z-index: 1;\n width: 1.25rem;\n height: 1.25rem;\n align-items: center;\n border-right: 2px solid;\n border-radius: 0;\n content: counter(num)\u0022\u0022;\n counter-increment: num;\n box-sizing: border-box;\n}\n.has-background .bflist-num-rightborder {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ol.bflist-num-rightborder,\nol.bflist-num-rightborder {\n border: none;\n}\n.cps-post-main ol.bflist-num-rightborder li:before {\n background-color: transparent!important;\n}"} -->
<ol class="bflist-num-rightborder"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ol>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#76ced3","background":"#f4fbfc"}}} -->
<div class="wp-block-group has-text-color has-background" style="background-color:#f4fbfc;color:#76ced3"><div class="wp-block-group__inner-container"><!-- wp:list {"ordered":true,"className":"bflist-num-rightborder","plusbfClassName":"bflist-num-rightborder","plusbfStyle":"ol.bflist-num-rightborder {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n counter-reset: num;\n list-style-type: none;\n}\n.cps-post-main ol.bflist-num-rightborder li,\nol.bflist-num-rightborder li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 0.5rem 0;\n padding-left: 1.75rem;\n}\n.cps-post-main ol.bflist-num-rightborder li:before,\n.bflist-num-rightborder li:before {\n display: flex;\n position: absolute;\n left: 0;\n z-index: 1;\n width: 1.25rem;\n height: 1.25rem;\n align-items: center;\n border-right: 2px solid;\n border-radius: 0;\n content: counter(num)\u0022\u0022;\n counter-increment: num;\n box-sizing: border-box;\n}\n.has-background .bflist-num-rightborder {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ol.bflist-num-rightborder,\nol.bflist-num-rightborder {\n border: none;\n}\n.cps-post-main ol.bflist-num-rightborder li:before {\n background-color: transparent!important;\n}"} -->
<ol class="bflist-num-rightborder"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ol>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
対応テーマ | SANGO・JIN・COCOON・THE SONIC |
③四角
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:list {"ordered":true,"className":"bflist-num-square","plusbfClassName":"bflist-num-square","plusbfStyle":"ol.bflist-num-square {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n counter-reset: num;\n}\n.cps-post-main ol.bflist-num-square li,\nol.bflist-num-square li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-num-square li:before,\n.bflist-num-square li:after {\n display: flex;\n position: absolute;\n justify-content: center;\n align-items: center;\n top: 0.125rem;\n}\n.bflist-num-square li:before {\n left: 0;\n z-index: 1;\n width: 1.25rem;\n height: 1.25rem;\n font-size: 0.75rem;\n content: counter(num)\u0022\u0022;\n counter-increment: num;\n box-sizing: border-box;\n}\n.bflist-num-square li:after {\n left: 0;\n z-index: 0;\n width: 1.25rem;\n height: 1.25rem;\n background: currentColor;\n content: \u0022\u0022;\n opacity: .2;\n}\n.has-background .bflist-num-square {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ol.bflist-num-square,\nol.bflist-num-square {\n border: none;\n}\n.cps-post-main ol.bflist-num-square li:before {\n background-color: transparent!important;\n}"} -->
<ol class="bflist-num-square"><li>サンプルテキスト</li><li>サンプルテキスト</li><li>サンプルテキスト</li></ol>
<!-- /wp:list -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#60a7d6"}}} -->
<div class="wp-block-group has-text-color" style="color:#60a7d6"><div class="wp-block-group__inner-container"><!-- wp:list {"ordered":true,"className":"bflist-num-square","plusbfClassName":"bflist-num-square","plusbfStyle":"ol.bflist-num-square {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n counter-reset: num;\n}\n.cps-post-main ol.bflist-num-square li,\nol.bflist-num-square li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-num-square li:before,\n.bflist-num-square li:after {\n display: flex;\n position: absolute;\n justify-content: center;\n align-items: center;\n top: 0.125rem;\n}\n.bflist-num-square li:before {\n left: 0;\n z-index: 1;\n width: 1.25rem;\n height: 1.25rem;\n font-size: 0.75rem;\n content: counter(num)\u0022\u0022;\n counter-increment: num;\n box-sizing: border-box;\n}\n.bflist-num-square li:after {\n left: 0;\n z-index: 0;\n width: 1.25rem;\n height: 1.25rem;\n background: currentColor;\n content: \u0022\u0022;\n opacity: .2;\n}\n.has-background .bflist-num-square {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ol.bflist-num-square,\nol.bflist-num-square {\n border: none;\n}\n.cps-post-main ol.bflist-num-square li:before {\n background-color: transparent!important;\n}"} -->
<ol class="bflist-num-square"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ol>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#76ced3"}}} -->
<div class="wp-block-group has-text-color" style="color:#76ced3"><div class="wp-block-group__inner-container"><!-- wp:list {"ordered":true,"className":"bflist-num-square","plusbfClassName":"bflist-num-square","plusbfStyle":"ol.bflist-num-square {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n counter-reset: num;\n}\n.cps-post-main ol.bflist-num-square li,\nol.bflist-num-square li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-num-square li:before,\n.bflist-num-square li:after {\n display: flex;\n position: absolute;\n justify-content: center;\n align-items: center;\n top: 0.125rem;\n}\n.bflist-num-square li:before {\n left: 0;\n z-index: 1;\n width: 1.25rem;\n height: 1.25rem;\n font-size: 0.75rem;\n content: counter(num)\u0022\u0022;\n counter-increment: num;\n box-sizing: border-box;\n}\n.bflist-num-square li:after {\n left: 0;\n z-index: 0;\n width: 1.25rem;\n height: 1.25rem;\n background: currentColor;\n content: \u0022\u0022;\n opacity: .2;\n}\n.has-background .bflist-num-square {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ol.bflist-num-square,\nol.bflist-num-square {\n border: none;\n}\n.cps-post-main ol.bflist-num-square li:before {\n background-color: transparent!important;\n}"} -->
<ol class="bflist-num-square"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ol>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#60a7d6","background":"#f3f8fc"}}} -->
<div class="wp-block-group has-text-color has-background" style="background-color:#f3f8fc;color:#60a7d6"><div class="wp-block-group__inner-container"><!-- wp:list {"ordered":true,"className":"bflist-num-square","plusbfClassName":"bflist-num-square","plusbfStyle":"ol.bflist-num-square {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n counter-reset: num;\n}\n.cps-post-main ol.bflist-num-square li,\nol.bflist-num-square li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-num-square li:before,\n.bflist-num-square li:after {\n display: flex;\n position: absolute;\n justify-content: center;\n align-items: center;\n top: 0.125rem;\n}\n.bflist-num-square li:before {\n left: 0;\n z-index: 1;\n width: 1.25rem;\n height: 1.25rem;\n font-size: 0.75rem;\n content: counter(num)\u0022\u0022;\n counter-increment: num;\n box-sizing: border-box;\n}\n.bflist-num-square li:after {\n left: 0;\n z-index: 0;\n width: 1.25rem;\n height: 1.25rem;\n background: currentColor;\n content: \u0022\u0022;\n opacity: .2;\n}\n.has-background .bflist-num-square {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ol.bflist-num-square,\nol.bflist-num-square {\n border: none;\n}\n.cps-post-main ol.bflist-num-square li:before {\n background-color: transparent!important;\n}"} -->
<ol class="bflist-num-square"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ol>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#76ced3","background":"#f4fbfc"}}} -->
<div class="wp-block-group has-text-color has-background" style="background-color:#f4fbfc;color:#76ced3"><div class="wp-block-group__inner-container"><!-- wp:list {"ordered":true,"className":"bflist-num-square","plusbfClassName":"bflist-num-square","plusbfStyle":"ol.bflist-num-square {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n counter-reset: num;\n}\n.cps-post-main ol.bflist-num-square li,\nol.bflist-num-square li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-num-square li:before,\n.bflist-num-square li:after {\n display: flex;\n position: absolute;\n justify-content: center;\n align-items: center;\n top: 0.125rem;\n}\n.bflist-num-square li:before {\n left: 0;\n z-index: 1;\n width: 1.25rem;\n height: 1.25rem;\n font-size: 0.75rem;\n content: counter(num)\u0022\u0022;\n counter-increment: num;\n box-sizing: border-box;\n}\n.bflist-num-square li:after {\n left: 0;\n z-index: 0;\n width: 1.25rem;\n height: 1.25rem;\n background: currentColor;\n content: \u0022\u0022;\n opacity: .2;\n}\n.has-background .bflist-num-square {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ol.bflist-num-square,\nol.bflist-num-square {\n border: none;\n}\n.cps-post-main ol.bflist-num-square li:before {\n background-color: transparent!important;\n}"} -->
<ol class="bflist-num-square"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ol>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
対応テーマ | SANGO・COCOON・THE SONIC |
④三角
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:list {"ordered":true,"className":"bflist-num-triangle","plusbfClassName":"bflist-num-triangle","plusbfStyle":"ol.bflist-num-triangle {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n counter-reset: num;\n}\n.cps-post-main ol.bflist-num-triangle li,\nol.bflist-num-triangle li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-num-triangle li:before,\n.bflist-num-triangle li:after {\n display: flex;\n position: absolute;\n justify-content: center;\n align-items: center;\n top: 0.125rem;\n}\n.bflist-num-triangle li:before {\n left: 0;\n z-index: 1;\n width: 1.25rem;\n height: 1.25rem;\n font-size: 0.75rem;\n content: counter(num)\u0022\u0022;\n counter-increment: num;\n box-sizing: border-box;\n}\n.bflist-num-triangle li:after {\n left: 0;\n z-index: 0;\n width: 1.25rem;\n height: 1.25rem;\n border-left: 0.625rem solid transparent;\n border-top: 0.625rem solid transparent;\n border-bottom: 0.625rem solid currentColor;\n border-right: 0.625rem solid currentColor;\n content: \u0022\u0022;\n opacity: .2;\n box-sizing: border-box;\n}\n.has-background .bflist-num-triangle {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ol.bflist-num-triangle,\nol.bflist-num-triangle {\n border: none;\n}\n.cps-post-main ol.bflist-num-triangle li:before {\n background-color: transparent!important;\n}"} -->
<ol class="bflist-num-triangle"><li>サンプルテキスト</li><li>サンプルテキスト</li><li>サンプルテキスト</li></ol>
<!-- /wp:list -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#60a7d6"}}} -->
<div class="wp-block-group has-text-color" style="color:#60a7d6"><div class="wp-block-group__inner-container"><!-- wp:list {"ordered":true,"className":"bflist-num-triangle","plusbfClassName":"bflist-num-triangle","plusbfStyle":"ol.bflist-num-triangle {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n counter-reset: num;\n}\n.cps-post-main ol.bflist-num-triangle li,\nol.bflist-num-triangle li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-num-triangle li:before,\n.bflist-num-triangle li:after {\n display: flex;\n position: absolute;\n justify-content: center;\n align-items: center;\n top: 0.125rem;\n}\n.bflist-num-triangle li:before {\n left: 0;\n z-index: 1;\n width: 1.25rem;\n height: 1.25rem;\n font-size: 0.75rem;\n content: counter(num)\u0022\u0022;\n counter-increment: num;\n box-sizing: border-box;\n}\n.bflist-num-triangle li:after {\n left: 0;\n z-index: 0;\n width: 1.25rem;\n height: 1.25rem;\n border-left: 0.625rem solid transparent;\n border-top: 0.625rem solid transparent;\n border-bottom: 0.625rem solid currentColor;\n border-right: 0.625rem solid currentColor;\n content: \u0022\u0022;\n opacity: .2;\n box-sizing: border-box;\n}\n.has-background .bflist-num-triangle {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ol.bflist-num-triangle,\nol.bflist-num-triangle {\n border: none;\n}\n.cps-post-main ol.bflist-num-triangle li:before {\n background-color: transparent!important;\n}"} -->
<ol class="bflist-num-triangle"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ol>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#76ced3"}}} -->
<div class="wp-block-group has-text-color" style="color:#76ced3"><div class="wp-block-group__inner-container"><!-- wp:list {"ordered":true,"className":"bflist-num-triangle","plusbfClassName":"bflist-num-triangle","plusbfStyle":"ol.bflist-num-triangle {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n counter-reset: num;\n}\n.cps-post-main ol.bflist-num-triangle li,\nol.bflist-num-triangle li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-num-triangle li:before,\n.bflist-num-triangle li:after {\n display: flex;\n position: absolute;\n justify-content: center;\n align-items: center;\n top: 0.125rem;\n}\n.bflist-num-triangle li:before {\n left: 0;\n z-index: 1;\n width: 1.25rem;\n height: 1.25rem;\n font-size: 0.75rem;\n content: counter(num)\u0022\u0022;\n counter-increment: num;\n box-sizing: border-box;\n}\n.bflist-num-triangle li:after {\n left: 0;\n z-index: 0;\n width: 1.25rem;\n height: 1.25rem;\n border-left: 0.625rem solid transparent;\n border-top: 0.625rem solid transparent;\n border-bottom: 0.625rem solid currentColor;\n border-right: 0.625rem solid currentColor;\n content: \u0022\u0022;\n opacity: .2;\n box-sizing: border-box;\n}\n.has-background .bflist-num-triangle {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ol.bflist-num-triangle,\nol.bflist-num-triangle {\n border: none;\n}\n.cps-post-main ol.bflist-num-triangle li:before {\n background-color: transparent!important;\n}"} -->
<ol class="bflist-num-triangle"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ol>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#60a7d6","background":"#f3f8fc"}}} -->
<div class="wp-block-group has-text-color has-background" style="background-color:#f3f8fc;color:#60a7d6"><div class="wp-block-group__inner-container"><!-- wp:list {"ordered":true,"className":"bflist-num-triangle","plusbfClassName":"bflist-num-triangle","plusbfStyle":"ol.bflist-num-triangle {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n counter-reset: num;\n}\n.cps-post-main ol.bflist-num-triangle li,\nol.bflist-num-triangle li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-num-triangle li:before,\n.bflist-num-triangle li:after {\n display: flex;\n position: absolute;\n justify-content: center;\n align-items: center;\n top: 0.125rem;\n}\n.bflist-num-triangle li:before {\n left: 0;\n z-index: 1;\n width: 1.25rem;\n height: 1.25rem;\n font-size: 0.75rem;\n content: counter(num)\u0022\u0022;\n counter-increment: num;\n box-sizing: border-box;\n}\n.bflist-num-triangle li:after {\n left: 0;\n z-index: 0;\n width: 1.25rem;\n height: 1.25rem;\n border-left: 0.625rem solid transparent;\n border-top: 0.625rem solid transparent;\n border-bottom: 0.625rem solid currentColor;\n border-right: 0.625rem solid currentColor;\n content: \u0022\u0022;\n opacity: .2;\n box-sizing: border-box;\n}\n.has-background .bflist-num-triangle {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ol.bflist-num-triangle,\nol.bflist-num-triangle {\n border: none;\n}\n.cps-post-main ol.bflist-num-triangle li:before {\n background-color: transparent!important;\n}"} -->
<ol class="bflist-num-triangle"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ol>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#76ced3","background":"#f4fbfc"}}} -->
<div class="wp-block-group has-text-color has-background" style="background-color:#f4fbfc;color:#76ced3"><div class="wp-block-group__inner-container"><!-- wp:list {"ordered":true,"className":"bflist-num-triangle","plusbfClassName":"bflist-num-triangle","plusbfStyle":"ol.bflist-num-triangle {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n counter-reset: num;\n}\n.cps-post-main ol.bflist-num-triangle li,\nol.bflist-num-triangle li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 4px 0;\n padding-left: 25px;\n}\n.bflist-num-triangle li:before,\n.bflist-num-triangle li:after {\n display: flex;\n position: absolute;\n justify-content: center;\n align-items: center;\n top: 0.125rem;\n}\n.bflist-num-triangle li:before {\n left: 0;\n z-index: 1;\n width: 1.25rem;\n height: 1.25rem;\n font-size: 0.75rem;\n content: counter(num)\u0022\u0022;\n counter-increment: num;\n box-sizing: border-box;\n}\n.bflist-num-triangle li:after {\n left: 0;\n z-index: 0;\n width: 1.25rem;\n height: 1.25rem;\n border-left: 0.625rem solid transparent;\n border-top: 0.625rem solid transparent;\n border-bottom: 0.625rem solid currentColor;\n border-right: 0.625rem solid currentColor;\n content: \u0022\u0022;\n opacity: .2;\n box-sizing: border-box;\n}\n.has-background .bflist-num-triangle {\n padding: 1rem 1.5rem;\n}\n.editor-styles-wrapper ol.bflist-num-triangle,\nol.bflist-num-triangle {\n border: none;\n}\n.cps-post-main ol.bflist-num-triangle li:before {\n background-color: transparent!important;\n}"} -->
<ol class="bflist-num-triangle"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ol>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
対応テーマ | SANGO・COCOON・THE SONIC |
スペシャル
①チェックリストver1
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"background":"#f9f9f9"}}} -->
<div class="wp-block-group has-background" style="background-color:#f9f9f9"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-spe-check","plusbfClassName":"bflist-spe-check","plusbfStyle":"ul.bflist-spe-check {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\nbody .bflist-spe-check li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 0;\n padding: 1rem 1rem 1rem 3rem;\n}\n.bflist-spe-check li:not(:last-child) {\n border-bottom: .75rem solid #fff;\n}\n.bflist-spe-check li:before {\n display: flex;\n position: absolute;\n left: 0.75rem;\n font-family: \u0022font awesome 5 free\u0022;\n font-weight: 600;\n font-size: 1.5rem;\n content: \u0022\\f058\u0022;\n}\n.has-background .bflist-spe-check {\n padding: 0;\n}\n.editor-styles-wrapper ul.bflist-spe-check,\nul.bflist-spe-check {\n border: none;\n}\n.cps-post-main ul.bflist-spe-check li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-spe-check"><li>サンプルテキスト</li><li>サンプルテキスト</li><li>サンプルテキスト</li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#60a7d6","background":"#f3f8fc"}}} -->
<div class="wp-block-group has-text-color has-background" style="background-color:#f3f8fc;color:#60a7d6"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-spe-check","plusbfClassName":"bflist-spe-check","plusbfStyle":"ul.bflist-spe-check {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\nbody .bflist-spe-check li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 0;\n padding: 1rem 1rem 1rem 3rem;\n}\n.bflist-spe-check li:not(:last-child) {\n border-bottom: .75rem solid #fff;\n}\n.bflist-spe-check li:before {\n display: flex;\n position: absolute;\n left: 0.75rem;\n font-family: \u0022font awesome 5 free\u0022;\n font-weight: 600;\n font-size: 1.5rem;\n content: \u0022\\f058\u0022;\n}\n.has-background .bflist-spe-check {\n padding: 0;\n}\n.editor-styles-wrapper ul.bflist-spe-check,\nul.bflist-spe-check {\n border: none;\n}\n.cps-post-main ul.bflist-spe-check li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-spe-check"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#76ced3","background":"#f4fbfc"}}} -->
<div class="wp-block-group has-text-color has-background" style="background-color:#f4fbfc;color:#76ced3"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-spe-check","plusbfClassName":"bflist-spe-check","plusbfStyle":"ul.bflist-spe-check {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\nbody .bflist-spe-check li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 0;\n padding: 1rem 1rem 1rem 3rem;\n}\n.bflist-spe-check li:not(:last-child) {\n border-bottom: .75rem solid #fff;\n}\n.bflist-spe-check li:before {\n display: flex;\n position: absolute;\n left: 0.75rem;\n font-family: \u0022font awesome 5 free\u0022;\n font-weight: 600;\n font-size: 1.5rem;\n content: \u0022\\f058\u0022;\n}\n.has-background .bflist-spe-check {\n padding: 0;\n}\n.editor-styles-wrapper ul.bflist-spe-check,\nul.bflist-spe-check {\n border: none;\n}\n.cps-post-main ul.bflist-spe-check li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-spe-check"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#ffc266","background":"#fffaf3"}}} -->
<div class="wp-block-group has-text-color has-background" style="background-color:#fffaf3;color:#ffc266"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-spe-check","plusbfClassName":"bflist-spe-check","plusbfStyle":"ul.bflist-spe-check {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\nbody .bflist-spe-check li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 0;\n padding: 1rem 1rem 1rem 3rem;\n}\n.bflist-spe-check li:not(:last-child) {\n border-bottom: .75rem solid #fff;\n}\n.bflist-spe-check li:before {\n display: flex;\n position: absolute;\n left: 0.75rem;\n font-family: \u0022font awesome 5 free\u0022;\n font-weight: 600;\n font-size: 1.5rem;\n content: \u0022\\f058\u0022;\n}\n.has-background .bflist-spe-check {\n padding: 0;\n}\n.editor-styles-wrapper ul.bflist-spe-check,\nul.bflist-spe-check {\n border: none;\n}\n.cps-post-main ul.bflist-spe-check li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-spe-check"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#f28d79","background":"#fef6f4"}}} -->
<div class="wp-block-group has-text-color has-background" style="background-color:#fef6f4;color:#f28d79"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-spe-check","plusbfClassName":"bflist-spe-check","plusbfStyle":"ul.bflist-spe-check {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\nbody .bflist-spe-check li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 0;\n padding: 1rem 1rem 1rem 3rem;\n}\n.bflist-spe-check li:not(:last-child) {\n border-bottom: .75rem solid #fff;\n}\n.bflist-spe-check li:before {\n display: flex;\n position: absolute;\n left: 0.75rem;\n font-family: \u0022font awesome 5 free\u0022;\n font-weight: 600;\n font-size: 1.5rem;\n content: \u0022\\f058\u0022;\n}\n.has-background .bflist-spe-check {\n padding: 0;\n}\n.editor-styles-wrapper ul.bflist-spe-check,\nul.bflist-spe-check {\n border: none;\n}\n.cps-post-main ul.bflist-spe-check li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-spe-check"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
対応テーマ | SANGO・JIN・COCOON・THE SONIC |
②チョックリストver2
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"background":"#f9f9f9"}}} -->
<div class="wp-block-group has-background" style="background-color:#f9f9f9"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-spe-check2","plusbfClassName":"bflist-spe-check2","plusbfStyle":"ul.bflist-spe-check2 {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\nbody .bflist-spe-check2 li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 0;\n padding: 1rem 1rem 1rem 3rem;\n}\n.bflist-spe-check2 li:not(:last-child) {\n border-bottom: 1px solid;\n}\n.bflist-spe-check2 li:before {\n display: flex;\n position: absolute;\n left: 0.75rem;\n font-family: \u0022font awesome 5 free\u0022;\n font-weight: 600;\n font-size: 1.5rem;\n content: \u0022\\f058\u0022;\n}\n.has-background .bflist-spe-check2 {\n padding: 0;\n}\n.editor-styles-wrapper ul.bflist-spe-check2,\nul.bflist-spe-check2 {\n border: 1px solid;\n}\n.cps-post-main ul.bflist-spe-check2 li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-spe-check2"><li>サンプルテキスト</li><li>サンプルテキスト</li><li>サンプルテキスト</li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#60a7d6","background":"#f3f8fc"}}} -->
<div class="wp-block-group has-text-color has-background" style="background-color:#f3f8fc;color:#60a7d6"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-spe-check2","plusbfClassName":"bflist-spe-check2","plusbfStyle":"ul.bflist-spe-check2 {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\nbody .bflist-spe-check2 li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 0;\n padding: 1rem 1rem 1rem 3rem;\n}\n.bflist-spe-check2 li:not(:last-child) {\n border-bottom: 1px solid;\n}\n.bflist-spe-check2 li:before {\n display: flex;\n position: absolute;\n left: 0.75rem;\n font-family: \u0022font awesome 5 free\u0022;\n font-weight: 600;\n font-size: 1.5rem;\n content: \u0022\\f058\u0022;\n}\n.has-background .bflist-spe-check2 {\n padding: 0;\n}\n.editor-styles-wrapper ul.bflist-spe-check2,\nul.bflist-spe-check2 {\n border: 1px solid;\n}\n.cps-post-main ul.bflist-spe-check2 li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-spe-check2"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#76ced3","background":"#f4fbfc"}}} -->
<div class="wp-block-group has-text-color has-background" style="background-color:#f4fbfc;color:#76ced3"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-spe-check2","plusbfClassName":"bflist-spe-check2","plusbfStyle":"ul.bflist-spe-check2 {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\nbody .bflist-spe-check2 li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 0;\n padding: 1rem 1rem 1rem 3rem;\n}\n.bflist-spe-check2 li:not(:last-child) {\n border-bottom: 1px solid;\n}\n.bflist-spe-check2 li:before {\n display: flex;\n position: absolute;\n left: 0.75rem;\n font-family: \u0022font awesome 5 free\u0022;\n font-weight: 600;\n font-size: 1.5rem;\n content: \u0022\\f058\u0022;\n}\n.has-background .bflist-spe-check2 {\n padding: 0;\n}\n.editor-styles-wrapper ul.bflist-spe-check2,\nul.bflist-spe-check2 {\n border: 1px solid;\n}\n.cps-post-main ul.bflist-spe-check2 li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-spe-check2"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#ffc266","background":"#fffaf3"}}} -->
<div class="wp-block-group has-text-color has-background" style="background-color:#fffaf3;color:#ffc266"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-spe-check2","plusbfClassName":"bflist-spe-check2","plusbfStyle":"ul.bflist-spe-check2 {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\nbody .bflist-spe-check2 li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 0;\n padding: 1rem 1rem 1rem 3rem;\n}\n.bflist-spe-check2 li:not(:last-child) {\n border-bottom: 1px solid;\n}\n.bflist-spe-check2 li:before {\n display: flex;\n position: absolute;\n left: 0.75rem;\n font-family: \u0022font awesome 5 free\u0022;\n font-weight: 600;\n font-size: 1.5rem;\n content: \u0022\\f058\u0022;\n}\n.has-background .bflist-spe-check2 {\n padding: 0;\n}\n.editor-styles-wrapper ul.bflist-spe-check2,\nul.bflist-spe-check2 {\n border: 1px solid;\n}\n.cps-post-main ul.bflist-spe-check2 li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-spe-check2"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
- サンプルテキスト
- サンプルテキスト
- サンプルテキスト
タイトル
<!-- wp:group {"style":{"color":{"text":"#f28d79","background":"#fef6f4"}}} -->
<div class="wp-block-group has-text-color has-background" style="background-color:#fef6f4;color:#f28d79"><div class="wp-block-group__inner-container"><!-- wp:list {"className":"bflist-spe-check2","plusbfClassName":"bflist-spe-check2","plusbfStyle":"ul.bflist-spe-check2 {\n line-height: 1.5;\n margin-top: 0;\n margin-bottom: 2em;\n padding-left: 0;\n list-style-type: none;\n}\nbody .bflist-spe-check2 li {\n display: flex;\n position: relative;\n align-items: center;\n margin: 0;\n padding: 1rem 1rem 1rem 3rem;\n}\n.bflist-spe-check2 li:not(:last-child) {\n border-bottom: 1px solid;\n}\n.bflist-spe-check2 li:before {\n display: flex;\n position: absolute;\n left: 0.75rem;\n font-family: \u0022font awesome 5 free\u0022;\n font-weight: 600;\n font-size: 1.5rem;\n content: \u0022\\f058\u0022;\n}\n.has-background .bflist-spe-check2 {\n padding: 0;\n}\n.editor-styles-wrapper ul.bflist-spe-check2,\nul.bflist-spe-check2 {\n border: 1px solid;\n}\n.cps-post-main ul.bflist-spe-check2 li:before {\n background-color: transparent!important;\n}"} -->
<ul class="bflist-spe-check2"><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li><li><span style="color:#333333" class="has-inline-color">サンプルテキスト</span></li></ul>
<!-- /wp:list --></div></div>
<!-- /wp:group -->
対応テーマ | SANGO・JIN・COCOON・THE SONIC |