﻿   .tab{display:flex;list-style:none;cursor:pointer;flex-wrap:wrap;margin:auto}
.tab li{flex:1;text-align:center;margin-right:2%;background:#f1f1f1;transition:all 0.3s}
.tab li:last-child{margin-right:0}
.tab-content{margin:auto;background:#fff;padding:30px;min-height:120px}
.tab-content>div{display:none;animation:fadeIn 0.3s ease}
.tab-content>div.active{display:block}
@keyframes fadeIn{from{opacity:0;transform:translateY(5px)}
to{opacity:1;transform:translateY(0)}
}.video_title{position:relative;text-align:center}
.video_title .video_title_one{font-family:'Segma-Medium';font-weight:bold;letter-spacing:1px;position:relative;z-index:1;display:inline-block;font-size:48px;color:#111111;line-height:60px;padding:0 44px;background:#fff}
.video_title::before{position:absolute;content:'';left:0;top:31px;height:1px;width:100%;background:#cccccc}
.item_bottom{position:absolute;bottom:-100%;width:100%;background:transparent;border-radius:50%;display:flex;align-items:flex-start;justify-content:center;padding-top:30%;aspect-ratio:1;-webkit-transition:all 0.4s}
.item_title{font-family:'Segma-Medium';color:#fff;font-size:18px;line-height:40px;text-align:center;line-height:1.2}
.item_title img{display:none;opacity:0;height:0;max-width:23px}
.tab li{position:relative;width:217px;overflow:hidden}
.tab li .img{height:100%}
.tab li:hover .item_bottom{position:absolute;bottom:-40%;background:rgba(0,142,205,0.9);border-radius:50%}
.tab li:hover .item_title img{display:block;text-align:center;margin:20px auto 0;height:auto;opacity:1}
@media (max-width:1100px){.video_title .video_title_one{line-height:1.2;font-size:28px}
.tab li:hover .item_bottom{background:var(--color)}
.tab li{height:auto;background:var(--color);flex:unset;width:31.33%;margin-bottom:2%}
.tab li .img{display:none}
.tab li:hover .item_bottom,.tab li .item_bottom{position:unset}
}