/*  页面css */

/*通用样式*/
.n-page-info{
    margin-top:24px;
    text-align: center;
}
.n-page-info H1{
    padding-top: 48px;
    font-size: 48px;
    line-height: 56px;
}
.n-page-info h5{
    margin-top: 20px;
    line-height: 150%;
    font-size: 24px;
    font-weight: normal;
}

.n-page-info .title-black H1{
    color: #4A494D;
}
.n-page-info .title-black  h5{
    color: #4A494D;
}

.n-tab{
    margin-top: 27px;
    height:41px;
}
.n-tab div {
    height: 41.5px;
    font-size: 16px;
    padding: 0 20px;
    display: inline-block;
    margin-left: -3.8px;
    line-height: 41.5px;
    border-bottom: 1px solid #c3c9d5;
    cursor: pointer;
    z-index: 20;
}
.n-tab-selected {
    color: #01a0e8!important;
    border-bottom: #01a0e8 3px solid!important;
    height: 40px !important;
    font-weight: bold;
}
.n-page-title{
    position: absolute;
    z-index: 10;
}

/*第一屏*/
.n-page1{
    background-image: url('../images/page1-bg.png');
    color:#F7F8FB;
    height: 782px;
    margin-top: 80px;
}
.n-page1-img{
    width: 178px;
    margin-top: 77px;
}
.n-page1-icons{
    background: linear-gradient(269.97deg, #C89B7C -0.83%, #70473C 99.97%);
    height:118px;
    padding-top: 10px;
    box-sizing: border-box;
    display: flex;
    justify-content: space-evenly;
    position: relative;
    top: 0;
}
.n-page1-icon{
    width: 310px;
    color: #fff;
}
.n-page1-icon-img{
    width: 48px;
    height: 48px;
    display: block;
    margin: 10px auto;
}
.n-page1-icon div{
    line-height: 150%;
    text-align: center;
    font-size: 18px;
}
.n-line{
    width:1px;
    background-color:rgb(247,248,251,0.3);
    height:50px;
    margin-top:30px
}

/*第二屏*/
.n-page2{
    color: #385075;
    display: flex;
    flex-direction: column;
    align-items: center;
    background: #d8d8d8;
    position: relative;
    padding-top: 0;
}
.n-page2 .title-black{
    width: 90%;
    position: absolute;
    left: 5%;
    z-index: 3;
    text-align: center;
    top: 0;
}
.n-page2-content{
    width: 100%;
    position: relative;
}

.n-page2-content img,
.n-page2-content video{
    width: 100%;
}

/*第三屏*/
.n-page3{
    color: #F7F8FB;
    display: flex;
    flex-direction: column;
    align-items: center;
    background: #E5D9C9;
    position: relative;
    padding-top: 0px;
}
.n-page3 .title-black{
    width: 90%;
    position: absolute;
    left: 5%;
    z-index: 3;
    text-align: center;
    top: 0;
}

/*第四屏*/
.n-page4{
    position: relative;
    background: #d4c6b9;
}
.n-page4 .title-black{
    width: 40%;
    position: absolute;
    left: 3%;
    z-index: 3;
    text-align: left;
    top: 13%;
}

/*第五屏*/
.n-page5{
    background: url('../images/page5-bg.png') no-repeat center top;
    color:#F7F8FB;
    margin-bottom: 50px;
    clear: both;
    overflow: hidden;
    padding-top: 160px;
    height: 900px;
    box-sizing: border-box;
}
.n-page5 .n-page5-content{
    width: 44%;
    float: right;
    text-align: left;
    padding-right: 4%;
}
.n-page5-content .title-black span{
    color: #00dca5;
    font-weight: bold;
}
.n-page5 .icon-list{
    display: flex;
    text-align: center;
    margin: 35px 0;
}
.n-page5 .icon-list .icon-item{
    color: #4A494D;
    font-weight: bold;
    font-size: 18px;
}
.n-page5 .icon-list .icon-item:nth-child(2){
    margin: 0 40px;
}
.n-page5 .icon-list .icon-item img{
    margin-bottom: 15px;
}
.n-page5 .img-list{
    display: flex;
    align-items: center;
}
.n-page5 .img-list img{
    margin-right: 20px;
}


/*参数对比*/
.n-params-compare{
    display: flex;
}
.compare-content{
    padding: 0 20px;
}
.n-params-compare .bodyDiv{
    height:60px;
    border-bottom: 1px #D5D5D5 solid;
    display: flex;
    align-content: center;
    justify-content: center;
    align-items: center;
}
.n-params-compare .bodyDiv:last-child{
    border-bottom: none;
}
.n-head-type{
    height:200px;
    border-bottom: 1px #D5D5D5 solid;
    font-size:14px;
    font-weight: bold;
}
.n-params-name-col{
    width: 270px;
    font-size:14px;
    font-weight: bold;
}
.n-params-name-col .bodyDiv{
    padding: 0 10px;
}
.n-compare-product{
    width: 240px
}
.n-compare-product .n-compare-product{
    width: 240px
}
#params-swiper{
    width:1040px
}
.params-swiper-button-prev,.params-swiper-button-next{
    top:80px!important
}

.detail-compare {
    text-align: center;
}
.compareTable{
    display: none;
}
.compare-title{
    text-align: center;
}
.compare-title h2 {
    color: #385075;
    line-height: 36px;
    margin-bottom: 25px;

}
.compare-title p{
    color: #292929;
    font-size: 14px;
    margin: 20px 10%;

}

.compare-content table {
    width: 100%;
    text-align: center;
}

.compare-content table thead tr {
    position: sticky;
    top: 126px;
    background: #FFFFFF;
}

.compare-content table th {
    border-bottom: 1px #D5D5D5 solid!important;
    /* padding-bottom: 48px; */
    font-size: 14px;
    font-weight: bold;
    color: #292929;
}

.compare-content table tr td:first-child {
    font-weight: bold;
}

.compare-content table td {
    border-bottom: 1px #D5D5D5 solid!important;
    height: 60px;
    color: #292929;
    font-size: 14px;
}

.selected-product {
    background-color: #F7F9FA;
}

.selected-line {
    background-color: #DA0030;
    height: 4px;
    width: 40%;
    margin-left: 30%;
    margin-top: 10px;
    margin-bottom: 20px;
}

.unselected-line {
    height: 4px;
    width: 40%;
    margin-left: 30%;
    margin-top: 10px;
    margin-bottom: 20px;
}

.dataTables_wrapper.no-footer .dataTables_scrollBody {
    border-bottom: 0px !important;
}

/*应用搭配*/
.n-match-desc{
    width:74px;
    text-align: center;
    font-size: 12px;
    line-height:24px;
    margin-top: 10px;
}
.n-match-desc-red{
    border-bottom: 3px solid #DA0030;
}
.n-match-desc-blue{
    border-bottom: 3px solid #BBD3E9;
}
.n-product{
    display: flex;
    align-items: center;
    height:328px;
    margin-top: -20px;
    margin-left: 30px;
}
.n-product-second{
    margin-left:-24px
}
.n-product-link-first{
    position: relative;
    z-index: 10;
    right: 78px;
    top: 10px;
}
.n-product-link-second{
    position: relative;
    z-index: 10;
    right: 38px;
}
.n-red-line{
    height:2px;
    background-color: #DA0030;
    width:83px;
    margin-left: -45px;
    z-index: -100;
}
.n-product-third{
    margin-left: 15px;
    margin-top: 30px;
}
.n-third-top-transform{
    transform: rotate(-25.51deg);
    -ms-transform: rotate(-25.51deg);
    -moz-transform: rotate(-25.51deg);
    -webkit-transform: rotate(-25.51deg);
    -o-transform: rotate(--25.51deg);
    position: relative;
    bottom: 40px;

}
.n-third-top-border{
    width:75px;
    height:2px;
    background-color: #BBD3E9;
    margin: -8px 0px 0px 38px;
}
.n-third-top-transform-subImg{
    margin: -25px 0px 0px 113px;
    transform: rotate(178deg);
    -ms-transform: rotate(178deg);
    -moz-transform: rotate(178deg);
    -webkit-transform: rotate(178deg);
    -o-transform: rotate(-178deg);
}

.n-third-bottom-transform{
    transform: rotate(-152.61deg);
    -ms-transform: rotate(-152.61deg);
    -moz-transform: rotate(-152.61deg);
    -webkit-transform: rotate(-152.61deg);
    -o-transform: rotate(-152.61deg);
    position: relative;
    top: 40px;
}
.n-product-link-third{
    position: relative;
    z-index: 10;
    right: 78px;
}
.n-product-link-img{
    margin-top: 15px;
}
.n-product-link-tag{
    position: absolute;
    margin-top: 5px;
    margin-left: -34px;
}
.n-product-4-top{
    margin-bottom: 170px;
    margin-left: 8px;
}
.n-product-4-bottom{
    margin-left: 8px;
}
.n-product-4-top-border{
    width:75px;
    height:2px;
    background-color: #BBD3E9;
    margin: -10px 0px 0px 130px;
}
.n-product-link-tag-4{
    position: absolute;
    margin-top: -5px;
    margin-left: -75px;
}
.n-product-5{
    margin-bottom: 90px;
    margin-left:10px
}
.n-product-5-bottom{
    margin-left:10px
}
.n-product-5-img{
    margin-left:35px
}
.n-product-link-tag-5{
    position: absolute;
    margin-top: 34px;
    margin-left: -54px;
}
.n-product-name{
    font-size: 12px;
    color: #7D7D7D;
}
.n-product-name-1{
    width: 120px;
    text-align: center;
    margin-top: 10px;
}
.n-product-name-2{
    margin-top: -14px;
}
.n-product-name-3{
    margin-top: 10px;
    margin-left: -10px;
}
.n-product-name-4{
    position: absolute;
    top: -30px;
    transform: rotate(25deg);
    -ms-transform: rotate(25deg);
    -moz-transform: rotate(25deg);
    -webkit-transform: rotate(25deg);
    -o-transform: rotate(25deg);
    left: -30px;
}
.n-product-name-5{
    margin-top: 15px;
    position: absolute;
}
.n-product-name-6{
    margin-left: -5px;
    position: absolute;
}
.n-product-750{
    display: none;
}
#tab2title{
    display:none
}
#page2-img{
    display: none;
}
#page2-img-2{
    display: none;
}
/*白色背景modal，全屏*/
.white-modal{
    position: fixed;
    top: 0;
    left: 0;
    background-color: #FFFFFF;
    width: 100vw;
    height:100vh;
    z-index: 999999;
    display: none;
}
.n-show-big{
    position: relative;
    top: 85%;
    left: 85%;
    cursor: pointer;
    height:30px;
    width:30px
}
.n-close-modal{
    position: fixed;
    right: 20px;
    top: 20px;
    cursor: pointer;
    z-index: 9999999;
}
.n-modal-content{
    width: 100vw;
    height: 100vh;
    display: flex;
    align-content: center;
    justify-content: center;
    align-items: center;
}
.show-pc{
    display: block;
}
.show-mobile{
    display: none;
}
@media screen and (max-width:750px) {
    .show-pc{
        display: none;
    }
    .show-mobile{
        display: block;
    }

    /*参数对比*/
    .n-show-big{
        display: none;
    }
    .n-params-compare{
        display: none;
    }
    .compare-title h1 {
        font-size: 0.44rem;
        line-height: 0.533rem;
        height: 100%;
        width: 100%;
    }
    .compareTable{
        display: block;
    }
    .compare-content table thead tr {
        position: static;
        top: 128px;
        z-index: 99;
        background: rgba(255, 255, 255, 0);
    }
    .compare-content table th img {
        width: 76px!important;
        height: 46px!important;
        /* margin-bottom: 10px!important; */
    }
    .selected-line {
        margin-bottom: 0.26rem;
    }
    .unselected-line {
        margin-bottom: 0.26rem;
    }
    .compare-content table th {
        font-size: 0.32rem;
    }
    .compare-content table td {
        font-size: 0.32rem;
        height: 0.8rem;
    }
    /*参数对比结束*/
    .n-page-info h1{
        font-size: 0.5rem;
        line-height: 110%;
    }
    .n-xieyi{
        flex-wrap: wrap;
    }
    .n-item{
        width: 49.5%;
        border-right:0px
    }
    .n-page-info h5{
        font-size:0.38rem;
        width: 90%;
        margin-left: 5%;
    }
    .n-page-info H1{
        padding-top:0.66rem;
    }
    .n-page-info{
        margin-top: 10px;
    }
    .n-page2 .title-black{
        position: relative;
        left: 0;
    }
    .n-page1{
        background-image: url('../images/page1-bg_750.png');
        background-size: 100%;
        height: auto;
    }
    .n-page1-img{
        margin-top:0.89rem;
        width: 100px;
        margin-bottom: 4.4rem;
    }
    .n-page1-icons{
        height: 98px;
        padding-top: 0;
    }
    .n-page1-icon{
        width:33.3%;
        padding: 0 2%;
        box-sizing: border-box;
    }
    .n-page1-icon-img{
        width: 24px;
        height: 24px;
    }
    .n-page1-icon div{
        font-size: 0.32rem;
    }
    .n-page1-icon h6,h4{
        font-size: 0.21rem;
    }
    .n-line{
        margin-top:20px;
    }
    .n-page2{
        background: #d8d8d8;
        /*background: #d8d8d8 url('../images/page2-bg_750.png') no-repeat center bottom;
        background-size: 100%;*/
        height: auto;
        padding-top: 0;
        padding-bottom: 0;
    }
    .n-page2 .n-page2-content{
        position: relative;
        top: -30px;
    }
    .n-page2 .n-page-title{
        width:90%
    }
    .n-page2 h5{
        width:100%;
        margin-left:0px
    }
    .n-page2 h1{
        width:90%;
        margin-left:5%;
    }

    .n-page3{
        background: #E5D9C9;
        /*background: #E5D9C9 url('../images/page3-bg_750.png') no-repeat center bottom;*/
        background-size: 100%;
        height: auto;
        padding-bottom: 30px;
        padding-top: 0;
    }
    .n-page3 .title-black{
        top: 0;
        position: relative;
        left: 0;
    }
    .n-page3 .n-page2-content{
        margin-top: 20px;
    }
    .n-page4{
        background-image: linear-gradient(-66deg, #d0b6a4, #d5c6ba);
        /*background: #d4c6b9 url('../images/page4-bg_750.png') no-repeat center bottom;*/
        background-size: 100%;
        height: auto;
        padding-top: 0;
        padding-bottom: 0;
    }
    .n-page4 .title-black{
        top: 0;
        width: 90%;
        left: 5%;
        position: relative;
        text-align: center;
    }
    .n-page-info.n-page4 .title-black h5{
        margin-top: 10px;
        line-height: 120%;
    }
    .n-page5{
        background: #ced9df url('../images/page5-bg_750.png') no-repeat center bottom;
        background-size: 100%;
        height: auto;
        padding-top: 0;
        padding-bottom: 360px;
    }
    .n-page5 .n-page5-content{
        width: 90%;
        float: none;
        margin: 0 auto;
        padding: 0;
    }
    .n-page5 .icon-list{
        margin: 20px 0;
    }

    .n-page5 .n-page5-content h5{
        width: 100%;
        margin-left: 0;
        margin-top: 10px;
    }
    .n-page5 .icon-list .icon-item img{
        width: 20px;
        height: 20px;
        margin-bottom: 8px;
    }
    .n-page5 .icon-list .icon-item{
        font-size: 0.32rem;
    }
    .n-page5 .img-list img {
        height: 60px;
    }

}
.com-product-QA-main table td{
    padding: 14px 8px !important;
    line-height:30px !important;
}
.com-product-QA-main p{
    line-height:30px !important;
}