* {
    box-sizing: border-box;
}

.cdetailcen {
    background-color: #F8F9F9;
}

.cdetailbanner {
    width: 100%;
    height: 100vh;
    position: relative;
}

.cdetailbanner>img {
    width: 100%;
    height: 100%;
    object-fit: cover;
    position: relative;
    z-index: 0;
}

.cdetailbanner .tit {
    position: absolute;
    /* top: 44%; */
    top: 42%;
    left: 14%;
    z-index: 10;
    display: flex;
    align-items: center;
    font-size: .48rem;
    font-weight: 400;
    line-height: .56rem;
    text-align: left;
    color: #FFFFFF;
}

.cdetailbanner .tit a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: .64rem;
    height: .64rem;
    border-radius: 50%;
    border: .01rem solid rgba(255, 255, 255, 0.2);
    margin-left: .25rem;
    transition: all ease 1s;
}

.cdetailbanner .tit a img {
    width: .28rem;
    height: .28rem;
}

.cdetailbanner .tit a:hover {
    background-color: #E0111B;
}

.cdetailbanner .operation {
    display: flex;
    align-items: center;
    position: absolute;
    z-index: 10;
    left: 14%;
    bottom: 8%;
}

.cdetailbanner .operation a {
    border: .01rem solid rgba(255, 255, 255, 0.2);
    border-radius: .5rem;
    display: flex;
    align-items: center;

    justify-content: center;
    width: 1.2rem;
    height: .42rem;
    overflow: hidden;
    position: relative;
    margin-right: .19rem;
}

.cdetailbanner .operation span {
    font-size: .18rem;
    font-weight: 300;
    line-height: .21rem;
    text-align: center;
    color: #FFFFFF;
}

.cdetailbanner .operation img {
    width: .2rem;
    height: .2rem;
    margin-left: .14rem;
}

.cdetailbanner .operation a::before {
    content: "";
    width: 100%;
    height: 100%;
    background-color: #E0111B;
    position: absolute;
    left: -100%;
    top: 0;
    transition: all ease 1s;
    z-index: -1;
}

.cdetailbanner .operation a:hover::before {
    left: 0;
}

.cdetailbox {
    width: 14rem;

    margin: 0 auto;
    overflow: hidden;
}

.cdetailtop {
    width: 100%;
    padding: 1.06rem 0 .94rem;
    padding: .83rem 0 .94rem;
    display: flex;
    /* height: 4.28rem; */
}

.cdetailtopr {
    width: 23%;
    height: 100%;
    border-left: .01rem solid #D9D9D9;
    padding-left: 1.09rem;
    padding-bottom: 0.3rem;
}

.cdetailtopl {
    flex: 1;
    height: 100%;
    position: relative;
    padding-bottom: .7rem;
}

.butn {
    position: absolute;
    /* right: .72rem; */
    right: 1rem;
    bottom: 0;
    display: flex;
    align-items: center;
}

.butn .links {
    width: .48rem;
    height: .48rem;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
    border: .01rem solid #CECECE;
}

.butn a {
    transition: all ease 1s;
}

.butn .links img {
    width: .28rem;
    height: .28rem;
}

.butn .links svg {
    width: .28rem;
    height: .28rem;
    fill: #666;
}

.butn .links:hover {
    background-color: #E0111B;
}

.butn .links:hover svg {
    fill: #fff;
}

.butn .baojia {
    width: 1.52rem;
    height: .42rem;
    display: flex;
    justify-content: center;
    align-items: center;
    font-size: .18rem;
    font-weight: 400;
    line-height: .21rem;
    text-align: center;
    color: #666666;
    margin-left: .25rem;
    border: .01rem solid #CECECE;
    border-radius: .5rem;
    position: relative;
    overflow: hidden;
}

.butn .baojia::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    left: -100%;
    position: absolute;
    top: 0;
    z-index: 1;
    transition: all ease 1s;
    background-color: #E0111B;
}

.butn .baojia:hover::after {
    left: 0;
}

.butn .baojia span {
    position: relative;
    z-index: 10;
}

.butn .baojia img {
    width: .2rem;
    position: relative;
    z-index: 10;
    height: .2rem;
    margin-left: .09rem;
}

.butn .baojia:hover {
    color: #fff;
}

.butn .baojia svg {
    width: .2rem;
    position: relative;
    z-index: 10;
    height: .2rem;
    margin-left: .09rem;
    fill: #666;
}

.butn .baojia:hover svg {
    fill: #fff;
}

.cdetailtopl .tit {
    font-size: .42rem;
    font-weight: 400;
    line-height: .58rem;
    text-align: left;
    color: #333333;
    margin-bottom: .26rem;
    width: 10.13rem;
    font-weight: 700;
}

.cdetailtopl .cen {
    font-size: .18rem;
    font-weight: 300;
    line-height: .38rem;
    text-align: left;
    color: #666666;
    width: 10.13rem;

    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-box-orient: vertical;
    -webkit-line-clamp: 2;
}

.cdetailtopr .tit {
    font-size: .24rem;
    font-weight: 400;
    line-height: .28rem;
    text-align: left;
    color: #333333;
    margin-bottom: .18rem;
    font-weight: 700;
}

.cdetailtopr .cen {

    font-size: .18rem;
    font-weight: 300;
    line-height: .38rem;
    text-align: left;
    color: #666666;
}

.cdetailtopr p {
    font-size: .18rem;
    font-weight: 300;
    line-height: .38rem;
    text-align: left;
    color: #666666;
}

.cdetailtopr p:first-of-type {
    font-size: .24rem;
    font-weight: 400;
    line-height: .28rem;
    text-align: left;
    color: #333333;
    margin-bottom: .18rem;
}

.cdetailtopr .active {
    color: #E0111B;
}

.Cdtit {
    font-family: rr;
    font-size: .42rem;
    font-weight: 400;
    line-height: .49rem;
    text-align: center;
    color: #333333;
}

.Cmdtit {
    font-size: .2rem;
    font-weight: 700;
    line-height: .23rem;
    text-align: center;
    color: #333333;
    margin-bottom: .3rem;
}

.pcshow {
    height: auto;
    padding: .86rem 0 1.01rem;
    background-color: #FFFFFF;
    border-top-left-radius: .15rem;
    border-top-right-radius: .15rem;
}

.pcvideo {
    width: 8.98rem;
    height: 8.1rem;
    background-image: url(/images/pcshows.png);
    background-position: center;
    background-repeat: no-repeat;
    background-size: contain;
    margin: .61rem auto 0;
    /* padding: .22rem .22rem 0; */
    padding: .2rem .22rem 0;
}
.pcvideobox{
    width: 8.58rem;
    height: 4.85rem;
    background-repeat: no-repeat;
    background-position: 0 0;
}
.pcvideo p {
    width: 100%;
    height: 4.88rem;
    /* background: skyblue; */
}

.pcvideobox video {
    width: 100%;
    height: 100%;
    object-fit: cover;
}

.pcvideo p img {
    width: 100%;
    height: 100%;
}

.themecolor {
    width: 100%;
    height: 6rem;
    padding: 1.1rem 0 1.22rem;
    background-color: #F1F1F1;
}

.themecolorcen {
    width: 100%;
    height: 3rem;
    margin-top: .18rem;
}

.themecolorcen img {
    width: 100%;
    height: 100%;
    width: auto;
    margin: 0 auto;
    display: block;
}

.mobileshow {
    width: 100%;
    height: auto;
    background-color: #FFFFFF;
    padding: 1.16rem 0 .47rem;

}

.mobileshowcen {
    /* width: 7.35rem;
height: 6.01rem; */

    margin: .59rem auto 0;
}

.mobileshowcen img {
    /* width: 100%;
    height: 100%; */
    display: block;
    margin: auto;
}

.imgshow {
    width: 100%;
    height: auto;
    background: #FFFFFF;
    padding-top: .48rem;
}

.imgshowcen {
    width: 85%;
    padding-bottom: .45rem;
    margin: 0 auto;
}

.imgshowcen img {
    width: 100%;
    height: auto;
    margin-bottom: .55rem;
}

.cdetaiend {
    width: 100%;
    padding: .94rem 0 1rem;
    display: flex;
    flex-direction: column;
    align-items: center;
}

.cdetaiend h5 {
    font-size: .2rem;
    font-weight: 300;
    line-height: .23rem;
    text-align: center;
    color: #000000;
}

.cdetaiend h6 {
    font-size: .38rem;
    font-weight: 400;
    line-height: .45rem;
    text-align: center;
    color: #000000;
    margin: .32rem 0 .39rem;
}

.cdetaiend img {
    width: 2.54rem;
    height: auto;
}

.cdetaiend .line {
    width: 5.32rem;
    height: .01rem;
    margin-top: .72rem;
    background: #D4D4D4;
}

.cdetaiend .operation {
    display: flex;
    align-items: center;

    z-index: 10;
    margin-top: .44rem;
}

.cdetaiend .operation a {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 1.52rem;
    border-radius: .5rem;
    border: .01rem solid #CECECE;
    height: .42rem;
    margin: 0 .18rem;
    font-size: .18rem;
    font-weight: 400;
    line-height: .21rem;
    text-align: center;
    color: #666666;
    position: relative;
    overflow: hidden;
}

.cdetaiend .operation a::after {
    content: "";
    display: flex;
    width: 100%;
    height: 100%;
    position: absolute;
    left: -100%;
    top: 0;
    z-index: 1;
    background: #E0111B;
    transition: all ease 1s;

}

.cdetaiend .operation a:hover {
    color: #FFFFFF;
}

.cdetaiend .operation a:hover::after {
    left: 0;
}

.cdetaiend .operation span {
    z-index: 10;
    position: relative;
}

.cdetaiend .operation img {
    width: .28rem;
    height: .28rem;
    margin-right: .06rem;
    z-index: 10;
    position: relative;
    transition: all ease 1s;
}

.cdetaiend .operation a img:nth-of-type(2) {
    display: none;
}

.cdetaiend .operation a:hover img:nth-of-type(1) {
    display: none;
}

.cdetaiend .operation a:hover img:nth-of-type(2) {
    display: block;
}


.cdetail2top {
    padding-top: .78rem;

}

.cdetail2top .lbmc {
    width: auto;
    height: .42rem;
    display: inline-block;
    justify-content: center;
    align-items: center;
    border-radius: .5rem;
    border: .01rem solid rgba(201, 201, 201, .5);
    font-size: .18rem;
    font-weight: 300;
    line-height: .42rem;
    text-align: center;
    padding: 0 .3rem;
    color: rgba(102, 102, 102, 1);
    overflow: hidden;
    position: relative;
}

.cdetail2top .lbmc span {
    position: relative;
    z-index: 10;
}

.cdetail2top .lbmc::after {
    content: "";
    display: block;
    width: 100%;
    height: 100%;
    background: #E0111B;
    position: absolute;
    left: -100%;
    top: 0;
    z-index: 1;
    transition: all ease 1s;
}

.cdetail2top .lbmc:hover::after {
    left: 0;
}

.cdetail2top .lbmc:hover span {
    color: #FFFFFF;
}

.cdetail2topnav {
    margin-top: .65rem;
    margin-bottom: .44rem;
    display: flex;
    justify-content: space-between;
}

.cdetail2topnav .tit {

    display: flex;
    align-items: center;
    font-size: .48rem;
    font-weight: 400;
    line-height: 1.4;
    text-align: left;
    color: #333333;
}

.cdetail2topnav .tit a {
    display: flex;
    justify-content: center;
    align-items: center;
    width: .64rem;
    height: .64rem;
    border-radius: 50%;
    border: .01rem solid #E0111B;
    margin-left: .25rem;

    transition: all ease 1s;
    flex-shrink: 0;
}

.cdetail2topnav .tit a img {
    width: .28rem;
    height: .28rem;
}

.cdetail2topnav .tit a img:first-of-type {
    display: block;
}

.cdetail2topnav .tit a img:last-of-type {
    display: none;
}

.cdetail2topnav .tit a:hover img:first-of-type {
    display: none;
}

.cdetail2topnav .tit a:hover img:last-of-type {
    display: block;
}

.cdetail2topnav .tit a:hover {
    background-color: #E0111B;
}

.cdetail2top .operation {
    display: flex;
    align-items: center;

}

.cdetail2top .operation a {
    border: .01rem solid #E0111B;
    border-radius: .5rem;
    display: flex;
    align-items: center;

    justify-content: center;
    width: 1.2rem;
    height: .42rem;
    overflow: hidden;
    position: relative;
    margin-right: .19rem;
}

.cdetail2top .operation a::after {
    content: "";
    display: flex;
    width: 100%;
    height: 100%;
    position: absolute;
    left: -100%;
    top: 0;
    background: #E0111B;
    transition: all ease 1s;
    z-index: 1;

}

.cdetail2top .operation a:hover::after {
    left: 0;
}

.cdetail2top .operation span {
    font-size: .18rem;
    font-weight: 300;
    line-height: .21rem;
    text-align: center;
    color: #E0111B;
    transition: all ease 1s;
    position: relative;
    z-index: 10;
}

.cdetail2top .operation img {
    width: .2rem;
    height: .2rem;
    margin-left: .14rem;
    position: relative;
    z-index: 10;
    transition: all ease 1s;
}

.cdetail2top .operation a:hover span {
    color: #FFFFFF;
}

.cdetail2top .operation a img:first-of-type {
    display: block;
}

.cdetail2top .operation a img:last-of-type {
    display: none;
}

.cdetail2top .operation a:hover img:first-of-type {
    display: none;
}

.cdetail2top .operation a:hover img:last-of-type {
    display: block;
}

.cdetail2bner {
    width: 100%;
    height: 5.91rem;
    border-radius: .15rem;
    overflow: hidden;
}

.cdetail2bner img {
    width: 100%;
    height: auto;
    object-fit: cover;
}

/* 瀑布图片 */
.nyshow {
    width: 100%;
    height: auto;
}

.nyshow img {
    width: 48%;
    height: auto;
    margin-bottom: .23rem;
    transition: all ease 1s;
}

.cdetail2top .operation.pcoperation {
    display: flex;
}

.cdetail2top .operation.mboperation {
    display: none;
}

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

    .cdetail2top .operation.pcoperation {
        display: none;
    }

    .cdetail2top .operation.mboperation {
        display: flex;
        margin-top: .45rem;
    }

    .cdetail2top .operation img {
        width: .24rem;
        height: .24rem;
    }

    .cdetail2top .operation span {
        font-size: .24rem;
    }

    .cdetail2top .lbmc {
        height: .58rem;
        padding: 0 .44rem;
        font-size: .24rem;
        line-height: .58rem;
    }

    .cdetail2top .operation a {
        width: 1.72rem;
        height: .58rem;
    }

    .butn .links {
        height: .64rem;
        width: .64rem;
    }

    .butn .baojia {
        width: 2rem;
        height: .58rem;
        font-size: .24rem;
    }

    .butn .baojia svg {
        width: .24rem;
        height: .24rem;
    }

    .cdetailtopr {
        display: none;
    }

    .Cmdtit {
        font-size: .36rem;
        font-weight: 700;
        line-height: 1.2;
        margin-bottom: .44rem;
    }

    .mobileshowcen {
        padding: 0 .35rem;
    }

    .cdetaiend {
        padding: 1.04rem 0 1rem;
    }

    .cdetaiend h5 {
        font-size: .24rem;
        font-weight: 300;
        line-height: .2813rem;
    }

    .cdetaiend h6 {
        font-size: .42rem;
        font-weight: 400;
        line-height: .4922rem;
        margin: .32rem 0 .4rem;
    }
    .cdetaiend img {
        width: 2.79rem;
    }

    .cdetaiend .line {
        width: 6rem;
        margin-top: .63rem;
    }

    .cdetaiend .operation {
        margin-top: .45rem;
    }

    .cdetaiend .operation a {
        width: 2.4rem;
        height: .64rem;
        margin: 0 .44rem;
        font-size: .24rem;
    }

    .cdetaiend .operation a img {
        width: .36rem;
        height: .36rem;
        margin-right: .12rem;
    }



    .cdetail2bner {
        height: auto;
    }

    .cdetail2top {
        padding-top: .74rem;
        width: 6.8rem;
        margin: 0 auto;
    }

    .cdetail2topnav {
        margin-top: .39rem;
    }

    /* 案例详情 */
    .cdetailbox {
        width: 100%;
    }

    .cdetailtop {
        width: 100%;
        height: auto;
        flex-direction: column;
        margin: 0 auto;
        padding: .6rem 0 0;
    }

    .cdetailtopl {
        width: 6.8rem;
        margin: 0 auto;
    }

    .cdetailtopl .tit {
        width: auto;
    }

    .butn {
        position: relative;
        right: 0;
        margin-bottom: .26rem;
    }

    .cdetailtopl .cen {
        width: auto;
        margin-bottom: .39rem;
        font-size: .24rem;
        line-height: 2;
    }

    .cdetailtopr {
        width: 100%;
        padding: 0.56rem 0.35rem 0;
        background: #FFFFFF;
    }

    .cdetailtopr .tit {
        background: url(/images/pc/title_xian.jpg) no-repeat left bottom;
        font-size: 0.26rem;
        color: #333333;
        margin-bottom: 0.15rem;
        line-height: 0.48rem;
    }

    .cdetailtopr .cen {
        font-size: 0.24rem;
        color: #666666;
        line-height: 0.48rem;
        padding-left: 0.3773rem;
    }

    .pcvideo {
        width: 100%;
        height: 6.2rem;
        padding: .16rem .48rem 0;
    }
    .pcvideo p{
        height: 3.68rem;
    }
    .pcvideobox {
        width: 100%;
        height: 3.78rem;
    }

    .pcshow {
        height: auto;
    }

    .themecolorcen {
        height: 2rem;
    }

    .themecolorcen img {
        width: 100%;
        height: 100%;
        object-fit: cover;

        width: 130%;
        max-width: max-content;
        position: relative;
        left: -15%;
    }


    .themecolor {
        height: auto;
    }
}