section.intro{
    padding-top: calc(90 * var(--rpx-50));
    padding-bottom: calc(120 * var(--rpx-50));
}

.intro .desc{
    color: #4c4c4c;
}

.intro-ctn{
    margin-top: calc(72 * var(--rpx-50));
    display: flex;
    align-items: stretch;
}

.intro-ctn .data{
    width: 50%;
    flex: 0 0 auto;
}

.intro-ctn .video{
    width: 50%;
    flex: 0 0 auto;

    aspect-ratio: 5/3;
    overflow: hidden;
    position: relative;
    cursor: pointer;
}

.intro-ctn .video .cover{
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    object-fit: cover;
}

.intro-ctn .video::after{
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: rgba(0, 0, 0, .3);
    z-index: 230;
    transition: .3s;
}

.intro-ctn .video .btn-play{
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    margin: auto;
    z-index: 240;
    filter: drop-shadow(0px 0px 20px rgba(0, 0, 0, .3));
    transition: .3s;

    width: calc(80 * var(--rpx-50));
    height: calc(80 * var(--rpx-50));

    background: url("../images/global/icon_play.svg") center/contain no-repeat;
}

.intro-ctn .video:hover .btn-play{
    transform: scale(1.1);
    filter: drop-shadow(0px 0px 20px rgba(255, 255, 255, .6));
}
.intro-ctn .video:hover::after{
    background-color: rgba(0, 0, 0, .2);
}

.intro-ctn .data{
    display: grid;
    grid-template: repeat(auto-fill, 1fr)/repeat(auto-fill, 1fr);
    grid-template-areas: "cell1 cell1" "cell2 cell3";
}

.intro-ctn .data .cell{
    display: flex;
    flex-direction: column;
    align-items: flex-start;
    justify-content: center;
    --theme-color: #666;
    position: relative;

    padding-left: calc(60 * var(--rpx-50));
}

.intro-ctn .data .cell>*{
    position: relative;
    z-index: 220;
}

.intro-ctn .data .cell::before{
    content: "";
    position: absolute;
    width: 100%;
    height: 100%;
    top: 0;
    left: 0;
    background: var(--theme-color);
    opacity: .2;
}

.intro-ctn .data .cell:nth-of-type(1){
    grid-area: cell1;
    --theme-color: var(--theme-navy);
}

.intro-ctn .data .cell:nth-of-type(2){
    grid-area: cell2;
    --theme-color: var(--theme-grass);
}

.intro-ctn .data .cell:nth-of-type(3){
    grid-area: cell3;
    --theme-color: var(--theme-orange);
}


.intro-ctn .data .cell .value{
    font-size: calc(32 * var(--rpx));
    color: var(--theme-color);
}

.intro-ctn .data .cell .value span{
    font-size: 2em;
}

.sec2{
    padding-top: calc(120 * var(--rpx-50));
    padding-bottom: calc(120 * var(--rpx-50));
    color: #fff;
}

.sec2 .foldable{
    height: calc(480 * var(--rpx));
    display: flex;
    align-items: stretch;
}

.sec2 .fold-item{
    width: 20%;
    flex: 0 0 auto;

    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;

    border-right: 1px solid rgba(255, 255, 255, .5);
    transition: 1.4s cubic-bezier(0.15, 1, 0.336, 1);
}

.sec2 .fold-item:last-of-type{
    border-right: none;
}

.sec2 .fold-item:hover{
    background: linear-gradient(to top, rgba(255, 255, 255, .2), rgba(255, 255, 255, 0));
}

.sec2 .fold-item.active{
    width: 60%;
}

.sec2 .fold-item .title{
    font-size: calc(24 * var(--rpx));
    font-weight: lighter;
}

.sec2 .fold-item .desc{
    white-space: nowrap;
    font-size: calc(32 * var(--rpx));
    font-weight: bold;
    opacity: 0;
    visibility: hidden;
    transition: .8s;
    margin-top: calc(10 * var(--rpx));
}

.sec2 .fold-item.active .desc{
    visibility: visible;
    opacity: 1;
}

.committee{
    padding-top: calc(160 * var(--rpx-50));
    padding-bottom: calc(60 * var(--rpx-50));
}

.cmt-ctn{
    position: relative;
    column-gap: clamp(0px, calc(-25vw + 480px), 240px);
    display: flex;
    flex-wrap: wrap;
    margin-top: calc(90 * var(--rpx-50));
}

.cmt-cell{
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;

    height: calc(310 * var(--rpx));
    width: clamp(330px, calc(48.9583vw - 140px), 800px);
    flex: 0 0 auto;
    position: relative;
    z-index: 220;
}

.cmt-back{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    margin: auto;
    height: 100%;
    max-height: calc(620 * var(--rpx));
    width: auto;
}

.cmt-cell p{
    font-size: calc(22 * var(--rpx));
    font-weight: lighter;
    margin-top: 0;
    line-height: calc(38em / 24);
}

.cmt-cell p:nth-of-type(3){
    margin-top: 1em;
}

.cmt-cell p a{
    font-size: calc(14rem / 16);
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: space-between;
    margin-top: .8em;
}

.cmt-cell:last-of-type a{
    width: 13em;
}

.cmt-cell a:not(.wfEditorMode)::after{
    content: "";
    border-radius: 50%;
    display: inline-block;
    vertical-align: middle;
    margin-left: calc(5em / 14);
    width: calc(30em / 14);
    height: calc(30em / 14);
    background: url("../images/global/icon_more.svg") center/calc(11em / 14) auto no-repeat var(--theme-grass);
}

section.board{
    padding-top: calc(60 * var(--rpx-50));
    padding-bottom: calc(70 * var(--rpx-50));
}

section.management{
    padding-top: calc(70 * var(--rpx-50));
    padding-bottom: calc(70 * var(--rpx-50));
}

.people-ctn{
    display: flex;
    --gap: calc(40 * var(--rpx-50));
    --swiper-main-width: clamp(380px, calc(25vw + 160px), 640px);
    --swiper-others-width: clamp(500px, calc(43.75vw + 80px), 920px);
    gap: var(--gap);
    margin-top: calc(80 * var(--rpx-50));
    align-items: flex-start;
}

.people-ctn .swiper-people-main{
    width: var(--swiper-main-width);
    flex: 0 0 auto;
    overflow: visible;
}

.swiper-people-main .swiper-slide{
    background-color: #fff;
}

.people-ctn .swiper-people-main:has(.info-box.expanded){
    z-index: 280;
}

.people-ctn .swiper-people-others{
    width: var(--swiper-others-width);
    height: var(--swiper-main-width);
}

.people-ctn .photo{
    display: block;
    width: 100%;
    aspect-ratio: 1/1;
    background-color: #666;
}

.swiper-people-others .swiper-wrapper{
    height: auto;
}

.swiper-people-others .swiper-slide{
    width: calc(280 * var(--rpx));
    margin-right: var(--gap);
    cursor: pointer;
    transition: .3s;
}

.swiper-people-others .swiper-slide:hover{
    filter: brightness(.8);
}

.swiper-people-others .swiper-slide img{
    display: block;
    width: 100%;
    height: auto;
}

.swiper-people-others .placeholder{
    pointer-events: none;
    width: var(--swiper-others-width);
    height: var(--swiper-others-width);
}

.info-box{
    width: calc(320 * var(--rpx));
    height: calc(320 * var(--rpx));
    margin-top: calc(-160 * var(--rpx));
    background-color: var(--theme-navy);
    color: #fff;
    padding: calc(32 * var(--rpx)) calc(36 * var(--rpx));
    position: relative;
    z-index: 240;
    display: flex;
    flex-direction: column;
    align-items: stretch;
    transition: cubic-bezier(0.15, 1, 0.336, 1) .6s all, margin-top 0s;
    visibility: hidden;
    opacity: 0;
}

.swiper-slide-active .info-box{
    visibility: visible;
    opacity: 1;
}

.info-box .name{
    font-size: calc(32 * var(--rpx));
    font-weight: bold;
}


.info-box .desc{
    margin-top: calc(20 * var(--rpx));
    margin-bottom: calc(20 * var(--rpx));
    display: none;
}

.info-box .title{
    font-size: calc(24 * var(--rpx));
    font-weight: lighter;
}

.info-box .btn-ctn{
    margin-top: auto;
    margin-bottom: 0;
    justify-self: flex-end;
    text-align: right;
}

.info-box .btn-view{
    cursor: pointer;
}

.info-box .btn-view:hover{
    text-decoration: underline;
}

.info-box.expanded{
    position: absolute;
    left: 100%;
    width: calc(var(--wrapper-width) - var(--swiper-main-width));
    height: var(--swiper-main-width);
    margin-top: 0;
    top: 0;
    overflow: auto;
}

.info-box.expanded .desc{
    display: block;
}

.info-box.expanded .btn-view i.arr{
    transform: rotate(-135deg);
}

.award{
    border-top: #e5e5e5 1px solid;
}

.award:last-of-type{
    border-bottom: #e5e5e5 1px solid;
}

.award .col1{
    width: clamp(160px, calc(39.5833vw - 220px), 540px);
    flex: 0 0 auto;

    font-size: calc(14rem / 16);
    color: var(--theme-navy);
}

.award .col2{
    width: clamp(740px, calc(33.3333vw + 420px), 1060px);
    flex: 0 0 auto;
}

.award-title{
    display: flex;
    align-items: center;
    min-height: calc(80 * var(--rpx-75));
    padding-top: calc(16 * var(--rpx-75));
    padding-bottom: calc(16 * var(--rpx-75));
    position: relative;
}

.award-title .col2{
    font-weight: bold;
    font-size: calc(24 * var(--rpx-75));
}

.award.active .award-title,
.award:hover .award-title{
    color: var(--theme-navy);
}

.award-title .arr{
    position: absolute;
    right: calc(30 * var(--rpx));
    top: 0;
    bottom: 0;
    margin: auto;
    font-size: 1rem;
    transform: rotate(45deg);
}

.active .award-title .arr{
    transform: rotate(135deg);
}

.award-content{
    display: flex;
    justify-content: flex-end;
    padding-bottom: calc(80 * var(--rpx-50));
}

.award-content .col2{
    display: flex;
    align-items: stretch;
    background-color: #f5f5f5;
}

.award-content .col2>*{
    width: 50%;
    flex: 0 0 auto;
}

.award-content .info{
    padding: calc(36 * var(--rpx));
}

.award-content .cover img{
    display: block;
    width: 100%;
    height: auto;
}


@media (max-width: 960px) {
    .award .col1{
        width: calc(80 * var(--rpx));
        flex: 0 0 auto;
    }

    .award .col2{
        flex: 1 1 auto;
    }

    .award-content .col2{
        width: 100%;
    }

    .cmt-ctn{
        column-gap: 30%;
    }

    .cmt-cell{
        width: 35%;
        text-align: center;
    }

    .cmt-back{
        transform: scale(.75);
    }
}

@media (max-width: 750px) {
    .intro-ctn{
        display: block;
    }

    .intro-ctn .data{
        width: 100%;
        aspect-ratio: 5/3;
    }

    .intro-ctn .video{
        width: 100%;
    }

    .desc.lg{
        width: 100%;
    }

    .cmt-ctn{
        width: 100%;
        row-gap: calc(240 * var(--rpx));
        column-gap: 10%;
    }

    .cmt-cell{
        width: 45%;
    }

    .cmt-back{
        width: 100%;
        height: auto;
        bottom: 0;
    }

    .sec2 .foldable{
        flex-direction: column;
        height: calc(540 * var(--rpx));
    }

    .sec2 .fold-item{
        width: 100%;
        height: 25%;
        border-right: none;
        border-bottom: 1px solid rgba(255, 255, 255, .5);
    }

    .sec2 .fold-item.active{
        width: 100%;
        height: 50%;
    }

    .sec2 .fold-item .desc{
        width: 80%;
        font-size: calc(30 * var(--rpx));
        height: 0;
        white-space: normal;
        text-align: center;
    }

    .sec2 .fold-item.active .desc{
        height: auto;
    }

    .info-box.expanded{
        position: relative;
        width: 100%;
        margin-top: 0;
        height: auto;
        left: 0;
    }

    .people-ctn .swiper-people-main{
        width: 100%;
    }

    .people-ctn .swiper-people-others{
        position: absolute;

        left: calc(360 * var(--rpx));
        bottom: 0;
    }

    .swiper-people-others .swiper-wrapper{
        visibility: hidden;
        pointer-events: none;
    }

    .award-content .col2{
        display: flex;
        flex-direction: column-reverse;
    }

    .award-content .col2>*{
        width: 100%;
    }

    .award-content .info{
        padding: calc(20 * var(--rpx));
    }

    .award-title .arr{
        right: 0;
    }

    .award .col1{
        width: calc(60 * var(--rpx));
    }

    .award .award-title .col2{
        width: calc(100% - (60 * var(--rpx)));
        padding-right: calc(40 * var(--rpx));
    }

    .award .col1{
        font-size: 1.25rem;
    }
}