/* 163（2026-10-08）生成画像の組み込み */
/* MIEKATA：記事の例 */
.ex163{max-width:1080px;margin:36px auto 0}
.ex163-title{display:flex;align-items:center;justify-content:center;gap:12px;margin:0 0 18px!important;font-size:20px;font-weight:700;color:#141c4c}
.ex163-title span{padding:4px 12px;border-radius:999px;background:#7b5cf0;color:#fff;font-size:14px}
.ex163-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:18px}
.ex163-card{background:#fff;border:1px solid #d4dbf5;border-radius:16px;overflow:hidden}
.ex163-eye{aspect-ratio:16/9;overflow:hidden;background:#eef1fb}
.ex163-eye img{display:block;width:100%;height:100%;object-fit:cover;transition:transform .6s cubic-bezier(.22,1,.36,1)}
@media(hover:hover){.ex163-card:hover .ex163-eye img{transform:scale(1.05)}}
.ex163-body{padding:14px 16px 16px}
.ex163-cat{display:inline-block;margin-bottom:8px;padding:2px 10px;border-radius:999px;background:#eef2ff;color:#2448d8;font-size:14px;font-weight:700}
.ex163-body h4{margin:0 0 8px;font-size:16px;line-height:1.65;color:#141c4c}
.ex163-meta{margin:0!important;font-size:14px;color:#5b6385}
.ex163-note{margin:16px 0 0!important;font-size:16px;color:#4b5375;text-align:center}
@media(min-width:601px){.ex163-cat,.ex163-meta,.ex163-title span{font-size:16px}}
@media(max-width:900px){.ex163-grid{grid-template-columns:1fr}.ex163-card{display:grid;grid-template-columns:150px 1fr;align-items:center}.ex163-eye{height:100%}}
@media(max-width:600px){.ex163-title{font-size:17px}.ex163-card{grid-template-columns:120px 1fr}.ex163-body{padding:10px 12px}.ex163-body h4{font-size:14px}.ex163-note{font-size:14px}}

/* AIKATA：支援事例のイラストをカード上部に大きく */
html body.aikata .ak150-case-top figure.ak163-pict{position:static!important;width:auto!important;margin:-22px -24px 16px!important;opacity:1!important;aspect-ratio:16/9;overflow:hidden;background:#ece9fb}
html body.aikata .ak150-case-top figure.ak163-pict img{width:100%;height:100%;object-fit:cover}
html body.aikata .ak150-case-top:has(.ak163-pict){padding-top:22px}
html body.aikata .ak150-case-top:has(.ak163-pict) h3{padding-right:0!important}
html body.aikata .ak150-case-top:has(.ak163-pict) .ak150-no{position:absolute;left:24px;top:16px;z-index:1}
@media(max-width:600px){html body.aikata .ak150-case-top figure.ak163-pict{margin:-22px -16px 14px!important}html body.aikata .ak150-case-top:has(.ak163-pict) .ak150-no{left:16px}}

/* AIKATA：価値セクションのイラスト */
html body.aikata .v163-fig{max-width:560px;margin:24px auto 0;border-radius:20px;overflow:hidden}
html body.aikata .v163-fig img{display:block;width:100%;height:auto}
/* 価値セクション：背景の色の境目がイラストにかかる → セクション全体を同じ色の帯に */
html body.aikata .value151{position:relative;isolation:isolate}
html body.aikata .value151::before{content:'';position:absolute;top:0;bottom:0;left:50%;width:100vw;margin-left:-50vw;background:#fff;z-index:-1}
/* 182（2026-10-09）支援事例のイラストが大きすぎる → 縦横比（16:9）はそのまま、高さ200pxに（スマホ150px）。帯の中央に */
html body.aikata .ak150-case-top figure.ak163-pict{aspect-ratio:auto!important;display:flex!important;justify-content:center;align-items:center;padding:44px 16px 4px!important;background:#ece9fb}
html body.aikata main .ak150-case-top figure.ak163-pict img{width:auto!important;height:200px!important;max-width:100%!important;aspect-ratio:16/9!important;object-fit:contain!important;margin:0 auto!important;border-radius:12px}
@media(max-width:600px){html body.aikata .ak150-case-top figure.ak163-pict{padding:40px 12px 4px!important}html body.aikata main .ak150-case-top figure.ak163-pict img{height:150px!important}}
html body.aikata .ak150-case-top figure.ak163-pict{background:#eeebfe!important}html body.aikata main .ak150-case-top figure.ak163-pict img{border-radius:0!important}
