ロゴ・ブランド資産
EcAuth のロゴマークと、EC-CUBE オーナーズストア提出用の商品紹介画像（アイコン・バナー）の正典。派生プラグイン（EC-CUBE 2系 / 4.1系 / 4.4系 等）のリリース時は、ここのマスター SVG から派生版を作成する。
概要
ec-auth.io で使用している 🔐 絵文字を置き換える正式なロゴマークとして、ブランドカラーのグラデーションによる南京錠マークを定義する。すべてのアセットは html/assets/logo/ 配下にあり、SVG がマスター（ソース・オブ・トゥルース）、PNG は SVG からの生成物。PNG を直接編集しない。
アイコン・バナーは EC-CUBE の 商品紹介画像 作成ガイドライン（GL01 Ver.1.01） に準拠する。要件の要約は後述。
プレビュー
| アセット | プレビュー | 備考 |
|---|---|---|
| ロゴマーク（マスター） |  |
背景透過 SVG。白背景・淡色背景用のポジ版（青）。ブルー背景上では白反転版を使う（アイコン・バナー内に埋め込み済み）。 |
| 商品紹介アイコン |  |
原寸 50×50px。マークは各辺 5px の余白内（40×40px）。 |
| 商品紹介バナー |  |
原寸 338×252px。サービス名「EcAuth」を明記。コンテンツは各辺 15px の余白内（308×222px）。 |
| 商品紹介バナー（EC-CUBE 2系） |  |
マスターの派生版。左下の円形バッジで対応バージョン（2.17/2.25）を表示。バッジはマーケットプレイス慣習に合わせコーナーに食い込ませ、白リング + ローズ系グラデーション（#fb7185→#e11d48）で青背景から浮かせる。説明文はバッジと重ならないよう右側スペースの中央に配置。 |
| 商品紹介バナー（EC-CUBE 4.0/4.1系） |  |
EC-CUBE 2系対応版からの派生。変更はバッジ内の対応バージョン表記のみ（2.17/2.25 → 4.0/4.1、文字数が減るぶん上段の font-size だけ 16 → 18）。ec-cube4-ecauth の 4.0 ブランチ（プラグインコード EcAuthLogin40）向け。 |
ブランドカラー
すべて ec-auth.io の CSS カスタムプロパティ由来。ロゴのために新色は導入しない。
| 色 | 値 | 由来 | 用途 |
|---|---|---|---|
| Primary | #1a56db | --color-primary | グラデーション始点、白背景上のマーク |
| Primary Dark | #1240a8 | --color-primary-dark | グラデーション終点、シャックル、鍵穴（白マーク時） |
| White | #ffffff | --color-bg | ブルー背景上のマーク・テキスト |
アセット一覧（html/assets/logo/）
| ファイル | 種別 | 用途 |
|---|---|---|
ecauth-mark.svg | マスター | ロゴマーク単体（青・透過）。favicon・資料・サイトへの流用元 |
ecauth-icon-50.svg | マスター | 商品紹介アイコンのソース |
ecauth-icon-50.png / @2x.png | 生成物 | オーナーズストア提出用アイコン（50×50 / 確認用 100×100） |
ecauth-banner-338x252.svg | マスター | 商品紹介バナーのソース。派生版はこれを複製して作る |
ecauth-banner-338x252.png / @2x.png | 生成物 | オーナーズストア提出用バナー（338×252 / 確認用 676×504） |
ecauth-banner-338x252-eccube2.svg | 派生版 | EC-CUBE 2系（2.17/2.25）対応バッジ付きバナーのソース。対応バージョン変更時はバッジ内 <text> のみ更新する |
ecauth-banner-338x252-eccube2.png / @2x.png | 生成物 | ec-cube2-ecauth のオーナーズストア提出用バナー |
ecauth-banner-338x252-eccube40.svg | 派生版 | EC-CUBE 4.0/4.1系対応バッジ付きバナーのソース。-eccube2 版の複製。対応バージョン変更時はバッジ内 <text> のみ更新する |
ecauth-banner-338x252-eccube40.png / @2x.png | 生成物 | ec-cube4-ecauth（4.0 ブランチ / EcAuthLogin40）のオーナーズストア提出用バナー |
EC-CUBE ガイドライン要件（GL01 Ver.1.01 要約）
| 項目 | バナー | アイコン |
|---|---|---|
| 外形 | 338×252px | 50×50px |
| コンテンツ余白 | 外枠から各辺 15px（内寸 308×222px） | 外枠から各辺 5px（内寸 40×40px） |
| 商品名 | 必須（または連想キーワード） | —（ブランドが一目でわかるイメージ） |
| 形状 | 長方形のまま変形しない（角丸・丸型禁止）、外枠線なし、静止画 | |
| 禁止事項 | 「＊＊%引き」「キャンペーン中」等のセールス文言 | |
バナーの説明文は「EC-CUBE向けパスキー認証」のような機能説明のみとする。「5ユーザーまで無料」等の価格・キャンペーン訴求はガイドラインのセールス文言禁止規定に抵触しうるため記載しない。
派生版の作成手順（EC-CUBE 2系 / 4.0/4.1系 / 4.4系 等）
アイコンはバージョン文言を含まないため全派生版で共通流用できる。バナーのみ、対象バージョンごとに派生版を作る。
対応バージョンは左下の円形バッジで示す（-eccube2 版で確立した形式）。説明文は全派生版で「EC-CUBE向けパスキー認証」に揃え、バージョン表記はバッジだけが担う。したがって派生元はマスターではなく既存のバッジ付き派生版とし、バッジの文字だけを差し替える。
- 既存のバッジ付き派生版（例
ecauth-banner-338x252-eccube2.svg）を命名規則（下表）に従って複製する。 - 複製した SVG のバッジ内の対応バージョン
<text>だけを変更する。マーク・サービス名・説明文・レイアウト・配色は変更しない。文字数が変わって収まりが悪いときに限り、その<text>のfont-sizeを調整する。 rsvg-convertで PNG（原寸と @2x）を出力し、バッジの文字が円からはみ出していないかを @2x で目視確認する。
diff で派生元と比べ、変更がコメント・バッジ <text> 以外に及んでいないことを確認するとよい。
# 例: EC-CUBE 4.0/4.1 系向けバナーの派生（実際にこの手順で作成した）
cd html/assets/logo
cp ecauth-banner-338x252-eccube2.svg ecauth-banner-338x252-eccube40.svg
# → バッジ内の「2.17/2.25」を「4.0/4.1」に変更
# （7 文字に減って余白が空くため、その <text> の font-size のみ 16 → 18）
rsvg-convert -w 338 -h 252 ecauth-banner-338x252-eccube40.svg -o ecauth-banner-338x252-eccube40.png
rsvg-convert -w 676 -h 504 ecauth-banner-338x252-eccube40.svg -o ecauth-banner-338x252-eccube40@2x.png
# 派生元との差分がコメントとバッジ <text> だけであることを確認する
diff -u ecauth-banner-338x252-eccube2.svg ecauth-banner-338x252-eccube40.svg| 対象 | ファイル名サフィックス | バッジ表記 | 状態 |
|---|---|---|---|
| 汎用（マスター） | なし | なし | あり |
| EC-CUBE 2系 | -eccube2 | 2.17/2.25 | あり |
| EC-CUBE 4.0/4.1系 | -eccube40 | 4.0/4.1 | あり |
| EC-CUBE 4.2/4.3系 | -eccube43 | 4.2/4.3 | 未作成（現状はマスターを流用） |
サフィックスはプラグイン側の識別子に合わせる（-eccube40 は ec-cube4-ecauth の 4.0 ブランチ・プラグインコード EcAuthLogin40・リリースタグ 4.0-* に対応）。バッジ表記のほうは利用者が見る対応バージョンなので、識別子と一致しなくてよい（-eccube40 のバッジは「4.0/4.1」）。
バナー SVG のテキストはフォント参照（サービス名: Noto Sans Bold / 説明文: Noto Sans JP → Noto Sans CJK JP → UDEV Gothic の順でフォールバック）でレンダリングされる。PNG を出力する環境に欧文の Noto Sans と、フォールバック候補のいずれかの和文ゴシックがインストールされていることを確認する。フォントが無い環境で出力すると字形が変わるため、出力後は必ず目視確認する。