html{font-size:100px;}
body {
    font-family: -apple-system, BlinkMacSystemFont, "PingFang SC","Helvetica Neue",STHeiti,"Microsoft Yahei",Tahoma,Simsun,sans-serif;
    font-size: 16px;
}
* {
    margin: 0;
    padding: 0;
}
#app {
    height:100vh;
}
h3 {
    text-align: center;
    font-size: 18px;
    font-weight: 500;
    line-height: 2;
    margin-top: 10px;
}
#dl {
    background: url(../img/dlbg.jpg) no-repeat center top;
    background-size: 100% auto;
    width: 100vw;
    height: 100vh;
    display: flex;
    align-items: center;
    flex-direction: column;
    box-sizing: border-box;
    padding-bottom: 1.11rem;
    position: relative;
    min-height: 7.2rem;
}
.dlb {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
}
.dlb  img {
    width: 100%;
    display: block;
}
.logo {
    text-align: ceter;
    padding-top: 20vh;
}
.logo img {
    width:50vw;
    display: block;
    margin: 0 auto;
}
.logo p {
    text-align: center;
    font-size: 20px;
    color: #fff;
    font-weight: 500;
    margin-top: 10px;
}
.ts1 {
    font-size: 0.16rem;
    line-height: 0.24rem;
    color: #973802;
    display: flex;
    align-items: center;
    flex-direction: column;
    position: absolute;
    top: 3rem;
}
.ts1 img {
    width: 0.24rem;
    animation: bounce2 1s infinite;
}
#jg {
     
    background: url(../img/yaoqing1.jpg) no-repeat center top;
    width: 3.75rem;
    min-height: 6.59rem;
    height: 100%;
    position: relative;
    background-size: 100% auto;
    box-sizing: border-box;
}
#jg .bottom {
       color: #fff;
    text-align: center;
    top: 6rem;
    padding: 0 8%;
    line-height: 1.8;
    position: absolute;
    font-size: 0.12rem;
}
.zhe {
    position: fixed;
    width: 100%;
    height: 100%;
    background: rgba(0,0,0,0.8);
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    z-index:9999;
    padding:0.08rem;
    box-sizing: border-box;
    left: 0;
    top: 0;
}
.zhe h4 {
    color: #fff;
    font-size: 0.18rem;
    font-weight: 500;
    line-height: 0.28rem;
    margin-bottom: 0.20rem;
}
.zhe .guan {
    background: red;
    width: 0.28rem;
    height: 0.28rem;
    position: relative;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-top: 0.20rem;
    border-radius: 50%;
}
.zhe .guan:after,.zhe .guan:before {
    content:'';
    width: 2px;
    height: 0.20rem;
    background: #fff;
    position: absolute;
}
.zhe .guan:after {
    transform: rotate(45deg);
}
.zhe .guan:before {
    transform: rotate(-45deg);
}
.yaoqing {
         position: absolute;
    left: 2.16rem;
    top: 4.0rem;
    color: #512d0e;
    font-size: 0.12rem;
    line-height: 0.24rem;
}
.yaoqingz {
    transform: skew(1deg);
}
.yaoqing span {
    color:#363636;
}
.yaoqingz button {
    padding: 2px;
    color: #512d0e;
    font-size: 0.12rem;
    border: 0;
    background: #dd9f52;
    border-radius: 3px;
}
.yaoqing span + .yaoqing span {
    margin-left:0.10rem;
}
.zhiyin {
    display: flex;
    align-content: center;
    justify-content: center;
    padding-top:0.10rem;
}
.zhiyin img {
    width:0.24rem;
     animation: bounce 1s infinite;
    
}
.input {
    position: absolute;
    width: 2.20rem;
    top: 3.60rem;
    left: 0.80rem;
}
.input input {
    background: transparent;
    border: 0;
    color: #512d0e;
    font-size: 0.16rem;
    margin: 0;
    padding: 0;
    width: 100%;
    height: 0.30rem;
    text-indent: 10px;
}
input[type="text"]::placeholder {
    color: rgba(81,45,14,0.8); 
}
input:focus, textarea:focus {
    outline: none;
}
.anniu {
    width: 1.04rem;
    height: 0.40rem;
    position: absolute;
    top: 4.18rem;
    left: 1.38rem;
    border: 0;
    background: transparent;
    padding: 0;
    margin: 0;
}
.tanchu {
    display: flex;
        width: 100%;
    height: 100%;
    position: fixed;
    background: rgba(0, 0, 0, 0.5);
    left: 0;
    top: 0;
    align-items: center;
    justify-content: center;
}
.tanchuZ {
    background: #fff;
    border-radius: 10px;
    width: 80vw;
    overflow: hidden;
    position: relative;
    min-height: 1.80rem;
    display: flex;
    flex-direction: column;
    align-items: center;
    padding-top: 0.40rem;
    padding-bottom: 0.30rem;
}
.tanchuZ > img {
    width: 0.64rem;
}
.tanchuZ > p {
    padding:0.20rem 0.40rem;
    font-size: 0.16rem;
    line-height: 1.5;
    text-align: center;
}
.tanchuZ button {
  background-image: linear-gradient(to right, #ff9100, #ff4800);
  border: 0;
  width: 70%;
  height: 0.36rem;
  border-radius: 0.18rem;
  color: #fff;
  font-size: 0.18rem;
}
.tanchuZ .guan {
    position: absolute;
    width: 0.48rem;
    height: 0.48rem;
    display: flex;
    right: 0;
    top: 0;
    align-items: center;
    justify-content: center;
}
.tanchuZ .guan:after,.tanchuZ .guan:before {
    content:'';
    width: 2px;
    height: 0.30rem;
    background: #666;
    position: absolute;
}
.tanchuZ .guan:after {
    transform: rotate(45deg);
}
.tanchuZ .guan:before {
    transform: rotate(-45deg);
}
@-webkit-keyframes gradientBG-aa08420d {
    0% {
        background-position: 0% 50%
    }

    50% {
        background-position: 100% 50%
    }

    to {
        background-position: 0% 50%
    }
}

@keyframes gradientBG-aa08420d {
    0% {
        background-position: 0% 50%
    }

    50% {
        background-position: 100% 50%
    }

    to {
        background-position: 0% 50%
    }
}
.table {
	background:#fff;
	padding:10px;
	width: 100%;
	box-sizing: border-box;
}
.span1 {
    display: flex;
    align-items: center;
}
.tabT {
    
    border-top:1px solid #cfcfcf;
}

.table > div {
    border-left:1px solid #cfcfcf;
    display: grid;
    grid-template-columns: 60px 1fr 2fr 1fr
}

.table > div > span {
	border-right:1px solid #cfcfcf;
	border-bottom:1px solid #cfcfcf;
	text-align:center;
	line-height:38px;
	font-size:18px;
	color:#363636;
	display: block;
	height: 38px;
}
.table > .tabT > span {
    color:#000;

}
.chaxun {
    padding:10px 10px 0;
}
.chaxun h1 {
    font-size: 18px;
    text-align: center;
    font-weight: 500;
    line-height: 2;
}
.chaxun input {
    border: 1px solid #cfcfcf;
    min-height: 40px;
    border-radius: 5px 0 0 5px;
	flex: 1;
	box-sizing: border-box;
	padding:0 6px;
	font-size: 15px;
}
.span1 span {
    background: #f96d0c;
    color: #fff;
    height: 40px;
    font-size: 16px;
    padding:0 10px;
    line-height: 40px;
    border-radius: 0 5px 5px 0;
}
.ditu {
    display: flex;
    align-items: center;
    justify-content:center;
    width: 100%;
    position: relative;
}
.ditu > img {
    width: 2.4rem;
}
.piao {
    position: absolute;
    top: -9999px;
}
#z1{
    left: calc(50% - 0.12rem);
    top: calc(50% - 1.50rem);
}
#z2{
    right: calc(50% - 0.56rem);
    top: calc(50% - 1.50rem);
}
#z3{
    left: calc(50% - 0.54rem);
    top: calc(50% - 1.50rem);
}
#z4{
    right: calc(50% - 1rem);
    top: calc(50% - 1.50rem);
}
#z5{
    left: calc(50% - 0.98rem);
    top: calc(50% - 1.50rem);
}
#z8{
    left: calc(50% - 0.12rem);
    top: calc(50% - 1.10rem);
}
#z9{
    right: calc(50% - 0.56rem);
    top: calc(50% - 1.10rem);
}
#z7{
    left: calc(50% - 0.54rem);
    top: calc(50% - 1.10rem);
}
#z10{
    right: calc(50% - 1rem);
    top: calc(50% - 1.10rem);
}
#z6{
    left: calc(50% - 0.98rem);
    top: calc(50% - 1.10rem);
}
#z13{
    left: calc(50% - 0.12rem);
    top: calc(50% - 0.70rem);
}
#z12{
    right: calc(50% - 0.56rem);
    top: calc(50% - 0.70rem);
}
#z14{
    left: calc(50% - 0.54rem);
    top: calc(50% - 0.70rem);
}
#z11{
    right: calc(50% - 1rem);
    top: calc(50% - 0.70rem);
}
#z15{
    left: calc(50% - 0.98rem);
    top: calc(50% - 0.70rem);
}
#z18{
    left: calc(50% - 0.12rem);
    top: calc(50% - 0.30rem);
}
#z19{
    right: calc(50% - 0.56rem);
    top: calc(50% - 0.30rem);
}
#z17{
    left: calc(50% - 0.54rem);
    top: calc(50% - 0.30rem);
}
#z20{
    right: calc(50% - 1rem);
    top: calc(50% - 0.30rem);
}
#z16{
    left: calc(50% - 0.98rem);
    top: calc(50% - 0.30rem);
}
#z23{
    left: calc(50% - 0.12rem);
    top: calc(50% + 0.10rem);
}
#z22{
    right: calc(50% - 0.56rem);
    top: calc(50% + 0.10rem);
}
#z24{
    left: calc(50% - 0.54rem);
    top: calc(50% + 0.10rem);
}
#z21{
    right: calc(50% - 1rem);
    top: calc(50% + 0.10rem);
}
#z25{
    left: calc(50% - 0.98rem);
    top: calc(50% + 0.10rem);
}
#z28{
    left: calc(50% - 0.12rem);
    top: calc(50% + 0.50rem);
}
#z27{
    right: calc(50% - 0.56rem);
    top: calc(50% + 0.50rem);
}
#z29{
    left: calc(50% - 0.54rem);
    top: calc(50% + 0.50rem);
}
#z26{
    right: calc(50% - 1rem);
    top: calc(50% + 0.50rem);
}
#z30{
    left: calc(50% - 0.98rem);
    top: calc(50% + 0.50rem);
}
#z33{
    left: calc(50% - 0.12rem);
    top: calc(50% + 0.90rem);
}
#z34{
    right: calc(50% - 0.56rem);
    top: calc(50% + 0.90rem);
}
#z32{
    left: calc(50% - 0.54rem);
    top: calc(50% + 0.90rem);
}
#z35{
    right: calc(50% - 1rem);
    top: calc(50% + 0.90rem);
}
#z31{
    left: calc(50% - 0.98rem);
    top: calc(50% + 0.90rem);
}
#z38{
    left: calc(50% - 0.12rem);
    top: calc(50% + 1.30rem);
}
#z37{
    right: calc(50% - 0.56rem);
    top: calc(50% + 1.30rem);
}
#z39{
    left: calc(50% - 0.54rem);
    top: calc(50% + 1.30rem);
}
#z36{
    right: calc(50% - 1rem);
    top: calc(50% + 1.30rem);
}
#z40{
    left: calc(50% - 0.98rem);
    top: calc(50% + 1.30rem);
}
#z43{
    left: calc(50% - 0.12rem);
    top: calc(50% + 1.70rem);
}
#z44{
    right: calc(50% - 0.56rem);
    top: calc(50% + 1.70rem);
}
#z42{
    left: calc(50% - 0.54rem);
    top: calc(50% + 1.70rem);
}
#z45{
    right: calc(50% - 1rem);
    top: calc(50% + 1.70rem);
}
#z46{
    left: calc(50% - 0.98rem);
    top: calc(50% + 1.70rem);
}
#z48{
    left: calc(50% - 0.12rem);
    top: calc(50% + 2.10rem);
}
#z47{
    left: calc(50% - 0.54rem);
    top: calc(50% + 2.10rem);
}
#z49{
    right: calc(50% - 1rem);
    top: calc(50% + 2.10rem);
}
#z46{
    left: calc(50% - 0.98rem);
    top: calc(50% + 2.10rem);
}
#cheng {
    left: 2.12rem;
    top: 1.3rem;
}
#hong {
    left: 2.12rem;
    top: 0.3rem;
}
#lan {
    left: 2.12rem;
    top: 0.7rem;
}
.piao img {
    display: block;
    width: 0.24rem;
    animation: bounce 1s infinite;
}
@keyframes bounce {
  0%, 100% {
    transform: translateY(0); /* 初始位置和结束位置都在原位置 */
  }
  50% {
    transform: translateY(-0.10rem); /* 向下移动20px */
  }
}
@keyframes bounce2 {
  0%, 100% {
    transform: translateY(0); /* 初始位置和结束位置都在原位置 */
  }
  50% {
    transform: translateY(0.10rem); /* 向下移动20px */
  }
}