[
  {
    "id": 1832,
    "title": "比較ボックス①_F-6",
    "icon": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewbox=\"0 0 256 256\"><path d=\"M112,48V208a8,8,0,0,1-8,8H64a8,8,0,0,1-8-8V48a8,8,0,0,1,8-8h40A8,8,0,0,1,112,48Zm80-8H152a8,8,0,0,0-8,8V208a8,8,0,0,0,8,8h40a8,8,0,0,0,8-8V48A8,8,0,0,0,192,40Z\" fill=\"#9aa8c9\"/><path d=\"M104,32H64A16,16,0,0,0,48,48V208a16,16,0,0,0,16,16h40a16,16,0,0,0,16-16V48A16,16,0,0,0,104,32Zm0,176H64V48h40ZM192,32H152a16,16,0,0,0-16,16V208a16,16,0,0,0,16,16h40a16,16,0,0,0,16-16V48A16,16,0,0,0,192,32Zm0,176H152V48h40Z\" fill=\"#1a1a2e\"/></svg>",
    "keywords": [
      "比較ボックス",
      "比較・レビュー",
      "比較ボックス①"
    ],
    "slug": "lazyblock/comparison-table",
    "description": "",
    "category": "Lazyblocks Free",
    "category_label": "Lazyblocks Free",
    "supports": {
      "customClassName": true,
      "anchor": false,
      "html": false,
      "multiple": true,
      "inserter": true,
      "reusable": true,
      "color": false,
      "layout": false,
      "shadow": false,
      "spacing": false,
      "dimensions": false,
      "typography": false,
      "lock": true,
      "align": [
        "wide",
        "full"
      ],
      "ghostkit": {
        "effects": false,
        "position": false,
        "spacings": false,
        "frame": false,
        "transform": false,
        "customCSS": false,
        "display": false,
        "attributes": false
      }
    },
    "controls": {
      "control_bf8a9b4659": {
        "type": "text",
        "name": "left_title",
        "default": "",
        "label": "左：タイトル",
        "help": "",
        "child_of": "",
        "placement": "inspector",
        "group": "default",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": ""
      },
      "control_36680c4128": {
        "type": "image",
        "name": "left_badge_image",
        "default": "",
        "label": "タイトル (copy)",
        "help": "",
        "child_of": "",
        "placement": "inspector",
        "group": "default",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": ""
      },
      "control_917b534889": {
        "type": "rich_text",
        "name": "left_content",
        "default": "",
        "label": "左：内容（箇条書き）",
        "help": "",
        "child_of": "",
        "placement": "inspector",
        "group": "default",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": ""
      },
      "control_d688eb4746": {
        "type": "text",
        "name": "left_btn_text",
        "default": "",
        "label": "左：ボタンテキスト",
        "help": "",
        "child_of": "",
        "placement": "inspector",
        "group": "default",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": ""
      },
      "control_b35b4d474d": {
        "type": "url",
        "name": "left_btn_url",
        "default": "",
        "label": "左：ボタンURL",
        "help": "",
        "child_of": "",
        "placement": "inspector",
        "group": "default",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": ""
      },
      "control_3a08dd4fb1": {
        "type": "text",
        "name": "right_title",
        "default": "",
        "label": "右：タイトル",
        "help": "",
        "child_of": "",
        "placement": "inspector",
        "group": "default",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": ""
      },
      "control_a6ab8f481c": {
        "type": "image",
        "name": "right_badge_image",
        "default": "",
        "label": "右：バッジ画像",
        "help": "",
        "child_of": "",
        "placement": "inspector",
        "group": "default",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": ""
      },
      "control_e53987439b": {
        "type": "rich_text",
        "name": "right_content",
        "default": "",
        "label": "右：内容（箇条書き）",
        "help": "",
        "child_of": "",
        "placement": "inspector",
        "group": "default",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": ""
      },
      "control_ef389446ff": {
        "type": "text",
        "name": "right_btn_text",
        "default": "",
        "label": "右：ボタンテキスト",
        "help": "",
        "child_of": "",
        "placement": "inspector",
        "group": "default",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": ""
      },
      "control_6f1b7049cb": {
        "type": "url",
        "name": "right_btn_url",
        "default": "",
        "label": "右：ボタンURL",
        "help": "",
        "child_of": "",
        "placement": "inspector",
        "group": "default",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": ""
      },
      "control_d83ac84733": {
        "type": "select",
        "name": "left_btn_effect",
        "default": "",
        "label": "左：ボタンエフェクト",
        "help": "",
        "child_of": "",
        "placement": "inspector",
        "group": "default",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": "",
        "choices": [
          {
            "label": "エフェクトなし",
            "value": "effect-none"
          },
          {
            "label": "キラッと光る",
            "value": "effect-shine"
          },
          {
            "label": "ぽよんと跳ねる",
            "value": "effect-bounce"
          },
          {
            "label": "波打つ",
            "value": "effect-pulse"
          },
          {
            "label": "ぶるぶる震える",
            "value": "effect-shake"
          },
          {
            "label": "立体的に押し込まれる",
            "value": "effect-push"
          }
        ]
      },
      "control_c199c74c2c": {
        "type": "select",
        "name": "right_btn_effect",
        "default": "",
        "label": "右：ボタンエフェクト",
        "help": "",
        "child_of": "",
        "placement": "inspector",
        "group": "default",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": "",
        "choices": [
          {
            "label": "エフェクトなし",
            "value": "effect-none"
          },
          {
            "label": "キラッと光る",
            "value": "effect-shine"
          },
          {
            "label": "ぽよんと跳ねる",
            "value": "effect-bounce"
          },
          {
            "label": "波打つ",
            "value": "effect-pulse"
          },
          {
            "label": "ぶるぶる震える",
            "value": "effect-shake"
          },
          {
            "label": "立体的に押し込まれる",
            "value": "effect-push"
          }
        ]
      }
    },
    "code": {
      "output_method": "html",
      "editor_html": "",
      "editor_callback": "",
      "frontend_html": "<div class=\"lzb-compare-box\">\r\n    <div class=\"lzb-compare-columns\">\r\n        <!-- 左カラム -->\r\n        <div class=\"lzb-compare-col lzb-compare-left\">\r\n            {{#if left_badge_image.url}}<img src=\"{{left_badge_image.url}}\" alt=\"バッジ\" class=\"lzb-badge-img\">{{/if}}\r\n            {{#if left_title}}<div class=\"lzb-compare-header\">{{left_title}}</div>{{/if}}\r\n            {{#if left_content}}<div class=\"lzb-compare-content\">{{{left_content}}}</div>{{/if}}\r\n            {{#if left_btn_url}}\r\n                {{#if left_btn_text}}\r\n                <div class=\"lzb-compare-btn-wrap\">\r\n                    <a href=\"{{left_btn_url}}\" class=\"lzb-compare-btn btn-left {{left_btn_effect}}\" target=\"_blank\" rel=\"noopener\">{{left_btn_text}}</a>\r\n                </div>\r\n                {{/if}}\r\n            {{/if}}\r\n        </div>\r\n        \r\n        <!-- 右カラム -->\r\n        <div class=\"lzb-compare-col lzb-compare-right\">\r\n            {{#if right_badge_image.url}}<img src=\"{{right_badge_image.url}}\" alt=\"バッジ\" class=\"lzb-badge-img\">{{/if}}\r\n            {{#if right_title}}<div class=\"lzb-compare-header\">{{right_title}}</div>{{/if}}\r\n            {{#if right_content}}<div class=\"lzb-compare-content\">{{{right_content}}}</div>{{/if}}\r\n            {{#if right_btn_url}}\r\n                {{#if right_btn_text}}\r\n                <div class=\"lzb-compare-btn-wrap\">\r\n                    <a href=\"{{right_btn_url}}\" class=\"lzb-compare-btn btn-right {{right_btn_effect}}\" target=\"_blank\" rel=\"noopener\">{{right_btn_text}}</a>\r\n                </div>\r\n                {{/if}}\r\n            {{/if}}\r\n        </div>\r\n    </div>\r\n</div>\r\n\r\n<style>\r\n/* 大枠・レイアウト */\r\n.lzb-compare-box { margin: 2.5em 0; border-radius: 8px; background: #fff; box-shadow: 0 4px 12px rgba(0,0,0,0.08); overflow: hidden; }\r\n.lzb-compare-columns { display: flex; flex-wrap: wrap; }\r\n/* ホバー時の浮き上がりアクション（リッチUI） */\r\n.lzb-compare-col { flex: 1 1 50%; display: flex; flex-direction: column; position: relative; box-sizing: border-box; transition: transform 0.3s ease, box-shadow 0.3s ease; }\r\n.lzb-compare-col:hover { transform: translateY(-3px); z-index: 2; box-shadow: 0 8px 16px rgba(0,0,0,0.1); }\r\n\r\n/* 共通パーツ */\r\n.lzb-compare-header { padding: 15px; text-align: center; font-weight: bold; font-size: 1.1em; letter-spacing: 0.05em; }\r\n.lzb-compare-content { padding: 20px; font-size: 0.95em; flex-grow: 1; }\r\n.lzb-compare-content ul { list-style: none !important; padding-left: 0 !important; margin: 0 !important; }\r\n.lzb-compare-content ul li { position: relative; padding-left: 1.5em; margin-bottom: 0.8em; line-height: 1.6; }\r\n.lzb-compare-content ul li::before { content: '●'; position: absolute; left: 0; top: 0; font-size: 0.8em; }\r\n\r\n/* ====================================\r\n   ★バッジ画像の強制サイズ固定＆左上ピタ配置\r\n   ==================================== */\r\n.lzb-badge-img {\r\n    position: absolute;\r\n    z-index: 5;\r\n    top: 0;\r\n    left: 0;\r\n    width: 60px !important;\r\n    height: 60px !important;\r\n    border-top-left-radius: 8px;\r\n    object-fit: contain; \r\n}\r\n\r\n/* ====================================\r\n   ボタン基本（グラデーション）\r\n   ==================================== */\r\n.lzb-compare-btn-wrap { padding: 0 20px 20px; text-align: center; }\r\n.lzb-compare-btn { display: inline-block; padding: 14px 20px; color: #fff !important; text-decoration: none !important; border-radius: 30px; font-size: 0.95em; font-weight: bold; width: 100%; box-sizing: border-box; background-image: linear-gradient(135deg, rgba(255,255,255,0.15) 0%, rgba(0,0,0,0.1) 100%); box-shadow: 0 4px 8px rgba(0,0,0,0.15); transition: opacity 0.3s, transform 0.2s; position: relative; }\r\n.lzb-compare-btn.effect-none:hover { opacity: 0.9; transform: scale(0.98); }\r\n\r\n/* --- 徹底軽量化：色指定の統合 --- */\r\n/* 左カラム（紫） */\r\n.lzb-compare-left .lzb-compare-header, .lzb-compare-left .btn-left { background-color: #4b1a82; color: #fff; }\r\n.lzb-compare-left .lzb-compare-content, .lzb-compare-left .lzb-compare-btn-wrap { background-color: #f4f8fc; }\r\n.lzb-compare-left .lzb-compare-content ul li::before { color: #6a35a5; }\r\n\r\n/* 右カラム（緑） */\r\n.lzb-compare-right .lzb-compare-header, .lzb-compare-right .btn-right { background-color: #55a882; color: #fff; }\r\n.lzb-compare-right .lzb-compare-content, .lzb-compare-right .lzb-compare-btn-wrap { background-color: #fff8f5; }\r\n.lzb-compare-right .lzb-compare-content ul li::before { color: #55a882; }\r\n\r\n/* スマホ対応 */\r\n@media screen and (max-width: 600px) {\r\n    .lzb-compare-col { flex: 1 1 100%; }\r\n    .lzb-compare-right { border-top: 3px solid #fff; }\r\n}\r\n\r\n/* ====================================\r\n   ボタンの5つのエフェクト \r\n   ==================================== */\r\n/* 1. キラッと光る */\r\n.effect-shine { overflow: hidden; }\r\n.effect-shine::after { content: \"\"; position: absolute; top: -50%; left: -50%; width: 20%; height: 200%; background: rgba(255,255,255,0.4); transform: rotate(45deg); animation: lzb-shine 3s infinite; }\r\n@keyframes lzb-shine { 0% { left: -50%; } 100% { left: 150%; } }\r\n\r\n/* 2. ぽよんと跳ねる */\r\n.effect-bounce:hover { animation: lzb-bounce 0.5s ease !important; opacity: 0.9; }\r\n@keyframes lzb-bounce { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(-6px); } }\r\n\r\n/* 3. 波打つ */\r\n.effect-pulse { animation: lzb-pulse 2s infinite; }\r\n@keyframes lzb-pulse { 0% { box-shadow: 0 0 0 0 rgba(0,0,0,0.3); } 70% { box-shadow: 0 0 0 10px rgba(0,0,0,0); } 100% { box-shadow: 0 0 0 0 rgba(0,0,0,0); } }\r\n.effect-pulse:hover { opacity: 0.9; transform: scale(0.98); }\r\n\r\n/* 4. ぶるぶる震える */\r\n.effect-shake:hover { animation: lzb-shake 0.4s infinite !important; opacity: 0.9; }\r\n@keyframes lzb-shake { 0% { transform: translate(1px, 1px) rotate(0deg); } 25% { transform: translate(-1px, -2px) rotate(-1deg); } 50% { transform: translate(-2px, 0px) rotate(1deg); } 75% { transform: translate(2px, 2px) rotate(0deg); } 100% { transform: translate(1px, -1px) rotate(1deg); } }\r\n\r\n/* 5. 立体的に押し込まれる */\r\n.effect-push { box-shadow: 0 5px 0 rgba(0,0,0,0.2) !important; transform: translateY(0) !important; transition: all 0.2s; }\r\n.effect-push:hover { transform: translateY(5px) !important; box-shadow: 0 0px 0 rgba(0,0,0,0) !important; opacity: 0.9; }\r\n</style>",
      "frontend_callback": "",
      "show_preview": "always",
      "single_output": true
    },
    "style": {
      "block": "",
      "editor": ""
    },
    "script": {
      "view": ""
    },
    "styles": [],
    "condition": [],
    "edit_url": null,
    "provide_context_to_blocks": "",
    "custom_context_slug": "",
    "allowed_blocks": "",
    "ancestor": ""
  }
]