.menuParent{border:1px solid #e0e0e0;position:relative;z-index:0;background:#fff;margin-bottom:12px}
.menuParent .item .className{font-size:14px;font-weight:700;color:#3369aa;padding:12px;border-bottom:1px solid #e0e0e0;position:relative;overflow:hidden;display:flex;align-items:center;column-gap:12px;justify-content:space-between}
.menuParent .item:last-child .subjectName{border-bottom:none}
@keyframes bayRa{
0%{right:-36px}
70%{right:7px}
100%{right:12px}
}
.menuParent.loadingMenu .item:hover .menuChild{display:block}
.menuParent .item .className:hover{color:#f2743e}
.menuParent .item .className::after{content:"";width:17px;height:70%;position:absolute;right:-36px;top:10px;background:no-repeat top left url(../../../themes/images/logo-icon-ts247.png);background-size:contain}
.menuParent .item:hover .className{color:#f2743e}
.menuParent .item:hover .className::after{animation:bayRa .2s forwards}
.menuParent .item:hover .className .icon{display:none}
.menuParent .item:hover .className{background:linear-gradient(88deg,transparent 77%,#167fc561 116%,#167fc882)}
.menuParent .menuChild{background:#fff;position:absolute;width:853px;height:calc(100% + 2px);top:-1px;left:298px;z-index:2;padding:12px 12px 12px 16px;border:1px solid #e0e0e0;box-sizing:border-box;border-left:8px solid #3f77b8;display:none}
.menuParent .titleClass{font-weight:700;margin-bottom:10px;display:flex;align-items:center;gap:10px}
.menuParent .titleClass img{width:35px;display:block}
.menuParent .titleVideo{color:#4666a6}
.menuParent .titleLive{color:#a03a3a}
.menuParent .subjectsMenu{display:flex;flex-wrap:wrap;row-gap:16px;column-gap:12px;margin-bottom:12px}
.menuParent .wrapSubject{width:calc(33.33% - 18px);padding:5px;border-radius:5px}
.menuParent .item.fourColurm .subjectsMenu a{width:calc(25% - 19px)}
.menuParent .wrapSubject:hover{background:linear-gradient(to bottom,#fff,#f1f1f1);transition:all .3s}
.menuParent .wrapSubject .subjectName .viewMore{font-size:11px;color:#f2743e;text-align:right;font-weight:500;transition:all .2s;font-style:normal;display:none}
.menuParent .wrapSubject:hover .subjectName .viewMore{display:block}
.menuParent .subjectsMenu .subjectName{font-size:14px;font-weight:700;display:flex;align-items:center;column-gap:9px;margin-bottom:2px;color:#666}
.menuParent .subjectsMenu .subjectName.exam{align-items:flex-start;margin-bottom:0}
.menuParent .listTeacher{display:flex;flex-wrap:wrap;row-gap:5px;column-gap:5px;position:relative}
.menuParent .listTeacher span{color:#aaa}
.teacherName{font-size:11px;padding:5px;box-shadow:0 0 2px 1px #0202021a;margin-top:50px}
.menuParent .flexWrapColumn{display:flex;flex-direction:column;row-gap:12px}
.menuParent .flexWrapColumn>div{border-bottom:1px dashed #e5e5e5}
.menuParent .flexWrapColumn>div:last-child{border-bottom:none}
.className{animation:lacLu infinite}
.menuParent .icon{display:block}
.menuParent .icon.md{width:33px;height:17px}
.menuParent .icon.lg{width:24px;height:24px}
.menuParent .iconHot{background:url(../images/icon-hot-red.png) top/contain no-repeat}
.menuParent .iconNew{background:url(../images/icon-new-green.png) top/contain no-repeat}
.menuParent .iconFilm{background:url(../img/icon-film.png) top/contain no-repeat}
.menuParent .iconLive{background:url(../img/icon-live.png) top/contain no-repeat}
@keyframes toLeft{
0%{transform:translateX(0)}
100%{transform:translateX(-5px);filter:opacity(.6)}
}
@keyframes nhapNhay{
0%{filter:brightness(1)}
100%{filter:brightness(1.7)}
}
.menuParent .icon.effectToLeft{animation:toLeft 1s alternate-reverse infinite}
.menuParent .icon.iconNew{animation:nhapNhay 1s steps(2) infinite}
.menuParent .icon-menu-live-flip{margin-left:0}