@charset "utf-8";
/*html, body { overflow:hidden; }*/
#contents .sub-top-area { position:fixed; top:0; }
#bo_list { position:relative; margin-top:100vh; background-color:#fff; min-height: 40vh; padding: 9rem 0 ; }
#bo_v { position:relative; margin-top:100vh; background-color:#fff;   padding: 9rem 0 ; }


/* 분류 */
#bo_cate ul { display:flex; margin:0 auto 5rem; justify-content:center; }
#bo_cate li { display:inline-block; width:auto; margin:0 7px; text-align:center; }
#bo_cate a { position:relative; display:block; padding:3px 18px 2px; border:1px solid #bebebe; color:#888; font-size:1.312rem; border-radius:2rem; }
#bo_cate #bo_cate_on { background-color:#7c94c4; color:#fff; }

/* 갤러리 목록 */
#gall_ul { display:flex; flex-wrap:wrap; margin:0 auto -4.375rem; }
#bo_gall #gall_ul:after { display:block; visibility:hidden; clear:both; content:""; }
#gall_ul li { border:1px solid #ddd; padding-bottom:0.938rem; }
#bo_gall .gall_box { position:relative; }
#bo_gall .gall_con { position:relative; }

.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 { position:relative; min-height:1px; -webkit-box-sizing:border-box; -moz-box-sizing:border-box; box-sizing:border-box; text-align:center; }
.gall_row .col-gn-0, .gall_row .col-gn-1 { width:100%; margin:0 0 4.375rem; }
.gall_row .col-gn-2 { width:calc(50% - 6.875rem); margin:0 3.4375rem 4.375rem; }
.gall_row .col-gn-3 { width:calc(33.33333333% - 1.625rem); margin:0 0.813rem 4.375rem; }
.gall_row .col-gn-4 { width:calc(25% - 1.625rem); margin:0 0.813rem 4.375rem; }
.gall_row .col-gn-5 { width:calc(20% - 1.625rem); margin:0 0.813rem 4.375rem; }
.gall_row .col-gn-6 { width:calc(16.66666667% - 1.625rem); margin:0 0.813rem 4.375rem; }
.gall_row .col-gn-7 { width:calc(14.28571428% - 1.625rem); margin:0 0.813rem 4.375rem; }
.gall_row .col-gn-8 { width:calc(12.5% - 1.625rem); margin:0 0.813rem 4.375rem; }
.gall_row .col-gn-9 { width:calc(11.11111111% - 1.625rem); margin:0 0.813rem 4.375rem; }
.gall_row .col-gn-10 { width:calc(10% - 1.625rem); margin:0 0.813rem 4.375rem; }

.gall_row .box_clear { clear:both; }


#bo_gall .gall_img a, #bo_gall .gall_img .no_image, #bo_gall .gall_img .is_notice { display:block; }
#bo_gall .gall_img img, #bo_gall .gall_img video { max-width:100%;height:auto !important; }
#bo_gall .gall_img span { display:inline-block; background:#eaeaea; text-align:center; text-transform:uppercase; font-weight:bold; font-size:1.25em; color:#777; }

#bo_gall .bo_tit { display:block; margin-top:1.25rem; margin-bottom:0.938rem; color:#131313; font-size:1.714rem; }
#bo_gall .bo_cnt { font-size:1.142rem; color:#888; }
#bo_gall li.empty_list { width:100%; padding:85px 0; text-align:center; }

@media (max-width:991px) {
	/* 분류 */
	#bo_cate ul { margin:0 -5px 1.25rem; flex-wrap:wrap; justify-content:center; }
	#bo_cate li { width:calc(33.333% - 10px); margin:0 5px 1.25rem; }
	
	/* 갤러리 목록 */
	#gall_ul { margin:0 -1.25rem -4.375rem; }
	.gall_row .col-gn-2 { width:calc(50% - 2.5rem); margin:0 1.25rem 4.375rem; }
	.gall_row .col-gn-4 { width:calc(33.33333333% - 2.5rem); margin:0 1.25rem 4.375rem; }
	.gall_row .col-gn-5 { width:calc(33.33333333% - 2.5rem); margin:0 1.25rem 4.375rem; }
	.gall_row .col-gn-6 { width:calc(33.33333333% - 2.5rem); margin:0 1.25rem 4.375rem; }
	.gall_row .col-gn-7 { width:calc(33.33333333% - 2.5rem); margin:0 1.25rem 4.375rem; }
	.gall_row .col-gn-8 { width:calc(33.33333333% - 2.5rem); margin:0 1.25rem 4.375rem; }
	.gall_row .col-gn-9 { width:calc(33.33333333% - 2.5rem); margin:0 1.25rem 4.375rem; }
	.gall_row .col-gn-10 { width:calc(33.33333333% - 2.5rem); margin:0 1.25rem 4.375rem; }
}
@media (max-width:639px) {
	/* 갤러리 목록 */
	#gall_ul { margin:0 auto -4.375rem; }
	.gall_row .col-gn-2 { width:100%; margin:0 0 4.375rem; }
	.gall_row .col-gn-4 { width:calc(50% - 1.625rem); margin:0 0.8125rem 4.375rem; }
	.gall_row .col-gn-5 { width:calc(50% - 1.625rem); margin:0 0.8125rem 4.375rem; }
	.gall_row .col-gn-6 { width:calc(50% - 1.625rem); margin:0 0.8125rem 4.375rem; }
	.gall_row .col-gn-7 { width:calc(50% - 1.625rem); margin:0 0.8125rem 4.375rem; }
	.gall_row .col-gn-8 { width:calc(50% - 1.625rem); margin:0 0.8125rem 4.375rem; }
	.gall_row .col-gn-9 { width:calc(50% - 1.625rem); margin:0 0.8125rem 4.375rem; }
	.gall_row .col-gn-10 { width:calc(50% - 1.625rem); margin:0 0.8125rem 4.375rem; }
}

/**************************************************
* 게시판 list 공통 영역
**************************************************/
#bo_cate { }
#bo_cate_ul { }
#bo_cate_ul li { }

/**************************************************
* 게시판 view 공통 영역
**************************************************/
/* contents */
.bo_title { height:6.25rem; line-height:6.25rem; margin-bottom:8.75rem; border-top:3px solid #131313; border-bottom:1px solid #131313; font-size:1.875rem; font-weight:600; }
#bo_v { text-align:center; }
#bo_v .d-flex { max-width:980px; margin:0 auto; }
#bo_v_con { margin-top:4.375rem; font-size:1.125rem; font-weight:300; }

/* 공유 */
.bo_bottom { display:flex; justify-content:space-between; align-items:end; margin-top:10rem; padding-bottom:0.938rem; overflow:hidden; border-bottom:3px solid #131313; }
.bo_bottom .bo_info { font-size:1.125rem;  color:#bbbbbb; }
.bo_bottom #bo_v_share li { float:left; width:4.375rem; text-align:center; }
.bo_bottom #bo_v_share .img { width:auto; max-width:100%; height:auto; }
.bo_bottom #bo_v_share span { display:block; margin-top:0.3125rem; font-size:0.938rem; color:#888; }

/* 이전글/다음글 */
.view_btn { position:relative; margin-top:4.6875rem; text-align:center; }
.view_btn [class^="btn-"] { display:inline-block; height:2.25rem; line-height:2.0625rem; padding:0 1.25rem; min-width:5rem; vertical-align:middle; border-radius:2rem; color:#888; }
.view_btn .btn-list { border:1px solid #aaa; font-size:1.125rem; }
.view_btn .btn-prev { position:absolute; left:0; background-color:#f8f8f8; border:1px solid #edf0f6; font-size:1rem; }
.view_btn .btn-next { position:absolute; right:0; background-color:#f8f8f8; border:1px solid #edf0f6; font-size:1rem; }

/* 시술후기 view */
.bo_v_img { width:100%; aspect-ratio:4 / 2.5; }
.bo_v_img img { width:auto; max-width:100%; height:100%; }
.bo_v_img .caption { font-size:1.5rem; padding:0.75rem; text-transform:uppercase; font-weight:600; }
/*.img-before { border:4px solid #ccc; background-color:#fff; }*/
/*.img-after { border:4px solid #7c94c4; background-color:#7c94c4; }*/

.icon-BA-arrow { width:1.063rem; height:1.25rem; position:absolute; left:50%; top:50%; margin-left:-0.5315rem !important; margin-top:-1.25rem !important; background:url("/img/icon-arrow03-hover.png") no-repeat center/cover; }

/* 시술후기 list */
.gall_img { position:relative; }
.gall_img a { display:flex; justify-content:center; overflow:hidden;}
.gall_img .bo_v_img { width:50%; }
/*.gall_img .bo_v_img.blur img { filter:blur(8px); -webkit-filter:blur(8px); }*/
.gall_img .bo_v_img.blur { position:relative; }
.gall_img .bo_v_img.blur:after { content:""; display:inline-block; position:absolute; left:0; top:0; width:100%; height:100%; backdrop-filter: blur(8px); -webkit-backdrop-filter: blur(8px); -moz-backdrop-filter: blur(8px); -ms-backdrop-filter: blur(8px); -o-backdrop-filter: blur(8px); background:url("./img/icon-lock.png") no-repeat center/auto; }


.gall_img .caption { height:1.625rem; line-height:1.625rem; font-size:0.875rem; }

.gall_text_href { margin-top:0.938rem; }
.gall_text_href .bo_tit { font-size:1.375rem; color:#343434; font-weight:500; }

.gall_img .icon-BA-arrow { width:1.063rem; height:1.25rem; margin-left:-0.5315rem !important; margin-top:-0.625rem !important; }

@media (max-width:991px) {
	#bo_v .d-flex { flex-direction:column; }
	.bo_v_img { position:relative; }
	.bo_v_img .caption { position:absolute; left:0; right:0; bottom:0; }
	#bo_v .d-flex .icon-BA-arrow { transform:rotate(90deg); top:calc(50% + 0.75rem); }
	
	.gall_img a { flex-direction:column; }
	.gall_img .bo_v_img { width:100%; }
	.gall_img .icon-BA-arrow { transform:rotate(90deg); top:50%; }
}