* {margin: 0;padding: 0;border: none;width: 45%;}
html,body {width: 100%;height: 100%;background-color: #fff;}

/*加载*/
.loading{width: 100%;height: 100%;background-color: #fff;}
.loading-word{color: white;text-align: center;font-size: 30px;}
.spinner {
  margin: 700px auto 50px;
  width: 200px;
  height: 120px;
  text-align: center;
  font-size: 10px;
}
 
.spinner > div {
  background-color: white;
  height: 100%;
  width: 20px;
  display: inline-block;
  margin-right: 10px; 
  -webkit-animation: stretchdelay 1.2s infinite ease-in-out;
  animation: stretchdelay 1.2s infinite ease-in-out;
}
 
.spinner .rect2 {
  -webkit-animation-delay: -1.1s;
  animation-delay: -1.1s;
}
 
.spinner .rect3 {
  -webkit-animation-delay: -1.0s;
  animation-delay: -1.0s;
}
 
.spinner .rect4 {
  -webkit-animation-delay: -0.9s;
  animation-delay: -0.9s;
}
 
.spinner .rect5 {
  -webkit-animation-delay: -0.8s;
  animation-delay: -0.8s;
}
 
@-webkit-keyframes stretchdelay {
  0%, 40%, 100% { -webkit-transform: scaley(0.4) } 
  20% { -webkit-transform: scaley(1.0) }
}
 
@keyframes stretchdelay {
  0%, 40%, 100% {
    transform: scaley(0.4);
    -webkit-transform: scaley(0.4);
  }  20% {
    transform: scaley(1.0);
    -webkit-transform: scaley(1.0);
  }
}

/*第一页*/
.page1 {width: 100%;height: 100%;overflow: hidden;z-index: 30;position: fixed;top: 0px;left: 0px;background-color: #000000;position: relative;}
#play{position: absolute;top: 560px;left: 440px;z-index: 999;}
.videot {width: 100%;height: 100%;overflow: hidden;}
.indexpic {width: 100%;border: none;margin-top: 35%;}
.divvideo {width: 100%;height: 100%;overflow: hidden;}
.video1 {width: 100%;height: 100%;overflow: hidden;object-fit: fill;}
.divbtns {width: 100%;height: 755px;background-image: ;background-size: 100% auto;position: fixed;bottom: -60px;left: 0px;z-index: 999;display: none;}
.btnplayagain {width: 30%;position: absolute;top: 380px;left: 18%;display: none;}
.btndrive {width: 30%;position: absolute;top: 380px;left: 18%;}
.btngopage2 {width: 30%;position: absolute;top: 380px;left: 53%;}
.end_pic,.end_pic_nologo{width: 100%;position: absolute;top: 0px;left: 0px;z-index: 998;}
.end_pic{display: none;}

/*第二页*/
.page2 {width: 100%;height: 100%;position: absolute;top: 0px;left: 0px;z-index: 20;}
/*加载的时候,2页会出现,先隐藏,后期再出来*/
.page2 {opacity: 0.01;}
.topbar {width: 100%;height: 100px;padding-top: 20px;padding-bottom: 20px;background: linear-gradient(rgba(0,0,0,0.8), rgba(0,0,0,0.5));position: absolute;left: 0px;top: 0px;z-index: 21;}
.selecttype {display: inline-block;color: white;width: 495px;height: 100px;line-height: 100px;border-right: 1px solid white;font-size: 40px;text-indent: 150px;background-image: ;background-size: 45px 35px;background-position: 10% 28px;background-repeat: no-repeat;position: relative;top: -35px;}
.selectnow {color: #ffcc00;display: block;width: 100%;height: 100%;}
.selectnow360 {color: #ffcc00;display: block;width: 100%;height: 100%;}
.divchoose {width: 100%;height: 235px;position: absolute;top: 115px;left: 0px;text-indent: 150px;background: rgba(0,0,0,0.5);display: none;padding-top: 20px;}
.divchoose360 {width: 100%;height: 235px;position: absolute;top: 115px;left: 0px;text-indent: 150px;background: rgba(0,0,0,0.5);display: none;padding-top: 20px;}
.spanchoose {display: block;padding-bottom: 20px;}
.spanchoose360 {display: block;padding-bottom: 20px;}
.choosexle {display: none;}
.choosexle360 {display: none;}
.tcchoosecar {width: 100%;height: 100%;position: absolute;top: 0px;left: 0px;z-index: 10;display: none;}
.tcchoosecar360 {width: 100%;height: 100%;position: absolute;top: 0px;left: 0px;z-index: 10;display: none;}

.btngoweb {display: inline-block;color: white;width: 280px;height: 100px;text-align: center;}
.btngopage3 {display: inline-block;color: white;width: 280px;height: 100px;text-align: center;}
.bottombar {width: 100%;height:10%; background: none;position: absolute;left: 0px;bottom: 0px;z-index: 11;}
.btnswiperpage3 {width: 100%;height: 100%;}
.changescens {width: 100%;height: 60px;z-index: 12;position: absolute;left: 0%;bottom: 8%;}
.btnshowjiashizhe {height: 55px;width: 95px;/* margin-right: 23px; */position: absolute;bottom: 95px;left: 15px;-webkit-tap-highlight-color:rgba(0,0,0,0);}
.btnshowzhongyang {height: 55px;width: 95px;position: absolute;bottom: 95px;left: 100px;-webkit-tap-highlight-color:rgba(0,0,0,0);}
.btnshowout {height: 50px;width: 70px;position: absolute;bottom: 100px;left: 200px;-webkit-tap-highlight-color:rgba(0,0,0,0);}
.asreal_black{position: absolute;bottom: 5%;right: 50%;width: 120px;margin-right: -60px;}

/*第二页热点弹窗*/
.wld-point1{position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0,0,0,0.9);z-index: 30;display: none;}
.close-point,.close-point2{position: absolute;right: 10px;top: 10px;width: 25px;}
.point-word{position: absolute;left: 0px;top: 150px;color: white;font-size: 15px;width: 100%;text-align: center;}
.point-img{position: absolute;left: 25%;top: 190px;width: 50%;}

.point-word2{position: absolute;left: 90px;top: 200px;color: white;font-size: 45px;width: 900px;}
.point-img2box{position: absolute;left: 90px;top: 350px;width: 900px;height: 1200px;overflow: auto;-webkit-overflow-scrolling: touch;}
.point-img2{width: 900px;}

/*第三页*/
.page3 {width: 100%;height: 100%;background-color: black;overflow: scroll;position: fixed;top: 0px;left: 0px;z-index: 10;display: block;-webkit-overflow-scrolling: touch;}
/*加载的时候,注册页会出现,先隐藏,后期再出来*/
.page3 {opacity: 0.01;}
.background{display:block;background:  no-repeat;}
.pad{padding-top: 40px;}
.swiper-button-next, .swiper-button-prev{width: 100px !important;height: 120px !important;margin-top: -90px !important;}
.swiperform{width: 1000px;margin: auto;}
.table{width: 1000px;margin: auto;margin-top: 75px;}
.text{width: 100%;text-align: center;}
.texttishi2 {color: white;font-size: 24px;display: block;margin: auto;margin-top: 25px;}
.datum{font-size: 42px;padding-left: 118px;font-family:'微软雅黑';background-image: -webkit-gradient(linear, 0 0, 0 bottom, from(rgba(255, 255, 255, 1)), to(rgba(108, 108, 108, 1))); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
.form{width: 1000px;margin-top:60px;}
.username{width: 1000px;height: 140px;}
.preface{width:165px;height:140px;line-height:140px;font-size: 32px;color: #fff;float: left;letter-spacing: 8px;}
.input{width: 770px;height: 138px;line-height:140px;font-size: 30px;color: white;border-radius: 10px;-webkit-appearance: none;background: none;border:#fff 2px solid ;padding-left: 20px;float: right;}
.usertelephone{width: 1000px;height: 140px;margin-top:60px ;}
.usercity{width: 1000px;height: 100px;line-height:100px;margin-top: 60px;}
.belong{width: 165px;height: 140px;line-height: 140px;font-size: 32px;color: #fff;float: left;letter-spacing: 8px;}
.provinse{width:387px;height: 140px;border:#fff 2px solid;float: left;margin-left: 40px;}
.border{width: 387px;height: 140px;background: #000;color: #fff;font-size: 30px;padding-left: 20px;-webkit-appearance: none;background-image: ;background-repeat: no-repeat;background-position: right top;}
.city{width:387px;height: 140px;border: #fff 2px solid;float: right;}
.botton{width:80px;height:98px;background:  no-repeat;float: right;}
.dealer{width: 1000px;height: 100px;margin-top: 100px;}
.vender{width: 165px;height: 140px;line-height:140px;font-size: 32px;color: #fff;float: left;letter-spacing: 19px;}
.choose{width: 792px;height: 140px;border: #fff 2px solid;float: right;}
.chooseborder{width: 792px;height:140px;background: #000;font-size: 30px;color: #fff;padding-left: 20px;-webkit-appearance: none;background-image: ;background-repeat: no-repeat;background-position: right top;}
.address{width: 1000px;height: 140px;margin-top: 110px;}
.add{width: 165px;height: 120px;font-size: 32px;color: #fff;line-height: 120px;float: left;}
.addtext{width: 772px;height: 100px;background:none;float: right;color: white;font-size: 30px;padding-left: 20px;margin-top: 40px;}
.information{width: 1000px;height: 90px;margin-top: 80px;}
.contact{width: 130px;height: 90px;float: left;}
.radio{width: 25px;height: 25px;}
.paragraph{width: 830px;height: 90px;float: right;font-size: 24px;color: #fff;letter-spacing: 2px;}
.i{color: #f00202;}
.ture{width: 1000px;height: 100px;margin-top: 100px;border: #fff 1px solid;margin-bottom: 80px;}
.img{background:  no-repeat;width: 1000px;height: 100px;}
.checkboxagree {width: 40px;height: 40px;margin-right: 20px;}
.textagree {font-size: 30px;display: inline-block;width: 930px;vertical-align: top;text-align: left;}

.blackxieyi{position: fixed;top: 0;left: 0;width: 100%;height: 100%;background-color: rgba(0,0,0,0.9);z-index: 30;display: none;}
.xieyi_box{width: 850px;margin-left: 115px;color: white;height: 1500px;overflow: auto;margin-top: 200px;-webkit-overflow-scrolling: touch;}
.xieyi_box p{margin-bottom: 20px;}
.p1{font-size: 50px;}
.p2{font-size: 40px;}
.p3{font-size: 28px;line-height: 60px;}
#wrongword{text-align: center;font-size: 50px;color: white;margin-top: 900px;}


/*第4页,xle的外观360查看*/
.page4 {width: 100%;height: 100%;overflow: hidden;background-color: white;position: relative;z-index: 5;}
/*加载的时候,注册页会出现,先隐藏,后期再出来*/
.page4 {opacity: 0.01;}
.circlr1 {width: 100%;height: 100%;margin-top: -200px;}
.carxsered {display: block;width: 366px;position: absolute;top: 1360px;left: 130px;display: none;}
.carxsewhite {display: block;width: 366px;position: absolute;top: 1360px;left: 130px;display: none;}

.btncirclrs {width: 100%;height: 205px;text-align: center;position: absolute;left: 0px;bottom: 150px;}
.opendoor1 {width: 446px;height: 196px;vertical-align: top;position: absolute;top: 1450px;left: 580px;}
.opendoor {width: 200px;height: 196px;vertical-align: top;position: absolute;top: 1450px;left: 800px;-webkit-tap-highlight-color:rgba(0,0,0,0);}
.turnleft {vertical-align: top;position: absolute;top: 1180px;left: 500px;}
.turnright {vertical-align: top;}

.quanquan{position: absolute;top: 1050px;left: 18px;}

.xle360_1{position: absolute;display: none;}
.ssssssss{position: absolute;top: 300px;left: 300px;}




/*车门上小圆点的呼吸*/
.huxi1 {-webkit-animation: huxi1 1s linear infinite;}
@-webkit-keyframes huxi1{
	0%{opacity: 1;}
	50%{opacity: 0.2;}
	100%{opacity: 1;}
}
ol, ul {
	list-style: none;
}
.thirdbtnwrap li.active, .thirdbtn.active {
	background: #ffffff;
	color: #0a0a0a;
}

.thirdbtnwrap2{
  width:100%;
  text-align:center;
}
.thirdbtnwrap2 li.active, .thirdbtn.active {
	background: #cccccc;
	
	color: white;
}
.thirdbtnwrap li {
	display: inline-block;
	color: #ffffff; 
	width: 79px;
	height: 32px;
	line-height: 32px;
	font-size: 14px;
	text-align: center;
	cursor: pointer;
	border-radius: 20px;
}
.thirdbtnwrap2 li {
	border:1px solid #ffffff;
	display: inline-block;
	
	width: 79px;
	height: 32px;
	line-height: 32px;
	font-size: 14px;
	text-align: center;
	cursor: pointer;
	border-radius: 20px;
}

.qiehuan{
  width: 140px;
  height: 30px;
  line-height: 30px;
  border-radius: 15px;
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  -ms-border-radius: 15px;
  -o-border-radius: 15px;
  position: fixed;
  top:10%;
  left: 50%;
  margin-left: -70px;
  z-index: 27;
  background-color: #f2f3f5;
  cursor: pointer;
  display: none;
  outline: none;
  box-shadow: 0px 0px 7px 1px rgba(0,0,0,0.05);
  font-size: 14px;
}
.qh-btn{
  float: left;
  width: 50%;
  text-align: center;
  border-radius: 15px;
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  -ms-border-radius: 15px;
  -o-border-radius: 15px;
  color: #000;
}
.active{
  background-color: #fff;
  font-weight: bold;
}
.logo-top{
  width: 100%;
  height: 5%;
  background-color: #fff;
  box-sizing: border-box;
  padding: 0 10px;
}
.logo-top a{
  display: block;
  height: 70%;
  width: 180px;
}
.logo-l{
  float: left;
}
.logo-r{
  float: right;
}
.logo-r img{
  float: right;
}
.logo-top a img{
  width: auto;
  height: 100%;
  margin-top: 5px;
}
.back-car{
  display: none;
  width: 60px;
  height: 60px;
  position: fixed;
  top: 9%;
  left: 30px;
  z-index: 27;
}
.back-car img{
  width: 100%;
}
.bottombar {width: 100%;height: 10%;background: none;position: absolute;left: 0px;bottom: -10px;z-index: 11;}
.bottombar p {
    text-align: center;
    width: 80%;
    font-size: 12px;
    margin-left: 10%;
}
@media screen and (min-width: 224px) and (max-width: 767px){
  .logo-top{
    height: 5%;
    box-sizing: border-box;
    padding: 0 0.5rem;
  }
  .waiguan{
    height: 95% !important;
  }
  .logo-top a{
    display: block;
    width: 7rem;
  }
  .back-car{
    display: none;
    width: 3rem;
    position: fixed;
    top: 9%;
    left: 1em;
    z-index: 27;
  }
   .bottombar {
        width: 100%;
        height: 10%;
        background: none;
        position: absolute;
        left: 0px;
        bottom: 0px;
        z-index: 11;
    }

    .bottombar p {
        text-align: center;
        width: 85%;
        font-size: 10px;
        margin-left: 7%;
    }
}