/* 产品支付选择支付方式页 */
.pay-loading,
.contact-us-loading {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  justify-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.5);
  z-index: 1000;
  display: none;
  /* display: flex; */
}
.contact-us-loading {
  /* display: flex; */
}

.contact-us-loading .contact-us-body,
.pay-loading .pay-loading-body,
.pay-accomplish-main {
  width: 100%;
  min-width: 300px;
  background: #fff;
  color: #314559;
  font-size: 14px;
}
.contact-us-loading .contact-us-body,
.pay-loading .pay-loading-body {
  box-sizing: content-box;
  font-size: 14px;
  width: 620px;
}
.contact-us-loading .contact-us-body {
  width: 570px;
  height: 400px;
}
.contact-us-loading .contact-us-body .select-buy-type-service {
  border-top: 1px solid #bbb;
}

.contact-us-loading .contact-us-body .pay-cloud-row {
  margin-top: 25px;
}
.contact-us-loading .contact-us-body .contact-us-body-title,
.pay-loading .pay-loading-body .pay-loading-body-title,
.pay-code-loading .pay-code-loading-body .pay-code-loading-body-title,
.pay-success-loading .pay-success-loading-body .pay-success-loading-body-title {
  display: flex;
  justify-content: space-between;
  padding: 0px 10px;
  height: 60px;
  align-items: center;
}
.contact-us-loading .contact-us-body .contact-us-body-title p,
.pay-loading .pay-loading-body .pay-loading-body-title p,
.pay-code-loading .pay-code-loading-body .pay-code-loading-body-title p,
.pay-success-loading .pay-success-loading-body .pay-success-loading-body-title p {
  margin-bottom: 0;
  margin-left: 20px;
  font-size: 20px;
}
.contact-us-loading .contact-us-body .contact-us-body-title span,
.pay-loading .pay-loading-body .pay-loading-body-title span,
.pay-code-loading .pay-code-loading-body .pay-code-loading-body-title span,
.pay-success-loading .pay-success-loading-body .pay-success-loading-body-title span {
  display: inline-block;
  background: #244151;
  color: #fff;
  border-radius: 50%;
  width: 24px;
  height: 24px;
  cursor: pointer;
  text-align: center;
  line-height: 22px;
  font-size: 22px;
}

/* 头部图片 */
.pay-loading .pay-loading-body .title-img {
  color: #fff;
  height: 150px;
  padding: 24px 65px 0;
  background-image: url('../../img/price-deployment/vip_bg.png');
  position: relative;
}
.pay-loading .pay-loading-body .product-info {
  position: absolute;
  bottom: 20px;
}
.pay-loading .pay-loading-body .product-info ul {
  margin: 0;
  padding: 0;
  margin-left: 10px;
  margin-bottom: 10px;
}
.pay-loading .pay-loading-body .product-info ul li {
  list-style: disc;
  line-height: 28px;
}
.pay-loading .pay-loading-body .product-info ul.min-line-height li {
  line-height: 18px;
}
.pay-loading .pay-loading-body .title-img p {
  font-size: 20px;
}
.pay-loading .pay-loading-body .title-img span {
  font-size: 14px;
  line-height: 24px;
}

/* 购买时长 */
.pay-cloud-row {
  display: flex;
  padding: 0 0 0 56px;
  margin-top: 20px;
}
.pay-cloud-row .left {
  width: 100px;
  min-width: 100px;
  /* width: 70px;
  min-width: 70px; */
  /* text-align: right; */
  margin-right: 20px;
}

.pay-loading .pay-loading-body .pay-cloud-row.buy-time .right > span {
  cursor: pointer;
  display: inline-block;
  width: 80px;
  height: 40px;
  background: #eee;
  line-height: 40px;
  text-align: center;
  margin-right: 5px;
  position: relative;
}
.pay-loading .pay-loading-body .pay-cloud-row.buy-type .right button {
  width: 150px;
  height: 40px;
  line-height: 1;
  background: #eee;
  border: 0;
  border-radius: 5px;
  font-size: 14px;
}

.select-buy-type-service .img-box {
  width: 150px;
  border: 1px solid #ccc;
  height: 150px;
}
.select-buy-type-service .img-box img {
  width: 99%;
}
.pay-cloud-row .phone {
  font-size: 14px;
  font-weight: 600;
  color: #1177e3;
}
.pay-cloud-row .remark {
  height: 32px;
  width: 80%;
  border-radius: 3px;
  border: 1px solid #bbb;
  padding: 0 5px;
  outline: none;
}
.pay-cloud-row.gift input {
  height: 32px;
  border-radius: 3px;
  border: 1px solid #bbb;
  padding: 0 10px;
  outline: none;
  width: 230px;
}
.pay-cloud-row.gift .right {
  display: flex;
  align-items: center;
}
.pay-cloud-row.gift .right .input-err {
  position: absolute;
  color: red;
  font-size: 12px;
  display: none;
}
.pay-cloud-row.gift .code-tip {
  margin-left: 10px;
  cursor: pointer;
  border: 1px solid #ccc;
  width: 20px;
  display: inline-block;
  height: 20px;
  border-radius: 50%;
  line-height: 18px;
  text-align: center;
}
.pay-cloud-row.gift .code-btn {
  background: #007ffd;
  margin-right: 44px;
  color: #fff;
  margin-left: 5px;
  height: 30px;
  width: 60px;
  line-height: 1;
  border: 0;
  border-radius: 5px;
  font-size: 14px;
}

.pay-loading .pay-loading-body .pay-cloud-row.buy-type .right button.active {
  background: #007ffd;
  color: #fff;
}
.pay-loading .pay-loading-body .pay-cloud-row.buy-time .right .discounts-icon {
  position: absolute;
  top: 3px;
  right: 3px;
}
.pay-loading .pay-loading-body .pay-cloud-row.buy-time .right .discounts-text {
  position: absolute;
  top: 0px;
  left: 100%;
  margin-left: 3px;
  white-space: nowrap;
  font-size: 12px;
  background: #ffe599;
  line-height: 20px;
  height: 20px;
  padding: 0 3px;
  color: #000;
}
.pay-loading .pay-loading-body .pay-cloud-row.buy-time .right span.active {
  background: #007ffd;
  color: #fff;
}
.pay-loading .pay-loading-body .pay-cloud-row.buy-time .right span.disabled {
  cursor: no-drop;
}

.pay-loading .pay-loading-body .pay-cloud-row .money {
  font-size: 36px;
  color: #d93600;
}
.pay-loading .pay-loading-body .pay-cloud-row .min-money {
  font-size: 24px;
  color: #d93600;
}

.pay-loading .pay-loading-body .pay-cloud-row .name {
  width: 140px;
  display: inline-block;
}
.pay-loading .pay-loading-body .pay-type-box {
  display: flex;
  align-items: center;
}
.pay-loading .pay-loading-body .pay-type-box .img-box {
  width: 180px;
  height: 68px;
  border: 1px solid #bbb;
  display: flex;
  justify-content: center;
  align-items: center;
  box-sizing: border-box;
  cursor: pointer;
  position: relative;
}
.pay-loading .pay-loading-body .pay-type-box .img-box:first-child {
  margin-right: 10px;
}
.pay-loading .pay-loading-body .pay-type-box .img-box .pay-type-select-icon {
  display: none;
  position: absolute;
  bottom: -3px;
  right: -3px;
}
.pay-loading .pay-loading-body .pay-type-box .img-box.active .pay-type-select-icon {
  display: block;
}
.pay-loading .pay-loading-body .img-box.active {
  color: #fff;
  border: 3px solid #d93600;
}
/* pay-type */
.pay-loading .pay-loading-body .pay-type-select-item {
  width: auto;
  height: auto;
  text-align: center;
  border-radius: 5px;
  display: inline-block;
  position: relative;
}
/* 金额 */
.pay-loading .pay-loading-body .agreement {
  display: flex;
  align-items: center;
  margin-top: 10px;
}
.pay-loading .pay-loading-body .read-agreement {
  margin-right: 10px;
  width: 15px;
  height: 15px;
  cursor: pointer;
  border-radius: 0px;
}
.pay-loading .pay-loading-body .consent {
  font-size: 15px;
}
.pay-loading .pay-loading-body .consent a {
  font-weight: 600;
}

/* 底部按钮 */
.pay-loading .pay-loading-body .floor-box {
  height: 90px;
  line-height: 90px;
  text-align: right;
  border-top: 1px solid #bbb;
  margin-top: 30px;
}
.pay-loading .pay-loading-body .floor-box button {
  height: 48px;
  width: 170px;
  line-height: 1;
  background: #eee;
  border: 0;
  border-radius: 5px;
  font-size: 14px;
}
.pay-loading .pay-loading-body .floor-box button:last-child {
  background: #007ffd;
  margin-right: 44px;
  color: #fff;
  margin-left: 5px;
}

/* 支付二维码页 */
.pay-code-loading,
.pay-success-loading {
  position: fixed;
  top: 0;
  bottom: 0;
  left: 0;
  right: 0;
  justify-content: center;
  align-items: center;
  background: rgba(0, 0, 0, 0.5);
  z-index: 1001;
  display: none;
  /* display: flex; */
}
.pay-success-loading {
  /* display: flex; */
}

.pay-code-loading .pay-code-loading-body {
  min-width: 300px;
  background: #fff;
  color: #314559;
  font-size: 14px;
  width: 500px;
  box-sizing: content-box;
  font-size: 14px;
}

.pay-code-loading .pay-code-loading-body .pay-code-main {
  text-align: center;
  padding: 50px;
  border-top: 1px solid #bbb;
  border-bottom: 1px solid #bbb;
  display: flex;
  justify-content: center;
  flex-direction: column;
}
.pay-code-loading .pay-code-loading-body .pay-code-main .rq-code-box {
  width: 160px;
  height: 160px;
  margin: 0 auto;
  position: relative;
  display: flex;
  align-items: center;
  justify-content: center;
}
.pay-code-loading .pay-code-loading-body .pay-code-main .tip-text {
  margin-bottom: 44px;
}

/* 底部按钮 */
.pay-code-loading .pay-code-loading-body .floor-box {
  height: 90px;
  line-height: 90px;
  text-align: center;
}
.pay-code-loading .pay-code-loading-body .floor-box button {
  height: 48px;
  width: 170px;
  line-height: 1;
  background: #eee;
  border: 0;
  border-radius: 5px;
  font-size: 14px;
}
.pay-code-loading .pay-code-loading-body .floor-box button:last-child {
  background: #007ffd;
  color: #fff;
  margin-left: 5px;
}
.pay-success-loading .pay-success-loading-body {
  min-width: 300px;
  background: #fff;
  color: #314559;
  font-size: 14px;
  width: 500px;
  box-sizing: content-box;
  font-size: 14px;
}
.pay-success-loading .pay-success-loading-body .pay-success-main {
  border-top: 1px solid #bbb;
}
.pay-success-loading .pay-success-loading-body .pay-success-main .pay-success-title {
  color: #00b259;
  font-size: 20px;
  /* padding: 0 0 0 56px; */
  margin: 50px 0;
  font-weight: 900;
  display: flex;
  align-items: center;
  justify-content: center;
}
.pay-success-loading .pay-success-loading-body .pay-cloud-row.include-item {
  display: none;
  align-items: baseline;
}
.pay-success-loading .pay-success-loading-body .pay-cloud-row .left {
  text-align: right;
  margin-right: 10px;
}
.pay-success-loading .pay-success-loading-body .pay-cloud-row.include-item ul {
  margin: 0;
  padding: 0;
}
.pay-success-loading .pay-success-loading-body .pay-cloud-row.include-item ul li {
  line-height: 28px;
}
.pay-success-loading .pay-success-loading-body .pay-success-main .pay-success-title img {
  margin-right: 5px;
}
.pay-success-loading .pay-success-loading-body .pay-success-main .pay-cloud-row {
  margin-top: 10px;
}
.pay-success-loading .pay-success-loading-body .pay-success-main .to-product {
  width: 200px;
  height: 48px;
  background: #007ffd;
  border: 0;
  color: #fff;
  border-radius: 5px;
  margin: 50px auto;
  display: flex;
  justify-content: center;
  align-items: center;
}
.pay-success-loading .pay-success-loading-body .pay-success-main .to-product img {
  margin-right: 8px;
}
.pay-success-loading .pay-success-loading-body .pay-success-main .but-box {
  display: flex;
  justify-content: center;
  margin: 50px 0;
}
.pay-success-loading .pay-success-loading-body .pay-success-main .but-box button {
  background: #1177e3;
  border: 0;
  padding: 5px 0;
  margin-left: 10px;
  color: #fff;
  font-size: 16px;
  min-width: 140px;
  border: 1px solid #6591c7;
  border-radius: 3px;
}
.pay-success-loading .pay-success-loading-body .pay-success-main .but-box .no-active-but {
  background-color: #daeafe;
  color: #000000;
}
.pay-success-loading.pricate .pay-success-loading-body .pay-success-main .pay-success-title {
  margin-bottom: 20px;
}

.pay-success-loading .pay-success-loading-body .pay-success-main .pay-success-reminder {
  /* color: #00b259; */
  font-size: 16px;
  font-weight: 900;
  margin-bottom: 30px;
  text-align: center;
}
