body {
	padding: 0;
	margin: 0;
	max-width: 1200px;
	min-width: 900px;
}
/*-----------------------------------------------------load--------------------------*/
@media (min-width: 1800px) and (max-width: 2000px) {
    .chromeframe {
        margin: 0.2em 0;
        background: #ccc;
        color: #000;
        padding: 0.2em 0;
    }

    #loader-wrapper {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 999999;
    }

    #loader {
        display: block;
        position: relative;
        left: 50%;
        top: 50%;
        width: 150px;
        height: 150px;
        margin: -75px 0 0 -75px;
        border-radius: 50%;
        border: 3px solid transparent;
        /* COLOR 1 */
        border-top-color: #FFF;
        -webkit-animation: spin 2s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -ms-animation: spin 2s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -moz-animation: spin 2s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -o-animation: spin 2s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        animation: spin 2s linear infinite;
        /* Chrome, Firefox 16+, IE 10+, Opera */
        z-index: 1001;
    }

    #loader:before {
        content: "";
        position: absolute;
        top: 5px;
        left: 5px;
        right: 5px;
        bottom: 5px;
        border-radius: 50%;
        border: 3px solid transparent;
        /* COLOR 2 */
        border-top-color: #FFF;
        -webkit-animation: spin 3s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -moz-animation: spin 3s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -o-animation: spin 3s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -ms-animation: spin 3s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        animation: spin 3s linear infinite;
        /* Chrome, Firefox 16+, IE 10+, Opera */
    }

    #loader:after {
        content: "";
        position: absolute;
        top: 15px;
        left: 15px;
        right: 15px;
        bottom: 15px;
        border-radius: 50%;
        border: 3px solid transparent;
        border-top-color: #FFF;
        /* COLOR 3 */
        -moz-animation: spin 1.5s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -o-animation: spin 1.5s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -ms-animation: spin 1.5s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -webkit-animation: spin 1.5s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        animation: spin 1.5s linear infinite;
        /* Chrome, Firefox 16+, IE 10+, Opera */
    }

    @-webkit-keyframes spin {
        0% {
            -webkit-transform: rotate(0deg);
            /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(0deg);
            /* IE 9 */
            transform: rotate(0deg);
            /* Firefox 16+, IE 10+, Opera */
        }
        100% {
            -webkit-transform: rotate(360deg);
            /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(360deg);
            /* IE 9 */
            transform: rotate(360deg);
            /* Firefox 16+, IE 10+, Opera */
        }
    }

    @keyframes spin {
        0% {
            -webkit-transform: rotate(0deg);
            /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(0deg);
            /* IE 9 */
            transform: rotate(0deg);
            /* Firefox 16+, IE 10+, Opera */
        }
        100% {
            -webkit-transform: rotate(360deg);
            /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(360deg);
            /* IE 9 */
            transform: rotate(360deg);
            /* Firefox 16+, IE 10+, Opera */
        }
    }

    #loader-wrapper .loader-section {
        position: fixed;
        top: 0;
        width: 51%;
        height: 100%;
        background: #000000;
        /* Old browsers */
        z-index: 1000;
        -webkit-transform: translateX(0);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateX(0);
        /* IE 9 */
        transform: translateX(0);
        /* Firefox 16+, IE 10+, Opera */
    }

    #loader-wrapper .loader-section.section-left {
        left: 0;
    }

    #loader-wrapper .loader-section.section-right {
        right: 0;
    }


    /* Loaded */

    .loaded #loader-wrapper .loader-section.section-left {
        -webkit-transform: translateX(-100%);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateX(-100%);
        /* IE 9 */
        transform: translateX(-100%);
        /* Firefox 16+, IE 10+, Opera */
        -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
        transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
    }

    .loaded #loader-wrapper .loader-section.section-right {
        -webkit-transform: translateX(100%);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateX(100%);
        /* IE 9 */
        transform: translateX(100%);
        /* Firefox 16+, IE 10+, Opera */
        -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
        transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
    }

    .loaded #loader {
        opacity: 0;
        -webkit-transition: all 0.3s ease-out;
        transition: all 0.3s ease-out;
    }

    .loaded #loader-wrapper {
        visibility: hidden;
        -webkit-transform: translateY(-100%);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateY(-100%);
        /* IE 9 */
        transform: translateY(-100%);
        /* Firefox 16+, IE 10+, Opera */
        -webkit-transition: all 0.3s 1s ease-out;
        transition: all 0.3s 1s ease-out;
    }


    /* JavaScript Turned Off */

    .no-js #loader-wrapper {
        display: none;
    }

    .no-js h1 {
        color: #222222;
    }

    #loader-wrapper .load_title {
        font-family: 'Open Sans';
        color: #FFF;
        font-size: 19px;
        width: 100%;
        text-align: center;
        z-index: 9999999999999;
        position: absolute;
        top: 60%;
        opacity: 1;
        line-height: 30px;
    }

    #loader-wrapper .load_title span {
        font-weight: normal;
        font-style: italic;
        font-size: 13px;
        color: #FFF;
        opacity: 0.5;
    }


    /*--------------------------------------------导航栏-----------------------------*/

    .head {
        width: 100%;
        display: block;
        position: relative;
        float: left;
        z-index: 100;
        min-width: 1720px;
    }

    .head_nav {
        width: 100%;
        height: 120px;
        display: block;
        position: fixed;
        float: left;
        /*background-color: #000000;*/
        z-index: 1;
    }

    .head_nav_more {
        width: 100%;
        height: 100%;
        display: none;
        position: absolute;
        float: left;
        background-color: #ffffff;
        z-index: 10;
        min-width: 1720px;
    }

    .nav_icon {
        display: block;
        position: relative;
        float: right;
        padding: 2.8rem 3.3rem;
        z-index: 2;
    }

    .head_nav_more_one {
        width: 70%;
        height: 100%;
        /*background-color: #000000;*/
        position: relative;
        display: block;
        float: left;
    }

    .head_nav_more_one a {
        display: block;
        text-decoration: none;
    }

    .head_nav_more_one>ul>li {
        width: 140px;
        float: left;
        text-align: center;
        margin-top: 1.4rem;
        display: block;
        position: relative;
    }

    .head_nav_more_one>ul>li>a {
        width: 100%;
        height: 73px;
    }

    .head_nav_more_one li ul.sub-menu {
        list-style: none;
        display: none;
        padding-left: 0 !important;
    }

    .sub-menu {
        background-color: #ffffff;
    }

    .sub-menu li {
        height: 2.2rem;
        color: #ffffff;
        background-color: #ffffff;
    }

    .sub-menu li>a {
        color: #575757;
        text-decoration: none;
    }

    .sub-menu li:hover {
        background-color: #ee9d4b;
    }

    .sub-menu li:hover a {
        color: white;
        text-decoration: none;
    }

    .head_nav_more_one>ul {
        margin-left: 10rem;
        display: block;
        list-style: none;
    }

    .head_nav_more_one_Home,
    .head_nav_more_one_Programming,
    .head_nav_more_one_ji,
    .head_nav_more_one_lian {
        width: 100%;
        height: 73px;
        display: block;
    }


    /*.head_nav_more_one_Home{*/


    /*background: url("../image/Lockwit_web/nav_1 .png");*/


    /*}*/


    /*.head_nav_more_one_Programming{*/


    /*background: url("../image/Lockwit_web/nav_2.png");*/


    /*}*/


    /*.head_nav_more_one_ji{*/


    /*background: url("../image/Lockwit_web/nav_3.png");*/


    /*}*/


    /*.head_nav_more_one_lian{*/


    /*background: url("../image/Lockwit_web/nav_4.png");*/


    /*}*/

    a img {
        border: 0
    }

    ul,
    ol,
    li {
        list-style-type: none;
        vertical-align: 0
    }

    a {
        outline-style: none;
        color: #535353;
        text-decoration: none
    }

    a:hover {
        /*color: #D40000;*/
        text-decoration: none
    }

    .clear {
        height: 0;
        overflow: hidden;
        clear: both
    }

    header {
        height: 100px;
    }

    input {
        border: none;
    }

    .button {
        display: inline-block;
        zoom: 1;
        *display: inline;
        vertical-align: baseline;
        margin: 0 2px;
        outline: none;
        cursor: pointer;
        text-align: center;
        text-decoration: none;
        font: 14px/100% Arial, Helvetica, sans-serif;
        padding: 0.25em 0.6em 0.3em;
        /*text-shadow: 0 1px 1px rgba(0, 0, 0, .3);*/
        -webkit-border-radius: .5em;
        -moz-border-radius: .5em;
        border-radius: .5em;
        /*-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);*/
        /*-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);*/
        /*box-shadow: 0 1px 2px rgba(0, 0, 0, .2);*/
    }


    /*restCSS结束，应用特效时，以上样式可删除*/


    /* 需要的css样式 */

    .nav {
        width: 970px;
        margin: 0 auto;
        text-align: center;
    }

    .menu,
    .menu ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .menu {
        height: 58px;
        margin-top: 50px;
    }

    .menu li {
        background-color: #ffffff;
        /*border-bottom: 2px solid #181818;*/
        /*border-top: 2px solid #303030;*/
        min-width: 160px;
        /*max-width: 160px;*/
        font-family: "Adobe Caslon Pro";
    }

    .menu>li {
        display: block;
        float: left;
        position: relative;
    }

    .menu>li:first-child {
        border-radius: 5px 0 0;
    }

    .menu a {
        border-left: 3px solid rgba(0, 0, 0, 0);
        /*background: url("../img/back.jpg");*/
        color: #808080;
        display: block;
        font-size: 18px;
        line-height: 54px;
        padding: 0 25px;
        text-decoration: none;
        text-transform: uppercase;
    }

    .menu li:hover {
        /*background-color: #1c1c1c;*/
        /*background: -moz-linear-gradient(#1c1c1c, #1b1b1b);*/
        /*background: -ms-linear-gradient(#1c1c1c, #1b1b1b);*/
        /*background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #1c1c1c), color-stop(100%, #1b1b1b));*/
        /*background: -webkit-linear-gradient(#1c1c1c, #1b1b1b);*/
        /*background: -o-linear-gradient(#1c1c1c, #1b1b1b);*/
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1c1c1c', endColorstr='#1b1b1b');
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#1c1c1c', endColorstr='#1b1b1b')";
        /*background: linear-gradient(#1c1c1c, #1b1b1b);*/
        /*border-bottom: 2px solid #222222;*/
        /*border-top: 2px solid #1B1B1B;*/
        /*改变加深父元素的背景*/
    }

    .menu li:hover>a {
        border-radius: 5px 0 0 0;
        /*border-left: 3px solid #C4302B;*/
        color: #00b6ff;
    }

    .submenu {
        left: 0;
        max-height: 0;
        position: absolute;
        top: 100%;
        z-index: 0;
        -webkit-perspective: 400px;
        -moz-perspective: 400px;
        -ms-perspective: 400px;
        -o-perspective: 400px;
        perspective: 400px;
    }

    .submenu li {
        opacity: 0;
        -webkit-transform: rotateY(90deg);
        -moz-transform: rotateY(90deg);
        -ms-transform: rotateY(90deg);
        -o-transform: rotateY(90deg);
        transform: rotateY(90deg);
        -webkit-transition: opacity .4s, -webkit-transform .5s;
        -moz-transition: opacity .4s, -moz-transform .5s;
        -ms-transition: opacity .4s, -ms-transform .5s;
        -o-transition: opacity .4s, -o-transform .5s;
        transition: opacity .4s, transform .5s;
        /*实现下拉菜单螺旋淡出*/
    }

    .menu .submenu li:hover a {
        /*border-left: 3px solid #454545;*/
        border-radius: 0;
        /*color: #ffffff;*/
    }

    .menu>li:hover .submenu,
    .menu>li:focus .submenu {
        max-height: 2000px;
        z-index: 10;
    }

    .menu>li:hover .submenu li,
    .menu>li:focus .submenu li {
        opacity: 1;
        -webkit-transform: none;
        -moz-transform: none;
        -ms-transform: none;
        -o-transform: none;
        transform: none;
    }


    /*动画递进的时间 实现一个个螺旋子菜单*/

    .menu li:hover .submenu li:nth-child(1) {
        -webkit-transition-delay: 0s;
        -moz-transition-delay: 0s;
        -ms-transition-delay: 0s;
        -o-transition-delay: 0s;
        transition-delay: 0s;
    }

    .menu li:hover .submenu li:nth-child(2) {
        -webkit-transition-delay: 50ms;
        -moz-transition-delay: 50ms;
        -ms-transition-delay: 50ms;
        -o-transition-delay: 50ms;
        transition-delay: 50ms;
    }

    .menu li:hover .submenu li:nth-child(3) {
        -webkit-transition-delay: 100ms;
        -moz-transition-delay: 100ms;
        -ms-transition-delay: 100ms;
        -o-transition-delay: 100ms;
        transition-delay: 100ms;
    }

    .menu li:hover .submenu li:nth-child(4) {
        -webkit-transition-delay: 150ms;
        -moz-transition-delay: 150ms;
        -ms-transition-delay: 150ms;
        -o-transition-delay: 150ms;
        transition-delay: 150ms;
    }

    .menu li:hover .submenu li:nth-child(5) {
        -webkit-transition-delay: 200ms;
        -moz-transition-delay: 200ms;
        -ms-transition-delay: 200ms;
        -o-transition-delay: 200ms;
        transition-delay: 200ms;
    }

    .menu li:hover .submenu li:nth-child(6) {
        -webkit-transition-delay: 250ms;
        -moz-transition-delay: 250ms;
        -ms-transition-delay: 250ms;
        -o-transition-delay: 250ms;
        transition-delay: 250ms;
    }

    .menu li:hover .submenu li:nth-child(7) {
        -webkit-transition-delay: 300ms;
        -moz-transition-delay: 300ms;
        -ms-transition-delay: 300ms;
        -ms-transition-delay: 300ms;
        -o-transition-delay: 300ms;
        transition-delay: 300ms;
    }

    .menu li:hover .submenu li:nth-child(8) {
        -webkit-transition-delay: 350ms;
        -moz-transition-delay: 350ms;
        -ms-transition-delay: 350ms;
        -o-transition-delay: 350ms;
        transition-delay: 350ms;
    }

    .submenu li:nth-child(1) {
        -webkit-transition-delay: 350ms;
        -moz-transition-delay: 350ms;
        -ms-transition-delay: 350ms;
        -o-transition-delay: 350ms;
        transition-delay: 350ms;
    }

    .submenu li:nth-child(2) {
        -webkit-transition-delay: 300ms;
        -moz-transition-delay: 300ms;
        -ms-transition-delay: 300ms;
        -o-transition-delay: 300ms;
        transition-delay: 300ms;
    }

    .submenu li:nth-child(3) {
        -webkit-transition-delay: 250ms;
        -moz-transition-delay: 250ms;
        -ms-transition-delay: 250ms;
        -o-transition-delay: 250ms;
        transition-delay: 250ms;
    }

    .submenu li:nth-child(4) {
        -webkit-transition-delay: 200ms;
        -moz-transition-delay: 200ms;
        -ms-transition-delay: 200ms;
        -o-transition-delay: 200ms;
        transition-delay: 200ms;
    }

    .submenu li:nth-child(5) {
        -webkit-transition-delay: 150ms;
        -moz-transition-delay: 150ms;
        -ms-transition-delay: 150ms;
        -o-transition-delay: 150ms;
        transition-delay: 150ms;
    }

    .submenu li:nth-child(6) {
        -webkit-transition-delay: 100ms;
        -moz-transition-delay: 100ms;
        -ms-transition-delay: 100ms;
        -o-transition-delay: 100ms;
        transition-delay: 100ms;
    }

    .submenu li:nth-child(7) {
        -webkit-transition-delay: 50ms;
        -moz-transition-delay: 50ms;
        -ms-transition-delay: 50ms;
        -o-transition-delay: 50ms;
        transition-delay: 50ms;
    }

    .submenu li:nth-child(8) {
        -webkit-transition-delay: 0s;
        -moz-transition-delay: 0s;
        -ms-transition-delay: 0s;
        -o-transition-delay: 0s;
        transition-delay: 0s;
    }
    .menu_znms{
        background: url("../image/Lockwit_web/nav_2.png") no-repeat 15px -15px;

    }

    /*-------------------------------------轮播图-------------------------------------*/

    #head_Publicity {
        float: left;
        margin: 0 auto;
        display: inline-block;
        position: absolute;
        width: 100%;
        /*height: 897px;*/
        /*margin-top: 120px;*/
        z-index: -1;
    }

    .head_Publicity_animation_1 {
        width: 32px;
        height: 20px;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -268px -440px;
        position: absolute;
        bottom: 15px;
        left:54%;
        -webkit-animation: play1-4 2s linear infinite;
        animation: play1-4 2s linear infinite;
    }

    @keyframes play1-4 {
        0% {
            transform: translateY(0);
            -webkit-transform: translateY(0);
            opacity: 1;
        }
        100% {
            transform: translateY(25px);
            -webkit-transform: translateY(25px);
            opacity: 0;
        }
    }

    #head_Publicity-inner {
        position: relative;
        height: 100%;
        overflow: hidden;
    }

    #head_Publicity-inner ul {
        margin: 0;
        padding: 0;
        list-style-type: none;
    }

    #head_Publicity-inner ul li {
        display: inline-block;
        width: 100%;
        height: 100%;
        z-index: -1;
        position: absolute;
        top: 0;
        min-height: 777px;
        min-width: 1720px;
    }

    #head_Publicity-inner ul>li:nth-of-type(1) {
        z-index: -1;
    }

    #head_Publicity-inner ul>li:nth-of-type(2) {
        z-index: -2;
    }

    #head_Publicity-inner ul>li:nth-of-type(3) {
        z-index: -3;
    }

    #head_Publicity-inner ul>li:nth-of-type(1) a {
        display: inline-block;
        position: absolute;
    }

    #head_Publicity-inner ul li a {
        display: inline-block;
        width: 100%;
        height: 100%;
        background-size: 100% 100%;
        background-attachment: fixed;
    }

    .head_Publicity-inner-left,
    .head_Publicity-inner-right {
        width: 35%;
        height: 70%;
        display: block;
        position: absolute;
        bottom: 0px;
        top: 20%;
        cursor: none;
    }

    .head_Publicity-inner-right {
        right: 0;
    }

    .lockwit_zjm {
        width: 215px;
        height: 75px;
        /*width:21.5px;*/
        /*height:7.5px;*/
        display: inline-block;
        position: absolute;
        bottom: 12rem;
        left: 50%;
        margin-left: -107.5px;
        border:2px solid #ffffff ;
        font-size: 2rem;
        text-align: center;
        line-height: 4.5rem;
        color: #ffffff;
        /*padding: 34rem 59rem;*/
        /*-webkit-animation:play1-6 1.5s ease 1;*/
        /*animation:play1-6 1.5s ease 1;*/
        /*animation-fill-mode:forwards;*/
        /*-webkit-animation-fill-mode: forwards;*/
        /*animation-delay: 0.5s;*/
        /*-webkit-animation-delay: 0.5s;*/
        /*opacity: 0;*/
        opacity: 1;

        animation:myfirst 1.1s ease-out;
        animation-delay:1s;
        animation-fill-mode:both;
        -moz-animation:myfirst 1.1s ease-out; /* Firefox */
        -moz-animation-delay:1s;
        -moz-animation-fill-mode:both;
        -webkit-animation:myfirst 1.1s ease-out; /* Safari and Chrome */
        -webkit-animation-delay:1s;
        -webkit-animation-fill-mode:both;
        -o-animation:myfirst 1.1s ease-out; /* Opera */
        -o-animation-delay:1s;
        -o-animation-fill-mode:both;
    }
    @keyframes myfirst{
        0%{background:#ffffff;opacity: 0;width: 90px;height:0px;bottom: 55rem;left: 53%;font-size: 0;}
        28%{background:#ffffff;width: 90px;height:150px;bottom: 19rem;left: 53%;font-size: 0;}
        56%{background:#ffffff;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 53%;font-size: 0;}
        71%{background:#ffffff;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 53%;font-size: 0;}
        100%{font-size: 2rem;height:75px;width: 215px;height: 75px;}
    }
    @-moz-keyframes myfirst{
        0%{background:white;opacity: 0;width: 90px;height:0px;bottom: 55rem;left: 53%;font-size: 0;}
        28%{background:white;width: 90px;height:150px;bottom: 19rem;left: 53%;font-size: 0;}
        56%{background:white;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 53%;font-size: 0;}
        71%{background:white;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 53%;font-size: 0;}
        100%{font-size: 2rem;height:75px;width: 215px;height: 75px;}
    }

    @-webkit-keyframes myfirst{
        0%{background:white;opacity: 0;width: 90px;height:0px;bottom: 55rem;left: 53%;font-size: 0;}
        28%{background:white;width: 90px;height:150px;bottom: 19rem;left: 53%;font-size: 0;}
        56%{background:white;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 53%;font-size: 0;}
        71%{background:white;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 53%;font-size: 0;}
        100%{font-size: 2rem;height:75px;width: 215px;height: 75px;}
    }

    @-o-keyframes myfirst{
        0%{background:white;opacity: 0;width: 90px;height:0px;bottom: 55rem;left: 53%;font-size: 0;}
        28%{background:white;width: 90px;height:150px;bottom: 19rem;left: 53%;font-size: 0;}
        56%{background:white;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 53%;font-size: 0;}
        71%{background:white;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 53%;font-size: 0;}
        100%{font-size: 2rem;height:75px;width: 215px;height: 75px;}
    }

    /*@keyframes play1-6 {
        0% {
            opacity: 0;
            transform: scale(0);
            -webkit-transform: scale(0);
        }
        100% {
            opacity: 1;
            transform: scale(10, 10);
            -webkit-transform: scale(10, 10);
        }
    }*/

    #head_Publicity-inner ul li a {
        display: inline-block;
        width: 100%;
        height: 100%;
        background-size: 100% 100%;
        background-attachment: fixed;
    }

    #head_Publicity-inner ul>li:nth-of-type(1) a span:nth-of-type(1) {
        width: 444px;
        height: 48px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -79px -19px;
        margin-top: 25rem;
        -webkit-animation: play1-1 1.3s ease 1;
        animation: play1-1 1.3s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 1.2s;
        -webkit-animation-delay: 1.2s;
        opacity: 0;
        margin-left: -222px;
        left: 50%;
        /*font-size: 3.08rem;
        color: #ffffff;
        text-align: center;
        font-weight: 200;
        line-height: 2.32rem;*/
    }

    @keyframes play1-1 {
        0% {
            opacity: 0;
            transform: translateY(-100px);
            -webkit-transform: translateY(-100px);
        }
        100% {
            opacity: 1;
            transform: translateY(0px);
            -webkit-transform: translateY(0px);
        }
    }

    .head_Publicity-inner1_span2 {
        width: 365px;
        height: 24px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -112px -101px;
        margin: 30rem;
        -webkit-animation: play1-2 1s ease 1;
        animation: play1-2 1s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 1s;
        -webkit-animation-delay: 1s;
        opacity: 0;
        left: 50%;
        margin-left: -182.5px;
    }

    @keyframes play1-2 {
        0% {
            opacity: 0;
            transform: translateY(-100px);
            -webkit-transform: translateY(-100px);
        }
        100% {
            opacity: 1;
            transform: translateY(0px);
            -webkit-transform: translateY(0px);
        }
    }

    #head_Publicity-inner ul>li:nth-of-type(2) a span:nth-of-type(1) {
        width: 523px;
        height: 50px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -34px -156px;
        margin-top: 25rem;
        -webkit-animation: play1-1 1.5s ease 1;
        animation: play1-1 1.5s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 0.5s;
        -webkit-animation-delay: 0.5s;
        opacity: 0;
        left: 50%;
        margin-left: -261.5px;
        /*font-size: 3.08rem;
    color: #ffffff;
    text-align: center;
    font-weight: 200;
    line-height: 2.32rem;*/
    }

    .head_Publicity-inner2_span2 {
        width: 204px;
        height: 25px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -190px -240px;
        margin-top: 30rem;
        left: 50%;
        margin-left: -102px;
        -webkit-animation: play1-2 1s ease 1;
        animation: play1-2 1s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 0.5s;
        -webkit-animation-delay: 0.5s;
    }

    #head_Publicity-inner ul>li:nth-of-type(3) a span:nth-of-type(1) {
        width: 544px;
        height: 48px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -28px -314px;
        margin-top: 25rem;
        left: 50%;
        margin-left: -272px;
        -webkit-animation: play1-1 1.5s ease 1;
        animation: play1-1 1.5s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 0.5s;
        -webkit-animation-delay: 0.5s;
        opacity: 0;
        /*font-size: 3.08rem;
    color: #ffffff;
    text-align: center;
    font-weight: 200;
    line-height: 2.32rem;*/

    }

    .head_Publicity-inner3_span2 {
        width: 252px;
        height: 25px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -158px -400px;
        margin-top: 30rem;
        left: 50%;
        margin-left: -126px;
        -webkit-animation: play1-2 2s ease 1;
        animation: play1-2 2s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 0.5s;
        -webkit-animation-delay: 0.5s;
    }

    .head_Publicity-inner1_span3 {
        width: 80px;
        height: 30px;
        display: block;
        position: absolute;
        left: 45%;
        top: 300px;
        background-color: #ffffff;
        -webkit-animation: play1-5 1s ease 1;
        animation: play1-5 1s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
    }


    /**/

    @keyframes play1-5 {
        0% {
            top: 0;
            width: 80px;
            height: 60px;
            opacity: 1;
        }
        50% {
            top: 300px;
            width: 80px;
            height: 7.5px;
            opacity: 1;
        }
        100% {
            top: 539px;
            width: 215px;
            height: 75px;
            opacity: 1;
            background: url("../image/Lockwit_web/lockwit_zjm.png");
        }
    }

    #head_Publicity-left,
    #head_Publicity-right {
        position: absolute;
        top: 197px;
        display: none;
        height: 94px;
        width: 52px;
        /*background-color: rgba(0, 0, 0, 0.2);*/
        color: white;
        font-size: 20px;
        text-align: center;
        line-height: 60px;
        z-index: 1;
        cursor: none;
    }

    #head_Publicity-right {
        right: 0;
    }

    .items {
        position: absolute;
        display: inline-block;
        bottom: 5px;
        height: 20px;
        width: 100%;
        text-align: center;
        top: 300px;
    }


    /*.item{*/


    /*display: inline-block;*/


    /*width: 20px;*/


    /*height: 20px;*/


    /*background-color: #666666;*/


    /*border-radius: 10px;*/


    /*color: white;*/


    /*}*/


    /*.item:hover{*/


    /*background-color: red;*/


    /*}*/


    /*.item-selected{*/


    /*display: inline-block;*/


    /*width: 20px;*/


    /*height: 20px;*/


    /*background-color: red;*/


    /*border-radius: 10px;*/


    /*color: white;*/


    /*}*/


    /*------------------------------content--------------------------------*/

    .content {
        width: 100%;
        display: inline-block;
        position: absolute;
        float: left;
        top: 897px;
        z-index: 6;
    }

    .Content_Introduce {
        width: 100%;
        height: 587px;
        background-color: #ffffff;
        position: relative;
        float: left;
    }

    .Content_Introduce_n {
        width: 69rem;
        height: 75%;
        display: block;
        margin: 0 auto;
        position: relative;
        top: 5rem;
    }

    .Content_Introduce_n h1 {
        color: #1cb7e3;
        font-weight: 500;
        font-size: 24px;
        font-family: "Microsoft YaHei UI";
    }

    .Content_Introduce_n p {
        padding-top: 1rem;
        font-size: 14px;
        line-height: 2rem;
        margin-top:0;
    }

    .Content_Introduce_n p:nth-of-type(1) {
        color: #777777;
        font-size: 16px;
        padding: 0;
        margin-top: -1rem;
    }


    /*------------------------------------------------------------------------第二个轮播图---------------------------*/

    .Content_Product {
        width: 100%;
        height: 965px;
        display: inline-block;
        position: relative;
        float: left;
        background-color: #000000;
        overflow: hidden;
    }

    #canvas {
        display: block;
        position: absolute;
        width: 100%;
        height: 100%;
        float: left;
        top: 0;
    }


    /*-----------图---------------*/

    .swiper-container {
        width: 25%;
        height: 75%;
        position: relative;
        float: left;
        left: 15%;
        top: 58px;
        min-width: 415px;
        min-height: 723.75px;
    }

    .swiper-slide {
        text-align: center;
        font-size: 18px;
        /*background: #fff;*/
        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
    }

    .Content_Product-cont {
        display: block;
        position: absolute;
        float: left;
        left: 50%;
        top: 58px;
    }
    .swiper-slide img{
        width: 100%;
        height: 100%;
    }

    /*content的第三块*/

    .Content_Technical {
        width: 100%;
        min-width: 1200px;
        height: 603px;
        display: block;
        position: relative;
        float: left;
        background: url("../image/Lockwit_web/bg_4.jpg");
        background-size: 100% 100%;
        background-attachment: fixed;
        /*overflow: scroll;*/
    }

    .Content_Technical_biao {
        width: 386px;
        height: 156px;
        position: relative;
        display: inline-block;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -33px -10px;
        margin: 4rem 50rem;
    }

    .Content_Technical_ques {
        width: 80%;
        height: 306px;
        display: block;
        position: relative;
        float: left;
        left: 10%;
        margin-top: -1rem;
        color: #6e6e6e;
    }

    .Content_Technical_ques a {
        width: 200px;
        height: 234px;
        display: block;
        float: left;
        margin-left: 85px;
        margin-top: 44px;
        text-decoration: none;
    }


    /*--------------------------1----------------------*/

    .Content_Technical_ques a>span {
        width: 136px;
        height: 136px;
        display: block;
        float: left;
        position: relative;
    }

    .Content_Technical_ques a:nth-of-type(1)>span {
        width: 136px;
        height: 136px;
        display: block;
        margin: 1rem 2rem;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -160px -181px;

    }


    .Content_Technical_ques a:nth-of-type(1)>span:hover {
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: 0 -179px;
    }


    /*--------------------------2----------------------*/

    .Content_Technical_ques a:nth-of-type(2)>span {
        width: 136px;
        height: 136px;
        display: block;
        margin: 1rem 2rem;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -156px -351px;
    }

    .Content_Technical_ques a:nth-of-type(2)>span:hover {
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: 0 -351px;
    }


    /*--------------------------3----------------------*/

    .Content_Technical_ques a:nth-of-type(3)>span {
        width: 136px;
        height: 136px;
        display: block;
        margin: 1rem 2rem;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -156px -499px;
    }

    .Content_Technical_ques a:nth-of-type(3)>span:hover {
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: 0 -499px;
    }


    /*--------------------------4----------------------*/

    .Content_Technical_ques a:nth-of-type(4)>span {
        width: 136px;
        height: 136px;
        display: block;
        margin: 1rem 2rem;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -153px -644px;
    }

    .Content_Technical_ques a:nth-of-type(4)>span:hover {
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: 0 -644px;
    }


    /*--------------------------5----------------------*/

    .Content_Technical_ques a:nth-of-type(5)>span {
        width: 136px;
        height: 136px;
        display: block;
        margin: 1rem 2rem;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -153px -787px;
    }

    .Content_Technical_ques a:nth-of-type(5)>span:hover {
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -5px -787px;
    }

    .Content_Technical_ques a>span>h3 {
        width: 123px;
        height: 49px;
        display: block;
        position: relative;
        float: left;
        margin: 175px 30px;
    }


    /*------------------------------------------------------底部---------------------------------------------*/

    .footer {
        width: 100%;
        height: 450px;
        display: inline-block;
        position: relative;
        float: left;
        z-index: 7;
        background-color: #ffffff;
        /*background: url("../image/Lockwit_web/map.jpg");*/
        /*background-attachment: fixed;*/
    }

    .footer span:nth-of-type(1) {
        width: 23.5rem;
        height: 22.93rem;
        position: relative;
        display: block;
        left: 15%;
        margin-top: 75px;
    }

    .footer span:nth-of-type(1) h3 {
        font-weight: 500;
    }

    .footer span:nth-of-type(1) input {
        width: 310px;
        height: 31px;
        border: 1px solid #dde2ed;
        padding: 0;
        margin-top: 1rem;
    }

    .footer span:nth-of-type(1) textarea {
        width: 22.14rem;
        height: 8rem;
        border: 1px solid #dde2ed;
        padding: 0;
        margin-top: 1rem;
        resize: none;
    }

    .footer span:nth-of-type(1) button {
        width: 84px;
        height: 31px;
        background-color: #08c743;
        padding: 0;
        margin-top: 1rem;
        border: 0;
        color: #ffffff;
        font-weight: 600;
        font-size: 18px;
    }

    .footer span:nth-of-type(2) {
        width: 22.93rem;
        height: 21.07rem;
        position: absolute;
        display: inline-block;
        /*margin: 75px 400px;*/
        float: left;
        top: 75px;
        left: 50%;
        min-left:350px;
    }

    .footer span:nth-of-type(2) h6 {
        font-weight: 300;
        margin: 0.5rem;
    }

    .footer span:nth-of-type(2) h3 {
        font-weight: 500;
        margin: 0.5rem;
    }

    .footer span:nth-of-type(2) p {
        font-size: 13px;
        font-weight: 400;
        margin: 0.6rem;
        display: block;
        margin-top: 1rem;
    }

    .footer span:nth-of-type(2) p:nth-of-type(1) {
        display: block;
        margin-top: 2.2rem;
    }

    .footer span:nth-of-type(2) p:nth-of-type(5) {
        display: block;
        font-size: 14px;
        margin-top: 2.8rem;
    }

    .footer span:nth-of-type(3) {
        width: 156px;
        height: 201px;
        position: absolute;
        display: block;
        left: 80%;
        top: 75px;
    }

    .footer span:nth-of-type(3) h3 {
        font-weight: 500;
        margin: 0.5rem;
    }

    .footer span:nth-of-type(3) img {
        font-weight: 500;
        margin-top: 1.5rem;
        display: block;
    }

    .Content_Map {
        width: 100%;
        height: 495px;
        display: inline-block;
        position: relative;
        background: url("../image/Lockwit_web/map.jpg");
        background-size:100% 100% ;
    }

    .imga,.imgb,.imgc,.imgd,.imge {
        width: 250px;
        position: absolute;
        left: 49%;
        margin-top: 72px;

    }

    .img-none{
        display: none;

    }
    .cont_img-none{
        display: none;

    }
}
@media (min-width: 1670px) and (max-width: 1800px) {
    .chromeframe {
        margin: 0.2em 0;
        background: #ccc;
        color: #000;
        padding: 0.2em 0;
    }

    #loader-wrapper {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 999999;
    }

    #loader {
        display: block;
        position: relative;
        left: 50%;
        top: 50%;
        width: 150px;
        height: 150px;
        margin: -75px 0 0 -75px;
        border-radius: 50%;
        border: 3px solid transparent;
        /* COLOR 1 */
        border-top-color: #FFF;
        -webkit-animation: spin 2s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -ms-animation: spin 2s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -moz-animation: spin 2s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -o-animation: spin 2s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        animation: spin 2s linear infinite;
        /* Chrome, Firefox 16+, IE 10+, Opera */
        z-index: 1001;
    }

    #loader:before {
        content: "";
        position: absolute;
        top: 5px;
        left: 5px;
        right: 5px;
        bottom: 5px;
        border-radius: 50%;
        border: 3px solid transparent;
        /* COLOR 2 */
        border-top-color: #FFF;
        -webkit-animation: spin 3s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -moz-animation: spin 3s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -o-animation: spin 3s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -ms-animation: spin 3s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        animation: spin 3s linear infinite;
        /* Chrome, Firefox 16+, IE 10+, Opera */
    }

    #loader:after {
        content: "";
        position: absolute;
        top: 15px;
        left: 15px;
        right: 15px;
        bottom: 15px;
        border-radius: 50%;
        border: 3px solid transparent;
        border-top-color: #FFF;
        /* COLOR 3 */
        -moz-animation: spin 1.5s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -o-animation: spin 1.5s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -ms-animation: spin 1.5s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -webkit-animation: spin 1.5s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        animation: spin 1.5s linear infinite;
        /* Chrome, Firefox 16+, IE 10+, Opera */
    }

    @-webkit-keyframes spin {
        0% {
            -webkit-transform: rotate(0deg);
            /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(0deg);
            /* IE 9 */
            transform: rotate(0deg);
            /* Firefox 16+, IE 10+, Opera */
        }
        100% {
            -webkit-transform: rotate(360deg);
            /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(360deg);
            /* IE 9 */
            transform: rotate(360deg);
            /* Firefox 16+, IE 10+, Opera */
        }
    }

    @keyframes spin {
        0% {
            -webkit-transform: rotate(0deg);
            /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(0deg);
            /* IE 9 */
            transform: rotate(0deg);
            /* Firefox 16+, IE 10+, Opera */
        }
        100% {
            -webkit-transform: rotate(360deg);
            /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(360deg);
            /* IE 9 */
            transform: rotate(360deg);
            /* Firefox 16+, IE 10+, Opera */
        }
    }

    #loader-wrapper .loader-section {
        position: fixed;
        top: 0;
        width: 51%;
        height: 100%;
        background: #000000;
        /* Old browsers */
        z-index: 1000;
        -webkit-transform: translateX(0);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateX(0);
        /* IE 9 */
        transform: translateX(0);
        /* Firefox 16+, IE 10+, Opera */
    }

    #loader-wrapper .loader-section.section-left {
        left: 0;
    }

    #loader-wrapper .loader-section.section-right {
        right: 0;
    }


    /* Loaded */

    .loaded #loader-wrapper .loader-section.section-left {
        -webkit-transform: translateX(-100%);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateX(-100%);
        /* IE 9 */
        transform: translateX(-100%);
        /* Firefox 16+, IE 10+, Opera */
        -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
        transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
    }

    .loaded #loader-wrapper .loader-section.section-right {
        -webkit-transform: translateX(100%);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateX(100%);
        /* IE 9 */
        transform: translateX(100%);
        /* Firefox 16+, IE 10+, Opera */
        -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
        transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
    }

    .loaded #loader {
        opacity: 0;
        -webkit-transition: all 0.3s ease-out;
        transition: all 0.3s ease-out;
    }

    .loaded #loader-wrapper {
        visibility: hidden;
        -webkit-transform: translateY(-100%);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateY(-100%);
        /* IE 9 */
        transform: translateY(-100%);
        /* Firefox 16+, IE 10+, Opera */
        -webkit-transition: all 0.3s 1s ease-out;
        transition: all 0.3s 1s ease-out;
    }


    /* JavaScript Turned Off */

    .no-js #loader-wrapper {
        display: none;
    }

    .no-js h1 {
        color: #222222;
    }

    #loader-wrapper .load_title {
        font-family: 'Open Sans';
        color: #FFF;
        font-size: 19px;
        width: 100%;
        text-align: center;
        z-index: 9999999999999;
        position: absolute;
        top: 60%;
        opacity: 1;
        line-height: 30px;
    }

    #loader-wrapper .load_title span {
        font-weight: normal;
        font-style: italic;
        font-size: 13px;
        color: #FFF;
        opacity: 0.5;
    }


    /*--------------------------------------------导航栏-----------------------------*/

    .head {
        width: 100%;
        display: block;
        position: relative;
        float: left;
        z-index: 100;
        min-width: 1720px;
    }

    .head_nav {
        width: 100%;
        height: 120px;
        display: block;
        position: fixed;
        float: left;
        /*background-color: #000000;*/
        z-index: 1;
    }

    .head_nav_more {
        width: 100%;
        height: 100%;
        display: none;
        position: absolute;
        float: left;
        background-color: #ffffff;
        z-index: 10;
        min-width: 1720px;
    }

    .nav_icon {
        display: block;
        position: relative;
        float: right;
        padding: 2.8rem 3.3rem;
        z-index: 2;
    }

    .head_nav_more_one {
        width: 70%;
        height: 100%;
        /*background-color: #000000;*/
        position: relative;
        display: block;
        float: left;
    }

    .head_nav_more_one a {
        display: block;
        text-decoration: none;
    }

    .head_nav_more_one>ul>li {
        width: 140px;
        float: left;
        text-align: center;
        margin-top: 1.4rem;
        display: block;
        position: relative;
    }

    .head_nav_more_one>ul>li>a {
        width: 100%;
        height: 73px;
    }

    .head_nav_more_one li ul.sub-menu {
        list-style: none;
        display: none;
        padding-left: 0 !important;
    }

    .sub-menu {
        background-color: #ffffff;
    }

    .sub-menu li {
        height: 2.2rem;
        color: #ffffff;
        background-color: #ffffff;
    }

    .sub-menu li>a {
        color: #575757;
        text-decoration: none;
    }

    .sub-menu li:hover {
        background-color: #ee9d4b;
    }

    .sub-menu li:hover a {
        color: white;
        text-decoration: none;
    }

    .head_nav_more_one>ul {
        margin-left: 10rem;
        display: block;
        list-style: none;
    }

    .head_nav_more_one_Home,
    .head_nav_more_one_Programming,
    .head_nav_more_one_ji,
    .head_nav_more_one_lian {
        width: 100%;
        height: 73px;
        display: block;
    }


    /*.head_nav_more_one_Home{*/


    /*background: url("../image/Lockwit_web/nav_1 .png");*/


    /*}*/


    /*.head_nav_more_one_Programming{*/


    /*background: url("../image/Lockwit_web/nav_2.png");*/


    /*}*/


    /*.head_nav_more_one_ji{*/


    /*background: url("../image/Lockwit_web/nav_3.png");*/


    /*}*/


    /*.head_nav_more_one_lian{*/


    /*background: url("../image/Lockwit_web/nav_4.png");*/


    /*}*/

    a img {
        border: 0
    }

    ul,
    ol,
    li {
        list-style-type: none;
        vertical-align: 0
    }

    a {
        outline-style: none;
        color: #535353;
        text-decoration: none
    }

    a:hover {
        /*color: #D40000;*/
        text-decoration: none
    }

    .clear {
        height: 0;
        overflow: hidden;
        clear: both
    }

    header {
        height: 100px;
    }

    input {
        border: none;
    }

    .button {
        display: inline-block;
        zoom: 1;
        *display: inline;
        vertical-align: baseline;
        margin: 0 2px;
        outline: none;
        cursor: pointer;
        text-align: center;
        text-decoration: none;
        font: 14px/100% Arial, Helvetica, sans-serif;
        padding: 0.25em 0.6em 0.3em;
        /*text-shadow: 0 1px 1px rgba(0, 0, 0, .3);*/
        -webkit-border-radius: .5em;
        -moz-border-radius: .5em;
        border-radius: .5em;
        /*-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);*/
        /*-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);*/
        /*box-shadow: 0 1px 2px rgba(0, 0, 0, .2);*/
    }


    /*restCSS结束，应用特效时，以上样式可删除*/


    /* 需要的css样式 */

    .nav {
        width: 970px;
        margin: 0 auto;
        text-align: center;
    }

    .menu,
    .menu ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .menu {
        height: 58px;
        margin-top: 50px;
    }

    .menu li {
        background-color: #ffffff;
        /*border-bottom: 2px solid #181818;*/
        /*border-top: 2px solid #303030;*/
        min-width: 160px;
        /*max-width: 160px;*/
        font-family: "Adobe Caslon Pro";
    }

    .menu>li {
        display: block;
        float: left;
        position: relative;
    }

    .menu>li:first-child {
        border-radius: 5px 0 0;
    }

    .menu a {
        border-left: 3px solid rgba(0, 0, 0, 0);
        /*background: url("../img/back.jpg");*/
        color: #808080;
        display: block;
        font-size: 18px;
        line-height: 54px;
        padding: 0 25px;
        text-decoration: none;
        text-transform: uppercase;
    }

    .menu li:hover {
        /*background-color: #1c1c1c;*/
        /*background: -moz-linear-gradient(#1c1c1c, #1b1b1b);*/
        /*background: -ms-linear-gradient(#1c1c1c, #1b1b1b);*/
        /*background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #1c1c1c), color-stop(100%, #1b1b1b));*/
        /*background: -webkit-linear-gradient(#1c1c1c, #1b1b1b);*/
        /*background: -o-linear-gradient(#1c1c1c, #1b1b1b);*/
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1c1c1c', endColorstr='#1b1b1b');
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#1c1c1c', endColorstr='#1b1b1b')";
        /*background: linear-gradient(#1c1c1c, #1b1b1b);*/
        /*border-bottom: 2px solid #222222;*/
        /*border-top: 2px solid #1B1B1B;*/
        /*改变加深父元素的背景*/
    }

    .menu li:hover>a {
        border-radius: 5px 0 0 0;
        /*border-left: 3px solid #C4302B;*/
        color: #00b6ff;
    }

    .submenu {
        left: 0;
        max-height: 0;
        position: absolute;
        top: 100%;
        z-index: 0;
        -webkit-perspective: 400px;
        -moz-perspective: 400px;
        -ms-perspective: 400px;
        -o-perspective: 400px;
        perspective: 400px;
    }

    .submenu li {
        opacity: 0;
        -webkit-transform: rotateY(90deg);
        -moz-transform: rotateY(90deg);
        -ms-transform: rotateY(90deg);
        -o-transform: rotateY(90deg);
        transform: rotateY(90deg);
        -webkit-transition: opacity .4s, -webkit-transform .5s;
        -moz-transition: opacity .4s, -moz-transform .5s;
        -ms-transition: opacity .4s, -ms-transform .5s;
        -o-transition: opacity .4s, -o-transform .5s;
        transition: opacity .4s, transform .5s;
        /*实现下拉菜单螺旋淡出*/
    }

    .menu .submenu li:hover a {
        /*border-left: 3px solid #454545;*/
        border-radius: 0;
        /*color: #ffffff;*/
    }

    .menu>li:hover .submenu,
    .menu>li:focus .submenu {
        max-height: 2000px;
        z-index: 10;
    }

    .menu>li:hover .submenu li,
    .menu>li:focus .submenu li {
        opacity: 1;
        -webkit-transform: none;
        -moz-transform: none;
        -ms-transform: none;
        -o-transform: none;
        transform: none;
    }


    /*动画递进的时间 实现一个个螺旋子菜单*/

    .menu li:hover .submenu li:nth-child(1) {
        -webkit-transition-delay: 0s;
        -moz-transition-delay: 0s;
        -ms-transition-delay: 0s;
        -o-transition-delay: 0s;
        transition-delay: 0s;
    }

    .menu li:hover .submenu li:nth-child(2) {
        -webkit-transition-delay: 50ms;
        -moz-transition-delay: 50ms;
        -ms-transition-delay: 50ms;
        -o-transition-delay: 50ms;
        transition-delay: 50ms;
    }

    .menu li:hover .submenu li:nth-child(3) {
        -webkit-transition-delay: 100ms;
        -moz-transition-delay: 100ms;
        -ms-transition-delay: 100ms;
        -o-transition-delay: 100ms;
        transition-delay: 100ms;
    }

    .menu li:hover .submenu li:nth-child(4) {
        -webkit-transition-delay: 150ms;
        -moz-transition-delay: 150ms;
        -ms-transition-delay: 150ms;
        -o-transition-delay: 150ms;
        transition-delay: 150ms;
    }

    .menu li:hover .submenu li:nth-child(5) {
        -webkit-transition-delay: 200ms;
        -moz-transition-delay: 200ms;
        -ms-transition-delay: 200ms;
        -o-transition-delay: 200ms;
        transition-delay: 200ms;
    }

    .menu li:hover .submenu li:nth-child(6) {
        -webkit-transition-delay: 250ms;
        -moz-transition-delay: 250ms;
        -ms-transition-delay: 250ms;
        -o-transition-delay: 250ms;
        transition-delay: 250ms;
    }

    .menu li:hover .submenu li:nth-child(7) {
        -webkit-transition-delay: 300ms;
        -moz-transition-delay: 300ms;
        -ms-transition-delay: 300ms;
        -ms-transition-delay: 300ms;
        -o-transition-delay: 300ms;
        transition-delay: 300ms;
    }

    .menu li:hover .submenu li:nth-child(8) {
        -webkit-transition-delay: 350ms;
        -moz-transition-delay: 350ms;
        -ms-transition-delay: 350ms;
        -o-transition-delay: 350ms;
        transition-delay: 350ms;
    }

    .submenu li:nth-child(1) {
        -webkit-transition-delay: 350ms;
        -moz-transition-delay: 350ms;
        -ms-transition-delay: 350ms;
        -o-transition-delay: 350ms;
        transition-delay: 350ms;
    }

    .submenu li:nth-child(2) {
        -webkit-transition-delay: 300ms;
        -moz-transition-delay: 300ms;
        -ms-transition-delay: 300ms;
        -o-transition-delay: 300ms;
        transition-delay: 300ms;
    }

    .submenu li:nth-child(3) {
        -webkit-transition-delay: 250ms;
        -moz-transition-delay: 250ms;
        -ms-transition-delay: 250ms;
        -o-transition-delay: 250ms;
        transition-delay: 250ms;
    }

    .submenu li:nth-child(4) {
        -webkit-transition-delay: 200ms;
        -moz-transition-delay: 200ms;
        -ms-transition-delay: 200ms;
        -o-transition-delay: 200ms;
        transition-delay: 200ms;
    }

    .submenu li:nth-child(5) {
        -webkit-transition-delay: 150ms;
        -moz-transition-delay: 150ms;
        -ms-transition-delay: 150ms;
        -o-transition-delay: 150ms;
        transition-delay: 150ms;
    }

    .submenu li:nth-child(6) {
        -webkit-transition-delay: 100ms;
        -moz-transition-delay: 100ms;
        -ms-transition-delay: 100ms;
        -o-transition-delay: 100ms;
        transition-delay: 100ms;
    }

    .submenu li:nth-child(7) {
        -webkit-transition-delay: 50ms;
        -moz-transition-delay: 50ms;
        -ms-transition-delay: 50ms;
        -o-transition-delay: 50ms;
        transition-delay: 50ms;
    }

    .submenu li:nth-child(8) {
        -webkit-transition-delay: 0s;
        -moz-transition-delay: 0s;
        -ms-transition-delay: 0s;
        -o-transition-delay: 0s;
        transition-delay: 0s;
    }
    .menu_znms{
        background: url("../image/Lockwit_web/nav_2.png") no-repeat 15px -15px;

    }

    /*-------------------------------------轮播图-------------------------------------*/

    #head_Publicity {
        float: left;
        margin: 0 auto;
        display: inline-block;
        position: absolute;
        width: 100%;
        /*height: 897px;*/
        /*margin-top: 120px;*/
        z-index: -1;
    }

    .head_Publicity_animation_1 {
        width: 32px;
        height: 20px;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -268px -440px;
        position: absolute;
        bottom: 15px;
        left:50%;
        -webkit-animation: play1-4 2s linear infinite;
        animation: play1-4 2s linear infinite;
    }

    @keyframes play1-4 {
        0% {
            transform: translateY(0);
            -webkit-transform: translateY(0);
            opacity: 1;
        }
        100% {
            transform: translateY(25px);
            -webkit-transform: translateY(25px);
            opacity: 0;
        }
    }

    #head_Publicity-inner {
        position: relative;
        height: 100%;
        overflow: hidden;
    }

    #head_Publicity-inner ul {
        margin: 0;
        padding: 0;
        list-style-type: none;
    }

    #head_Publicity-inner ul li {
        display: inline-block;
        width: 100%;
        height: 100%;
        z-index: -1;
        position: absolute;
        top: 0;
        min-height: 777px;
        min-width: 1720px;
    }

    #head_Publicity-inner ul>li:nth-of-type(1) {
        z-index: -1;
    }

    #head_Publicity-inner ul>li:nth-of-type(2) {
        z-index: -2;
    }

    #head_Publicity-inner ul>li:nth-of-type(3) {
        z-index: -3;
    }

    #head_Publicity-inner ul>li:nth-of-type(1) a {
        display: inline-block;
        position: absolute;
    }

    #head_Publicity-inner ul li a {
        display: inline-block;
        width: 100%;
        height: 100%;
        background-size: 100% 100%;
        background-attachment: fixed;
    }

    .head_Publicity-inner-left,
    .head_Publicity-inner-right {
        width: 35%;
        height: 70%;
        display: block;
        position: absolute;
        bottom: 0px;
        top: 20%;
        cursor: none;
    }

    .head_Publicity-inner-right {
        right: 0;
    }

    .lockwit_zjm {
        width: 215px;
        height: 75px;
        /*width:21.5px;*/
        /*height:7.5px;*/
        display: inline-block;
        position: absolute;
        bottom: 12rem;
        left: 50%;
        margin-left: -107.5px;
        border:2px solid #ffffff ;
        font-size: 2rem;
        text-align: center;
        line-height: 4.5rem;
        color: #ffffff;
        /*padding: 34rem 59rem;*/
        /*-webkit-animation:play1-6 1.5s ease 1;*/
        /*animation:play1-6 1.5s ease 1;*/
        /*animation-fill-mode:forwards;*/
        /*-webkit-animation-fill-mode: forwards;*/
        /*animation-delay: 0.5s;*/
        /*-webkit-animation-delay: 0.5s;*/
        /*opacity: 0;*/
        opacity: 1;

        animation:myfirst 1.1s ease-out;
        animation-delay:1s;
        animation-fill-mode:both;
        -moz-animation:myfirst 1.1s ease-out; /* Firefox */
        -moz-animation-delay:1s;
        -moz-animation-fill-mode:both;
        -webkit-animation:myfirst 1.1s ease-out; /* Safari and Chrome */
        -webkit-animation-delay:1s;
        -webkit-animation-fill-mode:both;
        -o-animation:myfirst 1.1s ease-out; /* Opera */
        -o-animation-delay:1s;
        -o-animation-fill-mode:both;
    }
    @keyframes myfirst{
        0%{background:#ffffff;opacity: 0;width: 90px;height:0px;bottom: 55rem;left: 53%;font-size: 0;}
        28%{background:#ffffff;width: 90px;height:150px;bottom: 19rem;left: 53%;font-size: 0;}
        56%{background:#ffffff;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 53%;font-size: 0;}
        71%{background:#ffffff;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 53%;font-size: 0;}
        100%{font-size: 2rem;height:75px;width: 215px;height: 75px;}
    }
    @-moz-keyframes myfirst{
        0%{background:white;opacity: 0;width: 90px;height:0px;bottom: 55rem;left: 53%;font-size: 0;}
        28%{background:white;width: 90px;height:150px;bottom: 19rem;left: 53%;font-size: 0;}
        56%{background:white;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 53%;font-size: 0;}
        71%{background:white;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 53%;font-size: 0;}
        100%{font-size: 2rem;height:75px;width: 215px;height: 75px;}
    }

    @-webkit-keyframes myfirst{
        0%{background:white;opacity: 0;width: 90px;height:0px;bottom: 55rem;left: 53%;font-size: 0;}
        28%{background:white;width: 90px;height:150px;bottom: 19rem;left: 53%;font-size: 0;}
        56%{background:white;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 53%;font-size: 0;}
        71%{background:white;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 53%;font-size: 0;}
        100%{font-size: 2rem;height:75px;width: 215px;height: 75px;}
    }

    @-o-keyframes myfirst{
        0%{background:white;opacity: 0;width: 90px;height:0px;bottom: 55rem;left: 53%;font-size: 0;}
        28%{background:white;width: 90px;height:150px;bottom: 19rem;left: 53%;font-size: 0;}
        56%{background:white;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 53%;font-size: 0;}
        71%{background:white;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 53%;font-size: 0;}
        100%{font-size: 2rem;height:75px;width: 215px;height: 75px;}
    }

    /*@keyframes play1-6 {
        0% {
            opacity: 0;
            transform: scale(0);
            -webkit-transform: scale(0);
        }
        100% {
            opacity: 1;
            transform: scale(10, 10);
            -webkit-transform: scale(10, 10);
        }
    }*/

    #head_Publicity-inner ul li a {
        display: inline-block;
        width: 100%;
        height: 100%;
        background-size: 100% 100%;
        background-attachment: fixed;
    }

    #head_Publicity-inner ul>li:nth-of-type(1) a span:nth-of-type(1) {
        width: 444px;
        height: 48px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -79px -19px;
        margin-top: 18rem;
        -webkit-animation: play1-1 1.3s ease 1;
        animation: play1-1 1.3s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 1.2s;
        -webkit-animation-delay: 1.2s;
        opacity: 0;
        margin-left: -222px;
        left: 50%;
        /*font-size: 3.08rem;
        color: #ffffff;
        text-align: center;
        font-weight: 200;
        line-height: 2.32rem;*/
    }

    @keyframes play1-1 {
        0% {
            opacity: 0;
            transform: translateY(-100px);
            -webkit-transform: translateY(-100px);
        }
        100% {
            opacity: 1;
            transform: translateY(0px);
            -webkit-transform: translateY(0px);
        }
    }

    .head_Publicity-inner1_span2 {
        width: 365px;
        height: 24px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -112px -101px;
        margin-top: 22rem;
        -webkit-animation: play1-2 1s ease 1;
        animation: play1-2 1s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 1s;
        -webkit-animation-delay: 1s;
        opacity: 0;
        left: 50%;
        margin-left: -182.5px;
    }

    @keyframes play1-2 {
        0% {
            opacity: 0;
            transform: translateY(-100px);
            -webkit-transform: translateY(-100px);
        }
        100% {
            opacity: 1;
            transform: translateY(0px);
            -webkit-transform: translateY(0px);
        }
    }

    #head_Publicity-inner ul>li:nth-of-type(2) a span:nth-of-type(1) {
        width: 523px;
        height: 50px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -34px -156px;
        margin-top: 18rem;
        -webkit-animation: play1-1 1.5s ease 1;
        animation: play1-1 1.5s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 0.5s;
        -webkit-animation-delay: 0.5s;
        opacity: 0;
        left: 50%;
        margin-left: -261.5px;
        /*font-size: 3.08rem;
    color: #ffffff;
    text-align: center;
    font-weight: 200;
    line-height: 2.32rem;*/
    }

    .head_Publicity-inner2_span2 {
        width: 204px;
        height: 25px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -190px -240px;
        margin-top: 22rem;
        left: 50%;
        margin-left: -102px;
        -webkit-animation: play1-2 1s ease 1;
        animation: play1-2 1s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 0.5s;
        -webkit-animation-delay: 0.5s;
    }

    #head_Publicity-inner ul>li:nth-of-type(3) a span:nth-of-type(1) {
        width: 544px;
        height: 48px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -28px -314px;
        margin-top: 18rem;
        left: 50%;
        margin-left: -272px;
        -webkit-animation: play1-1 1.5s ease 1;
        animation: play1-1 1.5s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 0.5s;
        -webkit-animation-delay: 0.5s;
        opacity: 0;
        /*font-size: 3.08rem;
    color: #ffffff;
    text-align: center;
    font-weight: 200;
    line-height: 2.32rem;*/

    }

    .head_Publicity-inner3_span2 {
        width: 252px;
        height: 25px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -158px -400px;
        margin-top: 22rem;
        left: 50%;
        margin-left: -126px;
        -webkit-animation: play1-2 2s ease 1;
        animation: play1-2 2s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 0.5s;
        -webkit-animation-delay: 0.5s;
    }

    .head_Publicity-inner1_span3 {
        width: 80px;
        height: 30px;
        display: block;
        position: absolute;
        left: 50%;
        top: 300px;
        background-color: #ffffff;
        -webkit-animation: play1-5 1s ease 1;
        animation: play1-5 1s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
    }


    /**/

    @keyframes play1-5 {
        0% {
            top: 0;
            width: 80px;
            height: 60px;
            opacity: 1;
        }
        50% {
            top: 300px;
            width: 80px;
            height: 7.5px;
            opacity: 1;
        }
        100% {
            top: 539px;
            width: 215px;
            height: 75px;
            opacity: 1;
            background: url("../image/Lockwit_web/lockwit_zjm.png");
        }
    }

    #head_Publicity-left,
    #head_Publicity-right {
        position: absolute;
        top: 197px;
        display: none;
        height: 94px;
        width: 52px;
        /*background-color: rgba(0, 0, 0, 0.2);*/
        color: white;
        font-size: 20px;
        text-align: center;
        line-height: 60px;
        z-index: 1;
        cursor: none;
    }

    #head_Publicity-right {
        right: 0;
    }

    .items {
        position: absolute;
        display: inline-block;
        bottom: 5px;
        height: 20px;
        width: 100%;
        text-align: center;
        top: 300px;
    }


    /*.item{*/


    /*display: inline-block;*/


    /*width: 20px;*/


    /*height: 20px;*/


    /*background-color: #666666;*/


    /*border-radius: 10px;*/


    /*color: white;*/


    /*}*/


    /*.item:hover{*/


    /*background-color: red;*/


    /*}*/


    /*.item-selected{*/


    /*display: inline-block;*/


    /*width: 20px;*/


    /*height: 20px;*/


    /*background-color: red;*/


    /*border-radius: 10px;*/


    /*color: white;*/


    /*}*/


    /*------------------------------content--------------------------------*/

    .content {
        width: 100%;
        display: inline-block;
        position: absolute;
        float: left;
        top: 897px;
        z-index: 6;
    }

    .Content_Introduce {
        width: 100%;
        height: 587px;
        background-color: #ffffff;
        position: relative;
        float: left;
    }

    .Content_Introduce_n {
        width: 69rem;
        height: 75%;
        display: block;
        margin: 0 auto;
        position: relative;
        top: 5rem;
    }

    .Content_Introduce_n h1 {
        color: #1cb7e3;
        font-weight: 500;
        font-size: 24px;
        font-family: "Microsoft YaHei UI";
    }

    .Content_Introduce_n p {
        padding-top: 1rem;
        font-size: 14px;
        line-height: 2rem;
        margin-top:0;
    }

    .Content_Introduce_n p:nth-of-type(1) {
        color: #777777;
        font-size: 16px;
        padding: 0;
        margin-top: -1rem;
    }


    /*------------------------------------------------------------------------第二个轮播图---------------------------*/

    .Content_Product {
        width: 100%;
        height: 965px;
        display: inline-block;
        position: relative;
        float: left;
        background-color: #000000;
        overflow: hidden;
    }

    #canvas {
        display: block;
        position: absolute;
        width: 100%;
        height: 100%;
        float: left;
        top: 0;
    }


    /*-----------图---------------*/

    .swiper-container {
        width: 25%;
        height: 75%;
        position: relative;
        float: left;
        left: 15%;
        top: 58px;
        min-width: 415px;
        min-height: 723.75px;
    }

    .swiper-slide {
        text-align: center;
        font-size: 18px;
        /*background: #fff;*/
        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
    }

    .Content_Product-cont {
        display: block;
        position: absolute;
        float: left;
        left: 50%;
        top: 58px;
    }
    .swiper-slide img{
        width: 100%;
        height: 100%;
    }

    /*content的第三块*/

    .Content_Technical {
        width: 100%;
        min-width: 1200px;
        height: 603px;
        display: block;
        position: relative;
        float: left;
        background: url("../image/Lockwit_web/bg_4.jpg");
        background-size: 100% 100%;
        background-attachment: fixed;
        /*overflow: scroll;*/
    }

    .Content_Technical_biao {
        width: 386px;
        height: 156px;
        position: relative;
        display: inline-block;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -33px -10px;
        margin: 4rem 42rem;
    }

    .Content_Technical_ques {
        width: 80%;
        height: 306px;
        display: block;
        position: relative;
        float: left;
        left: 10%;
        margin-top: -1rem;
        color: #6e6e6e;
    }

    .Content_Technical_ques a {
        width: 120px;
        height: 234px;
        display: block;
        float: left;
        margin-left: 125px;
        margin-top: 44px;
        text-decoration: none;
    }


    /*--------------------------1----------------------*/

    .Content_Technical_ques a>span {
        width: 103px;
        height: 103px;
        display: block;
        float: left;
        position: relative;
    }

    .Content_Technical_ques a:nth-of-type(1)>span {

        display: block;
        margin: 0.5rem 1rem;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -124px -135px;
        background-size: 320px 754px;

    }

    .Content_Technical_ques a:nth-of-type(1)>span:hover {
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: 0px -136px;
        background-size: 320px 754px;
    }


    /*--------------------------2----------------------*/

    .Content_Technical_ques a:nth-of-type(2)>span {
        display: block;
        margin: 0.5rem 1rem;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -124px -266px;
        background-size: 320px 754px;
    }

    .Content_Technical_ques a:nth-of-type(2)>span:hover {
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: 0 -265px;
        background-size: 320px 754px;
    }


    /*--------------------------3----------------------*/

    .Content_Technical_ques a:nth-of-type(3)>span {
        display: block;
        margin: 0.5rem 1rem;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -122px -378px;
        background-size: 320px 754px;
    }

    .Content_Technical_ques a:nth-of-type(3)>span:hover {
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: 0 -378px;
        background-size: 320px 754px;
    }


    /*--------------------------4----------------------*/

    .Content_Technical_ques a:nth-of-type(4)>span {
        display: block;
        margin: 0.5rem 1rem;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -119px -488px;
        background-size: 320px 754px;
    }

    .Content_Technical_ques a:nth-of-type(4)>span:hover {
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: 0 -488px;
        background-size: 320px 754px;
    }


    /*--------------------------5----------------------*/

    .Content_Technical_ques a:nth-of-type(5)>span {
        display: block;
        margin: 0.5rem 1rem;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -119px -592px;
        background-size: 320px 754px;
    }

    .Content_Technical_ques a:nth-of-type(5)>span:hover {
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -6px -594px;
        background-size: 320px 754px;
    }
    .Content_Technical_ques a>span>h3 {
        width: 123px;
        height: 49px;
        display: block;
        position: relative;
        float: left;
        margin: 9rem 1rem;
    }


    /*------------------------------------------------------底部---------------------------------------------*/

    .footer {
        width: 100%;
        height: 450px;
        display: inline-block;
        position: relative;
        float: left;
        z-index: 7;
        background-color: #ffffff;
        /*background: url("../image/Lockwit_web/map.jpg");*/
        /*background-attachment: fixed;*/
    }

    .footer span:nth-of-type(1) {
        width: 23.5rem;
        height: 22.93rem;
        position: relative;
        display: block;
        left: 15%;
        margin-top: 75px;
    }

    .footer span:nth-of-type(1) h3 {
        font-weight: 500;
    }

    .footer span:nth-of-type(1) input {
        width: 310px;
        height: 31px;
        border: 1px solid #dde2ed;
        padding: 0;
        margin-top: 1rem;
    }

    .footer span:nth-of-type(1) textarea {
        width: 22.14rem;
        height: 8rem;
        border: 1px solid #dde2ed;
        padding: 0;
        margin-top: 1rem;
        resize: none;
    }

    .footer span:nth-of-type(1) button {
        width: 84px;
        height: 31px;
        background-color: #08c743;
        padding: 0;
        margin-top: 1rem;
        border: 0;
        color: #ffffff;
        font-weight: 600;
        font-size: 18px;
    }

    .footer span:nth-of-type(2) {
        width: 22.93rem;
        height: 21.07rem;
        position: absolute;
        display: inline-block;
        /*margin: 75px 400px;*/
        float: left;
        top: 75px;
        left: 50%;
        min-left:350px;
    }

    .footer span:nth-of-type(2) h6 {
        font-weight: 300;
        margin: 0.5rem;
    }

    .footer span:nth-of-type(2) h3 {
        font-weight: 500;
        margin: 0.5rem;
    }

    .footer span:nth-of-type(2) p {
        font-size: 13px;
        font-weight: 400;
        margin: 0.6rem;
        display: block;
        margin-top: 1rem;
    }

    .footer span:nth-of-type(2) p:nth-of-type(1) {
        display: block;
        margin-top: 2.2rem;
    }

    .footer span:nth-of-type(2) p:nth-of-type(5) {
        display: block;
        font-size: 14px;
        margin-top: 2.8rem;
    }

    .footer span:nth-of-type(3) {
        width: 156px;
        height: 201px;
        position: absolute;
        display: block;
        left: 80%;
        top: 75px;
    }

    .footer span:nth-of-type(3) h3 {
        font-weight: 500;
        margin: 0.5rem;
    }

    .footer span:nth-of-type(3) img {
        font-weight: 500;
        margin-top: 1.5rem;
        display: block;
    }

    .Content_Map {
        width: 100%;
        height: 495px;
        display: inline-block;
        position: relative;
        background: url("../image/Lockwit_web/map.jpg");
        background-size:100% 100% ;
    }

    .imga,.imgb,.imgc,.imgd,.imge {
        width: 250px;
        position: absolute;
        left: 49%;
        margin-top: 72px;

    }

    .img-none{
        display: none;

    }
    .cont_img-none{
        display: none;

    }
}
@media (min-width: 1280px) and (max-width: 1670px) {
    .chromeframe {
        margin: 0.2em 0;
        background: #ccc;
        color: #000;
        padding: 0.2em 0;
    }

    #loader-wrapper {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 999999;
    }

    #loader {
        display: block;
        position: relative;
        left: 50%;
        top: 50%;
        width: 150px;
        height: 150px;
        margin: -75px 0 0 -75px;
        border-radius: 50%;
        border: 3px solid transparent;
        /* COLOR 1 */
        border-top-color: #FFF;
        -webkit-animation: spin 2s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -ms-animation: spin 2s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -moz-animation: spin 2s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -o-animation: spin 2s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        animation: spin 2s linear infinite;
        /* Chrome, Firefox 16+, IE 10+, Opera */
        z-index: 1001;
    }

    #loader:before {
        content: "";
        position: absolute;
        top: 5px;
        left: 5px;
        right: 5px;
        bottom: 5px;
        border-radius: 50%;
        border: 3px solid transparent;
        /* COLOR 2 */
        border-top-color: #FFF;
        -webkit-animation: spin 3s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -moz-animation: spin 3s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -o-animation: spin 3s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -ms-animation: spin 3s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        animation: spin 3s linear infinite;
        /* Chrome, Firefox 16+, IE 10+, Opera */
    }

    #loader:after {
        content: "";
        position: absolute;
        top: 15px;
        left: 15px;
        right: 15px;
        bottom: 15px;
        border-radius: 50%;
        border: 3px solid transparent;
        border-top-color: #FFF;
        /* COLOR 3 */
        -moz-animation: spin 1.5s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -o-animation: spin 1.5s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -ms-animation: spin 1.5s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -webkit-animation: spin 1.5s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        animation: spin 1.5s linear infinite;
        /* Chrome, Firefox 16+, IE 10+, Opera */
    }

    @-webkit-keyframes spin {
        0% {
            -webkit-transform: rotate(0deg);
            /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(0deg);
            /* IE 9 */
            transform: rotate(0deg);
            /* Firefox 16+, IE 10+, Opera */
        }
        100% {
            -webkit-transform: rotate(360deg);
            /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(360deg);
            /* IE 9 */
            transform: rotate(360deg);
            /* Firefox 16+, IE 10+, Opera */
        }
    }

    @keyframes spin {
        0% {
            -webkit-transform: rotate(0deg);
            /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(0deg);
            /* IE 9 */
            transform: rotate(0deg);
            /* Firefox 16+, IE 10+, Opera */
        }
        100% {
            -webkit-transform: rotate(360deg);
            /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(360deg);
            /* IE 9 */
            transform: rotate(360deg);
            /* Firefox 16+, IE 10+, Opera */
        }
    }

    #loader-wrapper .loader-section {
        position: fixed;
        top: 0;
        width: 51%;
        height: 100%;
        background: #000000;
        /* Old browsers */
        z-index: 1000;
        -webkit-transform: translateX(0);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateX(0);
        /* IE 9 */
        transform: translateX(0);
        /* Firefox 16+, IE 10+, Opera */
    }

    #loader-wrapper .loader-section.section-left {
        left: 0;
    }

    #loader-wrapper .loader-section.section-right {
        right: 0;
    }


    /* Loaded */

    .loaded #loader-wrapper .loader-section.section-left {
        -webkit-transform: translateX(-100%);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateX(-100%);
        /* IE 9 */
        transform: translateX(-100%);
        /* Firefox 16+, IE 10+, Opera */
        -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
        transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
    }

    .loaded #loader-wrapper .loader-section.section-right {
        -webkit-transform: translateX(100%);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateX(100%);
        /* IE 9 */
        transform: translateX(100%);
        /* Firefox 16+, IE 10+, Opera */
        -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
        transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
    }

    .loaded #loader {
        opacity: 0;
        -webkit-transition: all 0.3s ease-out;
        transition: all 0.3s ease-out;
    }

    .loaded #loader-wrapper {
        visibility: hidden;
        -webkit-transform: translateY(-100%);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateY(-100%);
        /* IE 9 */
        transform: translateY(-100%);
        /* Firefox 16+, IE 10+, Opera */
        -webkit-transition: all 0.3s 1s ease-out;
        transition: all 0.3s 1s ease-out;
    }


    /* JavaScript Turned Off */

    .no-js #loader-wrapper {
        display: none;
    }

    .no-js h1 {
        color: #222222;
    }

    #loader-wrapper .load_title {
        font-family: 'Open Sans';
        color: #FFF;
        font-size: 19px;
        width: 100%;
        text-align: center;
        z-index: 9999999999999;
        position: absolute;
        top: 60%;
        opacity: 1;
        line-height: 30px;
    }

    #loader-wrapper .load_title span {
        font-weight: normal;
        font-style: italic;
        font-size: 13px;
        color: #FFF;
        opacity: 0.5;
    }


    /*--------------------------------------------导航栏-----------------------------*/

    .head {
        width: 100%;
        display: block;
        position: relative;
        float: left;
        z-index: 100;
        min-width: 1720px;
    }

    .head_nav {
        width: 100%;
        height: 120px;
        display: block;
        position: fixed;
        float: left;
        /*background-color: #000000;*/
        z-index: 1;
    }

    .head_nav_more {
        width: 100%;
        height: 100%;
        display: none;
        position: absolute;
        float: left;
        background-color: #ffffff;
        z-index: 10;
        min-width: 1720px;
    }

    .nav_icon {
        display: block;
        position: relative;
        float: right;
        padding: 2.8rem 3.3rem;
        z-index: 2;
    }

    .head_nav_more_one {
        width: 70%;
        height: 100%;
        /*background-color: #000000;*/
        position: relative;
        display: block;
        float: left;
    }

    .head_nav_more_one a {
        display: block;
        text-decoration: none;
    }

    .head_nav_more_one>ul>li {
        width: 140px;
        float: left;
        text-align: center;
        margin-top: 1.4rem;
        display: block;
        position: relative;
    }

    .head_nav_more_one>ul>li>a {
        width: 100%;
        height: 73px;
    }

    .head_nav_more_one li ul.sub-menu {
        list-style: none;
        display: none;
        padding-left: 0 !important;
    }

    .sub-menu {
        background-color: #ffffff;
    }

    .sub-menu li {
        height: 2.2rem;
        color: #ffffff;
        background-color: #ffffff;
    }

    .sub-menu li>a {
        color: #575757;
        text-decoration: none;
    }

    .sub-menu li:hover {
        background-color: #ee9d4b;
    }

    .sub-menu li:hover a {
        color: white;
        text-decoration: none;
    }

    .head_nav_more_one>ul {
        margin-left: 10rem;
        display: block;
        list-style: none;
    }

    .head_nav_more_one_Home,
    .head_nav_more_one_Programming,
    .head_nav_more_one_ji,
    .head_nav_more_one_lian {
        width: 100%;
        height: 73px;
        display: block;
    }


    /*.head_nav_more_one_Home{*/


    /*background: url("../image/Lockwit_web/nav_1 .png");*/


    /*}*/


    /*.head_nav_more_one_Programming{*/


    /*background: url("../image/Lockwit_web/nav_2.png");*/


    /*}*/


    /*.head_nav_more_one_ji{*/


    /*background: url("../image/Lockwit_web/nav_3.png");*/


    /*}*/


    /*.head_nav_more_one_lian{*/


    /*background: url("../image/Lockwit_web/nav_4.png");*/


    /*}*/

    a img {
        border: 0
    }

    ul,
    ol,
    li {
        list-style-type: none;
        vertical-align: 0
    }

    a {
        outline-style: none;
        color: #535353;
        text-decoration: none
    }

    a:hover {
        /*color: #D40000;*/
        text-decoration: none
    }

    .clear {
        height: 0;
        overflow: hidden;
        clear: both
    }

    header {
        height: 100px;
    }

    input {
        border: none;
    }

    .button {
        display: inline-block;
        zoom: 1;
        *display: inline;
        vertical-align: baseline;
        margin: 0 2px;
        outline: none;
        cursor: pointer;
        text-align: center;
        text-decoration: none;
        font: 14px/100% Arial, Helvetica, sans-serif;
        padding: 0.25em 0.6em 0.3em;
        /*text-shadow: 0 1px 1px rgba(0, 0, 0, .3);*/
        -webkit-border-radius: .5em;
        -moz-border-radius: .5em;
        border-radius: .5em;
        /*-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);*/
        /*-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);*/
        /*box-shadow: 0 1px 2px rgba(0, 0, 0, .2);*/
    }


    /*restCSS结束，应用特效时，以上样式可删除*/


    /* 需要的css样式 */

    .nav {
        width: 970px;
        margin: 0 auto;
        text-align: center;
    }

    .menu,
    .menu ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .menu {
        height: 58px;
        margin-top: 50px;
    }

    .menu li {
        background-color: #ffffff;
        /*border-bottom: 2px solid #181818;*/
        /*border-top: 2px solid #303030;*/
        min-width: 160px;
        /*max-width: 160px;*/
        font-family: "Adobe Caslon Pro";
    }

    .menu>li {
        display: block;
        float: left;
        position: relative;
    }

    .menu>li:first-child {
        border-radius: 5px 0 0;
    }

    .menu a {
        border-left: 3px solid rgba(0, 0, 0, 0);
        /*background: url("../img/back.jpg");*/
        color: #808080;
        display: block;
        font-size: 18px;
        line-height: 54px;
        padding: 0 25px;
        text-decoration: none;
        text-transform: uppercase;
    }

    .menu li:hover {
        /*background-color: #1c1c1c;*/
        /*background: -moz-linear-gradient(#1c1c1c, #1b1b1b);*/
        /*background: -ms-linear-gradient(#1c1c1c, #1b1b1b);*/
        /*background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #1c1c1c), color-stop(100%, #1b1b1b));*/
        /*background: -webkit-linear-gradient(#1c1c1c, #1b1b1b);*/
        /*background: -o-linear-gradient(#1c1c1c, #1b1b1b);*/
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1c1c1c', endColorstr='#1b1b1b');
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#1c1c1c', endColorstr='#1b1b1b')";
        /*background: linear-gradient(#1c1c1c, #1b1b1b);*/
        /*border-bottom: 2px solid #222222;*/
        /*border-top: 2px solid #1B1B1B;*/
        /*改变加深父元素的背景*/
    }

    .menu li:hover>a {
        border-radius: 5px 0 0 0;
        /*border-left: 3px solid #C4302B;*/
        color: #00b6ff;
    }

    .submenu {
        left: 0;
        max-height: 0;
        position: absolute;
        top: 100%;
        z-index: 0;
        -webkit-perspective: 400px;
        -moz-perspective: 400px;
        -ms-perspective: 400px;
        -o-perspective: 400px;
        perspective: 400px;
    }

    .submenu li {
        opacity: 0;
        -webkit-transform: rotateY(90deg);
        -moz-transform: rotateY(90deg);
        -ms-transform: rotateY(90deg);
        -o-transform: rotateY(90deg);
        transform: rotateY(90deg);
        -webkit-transition: opacity .4s, -webkit-transform .5s;
        -moz-transition: opacity .4s, -moz-transform .5s;
        -ms-transition: opacity .4s, -ms-transform .5s;
        -o-transition: opacity .4s, -o-transform .5s;
        transition: opacity .4s, transform .5s;
        /*实现下拉菜单螺旋淡出*/
    }

    .menu .submenu li:hover a {
        /*border-left: 3px solid #454545;*/
        border-radius: 0;
        /*color: #ffffff;*/
    }

    .menu>li:hover .submenu,
    .menu>li:focus .submenu {
        max-height: 2000px;
        z-index: 10;
    }

    .menu>li:hover .submenu li,
    .menu>li:focus .submenu li {
        opacity: 1;
        -webkit-transform: none;
        -moz-transform: none;
        -ms-transform: none;
        -o-transform: none;
        transform: none;
    }


    /*动画递进的时间 实现一个个螺旋子菜单*/

    .menu li:hover .submenu li:nth-child(1) {
        -webkit-transition-delay: 0s;
        -moz-transition-delay: 0s;
        -ms-transition-delay: 0s;
        -o-transition-delay: 0s;
        transition-delay: 0s;
    }

    .menu li:hover .submenu li:nth-child(2) {
        -webkit-transition-delay: 50ms;
        -moz-transition-delay: 50ms;
        -ms-transition-delay: 50ms;
        -o-transition-delay: 50ms;
        transition-delay: 50ms;
    }

    .menu li:hover .submenu li:nth-child(3) {
        -webkit-transition-delay: 100ms;
        -moz-transition-delay: 100ms;
        -ms-transition-delay: 100ms;
        -o-transition-delay: 100ms;
        transition-delay: 100ms;
    }

    .menu li:hover .submenu li:nth-child(4) {
        -webkit-transition-delay: 150ms;
        -moz-transition-delay: 150ms;
        -ms-transition-delay: 150ms;
        -o-transition-delay: 150ms;
        transition-delay: 150ms;
    }

    .menu li:hover .submenu li:nth-child(5) {
        -webkit-transition-delay: 200ms;
        -moz-transition-delay: 200ms;
        -ms-transition-delay: 200ms;
        -o-transition-delay: 200ms;
        transition-delay: 200ms;
    }

    .menu li:hover .submenu li:nth-child(6) {
        -webkit-transition-delay: 250ms;
        -moz-transition-delay: 250ms;
        -ms-transition-delay: 250ms;
        -o-transition-delay: 250ms;
        transition-delay: 250ms;
    }

    .menu li:hover .submenu li:nth-child(7) {
        -webkit-transition-delay: 300ms;
        -moz-transition-delay: 300ms;
        -ms-transition-delay: 300ms;
        -ms-transition-delay: 300ms;
        -o-transition-delay: 300ms;
        transition-delay: 300ms;
    }

    .menu li:hover .submenu li:nth-child(8) {
        -webkit-transition-delay: 350ms;
        -moz-transition-delay: 350ms;
        -ms-transition-delay: 350ms;
        -o-transition-delay: 350ms;
        transition-delay: 350ms;
    }

    .submenu li:nth-child(1) {
        -webkit-transition-delay: 350ms;
        -moz-transition-delay: 350ms;
        -ms-transition-delay: 350ms;
        -o-transition-delay: 350ms;
        transition-delay: 350ms;
    }

    .submenu li:nth-child(2) {
        -webkit-transition-delay: 300ms;
        -moz-transition-delay: 300ms;
        -ms-transition-delay: 300ms;
        -o-transition-delay: 300ms;
        transition-delay: 300ms;
    }

    .submenu li:nth-child(3) {
        -webkit-transition-delay: 250ms;
        -moz-transition-delay: 250ms;
        -ms-transition-delay: 250ms;
        -o-transition-delay: 250ms;
        transition-delay: 250ms;
    }

    .submenu li:nth-child(4) {
        -webkit-transition-delay: 200ms;
        -moz-transition-delay: 200ms;
        -ms-transition-delay: 200ms;
        -o-transition-delay: 200ms;
        transition-delay: 200ms;
    }

    .submenu li:nth-child(5) {
        -webkit-transition-delay: 150ms;
        -moz-transition-delay: 150ms;
        -ms-transition-delay: 150ms;
        -o-transition-delay: 150ms;
        transition-delay: 150ms;
    }

    .submenu li:nth-child(6) {
        -webkit-transition-delay: 100ms;
        -moz-transition-delay: 100ms;
        -ms-transition-delay: 100ms;
        -o-transition-delay: 100ms;
        transition-delay: 100ms;
    }

    .submenu li:nth-child(7) {
        -webkit-transition-delay: 50ms;
        -moz-transition-delay: 50ms;
        -ms-transition-delay: 50ms;
        -o-transition-delay: 50ms;
        transition-delay: 50ms;
    }

    .submenu li:nth-child(8) {
        -webkit-transition-delay: 0s;
        -moz-transition-delay: 0s;
        -ms-transition-delay: 0s;
        -o-transition-delay: 0s;
        transition-delay: 0s;
    }
    .menu_znms{
        background: url("../image/Lockwit_web/nav_2.png") no-repeat 15px -15px;

    }

    /*-------------------------------------轮播图-------------------------------------*/

    #head_Publicity {
        float: left;
        margin: 0 auto;
        display: inline-block;
        position: absolute;
        width: 100%;
        /*height: 897px;*/
        /*margin-top: 120px;*/
        z-index: -1;
    }

    .head_Publicity_animation_1 {
        width: 32px;
        height: 20px;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -268px -440px;
        position: absolute;
        bottom: 15px;
        left:45%;
        -webkit-animation: play1-4 2s linear infinite;
        animation: play1-4 2s linear infinite;
    }

    @keyframes play1-4 {
        0% {
            transform: translateY(0);
            -webkit-transform: translateY(0);
            opacity: 1;
        }
        100% {
            transform: translateY(25px);
            -webkit-transform: translateY(25px);
            opacity: 0;
        }
    }

    #head_Publicity-inner {
        position: relative;
        height: 100%;
        overflow: hidden;
    }

    #head_Publicity-inner ul {
        margin: 0;
        padding: 0;
        list-style-type: none;
    }

    #head_Publicity-inner ul li {
        display: inline-block;
        width: 100%;
        height: 100%;
        z-index: -1;
        position: absolute;
        top: 0;
        min-height: 777px;
        min-width: 1720px;
    }

    #head_Publicity-inner ul>li:nth-of-type(1) {
        z-index: -1;
    }

    #head_Publicity-inner ul>li:nth-of-type(2) {
        z-index: -2;
    }

    #head_Publicity-inner ul>li:nth-of-type(3) {
        z-index: -3;
    }

    #head_Publicity-inner ul>li:nth-of-type(1) a {
        display: inline-block;
        position: absolute;
    }

    #head_Publicity-inner ul li a {
        display: inline-block;
        width: 100%;
        height: 100%;
        background-size: 100% 100%;
        background-attachment: fixed;
    }

    .head_Publicity-inner-left,
    .head_Publicity-inner-right {
        width: 35%;
        height: 70%;
        display: block;
        position: absolute;
        bottom: 0px;
        top: 20%;
        cursor: none;
    }

    .head_Publicity-inner-right {
        right: 0;
    }

    .lockwit_zjm {
        width: 215px;
        height: 75px;
        /*width:21.5px;*/
        /*height:7.5px;*/
        display: inline-block;
        position: absolute;
        bottom: 12rem;
        left: 45%;
        margin-left: -107.5px;
        border:2px solid #ffffff ;
        font-size: 2rem;
        text-align: center;
        line-height: 4.5rem;
        color: #ffffff;
        /*padding: 34rem 59rem;*/
        /*-webkit-animation:play1-6 1.5s ease 1;*/
        /*animation:play1-6 1.5s ease 1;*/
        /*animation-fill-mode:forwards;*/
        /*-webkit-animation-fill-mode: forwards;*/
        /*animation-delay: 0.5s;*/
        /*-webkit-animation-delay: 0.5s;*/
        /*opacity: 0;*/
        opacity: 1;

        animation:myfirst 1.1s ease-out;
        animation-delay:1s;
        animation-fill-mode:both;
        -moz-animation:myfirst 1.1s ease-out; /* Firefox */
        -moz-animation-delay:1s;
        -moz-animation-fill-mode:both;
        -webkit-animation:myfirst 1.1s ease-out; /* Safari and Chrome */
        -webkit-animation-delay:1s;
        -webkit-animation-fill-mode:both;
        -o-animation:myfirst 1.1s ease-out; /* Opera */
        -o-animation-delay:1s;
        -o-animation-fill-mode:both;
    }
    @keyframes myfirst{
        0%{background:#ffffff;opacity: 0;width: 90px;height:0px;bottom: 55rem;left: 48%;font-size: 0;}
        28%{background:#ffffff;width: 90px;height:150px;bottom: 19rem;left: 48%;font-size: 0;}
        56%{background:#ffffff;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 48%;font-size: 0;}
        71%{background:#ffffff;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 48%;font-size: 0;}
        100%{font-size: 2rem;height:75px;width: 215px;height: 75px;}
    }
    @-moz-keyframes myfirst{
        0%{background:white;opacity: 0;width: 90px;height:0px;bottom: 55rem;left: 48%;font-size: 0;}
        28%{background:white;width: 90px;height:150px;bottom: 19rem;left: 48%;font-size: 0;}
        56%{background:white;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 48%;font-size: 0;}
        71%{background:white;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 48%;font-size: 0;}
        100%{font-size: 2rem;height:75px;width: 215px;height: 75px;}
    }

    @-webkit-keyframes myfirst{
        0%{background:white;opacity: 0;width: 90px;height:0px;bottom: 55rem;left: 48%;font-size: 0;}
        28%{background:white;width: 90px;height:150px;bottom: 19rem;left: 48%;font-size: 0;}
        56%{background:white;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 48%;font-size: 0;}
        71%{background:white;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 48%;font-size: 0;}
        100%{font-size: 2rem;height:75px;width: 215px;height: 75px;}
    }

    @-o-keyframes myfirst{
        0%{background:white;opacity: 0;width: 90px;height:0px;bottom: 55rem;left: 48%;font-size: 0;}
        28%{background:white;width: 90px;height:150px;bottom: 19rem;left: 48%;font-size: 0;}
        56%{background:white;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 48%;font-size: 0;}
        71%{background:white;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 48%;font-size: 0;}
        100%{font-size: 2rem;height:75px;width: 215px;height: 75px;}
    }

    /*@keyframes play1-6 {
        0% {
            opacity: 0;
            transform: scale(0);
            -webkit-transform: scale(0);
        }
        100% {
            opacity: 1;
            transform: scale(10, 10);
            -webkit-transform: scale(10, 10);
        }
    }*/

    #head_Publicity-inner ul li a {
        display: inline-block;
        width: 100%;
        height: 100%;
        background-size: 100% 100%;
        background-attachment: fixed;
    }

    #head_Publicity-inner ul>li:nth-of-type(1) a span:nth-of-type(1) {
        width: 444px;
        height: 48px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -79px -19px;
        margin-top: 18rem;
        -webkit-animation: play1-1 1.3s ease 1;
        animation: play1-1 1.3s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 1.2s;
        -webkit-animation-delay: 1.2s;
        opacity: 0;
        margin-left: -222px;
        left: 45%;
        /*font-size: 3.08rem;
        color: #ffffff;
        text-align: center;
        font-weight: 200;
        line-height: 2.32rem;*/
    }

    @keyframes play1-1 {
        0% {
            opacity: 0;
            transform: translateY(-100px);
            -webkit-transform: translateY(-100px);
        }
        100% {
            opacity: 1;
            transform: translateY(0px);
            -webkit-transform: translateY(0px);
        }
    }

    .head_Publicity-inner1_span2 {
        width: 365px;
        height: 24px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -112px -101px;
        margin-top: 22rem;
        -webkit-animation: play1-2 1s ease 1;
        animation: play1-2 1s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 1s;
        -webkit-animation-delay: 1s;
        opacity: 0;
        left: 45%;
        margin-left: -182.5px;
    }

    @keyframes play1-2 {
        0% {
            opacity: 0;
            transform: translateY(-100px);
            -webkit-transform: translateY(-100px);
        }
        100% {
            opacity: 1;
            transform: translateY(0px);
            -webkit-transform: translateY(0px);
        }
    }

    #head_Publicity-inner ul>li:nth-of-type(2) a span:nth-of-type(1) {
        width: 523px;
        height: 50px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -34px -156px;
        margin-top: 18rem;
        -webkit-animation: play1-1 1.5s ease 1;
        animation: play1-1 1.5s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 0.5s;
        -webkit-animation-delay: 0.5s;
        opacity: 0;
        left: 45%;
        margin-left: -261.5px;
        /*font-size: 3.08rem;
    color: #ffffff;
    text-align: center;
    font-weight: 200;
    line-height: 2.32rem;*/
    }

    .head_Publicity-inner2_span2 {
        width: 204px;
        height: 25px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -190px -240px;
        margin-top: 22rem;
        left: 45%;
        margin-left: -102px;
        -webkit-animation: play1-2 1s ease 1;
        animation: play1-2 1s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 0.5s;
        -webkit-animation-delay: 0.5s;
    }

    #head_Publicity-inner ul>li:nth-of-type(3) a span:nth-of-type(1) {
        width: 544px;
        height: 48px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -28px -314px;
        margin-top: 18rem;
        left: 45%;
        margin-left: -272px;
        -webkit-animation: play1-1 1.5s ease 1;
        animation: play1-1 1.5s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 0.5s;
        -webkit-animation-delay: 0.5s;
        opacity: 0;
        /*font-size: 3.08rem;
    color: #ffffff;
    text-align: center;
    font-weight: 200;
    line-height: 2.32rem;*/

    }

    .head_Publicity-inner3_span2 {
        width: 252px;
        height: 25px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -158px -400px;
        margin-top: 22rem;
        left: 45%;
        margin-left: -126px;
        -webkit-animation: play1-2 2s ease 1;
        animation: play1-2 2s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 0.5s;
        -webkit-animation-delay: 0.5s;
    }

    .head_Publicity-inner1_span3 {
        width: 80px;
        height: 30px;
        display: block;
        position: absolute;
        left: 45%;
        top: 300px;
        background-color: #ffffff;
        -webkit-animation: play1-5 1s ease 1;
        animation: play1-5 1s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
    }


    /**/

    @keyframes play1-5 {
        0% {
            top: 0;
            width: 80px;
            height: 60px;
            opacity: 1;
        }
        50% {
            top: 300px;
            width: 80px;
            height: 7.5px;
            opacity: 1;
        }
        100% {
            top: 539px;
            width: 215px;
            height: 75px;
            opacity: 1;
            background: url("../image/Lockwit_web/lockwit_zjm.png");
        }
    }

    #head_Publicity-left,
    #head_Publicity-right {
        position: absolute;
        top: 197px;
        display: none;
        height: 94px;
        width: 52px;
        /*background-color: rgba(0, 0, 0, 0.2);*/
        color: white;
        font-size: 20px;
        text-align: center;
        line-height: 60px;
        z-index: 1;
        cursor: none;
    }

    #head_Publicity-right {
        right: 0;
    }

    .items {
        position: absolute;
        display: inline-block;
        bottom: 5px;
        height: 20px;
        width: 100%;
        text-align: center;
        top: 300px;
    }


    /*.item{*/


    /*display: inline-block;*/


    /*width: 20px;*/


    /*height: 20px;*/


    /*background-color: #666666;*/


    /*border-radius: 10px;*/


    /*color: white;*/


    /*}*/


    /*.item:hover{*/


    /*background-color: red;*/


    /*}*/


    /*.item-selected{*/


    /*display: inline-block;*/


    /*width: 20px;*/


    /*height: 20px;*/


    /*background-color: red;*/


    /*border-radius: 10px;*/


    /*color: white;*/


    /*}*/


    /*------------------------------content--------------------------------*/

    .content {
        width: 100%;
        display: inline-block;
        position: absolute;
        float: left;
        top: 897px;
        z-index: 6;
    }

    .Content_Introduce {
        width: 100%;
        height: 587px;
        background-color: #ffffff;
        position: relative;
        float: left;
    }

    .Content_Introduce_n {
        width: 69rem;
        height: 75%;
        display: block;
        margin: 0 auto;
        position: relative;
        top: 5rem;
    }

    .Content_Introduce_n h1 {
        color: #1cb7e3;
        font-weight: 500;
        font-size: 24px;
        font-family: "Microsoft YaHei UI";
    }

    .Content_Introduce_n p {
        padding-top: 1rem;
        font-size: 14px;
        line-height: 2rem;
        margin-top:0;
    }

    .Content_Introduce_n p:nth-of-type(1) {
        color: #777777;
        font-size: 16px;
        padding: 0;
        margin-top: -1rem;
    }


    /*------------------------------------------------------------------------第二个轮播图---------------------------*/

    .Content_Product {
        width: 100%;
        height: 965px;
        display: inline-block;
        position: relative;
        float: left;
        background-color: #000000;
        overflow: hidden;
    }

    #canvas {
        display: block;
        position: absolute;
        width: 100%;
        height: 100%;
        float: left;
        top: 0;
    }


    /*-----------图---------------*/

    .swiper-container {
        width: 25%;
        height: 75%;
        position: relative;
        float: left;
        left: 15%;
        top: 58px;
        min-width: 415px;
        min-height: 723.75px;
    }

    .swiper-slide {
        text-align: center;
        font-size: 18px;
        /*background: #fff;*/
        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
    }

    .Content_Product-cont {
        display: block;
        position: absolute;
        float: left;
        left: 50%;
        top: 58px;
    }
    .swiper-slide img{
        width: 100%;
        height: 100%;
    }

    /*content的第三块*/

    .Content_Technical {
        width: 100%;
        min-width: 1200px;
        height: 603px;
        display: block;
        position: relative;
        float: left;
        background: url("../image/Lockwit_web/bg_4.jpg");
        background-size: 100% 100%;
        background-attachment: fixed;
        /*overflow: scroll;*/
    }

    .Content_Technical_biao {
        width: 386px;
        height: 156px;
        position: relative;
        display: inline-block;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -33px -10px;
        margin: 4rem 35rem;
    }

    .Content_Technical_ques {
        width: 80%;
        height: 306px;
        display: block;
        position: relative;
        float: left;
        left: 10%;
        margin-top: -1rem;
        color: #6e6e6e;
    }

    .Content_Technical_ques a {
        width: 120px;
        height: 234px;
        display: block;
        float: left;
        margin-left: 90px;
        margin-top: 44px;
        text-decoration: none;
    }


    /*--------------------------1----------------------*/

    .Content_Technical_ques a>span {
        width: 103px;
        height: 103px;
        display: block;
        float: left;
        position: relative;
    }

    .Content_Technical_ques a:nth-of-type(1)>span {

        display: block;
        margin: 0.5rem 1rem;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -124px -135px;
        background-size: 320px 754px;

    }

    .Content_Technical_ques a:nth-of-type(1)>span:hover {
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: 0px -136px;
        background-size: 320px 754px;
    }


    /*--------------------------2----------------------*/

    .Content_Technical_ques a:nth-of-type(2)>span {
        display: block;
        margin: 0.5rem 1rem;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -124px -266px;
        background-size: 320px 754px;
    }

    .Content_Technical_ques a:nth-of-type(2)>span:hover {
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: 0 -265px;
        background-size: 320px 754px;
    }


    /*--------------------------3----------------------*/

    .Content_Technical_ques a:nth-of-type(3)>span {
        display: block;
        margin: 0.5rem 1rem;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -122px -378px;
        background-size: 320px 754px;
    }

    .Content_Technical_ques a:nth-of-type(3)>span:hover {
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: 0 -378px;
        background-size: 320px 754px;
    }


    /*--------------------------4----------------------*/

    .Content_Technical_ques a:nth-of-type(4)>span {
        display: block;
        margin: 0.5rem 1rem;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -119px -488px;
        background-size: 320px 754px;
    }

    .Content_Technical_ques a:nth-of-type(4)>span:hover {
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: 0 -488px;
        background-size: 320px 754px;
    }


    /*--------------------------5----------------------*/

    .Content_Technical_ques a:nth-of-type(5)>span {
        display: block;
        margin: 0.5rem 1rem;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -119px -592px;
        background-size: 320px 754px;
    }

    .Content_Technical_ques a:nth-of-type(5)>span:hover {
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -6px -594px;
        background-size: 320px 754px;
    }
    .Content_Technical_ques a>span>h3 {
        width: 123px;
        height: 49px;
        display: block;
        position: relative;
        float: left;
        margin: 9rem 1rem;
    }


    /*------------------------------------------------------底部---------------------------------------------*/

    .footer {
        width: 100%;
        height: 450px;
        display: inline-block;
        position: relative;
        float: left;
        z-index: 7;
        background-color: #ffffff;
        /*background: url("../image/Lockwit_web/map.jpg");*/
        /*background-attachment: fixed;*/
    }

    .footer span:nth-of-type(1) {
        width: 23.5rem;
        height: 22.93rem;
        position: relative;
        display: block;
        left: 15%;
        margin-top: 75px;
    }

    .footer span:nth-of-type(1) h3 {
        font-weight: 500;
    }

    .footer span:nth-of-type(1) input {
        width: 310px;
        height: 31px;
        border: 1px solid #dde2ed;
        padding: 0;
        margin-top: 1rem;
    }

    .footer span:nth-of-type(1) textarea {
        width: 22.14rem;
        height: 8rem;
        border: 1px solid #dde2ed;
        padding: 0;
        margin-top: 1rem;
        resize: none;
    }

    .footer span:nth-of-type(1) button {
        width: 84px;
        height: 31px;
        background-color: #08c743;
        padding: 0;
        margin-top: 1rem;
        border: 0;
        color: #ffffff;
        font-weight: 600;
        font-size: 18px;
    }

    .footer span:nth-of-type(2) {
        width: 22.93rem;
        height: 21.07rem;
        position: absolute;
        display: inline-block;
        /*margin: 75px 400px;*/
        float: left;
        top: 75px;
        left: 50%;
        min-left:350px;
    }

    .footer span:nth-of-type(2) h6 {
        font-weight: 300;
        margin: 0.5rem;
    }

    .footer span:nth-of-type(2) h3 {
        font-weight: 500;
        margin: 0.5rem;
    }

    .footer span:nth-of-type(2) p {
        font-size: 13px;
        font-weight: 400;
        margin: 0.6rem;
        display: block;
        margin-top: 1rem;
    }

    .footer span:nth-of-type(2) p:nth-of-type(1) {
        display: block;
        margin-top: 2.2rem;
    }

    .footer span:nth-of-type(2) p:nth-of-type(5) {
        display: block;
        font-size: 14px;
        margin-top: 2.8rem;
    }

    .footer span:nth-of-type(3) {
        width: 156px;
        height: 201px;
        position: absolute;
        display: block;
        left: 80%;
        top: 75px;
    }

    .footer span:nth-of-type(3) h3 {
        font-weight: 500;
        margin: 0.5rem;
    }

    .footer span:nth-of-type(3) img {
        font-weight: 500;
        margin-top: 1.5rem;
        display: block;
    }

    .Content_Map {
        width: 100%;
        height: 495px;
        display: inline-block;
        position: relative;
        background: url("../image/Lockwit_web/map.jpg");
        background-size:100% 100% ;
    }

    .imga,.imgb,.imgc,.imgd,.imge {
        width: 250px;
        position: absolute;
        left: 49%;
        margin-top: 72px;

    }

    .img-none{
        display: none;

    }
    .cont_img-none{
        display: none;

    }
}
@media (min-width: 1001px) and (max-width: 1280px) {
    .chromeframe {
        margin: 0.2em 0;
        background: #ccc;
        color: #000;
        padding: 0.2em 0;
    }

    #loader-wrapper {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 999999;
    }

    #loader {
        display: block;
        position: relative;
        left: 50%;
        top: 50%;
        width: 150px;
        height: 150px;
        margin: -75px 0 0 -75px;
        border-radius: 50%;
        border: 3px solid transparent;
        /* COLOR 1 */
        border-top-color: #FFF;
        -webkit-animation: spin 2s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -ms-animation: spin 2s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -moz-animation: spin 2s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -o-animation: spin 2s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        animation: spin 2s linear infinite;
        /* Chrome, Firefox 16+, IE 10+, Opera */
        z-index: 1001;
    }

    #loader:before {
        content: "";
        position: absolute;
        top: 5px;
        left: 5px;
        right: 5px;
        bottom: 5px;
        border-radius: 50%;
        border: 3px solid transparent;
        /* COLOR 2 */
        border-top-color: #FFF;
        -webkit-animation: spin 3s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -moz-animation: spin 3s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -o-animation: spin 3s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -ms-animation: spin 3s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        animation: spin 3s linear infinite;
        /* Chrome, Firefox 16+, IE 10+, Opera */
    }

    #loader:after {
        content: "";
        position: absolute;
        top: 15px;
        left: 15px;
        right: 15px;
        bottom: 15px;
        border-radius: 50%;
        border: 3px solid transparent;
        border-top-color: #FFF;
        /* COLOR 3 */
        -moz-animation: spin 1.5s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -o-animation: spin 1.5s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -ms-animation: spin 1.5s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -webkit-animation: spin 1.5s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        animation: spin 1.5s linear infinite;
        /* Chrome, Firefox 16+, IE 10+, Opera */
    }

    @-webkit-keyframes spin {
        0% {
            -webkit-transform: rotate(0deg);
            /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(0deg);
            /* IE 9 */
            transform: rotate(0deg);
            /* Firefox 16+, IE 10+, Opera */
        }
        100% {
            -webkit-transform: rotate(360deg);
            /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(360deg);
            /* IE 9 */
            transform: rotate(360deg);
            /* Firefox 16+, IE 10+, Opera */
        }
    }

    @keyframes spin {
        0% {
            -webkit-transform: rotate(0deg);
            /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(0deg);
            /* IE 9 */
            transform: rotate(0deg);
            /* Firefox 16+, IE 10+, Opera */
        }
        100% {
            -webkit-transform: rotate(360deg);
            /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(360deg);
            /* IE 9 */
            transform: rotate(360deg);
            /* Firefox 16+, IE 10+, Opera */
        }
    }

    #loader-wrapper .loader-section {
        position: fixed;
        top: 0;
        width: 51%;
        height: 100%;
        background: #000000;
        /* Old browsers */
        z-index: 1000;
        -webkit-transform: translateX(0);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateX(0);
        /* IE 9 */
        transform: translateX(0);
        /* Firefox 16+, IE 10+, Opera */
    }

    #loader-wrapper .loader-section.section-left {
        left: 0;
    }

    #loader-wrapper .loader-section.section-right {
        right: 0;
    }


    /* Loaded */

    .loaded #loader-wrapper .loader-section.section-left {
        -webkit-transform: translateX(-100%);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateX(-100%);
        /* IE 9 */
        transform: translateX(-100%);
        /* Firefox 16+, IE 10+, Opera */
        -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
        transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
    }

    .loaded #loader-wrapper .loader-section.section-right {
        -webkit-transform: translateX(100%);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateX(100%);
        /* IE 9 */
        transform: translateX(100%);
        /* Firefox 16+, IE 10+, Opera */
        -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
        transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
    }

    .loaded #loader {
        opacity: 0;
        -webkit-transition: all 0.3s ease-out;
        transition: all 0.3s ease-out;
    }

    .loaded #loader-wrapper {
        visibility: hidden;
        -webkit-transform: translateY(-100%);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateY(-100%);
        /* IE 9 */
        transform: translateY(-100%);
        /* Firefox 16+, IE 10+, Opera */
        -webkit-transition: all 0.3s 1s ease-out;
        transition: all 0.3s 1s ease-out;
    }


    /* JavaScript Turned Off */

    .no-js #loader-wrapper {
        display: none;
    }

    .no-js h1 {
        color: #222222;
    }

    #loader-wrapper .load_title {
        font-family: 'Open Sans';
        color: #FFF;
        font-size: 19px;
        width: 100%;
        text-align: center;
        z-index: 9999999999999;
        position: absolute;
        top: 60%;
        opacity: 1;
        line-height: 30px;
    }

    #loader-wrapper .load_title span {
        font-weight: normal;
        font-style: italic;
        font-size: 13px;
        color: #FFF;
        opacity: 0.5;
    }


    /*--------------------------------------------导航栏-----------------------------*/

    .head {
        width: 100%;
        display: block;
        position: relative;
        float: left;
        z-index: 100;
        min-width: 1720px;
    }

    .head_nav {
        width: 100%;
        height: 120px;
        display: block;
        position: fixed;
        float: left;
        /*background-color: #000000;*/
        z-index: 1;
    }

    .head_nav_more {
        width: 100%;
        height: 100%;
        display: none;
        position: absolute;
        float: left;
        background-color: #ffffff;
        z-index: 10;
        min-width: 1720px;
    }

    .nav_icon {
        display: block;
        position: relative;
        float: right;
        padding: 2.8rem 3.3rem;
        z-index: 2;
    }

    .head_nav_more_one {
        width: 70%;
        height: 100%;
        /*background-color: #000000;*/
        position: relative;
        display: block;
        float: left;
    }

    .head_nav_more_one a {
        display: block;
        text-decoration: none;
    }

    .head_nav_more_one>ul>li {
        width: 140px;
        float: left;
        text-align: center;
        margin-top: 1.4rem;
        display: block;
        position: relative;
    }

    .head_nav_more_one>ul>li>a {
        width: 100%;
        height: 73px;
    }

    .head_nav_more_one li ul.sub-menu {
        list-style: none;
        display: none;
        padding-left: 0 !important;
    }

    .sub-menu {
        background-color: #ffffff;
    }

    .sub-menu li {
        height: 2.2rem;
        color: #ffffff;
        background-color: #ffffff;
    }

    .sub-menu li>a {
        color: #575757;
        text-decoration: none;
    }

    .sub-menu li:hover {
        background-color: #ee9d4b;
    }

    .sub-menu li:hover a {
        color: white;
        text-decoration: none;
    }

    .head_nav_more_one>ul {
        margin-left: 10rem;
        display: block;
        list-style: none;
    }

    .head_nav_more_one_Home,
    .head_nav_more_one_Programming,
    .head_nav_more_one_ji,
    .head_nav_more_one_lian {
        width: 100%;
        height: 73px;
        display: block;
    }


    /*.head_nav_more_one_Home{*/


    /*background: url("../image/Lockwit_web/nav_1 .png");*/


    /*}*/


    /*.head_nav_more_one_Programming{*/


    /*background: url("../image/Lockwit_web/nav_2.png");*/


    /*}*/


    /*.head_nav_more_one_ji{*/


    /*background: url("../image/Lockwit_web/nav_3.png");*/


    /*}*/


    /*.head_nav_more_one_lian{*/


    /*background: url("../image/Lockwit_web/nav_4.png");*/


    /*}*/

    a img {
        border: 0
    }

    ul,
    ol,
    li {
        list-style-type: none;
        vertical-align: 0
    }

    a {
        outline-style: none;
        color: #535353;
        text-decoration: none
    }

    a:hover {
        /*color: #D40000;*/
        text-decoration: none
    }

    .clear {
        height: 0;
        overflow: hidden;
        clear: both
    }

    header {
        height: 100px;
    }

    input {
        border: none;
    }

    .button {
        display: inline-block;
        zoom: 1;
        *display: inline;
        vertical-align: baseline;
        margin: 0 2px;
        outline: none;
        cursor: pointer;
        text-align: center;
        text-decoration: none;
        font: 14px/100% Arial, Helvetica, sans-serif;
        padding: 0.25em 0.6em 0.3em;
        /*text-shadow: 0 1px 1px rgba(0, 0, 0, .3);*/
        -webkit-border-radius: .5em;
        -moz-border-radius: .5em;
        border-radius: .5em;
        /*-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);*/
        /*-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);*/
        /*box-shadow: 0 1px 2px rgba(0, 0, 0, .2);*/
    }


    /*restCSS结束，应用特效时，以上样式可删除*/


    /* 需要的css样式 */

    .nav {
        width: 970px;
        margin: 0 auto;
        text-align: center;
    }

    .menu,
    .menu ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .menu {
        height: 58px;
        margin-top: 50px;
    }

    .menu li {
        background-color: #ffffff;
        /*border-bottom: 2px solid #181818;*/
        /*border-top: 2px solid #303030;*/
        min-width: 160px;
        /*max-width: 160px;*/
        font-family: "Adobe Caslon Pro";
    }

    .menu>li {
        display: block;
        float: left;
        position: relative;
    }

    .menu>li:first-child {
        border-radius: 5px 0 0;
    }

    .menu a {
        border-left: 3px solid rgba(0, 0, 0, 0);
        /*background: url("../img/back.jpg");*/
        color: #808080;
        display: block;
        font-size: 18px;
        line-height: 54px;
        padding: 0 25px;
        text-decoration: none;
        text-transform: uppercase;
    }

    .menu li:hover {
        /*background-color: #1c1c1c;*/
        /*background: -moz-linear-gradient(#1c1c1c, #1b1b1b);*/
        /*background: -ms-linear-gradient(#1c1c1c, #1b1b1b);*/
        /*background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #1c1c1c), color-stop(100%, #1b1b1b));*/
        /*background: -webkit-linear-gradient(#1c1c1c, #1b1b1b);*/
        /*background: -o-linear-gradient(#1c1c1c, #1b1b1b);*/
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1c1c1c', endColorstr='#1b1b1b');
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#1c1c1c', endColorstr='#1b1b1b')";
        /*background: linear-gradient(#1c1c1c, #1b1b1b);*/
        /*border-bottom: 2px solid #222222;*/
        /*border-top: 2px solid #1B1B1B;*/
        /*改变加深父元素的背景*/
    }

    .menu li:hover>a {
        border-radius: 5px 0 0 0;
        /*border-left: 3px solid #C4302B;*/
        color: #00b6ff;
    }

    .submenu {
        left: 0;
        max-height: 0;
        position: absolute;
        top: 100%;
        z-index: 0;
        -webkit-perspective: 400px;
        -moz-perspective: 400px;
        -ms-perspective: 400px;
        -o-perspective: 400px;
        perspective: 400px;
    }

    .submenu li {
        opacity: 0;
        -webkit-transform: rotateY(90deg);
        -moz-transform: rotateY(90deg);
        -ms-transform: rotateY(90deg);
        -o-transform: rotateY(90deg);
        transform: rotateY(90deg);
        -webkit-transition: opacity .4s, -webkit-transform .5s;
        -moz-transition: opacity .4s, -moz-transform .5s;
        -ms-transition: opacity .4s, -ms-transform .5s;
        -o-transition: opacity .4s, -o-transform .5s;
        transition: opacity .4s, transform .5s;
        /*实现下拉菜单螺旋淡出*/
    }

    .menu .submenu li:hover a {
        /*border-left: 3px solid #454545;*/
        border-radius: 0;
        /*color: #ffffff;*/
    }

    .menu>li:hover .submenu,
    .menu>li:focus .submenu {
        max-height: 2000px;
        z-index: 10;
    }

    .menu>li:hover .submenu li,
    .menu>li:focus .submenu li {
        opacity: 1;
        -webkit-transform: none;
        -moz-transform: none;
        -ms-transform: none;
        -o-transform: none;
        transform: none;
    }


    /*动画递进的时间 实现一个个螺旋子菜单*/

    .menu li:hover .submenu li:nth-child(1) {
        -webkit-transition-delay: 0s;
        -moz-transition-delay: 0s;
        -ms-transition-delay: 0s;
        -o-transition-delay: 0s;
        transition-delay: 0s;
    }

    .menu li:hover .submenu li:nth-child(2) {
        -webkit-transition-delay: 50ms;
        -moz-transition-delay: 50ms;
        -ms-transition-delay: 50ms;
        -o-transition-delay: 50ms;
        transition-delay: 50ms;
    }

    .menu li:hover .submenu li:nth-child(3) {
        -webkit-transition-delay: 100ms;
        -moz-transition-delay: 100ms;
        -ms-transition-delay: 100ms;
        -o-transition-delay: 100ms;
        transition-delay: 100ms;
    }

    .menu li:hover .submenu li:nth-child(4) {
        -webkit-transition-delay: 150ms;
        -moz-transition-delay: 150ms;
        -ms-transition-delay: 150ms;
        -o-transition-delay: 150ms;
        transition-delay: 150ms;
    }

    .menu li:hover .submenu li:nth-child(5) {
        -webkit-transition-delay: 200ms;
        -moz-transition-delay: 200ms;
        -ms-transition-delay: 200ms;
        -o-transition-delay: 200ms;
        transition-delay: 200ms;
    }

    .menu li:hover .submenu li:nth-child(6) {
        -webkit-transition-delay: 250ms;
        -moz-transition-delay: 250ms;
        -ms-transition-delay: 250ms;
        -o-transition-delay: 250ms;
        transition-delay: 250ms;
    }

    .menu li:hover .submenu li:nth-child(7) {
        -webkit-transition-delay: 300ms;
        -moz-transition-delay: 300ms;
        -ms-transition-delay: 300ms;
        -o-transition-delay: 300ms;
        transition-delay: 300ms;
    }

    .menu li:hover .submenu li:nth-child(8) {
        -webkit-transition-delay: 350ms;
        -moz-transition-delay: 350ms;
        -ms-transition-delay: 350ms;
        -o-transition-delay: 350ms;
        transition-delay: 350ms;
    }

    .submenu li:nth-child(1) {
        -webkit-transition-delay: 350ms;
        -moz-transition-delay: 350ms;
        -ms-transition-delay: 350ms;
        -o-transition-delay: 350ms;
        transition-delay: 350ms;
    }

    .submenu li:nth-child(2) {
        -webkit-transition-delay: 300ms;
        -moz-transition-delay: 300ms;
        -ms-transition-delay: 300ms;
        -o-transition-delay: 300ms;
        transition-delay: 300ms;
    }

    .submenu li:nth-child(3) {
        -webkit-transition-delay: 250ms;
        -moz-transition-delay: 250ms;
        -ms-transition-delay: 250ms;
        -o-transition-delay: 250ms;
        transition-delay: 250ms;
    }

    .submenu li:nth-child(4) {
        -webkit-transition-delay: 200ms;
        -moz-transition-delay: 200ms;
        -ms-transition-delay: 200ms;
        -o-transition-delay: 200ms;
        transition-delay: 200ms;
    }

    .submenu li:nth-child(5) {
        -webkit-transition-delay: 150ms;
        -moz-transition-delay: 150ms;
        -ms-transition-delay: 150ms;
        -o-transition-delay: 150ms;
        transition-delay: 150ms;
    }

    .submenu li:nth-child(6) {
        -webkit-transition-delay: 100ms;
        -moz-transition-delay: 100ms;
        -ms-transition-delay: 100ms;
        -o-transition-delay: 100ms;
        transition-delay: 100ms;
    }

    .submenu li:nth-child(7) {
        -webkit-transition-delay: 50ms;
        -moz-transition-delay: 50ms;
        -ms-transition-delay: 50ms;
        -o-transition-delay: 50ms;
        transition-delay: 50ms;
    }

    .submenu li:nth-child(8) {
        -webkit-transition-delay: 0s;
        -moz-transition-delay: 0s;
        -ms-transition-delay: 0s;
        -o-transition-delay: 0s;
        transition-delay: 0s;
    }
    .menu_znms{
        background: url("../image/Lockwit_web/nav_2.png") no-repeat 15px -15px;

    }

    /*-------------------------------------轮播图-------------------------------------*/

    #head_Publicity {
        float: left;
        margin: 0 auto;
        display: inline-block;
        position: absolute;
        width: 100%;
        /*height: 897px;*/
        /*margin-top: 120px;*/
        z-index: -1;
    }

    .head_Publicity_animation_1 {
        width: 32px;
        height: 20px;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -268px -440px;
        position: absolute;
        bottom: 15px;
        left:35%;
        -webkit-animation: play1-4 2s linear infinite;
        animation: play1-4 2s linear infinite;
    }

    @keyframes play1-4 {
        0% {
            transform: translateY(0);
            -webkit-transform: translateY(0);
            opacity: 1;
        }
        100% {
            transform: translateY(25px);
            -webkit-transform: translateY(25px);
            opacity: 0;
        }
    }

    #head_Publicity-inner {
        position: relative;
        height: 100%;
        overflow: hidden;
    }

    #head_Publicity-inner ul {
        margin: 0;
        padding: 0;
        list-style-type: none;
    }

    #head_Publicity-inner ul li {
        display: inline-block;
        width: 100%;
        height: 100%;
        z-index: -1;
        position: absolute;
        top: 0;
        min-height: 777px;
        min-width: 1720px;
    }

    #head_Publicity-inner ul>li:nth-of-type(1) {
        z-index: -1;
    }

    #head_Publicity-inner ul>li:nth-of-type(2) {
        z-index: -2;
    }

    #head_Publicity-inner ul>li:nth-of-type(3) {
        z-index: -3;
    }

    #head_Publicity-inner ul>li:nth-of-type(1) a {
        display: inline-block;
        position: absolute;
    }

    #head_Publicity-inner ul li a {
        display: inline-block;
        width: 100%;
        height: 100%;
        background-size: 100% 100%;
        background-attachment: fixed;
    }

    .head_Publicity-inner-left,
    .head_Publicity-inner-right {
        width: 35%;
        height: 70%;
        display: block;
        position: absolute;
        bottom: 0px;
        top: 20%;
        cursor: none;
    }

    .head_Publicity-inner-right {
        right: 0;
    }

    .lockwit_zjm {
        width: 215px;
        height: 75px;
        /*width:21.5px;*/
        /*height:7.5px;*/
        display: inline-block;
        position: absolute;
        bottom: 13rem;
        left: 36%;
        margin-left: -107.5px;
        border:2px solid #ffffff ;
        font-size: 2rem;
        text-align: center;
        line-height: 4.5rem;
        color: #ffffff;
        /*padding: 34rem 59rem;*/
        /*-webkit-animation:play1-6 1.5s ease 1;*/
        /*animation:play1-6 1.5s ease 1;*/
        /*animation-fill-mode:forwards;*/
        /*-webkit-animation-fill-mode: forwards;*/
        /*animation-delay: 0.5s;*/
        /*-webkit-animation-delay: 0.5s;*/
        /*opacity: 0;*/
        opacity: 1;

        animation:myfirst 1.1s ease-out;
        animation-delay:1s;
        animation-fill-mode:both;
        -moz-animation:myfirst 1.1s ease-out; /* Firefox */
        -moz-animation-delay:1s;
        -moz-animation-fill-mode:both;
        -webkit-animation:myfirst 1.1s ease-out; /* Safari and Chrome */
        -webkit-animation-delay:1s;
        -webkit-animation-fill-mode:both;
        -o-animation:myfirst 1.1s ease-out; /* Opera */
        -o-animation-delay:1s;
        -o-animation-fill-mode:both;
    }
    @keyframes myfirst{
        0%{background:#ffffff;opacity: 0;width: 90px;height:0px;bottom: 55rem;left: 39.5%;font-size: 0;}
        28%{background:#ffffff;width: 90px;height:150px;bottom: 19rem;left: 39.5%;font-size: 0;}
        56%{background:#ffffff;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 39.5%;font-size: 0;}
        71%{background:#ffffff;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 39.5%;font-size: 0;}
        100%{font-size: 2rem;height:75px;width: 215px;height: 75px;}
    }
    @-moz-keyframes myfirst{
        0%{background:#ffffff;opacity: 0;width: 90px;height:0px;bottom: 55rem;left: 39.5%;font-size: 0;}
        28%{background:#ffffff;width: 90px;height:150px;bottom: 19rem;left: 39.5%;font-size: 0;}
        56%{background:#ffffff;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 39.5%;font-size: 0;}
        71%{background:#ffffff;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 39.5%;font-size: 0;}
        100%{font-size: 2rem;height:75px;width: 215px;height: 75px;}
    }

    @-webkit-keyframes myfirst{
        0%{background:#ffffff;opacity: 0;width: 90px;height:0px;bottom: 55rem;left: 39.5%;font-size: 0;}
        28%{background:#ffffff;width: 90px;height:150px;bottom: 19rem;left: 39.5%;font-size: 0;}
        56%{background:#ffffff;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 39.5%;font-size: 0;}
        71%{background:#ffffff;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 39.5%;font-size: 0;}
        100%{font-size: 2rem;height:75px;width: 215px;height: 75px;}
    }

    @-o-keyframes myfirst{
        0%{background:#ffffff;opacity: 0;width: 90px;height:0px;bottom: 55rem;left: 39.5%;font-size: 0;}
        28%{background:#ffffff;width: 90px;height:150px;bottom: 19rem;left: 39.5%;font-size: 0;}
        56%{background:#ffffff;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 39.5%;font-size: 0;}
        71%{background:#ffffff;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 39.5%;font-size: 0;}
        100%{font-size: 2rem;height:75px;width: 215px;height: 75px;}
    }

    /*@keyframes play1-6 {
        0% {
            opacity: 0;
            transform: scale(0);
            -webkit-transform: scale(0);
        }
        100% {
            opacity: 1;
            transform: scale(10, 10);
            -webkit-transform: scale(10, 10);
        }
    }*/

    #head_Publicity-inner ul li a {
        display: inline-block;
        width: 100%;
        height: 100%;
        background-size: 100% 100%;
        background-attachment: fixed;
    }

    #head_Publicity-inner ul>li:nth-of-type(1) a span:nth-of-type(1) {
        width: 444px;
        height: 48px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -79px -19px;
        margin-top: 20rem;
        -webkit-animation: play1-1 1.3s ease 1;
        animation: play1-1 1.3s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 1.2s;
        -webkit-animation-delay: 1.2s;
        opacity: 0;
        margin-left: -222px;
        left: 37%;
        /*font-size: 3.08rem;
        color: #ffffff;
        text-align: center;
        font-weight: 200;
        line-height: 2.32rem;*/
    }

    @keyframes play1-1 {
        0% {
            opacity: 0;
            transform: translateY(-100px);
            -webkit-transform: translateY(-100px);
        }
        100% {
            opacity: 1;
            transform: translateY(0px);
            -webkit-transform: translateY(0px);
        }
    }
    @-webkit-keyframes play1-1 {
        0% {
            opacity: 0;
            transform: translateY(-100px);
            -webkit-transform: translateY(-100px);
        }
        100% {
            opacity: 1;
            transform: translateY(0px);
            -webkit-transform: translateY(0px);
        }
    }

   @-o-keyframes play1-1 {
       0% {
           opacity: 0;
           transform: translateY(-100px);
           -webkit-transform: translateY(-100px);
       }
       100% {
           opacity: 1;
           transform: translateY(0px);
           -webkit-transform: translateY(0px);
       }
   }
   @-moz-keyframes play1-1 {
       0% {
           opacity: 0;
           transform: translateY(-100px);
           -webkit-transform: translateY(-100px);
       }
       100% {
           opacity: 1;
           transform: translateY(0px);
           -webkit-transform: translateY(0px);
       }
   }

    .head_Publicity-inner1_span2 {
        width: 365px;
        height: 24px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -112px -101px;
        margin: 23%;
        -webkit-animation: play1-2 1s ease 1;
        animation: play1-2 1s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 1s;
        -webkit-animation-delay: 1s;
        opacity: 0;
        left: 37%;
        margin-left: -182.5px;
    }

    @keyframes play1-2 {
        0% {
            opacity: 0;
            transform: translateY(-100px);
            -webkit-transform: translateY(-100px);
        }
        100% {
            opacity: 1;
            transform: translateY(0px);
            -webkit-transform: translateY(0px);
        }
    }
    @-webkit-keyframes play1-2 {
        0% {
            opacity: 0;
            transform: translateY(-100px);
            -webkit-transform: translateY(-100px);
        }
        100% {
            opacity: 1;
            transform: translateY(0px);
            -webkit-transform: translateY(0px);
        }
    }
    @-moz-keyframes play1-2 {
        0% {
            opacity: 0;
            transform: translateY(-100px);
            -webkit-transform: translateY(-100px);
        }
        100% {
            opacity: 1;
            transform: translateY(0px);
            -webkit-transform: translateY(0px);
        }
    }
    @-o-keyframes play1-2 {
        0% {
            opacity: 0;
            transform: translateY(-100px);
            -webkit-transform: translateY(-100px);
        }
        100% {
            opacity: 1;
            transform: translateY(0px);
            -webkit-transform: translateY(0px);
        }
    }
    #head_Publicity-inner ul>li:nth-of-type(2) a span:nth-of-type(1) {
        width: 523px;
        height: 50px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -34px -156px;
        margin-top: 20rem;
        -webkit-animation: play1-1 1.5s ease 1;
        animation: play1-1 1.5s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 0.5s;
        -webkit-animation-delay: 0.5s;
        opacity: 0;
        left: 37%;
        margin-left: -261.5px;
        /*font-size: 3.08rem;
    color: #ffffff;
    text-align: center;
    font-weight: 200;
    line-height: 2.32rem;*/
    }

    .head_Publicity-inner2_span2 {
        width: 204px;
        height: 25px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -190px -240px;
        margin-top: 25rem;
        left: 36%;
        margin-left: -102px;
        -webkit-animation: play1-2 1s ease 1;
        animation: play1-2 1s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 0.5s;
        -webkit-animation-delay: 0.5s;
    }

    #head_Publicity-inner ul>li:nth-of-type(3) a span:nth-of-type(1) {
        width: 544px;
        height: 48px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -28px -314px;
        margin-top: 20rem;
        left: 37%;
        margin-left: -272px;
        -webkit-animation: play1-1 1.5s ease 1;
        animation: play1-1 1.5s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 0.5s;
        -webkit-animation-delay: 0.5s;
        opacity: 0;
        /*font-size: 3.08rem;
    color: #ffffff;
    text-align: center;
    font-weight: 200;
    line-height: 2.32rem;*/

    }

    .head_Publicity-inner3_span2 {
        width: 252px;
        height: 25px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -158px -400px;
        margin-top: 25rem;
        left: 36%;
        margin-left: -126px;
        -webkit-animation: play1-2 2s ease 1;
        animation: play1-2 2s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 0.5s;
        -webkit-animation-delay: 0.5s;
    }

    .head_Publicity-inner1_span3 {
        width: 80px;
        height: 30px;
        display: block;
        position: absolute;
        left: 45%;
        top: 300px;
        background-color: #ffffff;
        -webkit-animation: play1-5 1s ease 1;
        animation: play1-5 1s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
    }


    /**/

    @keyframes play1-5 {
        0% {
            top: 0;
            width: 80px;
            height: 60px;
            opacity: 1;
        }
        50% {
            top: 300px;
            width: 80px;
            height: 7.5px;
            opacity: 1;
        }
        100% {
            top: 539px;
            width: 215px;
            height: 75px;
            opacity: 1;
            background: url("../image/Lockwit_web/lockwit_zjm.png");
        }
    }
    @-webkit-keyframes play1-5 {
        0% {
            top: 0;
            width: 80px;
            height: 60px;
            opacity: 1;
        }
        50% {
            top: 300px;
            width: 80px;
            height: 7.5px;
            opacity: 1;
        }
        100% {
            top: 539px;
            width: 215px;
            height: 75px;
            opacity: 1;
            background: url("../image/Lockwit_web/lockwit_zjm.png");
        }
    }

    #head_Publicity-left,
    #head_Publicity-right {
        position: absolute;
        top: 197px;
        display: none;
        height: 94px;
        width: 52px;
        /*background-color: rgba(0, 0, 0, 0.2);*/
        color: white;
        font-size: 20px;
        text-align: center;
        line-height: 60px;
        z-index: 1;
        cursor: none;
    }

    #head_Publicity-right {
        right: 0;
    }

    .items {
        position: absolute;
        display: inline-block;
        bottom: 5px;
        height: 20px;
        width: 100%;
        text-align: center;
        top: 300px;
    }


    /*.item{*/


    /*display: inline-block;*/


    /*width: 20px;*/


    /*height: 20px;*/


    /*background-color: #666666;*/


    /*border-radius: 10px;*/


    /*color: white;*/


    /*}*/


    /*.item:hover{*/


    /*background-color: red;*/


    /*}*/


    /*.item-selected{*/


    /*display: inline-block;*/


    /*width: 20px;*/


    /*height: 20px;*/


    /*background-color: red;*/


    /*border-radius: 10px;*/


    /*color: white;*/


    /*}*/


    /*------------------------------content--------------------------------*/

    .content {
        width: 100%;
        display: inline-block;
        position: absolute;
        float: left;
        top: 677px;
        z-index: 6;
    }

    .Content_Introduce {
        width: 100%;
        height: 587px;
        background-color: #ffffff;
        position: relative;
        float: left;
    }

    .Content_Introduce_n {
        width: 69rem;
        height: 75%;
        display: block;
        margin: 0 auto;
        position: relative;
        top: 5rem;
    }

    .Content_Introduce_n h1 {
        color: #1cb7e3;
        font-weight: 500;
        font-size: 28px;
        font-family: "Microsoft YaHei UI";
    }

    .Content_Introduce_n p {

        padding-top: 1rem;
        font-size: 14px;
        line-height: 2rem;
        margin-top:0;
    }

    .Content_Introduce_n p:nth-of-type(1) {
        color: #777777;
        font-size: 18px;
        padding: 0;
        margin-top: -1rem;
    }


    /*------------------------------------------------------------------------第二个轮播图---------------------------*/

    .Content_Product {
        width: 100%;
        height: 865px;
        display: inline-block;
        position: relative;
        float: left;
        background-color: #000000;
        overflow: hidden;
    }

    #canvas {
        display: block;
        position: absolute;
        width: 100%;
        height: 100%;
        float: left;
        top: 0;
    }


    /*-----------图---------------*/

    .swiper-container {
        width: 25%;
        height: 55%;
        position: relative;
        float: left;
        left: 15%;
        top: 58px;
        min-width: 215px;
        min-height: 323.75px;
    }

    .swiper-slide {
        text-align: center;
        font-size: 18px;
        /*background: #fff;*/
        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
    }

    .Content_Product-cont {
        width: 35%;
        height: 60%;
        min-width: 372.8px;
        min-height: 412px;
        display: block;
        position: absolute;
        float: left;
        left: 50%;
        top: 48px;
    }
    .swiper-slide img{
        width: 100%;
        height: 100%;
    }

    /*content的第三块*/

    .Content_Technical {
        width: 100%;
        min-width: 1200px;
        height: 603px;
        display: block;
        position: relative;
        float: left;
        background: url("../image/Lockwit_web/bg_4.jpg");
        background-size: 100% 100%;
        background-attachment: fixed;
        /*overflow: scroll;*/
    }

    .Content_Technical_biao {
        width: 386px;
        height: 156px;
        position: relative;
        display: inline-block;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -33px -10px;
        margin-top: 4rem;
        margin-left: 28rem;
    }

    .Content_Technical_ques {
        width: 80%;
        height: 306px;
        display: block;
        position: relative;
        float: left;
        left: 10%;
        margin-top: -1rem;
        color: #6e6e6e;
    }

    .Content_Technical_ques a {
        width: 120px;
        height: 234px;
        display: block;
        float: left;
        margin-left: 60px;
        margin-top: 44px;
        text-decoration: none;
    }


    /*--------------------------1----------------------*/

    .Content_Technical_ques a>span {
        width: 103px;
        height: 103px;
        display: block;
        float: left;
        position: relative;
    }

    .Content_Technical_ques a:nth-of-type(1)>span {

        display: block;
        margin: 0.5rem 1rem;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -124px -135px;
        background-size: 320px 754px;

    }

    .Content_Technical_ques a:nth-of-type(1)>span:hover {
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: 0px -136px;
        background-size: 320px 754px;
    }


    /*--------------------------2----------------------*/

    .Content_Technical_ques a:nth-of-type(2)>span {
        display: block;
        margin: 0.5rem 1rem;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -124px -266px;
        background-size: 320px 754px;
    }

    .Content_Technical_ques a:nth-of-type(2)>span:hover {
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: 0 -265px;
        background-size: 320px 754px;
    }


    /*--------------------------3----------------------*/

    .Content_Technical_ques a:nth-of-type(3)>span {
        display: block;
        margin: 0.5rem 1rem;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -122px -378px;
        background-size: 320px 754px;
    }

    .Content_Technical_ques a:nth-of-type(3)>span:hover {
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: 0 -378px;
        background-size: 320px 754px;
    }


    /*--------------------------4----------------------*/

    .Content_Technical_ques a:nth-of-type(4)>span {
        display: block;
        margin: 0.5rem 1rem;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -119px -488px;
        background-size: 320px 754px;
    }

    .Content_Technical_ques a:nth-of-type(4)>span:hover {
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: 0 -488px;
        background-size: 320px 754px;
    }


    /*--------------------------5----------------------*/

    .Content_Technical_ques a:nth-of-type(5)>span {
        display: block;
        margin: 0.5rem 1rem;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -119px -592px;
        background-size: 320px 754px;
    }

    .Content_Technical_ques a:nth-of-type(5)>span:hover {
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -6px -594px;
        background-size: 320px 754px;
    }

    .Content_Technical_ques a>span>h3 {
        width: 123px;
        height: 49px;
        display: block;
        position: relative;
        float: left;
        margin: 9rem 1rem;
        font-size: 18px;
    }


    /*------------------------------------------------------底部---------------------------------------------*/

    .footer {
        width: 100%;
        height: 450px;
        display: inline-block;
        position: relative;
        float: left;
        z-index: 7;
        background-color: #ffffff;
        /*background: url("../image/Lockwit_web/map.jpg");*/
        /*background-attachment: fixed;*/
    }

    .footer span:nth-of-type(1) {
        width: 23.5rem;
        height: 22.93rem;
        position: relative;
        display: block;
        left: 15%;
        margin-top: 75px;
    }

    .footer span:nth-of-type(1) h3 {
        font-weight: 500;
    }

    .footer span:nth-of-type(1) input {
        width: 310px;
        height: 31px;
        border: 1px solid #dde2ed;
        padding: 0;
        margin-top: 1rem;
    }

    .footer span:nth-of-type(1) textarea {
        width: 22.14rem;
        height: 8rem;
        border: 1px solid #dde2ed;
        padding: 0;
        margin-top: 1rem;
        resize: none;
    }

    .footer span:nth-of-type(1) button {
        width: 84px;
        height: 31px;
        background-color: #08c743;
        padding: 0;
        margin-top: 1rem;
        border: 0;
        color: #ffffff;
        font-weight: 600;
        font-size: 18px;
    }

    .footer span:nth-of-type(2) {
        width: 22.93rem;
        height: 21.07rem;
        position: absolute;
        display: inline-block;
        /*margin: 75px 400px;*/
        float: left;
        top: 75px;
        left: 50%;
        min-left:350px;
    }

    .footer span:nth-of-type(2) h6 {
        font-weight: 300;
        margin: 0.5rem;
    }

    .footer span:nth-of-type(2) h3 {
        font-weight: 500;
        margin: 0.5rem;
    }

    .footer span:nth-of-type(2) p {
        font-size: 13px;
        font-weight: 400;
        margin: 0.6rem;
        display: block;
        margin-top: 1rem;
    }

    .footer span:nth-of-type(2) p:nth-of-type(1) {
        display: block;
        margin-top: 2.2rem;
    }

    .footer span:nth-of-type(2) p:nth-of-type(5) {
        display: block;
        font-size: 14px;
        margin-top: 2.8rem;
    }

    .footer span:nth-of-type(3) {
        width: 156px;
        height: 201px;
        position: absolute;
        display: block;
        left: 80%;
        top: 75px;
    }

    .footer span:nth-of-type(3) h3 {
        font-weight: 500;
        margin: 0.5rem;
    }

    .footer span:nth-of-type(3) img {
        font-weight: 500;
        margin-top: 1.5rem;
        display: block;
    }

    .Content_Map {
        width: 100%;
        height: 495px;
        display: inline-block;
        position: relative;
        background: url("../image/Lockwit_web/map.jpg");
        background-size:100% 100% ;
    }

    .imga,.imgb,.imgc,.imgd,.imge {
        width: 250px;
        min-width: 150px;
        position: absolute;
        left: 48%;
        margin-top: 52px;

    }

    .img-none{
        display: none;

    }
    .cont_img-none{
        display: none;
    }
}
@media (max-width: 1001px) {
    body {
        padding: 0;
        margin: 0;
    }
    .chromeframe {
        margin: 0.2em 0;
        background: #ccc;
        color: #000;
        padding: 0.2em 0;
    }

    #loader-wrapper {
        position: fixed;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        z-index: 999999;
    }

    #loader {
        display: block;
        position: relative;
        left: 50%;
        top: 50%;
        width: 150px;
        height: 150px;
        margin: -75px 0 0 -75px;
        border-radius: 50%;
        border: 3px solid transparent;
        /* COLOR 1 */
        border-top-color: #FFF;
        -webkit-animation: spin 2s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -ms-animation: spin 2s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -moz-animation: spin 2s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -o-animation: spin 2s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        animation: spin 2s linear infinite;
        /* Chrome, Firefox 16+, IE 10+, Opera */
        z-index: 1001;
    }

    #loader:before {
        content: "";
        position: absolute;
        top: 5px;
        left: 5px;
        right: 5px;
        bottom: 5px;
        border-radius: 50%;
        border: 3px solid transparent;
        /* COLOR 2 */
        border-top-color: #FFF;
        -webkit-animation: spin 3s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -moz-animation: spin 3s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -o-animation: spin 3s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -ms-animation: spin 3s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        animation: spin 3s linear infinite;
        /* Chrome, Firefox 16+, IE 10+, Opera */
    }

    #loader:after {
        content: "";
        position: absolute;
        top: 15px;
        left: 15px;
        right: 15px;
        bottom: 15px;
        border-radius: 50%;
        border: 3px solid transparent;
        border-top-color: #FFF;
        /* COLOR 3 */
        -moz-animation: spin 1.5s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -o-animation: spin 1.5s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -ms-animation: spin 1.5s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        -webkit-animation: spin 1.5s linear infinite;
        /* Chrome, Opera 15+, Safari 5+ */
        animation: spin 1.5s linear infinite;
        /* Chrome, Firefox 16+, IE 10+, Opera */
    }

    @-webkit-keyframes spin {
        0% {
            -webkit-transform: rotate(0deg);
            /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(0deg);
            /* IE 9 */
            transform: rotate(0deg);
            /* Firefox 16+, IE 10+, Opera */
        }
        100% {
            -webkit-transform: rotate(360deg);
            /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(360deg);
            /* IE 9 */
            transform: rotate(360deg);
            /* Firefox 16+, IE 10+, Opera */
        }
    }

    @keyframes spin {
        0% {
            -webkit-transform: rotate(0deg);
            /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(0deg);
            /* IE 9 */
            transform: rotate(0deg);
            /* Firefox 16+, IE 10+, Opera */
        }
        100% {
            -webkit-transform: rotate(360deg);
            /* Chrome, Opera 15+, Safari 3.1+ */
            -ms-transform: rotate(360deg);
            /* IE 9 */
            transform: rotate(360deg);
            /* Firefox 16+, IE 10+, Opera */
        }
    }

    #loader-wrapper .loader-section {
        position: fixed;
        top: 0;
        width: 51%;
        height: 100%;
        background: #000000;
        /* Old browsers */
        z-index: 1000;
        -webkit-transform: translateX(0);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateX(0);
        /* IE 9 */
        transform: translateX(0);
        /* Firefox 16+, IE 10+, Opera */
    }

    #loader-wrapper .loader-section.section-left {
        left: 0;
    }

    #loader-wrapper .loader-section.section-right {
        right: 0;
    }


    /* Loaded */

    .loaded #loader-wrapper .loader-section.section-left {
        -webkit-transform: translateX(-100%);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateX(-100%);
        /* IE 9 */
        transform: translateX(-100%);
        /* Firefox 16+, IE 10+, Opera */
        -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
        transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
    }

    .loaded #loader-wrapper .loader-section.section-right {
        -webkit-transform: translateX(100%);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateX(100%);
        /* IE 9 */
        transform: translateX(100%);
        /* Firefox 16+, IE 10+, Opera */
        -webkit-transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
        transition: all 0.7s 0.3s cubic-bezier(0.645, 0.045, 0.355, 1.000);
    }

    .loaded #loader {
        opacity: 0;
        -webkit-transition: all 0.3s ease-out;
        transition: all 0.3s ease-out;
    }

    .loaded #loader-wrapper {
        visibility: hidden;
        -webkit-transform: translateY(-100%);
        /* Chrome, Opera 15+, Safari 3.1+ */
        -ms-transform: translateY(-100%);
        /* IE 9 */
        transform: translateY(-100%);
        /* Firefox 16+, IE 10+, Opera */
        -webkit-transition: all 0.3s 1s ease-out;
        transition: all 0.3s 1s ease-out;
    }


    /* JavaScript Turned Off */

    .no-js #loader-wrapper {
        display: none;
    }

    .no-js h1 {
        color: #222222;
    }

    #loader-wrapper .load_title {
        font-family: 'Open Sans';
        color: #FFF;
        font-size: 19px;
        width: 100%;
        text-align: center;
        z-index: 9999999999999;
        position: absolute;
        top: 60%;
        opacity: 1;
        line-height: 30px;
    }

    #loader-wrapper .load_title span {
        font-weight: normal;
        font-style: italic;
        font-size: 13px;
        color: #FFF;
        opacity: 0.5;
    }


    /*--------------------------------------------导航栏-----------------------------*/

    .head {
        width: 100%;
        display: block;
        position: relative;
        float: left;
        z-index: 100;
        /*min-width: 1720px;*/
    }

    .head_nav {
        width: 100%;
        height: 120px;
        display: block;
        position: fixed;
        float: left;
        /*background-color: #000000;*/
        z-index: 1;
    }

    .head_nav_more {
        width: 100%;
        height: 100%;
        display: none;
        position: absolute;
        float: left;
        background-color: #ffffff;
        z-index: 10;

    }

    .nav_icon {
        display: block;
        position: relative;
        float: right;
        padding: 2.8rem 3.3rem;
        z-index: 2;
    }

    .head_nav_more_one {
        width: 70%;
        height: 100%;
        /*background-color: #000000;*/
        position: absolute;
        display: block;
        margin-left: 30%;
        margin-top: 5%;
    }

    .head_nav_more_one a {
        display: block;
        text-decoration: none;
    }

    .head_nav_more_one>ul>li {
        width: 140px;
        float: left;
        text-align: center;
        margin-top: 1.4rem;
        display: block;
        position: relative;
    }

    .head_nav_more_one>ul>li>a {
        width: 100%;
        height: 73px;
    }

    .head_nav_more_one li ul.sub-menu {
        list-style: none;
        display: none;
        padding-left: 0 !important;
    }

    .sub-menu {
        background-color: #ffffff;
    }

    .sub-menu li {
        height: 2.2rem;
        color: #ffffff;
        background-color: #ffffff;
    }

    .sub-menu li>a {
        color: #575757;
        text-decoration: none;
    }

    .sub-menu li:hover {
        background-color: #ee9d4b;
    }

    .sub-menu li:hover a {
        color: white;
        text-decoration: none;
    }

    .head_nav_more_one>ul {
        margin-left: 10rem;
        display: block;
        list-style: none;
    }

    .head_nav_more_one_Home,
    .head_nav_more_one_Programming,
    .head_nav_more_one_ji,
    .head_nav_more_one_lian {
        width: 100%;
        height: 73px;
        display: block;
    }


    /*.head_nav_more_one_Home{*/


    /*background: url("../image/Lockwit_web/nav_1 .png");*/


    /*}*/


    /*.head_nav_more_one_Programming{*/


    /*background: url("../image/Lockwit_web/nav_2.png");*/


    /*}*/


    /*.head_nav_more_one_ji{*/


    /*background: url("../image/Lockwit_web/nav_3.png");*/


    /*}*/


    /*.head_nav_more_one_lian{*/


    /*background: url("../image/Lockwit_web/nav_4.png");*/


    /*}*/

    a img {
        border: 0
    }

    ul,
    ol,
    li {
        list-style-type: none;
        vertical-align: 0
    }

    a {
        outline-style: none;
        color: #535353;
        text-decoration: none
    }

    a:hover {
        /*color: #D40000;*/
        text-decoration: none
    }

    .clear {
        height: 0;
        overflow: hidden;
        clear: both
    }

    header {
        height: 100px;
    }

    input {
        border: none;
    }

    .button {
        display: inline-block;
        zoom: 1;
        *display: inline;
        vertical-align: baseline;
        margin: 0 2px;
        outline: none;
        cursor: pointer;
        text-align: center;
        text-decoration: none;
        font: 14px/100% Arial, Helvetica, sans-serif;
        padding: 0.25em 0.6em 0.3em;
        /*text-shadow: 0 1px 1px rgba(0, 0, 0, .3);*/
        -webkit-border-radius: .5em;
        -moz-border-radius: .5em;
        border-radius: .5em;
        /*-webkit-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);*/
        /*-moz-box-shadow: 0 1px 2px rgba(0, 0, 0, .2);*/
        /*box-shadow: 0 1px 2px rgba(0, 0, 0, .2);*/
    }


    /*restCSS结束，应用特效时，以上样式可删除*/


    /* 需要的css样式 */

    .nav {
        width: 970px;
        margin: 0 auto;
        text-align: center;
    }

    .menu,
    .menu ul {
        list-style: none;
        padding: 0;
        margin: 0;
    }

    .menu {
        height: 58px;
        /*margin-top: 50px;*/
        position: absolute;
    }

    .menu li {
        background-color: #ffffff;
        /*border-bottom: 2px solid #181818;*/
        /*border-top: 2px solid #303030;*/
        min-width: 140px;
        /*max-width: 160px;*/
        font-family: "Adobe Caslon Pro";
    }

    .menu>li {
        display: block;
        float: left;
        position: relative;
    }

    .menu>li:first-child {
        border-radius: 5px 0 0;
    }

    .menu a {
        border-left: 3px solid rgba(0, 0, 0, 0);
        /*background: url("../img/back.jpg");*/
        color: #808080;
        display: block;
        font-size: 18px;
        line-height: 54px;
        padding: 0 25px;
        text-decoration: none;
        text-transform: uppercase;
    }

    .menu li:hover {
        /*background-color: #1c1c1c;*/
        /*background: -moz-linear-gradient(#1c1c1c, #1b1b1b);*/
        /*background: -ms-linear-gradient(#1c1c1c, #1b1b1b);*/
        /*background: -webkit-gradient(linear, left top, left bottom, color-stop(0%, #1c1c1c), color-stop(100%, #1b1b1b));*/
        /*background: -webkit-linear-gradient(#1c1c1c, #1b1b1b);*/
        /*background: -o-linear-gradient(#1c1c1c, #1b1b1b);*/
        filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#1c1c1c', endColorstr='#1b1b1b');
        -ms-filter: "progid:DXImageTransform.Microsoft.gradient(startColorstr='#1c1c1c', endColorstr='#1b1b1b')";
        /*background: linear-gradient(#1c1c1c, #1b1b1b);*/
        /*border-bottom: 2px solid #222222;*/
        /*border-top: 2px solid #1B1B1B;*/
        /*改变加深父元素的背景*/
    }

    .menu li:hover>a {
        border-radius: 5px 0 0 0;
        /*border-left: 3px solid #C4302B;*/
        color: #00b6ff;
    }

    .submenu {
        left: 0;
        max-height: 0;
        position: absolute;
        top: 100%;
        z-index: 0;
        -webkit-perspective: 400px;
        -moz-perspective: 400px;
        -ms-perspective: 400px;
        -o-perspective: 400px;
        perspective: 400px;
    }

    .submenu li {
        opacity: 0;
        -webkit-transform: rotateY(90deg);
        -moz-transform: rotateY(90deg);
        -ms-transform: rotateY(90deg);
        -o-transform: rotateY(90deg);
        transform: rotateY(90deg);
        -webkit-transition: opacity .4s, -webkit-transform .5s;
        -moz-transition: opacity .4s, -moz-transform .5s;
        -ms-transition: opacity .4s, -ms-transform .5s;
        -o-transition: opacity .4s, -o-transform .5s;
        transition: opacity .4s, transform .5s;
        /*实现下拉菜单螺旋淡出*/
    }

    .menu .submenu li:hover a {
        /*border-left: 3px solid #454545;*/
        border-radius: 0;
        /*color: #ffffff;*/
    }

    .menu>li:hover .submenu,
    .menu>li:focus .submenu {
        max-height: 2000px;
        z-index: 10;
    }

    .menu>li:hover .submenu li,
    .menu>li:focus .submenu li {
        opacity: 1;
        -webkit-transform: none;
        -moz-transform: none;
        -ms-transform: none;
        -o-transform: none;
        transform: none;
    }


    /*动画递进的时间 实现一个个螺旋子菜单*/

    .menu li:hover .submenu li:nth-child(1) {
        -webkit-transition-delay: 0s;
        -moz-transition-delay: 0s;
        -ms-transition-delay: 0s;
        -o-transition-delay: 0s;
        transition-delay: 0s;
    }

    .menu li:hover .submenu li:nth-child(2) {
        -webkit-transition-delay: 50ms;
        -moz-transition-delay: 50ms;
        -ms-transition-delay: 50ms;
        -o-transition-delay: 50ms;
        transition-delay: 50ms;
    }

    .menu li:hover .submenu li:nth-child(3) {
        -webkit-transition-delay: 100ms;
        -moz-transition-delay: 100ms;
        -ms-transition-delay: 100ms;
        -o-transition-delay: 100ms;
        transition-delay: 100ms;
    }

    .menu li:hover .submenu li:nth-child(4) {
        -webkit-transition-delay: 150ms;
        -moz-transition-delay: 150ms;
        -ms-transition-delay: 150ms;
        -o-transition-delay: 150ms;
        transition-delay: 150ms;
    }

    .menu li:hover .submenu li:nth-child(5) {
        -webkit-transition-delay: 200ms;
        -moz-transition-delay: 200ms;
        -ms-transition-delay: 200ms;
        -o-transition-delay: 200ms;
        transition-delay: 200ms;
    }

    .menu li:hover .submenu li:nth-child(6) {
        -webkit-transition-delay: 250ms;
        -moz-transition-delay: 250ms;
        -ms-transition-delay: 250ms;
        -o-transition-delay: 250ms;
        transition-delay: 250ms;
    }

    .menu li:hover .submenu li:nth-child(7) {
        -webkit-transition-delay: 300ms;
        -moz-transition-delay: 300ms;
        -ms-transition-delay: 300ms;
        -o-transition-delay: 300ms;
        transition-delay: 300ms;
    }

    .menu li:hover .submenu li:nth-child(8) {
        -webkit-transition-delay: 350ms;
        -moz-transition-delay: 350ms;
        -ms-transition-delay: 350ms;
        -o-transition-delay: 350ms;
        transition-delay: 350ms;
    }

    .submenu li:nth-child(1) {
        -webkit-transition-delay: 350ms;
        -moz-transition-delay: 350ms;
        -ms-transition-delay: 350ms;
        -o-transition-delay: 350ms;
        transition-delay: 350ms;
    }

    .submenu li:nth-child(2) {
        -webkit-transition-delay: 300ms;
        -moz-transition-delay: 300ms;
        -ms-transition-delay: 300ms;
        -o-transition-delay: 300ms;
        transition-delay: 300ms;
    }

    .submenu li:nth-child(3) {
        -webkit-transition-delay: 250ms;
        -moz-transition-delay: 250ms;
        -ms-transition-delay: 250ms;
        -o-transition-delay: 250ms;
        transition-delay: 250ms;
    }

    .submenu li:nth-child(4) {
        -webkit-transition-delay: 200ms;
        -moz-transition-delay: 200ms;
        -ms-transition-delay: 200ms;
        -o-transition-delay: 200ms;
        transition-delay: 200ms;
    }

    .submenu li:nth-child(5) {
        -webkit-transition-delay: 150ms;
        -moz-transition-delay: 150ms;
        -ms-transition-delay: 150ms;
        -o-transition-delay: 150ms;
        transition-delay: 150ms;
    }

    .submenu li:nth-child(6) {
        -webkit-transition-delay: 100ms;
        -moz-transition-delay: 100ms;
        -ms-transition-delay: 100ms;
        -o-transition-delay: 100ms;
        transition-delay: 100ms;
    }

    .submenu li:nth-child(7) {
        -webkit-transition-delay: 50ms;
        -moz-transition-delay: 50ms;
        -ms-transition-delay: 50ms;
        -o-transition-delay: 50ms;
        transition-delay: 50ms;
    }

    .submenu li:nth-child(8) {
        -webkit-transition-delay: 0s;
        -moz-transition-delay: 0s;
        -ms-transition-delay: 0s;
        -o-transition-delay: 0s;
        transition-delay: 0s;
    }
    .menu_znms{
        background: url("../image/Lockwit_web/nav_2.png") no-repeat 15px -15px;

    }

    /*-------------------------------------轮播图-------------------------------------*/

    #head_Publicity {
        float: left;
        margin: 0 auto;
        display: inline-block;
        position: absolute;
        width: 100%;
        /*height: 897px;*/
        /*margin-top: 120px;*/
        z-index: -1;
    }

    .head_Publicity_animation_1 {
        width: 32px;
        height: 20px;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -268px -440px;
        position: absolute;
        bottom: 15px;
        left:49%;
        -webkit-animation: play1-4 2s linear infinite;
        animation: play1-4 2s linear infinite;
    }

    @keyframes play1-4 {
        0% {
            transform: translateY(0);
            -webkit-transform: translateY(0);
            opacity: 1;
        }
        100% {
            transform: translateY(25px);
            -webkit-transform: translateY(25px);
            opacity: 0;
        }
    }

    #head_Publicity-inner {
        position: relative;
        height: 100%;
        overflow: hidden;
    }

    #head_Publicity-inner ul {
        margin: 0;
        padding: 0;
        list-style-type: none;
    }

    #head_Publicity-inner ul li {
        display: inline-block;
        width: 100%;
        height: 100%;
        z-index: -1;
        position: absolute;
        top: 0;
        min-height: 777px;
        /*min-width: 1720px;*/
    }

    #head_Publicity-inner ul>li:nth-of-type(1) {
        z-index: -1;
    }

    #head_Publicity-inner ul>li:nth-of-type(2) {
        z-index: -2;
    }

    #head_Publicity-inner ul>li:nth-of-type(3) {
        z-index: -3;
    }

    #head_Publicity-inner ul>li:nth-of-type(1) a {
        display: inline-block;
        position: absolute;
    }

    #head_Publicity-inner ul li a {
        display: inline-block;
        width: 100%;
        height: 100%;
        background-size: 100% 100%;
        background-attachment: fixed;
    }

    .head_Publicity-inner-left,
    .head_Publicity-inner-right {
        width: 35%;
        height: 70%;
        display: block;
        position: absolute;
        bottom: 0px;
        top: 20%;
        cursor: none;
    }

    .head_Publicity-inner-right {
        right: 0;
    }

    .lockwit_zjm {
        width: 215px;
        height: 75px;
        /*width:21.5px;*/
        /*height:7.5px;*/
        display: inline-block;
        position: absolute;
        bottom: 13rem;
        left: 50%;
        margin-left: -107.5px;
        border:2px solid #ffffff ;
        font-size: 2rem;
        text-align: center;
        line-height: 4.5rem;
        color: #ffffff;
        /*padding: 34rem 59rem;*/
        /*-webkit-animation:play1-6 1.5s ease 1;*/
        /*animation:play1-6 1.5s ease 1;*/
        /*animation-fill-mode:forwards;*/
        /*-webkit-animation-fill-mode: forwards;*/
        /*animation-delay: 0.5s;*/
        /*-webkit-animation-delay: 0.5s;*/
        /*opacity: 0;*/
        opacity: 1;

        animation:myfirst 1.1s ease-out;
        animation-delay:1s;
        animation-fill-mode:both;
        -moz-animation:myfirst 1.1s ease-out; /* Firefox */
        -moz-animation-delay:1s;
        -moz-animation-fill-mode:both;
        -webkit-animation:myfirst 1.1s ease-out; /* Safari and Chrome */
        -webkit-animation-delay:1s;
        -webkit-animation-fill-mode:both;
        -o-animation:myfirst 1.1s ease-out; /* Opera */
        -o-animation-delay:1s;
        -o-animation-fill-mode:both;
    }
    @keyframes myfirst{
        0%{background:#ffffff;opacity: 0;width: 90px;height:0px;bottom: 55rem;left: 55%;font-size: 0;}
        28%{background:#ffffff;width: 90px;height:150px;bottom: 19rem;left: 55%;font-size: 0;}
        56%{background:#ffffff;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 55%;font-size: 0;}
        71%{background:#ffffff;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 55%;font-size: 0;}
        100%{font-size: 2rem;height:75px;width: 215px;height: 75px;}
    }
    @-moz-keyframes myfirst{
        0%{background:#ffffff;opacity: 0;width: 90px;height:0px;bottom: 55rem;left: 55%;font-size: 0;}
        28%{background:#ffffff;width: 90px;height:150px;bottom: 19rem;left: 55%;font-size: 0;}
        56%{background:#ffffff;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 55%;font-size: 0;}
        71%{background:#ffffff;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 55%;font-size: 0;}
        100%{font-size: 2rem;height:75px;width: 215px;height: 75px;}
    }

    @-webkit-keyframes myfirst{
        0%{background:#ffffff;opacity: 0;width: 90px;height:0px;bottom: 55rem;left: 55%;font-size: 0;}
        28%{background:#ffffff;width: 90px;height:150px;bottom: 19rem;left: 55%;font-size: 0;}
        56%{background:#ffffff;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 55%;font-size: 0;}
        71%{background:#ffffff;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 55%;font-size: 0;}
        100%{font-size: 2rem;height:75px;width: 215px;height: 75px;}
    }

    @-o-keyframes myfirst{
        0%{background:#ffffff;opacity: 0;width: 90px;height:0px;bottom: 55rem;left: 55%;font-size: 0;}
        28%{background:#ffffff;width: 90px;height:150px;bottom: 19rem;left: 55%;font-size: 0;}
        56%{background:#ffffff;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 55%;font-size: 0;}
        71%{background:#ffffff;opacity: 1;width: 90px;bottom: 19rem;height:5px;left: 55%;font-size: 0;}
        100%{font-size: 2rem;height:75px;width: 215px;height: 75px;}
    }

    /*@keyframes play1-6 {
        0% {
            opacity: 0;
            transform: scale(0);
            -webkit-transform: scale(0);
        }
        100% {
            opacity: 1;
            transform: scale(10, 10);
            -webkit-transform: scale(10, 10);
        }
    }*/

    #head_Publicity-inner ul li a {
        display: inline-block;
        width: 100%;
        height: 100%;
        background-size: 100% 765px;
        background-attachment: fixed;
    }

    #head_Publicity-inner ul>li:nth-of-type(1) a span:nth-of-type(1) {
        width: 444px;
        height: 48px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -79px -19px;
        margin-top: 20rem;
        -webkit-animation: play1-1 1.3s ease 1;
        animation: play1-1 1.3s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 1.2s;
        -webkit-animation-delay: 1.2s;
        opacity: 0;
        margin-left: -222px;
        left: 50%;
        /*font-size: 3.08rem;
        color: #ffffff;
        text-align: center;
        font-weight: 200;
        line-height: 2.32rem;*/
    }

    @keyframes play1-1 {
        0% {
            opacity: 0;
            transform: translateY(-100px);
            -webkit-transform: translateY(-100px);
        }
        100% {
            opacity: 1;
            transform: translateY(0px);
            -webkit-transform: translateY(0px);
        }
    }
    @-webkit-keyframes play1-1 {
        0% {
            opacity: 0;
            transform: translateY(-100px);
            -webkit-transform: translateY(-100px);
        }
        100% {
            opacity: 1;
            transform: translateY(0px);
            -webkit-transform: translateY(0px);
        }
    }

    @-o-keyframes play1-1 {
        0% {
            opacity: 0;
            transform: translateY(-100px);
            -webkit-transform: translateY(-100px);
        }
        100% {
            opacity: 1;
            transform: translateY(0px);
            -webkit-transform: translateY(0px);
        }
    }
    @-moz-keyframes play1-1 {
        0% {
            opacity: 0;
            transform: translateY(-100px);
            -webkit-transform: translateY(-100px);
        }
        100% {
            opacity: 1;
            transform: translateY(0px);
            -webkit-transform: translateY(0px);
        }
    }

    .head_Publicity-inner1_span2 {
        width: 365px;
        height: 24px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -112px -101px;
        margin-top: 40%;
        -webkit-animation: play1-2 1s ease 1;
        animation: play1-2 1s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 1s;
        -webkit-animation-delay: 1s;
        opacity: 0;
        left: 50%;
        margin-left: -182.5px;
    }

    @keyframes play1-2 {
        0% {
            opacity: 0;
            transform: translateY(-100px);
            -webkit-transform: translateY(-100px);
        }
        100% {
            opacity: 1;
            transform: translateY(0px);
            -webkit-transform: translateY(0px);
        }
    }
    @-webkit-keyframes play1-2 {
        0% {
            opacity: 0;
            transform: translateY(-100px);
            -webkit-transform: translateY(-100px);
        }
        100% {
            opacity: 1;
            transform: translateY(0px);
            -webkit-transform: translateY(0px);
        }
    }
    @-moz-keyframes play1-2 {
        0% {
            opacity: 0;
            transform: translateY(-100px);
            -webkit-transform: translateY(-100px);
        }
        100% {
            opacity: 1;
            transform: translateY(0px);
            -webkit-transform: translateY(0px);
        }
    }
    @-o-keyframes play1-2 {
        0% {
            opacity: 0;
            transform: translateY(-100px);
            -webkit-transform: translateY(-100px);
        }
        100% {
            opacity: 1;
            transform: translateY(0px);
            -webkit-transform: translateY(0px);
        }
    }
    #head_Publicity-inner ul>li:nth-of-type(2) a span:nth-of-type(1) {
        width: 523px;
        height: 50px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -34px -156px;
        margin-top: 20rem;
        -webkit-animation: play1-1 1.5s ease 1;
        animation: play1-1 1.5s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 0.5s;
        -webkit-animation-delay: 0.5s;
        opacity: 0;
        left: 50%;
        margin-left: -261.5px;
        /*font-size: 3.08rem;
    color: #ffffff;
    text-align: center;
    font-weight: 200;
    line-height: 2.32rem;*/
    }

    .head_Publicity-inner2_span2 {
        width: 204px;
        height: 25px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -190px -240px;
        margin-top: 25rem;
        left: 50%;
        margin-left: -102px;
        -webkit-animation: play1-2 1s ease 1;
        animation: play1-2 1s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 0.5s;
        -webkit-animation-delay: 0.5s;
    }

    #head_Publicity-inner ul>li:nth-of-type(3) a span:nth-of-type(1) {
        width: 544px;
        height: 48px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -28px -314px;
        margin-top: 20rem;
        left: 50%;
        margin-left: -272px;
        -webkit-animation: play1-1 1.5s ease 1;
        animation: play1-1 1.5s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 0.5s;
        -webkit-animation-delay: 0.5s;
        opacity: 0;
        /*font-size: 3.08rem;
    color: #ffffff;
    text-align: center;
    font-weight: 200;
    line-height: 2.32rem;*/

    }

    .head_Publicity-inner3_span2 {
        width: 252px;
        height: 25px;
        display: inline-block;
        position: absolute;
        background: url("../image/Lockwit_web/lock_title.png");
        background-position: -158px -400px;
        margin-top: 25rem;
        left: 50%;
        margin-left: -126px;
        -webkit-animation: play1-2 2s ease 1;
        animation: play1-2 2s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
        animation-delay: 0.5s;
        -webkit-animation-delay: 0.5s;
    }

    .head_Publicity-inner1_span3 {
        width: 80px;
        height: 30px;
        display: block;
        position: absolute;
        left: 45%;
        top: 300px;
        background-color: #ffffff;
        -webkit-animation: play1-5 1s ease 1;
        animation: play1-5 1s ease 1;
        animation-fill-mode: forwards;
        -webkit-animation-fill-mode: forwards;
    }


    /**/

    @keyframes play1-5 {
        0% {
            top: 0;
            width: 80px;
            height: 60px;
            opacity: 1;
        }
        50% {
            top: 300px;
            width: 80px;
            height: 7.5px;
            opacity: 1;
        }
        100% {
            top: 539px;
            width: 215px;
            height: 75px;
            opacity: 1;
            background: url("../image/Lockwit_web/lockwit_zjm.png");
        }
    }
    @-webkit-keyframes play1-5 {
        0% {
            top: 0;
            width: 80px;
            height: 60px;
            opacity: 1;
        }
        50% {
            top: 300px;
            width: 80px;
            height: 7.5px;
            opacity: 1;
        }
        100% {
            top: 539px;
            width: 215px;
            height: 75px;
            opacity: 1;
            background: url("../image/Lockwit_web/lockwit_zjm.png");
        }
    }

    #head_Publicity-left,
    #head_Publicity-right {
        position: absolute;
        top: 197px;
        display: none;
        height: 94px;
        width: 52px;
        /*background-color: rgba(0, 0, 0, 0.2);*/
        color: white;
        font-size: 20px;
        text-align: center;
        line-height: 60px;
        z-index: 1;
        cursor: none;
    }

    #head_Publicity-right {
        right: 0;
    }

    .items {
        position: absolute;
        display: inline-block;
        bottom: 5px;
        height: 20px;
        width: 100%;
        text-align: center;
        top: 300px;
    }


    /*.item{*/


    /*display: inline-block;*/


    /*width: 20px;*/


    /*height: 20px;*/


    /*background-color: #666666;*/


    /*border-radius: 10px;*/


    /*color: white;*/


    /*}*/


    /*.item:hover{*/


    /*background-color: red;*/


    /*}*/


    /*.item-selected{*/


    /*display: inline-block;*/


    /*width: 20px;*/


    /*height: 20px;*/


    /*background-color: red;*/


    /*border-radius: 10px;*/


    /*color: white;*/


    /*}*/


    /*------------------------------content--------------------------------*/

    .content {
        width: 100%;
        display: inline-block;
        position: absolute;
        float: left;
        top: 677px;
        z-index: 6;
    }

    .Content_Introduce {
        width: 100%;
        height: 635px;
        background-color: #ffffff;
        position: relative;
        float: left;
    }

    .Content_Introduce_n {
        width: 80%;
        height: 75%;
        display: block;
        margin: 0 auto;
        position: relative;
        top: 5rem;
    }

    .Content_Introduce_n h1 {
        color: #1cb7e3;
        font-weight: 500;
        font-size: 28px;
        font-family: "Microsoft YaHei UI";
    }

    .Content_Introduce_n p {

        padding-top: 1rem;
        font-size: 14px;
        line-height: 2rem;
        margin-top:0;
    }

    .Content_Introduce_n p:nth-of-type(1) {
        color: #777777;
        font-size: 18px;
        padding: 0;
        margin-top: -1rem;
    }


    /*------------------------------------------------------------------------第二个轮播图---------------------------*/

    .Content_Product {
        width: 100%;
        height: 665px;
        display: inline-block;
        position: relative;
        float: left;
        background-color: #000000;
        overflow: hidden;
    }
    .Content_Product a{
        display: block;
        text-decoration: none;
        position: relative;
        left: 4%;
    }
    #canvas {
        display: block;
        position: absolute;
        width: 100%;
        height: 100%;
        float: left;
        top: 0;
    }


    /*-----------图---------------*/

    .swiper-container {
        width: 25%;
        height: 55%;
        position: relative;
        float: left;
        left: 15%;
        top: 58px;
        min-width: 215px;
        min-height: 323.75px;
    }

    .swiper-slide {
        text-align: center;
        font-size: 18px;
        /*background: #fff;*/
        /* Center slide text vertically */
        display: -webkit-box;
        display: -ms-flexbox;
        display: -webkit-flex;
        display: flex;
        -webkit-box-pack: center;
        -ms-flex-pack: center;
        -webkit-justify-content: center;
        justify-content: center;
        -webkit-box-align: center;
        -ms-flex-align: center;
        -webkit-align-items: center;
        align-items: center;
    }

    .Content_Product-cont {
        width: 40%;
        height: 60%;
        min-width: 372.8px;
        min-height: 412px;
        display: block;
        position: absolute;
        float: left;
        left: 50%;
        top: 48px;
    }
    .swiper-slide img{
        width: 100%;
        height: 100%;
    }

    /*content的第三块*/

    .Content_Technical {
        width: 100%;
        /*min-width: 1200px;*/
        height: 603px;
        display: block;
        position: relative;
        float: left;
        background: url("../image/Lockwit_web/bg_4.jpg");
        background-size: 100% 603px;
        background-attachment: fixed;
        /*overflow: scroll;*/
    }

    .Content_Technical_biao {
        width: 386px;
        height: 156px;
        position: relative;
        display: inline-block;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -33px -10px;
        margin-top: 4rem;
        margin-left: 21rem;
    }

    .Content_Technical_ques {
        width: 80%;
        height: 306px;
        display: block;
        position: relative;
        float: left;
        left: 10%;
        margin-top: -1rem;
        color: #6e6e6e;
    }

    .Content_Technical_ques a {
        width: 120px;
        height: 234px;
        display: block;
        float: left;
        margin-left: 30px;
        margin-top: 44px;
        text-decoration: none;
    }


    /*--------------------------1----------------------*/

    .Content_Technical_ques a>span {
        width: 103px;
        height: 103px;
        display: block;
        float: left;
        position: relative;
    }

    .Content_Technical_ques a:nth-of-type(1)>span {

        display: block;
        margin: 0.5rem 1rem;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -124px -135px;
        background-size: 320px 754px;

    }

    .Content_Technical_ques a:nth-of-type(1)>span:hover {
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: 0px -136px;
        background-size: 320px 754px;
    }


    /*--------------------------2----------------------*/

    .Content_Technical_ques a:nth-of-type(2)>span {
        display: block;
        margin: 0.5rem 1rem;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -124px -266px;
        background-size: 320px 754px;
    }

    .Content_Technical_ques a:nth-of-type(2)>span:hover {
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: 0 -265px;
        background-size: 320px 754px;
    }


    /*--------------------------3----------------------*/

    .Content_Technical_ques a:nth-of-type(3)>span {
        display: block;
        margin: 0.5rem 1rem;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -122px -378px;
        background-size: 320px 754px;
    }

    .Content_Technical_ques a:nth-of-type(3)>span:hover {
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: 0 -378px;
        background-size: 320px 754px;
    }


    /*--------------------------4----------------------*/

    .Content_Technical_ques a:nth-of-type(4)>span {
        display: block;
        margin: 0.5rem 1rem;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -119px -488px;
        background-size: 320px 754px;
    }

    .Content_Technical_ques a:nth-of-type(4)>span:hover {
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: 0 -488px;
        background-size: 320px 754px;
    }


    /*--------------------------5----------------------*/

    .Content_Technical_ques a:nth-of-type(5)>span {
        display: block;
        margin: 0.5rem 1rem;
        float: left;
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -119px -592px;
        background-size: 320px 754px;
    }

    .Content_Technical_ques a:nth-of-type(5)>span:hover {
        background: url("../image/Lockwit_web/Technical_pic.png");
        background-position: -6px -594px;
        background-size: 320px 754px;
    }

    .Content_Technical_ques a>span>h3 {
        width: 123px;
        height: 49px;
        display: block;
        position: relative;
        float: left;
        margin: 9rem 1rem;
        font-size: 18px;
    }


    /*------------------------------------------------------底部---------------------------------------------*/

    .footer {
        width: 100%;
        height: 450px;
        display: inline-block;
        position: relative;
        float: left;
        z-index: 7;
        background-color: #ffffff;
        /*background: url("../image/Lockwit_web/map.jpg");*/
        /*background-attachment: fixed;*/
    }

    .footer span:nth-of-type(1) {
        width: 23.5rem;
        height: 22.93rem;
        position: relative;
        display: block;
        left: 8%;
        margin-top: 75px;
    }

    .footer span:nth-of-type(1) h3 {
        font-weight: 500;
    }

    .footer span:nth-of-type(1) input {
        width: 310px;
        height: 31px;
        border: 1px solid #dde2ed;
        padding: 0;
        margin-top: 1rem;
    }

    .footer span:nth-of-type(1) textarea {
        width: 22.14rem;
        height: 8rem;
        border: 1px solid #dde2ed;
        padding: 0;
        margin-top: 1rem;
        resize: none;
    }

    .footer span:nth-of-type(1) button {
        width: 84px;
        height: 31px;
        background-color: #08c743;
        padding: 0;
        margin-top: 1rem;
        border: 0;
        color: #ffffff;
        font-weight: 600;
        font-size: 18px;
    }

    .footer span:nth-of-type(2) {
        width: 22.93rem;
        height: 21.07rem;
        position: absolute;
        display: inline-block;
        /*margin: 75px 400px;*/
        float: left;
        top: 75px;
        left: 49%;
        /*min-left:350px;*/
    }

    .footer span:nth-of-type(2) h6 {
        font-weight: 300;
        margin: 0.5rem;
    }

    .footer span:nth-of-type(2) h3 {
        font-weight: 500;
        margin: 0.5rem;
    }

    .footer span:nth-of-type(2) p {
        font-size: 13px;
        font-weight: 400;
        margin: 0.6rem;
        display: block;
        margin-top: 1rem;
    }

    .footer span:nth-of-type(2) p:nth-of-type(1) {
        display: block;
        margin-top: 2.2rem;
    }

    .footer span:nth-of-type(2) p:nth-of-type(5) {
        display: block;
        font-size: 14px;
        margin-top: 2.8rem;
    }

    .footer span:nth-of-type(3) {
        width: 156px;
        height: 201px;
        position: absolute;
        display: block;
        left: 80%;
        top: 75px;
    }

    .footer span:nth-of-type(3) h3 {
        font-weight: 500;
        margin: 0.5rem;
    }

    .footer span:nth-of-type(3) img {
        font-weight: 500;
        margin-top: 1.5rem;
        display: block;
    }

    .Content_Map {
        width: 100%;
        height: 495px;
        display: inline-block;
        position: relative;
        background: url("../image/Lockwit_web/map.jpg");
        background-size:100% 100% ;
    }

    .imga,.imgb,.imgc,.imgd,.imge {
        width: 250px;
        min-width: 150px;
        position: absolute;
        left: 48%;
        margin-top: 52px;

    }

    .img-none{
        display: none;

    }
    .cont_img-none{
        display: none;

    }
}