﻿    :root{
      --wb-green:#008663;
      --wb-orange:#ef6c00;
      --wb-bg:#fff;
      --wb-text:#1a1a1a;
      --wb-muted:#5a5a5a;
      --wb-card:#f7fbfa;
    }
    body{font-family:"Yu Gothic UI","Hiragino Kaku Gothic ProN","Meiryo",sans-serif;line-height:1.9;margin:0;background:var(--wb-bg);color:var(--wb-text)}
    .wb-container{max-width:1100px;margin:auto;padding:18px}
    .wb-header{background:var(--wb-green);color:#fff}
    .wb-header .wb-container{padding:26px 18px}
    h1{font-size:clamp(22px,3.4vw,34px);margin:0 0 6px;font-weight:800}
    .wb-lead{font-size:clamp(15px,2.2vw,18px);margin:0}

    .wb-grid{display:grid;grid-template-columns:1fr;gap:16px;margin:22px 0}
    @media (min-width:720px){.wb-grid{grid-template-columns:repeat(2,1fr)}}
    @media (min-width:1024px){.wb-grid{grid-template-columns:repeat(3,1fr)}}

    .wb-card{background:var(--wb-card);border:2px solid #e0ece8;border-radius:14px;box-shadow:0 6px 14px rgba(0,0,0,.06);display:flex;flex-direction:column;overflow:hidden}
    .wb-card img{width:100%;height:auto;display:block}
    .wb-card-title{font-size:clamp(16px,2.4vw,20px);font-weight:900;margin:12px 16px 4px}
    .wb-card-desc{color:var(--wb-muted);padding:0 16px 8px;font-size:clamp(14px,2vw,16px)}
    .wb-card-actions{margin-top:auto;padding:12px 16px}
    .wb-link{display:inline-block;box-sizing:border-box;width:100%;text-align:center;border:2px solid var(--wb-green);color:var(--wb-green);border-radius:10px;padding:12px 10px;font-weight:800;text-decoration:underline}
    .wb-link::after{content:" ▶";}
    .wb-link:hover{background:var(--wb-green);color:#fff;text-decoration:none}

    .wb-sec h2{font-size:clamp(18px,2.6vw,22px);margin:8px 0 4px;padding-left:10px;border-left:8px solid var(--wb-green)}
    @media (max-width:420px){body{font-size:18px}}
    .wb-footer{padding:24px 18px;color:#555;background:#f5f7f7;font-size:14px}
      .wb-intro{background:#f0f9f6;border:2px solid #d7ebe4;border-radius:14px;padding:16px 18px;margin:18px 0}
    .wb-intro h2{font-size:clamp(18px,2.6vw,22px);margin:0 0 8px;padding-left:10px;border-left:8px solid var(--wb-green)}
    .wb-intro p{margin:8px 0;color:#2b2b2b}
    .wb-intro-list{display:grid;grid-template-columns:1fr;gap:8px;margin:10px 0 0;padding:0;list-style:none}
    .wb-intro-list li{background:#fff;border:1px solid #e0ece8;border-radius:10px;padding:10px 12px}
    .wb-intro-list a{color:var(--wb-green);font-weight:800;text-decoration:underline;text-underline-offset:3px}
    @media(min-width:700px){.wb-intro-list{grid-template-columns:repeat(2,1fr)}}
