@media screen and (min-width:320px) and (max-device-width:640px) {
    .header-box {
        height: auto;
    }
    #AutoRetail{
        width: 100%;
        margin: 0 auto;
        box-sizing: border-box;
    }
    .section {
        min-width: 100%;
        max-width: 100%;
        padding:0;
    }
    .content {
        width: 100%;
    }
    #banner {
        width: 100%;
        height: 100%;
        min-width: 100%;
        background-size: cover;
    }
    #bannerPic {
        width:100%;
    }
    #bannerPic img {
        max-width: 80%;
        left: 5%;
        top: 25%;
    }

    .bannerBtn {
        width: 100%;
        left: 50%;
        margin-left: -48%;
        top:50%;
    }

    .bannerBtn span {
        padding-left: 8%;
        font-size: 20px;
        height: auto;
        line-height: 1.8;
    }

    .bannerBtn2 {
        margin-left: 0;
    }

    h2{
        font-size: 28px;
    }
    #AutoSect1 h3{
        font-size: 22px;
    }
    .threeRea{
        width: 100%;

    }
    .thReaUlLi{
        padding: 1%;
    }
    .thReaUlLi ol{
        width: 80%;
    }
    .thReaUlLi ol li{
        width: 45%;
        font-size: 14px;
        line-height: 1.2;
    }
    .AutoSect3{
        height: auto;
        background: none;
    }
    .pc{
        display: none;
    }
    .mobile{
        display: block;
    }

    #Extend {
        width: 100%;
    }
    #Extend1 {
        width: 40%;
        margin-top: 2%;
    }
    #Extend1 img {
        margin-left: 1%;
    }
    .des2 {
        width:100%;
        margin: 0 auto;
    }
}
