/* HP全ページ共通：ふわふわ動くカラフルなドット背景（ブログと同じ） */
html { background: #EEF8F6; }
body, body.d, body.d.g, body.d.g.h.i { background: transparent !important; }
html::before, html::after { content: ""; position: fixed; left: 0; right: 0; top: -560px; bottom: 0; z-index: -1; pointer-events: none; will-change: transform; }
html::before { background-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22400%22 height=%22400%22%3E%3Ccircle cx=%2255%22 cy=%2270%22 r=%2222%22 fill=%22%235FC0BF%22 fill-opacity=%22.10%22/%3E%3Ccircle cx=%22240%22 cy=%2240%22 r=%2213%22 fill=%22%23F7C948%22 fill-opacity=%22.14%22/%3E%3Ccircle cx=%22345%22 cy=%22150%22 r=%2226%22 fill=%22%235FC0BF%22 fill-opacity=%22.08%22/%3E%3Ccircle cx=%22140%22 cy=%22205%22 r=%2215%22 fill=%22%23F4A6B5%22 fill-opacity=%22.14%22/%3E%3Ccircle cx=%22300%22 cy=%22305%22 r=%2220%22 fill=%22%235FC0BF%22 fill-opacity=%22.10%22/%3E%3Ccircle cx=%2270%22 cy=%22335%22 r=%2228%22 fill=%22%23F7C948%22 fill-opacity=%22.09%22/%3E%3Ccircle cx=%22195%22 cy=%22370%22 r=%2210%22 fill=%22%235FC0BF%22 fill-opacity=%22.13%22/%3E%3C/svg%3E"); background-size: 400px 400px; animation: bgdrift1 70s linear infinite; }
html::after  { background-image: url("data:image/svg+xml,%3Csvg xmlns=%22http://www.w3.org/2000/svg%22 width=%22560%22 height=%22560%22%3E%3Ccircle cx=%2290%22 cy=%22130%22 r=%2238%22 fill=%22%235FC0BF%22 fill-opacity=%22.055%22/%3E%3Ccircle cx=%22390%22 cy=%2275%22 r=%2224%22 fill=%22%23F4A6B5%22 fill-opacity=%22.09%22/%3E%3Ccircle cx=%22490%22 cy=%22320%22 r=%2242%22 fill=%22%23F7C948%22 fill-opacity=%22.06%22/%3E%3Ccircle cx=%22220%22 cy=%22390%22 r=%2228%22 fill=%22%235FC0BF%22 fill-opacity=%22.07%22/%3E%3Ccircle cx=%2260%22 cy=%22490%22 r=%2220%22 fill=%22%23F4A6B5%22 fill-opacity=%22.10%22/%3E%3C/svg%3E"); background-size: 560px 560px; animation: bgdrift2 110s linear infinite; }
@keyframes bgdrift1 { from { transform: translate(0, -400px); } to { transform: translate(0, 0); } }
@keyframes bgdrift2 { from { transform: translate(0, 0); } to { transform: translate(0, -560px); } }
@media (prefers-reduced-motion: reduce) { html::before, html::after { animation: none; } }
/* 白ベタの帯を透明にして、背景のドットが見えるようにする */
body .e-sec-white, body .e-sec-a, body .section, body.d.g .g-hero-v2 { background: transparent !important; }
