@import url('sub.css'); 




.event_list {display:flex; flex-wrap:wrap; gap:30px; justify-content:center}
.event_list dl {position:relative; z-index:10; flex:0 0 calc((100% - 60px) / 3);}
.event_list dl::after {content:''; width:100%; height:100%; border:1px solid var(--border); box-sizing:border-box; position:absolute; top:0; left:0; z-index:-1;}
.event_list dl dt {overflow: hidden; aspect-ratio: 430 / 273;}
.event_list dl dt img {display: block; width: 100%; height: 100%; object-fit: cover;}
.event_list dl dd {padding:20px 20px 25px; box-sizing:border-box; text-align:center;}




/*******************************************************************************
	@media ~1500px
*******************************************************************************/
@media all and (max-width:1500px) { 


}
/*******************************************************************************
	@media ~1300px
*******************************************************************************/
@media all and (max-width:1300px) { 


}
/*******************************************************************************
	@media 769~980px
*******************************************************************************/
@media all and (max-width:980px) { 


.event_list {gap:20px; }
.event_list dl { flex:0 0 calc((100% - 20px) / 2);}


}
/*******************************************************************************
	@media 481~680px
*******************************************************************************/
@media all and (max-width:680px) { 

.event_list {gap:15px; }
.event_list dl { flex:0 0 100%;}
.event_list dl dd {padding:15px;}



}