/* ===============================
   ISA: コースカテゴリヘッダーカード
   =============================== */

.isa-clh{
    padding: 0;
    margin: 60px 90px 0;
}

.isa-clh__inner {
    display: grid;
    grid-template-columns: minmax(0, 0.7fr) minmax(0, 1fr);

    /* ★ここで高さを固定 */
    height: 206px;

    /* ★中身が206pxを超えた分は隠す */
    overflow: hidden;
}

/* 左側写真 */
.isa-clh__photo{
    position: relative;
    overflow: hidden;
}

.isa-clh__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* 右側パネル */
.isa-clh__body{
    position: relative;
    padding: 29px;
    color: #ffffff;
    box-sizing: border-box;

    /* ACFで渡した色を少し薄める */
    background-color: color-mix(in srgb, var(--bg-color) 70%, white 30%);

    /* ★ アイコン画像：上下いっぱいにベッタリ */
    background-repeat: no-repeat;
    background-position: center right;   /* 右寄せ中央（必要なら調整） */
    background-size: auto 100%;         /* ← 高さ100%にフィット */
}
/* タイトル */
.isa-clh__title{
    margin: 0 0 clamp(10px, 1.6vw, 16px);
    font-size: clamp(26px, 5vw, 31px);
    font-weight: 700;
    letter-spacing: .06em;
}

/* 説明文（改行対応） */
.isa-clh__desc{
    margin: 0;
    font-size: clamp(16px, 3.1vw, 18px);
    font-weight: 700;
    line-height: 1.7;
}
@media (max-width: 1024px){
    .isa-clh{
    padding: 0;
    margin: 0;
}

.isa-clh__inner {
    display: grid;
    grid-template-columns: minmax(0, 0.4fr) minmax(0, 1fr);

    /* ★ここで高さを固定 */
    height: 206px;

    /* ★中身が206pxを超えた分は隠す */
    overflow: hidden;
}

/* 左側写真 */
.isa-clh__photo{
    position: relative;
    overflow: hidden;
}

.isa-clh__photo img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    display: block;
}

/* 右側パネル */
.isa-clh__body{
    position: relative;
    padding: clamp(24px, 4vw, 40px) clamp(26px, 5vw, 60px);
    color: #ffffff;
    box-sizing: border-box;

    /* ACFで渡した色を少し薄める */
    background-color: color-mix(in srgb, var(--bg-color) 70%, white 30%);

    /* ★ アイコン画像：上下いっぱいにベッタリ */
    background-repeat: no-repeat;
    background-position: center right;   /* 右寄せ中央（必要なら調整） */
    background-size: auto 100%;         /* ← 高さ100%にフィット */
    
    display: flex;
    flex-direction: column;
    justify-content: center;
}

/* タイトル */
.isa-clh__title{
    margin: 0 0 clamp(10px, 1.6vw, 16px);
    font-size: clamp(20px, 5vw, 36px);
    font-weight: 800;
    letter-spacing: .06em;
}

/* 説明文（改行対応） */
.isa-clh__desc{
    margin: 0;
    font-size: clamp(13px, 3.1vw, 21px);
    font-weight: 700;
    line-height: 1.7;
}
}
