[
  {
    "id": 2979,
    "title": "コンバージョンPRボックス（スタイル切替）_P-25",
    "icon": "<svg xmlns=\"http://www.w3.org/2000/svg\" width=\"24\" height=\"24\" viewbox=\"0 0 256 256\"><path d=\"M240,120a40,40,0,0,1-40,40H160V80h40A40,40,0,0,1,240,120Z\" fill=\"#9aa8c9\"/><path d=\"M248,120a48.05,48.05,0,0,0-48-48H160.2c-2.91-.17-53.62-3.74-101.91-44.24A16,16,0,0,0,32,40V200a16,16,0,0,0,26.29,12.25c37.77-31.68,77-40.76,93.71-43.3v31.72A16,16,0,0,0,159.12,214l11,7.33A16,16,0,0,0,194.5,212l11.77-44.36A48.07,48.07,0,0,0,248,120ZM48,199.93V40h0c42.81,35.91,86.63,45,104,47.24v65.48C134.65,155,90.84,164.07,48,199.93Zm131,8,0,.11-11-7.33V168h21.6ZM200,152H168V88h32a32,32,0,1,1,0,64Z\" fill=\"#1a1a2e\"/></svg>",
    "keywords": [
      "PR",
      "CTA",
      "バナー",
      "アフィリエイト",
      "conversion",
      "CTA・訴求",
      "コンバージョンPRボックス（スタイル切替）"
    ],
    "slug": "lazyblock/conversion-pr-box",
    "description": "A〜Fの6スタイルをセレクトで切り替えられる高コンバージョンPRボックス。スクロールアニメーション・波紋エフェクト付き。",
    "category": "Lazyblocks Pro",
    "category_label": "Lazyblocks Pro",
    "supports": {
      "customClassName": true,
      "anchor": true,
      "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_4cbae6448c": {
        "type": "select",
        "name": "pr_style",
        "default": "",
        "label": "スタイル",
        "help": "",
        "child_of": "",
        "placement": "inspector",
        "group": "settings",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": "",
        "choices": [
          {
            "label": "A｜高級・信頼系（濃紺×ゴールド）",
            "value": "A"
          },
          {
            "label": "B｜勢い・お得系（オレンジ×赤）",
            "value": "B"
          },
          {
            "label": "C｜モダンAI系（紫×シアン・グロー）",
            "value": "C"
          },
          {
            "label": "D｜ガラスモーフィズム（すりガラス×グラデ）",
            "value": "D"
          },
          {
            "label": "E｜ネオブルータリズム（黄×黒・太枠）",
            "value": "E"
          },
          {
            "label": "F｜グラデーション波形（暖色×丸み）",
            "value": "F"
          }
        ]
      },
      "control_7798114127": {
        "type": "text",
        "name": "pr_label",
        "default": "",
        "label": "一言説明タグ（上部）",
        "help": "",
        "child_of": "",
        "placement": "inspector",
        "group": "settings",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": ""
      },
      "control_7ac8234c93": {
        "type": "text",
        "name": "pr_title",
        "default": "",
        "label": "タイトル",
        "help": "",
        "child_of": "",
        "placement": "inspector",
        "group": "settings",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": ""
      },
      "control_6a8a9849e3": {
        "type": "textarea",
        "name": "pr_desc",
        "default": "",
        "label": "説明文",
        "help": "",
        "child_of": "",
        "placement": "inspector",
        "group": "settings",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": ""
      },
      "control_9f1a254f83": {
        "type": "textarea",
        "name": "pr_features_textarea",
        "default": "",
        "label": "特徴リスト（改行区切り）",
        "help": "",
        "child_of": "",
        "placement": "inspector",
        "group": "settings",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": ""
      },
      "control_1359b24a57": {
        "type": "code_editor",
        "name": "pr_banner_code",
        "default": "",
        "label": "バナーHTMLコード",
        "help": "",
        "child_of": "",
        "placement": "inspector",
        "group": "settings",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": "",
        "language": "html"
      },
      "control_051a104b6e": {
        "type": "text",
        "name": "pr_btn_text",
        "default": "",
        "label": "ボタンテキスト",
        "help": "",
        "child_of": "",
        "placement": "inspector",
        "group": "settings",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": ""
      },
      "control_8688fc4c7e": {
        "type": "url",
        "name": "pr_btn_url",
        "default": "",
        "label": "ボタンURL",
        "help": "",
        "child_of": "",
        "placement": "inspector",
        "group": "settings",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": ""
      },
      "control_7c89274332": {
        "type": "text",
        "name": "pr_note",
        "default": "",
        "label": "注釈（ボタン下）",
        "help": "",
        "child_of": "",
        "placement": "inspector",
        "group": "settings",
        "width": "100",
        "hide_if_not_selected": "false",
        "required": "false",
        "translate": "false",
        "save_in_meta": "false",
        "save_in_meta_name": "",
        "placeholder": "",
        "characters_limit": ""
      }
    },
    "code": {
      "output_method": "php",
      "editor_html": "<div class=\"lzb-pr-box lzb-pr-box--{{pr_style}} js-lzb-animate\">\n  {{#unless pr_label}}{{#unless pr_title}}{{#unless pr_banner_code}}{{#unless pr_btn_text}}\n  <div class=\"lzb-placeholder\">\n    <div class=\"lzb-placeholder-icon\">✨</div>\n    <div class=\"lzb-placeholder-title\">高コンバージョンPRボックス</div>\n    <div class=\"lzb-placeholder-text\">右側の設定パネルから入力してください。</div>\n  </div>\n  {{/unless}}{{/unless}}{{/unless}}{{/unless}}\n  {{#if pr_label}}<div class=\"lzb-pr-label-wrapper\"><span class=\"lzb-pr-label-tag\">{{pr_label}}</span></div>{{/if}}\n  {{#if pr_title}}<p class=\"lzb-pr-title\">{{pr_title}}</p>{{/if}}\n  {{#if pr_desc}}<p class=\"lzb-pr-desc\">{{pr_desc}}</p>{{/if}}\n  {{#if pr_features}}<div class=\"lzb-pr-features\">{{#each pr_features}}<span class=\"lzb-pr-badge\"><svg width=\"14\" height=\"14\" viewBox=\"0 0 16 16\" fill=\"none\"><rect width=\"16\" height=\"16\" rx=\"3\" class=\"lzb-badge-rect\"/><path d=\"M4.5 8.5L7 11L12 5\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg>{{feature_text}}</span>{{/each}}</div>{{/if}}\n  {{#if pr_banner_code}}<div class=\"lzb-pr-banner-container\">{{{pr_banner_code}}}</div>{{/if}}\n  {{#if pr_btn_text}}<a href=\"{{pr_btn_url}}\" class=\"lzb-pr-btn js-lzb-ripple\" target=\"_blank\" rel=\"noopener noreferrer\"><span class=\"lzb-btn-inner\">{{pr_btn_text}}<svg class=\"lzb-btn-arrow\" width=\"20\" height=\"20\" viewBox=\"0 0 24 24\" fill=\"none\"><path d=\"M5 12h14M13 6l6 6-6 6\" stroke=\"currentColor\" stroke-width=\"2.5\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/></svg></span></a>{{/if}}\n  {{#if pr_note}}<div class=\"lzb-pr-note\">{{pr_note}}</div>{{/if}}\n</div>",
      "editor_callback": "",
      "frontend_html": "<?php\r\n// Lazy Blocksの仕様に合わせて $attributes 配列から正しくデータを受け取ります\r\n$p_style   = isset($attributes['pr_style']) ? $attributes['pr_style'] : 'A';\r\n$p_label   = isset($attributes['pr_label']) ? $attributes['pr_label'] : '';\r\n$p_title   = isset($attributes['pr_title']) ? $attributes['pr_title'] : '';\r\n$p_desc    = isset($attributes['pr_desc']) ? $attributes['pr_desc'] : '';\r\n$p_feats   = isset($attributes['pr_features_textarea']) ? $attributes['pr_features_textarea'] : '';\r\n$p_banner  = isset($attributes['pr_banner_code']) ? $attributes['pr_banner_code'] : '';\r\n$p_btn_txt = isset($attributes['pr_btn_text']) ? $attributes['pr_btn_text'] : '';\r\n$p_btn_url = isset($attributes['pr_btn_url']) ? $attributes['pr_btn_url'] : '';\r\n$p_note    = isset($attributes['pr_note']) ? $attributes['pr_note'] : '';\r\n\r\n// すべて空欄の場合のみプレースホルダーを表示\r\nif (empty($p_label) && empty($p_title) && empty($p_banner) && empty($p_btn_txt)) {\r\n    echo '<div style=\"padding:20px; background:#f5f5f5; text-align:center; border-radius:8px; color:#333; border: 2px dashed #ccc;\">✨ 右側の設定パネルからテキストやバナーを入力してください。</div>';\r\n    return;\r\n}\r\n\r\n// スタイルの安全処理（A〜Fを確実に抽出）\r\n$style_class = 'A';\r\nif (!empty($p_style)) {\r\n    $first_char = mb_substr(trim($p_style), 0, 1);\r\n    if (in_array($first_char, ['A', 'B', 'C', 'D', 'E', 'F'])) {\r\n        $style_class = $first_char;\r\n    }\r\n}\r\n?>\r\n\r\n<div class=\"lzb-pr-box lzb-pr-box--<?php echo esc_attr($style_class); ?> js-lzb-animate\">\r\n\r\n  <?php if (!empty($p_label)): ?>\r\n  <div class=\"lzb-pr-label-wrapper\"><span class=\"lzb-pr-label-tag\"><?php echo esc_html($p_label); ?></span></div>\r\n  <?php endif; ?>\r\n\r\n  <?php /* ★ここで h3 を div に変更してSWELLの干渉をブロック */ ?>\r\n  <?php if (!empty($p_title)): ?>\r\n  <div class=\"lzb-pr-title\"><?php echo esc_html($p_title); ?></div>\r\n  <?php endif; ?>\r\n\r\n  <?php if (!empty($p_desc)): ?>\r\n  <p class=\"lzb-pr-desc\"><?php echo nl2br(esc_html($p_desc)); ?></p>\r\n  <?php endif; ?>\r\n\r\n  <?php /* 特徴リスト（改行で自動バッジ分割） */ ?>\r\n  <?php if (!empty($p_feats)): \r\n      $features = preg_split('/\\r\\n|\\r|\\n/', trim($p_feats));\r\n      if (!empty($features)):\r\n  ?>\r\n  <ul class=\"lzb-pr-features\">\r\n    <?php foreach ($features as $feature): \r\n        $feature = trim($feature);\r\n        if ($feature === '') continue;\r\n    ?>\r\n    <li class=\"lzb-pr-badge\">\r\n      <svg width=\"16\" height=\"16\" viewBox=\"0 0 16 16\" fill=\"none\" class=\"lzb-check-icon\">\r\n        <rect width=\"16\" height=\"16\" rx=\"4\" class=\"lzb-check-bg\" />\r\n        <path d=\"M4.5 8.5L7 11L12 5\" stroke=\"white\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n      </svg>\r\n      <?php echo esc_html($feature); ?>\r\n    </li>\r\n    <?php endforeach; ?>\r\n  </ul>\r\n  <?php endif; endif; ?>\r\n\r\n  <?php /* バナーHTML */ ?>\r\n  <?php if (!empty($p_banner)): ?>\r\n  <div class=\"lzb-pr-banner-container\"><?php echo $p_banner; ?></div>\r\n  <?php endif; ?>\r\n\r\n  <?php /* ボタン */ ?>\r\n  <?php if (!empty($p_btn_txt)): ?>\r\n  <div class=\"lzb-pr-btn-wrap\">\r\n    <a href=\"<?php echo esc_url($p_btn_url); ?>\" class=\"lzb-pr-btn js-lzb-ripple\" target=\"_blank\" rel=\"noopener noreferrer\" onclick=\"if(typeof gtag==='function'){gtag('event','click_pr_box',{'link_url':'<?php echo esc_js($p_btn_url); ?>'});}\">\r\n      <span class=\"lzb-btn-inner\">\r\n        <?php echo esc_html($p_btn_txt); ?>\r\n        <svg class=\"lzb-btn-arrow\" width=\"18\" height=\"18\" viewBox=\"0 0 24 24\" fill=\"none\">\r\n          <path d=\"M4 12h16M13 5l7 7-7 7\" stroke=\"currentColor\" stroke-width=\"2\" stroke-linecap=\"round\" stroke-linejoin=\"round\"/>\r\n        </svg>\r\n      </span>\r\n    </a>\r\n  </div>\r\n  <?php endif; ?>\r\n\r\n  <?php if (!empty($p_note)): ?>\r\n  <div class=\"lzb-pr-note\"><?php echo esc_html($p_note); ?></div>\r\n  <?php endif; ?>\r\n\r\n</div>",
      "frontend_callback": "",
      "show_preview": "always",
      "single_output": true
    },
    "style": {
      "block": "/* =======================================\r\n   ベーススタイル（共通レイアウト）\r\n======================================= */\r\n.lzb-pr-box { position: relative; padding: 32px 40px; border-radius: 12px; margin: 2em 0; box-sizing: border-box; font-family: inherit; }\r\n.lzb-pr-label-wrapper { margin-bottom: 20px; }\r\n.lzb-pr-label-tag { display: inline-flex; align-items: center; padding: 6px 16px; border-radius: 30px; font-size: 0.85rem; font-weight: 700; }\r\n\r\n/* SWELL見出し装飾リセット */\r\n.lzb-pr-title { font-size: 1.6rem !important; font-weight: 900 !important; line-height: 1.4 !important; margin: 0 0 16px 0 !important; padding: 0 !important; border: none !important; background: transparent !important; }\r\n.lzb-pr-desc { font-size: 0.95rem; line-height: 1.7; margin: 0 0 24px 0; }\r\n\r\n.lzb-pr-features { display: flex !important; flex-wrap: wrap !important; gap: 12px !important; margin: 0 0 30px 0 !important; padding: 0 !important; list-style: none !important; }\r\n.lzb-pr-badge { display: inline-flex; align-items: center; gap: 6px; padding: 8px 14px; border-radius: 8px; font-size: 0.85rem; font-weight: 700; }\r\n\r\n/* ★バナーエリア（白い淵を完全に消すリセットを追加） */\r\n.lzb-pr-banner-container { margin: 0 0 24px 0; text-align: center; display: flex; flex-direction: column; align-items: center; justify-content: center; width: 100%; background: transparent !important; padding: 0 !important; border: none !important; }\r\n.lzb-pr-banner-container a, .lzb-pr-banner-container div { display: inline-block; max-width: 100%; background: transparent !important; padding: 0 !important; margin: 0 !important; border: none !important; }\r\n.lzb-pr-banner-container img, \r\n.lzb-pr-banner-container iframe { max-width: 100%; height: auto; border-radius: 8px; box-shadow: 0 4px 15px rgba(0,0,0,0.1); display: block; margin: 0 auto; background: transparent !important; padding: 0 !important; border: none !important; }\r\n/* 計測用ピクセル隠し */\r\n.lzb-pr-banner-container img[width=\"1\"], \r\n.lzb-pr-banner-container img[height=\"1\"] { position: absolute !important; width: 1px !important; height: 1px !important; box-shadow: none !important; border-radius: 0 !important; margin: 0 !important; padding: 0 !important; opacity: 0; pointer-events: none; }\r\n\r\n.lzb-pr-btn-wrap { text-align: center; margin-bottom: 12px; }\r\n.lzb-pr-btn { position: relative; overflow: hidden; display: inline-flex; align-items: center; justify-content: center; font-size: 1.15rem; font-weight: 900; text-decoration: none !important; padding: 18px 40px; border-radius: 50px; width: 90%; max-width: 600px; transition: transform 0.2s ease, box-shadow 0.2s ease, opacity 0.2s ease; }\r\n.lzb-pr-btn:hover { transform: translateY(-2px); opacity: 0.95; }\r\n\r\n.lzb-btn-inner { display: flex; align-items: center; gap: 8px; position: relative; z-index: 2; }\r\n.lzb-pr-note { text-align: center; font-size: 0.8rem; opacity: 0.8; }\r\n\r\n\r\n/* =======================================\r\n   各スタイル定義 (A〜F)\r\n======================================= */\r\n/* A｜高級・信頼系 */\r\n.lzb-pr-box--A { background: linear-gradient(135deg, #1c283a 0%, #101825 100%); border: 1px solid #aa9154; box-shadow: 0 10px 30px rgba(0,0,0,0.25); }\r\n.lzb-pr-box--A .lzb-pr-title { color: #ffffff !important; }\r\n.lzb-pr-box--A .lzb-pr-desc { color: #a4b1c6 !important; }\r\n.lzb-pr-box--A .lzb-pr-label-tag { background: #dfbc6d; color: #101825; }\r\n.lzb-pr-box--A .lzb-pr-badge { background: rgba(0,0,0,0.15); color: #dfbc6d; border: 1px solid rgba(223, 188, 109, 0.4); }\r\n.lzb-pr-box--A .lzb-check-bg { fill: #4ade80; } \r\n.lzb-pr-box--A .lzb-pr-btn { background: #dfbc6d !important; color: #101825 !important; border-radius: 8px; }\r\n.lzb-pr-box--A .lzb-pr-btn svg { stroke: #101825 !important; }\r\n.lzb-pr-box--A .lzb-pr-note { color: #6b7a90 !important; }\r\n/* 光アニメーション */\r\n.lzb-pr-box--A .lzb-pr-btn::after {\r\n  content: \"\"; position: absolute; top: 0; left: -100%; width: 50%; height: 100%;\r\n  background: linear-gradient(to right, rgba(255,255,255,0) 0%, rgba(255,255,255,0.6) 50%, rgba(255,255,255,0) 100%);\r\n  transform: skewX(-20deg); z-index: 1; animation: lzb-shine-anim 4s infinite;\r\n}\r\n.lzb-pr-box--A .lzb-pr-btn:hover { transform: translateY(-2px); box-shadow: 0 6px 15px rgba(223, 188, 109, 0.3); }\r\n\r\n/* B｜勢い・お得系 */\r\n.lzb-pr-box--B { background: #fff5f5; border: 3px solid #ff4500; }\r\n.lzb-pr-box--B .lzb-pr-title { color: #c23300 !important; }\r\n.lzb-pr-box--B .lzb-pr-desc, .lzb-pr-box--B .lzb-pr-note { color: #333333 !important; }\r\n.lzb-pr-box--B .lzb-pr-label-tag { background: #ff4500; color: #ffffff; }\r\n.lzb-pr-box--B .lzb-pr-badge { background: #ffe4e1; color: #d23600; }\r\n.lzb-pr-box--B .lzb-check-bg { fill: #ff4500; }\r\n.lzb-pr-box--B .lzb-pr-btn { background: linear-gradient(135deg, #ff4500, #ff8c00) !important; color: #ffffff !important; }\r\n.lzb-pr-box--B .lzb-pr-btn svg { stroke: #ffffff !important; }\r\n\r\n/* C｜モダンAI系 */\r\n.lzb-pr-box--C { background: #130f26; border: 1px solid #2d2654; box-shadow: 0 0 25px rgba(0,229,255,0.15); }\r\n.lzb-pr-box--C .lzb-pr-title { color: #ffffff !important; }\r\n.lzb-pr-box--C .lzb-pr-desc, .lzb-pr-box--C .lzb-pr-note { color: #b3c5e5 !important; }\r\n.lzb-pr-box--C .lzb-pr-label-tag { background: #00e5ff; color: #130f26; }\r\n.lzb-pr-box--C .lzb-pr-badge { background: rgba(0,229,255,0.1); color: #00e5ff; border: 1px solid rgba(0,229,255,0.3); }\r\n.lzb-pr-box--C .lzb-check-bg { fill: #00e5ff; }\r\n.lzb-pr-box--C .lzb-pr-btn { background: linear-gradient(135deg, #7b2cbf, #00e5ff) !important; color: #ffffff !important; }\r\n.lzb-pr-box--C .lzb-pr-btn svg { stroke: #ffffff !important; }\r\n\r\n/* D｜ガラスモーフィズム */\r\n.lzb-pr-box--D { background: linear-gradient(135deg, #6c88d8 0%, #aa7cd8 50%, #e98be1 100%); border-radius: 16px; box-shadow: 0 10px 30px rgba(108,136,216,0.3), inset 0 0 0 1px rgba(255,255,255,0.4); overflow: hidden; border: 1px solid rgba(255,255,255,0.2); }\r\n.lzb-pr-box--D .lzb-pr-title { color: #ffffff !important; text-shadow: 0 2px 4px rgba(0,0,0,0.1); }\r\n.lzb-pr-box--D .lzb-pr-desc, .lzb-pr-box--D .lzb-pr-note { color: #ffffff !important; }\r\n.lzb-pr-box--D .lzb-pr-label-tag, .lzb-pr-box--D .lzb-pr-badge { background: rgba(255,255,255,0.2); border: 1px solid rgba(255,255,255,0.4); color: #ffffff !important; backdrop-filter: blur(4px); -webkit-backdrop-filter: blur(4px); }\r\n.lzb-pr-box--D .lzb-check-bg { fill: #4ade80; }\r\n.lzb-pr-box--D .lzb-pr-btn { background: #ffffff !important; color: #48249a !important; border-radius: 12px; box-shadow: 0 4px 15px rgba(0,0,0,0.1); }\r\n.lzb-pr-box--D .lzb-pr-btn svg { stroke: #48249a !important; }\r\n\r\n/* E｜ネオブルータリズム */\r\n.lzb-pr-box--E { background: #ffde59; border: 4px solid #000; box-shadow: 8px 8px 0px #000; border-radius: 0; }\r\n.lzb-pr-box--E .lzb-pr-title { color: #000000 !important; font-weight: 900 !important; }\r\n.lzb-pr-box--E .lzb-pr-desc, .lzb-pr-box--E .lzb-pr-note { color: #1a1a1a !important; font-weight: bold !important; }\r\n.lzb-pr-box--E .lzb-pr-label-tag { background: #000; color: #fff; border-radius: 0; }\r\n.lzb-pr-box--E .lzb-pr-badge { background: #fff; color: #000; border: 2px solid #000; border-radius: 0; }\r\n.lzb-pr-box--E .lzb-check-bg { fill: #000; }\r\n.lzb-pr-box--E .lzb-pr-btn { background: #ff385c !important; color: #ffffff !important; border: 3px solid #000; box-shadow: 4px 4px 0px #000; border-radius: 0; }\r\n.lzb-pr-box--E .lzb-pr-btn svg { stroke: #ffffff !important; }\r\n.lzb-pr-box--E .lzb-pr-btn:hover { transform: translate(2px, 2px); box-shadow: 2px 2px 0px #000; opacity: 1; }\r\n\r\n/* F｜グラデーション波形 */\r\n.lzb-pr-box--F { background: linear-gradient(135deg, #fff3e0, #fce4ec); border: none; border-radius: 30px; }\r\n.lzb-pr-box--F .lzb-pr-title { color: #4e342e !important; }\r\n.lzb-pr-box--F .lzb-pr-desc, .lzb-pr-box--F .lzb-pr-note { color: #5d4037 !important; }\r\n.lzb-pr-box--F .lzb-pr-label-tag { background: #ff8a65; color: #fff; }\r\n.lzb-pr-box--F .lzb-pr-badge { background: #fff; color: #ff8a65; }\r\n.lzb-pr-box--F .lzb-check-bg { fill: #ff8a65; }\r\n.lzb-pr-box--F .lzb-pr-btn { background: linear-gradient(135deg, #ff8a65, #f48fb1) !important; color: #ffffff !important; border-radius: 30px; }\r\n.lzb-pr-box--F .lzb-pr-btn svg { stroke: #ffffff !important; }\r\n\r\n/* =======================================\r\n   アニメーション用キーフレーム\r\n======================================= */\r\n@keyframes lzb-shine-anim {\r\n  0% { left: -100%; }\r\n  15% { left: 200%; }\r\n  100% { left: 200%; }\r\n}\n\n@keyframes lzb-ripple-anim {\n  to { transform: translate(-50%, -50%) scale(1); opacity: 0; }\n}\n\n/* スマホ向け最適化（480px） */\n@media (max-width: 480px) {\n  .lzb-pr-box { padding: 22px 18px; }\n  .lzb-pr-title { font-size: 1.3rem !important; }\n  .lzb-pr-btn { width: 100%; padding: 14px 24px; font-size: 1rem; }\n}",
      "editor": "/* ════════════════════════════════════════════════════\r\n   エディタ専用CSS（Lazyblocksの「エディターCSS」欄に貼る）\r\n   ※ フロントエンドCSSは一切変更していません。\r\n   ※ Gutenberg/SWELLエディタが a・img・p・ul 等に\r\n     当てているデフォルトスタイルを打ち消した上で、\r\n     フロントエンドと同じ見た目を再現しています。\r\n   ════════════════════════════════════════════════════ */\r\n\r\n/* ─── ① Gutenberg/SWELLエディタのデフォルト干渉をリセット ─── */\r\n.editor-styles-wrapper .lzb-pr-box,\r\n.editor-styles-wrapper .lzb-pr-box * {\r\n  box-sizing: border-box !important;\r\n}\r\n.editor-styles-wrapper .lzb-pr-box a {\r\n  text-decoration: none !important;\r\n  border-bottom: none !important;\r\n  box-shadow: none !important;\r\n}\r\n.editor-styles-wrapper .lzb-pr-box img {\r\n  border: none !important;\r\n  box-shadow: none !important;\r\n  max-width: 100% !important;\r\n  vertical-align: middle !important;\r\n}\r\n.editor-styles-wrapper .lzb-pr-box p,\r\n.editor-styles-wrapper .lzb-pr-box span,\r\n.editor-styles-wrapper .lzb-pr-box div {\r\n  margin: 0;\r\n  padding: 0;\r\n}\r\n.editor-styles-wrapper .lzb-pr-box ul,\r\n.editor-styles-wrapper .lzb-pr-box li {\r\n  list-style: none !important;\r\n  padding: 0 !important;\r\n}\r\n.editor-styles-wrapper .lzb-pr-box li {\r\n  margin: 0 !important;\r\n}\r\n.editor-styles-wrapper .lzb-pr-box ul.lzb-pr-features {\r\n  margin: 0 0 30px 0 !important;\r\n}\r\n\r\n/* ─── ② ベースレイアウト（フロントエンドと同一内容を高詳細度で再現） ─── */\r\n.editor-styles-wrapper .lzb-pr-box {\r\n  position: relative !important;\r\n  padding: 32px 40px !important;\r\n  border-radius: 12px !important;\r\n  margin: 2em 0 !important;\r\n  font-family: inherit !important;\r\n}\r\n.editor-styles-wrapper .lzb-pr-label-wrapper {\r\n  margin-bottom: 20px !important;\r\n}\r\n.editor-styles-wrapper .lzb-pr-label-tag {\r\n  display: inline-flex !important;\r\n  align-items: center !important;\r\n  padding: 6px 16px !important;\r\n  border-radius: 30px !important;\r\n  font-size: 13.6px !important;\r\n  font-weight: 700 !important;\r\n}\r\n\r\n.editor-styles-wrapper .lzb-pr-title {\r\n  font-size: 25.6px !important;\r\n  font-weight: 900 !important;\r\n  line-height: 1.4 !important;\r\n  margin: 0 0 16px 0 !important;\r\n  padding: 0 !important;\r\n  border: none !important;\r\n  background: transparent !important;\r\n}\r\n.editor-styles-wrapper .lzb-pr-desc {\r\n  font-size: 15.2px !important;\r\n  line-height: 1.7 !important;\r\n  margin: 0 0 24px 0 !important;\r\n}\r\n\r\n.editor-styles-wrapper .lzb-pr-features {\r\n  display: flex !important;\r\n  flex-wrap: wrap !important;\r\n  gap: 12px !important;\r\n  margin: 0 0 30px 0 !important;\r\n  padding: 0 !important;\r\n  position: relative !important;\r\n  z-index: 1 !important;\r\n}\r\n.editor-styles-wrapper .lzb-pr-btn-wrap {\r\n  clear: both !important;\r\n  position: relative !important;\r\n  z-index: 1 !important;\r\n  margin-top: 24px !important;\r\n}\r\n.editor-styles-wrapper .lzb-pr-features {\r\n  margin-bottom: 30px !important;\r\n}\r\n.editor-styles-wrapper .lzb-pr-badge {\r\n  display: inline-flex !important;\r\n  align-items: center !important;\r\n  gap: 6px !important;\r\n  padding: 8px 14px !important;\r\n  border-radius: 8px !important;\r\n  font-size: 13.6px !important;\r\n  font-weight: 700 !important;\r\n}\r\n\r\n/* ─── ③ バナーエリア（白フチ消し） ─── */\r\n.editor-styles-wrapper .lzb-pr-banner-container {\r\n  display: block !important;\r\n  margin: 0 0 28px 0 !important;\r\n  text-align: center !important;\r\n  width: 100% !important;\r\n  background: transparent !important;\r\n  padding: 0 !important;\r\n  border: none !important;\r\n}\r\n.editor-styles-wrapper .lzb-pr-btn-wrap {\r\n  margin-top: 28px !important;\r\n}\r\n.editor-styles-wrapper .lzb-pr-banner-container a,\r\n.editor-styles-wrapper .lzb-pr-banner-container div {\r\n  display: inline-block !important;\r\n  max-width: 100% !important;\r\n  background: transparent !important;\r\n  padding: 0 !important;\r\n  margin: 0 !important;\r\n  border: none !important;\r\n}\r\n.editor-styles-wrapper .lzb-pr-banner-container img,\r\n.editor-styles-wrapper .lzb-pr-banner-container iframe {\r\n  max-width: 100% !important;\r\n  height: auto !important;\r\n  border-radius: 8px !important;\r\n  box-shadow: 0 4px 15px rgba(0,0,0,0.1) !important;\r\n  display: block !important;\r\n  margin: 0 auto !important;\r\n  background: transparent !important;\r\n  padding: 0 !important;\r\n  border: none !important;\r\n}\r\n.editor-styles-wrapper .lzb-pr-banner-container img[width=\"1\"],\r\n.editor-styles-wrapper .lzb-pr-banner-container img[height=\"1\"] {\r\n  position: absolute !important;\r\n  width: 1px !important;\r\n  height: 1px !important;\r\n  box-shadow: none !important;\r\n  border-radius: 0 !important;\r\n  margin: 0 !important;\r\n  padding: 0 !important;\r\n  opacity: 0 !important;\r\n  pointer-events: none !important;\r\n}\r\n\r\n/* ─── ④ ボタン ─── */\r\n.editor-styles-wrapper .lzb-pr-btn-wrap {\r\n  text-align: center !important;\r\n  margin-bottom: 12px !important;\r\n}\r\n.editor-styles-wrapper .lzb-pr-btn {\r\n  position: relative !important;\r\n  display: inline-flex !important;\r\n  align-items: center !important;\r\n  justify-content: center !important;\r\n  font-size: 18.4px !important;\r\n  font-weight: 900 !important;\r\n  text-decoration: none !important;\r\n  padding: 18px 40px !important;\r\n  border-radius: 50px !important;\r\n  width: 90% !important;\r\n  max-width: 600px !important;\r\n}\r\n.editor-styles-wrapper .lzb-btn-inner {\r\n  display: flex !important;\r\n  align-items: center !important;\r\n  gap: 8px !important;\r\n}\r\n.editor-styles-wrapper .lzb-pr-note {\r\n  text-align: center !important;\r\n  font-size: 12.8px !important;\r\n  opacity: 0.8 !important;\r\n}\r\n\r\n/* ═══════════════ A: 高級・信頼系 ═══════════════ */\r\n.editor-styles-wrapper .lzb-pr-box--A { background: linear-gradient(135deg, #1c283a 0%, #101825 100%) !important; border: 1px solid #aa9154 !important; }\r\n.editor-styles-wrapper .lzb-pr-box--A .lzb-pr-title { color: #ffffff !important; }\r\n.editor-styles-wrapper .lzb-pr-box--A .lzb-pr-desc,\r\n.editor-styles-wrapper .lzb-pr-box--A .lzb-pr-note { color: #a4b1c6 !important; }\r\n.editor-styles-wrapper .lzb-pr-box--A .lzb-pr-label-tag { background: #dfbc6d !important; color: #101825 !important; }\r\n.editor-styles-wrapper .lzb-pr-box--A .lzb-pr-badge { background: rgba(0,0,0,0.15) !important; color: #dfbc6d !important; border: 1px solid rgba(223, 188, 109, 0.4) !important; }\r\n.editor-styles-wrapper .lzb-pr-box--A .lzb-check-bg { fill: #4ade80 !important; }\r\n.editor-styles-wrapper .lzb-pr-box--A .lzb-pr-btn { background: #dfbc6d !important; color: #101825 !important; border-radius: 8px !important; }\r\n.editor-styles-wrapper .lzb-pr-box--A .lzb-pr-btn svg { stroke: #101825 !important; }\r\n\r\n/* ═══════════════ B: 勢い・お得系 ═══════════════ */\r\n.editor-styles-wrapper .lzb-pr-box--B { background: #fff5f5 !important; border: 3px solid #ff4500 !important; }\r\n.editor-styles-wrapper .lzb-pr-box--B .lzb-pr-title { color: #c23300 !important; }\r\n.editor-styles-wrapper .lzb-pr-box--B .lzb-pr-desc,\r\n.editor-styles-wrapper .lzb-pr-box--B .lzb-pr-note { color: #333333 !important; }\r\n.editor-styles-wrapper .lzb-pr-box--B .lzb-pr-label-tag { background: #ff4500 !important; color: #fff !important; }\r\n.editor-styles-wrapper .lzb-pr-box--B .lzb-pr-badge { background: #ffe4e1 !important; color: #d23600 !important; }\r\n.editor-styles-wrapper .lzb-pr-box--B .lzb-check-bg { fill: #ff4500 !important; }\r\n.editor-styles-wrapper .lzb-pr-box--B .lzb-pr-btn { background: linear-gradient(135deg, #ff4500, #ff8c00) !important; color: #ffffff !important; }\r\n.editor-styles-wrapper .lzb-pr-box--B .lzb-pr-btn svg { stroke: #ffffff !important; }\r\n\r\n/* ═══════════════ C: モダンAI系 ═══════════════ */\r\n.editor-styles-wrapper .lzb-pr-box--C { background: #130f26 !important; border: 1px solid #2d2654 !important; box-shadow: 0 0 25px rgba(0,229,255,0.15) !important; }\r\n.editor-styles-wrapper .lzb-pr-box--C .lzb-pr-title { color: #ffffff !important; }\r\n.editor-styles-wrapper .lzb-pr-box--C .lzb-pr-desc,\r\n.editor-styles-wrapper .lzb-pr-box--C .lzb-pr-note { color: #b3c5e5 !important; }\r\n.editor-styles-wrapper .lzb-pr-box--C .lzb-pr-label-tag { background: #00e5ff !important; color: #130f26 !important; }\r\n.editor-styles-wrapper .lzb-pr-box--C .lzb-pr-badge { background: rgba(0,229,255,0.1) !important; color: #00e5ff !important; border: 1px solid rgba(0,229,255,0.3) !important; }\r\n.editor-styles-wrapper .lzb-pr-box--C .lzb-check-bg { fill: #00e5ff !important; }\r\n.editor-styles-wrapper .lzb-pr-box--C .lzb-pr-btn { background: linear-gradient(135deg, #7b2cbf, #00e5ff) !important; color: #ffffff !important; }\r\n.editor-styles-wrapper .lzb-pr-box--C .lzb-pr-btn svg { stroke: #ffffff !important; }\r\n\r\n/* ═══════════════ D: ガラスモーフィズム ═══════════════ */\r\n.editor-styles-wrapper .lzb-pr-box--D { background: linear-gradient(135deg, #6c88d8 0%, #aa7cd8 50%, #e98be1 100%) !important; color: #ffffff !important; border-radius: 16px !important; border: 1px solid rgba(255,255,255,0.2) !important; }\r\n.editor-styles-wrapper .lzb-pr-box--D .lzb-pr-title { color: #ffffff !important; }\r\n.editor-styles-wrapper .lzb-pr-box--D .lzb-pr-desc,\r\n.editor-styles-wrapper .lzb-pr-box--D .lzb-pr-note { color: #ffffff !important; }\r\n.editor-styles-wrapper .lzb-pr-box--D .lzb-pr-label-tag,\r\n.editor-styles-wrapper .lzb-pr-box--D .lzb-pr-badge { background: rgba(255,255,255,0.2) !important; border: 1px solid rgba(255,255,255,0.4) !important; color: #ffffff !important; }\r\n.editor-styles-wrapper .lzb-pr-box--D .lzb-check-bg { fill: #4ade80 !important; }\r\n.editor-styles-wrapper .lzb-pr-box--D .lzb-pr-btn { background: #ffffff !important; color: #48249a !important; border-radius: 12px !important; }\r\n.editor-styles-wrapper .lzb-pr-box--D .lzb-pr-btn svg { stroke: #48249a !important; }\r\n\r\n/* ═══════════════ E: ネオブルータリズム ═══════════════ */\r\n.editor-styles-wrapper .lzb-pr-box--E { background: #ffde59 !important; border: 4px solid #000 !important; border-radius: 0 !important; }\r\n.editor-styles-wrapper .lzb-pr-box--E .lzb-pr-title { color: #000000 !important; font-weight: 900 !important; }\r\n.editor-styles-wrapper .lzb-pr-box--E .lzb-pr-desc,\r\n.editor-styles-wrapper .lzb-pr-box--E .lzb-pr-note { color: #1a1a1a !important; font-weight: bold !important; }\r\n.editor-styles-wrapper .lzb-pr-box--E .lzb-pr-label-tag { background: #000 !important; color: #fff !important; border-radius: 0 !important; }\r\n.editor-styles-wrapper .lzb-pr-box--E .lzb-pr-badge { background: #fff !important; color: #000 !important; border: 2px solid #000 !important; border-radius: 0 !important; }\r\n.editor-styles-wrapper .lzb-pr-box--E .lzb-check-bg { fill: #000 !important; }\r\n.editor-styles-wrapper .lzb-pr-box--E .lzb-pr-btn { background: #ff385c !important; color: #ffffff !important; border: 3px solid #000 !important; border-radius: 0 !important; }\r\n.editor-styles-wrapper .lzb-pr-box--E .lzb-pr-btn svg { stroke: #ffffff !important; }\r\n\r\n/* ═══════════════ F: グラデーション波形 ═══════════════ */\r\n.editor-styles-wrapper .lzb-pr-box--F { background: linear-gradient(135deg, #fff3e0, #fce4ec) !important; border: none !important; border-radius: 30px !important; }\r\n.editor-styles-wrapper .lzb-pr-box--F .lzb-pr-title { color: #4e342e !important; }\r\n.editor-styles-wrapper .lzb-pr-box--F .lzb-pr-desc,\r\n.editor-styles-wrapper .lzb-pr-box--F .lzb-pr-note { color: #5d4037 !important; }\r\n.editor-styles-wrapper .lzb-pr-box--F .lzb-pr-label-tag { background: #ff8a65 !important; color: #fff !important; }\r\n.editor-styles-wrapper .lzb-pr-box--F .lzb-pr-badge { background: #fff !important; color: #ff8a65 !important; }\r\n.editor-styles-wrapper .lzb-pr-box--F .lzb-check-bg { fill: #ff8a65 !important; }\r\n.editor-styles-wrapper .lzb-pr-box--F .lzb-pr-btn { background: linear-gradient(135deg, #ff8a65, #f48fb1) !important; color: #ffffff !important; border-radius: 30px !important; }\r\n.editor-styles-wrapper .lzb-pr-box--F .lzb-pr-btn svg { stroke: #ffffff !important; }"
    },
    "script": {
      "view": "document.addEventListener('DOMContentLoaded', function() {\r\n  const rippleButtons = document.querySelectorAll('.js-lzb-ripple');\r\n  rippleButtons.forEach(button => {\r\n    button.addEventListener('click', function (e) {\r\n      const rect = e.target.getBoundingClientRect();\r\n      const x = e.clientX - rect.left;\r\n      const y = e.clientY - rect.top;\r\n      const ripple = document.createElement('span');\r\n      const diameter = Math.max(rect.width, rect.height) * 1.8;\r\n      ripple.style.left = x + 'px';\r\n      ripple.style.top = y + 'px';\r\n      ripple.style.width = diameter + 'px';\r\n      ripple.style.height = diameter + 'px';\r\n      ripple.style.position = 'absolute';\r\n      ripple.style.background = 'rgba(255, 255, 255, 0.4)';\r\n      ripple.style.transform = 'translate(-50%, -50%) scale(0)';\r\n      ripple.style.borderRadius = '50%';\r\n      ripple.style.pointerEvents = 'none';\r\n      ripple.style.animation = 'lzb-ripple-anim 0.6s linear';\r\n      this.appendChild(ripple);\r\n      setTimeout(() => { ripple.remove(); }, 600);\r\n    });\r\n  });\r\n});"
    },
    "styles": [],
    "condition": [],
    "edit_url": null,
    "provide_context_to_blocks": "",
    "custom_context_slug": "",
    "allowed_blocks": "",
    "ancestor": ""
  }
]