@media screen and (max-width: 678px) {
    header nav{
        display: none;
    }
    section {
        padding: 0;
    }
    .slider .list .item {
        padding-top: 0;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    .slider .list .item .detail {
        width: 100%;
        max-width: 100%;
        height: 80%;
        background-color: rgba(0, 0, 0, 0.5);
    }
    .slider .list .item .detail .name {
        font-size: 1.4rem;
        line-height: 1.5rem;
        padding: 0;
        opacity: 1;
        width: 100%;
    }
    .slider .list .item .detail .title > img {
        width: 7rem;
        height: 5rem;
    }
    .slider .list .item .detail figure {
        font-size: 0.9rem;
        line-height: 1rem;
    }
    .slider .list .item .detail .desc {
        font-size: 0.8rem;
    }
    /* about page */
    #about_left {
        width: 75%;
    }
    .about_desc_top {
        padding: 0.5rem;
        font-size: 0.8rem;
        line-height: 1rem;
        background-color: rgb(10,60,93);
    }
    .about_desc_bottom {
        padding: 0.5rem;
        font-size: 0.8rem;
        line-height: 1rem;
    }
    /* History page */
    #history_left {
        width: 80%;
    }
    .history_desc {
        background-color: rgb(10,60,93);
        padding: 0.5rem;
        color: #FFF;
        font-size:0.8rem;
        line-height: 1rem;
    }
    /* Vision page */
    #vision_desc_wrapper {
        margin: 0;
        height: 100%;
    }
    #vision_left {
        width: 65%;
    }
    #vision_title, #mission_title {
        padding-left: 1rem;
        padding-top: 1rem;
    }
    #vision_desc {
        padding: 1rem;
        font-size: 0.5rem;
        line-height: 1rem;
    }
    #mission_title {
        padding-top: 0;
    }
    #mission_list {
        padding: 1rem;
    }
    #mission_list > li {
        font-size: 0.8rem;
        line-height: 1rem;
    }
    #vision_right {
        display: none;
    }
    #vision_left p, #vision_left ul {
        font-size: 0.8rem;
    }
    /* Legality page */
    #legal_wrapper {
        width: 100%;
    }
    #legal_title {
        width: 100vw;
        margin: -0.5rem -1rem;
    }
    #legal_statement {
        padding-left: 0.5rem;
        padding-right: 0.5rem;
    }
    #legal_title_desc_wrapper {
        padding: 0;
    }
    #legal_title_desc {
        font-size: 1rem;
        padding-left: 0.5rem;
    }
    #legal_desc {
        font-size: 0.7rem;
        padding: 0 1rem;
        margin: 0;
        display: flex;
        justify-content: space-between;
        gap: 2rem;
    }
    #legal_desc ul {
        padding: 0 0.5rem;
        margin: 0;
    }
    #legal_desc p {
        font-size: 0.7rem;
        margin: 0;
    }
    #legal_desc_right {
        padding: 0;
    }
    /* Client page */
    #client_left {
        padding: 0.3rem 0 0 0.5rem;
    }
    #client_title > div {
        margin-left: 4rem;
        position: relative;
        z-index: 990;
    }
    #client_desc {
        margin: 0;
    }
    #client_desc {
        width: 90%;
    }
    #client_img_top, #client_img_bottom {
        background-position: center;
    }
    #client_bg_top {
        height: 20%;
        display: flex;
        justify-content: end;
    }
    #client_bg_top > div {
        height: 100%;
        width: 60%;
        background-color: rgb(10,61,93);
    }
    /* COntact page */
    #contact_wrapper {
        padding: 0;
        font-size: 0.7rem;
        width: 100%;
    }
    #contact_title {
        margin: 0.3rem 0 1rem 5rem;
    }
    #contact_desc {
        width: 70%;
    }
    #contact_detail {
        padding: 0;
        padding-bottom: 1rem;
    }
    .first_column {
        width: 4rem;
    }
    #address_wrapper, #phone_wrapper, #email_wrapper {
        display: block;
    }
    #address, #phone, #email {
        padding: 0.5rem;
    }
    #contact_img {
        width: 30%;
        height: 60%;
        position: absolute;
        z-index: 100;
        right: 0;
        top: 4rem;
        background-position: bottom;
        border-left: 1rem solid rgb(229, 107, 31);
        border-bottom: 1rem solid rgb(229, 107, 31);
    }
    #bg_bottom {
        display: none;
    }
    /* footer */
    footer {
        font-size: 0.5rem;
    }
    footer img {
        display: none;
    }
    #footer_service {
        padding-right: 1rem;
    }
    #footer_client {
        padding-left: 1rem;
    }
}
