/*公用变量*/

/*初始化样式*/

body,

ol,

ul,

h1,

h2,

h3,

h4,

h5,

h6,

p,

th,

td,

dl,

dd,

form,

fieldset,

legend,

input,

textarea,

select {

    margin: 0;

    padding: 0;

}

*{box-sizing: border-box}

body {

    font: 14px "微软雅黑", "Arial Narrow", HELVETICA;

    background: #fff;

    -webkit-text-size-adjust: 100%;

    color: #333;

}

a {

    color: #666666;

    text-decoration: none;

}

a:hover {

    color: #666666;

    text-decoration: none;

    cursor: pointer;

}

em {

    font-style: normal;

}

li {

    list-style: none;

}

img {

    border: 0;

    vertical-align: middle;

}

table {

    border-collapse: collapse;

    border-spacing: 0;

}

p {

    word-wrap: break-word;

}

.fl {

    float: left;

}

.fr {

    float: right;

}

.clearfix {

    *zoom: 1;

}

.clearfix:before,

.clearfix:after {

    display: table;

    line-height: 0;

    content: "";

}

.clearfix:after {

    clear: both;

}

.vcenter{

    display: -webkit-box;

    display: -moz-box;

    display: -webkit-flex;

    display: flex;

    -webkit-box-align: center;

    -moz-box-align: center;

    -ms-flex-align: center;

    -webkit-align-items: center;

    align-items: center;

}

#header{background-color: #fff;height: 70px;padding: 0 5%;line-height: 70px;position: fixed;top:0;z-index: 99;width: 100%;box-shadow: 0px 2px 6px rgba(0, 0, 0, 0.1);}
#header>div{text-align: right;width: 50%;line-height: 70px;padding: 15px 0;height: 70px;}
#header>div.fr{justify-content: flex-end;padding: 20px 0;}
#header img{height: 100%;}
#header .mmenu{display: none}
#header ul{margin-left:15%;font-size: 20px;color: #000}
#header ul li{margin-right: 40px;}
#banner{position: relative;overflow: hidden;background-image: url("../img/banner.jpg");background-position: center;background-repeat: no-repeat;background-size: cover;width: 100%}

#banner .bannerbg>img{width: 100%}

#banner .bannerbg{position: absolute;bottom: 0;width: 100%}

#banner .bannerbg .slogn,#banner .bannerbg .consult{position: absolute;

    top: 60%;

    transform: translateY(-50%);}

#banner .bannerbg .slogn{

    left: 18%;}

#banner .bannerbg .consult{

    right: 25%;

    top:70%;

    width: auto;

}

#banner .bannerImg{display: none}

#brand,#brand img{width: 100%}

.question{width: 100%;text-align: center;}

.question .title{max-width: 80%}

.question .line{width: 100%;text-align: center;color: #fff;background: #fa1212;font-size: 30px;padding: 10px}

.question .process{margin: 60px 0}

.advantage{width: 100%;position: relative}

.advantage img:first-child{width: 60%}

.linebox{width: 100%;padding: 10px;font-size: 30px;color: #fff;background: #fa1212}

.advantageContent{width: 30%;position: absolute;margin: auto;left: 0;right: 0;bottom: 0;top: -10%}

.process1{margin-bottom: 110px;max-width: 90%}

.section{padding: 100px 15%;}

#section{background: #f6f8fb}

#section .clearfix>div{width: 50%;}

#section .clearfix>div.fr{text-align: right}

#section .clearfix>div.fr img{max-width: 100%}

.section .title{font-size: 36px;font-weight: bold;color: #333;width: 100%;text-align: center;margin-bottom: 100px}

.stitle{font-size: 36px;margin-bottom: 45px;padding-left: 20px;}

.scontent{font-size: 18px;color:#747474;padding-left: 20px;margin-bottom: 60px}

.scontent span{font-size: 24px;}

.stitle span{font-size: 48px;}

.section .red{color: #fa1212}

.section img{max-width: 100%}

#section1{padding: 60px 20%;}

#section1 li{width: 25%;text-align: center;font-size: 18px;color: #262626;margin-bottom: 50px}

#section1 li div:last-child{margin-top: 20px}

#section1 .icon{width: 51%;height: 0;padding-bottom: 50%;margin:0 auto;background-size:cover;background-image: url("../img/icon.png");}

#section1 .icon1{background-position: 0 0}

#section1 .icon2{background-position: 0 14%}

#section1 .icon3{background-position: 0 28%}

#section1 .icon4{background-position: 0 42%}

#section1 .icon5{background-position: 0 56%}

#section1 .icon7{background-position: 0 70%}

#section1 .icon6{background-position: 0 84%}

#section1 .icon8{background-position: 0 98%}

#section2{padding: 60px 0 0;background: #f6f8fb}

#section2 li{padding:  60px 20%}

.section .div60{width: 55%;}

.section .div60 img{max-width: 100%}

.section .div40{width: 45%;padding: 5%}

.section .left{padding-left: 0;}
.section .div60{margin-top: 3%;}


.section .right{padding-right: 0}

.section .left div{text-align: left}

.section .right div{text-align: right}

#section2 li:last-child{background: #fff}

.consult{margin-right: -20px}

.madvantage,#section .mclearfix,#mfooter,#msection5{

    display: none;

}

#section3{background: #f6f8fb;text-align: center}

#section3 div:first-child{margin-bottom: 60px}

#section3 ul li{width: 22%;background: url("../img/lingyubg.png");height: 0;padding-bottom: 10%;margin-right: 4%;text-align: center;position: relative;margin-bottom: 30px;    background-size: cover;}

#section3 ul li div{position: absolute;

    top: 50%;

    transform: translateY(-50%);

    left: 0;

    right: 0;font-size: 24px}

#section3 ul li:nth-child(4n){margin-right: 0}

#section4{text-align: center;padding-bottom: 200px}

#section4{background-image: url("../img/section4bg.png");background-size: initial;background-position: bottom;background-repeat: no-repeat;}

#section5 .stitle{font-size: 24px;margin-bottom: 20px}

#section5 .scontent{margin-bottom: 20px}

#section5 .stitle span{font-size: 30px;}

#section5 .div40>div:first-child{margin-bottom: 40px;}

#section6 {padding: 0}

#section6 .section{padding: 50px 15%}

#section6 .redbg{background: #fa1212;padding: 30px 15%}

#section6 .video{width: 70%;margin: 0 auto;}

#section6 .video .videoBox{width: 100%;border-radius: 20px 20px 20px 0;overflow: hidden;}

#section6 .video .videobg{width: 70%;background-image:url("../img/bottom1.png");background-size: cover;height: 0;background-repeat: no-repeat;margin-top: -3px;padding:0 30px ;padding-bottom: 10%; position: relative}

#section6 .redbg .video .videobg{background-image:url("../img/bottom.png");}

#section6 .video .videobg div{position: absolute;top: 50%;transform: translateY(-50%);color: #fff;font-size: 26px}

#section6 .redbg .video .videobg div{color: #fa1212;}

#section6 .success{font-size: 20px;color: #5c5c5c;margin-top: 20px}

#section6 .redbg .success{color: #fff;}

/*#section6 li .success .left{width: 20%}*/

#section6 li .success .right{width: 75%;padding-left: 10px}

#section7{background: url("../img/section7bg.png") no-repeat center ;background-size: cover;padding: 20px 15%}

#section7 .swiper-slide img{display: block;border-radius: 30px;overflow: hidden;margin: 0 auto;width: 80%}

#section7 .title{text-align: center;margin-bottom: 20px}

#section7 .consult{margin-top: 20px;display: block}

#contact{text-align: center;padding: 60px 15%}

#contact img{max-width: 100%}

#contact .consult{margin-top: 20px;}

#section7 .swiper-button-next{

    background-image:url("../img/right.png")

}

.swiper-button-prev{

    background-image:url("../img/left.png")

}

#section7 .swiper-button-next, .swiper-button-prev{

    width: 80px;

    height: 80px;

    background-size: 80px 80px;

}

#section7 .clearfix{

    width: 65%;margin: 0 auto;line-height: 1.5;font-size: 20px;margin-top: 20px;color: #fff

}

#mbrand,#section1 .msearch,#msection3,msection5,#section6 .section img:last-child,#section7 .title img:last-child,.phone_bottom_nav,.mtitle .title{display: none}

#footer{

    padding: 20px 0;

    width: 100%;

    background-color: #e0e3e8;

    text-align: center;

    font-size: 16px;

    color: #5f5f5f;

}

#footer .top a{

    display: inline-block;

    margin-left: 20px;

}

#footer .mid{

    margin: 10px 0 20px;

}

#footer .bottom{

    justify-content: center;

}

#footer .bottom .sline{

    display: block;

    height: 20px;

    width: 2px ;

    background-color: #5f5f5f;

    margin: 0 40px;

}
.fixedbottom{
    position: fixed;bottom: 10px;left: 0;right: 0;width: 80%;margin: auto;text-align: center;z-index: 9999;
}
.fixedbottom img{max-width: 100%}
#rmenu .weixin_desc img {
    width: 100%;
}

#rmenu.active {
    opacity: 1;
    top: 48%;
}

#rmenu.disactive {
    opacity: 0;
    top: 60%;
}

#rmenu .rmenu_weixin:hover .weixin_desc {
    left: -290px;
    opacity: 1;
    filter: alpha(opacity);
    visibility: visible;
}
#rmenu {
    position: fixed;
    top: 60%;
    right: 10px;
    z-index: 9999;
    opacity: 0;
    transition: 0.5s;
}

#rmenu .rmenu_item {
    display: block;
    width: 80px;
    height: 80px;
    cursor: pointer;
    position: relative;
    background: #fff;
    margin-top: 1px;
    border-radius: 0;
    border: 1px solid #e1e1e1;
}

#rmenu .rmenu_zixun {
    background-color: #bd101a;
}

#rmenu .btn-consultation {
    display: block;
    width: 36px;
    height: 34px;
    margin: 10px auto 6px;
    background: url(https://static.jtljia.com/images/icon/icon-quicklink.png);
    background-position-x: 0%;
    background-position-y: 0%;
    background-position: -43px -43px;
}

#rmenu .consultation {
    display: block;
    width: 60px;
    height: 16px;
    line-height: 16px;
    margin: 0 auto;
    text-align: center;
    font-size: 14px;
    color: #fff;
    font-weight: bold;
}

#rmenu .btn-tel {
    display: block;
    width: 36px;
    height: 34px;
    margin: 10px auto 6px;
    background: url('http://www.yilie88.com/images/phone.gif');
    background-size: 100% 100%;
}

#rmenu .rmenu_tel {
    background: #1F2B40;
}

#rmenu .tel {
    display: block;
    width: 60px;
    height: 16px;
    line-height: 16px;
    margin: 0 auto;
    text-align: center;
    font-size: 14px;
    color: #fff;
    font-weight: bold;
}

#rmenu .btn-weixin {
    display: block;
    width: 36px;
    height: 34px;
    margin: 10px auto 6px;
    background: url("http://www.yilie88.com/images/rweixin2.png");
    background-size: 100% 100%;
}

#rmenu .weixin {
    display: block;
    width: 60px;
    height: 16px;
    line-height: 16px;
    margin: 0 auto;
    text-align: center;
    font-size: 14px;
    color: #333;
    font-weight: bold;
}

#rmenu .back-top {
    display: block;
    width: 27px;
    height: 30px;
    margin: 12px auto 10px;
    background: url(https://static.jtljia.com/images/icon/icon-quicklink.png);
    background-position-x: 0%;
    background-position-y: 0%;
    background-position: -128px -43px;
}

#rmenu .goback-top {
    display: block;
    width: 60px;
    height: 16px;
    line-height: 16px;
    margin: 0 auto;
    text-align: center;
    font-size: 14px;
    color: #fff;
    font-weight: bold;
}

#rmenu .rmenu_return {
    background: #cdcdcd;
}

#rmenu .tel_desc {
    padding: 8px 0 0 0;
    width: 280px;
    height: 63px;
    background: #1f2b40;
    font-size: 24px;
    color: #FFFFFF;
    letter-spacing: 0;
    text-align: center;
    position: absolute;
    top: 0px;
    left: 0;
    font-size: 12px;
    transition: all 0.5s;
    z-index: -1;
    opacity: 0;
    filter: alpha(opacity=0);
}

#rmenu .rmenu_tel:hover .tel_desc {
    left: -290px;
    opacity: 1;
    filter: alpha(opacity);
    visibility: visible;
}

#rmenu .tel_desc h2 {
    font-weight: bold;
    font-size: 20px;
    margin: 0 0 4px 0;
}

#rmenu .tel_desc .call-title {
    font-size: 14px;
    margin-top: 0px !important;
}

#rmenu .weixin_desc {
    padding: 1px;
    width: 280px;
    height: 63px;
    font-size: 24px;
    color: #FFFFFF;
    letter-spacing: 0;
    text-align: center;
    position: absolute;
    top: 0px;
    left: 0;
    font-size: 12px;
    transition: all 0.5s;
    z-index: -1;
    opacity: 0;
    filter: alpha(opacity=0);
    transform: translateY(-50%);
}

#rmenu .weixin_desc img {
    width: 100%;
}

#rmenu.active {
    opacity: 1;
    top: 48%;
}

#rmenu.disactive {
    opacity: 0;
    top: 60%;
}

#rmenu .rmenu_weixin:hover .weixin_desc {
    left: -290px;
    opacity: 1;
    filter: alpha(opacity);
    visibility: visible;
}
@media (max-width: 1500px) {
    #banner .bannerbg .slogn{

        width: 35%;

    }

    #banner .bannerbg .slogn img{

        width: 100%;

    }
    .section,#section1{padding:100px 10%}
    #section .clearfix>div.left{width: 60%}
    #section .clearfix>div.left .stitle{font-size: 26px}
    #section .clearfix>div.left .stitle span{font-size: 36px}
    #section .clearfix>div.right{width: 40%}
    #section2 li{padding: 60px 10%}
    #section7 .swiper-button-next, .swiper-button-prev {
        width: 50px;
        height: 50px;
        background-size: 50px 50px;
    }
    #section6 .success{font-size: 18px}
    #section6 .section{padding: 50px 10%}
    #section6 .video .videobg div{

        font-size: 22px;

    }

}

@media screen and (max-width: 1300px){
    .section,#section1{padding:100px 8%}
    #section2 li{padding: 60px 8%}
    #section6 .video{width: 90%}
    #section7 .clearfix{
        width: 80%;
        font-size: 18px;
    }

    #section6 .video .videobg div{

        font-size: 22px;

    }

    #section6 .success{

        font-size: 18px;

    }

}

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

    #section6 .video .videobg div{

        font-size: 18px;

    }

    #section6 .success{

        font-size: 16px;

    }

}

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

    #banner .bannerbg .slogn{

        width: 40%;

    }

    #banner .bannerbg .slogn img{

        max-width: 100%;

    }

    #banner .bannerbg .consult{

        width: 16%;

    }

    .section {

        padding: 60px 4%;

    }
    #section1, #section2 li {
        padding: 60px 4%;
    }
    #section2 .div60{width: 45%}
    #section2 .div40{width: 55%;padding: 0}
    #section7 .swiper-button-next, .swiper-button-prev {

        width: 40px;

        height: 40px;

        background-size: 40px 40px;

    }

    #section6 .video .videobg div{

        font-size: 18px;

    }

    #section6 .video .videobg{

        padding: 0 16px 10%;

    }

    #section6 .success{

        font-size: 14px;

    }

    #section6 .video {

        width: 100%;

        margin: 0 auto;

    }

    #section7{

        padding: 20px 10%;

    }

}

@media screen and (max-width: 769px) {
    #header>div{width: 100%}
    .section ,#section1, #section2 li{

        padding: 30px 5%;

    }

    #section7 {

        padding: 20px 5%;

    }

    .tel{display: none}

    #header{height: 74px;line-height: 74px}

    #banner{background: none;height: auto!important;}

    #banner .bannerImg{display: block;width: 100%;}

    .linebox {

        padding: 5px 10px;

        font-size: 20px;

    }

}

@media screen and (max-width: 481px) {

    #header .logo{height: 36px;width: auto}

    #banner .bannerbg,#brand{

        display: none;

    }

    #mbrand {

        display: block;

        margin-top: -50px;

        /*z-index: 999999;*/

        position: relative;

        margin-bottom: 30px;

    }

    #mbrand img{max-width: 100%}

    .madvantage{

        text-align: center;

        padding-bottom: 30px;

        display: block;

    }

    .madvantage img{

        width: 100%;

        margin-top: 20px;

    }
    .mtitle .title{
        width: 80%;
        margin: 0 auto;
    }
    .madvantage img:first-child{

        width: 50%;

    }

    .question .process{

        width: 50%;

        margin: 20px 0;

    }

    .section .title{

        font-size: 20px;

        margin-bottom: 30px;

    }

    #section .fl,#section .fr{

        float: none;

    }

    #section .mclearfix>div{

        width: 100%;

    }

    #section .mclearfix>div.right,.section .left div {

        text-align: center;

    }

    #section6 li .success .left{width: 25%}



    .stitle{font-size: 16px;margin-bottom: 20px;}

    .stitle span {

        font-size: 18px;

    }

    .scontent{font-size: 14px;margin-bottom: 0}

    .scontent span {

        font-size: 16px;

    }

    /*#section{padding: 30px 0}*/

    #section .mclearfix>div.left{

        margin-top: 20px;

    }

    #section .mclearfix>div.right img{

        max-width: 70%;

        margin: 20px auto;

    }

    #section .title {

        font-size: 20px;

        margin-bottom: 0;

    }
    #header,#header>div{
        height: 60px;
        line-height: 60px;
    }
    #header>div{
        padding: 10px 0;
    }
    #header .mmenu{position: relative}
    #header .mmenu ul{
        position: absolute;top: 60px;
        background: #fff;z-index: 99;
        width: 100%;
        font-size: 16px;
        border-top:1px solid #dcdcdc;
        border-left:1px solid #dcdcdc;

    }
    #header .mmenu ul li{
        text-align: center;
        width: 100%;
        height: 60px;
        line-height: 60px;border-bottom:1px solid #dcdcdc ;
    }
    #header .mmenu ul li:hover{
        background: #dcdcdc;
    }
    #header .mmenu{display: inline-flex}
    #header>div.fr{padding: 10px 0}
    #header>div{width: 50%}
    #section1 .search,.consult,#section7 .consult,#section .clearfix,#section .title,.question,.advantage,#section4,#section3,#section5,#section6 .section img:first-child,#section7 .title img:first-child,#section7 .swiper-button-next, .swiper-button-prev,#footer,.fixedbottom,#rmenu,#header ul.nav,#header .mmenu ul,#header .right{display: none}

    #section1 .msearch,#section2,#section .mclearfix,#msection3,#msection5,#section6 .section img:last-child,#section7 .title img:last-child,#mfooter,.phone_bottom_nav,.mtitle .title{display: block}

    #section2 .right,#section2 .left{width: 100%;}

    #section2 .right{

        padding: 20px;

    }
    #section .mclearfix{
        width: 80%;margin: 0 auto;
    }
    #section2 .right div{

        text-align: center;

        padding-left: 0;

    }
    #section2{background: none;padding: 0 0 30px 0}
    #section2 li.vcenter{display: block;padding: 30px 10%}

    #section2 .madvantage{padding-bottom: 0}

    #msection3 img{width: 100%}

    #msection5>div{width: 85%;margin: 0 auto;}

    #msection5 .box{border: 1px solid #fa1212;padding-bottom: 20px;margin-top: 20px}

    #msection5 .box img{width: 100%}

    #msection5 .box div{padding-left: 0;text-align: center;padding: 0 10px}

    #msection5 .box div.stitle{margin: 20px 0 0}

    #msection5 .box div.scontent{text-align: left}

    #section6{background-color: #f6f8fb;padding: 30px 0}

    #section6 .section{padding: 30px 8%}

    #section6 .video .videobg div,#section6 .success{font-size: 12px}

    #section6 .video .videobg{padding:0 0 10% 10px;}

    /*#section6 li .success .left{width: 25%}*/

    #section6 li .success .right{width: 75%;padding: 0;}

    #section6 .section img:last-child{margin-bottom: 20px}

    #section6 .redbg{background:none}

    #section6 .redbg .video .videobg {

        background-image: url(../img/bottom1.png);

    }

    #section6 .redbg .video .videobg div{

        color: #fff;}

    #section7 {

        background: url(../img/msection7bg.png) no-repeat center;

        background-size: cover;

        padding: 30px 8%;

    }

    #section7 .swiper-slide img{

        width: 100%;

    }

    #section7 .clearfix{

        width: 100%;font-size: 14px;margin-top: 20px;color: #fff

    }

    #section7 .swiper-slide img{

        border-radius: 8px;

    }

    #contact{

        padding: 60px 20%;

    }

    #mfooter{width: 100%;position: relative;margin-bottom: 40px;}

    #mfooter img{width: 100%}

    #mfooter a{

        position: absolute;right: 10%;

        top: 43%;

        color: #fff;

        font-size: 12px;

    }

    .phone_bottom_nav {

        position: fixed;

        left: 0;

        bottom: 0px;

        z-index: 9999;

        padding: 10px 0;

        background-color: #e0232e;

    }

    .phone_bottom_nav a {

        display: inline-block;

        width: 50%;

        font-size: 18px;

         line-height: 1.5;

        color: #fff;

        text-align: center;

    }

    #section6 .redbg .success {

        color: #5c5c5c;

    }

}