@charset "UTF-8";

/* 폰트 */
@import url("./font.css");


/* reset */
html,body, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote,pre
q, s, dl, dt, dd, ol, ul, li,
fieldset, form, input, table,tr, th ,td, div, span, a { margin:0; padding:0; border:0; line-height:1.5; box-sizing:border-box;}
img, fieldset{border:0 none; vertical-align:top}
legend, caption, .skip{display:none;}
body {
	font-size:16px;
	line-height:1.5;
	color:#000;
	font-family:'Pretendard', 'Malgun gothic',"돋움", Dotum, "굴림", Gulim, "Lucida Grande", Tahoma, Verdana, AppleGothic, UnDotum, sans-serif;
	position:relative;
	font-weight:400;
}
strong { font-weight: 500; }
em { font-style: normal; }
dfn { font-style: normal; }
cite { font-style: normal; }
sup { font-size: .92em; }
sub { font-size: .92em; }
address { font-style: normal; }
del { text-decoration: line-through; }
ol, ul, li { list-style:none;}
table {border-collapse:collapse; border-spacing:0;}
hr {display:none;}
a { color:#333; text-decoration:none; }
a:visited { text-decoration:none; }
a:hover { text-decoration:underline; }
a:active {text-decoration:underline; }
button {cursor:pointer;vertical-align:middle;}
.clearfix:after {display:block; clear:both; content:"."; visibility:hidden; height:0;}
.clearfix {display:inline-block;}
* html .clearfix {height: 1%;}
.clearfix {display:block;}


/* skip Navi */
#accessibility{position:absolute;top:-1px;left:0;background-color:#333;z-index:999999}
#accessibility a{position:absolute;top:0;left:0;padding:10px 25px;margin-top:-100px;text-align:center;line-height:1;white-space:nowrap;background:#000}
#accessibility a:link{color:#333;}
#accessibility a:focus{margin-top:0;text-decoration:underline;color:#fff}


/* top_banner */
.head_fix #header{top:0;position:fixed;}
.top_banner #header{top:0;position:fixed;}
#top_banner{background:#5aa932;position:relative;top:0;width:100%;z-index:99;}
#top_banner .layout{position:relative;height:80px;display: flex;flex-direction: column;justify-content: center;}
#top_banner .layout a{display:block;text-align:center;}
#top_banner .btn_close{position:absolute;right:0;top:30px;width:20px;height:20px;font-size:0;border:0;background:url('../images/common/btn_close.png') no-repeat 0 0;}
.head_fix #m_lnb{top:0;}


/* header */
#header {position:relative;top:0; left:0;width:100%; z-index:99;text-align:center;background:#fff;}
#header .layout {height:100px; z-index:99;}
#header .logo {position:absolute;left:0;display:block;width:218px;vertical-align:top;padding:26px 0 0;z-index:101;}
#header .logo a{display:block;font-size:0;width:218px;height:41px;background:url('../images/common/logo.png') no-repeat 0 0;}

#gnb{padding:0 0 0 62px;display:inline-block;vertical-align:top;}
#gnb .menu:after{content:"";display:block;clear:both;}
#gnb .menu{display: flex;}
#gnb .menu > li{position:relative;display:inline-block;height:100%;vertical-align:top;display: flex;flex-direction: column;}
#gnb .menu > li > a{position:relative;display:block;width:148px;height:100px;line-height:100px;font-size:20px;color:#1d1d1d; font-weight:600;}
#gnb .menu > li:nth-child(5) > a{width:251px;}
#gnb .menu > li > a:hover{text-decoration:none;}
#gnb .menu > li > a:before {content: "";display: block;position: absolute;z-index: 1;width: 0;height: 0;border: solid #5aa932;-webkit-box-sizing: border-box;box-sizing: border-box;opacity: 0;-webkit-transition-property: width, height, opacity;transition-property: width, height, opacity;-webkit-transition-duration: 0.5s;transition-duration: 0.5s;-webkit-transition-timing-function: ease;transition-timing-function: ease;height: 100%;bottom: 0;left: 0;border-width: 0 0 2px 0;}
#gnb .menu > li > a:hover:before {width: 100%;opacity: 1;}
#gnb .menu > li.on > a{color:#5aa932;}
#gnb .submenu{display:none;width:100%;z-index:10;text-align:center;padding:13px 0 21px ;position:relative;}
#gnb .menu > li:first-child .submenu:before{display:none;}
#gnb .submenu li{vertical-align:top;}
#gnb .submenu li a{position:relative;display:inline-block;block;font-size:16px;line-height:1.37;color:#000; font-weight:500;letter-spacing:-0.04em;padding:8px 0;}
#gnb .submenu li a:before {content: "";display: block;position: absolute;z-index: 1;width: 0;height: 0;border: solid #5aa932;-webkit-box-sizing: border-box;box-sizing: border-box;opacity: 0;-webkit-transition-property: width, height, opacity;transition-property: width, height, opacity;-webkit-transition-duration: 0.5s;transition-duration: 0.5s;-webkit-transition-timing-function: ease;transition-timing-function: ease;height: 100%;bottom: 7px;left: 0;border-width: 0 0 2px 0;}
#gnb .submenu li a:hover:before {width: 100%;opacity: 1;}
#gnb .submenu li a:hover,#gnb .submenu > li > a:focus{text-decoration:none;}
#gnb .submenu > li li a:hover{text-decoration:underline;}
#header .mask{display:none;position:absolute;left:0;top:100px;z-index:10;width:100%;height:409px;z-index:-1;background:#fff;border-top:1px solid #dddddd;box-shadow: inset 0px 4px 10px #00000010}

#header .util{position:absolute;right:0;top:39px;width:250px;z-index:101;text-align:right;display:flex;justify-content: flex-end;gap:5px;}
#header .util .btn_member{display:inline-block;font-size:0;width:20px;height:18px;background:url('../images/common/btn_login.png') no-repeat 50% 50%;box-sizing:border-box;margin-right:26px;}
#header .util .btn_member2{display:inline-block;font-size:0;width:20px;height:18px;background:url('../images/common/btn_logout.png') no-repeat 50% 50%;box-sizing:border-box;margin-right:26px;}
#header .util .btn_search{display:inline-block;font-size:0;width:17px;height:18px;background:url('../images/common/btn_search.png') no-repeat 50% 50%;box-sizing:border-box;margin-right:26px;}
#header .util .btn_sitemap{display:inline-block;font-size:0;width:25px;height:18px;background:url('../images/common/btn_menu.png') no-repeat 50% 50%;box-sizing:border-box;}
#header .util .btn_close{display:inline-block;font-size:0;width:24px;height:26px;background:url('../images/common/btn_close.png') no-repeat 50% 50%;box-sizing:border-box;}
#header .util a:hover{text-decoration:none;}
#header .mask{display:none}
.mo-menu.open-menu #header .mask{display:block;position:fixed;left:0;top:0;background:#000;width:100%;height:calc(100%);z-index:50;opacity:0.4;transition:all 0.5s ease 0.3s;z-index:20;}


#m_lnb{display:none;}
.pc-menu #m_lnb{display:none;overflow-y:auto; position:fixed; top:80px;left:0;width:100%; z-index:1000;background:#326da9;padding:75px 0 125px;text-align:left;box-sizing: border-box;}
.pc-menu #m_lnb .m_lnb_in{width:1710px;margin:0 auto;position:relative;}
.pc-menu #m_lnb .submenu{display:flex;flex-direction: row;gap:40px;}
.pc-menu #m_lnb h2{font-size:50px;font-weight:500;color:#fff;margin:0 0 75px;line-height:1.2;}
.pc-menu #m_lnb .submenu a{color:#fff;}
.pc-menu #m_lnb .submenu > li{display:flex;flex-direction: column;}
.pc-menu #m_lnb .submenu > li > span{display:block;padding:0 0 28px;border-bottom:2px solid #80a6c0;}
.pc-menu #m_lnb .submenu > li > span > a{display:inline-block;font-size:24px;font-weight:500;}
.pc-menu #m_lnb .submenu > li > ul{display:flex !important;width:calc(100% - 220px);flex-direction: column;padding:15px 0 0;}
.pc-menu #m_lnb .submenu > li > ul > li{width:210px;padding:12px 0 0 ;}
.pc-menu #m_lnb .submenu > li > ul > li > a{font-size:18px;font-weight:400;}
#m_lnb .util{top:14px;}
.top_banner.pc-menu #m_lnb{top:0;}
.head_fix.pc-menu #m_lnb{top:0;}

.mo-menu #m_lnb {overflow-y:auto; position:fixed; top:0;left:auto; right:-1200px;width:460px; height:calc(100%); z-index:1000;background:#fff;padding-bottom:50px;text-align:right;}
.mo-menu #m_lnb h2{display:none;}
.mo-menu #m_lnb .m_lnb_in{height:calc(100%);}
.mo-menu #m_lnb .submenu{width:160px;padding:70px 0 0;text-align:left;height:calc(100%);background:#326da9}
.mo-menu #m_lnb .submenu > li{margin:0;padding:0;}
.mo-menu #m_lnb .submenu > li > span > a{position:relative;font-size:16px;text-align:center;height:50px;line-height:50px;display:block;color:#fff;}
.mo-menu #m_lnb .submenu > li > a:hover{text-decoration:none;}
.mo-menu #m_lnb .submenu > li > span > a.active{color:#002b5e;background:#fff;text-decoration:none;font-weight:500;}
.mo-menu #m_lnb .submenu > li:first-child > ul{display:block;}
.mo-menu #m_lnb .submenu > li > ul{display:none;position:absolute;left:160px;top:70px;height:calc(100% - 80px);width:calc(100% - 160px);background:#fff;padding:0 20px;}
.mo-menu #m_lnb .submenu > li > ul > li > a{position:relative;font-size:14px;font-weight:400;text-align:left;height:50px;line-height:48px;display:block;color:#1d1d1d;border-bottom:2px solid #002b5e;padding:0 36px 0 0;}
.mo-menu #m_lnb .submenu > li > ul > li > a:before{content:'';display:block;width:10px;height:15px;position:absolute;right:0;top:16px;background: url('../images/common/bg_lnb_3.png') no-repeat 0 50%;}
.mo-menu #m_lnb .submenu > li > ul > li > a:hover{color:#326da9;text-decoration:none;}
.mo-menu #m_lnb .submenu > li > ul > li > a.active{border-bottom:2px solid #274d7e;color:#002b5e;}
.mo-menu #m_lnb .submenu > li > ul > li.more > a:before{width:14px;height:14px;right:0;background: url('../images/common/bg_lnb_2.png') no-repeat 0 50%;}
.mo-menu #m_lnb .submenu > li > ul > li.more > a.active:before{width:14px;height:14px;right:0;background: url('../images/common/bg_lnb_1.png') no-repeat 0 50%;}
.mo-menu #m_lnb .submenu > li > ul ul{display:none;background:#f6f6f6;padding:12px 20px;}
.mo-menu #m_lnb .submenu > li > ul ul a{position:relative;font-size:14px;text-align:left;line-height:19px;display:block;color:#333;padding:5px 0 5px 15px;text-indent: -15px;}
.mo-menu #m_lnb .submenu > li > ul ul a:before{content:'';display:inline-block;width:5px;height:5px;background:#bdbdbd;margin-right:10px;vertical-align:2px;border-radius:100%;}
.mo-menu #m_lnb .submenu > li > ul ul a:hover{color:#326da9;}
.mo-menu #m_lnb .submenu > li > ul ul a:hover:before{background:#274d7e;}
.mo-menu.open-menu #header .util {right:18px;top:20px;}
.mo-menu.open-menu #header #m_lnb .util .btn_language{display:none;}
.mo-menu #m_lnb .util .btn_close{background:url('../images/common/btn_close_02.png') no-repeat 50% 50%;}

.layout{position:relative;width:1600px;margin:0 auto;}


/* footer */
#footer{position:relative;width:100%;background:#f5f5f5;z-index:97;}
#footer .link_go{position:relative;margin-bottom:55px;}
#footer .menu{padding:28px 0 ; display:flex;gap:25px;border-bottom:1px solid #CCC;}
#footer .menu li{width:auto;align-items: center;display:flex;gap:26px;}
#footer .menu li:before{content:'';display:inline-block;width:1px;height:10px;background:#999;}
#footer .menu li:first-child:before{display:none;}
#footer .menu a{display:inline-block;width:auto;font-size:17px;color:#333;font-weight: 500;}
#footer .menu a:hover{text-decoration:none;}

#footer .btn_top{position: absolute;width:60px;right:-70px;top:-27px;}
#footer .btn_top a{width:60px;height:60px;background:#999 url("../images/common/btn_top.png") no-repeat 50% 50%;font-size:0;display:block;border-radius:10px;}

#footer .logo{position:absolute;left:0;top:135px;display:block;font-size:0;width:218px;height:41px;background:url('../images/common/logo.png') no-repeat 0 0;}
#footer .address{color:#333;line-height:1.71;font-size:17px;padding:0 0 0 286px;font-weight: 500;}
#footer .address span{margin-right:32px;display:inline-block;vertical-align:top;}
#footer .address span strong{color:#333;margin-right:6px;}
#footer .address span a{color:#333;}
#footer .copy{color:#333;font-size:16px;padding:10px 0 98px 286px;font-weight: 500;}


@media screen and (max-width:1910px) {
	#header .layout {width:100%;box-sizing:border-box;padding:0 50px;}
	#header .logo {left:50px;}
	#header .util{right:50px;}
}
@media screen and (max-width:1800px) {
	.pc-menu #m_lnb .m_lnb_in{width:calc(100% - 40px);}
	.pc-menu #m_lnb .submenu{gap:30px;}
	.pc-menu #m_lnb .submenu > li{flex: auto;}
	.pc-menu #m_lnb .submenu > li > ul > li{width:100%;}
	.pc-menu #m_lnb .submenu > li > ul{width:100%;}

	#footer .btn_top{right:0;}
}
@media screen and (max-width:1700px) {
	.layout{width:calc(100% - 100px);}
}
@media screen and (max-width:1650px) {
	#gnb .menu > li > a{padding:0 10px 0;}
}
@media screen and (max-width:1480px) {
	#gnb .menu > li > a{width:138px;}
	#gnb .menu > li:nth-child(5) > a{width:235px;}
}
@media screen and (max-width:1400px) {
	#gnb{display:none;}
}
@media screen and (max-width:1325px) {
	#header .util .btn_popup{display:none;}
	#gnb .menu{text-align: right;}
	#gnb .menu > li > a{font-size:18px;}
}
@media screen and (max-width:1200px) {

	#footer .menu{width:100%;}
	#header .logo {left:50px;}

	.btn_top{right:50px;}
}
@media screen and (max-width:1100px) {
	#gnb .menu > li a{padding: 26px 30px 0;}
	#header .layout{padding:0 20px;height:60px;}
	#header .logo {left:20px;padding-top:19px;}
	#header .logo a{background-size: 150px;width:150px;}
	#header .util{right:20px;top: 21px;}

	.layout{width:calc(100% - 40px);}
}
@media screen and (max-width:980px) {
	#top_banner .layout{height:60px;}
	#top_banner .layout img{height:35px;}
	#top_banner .btn_close{display:none;}

	#header .util .btn_member{display:none;}

	#footer .menu{padding:17px 0;flex-wrap: wrap;gap: 7px}
	#footer .menu li{padding: 0 18px 0 0;gap: 0;}
	#footer .menu li:before{margin-right: 26px;}
	#footer .menu a{font-size:14px;}
	#footer .logo{position: relative;top: auto;margin-top: 30px;left:0;}
	#footer .address{padding:0;margin:30px 0 0;}
	#footer .copy{padding:8px 0 54.5px 0;}
	#footer .link_go{margin-bottom: 30px;}
	#footer .address span{font-size:14px;display:block;margin-right:0;}

	.btn_top{display:none;}
}
@media screen and (max-width:590px) {
	#footer .menu li:nth-child(3){padding-right:50px;}
	#footer .menu li:nth-child(4):before{display:none;}
}
@media screen and (max-width:540px) {
	#footer .menu li:nth-child(3){padding-right:0;}
}
@media screen and (max-width:460px) {
	.mo-menu #m_lnb{width:100%;}
}
@media screen and (max-width:430px) {
	#top_banner .layout img{width:100%;height:auto;}

	#footer .menu li{padding: 0 8px 0 0;}
	#footer .menu li:before{margin-right: 13px;}
}
@media screen and (max-width:395px) {
	#footer address{font-size: 12px;}
	#footer address em{display:inline-block;}
	#footer address span{display:inline-block;}
}
@media screen and (max-width:364px) {
	#footer .menu li:nth-child(2){padding-right:50px;}
	#footer .menu li:nth-child(3):before{display:none;}
	#footer .menu li:nth-child(4):before{display:block;}
	#footer .menu li:nth-child(5):before{display:none;}
}
@media screen and (max-width:331px) {
	#footer .logo{width:100%;background-size:100%;}
}
@media screen and (max-width:286px) {
	#footer address span{display:block;}
	#footer address span a{margin-right:0;}
}