@media screen and (max-width:1270px) {
    .top-page-area {
        .top-page {
            .top-page-content-area {
                .base-img-area {

                    .front-img {

                        img {
                            height: 128vh;
                        }
                    }
                }

                .top-page-content {

                    .top-page-content-title-area {
                        text-align: center;
                    }

                    .top-page-content-text-area {

                        .top-page-content-text-img {

                            img {}
                        }

                        .top-page-content-text {
                            font-size: 18px;

                            .page-text {
                                .top-under-text {
                                    margin-top: 20px;
                                }

                                .president-name-area {

                                    .president-area {
                                        margin: 0;
                                    }

                                    .president-name {}

                                    .president-name-en {
                                        margin: 0;
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }

    .company-page-area {

        .company-page {
            position: relative;
            z-index: 10;
            margin-top: 280px;


            .company-page-content-area {

                .company-page-content-img {
                    img {}
                }

                .company-detail-area {

                    ul {

                        .company-detail {


                            &::before {}

                            &::after {}
                        }
                    }
                }
            }
        }
    }
}

@media screen and (max-width: 768px) {
    .top-page-area {

        .top-page {
            .top-page-content-area {
                .base-img-area {

                    .front-img {
                        margin-top: -90vh;
                        padding-bottom: 40px;
                        width: 100%;

                        img {
                            height: 165vh;
                        }
                    }
                }

                .top-page-content {
                    width: 100%;

                    .top-page-content-title-area {
                        text-align: center;

                        /* width: 100%;
                        margin: 0 auto;
                        text-align: center; */
                        .top-page-content-title {
                            font-size: 36px;
                        }
                    }

                    .top-page-content-text-area {
                        flex-direction: column;
                        margin-top: 30px;
                        gap: 40px;

                        .top-page-content-text-img {
                            width: 90%;

                            img {
                                width: 100%;
                                height: 300px;
                            }
                        }

                        .top-page-content-text {
                            width: 100%;
                            line-height: 1.8;
                            font-size: 18px;

                            .page-text {
                                .top-under-text {
                                    width: 90%;
                                    margin-top: 20px
                                }

                                .president-name-area {
                                    margin-top: 30px;

                                    .president-area {
                                        font-size: 14px;
                                    }

                                    .president-name {
                                        font-size: 18px;
                                    }

                                    .president-name-en {
                                        font-size: 14px;
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }

    .company-page-area {
        width: 100%;
        margin: 0 auto;
        position: relative;
        z-index: 10;
        margin-top: 30px;

        .company-page {
            width: 100%;
            margin-top: 200px;

            .company-page-title-area {
                text-align: center;

                .company-page-title {
                    font-size: 36px;
                }

                /* .company-page-sub-title {} */
            }

            .company-page-content-area {
                flex-direction: column;

                .company-page-content-img {
                    width: 90%;

                    img {
                        width: 100%;
                        height: 350px;
                    }
                }

                .company-detail-area {
                    width: 90%;
                    margin: 0 auto;
                    margin-top: 40px;

                    ul {

                        .company-detail {
                            width: 80%;
                            margin: 0 auto;
                            padding: 20px;

                            &::before {
                                width: 37%;
                            }

                            &::after {
                                width: 65%;
                            }

                            .company-detail-title {}

                            .company-detail-content {
                                margin-left: 80px;
                            }
                        }
                    }
                }
            }
        }
    }
}

@media screen and (max-width:431px) {
    .top-page-area {
        .top-page {
            .top-page-content-area {
                .base-img-area {

                    .front-img {

                        img {
                            height: 208vh;
                        }
                    }
                }

                .top-page-content {
                    width: 100%;

                    .top-page-content-title-area {
                        text-align: center;

                        .top-page-content-title {
                            font-size: 36px;
                        }

                        .top-page-content-sub-title {}
                    }

                    .top-page-content-text-area {
                        flex-direction: column;
                        margin-top: 30px;
                        gap: 40px;

                        .top-page-content-text-img {
                            width: 90%;

                            img {
                                width: 100%;
                                height: 300px;
                            }
                        }

                        .top-page-content-text {
                            width: 100%;
                            line-height: 1.8;
                            font-size: 18px;

                            .page-text {
                                .top-under-text {
                                    width: 90%;
                                    margin-top: 20px
                                }

                                .president-name-area {
                                    margin-top: 10px;

                                    .president-area {
                                        font-size: 14px;
                                    }

                                    .president-name {
                                        font-size: 16px;
                                    }

                                    .president-name-en {
                                        font-size: 12px;
                                    }
                                }
                            }
                        }
                    }
                }
            }
        }
    }

    .company-page-area {

        .company-page {

            .company-page-title-area {}

            .company-page-content-area {
                flex-direction: column;

                .company-page-content-img {
                    img {}
                }

                .company-detail-area {

                    ul {

                        .company-detail {


                            &::before {
                                width: 40%;
                            }

                            &::after {
                                width: 65%;
                            }
                        }
                    }
                }
            }
        }
    }

    .company-profile-bottom-img-box {
        .swiper-sub {
            .swiper-wrapper {
                .swiper-slide {
                    img {
                        height: 100px;
                    }
                }
            }
        }
    }
}