html,body {
background-color: #000;
}
.w_100 {
width: 100%;
}
.fl {
float: left;
}
.fr {
float: right;
}
.yy-pc {
display: block;
}
.yy-wap {
display: none;
}
.yy-spe {
opacity: 0;
z-index: -1;
}
@media screen and (max-width:1000px){
.yy-pc {
display: none !important;
}
.yy-wap {
display: block;
}
}
/* kv */
.yy-container {}
/* video */
.yy-videoContainer {
position: relative;
overflow: hidden;
cursor: pointer;
}
.yy-videoContainer #video1 {
width: 100%;
}
.yy-videoContainer .yy-playBtn {
position: absolute;
left: 50%;
top: 50%;
width: 50px;
pointer-events: none;
opacity: .5;
transform: translateX(-50%) translateY(-50%);
-webkit-transform: translateX(-50%) translateY(-50%);
-moz-transform: translateX(-50%) translateY(-50%);
-ms-transform: translateX(-50%) translateY(-50%);
-o-transform: translateX(-50%) translateY(-50%);
}
@media screen and (max-width:1000px){
.yy-videoContainer .yy-playBtn {
position: absolute;
left: 0 !important;
right: 0;
top: 0 !important;
bottom: 0;
margin: auto;
cursor: pointer;
width: 15%;
opacity: 1;
transform: translateX(0) translateY(0);
-webkit-transform: translateX(0) translateY(0);
-moz-transform: translateX(0) translateY(0);
-ms-transform: translateX(0) translateY(0);
-o-transform: translateX(0) translateY(0);
}
}
/* 360 */
.yy-360Container {
position: relative;
}
.yy-360Container .yy-360Bg {
}
.yy-360Container .yy-360Content {
width: 62.5%;
left: 0;
right: 0;
margin: auto;
position: absolute;
}
/* 临时 */
.yy-360Container .yy-360Content .d-carframes {
position: absolute;
width: 100%;
height: 100%;
left: 0;
top: 0;
}
.yy-360Container .yy-360Content {
width: 100%;
height: 100%;
top: 0;
}
.yy-360Container .yy-360Content #carframes {
position: absolute;
width: 50%;
left: 0;
right: 0;
margin: auto;
top: 17%;
}
.yy-360Container .yy-cardContainer{
padding-left: 0 !important;
}
.yy-360Container .yy-cardContainer .yy-360Icon{
display: none;
}
.yy-360Container .yy-cardContainer ul li{
margin-left: 5.51%;
margin-right: 0 !important;
}
@media screen and (max-width:1000px){
.yy-360Container .yy-360Content #carframes {
position: absolute;
width: 86%;
top: 4%;
}
.yy-360Container .yy-cardContainer{
padding-left: 0% !important;
}
}
.yy-360Container .yy-360Content #carframes img {
width: 100%;
}
/* 临时 End */
.yy-360Container .yy-cardContainer {
max-width: 675px;
width: 60vw;
position: absolute;
left: 0;
right: 0;
bottom: 5%;
margin: auto;
background-color: rgba(255, 255, 255, .7);
border: 1px solid #fff;
padding-top: 0.5%;
padding-left: 1.5%;
padding-bottom: 0.5%;
}
.yy-360Container .yy-cardContainer ul {}
.yy-360Container .yy-cardContainer ul li {
float: left;
width: 8%;
margin-right: 5%;
cursor: pointer;
text-align: center;
}
.yy-360Container .yy-cardContainer ul li img {
width: 90%;
}
.yy-360Container .yy-cardContainer ul li.yy-act img {
border: 2px solid #8a8a8a;
}
.yy-360Container .yy-cardContainer .yy-360Icon {
position: absolute;
width: 9.44%;
top: -31%;
bottom: 0;
margin: auto;
right: 2%;
}
.yy-360Container .yy-cardContainer ul li p {
text-align: center;
color: #000;
font-weight: bold;
display: none;
font-size: 0.5vw;
}
.yy-360Container .yy-cardContainer ul li.yy-act p {
display: block;
margin-top: 10%;
}
@media screen and (max-width:1000px){
.yy-360Container .yy-cardContainer ul li p {
font-size: 1.5vw;
}
.d-carframes {
margin-top: 45%;
}
.yy-360Container .yy-360Content {
width: 100%;
}
.yy-360Container .yy-cardContainer {
width: 90%;
}
}
.colorBox{
position: relative;
}
.colorGroup{
width:100%;
position: absolute;
top: 0;
height: 120px;
display: flex;
align-items: center;
justify-content: center;
/* padding-left: 20px; */
/* background-color: rgb(245 245 245 / 90%); */
}
.yy-switchBtn{
width:180px;
height:40px;
line-height:40px;
color:white;
border:1px solid #fff;
background-color:transparent;
}
.lingtuoColor{
display:none;
}
.activeColor{
background-color:#cc0211 !important;
color:white !important;
border:1px solid #cc0211;
}
#switchColorBtn2{
margin-left: 20px;
}
.switchColorBtn1,.switchColorBtn2{
border: 1px solid #cc0211;
color: #cc0211;
font-size: 16px;
}
/* light */
.yy-lightContainer {
position: relative;
}
.yy-lightContainer .yy-lightTitContainer {
position: absolute;
width: 34%;
height: 28%;
top: 65%;
left: 19%;
}
.yy-lightContainer .yy-lightTitContainer .yy-moreLightBtn {
cursor: pointer;
width: 38%;
top: 80%;
animation: opacity-animation 2s infinite;
-webkit-animation: opacity-animation 2s infinite;
}
.yy-lightContainer .yy-lightTitContainer .more-gongyi {
cursor: pointer;
width: 38%;
top: 78%;
animation: opacity-animation 2s infinite;
-webkit-animation: opacity-animation 2s infinite;
}
.yy-lightContainer .yy-lightGongyiTitContainer {
position: absolute;
width: 29.16%;
top: 55%;
}
.yy-lightContainer .yy-lightGongyiTitContainer .yy-moreLightBtn {
cursor: pointer;
width: 38%;
animation: opacity-animation 2s infinite;
-webkit-animation: opacity-animation 2s infinite;
}
/* 1 */
.yy-light1Container .yy-light1TitContainer {
left: 0;
right: 0;
margin: auto;
top: -31%;
left: -63%;
display: flex;
flex-direction: column;
}
.yy-light1Container .yy-light1TitContainer .yy-moreLightBtn {
/* position: absolute;
width: 38%;
bottom: -5%;
right: 3%; */
/* display: flex;
justify-content: flex-start;
padding-left: 53px;
padding-top: 18px; */
display: flex;
/* justify-content: center; */
/* padding-top: 4%; */
padding-left: 3%;
}
/* 2 */
.yy-light2Container .yy-light2TitContainer {
left: 8%;
top: 27%;
}
.yy-light2Container .yy-light2TitContainer .yy-moreLightBtn {
margin-left: 5%;
}
/* 3 */
.yy-light3Container .yy-light3TitContainer {
left: 60%;
top: 13%;
}
.yy-light3Container .yy-light3TitContainer .yy-moreLightBtn {
margin-left: 5%;
}
/* 4 */
.yy-light4Container .yy-light4TitContainer {
left: 8%;
top: 16%;
}
.yy-light4Container .yy-light4TitContainer .yy-moreLightBtn {
margin-left: 5%;
}
.yy-lightContainer .yy-neishiTitContainer{
top: 65%;
left: 63%;
}
.yy-lightContainer .yy-xingnengTitContainer{
top: 15%;
left: 3%;
}
.yy-lightContainer .yy-anquanTitContainer{
top: 70%;
left: 4%;
}
.yy-lightContainer .yy-kejiTitContainer{
top: 63%;
left: 60%;
}
@media screen and (max-width:1000px){
.colorGroup{
width: 100%;
display: flex;
height: 70px;
position: absolute;
top: 0;
z-index: 2;
right: 0;
left:0;
margin: 0 auto;
justify-content: center;
}
.yy-light1Container .yy-light1TitContainer {
width: 80%;
top: 10%;
}
/* .yy-light1Container .yy-light1TitContainer .yy-moreLightBtn {
right: auto;
left: 17%;
bottom: auto;
top: 67%;
} */
.yy-lightContainer .yy-lightTitContainer .yy-moreLightBtn {
cursor: pointer;
width: 38%;
top: 68%;
animation: opacity-animation 2s infinite;
-webkit-animation: opacity-animation 2s infinite;
}
.yy-lightContainer .yy-lightTitContainer{
width: 80%;
top: 77%;
left: 50%;
transform: translateX(-50%);
margin: auto;
height: 24%;
/* padding: 20px 0; */
}
.yy-light2Container .yy-light2TitContainer {
width: 80%;
top: 10%;
}
.yy-light2Container .yy-light1TitContainer .yy-moreLightBtn {
right: auto;
left: 12%;
bottom: auto;
top: 65%;
}
.yy-light3Container .yy-light3TitContainer {
width: 80%;
top: 10%;
left: 8%;
}
.yy-light3Container .yy-light3TitContainer .yy-moreLightBtn {
right: auto;
left: 3%;
bottom: auto;
top: 105%;
}
.yy-light4Container .yy-light4TitContainer {
width: 80%;
top: 10%;
}
.yy-light4Container .yy-light4TitContainer .yy-moreLightBtn {
right: auto;
left: 3%;
bottom: auto;
top: 105%;
}
}
/* 配置表 */
.yy-configContainer {
position: relative;
}
.yy-configContainer .yy-configContent {
position: absolute;
width: 100%;
height: 100%;
left: 0;
right: 0;
overflow: hidden;
}
.yy-configContainer .yy-configContent .yy-configTit {
text-align: center;
font-size: 2.4vw;
color: #fff;
position: absolute;
top: 3%;
width: 100%;
line-height: 1;
}
.yy-configContainer .yy-configContent .yy-configTab {
position: absolute;
top: 11%;
right: 26%;
width: 35%;
font-size: 1vw;
color: #fff;
}
.yy-configContainer .yy-configContent .yy-configTab span {
display: inline-block;
width: 30%;
padding-top: 2%;
padding-bottom: 2%;
text-align: center;
border: 1px solid #fff;
box-sizing: border-box;
cursor: pointer;
/* margin-left: 25.5%; */
}
/* @media screen and (min-width: 474px) {
.yy-configContainer .yy-configContent .yy-configTab span:nth-child(1) {
padding-left:6%!important;
padding-right:6%!important;
}
} */
@media (max-width:768px){
.yy-configContainer .yy-configContent .yy-configTab span {
display: inline-block;
width: 35%;
padding-top: 2%;
padding-bottom: 2%;
text-align: center;
border: 1px solid #fff;
box-sizing: border-box;
cursor: pointer;
/* margin-left: 25.5%; */
}
.yy-configContainer .yy-configContent .yy-configTab span:nth-child(2) {
margin: 0 6%!important;
}
}
@media screen and (min-width: 769px){
.yy-configContainer .yy-configContent .yy-configTab span:nth-child(3) {
padding-left:6%!important;
padding-right:6%!important;
}
}
@media screen and (min-width: 1001px) {
/* .yy-configContainer .yy-configContent .yy-configTab span:nth-child(1) {
padding-left:0!important;
padding-right:0!important;
} */
.yy-configContainer .yy-configContent .yy-configTab span:nth-child(2) {
padding-left:0!important;
padding-right:0!important;
}
.yy-configContainer .yy-configContent .yy-configTab span:nth-child(3) {
padding-left:0!important;
padding-right:0!important;
}
}
.yy-configContainer .yy-rightBtn {
position: absolute;
width: 3%;
top: 50%;
right: 6%;
cursor: pointer;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
}
.yy-configContainer .yy-leftBtn {
position: absolute;
width: 3%;
top: 50%;
left: 6%;
cursor: pointer;
display: none;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
}
@media screen and (max-width:1000px){
.yy-configContainer .yy-configContent .yy-configTit {
font-size: 5vw;
}
.yy-configContainer .yy-configContent .yy-configTab {
width: 100%;
left: 13%;
right: 0;
margin: auto;
top: 9%;
}
.yy-configContainer .yy-configContent .yy-configTab span {
font-size: 3vw;
}
}
.yy-configContainer .yy-configContent .yy-configTab span.yy-act {
background-color: #cc0211;
border-color: #cc0211;
}
.yy-configContainer .yy-configBox {
position: absolute;
width: 80%;
left: 0;
right: 0;
margin: auto;
top: 22%;
/* min-width: 990px; */
}
.yy-configContainer .yy-configBox .yy-pcSwiper {
position: relative;
}
.yy-configContainer .yy-configBox .yy-pcSwiper>div {
position: absolute;
width: 100%;
left: 0;
top: 0;
}
.yy-pcSwiper>div.yy-none {
opacity: 0;
z-index: -1;
}
.yy-pcSwiper>div.yy-init {
opacity: 0;
}
.yy-pcSwiper .swiper-slide {
padding-bottom: 0.3%;
}
.yy-pcSwiper .swiper-slide .yy-carType {
width: 28.5%;
height: 100%;
margin-right: 6.5%;
background-color: #fff;
text-align: center;
padding: 1% 1%;
float: left;
}
.yy-pcSwiper .swiper-slide .yy-carType:hover {
box-shadow: 7px 7px 10px #899292;
}
.yy-pcSwiper .swiper-slide .yy-carType .yy-carTypeTit {
font-size: 2vw;
font-weight: bold;
padding-bottom: 5%;
border-bottom: 1px solid #d2d2d2;
}
.yy-pcSwiper .swiper-slide .yy-carType .yy-carTypePrice {
font-size: 1.2vw;
padding-bottom: 5%;
padding-top: 5%;
border-bottom: 1px solid #d2d2d2;
}
.yy-pcSwiper .swiper-slide .yy-carType .yy-carTypePrice span {
font-size: 1.9vw;
}
.yy-pcSwiper .swiper-slide .yy-carType .yy-carTypeContent {
font-size: 1vw;
padding-top: 5%;
padding-bottom: 8%;
}
.yy-pcSwiper .swiper-slide .yy-carType .yy-carTypeContent p {
line-height: 2em;
}
.yy-pcSwiper .swiper-slide .yy-carType .yy-toConfigBtn {
text-align: center;
font-size: 1vw;
color: #fff;
width: 70%;
background-color: #1f2832;
margin: 0 auto;
padding: 3% 0;
border-radius: 50px;
overflow: hidden;
cursor: pointer;
}
.yy-pcSwiper .swiper-slide .yy-carType .yy-toConfigBtn:hover {
background-color: #cc0211;
}
.yy-pcSwiper .swiper-slide .yy-carType .yy-toBuyCar {
text-align: center;
font-size: 1vw;
color: #fff;
width: 70%;
background-color: #1f2832;
margin: 0 auto;
padding: 3% 0;
border-radius: 50px;
overflow: hidden;
cursor: pointer;
}
.yy-pcSwiper .swiper-slide .yy-carType .yy-toBuyCar:hover {
background-color: #cc0211;
}
.yy-pcSwiper .swiper-slide .yy-carType .yy-basicPayment {
text-align: center;
font-size: 1vw;
color: #fff;
width: 70%;
background-color: #1f2832;
margin: 0 auto;
padding: 3% 0;
border-radius: 50px;
overflow: hidden;
cursor: pointer;
}
.yy-pcSwiper .swiper-slide .yy-carType .yy-basicPayment:hover {
background-color: #cc0211;
}
.yy-pcSwiper .yy-pcSwiperPoint {
text-align: center;
position: absolute;
left: 0;
right: 0;
bottom: -16%;
}
/* wap */
.yy-configContainer .yy-configBox .yy-wapSwiper {
position: relative;
}
.yy-configContainer .yy-configBox .yy-wapSwiper>div {
position: absolute;
width: 100%;
left: 0;
top: 0;
}
.yy-wapSwiper>div.yy-none {
opacity: 0;
z-index: -1;
}
.yy-wapSwiper>div.yy-init {
opacity: 0;
}
.yy-wapSwiper .swiper-slide {
padding-bottom: 0.3%;
}
.yy-wapSwiper .swiper-slide .yy-carType {
/* width: 90%; */
margin:0 auto;
background-color: #fff;
text-align: center;
padding: 5% 3%;
}
.yy-wapSwiper .swiper-slide .yy-carType:hover {
box-shadow: 7px 7px 10px #899292;
}
.yy-wapSwiper .swiper-slide .yy-carType .yy-carTypeTit {
font-size: 5vw;
font-weight: bold;
padding-bottom: 5%;
border-bottom: 1px solid #d2d2d2;
}
.yy-wapSwiper .swiper-slide .yy-carType .yy-carTypePrice {
font-size: 3vw;
padding-bottom: 5%;
padding-top: 5%;
border-bottom: 1px solid #d2d2d2;
}
.yy-wapSwiper .swiper-slide .yy-carType .yy-carTypePrice span {
font-size: 5vw;
}
.yy-wapSwiper .swiper-slide .yy-carType .yy-carTypeContent {
font-size: 3vw;
padding-top: 5%;
padding-bottom: 8%;
}
.yy-wapSwiper .swiper-slide .yy-carType .yy-carTypeContent p {
line-height: 3em;
}
.yy-wapSwiper .swiper-slide .yy-carType .yy-toConfigBtn {
text-align: center;
font-size: 1vw;
color: #fff;
width: 70%;
background-color: #1f2832;
margin: 0 auto;
padding: 3% 0;
border-radius: 50px;
overflow: hidden;
cursor: pointer;
}
.yy-wapSwiper .swiper-slide .yy-carType .yy-toConfigBtn:hover {
background-color: #cc0211;
}
.yy-wapSwiper .swiper-slide .yy-carType .yy-toBuyCar {
text-align: center;
font-size: 1vw;
color: #fff;
width: 70%;
background-color: #1f2832;
margin: 0 auto;
padding: 3% 0;
border-radius: 50px;
overflow: hidden;
cursor: pointer;
}
.yy-wapSwiper .swiper-slide .yy-carType .yy-toBuyCar:hover {
background-color: #cc0211;
}
.yy-wapSwiper .swiper-slide .yy-carType .yy-basicPayment {
text-align: center;
font-size: 1vw;
color: #fff;
width: 70%;
background-color: #1f2832;
margin: 0 auto;
padding: 3% 0;
border-radius: 50px;
overflow: hidden;
cursor: pointer;
}
.yy-wapSwiper .swiper-slide .yy-carType .yy-basicPayment:hover {
background-color: #cc0211;
}
.yy-wapSwiper .yy-wapSwiperPoint {
text-align: center;
position: absolute;
left: 0;
right: 0;
bottom: -5%;
}
@media screen and (max-width:1000px){
.yy-configContainer .yy-configBox {
top: 17%;
}
.yy-wapSwiper .swiper-slide .yy-carType .yy-toConfigBtn {
font-size: 3vw;
}
.yy-wapSwiper .swiper-slide .yy-carType .yy-toBuyCar {
font-size: 3vw;
}
.yy-wapSwiper .swiper-slide .yy-carType .yy-basicPayment {
font-size: 3vw;
}
}
.swiper-pagination-switch {
width: 8px;
height: 8px;
border-radius: 50%;
background-color: #fff;
}
.swiper-active-switch {
width: 3%;
border-radius: 20px;
}
/* 配置表弹层 */
.screen-design5-box{
width: 100%;
height: 100%;
position: fixed;
top: 0;
right: -100%;
background: #000;
z-index: 99;
transition: all 1s;
-webkit-transition: all 1s;
-moz-transition: all 1s;
-ms-transition: all 1s;
-o-transition: all 1s;
z-index: 1000;
}
.left {
right: 0;
}
.screen-design5-box .close{
width: 2.6%;
height: 2.6vw;
position: absolute;
right: 5%;
top: 4%;
cursor: pointer;
}
.screen-design5-box .box-title{
width: 100%;
height: 100px;
background: #000;
}
.screen-design5-box .box-title .car-type-title{
/* width: 305px; */
margin: 30px 5%;
height: 40px;
}
.screen-design5-box .box-con{
width: 100%;
height: calc(100vh - 100px);
overflow: auto;
overscroll-behavior: contain;
-ms-scroll-chaining: contain;
}
.screen-design5-box{
width: 100%;
height: 100%;
position: fixed;
top: 0;
right: -100%;
background: #000;
z-index: 99;
transition: all 1s;
-webkit-transition: all 1s;
-moz-transition: all 1s;
-ms-transition: all 1s;
-o-transition: all 1s;
z-index: 1000;
}
.left {
right: 0;
}
.screen-design5-box .close{
width: 2.6%;
height: 2.6vw;
position: absolute;
right: 5%;
top: 4%;
cursor: pointer;
}
.screen-design5-box .box-title{
width: 100%;
height: 100px;
background: #000;
}
.screen-design5-box .box-title .car-type-title{
width: 323px;
margin: 40px 5%;
height:20px;
}
.screen-design5-box .box-con{
width: 100%;
height: calc(100vh - 100px);
overflow: auto;
overscroll-behavior: contain;
-ms-scroll-chaining: contain;
}
.screen-design7-box{
width: 100%;
height: 100%;
position: fixed;
top: 0;
right: -100%;
background: #000;
z-index: 99;
transition: all 1s;
-webkit-transition: all 1s;
-moz-transition: all 1s;
-ms-transition: all 1s;
-o-transition: all 1s;
z-index: 1000;
}
.left {
right: 0;
}
.screen-design7-box .close{
width: 2.6%;
height: 2.6vw;
position: absolute;
right: 5%;
top: 4%;
cursor: pointer;
}
.screen-design7-box .box-title{
width: 100%;
height: 100px;
background: #000;
}
.screen-design7-box .box-title .car-type-title{
/* width: 305px; */
margin: 30px 5%;
height: 40px;
}
.screen-design7-box .box-con{
width: 100%;
height: calc(100vh - 100px);
overflow: auto;
overscroll-behavior: contain;
-ms-scroll-chaining: contain;
}
.screen-design6-box{
width: 100%;
height: 100%;
position: fixed;
top: 0;
right: -100%;
background: #000;
z-index: 99;
transition: all 1s;
-webkit-transition: all 1s;
-moz-transition: all 1s;
-ms-transition: all 1s;
-o-transition: all 1s;
z-index: 1000;
}
.left {
right: 0;
}
.screen-design6-box .close{
width: 2.6%;
height: 2.6vw;
position: absolute;
right: 5%;
top: 4%;
cursor: pointer;
}
.screen-design6-box .box-title{
width: 100%;
height: 100px;
background: #000;
}
.screen-design6-box .box-title .car-type-title{
width: 305px;
margin: 30px 5%;
height: 40px;
}
.screen-design6-box .box-con{
width: 100%;
height: calc(100vh - 100px);
overflow: auto;
overscroll-behavior: contain;
-ms-scroll-chaining: contain;
}
tr {
/*line-height: 36px;*/
background: #fff;
}
.table>thead>tr>th {
padding: 20px 0;
border: none;
vertical-align: middle;
font-size: 14px;
font-weight: normal;
border-top: 1px solid #ccc;
border-bottom: 1px solid #ccc;
min-width: 100px;
}
.table>tbody>tr:first-child>td {
text-align: left;
border-top: 1px solid #ccc;
}
.table>thead>tr>th:not(:first-child) {
text-align: center;
}
.table>thead>tr>td {
font-size: 14px;
/* color: #333; */
padding: 8px;
text-align: center;
border-left: 1px solid #ccc;
border-bottom: 1px solid #ccc;
}
.table>tbody>tr>td {
font-size: 14px;
color: #333;
padding: 8px;
border-left: 1px solid #ccc;
vertical-align: middle;
border-bottom: 1px solid #ccc;
min-width: 100px;
}
.table>tbody>tr>td:not(:only-child):first-child,
.table>thead>tr>th:first-child {
text-align: left;
border-right: 1px solid #ddd;
}
.table>thead>tr>th:not(:first-child) {
border-left: 1px solid #ddd;
}
.table>tbody>tr>td:not(:first-child) {
text-align: center;
border-left: 1px solid #ddd;
}
.b-border~tr td {
border-top-color: #333 !important;
}
.tr,
.tr1,
.tr2,
.tr3,
.tr4,
.tr5,
.tr6,
.tr7 {
display: none;
background-color: #fff;
}
.click.cut~.tr,
.click1.cut~.tr1,
.click2.cut~.tr2,
.click3.cut~.tr3,
.click4.cut~.tr4,
.click5.cut~.tr5,
.click6.cut~.tr6,
.click7.cut~.tr7 {
display: table-row;
}
.click td:nth-child(1),
.click1 td:nth-child(1),
.click2 td:nth-child(1),
.click3 td:nth-child(1),
.click4 td:nth-child(1),
.click5 td:nth-child(1),
.click6 td:nth-child(1),
.click7 td:nth-child(1) {
padding-left: 8px;
background: url(/images/all-new-MAX/img/close_sta.png) no-repeat;
background-position: 94.2% center;
background-size: 16px;
cursor: pointer;
}
.click.cut td:nth-child(1),
.click1.cut td:nth-child(1),
.click2.cut td:nth-child(1),
.click3.cut td:nth-child(1),
.click4.cut td:nth-child(1),
.click5.cut td:nth-child(1),
.click6.cut td:nth-child(1),
.click7.cut td:nth-child(1) {
padding-left: 8px;
background: url(/images/all-new-MAX/img/open_sta.png) no-repeat;
background-position: 94.2% center;
background-size: 16px;
background-color: #4a4647;
color: #fff;
}
.container {
width: 100%;
background: #f3f3f3;
position: relative;
margin: 0 auto;
}
.container .text-center {
font-size: 2em;
padding: 3% 0;
text-align: center;
}
.container .cxtab {
position: absolute;
top: 50px;
right: 4%;
width: 23%;
}
.container .cxtab a {
display: inline-block;
width: 49%;
font-size: 12px;
padding: 3% 2%;
text-align: center;
background: #fff;
}
.container .cxtab .active_a {
background: #d30404;
color: #fff;
}
.container .table {
display: none;
}
.container .table thead {
width: 100%;
}
.container .table tbody {
width: 100%;
}
.container .active {
display: table;
}
.table_js {
padding-bottom: 1%;
}
.table_js .left {
float: left;
font-size: 12px;
color: #666;
}
.table_js .right {
width: 20%;
float: right;
font-size: 12px;
color: #666;
}
.table_js .right span {
margin-left: 10%;
}
@media screen and (max-width:1000px){
.screen-design5-box .close{
width: 30px;
height: 30px;
top: 5px;
right: 3%;
}
.screen-design5-box .box-title{
height: 40px;
}
.screen-design5-box .box-title .car-type-title{
width: auto;
height: 18px;
margin: 0;
margin-top: 10px;
}
.screen-design5-box .box-con{
height: calc(100vh - 40px);
}
.screen-design6-box .close{
width: 30px;
height: 30px;
top: 5px;
right: 3%;
}
.screen-design6-box .box-title{
height: 40px;
}
.screen-design6-box .box-title .car-type-title{
width: auto;
height: 35px;
margin: 0;
margin-top: 3px;
}
.screen-design6-box .box-con{
height: calc(100vh - 40px);
}
.screen-design7-box .close{
width: 30px;
height: 30px;
top: 5px;
right: 3%;
}
.screen-design7-box .box-title{
height: 40px;
}
.screen-design7-box .box-title .car-type-title{
width: auto;
height: 35px;
margin: 0;
margin-top: 3px;
}
.screen-design7-box .box-con{
height: calc(100vh - 40px);
}
}
/* 弹层 */
.yy-shadowContainer {
position: fixed;
width: 100%;
height: 100%;
left: 100%;
top: 0;
background-color: #000;
transition: left 1s;
z-index: 9999;
}
@media screen and (max-width:768px){
.yy-shadowContainer {
background-color: #000;
}
}
.yy-shadowContainer .row1{
width: 100%;
overflow: hidden;
}
.yy-shadowContainer .row1 .text-box{
color: #fff;
width: 20%;
position: absolute;
top: 50%;
left: 0;
text-align: left;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
}
.yy-shadowContainer .row1 .yy-pc-img{
width: 78%;
float: right;
}
.yy-shadowContainer .row1 .yy-text{
font-size: 1.5vw;
letter-spacing: 2px;
margin-top: 25px;
}
.yy-shadowContainer .row1 .text-con{
width: 80%;
font-size: .8vw;
line-height: 1.5vw;
letter-spacing: 1px;
}
.yy-shadowContainer .row1 .line{
width: 8%;
height: 1px;
background: #fff;
margin: 30px 0;
}
.yy-shadowContainer .row4 .line{
width: 8%;
height: 1px;
background: #fff;
margin: 30px 0;
}
.yy-shadowContainer .row2 .row3-slide{
width: 40%;
margin-left: 5%;
}
.yy-shadowContainer .row4 .row4-slide{
width: 22.5%;
margin-right: 3%;
float: left;
color: #fff;
text-align: left;
/* margin-right: 5%; */
}
.yy-shadowContainer .row4 .row4-slide4{
margin-right: 0;
}
.yy-shadowContainer .row3{
width: 100%;
}
.yy-shadowContainer .row3-slide{
width: 29.5%;
float: left;
color: #fff;
text-align: left;
margin-right: 5%;
}
.yy-shadowContainer .row3-slide2 .text-box{
margin-left: 10%;
margin-bottom: 50px;
}
.yy-shadowContainer .row3 .row3-slide2 .yy-con{
width: 90%;
}
.yy-shadowContainer .row3 .row3-slide2 .yy-text{
margin-top: 0;
}
.yy-shadowContainer .row3-slide3{
margin-right: 0;
}
.yy-shadowContainer .row3 .yy-text{
font-size: 1.2vw;
letter-spacing: 2px;
margin-top: 25px;
}
.yy-lignt1ShadowContainer .row3 .yy-text{
font-weight: 600;
}
.yy-shadowContainer .row4 .yy-text{
font-size: 1.2vw;
letter-spacing: 2px;
margin-top: 80px;
}
.yy-shadowContainer .row4 .row4-slide2 .yy-text,
.yy-shadowContainer .row4 .row4-slide4 .yy-text{
margin-top: 0;
}
.yy-shadowContainer .row4 .row4-slide2 .text-con,
.yy-shadowContainer .row4 .row4-slide4 .text-con {
margin-bottom: 100px;
}
.yy-shadowContainer .row3 .text-con{
width: 80%;
font-size: .8vw;
line-height: 1.5vw;
letter-spacing: 1px;
}
.yy-shadowContainer .row3 .line{
width: 8%;
height: 1px;
background: #fff;
margin: 30px 0;
}
.yy-shadowContainer.yy-act {
left: 0;
}
.yy-shadowContainer .yy-shadowContent {
position: absolute;
width: 90%;
left: 0;
right: 0;
margin: auto;
top: 50%;
transform: translateY(-50%);
}
.yy-shadowContainer .yy-close {
position: absolute;
width: 2%;
top: 10%;
left: 5%;
cursor: pointer;
z-index: 5;
}
.yy-shadowContainer .yy-leftBtn {
position: absolute;
width: 2%;
bottom: 5%;
left: 1%;
cursor: pointer;
display: none;
}
.yy-shadowContainer .yy-rightBtn {
position: absolute;
width: 2%;
bottom: 5%;
right: 1%;
cursor: pointer;
}
/* 视频弹层 */
.yy-videoShadow {}
.yy-videoShadow .yy-videoContent {
width: 100%;
}
.yy-videoShadow .yy-videoContent video {
width: 100%;
}
/* 亮点弹层 */
.yy-ligntShadowContainer {}
.yy-ligntShadowContainer .yy-lightBg-m {
position: absolute;
bottom: 0;
left: 0;
z-index: -1;
width: 100%;
}
.yy-ligntShadowContainer .yy-lightBg-m-top {
position: absolute;
top: 0;
left: 0;
z-index: -1;
width: 100%;
transform: rotate(180deg);
-webkit-transform: rotate(180deg);
-moz-transform: rotate(180deg);
-ms-transform: rotate(180deg);
-o-transform: rotate(180deg);
}
.yy-ligntShadowContainer .yy-ligntShadowContent {}
.yy-ligntShadowContainer .yy-ligntShadowContent .swiper-slide {
text-align: center;
}
.yy-ligntShadowContainer .yy-ligntShadowContent img {
width: 100%;
margin: 0 auto;
margin-right: 1%;
}
.yy-lightShadowPoint {
text-align: center;
position: absolute;
bottom: 5%;
width: 100%;
left: 0;
display: none;
}
@media screen and (max-width:1000px){
/* 弹层 */
.yy-shadowContainer .yy-shadowContent {
width: 100%;
}
.yy-shadowContainer .yy-close {
width: 7%;
}
.yy-ligntShadowContainer .yy-ligntShadowContent img {
width: 100%;
}
.yy-ligntShadowContainer .yy-ligntShadowContent {
top: 50%;
left: 0;
right: auto;
bottom: auto;
transform: translateY(-50%);
-webkit-transform: translateY(-50%);
-moz-transform: translateY(-50%);
-ms-transform: translateY(-50%);
-o-transform: translateY(-50%);
}
.yy-ligntShadowContainer .yy-ligntShadowContent .text-box{
text-align: left;
margin-left: 5%;
}
/* .yy-ligntShadowContainer .yy-ligntShadowContent .yy-text {
font-size: 5vw;
color: #fff;
margin-top: 5%;
letter-spacing: 2px;
}
.yy-ligntShadowContainer .yy-ligntShadowContent .text-con{
width: 80%;
font-size: 3vw;
color: #fff;
letter-spacing: 1px;
}
.yy-ligntShadowContainer .yy-ligntShadowContent .text-box .line{
width: 5%;
height: 1px;
background: #fff;
margin: 5% 0;
} */
.swiper-active-switch {
width: 6%;
border-radius: 20px;
}
.yy-lightShadowPoint{
display: block;
}
}
@media screen and (min-width:768px) and (max-width:1000px){
.yy-shadowContainer .yy-close {
width: 4%;
}
.yy-ligntShadowContainer .yy-ligntShadowContent {
transform: translateY(0);
-webkit-transform: translateY(0);
-moz-transform: translateY(0);
-ms-transform: translateY(0);
-o-transform: translateY(0);
top: 0;
}
.yy-ligntShadowContainer .yy-ligntShadowContent .yy-text {
font-size: 2vw;
color: #fff;
margin-top: 1%;
letter-spacing: 2px;
}
.yy-ligntShadowContainer .yy-ligntShadowContent .text-con{
width: 95%;
font-size: 1.5vw;
color: #fff;
letter-spacing: 1px;
}
.yy-ligntShadowContainer .yy-ligntShadowContent .text-box .line{
width: 5%;
height: 1px;
background: #fff;
margin: 2% 0;
}
}
@media screen and (max-width:768px){
.yy-ligntShadowContainer .yy-ligntShadowContent .yy-text {
font-size: 5vw;
color: #fff;
margin-top: 5%;
letter-spacing: 2px;
}
.yy-ligntShadowContainer .yy-ligntShadowContent .text-con{
width: 80%;
font-size: 3vw;
color: #fff;
letter-spacing: 1px;
}
.yy-ligntShadowContainer .yy-ligntShadowContent .text-box .line{
width: 5%;
height: 1px;
background: #fff;
margin: 5% 0;
}
}
/* 左侧导航栏 */
.tab-left{
width: 5%;
position: fixed;
left: 1%;
bottom: 10%;
color: #fff;
z-index: 91;
display: none;
}
.tab-left.show{
display: inherit;
}
.tab-left ul {}
.tab-left ul li {
position: relative;
width: 18px;
height: 18px;
margin: 7px;
margin-top: 18px;
}
.tab-left ul li a {
display: -webkit-box;
/* display: -ms-flexbox;
display: -webkit-flex;
display: flex; */
position: relative;
z-index: 1;
width: 100%;
height: 100%;
cursor: pointer;
text-decoration: none;
-webkit-box-pack: center;
-ms-flex-pack: center;
-webkit-justify-content: center;
justify-content: center;
}
.tab-left ul li a.active {
background-color: transparent;
overflow: hidden;
border-radius: 50%;
}
.tab-left ul li a img {
width: 100%;
}
.tab-left ul li a img.yy-navPoint {}
.tab-left ul li a img.yy-navPointAct {
display: none;
}
.tab-left ul li a.active img.yy-navPoint {
display: none;
}
.tab-left ul li a.active img.yy-navPointAct {
display: block;
}
/* .tab-left ul li a span {
height: 6px;
width: 6px;
background-color: #fff;
border-radius: 50%;
position: absolute;
z-index: 1;
border: 0;
transition: all 0.2s ease-in-out;
left: 0;
right: 0;
top: 0;
bottom: 0;
margin:auto;
} */
/* 左下角导航动画 */
/* .tab-left ul li a.active span {
border: 16px solid #fff;
box-sizing: content-box;
animation: fs-nav-animation 1s linear normal infinite;
border-radius: 50%;
box-shadow: 0 0 5px 5px rgb(255 255 255 / 15%);
} */
/* .tab-left ul li a.active span {
width: 10px;
height: 10px;
border: 3px solid #fff;
box-sizing: content-box;
border-radius: 50%;
box-shadow: 0 0 5px 5px rgb(255 255 255 / 15%);
background-color: transparent;
} */
.tab-left ul li>span {
position: absolute;
top: -1px;
left: 28px;
color: #fff;
font-size: 14px;
font-family: arial, helvetica, sans-serif;
white-space: nowrap;
max-width: 220px;
overflow: hidden;
display: block;
cursor: pointer;
}
@keyframes fs-nav-animation {
0% {
background-color:#fff;
border:0px solid #fff
}
39.9% {
background-color:#fff;
border:16px solid #fff
}
40% {
width:0;
height:0;
background-color:transparent;
border:16px solid #fff
}
100% {
width:16px;
height:16px;
background-color:transparent;
}
}
@keyframes opacity-animation{
0%{
opacity: 0;
}
50%{
opacity: 1;
}
100%{
opacity: 0;
}
}
/* color */
/* color */
.yy-colorContainer {
padding-bottom: 10%;
background-color: #000;
position: relative;
}
.yy-colorContainer .yy-colorContent {}
.yy-colorContainer .yy-colorContent .yy-colorBox {
position: relative;
width: 12.38%;
/* margin-left: -7.835%; */
overflow: hidden;
transition: all 1s;
}
.yy-colorContainer .yy-colorContent .yy-colorBox.yy-whiteCar {
z-index: 1;
margin-left: 0;
}
.yy-colorContainer .yy-colorContent .yy-colorBox.yy-yellowCar {
z-index: 2;
}
.yy-colorContainer .yy-colorContent .yy-colorBox.yy-grayCar {
z-index: 3;
}
.yy-colorContainer .yy-colorContent .yy-colorBox.yy-orangeCar {
z-index: 4;
}
.yy-colorContainer .yy-colorContent .yy-colorBox.yy-blackCar {
z-index: 5;
}
.yy-colorContainer .yy-colorContent .yy-colorBox.yy-blueCar {
z-index: 6;
}
.yy-colorContainer .yy-colorContent .yy-colorBox.yy-yinCar {
z-index: 7;
}
.yy-colorContainer .yy-colorContent .yy-colorBox.yy-jinCar {
z-index: 8;
}
.yy-colorContainer .yy-colorContent .yy-colorBox img {
transition: all 1s;
}
.yy-colorContainer .yy-colorContent .yy-colorBox.yy-act {
z-index: 8;
box-shadow: 0px 0px 20px 5px #333333;
transform: scale(1.1);
-webkit-transform: scale(1.1);
-moz-transform: scale(1.1);
-ms-transform: scale(1.1);
-o-transform: scale(1.1);
}
.yy-colorContainer .yy-colorContent .yy-colorBox img.yy-colorShadowText {
position: absolute;
width: 100%;
left: 0;
right: 0;
opacity: 0;
}
.yy-colorContainer .yy-colorContent .yy-colorBox.yy-act img.yy-colorShadowText {
opacity: 1;
/* transform: scale(1.3); */
}
.yy-colorContainer .yy-colorContent .yy-colorBox.yy-act img {
/* transform: scale(1.2); */
}
/* 色块 */
.yy-colorContainer .yy-cardContainer2{
padding-left: 0 !important;
z-index: 9;
}
.yy-colorContainer .yy-cardContainer2 .yy-360Icon{
display: none;
}
.yy-colorContainer .yy-cardContainer2 ul li{
margin-left: 5.51%;
margin-right: 0 !important;
}
.yy-colorContainer .yy-cardContainer2 {
max-width: 1080px;
width: 70vw;
position: absolute;
left: 0;
right: 0;
bottom: 5%;
margin: auto;
background-color: rgba(255, 255, 255, .7);
background: linear-gradient(to right, #000, #b3b3b3 10%, #b3b3b3 90%, #000);
/* border: 1px solid #fff; */
padding-top: 0.5%;
padding-left: 1.5%;
padding-bottom: 0.5%;
}
.yy-colorContainer .yy-cardContainer2 ul {
display: flex;
justify-content: center;
padding-right: 45px;
}
.yy-colorContainer .yy-cardContainer2 ul li {
float: left;
width: 8%;
margin-right: 5%;
cursor: pointer;
text-align: center;
}
.yy-colorContainer .yy-cardContainer2 ul li img {
width: 90%;
}
.yy-colorContainer .yy-cardContainer2 ul li.yy-act img{
border: 2px solid #8a8a8a;
/* border: 2px solid #fff; */
}
.yy-colorContainer .yy-cardContainer2 .yy-360Icon {
position: absolute;
width: 9.44%;
top: -31%;
bottom: 0;
margin: auto;
right: 2%;
}
.yy-colorContainer .yy-cardContainer2 ul li p {
text-align: center;
color: #000;
font-weight: bold;
display: none;
font-size: 0.5vw;
}
.yy-colorContainer .yy-cardContainer2 ul li.yy-act p {
display: block;
margin-top: 10%;
}
.yy-colorContainer_wap {
position: relative;
}
.yy-colorContainer_wap .yy-carColorPoint {
position: absolute;
width: 100%;
left: 0;
bottom: 3%;
text-align: center;
z-index: 3;
}
.table-fixed{
width: 99.11%;
position:fixed;
display:table;
transform:translate(0,-100%);
}
.more{
font-size:14px;
color: #fff;
display: flex;
padding-left: 3%;
/* padding-top: 4%; */
}
.more img{
margin-right:5px;
}
.view360 .sub-title span.current {
background: url(../images/ruimai/360/line.jpg) center bottom repeat-x
}
.changeCar-color {
position: relative;
}
.changeCar-color .col-main-title {
width: 100%;
position: absolute;
left: 0;
top: 2%;
font-size: 2em;
text-align: center;
}
.changeCar-color .wrapCol {
position: absolute;
left: 40%;
top: 10%;
width: 20%;
}
.changeCar-color .wrapCol .cir {
float: left;
width: 24%;
margin-right: 1%;
cursor: pointer;
}
.changeCar-color .wrapCol .cir .img img {
width: 100%;
display: block;
}
.changeCar-color .wrapCol .cir .txt {
display: none;
font-size: 1em;
text-align: center;
}
.changeCar-color .wrapCol .active .txt {
display: block;
}
.changeCar-color .wrapCol .cir04 {
margin: 0;
}
.changeCar-color .BlueCar {
position: absolute;
left: 50%;
top: 40%;
width: 56.18%;
transform: translateX(-50%);
}
.changeCar-color .BlueCar img {
width: 100%;
}
.changeCar-color .changeCar-colorbg img {
width: 100%;
display: block;
}
.jdtip360 p,
.tip360 p {
color: #0c0c0c;
text-align: center;
font-size: 18px;
margin-bottom: 2.1%;
}
.jdtip360 ul,
.tip360 ul {
width: 90%;
margin: 0 auto;
display: flex;
justify-content: space-between;
}
.jd .jdtip360 ul li {
width: 10%;
float: left;
position: relative;
}
.no-jd .tip360 ul li {
width: 16%;
float: left;
position: relative;
}
.jdtip360 ul li div,
.tip360 ul li div {
width: 75%;
margin: 0 auto;
height: 23px;
border: 3px solid transparent;
cursor: pointer
}
.jdtip360 ul li div.actColor,
.tip360 ul li div.actColor {
border-color: #dd0b1a;
}
.jdtip360 ul li span,
.tip360 ul li span {
display: block;
text-align: center;
font-size: 14px;
margin-top: 9.6%
}
.jdtip360 {
width: 78.5%;
position: absolute;
top: 15%;
left: 50%;
transform: translateX(-50%);
}
/* 朝日岳白 */
.asahiyueBai {
background: #c3c3c5
}
/* 贝加尔蓝 */
.baikalBlue {
background: #2d4452
}
/* 阿尔泰金 */
.altaijin {
background: #917b66
}
/* 橙色 */
.orange {
background: #ed5a2a
}
/* 雷尼斯黑 */
.renesBlack {
background: #282930
}
.lan {
background: #7c8eb4
}
/* 纳艾卡银 */
.naikaSilver {
background: #7a818b;
}
/* 卡奈斯灰 */
.kanasGrey {
background: #4b4e55;
}
/* 瓦地伦黄 */
.waldenYellow {
background: #d78b01
}
/* 心悦蓝 */
.heartBlue {
background: #85a5cc
}
/* 雅致银 */
.elegantSilver {
background: #737984
}
/* 深邃蓝 */
.deepBlue {
background: #1F377E
}
/* 卡奈斯灰 */
.kanasGrey {
background: #4A4D54
}
/* 简约白 */
.simpleWhite {
background: #B6B5BA
}
/* 工程黄 */
.engineeringYellow {
background: #d78b01
}
/* 伯爵黑 */
.countBlack {
background: #23282F
}
.btn360 {
position: absolute;
top: 58%;
left: 0;
cursor: default;
}
.btn360.right360 {
left: auto;
right: 0
}
.yy-lightContainer .yy-lightTitContainer .more-dongli{
/* position: absolute; width: 100%; left: 60px;top: 75%; */
}
.more-gongyi{
font-size:16px;
color: #fff;
position: absolute; width: 100%; left: 64px;top: 180px;
}
.kongjian-dongli{
/* background: radial-gradient(circle at center, #000000a3, #00000000); */
height: 240px;
left: 164px;bottom: 220px;
padding: 20px 10px;
}
.kongjian{
height: 240px; left: 164px;bottom: 220px;
/* background: radial-gradient(circle at center, #000000a3, #00000000); */
padding: 20px 10px;
}
.kongjian-gongyi{
/* background: radial-gradient(circle at center, #000000a3, #00000000); */
padding: 20px 10px;
height: 240px; left: 34%;
position: absolute;
width: 29.16%;
top: 20%;
}
@media screen and (max-width:1250px) {
.more {
left: 46px;
top: 132px;
}
.yy-lightContainer .yy-lightTitContainer .more-dongli{
top: 124px;
left: 46px;
}
.kongjian{
height: 180px; left: 164px;bottom: 220px;
/* background: radial-gradient(circle at center, #000000a3, #00000000); */
padding: 20px 10px;
}
.kongjian-gongyi{
height: 180px;
}
.kongjian-dongli{
height: 180px;
}
.more-gongyi{
font-size:16px;
color: #fff;
position: absolute; width: 100%; left: 40px;top: 120px;
}
}
@media screen and (max-width:1650px){
.yy-lightContainer .yy-lightTitContainer .more-gongyi{
top: 83%;
left: 50px;
}
.more {
left: 20px;
top: 122px;
}
.more-dongli{
top: 168px;
left: 40px;
}
.kongjian-dongli{
height: 200px;
}
.kongjian{
height: 200px; left: 164px;bottom: 220px;
/* background: radial-gradient(circle at center, #000000a3, #00000000); */
padding: 20px 10px;
}
.kongjian-gongyi{
height: 160px;
}
.more-keji{
left: 46px;
top: 142px;
}
.more-anquan{
left: 46px;
top: 152px;
}
.more-kongjian{
left: 46px;
top: 152px;
}
.more-xingge{
left: 60px;
top: 152px;
}
.more-gongyi{
font-size:16px;
color: #fff;
position: absolute; width: 100%; left: 40px;top: 130px;
}
}
@media screen and (max-width:1000px){
.changeCar-color .changeCar-colorbg img {
width: 100%;
height: 362px;
display: block;
}
.yy-lightContainer .yy-lightTitContainer .more-gongyi {
cursor: pointer;
width: 38%;
top: 73%;
animation: opacity-animation 2s infinite;
-webkit-animation: opacity-animation 2s infinite;
}
.more {
left: 20px;
top: 122px;
}
.more-dongli{
top: 168px;
left: 40px;
}
.kongjian-dongli{
height: 200px;
}
.kongjian{
height: 200px; left: 164px;bottom: 220px;
/* background: radial-gradient(circle at center, #000000a3, #00000000); */
padding: 20px 10px;
}
.kongjian-gongyi{
height: 160px;
}
.more-keji{
left: 46px;
top: 142px;
}
.more-anquan{
left: 46px;
top: 152px;
}
.more-kongjian{
left: 46px;
top: 152px;
}
.more-xingge{
left: 60px;
top: 152px;
}
.more-gongyi{
font-size:16px;
color: #fff;
position: absolute; width: 100%; left: 40px;top: 130px;
}
.view360 .cti-content {
margin-left: 4%;
width: 92%
}
.changeCar-color .col-main-title {
font-size: 1em;
}
.changeCar-color .BlueCar {
position: absolute;
left: 50%;
top: 58%;
width: 70.18%;
transform: translateX(-50%);
}
.jdtip360 ul {
width: 93%;
display: flex
;
justify-content: center;
}
/*360 start*/
.jdtip360 {
width: 100%;
position: absolute;
top: 20%;
left: 50%;
}
.jdtip360 ul {
width: 100%;
display: flex;
justify-content: center;
}
.jdtip360 p {
font-size: 16px;
margin-bottom: 4%;
}
.jdtip360 ul li div {
width: 34px;
height: 20px;
}
.jdtip360 ul li span {
font-size: 12px;
writing-mode: vertical-rl;
letter-spacing: 5px;
width: 40px;
text-align: center;
writing-mode: vertical-lr;
max-width: 5ch;
word-break: keep-all;
white-space: nowrap;
display: flex;
align-items: center;
justify-content: center;
padding: 5px;
}
.view360 .cti-content {
margin-left: 4%;
width: 92%
}
.yy-switchBtn{
width: 162px;
height: 30px;
line-height: 30px;
}
.yy-wap_text div{
color: #fff;
font-size: 5vw;
}
}
.swiperText{
margin-bottom: 108px;
}
.swiperText span{
font-size:36px;
color:#fff;
font-weight:bold;
margin:0 100px;
}
/* .sjSwilerText{
position: relative;
} */
/* .sjText{
position: fixed;
top: -34%;
left: 50%;
} */
.topText{
display: flex;
justify-content: center;
}
.topText img{
width: 80px !important;
height: 52px;
margin:0 !important;
}
.swiper-slide{
overflow: visible !important;
}