@charset "utf-8";

body,html { min-height:100% }
#wrap { min-height:calc(100vh - 200px); overflow-x:hidden\0; }
@media screen and (max-width:960px){
	#wrap { min-height:100%; }
}


/* header */
header { position:fixed; width:100%; z-index:999; background:#fff; transition:all 0.3s ease-in-out; }
header.fix { background:#fff; height:80px; }
header h1 { position:absolute; text-align:left; padding:13px 0 0 100px; z-index:999; transition:all 0.3s ease-in-out; }
header h1 a { display:inline-block; overflow:hidden; text-indent:-9999em; width:164px; height:55px; background:url(/img/common/img_logo_on.png) left center no-repeat; }
header.fix  h1 a,
header.on h1 a,
header.ov h1 a { background:url(/img/common/img_logo_on.png) left center no-repeat; transition:all 0.3s ease-in-out; }
header #navi { z-index:9; transition:all 0.3s ease-in-out; }
header #navi.over,
header.fix #navi.over,
header.ov #navi,
header.ov.fix #navi { background-color:#fff; }
header #gnb { position:relative; max-width:1680px; margin:0 auto; text-align:center; }
header #gnb > ul { display:inline-block; margin:0 auto; }
header #gnb > ul > li { position:relative; display:inline-block; margin:0 -2px; vertical-align:top; padding:32px 45px 0 45px; height:48px; transition:all 0.3s ease-in-out; }
header #gnb > ul > li:first-child { background:none; }
header #gnb > ul > li > a { font-weight:500; font-size:16px; color:#333; line-height:14px; padding:0 0 40px 0; display:block; transition:all 0.1s ease-in-out; font-family:'Montserrat', 'Noto Sans KR', sans-serif; }
header #navi.over #gnb > ul > li > a,
header.fix #gnb > ul > li > a { color:#333; }
header #navi.over #gnb > ul > li.on  > a,
header.fix #gnb > ul > li.on  > a { color:#0a3d84; }
header #gnb > ul > li.on > a,
header #gnb > ul > li > a:hover { color:#0a3d84; }
header #gnb > ul > li > ul { display:none;  position:absolute; left:50%; padding:40px 5px; transform:translateX(-50%); top:80px; width:192px; text-align:center; background-color:#0a3d84; z-index:3; }
header #gnb > ul > li > ul > li { margin:18px 0 0 0;  }
header #gnb > ul > li > ul > li:first-child { margin:0; }
header #gnb > ul > li > ul > li a { position:relative; display:block; font-size:15px; line-height:18px; font-weight:300; color:#cddbee; transition:all 0.3s ease-in-out; font-family:'Montserrat', 'Noto Sans KR', sans-serif; }
header #gnb > ul > li > ul > li a:hover { color:#fff; }
header #gnb > ul > li > ul > li a span { font-weight:300; display:none }

header.ov #gnb > ul > li > a { color:#333; }
header.ov #gnb > ul > li.on { background-color:#0a3d84; }
header.ov #navi.over #gnb > ul > li > a,
header.ov.fix #gnb > ul > li > a { color:#333; }
header.ov #navi.over #gnb > ul > li.on  > a,
header.ov.fix #gnb > ul > li.on  > a { color:#fff; }
header.ov #gnb > ul > li > ul { opacity:1; display:block !important; background:none; min-height:222px; padding:20px 5px 40px 5px; }
header.ov #gnb > ul > li > ul > li { margin:22px 0 0 0; }
header.ov #gnb > ul > li > ul > li:first-child { margin:16px 0 0 0; }
header.ov #gnb > ul > li > ul > li a { color:#666; font-weight:400; line-height:18px; }
header.ov #gnb > ul > li > ul > li a:hover { color:#0a3d84; }
header.ov #gnb > ul > li > ul.menu1 { animation:gnbSub 0.3s 0.3s; animation-fill-mode:forwards;}
header.ov #gnb > ul > li > ul.menu2 { animation:gnbSub 0.3s 0.4s; animation-fill-mode:forwards;}
header.ov #gnb > ul > li > ul.menu3 { animation:gnbSub 0.3s 0.5s; animation-fill-mode:forwards;}
header.ov #gnb > ul > li > ul.menu4 { animation:gnbSub 0.3s 0.6s; animation-fill-mode:forwards;}
header.ov #gnb > ul > li > ul.menu5 { animation:gnbSub 0.3s 0.7s; animation-fill-mode:forwards;}
header.ov #gnb > ul > li > ul.menu6 { animation:gnbSub 0.3s 0.8s; animation-fill-mode:forwards;}

@keyframes gnbSub {
	0% { transform:translate(-50% , 50px); opacity:0; }
	100% { transform:translate(-50% , 0); opacity:1;  }
}

header .language { position:absolute; right:90px; top:32px; z-index:9; transition:all 0.3s ease-in-out; }
header .language.on { z-index:-1;}
header .language a { position:relative; color:rgba(0,0,0, .3); font-size:13px; margin:0 0 0 10px; line-height:10px; display:inline-block; }
header .language a.on { color:#333; }
header .language a:before { content:""; display:block; width:1px; height:10px; background-color:rgba(0,0,0, .3); position:absolute; left:-7px; top:0; }
header .language a:first-child:before { display:none; }
header .language a:first-child { margin:0; }
header.fix .language a,
header.on .language a { color:rgba(0,0,0, .3); }
header.fix .language a:before,
header.on .language a:before { background-color:rgba(0,0,0, .3); }
header.fix .language a.on,
header.on .language a.on { color:#333; }
.allBox { position:absolute; right:0; top:0; width:80px; height:80px; z-index:7; transition:all 0.3s ease-in-out; }
.allBox.on { background-color:#0a3d84; }
.allmenu { width:20px; height:16px; margin:auto; position:absolute; left:50%; top:40px; transform:translateX(-50%); }
.allmenu a { display:block; height:16px; }
.allmenu span { position:relative; width:14px; height:2px; background-color:#0a3d84; display:block; transition:all 0.3s ease-in-out; }
.allmenu span:before { content:""; display:block; width:20px; height:2px; background-color:#0a3d84; position:absolute; left:0; top:8px; transition:all 0.3s ease-in-out; }
.allmenu span:after { content:""; display:block; width:20px; height:2px; background-color:#0a3d84; position:absolute; left:0; bottom:8px; transition:all 0.3s ease-in-out; }
.allBox.on span { height:0; width:0; }
.allBox.on span:before{ transform: translateY(-9px) rotate(-45deg); }
.allBox.on span:after{ transform: translateY(9px) rotate(45deg); }
header.fix .allmenu span,
header.fix .allmenu span:before,
header.fix .allmenu span:after,
header.on .allmenu span,
header.on .allmenu span:before,
header.on .allmenu span:after  { background-color:#0a3d84; }
header.ov .allmenu span,
header.ov .allmenu span:before,
header.ov .allmenu span:after  { background-color:#fff !important; }
@media screen and (max-width:1760px){
	header .language { right:140px; }
	.allBox { right:50px; }
}
@media screen and (max-width:1600px){
	header #gnb { margin-left:100px; }
	header #gnb > ul > li { padding:32px 35px 0 35px; }
}
@media screen and (max-width:1400px){
	header h1 { padding:13px 0 0 40px; }
	header #gnb > ul > li { padding:32px 30px 0 30px; }
	header #gnb > ul > li > a { font-size:14px; line-height:14px; }
	header #gnb > ul > li > ul { padding:30px 0; top:80px; width:168px; }
	header #gnb > ul > li > ul > li a { font-size:13px; line-height:12px; }
	.allBox { right:0; }
	header .language { right:80px; }
	
	header.ov #gnb > ul > li > ul > li { margin:15px 0 0 0; }
}
@media screen and (max-width:1100px){
	header .language { right:70px; }
}
@media screen and (max-width:1024px){
	header h1 { padding:13px 0 0 30px; }
}
@media screen and (max-width:1023px){
	header #navi { position:fixed; right:-480px; top:0;  width:100%; max-width:480px; height:100%; background-color:#013e93 !important; z-index:999; }
	header.fix #navi { background-color:#fff; border-bottom:none; }
	header #navi #mlogo{position:absolute; top:24px; left:20px; display:block; overflow:hidden; text-indent:-9999em; width:100px; height:34px; background:url(/img/common/img_logo_m.png) left center no-repeat; }
	header #gnb { position:relative; max-width:auto; margin:0 auto; padding:80px 0 0 0; }
	header #gnb > ul { text-align:center; display:block;}
	header #gnb > ul > li { position:relative; display:block; margin:0; padding:0; height:auto;  }
	header #gnb > ul > li > a { font-weight:500; font-size:20px; color:#fff !important; line-height:16px; padding:20px 30px 20px 30px; display:block; }
	header #gnb > ul > li > a:hover { color:#fff !important; }
	header #gnb > ul > li > ul { display:none; position:relative; left:50%; padding:20px 0 30px 0; transform:translateX(-50%); top:0; width:100%; text-align:center; background-color:#fff; }
	header #gnb > ul > li > ul > li { margin:6px 0 0 0;  }
	header #gnb > ul > li > ul > li:first-child { margin:0; }
	header #gnb > ul > li > ul > li a { position:relative; display:block; font-size:15px; line-height:12px; padding:10px 0; font-weight:400; color:#333 !important;  }
	header #gnb > ul > li > ul > li a:hover { color:#333 !important; }
	header #gnb > ul > li > ul > li a br { display:none; }
	header .language { right:70px; top:36px; }
	header .language a { color:rgba(255,255,255, .3) !important; }
	header .language a.on { color:#fff !important; }
	header .language a:before { background-color:rgba(255,255,255, .3) !important; }
	
	.allBox { position:fixed; z-index:99999; background-color:none; width:60px; height:60px; }
	.allmenu { top:40px; }
	.allmenu.active span { height:0; width:0; background-color:#fff !important; }
	.allmenu.active span:before{ transform: translateY(-9px) rotate(-45deg); background-color:#fff !important; }
	.allmenu.active span:after{ transform: translateY(9px) rotate(45deg); background-color:#fff !important; }

}
@media screen and (max-width:865px){
	header h1 { padding:13px 0 0 30px; }
}
@media screen and (max-width:640px){
	header h1 { padding:13px 0 0 20px; }
	header h1 a { width:120px; height:40px; background-size:120px auto !important; }
}

body.fp-viewing-main .web header h1 { padding-top:22px; }
body.fp-viewing-main .web header #gnb > ul > li { padding-top:40px; height:60px; }
body.fp-viewing-main .web header #gnb > ul > li > ul { top:90px }
body.fp-viewing-main .web .allBox { width:100px; height:100px; }
body.fp-viewing-main .web .allmenu { top:48px; }
body.fp-viewing-main .web header .language { top:40px; }
body.fp-viewing-main header,
body.subBody header { background:none; }
body.subBody header.fix { background-color:#fff; }
body.fp-viewing-main header h1 a,
body.subBody header h1 a { background:url(/img/common/img_logo.png) left center no-repeat; }
body.fp-viewing-main header.on h1 a,
body.fp-viewing-main header.ov h1 a,
body.subBody header.fix h1 a,
body.subBody header.fix h1 a, 
body.subBody header.on h1 a,
body.subBody header.ov h1 a{ background:url(/img/common/img_logo_on.png) left center no-repeat; }
body.fp-viewing-main header #navi,
body.subBody header #navi { border-bottom:none; }
body.fp-viewing-main header #gnb > ul > li > a,
body.subBody header #gnb > ul > li > a { color:#fff; }
body.fp-viewing-main header.ov #gnb > ul > li > a,
body.fp-viewing-main header.on #gnb > ul > li > a,
body.subBody header.fix #gnb > ul > li > a,
body.subBody header.fix #gnb > ul > li > a,
body.subBody header.ov #gnb > ul > li > a,
body.subBody header.on #gnb > ul > li > a { color:#333; }
body.fp-viewing-main .language a,
body.subBody .language a { color:rgba(255,255,255, .3); }
body.fp-viewing-main .language a:before,
body.subBody .language a:before { background-color:rgba(255,255,255, .3); }
body.fp-viewing-main .language a.on,
body.subBody .language a.on { color:rgba(255,255,255, 1); }
body.fp-viewing-main header.on .language a,
body.subBody header.on .language a,
body.subBody header.fix .language a { color:rgba(0,0,0, .3); }
body.fp-viewing-main header.on .language a:before,
body.subBody header.on .language a:before,
body.subBody header.fix .language a:before { background-color:rgba(0,0,0, .3); }
body.fp-viewing-main header.on .language a.on,
body.subBody header.on .language a.on,
body.subBody header.fix .language a.on { color:#333; }
body.fp-viewing-main .allmenu span,
body.fp-viewing-main .allmenu span:before,
body.fp-viewing-main .allmenu span:after,
body.subBody .allmenu span,
body.subBody .allmenu span:before,
body.subBody .allmenu span:after { background-color:#fff; }
body.fp-viewing-main header.on .allmenu span,
body.fp-viewing-main header.on .allmenu span:before,
body.fp-viewing-main header.on .allmenu span:after,
body.subBody header.on .allmenu span,
body.subBody header.on .allmenu span:before,
body.subBody header.on .allmenu span:after,
body.subBody header.fix .allmenu span,
body.subBody header.fix .allmenu span:before,
body.subBody header.fix .allmenu span:after { background-color:#0a3d84; }


header .gnb_bg { width:100%; height:0px; transition:all 0.3s ease-in-out; }
header .gnb_bg .gnbTxt { display:none; position:absolute; left:100px; top:50%; transform:translateY(-50%); }
header .gnb_bg .gnbTxt .txt_1 { opacity:0; color:#4f565f; font-size:18px; font-weight:400; font-family:'Montserrat' sans-serif; }
header .gnb_bg .gnbTxt .txt_2 { opacity:0; margin:14px 0 0 0; color:#4f565f; font-size:55px; font-weight:800; font-family:'Montserrat' sans-serif; }
header .gnb_bg .gnbTxt .txt_3 { opacity:0; margin:28px 0 0 0; color:#4f565f; font-size:16px; font-weight:300; line-height:22px; }
header .gnb_bg.ov { position:relative; height:310px; background:#fff url(/img/common/bg_gnb.png) left bottom no-repeat; border-top:1px solid #e0e0e0;  }
header .gnb_bg.ov .gnbTxt { display:block;}
@media screen and (max-width:1400px){
	header .gnb_bg .gnbTxt { left:60px; }
}
@media screen and (max-width:1300px){
	header .gnb_bg .gnbTxt .txt_1 { font-size:16px; }
	header .gnb_bg .gnbTxt .txt_2 { margin:12px 0 0 0; font-size:46px; }
	header .gnb_bg .gnbTxt .txt_3 { margin:22px 0 0 0; font-size:14px; }
}
@media screen and (max-width:1024px){
	header .gnb_bg .gnbTxt { left:50px; }
}
@media screen and (max-width:960px){
	header .gnb_bg.ov { display:none; }
}
header .gnb_bg.ov .gnbTxt .txt_1 { animation:ani_1 0.5s 0.5s; animation-fill-mode:forwards; } 
header .gnb_bg.ov .gnbTxt .txt_2 { animation:ani_1 0.5s 0.8s; animation-fill-mode:forwards; } 
header .gnb_bg.ov .gnbTxt .txt_3 { animation:ani_1 0.5s 1.1s; animation-fill-mode:forwards; } 


#container { padding:0; }

/* footer */
footer { position:relative; background-color:#2f2f3c; }
footer .f_logo { position:absolute; left:100px; top:35px; display:block; overflow:hidden; text-indent:-9999em; width:120px; height:44px; background:url(/img/common/img_logo_f.png) left center no-repeat; }
footer .f_infobox { position:relative; margin:0 auto; max-width:1400px; padding:44px 0 0 0; height:156px; }
footer .f_infobox .info {padding:0 0 0 49px; }
footer .f_infobox .info li { position:relative; display:inline-block; color:#cbcbce; font-size:14px; font-weight:300; letter-spacing:-0.04em; margin:0 0 0 14px; padding:0 0 0 14px; }
footer .f_infobox .info li:before { content:""; display:block; width:1px; height:10px; background-color:rgba(255,255,255, .3); position:absolute; left:0; top:50%; margin-top:-6px; }
footer .f_infobox .info li a { color:#cbcbce; font-weight:300; }
footer .f_infobox .info li:first-child { margin:0; padding:0; }
footer .f_infobox .info li:first-child:before { display:none; }
footer .f_infobox .info p { margin:30px 0 0 0; color:#cbcbce;  font-size:14px; font-weight:300; letter-spacing:-0.04em; line-height:22px; }
footer .f_infobox .info p strong { display:inline-block; font-weight:400; margin:0 0 0 14px; }
footer .f_infobox .info p strong:first-child { margin:0; }
footer .f_infobox .info .copyright { margin:15px 0 0 0; font-size:14px; font-weight:300; letter-spacing:0.04em; color:#cbcbce; text-transform:uppercase; }
footer .f_infobox .snsbox {  position:absolute; right:50px; top:40px; }
footer .f_infobox .snsbox li { display:inline-block; margin:0 0 0 8px; }
footer .f_infobox .snsbox li:first-child { margin:0; }

.btn_top { opacity:0; position:fixed; right:187px; bottom:230px; z-index:99; overflow:hidden; text-indent:-9999em; width:53px; height:0; background:rgba(56,53,162,1) url(/img/common/btn_top.png) center center no-repeat; transition:all .3s ease-in-out; }
header.fix .btn_top { display:block; opacity:1; height:53px; }
.fp-viewing-footer .btn_top { display:block; opacity:1; height:53px; }
.mainBody header .btn_top { display:none; }
@media screen and (max-width:1850px){
	.btn_top { right:150px; }
}
@media screen and (max-width:1760px){
	footer .f_infobox .info { padding:0 0 0 100px; }
}
@media screen and (max-width:1700px){
	footer .f_infobox .info { padding:0 0 0 120px; }
	.btn_top { right:120px; }
}
@media screen and (max-width:1630px){
	footer .f_infobox .info { padding:0 0 0 140px; }
}
@media screen and (max-width:1580px){
	footer .f_infobox .info { padding:0 0 0 180px; }
}
@media screen and (max-width:1530px){
	footer .f_infobox .info { padding:0 0 0 200px; }
	.btn_top { right:100px; bottom:200px; }
}
@media screen and (max-width:1480px){
	footer .f_infobox .info { padding:0 0 0 220px; }
}
@media screen and (max-width:1400px){
	footer .f_logo { left:60px; }
	footer .f_infobox .info { padding:0 0 0 210px; }
}
@media screen and (max-width:1024px){
	footer .f_logo { left:50px; }
	footer .f_infobox .info { padding:0 0 0 200px; }
}
@media screen and (max-width:960px){
	.btn_top { right:50px; bottom:200px; }
}
@media screen and (max-width:865px){
	footer .f_logo { top:30px; left:40px; }
	footer .f_infobox { padding:100px 0 40px 0; height:auto; }
	footer .f_infobox .info { padding:0 0 0 40px; }
	footer .f_infobox .info p { margin:20px 0 0 0; }
	footer .f_infobox .info .m_br { display:block; }
	footer .f_infobox .info p strong.tel { margin:0; }
	footer .f_infobox .snsbox { top:33px; }
	.btn_top { right:20px; bottom:225px; }
}
@media screen and (max-width:640px){
	footer .f_logo { left:20px; }
	footer .f_infobox .info { padding:0 0 0 20px; }
	footer .f_infobox .snsbox { right:20px; }
	.btn_top { width:40px; height:40px; right:10px; bottom:55px; }
	header.fix .btn_top { height:40px; background-color:rgba(56,53,162,0.7) }
}





/* keyframes animation */
@keyframes vsImg {
	0% { -webkit-transform:scale(1.15); -ms-transform:scale(1.15); transform:scale(1.15); }
	100% { -webkit-transform:scale(1); -ms-transform:scale(1); transform:scale(1); }
}
@keyframes scaleY_bar {
	0% { -webkit-transform:scaleY(0); -ms-transform:scaleY(0); transform:scaleY(0); opacity:0; }
	100% { -webkit-transform:scaleY(1); -ms-transform:scaleY(1); transform:scaleY(1); opacity:1; }
}

@keyframes ani_1 {
	0% { -webkit-transform:translateX(-100px); -ms-transform:translateX(-100px); transform:translateX(-100px); opacity: 0; }
	100% { -webkit-transform:translateX(0); -ms-transform:translateX(0); transform:translateX(0); opacity: 1;}
}

@keyframes ani_2 {
	0% { -webkit-transform:translateX(100px); -ms-transform:translateX(100px); transform:translateX(100px); opacity: 0;}
	100% { -webkit-transform:translateX(0); -ms-transform:translateX(0); transform:translateX(0); opacity: 1;}
}

@keyframes ani_3 {
	0% { -webkit-transform:translateY(50px); -ms-transform:translateY(50px); transform:translateY(50px); opacity: 0;}
	100% { -webkit-transform:translateY(0) rotate(0.001deg); -ms-transform:translateY(0) rotate(0.001deg); transform:translateY(0) rotate(0.001deg); opacity: 1;}
}

@keyframes ani_4 {
	0% { -webkit-transform:translateY(-50px); -ms-transform:translateY(-50px); transform:translateY(-50px); opacity: 0;}
	100% { -webkit-transform:translateY(0); -ms-transform:translateY(0); transform:translateY(0); opacity: 1;}
}
@keyframes ani_5 {
	0% {opacity: 0;}
	100% {opacity: 1;}
}


@keyframes ani_over {
	0% {opacity: 0;}
	99% {opacity: 1;}
	100% {opacity: 0;}
}
@keyframes line_over {
	0% {  opacity:0; }
	80% {  opacity:0.3; }
	99% {  opacity:0.3; }
	100% {  opacity:0; }
}

@keyframes txt_big {
	0% {  opacity:0; }
	40% { opacity:0; }
	100% {  opacity:1; }
}
@-webkit-keyframes txt_big {
	0% {  opacity:0; }
	40% { opacity:0; }
	100% {  opacity:1; }
}

@keyframes vsImg {
	0% { transform:scale(1); }
	100% { transform:scale(1.1); }
}
@-webkit-keyframes vsImg {
	0% { transform:scale(1); }
	100% { transform:scale(1.1); }
}


@keyframes txt_op {
	0% { opacity:0; }
	100% {opacity:1; }
}
@-webkit-keyframes txt_op {
	0% { opacity:0; }
	100% { opacity:1; }
}

@keyframes img_b {
	0% { transform:scale(1.2); opacity:0; }
	100% { transform:scale(1); opacity:1; }
}
@-webkit-keyframes img_b {
	0% { transform:scale(1.2); opacity:0; }
	100% { transform:scale(1); opacity:1; }
}


/* privacy */
.privacy { color:#666; margin:0 auto; max-width:1400px; overflow:hidden; box-sizing:border-box; padding:20px; font-size:15px;	line-height:140%; word-break:break-all; }
.privacy h2 { font-size:18px; font-weight:bold; color:#333; text-align:left; margin:50px 0 30px; }
.privacy h2:first-child { margin-top:0; }
.privacy > p { margin:15px 0; }
.privacy > p+dl { margin-top:30px; }
.privacy > dl { padding-bottom:20px;}
.privacy > dl > dt{ font-size:15px;color:#013e93;font-weight:700;padding-bottom:5px;}
.privacy > dl > dd{ padding-bottom:10px;text-align:justify; font-size:15px; line-height:140%;}
.privacy > dl > dd ul{ padding:10px; }
.privacy > dl > dd ul li{ line-height:120%; margin-top:10px; }
.privacy > dl > dd ul li:first-child { margin-top:0; }
.privacy > dl > dd ul li p { margin:0 10px 5px; line-height:140%; margin-top:8px;}
.sTxt h3 { font-size:16px; color:#333; font-weight:700; margin:20px 0 10px; }
.sTxt p { margin-top:10px; }
.sTxt dt { margin-top:10px; }
.sTxt dd { margin:0 8px; }