@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: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
#0066e5

*/

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

/*--------------------------------------------------- 해드세팅 ----------------------------------------------------------------------------*/
.header_wrap { 
position:fixed; right:0; top:0; width:100%; z-index:2000; background: #fff; box-shadow:0 0 10px rgba(0,0,0,0.2);
}

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

.logo { padding-right: 10rem; }
.logo a { 
display: block; width: 11.3rem; height: 6.3rem;
background-image: url(img/logo.png); background-repeat: no-repeat; background-position: 0 0; background-size:100%;
}


/* menu */
.header_wrap .menu_box { flex:1; }
.header_wrap .menu_box .outer { display:flex; flex-wrap:wrap;  }
.header_wrap .menu_box .outer > li { position: relative; margin-right: 10rem; }
.header_wrap .menu_box .outer > li > a { display: block; font-size: 2.8rem; transition:0.3s; color: #333; font-weight: bold; }

/* 고객센터 */
.header_wrap .menu_box .outer > li.other { margin-left: auto; margin-right: 3.7rem; position: relative; }
.header_wrap .menu_box .outer > li.other:after { 
content: '|'; position: absolute; right: -3.7rem; top: 50%; transform:translateY(-45%);
}
.header_wrap .menu_box .outer > li.other > a { font-size: 1.8rem; }
.header_wrap .menu_box .outer > li.other > a i { font-size: 2.8rem; margin-right: 5px; transform:translateY(3px); }

/* inner */
.header_wrap .menu_box .outer > li > .inner {
position:absolute; left:50%; transform:translateX(-50%); top:100%; z-index:1; padding-top: 10px; display: none;
}
.header_wrap .menu_box .outer > li > .inner > .bar { width: 60%; height: 8px; background: #0066e5; margin: 0 auto; }
.header_wrap .menu_box .outer > li > .inner > ul {
border: 1px solid #0066e5; padding: 30px 25px; background: #fff;
}
.header_wrap .menu_box .outer > li > .inner > ul > li { margin-bottom: 16px; }
.header_wrap .menu_box .outer > li > .inner > ul > li:last-child { margin-bottom: 0; }
.header_wrap .menu_box .outer > li > .inner > ul > li > a { 
display: block; font-size: 1.8rem; font-weight: 500; transition:0.3s;
}

/* sign */
.header_wrap .signWrap { margin-left: 5.5rem; position: relative; }
.header_wrap .signWrap > a { display: block; font-size: 1.8rem; transition:0.3s; color: #333; font-weight: bold; pointer-events:none; }
.header_wrap .signWrap > .sign { 
position:absolute; left:50%; transform:translateX(-50%); top:100%; z-index:1; padding-top: 15px; display: none;
}
.header_wrap .signWrap > .sign > .bar { width: 60%; height: 8px; background: #0066e5; margin: 0 auto; }
.header_wrap .signWrap > .sign > ul {
border: 1px solid #0066e5; padding: 30px 25px; background: #fff;
}
.header_wrap .signWrap > .sign > ul > li { margin-bottom: 16px; }
.header_wrap .signWrap > .sign > ul > li:last-child { margin-bottom: 0; }
.header_wrap .signWrap > .sign > ul > li > a { 
display: block; font-size: 1.8rem; font-weight: 500; transition:0.3s;
}

/* hover */
.header_wrap .menu_box .outer > li:hover > a { color: #0066e5; }
.header_wrap .menu_box .outer > li:hover > .inner { display: block; }
.header_wrap .menu_box .outer > li > .inner > ul > li > a:hover { color: #0066e5; }
.header_wrap .signWrap:hover > a { color: #0066e5; }
.header_wrap .signWrap:hover > .sign { display: block; }
.header_wrap .signWrap > .sign > ul > li > a:hover { color: #0066e5; }



/* 페이지 및 게시판 이동하면 해당 메뉴 스타일 */
.header_wrap .menu_box .outer > li > a.on { color: #0066e5; }




@media (max-width:991px) {
	.logo { padding-right: 6rem; }

	.header_wrap .menu_box .outer > li { margin-right: 6rem; }

	.header_wrap .signWrap { margin-left: 4rem; }
}

@media (max-width:768px) {
	#header { height: 9.412rem; }

	.logo { position: absolute; left: 50%; top: 50%; transform:translate(-50%,-50%); padding-right: 0; }
	
	/* 모바일 열기 버튼 */
	.header_wrap .open_btn { order:1; font-size:25px; cursor:pointer; color:#000;}


	/* menu */
	.menu_box { 
	background-color:#fff; width: 75%; height: 100%; display: block;
	position: fixed; left:-75%; top: 0; z-index:9999; transition:0.3s;
	}
	#h_menu {
	width: 100%; height: 100%; overflow-x: hidden; overflow-y:auto; position: absolute;  top:0; padding: 0 20px;
	}
	

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

	.header_wrap .signWrap { order:3; }
	.header_wrap .signWrap > a { font-size: 12px; }
	.header_wrap .signWrap > .sign > ul > li > a { font-size: 12px; }


	.header_wrap .menu_box .outer { display: block; }
	.header_wrap .menu_box .outer > li { margin-right: 0; padding:10px 0; border-bottom: 1px solid #eee; }
	.header_wrap .menu_box .outer > li > a { margin: 15px 0 10px; }
	.header_wrap .menu_box .outer > li:first-child > a { margin-top: 0; }

	.header_wrap .menu_box .outer > li.other { margin-right: 0; }
	.header_wrap .menu_box .outer > li.other:after { 
	content: '\f0d7'; font-family: fontAwesome; position: absolute; right: 10px; top: 32px; font-size: 18px;
	}
	.header_wrap .menu_box .outer > li.other > a { font-size: 2.769rem; pointer-events:none; }
	.header_wrap .menu_box .outer > li.other > a i { display: none; }


	/* inner */
	.header_wrap .menu_box .outer > li > .inner {
	position:static; transform:translateX(0); display: none;
	}
	.header_wrap .menu_box .outer > li > .inner > .bar { display: none; }
	.header_wrap .menu_box .outer > li > .inner > ul {
	border: none; padding: 0 5px;
	}
	.header_wrap .menu_box .outer > li > .inner > ul > li { margin-bottom:14px; }
	.header_wrap .menu_box .outer > li > .inner > ul > li:last-child { margin-bottom: 0; }
	.header_wrap .menu_box .outer > li > .inner > ul > li > a { 
	display: block; font-size: 14px; font-weight: 500; transition:0.3s;
	}
	
	

	
	

	/* hover */
	.header_wrap .menu_box .outer > li:hover > .inner { display:none; } /* 모바일일때 inner 나오게 하는 후버 효과 X */


	/* 모바일메뉴박스 보이게 하는 클래스 */
	.menu_box.inactive { left: 0; box-shadow:0 0 20px rgba(0,0,0,0.2); } 

	/* 모바일에서 outer li 클릭했을때 inner 나오는 효과 */
	.header_wrap .menu_box .outer > .other.on > .inner { display:block; }
	.header_wrap .menu_box .outer > .other.on { border-bottom:1px solid transparent; }
	.header_wrap .menu_box .outer > .other.on:after { transform: rotate(180deg) translateY(7px); }
}
/*--------------------------------------------------- 해드세팅 끝 ----------------------------------------------------------------------------*/



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

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



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

footer > .contents_box { padding: 30px 0; }
footer .contents {
-ms-display:flex; -ms-flex-wrap:wrap; -ms-align-items:center; -ms-justify-content:center;
display:flex; flex-wrap:wrap; align-items:center; justify-content:center;
 text-align: center;
}
footer .contents > li { font-weight: 300;  }

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:8px; font-weight: inherit;  }
footer .item2 > .text > span:after { content:'|'; display: inline-block; margin-left: 8px; font-size: 11px; transform:translateY(-2px); }
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; }
}

/*--------------------------------------------------- 푸터세팅 끝 ----------------------------------------------------------------------------*/



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



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






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


.ik_index_frame {padding: 30px 0 60px 0; background: #fafbfb;}
.ik_index_frame .index_frame01 {}
.ik_index_frame .index_frame01 .frame01_text1 {font-size: 36px; color:#888; font-weight: 500; padding: 50px 0;}
.ik_index_frame .index_frame01 .frame01_text1 span {color:#0066e5; font-weight: 700;}