body {
    /* background-color: #F6F7F9; */
}

.yans_banner {
    width: 100%;
    height: 470px;
    background:#6592FA url(img/yans/yans-bg.png) no-repeat center center;
    background-size: auto 100%;
}


.banner_1{
    padding-top: 53px;
    width: 366px;
    height: 69px;
}
.banner_2{
    margin-top: 17px;
    font-size: 24px;
    line-height: 36px;
    color: #FFFFFF;
}
.banner_3{
    font-size: 12px;
    color: rgba(255, 255, 255, .6);
    line-height: 11px;
    background: url(img/server/ser-banner-2.png) no-repeat left top;
    background-size: 144px 2px;
    padding-top: 7px;
    margin-top: 38px;
}
.banner_4{
    margin-top: 49px;
}
.banner_4 .p_a{
    float: left;
    margin-right: 50px;
    font-size: 12px;
    line-height: 16px;
    color: #FFFFFF;
    padding-left: 21px;
    background: url(img/ico-banner-right.png) no-repeat left center;
    background-size: 16px 16px;
}


.yans_top {
    margin-top: -160px;
}

.b_white {
    background: #fff!important
}

.yans_top .tab {
    margin-top: -70px;
    padding: 10px 0 0;
    font-size: 16px;
    color: #181C29;
    box-shadow: 0px 6px 10px rgba(232, 235, 238, 0.57);
}

.yans_top .tab ul {
    border-bottom: 1px solid #ededed;
    margin: 0 20px;
    position: relative
}

.yans_top .tab ul:last-child {
    border-bottom: 0
}

.yans_top .tab li {
    font-size: 18px;
    width: 155px;
    padding: 23px 38px 17px;
    line-height: 24px;
    position: relative;
    text-align: center;
    cursor: pointer;
    margin: 0;
}

.yans_top .tab li:after {
    content: '';
    position: absolute;
    top: 17px;
    right: 0;
    background-color: #eaeaea;
    width: 1px;
    height: 30px
}

.yans_top .tab ul li:nth-child(5n):after {
    background-color: #fff
}

.yans_top .tab .active-ul {
    border-bottom: 0
}

.yans_top .tab .active-ul li {
    padding: 19px 0 21px;
    margin: 0 38px
}

.yans_top .tab .active-ul li:after {
    right: -37px
}

.yans_top .tab .active-li {
    color: #3A62C8;
}

.yans_top .tab .active-ul .tab-line {
    height: 3px;
    width: 155px;
    position: absolute;
    left: 35px;
    bottom: -2px;
    background: #3A62C8;
    z-index: 1
}

.yans_top .tab .tab-content {
    position: relative;
    background-color: #F6F7F9;
    padding: 40px 0 25px 60px;
}
.yans_top .tab_a{
    color: #3A62C8;
    position: absolute;
    font-size: 14px;
    top: 42px;
    right: 60px;
    -webkit-transition: all ease-in-out 0.2s;
    -moz-transition: all ease-in-out 0.2s;
    -ms-transition: all ease-in-out 0.2s;
    -o-transition: all ease-in-out 0.2s;
    transition: all ease-in-out 0.2s;
}
.yans_top .tab_a:hover{
    text-decoration: underline;
}
.yans_top .tab .tab-content .t_div {
    margin-bottom: 15px;
    overflow: hidden;
}

.yans_top .tab .tab-content label {
    color: #828897;
    line-height: 28px;
    vertical-align: middle;
    float: left;
    padding-left: 24px;
}

.yans_top .tab .tab-content span {
    margin-left: 17px;
    line-height: 28px;
    float: left;
}

.price {
    margin-left: 17px;
    margin-top: -3px;
}

.price .span_a {
    font-size: 12px;
    color: #ff6521;
}

.price .num {
    font-size: 28px;
    color: #ff6521;
    font-family: DINProM;
}

.price .span_b {
    font-size: 12px;
    line-height: 16px;
    color: #ff6521;
}

.yans_top .advantage {
    margin-top: -278px;
    text-align: center
}

.yans_top .advantage h1 {
    font-weight: 400
}

.yans_top .advantage h2 {
    padding: 14px 0 10px
}

.yans_top .advantage ul {
    padding: 0 75px 0 55px;
    text-align: left
}

.yans_top .advantage li {
    padding: 14px 0 15px 43px;
    border-bottom: 1px solid #f4f4f4
}

.yans_top .advantage li:nth-child(4n) {
    border-bottom: 0
}

.yans_top .advantage span {
    margin-right: 30px;
    font-size: 16px
}

.yans_top .advantage .left {
    border-right: 1px solid #eee;
    margin-right: -1px;
    position: relative
}

.yans_top .advantage .left:after {
    content: '';
    position: absolute;
    top: 50%;
    right: -39px;
    margin-top: -8px;
    width: 74px;
    height: 74px;
    background: url(../images/tm-pk.png)
}

.yans_top .advantage .left h2 {
    border-top: 3px solid #a3b1e6;
    background-color: #f3f6ff;
    color: #6e86e6;
    border-top-left-radius: 5px
}

.yans_top .advantage .left .border {
    height: 14px;
    width: 100%;
    background: url(../img/border-icon-left.png)
}

.yans_top .advantage .left span {
    color: #6e86e6;
    font-weight: 700
}

.yans_top .advantage .right h2 {
    border-top: 3px solid #ffc07f;
    background-color: #fff3e6;
    color: #ff8019;
    margin-left: 1px;
    border-top-right-radius: 5px
}

.yans_top .advantage .right .border {
    height: 14px;
    width: 100%;
    background: url(../images/border-icon-right.png) #fff
}

.yans_top .advantage .right span {
    color: #ff8019;
    font-weight: 700
}

.yans_top .ser-process {
    text-align: center;
    margin-top: 39px
}

.yans_top .ser-process .pic-box {
    position: relative;
    background-color: #fff;
    padding: 46px 66px;
    margin-left: 70px;
    margin-right: 147px;
    border: 1px solid #dadeeb;
    box-shadow: 0 0 30px 5px #dadeeb
}

.yans_top .ser-process .pic-box:last-child {
    margin-right: 0
}

.yans_top .ser-process .pic-box:last-child:after {
    background: 0 0
}

.yans_top .ser-process .pic-box:after {
    content: '';
    position: absolute;
    top: 50%;
    margin-top: -10px;
    right: -150px;
    width: 72px;
    height: 20px;
    background: url(../images/ser-pro-arrow.png)
}

.yans_top .ser-process .pic-box img {
    margin-top: 6px;
    margin-right: 2px
}

.yans_top .question {
    padding-bottom: 40px
}

.yans_top .question h1 {
    font-weight: 400;
    font-size: 32px;
    color: #181C29;
    padding-top: 64px;
    text-align: center
}

.yans_top .question img {
    margin-top: 6px;
    margin-left: 19px
}

.yans_top .question ul {
    width: 225px;
    margin-top: 115px;
    margin-left: 23px
}

.yans_top .question ul li {
    list-style: disc;
    color: #b7bfe0;
    margin-bottom: 63px
}

.yans_top .question ul li:last-child {
    margin-bottom: 0
}

.yans_top .question a {
    color: #3d3d3d;
    font-size: 16px
}

.yans_top .question .content {
    padding-left: 47px
}

.yans_top .question h2 {
    text-align: center;
    color: #3d3d3d
}

.yans_top .question .que-btn {
    display: block;
    margin: 24px auto 0
}

.yans_top .question ul li:hover,.yans_top .question ul li:hover a {
    color: #6e86e6
}
.yans_top .tab .tab-content .ser-btn {
    margin: -50px 60px 0 0;
    cursor: pointer
}
.yans_top button {
    border: 0;
    color: #fff;
    font-size: 14px;
    width: 150px;
    height: 36px;
    line-height: 36px;
    border-radius: 4px;
    cursor: pointer;
    float: left;
}

.yans_top .con-btn {
    background-color: #FF6521;
    margin-right: 20px;
}

.yans_top .apl-btn {
    background-color: #3A62C8;;
}


.common_tit {
    text-align: center;
    padding: 50px 0 30px;
}

.common_tit .tit_a {
    font-size: 30px;
    font-weight: bold;
    line-height: 40px;
    color: #181C29;
}

.common_tit .tit_a span {
    position: relative;
}

.common_tit .tit_b {
    margin-top: 10px;
    line-height: 20px;
    color: #828897;
}

.common_tit .tit_a span:before {
    display: inline-block;
    width: 45px;
    height: 20px;
    content: "";
    position: absolute;
    left: -70px;
    top: 10px;
    background: url(img/server/same-tit-l.png) no-repeat center center;
    background-size: 45px 20px;
}

.common_tit .tit_a span:after {
    display: inline-block;
    width: 45px;
    height: 20px;
    content: "";
    position: absolute;
    right: -70px;
    top: 10px;
    background: url(img/server/same-tit-r.png) no-repeat center center;
    background-size: 45px 20px;
}
.yans_ys{
    padding-bottom: 50px;
}
.ys_list{
    position: relative;
}
.yans_ys .ys_l{
    width: 674px;
    height: 285px;
    padding: 0 60px;
    background: rgba(255, 255, 255, 0.39);
    box-shadow: 0px 0px 10px #E8EBEE;
    background: linear-gradient(180deg, #fdd4c4 0%, rgba(255, 122, 72, 0) 40%);
}
.yans_ys .ys_r{
    width: 522px;
    height: 285px;
    padding: 0 30px 0 60px;
    background: rgba(255, 255, 255, 0.39);
    box-shadow: 0px 0px 10px #E8EBEE;
    background: linear-gradient(180deg, #d0d5db 0%, rgba(119, 143, 178, 0) 40%);
}
.yans_ys .a_tit{
    position: relative;
    height: 87px;
    line-height: 87px;
    font-size: 24px;
    color: #181C29;
    padding-left: 11px;
    border-bottom: 1px dashed #BBBFC9;
}
.yans_ys .a_tit:before{
    position: absolute;
    content:"";
    left: 0;
    top: 37px;
    width: 2px;
    height: 16px;
    background-color: #ff6521;
}
.yans_ys .ys_r .a_tit:before{
    background-color: #828897;
}
.ys_list .a_list{
    margin-top: 24px;
}
.ys_l .a_list .a_item .p_a{
    width: 140px;
    box-sizing: border-box;
}
.ys_r .a_list .a_item .p_a{
    width: 160px;
    box-sizing: border-box;
}
.a_list .a_item{
    margin-top: 20px;
}
.a_list .a_item:first-child{
    margin-top: 0;
}
.a_list .a_item .p_a{
    font-size: 16px;
    font-weight: bold;
    line-height: 21px;
    color: #181C29;
    padding-left: 26px;
    background: url(img/yans/ico-yans-1.png) no-repeat left center;
    background-size: 16px 16px;
}
.ys_r .a_list .a_item .p_a{
    background: url(img/yans/ico-yans-2.png) no-repeat left center;
    background-size: 16px 16px;    
}
.a_list .a_item .p_b{
    font-size: 16px;
    line-height: 21px;
    color: #4D5260;
}
.ys_vs{
    position: absolute;
    left: 53%;
    top: 44%;
    z-index: 2;
    width: 78px;
    height: 78px;
    line-height: 78px;
    text-align: center;
    font-size: 29px;
    background:#fff;
    box-shadow: 0px 0px 15px rgba(93, 128, 155, 0.16);
    border-radius: 50%;
    color: #FF6521;
}

.yans_flow{
    width: 100%;
    height: 316px;
    background: url(img/yans/ico-yans-flow-bg.png) no-repeat center center;
    background-size: 100% 316px;
}
.yans_flow .common_tit .tit_a,
.yans_flow .common_tit .tit_b {
    color: #fff;
}
.yans_flow .common_tit .tit_a span:before {
    display: inline-block;
    width: 45px;
    height: 20px;
    content: "";
    position: absolute;
    left: -70px;
    top: 10px;
    background: url(img/server/same-tit-l0.png) no-repeat center center;
    background-size: 45px 20px;
}

.yans_flow .common_tit .tit_a span:after {
    display: inline-block;
    width: 45px;
    height: 20px;
    content: "";
    position: absolute;
    right: -70px;
    top: 10px;
    background: url(img/server/same-tit-r0.png) no-repeat center center;
    background-size: 45px 20px;
}

.flow_con {
    width: 100%;
    height: 303px;
    background: #fff;
    position: relative;
    margin-bottom: -50px;
}

.flow_con .con_h {
    font-size: 18px;
    text-align: center;
    padding: 30px 0;
    line-height: 24px;
    color: #828897;
}

.flow_con .con_m {
    padding: 0 130px;
}

.flow_con .m_item {
    position: relative;
    width: 180px;
    text-align: center;
    margin-left: 200px;
}

.flow_con .m_item:before {
    position: absolute;
    content: "";
    width: 34px;
    height: 34px;
    background: url(img/yans/ico-flow-dot.png) no-repeat center center;
    background-size: 34px 34px;
    left: -120px;
    top: 44px;
}

.flow_con .m_item:first-child {
    margin-left: 0;
}

.flow_con .m_item:first-child:before {
    content: none;
}

.flow_con .m_item .m_a {
    width: 120px;
    height: 120px;
    text-align: center;
    margin: 0 auto;
    border: 1px dashed #3A62C8;
    border-radius: 50%;
    background: url(img/yans/ico-flow-1.png) no-repeat center center;
    background-size: 60px 60px;
}

.flow_con .m_item:first-child+.m_item .m_a {
    background: url(img/yans/ico-flow-2.png) no-repeat center center;
    background-size: 60px 60px;
}

.flow_con .m_item:first-child+.m_item+.m_item .m_a {
    background: url(img/yans/ico-flow-3.png) no-repeat center center;
    background-size: 60px 60px;
}

.flow_con .m_b {
    font-size: 18px;
    line-height: 24px;
    color: #181C29;
    padding: 16px 0 10px;
}




.ser_que {
    padding-top: 140px;
    padding-bottom: 50px;
    background-color: #F6F7F9;
}


.que_list .que_item {
    width: 33.3%;
    padding: 0 30px;
}

.que_list .que_item .que_a {
    display: block;
    width: 100%;
    font-size: 18px;
    line-height: 24px;
    color: #181C29;
    cursor: pointer;
    margin-top: 30px;
    padding-left: 28px;
    background: url(img/server/ico-que-1.png) no-repeat left center;
    background-size: 18px 18px;
    -webkit-transform: translateX(0px);
    -moz-transform: translateX(0px);
    -ms-transform: translateX(0px);
    -o-transform: translateX(0px);
    transform: translateX(0px);
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.que_list .que_item .que_a:first-child {
    margin-top: 0;
}

.que_list .que_item .que_a:hover {
    color: #3A62C8;
    -webkit-transform: translateX(6px);
    -moz-transform: translateX(6px);
    -ms-transform: translateX(6px);
    -o-transform: translateX(6px);
    transform: translateX(6px);
}

.que_list .que_item:first-child+.que_item {
    border-left: 1px solid #eee;
    border-right: 1px solid #eee;
}

.que_ask {
    margin-top: 20px;
}

.que_ask .ask_same {
    position: relative;
    width: 590px;
    height: 116px;
    background: url(img/server/ico-que-bg-1.png) no-repeat center center;
    background-size: 100% 100%;
    padding: 30px 0 0 60px;
}

.que_ask .ask_same .p_a {
    font-size: 18px;
    font-weight: bold;
    line-height: 24px;
    color: #FFFFFF;
}

.que_ask .ask_same .p_b {
    font-size: 12px;
    margin-top: 13px;
    line-height: 16px;
    color: #D6D8DE;
}


.que_ask .ask_btn {
    position: absolute;
    right: 30px;
    top: 40px;
    display: block;
    width: 109px;
    height: 36px;
    line-height: 36px;
    text-align: center;
    background: #7EA2FF;
    border-radius: 4px;
    color: #fff;
    cursor: pointer;
    -webkit-transition: all 0.2s ease-in-out;
    -moz-transition: all 0.2s ease-in-out;
    -ms-transition: all 0.2s ease-in-out;
    -o-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
}

.que_ask .ask_r .ask_btn {
    background: #FF976A;
}

.que_ask .ask_btn:hover{
    background: #517ef3;
}
.que_ask .ask_r .ask_btn:hover{
    background: #e98e66;
}