.utilities {
    /* position: absolute;
    bottom: 0;
    left: 50%; */
    transform: translate(0%, 15%);
    width: 800px;
    height: 800px;
    /* z-index: 100; */
    border: 0.5px solid #272727;
    border-radius: 50%;
    margin: auto;
}

.utilities .group_content {
    position: fixed;
    left: 50%;
    top: 30%;
    max-width: 400px;
    transform: translate(-50%, -50%);
}

.utilities .item {
    position: absolute;
}

.utilities .item.item-0 {
    left: 50%;
    top: 0;
}

.utilities .item.item-1 {
    left: 75%;
    top: 7%;
}

.utilities .item.item-2 {
    left: 96%;
    top: 30%;
}

.utilities .item.item-3 {
    left: 4%;
    top: 30%;
}

.utilities .item.item-4 {
    left: 25%;
    top: 7%;
}

.utilities .icon-utility {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    width: 112px;
    height: 112px;
    background-color: #272727;
    box-shadow: 7px 9px 27px rgb(39 39 39 / 32%);
    border-radius: 50%;
    border: 12px solid var(--cl-main);
    transition: var(--transition);
    cursor: pointer;
}

.utilities .icon-utility::before {
    content: '';
    display: block;
    width: 100%;
    height: 100%;
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);

}

.utilities .icon-utility img {
    position: absolute;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
    max-width: 75px;
    max-height: 75px;
    object-fit: contain;
    transition: var(--transition);
}

.utilities .icon-utility:hover,
.utilities .icon-utility.active {
    /* background-color: #d9eaff; */
    border-color: #21518c;
}

.utilities .icon-utility .icon_active {
    opacity: 0;
}

.utilities .icon-utility:hover .icon,
.utilities .icon-utility.active .icon {
    opacity: 0;
}

.utilities .icon-utility:hover .icon_active,
.utilities .icon-utility.active .icon_active {
    opacity: 1;
}

.utilities .name {
    position: absolute;
    top: 117px;
    line-height: 18px;
    white-space: nowrap;
    margin: 0;
    transition: var(--transition);
}

.utilities .item.item-0 .name {
    left: 50%;
    transform: translateX(-50%);
    text-align: center;
    transition: all 0.5s;
}

.utilities .name{
    color: #272727;
    margin-top: 15px !important;
}

.utilities .item.item-1 .name {
    left: 50%;
    transform: translateX(-50%);
    transition: all 0.5s;
}

.utilities .item.item-2 .name {
    right: 60px;
    transition: all 0.5s;
}

.utilities .item.item-3 .name {
    left: 60px;
    transition: all 0.5s;
}

.utilities .item.item-4 .name {
    left: 50%;
    transform: translateX(-50%);
    transition: all 0.5s;
}

.utilities .icon-utility:hover .name,
.utilities .icon-utility.active .name {
    font-size: 25px;
    color: var(--mauchudao1);
}

.utilities .content{
    color: #272727;
}

/*Lịch sử hình thành*/

.about3_items {
    margin-top: 40px;
}

.about3_items .wrap-sliders .slick-list {
    padding-bottom: 25px !important;
}

.about3_items .content {
    color: rgb(39, 39, 39);
    text-align: justify;
}

.about3_items .item>.inner {
    position: relative;
    flex-direction: column;
}

.about3_items .slick-slide:nth-child(even)>.inner {
    flex-direction: column-reverse;
}

.about3_items .slick-slide:nth-child(even) .wrap-content,
.about3_items .slick-slide:nth-child(odd) .img {
    margin-bottom: 60px;
}

.display-flex{
    display: flex;
    flex-wrap: wrap;
}

.about3_items .wrap-content {
    padding: 0 15px;
    height: 178px;
}

.about3_items .wrap-content .year {
    line-height: 40px;
    margin-bottom: 15px;
    font-size: 40px;
    font-weight: bold;
}

.about3_items .wrap-sliders:before {
    position: absolute;
    width: 67%;
    background-color: #af946c;
    top: 203px;
    bottom: 0px;
    left: 17%;
    margin-left: -3px;
    height: 1px;
    content: '';
}

.slick-disabled{
    opacity: 0!important;
}

/* .about3_items .img {
    box-shadow: 16px 9px 20px rgb(94 94 94 / 25%);
    border-radius: 20px;
} */

.about3_items img {
    width: 260px;
    height: 170px;
    border-radius: 20px;
    margin: auto;
}

.about3_items .item>.inner:before {
    content: '';
    display: block;
    position: absolute;
    left: 50%;
    top: 203px;
    transform: translate(-50%, -50%);
    width: 20px;
    height: 20px;
    border: 1px solid var(--mauchudao1);
    background-color: #e0e6ee;
    border-radius: 50%;
    transition: .4s all ease-in-out;
}

.about3_items .slick-current.item>.inner:before{
    width: 26px;
    height: 26px;
}

.about3_items .slick-current .item>.inner::before {
    width: 40px;
    height: 40px;
    border: 1px solid #225085;
}

.about3_items .item>.inner:after {
    content: '';
    display: block;
    position: absolute;
    left: 50%;
    top: 203px;
    transform: translate(-50%, -50%);
    width: 0;
    height: 0;
    background-color: var(--mauchudao1);
    border-radius: 50%;
    transition: .4s all ease-in-out;;
}

.about3_items .slick-current.item>.inner:after {
    width: 15px;
    height: 15px;
}

.slick-arrow.arrow.prev {
    top:40%;
    position: absolute;
    z-index: 2;
    cursor: pointer;
}

.slick-arrow.arrow.next {
    position: absolute;
    top:40%;
    cursor: pointer;
}

.arrow_style_ab span{
    /* width: 24px;
    height: 33px;
    background: url(https://newtecons.vn/wp-content/themes/canhcam/images/arrow_style_ab.png) center no-repeat;
    background-size: 100%;
    position: absolute; */
    color: var(--mauchudao1);
    font-size: 45px;
}   

.arrow_style_ab.slick-arrow.arrow.prev span{
    /* transform: scaleX(-1); */
}

.slick-arrow.arrow.next span{
    position: absolute;
    right: 0;
}

.slick-arrow.arrow.prev span{
    position: absolute;
    left: 0;
}