﻿#wrapper {
    padding: 70px 0 0 0;
    /* 存在transform属性， fixed会失效 */
    transform: unset;
    -webkit-transform: unset;
    -moz-transform: unset;
    -o-transform: unset;
    -ms-transform: unset;
}

/*滚动到下面时*/
.top-header.active .nav--transparent {
    background:#ffffff;
    border-bottom: none;
    box-shadow: 0px -5px 10px rgba(0, 0, 0, 0.5);
}
.top-header.active .nav__menu > li > a{
    color: #111111;
}
.top-header.active .nav--transparent .nav__menu > .active > a::before {
    background: #1E6AF2;
}
.top-header.active .nav--transparent .header-login .login{
    color: #111111;
}
.top-header.active .nav--transparent .login-panel .top-user-area{
    color: #111111;
}
.top-header.active .nav--transparent .login-panel img{
    filter:none;
}
.top-header.active.nav__dropdown-trigger {
    color: #111111;
}

.main-content {
    padding: 0;
}

/* 解决方案顶部 */
.solution-container {

}

.solution-container .solution-head {
    width: 100%;
    height: 500px;
    text-align: center;
    color: #ffffff;
    display: flex;
    align-items: center;
    background-size: cover;
}

.solution-head-py {
    background: url("../image/solution_py@2x.jpg") no-repeat;
}
.solution-head-index {
    background-repeat: no-repeat;
    background-position: center
}

.solution-container .solution-head .head-inner {
    margin: auto;
}

.solution-head .head-inner .solution-head-title {
    padding-bottom: 19px;
    font-size: 50px;
}

.solution-head .head-inner .solution-head-desc {
    padding-bottom: 45px;
    opacity: 0.8;
    font-size: 22px;
}

/* 立即咨询按钮 */
.btn-consult, .btn-view {
    min-width: 160px;
    height: 50px;
    line-height: 35px;
    color: #ffffff;
    background-color: #1E6AF2;
    font-size: 18px;
}

.btn-consult:hover, .btn-view:hover {
    color: #ffffff;
    background-color: #1758CC;
}

.btn-consult:focus, .btn-view:focus {
    color: #ffffff;
}

/* 空心按钮 */
.btn-price {
    min-width: 160px;
    height: 50px;
    line-height: 35px;
    color: #1E6AF2;
    border: 1px solid #1E6AF2;
    background-color: unset;
    font-size: 18px;
    margin-left: 10px;
}

.btn-price:hover,.btn-price:focus {
    color: #1E6AF2;
}

.content-footer {
    width: 100%;
}

/* 解决方案内容 */
.solution-body {

}

.solution-body .content-item {
    padding: 90px 0;
}

.solution-body .content-item .container {
    min-height: 300px;
    display: flex;
    align-items: center;
}

.solution-body .content-item .item-inner {
    margin: auto;
    width: 100%;
    text-align: center;
}

.solution-body .content-item:nth-child(odd) {
    background-color: #ffffff;
}

/* 标题 */
.content-item .content-title {
    width: 100%;
    font-size: 40px;
    font-weight: 400;
    color: rgb(51, 51, 51);
    text-align: center;
    margin-top: 30px;
    margin-bottom: 30px;
}

/* 描述 */
.content-item .content-desc {
    font-size: 20px;
    color: #444444;
    line-height: 50px;
}

.content-item .dida-list {
    text-align: left;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
    justify-content: space-between;
}

.dida-list .text-content {
    width: 400px;
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.dida-list .image-content {
    width: 497px;
}

.dida-list .image-content img {
    width: 100%;
}

/* 内容介绍 */
.content-item .content-body {
    font-size: 16px;
    font-weight: 400;
    color: #999999;
    line-height: 30px;
    margin: 40px 0;
}

/* 新数字化营销，深度垂直摄影行业 */
.dida-advantage-list {
    margin-top: 60px;
}

.dida-advantage-list .advantage-item {
    width: 350px;
    margin-bottom: 70px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.dida-advantage-list .advantage-item .icon {
    width: 84px;
    margin-right: 35px;
}

.dida-advantage-list .advantage-item .icon img {
    max-width: 84px;
    max-height: 100%;
}

.dida-advantage-list .advantage-item .right-content{
    width: calc(100% - 130px);
    height: 110px;
    font-size: 16px;
    color: #999999;
    text-align: left;
}

.dida-advantage-list .advantage-item .right-content .ad-title{
    font-size: 20px;
    font-weight: 700;
    color: #444444;
    margin-bottom: 15px;
}

.dida-advantage-list .advantage-item:nth-child(3n) {
    margin-right: 0;
}

/* 产品功能特点 */
.dida-chara-list {
    width: 100%;
    margin-top: 60px;
}

.dida-chara-list .text-content {
    width: 370px;
    justify-content: space-around;
}

.dida-chara-list .text-content .chara-item {
    background-color: #ffffff;
    width: 167px;
    height: 104px;
    display: flex;
    align-items: center;
    margin-bottom: 22px;
    box-shadow: 0 2px 7px 0 rgba(0,0,0,0.08);
}

.dida-chara-list .text-content .chara-item:nth-child(3),
.dida-chara-list .text-content .chara-item:nth-child(4),
.dida-chara-list .text-content .chara-item:nth-child(5)  {
    width: 104px;
}

.chara-item .chara-item-inner {
    margin: auto;
    display: flex;
    align-items: center;
    flex-direction: column;
}

.chara-item .chara-item-inner .chara-icon {
    width: 40px;
    height: 40px;
}

.chara-item .chara-icon img {
    max-width: 40px;
    height: 100%;
}

.chara-item .chara-item-inner .chara-title {
    margin-top: 10px;
    font-size: 14px;
    text-align: center;
    color: #999999;
}

.chart-tip {
    width: 100%;
    opacity: 0.5;
    font-size: 12px;
    text-align: center;
    color: #999999;
}

/* 无须开发，轻松快捷 ，一键生成 */
.dida-step-list .text-content {
    width: 497px;
}

.dida-step-list .image-content {
    width: 488px;
}

.dida-step-list .step-inner {
    display: flex;
    align-items: center;
}

.step-inner .step-index {
    width: 13px;
    height: 13px;
    background: #ffffff;
    border: 1px solid #707070;
    border-radius: 50%;
    display: flex;
    align-items: center;
    margin-right: 13px;
    position: relative;
}

.step-inner:not(:last-child) .step-index::after {
    position: absolute;
    content: '';
    height: 19px;
    width: 1px;
    background: #707070;
    bottom: -20px;
    left: 5px;
}

.step-inner .step-index .step-index-inner {
    margin: auto;
    width: 5px;
    height: 5px;
    opacity: 1;
    background: #1E6AF2;
    border-radius: 50%;
}

/* 海量模板 */
.dida-template-list .text-content {
    width: 380px;
}

.dida-template-list .image-content {
    width: 714px;
}

.template-tip {
    font-size: 12px;
    color: #999999;
    margin-top: 20px;
}

/* 超强用户粘性 */
.dida-yhnx-list .text-content {
    width: 480px;
}

.dida-yhnx-list .image-content {
    width: 439px;
}

/* 原生小程序，用户体验更佳 */
.dida-tygj-list .text-content {
    width: 384px;
}

.dida-tygj-list .image-content {
    width: 468px;
}

/* 智能数据分析，全面推动经营决策 */
.dida-sjfx-list .text-content {
    width: 480px;
}

.dida-sjfx-list .image-content {
    width: 540px;
}

/* 适用场景 */
.scene-content {
    background: url("../image/solution_scene_bg@2x.png") no-repeat;
    background-size: cover;
    -webkit-background-size: cover;
    -o-background-size: cover;
}

.scene-content .content-title {
    color: #FFFFFF;
}

.dida-scene-list {
    margin-top: 50px;
}

.dida-scene-list .scene-item {
    width: 270px;
    height: 152px;
    position: relative;
    color: #FFFFFF;
    line-height: 158px;
    text-align: center;
    margin-bottom: 20px;
}

.dida-scene-list .scene-item img {
    width: 100%;
    height: 100%;
    vertical-align: top;
}

.scene-item .scene-desc {
    position: absolute;
    height: 100%;
    width: 100%;
    top: 0;
    left: 0;
    background-color: rgba(0,0,0,0.1);
}


/* 服务优势 */
.dida-service-list {
    margin-top: 35px;
}

.dida-service-list .service-item {
    width: 200px;
    display: flex;
    align-items: center;
    flex-direction: column;
    text-align: center;
    margin-bottom: 15px;
}

.service-item .icon {
    max-width: 96px;
    max-height: 96px;
}

.service-item .icon img {
    max-width: 100%;
}

.service-item .service-content {
    margin-top: 20px;
}

.service-content .service-title {
    font-size: 20px;
    font-weight: 700;
    color: #444444;
    line-height: 40px;
}

.service-content .service-desc {
    font-size: 16px;
    color: #999999;
}

/* 注册咨询 */
.register-tip-content {
    height: 134px;
    background: #fee5e7;
    color: #1E6AF2;
}

.register-tip-content .container {
    display: flex;
    align-items: center;
    justify-content: space-around;
    flex-wrap: wrap;
    height: 100%;
}

.register-tip-content .register-tip-title {
    font-size: 26px;
    font-weight: 700;
}

.register-tip-content .register-tip-tel {
    font-size: 16px;
}

.register-tip-content .register-tip-tel a {
    font-size: 16px;
    color: #1E6AF2;
}

/* 咨询二维码 */
.contact-qr-code {
    display: none;
    position: absolute;
    height: 280px;
    width: 260px;
    z-index: 100;
    background-color: rgba(0,0,0,0.5);
    border-radius: 5px;
    text-align: center;
}

.contact-qr-code img {
    width: 230px;
    vertical-align: middle;
    margin-top: 15px;
}

.contact-qr-code .contact-tip {
    margin-top: 10px;
    color: #ffffff;
}

/*---------------------------*/
/*       广告解决方案样式       */
/*---------------------------*/

.solution-head-adv {
    background: url("../image/solution_adv.jpg") no-repeat;
}

.dida-scene-list .scene-item.long {
    height: 336px;
    line-height: 336px;
}

.dida-feature-list {
    width: 100%;
    margin-top: 60px;
}

.dida-feature-list .text-content {
    width: 480px;
}

.text-content .feature-item {
    width: 480px;
    min-height: 127px;
    background: #ffffff;
    border: 1px solid rgba(164,164,164,0.4);
    padding: 20px;
    margin-bottom: 14px;
}

.text-content .feature-item.mt-30 {
    margin-bottom: 30px !important;
}

.text-content .feature-item .feature-title {
    font-size: 20px;
    font-weight: 700;
    color: #444444;
    margin-bottom: 8px;
}

.text-content .feature-item .feature-desc {
    font-size: 16px;
    color: #999999;
    line-height: 26px;
}

.dida-feature-list .image-content {
    width: 600px;
}

/*-------------------------------*/
/*   动画效果                      */
/*-------------------------------*/
.left-block {
    left: -100px;
    opacity: 0;
    position: relative;
    transition: 0.8s all ease-in;
}

.right-block {
    right: -100px;
    opacity: 0;
    position: relative;
    transition: 0.8s all ease-in;
}

.left-to-right {
    left: 0 !important;
    opacity: 1 !important;
}

.right-to-left {
    right: 0 !important;
    opacity: 1 !important;
}

.top-block {
    position: relative;
    top: 66px;
    opacity: 0;
    transition: 0.7s all ease-in;
}

.bottom-to-top {
    top: 0 !important;
    opacity: 1 !important;
}
/*新推广页面*/
.banner-left {
    text-align: left;
    margin-top: 50px;
}
.banner-left .banner-sologan{
    display: flex;
    align-items: center;
    width: 100%;
}
.banner-left .banner-sologan .sologan-image {
    margin-right: 12px;
    width: 30%;
    max-width: 243px;
}
.banner-left .banner-sologan .sologan-image img {
    width: 100%;
}
.banner-left .banner-sologan .sologan-text{
    font-size: 42px;
    font-weight: 400;
}
.banner-left .banner-title{
    font-size: 40px;
    font-weight: 700;
    color: rgba(255, 195, 0, 1);
    text-align: left;
    margin-top: 40px;
}
.banner-left .banner-desc{
    font-size: 24px;
    font-weight: 400;
    line-height: 38px;
    color: rgba(255, 255, 255, 1);

}

.content-item .content-image{
    position: relative;
}
.content-item .content-image .content-image-title{
    position: absolute;
    top: 50px;
    left: 50%;
    transform: translateX(-50%);

    font-size: 40px;
    font-weight: 400;
    color: rgba(51, 51, 51, 1);
    text-align: center;
}

.content-item .item-wrapper{
    margin-top: 90px;
}
.content-item .item-wrapper .card-item{
    padding: 44px;
    height: 410px;
    border-radius: 8px;
    background: rgba(255, 255, 255, 1);
    box-shadow: 0px 4px 25px 4px rgba(42, 130, 228, 0.1);
    text-align: left;
    background-color: #ffffff;
    margin-bottom: 20px;
}
.content-item .card-item .card-top{
    margin: 20px 0;
    text-align: left;
}
.content-item .card-item .card-title{

    font-size: 24px;
    font-weight: 700;
    color: rgba(30, 106, 242, 1);
    text-align: left;
    vertical-align: top;
    margin-bottom: 30px;
}
.content-item .card-item .card-desc{
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
    color: rgba(85, 85, 85, 1);
    text-align: left;
    vertical-align: top;

}
.content-item .form-wrapper{
    position: relative;
    text-align: center;
    margin-top: 60px;
}
.content-item .form-wrapper .content-back-image{
    width: 1025px;
    height: 438px;
    opacity: 0.5;
    border-radius: 4px;
    background: rgba(255, 255, 255, 1);
    box-shadow: 0px 4px 25px 4px rgba(42, 130, 228, 0.1);
    position: absolute;
    left: 50%;
    transform: translateX(-50%);
    z-index: 1;
    top: 38px;
}
.content-item .form-wrapper .content-form{
    width: 939px;
    min-height: 512px;
    opacity: 1;
    border-radius: 4px;
    background: rgba(255, 255, 255, 1);
    box-shadow: 0px 4px 25px 4px rgba(42, 130, 228, 0.1);
    position: relative;
    z-index: 10;
    margin: 0 auto;
    overflow: hidden;
    padding-bottom: 30px;
}
.content-item .content-form .content-form-top {
    position: absolute;
    top: 30px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 10;
}
.content-item .content-form .content-form-top .form-title{
    font-size: 26px;
    font-weight: 400;
    color: rgba(255, 255, 255, 1);
    text-align: center;
    vertical-align: top;
    margin-bottom: 10px;
}
.content-item .content-form .content-form-top .form-desc{
    font-size: 50px;
    font-weight: 700;
    color: rgba(255, 255, 255, 1);
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}
.content-item .content-form .content-form-top .form-desc span{
    font-size: 21px;
    font-weight: 400;
    color: rgba(255, 255, 255, 1);
    text-align: left;
    vertical-align: top;
    padding: 0 12px;

}
.content-item .content-form .content-form-top .form-desc .text-small{
    font-size: 18px;
    padding: 0;
}
.content-item .content-form-wrapper{
    margin: 50px 0 40px 0;
}
.content-item .content-form-wrapper .form-part {
    position: relative;
}
.content-item .content-form-wrapper .form-part:nth-child(2n-1):after{
    content: ' ';
    width: 1.5px;
    height: 75.21px;
    opacity: 0.6;
    background: rgba(204, 204, 204, 1);
    border-left: 1.5px solid rgba(166, 166, 166, 1);
    position: absolute;
    top: 50%;
    right: 0;
    transform: translateY(-50%);
}
.content-item .content-form-wrapper .form-part-item {

    font-size: 20px;
    font-weight: 400;
    letter-spacing: 0px;
    line-height: 39px;
    color: rgba(85, 85, 85, 1);
    text-align: center;

}
.content-item  .btn{
    width: 151px;
    height: 52px;
    line-height: 37px;
    border-radius: 50px;
    color: #ffffff;
    font-size: 18px;
    font-weight: 400;
    /*margin: 20px 0;*/
}

.content-item  .btn-trial{
    background: #42a5f5;
}
.content-item  .btn-trial:hover{
    background: #388bcd;
}

.content-item  .btn-standard{
    background: rgba(42, 130, 228, 1);
}
.content-item  .btn-standard:hover{
    background: rgb(35, 108, 191);
}
.content-item  .btn-senior{
    background: rgba(246, 205, 161, 1);
    color: rgba(138, 75, 6, 1);
}
.content-item  .btn-senior:hover{
    background: rgb(191, 158, 126);
}

.content-item .industry-list{
    margin: 0 -12px;
    width: calc(100% + 24px);
}
.content-item .industry-list .industry-item-wrapper{
    width: calc(100% / 8);
    padding: 12px;
    float: left;
    cursor: pointer;
}
.content-item .industry-list .industry-item-wrapper .industry-item{
    width: 100%;
    height: 140px;
    border-radius: 4px;
    background: rgba(255, 255, 255, 1);
    box-shadow: 0px 4px 25px 4px rgba(42, 130, 228, 0.1);
}
.content-item .industry-list .industry-item-wrapper .industry-item .item-top{
    width: 100%;
}
.content-item .industry-list .industry-item-wrapper .industry-item .item-top img{
    width: 100%;
    max-height: 90px;
    opacity: 0.6;
    transition: .3s;
}
.content-item .industry-list .industry-item-wrapper:hover .industry-item .item-top img{
    opacity:1
}
.content-item .industry-list .industry-item-wrapper .industry-item .item-title{
    height: 50px;
    font-size: 18px;
    font-weight: 500;
    line-height: 26px;
    color: rgba(51, 51, 51, 1);
    text-align: center;
    display: flex;
    align-items: center;
    justify-content: center;
}

.content-item .tech-list {
    margin: 0 -15px;
    width: calc(100% + 30px);
}
.content-item .tech-list .tech-item{
    width: 100%;
    height: 210px;
    border-radius: 4px;
    background: rgba(255, 255, 255, 1);
    box-shadow: 0px 4px 25px 4px rgba(42, 130, 228, 0.1);
    margin: 17px;
    padding: 34px;
    display: flex;
    align-items: center;
}
.content-item .tech-list .tech-item .item-left{
    width: 90px;
    height: 90px;
    float: left;
    opacity: 1;
    background: rgba(15, 89, 230, 0.1);
    border-radius: 50%;
    overflow: hidden;
    display: flex;
    align-items: center;
    justify-content: center;
}
.content-item .tech-list .tech-item .item-left img{
    width: 44px;
}
.content-item .tech-list .tech-item .item-right{
    float: left;
    width: calc(100% - 90px);
    padding-left: 34px;
}
.content-item .tech-list .tech-item .item-title{
    font-size: 24px;
    font-weight: 500;
    color: rgba(30, 106, 242, 1);
    text-align: left;
    margin-bottom: 8px;
}
.content-item .tech-list .tech-item .item-desc{
    font-size: 16px;
    font-weight: 400;
    line-height: 26px;
    color: rgba(85, 85, 85, 1);
    text-align: left;
}

@media (max-width: 1200px) {
    .text-content {
        margin-bottom: 20px;
    }

    .image-content {
        margin-bottom: 20px;
    }

    .content-item .dida-list {
        justify-content: space-around;
    }
    .content-item .item-wrapper .card-item{
        padding: 24px;
    }
    .content-item .card-item .card-title{
        margin-bottom: 15px;
        font-size: 22px;
    }
    .content-item .industry-list .industry-item-wrapper{
        width: calc(100% / 6);
    }
    .content-item .industry-list .industry-item-wrapper .industry-item{
        height: 100%;
    }
    .content-item .industry-list .industry-item-wrapper .industry-item .item-title{
        height: 45px;
    }
    .nav__menu li:last-child{
        display: none;
    }
}

@media (max-width: 992px) {
    #wrapper {
        padding: 0;
    }
}

@media (max-width: 750px) {
    .solution-container .solution-head {
        height: 200px;
    }
    .solution-head .head-inner .solution-head-title {
        font-size: 20px;
        padding-bottom: 10px;
    }
    .solution-head .head-inner .solution-head-desc {
        font-size: 13px;
        padding-bottom: 20px
    }
    .btn-consult, .btn-view {
        min-width: 120px;
        height: 40px;
        line-height: 25px;
        font-size: 15px;
    }
    .btn-price {
        min-width: 120px;
        height: 40px;
        line-height: 25px;
        font-size: 16px;
    }
    .solution-body .content-item {
        padding: 30px 0;
    }
    .content-item .content-title {
        font-size: 22px;
        margin-top: 20px
    }
    .content-item .content-desc {
        font-size: 18px;
    }
    .content-item .dida-list {
        margin-top: 40px;
        justify-content: space-around;
    }
    .dida-advantage-list .advantage-item .right-content .ad-title {
        font-size: 18px;
    }
    .service-content .service-title {
        font-size: 18px;
    }
    .service-item .icon {
        max-width: 50px;
    }
    .service-content .service-desc {
        font-size: 14px;
    }
    .register-tip-content .register-tip-title {
        width: 100%;
        font-size: 20px;
        text-align: center;
    }
    .dida-feature-list .text-content {
        width: 100%;
    }
    .content-item .content-body {
        font-size: 14px;
    }
    .solution-body .content-item .container{
        min-height: unset;
    }
    .banner-left{
        margin-top: 0;
    }
    .banner-left .banner-sologan .sologan-text{
        font-size: 20px;
    }
    .banner-left .banner-title{
        font-size: 22px;
        margin-top: 15px;
    }
    .banner-left .banner-desc{
        font-size: 14px;
        line-height: unset;
    }
    .content-item .content-image .content-image-title{
        position: relative;
        top:0;
        left: 0;
        transform: none;
        font-size: 20px;
        font-weight: 400;
        color: rgba(51, 51, 51, 1);
        text-align: center;
    }
    .content-item .item-wrapper{
        margin-top: 40px;
    }
    .content-item .item-wrapper > div{
        padding-left: 0;
        padding-right: 0;
    }
    .content-item .item-wrapper .card-item{
        padding: 20px 30px;
        height: 270px;
        margin-bottom: 15px;
    }
    .content-item .card-item .card-top{
        margin: 10px 0;
    }
    .content-item .card-item .card-title{
        font-size: 18px;
        margin-bottom: 15px;
    }
    .content-item .form-wrapper .content-form{
        width: 100%;
        height: 100%;
    }
    .content-item .content-form .content-form-top{
        top: 10px;
    }
    .content-item .content-form .content-form-top .form-title{
        font-size: 16px;
        margin-bottom: 0;
    }
    .content-item .content-form .content-form-top .form-desc{
        font-size: 20px;
    }
    .content-item .content-form .content-form-top .form-desc span{
        font-size: 14px;
    }
    .content-item .form-wrapper{
        margin-top: 30px;
    }
    .content-item .btn{
        height: 42px;
        line-height: 29px;
        font-size: 16px;
    }
    .content-item .form-wrapper .content-back-image{
        display: none;
    }
    .content-item .content-form-wrapper .form-part-item{
        font-size: 16px;
    }
    .content-item .content-form-wrapper .form-part:nth-child(2n-1)::after{
        display: none;
    }
    .content-item .industry-list .industry-item-wrapper{
        width: calc(100% / 3);
        padding: 6px;
    }
    .content-item .industry-list .industry-item-wrapper .industry-item{
        width: 100%;
        height: 100%;
    }
    .content-item .industry-list .industry-item-wrapper .industry-item .item-title{
        height: 36px;
        font-size: 16px;
    }
    .content-item .industry-list .industry-item-wrapper .industry-item .item-top img{
        opacity: 1;
    }
    .content-item .tech-list{
        width: 100%;
        margin: 0;
    }
    .content-item .tech-list >div{
        margin-bottom: 15px;
        padding-left: 0;
        padding-right: 0;

    }
    .content-item .tech-list .tech-item .item-right{
        padding-left: 24px;
    }
    .content-item .tech-list .tech-item{
        margin: 0;
        height: 140px;
        padding: 30px 20px;
    }
    .content-item .tech-list .tech-item .item-title{
        font-size: 18px;
    }

    .content-item .tech-list .tech-item .item-left{
        width: 70px;
        height: 70px;
    }
    .content-item .tech-list .tech-item .item-left img{
        width: 36px;
    }

}