/* ---------------顶部top 开始--------------- */
.wrapper-top {
    width: 100%;
    height: 14.975rem;
    background: url("../images/bg_top.png") no-repeat;
    background-size: 100% 100%;
}
/* ---------------顶部top 结束--------------- */

/* ---------------主体内容content 开始--------------- */
.wrapper-content {
    box-sizing: border-box;
    width: 100%;
    height: auto;
    /*min-height: 12.75rem;*/
    padding: .35rem .9rem;
    margin: -0.05rem 0;
    background-color: rgb(255, 241, 240);
    line-height: 1.1;
}

.wrapper-content .broadband-container {
    position: relative;
    box-sizing: border-box;
    height: 100%;
    margin: 0 .6rem .5rem;
    color: #4f628c;
    font-size: .65rem;
}
/* 宽带账号信息 */
.wrapper-content .broadband_info {
    padding-top: .5rem;
}
.wrapper-content .broadband_info .account-info {
    display: flex;
    align-items: center;
    padding-bottom: .4rem;
    border-bottom: 1px dashed #D3D3D3;
    color: #a43015;
    font-size: .85rem;
}
.wrapper-content .broadband_info .account-info .account-icon {
    flex-shrink: 0;
    width: .9rem;
    height: .675rem;
    background: url(../images/icon_account.png) no-repeat;
    background-size: 100% 100%;
}
.wrapper-content .broadband_info .account-info .account {
    margin-left: .25rem;
}
/* 宽带安装地址 */
.wrapper-content .broadband_info .address {
    display: flex;
    margin-top: .5rem;
    color: #666;
    font-size: .7rem;
    word-break: break-all;
}
.wrapper-content .broadband_info .address .info-name {
    flex-shrink: 0;
}

.wrapper-content .check_container {
    text-align: center;
}
.wrapper-content .check_container .disabled_container {
    margin-top: 1.4rem;
}
.wrapper-content .check_container .disabled_container img {
    width: 5.025rem;
}
.wrapper-content .check_container .disabled_container .disabled_msg {
    margin-top: 1rem;
    color: #999;
    font-size: .65rem;
    line-height: 1.4;
}

/* 切换账号 */
.wrapper-content .toggle_btn{
    position: absolute;
    z-index: 10;
    top: .4rem;
    right: 0;
    width: 3.35rem;
    height: 1rem;
    line-height: 1rem;
    border: 1px solid #a43015;
    border-radius: .55rem;
    background-color: transparent;
    color: #a43015;;
    font-size: .6rem;
    text-align: center;
}

/* 无宽带账号 */
.wrapper-content .no_broadband_btn{
    width: 10.2rem;
    height: 2.2rem;
    line-height: 2.2rem;
    text-align: center;
    border-radius: 1.1rem;
    margin: 1.4rem auto 0;
    background-color: #a43015;
    -webkit-box-shadow: 0 0 0.35rem rgb(213, 201, 199);
    box-shadow: 0 0 0.35rem rgb(213, 201, 199);
    color: #fff;
    font-size: .8rem;
}

/* 正常套餐样式 */
.wrapper-content .package_info {
    position: relative;
    margin-top: .9rem;
    text-align: center;
}
.wrapper-content .package_info img{
    display: block;
    width: 15.75rem;
}
.wrapper-content .package_info .btn {
    position: absolute;
    bottom: .9rem;
    left: 50%;
    transform: translateX(-50%);
    -ms-transform: translateX(-50%);
    -moz-transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -o-transform: translateX(-50%);
    width: 8.75rem;
    height: 1.45rem;
    line-height: 1.45rem;
    border-radius: .75rem;
    background-color: #a43015;
    box-shadow: 0 0 0.35rem rgb(213, 201, 199);
    -webkit-box-shadow: 0 0 0.35rem rgb(213, 201, 199);
    color: #fff;
    font-size: .8rem;
    text-align: center;
}
.wrapper-content .vip .btn.disabled{
    opacity: .4;
}

.wrapper-box {
    width: 98%;
    background-color: white;
    height: auto;
    margin: 0 auto;
    border-radius: .4rem;
    box-shadow: 0 2px 12px 0 rgb(0 0 0 / 10%);
    display: flex;
    justify-content: flex-start;
    align-items: center;
    flex-direction: column;
    padding-bottom: .4rem;
}
.wrapper-box-account {
    width: 90%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    margin-top: .4rem;
    padding-bottom: .4rem;
    border-bottom:1px dashed rgb(211, 211, 211);
}
.wrapper-box-account > span {
    border: 1px solid #ed6f47;
    color: #ed6f47;
    font-size: .4rem;
    padding: .2rem .6rem;
    border-radius: .2rem;
}
.wrapper-activity1 {
    width: 96%;
    height: auto;
    background-image: url('../images/activity1.png');
    background-repeat: no-repeat;
    background-size: 100% 100%;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    align-items: center;
    padding-bottom: 1rem;
}
.wrapper-activity1 > p {
    font-weight: bold;
    font-size: .8rem;
    margin-top: 2rem;
}
.wrapper-activity1-content {
    color: #a43015;
    font-size: .5rem;
    width: 94%;
    display: flex;
    margin-top: .4rem;
}
.wrapper-activity1-content > div {
    border: 1px solid rgb(164, 48, 21);
    background-color: rgba(255, 255, 255, 0.412);
    border-radius: 1rem;
    color: rgb(164, 48, 21);
    padding: .2rem .4rem;
    margin-left: .2rem;
    /* font-size: .1rem; */
    display: flex;
    justify-content: center;
    align-items: center;
}
.wrapper-activity1-but {
    color: white;
    background-color: rgb(216, 67, 25);
    box-shadow: 0.209px 5.996px 17.1px 0.9px rgba(179, 149, 88, 0.42);
    text-align: center;
    padding: .2rem 2rem;
    border-radius: 2rem;
    margin-top: .8rem;
    font-size: .8rem;
}
.wrapper-activity1-but-disabled {
    background-color: rgb(191, 191, 191);
    box-shadow: 0.209px 5.996px 17.1px 0.9px rgba(179, 149, 88, 0.42);
    text-align: center;
    padding: .2rem 2rem;
    border-radius: 2rem;
    margin-top: .8rem;
    font-size: .8rem;
    color: white;

}
.wrapper-tips {
    color: #ff001f;
    font-size: .5rem !important;
}
.wrapper-activity2 {
    margin-top: .6rem;
    background-image: url('../images/activity2.png');

}
/* ---------------主体内容content 结束--------------- */


/* 活动规则 开始*/
.rule {
    min-height: 15rem;
    padding: 1.1rem .7rem;
    color: #666666;
    font-size: .6rem;
    text-align: justify;
    background-color: rgb(255, 241, 240);
}
.rule-title {
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 12px;
    font-size: .65rem;
}
.rule-title .title {
    margin: 0 .5rem;
}
.rule-title .lt-line, .rule-title .rt-line {
    width: 6.25rem;
    height: .05rem;
    background-image: linear-gradient(to left, rgba(255,255,255,.7) 0%, rgba(255,255,255,0) 95%);
}
.rule-title .rt-line {
    background-image: linear-gradient(to right, rgba(255,255,255,.7) 0%, rgba(255,255,255,0) 95%);
}
.ruleContent{
    margin: 0 0.65rem;
}
.ruleContent p{
    font-size: .6rem;
    word-break: break-all;
}
/* 活动规则 结束*/

/* ---------------底部footer 开始 --------------- */
.wrapper-footer {
    margin-top: -0.05rem;
    background-color: rgb(255, 241, 240);

}
.wrapper-footer p {
    text-align: center;
    font-size: .6rem;
    padding-bottom: .4rem;
    color: #333333;
    font-weight: bold;
}
/* ---------------底部footer 结束--------------- */

.popup_window_bg {
    width: 100%;
    height: 100%;
    position: fixed;
    top: 0;
    left: 0;
    background-color: rgba(0, 0, 0, 0.4);
    display: flex;
    align-items: center;
    justify-content: center;
    z-index: 100;
}
.popup_window {
    box-sizing: border-box;
    width: 16.65rem;
    overflow: hidden;
}
.popup_title {
    height: .9rem;
    line-height: .9rem;
    padding-top: .9rem;
    padding-bottom: 1.5rem;
    background: url(../images/bg_popup_top.png) no-repeat center top;
    background-size: 100% 100%;
    color: #fff;
    font-size: .8rem;
    text-align: center;
}
.popup_content {
    padding: .4rem 1.75rem;
    font-size: 0.65rem;
    line-height: 0.9rem;
    background: url(../images/bg_popup_content.png) no-repeat center top;
    background-size: 100% 100%;
    color: #333;
    text-align: justify;
}
.popup_content .content-box {
    padding: 0 .3rem;
    text-align: justify;
}
.popup_content .details {
    margin-bottom: .5rem;
    line-height: 1.6;
    letter-spacing: .005rem;
}
.popup_window_close {
    width: 1.8rem;
    /*height: 0;*/
    position: relative;
    top: .6rem;
    right: -5.4rem;
}
.popup_window_close img {
    width: 100%;
    height: auto
}
/* 短信验证码 */
.sms-code-container {
    position: relative;
    box-sizing: border-box;
    height: 1.8rem;
    padding-left: .9rem;
    border: 1px solid #C4C4C2;
    border-radius: .9rem;
    margin-top: .8rem;
    font-size: .55rem;
}
.sms-code-container .sms-num {
    position: absolute;
    display: inline-block;
    top: -.5rem;
    left: .8rem;
    padding: 0 .1rem;
    background-color: #FFFEEB;
}
.sms-code-container .sms-box {
    display: flex;
    align-items: center;
    justify-content: space-between;
    height: 100%;
}
.sms-box > input {
    border: none;
    outline: none;
    background-color: transparent;
    font-size: .5rem;
}
.sms-box .sms-box__btn {
    flex-shrink: 0;
    box-sizing: border-box;
    min-width: 4em;
    padding: .2rem .6rem;
    border-radius: .65rem;
    margin-right: .3rem;
    background: linear-gradient(to top, #efa776, #e8935f);
    color: #fff;
    font-size: .55rem;
    white-space: nowrap;
}
.sms-box .sms-box__btn.again {
    background: transparent;
    color: #EA6F32;
}
.sms-box .sms-box__btn.getting {
    padding: 0;
    background: transparent;
    color: #000;
    transform: scale(.95);
}

.btn_box{
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: .8rem;
    margin-bottom: 1.25rem
}
.btn {
    width: 5.75rem;
    height: 1.875rem;
    line-height: 1.875rem;
    border: 1px solid #EA6F32;
    border-radius: .95rem;
    background-color: transparent;
    color: #EA6F32;
    font-size: .7rem;
    text-align: center;
}
.cancel_btn {}
.sure_btn {
    background-color: #EA6F32;
    color: #fff;
}
.sure_btn.grey {
    background-color: #8b8581;
    color: #fff;
    border: 1px solid #8b8581;
}