/* 公式サイトの下のページ（配信・動画ガイドライン、お知らせ）で共有する見た目。色と書体は /wazato/press/ にそろえる */
:root{
  --navy:#123a58; --navy-2:#0b2a42; --ink:#1d2b38;
  --cream:#fff6e6; --paper:#fffdf7;
  --sun:#ffd23f; --coral-2:#c8321f; --sky:#3db8f5; --mint:#3fd3a6;
  --line:3px solid var(--navy);
  --pop-s:4px 4px 0 var(--navy);
  --round:"WZ Rounded","Hiragino Maru Gothic ProN",system-ui,sans-serif;
  --body:"WZ Body","Hiragino Sans",system-ui,sans-serif;
  --gut:clamp(16px,4vw,48px);
}
@font-face{font-family:"WZ Rounded";src:url(/fonts/mplus-rounded-1c-black.woff2) format("woff2");font-weight:800 900;font-display:swap}
@font-face{font-family:"WZ Body";src:url(/fonts/mplus2-regular.woff2) format("woff2");font-weight:400;font-display:swap}
@font-face{font-family:"WZ Body";src:url(/fonts/mplus2-bold.woff2) format("woff2");font-weight:700;font-display:swap}
*{box-sizing:border-box}
html{overflow-x:clip}
body{margin:0;background:var(--cream);color:var(--ink);font-family:var(--body);font-size:16px;line-height:1.85;-webkit-font-smoothing:antialiased}
img{display:block;max-width:100%;height:auto}
a{color:inherit}
a:focus-visible{outline:3px solid var(--navy);outline-offset:3px}
.ftr a:focus-visible{outline-color:var(--sun)}
h1,h2,h3{font-family:var(--round);font-weight:900;line-height:1.3;margin:0;word-break:auto-phrase;text-wrap:balance}
p,dd{margin:0;word-break:auto-phrase}
.wrap{width:min(960px,100%);margin-inline:auto;padding-inline:var(--gut)}

.hdr{background:var(--cream);border-bottom:var(--line)}
.hdr__in{display:flex;align-items:center;justify-content:space-between;height:68px}
.hdr__logo img{height:40px;width:auto}
.pill{font-family:var(--round);font-weight:900;font-size:14px;text-decoration:none;padding:6px 16px;border:var(--line);border-radius:999px;background:#fff;box-shadow:var(--pop-s)}
.pill:hover{background:var(--sun)}

/* 冒頭の帯は紺の地に白と黄色の文字（水色の地では白い文字が 2.2:1 しか取れないため） */
.hero{background:var(--navy);color:#fff;padding-block:clamp(56px,8vw,96px);border-bottom:6px solid var(--sky);background-image:radial-gradient(rgba(255,255,255,.08) 2px,transparent 2.5px);background-size:22px 22px}
.eyebrow{display:inline-block;font-family:var(--round);font-weight:900;font-size:13px;letter-spacing:.18em;color:var(--navy);background:var(--sun);padding:4px 14px;border-radius:999px;transform:rotate(-3deg)}
.hero h1{margin-top:16px;font-size:clamp(36px,6.4vw,68px);text-shadow:0 4px 0 var(--navy-2)}
.lead{margin-top:20px;max-width:40em;font-size:clamp(16px,1.8vw,19px);font-weight:700}
.lead strong{color:var(--sun)}

.sec{padding-block:clamp(48px,7vw,80px)}
.sec--tint{background:var(--paper);border-block:var(--line)}
.title{display:flex;align-items:center;flex-wrap:wrap;gap:12px;font-size:clamp(24px,3.6vw,36px);color:var(--navy)}
.mark{font-size:.55em;letter-spacing:.06em;padding:.2em .8em;border:var(--line);border-radius:999px;box-shadow:var(--pop-s);color:var(--navy)}
.mark--ok{background:var(--mint)}
.mark--ask{background:var(--sun)}
.mark--ng{background:var(--coral-2);color:#fff}

.cards{list-style:none;margin:28px 0 0;padding:0;display:grid;grid-template-columns:repeat(auto-fill,minmax(min(100%,260px),1fr));gap:18px}
.cards--one{grid-template-columns:1fr}
.cards li{background:#fff;border:var(--line);border-radius:18px;padding:20px 22px;box-shadow:var(--pop-s)}
.cards h3{font-size:18px;color:var(--navy);margin-bottom:6px}
.cards a{color:var(--navy);font-weight:700}

.note{margin-top:22px;font-size:14px;color:var(--ink)}

.faq{margin:24px 0 0}
.faq dt{font-family:var(--round);font-weight:900;color:var(--navy);font-size:17px;margin-top:20px}
.faq dt::before{content:"Q. ";color:var(--coral-2)}
.faq dd{margin-top:4px;padding-left:1.6em}

.contact{margin-top:36px;text-align:center;background:var(--navy);color:#fff;border-radius:18px;padding:24px 16px}
.contact p{font-family:var(--round);font-weight:900;font-size:14px;letter-spacing:.1em}
.contact a{display:inline-block;margin-top:4px;font-family:var(--round);font-weight:900;font-size:clamp(18px,3vw,24px);color:var(--sun);overflow-wrap:anywhere}

.ftr{background:var(--navy-2);color:rgba(255,255,255,.85);padding:40px 0 32px;font-size:13px}
.ftr nav{display:flex;flex-wrap:wrap;gap:8px 22px}
.ftr nav a{font-family:var(--round);font-weight:800;text-decoration:none;font-size:14px}
.ftr nav a:hover{color:var(--sun)}
.ftr small{display:block;margin-top:20px}

/* ---------- お知らせ（/wazato/news/） ---------- */
.btn{display:inline-flex;align-items:center;gap:.5em;margin-top:28px;padding:.8em 1.8em;border:var(--line);border-radius:999px;background:var(--sun);color:var(--navy);font-family:var(--round);font-weight:900;font-size:clamp(16px,2vw,19px);text-decoration:none;box-shadow:var(--pop-s);transition:transform .15s}
.btn:hover{transform:translate(-2px,-2px)}
.btn:focus-visible{outline-color:var(--sun)}
.sec .btn:focus-visible{outline-color:var(--navy)}
.hero .hl{color:var(--sun)}
.date{display:block;margin-top:14px;font-family:var(--round);font-weight:900;color:var(--sun);letter-spacing:.06em}
.tag{display:inline-block;font-family:var(--round);font-weight:900;font-size:12px;line-height:1.6;padding:1px 10px;border:2px solid var(--navy);border-radius:999px;background:var(--sun);color:var(--navy)}

.news{list-style:none;margin:0;padding:0;display:grid;gap:14px}
.news a{display:flex;flex-wrap:wrap;align-items:center;gap:6px 14px;background:#fff;border:var(--line);border-radius:18px;padding:16px 22px;box-shadow:var(--pop-s);text-decoration:none;color:var(--navy);transition:transform .15s}
.news a:hover{transform:translate(-2px,-2px)}
.news time{font-family:var(--round);font-weight:900;font-size:14px}
.news b{flex:1 1 16em;font-family:var(--round);font-weight:900;font-size:18px}

.facts{margin:24px 0 0;display:grid;grid-template-columns:auto 1fr;background:#fff;border:var(--line);border-radius:18px;box-shadow:var(--pop-s);overflow:hidden}
.facts dt,.facts dd{margin:0;padding:14px 22px;border-top:2px dashed rgba(18,58,88,.18)}
.facts dt{font-family:var(--round);font-weight:900;color:var(--navy);white-space:nowrap}
.facts dd{font-weight:700;min-width:0;overflow-wrap:anywhere}
.facts dt:first-of-type,.facts dd:first-of-type{border-top:0}
.facts a{color:var(--navy)}
@media (max-width:560px){.facts{grid-template-columns:1fr}.facts dt{padding-bottom:2px}.facts dd{border-top:0;padding-top:0}}

.steps{counter-reset:step;list-style:none;margin:24px 0 0;padding:0;display:grid;gap:14px}
.steps li{counter-increment:step;display:flex;align-items:center;gap:16px;background:#fff;border:var(--line);border-radius:18px;padding:16px 22px;box-shadow:var(--pop-s);font-weight:700}
.steps li::before{content:counter(step);flex:none;width:42px;height:42px;display:grid;place-items:center;border:var(--line);border-radius:50%;background:var(--sun);font-family:var(--round);font-weight:900;font-size:20px;color:var(--navy)}
.steps strong{font-family:var(--round);font-weight:900;color:var(--navy)}

.notes{margin:20px 0 0;padding-left:1.3em;font-size:15px}
.notes li+li{margin-top:6px}
.notes a{color:var(--navy);font-weight:700}

/* X の埋め込み（読み込み前・読み込めないときは引用カードとして見せる） */
.tweet{margin-top:20px;max-width:550px}
.tweet .twitter-tweet{margin:0!important}
.tweet blockquote{background:#fff;border:var(--line);border-radius:18px;padding:18px 22px;box-shadow:var(--pop-s);font-size:15px}
.tweet blockquote a{color:var(--navy);font-weight:700}
