@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@300;400;500;700&display=swap');

.clear:after { 
    content:""; 
    display:block; 
    clear:both;
}
* { margin:0; padding:0; outline:none; }
body {
line-height:1; font-size:14px; font-weight:400; color:#000; font-family: 'Noto Sans KR', sans-serif; word-wrap: break-word; word-break: keep-all;
overflow-x: hidden;
}
h1, h2, h3, h4, h5, h6 { margin:0; font-family: 'Noto Sans KR', sans-serif; line-height:1;  }
ul, ol { list-style:none; margin:0; }
a { outline:0; text-decoration:none; }
a:focus { outline:none; }
img { border:none; outline:none; max-width: 100%; }

p { margin:0; padding:0; word-wrap: break-word; word-break: keep-all;  }

/* html 폰트 사이즈 */

@media (max-width:1400px) {
	html { font-size: 9px; }
}
@media (max-width:1200px) { 
	html { font-size: 8.5px; }
}
@media (max-width:991px) { 
	html { font-size: 8px; }
}
@media (max-width:767px) { 
	html { font-size: 7.5px; }
}
@media (max-width:480px) {
	html { font-size: 6.5px; }
}

/*
mainColor
#25988c

*/

/* container */
.containerV1 { width: 1400px; margin: 0 auto; max-width: 100%; }
@media (max-width:1400px) {
	.containerV1 { padding: 0 15px; }
}

/*--------------------------------------------------- 해드세팅 ----------------------------------------------------------------------------*/
.header_wrap { 
position:fixed; right:0; top:0; width:100%; z-index:2000; transition:0.2s; background: #fff; border-bottom: 2px solid #25988c;
}

#header { 
-ms-display:flex; -ms-justify-content:space-between; -ms-align-items:center;
display:flex; justify-content:space-between; align-items:center;

}

.logo a { 
display: block; width: 24rem; height: 4.7rem; transition:0.2s;
background-image: url(img/logo.png); background-repeat: no-repeat; background-position: 0 0; background-size:100%;
}


/* menu */
/*---------------------------------------- outer ---------------------------------------------*/
#h_menu .outer { -ms-display:flex; display:flex; }
#h_menu .outer > li { position:relative; margin-right: 7.5rem; } 
#h_menu .outer > .siteMapBefore { margin-right: 6rem; } /* 사이트맵 버튼 전 li */
#h_menu .outer > li:last-child { margin-right: 0; }
#h_menu .outer > li > a {
display:block; font-size:18px; text-align:center; transition:0.3s; color: #313131; height: 9.8rem; line-height: 9.8rem;
}
/*---------------------------------------- //outer ---------------------------------------------*/


/*---------------------------------------- inner ---------------------------------------------*/
#h_menu .outer > li > .inner {
position:absolute; right:0; top:100%; z-index:1; border-top:5px solid #25988c;
width:20rem; background:#fff; padding:10px 0; display:none; box-shadow:0 5px 5px rgba(0,0,0,0.2);
}
#h_menu .outer > li > .inner > li > a  { display:block; transition:all 0.3s; padding:15px 20px; font-size:15px; text-align:right;  }
/*---------------------------------------- //inner ---------------------------------------------*/



/* hover */
#h_menu .outer > li:hover > a { color:#25988c; }
#h_menu .outer > li:hover > .inner { display:block; } 
#h_menu .outer > li > .inner > li > a:hover { color:#fff; background:rgba(37,152,140,.8); } 


/* 스크롤 했을 때 해드 효과 */
.header_wrap.scroll { border-bottom: 1px solid #25988c; }
.header_wrap.scroll #header { height: 7.8rem;  }
.header_wrap.scroll .logo a { background-size:90%; }
.header_wrap.scroll #h_menu .outer > li > a { height: 7.8rem; line-height: 7.8rem; }


/* 페이지 및 게시판 이동하면 해당 메뉴 스타일 */
#h_menu .outer > li > a.on { color:#25988c; font-weight: 500; } 





@media (max-width:1400px) {
	#h_menu .outer > li { position:relative; margin-right: 5rem; } 
	#h_menu .outer > li:last-child { margin-right: 0; }
	#h_menu .outer > li > a { font-size: 16px; }
}



@media (max-width:991px) {
	.header_wrap { transition:none; }

	#header { height: 9.412rem; }

	.logo a { transition:none; }
	
	/* 모바일 열기 버튼 */
	.header_wrap .open_btn { font-size:25px; cursor:pointer; color:#000;}


	/* menu */
	.menu_box { 
	background-color:#25988c; width: 20em; height: 100%; 
	position: fixed; right:0; top: 0; z-index:9999; margin-right:-20em; transition:margin-right 0.3s;
	}
	#h_menu {
	width: 20em; height: 100%; overflow-x: hidden; overflow-y:auto; position: absolute;  top:0; 
	}

	/* 모바일닫기버튼 */
	.close_btn { width:50px; height:50px; margin-right:auto; margin-left:0; cursor:pointer; }
	.close_btn > i { display:block; color:#fff; text-align:center; line-height:50px; font-size:30px; }
	
	

	/*---------------------------------------- outer ---------------------------------------------*/
	#h_menu .outer { flex-wrap:wrap; padding:30px 0; border-top:1px solid rgba(255,255,255,.1); }
	#h_menu .outer > li { width:100%; margin-right: 0; }
	#h_menu .outer > .siteMapBefore { margin-right: 0; }
	#h_menu .outer > li > a { 
	padding:12px 20px; font-weight:500; color:rgba(255,255,255,0.7); text-align:left; height:auto; line-height:1; border-bottom:1px solid rgba(255,255,255,.4);
	font-size: 16px; pointer-events:none;
	}
	#h_menu .outer > .innerNone > a { pointer-events:auto; } /* inner메뉴가 없는 li */
	/*---------------------------------------- //outer ---------------------------------------------*/

	/*---------------------------------------- inner ---------------------------------------------*/
	#h_menu .outer > li > .inner { 
	position:static; width:100%; padding:0; margin-left:30px; border-left:1px solid rgba(255,255,255,0.4); background:none; border-top:none; border-bottom: none;
	box-shadow:none;
	}
	#h_menu .outer > li > .inner > li:last-child > a { border-bottom:none; }
	#h_menu .outer > li > .inner > li > a { padding:10px 0 10px 15px; font-size: 14px; position:relative; text-align:left; color:#fff; }
	#h_menu .outer > li > .inner > li > a:before { 
	content:''; position:absolute; left:-3px; top:50%; transform:translateY(-50%); width:6px; height:6px; border-radius:50%; background:#fff; 
	}
	/*---------------------------------------- //inner ---------------------------------------------*/
	

	/* hover */
	#h_menu .outer > li:hover > a { color:#fff; }
	#h_menu .outer > li:hover .inner { display:none; } /* 모바일일때 inner 나오게 하는 후버 효과 X */
	#h_menu .outer > li > .inner > li > a:hover { color:#fff; background:none; } 


	/* 모바일메뉴박스 보이게 하는 클래스 */
	.menu_box.inactive { margin-right:0; } 

	/* 모바일에서 outer li 클릭했을때 inner 나오는 효과 */
	#h_menu .outer > li.on > a { border-bottom:1px solid transparent; }
	#h_menu .outer > li.on .inner { display:block; }

	/* 스크롤 했을 때 해드 효과 */
	.header_wrap.scroll #header { height: 7.294rem; }
	.header_wrap.scroll #h_menu .outer > li > a { height: auto; line-height: 1; }

	/* 페이지 및 게시판 이동하면 해당 메뉴 스타일 */
	#h_menu .outer > li > a.on,
	.header_wrap.scroll #h_menu .outer > li > a.on { color:#fff; } 
}
/*--------------------------------------------------- 해드세팅 끝 ----------------------------------------------------------------------------*/



/*--------------------------------------------------- 인덱스세팅 ----------------------------------------------------------------------------*/
/* 인덱스 타이틀 박스 */
.index .titleBox .text1 { font-size: 4rem; font-weight: bold; line-height: 1.3; }
.index .titleBox .text1 .type1 { color: #000; }
.index .titleBox .text1 .type2 { color: #25988c; }
.index .titleBox .h_line1 { width: 6.9rem; height: 0.5rem; background: #25988c; }
.index .titleBox .text2 { font-size: 16px; line-height: 1.6; }
@media (max-width:768px) {
	.index .titleBox .text2 { font-size: 14px; }
}

/* 인덱스 더보기1 */
.index .more1 { width: 16rem; text-align: center; }
.index .more1 > a { display: block; height: 4rem; line-height: 3.8rem; transition:0.3s; }

/* section1 */
.index .section1 { padding: 13rem 0 17rem; }
.index .section1 .topBox {
-ms-display:flex; -ms-flex-wrap:wrap; -ms-justify-content:space-between; -ms-align-items:center;
display:flex; flex-wrap:wrap; justify-content:space-between; align-items:center;
margin-bottom: 3.5rem;
}
.index .section1 .topBox .titleBox .text1 { margin-bottom: 13px; }
.index .section1 .topBox .titleBox .h_line1 { margin-bottom: 15px; }
.index .section1 .topBox .titleBox .text2 { font-weight: 500; color: #898989; }
.index .section1 .topBox .more1 > a { background: #25988c; border: 1px solid #25988c; color: #fff; font-size: 15px; }
.index .section1 .topBox .more1 > a:hover { background: #fff; color: #25988c; }

.index .section1 .itemBox {
-ms-display:flex; -ms-flex-wrap:wrap; -ms-align-items:center;
display:flex; flex-wrap:wrap; align-items:center;
}
.index .section1 .itemBox > .img1 { width: 66.71%; padding-right: 3.57%; }
.index .section1 .itemBox > .textBox { width: calc( 100% - 66.71% ); }
.index .section1 .itemBox > .textBox > .box1 { padding: 0 1.07% 3.21%; }
.index .section1 .itemBox > .textBox > .box1 > .text1 { font-size: 3.5rem; font-weight: bold; color: #25988c; line-height: 1.2; margin-bottom: 2.19%; }
.index .section1 .itemBox > .textBox > .box1 > .text2 { font-size: 1.8rem; font-weight: 500; color: #000; line-height: 1.5; }
.index .section1 .itemBox > .textBox > .listWrap1 { border-top: 1px solid #25988c; padding: 1.71% 1.07% 3.21%; }
.index .section1 .itemBox > .textBox > .listWrap1 > .text1 { font-size: 2rem; font-weight: 500; color: #000; line-height: 1.4; margin-bottom: 4px; }
.index .section1 .itemBox > .textBox > .listWrap1 > .list1 { margin-left: 1.75%;  }
.index .section1 .itemBox > .textBox > .listWrap1 > .list1 > li { padding-left: 2.68%; font-size: 16px; color: #626262; line-height: 1.6; position: relative; }
.index .section1 .itemBox > .textBox > .listWrap1 > .list1 > li:before {
content: ''; position: absolute; left: 0; top: 9px; width: 6px; height: 6px; border-radius:50%; background: #25988c;
}

@media (max-width:1200px) {
	.index .section1 .itemBox > .textBox > .listWrap1 > .list1 > li { font-size: 13px; }
	.index .section1 .itemBox > .textBox > .listWrap1 > .list1 > li:before { top: 8px; width: 4px; height: 4px; }
}
@media (max-width:991px) {
	.index .section1 .itemBox > .textBox > .listWrap1 > .list1 > li { font-size: 12px; }
	.index .section1 .itemBox > .textBox > .listWrap1 > .list1 > li:before { top: 9px; width: 3px; height: 3px; }
}
@media (max-width:768px) {
	.index .section1 .topBox .titleBox { width: 100%; margin-bottom: 20px; }
	.index .section1 .topBox .more1 > a { font-size: 13px; }

	.index .section1 .itemBox > .img1 { width: 100%; padding-right: 0; margin-bottom: 3rem; }
	.index .section1 .itemBox > .textBox { width: 100%; }
	.index .section1 .itemBox > .textBox > .box1 > .text2 { font-size: 13px; font-weight: bold; }
}


/* section2 */
.index .section2 { padding: 8rem 0; background: #f8f8f8; position: relative; }
.index .section2:before { 
content: ''; position: absolute; left: 0; bottom: 0; width: 100%; height: 41.3rem;
background-image: url(img/index_section2_bg1.jpg); background-repeat: no-repeat; background-position: center center; background-size:cover;
}
.index .section2 .containerV1 { position: relative; }
.index .section2 .titleBox { margin-bottom: 5.5rem; text-align: center; }
.index .section2 .titleBox .text1 { margin-bottom: 13px; }
.index .section2 .titleBox .h_line1 { margin:0 auto 2rem; }
.index .section2 .titleBox .text2 { color: #535353; }

.index .section2 .more1 { margin: 5.5rem auto 0; }
.index .section2 .more1 > a { background: transparent; border: 1px solid #fff; color: #fff; font-size: 15px; }
.index .section2 .more1 > a:hover { background: #fff; color: #25988c; border: 1px solid #25988c; }

@media (max-width:768px) {
	.index .section2 .more1 { width:18.667rem; }
	.index .section2 .more1 > a { font-size: 13px; }
}

/* section3 */
.index .section3 { padding: 13rem 0; }
.index .section3 .containerV1 { 
-ms-display:flex; -ms-flex-wrap:wrap;
display:flex; flex-wrap:wrap;
}
.index .section3 .titleBox { width: 25%; padding-left: 0.71%; margin-top: 1.2rem; padding-right: 15px; }
.index .section3 .titleBox .text1 { margin-bottom: 13px; }
.index .section3 .titleBox .h_line1 { margin:0 0 15px; }
.index .section3 .titleBox .text2 { color: #535353; margin-bottom: 3.5rem; }
.index .section3 .more1 > a { background: #25988c; border: 1px solid #25988c; color: #fff; font-size: 15px; }
.index .section3 .more1 > a:hover { background: #fff; color: #25988c; }

.index > .section3 .slideBox { width: calc( 100% - 25% ); height:100%; }

@media (max-width:1200px) {
	.index .section3 .titleBox .text2 br { display: none; }
}
@media (max-width:991px) {
	.index .section3 .titleBox { width: 100%; padding-left: 0; margin-top: 0; padding-right: 0; margin-bottom: 30px; }
	.index > .section3 .slideBox { width: 100%; }
}
@media (max-width:768px) {
	.index .section3 .more1 { width:18.667rem; }
	.index .section3 .more1 > a { font-size: 13px; }
}

/* section4 */
.index .section4 { 
padding: 10rem 0 8rem; background: url(img/index_section4_bg1.jpg) no-repeat center center / cover; background-attachment: fixed; overflow: hidden;
}
.index .section4 .titleBox { text-align: center; color: #fff; }
.index .section4 .titleBox .text3 { font-size: 4rem; text-transform: uppercase; line-height: 1.3; margin-bottom: 2rem; }
.index .section4 .titleBox .h_line1 { margin:0 auto 3.5rem; }
.index .section4 .titleBox .text2 { margin-bottom: 5.5rem; }
.index .section4 .more1 { margin: 0 auto; }
.index .section4 .more1 > a { background: #25988c; border: 1px solid #25988c; color: #fff; font-size: 15px; }
.index .section4 .more1 > a:hover { background: #fff; color: #25988c; }
@media (max-width:1200px) {
	.index .section4 .titleBox .text2 br { display: none; }
	.index .section4 .more1 { width:19.667rem; }
	.index .section4 .more1 > a { font-size: 13px; }
}


/* section5 */
.index .section5 { padding: 10rem 0; }
.index .section5 .containerV1 {
-ms-display:flex; -ms-flex-wrap:wrap; -ms-align-items:center;
display:flex; flex-wrap:wrap; align-items:center;
}
.index .section5 .containerV1 > .leftItem {
width: calc( 50% - 2rem ); margin-right: 2rem; background: url(img/index_section5_imgV1.jpg) no-repeat center center / cover; 
padding: 9.29% 6.07% 11.43%;
}
.index .section5 .containerV1 > .leftItem .titleBox { color: #fff; }
.index .section5 .containerV1 > .leftItem .titleBox .text1 { margin-bottom: 15px; }
.index .section5 .containerV1 > .leftItem .titleBox .h_line1 { margin-bottom: 15px; }
.index .section5 .containerV1 > .leftItem .titleBox .text2 { font-weight: 500; margin-bottom: 15px; }
.index .section5 .containerV1 > .leftItem .more1 > a { background: #25988c; border: 1px solid #25988c; color: #fff; font-size: 15px; }
.index .section5 .containerV1 > .leftItem .more1 > a:hover { background: #fff; color: #25988c; }
.index .section5 .containerV1 > .leftItem .more2 { margin-top: 8px; }

.index .section5 .containerV1 > .rightItem { width: 50%; } 
.index .section5 .containerV1 > .rightItem .topBox { 
-ms-display:flex; -ms-flex-wrap:wrap; -ms-justify-content:space-between; -ms-align-items:flex-end;
display:flex; flex-wrap:wrap; justify-content:space-between; align-items:flex-end;
border-bottom: 1px solid #535353; margin-bottom: 3.5rem;
}
.index .section5 .containerV1 > .rightItem .topBox .titleBox .text1 { margin-bottom: 0.5rem; }
.index .section5 .containerV1 > .rightItem .topBox .more3 { width: 5rem; text-align: center; }
.index .section5 .containerV1 > .rightItem .topBox .more3 > a { 
display: block; height: 5rem; line-height: 5rem; background: #25988c; color: #fff; font-weight: 300; font-size: 4rem;
}

@media (max-width:1200px) {
	.index .section5 .containerV1 > .leftItem .titleBox .text2 br { display: none; }
}
@media (max-width:991px) {
	.index .section5 .containerV1 > .leftItem { width: 100%; margin-right: 0; margin-bottom: 30px; }
	.index .section5 .containerV1 > .leftItem .more1 { display: inline-block; }
	.index .section5 .containerV1 > .leftItem .more2 { margin-left: 5px; }
	.index .section5 .containerV1 > .rightItem { width: 100%; }
}
@media (max-width:768px) {
	.index .section5 .containerV1 > .leftItem .more1 { width:18.667rem; }
	.index .section5 .containerV1 > .leftItem .more1 > a { font-size: 13px; }
}






/*--------------------------------------------------- 인덱스세팅 끝 ----------------------------------------------------------------------------*/



/*--------------------------------------------------- 푸터세팅 ----------------------------------------------------------------------------*/
/* footer_box*/
footer { background: #313131; }

footer > .contents_box { padding: 30px 0; }
footer .contents {
-ms-display:flex; -ms-flex-wrap:wrap; -ms-align-items:center;
display:flex; flex-wrap:wrap; align-items:center;
}
footer .contents > li { font-weight: 300;  }
footer .contents > li:nth-child(1) { width: 25%; }

footer .item2 > div { line-height: 1.6; font-size: 13px; color: #fff; }
footer .item2 > div a { color: inherit;}
footer .item2 > .text > span { position: relative; margin-right:10px; font-weight: inherit;  }
footer .item2 > .text > span:after { content:'|'; position:absolute; right:-8px; top:50%; transform:translateY(-55%); }
footer .item2 > .text > span:last-child:after { display: none; }
footer .item2 > .copy { text-transform: uppercase; font-weight: inherit; }




footer > .info_box { padding:10px 0; background:#1b1b1b; }


footer > .info_box .info { 
-ms-display:flex; -ms-justify-content:center; -ms-flex-wrap:wrap; 
display:flex; justify-content:center; flex-wrap:wrap; 
text-align: center;
}
footer .info > .item { position:relative; }
footer .info > .item:before { content:''; position:absolute; right:7px; top:50%; transform:translateY(-50%); width:1px; height:13px; background:#fff; }
footer .info > .item:last-child:before { display:none; }
footer .info > .item > a { display:block; color:#fff; font-size:13px; font-weight:500; line-height:1.8; margin-right:15px;  }

@media (max-width:1200px) {
footer .contents > li:nth-child(1) { width: auto; margin-right: 40px; }
}

@media (max-width:991px) {
footer .contents > li:nth-child(1) { width: 100%; margin-right: 0; margin-bottom: 20px; }
}

@media (max-width:768px) {
footer .item2 > .text > span { display:block; margin-right:0; }
footer .item2 > .text > span:after { display:none; }

footer .item2 { margin-top: 20px; }
}
@media (max-width:450px) {
footer > .info_box .info {  }
footer .info > .item { width:50%; }
footer .info > .item:nth-child(1) { order:1; }
footer .info > .item:nth-child(2) { order:4; }
footer .info > .item:nth-child(3) { order:3; }
footer .info > .item:nth-child(4) { order:2; }
footer .info > .item:before { right: 0; }
footer .info > .item:nth-child(2n):before { display:none; }
footer .info > .item > a { margin-right: 0; }
}
/*--------------------------------------------------- 푸터세팅 끝 ----------------------------------------------------------------------------*/

/* 해드 높이값 만큼 띄워주기 , 반응형 체크 , 서브페이지일시 체크 (해드가 fixed이기 때문,안 띄워주면 타이틀이미지 해드 높이값 만큼 짤림) */
.wrap { padding-top: 10rem; }
@media (max-width:991px) {
	.wrap { padding-top: 9.412rem; }
}



/* 서브페이지 패딩 */
.tmt_sub_frame { padding:30px 0 50px; min-height: 80vh; }



/* 게시판 및 게시판헤드 등 기타 버튼들 기본컬러 변경 */
.btn.btn-color {border: 1px solid #25988c; background-color: #25988c;}
.btn.active.btn-color, .btn.btn-color:hover, .btn.btn-color:focus, .btn.btn-color:active {background-color: #25988c;}
.border-color, i.border-color, img.border-color {border-color: #25988c;}


/* 모바일 사이즈에서도 위 위젯설정 버튼 보이게 */
@media (max-width:767px) {
	#style-switcher { display: block !important; }
}
