/*====================================
    about css
=====================================*/

/* about-tabs-core */
.about-tabs-core .que-ans li {
    border-top: none;
    padding-top: 0;
}

/* about-service-img mobile */
.about-service .about-service-img img {
    max-width: 80%;
    margin: 0 auto;
    display: block;
}
@media (min-width: 992px) {
    .about-service .about-service-img img {
        max-width: 100%;
    }
}

.about-tabs-core .que-ans li a.question {
    padding: 1rem;
    border-radius: 1rem;
    border: 1px solid #999;
    transition: all 0.3s ease;
}

.about-tabs-core .que-ans li a.question[aria-expanded="true"] {
    border: 1px solid var(--font-color-primary);
    background-color: var(--font-color-primary);
    color: #fff;
    border-radius: 1rem 1rem 0 0;
}

.about-tabs-core .que-ans li .ans-content {
    padding: 1rem;
    background: var(--background-color-gray);
}

.about-tabs-core .que-ans li .ans-content .ans-title {
    font-size: var(--font-size-24);
}

.about-tabs-core .que-ans li .ans-content ul {
    list-style: disc;
    color: #666;
}

.about-tabs-core .que-ans li .ans-content ul li {
    padding-top: 0
}

/* about-service */
.about-service {
    position: relative;
}

@media (max-width:767px) {
    .about-service .rotateimg {
        width: 80%;
        margin: 0 auto;
        justify-content: center;
    }
}

/* about-history */
.about-history {}

.a-h-ul {
    --about-history-round: clamp(1rem, 0.273rem + 3.64vw, 3rem);
}

.a-h-li {
    position: relative;
    width: calc(50% + calc(var(--about-history-round) / 2));

}

.a-h-li.a-h-li-left {
    display: flex;
    flex-direction: row-reverse;
    justify-content: start;
    align-items: stretch;
}

.a-h-li.a-h-li-right {
    display: flex;
    flex-direction: row;
    justify-content: start;
    align-items: stretch;
    margin-left: auto;
}

.a-h-li .a-h-ico {
    display: flex;
    flex-direction: column;
}

.a-h-li .a-h-ico-round {
    position: relative;
    width: var(--about-history-round);
    height: var(--about-history-round);
    background-color: #fff;
    border-radius: 50%;
    border: var(--font-color-primary) solid calc(var(--about-history-round) / 5);
    flex-shrink: 0;
    margin: 10px 0;
}

.a-h-li .a-h-ico .a-h-img {
    position: absolute;
    top: 50%;
    z-index: -1;
    width: clamp(8.75rem, 5.25rem + 17.5vw, 26.25rem);
    transform: translateY(-50%);
    -webkit-user-drag: none;
    /*用户不能拖动图片*/
    -webkit-touch-callout: none;
    /*IOS用户不能长按保存图片*/
    -webkit-user-select: none;
    user-select: none;
    /*用户不能选中图片*/
    pointer-events: none;
    /*防止鼠标事件触发在图片上*/

    transition: all .3s linear;
    transform-origin: 50% 0;
}

.a-h-li.a-h-li-left .a-h-ico .a-h-img {
    right: 100%;
}

.a-h-li.a-h-li-right .a-h-ico .a-h-img {
    left: 100%;
}

.a-h-li .a-h-ico-line {
    position: relative;
    background-color: var(--font-color-primary);
    width: var(--about-history-round);
    height: 100%;
    min-height: 100px;
}

.a-h-li .a-h-ico-line::before {
    position: absolute;
    content: "";
    top: 0;
    width: 0;
    height: 0;
    border-left: calc(var(--about-history-round) / 2) solid #fff;
    border-right: calc(var(--about-history-round) / 2) solid #fff;
    border-bottom: calc(var(--about-history-round) / 2) solid var(--font-color-primary);
}

.a-h-li .a-h-ico-line::after {
    position: absolute;
    content: "";
    bottom: 0;
    width: 0;
    height: 0;
    border-left: calc(var(--about-history-round) / 2) solid transparent;
    border-right: calc(var(--about-history-round) / 2) solid transparent;
    border-bottom: calc(var(--about-history-round) / 2) solid #fff;
}

.a-h-li .a-h-info {
    font-size: var(--font-size-20);
    width: 100%;
    margin: calc(var(--about-history-round) + 20px) var(--about-history-round) var(--about-history-round) var(--about-history-round);
    z-index: 3;
}

.a-h-li:first-child .a-h-ico .a-h-ico-round {
    display: none;
}

/* .about-history-li:nth-child(3) .about-history-li-info {
    margin: calc(var(--about-history-round) * 2) var(--about-history-round) var(--about-history-round) var(--about-history-round);
    z-index: 3;
} */

.a-h-li .a-h-info .a-h-title {
    font-size: var(--font-size-48);
    font-weight: 600;
}

.a-h-li.a-h-li-left .a-h-info {
    text-align: right;
}

.a-h-li .a-h-info p {
    font-weight: 600;
}

.a-h-li:hover .a-h-ico .a-h-ico-round img {
    transform: scale(1.1) translateY(-50%);
}

/* about-responsibility-desc */
.about-responsibility .about-responsibility-title h2 {
    font-size: var(--font-size-36);
}

.about-responsibility-desc {
    font-size: var(--font-size-28);
}

/* about-address */
.about-address-item {
    height: 100%;
    text-align: center;
}

.about-address-item .about-address-pic {
    position: relative;
    font-size: var(--font-size-20);
    padding-top: 60%;
    border-radius: 1rem;
    margin-top: 1rem;
    overflow: hidden;
    transition: all 1s ease-in-out;
}

.about-address-item .about-address-pic img {
    position: absolute;
    left: 0;
    bottom: 0;
    width: 100%;
}

.about-address-item .about-address-title {
    position: relative;
    margin-top: clamp(1rem, 0.95rem + 0.25vw, 1.25rem);
    transition: all .8s ease-in-out;
}

.about-address-item .about-address-desc {
    font-size: var(--font-size-18);
    font-weight: 400;
    opacity: 0;
    transform: translateY(-2rem);
    transition: all .8s ease-in-out;
    margin-bottom: clamp(1rem, 0.95rem + 0.25vw, 1.25rem);
}

.about-address-item .about-address-info {
    font-size: var(--font-size-18);
    transform: translateY(-2rem);
    transition: all .8s ease-in-out;
    margin-bottom: 2rem;
}

.about-address-item:hover {
    cursor: pointer;
    margin-bottom: 0px;
}

.about-address-item:hover .about-address-pic {
    margin-top: 0;
    padding-top: calc(60% + 1rem);

}

.about-address-item:hover .about-address-title {
    color: var(--font-color-primary);
}

.about-address-item:hover .about-address-desc {
    opacity: 1;
    color: var(--font-color-primary);
    transform: translateY(0px);
}

.about-address-item:hover .about-address-info {
    transform: translateY(0rem);
}