html, body, div, h1, h2, h3, h4, h5, h6, p, ul, ol, li, dl, dt, dd, span, form, fieldset, input, select, label, textarea, table, caption, thead, tfoot, tbody, tr, th, td
{margin:0;padding:0;font:14px/1.5 "Pretendard Variable", Pretendard, '맑은고딕','Malgun Gothic','나눔고딕','nanumgothic',돋움,Dotum,굴림,Gulim,Sans-serif;color:#222;-webkit-text-size-adjust:none;word-break:keep-all}
b, span, strong, input, a, button, pre{font-size:inherit;font-family:inherit;color:inherit}
article, aside, dialog, footer, header, section, footer, nav, figure, hgroup, details, summary, figure, figcaption {display: block;}
cite{display:inline}
html, body {height:100%;} 
body {margin:0px;}
a:link {text-decoration:none;} 
a:visited {text-decoration:none;}
img{border:0;max-width:100%}
label, input, textarea, select{vertical-align:middle}
ol, ul{list-style:none;} 
table{border-collapse:collapse;table-layout:fixed;}
fieldset{border:none}
button{border:0;background:none;cursor:pointer}
.skip, hr, legend{position:absolute;left:-1000%;width:1px;height:1px;font-size:0;line-height:0;overflow:hidden;}

:root {
  --point_color1: #002F66;
  --point_color2: #3A8AFD;
}

/* layout */
#header{
	position:absolute;top:0;left:0;
	width:100%;
	box-sizing:border-box;
	padding:0 40px;
	background:#fff;
	z-index:100
}
#header:after{
	content:'';
	position:absolute;top:150px;left:0;
	display:block;width:100%;height:1px;
	background:#ccc;
	transition:.3s;
	visibility:hidden;opacity:0;
}
#header header{
	position:sticky;top:0;
	max-width:1640px;height:90px;
	overflow:Hidden;
	margin:0 auto;
	transition:.4s
}
header h1{
	position:absolute;top:0;left:0;
	height:150px;line-height:150px;
	z-index:1
}
header h1 img{display:inline-block;vertical-align:middle;font-size:0}
header .btn_menu{display:None}
header .gnb.depth0{
	display:flex;gap:75px;justify-content:center;
}
header .gnb.depth0>li>a{
	display:block;
	height:150px;line-height:150px;
	font-size:18px;font-weight:700;
	transition:.3s
}
header .gnb.depth0>li:hover>a,
header .gnb.depth0>li.on>a{color:var(--point_color1)}
header .gnb.all{
	position:absolute;top:150px;left:0;
	display:flex;justify-content:center;
	width:100%;
	padding:29px 0;
	background:#fff
}
header .gnb.all>li{
	box-sizing:border-box;
	width:180px;
	padding-left:30px;
	border-right:1px solid #ccc;
}
header .gnb.all>li:nth-child(1){border-left:1px solid #ccc;}
header .gnb.all>li>a{
	display:block;
	margin-bottom:15px;
	font-size:18px;font-weight:800;color:#000
}
header .gnb.all>li ul a{
	display:block;
	font-size:18px;color:#555;font-weight:600;line-height:37px;
}
header .gnb.all>li.on>a,
.web header .gnb.all>li:hover>a,
.web header .gnb.all>li a:hover,
header .gnb.all>li a.on{color:var(--point_color1)}
header .sns{
	position:absolute;top:0;right:0;
	height:90px;
	display:flex;gap:16px;align-items:center;
}
header .sns a{
	background-color:#000;border-radius:10px;
	font-size:0
}

.menu_bg{
	position:fixed;top:0;right:0;
	width:100%;height:100%;
	background:rgba(0,0,0,0.4);
	z-index:11;transition:.3s;
	visibility:hidden;opacity:0;
}
body.menu_open .menu_bg,
body.hover #header:after,
body.hover .menu_bg{visibility:visible;opacity:1;}

footer{
	position:relative;
	padding:40px;
	max-width:1640px;
	margin:0 auto;
	display:flex;gap:40px
}
footer .contact{flex:none;width:450px}
footer .contact dt{
	font-size:16px;color:#222;font-weight:600;text-transform:uppercase
}
footer .contact dd{
	font-size:16px;color:#222
}
footer .contact dd b{display:block;margin-bottom:10px;font-size:20px;font-weight:700}
footer .contact dd strong{display:block;font-size:30px;font-weight:900;color:#002F66}
footer .contact dl+a{
	display:block;width:180px;height:48px;line-height:46px;
	margin-top:40px;
	border:1px solid #AEAEAE;border-radius:50px;
	text-align:center;font-size:20px;font-weight:700;
}
footer .contact dl+a:after{
	content:'';
	display:inline-block;width:24px;height:100%;
	margin:0 0 0 8px;
	background:url(../img/layout/arrow-right.png) no-repeat center;
	vertical-align:top
}

footer .addr{
	margin-left:auto;
	max-width:800px;
	padding-top:40px;
	text-align:right
}
footer address{display:flex;gap:5px 15px;flex-wrap:wrap;    justify-content: flex-end}
footer address span{
	display:inline-block;
	font-size:16px;color:#222
}
footer address span b{padding-right:5px;font-weight:700}
footer .addr h2{margin:70px 0 10px;}
footer .addr .copy{font-size:15px;color:#666}

#contents{
	position:Relative;
	padding:218px 0;
}

#lnb{
	position:sticky;top:0;
	padding:0 40px;
	background:#fff;
	box-shadow:0 1px 1px rgba(0,0,0,0.1);
	z-index:10
}
#lnb .gnb{
	display:flex;
	max-width:1640px;
	margin:0 auto;
	overflow:auto;
}
#lnb .gnb::-webkit-scrollbar {
    height: 5px;  
}
#lnb .gnb::-webkit-scrollbar-thumb {
    background: #ccc;
    border-radius: 5px;
}
#lnb .gnb::-webkit-scrollbar-track {
    background:#f5f5f5;
}
#lnb .gnb>li,
#lnb .gnb>li.on>a{display:none}
#lnb .gnb>li.on{display:block;}
#lnb .gnb ul{display:flex;gap:50px;}
#lnb .gnb ul a{
	position:relative;
	display:block;height:90px;line-height:90px;
	font-size:21px;font-weight:700;white-space:nowrap
}
#lnb .gnb ul a:after{
	content:'';
	position:absolute;bottom:0;left:0;
	width:0;height:5px;
	background:var(--point_color1);
	transition:.3s
}
#lnb .gnb ul a.on:after{width:100%}

.title_video{
	position:Relative;
	height:850px;
	overflow:Hidden;
	background:#000
}
.title_video:before{
	content:'';
	position:absolute;top:0;left:0;
	display:block;width:100%;height:100%;
	background-size:cover;background-position:center;
	transition:.5s;transform:scale(1.1);animation: scale 2s ease-out forwards alternate;
}
@keyframes scale {
    from {transform:scale(1.1);opacity:.7}
    to {transform:scale(1);opacity:1}
}
.title_video h2{
	position:absolute;top:0;left:0;
	width:100%;height:100%;
	display:flex;align-items:center;justify-content:center;
	background:rgba(0,0,0,0.3);
	text-align:center;font-size:69px;font-weight:800;color:#fff
}

main{
	position:relative;
	max-width:1720px;
	box-sizing:border-box;
	margin:0 auto;
	padding:0 40px
}
main:after{content:'';display:block;clear:both}
main>section{
	position:relative;
	padding:200px 0 0;
	opacity:0;transition:2s cubic-bezier(0.225, 0.890, 0.340, 0.955);transform:translateY(-50px);
}
main>section.active{opacity:1;transform:translateY(0);}
main h3{
	margin:100px 0;
	font-size:38px;font-weight:800;line-height:1.3em
}
main h3 b{
	display:block;
	margin-bottom:15px;
	font-size:58px;font-weight:800;line-height:1.4em
}
main h3 span{font-weight:800;color:#BBBBBE;}
.btn_top{
	position:sticky;bottom:0;
	float:right;
	display:block;width:45px;height:45px;
	margin-top:50px;
	background: #393939 url(../img/layout/arrow_top.svg) no-repeat center;
	font-size:0;
	z-index:1
}

.btn_go{
	position:relative;
	display:inline-block;
	padding:0 15px 0 40px;
	height:30px;line-height:30px;
	font-size:18px;font-weight:800;color:var(--point_color1);
	transition:.3s
}
.btn_go:before{
	content:'';
	position:absolute;top:0;left:0;
	display:inline-block;width:30px;height:30px;
	background:var(--point_color1) url(../img/ico/go.svg) no-repeat 0 0;background-size:auto 100%;
	border-radius:30px;
	vertical-align:top;transition:.3s;z-index:-1
}
.web .btn_go:hover{
	color:#fff
}
.web .btn_go:hover:before{width:100%}

@media all and (max-width:1380px){
	header .gnb.depth0{padding-left:115px;gap:50px}
	.title_video{height:730px}
	.btn_top{margin-right:0}
	main h3{font-size:36px}
	main h3 b{font-size:50px}
	footer .addr h2{margin:20px 0 10px;}
}

@media all and (max-width:1024px){
	#header{position:fixed;}
	#header header{height:80px;}
	header h1{height:80px;line-height:80px}
	header .sns{display:none}
	header .btn_menu{
		display:block;
		position:absolute;top:15px;right:0;
		width:40px;height:50px;
		font-size:0;
		padding:0;z-index:3;overflow:visible;
	}
	header .btn_menu span{
		position:relative;
		display:block;width:22px;height:2px;
		margin:0 auto;
		font-size:0;
	}
	header .btn_menu span:before,
	header .btn_menu span:after{
		content:'';
		display:block;width:100%;height:3px;
		position:absolute;left:0;
		background:#000;border-radius:3px;
		transform-origin:0.28571rem center;
		transition:.3s;
	}
	header .btn_menu span:before{top:-6px}
	header .btn_menu span:after{top:6px}
	.menu_open header .btn_menu span{background:transparent}
	.menu_open header .btn_menu span:before,
	.menu_open header .btn_menu span:after{
		-webkit-transform-origin:50% 50%;  transform-origin:50% 50%;
		top:0;
	}
	.menu_open header .btn_menu span:before{-webkit-transform:rotate3d(0, 0, 1, 45deg);transform:rotate3d(0, 0, 1, 45deg)}
	.menu_open header .btn_menu span:after{-webkit-transform:rotate3d(0, 0, 1, -45deg);transform:rotate3d(0, 0, 1, -45deg);}
	.menu_open header nav{transform:translateX(0);}
	
	header nav{
		position:fixed;top:0;right:0;
		width:100%;max-width:500px;height:100%;
		background:#fff;
		z-index:2;
		transition:.3s;transform:translateX(100%);
	}
	header .gnb.depth0{display:None}
	header .gnb.all{
		position:relative;top:80px;
		display:block;
		box-sizing:border-box;
		height:calc(100% - 170px);
		padding:0;
		background:var(--point_color1);
		border-top:1px solid #f0f0f0;border-bottom:1px solid #f0f0f0;
		overflow:auto;overflow-x:hidden;
	}
	header .gnb.all>li{
		width:100%;box-sizing:border-box;
		padding:0;
		border:0;
	}
	header .gnb.all>li>a{
		width:100%;height:80px;line-height:80px;
		box-sizing:border-box;
		margin:0;padding:0 40px;
		border-bottom:1px solid rgba(255,255,255,0.5);
		font-size:20px;text-align:center;color:#fff;font-weight:500
	}
	header .gnb.all>li:nth-child(1){border-left:0;}
	header .gnb.all>li ul{
		position:absolute;left:200px;top:0;
		display:none;
		width:calc(100% - 200px);height:100%;
		box-sizing:border-box;
		background:#fff;
	}
	header .gnb.all>li ul a{
		height:80px;line-height:80px;
		box-sizing:border-box;
		padding:0 40px;
		border-bottom:1px solid #f0f0f0;
		font-size:20px;font-weight:500
	}
	header .gnb.all.active>li>a{width:200px;text-align:left}
	header .gnb.all>li.on>a{background:#fff;font-weight:600}


	header .sns{display:flex;justify-content:center;position:absolute;top:auto;bottom:0;width:100%}

	hgroup{padding:80px 0}
	hgroup .pagi{margin-bottom:80px}
	.title_video{height:580px;}
	.title_video h2{font-size:45px}
	hgroup h2{font-size:40px}
	#lnb{top:80px;border-top:1px solid #f0f0f0;}
	#lnb .gnb ul{gap:40px;}
	#lnb .gnb ul a{height:60px;line-height:60px;font-size:18px;}
	#contents{padding:80px 0}
	main>section{padding:150px 0 0}
	main h3{margin:80px 0;font-size:30px}
	main h3 b{font-size:40px}

	footer{display:block;}
	footer .addr{margin-left:0;text-align:left}
	footer address{justify-content: flex-start;}
	footer address span{font-size:14px}
	footer .addr h2{margin-top:40px}
	
}
@media all and (max-width:760px){
	body{background:#fff}
	#header{padding:0 20px}
	#header header{height:50px}
	header h1{height:50px;line-height:50px;width:160px;z-index:15}
	header h1 img{max-height:50%;}
	header .btn_menu{top:0;width:35px;right:-5px}
	header nav{max-width:100%}
	header .gnb.all{top:50px;height:calc(100% - 140px)}
	header .gnb.all>li>a,
	header .gnb.all>li ul a{height:60px;line-height:60px;font-size:16px;}
	header .gnb.all.active>li>a{width:150px;}
	header .gnb.all>li ul{width:calc(100% - 150px);left:150px}
	

	footer{display:block;padding:40px 20px 30px}
	footer .contact{width:100%}
	footer .contact dt{font-size:14px;}
	footer .contact dd strong{font-size:22px}
	footer .contact dd b{font-size:16px}
	footer .contact dd,
	footer address span{font-size:13px}
	footer .contact dl+a{width:140px;height:40px;line-height:38px;margin-top:20px;font-size:15px}
	footer .contact dl+a:after{background-size:100% auto;width:12px}
	footer h2{width:140px}
	footer .addr .copy{font-size:12px;color:#888}

	.title_video{height:280px;}
	.title_video h2{font-size:38px;}

	#lnb{top:50px;padding:0 20px;}
	#lnb .gnb ul{gap:20px;}
	#lnb .gnb ul a{height:50px;line-height:50px;font-size:14px;}
	#lnb .gnb ul a:after{height:3px;}

	#contents{padding:50px 0}

	main{padding:0 20px;}
	main>section{padding:100px 0 0;transform:translateY(-30px);}
	main h3{margin:60px 0;font-size:22px;}
	main h3 b{margin-bottom:15px;font-size:32px;}
	main h3 br{display:none}
	.btn_top{margin-right:0;}

	.btn_go{
		padding:0 0 0 35px;
		height:25px;line-height:25px;
		font-size:15px;
	}
	.btn_go:before{width:25px;height:25px;border-radius:25px;}
}