﻿html {
    height: 100%;
}

body {
    font-size: 14px;
    font-family: '微软雅黑';
    height: 100%;
    margin: 0;
    padding: 0;
    background: #fff;
    -webkit-tap-highlight-color: rgba(255, 255, 255, 0);
    -webkit-user-select: text;
    -moz-user-focus: text;
    -moz-user-select: text;
    /* webkit-user-select: none;
    -webkit-font-smoothing: antialiased; */
    -webkit-text-size-adjust: none;
    transform-origin: left top;
}

h1,
h2,
h3,
h4,
h5,
h6 {
    font-weight: normal;
    margin: 0;
    padding: 0;
}

div,
dl,
dt,
dd,
input,
button,
label,
ul,
ol,
li,
p,
select,
span,
textarea,
thead,
tfoot,
table,
tr,
td,
figure,
figcaption,
time,
small {
    font-weight: normal;
    margin: 0;
    padding: 0;

}

input,
button {
    font-size: 14px;
}

input,
textarea {
    -webkit-user-select: auto !important;
    -khtml-user-select: auto !important;
    -moz-user-select: auto !important;
    -ms-user-select: auto !important;
    -o-user-select: auto !important;
    user-select: auto !important;
}


div {
    display: block;
}

table {
    border-collapse: collapse;
}

li,
ol,
ul {
    list-style-type: none;
}

img {
    border: 0 none;
    vertical-align: top;
}

em,
cite,
i {
    font-style: normal;
}

button,
input,
textarea,
select {
    border-radius: 0;
    -webkit-appearance: none;
    border: none;
    outline-style: none;
    line-height: 1.3333;
    vertical-align: middle;
    background-color: transparent;
}

select::-ms-expand {
    display: none;
}

input[type=date]:before {
    content: attr(placeholder);
    color: #999;
}

input::-webkit-clear-button,
input::-webkit-calendar-picker-indicator {
    display: none;
}

blockquote,
q {
    quotes: none;
}

blockquote:after,
blockquote:before,
q:after,
q:before {
    content: '';
    content: none;
}

a {
    text-decoration: none
}

:focus {
    outline: 0;
}

*:before,
*:after {
    -webkit-box-sizing: border-box;
    -ms-box-sizing: border-box;
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

input::-webkit-input-placeholder,
textarea::-webkit-input-placeholder {
    color: #999;
}

.clear {
    clear: both;
    overflow: hidden;
    height: 0;
    line-height: 0;
    display: block;
}

.clearfix:after {
    clear: both;
    overflow: hidden;
    height: 0;
    line-height: 0;
    display: block;
    visibility: hidden;
    content: '';
}

/* ::-webkit-scrollbar {
    width: 0;
} */

@font-face {
    font-family: "fzzh";
    src: url("../fonts/fzzh.woff2") format("woff2"),
        url("../fonts/fzzh.woff") format("woff"),
        url("../fonts/fzzh.ttf") format("truetype"),
        url("../fonts/fzzh.eot") format("embedded-opentype"),
        url("../fonts/fzzh.svg") format("svg"),
        url("../fonts/fzzh.otf") format("opentype");
    font-weight: normal;
    font-style: normal;
}

@font-face {
    font-family: "fzzzh";
    src: url("../fonts/fzzzh.woff2") format("woff2"),
        url("../fonts/fzzzh.woff") format("woff"),
        url("../fonts/fzzzh.ttf") format("truetype"),
        url("../fonts/fzzzh.eot") format("embedded-opentype"),
        url("../fonts/fzzzh.svg") format("svg"),
        url("../fonts/fzzzh.otf") format("opentype");
    font-weight: normal;
    font-style: normal;
}

#conv {
    width: 100%;
    height: 100%;
}

header {
    width: 100%;
    /* height: 9%; */
    height: 70px;
    background: #fff;
    position: fixed;
    left: 0;
    top: 0;
    z-index: 9;
    border-bottom: 1px solid #efefef;
    overflow: hidden;
}

header .logo {
    width: 70px;
    position: absolute;
    left: 74px;
    top: 50%;
    transform: translate(0, -50%);
    display: block;
}

header .logo img {
    width: 100%;
}

.headerNav {
    height: 100%;
    position: absolute;
    left: 230px;
    /* left: 383px; */
    top: 0;
}

header .link {
    display: block;
    float: left;
    font-family: "fzzh";
    font-size: 15px;
    color: #333;
    position: relative;
    /* position: absolute;
    left: 0;
    top: 50%;
    transform: translate(0, -50%); */
    display: flex;
    /*实现垂直居中*/
    align-items: center;
    /*实现水平居中*/
    justify-content: center;

    text-align: justify;
    height: 100%;
    margin-right: 60px;
}

header .link .line {
    width: 100%;
    height: 4px;
    background: #1b80dc;
    position: absolute;
    left: 0;
    bottom: -2px;
    display: none;
}

header .link.on .line,
header .link:hover .line {
    display: block;
}

.btnY {
    width: 174px;
    position: absolute;
    top: 50%;
    right: 49px;
    transform: translate(0, -50%) scale(.7);
    display: block;
    overflow: hidden;
}

.btnY img {
    width: 100%;
}

.btnY .hover {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.btnY:hover .hover {
    opacity: 1;
}

.btnK {
    width: 40px;
    height: 46px;
    position: absolute;
    top: 50%;
    right: 240px;
    transform: translate(0, -50%) scale(.7);
    display: block;
    /* background: url(../images-pc/icon-kf.png) no-repeat; */
    background-size: cover;
    transition: all .5s;
}

.btnK .icon {
    width: 100%;
}

.btnK .tip {
    width: 98px;
    position: absolute;
    left: 50%;
    bottom: -38px;
    transform: translate(-50%, -15px);
    visibility: hidden;
    opacity: 0;
    transition: all .5s;
}

.btnK:hover .tip {
    transform: translate(-50%, 0);
    visibility: visible;
    opacity: 1;
}

.swiper-home {
    width: 100%;
    height: 100%;
}

.swiper-home .swiper-slide {
    transform: translate3d(0, 0, 0);
    overflow: hidden;
}

.swiper-indexBan {
    width: 100%;
    height: 100%;
}

.swiper-indexBan .swiper-slide {
    transform: translate3d(0, 0, 0);
}

.ban1 {
    background: url(../images-pc/index-ban1.jpg) no-repeat center center;
    background-size: cover
}

/* .ban1 .tip{
    width: 312px;
    position: absolute;
    left: 50%;
    top: 160px;
    transform: translate3d(-50%,0,0) scale(.7);
} */


.ban1 .btn {
    /* width: 13%; */
    height: 13%;
    position: absolute;
    left: 50%;
    top: 18%;
    transform: translate3d(-50%, 0, 0);
    display: block;
    transition: all .5s;
}

.ban1 .btn img {
    height: 100%;
}

.ban1 .btn .hover {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.ban1 .btn:hover .hover {
    opacity: 1;
}

.ban2 {
    background: url(../images-pc/index-ban2.jpg) no-repeat center center;
    background-size: cover
}

.ban3 {
    background: url(../images-pc/index-ban3.jpg) no-repeat center center;
    background-size: cover
}

.ban4 {
    background: url(../images-pc/index-ban4.jpg) no-repeat center center;
    background-size: cover
}

.ban5 {
    background: url(../images-pc/index-ban5.jpg) no-repeat top center;
    background-size: cover
}

.ban6 {
    background: url(../images-pc/index-ban6.jpg) no-repeat top center;
    background-size: cover
}

.banzt {
    background: url(../images-pc/index-banzt.jpg) no-repeat top center;
    background-size: cover
}

.banqjf {
    background: url(../images-pc/index-banqjf.jpg) no-repeat top center;
    background-size: cover
}

.banmcr {
    background: url(../images-pc/index-banmcr.jpg) no-repeat top center;
    background-size: cover
}

.banmacaron {
    background: url(../images-pc/index-banmacaron.jpg) no-repeat top center;
    background-size: cover
}

.banlk {
    background: url(../images-pc/index-ban-longka.jpg) no-repeat top center;
    background-size: cover
}

.banzc {
    background: url(../images/zhengcheng-pc/poster.jpg) no-repeat top center;
    background-size: cover
}

.banzc .txt {
    height: 27%;
    position: absolute;
    right: 5%;
    top: 13%;
    z-index: 9;
    transform: translate3d(0, 0, 0);
}

.banzx {
    background: url(../images-pc/index-banzx.jpg) no-repeat top center;
    background-size: cover
}

.banxc {
    background: url(../images-pc/index-banxc.jpg) no-repeat top center;
    background-size: cover
}

.bannano {
    background: url(../images-pc/index-ban-nano.jpg) no-repeat top center;
    background-size: cover
}

.bannanonew {
    background-image: url(../images-pc/index-ban-nanonew.jpg);
    background-position: 50% 33px;
    background-size: cover;
    background-repeat: no-repeat;
}

.ban2022 {
    background: url(../images-pc/cny-cg-1.jpg) no-repeat top center;
    background-size: cover
}

.bangb {
    background: url(../images-pc/index-ban-gb.jpg) no-repeat center center;
    background-size: cover
}

.banjc {
    background: url(../images-pc/index-banjc.jpg) no-repeat top center;
    background-size: cover
}

.banst {
    background: url(../images-pc/index-banst.jpg) no-repeat top center;
    background-size: cover
}

.banhev {
    background: url(../images-pc/index-banhev.jpg) no-repeat top center;
    background-size: cover
}

.banhd {
    background: url(../images-pc/index-banhd.jpg) no-repeat top center;
    background-size: cover
}

.bancp {
    background: url(../images-pc/index-bancp.jpg) no-repeat top center;
    background-size: cover
}

.bangbnew {
    background: url(../images-pc/index-ban-gbnew.jpg) no-repeat top center;
    background-size: cover
}

.bangxcj {
    background: url(../images-pc/index-banxcj.jpg) no-repeat top center;
    background-size: cover
}
.bankaijie {
    background-image: url(../images-pc/index-ban-kaijie.jpg);
    background-position: 50% 33px;
    background-size: cover;
    background-repeat: no-repeat;
}
.banxingchi {
    height: 100%;
    background-image: url(../images-pc/index-banxingchi.jpg);
    background-position: 50% 40%;
    background-size: cover;
    overflow: hidden;
    /* position: absolute;
    left: 0;
    top: 0; */
}

.banbingo {
    background-image: url(../images-pc/index-ban-binguo.jpg);
    background-position: 50% 33px;
    background-size: cover;
    background-repeat: no-repeat;
}

.banxingyun {
    background-image: url(../images-pc/index-ban-xingyun.jpg);
    background-position: 50% 33px;
    background-size: cover;
    background-repeat: no-repeat;
}

.banxingguang {
    background-image: url(../images-pc/index-ban-xingguang.jpg);
    background-position: 50% 50%;
    background-size: cover;
    background-repeat: no-repeat;
}

.index-banner-pagination {
    width: 100%;
    bottom: 5%;
}

.swiper-indexBan>.swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
    bottom: 20px;
}

.index-banner-pagination .swiper-pagination-bullet {
    width: 37px;
    height: 3px;
    background: #a5a5a5;
    border-radius: 0;
    opacity: 1;
}

.index-banner-pagination .swiper-pagination-bullet-active {
    width: 37px;
    height: 3px;
    background: #1b80dc;
}

.hotTab {
    width: 100%;
    overflow: hidden;
    height: 110px;
    position: relative;
    margin-top: -100px;
    transform: translate3d(0, 0, 0);
}

.hotTab span.red {
    width: 33.3333333%;
    height: 100%;
    position: absolute;
    right: 0;
    top: 0;
    /* background: url(../images-pc/hot-red.png) no-repeat right center; */
    cursor: pointer;
    overflow: hidden;
    transform: translate3d(0, 0, 0);

}

.hotTab span.red.on {
    box-shadow: -3px -20px 10px #e5e5e5;
}

.hotTab span.red.act {
    box-shadow: -3px -20px 10px #e5e5e5;
}

.hotTab span.yin.on {
    box-shadow: -3px -20px 10px #e5e5e5;
}

.hotTab span.red .logo {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(.7);
    transition: all .5s;
}

.hotTab span.red .tip {
    width: 100%;
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translate(-50%, -22px);
    opacity: 0;
    visibility: hidden;
    transition: all .5s;
}

.hotTab span.red:hover .logo,
.hotTab span.red.on .logo {
    top: 44%;
}

.hotTab span.red.on .tip {
    transform: translate(-50%, 0);
    opacity: 1;
    visibility: visible;
}


.hotTab span.yin {
    width: 33.3333333%;
    height: 100%;
    position: absolute;
    left: 50%;
    top: 0;
    /* background: url(../images-pc/hot-yin.png) no-repeat left center; */
    cursor: pointer;
    overflow: hidden;
    transform: translate3d(-50%, 0, 0);
}

.hotTab span.yin .logo {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(.7);
    transition: all .5s;
}

.hotTab span.yin .tip {
    width: 100%;
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translate(-50%, -22px);
    opacity: 0;
    visibility: hidden;
    transition: all .5s;
}

.hotTab span.yin:hover .logo {
    top: 44%;
}

.hotTab span.yin.on .logo {
    top: 44%;
}

.hotTab span.yin.on .tip {
    transform: translate(-50%, 0);
    opacity: 1;
    visibility: visible;
}

.hotTab span.guang {
    width: 33.3333333%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    /* background: url(../images-pc/hot-yin.png) no-repeat left center; */
    cursor: pointer;
    overflow: hidden;
    transform: translate3d(0, 0, 0);
}

.hotTab span.guang .logo {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%) scale(.7);
    transition: all .5s;
}

.hotTab span.guang .tip {
    width: 100%;
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translate(-50%, -22px);
    opacity: 0;
    visibility: hidden;
    transition: all .5s;
}

.hotTab span.guang:hover .logo {
    top: 44%;
}

/* .hotTab span.guang.on {
    box-shadow: -3px -20px 10px #e5e5e5;
}

.hotTab span.guang.act {
    box-shadow: -3px -20px 10px #e5e5e5;
} */
.hotTab span.guang.on,
.hotTab span.guang.act {
    box-shadow: 3px -20px 10px #e5e5e5;
}

.hotTab span.guang.on .logo {
    top: 44%;
}

.hotTab span.guang.on .tip {
    transform: translate(-50%, 0);
    opacity: 1;
    visibility: visible;
}

.hotTit {
    width: 195px;
    display: block;
    margin: 0 auto;
    margin-top: 10px;
    transform: translate3d(0, 0, 0) scale(.7);
}

/* .carMain {
    width: 100%;
    margin-top: 65px;
    position: relative;
}

.carMain .redSec{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    transition: all .5s;
    transform: scale(.7);
    opacity: 0;
}

.carMain .redSec.on{
    opacity: 1;
    transform: scale(1);
    z-index: 1;
}

.carMain .yinSec{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    transition: all .5s;
    transform: scale(.7);
    opacity: 0;
}

.carMain .yinSec.on{
    opacity: 1;
    transform: scale(1);
    z-index: 1;
} */

.swiper-indexCar-red {
    width: 100%;
    overflow: visible;
    position: absolute;
    left: 0;
    /* top: 0; */
    margin-top: 3%;
    transition: all .5s;
    transform: scale(.7);
    opacity: 0;
    z-index: -1;
}

.swiper-indexCar-red.on {
    opacity: 1;
    transform: scale(1);
    z-index: 1;
}

.swiper-indexCar-red .swiper-slide {
    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;
    transition: 300ms;
    opacity: .5;
    transform: translate3d(0, 0, 0) scale(0.85);
    overflow: visible;
}

.swiper-indexCar-red .swiper-slide img {
    /* height: 100%; */
    width: 90%;
}

.swiper-indexCar-red .swiper-slide-active,
.swiper-indexCar-red .swiper-slide-duplicate-active {
    transform: scale(1);
    opacity: 1;
    cursor: pointer;
}

.swiper-indexCar-red .swiper-pagination-bullet {
    width: 50px;
    height: 35px;
    text-align: center;
    font-family: "fzzh";
    line-height: 40px;
    font-size: 12px;
    color: #dcdcdc;
    opacity: 1;
    background: url(../images-pc/bg-small.png) no-repeat right center;
    transform: translate3d(0, 0, 0);
    padding-right: 8px;
}

.swiper-indexCar-red .swiper-pagination-bullet:last-child {
    background: none
}

.swiper-indexCar-red .swiper-pagination-bullet-active {
    color: #ea0029;
}

.swiper-indexCar-red>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0;
}

.swiper-indexred-button-next {
    width: 18%;
    height: 100%;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(0, -50%);
    cursor: pointer;
    z-index: 1
}

.swiper-indexred-button-prev {
    width: 18%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(0, -50%);
    cursor: pointer;
    z-index: 1
}

.swiper-indexCar-yin {
    width: 100%;
    overflow: visible;
    position: absolute;
    left: 0;
    /* top: 0; */
    margin-top: 3%;
    transition: all .5s;
    transform: scale(.7);
    opacity: 0;
    z-index: -1;
}

.swiper-indexCar-yin.on {
    opacity: 1;
    transform: scale(1);
    z-index: 1;
}

.swiper-indexCar-yin .swiper-slide {
    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;
    transition: 300ms;
    opacity: .5;
    transform: translate3d(0, 0, 0) scale(0.85);
    overflow: visible;
}

.swiper-indexCar-yin .swiper-slide img {
    /* height: 100%; */
    width: 100%;
}

.swiper-indexCar-yin .swiper-slide-active,
.swiper-indexCar-yin .swiper-slide-duplicate-active {
    transform: scale(1);
    opacity: 1;
    cursor: pointer;
}

.swiper-indexCar-yin .swiper-pagination-bullet {
    width: 50px;
    height: 35px;
    text-align: center;
    font-family: "fzzh";
    line-height: 40px;
    font-size: 12px;
    color: #dcdcdc;
    opacity: 1;
    background: url(../images-pc/bg-small.png) no-repeat right center;
    transform: translate3d(0, 0, 0);
    padding-right: 8px;
}

.swiper-indexCar-yin .swiper-pagination-bullet:last-child {
    background: none
}

.swiper-indexCar-yin .swiper-pagination-bullet-active {
    color: #384967;
}

.swiper-indexCar-yin>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0;
}

.swiper-indexyin-button-next {
    width: 18%;
    height: 100%;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(0, -50%);
    cursor: pointer;
    z-index: 1
}

.swiper-indexyin-button-prev {
    width: 18%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(0, -50%);
    cursor: pointer;
    z-index: 1
}

.swiper-indexCar-guang {
    width: 100%;
    overflow: visible;
    position: absolute;
    left: 0;
    /* top: 0; */
    margin-top: 3%;
    transition: all .5s;
    transform: scale(.7);
    opacity: 0;
    z-index: -1;
}

.swiper-indexCar-guang.on {
    opacity: 1;
    transform: scale(1);
    z-index: 1;
}

.swiper-indexCar-guang .swiper-slide {
    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;
    transition: 300ms;
    opacity: .5;
    transform: translate3d(0, 0, 0) scale(0.85);
    overflow: visible;
}

.swiper-indexCar-guang .swiper-slide img {
    /* height: 100%; */
    width: 100%;
}

.swiper-indexCar-guang .swiper-slide-active,
.swiper-indexCar-guang .swiper-slide-duplicate-active {
    transform: scale(1);
    opacity: 1;
    cursor: pointer;
}

.swiper-indexCar-guang .swiper-pagination-bullet {
    width: 50px;
    height: 35px;
    text-align: center;
    font-family: "fzzh";
    line-height: 40px;
    font-size: 12px;
    color: #dcdcdc;
    opacity: 1;
    background: url(../images-pc/bg-small.png) no-repeat right center;
    transform: translate3d(0, 0, 0);
    padding-right: 8px;
}

.swiper-indexCar-guang .swiper-pagination-bullet:last-child {
    background: none
}

.swiper-indexCar-guang .swiper-pagination-bullet-active {
    color: #a4b4c7;
}

.swiper-indexCar-guang>.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0;
}

.swiper-indexguang-button-next {
    width: 18%;
    height: 100%;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(0, -50%);
    cursor: pointer;
    z-index: 1
}

.swiper-indexguang-button-prev {
    width: 18%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(0, -50%);
    cursor: pointer;
    z-index: 1
}

.indexViewAll {
    width: 345px;
    display: block;
    transition: all .5s;
    position: absolute;
    left: 120%;
    top: 50%;
    z-index: 2;
    transform: translate3d(0, -50%, 0) scale(.7);
}

.indexViewAll img {
    width: 95%;
    transform: translate3d(0, 0, 0);
}

.indexViewAll .hover {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.indexViewAll:hover .hover {
    opacity: 1;
}

.indexCarInfo {
    width: 468px;
    height: 58px;
    position: relative;
    margin: 0 auto;
    /* position: absolute;
    left: 50%;
    bottom: -27%;
    transform: translate(-50%,0); */
}

.indexCarInfo .pri {
    font-family: "fzzzh";
    font-size: 16px;
    position: absolute;
    left: 0;
    top: 0;
    color: #333;
    transform: translate3d(0, 0, 0);
}

.indexCarInfo .pri i {
    font-size: 23px;
}

.indexCarInfo .inf {
    font-family: "fzzh";
    font-size: 16px;
    color: #333;
    position: absolute;
    left: 0;
    bottom: 0;
    transform: translate3d(0, 0, 0);
}

.indexCarInfo .viewMore {
    width: 153px;
    position: absolute;
    right: -22px;
    top: 50%;
    transform: translate3d(0, -50%, 0) scale(.7);
}

.indexCarInfoYin {
    width: 500px;
    height: 58px;
    position: relative;
    margin: 0 auto;
    margin-top: 20px;
    display: none;
}

.indexCarInfoYin .name {
    width: 100%;
    font-family: "fzzzh";
    font-size: 16px;
    position: absolute;
    left: 0;
    top: 0;
    color: #333;
    text-align: center;
    transform: translate3d(0, 0, 0);
}

.indexCarInfoYin .inf {
    width: 100%;
    font-family: "fzzh";
    font-size: 18px;
    color: #333;
    position: absolute;
    left: 0;
    bottom: 0;
    text-align: center;
    transform: translate3d(0, 0, 0);
}



.indexStory {
    background: url(../images-pc/index-story.jpg) no-repeat center center;
    background-size: cover;
    background-position-y: 65px;
    transform: translate3d(0, 0, 0);
}

.titStory {
    /* width: 13%; */
    height: 13%;
    position: absolute;
    left: 50%;
    top: 23%;
    transform: translate3d(-50%, 0, 0);
    display: block;
    transition: all .5s;
}

.titStory img {
    height: 100%;
}

.titStory .hover {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.titStory:hover .hover {
    opacity: 1;
}

/* .titStory {
    width: 200px;
    position: absolute;
    left: 50%;
    top: 210px;
    transform: translate3d(-50%, 0,0) scale(.7);
}

.indexStoryBtn {
    width: 265px;
    position: absolute;
    left: 50%;
    top: 290px;
    transform: translate3d(-50%, 0,0) scale(.7);
    display: block;
    transition: all .5s;
}

.indexStoryBtn img{
    width: 100%;
}

.indexStoryBtn .hover{
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.indexStoryBtn:hover .hover {
    opacity: 1;
} */

footer {
    width: 100%;
    height: 9%;
    background: #fff;
    transform: translate3d(0, 0, 0);
    text-align: center;
}

footer p {
    font-family: "fzzh";
    font-size: 14px;
    color: #333;
    margin: 8px 40px;
    display: inline-block;
}

footer p a {
    color: #333;
}

footer p a.lk {
    border-bottom: 1px solid #333;
}

.law {
    cursor: pointer;
}

.swiper-indexBom {
    width: 100%;
    height: 81%;
    background: #f3f3f3;
    margin-top: 12px;
}

.swiper-indexBom .swiper-slide {
    transform: translate3d(0, 0, 0);
}

.swiper-indexBom .swiper-slide .bg {
    height: 85%;
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translate(-50%, 0);
}

.swiper-indexBom .swiper-slide .bg .bgimg {
    /* display: block; */
    height: 100%;
}

.gz {
    width: 25%;
    position: absolute;
    left: -17px;
    top: 15%;
    /* transform: scale(.9); */
    display: block;
    overflow: hidden;
    z-index: 1;
}

.gz .staic {
    width: 100%;
}

.gz .hover {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.gz:hover .hover {
    opacity: 1;
}

.button-indexBom-prev {
    width: 35px;
    position: absolute;
    left: 10%;
    top: 50%;
    z-index: 2;
    cursor: pointer;
    transform: translate3d(0, -50%, 0);
}

.button-indexBom-next {
    width: 35px;
    position: absolute;
    right: 10%;
    top: 50%;
    z-index: 2;
    cursor: pointer;
    transform: translate3d(0, -50%, 0);
}

.index-bom-pagination {
    width: 100%;
    height: 15px;
    bottom: 0;
    transform: translate3d(0, 0, 0);
}

.index-bom-pagination .swiper-pagination-bullet {
    width: 25%;
    height: 3px;
    background: #a5a5a5;
    border-radius: 0;
    opacity: 1;
    margin: 0;
}

.index-bom-pagination .swiper-pagination-bullet-active {
    width: 25%;
    height: 3px;
    background: #1b80dc;
}

.swiper-container-horizontal>.index-bom-pagination.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0;
}

.index-bom-pagination span:nth-child(1) {
    position: absolute;
    left: 0;
    bottom: 0;
}

.index-bom-pagination span:nth-child(2) {
    position: absolute;
    left: 25%;
    bottom: 0;
}

.index-bom-pagination span:nth-child(3) {
    position: absolute;
    left: 50%;
    bottom: 0;
}

.index-bom-pagination span:nth-child(4) {
    position: absolute;
    right: 0;
    bottom: 0;
}

@media screen and (max-width: 1450px) {
    .swiper-indexCar-red .swiper-slide img {
        width: 100%;
        /* width: 90%;
        height: auto; */
    }

    .swiper-indexCar-yin .swiper-slide img {
        /* width: 95%; */
        /* height: auto; */
        width: 100%;
    }

    .swiper-indexCar-guang .swiper-slide img {
        /* width: 95%; */
        /* height: auto; */
        width: 100%;
    }

    .button-indexBom-next {
        right: 10%;
    }

    .button-indexBom-prev {
        left: 10%;
    }
}

@media screen and (max-height: 750px) {

    .swiper-indexBan>.swiper-pagination-bullets,
    .swiper-pagination-custom,
    .swiper-pagination-fraction {
        bottom: 8px;
    }

    .hotTab {
        height: 75px;
    }

    .hotTit {
        transform: translate3d(0, 0, 0) scale(.6)
    }

    .swiper-indexCar-red .swiper-slide img {
        width: 85%;
    }

    .swiper-indexCar-yin .swiper-slide img {
        width: 90%;
    }

    .swiper-indexCar-guang .swiper-slide img {
        width: 90%;
    }
}

/* 按高度区间适配 */

/* @media screen and (max-width: 1366px) {
    .swiper-indexBan>.swiper-pagination-bullets, .swiper-pagination-custom, .swiper-pagination-fraction{
        bottom: 8px;
    }

    .hotTab{
        height: 75px;
    }
    .hotTit{
        transform: translate3d(0,0,0) scale(.6)
    }

    .swiper-indexCar-red .swiper-slide img{
        width: 85%;
    }

    .swiper-indexCar-yin .swiper-slide img{
        width: 90%;
    }
} */


@media screen and (max-width: 1260px) {
    header .logo {
        left: 40px;
    }

    header .headerNav {
        left: 328px;
    }

    header .btnY {
        right: 40px;
    }

    header .btnK {
        right: 255px;
    }

    .indexViewAll {
        transform: scale(.6);
    }
}

@media screen and (max-width: 1024px) {
    .indexViewAll {
        transform: scale(.5);
    }

}

.tkBox {
    width: 100%;
    height: 100%;
    background: rgba(0, 0, 0, .7);
    position: fixed;
    left: 0;
    top: 0;
    z-index: 999;
    display: none;
}

.tkBox .tk {
    width: 60%;
    height: 80%;
    position: absolute;
    left: 50%;
    top: 40px;
    transform: translate(-50%, 0);
    background: #fff;
    border-radius: 12px;
    overflow-y: auto;
    overflow-x: hidden;
}

.tkBox .tk .imgtk {
    width: 88%;
    display: block;
    margin: 0 auto;
    padding: 50px 0;
    position: relative;
    z-index: 1;
}

.tkBox .close {
    width: 49px;
    position: absolute;
    left: 50%;
    bottom: 40px;
    transform: translate(-50%, 0);
    cursor: pointer;
}

@media screen and (min-width: 1921px) {
    header .logo {
        width: 150px;
    }

    header .link {
        font-size: 22px;
    }

    .btnK {
        transform: translate(0, -50%) scale(1);
        right: 300px;
    }

    .btnY {
        transform: translate(0, -50%) scale(1);
        right: 70px;
    }

    footer p {
        font-size: 22px;
    }

    .swiper-indexCar-red {
        margin-top: 4%;
    }

    .swiper-indexCar-red .swiper-pagination-bullet {
        font-size: 24px;
    }


    .indexCarInfo {
        width: 605px;
        height: 80px;
    }

    .indexCarInfo .pri {
        font-size: 24px;
    }

    .indexCarInfo .pri i {
        font-size: 30px;
    }

    .indexCarInfo .inf {
        font-size: 24px;
    }

    .indexCarInfo .viewMore {
        transform: translate3d(0, -50%, 0) scale(1);
        right: -100px;
    }

    .indexViewAll {
        transform: translate3d(0, -50%, 0) scale(1);
        /* right: 50px; */
        left: 150%;
    }

    .indexCarInfoYin {
        height: 68px;
    }

    .indexCarInfoYin .name {
        font-size: 24px;
    }

    .indexCarInfoYin .inf {
        font-size: 24px;
    }
}

/* 购车指南 */
.guideMain {
    width: 100%;
}

.guideMain .sec {
    width: 33.3333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333333%;
    height: 100%;
    float: left;
    position: relative;
    overflow: hidden;
    display: block;
}

.guideMain .sec .gimg {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
    transform: scale(1);
    /* transition: all .5s; */
    transition: cubic-bezier(0.23, 1, 0.320, 1) 1s;
}

.guideMain .sec .tip {
    height: 2.5%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 2;
}

.guideMain .sec .mask {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 3;
    background: rgba(0, 0, 0, .25);
    transition: all .5s;
    opacity: 1;
}

.guideMain .sec:hover .gimg {
    transform: scale(1.1);
}

.guideMain .sec:hover .mask {
    opacity: 0;
}

/* 车型 */
.carstyle {
    width: 100%;
    height: 80%;
    background: #f3f3f3;
    position: relative;
}

.tab {
    width: 100%;
    height: 91%;
    transition: all .5s;
}

.tab .redBar {
    width: 15%;
    height: 100%;
    float: left;
    position: relative;
    transition: all .5s;
    cursor: pointer;
    overflow: hidden;
}

.tab .redBar .logo {
    width: 50%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 3;
}

.tab .redBar .logoBom {
    width: 100%;
    position: absolute;
    left: 0;
    top: 55%;
    transform: translate(0, -50%);
    z-index: 2;
    display: none;
}

.tab .redBar .bg {
    width: 100%;
    height: 100%;
    position: absolute;
    left: -100%;
    top: 0;
    z-index: 1;
    background: #fff;
    transition: all .5s;
}

.tab .redBar.on .bg,
.tab .redBar:hover .bg {
    left: 0;
}

.tab .redBar:hover .logoBom {
    display: block;
}

.tab .yinBar {
    width: 15%;
    height: 100%;
    float: left;
    position: relative;
    transition: all .5s;
    cursor: pointer;
    overflow: hidden;
}

.tab .yinBar .logo {
    width: 50%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 3;
}

.tab .yinBar .logoBom {
    width: 100%;
    position: absolute;
    left: 0;
    top: 55%;
    transform: translate(0, -50%);
    z-index: 2;
    display: none;
}

.tab .yinBar .bg {
    width: 100%;
    height: 100%;
    position: absolute;
    right: -100%;
    top: 0;
    z-index: 1;
    background: #fff;
    transition: all .5s;
}

.tab .yinBar.on .bg,
.tab .yinBar:hover .bg {
    right: 0;
}

.tab .yinBar:hover .logoBom {
    display: block;
}

.tab .guangBar {
    width: 15%;
    height: 100%;
    float: left;
    margin-left: 15%;
    position: relative;
    transition: all .5s;
    cursor: pointer;
    overflow: hidden;
}

.tab .guangBar .logo {
    width: 50%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 3;
}

.tab .guangBar .logoBom {
    width: 100%;
    position: absolute;
    left: 0;
    top: 55%;
    transform: translate(0, -50%);
    z-index: 2;
    display: none;
}

.tab .guangBar .bg {
    width: 100%;
    height: 100%;
    position: absolute;
    right: -100%;
    top: 0;
    z-index: 1;
    background: #fff;
    transition: all .5s;
}

.tab .guangBar.on .bg,
.tab .guangBar:hover .bg {
    right: 0;
}

.tab .guangBar:hover .logoBom {
    display: block;
}

.swiper-carstyle-red {
    width: 100%;
    overflow: visible;
    position: absolute;
    left: 0;
    /* top: 50%; */
    top: 18%;
    transition: all .5s;
    transform: scale(.7);
    opacity: 0;
    z-index: -1;
}

.swiper-carstyle-red.on {
    opacity: 1;
    transform: scale(1);
    z-index: 1;
}

.swiper-carstyle-red .swiper-slide {
    transition: 300ms;
    /* opacity: .5; */
    transform: translate3d(0, 0, 0) scale(1);
    overflow: visible;
    cursor: pointer;
}

.swiper-carstyle-red .swiper-slide .carImg {
    /* height: 100%; */
    width: 85%;
    display: block;
    margin: 0 auto;
}

.swiper-carstyle-red .swiper-slide-active,
.swiper-carstyle-red .swiper-slide-duplicate-active {
    transform: scale(1);
    opacity: 1;
}

.swiper-carstyle-red>.swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
    bottom: -10%;
}

.carstyle-red-pagination .swiper-pagination-bullet {
    width: 37px;
    height: 3px;
    background: #a5a5a5;
    border-radius: 0;
    opacity: 1;
}

.carstyle-red-pagination .swiper-pagination-bullet-active {
    width: 37px;
    height: 3px;
    background: #1b80dc;
}

.swiper-carstyle-red-button-next {
    width: 18%;
    height: 100%;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(0, -50%);
    cursor: pointer;
    z-index: 1
}

.swiper-carstyle-red-button-prev {
    width: 18%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(0, -50%);
    cursor: pointer;
    z-index: 1
}

.swiper-carstyle-red .swiper-slide .info {
    width: 100%;
    /* position: absolute;
    left: 0;
    bottom: -32%; */
    display: block;
    position: relative;
    overflow: hidden;
}

.swiper-carstyle-red .swiper-slide .info img {
    width: 85%;
    display: block;
    margin: 0 auto;
    transform: translate(-200%, 0);
    opacity: 0;
    transition: all .8s;
}

.swiper-carstyle-red .swiper-slide.swiper-slide-active .info img {
    transform: translate(0, 0);
    opacity: 1;
}

.swiper-carstyle-red .swiper-slide .price {
    width: 42%;
    position: absolute;
    top: -80px;
    right: 8%;
    transform: translate(-300px, 0);
    opacity: 0;
    transition: all .8s;
    z-index: -1;
}

.swiper-carstyle-red .swiper-slide.swiper-slide-active .price {
    transform: translate(0, 0);
    opacity: 1;
}


.carstyleView {
    width: 16%;
    display: block;
    transition: all .5s;
    position: absolute;
    left: 50%;
    bottom: -28%;
    z-index: 2;
    transform: translate(-50%, 0);
}

.carstyleView img {
    width: 100%;
}

.carstyleView .hover {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.carstyleView:hover .hover {
    opacity: 1;
}

.swiper-carstyle-yin {
    width: 100%;
    overflow: visible;
    position: absolute;
    left: 0;
    /* top: 50%; */
    top: 18%;
    transition: all .5s;
    transform: scale(.7);
    opacity: 0;
    z-index: -1;
}

.swiper-carstyle-yin.on {
    opacity: 1;
    transform: scale(1);
    z-index: 1;
}

.swiper-carstyle-yin .swiper-slide {
    transition: 300ms;
    /* opacity: .5; */
    transform: translate3d(0, 0, 0) scale(1);
    overflow: visible;
    cursor: pointer;
}

.swiper-carstyle-yin .swiper-slide .carImg {
    /* height: 100%; */
    width: 85%;
    display: block;
    margin: 0 auto;
}

.swiper-carstyle-yin .swiper-slide-active,
.swiper-carstyle-yin .swiper-slide-duplicate-active {
    transform: scale(1);
    opacity: 1;
}

.swiper-carstyle-yin>.swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
    bottom: -10%;
}

.carstyle-yin-pagination .swiper-pagination-bullet {
    width: 37px;
    height: 3px;
    background: #a5a5a5;
    border-radius: 0;
    opacity: 1;
}

.carstyle-yin-pagination .swiper-pagination-bullet-active {
    width: 37px;
    height: 3px;
    background: #1b80dc;
}

.swiper-carstyle-yin-button-next {
    width: 18%;
    height: 100%;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(0, -50%);
    cursor: pointer;
    z-index: 1
}

.swiper-carstyle-yin-button-prev {
    width: 18%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(0, -50%);
    cursor: pointer;
    z-index: 1
}

.swiper-carstyle-yin .swiper-slide .info {
    width: 100%;
    /* position: absolute;
    left: 0;
    bottom: -32%; */
    display: block;
    position: relative;
    overflow: hidden;
}

.swiper-carstyle-yin .swiper-slide .info img {
    width: 85%;
    display: block;
    margin: 0 auto;
    transform: translate(-200%, 0);
    opacity: 0;
    transition: all .8s;
}

.swiper-carstyle-yin .swiper-slide.swiper-slide-active .info img {
    transform: translate(0, 0);
    opacity: 1;
}

.swiper-carstyle-yin .swiper-slide .price {
    width: 42%;
    position: absolute;
    top: -80px;
    right: 8%;
    transform: translate(-300px, 0);
    opacity: 0;
    transition: all .8s;
    z-index: -1;
}

.swiper-carstyle-yin .swiper-slide.swiper-slide-active .price {
    transform: translate(0, 0);
    opacity: 1;
}

.swiper-carstyle-guang {
    width: 100%;
    overflow: visible;
    position: absolute;
    left: 0;
    /* top: 50%; */
    top: 18%;
    transition: all .5s;
    transform: scale(.7);
    opacity: 0;
    z-index: -1;
}

.swiper-carstyle-guang.on {
    opacity: 1;
    transform: scale(1);
    z-index: 1;
}

.swiper-carstyle-guang .swiper-slide {
    transition: 300ms;
    /* opacity: .5; */
    transform: translate3d(0, 0, 0) scale(1);
    overflow: visible;
    cursor: pointer;
}

.swiper-carstyle-guang .swiper-slide .carImg {
    /* height: 100%; */
    width: 85%;
    display: block;
    margin: 0 auto;
}

.swiper-carstyle-guang .swiper-slide-active,
.swiper-carstyle-guang .swiper-slide-duplicate-active {
    transform: scale(.85);
    opacity: 1;
}

.swiper-carstyle-guang>.swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
    bottom: -10%;
}

.carstyle-guang-pagination .swiper-pagination-bullet {
    width: 37px;
    height: 3px;
    background: #a5a5a5;
    border-radius: 0;
    opacity: 1;
}

.carstyle-guang-pagination .swiper-pagination-bullet-active {
    width: 37px;
    height: 3px;
    background: #1b80dc;
}

.swiper-carstyle-guang-button-next {
    width: 18%;
    height: 100%;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(0, -50%);
    cursor: pointer;
    z-index: 1
}

.swiper-carstyle-guang-button-prev {
    width: 18%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(0, -50%);
    cursor: pointer;
    z-index: 1
}

.swiper-carstyle-guang .swiper-slide .info {
    width: 100%;
    /* position: absolute;
    left: 0;
    bottom: -32%; */
    display: block;
    position: relative;
    overflow: hidden;
}

.swiper-carstyle-guang .swiper-slide .info img {
    width: 85%;
    display: block;
    margin: 0 auto;
    transform: translate(-200%, 0);
    opacity: 0;
    transition: all .8s;
}

.swiper-carstyle-guang .swiper-slide.swiper-slide-active .info img {
    transform: translate(0, 0);
    opacity: 1;
}

.swiper-carstyle-guang .swiper-slide .price {
    width: 42%;
    position: absolute;
    top: -28%;
    right: 8%;
    transform: translate(-300px, 0);
    opacity: 0;
    transition: all .8s;
    z-index: -1;
}

.swiper-carstyle-guang .swiper-slide.swiper-slide-active .price {
    transform: translate(0, 0);
    opacity: 1;
}


/* 预约试驾 */
.resMain {
    width: 100%;
    /* height: 960px; */
    background: url(../images-pc/bg-shijia.jpg) no-repeat center center;
    background-size: cover;
    position: relative;
    /* margin-top: 9%; */
}

.resMain .infoBox {
    width: 658px;
    height: 700px;
    background: rgba(255, 255, 255, .6);
    position: absolute;
    left: 10%;
    top: 50%;
    transform: translate(0, -50%);
}

.resMain .infoBox .tit {
    width: 20%;
    margin: 0 auto;
    margin-top: 45px;
    display: block;
}

.resMain .infoBox .drop_select {
    width: 542px;
    height: 60px;
    border-radius: 60px;
    /* overflow: hidden; */
    background: #fff;
    margin: 0 auto;
    margin-top: 20px;
    position: relative;
}

.resMain .infoBox .drop_select select,
.resMain .infoBox .drop_select .selectUl {
    /* width: 450px; */
    width: 100%;
    height: 60px;
    appearance: none;
    border: none;
    outline: none;
    line-height: 60px;
    font-family: "fzzh";
    font-size: 20px;
    color: #333;
    padding-left: 36px;
    cursor: pointer;
    position: relative;
    z-index: 2;
    background: url(../images-pc/arr-down.png) no-repeat 414px center;
    background-size: 25px;
    z-index: 9;
}

.slVal {
    width: 100%;
    height: 50px;
    line-height: 56px;
    display: block;
}

.slVal img {
    height: 20px;
    margin-top: 16px;
    margin-left: 10px;
}

.selectUl ul {
    /* width: 346px; */
    width: 470px;
    height: 200px;
    background: #fff;
    position: absolute;
    left: 0;
    top: 100%;
    z-index: 9;
    overflow-y: scroll;
    display: none;
}

.selectUl ul li {
    width: 100%;
    height: 25px;
    line-height: 25px;
    padding-left: 35px;
}

.selectUl ul li.on,
.selectUl ul li:hover {
    background: #1e90ff;
    color: #fff;
}

.selectUl ul li img {
    height: 16px;
    margin-top: 3px;
    margin-left: 10px;
}

.resMain .infoBox .drop_select .arr {
    width: 25px;
    position: absolute;
    right: 30px;
    top: 50%;
    transform: translate(0, -50%);
    z-index: 1;
}

.resMain .infoBox .cw {
    width: 542px;
    margin: 0 auto;
    margin-top: 35px;
    font-family: "fzzh";
    font-size: 20px;
    color: #333;
}

.resMain .infoBox .cw i {
    margin-left: 35px;
}

.resMain .infoBox .cw .cwlab {
    float: right;
    line-height: 28px;
    margin-right: 36px;
}

.resMain .infoBox .cw .cwlab span {
    display: block;
    float: left;
}

.resMain .infoBox .cw .cwlab .check {
    width: 25px;
    cursor: pointer;
    float: left;
    margin-right: 20px;
    position: relative;
}

.resMain .infoBox .cw .cwlab .check img {
    width: 100%;
}

.resMain .infoBox .cw .cwlab .check .hover {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.resMain .infoBox .cw .cwlab .check:hover .hover,
.resMain .infoBox .cw .cwlab .check.on .hover {
    opacity: 1;
}

.resMain .infoBox .nameAndTel {
    width: 542px;
    height: 60px;
    margin: 0 auto;
    margin-top: 35px;
    position: relative;
}

.resMain .infoBox .nameAndTel .name {
    width: 245px;
    float: left;
    position: relative;
}

.resMain .infoBox .nameAndTel .tel {
    width: 245px;
    float: right;
    position: relative;
}

.resMain .infoBox .nameAndTel input {
    width: 210px;
    height: 60px;
    background: #fff;
    border-radius: 60px;
    font-family: "fzzh";
    font-size: 20px;
    color: #333;
    padding-left: 35px;
    float: left;
}

.resMain .infoBox .provAndCity {
    width: 542px;
    height: 60px;
    margin: 0 auto;
    margin-top: 35px;
}

.resMain .infoBox .provAndCity .prov {
    width: 245px;
    float: left;
    position: relative;
    background: #fff;
    border-radius: 60px;
}

.resMain .infoBox .provAndCity .city {
    width: 245px;
    float: right;
    position: relative;
    background: #fff;
    border-radius: 60px;
}

.resMain .infoBox .provAndCity select {
    width: 100%;
    height: 60px;
    font-family: "fzzh";
    font-size: 20px;
    color: #333;
    padding-left: 35px;
    appearance: none;
    border: none;
    outline: none;
    cursor: pointer;
    position: relative;
    z-index: 2;
    background: url(../images-pc/arr-down.png) no-repeat 160px center;
    background-size: 25px;
    padding-right: 67px;

}

.resMain .infoBox .provAndCity .arr {
    width: 25px;
    position: absolute;
    right: 30px;
    top: 50%;
    transform: translate(0, -50%);
    z-index: 1;
}

.resMain .infoBox .submit {
    width: 40%;
    margin: 0 auto;
    position: relative;
    cursor: pointer;
    margin-top: 70px;
}

.resMain .infoBox .submit img {
    width: 100%;
}

.resMain .infoBox .submit .hover {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.resMain .infoBox .submit:hover .hover {
    opacity: 1;
}

.resMain .infoBox .bom {
    width: 40%;
    margin: 0 auto;
    text-align: center;
    margin-top: 60px;
    overflow: hidden;
}

.resMain .infoBox .bom .check {
    width: 23px;
    cursor: pointer;
    /* margin-right: 20px; */
    position: relative;
    float: left;
}

.resMain .infoBox .bom .check img {
    width: 100%;
}

.resMain .infoBox .bom .check .hover {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.resMain .infoBox .bom .check:hover .hover,
.resMain .infoBox .bom .check.on .hover {
    opacity: 1;
}

.resMain .infoBox .bom p {
    font-family: "fzzh";
    font-size: 15px;
    color: #333;
    float: right;
    line-height: 27px;
    cursor: pointer;
}

.resMain .infoBox .bom p span {
    font-family: "fzzzh";
}

.resMain .infoBox .err {
    height: 26px;
    font-family: "fzzh";
    font-size: 16px;
    color: #fc2020;
    background: url(../images-pc/icon-err.png) no-repeat left center;
    background-size: 15px 15px;
    padding-left: 28px;
    line-height: 29px;
    position: absolute;
    left: 18px;
    bottom: -26px;
    display: none;
}

.drop_select.alert .err {
    display: block;
}

.nameAndTel .name.alert .err {
    display: block;
}

.nameAndTel .tel.alert .err {
    display: block;
}

.provAndCity .prov.alert .err {
    display: block;
}

.provAndCity .city.alert .err {
    display: block;
}

.tipBox {
    width: 18%;
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    z-index: 999;
}

.tipBox img {
    width: 100%;
}

.resTip {
    /* width: 35%; */
    width: 256px;
    height: 85px;
    background: #a7a7a7;
    font-family: "fzzh";
    font-size: 15px;
    color: #fff;
    text-align: center;
    line-height: 85px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: 10px;
    z-index: 999;
}

@media screen and (max-width: 1921px) {
    .resMain .infoBox {
        width: 565px;
        height: 90%;
    }

    .resMain .infoBox .drop_select {
        width: 470px;
    }

    .resMain .infoBox .cw {
        width: 470px;
    }

    .resMain .infoBox .nameAndTel {
        width: 470px;
    }

    .resMain .infoBox .nameAndTel .name,
    .resMain .infoBox .nameAndTel .tel {
        width: 180px;
    }

    .resMain .infoBox .nameAndTel input {
        width: 100%;
    }

    .resMain .infoBox .provAndCity {
        width: 470px;
    }

    .resMain .infoBox .provAndCity .prov,
    .resMain .infoBox .provAndCity .city {
        width: 215px;
    }

    .resMain .infoBox .provAndCity input {
        width: 100%;
    }

    .resMain .infoBox .submit {
        margin-top: 58px;
    }

    .resMain .infoBox .bom {
        width: 47%;
        margin-top: 38px;
    }
}

.loanMain {
    width: 100%;
}

.loanMain .loanTabImg {
    width: 30%;
    display: block;
    margin: 0 auto;
    padding-top: 66px;
}

.loanMain .loantip1 {
    width: 8%;
    display: block;
    margin: 0 auto;
    padding-top: 66px;
}

.loanMain .loantip2 {
    width: 1650px;
    display: block;
    margin: 0 auto;
    padding-top: 50px;
}

.loanMain .loantip3 {
    width: 8%;
    display: block;
    margin: 0 auto;
    padding-top: 90px;
}

.loanMain .loanForm {
    width: 1650px;
    margin: 0 auto;
    margin-top: 90px;
    /* overflow: hidden; */
}

.loanMain .loanForm .leftSec {
    width: 1070px;
    float: left;
}

.loanMain .loanForm .leftSec .selectBox {
    width: 505px;
    background: #fff;
    border-radius: 60px;
    position: relative;
    float: left;
    margin-bottom: 80px;
}

.loanMain .loanForm .leftSec .selectBox:nth-child(2n) {
    float: right;
}

.loanMain .loanForm .leftSec .selectBox span {
    font-family: "fzzh";
    font-size: 20px;
    color: #333;
    position: absolute;
    left: 38px;
    top: -30px;
}

.loanMain .loanForm .leftSec .selectBox select {
    width: 450px;
    height: 60px;
    appearance: none;
    border: none;
    outline: none;
    line-height: 60px;
    font-family: "fzzh";
    font-size: 20px;
    color: #333;
    padding-left: 36px;
    cursor: pointer;
}

.loanMain .loanForm .leftSec .selectBox select option {
    padding-left: 30px;
}

.loanMain .loanForm .leftSec .selectBox .arr {
    width: 25px;
    position: absolute;
    right: 30px;
    top: 50%;
    transform: translate(0, -50%);
}

.loanMain .loanForm .rightSec {
    width: 490px;
    height: 484px;
    float: right;
    background: #fff;
    position: relative;
    /* display: flex;
    justify-content: center;
    align-items: center; */
}

.rightSec .carInfo {
    width: 80%;
    margin: 0 auto;

    font-size: 20px;
    color: #292e33;
    overflow: hidden;
    margin-bottom: 25px;
}

.rightSec .carInfo .tit {
    font-family: "fzzh";
    display: block;
    float: left;
}

.rightSec .carInfo .val {
    font-family: "fzzh";
    display: block;
    float: right;
}

.rightSec img {
    width: 80%;
    position: absolute;
    left: 50%;
    bottom: 45px;
    transform: translate(-50%, 0);
}

.rightSec .carInfo:nth-child(1) {
    padding-top: 65px;
}

.loanMain .loan_application {
    width: 15%;
    margin: 0 auto;
    position: relative;
    cursor: pointer;
    margin-bottom: 80px;
}

.loanMain .loan_application img {
    width: 100%;
}

.loanMain .loan_application .hover {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.loanMain .loan_application:hover .hover {
    opacity: 1;
}

.appliMain {
    width: 1614px;
    margin: 0 auto;
    margin-top: 80px;
    overflow: hidden;
}

.appliMain .cw {
    width: 506px;
    height: 60px;
    font-family: "fzzh";
    font-size: 20px;
    color: #333;
    float: left;
    line-height: 60px;
}

.appliMain.appliMain .cw i {
    margin-left: 60px;
}

.appliMain .cw .cwlab {
    float: right;
    line-height: 28px;
    margin-right: 60px;
    margin-top: 18px;
}

.appliMain .cw .cwlab span {
    display: block;
    float: left;
}

.appliMain.appliMain .cw .cwlab .check {
    width: 25px;
    cursor: pointer;
    float: left;
    margin-right: 20px;
    position: relative;
}

.appliMain.appliMain .cw .cwlab .check img {
    width: 100%;
}

.appliMain .cw .cwlab .check .hover {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.appliMain .cw .cwlab .check:hover .hover,
.appliMain .cw .cwlab .check.on .hover {
    opacity: 1;
}

.appliMain .inputSec {
    /* width: 506px;
    height: 60px; */
    /* background: #fff;
    border-radius: 60px; */
    position: relative;
    float: left;
    margin-left: 46px;
    margin-bottom: 70px;
}

.appliMain .inputSec input {
    width: 468px;
    height: 60px;
    background: #fff;
    border-radius: 60px;
    font-family: "fzzh";
    font-size: 20px;
    color: #333;
    padding-left: 38px;
    float: left;
}

.appliMain .inputSec .err {
    height: 26px;
    font-family: "fzzh";
    font-size: 13px;
    color: #fc2020;
    background: url(../images-pc/icon-err.png) no-repeat left center;
    background-size: 15px 15px;
    padding-left: 28px;
    line-height: 29px;
    position: absolute;
    left: 18px;
    bottom: -26px;
    display: none;
}

.appliMain .inputSec.alert .err {
    display: block;
}

.appBtns {
    width: 100%;
    margin-top: 35px;
    text-align: center;
}

.appBtns .backPrev {
    width: 15%;
    margin: 0 auto;
    position: relative;
    cursor: pointer;
    display: inline-block;
    margin-right: 64px;
}

.appBtns .backPrev img {
    width: 100%;
}

.appBtns .backPrev .hover {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.appBtns .backPrev:hover .hover {
    opacity: 1;
}

.appBtns .applyNow {
    width: 15%;
    margin: 0 auto;
    position: relative;
    cursor: pointer;
    display: inline-block;
    margin-left: 64px;
}

.appBtns .applyNow img {
    width: 100%;
}

.appBtns .applyNow .hover {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.appBtns .applyNow:hover .hover {
    opacity: 1;
}

.chapt2 .bom {
    width: 254px;
    margin: 0 auto;
    text-align: center;
    margin-top: 70px;
    margin-bottom: 80px;
    overflow: hidden;
}

.chapt2 .bom .check {
    width: 23px;
    cursor: pointer;
    position: relative;
    float: left;
}

.chapt2 .bom .check img {
    width: 100%;
}

.chapt2 .bom .check .hover {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.chapt2 .bom .check:hover .hover,
.chapt2 .bom .check.on .hover {
    opacity: 1;
}

.chapt2 .bom p {
    font-family: "fzzh";
    font-size: 15px;
    color: #333;
    float: right;
    line-height: 27px;
    cursor: pointer;
}

.chapt2 .bom p span {
    font-family: "fzzzh";
}

.loanTipErr {
    width: 330px;
    height: 108px;
    background: #a7a7a7;
    font-family: "fzzh";
    font-size: 20px;
    color: #fff;
    text-align: center;
    line-height: 108px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    border-radius: 10px;
    z-index: 999;
}

@media screen and (max-width: 1921px) {
    .loanMain .loanTabImg {
        width: 28%;
    }

    .loanMain .loantip1 {
        width: 7%;
    }

    .loanMain .loantip3 {
        width: 7%;
    }

    .loanMain .loanForm .leftSec .selectBox span {
        font-size: 16px;
    }

    .loanMain .loanForm .leftSec .selectBox select {
        font-size: 16px;
    }

    .rightSec .carInfo {
        font-size: 16px;
        margin-bottom: 32px;
    }

    .loanMain .loan_application {
        width: 15%;
    }

    .appliMain .cw {
        font-size: 16px;
    }

    .appliMain .inputSec input {
        font-size: 16px;
    }

    .appBtns .backPrev {
        width: 12%;
    }

    .appBtns .applyNow {
        width: 12%;
    }

    .resMain .infoBox .drop_select select,
    .resMain .infoBox .drop_select .selectUl {
        font-size: 16px;
    }

    .resMain .infoBox .cw {
        font-size: 16px;
    }

    .resMain .infoBox .nameAndTel input {
        font-size: 16px;
    }

    .resMain .infoBox .provAndCity select {
        font-size: 16px;
    }

    .resMain .infoBox .submit {
        width: 35%;
    }

    .resMain .infoBox .err {
        font-size: 13px;
    }
}

@media screen and (max-width: 1660px) {
    .loanMain .loantip2 {
        width: 1300px;
    }

    .loanMain .loanForm {
        width: 1400px;
    }

    .loanMain .loanForm .leftSec {
        width: 888px;
    }

    .loanMain .loanForm .rightSec {
        width: 438px;
    }

    .loanMain .loanForm .leftSec .selectBox {
        width: 430px;
    }

    .appliMain {
        width: 1288px;
    }

    .appliMain .cw {
        width: 410px;
    }

    .appliMain .inputSec input {
        width: 354px;
    }

    .resMain {
        background: url(../images-pc/bg-shijia.jpg) no-repeat 72% center;
        background-size: cover;
    }
}

/* 经销商 */
.map {
    width: 100%;
    height: 100%;
}

#allmap {
    width: 100%;
    height: 100%;
}

.infoMian {
    width: 485px;
    position: absolute;
    left: 5%;
    top: 50%;
    transform: translate(0, -50%);
}

.leftMain {
    width: 100%;
    height: 94%;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(0, -50%);
}

.locationChose {
    /* width: 560px; */
    width: 100%;
    height: 48px;
    background: #fff;
    position: absolute;
    left: 0;
    top: 0;
    border: 1px solid #bfbfbf;
    border-radius: 100px;
    z-index: 3;
}

.locationChose .cBox {
    width: 120px;
    height: 48px;
    float: left;
    position: relative;
}

.locationChose .cBox .arr {
    width: 20px;
    position: absolute;
    right: 15px;
    top: 50%;
    transform: translate(0, -50%);
}

.locationChose .cBox .line {
    width: 1px;
    height: 30px;
    background: #000;
    display: block;
    position: absolute;
    right: 0;
    top: 50%;
    transform: translate(0, -50%);
}

.locationChose .cBox select {
    position: absolute;
    left: 0;
    top: 0;
    width: 96px;
    height: 100%;
    text-align: center;
    text-align-last: center;
    padding-left: 8px;
    font-family: "fzzzh";
    font-size: 20px;
    color: #333333;
    line-height: 52px;
    appearance: none;
    border: none;
    outline: none;
    background: rgba(0, 0, 0, 0);

}

/*ie11 */

@media all and (-ms-high-contrast:none) {

    *::-ms-backdrop,
    .locationChose .cBox select {
        padding-left: 20px;
    }
}

/*ie10 */
@media screen and (-ms-high-contrast: active),
(-ms-high-contrast: none) {
    .locationChose .cBox select {
        padding-left: 20px;
    }
}

@media screen and (min-width:0\0) {
    .locationChose .cBox select {
        padding-left: 20px;
    }
}


.dealerBox {
    /* width: 560px; */
    width: 100%;
    /* height: 63%; */
    border: 1px solid #bfbfbf;
    background: #fff;
    position: absolute;
    left: 0;
    bottom: 0;
    overflow-y: scroll;
}

.dealerBox .dealerList {
    width: 408px;
    margin: 0 auto;
}

.dealerBox .dealerList li {
    width: 100%;
    border-bottom: 1px solid #333;
    position: relative;
    margin: 0 auto;
    padding-bottom: 25px;
    margin-top: 50px;
}

.dealerBox .dealerList li .distance {
    font-family: "fzzh";
    font-size: 18px;
    color: #333;
    position: absolute;
    top: 0;
    right: 15px;
}

.dealerBox .dealerList li .comName {
    width: 230px;
    font-family: "fzzzh";
    font-size: 20px;
    color: #333;
    display: block;
    margin-bottom: 12px;
    margin-left: 15px;
}

.dealerBox .dealerList li .kjIcon {
    height: 18px;
    position: absolute;
    left: 16px;
    top: -22px;
}

.dealerBox .dealerList li .otherInfo {
    font-family: "fzzh";
    font-size: 20px;
    color: #333;
    display: block;
    margin-bottom: 12px;
    margin-left: 15px;
}

.dealerBox .dealerList li .otherInfo a {
    color: #333;
}

.dealerBox .dealerList li .btn {
    width: 47%;
    margin: 0 auto;
    margin-top: 20px;
    display: block;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.dealerBox .dealerList li .btn img {
    width: 100%;
}

.dealerBox .dealerList li .btn .hover {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.dealerBox .dealerList li .btn:hover .hover {
    opacity: 1;
}

/* .dealerBox .dealerList li .btn {
    width: 266px;
    height: 60px;
    background: #fff;
    border: 1px solid #000;
    margin: 0 auto;
    border-radius: 60px;
    font-family: "fzzzh";
    font-size: 22px;
    color: #333;
    text-align: center;
    line-height: 60px;
    display: block;
    margin-top: 20px;
}

.dealerBox .dealerList li .btn:hover {
    background: #333;
    color: #fff;
}

.dealerBox .dealerList li:last-child {
    border-bottom: 0;
} */

.dealerTip {
    width: 100%;
    font-family: "fzzzh";
    font-size: 28px;
    color: #333;
    text-align: center;
    display: none;
}

@media screen and (max-width: 1921px) {
    .locationChose .cBox select {
        font-size: 16px;
    }

    .dealerBox .dealerList li .comName {
        font-size: 16px;
    }

    .dealerBox .dealerList li .otherInfo {
        font-size: 16px;
    }

    .dealerBox .dealerList li .distance {
        font-size: 16px;
    }

    .dealerBox .dealerList li .btn {
        /* width: 195px;
        height: 48px;
        font-size: 20px;
        line-height: 48px; */
    }
}

@media screen and (max-width: 1450px) {
    .infoMian {
        width: 410px;
    }

    .locationChose .cBox {
        width: 102px;
    }

    .locationChose .cBox select {
        width: 88px;
        font-size: 14px;
    }

    .locationChose .cBox .arr {
        width: 14px;
        right: 12px;
    }

    .locationChose .cBox .line {
        height: 22px;
    }

    .dealerBox .dealerList {
        width: 352px;
    }

    .dealerBox .dealerList li {
        margin-top: 30px;
    }

    .dealerBox .dealerList li .distance {
        font-size: 14px;
        right: 0;
    }

    .dealerBox .dealerList li .comName {
        width: 210px;
        font-size: 14px;
    }

    .dealerBox .dealerList li .otherInfo {
        font-size: 14px;
    }

    .dealerBox .dealerList li .btn {
        /* width: 165px;
        height: 40px;
        line-height: 44px;
        font-size: 17px; */
    }
}

/* @media screen and (max-height: 810px) {
    .locationChose {
        top: 80px;
    }

    .dealerBox {
        height: 69%;
        bottom: 70px;
    }
} */

/* 所有车型 */
.allTab {
    /* width: 1576px; */
    width: 80%;
    height: 130px;
    margin: 0 auto;
    margin-top: 30px;
    border-bottom: 1px solid #333;
    position: relative;
}

.allTab span {
    width: 33.33333333333%;
    height: 100%;
    display: block;
    position: relative;
    float: left;
    cursor: pointer;
}

.allTab span img {
    width: 25%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -35%);
    transition: all .5s;
}

.allTab .line {
    width: 33.33333333333%;
    height: 4px;
    background: #9fb0bb;
    position: absolute;
    left: 0;
    bottom: -2px;
    transition: all .5s;
}

.allTab span.on img,
.allTab span:hover img {
    transform: translate(-50%, -50%);
}

.allTab span.on .line {
    transform: translate(0, 0);
    opacity: 1;
    visibility: visible;
}

.allCarTab {
    /* width: 1576px; */
    width: 80%;
    height: 68px;
    margin: 0 auto;
    margin-top: 60px;
    border-bottom: 1px solid #cecece;
    position: relative;
    display: none;
}

.allCarTab.guang {
    display: block;
}

.allCarTab span {
    width: 230px;
    height: 68px;
    font-family: "fzzh";
    font-size: 25px;
    color: #333;
    text-align: center;
    line-height: 68px;
    transition: all .2s;
    float: left;
    position: relative;
    display: block;
    cursor: pointer;
}

.allCarTab .line {
    /* width: 230px; */
    height: 4px;
    background: #1b80dc;
    position: absolute;
    left: 0;
    bottom: -2px;
    transform: translate(0, 0);
    transition: all .3s;
}

.allCarTab span.on,
.allCarTab span:hover {
    font-size: 36px;
}

.carsList {
    width: 80%;
    margin: 0 auto;
    margin-top: 60px;
    overflow: hidden;
    display: none;
}

.carsList li {
    width: 270px;
    height: 220px;
    float: left;
    margin-right: 110px;
    cursor: pointer;
    overflow: hidden;
}

.carsList li:nth-child(3n) {
    margin-right: 0;
}

.carsList li:last-child {
    margin-right: 0;
}

.carsList li img {
    width: 100%;
    display: block;
    margin-bottom: 20px;
}

.carsList li .carName {
    width: 100%;
    font-family: "fzzzh";
    font-size: 27px;
    color: #333;
    text-align: center;
    display: block;
}

.carsList li .price {
    width: 100%;
    font-family: "fzzh";
    font-size: 21px;
    color: #333;
    text-align: center;
    display: block;
    margin-top: 10px;
}

.allcarBanBox {
    width: 100%;
}

.swiper-allcarBan {
    width: 100%;
}

.swiper-allcarBan .swiper-slide img {
    width: 100%;
    cursor: pointer;
}


.allcar-banner-pagination {
    width: 100%;
    bottom: 5%;
}

.swiper-allcarBan>.swiper-pagination-bullets,
.swiper-pagination-custom,
.swiper-pagination-fraction {
    bottom: 20px;
}

.allcar-banner-pagination .swiper-pagination-bullet {
    width: 37px;
    height: 3px;
    background: #a5a5a5;
    border-radius: 0;
    opacity: 1;
}

.allcar-banner-pagination .swiper-pagination-bullet-active {
    width: 37px;
    height: 3px;
    background: #1b80dc;
}

@media screen and (max-width: 1921px) {
    .allTab {
        height: 100px;
    }

    .allCarTab span {
        font-size: 21px;
        height: 58px;
        line-height: 58px;
    }

    .allCarTab span.on,
    .allCarTab span:hover {
        font-size: 30px;
    }

    .carsList li .carName {
        font-size: 24px;
    }

    .carsList li .price {
        font-size: 19px;
    }
}

.storyNav {
    width: 100%;
    height: 100px;
}

.storyNav span {
    font-family: "fzzh";
    font-size: 24px;
    color: #a5a5a5;
    margin-right: 50px;
    cursor: pointer;
    line-height: 100px;
}

.storyNav span.on,
.storyNav span:hover {
    font-family: "fzzzh";
    color: #333;
}

.storyNav .tit {
    font-family: "fzzzh";
    font-size: 30px;
    color: #333;
    display: block;
    float: left;
    margin-left: 72px;
}

.storyNav .tit i {
    font-family: "fzzh";
    display: inline-block;
    margin-left: 50px;
}

.chinaRedBan {
    /* width: 100%;
    height: 568px;
    background: url(../images-pc/index-story.jpg) no-repeat center center;
    background-size: cover; */
}

.chinaRedTxt {
    width: 50%;
    display: block;
    margin: 80px auto;
}

.chinaRedImg {
    width: 100%;
    margin: 0 auto;
    display: block;
}

.chinaRedBom {
    width: 750px;
    margin: 0 auto;
    /* margin-top: 60px; */
    position: relative;
}

.swiper-chinaRedBom {
    width: 310px;
    height: 390px;
}

.swiper-chinaRedBom .swiper-slide img {
    width: 100%;
}

.swiper-chinaRedBom .swiper-slide img.wx {
    width: 57%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: block;
}

.swiper-chinaRedBom .swiper-slide .imgwb {
    width: 68%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: block;
}

.swiper-chinaRedBom .swiper-slide .imgwb .hover {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.swiper-chinaRedBom .swiper-slide .imgwb:hover .hover {
    opacity: 1;
}

.swiper-chinaRedBom .swiper-slide .imgapp {
    width: 65%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    display: block;
}

.swiper-chinaRedBom .swiper-slide .imgapp .hover {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.swiper-chinaRedBom .swiper-slide .imgapp:hover .hover {
    opacity: 1;
}

.button-chinaRedBom-prev {
    width: 35px;
    position: absolute;
    left: 0;
    top: 50%;
    z-index: 2;
    cursor: pointer;
    transform: translate3d(0, -50%, 0);
}

.button-chinaRedBom-next {
    width: 35px;
    position: absolute;
    right: 0;
    top: 50%;
    z-index: 2;
    cursor: pointer;
    transform: translate3d(0, -50%, 0);
}

.chinaRedBom-pagination {
    width: 100%;
    bottom: -10px;
}

.chinaRedBom-pagination .swiper-pagination-bullet {
    width: 37px;
    height: 3px;
    background: #a5a5a5;
    border-radius: 0;
    opacity: 1;
}

.chinaRedBom-pagination .swiper-pagination-bullet-active {
    width: 37px;
    height: 3px;
    background: #1b80dc;
}

.chinaRedBan1 {
    width: 100%;
    height: 568px;
    background: url(../images-pc/china-ban.jpg) no-repeat center center;
    background-size: cover;
}

.chinaRedImg {
    width: 100%;
}

.gloYinV {
    width: 100%;
    cursor: pointer;
}

.gloYinV img {
    width: 100%;
}

.gloYinImg {
    width: 100%;
}

.newsMain {
    width: 1200px;
    margin: 0 auto;
    margin-top: 30px;
}

.newsMain ul {
    width: 100%;
}

.newsMain ul li {
    width: 100%;
    height: 269px;
    border-bottom: 1px solid #333;
    padding-bottom: 60px;
    margin-bottom: 60px;
    overflow: hidden;
    cursor: pointer;
}

.newsMain ul li img {
    width: 427px;
    height: 269px;
    display: block;
    overflow: hidden;
    float: right;
}

.newsMain ul li .info {
    width: 730px;
    float: left;
    position: relative;
}

.newsMain ul li .title {
    width: 558px;
    font-family: "fzzzh";
    font-size: 30px;
    color: #333;
    float: left;
    line-height: 42px;
}

.newsMain ul li .subTitle {
    width: 100%;
    font-family: "fzzh";
    font-size: 20px;
    color: #a5a5a5;
    float: left;
    line-height: 42px;
    margin-top: 45px;
}

.newsMain ul li .time {
    font-family: "fzzzh";
    font-size: 20px;
    color: #a5a5a5;
    position: absolute;
    top: 5px;
    right: 0;
}

.newsMain .viewMore {
    width: 14%;
    margin: 0 auto;
    margin-top: 30px;
    display: block;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.newsMain .viewMore img {
    width: 100%;
}

.newsMain .viewMore .hover {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.newsMain .viewMore:hover .hover {
    opacity: 1;
}

.newsDetail {
    width: 1200px;
    margin: 0 auto;
    overflow: hidden;
}

.newsDetail .newsBox {
    width: 818px;
    float: left;
}

.newsDetail .newsBox .title {
    font-family: "fzzzh";
    font-size: 30px;
    color: #333;
    line-height: 42px;
}

.newsDetail .newsBox .time {
    font-family: "fzzzh";
    font-size: 20px;
    color: #a5a5a5;
    margin-top: 35px;
}


.newsDetail .newsBox .infos {
    width: 100%;
    margin-top: 30px;
}

.newsDetail .newsBox .infos p {
    font-family: "fzzh";
    font-size: 20px;
    color: #333;
    margin-bottom: 20px;
    line-height: 30px;
}

.newsDetail .newsBox .infos img {
    width: 100%;
    display: block;
    margin: 0 auto;
    margin-bottom: 30px;
}

.newsDetail .rightBar {
    width: 265px;
    float: right;
    position: relative;
}

.newsDetail .rightBar .arr {
    width: 80px;
    display: block;
    margin: 0 auto;
}

.newsDetail .rightBar .listImgs {
    width: 100%;
    height: 618px;
    overflow: hidden;
    position: absolute;
    left: 0;
    top: 100px;
}

.newsDetail .rightBar .btn-prev{
    width: 100%;
    height: 60px;
    position: absolute;
    left: 0;
    top: 20px;
    cursor: pointer;
}

.newsDetail .rightBar .btn-next{
    width: 100%;
    height: 50px;
    position: absolute;
    left: 0;
    bottom: 0;
    cursor: pointer;
}

.newsDetail .rightBar .listImgs .warpp{
    width: 100%; 
    position: absolute;
    left: 0;
    top: 0;
    transition: all .5s;
}

.newsDetail .rightBar .listImgs .imgBox {
    width: 265px;
    height: 186px;
    display: block;
    margin-bottom: 30px;
    overflow: hidden;
}

.newsDetail .rightBar .listImgs .imgBox:last-child {
    margin-bottom: 0;
}

.newsDetail .rightBar .listImgs .imgBox img {
    width: 100%;
    height: 100%;
}

.newsBack {
    width: 14%;
    margin: 0 auto;
    margin-top: 30px;
    display: block;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.newsBack img {
    width: 100%;
}

.newsBack .hover {
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

.newsBack:hover .hover {
    opacity: 1;
}

.newsVideo {
    cursor: pointer;
}

.videoMain {
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    background: rgba(0, 0, 0, .8);
    z-index: 99;
    display: none;
}

.videoMain .videoBox {
    width: 60%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

.videoMain .videoBox video {
    width: 100%;
    display: block;
    /* position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%); */
}

.videoBox .close {
    width: 49px;
    /* position: absolute;
    left: 50%;
    bottom: 40px;
    transform: translate(-50%, 0); */
    display: block;
    cursor: pointer;
    margin: 0 auto;
    margin-top: 50px;
}

.brand1,
.brand2 {
    width: 100%;
}

.brandLine {
    width: 100%;
    padding: 90px 0;
    background: #f3f3f3;
}

.brandLine img {
    width: 70%;
    display: block;
    margin: 0 auto;
}

.brand3 {
    width: 100%;

}

.years {
    width: 75%;
    /* width: 1200px; */
    margin: 0 auto;
    margin-top: 90px;
    margin-bottom: 115px;
}

@media screen and (max-width: 1500px) {
    /* .years {
        width: 1300px;
    } */
}

/* @media screen and (max-width: 1400px) {
    .years {
        width: 1200px;
    }
} */

.swiper-years {
    width: 100%;
}

.swiper-years .swiper-slide img {
    /* width: 20%; */
    display: block;
    margin: 0 auto;
}


.button-years-prev {
    width: 35px;
    position: absolute;
    left: 0;
    top: 50%;
    z-index: 2;
    cursor: pointer;
    transform: translate3d(0, -50%, 0);
}

.button-years-next {
    width: 35px;
    position: absolute;
    right: 0;
    top: 50%;
    z-index: 2;
    cursor: pointer;
    transform: translate3d(0, -50%, 0);
}

.yearsLine {
    width: 100%;
    margin-top: 40px;
    overflow: hidden;
}

.yearsLine span {
    height: 85px;
    display: block;
    font-family: "fzzh";
    font-size: 18px;
    color: #a5a5a5;
    text-align: center;
    position: relative;
    float: left;
    margin-right: 4px;
    cursor: pointer;
}

.yearsLine span.a .nums {
    position: absolute;
    left: 50%;
    top: 0;
    transform: translate(-50%, 0);
}

.yearsLine span.b .nums {
    position: absolute;
    left: 50%;
    bottom: 0;
    transform: translate(-50%, 0);
}

.yearsLine span:last-child {
    margin-right: 0;
}

.yearsLine span .line {
    width: 100%;
    height: 2px;
    background: #a5a5a5;
    display: block;
    position: absolute;
    left: 0;
    top: 50%;
    transform: translate(0, -50%);
}

.yearsLine span:hover,
.yearsLine span.on {
    font-family: "fzzzh";
    font-size: 25px;
    color: #333;
}

.yearsLine span:hover .line,
.yearsLine span.on .line {
    background: #1b80dc;
}

.brandThree {
    width: 100%;
    overflow: hidden;
    position: relative;
}

.brandThree .allbg{
    width: 100%;
    display: block;
}

.brandThree .bg {
    width: 100%;
    height: 100%;
    display: block;
    transition: all .5s;
}

.brandThree .main{
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
}

.brandThree .one {
    width: 44%;
    height: 100%;
    /* height:660px; */
    overflow: hidden;
    float: left;
    position: relative;
    cursor: pointer;
}

.brandThree .one .tip {
    width: 18%;
    height: auto;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    opacity: 1;
}

.brandThree .one .hover {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    opacity: 0;
    transition: all .5s;
}

.brandThree .two {
    width: 28%;
    height: 100%;
    overflow: hidden;
    float: left;
    position: relative;
    cursor: pointer;
}

.brandThree .two .tip {
    width: 28%;
    height: auto;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    opacity: 1;
}

.brandThree .two .hover {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    opacity: 0;
    transition: all .5s;
}

.brandThree .three {
    width: 28%;
    height: 100%;
    overflow: hidden;
    float: left;
    position: relative;
    cursor: pointer;
}

.brandThree .three .tip {
    width: 28%;
    height: auto;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    opacity: 1;
}

.brandThree .three .hover {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    opacity: 0;
    transition: all .5s;
}

.brandThree .one:hover .tip,
.brandThree .two:hover .tip,
.brandThree .three:hover .tip {
    opacity: 0;
}

.brandThree .one:hover .hover,
.brandThree .two:hover .hover,
.brandThree .three:hover .hover {
    opacity: 1;
}

.brandThree .one:hover .bg,
.brandThree .two:hover .bg,
.brandThree .three:hover .bg {
    transform: scale(1.1);
}

.brandFore {
    width: 100%;
    margin-top: 80px;
    overflow: hidden;
}

.brandFore span {
    width: 50%;
    display: block;
    float: left;
    position: relative;
    overflow: hidden;
    cursor: pointer;
}

.brandFore span .bg {
    width: 100%;
    transition: all .5s;
    transform: scale(1);
}

.brandFore span .tip {
    width: 10%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    opacity: 1;
}

.brandFore span .hover {
    width: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    opacity: 0;
    transition: all .5s;
}

.brandFore span:hover .bg {
    transform: scale(1.1);
}

.brandFore span:hover .tip {
    opacity: 0;
}

.brandFore span:hover .hover {
    opacity: 1;
}

.resMain .infoBox .nameAndTel .tel .err {
    left: -16px;
}

/* 2021/2/24更新 */
.hd1 {
    position: absolute;
    /* left: -448px; */
    left: -100%;
    top: 50%;
    transform: translate(0, -50%);
    opacity: 0;
    visibility: hidden;
}

.hd1.on {
    animation: hd1 3s linear forwards;
}

@keyframes hd1 {
    0% {
        left: -100%;
        opacity: 0;
        visibility: hidden;
    }

    70% {
        left: -410px;
        opacity: 1;
        visibility: visible;
    }

    100% {
        left: -448px;
        opacity: 1;
        visibility: visible;
    }
}

.hd2 {
    position: absolute;
    left: 167px;
    top: -340px;
    opacity: 0;
    visibility: hidden;
    /* top: -285px; */
}

.hd2.on {
    animation: hd2 2s .5s linear forwards;
}

@keyframes hd2 {
    0% {
        top: -340px;
        opacity: 0;
        visibility: hidden;
    }

    100% {
        top: -285px;
        opacity: 1;
        visibility: visible;
    }
}

.hd3 {
    width: 200px;
    position: absolute;
    left: 230px;
    /* left: 404px; */
    top: -20px;
    opacity: 0;
    visibility: hidden;

}

.hd3.on {
    animation: hd3 1s .5s linear forwards;
}

@keyframes hd3 {
    0% {
        left: 230px;
        opacity: 0;
        visibility: hidden;
    }

    100% {
        left: 410px;
        opacity: 1;
        visibility: visible;
    }
}

.hd4 {
    position: absolute;
    right: 273px;
    /* bottom: -247px; */
    bottom: -350px;
    opacity: 0;
    visibility: hidden;

}

.hd4.on {
    animation: hd4 2s .5s linear forwards;
}

@keyframes hd4 {
    0% {
        bottom: -350px;
        opacity: 0;
        visibility: hidden;
    }

    100% {
        bottom: -247px;
        opacity: 1;
        visibility: visible;
    }
}

.hd5 {
    position: absolute;
    /* right: -415px; */
    right: -100%;
    top: 50%;
    transform: translate(0, -50%);
    opacity: 0;
    visibility: hidden;

}

.hd5.on {
    animation: hd5 3s .5s linear forwards
}

.indexVideoBox {
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    bottom: 0;
    z-index: 99;
    background: rgba(0, 0, 0, .98);
}

.ivb {
    width: 70%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate3d(-50%, -50%, 0);
}

#indexVideo {
    width: 100%;
    height: 100%;
    cursor: pointer;
}

.ivb .videoClose {
    width: 5%;
    position: absolute;
    top: 3%;
    right: 2%;
    cursor: pointer;
}

@keyframes hd5 {
    0% {
        right: -100%;
        opacity: 0;
        visibility: hidden;
    }

    70% {
        right: -383px;
        opacity: 1;
        visibility: visible;
    }

    100% {
        right: -415px;
        opacity: 1;
        visibility: visible;
    }
}

.cryBox {
    width: 100%;
    height: 100%;
    position: fixed;
    left: 0;
    top: 0;
    background: #fff;
    z-index: 99;
    display: none;
}

.cry {
    width: 500px;
    height: 500px;
    border-radius: 500px;
    display: block;
    position: absolute;
    bottom: -100%;
    transform: scale(.1);
    transition: all 1s;
}

.cry.cry1 {
    right: 20%;
    background: #ffd7d8;
    z-index: 1;
}

.cry.cry1.on {
    transform: scale(1);
    bottom: 10%;
}

.cry.cry1.off {
    transform: scale(0);
    bottom: 10%;
    transition: all .5s;
}

.cry.cry2 {
    right: 20%;
    background: #c3e1d2;
    z-index: 2;
}

.cry.cry2.on {
    bottom: -20%;
    transform: scale(1);
    transition-delay: .1s;
}

.cry.cry2.off {
    bottom: -20%;
    transform: scale(0);
    transition-delay: .1s;
    transition: all .5s;
}

.cry.cry3 {
    right: 28%;
    background: #ffe05a;
    z-index: 2;
}

.cry.cry3.on {
    bottom: 60%;
    transform: scale(1);
    transition-delay: .1s;
}

.cry.cry3.off {
    bottom: 60%;
    transform: scale(0);
    transition-delay: .1s;
    transition: all .5s;
}

.cry.cry4 {
    right: 1%;
    background: #c3e1d2;
    z-index: 2;
}

.cry.cry4.on {
    bottom: 51%;
    transform: scale(.9);
    transition-delay: .1s;
}

.cry.cry4.off {
    bottom: 51%;
    transform: scale(0);
    transition-delay: .1s;
    transition: all .5s;
}

.cry.cry5 {
    right: 51%;
    background: #ffd7d8;
    z-index: 2;
}

.cry.cry5.on {
    bottom: 51%;
    transform: scale(.8);
    transition-delay: .1s;
}

.cry.cry5.off {
    bottom: 51%;
    transform: scale(0);
    transition-delay: .1s;
    transition: all .5s;
}

.cry.cry6 {
    right: -17%;
    background: #ffd7d8;
    z-index: 2;
}

.cry.cry6.on {
    bottom: 21%;
    transform: scale(.8);
    transition-delay: .1s;
}

.cry.cry6.off {
    bottom: 21%;
    transform: scale(0);
    transition-delay: .1s;
    transition: all .5s;
}

.cry.cry8 {
    right: 38%;
    background: #fff;
    z-index: 2;
}

.cry.cry8.on {
    bottom: 39%;
    transform: scale(.7);
    transition-delay: .2s;
}

.cry.cry8.off {
    bottom: 39%;
    transform: scale(0);
    transition-delay: .2s;
    transition: all .5s;
}

.cry.cry9 {
    right: 63%;
    background: #fff;
    z-index: 2;
}

.cry.cry9.on {
    bottom: -13%;
    transform: scale(1.8);
    transition-delay: .2s;
}

.cry.cry9.off {
    bottom: -13%;
    transform: scale(0);
    transition-delay: .2s;
    transition: all .5s;
}

.cry.cry10 {
    right: 74%;
    background: #ffe05a;
    z-index: 2;
}

.cry.cry10.on {
    bottom: 54%;
    transform: scale(.9);
    transition-delay: .4s;
}

.cry.cry10.off {
    bottom: 54%;
    transform: scale(0);
    transition-delay: .4s;
    transition: all .5s;
}

.cry.cry11 {
    right: 4%;
    background: #fff;
    z-index: 2;
}

.cry.cry11.on {
    bottom: 16%;
    transform: scale(.7);
    transition-delay: .4s;
}

.cry.cry11.off {
    bottom: 16%;
    transform: scale(0);
    transition-delay: .4s;
    transition: all .5s;
}

.cry.cry12 {
    right: -5%;
    background: #fff;
    z-index: 2;
}

.cry.cry12.on {
    bottom: -16%;
    transform: scale(1.1);
    transition-delay: .4s;
}

.cry.cry12.off {
    bottom: -16%;
    transform: scale(0);
    transition-delay: .4s;
    transition: all .5s;
}

.cry.cry13 {
    right: 64%;
    background: #ffd7d8;
    z-index: 2;
}

.cry.cry13.on {
    bottom: -16%;
    transform: scale(.8);
    transition-delay: .4s;
}

.cry.cry13.off {
    bottom: -16%;
    transform: scale(0);
    transition-delay: .4s;
    transition: all .5s;
}

.cry.cry14 {
    right: -13%;
    background: #ffe05a;
    z-index: 2;
}

.cry.cry14.on {
    bottom: 62%;
    transform: scale(.8);
    transition-delay: .6s;
}

.cry.cry14.off {
    bottom: 62%;
    transform: scale(0);
    transition-delay: .6s;
    transition: all .5s;
}

.cry.cry15 {
    right: 46%;
    background: #c3e1d2;
    z-index: 2;
}

.cry.cry15.on {
    bottom: 28%;
    transform: scale(.6);
    transition-delay: .6s;
}

.cry.cry15.off {
    bottom: 28%;
    transform: scale(0);
    transition-delay: .6s;
    transition: all .5s;
}

.cry.cry16 {
    right: 39%;
    background: #ffe05a;
    z-index: 2;
}

.cry.cry16.on {
    bottom: -42%;
    transform: scale(1);
    transition-delay: .6s;
}

.cry.cry16.off {
    bottom: -42%;
    transform: scale(0);
    transition-delay: .6s;
    transition: all .5s;
}

.cry.cry17 {
    right: 13%;
    background: #ffe05a;
    z-index: 2;
}

.cry.cry17.on {
    bottom: 3%;
    transform: scale(.3);
    transition-delay: .6s;
}

.cry.cry17.off {
    bottom: 3%;
    transform: scale(0);
    transition-delay: .6s;
    transition: all .5s;
}

#cny {
    width: 100%;
    height: 100%;
    position: fixed;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    background: url(../images-pc/bgcol-cny.png) no-repeat;
    background-size: cover;
    z-index: 999999;
    display: none;
}

#cny .box {
    width: 1134px;
    height: 700px;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
}

#cny .box .bg1 {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
}

#cny .box .bg2 {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
}

#cny .box .deng1 {
    position: absolute;
    left: 113px;
    top: 75px;
    opacity: 0;
    transition: all .5s;
}

#cny .box.on .deng1 {
    opacity: 1;
    transition-delay: 1.2s;
    animation: cnyMove 2s linear infinite;
}

@keyframes cnyMove {
    0% {
        transform: translate(0, 5px);
    }

    50% {
        transform: translate(0, 0px);
    }

    100% {
        transform: translate(0, 5px);
    }
}

#cny .box .deng2 {
    position: absolute;
    right: 107px;
    top: 92px;
    opacity: 0;
    transition: all .5s;
}

#cny .box.on .deng2 {
    opacity: 1;
    transition-delay: 1.2s;
    animation: cnyMove 2s linear infinite;
}

#cny .box .yan {
    position: absolute;
    /* left: 285px;
    top: 206px; */
    left: 372px;
    top: 268px;
    opacity: 0;
    transition: all .5s;
}

#cny .box.on .yan {
    left: 285px;
    top: 206px;
    opacity: 1;
    transition-delay: 1.5s;
    animation: cnyMove 2s linear infinite;
}

#cny .box .yu {
    position: absolute;
    right: 260px;
    top: 397px;
    opacity: 0;
    transition: all .5s;
}

#cny .box.on .yu {
    opacity: 1;
    transition-delay: 1.5s;
    animation: cnyMove 2s linear infinite;
}

#cny .box .tiger {
    width: 222px;
    height: 357px;
    position: absolute;
    left: 460px;
    top: 298px;
    opacity: 0;
    transition: all .5s;
}

#cny .box .tiger img {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

#cny .box .title {
    width: 375px;
    height: 207px;
    position: absolute;
    left: 398px;
    top: 30px;
    opacity: 0;
    transition: all .5s;
}

#cny .box .title img {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

#cny .box .fow1 {
    width: 65px;
    height: 69px;
    position: absolute;
    left: 283px;
    top: 72px;
    display: none;
}

#cny .box .fow1 img {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

#cny .box .fow2 {
    width: 109px;
    height: 114px;
    position: absolute;
    right: 250px;
    top: 0;
    display: none;
}

#cny .box .fow2 img {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

#cny .box .fow3 {
    width: 62px;
    height: 64px;
    position: absolute;
    left: 424px;
    top: 263px;
    display: none;
}

#cny .box .fow3 img {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

#cny .box .fow4 {
    width: 34px;
    height: 36px;
    position: absolute;
    left: 653px;
    top: 306px;
    display: none;
}

#cny .box .fow4 img {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
}

#cny .cnyClose {
    width: 30px;
    position: absolute;
    right: 50px;
    top: 50px;
    cursor: pointer;
}

.cnyVideo {
    width: 100%;
    position: relative;
    overflow: hidden;
    background: url(../images-pc/cny-poster.jpg) no-repeat center center;
    background-size: cover;
}

.cnyVideo .bg {
    width: 100%;
    position: relative;
}

.cnyVideo .bg .btn {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    cursor: pointer;
}

.cnyImg {
    width: 100%;
    display: block;
    margin-top: -1px;
    position: relative;
    z-index: 2;
}

.cnyImgBox {
    width: 100%;
    position: relative;
    z-index: 1;
    margin-top: -6%;
    overflow: hidden;
}

.cnyImgBox .bg {
    width: 100%;
    display: block;
}

.cnyImgBox .vf {
    width: 100%;
    position: absolute;
    left: 0;
    top: 0;
    opacity: 0;
    transition: all .5s;
}

.cnyImgBox .vf.on {
    opacity: 1;
}

.cnyImgBox .bom {
    width: 100%;
    height: 5px;
    position: absolute;
    left: 0;
    bottom: 5%;
    text-align: center;
}

.cnyImgBox .bom span {
    width: 44px;
    height: 3px;
    display: inline-block;
    background: #7887ae;
    margin: 0 10px;
    cursor: pointer;
}

.cnyImgBox .bom span.on {
    background: #e3e9f7;
}

#video-cny {
    width: 100%;
    height: 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 9;
    object-fit: cover;
    display: none;
}

.cnyVideo .cny-video-close {
    width: 50px;
    position: absolute;
    right: 20px;
    top: 20px;
    z-index: 9;
    cursor: pointer;
    display: none;
}

@media screen and (max-width: 1921px) {
    .storyNav .tit {
        font-size: 20px;
    }

    .storyNav span {
        font-size: 14px;
    }

    .newsMain ul li .title {
        font-size: 22px;
    }

    .newsMain ul li .time {
        font-size: 17px;
    }

    .newsMain ul li .subTitle {
        font-size: 17px;
    }

    .newsMain ul li {
        height: 265px;
    }

    .newsDetail .newsBox .title {
        font-size: 24px;
    }

    .newsDetail .newsBox .infos p {
        font-size: 14px;
    }

    .newsDetail .newsBox .time {
        font-size: 16px;
    }
}

@media screen and (max-width: 1600px) {
    .storyNav .tit {
        font-size: 23px;
    }

    .storyNav span {
        font-size: 14px;
    }

    .newsMain ul li .title {
        font-size: 20px;
    }

    .newsMain ul li .time {
        font-size: 14px;
    }

    .newsMain ul li .subTitle {
        font-size: 14px;
    }

    .newsMain ul li .subTitle {
        margin-top: 30px;
    }

    .newsMain ul li {
        height: 265px;
    }

    .newsDetail .newsBox .title {
        font-size: 22px;
    }

    .newsDetail .newsBox .infos p {
        font-size: 14px;
    }

    .newsDetail .newsBox .time {
        font-size: 14px;
    }
}

@media screen and (max-width: 1450px) {
    .newsMain {
        width: 1140px;
    }

    .newsMain ul li {
        margin-bottom: 40px;
        padding-bottom: 40px;
    }

    .newsMain ul li img {
        width: 378px;
        height: 252px;
    }

    .newsMain ul li .info {
        width: 688px;
    }

    .newsMain ul li .time {
        top: 10px;
    }

    .newsDetail {
        width: 1086px;
    }

    .newsDetail .newsBox {
        width: 745px;
    }

    .newsDetail .rightBar {
        /* width: 228px; */
    }

    .newsDetail .rightBar .listImgs .imgBox {
        width: 100%;
    }

    .allTab {
        margin-top: 0;
    }

    .allCarTab span {
        width: 195px;
    }

    .allCarTab span.on,
    .allCarTab span:hover {
        font-size: 26px;
    }

    .allCarTab span {
        font-size: 20px;
    }
}

@media screen and (max-width: 1665px) {
    .carsList li {
        width: 272px;
    }
}

@media screen and (max-width: 1515px) {
    .carsList li {
        width: 255px;
    }
}

@media screen and (max-width: 1445px) {
    .carsList li {
        width: 232px;
    }

    .carsList li .carName {
        font-size: 19px;
    }

    .carsList li .price {
        font-size: 16px;
    }
}

@media screen and (max-width: 1550px) {
    .resMain .infoBox {
        width: 420px;
        height: 565px;
    }

    .resMain .infoBox .tit {
        width: 24%;
        margin-top: 24px;
    }

    .resMain .infoBox .drop_select {
        width: 345px;
        height: 50px;
    }

    .resMain .infoBox .drop_select select,
    .resMain .infoBox .drop_select .selectUl {
        /* width: 250px; */
        width: 100%;
        height: 50px;
        line-height: 56px;
        font-size: 14px;
        background: url(../images-pc/arr-down.png) no-repeat 295px center;
        background-size: 20px;
        padding-right: 70px;
    }

    .selectUl ul {
        width: 366px;
    }

    .resMain .infoBox .cw {
        width: 345px;
        margin-top: 22px;
        font-size: 14px;
    }

    .resMain .infoBox .cw .cwlab {
        margin-right: 20px;
        font-size: 14px;
        line-height: 23px;
    }

    .resMain .infoBox .cw .cwlab .check {
        width: 20px;
    }

    .resMain .infoBox .nameAndTel {
        width: 345px;
        height: 50px;
        margin-top: 22px;
    }

    .resMain .infoBox .nameAndTel .name,
    .resMain .infoBox .nameAndTel .tel {
        width: 122px;
    }

    .resMain .infoBox .nameAndTel input {
        width: 100%;
        height: 50px;
        line-height: 50px;
        font-size: 14px;
    }

    .resMain .infoBox .provAndCity {
        width: 345px;
        height: 50px;
        margin-top: 22px;
    }

    .resMain .infoBox .provAndCity .prov,
    .resMain .infoBox .provAndCity .city {
        width: 157px;
    }

    .resMain .infoBox .provAndCity select {
        height: 50px;
        line-height: 55px;
        font-size: 14px;
        background: url(../images-pc/arr-down.png) no-repeat 107px center;
        background-size: 20px;
        padding-right: 66px;
    }

    .resMain .infoBox .provAndCity .arr {
        width: 20px;
    }

    .resMain .infoBox .submit {
        width: 42%;
        margin-top: 36px;
    }

    .resMain .infoBox .drop_select .arr {
        width: 20px;
    }

    .resMain .infoBox .bom {
        width: 50%;
        margin-top: 40px;
    }

    .resMain .infoBox .bom p {
        font-size: 12px;
        line-height: 25px;
    }

    .resMain .infoBox .err {
        height: 20px;
        font-size: 12px;
        background-size: 12px 12px;
        line-height: 23px;
        bottom: -20px;
        padding-left: 17px;
    }
}

@media screen and (max-height: 810px) {
    .resMain .infoBox {
        width: 420px;
        height: 565px;
    }
}

@media screen and (max-width: 1400px) {
    .loanMain .loantip2 {
        width: 1020px;
    }

    .loanMain .loanForm {
        width: 1120px;
    }

    .loanMain .loanForm .leftSec {
        width: 710px;
    }

    .loanMain .loanForm .rightSec {
        width: 358px;
    }

    .loanMain .loanForm .leftSec .selectBox {
        width: 340px;
        margin-bottom: 65px;
    }

    .appliMain {
        width: 1120px;
    }

    .appliMain .cw {
        width: 340px;
    }

    .appliMain .inputSec input {
        width: 300px;
    }

    .appliMain.appliMain .cw i {
        margin-left: 43px;
    }

    .appliMain .cw .cwlab {
        margin-right: 16px;
    }

    .appliMain .inputSec input {
        height: 50px;
        line-height: 50px;
    }

    .loanMain .loanForm .leftSec .selectBox select {
        height: 50px;
        line-height: 50px;
    }

    .loanMain .loanForm .rightSec {
        height: 398px;
    }

    .rightSec .carInfo:nth-child(1) {
        padding-top: 45px;
    }

    .rightSec img {
        bottom: 38px;
    }

    .rightSec .carInfo {
        margin-bottom: 28px;
    }

    .chapt2 .bom .check {
        width: 20px;
    }

    .chapt2 .bom p {
        line-height: 23px;
    }

    .resMain .infoBox .bom .check {
        width: 20px;
    }

    .resMain .infoBox .bom p {
        line-height: 23px;
    }
}

@media screen and (max-height: 700px) {
    .resMain .infoBox {
        width: 420px;
        height: 520px;
    }

    .resMain .infoBox .tit {
        margin-top: 22px;
    }

    .resMain .infoBox .drop_select {
        margin-top: 25px;
    }

    .resMain .infoBox .submit {
        margin-top: 30px;
    }

    .resMain .infoBox .bom {
        margin-top: 20px;
    }
}

/* 超大屏 */
@media screen and (min-width: 2000px) {
    .resMain .infoBox {
        width: 680px;
        height: 880px;
    }

    .resMain .infoBox .tit {
        width: 25%;
        margin-top: 60px;
    }

    .resMain .infoBox .drop_select {
        margin-top: 42px;
    }

    .resMain .infoBox .cw {
        margin-top: 42px;
    }

    .resMain .infoBox .nameAndTel {
        margin-top: 42px;
    }

    .resMain .infoBox .provAndCity {
        margin-top: 42px;
    }

    .resMain .infoBox .drop_select select,
    .resMain .infoBox .drop_select .selectUl {
        background: url(../images-pc/arr-down.png) no-repeat 485px center;
        background-size: 25px;
    }

    .resMain .infoBox .bom {
        width: 44%;
    }

    .resMain .infoBox .bom p {
        font-size: 18px;
        line-height: 28px;
    }

    .resMain .infoBox .bom .check {
        font-size: 25px;
    }

    .resMain .infoBox .nameAndTel .tel .err {
        left: 26px;
    }

    .carsList li {
        width: 415px;
    }

    .hd1 {
        position: absolute;
        /* left: -448px; */
        left: -100%;
        top: 50%;
        transform: translate(0, -50%);
        opacity: 0;
        visibility: hidden;
    }

    .hd1.on {
        animation: hd1 3s linear forwards;
    }

    @keyframes hd1 {
        0% {
            left: -100%;
            opacity: 0;
            visibility: hidden;
        }

        70% {
            left: -400px;
            opacity: 1;
            visibility: visible;
        }

        100% {
            left: -411px;
            opacity: 1;
            visibility: visible;
        }
    }

    .hd2 {
        left: 203px;
    }

    .hd3 {
        width: 200px;
        position: absolute;
        left: 230px;
        top: -25px;
        opacity: 0;
        visibility: hidden;

    }

    .hd3.on {
        animation: hd3 1s .5s linear forwards;
    }

    @keyframes hd3 {
        0% {
            left: 230px;
            opacity: 0;
            visibility: hidden;
        }

        100% {
            left: 425px;
            opacity: 1;
            visibility: visible;
        }
    }

    .hd4 {
        right: 316px;
    }

    @keyframes hd5 {
        0% {
            right: -100%;
            opacity: 0;
            visibility: hidden;
        }

        70% {
            right: -338px;
            opacity: 1;
            visibility: visible;
        }

        100% {
            right: -388px;
            opacity: 1;
            visibility: visible;
        }
    }
}

.carguide-prop {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    z-index: 1000;
    background: rgba(0, 0, 0, 0.5);
    cursor: pointer;
    display: none;
}

.carguide-prop img{
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}