@charset "utf-8";

/*갤러리 리스트 단독*/

/*---------------------------갤러리 목록---------------------------*/

#bo_list h2{margin:0;padding:0;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden}
#bo_list #gall_allchk{display:block;margin-bottom:1rem;overflow:hidden}
#bo_list #gall_allchk .chk_box input[type="checkbox"] + label[for="chkall"]{margin:0}

/*관리자설정*/
.gall_row .col-gn-0,.gall_row .col-gn-1{width:100%}
.gall_row .col-gn-2{width:49%}
.gall_row .col-gn-3{width:32%}
.gall_row .col-gn-4{width:23.5%}
.gall_row .col-gn-5{width:18%}
.gall_row .col-gn-6{width:15%}
.gall_row .col-gn-7{width:12%}
.gall_row .col-gn-8{width:12.5%}
.gall_row .col-gn-9{width:11.11111111%}
.gall_row .col-gn-10{width:10%}

/*관리자설정 끝*/
#bo_list .gall_href a:link, #bo_list .gall_href a:focus, #bo_list .gall_href a:hover{text-decoration:none}

#gall_ul{width:100%;padding:0;list-style:none;position:relative;display:flex;flex-wrap:wrap;gap:3rem 2%;}
#gall_ul #gall_top_link{width:100%;left:0;top:-12rem;position:absolute;z-index:-10}

#gall_ul .gall_box{overflow:hidden;position:relative}
#gall_ul .gall_img{border:1px solid #ddd;border-radius:1rem;overflow:hidden}
#gall_ul .gall_img a{display:block;width:100%}
#gall_ul .gall_img a img{width:100%;height:auto;transition:all .3s}
#gall_ul .gall_txt_box{margin-top:1.5rem;text-align:center}
#gall_ul .gall_li .gall_txt_box .bo_cate_link {display:inline-block;margin-bottom:1rem;padding:0.5rem 0.9rem;border-radius:2px;background:#ebf0f7;font-weight:500;font-size:14px;color:#239aee}
#gall_ul .gall_li .gall_txt_box .tit_box{display:flex;justify-content:center}
#gall_ul .gall_li .gall_txt_box .tit_box .list_icon{margin-left:.5rem}

#gall_ul .gall_li .gall_txt_box .ca_name{display:inline-block;margin-bottom:1rem;padding:.5rem 1rem;border-radius:5rem;background:#ccdeec;font-size:1.4rem;font-weight:500;line-height:100%;color:var(--pt-color)}
#gall_ul .gall_li .gall_txt_box .bo_tit{font-size:2rem;font-weight:700;color:#333;transition:all .3s;font-family:"Pretendard"}
#gall_ul .gall_li .gall_txt_box .s_tit{margin-top:.5rem;font-size:1.5rem;font-weight:600;color:var(--pt-color);font-family:"Poppins", "Pretendard"}
#gall_ul .gall_li .gall_txt_box .bo_txt{margin-top:1rem;font-size:1.6rem;font-weight:400;line-height:150%;color:#888;word-break:keep-all}


#bo_list .gall_li .gall_chk{padding:0;position:absolute;top:.5rem;left:.5rem;padding:5px;z-index:1}
#bo_list .gall_li:hover .gall_img a img{transform:scale(1.1,1.1)}
/*---------------------------갤러리 목록---------------------------*/

/*뷰페이지 커스텀*/
#bo_v .pdt_info_area{width:100%;margin-bottom:3rem;padding-bottom:3rem;border-bottom:1px dashed #ddd;display:flex;flex-wrap:wrap;align-items:center}
#bo_v .pdt_info_area .img_box{max-width:50rem;width:100%;height:40rem;border:1px solid #ddd;overflow:hidden;position:relative;display:flex;align-items:center;justify-content:center;cursor:pointer}
#bo_v .pdt_info_area .img_box img{max-width:100%;max-height:100%;width:auto;height:auto}
#bo_v .pdt_info_area .img_box .more_img{width:4rem;height:4rem;border-radius:.5rem;background:var(--pt-color);font-size:1.5rem;text-align:center;line-height:4rem;color:#fff;position:absolute;bottom:1rem;right:1rem;transition:all .3s}
#bo_v .pdt_info_area .img_box:hover .more_img{background:#0e469d}

#bo_v .pdt_info_area .pdt_info{width:calc(100% - 50rem);padding-left:5rem}
#bo_v .pdt_info_area .pdt_info .tit{margin-bottom:2rem;font-weight:700;font-size:2.8rem;color:#333;display:flex;flex-wrap:wrap;align-items:end;gap:1rem}
#bo_v .pdt_info_area .pdt_info .tit .txt{display:inline-block;font-weight:400;font-size:1.6rem;color:#888}
#bo_v .pdt_info_area .info_list{margin-bottom:2rem;padding:5rem 3rem;border:1px solid #ddd;border-radius:1rem}
#bo_v .pdt_info_area .info_list li{padding:0 0 1rem 1rem;margin-bottom:1rem;border-bottom:1px dashed #ddd;font-size:1.6rem;color:#666;position:relative}
#bo_v .pdt_info_area .info_list li:before{content:'';width:3px;height:3px;border-radius:3px;background:var(--pt-color);position:absolute;left:0;top:.8rem;}
#bo_v .pdt_info_area .info_list li:last-child{padding-bottom:0;margin-bottom:0;border-bottom:0}

#bo_v #bo_v_youtube{max-width:80rem;width:100%;margin:0 auto 3rem}
#bo_v #bo_v_youtube iframe{width:100% !important}

#bo_v .inq_more_btn{display:block;width:18rem;height:5rem;margin:0 auto;border-radius:.5rem;background:#333;font-weight:500;font-size:1.6rem;text-align:center;color:#fff;display:flex;align-items:center;justify-content:center} 
#bo_v .inq_more_btn img{display:inline-block;width:2rem;margin-right:.5rem;vertical-align:unset}

/*이미지 크게보기*/
#enlarge_img_area{display:none;width:100%;height:100%;position:fixed;top:0;left:0;z-index:-1}
#enlarge_img_area.on{display:block;z-index:9999}
#enlarge_img_area .img_box{max-width:60rem;max-height:90%;width:90%;height:auto;overflow:auto;position:absolute;top:10rem;left:50%;transform:translateX(-50%);z-index:2}
#enlarge_img_area .img_box img{max-width:100%;width:auto;height:auto}
#enlarge_img_area .close_btn{width:5rem;height:5rem;border-radius:4rem;background:#fff;text-align:center;line-height:5rem;box-shadow:0 0 .5rem rgba(0,0,0,.1);position:fixed;top:3rem;right:3rem;z-index:10;cursor:pointer}
#enlarge_img_area .area_bg{width:100%;height:100%;background:rgba(0,0,0,.6);position:absolute;top:0;left:0}

/*하단 검색창 별도*/
.bt_sch_area{margin-top:2rem}
.bt_sch_area #bo_sch{margin:0 auto;position:relative}
.bt_sch_area #bo_sch .sch_btn{position:absolute;right:1px}

/*이미지 카테고리 별도*/
.img_cate_area{margin-bottom:3rem;padding-bottom:3rem;border-bottom:1px dashed #ddd;}
.img_cate_list{display:flex;flex-wrap:wrap;gap:2rem 2%;}
.img_cate_list li{width:18.33%;padding:2rem 1.5rem;border:1px solid #ddd;border-radius:1rem;cursor:pointer}
.img_cate_list li .img_box{width:100%;overflow:hidden}
.img_cate_list li .img_box img{width:100%;transform:scale(1);transition:all .3s}
.img_cate_list li .cate_name{margin-top:1rem;font-size:1.7rem;font-weight:500;text-align:center;letter-spacing:-1px;color:#333;word-break:break-all}

.img_cate_list li:hover{background:#f7f7f7}
.img_cate_list li:hover .img_box img{transform:scale(1.03)}

.img_cate_list li.on, .img_cate_list li.on:hover{background:var(--pt-color)}
.img_cate_list li.on .cate_name, .img_cate_list li.on:hover .cate_name{color:#fff}



@media(max-width:1024px){
/*1024부터 3배열 - 관리자설정 무시*/
.gall_row .col-gn-0, .gall_row .col-gn-1, .gall_row .col-gn-2, .gall_row .col-gn-3, .gall_row .col-gn-4, .gall_row .col-gn-5, .gall_row .col-gn-6, .gall_row .col-gn-7, .gall_row .col-gn-8, .gall_row .col-gn-9, .gall_row .col-gn-10
{width:32%}

#bo_v .pdt_info_area{display:block}
#bo_v .pdt_info_area .img_box{height:auto;margin:0 auto 3rem}
#bo_v .pdt_info_area .pdt_info{width:100%;padding:0}
#bo_v .pdt_info_area .more_btn{margin:0 auto}

.img_cate_area{width:100%}
.img_cate_list{display:block;padding-bottom:2rem;/*flex해제*/overflow-x:auto;white-space:nowrap;}
.img_cate_list li{display:inline-block;width:20rem}
.img_cate_list li + li{margin-left:1rem}
.img_cate_list li .cate_name{white-space:normal}

.img_cate_list::-webkit-scrollbar {width:2px;height:3px}
.img_cate_list::-webkit-scrollbar-thumb {width:20%;/* 스크롤바의 길이*/background:var(--pt-color);/* 스크롤바의 색상*/border-radius:.5rem;}
.img_cate_list::-webkit-scrollbar-track{background:#f2f2f2}

}


@media(max-width:767px){
/*1024부터 2배열 - 관리자설정 무시*/
.gall_row .col-gn-0, .gall_row .col-gn-1, .gall_row .col-gn-2, .gall_row .col-gn-3, .gall_row .col-gn-4, .gall_row .col-gn-5, .gall_row .col-gn-6, .gall_row .col-gn-7, .gall_row .col-gn-8, .gall_row .col-gn-9, .gall_row .col-gn-10
{width:49%}

#bo_v .pdt_info_area .info_list{padding:3rem 2rem}


.img_cate_list li{width:15rem}
}

@media(max-width:480px){
/*이미지 크게보기*/
#enlarge_img_area .img_box img{max-width:60rem;width:auto}
#enlarge_img_area .close_btn{top:3rem;right:5%}
#gall_ul .gall_li{margin-bottom:2rem}
#gall_ul .gall_li .gall_txt_box .bo_tit{font-size:1.7rem}

.img_cate_list li{width:12rem;padding:1rem}
.img_cate_list li .cate_name{font-size:1.6rem}
}


@media(max-width:360px){

.gall_row .col-gn-0, .gall_row .col-gn-1, .gall_row .col-gn-2, .gall_row .col-gn-3, .gall_row .col-gn-4, .gall_row .col-gn-5, .gall_row .col-gn-6, .gall_row .col-gn-7, .gall_row .col-gn-8, .gall_row .col-gn-9, .gall_row .col-gn-10
{width:100%;}
}

@media(max-width:320px){
.img_cate_list li{width:10rem}
}