@CHARSET "UTF-8";
/* 
    Document   : boardListB.css
    Created on : 2015. 8. 25, 오전 9:40:43
    Author     : hyunho
    Description: 게시판 목록 템플릿 css 기술  
*/

.pagination > li > a {position: relative; display:inline-block; width:40px; height:40px; line-height:40px; vertical-align: middle; padding:0; margin:0 2px; color:#337ab7; text-decoration: none; background-color:#fff; border: 1px solid #ddd;}

/********************************
 갤러리
 *******************************/
 
.glr_box {margin-top:30px;}
.glr_box ul {display:flex; flex-wrap:wrap; gap:40px;}
.glr_box li {width:calc(33.3333% - 27px);}

.glr_box li {padding:1px; border-color:transparent; border-radius:20px; background-image:linear-gradient(#fff, #fff),linear-gradient(#ccc 0%,#ccc 100%); background-origin:border-box; background-clip:content-box,border-box; box-sizing:border-box; transition:all 0.2s linear;}
.glr_box li:hover,
.glr_box li:active,
.glr_box li:focus {border-width:0; border-color:transparent; background-origin:border-box; background-image:linear-gradient(#fff, #fff), linear-gradient(135deg, #3c62c0 100%); background-clip:content-box, border-box;}
.glr_box li a {display:block; height:100%; border-radius:10px;}
.glr_box li a:hover,
.glr_box li a:active,
.glr_box li a:focus {text-decoration:none;}
.glr_box li a .glr_img {overflow:hidden; display:block; width:100%; height:220px; background-color:#ebebeb; border-top-left-radius:20px; border-top-right-radius:20px;}
.glr_box li a .glr_img img {width:100%; height:100%; border-top-left-radius:20px; border-top-right-radius:20px; transition:.3s; object-fit:cover;}
.glr_box li a:hover .glr_img img {transform: scale(1.1);}

.glr_box li a .img_tbox {padding:20px;}

.glr_box li a .glr_tit {position:relative;/* display:block; */font-size:1.6rem;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp: 3;}
.glr_box li a:hover .glr_tit,
.glr_box li a:active .glr_tit,
.glr_box li a:focus .glr_tit {color:#3c62c0;} 
.glr_box li a .glr_txt {position:relative; display:block; font-size:1.6rem; overflow:hidden; text-overflow:ellipsis; display:-webkit-box; -webkit-box-orient:vertical; -webkit-line-clamp:2;}

.glr_box li a .glr_date {display:block; position:relative; font-family:'Montserrat'; font-size:1.6rem; color:#4e4e4e; padding-left:30px; background:url(/fira/images/egovframework/story/web/layout/ico_date.svg) no-repeat 0 2px; background-size:20px auto;}


/* media query */
@media screen and (max-width:1400px){
	.glr_box li a .glr_img {height:230px;}
}

@media screen and (max-width:1200px){
	.glr_box li a .glr_img {height:195px;}
}

@media screen and (max-width:1024px){
	.glr_box li {width:calc(50% - 20px);}
	.glr_box li a .glr_img {height:319px;}
	
}

@media screen and (max-width:920px){ 
	.glr_box li a .glr_img {height:295px;}
}

@media screen and (max-width:767px){
	.glr_box ul {gap:30px;}
	.glr_box li {width:calc(50% - 15px);}
	.glr_box li a .glr_img {height:255px;}
}

@media screen and (max-width:640px){
	.glr_box li a .glr_img {height:210px;}
	.glr_box li a .glr_tit {font-size:1.8rem;}
}

@media screen and (max-width:480px){
	.glr_box li {width:100%;}
	.glr_box li a .glr_img {height:auto; min-height:200px;}
}