.main .bannerImg {
    z-index: 2;
}

.main .bannerSection .top {
    z-index: 1;
    position: relative;
}

.main .entShowcase {
    top: 0;
    height: 100%;
    z-index: 1;
    position: relative;
}

.main .bannerText {
    z-index: 2;
}

.main .entShowcase img {
    object-fit: cover;
    position: relative;
}

.main .entShowcase .showCaseSet {
    width: 100%;
    position: absolute;
}

.main .switchBoard .content{
    width: 100%;
    display: flex;
    align-items: center;
    justify-content: space-between;
    box-sizing: border-box;
    padding: 0 20vw;
    margin: 0;
}

@media screen and (min-width: 860px) {

    .main .top .topGradient {
        left: 0;
    }

    .main .bannerText::after {
        width: 175%;
        left: -13.45vh;
        -webkit-transform: skewX(-18.9deg);
        -moz-transform: skewX(-18.9deg);
        transform: skewX(-18.9deg);
    }

    .main .bannerText {
        width: 45vw;
        position: absolute;
        margin-left: 66.5vh;
        left: 0;
    }

    .main .switchBoard img {
        margin-left: 3vw;
        margin-right: 3vw;
    }

    @media screen and (max-width: 980px) and (min-width: 681px) {
        .main .bannerText::after {
            left: -10vh;
        }

        .main .bannerText {
            margin-left: 67.55vh;
            width: 36vw;
        }
    }

    @media screen and (max-width: 1160px) and (min-width: 981px) {
        .main .bannerText::after {
            left: -12vh;
        }

        .main .bannerText {
            margin-left: 68vh;
            width: 45vw;
        }
    }

    @media screen and (max-width: 1300px) and (min-width: 1161px) {
        .main .bannerText::after {
            left: -12vh;
        }

        .main .bannerText {
            margin-left: 67.2vh;
            width: 50vw;
        }
    }
    
    @media screen and (max-width: 850px) {
        .main .bannerText {
            width: 30vw;
        }

        .main .bannerText p {
            font-size: 1.2vh;
        }
    }

    @media screen and (max-width: 750px) {
        .main .bannerText {
            width: 24vw;
        }

        .main .bannerText::after {
            width: 200%;
        }
    }

    .main .entShowcase {
        left: -1.5vw;
        width: 40%;
        height: 100%;
        top: 0;
        position: relative;
    }

    .main .entShowcase .showCaseSet {
        position: absolute;
    }

    .main .entShowcase.anim {
        left: 0;
    }

    .main .entShowcase .showCaseSet img {
        top: 0;
        left: 0;
        height: 38vh;
        width: auto;
    }

}

@media screen and (max-width: 859px) {

    .main .entShowcase {
        right: -3vw;
        top: 0;
        height: 35vh;
        overflow: hidden;
        background-color: black;
        position: relative;
    }

    .main .entShowCase .showCaseSet {
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        position: absolute;
    }

    .main .entShowcase.anim {
        right: 0;
    }

    .main .entShowcase .showCaseSet img {
        position: absolute;
        left: -3vw;
        top: 0;
        height: 40vh;
        width: auto;
    }

}