/*#region index */
.index { }
    .index .banner { position: relative; overflow: hidden; width: 100%; min-height: 700px;background-color:#000 }
        .index .banner > .img { line-height: 0;width:1200px;margin:0 auto;text-align:center;position:relative }
            .index .banner > .img img { margin:50px auto; }
        .index .banner > .filter { position: absolute; z-index: 1; top: 0; right: 0; bottom: 0; left: 0; opacity: .349; background-color: #000; }
        .index .banner .container { position: absolute; top: 76px; right: 0; bottom: 0; left: 0; width: 1200px; margin: 0 auto; text-align: center; }
            .index .banner .container .h1 { font-size: 30px; margin: 130px 0 0; letter-spacing: 3px; color: white; }
            .index .banner .container .middle { margin-top: 80px; margin-bottom: 110px; }
                .index .banner .container .middle a { font-size: 18px; position: relative; display: inline-block; padding: 17px 93px; text-decoration: none; color: white; border: 1px solid white; border-radius: 2px; background-color: transparent; }
                    .index .banner .container .middle a:hover { background-color: rgba(255,255,255,.2); }
            .index .banner .container .h5 { font-size: 16px; margin: 0; color: white; }
     .index .stable { background-color: #fafbfc; color: #000; width: 100%; }
        .index .stable .stable-content { width: 1200px; height: 530px; margin: 0 auto; position: relative; text-align: center; }
            .index .stable .stable-content .title { font-size: 40px; text-align: center; line-height: 100px; padding-top: 30px; }
            .index .stable .stable-content .sub-title { font-size: 16px; text-align: center; line-height: 40px; color: #999; }
            .index .stable .stable-content .sub-title-description { color: #999; font-size: 16px; margin-bottom: 30px; }
            .index .stable .stable-content img { margin: 0 auto; }

   .index .saas { background-color: #f3f5f5; color: #000; width: 100%; }
        .index .saas .saas-content {  height: 530px; margin: 0 auto; position: relative; text-align: center; }
            .index .saas .saas-content .title { font-size: 40px; text-align: center; line-height: 100px; padding-top: 30px; }
            .index .saas .saas-content .sub-title { font-size: 16px; text-align: center; line-height: 40px; color: #999; }
            .index .saas .saas-content .sub-title-description { color: #999; font-size: 16px; margin-bottom: 30px; }
            .index .saas .saas-content img { margin: 0 auto; }

     .index .dt { background-color: #373d41;background:url("/frontend/img/index_09.png") no-repeat center;color: #fff; width: 100%; }
        .index .dt .dt-content { width: 1200px; height: 600px; margin: 0 auto; position: relative; text-align: center; }
            .index .dt .dt-content .title { font-size: 40px; text-align: center; line-height: 100px; padding-top: 30px; }
            .index .dt .dt-content .sub-title { font-size: 16px; text-align: center; line-height: 40px; color: #999; }
            .index .dt .dt-content .sub-title-description { color: #999; font-size: 16px; margin-bottom: 30px; }
            .index .dt .dt-content img { margin: 0 auto; }

    .index .behavior { height: 580px; width: 100%; background-color: #e0f5ff; background:url("/frontend/img/index_10.png") no-repeat center;}
        .index .behavior .behavior-content { width: 1200px; margin: 0 auto; }
            .index .behavior .behavior-content .title { font-size: 40px; text-align: center; line-height: 100px; padding-top: 30px; }

     .index .service-time { background-color: #fbfcfc; color: #000; width: 100%; }
        .index .service-time .service-time-content {  height: 600px; margin: 0 auto; position: relative; text-align: center; }
            .index .service-time .service-time-content .title { font-size: 40px; text-align: center; line-height: 100px; padding-top: 30px; }
            .index .service-time .service-time-content .sub-title { font-size: 16px; text-align: center; line-height: 40px; color: #999; }
            .index .service-time .service-time-content .sub-title-description { color: #999; font-size: 16px; margin-bottom: 30px; }
            .index .service-time .service-time-content img { margin: 0 auto; }

      .index .supports { height: 600px; width: 100%; background-color: #e0f5ff; background:url("/frontend/img/index_12.png") no-repeat center;color:#FFF}
        .index .supports .supports-content { width: 1200px; margin: 0 auto; }
            .index .supports .supports-content .title { font-size: 40px; text-align: center; line-height: 100px; padding-top: 50px; }
/*#endregion */

/*#region monitoring */
.monitoring { width: 100%; }
    .monitoring .overview { position: relative; overflow: hidden; width: 100%; height: 700px; }
    .monitoring .overview-content { width: 1200px; height: 700px; margin: 0 auto; }
        .monitoring .overview-content .title { font-size: 24px; text-align: center; line-height: 70px; margin-top: 20px; }
        .monitoring .overview-content .sub-title { font-size: 40px; text-align: center; line-height: 40px; margin-bottom: 50px;padding-top:50px; }
        .monitoring .overview-content .icons-wrap { width: 100%; overflow: hidden; }
            .monitoring .overview-content .icons-wrap ul li { width: 33.33%; float: left; height: 160px; list-style: none; text-align: center; margin-bottom: 70px; }
                .monitoring .overview-content .icons-wrap ul li img { display: block; margin: 0 auto; }
                .monitoring .overview-content .icons-wrap ul li span { display: block; line-height: 100px; font-size: 16px; height: 100px; }

    .monitoring .perf-counter { height: 538px; width: 100%; background-color: #e0f5ff; background: url(/frontend/img/monitoring_06.png) no-repeat 60% 0; margin: 0 auto; }
        .monitoring .perf-counter .perf-counter-content { width: 1200px; margin: 0 auto; position: relative; }
            .monitoring .perf-counter .perf-counter-content .text-wrap { position: absolute; right: 0; top: 0; padding-left: 80px; }
            .monitoring .perf-counter .perf-counter-content .title_1 { font-size: 38px; margin-top: 160px; height: 35px; }
            .monitoring .perf-counter .perf-counter-content .title_2 { font-size: 16px; margin-top: 60px; height: 30px; color: #999; }
            .monitoring .perf-counter .perf-counter-content .title_3 { font-size: 16px; height: 30px; color: #999; }

    .monitoring .app-exception { height: 530px; width: 100%; background-color: #e0f5ff; background: url(/frontend/img/monitoring_07.png) no-repeat 60% 0; margin: 0 auto; }
        .monitoring .app-exception .app-exception-content { width: 1200px; margin: 0 auto; position: relative; }
            .monitoring .app-exception .app-exception-content .text-wrap { position: absolute; left: 100px; top: 0; }
            .monitoring .app-exception .app-exception-content .title_1 { font-size: 38px; margin-top: 160px; height: 35px; color: #0c86a7; }
            .monitoring .app-exception .app-exception-content .title_2 { font-size: 16px; margin-top: 60px; height: 30px; color: #999; }
            .monitoring .app-exception .app-exception-content .title_3 { font-size: 16px; height: 30px; color: #999; }
            .monitoring .app-exception .app-exception-content .img-wrap { float: left; width: 100px; height: 500px; line-height: 580px; }

    .monitoring .database { height: 530px; width: 100%; background-color: #e0f5ff; background: url(/frontend/img/monitoring_08.png) no-repeat 60% 0; margin: 0 auto; }
        .monitoring .database .database-content { width: 1200px; margin: 0 auto; position: relative; }
            .monitoring .database .database-content .text-wrap { position: absolute; right: 0px; top: 0; }
            .monitoring .database .database-content .title_1 { font-size: 38px; margin-top: 160px; height: 35px; color: #000; }
            .monitoring .database .database-content .title_2 { font-size: 16px; margin-top: 60px; height: 30px; color: #999; }
            .monitoring .database .database-content .title_3 { font-size: 16px; height: 30px; color: #999; }
            .monitoring .database .database-content .img-wrap { float: left; width: 100px; height: 500px; line-height: 580px; }

    .monitoring .alert { height: 530px; width: 100%; background-color: #e0f5ff; background: url(/frontend/img/monitoring_09.png) no-repeat 60% -2px; margin: 0 auto; }
        .monitoring .alert .alert-content { width: 1200px; margin: 0 auto; position: relative; }
            .monitoring .alert .alert-content .text-wrap { position: absolute; left: 100px; top: 0; }
            .monitoring .alert .alert-content .title_1 { font-size: 38px; margin-top: 160px; height: 35px; color: #fff; }
            .monitoring .alert .alert-content .title_2 { font-size: 16px; margin-top: 60px; height: 30px; color: #999; }
            .monitoring .alert .alert-content .title_3 { font-size: 16px; height: 30px; color: #999; }
            .monitoring .alert .alert-content .img-wrap { float: left; width: 100px; height: 500px; line-height: 580px; }
/*#endregion */

/*#region TSS */
/*technology support service*/
.tss { width: 100%; }
    .tss .open-ol { position: relative; width: 100%; height: 600px; }
    .tss .open-ol-content { width: 1200px; height: 500px; margin: 0 auto; }
        .tss .open-ol-content .title { font-size: 24px; text-align: center; line-height: 70px; margin-top: 20px; }
        .tss .open-ol-content .sub-title { font-size: 40px; text-align: center; line-height: 40px; margin-bottom: 50px;padding-top:50px; }
        .tss .open-ol-content img { display: block; margin: 0 auto; }

    .tss .perf-test { background-color: #e9f0f6; height: 750px; width: 100%; margin: 0 auto; }
        .tss .perf-test .perf-test-content { margin: 0 auto; position: relative; text-align: center; }
            .tss .perf-test .perf-test-content .title { font-size: 40px; height: 100px; line-height: 110px; margin: 0 auto; display: block; }
            .tss .perf-test .perf-test-content img { margin: 0 auto; }

/*#endregion */

/*#region ERP */
.erp { }
    .erp .inspection { background-color: #43bee7; width: 100%; }
        .erp .inspection .inspection-content { background: url(/frontend/img/erp_01.png?v=1) no-repeat 100% 100%; width: 1200px; height: 650px; margin: 0 auto; position: relative; text-align: center; }
            .erp .inspection .inspection-content .title { font-size: 24px; text-align: center; line-height: 100px; color: #fff; }
            .erp .inspection .inspection-content .sub-title { font-size: 40px; text-align: center; line-height: 40px; margin-bottom: 20px; padding-top:50px;color: #fff; }
            .erp .inspection .inspection-content .sub-title-description { color: #fff; font-size: 16px; }

    .erp .steps { background-color: #f6f6f6; color: #000; width: 100%; }
        .erp .steps .steps-content { width: 1200px; height: 700px; margin: 0 auto; position: relative; text-align: center; }
            .erp .steps .steps-content .title { font-size: 40px; text-align: center; line-height: 100px; padding-top: 30px; }
            .erp .steps .steps-content .sub-title { font-size: 16px; text-align: center; line-height: 40px; color: #999; }
            .erp .steps .steps-content .sub-title-description { color: #999; font-size: 16px; margin-bottom: 30px; }
            .erp .steps .steps-content img { margin: 0 auto; }

    .erp .saas { background-color: #fff; color: #000; width: 100%; }
        .erp .saas .saas-content { width: 1200px; height: 800px; margin: 0 auto; position: relative; text-align: center; }
            .erp .saas .saas-content .title { font-size: 40px; text-align: center; line-height: 100px; padding-top: 30px; }
            .erp .saas .saas-content .sub-title { font-size: 16px; text-align: center; line-height: 40px; color: #999; }
            .erp .saas .saas-content .sub-title-description { color: #999; font-size: 16px; margin-bottom: 30px; }
            .erp .saas .saas-content img { margin: 0 auto; }

    .erp .instead-om { background-color: #f6f6f6; color: #000; width: 100%; }
        .erp .instead-om .instead-om-content { width: 1200px; height: 900px; margin: 0 auto; position: relative; text-align: center; }
            .erp .instead-om .instead-om-content .title { font-size: 40px; text-align: center; line-height: 100px; padding-top: 30px; }
            .erp .instead-om .instead-om-content img { margin: 0 auto; }
                .erp .instead-om .instead-om-content img:last-child { margin: 50px auto; margin-left: -50px; }

/*#endregion */

/*#region call center */

.call-center { width: 100%; }
    .call-center .overview { position: relative; overflow: hidden; width: 100%; height: 700px; }
    .call-center .overview-content { width: 1200px; height: 700px; margin: 0 auto; }
        .call-center .overview-content .title { font-size: 24px; text-align: center; line-height: 70px; margin-top: 20px; }
        .call-center .overview-content .sub-title { font-size: 40px; text-align: center; line-height: 40px; margin-bottom: 50px;padding-top:50px; }
        .call-center .overview-content .icons-wrap { width: 100%; overflow: hidden; }
            .call-center .overview-content .icons-wrap ul li { width: 33.33%; float: left; height: 160px; list-style: none; text-align: center; margin-bottom: 70px; }
                .call-center .overview-content .icons-wrap ul li img { display: block; margin: 0 auto; }
                .call-center .overview-content .icons-wrap ul li span { display: block; line-height: 100px; font-size: 16px; height: 100px; }

    .call-center .satisfaction { height: 660px; width: 100%; background: url(/frontend/img/callcenter_07.png) no-repeat 50% 0; margin: 0 auto; }
        .call-center .satisfaction .satisfaction-content { width: 1200px; height: 800px; margin: 0 auto; position: relative; text-align: center; }
            .call-center .satisfaction .satisfaction-content .title { font-size: 40px; text-align: center; line-height: 100px; padding-top: 30px; }
            .call-center .satisfaction .satisfaction-content .sub-title { font-size: 16px; text-align: center; line-height: 40px; color: #999; }
            .call-center .satisfaction .satisfaction-content .sub-title-description { color: #999; font-size: 16px; }

    .call-center .robot { height: 800px; width: 100%; background: url(/frontend/img/callcenter_08.png) no-repeat 60% 0; background-color: #71c2d7; margin: 0 auto; }
        .call-center .robot .robot-content { width: 1200px; height: 800px; margin: 0 auto; position: relative; text-align: center; }
            .call-center .robot .robot-content .title { font-size: 40px; text-align: center; line-height: 80px; padding-top: 50px; color: #fff; }

    .call-center .toplog { height: 600px; width: 100%; background: url(/frontend/img/callcenter_09.png) no-repeat 60% 90%; background-color: #f5f5f5; margin: 0 auto; }
/*#endregion */

/*#region inspection */

.inspection { }
    .inspection .overview { position: relative; overflow: hidden; height: 580px; }
    .inspection .overview-content { width: 1200px; height: 600px; margin: 0 auto; }
        .inspection .overview-content .title { font-size: 24px; text-align: center; line-height: 70px; margin-top: 20px; }
        .inspection .overview-content .sub-title { font-size: 40px; text-align: center; line-height: 40px; margin-bottom: 80px;padding-top:50px;  }
        .inspection .overview-content .icons-wrap { width: 100%; overflow: hidden; }
            .inspection .overview-content .icons-wrap ul li { width: 25%; float: left; min-height: 160px; list-style: none; text-align: center; margin-bottom: 70px; }
                .inspection .overview-content .icons-wrap ul li img { display: block; margin: 0 auto; }
                .inspection .overview-content .icons-wrap ul li span { display: block; line-height: 100px; font-size: 18px; height: 80px; font-weight: bold; }
                .inspection .overview-content .icons-wrap ul li p { text-align: left; width: 180px; line-height: 30px; margin: 0 auto; color: #999; font-size: 16px; }

    .inspection .analysis-method { height: 580px; background-color: #f5f5f7; }
        .inspection .analysis-method .analysis-method-content { width: 1200px; margin: 0 auto; }
            .inspection .analysis-method .analysis-method-content .img-wrap { float: left; width: 550px; height: 500px; line-height: 580px; }
            .inspection .analysis-method .analysis-method-content .text-wrap { float: left; width: 650px; padding-left: 120px; }
            .inspection .analysis-method .analysis-method-content .title_1 { font-size: 38px; margin-top: 160px; height: 35px; }
            .inspection .analysis-method .analysis-method-content .title_3 { font-size: 16px; margin-top: 30px; height: 35px; color: #999; }

    .inspection .settings { height: 550px;  background: url(/frontend/img/inspection_06.png) no-repeat 50% 0; margin: 0 auto; }
        .inspection .settings .settings-content { width: 1200px; margin: 0 auto; }
            .inspection .settings .settings-content .img-wrap { float: left; width: 400px; height: 500px; line-height: 580px; }
            .inspection .settings .settings-content .text-wrap { float: left; width: 600px; padding-left: 120px; }
            .inspection .settings .settings-content .title_1 { font-size: 38px; margin-top: 160px; height: 35px; }
            .inspection .settings .settings-content .title_3 { font-size: 16px; margin-top: 30px; height: 35px; color: #999; }

    .inspection .alert { height: 580px; background: url(/frontend/img/inspection_07.png) no-repeat 50% 0; margin: 0 auto; }
        .inspection .alert .alert-content { width: 1200px; margin: 0 auto; }
            .inspection .alert .alert-content .img-wrap { float: left; width: 550px; height: 500px; line-height: 580px; }
            .inspection .alert .alert-content .text-wrap { float: left; width: 650px; padding-left: 200px; }
            .inspection .alert .alert-content .title_1 { font-size: 38px; margin-top: 160px; height: 35px; color: #fff; }
            .inspection .alert .alert-content .title_2 { font-size: 16px; margin-top: 50px; height: 30px; color: #999; }
            .inspection .alert .alert-content .title_3 { font-size: 16px; margin-top: 5px; height: 30px; color: #999; }
/*#endregion */

/*#region behavior */
.behavior { }
    .behavior .overview { position: relative; overflow: hidden; height: 580px; }
    .behavior .overview-content { width: 1200px; height: 600px; margin: 0 auto; }
        .behavior .overview-content .title { font-size: 24px; text-align: center; line-height: 70px; margin-top: 20px; }
        .behavior .overview-content .sub-title { font-size: 40px; text-align: center; line-height: 40px; margin-bottom: 80px;padding-top:50px; }
        .behavior .overview-content .icons-wrap { width: 100%; overflow: hidden; }
            .behavior .overview-content .icons-wrap ul li { width: 25%; float: left; min-height: 160px; list-style: none; text-align: center; margin-bottom: 70px; }
                .behavior .overview-content .icons-wrap ul li img { display: block; margin: 0 auto; }
                .behavior .overview-content .icons-wrap ul li span { display: block; line-height: 100px; font-size: 18px; height: 80px; font-weight: bold; }
                .behavior .overview-content .icons-wrap ul li p { text-align: left; width: 12em; line-height: 30px; margin: 0 auto; color: #999; font-size: 16px; }

    .behavior .trail { height: 550px; background: url(/frontend/img/behavior_05.png) no-repeat 50% 0; margin: 0 auto; }
        .behavior .trail .trail-content { width: 1200px; margin: 0 auto; }
            .behavior .trail .trail-content .text-wrap { float: left; width: 450px; padding-left: 0px; }
            .behavior .trail .trail-content .title_1 { font-size: 38px; margin-top: 160px; height: 35px; color: #000; }
            .behavior .trail .trail-content .title_2 { font-size: 16px; margin-top: 50px; height: 30px; color: #999; }

    .behavior .zombie-module { height: 490px; margin: 0 auto; background-color: #fff; }
        .behavior .zombie-module .zombie-module-content { width: 1200px; margin: 0 auto; }
            .behavior .zombie-module .zombie-module-content .img-wrap { float: left; width: 400px; height: 500px; line-height: 580px; }
            .behavior .zombie-module .zombie-module-content .text-wrap { float: left; width: 700px; padding-left: 150px; }
            .behavior .zombie-module .zombie-module-content .title_1 { font-size: 38px; margin-top: 160px; height: 35px; color: #000; }
            .behavior .zombie-module .zombie-module-content .title_2 { font-size: 16px; margin-top: 50px; height: 30px; color: #999; }
            .behavior .zombie-module .zombie-module-content .title_3 { font-size: 16px; margin-top: 5px; height: 30px; color: #999; }

    .behavior .protect { height: 470px; background-color: #f3f5f4;margin: 0 auto;clear:both  }
        .behavior .protect .protect-content { width: 1200px; margin: 0 auto; }
            .behavior .protect .protect-content .text-wrap { float: left; width: 600px; padding-left:100px; }
            .behavior .protect .protect-content .img-wrap { float: left; width: 600px; height: 500px; line-height: 580px; }
            .behavior .protect .protect-content .title_1 { font-size: 38px; margin-top: 160px; height: 35px; color: #000; }
            .behavior .protect .protect-content .title_2 { font-size: 16px; margin-top: 50px; height: 30px; color: #999; }

    .behavior .baseline { height: 500px; background: url(/frontend/img/behavior_08.png) no-repeat 50% 0; margin: 0 auto; }
        .behavior .baseline .baseline-content { width: 1200px; margin: 0 auto; }
            .behavior .baseline .baseline-content .text-wrap { float: right; width: 550px; padding-left: 0px; }
            .behavior .baseline .baseline-content .title_1 { font-size: 38px; margin-top: 160px; height: 35px; color: #000; }
            .behavior .baseline .baseline-content .title_2 { font-size: 16px; margin-top: 50px; height: 30px; color: #999; }
/*#endregion */