.section_team {
/*    overflow-y: scroll;*/
    height: 92dvh;
    position: relative;
    margin-bottom: 2dvh;
}

/*ul,
ol,
li {
    list-style: none;
    padding: 0;
    margin: 0;
}*/

.team-section {
    z-index: 997;
    position: relative;
    width: 100%;
    height: 100%;
    overflow: hidden;
}

.pointer {
    position: absolute;
    transform-origin: 0 0;
    z-index: 50;
}

.pointer .point-1,
.pointer .point-2,
.pointer .line {
    position: absolute;
    background-color: red;
}

.pointer .point-1,
.pointer .point-2 {
    width: 10px;
    height: 10px;
    border-radius: 50%;
    top: -5px;
    transform-origin: center center;
    transform: scale(0);
}

.pointer .point-1 {
    left: -5px;
}

.pointer .point-2 {
    right: -5px;
}

.pointer .line {
    top: 0;
    width: 0;
    height: 1px;
}

.pointer.active .point-1,
.pointer.active .point-2 {
    transition: transform 0.3s;
}

.pointer.active .point-1,
.pointer.active .point-2 {
    transform: scale(1);
}

.pointer.active .line {
    width: 100%;
    transition: width 0.3s;
    transition-delay: 0.25s;
}

.pointer.active .point-2 {
    transition-delay: 0.6s;
}

.center-area {
    position: absolute;
    top: 50%;
    left: 0;
    width: 100%;
    min-height: 100px;
    margin-top: -50px;
    text-align: center;
}

.center-area .title,
.center-area .name {
    font-size: 50px;
    margin: 0;
}

.center-area .note,
.center-area .job-title {
    font-size: 18px;
    margin: 0;
}

.center-area .our-team {
    position: absolute;
    top: 0;
    left: 50%;
    margin-left: -109px;
    transform: scale(1);
    opacity: 1;
    transition: transform 0.4s, opacity 0.2s;
}

.center-area .text-center {
    text-align: center;
}

.center-area .member-info {
    display: inline-block;
    transform: scale(0.5);
    opacity: 0;
    transition: transform 0.4s, opacity 0.2s;
}

.center-area.active .our-team {
    transform: scale(0.5);
    opacity: 0;
}

.center-area.active .member-info {
    transform: scale(1);
    opacity: 1;
}

.team-list {
    position: absolute;
    top: 50%;
    left: 0;
    z-index: 10;
    margin-top: -35px;
    transition: transform 0.4s;
    transform: translateX(100%);
}

.team-list .team-member {
    display: inline-block;
    text-align: center;
    font-size: 16px;
    cursor: default;
    color: #fff;
    width: 70px;
    height: 70px;
    line-height: 70px;
    transition: transform 0.4s;
}

.team-list .team-member .hover-effect {
    border-radius: 50%;
    transition: transform 0.4s;
    position: absolute;
    top: -5%;
    bottom: 0;
    left: -5%;
    right: 0;
    z-index: -1;
    animation: none;
    width: 110%;
    height: 110%;
    transition: 0.4s;
}

.team-list .team-member .hover-effect:before {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    border-radius: 50%;
    display: inline-block;
    animation: none;
}

.team-list .team-member .hover-effect:after {
    content: "";
    position: absolute;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    border-radius: 50%;
    display: inline-block;
    animation: none;
}

.team-list .team-member:nth-child(1) .hover-effect,
.team-list .team-member:nth-child(1) .hover-effect:before,
.team-list .team-member:nth-child(1) .hover-effect:after {
    background-color: rgba(132, 98, 77, 0.2);
}

.team-list .team-member:nth-child(2) .hover-effect,
.team-list .team-member:nth-child(2) .hover-effect:before,
.team-list .team-member:nth-child(2) .hover-effect:after {
    background-color: rgba(185, 129, 138, 0.2);
}

.team-list .team-member:nth-child(3) .hover-effect,
.team-list .team-member:nth-child(3) .hover-effect:before,
.team-list .team-member:nth-child(3) .hover-effect:after {
    background-color: rgba(21, 51, 64, 0.2);
}

.team-list .team-member:nth-child(4) .hover-effect,
.team-list .team-member:nth-child(4) .hover-effect:before,
.team-list .team-member:nth-child(4) .hover-effect:after {
    background-color: rgba(255, 154, 96, 0.2);
}

.team-list .team-member:nth-child(5) .hover-effect,
.team-list .team-member:nth-child(5) .hover-effect:before,
.team-list .team-member:nth-child(5) .hover-effect:after {
    background-color: rgba(255, 96, 114, 0.2);
}

.team-list .team-member:nth-child(6) .hover-effect,
.team-list .team-member:nth-child(6) .hover-effect:before,
.team-list .team-member:nth-child(6) .hover-effect:after {
    background-color: rgba(251, 33, 167, 0.2);
}

.team-list .team-member:nth-child(7) .hover-effect,
.team-list .team-member:nth-child(7) .hover-effect:before,
.team-list .team-member:nth-child(7) .hover-effect:after {
    background-color: rgba(255, 20, 119, 0.2);
}

.team-list .team-member:nth-child(8) .hover-effect,
.team-list .team-member:nth-child(8) .hover-effect:before,
.team-list .team-member:nth-child(8) .hover-effect:after {
    background-color: rgba(154, 142, 132, 0.2);
}

.team-list .team-member:nth-child(9) .hover-effect,
.team-list .team-member:nth-child(9) .hover-effect:before,
.team-list .team-member:nth-child(9) .hover-effect:after {
    background-color: rgba(255, 152, 56, 0.2);
}

.team-list .team-member:nth-child(10) .hover-effect,
.team-list .team-member:nth-child(10) .hover-effect:before,
.team-list .team-member:nth-child(10) .hover-effect:after {
    background-color: rgba(145, 91, 48, 0.2);
}

.team-list .team-member:nth-child(11) .hover-effect,
.team-list .team-member:nth-child(11) .hover-effect:before,
.team-list .team-member:nth-child(11) .hover-effect:after {
    background-color: rgba(150, 163, 48, 0.2);
}

.team-list .team-member:nth-child(12) .hover-effect,
.team-list .team-member:nth-child(12) .hover-effect:before,
.team-list .team-member:nth-child(12) .hover-effect:after {
    background-color: rgba(243, 151, 60, 0.2);
}

.team-list .team-member:nth-child(13) .hover-effect,
.team-list .team-member:nth-child(13) .hover-effect:before,
.team-list .team-member:nth-child(13) .hover-effect:after {
    background-color: rgba(45, 160, 117, 0.2);
}

.team-list .team-member:nth-child(14) .hover-effect,
.team-list .team-member:nth-child(14) .hover-effect:before,
.team-list .team-member:nth-child(14) .hover-effect:after {
    background-color: rgba(246, 78, 65, 0.2);
}

.team-list .team-member:nth-child(15) .hover-effect,
.team-list .team-member:nth-child(15) .hover-effect:before,
.team-list .team-member:nth-child(15) .hover-effect:after {
    background-color: rgba(255, 101, 126, 0.2);
}

.team-list .team-member img {
    width: 100%;
    height: 100%;
    border-radius: 50%;
    transition: 0.4s;
}

.team-list .team-member:nth-child(odd) {
    transform: translateY(-100%);
}

.team-list .team-member:nth-child(even) {
    transform: translateY(100%);
}

.team-list .team-member:hover img {
    transform: scale(1.2);
}

.team-list .team-member:hover .hover-effect {
    width: 125%;
    height: 125%;
    top: -12.5%;
    left: -12.5%;
    border-radius: 40%;
    animation: hoverRotation 3s infinite linear;
}

.team-list .team-member:hover .hover-effect:before {
    animation: hoverRotation2 3s infinite linear;
}

.team-list .team-member:hover .hover-effect:after {
    animation: hoverRotation3 1.5s infinite linear;
}

@keyframes hoverRotation {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}

@keyframes hoverRotation2 {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(-360deg);
    }
}

@keyframes hoverRotation3 {
    0% {
        transform: rotate(0deg);
    }

    100% {
        transform: rotate(360deg);
    }
}