.font_1 {
  font-size: 20px;
  font-family: Source Han Sans CN;
  line-height: 26px;
  font-weight: 700;
  color: rgb(230, 65, 46);
}
.font_2 {
  font-size: 15px;
  font-family: Source Han Sans CN;
  line-height: 16.5px;
  font-weight: 700;
  color: rgb(230, 65, 46);
}
.text {
  text-shadow: 0px 3px rgb(255, 255, 255);
}
.text2 {
  text-shadow: 0px 2px rgb(255 255 255);
  font-size: 18px;
}
.red{color: rgb(230, 65, 46);}
.bold{font-weight: bold}
.gray{color:#646464;}
.font_arial{font-family: 'arial'}
.page {
  padding: 401px 0 46.5px;
  background-image: url('../images/84cad32c95d4313a55fac2d191e04f2d.png');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  width: 100%;
  overflow-y: auto;
  overflow-x: hidden;
  height: 100%;
  position: relative;
}
.section_2 {
  padding: 6.5px 0;
  border-radius: 23.5px;
  box-shadow: 0px 0px 13.05px 1.45px rgb(255, 255, 255);
  background-image: url('../images/d55511e8e0bbdadf4f2059abc9fb9cd1.png');
  background-size: 100% 100%;
  background-repeat: no-repeat;
  width: 426px;
  position: relative;
  z-index: 2;
  height: 100%;
}
.section_4 {
  background-color: rgb(254, 240, 212);
  box-shadow: 0px 3px rgb(255, 255, 255);
  border-radius: 5px;
  width: 12px;
  height: 24.5px;
  position: absolute;
  left: 58.5px;
  top: -9px;
  border: solid 2.5px rgb(151, 82, 28);
}
.section_5 {
  background-color: rgb(254, 240, 212);
  box-shadow: 0px 3px rgb(255, 255, 255);
  border-radius: 5px;
  width: 12px;
  height: 24.5px;
  position: absolute;
  right: 58px;
  top: -9px;
  border: solid 2.5px rgb(151, 82, 28);
}
.section_3 {
  margin: 0 6.5px;
  padding: 16.5px 3.5px 16.5px 18px;
  background-color: rgb(254, 240, 212);
  border-radius: 19px;
  width: 413px;
  border: dashed 1.5px rgb(151, 82, 28);
  max-height: 100%;
  overflow-y: scroll;
}
.group {
  line-height: 30px;
  margin-bottom: 10px;
}
.text-wrapper {
  /* margin-top: 14px; */
  padding: 7.5px 0 8px;
  align-self: center;
  background-color: rgb(255, 255, 255);
  border-radius: 17.5px;
  width: 329px;
  border: solid 1.5px rgb(151, 82, 28);
}
.group_2 {
  padding-bottom: 23px;
}
.group_3 {
  padding: 7px 0 6.5px;
}
.text-wrapper_2 {
  padding: 8px 0 7.5px;
  align-self: center;
  background-color: rgb(255, 255, 255);
  border-radius: 17.5px;
  border: solid 1.5px rgb(151, 82, 28);
}
.group_5 {
  padding: 0 3.5px;
}
.text_5 {
  margin-left: 12px;
  margin-right: 6px;
}
.image {
  align-self: center;
  width: 22px;
  height: 16.5px;
}
.image-wrapper {
  padding: 7.5px 0 8px;
  background-color: rgb(230, 65, 46);
  border-radius: 17.5px;
  width: 329px;
  height: 35px;
  border: solid 1.5px rgb(151, 82, 28);
}
.image_3 {
  align-self: center;
  width: 15px;
  height: 15px;
}
.image-wrapper_2 {
  padding: 7.5px 0 8px;
  background-color: rgb(100, 100, 100);
  border-radius: 17.5px;
  width: 329px;
  height: 35px;
  border: solid 1.5px rgb(151, 82, 28);
}
.image_2 {
  width: 281.5px;
  height: 16.5px;
}
.image_4 {
  width: 154.5px;
  height: 16.5px;
}
.space-y-14 > *:not(:first-child) {
  margin-top: 7px;
}
.space-x-14 > *:not(:first-child) {
  margin-left: 7px;
}
.space-x-21 > *:not(:first-child) {
  margin-left: 10.5px;
}
.group_list{position: relative;display: flex;/* flex-direction: column; */align-items: center;}
.group_list+.group_list{margin-top:10px;}
.group_list.right{}
.group_list.error{}
.group_list:before{
  content: '';
  width:30px;
  height: 30px;
  margin-right: 10px;
  /* position: absolute; */
  /* left: 0; */
  /* top: 0; */
  /*background: #333;*/
  display: inline-block;
}
.group_list.right:before{
  background: url("../images/42313045d61fa35ced72faf273e72291.png")  center center no-repeat;
  background-size: 80%;
}
.group_list.error:before{
  background: url("../images/9d942551a35d71774a06bfeb62e53966.png") center center no-repeat;
  background-size: 50%;
}
.group_list.right .text-wrapper{background: #e6412e}
.group_list.error .text-wrapper{background: #646464}
.group_list.right .text-wrapper span{color:#fff}
.group_list.error .text-wrapper span{color:#fff}
.jiexi_content{
  background: url("../images/jiexi_bg.png") center center no-repeat;
  background-size: 100%;
  width: 200px;
  height: 220px;
  display: flex;
  align-items: center;
  justify-content: center;
  flex-flow: column;
  position: relative;
  padding: 10px 10px 10px 40px;
  /* top: 50%; */
  margin-top: 40px;
  margin-left: -32px;
  z-index: 0;
}
.jiexi_content h6{margin:0;padding:0;font-size: 16px;color: #97521c}
.jiexi_bgContent{overflow-y: scroll;max-height: 84%;margin-top: 5px;}
.jiexi_bgContent p{
  font-size: 14px;
  color: #97521c;
}
.jiexi_bgContent p span{
  font-weight: bold;
}

.jiangpinArea{
  width: 400px;
  height: 243px;
  background: url("../images/hb_d_img.png") no-repeat;
  background-size: 100%;
}
.jiangpinArea h6{
  text-align: center;
  color: #fff;
  margin: 0;
  padding: 0;
  font-size: 16px;
  font-weight: bold;
  background: url("../images/title_bg.png") center center  no-repeat;
  background-size: 40%;
  height: 50px;
  line-height: 50px;
}
.jiangpinAreaBorder{
  max-width: 80%;
  margin: 0 auto;
  align-items: center;
  justify-content: center;
  max-height: 60%;
  overflow-y: scroll;
  flex-flow: wrap;
}
.jiangpin_list{
  text-align: center;
  margin-top: 10px;
  width: 44%;
}
.jiangpin_list img{
  width: 61%;
  margin: 0 auto;
}
.jiangpin_list p{}
.hongbao_tip{
  width: 300px;
  height: 280px;
  background: url(../images/hongbao_bg_tip.png) no-repeat;
  background-size: 100%;
}
.hongbao_tip .hongbao_tip_title{width: 60px;margin: 0 auto;text-align: center;display: block;position: relative;top: -20px;}
.hongbao_tip p{
  text-align: center;
  font-size: 34px;
  font-weight: bold;
}
.hongbao_tip h6{
  height: 90px;
  line-height: 90px;
  background-size: 49%;
  margin-top: 30px;
}
.hongbao_tip h6 span{position: relative;padding:0 10px;font-style: italic;}
.hongbao_tip h6 span:before{
  content: '';
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #fff;
  position: absolute;
  top: 50%;
  left: 0;
  margin-top: -2px;
}
.hongbao_tip h6 span:after{
  content: '';
  width: 4px;
  height: 4px;
  border-radius: 50%;
  background: #fff;
  position: absolute;
  top: 50%;
  right: 0;
  margin-top: -2px;
}
.done_tip{

  width: 300px;
  height: 180px;
  background: url(../images/again_bg.png) no-repeat;
  background-size: 100%;
}

.begin_tip {
  width: 300px;
  height: 140px;
  background: url(../images/again_bg.png) center center no-repeat;
  background-size: contain;
}
.done_tip p{
  width: 80%;
  margin: 0 auto;
  padding-top: 30px;
  font-size: 24px;
  line-height: 29px;
}

.done_tip p span{
  display: block;
}
.done_tip h6 {
  margin-top: 4px;
}
.hongbao{
  width: 250px;
}
.hongbao_open{width: 110px;position: absolute;left:50%;top:50%;margin-left: -55px;margin-top: -55px;}
@keyframes scaleDraw
{
  0%{
    transform: scale(1);  /*开始为原始大小*/
  }
  25%{
    transform: scale(1.1); /*放大1.1倍*/
  }
  50%{
    transform: scale(1);
  }
  75%{
    transform: scale(1.1);
  }

}
@keyframes img_ten
{
  0%{
    transform: scale(1);  /*开始为原始大小*/
  }
  25%{
    transform: scale(1.1); /*放大1.1倍*/
  }
  50%{
    transform: scale(1);
  }
  75%{
    transform: scale(1.1);
  }

}

/* 按钮动画效果*/
.img_ten{
  animation-iteration-count:1;
  -webkit-animation-iteration-count:1;
  -webkit-animation-name: img_ten; /*关键帧名称*/
  -webkit-animation-timing-function: ease-in-out; /*动画的速度曲线*/
  -webkit-animation-duration: 1s; /*动画所花费的时间*/
}
.img_oneteen{
  -webkit-animation-name: scaleDraw; /*关键帧名称*/
  -webkit-animation-timing-function: ease-in-out; /*动画的速度曲线*/
  -webkit-animation-iteration-count: infinite;  /*动画播放的次数*/
  -webkit-animation-duration: 2s; /*动画所花费的时间*/
}

.music_open {
  -webkit-animation: moveRo linear 3.5s infinite;
  animation-duration: 3s;
  -webkit-animation-duration: 3s;
  animation-delay: 0s;
  -webkit-animation-delay: 0s;
}
@-webkit-keyframes moveRo {
  from {-webkit-transform: rotate(360deg);  }
  to { -webkit-transform: rotate(-360deg); }
}
@keyframes moveRo {
  from {/* transform: rotate(-360deg) */}
  to {transform: rotate(360deg);}
}
.menuArea{width: 140px;height: auto;background: none;}
.menuArea h6{background-size: 100%;margin-top: 10px;height: 40px;line-height: 40px;}
.menu_AreaPos{position: absolute;left: 20px;bottom: 130px;}
.menu_control{
  position: fixed;
  left: 0;
  bottom: 0;
}
.menu_control_transform{
  transform: rotate(90deg);
  bottom: unset;
  top: 0;
}
.menu_{
  width: 100px;height: 100px;
  background: url(../images/menu_hide.png) no-repeat;
  background-size: 100%;
}
.menu_hide{
  background: url(../images/menu_show.png) no-repeat;
  background-size: 100%;
}
.star_now-out{position: fixed;left: 10px;top: 10px;border-radius: 25px;border: 2px solid #97521c;background: #f8e8d2;padding: 2px;}
.star_now-out_transform{
  transform: rotate(90deg);
  left: unset;
  right: -20px;
  transform-origin: center;
  top: 40px;
}
.star_now_lie{
  background: #ffffff;
  border: 2px solid #97521c;
  border-radius: 25px;
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 2px 25px;
}
.star_now_lie p{}
.hongbao_icon{
  width: 20px;
}
.mp3_control{
  position: fixed;
  right: 0;
  top: 0px;
}
.mp3_control_transform{
  transform: rotate(90deg);
  top: unset;
  bottom: 0;
}
.top_ico{width: 60px;}
/*.haibao{width: 100%;}*/
.add_number,.add_number2{position: absolute;left:0;top:0;}
.opacity0{opacity: 0}
.add_number_animation{
  -webkit-animation: add_number_animation linear 0.5s 1;
  animation-duration: 0.3s;
  -webkit-animation-duration: 0.3s;
  animation-delay: 0s;
  -webkit-animation-delay: 0s;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  -ms-animation-fill-mode: forwards;
  -o-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}
@-webkit-keyframes add_number_animation {
  from {-webkit-transform: translateY(0);opacity: 1  }
  to { -webkit-transform: translateY(-20px);opacity: 0 }
}
@keyframes add_number_animation {
  from {transform: translateY(0);opacity: 1  }
  to { transform: translateY(-20px);opacity: 0 }
}
.add_number_animation2,.add_number2_animation2{
  -webkit-animation: add_number_animation2 linear 0.5s 1;
  animation-duration: 0.3s;
  -webkit-animation-duration: 0.3s;
  animation-delay: 0s;
  -webkit-animation-delay: 0s;
  -webkit-animation-fill-mode: forwards;
  -moz-animation-fill-mode: forwards;
  -ms-animation-fill-mode: forwards;
  -o-animation-fill-mode: forwards;
  animation-fill-mode: forwards;
}
@-webkit-keyframes add_number_animation2 {
  from {-webkit-transform: translateX(0);opacity: 1  }
  to { -webkit-transform: translateX(20px);opacity: 0 }
}
@keyframes add_number_animation2 {
  from {transform: translateX(0);opacity: 1  }
  to { transform: translateX(20px);opacity: 0 }
}
/*@-webkit-keyframes add_number_animation {*/
/*  from {-webkit-top:0;opacity: 1  }*/
/*  to { -webkit-top:-15px;opacity: 0 }*/
/*}*/
/*@keyframes add_number_animation {*/
/*  from {top:0;opacity: 1  }*/
/*  to { top:-15px;opacity: 0 }*/
/*}*/
.loading{
  position: fixed;
  left: 0;
  top: 0;
  width: 100%;
  height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
}
.loading_area{
  position: relative;
  z-index: 2;
  text-align: center;
}
.loading_area text{
  color: #fff;
}
.loading_area p{
  background-color: rgb(254, 240, 212);
  box-shadow: 0px 0px 26.1px 2.9px rgba(255, 255, 255, 0.004);
  border-radius: 25px;
  width: 310px;
  border: 2px solid #97521c;
  padding: 3px;
  line-height: 13px;
  text-align: left;
  margin-top: 5px;
}
.loading_area p span{
  display: inline-block;
  /* width: 45%; */
  background: #e6412e;
  border-radius: 25px;
  color: #fff;
  text-align: center;
  border: 1px solid #97521c;
  font-size: 14px;
}
.video_area{position: fixed;left:0;top:0;width: 100%;height: 100%;
  display: flex;
  align-items: center;
  justify-content: center;
  background: #c8131a;
}
.video_playBtn{width: 70px;height: 70px;position: absolute;left: 50%;top: 50%;margin-left: -35px;margin-top: -35px;}
.phone_area{
  border: 2px solid #97521c;
  border-radius: 15px;
  padding: 4px;
  background: #f8e8d2;
  font-size: 16px;
  width: 70%;
  margin: 0 auto;
  /* background: none; */
  height: auto;
}
.phone_content{
  border: 2px solid #97521c;
  border-radius: 15px;
  background: #ffffff;
  padding: 20px 0 15px 0;
  text-align: center;
}
.phone_content ul{
  width: 80%;
  margin: 0 auto;
  padding: 0;
  list-style: none;
}
.phone_content span{
  display: block;
  color: #9e351e;
  width: 80%;
  text-align: center;
  margin: 22px auto 0px auto;
  font-size: 12px;
}
.phone_content ul li{
  border: 2px solid #97521c;
  background: #f8e8d2;
  width: 100%;
  border-radius: 10px;
  display: flex;
  align-items: center;
}
.phone_content ul li+li{margin-top: 15px;}
.phone_content ul li a{
  text-decoration: none;
  font-size: 16px;
}
.phone_content ul li label{
  color: #97521c;
  margin-left: 9px;
  width: 96px;
  line-height: 40px;
}
.phone_content ul li input,.showinput{
  line-height: 40px;
  width: calc(100% - 117px);
  background: none;
  border: none;
  color: #97521c;
  font-family: 'arial';
  display: block;
  height: 40px;
  text-align: left;
}
.phone_content ul li:nth-child(2) input,.phone_content ul li:nth-child(2) .showinput{
  width: calc(100% - 200px);
}
.phone_content h6 span{margin-top:10px;}

.white{color:#fff !important;}
.font16{font-size: 16px !important;}
/*!*键盘样式*/
.keyboardNum{
  height: 90px !important;
}
.keyboardNum i{
  width: 14.28% !important;;
  height: 50% !important;;
  line-height: 38px !important;;
}
.keyboardNum i.keyBoardPay{height: 90px !important;}
.keyboardNum i.no-right{border-right:2px solid #E5E5E5 !important; }
.keyboardNum i.keyBoardPay{padding:0 9px !important;}
/*!*键盘样式*/

.code_area{width: 390px !important;}
.phone_content_code{}
.phone_content_code ul{
  /* width: auto; */
}
.phone_content_code ul li{
  display: flex;
  align-items: center;
  justify-content: center;
  border: none;
  background: none;
}
.phone_content_code ul li label{
  width: auto;
}
.phone_content_code ul li a{
  color: #3b89ff;
  text-decoration: underline;
}
.phone_content_code ul li .codeImg{
  /* max-width: 100px; */
  height: 40px;
  border: 2px solid #97521c;
  border-radius: 10px;
}
.phone_content_code ul li .showinputCode{
  width: auto;
  height: auto;
  border: 2px solid #97521c;
  background: #f8e8d2;
  width: 140px;
  border-radius: 10px;
  line-height: 40px;
  height: 40px;
}
.phone_content_code ul li .showMsgimg{
  margin-right: 10px;
}
.phone_content_code ul li .showMsgimg{
  width: auto;
  height: auto;
}