/* features-hux-09.css — 大きな連番と見出しを左、写真を右に置く紹介ブロック。旧 features-th15 の置き換え。
 * 旧版の壊れ方: 写真が右へはみ出していた。
 * 対策: グリッドで幅を分配し、写真の器を aspect-ratio で確定。はみ出す余地を作らない。
 * .lgx は付けない。
 */
.features-hux-09 .mx-auto{margin-inline:auto}
.features-hux-09 .max-w-7xl{max-width:80rem}
.features-hux-09 .px-4{padding-inline:1rem}
.features-hux-09 .py-8{padding-block:2rem}

.features-hux-09 .hux09-list{display:grid;gap:3rem}
.features-hux-09 .hux09-item{display:grid;grid-template-columns:1fr;gap:1.25rem;align-items:center}
.features-hux-09 .hux09-media{margin:0;aspect-ratio:4/3;max-height:460px;overflow:hidden;border-radius:.5rem}
.features-hux-09 .hux09-media img{display:block;width:100%;height:100%;object-fit:cover}
.features-hux-09 .hux09-num{margin:0 0 .1em;font-weight:700;line-height:1;color:var(--color-primary);font-size:var(--fs-h2,2rem);letter-spacing:.04em}
.features-hux-09 .hux09-title{margin:0 0 .6em;line-height:1.4;position:relative;padding-bottom:.5em}
.features-hux-09 .hux09-title::after{content:"";position:absolute;left:0;bottom:0;width:3rem;height:2px;background:var(--color-primary)}
.features-hux-09 .hux09-text{margin:0 0 1.25rem}
.features-hux-09 .hux09-more{margin:0}
.features-hux-09 .hux-btn{display:inline-flex;align-items:center;justify-content:center;min-height:44px;padding:.7em 2.2em;border-radius:999px;background:var(--color-primary);color:var(--color-on-primary);text-decoration:none;font-weight:600}
.features-hux-09 .hux-btn:hover{opacity:.88}

@media (min-width:768px){
  .features-hux-09 .px-4{padding-inline:1.5rem}
  .features-hux-09 .hux09-item{grid-template-columns:minmax(0,45fr) minmax(0,55fr);gap:2.5rem}
}
@media (min-width:1024px){
  .features-hux-09 .px-4{padding-inline:2rem}
  .features-hux-09 .hux09-list{gap:4rem}
  .features-hux-09 .hux09-item{gap:4rem}
}