.blog-root{--ink:#18222c;--ink-soft:#4a5560;--muted:#8a93a0;--blue:#0e86d9;--blue-soft:#1fa3e5;--mist:#f2f9fe;--mist-2:#e9f2fc;--line:#dbe6ee;--gold:#f0b429;--navy-900:#0e1b2e;--ease:cubic-bezier(0.2,0.7,0.2,1);--header-h:84px;--maru:var(--font-noto-sans-jp),"Noto Sans JP",sans-serif;color:var(--ink);font-family:var(--maru)}.blog-root .wrap{max-width:1120px;margin:0 auto;padding:0 clamp(20px,5vw,40px)}.blog-root .section{padding:clamp(48px,7vw,96px) 0}.blog-root .num{font-feature-settings:"tnum";font-variant-numeric:tabular-nums}.blog-root .arr{display:inline-block}.blog-root .page-hero{padding-top:calc(var(--header-h) + clamp(56px, 9vw, 120px));padding-bottom:clamp(40px,6vw,80px);background:linear-gradient(180deg,var(--mist) 0,#fff 100%);position:relative;overflow:hidden}.blog-root .page-hero:after{content:"◇";position:absolute;right:2%;top:12%;font-size:clamp(160px,22vw,320px);line-height:.8;color:rgba(31,163,229,.07);pointer-events:none}.blog-root .page-hero .wrap{position:relative;z-index:2}.blog-root .eyebrow{font-size:13px;font-weight:800;letter-spacing:.14em;text-transform:uppercase;color:var(--blue)}.blog-root .eyebrow .jp{font-weight:700;letter-spacing:.04em;color:var(--muted);text-transform:none}.blog-root .page-title{font-size:clamp(32px,5.5vw,64px);font-weight:900;line-height:1.16;margin:18px 0 0;color:var(--ink)}.blog-root .lead{font-size:clamp(14px,1.6vw,17px);line-height:1.95;color:var(--ink-soft)}.blog-root .page-hero-lead{max-width:58ch;margin-top:clamp(20px,3vw,34px)}.blog-root .blog-list-sec{padding-top:clamp(36px,5vw,64px)}.blog-root .blog-cats{display:flex;flex-wrap:wrap;gap:10px;margin-bottom:clamp(28px,3.4vw,44px)}.blog-root .blog-cat-chip{font-size:14px;font-weight:700;color:var(--ink-soft);background:var(--mist-2);padding:9px 20px;border-radius:999px;text-decoration:none;transition:background .25s,color .25s}.blog-root .blog-cat-chip:hover{background:rgba(14,134,217,.12);color:var(--blue)}.blog-root .blog-cat-chip.is-active{background:linear-gradient(135deg,#2eb4f2,#0e86d9);color:#fff}.blog-root .blog-empty{color:var(--ink-soft);font-size:16px;text-align:center;padding:60px 0}.blog-root .blog-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);grid-gap:clamp(22px,3vw,36px);gap:clamp(22px,3vw,36px)}.blog-root .blog-card{display:flex;flex-direction:column;height:100%;color:var(--ink);text-decoration:none;background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 10px 30px rgba(18,86,148,.08);transition:transform .35s var(--ease),box-shadow .35s var(--ease)}.blog-root .blog-card:hover{transform:translateY(-6px);box-shadow:0 22px 46px rgba(18,86,148,.16)}.blog-root .blog-thumb{position:relative;aspect-ratio:1200/630;overflow:hidden;background:linear-gradient(135deg,#eaf1fb,#eeeaf8);display:flex;align-items:center;justify-content:center}.blog-root .blog-thumb img{width:100%;height:100%;object-fit:cover;transition:transform .4s var(--ease)}.blog-root .blog-card:hover .blog-thumb img{transform:scale(1.04)}.blog-root .blog-thumb-ph{font-size:56px;color:hsla(37,42%,63%,.5)}.blog-root .blog-meta{display:flex;align-items:center;gap:12px;margin:18px 20px 0}.blog-root .blog-date{font-size:13px;letter-spacing:.04em;color:var(--muted);font-weight:600}.blog-root .blog-cat{font-size:11px;font-weight:700;letter-spacing:.04em;color:var(--blue);background:var(--mist-2);padding:4px 12px;border-radius:999px}.blog-root .blog-card-title{font-size:clamp(17px,1.4vw,20px);font-weight:800;line-height:1.5;margin:10px 20px 0;color:var(--ink)}.blog-root .blog-card-excerpt{font-size:14px;line-height:1.8;color:var(--ink-soft);margin:10px 20px 0}.blog-root .blog-card-go{margin:16px 20px 22px;font-size:14px;font-weight:700;color:var(--blue);display:inline-flex;align-items:center;gap:.5em}.blog-root .blog-card-go .arr{transition:transform .35s var(--ease)}.blog-root .blog-card:hover .blog-card-go .arr{transform:translateX(4px)}@media (max-width:860px){.blog-root .blog-grid{grid-template-columns:1fr 1fr}}@media (max-width:560px){.blog-root .blog-grid{grid-template-columns:1fr}}.blog-root .blog-detail,.blog-root.blog-detail{padding-bottom:clamp(70px,9vw,130px)}.blog-root .blog-detail-hero{padding-top:calc(var(--header-h) + clamp(40px, 6vw, 90px));padding-bottom:clamp(28px,4vw,48px);background:linear-gradient(180deg,var(--mist) 0,#fff 100%)}.blog-root .blog-detail-hero>.wrap,.blog-root .blog-detail-thumb,.blog-root .blog-detail>.wrap{max-width:1000px}.blog-root .blog-back{display:inline-flex;align-items:center;gap:.5em;font-size:14px;font-weight:700;color:var(--blue);text-decoration:none;margin-bottom:24px}.blog-root .blog-back .arr{transition:transform .35s var(--ease)}.blog-root .blog-back:hover .arr{transform:translateX(-4px)}.blog-root .blog-detail-meta{display:flex;align-items:center;gap:12px;margin-bottom:16px}.blog-root .blog-detail-title{font-size:clamp(26px,3.4vw,44px);font-weight:900;line-height:1.4}.blog-root .blog-detail-thumb{margin:clamp(28px,4vw,48px) auto 0}.blog-root .blog-detail-thumb img{width:100%;height:auto;display:block;border-radius:20px}.blog-root .blog-toc{max-width:1000px;margin:clamp(32px,4vw,48px) auto 0;border:1.5px solid var(--blue);border-radius:18px;padding:clamp(20px,2.6vw,30px) clamp(22px,3vw,40px);background:#fff}.blog-root .blog-toc-head{display:flex;align-items:center;justify-content:center;gap:10px;font-size:18px;font-weight:900;color:var(--ink);margin:0 0 16px}.blog-root .blog-toc-icon{display:inline-flex;align-items:center;justify-content:center;width:26px;height:26px;border-radius:50%;background:var(--blue);color:#fff;font-size:15px}.blog-root .blog-toc-list{list-style:none;counter-reset:toc;margin:0;padding:0;display:flex;flex-direction:column;gap:10px}.blog-root .blog-toc-list .is-main{counter-increment:toc;position:relative;padding-left:1.8em}.blog-root .blog-toc-list .is-main:before{content:counter(toc) ".";position:absolute;left:0;color:var(--blue);font-weight:800}.blog-root .blog-toc-list .is-sub{position:relative;padding-left:2.8em}.blog-root .blog-toc-list .is-sub:before{content:"・";position:absolute;left:1.4em;color:var(--blue)}.blog-root .blog-toc-list a{color:var(--ink);font-weight:700;line-height:1.6;text-decoration:none;transition:color .2s}.blog-root .blog-toc-list .is-sub a{font-weight:500;color:var(--ink-soft)}.blog-root .blog-toc-list a:hover{color:var(--blue)}.blog-root .blog-body{max-width:1000px;margin:clamp(36px,5vw,64px) auto 0;font-size:16px;line-height:2.05;color:var(--ink)}.blog-root .blog-body :is(h2,h3){scroll-margin-top:calc(var(--header-h) + 18px)}.blog-root .blog-body h2{font-size:clamp(22px,2vw,30px);font-weight:900;margin:1.8em 0 .7em;line-height:1.45;padding-left:.6em;border-left:6px solid var(--blue)}.blog-root .blog-body h3{font-size:clamp(19px,1.6vw,24px);font-weight:700;margin:1.6em 0 .6em}.blog-root .blog-body p{margin-bottom:1.4em;color:#333;font-size:15px}.blog-root .blog-body a{color:var(--blue);text-decoration:underline;text-underline-offset:3px}.blog-root .blog-body figure{margin:1.6em 0}.blog-root .blog-body figcaption{margin-top:.6em;font-size:14px;color:var(--ink-soft);text-align:center}.blog-root .blog-body img{max-width:100%;height:auto;border-radius:14px;margin:1.2em 0}.blog-root .blog-body ol,.blog-root .blog-body ul{margin:0 0 1.4em 1.4em;display:flex;flex-direction:column;gap:.5em}.blog-root .blog-body li{line-height:1.9}.blog-root .blog-body .table-wrap{overflow-x:auto;margin:1.6em 0}.blog-root .blog-body table{width:100%;border-collapse:collapse;font-size:14px;line-height:1.7}.blog-root .blog-body td,.blog-root .blog-body th{border:1px solid var(--line);padding:10px 14px;text-align:left;vertical-align:top}.blog-root .blog-body th{background:var(--mist);font-weight:700;color:var(--ink);white-space:nowrap}.blog-root .blog-body blockquote{border-left:3px solid var(--blue);padding:.4em 0 .4em 1.2em;margin:1.4em 0;color:var(--ink-soft)}.blog-root .blog-body code{background:var(--mist);padding:.15em .45em;border-radius:6px;font-size:.92em}.blog-root .blog-body pre{background:var(--navy-900);color:#fff;padding:20px;border-radius:12px;overflow:auto;margin:1.4em 0}.blog-root .blog-body pre code{background:none;padding:0}.blog-root .blog-osusume{max-width:1000px;margin:clamp(48px,6vw,80px) auto 0;background:#ffeef5;border-radius:28px;padding:clamp(28px,4vw,56px) clamp(22px,4vw,56px)}.blog-root .blog-osusume-head{font-size:clamp(24px,2.6vw,34px);font-weight:900;color:#fd4b91;letter-spacing:.02em;margin:0 0 clamp(22px,2.8vw,34px)}.blog-root .blog-osusume-grid{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,1fr);grid-gap:clamp(18px,2.4vw,28px);gap:clamp(18px,2.4vw,28px)}.blog-root .blog-osusume-card{display:flex;flex-direction:column;color:var(--ink);text-decoration:none;background:#fff;border-radius:18px;overflow:hidden;box-shadow:0 14px 36px -22px rgba(253,75,145,.5);transition:transform .35s var(--ease),box-shadow .35s var(--ease)}.blog-root .blog-osusume-card:hover{transform:translateY(-5px);box-shadow:0 26px 54px -24px rgba(253,75,145,.55)}.blog-root .blog-osusume-thumb{aspect-ratio:1200/630;overflow:hidden;background:var(--mist);display:flex;align-items:center;justify-content:center}.blog-root .blog-osusume-thumb img{width:100%;height:100%;object-fit:cover}.blog-root .blog-osusume-date{font-size:12px;color:var(--muted);margin:14px 16px 4px}.blog-root .blog-osusume-name{font-size:14px;font-weight:700;line-height:1.6;color:var(--ink);margin:0 16px 16px}.blog-root .blog-osusume-foot{display:flex;justify-content:center;margin-top:clamp(26px,3vw,38px)}.blog-root .btn--ink,.blog-root .osusume-btn{display:inline-flex;align-items:center;gap:.6em;background:#fd4b91;color:#fff;font-weight:800;text-decoration:none;padding:15px 36px;border-radius:999px;box-shadow:0 16px 34px -16px rgba(253,75,145,.7);transition:transform .3s var(--ease),box-shadow .3s}.blog-root .btn--ink{background:linear-gradient(135deg,#2eb4f2,#0e86d9);box-shadow:0 10px 24px rgba(14,134,217,.32)}.blog-root .osusume-btn:hover{transform:translateY(-2px);box-shadow:0 22px 44px -16px rgba(253,75,145,.8)}.blog-root .btn--ink .arr,.blog-root .osusume-btn .arr{transition:transform .3s var(--ease)}.blog-root .btn--ink:hover .arr,.blog-root .osusume-btn:hover .arr{transform:translateX(4px)}@media (max-width:760px){.blog-root .blog-osusume-grid{grid-template-columns:1fr}}.blog-root .blog-detail-foot{max-width:1000px;margin:clamp(40px,5vw,64px) auto 0;display:flex;justify-content:center}.blog-root .draft-banner{position:-webkit-sticky;position:sticky;top:0;z-index:60;background:var(--gold);color:var(--navy-900);text-align:center;font-size:13px;font-weight:700;padding:10px 16px}.blog-root .draft-banner a{text-decoration:underline}