.jjne{
 --jjne-blue:#0D32A3;
 --jjne-text:#333;
 --jjne-bg:#fff;
 width:100vw;
 margin-left:calc(50% - 50vw);
 margin-right:calc(50% - 50vw);
 background:var(--jjne-bg);
 color:var(--jjne-text);
 font-family:Arial,Helvetica,sans-serif;
}
.jjne *{box-sizing:border-box}
.jjne a{text-decoration:none}

.jjne-banner{
 min-height:180px;
 background:#18345D center/cover no-repeat;
 display:flex;
 align-items:center;
 justify-content:center;
 text-align:center;
 color:#fff;
}
.jjne-banner-inner{width:min(1180px,calc(100% - 40px));margin:auto}
.jjne-banner h1{margin:0;font-size:34px;font-weight:800}
.jjne-banner p{max-width:820px;margin:12px auto 0;color:rgba(255,255,255,.82);font-size:15px}

.jjne-news-wrap{
 width:min(1180px,calc(100% - 40px));
 margin:auto;
 padding:44px 0 70px;
}
.jjne-grid-title{
 margin:0 0 28px;
 font-size:28px;
 color:var(--jjne-text);
}
.jjne-grid{
 display:grid;
 grid-template-columns:repeat(3,1fr);
 gap:24px 20px;
}
.jjne-card{position:relative}
.jjne-image{
 display:block;
 height:220px;
 overflow:hidden;
 border-radius:4px 4px 0 0;
 background:#eef2f6;
}
.jjne-image img{
 width:100%;
 height:100%;
 object-fit:cover;
 transition:transform .45s ease;
}
.jjne-card:hover .jjne-image img{transform:scale(1.04)}
.jjne-placeholder{
 height:100%;
 display:flex;
 align-items:center;
 justify-content:center;
 background:#E9EFF4;
 color:#9AA7B1;
}
.jjne-box{
 position:relative;
 width:92%;
 margin:-24px auto 0;
 padding:18px 17px 16px;
 min-height:225px;
 background:#fff;
 border:1px solid #ddd;
 border-radius:4px;
}
.jjne-box h3{
 margin:0 0 9px;
 font-size:18px;
 line-height:1.18;
 font-weight:800;
}
.jjne-box h3 a{color:#454545}
.jjne-date{font-size:13px;color:#777;margin-bottom:8px}
.jjne-box p{margin:0 0 14px;font-size:14px;line-height:1.5;color:#666}
.jjne-read{
 display:inline-flex;
 gap:12px;
 align-items:center;
 background:var(--jjne-blue);
 color:#fff;
 padding:9px 14px;
 font-size:12px;
 font-weight:800;
}
.jjne-empty{
 grid-column:1/-1;
 padding:34px;
 border:1px dashed #bbb;
 color:#777;
}

@media(max-width:1024px){
 .jjne-grid{grid-template-columns:repeat(2,1fr)}
}
@media(max-width:767px){
 .jjne-banner{min-height:150px}
 .jjne-banner h1{font-size:28px}
 .jjne-news-wrap{width:calc(100% - 28px);padding:32px 0 55px}
 .jjne-grid{grid-template-columns:1fr}
 .jjne-image{height:245px}
 .jjne-box{width:92%;min-height:auto}
}