@charset "Shift_JIS";

/* **************************************************

Name: cases.css

Description: physical_ai cases CSS

Create: 2026.03.10
Update: 

Copyright 2026 Hitachi, Ltd.

***************************************************** */

/* ==================== */
/* Title */
/* ==================== */
#ArticleTitle {
    font-size: 2.5rem;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 3.125rem;
    color: var(--color-black);
    padding: 1.5rem 0 0;
    margin: 0 0 3rem;
}

@media (max-width: 994px) {
    #ArticleTitle {
        font-size: 2rem;
        line-height: 2.5rem;
    }
}


/* ==================== */
/* eyecatch */
/* ==================== */
#Eyecatch {
    position: relative;
    margin: 0 0 3rem;
}

#EyecatchImg {
    aspect-ratio: 21 / 9;
    display: block;
    width: 100%;
    overflow: hidden;
}

#EyecatchImg > img {
    width: 100%;
    height: 100% !important;
    object-fit: cover;
}

#EyecatchLead {
    border: 1px solid var(--color-supportive-grey-2);
    border-radius: .5rem;
    bottom: 2rem;
    left: 2rem;
    max-width: 36.6875rem;
    opacity: .9;
    padding: 1.5rem;
    position: absolute;
    top: auto;
    z-index: 1;
    background: transparent linear-gradient(27deg, var(--primary-color) -110%, #fff 25%) 0 0 no-repeat padding-box;
}

#EyecatchLeadCatchphrase {
    font-size: 1.25rem;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.875rem;
    margin-bottom: .5rem;
}

@media (max-width: 994px) {
    #EyecatchImg {
        aspect-ratio: 16 / 9;
    }

    #EyecatchLead {
        position: static;
        border: none;
        border-radius: 0;
    }

    #EyecatchLead {
        opacity: 1;
    }

    #EyecatchLeadCatchphrase {
        font-size: 1.125rem;
        line-height: 1.6875rem;
    }
}


/* ==================== */
/* –{•¶ */
/* ==================== */
.InterviewColumn {
    gap: 3rem;
    margin: 3rem 0;
}

.InterviewColumn:last-child {
    margin-bottom: 0;
}

.InterviewImgL,
.InterviewImg {
    width: 100%;
    border-radius: .5rem;
    overflow: hidden;
    border: 2px solid #fff;
    box-sizing: border-box;
}

.InterviewImgL {
    aspect-ratio: 21 / 9;
}

.InterviewImg {
    aspect-ratio: 3 / 2;
}

.InterviewImgL > img,
.InterviewImg > img {
    width: 100%;
    height: 100% !important;
    object-fit: cover;
}

.InterviewImgNote {
    font-size: 0.875rem;
    line-height: 1.3125rem;
    letter-spacing: 0;
    margin: .5rem 0 0;
}

.InterviewTalk > dt {
    font-size: 1.25rem;
    font-weight: 600;
    letter-spacing: 0;
    line-height: 1.875rem;
}

.InterviewTalk > dt + dd:not(:last-child) {
    margin: 0 0 1rem;
}

@media (max-width: 994px) {
    .InterviewColumn {
        margin: 1rem 0;
        gap: 1.5rem;
    }

    .InterviewImgL {
        aspect-ratio: 16 / 9;
    }

    .InterviewTalk > dt {
        font-size: 1.125rem;
        line-height: 1.6875rem;
    }
}