@media (min-width: 1441px) {

    /* DESKTOPS */ .banner {

        position:relative;

    }



    .banner a {

        display: block;

    }



    /* .banner figure {

        overflow: hidden;

        position: relative;

        height: 555px;

    }



    .banner img {

        position: absolute;

        position: absolute;

        top: 50%;

        left: 50%;

        transform: translate(-50%,-50%);

        -webkit-transform: translate(-50%,-50%);

        height: 555px;

    } */



    .banner section {

        display: none;

        position: absolute;

        top: 0;

        left: 0;

        bottom: 0;

        width: 400px;

        padding: 160px 80px;

        background: #cf1213;

    }



    .banner section h2 {

        color: #fff;

        font-size: 50px;

        line-height: 60px;

        margin-bottom: 10px;

    }



    .banner section h3 {

        color: #fff;

        font-size: 32px;

        line-height: 40px;

        margin-bottom: 60px;

    }



    .banner section p {

        color: #fff;

        font-size: 22px;

        line-height: 30px;

    }



    @keyframes xbannerimgmc {

        0% {

            opacity: 0;

            transform: translate(-50%,-50%) scale(1);

        }



        10% {

            opacity: 1;

        }



        90% {

            opacity: 1;

        }



        100% {

            opacity: 0;

            transform: translate(-50%,-50%) scale(1.1);

        }

    }



    .banner .iconfont {

        font-size: 60px;

    }



    .banner .swiper-button-prev {

        left: 5%;

    }



    .banner .swiper-button-next {

        right: 5%;

    }



    .advan {

        padding: 40px 0;

        background: #fff;

        box-shadow: 0 0 10px rgba(0,0,0,0.1);

    }



    .advannav {

        width: 100%;

    }



    .advannav ul {

    }



    .advannav li {

        float: left;

        margin: 0 5%;

        position: relative;

    }



    .advannav li a {

        display: block;

        text-align: center;

    }



    .advannav li figure {

        position: absolute;

        top: -14px;

        left: 0px;

    }



    .advannav li figure i {

        display: block;

        width: 50px;

        height: 50px;

        font-size: 50px;

        line-height: 80px;

        margin: 0 auto 30px;

        background: #acce77;

        color: #fff;

        padding: 10px;

        border-radius: 60px;

        position: relative;

        text-align: center;

    }



    .advannav li figure i:before {

        position: absolute;

        top: -5px;

        left: -5px;

        bottom: -5px;

        right: -5px;

        border: 1px dashed #acce77;

        border-radius: 80px;

    }



    .advannav li h3 {

        font-size: 18px;

        font-weight: normal;

        line-height: 30px;

        padding-left: 85px;

    }



    .advannav li p {

        color: #999;

        text-transform: uppercase;

        padding: 0 10px;

    }



    .advannav li:hover figure i {

        animation: xx 3s infinite ease-in-out;

        -webkit-animation: x 3s infinite ease-in-out;

    }



    .advannav li:hover figure i:before {

        animation: mcrotate 3s infinite ease-in-out;

        -webkit-animation: mcrotate 3s infinite ease-in-out;

    }



    .search {

        padding: 15px 100px;

        line-height: 30px;

        font-size: 12px;

        background: #fff;

        box-shadow: 0 0 10px rgba(0,0,0,0.1);

    }



    .searchhotkey {

        float: left;

    }



    .searchhotkey a {

        margin-right: 10px;

    }



    .searchform {

        float: right;

    }



    .searchform form {

    }



    .searchform input {

    }



    .searchform input.txt {

        height: 30px;

        line-height: 30px;

        background: #f9f9f9;

        padding: 0 10px;

    }



    .searchform input.txt::-webkit-input-placeholder {

        color: #ccc;

        font-size: 12px;

    }



    .searchform input.btn {

        height: 30px;

        background: #acce77;

        padding: 0 20px;

        color: #fff;

    }



    .title {

        margin-bottom: 60px;

        overflow: hidden;

        text-align: center;

    }



    .title h2 {

        font-size: 36px;

        line-height: 40px;

        position: relative;

        margin-bottom: 5px;

        color: #acce77;

    }



    .title h3 {

        opacity: 0.8;

        font-size: 18px;

        color: #333;

        text-transform: uppercase;

        font-weight: normal;

    }



    .title h3 span {

        position: relative;

        display: inline-block;

    }



    .title h3 span:before {

        content: '';

        display: block;

        position: absolute;

        top: 50%;

        left: 100%;

        margin-left: 30px;

        width: 50px;

        height: 1px;

        background: #999;

    }



    .title h3 span:after {

        content: '';

        display: block;

        position: absolute;

        top: 50%;

        right: 100%;

        margin-right: 30px;

        width: 50px;

        height: 1px;

        background: #999;

    }



    .title p {

        opacity: 0.8;

        font-size: 18px;

        color: #333;

        text-transform: uppercase;

        font-weight: normal;

    }



    .about {

        padding: 80px 0;

        position: relative;

    }



    .aboutmix {

    }



    .aboutmixcover {

        float: right;

        width: 580px;

        margin-top: 45px;

    }



    .aboutmixcover figure {

        overflow: hidden;

    }



    .aboutmixcover img {

        width: 100%;

    }



    .aboutmixcover video {

        width: 100%;

        height: 410px;

        background: #000;

    }



    .aboutmixinfo {

        float: left;

        width: 600px;

    }



    .aboutmain {

    }



    .aboutmaintitle {

        margin-bottom: 40px;

    }



    .aboutmaintitle h2 {

        font-size: 18px;

        line-height: 40px;

        font-weight: normal;

        padding-bottom: 5px;

        position: relative;

        margin-bottom: 10px;

    }



    .aboutmaintitle h2:after {

        content: '';

        display: block;

        position: absolute;

        bottom: 0;

        left: 0;

        width: 50px;

        height: 2px;

        background: #e9932c;

    }



    .aboutmaintitle p {

        color: #acce77;

        font-size: 36px;

        text-transform: uppercase;

    }



    .aboutmaininfo {

    }



    .aboutmaininfo h2 {

        font-size: 36px;

        line-height: 40px;

        margin-bottom: 40px;

        position: relative;

    }



    .aboutmaininfo h2:after {

        content: '';

        display: block;

        position: absolute;

        top: 60px;

        left: 0;

        width: 50px;

        height: 2px;

        background: #fff;

    }



    .aboutmaininfo dl {

        margin-bottom: 20px;

    }



    .aboutmaininfo dt {

        font-size: 24px;

        line-height: 30px;

        margin-bottom: 30px;

    }



    .aboutmaininfo dd {

        font-size: 15px;

        line-height: 25px;

        opacity: 0.8;

        height: 175px;

        overflow: hidden;

    }



    .aboutmaininfo a {

        display: inline-block;

        background: #acce77;

        color: #fff;

        border-radius: 3px;

        font-size: 12px;

        line-height: 40px;

        padding: 0 30px;

    }



    .product {

        padding: 80px 0;

        background: #f8f8fc;

    }



    .productclass {

        padding: 0 80px;

        margin-bottom: 40px;

    }



    .productclass .swiper-slide {

        width: 180px;

        margin-right: 35px;

        height: 50px;

        line-height: 50px;

        background-color: #f0f0f3;

        border-radius: 25px;

        text-align: center;

    }



    .productclass .swiper-slide:hover {

        background-color: #acce77;

        color: #fff;

    }



    .productclass .swiper-slide:hover a {

        color: #fff;

    }



    .productclass .swiper-slide::after {

        content: '';

        display: block;

        position: absolute;

        top: 24px;

        left: 100%;

        width: 35px;

        height: 2px;

        background-color: #c2c2c3;

    }



    .productclass .swiper-slide:last-child::after {

        content: '';

        display: none;

    }



    .productclass h3 i {

        margin: 0 10px;

    }



    .productclass h3 a {

        display: inline-block;

        text-align: center;

        font-size: 14px;

        line-height: 50px;

    }



    .productclass .swiper-slide-thumb-active h3 a {

       

    }



    .productlist {

        padding: 0 40px;

    }



    .productlist .swiper-pagination {

        display: none;

    }



    .productlist .swiper-button-prev {

        left: 0;

    }



    .productlist .swiper-button-prev span {

        font-size: 60px;

    }



    .productlist .swiper-button-next {

        right: 0;

    }



    .productlist .swiper-button-next span {

        font-size: 60px;

    }



    .productlist ul {

        overflow: hidden;

        margin: 0 -1%;

    }



    .productlist li {

        float: left;

        width: 23%;

        margin: 0 1%;

    }

    .productlist li figcaption {

        position: absolute;

        left: -100%;

        top: 0;

        width: 100%;

        height: 100%;

        background-image: -moz-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .5), rgba(255, 255, 255, 0));

        background-image: -webkit-linear-gradient(0deg, rgba(255, 255, 255, 0), rgba(255, 255, 255, .5), rgba(255, 255, 255, 0));

        transform: skewx(-25deg);

    }

    .productlist li a:hover figcaption {

        left: 100%;

        -moz-transition: 1s;

        -o-transition: 1s;

        -webkit-transition: 1s;

        transition: 1s;

    }

    .productlist li a {

        display: block;

        background: #fff;

    }



    .productlist li dl {

        text-align: center;

        padding: 20px;

        position: relative;

    }



    .productlist li dl:before {

        content: '';

        display: block;

        position: absolute;

        top: 60px;

        left: 50%;

        transform: translateX(-50%);

        width: 30px;

        height: 2px;

        background: #333;

    }



    .productlist li dt {

        font-size: 18px;

        text-overflow: ellipsis;

        white-space: nowrap;

        overflow: hidden;

        line-height: 30px;

        padding-bottom: 30px;

    }



    .productlist li dd {

    }



    .productlist li dd:nth-of-type(1) {

        color: #999;

        height: 40px;

        overflow: hidden;

    }



    .productlist li dd:nth-of-type(2) {

        display: none;

    }



    .productlist li dd:nth-of-type(3) {

        display: none;

    }



    .productlist li h3 {

        font-size: 14px;

        font-weight: normal;

        padding: 5px;

        line-height: 30px;

        text-overflow: ellipsis;

        white-space: nowrap;

        overflow: hidden;

    }



    .productlist li figure {

    }



    .productlist li figure img {

        width: 100%;

    }



    .guarantee {

        position: relative;

        height: 640px;

        color: #fff;

        overflow: hidden;

    }



    .guaranteetitle {

        text-align: center;

        background: url(http://www.luokanghuagong.cn/template/default/img/ico1.jpg) no-repeat center bottom;

        padding-bottom: 30px;

        margin-bottom: 40px;

    }



    .guaranteetitle h2 {

        font-size: 48px;

        line-height: 60px;

        margin-bottom: 10px;

    }



    .guaranteetitle h2 span {

        color: #acce77;

    }



    .guaranteetitle h3 {

        font-size: 18px;

        color: #666;

        font-weight: normal;

    }



    .guaranteecon {

        position: relative;

    }



    .guaranteecon .iconfont {

        display: none;

    }



    .guaranteecon figure {

    }



    .guaranteecon figure img {

        width: 100%;

    }



    .guaranteecon section {

        position: absolute;

        top: 0;

        left: 0;

        right: 0;

        bottom: 0;

    }



    .guaranteecon section dl {

        width: 1200px;

        margin: 0 auto;

        padding-top: 300px;

    }



    .guaranteecon section dt {

        font-size: 24px;

        line-height: 30px;

        padding-bottom: 20px;

    }



    .guaranteecon section dd {

        font-size: 16px;

    }



    .guaranteecon section dd>a {

        display: inline-block;

        border: 1px solid #fff;

        border-radius: 3px;

        padding: 6px 20px;

        color: #fff;

        margin-top: 20px;

        font-size: 12px;

    }



    .guaranteecon section dd p a {

        color: #fff;

        font-size: 14px;

    }



    .guaranteetab {

        position: absolute;

        z-index: 2;

        top: 0;

        left: 50%;

        transform: translateX(-50%);

        width: 1200px;

        padding: 120px 0 0;

    }



    .guaranteetab .swiper-slide {

        width: 200px;

        !important}



    .guaranteetab .iconfont {

        display: none;

    }



    .guaranteetab h2 {

        font-size: 32px;

        line-height: 40px;

        margin-bottom: 30px;

        position: relative;

    }



    .guaranteetab h2:after {

        content: '';

        display: block;

        position: absolute;

        top: -40px;

        left: 0;

        width: 50px;

        height: 3px;

        background: #acce77;

    }



    .guaranteetab h3 {

        text-align: center;

        display: inline-block;

        width: 100%;

        font-size: 16px;

        line-height: 50px;

        font-weight: normal;

        background: #fff;

        color: #333;

    }



    .guaranteetab .swiper-slide-thumb-active h3 {

        background: #acce77;

        color: #fff;

    }



    .news {

        position: relative;

        padding: 80px 0 60px;

        background: #f8f8fc;

    }



    .newsaside {

        float: left;

        width: 300px;

        height: 484px;

        border-right: 1px dashed #ddd;

        margin-right: 25px;

    }



    .newsaside .title {

        margin-top: 10px;

    }



    .newsaside .title h2 p {

        font-size: 24px;

        line-height: 36px;

        color: #acce77;

        text-align: left;

    }



    .newsaside .newstitle {

        margin-bottom: 25px;

    }



    .newsaside .newstitle a {

        display: block;

        width: 180px;

        border : 1px solid rgba(221, 221, 221, 1);

        margin-bottom: 10px;

        color: #333333;

        font-size: 14px;

        font-weight: 500;

        border-radius: 5px;

        justify-content: center;

        text-align: center;

        line-height: 48px;

    }



    .newsindustry {

        float: left;

        width: 410px;

        height: 470px;

        margin-right: 25px;

    }



    .newsproblem {

        float: left;

        width: 410px;

        height: 470px;

    }



    .newslist ul {

        margin: 0 -2%;

    }



    .newslist li {

        margin: 2% 2%;

    }



    .newslist li a {

        display: block;

        position: relative;

        padding: 0 0 40px;

        background: #fff;

        border: 1px solid #eee;

    }



    .newslist li a figure {

        overflow: hidden;

    }



    .newslist li a img {

        width: 100%;

    }



    .newslist li a section {

        position: relative;

        padding: 20px 20px 20px 110px;

        border-bottom: 1px solid #eee;

    }



    .newslist li a time {

        position: absolute;

        top: 20px;

        left: 20px;

        display: block;

        color: #ccc;

        font-family: 'sysfont';

        color: #333;

    }



    .newslist li a time strong {

        display: block;

        font-size: 20px;

        line-height: 30px;

        font-weight: normal;

    }



    .newslist li a time em {

        display: block;

        font-size: 36px;

        line-height: 40px;

    }



    .newslist li a dl {

        position: relative;

    }



    .newslist li a dt {

        font-size: 15px;

        line-height: 30px;

        text-overflow: ellipsis;

        white-space: nowrap;

        overflow: hidden;

    }



    .newslist li a dd {

        color: #999;

        font-size: 13px;

        height: 40px;

    }



    .newslist li a i {

        position: absolute;

        bottom: 10px;

        right: 20px;

        display: block;

        font-size: 24px;

        color: #666;

    }



    .newslist li a span {

        position: absolute;

        bottom: 10px;

        left: 20px;

        color: #666;

    }



    .newslist li a:hover {

        box-shadow: 0 0 10px rgba(0,0,0,0.1);

    }



    .newslist li a:hover i {

        animation: mctranslatex 1s infinite ease-in-out;

        -webkit-animation: mctranslatex 1s infinite ease-in-out;

        color: #acce77;

    }



    .message {

        padding: 40px 0;

        background: url(../image/bgmessage.jpg) no-repeat center center;

    }



    .message .title {

        color: #fff;

        margin-bottom: 20px;

    }



    .message .title p {

        color: #fff;

    }



    .message .title h2 {

        font-size: 36px;

        line-height: 40px;

        position: relative;

        margin-bottom: 5px;

        color: #fff;

    }



    .messageform {

    }



    .messageform ul {

        position: relative;

        height: 40px;

    }



    .messageform li {

        position: absolute;

    }



    .messageform li input {

        width: 100%;

        box-sizing: border-box;

        border: none;

        height: 40px;

        line-height: 40px;

        padding: 0 10px;

    }



    .messageform li textarea {

        width: 100%;

        box-sizing: border-box;

        border: none;

        height: 40px;

        padding: 10px;

        top: 0;

    }



    .messageform li:nth-of-type(1) {

        left: 0;

        width: 19%;

    }



    .messageform li:nth-of-type(2) {

        left: 20%;

        width: 19%;

    }



    .messageform li:nth-of-type(3) {

        left: 40%;

        width: 29%;

    }



    .messageform li:nth-of-type(4) {

        left: 70%;

        width: 19%;

    }



    .messageform li:nth-of-type(5) {

        left: 90%;

        width: 10%;

    }



    .messageform li:nth-of-type(5) input {

        background: #acce77;

        color: #fff;

    }

}



@media (min-width: 1025px) and (max-width:1440px) {

    /* LAPTOPS */ .banner {

        position:relative;

    }



    .banner a {

        display: block;

    }



    /* .banner figure {

        overflow: hidden;

        position: relative;

        height: 700px;

    }



    .banner img {

        position: absolute;

        position: absolute;

        top: 50%;

        left: 50%;

        transform: translate(-50%,-50%);

        -webkit-transform: translate(-50%,-50%);

        height: 700px;

    } */



    .banner section {

        display: none;

        position: absolute;

        top: 0;

        left: 0;

        bottom: 0;

        width: 400px;

        padding: 160px 80px;

        background: #acce77;

    }



    .banner section h2 {

        color: #fff;

        font-size: 50px;

        line-height: 60px;

        margin-bottom: 10px;

    }



    .banner section h3 {

        color: #fff;

        font-size: 32px;

        line-height: 40px;

        margin-bottom: 60px;

    }



    .banner section p {

        color: #fff;

        font-size: 22px;

        line-height: 30px;

    }



    @keyframes xbannerimgmc {

        0% {

            opacity: 0;

            transform: translate(-50%,-50%) scale(1);

        }



        10% {

            opacity: 1;

        }



        90% {

            opacity: 1;

        }



        100% {

            opacity: 0;

            transform: translate(-50%,-50%) scale(1.1);

        }

    }



    .banner .iconfont {

        font-size: 60px;

    }



    .banner .swiper-button-prev {

        left: 5%;

    }



    .banner .swiper-button-next {

        right: 5%;

    }



    .advan {

        padding: 40px 0;

        background: #fff;

        box-shadow: 0 0 10px rgba(0,0,0,0.1);

    }



    .advannav {

        width: 100%;

    }



    .advannav ul {

    }



    .advannav li {

        float: left;

        margin: 0 5%;

        position: relative;

    }



    .advannav li a {

        display: block;

        text-align: center;

    }



    .advannav li figure {

        position: absolute;

        top: -14px;

        left: 0px;

    }



    .advannav li figure i {

        display: block;

        width: 50px;

        height: 50px;

        font-size: 50px;

        line-height: 80px;

        margin: 0 auto 30px;

        background: #acce77;

        color: #fff;

        padding: 10px;

        border-radius: 60px;

        position: relative;

        text-align: center;

    }



    .advannav li figure i:before {

        position: absolute;

        top: -5px;

        left: -5px;

        bottom: -5px;

        right: -5px;

        border: 1px dashed #acce77;

        border-radius: 80px;

    }



    .advannav li h3 {

        font-size: 18px;

        font-weight: normal;

        line-height: 30px;

        padding-left: 85px;

    }



    .advannav li p {

        color: #999;

        text-transform: uppercase;

        padding: 0 10px;

    }



    .advannav li:hover figure i {

        animation: xx 3s infinite ease-in-out;

        -webkit-animation: x 3s infinite ease-in-out;

    }



    .advannav li:hover figure i:before {

        animation: mcrotate 3s infinite ease-in-out;

        -webkit-animation: mcrotate 3s infinite ease-in-out;

    }



    .search {

        padding: 15px 0;

        line-height: 30px;

        font-size: 12px;

        background: #fff;

        box-shadow: 0 0 10px rgba(0,0,0,0.1);

    }



    .searchhotkey {

        float: left;

    }



    .searchhotkey a {

        margin-right: 10px;

    }



    .searchform {

        float: right;

    }



    .searchform form {

    }



    .searchform input {

    }



    .searchform input.txt {

        height: 30px;

        line-height: 30px;

        background: #f9f9f9;

        padding: 0 10px;

    }



    .searchform input.txt::-webkit-input-placeholder {

        color: #ccc;

        font-size: 12px;

    }



    .searchform input.btn {

        height: 30px;

        background: #acce77;

        padding: 0 20px;

        color: #fff;

    }



    .title {

        margin-bottom: 60px;

        overflow: hidden;

        text-align: center;

    }



    .title h2 {

        font-size: 36px;

        line-height: 40px;

        position: relative;

        margin-bottom: 5px;

        color: #acce77;

    }



    .title h3 {

        opacity: 0.8;

        font-size: 18px;

        color: #333;

        text-transform: uppercase;

        font-weight: normal;

    }



    .title h3 span {

        position: relative;

        display: inline-block;

    }



    .title h3 span:before {

        content: '';

        display: block;

        position: absolute;

        top: 50%;

        left: 100%;

        margin-left: 30px;

        width: 50px;

        height: 1px;

        background: #999;

    }



    .title h3 span:after {

        content: '';

        display: block;

        position: absolute;

        top: 50%;

        right: 100%;

        margin-right: 30px;

        width: 50px;

        height: 1px;

        background: #999;

    }



    .title p {

        opacity: 0.8;

        font-size: 18px;

        color: #333;

        text-transform: uppercase;

        font-weight: normal;

    }



    .about {

        padding: 80px 0;

        position: relative;

    }



    .aboutmix {

    }



    .aboutmixcover {

        float: right;

        width: 580px;

        margin-top: 45px;

    }



    .aboutmixcover figure {

        overflow: hidden;

    }



    .aboutmixcover img {

        width: 100%;

    }



    .aboutmixcover video {

        width: 100%;

        height: 410px;

        background: #000;

    }



    .aboutmixinfo {

        float: left;

        width: 600px;

    }



    .aboutmain {

    }



    .aboutmaintitle {

        margin-bottom: 40px;

    }



    .aboutmaintitle h2 {

        font-size: 18px;

        line-height: 40px;

        font-weight: normal;

        padding-bottom: 5px;

        position: relative;

        margin-bottom: 10px;

    }



    .aboutmaintitle h2:after {

        content: '';

        display: block;

        position: absolute;

        bottom: 0;

        left: 0;

        width: 50px;

        height: 2px;

        background: #e9932c;

    }



    .aboutmaintitle p {

        color: #acce77;

        font-size: 36px;

        text-transform: uppercase;

    }



    .aboutmaininfo {

    }



    .aboutmaininfo h2 {

        font-size: 36px;

        line-height: 40px;

        margin-bottom: 40px;

        position: relative;

    }



    .aboutmaininfo h2:after {

        content: '';

        display: block;

        position: absolute;

        top: 60px;

        left: 0;

        width: 50px;

        height: 2px;

        background: #fff;

    }



    .aboutmaininfo dl {

        margin-bottom: 20px;

    }



    .aboutmaininfo dt {

        font-size: 24px;

        line-height: 30px;

        margin-bottom: 30px;

    }



    .aboutmaininfo dd {

        font-size: 15px;

        line-height: 25px;

        opacity: 0.8;

        height: 175px;

        overflow: hidden;

    }



    .aboutmaininfo a {

        display: inline-block;

        background: #acce77;

        color: #fff;

        border-radius: 3px;

        font-size: 12px;

        line-height: 40px;

        padding: 0 30px;

    }



    .product {

        padding: 80px 0;

        background: #f8f8fc;

    }



    .productclass {

        padding: 0 60px;

        margin-bottom: 40px;

    }



    .productclass .swiper-slide {

        width: 180px;

        margin-right: 35px;

        height: 50px;

        line-height: 50px;

        background-color: #f0f0f3;

        border-radius: 25px;

        text-align: center;

    }



    .productclass .swiper-slide:hover {

        background-color: #acce77;

        color: #fff;

    }



    .productclass .swiper-slide:hover a {

        color: #fff;

    }



    .productclass .swiper-slide::after {

        content: '';

        display: block;

        position: absolute;

        top: 24px;

        left: 100%;

        width: 35px;

        height: 2px;

        background-color: #c2c2c3;

    }



    .productclass .swiper-slide:last-child::after {

        content: '';

        display: none;

    }



    .productclass h3 i {

        margin: 0 10px;

    }



    .productclass h3 a {

        display: inline-block;

        text-align: center;

        font-size: 14px;

        line-height: 50px;

    }



    .productclass .swiper-slide-thumb-active h3 a {

        

    }



    .productlist {

        padding: 0 40px;

    }



    .productlist .swiper-pagination {

        display: none;

    }



    .productlist .swiper-button-prev {

        left: 0;

    }



    .productlist .swiper-button-prev span {

        font-size: 60px;

    }



    .productlist .swiper-button-next {

        right: 0;

    }



    .productlist .swiper-button-next span {

        font-size: 60px;

    }



    .productlist ul {

        overflow: hidden;

        margin: 0 -1%;

    }



    .productlist li {

        float: left;

        width: 23%;

        margin: 0 1%;

    }



    .productlist li a {

        display: block;

        background: #fff;

    }



    .productlist li dl {

        text-align: center;

        padding: 20px;

        position: relative;

    }



    .productlist li dl:before {

        content: '';

        display: block;

        position: absolute;

        top: 60px;

        left: 50%;

        transform: translateX(-50%);

        width: 30px;

        height: 2px;

        background: #333;

    }



    .productlist li dt {

        font-size: 18px;

        text-overflow: ellipsis;

        white-space: nowrap;

        overflow: hidden;

        line-height: 30px;

        padding-bottom: 30px;

    }



    .productlist li dd {

    }



    .productlist li dd:nth-of-type(1) {

        color: #999;

        height: 40px;

        overflow: hidden;

    }



    .productlist li dd:nth-of-type(2) {

        display: none;

    }



    .productlist li dd:nth-of-type(3) {

        display: none;

    }



    .productlist li h3 {

        font-size: 14px;

        font-weight: normal;

        padding: 5px;

        line-height: 30px;

        text-overflow: ellipsis;

        white-space: nowrap;

        overflow: hidden;

    }



    .productlist li figure {

    }



    .productlist li figure img {

        width: 100%;

    }



    .guarantee {

        position: relative;

        height: 640px;

        color: #fff;

        overflow: hidden;

    }



    .guaranteetitle {

        text-align: center;

        background: url(http://www.luokanghuagong.cn/template/default/img/ico1.jpg) no-repeat center bottom;

        padding-bottom: 30px;

        margin-bottom: 40px;

    }



    .guaranteetitle h2 {

        font-size: 48px;

        line-height: 60px;

        margin-bottom: 10px;

    }



    .guaranteetitle h2 span {

        color: #acce77;

    }



    .guaranteetitle h3 {

        font-size: 18px;

        color: #666;

        font-weight: normal;

    }



    .guaranteecon {

        position: relative;

    }



    .guaranteecon .iconfont {

        display: none;

    }



    .guaranteecon figure {

    }



    .guaranteecon figure img {

        width: 100%;

    }



    .guaranteecon section {

        position: absolute;

        top: 0;

        left: 0;

        right: 0;

        bottom: 0;

    }



    .guaranteecon section dl {

        width: 1200px;

        margin: 0 auto;

        padding-top: 300px;

    }



    .guaranteecon section dt {

        font-size: 24px;

        line-height: 30px;

        padding-bottom: 20px;

    }



    .guaranteecon section dd {

        font-size: 16px;

    }



    .guaranteecon section dd>a {

        display: inline-block;

        border: 1px solid #fff;

        border-radius: 3px;

        padding: 6px 20px;

        color: #fff;

        margin-top: 20px;

        font-size: 12px;

    }



    .guaranteecon section dd p a {

        color: #fff;

        font-size: 14px;

    }



    .guaranteetab {

        position: absolute;

        z-index: 2;

        top: 0;

        left: 50%;

        transform: translateX(-50%);

        width: 1200px;

        padding: 120px 0 0;

    }



    .guaranteetab .swiper-slide {

        width: 200px;

        !important}



    .guaranteetab .iconfont {

        display: none;

    }



    .guaranteetab h2 {

        font-size: 32px;

        line-height: 40px;

        margin-bottom: 30px;

        position: relative;

    }



    .guaranteetab h2:after {

        content: '';

        display: block;

        position: absolute;

        top: -40px;

        left: 0;

        width: 50px;

        height: 3px;

        background: #acce77;

    }



    .guaranteetab h3 {

        text-align: center;

        display: inline-block;

        width: 100%;

        font-size: 16px;

        line-height: 50px;

        font-weight: normal;

        background: #fff;

        color: #333;

    }



    .guaranteetab .swiper-slide-thumb-active h3 {

        background: #acce77;

        color: #fff;

    }



    .news {

        position: relative;

        padding: 80px 0 60px;

        background: #f8f8fc;

    }



    .newsaside {

        float: left;

        width: 300px;

        height: 484px;

        border-right: 1px dashed #ddd;

        margin-right: 25px;

    }



    .newsaside .title {

        margin-top: 10px;

    }



    .newsaside .title h2 p {

        font-size: 24px;

        line-height: 36px;

        color: #acce77;

        text-align: left;

    }



    .newsaside .newstitle {

        margin-bottom: 25px;

    }



    .newsaside .newstitle a {

        display: block;

        width: 180px;

        border : 1px solid rgba(221, 221, 221, 1);

        margin-bottom: 10px;

        color: #333333;

        font-size: 14px;

        font-weight: 500;

        border-radius: 5px;

        justify-content: center;

        text-align: center;

        line-height: 48px;

    }



    .newsindustry {

        float: left;

        width: 410px;

        height: 470px;

        margin-right: 25px;

    }



    .newsproblem {

        float: left;

        width: 410px;

        height: 470px;

    }



    .newslist ul {

        margin: 0 -2%;

    }



    .newslist li {

        margin: 2% 2%;

    }



    .newslist li a {

        display: block;

        position: relative;

        padding: 0 0 40px;

        background: #fff;

        border: 1px solid #eee;

    }



    .newslist li a figure {

        overflow: hidden;

    }



    .newslist li a img {

        width: 100%;

    }



    .newslist li a section {

        position: relative;

        padding: 20px 20px 20px 110px;

        border-bottom: 1px solid #eee;

    }



    .newslist li a time {

        position: absolute;

        top: 20px;

        left: 20px;

        display: block;

        color: #ccc;

        font-family: 'sysfont';

        color: #333;

    }



    .newslist li a time strong {

        display: block;

        font-size: 20px;

        line-height: 30px;

        font-weight: normal;

    }



    .newslist li a time em {

        display: block;

        font-size: 36px;

        line-height: 40px;

    }



    .newslist li a dl {

        position: relative;

    }



    .newslist li a dt {

        font-size: 15px;

        line-height: 30px;

        text-overflow: ellipsis;

        white-space: nowrap;

        overflow: hidden;

    }



    .newslist li a dd {

        color: #999;

        font-size: 13px;

        height: 40px;

    }



    .newslist li a i {

        position: absolute;

        bottom: 10px;

        right: 20px;

        display: block;

        font-size: 24px;

        color: #666;

    }



    .newslist li a span {

        position: absolute;

        bottom: 10px;

        left: 20px;

        color: #666;

    }



    .newslist li a:hover {

        box-shadow: 0 0 10px rgba(0,0,0,0.1);

    }



    .newslist li a:hover i {

        animation: mctranslatex 1s infinite ease-in-out;

        -webkit-animation: mctranslatex 1s infinite ease-in-out;

        color: #acce77;

    }



    .message {

        padding: 40px 0;

        background: url(../image/bgmessage.jpg) no-repeat center center;

    }



    .message .title {

        color: #fff;

        margin-bottom: 20px;

    }



    .message .title p {

        color: #fff;

    }



    .message .title h2 {

        font-size: 32px;

        line-height: 40px;

        position: relative;

        margin-bottom: 5px;

        color: #fff;

    }



    .messageform {

    }



    .messageform ul {

        position: relative;

        height: 40px;

    }



    .messageform li {

        position: absolute;

    }



    .messageform li input {

        width: 100%;

        box-sizing: border-box;

        border: none;

        height: 40px;

        line-height: 40px;

        padding: 0 10px;

    }



    .messageform li textarea {

        width: 100%;

        box-sizing: border-box;

        border: none;

        height: 40px;

        padding: 10px;

        top: 0;

    }



    .messageform li:nth-of-type(1) {

        left: 0;

        width: 19%;

    }



    .messageform li:nth-of-type(2) {

        left: 20%;

        width: 19%;

    }



    .messageform li:nth-of-type(3) {

        left: 40%;

        width: 29%;

    }



    .messageform li:nth-of-type(4) {

        left: 70%;

        width: 19%;

    }



    .messageform li:nth-of-type(5) {

        left: 90%;

        width: 10%;

    }



    .messageform li:nth-of-type(5) input {

        background: #acce77;

        color: #fff;

    }

}



@media (min-width: 768px) and (max-width:1024px) {

    /* TABLET */ .banner {

        position:relative;

    }



    .banner a {

        display: block;

    }



    /* .banner figure {

        overflow: hidden;

        position: relative;

        height: 240px;

    }



    .banner img {

        position: absolute;

        position: absolute;

        top: 50%;

        left: 50%;

        transform: translate(-50%,-50%);

        -webkit-transform: translate(-50%,-50%);

        height: 240px;

    } */



    .banner section {

        display: none;

        position: absolute;

        top: 0;

        left: 0;

        bottom: 0;

        width: 400px;

        padding: 160px 80px;

        background: #cf1213;

    }



    .banner section h2 {

        color: #fff;

        font-size: 50px;

        line-height: 60px;

        margin-bottom: 10px;

    }



    .banner section h3 {

        color: #fff;

        font-size: 32px;

        line-height: 40px;

        margin-bottom: 60px;

    }



    .banner section p {

        color: #fff;

        font-size: 22px;

        line-height: 30px;

    }



    @keyframes xbannerimgmc {

        0% {

            opacity: 0;

            transform: translate(-50%,-50%) scale(1);

        }



        10% {

            opacity: 1;

        }



        90% {

            opacity: 1;

        }



        100% {

            opacity: 0;

            transform: translate(-50%,-50%) scale(1.1);

        }

    }



    .banner .iconfont {

        font-size: 60px;

    }



    .banner .swiper-button-prev {

        left: 5%;

    }



    .banner .swiper-button-next {

        right: 5%;

    }



    .advan {

        padding: 40px 0;

        background: #fff;

        box-shadow: 0 0 10px rgba(0,0,0,0.1);

    }



    .advannav {

        width: 100%;

    }



    .advannav ul {

    }



    .advannav li {

        float: left;

        margin: 0 5%;

        position: relative;

    }



    .advannav li a {

        display: block;

        text-align: center;

    }



    .advannav li figure {

        position: absolute;

        top: -14px;

        left: 0px;

    }



    .advannav li figure i {

        display: block;

        width: 50px;

        height: 50px;

        font-size: 50px;

        line-height: 80px;

        margin: 0 auto 30px;

        background: #acce77;

        color: #fff;

        padding: 10px;

        border-radius: 60px;

        position: relative;

        text-align: center;

    }



    .advannav li figure i:before {

        position: absolute;

        top: -5px;

        left: -5px;

        bottom: -5px;

        right: -5px;

        border: 1px dashed #acce77;

        border-radius: 80px;

    }



    .advannav li h3 {

        font-size: 18px;

        font-weight: normal;

        line-height: 30px;

        padding-left: 85px;

    }



    .advannav li p {

        color: #999;

        text-transform: uppercase;

        padding: 0 10px;

    }



    .advannav li:hover figure i {

        animation: xx 3s infinite ease-in-out;

        -webkit-animation: x 3s infinite ease-in-out;

    }



    .advannav li:hover figure i:before {

        animation: mcrotate 3s infinite ease-in-out;

        -webkit-animation: mcrotate 3s infinite ease-in-out;

    }



    .search {

        padding: 15px 100px;

        line-height: 30px;

        font-size: 12px;

        background: #fff;

        box-shadow: 0 0 10px rgba(0,0,0,0.1);

    }



    .searchhotkey {

        float: left;

    }



    .searchhotkey a {

        margin-right: 10px;

    }



    .searchform {

        float: right;

    }



    .searchform form {

    }



    .searchform input {

    }



    .searchform input.txt {

        height: 30px;

        line-height: 30px;

        background: #f9f9f9;

        padding: 0 10px;

    }



    .searchform input.txt::-webkit-input-placeholder {

        color: #ccc;

        font-size: 12px;

    }



    .searchform input.btn {

        height: 30px;

        background: #acce77;

        padding: 0 20px;

        color: #fff;

    }



    .title {

        margin-bottom: 40px;

        overflow: hidden;

        text-align: center;

    }



    .title h2 {

        font-size: 36px;

        line-height: 40px;

        position: relative;

        margin-bottom: 5px;

        color: #acce77;

    }



    .title h3 {

        opacity: 0.8;

        font-size: 18px;

        color: #999;

        text-transform: uppercase;

        font-weight: normal;

    }



    .title h3 span {

        position: relative;

        display: inline-block;

    }



    .title h3 span:before {

        content: '';

        display: block;

        position: absolute;

        top: 50%;

        left: 100%;

        margin-left: 30px;

        width: 50px;

        height: 1px;

        background: #999;

    }



    .title h3 span:after {

        content: '';

        display: block;

        position: absolute;

        top: 50%;

        right: 100%;

        margin-right: 30px;

        width: 50px;

        height: 1px;

        background: #999;

    }



    .title p {

        opacity: 0.8;

        font-size: 12px;

        color: #999;

        text-transform: uppercase;

        font-weight: normal;

    }



    .product {

        padding: 80px 0;

        background: #f8f8fc;

    }



    .productclass {

        padding: 0 60px;

        margin-bottom: 40px;

    }



    .productclass .swiper-slide {

        width: 180px;

        margin-right: 35px;

        height: 50px;

        line-height: 50px;

        background-color: #f0f0f3;

        border-radius: 25px;

        text-align: center;

    }



    .productclass .swiper-slide:hover {

        background-color: #acce77;

        color: #fff;

    }



    .productclass .swiper-slide:hover a {

        color: #fff;

    }



    .productclass .swiper-slide::after {

        content: '';

        display: block;

        position: absolute;

        top: 24px;

        left: 100%;

        width: 35px;

        height: 2px;

        background-color: #c2c2c3;

    }



    .productclass .swiper-slide:last-child::after {

        content: '';

        display: none;

    }



    .productclass h3 i {

        margin: 0 10px;

    }



    .productclass h3 a {

        display: inline-block;

        text-align: center;

        font-size: 14px;

        line-height: 50px;

    }



    .productclass .swiper-slide-thumb-active h3 a {

        

    }



    .productlist {

        padding: 0 40px;

    }



    .productlist .swiper-pagination {

        display: none;

    }



    .productlist .swiper-button-prev {

        left: 0;

    }



    .productlist .swiper-button-prev span {

        font-size: 60px;

    }



    .productlist .swiper-button-next {

        right: 0;

    }



    .productlist .swiper-button-next span {

        font-size: 60px;

    }



    .productlist ul {

        overflow: hidden;

        margin: 0 -1%;

    }



    .productlist li {

        float: left;

        width: 23%;

        margin: 0 1%;

    }



    .productlist li a {

        display: block;

        background: #fff;

    }



    .productlist li dl {

        text-align: center;

        padding: 20px;

        position: relative;

    }



    .productlist li dl:before {

        content: '';

        display: block;

        position: absolute;

        top: 60px;

        left: 50%;

        transform: translateX(-50%);

        width: 30px;

        height: 2px;

        background: #333;

    }



    .productlist li dt {

        font-size: 18px;

        text-overflow: ellipsis;

        white-space: nowrap;

        overflow: hidden;

        line-height: 30px;

        padding-bottom: 30px;

    }



    .productlist li dd {

    }



    .productlist li dd:nth-of-type(1) {

        color: #999;

        height: 40px;

        overflow: hidden;

    }



    .productlist li dd:nth-of-type(2) {

        display: none;

    }



    .productlist li dd:nth-of-type(3) {

        display: none;

    }



    .productlist li h3 {

        font-size: 14px;

        font-weight: normal;

        padding: 5px;

        line-height: 30px;

        text-overflow: ellipsis;

        white-space: nowrap;

        overflow: hidden;

    }



    .productlist li figure {

    }



    .productlist li figure img {

        width: 100%;

    }



    .guarantee {

        position: relative;

        height: 640px;

        color: #fff;

        overflow: hidden;

    }



    .guaranteetitle {

        text-align: center;

        background: url(http://www.luokanghuagong.cn/template/default/img/ico1.jpg) no-repeat center bottom;

        padding-bottom: 30px;

        margin-bottom: 40px;

    }



    .guaranteetitle h2 {

        font-size: 48px;

        line-height: 60px;

        margin-bottom: 10px;

    }



    .guaranteetitle h2 span {

        color: #acce77;

    }



    .guaranteetitle h3 {

        font-size: 18px;

        color: #666;

        font-weight: normal;

    }



    .guaranteecon {

        position: relative;

    }



    .guaranteecon .iconfont {

        display: none;

    }



    .guaranteecon figure {

    }



    .guaranteecon figure img {

        width: 100%;

    }



    .guaranteecon section {

        position: absolute;

        top: 0;

        left: 0;

        right: 0;

        bottom: 0;

    }



    .guaranteecon section dl {

        width: 1200px;

        margin: 0 auto;

        padding-top: 300px;

    }



    .guaranteecon section dt {

        font-size: 24px;

        line-height: 30px;

        padding-bottom: 20px;

    }



    .guaranteecon section dd {

        font-size: 16px;

    }



    .guaranteecon section dd>a {

        display: inline-block;

        border: 1px solid #fff;

        border-radius: 3px;

        padding: 6px 20px;

        color: #fff;

        margin-top: 20px;

        font-size: 12px;

    }



    .guaranteecon section dd p a {

        color: #fff;

        font-size: 14px;

    }



    .guaranteetab {

        position: absolute;

        z-index: 2;

        top: 0;

        left: 50%;

        transform: translateX(-50%);

        width: 1200px;

        padding: 120px 0 0;

    }



    .guaranteetab .swiper-slide {

        width: 200px;

        !important}



    .guaranteetab .iconfont {

        display: none;

    }



    .guaranteetab h2 {

        font-size: 32px;

        line-height: 40px;

        margin-bottom: 30px;

        position: relative;

    }



    .guaranteetab h2:after {

        content: '';

        display: block;

        position: absolute;

        top: -40px;

        left: 0;

        width: 50px;

        height: 3px;

        background: #acce77;

    }



    .guaranteetab h3 {

        text-align: center;

        display: inline-block;

        width: 100%;

        font-size: 16px;

        line-height: 50px;

        font-weight: normal;

        background: #fff;

        color: #333;

    }



    .guaranteetab .swiper-slide-thumb-active h3 {

        background: #acce77;

        color: #fff;

    }



    .about {

        padding: 80px 0;

        position: relative;

    }



    .aboutmix {

    }



    .aboutmixcover {

        float: right;

        width: 580px;

        margin-top: 45px;

    }



    .aboutmixcover figure {

        overflow: hidden;

    }



    .aboutmixcover img {

        width: 100%;

    }



    .aboutmixcover video {

        width: 100%;

        height: 410px;

        background: #000;

    }



    .aboutmixinfo {

        float: left;

        width: 600px;

    }



    .aboutmain {

    }



    .aboutmaintitle {

        margin-bottom: 40px;

    }



    .aboutmaintitle h2 {

        font-size: 18px;

        line-height: 40px;

        font-weight: normal;

        padding-bottom: 5px;

        position: relative;

        margin-bottom: 10px;

    }



    .aboutmaintitle h2:after {

        content: '';

        display: block;

        position: absolute;

        bottom: 0;

        left: 0;

        width: 50px;

        height: 2px;

        background: #e9932c;

    }



    .aboutmaintitle p {

        color: #acce77;

        font-size: 36px;

        text-transform: uppercase;

    }



    .aboutmaininfo {

    }



    .aboutmaininfo h2 {

        font-size: 36px;

        line-height: 40px;

        margin-bottom: 40px;

        position: relative;

    }



    .aboutmaininfo h2:after {

        content: '';

        display: block;

        position: absolute;

        top: 60px;

        left: 0;

        width: 50px;

        height: 2px;

        background: #fff;

    }



    .aboutmaininfo dl {

        margin-bottom: 20px;

    }



    .aboutmaininfo dt {

        font-size: 24px;

        line-height: 30px;

        margin-bottom: 30px;

    }



    .aboutmaininfo dd {

        font-size: 15px;

        line-height: 25px;

        opacity: 0.8;

        height: 175px;

        overflow: hidden;

    }



    .aboutmaininfo a {

        display: inline-block;

        background: #acce77;

        color: #fff;

        border-radius: 3px;

        font-size: 12px;

        line-height: 40px;

        padding: 0 30px;

    }



    .num {

        background: #acce77;

        background-image: linear-gradient(-45deg,transparent 49%,rgba(255,255,255,0.1) 51%,transparent 0);

        color: #fff;

        padding: 40px 0;

        background-size: 6px 6px;

        background-repeat: repeat;

    }



    .numlist {

    }



    .numlist ul {

        overflow: hidden;

    }



    .numlist li {

        float: left;

        width: 25%;

        padding: 15px 0 15px 220px;

        box-sizing: border-box;

        position: relative;

    }



    .numlist li figure {

        position: absolute;

        top: 10px;

        left: 100px;

        width: 80px;

        height: 80px;

        font-size: 80px;

        line-height: 80px;

        background: #fff;

        border-radius: 90px;

        color: #acce77;

        text-align: center;

        padding: 5px;

    }



    .numlist li figure:after {

        content: '';

        z-index: 1;

        display: block;

        position: absolute;

        top: 5px;

        left: 5px;

        bottom: 5px;

        right: 5px;

        border: 1px dashed #acce77;

        border-radius: 50%;

    }



    .numlist li strong {

        font-family: 'sysfont';

        font-size: 55px;

        line-height: 60px;

        color: #ffd71a;

    }



    .numlist li p {

        margin-top: 0;

    }



    .numlist li i {

        font-style: normal;

    }



    .case {

        padding: 80px 0;

        background: #f9f9f9;

    }



    .caseslide {

        overflow: hidden;

    }



    .caseslide .bd {

        float: left;

        width: 50%;

    }



    .caseslide .bd ul {

    }



    .caseslide .bd li {

    }



    .caseslide .bd li a {

        display: block;

    }



    .caseslide .bd li section {

        position: relative;

        border: 2px solid #eee;

        overflow: hidden;

    }



    .caseslide .bd li figure img {

        width: 100%;

    }



    .caseslide .bd li dl {

        position: absolute;

        bottom: 0;

        left: 0;

        right: 0;

        background: rgba(0,0,0,0.8);

        color: #fff;

        padding: 20px;

    }



    .caseslide .bd li dt {

        font-size: 17px;

        font-weight: bold;

        line-height: 30px;

    }



    .caseslide .bd li dd {

    }



    .caseslide .bd li a:hover img {

        transform: scale3d(1.05, 1.05, 1);

    }



    .caseslide .hd {

        float: right;

        width: 50%;

    }



    .caseslide .hd ul {

    }



    .caseslide .hd li {

        float: left;

        width: 25%;

    }



    .caseslide .hd li section {

        position: relative;

        border: 1px solid transparent;

        background: #eee;

    }



    .caseslide .hd li section:before {

        content: '';

        display: block;

        position: absolute;

        z-index: 1;

        bottom: 0;

        left: 0;

        top: 0;

        right: 0;

        background: rgba(30,112,176,0.8);

        transition: all 0.3s ease-out 0s;

        opacity: 1;

    }



    .caseslide .hd li figure img {

        width: 100%;

    }



    .caseslide .hd li h3 {

        position: absolute;

        z-index: 1;

        top: 50%;

        left: 50%;

        transform: translate(-50%,-50%);

        text-align: center;

        color: #fff;

    }



    .caseslide .hd li.on section:before {

        opacity: 0;

    }



    .caseslide .hd li.on figure img {

        transform: scale3d(0.9, 0.9, 1);

    }



    .news {

        position: relative;

        padding: 80px 0 60px;

        background: #f8f8fc;

    }



    .newsaside {

        float: left;

        width: 300px;

        height: 484px;

        border-right: 1px dashed #ddd;

        margin-right: 25px;

    }



    .newsaside .title {

        margin-top: 10px;

    }



    .newsaside .title h2 p {

        font-size: 24px;

        line-height: 36px;

        color: #acce77;

        text-align: left;

    }



    .newsaside .newstitle {

        margin-bottom: 25px;

    }



    .newsaside .newstitle a {

        display: block;

        width: 180px;

        border : 1px solid rgba(221, 221, 221, 1);

        margin-bottom: 10px;

        color: #333333;

        font-size: 14px;

        font-weight: 500;

        border-radius: 5px;

        justify-content: center;

        text-align: center;

        line-height: 48px;

    }



    .newsindustry {

        float: left;

        width: 410px;

        height: 470px;

        margin-right: 25px;

    }



    .newsproblem {

        float: left;

        width: 410px;

        height: 470px;

    }



    .newslist ul {

        margin: 0 -2%;

    }



    .newslist li {

        margin: 2% 2%;

    }



    .newslist li a {

        display: block;

        position: relative;

        padding: 0 0 40px;

        background: #fff;

        border: 1px solid #eee;

    }



    .newslist li a figure {

        overflow: hidden;

    }



    .newslist li a img {

        width: 100%;

    }



    .newslist li a section {

        position: relative;

        padding: 20px 20px 20px 110px;

        border-bottom: 1px solid #eee;

    }



    .newslist li a time {

        position: absolute;

        top: 20px;

        left: 20px;

        display: block;

        color: #ccc;

        font-family: 'sysfont';

        color: #333;

    }



    .newslist li a time strong {

        display: block;

        font-size: 20px;

        line-height: 30px;

        font-weight: normal;

    }



    .newslist li a time em {

        display: block;

        font-size: 36px;

        line-height: 40px;

    }



    .newslist li a dl {

        position: relative;

    }



    .newslist li a dt {

        font-size: 15px;

        line-height: 30px;

        text-overflow: ellipsis;

        white-space: nowrap;

        overflow: hidden;

    }



    .newslist li a dd {

        color: #999;

        font-size: 13px;

        height: 40px;

    }



    .newslist li a i {

        position: absolute;

        bottom: 10px;

        right: 20px;

        display: block;

        font-size: 24px;

        color: #666;

    }



    .newslist li a span {

        position: absolute;

        bottom: 10px;

        left: 20px;

        color: #666;

    }



    .newslist li a:hover {

        box-shadow: 0 0 10px rgba(0,0,0,0.1);

    }



    .newslist li a:hover i {

        animation: mctranslatex 1s infinite ease-in-out;

        -webkit-animation: mctranslatex 1s infinite ease-in-out;

        color: #acce77;

    }



    .partner {

        padding: 40px 100px;

        background: #eee;

        background-image: linear-gradient(-45deg,transparent 49%,rgba(0,0,0,0.1) 51%,transparent 0);

        background-size: 6px 6px;

        background-repeat: repeat;

    }



    .partnerslide {

    }



    .partnerslide .swiper-container {

        padding-bottom: 40px;

    }



    .partnerslide .swiper-pagination {

        bottom: 0;

    }



    .partnerslide figure {

        padding: 10px;

        border: 1px solid #ddd;

    }



    .partnerslide img {

        width: 100%;

    }



    .partnerslide img:hover {

        animation: pulse 1s linear 1;

    }



    .contact {

        padding: 40px 0;

    }



    .contactmain {

        overflow: hidden;

    }



    .contactmainmap {

        float: left;

        width: 50%;

    }



    .contactmaininfo {

        float: right;

        width: 50%;

        box-sizing: border-box;

        padding: 40px;

    }



    .contactmaininfo h2 {

        font-size: 36px;

        line-height: 40px;

        position: relative;

        margin-bottom: 5px;

        color: #acce77;

    }



    .contactmaininfo h3 {

        opacity: 0.8;

        font-size: 18px;

        color: #999;

        text-transform: uppercase;

        font-weight: normal;

        margin-bottom: 30px;

    }



    .contactmaininfo section {

        font-size: 16px;

        line-height: 30px;

        margin-bottom: 30px;

    }



    .contactmaininfo a {

        display: inline-block;

        line-height: 40px;

        background: #acce77;

        color: #fff;

        border-radius: 40px;

        padding: 0 30px;

    }



    .flink {

        padding: 10px 100px;

        background: #f9f9f9;

    }



    .flink a {

        margin-right: 10px;

    }

}



@media (max-width: 767px) {

    /* MOBILE */ .banner {

        position:relative;

    }



    .banner a {

        display: block;

    }



    /* .banner figure {

        overflow: hidden;

        position: relative;

        height: 180px;

    }



    .banner img {

        position: absolute;

        position: absolute;

        top: 50%;

        left: 50%;

        transform: translate(-50%,-50%);

        -webkit-transform: translate(-50%,-50%);

        height: 180px;

    } */



    .banner section {

        display: none;

        position: absolute;

        top: 0;

        left: 0;

        bottom: 0;

        width: 400px;

        padding: 160px 80px;

        background: #cf1213;

    }



    .banner section h2 {

        color: #fff;

        font-size: 50px;

        line-height: 60px;

        margin-bottom: 10px;

    }



    .banner section h3 {

        color: #fff;

        font-size: 32px;

        line-height: 40px;

        margin-bottom: 60px;

    }



    .banner section p {

        color: #fff;

        font-size: 22px;

        line-height: 30px;

    }



    @keyframes xbannerimgmc {

        0% {

            opacity: 0;

            transform: translate(-50%,-50%) scale(1);

        }



        10% {

            opacity: 1;

        }



        90% {

            opacity: 1;

        }



        100% {

            opacity: 0;

            transform: translate(-50%,-50%) scale(1.1);

        }

    }



    .banner .iconfont {

        font-size: 25px;

    }



    .banner .swiper-button-prev {

        left: 5%;

    }



    .banner .swiper-button-next {

        right: 5%;

    }



    .advan {

        display: flex;

        padding: 20px 0;

        background: #fff;

        box-shadow: 0 0 10px rgba(0,0,0,0.1);

    }



    .advannav {

        width: 100%;

    }



    .advannav ul {



    }



    .advannav li {

        float: left;

        position: relative;

    }



    .advannav li a {

        display: block;

        text-align: center;

    }



    .advannav li figure {

        position: absolute;

        top: -14px;

        left: 0px;

    }



    .advannav li figure i {

        display: block;

        width: 25px;

        height: 25px;

        font-size: 25px;

        line-height: 40px;

        margin: 0 auto 30px;

        background: #acce77;

        color: #fff;

        padding: 10px;

        border-radius: 60px;

        position: relative;

        text-align: center;

    }



    .advannav li figure i:before {

        position: absolute;

        top: 3px;

        left: -5px;

        bottom: -5px;

        right: -5px;

        /* border: 1px dashed #acce77; */

        /* border-radius: 80px; */

    }

    .advannav li:nth-child(1) figure{

        position: absolute;

        top: -2px;

        left: 30px;

    }

    .advannav li:nth-child(2) figure{

        position: absolute;

        top: -2px;

        left: 48px;

    }

    .advannav li:nth-child(2) h3 {

        margin-left: 103px;

    }

    .advannav li:nth-child(3) figure{

        position: absolute;

        top: 10px;

        left: 30px;

    }

    .advannav li:nth-child(3) h3 {

        margin-top: 14px;

    }

    .advannav li:nth-child(4) figure{

        position: absolute;

        top: 10px;

        left: 30px;

    }

    .advannav li:nth-child(4) h3 {

        margin-top: 14px;

    }

    .advannav li h3 {

        font-size: 18px;

        font-weight: normal;

        line-height: 40px;

        margin-left: 85px;

    }



    .advannav li p {

        color: #999;

        text-transform: uppercase;

        padding: 0 10px;

    }



    .advannav li:hover figure i {

        animation: xx 3s infinite ease-in-out;

        -webkit-animation: x 3s infinite ease-in-out;

    }



    .advannav li:hover figure i:before {

        animation: mcrotate 3s infinite ease-in-out;

        -webkit-animation: mcrotate 3s infinite ease-in-out;

    }



    .search {

        padding: 15px 20px;

        background: #fff;

        box-shadow: 0 0 10px rgba(0,0,0,0.1);

        text-align: center;

    }



    .searchhotkey {

        margin-bottom: 10px;

    }



    .searchhotkey a:not(:last-child) {

        margin-right: 10px;

    }



    .searchform {

    }



    .searchform form {

        position: relative;

    }



    .searchform input {

    }



    .searchform input.txt {

        height: 30px;

        line-height: 30px;

        background: #f9f9f9;

        padding: 0 10px;

        box-sizing: border-box;

        width: 100%;

    }



    .searchform input.txt::-webkit-input-placeholder {

        color: #ccc;

        font-size: 12px;

    }



    .searchform input.btn {

        position: absolute;

        top: 0;

        right: 0;

        height: 30px;

        background: #acce77;

        padding: 0 20px;

        color: #fff;

    }



    .title {

        margin-bottom: 20px;

        overflow: hidden;

        text-align: center;

    }



    .title h2 {

        font-size: 36px;

        line-height: 40px;

        position: relative;

        margin-bottom: 5px;

        color: #acce77;

    }



    .title h3 {

        opacity: 0.8;

        font-size: 18px;

        color: #333;

        text-transform: uppercase;

        font-weight: normal;

    }



    .title h3 span {

        position: relative;

        display: inline-block;

    }



    .title h3 span:before {

        content: '';

        display: block;

        position: absolute;

        top: 50%;

        left: 100%;

        margin-left: 30px;

        width: 50px;

        height: 1px;

        background: #999;

    }



    .title h3 span:after {

        content: '';

        display: block;

        position: absolute;

        top: 50%;

        right: 100%;

        margin-right: 30px;

        width: 50px;

        height: 1px;

        background: #999;

    }



    .title p {

        opacity: 0.8;

        font-size: 18px;

        color: #333;

        text-transform: uppercase;

        font-weight: normal;

    }



    .product {

        padding: 40px 20px;

        background: #f2f2f2;

    }



    .productmain {

        overflow: hidden;

    }



	.productclass{overflow:hidden;background:#acce77;margin-bottom:30px;}

		.productclass .swiper-container{overflow: hidden;}

        .productclass .swiper-slide {width: 50%!important;}

		.productclass h3{line-height:45px;text-align:center;border-left:1px solid rgba(255,255,255,0.4);}

		.productclass h3 a{color:#fff;}



		.productclass .swiper-slide-thumb-active h3{background:#acce77;}

		.productclass .swiper-slide-thumb-active h3 a{color:#fff;}



    .productlist {

    }



    .productlist h3 {

        font-size: 14px;

        background: #fff;

        line-height: 40px;

        margin-bottom: 20px;

        position: relative;

        padding: 0 20px 0 30px;

    }



    .productlist h3:after {

        content: '';

        display: block;

        position: absolute;

        top: 15px;

        left: 20px;

        bottom: 15px;

        width: 2px;

        background: #acce77;

    }



    .productlist h3 a {

        position: absolute;

        top: 50%;

        transform: translateY(-50%);

        right: 20px;

        font-size: 12px;

        line-height: 16px;

        text-transform: uppercase;

        font-weight: normal;

        display: inline-block;

        height: 16px;

    }



    .productlist ul {

        margin: 0 -1%;

    }



    .productlist li {

        float: left;

        width: 48%;

        margin: 0 1% 20px;

    }



    .productlist li a {

        display: block;

        text-align: center;

        background: #fff;

    }



    .productlist li a figure {

        overflow: hidden;

        position: relative;

        background: #f2f2f2;

        border: 1px solid #eee;

    }



    .productlist li a figcaption {

        position: absolute;

        top: 50%;

        left: 50%;

        transform: translate(-50%,-50%);

        opacity: 0;

        transition: all 0.3s ease-out 0s;

    }



    .productlist li a figcaption i {

        font-size: 30px;

        display: inline-block;

        border: 2px solid #fff;

        width: 30px;

        height: 30px;

        border-radius: 30px;

        line-height: 30px;

        color: #fff;

    }



    .productlist li a img {

        width: 100%;

    }



    .productlist li a h4 {

        font-size: 14px;

        font-weight: normal;

        line-height: 40px;

        text-overflow: ellipsis;

        white-space: nowrap;

        overflow: hidden;

    }



    .productlist li a:hover figcaption {

        opacity: 1;

    }



    .productlist li a:hover img {

        transform: scale3d(1.05, 1.05, 1);

        opacity: 0.7;

    }



.guarantee{position:relative;overflow:hidden;padding:40px 20px;}

	.guaranteetitle{text-align:center;background:url(http://www.luokanghuagong.cn/template/default/img/ico1.jpg) no-repeat center bottom;padding-bottom:30px;margin-bottom:40px;}

		.guaranteetitle h2{font-size:48px;line-height:60px;margin-bottom:10px;}

		.guaranteetitle h2 span{color:#acce77;}

		.guaranteetitle h3{font-size:18px;color:#666;font-weight:normal;}

		

	.guaranteecon{position:relative;}

		.guaranteecon .iconfont{display:none;}

		.guaranteecon figure{margin-bottom:20px;}

		.guaranteecon figure img{width:100%;}

		.guaranteecon section dt{font-size:24px;line-height:30px;padding-bottom:20px;}

		.guaranteecon section dd{font-size:16px;color:#999;}

		.guaranteecon section dd>a{

            display: inline-block;

            background: #acce77;

            color: #fff;

            border-radius: 3px;

            font-size: 12px;

            padding: 6px 20px;

            margin-top: 5px;

        }

		.guaranteecon section dd p a{font-size:14px;}

		.guaranteecon .swiper-pagination{display:none;}

	.guaranteetab{}

		.guaranteetab .iconfont{display:none;}

		.guaranteetab h2{font-size:22px;line-height:30px;margin-bottom:20px;position:relative;}

		.guaranteetab h2:after{content:'';display:block;position:absolute;top:-15px;left:0;width:50px;height:3px;background:#acce77;}

		.guaranteetab h3{text-align:center;font-size:14px;font-weight:normal;background:#fff;color:#333;}

		.guaranteetab .swiper-slide-thumb-active h3{background:#acce77;color:#fff;}



    .about {

        padding: 40px 20px;

        position: relative;

    }



    .aboutmix {

    }



    .aboutmixcover {

    }



    .aboutmixcover figure {

        overflow: hidden;

    }



    .aboutmixcover img {

        width: 100%;

    }



    .aboutmixcover video {

        width: 100%;

        background: #000;

    }



    .aboutmixinfo {

    }

    



    .aboutmain {

    }



    .aboutmaintitle {

        margin-bottom: 20px;

    }



    .aboutmaintitle h2 {

        font-size: 18px;

        line-height: 40px;

        font-weight: normal;

        padding-bottom: 5px;

        position: relative;

        margin-bottom: 10px;

    }



    .aboutmaintitle h2:after {

        content: '';

        display: block;

        position: absolute;

        bottom: 0;

        left: 0;

        width: 50px;

        height: 2px;

        background: #e9932c;

    }



    .aboutmaintitle p {

        color: #acce77;

        font-size: 36px;

        text-transform: uppercase;

    }



    .aboutmaininfo {

    }



    .aboutmaininfo a {

        display: inline-block;

        background: #acce77;

        color: #fff;

        border-radius: 3px;

        font-size: 12px;

        line-height: 30px;

        padding: 0 20px;

        margin-bottom: 10px;

    }

    .aboutmaininfo h2 {

        font-size: 36px;

        line-height: 40px;

        margin-bottom: 40px;

        position: relative;

    }



    .aboutmaininfo h2:after {

        content: '';

        display: block;

        position: absolute;

        top: 60px;

        left: 0;

        width: 50px;

        height: 2px;

        background: #fff;

    }



    .aboutmaininfo dl {

        margin-bottom: 20px;

    }



    .aboutmaininfo dt {

        font-size: 20px;

        line-height: 30px;

        font-weight: bold;

        margin-bottom: 10px;

    }



    .aboutmaininfo dd {

        font-size: 15px;

        line-height: 25px;

        opacity: 0.8;

        height: 75px;

        overflow: hidden;

    }



    .aboutnav {

        margin: 20px 0;

    }



    .aboutnav ul {

        display: flex;

        margin: 0 -1%;

    }



    .aboutnav li {

        flex: 1;

        margin: 0 1%;

    }



    .aboutnav li a {

        display: block;

        text-align: center;

        background: #eef2f6;

        padding: 20px 0;

        border-bottom: 2px solid #333;

        border-radius: 3px;

    }



    .aboutnav li figure i {

        display: block;

        width: 40px;

        height: 40px;

        margin: 0 auto 8px;

        font-size: 40px;

        line-height: 40px;

    }



    .aboutnav li h3 {

        font-size: 14px;

        font-weight: normal;

    }



    .news {

        padding: 40px 20px;

    }

    .newstitle {

        text-align: center;

    }

    .newstitle a {

        display: inline-block;

        padding: 6px 20px;

        border: 1px solid rgba(221, 221, 221, 1);

        color: #333333;

    }

    .newslist {

    }



    .newslist ul {

    }



    .newslist li {

        margin-bottom: 10px;

    }



    .newslist li a {

        display: block;

        position: relative;

        padding: 0 0 40px;

        background: #fff;

        border: 1px solid #eee;

    }



    .newslist li a figure {

        overflow: hidden;

    }



    .newslist li a img {

        width: 100%;

    }



    .newslist li a section {

        position: relative;

        padding: 20px 20px 20px 110px;

        border-bottom: 1px solid #eee;

    }



    .newslist li a time {

        position: absolute;

        top: 20px;

        left: 20px;

        display: block;

        color: #ccc;

        font-family: 'sysfont';

        color: #acce77;

    }



    .newslist li a time strong {

        display: block;

        font-size: 20px;

        line-height: 30px;

        font-weight: normal;

    }



    .newslist li a time em {

        display: block;

        font-size: 36px;

        line-height: 40px;

    }



    .newslist li a dl {

        position: relative;

    }



    .newslist li a dt {

        font-size: 15px;

        line-height: 30px;

        text-overflow: ellipsis;

        white-space: nowrap;

        overflow: hidden;

    }



    .newslist li a dd {

        color: #999;

        font-size: 13px;

    }



    .newslist li a i {

        position: absolute;

        bottom: 10px;

        right: 20px;

        display: block;

        font-size: 24px;

        color: #666;

    }



    .newslist li a span {

        position: absolute;

        bottom: 10px;

        left: 20px;

        color: #666;

    }



    .newslist li a:hover {

        box-shadow: 0 0 10px rgba(0,0,0,0.1);

    }



    .newslist li a:hover i {

        animation: mctranslatex 1s infinite ease-in-out;

        -webkit-animation: mctranslatex 1s infinite ease-in-out;

        color: #acce77;

    }



    .message {

        padding: 40px 20px;

        background: url(../image/bgmessage.jpg) no-repeat center center;

        background-size: auto 100%;

    }



    .message .title {

        color: #fff;

        margin-bottom: 20px;

    }



    .message .title p {

        color: #fff;

    }



    .message .title h2 {

        font-size: 36px;

        line-height: 40px;

        position: relative;

        margin-bottom: 5px;

        color: #fff;

    }



    .messageform {

    }



    .messageform ul {

    }



    .messageform li {

        margin-bottom: 10px;

        position: relative;

    }



    .messageform li input {

        width: 100%;

        box-sizing: border-box;

        border: none;

        height: 40px;

        line-height: 40px;

        padding: 0 10px;

    }



    .messageform li textarea {

        width: 100%;

        box-sizing: border-box;

        border: none;

        height: 40px;

        padding: 10px;

        top: 0;

    }



    .messageform li:nth-of-type(5) input {

        background: #acce77;

        color: #fff;

    }

}





.banner img {

	width: 100%;

}