/* コラム記事（日本語）。寸法は 4/8/12/16/24/32/48/64/96px、角丸は 6/8px と丸型だけを使う */
.tw{
  --tw-bg:#FFFFFF; --tw-panel:#F3F6F9;
  --tw-text:#15152B; --tw-sub:#5D6678;
  --tw-line:#E3E8EF; --tw-frame:#B8C2D1;
  --tw-accent:#0A7F48; --tw-accent-deep:#086A3C; --tw-green:#15CF78;
  --tw-marker:#FFF1B8; --tw-dark:#15152B;
  --tw-pad:40px; --tw-hd:64px;
  --tw-ff:"Noto Sans JP",system-ui,-apple-system,"Hiragino Sans",sans-serif;
  --tw-ff-num:"DM Sans","Noto Sans JP",sans-serif;
  display:block;background:var(--tw-bg);color:var(--tw-text);font-family:var(--tw-ff);font-size:16px;line-height:1.8;padding-top:var(--tw-hd)
}
@media (max-width:767px){.tw{--tw-pad:20px}}
.tw *,.tw *::before,.tw *::after{box-sizing:border-box}
.tw a{color:inherit;text-decoration:none}
.tw img{max-width:100%;height:auto;display:block}
.tw h1,.tw h2,.tw h3,.tw h4,.tw p,.tw li,.tw dd,.tw dt,.tw td,.tw th,.tw figcaption,.tw blockquote,.tw-btn,.tw-tag,.tw-toc a,.tw-side a{word-break:keep-all;overflow-wrap:anywhere;line-break:strict}
.tw h1,.tw h2,.tw h3,.tw h4,.tw p,.tw li,.tw figcaption{text-wrap:pretty}
.tw-card__title,.tw-rank a,.tw-toc a span,.tw-side-toc a{text-wrap:balance}
.tw-wrap{max-width:1200px;margin-inline:auto;padding-inline:32px}
@media (max-width:767px){.tw-wrap{padding-inline:var(--tw-pad)}}

/* パンくず */
.tw-bc ol{display:flex;flex-wrap:wrap;gap:4px 8px;padding-block:16px;font-size:13px;line-height:1.6;color:var(--tw-sub);list-style:none;margin-block:0}
.tw-bc li+li::before{content:"＞";margin-right:8px}
.tw-bc a:hover{text-decoration:underline;text-underline-offset:3px}
.tw-bc li:last-child{min-width:0}

/* 2カラム（1024px以上） */
.tw-layout{display:grid;grid-template-columns:minmax(0,1fr) 300px;gap:64px;padding-top:24px;padding-bottom:96px}
@media (max-width:1023px){.tw-layout{grid-template-columns:minmax(0,1fr)}}
@media (max-width:767px){.tw-layout{padding-top:8px;padding-bottom:64px}}
.tw-article{min-width:0}

/* 記事の頭 */
.tw-head,.tw-body{max-width:720px}
.tw-cat{display:inline-block;font-size:13px;font-weight:700;color:var(--tw-accent);line-height:1.5}
.tw-title{margin:8px 0 0;font-size:28px;line-height:1.55;font-weight:700;letter-spacing:.02em}
.tw-meta{display:flex;flex-wrap:wrap;gap:4px 16px;margin-top:16px;font-size:13px;line-height:1.6;color:var(--tw-sub)}
.tw-meta time{font-family:var(--tw-ff-num)}
.tw-by{display:flex;align-items:center;gap:8px;margin:12px 0 0;font-size:13px;line-height:1.6}
.tw-by a{text-decoration:underline;text-underline-offset:3px}
.tw-tags{display:flex;flex-wrap:wrap;gap:8px;margin-top:16px}
.tw-tag{display:inline-flex;align-items:center;min-height:32px;padding:4px 12px;border:1px solid var(--tw-frame);border-radius:999px;background:var(--tw-bg);font-size:13px;line-height:1.5}
.tw-tag:hover{border-color:var(--tw-text)}
.tw-eyecatch{margin:32px 0 0;max-width:720px}
.tw-eyecatch img{width:100%;aspect-ratio:16/9;object-fit:cover;border-radius:6px;background:var(--tw-panel)}
@media (max-width:767px){
  .tw-title{font-size:22px}
  .tw-eyecatch{margin-inline:calc(var(--tw-pad)*-1)}
  .tw-eyecatch img{border-radius:0}
}

/* 執筆者のマーク（TASKULのロゴの形） */
.tw-face{display:flex;align-items:center;justify-content:center;flex:none;width:80px;height:80px;border-radius:50%;background:var(--tw-bg);border:1px solid var(--tw-line)}
.tw-face i{display:block;width:44px;height:44px;border:8px solid var(--tw-green);border-radius:8px}
.tw-face--sm{width:28px;height:28px}
.tw-face--sm i{width:14px;height:14px;border-width:3px;border-radius:3px}
.tw-face b{font-size:28px;font-weight:700;line-height:1;color:var(--tw-text)}
.tw-face:has(b){background:var(--tw-panel);border-color:var(--tw-panel)}
.tw-face--sm b{font-size:13px}

/* 本文 */
.tw-lead{margin-top:32px}
.tw-prose{font-size:16px;line-height:1.9;letter-spacing:.04em;color:var(--tw-text)}
.tw-prose>*{margin:0}
.tw-prose>*+*{margin-top:24px}
.tw-prose p{margin:0}
.tw-prose>*+p{margin-top:24px}
.tw-prose h2{position:relative;margin:72px 0 0;padding-bottom:16px;border-bottom:1px solid var(--tw-line);font-size:24px;line-height:1.6;letter-spacing:.04em;font-weight:700;scroll-margin-top:88px}
.tw-prose h2::after{content:"";position:absolute;left:0;bottom:-1px;width:64px;height:2px;background:var(--tw-accent)}
.tw-prose h3{margin:48px 0 0;font-size:20px;line-height:1.6;letter-spacing:.04em;font-weight:700;scroll-margin-top:88px}
.tw-prose h4{margin:32px 0 0;font-size:17px;line-height:1.7;font-weight:700}
.tw-prose h2+*{margin-top:24px}
.tw-prose h3+*,.tw-prose h4+*{margin-top:12px}
.tw-prose h2+h3{margin-top:32px}
.tw-prose strong,.tw-prose b,.tw-panel strong{font-weight:700;color:var(--tw-text);background:linear-gradient(transparent 60%,var(--tw-marker) 60%)}
.tw-prose mark{background:linear-gradient(transparent 60%,var(--tw-marker) 60%);color:inherit}
.tw-prose u{text-decoration:underline;text-decoration-color:#E8590C;text-decoration-thickness:1px;text-underline-offset:4px;text-decoration-skip-ink:none}
.tw-prose a:not(.tw-btn):not(.tul-button):not(.cta-button){color:var(--tw-accent);text-decoration:underline;text-decoration-thickness:1px;text-underline-offset:3px}
.tw-prose a:not(.tw-btn):not(.tul-button):not(.cta-button):hover{color:var(--tw-text)}
.tw-prose a strong{color:inherit}
.tw-prose ul,.tw-prose ol{list-style:none;padding:0}
.tw-prose ul>li{position:relative;padding-left:1.25em}
.tw-prose ul>li::before{content:"";position:absolute;left:.2em;top:.8em;width:6px;height:6px;background:var(--tw-text);border-radius:50%}
.tw-prose ol{counter-reset:tw-ol}
.tw-prose ol>li{counter-increment:tw-ol;position:relative;padding-left:36px}
.tw-prose ol>li::before{content:counter(tw-ol);position:absolute;left:0;top:4px;width:24px;height:24px;border-radius:50%;background:var(--tw-dark);color:#FFFFFF;font:700 13px/24px var(--tw-ff-num);text-align:center;letter-spacing:0}
.tw-prose li+li{margin-top:8px}
.tw-prose li>ul,.tw-prose li>ol{margin-top:8px}
.tw-prose li p{margin:0}
.tw-prose ul.is-numbered>li{padding-left:0}
.tw-prose ul.is-numbered>li::before{content:none}
.tw-prose img{border-radius:6px;max-width:100%;height:auto}
.tw-prose p>img:only-child{margin:0}
.tw-prose figure{margin-left:0;margin-right:0}
.tw-prose figcaption{margin-top:12px;font-size:13px;line-height:1.7;color:var(--tw-sub);letter-spacing:.02em}
.tw-prose blockquote{margin-left:0;margin-right:0;padding:16px 24px;border:1px solid var(--tw-line);border-radius:8px;font-size:15px;line-height:1.9}
.tw-prose blockquote p+p{margin-top:12px}
.tw-prose hr{border:0;border-top:1px solid var(--tw-line);margin:48px 0}
.tw-prose pre{background:var(--tw-panel);color:var(--tw-text);border-radius:8px;padding:24px;font-family:var(--tw-ff);font-size:15px;line-height:1.9;letter-spacing:.02em;white-space:pre-wrap;word-break:normal;overflow-wrap:anywhere}
.tw-prose pre code{background:none;padding:0;font:inherit;white-space:inherit}
.tw-prose pre code.language-html,.tw-prose pre code[class*="language-"]{font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:14px}
.tw-prose code{background:var(--tw-panel);border-radius:4px;padding:2px 6px;font-size:.9em;font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace}
@media (max-width:767px){
  .tw-prose h2{margin-top:56px;font-size:20px}
  .tw-prose h3{margin-top:40px;font-size:18px}
  .tw-prose pre{padding:16px}
}

/* 地パネル（この記事で分かること・まとめ） */
.tw-panel,.tw-prose .panel{background:var(--tw-panel);border-radius:8px;padding:24px 32px}
.tw-panel__title,.tw-prose .panel__title{font-size:16px;font-weight:700;line-height:1.6;letter-spacing:.04em}
.tw-panel ul,.tw-panel ol,.tw-prose .panel ul{margin-top:12px}
.tw-panel li,.tw-prose .panel li{position:relative;padding-left:20px;font-size:15px;line-height:1.8}
.tw-panel ul>li::before,.tw-prose .panel ul>li::before{content:"";position:absolute;left:2px;top:.75em;width:6px;height:6px;background:var(--tw-text);border-radius:0}
.tw-panel ol>li{padding-left:36px}
.tw-panel li+li{margin-top:8px}
.tw-learn{margin-top:32px}
.tw-learn ul{list-style:none;padding:0;margin-bottom:0}
@media (max-width:767px){.tw-panel,.tw-prose .panel{padding:24px}}

/* 目次 */
.tw-toc{margin-top:32px;background:var(--tw-panel);border-radius:8px;padding:24px 32px}
.tw-toc__title{font-size:16px;font-weight:700;line-height:1.6;margin:0}
.tw-toc ol{list-style:none;padding:0;margin:12px 0 0}
.tw-toc li{font-size:15px;line-height:1.7;letter-spacing:.02em}
.tw-toc .tw-toc__h2{font-weight:700}
.tw-toc .tw-toc__h2+.tw-toc__h2{margin-top:12px;padding-top:12px;border-top:1px solid var(--tw-line)}
.tw-toc a{display:grid;grid-template-columns:2.2em minmax(0,1fr)}
.tw-toc a:hover span:last-child{text-decoration:underline;text-underline-offset:3px}
.tw-toc__no{font-family:var(--tw-ff-num);font-weight:700}
.tw-toc .tw-toc__h2 ol{margin-top:4px}
.tw-toc .tw-toc__h3{font-size:14px;font-weight:400}
.tw-toc .tw-toc__h3+.tw-toc__h3{margin-top:4px}
.tw-toc .tw-toc__h3 a::before{content:""}
.tw-toc .tw-toc__rest{padding-left:2.2em;color:var(--tw-sub)}
.tw-toc__more{margin-top:12px;border:0;background:none;padding:8px 0;font:700 14px/1.5 var(--tw-ff);color:var(--tw-text);text-decoration:underline;text-underline-offset:3px;cursor:pointer}
@media (min-width:768px){
  .tw-toc__more{display:none}
  .tw-toc.is-h2only .tw-toc__h2 ol{display:none}
}
@media (max-width:767px){
  .tw-toc{padding:24px}
  .tw-toc .tw-toc__h2 ol{display:none}
  .tw-toc.is-folded .tw-toc__h2.is-extra{display:none}
}

/* 記事の途中の案内 */
.tw-cta-inline{display:grid;grid-template-columns:minmax(0,1fr) auto;gap:24px;align-items:center;padding:24px 0;border-top:1px solid var(--tw-line);border-bottom:1px solid var(--tw-line);letter-spacing:normal}
.tw-prose .tw-cta-inline{margin-top:48px}
.tw-prose .tw-cta-inline+h2{margin-top:48px}
.tw-cta-inline__label{font-size:13px;font-weight:700;line-height:1.6;color:var(--tw-accent)}
.tw-cta-inline__title{font-size:16px;font-weight:700;line-height:1.6}
.tw-cta-inline__text{margin-top:4px!important;font-size:14px;line-height:1.8}
@media (max-width:767px){.tw-cta-inline{grid-template-columns:minmax(0,1fr);gap:16px}.tw-cta-inline .tw-btn{width:100%;min-width:0}}

/* ボタン */
.tw-btn{display:inline-flex;align-items:center;justify-content:center;gap:12px;min-height:52px;min-width:240px;padding:12px 32px;border-radius:999px;border:1px solid transparent;font-weight:700;font-size:15px;line-height:1.5;letter-spacing:.04em;text-align:center;cursor:pointer;transition:background-color .2s,border-color .2s}
.tw .tw-btn--main{background:var(--tw-accent);color:#FFFFFF}
.tw .tw-btn--main:hover{background:var(--tw-accent-deep)}
.tw .tw-btn--more{background:var(--tw-bg);color:var(--tw-text);border-color:var(--tw-frame);justify-content:space-between;padding-inline:32px 24px}
.tw .tw-btn--more:hover{border-color:var(--tw-text)}
.tw-btn--more::after{content:"";width:8px;height:8px;border-top:2px solid currentColor;border-right:2px solid currentColor;transform:rotate(45deg);flex:none}
.tw-btn--block{display:flex;width:100%;min-width:0}
.tw-btn-row{display:flex;flex-wrap:wrap;gap:16px}
@media (max-width:767px){.tw-btn-row{flex-direction:column}.tw-btn-row .tw-btn{width:100%;min-width:0}}

/* 記事の最後の案内 */
.tw-prose .tul-closing-banner{display:none}
.tw-cta-end{margin-top:64px;background:var(--tw-panel);border-radius:8px;padding:32px}
.tw-cta-end__label{margin:0;font-size:13px;font-weight:700;line-height:1.6;color:var(--tw-accent)}
.tw-cta-end__title{margin:4px 0 0;font-size:20px;font-weight:700;line-height:1.6;letter-spacing:.02em}
.tw-cta-end p:not([class]){margin:8px 0 0;font-size:15px;line-height:1.8}
.tw-cta-end .tw-btn-row{margin-top:24px}
@media (max-width:767px){.tw-cta-end{padding:24px}.tw-cta-end__title{font-size:18px}}

/* 執筆者 */
.tw-persons{margin-top:48px;background:var(--tw-panel);border-radius:8px;padding:0 32px}
.tw-persons__title{margin:0;padding-top:24px;font-size:16px;font-weight:700;line-height:1.6}
.tw-person{display:grid;grid-template-columns:80px minmax(0,1fr);gap:24px;padding:24px 0}
.tw-person p{margin:0}
.tw-person__role{font-size:13px;font-weight:700;line-height:1.6;color:var(--tw-accent)}
.tw-person__name{font-size:17px;font-weight:700;line-height:1.6}
.tw-person__title{font-size:13px;line-height:1.6;color:var(--tw-sub)}
.tw-person__text{margin-top:8px!important;font-size:14px;line-height:1.9}
.tw-person__more{margin-top:8px!important;font-size:14px}
.tw-person__more a{text-decoration:underline;text-underline-offset:3px}
@media (max-width:767px){.tw-persons{padding:0 24px}.tw-person{grid-template-columns:minmax(0,1fr);gap:12px}.tw-person .tw-face{width:64px;height:64px}.tw-person .tw-face i{width:36px;height:36px;border-width:6px;border-radius:6px}}

/* 表 */
.tw-prose .table-scroll{overflow-x:auto;-webkit-overflow-scrolling:touch;border:1px solid var(--tw-line);border-radius:8px}
.tw-prose table{width:100%;border-collapse:collapse;font-size:15px;line-height:1.7;letter-spacing:.02em}
.tw-prose .table-scroll>table{margin:0}
.tw-prose th,.tw-prose td{padding:12px 16px;border-bottom:1px solid var(--tw-line);text-align:left;vertical-align:top}
.tw-prose th+th,.tw-prose th+td,.tw-prose td+td,.tw-prose td+th{border-left:1px solid var(--tw-line)}
.tw-prose tbody tr:last-child>*{border-bottom:0}
.tw-prose thead th,.tw-prose tbody th{background:var(--tw-panel);font-weight:700}
.tw-prose thead th{white-space:nowrap}
.tw-prose tbody td:first-child{font-weight:700;min-width:6.5em}
.tw-prose table strong{background:none}
@media (max-width:767px){
  .tw-prose table{font-size:14px}
  .tw-prose th,.tw-prose td{padding:8px 12px}
  .tw-prose thead th{white-space:normal}
  .tw-prose .table-scroll>table.is-wide{min-width:540px}
}
.tw-prose .table-note{margin-top:8px!important;font-size:13px;color:var(--tw-sub);line-height:1.6}

/* 図（画像の図は地パネルの上に白いカードで置く） */
.tw-prose .tul-figure{background:var(--tw-panel);border-radius:8px;padding:24px}
.tw-prose .tul-figure img{width:100%;height:auto;margin:0;border-radius:6px;background:var(--tw-bg)}
.tw-prose .tul-figure a{text-decoration:none}
@media (max-width:767px){.tw-prose .tul-figure{padding:16px}}
/* 文字の図解：地パネル＋図のタイトル＋白いカード */
.tw-prose .figure{background:var(--tw-panel);border-radius:8px;padding:24px}
.tw-prose .figure__title{font-size:13px;font-weight:700;line-height:1.6}
.tw-prose .figure__cards{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px;margin-top:16px}
.tw-prose .figure__card{background:var(--tw-bg);border-radius:6px;padding:16px;font-size:14px;line-height:1.7}
.tw-prose .figure__card b{display:block;font-size:16px;margin-bottom:4px;background:none}
@media (max-width:767px){.tw-prose .figure{padding:16px}.tw-prose .figure__cards{grid-template-columns:minmax(0,1fr)}}

/* 番号つきの手順 */
.tw-prose ol.steps{border-top:1px solid var(--tw-line)}
.tw-prose ol.steps>li{display:grid;grid-template-columns:32px minmax(0,1fr);gap:16px;padding:16px 0;border-bottom:1px solid var(--tw-line)}
.tw-prose ol.steps>li+li{margin-top:0}
.tw-prose ol.steps>li::before{position:static;width:32px;height:32px;font-size:14px;line-height:32px}
.tw-prose ol.steps b{display:block;font-size:16px;line-height:1.7;background:none}
.tw-prose ol.steps p{font-size:15px;line-height:1.8;margin-top:4px}

/* 注意書き */
.tw-prose .caution{border:1px solid var(--tw-line);border-radius:8px;padding:16px 24px}
.tw-prose .caution__title{font-size:13px;font-weight:700;color:#B54708;line-height:1.6}
.tw-prose .caution p:not(.caution__title){margin-top:4px;font-size:15px;line-height:1.8}

/* あわせて読みたい */
.tw-prose .related,.tw-prose .tul-related{border:1px solid var(--tw-line);border-radius:8px;padding:16px 24px}
.tw-prose .related strong,.tw-prose .tul-related strong{background:none}
.tw-prose .related ul,.tw-prose .tul-related ul{margin-top:8px}

/* よくある質問 */
.tw-prose .faq-section>*+*{margin-top:24px}
.tw-prose .faq-section h2{margin-top:72px}
.tw-prose .faq-q{margin-top:32px!important;padding-top:24px;border-top:1px solid var(--tw-line);font-weight:700;font-size:16px;line-height:1.7}
.tw-prose .faq-section h2+.faq-q{border-top:0;padding-top:0}
.tw-prose .faq-a{margin-top:8px!important}

/* 会話 */
.tw-prose .chat-block,.tw-prose .chat-block *{box-shadow:none;border:none}
.tw-prose .chat-block{display:flex;flex-direction:column;gap:24px;background:var(--tw-panel);border-radius:8px;padding:24px;letter-spacing:.02em}
.tw-prose .chat-block p{margin:0}
.tw-prose .chat-human{display:flex;align-items:flex-start;gap:12px}
.tw-prose .chat-human-icon,.tw-prose .chat-ai-icon{flex-shrink:0;width:40px;height:40px;border-radius:50%;overflow:hidden;background:var(--tw-bg)}
.tw-prose .chat-human-icon img,.tw-prose .chat-ai-icon img{width:100%;height:100%;object-fit:cover;border-radius:0;margin:0}
.tw-prose .chat-human-content{display:flex;flex-direction:column;gap:4px}
.tw-prose .chat-ai{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.tw-prose .chat-ai-row{display:flex;flex-direction:row-reverse;align-items:flex-start;gap:12px;max-width:90%}
.tw-prose .chat-ai-content{display:flex;flex-direction:column;align-items:flex-end;gap:4px}
.tw-prose .chat-name{font-size:12px;font-weight:700;line-height:1.5;color:var(--tw-sub)}
.tw-prose .chat-ai .chat-name{color:var(--tw-accent)}
.tw-prose .chat-bubble{padding:12px 16px;font-size:15px;line-height:1.8;max-width:100%}
.tw-prose .chat-human .chat-bubble{background:var(--tw-bg);color:var(--tw-text);border-radius:8px 8px 8px 2px}
.tw-prose .chat-ai .chat-bubble{background:var(--tw-bg);color:var(--tw-text);border:1px solid var(--tw-accent);border-radius:8px 8px 2px 8px}

@media (max-width:767px){.tw-prose .chat-block{padding:16px}.tw-prose .chat-ai-row{max-width:100%}}

/* 右カラム */
.tw-side{display:grid;gap:48px;align-content:start;align-self:stretch;font-size:14px}
@media (max-width:1023px){.tw-side{display:none}}
.tw-side section{min-width:0}
.tw-side__title{margin:0 0 16px;padding-bottom:12px;border-bottom:1px solid var(--tw-text);font-size:16px;font-weight:700;line-height:1.6}
.tw-side-banner img{width:100%;height:auto;border-radius:8px}
.tw-rank{list-style:none;padding:0;margin:0;counter-reset:tw-r}
.tw-rank li{counter-increment:tw-r;display:grid;grid-template-columns:28px minmax(0,1fr);gap:8px;padding:12px 0;border-bottom:1px solid var(--tw-line);font-size:14px;line-height:1.7}
.tw-rank li::before{content:counter(tw-r);font-family:var(--tw-ff-num);font-weight:700;color:var(--tw-accent)}
.tw-rank.is-plain li{grid-template-columns:minmax(0,1fr)}
.tw-rank.is-plain li::before{content:none}
.tw-rank a:hover,.tw-cat-list a:hover{text-decoration:underline;text-underline-offset:3px}
.tw-cat-list{list-style:none;padding:0;margin:0}
.tw-cat-list a{display:flex;justify-content:space-between;align-items:baseline;gap:12px;padding:12px 0;border-bottom:1px solid var(--tw-line);font-size:15px;line-height:1.6}
.tw-cat-list a span:last-child{color:var(--tw-sub);font-family:var(--tw-ff-num);font-size:13px}
.tw-side-follow{display:grid;gap:12px}
@media (min-width:1024px){.tw-side-follow{position:sticky;top:calc(var(--tw-hd) + 24px)}}
.tw-side-toc ol{list-style:none;padding:0;margin:0 0 8px;display:grid;gap:4px}
.tw-side-toc a{display:block;padding:4px 0 4px 12px;font-size:14px;line-height:1.7;color:var(--tw-sub);border-left:2px solid transparent}
.tw-side-toc a:hover{color:var(--tw-text)}
.tw-side-toc a[aria-current]{color:var(--tw-text);font-weight:700;border-left-color:var(--tw-accent)}
.tw .tw-nw{white-space:nowrap}
.tw{word-break:keep-all;overflow-wrap:anywhere;line-break:strict}
.tw pre,.tw pre code{word-break:normal}
.nav-cta,.nav-tagline,.footer a{white-space:nowrap}
html,body{overflow-x:clip;overflow-y:visible}

/* シェア */
.tw-share{display:flex;flex-wrap:wrap;align-items:center;gap:10px;margin-top:48px;padding-top:24px;border-top:1px solid var(--tw-line);font-size:13px;font-weight:700}
.tw-share .tw-tag{font:inherit;font-weight:400;color:var(--tw-text);cursor:pointer}

/* 同じカテゴリの記事（全幅の帯） */
.tw-band{background:var(--tw-panel);padding:64px 0}
.tw-related{margin:0}
.tw-band .tw-card{border:0}
.tw-related__title{margin:0 0 20px;font-size:20px;font-weight:700;line-height:1.6;letter-spacing:.02em}
.tw-related ul{list-style:none;margin:0;padding:0;display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:24px}
.tw-card{display:flex;flex-direction:column;height:100%;background:var(--tw-bg);border:1px solid var(--tw-line);border-radius:8px;overflow:hidden}
.tw-card img{display:block;width:100%;height:auto;aspect-ratio:16/9;object-fit:cover}
.tw-card__body{display:flex;flex-direction:column;gap:8px;padding:14px 16px 16px;flex:1}
.tw-card__title{font-size:15px;font-weight:700;line-height:1.6}
.tw-card__meta{margin-top:auto;font-family:var(--tw-ff-num);font-size:12px;color:var(--tw-sub)}
.tw-card:hover .tw-card__title{text-decoration:underline;text-underline-offset:4px}
.tw-related__more{margin:20px 0 0;font-size:14px;font-weight:700}
.tw-related__more a{text-decoration:underline;text-underline-offset:3px}
@media (max-width:1023px){
  .tw-related ul{grid-template-columns:minmax(0,1fr);gap:12px}
  .tw-card{flex-direction:row;align-items:flex-start;gap:14px;border:0;border-radius:0}
  .tw-card img{width:128px;flex:none;border-radius:6px}
  .tw-card__body{padding:0}
  .tw-card__title{font-size:14px}
}
@media (min-width:768px) and (max-width:1023px){
  .tw-card img{width:176px}
  .tw-card__title{font-size:15px}
}

/* 表の横スクロールの案内 */
.tw-prose .table-hint{margin:24px 0 8px!important;font-size:13px;line-height:1.6;color:var(--tw-sub)}
.tw-prose .table-hint+.table-scroll{margin-top:0!important}

/* スマホの下に出す案内 */
.tw-spbar{display:none}
@media (max-width:1023px){
  .tw-spbar:not([hidden]){display:block;position:fixed;left:0;right:0;bottom:0;z-index:50;padding:6px 16px calc(6px + env(safe-area-inset-bottom));background:var(--tw-bg);border-top:1px solid var(--tw-line)}
  .tw-spbar .tw-btn{min-height:44px;padding-block:8px}
  .tw-spbar.is-off{display:none!important}
}

/* 本文にもとからある部品 */
.tw br.tul-sp{display:none}
@media (max-width:767px){.tw br.tul-sp{display:inline}}
.tw-prose .tul-nowrap{white-space:nowrap}
.tw-prose .tul-cta{margin-top:40px;background:var(--tw-panel);border-radius:8px;padding:32px}
.tw-prose .tul-cta p{margin:0}
.tw-prose .tul-cta .tul-title{font-size:20px;font-weight:700;line-height:1.6;letter-spacing:.02em}
.tw-prose .tul-cta p+p{margin-top:12px}
.tw-prose .tul-cta .tul-note{margin-top:16px;font-size:13px;line-height:1.8;color:var(--tw-sub)}
.tw-prose a.tul-button,.tw-prose a.cta-button{display:inline-block;box-sizing:border-box;text-align:center;min-width:240px;padding:14px 32px;border-radius:999px;background:var(--tw-accent);color:#FFFFFF;font-weight:700;font-size:15px;line-height:1.5;letter-spacing:.04em;text-decoration:none}
.tw-prose a.tul-button:hover,.tw-prose a.cta-button:hover{opacity:.88}
.tw-prose .tul-example{margin-top:24px;background:var(--tw-panel);border-radius:8px;padding:24px;line-height:1.9}
.tw-prose .tul-example>strong:first-child{display:block;background:none;margin-bottom:8px}
.tw-prose .tul-example>strong:first-child+br{display:none}
@media (max-width:767px){
  .tw-prose .tul-cta{padding:24px}
  .tw-prose .tul-cta .tul-title{font-size:18px}
  .tw-prose a.tul-button,.tw-prose a.cta-button{display:block;width:100%;min-width:0}
}

/* 表：列が細くなりすぎないようにする */
.tw-prose th,.tw-prose td{min-width:6em}
.tw-prose tr>:first-child{min-width:3em}

/* スマホとタブレットでは右カラムが無いので、記事の下にカテゴリを出す */
.tw-sp-cats{margin-top:56px}
@media (min-width:1024px){.tw-sp-cats{display:none}}

/* 執筆者の丸：地色のある欄では白い丸にする */
.tw-persons .tw-face{background:#FFFFFF;border-color:var(--tw-line)}

/* 右カラムの無料で試す案内 */
.tw-side-try p{margin:0;font-size:14px;line-height:1.8}
.tw-side-try .tw-btn{margin-top:16px}

/* 表：PCは本文の幅に収め、スマホは1列目を止めて横に送る */
@media (min-width:768px){.tw-prose .table-scroll>table{min-width:0!important;width:100%}}
@media (max-width:767px){
  .tw-prose .table-scroll>table{min-width:0!important;width:max-content;max-width:none}
  .tw-prose .table-scroll th,.tw-prose .table-scroll td{max-width:14em}
  .tw-prose .table-scroll tr>:first-child{position:sticky;left:0;z-index:1;background:var(--tw-bg)}
  .tw-prose .table-scroll thead tr>:first-child,.tw-prose .table-scroll th:first-child{background:var(--tw-panel)}
}

/* コピーできる例文 */
.tw-copy-wrap{position:relative;margin-top:24px}
.tw-copy-wrap>pre,.tw-copy-wrap>.tul-example{margin-top:0!important}
.tw-copy-btn{position:absolute;top:8px;right:8px;z-index:2;font:inherit;font-size:13px;color:var(--tw-text);cursor:pointer}
.tw-copy-wrap>.tul-example{padding-right:96px}
.tw-copy-wrap>pre{padding-top:48px}
.tw-copy-wrap>pre.is-tabbed{display:none}
.tw-copy-wrap>.table-scroll{margin-top:0!important;padding-top:0}
.tw-copy-wrap>.table-scroll table{margin-top:0}
.tw-copy-wrap>.table-scroll+.tw-copy-btn{top:-44px;right:0}
.tw-copy-wrap.is-table{margin-top:56px}

/* タブレット幅でヘッダーの文字が折れないようにする */
.nav-links a{white-space:nowrap}
@media (max-width:1023px){.nav-tagline{display:none}}