/*
	本页css为云服务保障计划
*/

.container {
    background: #f2f8fc;
}

/****************banner 开始****************/
#J_planBanner {
    z-index: 20;
    height: 520px;
    overflow: hidden
}

#J_planBanner .slide-wrapper li {
    width: 100%;
    height: 520px;
    display: block
}

/****************banner 结束****************/

/****************页面模块导航 开始****************/
.mainbav {
    background: #f4fbff;
    box-shadow: 0px 2px 4px 0px rgba(3, 68, 149, 0.15);
}

.fixed-mainbav {
    position: fixed;
    top: -170px;
    left: 0;
    width: 100%;
    z-index: 1000;
}

.fixed-mainbav.active {
    top: 0;
    -moz-transition: all 0.5s ease-in-out; /* Firefox 4 */
    -webkit-transition: all 0.5s ease-in-out; /* Safari 和 Chrome */
    -o-transition: all 0.5s ease-in-out; /* Opera */
    transition: all 0.5s ease-in-out;
}

.mainbav .mainbav-list {
    /*margin: 0 20px;*/
}

.mainbav .mainbav-list li {
    padding: 0 10px;
    float: left;
    width: 16.666666666%;
    box-sizing: border-box;
    position: relative;
}

.mainbav .mainbav-list .column {
    display: block;
    padding: 15px 0;
    font-size: 16px;
    color: #767676;
    text-align: center;
}

.mainbav .mainbav-list .mb-img {
    margin: 0 auto 10px;
    width: 82px;
    height: 82px;
    background: url("/images2016/cloudhost/plan/plan-icon.png") no-repeat;
}

.mainbav .mainbav-list .column .mb-img0 {
    background-position: -460px 0;
}

.mainbav .mainbav-list .column .mb-img1 {
    background-position: 0 0;
}

.mainbav .mainbav-list .column .mb-img2 {
    background-position: -92px 0;
}

.mainbav .mainbav-list .column .mb-img3 {
    background-position: -184px 0;
}

.mainbav .mainbav-list .column .mb-img4 {
    background-position: -276px 0;
}

.mainbav .mainbav-list .column .mb-img5 {
    background-position: -368px 0;
}

/*竖线*/
.mainbav .mainbav-list li::after {
    content: "";
    width: 1px;
    height: 30px;
    background: #dcdcdc;
    position: absolute;
    top: 40px;
    right: 0;
}
.mainbav .mainbav-list li:last-child::after{
    content: "";
    display: none;
}
/*激活*/
.mainbav .mainbav-list li.active .column {
    color: #2086ee;
    border-bottom: 3px solid #2086ee;
    position: relative;
}

.mainbav .mainbav-list li.active .column::before {
    content: "";
    display: inline-block;
    width: 0;
    height: 0;
    border-top: 6px solid #2086ee;
    border-left: 6px solid transparent;
    border-right: 6px solid transparent;
    position: absolute;
    bottom: -9px;
    left: 50%;
    margin-left: -3px;
}

.mainbav .mainbav-list li.active .column .mb-img0 {
    background-position: -460px -92px;
}

.mainbav .mainbav-list li.active .column .mb-img1 {
    background-position: 0 -92px;
}

.mainbav .mainbav-list li.active .column .mb-img2 {
    background-position: -92px -92px;
}

.mainbav .mainbav-list li.active .column .mb-img3 {
    background-position: -184px -92px;
}

.mainbav .mainbav-list li.active .column .mb-img4 {
    background-position: -276px -92px;
}

.mainbav .mainbav-list li.active .column .mb-img5 {
    background-position: -368px -92px;
}

/*浮动导航样式重置*/
.fixed-mainbav .mainbav-list .mb-img{
    margin: 0 auto 4px;
}
.fixed-mainbav .mainbav-list .column{
    padding: 8px 0 4px;
}

/****************页面模块导航 结束****************/

/*通用标题*/
.plan-title {
    padding-top: 30px;
    font-size: 30px;
    color: #106dc3;
    text-align: center;
}

.plan-txt {
    padding: 10px 56px 0;
    line-height: 26px;
    font-size: 16px;
    color: #393939;
    text-align: center;
}

/****************免费金牌服务 开始****************/
.plan-jinpai {
    margin-top: 20px;
    padding-bottom: 50px;
    background: #e8f6ff;
}

/*容器*/
.plan-jinpai .pj-box {
    padding-bottom: 90px;
    margin-top: 60px;
    background: url("/images2016/cloudhost/plan/plan-img.png") no-repeat left top;
}

.plan-jinpai .pj-box .inner {
    margin-top: 50px;
    float: right;
    padding: 20px 15px;
    margin-right: 50px;
    width: 464px;
    background: #fff;
    border-top: 3px solid #246cff;
    box-sizing: border-box;

}

.plan-jinpai .pj-box .inner ol li {
    margin-left: 15px;
    line-height: 34px;
    font-size: 14px;
    color: #ff9e20;
    list-style-type: disc;
}

.plan-jinpai .pj-box .inner ol li label {
    color: #0b33b6;
}

.plan-jinpai .pj-box .inner ol li span {
    color: #ff6c24;
}

/*按钮*/
.plan-jinpai .pj-box .inner .inner-btn {
    display: inline-block;
    width: 294px;
    height: 52px;
    line-height: 52px;
    border: 1px solid #2086ee;
    border-radius: 28px;
    font-size: 16px;
    color: #00b3d3;
    text-align: center;
}

.plan-jinpai .pj-box .inner .inner-btn:hover {
    background: #2086ee;
    color: #fff;
}

/****************免费金牌服务 结束****************/

/****************7x24小时多渠道服务 开始****************/
.plan-server {
    padding-bottom: 10px;
    background: url("/images2016/cloudhost/plan/plan-bg1.jpg") no-repeat center 116px #fff;
    text-align: center;
}

.plan-server p {
    padding-top: 20px;
    font-size: 16px;
    color: #7d7d7d;
    position: relative;
}

/*菱形*/
.plan-server p::before {
    content: "";
    width: 8px;
    height: 8px;
    background: #2086ee;
    transform: rotate(-45deg);
    transform-origin: 0 100%;
    position: absolute;
    top: 30px;
    left: 34.5%;
}

/*箭头*/
.plan-server p::after {
    content: "";
    width: 22px;
    height: 18px;
    background: url('/images2016/cloudhost/plan/plan-icon.png') no-repeat -307px -182px;
    position: absolute;
    bottom: -20px;
    left: 50%;
    margin-left: -11px;
}

/*列表*/
.plan-server .ps-list {
    margin-top: 34px;
    display: inline-block;
}

.plan-server .ps-list li {
    float: left;
    width: 120px;
}

.plan-server .ps-list li a {
    display: block;
    font-size: 16px;
    color: #535353;
}

/*图标*/
.plan-server .ps-list .ps-img {
    margin: 0 auto 10px;
    width: 70px;
    height: 70px;
    background: url("/images2016/cloudhost/plan/plan-icon.png") no-repeat;
}

.plan-server .ps-list .ps-img1 {
    background-position: 0px -184px;
}

.plan-server .ps-list .ps-img2 {
    background-position: -80px -184px;
}

.plan-server .ps-list .ps-img3 {
    background-position: -160px -184px;
}

/****************7x24小时多渠道服务 结束****************/

/****************业务全程护航 开始****************/
.plan-business {
    padding-bottom: 44px;
    background: url("/images2016/cloudhost/plan/plan-bg2.jpg") no-repeat top center #fff;
}

/*列表*/
.plan-business .pb-list {
    padding: 80px 62px 0;
}

.plan-business .pb-list li {
    float: left;
    width: 50%;
    text-align: center;
}

/*小标题*/
.plan-business .pb-list li .pb-title {
    padding-top: 20px;
    font-size: 20px;
    color: #003680;
}

/*文字*/
.plan-business .pb-list li p {
    padding-top: 20px;
    line-height: 24px;
    font-size: 14px;
    color: #383838;
}

/*链接*/
.plan-business .pb-list li .pb-rule {
    font-size: 12px;
    color: #8aacce;
}

.plan-business .pb-list li .pb-rule:hover {
    color: #ce958a;
}

/*按钮*/
.plan-business .pb-list li .pb-btn {
    margin-top: 20px;
    display: inline-block;
    width: 148px;
    height: 38px;
    line-height: 38px;
    border: 1px solid #2086ee;
    border-radius: 20px;
    font-size: 14px;
    color: #2086ee;
    text-align: center;
}

/*激活*/
.plan-business .pb-list li .pb-btn:hover {
    background: #2086ee;
    color: #fff;
}

/****************业务全程护航 结束****************/

/****************全面高效的服务 开始****************/
.plan-vs {
    padding-bottom: 40px;
    text-align: center;
}

.plan-vs .table-info {
    margin-top: 40px;
    background: #fff;
    border: 1px solid #ebebeb;
    border-top: 0;
}

.plan-vs .table-info .title {
    padding: 0;
    height: 46px;
    line-height: 46px;
    background: #f8fbff;
    font-size: 24px;
    color: #454545;
    border-top: 2px solid #7aafff;
    border-bottom: 1px solid #ececec;
}

.plan-vs .table-info .title span {
    font-size: 14px;
    color: #454545;
}

.plan-vs .table-info .td-title {
    padding: 0;
    height: 64px;
    line-height: 64px;
    background: #e9f5ff;
    font-size: 16px;
    color: #3e3e3e;
    border-right: 0;
    border-bottom: 1px solid #ececec;
}

.plan-vs .table-info tr td {
    height: 42px;
    line-height: 42px;
    border-bottom: 1px solid #ececec;
    border-right: 1px solid #ececec;
}

/*划过*/
.plan-vs .table-info tr:hover {
    background: #fdfdf5;
}

/*左侧*/
.plan-vs .table-info tr .left {
    padding-left: 20px;
    width: 166px;
    background: #f9f9f9;
    font-size: 14px;
    font-weight: bold;
    color: #034f89;
    text-align: left;
}

/*第二列*/
.plan-vs .table-info tr .name {
    padding-left: 30px;
    font-size: 12px;
    color: #4e4e4e;
    text-align: left;
}

/*图标*/
.plan-vs .table-info .pv-icon {
    display: inline-block;
    width: 14px;
    height: 14px;
    background: url('/images2016/cloudhost/plan/plan-icon.png') no-repeat;
    vertical-align: middle;
}

/*对号*/
.plan-vs .table-info .pv-icon.yes {
    background-position: -339px -184px;
}

/*叉*/
.plan-vs .table-info .pv-icon.no {
    background-position: -362px -183px;
}

/****************全面高效的服务 结束****************/

/****************专家级服务团队 开始****************/
.plan-team {
    padding-bottom: 50px;
    background: url("/images2016/cloudhost/plan/plan-bg3.jpg") repeat-x top left;
    text-align: center;
}

/*样式重置*/
.plan-team .plan-title {
    color: #07dbef;
}

.plan-team .plan-txt {
    color: #fff;
}

/*图片列表*/
.plan-team .pt-list {
    margin-top: 30px;
    padding: 0 75px;
}

.plan-team .pt-list li {
    float: left;
    margin-right: 30px;
    width: 184px;
    cursor: pointer;
}

.plan-team .pt-list li:last-child {
    margin-right: 0;
}

/*图片*/
.plan-team .pt-list .pt-img {
    position: relative;
    border: 2px solid #fff;
    border-image: linear-gradient(to bottom, #33c3ff 0%, #1e58ff 100%);
    border-image-slice: 1;
    border-bottom: 0;
}

.plan-team .pt-list .pt-img span {
    padding: 26px 10px 0;
    display: inline-block;
    height: 190px;
    line-height: 24px;
    background: rgba(11, 61, 203, 0.9);
    font-size: 14px;
    color: #f9ffff;
    position: absolute;
    top: 0%;
    left: 0;
    box-sizing: border-box;
    display: none;
}

.plan-team .pt-list li p {
    height: 42px;
    line-height: 42px;
    background: #c3f4ff;
    border: 2px solid #c3f4ff;
    box-shadow: 0px 1px 8px 0px rgba(3, 68, 149, 0.2);
    font-size: 14px;
    color: #002a68;
}

/*激活*/
.plan-team .pt-list li:hover .pt-img span {
    display: block;
}

.plan-team .pt-list li:hover p {
    background: #e4f5ff;
}

/****************专家级服务团队 结束****************/

/****************用户评价 开始****************/
.plan-pingjia {
    padding-bottom: 40px;
    background: #fff;
}

.pingjia-top {
    margin: 30px 50px 0;
    border: 1px solid #e5e5e5;
    position: relative
}

.pingjia-top .rate {
    width: 260px;
    background: url('/images2016/cloudhost/cloudhost-icon_1.png') no-repeat center center #f3f7fd;
    background-position: 114px 60px;
    text-align: center;
    position: absolute;
    height: 100%;
    _height: 173px;
    border-right: 1px solid #e5e5e5;
    _zoom: 1
}

.pingjia-top .rate p {
    padding-top: 92px;
    height: 28px;
    overflow: hidden
}

.pingjia-top .rate .rate-icon {
    position: absolute;
    top: 58px;
    left: 256px;
    display: block;
    width: 32px;
    height: 60px;
    background: url('/images2016/cloudhost/cloudhost-icon_2.jpg') no-repeat;
    background-position: 4px -1345px
}

.pingjia-top .percent {
    padding: 6px 0 26px 290px;
    overflow: hidden;
    line-height: 1;
    font-size: 14px;
    color: #646464;
    _zoom: 1
}

.pingjia-top .percent dl {
    padding-top: 24px;
    *padding-top: 12px;
    clear: both
}

.pingjia-top .percent dt {
    float: left;
    width: 122px;
    text-align: right;
    margin-right: 10px
}

.pingjia-top .percent dd {
    margin-top: 2px;
    overflow: hidden;
    width: 430px;
    height: 8px;
    background: #ececec;
    border: 1px solid #4a9ced
}

.pingjia-top .percent dd span {
    margin-top: -10px;
    position: absolute;
    right: 190px;
}

.pingjia-top .percent .fill {
    overflow: hidden;
    height: 8px;
    _height: 10px;
    background: #4a9ced;
    position: relative
}

/*容器*/
.column-list{
    margin: 40px 50px 0;
}
.column-list li{
    float: left;
    width: 49%;
}
.column-list li:first-child{
    margin-right: 2%;
}

/*标题*/
.pingjia-title {
    padding-bottom: 4px;
    border-bottom: 1px solid #dcdcdc;
}

.pingjia-title span {
    padding-left: 8px;
    font-size: 16px;
    color: #6f6f6f;
    border-left: 3px solid #2086ee;
}

/*容器*/
.pingjia-box {
    padding-top: 20px;
    padding-bottom: 14px;
    border-bottom: 1px solid #eee;
}

/*左侧*/
.pingjia-box .pb-left {
    float: left;
    width: 100px;
    text-align: center;
}

/*图标*/
.pingjia-box .pb-left .user-icon {
    margin: 0 auto;
    width: 58px;
    height: 58px;
    background: url("/images2016/cloudhost/plan/plan-icon.png") no-repeat -240px -182px;
}

.pingjia-box .pb-left p {
    padding-top: 10px;
    font-size: 12px;
    color: #818181;
}

.pingjia-box .pb-left p span {
    color: #adadad;
}

/*右侧*/
.pingjia-box .pb-right {
    overflow: hidden;
    padding-left: 20px;
}

/*用户民*/
.pingjia-box .pb-right .user-name {
    padding-top: 10px;
    font-size: 12px;
    color: #b1b1b1;
}

/*评价文字*/
.pingjia-box .pb-right p {
    line-height: 24px;
    color: #434343;
}

/*查看更多按钮*/
.plan-pingjia .more-btn {
    display: inline-block;
    width: 232px;
    height: 50px;
    line-height: 50px;
    background: #2086ee;
    border-radius: 26px;
    font-size: 16px;
    color: #fff;
    text-align: center;
}
/*******年度热销 开始*******/
.host-list{
    margin-top: 14px;
    padding: 14px 14px 14px 20px;
    background: #effaff;
}
.host-list li{
    float: left;
    width: 48%;
    background: #fff;
    border: 1px solid #e3e3e3;
    position: relative;
}
.host-list li:first-child{
    margin-right: 4%;
    margin-left: -4px;
}
/*热卖*/
.host-list .hl-hot{
    padding-right: 8px;
    padding-top: 4px;
    position: absolute;
    right: 0;
    top: 0;
    width: 71px;
    height: 59px;
    background: url('/images2016/webhosting/triangle3.jpg') no-repeat top right;
    font-size: 14px;
    color: #fff;
    text-align: right;
}
/*主机型号*/
.host-list .hl-title{
    margin: 0 20px;
    border-bottom: 1px solid #e1e1e1;
    line-height: 60px;
    font-size: 26px;
    color: #444;
    text-align: center;
    position: relative;
}
/*价格*/
.host-list .hl-price{
    padding-top: 6px;
    font-size: 14px;
    color: #575656;
    text-align: center;
}
.host-list .hl-price .price-num{
    font-size: 24px;
    color: #ff8500;
}
.host-list .hl-price .price-line{
    margin-left: -10px;
    font-size: 24px;
    color: #a7a4a4;
}
/*原价*/
.host-list .hl-price-old{
    font-size: 12px;
    color: #ef0b0b;
    text-align: center;
}
.host-list .hl-price-old span{
    padding-left: 10px;
    text-decoration: line-through;
}
/*立即购买*/
.host-list .hl-btn{
    padding: 18px 0;
    border-bottom: 1px solid #e7e7e7;
    text-align: center;
}
.host-list .hl-btn a{
    display: inline-block;
    width: 158px;
    height: 34px;
    line-height: 34px;
    border-radius: 2px;
    border: 1px solid #ff8800;
    font-size: 14px;
    color: #ff8500;
    text-align: center;
}
.host-list .hl-btn a:hover{
    background: #ff8800;
    color: #fff;
}
/*配置*/
.host-list .hl-inner{
    float: left;
    margin: 8px 0 8px -1px;
    width: 33.333333333%;
    border-right: 1px solid #e7e7e7;
    font-size: 14px;
    color: #707070;
    text-align: center;
}
.host-list .hl-inner:last-child{
    border-right: 0;
}

/*******年度热销 结束*******/

/****************用户评价 结束****************/


/****************查看详细规则模板 开始****************/
.plan-rule{
    padding: 0 20px 20px;
}
/*标题*/
.plan-rule .pr-title{
    font-size: 18px;
    color: #535353;
    text-align: center;
}
.plan-rule .pr-title span{
    padding: 0 20px 10px;
    border-bottom: 2px solid #00a0e9;
}
/*文字*/
.plan-rule p{
    font-size: 14px;
    line-height: 30px;
    color: #535353;
}
.layui-layer-dialog .layui-layer-content{
    background: #fff;
}
/****************查看详细规则模板 结束****************/

@media screen and (max-width: 1206px) {
    /*金牌服务*/
    .plan-jinpai .pj-box .inner {
        margin-right: 10px;
        width: 390px;
    }
    /*7*24小时多渠道服务支持*/
    .plan-server p::before {
        content: "";
        width: 8px;
        height: 8px;
        background: #2086ee;
        transform: rotate(-45deg);
        transform-origin: 0 100%;
        position: absolute;
        top: 30px;
        left: 31.5%;
    }
    /*业务全程护航*/
    .plan-business .pb-list {
        padding: 80px 32px 0;
    }
    /*专家级服务团队*/
    .plan-team .pt-list {
        padding: 0;
    }
    .plan-team .pt-list li {
        margin-right: 16px;
    }
    /*评价*/
    .pingjia-top {
        margin: 30px 30px 0;
    }
    .pingjia-top .percent dd span {
        right: 30px;
    }
    .column-list{
        margin: 40px 30px 0;
    }

}

