@charset 'UTF-8';
body {
  width: 100vw;
  height: 100vh;
  overflow-x: hidden;
  -moz-user-select: none;
  -webkit-user-select: none;
  -ms-user-select: none;
  -khtml-user-select: none;
  user-select: none;
}

.header {
  width: 100vw;
  height: 3.54vw;
  background: linear-gradient(135deg, rgba(90, 90, 95, 1) 0%, rgba(50, 50, 52, 1) 100%);
  position: relative;
  z-index: 20001;
}

.logo {
  float: left;
  margin-top: 0.8vw;
  margin-left: 18.75vw;
  width: 7.83vw;
  height: 1.84vw;
}

.logo img {
  width: 7.83vw;
  height: 1.84vw;
}

.nav {
  float: right;
  margin-right: 16.75vw;
  height: 3.54vw;
}

.nav::after {
  content: "";
  display: table;
  clear: both;
}

.navItem {
  float: left;
  width: 7.08vw;
  height: 3.54vw;
  text-align: center;
  line-height: 3.5vw;
  color: #ffffff;
  cursor: pointer;
}

.info {
  background-color: #fcdb2b;
  color: #28282d;
}

.whiteInfo:hover {
  background-color: #fcdb2b;
}

.navItem a {
  color: #ffffff;
  display: inline-block;
  width: 100%;
  height: 100%;
}

.navItem a:hover {
  color: #ffffff;
}

.navItem a:visited {
  color: #ffffff;
}

.info a {
  color: #28282d;
}

.info a:hover {
  color: #28282d;
}

.info a:visited {
  color: #28282d;
}

.navItem :h .listurl {
  color: #28282d;
}

.listurl:hover {
  color: #28282d;
}

.listurl:visited {
  color: #28282d;
}

#drop {
  height: 0;
  overflow: hidden;
  transition: height 0.5s;
  z-index: 2000001;
}

#drop li {
  height: 2vw;
  line-height: 2vw;
}

.whiteInfo {
  color: #28282d;
  background-color: #ffffff;
}

.infoBottom {
  position: fixed;
  bottom: 0;
  width: 100vw;
  height: 5.83vw;
  background:url(../img/index/pc/banner-7.jpg);
  background-size: 100vw;
}

.infoBottom .presented {
  position: absolute;
  left: 18.75vw;
  top: 2vw;
  font-size: 1.25vw;
  font-weight: 400;
  color: rgba(255, 255, 255, 1);
}

.presented a {
  color: rgba(255, 255, 255, 1);
}

.presented a:hover {
  color: rgba(255, 255, 255, 1);
}

/** Guide Flow **/

.clear::after {
  display: table;
  content: "";
  clear: both;
}
.guide-spray {
  padding-bottom: 5.83vw;
}

.guide-spray .spray__post {
  background-image: url(../img/index/spray/post.jpg);
  background-size: contain;
  background-repeat: no-repeat;
  height: 34.22vw;
  position: relative;
}

.spray__post .client {
  width: 9.38vw;
  position: absolute;
  height: 2.6vw;
  display: inline-block;
  border-radius: 4px;
  /* border: 1px solid rgba(255, 255, 255, 1); */
}

.spray__post .client a {
  height: 100%;
  display: block;
  cursor: pointer;
}

.spray__post .qr-code {
  position: absolute;
  top: 18.75vw;
  left: 29.79vw;
  width: 6.77vw;
  border-radius: 0.21vw;
  height: 6.77vw;
}

.client.ios {
  left: 18.85vw;
  top: 18.75vw;
}

.client.android {
  left: 18.85vw;
  top: 22.92vw;
}

.spray__what {
  width: 100%;
  height: 28.85vw;
  background-color: #ffffff;
}

.spray__what .items {
  text-align: center;
  margin-top: 2.6vw;
}

.spray__what .items > .item {
  display: inline-block;
  width: 22%;
}
.spray__what .items > .item img {
  width: 8.33vw;
  height: 8.33vw;
}

.spray__what .items > .item span {
  margin-top: 1.04vw;
  display: block;
  color: #2b2e34;
  font-size: 0.94vw;
}

.spray__where {
  height: 49.38vw;
  width: 100%;
  background-color: #fcfcfc;
  padding: 0 18.02vw;
  box-sizing: border-box;
}
.spray__where .title {
  text-align: center;
}

.spray__where .title > img {
  height: 6.39vw;
  width: 19.9vw;
  margin: 2.6vw auto 1.56vw;
}

.spray__where .title p {
  font-size: 1.04vw;
  font-weight: 400;
  color: rgba(43, 46, 52, 1);
  line-height: 1.46vw;
}

.spray__where .title p > span {
  color: #999999;
}

.spray__where .pre__line {
  line-height: 1.46vw;
  font-size: 1.04vw;
  position: relative;
  padding-left: 1.82vw;
  box-sizing: border-box;
  text-align: center;
  margin-top: 2.6vw;
}

.spray__where .pre__line::before {
  content: "";
  background-image: url(../img/index/spray/icon_line.png);
  background-repeat: no-repeat;
  /* display: inline-block; */
  height: 1.04vw;
  width: 1.04vw;
  position: absolute;
  top: 0.21vw;
  background-size: contain;
  left: calc(50% - 1.82vw);
}
.spray__where .items {
  margin-top: 1.3vw;
  position: relative;
}

.spray__where .items .img-box {
  width: 25%;
  float: left;
  text-align: center;
}

.spray__where .items::after {
  content: "";
  background-image: url(../img/index/spray/icon_more.png);
  background-size: contain;
  background-repeat: no-repeat;
  height: 0.26vw;
  display: block;
  background-position: center;
  width: 100%;
  margin-top: 0.89vw;
}

.spray__where .items img {
  /* margin: 0 2.92vw; */
  width: 9.17vw;
  height: 9.74vw;
}
/*How*/
.spray__how {
  width: 100%;
  height: 81.67vw;
  background-color: #ffffff;
}

.spray__how .title {
  text-align: center;
}

.spray__how .title > img {
  height: 6.39vw;
  width: 17.14vw;
  margin: 2.6vw auto 2.6vw;
}

.spray__how .step__1,
.spray__how .step__2 {
  text-align: center;
}

.spray__how .step__1 .wrap {
}

.spray__how .step__1 .wrap .step__i {
  float: left;
  width: 33%;
  box-sizing: border-box;
  text-align: center;
}

.spray__how .step__1 .wrap .step__i span {
  display: block;
  color: #28282d;
  font-size: 0.94vw;
  line-height: 1.3vw;
  margin-top: 1.04vw;
  white-space: nowrap;
}

.spray__how .step__i:nth-child(1) {
  padding-left: 17.55vw;
}

.spray__how .step__i:nth-child(3) {
  padding-right: 17.55vw;
}

.spray__how .step__1 .wrap .step__i img {
  width: 16.09vw;
  height: 16.3vw;
}
.spray__how .step__1 > span,
.spray__how .step__2 > span {
  width: 13.65vw;
  height: 2.08vw;
  display: block;
  padding: 0.26vw 1.04vw;
  background: rgba(248, 249, 255, 1);
  border-radius: 1.04vw;
  font-size: 1.04vw;
  font-weight: 500;
  color: rgba(43, 46, 52, 1);
  line-height: 1.46vw;
  box-sizing: border-box;
  margin: 0 auto;
  white-space: nowrap;
}

.spray__how .step__2 {
  margin-top: 2.08vw;
}

.spray__how .step__2 .wrap > span {
  display: inline-block;
  margin-top: 1.04vw;
  color: #2b2e34;
  font-size: 1.04vw;
  line-height: 1.46vw;
}

.spray__how .step__2 .wrap span:nth-child(3) {
  margin-top: 1.56vw;
}

.spray__how .step__2 .wrap > .scene {
  margin-top: 1.04vw;
  display: flex;
  justify-content: center;
}

.scene > .scene__i img {
  widows: 16.04vw;
  height: 14.95vw;
}

.scene > .scene__i:nth-child(1) {
  margin-right: 7.4vw;
}

.scene > .scene__i:nth-child(2) {
  margin-left: 7.4vw;
}

.scene .scene__i span {
  display: block;
  color: #28282d;
  font-size: 0.94vw;
  line-height: 1.3vw;
  margin-top: 1.04vw;
  white-space: nowrap;
}
/** Cost **/
.spray__cost {
  width: 100%;
  height: 41.15vw;
  text-align: center;
  background: rgba(252, 252, 252, 1);
}

.spray__cost span {
  display: block;
  margin-top: 0.52vw;
}

.spray__cost .fee {
  font-size: 0.94vw;
  font-weight: 400;
  color: rgba(43, 46, 52, 1);
  line-height: 1.3vw;
}

.spray__cost .mark {
  font-size: 0.83vw;
  font-weight: 400;
  color: rgba(102, 102, 102, 1);
  line-height: 1.15vw;
}

.spray__cost .wrap {
  display: flex;
  margin-top: 30px;
  justify-content: center;
}

.wrap .wrap__i:nth-child(1) {
  margin-right: 7.4vw;
}

.wrap .wrap__i:nth-child(2) {
  margin-left: 7.4vw;
}

.wrap .wrap__i img {
  width: 16.35vw;
  height: 20.26vw;
}

/** Repay **/
.spray__repay {
  width: 100%;
  height: 41.04vw;
  background: rgba(255, 255, 255, 1);
}

.spray__repay .wrap {
  margin-top: 1.56vw;
  text-align: center;
}

.spray__repay .wrap span {
  display: block;
  font-size: 0.83vw;
  font-weight: 400;
  color: rgba(102, 102, 102, 1);
  line-height: 1.15vw;
}

.spray__repay .wrap > img {
  width: 15.21vw;
  height: 22.24vw;
}

.spray__limit {
  background-color: #fcfcfc;
  height: 19.43vw;
}

.spray__limit .wrap ul {
  display: block;
  text-align: center;
  margin-top: 2.6vw;
}

.spray__limit .wrap ul li {
  list-style: disc;
  list-style-position: inside;
  display: inline-block;
  margin: 0 3.75vw;
}

.spray__limit .wrap ul li span {
  display: list-item;
  font-size: 0.94vw;
  color: #2b2e34;
}

/** Class Common **/
.guide__title {
  text-align: center;
}

.guide__title > img {
  height: 6.3vw;
  display: inline-block;
  object-fit: contain;
  margin: 2.6vw auto 1.56vw;
}

.guide__title > p {
  font-size: 1.04vw;
  font-weight: 400;
  color: rgba(43, 46, 52, 1);
  line-height: 1.46vw;
}
