@media screen and (max-aspect-ratio: 1219/685) {
    .main_banner_mp4 {
        width: auto !important;
        height: 100% !important;
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
    }
}

@media (max-width:1500px) {
    .page2_main-rf_li img {
        height: 330px;
    }
}

@media (max-width:1240px) {
    #header>.inner {
        width: 90%;
        margin: auto;
    }

    #header #nav .menu_tit {
        font-size: 18px;
    }

    .page1_contents h2 {
        font-size: 35px;
    }

    .page1_contents p {
        font-size: 22px;
    }

    .page1_contents h1 {
        font-size: 22px;
    }

    .page2_main-rf_li span {
        font-size: 18px;
    }

    .page2_main-rf_li img {
        height: 230px;
    }

    #page2 .page2_main-lf {
        width: 90%;
        margin: 0 auto;
    }

    #page2 .subpage div .page2_main-rf {
        width: 90%;
        margin: 50px auto 0;
    }

    #page2 .page_contents {
        width: 90%;
        margin: auto;
    }

    h2 {
        font-size: 45px;
    }

    h3 {
        font-size: 30px;
    }

    .lf_sec2-2 {
        padding-left: 50%;
    }

    .main03 {
        width: 90%;
        margin: auto;
    }

    .main04_bottom-content {
        width: 90%;
        margin: 60px auto 0;
    }

    .main04_middle-content {
        width: 90%;
        margin: 30px auto 0;
    }

    #page2 .swiper-button-prev {
        left: 45%;
    }

    #page2 .swiper-button-next {
        right: 45%;
    }

    #page3 .swiper-button-prev {
        left: 45%;
    }

    #page3 .swiper-button-next {
        right: 45%;
    }

    .page6_top-content {
        width: 90%;
        margin: 0 auto;
    }

    .page6_bottom-content {
        width: 90%;
        margin: 60px auto 0;
    }

    .page6_card h3 a {
        font-size: 17px;
    }

    .page6_card-info {
        font-size: 14px;
    }

    .foo-inner {
        width: 90%;
        margin: auto;
    }
}

@media (max-width:1024px) {
    #header #nav .menu_ul {
        gap: 30px;
    }

    #header .logo img {
        width: 180px;
    }

    h2 {
        font-size: 35px;
    }

    h3 {
        font-size: 25px;
    }

    p {
        font-size: 16px;
    }

    .page6_bottom-content {
        flex-direction: column;
        gap: 20px;
        margin-top: 20px;
    }

    .page6_bottom-li {
        max-width: initial;
        margin: 0;
        height: auto;
    }

    .page6_card .color-overlay {
        max-width: initial;
    }

    .page6_card {
        max-width: initial;
        height: 150px;
        background-size: cover !important;
        display: flex;
        align-items: center;
        flex-direction: column;
        gap: 5px;
        justify-content: center;
    }

    .page6_bottom-li_top {
        margin-bottom: 10px;
        font-size: 15px;
    }

    .page6_card-info {
        position: initial;
        padding: 0;
        width: 90%;
        margin: 0 auto;
    }

    .page6_card:hover .page6_title-content {
        margin: 0;
    }

    .page6_title-content {
        margin: 0;
        position: initial;
    }

    .page6_card-info br:last-child {
        display: none;
    }
}

@media (max-width:840px) {
    .quickIQBox {
        position: absolute;
        top: 0;
        left: 0;
    }
    .dtmbpop,
    .dtmbVideo1{
        display: block !important;
    }
    .dtmbVideoCon{
        display: flex !important;
    }
    .dtmbVideo2{
        display: none !important;
    }
    .quickIQ {
        background-color: #fff;
        border: 2px solid #13568D;
        min-width: 300px;
        position: fixed;
        transform: translate(50%, 50%);
        z-index: 999;
        padding: 40px 20px 20px;
        bottom: 50%;
    }

    #header>.inner {
        height: 55px;
        padding-top: 0px;
    }

    #info {
        display: none;
    }

    .m_info {
        display: flex;
    }

    .m_info img {
        height: 21px;
    }

    .all_ul {
        padding-top: 10px;
    }

    #header {
        height: 60px;
    }


    #header .logo img {
        width: 90px;
    }

    #header #nav .menu_tit {
        font-size: 14px;
    }

    #header #nav .menu_ul {
        gap: 20px;
    }

    #header #nav {
        display: none;
    }

    .swiper-pagination,
    .swiper-pagination2 {
        display: none;
    }

    .header_top_menu {
        display: none;
    }

    .hamburger {
        display: block;
    }

    .header2_li {
        font-size: 15px;
        height: 25px;
    }

    .page1_contents {
        right: auto;
        left: 5%;
    }

    .page2_main-rf_li {
        width: 32%;
        margin: 0;
    }

    .rf_sec2,
    .rf_sec2-2 {
        width: 100%;
    }

    #page2 .page_contents {
        position: absolute;
        z-index: 10;
        color: #fff;
        text-shadow: 3px 3px 10px black;
    }

    .lf_sec2-2 {
        padding: 0;
        width: 90%;
        margin: 0 auto;
    }

    #page4 .main04_li h2 {
        margin: 10px auto;
        font-size: 30px;
    }

    .main05 p {
        width: 90%;
        margin: 10px auto 0;
    }

    .main05 p br {
        display: none;
    }

    #page5 .swiper-pagination2 {
        display: none;
    }

    .foo-info {
        flex-direction: column;
        gap: 20px;
    }

    .foo-info p {
        font-size: 13px;
    }

    .foo-info ul li {
        font-size: 14px;
    }

    .foo-inner .logo {
        margin-bottom: 20px !important;
        width: 120px;
    }

    .foo-inner .logo img {
        width: 100%;
    }

    .foo-info ul li img {
        width: 30px !important;
    }

    .all_li {
        font-size: 20px;
        margin-bottom: 9px;
        margin-top: 9px;
        text-align: left;
        padding-left: 40px;
    }
    .go_page_btn_box{
        row-gap: 10px;
        bottom: 99px;
        right: 10px;
        top: auto;
    }
    .go_page_btn {
        width: 50px;
        height: 50px;
        top: auto;
        bottom: 100px;
        right: 20px;
        box-sizing: border-box;
        transform: none;
        writing-mode: horizontal-tb;
        padding: 0;
        display: flex;
        flex-direction: column-reverse;
        align-items: center;
        justify-content: center;
        font-size: 11px;
    }
    .go_page_btn a{
        margin-top: 5px;
    }
    .pop_up_tcontent,
    .popup {
        width: 300px;
        height: 450px;
    }

    .s_slide {
        height: 100%;
    }

    .pop_up_spans {
        font-size: 14px;
    }

    .pop-pagination {
        position: absolute;
        top: var(--swiper-pagination-top, auto) !important;
        display: block;
        width: 100%;
    }

    .pop_text_content {
        font-size: 13px;
    }

    .pop_text {
        width: 200px;
    }

    .pop_text_title {
        font-size: 20px;
        margin-bottom: 15px;
    }

    #page4 {
        background-image: none !important;
    }

    #page4 .active_car_img {
        top: -50%;
        right: -25%;
        width: 600px;
        z-index: 2;
    }

    @keyframes imgtrans {
        from {
            top: -50%;
        }

        to {
            top: 100%;
        }
    }
}

@media (max-width:499px) {
    #header .logo img {
        width: 120px;
    }

    #header #nav .menu_tit {
        display: none;
    }

    .page1_contents h2 {
        font-size: 30px;
    }

    #page1 p {
        font-size: 18px;
    }

    #page1 h1 {
        font-size: 18px;
    }

    .scroll_ani {
        width: 20px;
        height: 40px;
    }

    h2 {
        font-size: 28px;
    }

    h3 {
        font-size: 20px;
    }

    #page2 .swiper-slide p br {
        display: none;
    }

    #page4 .main04_li h2,
    #page4 .main04_li h3 {
        font-size: 20px;
    }

    .main04_li img {
        width: 50%
    }

    .main04_bottom-content {
        margin-top: 20px;
    }

    .page6_card-info {
        display: none;
    }

    .page6_card {
        height: 80px;
    }

    .foo-info ul li a {
        font-size: 11px;
    }
}

@media (min-width: 1400px) {
    .pop_text_title {
        font-size: 27px;
    }

    .pop_text_content {
        font-size: 20px;
    }

    .pop_text {
        width: 340px;
    }

}