﻿.wrap {
    width: 100%;
    background-color: #fff;
    overflow: hidden;
}

.top {
    width: 100%;
    background-color: #fff;
    overflow: hidden;
}

.con {
    width: 100%;
    position: relative;
    overflow: hidden;
}

.ly1 {
    width: 100%;
    padding: 40px 0;
    overflow: hidden;
}

.ly1 .ly1inner {
    width: 100%;
    position: relative;
    overflow: hidden;
}

.ly1 .ly1inner .ly1innerlef {
    width: 50%;
    float: left;
}

.ly1 .ly1inner .ly1innerlef .slideBox {
    width: 100%;
    overflow: hidden;
    position: relative;
    float: left;
}

.ly1 .ly1inner .ly1innerlef .slideBox .hd {
    position: absolute;
    right: 0;
    bottom: 0;
    z-index: 9999;
    text-align: right;
}

.ly1 .ly1inner .ly1innerlef .slideBox .hd ul {
    font-size: 0;
    height: 45px;
    padding-right: 40px;
    line-height: 45px;
    text-align: right;
}

.ly1 .ly1inner .ly1innerlef .slideBox .hd ul li {
    width: 13px;
    height: 13px;
    display: inline-block;
    *zoom: 1;
    *display: inline;
    vertical-align: middle;
    border-radius: 13px;
    background-color: rgba(255, 255, 255, 0.6);
    margin-left: 5px;
}

.ly1 .ly1inner .ly1innerlef .slideBox .hd ul li.on {
    background-color: #fff;
}

.ly1 .ly1inner .ly1innerlef .slideBox .bd li a {
    display: block;
    position: relative;
}

.ly1 .ly1inner .ly1innerlef .slideBox .bd li a p {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
    height: 45px;
    line-height: 45px;
    padding-left: 15px;
    background: rgba(0, 0, 0, 0.6);
    font-size: 14px;
    color: #fff;
}

.ly1 .ly1inner .ly1innerlef .slideBox .bd li a img {
    width: 100%;
    display: block;
}

.ly1 .ly1inner .ly1innerrig {
    width: 47.5%;
    float: right;
}

.ly1 .ly1inner .ly1innerrig .list li a {
    width: 100%;
    height: 40px;
    line-height: 40px;
}

.ly1 .ly1list {
    overflow: hidden;
    margin-top: 25px;
}

.ly1 .ly1list a {
    width: 245px;
    float: left;
    margin-right: 15px;
}

.ly1 .ly1list a img {
    width: 100%;
    display: block;
}

.ly2 {
    width: 100%;
    padding: 40px 0;
    background-color: #f0f3f9;
}

.ly2 .ly2inner {
    width: 100%;
    overflow: hidden;
}

.ly2 .webly2inner {
    display: none;
}

.ly2 .ly2inner .item {
    margin-right: 2px;
    overflow: hidden;
    float: left;
}

.ly2 .ly2inner .item .itemlef {
    width: 115px;
    height: 400px;
    float: left;
    font-size: 32px;
    text-align: center;
    color: #fff;
    padding-top: 85px;
    cursor: pointer;
    background: url('bluebg.png') 0 0 no-repeat;
    background-size: cover;
}

.ly2 .ly2inner .item.active .itemlef {
    background: url('yellowbg.png') 0 0 no-repeat;
    background-size: cover;
}

.ly2 .ly2inner .item .itemrig {
    width: 0;
    opacity: 0;
    height: 400px;
    float: left;
    -webkit-transition: all 0.2s ease-in-out;
    transition: all 0.2s ease-in-out;
    background: url('yellowrigbg.png') 0 0 no-repeat;
    background-size: cover;
}

.ly2 .ly2inner .item.active .itemrig {
    width: 498px;
    opacity: 1;
    overflow: hidden;
}

.ly2 .ly2inner .item .itemrig .tswhlist {
    width: 98%;
    padding: 60px 0px 0px 35px;
    margin: 5px;
}

.ly2 .ly2inner .item .itemrig .rwlist {
    width: 98%;
    padding: 40px 0px 0px 80px;
    margin: 5px;
}

.ly2 .ly2inner .item .itemrig .zrjglist {
    width: 98%;
    padding: 50px 0px 0px 50px;
    margin: 5px;
}

.ly2 .ly2inner .item .itemrig .shznlist {
    width: 98%;
    padding: 65px 0px 0px 50px;
    margin: 5px;
}

.ly2 .ly2inner .item .itemrig .tswylist,
.ly2 .ly2inner .item .itemrig .rychlist {
    width: 98%;
    padding: 45px 0px 0px 30px;
    margin: 5px;
}

.ly2 .ly2inner .item .itemrig .tswylist li a,
.ly2 .ly2inner .item .itemrig .rychlist li a {
    height: 45px;
    line-height: 45px;
}

.ly2 .ly2inner .item .itemrig .rychlist li {
    padding-left: 25px;
}

.ly2 .ly2inner .item .itemrig .rychlist li::before {
    content: '';
    position: absolute;
    width: 25px;
    height: 22px;
    background: url('rychicon.png') center 0 no-repeat;
    left: 0;
    top: 50%;
    -webkit-transform: translate(-50%, -50%);
    transform: translate(-50%, -50%);
    overflow: hidden;
}

.ly2 .ly2inner .item .itemrig .tswhlist .rigitem {
    width: 180px;
    display: block;
    margin-bottom: 40px;
    margin-right: 40px;
    float: left;
    display: block;
}

.ly2 .ly2inner .item .itemrig .rwlist .rigitem {
    width: 120px;
    display: block;
    margin-bottom: 18px;
    margin-right: 68px;
    float: left;
    display: block;
}

.ly2 .ly2inner .item .itemrig .zrjglist .rigitem {
    width: 380px;
    display: block;
    margin-bottom: 25px;
    float: left;
    display: block;
}

.ly2 .ly2inner .item .itemrig .shznlist .rigitem {
    width: 120px;
    display: block;
    margin-bottom: 20px;
    margin-right: 20px;
    float: left;
    display: block;
}

.ly2 .ly2inner .item .itemrig .tswhlist .rigitem img,
.ly2 .ly2inner .item .itemrig .shznlist .rigitem img,
.ly2 .ly2inner .item .itemrig .zrjglist .rigitem img,
.ly2 .ly2inner .item .itemrig .rwlist .rigitem img {
    width: 100%;
    margin-bottom: 10px;
    display: block;
}

.ly2 .ly2inner .item .itemrig .tswhlist .rigitem p,
.ly2 .ly2inner .item .itemrig .shznlist .rigitem p,
.ly2 .ly2inner .item .itemrig .zrjglist .rigitem p,
.ly2 .ly2inner .item .itemrig .rwlist .rigitem p {
    font-size: 18px;
    text-align: center;
}

.ly3 {
    width: 100%;
    padding: 40px 0;
    overflow: hidden;
}

.ly3 .ly3inner ul {
    width: 1220px;
    overflow: hidden;
}

.ly3 .ly3inner li {
    width: 390px;
    height: 240px;
    float: left;
    margin-bottom: 15px;
    margin-right: 15px;
    overflow: hidden;
}

.ly3 .ly3inner li a {
    display: block;
    width: 100%;
    height: 100%;
    position: relative;
    overflow: hidden;
}

.ly3 .ly3inner li a img {
    display: block;
    width: 100%;
    height: 100%;
    -webkit-transition: all 0.3s linear;
    transition: all 0.3s linear;
}

.ly3 .ly3inner li a p {
    width: 100%;
    height: 45px;
    position: absolute;
    left: 0;
    bottom: 0;
    line-height: 45px;
    text-align: center;
    font-size: 16px;
    background: rgba(0, 0, 0, 0.4);
    color: #fff;
}

.ly3 .ly3inner li a:hover img {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
}

.ly4 {
    width: 100%;
    padding: 40px 0;
    background-color: #245399;
    overflow: hidden;
}

.ly4 .ly4inner {
    width: 100%;
    height: 770px;
    position: relative;
    overflow: hidden;
}

.ly4 .ly4inner .item {
    position: absolute;
    width: 339px;
    height: 339px;
    transform: translateZ(0deg);
    -webkit-transition: all .5s linear;
    transition: all .5s linear;
}

.ly4 .ly4inner .item a {
    position: relative;
    width: 100%;
    height: 100%;
    display: block;
}

.ly4 .ly4inner .item .hover {
    position: absolute;
    width: 240px;
    height: 240px;
    left: 50px;
    top: 48px;
    background-color: rgba(0, 0, 0, 0);
    overflow: hidden;
    z-index: 9999999999;
    -webkit-transform: rotateZ(45deg);
    transform: rotateZ(45deg);
}

.ly4 .ly4inner .item4 .hover,
.ly4 .ly4inner .item5 .hover {
    position: absolute;
    width: 280px;
    height: 280px;
    left: 60px;
    top: 61px;
    overflow: hidden;
    -webkit-transform: rotateZ(45deg);
    transform: rotateZ(45deg);
}

.ly4 .ly4inner .item img {
    display: block;
    width: 100%;
    height: 100%;
    -webkit-transition: all 0.5s linear;
    transition: all 0.5s linear;
}

.ly4 .ly4inner .item a .txt {
    width: 50%;
    line-height: 35px;
    border-radius: 35px;
    background: rgba(0, 0, 0, 0.4);
    text-align: center;
    color: #fff;
    position: absolute;
    left: 50%;
    top: 60%;
    -webkit-transform: translate(-50%);
    transform: translate(-50%);
}

.ly4 .ly4inner .item a .txt p {
    font-size: 18px;
    letter-spacing: 2px;
}

.ly4 .ly4inner .item a .txt p em {
    font-size: 38px;
    color: #fff;
    font-weight: bold;
}

.ly4 .ly4inner .item4,
.ly4 .ly4inner .item5 {
    position: absolute;
    width: 400px;
    height: 400px;
}

.ly4 .ly4inner .item1 {
    left: 0;
    top: 0;
}

.ly4 .ly4inner .item2 {
    left: 50%;
    top: 0;
    margin-left: -170px;
}

.ly4 .ly4inner .item3 {
    right: 0;
    top: 0;
}

.ly4 .ly4inner .item4 {
    left: 180px;
    top: 180px;
}

.ly4 .ly4inner .item5 {
    right: 180px;
    top: 180px;
}

.ly4 .ly4inner .item6 {
    left: 0;
    top: 430px;
}

.ly4 .ly4inner .item7 {
    left: 50%;
    top: 430px;
    margin-left: -170px;
}

.ly4 .ly4inner .item8 {
    right: 0;
    top: 430px;
}

.ly5 {
    width: 100%;
    padding: 40px 0 0;
    overflow: hidden;
}

.ly5 .ly5inner {
    width: 100%;
    overflow: hidden;
    margin-bottom: 5px;
}

.ly5 .ly5inner ul {
    width: 1420px;
    overflow: hidden;
}

.ly5 .ly5inner ul li {
    width: 260px;
    margin-bottom: 50px;
    float: left;
    margin-right: 210px;
}

.ly5 .ly5inner ul li:hover .prodimg img {
    -webkit-transform: rotateY(360deg);
    transform: rotateY(360deg);
}

.ly5 .ly5inner ul li a {
    display: block;
    width: 260px;
}

.ly5 .ly5inner ul li a .prodimg {
    width: 260px;
    height: 260px;
    margin-bottom: 10px;
}

.ly5 .ly5inner ul li a .prodimg img {
    width: 100%;
    height: 100%;
    display: block;
    -webkit-transition: all 0.5s linear;
    transition: all 0.5s linear;
}

.ly5 .ly5inner ul li a p {
    font-size: 24px;
    text-align: center;
}

.ly6 {
    width: 100%;
    padding: 40px 0;
    background-color: #f0f3f9;
    overflow: hidden;
}

.ly6 .ly6inner {
    width: 100%;
    overflow: hidden;
}

.ly6 .ly6inner ul {
    width: 1230px;
    overflow: hidden;
}

.ly6 .ly6inner ul li {
    width: 280px;
    height: 220px;
    float: left;
    margin-right: 26px;
}

.ly6 .ly6inner ul li a {
    display: block;
    width: 280px;
    height: 220px;
    overflow: hidden;
    position: relative;
}

.ly6 .ly6inner ul li a img {
    display: block;
    width: 100%;
    height: 100%;
    -webkit-transition: all 0.3s linear;
    transition: all 0.3s linear;
}

.ly6 .ly6inner ul li a p {
    font-size: 22px;
    color: #fff;
    line-height: 45px;
    text-align: center;
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
}

.ly6 .ly6inner ul li a img:hover {
    -webkit-transform: scale(1.2);
    transform: scale(1.2);
}


/* common */

.title {
    width: 100%;
    margin-bottom: 30px;
    overflow: hidden;
}

.title img {
    display: block;
    width: 100%;
}

@media screen and (max-width: 992px) {
    .title {
        width: 100%;
        padding: 0 10px;
        margin-bottom: 20px;
    }
    .title .titleimg {
        width: 100%;
        height: 31px;
    }
    .title .titleimg img {
        display: none;
    }
    .ly1,
    .ly2,
    .ly3,
    .ly4,
    .ly5,
    .ly6 {
        padding-top: 20px;
        padding-bottom: 20px;
    }
    .ly1 .title .titleimg {
        background: url('lytitle1.png') center center no-repeat;
        background-size: auto 100%;
    }
    .ly2 .title .titleimg {
        background: url('lytitle2.png') center center no-repeat;
        background-size: auto 100%;
    }
    .ly3 .title .titleimg {
        background: url('lytitle3.png') center center no-repeat;
        background-size: auto 100%;
    }
    .ly4 .title .titleimg {
        background: url('lytitle4.png') center center no-repeat;
        background-size: auto 100%;
    }
    .ly5 .title .titleimg {
        background: url('lytitle5.png') center center no-repeat;
        background-size: auto 100%;
    }
    .ly6 .title .titleimg {
        background: url('lytitle6.png') center center no-repeat;
        background-size: auto 100%;
    }
    .ly1 .ly1inner {
        width: 100%;
        padding: 0 10px;
        position: relative;
        overflow: hidden;
    }
    .ly1 .ly1inner .ly1innerlef {
        width: 100%;
        float: none;
    }
    .ly1 .ly1inner .ly1innerlef .slideBox {
        float: none;
    }
    .ly1 .ly1inner .ly1innerlef .slideBox .hd ul {
        padding-right: 10px;
    }
    .ly1 .ly1inner .ly1innerlef .slideBox .bd li a p {
        padding-right: 20%;
        white-space: nowrap;
        text-overflow: ellipsis;
        overflow: hidden;
    }
    .ly1 .ly1inner .ly1innerrig {
        width: 100%;
        float: none;
    }
    .ly1 .ly1list {
        display: -webkit-box;
        display: flex;
        -webkit-box-pack: justify;
        justify-content: space-between;
        -webkit-box-align: center;
        align-items: center;
        margin-top: 15px;
    }
    .ly1 .ly1list a {
        width: 49%;
        margin-right: 0;
    }
    .ly2 .ly2inner {
        display: none;
    }
    .ly2 .webly2inner {
        display: -webkit-box;
        display: flex;
        flex-wrap: wrap;
        -webkit-box-align: center;
        align-items: center;
        padding: 0 10px;
    }
    .ly2 .webly2inner .item {
        width: 100%;
        height: 100%;
        margin-right: 0;
        margin-bottom: 15px;
        display: -webkit-box;
        display: flex;
    }
    .ly2 .webly2inner .list li a {
        width: 80%;
        height: 35px;
        line-height: 35px;
    }
    .ly2 .webly2inner .item .itemlef {
        max-width: 115px;
        width: 20%;
        position: relative;
    }
    .ly2 .webly2inner .item .itemlef img {
        display: block;
        width: 100%;
    }
    .ly2 .webly2inner .item .itemlef .text {
        width: 100%;
        text-align: center;
        position: absolute;
        text-align: center;
        top: 25%;
        font-size: 16px;
        color: #fff;
    }
    .ly2 .webly2inner .item .itemrig {
        -webkit-box-flex: 1;
        flex: 1;
        display: -webkit-box;
        display: flex;
        -webkit-box-align: center;
        align-items: center;
        padding-left: 10px;
        padding-right: 10px;
        float: none;
        -webkit-transition: all 0.2s ease-in-out;
        transition: all 0.2s ease-in-out;
        background: url(yellowrigbg.png) 0 0 no-repeat;
        background-size: 100% 100%;
    }
    .ly2 .webly2inner .item .itemrig .shznlist,
    .ly2 .webly2inner .item .itemrig .rwlist,
    .ly2 .webly2inner .item .itemrig .tswhlist,
    .ly2 .webly2inner .item .itemrig .zrjglist {
        display: -webkit-box;
        display: flex;
        flex-wrap: wrap;
        -webkit-box-align: center;
        align-items: center;
        padding-right: 10px;
    }
    .ly2 .webly2inner .item .itemrig .rwlist {
        -webkit-box-pack: justify;
        justify-content: space-between;
    }
    .ly2 .webly2inner .item .itemrig .shznlist .rigitem,
    .ly2 .webly2inner .item .itemrig .rwlist .rigitem {
        width: 33.33%;
        max-width: 120px;
        padding: 5px 3px;
    }
    .ly2 .webly2inner .item .itemrig .tswhlist .rigitem {
        width: 50%;
        max-width: 180px;
        padding: 5px 3px;
    }
    .ly2 .webly2inner .item .itemrig .zrjglist .rigitem {
        width: 100%;
        max-width: 380px;
        padding: 5px 3px;
    }
    .ly2 .webly2inner .item .itemrig .tswhlist .rigitem img,
    .ly2 .webly2inner .item .itemrig .shznlist .rigitem img,
    .ly2 .webly2inner .item .itemrig .zrjglist .rigitem img,
    .ly2 .webly2inner .item .itemrig .rwlist .rigitem img {
        width: 100%;
        margin-bottom: 3px;
        display: block;
    }
    .ly2 .webly2inner .item .itemrig .tswhlist .rigitem p,
    .ly2 .webly2inner .item .itemrig .shznlist .rigitem p,
    .ly2 .webly2inner .item .itemrig .zrjglist .rigitem p,
    .ly2 .webly2inner .item .itemrig .rwlist .rigitem p {
        font-size: 14px;
        text-align: center;
    }
    .ly3 .ly3inner ul {
        width: 100%;
        display: -webkit-box;
        display: flex;
        -webkit-box-pack: justify;
        justify-content: space-between;
        flex-wrap: wrap;
        -webkit-box-align: center;
        align-items: center;
        padding: 0 10px;
    }
    .ly3 .ly3inner ul li {
        width: 49%;
        height: auto;
        margin-right: 0;
        margin-bottom: 10px;
    }
    .ly3 .ly3inner li a p {
        height: 30px;
        line-height: 30px;
        font-size: 14px;
    }
    .ly4 .ly4inner {
        height: auto;
        display: -webkit-box;
        display: flex;
        -webkit-box-pack: justify;
        justify-content: space-between;
        -webkit-box-align: center;
        align-items: center;
        flex-wrap: wrap;
        padding: 0 5px;
    }
    .ly4 .ly4inner .item {
        position: relative;
        overflow: hidden;
        width: 50%;
        height: auto;
        margin-bottom: 20px;
        padding: 0 5px;
    }
    .ly4 .ly4inner .item .hover {
        display: none;
    }
    .ly4 .ly4inner .item a .txt {
        width: 70%;
        top: 50%;
        height: 20px;
        line-height: 20px;
        border-radius: 20px;
    }
    .ly4 .ly4inner .item a .txt p {
        font-size: 12px;
    }
    .ly4 .ly4inner .item1 {
        left: 0;
        top: 0;
    }
    .ly4 .ly4inner .item2 {
        left: 0;
        top: 0;
        margin-left: 0;
    }
    .ly4 .ly4inner .item3 {
        right: 0;
        top: 0;
    }
    .ly4 .ly4inner .item4 {
        left: 0;
        top: 0;
    }
    .ly4 .ly4inner .item5 {
        right: 0px;
        top: 0px;
    }
    .ly4 .ly4inner .item6 {
        left: 0;
        top: 0px;
    }
    .ly4 .ly4inner .item7 {
        left: 0;
        top: 0;
        margin-left: 0;
    }
    .ly4 .ly4inner .item8 {
        left: 0;
        top: 0;
    }
    .ly5 .ly5inner ul,
    .ly6 .ly6inner ul {
        width: 100%;
        height: auto;
        padding: 0 10px;
        display: -webkit-box;
        display: flex;
        -webkit-box-pack: justify;
        justify-content: space-between;
        -webkit-box-align: center;
        align-items: center;
        flex-wrap: wrap;
    }
    .ly5 .ly5inner ul li {
        width: 48%;
        margin-right: 0;
        margin-bottom: 10px;
    }
    .ly5 .ly5inner ul li a,
    .ly6 .ly6inner ul li a {
        display: block;
        width: 100%;
        height: auto;
    }
    .ly5 .ly5inner ul li a .prodimg,
    .ly6 .ly6inner ul li a .prodimg {
        width: 100%;
        height: 100%;
    }
    .ly5 .ly5inner ul li a p,
    .ly6 .ly6inner ul li a p {
        font-size: 14px;
    }
    .ly6 .ly6inner ul li {
        width: 49%;
        height: auto;
        margin-right: 0;
        margin-bottom: 10px;
    }
    .webfoot {
        padding-top: 20px;
    }
}