@media (max-width: 1500px) {

    #banner .bottom-box .box > img {max-width: 470px;}

    #banner .bottom-part img {max-width: 360px;}

    #banner .bottom-part li:first-child {padding-right: 40px;}

}


@media (max-width: 1350px) {#banner .bottom-box .box > img {max-width: 440px;}

    #banner .bottom-part img {max-width: 320px;}

    #banner .bottom-box .top-box a img {max-width: 90px;}

    #banner .top-box .content > h2 {font-size: 35px;}

    #banner .top-box .content > h1 {font-size: 55px;}

    #banner .bottom-box .top-box h2 {font-size: 30px;}

    #banner .top-box .content {background-position: 40% 100%;}

    #banner .bottom-box .top-box h2 span {font-size: 30px;}

}


@media (max-width: 1200px) {

    #banner .top-box .content > h2 {font-size: 30px;}

    #banner .top-box .content > h1 {font-size: 50px;}

    #banner .top-box .button h2 {font-size: 18px;}

    #banner .top-box .button span {font-size: 22px;}

    #banner .top-box .button > img {max-width: 35px;}

    #banner .top-box .button {padding: 5px 24px;}

    #banner .bottom-box .box > img {max-width: 360px;}

    #banner .bottom-box .top-box a .icon {max-width: 40px;margin-right: 10px;}

    #banner .bottom-part img {max-width: 280px;}

    #banner .bottom-part li:first-child {padding-right: 15px;}

}


@media (max-width: 1080px) {
    .top-box .img-box {
        margin-bottom: 40px;
        text-align: center;
    }
    .box {
        margin-top: 20px;
        text-align: center;
    }
    .auto {
        max-width: 40%;
        height: auto;
        margin-top: -100px;
    }

    .my-row {align-items: center;flex-direction: column;}

    .box {margin-top: 20px;}

    #banner .bottom-part img {max-width: 270px;}

    #banner .bottom-part li:first-child {padding-right: 20px;margin-bottom: 20px;}

    #banner .bottom-part {text-align: center;}

    body {height: 100%;}

    #banner .bottom-box .top-box a .icon {max-width: 36px;margin-right: 8px;}

    .col-5 {width: 100%;}

    .col-7 {width: 100%;}

    #banner .bottom-box .top-box > ul {justify-content: center;}

    .bottom-box {padding: 0 10px;}

}


@media (max-width: 768px) {

    #banner .top-box .content > h2 {font-size: 25px;}

    #banner .top-box .content > h1 {font-size: 43px;}

    #banner .top-box .button h2 {font-size: 17px;}

    #banner .top-box .button span {font-size: 20px;}

    #banner .bottom-box .box > img {max-width: 320px;}

    .box.box-content {margin-top: 30px;}

    #banner .top-box .content {background-position: 50% 100%;}

    .box {margin-top: -50px;}

    #banner .bottom-part {padding-top: 30px;}
    
}
@media (max-width:992px){
    .auto {
        max-width: 70%;
        height: auto;
        margin-top: 1px;
    }
}

@media(max-width:768px){
    .auto {
        max-width: 70%;
        height: auto;
        margin-top: 1px;
    }
}
@media (max-width: 600px) {

    .auto {
        max-width: 60%;
        height: auto;
        margin-top: 1px;
    }
    #banner .top-box .content > h2 {font-size: 20px;}

    #banner .top-box .content > h1 {font-size: 32px;}

    #banner .top-box .button h2 {font-size: 16px;}

    #banner .top-box .button span {font-size: 18px;}

    #banner .top-box .button {padding: 5px 20px;}

    #banner .top-box .button > img {max-width: 30px;}

    #banner .bottom-box .box > img {max-width: 280px;}

    #banner .bottom-box .top-box h2 {font-size: 25px;}

    #banner .bottom-box .top-box h2 span {font-size: 25px;}

    #banner .bottom-box .top-box > ul > li {padding: 0 20px;}

    #banner .bottom-box .box-content li > ul > li {display: block;}

    #banner .bottom-box .top-box a .icon {max-width: 30px;margin-right: 0px;}

    #banner .bottom-box .box-content li > ul > li:first-child {margin-bottom: 10px;}

    #banner .bottom-part img {max-width: 250px;}

    #banner .bottom-part li:first-child {padding-right: 0;margin-bottom: 20px;display: block;}

    #banner .bottom-part {padding-top: 20px;}

    .box.box-content {margin-top: 20px;}

}


@media (max-width: 448px) {
    .auto {
        max-width: 60%;
        height: auto;
        margin-top: 1px;
    }
    #banner .top-box .content > h2 {font-size: 18px;}

    #banner .top-box .content > h1 {font-size: 29px;}

    #banner .bottom-box .box > img {max-width: 240px;}

    #banner .bottom-box .top-box a img {max-width: 70px;}

    #banner .bottom-box .top-box h2 {
        font-size: 18px;
        text-align: left;
    }
    .top-box .img-box {
        margin-bottom: 20px;
        text-align: center;
    }

    #banner .bottom-box .top-box h2 span {font-size: 18px;}

    #banner .bottom-part img {max-width: 220px;}

    #banner .bottom-box .top-box a .icon {max-width: 25px;margin-right: 0px;}

    #banner .bottom-box .top-box > ul > li {padding: 0 15px;}

}


@media (max-width: 336px) {

    #banner .bottom-box .top-box a img {
        max-width: 60px;
    }

    #banner .bottom-box .top-box h2 {
        font-size: 17px;
    }

    #banner .bottom-box .top-box h2 span {
        font-size: 17px;
    }

    #banner .bottom-box .top-box a .icon {
        max-width: 20px;
        margin-right: 0px;
    }

    #banner .top-box .content > h2 {
        font-size: 17px;
    }

    #banner .top-box .content > h1 {
        font-size: 27px;
    }

    #banner .top-box .button h2 {
        font-size: 15px;
    }

    #banner .top-box .button span {
        font-size: 17px;
    }

    #banner .top-box .button > img {
        max-width: 26px;
    }

    #banner .top-box .button {
        padding: 4px 18px;
    }

    #banner .bottom-box .box > img {
        max-width: 220px;
    }

}