@charset "UTF-8";

#section_2{width:100%; overflow:hidden;}
#section_2 .box{width:calc(100% / 2); float:left; position:relative;}
#section_2 .box .img{width:100%; position:relative;}
#section_2 .box:hover .img::after{content:""; width:100%; height:100%; position:absolute; top:0; left:0; background:rgba(0,0,0,0.5); z-index:9;}
/*#section_2 .box .img:hover::after{content:"1"; width:100%; height:100%; position:absolute; top:0; left:0; background:rgba(255,255,255,0.7); z-index:9;}*/
#section_2 .box .img img{width:100%; height:auto;}
#section_2 .box .txt{width:100%; height:100%; display:none; position:absolute; top:0; left:0; z-index:10; color:white; font-size:20px; font-weight:600; text-align:center;}
#section_2 .box:hover .txt{display:flex; justify-content:center; align-items:center;}

#section_3{width:100%; overflow:hidden;}
#section_3 .box{width:calc(100% / 3); float:left; position:relative;}
#section_3 .box .img{width:100%; position:relative;}
#section_3 .box:hover .img::after{content:""; width:100%; height:100%; position:absolute; top:0; left:0; background:rgba(0,0,0,0.5); z-index:9;}
/*#section_3 .box .img:hover::after{content:"1"; width:100%; height:100%; position:absolute; top:0; left:0; background:rgba(255,255,255,0.7); z-index:9;}*/
#section_3 .box .img img{width:100%; height:auto;}
#section_3 .box .txt{width:100%; height:100%; display:none; position:absolute; top:0; left:0; z-index:10; color:white; font-size:20px; font-weight:600; text-align:center;}
#section_3 .box:hover .txt{display:flex; justify-content:center; align-items:center;}

#section_4{width:100%; overflow:hidden;}
#section_4 .box{width:calc(100% / 4); float:left; position:relative;}
#section_4 .box .img{width:100%; position:relative;}
#section_4 .box:hover .img::after{content:""; width:100%; height:100%; position:absolute; top:0; left:0; background:rgba(0,0,0,0.5); z-index:9;}
/*#section_4 .box .img:hover::after{content:"1"; width:100%; height:100%; position:absolute; top:0; left:0; background:rgba(255,255,255,0.7); z-index:9;}*/
#section_4 .box .img img{width:100%; height:auto;}
#section_4 .box .txt{width:100%; height:100%; padding:0 5%; box-sizing:border-box; display:none; position:absolute; top:0; left:0; z-index:10; color:white; font-size:20px; line-height:30px; font-weight:600; text-align:center;}
#section_4 .box:hover .txt{display:flex; justify-content:center; align-items:center;}

#section_4_c{width:100%; overflow:hidden;}
#section_4_c .box{width:calc(100% / 4); float:left; position:relative;}
#section_4_c .box .img{width:100%; padding-bottom:83%; position:relative; display:flex; justify-content:center; align-items:center;}
#section_4_c .box:hover .img::after{content:""; width:100%; height:100%; position:absolute; top:0; left:0; background:rgba(0,0,0,0.5); z-index:9;}
/*#section_4_c .box .img:hover::after{content:"1"; width:100%; height:100%; position:absolute; top:0; left:0; background:rgba(255,255,255,0.7); z-index:9;}*/
#section_4_c .box .img img{width:46%; height:auto; position:absolute; top:0; bottom:0; left:0; right:0; margin:auto;}
#section_4_c .box .txt{width:100%; height:100%; padding:0 5%; box-sizing:border-box; display:none; position:absolute; top:0; left:0; z-index:10; color:white; font-size:20px; line-height:30px; font-weight:600; text-align:center;}
#section_4_c .box:hover .txt{display:flex; justify-content:center; align-items:center;}

@media screen and (min-width:1024px) and (max-width:1279px){
	#section_2 .box .txt{font-size:18px; line-height:26px;}
	
	#section_3 .box .txt{font-size:18px; line-height:26px;}
	
	#section_4 .box .txt{font-size:18px; line-height:26px;}
	
	#section_4_c .box .txt{font-size:18px; line-height:26px;}
}

@media screen and (min-width:720px) and (max-width:1023px){
	#section_2 .box:hover .img::after{display:none;}
	#section_2 .box .txt{width:100%; height:auto; font-size:15px; line-height:22px; padding:12px 8px; position:relative; display:flex; justify-content:center; align-items:center; color:white;}
	
	#section_3 .box:hover .img::after{display:none;}
	#section_3 .box .txt{width:100%; height:auto; font-size:15px; line-height:22px; padding:12px 8px; position:relative; display:flex; justify-content:center; align-items:center; color:white;}

	#section_4 .box{width:calc(100% / 2);}
	#section_4 .box:hover .img::after{display:none;}
	#section_4 .box .txt{width:100%; height:auto; font-size:15px; line-height:22px; padding:12px 8px; position:relative; display:flex; justify-content:center; align-items:center; color:white;}

	#section_4_c .box{width:calc(100% / 2);}
	#section_4_c .box:hover .img::after{display:none;}
	#section_4_c .box .img{padding:12px 0 0 0;}
	#section_4_c .box .img img{max-width:180px; width:46%; height:auto; position:relative;}
	#section_4_c .box .txt{width:100%; height:auto; font-size:15px; line-height:22px; padding:12px 8px; position:relative; display:flex; justify-content:center; align-items:center; color:white;}
}

@media screen and (max-width:719px){
	#section_2 .box{width:calc((100% - 5px) / 2); margin-right:5px; margin-top:10px;}
	#section_2 .box:nth-child(2n){margin-right:0;}
	#section_2 .box:nth-child(1),#section_2 .box:nth-child(2){margin-top:0;}
	#section_2 .box:hover .img::after{display:none;}
	#section_2 .box .txt{width:100%; height:auto; font-size:14px; line-height:20px; padding:12px 5px; position:relative; display:flex; justify-content:center; align-items:center; color:white; letter-spacing:-0.5px;}
	
	#section_3 .box{width:calc((100% - 5px) / 2); margin-right:5px; margin-top:10px;}
	#section_3 .box:nth-child(2n){margin-right:0;}
	#section_3 .box:nth-child(1),#section_3 .box:nth-child(2){margin-top:0;}
	#section_3 .box:hover .img::after{display:none;}
	#section_3 .box .txt{width:100%; height:auto; font-size:14px; line-height:20px; padding:12px 5px; position:relative; display:flex; justify-content:center; align-items:center; color:white; letter-spacing:-0.5px;}
	
	#section_4 .box{width:calc((100% - 5px) / 2); margin-right:5px; margin-top:10px;}
	#section_4 .box:nth-child(2n){margin-right:0;}
	#section_4 .box:nth-child(1),#section_4 .box:nth-child(2){margin-top:0;}
	#section_4 .box:hover .img::after{display:none;}
	#section_4 .box .txt{width:100%; height:auto; font-size:14px; line-height:20px; height:auto; max-height:40px; padding:0 5px; margin:12px 0; position:relative; color:white; letter-spacing:-0.5px; overflow:hidden; text-overflow:ellipsis; word-wrap:break-word; white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
	#section_4 .box:hover .txt{display:-webkit-box; justify-content:none; align-items:none;}
	
	#section_4_c .box{width:calc((100% - 5px) / 2); margin-right:5px; margin-top:10px;}
	#section_4_c .box:nth-child(2n){margin-right:0;}
	#section_4_c .box:nth-child(1),#section_4_c .box:nth-child(2){margin-top:0;}
	#section_4_c .box:hover .img::after{display:none;}
	#section_4_c .box .img{padding:12px 0 0 0;}
	#section_4_c .box .img img{width:46%; height:auto; position:relative;}
	#section_4_c .box .txt{width:100%; height:auto; font-size:14px; line-height:20px; height:auto; max-height:40px; padding:0 5px; margin:12px 0; position:relative; color:white; letter-spacing:-0.5px; overflow:hidden; text-overflow:ellipsis; word-wrap:break-word; white-space:normal; display:-webkit-box; -webkit-line-clamp:2; -webkit-box-orient:vertical;}
	#section_4_c .box:hover .txt{display:-webkit-box; justify-content:none; align-items:none;}
}