@charset "UTF-8";

/* @import url('https://webfontworld.github.io/pretendard/Pretendard.css'); */
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/static/pretendard.min.css");
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100..900&display=swap');
@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.9/dist/web/variable/pretendardvariable.min.css");

/*
	사용시 각 게시판 list.skin에 #bo_list에 해당 클레스 추가

	1. 공지사항 기본리스트 - 
	2. 좌측 이미지 갤러리 리스트 - notice_photo
*/

/* set */
body {margin:0;padding:0;font-size:0.75em; font-family: 'Noto Sans KR', 'Pretendard Variable', Pretendard, dotum, sans-serif; background:#fff; overflow-x:hidden;}
body.active ,
body.fixed{position: fixed; width: 100%; height: 100%; overflow: hidden; }
html, h1, h2, h3, h4, h5, h6, form, fieldset, img {margin:0;padding:0;border:0}
h1, h2, h3, h4, h5, h6 {font-size:1em;}
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section {display:block}
em{font-style:normal;}
ul, dl,dt,dd {margin:0;padding:0;list-style:none}
legend {position:absolute;margin:0;padding:0;font-size:0;line-height:0;text-indent:-9999em;overflow:hidden}
label, input, button, select, img {vertical-align:middle;font-size:1em}
input, button {margin:0;padding:0;font-size:1em}
input[type="submit"]{cursor:pointer}
button {cursor:pointer}
textarea,
select{font-size:1em;}
select{margin:0;}
p{margin:0; padding:0; word-break:break-all;}
hr{display:none;}
pre{font-size:1.1em; overflow-x:scroll;}
a{color:#000; text-decoration:none;}
*,
:after,
:before{
    box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box;
    word-break: break-all !important;
}
input[type=text],
input[type=password],
textarea{-webkit-transition:all 0.30s ease-in-out; -moz-transition:all 0.30s ease-in-out; -ms-transition:all 0.30s ease-in-out; -o-transition:all 0.30s ease-in-out; outline:none;}

/* pagenation */
.pg_wrap {clear:both;margin: 50rem 0 140rem;text-align:center}
.pg_wrap:after {display:block;visibility:hidden;clear:both;content:""}
.pg_page, .pg_current {display:inline-block;vertical-align:middle;}
.pg a:focus, .pg a:hover {text-decoration:none}
.pg_page {position:relative; color:#333;font-size: 16rem;height:30rem;line-height:28rem;  text-decoration:none;width: 50rem;height: 50rem;border-radius: 5rem;display: flex;align-items: center;justify-content: center;margin: 0 3rem;overflow: hidden;padding: 0;font-family: 'Noto Sans KR', 'Pretendard Variable', dotum, sans-serif;}
.pg_page:before{opacity:0; content:''; position:absolute; left:0; right:0; bottom:0; width:100%; height:2rem; background:#2d52a7;}

.pg_start {text-indent:-999rem;background: url('../img/base/arr_end.png') no-repeat 50% 50%;-webkit-transform: rotate(180deg);transform: rotate(180deg);}
.pg_prev {text-indent:-999rem;background: url('../img/base/arr_next.png') no-repeat 50% 50%;-webkit-transform: rotate(180deg);transform: rotate(180deg);margin-right: 50rem;}
.pg_end {text-indent:-999rem;background: url('../img/base/arr_end.png') no-repeat 50% 50%;}
.pg_next {text-indent:-999rem;background: url('../img/base/arr_next.png') no-repeat 50% 50%;margin-left: 50rem;}

.pg_current {position:relative;font-size: 16rem;color: #0ba3d6;width: 43rem;height: 43rem;display: flex;border: 1px solid #0ba3d6;justify-content: center;align-items: center;border-radius: 35rem;font-weight: 400;}

span.pg{display:flex; justify-content:center; align-items:center;}

/* board set */
.gall_subject{margin-top:30px;}
.custom_btn{display:flex !important; justify-content:center; align-items:center; position:absolute; left:50%; width:220px; height:67px !important; background:#32a26c !important; font-size:18px; transform:translateX(-50%); border-radius:100px;}

#bo_v_title .bo_v_tit{display:block; line-height:1.3em; padding:10px 0; font-weight:bold; font-size:32px; color:#333; text-align:left; letter-spacing:-.05em; max-width:80%;}
#bo_v_top{padding-top:50px; border-top:1px solid; zoom:1;}

/* board-certify set */
.gallery_certify #bo_gall #gall_ul li > a{height:auto !important;}
.gallery_certify #bo_gall #gall_ul li:nth-child(4) ~ li{margin-top:10px;}
.gallery_certify #bo_gall #gall_ul li{margin:0;}
.gallery_certify #bo_gall .gall_img{display:block; position:relative; overflow:hidden; width:100%; height:100%; padding:24px; background:#fafafa;}

.colum4_board{gap:50px;}
.colum4_board > li{width:calc((100% / 4) - 38px); width:-webkit-calc((100% / 4) - 38px); margin-right:0 !important;}

/* board-gallery set */
.colum3_board{gap:40px;}
.colum3_board > li{width:-webkit-calc((100%/3) - 27px); width:calc((100%/3) - 27px);}
.colum3_board > li:nth-child(3) ~ li{margin-top:5% !important;}
.colum3_board .gall_info{overflow:hidden; margin-top:7px; font-weight:400; font-size:16px; color:#888; white-space:nowrap; text-overflow:ellipsis;}

/* notice photo left set */
/* 사용시 list스킨에 #bo_list에 클레스 notice_photo 추가 */
.notice_photo .notice_icon{position:absolute; top:0; right:0; padding:3px 10px; background:#ba1c22; font-weight:500; font-size:13px; color:#fff;}
.notice_photo .bo_list{margin: 0px 0 60px;}
.notice_photo .bo_list li{position:relative; display:block; width:100%;}
.notice_photo .bo_list li a{display: flex;align-items: center; width:100%;padding: 50px 0; box-sizing:border-box; border-bottom:1px solid #ddd;align-items: center;}
.notice_photo .bo_list li a .area_img{position:relative; overflow:hidden; overflow:Hidden; width:270px; height:190px; margin:0 50px 0 0;}
.notice_photo .bo_list li a .area_img img{position:absolute; top:50%; left:50%; width:100%; transition:all 0.3s ease; transform:translate(-50%, -50%) scale(1.0,1.0);}
.notice_photo .bo_list li:hover a .area_img img{transform:translate(-50%, -50%) scale(1.05,1.05);}
.notice_photo .bo_list li a .area_txt .area_bottom{display:block;}
.notice_photo .bo_list li a .subject{display:block; width:calc(100% - 350px); width:-webkit-calc(100% - 350px); box-sizing:border-box; text-align:left;}
.notice_photo .bo_list li a .subject h3{display:block; display:-webkit-box; overflow:hidden;line-height: 1.4;font-weight: 600; font-size:20px; color:#222; word-break:break-all; text-overflow:ellipsis;-webkit-line-clamp:1;-webkit-box-orient:vertical;width: 90%;}
.notice_photo .bo_list li a .subject p{display:block; display:-webkit-box; overflow:hidden; margin-top:9px; font-weight:300;font-size: 16rem; color:#666;  text-overflow:ellipsis;-webkit-line-clamp:1;-webkit-box-orient:vertical;}
.notice_photo .bo_list li a .subject .lt_date i{margin-left:15px; padding-left:15px; border-left:1px solid #eee; font-weight:500; color:#c3c3c3; font-style:normal;}
.notice_photo .bo_list li a .subject .lt_date{display:block;margin: 42px 0 0;font-weight: 600;font-size: 14px;color: #1777c1;font-family: 'Noto Sans KR', 'Pretendard Variable', dotum, sans-serif;}
.notice_photo .bo_list li a:after{content:""; display:block; visibility:hidden; clear:both;}
.notice_photo .bo_list li a:hover{text-decoration:none;}
.notice_photo .bo_list li a:hover .datetime h2{color:#ba1c22;}
.notice_photo .bo_list li a:hover .datetime span,
.notice_photo .bo_list li a:hover .datetime h2,
.notice_photo .bo_list li a:hover .subject h3{color: #1777c1 !important;}
.notice_photo .datetime{display:flex; justify-content:center; align-items:center; margin:0 50px; text-align:center; flex-direction:column;}
.notice_photo .datetime h2{line-height:0.8em; font-weight:bold; font-size:48px !important; color:#d9d9d9 !important; transition:all 0.3s ease;}
.notice_photo .datetime span{display:block; margin:10px 0 0; font-weight:bold; font-size:16px; color:#d9d9d9; transition:all 0.3s ease;}
.notice_photo .subject .bcont{display:block; display:-webkit-box; overflow:hidden; width:100%; line-height:1.4em; margin:19px 0 0; font-weight:400; font-size:16px; color:#666; white-space:nowrap; word-break:break-all; text-overflow:ellipsis; -webkit-line-clamp:1; -webkit-box-orient:vertical;}

/* notice only tit */
/* 사용시 list스킨에 #bo_list에 클레스 .notice_photo.data 추가 */
.notice_photo.data .bo_list li a .subject .lt_date{margin:0; min-width:210px;color: #ccc;}
.notice_photo.data .bo_list li a .subject{display:flex; justify-content:space-between; width:100%;}
.notice_photo.data .bo_list li a .subject h3{font-size:18px;}
.notice_photo.data .bo_list{border-top:2px solid #222;}
.notice_photo.data .bo_list li a{padding: 40rem 0;}


@media (max-width:1400px){
	.colum3_board > li{width:-webkit-calc((100%/3) - 27px); width:calc((100%/3) - 27px);}
}

@media (max-width:1279px){
	.colum4_board{gap:30px;}
	.colum4_board > li{width:calc((100% / 4) - 23px); width:-webkit-calc((100% / 4) - 23px);}

	.colum3_board > li:nth-child(3) ~ li{margin-top:1% !important;}	
	.colum3_board .gall_subject{font-size:21px;}

	.gallery_certify .gall_subject{margin-top:25px;}
}

@media (max-width:1024px){
	.notice_photo .bo_list li a{padding:30px;}
	.notice_photo .bo_list li a .area_img{margin:0 30px 0 0; width:220px; height:150px;}
	.notice_photo .bo_list li a .subject{width:calc(100% - 250px);}
}

@media (max-width:1023px){
	#bo_gall #gall_ul{margin-top:43px;}

	.colum4_board > li{width:calc((100% / 3) - 20px); width:-webkit-calc((100% / 3) - 20px);}

	.colum3_board{gap:20px;}
	.colum3_board > li{width:-webkit-calc((100%/3) - 14px); width:calc((100%/3) - 14px);}
	.colum3_board .gall_subject{margin-top:22px; font-size:19px;}
}

@media (max-width:850px) {
	.notice_photo .bo_list li a{padding:30px 20px;}
	.notice_photo .bo_list li a .subject .lt_date{margin:10px 0 0;}
}

@media (max-width:767px){
	.colum4_board{gap:18px;}
	.colum4_board > li{width:calc((100% / 2) - 9px); width:-webkit-calc((100% / 2) - 9px);}
	
	.gallery_certify .gall_subject{margin-top:19px;}
	.gallery_certify > article{padding-bottom:0 !important;}
	.gallery_certify #bo_gall .gall_img{padding:18px;}

	#bo_v_title .bo_v_tit{font-size: 25rem; max-width:100%;line-height: 1.4;}
	#bo_v_info .if_date{display:block; position:relative; top:0; font-size:11rem;}
	#bo_v_top{margin-bottom: 0; padding-top:20px;}
	
	.custom_btn{width:170px; height:63px !important; font-size:16px;}

	.colum3_board{gap:15px;}
	.colum3_board > li{width:-webkit-calc((100%/2) - 8px); width:calc((100%/2) - 8px);}
	.colum3_board li:nth-child(2) ~ li{margin-top:20px !important;}
	.colum3_board #gall_ul{margin-top:33px;}
	.colum3_board .gall_info{margin-top:2px; font-size:15px;}

	.notice_photo .bo_list li a .area_img{margin:0 20px 0 0; width:160px; height:110px;}
	.notice_photo .bo_list li a .subject{width:calc(100% - 180px);}  

	.pg_current{width:40rem; height:40rem; font-size:15rem;}
	.pg_page{width:40rem; height:40rem; font-size:15rem;}
	.pg_end,
	.pg_start,
	.pg_next,
	.pg_prev{background-size:12rem;}
	.pg_wrap{margin:30px 0 80rem;}
}

@media (max-width:650px) {
	.notice_photo .bo_list li a{padding: 20rem 0;}
	.notice_photo .bo_list li a .area_img{margin:0 18px 0 0;}
	.notice_photo .bo_list li a .subject h3{font-size:18px;}
	.notice_photo .bo_list li a .subject .lt_date{font-size: 15rem; margin:7px 0 0;}

	.notice_photo .bo_list li a .subject h3{height:31rem;}
	.notice_photo.data .bo_list li a .subject .lt_date{min-width: 229rem;display: flex;align-items: center;}
}

@media (max-width:540px) {
	.notice_photo .bo_list li a .area_img{margin:0 20px 0 0; width:140px; height:100px;}
	.notice_photo .bo_list li a .subject{width:calc(100% - 160px);}
	.notice_photo .bo_list li a .subject h3{font-size:17px;}
	.notice_photo .bo_list li a .subject .lt_date{font-size:14px; margin:5px 0 0;}
	.notice_photo .bo_list li a .subject h3{height:19rem;}
	.notice_photo.data .bo_list li a{padding:15rem 0;}
	.notice_photo .bo_list li a .subject .lt_date i{display:none;}
	.notice_photo.data .bo_list li a .subject .lt_date{display:flex; align-items:center; min-width:auto;}
	.notice_photo .bo_list li a .subject h3{width:81%;}
	.notice_photo.data .bo_list li a .subject h3{margin-right:10rem;font-size: 14rem; word-break:break-all;}
	
	.notice_photo_view #bo_v_info .if_date{margin-top:5rem;}		

	.pg_page{width:30rem; height:40rem; font-size:15rem;}
}

@media (max-width:450px) {
	.notice_photo:not(.data) .bo_list li a{padding: 0rem 0;display: flex;flex-direction: column;border: none;}
	.notice_photo .bo_list li a .area_img{min-width: auto;width: 100%;height: 179rem;margin: 0;}
	.notice_photo:not(.data) .bo_list li a .subject{width:100%;margin-top: 21rem;}
	.notice_photo .bo_list li a .subject h3{font-size: 17rem;width: 90%;word-break: break-all;height: 21rem;}
	.notice_photo .bo_list li a .subject .lt_date{font-size:13px;margin: 15px 0 0;}
	.notice_photo .bo_list li a .subject p{font-size:15rem;}
	.notice_photo:not(.data) .bo_list li:not(:first-child){margin-top: 37rem;}
}

@media (max-width:359px){
	.colum3_board > li{width:100%;}
	.colum3_board li:nth-child(1) ~ li{margin-top:20px;}
}

@media (max-width:320px){
	.colum4_board > li{width:100%;}
}