.success_container {
  padding-top: 40%;
  text-align: center; }
  .success_container .price {
    color: #212121;
    font-size: 24px; }
  .success_container .txt {
    color: #424242;
    font-size: 16px; }
  .success_container .thanks {
    color: #424242;
    font-size: 16px;
    margin-top: 20%; }

.operation_container {
  text-align: center;
  margin-top: 20%; }
  .operation_container .btn {
    width: 80%;
    height: 50px;
    border-radius: 3px;
    border: none;
    font-size: 14px;
    color: #fff;
    box-shadow: 0px 16px 32px 0px rgba(0, 0, 0, 0.15); }
  .operation_container .share {
    background-color: #000000; }
  .operation_container .contact {
    background-color: #3AD7F0;
    margin-top: 20px; }

.success_footer {
  width: 100%;
  margin-top: 15%; }
  .success_footer p {
    width: 100%;
    font-size: 16px;
    color: #424242;
    text-align: center; }

.mask {
  position: fixed;
  top: 0px;
  left: 0px;
  width: 100%;
  height: 100%;
  z-index: 101;
  background-color: rgba(0, 0, 0, 0.3);
  padding: 16px 0px 0px 0px;
  display: none; }
  .mask .mask-tip {
    width: 90%;
    margin-left: 5%;
    z-index: 102;
    background-color: #fff;
    text-align: center;
    height: 80px;
    opacity: 1;
    font-size: 16px;
    border-radius: 10px;
    line-height: 5; }

body {
  font-family: "-apple-system",BlinkMacSystemFont,Roboto,"Helvetica Neue",Helvetica,Arial,"PingFang SC","Hiragino Sans GB","Source Han Sans","Noto Sans CJK Sc","Microsoft YaHei",sans-serif; }

@-webkit-keyframes logo-animation {
  0% {
    -webkit-transform: translateY(30vh); }
  50% {
    -webkit-transform: translateY(30vh) scale(1, 1); }
  100% {
    -webkit-transform: translateY(0) scale(0.6, 0.6); } }

@-webkit-keyframes main-animation {
  0% {
    opacity: 0; }
  50% {
    opacity: 0; }
  100% {
    opacity: 1; } }

@-webkit-keyframes p-animation {
  0% {
    opacity: 1; }
  70% {
    opacity: 1; }
  100% {
    opacity: 0; } }

.p-animation {
  -webkit-animation: p-animation 2.5s;
  opacity: 0; }

.logo-animation {
  -webkit-animation: logo-animation 3s ease-out;
  -webkit-transform: translateY(0) scale(0.6, 0.6); }

.logo-container {
  margin-top: 20%;
  text-align: center; }
  .logo-container .logo img {
    width: 180px; }
  .logo-container .logo p {
    margin-left: 14px;
    letter-spacing: 16px; }

.main-container {
  -webkit-animation: main-animation 4s ease;
  opacity: 0; }

.main-animation {
  opacity: 1; }

.pic-container {
  margin-top: 40px;
  text-align: center; }
  .pic-container img {
    width: 250px; }

.title-container {
  margin-top: 60px;
  text-align: center;
  font-size: 14px; }
  .title-container h4 {
    font-size: 18px; }

.btn-container {
  margin-top: 60px;
  text-align: center; }
  .btn-container button {
    width: 80%;
    height: 50px;
    background-color: #000;
    color: #fff;
    border-radius: 3px;
    border: none;
    font-size: 14px;
    box-shadow: 0px 16px 32px 0px rgba(0, 0, 0, 0.15); }

@media screen and (device-height: 480px) {
  .pic-container {
    margin-top: 20px; }
  .title-container {
    margin-top: 20px; } }

@media screen and (device-height: 736px) {
  .btn-container {
    margin-top: 100px; }
  .title-container {
    font-size: 16px; } }