﻿@charset "utf-8";
/*autor  1939890928@qq.com*/
/* CSS Document */

html {
    font-size: 100%;
}

*{margin:0;padding:0}
html{overflow-x:hidden; font-size:100%;}
body{width:100%;min-width:320px;margin:0 auto;font-family:"Microsoft Yahei";background:#000;overflow-x:hidden;color:#737373}
.wb{background:#fff; margin-bottom:1rem}
img{border:none}
h1,h2,h3{font-weight:400}
a{color:#737373;text-decoration:none;-webkit-tap-highlight-color:transparent;-webkit-tap-highlight-color:transparent;outline:none；}
input,select,textarea{font-family:"Microsoft Yahei";font-size:1em;outline:0;margin:0;padding:0}
input::-webkit-input-placeholder{color:#a8a8a8!important}
textarea::-webkit-input-placeholder{color:#a8a8a8!important}
input[type=button],input[type=text],input[type=search],input[type=submit],input[type=reset],input[type=date],input[type=time],input[type=number]{-webkit-appearance:none}
select{-webkit-appearance:none}
textarea{-webkit-appearance:none}
input::-webkit-inner-spin-button,input::-webkit-outer-spin-button{-webkit-appearance:none!important;margin:0}
ol,ul{padding:0;list-style-type:none}
em{font-style:normal}
.lt{float:left}
.rt{float:right}
input.sub,label{border:none;cursor:pointer}
input,textarea{font-family:"Microsoft Yahei";outline:0;margin:0;padding:0}
table{border-collapse:collapse}
td,th{padding:0}
div.clear{font:0 Arial;line-height:0;height:0;overflow:hidden;clear:both}
input[type=button]{
 -webkit-appearance:none;
 outline:none;
}
img{ display:block; margin:0 auto}
input {
outline: none;
}
b{ font-weight:normal; }

body,
html {
    height: 100%;
    overflow: auto;
    width: 100%;
    background-color: #ceb383;
}

.index{ position:relative }
.index img{ display:block; width:100%; }

.grass{ position:fixed; left:0; top:0; width:32%; z-index:2}
.grass img{ width:100%; }


.car{ position: fixed;
    left: 10.7vw;
    top: 30vh;
    width: 3rem; z-index:1}
.car img{ width:100%; }

.index{ position:relative }

video{ width:100%; position:relative; top:4rem}

.layer{ position:absolute; left:0; top:0; width:100%; height:100%; z-index:100; background:#000; display:none}
.layer a{ position:fixed; right:0.5rem; top:0.5rem; z-index:101}
.layer a img{ width:0.5rem}

/*不同设备字体em基准*/
@media screen and (min-width: 320px) and (max-width: 360px){ 
  html{
  	font-size:12px;
  }
}
@media screen and (min-width: 360px) and (max-width: 480px){ 
  html{
  	font-size:14.0625px;
  }
}
@media screen and (min-width: 480px) and (max-width: 700px){ 
  html{
  	font-size:22.5px;
  }
}
@media screen and (min-width: 700px) and (max-width: 1000px){ 
  html{
  	font-size:28px;
  }
}
@media screen and (min-width: 1000px) and (max-width: 1200px){ 
  html{
  	font-size:32px;
  }
}
@media screen and (min-width: 1200px) and (max-width: 1400px){ 
  html{
  	font-size:40px;
  }
}
@media screen and (min-width: 1400px){ 
  html{
  	font-size:50px;
  }
}


.hp{ width:100%; height:100%; position: fixed; left:0; top:0; z-index:990; background:#fff; padding-top:3rem; box-sizing:border-box; opacity:0.9; z-index: 1001;}
.hp img{ width:100%}

.index2{ position:relative }
.index2 img{ width:100%; display:block; }

.clickasdsd{ position: absolute;
    width: 9.6rem;
    height: 5.3rem;
    transform: rotate(90deg); -webkit-transform: rotate(90deg);    position: absolute;
    left: -1rem;
    bottom: 4.2rem;
}

.clickasdsd img{ width:100%; display:none}


.text{ position:absolute; left:5vw; top:14.8vh; width:4rem; font-size:0.25rem; z-index:10; color:#c79f62; transform: rotate(90deg); -webkit-transform: rotate(90deg);}
.text img{ width:1rem;
animation:move 1s linear 1s infinite alternate;
	-moz-animation:move 1s linear 1s infinite alternate; /* Firefox */
	-webkit-animation:move 1s linear 1s infinite alternate; /* Safari and Chrome */
	-o-animation:move 1s linear 1s infinite alternate; /* Opera */ 
	-webkit-animation-iteration-count:infinite;
	animation-iteration-count:infinite;
	-moz-animation-delay:0;}
@keyframes move
{
0%   { transform:translateX(0); -webkit-transform: translateX(0); -moz-transform:translateX(0);   }
100%   { transform:translateX(-0.5rem); -webkit-transform: translateX(-0.5rem); -moz-transform:translateX(-0.5rem); }
}

@-moz-keyframes move /* Firefox */
{
0%   { transform:translateX(0); -webkit-transform: translateX(0); -moz-transform:translateX(0);   }
100%   { transform:translateX(-0.5rem); -webkit-transform: translateX(-0.5rem); -moz-transform:translateX(-0.5rem); }
}

@-webkit-keyframes move /* Safari and Chrome */
{
0%   { transform:translateX(0); -webkit-transform: translateX(0); -moz-transform:translateX(0);   }
100%   { transform:translateX(-0.5rem); -webkit-transform: translateX(-0.5rem); -moz-transform:translateX(-0.5rem); }
}

@-o-keyframes move /* Opera */
{
0%   { transform:translateX(0); -webkit-transform: translateX(0); -moz-transform:translateX(0);   }
100%   { transform:translateX(-0.5rem); -webkit-transform: translateX(-0.5rem); -moz-transform:translateX(-0.5rem); }
}	

.name { transform: rotate(90deg); -webkit-transform: rotate(90deg); position: absolute; left: -5.5vw; z-index: 1000;}
.name img { width: 40vw;}
.name-01 { top: 102vw;}
.name-02 { top: 648vw;}
.name-03 { top: 925vw;}

.a { position: absolute; transform: rotate(90deg);}

.a1 { left: 35vw; top: 285vw; width: 100px;}
.a2 { left: 67vw; top: 268vw; width: 45px;}
.a3 { left: 35vw; top: 588vw; width: 100px;}
.a4 { left: 45vw; top: 553vw; width: 45px;}
.a5 { left: 35vw; top: 869vw; width: 100px;}
.a6 { left: 67vw; top: 835vw; width: 45px;}
.a7 { left: 35vw; top: 1158vw; width: 100px;}
.a8 { left: 45vw; top: 1138vw; width: 45px;}
.a9 { left: 35vw; top: 1380vw; width: 100px;}
.a10 { left: 67vw; top: 1356vw; width: 45px;}
.a11 { left: 35vw; top: 1651vw; width: 100px;}
.a12 { left: 45vw; top: 1628vw; width: 45px;}