.product-nav{
    background: rgba(0, 0, 0, 0.46);
    padding: 16px 0;
    position: relative;
    z-index: 9;
}
.product-nav strong{
    color: white;
    font-size: 18px;
    font-weight: 500;
}
.product-nav ul li a{
    color: white;
    font-size: 14px;
    font-weight: 300;
    transition: all 0.3s;
}
.product-nav ul li a:hover{
    color: var(--theme_color);
}
.product-nav .right .learn_btn{
    padding: 9px 28px;
    font-size: 14px;
    font-weight: 300;
}
.product-nav ul li{
    margin-right: 30px;
}


.product_banner{
    height: 100vh;
    margin-top: -70px;
    max-height: 890px;
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
}
.product_banner .content{
    width: 100%;
}
.product_banner h1{
    font-size: 66px;
    line-height: 76px;
    margin-bottom: 24px;
    font-weight: 600;
    color: white;
}
.product_banner h1 span{
    font-weight: 400;
}
.product_banner p{
    color: white !important;
    margin-bottom: 42px;
    font-size: 20px;
    line-height: 28px;
    opacity: 0.9;
    font-weight: 200;
}

.product_banner .learn_btn{
    padding: 14px 40px;
}
.product_feature{
    padding: 127px 0 115px;
}
.product_feature ul{
    display: grid;
    grid-template-columns: repeat(4,1fr);
    gap: 20px;
}
.product_feature ul li{
    padding: 59px 20px 57px;
    background-color: #f8fbff;
    aspect-ratio: 346/271;
    border-radius: 6px;
    overflow: hidden;
    text-align: center;
}
.product_feature ul li .icon{
    width: 55px;
    height: 55px;
    margin-left: auto;
    margin-right: auto;
    margin-bottom: 35px;
    transition: all 0.4s;
}
.product_feature .head2{
    margin-bottom: 80px;
}
.product_feature ul li strong{
    font-size: 28px;
    display: inline-block;
    margin-bottom: 14px;
    line-height: 30px;
    color: var(--theme_color);
}
.product_feature ul li p{
    font-size: 15px;
    color: #666666;
}
.product_feature ul li:hover .icon{
    transform: translateY(-5px);
}
.product_energy{
    padding: 115px 0 93px;
}
.product_energy ul{
    display: grid;
    grid-template-columns: repeat(2,1fr);
    gap: 20px;
    border-radius: 16px;
    overflow: hidden;
}
.product_energy .left{
    width: 52%;
}
.product_energy .right{
    width: 41.6%;
}
.product_energy ul li:nth-of-type(3){
    grid-column-start: 1;
    grid-column-end: 3;
    aspect-ratio: 753/370;
}
.product_energy ul li{
    overflow: hidden;
    aspect-ratio: 367/370;
    width: 100%;
}
.product_energy ul li:hover img{
    transform: scale(1.1);
}
.product_energy ul li img{
    width: 100%;
    height: 100%;
    transition: all 0.3s;
}
.product_energy .right h2{
    font-size: 48px;
    line-height: 62px;
    margin-bottom: 33px;
}
.product_energy .right p{
    font-size: 17px;
    line-height: 30px;
    color: #808080;
}
.product_intro{
    padding: 93px 0 115px;
}
.product_intro .left h2{
    margin-bottom: 50px;
}
.product_intro .left p{
    font-size: 17px;
    line-height: 30px;
    color: #808080;
}
.product_intro .right{
    width: 52.77%;
}
.product_intro .right .img{
    aspect-ratio: 758/577;
    border-radius: 16px;
    overflow: hidden;
}
.product_intro .right .img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.3s;
}
.product_intro .right .img:hover img{
    transform: scale(1.1);
}
.product_intro .left{
    width: 40.8%;
}
.product_design{
    padding: 125px 0 83px;
}
.product_design .head2 p{
    font-size: 17px;
    line-height: 30px;
    color: #808080;
    max-width: 1150px;
    margin-left: auto;
    margin-right: auto;
    margin-top: 35px;
    margin-bottom: 60px;
}
.product_design .img{
    aspect-ratio: 1439/625;
    border-radius: 16px;
    overflow: hidden;
}
.product_design .img img{
    width: 100%;
    height: 100%;
    object-fit: cover;
    transition: all 0.3s;
}
.product_design .img:hover img{
    transform: scale(1.05);
}
.product_preview .left{
    width: 51.3%;
}
.product_preview .right{
    width: 40%;
}
.product_preview .left .swiper_preview{
    width: 100%;
    overflow: hidden;
    background-color: #f8f9fa;
    border-radius: 10px;
    aspect-ratio: 740/538;
}

.product_preview .left .swiper_preview a{
    display: flex;
    width: 100%;
    height: 100%;
    align-items: center;
    justify-content: center;
}
.product_preview .left .swiper_preview img{
    width: 83%;
    height: 83%;
    object-fit: contain;
}

.product_preview{
    padding: 83px 0 112px;
}
.product_preview .left .swiper_controls{
    width: 87.6%;
    overflow: hidden;
}
.product_preview .left .swiper_controls li{
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #f8f9fa;
    border-radius: 7px;
    border: 1px solid transparent;
    overflow: hidden;
    aspect-ratio: 147/107;
    transition: all 0.3s;
    outline: 1px solid transparent;
    width: 146px;
    cursor: pointer;
}
.product_preview .left .swiper_controls li img{
    width: 85%;
    height: 85%;
    object-fit: contain;
}
.product_preview .left .swiper_controls li.active{
    border: 1px solid var(--theme_color);
}
.product_preview .left .control_btn{
    width: 4%;
    min-width: 4%;
    background: url('../img/right-black2.svg') no-repeat center/8px;
}
.product_preview .left .control_btn.prev{
    background: url('../img/left-black2.svg') no-repeat center/8px;
}
.contral_flex{
    margin-top: 42px;
}
.product_preview .right{
    padding-bottom: 4rem;
}
.product_preview .right h2{
    font-size: 52px;
    margin-bottom: 23px;
}
.product_preview .right p{
    font-size: 17px;
    color: #5b5b5b;
}
.product_preview .right ul{
    margin-top: 30px;
    margin-bottom: 26px;
}
.product_preview .right ul li{
    font-size: 17px;
    line-height: 32px;
    list-style: disc;
    margin-left: 20px;
}
.product_preview .right ul li strong{
    font-weight: 600;
}


.product_spec{
    padding: 112px 0 136px;
}
.product_spec .head2{
    margin-bottom: 112px;
}
.product_spec .full_table {
    margin-bottom: 5rem;
    .title {
        color: #fff;
        font-size: 24px;
        font-weight: 600;
        padding: 8px 20px;
        background-color: #1a9cd0;
    }
    .table {
        overflow: auto;
    }
    table {
        width: 100%;
        border-collapse: collapse;
        td {
            font-size: 20px;
            font-weight: 500;
            padding: 12px 1rem;
            border: 1px solid #e7e8e8;
            text-align: center;
            &:first-child {
                width: 30%;
                text-align: left;
            }
        }
    }
}
.product_spec .right{
    width: 53.8%;
}
.product_spec .left{
    width: 46.2%;
    display: flex;
    align-items: center;
    justify-content: center;
}
.product_spec .left img{
    min-width: 60%;
}
.product_spec .right strong{
    display: flex;
    width: 100%;
    align-items: center;
    padding-left: 16px;
    justify-content: space-between;
    font-size: 24px;
    cursor: pointer;
}
.product_spec .right strong + .table{
    margin-top: 50px;
}
.product_spec .right strong:after{
    content: "";
    width: 14px;
    transition: all 0.3s;
    height: 14px;
    transform: rotate(135deg);
    background: url('../img/close-blue.svg') no-repeat center/contain;
}
.product_spec .right .table{
    display: none;
}
.product_spec .right table{
    width: 100%;
    border-collapse: collapse;
}
.product_spec .right table tr{
    border-bottom: 1px solid #b7b7b7;
}
.product_spec .right table tr td{
    padding: 20px 17px 10px;
    font-size: 20px;
    line-height: 1.7;
}
.product_spec .right table tr:nth-of-type(1) td{
    padding-top: 0;
}
.product_spec .right table tr td:nth-of-type(1){
    width: 45%;
    color: rgba(36, 36, 36,0.76);
    font-weight: 500;
}
.product_spec .right table tr td:nth-of-type(2){
    font-weight: 600;
}
.product_spec .right>div + div{
    margin-top: 38px;
}
.product_spec .right>div:nth-of-type(1) .table{
    display: block;
}
.product_spec .right .active strong:after{
    transform: rotate(0);
}
.product_install{
    padding: 135px 0;
    background-color: #f1f8ff;
    overflow: hidden;
}
.product_install .head2{
    margin-bottom: 69px;
}
.product_install .swiper_product_video li{
    transform: scale(0.8);
    transition: all 0.3s;
    cursor: pointer;
}
.product_install .swiper_product_video li:hover img{
    transform: scale(1.05);
}
.product_install .swiper_product_video li .img{
    aspect-ratio: 900/510;
    border-radius: 6px;
    overflow: hidden;
    position: relative;
}
.product_install .swiper_product_video li .img:after{
    content: "";
    width: 60px;
    height: 60px;
    border-radius: 50%;
    background: url('../img/play-blue.svg') no-repeat center/contain;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
}
.product_install .swiper_product_video li.swiper-slide-active{
    transform: scale(1);
}
.product_install .swiper_product_video li img{
    width: 100%;
    height: 100%;
    transition: all 0.3s;
    object-fit: cover;
}
.product_install .swiper_product_video li p{
    font-size: 24px;
    font-weight: 700;
    margin-top: 28px;
}
.product_install .square_btns{
    max-width: 1123px;
    z-index: 9;
    height: 0;
    top: 42%;
}
.product_install .main{
    position: relative;
}
.product_faq{
    padding: 140px 0 165px;
}
.product_faq .head2 p{
    font-size: 20px;
    color: #555;
    margin-top: 40px;
    font-weight: 500;
}
.product_faq .head2 p a{
    color: var(--theme_color);
    text-decoration: underline;
}
.product_faq .head2 {
    margin-bottom: 70px;
}
.product_faq .faqs_content strong{
    font-size: 24px;
    font-weight: 600;
    display: flex;
    align-items: center;
    justify-content: space-between;
    padding-bottom: 32px;
    padding-top: 27px;
    cursor: pointer;
    transition: all 0.3s;
}
.product_faq .faqs_content .active strong{
    color: var(--theme_color);
}
.product_faq .faqs_content strong:after{
    content: "";
    width: 16px;
    transition: all 0.3s;
    height: 9px;
    background: url('../img/bottom-blue.svg') no-repeat center/contain;
}
.product_faq .faqs_content li.active strong:after{
    transform: rotate(180deg);
}
.product_faq .faqs_content li{
    border-top: 1px solid #c1c1c193;
}
.product_faq .faqs_content li:last-of-type{
    border-bottom: 1px solid #c1c1c193;
}
.product_faq .faqs_content li p{
    font-size: 20px;
    margin-top: -0.5rem;
    line-height: 38px;
    color: rgba(36, 36, 36,0.75);
    padding-bottom: 34px;
    display: none;
}
.product_faq .faqs_content li:nth-of-type(1) p{
    display: block;
}



.related_product{
    padding: 130px 0 100px;
    background-color: #f1f8ff;
}
.related_product .head2 h2{
    margin-bottom: 90px;
    font-size: 46px;
}

.related_product p.center{
    margin-top: 70px;
}
.related_product .morebtn:after{
    background: linear-gradient(to right,var(--theme_color),var(--theme_color),rgba(255,255,255,0),rgba(255,255,255,0));
}