@charset "UTF-8";
body, html {
font-family: "Source Han Sans CN","Microsoft YaHei","寰粺姝i粦楂?, "Microsoft JhengHei","Helvetica Neue", Helvetica, "Heiti SC",Arial, sans-serif;
}
@font-face {
font-family: 'BEBAS';
src: url("../fonts/bebas.eot");
src: url("../fonts/bebas.eot") format("embedded-opentype"), url("../fonts/bebas.woff2") format("woff2"), url("../fonts/bebas.woff") format("woff"), url("../fonts/bebas.ttf") format("truetype"), url("../fonts/bebas.svg#bebas") format("svg");
}
/*@font-face {
font-family: 'GOTHIC';
src: url('../fonts/gothic.eot');
src: url('../fonts/gothic.eot') format('embedded-opentype'),
url('../fonts/gothic.woff2') format('woff2'),
url('../fonts/gothic.woff') format('woff'),
url('../fonts/gothic.ttf') format('truetype'),
url('../fonts/gothic.svg#gothic') format('svg');
}*/
html, body {
overflow: hidden;
position: relative;
}
::-moz-selection { background:red;color:#fff; }
::selection { background:red; color:#fff;}
.ovh-f {
width: 100%;
height: 100%;
position: fixed;
left: 0;
top: 0;
}
.tit1{ font-size:36px; text-align:center; padding-top:2em;}
.tit2{ font-size:36px; color:#fff;padding-top:1em;}
#div1{
width:100%;
overflow:hidden;
border:#efefef solid 1px;
}
#div1 img{
cursor:pointer;
transition:all 0.6s;
}
#div1 img:hover{
transform:scale(1.1);
}
.carlist .swiper-wrapper{
padding-bottom:30px;
}
.carlist{
position: relative;
}
.carlist .swiper-button-next{
right: -40px;
}
.carlist .swiper-button-prev{
left: -40px;
}
.w1660 {
width: 1660px;
margin: 0 auto;
}
.w1400 {
width: 1400px;
margin: 0 auto;
}
.bocweb-footer {
padding: 2rem 0 1.5rem;
background: #303030;
}
.bocweb-footer .top {
position: relative
/*border-bottom:1px solid rgba(137,137,137,.2);*/
}
.bocweb-footer .top .fot-top-right {
width: 940px;
margin-left: 4rem;
}
.bocweb-footer .top .fot-top-right a {
display: block;
font-size: 14px;
line-height: 30px;
color: #777;
position: relative;
}
.bocweb-footer .top .fot-top-right .dd {
left: 0;
/*font-family: "SimSun";*/
-webkit-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
}
.bocweb-footer .top .fot-top-right .dd p {
display: inline-block;
position: relative;
}
.bocweb-footer .top .fot-top-right .dd p:before {
content: "";
position: absolute;
left: 0;
bottom: 5px;
height: 20%;
width: 80%;
-webkit-transform-origin: center right;
-ms-transform-origin: center right;
transform-origin: center right;
-webkit-transform: scaleX(0);
-ms-transform: scaleX(0);
transform: scaleX(0);
background: rgba(225, 18, 35, 0.3);
-webkit-transition: -webkit-transform .3s ease-in-out;
transition: transform .3s ease-in-out;
}
.bocweb-footer .top .fot-top-right .dd:hover {
color: #d00010;
}
.bocweb-footer .top .fot-top-right .dd:hover p:before {
-webkit-transform: scaleX(1);
-ms-transform: scaleX(1);
transform: scaleX(1);
-webkit-transform-origin: center left;
-ms-transform-origin: center left;
transform-origin: center left;
}
.bocweb-footer .top .fot-top-right .dl {
margin-right: .6rem;
width: 110px;
float: left;
}
.bocweb-footer .top .fot-top-right .dl:nth-child(3) {
/*width: 200px;*/
}
.bocweb-footer .top .fot-top-right .dl:last-child {
margin-right: 0;
}
.bocweb-footer .top .fot-top-right .dt {
margin-bottom: 15px;
font-size: 17px;
color: #e0e0e0;
line-height: 1.2;
opacity: 1;
}
.bocweb-footer .top .fot-top-right .ma1 {
margin-top: 25px;
}
.bocweb-footer .top .fxbox {
margin-top: 1rem;
}
.bocweb-footer .top .fxbox span {
color: #fff;
opacity: .5;
line-height: 25px;
margin-right:10px;
}
.bocweb-footer .top .fxbox a {
padding: 0 !important;
margin: 0 5px !important;
width: 25px;
height: 25px;
display: inline-block;
}
.bocweb-footer .top .fxbox .bds_sqq {
background: url(../images/img5.png) no-repeat center;
}
.bocweb-footer .top .fxbox .bds_tsina {
background: url(../images/img5-1.png) no-repeat center;
}
.bocweb-footer .top .fxbox .bds_weixin {
background: url(../images/img5-2.png) no-repeat center;
}
.bocweb-footer .top .fxbox .bds_mall {
background: url(../images/img5-3.png) no-repeat center;
}
.bocweb-footer .top .fxbox .bds_car {
background: url(../images/img5-4.png) no-repeat center;
}
.bocweb-footer .top .fot-top-left {
width: 240px;
}
.bocweb-footer .top .fot-top-left .bot-logo {
width: 128px;
}
.bocweb-footer .top .fot-top-left .tel {
font-size:13px;width:128px; text-align:center;
color:#ccc;
margin-bottom:5px;
line-height:1.5;
}
.bocweb-footer .top .fot-top-left .tel-number {
font-family: "BEBAS";
color: #fff;
line-height: 1.1;
margin-bottom: .95rem;
}
.bocweb-footer .top .fri-box.active .icon-unfold {
-webkit-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
transform: rotate(-180deg);
}
.bocweb-footer .top .fri-box.active .icon-unfold:before {
color: #ec2939;
}
.bocweb-footer .top .fri-box-up {
position: absolute;
width: calc(100% + 2px);
left: -1px;
bottom: 39px;
background: #1b1e25;
border: 1px solid rgba(255, 255, 255, 0.2);
line-height: 40px;
display: none;
}
.bocweb-footer .top .fri-box-up a {
display: block;
line-height: 40px;
color: #fff;
opacity: .6;
-webkit-transition: all .3s ease;
transition: all .3s ease;
}
.bocweb-footer .top .fri-box-up a:hover {
color: #ec2939;
}
.bocweb-footer .top .fri-box {
width: 100%;
height: 40px;
line-height: 40px;
font-size: 13px;
color: rgba(255, 255, 255, 0.55);
text-indent: 20px;
background: #3e3e3e;
position: relative;
cursor: pointer;
}
.bocweb-footer .top .fri-box .fspan {
position: relative;
}
.bocweb-footer .top .fri-box .icon-unfold {
position: absolute;
right: 0;
top: 0;
height: 100%;
width: 40px;
height: 40px;
-webkit-transition: all .3s ease;
transition: all .3s ease;
}
.bocweb-footer .top .fri-box .icon-unfold:before {
font-size: 20px;
opacity: .4;
position: absolute;
left: 50%;
color: #636363;
margin-left: -30px;
-webkit-transition: color .3s ease;
transition: color .3s ease;
}
.bocweb-footer .fot-nav {
padding-bottom: 1.6rem;
}
.bocweb-footer .bot {
padding: 22px 0;
line-height: 22px;
text-align: left;
border-top: 1px solid #3a3a3a;
}
.bocweb-footer .bot .p {
font-size: 13px;
color: #fff;
width: 100%;
}
.bocweb-footer .bot .p1 {
width: 100%;
text-align:center;
}
.bocweb-footer .bot .sp1 {
opacity: .5;
}
.bocweb-footer .bot a {
font-size: 14px;
line-height: 16px;
color: #fff !important;
opacity: .5;
display: inline-block !important;
-webkit-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
}
.bocweb-footer .bot a:hover {
opacity: .9;
}
.bocweb-footer .sub-menu {
width: 100%;
z-index: 2;
}
.bocweb-footer .sub-menu ul {
width: 100%;
}
.bocweb-footer .sub-menu li {
border-bottom: 1px solid #dcdcdc;
font-size: 16px;
}
.bocweb-footer .sub-menu .tit {
display: block;
width: 100%;
padding: 0 3%;
font-size: 14px;
line-height: 60px;
color: #000;
position: relative;
box-sizing: border-box;
margin-bottom: 0;
}
.bocweb-footer .sub-menu .titx {
display: block;
width: 100%;
padding: 0 3%;
line-height: 60px;
color: #000;
position: relative;
border-bottom: 1px solid #dcdcdc;
}
.bocweb-footer .sub-menu .sub-tit:after {
content: '';
display: block;
width: 26px;
height: 26px;
background: url(../images/ico_03.png) no-repeat center;
background-size: 15px auto;
position: absolute;
right: 3%;
top: 8px;
}
.bocweb-footer .sub-menu .sub-tit.on {
background-color: #8453bb;
color: #fff;
}
.bocweb-footer .sub-menu .sub-tit.on:after {
background: url(../images/ico_03_h.png) no-repeat center;
background-size: 15px auto;
}
.bocweb-footer .sub-menu .sec-list {
line-height: 40px;
padding: 10px 4%;
display: none;
}
.bocweb-footer .sub-menu .sec-list p {
background: url(../images/ico_04.png) no-repeat left center;
background-size: 3px auto;
font-size: 14px;
}
.bocweb-footer .sub-menu .sec-list a {
padding-left: 3%;
color: #666;
display: block;
}
.header1 {
z-index: 9;
height: 90px;
position: fixed;
width: 100%;
padding: 0 30px;
box-shadow: 0px 0px 10px 0 rgba(0, 0, 0, 0.1);
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.header1 h1 {
width: 204px;
height: 90px;
position: relative;
overflow: hidden;
}
.header1 h1 img {
max-width: 100%;
position: absolute;
left: 0;
top: 0;
opacity: 0;
-webkit-transition: all 0.5s 0s cubic-bezier(0.86, 0.5, 1, 1);
transition: all 0.5s 0s cubic-bezier(0.86, 0.5, 1, 1);
}
.header1 h1 img.img1 {
opacity: 1;
}
.header1 nav {
float: left;
height: 90px;
line-height: 90px;
width: 800px;
position: absolute;
left: 50%;
top: 0;
margin-left: -375px;
}
.header1 nav li {
float: left;
display: inline-block;
text-align: center;
font-size: 16px;
-webkit-transition: all 0.3s cubic-bezier(0.86, 0.5, 1, 1);
transition: all 0.3s cubic-bezier(0.86, 0.5, 1, 1);
margin: 0 24px;
}
.header1 nav li > a {
color: #fff;
display: block;
position: relative;
-webkit-transition: color 0.5s;
transition: color 0.5s;
-webkit-transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
transition-timing-function: cubic-bezier(0.2, 1, 0.3, 1);
}
.header1 nav li:last-child {
margin-right: 0;
}
.header1 nav li:hover > a, .header1 nav li.cur > a {
color: #da3830;
}
.header1 .nav-sub {
width: 240px;
background: #fff;
position: absolute;
top: 90px;
left: 0;
height: auto;
box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.1);
-webkit-transform-origin: top center;
-ms-transform-origin: top center;
transform-origin: top center;
-webkit-transform: scaleY(0);
-ms-transform: scaleY(0);
transform: scaleY(0);
-webkit-transition: -webkit-transform .3s .2s;
transition: transform .3s .2s;
}
.header1 .nav-sub .n-nav-sub {
opacity: 0;
-webkit-transform: translate(0, -20px);
-ms-transform: translate(0, -20px);
transform: translate(0, -20px);
-webkit-transition: all .2s;
transition: all .2s;
}
.header1 .nav-sub a {
height: 45px;
line-height: 45px;
display: block;
padding: 0 20px;
text-align: left;
color: #333;
font-size: 14px;
position: relative;
-webkit-transition: all 0.3s cubic-bezier(0.86, 0.5, 1, 1);
transition: all 0.3s cubic-bezier(0.86, 0.5, 1, 1);
}
.header1 .nav-sub .nav-arrow {
position: absolute;
top: 15px;
right: 10px;
width: 16px;
height: 16px;
opacity: 0;
-webkit-transform: rotate(90deg) translate(0px, 20px);
-ms-transform: rotate(90deg) translate(0px, 20px);
transform: rotate(90deg) translate(0px, 20px);
}
.header1 .nav-sub .nav-arrow:before {
font-size: 16px;
color: #fff;
}
.header1 .nav-sub a:hover {
background-color: #e60012;
color: #fff;
}
.header1 .nav-sub a:hover .nav-arrow {
-webkit-transition: -webkit-transform 300ms cubic-bezier(0.68, -0.55, 0.265, 1.55), opacity 300ms;
transition: transform 300ms cubic-bezier(0.68, -0.55, 0.265, 1.55), opacity 300ms;
opacity: 1;
-webkit-transform: rotate(90deg) translate(0px, 0px);
-ms-transform: rotate(90deg) translate(0px, 0px);
transform: rotate(90deg) translate(0px, 0px);
}
.header1 .nav-sub.active {
-webkit-transform: scaleY(1);
-ms-transform: scaleY(1);
transform: scaleY(1);
-webkit-transition: -webkit-transform .3s;
transition: transform .3s;
}
.header1 .nav-sub.active .n-nav-sub {
opacity: 1;
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0);
-webkit-transition: all .2s .3s;
transition: all .2s .3s;
}
.header1 .pc-sub-nav {
background: #404040;
position: absolute;
top: 90px;
height: 710px;
width: 100%;
padding: 1rem 80px 2.5rem 100px;
left: 0;
/*visibility: hidden;*/
z-index: 1;
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
-webkit-transform-origin: 50% 0%;
-ms-transform-origin: 50% 0%;
transform-origin: 50% 0%;
/*-webkit-transform: perspective(1200px) rotateX(-92deg);
transform: perspective(1200px) rotateX(-92deg);
opacity: 0;*/
display:none;
/*-webkit-transition: all .3s 0s;
transition: all .3s 0s;*/
}
.header1 .pc-sub-nav .list {
width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: stretch;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
.header1 .pc-sub-nav .nlist {
width: 1180px;
}
.header1 .pc-sub-nav .li-list {
padding: 1rem 0 .5rem;
border-bottom: 1px solid rgba(205, 205, 205, 0.11);
}
.header1 .pc-sub-nav .imgbox {
width: calc(100% - 1180px);
height: 710px;
position: absolute;
right: 0;
top: 0;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
}
.header1 .pc-sub-nav .li-item {
position: relative;
float: left;
width: 28%;
margin: 0;
top: 0;
padding: 0 1%;
display: block;
-webkit-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
}
.header1 .pc-sub-nav .car-img {
width: 100%;
left: 0;
position: relative;
display: inline-block;
-webkit-transition: all .3s .3s ease-in-out;
transition: all .3s .3s ease-in-out;
}
.header1 .pc-sub-nav .car-img img {
max-width: 100%;
display: inline-block;
}
.header1 .pc-sub-nav .carlink {
margin-top: 2.15rem;
}
.header1 .pc-sub-nav .carlink .bottonbox {
height: 60px;
line-height: 60px;
background: #585858;
margin: 0 15px;
display: block;
width: 220px;
float: left;
}
.header1 .pc-sub-nav .carlink .bottonbox p {
display: inline-block;
padding-left: 40px;
color: #fff;
position: relative;
z-index: 2;
}
.header1 .pc-sub-nav .carlink .bottonbox p:before {
content: "";
position: absolute;
width: 25px;
height: 25px;
left: 0;
top: 50%;
margin-top: -12.5px;
}
.header1 .pc-sub-nav .carlink .bottonbox1 p:before {
background: url(../images/img1.png) no-repeat center;
background-size: 25px 25px;
}
.header1 .pc-sub-nav .carlink .bottonbox2 p:before {
background: url(../images/img1-1.png) no-repeat center;
background-size: 25px 25px;
}
.header1 .pc-sub-nav .carlink .hover_1:before {
z-index: 1;
background: #d00010;
width: 300px;
height: 200px;
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
-webkit-transform: translate(-50%, -50%) scale(0);
-ms-transform: translate(-50%, -50%) scale(0);
transform: translate(-50%, -50%) scale(0);
}
.header1 .pc-sub-nav .carlink .hover_1:hover:before {
-webkit-transform: translate(-50%, -50%) scale(1);
-ms-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.header1 .pc-sub-nav .li-item:hover {
top: -20px;
}
.header1 .pc-sub-nav .li-item:hover .car-img {
left: -25px;
}
.header1 .pc-sub-nav.on {
/*visibility: visible;
transform: perspective(0px) rotateX(0deg);
-webkit-transform: rotateX(0deg);
opacity: 1;
-webkit-transition: all .5s 0s;
transition: all .5s 0s;*/
}
.header1 .pc-sub-nav .list.on {
/*opacity: 1;
visibility: visible;
transform:translate(0,0);*/
}
.header1 .header-right {
width:180px;
position:absolute;
right:.5rem;
top:0;
z-index:10;
}
.header1 .header-right .search-btn {
width:180px;
height:90px;
line-height:90px;
text-align:center;
cursor:pointer;
}
.header1 .header-right .search-btn:before {
font-size:25px;
color:#fff;
-webkit-transition: color .3s ease-in-out;
transition: color .3s ease-in-out;
}
.bgred {color:#ccc;}
.bgred a{background-color:#797979;color:#fff;border-radius:5px; padding:5px;}
.bgred a:hover{background-color:#F00;color:#fff;border-radius:5px; padding:5px;}
.header2 {
height:55px;
position:relative;
background:#fff;
z-index:22;
width:100%;
display:none;
}
.header2 .main-wrap {
height:55px;
padding:0 3%;
box-shadow:0px 0px 10px 0px rgba(0, 0, 0, 0.1);
}
.header2 .logo {
width:100px;
height:55px;
overflow:hidden;
}
.header2 .logo a {display:block;}
.header2 .logo img {width:100%;vertical-align:top;}
.header2 .nav-btn {
width:35px;
height:25px;
position:relative;
cursor:pointer;
margin-top:.5rem;
}
.header2 .nav-btn .line {
display:block;
width:100%;
height:3px;
border-radius:3px;
background-color:#ababab;
position:absolute;
left:0;
}
.header2 .nav-btn .line1 {
-webkit-transform-origin: left 0px 0;
-ms-transform-origin: left 0px 0;
transform-origin: left 0px 0;
}
.header2 .nav-btn .line2 {top:11px;}
.header2 .nav-btn .line3 {
bottom:0;
-webkit-transform-origin: left 4px 0;
-ms-transform-origin: left 4px 0;
transform-origin: left 4px 0;
}
.header2 .nav-btn.active {
-webkit-animation: rotate 0.5s linear 0s;
animation: rotate 0.5s linear 0s;
}
.header2 .nav-btn.active .line1 {top:0;}
.header2 .nav-btn.hover .line {background:#d7000e;}
.header2 .sub-menu {
width:100%;
padding:0 3%;
display:none;
position:absolute;
left:0;
top:60px;
z-index:2;
overflow-y:auto;
}
.header2 .sub-menu ul {
width:100%;
overflow-y:scroll;
height:calc(100vh - 55px - 1.5rem);
}
.header2 .sub-menu li {
border-bottom:1px solid #dcdcdc;
font-size:16px;
}
.header2 .sub-menu .tit {
display: block;
width: 100%;
padding: 0 3%;
line-height: 60px;
color: #000;
position: relative;
box-sizing: border-box;
}
.header2 .sub-menu .titx {
display:block;
width:100%;
padding:0 3%;
line-height:60px;
color:#000;
position:relative;
border-bottom:1px solid #dcdcdc;
}
.header2 .sub-menu .sub-tit:after {
content: '';
display: block;
width: 26px;
height: 26px;
background: url(../images/ico_03.png) no-repeat center;
background-size: 17px auto;
position: absolute;
right: 3%;
top: 15px;
}
.header2 .sub-menu .sub-tit.on {background-color:#e9e9e9;}
.header2 .sub-menu .sub-tit.on:after {
background: url(../images/ico_03_h-1.png) no-repeat center;
background-size: 20px auto;
}
.header2 .sub-menu .sec-list {
line-height:40px;
padding:10px 4%;
display:none;
}
.header2 .sub-menu .sec-list p {
background:url(../images/ico_04.png) no-repeat left center;
background-size:3px auto;
font-size:14px;
}
.header2 .sub-menu .sec-list a {
padding-left:3%;
color:#666;
display:block;
}
.header1:hover, .header1.active {background:#fff;}
.header1:hover h1 img.img2, .header1.active h1 img.img2 {opacity:1;}
.header1:hover h1 img.img1, .header1.active h1 img.img1 {opacity:0;}
.header1:hover nav li > a, .header1.active nav li > a {color:#000;}
.header1:hover .header-right .search-btn:before, .header1.active .header-right .search-btn:before {color:#000;}
.header1:hover .header-right .search-btn:hover:before, .header1.active .header-right .search-btn:hover:before {color:#d00010;}
.header1 nav, .header1 .header-right .search-btn, .header1 h1 {
-webkit-transition:all .3s ease;
transition:all .3s ease;
}
.n-header.scroll {height:70px;}
.header1.scroll {height:70px;}
.header1.scroll h1 {height:70px;width:128px;}
.header1.scroll nav {height:70px;line-height:70px;}
.header1.scroll nav li {
-webkit-transition:all .3s ease;
transition:all .3s ease;
-webkit-transition-delay:0s !important;
transition-delay:0s !important;
}
.header1.scroll .header-right .search-btn {height:70px;line-height:70px;}
.header1.scroll .nav-sub {top:70px;}
.header1.scroll .pc-sub-nav {top:70px;}
.car-info-nav.scroll {
background:#fff;
position:fixed;
width:100%;
left:0;
top:0;
z-index:9;
}
.header1 {
top:0;
-webkit-transition:all .5s ease;
transition:all .5s ease;
}
.header1.car-header {top:-90px;}
.search-bg {
position:fixed;
left:0;
top:0;
width:100%;
height:100%;
z-index:10;
background-color:#f5f5f5;
display:none;
z-index:20;
}
.buttonbox.hover_1 {
width:160px;
height:45px;
line-height:45px;
text-align:center;
box-shadow:inset 0px 0px 0px 3px #9a9a9a;
display:block;
color:#fff;
}
.buttonbox.hover_1 p {
position:relative;
z-index:2;
height:45px;
line-height:45px;
}
.buttonbox.hover_1:before {
z-index:1;
background:#d00010;
width:250px;
height:200px;
-webkit-transform-origin:left center;
-ms-transform-origin:left center;
transform-origin:left center;
-webkit-transform:translate(-50%, -50%) scale(0);
-ms-transform:translate(-50%, -50%) scale(0);
transform:translate(-50%, -50%) scale(0);
}
.buttonbox.hover_1:hover:before {
-webkit-transform:translate(-50%, -50%) scale(1);
-ms-transform:translate(-50%, -50%) scale(1);
transform:translate(-50%, -50%) scale(1);
}
.i-banner {
width:100%;
height:100vh;
overflow:hidden;
}
.i-banner .swiper-slide {
width: 100%;
background-size: cover;
background-position: center center;
background-repeat: no-repeat;
}
.i-banner .slide-wrap {
width: 100vw;
height: 100vh;
overflow: hidden;
position: absolute;
}
.i-banner a {
display: block;
width: 100%;
height: 100vh;
}
.index-banner-warp {position:relative;z-index:1;}
/*.index-banner-warp .i-banner .swiper-pagination {
width: 40px;
top: 50%;
left: 30px;
bottom: auto;
-webkit-transform: translate(0%, -50%);
-ms-transform: translate(0%, -50%);
transform: translate(0%, -50%);
}
.index-banner-warp .i-banner .swiper-pagination span {
height: 3px;
display: inline-block;
width: 100%;
margin: 4px 0;
border-radius: 0;
background: none;
position: relative;
opacity: 1;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.index-banner-warp .i-banner .swiper-pagination span:before {
content: "";
background: #fff;
height: 3px;
width: 100%;
position: absolute;
left: 0;
-webkit-transform: scale(1, 0.333);
-ms-transform: scale(1, 0.333);
transform: scale(1, 0.333);
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.index-banner-warp .i-banner .swiper-pagination span.swiper-pagination-bullet-active:before {
-webkit-transform: scale(1, 1);
-ms-transform: scale(1, 1);
transform: scale(1, 1);
}*/
.index-banner-bot {
background: #fff;
height: 66px;
position: absolute;
bottom: 0;
left: 50%;
-webkit-transform: translate(-50%, 0);
-ms-transform: translate(-50%, 0);
transform: translate(-50%, 0);
z-index: 2;
}
.index-banner-bot .news-scroll {
overflow: hidden;
padding-left: .75rem;
font-size: 16px;
height: 66px;
width: calc(100% - 310px);
}
.index-banner-bot .news-scroll .swiper-slide {
height: 66px;
line-height: 66px;
}
.index-banner-bot .news-scroll .swiper-slide a {
color: #333;
}
.index-banner-bot .index-bot-right {
width: 310px;
height: 66px;
position: relative;
background: #e6e6e6;
}
.index-banner-bot .swiper-button-warp {
width: 180px;
height: 66px;
position: relative;
}
.index-banner-bot .swiper-button-warp .swiper-button-next, .index-banner-bot .swiper-button-warp .swiper-button-prev {
width: 90px;
height: 66px;
margin-top: -33px;
opacity: 1;
-webkit-transition: all .3s ease;
transition: all .3s ease;
background: none !important;
}
.index-banner-bot .swiper-button-warp:before {
content: "";
position: absolute;
width: 1px;
height: 25px;
background: #cfcfcf;
left: 50%;
top: 35px;
margin-top: -12.5px;
}
.index-banner-bot .swiper-button-warp .icon-rot {
-webkit-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
transform: rotate(-180deg);
}
.index-banner-bot .swiper-button-warp .icon {
display: block;
width: 15px;
height: 26px;
margin: 20px auto;
fill: #000;
}
.index-banner-bot .swiper-button-warp .swiper-button-next:hover, .index-banner-bot .swiper-button-warp .swiper-button-prev:hover {
opacity: .6;
}
.index-banner-bot .swiper-suzi-button {
width: 90px;
position: relative;
line-height: 66px;
margin-right: 20px;
}
.index-banner-bot .swiper-suzi-button .swiper-page, .index-banner-bot .swiper-suzi-button .swiper-all-page {
width: 30px;
height: 66px;
text-align: center;
}
.index-banner-bot .swiper-suzi-button:before {
content: "";
position: absolute;
width: 12px;
height: 1px;
background: #1a1a1a;
left: 50%;
margin-left: -6px;
top: 50%;
}
.i-lista .carlist {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: stretch;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
.i-lista .carlist .li-item {
padding: 1.7rem 0;
width: 20%;
margin: 0 .6%;
position: relative;
}
.i-lista .carlist .li-item img {
max-width: 100%;
}
.i-lista .carlist .li-item .tit-14 {
color: #333;
line-height: 1;
}
.i-lista .carlist .li-item:before {
content: "";
position: absolute;
left: 0;
bottom: 0px;
height: 3px;
width: 100%;
-webkit-transform-origin: center right;
-ms-transform-origin: center right;
transform-origin: center right;
-webkit-transform: scaleX(0);
-ms-transform: scaleX(0);
transform: scaleX(0);
/*background: #e11223;*/
-webkit-transition: -webkit-transform .3s ease-in-out;
transition: transform .3s ease-in-out;
}
.i-lista .carlist .li-item:hover:before, .i-lista .carlist .li-item.cur:before {
-webkit-transform: scaleX(1);
-ms-transform: scaleX(1);
transform: scaleX(1);
-webkit-transform-origin: center left;
-ms-transform-origin: center left;
transform-origin: center left;
}
.i-lista .carbox {
width: 100%;
height: 17rem;
background: url(../images/img4.jpg) no-repeat left center;
position: relative;
background-size: 100% 100%;
}
.i-lista .carbox .n-carbox {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: stretch;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
.i-lista .carbox .line {
width: 25px;
height: 2px;
background: #fff;
margin-bottom: 15px;
opacity: 0;
-webkit-transform: translate(0, 10px);
-ms-transform: translate(0, 10px);
transform: translate(0, 10px);
-webkit-transition: all 1.5s cubic-bezier(0.215, 0.61, 0.355, 1);
transition: all 1.5s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.i-lista .carbox .tit-40 {
margin-bottom: 5px;
opacity: 0;
-webkit-transform: translate(0, 20px);
-ms-transform: translate(0, 20px);
transform: translate(0, 20px);
-webkit-transition: all 1.5s cubic-bezier(0.215, 0.61, 0.355, 1);
transition: all 1.5s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.i-lista .carbox .tit-22 {
opacity: 0;
-webkit-transform: translate(0, 30px);
-ms-transform: translate(0, 30px);
transform: translate(0, 30px);
-webkit-transition: all 1.5s cubic-bezier(0.215, 0.61, 0.355, 1);
transition: all 1.5s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.i-lista .carbox .car-left {
width: 500px;
padding-top: 3rem;
margin-right: 4rem;
}
.i-lista .carbox .libox {
margin-top: 1rem;
margin-bottom: 1.5rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: stretch;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
opacity: 0;
-webkit-transform: translate(0, 40px);
-ms-transform: translate(0, 40px);
transform: translate(0, 40px);
-webkit-transition: all 1.5s cubic-bezier(0.215, 0.61, 0.355, 1);
transition: all 1.5s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.i-lista .carbox .libox .icon-item {
text-align: center;
width: 26%;
padding: 0 5%;
border-right: 1px solid rgba(168, 168, 168, 0.16);
}
.i-lista .carbox .libox img {
margin-bottom: 5px;
}
.i-lista .carbox .libox .icon-item:nth-child(2n) {
width: 44%;
}
.i-lista .carbox .libox .icon-item:nth-child(1) {
/*text-align: left;*/
padding-left: 0;
}
.i-lista .carbox .libox .icon-item:nth-child(3) {
/*text-align: left;*/
border-right: 0;
padding-right: 0;
}
.i-lista .carbox .botbox {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
opacity: 0;
-webkit-transform: translate(0, 50px);
-ms-transform: translate(0, 50px);
transform: translate(0, 50px);
-webkit-transition: all 1.5s cubic-bezier(0.215, 0.61, 0.355, 1);
transition: all 1.5s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.i-lista .carbox .botbox .buttonbox {
margin-right: 12px;
}
.i-lista .carbox .botbox .buttonbox:last-child {
margin-right: 0;
}
.i-lista .carbox .car-right {
padding-top: 2.5rem;
width: 23rem;
}
.i-lista .carbox .car-right .imgtext {
float: right;
margin-right: 2rem;
position: relative;
z-index: 1;
-webkit-clip-path: circle(0% at 100% 51%);
clip-path: circle(0% at 100% 51%);
-webkit-transition: all 1s cubic-bezier(0.215, 0.61, 0.355, 1);
transition: all 1s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.i-lista .carbox .car-right .car {
max-width: 100%;
margin-top: -.8rem;
position: relative;
z-index: 2;
opacity: 0;
-webkit-transform: translate(100px, 0);
-ms-transform: translate(100px, 0);
transform: translate(100px, 0);
-webkit-transition: all 1s cubic-bezier(0.25, 0.96, 0.4, 1.11);
transition: all 1s cubic-bezier(0.25, 0.96, 0.4, 1.11);
}
.i-lista .mengbox {
position: absolute;
z-index: 3;
width: 100%;
height: 100%;
left: 0;
top: 0;
background: #000;
-webkit-transform-origin: center top;
-ms-transform-origin: center top;
transform-origin: center top;
-webkit-transform: scaleY(0);
-ms-transform: scaleY(0);
transform: scaleY(0);
-webkit-transition: -webkit-transform 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
transition: transform 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.i-lista .mengbox.cur {
-webkit-transition: -webkit-transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
transition: transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
-webkit-transform-origin: center bottom;
-ms-transform-origin: center bottom;
transform-origin: center bottom;
-webkit-transform: scaleY(1);
-ms-transform: scaleY(1);
transform: scaleY(1);
}
.i-lista .carbox.cur .line, .i-lista .carbox.cur .tit-40, .i-lista .carbox.cur .tit-22, .i-lista .carbox.cur .libox, .i-lista .carbox.cur .botbox {
opacity: 1;
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0);
}
.i-lista .carbox.cur .tit-40 {
-webkit-transition-delay: .1s;
transition-delay: .1s;
}
.i-lista .carbox.cur .tit-22 {
-webkit-transition-delay: .15s;
transition-delay: .15s;
}
.i-lista .carbox.cur .libox {
-webkit-transition-delay: .2s;
transition-delay: .2s;
}
.i-lista .carbox.cur .botbox {
-webkit-transition-delay: .25s;
transition-delay: .25s;
}
.i-lista .carbox.cur .car-right .car {
opacity: 1;
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0);
-webkit-transition-delay: .4s;
transition-delay: .4s;
}
.i-lista .carbox.cur .car-right .imgtext {
-webkit-transition-delay: .3s;
transition-delay: .3s;
-webkit-clip-path: circle(150% at 100% 51%);
clip-path: circle(150% at 100% 51%);
}
.i-listb {
background: #46474c;
height: 16.75rem;
position: relative;
overflow: hidden;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: stretch;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
.i-listb .car-img {
width: 50%;
height: 16.75rem;
overflow: hidden;
position: relative;
z-index: 1;
/* opacity: 0;
-webkit-transform: translate(-100%, 0);
-ms-transform: translate(-100%, 0);
transform: translate(-100%, 0);*/
opacity:1;
-webkit-transform: translate(0%, 0);
-ms-transform: translate(0%, 0);
transform: translate(0%, 0);
-webkit-transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
transition: all 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.i-listb .car-img .swiper-slide {
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
}
.i-listb .news-text {
width: 50%;
height: 16.75rem;
overflow: hidden;
position: relative;
z-index: 1;
opacity: 1;
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0);
/*opacity: 0;
-webkit-transform: translate(100px, 0);
-ms-transform: translate(100px, 0);
transform: translate(100px, 0);*/
-webkit-transition: all 0.5s 0.2s cubic-bezier(0.215, 0.61, 0.355, 1);
transition: all 0.5s 0.2s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.i-listb .news-text{
padding: 0px 1.5rem 0 1.5rem;
background: #46474c;
}
.i-listb .news-text .swiper-slide {
width: 100%;
height: 16.75rem;
}
.i-listb .news-text{
position: relative;
}
.i-listb .news-text .tab-box {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
margin-bottom: .1rem;
position: relative;
width:100%;
/*left:0;*/
padding:1.5rem 0 .9rem;
background:#46474c;
z-index:3;
}
.i-listb .news-text .tab-li {
width:120px;
height:40px;line-height:40px;
font-size:16px;
text-align:center;
background:#797979;
margin-left:5px;
cursor:pointer;
}
.i-listb .news-text .tab-li p {
position: relative;
z-index: 2;
}
.i-listb .news-text .hover_1:before {
z-index: 1;
background: #d00010;
width: 350px;
height: 200px;
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
-webkit-transform: translate(-50%, -50%) scale(0);
-ms-transform: translate(-50%, -50%) scale(0);
transform: translate(-50%, -50%) scale(0);
}
.i-listb .news-text .hover_1:hover:before, .i-listb .news-text .hover_1.cur:before {
-webkit-transform: translate(-50%, -50%) scale(1);
-ms-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.i-listb .news-text .tit-24 {
margin-bottom: .1rem;
}
.i-listb .news-text .tit-16 {
margin-bottom: 0.65rem;
line-height: 26px;
max-height:104px;
overflow: hidden;
}
.i-listb .news-text .swiper-pagination {
right: 2.5rem;
}
.i-listb .news-text .swiper-pagination span {
margin: 12px 0;
width: 6px;
height: 6px;
display: block;
background: #fff;
opacity: 1;
-webkit-transition: all .5s;
transition: all .5s;
}
.i-listb .news-text .swiper-pagination .swiper-pagination-bullet-active {
background: #d00010;
}
.i-listb .news-text .colbox {
position: absolute;
right: 2.5rem;
width: 35px;
top: 50%;
}
.i-listb .news-text .colbox .swiper-button-prev, .i-listb .news-text .colbox .swiper-button-next {
top: 0;
width: 35px;
height: 35px;
left: 15px;
right: 0;
margin-top: 0;
}
.i-listb .news-text .colbox .swiper-button-prev {
background: url(../images/icon-tianjia1.png) no-repeat center;
background-size: 35px 35px;
}
.i-listb .news-text .colbox .swiper-button-next {
background: url(../images/icon-tianjia1.png) no-repeat center;
background-size: 35px 35px;
bottom: 0;
top: auto;
-webkit-transform: rotate(180deg);
-ms-transform: rotate(180deg);
transform: rotate(180deg);
}
.i-listb .car-img.cur, .i-listb .news-text.cur {
opacity: 1;
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0);
}
.i-listb .mengbox {
position: absolute;
z-index: 3;
width: 100%;
height: 100%;
left: 0;
top: 0;
background: #000;
-webkit-transform-origin: right center;
-ms-transform-origin: right center;
transform-origin: right center;
-webkit-transform: scaleX(0);
-ms-transform: scaleX(0);
transform: scaleX(0);
-webkit-transition: -webkit-transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
transition: transform 0.3s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.i-listb .mengbox.cur {
-webkit-transition: -webkit-transform 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
transition: transform 0.5s cubic-bezier(0.215, 0.61, 0.355, 1);
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
-webkit-transform: scaleX(1);
-ms-transform: scaleX(1);
transform: scaleX(1);
}
.i-listc {
background: #ebebeb;
padding-bottom: 2.5rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: stretch;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
.i-listc .li-item {
border-right: 1px solid #d3d3d3;
}
.i-listc .li-item:last-child {
margin-right: none;
}
.i-listc .text {
padding: .5rem .65rem 1.75rem;
}
.i-listc .tit-18 {
margin-bottom: 3px;
}
.line-left {
position: absolute;
height: calc(100% - 90px);
width: 1px;
left: 50px;
top: 90px;
opacity: .2;
z-index: 6;
}
.line-left:before {
content: "";
position: absolute;
left: 0;
top: 0;
width: 1px;
background: #595759;
height: calc(50vh - 180px);
}
.line-left:after {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 1px;
background: #595759;
height: calc(100% - 50vh + 20px);
}
/*渚ф爮鎮诞妗?/
.sidebar-box {
width: 65px;
position: fixed;
z-index: 9;
right: 0;
top: calc(348 * 0.052vw);
}
.sidebar-box .itembox {
width: 100%;
height: 62px;
display: block;
position: relative;
margin-bottom: 2px;
overflow: hidden;
}
.sidebar-box .imgbtn {
width: 65px;
height: 40px;
overflow: hidden;
}
.sidebar-box .imgbtn img {
position: absolute;
left: 0;
top: 0;
width: 65px;
height: 40px;
overflow: hidden;
}
.sidebar-box .imgbtn .img1 {
/*animation: toTopFromBottom 0.3s forwards;*/
}
.sidebar-box .itembox:nth-child(1) {
background-color: #e51626;
}
.sidebar-box .itembox:nth-child(2) {
background-color: #c6182a;
}
.sidebar-box .itembox:nth-child(3) {
background-color: #a8192c;
}
.sidebar-box .itembox:nth-child(4) {
background-color: #831526;
}
.sidebar-box .itembox:nth-child(5) {
background-color: #68101e;
}
.sidebar-box .itembox:hover .img1 {
animation: toTopFromBottom 0.3s forwards;
}
.sidebar-box .back-top {
opacity: 0;
-webkit-transform: translate(0, 20px);
-ms-transform: translate(0, 20px);
transform: translate(0, 20px);
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.sidebar-box .back-top.active {
opacity: 1;
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0);
}
.n-header {
height: 90px;
position: relative;
}
.n-header .header1 {
background: #fff;
}
.n-header .header1 .header-left{
position: relative;
z-index:9;
}
.n-header .header1 h1 img.img2 {
opacity: 1;
}
.n-header .header1 h1 img.img1 {
opacity: 0;
}
.n-header .header1 nav li > a {
color: #000;
}
.n-header .header1 .header-right .search-btn:before {
color: #000;
}
.n-header .header1 .header-right .search-btn:hover:before {
color: #d00010;
}
.li-img .img {
overflow: hidden;
}
.li-img .img img {
width: 100%;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
-webkit-transition-duration: 4s;
transition-duration: 4s;
-webkit-transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
}
.li-img:hover .img img {
-webkit-transform: scale3d(1.1, 1.1, 1);
transform: scale3d(1.1, 1.1, 1);
}
.nli-img {
overflow: hidden;
}
.nli-img img {
width: 100%;
-webkit-transform: scale3d(1, 1, 1);
transform: scale3d(1, 1, 1);
-webkit-transition-duration: 4s;
transition-duration: 4s;
-webkit-transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
}
.nli-img:hover img {
-webkit-transform: scale3d(1.1, 1.1, 1);
transform: scale3d(1.1, 1.1, 1);
}
.n-banner {
width: 100%;
height: 19rem;
position: relative;
background-repeat: no-repeat !important;
background-position-x: center;
background-size: cover !important
/*.scroll_down{
width: 60px;
height: 60px;
border:1px solid rgba(255,255,255,.2);
position: absolute;
border-radius: 50%;
left: 50%;
margin-left: -30px;
bottom: 1.8rem;
&:before{
color:#fff;
transform:rotate(-90deg);
font-size: 24px;
position: absolute;
left: 50%;
top: 50%;
margin-top: -16px;
margin-left: -12.5px;
opacity: .7;
animation: start 1.5s infinite ease-in-out;
}
}*/
}
.n-banner .banner-tit {
padding-top: 3.25rem;
text-align: center;
position: relative;
}
.n-banner .banner-tit .tit-h {
display: inline-block;
padding: 0 80px;
line-height: 1.5;
position: relative;
}
.n-banner .banner-tit .tit-h:before {
content: "";
position: absolute;
width: 35px;
height: 1px;
background: rgba(255, 255, 255, 0.56);
left: 0;
top: 50%;
}
.n-banner .banner-tit .tit-h:after {
content: "";
position: absolute;
width: 35px;
height: 1px;
background: rgba(255, 255, 255, 0.56);
right: 0;
top: 50%;
}
.n-banner .banner-tit .tit-p {
display: block;
}
.n-banner .rec-news {
width: 700px;
position: absolute;
bottom: .8rem;
left: 3.5rem;
z-index: 2;
}
.n-banner .rec-news .tit-34 {
width: 100%;
position: relative;
}
.n-banner .rec-news .tit-34 .p {
width: calc(100% - 200px);
}
.n-banner .rec-news .bottonbox {
height: 45px;
line-height: 45px;
font-size: 16px;
margin: 0 15px;
display: block;
width: 130px;
position: absolute;
right: 0;
top: 0;
box-shadow: inset 0px 0px 0px 2px rgba(255,255,255,.5);
}
.n-banner .rec-news .bottonbox p {
display: inline-block;
color: #fff;
position: relative;
z-index: 2;
}
.n-banner .rec-news .bottonbox p:before {
content: "";
position: absolute;
width: 25px;
height: 25px;
left: 0;
top: 50%;
margin-top: -12.5px;
}
.n-banner .rec-news .hover_1:before {
z-index: 1;
background: #d00010;
width: 250px;
height: 120px;
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
-webkit-transform: translate(-50%, -50%) scale(0);
-ms-transform: translate(-50%, -50%) scale(0);
transform: translate(-50%, -50%) scale(0);
}
.n-banner .rec-news .hover_1:hover:before {
-webkit-transform: translate(-50%, -50%) scale(1);
-ms-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.n-banner:before {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 40%;
background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.8), transparent);
background: linear-gradient(to top, rgba(0, 0, 0, 0.8), transparent);
z-index: 1;
}
@-webkit-keyframes start {
0%,30% {
opacity: 0;
-webkit-transform: translate(0, -8px) rotate(-90deg);
transform: translate(0, -8px) rotate(-90deg);
}
60% {
opacity: 1;
-webkit-transform: translate(0, 0) rotate(-90deg);
transform: translate(0, 0) rotate(-90deg);
}
100% {
opacity: 0;
-webkit-transform: translate(0, 10px) rotate(-90deg);
transform: translate(0, 10px) rotate(-90deg);
}
}
@keyframes start {
0%,30% {
opacity: 0;
-webkit-transform: translate(0, -8px) rotate(-90deg);
transform: translate(0, -8px) rotate(-90deg);
}
60% {
opacity: 1;
-webkit-transform: translate(0, 0) rotate(-90deg);
transform: translate(0, 0) rotate(-90deg);
}
100% {
opacity: 0;
-webkit-transform: translate(0, 10px) rotate(-90deg);
transform: translate(0, 10px) rotate(-90deg);
}
}
.car-banner {
width: 100%;
height: 21.5rem;
position: relative;
background-repeat: no-repeat !important;
background-position-x: center;
background-size: cover !important;
}
.news-nav {
padding: 1.5rem 0 .75rem;
background: #fff;
width: 90%;
margin: 0 auto;
}
.news-nav .ul {
display: inline-block;
}
.news-nav .ul .li {
float: left;
line-height: 40px;
margin: 0 20px;
color: #333;
}
.news-nav .ul .li:after {
height: 3px;
background-color: #e60012;
}
.news-nav .ul .li:hover::after, .news-nav .ul .li.cur::after {
-webkit-transform-origin: center left;
-ms-transform-origin: center left;
transform-origin: center left;
-webkit-transform: scaleX(1);
-ms-transform: scaleX(1);
transform: scaleX(1);
}
.n-news {
padding-bottom: 4.25rem
/*.p-tit{
z-index: 2;
opacity:1;
transform-origin: 0% 50%;
transform:translate(0,0) scale(1);
transition: all .5s ease;
}*/
/*.n-text{
background:rgba(255,255,255,.95);
width:calc(100% - 40px);
height:calc(100% - 40px);
position: absolute;
left:20px;
top: 20px;
padding:1rem;
opacity: 0;
transform-origin: 50% 0%;
transform:rotateX(90deg) perspective(400px);
transition: all .5s ease;
.tit-20{
color: #333;
line-height: 1.2;
position: relative;
padding: 0;
left: 0;
}
}*/
}
.n-news .li-item {
float: left;
width: 32%;
margin-right: 2%;
margin-bottom: 2%;
position: relative;
overflow: hidden;
}
.n-news .li-item:before {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 60%;
background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.8), transparent);
background: linear-gradient(to top, rgba(0, 0, 0, 0.8), transparent);
z-index: 1;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-news .li-item:nth-child(3n) {
margin-right: 0;
}
.n-news .li-item .tit-20 {
padding: 8px .6rem;
}
.n-news .tit-14 {
color: #fff;
position: absolute;
bottom: 120px;
line-height: 1.5;
left: .6rem;
opacity: 0;
z-index: 2;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-news .ntit-20 {
color: #fff;
position: absolute;
z-index: 2;
bottom: .3rem;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-news .bottonbox {
height: 45px;
line-height: 45px;
display: block;
width: 130px;
position: absolute;
left: .6rem;
bottom: .3rem;
z-index: 2;
opacity: 0;
-webkit-transition: all .5s ease;
transition: all .5s ease;
-webkit-transform: translate(0, 60px);
-ms-transform: translate(0, 60px);
transform: translate(0, 60px);
box-shadow: inset 0px 0px 0px 2px #dcdddd;
}
.n-news .bottonbox p {
display: inline-block;
color: #fff;
position: relative;
z-index: 2;
}
.n-news .bottonbox p:before {
content: "";
position: absolute;
width: 25px;
height: 25px;
left: 0;
top: 50%;
margin-top: -12.5px;
}
.n-news .bottonbox:hover p {
color: #fff;
}
.n-news .hover_1:before {
z-index: 1;
background: #d00010;
width: 250px;
height: 120px;
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
-webkit-transform: translate(-50%, -50%) scale(0);
-ms-transform: translate(-50%, -50%) scale(0);
transform: translate(-50%, -50%) scale(0);
}
.n-news .hover_1:hover:before {
-webkit-transform: translate(-50%, -50%) scale(1);
-ms-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.n-news .li-item:hover .tit-14 {
opacity: 1;
}
.n-news .li-item:hover .bottonbox {
-webkit-transform: translate(0, 0%);
-ms-transform: translate(0, 0%);
transform: translate(0, 0%);
opacity: 1;
}
.n-news .li-item:hover .ntit-20 {
bottom: calc(50px + .3rem);
}
.n-news .wpage {
margin-top: 1rem;
border-top: 1px solid #efeeee;
}
.n-promotion .promotion-left {
width: 75%;
}
.n-promotion .promotion-left .promotion-list {
border-right: 1px solid #d7d7d7;
}
.n-promotion .promotion-left .li-item {
width: 48%;
margin-right: 2%;
margin-bottom: 2%;
}
.n-promotion .promotion-left .wpage {
width: 94%;
margin: 1.5rem auto 0;
}
.n-promotion .promotion-right {
width: 25%;
padding: 0 0 0 .75rem;
}
.n-promotion .promotion-right .tit {
margin-bottom: 12px;
}
.n-promotion .promotion-right .nli-img {
position: relative;
margin-bottom: 20px;
display: block;
}
.n-promotion .promotion-right .nli-img:last-child {
margin-bottom: 0;
}
.n-promotion .promotion-right .nli-img:before {
content: "";
position: absolute;
left: 0;
bottom: 0;
width: 100%;
height: 60%;
background: -webkit-linear-gradient(bottom, rgba(0, 0, 0, 0.8), transparent);
background: linear-gradient(to top, rgba(0, 0, 0, 0.8), transparent);
z-index: 1;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-promotion .promotion-right .p {
font-size: 14px;
color: #fff;
line-height: 1.6;
position: absolute;
bottom: .3rem;
width: 92%;
left: 4%;
z-index: 2;
}
.news-info-top {
height: 9.8rem;
position: relative;
z-index: 1;
background-repeat: no-repeat !important;
background-position: center top !important;
background-size: cover !important;
}
.news-info {
background: #f8f7f7;
padding-bottom: 5rem;
}
.news-info .top {
margin-bottom: 1.5rem;
position: relative;
}
.news-info .top .time {
margin-bottom: 10px;
}
.news-info .top .tit-30 {
width: 70%;
}
.news-info .top .news-title {
position: absolute;
right: 0;
top: 0;
}
.news-info .w1220 {
width: 1220px;
margin: 0 auto;
position: relative;
margin-top: -6rem;
z-index: 2;
}
.news-info .info-box {
min-height: 800px;
background: #fff;
padding: 1.75rem 0 2rem;
position: relative;
}
.news-info .info-box-left {
width: 75%;
padding: 0 1.25rem;
float: left;
border-right: 1px solid #e7e7e7;
}
.news-info .info-box-left .text {
line-height: 1.8;
padding-bottom: 3rem;
border-bottom: 1px solid #e7e7e7;
}
.news-info .info-box-left .text img{
margin:15px 0;
}
.news-info .info-box-left .bot {
padding-top: 1rem;
}
.news-info .info-box-left .bot a {
display: block;
color: #666;
margin-bottom: 10px;
padding-left: 10px;
position: relative;
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
-webkit-transition: all .3s ease;
transition: all .3s ease;
}
.news-info .info-box-left .bot a:before {
content: "";
position: absolute;
width: 5px;
height: 2px;
top: 50%;
left: 0;
margin-top: -1px;
background: #d3d3d3;
-webkit-transition: all .3s ease;
transition: all .3s ease;
}
.news-info .info-box-left .bot a:hover {
color: #e70012;
padding-left: 25px;
}
.news-info .info-box-left .bot a:hover:before {
background: #e70012;
width: 15px;
}
.news-info .info-box-right {
position: absolute;
right: 0;
width: calc((1220px * 0.25));
padding: 0 1rem;
}
.news-info .info-box-right .tit-title {
margin-bottom: 15px;
}
.news-info .info-box-right .li {
margin-bottom: 10px;
color: #666;
display: block;
}
.news-info .info-box-right .li:hover {
color: #e70012;
-webkit-transition: all .3s ease;
transition: all .3s ease;
}
.news-info .fx-news-left {
width: 30px;
left: -60px;
top: 4rem;
position: absolute;
}
.news-info .fx-news-left a {
margin: 0 auto;
width: 30px;
height: 30px;
padding: 0;
display: block;
float: none;
background-size: 30px 30px;
background-position: center center;
background-repeat: no-repeat;
}
.news-info .fx-news-left a + a {
margin-top: .6rem;
}
.news-info .fx-news-left .bds_tsina {
background-image: url(../images/share-sina.png);
}
.news-info .fx-news-left .bds_weixin {
background-image: url(../images/share-wx.png);
}
.news-info .fx-news-left .bds_qzone {
background-image: url(../images/share-qzone.png);
}
.news-info .fx-news-left .bds_more {
background-image: url(../images/share-more.png);
}
.news-info .info-box-right {
-webkit-transition: top .5s ease,bottom .5s ease;
transition: top .5s ease,bottom .5s ease;
}
.news-info .fx-news-left {
-webkit-transition: top .5s ease,bottom .5s ease;
transition: top .5s ease,bottom .5s ease;
}
.news-info .info-box-right.active {
position: fixed;
right: auto;
top: 3rem;
margin-left: calc(1220px - (1220px * 0.25));
}
.news-info .fx-news-left.active {
position: fixed;
left: auto;
top: 3rem;
margin-left: -60px;
}
.news-info .info-box-right.on {
position: absolute;
right: auto;
top: auto;
bottom: 2rem;
width: 320px;
margin-left: calc(1220px - 25%);
}
.news-info .fx-news-left.on {
position: absolute;
left: auto;
top: auto;
bottom: 2rem;
margin-left: -60px;
}
.n-derler {
position: relative;
height: 810px;
}
.n-derler #dituContent {
height: 810px;
width: 100%;
}
.n-derler #dituContent .BMapLabel {
display: none !important;
}
.n-derler #dituContent .BMap_Marker > div {
width: 45px !important;
height: 45px !important;
}
.n-derler #dituContent .BMap_Marker img {
max-width: 100%;
max-height: 100%;
margin-left: 0px !important;
margin-top: 0px !important;
}
.n-derler .mapbox {
width: 440px;
height: 660px;
position: absolute;
z-index: 2;
top: 60px;
left: 2rem;
background: #fff;
overflow: hidden;
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1)
/*.map-step1{
z-index: 3;
}*/
}
.n-derler .mapbox .top {
padding: 30px;
}
.n-derler .mapbox .top .city-info {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: baseline;
-webkit-align-items: baseline;
-ms-flex-align: baseline;
align-items: baseline;
position: relative;
}
.n-derler .mapbox .top .province-name {
padding-left: 35px;
background: url(../images/img10.png) no-repeat left center;
background-size: 19px 24px;
position: relative;
}
.n-derler .mapbox .top .province-name, .n-derler .mapbox .top .city-name {
font-size: 15px;
line-height: 24px;
display: block;
}
.n-derler .mapbox .top .city-name {
margin-left: 10px;
}
.n-derler .mapbox .top .city-change {
position: absolute;
font-size: 15px;
right: 0;
top: 0;
line-height: 24px;
display: block;
color: #e60012;
cursor: pointer;
}
.n-derler .mapbox .top .form-select {
width: 100%;
height: 50px;
line-height: 30px;
padding: 15px;
border: 1px solid #dadada;
margin-top: 20px;
}
.n-derler .mapbox .top .form-select .input1 {
width: calc(100% - 60px);
background: none;
border: none;
line-height: 20px;
font-size: 16px;
color: #666;
}
.n-derler .mapbox .top .form-select .input2 {
background: url(../images/search.png) no-repeat center;
width: 40px;
height: 20px;
border: none;
}
.n-derler .mapbox .top .p {
font-size: 15px;
line-height: 1.5;
color: #666;
margin-top: 15px;
}
.n-derler .mapbox .map-list {
width: 100%;
}
.n-derler .mapbox .map-list .li-item {
padding: 28px 30px 28px;
position: relative;
border-bottom: 1px solid #e0e7ec;
cursor: pointer;
}
.n-derler .mapbox .map-list .li-item .tit-name {
font-size: 18px;
line-height: 1.2;
color: #333;
margin-bottom: 10px;
font-weight: bold;
}
.n-derler .mapbox .map-list .li-item .tit-add {
margin-bottom: 5px;
}
.n-derler .mapbox .map-list .li-item .tit-add, .n-derler .mapbox .map-list .li-item .tit-tel {
font-size: 15px;
line-height: 1.5;
color: #666;
}
.n-derler .mapbox .map-list .li-item .distance {
position: absolute;
right: 10px;
top: 30px;
font-size: 14px;
line-height: 1.5;
color: #999;
}
.n-derler .mapbox .map-list .li-item:last-child {
border-bottom: none;
}
.n-derler .mapbox .map-list .map-list-item {
max-height: 410px;
}
.n-derler .mapbox .map-step {
position: absolute;
width: 440px;
height: 660px;
background: #fff;
left: 0;
top: 0;
}
.n-derler .mapbox .map-step2 .li-item {
padding: 28px 30px 28px;
position: relative;
cursor: pointer;
}
.n-derler .mapbox .map-step2 .li-item .tit-name {
font-size: 18px;
line-height: 1.2;
color: #333;
margin-bottom: 15px;
font-weight: bold;
}
.n-derler .mapbox .map-step2 .li-item .tit-p {
font-size: 15px;
line-height: 1.5;
color: #666;
margin-bottom: 8px;
}
.n-derler .mapbox .map-step2 .li-item .distance {
position: absolute;
right: 10px;
top: 30px;
font-size: 14px;
line-height: 1.5;
color: #999;
}
.n-derler .mapbox .map-step3 {
/*.province-list,.city-list{
position: absolute;
width: 100%;
height:486px;
bottom:46px;
}*/
}
.n-derler .mapbox .map-step1 {
z-index: 4;
}
.n-derler .mapbox .map-step2 {
z-index: 3;
}
.n-derler .mapbox .map-step3 {
z-index: 2;
}
.n-derler .mapbox .map-step4 {
z-index: 1;
}
.n-derler .mapbox .province-box, .n-derler .mapbox .city-box {
max-height: 480px;
}
.n-derler .mapbox .tit-title {
color: #333;
margin: 15px 0 0;
}
.n-derler .mapbox .tit-leb {
padding: 0 30px;
border-bottom: 1px solid #e0e7ec;
}
.n-derler .mapbox .tit-leb span {
line-height: 45px;
display: inline-block;
position: relative;
color: #333;
}
.n-derler .mapbox .tit-leb span:before {
content: "";
position: absolute;
width: 100%;
height: 3px;
background: #e60012;
bottom: 0px;
left: 0;
}
.n-derler .mapbox .tit-leb .s-city {
line-height: 45px;
height: 45px;
}
.n-derler .mapbox .p-item {
padding: 0 30px;
line-height: 55px;
height: 55px;
overflow: hidden;
font-size: 16px;
color: #888;
background: #fff;
position: relative;
border-bottom: 1px solid #e0e7ec;
cursor: pointer;
-webkit-transition: all .3s ease;
transition: all .3s ease;
}
.n-derler .mapbox .p-item p:before {
font-size: 12px;
color: #e60012;
position: absolute;
right: 25px;
-webkit-transition: all .3s ease;
transition: all .3s ease;
}
.n-derler .mapbox .p-item:hover {
background: #e60012;
color: #fff;
}
.n-derler .mapbox .p-item:hover p:before {
color:#fff;
right:15px;
}
.n-derler .mapbox .back-btn {
padding:30px 25px 15px 25px;
}
.n-derler .mapbox .back-btn .button {
padding-left: 18px;
font-size: 15px;
line-height: 20px;
position: relative;
cursor: pointer;
-webkit-transition: all .3s ease;
transition: all .3s ease;
}
.n-derler .mapbox .back-btn .button:before {
font-size: 12px;
left: 0;
position: absolute;
color: #333;
-webkit-transition: all .3s ease;
transition: all .3s ease;
}
.n-derler .mapbox .back-btn .button:hover {
color: #e60012;
}
.n-derler .mapbox .back-btn .button:hover:before {
color: #e60012;
}
.n-derler .mapbox .bot-btn {
padding: 0 30px;
width: 100%;
position: absolute;
bottom: 40px;
z-index: 1;
}
.n-derler .mapbox .bot-btn a {
height: 50px;
line-height: 50px;
text-align: center;
display: block;
position: relative;
background: #e60012;
}
.n-derler .mapbox .bot-btn a p {
position: relative;
z-index: 3;
color: #fff;
display: block;
}
.n-derler .mapbox .bot-btn2 {
bottom: 100px;
}
.n-derler .mapbox .bot-btn2 a {
background: #3d3d3d;
}
.n-derler .mapbox .bot-btn2 .hover_1:before {
background: #2d2d2d;
}
.n-derler .mapbox .hover_1:before {
z-index: 1;
background: #ad000d;
width: 400px;
height: 200px;
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
-webkit-transform: translate(-50%, -50%) scale(0);
-ms-transform: translate(-50%, -50%) scale(0);
transform: translate(-50%, -50%) scale(0);
}
.n-derler .mapbox .hover_1:hover:before {
-webkit-transform: translate(-50%, -50%) scale(1);
-ms-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.n-derler .mapbox .mCSB_scrollTools {
background: #f9f9f9;
}
.n-derler .mapbox .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background: #aaa !important;
width: 6px;
}
.n-derler .mapbox .mCSB_scrollTools .mCSB_draggerRail {
display: none !important;
}
.n-derler .mapbox .map-step1, .n-derler .mapbox .map-step2, .n-derler .mapbox .map-step3, .n-derler .mapbox .map-step4 {
-webkit-transition: all 1s cubic-bezier(0.85, -0.12, 0, 1);
transition: all 1s cubic-bezier(0.85, -0.12, 0, 1);
}
.n-derler .mapbox .map-step1.active {
-webkit-transform: translate(-100%, 0);
-ms-transform: translate(-100%, 0);
transform: translate(-100%, 0);
}
.n-derler .mapbox .map-step3.active {
-webkit-transform: translate(0%, 0);
-ms-transform: translate(0%, 0);
transform: translate(0%, 0);
}
.n-derler .mapbox .map-step3.on {
-webkit-transform: translate(-100%, 0);
-ms-transform: translate(-100%, 0);
transform: translate(-100%, 0);
}
.n-derler .mapbox .map-step4.active {
-webkit-transform: translate(0%, 0);
-ms-transform: translate(0%, 0);
transform: translate(0%, 0);
}
.n-derler .mapbox .map-step2.active {
-webkit-transform: translate(0%, 0);
-ms-transform: translate(0%, 0);
transform: translate(0%, 0);
}
.n-derler .mapbox .map-step2.on {
-webkit-transform: translate(-100%, 0);
-ms-transform: translate(-100%, 0);
transform: translate(-100%, 0);
}
.n-derler .mapbox .map-step2, .n-derler .mapbox .map-step3, .n-derler .mapbox .map-step4 {
-webkit-transform: translate(100%, 0);
-ms-transform: translate(100%, 0);
transform: translate(100%, 0);
}
.n-handbook {
background: #fff;
padding: 2rem 0 4.5rem;
}
.n-handbook .tabbox {
width: 1200px;
margin: 2rem auto 0;
}
.n-handbook .tabbox .select-step1 {
width: 48%;
padding-bottom: 20px;
line-height: 24px;
color: #777;
border-bottom: 1px solid #e8e8e8;
}
.n-handbook .tabbox .select-step1 .sp1 {
color: #777;
font-size: 18px;
margin-right: 20px;
text-transform: uppercase;
}
.n-handbook .tabbox .select-step1.cur {
color: #000;
}
.n-handbook .tabbox .select-step1.cur .sp1 {
color: #e60012;
}
.n-handbook .lista {
width: 1200px;
margin: 0 auto;
}
.n-handbook .carbox {
padding-top: 1.975rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
display: -webkit-flex;
-webkit-flex-flow: row wrap;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: stretch;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
border-bottom: 1px solid #ececec;
}
.n-handbook .carbox .li-item {
width: 22%;
margin-right: 4%;
margin-bottom: 1.8rem;
cursor: pointer;
display: block;
position: relative;
top: 0;
-webkit-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
}
.n-handbook .carbox .li-item .car-img {
position: relative;
left: 0;
-webkit-transition: all 0.3s 0.3s cubic-bezier(0.57, -0.24, 0.32, 1.13);
transition: all 0.3s 0.3s cubic-bezier(0.57, -0.24, 0.32, 1.13);
}
.n-handbook .carbox .li-item .car-img img {
max-width: 100%;
display: inline-block;
}
.n-handbook .carbox .li-item:hover {
top: -20px;
}
.n-handbook .carbox .li-item:hover .car-img {
left: -25px;
}
.n-handbook .carbox .li-item:nth-child(3n) {
margin-right: 0;
}
.n-handbook .car-item {
padding: 1.5rem 0 2rem;
border-bottom: 1px solid #ececec;
}
.n-handbook .car-item .tit {
color: #000;
line-height: 1;
margin-bottom: 1.25rem;
}
.n-handbook .car-item .car-left {
width: 280px;
}
.n-handbook .car-item .car-left img {
max-width: 100%;
display: inline-block;
}
.n-handbook .car-item .car-right {
width: calc(100% - 320px);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
display: -webkit-flex;
-webkit-flex-flow: row wrap;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: stretch;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
.n-handbook .car-item .car-right a {
display: block;
width: 23%;
text-align: center;
font-size: 16px;
line-height: 50px;
margin-right: 2.6%;
margin-bottom: 2.6%;
box-shadow: inset 0px 0px 0px 2px #ebebeb;
}
.n-handbook .car-item .car-right a p {
position: relative;
color: #000;
z-index: 2;
-webkit-transition: all .5s .1s ease;
transition: all .5s .1s ease;
}
.n-handbook .car-item .car-right .hover_1:before {
width: 250px;
height: 120px;
background: #373737;
-webkit-transform-origin: center right;
-ms-transform-origin: center right;
transform-origin: center right;
-webkit-transform: translate(-50%, -50%) scaleX(0);
-ms-transform: translate(-50%, -50%) scaleX(0);
transform: translate(-50%, -50%) scaleX(0);
-webkit-transition: -webkit-transform 0.6s cubic-bezier(0.85, -0.19, 0.41, 1.18);
transition: transform 0.6s cubic-bezier(0.85, -0.19, 0.41, 1.18);
}
.n-handbook .car-item .car-right a:nth-child(4n) {
margin-right: 0;
}
.n-handbook .car-item .car-right a:hover:before, .n-handbook .car-item .car-right a.cur:before {
-webkit-transform-origin: center left;
-ms-transform-origin: center left;
transform-origin: center left;
-webkit-transform: translate(-50%, -50%) scaleX(1);
-ms-transform: translate(-50%, -50%) scaleX(1);
transform: translate(-50%, -50%) scaleX(1);
}
.n-handbook .car-item .car-right a:hover p, .n-handbook .car-item .car-right a.cur p {
color: #fff;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-handbook .bot-href {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
margin: 1.9rem 0 auto;
}
.n-handbook .bot-href a {
display: block;
width: 200px;
text-align: center;
font-size: 14px;
line-height: 60px;
margin: 0 10px;
box-shadow: inset 0px 0px 0px 2px #373737;
}
.n-handbook .bot-href a p {
position: relative;
color: #000;
z-index: 2;
-webkit-transition: all .5s .1s ease;
transition: all .5s .1s ease;
}
.n-handbook .bot-href .hover_1:before {
width: 250px;
height: 120px;
background: #e80520;
-webkit-transform-origin: center right;
-ms-transform-origin: center right;
transform-origin: center right;
-webkit-transform: translate(-50%, -50%) scaleX(0);
-ms-transform: translate(-50%, -50%) scaleX(0);
transform: translate(-50%, -50%) scaleX(0);
-webkit-transition: -webkit-transform 0.6s cubic-bezier(0.85, -0.19, 0.41, 1.18);
transition: transform 0.6s cubic-bezier(0.85, -0.19, 0.41, 1.18);
}
.n-handbook .bot-href a:hover:before {
-webkit-transform-origin: center left;
-ms-transform-origin: center left;
transform-origin: center left;
-webkit-transform: translate(-50%, -50%) scaleX(1);
-ms-transform: translate(-50%, -50%) scaleX(1);
transform: translate(-50%, -50%) scaleX(1);
}
.n-handbook .bot-href a:hover p {
color: #fff;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.nav-car_buying {
width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
height: 66px;
line-height: 66px;
border-bottom: 1px solid #ececec;
}
.nav-car_buying a {
font-size: 16px;
color: #000;
margin: 0 1.25rem;
display: block;
position: relative;
-webkit-transition: all .3s ease;
transition: all .3s ease;
}
.nav-car_buying a:after {
height: 3px;
background: #d00010;
}
.nav-car_buying a:hover, .nav-car_buying a.cur {
color: #000;
font-weight: bold;
}
.nav-car_buying a:hover:after, .nav-car_buying a.cur:after {
-webkit-transform-origin: center left;
-ms-transform-origin: center left;
transform-origin: center left;
-webkit-transform: scaleX(1);
-ms-transform: scaleX(1);
transform: scaleX(1);
}
.n-car_buying .tit-h {
display: inline-block;
padding: 0 80px;
line-height: 1.5;
position: relative;
}
.n-car_buying .tit-h:before {
content: "";
position: absolute;
width: 35px;
height: 1px;
background: #e7e7e7;
left: 0;
top: 50%;
}
.n-car_buying .tit-h:after {
content: "";
position: absolute;
width: 30px;
height: 1px;
background: #e7e7e7;
right: 0;
top: 50%;
}
.n-car_buying .lista {
padding: 1.8rem 0;
background: #fff;
text-align: center;
}
.n-car_buying .lista .button-box {
width: 560px;
height: 100px;
margin: 1.5rem auto 0;
}
.n-car_buying .lista .button-box a {
width: 50%;
height: 100px;
display: inline-block;
float: left;
}
.n-car_buying .lista .button-box .button1 {
background: #e60012;
}
.n-car_buying .lista .button-box .button1 span {
background: url(../images/img11.png) no-repeat left center;
text-align: left;
height: 100px;
line-height: 100px;
}
.n-car_buying .lista .button-box .button1 .sp1 {
font-size: 14px;
line-height: 1.5;
color: #fff;
margin-top: 22px;
}
.n-car_buying .lista .button-box .button1 .sp2 {
font-size: 22px;
line-height: 1.5;
color: #fff;
}
.n-car_buying .lista .button-box .button2 {
background: #f7f7f7;
}
.n-car_buying .lista .button-box .button2 span {
background: url(../images/img11-1.png) no-repeat left center;
}
.n-car_buying .lista .button-box .button2 .sp1 {
font-size: 22px;
line-height: 100px;
color: #000;
}
.n-car_buying .lista .button-box span {
display: inline-block;
padding-left: 60px;
}
.n-car_buying .lista .p {
color: #444;
width: 820px;
margin: .8rem auto 0;
line-height: 2;
}
.n-car_buying .listb {
background: #f4f4f4;
padding: 2rem 0 3.5rem;
}
.n-car_buying .listb .tit-h:before {
background: #dadada;
}
.n-car_buying .listb .tit-h:after {
background: #dadada;
}
.n-car_buying .listb .eventbox {
width: 1380px;
margin: 1.75rem auto 0;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: row wrap;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: stretch;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
.n-car_buying .listb .eventbox .event-li {
width: 32%;
margin-right: 2%;
margin-bottom: 2%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: stretch;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
background: #fff;
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
}
.n-car_buying .listb .eventbox .event-li:nth-child(3n) {
margin-right: 0;
}
.n-car_buying .listb .eventbox .img {
height: 150px;
width: 50%;
background-size: cover;
background-position: 50% 50%;
background-repeat: no-repeat;
}
.n-car_buying .listb .eventbox .p-box {
padding: .75rem .6rem 10px;
color: #333;
width: 50%;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-car_buying .listb .eventbox .p-box .p-18 {
line-height: 1.5;
}
.n-car_buying .listb .event-li:hover .p-box {
color: #e60012;
}
.n-text_drive {
padding-top: 2.5rem;
position: relative;
}
.n-text_drive:before {
content: "";
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 25%;
background: -webkit-linear-gradient(rgba(0, 0, 0, 0.05), transparent);
background: linear-gradient(rgba(0, 0, 0, 0.05), transparent);
z-index: 1;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-text_drive .lista .carbox {
border-bottom: none;
}
.n-drive-two {
padding: 2.5rem 0;
position: relative;
}
.n-drive-two:before {
content: "";
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 25%;
background: -webkit-linear-gradient(rgba(0, 0, 0, 0.05), transparent);
background: linear-gradient(rgba(0, 0, 0, 0.05), transparent);
z-index: 1;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-drive-two .drive-form-box {
position: relative;
z-index: 2;
}
.n-drive-two .tabbox {
width: 1200px;
margin: 2rem auto 0;
}
.n-drive-two .tabbox .select-step1 {
width: 70px;
padding-bottom: 20px;
line-height: 24px;
color: #777;
border-bottom: 1px solid #e8e8e8;
}
.n-drive-two .tabbox .select-step1 .sp1 {
color: #777;
font-size: 18px;
text-transform: uppercase;
}
.n-drive-two .tabbox .select-step2 {
width: calc(100% - 110px);
padding-bottom: 20px;
line-height: 24px;
color: #777;
border-bottom: 1px solid #e8e8e8;
}
.n-drive-two .tabbox .select-step2 .sp1 {
color: #777;
font-size: 18px;
margin-right: 20px;
text-transform: uppercase;
}
.n-drive-two .tabbox .select-step2.cur {
color: #000;
}
.n-drive-two .tabbox .select-step2.cur .sp1 {
color: #e60012;
}
.n-drive-two .lista {
width: 1200px;
padding: 1.25rem 0;
margin: 0 auto;
border-bottom: 1px solid #ececec;
}
.n-drive-two .lista .stepbox {
width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: start;
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: flex-start;
}
.n-drive-two .lista .stepbox .sp1 {
width: 145px;
font-size: 16px;
color: #333;
line-height: 50px;
}
.n-drive-two .lista .input-step-box {
width: calc(100% - 145px);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: start;
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: flex-start;
}
.n-drive-two .lista .input-step-box .input-step {
padding: 5px 10px;
width: 32%;
margin-right: 2%;
border: 1px solid #dadada;
}
.n-drive-two .lista .input-step-box .input-step select {
background: none;
border: none;
width: 100%;
font-size: 16px;
color: #333;
height: 40px;
line-height: 40px;
}
.n-drive-two .lista .input-step-box .input-step:nth-child(3n) {
margin-right: 0;
}
.n-drive-two .lista .mapbox {
margin-top: 30px;
width: calc(100% - 145px);
margin-left: 145px;
}
.n-drive-two .lista .mapbox .button {
padding-left: 25px;
height: 30px;
line-height: 30px;
position: relative;
cursor: pointer;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-drive-two .lista .mapbox .button:before {
position: absolute;
left: 0;
font-size: 14px;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-drive-two .lista .mapbox .button.on {
color: #e60012;
}
.n-drive-two .lista .mapbox .button.on:before {
color: #e60012;
-webkit-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
transform: rotate(-180deg);
}
.n-drive-two .lista .mapbox .map-ditu {
height: 0px;
width: 100%;
overflow: hidden;
position: relative;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-drive-two .lista .mapbox .map-ditu.on {
height: 400px;
margin-bottom: 20px;
}
.n-drive-two .lista .mapbox #dituContent {
width: 100%;
height: 400px;
position: absolute;
left: 0;
top: 0;
}
.n-drive-two .lista .mapbox #dituContent .BMapLabel {
display: none !important;
}
.n-drive-two .lista .mapbox #dituContent .BMap_Marker > div {
width: 30px !important;
height: 30px !important;
}
.n-drive-two .lista .mapbox #dituContent .BMap_Marker img {
max-width: 100%;
max-height: 100%;
margin-left: 0px !important;
margin-top: 0px !important;
}
.n-drive-two .lista .mapbox #dituContent {
height: 400px;
}
.n-drive-two .listb {
width: 1200px;
padding: 1.25rem 0;
margin: 0 auto;
border-bottom: 1px solid #ececec;
}
.n-drive-two .listb .stepbox {
width: 100%;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: justify;
-webkit-justify-content: space-between;
-ms-flex-pack: justify;
justify-content: space-between;
-webkit-box-align: start;
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: flex-start;
}
.n-drive-two .listb .stepbox .sp1 {
width: 145px;
font-size: 16px;
color: #333;
line-height: 50px;
}
.n-drive-two .listb .input-step-box {
width: calc(100% - 145px);
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: start;
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: flex-start;
}
.n-drive-two .listb .input-step-box .input-step {
padding: 15px 10px;
width: 32%;
margin-right: 2%;
border: 1px solid #dadada;
}
.n-drive-two .listb .input-step-box .input-step select {
background: none;
border: none;
width: 100%;
font-size: 16px;
color: #333;
height: 20px;
line-height: 20px;
}
.n-drive-two .listb .input-step-box .input-step:nth-child(3n) {
margin-right: 0;
}
.n-drive-two .listb .input-step-box .input-step .input1 {
background: none;
border: none;
width: 100%;
font-size: 16px;
color: #333;
height: 20px;
line-height: 20px;
}
.n-drive-two input:-moz-placeholder {
color: #999 !important;
}
.n-drive-two input::-moz-placeholder {
color: #999 !important;
}
.n-drive-two input:-ms-input-placeholder {
color: #999 !important;
}
.n-drive-two input::-webkit-input-placeholder {
color: #999 !important;
}
.n-drive-two .drive-bot {
width: 1200px;
margin: 1.25rem auto 0;
}
.n-drive-two .drive-bot .ndrive-bot {
width: calc(100% - 145px);
margin-left: 145px
/*闅愯棌鎺夋垜浠ā鍨嬬殑checkbox*/
/*鏈€変腑鏃?/
/*閫変腑checkbox鏃?淇敼鑳屾櫙鍥剧墖鐨勪綅缃?/
}
.n-drive-two .drive-bot .ndrive-bot span {
color: #e60012;
cursor: pointer;
text-decoration: underline;
}
.n-drive-two .drive-bot .ndrive-bot .input2 {
appearance: none;
-webkit-appearance: none;
outline: none;
width: 18px;
height: 18px;
opacity: 0;
top: 3px;
position: relative;
z-index: 2;
margin-right: 15px;
}
.n-drive-two .drive-bot .ndrive-bot .input2 + span {
width: 18px;
height: 18px;
border: 1px solid #dfdfdf;
position: absolute;
left: 0;
/*margin-right:15px;*/
top: 3px;
z-index: 1;
}
.n-drive-two .drive-bot .ndrive-bot .input2:checked + span {
background: url(../images/img13.jpg) no-repeat center center;
}
.n-drive-two .drive-bot .ndrive-bot .bot-btn {
margin-top: 1.25rem;
width: 280px;
z-index: 1;
text-align: center;
}
.n-drive-two .drive-bot .ndrive-bot .bot-btn input {
background: none;
border: none;
display: block;
width: 100%;
line-height: 45px;
position: relative;
color: #fff;
z-index: 2;
}
.n-drive-two .drive-bot .ndrive-bot .bot-btn .submit {
height: 50px;
line-height: 50px;
text-align: center;
display: block;
position: relative;
background: #d00010;
}
.n-drive-two .drive-bot .ndrive-bot .bot-btn .submit p {
position: relative;
z-index: 3;
color: #fff;
display: block;
}
.n-drive-two .drive-bot .ndrive-bot .bot-btn .hover_1:before {
z-index: 1;
background: #ad000d;
width: 400px;
height: 200px;
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
-webkit-transform: translate(-50%, -50%) scale(0);
-ms-transform: translate(-50%, -50%) scale(0);
transform: translate(-50%, -50%) scale(0);
}
.n-drive-two .drive-bot .ndrive-bot .bot-btn .hover_1:hover:before {
-webkit-transform: translate(-50%, -50%) scale(1);
-ms-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.n-about .tit-h {
display: inline-block;
padding: 0 80px;
line-height: 1.5;
position: relative;
}
.n-about .tit-h:before {
content: "";
position: absolute;
width: 35px;
height: 1px;
background: #e7e7e7;
left: 0;
top: 50%;
}
.n-about .tit-h:after {
content: "";
position: absolute;
width: 30px;
height: 1px;
background: #e7e7e7;
right: 0;
top: 50%;
}
.n-about .lista {
padding: 1.75rem 0;
background: #fff;
}
.n-about .lista .about-text {
width: 1280px;
margin: 1rem auto 0;
line-height: 2;
}
.n-about .lista .about-text img {
margin: 0 auto;
display: block;
}
.n-about .lista .bot-tit .img1 {
margin: 1rem 0;
}
.n-about .lista .bot-tit p {
color: #000;
font-size: 26px;
line-height: 1.2;
}
.n-about .listb {
height: 19rem;
overflow: hidden;
position: relative;
background-size: cover;
}
.n-about .listb .tit-h {
left: 50%;
top: 1.8rem;
position: absolute;
z-index: 2;
-webkit-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
color: #fff;
}
.n-about .listb .tit-h:before, .n-about .listb .tit-h:after {
background: #183454;
}
.n-about .listb .text {
width: 550px;
position: absolute;
top: 5rem;
margin-left: 8rem;
z-index: 2;
}
.n-about .listb .text .tit1 {
display: inline-block;
background: #000;
font-size: 1.5rem;
line-height: 1;
padding: 5px;
background: #fff;
color: #07111b;
margin-bottom: 15px;
}
.n-about .listb .text .tit3 {
font-size: 13px;
margin-bottom: 12px;
}
.n-about .listb .slide-img {
height: 19rem;
background-position: center center;
background-position: no-repeat;
}
.n-about .listb .swiper-pagination {
bottom: 2rem;
margin-left: 8rem;
width: auto;
display: inline-block;
}
.n-about .listb .swiper-pagination .swiper-pagination-bullet {
width: 52px;
height: 4px;
margin: 0 10px;
border-radius: 0;
opacity: 1;
background: #fff;
-webkit-transform: scale(1, 0.5);
-ms-transform: scale(1, 0.5);
transform: scale(1, 0.5);
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-about .listb .swiper-pagination .swiper-pagination-bullet-active {
-webkit-transform: scale(1, 1);
-ms-transform: scale(1, 1);
transform: scale(1, 1);
background: #e60012;
}
.n-about .listc {
background: #f4f4f4;
padding: 1.75rem 0 4.5rem;
}
.n-about .listc .tit-h {
color: #000;
}
.n-about .listc .tit-h:before, .n-about .listc .tit-h:after {
background: #dadada;
}
.n-about .listc .img1 {
margin-top: 1.5rem;
}
.n-about .listc .img1 img {
display: inline-block;
-webkit-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
transform: rotate(-180deg);
}
.n-about .listc .ulbox {
position: relative;
width: 1260px;
margin: 0 auto;
min-height: 400px;
padding-bottom: 2rem;
}
.n-about .listc .ulbox:before {
content: "";
position: absolute;
left: 50%;
width: 1px;
margin-left: 0.5px;
height: 100%;
background: #e7e7e7;
top: 5px;
}
.n-about .listc .ulbox .li-item {
width: calc(50% + 10px);
height: 145px;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.n-about .listc .ulbox .li-item .img-text {
width: calc(100% - 145px);
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
display: -webkit-inline-box;
display: -webkit-inline-flex;
display: -ms-inline-flexbox;
display: inline-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
position: relative;
background: #fff;
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
}
.n-about .listc .ulbox .li-item .time {
width: 145px;
text-align: right;
padding-right: 30px;
position: relative;
}
.n-about .listc .ulbox .li-item .time:before {
content: "";
position: absolute;
top: 50%;
right: 5px;
width: 9px;
height: 9px;
margin-top: -4.5px;
background: #000;
border-radius: 50%;
}
.n-about .listc .ulbox .li-item .j {
width: 0;
height: 0;
position: absolute;
right: -10px;
top: 50%;
margin-top: -10px;
border-top: 10px solid transparent;
border-bottom: 10px solid transparent;
-webkit-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
transform: rotate(-180deg);
border-right: 10px solid #fff;
}
.n-about .listc .ulbox .li-item .text {
padding: 0 .5rem;
width: 50%;
font-size: 18px;
line-height: 1.5;
color: #333;
}
.n-about .listc .ulbox .li-item .img {
width: 50%;
height: 145px;
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}
.n-about .listc .ulbox .li-item:nth-child(2n) .time {
text-align: left;
padding-left: 30px;
}
.n-about .listc .ulbox .li-item:nth-child(2n) .time:before {
right: auto;
left: 5px;
}
.n-about .listc .ulbox .li-item:nth-child(2n) .j {
left: -10px;
right: auto;
-webkit-transform: rotate(0deg);
-ms-transform: rotate(0deg);
transform: rotate(0deg);
}
.n-about .listc .buttonbox {
cursor: pointer;
margin-top: 20px;
}
.n-about .listc .buttonbox span {
font-size: 14px;
line-height: 1.5;
color: #333;
position: relative;
padding-left: 25px;
}
.n-about .listc .buttonbox span:before {
position: absolute;
left: 0;
font-size: 14px;
color: #666;
}
.w1440 {
width: 1440px;
margin: 0 auto;
}
.configure-list {
background: #f6f6f6;
padding: 2.25rem 0;
position: relative;
z-index: 1;
}
.configure-list .car-list {
margin-top: 2rem;
position: relative;
padding: 0 2rem
/*overflow: hidden;*/
}
.configure-list .car-list .swiper-slide {
position: relative;
}
.configure-list .car-list .swiper-slide:before {
content: "";
position: absolute;
left: 0;
top: 30%;
width: 100%;
height: 70%;
background: -webkit-linear-gradient(rgba(222, 222, 222, 0.8), transparent);
background: linear-gradient(rgba(222, 222, 222, 0.8), transparent);
z-index: 1;
opacity: 0;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.configure-list .car-list .swiper-slide:hover .img {
top: -10px;
}
.configure-list .car-list .swiper-slide:hover:before {
opacity: 1;
}
.configure-list .car-list .img img {
max-width: 100%;
}
.configure-list .car-list .img, .configure-list .car-list .cat-text {
position: relative;
z-index: 2;
}
.configure-list .car-list .img {
top: 0;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.configure-list .car-list span {
display: block;
line-height: 1.6;
margin-bottom: 3px;
}
.configure-list .car-list .bottonbox {
margin-top: .6rem;
height: 45px;
line-height: 45px;
display: inline-block;
background: #313639;
width: 135px;
font-size: 14px;
z-index: 2;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.configure-list .car-list .bottonbox p {
display: inline-block;
color: #fff;
position: relative;
z-index: 2;
padding-right: 20px;
}
.configure-list .car-list .bottonbox p:before {
font-size: 12px;
color: #fff;
position: absolute;
right: 0;
}
.configure-list .car-list .hover_1:before {
z-index: 1;
background: #d00010;
width: 250px;
height: 120px;
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
-webkit-transform: translate(-50%, -50%) scale(0);
-ms-transform: translate(-50%, -50%) scale(0);
transform: translate(-50%, -50%) scale(0);
}
.configure-list .car-list .hover_1:hover:before {
-webkit-transform: translate(-50%, -50%) scale(1);
-ms-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.configure-list .car-list .swiper-button-next, .configure-list .car-list .swiper-button-prev {
background: none !important;
-webkit-transform-origin: center center;
-ms-transform-origin: center center;
transform-origin: center center;
opacity: 1;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.configure-list .car-list .swiper-button-next:before, .configure-list .car-list .swiper-button-next:after, .configure-list .car-list .swiper-button-prev:before, .configure-list .car-list .swiper-button-prev:after {
content: "";
position: absolute;
width: 20px;
height: 4px;
background: #3c3c3c;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.configure-list .car-list .swiper-button-next:before, .configure-list .car-list .swiper-button-prev:before {
-webkit-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
transform: rotate(-45deg);
-webkit-transform-origin: left 4px;
-ms-transform-origin: left 4px;
transform-origin: left 4px;
}
.configure-list .car-list .swiper-button-next:after, .configure-list .car-list .swiper-button-prev:after {
-webkit-transform: rotate(45deg);
-ms-transform: rotate(45deg);
transform: rotate(45deg);
-webkit-transform-origin: left top;
-ms-transform-origin: left top;
transform-origin: left top;
}
.configure-list .car-list .swiper-button-next {
-webkit-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
transform: rotate(-180deg);
margin-top: -55px;
-webkit-transform-origin: center center;
-ms-transform-origin: center center;
transform-origin: center center;
}
.configure-list .car-list .swiper-button-next:hover:before, .configure-list .car-list .swiper-button-next:hover:after, .configure-list .car-list .swiper-button-prev:hover:before, .configure-list .car-list .swiper-button-prev:hover:after {
background: #da3830;
}
.carnews-list {
background: #fff;
padding: 2rem 0 3.5rem;
overflow: hidden;
}
.carnews-list .news-list {
margin-top: 1.75rem;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row wrap;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: start;
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: flex-start;
}
.carnews-list .li-item {
width: 32%;
margin-right: 2%;
background: #f2f2f2;
display: block;
}
.carnews-list .li-item:nth-child(3n) {
margin-right: 0;
}
.carnews-list .li-text {
padding: .75rem .55rem;
}
.carnews-list .li-text .tit2 {
overflow: hidden;
text-overflow: ellipsis;
white-space: nowrap;
margin-bottom: 15px;
}
.carnews-list .bottonbox {
margin-top: .6rem;
height: 45px;
line-height: 45px;
display: inline-block;
width: 135px;
font-size: 14px;
z-index: 2;
color: #222;
box-shadow: inset 0px 0px 0px 2px #8d8e8f;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.carnews-list .bottonbox p {
display: block;
color: #333;
position: relative;
z-index: 2;
}
.carnews-list .bottonbox:hover p {
color: #fff;
}
.carnews-list .hover_1:before {
z-index: 1;
background: #d00010;
width: 250px;
height: 120px;
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
-webkit-transform: translate(-50%, -50%) scale(0);
-ms-transform: translate(-50%, -50%) scale(0);
transform: translate(-50%, -50%) scale(0);
}
.carnews-list .hover_1:hover:before {
-webkit-transform: translate(-50%, -50%) scale(1);
-ms-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.w1280 {
width: 1280px;
margin: 0 auto;
}
.n-dealer-recruit .col-1 {
color: #e91929;
}
.n-dealer-recruit .tit-h {
display: inline-block;
padding: 0 80px;
line-height: 1.5;
position: relative;
}
.n-dealer-recruit .tit-h:before {
content: "";
position: absolute;
width: 35px;
height: 1px;
background: #e7e7e7;
left: 0;
top: 50%;
}
.n-dealer-recruit .tit-h:after {
content: "";
position: absolute;
width: 30px;
height: 1px;
background: #e7e7e7;
right: 0;
top: 50%;
}
.n-dealer-recruit .list1 {
padding: 2rem 0;
}
.n-dealer-recruit .list1 .text {
margin-top: 1.2rem;
line-height: 30px;
}
.n-dealer-recruit .list2 {
background: url(../images/img25.jpg) no-repeat center;
background-size: cover;
padding: 2rem 0 3rem;
}
.n-dealer-recruit .list2 .tit {
margin-bottom: 1.25rem;
}
.n-dealer-recruit .list2 .img1 {
width: 610px;
}
.n-dealer-recruit .list2 .img2 {
width: 608px;
}
.n-dealer-recruit .list3 .top {
padding: 2rem 0;
background: #f4f4f4;
}
.n-dealer-recruit .list3 .top .p-16 {
line-height: 2;
color: #666;
}
.n-dealer-recruit .list3 .imgbox {
padding: 1.5rem 0;
background: #fff;
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
}
.n-dealer-recruit .list3 .img1 {
margin-bottom: 2rem;
width: 100%;
}
.n-dealer-recruit .list3 .img1 img {
max-width: 100%;
}
.n-dealer-recruit .list3 .img1 .tit {
margin-bottom: 0;
}
.n-dealer-recruit .list3 .tit {
margin-bottom: 1.2rem;
color: #343434;
text-align: center;
}
.n-dealer-recruit .list3 .botimg .img2 {
width: 643px;
}
.n-dealer-recruit .list3 .botimg .img3 {
width: 564px;
}
.n-dealer-recruit .list4 {
background: #f8f8fb;
padding: 2rem 0 2.5rem;
}
.n-dealer-recruit .list4 .tit {
margin-bottom: .2rem;
color: #343434;
text-align: center;
}
.n-dealer-recruit .list4 .p-15 {
font-size: 15px;
line-height: 1.8;
color: #444;
margin-bottom: 1.5rem;
}
.n-dealer-recruit .list4 .img-item .img2 {
width: 550px;
}
.n-dealer-recruit .list4 .img-item .img3 {
width: 611px;
}
.n-dealer-recruit .list5 {
padding: 2.5rem 0;
background: url(../images/img29.jpg) no-repeat center;
background-size: cover;
}
.n-dealer-recruit .list5 .itembox {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: stretch;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
.n-dealer-recruit .list5 .li-item {
width: 23%;
margin-right: 2.6%;
background: #f1f1f1;
padding: 1.15rem 1.5rem;
position: relative;
}
.n-dealer-recruit .list5 .li-item:before {
content: "";
position: absolute;
width: 100%;
height: 3px;
bottom: 0;
left: 0;
}
.n-dealer-recruit .list5 .li-item:nth-child(1):before {
background: #ffcfd3;
}
.n-dealer-recruit .list5 .li-item:nth-child(2):before {
background: #ff848e;
}
.n-dealer-recruit .list5 .li-item:nth-child(3):before {
background: #ed4855;
}
.n-dealer-recruit .list5 .li-item:nth-child(4):before {
background: #e60012;
}
.n-dealer-recruit .list5 .tit1 {
color: #e60012;
line-height: 1.2;
margin-bottom: .5rem;
font-family: "BEBAS";
}
.n-dealer-recruit .list5 .tit2 {
line-height: 1.2;
margin-bottom: .2rem;
}
.n-dealer-recruit .list5 .tit3 {
margin-bottom: 1rem;
}
.n-dealer-recruit .list5 .tit4 {
margin-bottom: 10px;
}
.n-dealer-recruit .list5 .tit5 {
margin-bottom: 5px;
}
.n-dealer-recruit .list5 .li-item:nth-child(4n) {
margin-right: 0;
}
.n-dealer-recruit .list6 {
padding: 2rem 0;
background: #fff;
}
.n-dealer-recruit .list6 .tit-24 {
color: #222;
margin-bottom: 15px;
}
.n-dealer-recruit .list6 .p-16 {
line-height: 32px;
}
.n-dealer-recruit .list7 {
background: #f8f8fb;
padding: 2rem 0 2.35rem;
}
.n-dealer-recruit .list7 .tit {
margin-bottom: 2rem;
color: #343434;
text-align: center;
}
.n-dealer-recruit .list7 .p-15 {
font-size: 15px;
line-height: 1.8;
color: #444;
margin-bottom: 1.5rem;
}
.n-dealer-recruit .list7 .img-item .img2 {
width: 569px;
}
.n-dealer-recruit .list7 .img-item .img3 {
width: 564px;
}
.n-dealer-recruit .list8 {
background: url(../images/img31.jpg) no-repeat center;
padding: 3.5rem 0 3.95rem;
background-size: cover;
}
.n-dealer-recruit .list8 .tit-32 {
padding-bottom: .6rem;
position: relative;
}
.n-dealer-recruit .list8 .tit-32:before {
content: "";
position: absolute;
width: 30px;
left: 50%;
margin-left: -15px;
background: #333;
height: 2px;
bottom: 0;
}
.n-dealer-recruit .list9 {
padding: 2rem 0;
}
.n-dealer-recruit .list9 .p-16 {
width: 90%;
margin-top: .3rem;
}
.n-dealer-recruit .list9 .ulbox {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
margin-top: 1.8rem;
}
.n-dealer-recruit .list9 .leftbox {
width: 26%;
height: 195px;
padding-top: 56px;
text-align: center;
background: #e91929;
}
.n-dealer-recruit .list9 .rightbox {
width: 74%;
height: 195px;
position: relative;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row wrap;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.n-dealer-recruit .list9 .li-item {
width: 19.5%;
height: 96px;
margin-left: 0.5%;
margin-bottom: 0.5%;
background: #eaedf3;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row wrap;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.n-dealer-recruit .list9 .li-item p {
display: block;
width: 100%;
text-align: center;
line-height: 1.4;
}
.n-dealer-recruit .list9 .table1 {
margin-top: 2rem;
border: 1px solid #edeef1;
}
.n-dealer-recruit .list9 .table1 table {
width: 100%;
}
.n-dealer-recruit .list9 .table1 th {
background: #f8f8fb;
line-height: 70px;
padding: 0 .75rem;
font-size: 16px;
color: #000;
font-weight: bold;
width: 100%;
text-align: left;
}
.n-dealer-recruit .list9 .table1 td {
width: 100%;
font-size: 15px;
line-height: 60px;
color: #333;
text-align: left;
padding: 0 .75rem;
border-top: 1px solid #edeef1;
}
.n-dealer-recruit .list9 .table2 {
margin-top: 2rem;
}
.n-dealer-recruit .list9 .table2 .tit1 {
margin-bottom: .6rem;
}
.n-dealer-recruit .list9 .table2 table {
width: 100%;
border: 1px solid #edeef1;
}
.n-dealer-recruit .list9 .table2 th {
background: #f8f8fb;
line-height: 70px;
font-size: 16px;
color: #000;
font-weight: bold;
text-align: center;
}
.n-dealer-recruit .list9 .table2 td {
font-size: 15px;
line-height: 60px;
color: #333;
text-align: center;
border-top: 1px solid #edeef1;
}
.n-dealer-recruit .list9 .table3 {
margin-top: 2rem;
}
.n-dealer-recruit .list9 .table3 .tit1 {
margin-bottom: .6rem;
}
.n-dealer-recruit .list9 .table3 table {
width: 100%;
border: 1px solid #edeef1;
}
.n-dealer-recruit .list9 .table3 th {
background: #f8f8fb;
line-height: 70px;
font-size: 16px;
color: #000;
font-weight: bold;
text-align: center;
}
.n-dealer-recruit .list9 .table3 td {
font-size: 15px;
line-height: 60px;
color: #333;
text-align: center;
border-top: 1px solid #edeef1;
}
.n-dealer-recruit .list10 {
background: #2d2d2d;
padding: 1.6rem 0;
}
.n-dealer-recruit .list10 .tit-24 {
margin-bottom: .2rem;
}
.n-dealer-recruit .list11 {
padding: 1.8rem 0;
background: #ececef;
}
.n-dealer-recruit .list11 .tit1 {
padding-bottom: 20px;
margin-bottom: 1.5rem;
border-bottom: 1px solid #d9d4d6;
}
.n-dealer-recruit .list11 .p-15 {
color: #666;
margin-bottom: 1.2rem;
line-height: 28px;
}
.n-dealer-recruit .list11 .left {
width: 46%;
}
.n-dealer-recruit .list11 .left img {
max-width: 100%;
}
.n-dealer-recruit .list11 .right {
width: 50%;
}
.n-dealer-recruit .list11 .right img{
max-width:100%;
}
.n-dealer-recruit .list11 .right .tit2 {
margin-top: 10px;
margin-bottom: 10px;
}
.n-dealer-recruit .list11 .right .p-15 {
width: 90%;
}
.n-dealer-recruit .list12 {
background: #fff;
padding: 2rem 0;
}
.n-dealer-recruit .list12 .tit1, .n-dealer-recruit .list12 .tit2 {
color: #222;
}
.n-dealer-recruit .list12 .p {
margin-top: 10px;
line-height: 2;
}
.n-dealer-recruit .list12 .tit2 {
margin: 1.25rem 0 2rem;
}
.n-dealer-recruit .list12 .img1 {
padding-bottom: 1.5rem;
max-width: 100%;
}
.n-dealer-recruit .list13 {
/*background: url(../images/img34.jpg) no-repeat center;*/
/*padding: 3.5rem 0 3.95rem;*/
background:none;
padding:2rem 0 0px;
/*background-size: cover;*/
}
.n-dealer-recruit .list14 {
padding: 2rem 0;
background: #fff;
}
.n-dealer-recruit .list14 .tit1, .n-dealer-recruit .list14 .tit2 {
color: #222;
}
.n-dealer-recruit .list14 .col-1 {
font-weight: bold;
margin-right: 5px;
font-family: "BEBAS";
}
.n-dealer-recruit .list14 .ulbox {
margin-top: 1.75rem;
}
.n-dealer-recruit .list14 .ulbox .li-item {
overflow: hidden;
}
.n-dealer-recruit .list14 .ulbox .li-item:last-child .text {
border-bottom: 1px solid #dbdbdb;
}
.n-dealer-recruit .list14 .ulbox .img {
width: 218px;
}
.n-dealer-recruit .list14 .ulbox .text {
width: calc(100% - 270px);
padding: .55rem 3rem 1.25rem 0;
border-top: 1px solid #dbdbdb;
position: relative;
min-height: 160px;
}
.n-dealer-recruit .list14 .ulbox .tit2 {
line-height: 2;
}
.n-dealer-recruit .list14 .ulbox .tit-14 {
color: #9c9c9c;
margin-top: 10px;
}
.n-dealer-recruit .list14 .ulbox .su {
position: absolute;
font-size: 2.55rem;
line-height: 1.1;
color: #eff5fa;
right: 1rem;
bottom: -15px;
font-family: "BEBAS";
font-style: italic;
}
.n-dealer-recruit .list15 {
padding: 2.5rem 0 2.25rem;
background: #f2f2f5;
}
.n-dealer-recruit .list15 .tit1, .n-dealer-recruit .list15 .tit2 {
color: #222;
}
.n-dealer-recruit .list15 .col-1 {
font-weight: bold;
margin-right: 5px;
font-family: "BEBAS";
}
.n-dealer-recruit .list15 .img {
margin-top: 1.8rem;
}
.n-dealer-recruit .list15 .img img {
max-width: 100%;
}
.n-dealer-recruit .list15 .bot {
margin-top: 1.25rem;
}
.n-dealer-recruit .list15 .bot .li-warp {
width: 50%;
float: left;
text-align: center;
}
.n-dealer-recruit .list15 .bot .sp1 {
padding-left: 40px;
}
.n-dealer-recruit .list15 .bot .li-warp:nth-child(1) {
position: relative;
}
.n-dealer-recruit .list15 .bot .li-warp:nth-child(1):before {
content: "";
position: absolute;
width: 1px;
height: 16px;
top: 50%;
right: 0;
background: #d2d7dd;
margin-top: -8px;
}
.n-dealer-recruit .list15 .bot .li-warp:nth-child(1) .sp1 {
background: url(../images/img18.png) no-repeat left center;
background-size: 25px 25px;
}
.n-dealer-recruit .list15 .bot .li-warp:nth-child(2) .sp1 {
background: url(../images/img18-1.png) no-repeat left center;
background-size: 25px 25px;
}
.n-dealer-recruit .list16 {
padding: 2rem 0;
background: #fff;
}
.n-dealer-recruit .list16 .tit1 {
color: #222;
}
.n-dealer-recruit .list16 .col-1 {
font-weight: bold;
margin-right: 5px;
font-family: "BEBAS";
}
.n-dealer-recruit .list16 .img1 {
max-width: 100%;
display: block;
margin: 1.25rem auto 0;
}
.n-dealer-recruit .list17 {
padding: 2rem 0 2.5rem;
background: #f8f8fb;
position: relative;
z-index: 1;
}
.n-dealer-recruit .list17 .tit1 {
color: #222;
}
.n-dealer-recruit .list17 .col-1 {
font-weight: bold;
margin-right: 5px;
font-family: "BEBAS";
}
.n-dealer-recruit .list17 .wimgbox {
position: relative;
}
.n-dealer-recruit .list17 .imgbox {
position: relative;
width: 85%;
overflow: hidden;
height: 535px;
margin: 1.25rem auto 0;
}
.n-dealer-recruit .list17 .imgbox .swiper-slide {
text-align: center;
-webkit-transform: scale(1, 1);
-ms-transform: scale(1, 1);
transform: scale(1, 1);
z-index: 1;
opacity: .5;
-webkit-transition: -webkit-transform .5s ease,opacity .5s ease;
transition: transform .5s ease,opacity .5s ease;
}
.n-dealer-recruit .list17 .imgbox .swiper-slide img {
margin-top: 90px;
width: 100%;
display: inline-block;
}
.n-dealer-recruit .list17 .imgbox .swiper-slide.swiper-slide-active {
-webkit-transform: scale(1.3, 1.3);
-ms-transform: scale(1.3, 1.3);
transform: scale(1.3, 1.3);
opacity: 1;
z-index: 2;
-webkit-transition: -webkit-transform .5s ease;
transition: transform .5s ease;
}
.n-dealer-recruit .list17 .imgbox .swiper-slide.swiper-slide-active img {
margin-top: 80px;
}
.n-dealer-recruit .list17 .swiper-button-next, .n-dealer-recruit .list17 .swiper-button-prev {
width: 60px;
height: 60px;
border-radius: 50%;
border: 1px solid #828282;
background: none;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-dealer-recruit .list17 .swiper-button-next:before, .n-dealer-recruit .list17 .swiper-button-prev:before {
position: absolute;
font-size: 24px;
width: 52px;
left: 0;
top: 0;
height: 60px;
color: #222;
text-align: center;
line-height: 57px;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-dealer-recruit .list17 .swiper-button-next:before {
width: 60px;
line-height: 60px;
-webkit-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
transform: rotate(-180deg);
}
.n-dealer-recruit .list17 .swiper-button-next:hover, .n-dealer-recruit .list17 .swiper-button-prev:hover {
background: #dd2038;
border: 1px solid #dd2038;
}
.n-dealer-recruit .list17 .swiper-button-next:hover:before, .n-dealer-recruit .list17 .swiper-button-prev:hover:before {
color: #fff;
}
.car-nav-warp {
position: relative;
height: 78px;
background: #fff;
}
.car-info-nav {
height: 78px;
line-height: 78px;
border-bottom: 1px solid #e6e6e7;
padding: 0 45px;
background: #fff;
}
.car-info-nav .car-name {
padding-right: .75rem;
font-size: 16px;
color: #222;
font-weight: bold;
position: relative;
}
.car-info-nav .car-name:before {
content: "";
position: absolute;
width: 1px;
height: 32px;
top: 50%;
right: 0;
-webkit-transform: translate(0%, -50%);
-ms-transform: translate(0%, -50%);
transform: translate(0%, -50%);
background: #b2b2b2;
}
.car-info-nav .itembox {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: start;
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: flex-start;
margin-left: 1rem;
}
.car-info-nav .item-li {
font-size: 14px;
color: #747c83;
cursor: pointer;
margin-right: .5rem;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.car-info-nav .item-li:hover, .car-info-nav .item-li.cur {
color: #222;
}
.car-info-nav .back-button {
width: 135px;
height: 40px;
line-height: 40px;
border-radius: 40px;
background: none;
margin-top: 19px;
}
.car-info-nav .back-button p {
position: relative;
color: #333;
font-size: 16px;
z-index: 2;
padding-left: 40px;
display: inline-block;
position: relative;
-webkit-transition: .3s ease;
transition: .3s ease;
}
.car-info-nav .back-button p:before {
content: "";
position: absolute;
left: 0;
width: 20px;
height: 40px;
background: url(../images/img25.png) no-repeat center;
background-size: 17px auto;
}
.car-info-nav .back-button:hover p {
color: #e40013;
}
.car-info-nav .back-button:hover p:before {
-webkit-animation: toTopFromBottom 0.3s forwards;
animation: toTopFromBottom 0.3s forwards;
}
.car-info-nav .drive-button {
width: 135px;
height: 40px;
line-height: 40px;
border-radius: 40px;
background: #000;
margin-top: 19px;
}
.car-info-nav .drive-button p {
position: relative;
color: #fff;
font-size: 14px;
z-index: 2;
}
.car-info-nav .car-price {
margin-right: .5rem;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: start;
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: flex-start;
}
.car-info-nav .hover_1:before {
z-index: 1;
background: #d00010;
width: 300px;
height: 200px;
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
-webkit-transform: translate(-50%, -50%) scale(0);
-ms-transform: translate(-50%, -50%) scale(0);
transform: translate(-50%, -50%) scale(0);
}
.car-info-nav .hover_1:hover:before {
-webkit-transform: translate(-50%, -50%) scale(1);
-ms-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.car-info-nav .car-price strong {
line-height: 78px;
margin: 0 5px;
}
.car_model .lista {
padding: 2rem 0;
background: #f5f5f5;
}
.car_model .lista .tit1 {
margin-bottom: .8rem;
}
.car_model .lista .ultab {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.car_model .lista .ultab .li {
font-size: 16px;
line-height: 24px;
color: #747c83;
padding: 0 24px;
position: relative;
cursor: pointer;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.car_model .lista .ultab .li:before {
content: "";
position: absolute;
right: 0;
top: 50%;
margin-top: -8px;
width: 1px;
height: 16px;
background: #9c9c9c;
}
.car_model .lista .ultab .li:nth-child(2):before {
display: none;
}
.car_model .lista .ultab .li:hover, .car_model .lista .ultab .li.cur {
color: #222;
}
.car_model .lista .color-box {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
margin-top: .75rem;
position: relative;
z-index: 2;
}
.car_model .lista .color-box .color-li {
width: 26px;
height: 26px;
margin: 0 12px;
border-radius: 50%;
box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
cursor: pointer;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.car_model .lista .color-box .color-li.cur, .car_model .lista .color-box .color-li:hover {
box-shadow: 0px 0px 0px 5px #e9e9e9;
}
.car_model .lista .trim-tab {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
margin-top: .75rem;
}
.car_model .lista .trim-tab .li {
font-size: 16px;
line-height: 24px;
color: #747c83;
padding: 0 24px;
position: relative;
cursor: pointer;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.car_model .lista .trim-tab .li:before {
content: "";
position: absolute;
right: 0;
top: 50%;
margin-top: -8px;
width: 1px;
height: 16px;
background: #9c9c9c;
}
.car_model .lista .trim-tab .li:nth-child(2):before {
display: none;
}
.car_model .lista .trim-tab .li:hover, .car_model .lista .trim-tab .li.cur {
color: #222;
}
.car_model .lista .car-imgbox .ulimg {
width: 1400px;
height: 640px;
margin: 0 auto;
position: relative;
text-align: center;
background: url(../images/img19.png) no-repeat center bottom;
}
.car_model .lista .car-imgbox .ulimg .car-name {
font-size: 10.5rem;
line-height: 1.05;
position: absolute;
font-weight: bold;
left: 50%;
top:-1.5rem;
/*font-style: italic;*/
background: -webkit-linear-gradient(bottom, #e0e0e0, transparent 80%);
background: linear-gradient(to top, #e0e0e0, transparent 80%);
-webkit-background-clip: text;
color: transparent;
z-index: 1;
-webkit-transform: translate(-50%, 0) skew(-20deg);
-ms-transform: translate(-50%, 0) skew(-20deg);
transform: translate(-50%, 0) skew(-20deg);
}
.car_model .lista .car-imgbox .ulimg #carimg {
display: inline-block;
position: relative;
z-index: 2;
}
.car_model .lista .car-imgbox .trimbox-warp {
width: 1400px;
height: 640px;
margin: 1.5rem auto 0;
position: relative;
}
.car_model .lista .car-imgbox #panoramaConianer {
overflow: hidden;
width: 100%;
height: 600px;
}
.car_model .tit-title {
margin-bottom: .5rem;
}
.car_model .tit-title2 {
color: #666;
line-height: 1.5;
}
.car_model .list1 {
padding: 2.5rem 0 2rem;
background: #efefef url(../images/img41.jpg) no-repeat center bottom;
background-size: cover;
height: 23.6rem;
}
.car_model .list1 .itembox {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.car_model .list1 .itembox .li-item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
position: relative;
color: #888;
padding: 0 24px;
}
.car_model .list1 .itembox .li-item img {
margin-right: 8px;
}
.car_model .list1 .itembox .li-item:before {
content: "";
position: absolute;
right: 0;
top: 50%;
margin-top: -16px;
width: 1px;
height: 32px;
background: url(../images/img20-4.png) no-repeat center top;
}
.car_model .list1 .itembox .li-item:nth-child(3n):before {
display: none;
}
.car_model .list2 {
background: #fff;
padding: 1.5rem 0;
}
.car_model .list2 .tit-title {
margin-bottom: 0;
}
.car_model .list2 .img {
margin-top: 1rem;
}
.car_model .list2 .img img {
max-width: 100%;
}
.car_model .list3 {
padding: 2.25rem 0 2rem;
background: url(../images/img42.jpg) no-repeat center bottom;
background-size: cover;
height: 19.8rem;
}
.car_model .list3 .tit-title {
margin-bottom: .3rem;
color: #fff;
}
.car_model .list3 .tit-title2 {
color: #fff;
opacity: .5;
}
.car_model .list3 .img {
margin-top: 1rem;
text-align: center;
}
.car_model .list3 .img img {
max-width: 100%;
display: inline-block;
}
.car_model .list4 {
background: #fff;
padding-top: 1.75rem;
}
.car_model .list4 .tit-title {
margin-bottom: 1.5rem;
}
.car_model .list4 .imgbox img {
width: 49.7%;
}
.car_model .list5 {
padding: 2rem 0 0;
background: #fff;
}
.car_model .list5 .tit-title {
margin-bottom: 1rem;
}
.car_model .list5 .libox {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.car_model .list5 .li-item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: column nowrap;
-ms-flex-flow: column nowrap;
flex-flow: column nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
position: relative;
color: #888;
margin: 0 14px;
height: 3.75rem;
width: 190px;
padding: 0 10px;
border: 1px solid #53c1f6;
border-radius: 3px;
}
.car_model .list5 .li-item img {
margin-right: 8px;
}
.car_model .list5 .li-item .img {
display: block;
width: 100%;
margin-bottom: 5px;
}
.car_model .list5 .li-item .tit1, .car_model .list5 .li-item .tit2 {
width: 100%;
display: block;
}
.car_model .list5 .img1 {
width: 100%;
margin-top: 3rem;
}
.car_model .list5 .img1 img {
width: 100%;
}
.car_model .list6 {
padding: 2.75rem 0 2rem;
background: url(../images/img50.jpg) no-repeat center center;
background-size: cover;
}
.car_model .list6 .tit-title {
margin-bottom: .7rem;
}
.car_model .list6 .li-box {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
}
.car_model .list6 .li-box .li-item {
margin: 0 20px;
}
.car_model .list6 .carinfo-img {
margin-top: 3rem;
text-align: center;
}
.car_model .list6 .carinfo-img img {
max-width: 100%;
display: inline-block;
}
.car_model .list6 .bot-li {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
margin-top: 1.25rem;
}
.car_model .list6 .bot-li .img {
margin-right: .5rem;
}
.car_model .list6 .bot-li .li {
padding: 0 1.5rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
border-right: 1px solid rgba(73, 125, 195, 0.5);
}
.car_model .list6 .bot-li .li:nth-child(4n) {
border-right: none;
}
.car_model .list6 .car-button {
display: block;
cursor: pointer;
margin: 1.25rem auto 0;
box-shadow: inset 0px 0px 0px 2px #fff;
}
.car_model .list6 .car-button p {
display: inline-block;
padding-right: 20px;
position: relative;
}
.car_model .list6 .car-button p:before {
position: absolute;
right: 0;
font-size: 14px;
-webkit-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
transform: rotate(-180deg);
}
.car_model .list7 {
padding: 2rem 0;
background: url(../images/img49.jpg) no-repeat center bottom;
background-size: cover;
height: 20.5rem;
}
.car_model .list7 .tit-title {
margin-bottom: .2rem;
}
.car_model .list7 .img {
width: 90%;
text-align: center;
margin: 1.25rem auto 0;
}
.car_model .list7 .img img {
max-width: 100%;
display: inline-block;
}
.car_model .list8 {
padding: 2.25rem 0 2rem;
background: url(../images/img54.jpg) no-repeat center center;
background-size: cover;
}
.car_model .list8 .tit-title {
margin-bottom: .3rem;
}
.car_model .list8 .carinfo-img {
margin-top: 5rem;
text-align: center;
}
.car_model .list8 .carinfo-img img {
max-width: 100%;
display: inline-block;
}
.car_model .list8 .bot-li {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
margin-top: .75rem;
}
.car_model .list8 .bot-li .img {
text-align: center;
}
.car_model .list8 .bot-li .li {
padding: 0 1.5rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: column wrap;
-ms-flex-flow: column wrap;
flex-flow: column wrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
border-right: 1px solid rgba(238, 117, 125, 0.5);
}
.car_model .list8 .bot-li .li:last-child {
border-right: none;
}
.car_model .list9 {
background: url(../images/img55.jpg) no-repeat center center;
background-size: cover;
padding: 2.25rem 0 2rem;
}
.car_model .list9 .tit-title2 {
color: #fff;
}
.car_model .list9 .libox {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
margin-top: 9.5rem;
}
.car_model .list9 .li-item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: column nowrap;
-ms-flex-flow: column nowrap;
flex-flow: column nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
position: relative;
color: #888;
margin: 0 14px;
height: 4.5rem;
width: 200px;
padding: 0 10px;
border: 1px solid rgba(255, 255, 255, 0.3);
border-radius: 8px;
}
.car_model .list9 .li-item .img {
display: block;
width: 100%;
margin-bottom: .5rem;
}
.car_model .list9 .li-item .tit1, .car_model .list9 .li-item .tit2 {
width: 100%;
display: block;
}
.car_model .list10 {
background: #fff;
padding: 2rem 0 3rem;
}
.car_model .list10 .tit-title {
margin-bottom: 0;
}
.car_model .list10 .w1600 {
width: 1600px;
margin: 0 auto;
}
.car_model .list10 .img {
margin-top: 1rem;
width: 100%;
}
.car_model .list10 .img img {
max-width: 100%;
}
.car_model .list11 {
background: url(../images/img58.jpg) no-repeat center center;
height: 21rem;
background-size: cover;
padding: 2.15rem 0 0;
}
.car_model .list11 .tit-title {
margin-bottom: 1.5rem;
}
.car_model .list11 .bot-li {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
margin-top: 1.25rem;
}
.car_model .list11 .bot-li .img {
margin-right: .5rem;
}
.car_model .list11 .bot-li .li {
padding: 0 1.5rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
border-right: 1px solid rgba(255, 255, 255, 0.5);
}
.car_model .list11 .bot-li .li:last-child {
border-right: none;
}
.car_model .list11 .bot-li .tit2 {
text-align: left;
}
.car_model .list12 {
background:#f5f5f5 url(../images/img33.png) no-repeat center center;
background-size: cover;
padding: 8rem 0;
}
.car_model .list12 .text .tit-title, .car_model .list12 .text .tit-title2 {
line-height: 1;
color: #fff;
}
.car_model .list12 .li-item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
margin-top: 2.5rem;
}
.car_model .list12 .li-item .li {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: column nowrap;
-ms-flex-flow: column nowrap;
flex-flow: column nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
position: relative;
color: #888;
margin: 0 20px;
height: 170px;
width: 170px;
padding: 0 10px;
border: 1px solid rgba(255, 255, 255, 0.3);
border-radius: 8px;
}
.car_model .list12 .li-item .li .img {
display: block;
width: 100%;
margin-bottom: .5rem;
}
.car_model .list12 .li-item .li .tit1, .car_model .list12 .li-item .li .tit2 {
width: 100%;
display: block;
}
.car_model .list12 .li-item .li:nth-child(1) {
margin-left: 0;
}
.car_model .list13 {
padding: 3.25rem 0;
background: url(../images/img63.jpg) no-repeat center center;
background-size: cover;
height: 21.5rem;
position: relative;
}
.car_model .list13 .w1350 {
width: 1350px;
margin: 0 auto;
}
.car_model .list13 .tit-title, .car_model .list13 .tit-title2 {
color: #fff;
line-height: 1;
}
.car_model .list13 .car-img {
position: absolute;
right: 20px;
bottom: 25px;
width: 14rem;
}
.car_model .list14 {
padding: 2.25rem 0 7.5rem;
position: relative;
}
.car_model .list14 .tit-title2, .car_model .list14 .tit-title {
color: #fff;
position: relative;
z-index: 2;
}
.car_model .list14 .carbg-list {
position: absolute;
height: 100%;
width: 100%;
left: 0;
top: 0;
z-index: 1;
}
.car_model .list14 .carbg-list .swiper-slide {
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
}
.car_model .list14 .carbg-list .swiper-pagination {
bottom: 1.5rem;
}
.car_model .list14 .carbg-list .swiper-pagination span {
width: 16px;
height: 16px;
margin: 0 10px;
display: inline-block;
border-radius: 100%;
background: none;
opacity: 1;
box-shadow: inset 0px 0px 0px 2px #d6d6d6;
position: relative;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.car_model .list14 .carbg-list .swiper-pagination span:before {
content: "";
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
background: #a6a6a6;
opacity: 0;
border-radius: 50%;
-webkit-transform: scale(0, 0);
-ms-transform: scale(0, 0);
transform: scale(0, 0);
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.car_model .list14 .carbg-list .swiper-pagination span.swiper-pagination-bullet-active {
box-shadow: inset 0px 0px 0px 2px #a6a6a6;
}
.car_model .list14 .carbg-list .swiper-pagination span.swiper-pagination-bullet-active:before {
opacity: 1;
-webkit-transform: scale(1, 1);
-ms-transform: scale(1, 1);
transform: scale(1, 1);
}
.car_model .list14 .libox {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
margin-top: 4.75rem;
position: relative;
z-index: 2;
}
.car_model .list14 .li-item {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: column nowrap;
-ms-flex-flow: column nowrap;
flex-flow: column nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
position: relative;
color: #888;
margin: 0 14px;
height: 4.5rem;
width: 200px;
padding: 0 10px;
border: 1px solid rgba(255, 255, 255, 0.3);
border-radius: 8px;
}
.car_model .list14 .li-item .img {
display: block;
width: 100%;
margin-bottom: .5rem;
}
.car_model .list14 .li-item .tit1, .car_model .list14 .li-item .tit2 {
width: 100%;
display: block;
}
.car_model .list15 {
background: url(../images/img65.jpg) no-repeat center center;
background-size: cover;
padding: 2.15rem 0 1.5rem;
position: relative;
z-index: 1;
}
.car_model .list15 .tit-title, .car_model .list15 .tit-title2 {
color: #fff;
}
.car_model .list15 .bot-li {
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
margin-top: 15rem;
}
.car_model .list15 .bot-li .img {
margin-right: .5rem;
}
.car_model .list15 .bot-li .li {
padding: 0 1.5rem;
display: -webkit-box;
display: -ms-flexbox;
display: flex;
display: -webkit-flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
text-align: center;
border-right: 1px solid rgba(255, 255, 255, 0.24);
}
.car_model .list15 .bot-li .li:last-child {
border-right: none;
}
.car_model .list15 .bot-li .tit2 {
text-align: left;
}
.car_model .list16 {
background: #f6f6f6;
}
.car_model .list16 .text {
padding: 1.75rem 0;
background: #fff;
position: relative;
z-index: 2;
margin-top: -.75rem;
}
.car_model .list16 .img {
display: inline-block;
margin-bottom: .5rem;
}
.car_model .list16 .tit1 {
color: #191919;
}
.n-join .tit-h {
display: inline-block;
padding: 0 80px;
line-height: 1.5;
position: relative;
}
.n-join .tit-h:before {
content: "";
position: absolute;
width: 35px;
height: 1px;
background: #e7e7e7;
left: 0;
top: 50%;
}
.n-join .tit-h:after {
content: "";
position: absolute;
width: 30px;
height: 1px;
background: #e7e7e7;
right: 0;
top: 50%;
}
.n-join .filter-form {
width: 580px;
margin-left: .25rem;
padding: 0 10px;
height: 50px;
line-height: 50px;
background: #fff;
box-shadow: 0px 0px 3px 0px rgba(0, 0, 0, 0.1);
}
.n-join .filter-form .text {
width: calc(100% - 80px);
border: none;
background: none;
height: 50px;
line-height: 30px;
padding: 10px 0;
font-size: 14px;
color: #666;
}
.n-join .filter-form .submit {
width: 50px;
height: 50px;
background: url(../images/img2.png) no-repeat center center;
border: none;
}
.n-join .join-scholl-nav {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: start;
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: flex-start;
margin-top: 1.6rem;
padding-bottom: .8rem;
}
.n-join .join-scholl-nav .li {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
text-align: left;
width: 19%;
margin-right: 1.2%;
background: #efefef;
height: 120px;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-join .join-scholl-nav .li .img {
width: 50px;
height: 50px;
overflow: hidden;
margin-right: .3rem;
}
.n-join .join-scholl-nav .li .img img {
position: absolute;
left: 0;
top: 0;
max-width: 100%;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-join .join-scholl-nav .li .img .img1 {
opacity: 1;
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0);
}
.n-join .join-scholl-nav .li .img .img2 {
opacity: 0;
-webkit-transform: translate(0, 100%);
-ms-transform: translate(0, 100%);
transform: translate(0, 100%);
}
.n-join .join-scholl-nav .li p {
color: #333;
line-height: 1.5;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-join .join-scholl-nav .li:last-child {
margin-right: 0;
}
.n-join .join-scholl-nav .li:hover, .n-join .join-scholl-nav .li.cur {
background: #d00010;
}
.n-join .join-scholl-nav .li:hover p, .n-join .join-scholl-nav .li.cur p {
color: #fff;
}
.n-join .join-scholl-nav .li:hover .img .img1, .n-join .join-scholl-nav .li.cur .img .img1 {
opacity: 0;
-webkit-transform: translate(0, 100%);
-ms-transform: translate(0, 100%);
transform: translate(0, 100%);
}
.n-join .join-scholl-nav .li:hover .img .img2, .n-join .join-scholl-nav .li.cur .img .img2 {
opacity: 1;
-webkit-transform: translate(0, 0%);
-ms-transform: translate(0, 0%);
transform: translate(0, 0%);
}
.n-join .lista {
padding: 2rem 0 3.5rem;
}
.n-join .lista .filterbox {
margin-top: 1.25rem;
background: #f1f1f1;
padding: 1.5rem;
}
.n-join .lista .filterbox .filter-item {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row wrap;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: start;
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: flex-start;
margin-bottom: .6rem;
position: relative;
padding-right: 2rem;
}
.n-join .lista .filterbox .filter-title {
width: 90px;
color: #000;
line-height: 30px;
}
.n-join .lista .filterbox .filter-li {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row wrap;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: start;
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: flex-start;
width: calc(100% - 90px);
height: 32px;
overflow: hidden;
}
.n-join .lista .filterbox .filter-item.active .filter-li {
height: auto;
max-height: 100px;
overflow: auto;
}
.n-join .lista .filterbox .filter-item.active .sp3 {
color: #d00010;
}
.n-join .lista .filterbox .filter-item.active .sp3:before {
color: #d00010;
-webkit-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
transform: rotate(-180deg);
}
.n-join .lista .filterbox .filter-item:last-child {
margin-bottom: 0;
}
.n-join .lista .filterbox .sp2 {
margin: 0 .25rem;
line-height: 30px;
font-size: 16px;
color: #222;
cursor: pointer;
border-bottom: 2px solid #f1f1f1;
-webkit-transition: all .5s;
transition: all .5s;
}
.n-join .lista .filterbox .sp3 {
position: absolute;
right: 0;
top: 0;
padding-right: 20px;
cursor: pointer;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-join .lista .filterbox .sp3:before {
position: absolute;
right: 0;
font-size: 14px;
color: #000;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-join .lista .filterbox .sp2:hover, .n-join .lista .filterbox .sp2.cur {
border-bottom: 2px solid #d00010;
}
.n-join .lista .filterbox .filter-item4 {
height: 50px;
}
.n-join .lista .filterbox .filter-item4 form {
width: auto;
}
.n-join .lista .filter-item4 .sp1{
line-height: 50px;
}
.n-join .lista .join-list {
margin-top: .7rem;
}
.n-join .join-list-ajax .joins .tit1{
font-size:18px;
line-height:1.8;
color:#000;
margin-bottom:15px;
}
.n-join .lista .join-list .join-list-li {
padding: .75rem 150px .75rem 0;
display: block;
width: 100%;
border-bottom: 1px dashed #ececec;
position: relative;
}
.n-join .lista .join-list .button-btn:before {
z-index: 1;
background: #d00010;
width: 250px;
height: 100px;
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
-webkit-transform: translate(-50%, -50%) scale(0);
-ms-transform: translate(-50%, -50%) scale(0);
transform: translate(-50%, -50%) scale(0);
}
.n-join .lista .join-list .join-list-li2 {
padding: 1rem 150px 1rem 0;
}
.n-join .lista .join-list .join-list-li2 .join-list-text {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row wrap;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.n-join .lista .join-list .join-list-tit {
-webkit-transition: color .5s ease;
transition: color .5s ease;
margin-bottom: .5rem;
}
.n-join .lista .join-list .button-btn {
width: 130px;
height: 45px;
line-height: 45px;
text-align: center;
color: #333;
background: #f1f1f1;
position: absolute;
top: 1rem;
right: 0;
z-index: 1;
cursor: pointer;
}
.n-join .lista .join-list .button-btn p {
position: relative;
z-index: 2;
-webkit-transition: all .3s ease;
transition: all .3s ease;
}
.n-join .lista .join-list .button-btn2 {
top: 50%;
margin-top: -22.5px;
}
.n-join .lista .join-list .join-list-text {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row wrap;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: start;
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: flex-start;
padding:0 0 20px;
}
.n-join .lista .join-list .join-list-text span {
font-size: 15px;
color: #666;
line-height: 1.5;
width: 7rem;
padding-right: .8rem;
}
.n-join .lista .join-list .join-list-text .sp1 {
width: 480px;
line-height: 25px;
padding-right: 1rem;
}
.n-join .lista .join-list .join-list-text .sp2 {
width: 200px;
line-height: 25px;
}
.n-join .lista .join-list .join-list-li:hover .join-list-tit {
color: #d00010;
}
.n-join .lista .join-list .button-btn:hover p {
color: #fff;
}
.n-join .lista .join-list .button-btn:hover:before {
-webkit-transform: translate(-50%, -50%) scale(1);
-ms-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.n-join .lista .click-btn {
width: 224px;
height: 45px;
line-height: 45px;
text-align: center;
margin: 1.5rem auto 0;
cursor: pointer;
box-shadow: inset 0px 0px 0px 2px #090103;
}
.n-join .lista .click-btn p {
position: relative;
z-index: 2;
-webkit-transition: all .3s ease;
transition: all .3s ease;
}
.n-join .lista .click-btn:before {
z-index: 1;
background: #d00010;
width: 350px;
height: 200px;
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
-webkit-transform: translate(-50%, -50%) scale(0);
-ms-transform: translate(-50%, -50%) scale(0);
transform: translate(-50%, -50%) scale(0);
}
.n-join .lista .click-btn:hover p {
color: #fff;
}
.n-join .lista .click-btn:hover:before {
-webkit-transform: translate(-50%, -50%) scale(1);
-ms-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.n-join .listb {
padding: 2rem 0 3.5rem;
background: #f6f6f6;
}
.n-join .listb img {
display: inline-block;
margin-top: 2rem;
max-width: 100%;
}
.n-join .listc {
padding: 2.8rem 0 2.5rem;
}
.n-join .listc .ulbox {
margin-top: 1.2rem;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: stretch;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
.n-join .listc .li {
padding: 1.5rem 0 .75rem;
width: 31%;
margin-right: 3.5%;
border-top: 1px solid #e3e3e3;
border-bottom: 1px solid #e3e3e3;
}
.n-join .listc .li:last-child {
margin-right: 0;
}
.n-join .listc .li img {
width: 70px;
height: 70px;
display: inline-block;
}
.n-join .listc .li .tit2 {
padding: 0 .5rem;
margin-top: .5rem;
}
.n-join .listc .li .tit3 {
font-size: 2.4rem;
line-height: 1.2;
color: #333;
opacity: .05;
font-weight: bold;
}
.n-join .listd {
padding: 2.5rem 0 2.7rem;
background: #f4f4f4;
}
.n-join .listd .table {
margin-top: 1.25rem;
box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.2);
}
.n-join .listd .table .top {
border: 1px solid #c2c1c1;
border-bottom: none;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: stretch;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
background: #5f5f5f;
}
.n-join .listd .table .top .li {
height: 65px;
line-height: 65px;
text-align: center;
font-size: 16px;
color: #fff;
border-right: 1px solid #656565;
}
.n-join .listd .table .li-item {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: stretch;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
background: #fcfcfc;
}
.n-join .listd .table .li-item .li {
padding: 10px 5px;
line-height: 25px;
text-align: center;
font-size: 15px;
color: #666;
border-right: 1px solid #f3f3f3;
border-bottom: 1px solid #f3f3f3;
}
.n-join .listd .table .bot {
border-top: 1px solid #f3f3f3;
max-height: 630px;
overflow-y: auto;
}
.n-join .liste {
background: #fff;
padding: 2.4rem 0 3rem;
}
.n-join .liste .ulbox {
margin-top: 1.5rem;
}
.n-join .liste .libox {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: start;
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: flex-start;
text-align: center;
border-bottom: 1px solid #f5f1f1;
}
.n-join .liste .libox:last-child {
border-bottom: none;
}
.n-join .liste .libox2 .li {
height: 230px;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: column wrap;
-ms-flex-flow: column wrap;
flex-flow: column wrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.n-join .liste .libox3 .li {
padding-top: 1.5rem;
}
.n-join .liste .li {
width: 25%;
height: 180px;
border-right: 1px solid #f5f1f1;
}
.n-join .liste .li .img {
width: 78px;
height: 78px;
border-radius: 50%;
}
.n-join .liste .li p {
margin-top: 12px;
}
.n-join .liste .li:last-child {
border-right: none;
}
.n-join .listf {
padding: .8rem 0;
background: #f4f4f4;
}
.n-join .listf .erwei-box {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
}
.n-join .listf .img {
margin-right: 20px;
}
.n-join .stepbox {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
margin: 2.5rem 0 2.2rem;
}
.n-join .stepbox .li {
width: 72px;
text-align: center;
}
.n-join .stepbox .li-jin {
margin: 0 1rem;
width: 16px;
-webkit-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
transform: rotate(-90deg);
}
.n-join .stepbox .li-jin:before {
font-size: 20px;
color: #c1c4c8;
}
.n-join .stepbox .li.cur .img {
background: #c60a19;
}
.n-join .stepbox .li.cur .img:before {
opacity: 1;
}
.n-join .stepbox .li.on .img {
background: #c60a19;
}
.n-join .stepbox .li-jin.cur:before {
color: #c60a19;
}
.n-join .stepbox .img {
margin-bottom: 22px;
height: 72px;
border-radius: 72px;
background: #c1c5c9;
position: relative;
}
.n-join .stepbox .img:before {
content: "";
position: absolute;
left: 50%;
margin-left: -10px;
bottom: -8px;
width: 0;
height: 0;
opacity: 0;
border-left: 10px solid transparent;
border-right: 10px solid transparent;
border-top: 10px solid #c60a19;
}
.n-join .stepbox .p {
font-size: 14px;
line-height: 1.5;
}
.n-join .job-name {
line-height: 1.2;
margin-bottom: 1rem;
}
.n-join .stepbox2 {
padding-bottom: 2.5rem;
}
.n-join .stepbox2 .tit1 {
padding-left: 15px;
line-height: 18px;
color: #404040;
position: relative;
padding-bottom: .5rem;
margin-bottom: .7rem;
border-bottom: 1px solid #ececec;
}
.n-join .stepbox2 .tit1:before {
content: "";
position: absolute;
left: 0;
top: 0;
background: #d11524;
width: 3px;
height: 18px;
}
.n-join .list-step1 .tit1 {
padding-left: 15px;
line-height: 18px;
color: #404040;
position: relative;
padding-bottom: .5rem;
margin-bottom: .7rem;
border-bottom: 1px solid #ececec;
}
.n-join .list-step1 .tit1:before {
content: "";
position: absolute;
left: 0;
top: 0;
background: #d11524;
width: 3px;
height: 18px;
}
.n-join .list-step1 {
padding-bottom: 2.5rem;
}
.n-join .list-step1 .tit2 {
line-height: 1;
margin-bottom: .5rem;
}
.n-join .list-step1 .list-step-box {
padding: 1.25rem .5rem .5rem;
background: #f8f8f8;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row wrap;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: stretch;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
}
.n-join .list-step1 .list-step-box .li {
width: 33.3%;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row wrap;
-ms-flex-flow: row wrap;
flex-flow: row wrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
margin-bottom: .75rem;
}
.n-join .list-step1 .list-step-box .sp1 {
width: 92px;
padding-right: 10px;
font-size: 16px;
color: #666;
}
.n-join .list-step1 .list-step-box .sp2 {
width: calc(100% - 90px - 1rem);
border: 1px solid #dddee1;
padding: 10px;
background: #fff;
}
.n-join .list-step1 .list-step-box .sp2 span {
height: 25px;
line-height: 25px;
color: #aaa;
width: 100%;
}
.n-join .li-sp1-top {
-webkit-box-align: start !important;
-webkit-align-items: flex-start !important;
-ms-flex-align: start !important;
align-items: flex-start !important;
}
.n-join .li-sp1-top .sp1 {
margin-top: 10px;
}
.n-join .input1 {
height: 25px;
line-height: 25px;
border: none;
background: none;
width: 100%;
}
.n-join .input2 {
height: 25px;
line-height: 25px;
border: none;
background: none;
width: 100%;
}
.n-join .input3 {
height: 100px;
line-height: 25px;
border: none;
background: none;
width: 100%;
}
.n-join .list-step2 {
padding-bottom: 2rem;
margin-bottom: 2rem;
border-bottom: 1px solid #ececec;
}
.n-join .list-step2 .list-step-box {
padding-right: 1.5rem;
}
.n-join .list-step2 .list-step-box .li-100 {
width: 100%;
}
.n-join .list-step2 .list-step-box .li-47 {
width: 47%;
}
.n-join .list-step2 .list-step-box .ma-left-6 {
margin-right: 6%;
}
.n-join .list-step2 .list-step-box .sp-2 {
width: calc((94% - 90px - 1rem)/2);
}
.n-join .more-click {
border-top: 1px dashed #e5e5e5;
padding: .5rem 0;
position: relative;
padding-left: 20px;
color: #ca2835;
cursor: pointer;
font-size: 14px;
line-height: 20px;
}
.n-join .more-click:before {
position: absolute;
left: 0;
font-size: 18px;
color: #ca2835;
}
.n-join .list-step-box {
margin-bottom: 1rem;
}
.n-join .time-sp2 input {
position: relative;
z-index: 2;
}
.n-join .time-btn {
background: url(../images/img42.png) no-repeat center;
position: absolute;
z-index: 1;
width: 20px;
height: 47px;
right: 10px;
top: 0;
background-size: 19px auto;
}
.n-join .li-box {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: start;
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: flex-start;
width: 100%;
}
.n-join form {
width: 100%;
}
.n-join .form-botton {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: start;
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: flex-start;
margin-left: 90px;
margin-bottom: 1rem;
}
.n-join .form-botton .input-submit, .n-join .form-botton .input-reset {
background: none;
border: none;
font-size: 16px;
display: block;
height: 42px;
width: 100%;
text-align: center;
}
.n-join .form-botton .submit-bottom {
width: 100px;
height: 45px;
line-height: 45px;
text-align: center;
background: #484848;
display: block;
margin-right: 1rem;
}
.n-join .form-botton .submit-bottom .input-submit {
position: relative;
z-index: 2;
color: #fff;
}
.n-join .form-botton .submit-bottom:before {
z-index: 1;
background: #cb0f1e;
width: 300px;
height: 200px;
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
-webkit-transform: translate(-50%, -50%) scale(0);
-ms-transform: translate(-50%, -50%) scale(0);
transform: translate(-50%, -50%) scale(0);
}
.n-join .form-botton .submit-bottom:hover:before {
-webkit-transform: translate(-50%, -50%) scale(1);
-ms-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.n-join .form-botton .reset-bottom {
width: 100px;
height: 45px;
line-height: 45px;
text-align: center;
background: transparent;
display: block;
}
.n-join .form-botton .reset-bottom .input-reset {
position: relative;
z-index: 2;
color: #888;
}
.n-join .form-botton .reset-bottom:before {
z-index: 1;
background: #cb0f1e;
width: 300px;
height: 200px;
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
-webkit-transform: translate(-50%, -50%) scale(0);
-ms-transform: translate(-50%, -50%) scale(0);
transform: translate(-50%, -50%) scale(0);
}
.n-join .form-botton .reset-bottom:hover:before {
-webkit-transform: translate(-50%, -50%) scale(1);
-ms-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.n-join .form-botton .reset-bottom:hover .input-reset {
color: #fff;
}
.n-join .bot-botton {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
margin: 1.5rem auto 0;
}
.n-join .step-bottom {
width: 280px;
height: 55px;
line-height: 55px;
text-align: center;
background: #db0b1b;
display: block;
cursor:pointer;
}
.n-join .step-bottom p {
position: relative;
z-index: 2;
color: #fff;
}
.n-join .step-bottom:before {
z-index: 1;
background: #cb0f1e;
width: 450px;
height: 200px;
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
-webkit-transform: translate(-50%, -50%) scale(0);
-ms-transform: translate(-50%, -50%) scale(0);
transform: translate(-50%, -50%) scale(0);
}
.n-join .step-bottom:hover:before {
-webkit-transform: translate(-50%, -50%) scale(1);
-ms-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.n-join .step-bottom-prve {
background: #3e3e3e;
}
.n-join .step-bottom-prve:before {
background: #313030;
}
.n-join .list-step-end {
border: 1px solid #e8e7e7;
box-shadow: 0px 0px 15px 0px rgba(0, 0, 0, 0.1);
padding: 1.25rem;
margin-bottom: 4.5rem;
}
.n-join .list-step-end .tit1 {
padding-left: 15px;
line-height: 18px;
color: #404040;
position: relative;
padding-bottom: .5rem;
margin-bottom: .7rem;
border-bottom: 1px dashed #f2f2f2;
}
.n-join .list-step-end .tit1:before {
content: "";
position: absolute;
left: 0;
top: 0;
background: #d11524;
width: 3px;
height: 18px;
}
.n-join .list-step-end .tit1 span {
font-size: 14px;
margin-left: 10px;
}
.n-join .list-step-end .step-bottom {
margin: 0 .5rem;
cursor: pointer;
}
.n-about .listb .swiper-slide .text {
-webkit-transform: translate(0, 100%);
-ms-transform: translate(0, 100%);
transform: translate(0, 100%);
opacity: 0;
-webkit-transition: all 0.8s cubic-bezier(0.59, -0.26, 0.46, 0.91);
transition: all 0.8s cubic-bezier(0.59, -0.26, 0.46, 0.91);
}
.n-about .listb .swiper-slide.swiper-slide-active .text {
-webkit-transform: translate(0, 0%);
-ms-transform: translate(0, 0%);
transform: translate(0, 0%);
opacity: 1;
}
.configure-banner {
height: 12.5rem;
background-repeat: no-repeat;
background-position: center center;
background-size: cover;
position: relative;
z-index: 1;
}
.configure-banner .car-name {
position: relative;
z-index: 1;
padding-top: 2rem;
max-width: 20rem;
margin: 0 auto;
display: block;
}
.configure-banner .car-img {
position: absolute;
z-index: 2;
width: 19.2rem;
right: 10.5rem;
top: 3.75rem;
}
.n-configure {
padding: 2rem 0 0;
}
.n-configure .con-left {
width: 68%;
float: left;
}
.n-configure .con-left .listbox {
padding-bottom: 3rem;
}
.n-configure .con-left .list-item {
margin-bottom: 2rem;
}
.n-configure .con-left .list-item .tit1 {
margin-bottom: .5rem;
}
.n-configure .con-left .list-item .li {
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: stretch;
-webkit-align-items: stretch;
-ms-flex-align: stretch;
align-items: stretch;
line-height: 1.5;
font-size: 16px;
color: #000;
}
.n-configure .con-left .list-item .sp1 {
width: 35%;
margin-right: 2%;
padding: 12px 0;
border-bottom: 1px solid #dbdbdb;
}
.n-configure .con-left .list-item .sp2 {
width: 63%;
padding: 12px 0;
border-bottom: 1px solid #dbdbdb;
}
.n-configure .con-right {
width: 29%;
height: 440px;
float: right;
padding: .7rem 0;
border: 1px solid #ccc;
}
.n-configure .con-right .top {
padding: 0 .65rem;
}
.n-configure .con-right .car-select {
margin-top: 5px;
border-bottom: 1px solid #eee;
position: relative;
z-index: 2;
}
.n-configure .con-right .car-select .sp {
height: 45px;
line-height: 45px;
padding-right: 30px;
position: relative;
cursor: pointer;
z-index:3;
}
.n-configure .con-right .car-select .sp:before {
right: 0;
color: #000;
position: absolute;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-configure .con-right .car-img {
background: #f2f3f4;
padding: .6rem .75rem;
margin-top: .85rem;
}
.n-configure .con-right .car-img img {
max-width: 100%;
}
.n-configure .con-right .sp.on:before {
-webkit-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
transform: rotate(-180deg);
}
.n-configure .con-right .car-price {
font-size: 16px;
line-height: 30px;
margin-top: 10px;
color: #000;
position: relative;
z-index: 1;
}
.n-configure .con-right .spbox {
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
position: absolute;
width: 100%;
top: 45px;
left: 0;
z-index: 2;
background: #fff;
border: 1px solid #e5e5e5;
display: none;
max-height: 310px;
overflow-y: auto;
z-index:9;
}
.n-configure .con-right .spbox .li {
padding: 10px;
color: #888;
height: 50px;
line-height: 30px;
cursor: pointer;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-configure .con-right .spbox .li:hover {
background: #f2f3f4;
}
.n-configure .con-right .contrast-button {
width: calc(100% - 1.3rem);
margin: 18px auto 0;
height: 45px;
line-height: 45px;
background: #000;
display: block;
}
.n-configure .con-right .contrast-button p {
position: relative;
color: #fff;
font-size: 14px;
z-index: 2;
padding-right: 20px;
display: inline-block;
}
.n-configure .con-right .contrast-button p:before {
position: absolute;
right: 0;
font-size: 14px;
color: #fff;
-webkit-transform: rotate(90deg);
-ms-transform: rotate(90deg);
transform: rotate(90deg);
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-configure .con-right .hover_1:before {
z-index: 1;
background: #d00010;
width: 500px;
height: 300px;
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
-webkit-transform: translate(-50%, -50%) scale(0);
-ms-transform: translate(-50%, -50%) scale(0);
transform: translate(-50%, -50%) scale(0);
}
.n-configure .con-right .hover_1:hover p:before {
right: -5px;
}
.n-configure .con-right .hover_1:hover:before {
-webkit-transform: translate(-50%, -50%) scale(1);
-ms-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.bot-configure {
background: #fafafa;
padding: 1.75rem 0;
font-size: 16px;
color: #a5a5a5;
line-height: 30px;
}
.bot-configure .p {
width: 80%;
}
.n-configure-info {
padding: 2.25rem 0 0rem;
}
.n-configure-info .con-list {
width: 32%;
float: left;
}
.n-configure-info .con-list .car-select {
margin-top: 5px;
border-bottom: 1px solid #eee;
position: relative;
z-index: 2;
}
.n-configure-info .con-list .car-select .sp {
height: 45px;
line-height: 45px;
padding-right: 30px;
position: relative;
cursor: pointer;
background: #f2f3f4;
padding: 0 .65rem;
}
.n-configure-info .con-list .car-select .sp:before {
right: .65rem;
color: #000;
position: absolute;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-configure-info .con-list .sp.on:before {
-webkit-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
transform: rotate(-180deg);
}
.n-configure-info .con-list .spbox {
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
position: absolute;
width: 100%;
top: 45px;
left: 0;
z-index: 2;
background: #fff;
border: 1px solid #e5e5e5;
display: none;
max-height: 480px;
overflow-y: auto;
}
.n-configure-info .con-list .spbox .li {
padding: 10px;
color: #888;
height: 50px;
line-height: 30px;
cursor: pointer;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-configure-info .con-list .spbox .li:hover {
background: #f2f3f4;
}
.n-configure-info .con-list .spbox .li-sub {
padding: 10px;
color: #888;
height: 50px;
line-height: 30px;
background: #f2f3f4;
}
.n-configure-info .con-list {
margin-right: 2%;
}
.n-configure-info .con-list2 .top {
height: 190px;
margin-bottom: 1.2rem;
}
.n-configure-info .con-list2 .back-button {
width: 140px;
margin: 18px 0 0;
height: 45px;
line-height: 45px;
background: #000;
display: block;
}
.n-configure-info .con-list2 .back-button p {
position: relative;
color: #fff;
font-size: 14px;
z-index: 2;
padding-left: 20px;
display: inline-block;
}
.n-configure-info .con-list2 .back-button p:before {
position: absolute;
-webkit-transform: rotate(-90deg);
-ms-transform: rotate(-90deg);
transform: rotate(-90deg);
left: 0;
font-size: 14px;
color: #fff;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-configure-info .con-list2 .hover_1:before {
z-index: 1;
background: #d00010;
width: 300px;
height: 200px;
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
-webkit-transform: translate(-50%, -50%) scale(0);
-ms-transform: translate(-50%, -50%) scale(0);
transform: translate(-50%, -50%) scale(0);
}
.n-configure-info .con-list2 .hover_1:hover p:before {
left: -5px;
}
.n-configure-info .con-list2 .hover_1:hover:before {
-webkit-transform: translate(-50%, -50%) scale(1);
-ms-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.n-configure-info .con-box {
border-top: 1px solid #aaadad;
}
.n-configure-info .con-box .li {
line-height: 1.5;
font-size: 16px;
color: #888;
padding: 12px 0;
border-bottom: 1px solid #dbdbdb;
}
.n-configure-info .con-box .li-sub {
line-height: 26px;
font-size: 16px;
color: #000;
padding: 12px .75rem;
background: #f2f3f4;
position: relative;
}
.n-configure-info .con-box .li-sub:before {
content: "";
position: absolute;
width: 0;
height: 0;
left: .3rem;
top: 50%;
margin-top: -2.5px;
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-top: 5px solid #4a4a4a;
}
.n-configure-info .con-box .li-title {
color: #222;
}
.n-configure-info .car-img {
width: 100%;
background: #f2f3f4;
padding: .5rem 1rem;
text-align: center;
height: 190px;
margin-bottom: 1.2rem;
position: relative;
}
.n-configure-info .car-img img {
max-width: 100%;
display: inline-block;
}
.n-configure-info .con-list3 .con-box {
border-top: 1px solid #e60012;
text-align: center;
}
.n-configure-info .con-list3 .li-sub {
height: 50px;
}
.n-configure-info .con-list3 .li-sub:before {
display: none;
}
.n-configure-info .con-list4, .n-configure-info .con-list1 {
margin-right: 0;
}
.n-configure-info .colse-btn {
width: 30px;
height: 30px;
position: absolute;
right: 10px;
top: 10px;
cursor: pointer;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-configure-info .colse-btn:before {
font-size: 18px;
color: #333;
top: 50%;
left: 50%;
position: absolute;
margin-top: -12px;
margin-left: -9px;
}
.n-configure-info .colse-btn:hover {
-webkit-transform: rotate(180deg);
-ms-transform: rotate(180deg);
transform: rotate(180deg);
}
.n-configure-info .colse-btn:hover:before {
color: #e6000f;
}
.n-configure-info .col-red {
color: #da3830 !important;
}
.n-configure-info .con-list4 {
display: none;
}
.n-configure-info .con-listbox {
height: 1020px;
overflow: hidden;
}
.n-configure-info .con-listbox.active {
height: auto;
}
.n-configure-info .jian-btn {
width: 100%;
text-align: center;
margin: .6rem 0 2rem;
cursor: pointer;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-configure-info .jian-btn img {
max-width: 100%;
display: inline-block;
}
.n-configure-info .jian-btn.active {
-webkit-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
transform: rotate(-180deg);
}
.md-perspective,
.md-perspective body {
background: #f2f2f2;
height: 100%;
overflow: hidden;
}
.md-perspective .alert-warp {
-webkit-transform-origin: 50% 50%;
-ms-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webkit-transform: perspective(600px) rotateX(10deg);
transform: perspective(600px) rotateX(10deg);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transition: all .5s ease-in;
transition: all .5s ease-in;
}
.md-perspective .md-overlay1 {
-webkit-transform-origin: 50% 50%;
-ms-transform-origin: 50% 50%;
transform-origin: 50% 50%;
-webkit-transform: perspective(600px) rotateX(10deg);
transform: perspective(600px) rotateX(10deg);
-webkit-transform-style: preserve-3d;
transform-style: preserve-3d;
-webkit-transition: all .5s ease-in;
transition: all .5s ease-in;
}
.md-overlay.md-overlay1 {
background: rgba(0, 0, 0, 0.5);
}
.md-modal.fli-box {
width: 1200px;
height: calc(100vh - 200px);
}
.md-modal.fli-box .mCSB_scrollTools {
background: #f9f9f9;
}
.md-modal.fli-box .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background: #aaa !important;
width: 6px;
}
.md-modal.fli-box .mCSB_scrollTools .mCSB_draggerRail {
display: none !important;
}
.fli-box .p-16 {
height: calc(100vh - 260px);
}
.fli-box .np-16 {
height: calc(100vh - 260px - 2.5rem);
}
.fli-box .md-content h3 {
margin: 0;
height: 60px;
padding: 15px .25rem;
text-align: center;
font-size: .75rem;
line-height: 30px;
font-weight: 300;
color: #333;
background: rgba(0, 0, 0, 0.1);
border-radius: 3px 3px 0 0;
}
.fli-box .md-content {
background: #fff;
}
.fli-box .md-close {
position: absolute;
width: 40px;
height: 40px;
right: 0;
top: 0;
cursor: pointer;
}
.fli-box .md-close:before {
position: absolute;
font-size: 20px;
left: 50%;
top: 50%;
width: 20px;
height: 20px;
-webkit-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
color: #333;
}
.fli-box .p-16 {
font-size: 14px;
color: #333;
line-height: 1.8;
padding: 1rem .6rem 1.5rem;
}
.coad-alert .md-content {
width: 450px;
height: 280px;
padding: 1.25rem;
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
}
.coad-alert .md-content .tit1 {
line-height: 1;
}
.coad-alert .md-content .coad-box {
width: 100%;
margin-top: 1rem;
margin-bottom: .5rem;
}
.coad-alert .md-content .coad-box img {
max-width: 100%;
}
.coad-alert .md-content {
background: #fff;
}
.coad-alert .md-close {
position: absolute;
width: 40px;
height: 40px;
right: 5px;
top: 5px;
cursor: pointer;
}
.coad-alert .md-close:before {
position: absolute;
font-size: 30px;
left: 50%;
top: 50%;
width: 30px;
height: 30px;
-webkit-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
color: #333;
}
.coad-alert .coad-button {
width: 100%;
height: 50px;
line-height: 50px;
text-align: center;
background: #f8f8f8;
display: block;
cursor: pointer;
box-shadow: inset 0px 0px 0px 1px #eee;
}
.coad-alert .coad-button p {
position: relative;
z-index: 2;
font-size: 16px;
color: #e60012;
-webkit-transition: all .3s ease;
transition: all .3s ease;
}
.coad-alert .coad-button:before {
z-index: 1;
background: #cb0f1e;
width: 600px;
height: 200px;
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
-webkit-transform: translate(-50%, -50%) scale(0);
-ms-transform: translate(-50%, -50%) scale(0);
transform: translate(-50%, -50%) scale(0);
}
.coad-alert .coad-button:hover p {
color: #fff;
}
.coad-alert .coad-button:hover:before {
-webkit-transform: translate(-50%, -50%) scale(1);
-ms-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.car560-img-alert .md-content {
width: 1000px;
background: none;
max-width: auto;
min-width: auto;
left: 50%;
top: 20%;
margin-left: -500px;
}
.car560-img-alert .swiper-img {
width: 745px;
text-align: center;
background:#fff;
}
.car560-img-alert .swiper-img .swiper-slide{
padding:30px;
}
.car560-img-alert .swiper-img .img {
width: 100%;
}
.car560-img-alert .swiper-img .p {
margin-top: 10px;
font-size: 18px;
color: #333;
line-height: 1.5;
}
.car560-img-alert .swiper-button-next, .car560-img-alert .swiper-button-prev {
background: none !important;
}
.car560-img-alert .icon-rot {
-webkit-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
transform: rotate(-180deg);
}
.car560-img-alert .icon {
width: 35px;
height: 35px;
fill: #000;
}
.car560-img-alert .swiper-button-next:hover, .car560-img-alert .swiper-button-prev:hover {
opacity: .6;
}
.car-560-close {
position: fixed;
width: 50px;
height: 50px;
right: 10px;
top: 10px;
cursor: pointer;
z-index: 1200;
visibility: hidden;
}
.car-560-close:before {
position: absolute;
font-size: 50px;
left: 0px;
top: 0px;
width: 50px;
height: 50px;
color: #fff;
}
.trim360-alert {
width: 100%;
height: 100%;
position: fixed;
left: 0;
top: 0;
z-index: 99;
visibility: hidden;
}
.trim360-alert .md-content {
width: 100%;
height: 100%;
}
.trim360-alert .click-down {
width: 100px;
height: 27px;
line-height: 27px;
position: absolute;
bottom: 105px;
left: 50%;
margin-left: -50px;
background: url(../images/img43.png) no-repeat center;
cursor: pointer;
background-size: 100% 100%;
text-align: center;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
-webkit-transition: all .5s ease;
transition: all .5s ease;
z-index: 5;
}
.trim360-alert .click-down img {
width: 18px;
height: 11px;
margin-right: 5px;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.trim360-alert .click-down span {
display: inline-block;
font-size: 14px;
color: rgba(255, 255, 255, 0.6);
}
.trim360-alert .trim360-tab {
position: absolute;
height: 105px;
width: 100%;
left: 0;
bottom: 0;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
padding: 15px 0;
background: rgba(0, 0, 0, 0.85);
-webkit-transform: translate(0, 0%);
-ms-transform: translate(0, 0%);
transform: translate(0, 0%);
-webkit-transition: -webkit-transform .5s ease;
transition: transform .5s ease;
z-index: 5;
}
.trim360-alert .trim360-tab .li-tab {
width: 120px;
height: 70px;
line-height: 68px;
text-align: center;
position: relative;
margin: 0 6px;
cursor: pointer;
}
.trim360-alert .trim360-tab .li-tab img {
width: 100%;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.trim360-alert .trim360-tab .li-tab:before {
content: "";
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
background: rgba(0, 0, 0, 0.5);
}
.trim360-alert .trim360-tab .trim360-tit {
position: absolute;
width: 100%;
padding: 0 5%;
left: 0;
top: 0;
text-align: center;
top: 50%;
margin-top: -13px;
z-index: 2;
}
.trim360-alert .li-tab.cur img {
box-shadow: 0px 0px 0px 2px #d53737;
}
.trim360-alert .trim360-tab.cur {
-webkit-transform: translate(0, 100%);
-ms-transform: translate(0, 100%);
transform: translate(0, 100%);
}
.trim360-alert .click-down.cur {
-webkit-transform: translate(0, 105px);
-ms-transform: translate(0, 105px);
transform: translate(0, 105px);
}
.trim360-alert .click-down.cur img {
-webkit-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
transform: rotate(-180deg);
}
.trim360-close {
position: fixed;
width: 50px;
height: 50px;
right: 10px;
top: 10px;
cursor: pointer;
z-index: 100;
opacity: 0;
-webkit-transition: all .5s ease;
transition: all .5s ease;
visibility: hidden;
}
.trim360-close:before {
position: absolute;
font-size: 50px;
line-height: 1;
left: 50%;
top: 50%;
width: 50px;
height: 50px;
color: #fff;
margin-left: -25px;
margin-top: -25px;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.trim360-close:hover:before {
-webkit-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
transform: rotate(-180deg);
color: #d53737;
}
.trim360-alert.md-show {
visibility: visible;
}
.bg-none-s {
background: #000;
opacity: .5;
position: fixed;
width: 100%;
height: 100%;
top: 0;
left: 0;
z-index: 100;
display: none;
}
.meadia-ajax.active {
-webkit-transform: rotateX(0deg);
transform: rotateX(0deg);
opacity: 1
/*display: block;*/
}
.meadia-ajax .close-btn {
width: 75px;
height: 75px;
position: absolute;
right: 0rem;
top: 0;
z-index: 9;
cursor: pointer;
background: #333;
}
.meadia-ajax {
width: 80%;
position: fixed;
height: 16rem;
left: 50%;
margin-left: -40%;
top: 50%;
margin-top: -8rem;
/*overflow: hidden;*/
opacity: 0;
-webkit-transform: scale(0);
-ms-transform: scale(0);
transform: scale(0);
-webkit-transition: opacity .5s,-webkit-transform 1s;
transition: opacity .5s,transform 1s;
display: none;
background: #000;
z-index: 101;
}
.meadia-ajax video {
width: 100%;
max-height: 16rem;
}
.PageMenu-closeBtn {
width: 26px;
height: 26px;
padding: 0;
position: absolute;
top: 50%;
left: 50%;
margin-top: -13px;
margin-left: -13px;
box-sizing: border-box;
background-color: transparent;
border: none;
z-index: 20;
outline: 0;
-webkit-transition: -webkit-transform 0.6s cubic-bezier(0.645, 0.045, 0.355, 1);
transition: -webkit-transform 0.6s cubic-bezier(0.645, 0.045, 0.355, 1);
transition: transform 0.6s cubic-bezier(0.645, 0.045, 0.355, 1);
-webkit-transition: -webkit-transform 0.6s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.6s cubic-bezier(0.645, 0.045, 0.355, 1);
transition: transform 0.6s cubic-bezier(0.645, 0.045, 0.355, 1), -webkit-transform 0.6s cubic-bezier(0.645, 0.045, 0.355, 1);
}
.PageMenu-closeBtn .line-01, .PageMenu-closeBtn .line-02 {
width: 100%;
height: 3px;
background-color: #fff;
position: absolute;
left: 50%;
top: 50%;
}
.PageMenu-closeBtn .line-01 {
-webkit-transform: translate(-50%, -50%) rotate(45deg);
-ms-transform: translate(-50%, -50%) rotate(45deg);
transform: translate(-50%, -50%) rotate(45deg);
}
.PageMenu-closeBtn .line-02 {
-webkit-transform: translate(-50%, -50%) rotate(-45deg);
-ms-transform: translate(-50%, -50%) rotate(-45deg);
transform: translate(-50%, -50%) rotate(-45deg);
}
.PageMenu-closeBtn .line-01:after, .PageMenu-closeBtn .line-02:after {
content: '';
display: block;
position: absolute;
left: 0;
top: 0;
width: 100%;
height: 100%;
background-color: #e15d56;
-webkit-transform: scaleX(0) translateZ(0);
transform: scaleX(0) translateZ(0);
-webkit-transition: -webkit-transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
transition: -webkit-transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
transition: transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
-webkit-transition: -webkit-transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
transition: transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1), -webkit-transform 0.6s cubic-bezier(0.215, 0.61, 0.355, 1);
}
.PageMenu-closeBtn:hover .line-01:after, .PageMenu-closeBtn:hover .line-02:after {
-webkit-transform: scaleX(1) translateZ(0);
transform: scaleX(1) translateZ(0);
}
.PageMenu-closeBtn:hover {
-webkit-transform: scale(1.2);
-ms-transform: scale(1.2);
transform: scale(1.2);
}
.backtop svg {
height: 20px;
width: 20px;
position: relative;
display: block;
margin: 0 auto;
top: 50%;
-webkit-transform: translateY(-50%);
-ms-transform: translateY(-50%);
transform: translateY(-50%);
}
.backtop.active {
-webkit-transform: scale(1, 1);
-ms-transform: scale(1, 1);
transform: scale(1, 1);
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0);
opacity: 1;
}
@-webkit-keyframes scaleloading {
0% {
-webkit-transform: scale(0.5);
transform: scale(0.5);
}
100% {
-webkit-transform: scale(10);
transform: scale(10);
opacity: 0;
}
}
@keyframes scaleloading {
0% {
-webkit-transform: scale(0.5);
transform: scale(0.5);
}
100% {
-webkit-transform: scale(10);
transform: scale(10);
opacity: 0;
}
}
@-webkit-keyframes glowmation {
0% {
top: -3%;
left: -3%;
background-position: 0% 50%;
background-size: 150% 150%;
}
12.5% {
top: -3%;
left: 0;
background-size: 70% 30%;
}
25% {
top: -3%;
left: 3%;
background-size: 100% 50%;
}
37.5% {
top: 0;
left: 3%;
background-size: 70% 30%;
}
50% {
top: 3%;
left: 3%;
background-position: 100% 50%;
background-size: 30% 30%;
}
62.5% {
top: 3%;
left: 0;
background-size: 30% 70%;
}
75% {
top: 3%;
left: -3%;
background-size: 50% 100%;
}
87.5% {
top: 0;
left: -3%;
background-size: 30% 70%;
}
100% {
top: -3%;
left: -3%;
background-position: 0% 50%;
background-size: 150% 150%;
}
}
@keyframes glowmation {
0% {
top: -3%;
left: -3%;
background-position: 0% 50%;
background-size: 150% 150%;
}
12.5% {
top: -3%;
left: 0;
background-size: 70% 30%;
}
25% {
top: -3%;
left: 3%;
background-size: 100% 50%;
}
37.5% {
top: 0;
left: 3%;
background-size: 70% 30%;
}
50% {
top: 3%;
left: 3%;
background-position: 100% 50%;
background-size: 30% 30%;
}
62.5% {
top: 3%;
left: 0;
background-size: 30% 70%;
}
75% {
top: 3%;
left: -3%;
background-size: 50% 100%;
}
87.5% {
top: 0;
left: -3%;
background-size: 30% 70%;
}
100% {
top: -3%;
left: -3%;
background-position: 0% 50%;
background-size: 150% 150%;
}
}
@-webkit-keyframes img1 {
0% {
opacity: .5;
}
20% {
opacity: 1;
}
40% {
opacity: .8;
}
50% {
color: 1;
}
80% {
color: 1;
}
100% {
color: .8;
}
}
@keyframes img1 {
0% {
opacity: .5;
}
20% {
opacity: 1;
}
40% {
opacity: .8;
}
50% {
color: 1;
}
80% {
color: 1;
}
100% {
color: .8;
}
}
@-webkit-keyframes loader1 {
0% {
-webkit-transform: scale(0.6);
transform: scale(0.6);
opacity: 0;
}
50% {
opacity: 1;
}
100% {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 0;
}
}
@keyframes loader1 {
0% {
-webkit-transform: scale(0.6);
transform: scale(0.6);
opacity: 0;
}
50% {
opacity: 1;
}
100% {
-webkit-transform: scale(1);
transform: scale(1);
opacity: 0;
}
}
@-webkit-keyframes arrow2 {
0% {
-webkit-transform: translatey(0);
transform: translatey(0);
}
50% {
-webkit-transform: translatey(4px);
transform: translatey(4px);
}
}
@keyframes arrow2 {
0% {
-webkit-transform: translatey(0);
transform: translatey(0);
}
50% {
-webkit-transform: translatey(4px);
transform: translatey(4px);
}
}
.js-m {
opacity: 0;
-webkit-transform: translate(0, 30px);
-ms-transform: translate(0, 30px);
transform: translate(0, 30px);
-webkit-transition: all 0.8s cubic-bezier(0.79, -0.27, 0.21, 0.82);
transition: all 0.8s cubic-bezier(0.79, -0.27, 0.21, 0.82);
}
.js-m.animate {
opacity: 1;
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0);
}
.js-m.js-m-2 {
opacity: 0;
-webkit-transform: translate(30px, 0);
-ms-transform: translate(30px, 0);
transform: translate(30px, 0);
-webkit-transition: all .8s ease;
transition: all .8s ease;
}
.js-m.js-m-2.animate {
opacity: 1;
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0);
}
.js-m-3 {
opacity: 0;
-webkit-transform: translate(30px, 0);
-ms-transform: translate(30px, 0);
transform: translate(30px, 0);
-webkit-transition: all .8s ease;
transition: all .8s ease;
}
.js-m-3.animate {
opacity: 1;
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0);
}
.js-m.js-m-4 {
opacity: 0;
-webkit-transform: translate(0, -100px);
-ms-transform: translate(0, -100px);
transform: translate(0, -100px);
-webkit-transition: all .8s ease;
transition: all .8s ease;
}
.js-m.js-m-4.animate {
opacity: 1;
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0);
}
.js-m-top {
opacity: 0;
-webkit-transform: translate(0, 100px);
-ms-transform: translate(0, 100px);
transform: translate(0, 100px);
-webkit-transition: all 1.5s cubic-bezier(0.69, 0.1, 0.12, 1.02);
transition: all 1.5s cubic-bezier(0.69, 0.1, 0.12, 1.02);
}
.js-m-top.animate {
opacity: 1;
-webkit-transform: translate(0, 0);
-ms-transform: translate(0, 0);
transform: translate(0, 0);
}
.imgbg-tong {
position: relative;
}
.imgbg-tong:after {
content: "";
margin: 0 0 0 0;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: #fff;
z-index: 4;
-webkit-transition: all 0.5s ease-in-out 0.5s;
transition: all 0.5s ease-in-out 0.5s;
}
.imgbg-tong:before {
content: "";
margin: 0 0 0 0;
position: absolute;
top: 0;
right: 0;
bottom: 0;
left: 0;
background: #111;
z-index: 5;
opacity: 1;
-webkit-transition: all 0.5s ease-in-out;
transition: all 0.5s ease-in-out;
}
.js-m.animate.imgbg-tong:before, .js-m.animate.imgbg-tong:after {
margin-right: 0;
right: 0;
bottom: 0;
left: 100%;
}
.image-in {
display: block;
overflow: hidden;
}
.image-in::before {
-webkit-transform: scaleX(1);
-ms-transform: scaleX(1);
transform: scaleX(1);
-webkit-transform-origin: right center 0px;
-ms-transform-origin: right center 0px;
transform-origin: right center 0px;
-webkit-transition-duration: 1s;
transition-duration: 1s;
-webkit-transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
-webkit-transition-property: -webkit-transform, -webkit-transform;
transition-property: transform, -webkit-transform;
-webkit-transition-delay: 0.6s;
transition-delay: 0.6s;
}
.image-in::before {
content: "";
display: block;
position: absolute;
top: 0px;
right: 0px;
bottom: 0px;
left: 0px;
z-index: 20;
background-color: black;
}
.image-in {
-webkit-transform: translate3d(-100.5%, 0px, 0px);
transform: translate3d(-100.5%, 0px, 0px);
-webkit-transform-origin: left center 0px;
-ms-transform-origin: left center 0px;
transform-origin: left center 0px;
-webkit-transition-duration: 1s;
transition-duration: 1s;
-webkit-transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
transition-timing-function: cubic-bezier(0.075, 0.82, 0.165, 1);
-webkit-transition-property: -webkit-transform, -webkit-transform;
transition-property: transform, -webkit-transform;
-webkit-transition-delay: 0.2s;
transition-delay: 0.2s;
}
.js-m.animate .image-in {
-webkit-transform: translate3d(0px, 0px, 0px);
transform: translate3d(0px, 0px, 0px);
}
.js-m.animate .image-in::before {
-webkit-transform: scale(0, 1);
-ms-transform: scale(0, 1);
transform: scale(0, 1);
}
.delay1 {
-webkit-transition-delay: .1s !important;
transition-delay: .1s !important;
}
.delay2 {
-webkit-transition-delay: .2s !important;
transition-delay: .2s !important;
}
.delay3 {
-webkit-transition-delay: .3s !important;
transition-delay: .3s !important;
}
.delay4 {
-webkit-transition-delay: .4s !important;
transition-delay: .4s !important;
}
.delay5 {
-webkit-transition-delay: .5s !important;
transition-delay: .5s !important;
}
.delay6 {
-webkit-transition-delay: .6s !important;
transition-delay: .6s !important;
}
.delay7 {
-webkit-transition-delay: .7s !important;
transition-delay: .7s !important;
}
.delay8 {
-webkit-transition-delay: .8s !important;
transition-delay: .8s !important;
}
.delay9 {
-webkit-transition-delay: .9s !important;
transition-delay: .9s !important;
}
.delay01 {
-webkit-transition-delay: .03s !important;
transition-delay: .03s !important;
}
.delay02 {
-webkit-transition-delay: .08s !important;
transition-delay: .08s !important;
}
.delay03 {
-webkit-transition-delay: .13s !important;
transition-delay: .13s !important;
}
.delay04 {
-webkit-transition-delay: .18s !important;
transition-delay: .18s !important;
}
.delay05 {
-webkit-transition-delay: .23s !important;
transition-delay: .23s !important;
}
.delay06 {
-webkit-transition-delay: .28s !important;
transition-delay: .28s !important;
}
.delay07 {
-webkit-transition-delay: .33s !important;
transition-delay: .33s !important;
}
.delay08 {
-webkit-transition-delay: .38s !important;
transition-delay: .38s !important;
}
.delay09 {
-webkit-transition-delay: .43s !important;
transition-delay: .43s !important;
}
/*.header1.on{
position: relative;
background: #1a1a1a;
background-image: linear-gradient(#000,#121212);
h1{
margin: 38px 0 0;
}
nav{
top: 32px;
}
}
.header2.on{
position: relative;
background: #1a1a1a;
background-image: linear-gradient(#000,#121212);
}
.star-bg {
position: fixed;
z-index: 0;
top: 0;
left: 0;
width: 100%;
height: 100%;
}*/
.lang-item {
position: absolute;
width: 100px;
right: 20px;
top: 80px;
background: rgba(255, 255, 255, 0.8);
display: none;
}
.lang-item a {
line-height: 30px;
text-align: center;
display: block;
color: #666;
font-size: 14px;
border-bottom: 1px solid #dcdcdc;
-webkit-transition: all .5s ease-in-out;
transition: all .5s ease-in-out;
}
.lang-item a:hover {
color: #da3830;
}
.lang-item a:last-child {
border-bottom: none;
}
#canvas2 {
width: 100%;
height: 100%;
overflow: hidden;
position: absolute;
z-index: 1;
left: 0;
top: 0;
/*opacity: 0;
filter: alpha(opacity=0);*/
-webkit-transition: opacity 0.8s 1s;
transition: opacity 0.8s 1s;
}
.n-join .listf .erwei-box .li{
display: flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: center;
-webkit-justify-content: center;
-ms-flex-pack: center;
justify-content: center;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
margin:0 3rem;
}
.car_model .lista .ultab{
position: relative;
z-index: 2;
}
.car_model .lista .carajax-360{
position: relative;
z-index: 1;
}
.onLoadingDiv{
background: none !important;
}
.car_model .lista .car-imgbox .ulimg #carimg{
cursor: move;
}
.n-promotion{
padding-top:2.5rem;
}
.n-promotion .tit-h {
display: inline-block;
padding: 0 80px;
line-height: 1.5;
position: relative;
}
.n-promotion .tit-h:before {
content: "";
position: absolute;
width: 35px;
height: 1px;
background: #e7e7e7;
left: 0;
top: 50%;
}
.n-promotion .tit-h:after {
content: "";
position: absolute;
width: 30px;
height: 1px;
background: #e7e7e7;
right: 0;
top: 50%;
}
.promotion-box{
margin-top:1.2rem;
}
.errors-alert .md-content {
width: 450px;
height: auto;
padding: 1.25rem;
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
}
.errors-alert .md-content .tit1 {
line-height: 1.5;
margin-bottom:1rem;
}
.errors-alert .md-content .coad-box {
width: 100%;
margin-top: 1rem;
margin-bottom: .5rem;
}
.errors-alert .md-content {
background: #fff;
}
.errors-alert .md-close {
position: absolute;
width: 40px;
height: 40px;
right: 5px;
top: 5px;
cursor: pointer;
}
.errors-alert .md-close:before {
position: absolute;
font-size: 30px;
left: 50%;
top: 50%;
width: 30px;
height: 30px;
-webkit-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
color: #333;
}
.errors-alert .coad-button {
width: 100%;
height: 50px;
line-height: 50px;
text-align: center;
background: #f8f8f8;
display: block;
cursor: pointer;
box-shadow: inset 0px 0px 0px 1px #eee;
}
.errors-alert .coad-button p {
position: relative;
z-index: 2;
font-size: 16px;
color: #e60012;
-webkit-transition: all .3s ease;
transition: all .3s ease;
}
.errors-alert .coad-button:before {
z-index: 1;
background: #cb0f1e;
width: 600px;
height: 200px;
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
-webkit-transform: translate(-50%, -50%) scale(0);
-ms-transform: translate(-50%, -50%) scale(0);
transform: translate(-50%, -50%) scale(0);
}
.errors-alert .coad-button:hover p {
color: #fff;
}
.errors-alert .coad-button:hover:before {
-webkit-transform: translate(-50%, -50%) scale(1);
-ms-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.n-news-sreach .tit-h {
display: inline-block;
padding: 0 80px;
line-height: 1.5;
position: relative;
}
.n-news-sreach .tit-h:before {
content: "";
position: absolute;
width: 35px;
height: 1px;
background: #e7e7e7;
left: 0;
top: 50%;
}
.n-news-sreach .tit-h:after {
content: "";
position: absolute;
width: 30px;
height: 1px;
background: #e7e7e7;
right: 0;
top: 50%;
}
.n-news-sreach{
padding-top:2rem;
min-height:600px;
}
.bd_weixin_popup{
width:260px !important;
height: 320px !important;
}
/*鏂板姞杞﹀瀷搴曢儴棰勭害*/
.fot-alert .md-content {
width: 100%;
height: auto;
padding: 1.25rem;
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
}
.fot-alert .md-content .tit1 {
line-height: 1.5;
margin-bottom:.2rem;
}
.fot-alert .md-content .tit2 {
margin-top:5px;
line-height:1.5;
}
.fot-alert .md-content {
background: #fff;
}
.fot-alert .md-content .img {
text-align: center;
}
.fot-alert .md-content .img img{
max-width:100%;
display: inline-block;
}
.fot-alert .md-close {
position: absolute;
width: 40px;
height: 40px;
right: 5px;
top: 5px;
cursor: pointer;
}
.fot-alert .md-close:before {
position: absolute;
font-size: 30px;
left: 50%;
top: 50%;
width: 30px;
height: 30px;
-webkit-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
color: #333;
}
.fot-alert .coad-button:before {
z-index: 1;
background: #cb0f1e;
width: 600px;
height: 200px;
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
-webkit-transform: translate(-50%, -50%) scale(0);
-ms-transform: translate(-50%, -50%) scale(0);
transform: translate(-50%, -50%) scale(0);
}
.fot-alert .coad-button:hover p {
color: #fff;
}
.fot-alert .coad-button:hover:before {
-webkit-transform: translate(-50%, -50%) scale(1);
-ms-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.fot-alert{
position: fixed;
top: 50%;
left: 50%;
width: 50%;
max-width:400px;
min-width: 320px;
height: auto;
z-index: 2000;
visibility: hidden;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}
.fot-overlay {
position: fixed;
width: 100%;
height: 100%;
visibility: hidden;
top: 0;
left: 0;
z-index: 1000;
opacity: 0;
background: rgba(0, 0, 0,0.5);
-webkit-transition: all 0.3s;
transition: all 0.3s;
}
.fot-alert.md-show ~ .fot-overlay {
opacity: 1;
visibility: visible;
}
.fot-alert.md-show ~ .md-close {
opacity: 1;
visibility: visible;
}
.n-join .lista .join-list .button-btn3 {
width: 130px;
height: 45px;
line-height: 45px;
text-align: center;
color: #fff;
background: #d00010;
display: inline-block;
position: relative;
}
.n-join .lista .join-list .button-btn3 p {
position: relative;
z-index: 2;
-webkit-transition: all .3s ease;
transition: all .3s ease;
}
.n-join .lista .join-list .button-btn3:before {
z-index: 1;
background: #c0000f;
width: 250px;
height: 100px;
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
-webkit-transform: translate(-50%, -50%) scale(0);
-ms-transform: translate(-50%, -50%) scale(0);
transform: translate(-50%, -50%) scale(0);
}
.n-join .lista .join-list .button-btn3:hover p {
color: #fff;
}
.n-join .lista .join-list .button-btn3:hover:before {
-webkit-transform: translate(-50%, -50%) scale(1);
-ms-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.n-join .join-list-ajax .joins {
padding:1rem;
background:#f9f9f9;
border-top: 1px solid #cccccc;
display: none;
}
.n-join .join-list-ajax .joins .join-info .p{
font-size:16px;
color:#666;
line-height:1.8;
margin-bottom:.7rem;
}
.n-join .join-list-ajax .joins .join-info .p .tit1{
font-size:18px;
color:#000;
line-height: 1.5;
margin-bottom:.5rem;
}
.n-news-sreach .w1660{
margin-top:1.5rem;
}
.car_model .img-icon-dan{
width:104px;
height:73px;
position: absolute;
right:.5rem;
bottom:.5rem;
}
.pc-sub-scroll{
height: 66px;
position: relative;
}
.nav-car_buying.scroll{
position:fixed;
background:#fff;
left:0;
top:70px;
width: 100%;
box-shadow:0px 0px 4px 0px rgba(0,0,0,.1);
border-bottom:none;
z-index: 3;
}
.tips-alert .md-content {
width: 100%;
height: auto;
background:#fff;
border-radius:5px;
box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.1);
}
.tips-alert .md-content .tit1 {
line-height: 1.5;
height:60px;
line-height:60px;
text-align:center;
background:#ebebeb;
}
.tips-alert .md-content .tit2 {
line-height: 1.5;
margin-bottom:.2rem;
padding: 1.25rem;
color:#333;
text-align:center;
}
.tips-alert .md-close {
position: absolute;
width: 40px;
height: 40px;
right: 5px;
top: 5px;
cursor: pointer;
}
.tips-alert .md-close:before {
position: absolute;
font-size: 30px;
left: 50%;
top: 50%;
width: 30px;
height: 30px;
-webkit-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
color: #333;
}
.tips-alert .coad-button:before {
z-index: 1;
background: #cb0f1e;
width: 600px;
height: 200px;
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
-webkit-transform: translate(-50%, -50%) scale(0);
-ms-transform: translate(-50%, -50%) scale(0);
transform: translate(-50%, -50%) scale(0);
}
.tips-alert .coad-button:hover p {
color: #fff;
}
.tips-alert .coad-button:hover:before {
-webkit-transform: translate(-50%, -50%) scale(1);
-ms-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.tips-alert{
position: fixed;
top: 50%;
left: 50%;
width: 50%;
max-width:400px;
min-width: 320px;
height: auto;
z-index: 2000;
visibility: hidden;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}
.tips-overlay {
position: fixed;
width: 100%;
height: 100%;
visibility: hidden;
top: 0;
left: 0;
z-index: 1000;
opacity: 0;
background: rgba(0, 0, 0,0.5);
-webkit-transition: all 0.3s;
transition: all 0.3s;
}
.tips-alert.md-show ~ .tips-overlay {
opacity: 1;
visibility: visible;
}
.tips-alert.md-show ~ .md-close {
opacity: 1;
visibility: visible;
}
.con-left .li-item .li{
text-align: center;
margin:0;
padding:0 .2rem;
}
.con-left .li-item{
overflow: hidden;
}
.md-content-img #panoramaConianerm,.md-content-img #panoramaConianer1{
cursor: pointer;
}
.n-configure .con-left .wli-item{
margin-top: .85rem;
height:60px;
background: #fff url(../images/img52.jpg) no-repeat center bottom;
background-size: 100% auto;
position: relative;
margin-bottom: 2rem;
}
.n-configure .con-left .li-item {
padding-bottom: 25px;
width:100%;
overflow: hidden;
background:#fff;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: start;
-webkit-align-items: flex-start;
-ms-flex-align: start;
align-items: flex-start;
}
.n-configure .con-left .li-item .li {
font-size: 15px;
line-height: 24px;
color: #222;
position: relative;
padding-top: 10px;
text-align: center;
margin: 0;
}
.n-configure .con-left .li-item .li:before {
content: "";
left: 50%;
top: 0;
opacity: 0;
-webkit-transform: translate(-50%, -10px);
-ms-transform: translate(-50%, -10px);
transform: translate(-50%, -10px);
border-left: 5px solid transparent;
border-right: 5px solid transparent;
border-top: 5px solid #e70e1e;
position: absolute;
-webkit-transition: all .5s ease;
transition: all .5s ease;
}
.n-configure .con-left .li-item .li:hover:before, .n-configure .con-left .li-item .li.cur:before {
opacity: 1;
-webkit-transform: translate(-50%, 0);
-ms-transform: translate(-50%, 0);
transform: translate(-50%, 0);
}
.n-configure .con-left .wli-item{
height: 66px;
position: relative;
}
.n-configure .con-left .li-item.scroll{
position:fixed;
background:#fff;
left:calc((100% - 1280px)/2);
top:78px;
width:calc(1280px * 0.68);
box-shadow:0px 0px 4px 0px rgba(0,0,0,.1);
border-bottom:none;
padding:15px 30px;
z-index: 3;
}
.drive-info .img img{
width:100%;
}
.news-info .info-box-left .text table{
width:100% !important;
}
.news-info .info-box-left .text table td{
padding:10px !important;
}
.upload-container a{
color: #333;
}
.mainImage__scroll {
width: 21px;
position: absolute;
left: 50%;
margin-left: -10px;
bottom: 50px;
z-index: 3;
transform: translateZ(0);
-moz-transform: translateZ(0);
-o-transform: translateZ(0);
-ms-transform: translateZ(0);
-webkit-transform: translateZ(0);
transition: all .2s ease-out;
-moz-transition: all .2s ease-out;
-o-transition: all .2s ease-out;
-webkit-transition: all .2s ease-out;
transform-origin: center bottom;
moz-transform-origin: center bottom;
-o-transform-origin: center bottom;
-ms-transform-origin: center bottom;
-webkit-transform-origin: center bottom;
-webkit-perspective: 500px;
perspective: 500px;
}
.mainImage__scroll:before{
content:"";
position: absolute;
width: 21px;
height: 35px;
border: 1px solid #fff;
border-radius: 20px;
-webkit-border-radius: 20px;
-moz-border-radius: 20px;
-ms-border-radius: 20px;
box-sizing: border-box;
-webkit-box-sizing: border-box;
-moz-box-sizing: border-box;
}
.mainImage__scrollIcon {
position: absolute;
top: 8px;
left: 10px;
z-index: 2;
display: block;
margin: 0 auto;
width: 1px;
height: 8px;
background: #fff;
-webkit-animation: fadeOutDown 2s infinite;
animation: fadeOutDown 2s infinite;
-webkit-animation-fill-mode: both;
animation-fill-mode: both;
}
.mainImage__scroll:after {
content:"";
position: absolute;
top: 18px;
left: 10px;
width: 1px;
height: 50px;
background: #fff;
}
@-webkit-keyframes fadeOutDown {
0% {
opacity:1;
-webkit-animation-timing-function:cubic-bezier(.04,.35,.25,.98);
animation-timing-function:cubic-bezier(.04,.35,.25,.98)
}
50% {
opacity:0;
height:2px;
top:20px
}
100% {
opacity:0;
top:20px
}
}
@keyframes fadeOutDown {
0% {
opacity:1;
-webkit-animation-timing-function:cubic-bezier(.04,.35,.25,.98);
animation-timing-function:cubic-bezier(.04,.35,.25,.98)
}
50% {
opacity:0;
height:2px;
top:20px
}
100% {
opacity:0;
top:20px
}
}
.sidebar-box .jin-box{
width:150px;
position: absolute;
text-align:center;
height:62px;
line-height:42px;
padding:10px;
font-size:16px;
color:#fff;
background-color: #831526;
position: absolute;
right:64px;
top:0;
transform:translate(100%,0);
transition: all 1s ease;
z-index:1;
}
.sidebar-box .itembox .por{
z-index:3;
background:#831526;
}
.sidebar-box .itembox.alert_sf{
overflow: inherit;
}
.sidebar-box .itembox:hover .jin-box{
transform:translate(0%,0);
}
.news-info .back-btn a {
height: 45px;
line-height: 45px;
font-size: 16px;
margin: 15px 0px;
display: block;
width: 130px;
text-align:center;
box-shadow: inset 0px 0px 0px 2px rgba(0,0,0,.5);
}
.news-info .back-btn p{
display: inline-block;
color: #333;
position: relative;
z-index: 2;
padding-right:20px;
-webkit-transition: all .5s ease;
-o-transition: all .5s ease;
transition: all .5s ease;
}
.news-info .back-btn p:before{
right:5px;
font-size:14px;
position: absolute;
-webkit-transition: all .2s ease;
-o-transition: all .2s ease;
transition: all .2s ease;
}
.news-info .back-btn a.hover_1:before {
z-index: 1;
background: #d00010;
width: 250px;
height: 120px;
-webkit-transform-origin: left center;
-ms-transform-origin: left center;
transform-origin: left center;
-webkit-transform: translate(-50%, -50%) scale(0);
-ms-transform: translate(-50%, -50%) scale(0);
transform: translate(-50%, -50%) scale(0);
}
.news-info .back-btn a.hover_1:hover:before {
-webkit-transform: translate(-50%, -50%) scale(1);
-ms-transform: translate(-50%, -50%) scale(1);
transform: translate(-50%, -50%) scale(1);
}
.news-info .back-btn a.hover_1:hover p{
color:#fff;
}
.news-info .back-btn a.hover_1:hover p:before{
-webkit-transition: all .5s ease;
-o-transition: all .5s ease;
transition: all .5s ease;
right:0px;
}
.n-configure .con-right.scroll{
position:fixed;
top:78px;
width:calc(1280px * 0.29);
right:calc((100% - 1280px)/2);
}
.n-configure .con-left{
position: relative;
z-index: 2;
}
.n-configure .con-right.on{
top:-200px;
}
.n-configure .con-left .li-item{
position: relative;
padding:0 30px;
}
.n-configure .con-left .swiper-button-next, .n-configure .con-left .swiper-container-rtl .swiper-button-prev,.n-configure .con-left .swiper-button-prev, .n-configure .con-left .swiper-container-rtl .swiper-button-next{
background:#fff !important;
width:30px;
margin-top: -18px;
background:#fff;
text-align: center;
}
.n-configure .con-left .swiper-button-next{
right:0;
}
.n-configure .con-left .swiper-button-prev{
left:0;
}
.n-configure .con-left .swiper-button-next:before, .n-configure .con-left .swiper-button-prev:before{
font-size:16px;
line-height:44px;
position: absolute;
left:50%;
margin-left:-8px;
}
.n-configure .con-left .swiper-button-next:before{
transform:rotate(-180deg);
}
.n-configure .con-left .li-item.scroll .swiper-button-next,.n-configure .con-left .li-item.scroll .swiper-button-prev{
margin-top: -17px;
}
.news-info .info-box-left{
min-height:800px;
}
.news-info .info-box-right .li:first-child{
padding-top:0;
}
.news-info .info-box-right .li{
padding:15px 0;
border-bottom: 1px solid #f2f1f1;
}
.n-derler .mapbox .map-list .mCSB_inside>.mCSB_container{
margin-right:0px !important;
}
@media (max-width: 1360px) {
.n-configure .con-left .li-item.scroll{
left:6%;
width:calc(88% * 0.68);
}
.n-configure .con-right.on{
top:-180px;
}
.n-configure .con-right.scroll{
position:fixed;
top:70px;
width:calc(88% * 0.29);
right:6%;
}
}
@media (max-width: 1023px) {
.nav-car_buying.scroll{
top:0px;
}
.n-car_buying .listb .eventbox .img{
height:120px;
}
.n-configure .con-left .li-item.scroll{
left:6%;
width:calc(88% * 0.60);
}
}
.news-info .info-box-left .text img{
height: auto !important;
width:auto !important;
}
/*ix5杞﹀瀷*/
.ix5-lista .carajax-360 {
position: relative;
z-index: 1;
}
.ix5-lista #carimg {
margin-top: -5rem;
}
.ix5-lista .ultab .li:last-child:before {
display: none;
}
.listix-1 {
background: url(../images/ix2.jpg) no-repeat center;
background-size: cover;
height: 22.5rem;
}
.listix-1 .text-ix5 {
padding: 3.5rem 0 0 6.25rem;
}
.listix-1 .libox {
display: flex;
display: -webkit-flex;
flex-flow: column nowrap;
justify-content: flex-start;
align-items: flex-start;
width: 350px;
}
.listix-1 .libox .img {
margin-right: .5rem;
}
.listix-1 .libox .li {
padding: .6rem 0;
width: 100%;
display: flex;
display: -webkit-flex;
flex-flow: row nowrap;
justify-content: flex-start;
align-items: flex-start;
border-bottom: 1px solid rgba(51, 65, 73, 0.5);
}
.listix-2 {
padding: 2.5rem 0 1.25rem;
background: url(../images/ix3.jpg) no-repeat center;
background-size: cover;
}
.listix-2 .tit-title {
margin-bottom: 0;
}
.listix-2 .title-tit2 {
color: #ededed;
position: relative;
padding: 0 2rem;
display: inline-block;
}
.listix-2 .title-tit2:after {
content: "";
position: absolute;
width: 1.5rem;
height: 1px;
background: rgba(237, 237, 237, 0.2);
right: 0;
top: 50%;
}
.listix-2 .title-tit2:before {
content: "";
position: absolute;
width: 1.5rem;
height: 1px;
background: rgba(237, 237, 237, 0.2);
left: 0;
top: 50%;
}
.listix-2 .car-img {
margin-top: 4.75rem;
text-align: center;
}
.listix-2 .car-img img {
max-width: 100%;
}
.listix-2 .bot-li {
display: flex;
display: -webkit-flex;
flex-flow: row nowrap;
justify-content: center;
align-items: center;
text-align: center;
margin-top: 1.25rem;
}
.listix-2 .bot-li .img {
margin-right: .5rem;
}
.listix-2 .bot-li .li {
padding: 0 1.5rem;
display: flex;
display: -webkit-flex;
flex-flow: row nowrap;
justify-content: center;
align-items: center;
text-align: left;
border-right: 1px solid rgba(255, 255, 255, 0.2);
}
.listix-2 .bot-li .li:nth-child(4n) {
border-right: none;
}
.listix-3 {
height: 20rem;
padding-top: 1.75rem;
position: relative;
background: url(../images/ix4.jpg) no-repeat center;
background-size: cover;
}
.listix-3 .bot-li {
display: flex;
display: -webkit-flex;
flex-flow: row nowrap;
justify-content: center;
align-items: center;
text-align: center;
margin-top: 1.25rem;
}
.listix-3 .bot-li .img {
margin-right: .5rem;
}
.listix-3 .bot-li .li {
padding: 0 1.5rem;
display: flex;
display: -webkit-flex;
flex-flow: row nowrap;
justify-content: center;
align-items: center;
text-align: left;
border-right: 1px solid rgba(255, 255, 255, 0.2);
}
.listix-3 .bot-li .li:nth-child(4n) {
border-right: none;
}
.listix-4 .imgbox {
width: 100%;
}
.listix-4 .imgbox img {
width: 100% !important;
}
.listix-2 .title-tit2{
letter-spacing: 10px;
}
/*2018-10-08*/
.i-lista .carbox .botbox .buttonbox{
height:50px;
line-height:50px;
}
.i-lista .carbox .botbox .buttonbox p{
line-height:50px;
height:50px;
}
.i-lista .carbox .botbox .buttonbox:nth-child(1){
background:#d00010;
box-shadow:none;
}
.i-lista .carbox .botbox .buttonbox:nth-child(1):hover:before{
background:#b3000e;
}
/*xin-330杞﹀瀷*/
.x330-lista .carajax-360 {
position: relative;
z-index: 1;
}
.x330-lista .ultab .li:last-child:before {
display: none;
}
.list330-1 {
padding: 2.25rem 0 1.5rem;
background: #fff;
}
.list330-1 .imgcar {
background-position: center center;
background-size: cover;
height: 12rem;
margin-top: 1.7rem;
}
.list330-1 .car330 {
width: 13.5rem;
height: 14.25rem;
margin: -8.75rem 0 0;
}
.list330-2 {
height: 22.25rem;
position: relative;
}
.list330-2 .bot-li {
display: flex;
display: -webkit-flex;
flex-flow: row nowrap;
justify-content: center;
align-items: center;
text-align: center;
margin-top: 1.25rem;
}
.list330-2 .bot-li .img {
margin-right: .5rem;
}
.list330-2 .bot-li .li {
padding: 0 1rem;
display: flex;
display: -webkit-flex;
flex-flow: row nowrap;
justify-content: center;
align-items: center;
text-align: left;
border-right: 1px solid rgba(255, 255, 255, 0.2);
}
.list330-2 .bot-li .li:nth-child(4n) {
border-right: none;
}
.list330-2 .carbg-list {
position: absolute;
height: 100%;
width: 100%;
left: 0;
top: 0;
z-index: 1;
}
.list330-2 .carbg-list .swiper-slide {
background-size: cover;
background-repeat: no-repeat;
background-position: center center;
padding-top: 2.1rem;
}
.list330-2 .carbg-list .swiper-pagination {
bottom: 1.5rem;
}
.list330-2 .carbg-list .swiper-pagination span {
width: 16px;
height: 16px;
margin: 0 10px;
display: inline-block;
border-radius: 100%;
background: none;
opacity: 1;
box-shadow: inset 0px 0px 0px 2px #d6d6d6;
position: relative;
transition: all .5s ease;
}
.list330-2 .carbg-list .swiper-pagination span:before {
content: "";
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
background: #a6a6a6;
opacity: 0;
border-radius: 50%;
transform: scale(0, 0);
transition: all .5s ease;
}
.list330-2 .carbg-list .swiper-pagination span.swiper-pagination-bullet-active {
box-shadow: inset 0px 0px 0px 2px #a6a6a6;
}
.list330-2 .carbg-list .swiper-pagination span.swiper-pagination-bullet-active:before {
opacity: 1;
transform: scale(1, 1);
}
.list330-3 {
padding: 2.5rem 0 2.25rem;
text-align: center;
background: url(../images/x330-6.jpg) no-repeat center center;
background-size: cover;
}
.list330-3 .twocar-img {
width: 17rem;
height: 16.75rem;
margin: 1rem auto 0;
position: relative;
overflow: hidden;
}
.list330-3 .twocar-img img {
display: block;
width: 100%;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.list330-3 .twocar-img .imgs {
position: absolute;
left: 0;
top: 0;
width: 50%;
height: 100%;
overflow: hidden;
-webkit-user-select: none;
-moz-user-select: none;
-ms-user-select: none;
user-select: none;
}
.list330-3 .twocar-img .point {
width: 1px;
position: absolute;
left: 50%;
top: 0;
background-color: #fff;
height: 100%;
cursor: pointer;
}
.list330-3 .twocar-img .point i {
margin-left: -25px;
margin-top: -25px;
position: absolute;
left: 50%;
top: 50%;
width: 50px;
height: 50px;
cursor: pointer;
z-index: 5;
background: url(../images/x330-14.png) center center no-repeat;
background-size: cover;
}
.configure-list .all-cbtn {
margin-top: .6rem;
height: 50px;
line-height: 50px;
display: block;
background: #da3830;
width: 190px;
margin: .7rem auto 0;
font-size: 14px;
text-align: center;
z-index: 2;
cursor: pointer;
transition: all .5s ease;
}
.configure-list .all-cbtn p {
display: inline-block;
color: #fff;
position: relative;
z-index: 2;
padding-right: 20px;
}
.configure-list .all-cbtn p:before {
font-size: 12px;
color: #fff;
position: absolute;
right: 0;
}
.configure-list .hover_1:before {
z-index: 1;
background: #d00010;
width: 250px;
height: 120px;
transform-origin: left center;
transform: translate(-50%, -50%) scale(0);
}
.configure-list .hover_1:hover:before {
transform: translate(-50%, -50%) scale(1);
}
.all-configurebox {
background: #fff;
position: fixed;
width: 100%;
height: 100vh;
left: 0;
top: 0;
z-index: 99;
display: none;
overflow-x: auto;
}
.all-configurebox .n-configurebox {
min-width: 1200px;
}
.all-configurebox .top-l {
padding: 0 10px;
height: 70px;
line-height: 70px;
display: flex;
flex-flow: row nowrap;
justify-content: flex-start;
align-content: flex-start;
float: left;
}
.all-configurebox .top-l span {
padding: 0 .5rem;
}
.all-configurebox .top-l .sp1 {
position: relative;
}
.all-configurebox .top-l .sp1:before {
content: "";
width: 1px;
height: 36px;
background: #b2b2b2;
right: 0;
top: 50%;
margin-top: -18px;
position: absolute;
}
.all-configurebox .configurebox-close {
width: 40px;
height: 40px;
/*position: absolute;*/
float: right;
margin-right: 1rem;
margin-top: 15px;
text-align: center;
cursor: pointer;
}
.all-configurebox .configurebox-close:before {
color: #000;
font-size: 30px;
line-height: 40px;
}
.all-configurebox .tablebox table td, .all-configurebox .tablebox th {
border-top: solid 1px #d5d5d5;
box-sizing: border-box;
padding: 12px 8px;
text-align: center;
word-break: break-all;
}
.all-configurebox .tablebox table {
width: 100%;
background: #ececec;
border-collapse: collapse;
border-spacing: 0;
}
.all-configurebox .tablebox table td {
font-size: 13px;
color: #575757;
border-left: solid 1px #d5d5d5;
}
.all-configurebox .tablebox table .price th {
background: #fff;
border-top: solid 1px #d5d5d5;
border-bottom: solid 1px #d5d5d5;
}
.all-configurebox .tablebox table .price td {
background: #fff;
border-top: solid 1px #d5d5d5;
border-left: solid 1px #d5d5d5;
border-bottom: solid 1px #d5d5d5;
color: #161616;
}
.all-configurebox .tablebox table tr.title {
background: #414141;
color: #fff;
cursor: pointer;
}
.all-configurebox .tablebox table tr.title td {
border-left: none;
text-align: right;
}
.all-configurebox .tablebox table tr.title td i {
margin-right: 15px;
}
.all-configurebox .tablebox table tr.title td i:before {
font-size: 24px;
color: #fff;
}
.all-configurebox .table .table-2 {
background: #fff;
width: 100%;
}
.all-configurebox .table-wrap {
touch-action: auto !important;
}
.all-configurebox .table-wrap.mCS_touch_action {
touch-action: auto !important;
}
.all-configurebox .table-wrap .mCSB_scrollTools {
width: 4px;
}
.all-configurebox .table-wrap .mCSB_scrollTools .mCSB_dragger .mCSB_dragger_bar {
background-color: rgba(244, 19, 19, 0.75);
border-radius: 0;
}
.all-configurebox .table-wrap .mCSB_inside > .mCSB_container {
margin-right: 0;
}
.ovh-w {
width: 100%;
height: 100%;
position: fixed;
left: 0;
top: 0;
overflow: hidden;
}
.all-configurebox .tablebox table td, .all-configurebox .tablebox th{
padding: 8px;
}
.all-configurebox .tablebox table tr.title{
background: none;
color: #000;
}
.all-configurebox .tablebox table tr.title td i:before{
color: #000;
}
.all-configurebox .tablebox table tr.expand{
background: #414141;
color: #fff;
}
.all-configurebox .tablebox table tr.expand td i:before{
color: #fff;
}
.n-configurebox .table-wrap .p{
padding: .5rem 1.75rem;
line-height:1.8;
font-size:14px;
color:#666;
}
.n-configure .con-right .contrast-button{
position:relative;
z-index:1;
}
.bocweb-footer .top .fxbox a{
margin: 0 4px !important;
}
.bocweb-footer .top .fxbox .bds_app {
background: url(../images/img5-5.png) no-repeat center;
}
.list-step-box{
position:relative;
}
.list-step-box .close{
width:40px;
height:40px;
position: absolute;
font-size:24px;
color:#333;
right: .5rem;
top: .5rem;
text-align: center;
line-height: 40px;
cursor:pointer;
}
/*xin-ix5杞﹀瀷*/
.itemix5-1 {
background: url(../images/img1.jpg) no-repeat center;
background-size: cover;
padding: 3.375rem 3.375rem 0;
height: 19.5rem;
}
.itemix5-1 .text {
display: flex;
flex-flow: row wrap;
justify-content: flex-start;
align-items: center;
margin-left: 5.5rem;
}
.itemix5-1 .text .title {
font-size: 1.25rem;
padding: .5rem .635rem;
border: 1px solid #fff;
border-radius: 5px;
color: #fff;
letter-spacing: 5px;
}
.itemix5-1 .text .p1 {
font-size: 15px;
color: #2ea1df;
line-height: 1.6;
margin-left: 1rem;
}
.itemix5-box {
display: flex;
flex-flow: row wrap;
justify-content: flex-start;
align-items: flex-start;
}
.itemix5-box .p2 {
width: 14rem;
color: #fff;
font-size: 15px;
line-height: 1.6;
margin-left: 2.35rem;
}
.itemix5-box .p2 .li-item {
margin-bottom: .75rem;
}
.itemix5-box .p2 .tit1 {
font-size: .6rem;
color: #2ea1df;
font-weight: bold;
margin-bottom: .3rem;
}
.itemix5-box .text .n-text {
display: flex;
flex-flow: row wrap;
justify-content: flex-start;
align-items: center;
}
.itemix5-box .text .n-text .img {
padding-right: .75rem;
position: relative;
}
.itemix5-box .text .n-text .img img {
max-width: 100%;
}
.itemix5-box .text .n-text .img:before {
content: "";
position: absolute;
right: 0;
width: 4px;
height: 109px;
top: 50%;
margin-top: -54px;
background: url(../images/img2.png) no-repeat center top;
background-size: 100% 100%;
}
.itemix5-box .text .p1 {
font-size: 15px;
color: #fff;
line-height: 1.6;
margin-left: .75rem;
}
.itemix5-box .more-btn {
width: 150px;
height: 45px;
line-height: 45px;
border-radius: 45px;
box-shadow: inset 0px 0px 0px 1px #fff;
margin-top: .6rem;
font-size: 15px;
position: relative;
text-align: center;
cursor: pointer;
transition: all .3s ease-in-out;
}
.itemix5-box .more-btn:before {
width: 350px;
height: 200px;
left: 0px;
/*top: 50%;*/
background: #e60012;
}
.itemix5-box .more-btn p {
position: relative;
z-index: 2;
display: inline-block;
color: #fff;
padding-right: 20px;
}
.itemix5-box .more-btn p:before {
position: absolute;
right: 0;
font-size: 14px;
}
.itemix5-box .more-btn:hover {
box-shadow: inset 0px 0px 0px 1px #e60012;
}
.itemix5-2 {
background: url(../images/img2.jpg) no-repeat center;
background-size: cover;
padding: 2.25rem 3.375rem 0;
height: 19.5rem;
}
.itemix5-3 {
background: url(../images/img3.jpg) no-repeat center;
background-size: cover;
padding: 11rem 3.375rem 0;
height: 19.5rem;
}
.itemix5-4 {
background: url(../images/img5.jpg) no-repeat center;
background-size: cover;
padding: 2.25rem 3.375rem 0;
height: 22.8rem;
}
.itemix5-5 {
background: url(../images/img6.jpg) no-repeat center;
}
.itemix5-6 {
background: url(../images/img7.jpg) no-repeat center;
background-size: cover;
padding: 11rem 3.375rem 0;
height: 19.5rem;
justify-content: flex-end;
}
.itemix5-7 {
background: url(../images/img8.jpg) no-repeat center;
background-size: cover;
padding: 4.2rem 3.375rem 0;
height: 19.5rem;
justify-content: flex-end;
}
.itemix5-8 {
background: url(../images/img9.jpg) no-repeat center;
background-size: cover;
padding: 2.25rem 3.375rem 0;
height: 19.5rem;
}
.itemix5-9 {
background: url(../images/img10.jpg) no-repeat center;
background-size: cover;
padding: 2.25rem 3.375rem 0;
height: 19.5rem;
}
.itemix5-9 .text {
margin-left: 8rem;
}
.img-alert .md-content {
width: 100%;
height: auto;
padding: .5rem 3.25rem;
background: none;
}
.img-alert .md-close {
position: absolute;
width: 40px;
height: 40px;
font-size: 40px;
color: #fff;
right: 2.5rem;
top: 1.5rem;
cursor: pointer;
line-height: 40px;
text-align: center;
}
.img-alert {
position: fixed;
top: 50%;
left: 50%;
width: 100%;
max-width: 100%;
min-width: 320px;
height: auto;
z-index: 2000;
visibility: hidden;
-webkit-backface-visibility: hidden;
backface-visibility: hidden;
-webkit-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
transform: translateX(-50%) translateY(-50%);
}
.img-alert .imgbox-list {
width: 100%;
/*padding:0 3.25rem;*/
height: auto;
position: relative;
overflow: hidden;
}
.img-alert .imgbox-list .swiper-slide .text {
background: #fff;
padding: 1rem .75rem .5rem;
min-height: 1.6rem;
box-sizing: content-box;
font-size: 16px;
color: #222;
text-align:center;
}
.img-alert .md-content {
height: 100vh;
}
.img-alert .md-content .swiper-button-prev {
transform: translate(-80px, 0);
}
.img-alert .md-content .swiper-button-next, .img-alert .md-content .swiper-button-prev {
width: 80px;
height: 88px;
line-height: 88px;
text-align: center;
font-size: 1.5rem;
color: #fff;
margin-top: -44px;
opacity: 1;
transition: all .3s ease;
background: none !important;
opacity: 0;
}
.img-alert .md-content .swiper-button-next {
transform: rotate(-180deg) translate(-80px, 0);
right: 0;
}
.img-alert .md-content:hover .swiper-button-prev {
opacity: 1;
transform: translate(0, 0);
}
.img-alert .md-content:hover .swiper-button-next {
opacity: 1;
transform: rotate(-180deg) translate(0, 0);
}
.img-alert .md-content .swiper-pagination {
bottom: 2.5rem;
width: 100%;
}
.img-alert .md-content .swiper-pagination span {
opacity: 1;
width: 1rem;
height: .2rem;
border-radius: .2rem;
display: inline-block;
background: #202225;
margin: 0 .2rem;
transition: all .3s ease-in-out;
}
.img-alert .md-content .swiper-pagination span.swiper-pagination-bullet-active {
background: #ffffff;
transform: scale(1.2, 1);
}
.fot-overlay {
position: fixed;
width: 100%;
height: 100%;
visibility: hidden;
top: 0;
left: 0;
z-index: 1000;
opacity: 0;
background: rgba(0, 0, 0, 0.5);
-webkit-transition: all 0.3s;
transition: all 0.3s;
}
.img-alert .imgbox-list {
top: 50%;
transform: translate(0, -50%);
}
.img-alert.md-show ~ .fot-overlay {
opacity: 1;
visibility: visible;
}
.img-alert.md-show ~ .md-close {
opacity: 1;
visibility: visible;
}
.img-alert .imgbox-list .swiper-wrapper.center{
justify-content: center;
}
.img-alert .md-content .swiper-pagination{
left:0;
}
.car-slide {
position: fixed;
z-index: 3;
left: 0;
bottom: 0;
width: 100%;
height: 70px;
background: url(../images/img17.png) no-repeat center;
background-size: cover;
}
.car-slide .car-slidebox {
width: 1270px;
height: 70px;
padding-left:120px;
margin: 0 auto;
display: -webkit-box;
display: -webkit-flex;
display: -ms-flexbox;
display: flex;
-webkit-box-pack: start;
-webkit-justify-content: flex-start;
-ms-flex-pack: start;
justify-content: flex-start;
-webkit-box-align: center;
-webkit-align-items: center;
-ms-flex-align: center;
align-items: center;
-webkit-flex-flow: row nowrap;
-ms-flex-flow: row nowrap;
flex-flow: row nowrap;
}
.car-slide .car-slidebox .title {
width: 200px;
margin-right: .5rem;
position:absolute;
right: calc(50vw + 550px);
text-align:left;
}
.car-slide .car-slidebox .input1 {
width: 135px;
height: 40px;
background: #fff;
padding: 5px 10px;
margin-right: 5px;
}
.car-slide .car-slidebox .input1 input {
background: none;
border: none;
line-height: 30px;
font-size: 14px;
color: #666;
width: 100%;
}
.car-slide .car-slidebox .input2 {
width: 190px;
height: 40px;
background: #fff;
padding: 5px 10px;
margin-right: 5px;
}
.car-slide .car-slidebox .input2 input {
background: none;
border: none;
line-height: 30px;
font-size: 14px;
color: #666;
width: 100%;
}
.car-slide .car-slidebox .input3 {
width: 115px;
height: 40px;
background: #fff;
padding: 5px 10px;
margin-right: 5px;
}
.car-slide .car-slidebox .input3 select {
background: none;
border: none;
height: 30px;
line-height: 30px;
font-size: 14px;
color: #666;
width: 100%;
}
.car-slide .car-slidebox .input4 {
width: 245px;
height: 40px;
background: #fff;
padding: 5px 10px;
margin-right: .5rem;
}
.car-slide .car-slidebox .input4 select {
background: none;
border: none;
height: 30px;
line-height: 30px;
font-size: 14px;
color: #666;
width: 100%;
}
.car-slide .car-slidebox .text {
display: flex;
flex-flow: row wrap;
padding-left: 30px;
margin-right: .75rem;
width: 140px;
position: relative;
/*padding-left:30px;
background:url(../images/img18.png) no-repeat left top;
margin-right:.75rem;*/
}
.car-slide .car-slidebox .text .inputbox {
position: absolute;
left: 0;
top: 0;
width: 18px;
height: 18px;
}
.car-slide .car-slidebox .text .inputbox .input2 {
appearance: none;
-webkit-appearance: none;
outline: none;
width: 18px;
height: 18px;
opacity: 0;
top: 3px;
position: relative;
z-index: 2;
margin-right: 15px;
}
.car-slide .car-slidebox .text .inputbox .input2:checked + span {
background: url(../images/img18.png) no-repeat center center;
}
.car-slide .car-slidebox .text .inputbox .input2 + span {
width: 18px;
height: 18px;
border: 1px solid #fff;
position: absolute;
left: 0;
top: 3px;
z-index: 1;
}
.car-slide .car-slidebox .tit3 {
position: relative;
display: inline-block;
padding-bottom: 5px;
cursor: pointer;
}
.car-slide .car-slidebox .tit3:before {
content: "";
position: absolute;
width: 100%;
bottom: 0;
height: 1px;
background: #de6a71;
}
.car-slide .car-slidebox .car-bottonbox {
width: 130px;
text-align: center;
height: 40px;
line-height: 40px;
color: #020202;
background: #ffba41;
font-size: 16px;
}
@media (max-width: 1640px) {
.car-slide .car-slidebox .title .tit-20{
font-size:16px;
}
.car-slide .car-slidebox .title{
right: auto;
left:2%;
}
}
@media (max-width: 1480px){
.car-slide .car-slidebox{
padding-left: 220px;
}
.car-slide .car-slidebox .input4{
width:200px;
}
}
@media (max-width: 1270px){
.car-slide{
display:none;
}
}
.bocweb-footer .top .fxbox .bds_jd {
background: url(../images/img5-6.png) no-repeat center;
}
.index-banner-warp .i-banner .swiper-pagination {
width: 100%;
bottom: 75px;
}
.index-banner-warp .i-banner .swiper-pagination span {
width: 3px;
height: 3px;
margin: 0 7px;
position: relative;
}
.index-banner-warp .i-banner .swiper-pagination span:before {
content: "";
position: absolute;
width: 5px;
height: 5px;
background: #fff;
border-radius: 50%;
left: 50%;
top: 50%;
z-index: 2;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
-webkit-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
}
.index-banner-warp .i-banner .swiper-pagination span:after {
content: "";
position: absolute;
width: 0px;
height: 0px;
background: #fff;
border-radius: 50%;
left: 50%;
top: 50%;
z-index: 1;
-webkit-transform: translate(-50%, -50%);
-ms-transform: translate(-50%, -50%);
transform: translate(-50%, -50%);
-webkit-transition: all .3s ease-in-out;
transition: all .3s ease-in-out;
}
.index-banner-warp .i-banner .swiper-pagination span.swiper-pagination-bullet-active:before {
width: 9px;
height: 9px;
background: #c12025;
}
.index-banner-warp .i-banner .swiper-pagination span.swiper-pagination-bullet-active:after {
width: 15px;
height: 15px;
}
.index-banner-warp .i-banner .swiper-button-next, .index-banner-warp .i-banner .swiper-button-prev {
width: 50px;
height: 50px;
line-height: 50px;
text-align: center;
font-size: 24px;
color: #fff;
-webkit-transform: translate(0, -50%);
-ms-transform: translate(0, -50%);
transform: translate(0, -50%);
opacity: 1;
-webkit-transition: all .5s ease;
transition: all .5s ease;
opacity: 1;
cursor: pointer;
overflow: hidden;
background: transparent;
border-radius: 40px;
background: rgba(0, 0, 0, 0.3);
}
.index-banner-warp .i-banner .swiper-button-next:before, .index-banner-warp .i-banner .swiper-button-prev:before {
z-index: 4;
position: relative;
text-align: center;
display: block;
}
.index-banner-warp .i-banner .swiper-button-prev {
left: 2.5rem;
}
.index-banner-warp .i-banner .swiper-button-next.swiper-button-disabled, .index-banner-warp .i-banner .swiper-button-prev.swiper-button-disabled {
opacity: 1;
cursor: pointer;
pointer-events: visible;
}
.index-banner-warp .i-banner .swiper-button-next {
right: 2.5rem;
}
.index-banner-warp .i-banner .swiper-button-next:before {
-webkit-transform: rotate(-180deg);
-ms-transform: rotate(-180deg);
transform: rotate(-180deg);
}
.index-banner-warp .i-banner .swiper-button-prev:hover:before {
-webkit-animation: toRightFromRight 0.5s forwards;
animation: toRightFromRight 0.5s forwards;
}
.index-banner-warp .i-banner .swiper-button-next:hover:before {
-webkit-animation: toRightFromLeft 0.5s forwards;
animation: toRightFromLeft 0.5s forwards;
}
.index-banner-warp .i-banner .swiper-button-prev:hover {
background: rgba(0, 0, 0, 0.6);
/*-webkit-animation: pulse 0.5s ease-out forwards;
animation: pulse 0.5s ease-out forwards;*/
}
.index-banner-warp .i-banner .swiper-button-next:hover {
background: rgba(0, 0, 0, 0.6);
/*-webkit-animation: pulse 0.5s ease-out forwards;
animation: pulse 0.5s ease-out forwards;*/
}
@-webkit-keyframes toRightFromRight {
79% {
-webkit-transform: translate(-102%);
transform: translate(-102%);
}
80% {
-webkit-transform: translate(102%);
transform: translate(102%);
}
81% {
opacity: 1;
}
}
@keyframes toRightFromRight {
79% {
-webkit-transform: translate(-102%);
transform: translate(-102%);
}
80% {
-webkit-transform: translate(102%);
transform: translate(102%);
}
81% {
opacity: 1;
}
}
@-webkit-keyframes toRightFromLeft {
0%,100% {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
79% {
-webkit-transform: rotate(180deg) translate(-102%);
transform: rotate(180deg) translate(-102%);
}
80% {
-webkit-transform: rotate(180deg) translate(110%);
transform: rotate(180deg) translate(110%);
}
81% {
opacity: 1;
}
}
@keyframes toRightFromLeft {
0%,100% {
-webkit-transform: rotate(180deg);
transform: rotate(180deg);
}
79% {
-webkit-transform: rotate(180deg) translate(-102%);
transform: rotate(180deg) translate(-102%);
}
80% {
-webkit-transform: rotate(180deg) translate(110%);
transform: rotate(180deg) translate(110%);
}
81% {
opacity: 1;
}
}
/*# sourceMappingURL=style.css.map */
.ej{
position: relative;
}
.sj{
position: absolute;
left: 100%;width: 200px;background: #fff;box-shadow: 0px 2px 10px 0px rgba(0, 0, 0, 0.1);top: 0;display: none;
}
.ej:hover .sj{
display: block;
}
.sj a{
font-size: 14px!important;
}