/* ── 📌 255px専用：本物の画像を表示するためのCSS設定 ── */
        .cert-image-255 {
            width: 100%;
            /* 実際のサイズ（903x647）の比率を完全に維持 */
            aspect-ratio: 903 / 647; 
            /* 画像が歪むのを防ぐ */
            object-fit: cover; 
            border-radius: 4px;
            /* 額縁のようなゴールドの細線（デザインB・Cでは上書き・変更しています） */
            border: 1px solid #d4af37;
            /* 白い賞状が背景と同化しないよう、うっすら影を落とす */
            box-shadow: 0 4px 12px rgba(0,0,0,0.12);
            box-sizing: border-box;
        }

        /* 共通：255px固定コンテナ */
        .sidebar-card-255 {
            width: 255px;
            background: #ffffff;
            border-radius: 8px;
            box-sizing: border-box;
            overflow: hidden;
            display: flex;
            flex-direction: column;
            box-shadow: 0 4px 12px rgba(0,0,0,0.05);
        }

        .card-body {
            padding: 20px 15px;
            display: flex;
            flex-direction: column;
            flex-grow: 1;
        }

        /* テキスト系の共通調整 */
        .m-badge {
            font-size: 10px;
            font-weight: bold;
            text-align: center;
            margin-bottom: 12px;
            padding: 4px 6px;
            border-radius: 3px;
        }
        .m-title {
            font-size: 14px;
            font-weight: bold;
            line-height: 1.4;
            margin: 0 0 12px 0;
            text-align: center;
        }
        .m-desc {
            font-size: 12px;
            color: #4a5568;
            line-height: 1.6;
            margin: 0 0 15px 0;
            text-align: justify;
        }
        .m-btn {
            display: block;
            text-align: center;
            text-decoration: none;
            font-size: 12px;
            font-weight: bold;
            padding: 10px;
            border-radius: 4px;
            margin-top: auto;
            transition: opacity 0.2s;
        }
        .m-btn:hover { opacity: 0.9; }
        .m-legal {
            font-size: 9px;
            color: #94a3b8;
            padding: 8px 15px;
            text-align: center;
            border-top: 1px solid #f1f5f9;
            background: #fafafa;
        }

        /* ==========================================
           A：【正統派・クリーン】
        ========================================== */
        .style-a { border: 1px solid #e2e8f0; }
        .style-a .m-badge { background: #1e3a8a; color: #fff; }
        .style-a .m-title { color: #1e3a8a; border-bottom: 1px solid #e2e8f0; padding-bottom: 8px; }
        .style-a .m-btn { background: #1e3a8a; color: #fff; }

        /* ==========================================
           B：【高級感・ゴールド枠】
        ========================================== */
        .style-b { border: 2px solid #d4af37; background: #fffdf9; }
        .style-b .m-badge { border: 1px solid #b89214; color: #b89214; background: transparent; }
        .style-b .m-title { color: #111827; }
        .style-b .m-btn { background: #b89214; color: #fff; box-shadow: 0 2px 6px rgba(184,146,20,0.3); }

        /* ==========================================
           C：【親しみ・カジュアル】
        ========================================== */
        .style-c { border: 1px solid #cbd5e1; border-radius: 12px; }
        .style-c .m-badge { background: #e6fffa; color: #0d9488; }
        .style-c .m-title { color: #0f172a; }
        .style-c .m-btn { background: #0d9488; color: #fff; border-radius: 20px; }
        /* カジュアル版はゴールド枠線を消し、シンプルなグレーの細線にしてスッキリさせます */
        .style-c .cert-image-255 { border: 1px solid #cbd5e1; box-shadow: none; }