.page{
  position: relative;
	width:100%;height:100%;
}

.swiper-container {
  width: 100%;
  height: 100%;
  margin-left: auto;
  margin-right: auto;
}
.swiper-slide {
  display: -webkit-box;
  display: -ms-flexbox;
  display: -webkit-flex;
  display: flex;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  -webkit-justify-content: center;
  justify-content: center;
  -webkit-box-align: center;
  -ms-flex-align: center;
  -webkit-align-items: center;
}

.page1{
  background:url('../img/bg1.jpg') center center no-repeat;
  background-size:auto;
  object-fit:cover;
  overflow: hidden;
}

.page1 .reservate-btn{
  position:absolute;
  top:50%;left:50%;
  margin:140px  0 0-217px;
  width:435px;height:135px;
  line-height:128px;
  font-size:58px;
  color:#6c3508;
  font-weight:700;
  text-align:center;
  overflow:hidden;
  background:url('../img/reservate.png') center center no-repeat;
  background-size:cover;
  object-fit:contain;
}

.page1 .tit-icon{
  position:absolute;
  top:50%;left:50%;
  margin:300px 0 0 -236px;
  width:472px;height:47px;
  overflow:hidden;
  background:url('../img/tit.png') center center no-repeat;
  background-size:cover;
  object-fit:contain;
}

.page2{
  background:url('../img/bg2.jpg') top center no-repeat;
  background-size:cover;
  object-fit:cover;
  overflow: hidden;
}

.page2 .video-area{
  position:absolute;
  top:50%;left:50%;
  margin: -445px 0 0 -740px;
  width:1470px;height: 890px;
  background:url('../img/content1.png') center center no-repeat;
  background-size:cover;
  object-fit:contain;
  transform: scale(0.9,0.9);
  -webkit-transform: scale(0.9,0.9);
}
.page2 .video-area .video-ibox{
  position:absolute;
  top:203px;left:409px;
  width:786px;height:468px;
}
.page2 .video-area .video-ibox .img-wh{
  border-radius:10px;
  overflow: hidden;
}

.page2 .video-area .video-ibox .play-icon{
  position: absolute;
  top: 50%;left: 50%;
  margin: -55px 0 0 -55px;
  width: 110px;height: 110px;
  background: url('../img/play-icon.png') no-repeat;
}

.page3{
  background:url('../img/bg2.jpg') top center no-repeat;
  background-size:cover;
  object-fit:cover;
  overflow: hidden;
}

.page3 .img-area{
  position:absolute;
  top:50%;left:50%;
  margin: -462px 0 0 -727px;
  width:1454px;height: 925px;
  background:url('../img/content2.png') center center no-repeat;
  background-size:cover;
  object-fit:contain;
  transform: scale(0.9,0.9);
  -webkit-transform: scale(0.9,0.9);
}

.page3 .img-area .card-swiper {
  position: absolute;
  top: 220px;left: 370px;
  width: 928px;height: 564px;

}
.page3 .img-area .card-wrapper {
  position: relative;
  width: 100%;
  height: 100%;
}

.page3 .img-area .card-item{
    position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border-radius: 12px;
  overflow: hidden;
  box-shadow: 0 8px 24px rgba(0,0,0,0.15);
  transition: all 0.4s cubic-bezier(0.4, 0, 0.2, 1);
  cursor: pointer;
  padding: 28px 45px 27px 56px;
  background: url('../img/img-bg.png') no-repeat;
  box-sizing:border-box;
}

.img-wh{
  border-radius: 10px;
  overflow: hidden;
}

.page3 .img-area .next-btn{
  position: absolute;
  top:470px;right: -14px;
  width: 113px;height: 64px;
  background: url('../img/next-btn.png') no-repeat;
  z-index: 20;
  cursor: pointer;
}

.page4{
  height:320px !important;  
  background:#181819 url('../img/footer.jpg') top center no-repeat;
  background-size:auto;
  object-fit:cover;
}

.reservate-tc{
  position:fixed;
  top:50%;left:50%;
  margin:-326px 0 0 -479px;
  width:958px;height:652px;
  background:url('../img/tc.png') no-repeat;
  z-index:10;
}

.reservate-tc .close{
  position:absolute;
  top:0;right:0;
  width:102px;height:102px;
}

.reservate-tc .phone-input{
  position:absolute;
  top:117px;left:157px;
  padding:0 20px;
  width:637px;height:93px;
  line-height:93px;
  background:transparent;
  font-size:28px;
  color:#2d3c6a;
  outline:none;
  border:none;
  box-sizing:border-box;
}

.reservate-tc .code-input{
  position:absolute;
  top:238px;left:42px;
  padding:0 20px;
  width:482px;height:93px;
  line-height:93px;
  font-size:28px;
  color:#2d3c6a;
  background:transparent;
  outline:none;
  border:none;
  box-sizing:border-box;
}

.reservate-tc .send-code-btn{
  position:absolute;
  top:238px;left:528px;
  width:266px;height:93px;
  line-height:93px;
  font-size:32px;
  color:#2d3c6a;
  text-align:center;
}

.reservate-tc .tit{
  position:absolute;
  left:37px;
  height:40px;
  line-height:40px;
  font-size:28px;
  color:#2d3c6a;
}
.reservate-tc .tit1{
  top:368px;
}
.reservate-tc .tit2{
  top:435px;
}
.reservate-tc .tit .icon{
  display:inline-block;
  margin-right:10px;
  width:40px;height:40px;
  background:url('../img/choose-icon1.png') no-repeat;
  vertical-align:-9px;
}
.reservate-tc .tit .icon.active{
  background:url('../img/choose-icon2.png') no-repeat;
}
.reservate-tc .tit a{
  display:inline-block;
  color:#ff522a;
  text-decoration:underline;
}

.reservate-tc .button{
  position:absolute;
  top:523px;left:147px;
  width:542px;height:84px;
}

.video-tc{
  position: fixed;
  top: 50%;left: 50%;
  margin: -225px 0 0 -400px;
  width: 800px;height: 450px;
  z-index: 10;
}

.feature-tc{
  position:fixed;
  top:50%;left:50%;
  margin:-253px 0 0 -450px;
  width:900px;height:506px;
  z-index:3;
}

.feature-tc .featureSwiper{
  width:100%;height:100%;
  overflow:hidden;
}

.feature-tc .swiper-pagination{
  margin-left:-60px;
  left:50%;
}

.feature-tc .swiper-pagination-bullet{
  margin:0 5px;
  width:10px;height:10px;
  background:#fff;
}

/* 可点击元素手型 */
.reservate-btn,.play-icon,.close,
.reservate-tc .send-code-btn,.reservate-tc .button,
.reservate-tc .tit .icon{
  cursor:pointer;
}