@charset "utf-8"; 
/* copyright(c) WEBsiting.co.kr */

/* 게시판 목록 */

#bo_gall {margin: 70px auto 8%; overflow:hidden; width: 63%;}
#bo_gall #bo_btn_top{
    margin: 0 0 30px 0;
}
#bo_gall h2 {margin:0; padding:0; width:1px; height:1px; font-size:0; line-height:0; overflow:hidden}
#bo_gall #fboardlist{
    margin-bottom: 40px;
}
#bo_gall #gall_ul {
    display: flex;
    flex-wrap: wrap;
    gap: 1.52vw;
    padding:0; 
    list-style:none; 
    overflow:hidden;
 }
#bo_gall .gall_box {
    position:relative; 
    /* margin:10% 6%;  */
    overflow:hidden;
    border: 2px solid #dfe0e7;
 }
#contents_area .pg_wrap {
	clear: both;
	float: none;
	display: block;
	text-align: center;
	position: relative;
	z-index: 2;
	margin-top: -5%;
	margin-bottom: 1%;
}
#contents_area .pg_wrap  .pg_current {
	background: #9d9d9d;
	border: 2px solid #000000;
	line-height: 28px;
}
@media screen and (max-width:1024px) {
    #bo_gall {
        width: 80%;
        margin: 8% auto 12%;
    }
    #bo_gall #gall_ul {
        gap: 3vw;
        justify-content: space-between;
    }
}
@media screen and (max-width:767px) {
    #bo_gall {
        width: 90%;
        margin: 10% auto 18%;
    }
	#bo_gall .gall_box {position:relative; overflow:hidden; }
	
}

#bo_gall .gall_li .gall_chk{position:absolute; top:7px; left:13px; z-index:1; }

.gall_row > li.gallWST{position:relative; margin-left:-0.03em; }

.gall_row  > li.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; float:left; }
.gall_row  > li.gallWST.col-gn-0,.latest_row .col-gn-1,.gall_row  > li.gallWST.col-gn-1{width:100% !important; }
.gall_row  > li.gallWST.col-gn-2{width:50% !important; }
.gall_row  > li.gallWST.col-gn-3{width:31.7% !important; }
.gall_row  > li.gallWST.col-gn-4{width:25% !important; }
.gall_row  > li.gallWST.col-gn-5{width:20% !important; }
.gall_row  > li.gallWST.col-gn-6{width:16.66666667% !important; }
.gall_row  > li.gallWST.col-gn-7{width:14.28571428% !important; }
.gall_row  > li.gallWST.col-gn-8{width:12.5% !important; }
.gall_row  > li.gallWST.col-gn-9{width:11.11111111% !important; }
.gall_row  > li.gallWST.col-gn-10{width:10% !important; }

@media screen and (max-width:1024px) {
    #bo_gall .gall_li{
        width: 48% !important;
    }
}

#bo_gall .gall_now .gall_text_href a {color:#ffff33}

#bo_gall .gall_href a:link, #bo_gall .gall_href a:focus, #bo_gall .gall_href a:hover {text-decoration:none}
#bo_gall .gall_boxa{overflow:hidden; text-align:center; position:relative;}
#bo_gall .gall_boxa a,#bo_gall .gall_img .no_image,#bo_gall .gall_img .is_notice{display:block}
#bo_gall .gall_boxa a .iconPs{font-style:normal; position:absolute; top: 4px; right:10px; z-index:1; padding: 0;}
#bo_gall .gall_boxa a .icoNotice{ display: inline-block;	padding: 5px;	background-color: #feead1;	border-radius: 3px;	color: #f08468;	font-size: 12px;	font-weight: 700;	border: 1px solid #f08468; }
#bo_gall .gall_boxa a > img{display:block; width:100% !important; min-width:100%; height:auto !important; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease; }
#bo_gall .gall_boxa a b{display:block; position:absolute; left:0px; top:50%; height:30px; line-height:30px; margin-top:-15px; color:#999; font-size:12px; font-family:verdana; letter-spacing:2px; font-weight:normal; width:100%; }
#bo_gall .gall_boxa .gall_info{font-style:normal; position:absolute; left:0px; bottom:-50%; text-align:center; width:100%; height:20px; color:#fff; ; font-size:0.92em; line-height:20px; margin-top:-10px; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease; }
#bo_gall .gall_boxa .gall_info strong{ display:inline-block; margin:0 0 0 10px }
#bo_gall .gall_boxa .gall_info i{font-size:12px}
#bo_gall .gall_boxa .gall_info .gall_date{font-style:italic; display:inline-block; color:#fff; }
#bo_gall .gall_boxa .gall_info u{display:block; color:#fff; text-decoration:none; }
#bo_gall .gall_boxa .gall_info u .sv_member{color:#fff; }
#bo_gall .gall_boxa a .imgAr{display:block; width:100%; max-width:100%; min-width:100%; height:auto; overflow:hidden; }
#bo_gall .gall_boxa a .imgAr img{display:block; width:100%; max-width:100%; min-width:100%; height:auto; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease; }

#bo_gall .gall_boxa a .youtube_img{display:block; width:100%; max-width:100%; min-width:100%; position:relative; height:auto; overflow:hidden; background:#333; }
#bo_gall .gall_boxa a .youtube_img sup{display:block; position:absolute; left:0px; top:0px; right:0px; bottom:0px; width:100%; overflow:hidden; background-repeat:no-repeat; background-size:auto 200%; background-position:center center; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease; }
#bo_gall .gall_boxa a .youtube_img sub,
#bo_gall .gall_boxa a .youtube_img sub img{display:block; height:auto; width:100%; max-width:100%; min-width:100%; filter:Alpha(opacity=0); opacity:0; -moz-opacity:0; }
#bo_gall .gall_box:hover .gall_boxa a .youtube_img sup{background-size:auto 220%; filter:Alpha(opacity=50); opacity:0.5; -moz-opacity:0.5; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease; }

#bo_gall .gall_box:hover .gall_info{bottom:50%; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease; }
#bo_gall .gall_box:hover .gall_boxa{background:#222; }
#bo_gall .gall_box:hover .gall_boxa a .imgAr{width:100%; height:auto; filter:Alpha(opacity=50); opacity:0.5; -moz-opacity:0.5; -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease; }
#bo_gall .gall_box:hover .gall_boxa a .imgAr img{filter:Alpha(opacity=50); opacity:0.5; -moz-opacity:0.5; transform: scale(1.05); -webkit-transition-duration: 0.2s; -webkit-transition-timing-function: ease; transition-duration: 0.2s; transition-timing-function: ease; }

.fa-youtube-play{font-size:22px !important; vertical-align:middle; }

#bo_gall .gall_text_href {
    background: #e1e1e8;
 }
#bo_gall .gall_text_href a{
 display: flex;
 justify-content: space-between;
 align-items: center;
}
#bo_gall .gall_text_href img {margin:0 0 0 4px}
#bo_gall .bo_tit{display:block; color:#333; font-size:1rem; overflow:hidden; text-overflow:ellipsis; white-space:nowrap; text-align:center; padding: 15px;}
#bo_gall .bo_tit .cnt_cmt{background:#5c85c1; color:#fff; font-size:11px; height:20px; line-height:20px; padding:0 5px; border-radius:3px; vertical-align:middle; }
#bo_gall .profile_img img{border-radius:50%}
#bo_gall .gall_name{margin:10px}
#bo_gall .bo_cate_link{display:block; filter:Alpha(opacity=50); opacity:0.5; -moz-opacity:0.5; text-align:center; font-size:11px; }

.noDataArea{margin-bottom:20px; }

#bo_btn_btm{
	display: flex;
    align-items: center;
    justify-content: end;
    margin-top: 20px;
}
#bo_sch {
    width: 330px;
    border: 1px solid #ccc;
    background: #fff;
    border-radius: 3px;
}
#bo_sch select {
    border: 0;
    margin: 9px 5px;
    height: 20px;
    float: left;
    border-right: 1px solid #ddd;
    background: #fff;
}
#bo_sch .sch_input {
    height: 38px;
    width: 55%;
    border: 0;
    padding: 0;
    background-color: transparent;
    float: left;
}
#bo_sch .sch_btn {
    height: 38px;
    float: right;
    background: none;
    border: 0;
    width: 40px;
    font-size: 15px;
}

@media screen and (max-width:1024px) {
    #bo_btn_btm{
        flex-direction: column;
        gap: 15px;
    }
}

/* 목록 버튼 */
#bo_gall a.btn_b01 {border-radius: 5px; padding:0 30px;}
#bo_gall a.btn_b01:focus, #bo_gall a.btn_b01:hover {}
#bo_gall a.btn_b02 {border-radius: 3px; background: #548ebc; padding:0 27px;line-height: 32px; color: #fff; font-size: 1.2em;}
#bo_gall a.btn_b02:focus, #bo_gall a.btn_b02:hover {background:#014190; }
#bo_gall a.btn_admin {border-radius: 5px;} /* 관리자 전용 버튼 */
#bo_gall a.btn_admin:focus, #bo_gall .btn_admin:hover {}
a.btn_admin, .btn_admin {border-radius: 5px; background: #fff !important; color: #777777 !important; border:1px solid #e3e3e3 !important; padding:0 5px;line-height: 30px;}
a.btn_admin:hover, .btn_admin:hover {background: #ddd !important;}


/* ------------------------- view.skin ------------------------- */
#bo_v {
    margin: 4% auto 8%;
    width: 60%;
}
#bo_v_title{
    margin-bottom: 2%;
}
#bo_v_title .bo_v_tit{
    font-size: 2rem;
    word-break: break-all;
    font-weight: 600;
    margin: 0;
}
#bo_v_info{
    color: #666;
    padding: 0;
    margin: 0;
    border: none;
}
#bo_v_info .if_date{
    margin: 0;
    color: #777;
    font-size: 0.9rem;
}
#bo_v_atc {
    min-height: 200px;
    height: auto !important;
    margin-top: 5%;
    padding: 1.9rem 6% 0;
    border-top: 1px solid #333;
}
#bo_v_top {
    zoom: 1;
    margin: 4% auto 0;
    width: fit-content;
}
#bo_v_con img{
    width: 80%;
}
@media screen and (max-width:1024px) {
    #bo_v {
        margin: 8% auto 12%;
        width: 90%;
    }
    #bo_v_con{
        padding: 3% 5% 0;
    }
    #bo_v_con img{
        width: 100%;
    }
}
@media screen and (max-width:768px) {
    #bo_v {
        margin: 10% auto 18%;
    }
}

/* 게시물 하단 버튼 */
#bo_v_top {
    zoom: 1;
    margin: 4% auto 0;
    width: fit-content;
}
#bo_v_top ul {
    display: flex;
    justify-content: center;
    gap: 10px;
    padding: 0;
    list-style: none;
    word-break: break-all;
}
#bo_v a.btn_b03 {
    border-radius: 5px;
    background: #4a5164;
    padding: 5px 60px;
    color: #fff;
    border: 1px solid #4a5164;
    line-height: 30px;
    font-size: 1.1em;
    height: auto;
}
#bo_v a.btn_b01 {
    border-radius: 5px;
    background: #fff;
    padding: 5px 60px;
    color: #333;
    border: 1px solid #333;
    line-height: 30px;
    font-size: 1.1em;
    height: auto;
}
@media screen and (max-width:768px) {
    #bo_v_top {
        margin-top: 10%;
    }
    #bo_v_top ul {
        gap: 6px;
    }
    #bo_v a.btn_b01, #bo_v a.btn_b03 {
        padding: 5px 33px;
    }
}

/* 이전글,다음글 */
.bo_v_nb {
    margin: 5rem 0 0;
    position: relative;
    clear: both;
    text-align: left;
}
.bo_v_nb li {
    border-top: 1px solid #f1f1f1;
    padding: 20px 30px;
    font-size: 1rem;
}
.bo_v_nb li:last-child {
    border-bottom: 1px solid #f1f1f1;
}
.bo_v_nb li .nb_tit {
    display: inline-block;
    padding-right: 5rem;
    color: #333;
    font-weight: 600;
}
.bo_v_nb li i {
    font-size: 16px;
    padding-right: 10px;
}
.bo_v_nb li .nb_date {
    float: right;
    color: #b3b3b3;
}
@media screen and (max-width:768px) {
    .bo_v_nb li {
        padding: 15px 20px;
        font-size: 0.85rem;
    }
    .bo_v_nb li .nb_tit {
        padding-right: 2rem;
    }
    .bo_v_nb li a{
        display: inline-block;
        max-width: 160px;
    }
}


/* ------------------------- 글쓰기 ------------------------- */
#bo_w {
    width: 60%;
    margin: 0 auto;
}
#bo_w #fwrite {margin:4rem auto;}
#bo_w .flex{
    display: flex;
    align-items: center;
    justify-content: space-between;
    border-top: 2px solid #ccc;
    border-bottom: 1px solid #ccc;
}
#bo_w .list_tit {
    width: 5%;
    font-size: 1rem;
    font-weight: 500;
    text-align: center;
    padding: 16px 0;
    background: #eee;
}
#bo_w .bo_w_tit .frm_input {
    padding: 0 100px 0 10px;
    width: 78%;
}
#bo_w .btn_submit {
    border-radius: 5px;
    background: #014190;
    padding: 0 30px;
}

@media all and (max-width: 800px)
{
	.gall_row .box_clear{clear:none; }
	.gall_row  > li.col-gn-0,.gall_row  > li.gallWST.col-gn-3,.gall_row  > li.gallWST.col-gn-4,.gall_row  > li.gallWST.col-gn-5,.gall_row  > li.gallWST.col-gn-6,.gall_row  > li.gallWST.col-gn-7,.gall_row  > li.gallWST.col-gn-8,.gall_row  > li.gallWST.col-gn-9,.gall_row  > li.gallWST.col-gn-10
	{width:33.33333333% !important; }
	.gall_row  > li.gallWST.col-gn-1,.gall_row  > li.gallWST.col-gn-2{width:50% !important; }
}
@media all and (max-width: 680px)
{
	.gall_row  > li.col-gn-0,.gall_row  > li.gallWST.col-gn-3,.gall_row  > li.gallWST.col-gn-4,.gall_row  > li.gallWST.col-gn-5,.gall_row  > li.gallWST.col-gn-6,.gall_row  > li.gallWST.col-gn-7,.gall_row  > li.gallWST.col-gn-8,.gall_row  > li.gallWST.col-gn-9,.gall_row  > li.gallWST.col-gn-10
	{width:50% !important; }
	.gall_row  > li.gallWST.col-gn-1,.gall_row  > li.gallWST.col-gn-2{width:100% !important; }
}