#articleInfo24 *{text-align:center}
#articleInfo24 .top{margin-bottom:10vw}
#articleInfo24 .item h2{font-size:36px;padding-bottom:10px;margin-bottom:30px;border-bottom:2px #eee solid;background:linear-gradient(90deg,var(--primary),var(--secondary));background-clip:text;-webkit-background-clip:text;color:transparent}
#articleInfo24 .item h3{font-size:26px;font-weight:500;letter-spacing:2px}
#articleInfo24 .item article{width:70%;margin:0 auto;padding:20px 0 50px}
#articleInfo24 .top .csr{display:grid;grid-template-columns:repeat(2,1fr);gap:70px;margin:50px 0;width:80%;margin:0 auto}
#articleInfo24 .top .csr .csr_box{background:#f5f5f5;outline:1px solid #888;outline-offset:10px}
#articleInfo24 .top .csr img{object-fit:cover;aspect-ratio:4/3}
#articleInfo24 .top .csr .csr_box .csr_text{padding:30px 40px}
#articleInfo24 .top .csr .csr_box .csr_text h5{font-size:26px;letter-spacing:2px}
#articleInfo24 .bottom .csr{display:grid;grid-template-columns:repeat(4,1fr);gap:30px}
#articleInfo24 .bottom .csr .csr_box{background:#f5f5f5;aspect-ratio:1/1;display:flex;justify-content:center;align-items:center;flex-direction:column}
#articleInfo24 .bottom .csr .csr_box:hover{transform:translate(0%,-4%)}
#articleInfo24 .bottom  .csr img{width:150px;object-fit:cover;aspect-ratio:1/1}
#articleInfo24 .bottom  .csr .csr_box .csr_text{padding:15px 10px 0}
#articleInfo24 .bottom  .csr .csr_box .csr_text h5{font-size:22px;letter-spacing:2px;font-weight:500}
#articleInfo24 .bottom .csr .csr_box:hover .csr_text h5{color:var(--secondary)}
@media screen and (max-width:1280px){
    #articleInfo24 .bottom .csr{grid-template-columns:repeat(3,1fr)}
}
@media screen and (max-width:1024px){
    #articleInfo24 .item article{width:100%}
    #articleInfo24 .top .csr{width:100%;gap:30px}
    #articleInfo24 .bottom .csr{grid-template-columns:repeat(2,1fr)}
}
@media screen and (max-width:768px){
    #articleInfo24 .top .csr{grid-template-columns:repeat(1,1fr)}
    #articleInfo24 .top .csr .csr_box{outline:none}
    #articleInfo24 .bottom .csr img{width:80px}
    #articleInfo24 .bottom .csr{grid-template-columns:repeat(1,1fr)}
    #articleInfo24 .bottom .csr .csr_box{width:80%;margin:0 auto}
}