@charset "UTF-8"; 

/********************************
 board set
 *******************************/

label, input, select, textarea {font-size:1.9rem; color:#444;}
select.bd_select {padding:0 30px 0 12px; width:100%; height:45px; line-height:45px; border:1px solid #ddd; background:#fff url(../images/select_arrow.png) right 11px center no-repeat; border-radius:8px;}
select.bd_select.wAuto {width:auto; min-width:200px;}
input.bd_input {display:block; width:100%; line-height:45px; border:1px solid #ddd;}
input.bd_input[type="text"] {border-radius:8px;}
input.bd_input.bdi_text {padding-left:5px;}
input.bd_input.bdi_ckbox,
input.bd_input.bdi_radio {width:auto; display:inline-block; margin-right:3px;}
input.bd_input.bdi_file {width:auto; display:inline-block; margin:2px 5px; line-height:inherit; border:none; font-size:1.4rem;}
textarea.bd_txtarea {resize:none; width:100%; border:1px solid #ddd;}
textarea.bd_txtarea.re_size {resize:auto;}

.essent {position:relative; display:inline-block; margin-left:3px; line-height:0; font-size:0;}
.essent:before {content:'*'; left:0; top:3px; line-height:1; font-size:2.0rem; color:#f24331 !important;}

@media screen and (max-width:1200px) {
}
@media screen and (max-width:1024px) {
}
@media screen and (max-width:920px) {/*텍스트 최소값 보정*/
}
@media screen and (max-width:767px) {
	label, input, select, textarea {font-size:1.7rem;}
	select.bd_select.wAuto {width:100%;}
}
@media screen and (max-width:640px) {
}
@media screen and (max-width:480px) {
	label, input, select, textarea {font-size:1.5rem;}
}




/********************************
 게시판 상단
 *******************************/
.board_topbox {position:relative; border:1px solid #e5e5e5; border-radius:10px; background-color:#f7f7fc;}
.boardtop_txtinner {position:relative; padding:25px 30px; margin:0 auto; width:70%;}
.boardtop_txtinner .t_txt {display:block; vertical-align:middle;}
.boardtop_txtinner .t_txt h4 {margin-top:0; color:#0b717b;}

.board_total strong {color:#d52604;}
.search_ctbox {position:relative; margin-bottom:10px;}
.search_ctbox:after {content:''; display:block; visibility:hidden; clear:both;}
.search_ctbox .src_list {padding-left:10px; float:left;}
.search_ctbox .src_list:first-child {padding-left:0;}
.search_ctbox.col_list4 .src_list {width:25%;}
.search_ctbox.col_list3 .src_list {width:33.33%;}
.search_ctbox.col_list2 .src_list {width:50%;}
.search_ctbox.col_list1 {margin-bottom:0;}
.search_ctbox.col_list1 .src_list {width:100%; margin-bottom:10px; padding-left:0;}
.search_ctbox .src_list select {padding:0 30px 0 12px; width:100%; border:1px solid #ddd; background:#fff url(../images/select_arrow.png) right 11px center no-repeat; border-radius:5px;}
.search_tbox {position:relative; padding:0 90px 0 160px;}
.search_listbox {position:absolute; left:0; top:0; width:150px;}
.search_listbox select {padding:0 30px 0 12px; width:100%; border:1px solid #ddd; background:#fff url(../images/select_arrow.png) right 11px center no-repeat; border-radius:5px;}
.search_txtbox {background-color:#fff;}
.search_txtbox input {display:block; width:100%; background-color:#fff; border-radius:5px;}
.search_btnbox {position:absolute; right:0; top:0; width:80px;}
.search_btnbox button {width:100%; height:45px; font-size:0; background:#333 url(../../../storyCms/bbs/images/icon_board_search.png) center center no-repeat; cursor:pointer; border-radius:5px;}
.search_btnbox button:hover,
.search_btnbox button:active,
.search_btnbox button:focus {background-color:#3c62c0; transition:background-color 0.2s linear;}

/*도시가스사용신청 안내*/
.search_ctbox.sech_list {border:none; margin-bottom:0; padding-bottom:0; padding-right:90px;}

/*서비스 안내/신청 > 요금납부안내 > 가스요금안내 > 요금단가 및 체계안내*/
.search_ctbox.sech_list .date_boxlist {display:flex; align-items:center; float:unset;}
.search_ctbox.sech_list .date_boxlist .lable {margin-right:20px; font-weight:500;}
.search_ctbox.sech_list .date_boxlist .dash {padding:0 20px;}

/*서비스 안내/신청 > 산업용고객서비스 > 에너지가격비교*/
.search_ctbox.sech_list.energyBox {}
.search_ctbox.sech_list.energyBox .src_list {width:auto;}
.search_ctbox.sech_list.energyBox .src_list.energy {justify-content:flex-start; width:auto;}
.search_ctbox.sech_list.energyBox .src_list.energy .date {display:flex;}
.search_ctbox.sech_list.energyBox .src_list.energy .date select {margin-left:5px; width:auto;}
.search_ctbox.sech_list.energyBox .src_list.energy .date select:first-child {margin-left:0;}

/*마이페이지 > 기업고객 > 원격검침*/
.search_ctbox.sech_list .date_boxlist.amrBox select.secSelect {margin-left:5px; width:auto;}



@media screen and (max-width:1400px) {
	/*서비스 안내/신청 > 산업용고객서비스 > 에너지가격비교*/
	.search_ctbox.sech_list.energyBox .src_list {}
	.search_ctbox.sech_list.energyBox .src_list.energy {}

}
@media screen and (max-width:1200px) {
	.boardtop_txtinner {width:80%;}

}
@media screen and (max-width:1024px) {
}

@media screen and (max-width:920px) {/*텍스트 최소값 보정*/
	.boardtop_txtinner {width:100%;}
}

@media screen and (max-width:767px) {
	.search_ctbox {margin-bottom:10px; padding-bottom:10px; border-bottom:1px dashed #ddd;}
	.search_ctbox.col_list4 .src_list {width:50%;}
	.search_ctbox.col_list4 .src_list:nth-child(1),
	.search_ctbox.col_list4 .src_list:nth-child(2) {margin-bottom:10px;}
	.search_ctbox.col_list4 .src_list:nth-child(3) {padding-left:0;}
	.search_ctbox.col_list1 {margin-bottom:10px; padding-bottom:0;}
	.search_ctbox.col_list1 .src_list {padding-bottom:0;}
	.board_topbox:before {height:30px;}
	.boardtop_txtinner {position:relative; padding:20px; min-height:auto;}
	.boardtop_txtinner:before {display:none;}
	.boardtop_txtinner .t_txt {display:block; min-height:auto;}

	.board_total {padding-top:0;}
	.search_tbox {position:relative; padding:0 70px 0 140px;}
	.search_listbox {width:130px;}
	.search_btnbox {width:60px;}
	
	/*도시가스사용신청 안내*/
	.search_ctbox.sech_list {padding-right:70px;}
	
	
}
@media screen and (max-width:640px) {
	.search_ctbox {margin-bottom:10px; padding-bottom:5px;}
	.search_ctbox .src_list {padding-left:0; margin-bottom:5px;}
	.search_ctbox.col_list4 .src_list {width:100%; margin-bottom:5px !important;}
	.search_ctbox.col_list3 .src_list,
	.search_ctbox.col_list2 .src_list {width:100%;}
	.search_ctbox.col_list1 {margin-bottom:5px;}
	.search_ctbox.col_list1 .src_list {margin-bottom:5px;}
	.boardtop_txtinner {padding:12px;}
	.search_tbox {position:relative; padding:0 60px 0 110px;}
	.search_listbox {width:105px;}
	.search_btnbox {width:55px;}
	
	
	/*도시가스사용신청 안내*/
	.search_ctbox.sech_list {display:flex; flex-wrap:wrap; padding-right:0;}
	.search_ctbox.sech_list .search_btnbox {display:block; position:relative; width:100%;}
	
	/*마이페이지 > 기업고객 > 원격검침*/
	.search_ctbox.sech_list .date_boxlist.amrBox {flex-direction:column; align-items:flex-start; width:100%;}
	.search_ctbox.sech_list .date_boxlist.amrBox select.secSelect {margin-left:0; margin-top:5px; width:100%;}
	.search_ctbox.sech_list .date_boxlist.amrBox .dash {padding:5px 0; margin:0 auto;}
}
@media screen and (max-width:480px) {
	.search_listbox {width:100%;position: relative;}
	.search_tbox {padding:0;}
	.search_txtbox {position:relative; width:100%; margin-top:10px; padding-right:65px}
	.search_btnbox {bottom:0;top: unset;}
	
	
	/*서비스 안내/신청 > 요금납부안내 > 가스요금안내 > 요금단가 및 체계안내*/
	.search_ctbox.sech_list .date_boxlist {flex-direction:column; align-items:flex-start; width:100%;}
	.search_ctbox.sech_list .date_boxlist .lable {margin-right:0; margin-bottom:10px;}
	.search_ctbox.sech_list .date_boxlist .dash {padding:5px 0; margin:0 auto;}
}


/********************************
포토갤러리게시판 썸네일
*******************************/
/*body*/
.gallery_bodybox ul {display:flex; flex-wrap:wrap; gap:20px;}
.gallery_bodybox li {width:calc(33.3333% - 15px);}
.gallery_bodybox li y {text-align:left;}

.gallery_bodybox li {padding:1px; border-color:transparent; border-radius:10px; 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;}
.gallery_bodybox li:hover,
.gallery_bodybox li:active,
.gallery_bodybox li:focus {border-width:0; border-color:transparent; background-origin:border-box; background-image:linear-gradient(#fff, #fff), linear-gradient(135deg, #1b69f1 5%, #5d78af 30%, #ef981c 65%, #f0981b 90%); background-clip:content-box, border-box;}
.gallery_bodybox li a {display:block; height:100%; border-radius:10px;}
.gallery_bodybox li a:hover,
.gallery_bodybox li a:active,
.gallery_bodybox li a:focus {text-decoration:none;}
.gallery_bodybox li a .glr_img {overflow:hidden; display:block; width:100%; height:270px; background-color:#ebebeb; border-top-left-radius:10px; border-top-right-radius:10px;}
.gallery_bodybox li a .glr_img img {width:100%; height:100%; border-top-left-radius:10px; border-top-right-radius:10px; transition:.3s; object-fit:cover;}
.gallery_bodybox li a:hover .glr_img img {transform: scale(1.1);}

.gallery_bodybox li a .img_tbox {padding:20px;}
.gallery_bodybox li a .ctgr {padding:4px 10px; border-radius:3px; font-size:1.5rem; color:#fff;}
.gallery_bodybox li a .ctgr.codeA {background-color:#0c6ccb;}/*회사소개*/
.gallery_bodybox li a .ctgr.codeB {background-color:#cb4100;}/*보도자료*/
.gallery_bodybox li a .ctgr.codeC {background-color:#028d2e;}/*가스안전*/
.gallery_bodybox li a .ctgr.codeD {background-color:#e60039;}/*사회공헌*/

.gallery_bodybox li a .glr_tit {position:relative; display:block; margin:6px 0 10px; color:#121212; font-size:2.0rem; text-overflow:ellipsis; overflow:hidden; white-space:nowrap; font-weight:500;}
.gallery_bodybox li a:hover .glr_tit,
.gallery_bodybox li a:active .glr_tit,
.gallery_bodybox li a:focus .glr_tit {color:#3c62c0;} 
.gallery_bodybox li a .glr_tit .newIcon {position:relative; display:inline-block; width:20px; margin-right:4px; text-indent:-9999px;}
.gallery_bodybox li a .glr_tit .newIcon:before {content:''; display:block; position:absolute; left:0; top:5px; width:20px; height:20px; background:url(/storyCms/bbs/images/icon/icon_new.png) 0 0 no-repeat;}
.gallery_bodybox li a .glr_date {position:relative; display:block; padding-left:20px; font-size:1.5rem;}
.gallery_bodybox li a .glr_date:before {content:''; position:absolute; left:0; top:3px; width:15px; height:15px; background:url(/storyCms/bbs/images/icon/icon_cld.png) 0 0 no-repeat;}


/** slick 슬라이더 오버라이딩 */
#cardNewsList {position:relative; margin:0 auto; height:inherit; max-width:70%; text-align:center;}
#cardNewsList .slick-list,
#cardNewsList .sty-portf-wrap,
#cardNewsList .slick-track {height:100% !important;}
#cardNewsList .slick-prev,
#cardNewsList .sty-portf-wrap,
#cardNewsList .slick-next {width:inherit; height:inherit; z-index:100;}
#cardNewsList .slick-prev {left:-70px;}
#cardNewsList .slick-next {right:-70px;}
#cardNewsList .slick-prev:before,
#cardNewsList .slick-next:before {color:#6A6A6A;}
#cardNewsList .slick-dots {/*bottom:-35px;*/ /*padding:50px 0;*/}
#cardNewsList .slick-prev:before {content:'\e93d'; font-family:'xeicon' !important; font-size:70px;}
#cardNewsList .slick-next:before {content:'\e940'; font-family:'xeicon' !important; font-size:70px;}
#cardNewsList .slick-dots li.slick-active button:before {color:#23508b; opacity:1.0;}
#cardNewsList .slick-dots li button:before {color:#6A6A6A;}
#cardNewsList .slick-dots li button:hover,
#cardNewsList .sty-portf-wrap,
#cardNewsList .slick-dots li button:focus {color:#23508b;}


/* media query */
@media screen and (max-width:1520px) {
	.gallery_bodybox li a .glr_img {height:250px;}
}
@media screen and (max-width:1200px) {
	.gallery_bodybox li a .glr_img {height:230px;}
}
@media screen and (max-width:1024px) {
	.gallery_bodybox li a .img_tbox {padding:15px 20px;}
	.gallery_bodybox li a .glr_img {height:210px;}
	
	
	#cardNewsList .slick-prev,
	#cardNewsList .sty-portf-wrap,
	#cardNewsList .slick-next {width:50px; height:50px;}
	#cardNewsList .slick-prev:before,
	#cardNewsList .slick-next:before {font-size:50px;}
	#cardNewsList .slick-prev {left:-50px;}
	#cardNewsList .slick-next {right:-50px;}
}
@media screen and (max-width:920px) {
	.gallery_bodybox li {width:calc(50% - 10px);}
}
@media screen and (max-width:767px) {
	
	#cardNewsList {max-width:85%;}
}

@media screen and (max-width:640px) {
	.gallery_bodybox li {width:100%;}
	.gallery_bodybox li a .glr_img {height:250px;}
	
	#cardNewsList .slick-prev,
	#cardNewsList .sty-portf-wrap,
	#cardNewsList .slick-next {width:40px; height:40px;}
	#cardNewsList .slick-prev:before,
	#cardNewsList .slick-next:before {font-size:40px;}
	#cardNewsList .slick-prev {left:-40px;}
	#cardNewsList .slick-next {right:-40px;}
}


@media screen and (max-width:480px) {
	.gallery_bodybox li a .glr_img {height:210px;}
	.gallery_bodybox li a .glr_tit {font-size:1.8rem;}
	.gallery_bodybox li a .glr_tit .newIcon:before {top:3px;}
	
	#cardNewsList {max-width:80%;}
}





/********************************
 테이블
*********************************/

/*table-list 목록*/
.tbl_bd_list {table-layout:fixed; margin-bottom:10px; width:100%; line-height:1.4; border-style:solid; border-color:#ddd; border-width:1px 0 0 0; border-top-color:#555;}
.tbl_bd_list thead th {padding:12px 5px 10px; font-weight:500; color:#333; text-align:center; border-bottom:1px solid #bbb; background-color:#f7f7fc;}

.tbl_bd_list tbody th, .tbl_bd_list tbody td,
.tbl_bd_list tfoot th, .tbl_bd_list tfoot td {padding:10px 5px 10px;}

.tbl_bd_list tbody th {color:#333; font-weight:400; text-align:center; border-bottom:1px solid #ddd; background-color:#f8f8f8;}
.tbl_bd_list tbody td {border-bottom:1px solid #ddd; background-color:#fff;}
.tbl_bd_list.board tbody td .icon_noti {padding:5px 10px; font-size:1.5rem; background-color:#444; border-radius:5px; color:#fff;}
.tbl_bd_list.board tbody td a img.secret {margin-top:-3px; margin-right:5px;}
.tbl_bd_list.board tbody td a img.new {margin-top:-3px; margin-left:5px;}

.tbl_bd_list tfoot th {color:#333; font-weight:400; text-align:center; border-bottom:1px solid #ddd; background-color:#fef6e8;}
.tbl_bd_list tfoot td {border-bottom:1px solid #ddd; background-color:#fef6e8;}

/*반응형*/
.tbl_bd_list.board tbody .m_head {display:none;}

/*게시글 없을때*/
.empty_txt {margin-bottom:15px; padding-bottom:10px; text-align:center; border-bottom:1px solid #ddd;}

/*서비스안내/신청 > 도시가스 서비스 > 안전점검,계량기교체 > 이력조회 표 / */
.tbl_bd_list.board.ct_board tbody td .m_td button {padding:5px 10px; line-height:inherit; word-break:break-all;}
	
	

/********************************
 media query
 *******************************/
 
@media screen and (max-width:1200px) {
}
@media screen and (max-width:1024px) {
}
@media screen and (max-width:920px) {
}
@media screen and (max-width:767px) {
	/*게시판 목록*/
	.tbl_bd_list.board colgroup,
	.tbl_bd_list.board thead {display:none;}
	.tbl_bd_list.board tbody tr {display:flex; flex-wrap:wrap; padding:10px 0; border-bottom:1px solid #ddd;}
	.tbl_bd_list.board tbody tr:nth-child(even) {background-color:#f8f8f8;}
	.tbl_bd_list.board tbody td {position:relative; display:table; padding:1px 0px !important; width:100%; border-bottom:0;}
	.tbl_bd_list.board tbody tr:nth-child(even) td {background-color:unset;}
	.tbl_bd_list.board tbody td .m_head {display:table-cell; padding:2px 10px; width:90px; height:100%; text-align:right; font-weight:500; color:#121212;}
	.tbl_bd_list.board tbody td .m_td {display:table-cell; padding:2px 10px; width:calc(100% - 90px); text-align:left;}
	.tbl_bd_list.board tbody td .icon_noti {padding:4px 10px; font-size:1.3rem;}
	.tbl_bd_list.board tbody td a.m_td:hover,
	.tbl_bd_list.board tbody td a.m_td:active,
	.tbl_bd_list.board tbody td a.m_td:focus {color:#3c62c0;}
		
	.tbl_bd_list.board span.ctgr {display:unset; margin:unset; width:auto; padding:4px 10px; font-size:1.3rem;}
	
	/*서비스안내/신청 > 도시가스 서비스 > 안전점검,계량기교체 > 이력조회 표 / */
	.tbl_bd_list.board.ct_board tbody td .m_head {width:105px;}
	.tbl_bd_list.board.ct_board tbody td .m_td {width:calc(100% - 105px);}
}
@media screen and (max-width:640px) {
}
@media screen and (max-width:480px) {
}
@media screen and (max-width:380px) {
	/*게시판 목록*/
	.tbl_bd_list.board tbody td .m_head {padding:2px 5px; width:70px;}
	.tbl_bd_list.board tbody td .m_td {padding:2px 5px; width:calc(100% - 70px);}
	
	/*서비스안내/신청 > 도시가스 서비스 > 안전점검,계량기교체 > 이력조회 표 / */
	.tbl_bd_list.board.ct_board tbody td .m_head {width:95px;}
	.tbl_bd_list.board.ct_board tbody td .m_td {width:calc(100% - 95px);}
	
}



/*table-view 상세*/
.tbl_bd_view {table-layout:fixed; margin-bottom:10px; width:100%; line-height:1.4; border-style:solid; border-color:#ddd; border-width:2px 0 0 0; border-top-color:#333;}
.tbl_bd_view thead th {padding:12px 5px 10px; font-weight:500; color:#333; text-align:center; border-bottom:1px solid #bbb; background-color:#f1f5f5;}
.tbl_bd_view thead th label {word-break:break-all;}

.tbl_bd_view tbody th, .tbl_bd_view tbody td,
.tbl_bd_view tfoot th, .tbl_bd_view tfoot td {padding:10px;}

.tbl_bd_view tbody th {color:#333; font-weight:400; text-align:center; border-bottom:1px solid #ddd; background-color:#f8f8f8; word-break:break-all;}
.tbl_bd_view tbody th label {word-break:break-all;}
.tbl_bd_view tbody td {border-bottom:1px solid #ddd; background-color:#fff;}


.tbl_bd_view tfoot th {color:#333; font-weight:400; text-align:center; border-bottom:1px solid #ddd; background-color:#fef6e8;}
.tbl_bd_view tfoot td {border-bottom:1px solid #ddd; background-color:#fef6e8;}


/*게시판 상세보기*/
.tbl_bd_view.board .w_pct20 {width:100px !important;}
.tbl_bd_view.board tbody th, 
.tbl_bd_view.board tbody td,
.tbl_bd_view.board tfoot th, 
.tbl_bd_view.board tfoot td {padding:15px 10px;}

.tbl_bd_view.board tbody th {font-weight:500;}
.tbl_bd_view.board tbody td.tbv_tit {padding:15px 0; font-size:2.4rem; font-weight:600; line-height:29px; text-align:center;}
.tbl_bd_view.board tbody td.tbv_tit span.ctgr {display:inline-block; margin-right:2px; padding:2px 10px 1px; font-size:1.6rem; background-color:#795548; border-radius:5px; color:#fff; text-align:center;}
.tbl_bd_view.board tbody td.tbv_tit span.ctgr.codeA {background-color:#0c6ccb;}/*회사소개*/
.tbl_bd_view.board tbody td.tbv_tit span.ctgr.codeB {background-color:#cb4100;}/*보도자료*/
.tbl_bd_view.board tbody td.tbv_tit span.ctgr.codeC {background-color:#028d2e;}/*가스안전*/
.tbl_bd_view.board tbody td.tbv_tit span.ctgr.codeD {background-color:#e60039;}/*사회공헌*/


.tbl_bd_view.board tbody td p {margin-bottom:0;}
.tbl_bd_view.board tbody td a {word-break:break-all;}

.tbl_bd_view.board.noticeImg tbody td p img {display:flex; margin:0 auto; width:50% !important;}

.tbl_bd_view.board tbody td.tbv_info {background-color:#f8f8f8;}
.tbl_bd_view.board tbody td.tbv_info ul {display:flex; justify-content:center; flex-wrap:wrap;}
.tbl_bd_view.board tbody td.tbv_info ul li {position:relative; padding:0 15px; font-size:1.6rem;}
.tbl_bd_view.board tbody td.tbv_info ul li:before {content:''; position:absolute; left:0; top:6px; width:1px; height:10px; background-color:#ddd;}
.tbl_bd_view.board tbody td.tbv_info ul li:first-child:before {display:none;}
.tbl_bd_view.board tbody td.tbv_info ul li .dt {position:relative;}
.tbl_bd_view.board tbody td.tbv_info ul li .dt:after {content:':'; margin-left:3px;}

.tbl_bd_view.board tbody td dt,
.tbl_bd_view.board tbody td .help-block span {word-break:break-all;}

.tbl_bd_view.board tbody td.fontP * {font-family:'Pretendard' !important;}
.tbl_bd_view.board tbody td.fontP pre {unicode-bidi:unset !important; white-space:unset !important;}


/* media query */
 
@media screen and (max-width:1200px) {
}
@media screen and (max-width:1024px) {
}
@media screen and (max-width:920px) {
}
@media screen and (max-width:767px) {
	.tbl_bd_view.board .w_pct20 {width:80px !important;}
	
	.tbl_bd_view.board tbody td.tbv_tit {font-size:2.2rem;}
}
@media screen and (max-width:640px) {
	
	.tbl_bd_view.board.noticeImg tbody td p img {width:100% !important;}
	
}
@media screen and (max-width:480px) {
	.tbl_bd_view.board tbody td.tbv_tit {font-size:2.0rem;}
	.tbl_bd_view.board tbody td.tbv_tit span.ctgr {padding:2px 10px; font-size:1.4rem; line-height:1.6;}
	
	.tbl_bd_view.board tbody td.tbv_info ul li {padding:0 10px;}
	.tbl_bd_view.board tbody td.tbv_info ul li.tbv_user .dt,
	.tbl_bd_view.board tbody td.tbv_info ul li.tbv_date .dt {overflow:hidden; position:absolute; top:-99999px; width:0; height:0; line-height:0; text-indent:-99999px;}
}
@media screen and (max-width:380px) {
}



/********************************
 반응형 테이블 목록
 *******************************/
.tbl_bd_list.rspTbl tbody td .th {display:none;}
.tbl_bd_list.rspTbl tbody td .bd_btn {padding:5px 10px; line-height:inherit; word-break:break-all;}
.tbl_bd_list.rspTbl tbody td .bd_btn.btn_bigdata {font-size:1.6rem;}



 /* media query */
@media screen and (max-width:1024px){
}

@media screen and (max-width:920px){
	.tbl_bd_list.rspTbl {text-align:left;}
	.tbl_bd_list.rspTbl colgroup,
	.tbl_bd_list.rspTbl thead {display:none;}
	.tbl_bd_list.rspTbl tbody tr {display:flex; flex-wrap:wrap; margin-bottom:20px; border-top:2px solid #446db5;}
	.tbl_bd_list.rspTbl tbody tr:first-child {border-top:none;}
	.tbl_bd_list.rspTbl tbody td {position:relative; padding-left:130px; width:100%; line-height:1.2;}
	.tbl_bd_list.rspTbl tbody td .th {display:block; position:absolute; left:0; top:0; padding:10px; width:110px; height:100%; background-color:#f7f7fc; border-right:1px solid #ddd;}
	.tbl_bd_list.rspTbl tbody td .th:after {content:''; display:inline-block; height:100%; vertical-align:middle;}
}
@media screen and (max-width:767px){
	.tbl_bd_list.rspTbl tbody td {padding-left:110px;}
	.tbl_bd_list.rspTbl tbody td .th {width:95px;}
}

@media screen and (max-width:640px){
}

@media screen and (max-width:480px){
}






/********************************
 반응형 테이블 상세
 *******************************/
.viewTable {}
.viewTable .btn_cdt {display:inline-block; padding:0 10px; text-align:center; border:1px solid; border-radius:5px; font-size:1.5rem;}
.viewTable .btn_cdt.cdt01 {border-color:#444; background-color:#fff; color:#444;} /*접수대기*/
.viewTable .btn_cdt.cdt02 {border-color:#3c62c0; background-color:#3c62c0; color:#fff;} /*접수중*/
.viewTable .btn_cdt.cdt03 {border-color:#444; background-color:#444; color:#fff;} /*접수마감*/

.viewTable .view_title {margin:5px 0; font-size:2.8rem; font-weight:600;}

.viewTable .view_info {display:flex; flex-wrap:wrap; border-top:2px solid #333;}
.viewTable .view_info div {width:50%; display:flex; justify-content:flex-start; align-items:stretch; border-bottom:1px solid #ddd;}
.viewTable .view_info div dl {display:flex; align-items:stretch; width:100%;}
.viewTable .view_info div dt {padding:10px; width:150px; min-width:150px; display:flex; flex-direction:column; justify-content:center; align-items:center; background-color:#f7f7fc; color:#333; text-align:center;}
.viewTable .view_info div dd {padding:10px; width:calc(100% - 150px); display:flex; flex-wrap:wrap; justify-content:flex-start; align-items:center;}

.viewTable .view_info div dd select {position:relative; padding:0 30px 0 12px; min-width:160px; background:#fbfbfb url(../images/select_arrow.png) right 11px center no-repeat; border-radius:8px;}
.viewTable .view_info div dd input {border-radius:8px; background-color:#fbfbfb;}
.viewTable .view_info div dd input[type="file"] {margin-bottom:5px; border-radius:0;}
.viewTable .view_info div dd input.datepicker::placeholder {padding-left:30px; background:url(../images/sub05/icon_cld.png) 10px 2px no-repeat;}
.viewTable .view_info div dd.addr_tbox {justify-content:space-between;}
.viewTable .view_info div dd.addr_tbox input {width:calc(100% - 110px);}

.viewTable .view_info div dd.addr_tbox2 {align-items:flex-start; flex-direction:column;}
.viewTable .view_info div dd.addr_tbox2 span {display:flex; flex-wrap:wrap; gap:10px; width:100%;}
.viewTable .view_info div dd.addr_tbox2 span.ip_box1 input {width:150px;}

.viewTable .view_info div dd.addr_tbox2 span.ip_box2 {margin-top:10px;}
.viewTable .view_info div dd.addr_tbox2 span.ip_box2 input {width:100%;}

.viewTable .view_info div dd.addr_tbox2 span.ip_box2.box2 input {width:calc(50% - 10px);}

.viewTable .view_info div dd textarea {min-height:120px; border-radius:8px;}

.view_txtarea {padding:30px 20px; border-bottom:1px solid #ddd;}

.view_btnbox .btn_config {min-width:25%;}

/* 첨부파일 */
.viewTable .view_info div dd.add_filebox div {width:100%; align-items:center; border:none;}
.viewTable .view_info div dd.add_filebox div .atc_filebox {margin-bottom:10px;}
.viewTable .view_info div dd.add_filebox div .atc_filebox span {margin-right:5px;}
.viewTable .view_info div dd.add_filebox span#fileExtList {word-break:break-all;}



/* 라디오 버튼 나열 */
.viewTable .view_info div dd.radio_list {gap:5px;}
.viewTable .view_info div dd.check_list {gap:5px;}

/* 셀렉트 ~ 셀렉트 */
.viewTable .view_info div dd .dash {padding:0 10px;}
.viewTable .view_info div dd.two_select {}

/* 인풋 ~ 인풋 */
.viewTable .view_info div dd.two_input input {margin-right:5px; max-width:65px;}

/* .view_info div안에 dl리스트 여러개일때 */
.viewTable .view_info div.more_info > dl > dd {padding:0;}
.viewTable .view_info div.more_info dt {padding:0;}
.viewTable .view_info div.more_info dd ul {width:100%; display:flex; flex-wrap:wrap; align-items:center;}
.viewTable .view_info div.more_info dd ul li {width:50%; border-top:1px solid #ddd;}
.viewTable .view_info div.more_info dd ul li:nth-child(-n+2) {border-top:0;}
.viewTable .view_info div.more_info dd ul li dt {width:100px; min-width:100px; background-color:#fbfbfb;}
.viewTable .view_info div.more_info dd ul li dd {width:calc(100% - 100px);}
.viewTable .view_info div.more_info .more_del {display:block;line-height:inherit; padding:2px 10px;}



  /* media query */
@media screen and (max-width:1200px) {
}

@media screen and (max-width:1024px) {
}

@media screen and (max-width:920px) {
}

@media screen and (max-width:767px) {
	.viewTable .view_title {font-size:2.4rem;}

	.viewTable .view_info div {width:100%;}
	.viewTable .view_info div dt {padding:10px; width:120px; min-width:120px;}
 	.viewTable .view_info div dd {padding:10px; width:calc(100% - 120px);}
	
	.viewTable .view_info div.more_info > dl {display:block; width:100%;}
	.viewTable .view_info div.more_info > dl > dt {width:100%; padding:10px; min-width:unset;}
	.viewTable .view_info div.more_info > dl > dd {width:100%;}
	.viewTable .view_info div.more_info .more_del {display:unset; margin-left:10px;}

 	.view_btnbox .btn_config {min-width:30%;}
}

@media screen and (max-width:640px) {
	.viewTable .view_info div dd.addr_tbox2 span.ip_box2.box2 input {width:100%;}
}

@media screen and (max-width:530px) {
	.viewTable .view_info div dd.two_select {flex-direction:column; align-items:flex-start;}
}
@media screen and (max-width:480px) {
	.viewTable .view_title {font-size:2.2rem;}

	.viewTable .view_info div dt {width:100px; min-width:100px;}
 	.viewTable .view_info div dd {width:calc(100% - 100px);}

 	.view_btnbox .btn_config {min-width:50%;}

	.viewTable .view_info div dd select {min-width:100%;}
 	.viewTable .view_info div dd.addr_tbox2 span {justify-content:center;}
	.viewTable .view_info div dd.addr_tbox2 span.ip_box1 input,
	.viewTable .view_info div dd.addr_tbox2 span.ip_box1 select {width:100%;} 
	.viewTable .view_info div dd.addr_tbox2 span.ip_box1 button {width:100%; text-align:center;}
	
	.viewTable .view_info div dd.two_input input {margin-right:3px; max-width:48px;}
	
	.viewTable .view_info div.more_info dd ul li {width:100%;}
	.viewTable .view_info div.more_info dd ul li:nth-child(2) {border-top:1px solid #ddd;}
}



/********************************
 체크박스, 라디오버튼
 *******************************/

/*체크박스*/
.lib_check .keep_text:before, 
.lib_check input:checked+.keep_text:before {background-image: url(../images/check_box.png); background-size:22px 44px; background-repeat: no-repeat;}
.lib_check {position:relative; display:inline-block; padding-left:22px; padding-right:10px;}
.lib_check .input_keep {position:absolute; top:5px; left:3px; width:15px; height:15px;}
.lib_check .keep_text {display:inline-block; margin-left:5px;}
.lib_check input {-webkit-appearance: none; -moz-appearance: none;}
.lib_check .keep_text:before {content: ''; position: absolute; top:2px; left:0; background-position:0 0; background-repeat: no-repeat; width:22px; height:22px; background-color:#fff;}
.lib_check input:checked+.keep_text:before {background-position:0px -22px; background-repeat:no-repeat; width:22px; height: 22px;}

/* 라디오버튼 */ 
.radio_check .keep_text:before, 
.radio_check input:checked+.keep_text:before {background-image: url(../images/radio_box.png); background-size:22px 44px; background-repeat: no-repeat;}
.radio_check {position:relative; display:inline-block; padding-left:22px; padding-right:10px;}
.radio_check .input_keep {position:absolute; top:6px; left:3px; width:15px; height:15px;}
.radio_check .keep_text {display:inline-block; margin-left:5px;}
.radio_check input {-webkit-appearance: none; -moz-appearance: none;}
.radio_check .keep_text:before {content: ''; position: absolute; top:3px; left:0; background-position:0 0; background-repeat: no-repeat; width:22px; height:22px; background-color:#fff;}
.radio_check input:checked+.keep_text:before {background-position:0px -22px; background-repeat:no-repeat; width:22px; height: 22px;}


/* media query */
@media screen and (max-width:1200px){
}

@media screen and (max-width:1024px){
}

@media screen and (max-width:920px){ 
}

@media screen and (max-width:767px){
	/*체크박스*/
	.lib_check .keep_text {margin-left:2px;}
	.lib_check .keep_text:before {top:1px; width:20px; height:20px; background-size:100%;}
	.lib_check .input_keep {top:4px;}
	
	/*라디오버튼*/
	.radio_check .keep_text {margin-left:2px;}
	.radio_check .keep_text:before {top:1px; width:20px; height:20px; background-size:100%;}
	.radio_check .input_keep {top:4px;}
}

@media screen and (max-width:640px){
}

@media screen and (max-width:480px){
}




/********************************
 board-btn
 *******************************/
.bd_btnbox {position:relative;}
.bd_btnbox.ta_l {text-align:left;}
.bd_btnbox.ta_c {text-align:center;}
.bd_btnbox.ta_r {text-align:right;}

.bd_btnbox.ta_l .bd_btn {margin-right:2px; margin-bottom:2px;}
.bd_btnbox.ta_c .bd_btn {margin-right:1px; margin-right:1px; margin-bottom:2px;}
.bd_btnbox.ta_r .bd_btn {margin-left:2px; margin-bottom:2px;}

.bd_btn {display:inline-block; padding:0 20px; line-height:43px; color:#333; border:1px solid #ddd; border-radius:5px;}
.bd_btn:hover,
.bd_btn:acitve,
.bd_btn:focus {transition:background-color 0.2s linear;}
.bd_btn.btn_list, .bd_btn.btn_submit {color:#fff; border-color:#138719; background-color:#138719;}
.bd_btn.btn_print {color:#fff; border-color:#232528; background-color:#232528;}
.bd_btn.btn_config {color:#fff; border-color:#3c62c0; background-color:#3c62c0;}
.bd_btn.btn_blue {color:#3c62c0; border-color:#3c62c0; background-color:#fff;}
.bd_btn.btn_del {color:#fff; border-color:#d52604; background-color:#d52604;}
.bd_btn.btn_del2 {color:#d52604; border-color:#d52604; background-color:#fff;}


/********************************
 media query
 *******************************/
@media screen and (max-width:1200px) {

}
@media screen and (max-width:1024px) {

}

@media screen and (max-width:920px) {/*텍스트 최소값 보정*/
}

@media screen and (max-width:767px) {
}

@media screen and (max-width:640px) {
}
@media screen and (max-width:480px) {
}


/********************************
 FAQ 게시판
 *******************************/
/* 질문 */
.qnalist {margin-top:10px;}
.qnalist:first-child {margin-top:0;}

.question {position:relative; display:flex; justify-content:flex-start; align-items:center; padding:20px 55px 20px 20px; border-radius:10px; border:1px solid #e5e5e5; color:#333; font-size:1.9rem; font-weight:500; text-align:left; text-decoration:none;}
.question:hover,
.question:active,
.question:focus {text-decoration:none;}
.question:before {content:''; position:absolute; right:20px; top:50%; margin-top:-12px; width:24px; height:24px; background:url(../images/arrow_off.svg) 51% 50% no-repeat; border-radius:50%; border:1px solid #ddd; transform:rotate(90deg); transition:transform 0.2s linear;}
.question.on {margin-bottom:0; border-radius:10px 10px 0 0; border-bottom:1px dashed #aaa;}
.question.on:before {transform:rotate(270deg);}
.question .icon {display:block; position:relative;  margin-right:10px; width:30px; height:30px; background:#023793; border-radius:50%;}
.question .icon:before {content:'Q'; display:block; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); color:#fff; text-align:center; font-size:1.7rem;}
.question .q_tit {display:flex; align-items:center; width:100%;}
.question .q_tbox {width:calc(100% - 40px);} 
.question .q_tbox .ctgr {margin-bottom:4px; font-size:1.5rem; font-weight:400; color:#555;}

.qna_none {margin-bottom:20px; padding:25px; border:1px solid #ddd; border-radius:15px; text-align:center;}

/* 답변 */
.answer {overflow:hidden; display:flex; align-items:flex-start; margin-bottom:10px; padding:15px 20px; background:#F8F8FC; border-radius:0 0 10px 10px; border-width:0px 1px 1px 1px; border-color:#e5e5e5; border-style:solid;}
.answer .answer_inner {display:flex;}
.answer .answer_inner > span {display:block; position:relative; margin-right:10px; width:30px; height:30px; background-color:#d52604; border-radius:50%; flex-shrink:0;}
.answer .answer_inner > span:before {content:'A'; display: block; position:absolute; left:50%; top:50%; transform:translate(-50%, -50%); color:#fff; text-align:center; font-size:1.7rem;}
.answer .answer_inner .answer_txt p {margin-bottom:0;}
.answer .answer_inner .answer_txt > *,
.answer .answer_inner .answer_txt > * span {background-color:unset !important; font-family:'Pretendard', 맑은고딕,'Malgun Gothic', 돋움, Dotum,sans-serif !important;}
.answer .answer_inner .answer_txt a {position:relative; display:inline-block; margin:5px 0 0 5px; padding:8px 40px 8px 10px; border:1px solid #ddd; border-radius:5px; font-size:1.5rem; background-color:#fff;}
.answer .answer_inner .answer_txt a:before {content:''; position:absolute; top:50%; margin-top:-13px; right:10px; width:23px; height:23px; background:url(../images/minicon_ir.png) -24px 0 no-repeat;} 
.answer .answer_inner .answer_txt a:first-child {margin:0;}
.answer .answer_inner .answer_txt a:hover,
.answer .answer_inner .answer_txt a:focus,
.answer .answer_inner .answer_txt a:active {border-color:#0065aa; color:#0065aa;}

.answer .answer_inner .answer_txt a span {padding:0 !important; font-size:1.5rem !important;}
.answer .answer_inner .answer_txt a:hover span,
.answer .answer_inner .answer_txt a:focus span,
.answer .answer_inner .answer_txt a:active span {color:#0065aa !important; text-decoration:underline;}



/*상세보기 게시판 카테고리 2개 정렬*/
.tbl_bd_view.board tbody tr.ctgr_50 {font-size:1.6rem;}

.tbl_bd_view.board tbody td[title="내용"] * {font-family:'Pretendard', 맑은고딕,'Malgun Gothic', 돋움, Dotum,sans-serif !important;}
.tbl_bd_view.board tbody td[title="내용"] pre {unicode-bidi:unset !important; white-space:unset !important;}
.tbl_bd_view.board tbody td[title="내용"] a {position:relative; display:inline-block; margin:5px 0 0 5px; padding:8px 40px 8px 10px; border:1px solid #ddd; border-radius:5px; font-size:1.5rem !important;}
.tbl_bd_view.board tbody td[title="내용"] a:before {content:''; position:absolute; top:50%; margin-top:-13px; right:10px; width:23px; height:23px; background:url(../images/minicon_ir.png) -24px 0 no-repeat;}
.tbl_bd_view.board tbody td[title="내용"] a * {font-size:1.5rem !important; padding:0 !important;}
.tbl_bd_view.board tbody td[title="내용"] a:first-child {margin:0;}
.tbl_bd_view.board tbody td[title="내용"] a:hover,
.tbl_bd_view.board tbody td[title="내용"] a:focus,
.tbl_bd_view.board tbody td[title="내용"] a:active {border-color:#0065aa; color:#0065aa;}

/*테이블*/
.answer_txt table {table-layout:fixed !important; width:100%; line-height:1.4; border-style:solid; border-color:#ddd; border-width:2px 1px 0 1px; border-top-color:#446db5 !important;}
.answer_txt table thead th {padding:7px 2px 5px !important; font-weight:700; color:#333; text-align:center; border-right:1px solid #ddd !important; border-bottom:1px solid #bbb !important; background-color:#f6faff !important; vertical-align:middle; word-break:break-all;}
.answer_txt table thead th:last-child {border-right-width:0;}

.answer_txt table tbody th, .answer_txt table tbody td,
.answer_txt table tfoot th, .answer_txt table tfoot td {padding:14px 8px 12px !important; word-break:break-all;}
.answer_txt table tbody td {vertical-align:middle; background-color:#fff;}

/* media query */
@media screen and (max-width:1200px) {
}
 
@media screen and (max-width:1024px) {
}

@media screen and (max-width:920px) { 
}

@media screen and (max-width:767px) {
	.question {padding:15px 45px 15px 15px; font-size:1.6rem;}
	.question:before {right:15px; width:20px; height:20px; background-size:25%;}
	.question .icon,
	.answer .answer_inner > span {width:25px; height:25px;}
	.question .icon:before,
	.answer .answer_inner > span:before {font-size:1.4rem;}
	
	.question .q_tbox {width:calc(100% - 35px);} 
	.question .q_tbox .ctgr {font-size:1.3rem;}
	
	.answer {padding:15px;}
	
	.answer_txt .scrl_box table {width:768px;}
}

@media screen and (max-width:640px) {
}

@media screen and (max-width:480px) {
}



/* 회사소개 > ceo프로필 */
.yearBox.ceoYearbox {margin-bottom:30px;}
.ceoMsg {}
.ceoMsg colgroup {display:none;}
.tbl_bd_list.ceoMsg tbody td {display:block; padding:15px 0; width:100%;} 

.ceoMsg .ceoTit a {font-size:2.4rem; font-family:'OneMobile'; color:#222; line-height:28px;}
.ceoMsg .ceoTit a:hover {text-decoration:none;}
.ceoMsg .ceoTit .ctgr {display:inline-block; margin-right:2px; padding:2px 10px 1px; font-size:1.6rem; background-color:#0e82d2; border-radius:5px; color:#fff; text-align:center;}
.tbl_bd_view.board.ceoMsg  tbody td.tbv_tit span.ctgr {background-color:#0e82d2;}/*상세보기*/

.tbl_bd_list.ceoMsg tbody td.ceoTxtinfo {background-color:#f8f8f8;}
.tbl_bd_list.ceoMsg tbody td.ceoTxtinfo ul {display:flex; justify-content:center; flex-wrap:wrap;}
.tbl_bd_list.ceoMsg tbody td.ceoTxtinfo ul li {position:relative; padding:0 15px; font-size:1.6rem;}
.tbl_bd_list.ceoMsg tbody td.ceoTxtinfo ul li:before {content:''; position:absolute; left:0; top:6px; width:1px; height:10px; background-color:#ddd;}
.tbl_bd_list.ceoMsg tbody td.ceoTxtinfo ul li:first-child:before {display:none;}
.tbl_bd_list.ceoMsg tbody td.ceoTxtinfo ul li .dt {position:relative;}
.tbl_bd_list.ceoMsg tbody td.ceoTxtinfo ul li .dt:after {content:':'; margin-left:3px;}

.ceoContent {overflow:hidden; display:block; position:relative; padding-top:220px; background:url(../images/sub03/bg_ceoContent.png) 0 0 repeat; z-index:0;}
.ceoContent:before {content:''; position:absolute; top:0; left:50%; margin-left:-29px; width:58px; height:188px; background:url(../images/sub03/icon_ceoTop.png) 0 0 no-repeat;}
.ceoContent:after {content:''; position:absolute; background:#fff; z-index:-1; inset:0; opacity:0.4;}

.ceoContent .ceoCtinner {padding:0 20% 20%;}
.ceoContent .ceoCtinner:after {content:''; position:absolute; bottom:-100px; left:50%; margin-left:-760px; width:1520px; height:504px; background:url(../images/sub03/icon_ceoFoot.png) 0 0 no-repeat; z-index:-1;}

.ceoContent .ceoCtinner * {background-color:rgb(255, 255, 255, 0) !important; font-family:'Pretendard', 맑은고딕,'Malgun Gothic', 돋움, Dotum,sans-serif !important;}
.ceoContent .ceoCtinner pre {unicode-bidi:unset !important; white-space:unset !important;}
.ceoContent .ceoCtinner b {font-family:'OneMobile' !important;}
.ceoContent .ceoCtinner b * {font-family:'OneMobile' !important;}

/* media query */
@media screen and (max-width:1520px){
	.ceoContent .ceoCtinner {padding:0 15% 20%;}
	.ceoContent .ceoCtinner:after {margin-left:-50%; width:100%; height:447px; background-size:100%;}
}

@media screen and (max-width:1200px){
	.ceoContent .ceoCtinner {padding:0 10% 20%;}
	.ceoContent .ceoCtinner:after {bottom:-3%;}
}

@media screen and (max-width:1024px){
	.ceoContent .ceoCtinner:after {bottom:-4%;}
}

@media screen and (max-width:920px){
	.ceoContent .ceoCtinner {padding:0 50px 20%;}
	.ceoContent .ceoCtinner:after {bottom:-5%;}
	.ceoMsg .ceoTit {font-size:2.2rem;}
}

@media screen and (max-width:767px){
	.ceoContent {padding-top:160px;}
	.ceoContent:before {margin-left:-19px; width:38px; height:123px; background-size:100%;}
	.ceoContent .ceoCtinner {padding:0 30px 25%;}
	.ceoContent .ceoCtinner:after {bottom:-6%;}
}

@media screen and (max-width:640px){
	.yearBox.ceoYearbox {margin-bottom:15px;}
	
	.ceoMsg .ceoTit {font-size:2.0rem;}
}

@media screen and (max-width:480px){
	.ceoContent .ceoCtinner:after {bottom:0; height:120px;}
	.ceoMsg .ceoTit {font-size:1.8rem;}
}

@media screen and (max-width:390px){
	.ceoContent .ceoCtinner:after {bottom:-30px;}
}




/********************************
 게시판 페이징
 *******************************/
#paginateDiv {text-align:center;}

.pageingDiv {text-align:center;}
.pagination {display:inline-block; margin:40px 0;}
.pagination > li {display:inline-block; min-width:40px; margin:2px;}

.pagination > li > a,
.pagination > li > span {display:block; float:none !important; position:relative; margin:0; padding:0; line-height:40px; color:#555; border-radius:8px; border:1px solid #ccc; background-color:#fff; box-sizing:border-box;}

.pagination > li > a:hover, .pagination > li > span:hover,
.pagination > li > a:active, .pagination > li > span:active,
.pagination > li > a:focus,
.pagination > li > span:focus {color:#0065aa; text-decoration:underline; border-color:#0065aa; border-radius:8px; background-color:#fff; transition:border-color 0.2s linear;}

.pagination > .active > a,
.pagination > .active > span,
.pagination > .active > a:hover,
.pagination > .active > span:hover,
.pagination > .active > a:active,
.pagination > .active > span:active,
.pagination > .active > a:focus,
.pagination > .active > span:focus {color:#fff; cursor:default; border-color:#0065aa; background-color: #0065aa; }

.pagination > li > .btn {}
.pagination > li > .btn:active {box-shadow:none;}
.pagination > li > .btn.first,
.pagination > li > .btn.prev,
.pagination > li > .btn.next,
.pagination > li > .btn.last {text-indent:-9999px;}
.pagination > li > .btn:before {content:''; display:none; position:absolute; left:10px; top:9px; width:20px; height:20px; background-image:url(../../../storyCms/bbs/images/icon_paging_ir.png); background-repeat:no-repeat;}

.pagination > li > .btn.first:before {display:block; background-position:0 0;}
.pagination > li > .btn.prev:before {display:block; background-position:0 -21px;}
.pagination > li > .btn.next:before {display:block; background-position:0 -42px;}
.pagination > li > .btn.last:before {display:block; background-position:0 -63px;}

.pagination > li > .btn.first:hover:before,
.pagination > li > .btn.first:active:before,
.pagination > li > .btn.first:focus:before {display:block; background-position:-42px 0;}
.pagination > li > .btn.prev:hover:before,
.pagination > li > .btn.prev:active:before,
.pagination > li > .btn.prev:focus:before {display:block; background-position:-42px -21px;}
.pagination > li > .btn.next:hover:before,
.pagination > li > .btn.next:active:before,
.pagination > li > .btn.next:focus:before {display:block; background-position:-42px -42px;}
.pagination > li > .btn.last:hover:before,
.pagination > li > .btn.last:active:before,
.pagination > li > .btn.last:focus:before {display:block; background-position:-42px -63px;}


.pagination > .disabled > span,
.pagination > .disabled > span:hover,
.pagination > .disabled > span:focus,
.pagination > .disabled > a,
.pagination > .disabled > a:hover,
.pagination > .disabled > a:focus {color: #777; cursor: not-allowed; background-color: #fff; border-color: #ddd;}
.pagination-lg > li > a, .pagination-lg > li > span {padding: 10px 16px; font-size: 18px;}
.pagination-sm > li > a, .pagination-sm > li > span {padding: 5px 10px;	font-size: 12px;}

.pager {padding-left: 0; margin: 20px 0; text-align: center; list-style: none;}
.pager li {display: inline;}
.pager li > a, .pager li > span {display: inline-block;	padding: 5px 14px; background-color: #fff; border: 1px solid #ddd;}
.pager li > a:hover, .pager li > a:focus {text-decoration: none; background-color: #eee;}
.pager .next > a, .pager .next > span {float: right;}
.pager .previous > a, .pager .previous > span {float: left;}
.pager .disabled > a, .pager .disabled > a:hover, .pager .disabled > a:focus, .pager .disabled > span {color: #777; cursor: not-allowed; background-color: #fff;}

/* media query */
@media screen and (max-width:1200px) {
}
@media screen and (max-width:1024px) {
}
@media screen and (max-width:920px) {
}
@media screen and (max-width:767px) {
	.pagination > li {min-width:36px;}
	.pagination > li > a,
	.pagination > li > span {line-height:36px; font-size:1.3rem}
	.pagination > li > .btn:before {left:8px; top:8px;}
}
@media screen and (max-width:640px) {
}
@media screen and (max-width:480px) {
	.pagination > li {min-width:30px;}
	.pagination > li > a,
	.pagination > li > span {line-height:30px; font-size:1.2rem}
	.pagination > li > .btn:before {left:5px; top:4px;}
}