@charset "utf-8";
/* @import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard.css'); */
/* @import url('https://webfontworld.github.io/naver/NanumSquareRound.css'); */
@import url("fonts.css");
@import url('https://cdn.jsdelivr.net/gh/orioncactus/pretendard/dist/web/static/pretendard-dynamic-subset.css');

/* pretendard 웹폰트 굵기 
Light 300
Regular 400
Medium 500
SemiBold 600
Bold 700
ExtraBold 800
Heavy 900
*/

/* NanumSquareRound 웹폰트 굵기 
Light 300
Regular 400
Bold 700
ExtraBold 800
*/




* { 
font-family: 'NanumSquareRound', sans-serif; font-weight:400; font-size:16px; color:#111;
}
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, 
acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, 
sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, 
caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, 
footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video
{font-family: 'NanumSquareRound', sans-serif; font-weight:400; font-size:16px; color:#111; box-sizing:border-box; line-height:1.35;
	letter-spacing: -0.03em;}
a {text-decoration:none;}

html {	
	/* Prevent font scaling in landscape */
	-webkit-text-size-adjust: none; /*Chrome, Safari, newer versions of Opera*/
	-moz-text-size-adjust: none; /*Firefox*/
	-ms-text-size-adjust: none;  /*Ie*/
	-o-text-size-adjust: none; /*old versions of Opera*/
}



input[type=text]:focus, input[type=password]:focus, textarea:focus, select:focus {box-shadow:none; -webkit-box-shadow:none; border:1px solid #333 !Important;}


#wrap {width:100%; position:relative;}
.layout {max-width: 1500px; width:100%; margin: 0 auto;}
/* .flex {display:flex;}
.flex_align-center {display:flex; align-items: center;}
.flex_between {display:flex; justify-content: space-between;}
.flex-center {display:flex; align-items: center; justify-content: center;}
.flex-center-between {display:flex; align-items: center; justify-content: space-between;} */




/******************* header *******************/
.header {
	background:#fff;	
	width: 100%;
	z-index: 99;
	height: 100px;
	transition:0.2s all ease;
}


/* header-inner */
.header-inner {
	width: 1500px;
	margin: 0 auto;
	max-width:100%;
	height: 100%;
	/* padding: 32px 0px; */
	display: flex;
	justify-content: space-between;
	align-items: center;
}
.header-inner .top-logo {
	position: relative;
	z-index: 9;
}
.header-inner .top-logo a {
	display: block;
	width: 320px;
	height: 67px;
	/* width: 233px;
	height: 49px; */
	background:url('/images/logo.png') center center no-repeat; 
	background-size: contain;
}
.header-inner .top-logo img {
	display: block;
	width: 100%;
	height: 100%;
}
.header-inner .btn-sitemap {
	display: block;
	width: 34px;
	height: 24px;
	position: relative;
	z-index: 9;
	border: 0;	
	background:url('/images/pc-sitemap-icon.svg') no-repeat;
	background-size: contain;
}

.header-inner .btn-mgnb {
	display: none;
	width: 42px;
	height: 23px;
	position: relative;
	z-index: 9;
	background: none;
	border: 0;	
	background:url('/images/btn-sitemap.svg') no-repeat;
	background-size: contain;
}



/* gnb */
.gnb-wrap {
	position: absolute;
	left: 0%;
	top: 0px;
	z-index: 4;
	width: 100%;
	height: 100px;
	display: flex;
	text-align: center;
	border-bottom: 1px solid #f0f0f0;
	/* overflow: hidden; */
	transition: 0.3s all ease;
}
.gnb-wrap .gnb-inner-wrap {
	width: 1500px;
	margin: 0 auto;
	height: 100px;
	padding-left: 470px;
}
.gnb {
	display: flex;
	position: relative;
}
.gnb .gnb-menu01 {
	position: relative;
}
.gnb .gnb-menu01 > a {
	font-size: 26px;
	font-weight: 700;
	position: relative;
	z-index: 5;
	display: flex;
	align-items: center;
	justify-content: center;
	height: 100px;
	padding: 0 53px;
}
.gnb .gnb-menu01 > a::before {
	position: absolute;
	left: 0;
	bottom: 0;
	content: '';
	display: block;
	width: 0;
	height: 4px;
	background: #f8b500;
	transition:0.25s width ease;
}
.gnb .gnb-menu02-list {
	position: absolute;
	top: 100px;
	width: 100%;
	visibility: hidden;
  opacity: 0;
	min-height: 345px;
	transition:0.1s all ease;
}
.gnb .gnb-menu02-list:before {
	position: absolute;
	left: 0;
	top: 0;
	width: 1px;
	height: 0;
	opacity: 0;
	content: '';
	display: block;
	background-color: #f0f0f0;
}
.gnb .gnb-menu02 {
	position: relative;
}
.gnb .gnb-menu02 a {
	font-size: 22px;
	padding: 15px 0px;
	display: flex;
	width: 100%;
	text-align: center;
	justify-content: center;
}

.dep02-bg {
	position: absolute;
	top: 100px;
	left: 0;
	width: 100%;
	height: 0;
	opacity:0;
	transition:0.4s all ease;
	z-index: 2;
	background-color: #fff;
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.03);
}

.dep02-bg:before {
	position: absolute;
	left: 92px;
	bottom: 0;
	/* content: ''; */
	display: block;
	width: 236px;
	height: 121px;
	background: url('/images/top-menu-bg.png') center center no-repeat;
	background-size: contain;
}




/* mgnb */
.mgnb-wrap {
	display: none;
	position: fixed;
	right: -100%;
	left: auto;
	top: 0;
	z-index: 99;
	width: 480px;
	height: 100%;
	background: #fff;
	padding: 30px 30px;
	display: block;
	overflow-y: scroll;
	transition: 0.8s ease all;
}
.mgnb-wrap:before {
	position: absolute;
	right: 30px;
	bottom: 30px;
	z-index: -1;
	content: '';
	display: block;
	width: 95px;
	height: 88px;
	background:url('/images/mo-menu-bg.svg');
}
.mgnb-wrap .mgnb-btn {
	display: flex;
	justify-content: flex-end;
}
.mgnb-wrap .mgnb {
	display: block;
	width: 100%;
	/* height: 100%; */
	margin-left: 0;
	margin-top: 30px;
}
.mgnb-wrap .mgnb .gnb-menu01 {	
	border-top: 1px solid #555;
}
.mgnb-wrap .mgnb .gnb-menu01 > a {
	position: relative;
	display: block;
	height: auto;
	padding: 20px 20px;
	text-align: left;
	color: inherit;
	background-color: #fff;
	font-size: 20px;
}
.mgnb-wrap .mgnb .gnb-menu01:last-child > a {
	border-bottom: 1px solid #555;
}
.mgnb-wrap .mgnb .gnb-menu01 > a::before {
	position: absolute;
	right: 20px;
	left: auto;
	top: 27px;
	display: block;
	content: "";
	width: 13px;
	height: 7px;
	background: url('/images/mobile-menu-arrow.svg') center center no-repeat;
	background-size: contain;	
}
.mgnb-wrap .mgnb .gnb-menu02-list {
	background: #f9f9f9;
	display: none;
	transition:initial;
	width: 100%;	
}
.mgnb-wrap .mgnb .gnb-menu02-list .gnb-menu02 {}
.mgnb-wrap .mgnb .gnb-menu02-list .gnb-menu02 a {
	display: block;
	padding: 15px 20px;
	text-align: left;
	font-size: 18px;
}
.gnb-bg {
	position: fixed;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.5);
	border-top:0;
	opacity:0;
	visibility: hidden;
	transition:0.3s all ease;
	z-index: 20;
}







.gnb.on .gnb-menu02-list {
	visibility: visible;
  opacity: 1;
	transition:0.1s all ease;
	transition-delay: 0.1s;
	pointer-events: all;
}

.header.on .dep02-bg {
	height: 375px;
	opacity:1;
	transition:0.4s all ease;
	transition-delay: 0.1s;
}




/************************ hover ************************/
@media (hover: hover) and (pointer: fine) {
	

	.gnb .gnb-menu01:hover > a {color: #f8b500;}
	.gnb .gnb-menu01:hover > a::before {
		width: 100%;		
		transition:0.2s width ease;
	}
	.gnb .gnb-menu02 a:hover {
		font-weight: 700;
		color: #f8b500;
	}
	

	

}
/************************ hover ************************/









/******************* sub_contents *******************/
/* sub_contents */
.sub-contents {
	width:100%;
	background-image: url('/images/sub-right-bg.png') ;
	background-position: right top 36px;
	background-size: 352px 698px;
	background-repeat: no-repeat;
}
.sub-visual {
	width:100%; 
	position: relative;
}

.sub-visual .sub-visual-inner {
	width: 1500px;
	max-width: 100%;
	height: 100%;
	margin: 0 auto;
	padding-top: 155px;
	position: relative;
	display: flex;
	flex-direction: column-reverse;
	gap: 12px;
}
.sub-visual .sub-title {
	font-weight:800; 
	font-size:40px; 
	word-break: keep-all;
}

.sub-menu-wrap {}
.sub-menu-wrap .sub-menu-inner {
	display: flex;
}
.sub-menu-wrap .sub-menu-inner .sub-menu01 {
	display: flex;
	justify-content: center;
	padding-right: 12px;
}
.sub-menu-wrap .sub-menu-inner .sub-menu01 img {
	width: 20px; 
	height: 19px;
	margin-top: -2px;
}
.sub-menu-wrap .sub-menu-inner .sub-menu01 a {
	display: flex;
	align-items: center;
	/* background-color: #f8b500; */
}
.sub-menu-wrap .sub-menu-inner .sub-menu-common {
	position: relative;
}
.sub-menu-wrap .sub-menu-inner .sub-menu-common .sub-menu-common-title {
	font-size: 25px;
	padding: 0 65px 0px 12px;
	position: relative;
	cursor: pointer;
}
.sub-menu-wrap .sub-menu-inner .sub-menu-common .sub-menu-common-title:before {
	position: absolute;
	right: 20px;
	top:50%;
	transform: translateY(-50%);
	content: '';
	display: block;
	width: 6px;
	height: 4px;
	background-color: #666;
	background: url('/images/submenu-arrow.svg') center center no-repeat;
	background-size: contain;
}

.sub-menu-wrap .sub-menu-inner .sub-menu-common .sub-menu-common-title:after {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	left: 0;
	width: 1px;
	height: 16px;
	content: '';
	display: block;
	background-color:#ddd;
}
.sub-menu-wrap .sub-menu-inner .sub-menu-common .sub-menu03-title {
	/* font-weight: 700; */
}
.sub-menu-wrap .sub-menu-inner .sub-menu-common .sub-menu-list {
	display: none;
	position: absolute;
	left: 0;
	top: 35px;
	z-index: 5;
	background-color: #fff;
	width: 100%;
	border:1px solid #ddd;
}
.sub-menu-wrap .sub-menu-inner .sub-menu-common .sub-menu-list li {}
.sub-menu-wrap .sub-menu-inner .sub-menu-common .sub-menu-list li a {
	display: flex;
	padding: 10px 12px;
	font-size: 18px;
}
.sub-menu-wrap .sub-menu-inner .sub-menu02 {
	position: relative;
}
.sub-menu-wrap .sub-menu-inner .sub-menu03 {
	position: relative;
}

.sub_contents_in {
	max-width: 100%;
	width: 1500px;
	min-height: 350px;
	margin: 0 auto;
	padding: 165px 0 224px;
}






/* page-load */
.page-load {
	display:flex;
	justify-content: center;
  gap: 15px;
	margin-top: 20px;
}

.page-load span {
	font-size: 14px;
  position: relative;
  display: block;
	color: #fff;
}

.page-load span:before {
	position: absolute;
  right: -9px;
  top: 50%;
  transform: translateY(-50%);
  content: "";
  display: block;
  width: 3px;
  height: 3px;
  background-color: red;
  border-radius: 50%;
  background-color: #ddd;
}

.page-load span:last-child:before {
	display:none;
}

/************************ hover ************************/
@media (hover: hover) and (pointer: fine) {
	

	.sub-menu-wrap .sub-menu-inner .sub-menu-common .sub-menu-list li a:hover {
		background-color:#f8b500;
		color: #fff;
	}
	

}
/************************ hover ************************/







/******************* footer *******************/
.footer {}
.footer .footer-inner {
	width: 1500px;
	max-width: 100%;
	margin: 0 auto;
}


.f-partner-wrap {border-top: 1px solid #ddd;}
.f-partner-wrap .footer-inner {
	position: relative;
}
.f-partner-wrap .f-partner {}
.f-partner-wrap .f-partner .f-partner-list {
	display: flex;
}
.f-partner-wrap .f-partner .f-partner-unit {
	/* flex: 1; */
	min-width: 0;
}
.f-partner-wrap .f-partner .f-partner-unit a {
	display: block;
	text-align: center;
}
.f-partner-wrap .f-partner .f-partner-unit img {
	width: auto;
	height: auto;
	max-width: 100%;
	object-fit: contain;
}
.f-partner-wrap .f-partner-btn {
	position: absolute;
	top: 50%;
	transform: translateY(-50%);
	z-index: 10;
	display: block;
	width: 23px;
	height: 45px;
	border: 0;
	background-color: transparent;
	background-repeat: no-repeat;
	background-size: contain;
	background-position: center center;
	padding: 0;	
	/* background-color: #999; */
}
.f-partner-wrap .f-partner-prev {
	background-image: url('/images/f-partner-prev.svg');
	left: -43px;
}
.f-partner-wrap .f-partner-next {
	background-image: url('/images/f-partner-next.svg');
	right: -43px;
}



.footer-info-wrap {
	background-color: #0b0d10;
	padding: 36px 0 76px;
}
.footer-info-wrap .footer-inner {}
.footer-info-wrap .footer-top {}
.footer-info-wrap .footer-top .inner {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
}
.footer-info-wrap .footer-top .footer-menu {
	display: flex;
	gap: 50px;
	margin-top: 12px;
}
.footer-info-wrap .footer-top .footer-menu a {
	font-size: 17px;
	color: #fff;
}
.footer-info-wrap .footer-top .footer-centerlist {position: relative;}
.footer-info-wrap .footer-top .footer-centerlist .tit {
	position: relative;
	display: flex;
	align-items: center;
	width: 282px;
	height: 62px;
	font-size: 17px;
	color: #fff;
	background-color: #2a2a2a;
	border:1px solid #2a2a2a;
	padding: 0 30px;
	border-radius: 50px;
	cursor: pointer;
}
.footer-info-wrap .footer-top .footer-centerlist .tit:before {
	position: absolute;
	right: 30px;
	top: 50%;
	transform: translateY(-50%);
	display: block;
	width: 8px;
	height: 6px;
	content: '';
	/* background-color: #fff; */
	background: url('/images/footer-centerall-arrow.svg') center center no-repeat;
	background-size: contain;
}
.footer-info-wrap .footer-top .footer-centerlist .tit.on {border: 1px solid #fff;}
.footer-info-wrap .footer-top .footer-centerlist .list {
	position: absolute;
	left: 0;
	bottom: 70px;
	width: 100%;
	height: 420px;
	overflow-y: scroll;
	background-color: #fff;
	border: 1px solid #ddd;
	border-radius: 16px 0 0 16px;
	display: none;
	z-index: 5;
}
.footer-info-wrap .footer-top .footer-centerlist .list.on {display: block;}

.footer-info-wrap .footer-top .footer-centerlist .list a {
	display: block;
	font-size: 16px;
	padding: 8px 30px;
}
.footer-info-wrap .footer-top .footer-centerlist .list .line {
	display: block;
	font-size: 16px;
	padding: 8px 30px;
	background-color: #efefef;
}


.footer-info-wrap .footer-bottom {
	margin: 40px 0 0;
}
.footer-info-wrap .footer-bottom .footer-info {
	display: flex;
	flex-direction: column;
	gap: 12px;
}
.footer-info-wrap .footer-bottom .footer-info-unit {
	display: flex;
	gap: 42px;
}
.footer-info-wrap .footer-bottom .footer-info-unit span {
	font-size: 16px;
	color: #c7c7c7;
}
.footer-info-wrap .footer-bottom .copyright {
	font-size: 16px;
	color: #c7c7c7;
	font-weight: 300;
	margin-top: 50px;
}








/************************************ hover ************************************/
@media (hover: hover) and (pointer: fine) {

	
.footer-info-wrap .footer-top .footer-menu a:hover {text-decoration: underline;}
.footer-info-wrap .footer-top .footer-centerlist .tit:hover {border: 1px solid #fff;}
.footer-info-wrap .footer-top .footer-centerlist .list a:hover {
	background-color: #ff6000;
	color: #fff;
}


}
/************************************ hover ************************************/



/* 반응형 중간기기 1600px 사이즈 이하*/
@media all and (max-width:1600px){
	.f-partner-wrap .f-partner-btn {display: none;}
}


/* 반응형 중간기기 1500px 사이즈 이하*/
@media all and (max-width:1500px){


	.header {padding: 0px 20px;}
	.gnb-wrap .gnb-inner-wrap {padding-left: 0;}
	.gnb {justify-content: center; margin-left: 257px;}
	.gnb .gnb-menu01 > a {padding: 0 42px;}


	.footer-info-wrap .footer-inner {padding: 0 20px;}
	.f-partner-wrap .f-partner-btn {display: none;}


	.sub-contents {
		background-size: 252px 500px;
		padding: 0 20px;
	}

	

}



/* 반응형 중간기기 1380px 사이즈 이하*/
@media all and (max-width:1380px){
	
	
	

}


/* 반응형 중간기기 1200px 사이즈 이하*/
@media all and (max-width:1200px){


	.header {
		border-bottom: 1px solid #f0f0f0;
		height: 90px;
	}
	.header-inner .top-logo a {
		width: 233px;
		height: 49px;
	}
	.ms-wrap {display: flex; gap: 45px; align-items: center;}
	.header-inner .btn-mgnb {
		display: block;
		/* background: url('/images/btn-sitemap-white.svg') no-repeat; */
		background-size:contain;
	}
	.header-inner .btn-sitemap {display: none;}
	.mgnb-wrap {
		display: flex;
		justify-content: flex-end;
	}
	.mgnb-wrap .btn-close {
		display: flex;
		width: 20px;
		height: 20px;
		font-size: 0;
		background: url('/images/btn-close-icon.svg') center center no-repeat;
		background-size: contain;
		border:0;
	}

	.gnb-wrap {display: none;}
	.mgnb-wrap {display: block;}

	.header.open {}
	.header.open .mgnb-wrap {
		right: 0;
		transition:0.5s ease all;
	}
	.header.open .gnb-bg {
		opacity: 1;
		visibility: visible;
		transition:0.2s all ease;
	}
	.mgnb-wrap .mgnb .gnb-menu01.on > a {
		/* background: #f8b500;
		color: #fff; */
		border-bottom: 1px solid #ddd;
	}
	/* .mgnb-wrap .mgnb .gnb-menu01.on > a::before {
		background-image: url('/images/mobile-menu-arrow-w.svg');
	} */

}



/* 반응형 중간기기 1100px 사이즈 이하*/
@media all and (max-width:1100px){

	


	
}



/* 반응형 중간기기 998px 사이즈 이하*/
@media all and (max-width:998px){



	


}



/* 반응형 중간기기 768px 사이즈 이하*/
@media screen and (max-width: 768px) {
	
	
	.header {height: 75px; padding: 0 15px;}	
	.header-inner .top-logo a {
		width: 180px;
		height: 38px;
	}
	.header-inner .btn-lang {
		height: auto;
		width: auto;
		border: 0;
	}


	.mgnb .gnb-menu01 > a {font-size: 18px;}
	.mgnb-wrap .mgnb .gnb-menu02-list .gnb-menu02 a {font-size: 16px;}



	.footer-info-wrap .footer-inner {padding: 0 15px;}
	.footer-info-wrap .footer-top .inner {
		flex-direction: column-reverse;
		gap: 10px;
	}
	.footer-info-wrap .footer-top .footer-menu {
		width: 100%;
		justify-content: center;
		gap: 24px;
	}
	.footer-info-wrap .footer-top .footer-menu a {} 
	.footer-info-wrap .footer-top .footer-centerlist {
		width: 450px;
		max-width: 100%;
		margin: 0 auto;
	}
	.footer-info-wrap .footer-top .footer-centerlist .tit {
		border: 1px solid #b6b6b6;
		background-color: transparent;
		width: 100%;
		height: 55px;
		padding: 0 20px;
	}
	.footer-info-wrap .footer-top .footer-centerlist .tit:before {right: 20px;}
	.footer-info-wrap .footer-top .footer-centerlist .list {
		height: 320px;
		border-radius: 16px;
	}


	.footer-info-wrap .footer-bottom .footer-info {gap: 8px;}
	.footer-info-wrap .footer-bottom .footer-info-unit {
		flex-direction: column;
		justify-content: center;
		gap: 8px;
	}
	.footer-info-wrap .footer-bottom .footer-info-unit span {text-align: center;}
	.footer-info-wrap .footer-bottom .copyright {text-align: center;}


	.sub-contents {
		padding: 0 15px;
		background-size: 151px 300px;
		background-position: right top 20px;
	}
	.sub-visual .sub-visual-inner {
		flex-direction: column;
		gap: 10px;
		padding-top: 125px;
	}
	.sub-visual .sub-title {font-size: 28px;}
	.sub-menu-wrap .sub-menu-inner .sub-menu01 {padding-right: 8px;}	
	.sub_contents_in {padding: 95px 0 145px;}
	



}



/* 반응형 중간기기 480px 사이즈 이하*/
@media screen and (max-width: 480px) {	

	.header {height: 60px; padding: 0px 15px;}
	.header-inner .top-logo a {
		width: 150px;
		height: 32px;
	}
	

	.ms-wrap {gap: 24px;}
	.header-inner .btn-mgnb {
		width: 28px;
		height: 16px;
	}


	.mgnb-wrap {
		width: 320px;
		padding: 30px 15px 30px;
	}
	.mgnb-btn {padding-right:15px;}
	.mgnb-wrap .mgnb .gnb-menu01 > a {
		font-weight: 700;
		font-size: 16px; 
		padding: 15px 20px;
	}
	.mgnb-wrap .mgnb .gnb-menu01 > a::before {top: 22px;}
	.mgnb-wrap .mgnb .gnb-menu02-list .gnb-menu02 a {padding: 10px 20px;}


	.footer-info-wrap .footer-top .footer-centerlist .tit {
		font-size: 15px;
		height: 48px;
	}
	.footer-info-wrap .footer-top .footer-menu a {font-size: 14px;}
	.footer-info-wrap .footer-bottom .footer-info-unit span {font-size: 14px;}
	.footer-info-wrap .footer-bottom .copyright {font-size: 14px;}



	.sub-contents {
		background-size: 101px 200px;
	}
	.sub-visual .sub-visual-inner {
		padding-top: 82px;
	}
	.sub-menu-wrap .sub-menu-inner .sub-menu01 {margin-top: -2px;}
	.sub-menu-wrap .sub-menu-inner .sub-menu01 img {
		width: 16px;
		height: 15px;
	}
	.sub-menu-wrap .sub-menu-inner .sub-menu-common .sub-menu-common-title {
		padding: 0px 35px 0px 12px;
		font-size: 15px;
	}
	.sub-menu-wrap .sub-menu-inner .sub-menu-common .sub-menu03-title {min-width: 105px;}
	.sub-menu-wrap .sub-menu-inner .sub-menu-common .sub-menu-common-title:before {right: 8px;}
	.sub-menu-wrap .sub-menu-inner .sub-menu-common .sub-menu-list li a {font-size: 14px;}


	


}



/* 반응형 중간기기 360px 사이즈 이하*/
@media screen and (max-width: 360px) {	


	.mgnb-wrap {width: 100%;}
	.sub-menu-wrap {display: none;}

}


/* 반응형 중간기기 320px 사이즈 이하*/
@media screen and (max-width: 320px) {	


	

}


