/* 自定义样式 */



.swiper-navigation-icon {
    color: #C7302D;
}
.banner-section .swiper-pagination-bullet-active{
    width: 24px;
    background: #C7302D;
}
/* 主体内容宽度设置 */
@media (min-width: 1729px) {
    /* .container {
         max-width: 1664px;
         width: 1664px;
     }*/
}
section{
    padding-top: 66px;
}
/* Banner部分 */

.banner-section{
    background-color: #F5F8FB;
}
.banner-section img {
    width: 100%;
}

.flexslider {
    border: none;
    border-radius: 0;
    margin: 0;
}

.flex-control-nav {
    bottom: 20px;
}

/* 为什么选择与超图合作 */
.why-choose-section {
    padding-bottom: 3.75rem ;
    background: #F5F8FB;;
}
.section-title {
    margin-bottom: 2.5rem;
    font-weight: 800;
    font-size: 2.25rem;
    color: #2B2B2B;
    text-align: center;
    font-style: normal;
    text-transform: none;

}

.feature-box {
    text-align: center;
    padding: 30px;
    background: #fff;
    border-radius: 12px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    height: 100%;
    transition: transform 0.3s ease;
}

.feature-box:hover {
    transform: translateY(-10px);
}

.feature-icon {
    font-size: 48px;
    margin-bottom: 20px;
    color: #004d99;
    text-align: center;
}

.feature-icon img {
    width: 4rem;
    height: 4rem;
    object-fit: contain;
}

.feature-box:hover .feature-title {
    color: #D02828;
}

.feature-title {
    font-size: 20px;
    margin-bottom: 1.5rem;
    font-weight: bold;
    color: #2B2B2B;
    text-align: center;
    font-style: normal;
    text-transform: none;
}

.feature-description {

    margin-bottom: 10px;
    font-weight: 500;
    font-size: 16px;
    line-height: 1.5;
    color: #5D5D5D;
    text-align: left;
    font-style: normal;
    text-transform: none;
    padding-left: 1rem;
}

.feature-description li {
    list-style: disc;
}

/* 获取伙伴身份 */
.partner-benefits-section {
    background-color: #ffffff;

}

.partner-benefits-section .swiper {
    padding: 20px 40px 0 ;
}

.partner-benefits-section .swiper-slide {
    padding: 0 15px;
    opacity: 0.7;
    transition: opacity 0.3s ease;
}

.partner-benefits-section .swiper-slide-active {
    opacity: 1;
    width: 56%;
    /*  margin-left: -100px;*/
}

.partner-benefits-section .swiper-button-prev {
    left: 18.2%;
    color: #BEC7CE;
}

.partner-benefits-section .swiper-button-next {
    right: 18.2%;
    color: #BEC7CE;
}

.partner-benefits-section .swiper-slide-prev,
.partner-benefits-section .swiper-slide-next {
    opacity: 0.4;
}

.benefit-card {
    padding:1.875rem 3.75rem;
    margin-bottom: 1.875rem;
    background: #fff no-repeat center center;
    background-size: cover;
    border-radius: 12px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
    height: 100%;
    transition: transform 0.3s ease;
    min-height: 360px;
}

.benefit-card .case-details-btn {
    margin-top: 50px;
    border-radius: 35px;
    border: 1px solid #5D5D5D;
    color: #5D5D5D;
}

/*.benefit-card:hover {
    transform: translateY(-10px);
}*/

.benefit-card-1 {
    background-image: url('../images/benefit-bg1.jpg');
}

.benefit-card-2 {
    background-image: url('../images/benefit-bg2.jpg');
}

.benefit-card-3 {
    background-image: url('../images/benefit-bg3.jpg');
}

.benefit-card-4 {
    background-image: url('../images/benefit-bg4.jpg');
}

.benefit-image {
    width: 100%;
    height: 200px;
    object-fit: cover;
    border-radius: 8px;
    margin-bottom: 20px;
}

.benefit-title {
    margin: 20px 0 50px;
    font-weight: bold;
    font-size: 1.5rem;
    color: #2B2B2B;


}

.benefit-desc {
    width: 80%;
    font-size: 1rem;
    color: #5D5D5D;
    line-height: 1.5;
    font-style: normal;
    text-transform: none;

}

/* 伙伴案例 */
.partner-cases-section {
    background-color: #FFFFFF;
}

.partner-cases-section .section-title {
    padding: 0 15px;
}

.case-slide {
    position: relative;
    height: 500px;
    overflow: hidden;
    margin: 0;
}

.case-background {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}

.case-content {
    position: relative;
    z-index: 2;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: flex-start;
    height: 100%;
    text-align: left;
    color: white;

}

.case-title {
    font-size: 2.4rem;
    font-weight: bold;
    text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
    margin-bottom: 50px;
    line-height: 1.5;
}

.case-details-btn {
    display: inline-block;
    padding: 8px 30px;
    background-color: transparent;
    color: #FFFFFF;
    text-decoration: none;
    border-radius: 35px;
    transition: all 0.3s ease;
    border: 1px solid #ffffff;
}

.case-details-btn:hover {
    color: #D02828;
    transform: translateY(-3px);
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.3);
    border: 1px solid #D02828;
}

.swiper-pagination {
    position: relative;
    bottom: 0;
    display: flex;
    justify-content: center;
}

.swiper-pagination-bullet {
    width: 8px;
    height: 8px;
    background-color: transparent;
    opacity: 1;
    border-radius: 20px;
    color: #666;
    font-size: 14px;
    transition: all 0.3s ease;
    border: 1px solid #ddd;
}

#caseSlider .swiper-pagination-bullet {
    background: #CAC9CF;


}

#caseSlider .swiper-pagination-bullet-active {
    width: 24px;
    background: #C7302D;
}

.partner-benefits-section .swiper-pagination-bullet {
    width: auto;
    height: auto;
    padding: 8px 16px;
}

.swiper-pagination-bullet-active {
    opacity: 1;
    background-color: #D02828;
    color: #fff;
    border: 1px solid #D02828;
    width: auto;
    border-radius: 20px;
}

.swiper-pagination-bullets.swiper-pagination-horizontal {
    bottom: 2.5rem;
}

.partner-benefits-section .swiper-pagination-bullets.swiper-pagination-horizontal {
    bottom: 20px;
    margin-bottom: 15px;
}
.partner-benefits-section .swiper-pagination {
     gap: 10px;
}
.partner-benefits-section .swiper-pagination-bullet {
    border: none;
    font-size: 1rem;
    color: #5D5D5D;
    text-align: center;
    border-radius: 0;
}

.partner-benefits-section .swiper-pagination-bullet-active {
    border-bottom: 2px solid #D02828;
    color: #2B2B2B;
    font-weight: bold;
    background-color: transparent;
    border-radius: 0;
}

/* 热门活动 */


#eventsSlider {
    overflow: visible;
}


.event-link {
    text-decoration: none;
    color: inherit;
    display: block;
    transition: all 0.3s ease;
    border-radius: 4px;
    padding-bottom: 10px;
}

.event-link:hover {
    transform: translateY(-5px);
    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2);
}

.event-link:hover .event-image {
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}

.event-link:hover .event-title {
    color: #D02828;
}

.event-image {
    width: 100%;
    height: auto;
    object-fit: cover;
    border-radius: 4px;
    overflow: hidden;
    margin-bottom: 15px;
}

.event-title {
    margin: 10px 0;
    font-weight: bold;
    font-size: 1rem;
    color: #000000;
    text-align: center;
}

.event-date {
    color: #5D5D5D;
    font-size: 14px;
    text-align: center;
    margin-bottom: 10px;
}


/* 导航箭头 */
.flex-direction-nav a {
    width: 50px;
    height: 50px;
    line-height: 50px;
    background: rgba(0, 0, 0, 0.5);
    border-radius: 50%;
}

.flex-direction-nav a:before {
    font-size: 24px;
    color: #fff;
}


/* 案例轮播导航箭头 */
#caseSlider .flex-direction-nav a {
    background: rgba(0, 0, 0, 0.7);
}

#caseSlider .flex-direction-nav a:hover {
    background: rgba(0, 0, 0, 0.9);
}

#caseSlider .flex-direction-nav .flex-prev {
    left: 20px;
}

#caseSlider .flex-direction-nav .flex-next {
    right: 20px;
}

/* 合作伙伴Logo区域 */

.logo-feedback {
    padding-bottom: 6.25rem;
    background-color: #f8f9fa;
    background-image: url('../images/logo-bg.jpg');
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
}


.logo-scroll-container {
    overflow: hidden;
    width: 100%;
    margin-top: 60px;
}

.logo-row {
    display: flex;
    animation: scroll-left 30s linear infinite;
    width: max-content;
    padding: 10px 0;
}

.logo-row.offset-row {
    animation: scroll-left 30s linear infinite;
    margin-left: -50px;
}

.logo-item {
    flex: 0 0 auto;
    width: 208px;
    height: 96px;
    display: flex;
    align-items: center;
    justify-content: center;
    padding: 0 20px;
    box-sizing: content-box;
    background-color: #ffffff;
    border-radius: 12px;
    margin: 10px 20px;
    box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);
}

.logo-item img {
    max-width: 100%;
    max-height: 80%;
    object-fit: contain;
    /*  filter: grayscale(100%);
      opacity: 0.7;*/
    transition: all 0.3s ease;
}

.logo-item:hover img {
    filter: grayscale(0);
    opacity: 1;
    transform: scale(1.1);
}

@keyframes scroll-left {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}

@keyframes scroll-right {
    0% {
        transform: translateX(-50%);
    }
    100% {
        transform: translateX(0);
    }
}

/* 建议已反馈 */

.feedback-section {
    margin-top: 260px;
}

.feedback-section .container {
    position: relative;
    z-index: 1;
}

.feedback-section .section-title {
    margin-bottom: 2.5rem;
    color: #333;
}

.feedback-content {
    background: #fff;
    border-radius: 10px;
    padding: 30px 50px;
    box-shadow: 0 5px 15px rgba(0, 0, 0, 0.1);
    background-image: url(../images/fankui-bg.png);
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;

}

.feedback-content p {
    color: #5d5d5d;
}

.feedback-item {
    text-align: left;
    padding: 20px;
}

.feedback-header {
    display: flex;
    align-items: center;
    margin-bottom: 20px;
}

.feedback-icon {
    margin-right: 15px;
}

.feedback-icon img {
    width: 30px;
    height: 30px;
    object-fit: contain;
}

.feedback-title {
    font-size: 20px;
    font-weight: bold;
    margin: 0;
    color: #333;
}

.feedback-desc {
    font-size: 1rem;
    color: #5D5D5D;
    line-height: 1.5;
    margin: 0;
}

/* 响应式设计 */
@media (max-width: 768px) {
    .logo-item {
        width: 100px;
        height: 60px;
        padding: 0 10px;
        margin: 5px 5px;
    }
    .feature-box:hover{
        transform: translateY(0);
    }
    .feature-box:hover .feature-title{
        color: #2B2B2B;
    }
    .feedback-section{
        margin-top: 0;
    }
    .logo-row{
        padding: 5px 0;
    }
    .logo-scroll-container{
        margin-top: 0;
    }
    .section-title{
        font-size: 1.5rem;
    }
    .feature-box{
        padding: 20px;
    }
    #caseSlider .swiper-slide{
        height: 100%;

    }
    .feature-title{
        font-size: 1.3rem;
    }
    .feature-description{
        font-size: 1rem;
    }
    .case-content{
        padding: 20px;
    }
    .case-details-btn{
        padding: 4px 15px;
        font-size: 12px;
    }
    .benefit-card{
        padding: 10px 30px;
        min-height: 305px;
    }
    .benefit-title{
        margin: 10px 0 20px;
        font-size: 1.3rem;

    }
    .benefit-card .case-details-btn{
        margin-top: 20px;
    }
    .benefit-desc{
        width: 100%;
    }
    .partner-benefits-section .swiper-button-next,.partner-benefits-section .swiper-button-prev{
        display: none;
    }
    .case-slide{
        height: 180px;
    }
    .case-title{
        font-size: 1.3rem;
        margin-bottom: 1.5rem;
    }
    .why-choose-section .row>div{

        margin-bottom:calc(var(--bs-gutter-x) * .5);
    }
    .logo-row.offset-row {
        margin-left: -25px;
    }
    .swiper-pagination-bullets.swiper-pagination-horizontal{
        bottom: 1.5rem;
    }
  .partner-benefits-section .swiper-pagination-bullet{
       padding: 0;
    }
    .event-link{
        height: 210px;    box-shadow: 0 5px 20px rgba(0, 0, 0, 0.2);
    }
    .event-link:hover{
        transform: translateY(0);
    }
    .logo-feedback {

        background-image: url('../images/logo-bg-2.jpg');
        background-size: cover;

    }
    .feedback-icon img{
        width: 20px;
        height: 20px;
    }
    .feedback-title{
        font-size: 16px;
    }
    .feedback-item{
        margin-bottom: 0;
        padding: 10px 20px;
    }

    @keyframes scroll-left {
        0% {
            transform: translateX(0);
        }
        100% {
            transform: translateX(-50%);
        }
    }

    @keyframes scroll-right {
        0% {
            transform: translateX(-50%);
        }
        100% {
            transform: translateX(0);
        }
    }

    .feedback-content {
        padding: 20px 15px;
    }

}