@charset "utf-8";
@import url('https://fonts.googleapis.com/css2?family=Wix+Madefor+Display:wght@400..800&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Noto+Sans+KR:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Titillium+Web:ital,wght@0,200;0,300;0,400;0,600;0,700;0,900;1,200;1,300;1,400;1,600;1,700&display=swap');
@import url('https://cdn.rawgit.com/moonspam/NanumSquare/master/nanumsquare.css');
@font-face {
	font-family: 'NanumSquareAceb';
	font-weight: 700;
	font-display: swap;
	src: local('NanumSquare_acEB'), url('/font/NanumSquare_acEB.ttf') format('truetype'), url('/font/NanumSquareOTF_acEB.otf') format('opentype');
}

/*Common*/
*{margin:0;padding:0}
html,body{width:100%;height:100%}

html{overflow-y:scroll;font-size:100%;}
body{background-color:#fff;*word-break:break-all;-ms-word-break:break-all;
-webkit-text-size-adjust: 100% !important;-moz-text-size-adjust: 100% !important;-ms-text-size-adjust: 100% !important;}
body,h1,h2,h3,h4,h5,h6,th,td,li,dt,dd,a,p,input,textarea,select,option,button{
	color:#222;
	font-family:"Wix Madefor Display","Noto Sans KR","돋움",dotum,sans-serif;
	font-size:14px;font-weight:normal; word-break: keep-all;
}
img,fieldset,iframe{border:0 none}
ul,ol,li{list-style:none}
em,address{font-style:normal}
img,input,select,textarea{vertical-align:middle}
a{color:#7d7d7d;text-decoration:none;cursor:pointer}
a:hover{color:#333;text-decoration:none}
button,label{cursor:pointer;_cursor /**/:hand}
button *{position:relative}
textarea{overflow:auto}
option{padding-right:6px}
.input_text, textarea{*margin:-1px 0;padding-right:1px}
.input_check, .input_radio{width:13px;height:13px}
.blind, legend, caption{text-indent:-9999px;font-size:0;line-height:0;overflow:hidden}
hr{display:none}
legend{*width:0}
:root legend{margin-top:-1px;font-size:0;line-height:0}
caption{*line-height:0}
img{max-width:100%;}
button{background: 0;outline:none;border:none;}
.font-tit{
font-family: "Titillium Web", sans-serif;
  font-weight:400;
  font-style: normal;
}
#bgblack{
display:none;
	position:fixed;left:0;top:0;z-index:4000;
	width:100%;height:100%;
	background:rgba(0,0,0,0.7);
}

/* header */
header{
	position:fixed;left:0;top:0;z-index:1000;
	width:100%;
	transition:all 0.4s;
	
}
header.scroll{top: 0;}
.head{
	box-sizing:border-box;
	position:relative;
	width:100%;
	height: 130px;
	margin:0 auto;padding:0 5.625rem;
	text-align:center;
	transition: all 0.4s;
}

header.up{
transform:translateY(-140px);
transition:transform 0.6s ease;
}
/* .head:before{
	display:block;content:"";
	box-sizing:border-box;
	width:100%;height:100%;
	padding:125px 0 0;
	background:rgba(255,255,255,0.9);
	position:absolute;left:0;top:0;z-index:-1;
	transform-origin:top;
	transition:all 0.4s;
} */
/* .head:after{
	display:block;content:"";
	box-sizing:border-box;
	width:96%;height:1px;
	position:absolute;left:2%;top:100%;
} */
.head .inner{position: relative;height: 100%;display: flex;justify-content: center;}
.head h1{position:absolute;left:0%;top:50%; transform: translateY(-50%); z-index:1000;}
.head h1 .logo{}
.head h1 .logo a{
	/* display:block;
	width:197px;height:36px;
	background:url(/images/common/logo1.png)no-repeat;
	text-indent:-9999px; */
	 width: 197px;
      height: 36px;
	display: block;
}
.head h1 .logo a img{opacity:0;}
.head h1 .slog{
	position: relative;
width:100%;height:auto;max-width:67vw;/* display: flex;justify-content:flex-end; */z-index:10;

}
.head h1 .slog a img{
	pointer-events:none;
	cursor:default;
	width:197px;
	padding-left: 2.3vw;
	box-sizing:border-box;
	background:url(/images/main/slog_logo.png)no-repeat right top / contain;
	/* transform:translateX(-45px) translateY(205px) scale(8); */
	transform: translateY(205px);transform-origin:right top; 
	/* width:1235px; */
	width:64.323vw;margin-right: 2.2vw;
	max-width:64.323vw;
}

.head .nav{position: relative; z-index: 1000; height: 100%;width: fit-content;}
.head .nav>ul{position: relative;display:flex;align-items:center;justify-content:center; height: 100%;}
.head .nav>ul.on:before{display:block; content:""; position:absolute; top:100%; left:0; width:100%; height:490px; background:#f5f5f5; z-index:0;}
.head .nav>ul>li{
	position:relative;
	padding:0 2.2vw;z-index:1000;
}
.head .nav>ul>li>a{font-size:1.06rem;font-family: "Wix Madefor Display";color:rgba(255,255,255,0.7);font-weight:500;}

.head .gnb{
	position:absolute;right:0;top: 50%; transform: translateY(-50%);
	display:flex;align-items:center; z-index: 2001;
}
.head .gnb>ul{display:flex;margin-right:2rem;}
.head .gnb>ul>li{margin-left:1.042vw;}
.head .gnb>ul>li>a{font-size:0.75rem;color:#fff;font-weight:400;}
.head .gnb .lang{}
.head .gnb .lang>a{position:relative;padding-right:13px;}
.head .gnb .lang>a:after{
	display:block;content:"";
	width:4px;height:4px;
	border-right:2px solid rgba(255,255,255,0.8);border-bottom:2px solid rgba(255,255,255,0.8);
	transform:rotate(45deg);
	position:absolute;right:0;top:3px;
}

.head .gnb .btn_menu{
	position:relative;z-index:5000;
	display:flex;flex-wrap:wrap;
	width:32px;
	margin:0 0 0 2rem;
	cursor:pointer;
	gap:8px;
}
.head .gnb .btn_menu>div{
	width:100%;height:3px;
	background:#fff;
	transition:all 0.4s;
}
.head .gnb .btn_menu>div:nth-child(2){width:67%;}
.head .gnb .btn_menu>div:nth-child(3){margin-bottom:0;}
.head .gnb .btn_menu.on>div{background:#000;}

.head .gnb .btn_menu.openmenu>div{background: #000;}
.head .gnb .btn_menu.openmenu>div:nth-child(1){transform:rotate(45deg) translate(5px, 10px);;}
.head .gnb .btn_menu.openmenu>div:nth-child(3){transform:rotate(-45deg) translate(5px, -10px);;}
.head .gnb .btn_menu.openmenu>div:nth-child(2){width:0;}

.head .links{
	position: absolute;
}
.head .links{
	overflow:hidden;
	display:flex;
	position:absolute;right:5.625rem;top:13px;
	width:260px;height:32px;
	box-shadow:0 0 1px #fff inset;
	border-radius:16px;
}
.head .links li{width:50%;height:100%;}
.head .links li a{
	display:flex;align-items:center;justify-content:center;
	width:100%;height:100%;
	font-size:0.81rem;color:rgba(255,255,255,0.7);
	border-radius:19px;
}
.head .links li.on a{background:#0086d1;color:#fff;}

@media screen and (max-width:1399px){
	.head h1 .slog a img{transform: translateY(170px);transform-origin:right top;} 
	.head{padding:0 4rem;}
	.head .links{right:4rem;}
	.head h1 .slog a img{margin-right: 2vw;max-width:60.323vw;width:60.323vw;padding-left: 2vw;}
	.head .nav{display: none;}
	.head .nav>ul>li>a{font-size:1rem;}
	.head .nav>ul>li{padding:0 1.6vw;}
	.head .gnb>ul{margin-right: 0;}
}

@media screen and (max-width:1200px){
.head .nav>ul{opacity:0;visibility:hidden;}
}
@media screen and (max-width:813px){
.head .nav>ul>li>a{font-size:0;line-height: 108px;}
.head{padding:0 2rem;}
.head .links {right: 2rem;}
.head h1 .slog{max-width:100%;}
.head h1 .slog a img{margin-right: 0vw;max-width:520px;width:100vw;}
.head .gnb>ul>li>a{font-size:11px;}
.head .gnb .btn_menu{margin-left: 10px;}
.head h1 .slog a img{transform: translateY(120px);transform-origin:right top;}
.head h1 .logo a {
	width: 140px;
	height: 25px;
}
.head .links{
	width: 195px;
	height: 28px;
}
.head .links li a{
	font-size: 9px;
}

}
@media screen and (max-width:640px){

.head h1 .slog a img{margin-right: 0vw;max-width:380px;width:100vw;}
}

@media screen and (max-width:499px){

.head h1 .slog a img{margin-right: 0vw;max-width:380px;width:82vw;}
}



header.nav-up{transform:translateY(-150%);}
header.nav-down{transform:translateY(0%);}

header.on .head{background: #134582;}
header.scroll .head{height: 90px; background: #134582}
header.scroll .head .links{display: none;}





.dropdown-container {
	position: absolute;
	top: 100%;
	left: 0;
	width: 100%;
	display: none;
	background: rgba(255,255,255,0.95);z-index:1000;
	border-top: 1px solid #dadde0;
}


.dropdown-menu {
	max-width:220px;
	list-style: none;
	padding: 40px 0 50px;
}

.dropdown-menu > li > a {
	color: white;
	padding: 12px 1vw;
	text-decoration: none;
	display: block;
	font-size: 16px;
	text-align: left;
	font-family: "Noto Sans KR";
	color:#000;
	white-space:nowrap;
}

.dropdown-menu > li > a:hover {
	
}
.dropdown-menu>li>.dep3{padding:12px 1vw;}
.dropdown-menu>li>.dep3>li{text-align: left;}
.dropdown-menu>li>.dep3>li + li{margin-top: 1vh;}
.dropdown-menu>li>.dep3>li>a{text-align: left;font-size:16px;color:#666666;font-weight: 400;font-family: "Noto Sans KR";position: relative;}
.dropdown-menu>li>.dep3>li>a:before{
position: absolute;content:'';
width:100%;height:1px;background: #fff;
left:0;bottom:0;
width: 0;transition:width 0.3s ease;
}
.dropdown-section {
	flex: 1;
	max-width:220px;
	padding: 0;
	border:1px solid #dadde0;
	border-top:0;border-bottom:0;border-right:0;
}
.dropdown-section:last-child{border-right:1px solid #dadde0;}

.dropdown-section:hover, .dropdown-section.on {
	background-color: #132650;
}
.dropdown-section.on .dropdown-menu > li > a,
.dropdown-section:hover .dropdown-menu > li > a{color:#fff;}
.dropdown-section.on .dropdown-menu>li>.dep3>li>a,
.dropdown-section:hover .dropdown-menu>li>.dep3>li>a{color:#fff;}
.dropdown-section .dropdown-menu>li>.dep3>li:hover>a:before{width:100%;}

/*allmenu*/
.allmenuBg{
	display:block;
	width:46px;height:46px;
	background: #fff;
	border-radius:50%;
	position:absolute;right:5.625rem;top:55px;z-index:1000;
	transform:translate(-50%,-50%) scale(0);
	/* transition:all 0.8s ease; */
	
	
}
.allmenuBg.on{transform:translate(-50%,-50%) scale(100);}
.allmenu{
	position:absolute;left:0;top:0;z-index:2000;
	box-sizing:border-box;
	width:100%;height:100vh;
	transform:scale(0);
	text-align:center;
	background:#fff url(/images/common/allmenu_bg.jpg)no-repeat center bottom / cover;

}
.allmenu .logo{
position: absolute;
top:52px;left:0;
padding: 0 5.625rem;
}
.allmenu.open{transform:scale(1);transition:transform 0s 0s;}
/*close*/
.allmenu.open > .all_close{
position: relative;top:4%;right:-47%;
width:41px;height:18px;cursor:pointer;
z-index:5000;
}
.allmenu.open > .all_close > div{
display:block;position: relative;
	width:100%;height:2px;
	margin-bottom:6px;
	background:#000;
	transition:all 0.4s;	
}
.allmenu.open > .all_close > div:nth-child(1){width:100%;transform: translateY(8px) rotate(45deg);transition:all 0.4s;	}
.allmenu.open > .all_close > div:nth-child(2){opacity:0;}
.allmenu.open > .all_close > div:nth-child(3){width:100%;transform: translateY(-8px) rotate(-45deg);transition:all 0.4s;	}


.allmenu .allmenuwrap{display:flex;align-items:center;justify-content:center;width:100%;height:100%;}
.allmenu .allmenuwrap>ul{display:flex;justify-content:flex-start;position:relative;width:100%;padding:0 5.625rem;flex-wrap:wrap;}

.allmenu.open .allmenuwrap>ul:before{transform:scaleX(1);transition:all 4s 1.4s;}

.allmenu .allmenuwrap>ul>li{position:relative;width:16.66%;}
.allmenu .allmenuwrap>ul>li:after{
	display:block;content:"";
	width:1px;height:0%;
	background:rgba(0,0,0,0.15);
	position:absolute;left:-35px;top:0;
	transition:all 0.4s;
}
.allmenu .allmenuwrap>ul>li:nth-child(6n):after{width:0px;}
.allmenu .allmenuwrap>ul>li:hover:after{transform:translate(-50%,0) scale(1) rotate(0);}
.allmenu .allmenuwrap>ul>li>a{
	display:block;
	font-size:28px;color:#134582;font-weight:800;font-family:"Wix Madefor Display";
	text-transform: uppercase;text-align: left;
	position: relative;padding-bottom: 22px;
}
.allmenu .allmenuwrap>ul>li>a:before{
position: absolute;content:'';
width:20%;max-width:30px;height:2px;
background: #134582;bottom:0;left:0;

}
.allmenu .allmenuwrap>ul>li>ul{margin-top:50px;}
.allmenu .allmenuwrap>ul>li>ul>li{margin-bottom:min(3vh, 25px);}
.allmenu .allmenuwrap>ul>li>ul>li:last-child{margin-bottom:0;}
.allmenu .allmenuwrap>ul>li>ul>li>a{
	display:block;text-align: left !important;position: relative;
	font-size:max(1.04vw, 20px);color:#000;font-weight: 700;
	box-sizing:border-box;transition: all 0.3s;
	font-family: "Noto Sans KR";
}
.allmenu .allmenuwrap>ul>li>ul>li>a:hover{color:#0081c8;transition: all 0.3s;transform:translateX(6px);}
.allmenu .allmenuwrap>ul>li>ul>li>.dep3{
margin-top: 22px;;
display: inline-flex;flex-direction:column;align-items:start;
width:100%;
}
.allmenu .allmenuwrap>ul>li>ul>li>.dep3>li>a{position: relative;text-align: left;display: inline-block;font-size:16px;color:#666666;font-family: "Noto Sans KR";}
.allmenu .allmenuwrap>ul>li>ul>li>.dep3>li>a:before{
position: absolute;content:'';
bottom:0;left:0;
width:100%;height:1px;background: #666;
transition:width 0.4s ease;width: 0;
}
.allmenu .allmenuwrap>ul>li>ul>li>.dep3>li:hover>a:before{
width:100%;
}
.allmenu .allmenuwrap>ul>li>ul>li>.dep3>li + li{margin-top: 8px;}





@media (max-width: 1399px){
	.allmenu .logo{display: none;}
	.allmenu .allmenuwrap>ul{
		flex-direction: column;
		justify-content: normal;
		padding: 0 4%;
	}
	.allmenu .allmenuwrap>ul>li{
		width: 100%;
	}
	.allmenu .allmenuwrap>ul>li + li{
		margin-top: 30px;
	}
	.allmenu .allmenuwrap>ul>li>a{
		padding-bottom: 0;
	}
	.allmenu .allmenuwrap>ul>li>ul>li>a:hover{
		color: #000;
	}
	.allmenu .allmenuwrap>ul>li>a:before{
		width: 30px;
		bottom: unset;
		left: unset;
		right: 0;
		top: 50%;
		transform: translateY(-50%);
		opacity: 0;
	}
	.allmenu .allmenuwrap>ul>li.active>a:before{
		opacity: 1;
	}
	.allmenu .allmenuwrap>ul>li>ul{
		margin-top: 20px;
	}
	.allmenu .allmenuwrap>ul>li>ul>li{
		margin-bottom: 10px;
	}
	.allmenu .allmenuwrap>ul>li>ul>li>.dep3{
		margin-top: 10px;
	}
}

@media (max-width: 812px){
	.allmenu .allmenuwrap>ul>li>a{font-size: 22px;}
	.allmenu .allmenuwrap>ul>li + li{margin-top: 12px;}
	.allmenu .allmenuwrap>ul>li>ul>li>a{font-size: 17px;}
	.allmenu .allmenuwrap>ul>li>ul>li>.dep3>li>a{font-size: 14px;}
}










/*footer*/
footer{background: #111111;padding:50px 0;	box-sizing:border-box;position: relative;z-index:100;}
footer .foot{
	max-width:1560px;width:94%;margin:0 auto;
	display: flex;align-items:start;justify-content:space-between;
	position: relative;
}
footer .foot .logo{width:197px;}
footer .foot .address{width:calc(100% - 200px);padding-left: 3.25vw;padding-right:100px;box-sizing:border-box;
}
footer .foot .address address{}
footer .foot .address address p{
	font-size:18px;color:rgba(255,255,255,0.7);font-weight: 350;display: inline-block;
	font-family: "Noto Sans KR";line-height: 1.6em;
}
footer .foot .address address br{display: block;width:100%;}
footer .foot .address address .bar{
	display: inline-block;margin:0 10px;
	width: 1px;height: 13px;background: rgba(255,255,255,0.3);
}
footer .foot .address address p.bold{width:100%;margin-bottom: 10px;}
footer .foot .address address p.bold>a{font-size:18px;color:rgba(255,255,255,0.7);font-weight: 600;font-family: "Noto Sans KR";}
footer .foot .copy{
margin-top: 30px;
font-size:17px;color:rgba(255,255,255,0.5);font-weight: 350;font-family: "Noto Sans KR";
}
footer .foot .top_btn{position: absolute;top:0;right:0;width:60px;}
footer .foot .top_btn>img{object-fit:contain;width:60px;}

@media screen and (max-width:990px){
footer .foot .logo{width:160px;}
footer .foot{display: block;}
footer .foot .address{padding-left: 0;width:100%;padding-right: 5.2vw;margin-top: 30px;}
footer .foot .address address p, footer .foot .address address p.bold>a,
footer .foot .copy{font-size:14px;}
}
@media screen and (max-width:813px){
footer .foot .top_btn>img{width:45px;}
}


/* popup */
.pop_today_close{padding:1px 7px 3px 7px;color:#ffffff;background:#303030;vertical-align:middle;border:0px;}
.pop_close{padding:1px 7px 3px 7px;color:#ffffff;background:#303030;vertical-align:middle;border:0px;}

@media(max-width:767px){
	/* 메인 레이어 팝업 */
	.main_layer_popup{width:96%!important;left:50%!important;top:50px!important;transform:translateX(-50%)}
	.main_layer_popup .popupContent{height:100%!important}
	.main_layer_popup img{width:100%}
}

#loadingIndicator {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	padding: 20px;
	border-radius: 10px;
	display: flex;
	align-items: center;
	justify-content: center;
	z-index: 10;
	display: none;
}

.spinner {
	width: 40px;
	height: 40px;
	border: 4px solid rgba(0, 0, 0, 0.2);
	border-top: 4px solid #333;
	border-radius: 50%;
	animation: spin 1s linear infinite;
}

@keyframes spin {
	from { transform: rotate(0deg); }
	to { transform: rotate(360deg); }
}