@charset "utf-8";
/* 灰底輪播區塊 */
.main-solar-block{
    background-color: var(--gray-5);
    padding: 120px 0;
}

.main-solar-block .solar-swiper {
    max-width: 1080px;
}

.main-solar-block .title {
    padding-bottom: 20px;
}

.main-solar-block .txt1 {
    padding-bottom: 40px;
}

.main-solar-block .swiper-btn-block {
    padding-bottom: 40px;
}

/* main-application-block */
.main-application-block {
    background-color: var(--auo-blue);
    padding: 120px 0;
}

/* application-swiper */
.main-application-block.building .swiper-slide {
    margin-right: 24px;
}


/* Feature */
/* main-sticky-block */
.right-description > p {
    color: #ffffff;
    padding-bottom: 72px;
}

.solution-content .main-sticky-block.features li+li {
    padding-top: 110px;
}

/* main-related-info-block */
.main-related-info-block.building {
    background-color: #ffffff;
    position: relative;
    padding: 120px 0 240px 0;
}

.main-related-info-block.building .img {
    width: 488px;
    height: 376px;
}

.main-related-info-block.building .swiper-slide {
    width: 488px;
}

/* 20220927 Amy 調整黃色背景bottom */
.related-bg {
    background-color: var(--energetic-yellow);
    height: 450px;
    width: 100%;
    border-radius: 250px 0px 0px 250px;
    position: absolute;
    bottom: -120px;
    left: 220px;
}

.main-related-info-block .solution-related .title {
    padding: 20px 0 0;
}

.main-related-info-block .solution-related .tag {
    color: var(--gray-1);
    padding-top: 8px;
}



@media screen and (max-width: 1199px) {
    /* 灰底輪播區塊 */
    .main-solar-block .solar-swiper {
        max-width: 688px;
    }

    .main-solar-block {
        padding: 80px 0;
    }

    .main-solar-block .title {
        padding-bottom: 20px;
    }

    .main-solar-block .txt1 {
        padding-bottom: 24px;
    }

    .main-solar-block .swiper-btn-block {
        padding-bottom: 24px;
    }

    /* application-swiper */
    .main-application-block {
        padding: 80px 0;
    }

    .solution-content .main-sticky-block.features li+li {
        padding-top: 40px;
    }

    .features .right-description > p {
        padding-bottom: 40px;
    }

    .main-application-block.building .application-swiper {
        max-width: 540px;
        margin-left: calc((100% - 688px)/2);
    }


    /* main-related-info-block */
    /* 20220927 Amy 調整黃色背景bottom */
    .related-bg {
        height: 314px;
        bottom: -80px;
        left: 40px;
    }

    .main-related-info-block.building .swiper-slide {
        width: 280px;
    }

    .main-related-info-block.building .img {
        width: 280px;
        height: 216px;
    }

    .main-related-info-block.building .swiper-slide {
        margin-right: 20px;
    }

    .main-related-info-block.building {
        padding: 80px 0 160px 0;
    }

    .main-related-info-block .solution-related .title {
        padding: 12px 0 0;
    }
}

@media screen and (max-width: 767px){
     /* 灰底輪播區塊 */
    .main-solar-block .solar-swiper {
        width: calc(100% - 20px);
        margin-left: 20px;
    }

    .solar-swiper .swiper-slide {
        padding-right: 20px;
    }
    

    /* application-swiper */
    .main-application-block.building .swiper-slide {
        margin-right: 10px;
    }

    .main-application-block.building .application-swiper {
        max-width: 280px;
        margin-left: 20px;
    }

    /* main-sticky-block */
    .main-sticky-block.features .left-block {
        padding-top: 80px;
    }

    .main-sticky-block.features .right-block {
        padding-top: 20px;
    }

    .right-description > p {
        padding-bottom: 60px;
    }

    .features .right-description > p {
        padding-bottom: 60px;
    }

    /* main-related-info-block */
    .related-bg {
        top: 233px;
        left: 0px;
        border-radius: 0px;
    }

    .main-related-info-block.building {
        padding: 80px 0;
    }
}

/* ================ news report start================= */
/* ================ news report start================= */
/* ================ news report start================= */


@media screen and (max-width: 767px){
    .report-content .main-related-info-block.building .swiper-slide {
        margin-right: 0px;
    }

    .report-content .main-related-info-block.building .swiper-slide:nth-child(n+2) {
        margin-top: 40px;
    }

    .report-content .main-related-info-block.building .img {
        width: 100%;
        height: auto;
    }

    .report-content .main-related-info-block.building .related-swiper {
        width: 100%;
        margin: 0;
        padding-left: 20px;
        padding-right: 20px;
    }

    .report-content .swiper-wrapper{
        display: block;
    }

    .report-content .btn-block {
        padding-top: 10px;
    }

}