.banner {
  width: 100vw;
}

.bg-top {
  width: 100vw;
  background-size: cover;
}

.end-bg img {
  width: 100%;

}

.main-box {
  width: 100%;
  background-color: #FFFFFF;
  box-sizing: border-box;
}

.footer-bg {
  width: 100vw;
  height: 44.3333vw;
}

.camon18Txt {
  width: 93%;
  margin: auto;
  text-align: center;
  background-image: radial-gradient(circle farthest-side at 75% 99%, #0088ff 1%, #0065f2 26%, #0161e9 43%, #0266d0 52%, #0070be 100%);
  padding: 18vw 0 23vw 0;
  margin-top: 2vw;
  border-radius: 2.5vw;
  box-shadow: 0.333333vw 0.423511vw 0px 0.613154vw #9a9797;
  margin-bottom: 10vw;
}

.box1,
#pid {

  width: 100%;
  line-height: 1.5;
}

#pid {
  padding: 2rem 0 1rem;
  width: 90%;
  line-height: normal;
  font-size: 4.1667vw;
  top: 10%;
  background: #fff;
  position: fixed;
  margin: auto;
  left: 0;
  right: 0;
  z-index: 999;
  border-radius: 4.0833vw;
  display: none;
}

#pid p {
  font-size: 4.1667vw;
  text-align: center;
}

.ma-t {
  text-align: center;
}

.ThankYouClos {
  position: absolute;
  top: 2.0833vw;
  width: 5.6667vw;
  right: 2.0833vw;
}

#codeNumber {
  letter-spacing: 6px;
  line-height: 8.8611vw;
  color: #019aff;
  font-weight: bold;
  display: block;
  font-size: 7.9444vw;
}

.exp-info {
  display: block;
  width: 82%;
  margin: 6vw auto 0;
  height: 11.7629vw;
  line-height: 11.7629vw;
  background-color: #bb8738;
  color: #fff !important;
  border-radius: 10px;
  font-size: 2vw;
}

.btnwrp a {
  color: #019aff;
  font-size: 3.7778vw;
  font-weight: bold;
}

.carr-clms {
  display: flex;
  flex-flow: column;
  text-align: center;
}

.td-cr {
  margin-bottom: 6.033vw;
}

.td-cr div {
  height: 6.9778vw;
}

.inputInf {
  width: 85%;
  /* padding: 10px 15px; */
  border: none;
  border-bottom: 1px solid #eee;
  height: 6.67vw;
  background: none;
  color: #fff;
  outline: none;
  font-size: 4.1667vw;
}

.NotBtnsubmit img {
  width: 85%;
}

input::placeholder {

  color: #ccc;

}

#yep {
  overflow-wrap: anywhere;
  width: 90%;
  margin: auto;
}

.gren-btn {
  border: none;
  color: #ffffff;
  background-image: linear-gradient(90deg, #46aef7 0%, #1dd5e6 100%);
  display: block;
  font-weight: bold;
  text-align: center;
  min-width: 59.7222vw;
  cursor: pointer;
  margin: 4.8611vw auto;
  border-radius: 12px;
  height: 10.8611vw;
  font-size: 3.9444vw;
}

#pidMask {
  /* display: none; */
  background: black;
  width: 100%;
  height: 100%;
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  z-index: 99;
  opacity: .5;
  display: none;
}

.tip-txt {
  width: 90%;
  text-align: left;
  font-size: 3.5667vw;
  margin: 0 auto 5.0833vw auto;
  color: #fff;
  font-weight: bold;
}

.tip-txt span {
  font-size: 1.8997vw;
}

.tusi {
  position: fixed;
  display: none;
  justify-content: center;
  top: 300px;
  width: 100%;
  z-index: 1000;
}

.tusi span {
  position: relative;
  /* height: 35px; */
  /* line-height: 35px; */
  max-width: 80%;
  background: red;
  color: #fff;
  font-weight: bold;
  font-size: 1.5vw;
  padding: 5px 20px;
  border-radius: 30px;
  margin: 0 auto;
  white-space: pre-wrap;
  text-align: center;

}

/* input[type="date"]::before {
	content: attr(placeholder); */
/* width: 98%; */
/* }
input[type="date"]{
  width: 85%;
} */
input[type="date"].full:before {
  color: black;
  content: "" !important;
}

input[type="date"] {
  direction: ltr;
}

input[type="date"]:before {
  color: #A9A9A9;
  content: attr(placeholder);
}

@media (max-width: 768px) {
  #pid {
    top: 39%;
  }

  .ThankYouClos {
    width: 7.6667vw;
  }
}