@charset "utf-8";

/*solution/intramart/reason/用css*/

.engineer {
    padding-bottom: 64px;
}

.engineer dl {
    display: flex;
    margin-top: 0;
    margin-bottom: 0;
}
.engineer dl dt {
    display: flex;
    justify-content: center;
    align-items: center;
    padding: 1rem;
    width: 20%;
    background: #004499;
    font-size: 3rem;
    font-weight: 700;
    color: #fff;
    text-align: center;
}
.engineer dl dd {
    display: grid;
    justify-content: start;
    border-radius: 8px;
    width: 80%;
    background-color: #fff;
    padding: 5rem 10rem;
    box-shadow: 0 2px 2px rgba(0, 0, 0, 0.16);
}
.engineer dl:nth-of-type(1) dd {
    grid-template-columns: 40rem 1fr;
}

.engineer dl dd div {
    display: grid;
    grid-template-rows: subgrid;
    grid-row: span 2;
}
.engineer dl dd div ul {
    display: flex;
    flex-direction: column;
    gap: 1rem 0;
}
.engineer dl dd div ul:nth-of-type(1) {
    display: flex;
    flex-direction: column;
    gap: 1rem 0;
}
.engineer dl dd div ul li {
    position: relative;
    padding-left: 2rem;
    font-size: 2rem;
    font-weight: 500;
}
.engineer dl dd div ul li::before {
    color: #1B5CAB;
    content: "⚫︎";
    position: absolute;
    top: 0;
    left: 0;
    width: 1rem;
    height: 1rem;
}

@media (max-width: 768px) {
    div.engineer {
    padding-top: 40px;
    padding-bottom: 40px;
    } 
    .engineer dl {
        display: block;
    }
    .engineer dl dt {
        width: 100%;
        height: 7.5rem;
        font-size: 2rem;
    }
    .engineer dl dd {
        border-radius: 8px;
        width: 100%;
        padding: 2.4rem 2.6rem 1.4rem;
    }
    .engineer dl:nth-of-type(1) dd {
        grid-template-columns: 1fr;
    }
    .engineer dl dd div {
    display: grid;
    grid-template-rows: subgrid;
    grid-row: span 2;
}
    .engineer dl dd div:nth-of-type(1) {
        padding-bottom: 0.5rem;
    }
    .engineer dl dd div ul:nth-of-type(1) {
        display: flex;
        flex-wrap: wrap;
        flex-direction: initial;
        gap: 0.5rem;
    }
    .engineer dl dd div ul:nth-of-type(1) li {
        padding-left: 1.4rem;
        font-size: 1.4rem;
    } 
}