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

.paging_wrap_admin{text-align:center; box-sizing:border-box; margin-top: 80px;}
.paging_wrap_admin ul.paging{display: flex; justify-content: center; font-size:0; gap:5px;}
.paging_wrap_admin ul.paging li{display:block; margin:0 2px; border-radius:50%; width:48px; height:48px;  border:none; vertical-align:middle; }
.paging_wrap_admin ul.paging li a{display:flex; align-items: center; justify-content: center; width: 100%; height: 100%;  font-size:16px; color:#222; line-height:45px; font-weight: 300;}
.paging_wrap_admin ul.paging li a img{display: block; }
.paging_wrap_admin ul.paging li a img.tab_img{display: none;}
.paging_wrap_admin ul.paging li a img.mob_img{display: none;}
.paging_wrap_admin ul.paging li.on{background: #222;}
.paging_wrap_admin ul.paging li.on a{color:#fff; font-weight: 300;}

/* custom_paging 페이징 관련 (story_visual)*/
/* paging */
.paging_wrap{text-align:center; box-sizing:border-box; margin-top: 95px;}
.paging_wrap ul{display: flex; justify-content: center; font-size:0; gap:13px;}
.paging_wrap ul li{display:block; border-radius:50%; width:36px; height:36px;  border:none; vertical-align:middle; }
.paging_wrap ul li a{display:flex; align-items: center; justify-content: center; width: 100%; height: 100%;  font-size:16px; color:#999;font-weight: 700;}
.paging_wrap ul li a img{display: block; }
.paging_wrap ul li.arr{width: auto;}
.paging_wrap ul li.prev{margin-right: 40px;}
.paging_wrap ul li.next{margin-left: 40px;}
.paging_wrap ul li.on{background: #fec83e;}
.paging_wrap ul li.on a{color:#fff; }


@media screen and (max-width:1400px) {
.paging_wrap{text-align:center; box-sizing:border-box; margin-top: 45px;}
.paging_wrap ul{display: flex; justify-content: center; font-size:0; gap:8px;}
.paging_wrap ul li{display:block; border-radius:50%; width:28px; height:28px;  border:none; vertical-align:middle; }
.paging_wrap ul li a{display:flex; align-items: center; justify-content: center; width: 100%; height: 100%;  font-size:13px; color:#999;font-weight: 700;}
.paging_wrap ul li a img{display: block; }
.paging_wrap ul li.arr{width: auto;}
.paging_wrap ul li.arr img{display: block;}
.paging_wrap ul li.prev{margin-right: 30px;}
.paging_wrap ul li.prev img{width: 6px;}
.paging_wrap ul li.next{margin-left: 30px;}
.paging_wrap ul li.next img{width: 7px;}
.paging_wrap ul li.on{background: #fec83e;}
.paging_wrap ul li.on a{color:#fff; }
}


@media screen and (max-width:767px) {
.paging_wrap{text-align:center; box-sizing:border-box; margin-top: 45px;}
.paging_wrap ul{display: flex; justify-content: center; font-size:0; gap:6px;}
.paging_wrap ul li{display:block; border-radius:50%; width:20px; height:20px;  border:none; vertical-align:middle; }
.paging_wrap ul li a{display:flex; align-items: center; justify-content: center; width: 100%; height: 100%;  font-size:11px; color:#999;font-weight: 700;}
.paging_wrap ul li a img{display: block; }
.paging_wrap ul li.arr{width: auto;}
.paging_wrap ul li.arr img{display: block;}
.paging_wrap ul li.prev{margin-right: 20px;}
.paging_wrap ul li.prev img{width: 5px;}
.paging_wrap ul li.next{margin-left: 20px;}
.paging_wrap ul li.next img{width: 6px;}
.paging_wrap ul li.on{background: #fec83e;}
.paging_wrap ul li.on a{color:#fff; }
}