.articles-container{align-items:center;display:flex;gap:90px}.articles-image{background-color:#1e88e5;border-radius:20px;height:375px;opacity:0;overflow:hidden;transform:translateX(-50px);width:500px}.articles-container.animate .articles-image{animation:fadeSlideLeft .7s ease-out forwards}.articles-image img{height:100%;object-fit:cover;width:100%}.articles-content{display:flex;flex:1;flex-direction:column}.articles-list{display:grid;flex:1;grid-template-columns:1fr 1fr;position:relative;scroll-behavior:smooth}.articles-title{font-size:42px;margin-bottom:12px}.articles-desc,.articles-title{color:#101010;display:block;opacity:0}.articles-desc{font-size:16px;margin-bottom:27px}.articles-container.animate .articles-desc,.articles-container.animate .articles-title{animation:fadeSlideLeft .7s ease-out forwards}.articles-container.animate .articles-desc{animation-delay:.3s}.articles-list::-webkit-scrollbar{width:8px}.articles-list::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.articles-list::-webkit-scrollbar-thumb{background:#888;border-radius:4px}.articles-list::-webkit-scrollbar-thumb:hover{background:#555}.articles-list-item{background-color:transparent!important;cursor:pointer;margin-right:20px;opacity:0}.articles-container.animate .articles-list-item{animation:slideUpFadeIn 1s ease-out .6s forwards}.articles-container.animate .articles-list-item:first-child{animation-delay:.4s}.articles-container.animate .articles-list-item:nth-child(2){animation-delay:.6s}.articles-container.animate .articles-list-item:nth-child(3){animation-delay:.8s}.articles-container.animate .articles-list-item:nth-child(4){animation-delay:1s}.articles-container.animate .articles-list-item:nth-child(5){animation-delay:1.2s}.articles-container.animate .articles-list-item:nth-child(6){animation-delay:1.4s}.articles-container.animate .articles-list-item:nth-child(7){animation-delay:1.6s}.articles-container.animate .articles-list-item:nth-child(8){animation-delay:1.8s}.articles-container.animate .articles-list-item:nth-child(9){animation-delay:2s}.articles-container.animate .articles-list-item:nth-child(10){animation-delay:2.2s}.articles-container.animate .articles-list-item:nth-child(11){animation-delay:2.4s}.articles-container.animate .articles-list-item:nth-child(12){animation-delay:2.6s}.list-progress-row{align-items:center;display:flex;height:65px;padding:6px 0}.list-progress-title{color:rgba(7,7,7,.4);flex:1}.articles-list-item .list-content{display:none}.articles-list-item.active .list-content{display:flex}.articles-list-item.active .list-progress-title{color:#f3623c}.articles-list-item .list-content{justify-content:space-between;margin-bottom:30px;width:100%}.articles-list-item.active .list-progress{color:#070707}.list-content-left-title{display:block;font-size:20px;margin-bottom:20px;padding-left:10px}.list-content-left-list{display:flex;flex-direction:column;gap:20px}.list-content-left-list-item{align-items:center;display:flex;gap:20px}.list-content-right{align-items:flex-end;display:none;gap:10px;padding-right:10px}.articles-list-item:hover .list-progress-title{color:#000;font-weight:blod}.articles-list-item:hover .list-content-right{display:flex}.list-content-right-img{background-color:#1e88e5;border-radius:10px;height:146px;overflow:hidden;width:146px}.list-content-right-img img{height:100%;object-fit:cover;width:100%}.link-more-box{align-items:center;background-color:#3b5672;border-radius:3px;display:flex;height:48px;justify-content:center;width:48px}.list-progress{color:rgba(7,7,7,.4);font-size:20px}.progress-bar{background-color:hsla(0,0%,44%,.44);height:2px;position:relative;width:100%}.progress-bar:after{background-color:#3b5672;content:"";height:100%;left:0;position:absolute;transition:width .3s ease-in-out;width:var(--progress)}@media (max-width:1024px){.articles-container{flex-direction:column;gap:30px}.articles-image{align-self:center;height:400px;max-width:500px;width:100%}.articles-list{height:auto}}@media (max-width:768px){.articles-container{gap:25px;padding:15px}.articles-image{border-radius:16px;height:350px}.articles-list{gap:12px;grid-template-columns:1fr}.list-content-left-title{font-size:18px;margin-bottom:12px}.list-content-left-list-item{flex-direction:column;gap:10px;text-align:center}.list-content-right-img{max-width:150px}}@media (max-width:480px){.articles-title{font-size:26px}.articles-list{gap:0;grid-template-columns:1fr}.articles-container{gap:20px;padding:10px}.articles-image{border-radius:12px;height:250px}.articles-list-item{border-radius:10px;margin-right:0;padding:0}.list-progress-row{min-height:60px;padding:10px 0}.list-progress,.list-progress-title{font-size:16px}.list-content-left-title{font-size:16px;text-align:center}.list-content-left-list{gap:10px}.list-content-left-list-item{padding:10px;text-align:left}.list-content-right{gap:10px}.list-content-right-img{max-width:120px}.link-more-box{height:40px;width:40px}.progress-bar{height:3px}}