﻿@charset "utf-8";
/* CSS Document */
.h_bg{
	position: relative;
	width:100%;
	min-height:100vh;/*1125*/
	background-color: #80c5ee;
	background-attachment: scroll;
	background-repeat:no-repeat;
	background-position:50% 0%;
	background-image:url(../images/index.jpg);
	background-size:100% auto;
	/**/
	padding:13.8vw 0 2.5%;/*292 14.6%*/
	}
.slongan{
	position:absolute;
	width:55.1%;/*1102*/
	padding-bottom:11.5%;/*230*/
	background-attachment: scroll;
	background-repeat:no-repeat;
	background-position:50% 0%;
	background-image:url(../images/slongan.png);
	background-size:100% auto;
	top:4.35vw;/*87*/
	left:22.35%;/*447*/
	/**/
	transition: all .5s;
	}
.car{
	position:relative;
	width:25.1%;/*502*/
	margin:0 auto;
	z-index:1;
	/**/
	transition: all .5s;
	}
.car::before{
	position: relative;
	width:100%;/*502*/
	padding-bottom:123.9%;/*622*/
	content:"";
	display: block;
	/**/
	background-attachment: scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-image:url(../images/car_2.png);
	background-size:100% auto;
	z-index:1;
	}
.car::after{
	position:absolute;
	width:100%;/*502*/
	height:100%;
	content:"";
	display: block;
	/**/
	background-attachment: scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-image:url(../images/car_1.png);
	background-size:100% auto;
	top: 0;
	left: 0;
	z-index:2;
	/**/
	animation:todo 1.35s linear infinite;
	}
.car0{
	position:absolute;
	width:100%;
	height:100%;
	display: block;
	/**/
	background-attachment: scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-image:url(../images/car_0.png);
	background-size:100% auto;
	top: 3%;
	left: 0;
	}
.car2a{
	position:absolute;
	width:100%;
	height:100%;
	display: block;
	/**/
	background-attachment: scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-image:url(../images/car_3a.png);
	background-size:100% auto;
	top: 0;
	left: 0;
	z-index:1;
	/**/
	animation:todo2 1.35s linear infinite;
	}
.car2b{
	position:absolute;
	width:100%;
	height:100%;
	display: block;
	/**/
	background-attachment: scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-image:url(../images/car_3b.png);
	background-size:100% auto;
	top: 0;
	left: 0;
	z-index:1;
	/**/
	animation:todo3 1.35s linear infinite;
	}
.flag{
	position:absolute;
	width:33.6%;/*169 33.6*/
	padding-bottom:42.347%;/*213 42.347*/
	/**/
	background-attachment: scroll;
	background-repeat:no-repeat;
	background-position:100% 100%;
	background-image:url(../images/flag.png);
	background-size:78% auto;
	top:47.427%;/*295 47.427*/
	left: -15.53%;/*-15.53*/
	/**/
	animation:todo5 1.35s linear infinite;
	}
.hotelbx{
	position:absolute;
	width:100%;
	top:17.4vw;/*348*/
	left:0%;
	text-align:center;
	}
.hotelbx > li{
	position:absolute;
	width:16%;/*320*/
	/*padding-bottom:;460*/
	display: inline-block;
	top:0;
	opacity: 0;
	}
.hotelbx > li::before{
	position:relative;
	width: 100%;/*320*/
	padding-bottom:143.75%;/*460*/
	content:"";
	display: block;
	/**/
	background-attachment: scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-size:100% auto;
	}
	
	
.hotel_1{left:6.1%;/*122*/
	animation:fadeInUp .6s ease;
	animation-fill-mode:forwards;
	}	
.hotel_1::before{background-image:url(../images/hotel_1.png);}
.hotel_2{left:21.6%;/*432*/
	animation:fadeInUp .6s .15s ease;
	animation-fill-mode:forwards;
	}	
.hotel_2::before{background-image:url(../images/hotel_2.png);}	
.hotel_3{left:62.2%;/*1244*/
	animation:fadeInUp .6s .25s ease;
	animation-fill-mode:forwards;
	}
.hotel_3::before{background-image:url(../images/hotel_3.png);}		
.hotel_4{left:77.3%;/*1546*/
	animation:fadeInUp .6s .35s ease;
	animation-fill-mode:forwards;
	}	
.hotel_4::before{background-image:url(../images/hotel_4.png);}
/**/
.loginbt{
	position:relative;
	width:20.1%;/*402*/
	display: block;
	margin:0 auto;
	z-index:2;
	top:-5px;
	}
.loginbt p{
	position:relative;
	width: 100%;/*402*/
	/*padding-bottom:23.383%;*//*94*/
	display: block;
	background-attachment: scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-image:url(../images/loginbt_1.png);
	background-size:100% auto;
	/**/
	animation:bs 1s linear infinite;
	}
.loginbt p::before{
	position:relative;
	width: 100%;/*402*/
	padding-bottom:23.383%;/*94*/
	content:"";
	display: block;
	/**/
	background-attachment: scroll;
	background-repeat:no-repeat;
	background-position:50% 50%;
	background-image:url(../images/loginbt_2.png);
	background-size:100% auto;
	opacity: 0;
	/**/
	transition: all .5s;
	}
.loginbt:hover p::before{opacity:1;}

/*20250509 新增*/
.warningbx{
	position: relative;
	width:95%;
	display: block;
	margin:1vw auto 0;
	font-size: .9vw;
  	line-height: 1.4vw;
  	color:#0f233f;/**/
	text-align: left;
	}
.warningbx span{ display: inline-block;}

@media only screen and (max-width:1600px){
/**/

	
	
}
@media only screen and (max-width:1400px){
/**/
}
@media only screen and (max-width:1200px){
/*20250509 新增*/
.warningbx{
	font-size: 1.5vw;
    line-height: 2.33vw;
	margin:1.6vw auto 0;
	}
}
@media only screen and (max-width:1000px){	
/**/

}
@media only screen and (max-width:800px){
/**/

}	
@media only screen and (max-width:780px){
/**/
/*20250512 修改*/
.h_bg{
	width:100%;
	background-color:#fffdee;
	background-image:url(../images/index_m.jpg);
	/**/
	padding:50vw 0 0;/*403 51.6*/
	}
	
.slongan{
	width:98.2%;/*766*/
	padding-bottom:20.639%;/*161*/
	top:16.282vw;/*127*/
	left:.76%;/*6*/
	}
.car{width:79.23%;/*618*/}
.flag{background-size:100% auto;}
	
.hotelbx{
	position:relative;
	top:auto;
	}
.hotelbx > li{
	position:relative;
	width:48.7%;/*380*/
	}
.hotelbx > li::before{
	/*width: 100%;380*/
	padding-bottom:168.42%;/*640*/}
.hotel_1,.hotel_2,.hotel_3,.hotel_4{left:0%;}	
.hotel_1::before{background-image:url(../images/hotel_1m.png);}
.hotel_2::before{background-image:url(../images/hotel_2m.png);}	
.hotel_3::before{background-image:url(../images/hotel_3m.png);}		
.hotel_4::before{background-image:url(../images/hotel_4m.png);}
/**/
.loginbt{
	width:71%;/*554*/
	margin:5% auto;
	top:0;
	}	
	
/*20250509 新增*/
.warningbx{
	font-size: 2.3vw;
    line-height: 3.589vw;
	margin:2.5vw auto;
	text-align: center;
	}	
}
@media only screen and (max-width:685px){ 
/**/
	
}
@media only screen and (max-width:580px){
/**/
	
	
}
@media only screen and (max-width:560px){
/*20250509 新增*/
.warningbx{
	font-size: 4vw;
    line-height: 6vw;
	margin:3.5vw auto;
	}
}
@media only screen and (max-width:470px){
/**/

}

@media only screen and (max-width:380px){
/**/

}
@media only screen and (max-width:360px){
/**/

	
}
@media only screen and (max-width:340px){
/**/


}
 
@keyframes todo {
   0% {top:0%;transform:scale(1,1);transform-origin: 60% 100%;}
   50% {top:.8%;transform:scale(1.01,0.97);transform-origin: 60% 100%;}
   100% {top:0%;transform:scale(1,1);transform-origin: 60% 100%;}
	}
@keyframes todo2 {
   0% {top:0%;transform:rotate(0deg);transform-origin: 60% 100%;}
   50% {top:1%;transform:rotate(-1deg);transform-origin: 60% 100%;}
   100% {top:0%;transform:rotate(0deg);transform-origin: 60% 100%;}
	}
@keyframes todo3 {
   0% {top:0%;transform:rotate(0deg);transform-origin: 60% 100%;}
   50% {top:1%;transform:rotate(1deg);transform-origin: 60% 100%;}
   100% {top:0%;transform:rotate(0deg);transform-origin: 60% 100%;}
	}
@keyframes todo5 {
   0% {top:47.427%;transform:rotate(0deg);transform-origin: 90% 100%;}
   50% {top:48.427%;transform:rotate(-5.5deg);transform-origin: 90% 100%;}
   100% {top:47.427%;transform:rotate(0deg);transform-origin: 90% 100%;}
	}

@keyframes bs {
   0% {transform: scale(1);}
   50% {transform: scale(1.05);}
   100% {transform: scale(1);}
}



