@charset "utf-8";
@import url('font.css');
@import url('common.css');
@import url('board.css');
@import url('slick.css');
@import url('animate.css');
@import url('jquery.fullpage.min.css');

#wrap {overflow:hidden;}

/*공통*/
.fda_deco:before {content:''; display:inline-block; background:url(../../images/ico/ico_fda_w.png) no-repeat center; background-size:100%;}
.fda_deco.blue:before {background:url(../../images/ico/ico_fda_b.png);}
.font_noto {font-family: 'Noto Sans KR', "돋움", Dotum, Arial, sans-serif;}

/*텍스트 효과*/
.uptxt {display:block; overflow:hidden;}
.uptxt em {display:block; transform: translateY(100%); opacity:0; animation:upTxt 1.5s ease; animation-fill-mode:forwards;}

.inner {width:1420px; margin:0 auto;}

header {position:fixed; z-index:9999; top:0; left:0; width:100%; height:100px; text-align:center; transition:background .3s ease;}
header.sub{ border-bottom: 1px solid rgba(255, 255, 255, .2);}
header h1 {position:absolute; z-index:1000; top:32px; left:80px; width:146px; height:31px; text-indent:-9999px; background:url(../../images/ico/ico_logo.png) no-repeat center; background-size:100%;}
header h1.color {background-image:url(../../images/ico/ico_logo_c.png);}
header h1 a {display:block; width:100%; height:100%;}

header nav {display:inline-block;}
header nav ul li {display:inline-block; vertical-align:top;}
header nav ul li a {display:block; width:100%; height:100%;}
header nav .depth01 .fda_b {display:none;}
header nav .depth01 > li {margin:0 -3px;}
header nav .depth01 > li:hover > a:after ,
header nav .depth01 > li.on > a:after {content:''; position:absolute; z-index:1; bottom:-5px; left:44%; width:19px; height:16px; background: url(../../images/ico/ico_nav_hover.png) no-repeat center; }
header nav .depth01 > li:hover .depth02 {display:block; animation:menushow .5s ease;}
header nav .depth01 > li > a {position:relative; padding:42px 33px; color:#fff; font-size:18px; font-weight:600; font-family:'Montserrat';}
header nav .depth01 > li > a:after {content:''; position:absolute; z-index:1;  left:0; transition:all .3s ease;}
header nav .depth01 > li > .fda_deco:before {width:32px; height:13px; margin-right:4px;}

header nav .depth02 {display:none; position:absolute; z-index:1; top:70px; left:0; width:100%; padding:75px 0 40px; text-align:center;}
header nav .depth02 .submenu > li {margin:0 54px; padding-bottom:25px;}
header nav .depth02 .submenu > li > a {color:#000; font-size:19px; font-weight:500; }
header nav .depth02	.submenu > li:hover > a {color:#01974d;}
header nav .depth03 {margin-top:35px;}
header nav .depth03 > li {display:block;}
header nav .depth03 > li + li {margin-top:21px;}
header nav .depth03 > li a {color:#666; font-size:16px;}

header nav .none_sub .depth03 {display: none;}

header .util {position:absolute; z-index:999; top:40px; right:80px;}
header .util h2 {display:inline-block; width:34px; height:22px; margin-left:20px; text-indent:-9999px; vertical-align:top; background:url(../../images/ico/ico_menu.png) no-repeat center; background-size:100%; cursor:pointer;}
header .util .lang {display:inline-block; position:relative; text-align:center;}
header .util .lang > a {display:block; width:58px; height:22px; background:url(../../images/ico/ico_lang.png) no-repeat 0 2px; background-size: 18px;}
header .util .lang > a span{color:#fff; font-size:12px; font-weight:500; padding:0 0 0 15px;}
header .util .lang ul {display:none; position:absolute; top:31px; left:50%; width:58px; padding:14px 0; margin-left:-29px; border-radius:4px; box-shadow:0 2px 10px 0 rgba(0,0,0,0.18); background:#fff;}
header .util .lang ul li + li {margin-top:7px;}
header .util .lang ul li a {display:inline-block; position:relative; padding:5px 3px; font-size:12px; font-weight:500; }
header .util .lang ul li.on a:before {content:''; position:absolute; left:0; bottom:0; width:100%; height:2px; background:#265fb2;}

.test_go {display:none; font-size:20px; font-weight:500;}
.test_go a {display:block; width:100%; height:100%;}

.m_logo {display:none; height:80px; padding:30px 0 0 29px; border-bottom:1px solid #e8e8e8;}
.m_logo a {display:block; width:109px; height:40px; text-indent:-9999px; background:url(../../images/ico/ico_logo_c.png) no-repeat center; background-size:100%;}

/*메뉴 오버시*/
header.active {background:#fff; border-bottom:1px solid #e8e8e8;}
header.active h1 {background-image:url(../../images/ico/ico_logo_c.png);}
header.active nav .depth01 > li > a {color:#2b2b2b;}
header.active nav .depth01 > li > .fda_deco:before {background-image:url(../../images/ico/ico_fda_b.png);}
header.active .util h2 {background-image:url(../../images/ico/ico_menu_c.png);}
header.active .util .lang > a {background-image:url(../../images/ico/ico_lang_c.png);}
header.active .util .lang > a span{color:#333;}

/*메뉴 스크롤시*/
header.scroll{/*background:#fff; box-shadow: 0 0 10px rgb(0 0 0 / 20%); border-bottom:1px solid #e8e8e8;*/}
header.scroll h1 {background-image:url(../../images/ico/ico_logo_c.png);}
header.scroll nav .depth01 > li > a {color:#000;}
header.scroll nav .depth01 > li > .fda_deco:before {background-image:url(../../images/ico/ico_fda_b.png);}
header.scroll .util h2 {background-image:url(../../images/ico/ico_menu_c.png);}
header.scroll .util .lang > a {background-image:url(../../images/ico/ico_lang_c.png);}
header.scroll .util .lang > a span{color:#333;}

.nav_bg {position:fixed; z-index:-1; top:100px; left:0; width:100%; opacity:0; height:0; visibility:hidden; background:#fff; box-shadow:0px 20px 17px -12px rgba(0,0,0,.15); transition:all .4s ease;}
.nav_bg.show {opacity:1; visibility:visible;}

/*전체메뉴*/
.all_menu.open {display:block; }
.all_menu {display:none; position:fixed; z-index:999; top:0; right:0; width:100%; height:748px; padding-top:150px; text-align:left; background:#fff; box-shadow:0 2px 10px 0 rgba(0,0,0,0.18);}
.all_menu .wrapper {padding:0 10%; margin: 0 auto; }
.all_menu .wrapper > div {display: flex; padding-bottom: 36px; border-bottom:1px solid #e8e8e8;}
.all_menu .wrapper > div:after {content:''; display:block; clear:both;}
.all_menu .wrapper > div:last-child {border-bottom: none;}
.all_menu .wrapper > div + div { margin-top: 36px;}
.all_menu .wrapper > div p {width:360px; font-size:19px; font-weight:600;}
.all_menu .wrapper > div p span { display: inline-block; margin-left: 5px; width: 8px; height: 8px; border-radius: 50%; background: #e7161a;}
.all_menu .wrapper > div p a {display:block; width:100%; height:100%;}
.all_menu .submenu {display: flex; flex-wrap: wrap; gap: 20px 0; width:100%;}
.all_menu .submenu > li {width:20%; }
.all_menu .submenu > li:hover a {color:#01974d;}
.all_menu .submenu > li > a {color:#333; font-weight:500;}
.all_menu .submenu > li .depth02 {margin-top:18px;}
.all_menu .submenu > li .depth02 a {display:block; width:100%; height:100%; padding:12px 0; color:#666; font-size:15px; font-weight:200;}
.all_menu .close {position:absolute; top:32px; right:70px; cursor:pointer;}
.all_menu .close p {position:relative; display:inline-block; vertical-align:middle; text-align:center; width:45px; height:45px;}
.all_menu .close p a{position:absolute; left:0; top:5px; display:inline-block; width:45px; height:2px; background:#000; margin:7px 0; transform: rotate(-45deg); transition:all 0.5s ease;}
.all_menu .close p a.two{transform: rotate(45deg); transition:all 0.5s ease;}
.all_menu .close:hover p a{transform: rotate(45deg); transition:all 0.5s ease;}
.all_menu .close:hover p a.two{transform: rotate(-45deg); transition:all 0.5s ease;}

.top_btn {position:fixed; z-index:1; bottom:70px; right:20px; width:56px; height:56px; opacity:0; visibility:hidden; text-indent:-9999px; background: url(../../images/ico/ico_top.png) no-repeat center; background-size:100%; cursor:pointer; transition:opacity .3s ease;}
.top_btn.show {visibility:visible; opacity:1;}

footer { padding:58px 80px 58px; background:#222;}
footer .inner {position:relative; width:100%;}
footer .f_logo {display:inline-block; vertical-align:top; width:127px; height:27px; margin-right:65px; text-indent:-9999px; background:url(../../images/ico/ico_f_logo.png) no-repeat center; background-size:100%;}
footer address {display:inline-block; padding-top:6px; vertical-align:top;}
footer address > p + div {margin-top:10px;}
footer address p {display:inline-block; color:#a1a1a1; vertical-align:top;}
footer address p a {color:#a1a1a1; vertical-align:top; }
footer address p span {margin-left:7px; color:#6d6d6d; vertical-align:top;}
footer address .info p {margin-right:34px; font-weight:500;}
footer .fr_con {position:absolute; top:50%; margin-top:-35px; right:0; text-align:right; transform: translateY(50%);}
footer .fr_con a{color:#bababa;}
footer .fr_con > p {margin-top:10px; color:#929292; font-size:14px; font-weight:300;}

.floatingMenu { position: fixed; z-index:99999; bottom: 60px; right:20px; }
.floatingMenu .menuWarp {position: relative; overflow: hidden;}

.quick-menu-wrap {position:fixed; left:0; bottom:0; display: flex ; justify-content: flex-end; align-items: center; width: 100%; height: auto; overflow: hidden; z-index: 999;}
.quick-menu-wrap .btn-quick {width:48px; height:48px; border:0; background-color: #000; border-radius: 50%; margin:0 24px 24px 0; padding:0;}
.quick-menu-wrap.on .btn-quick {display:none;}
.quick-menu-wrap .quick-list-wrap { display:none; width: 140px; height:auto;/* border-radius: 10px; background:rgb(255,255,255);*/}
.quick-menu-wrap.on { opacity:1;display:flex; }
.quick-menu-wrap.on .quick-list-wrap {display:block; opacity:1;}
.quick-menu-wrap .quick-list-wrap ul { position: relative; margin-right: 24px; margin-bottom: 79px;}
.quick-menu-wrap .quick-list-wrap ul li { display:flex; margin-bottom: 4px;}
.quick-menu-wrap .quick-list-wrap ul li a {display:flex;justify-content:center;align-items:center; text-align: center; width: 140px; height: 48px; border-radius: 24px; background:#fff; font-size:14px;color:#000;font-weight:600; box-shadow: 0 2px 5px rgb(0 0 0 / 20%);}
.quick-menu-wrap .quick-list-wrap .quick-close {position:absolute; right:24px; bottom:24px; width:48px; height:48px; overflow:hidden; border:0; border-radius: 50%; background-color: #01974d;}
.quick-menu-wrap .quick-list-wrap .quick-close img {transform:rotate(135deg); }

/*서브비주얼*/
.sub_visual {position:relative; height:410px; text-align:center; background-image:url(../../images/pic/pic_subvisual01.jpg); background-repeat:no-repeat; background-position:center; background-size:cover;}
.sub_visual .sub_tit {position:relative; top:50%; color:#fff; transform:translateY(-50%);}
.sub_visual .sub_tit h3 {font-size:50px; font-weight:500; font-family:'Montserrat';}
.sub_visual .sub_tit p {margin-top:19px; font-size:16px; font-weight:200;}

/*로케이션*/
.location .wrapper {position:relative; top:-39px; left:50%; margin-left:-650px; width:100%; background:#265fb2;}
.location ol:after {content:''; display:block; clear:both;}
.location li a {display:block; width:100%; height:100%; padding:0 30px; font-size:16px;}
.location .lo_depth01 > li {float:left; position:relative; z-index:1; width:300px; border-right:1px solid rgba(255,255,255,0.21);}
.location .lo_depth01 > li > a {position:relative; color:#fff; font-weight:500; line-height:66px;}
.location .lo_depth01 > li > a:after {content:''; position:absolute; top:50%; right:30px; width:13px; height:7px; margin-top:-3.5px; background:url(../../images/ico/ico_loca_arw.png) no-repeat center; background-size:100%; transform:rotate(0deg); transition:transform .3s ease;}
.location .lo_depth01 > li.home {width:65px; text-indent:-9999px; background:url(../../images/ico/ico_loca_home.jpg) no-repeat center; background-size:12px;}
.location .lo_depth01 > li.home > a:after {display:none;}
.location .lo_depth01 > li.on a:after {transform:rotate(180deg);}
.location .lo_depth01 > li.on:after {opacity:1;}
.location .lo_depth01 > li:after {content:''; position:absolute; z-index:-1; top:0; left:-1px; width:100%; height:100%; border:solid #1d3775; border-width:1px 1px 0 1px; opacity:0; transition:border-color .3s ease;}
.location .lo_depth02 {visibility:hidden; opacity:0; position:absolute; z-index:9; top:66px; left:-1px; width:calc(100% + 2px); border:solid #1d3775; border-width:0 1px 1px 1px; background:#fff; transition:opacity .3s ease;}
.location .lo_depth02.view {visibility:visible; opacity:1;}
.location .lo_depth02 > li > a {padding:17px 30px 22px; color:#666; font-weight:200;}
.location .lo_depth02 > li > a:hover {background-color:#f6f6f6;}

/*서브공통*/
.sub_wrap {padding-top:60px;}



/*****애니메이션******/
@keyframes menushow {
	0% {opacity:0;}
	100% {opacity:1; visibility:visible;}
}

@keyframes upTxt {
	0% {opacity:0;}
	100% {opacity:1; transform: translateY(0);}
}

@keyframes move {
	0% {bottom:-23px;}
	100% {bottom:-28px;}
}



/******************************************************************************************************************************************/
@media all and (max-width:1701px){
	.inner {width:auto; padding:0 24px;}

	header h1 {left:30px; width:132px; height:27px;}
	header .util {right:30px;}
	header nav .depth01 > li > a {padding:42px 20px; }
	
	.all_menu {padding-top:140px;}
	.all_menu .submenu > li {font-size:16px;}
	.all_menu .submenu > li .depth02 a {font-size:14px;}
	.all_menu .wrapper {padding:0 20px;}
	.all_menu .close {right:30px;}
}

@media all and (max-width:1401px){
	header nav .depth01 > li > a {padding:42px 15px; font-size:16px;}
	header nav .depth02 .submenu > li > a {font-size:16px;}
	header nav .depth03 {margin-top:25px;}
	header nav .depth03 > li a {font-size:15px;}

	footer {padding:30px;}
	footer .f_logo {margin-bottom: 10px;}
	footer address {display:block;}
	footer .fr_con {top:auto; bottom:10px; transform: none;}
}

@media all and (max-width:1280px){
	header nav .depth02 {padding:75px 0 40px; }
	header nav .depth01 > li > a {padding:42px 10px; font-size:15px;}
	header nav .depth02 .submenu > li {margin:0 24px; }
	header nav .depth02 .submenu > li > a {font-size: 15px;}
}

@media all and (max-width:1176px){
	header .util {right:20px;}
	header .util h2 {margin-left:10px;}
	header nav .depth01 > li > a {padding:42px 8px; font-size:13px;}
}

/*태블릿*/
@media all and (max-width:1025px){
	
	header.mb_bg:before {content:''; position:fixed; z-index:1001; top:0; left:0; width:100%; height:100%; background:rgba(0,0,0,.75);}
	header {height:80px; text-align:left; }
	header h1 {top:26px; left:26px;}
	
	header nav.open {display:block;}
	header nav {display:none; position:fixed; z-index:9998; right:0; top:0; width:643px; height:101%; padding-top:0; background:#fff;}
	header nav ul {width:100%;}
	header nav ul li {display:block;}

	header nav .depth01 {padding:0 0;}
	header nav .depth01 > li {margin:0;}
	header nav .depth01 > li:hover .depth02 {display:none; animation:none;}
	header nav .depth01 > li > a {/*background:url(../../images/ico/ico_arw_m_b.jpg) no-repeat center right 15px; background-size:21px;*/}
	header nav .depth01 > li:first-child > a {border-top:0;}
	header nav .depth01 > li.on > a {color:#fff; background:#01974d;}
	header nav .depth01 > li > a {padding:22px 0 22px 20px;}
	header nav .depth01 > li + li > a {border-top:0;}
	header nav .depth01 > li > a {border-top:1px solid #b7b7b7; border-bottom:1px solid #e5e5e5; color:#000;}
	header nav .depth01 > li > a:after {display:none;}
	header nav .depth01 .fda_b.mo_fda {display:inline-block;}
	header nav .depth01 > li > .fda_deco:before {display:none;}
		
	header nav .depth02 {position:static; top:0; padding:14px 26px 17px; text-align:left; border-bottom:1px solid #e5e5e5; }
	header nav .depth02 .submenu > li {margin:0; padding-bottom:0}
	header nav .depth02 .submenu > li > a {padding:13px 0; background:url(../../images/ico/ico_arw_m_g.jpg) no-repeat center right 0; background-size:17px; }
	
	header nav .depth03 {display:none; width:calc(100% + 50px); padding:20px 0; margin:5px -25px 11px -25px; background:#f5f2f2;}
	header nav .depth03 > li a {padding:0 26px;}
	header nav .none_sub a {background-image:none !important;}
	
	header .util {top:30px; right:26px; z-index:9999;}
	header .util h2.mb_menu {width:22px; height:22px; background-image:url(../../images/ico/ico_m_close.jpg);}
	
	header.scroll {background: #fff;}

	.all_menu {display:none; visibility: hidden !important; opacity:0 !important;}
	.nav_bg {display:none; visibility: hidden !important; opacity:0 !important;}
	
	.m_logo {display:block;}
	.test_go {display:block; width:100%; padding:30px 30px 0;}

	.top_btn {bottom:60px; right:14px; width:46px; height:46px;}

	.quick-menu-wrap .btn-quick {width:36px; height:36px; margin:0 20px 20px 0; }
	.quick-menu-wrap .quick-list-wrap ul {margin-right: 20px; margin-bottom: 67px;}
	.quick-menu-wrap .quick-list-wrap ul li a { height:36px; border-radius: 23px;}
	.quick-menu-wrap .quick-list-wrap .quick-close {right:20px; bottom:20px; width:36px; height:36px;}

	footer {padding:24px 0;}
	footer .f_logo {display:block; }
	footer address {margin-bottom: 60px;}
	footer address > p + div {margin-top:5px;}
	footer .fr_con {position: relative; bottom: auto; text-align: center;}

	h4 {font-size:35px;}

}

@media all and (max-width:768px){
	header.mb_bg:before {display:none;}
	header h1 {width:109px; height:24px;}
	header nav {width:100%;}
	header nav .depth01 > li > a {font-size:15px; background-size:17px;}
	header nav .depth02 {padding:10px 20px 12px;}
	header nav .depth02 .submenu > li > a {font-size:14px; background-size:14px;}
	header nav .depth03 {padding:12px 0;}
	header nav .depth03 > li a {font-size:13px;}
	.m_logo {padding:20px 0 0 20px;}

	footer address p {font-size: 14px;}
	footer .fr_con > p {font-size: 12px;}

	.test_go {font-size:18px;}
	
	h4 {font-size:30px;}
}

/*모바일*/
@media all and (max-width:640px){

	
}
@media all and (max-width:480px){
	h4 {font-size:26px;}

	
}