/*
 * @lastedittime : 2024-05-06 14:01:52
 * @filepath     : /135new/webroot/css/editor_styles/view_contribute/index.css
 * @description  : 模板预览弹窗 > 样式文件
 */
#template-container-flag .template-code-mask {
  background-color: transparent;
  position: relative;
}
#template-container-flag #template-code-modal {
  width: 100%;
  position: relative;
  transform: none;
  left: 0;
  border-radius: 0;
}
#template-container-flag #template-code-modal .main {
  width: 100%;
}
#template-container-flag #template-code-modal .main .pay-mode {
  border-radius: 0;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_header {
  height: 50px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_header .pay-mode_header-item {
  font-size: 14px;
  padding-bottom: 6px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content {
  height: auto;
  max-height: none;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .code {
  margin: 0 0 10px 25px !important;
  width: 98px !important;
  height: 98px !important;
  min-height: 98px !important;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .codes {
  margin: 0 0 10px 0px !important;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-1 {
  border-radius: 0 !important;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-1 .tag {
  display: none;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-1 .left {
  padding: 0 !important;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-1 .left .info1 {
  font-size: 15px !important;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-1 .left .info2 {
  font-size: 12px !important;
  margin-bottom: 28px !important;
  padding: 1px 17px !important;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-1 .left .info3 {
  font-size: 14px !important;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-1 .left .info3 > del {
  display: block;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-1 .left img {
  width: 23px !important;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-1 .left > img {
  margin: 0 auto !important;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-1 .left .btn-buy a {
  font-size: 12px !important;
  width: 100px !important;
  height: 30px !important;
  line-height: 30px !important;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-1 .right {
  display: flex;
  flex-direction: column !important;
  align-items: center;
  padding: 0 !important;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-1 .right .info1 {
  font-size: 15px !important;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-1 .right .info2 {
  font-size: 12px !important;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-1 .right .info3 {
  font-size: 14px !important;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-1 .right .name {
  display: none !important;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-1 .right .price {
  font-size: 12px !important;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-1 .content {
  justify-content: flex-start !important;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-2 {
  border-radius: 0 !important;
  text-align: left !important;
  padding: 18px 16px 15px 16px !important;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-2 .name,
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-2 .author {
  display: none !important;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-2 .discount {
  position: absolute;
  width: 160px;
  height: 177px;
  top: 0;
  right: 0;
  padding: 23px 12px 0 10px;
  border-left: 1px solid #f2f2f2;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-2 .discount .info1 {
  padding: 10px 8px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-2 .info1 {
  padding: 12px;
  background: #f8f8f8;
  position: relative;
  margin-bottom: 23px !important;
  text-align: center;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-2 .info1::after {
  position: absolute;
  display: block;
  content: "";
  background-image: url(/uploads/image/bf2images/f42824f2dc5ae2100c9d1d136e9033b2.png);
  width: 24px;
  height: 16px;
  top: -15px;
  right: 43%;
  background-position: 100%;
  background-repeat: no-repeat;
  background-size: cover;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-2 .info2 {
  font-size: 12px !important;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-2 .info3 {
  margin-top: 40px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-2 .price {
  font-size: 12px !important;
  margin-bottom: 0 !important;
  margin-left: 28px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .type-2 .price span {
  font-size: 18px !important;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] {
  padding-top: 20px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .buy_wrapper .buy-container .money-info .money-info_item {
  font-size: 16px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .buy_wrapper .buy-container .money-info .money-info_item   .money-info_item {
  margin-top: 12px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .buy_wrapper .buy-container .money-info .money-info_item .money-info_item-label {
  width: 100px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .buy_wrapper .buy-container .buy-btns-wrap {
  margin-top: 30px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .buy_wrapper .buy-container .buy-btns-wrap .btn {
  width: 100px;
  height: 32px;
  font-size: 14px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .buy_wrapper .buy-container .buy-btns-wrap .btn   .btn {
  margin-left: 20px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .buy_wrapper .buy-explain {
  margin-top: 50px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .buy_wrapper .buy-explain > .discount {
  width: 100%;
  height: auto;
  display: flex;
  box-sizing: border-box;
  padding: 0 14px;
  flex-direction: column;
  align-items: center;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .buy_wrapper .buy-explain > .discount .member {
  width: auto;
  height: 100%;
  flex: 1;
  box-sizing: border-box;
  padding: 12px 6px;
  background: #f8f8f8;
  text-align: center;
  position: relative;
  margin: 0;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .buy_wrapper .buy-explain > .discount .member::after {
  position: absolute;
  display: block;
  content: "";
  background-image: url(/uploads/image/bf2images/f42824f2dc5ae2100c9d1d136e9033b2.png);
  width: 24px;
  height: 16px;
  top: -15px;
  right: 43%;
  background-position: 100%;
  background-repeat: no-repeat;
  background-size: cover;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .buy_wrapper .buy-explain > .discount .member   .member {
  margin-left: 14px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .purchase-succeeds_wrapper .purchase-succeeds_container {
  padding: 30px 0;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .purchase-succeeds_wrapper .purchase-succeeds_container .purchase-succeeds_result .result_icon {
  width: 30px;
  height: 30px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .purchase-succeeds_wrapper .purchase-succeeds_container .purchase-succeeds_btns-wrap {
  margin-top: 20px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .purchase-succeeds_wrapper .purchase-succeeds_container .purchase-succeeds_btns-wrap .btn {
  width: 100px;
  height: 36px;
  font-size: 14px;
  padding: 0;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .wallet_wrapper .wallet-container .wallet-header .btn {
  font-size: 12px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .wallet_wrapper .wallet-container .wallet-body #wallet .recharge_wrapper .recharge .recharge-container .money {
  margin-top: 20px;
  display: block;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .wallet_wrapper .wallet-container .wallet-body #wallet .recharge_wrapper .recharge .recharge-container .money .money-label {
  font-size: 14px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .wallet_wrapper .wallet-container .wallet-body #wallet .recharge_wrapper .recharge .recharge-container .money .money-content {
  box-sizing: border-box;
  padding: 0 0 0 4px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .wallet_wrapper .wallet-container .wallet-body #wallet .recharge_wrapper .recharge .recharge-container .money .money-content .money_value {
  display: inline-block;
  width: 84px;
  height: 30px;
  margin: 0 8px 8px 0;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .wallet_wrapper .wallet-container .wallet-body #wallet .recharge_wrapper .recharge .recharge-container .pay_wrapper {
  margin-top: 14px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .wallet_wrapper .wallet-container .wallet-body #wallet .recharge_wrapper .recharge .recharge-container .pay_wrapper .pay-container .pay-code {
  width: 98px;
  height: 98px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .wallet_wrapper .wallet-container .wallet-body #wallet .recharge_wrapper .recharge .recharge-container .pay_wrapper .pay-container .pay-code .code {
  width: 100% !important;
  height: 100% !important;
  margin: 0 !important;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .wallet_wrapper .wallet-container .wallet-body #wallet .recharge_wrapper .recharge .recharge-container .pay_wrapper .pay-container .pay-code .code img {
  font-size: 12px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .wallet_wrapper .wallet-container .wallet-body #wallet .recharge_wrapper .recharge .recharge-container .pay_wrapper .pay-container .pay-info {
  padding-left: 8px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .wallet_wrapper .wallet-container .wallet-body #wallet .recharge_wrapper .recharge .recharge-container .pay_wrapper .pay-container .pay-info .actual-price_wrapper {
  font-size: 12px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .wallet_wrapper .wallet-container .wallet-body #wallet .recharge_wrapper .recharge .recharge-container .pay_wrapper .pay-container .pay-info .actual-price_wrapper .actual-price .num {
  font-size: 20px;
  line-height: 16px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .wallet_wrapper .wallet-container .wallet-body #wallet .recharge_wrapper .recharge .recharge-container .pay_wrapper .pay-container .pay-info .pay-tip {
  font-size: 12px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .wallet_wrapper .wallet-container .wallet-body #wallet .recharge_wrapper .recharge .recharge-container .pay_wrapper .pay-declare {
  margin-top: 10px;
  padding: 0 10px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .wallet_wrapper .wallet-container .wallet-body #wallet .recharge_wrapper .recharge .recharge-footer {
  padding: 10px;
  height: 40px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .wallet_wrapper .wallet-container .wallet-body #wallet .recharge_wrapper .recharge .recharge-footer .btn {
  font-size: 14px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .wallet_wrapper .wallet-container .wallet-body #wallet .recharge-success_wrapper .recharge-success_container {
  padding: 30px 0;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .wallet_wrapper .wallet-container .wallet-body #wallet .recharge-success_wrapper .recharge-success_container .recharge-success_result .result_icon {
  width: 30px;
  height: 30px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .wallet_wrapper .wallet-container .wallet-body #wallet .recharge-success_wrapper .recharge-success_container .recharge-success_btns-wrap {
  margin-top: 20px;
}
#template-container-flag #template-code-modal .main .pay-mode .pay-mode_content .pay-mode_content-item[pay_mode="wallet"] .pay-mode_content-item_container > .wallet_wrapper .wallet-container .wallet-body #wallet .recharge-success_wrapper .recharge-success_container .recharge-success_btns-wrap .btn-go_buy {
  margin: 0 auto;
  width: 100px;
  height: 36px;
  font-size: 14px;
  padding: 0;
}