/* ============================================================
   パターンA：企業オウンドメディア型（参考：a-gent magazine）
   青 #0075c2 / 淡青 #6c9cd0 / 橙 #f0841a / Zen Kaku Gothic New
   ============================================================ */
:root{/* フォントは本番 waltsu.co.jp（common.css の --font-jp / --font-en）と同じ指定 */--blue:#036EB8;--blue-d:#025a96;--blue-l:#3b8ccb;--blue-pale:#e8f1f9;--blue-band:#dbe8f4;--navy:#0a2540;--orange:#F29D00;--orange-d:#d58a00;--cta:#C23219;--cta-d:#9b2614;--text:#1a1a1a;--muted:#6b7280;--gray:#f3f4f6;--border:#dfe3e8;--white:#fff;--radius:10px;--w:1200px;--en:"Lato","Zen Kaku Gothic New","Helvetica Neue",Arial,sans-serif;--ja:"Zen Kaku Gothic New","游ゴシック体",YuGothic,"游ゴシック Medium","Yu Gothic Medium","Yu Gothic","Helvetica Neue",Arial,sans-serif;--shadow:0 6px 24px rgba(0,60,120,.08)}
*,*::before,*::after{box-sizing:border-box}
html{scroll-behavior:smooth;-webkit-text-size-adjust:100%}
body{margin:0;font-family:var(--ja);color:var(--text);background:var(--white);line-height:1.7;font-size:16px;overflow-x:clip}
body.is-drawer{overflow:hidden}
img{max-width:100%;height:auto;display:block}
a{color:var(--blue);text-decoration:none}
a:hover{text-decoration:underline}
h1,h2,h3,h4{line-height:1.4;margin:0;font-weight:700}
p{margin:0 0 1em}
ul,ol{margin:0;padding:0;list-style:none}
button{font:inherit;cursor:pointer}
input,select,textarea{font:inherit}
.vh{position:absolute!important;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip:rect(0 0 0 0);white-space:nowrap;border:0}
.skip{position:absolute;left:8px;top:-60px;background:var(--blue);color:#fff;padding:8px 14px;border-radius:6px;z-index:1000}
.skip:focus{top:8px}
.btn{display:inline-flex;align-items:center;justify-content:center;gap:8px;padding:10px 26px;border-radius:999px;font-weight:700;color:#fff!important;background:var(--blue-l);border:0;text-decoration:none!important;transition:.2s;white-space:nowrap}
.btn:hover{filter:brightness(1.07);transform:translateY(-1px)}
.btn--blue{background:var(--blue)}.btn--orange{background:var(--orange)}.btn--cta{background:var(--cta)}.btn--cta:hover{background:var(--cta-d)}
.btn--lg{padding:16px 40px;font-size:17px}
.btn svg{flex:none}
.more{display:inline-flex;align-items:center;gap:12px;font-family:var(--en);font-weight:900;letter-spacing:.1em;color:var(--text);text-decoration:underline;text-underline-offset:6px}
.more__c{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;border-radius:50%;background:#222;color:#fff}

/* ---------- ロゴ ---------- */
.logo{display:inline-flex;align-items:center;gap:10px;text-decoration:none!important}
.logo__img{height:32px;width:auto;display:block}
.logo__sub{font-family:var(--en);font-weight:900;font-size:11px;letter-spacing:.3em;color:#fff;background:var(--navy);border-radius:4px;padding:3px 8px 2px;line-height:1}
h1,h2,h3{color:var(--navy)}
/* ---------- ヘッダー ---------- */
.site-header{position:sticky;top:0;z-index:100;background:#fff;box-shadow:0 2px 10px rgba(0,0,0,.05)}
.site-header__in{max-width:1360px;height:100px;box-sizing:border-box;margin:0 auto;padding:0 32px;display:flex;align-items:center;justify-content:space-between;gap:24px}
.site-header__l{display:flex;align-items:center;gap:25px}
.site-header__tag{margin:0;font-size:14px;font-weight:500;line-height:1.8;letter-spacing:normal;color:var(--text)}
.site-header__tag .sp-br{display:none}
/* ヘッダー用：ロゴの下に magazine のバー */
.logo--stack{flex-direction:column;align-items:stretch;gap:6px}
.logo--stack .logo__img{height:38px}
.logo__bar{display:block;text-align:center;font-family:var(--en);font-weight:700;font-size:13px;letter-spacing:.08em;line-height:1;color:#fff;background:#6f9fd4;border-radius:999px;padding:5px 0 6px}
.logo__bar--cat{font-family:var(--ja);letter-spacing:.04em;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;padding-left:8px;padding-right:8px}
.site-header__r{display:flex;flex-direction:column;align-items:flex-end;justify-content:flex-end;align-self:stretch;gap:6px;padding-bottom:10px}
.site-header__tools{display:flex;align-items:center;gap:12px}
.hsearch,.dsearch,.ssearch{display:flex;align-items:center;background:var(--gray);border-radius:999px;padding:0 6px 0 16px;height:38px;width:220px}
.hsearch input,.dsearch input,.ssearch input{border:0;background:transparent;width:100%;outline:none;font-size:14px}
.hsearch button,.dsearch button,.ssearch button{border:0;background:transparent;color:var(--muted);display:inline-flex;padding:6px}
.hbtns,.dbtns{display:flex;gap:10px}
.hbtns .btn{padding:8px 16px;width:196px;justify-content:center;text-align:center}
.gnav>ul{display:flex;gap:28px}
.gnav__item{position:relative}
.gnav__item>a{display:block;padding:4px 0 0;line-height:1.5;font-weight:700;color:var(--text);font-size:14px}
.gnav__item>a:hover{text-decoration:none;color:var(--text)}
.gnav__mega{position:absolute;right:0;top:100%;padding-top:8px;opacity:0;visibility:hidden;transform:translateY(6px);transition:.2s;z-index:50}
/* ヘッダーのカテゴリーはマウスを乗せても何も出さない（ユーザー指示 2026-10-21）。サブメニューは非表示のまま */
.gnav__mega{display:none}
.gnav__mega-in{background:#fff;border:1px solid var(--border);border-radius:var(--radius);box-shadow:var(--shadow);padding:18px 22px;width:560px}
.gnav__mega-t{margin:0 0 10px;font-weight:700;font-size:14px}
.gnav__mega-t a{display:inline-flex;align-items:center;gap:6px}
.gnav__mega ul{display:grid;grid-template-columns:repeat(2,1fr);gap:4px 20px}
.gnav__mega li a{display:block;padding:6px 0 6px 14px;font-size:14px;color:var(--text);position:relative}
.gnav__mega li a::before{content:"";position:absolute;left:0;top:50%;width:6px;height:6px;border-top:2px solid var(--blue-l);border-right:2px solid var(--blue-l);transform:translateY(-50%) rotate(45deg)}
.drawer__open{display:none;border:0;background:transparent;color:var(--blue);padding:6px}
.site-header__chips{display:none}

/* ---------- ドロワー（SP） ---------- */
.drawer{position:fixed;inset:0;z-index:200}
.drawer__bg{position:absolute;inset:0;background:rgba(0,30,60,.5);border:0;opacity:0;transition:.25s}
.drawer__panel{position:absolute;z-index:1;top:0;right:0;width:min(88vw,380px);height:100%;background:#fff;overflow:auto;padding:16px 20px 100px;transform:translateX(100%);transition:.25s}
.drawer.is-open .drawer__bg{opacity:1}.drawer.is-open .drawer__panel{transform:none}
.drawer__head{display:flex;align-items:center;justify-content:space-between;margin-bottom:14px}
.drawer__close{border:0;background:transparent;color:var(--text)}
.dsearch{width:100%;margin-bottom:12px}
.dbtns{margin-bottom:18px}.dbtns .btn{flex:1}
.drawer__cats>li{border-top:1px solid var(--border)}
.drawer__cat{display:block;padding:12px 0 6px;font-weight:700;color:var(--text)}
.drawer__cats ul{display:flex;flex-wrap:wrap;gap:6px;padding-bottom:12px}
.drawer__cats ul a{display:inline-block;font-size:13px;padding:5px 12px;background:var(--blue-pale);border-radius:999px;color:var(--blue-d)}
.drawer__links{border-top:1px solid var(--border);padding-top:14px;display:flex;flex-wrap:wrap;gap:8px 18px;font-size:14px}

/* ---------- 共通セクション ---------- */
.sec{padding:72px 0}
.sec__in{max-width:var(--w);margin:0 auto;padding:0 24px}
.sec__in--narrow{max-width:1000px}
.sec__head{display:flex;flex-wrap:wrap;align-items:flex-end;gap:8px 24px;margin-bottom:32px;position:relative}
.sec__en{font-family:var(--en);font-weight:900;letter-spacing:.2em;font-size:13px;color:var(--blue-l);margin:0;width:100%}
.sec__h{font-size:32px;letter-spacing:.04em}
.sec__h--sm{font-size:22px;margin:32px 0 16px}
.sec__more{margin-left:auto;color:var(--text);text-decoration:underline;text-underline-offset:4px;font-weight:700;font-size:14px}
.grid{display:grid;gap:28px}
.grid--4{grid-template-columns:repeat(4,1fr)}.grid--3{grid-template-columns:repeat(3,1fr)}.grid--2{grid-template-columns:repeat(2,1fr)}

/* ---------- カード ---------- */
.card{display:flex;flex-direction:column;gap:12px}
.card__img{display:block;box-sizing:content-box;border:2px solid var(--blue-l);border-radius:8px;overflow:hidden;aspect-ratio:8/5;background:var(--gray)}
.card__img img{width:100%;height:100%;object-fit:cover;transition:.3s}
.card:hover .card__img img{transform:scale(1.04)}
.card__t{font-size:16px;line-height:1.55}
.card__t a{color:var(--text)}
.card__meta{display:flex;align-items:center;justify-content:space-between;gap:10px;margin-top:auto;font-size:13px}
.card__cat{color:var(--blue);font-size:13px;font-weight:700}
.card__date{color:var(--muted);font-family:var(--en)}
.card--hero .card__img{aspect-ratio:8/5}
.card--hero .card__t{font-size:22px}
.card--list{flex-direction:row;gap:20px;align-items:center}
.card--list .card__img{width:230px;flex:none}

/* ---------- トップ：注目記事 ---------- */
.featured{background:var(--gray);padding:34px 0}
.featured__in{max-width:1360px;margin:0 auto;padding:0 32px;display:grid;grid-template-columns:1fr 1fr;gap:24px}
.featured .card--hero{background:#fff;border-radius:var(--radius);padding:18px}
.featured .card--hero .card__img{border-width:4px}
.featured__grid{display:grid;grid-template-columns:1fr 1fr;gap:20px}
.featured__grid .card{background:#fff;border-radius:var(--radius);padding:12px}
.featured__grid .card__t{font-size:15px}

/* ---------- CTAバンド ---------- */
.ctaband{background:var(--blue-band);padding:40px 0}
.ctaband__in{max-width:var(--w);margin:0 auto;padding:0 24px;display:grid;grid-template-columns:1fr 1fr;gap:32px}
.ctaband__card{display:block;border-radius:14px;overflow:hidden;transition:.2s}
.ctaband__card:hover{transform:translateY(-3px);box-shadow:var(--shadow)}
.ctaband__card img{display:block;width:100%;height:auto;aspect-ratio:1120/400}

/* ---------- カテゴリーグリッド ---------- */
.sec--cat .sec__in{background:var(--blue-pale);border-radius:20px;padding:48px}
.catgrid{display:flex;flex-direction:column;gap:14px}
.catgrid__row{display:grid;grid-template-columns:200px 1fr;background:#fff;border-radius:10px;overflow:hidden;min-height:110px}
.catgrid__cat{display:flex;align-items:center;gap:12px;background:var(--navy);color:#fff;font-weight:700;font-size:17px;padding:16px 24px;text-decoration:none!important}
.catgrid__cat:hover{background:var(--blue)}
.catgrid__subs{display:grid;grid-template-columns:repeat(4,1fr);gap:4px 10px;padding:18px 28px;align-content:center}
.catgrid__subs a{display:inline-flex;align-items:center;gap:8px;color:var(--text);font-size:15px;padding:4px 0}
.catgrid__subs a svg{color:var(--blue-l);flex:none}
.catgrid__subs a:hover{color:var(--blue)}

/* ---------- ランキング ---------- */
.sec--rank .sec__head{justify-content:center;text-align:center}
.sec--rank .sec__en{text-align:center}
.tabs__nav{display:flex;margin-bottom:28px}
.tabs__nav [role=tab]{flex:1;border:0;background:transparent;padding:12px;font-weight:700;color:#aaa;border-bottom:3px solid #ddd}
.tabs__nav [role=tab][aria-selected=true]{color:var(--blue);border-bottom-color:var(--blue-l)}
.rank__list{display:flex;flex-direction:column;gap:16px;counter-reset:rank}
.rank__item{position:relative;display:grid;grid-template-columns:230px 1fr 40px;gap:24px;align-items:center;border:1px solid var(--border);border-radius:8px;padding:16px 20px;background:#fff}
.rank__no{position:absolute;left:14px;top:-6px;width:28px;height:36px;background:#6c9cd0;color:#fff;font-family:var(--en);font-weight:900;display:flex;align-items:center;justify-content:center;clip-path:polygon(0 0,100% 0,100% 100%,50% 82%,0 100%);z-index:2;font-size:14px}
.rank__item:nth-child(1) .rank__no{background:#e9b949}.rank__item:nth-child(2) .rank__no{background:#9ca3af}.rank__item:nth-child(3) .rank__no{background:#c98a4b}
.rank__img{display:block;box-sizing:content-box;border:2px solid var(--blue-l);border-radius:6px;overflow:hidden;aspect-ratio:8/5}
.rank__img img{width:100%;height:100%;object-fit:cover}
.rank__body time{font-family:var(--en);font-size:12px;color:var(--muted);display:block}
.rank__t{font-size:17px;margin:4px 0 8px}
.rank__t a{color:var(--text)}
.rank__arrow{color:var(--blue);display:flex;justify-content:center}

/* ---------- 編集チーム ---------- */
.team{padding:80px 0;border-top:1px solid var(--border)}
.team__in{max-width:var(--w);margin:0 auto;padding:0 24px;display:grid;grid-template-columns:minmax(0,360px) minmax(0,1fr);gap:56px;align-items:start}
.team__intro{position:sticky;top:104px}
.team__intro .sec__h{font-size:26px;margin-bottom:18px}
.team__lead{font-size:14px;color:#374151;margin-bottom:28px}
.team__flow{display:grid;gap:0;margin:0 0 32px}
.team__flow li{display:grid;grid-template-columns:36px 1fr;gap:14px;position:relative;padding-bottom:20px}
.team__flow li:last-child{padding-bottom:0}
.team__flow li:not(:last-child)::before{content:"";position:absolute;left:17px;top:38px;bottom:2px;width:2px;background:var(--blue-band)}
.team__no{display:flex;align-items:center;justify-content:center;width:36px;height:36px;border-radius:50%;background:var(--navy);color:#fff;font-family:var(--en);font-weight:900;font-size:13px;letter-spacing:.04em}
.team__flow strong{display:block;font-size:15px;line-height:1.5;margin:6px 0 2px}
.team__flow span:not(.team__no){display:block;font-size:13px;color:var(--muted);line-height:1.7}
.team__links{display:flex;flex-wrap:wrap;align-items:center;gap:14px 28px}
.team__policy{font-size:13px;font-weight:700;color:var(--blue-d);text-decoration:underline;text-underline-offset:4px}
.team__grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:20px}
.tcard{display:flex}
.tcard__a{display:grid;grid-template-columns:80px minmax(0,1fr);gap:18px;width:100%;padding:24px;background:#fff;border:1px solid var(--border);border-radius:14px;color:var(--text);transition:transform .18s,border-color .18s}
.tcard__a:hover{text-decoration:none;transform:translateY(-3px);border-color:var(--blue-l)}
.tcard__a:focus-visible{outline:3px solid var(--blue-l);outline-offset:3px}
.tcard__img img{width:80px;height:80px;border-radius:10px;object-fit:cover}
.tcard__body{display:flex;flex-direction:column;align-items:flex-start;min-width:0}
.tcard__role{font-size:12px;font-weight:700;color:var(--blue-d);letter-spacing:.04em;line-height:1.5;margin-bottom:2px}
.tcard__name{font-size:19px;font-weight:700;line-height:1.4;margin-bottom:8px}
.tcard__name small{display:inline-block;margin-left:10px;font-family:var(--en);font-size:11px;font-weight:700;letter-spacing:.06em;color:var(--muted)}
.tcard__bio{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;overflow:hidden;font-size:13px;line-height:1.8;color:#374151;margin-bottom:12px}
.tcard__tags{display:flex;flex-wrap:wrap;gap:6px;flex:1;min-width:0}
.tcard__tags span{font-size:11px;font-weight:700;background:var(--blue-pale);color:var(--blue-d);border-radius:4px;padding:2px 8px}
.tcard__foot{display:flex;align-items:flex-end;gap:12px;width:100%;margin-top:auto}
.tcard__go{display:inline-flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:50%;background:#222;color:#fff;margin-left:auto;flex:none;transition:background .18s}
.tcard__go svg{width:14px;height:14px}
.tcard__a:hover .tcard__go{background:var(--blue)}

/* ---------- ABOUT ---------- */
.about{background:var(--blue-band);padding:72px 0}
.about .sec__h{color:var(--blue);font-size:28px}
.about__lead{max-width:none;margin-bottom:32px}
.about__cards{display:grid;grid-template-columns:repeat(3,1fr);gap:28px}
.about__card{background:#fff;border-radius:14px;padding:36px 28px;display:flex;flex-direction:column;align-items:center;text-align:center;gap:18px}
.about__card .logo{pointer-events:none}
.about__t{font-weight:700;font-size:24px;color:var(--blue);min-height:44px;display:flex;align-items:center}
.about__card p{font-size:14px;text-align:left;margin:0;flex:1}

/* ---------- フッター ---------- */
.site-footer{padding:0;background:#fff;border-top:1px solid var(--border)}
.site-footer__in{max-width:var(--w);margin:0 auto;padding:0 24px}
.site-footer__top{border-bottom:1px solid var(--border)}
.site-footer__top .site-footer__in{display:flex;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:24px 32px;padding-top:48px;padding-bottom:40px}
.site-footer__brand{display:flex;align-items:center;gap:28px}
.site-footer__tag{margin:0;font-size:14px;font-weight:500;line-height:2;letter-spacing:.04em;white-space:nowrap}
.site-footer__co{font-style:normal;font-size:13px;line-height:2;display:flex;flex-direction:column}
.site-footer__co strong{font-size:14px;letter-spacing:.12em}
.site-footer__mid{display:grid;grid-template-columns:1fr;gap:40px;padding-top:48px;padding-bottom:40px}
.site-footer__cols{display:grid;grid-template-columns:repeat(5,1fr);gap:24px}
.site-footer__ct{margin:0 0 16px;font-weight:700;font-size:16px}
.site-footer__ct a{color:var(--text);display:inline-flex;align-items:center;gap:8px;white-space:nowrap;text-decoration:none!important}
.site-footer__ct svg{color:var(--blue-l);width:14px;height:14px;flex:none}
.site-footer__col ul{list-style:none;margin:0;padding:0}
.site-footer__col li>a,.site-footer__col li>.soon{display:block;font-size:13px;line-height:1.6;color:var(--text);padding:6px 0 6px 16px;position:relative;letter-spacing:.04em}
.site-footer__col li>.soon{color:#9aa3ad}
.site-footer__col li>a::before,.site-footer__col li>.soon::before{content:"-";position:absolute;left:0;color:var(--muted)}
.site-footer__cta{display:flex;flex-direction:row;justify-content:flex-end;gap:14px;margin-left:auto}
.site-footer__cta .site-footer__btn{width:240px}
.site-footer__btn{display:flex;align-items:center;justify-content:center;position:relative;height:56px;border-radius:999px;background:var(--blue);color:#fff!important;font-weight:700;font-size:16px;letter-spacing:.08em;text-decoration:none!important;transition:.2s}
.site-footer__btn svg{position:absolute;right:22px;width:18px;height:18px}
.site-footer__btn:hover{background:var(--blue-d)}
.site-footer__btn--cta{background:var(--cta)}
.site-footer__btn--cta:hover{background:var(--cta-d)}
.site-footer__bottom{display:flex;justify-content:space-between;align-items:center;gap:20px;padding-top:20px;padding-bottom:28px;border-top:1px solid var(--border)}
.site-footer__links ul{list-style:none;margin:0;padding:0;display:flex;flex-wrap:wrap;gap:6px 20px;font-size:12px}
.site-footer__links a{color:var(--muted)}
.site-footer__copy{margin:0;font-family:var(--en);font-size:11px;color:#b0b6bd;white-space:nowrap}
.site-footer__demo{text-align:center;font-size:11px;color:#b0b6bd;margin:0;padding:0 24px 24px}
.fixcta{display:none}

/* ---------- 内側ページ共通 ---------- */
.bcbar{background:var(--gray);padding:10px 0}
.bc{max-width:1360px;margin:0 auto;padding:0 32px}
.bc ol{display:flex;flex-wrap:wrap;gap:4px 8px;font-size:12px}
.bc li{display:flex;align-items:center;gap:8px;color:var(--muted)}
.bc li+li::before{content:"›";color:#aaa}
.bc a{color:var(--muted)}
.layout{max-width:1360px;margin:0 auto;padding:48px 32px 80px;display:grid;grid-template-columns:minmax(0,1fr) 320px;gap:56px;align-items:start}
.main{min-width:0}

/* サイドバー */
.side{display:flex;flex-direction:column;gap:28px;position:sticky;top:120px}
.side__cta{display:flex;flex-direction:column;align-items:center;gap:6px;background:#fff;border:1px solid var(--border);border-radius:12px;padding:0 20px 20px;text-align:center;color:var(--text);text-decoration:none!important;overflow:hidden}
.side__cta img{margin:0 -20px 10px;width:calc(100% + 40px);max-width:none;aspect-ratio:8/5;object-fit:cover}
.side__cta-l{font-family:var(--en);font-size:11px;letter-spacing:.15em;background:var(--blue-pale);color:var(--blue);padding:3px 14px;border-radius:999px}
.side__cta-l--o{background:#fff3e6;color:var(--orange-d)}
.side__cta strong{font-size:22px}
.side__cta .btn{width:100%;margin-top:10px;border-radius:8px}
.side__box{border:1px solid var(--border);border-radius:12px;overflow:hidden;background:#fff}
.side__h{background:var(--navy);color:#fff;font-size:15px;padding:10px 16px}
.side__box>*:not(.side__h){margin:16px}
.ssearch{width:auto;background:#fff;border:1px solid var(--border)}
.side__tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:-6px!important}
.side__tags a{font-size:12px;background:var(--gray);border-radius:999px;padding:3px 10px;color:var(--text)}
.side__rec li+li{margin-top:12px}
.side__rec a{display:grid;grid-template-columns:110px 1fr;gap:12px;align-items:center;color:var(--text);font-size:13px;font-weight:700;line-height:1.5}
.side__rec img{box-sizing:content-box;width:calc(100% - 4px);height:auto;border:2px solid var(--blue-l);border-radius:6px;aspect-ratio:8/5;object-fit:cover}
.side__cats a{display:block;padding:8px 0 8px 16px;border-bottom:1px dashed var(--border);color:var(--text);font-size:14px;position:relative}
.side__cats a::before{content:"";position:absolute;left:2px;top:50%;width:6px;height:6px;border-top:2px solid var(--blue-l);border-right:2px solid var(--blue-l);transform:translateY(-50%) rotate(45deg)}

/* 記事 */
.post{min-width:0}
.post__t{font-size:32px;line-height:1.5;margin-bottom:16px}
.post__meta{display:flex;flex-wrap:wrap;gap:6px 18px;font-size:13px;color:var(--muted);align-items:center}
.post__dl{display:inline-block;background:var(--gray);border-radius:4px;padding:1px 6px;margin-right:6px;font-size:11px;color:var(--text)}
.post__cats a{display:inline-block;background:var(--blue-pale);color:var(--blue-d);border-radius:4px;padding:1px 8px;margin-right:6px;font-size:12px;font-weight:700}
.post__read{color:#999}
.byline{display:flex;flex-wrap:wrap;gap:12px 28px;margin:16px 0 22px;padding:12px 16px;background:var(--gray);border-radius:8px}
.byline__p{display:flex;align-items:center;gap:10px;color:var(--text);font-size:14px;font-weight:700;line-height:1.3}
.byline__p img{width:40px;height:40px;border-radius:50%;object-fit:cover}
.byline__p small{display:block;font-size:10px;color:var(--muted);font-weight:400}
.byline__p em{display:block;font-style:normal;font-size:11px;color:var(--muted);font-weight:400}
.post__eye{margin:0 0 28px}
.post__eye img{box-sizing:content-box;border:3px solid var(--blue-l);border-radius:8px;width:calc(100% - 6px);height:auto;aspect-ratio:8/5;object-fit:cover}
.post__lead{font-size:17px}
.summary{background:var(--blue-pale);border:2px solid var(--blue-l);border-radius:10px;padding:20px 24px;margin:28px 0}
.summary__h{font-size:17px;color:var(--blue);margin-bottom:10px;display:flex;align-items:center;gap:8px}
.summary__h::before{content:"";width:10px;height:10px;background:var(--blue-l);border-radius:2px;transform:rotate(45deg)}
.summary li{position:relative;padding-left:26px;margin:6px 0;font-weight:500}
.summary li::before{content:"✓";position:absolute;left:4px;color:var(--blue);font-weight:900}
.toc{background:#fdfdf6;border:1px solid var(--blue-l);border-radius:4px;padding:16px 24px;margin:28px 0 40px}
.toc__head{display:flex;align-items:center;gap:16px;font-weight:700;border-bottom:1px solid #ddd;padding-bottom:10px;margin-bottom:10px}
.toc__btn{border:0;background:transparent;color:var(--blue);font-size:12px;margin-left:auto}
.toc__list{counter-reset:toc}
.toc__l2{counter-increment:toc;display:flex;gap:14px;padding:6px 0;font-size:15px}
.toc__l2::before{content:counter(toc);color:#aaa;font-family:var(--en);font-weight:700;width:14px;text-align:right}
.toc__l3{padding:2px 0 2px 40px;font-size:13px}
.toc__l3::before{content:"－";color:#bbb;margin-right:6px}
.toc a{color:var(--blue-d);text-decoration:none}
.toc a:hover{color:var(--blue);text-decoration:none}
.post__body{font-size:16px}
.post__body h2{background:var(--navy);color:#fff;font-size:22px;padding:16px 22px;border-radius:6px;margin:56px 0 24px;position:relative;scroll-margin-top:100px}
.post__body h2::after{content:"";position:absolute;inset:6px;border:1px dashed rgba(255,255,255,.7);border-radius:4px;pointer-events:none}
.post__body h3{font-size:19px;margin:40px 0 16px;padding-bottom:10px;border-bottom:4px solid transparent;border-image:repeating-linear-gradient(-45deg,var(--blue-l) 0 3px,transparent 3px 6px) 1;scroll-margin-top:100px}
.post__body p{margin:0 0 1.2em}
.post__body strong{background:linear-gradient(transparent 60%,#fef08a 60%)}
.post__body ul,.post__body ol{margin:0 0 1.4em;padding-left:1.5em}
.post__body ul li{list-style:none;position:relative;margin:6px 0}
.post__body ul li::before{content:"";position:absolute;left:-1.3em;top:.75em;width:8px;height:8px;border:2px solid var(--blue-l);border-radius:50%}
.post__body ol li{list-style:decimal;margin:8px 0}
.tbl{overflow-x:auto;margin:0 0 1.6em}
.tbl table{border-collapse:collapse;width:100%;font-size:14px;min-width:520px}
.tbl th,.tbl td{border:1px solid #ddd;padding:12px 14px;text-align:left;vertical-align:top}
.tbl thead th{background:#6b7280;color:#fff;font-weight:700}
.tbl tbody th{background:var(--gray);font-weight:700;white-space:nowrap}
.tbl tbody tr:nth-child(even) td{background:#fafafa}
.tbl--kv th{width:160px}
.point{border:1px solid var(--blue-l);background:var(--blue-pale);border-radius:8px;padding:18px 22px;margin:0 0 1.6em}
.point__t{font-weight:700;color:var(--blue);margin-bottom:6px;display:flex;align-items:center;gap:8px}
.point__t::before{content:"POINT";font-family:var(--en);font-size:10px;letter-spacing:.1em;background:var(--blue);color:#fff;border-radius:3px;padding:2px 6px}
.point p:last-child{margin:0}
.note{font-size:13px;color:var(--muted)}
.fig{margin:0 0 1.8em}
.fig img{border-radius:6px;border:1px solid var(--border);margin:0 auto}
.fig figcaption{font-size:13px;color:var(--muted);text-align:center;margin-top:8px}
.inlink{border:1px solid var(--border);border-left:4px solid var(--blue-l);border-radius:6px;padding:12px 16px;margin:0 0 1.6em;font-size:14px;display:flex;flex-direction:column;gap:4px}
.inlink__l{font-size:11px;font-weight:700;color:var(--muted)}
.inlink a{font-weight:700;text-decoration:underline;text-underline-offset:3px}
.faq{margin:56px 0 0}
.faq h2{font-size:22px;margin-bottom:16px;padding-left:14px;border-left:5px solid var(--blue-l)}
.faq__item{border:1px solid var(--border);border-radius:8px;margin-bottom:12px;background:#fff}
.faq__item summary{list-style:none;cursor:pointer;padding:16px 48px 16px 56px;position:relative;font-weight:700}
.faq__item summary::-webkit-details-marker{display:none}
.faq__item summary::before{content:"Q";position:absolute;left:16px;top:14px;width:28px;height:28px;border-radius:50%;background:var(--blue-l);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--en);font-weight:900;font-size:14px}
.faq__item summary::after{content:"+";position:absolute;right:18px;top:12px;font-size:22px;color:var(--blue-l)}
.faq__item[open] summary::after{content:"−"}
.faq__q{font-size:16px;display:inline}
.faq__a{padding:0 20px 18px 56px;position:relative;font-size:15px}
.faq__a::before{content:"A";position:absolute;left:16px;top:0;width:28px;height:28px;border-radius:50%;background:var(--cta);color:#fff;display:flex;align-items:center;justify-content:center;font-family:var(--en);font-weight:900;font-size:14px}
.faq__a p{margin:0}
.refs{margin:40px 0 0;background:var(--gray);border-radius:8px;padding:18px 22px}
.refs h2{font-size:15px;margin-bottom:8px}
.refs li{font-size:13px;padding-left:1.2em;position:relative}
.refs li::before{content:"・";position:absolute;left:0}
.post__tags{display:flex;flex-wrap:wrap;gap:8px;margin:28px 0 0}
.post__tags a{font-size:13px;background:var(--blue-pale);color:var(--blue-d);border-radius:999px;padding:4px 12px}
.share{display:flex;align-items:center;gap:8px;flex-wrap:wrap;margin:24px 0 32px}
.share__l{font-family:var(--en);font-weight:900;letter-spacing:.1em;font-size:12px;color:var(--muted);margin-right:6px}
.share a,.share button{display:inline-flex;align-items:center;justify-content:center;min-width:76px;padding:8px 14px;border-radius:6px;color:#fff;font-weight:700;font-size:13px;border:0;text-decoration:none!important}
.share__x{background:#111}.share__fb{background:#3b5998}.share__line{background:#06c755}.share__hb{background:#00a4de}.share__copy{background:#6b7280}
.abox{border:2px solid var(--blue-l);border-radius:12px;padding:24px;margin:0 0 40px;position:relative;background:#fff}
.abox__label{position:absolute;top:-14px;left:20px;background:var(--navy);color:#fff;font-size:13px;font-weight:700;padding:3px 14px;border-radius:999px;margin:0}
.abox__in{display:grid;grid-template-columns:120px 1fr;gap:24px;align-items:start}
.abox__img img{border-radius:50%;width:120px;height:120px;object-fit:cover}
.abox__name{font-size:18px;font-weight:700;margin-bottom:6px}
.abox__name a{color:var(--text)}
.abox__name span{display:block;font-size:12px;color:var(--muted);font-weight:400}
.abox__quals{display:flex;flex-wrap:wrap;gap:6px;margin-bottom:10px}
.abox__quals li{font-size:11px;background:var(--blue-pale);color:var(--blue-d);border-radius:4px;padding:2px 8px;font-weight:700}
.abox__bio{font-size:14px;margin-bottom:8px}
.abox__rev{font-size:13px;color:var(--muted);margin-bottom:8px}
.abox__more{font-size:13px;font-weight:700;text-decoration:underline;text-underline-offset:3px}
.postnav{display:grid;grid-template-columns:1fr 1fr;gap:16px;margin:0 0 56px}
.postnav a{display:block;border:1px solid var(--border);border-radius:8px;padding:14px 18px;font-size:14px;font-weight:700;color:var(--text)}
.postnav a small{display:block;font-size:11px;color:var(--muted);font-weight:400}
.postnav__next{text-align:right}
.related .sec__head{margin-bottom:20px}
.related .sec__h{font-size:24px}

.target{border:1px solid var(--border);border-left:5px solid var(--orange);border-radius:6px;padding:14px 18px;margin:0 0 22px;background:#fffdf7}
.target__h{font-weight:700;color:var(--navy);margin:0 0 6px;font-size:15px}
.target li{position:relative;padding-left:18px;font-size:14px;margin:3px 0}
.target li::before{content:"・";position:absolute;left:0;color:var(--orange)}
.goal{background:var(--gray);border-radius:8px;padding:14px 18px;margin:0 0 8px;font-size:14px}
.goal__h{font-weight:700;color:var(--blue);margin:0 0 4px;font-size:14px}
.goal p:last-child{margin:0}
.post__body h4{font-size:17px;margin:28px 0 12px;color:var(--navy)}
.post__body blockquote{margin:0 0 1.4em;padding:14px 18px;border-left:4px solid var(--border);background:var(--gray);color:#444}
.refs__d{font-size:11px;color:var(--muted);margin-left:8px}
.post__source{font-size:12px;color:var(--muted);margin:-24px 0 32px}
/* 一覧 */
.list__head{margin-bottom:32px}
.list__h{font-size:30px;margin-bottom:12px}
.list__pg{font-size:14px;color:var(--muted);font-weight:400;margin-left:8px}
.list__desc{color:#444}
.list__note{margin-top:24px;font-size:14px}
.chips ul{display:flex;flex-wrap:wrap;gap:8px}
.chips a{display:inline-block;font-size:13px;padding:6px 14px;border:1px solid var(--blue-l);color:var(--blue-d);border-radius:999px}
.chips a[aria-current]{background:var(--blue-l);color:#fff}
.empty{background:var(--gray);padding:24px;border-radius:8px;text-align:center}
.pg{display:flex;align-items:center;justify-content:center;gap:12px;margin-top:48px}
.pg ul{display:flex;gap:8px}
.pg li a,.pg li span{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:50%;border:1px solid var(--border);color:var(--text)}
.pg li span{background:var(--blue);color:#fff;border-color:var(--blue)}
.pg__prev,.pg__next{font-weight:700;font-size:14px}

/* ライター一覧・プロフィール */
.acards{display:flex;flex-direction:column;gap:24px}
.acard{display:grid;grid-template-columns:160px 1fr;gap:28px;border:1px solid var(--border);border-radius:12px;padding:28px}
.acard__img img{border-radius:50%;width:160px;height:160px;object-fit:cover}
.acard__n{font-size:22px;margin-bottom:8px}
.acard__n a{color:var(--text)}
.acard__n span{display:block;font-size:13px;color:var(--muted);font-weight:400}
.acard p{font-size:14px}
.profile__head{display:grid;grid-template-columns:200px 1fr;gap:36px;align-items:center;background:var(--blue-pale);border-radius:16px;padding:36px;margin-bottom:36px}
.profile__img img{border-radius:50%;width:200px;height:200px;object-fit:cover;border:4px solid #fff}
.profile__role{color:var(--blue);font-weight:700;margin-bottom:4px}
.profile__n{font-size:32px;margin-bottom:12px}
.profile__n span{display:block;font-size:13px;color:var(--muted);font-weight:400;font-family:var(--en)}
.profile__sec{margin-bottom:36px}
.profile__sec h2{font-size:20px;border-left:5px solid var(--blue-l);padding-left:14px;margin-bottom:16px}
.profile__cols{display:grid;grid-template-columns:1fr 1fr;gap:32px}
.profile__career li{position:relative;padding-left:20px;margin:6px 0;font-size:15px}
.profile__career li::before{content:"";position:absolute;left:4px;top:.75em;width:8px;height:8px;background:var(--blue-l);border-radius:50%}
.profile__knows{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:24px}
.profile__knows li{background:var(--gray);border-radius:999px;padding:4px 14px;font-size:14px}
.profile__sns a{font-size:14px;text-decoration:underline}

/* 固定ページ */
.page__t{font-size:30px;margin-bottom:20px;padding-bottom:14px;border-bottom:3px solid var(--blue-l)}
.page__t span{display:block;font-size:15px;color:var(--muted);font-weight:400;margin-top:6px}
.page__lead{font-size:17px;margin-bottom:28px}
.page h2{font-size:21px;margin:40px 0 14px;padding-left:14px;border-left:5px solid var(--blue-l)}
.page ul:not(.page__authors):not(.gl__idx ul){padding-left:1.4em;margin-bottom:1.4em}
.page ul:not(.page__authors):not(.gl__idx ul) li{list-style:disc;margin:4px 0}
.page__authors{display:flex;flex-wrap:wrap;gap:16px;margin:16px 0}
.page__authors a{display:flex;align-items:center;gap:10px;border:1px solid var(--border);border-radius:999px;padding:6px 18px 6px 6px;color:var(--text);font-size:14px;font-weight:700}
.page__authors img{width:44px;height:44px;border-radius:50%}
.page__authors small{display:block;font-size:11px;color:var(--muted);font-weight:400}
.page__upd{font-size:13px;color:var(--muted);margin-top:32px}
.page__hero{margin:0 0 24px}.page__hero img{border-radius:10px;width:100%;aspect-ratio:8/5;object-fit:cover}
.page>.fig img{width:100%;aspect-ratio:8/5;object-fit:cover}  /* 写真は 8:5（2026-10-28）。記事本文の図（.post__body .fig）は縦可変のまま */
.page__cta{text-align:center;margin:32px 0}
.steps{counter-reset:s;display:grid;grid-template-columns:repeat(2,1fr);gap:12px;margin-bottom:24px}
.steps li{background:var(--blue-pale);border-radius:8px;padding:16px 18px;font-size:14px}
.steps strong{display:block;font-family:var(--en);color:var(--blue);letter-spacing:.1em;font-size:12px;margin-bottom:4px}
.contact__info{background:var(--gray);border-radius:10px;padding:18px 24px;margin-bottom:28px}
.contact__info p{margin:0;display:flex;flex-wrap:wrap;align-items:center;gap:8px 20px}
.contact__tel{font-family:var(--en);font-size:28px;font-weight:900;color:var(--text)}
.contact__info span{font-size:13px;color:var(--muted)}
.form__row{display:grid;grid-template-columns:200px 1fr;gap:16px;align-items:center;margin-bottom:18px}
.form__row label{font-weight:700;font-size:15px}
.req{display:inline-block;background:var(--cta);color:#fff;font-size:11px;border-radius:3px;padding:1px 6px;margin-left:8px;vertical-align:middle}
.form input:not([type=checkbox]),.form select,.form textarea{width:100%;border:1px solid #cbd5e1;border-radius:6px;padding:12px 14px;background:#fff}
.form__row--check{grid-template-columns:1fr;justify-items:center}
.form__row--check label{font-weight:400}
.form__submit{text-align:center;margin:24px 0 8px}
.form__done{display:block;text-align:center;color:var(--cta);font-weight:700;margin-top:12px}
.form--search{display:flex;gap:10px;margin-bottom:20px}
.form--search input{flex:1}
.search__status{font-weight:700;margin-bottom:20px}
.gl__idx ul{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:28px}
.gl__idx a{display:inline-block;font-size:13px;border:1px solid var(--border);border-radius:999px;padding:4px 12px;color:var(--text)}
.gl__item{border-bottom:1px dashed var(--border);padding:20px 0;scroll-margin-top:100px}
.gl dt{display:flex;flex-wrap:wrap;align-items:baseline;gap:6px 12px;margin-bottom:6px}
.gl__t{font-size:19px;font-weight:700;color:var(--blue)}
.gl__k{font-size:12px;color:var(--muted)}.gl__e{font-family:var(--en);font-size:12px;color:var(--muted)}
.gl dd{margin:0;font-size:15px}
.news__item{border-bottom:1px solid var(--border);padding:22px 0;scroll-margin-top:100px}
.news__item time{font-family:var(--en);font-size:13px;color:var(--muted)}
.news__t{font-size:18px;margin:4px 0 8px;border:0;padding:0}
.news__item p{margin:0;font-size:15px}

/* ---------- レスポンシブ ---------- */
@media (max-width:1100px){
  .site-footer__cols{grid-template-columns:repeat(3,1fr)}
  .site-header__tag{display:none}
  .logo--stack .logo__img{height:28px}
  .logo__bar{font-size:10px;padding:3px 0 4px}
  .gnav>ul{gap:22px}
  .layout{grid-template-columns:1fr;gap:48px}
  .side{position:static}
  .featured__in{grid-template-columns:1fr}
  .grid--4{grid-template-columns:repeat(2,1fr)}
  .team{padding:56px 0}
  .team__in{grid-template-columns:1fr;gap:36px}
  .team__intro{position:static}
  .team__flow{grid-template-columns:repeat(3,minmax(0,1fr));gap:20px}
  .team__flow li{grid-template-columns:1fr;gap:10px;padding-bottom:0}
  .team__flow li:not(:last-child)::before{left:44px;right:-12px;top:17px;bottom:auto;width:auto;height:2px}
}
@media (max-width:860px){
  .site-header__in{height:auto;padding:10px 16px;align-items:center}
  .site-header__r{display:none}
  .drawer__open{display:inline-flex}
  .site-header__chips{display:flex;gap:8px;overflow-x:auto;padding:0 16px 10px;scrollbar-width:none}
  .site-header__chips a{display:inline-block;white-space:nowrap;font-size:12px;font-weight:700;border:1px solid var(--blue-l);color:var(--blue-d);border-radius:999px;padding:5px 12px}
  .logo__mark{width:36px;height:36px;font-size:18px}.logo__txt{font-size:20px}
  .sec{padding:48px 0}.sec__h{font-size:24px}
  .grid{gap:20px}
  .grid--3,.grid--2{grid-template-columns:1fr 1fr}
  .featured{padding:16px 0}.featured__in{padding:0 16px;gap:16px}
  .featured__grid{grid-template-columns:1fr 1fr;gap:12px}
  .featured .card--hero .card__t{font-size:18px}
  .ctaband__in{grid-template-columns:1fr;gap:16px}
  .sec--cat .sec__in{padding:28px 16px;border-radius:12px}
  .catgrid__row{grid-template-columns:1fr}
  .catgrid__cat{padding:12px 16px;font-size:15px}
  .catgrid__subs{grid-template-columns:1fr 1fr;padding:12px 16px;gap:2px 8px}
  .catgrid__subs a{font-size:13px}
  .rank__item{grid-template-columns:120px 1fr;gap:14px;padding:12px}
  .rank__arrow{display:none}.rank__t{font-size:14px}
  .about__cards{grid-template-columns:1fr}
  .site-footer__top .site-footer__in{flex-direction:column;align-items:flex-start;padding-top:36px;padding-bottom:28px}
  .site-footer__brand{flex-direction:column;align-items:flex-start;gap:10px}
  .site-footer__tag{white-space:normal}
  .site-footer__cta{flex-direction:column;width:100%;margin-left:0}
  .site-footer__cta .site-footer__btn{width:100%}
  .site-footer__mid{grid-template-columns:1fr;padding-top:32px}
  .site-footer__bottom{flex-direction:column;align-items:flex-start}
  .site-footer__cols{grid-template-columns:1fr 1fr}
  .site-footer{padding-bottom:72px}
  .fixcta{display:flex;position:fixed;left:0;right:0;bottom:0;z-index:90;padding:10px 12px calc(10px + env(safe-area-inset-bottom));background:rgba(255,255,255,.95);box-shadow:0 -4px 14px rgba(0,0,0,.08);gap:10px}
  .fixcta .btn{flex:1;padding:12px}
  .layout{padding:24px 16px 60px}
  .bc{padding:0 16px}
  .post__t{font-size:24px}
  .post__body h2{font-size:19px;padding:12px 16px;margin:40px 0 18px}
  .post__body h3{font-size:17px}
  .abox__in{grid-template-columns:1fr;justify-items:center;text-align:center}
  .abox__quals{justify-content:center}
  .postnav{grid-template-columns:1fr}
  .acard{grid-template-columns:1fr;justify-items:center;text-align:center;padding:20px}
  .profile__head{grid-template-columns:1fr;justify-items:center;text-align:center;padding:24px}
  .profile__cols{grid-template-columns:1fr}
  .form__row{grid-template-columns:1fr;gap:6px}
  .steps{grid-template-columns:1fr}
  .list__h,.page__t{font-size:24px}
}
@media (max-width:560px){
  .grid--3,.grid--2,.grid--4{grid-template-columns:1fr}
  .featured__grid{grid-template-columns:1fr}
  .featured__grid .card{flex-direction:row;gap:12px;align-items:center}
  .featured__grid .card__img{width:130px;flex:none;aspect-ratio:8/5}
  .featured__grid .card__t{font-size:13px}
  .featured__grid .card__meta{font-size:11px}
  .team{padding:44px 0}
  .team__in{padding:0 20px}
  .team__intro .sec__h{font-size:24px}
  .team__flow{grid-template-columns:1fr;gap:0}
  .team__flow li{grid-template-columns:36px 1fr;gap:14px;padding-bottom:18px}
  .team__flow li:last-child{padding-bottom:0}
  .team__flow li:not(:last-child)::before{left:17px;right:auto;top:38px;bottom:2px;width:2px;height:auto}
  .team__grid{grid-template-columns:1fr;gap:14px}
  .tcard__a,  .tcard__img img,  .tcard__name{font-size:17px}
  .tcard__name small{display:block;margin:2px 0 0}
    .site-footer__cols{grid-template-columns:1fr}
  .tabs__nav [role=tab]{font-size:14px}
}

/* 準備中のサブカテゴリ（記事なし）：リンクせず表示だけ */
.soon{color:#8a94a0;cursor:default}
.soon small{font-size:10px;line-height:1;padding:2px 6px;margin-left:6px;border:1px solid currentColor;border-radius:999px;opacity:.8;white-space:nowrap;vertical-align:middle}
.chips .soon{display:inline-flex;font-size:12px;padding:5px 12px;border:1px dashed #c5ccd3;border-radius:999px}

/* トップ注目記事：タイトル最大2行、右4枚はタイトルのみ、左は「公開日：YYYY/MM/DD」＋タグ */
.card__t--clamp{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-clamp:2;overflow:hidden}
.card__meta--hero{justify-content:flex-start;gap:16px}
.card__pub{font-size:13px;color:var(--muted);font-family:var(--en)}
/* 注目記事（左）：タイトルと「公開日・タグ」の間隔を広げる */
.featured .card--hero .card__body{padding:4px 12px 6px}
.featured .card--hero .card__t{line-height:1.6}
.featured .card--hero .card__meta--hero{margin-top:18px;gap:20px}
.featured .card--hero .card__meta--hero{flex-wrap:wrap;row-gap:10px}
/* 大カード下段：タグは左揃え、公開日は右揃え（ユーザー指示 2026-10-22） */
.featured .card--hero .card__meta--hero .card__tags{margin:0;order:-1}
.featured .card--hero .card__meta--hero .card__pub{margin-left:auto}
.featured .card--hero .card__pub{font-size:14px}
/* 編集部ピックアップ：カードに縁、タイトル最大3行、高さを揃える（タグ・日付は下端） */
.sec--pickup .pick__track{align-items:stretch}
.sec--pickup .card{height:100%;box-sizing:border-box;background:#fff;border:1px solid var(--border);border-radius:12px;padding:14px 14px 16px;box-shadow:0 2px 8px rgba(10,37,64,.04)}
.sec--pickup .card__body{display:flex;flex-direction:column;flex:1;gap:10px}
.sec--pickup .card__t{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden;min-height:calc(1.55em * 3)}
.sec--pickup .card__meta{margin-top:auto}
/* 編集部ピックアップ：横スクロールのカルーセル（4枚表示、5枚目以降は左へスクロール） */
.pick{position:relative}
.pick__track{list-style:none;margin:0;padding:4px 2px 12px;display:grid;grid-auto-flow:column;grid-auto-columns:calc((100% - 3 * 28px) / 4);gap:28px;overflow-x:auto;scroll-snap-type:x mandatory;scrollbar-width:thin;-webkit-overflow-scrolling:touch}
.pick__item{scroll-snap-align:start;display:flex}
.pick__item .card{width:100%}
.pick__nav{display:flex;justify-content:flex-end;gap:10px;margin-top:8px}
.pick__btn{width:44px;height:44px;border-radius:50%;border:1px solid var(--border);background:#fff;color:var(--navy);display:inline-flex;align-items:center;justify-content:center}
.pick__btn svg{transform:rotate(180deg)}
.pick__btn--next svg{transform:none}
.pick__btn:hover{border-color:var(--blue);color:var(--blue)}
@media (max-width:860px){.pick__track{grid-auto-columns:calc((100% - 28px) / 2.2)}}
@media (max-width:560px){.pick__track{grid-auto-columns:78%;gap:16px}}
/* カテゴリーから探す：左にカテゴリ名、右にタグ */
.catgrid__row{min-height:0}
.catgrid__cat{white-space:nowrap;font-size:17px}
.catgrid__tags{list-style:none;margin:0;padding:18px 24px;display:flex;flex-wrap:wrap;gap:10px;align-content:center}
.catgrid__tags a{display:inline-block;font-size:14px;line-height:1.4;padding:6px 14px;border:1px solid var(--blue-l);border-radius:999px;color:var(--blue-d);background:#fff;text-decoration:none!important}
.catgrid__tags a:hover{background:var(--blue-l);color:#fff}
@media (max-width:860px){.catgrid__tags{padding:14px 16px;gap:8px}.catgrid__tags a{font-size:13px;padding:5px 12px}}

/* 320px 幅（iPhone SE 等）：ロゴ横の MAGAZINE と長いボタンが横にはみ出していた */
@media (max-width:400px){
  .btn{max-width:100%;padding-left:14px;padding-right:14px}
  .btn--lg{font-size:14px}
}
@media (max-width:360px){
  .logo{flex-wrap:wrap;row-gap:6px}
  .logo__sub{letter-spacing:.15em}
}

/* ============================================================
   3階層版（build.py --blogv2）：ブログトップ / カテゴリ別メディア
   ============================================================ */
/* ランキング：4位以下は小さく */
.rank__item--s{grid-template-columns:140px 1fr 32px;gap:18px;padding:12px 16px}
.rank__item--s .rank__t{font-size:15px;margin:2px 0 4px}
.rank__item--s .rank__no{width:24px;height:30px;font-size:12px}
.prank__note{text-align:center;color:var(--muted);font-size:14px;margin:-16px 0 28px}

/* 1階層：ヒーロー */
.phero{background:linear-gradient(135deg,var(--navy) 0%,#0d3a66 60%,var(--blue) 100%);color:#fff;padding:48px 0}
.phero__in{max-width:var(--w);margin:0 auto;padding:0 24px;display:grid;grid-template-columns:minmax(0,1fr) 340px;gap:56px;align-items:center}
.phero .sec__en{color:#9cc6ea}
.phero__h{color:#fff;font-family:var(--en);font-weight:900;font-size:52px;letter-spacing:.02em;margin:10px 0 6px}
.phero__tag{font-size:20px;font-weight:700;margin-bottom:20px}
.phero__lead{color:rgba(255,255,255,.88);line-height:2;max-width:680px}
.phero__stats{display:flex;flex-wrap:wrap;gap:12px 40px;margin-top:28px}
.phero__stats li{display:flex;align-items:baseline;gap:8px}
.phero__stats strong{font-family:var(--en);font-weight:900;font-size:40px;line-height:1;color:#fff}
.phero__stats span{font-size:14px;color:rgba(255,255,255,.85)}
.phero__cats{background:rgba(255,255,255,.08);border:1px solid rgba(255,255,255,.18);border-radius:16px;padding:24px}
.phero__cats-t{font-weight:700;margin-bottom:12px;font-size:15px}
.phero__cats ul{display:flex;flex-direction:column;gap:8px}
.phero__cats a{display:flex;align-items:center;gap:12px;background:#fff;color:var(--navy);border-radius:10px;padding:10px 14px;font-weight:700;text-decoration:none!important;transition:.2s}
.phero__cats a:hover{background:var(--blue-pale);transform:translateX(3px)}
.phero__cats svg{width:24px;height:24px;color:var(--blue);flex:none}

/* 1階層：このブログについて */
.pabout__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.pabout__item{border:1px solid var(--border);border-radius:14px;padding:28px 26px;background:#fff}
.pabout__no{font-family:var(--en);font-weight:900;color:var(--blue-l);font-size:28px;line-height:1;display:block;margin-bottom:14px}
.pabout__item h3{font-size:19px;margin-bottom:10px}
.pabout__item p{margin:0;color:#444;font-size:15px}
.pabout__links{display:flex;flex-wrap:wrap;gap:8px 28px;margin:28px 0 0}
.pabout__links a{font-weight:700;text-decoration:underline;text-underline-offset:4px}

/* 1階層：カテゴリー紹介（2階層の「ほかのカテゴリー」と同じ作り＋説明1文） */
.pcats{background:var(--gray)}
.pcats__grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:16px}
.pcat{display:grid;grid-template-columns:1fr;grid-template-rows:auto 1fr auto;grid-template-areas:"name" "lead" "more";gap:0;align-items:center;align-content:stretch;background:#fff;border:1px solid var(--border);border-radius:12px;padding:22px 22px 20px;color:var(--navy);text-decoration:none!important;transition:.2s}
.pcat:hover{border-color:var(--blue-l);transform:translateY(-2px);box-shadow:0 2px 8px rgba(10,31,68,.06)}
.pcat:focus-visible{outline:2px solid var(--blue);outline-offset:2px}
.pcat__icon{grid-area:icon;display:flex;color:var(--blue)}
.pcat__icon svg{width:36px;height:36px}
.pcat__en{grid-area:en;font-family:var(--en);font-weight:900;font-size:11px;letter-spacing:.18em;color:var(--blue-l)}
.pcat__name{grid-area:name;margin:0;font-size:18px;font-weight:700;line-height:1.5;color:var(--navy)}
.pcat__lead{grid-area:lead;align-self:start;margin:14px 0 0;padding-top:14px;border-top:1px solid var(--border);font-size:13px;line-height:1.8;color:#555}
.pcat__lead{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden}
.pcat__more{grid-area:more;justify-self:end;align-self:end;display:inline-flex;align-items:center;gap:6px;margin-top:12px;font-size:13px;font-weight:700;color:var(--blue)}
.pcat__more span{font-size:16px;line-height:1;transition:transform .2s}
.pcat:hover .pcat__more span{transform:translateX(3px)}

/* 2階層：カテゴリ見出し */
.chero{background:linear-gradient(135deg,var(--navy) 0%,#0d3a66 70%,var(--blue) 100%);color:#fff;padding:44px 0}
.chero__in{max-width:1360px;margin:0 auto;padding:0 32px;display:flex;align-items:center;gap:28px}
.chero__icon{flex:none;display:flex;width:84px;height:84px;border-radius:20px;background:rgba(255,255,255,.12);align-items:center;justify-content:center}
.chero__icon svg{width:44px;height:44px}
.chero .sec__en{color:#9cc6ea}
.chero__h{color:#fff;font-size:36px;margin:6px 0 10px}
.chero__lead{margin:0;color:rgba(255,255,255,.9);max-width:900px;font-size:15px;line-height:1.95}
.featured__in--one{grid-template-columns:minmax(0,640px);justify-content:center}

/* 2階層：記事一覧（サブカテゴリで絞り込み） */
.cfilter__nav{margin:-8px 0 28px}
.cfilter__nav ul{display:flex;flex-wrap:wrap;gap:10px}
.cfilter__nav button{display:inline-flex;align-items:center;gap:8px;font-size:14px;font-weight:700;padding:8px 18px;border-radius:999px;border:1px solid var(--blue-l);background:#fff;color:var(--blue-d);transition:.15s}
.cfilter__nav button small{font-family:var(--en);font-size:12px;opacity:.75}
.cfilter__nav button:hover{background:var(--blue-pale)}
.cfilter__empty{padding:32px 0;text-align:center;color:var(--muted,#6b7280)}
.cfilter__nav button[aria-pressed="true"]{background:var(--blue);border-color:var(--blue);color:#fff}
.cfilter__item[hidden]{display:none}
.cfilter__item .card{height:100%}

/* 2階層：ほかのカテゴリー */
.cothers{background:var(--gray)}
.cothers__list{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:16px}
.cothers__list a{display:grid;grid-template-columns:auto 1fr;grid-template-areas:"icon en" "icon n" "icon c";gap:0 14px;align-items:center;background:#fff;border-radius:12px;padding:18px;color:var(--navy);text-decoration:none!important;border:1px solid var(--border);transition:.2s}
.cothers__list a:hover{border-color:var(--blue-l);transform:translateY(-2px)}
.cothers__list svg{grid-area:icon;color:var(--blue);width:34px;height:34px}
.cothers__en{grid-area:en;font-family:var(--en);font-weight:900;font-size:11px;letter-spacing:.18em;color:var(--blue-l)}
.cothers__n{grid-area:n;font-weight:700;font-size:16px}
.cothers__list small{grid-area:c;color:var(--muted);font-size:12px}

@media (max-width:1100px){
  .phero__in{grid-template-columns:1fr;gap:36px}
  .phero__cats ul{flex-direction:row;flex-wrap:wrap}
  .phero__cats li{flex:1 1 calc(50% - 8px)}
  .pcats__grid{grid-template-columns:repeat(2,minmax(0,1fr))}
  .cothers__list{grid-template-columns:repeat(2,minmax(0,1fr))}
}
@media (max-width:860px){
  .phero{padding:32px 0}
  .phero__in{padding:0 16px}
  .phero__h{font-size:38px}
  .phero__tag{font-size:17px}
  .phero__stats strong{font-size:32px}
  .pabout__grid{grid-template-columns:1fr;gap:14px}
  .pabout__item{padding:22px 20px}
  .pcats__grid{grid-template-columns:1fr;gap:12px}
  .pcat{padding:18px}
  .chero{padding:32px 0}
  .chero__in{padding:0 16px;gap:18px;align-items:flex-start}
  .chero__icon{width:60px;height:60px;border-radius:14px}
  .chero__icon svg{width:32px;height:32px}
  .chero__h{font-size:28px}
  .rank__item--s{grid-template-columns:110px 1fr;gap:14px}
  .rank__item--s .rank__arrow{display:none}
}
@media (max-width:560px){
  .phero__h{font-size:32px}
  .phero__stats{gap:10px 24px}
  .phero__stats strong{font-size:28px}
  .phero__cats{padding:18px}
  .phero__cats li{flex:1 1 100%}
  .chero__in{flex-direction:column;gap:14px}
  .chero__h{font-size:24px}
  .cfilter__nav button{font-size:13px;padding:7px 14px}
  .cothers__list{grid-template-columns:1fr}
  .rank__item--s{grid-template-columns:96px 1fr;padding:10px 12px}
}

/* ========== レスポンシブ調整（2026-10-18） ==========
   ・861〜1100px：トップFVの「カテゴリーから読む」を本文の下に落とさず右に残す（帯が縦に伸びすぎるため）
   ・641〜860px：「このブログについて」は3列、カテゴリー紹介は2列のまま（1列だと間延びする）
   ・860px以下：単独で押すリンク・ボタンの高さを32px以上に（本文中の文章リンクは対象外）
   ・著作権表記は <small> で 9px 台になっていたので 11px に戻す */
@media (min-width:861px) and (max-width:1100px){
  .phero__in{grid-template-columns:minmax(0,1fr) 280px;gap:32px}
  .phero__cats ul{flex-direction:column;flex-wrap:nowrap}
  .phero__cats li{flex:none}
  .phero__h{font-size:44px}
}
@media (min-width:641px) and (max-width:860px){
  .pabout__grid{grid-template-columns:repeat(3,minmax(0,1fr));gap:14px}
  .pabout__item{padding:20px 18px}
  .pabout__item h3{font-size:17px}
  .pabout__item p{font-size:14px}
  .pcats__grid{grid-template-columns:repeat(2,minmax(0,1fr));gap:18px}
}
@media (max-width:860px){
  .card__cat,.post__cats a,.post__tags a,.side__tags a,.site-header__chips a{min-height:32px;display:inline-flex;align-items:center}
  .post__tags a,.side__tags a{padding:6px 12px}
  .toc__btn{min-height:36px;padding:0 8px}
  .toc__list a{display:inline-block;padding-block:6px}
  .pg__prev,.pg__next{display:inline-flex;align-items:center;min-height:44px;padding:0 6px}
  .ssearch button{min-width:44px;min-height:44px;justify-content:center}
  .sec__more,.pcat__go,.team__policy,.abox__more,.more,.pabout__links a{display:inline-flex;align-items:center;min-height:36px}
  .site-footer__col li>a,.site-footer__col li>.soon{padding-top:9px;padding-bottom:9px}
  .site-footer__ct a{min-height:36px}
}
.site-footer__copy small{font-size:inherit}

/* 2階層：記事一覧カード（枠付き・タグ表示）・最大6枚＋もっと見る */
.card--box{height:100%;box-sizing:border-box;background:#fff;border:1px solid var(--border);border-radius:12px;padding:14px 14px 16px;box-shadow:0 2px 8px rgba(10,37,64,.04);transition:border-color .2s,box-shadow .2s}
.card--box:hover{border-color:var(--blue-l);box-shadow:var(--shadow)}
.card--box .card__body{display:flex;flex-direction:column;flex:1;gap:10px}
.card--box .card__t{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:3;line-clamp:3;overflow:hidden}
.card__tags{display:flex;flex-wrap:wrap;gap:6px}
.card__tags a,.card__tags span{display:inline-block;font-size:12px;line-height:1.4;padding:4px 10px;border:1px solid var(--blue-l);border-radius:999px;color:var(--blue-d);background:#fff;text-decoration:none!important}
.card__tags a:hover{background:var(--blue-l);color:#fff}
/* カード全体が1つのリンク（一覧・関連記事）：文字色は本文色、タグはリンクにしない。ホバーでタイトルだけ青 */
.card--link{color:var(--text);text-decoration:none!important}
.card--link .card__t{display:block;color:var(--text);transition:color .2s}
.card--link:hover .card__t{color:var(--blue)}
.cfilter__more{text-align:center;margin:36px 0 0}

/* 3階層版ランキング：日付の右にカテゴリ、タイトルの下にタグ */
.rank__meta{display:flex;flex-wrap:wrap;align-items:center;gap:4px 16px;margin:0}
.rank__meta time{display:inline;font-family:var(--en);font-size:12px;color:var(--muted)}
.rank__meta .card__cat{font-size:13px}
.rank__body .card__tags{margin-top:2px}
.rank__item[hidden]{display:none}
.rank__more{text-align:center;margin:32px 0 0}
.rank__more[hidden]{display:none}
/* 「もっと見る」：白地・青枠・青文字（ユーザー指示）。ホバーで薄い青地 */
.cfilter__more .btn,.rank__more .btn{background:#fff;color:var(--blue)!important;border:2px solid var(--blue);box-shadow:none}
.cfilter__more .btn:hover,.rank__more .btn:hover{background:var(--blue-pale);color:var(--blue)!important;border-color:var(--blue)}
.card__meta--date{justify-content:flex-end}
/* ほかのカテゴリー：名前だけ */
.cothers__list a{display:flex;align-items:center;min-height:64px;padding:16px 20px}

/* ============================================================
   記事ページ：装飾は assets/css/article-prod.css（本番 /blog/ の抜粋）。ここは挙動系だけ
   ============================================================ */
.site-header{transition:transform .25s ease}
.site-header.is-hidden{transform:translateY(-100%)}
@media (max-width:860px){
  .bc ol{flex-wrap:nowrap;overflow-x:auto;white-space:nowrap;scrollbar-width:none;-webkit-overflow-scrolling:touch}
  .bc ol::-webkit-scrollbar{display:none}
  .bc li{flex:none}
  /* 下部固定CTA：記事ページでは読み始めてから出し、末尾近くで引っ込める（app.js） */
  .p-post .fixcta{transform:translateY(110%);transition:transform .25s ease}
  .p-post .fixcta.is-show{transform:none}
  /* サイドバー（記事の下）：人気記事→カテゴリー→無料相談。検索は上のメニューにあるので出さない（前の版と同じ） */
  .p-post .side .side__box:first-child,.p-post .side__cta--diag{display:none}
  .p-post .side__box:nth-child(3){order:-1}
  /* SHARE：3分割・44px 以上（前の版と同じ） */
  .share{gap:8px}
  .share__l{width:100%;margin:0 0 2px}
  .share a,.share button{flex:1 1 calc(33.33% - 8px);min-height:44px}
  .fixcta .btn{padding:11px 8px;font-size:14px}
}
/* 著者・固定ページのサイドバー：カテゴリ記事数・人気記事（記事ページは article.css の .blog-side） */
.side__cnt{float:right;color:var(--muted);font-size:12px;font-family:var(--en)}
.side__pop li+li{margin-top:12px}
.side__pop a{display:grid;grid-template-columns:22px 90px 1fr;gap:10px;align-items:center;color:var(--text);font-size:13px;font-weight:700;line-height:1.5}
/* 人気記事のテキストは本番 /blog/ の .blog-popular__title と同じ：12.5px・700・行間1.55・紺・3行で省略・下線なし・ホバーで青 */
.side__pop a>span:last-child{font-size:12.5px;font-weight:700;line-height:1.55;color:var(--navy);display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;transition:color .2s}
.side__pop a:hover{text-decoration:none;opacity:.7}
.side__pop a:hover>span:last-child{color:var(--blue)}
.side__rank{font-family:var(--en);font-weight:900;color:var(--orange);font-size:18px;text-align:center}
.side__pop img{width:100%;height:auto;aspect-ratio:8/5;object-fit:cover;border:2px solid var(--blue-l);border-radius:4px;box-sizing:border-box} /* 1.6:1（2026-10-28） */

/* ===== 3階層版（/blog-v2/）2026-10-26 改修 ===== */
/* トップのヒーロー：右のカテゴリーナビを外したので1カラム */
.phero--solo .phero__in{grid-template-columns:1fr}
.phero--solo .phero__lead{max-width:760px}
/* CTA 帯（HTML版）：左＝会社紹介（紺）、右＝カテゴリー別の無料相談（オレンジ） */
.ctab{display:flex;flex-direction:column;gap:10px;border-radius:14px;padding:28px 30px;text-decoration:none!important;transition:transform .2s}
.ctab:hover{transform:translateY(-2px)}
.ctab--company{background:linear-gradient(135deg,var(--navy),#0d3a66);color:#fff}
.ctab--consult{background:#fff;border:2px solid var(--cta);color:var(--text)}
.ctab__en{font-family:var(--en);font-weight:900;font-size:12px;letter-spacing:.16em;opacity:.8}
.ctab--consult .ctab__en{color:var(--cta);opacity:1}
.ctab__t{font-size:22px;line-height:1.45}
.ctab__em{font-size:14px;font-weight:700;color:var(--cta)}
.ctab--company .ctab__t{color:#fff}
.ctab__d{font-size:13.5px;line-height:1.8;opacity:.9}
.ctab__btn{align-self:flex-start;display:inline-flex;align-items:center;gap:8px;margin-top:auto;padding:10px 22px;border-radius:999px;font-weight:700;font-size:14px}
.ctab__btn svg{width:16px;height:16px}
.ctab--company .ctab__btn{background:#fff;color:var(--navy)}
.ctab--consult .ctab__btn{background:var(--cta);color:#fff}
/* サイドバーの会社紹介カード（画像なし） */
.side__cta--company,.side__cta--consult{padding-top:22px}
/* フッター（カテゴリー列なし） */
.site-footer--blog .site-footer__links ul{font-size:13px;gap:8px 24px}
/* 監修者紹介ページ */
.sv-page__lead{margin:0 0 28px;color:#444;line-height:1.9}
.team__more{display:none}
@media (max-width:860px){
  /* 執筆者：SP は3人まで表示し「もっと見る」で全員 */
  .team__grid[data-team]:not(.is-open)>li:nth-child(n+4){display:none}
  .team__more{display:block;text-align:center;margin:20px 0 0}
  .team__grid.is-open+.team__more{display:none}
  .team__more .btn{background:#fff;color:var(--blue)!important;border:2px solid var(--blue)}
  /* ランキング：SP はタグを出さない（1行が高くなりすぎるため） */
  .rank__body .card__tags{display:none}
  /* 記事ページ：SP は本文の後を短く。サイドバー（人気記事・カテゴリー・相談）は出さず、相談は記事下 CTA と固定バーに任せる */
  .p-post .blog-side{display:none}
  /* 記事ページは末尾で固定バーが引っ込むので、フッター下の余白を取らない */
  .p-post .site-footer{padding-bottom:0}
  .ctab{padding:22px 20px}
  .ctab__t{font-size:19px}
}
/* CTA バナー（2026-10-26）：画像の角丸と軽い浮き。ボタンではないので影は付けない（feedback: ボタンに影なし） */
.ctabn,.side__bn{display:block;border-radius:12px;overflow:hidden;transition:transform .2s,opacity .2s}
.ctabn img,.side__bn img{display:block;width:100%;height:auto}
.ctabn:hover,.side__bn:hover{transform:translateY(-2px);opacity:.95}
.ctaband--banner .ctaband__in{align-items:center}.ctaband__co{display:inline-flex;align-items:center;gap:6px;font-size:15px;font-weight:700;color:var(--blue)}.ctaband__co svg{width:14px;height:14px}.cta-banner__lead{font-size:14px;color:var(--muted);margin-bottom:8px}.side__co{display:flex;align-items:center;justify-content:space-between;gap:12px;background:#fff;border:1px solid var(--border);border-radius:12px;padding:14px 16px;color:var(--navy);font-weight:700;font-size:15px;line-height:1.4}.side__co small{display:block;font-weight:500;font-size:12px;color:var(--muted)}.side__co svg{width:16px;height:16px;color:var(--blue);flex:none}
.cta-banner{margin:clamp(32px,4vw,44px) 0}
.cta-banner .ctabn img{border-radius:0}
.ctabn picture{display:block}
/* 会社紹介バナー：青い縁は画像に描かず CSS で付ける（画像に描くと角丸で四隅が欠ける。2026-10-31） */
[data-cta-position="company"]{border:2px solid var(--blue)}
@media (max-width:768px){.cta-banner,.ctaband--banner .ctabn{max-width:420px;margin-inline:auto}}

.gnav__soon{display:inline-flex;align-items:center;gap:6px;color:var(--muted);cursor:default}.gnav__soon small{font-size:10px;border:1px solid var(--border);border-radius:999px;padding:0 6px;line-height:1.6}

/* ===== カテゴリーとタグの表示ルール（全ページ共通・2026-10-29 ユーザー指示「デザインルールを統一」） =====
   カテゴリー＝青の塗りつぶし／タグ＝青の枠線・白地（テーマのタグも記事の型のタグも同じ。2026-10-29「タグは一括りに」）。
   どれも角丸4px・太字・「#」を付けない。記事上部（.cat-chip・article.css）と同じ形。
   サイドバーの一覧（.side__cnt）とカテゴリーページの絞り込みボタン（.cfilter__nav）は操作用の部品なので対象外 */
.card__cat{display:inline-flex;align-items:center;padding:3px 10px;border:1px solid var(--blue);border-radius:4px;background:var(--blue);color:#fff!important;font-size:12px;font-weight:700;line-height:1.5;letter-spacing:.03em;white-space:nowrap;text-decoration:none!important}
a.card__cat:hover{background:var(--blue-d);border-color:var(--blue-d);opacity:1}
.rank__meta .card__cat{font-size:12px}
.card__tags{display:flex;flex-wrap:wrap;gap:6px}
.card__tags a,.card__tags span{display:inline-flex;align-items:center;padding:3px 10px;border:1px solid var(--blue);border-radius:4px;background:#fff;color:var(--blue);font-size:12px;font-weight:700;line-height:1.5;letter-spacing:.03em;white-space:nowrap;text-decoration:none!important}
.card__tags a:hover{background:var(--blue-pale);color:var(--blue)}
/* スマホでもカテゴリーとタグの高さをそろえる（上の min-height:32px を打ち消す。26px でもタップの目安 24px は満たす） */
@media (max-width: 768px){.card__cat{min-height:0}}
/* スマホで記事ページが横に動く対策（2026-10-29 ユーザー指摘「SPだと横にスクロールできてしまう」）
   html にも clip（hidden だと sticky が効かなくなるので clip）。iOS の横の揺れを止め、表のスクロールがページへ伝わらないようにする */
html{overflow-x:clip}
/* overscroll-behavior-x:none は Mac のトラックパッドの「二本指で戻る」を止めてしまうので、タッチ端末だけに効かせる（2026-10-29 ユーザー指摘） */
@media (hover:none) and (pointer:coarse){html,body{overscroll-behavior-x:none}}
/* タグのデザイン（2026-10-29 ユーザー指示）：囲み・線なし、タグ名の前に「#」。カテゴリーは青の塗りつぶしのまま。
   記事ページ右のサイドバー（.side__* ・ .blog-side）は対象外。「#」は CSS で付ける（HTML・検索データは名前だけ） */
.card__tags{gap:4px 12px}
.card__tags a,.card__tags span{padding:0;border:0;border-radius:0;background:none;color:var(--blue)}
.card__tags a::before,.card__tags span::before{content:"#";margin-right:1px}
.card__tags a:hover{background:none;color:var(--blue-d);text-decoration:underline!important}
/* カテゴリー・タグを薄い色に（2026-10-29 ユーザー指示「もっと薄く」）。カテゴリー＝薄い水色の地に青文字、タグ＝明るめの青・細め。コントラスト 4.5 以上 */
.card__cat{background:#e8f1f9;border-color:#e8f1f9;color:#036EB8!important}
a.card__cat:hover{background:#d6e7f5;border-color:#d6e7f5}
.card__tags a,.card__tags span{color:#2b7bbb;font-weight:500}
/* ページ送り（2026-10-29 指示：矢印＋番号3つ・現在ページは紺の丸・枠線なし） */
.pg{gap:clamp(28px,6vw,56px);margin-top:56px}
.pg ul{gap:clamp(20px,4vw,40px)}
.pg li a,.pg li span{width:34px;height:34px;border:0;font-family:var(--en);font-size:15px;color:var(--text)}
.pg li a:hover{background:var(--blue-pale)}
.pg li span{background:#2b5a8c;color:#fff;font-weight:700}
.pg__prev,.pg__next{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;padding:0;color:#3a3a3a}
.pg__prev.is-off,.pg__next.is-off{opacity:.25}
.pg__prev svg,.pg__next svg{width:28px;height:28px}
/* 標準カード（記事一覧・関連記事・執筆者）：カテゴリー＋タグ → タイトル → 更新日（2026-10-29 指示） */
.card--std .card__body{display:flex;flex-direction:column;gap:10px}
.card--std .card__chips{display:flex;flex-wrap:wrap;align-items:center;gap:6px 12px}
.card--std .card__tags{display:contents}
.card--std .card__t{margin:0}
.card--std .card__meta--date{margin-top:auto;justify-content:flex-end}
.card--std .card__date{font-weight:400}
/* 標準カード 2026-10-29 改：カテゴリー → タイトル（2行）→ タグ（1行）→ 更新日、行内でカードの高さを揃える */
.card--std{display:flex;flex-direction:column;height:100%}
.card--std .card__body{flex:1}
.card--std .card__t{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden;min-height:calc(2em * var(--card-lh,1.6));line-height:var(--card-lh,1.6)}
.card--std .card__tags{display:flex;flex-wrap:wrap;gap:0 12px;height:1.7em;line-height:1.7;overflow:hidden;margin:0}
.card--std .card__tags li{flex:none}
/* 標準カード：要素同士の縦の間隔を詰める（2026-10-29 指示） */
.card--std .card__body{gap:6px}
.card--std .card__chips,.card--std .card__chips .card__cat{margin:0}
.card--std{--card-lh:1.5}
.card--std .card__tags{height:1.5em;line-height:1.5}
.card--std .card__meta--date{margin-bottom:0;padding-top:2px}
/* 標準カードの段と段の間を広く（2026-10-29 指示） */
.grid:has(> .card--std){row-gap:clamp(40px,4.5vw,56px)}
/* ページ送り：1ページ目・最終ページを常に表示、間は「…」。番号が増えたぶん間隔を詰める（2026-10-29） */
.pg ul{gap:clamp(8px,2.4vw,24px);align-items:center}
.pg__gap{color:var(--muted);font-family:var(--en);width:20px;text-align:center}
@media (max-width:520px){.pg{gap:8px}.pg ul{gap:4px}.pg li a,.pg li span{width:32px;height:32px}}
/* 執筆者/監修者の個人ページ（/supervisor/<slug>/・2026-10-29 本番ブログの個人ページに合わせて刷新） */
.profile__head{align-items:start}
.profile__n span{display:block;margin-top:4px;font-size:14px;font-weight:500;color:var(--muted);letter-spacing:.08em}
.profile__bio p{font-size:15px;line-height:1.9;margin:0 0 .8em}
.profile__bio p:last-child{margin-bottom:0}
.profile__posts{margin-top:56px}
.profile__posts .sec__head{margin-bottom:20px}
.profile__back{margin-top:48px;text-align:center}
.profile__back a{display:inline-block;padding:12px 28px;border:1px solid var(--border);border-radius:999px;font-weight:700;color:var(--navy)}
@media (max-width:768px){.profile__head{justify-items:start;text-align:left}}
/* 個人ページの見出し 2026-10-29 改：色ベタの箱と丸い写真をやめ、白地に罫線で区切る落ち着いた組み */
.p-page .profile__head,.profile__head{background:none;border-radius:0;padding:0 0 40px;margin-bottom:8px;border-bottom:1px solid var(--border);grid-template-columns:184px 1fr;gap:44px;align-items:start}
.profile__img img{width:184px;height:184px;border:0;border-radius:14px;object-fit:cover;object-position:center 20%}
.profile__t{padding-top:4px}
.profile__role{font-size:12px;letter-spacing:.14em;font-weight:700;color:var(--blue);margin:0 0 10px}
.profile__n{font-size:clamp(26px,3vw,34px);line-height:1.25;letter-spacing:.04em;color:var(--navy);margin:0}
.profile__sub{display:flex;flex-wrap:wrap;gap:4px 14px;margin:10px 0 0;padding-bottom:20px;border-bottom:1px solid var(--border);font-size:13px;color:var(--muted);letter-spacing:.1em}
.profile__sub span[lang="en"]{font-family:var(--en);letter-spacing:.06em}
.profile__sub span+span::before{content:"/";margin-right:14px;color:var(--border)}
.profile__bio{margin-top:20px}
.profile__bio p{font-size:15px;line-height:2;color:#374151}
@media (max-width:768px){
  .profile__head{grid-template-columns:96px 1fr;gap:20px;padding-bottom:28px}
  .profile__img img{width:96px;height:96px;border-radius:10px}
  .profile__bio{grid-column:1/-1}
}
@media (max-width:768px){.profile__head{grid-template-columns:1fr;gap:18px}.profile__img img{width:88px;height:88px}}
/* 「執筆者/監修者 紹介へ戻る」：本番ブログの .article-back と同じ形（紺の線・白地・ホバーで反転）2026-10-29 */
.profile__back{margin-top:clamp(36px,4.5vw,52px)}
.profile__back a{display:inline-flex;align-items:center;gap:12px;padding:15px 46px;border:1px solid var(--navy);border-radius:999px;background:#fff;font-size:14px;font-weight:700;letter-spacing:.04em;color:var(--navy);transition:background-color .2s,color .2s}
.profile__back a:hover{background:var(--navy);color:#fff;opacity:1;text-decoration:none}
.profile__back-arrow{font-family:var(--en);font-size:13px}
/* ページ送りの色を「戻る」ボタンと同じ紺に（2026-10-29） */
.pg li span{background:var(--navy)}
.pg li a,.pg__prev,.pg__next,.pg__gap{color:var(--navy)}
/* 2026-10-29 指示分 */
/* 個人ページ：もっと見るで隠す記事（.card--std の display:flex に負けないように） */
[data-more][hidden]{display:none!important}
/* カテゴリー SP：タグの絞り込みは3行の横スクロール */
@media (max-width:768px){
  .cfilter__nav{margin-left:-16px;margin-right:-16px;padding:0 16px 6px;overflow-x:auto;-webkit-overflow-scrolling:touch;scrollbar-width:thin}
  .cfilter__nav ul{display:grid;grid-auto-flow:column;grid-template-rows:repeat(3,auto);grid-auto-columns:max-content;gap:8px;width:max-content}
  .cfilter__nav li{display:flex}
}
/* トップ「執筆者/監修者 紹介」：3列のときに見出しの高さがずれないよう上で揃える */
.team__flow li{align-content:start;align-items:start}
/* もっと見る（ランキング・執筆者/監修者 紹介）：文字を少し下げて上下の見た目を揃える。トップのチームのボタンもランキングと同じ形 */
.rank__more .btn{padding-top:12px;padding-bottom:8px;line-height:1.4}
.team__more.rank__more{margin:32px 0 0}
/* もっと見る（ランキング・執筆者/監修者 紹介・個人ページ）を同じ形に統一（2026-10-29）
   高さ48px・最小幅240px・文字は上下中央（和文の見た目に合わせて上を1px だけ多く） */
.rank__more .btn{display:inline-flex;align-items:center;justify-content:center;min-width:240px;width:auto;height:48px;padding:1px 32px 0;font-size:15px;line-height:1;letter-spacing:.06em;flex:none}
@media (max-width:480px){.rank__more .btn{min-width:min(240px,100%);padding:1px 24px 0}}
/* 執筆者/監修者 紹介の「もっと見る」：カードとの間（32px）と下の余白（48px）をランキングと同じに（2026-10-29）
   .team__in の行間 36px があるので margin-top は 32-36 */
@media (max-width:860px){
  .team__more.rank__more{margin:-4px 0 0}
  .team{padding-bottom:48px}
}
/* 個人ページ SP：写真の右に役職・名前・よみを横並び、紹介文はその下に全幅（2026-10-29） */
@media (max-width:768px){
  .profile__head{grid-template-columns:88px 1fr;column-gap:16px;row-gap:0;align-items:center}
  .profile__img{grid-column:1;grid-row:1 / span 3;align-self:center}
  .profile__t{display:contents}
  .profile__role{grid-column:2;grid-row:1;margin:0 0 4px;align-self:end}
  .profile__n{grid-column:2;grid-row:2;font-size:24px}
  .profile__sub{grid-column:2;grid-row:3;align-self:start;margin-top:6px;padding-bottom:0;border-bottom:0;font-size:12px;gap:2px 10px}
  .profile__sub span+span::before{margin-right:10px}
  .profile__bio{grid-column:1 / -1;grid-row:4;margin-top:20px;padding-top:20px;border-top:1px solid var(--border)}
}
/* SP メニューのロゴ：ヘッダーと同じ縦積み（waltsu＋MAGAZINE の帯）。閉じるボタンと重ならないよう間を空ける（2026-10-29） */
.drawer__head{gap:16px;align-items:center}
.drawer__head .logo{flex:none}
.drawer__close{flex:none;display:flex;align-items:center;justify-content:center;width:44px;height:44px;margin-right:-10px}
/* タブレット（601〜860px）：参考 a-gent.co.jp/magazine と同じく、ハンバーガーにせず PC 形のヘッダー（ロゴ・ボタン・カテゴリー）を詰めて出す。
   ボタンがヘッダーにあるので下の固定バーは出さない（2026-10-29） */
@media (min-width:601px) and (max-width:860px){
  .site-header__in{height:84px;padding:0 20px;align-items:center;gap:16px}
  .site-header__r{display:flex;padding-bottom:8px;gap:6px}
  .drawer__open{display:none}
  .site-header__chips{display:none}
  .site-header__tools{gap:8px}
  .site-header__tools .btn{width:auto;flex:none;padding:8px 16px;font-size:13px}
  .gnav>ul{gap:18px}
  .gnav__item>a{font-size:13px}
  .fixcta{display:none}
  .site-footer{padding-bottom:0}
}
/* カテゴリーのピックアップ（大きいカード）：タイトルとタグの間を詰める（2026-10-29） */
.featured .card--hero .card__meta--hero{margin-top:8px;row-gap:6px}
.featured .card--hero .card__meta--hero .card__tags{line-height:1.5}
@media (max-width:600px){.featured .card--hero .card__meta--hero{margin-top:4px}}
/* カテゴリーのタグ：PC は普通に折り返し、SP は3行の横スクロールで各行を左詰め（2026-10-29：列揃えだと短いボタンの後ろが空く） */
.cfilter__rows{display:flex;flex-wrap:wrap;gap:10px}
.cfilter__nav ul.cfilter__row{display:contents}
@media (max-width:768px){
  .cfilter__rows{flex-direction:column;flex-wrap:nowrap;gap:8px;width:max-content}
  .cfilter__nav ul.cfilter__row{display:flex;flex-wrap:nowrap;gap:8px;width:auto;grid-template-rows:none}
}
/* カテゴリーの記事一覧カード：タイトルとタグの間をファーストビュー（ピックアップ）と同じに（PC 8px／SP 4px）2026-10-29 */
.card--box .card__t+.card__tags{margin-top:-2px;line-height:1.5}
@media (max-width:600px){.card--box .card__t+.card__tags{margin-top:-6px}}
/* カテゴリーの記事一覧の「もっと見る」も、ランキング・執筆者/監修者 紹介と同じ形に（2026-10-29：ここだけ旧サイズのままだった） */
.cfilter__more{margin:32px 0 0}
.cfilter__more .btn{display:inline-flex;align-items:center;justify-content:center;min-width:240px;width:auto;height:48px;padding:1px 32px 0;font-size:15px;line-height:1;letter-spacing:.06em;flex:none}
@media (max-width:480px){.cfilter__more .btn{min-width:min(240px,100%);padding:1px 24px 0}}

/* ---------- サイト内検索の置き場所（2026-11-02 ユーザー指示）：PC ヘッダーの検索窓／SP はハンバーガーの左の虫眼鏡＋SP メニューの先頭／記事一覧の上 ---------- */
.site-header__r{min-width:0}
.site-header__tools .hsearch{flex:0 1 220px;min-width:0}
.site-header__tools .hbtns{flex:none}
.hsearch input,.dsearch input{min-width:0}
.hsearch:focus-within,.dsearch:focus-within,.lsearch:focus-within{outline:2px solid var(--blue-l);outline-offset:1px}
.lsearch{display:flex;align-items:center;box-sizing:border-box;width:100%;max-width:480px;height:44px;margin-top:16px;padding:0 6px 0 18px;background:#fff;border:1px solid var(--border);border-radius:999px}
.lsearch input{flex:1;min-width:0;border:0;background:transparent;outline:none;font-size:14px}
.lsearch button{display:inline-flex;border:0;background:transparent;color:var(--muted);padding:8px;cursor:pointer}
.site-header__sp{display:none}
/* 検索結果は固定ページ（.page）の枠の中に出るので、本文用の見出し・箇条書きの装飾を打ち消して記事一覧と同じカードにする */
#search-results .card__t{font-size:16px;margin:0;padding-left:0;border-left:0}
#search-results .card__tags{padding-left:0;margin:0}
#search-results .card__tags li{list-style:none;margin:0}
/* 検索窓のぶんヘッダーの右側が広がるので、キャッチコピーは 1280px 未満で隠す（1100px 以下は上で隠している） */
@media (max-width:1279px){.site-header__tag{display:none}}
/* タブレット（601〜860px）はボタンが小さいので検索窓も詰める */
@media (min-width:601px) and (max-width:860px){.site-header__tools .hsearch{flex:0 1 160px;height:34px;padding:0 2px 0 12px}}
@media (max-width:860px){.dsearch input,.lsearch input,.form--search input{font-size:16px}}  /* iOS は 16px 未満だと入力時に画面が拡大する */
@media (max-width:600px){
  .site-header__sp{display:flex;align-items:center;gap:2px;flex:none}
  .site-header__search{display:inline-flex;align-items:center;justify-content:center;width:44px;height:44px;color:var(--blue)}
  .site-header__search svg{width:24px;height:24px}
  .lsearch{max-width:none}
}