.banner{
    border-bottom: 2px solid #8c8b86;
}
.banner .banner-p{
    display: block;
}
.banner .banner-m{
    display: none;
}
#banner{
    display: block;
}
#banner .swiper-pagination-bullet{
    width: 12px;
    height: 12px;
    background: #fff;
    opacity: 1;
    box-shadow: 0 0 10px #000;
}
#banner .swiper-pagination-bullet-active{
    background: #0f69b5;
}
#banner .swiper-button-prev,#banner .swiper-button-next{
    width: 36px;
    height: 107px;
    margin-top: -53px;
    -moz-background-size: 100% 100%;
    -webkit-background-size: 100% 100%;
    background-size: 100% 100%;
}
#banner .swiper-button-prev{
    left: 2%;
    background-image: url("../images/banner-l.png");
}
#banner .swiper-button-next{
    right: 2%;
    background-image: url("../images/banner-r.png");
}
#m-banner{
    display: none;
}
#m-banner .swiper-pagination-bullet{
    width: 0.12rem;
    height: 0.12rem;
    background: #fff;
    opacity: 1;
    box-shadow: 0 0 0.1rem #000;
}
#m-banner .swiper-pagination-bullet-active{
    background: #0f69b5;
}
.products-show{
    padding: 40px 0 50px 0;
    background: #fff;
}
.products-show .tabNav{
    width: 1000px;
    margin: 0 auto;
}
.products-show .tabNav .tab-txt{
    font-size: 20px;
    height: 48px;
    line-height: 48px;
    color: #595757;
    font-weight: bold;
    float: left;
}
.products-show .tabNav .tabList{
    width: 828px;
    float: right;
}
.products-show .tabNav .tabList .tab{
    display: block;
    width: 138px;
    text-align: center;
    height: 48px;
    line-height: 48px;
    float: left;
    font-size: 19px;
    color: #595757;
    transition: 400ms;
    -moz-transition: 400ms;
    -webkit-transition: 400ms;
    -o-transition: 400ms;
}
.products-show .tabNav .tabList .tab.active{
    font-size: 21px;
    font-weight: bold;
    color: #0081cc;
}
.products-show .tabNav .tabList .tab:hover{
    font-size: 21px;
    color: #0081cc;
}
.products-show .hot-show{
    margin-top: 90px;
    padding-bottom: 40px;
}
.products-show .hot-show img{
    display: block;
}
.products-show .hot-show .hot-banner{
    width: 78.3333%;
    float: left;
}
.products-show .hot-show .hot-banner img {
    max-width: 100%;
    vertical-align: middle;
}
.products-show .hot-show .hot-list{
    width: 16.875%;
    float: right;
    margin-right: 2%;
}
.products-show .hot-show .hot-list .item{
    display: block;
}
.productsMain{
    padding: 96px 0;
    background: url(../images/products-bg.png) no-repeat top 500px center;
    background-size: 100% auto;
}
.productsMain .productsList{
    margin-top: 120px;
}
.productsMain .productsList.first{
    margin-top: 0;
}
.productsMain .productsList .title{
    text-align: center;
    margin: 0 0 70px 0;
    font-size: 42px;
    font-weight: lighter;
    color: #1079b3;
}
.productsMain .productsList .item{
    width: 310px;
    display: block;
    border: 1px solid #fff;
    box-shadow: -5px 5px 6px rgba(0,0,0,0.68);
    float: left;
    margin: 0 0 0 8px;
}
.productsMain .productsList .item .imgBox{
    text-align: center;
}
.productsMain .productsList .item .imgBox img{
    display: block;
}
.productsMain .productsList .item .txtBox{
    background: #fff;
    padding: 14px 12px;
    position: relative;
}
.productsMain .productsList .item .txtBox::before{
    content: "";
    position: absolute;
    top: 14px;
    left: 4%;
    background: #595757;
    height: 1px;
    width: 92%;
}
.productsMain .productsList .item .txtBox .t1{
    width: 68%;
    height: 52px;
    line-height: 52px;
    font-size: 22px;
    color: #000;
    float: left;
    letter-spacing: 5px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
}
.productsMain .productsList .item .txtBox .t2{
    height: 52px;
    line-height: 52px;
    padding-left: 20px;
    font-size: 22px;
    letter-spacing: 5px;
    color: #595757;
    background: url(../images/hot-i.png) no-repeat left 0 center;
    background-size: auto 18px;
    transition: 400ms;
    -moz-transition: 400ms;
    -webkit-transition: 400ms;
    -o-transition: 400ms;
    float: right;
}
.productsMain .productsList .item .txtBox .t2:hover{
    color: #0081cc;
    background: url(../images/hot-i2.png) no-repeat left 2px center;
    background-size: auto 18px;
}
.productsMain .productsList .more{
    display: block;
    width: 172px;
    text-align: center;
    height: 58px;
    line-height: 58px;
    border-radius: 29px;
    font-size: 19px;
    color: #595757;
    background: #e1e1e1;
    margin: 40px auto 0 auto;
    transition: 400ms;
    -moz-transition: 400ms;
    -webkit-transition: 400ms;
    -o-transition: 400ms;
}
.productsMain .productsList .more:hover{
    color: #fff;
    background: #0081cc;
}
.detailsMain{
    padding: 40px 0 90px 0;
}
.detailsMain .title{
    text-align: center;
    font-size: 42px;
    font-weight: lighter;
    color: #1079b3;
}
.detailsMain .details-scene .des{
    font-size: 22px;
    font-weight: lighter;
    line-height: 200%;
    color: #595757;
    text-align: center;
    margin: 60px 0;
}
.detailsMain .details-scene .imgBox .img{
    width: 48.8281%;
}
.detailsMain .details-scene .imgBox img{
    display: block;
}
.detailsMain .details-scene .imgBox .img:nth-child(odd){
    float: left;
}
.detailsMain .details-scene .imgBox .img:nth-child(even){
    float: right;
}
.detailsMain .details-show{
    margin-top: 120px;
}
.detailsMain .details-show .show{
    margin-top: 60px;
    position: relative;
}
.detailsMain .details-show .show .show-bg{
    background: #eeeeee;
    width: 50%;
    height: 504px;
}
.detailsMain .details-show .show:nth-child(odd) .show-bg{
    float: left;
}
.detailsMain .details-show .show:nth-child(even) .show-bg{
    float: right;
}
.detailsMain .details-show .show .show-img{
    width: 50%;
    height: 504px;
    float: right;
}
.detailsMain .details-show .show:nth-child(odd) .show-img{
    float: right;
}
.detailsMain .details-show .show:nth-child(even) .show-img{
    float: left;
}
.detailsMain .details-show .show .box{
    height: 504px;
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -640px;
}
.detailsMain .details-show .show .show-txt{
    width: 530px;
    float: left;
    margin-top: 110px;
}
.detailsMain .details-show .show:nth-child(odd) .show-txt{
    float: left;
}
.detailsMain .details-show .show:nth-child(even) .show-txt{
    float: right;
}
.detailsMain .details-show .show-txt .t1{
    font-size: 36px;
    font-weight: bold;
    color: #5f5f5f;
}
.detailsMain .details-show .show-txt .t2{
    font-size: 22px;
    font-weight: lighter;
    color: #595757;
    margin-top: 42px;
}
.detailsMain .details-show .show-txt .t3{
    font-size: 22px;
    font-weight: lighter;
    color: #595757;
    margin-top: 42px;
}
.detailsMain .details-show .show-txt .t3 span{
    display: inline-block;
    margin-right: 5%;
}
.detailsMain .details-optional{
    margin-top: 80px;
}
.detailsMain .details-optional .choice{
    width: 80%;
    margin: 0 auto;
}
.detailsMain .details-optional .choice .t1{
    font-size: 22px;
    font-weight: lighter;
    text-align: center;
    color: #595757;
    margin-top: 54px;
}
.detailsMain .details-optional .choice .t2{
    font-size: 22px;
    font-weight: lighter;
    line-height: 200%;
    color: #595757;
    margin-top: 54px;
}
.detailsMain .details-optional .choice .t2 span{
    display: inline-block;
    margin: 0 3%;
}
.detailsMain .details-optional .swiper-container{
    width: 100%;
    margin-top: 54px;
}
.detailsMain .details-optional .swiper-slide{
    width: 418px;
    margin: 0 10px;
}
.detailsMain .details-optional .swiper-button-prev{
    left: 50%;
    margin-left: -640px;
}
.detailsMain .details-optional .swiper-button-next{
    right: 50%;
    margin-right: -635px;
}
.detailsMain .details-models{
    margin-top: 80px;
}
.detailsMain .details-models .item{
    width: 410px;
    margin: 60px 25px 0 0;
    text-align: center;
    height: 600px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    position: relative;
    float: left;
    background: #eeeeee;
}
.detailsMain .details-models .item:nth-child(3n){
    margin: 60px 0 0 0;
}
.detailsMain .details-models .item img{
    max-width: 74%;
    margin-bottom: 28%;
}
.detailsMain .details-models .item .name{
    display: block;
    font-size: 22px;
    font-weight: lighter;
    width: 86%;
    height: 58px;
    line-height: 58px;
    overflow: hidden;
    white-space: nowrap;
    text-overflow: ellipsis;
    position: absolute;
    left: 7%;
    bottom: 18%;
    color: #595757;
    border-top: 1px solid #595757;
    border-bottom: 1px solid #595757;
}
.detailsMain .details-parameter{
    margin-top: 80px;
}
.detailsMain .details-parameter .box{
    box-shadow: -5px 5px 5px rgba(0,0,0,0.4);
    margin: 60px auto 0 auto;
}
.detailsMain .details-parameter .box img{
    display: block;
}
.detailsMain .details-more{
    margin-top: 80px;
}
.detailsMain .details-more .listBox{
    width: 94%;
    max-width: 1200px;
    margin: 60px auto 0 auto;
    overflow: hidden;
    position: relative;
}
.detailsMain .details-more .listBox .mid{
    width: 673px;
    height: 300px;
    background: url("../images/car-mid.png") no-repeat center;
    background-size: 100% auto;
    position: absolute;
    left: 150px;
    top: 0;
}
.detailsMain .details-more .listBox .swiper-container{
    width: 100%;
}
.detailsMain .details-more .listBox .swiper-slide{
    width: 400px;
    height: 300px;
    display: -webkit-box;
    display: -ms-flexbox;
    display: -webkit-flex;
    display: flex;
    -webkit-box-pack: center;
    -ms-flex-pack: center;
    -webkit-justify-content: center;
    justify-content: center;
    -webkit-box-align: center;
    -ms-flex-align: center;
    -webkit-align-items: center;
    align-items: center;
    z-index: 9;
}
.detailsMain .details-more .listBox .swiper-slide img{
    transform: scale(0.5);
    opacity: 0.58;
    -webkit-filter: grayscale(100%);
    -moz-filter: grayscale(100%);
    -o-filter: grayscale(100%);
    filter: grayscale(100%);
    transition: 400ms;
    -moz-transition: 400ms;
    -webkit-transition: 400ms;
    -o-transition: 400ms;
}
.detailsMain .details-more .listBox .swiper-slide .name{
    width: 100%;
    position: absolute;
    left: 0;
    bottom: 50px;
    text-align: center;
    font-size: 21px;
    transition: bottom 400ms;
    -moz-transition: bottom 400ms;
    -webkit-transition: bottom 400ms;
    -o-transition: bottom 400ms;
}
.detailsMain .details-more .listBox .swiper-slide.swiper-slide-active .name{
    bottom: 0;
    background: url("../images/car-tBox.png") no-repeat center;
}
.detailsMain .details-more .listBox .swiper-slide.swiper-slide-active img{
    transform: scale(1);
    -webkit-filter: none;
    -moz-filter: none;
    -o-filter: none;
    filter:none;
    opacity: 1;
}
.detailsMain .btnBox{
    width: 860px;
    margin: 60px auto 0 auto;
}
.detailsMain .btnBox .btn{
    display: block;
    width: 418px;
    height: 128px;
    background: url("../images/product-btn1.png") no-repeat center;
    background-size: cover;
    margin: 0 auto;
}
.productsMain.listMain{
    padding: 40px 0 90px 0;
}
.productsMain.listMain .productsList .item{
    margin: 0 0 26px 8px;
}
.listMain .productsList .type-t{
    font-size: 74px;
    font-weight: normal;
    color: #1b7ab1;
    text-align: center;
    letter-spacing: 20px;
}
.productsMain.listMain .productsList .title{
    margin: 50px 0 70px 0;
    font-size: 30px;
}
@media screen and (max-width:1600px){
    #banner .swiper-button-prev,#banner .swiper-button-next{
        width: 30px;
        height: 89px;
        margin-top: -45px;
    }
}
@media screen and (max-width:1280px){
    #banner .swiper-button-prev, #banner .swiper-button-next{
        display: none;
    }
    .products-show{
        padding: 40px 0;
        background: #fff;
    }
    .products-show .hot-show{
        display: none;
    }
    .products-show .tabNav{
        width: 720px;
    }
    .products-show .tabNav .tab-txt{
        display: none;
    }
    .products-show .tabNav .tabList{
        width: 100%;
        float: none;
    }
    .products-show .tabNav .tabList .tab{
        width: 120px;
        height: 42px;
        line-height: 42px;
    }
    .products-show .tabNav .tabList .tab.active,.products-show .tabNav .tabList .tab:hover{
        font-size: 18px;
    }
    .productsMain{
        padding: 0 0 70px 0;
    }
    .productsMain.listMain{
        padding: 40px 0 70px 0;
    }
    .productsMain .productsList{
        width: 690px;
        margin: 96px auto 0 auto;
    }
    .productsMain .productsList .title{
        margin: 0 0 40px 0;
    }
    .productsMain.listMain .productsList .title{
        margin: 40px 0 70px 0;
    }
    .productsMain .productsList .item,.productsMain.listMain .productsList .item{
        width: 323px;
        margin: 0 0 14px 8px;
    }
    .productsMain .productsList .item:nth-child(odd){
        float: left;
    }
    .productsMain .productsList .item:nth-child(even){
        float: right;
    }
    .detailsMain .details-more .listBox .mid{
        left: 50%;
        margin-left: -450px;
    }
    .detailsMain .details-scene .des{
        margin: 45px 0;
    }
    .detailsMain .details-show{
        margin-top: 72px;
    }
    .detailsMain .details-show .show{
        width: 690px;
        margin: 60px auto 0 auto;
    }
    .detailsMain .details-show .show .show-bg{
        display: none;
    }
    .detailsMain .details-show .show .show-img{
        width: 100%;
        height: 310px;
        float: none;
    }
    .detailsMain .details-show .show .box{
        width: 100%;
        height: auto;
        position: relative;
        left: 0;
        margin-left: 0;
    }
    .detailsMain .details-show .show .show-txt{
        text-align: center;
        width: calc(100% - 140px);
        background: #eeeeee;
        margin-top:0;
        padding: 40px 70px;
    }
    .detailsMain .details-show .show-txt .t3{
        display: none;
    }
    .detailsMain .details-optional .choice{
        width: 690px;
    }
    .detailsMain .details-optional .choice .t1,.detailsMain .details-optional .choice .t2{
        margin-top: 48px;
    }
    .detailsMain .details-optional .swiper-slide{
        width: 242px;
        margin: 0 8px;
    }
    .detailsMain .details-optional .swiper-button-prev{
        left: 3%;
        margin-left: 0;
    }
    .detailsMain .details-optional .swiper-button-next{
        right: 3%;
        margin-right: 0;
    }
    .detailsMain .details-models .box{
        width: 690px;
    }
    .detailsMain .details-models .item{
        width: 335px;
        height: 500px;
        margin: 60px 0 0 0;
    }
    .detailsMain .details-models .item:nth-child(odd){
        float: left;
    }
    .detailsMain .details-models .item:nth-child(even){
        float: right;
    }
    .detailsMain .details-models .item .name{
        height: 48px;
        line-height: 48px;
        font-size: 18px;
    }
    .detailsMain .btnBox{
        width: 100%;
    }
}
@media screen and (max-width:750px){
    .banner{
        border-bottom: none;
    }
    .banner .banner-p{
        display: none;
    }
    .banner .banner-m{
        display: block;
    }
    #banner{
        display: none;
    }
    #m-banner{
        display: block;
    }
    .products-show{
        padding: 0.4rem 0;
    }
    .products-show .tabNav{
        width: 7.2rem;
    }
    .products-show .tabNav .tabList .tab{
        width: 1.2rem;
        height: 0.42rem;
        line-height: 0.42rem;
        font-size: 0.18rem;
    }
    .products-show .tabNav .tabList .tab.active,.products-show .tabNav .tabList .tab:hover{
        font-size: 0.18rem;
    }
    .productsMain.listMain{
        padding: 0.4rem 0 0.9rem 0;
    }
    .productsMain{
        padding: 0 0 0.7rem 0;
    }
    .productsMain .productsList{
        width: 6.9rem;
        margin: 0.96rem auto 0 auto;
    }
    .productsMain .productsList .title{
        margin: 0 0 0.4rem 0;
        font-size: 0.42rem;
    }
    .listMain .productsList .type-t{
        margin-bottom: 0.4rem;
        font-size: 0.74rem;
        letter-spacing: 0.2rem;
    }
    .productsMain.listMain .productsList .title{
        margin: 0.4rem 0;
        font-size: 0.3rem;
    }
    .productsMain .productsList .item,.productsMain.listMain .productsList .item{
        width: 3.23rem;
        margin: 0 0 0.14rem 0.08rem;
        box-shadow: -0.05rem 0.05rem 0.06rem rgba(0,0,0,0.68);
    }
    .productsMain .productsList .item .txtBox{
        padding: 0.14rem 0.12rem;
    }
    .productsMain .productsList .item .txtBox::before{
        top: 0.14rem;
    }
    .productsMain .productsList .item .txtBox .t1{
        height:0.52rem;
        line-height: 0.52rem;
        font-size: 0.22rem;
        letter-spacing: 0.05rem;
    }
    .productsMain .productsList .item .txtBox .t2{
        height:0.52rem;
        line-height: 0.52rem;
        font-size: 0.22rem;
        padding-left: 0.2rem;
        letter-spacing: 0.05rem;
        background: url(../images/hot-i.png) no-repeat left 0 center;
        background-size: auto 0.18rem;
    }
    .productsMain .productsList .item .txtBox .t2:hover{
        background: url(../images/hot-i2.png) no-repeat left 2px center;
        background-size: auto 0.18rem;
    }
    .productsMain .productsList .more{
        width: 1.72rem;
        height: 0.58rem;
        line-height: 0.58rem;
        border-radius: 0.29rem;
        margin: 0.5rem auto 0 auto;
        font-size: 0.19rem;
    }
    .detailsMain .details-more .listBox{
        margin: 0.6rem auto 0 auto;
    }
    .detailsMain .details-more .listBox .mid{
        width: 100%;
        height: 4rem;
        background: url("../images/mobile/car-mid.png") no-repeat left 0.1rem center;
        background-size: 6rem auto;
        position: absolute;
        margin-left: 0;
        top: 0;
        left: 0;
    }
    .detailsMain .details-more .listBox .swiper-slide{
        width: 4rem;
        height: 4rem;
    }
    .detailsMain .details-more .listBox .swiper-slide .name{
        font-size: 0.22rem;
    }
    .model .listBox .swiper-slide.swiper-slide-active .name{
        background-size: 1.23rem auto;
    }
    .detailsMain{
        padding: 0.4rem 0 0.9rem 0;
    }
    .detailsMain .title{
        font-size: 0.42rem;
    }
    .detailsMain .details-scene .des{
        font-size: 0.22rem;
        margin: 0.45rem 0;
    }
    .detailsMain .details-show{
        margin-top: 0.72rem;
    }
    .detailsMain .details-show .show {
        width: 6.9rem;
        margin: 0.6rem auto 0 auto;
    }
    .detailsMain .details-show .show .show-img{
        height: 3.1rem;
    }
    .detailsMain .details-show .show .show-txt {
        width: calc(100% - 1.4rem);
        padding: 0.4rem 0.7rem;
    }
    .detailsMain .details-show .show-txt .t1{
        font-size: 0.36rem;
    }
    .detailsMain .details-show .show-txt .t2{
        font-size: 0.22rem;
        margin-top: 0.42rem;
    }
    .detailsMain .details-optional{
        margin-top: 0.8rem;
    }
    .detailsMain .details-optional .choice{
        width: 100%;
    }
    .detailsMain .details-optional .choice .t1, .detailsMain .details-optional .choice .t2{
        font-size: 0.22rem;
        margin-top: 0.48rem;
    }
    .detailsMain .details-optional .swiper-container{
        margin-top: 0.54rem;
    }
    .detailsMain .details-optional .swiper-slide{
        width: 2.42rem;
        margin: 0 0.08rem;
    }
    .detailsMain .details-models{
        margin-top: 0.8rem;
    }
    .detailsMain .details-models .box {
        width: 6.9rem;
    }
    .detailsMain .details-models .item {
        width: 3.35rem;
        height: 5rem;
        margin: 0.6rem 0 0 0;
    }
    .detailsMain .details-models .item:nth-child(3n) {
        margin: 0.6rem 0 0 0;
    }
    .detailsMain .details-models .item .name {
        height: 0.48rem;
        line-height:  0.48rem;
        font-size: 0.18rem;
    }
    .detailsMain .details-parameter{
        margin-top: 0.8rem;
    }
    .detailsMain .details-parameter .box{
        margin: 0.6rem auto 0 auto;
        box-shadow:none;
    }
    .detailsMain .details-more{
        margin-top: 0.8rem;
    }
    .detailsMain .btnBox{
        margin: 0.6rem auto 0 auto;
    }
    .detailsMain .btnBox .btn {
        width: 4.18rem;
        height: 1.28rem;
    }
}