/*banner*/

.n-banner {
    width: 100%;
    position: relative;
}

.n-banner-img {
    width: 100%;
}

.n-banner-content {
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    margin-left: calc((100% - 1440px) / 2);
}

.n-nav ul li:hover {
    cursor: pointer;
}

.n-banner-title {
    font-weight: 700;
    font-size: 48px;
    color: #292929;
    margin-top: 23px;
    margin-bottom: 12px;
}

.n-banner-content h2 {
    font-size: 36px;
    color: #292929;
    margin-bottom: 24px;
}

.n-banner-subtitle {
    font-weight: 290;
    font-size: 16px;
    line-height: 150%;
    color: #292929;
    width: 600px;
}

.n-banner-btn-list {
    margin-top: 32px;
    display: flex;
    font-size: 18px;
    line-height: 40px;
}

.n-banner-btn {
    width: 175px;
    height: 40px;
    text-align: center;
    background: #FFFFFF;
    backdrop-filter: blur(5px);
    border-radius: 4px;
    color: #DA0030;
}

.n-btn-1 {
    background: linear-gradient(175.62deg, #FF4040 2.49%, #DA0030 134.78%);
    color: #FFFFFF;
}

.n-btn-2 {
    margin: 0px 16px
}


/* 导航栏 */

.n-menu {
    position: relative;
    z-index: 3;
    width: 100%;
    height: 60px;
    background: rgba(0, 0, 0, 0.8);
    backdrop-filter: saturate(150%) contrast(80%) blur(10px);
    -webkit-backdrop-filter: blur(30px);
}

.n-nav {
    width: 1440px;
    height: 100%;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    margin: 0 auto;
}

.n-tag ul {
    display: flex;
    flex-direction: row;
}

.n-tag li {
    margin-left: 24px;
    font-size: 14px;
    color: #B5B5B5;
    font-weight: normal;
    cursor: pointer;
    border-bottom: 1px solid transparent;
}

.n-tag li:hover {
    border-bottom: 1px solid #DA0030;
    color: #FFFFFF;
}

.n-tag-selected {
    border-bottom: 1px solid #DA0030!important;
    color: #FFFFFF!important;
    font-weight: bold!important;
}


/* 顶部面包屑 */

.ws-product-detail-bcb {
    width: 294px;
    line-height: 45px;
}

.com-content {
    max-width: 1200px;
    margin: 0 auto;
}

.ws-product-detail-bcb ul {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}

.breadcrumb {
    padding: 8px 15px;
    list-style: none;
    border-radius: 4px;
}

.breadcrumb>li {
    display: inline-block;
}

.ws-product-detail-bcb ul li a {
    font-size: 14px;
    font-family: Microsoft Yahei, Arial, sans-serif;
    color: #B5B5B5;
}

.ws-product-detail-bcb ul li:last-child a,
.ws-product-detail-bcb ul li a:hover {
    color: #FFFFFF;
    text-emphasis: none;
}

.ws-product-detail-bcb .breadcrumb>li+li:before {
    color: #7d7d7d;
    content: ">";
    padding: 0 10px;
}

.ws-product-detail-bcb ul li img {
    width: 16px;
    height: 16px;
    position: relative;
    top: -3px;
    vertical-align: middle;
}

.ws-product-detail-bcb ul {
    white-space: nowrap;
    overflow: hidden;
    text-overflow: ellipsis;
}


/* 面包屑结束 */

.n-title {
    font-weight: 700;
    font-size: 36px;
    line-height: 48px;
    text-align: center;
    color: #292929;
    margin-top: 90px;
}

.n-subtitle {
    font-weight: 400;
    font-size: 16px;
    line-height: 21px;
    text-align: center;
    color: #292929;
    margin-top: 20px;
}


/*page1*/

.n-page1 {
    width: 1440px;
    margin-left: calc((100% - 1440px)/2);
}

.n-page1 .n-tab {
    margin-top: 48px;
}

.n-tab {
    width: 100%;
    border-bottom: 1px solid #D5D5D5;
    display: flex;
    justify-content: center;
    font-size: 18px;
    line-height: 24px;
    color: #292929;
    height: 48px;
}

.n-tab div:hover {
    cursor: pointer;
}

.n-tab div {
    margin-right: 158px;
}

.n-tab div:last-child {
    margin-right: 0;
}

.n-tab-selected {
    color: #0094FF;
    font-weight: 700;
    border-bottom: 2px solid #0094FF;
}

.n-page1 .n-tab-content {
    margin-top: 32px;
}

.n-tab-content img {
    width: 100%;
}

.n-tab-content-desc {
    position: absolute;
    margin: 56px;
    background: rgba(0, 148, 255, 0.8);
    backdrop-filter: blur(6px);
}

.n-tab-content-desc p {
    padding: 36px;
    font-size: 16px;
    line-height: 150%;
    color: #FFFFFF;
}

.n-tab-content-btn {
    margin: 0px 36px 36px 36px;
    line-height: 40px;
    font-size: 18px;
}

.n-tab-content-desc ul {
    padding: 36px;
    font-size: 16px;
    line-height: 150%;
    color: #FFFFFF;
    margin-left: 16px;
}

.n-tab-content-desc ul li {
    list-style-type: disc;
}


/*page2*/

.n-page2 {
    width: 1440px;
    margin-left: calc((100% - 1440px)/2);
}

.n-page2-content {
    margin-top: 24px;
    margin-bottom: 90px;
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
}

.n-page2-card {
    width: 708px;
    border: 1px solid #D5D5D5;
    text-align: center;
    margin-top: 24px;
}

.n-page2-card img {
    width: 100%;
}

.n-page2-card-imgdesc {
    position: absolute;
    margin-top: -50px;
    height: 50px;
    background: rgba(131, 146, 169, 0.5);
    backdrop-filter: blur(10px);
    font-size: 16px;
    line-height: 50px;
    color: #FFFFFF;
    display: flex;
}

.n-page2-card-imgdesc-1 {
    width: 353px;
}

.n-page2-card-imgdesc-2 {
    width: 706px;
}

.n-page2-card-title {
    font-weight: 700;
    font-size: 24px;
    line-height: 32px;
    text-align: center;
    color: #385075;
    margin-top: 24px;
    margin-bottom: 32px;
}

.n-page2-card-subtitle {
    font-size: 20px;
    line-height: 26px;
    text-align: center;
    color: #292929;
    margin-bottom: 12px;
}

.n-page2-card-subtitle span {
    font-weight: 700;
    font-size: 20px;
    line-height: 26px;
    text-align: center;
    color: #DA0030;
}

.n-page2-card-subtitle-1 {
    font-size: 16px;
    line-height: 150%;
    text-align: center;
    color: #292929;
    margin-bottom: 24px;
}


/*page3*/

.n-page3 {
    background-image: url("../RJ-img/3-bg.png");
    background-size: cover;
    background-repeat: no-repeat;
}

.n-page3 .n-title {
    padding-top: 90px;
}

.n-page3-content {
    padding-top: 48px;
}

.n-page3-content-img {
    display: flex;
    width: 1440px;
    margin-left: calc((100% - 1440px)/2);
    justify-content: space-between;
}

.n-page3-content-img img:nth-child(1):hover {
    box-shadow: none;
}

.n-page3-content-img img:hover {
    box-shadow: 0px 4px 30px rgba(0, 0, 0, 0.25);
}

.n-page3-content-btn {
    position: absolute;
    display: flex;
    margin-top: -64px;
}

.n-page3-btn-1 {
    margin-left: calc((100% - 1440px)/2 + 244px);
}

.n-page3-btn-2 {
    margin-left: calc((100% - 1440px)/2 + 576px);
}

.n-page3-btn-3 {
    margin-left: calc((100% - 1440px)/2 + 900px);
}

.n-page3-btn-4 {
    margin-left: calc((100% - 1440px)/2 + 1232px);
}

.n-page3-content-btn-grey {
    width: 112px;
    height: 40px;
    background: #DA0030;
    border-radius: 4px;
    font-size: 16px;
    line-height: 40px;
    text-align: center;
    color: #FFFFFF;
}

.n-page3-content-btn-white {
    width: 128px;
    height: 40px;
    background: #FFFFFF;
    border: 0.5px solid #D5D5D5;
    border-radius: 4px;
    font-size: 16px;
    line-height: 40px;
    text-align: center;
    color: #292929;
    margin-left: 12px;
}

.n-page3-foot {
    margin-top: 48px;
    padding-bottom: 90px;
    text-align: center;
}

.n-page3-foot-btn {
    width: 144px;
    height: 40px;
    background: #FFFFFF;
    border: 1px solid #DA0030;
    backdrop-filter: blur(5px);
    border-radius: 4px;
    margin-left: calc((100% - 144px) / 2);
    font-size: 18px;
    line-height: 40px;
    color: #DA0030;
}


/*page4*/

.n-page4 {
    width: 1440px;
    margin-left: calc((100% - 1440px)/2);
}

.n-subtitle-page4 {
    margin-top: 48px;
    font-size: 24px;
    line-height: 32px;
    color: #292929;
    text-align: center;
}

.n-page4-content {
    margin-top: 36px;
    display: flex;
    justify-content: space-between;
}


/* page5 */

.n-page5 {
    width: 1440px;
    margin-left: calc((100% - 1440px)/2);
}

.n-page5 .n-title {
    margin-top: 48px;
}

.n-page5 .n-tab {
    margin-top: 48px;
}

.n-page5 .n-tab-content {
    display: flex;
    flex-direction: row;
    justify-content: space-between;
}

.n-subtitle-page5 {
    margin-top: 48px;
    font-size: 24px;
    line-height: 32px;
    color: #292929;
    text-align: center;
}


/* page6 */

.n-page6 {
    background-color: #F4FAFF;
    padding-bottom: 90px;
}

.n-page6-content {
    margin-top: 22px;
    display: flex;
    flex-direction: row;
    justify-content: space-between;
    flex-wrap: wrap;
    width: 1440px;
    margin-left: calc((100% - 1440px)/2);
}

.n-page6 .n-title {
    margin-top: 0;
    padding-top: 90px;
}

.n-case {
    margin-top: 26px;
    width: 464px;
    position: relative;
}

.n-case img {
    width: 464px;
}

.n-more {
    position: absolute;
    width: 80px;
    height: 38px;
    background: #026DF7;
    border-radius: 50px;
    margin-top: 12px;
    margin-left: 372px;
    font-size: 14px;
    line-height: 38px;
    text-align: center;
    color: #FFFFFF;
    display: none;
}

.n-case-bottom {
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    width: 100%;
    font-size: 16px;
    bottom: 0;
    height: 56px;
    color: #FFFFFF;
    background: rgba(56, 80, 117, 0.6);
    backdrop-filter: blur(10px);
    -webkit-backdrop-filter: blur(10px);
}

.n-page7-content {
    margin-top: 48px;
    width: 100%;
    background-image: url(../RJ-img/7-bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: right;
}

.n-rank {
    width: 1440px;
    margin-left: calc((100% - 1440px)/2);
    display: flex;
    flex-direction: row;
    align-items: center;
}

.n-rank div {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin-top: 96px;
    margin-bottom: 128px;
    width: 473px;
    height: 147px;
    padding-left: 48px;
}

.n-rank div:first-child {
    margin-right: 24px;
}

.n-rank-active {
    color: #FFFFFF;
    background-color: #0D83D9;
}

.n-rank div {
    color: #292929;
    background-color: #FFFFFF;
}

.n-rank div b {
    color: #385075;
}

.n-rank-active {
    color: #FFFFFF!important;
    background-color: #0D83D9!important;
}

.n-rank-active b {
    color: #FFFFFF!important;
}

.n-rank h2 {
    font-weight: 400;
    font-size: 20px;
}

.n-rank b {
    margin: 8px 0 12px 0;
    font-weight: 700;
    font-size: 24px;
}

.n-rank h5 {
    font-weight: 290;
    font-size: 16px;
}

.n-mobile {
    display: none;
}

@media screen and (max-width:1440px) and (min-width:1200px) {
    .n-banner-title {
        font-size: 42px;
    }
    .n-banner-content h2 {
        font-size: 28px;
    }
    .n-banner-subtitle {
        font-size: 14px;
    }
    .n-banner-content {
        margin-left: calc((100% - 1200px) / 2);
    }
    .n-banner-subtitle {
        width: 500px;
    }
    .n-nav {
        width: 1200px;
    }
    .n-page1,
    .n-page2,
    .n-page4,
    .n-page5 {
        width: 1200px;
        margin-left: calc((100% - 1200px)/2);
    }
    .n-page2-card {
        width: 594px;
    }
    .n-page2-card-imgdesc-1 {
        width: 296px;
    }
    .n-page2-card-imgdesc-2 {
        width: 592px;
    }
    .n-page3-content-img {
        width: 1200px;
        margin-left: calc((100% - 1200px)/2);
    }
    .n-page3-content-img img:nth-child(1) {
        width: 106px!important;
    }
    .n-page3-content-img img:nth-child(2) {
        width: 254px!important;
    }
    .n-page3-content-img img:nth-child(3) {
        width: 254px!important;
    }
    .n-page3-content-img img:nth-child(4) {
        width: 254px!important;
    }
    .n-page3-content-img img:nth-child(5) {
        width: 254px!important;
    }
    .n-page3-content-btn {
        position: absolute;
        display: flex;
        margin-top: -54px;
    }
    .n-page3-content-btn-grey {
        width: 100px;
    }
    .n-page3-content-btn-white {
        width: 110px;
    }
    .n-page3-btn-1 {
        margin-left: calc((100% - 1440px)/2 + 322px);
    }
    .n-page3-btn-2 {
        margin-left: calc((100% - 1440px)/2 + 596px);
    }
    .n-page3-btn-3 {
        margin-left: calc((100% - 1440px)/2 + 874px);
    }
    .n-page3-btn-4 {
        margin-left: calc((100% - 1440px)/2 + 1142px);
    }
    .n-page6-content {
        width: 1200px;
        margin-left: calc((100% - 1200px)/2);
    }
    .n-case {
        width: 386px;
    }
    .n-case img {
        width: 386px;
    }
    .n-more {
        margin-left: 294px;
    }
    .n-rank {
        width: 1200px;
        margin-left: calc((100% - 1200px)/2);
    }
    .n-rank div {
        width: 328px;
        padding-left: 18px;
    }
}

@media screen and (max-width:750px) {
    .n-mobile {
        display: block;
    }
    .n-menu {
        display: none;
    }
    .n-banner-content {
        text-align: center;
        width: 100%;
        margin-left: 0;
        margin-top: 2.5rem;
    }
    #title-img {
        width: 17.0625rem;
    }
    .n-banner-title {
        margin-top: .25rem;
        margin-bottom: .75rem;
        font-size: 1.125rem;
        line-height: 1.5rem;
    }
    .n-banner-subtitle {
        font-size: .75rem;
    }
    .n-banner-btn {
        width: 6.875rem;
        height: 1.8125rem;
    }
    .n-banner-btn-list {
        justify-content: center;
        margin-top: 6.7188rem;
        line-height: 1.8125rem;
        font-size: .875rem;
    }
    .n-btn-2 {
        margin: 0 .75rem;
    }
    .n-title {
        font-size: 1.125rem;
        margin-top: 2.8125rem;
        line-height: 1.5rem;
    }
    .n-subtitle {
        margin-top: .625rem;
        font-size: .8125rem;
        line-height: 1.0625rem;
    }
    .n-page1 {
        width: 100%;
        margin-left: 0;
    }
    .n-page1 .n-tab {
        display: none;
    }
    .n-page1 .n-tab-content {
        display: none;
    }
    #n-swiper1 {
        width: 21.9375rem;
        height: 17.5rem;
        margin: 1.5rem auto 0 auto;
    }
    .n-exp {
        overflow: hidden;
        width: 100%;
        height: 100%;
        background-repeat: no-repeat;
        background-size: cover;
    }
    .n-exp1 {
        background-image: url(../RJ-img/1-1_750.png);
    }
    .n-exp2 {
        background-image: url(../RJ-img/1-2_750.png);
    }
    .n-exp-float {
        color: #FFFFFF;
        height: 14.5625rem;
        background-color: rgba(0, 148, 255, 0.8);
        backdrop-filter: blur(6px);
        -webkit-backdrop-filter: blur(6px);
    }
    .n-exp-float1 {
        margin: 1.0313rem 0 0 .9063rem;
        padding-left: .75rem;
        width: 10rem;
    }
    .n-exp-float2 {
        margin: 1.0313rem 0 0 .75rem;
        padding-left: .75rem;
        width: 20.4375rem;
    }
    .n-exp-float h3 {
        padding-top: .75rem;
        font-size: .875rem;
    }
    .n-exp-float h4 {
        margin-top: .75rem;
        font-size: .8125rem;
    }
    .n-exp-btn {
        margin-top: .75rem;
        display: inline-block;
        padding: .25rem 1.125rem;
        font-size: .875rem;
        color: #DA0030;
        background-color: #FFFFFF;
    }
    #n-swiper1 .swiper-pagination-bullet {
        background-color: rgba(255, 255, 255, 0.7)!important;
        opacity: 1!important;
    }
    #n-swiper1 .swiper-pagination-bullet-active {
        background-color: #FFFFFF!important;
    }
    .n-page2 {
        width: 100%;
        margin-left: 0;
    }
    .n-page2-content {
        display: none;
    }
    #n-swiper2 {
        margin-top: 1.5rem;
    }
    .n-page2-card {
        margin: 0 auto;
        width: 21.9375rem;
        height: 23.5625rem;
    }
    .n-page2-card-imgdesc {
        height: 1.5625rem;
        line-height: 1.5625rem;
        margin-top: -1.5625rem;
        font-size: .75rem;
    }
    .n-page2-card-imgdesc-1 {
        width: 10.9688rem;
    }
    .n-page2-card-title {
        margin: .75rem 0;
        font-size: .9375rem;
        line-height: 1.25rem;
    }
    .n-page2-card-subtitle {
        font-size: .875rem;
        line-height: 1.1563rem;
        margin-bottom: .375rem;
    }
    .n-page2-card-subtitle span {
        font-size: .875rem;
        line-height: 1.1563rem;
    }
    .n-page2-card-subtitle-1 {
        font-size: .8125rem;
        margin-bottom: 2.5625rem;
    }
    .n-page2-card-imgdesc-2 {
        width: 21.9375rem;
    }
    #n-swiper2 .swiper-pagination-bullet-active {
        background: #01A0E8!important;
    }
    .n-page3 .n-title {
        padding-top: 2.8125rem;
    }
    .n-page3-content {
        display: none;
    }
    .m-page3-content {
        width: 21.9375rem;
        margin: 0 auto;
        position: relative;
    }
    .m-page3-content img {
        width: 100%;
        margin-bottom: 2.5rem;
    }
    #n-swiper3 {
        margin-top: 1.5625rem;
    }
    .n-page3-btn-1 {
        margin-left: 5.6rem;
    }
    .n-page3-btn-2 {
        margin-left: 9.8rem;
    }
    .n-page3-content-btn {
        margin-top: -5.2rem;
    }
    .n-page3-content-btn-grey,
    .n-page3-content-btn-white {
        font-size: .8125rem;
        height: 2rem;
        line-height: 2rem;
    }
    .n-page3-foot {
        margin-top: 1rem;
        padding-bottom: 2rem;
    }
    .n-page3-foot-btn {
        width: 8rem;
        height: 2rem;
        font-size: .875rem;
        line-height: 2rem;
        margin-left: calc((100% - 8rem) / 2);
    }
    .n-subtitle-page4 {
        margin-top: 1.5rem;
        font-size: .875rem;
        line-height: 1rem;
    }
    #n-swiper3 .swiper-pagination-bullet-active {
        background: #01A0E8!important;
    }
    .n-page4 {
        width: 21.9375rem;
        margin: 0 auto;
    }
    .n-page4-content {
        display: none;
    }
    #n-swiper4 .swiper-pagination-bullet-active {
        background: #01A0E8!important;
    }
    #n-swiper5-1 .swiper-pagination-bullet-active {
        background: #01A0E8!important;
    }
    #n-swiper5-2 .swiper-pagination-bullet-active {
        background: #01A0E8!important;
    }
    #n-swiper4 {
        margin-top: 1.5rem;
    }
    .n-subtitle-page5 {
        font-size: .875rem;
        margin-top: 1.5rem;
        line-height: 1rem;
    }
    .n-page5 {
        width: 21.9375rem;
        margin: 0 auto;
    }
    .n-tab {
        font-size: .8125rem;
        line-height: .75rem;
        color: #292929;
        height: 1.5rem;
    }
    .n-page5 .n-tab {
        margin-top: .75rem;
    }
    .n-tab div {
        margin-right: 1.5rem;
    }
    .n-page6 {
        padding-bottom: 2.8125rem;
    }
    .n-page6-content {
        width: 21.9375rem;
        margin: 0 auto;
    }
    .n-case {
        margin-top: 1.5rem;
        width: 10.5938rem;
    }
    .n-case img {
        width: 10.5938rem;
    }
    .n-more {
        position: absolute;
        width: 4.5rem;
        height: 1.25rem;
        margin-top: .5rem;
        margin-left: 5.75rem;
        font-size: .75rem;
        line-height: 1.25rem;
        display: block;
    }
    .n-case-bottom {
        position: static;
        font-size: .8125rem;
        background: none;
        color: #292929;
        align-items: flex-start;
        height: 1.75rem;
        margin-top: 5px;
    }
    .n-page7-content {
        background-image: url(../RJ-img/7-bg_750.png);
    }
    .n-rank {
        width: 21.9375rem;
        margin: 0 auto;
        flex-direction: column;
        align-items: flex-start
    }
    .n-rank div {
        margin-top: 2.625rem;
        margin-bottom: 0rem;
        width: 14.7813rem;
        height: 5.625rem;
        padding-left: .75rem;
    }
    .n-rank div:first-child {
        margin-right: 0px;
    }
    .n-rank div:nth-child(2) {
        margin-top: 1rem;
        margin-bottom: 2.625rem;
    }
    .n-rank h2 {
        font-size: .875rem;
    }
    .n-rank b {
        margin: .3125rem 0;
        font-weight: 700;
        font-size: .9375rem;
    }
    .n-rank h5 {
        font-size: .8125rem;
    }
}


/* 7.23新增 */

#productSection {
    background: #f7f9f8;
    padding: 120px 0;
}

#productSection .n-title {
    margin-top: 0;
}

.pageContent {
    width: 1400px;
    margin: 0 auto;
}

.tabCont {
    display: flex;
    justify-content: center;
    align-items: center;
    margin: 60px 0;
}

.tabCont div {
    color: #6A6B6D;
    font-size: 20px;
    font-weight: 400;
    line-height: 150%;
    position: relative;
    padding: 12px 32px;
    cursor: pointer;
}

.tabCont div::after {
    content: "";
    position: absolute;
    width: 100%;
    height: 2px;
    background: #E3E5E6;
    left: 0;
    bottom: 0;
}

.tabCont div.on {
    color: #E60039;
    pointer-events: none;
}

.tabCont div.on::after {
    background: #E60039;
}

.tabInfo {
    display: none;
}

.tabInfo.on {
    display: grid;
    grid-template-columns: repeat(3, 1fr);
    gap: 24px;
}

.productCard img {
    width: 250px;
}

.productCard {
    position: relative;
    text-align: center;
    background: #FFF;
    padding: 20px 16px;
}

.productCard h3 {
    color: #2A2B2E;
    text-align: center;
    font-size: 18px;
    font-weight: 700;
    line-height: 125%;
}

.productCard p {
    margin-top: 12px;
    color: #6A6B6D;
    text-align: center;
    font-size: 16px;
    font-weight: 400;
    line-height: 125%;
}

.productCard span {
    display: block;
    margin-top: 24px;
    color: #E60039;
    text-align: center;
    font-size: 16px;
    font-weight: 400;
    line-height: 125%;
}

.productCard a {
    position: absolute;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
}

.mobileTab {
    display: none;
}

.techCont {
    width: 100%;
    margin-top: 60px;
    display: flex;
}

.techList {
    width: 100%;
    margin-left: 16px;
}

.techInfo {
    position: relative;
    width: 100%;
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 85px;
    padding: 0 16px;
    border-radius: 8px;
    background: #F7F9FA;
    margin-bottom: 16px;
}

.techInfo a {
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
}

.techInfo h3 {
    color: #2A2B2E;
    font-size: 16px;
    font-weight: 400;
    line-height: 150%;
}

.techInfo span {
    display: flex;
    align-items: center;
    color: #E60039;
    font-size: 16px;
    font-weight: 400;
    line-height: 150%;
}

.techInfo span::after {
    content: '';
    display: block;
    background-image: url(../RJ-img/arrow.svg);
    width: 24px;
    height: 24px;
    margin-left: 8px;
    transition: transform 0.3s;
    background-size: cover;
}

.techImg {
    width: 688px;
    flex-shrink: 0;
}

.techImg img {
    width: 100%;
}

@media screen and (min-width:768px) {
    .techInfo:hover span::after {
        transform: translateX(10px);
    }
}

@media screen and (max-width:1480px) {
    .pageContent {
        width: 1200px;
    }
    .productCard img {
        width: 220px;
    }
    .tabCont div {
        font-size: 18px;
    }
    .techImg {
        width: 520px;
    }
    .techInfo {
        height: 62px;
    }
    .techInfo h3 {
        font-size: 14px;
    }
    .techInfo span {
        font-size: 14px;
    }
    .techInfo span::after {
        width: 20px;
        height: 20px;
    }
}

@media screen and (max-width:1280px) {
    .pageContent {
        width: 1000px;
    }
    .tabCont {
        margin: 48px 0;
    }
    #productSection {
        padding: 80px 0;
    }
}

@media screen and (max-width:768px) {
    .n-banner-content h2 {
        font-size: 1.125rem;
    }
    .n-banner-subtitle {
        width: 100%;
    }
    .n-banner-btn-list {
        margin-top: 3.75rem;
    }
    .pageContent {
        width: 100%;
        padding: 0 20px;
    }
    .tabInfo.on {
        grid-template-columns: repeat(2, 1fr);
    }
    .productCard img {
        width: 120px;
    }
    .productCard h3 {
        font-size: 16px;
    }
    .productCard p,
    .productCard span {
        font-size: 12px;
    }
    .productCard p br {
        display: none;
    }
    #productSection {
        padding: 60px 0;
    }
    .mobileTab {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-top: 48px;
        font-size: 16px;
        color: #292929;
        padding: 8px 0;
        border-bottom: 1px solid #E3E5E6;
    }
    .mobileTab::after {
        width: 24px;
        height: 24px;
        background-image: url(../RJ-img/arrow.svg);
        display: block;
        content: '';
        background-size: cover;
        transform: rotate(90deg);
    }
    .mobileTab.on::after {
        transform: rotate(-90deg);
    }
    .tabSection {
        position: sticky;
        top: 64px;
        background: #f7f9f8;
        z-index: 6;
        margin-bottom: 24px;
    }
    .tabCont {
        display: none;
        flex-wrap: wrap;
        margin-top: 0;
    }
    .tabCont div {
        font-size: 14px;
        padding: 10px 0px;
        width: 100%;
    }
    .tabCont div::after {
        display: none;
    }
    .n-page7-content {
        padding-bottom: 1.875rem;
    }
    .n-page6 .n-title {
        padding-top: 2.8125rem;
    }
    .techCont {
        flex-wrap: wrap;
    }
    .techList {
        margin-left: 0;
        margin-top: 16px;
    }
    .techImg {
        width: 100%;
    }
    .techInfo {
        height: unset;
        padding: 16px;
    }
}