/* 
* 커스텀 페이징 전용 CSS
* admin/lib/function.php - custom_paging() 함수 사용시 적용됨
*/



/* custom_paging 페이징 관련 (story_visual)*/
/* paging */
.paging_wrap{text-align:center; box-sizing:border-box; margin-top:70px;}
.paging_wrap:before, .paging_wrap:after{box-sizing:inherit;}
ul.paging{display:flex; justify-content: center; font-size:0;}
ul.paging li{display:inline-block; margin:0 5px; vertical-align:middle;}
ul.paging li img{vertical-align:middle; }
ul.paging li a{display:flex; align-items: center; justify-content: center; width:45px; height:45px; border:1px solid #eaeaea; font-size:16px; color:#5e5e5e;  background:#fff; line-height:45px; font-weight:400; border-radius:50%; overflow:hidden;}
ul.paging li.page_arrow a{line-height:43px;}
ul.paging li.on{background:none;}
ul.paging li.on a{color:#fff; border:1px solid #0066ab; background:#0066ab;}
ul.paging li:hover a {border:1px solid #0066ab;}


@media screen and (max-width:1024px) {
.paging_wrap{text-align:center; box-sizing:border-box; margin-top: 60px;}
ul.paging{display: flex; justify-content: center; font-size:0; gap:5px;}
ul.paging li{display:block; margin:0 2px; border-radius:50%; width:45px; height:45px;  border:none; vertical-align:middle; }
ul.paging li a{display:flex; align-items: center; justify-content: center; width: 100%; height: 100%;  font-size:14px; color:#222; line-height:43px; font-weight: 300;}
ul.paging li a img{display: block; }
ul.paging li a img.pc_img{display: none;}
ul.paging li a img.tab_img{display: block;}
ul.paging li a img.mob_img{display: none;}
ul.paging li.on{background: #222;}
ul.paging li.on a{color:#fff; font-weight: 300;}
}


@media screen and (max-width:767px) {
.paging_wrap{text-align:center; box-sizing:border-box; margin-top: 40px;}
ul.paging{display: flex; justify-content: center; font-size:0; gap:0px;}
ul.paging li{display:block; margin:0 2px; border-radius:50%; width:40px; height:40px;  border:none; vertical-align:middle; }
ul.paging li a{display:flex; align-items: center; justify-content: center; width: 100%; height: 100%;  font-size:12px; color:#222; line-height:38px; font-weight: 300;}
ul.paging li a img{display: block;}
ul.paging li a img.pc_img{display: none;}
ul.paging li a img.tab_img{display: none;}
ul.paging li a img.mob_img{display: block;}
ul.paging li.on{background: #222;}
ul.paging li.on a{color:#fff; font-weight: 300;}
}