/* 全局样式重置 */
 * {
     margin: 0;
     padding: 0;
     box-sizing: border-box;
 }

 /* 页面加载动画 */
 .domain_promotion,
 .virtual_host_promotion,
 .participation_guide,
 .activity_rules {
     opacity: 0;
     animation: fadeInUp 0.8s ease forwards;
 }

 .domain_promotion {
     animation-delay: 0.2s;
 }

 .virtual_host_promotion {
     animation-delay: 0.4s;
 }

 .participation_guide {
     animation-delay: 0.6s;
 }

 .activity_rules {
     animation-delay: 0.8s;
 }

 @keyframes fadeInUp {
     0% {
         opacity: 0;
         transform: translateY(30px);
     }

     100% {
         opacity: 1;
         transform: translateY(0);
     }
 }

 /* 脉冲动画效果 */
 @keyframes pulse {

     0%,
     100% {
         transform: scale(1);
     }

     50% {
         transform: scale(1.05);
     }
 }

 /* 闪烁动画效果 */
 @keyframes sparkle {

     0%,
     100% {
         opacity: 1;
         transform: scale(1);
     }

     50% {
         opacity: 0.7;
         transform: scale(0.98);
     }
 }

 #aliyunCaptcha-sliding-wrapper #aliyunCaptcha-sliding-body #aliyunCaptcha-sliding-left {
     background-color: #f60 !important;
 }

 #aliyunCaptcha-sliding-wrapper #aliyunCaptcha-sliding-body #aliyunCaptcha-sliding-slider {
     background-color: #F6F7F9 !important;
     color: #737383 !important
 }

 #aliyunCaptcha-sliding-wrapper #aliyunCaptcha-sliding-body #aliyunCaptcha-sliding-text-box .verified {
     color: #fff !important
 }

 /* 全屏蒙版 */
 .voucher-loading-mask {
     position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background: rgba(0, 0, 0, 0.7);
     z-index: 9999;
     display: none;
     justify-content: center;
     align-items: center;
 }

 /* 加载内容容器 */
 .voucher-loading-content {
     text-align: center;
     background: white;
     padding: 40px;
     border-radius: 12px;
     box-shadow: 0 8px 32px rgba(0, 0, 0, 0.3);
     min-width: 300px;
 }

 /* 转圈动画 */
 .voucher-spinner {
     width: 50px;
     height: 50px;
     border: 4px solid #f3f3f3;
     border-top: 4px solid #ff6b6b;
     border-radius: 50%;
     animation: voucherSpin 1s linear infinite;
     margin: 0 auto 20px;
 }

 /* 加载文字 */
 .voucher-loading-text {
     margin: 0;
     font-size: 16px;
     color: #333;
     font-weight: 500;
 }

 /* 转圈动画关键帧 */
 @keyframes voucherSpin {
     0% {
         transform: rotate(0deg);
     }

     100% {
         transform: rotate(360deg);
     }
 }

 /* 显示状态 */
 .voucher-loading-mask.shows {
     display: flex;
 }

 /* 按钮基础样式 */
 button {
     border: none;
     background-color: #4384FC;
     cursor: pointer;
     transition: all 0.3s ease;
 }

 button:hover {
     filter: brightness(1.1);
 }

 button:active {
     transform: translateY(0);
 }

 /* 规则弹窗样式 */
 .guize>div,
 .guize1>div,
 .guize2>div {
     width: 790px;
     max-width: 790px !important;
 }

 .guize>div p {
     margin-top: 8px;
     line-height: 20px;

 }

 .tanchang {
     position: fixed;
     width: 100%;
     height: 100%;
     background: rgba(0, 0, 0, 0.5);
     z-index: 10000;
 }


 .tanchang>div {
     max-width: 520px;
     border-radius: 8px;
     background: #fff;
     margin: 120px auto;
 }

 .login>div {
     width: 410px;
 }

 .form-control {
     display: block;
     width: 100%;
     height: 34px;
     padding: 6px 12px;
     font-size: 14px;
     line-height: 1.42857143;
     color: #555;
     background-color: #fff;
     background-image: none;
     border: 1px solid #ccc;
     border-radius: 4px;
     -webkit-box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
     box-shadow: inset 0 1px 1px rgba(0, 0, 0, 0.075);
     -webkit-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
     -o-transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
     transition: border-color ease-in-out .15s, box-shadow ease-in-out .15s;
 }

 .listinput {
     margin: 20px 0;
 }

 .loginbtns>input {
     display: inline-block;
     width: 100%;
     height: 40px;
     line-height: 40px;
     font-size: 16px;
     color: #fff;
     text-align: center;
     vertical-align: middle;
     text-decoration: none;
     outline: none;
     background: #f60;
     border: none;
 }



 /* 顶部横幅样式 */
 .top-banner h1 {
     background: url('../images/benefits.png') center center;
     height: 300px;
     margin: 0;
     background-size: 100% 100%;
     text-indent: -9999px;
 }

 /* 内容容器宽度限制 */
 .m1200 {
     width: 1200px;
     margin: auto;
 }

 .m1060 {
     width: 1060px;
     margin: 0 auto;
 }

 /* 主标题样式 */
 .headline {
     font-size: 32px;
     margin-bottom: 14px;
     text-align: center;
 }

 /* 副标题样式 */
 .subheading {
     font-size: 16px;
     color: #666;
     margin-bottom: 14px;
     text-align: center;
     font-family: "HONOR Sans CN";
 }

 /* 右侧内容容器 */
 .rightbox {
     flex: 1;
 }

 /* 提示框样式 */
 .tixing {
     background: url('<?= STNET ?>/special/doubleEleven/images/bg.png') center center;
     color: #fff;
     width: 176px;
     height: 32px;
     line-height: 32px;
     padding-left: 20px;
     margin-top: 22px;
 }

 /* 新人福利模块样式 */
 .newcomer_benefits {
     padding: 60px 0;
     background-color: #F9FAFC;
 }

 /* 福利卡片容器 */
 .benefit-cards {
     display: flex;
     justify-content: space-between;
     margin-top: 36px;
 }

 /* 单个福利卡片样式 */
 .benefit-card {
     width: 390px;
     height: 180px;
     padding: 20px;
     border: 1px solid #EEEEEE;
     background: #fff;
     position: relative;
 }

 /* 福利卡片图标样式 */
 .benefit-card img {
     position: absolute;
     top: -30px;
     right: 26px;
 }

 /* 福利卡片标题样式 */
 .benefit-title {
     font-size: 20px;
     color: #f60;
     border-bottom: 1px solid #EEEEEE;
     padding-bottom: 30px;
 }

 /* 福利卡片描述样式 */
 .benefit-description {
     color: #888;
     margin-top: 30px;
 }

 /* 域名促销模块样式 */
 .domain_promotion {
     padding-top: 83px;
     padding-bottom: 67px;
     background-color: #fff;
 }

 /* 促销内容容器 */
 .promotion_content {
     display: flex;
     justify-content: space-between;
     margin-top: 36px;
 }

 /* 域名卡片样式 */
 .domain-card {
     padding: 24px;
     box-shadow: 0px 2px 10px 0px rgba(12, 18, 86, 0.06);
     width: 588px;
     transition: all 0.3s ease;
     cursor: pointer;
 }

 .domain-card:hover {
     box-shadow: 0px 8px 25px 0px rgba(12, 18, 86, 0.15);


 }

 /* 域名卡片头部样式 */
 .domain-header {
     display: flex;
     align-items: center;
 }

 /* 域名名称样式 */
 .domain-name {
     font-size: 16px;
     color: #555;
     font-family: "Microsoft YaHei";
     font-weight: 400;
 }

 /* 热门标签样式 */
 .hot-tag {
     background-color: #FF3535;
     color: #fff;
     padding: 3px 12px;
     font-size: 12px;
     margin-left: 10px;
     border-radius: 3px;
     animation: pulse 2s ease-in-out infinite;
     box-shadow: 0 2px 4px rgba(255, 53, 53, 0.3);
 }

 /* 域名描述样式 */
 .domain-description {
     margin-top: 12px;
     font-size: 12px;
     color: #888;
     line-height: 24px;
 }

 /* 域名查询输入框样式 */
 .domain-input {
     display: flex;
     border: solid 1px #EEE;
     margin-top: 20px;
     margin-bottom: 5px;
     overflow: hidden;
     position: relative;
 }

 .domain-input input {
     flex: 1;
     border: none;
     background: transparent;
     padding: 10px 50px 10px 12px;
     font-size: 12px;
     outline: none;
     color: #333;
     min-width: 120px;
     transition: all 0.3s ease;
 }

 .domain-input:hover {
     border-color: #FF6A00;
     box-shadow: 0 2px 8px rgba(255, 106, 0, 0.1);
 }

 .domain-input:focus-within {
     border-color: #FF6A00;
     box-shadow: 0 0 0 3px rgba(255, 106, 0, 0.1);
 }

 .domain-input input::placeholder {
     color: #D9D9D9;
 }

 .domain-input .suffix {
     position: absolute;
     right: 80px;
     top: 50%;
     transform: translateY(-50%);
     background: transparent;
     color: #333;
     padding: 0;
     font-weight: normal;
     font-size: 12px;
     white-space: nowrap;
     display: flex;
     align-items: center;
     pointer-events: none;
 }

 .domain-input .query-btn {
     background: linear-gradient(0deg, #FF6A00 0%, #FF6A00 100%), linear-gradient(90deg, #FF6F3E 0%, #FF974B 100%), linear-gradient(90deg, #3DAEFF 0%, #4B99FF 100%), linear-gradient(90deg, #FF3C45 0%, #FF5D36 97.85%), linear-gradient(94deg, #FFA012 -18.34%, #FF6A00 87.54%), #D9D9D9;
     color: #ffffff;
     border: none;
     padding: 10px 20px;
     font-weight: bold;
     cursor: pointer;
     transition: all 0.3s ease;
     font-size: 14px;
     white-space: nowrap;
     min-width: 60px;
     flex-shrink: 0;
     float: right;
     margin-right: 0px !important;
 }

 .domain-input .query-btn:hover {
     background: linear-gradient(94deg, #FF8A32 -18.34%, #FF8A20 87.54%);
     transform: scale(1.05);
     box-shadow: 0 4px 12px rgba(255, 106, 0, 0.3);
 }

 .doma-inok {
     font-size: 12px;
     color: rgb(111, 207, 62);
     margin-bottom: 5px;
     opacity: 0;
 }

 .doma-inok.no {
     color: red;
 }

 /* 价格区域样式 */
 .domain-price {
     margin-top: 20px;
 }

 /* 当前价格样式 */
 .current-price {
     font-size: 28px;
     color: #f60;
 }

 /* 原价样式 */
 .original-price {
     font-size: 12px;
     color: #888;
     margin-left: 10px;
 }

 /* 注册按钮样式 */
 .register-btn {
     width: 100%;
     height: 42px;
     background: linear-gradient(120deg, #FFA012, #FF6A00);
     color: #fff;
     font-size: 16px;
     margin-top: 12px;
     border-radius: 4px;
     cursor: pointer;
     transition: all 0.3s ease;
     position: relative;
     overflow: hidden;
 }

 .register-btn:hover {
     background: linear-gradient(120deg, #FFB532, #FF8A20);
     box-shadow: 0 6px 20px rgba(255, 106, 0, 0.4);
 }

 .register-btn:hover::before {
     content: '';
     position: absolute;
     top: 0;
     left: -100%;
     width: 100%;
     height: 100%;
     background: linear-gradient(90deg, transparent, rgba(255, 255, 255, 0.3), transparent);
     animation: shine 0.6s ease-in-out;
 }

 @keyframes shine {
     0% {
         left: -100%;
     }

     100% {
         left: 100%;
     }
 }

 /* 按钮标题样式 */
 .btn_title {
     text-align: center;
     margin-top: 70px;
     color: #888;
 }

 .activity_rules {
     padding: 60px 0;
     background: #F9FAFC;
 }

 /* 规则内容容器样式 */
 .container_gz {
     padding: 38px 28px 20px;
     text-align: left;
     margin-top: 36px;
     background: #FFF;
     box-shadow: 0px 2px 10px 0px rgba(12, 18, 86, 0.06);
 }

 /* 规则内容区域样式 */
 .gzcontentbox {
     padding: 50px 0 30px;
 }

 .rule_item {
     margin-bottom: 30px;
 }

 .rule_header {
     display: flex;
     align-items: center;
 }

 .rule_number {
     padding: 2px 7px;
     background: #FF6A00;
     color: #fff;
 }

 .rule_title {
     margin-left: 16px;
     color: #333333;
     font-family: "HONOR Sans CN";
     font-weight: 700;
 }

 .rule_content {
     padding-left: 40px;
 }

 .rule_content p {
     color: #666;
     font-size: 14px;
     margin-top: 10px;
     line-height: 24px;
     font-family: "HONOR Sans CN";
 }

 /* 按钮容器样式 */
 .btnbox {
     display: flex;
     margin-bottom: 80px;
     align-items: center;
 }

 /* 按钮容器内元素间距 */
 .btnbox>div {
     margin-left: 20px;
 }


 .virtual_host_promotion {
     padding: 68px 0;
     background-color: #F9FAFC;
 }

 .promotion_highlight {
     color: #f60;
     font-size: 20px;
     text-align: center;
     font-weight: 700;
 }

 .virtual_content {
     display: flex;
     flex-wrap: wrap;
     justify-content: space-between;
     margin-top: 36px;
 }

 .coupon-card {
     width: 284px;
     padding: 10px 14px;
     margin-bottom: 20px;
     border-radius: 4px;
     border: solid 2px#FFF;
     background: linear-gradient(180deg, #FFF 0%, #FFF 100%);
     box-shadow: 0px 2px 12px 0px rgba(11, 44, 95, 0.06);
     transition: all 0.3s ease;
     cursor: pointer;
 }

 .coupon-card:hover {
     box-shadow: 0px 8px 25px 0px rgba(11, 44, 95, 0.15);

 }

 .coupon-card:hover .coupon-badge {
     transform: translateY(-6px) scale(1.02);
 }

 .coupon-title {
     font-size: 18px;
     color: #555555;
     font-weight: 700;
 }

 .coupon-description {
     margin-top: 8px;
     line-height: 24px;
 }

 .coupon-highlight {
     color: #f60;
     font-size: 14px;
     line-height: 1;
 }

 .coupon-condition {
     color: #666;
     font-size: 14px;
 }

 .coupon-badge {
     padding: 14px 12px;
     margin-top: 6px;
     background-size: 100%;
     transition: all 0.3s ease;
 }



 .bg-1 {
     background-image: url('../images/newcomer_bg1.png');
 }

 .bg-2 {
     background-image: url('../images/newcomer_bg2.png');
 }

 .bg-3 {
     background-image: url('../images/newcomer_bg3.png');
 }

 .coupon-amount {
     color: #fff;
     margin-top: 8px;
 }

 .coupon-button {
     height: 32px;
     width: 100%;
     margin-top: 10px;
     transition: all 0.3s ease;
     position: relative;
     overflow: hidden;
 }

 .coupon-button:hover {
     box-shadow: 0 4px 12px rgba(0, 0, 0, 0.2);
 }



 .coupon-note {
     font-size: 12px;
     color: #888;
     margin-top: 8px;
     text-align: center;
 }

 .badge-label {
     font-size: 12px;
     padding: 3px 10px;
     border: 1px solid transparent;
 }

 .label-orange {
     color: #FF7B42;
     background: #fff;
     border-color: #fff;
 }

 .label-white {
     color: #fff;
     border-color: #fff;
 }

 .label-beige {
     color: #BB7048;
     background: #FFE9C3;
     border-color: #FFE9C3;
 }

 .btn-orange {
     background: #fff;
     color: #FF7B42;
 }
 .btn-orange.show{
    background: rgba(255, 255, 255, 0.7);
 }

 .btn-blue {
     background: #fff;
     color: #1C7CD3;
 }
 .btn-blue.show{
    background: rgba(255, 255, 255, 0.7);
    color: #1C7CD3;
}

 .btn-beige {
     background: #FFE9C3;
     color: #BB7048;
 }
 .btn-beige.show {
    background: rgba(255,233,195,0.7);
    color: #BB7048;
}

 .combo_promotion_section {
     padding: 60px 0;
     background-color: #fff;
 }

 .combo_package_container {
     margin-top: 36px;

 }

 .combo_package_card {
     box-shadow: 0 4px 10px rgba(0, 0, 0, 0.2);
     margin-bottom: 20px;
     transition: all 0.3s ease;
     cursor: pointer;
     border-radius: 8px;
     overflow: hidden;
 }

 .combo_package_card:hover {
     transform: translateY(-8px);
     box-shadow: 0 12px 30px rgba(0, 0, 0, 0.15);
     border: 2px solid #FF6A00;
 }

 .combo-header {
     padding: 20px;
     background: url("<?= STNET ?>/special/doubleEleven/images/newcomer_bg4.png");

 }

 .combo-content {
     padding: 10px 0;
     display: flex;
 }

 .combo-section {
     flex: 1;
     padding: 12px;
     border-right: 1px solid #E9ECF1;
 }

 .section-title {
     font-size: 16px;
     color: #333;
     margin-bottom: 12px;
 }

 .section-subtitle {
     font-size: 12px;
     color: #666;
     margin-top: 6px;
 }

 .domain-search {
     margin: 10px 0 16px;
     display: flex;
 }

 .search-input {
     padding: 8px;
     width: 226px;
     border: 1px solid #E9ECF1;
 }

 .search-btn {
     background: linear-gradient(120deg, #FFA012, #FF6A00);
     color: #fff;
     width: 50px;
 }

 .section-text {
     font-size: 14px;
     color: #333;
     margin-top: 5px;
 }

 .combo-pricing {
     width: 290px;
     padding: 12px;
 }

 .badge-container {
     margin-bottom: 20px;
 }

 .badge {
     padding: 3px 12px;
     background: #FAFAFA;
     color: #666;
     font-size: 12px;
 }

 .badge+.badge {
     margin-left: 8px;
 }

 .price-container {
     margin-top: 20px;
 }

 .price-row {
     display: flex;
     justify-content: space-between;
     align-items: center;
 }

 .current-price {
     font-size: 28px;
     color: #f60;
     font-weight: 600;
 }

 .daily-cost {
     color: #666;
     font-size: 12px;
 }

 .original-price {
     font-size: 12px;
     color: #888;
 }

 .daily-amount {
     color: #FF6A00;
     font-size: 12px;
 }

 .buy-btn {
     height: 32px;
     font-size: 12px;
     background: linear-gradient(120deg, #FFA012, #FF6A00);
     color: #fff;
     width: 100%;
     margin-top: 18px;
     border: none;
     cursor: pointer;
     transition: all 0.3s ease;
     position: relative;
     overflow: hidden;
 }

 .buy-btn:hover {
     background: linear-gradient(120deg, #FFB532, #FF8A20);
     transform: translateY(-2px);
     box-shadow: 0 4px 15px rgba(255, 106, 0, 0.4);
 }

 .buy-btn:active {
     transform: translateY(0);
 }

 .select {
     padding: 8px;
     width: 100%;
     border: 1px solid #E9ECF1;
     /* 添加下拉框样式 */
     appearance: none;
     -webkit-appearance: none;
     -moz-appearance: none;
     background: url('data:image/svg+xml;utf8,<svg xmlns="http://www.w3.org/2000/svg" width="14" height="14" viewBox="0 0 24 24"><path d="M7 10l5 5 5-5z" fill="%23333"/></svg>') no-repeat right 8px center;
     background-color: #fff;
     cursor: pointer;
 }

 .tooltip {
     border: 1px solid #999999;
     color: #999999;
     font-size: 12px;
     margin-left: 10px;
     border-radius: 50%;
     padding: 1px 4px;
     cursor: pointer;
 }

 .participation_guide {
     padding: 83px 0;
     background-color: #FFFFFF;
 }

 .steps_container {
     margin-top: 66px;
     display: flex;
     justify-content: space-between;
 }

 .step_item {
     text-align: center;
     width: 210px;
     transition: all 0.3s ease;
     cursor: pointer;
 }

 .step_item:hover {
     transform: translateY(-5px);
 }

 .step_item:hover .step_number {
     background: #FF6A00;
     color: #fff;
     border-color: #FF6A00;
     transform: scale(1.1);
 }

 .step_number {
     font-size: 16px;
     display: inline-block;
     width: 47px;
     height: 47px;
     border: 1px solid #333;
     color: #333;
     padding: 12px 17px;
     border-radius: 50%;
     position: relative;
     z-index: 1;
     transition: all 0.3s ease;
 }

 .step_number::after {
     content: "";
     position: absolute;
     top: 50%;
     left: 160px;
     height: 1px;
     width: 160px;
     background: repeating-linear-gradient(to right,
             #999999,
             #999999 5px,
             transparent 5px,
             transparent 10px);
     transform: translateY(-50%);
 }

 .step_item:last-child .step_number::after {
     display: none;
 }

 .step_content {
     margin-top: 30px;
 }

 .step_title {
     font-size: 16px;
 }

 .step_description {
     font-size: 14px;
     color: #666;
     margin-top: 10px;
 }

 .step_action {
     font-size: 12px;
     margin-top: 10px;
 }

 .step_action a {
     color: #FF6A01;
 }

 .side-nav {
     position: fixed;
     right: 70px;
     top: 20%;
     transform: translateY(-50%);
     background: rgba(255, 255, 255, 0.9);
     padding: 20px;
     border-radius: 8px;
     box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
     z-index: 1000;
     display: none;
 }

 .nav-list {
     list-style: none;
     margin: 0;
     padding: 0;
 }

 .nav-item {
     margin: 8px 0;
 }

 .nav-item a {
     color: #333;
     text-decoration: none;
     font-size: 14px;
     transition: color 0.3s;
 }

 .nav-item a:hover {
     color: #FF6A00;
 }

 .back-to-top {
     color: #FF6A00;
     font-weight: bold;
 }


 .nav-item.active a {
     color: #FF6A00;
 }

 .promotion {
     cursor: pointer;
     transition: all 0.3s ease;
     position: relative;
 }

 .promotion:hover {
     color: #FF8A20;
     transform: scale(1.05);
 }

 .promotion:hover::after {
     content: '';
     position: absolute;
     bottom: -2px;
     left: 0;
     width: 100%;
     height: 2px;
     background: linear-gradient(90deg, #FF6A00, #FFA012);
     animation: slideIn 0.3s ease;
 }

 @keyframes slideIn {
     0% {
         width: 0;
     }

     100% {
         width: 100%;
     }
 }

 .tab-header {
     display: flex;
     text-align: center;
     background: #F8F8F8;
     margin-top: 20px
 }

 .tab-header .active {
     background-color: #fff;
 }

 .tab-item {
     flex: 1;
     padding: 10px;
     cursor: pointer;
     transition: all 0.3s ease;
     position: relative;
     border-bottom: 3px solid transparent;
 }

 .tab-item:hover {
     background: linear-gradient(135deg, #FFF5E6, #FFF);
     color: #FF6A00;
     border-bottom-color: #FF6A00;
 }

 .tab-item.active:hover {
     background: #fff;
 }

 .tab-content .tab-pane {
     display: none;
 }

 .tab-content .active {
     display: block;
 }

 .brand-upgrade-package div {
     max-width: 800px;
 }

 .startup-basic-package div {
     max-width: 800px;
 }

 .tab-content table {
     width: 100%;
     border-collapse: collapse;
     margin-top: 10px;
 }

 .tab-content table tr {
     border-bottom: 1px solid #E9ECF1;
 }

 .tab-content table td {
     padding: 8px 16px;
 }



 del {
     color: #999;
     font-size: 12px;
 }

 .cnbox {
     position: absolute;
     left: 195px;
     top: 6px;
 }

 /* 自定义弹窗样式 */
 .custom-alert-mask {
     position: fixed;
     top: 0;
     left: 0;
     width: 100%;
     height: 100%;
     background: rgba(0, 0, 0, 0.5);
     z-index: 99999;
     display: none;
     justify-content: center;
     align-items: center;
 }

 .custom-alert-mask.shows {
     display: flex;
 }

 .custom-alert-content {
     background: white;
     border-radius: 8px;
     min-width: 300px;
     max-width: 500px;
     margin: 20px;
     box-shadow: 0 10px 40px rgba(0, 0, 0, 0.3);
     animation: alertSlideIn 0.3s ease-out;
 }

 @keyframes alertSlideIn {
     0% {
         transform: translateY(-50px) scale(0.9);
         opacity: 0;
     }

     100% {
         transform: translateY(0) scale(1);
         opacity: 1;
     }
 }

 .custom-alert-header {
     padding: 20px 20px 10px 20px;
     border-bottom: 1px solid #eee;
 }

 .custom-alert-title {
     margin: 0;
     font-size: 18px;
     color: #333;
     text-align: center;
 }

 .custom-alert-body {
     padding: 20px;
     text-align: center;
 }

 .custom-alert-body p {
     margin: 0;
     font-size: 16px;
     color: #666;
     line-height: 1.5;
 }

 .custom-alert-footer {
     padding: 10px 20px 20px 20px;
     text-align: center;
 }

 .custom-alert-btn {
     background: #f60;
     color: white;
     border: none;
     padding: 12px 30px;
     border-radius: 6px;
     font-size: 16px;
     cursor: pointer;
     transition: all 0.3s ease;
     min-width: 100px;
 }

 .custom-alert-btn:hover {
     background: #ff8020;
     transform: translateY(-2px);
     box-shadow: 0 4px 12px rgba(255, 102, 0, 0.3);
 }

 .custom-alert-btn:active {
     transform: translateY(0);
 }



 /* 移动端响应式样式 */
 @media (max-width: 900px) {
     .top-banner h1 {
         background: url('../images/benefits_mc.png') center center;
         height: 120px;
         margin: 0;
         background-size: 100% 100%;
         text-indent: -9999px;
     }

     .cnbox {
         position: absolute;
         left: 195px;
         top: 6px;
     }

     .combo-section {
         border-right: none;
         border-bottom: 1px solid #E9ECF1;
     }

     .badge-label {
         padding: 3px 6px;
     }

     .m1200,
     .m1060 {
         width: auto;
         margin: auto;
     }

     .newcomer_benefits {
         padding: 42px 12px 30px;
     }

     .gzcontentbox {
         padding: 42px 12px 30px;
     }

     .headline {
         font-size: 22px;
         margin-bottom: 6px;
     }

     .subheading {
         font-size: 12px;
         color: #888;
         margin-bottom: 10px;
     }

     .btnbox {
         flex-direction: column;
         align-items: flex-start;
         margin-bottom: 12px;
     }

     .btnbox>div {
         margin-top: 10px;
         font-size: 12px;
     }

     .btn_title {
         font-size: 12px;
         margin-top: 40px;
         color: #888;
     }

     .container_gz {
         padding: 38px 12px 20px;
     }

     .benefit-cards {
         flex-direction: column;
     }

     .benefit-card {
         margin-bottom: 10px;
         width: 100%;
     }

     .promotion_content {
         flex-direction: column;
     }

     .domain-card {
         margin-bottom: 20px;
         width: 100%;
         height: auto;
     }

     .side-nav {
         display: none !important;
     }

     .coupon-card {
         width: 48%;
     }



     .combo-content {
         flex-direction: column;
     }

     .combo-pricing {
         width: 100%;
     }

     .steps_container {
         flex-direction: column;
         margin-top: 30px;
         padding-left: 25px;
     }

     .step_item {
         display: flex;
         width: 100%;
         margin-bottom: 40px;
     }

     .step_number {
         width: 36px;
         height: 36px;
         display: inline-block;
         padding: 8px 10px;
     }

     .step_content {
         margin-left: 25px;
         margin-top: 0;
         text-align: left;
         flex: 1;
     }

     .participation_guide {
         padding: 30px 20px;
     }

     /* .coupon-badge>div {
         overflow: hidden;
     } */

     .coupon-badge {
         height: 168px;
         background-repeat: no-repeat;
         background-size: 100% 100%;
     }

     .combo_promotion_section {
         padding: 30px 20px;
     }

     .virtual_host_promotion {
         padding: 30px 20px;
     }

     .step_number::after {
         background: repeating-linear-gradient(to bottom,
                 #999999,
                 #999999 5px,
                 transparent 5px,
                 transparent 10px);
         width: 1px;
         height: 65px;
         left: 50%;
         top: 75px;
     }

 }

 @media screen and (max-width: 750px) {
     .domain_promotion {
         padding: 30px 0;
     }

     .domain-card {
         width: 90%;
         margin-left: auto;
         margin-right: auto;
     }

     .coupon-card {
         width: 100%;
     }

    .login>div {
        position: relative;
        width: 90%;
    }
 }