.banner {
  width: 100%;
  height: 466px;
  position: relative;
  background: url('http://jkyun.oss-cn-hangzhou.aliyuncs.com/longterm/53/system/wkdoc/1776700989616260096/2372728978222777856.png?Expires=4919651335&OSSAccessKeyId=LTAI5tFn9r9JM7gznTuVqChq&Signature=eYoCxTr%2Bda00dMyFX7ZPP3aJqiw%3D#download-banner@2x.png') center top no-repeat;
  background-size: cover;
}
h1, h2, h3, h4, p {
  -webkit-margin-before: 0;
  -webkit-margin-after: 0;
  margin-block-start: 0;
  margin-block-end: 0;
  color: #333;
}
.banner-tl {
  font-size: 48px;
  font-weight: bold;
  color: #FFFFFF;
  text-shadow: 0px 3px 10px rgba(0,0,0,0.3100);
  padding-top:220px;
  opacity: 0;
  -webkit-animation: slide-left 1s forwards;
  animation: slide-left 1s forwards;
}
.bantxt {
  width: 1200px;
  margin: 0 auto;
  color: #FFF;
}
.ban-title {
  font-size: 56px;
  font-weight: 600;
  padding-top: 171px;
  position: relative;
  opacity: 0;
  -webkit-animation: slide-left 1s forwards;
  animation: slide-left 1s forwards;
}

/* .ban-img{
  width: 331.25px;
  height: 50px;
 
} */
.ban-h4 {
  font-size: 20px;
  padding-top: 10px;
  position: relative;
  opacity: 0;
  -webkit-animation: slide-left 1s forwards;
  animation: slide-left 1s forwards;
  animation-delay: 0.2s;
  -webkit-animation-delay: 0.2s;
}
.h4 {
  font-size: 14px!important;
}
#wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-content: center;
  width: 100%;
  margin-top: 44px;
}

.title-p {
  font-size: 14px;
  font-weight: 400;
  color: #666666;
  margin-bottom: 49px;
  text-align: center;
  opacity: 0;
  animation-delay: 0.2s;
  -webkit-animation-delay: 0.2s;
}
.item {
  display: inline-block;
  position: relative;
  width: auto;
  height: 200px;
  overflow: hidden;
  cursor: pointer;
  opacity: 0;
}
.item-imgs-wrap {
  position: relative;
  width: 120px;
  height: 120px;
}
.item-txt-wrap {
  position: relative;
  top: 10px;
  width: 120px;
  text-align: center;
  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  transition: all 0.4s;
}
.install-line {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 1250px;
  margin: 0 auto;
}
.install-item1 {
  animation-delay: 0.4s;
  -webkit-animation-delay: 0.4s;
}
.install-item2 {
  animation-delay: 0.8s;
  -webkit-animation-delay: 0.8s;
}
.install-item3 {
  animation-delay: 1.2s;
  -webkit-animation-delay: 1.2s;
}
.install-item {
  width: 387px;
  height: 241px;
  opacity: 0;
  border-radius: 15px;
  margin: 0 10px;
  text-align: center;
  cursor: pointer;
  /* background: url('../img/filter-blur-bg.png') no-repeat;
  background-size: cover; */
  /* background: rgba(237,237,237, 0.4); */
  background: linear-gradient(180deg, rgba(255,255,255,.4) 80%, rgba(132,208,255,.4) 100%);
  backdrop-filter: blur(14px);
  border: 1px solid #D6E7FF;
}
.install-item-img {
  width: 123px;
  height: 123px;
  margin: 27px 0 11px;
  cursor: pointer;
}
.install-item-tips {
  font-size: 19px;
  line-height: 19px;
  font-weight: 500;
  color: #333333;
  display: flex;
  align-items: center;
  justify-content: center;
}

.install-item-link {
  margin-top: 23px;
  display: flex;
  align-items: center;
  justify-content: center;
  color: #1B81FC; 
  font-size: 15px;
}
.install-item-link img {
  margin-left: 10px;
  width: 20px;
  height: 20px;
}

.install-wrap {
  background-color: #fff;
}
.install-btn {
  display: flex;
  align-items: center;
  justify-content: center;
  margin: 35px 0 29px 0;

}

.btn-apply {
  margin-right: 31px;
  display: flex;
  align-items: center;
  width: 178px;
  height: 32px;
  color: rgba(24, 108, 234, 1);
  border: 1px solid rgba(24, 108, 234, 0.58);
  border-radius: 36px;
  line-height: 17px;
  /* margin-bottom: 30px; */
  cursor: pointer;
  /* opacity: 0; */
  animation-delay: 0.4s;
  -webkit-animation-delay: 0.4s;
  font-size: 17px;
}

.btn-apply:hover {
  background-color: rgba(235, 246, 255, 1);
}

.btn-apply img{
  vertical-align: middle;
  /* width: 17px; */
  width:21px;
  height: 21px;
  margin-top: 3px;
  margin-left: 26px;
  margin-right: 14px;
}

.button-consult {
  display: flex;
    font-size: 16px;
    font-weight: 500;
    color: #fff;
    align-items: center;
    width: 148px;
    height: 34px;
    background-color: #186CEA;
    /* border: 1px solid #186CEA; */
    opacity: 1;
    border-radius: 17px;
    
}
.button-consult>img{
  width: 24px;
  height: 24px;
  margin: 0px 14px 0 26px;
}
.button-consult span {
  margin-top: -3px;
}
.install-btns {
  display: flex;
  align-items: center;
  justify-content: center;
  padding-bottom: 32px;
}
.button-consult:hover {
  background-color: #0556cf;
  transition: all 0.4s;
}


.install-wrap .install-con {
  width: 1200px;
  margin: 0 auto;
  display: flex;
  flex-direction: column;
}

.install-wrap .install-con .install-toptxt {
  font-size: 32px;
  margin: 22px 0 40px;
  font-weight: Bold;
}

.install-wrap .install-con .install-items {
  display: flex;
  justify-content: space-between;
}

.install-wrap .install-con .install-items a {
  text-decoration: none;
}

.install-wrap .install-con .install-items #wrap {
  display: flex;
  justify-content: space-between;
  align-items: center;
  align-content: center;
  width: 100%;
  margin: 50px 0 49px 0;
}

.install-wrap .install-con .install-items .item {
  display: inline-block;
  position: relative;
  width: auto;
  height: 200px;
  overflow: hidden;
  cursor: pointer;
  opacity: 0;
}

.install-wrap .install-con .install-items .item-imgs-wrap {
  position: relative;
  width: 121px;
  height: 121px;
}

.install-wrap .install-con .install-items .item-txt-wrap {
  position: relative;
  top: 10px;
  width: 121px;
  text-align: center;
  -webkit-transition: all 0.4s;
  -o-transition: all 0.4s;
  transition: all 0.4s;
}

.install-wrap .install-con .install-items .img-unhover,
.install-wrap .install-con .install-items .img-hover,
.install-wrap .install-con .install-items .code-img-hover {
  top: 0;
  left: 0;
  width: 121px;
  height: 121px;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}

.web-unhover{
  top: 0;
  left: 0;
  width: 121px;
  height: 121px;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}

.install-wrap .install-con .install-items .img-unhover ,
  .install-wrap .install-con .install-items .web-unhover {
  position: relative;
  opacity: 1;
}

.install-wrap .install-con .install-items .img-hover {
  position: absolute;
  opacity: 0;
  -webkit-transform: scale(0.78);
  -ms-transform: scale(0.78);
  transform: scale(0.78);
}

.install-wrap .install-con .install-items .code-img-hover {
  position: absolute;
  opacity: 0;
}

.install-wrap .install-con .install-items .item:hover .img-unhover {
  opacity: 0;
  -webkit-transform: scale(0.4);
  -ms-transform: scale(0.4);
  transform: scale(0.4);
}
.install-wrap .install-con .install-items .item:hover .web-unhover {
  opacity: 1;
  -webkit-transform: scale(0.9);
  -ms-transform: scale(0.9);
  transform: scale(0.9);
}
.install-wrap .install-con .install-items .item:hover .img-hover {
  opacity: 1;
  -webkit-transform: scale(0.7);
  -ms-transform: scale(0.7);
  transform: scale(0.7);
}

.install-wrap .install-con .install-items .item:hover .code-img-hover {
  opacity: 1;
  -webkit-transform: scale(0.9);
  -ms-transform: scale(0.9);
  transform: scale(0.9);
}

.install-wrap .install-con .install-items .txt-title {
  margin: 10px auto;
  font-size: 18px;
  color: #333;
}

.install-wrap .install-con .install-items .txt-unhover,
.install-wrap .install-con .install-items .txt-hover {
  position: relative;
  margin: 10px auto;
  font-size: 14px;
  color: #666;
  -webkit-transition: all 0.3s;
  -o-transition: all 0.3s;
  transition: all 0.3s;
}

.install-wrap .install-con .install-items .txt-unhover {
  left: 0;
  opacity: 1;
}

.btn-down {
  text-align: center;
  display: flex;
  justify-content: center;
  width: 217px;
  height: 36px;
  color: rgba(24, 108, 234, 1);
  border: 1px solid rgba(24, 108, 234, 0.58);
  border-radius: 36px;
  line-height: 36px;
  margin: 0 auto 30px;
  cursor: pointer;
  opacity: 0;
  animation-delay: 0.4s;
  -webkit-animation-delay: 0.4s;
  font-size: 17px;
}

.btn-down:hover {
  background-color: rgba(235, 246, 255, 1);
}

.btn-down img {
  margin: auto 5px auto 0;
  width: 17px;
  height: 17px;
}
.txt-unhover p {
  display: inline;
}

.install-wrap .install-con .install-items .txt-hover {
  top: -29px;
  opacity: 0;
}

.install-wrap .install-con .install-items .item:hover .item-txt-wrap {
  top: -10px;
}

.install-wrap .install-con .install-items .item:hover .txt-unhover {
  opacity: 0;
}

.install-wrap .install-con .install-items .item:hover .txt-hover {
  opacity: 1;
}
.dl-wrap {
  /* height: 490px; */
  width: 1280px;
  margin: 0 auto;
  overflow: hidden;
  margin-top: -309px;
}


.selectWrap {
  background-color: #FAFBFC;
  padding-bottom: 46px;
}
.selectLine {
  display: flex;
  align-items: center;
  justify-content: center;
}
.rightPart {
  width: 451px;
  margin-left: 20px;
}
.iphonePart,.ipadPart,.wxPart {
  display: inline-block;
  background-size: 100%;
  font-size: 20px;
  font-weight: 500;
  line-height: 20px;
  color: #333333;
}
.iphonePart {
  width: 451px;
  height: 390px;
  background-image: url("../img/download-mobile-bg-iphone@2x.png");
  background-size: 100%;
  box-shadow: 0px 0px 6px rgba(24,108,234,0.2000);
  border-radius: 10px;
  text-align: center;
  opacity: 0;
  animation-delay: 0.4s;
  -webkit-animation-delay: 0.4s;
}
.iphonePart img {
  margin: 51px 0 29px 0;
  width: 208px;
  height: 208px;
}
.ipadPart {
  width: 450px;
  height: 185px;
  background-image: url("../img/组-9886@2x.png");
  box-shadow: 0px 0px 6px rgba(24,108,234,0.2000);
  border-radius: 10px;
  margin-bottom: 18px;
  display: flex;
  align-items: center;
  opacity: 0;
  animation-delay: 0.8s;
  -webkit-animation-delay: 0.8s;
}
.ipadPart img {
  margin: 0 34px 0 74px;
  /* width: 136px; */
  /* height: 136px; */
  width: 148px;
  height: 148px;
}
.wxPart {
  width: 450px;
  height: 185px;
  background-image: url("../img/download-mobile-bg-wechat@2x.png");
  box-shadow: 0px 0px 6px rgba(24,108,234,0.2000);
  border-radius: 10px;
  display: flex;
  align-items: center;
  opacity: 0;
  animation-delay: 1.2s;
  -webkit-animation-delay: 1.2s;
}
.wxPart img {
  margin: 0 27px 0 67px;
  width: 150px;
  height: 150px;
}


.contact-wrap {
  padding-bottom: 31px;
}
.contact-line {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  width: 1280px;
  margin:0 auto;
  margin-top: 39px;
}
.contact-item1 {
  animation-delay: 0.2s;
  -webkit-animation-delay: 0.2s;

}
.contact-item2 {
  animation-delay: 0.4s;
  -webkit-animation-delay: 0.4s;
}
.contact-item3 {
  animation-delay: 0.6s;
  -webkit-animation-delay: 0.6s;
}
.contact-item4 {
  animation-delay: 0.8s;
  -webkit-animation-delay: 0.8s;
}
.contact-item5 {
  animation-delay: 1s;
  -webkit-animation-delay: 1s;
}
.contact-item6 {
  animation-delay: 1.2s;
  -webkit-animation-delay: 1.2s;
}
.contact-item {
  width: 387px;
  height: 141px;
  background: rgba(255,255,255,0.3900);
  box-shadow: 0px 0px 6px rgba(0,0,0,0.1600);
  border-radius: 10px;
  margin: 0 10px 20px 10px;
  position: relative;
  opacity: 0;

}
.contact-item-tl {
  display: flex;
  align-items: center;
  padding:  20px 0 15px 31px;
  font-size: 18px;
  font-weight: 500;
  line-height: 18px;
  color: #333333;
}
.contact-item-tl img {
  width: 33px;
  height: 33px;
}
.contact-item-tips {
  width: 325px;
  word-break: break-all;
  font-size: 14px;
  font-weight: 400;
  line-height: 19px;
  color: #666666;
  margin: 0 29px 0 33px
}
.qrcodePart {
  position:absolute;
  font-size: 12px;
  font-weight: 400;
  line-height: 19px;
  color: #666666;
  text-align: center;
  top: 21px;
  right: 33px;

}
.qrcodePart img {
  width: 83px;
  height: 83px;
}
.contact-link {
  font-size: 14px;
  font-weight: 400;
  line-height: 19px;
  color: #186CEA;
  text-align: right;
  bottom: 9px;
  right: 16px;
  position: absolute;
}
.contact-linknew  {
  font-size: 14px;
  font-weight: 400;
  line-height: 19px;
  color: #186CEA;
  text-align: right;
  position: absolute;
  left: 33px;
  bottom: 28px

}

.bottom-wrap {
  width: 100%;
  height: 242px;
  background-position: center top;
  background-repeat: no-repeat;
  background-size: cover;
  background-image: url('../img/solution_download_bg@2x.png');
  text-align: center;
  font-size: 35px;
  font-weight: bold;
  line-height: 35px;
  color: #FFFFFF;
}
.bottom-wrap p {
  padding-top: 83px;
  color: #fff;
}
.freeapply-btn {
  width: 140px;
  height: 34px;
  background: #FFF500;
  border-radius: 17px;
  text-align: center;
  margin:0 auto;
  font-size: 14px;
  font-weight: 500;
  line-height: 34px;
  color: #000000;
  margin-top: 28PX;
  cursor: pointer;
}



.reason-wrap {
  height: 755px;
  background: #0099FF;
  overflow: hidden;
}
.wrap {
  width: 1200px;
  margin: 0 auto;
}
.deve-title {
  opacity: 0;
  text-align: center;
  font-size: 30px;
  padding-top: 50px;
  font-size: 30px;
  font-weight: bold;
  color: #333333;
  margin-bottom: 10px;
  line-height: 30px;
}
.deve-title img {
  width: 39px;
  height: auto;
  vertical-align: middle;
  padding: 0 10px;
}
.deve-title img.right {
  transform: rotate(180deg);
}
.reason-wrap  {
  color: #FFF;
  margin-bottom: 50px;
}
.row {
  display: flex;
  padding-inline-start: 0;
  justify-content: space-between;
  margin-block-start: 0;
}
.reason-item {
  display: inline-block;
  overflow: hidden;
  text-align: center;
  width: 390px;
  height: 260px;
  background: #FFFFFF;
  opacity: 0;
  padding: 35px;
  box-sizing: border-box;
}
.reason-item.center {
  margin: 0 15px;
}
.reason-item h3 {
  font-size: 22px;
  color: #0D58CD;
  margin: 28px 0 12px;
}
.reason-item p {
  font-size: 14px;
  line-height: 24px;
  color: #333333;
}
.direct-wrap {
  height: 534px;
  overflow: hidden;
  background: #FFF;
}
.direct-wrap .col {
  display: inline-block;
  overflow: hidden;
  opacity: 0;
}
.direct-wrap .left {
  width: 268px;
  height: 355px;
}
.direct-wrap .center {
  width: 600px;
  height: 355px;
  margin: 0 20px;
  box-sizing: border-box;
}
.direct-item h4 {
  font-size: 20px;
  font-weight: bold;
  color: #333333;
}
.left .direct-item p {
  color: #666666;
  margin-top: 14px;
  font-size: 14px;
}
.direct-item.center p {
  font-size: 14px;
  margin-bottom: 24px;
  color: #666666;
}
.direct-item p a {
  display: inline-block;
  width: 86px;
  color: #0D58CD;
}
.direct-item.center .row-right {
  width: 320px;
  padding-top: 2px;
  display: inline-block;
}
.direct-wrap .right {
  width: 291px;
  height: 355px;
  background: url(../img/qrcode-bg.jpg);
  position: relative;
  color: #FFF;
  font-size: 16px;
  padding: 0;
  border: none;
}
.direct-wrap .right .title {
  text-align: center;
  margin-top: 30px;
  font-weight: bold;
  color: #FFF;
}
.direct-item {
  border: 1px solid #DCDCDC;
  padding-top: 28px;
  padding-left: 29px;
  padding-right: 29px;
  box-sizing: border-box;
}
.col .direct-item {
  margin-bottom: 18px;
}
.code-box {
  width: 209px;
  height: 246px;
  background: #FFFFFF;
  position: absolute;
  left: 41px;
  right: 41px;
  top: 66px;
  bottom: 43px;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.code-box img {
  width: 152px;
  height: 152px;
  margin-top: 30px;
}
.code-box p {
  color: #666666;
  margin-top: 18px;
}
.item-row {
  display: flex;
}
.row-left {
  display: block;
  width: 86px;
  font-size: 14px;
  padding-top: 2px;
}
.direct-item.center .row-right p {
  margin-top: 12px;
}
.direct-row {
  display: flex;
  justify-content: center;
}
/* window/XP下载弹框 */
.pcBox{
  display: none;
  position: relative;
  text-align: center;
}

.pc-wrap {
  width: 600px;
  height: 180px;
  background: #fff;
  display: flex;
}

.pc-wrap .pc-item {
  flex: 1;
  border-right: 1px solid #d4d2d2;
  /*no */
  text-align: center;
  margin: auto  ;
  color:#606266;;
}

.pc-wrap .pc-item button {
  padding: 10px 25px;
  background-color: #5485e8;
  color: #FFF;
  border-radius: 4px;
  border: 1px solid #DCDFE6;
}

.pc-wrap .pc-item .pc-img7 {
  width: 58px;
  height: 58px;
  margin: 0 auto;
}

.pc-wrap .pc-item .pc-imgxp {
  width: 68px;
  height: 61px;
  margin: -3px auto 0;
}

.pc-wrap .pc-item:last-child {
  border-right: 0;
}

.pc-wrap .pc-item .pc-txt {
  font-size: 14px;
  padding: 12px;
  text-align: center;
}
.pc-button {
  cursor: pointer;
}

.winXp-content {
 position: relative;
 overflow: hidden;
}
.winXp-content .win7_item {

}
.winXp-content .xp_item {
  display: none;
}
.winXp-toggle-wrap {
  position: absolute;
  top: 0;
  right: 0;
  width: 100px;
  height: 100px;
  text-align: right;
  color: #186CEA;
  font-weight: 500;
  box-sizing: border-box;
  font-size: 14px;
  padding-top: 12px;
  padding-right: 7px;
  padding-left: 25px;
  pointer-events: none;
}
.winXp-toggle-wrap::before {
  content: "";
  width:0;
  height: 0;
  border:92px solid transparent;
  border-right:80px solid #E6F3FF;
  transform: rotate(135deg);
  position: absolute;
  right: -100px;
  top: -100px;
  cursor: pointer;
  /* z-index: -9; */
  pointer-events: auto;
}
.winXp-toggle-wrap span {
  position: relative;
  z-index: 9;
}
.product_tip_bg{
  width: 0;
  height: 0;
  border-bottom: 80px solid #ffffff;
  border-right: 80px solid transparent;
  border-left: 80px solid transparent;
  transform: rotate(45deg);
  position: absolute;
  top: -20px;
  right: -40px;
}

.winXp-wrap {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.winXp-wrap img {
  margin-top: 34px;
  width: 157px;
  height: 157px;
}
.winXp-wrap .winXp-title {
  margin-top: 12px;
  font-size: 20px;
  font-weight: 500;
  color: #333333;
  line-height: 20px;
}
.winXp-wrap .winXp-downBtn {
  margin-top: 44px;
  width: 133px;
  height: 36px;
  line-height: 36px;
  text-align: center;
  border-radius: 5px;
  background: #186CEA;
  color: #fff;
  font-size: 16px;
  cursor: pointer;
}
.winXp-wrap .winXp-close {
  margin-top: 15px;
  font-size: 14px;
  color: #666666;
  cursor: pointer;
}

.headerCon {
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  background-color: #000;
  z-index: 12;
}

.name-video {
  display: none;
}

.video-why {
  display: none;
}

.video-close {
  position: absolute;
  right: 14px;
  top: 14px;
  width: 40px;
  height: 34px;
}

.video-close::before,
.video-close::after {
  position: absolute;
  content: " ";
  background-color: #999;
  left: 20px;
  width: 2px;
  height: 34px;
}

.video-close::before {
  transform: rotate(45deg);
}

.video-close::after {
  transform: rotate(-45deg);
}

.video-close:hover:before,
.video-close:hover:after {
  background-color: #5485e8;
}

.video-wraps {
  width: 70%;
  position: fixed;
  left: 50%;
  top: 52%;
  transform: translate(-50%, -50%);
}
.displayBlock {
  display: block;
}

.displayNone {
  display: none;
}

/* 动画设置 */
#pcLayer.slide-bottom, #reason1.slide-bottom {
  animation-delay: 0.2s;
  -webkit-animation-delay: 0.2s;
}
#mac.slide-bottom, #reason2.slide-bottom {
  animation-delay: 0.4s;
  -webkit-animation-delay: 0.4s;
}
#android.slide-bottom, #reason3.slide-bottom {
  animation-delay: 0.6s;
  -webkit-animation-delay: 0.6s;
}
#ios.slide-bottom, #reason4.slide-bottom {
  animation-delay: 0.8s;
  -webkit-animation-delay: 0.8s;
}
#applets.slide-bottom, #reason5.slide-bottom {
  animation-delay: 1s;
  -webkit-animation-delay: 1s;
}
.reason-item.slide-bottom {
  animation-duration: 2s;
}
#reason6.slide-bottom {
  animation-delay: 1.2s;
  -webkit-animation-delay: 1.2s;
}
.col {
  animation-delay: 1s;
  -webkit-animation-delay: 1s;
}

        /* 优惠券样式 */
        .coupon-wrap {
          display: none;
          position: relative;
      }

      .coupon-img {
          position: absolute;
          top: 22px;
          left: 0;
          width: 394px;
          margin: auto;
          height: 500px;
      }

      .coupon-form {
          position: absolute;
          top: 297px;
          left: 32px;
      }

      .coupon-line {
          width: 333px;
          margin: 0 auto;
          margin-bottom: 22px;
      }

      .coupon-input-wrap {
          position: relative;
          height: 28px;
          display: flex;
          justify-content: space-between;
      }

      .coupon-input {
          box-sizing: border-box;
          width: 100%;
          height: 40px;
          padding-left: 15px;
          font-size: 16px;
          border-radius: 4px;
          outline: none;
          color: #666;
      }

      .coupon-Authcode {
          float: left;
          vertical-align: top;
          width: 67%;
      }

      .authcode-wraps {
          display: inline-block;
          vertical-align: top;
          color: rgba(192, 42, 4, 0.3);
          font-size: 16px;
          text-align: center;
          cursor: pointer;
          line-height: 40px;
          box-sizing: border-box;
          width: 30%;
          height: 40px;
          background-color: #ffd081;
          border-radius: 4px;
      }

      .authcode-click {
          display: inline-block;
          vertical-align: top;
          color: rgba(192, 42, 4, 1);
          font-size: 16px;
          text-align: center;
          cursor: pointer;
          line-height: 40px;
          box-sizing: border-box;
          width: 30%;
          height: 40px;
          background-color: #ffd081;
          border-radius: 4px;
      }

      .coupon-input:focus {
          border-color: rgba(192, 42, 4, 0.5);
          z-index: 1;
      }

      .butt-check {
          display: inline-block;
          color: rgba(192, 42, 4, 0.41);
          font-size: 20px;
          text-align: center;
          line-height: 42px;
          cursor: pointer;
          width: 211px;
          height: 42px;
          background: linear-gradient(360deg,
                  rgba(255, 254, 196, 1) 0%,
                  rgba(255, 248, 230, 1) 100%,
                  rgba(255, 248, 230, 1) 100%);
          /* box-shadow: 0px 5px 0px rgba(227, 190, 180, 0.41); */
          border-radius: 8px;
      }

      .butt-check:hover {
          color: rgba(192, 42, 4, 1);
      }
      .butt-share {
        width: 100px;
        margin-left: 20px;
      }

      .copy-check:hover {
          color: #ffd081;
          border: 2px solid #ffd081;
      }

      .copy-check {
          display: inline-block;
          color: #FEF0C1;
          font-size: 19px;
          text-align: center;
          line-height: 42px;
          cursor: pointer;
          width: 80px;
          height: 42px;
          border-radius: 8px;
          border: 2px solid #FEF0C1;
          margin-left: 20px;
      }

      .submit-footer {
          position: absolute;
          top: 448px;
          left: 33px;
          display: flex;
      }

      .coupon-back {
          position: absolute;
          right: 10px;
          top: 10px;
          cursor: pointer;
      }

      .closeBut {
          position: relative;
          width: 30px;
          height: 20px;
      }

      .closeBut::before,
      .closeBut::after {
          position: absolute;
          content: " ";
          background-color: #999;
          left: 20px;
          width: 2px;
          height: 20px;
      }

      .closeBut::before {
          transform: rotate(45deg);
      }

      .closeBut::after {
          transform: rotate(-45deg);
      }

      .closeBut:hover:before,
      .closeBut:hover:after {
          background-color: rgba(243, 111, 111, 1);
      }

      .coupon-success-wrap {
          position: absolute;
          width: 100%;
          height: 100%;
          top: 0;
          left: 0;
      }

      .coupon-success-popup {
          display: none;
          position: absolute;
          top: 166px;
          left: 24px;
          width: 345px;
          height: 158px;
          border-radius: 4px;
          background-color: #fff;
          text-align: center;
          box-shadow: 1px 1px 6px #999;
      }

      .successs-footer {
          position: absolute;
          height: 55px;
          line-height: 55px;
          top: 93%;
          width: 345px;
          border-radius: 4px;
          text-align: center;
          height: 55px;
          background: rgba(239, 239, 239, 1);
          box-shadow: 0px 3px 6px rgba(0, 0, 0, 0.16);
          font-size: 15px;
          color: rgba(101, 101, 101, 1);
      }

      .coupon-success-p1 {
          margin: 50px auto 20px auto;
          font-size: 30px;
          line-height: 17px;
          color: rgba(243, 111, 111, 1);
      }

      .coupon-success-p2 {
          font-size: 24px;
          line-height: 40px;
          color: rgba(101, 101, 101, 1);
      }

      #cashCode,
      #telFour {
          display: inline;
          font-size: 18px;
      }

      .layui-layer {
          box-shadow: none !important;
      }

      .coupon-close {
          position: absolute;
          top: 30px;
          right: 57px;
          z-index: 999;
          cursor: pointer;
      }

      .button {
          position: relative;
          width: 30px;
          height: 20px;
      }

      .button::before,
      .button::after {
          position: absolute;
          content: " ";
          background-color: #fff;
          left: 20px;
          width: 2px;
          height: 20px;
      }

      .button::before {
          transform: rotate(45deg);
      }

      .button::after {
          transform: rotate(-45deg);
      }

      .button:hover:before,
      .button:hover:after {
          background-color: #ffd081;
      }

      .sell-video {
          margin: 20px auto auto auto;
          width: 252px;
          height: 36px;
          background: #186CEA;
          border-radius: 17px;
          display: inline-block;
          text-align: justify;
          text-align: center;
          color: #fff;
          cursor: pointer;
          line-height: 36px;
      }

      .sell-video:hover {
          background-color: #5A9CFF;
      }

      .sell-video img {
          width: 14px;
          height: 14px;
          vertical-align: middle;
          margin-bottom: 2px;
      }

      .authcode-coupon {
          display: inline-block;
          vertical-align: top;
          box-sizing: border-box;
          width: 100px;
          height: 39px;
          margin-left: 6px;
          background-color: #fff;
          cursor: pointer;
      }

      #couponCodeUrl {
          width: 100px;
          height: 39px;
      }

      .install1{
        animation-delay: 0.2s;
        -webkit-animation-delay: 0.2s;
      }
      .install2{
        animation-delay: 0.4s;
        -webkit-animation-delay: 0.4s;
      }
      .install3{
        animation-delay: 0.6s;
        -webkit-animation-delay: 0.6s;
      }
      .install4{
        animation-delay: 0.8s;
        -webkit-animation-delay: 0.8s;
      }
      .install5{
        animation-delay: 1s;
        -webkit-animation-delay: 1s;
      }

      .install6{
        animation-delay: 1.2s;
        -webkit-animation-delay: 1.2s;
      }

      /* .btn-sheet:hover {
          transform: scale(1.1);
        
          -webkit-transition: all 0.4s;
          -o-transition: all 0.4s;
          transition: all 0.4s;
      } */

      .btn-sheet {
          display: flex;
          align-items: center;
          width: 140px;
          height: 34px;
          font-size: 14px;
          background: #FFF500;
          border-radius: 17px;
          text-align: center;
          /* line-height: 34px; */
          /* box-shadow: 0px 0px 0px 8PX rgba(255, 255, 255, 0.1); */
          cursor: pointer;
          /* font-weight: 500; */
          color: #333;
          margin-top: 20px;
          opacity: 0;
          -webkit-animation: slide-left 1.2s forwards;
          animation: slide-left 1.2s forwards;
      }
      .btn-sheet img {
        width:15px;
        height: 14px;
        margin-left: 15px;
        margin-right: 7px;
        margin-top: 3px;

      }
      .dl-title {
        font-size: 44px;
        line-height: 44px;
        color: #FFFFFF;
        margin-bottom: 25px;
        text-align: center;
        font-weight: bold;
      }
      .dl-p {
        font-size: 16px;
        line-height: 16px;
        color: #FFFFFF;
        text-align: center;
        margin-bottom: 48px;
      }