.sec1{
    padding: 9.375% 0;
    text-align: center;
}
.sec1 .tab-control{
    margin-bottom: 7%;
}
.sec1 .tab-control a{
    display: inline-block;
    vertical-align: top;
    margin-right: 1.83em;
    font-size: 1.5em;
    color: #333;
    padding-bottom: 0.5em;
    border-bottom: 2px solid transparent;
}
.sec1 .tab-control a:last-child{
    margin-right: 0;
}
.sec1 .tab-control a.active{
    color: var(--theme-color);
    font-weight: bold;
    border-color: var(--theme-color);
}
.sec1 .list-box{
    display: flex;
    align-items: stretch;
    justify-content: space-between;
    flex-direction: row;
    flex-wrap: wrap;
    margin-bottom: 1%;
}
.sec1 .list-box::after{
    content: "";
    width: 33.333%;
    display: block;
}
.sec1 .list-box li{
    cursor: pointer;
    width: 33.333%;
    margin-bottom: 5%;
    transform: translateY(20vh);
    opacity: 0;
    transition-duration: 0.75s,0.75s;
    transition-property: transform,opacity;
}
.sec1 .list-box li.actived{
    transform: translateY(0);
    opacity: 1;
}
.sec1 .list-box .img-box{
    overflow: hidden;
    margin-bottom: 1.5em;
    position: relative;
    display: inline-block;
    vertical-align: top;
}
.sec1 .list-box .img-box img{
    max-width: 17.5em;
    max-height: 16.25em;
}
.sec1 .list-box .img-box::before{
    content: "";
    display: block;
    position: absolute;
    left: 0.5em;
    top: 0.5em;
    right: 0.5em;
    bottom: 0.5em;
    background-color: #000;
    opacity: 0;
    transition: opacity 0.5s;
}
.sec1 .list-box .img-box::after{
    content: "";
    background-repeat: no-repeat;
    background-size: 100% auto;
    background-image: url(../images/about_honor_icon1.png);
    display: block;
    width: 1.75em;
    height: 1.75em;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%,-50%);
    opacity: 0;
    transition: opacity 0.5s;
}
.sec1 .list-box p{
    font-size: 1.125em;
    line-height: 1.66;
    padding: 0 2.7em;
}

@media only screen and (min-width:1025px){
    .sec1 .tab-control a:hover{
        color: var(--theme-color);
        font-weight: bold;
        border-color: var(--theme-color);
    }
    .sec1 .list-box li:hover .img-box::before{
        opacity: 0.4;
    }
    .sec1 .list-box li:hover .img-box::after{
        opacity: 1;
    }
    .sec1 .list-box li:hover p{
        color: var(--theme-color);
    }
    .sec1 .list-box li:nth-child(3n-1){
        transition-delay: 0.25s,0.25s;
    }
    .sec1 .list-box li:nth-child(3n){
        transition-delay: 0.5s,0.5s;
    }
}
@media only screen and (max-width:1024px){
    .sec1{
        padding: 15% 0;
    }
    .sec1 .tab-control{
        margin-bottom: 10%;
    }
    .sec1 .tab-control a{
        font-size: 1.25em;
    }
    .sec1 .list-box{
        display: block;
        margin-bottom: 5%;
    }
    .sec1 .list-box::after{
        display: none;
    }
    .sec1 .list-box li{
        width: 100%;
        margin-bottom: 10%;
    }
    .sec1 .list-box .img-box{
        margin-bottom: 1em;
    }
    .sec1 .list-box p{
        font-size: 0.9375em;
        padding: 0 2em;
    }
}