#news {
    width: 100%;
    margin-bottom: 7rem;
    @media screen and (max-width: 767px) {
        margin-bottom: 3rem;
    }
    .white-card {
        background-color: #fff;
        border-radius: 15.2rem;
        /* display: flex;
        flex-direction: column;
        align-items: center; */
        display: block;
        position: relative;
        padding: 14rem 17.9rem 17rem;
        box-sizing: border-box;
        @media screen and (max-width: 767px) {
            border-radius: 5.2rem;
            padding: 4.6rem 3rem 5rem;
        }
        .content-flex {
            width: 100%;
            display: flex;
            gap: 10rem;
            @media screen and (max-width: 767px) {
                flex-direction: column;
                gap: 3rem;
            }
            .menu {
                width: 28rem;
                .title {
                    margin-bottom: 3.7rem;
                    @media screen and (max-width: 767px) {
                        display: none;
                    }
                    @media screen and (max-width: 767px) {
                        margin-bottom: 3rem;
                    }
                    .en {
                        font-style: normal;
                        font-weight: 700;
                        font-size: 1.6rem;
                        line-height: 2rem;
                        color: #005293;
                        margin-bottom: 0.8rem;
                        display: block;
                        @media screen and (max-width: 767px) {
                            font-size: 1.4rem;
                            line-height: 1.6rem;
                        }
                    }
                    .jp {
                        font-style: normal;
                        font-weight: 700;
                        font-size: 2.4rem;
                        line-height: 2.9rem;
                        color: #000000;
                        display: block;
                        @media screen and (max-width: 767px) {
                            font-size: 2rem;
                            line-height: 2.4rem;
                        }
                    }
                }
                .archive-category {
                    display: flex;
                    flex-wrap: wrap;
                    gap: 1.6rem 1rem;
                    @media screen and (max-width: 767px) {
                        gap: 1.6rem 1.2rem;
                    }
                    & li {
                        & a {
                            background-color: #d9d9d9;
                            border-radius: 0.8rem;
                            padding: 0.5rem 1rem;
                            box-sizing: border-box;
                            font-style: normal;
                            font-weight: 600;
                            font-size: 1.4rem;
                            line-height: 173%;
                            letter-spacing: 0.08em;
                            color: #838383;
                            @media screen and (max-width: 767px) {
                                font-size: 1.2rem;
                                line-height: 2;
                                border-radius: 0.4rem;
                                padding: 0rem 0.65rem;
                            }
                        }
                    }
                    & li.active {
                        & a {
                            background-color: #fff955;
                            color: #000;
                            border-radius: 0.4rem;
                        }
                    }
                }
            }
            .news-posts {
                width: 100%;
                flex: 1;
                & li {
                    border-bottom: 1px solid #aeaeae;
                    padding-bottom: 3.3rem;
                    margin-bottom: 3.3rem;
                    @media screen and (max-width: 767px) {
                        padding-bottom: 1.6rem;
                        margin-bottom: 1.6rem;
                    }
                    & a {
                        display: flex;
                        gap: 4.3rem;
                        @media screen and (max-width: 767px) {
                            gap: 1.4rem;
                        }
                        .img-contents {
                            width: 23rem;
                            border-radius: 1.2rem;
                            overflow: hidden;
                            @media screen and (max-width: 767px) {
                                width: 8.6rem;
                                border-radius: 0;
                            }
                            & img {
                                height: 14rem;
                                object-fit: cover;
                                width: 100%;
                                vertical-align: top;
                                @media screen and (max-width: 767px) {
                                    height: 5.2rem;
                                }
                            }
                        }
                        .text-contents {
                            width: 100%;
                            flex: 1;
                            .date-cat-reverse {
                                display: flex;
                                align-items: center;
                                gap: 2.2rem;
                                margin-bottom: 1.25rem;
                                @media screen and (max-width: 767px) {
                                    display: flex;
                                    flex-direction: row-reverse;
                                    justify-content: flex-end;
                                    gap: 0 1.4rem;
                                    width: 100%;
                                    align-items: baseline;
                                    margin-bottom: 1rem;
                                }
                                .list-date {
                                    font-style: normal;
                                    font-weight: 700;
                                    font-size: 1.8rem;
                                    line-height: 173%;
                                    letter-spacing: 0.08em;
                                    color: #005293;
                                    @media screen and (max-width: 767px) {
                                        font-size: 1.4rem;
                                    }
                                }
                                .list-category {
                                    display: flex;
                                    gap: .8rem;
                                    & span {
                                        background-color: #fff955;
                                        border-radius: 0.8rem;
                                        padding: 0.5rem 1rem;
                                        box-sizing: border-box;
                                        font-style: normal;
                                        font-weight: 600;
                                        font-size: 1.4rem;
                                        line-height: 173%;
                                        letter-spacing: 0.08em;
                                        color: #000;
                                        display: block;
                                        @media screen and (max-width: 767px) {
                                            font-size: 1.2rem;
                                            line-height: 2;
                                            border-radius: 0.4rem;
                                            padding: 0rem 0.65rem;
                                        }
                                    }
                                }
                            }
                            .list-title {
                                font-style: normal;
                                font-weight: 700;
                                font-size: 2rem;
                                line-height: 173%;
                                letter-spacing: 0.08em;
                                color: #000000;
                                @media screen and (max-width: 767px) {
                                    font-size: 1.4rem;
                                    font-weight: 400;
                                    line-height: 180%;
                                }
                            }
                        }
                    }
                }
            }
        }
    }
}