.sec_contents {
    & .job_description_list {
        margin-bottom: 5.4rem;

        & dl {
            width: 100%;
            display: flex;
            align-items: stretch;
            justify-content: flex-start;
            gap: 0.7rem;
            margin-bottom: 0.7rem;
            box-sizing: border-box;

            & dt {
                display: flex;
                justify-content: center;
                align-items: center;
                width: 29rem;
                color: var(--color-txt);
                font-size: 2rem;
                font-weight: 700;
                text-align: center;
                background: var(--color-bg-light-green);
                letter-spacing: 0.05em;
            }

            & dd {
                width: calc(100% - 29.7rem);
                padding: 2.4rem;
                font-size: 2rem;
                font-weight: 500;
                background-color: rgba(255, 255, 255, 0.5);

                & span {
                    display: inline-block;
                    width: 100%;
                    
                    &.addition {
                        font-size: 1.75rem;
                    }
                }
            }
        }
    }
    & .job_description_flow {
        & .flow_contents {
            margin-bottom: 6.5rem;

            & ol {
                width: 100%;
                display: grid;
                grid-template-columns: 40rem 1fr 1fr 1fr;
                gap: 4.5rem;

                & li {
                    position: relative;
                    padding: 3rem;
                    font-size: 2.2rem;
                    font-weight: 700;
                    text-align: center;

                    &::after {
                        content: "";
                        position: absolute;
                        right: -4.5rem;
                        top: 50%;
                        transform: translate(-50%, -50%);
                        display: inline-block;
                        width: 2rem;
                        height: 2.4rem;
                        background-color: var(--color-txt);
                        clip-path: polygon(100% 50%, 0 0, 0 100%);
                    }
                    

                    &:nth-child(1) {
                        background-color: rgba(255, 152, 42, 0.45);
                    }
                    &:nth-child(2) {
                        background-color: rgba(244, 218, 16, 0.45);
                    }
                    &:nth-child(3) {
                        background-color: rgba(244, 218, 16, 0.45);
                    }
                    &:nth-child(4) {
                        background-color: rgba(123, 231, 61, 0.45);
                    }

                    &:last-child {
                        &::after {
                            content: none;
                        }
                    }
                }
            }
        }
    }
}

@media screen and (max-width: 1279px) {
    .sec_contents {
        & .job_description_flow {
            & .flow_contents {
                & ol {
                   & li {
                    padding: 2rem;
                    font-size: 1.8rem;
                   }
                }
            }
        }
    }
}

@media screen and (max-width: 1023px) {
    .sec_contents {
        & .job_description_flow {
            & .flow_contents {
                & ol {
                    grid-template-columns: 1fr;
                    column-gap: 0;

                    & li {
                        padding: 2.4rem;
                        font-size: 2rem;

                        &::after {
                            right: 50%;
                            top: initial;
                            bottom: -50%;
                            transform: rotate(90deg) translate(-35%,-50%);
                        }
                    }
                }
            }
        }
    }
}


@media screen and (max-width: 768px) {
    .sec_contents {
        & .job_description_list {
            & dl {
                flex-wrap: wrap;
                text-align: left;

                & dt {
                    justify-content: flex-start;
                    width: 100%;
                    padding: 1.4rem;
                }
                & dd {
                    width: 100%;
                    padding: 1.4rem;
                }
            }
        }
    }
}

@media screen and (max-width: 767px) {
    .sec_contents {
        & .job_description_list {
            margin-bottom: 3.5rem;

            & dl {
                & dt {
                    font-size: 1.6rem;
                }
                & dd {
                    font-size: 1.6rem;

                    & span {
                        &.addition {
                            font-size: 1.5rem;
                        }
                    }
                }
            }
        }
    }
}