@charset "utf-8";

/* Font */
@font-face {
  font-family: 'Noto Sans KR';
  font-style: normal;
  font-weight: 300;
  src: url(/css/font/NotoSansKR-Light.woff2) format('woff2'),
       url(/css/font/NotoSansKR-Light.woff) format('woff'),
       url(/css/font/NotoSansKR-Light.otf) format('opentype');
}
@font-face {
   font-family: 'Noto Sans KR';
   font-style: normal;
   font-weight: 400;
   src: url(/css/font/NotoSansKR-Regular.woff2) format('woff2'),
        url(/css/font/NotoSansKR-Regular.woff) format('woff'),
        url(/css/font/NotoSansKR-Regular.otf) format('opentype');
 }
@font-face {
   font-family: 'Noto Sans KR';
   font-style: normal;
   font-weight: 500;
   src: url(/css/font/NotoSansKR-Medium.woff2) format('woff2'),
        url(/css/font/NotoSansKR-Medium.woff) format('woff'),
        url(/css/font/NotoSansKR-Medium.otf) format('opentype');
 }
@font-face {
   font-family: 'Noto Sans KR';
   font-style: normal;
   font-weight: 700;
   src: url(/css/font/NotoSansKR-Bold.woff2) format('woff2'),
        url(/css/font/NotoSansKR-Bold.woff) format('woff'),
        url(/css/font/NotoSansKR-Bold.otf) format('opentype');
 }

 @font-face {
   font-family: 'NanumBarunGothic';
   font-style: normal;
   font-weight: 400;
   src: url(/css/font/NanumBarunGothic-Regular.eot) format('eot'),
        url(/css/font/NanumBarunGothic-Regular.woff) format('woff'),
        url(/css/font/NanumBarunGothic-Regular.otf) format('opentype');
 }
  @font-face {
   font-family: 'NanumBarunGothic';
   font-style: normal;
   font-weight: 300;
   src: url(/css/font/NanumBarunGothic-Light.eot) format('eot'),
		url(/css/font/NanumBarunGothic-Light.woff) format('woff'),
		url(/css/font/NanumBarunGothic-Light.woff2) format('woff2'),
		url(/css/font/NanumBarunGothic-Light.otf) format('opentype');
 }

@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400,600&display=swap');


/* Element Reset */
html, body				{ margin:0; padding:0; font-size:14.5px; font-family:'Noto Sans KR', 'NanumBarunGothic',  dotum, '돋움', 'Malgun Gothic', '맑은 고딕', sans-serif; font-weight:400; color:#555;}
video, audio, iframe, object, embed	{ max-width:100%; }
select						{ height:25px; border:1px solid #dcdcdc}
option					{ font-size:14px; line-height:100%}
ul, ol, figure, dl, dd	{ margin:0; padding:0}
a,
a:link, 
a:visited				{ color:inherit; text-decoration:none;}
.png24					{ tmp:expression(setPng24(this));}
img					{ max-width:100%}
button				{ background:none; cursor:pointer;}



/* Common Class */
.inputRadio,	
.inputCheck,
input[type="checkbox"]	{ margin:0; width:13px; height:13px;}
.inputText					{ height:14px; *margin:-1px 0; font-size:13px; padding:2px 4px 0; border:1px solid #999; border-right-color:#ccc; border-bottom-color:#ccc;  }
input.inputText01			{ height:28px; border:1px solid #dcdcdc; background:#fff; }
input.ed						{ padding:2px; border:1px solid #dcdcdc; }
textarea						{ padding:2px 6px; border:1px solid #e5e5e5; }
table							{ width:100%; border-spacing:0; border:0; }
table th, table td			{ padding: 0}

/* All */
.blind, .skip, hr, legend, caption { position:absolute; width:1px; height:1px; overflow:hidden; clip:rect(0,0,0,0); clip-path:polygon(0 0, 0 0, 0 0); }
.clearfix					{ zoom:1}
.clearfix:after			{ content:''; display:block; clear:both;}

/* Module */
.con_inner				{ max-width:1500px; width:92%; margin-left:auto; margin-right:auto; }

/* Layout */
.container				{ position:relative; width:100%; min-width:1550px; margin:0; overflow-x:hidden }
.body						{ position:relative; width:100%; min-height:600px; margin:0; padding:0; text-align:left; zoom:1 }
.body:after				{ content:""; clear:both; display:block}
.header					{ position:relative; width:100%; height:90px; text-align:center; background:#fff; z-index:99}
.header::before			{ position:absolute; left:0; bottom:-16px; width:100%; height:16px; z-index:9; content:"";
							background:-moz-linear-gradient(top,rgba(132,132,132,0.05) 0%,rgba(245,245,245,0) 100%);
							background:-webkit-linear-gradient(top,rgba(132,132,132,0.05) 0%,rgba(245,245,245,0) 100%);
							background:linear-gradient(to bottom,rgba(132,132,132,0.05) 0%,rgba(245,245,245,0) 100%);
							filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#66e4e4e4', endColorstr='#00d6d6d6',GradientType=0 );}
.footer					{ position:relative; width:100%; padding:2% 0 3%; color:#cecece; background:#1d1d1d;}

/* Header */
.header h1						{ float:left; position:relative; width:157px; height:31px; margin:33px 0 26px; background:url(/img/common/img_logo.svg) no-repeat 0 0 / 100% 100%}
.header h1 a					{ display:block; height:100%; width:100%}

/* Gnb */
.header #gnb					{ display:inline-block; *display:inline; margin-top:34px; }
#gnb .menu					{ position:relative; }
#gnb .menu>li					{ position:relative; display:inline-block; *display:inline; margin-left:55px;}
#gnb .menu>li:first-child	{ margin-left:0;}	
#gnb .menu>li>a				{ margin:0; font-size:18.5px; font-family:'Noto Sans KR'; font-weight:700; color:#34464e; letter-spacing:-.04em }
#gnb .gnbsingle				{ display:none; position:absolute; width:160px; left:50%; margin-left:-80px; padding-top:29px; z-index:10}
#gnb .gnbsingle li				{ margin-bottom:1px; background:rgba(149,198,83,.8); }
#gnb .gnbsingle li a			{ display:block; padding:8px 0; color:#fff; font-size:14px;}

.top_menu									{ float:right; margin-top:36px;}
.top_menu>li								{ display:inline-block; *display:inline; margin-left:16px; vertical-align:middle}
.top_menu li:first-child					{ margin-left:0;}
.top_menu .txt a							{ display:block; color:#585858; font-size:12.5px; font-weight:300;}
.header .top_menu a[data-util="menu"]	{ position:relative; display:block; text-align:center; font-size:0; }
.header .top_menu a[data-util="menu"] span{overflow:hidden; display:block; position:relative; width:32px; height:18px; margin-top:5px; }
.header .top_menu a[data-util="menu"] span:before,
.header .top_menu a[data-util="menu"] span:after{display:block; position:absolute; height:2px; background:#006320; transform:translateX(0);}
.header .top_menu a[data-util="menu"] span i {display:block; position:absolute; height:2px; background:#96cf4a; transform:translateX(0);}
.header .top_menu a[data-util="menu"] span:before,
.header .top_menu a[data-util="menu"] span:after{content:''; width:100%;}
.header .top_menu a[data-util="menu"] span:before{right:0; top:0; transition:transform 0.5s ease 1.2s;}
.header .top_menu a[data-util="menu"] span:after{left:0; bottom:0; transition:transform 0.5s ease 1s;}
.header .top_menu a[data-util="menu"] span i{opacity:1; left:0; top:8px; width:100%; transition:opacity 0.3s ease 0s, transform 0.5s ease 1.1s;}
.header .top_menu a[data-util="menu"] em{display:block; overflow:hidden; position:absolute; top:0; left:0; width:22px; height:22px; transform:translateX(20px); transition:transform 0.5s ease 0.5s;}
.header .top_menu a[data-util="menu"] em i{display:block; position:absolute; width:0; height:2px; background:#006320; transform:rotate(0);}
.header .top_menu a[data-util="menu"] em i:nth-of-type(1){top:0; left:0; transition:width 0.5s ease 0.5s, transform 0.5s ease 0s, top 0.5s ease 0s;}
.header .top_menu a[data-util="menu"] em i:nth-of-type(2){bottom:0; left:0; transition:width 0.5s ease 0.5s, transform 0.5s ease 0s, bottom 0.5s ease 0s;}
.header .top_menu a[data-util="menu"].on span i,
.header .top_menu a[data-util="menu"].on span:before,
.header .top_menu a[data-util="menu"].on span:after{transform:translateX(-32px);}
.header .top_menu a[data-util="menu"].on span:before{transition-property:transform; transition-delay:0s;}
.header .top_menu a[data-util="menu"].on span i{transition-property:transform; transition-delay:0.1s;}
.header .top_menu a[data-util="menu"].on span:after{transition-property:transform; transition-delay:0.2s;}
.header .top_menu a[data-util="menu"].on em{transform:translateX(0); transition-duration:0s; transition-delay:0s;}
.header .top_menu a[data-util="menu"].on em i:nth-of-type(1){top:8px; width:100%; transform:rotate(45deg) perspective(500px); transition-delay:0.5s, 1s, 1s;}
.header .top_menu a[data-util="menu"].on em i:nth-of-type(2){bottom:12px; width:100%; transform:rotate(-45deg) perspective(500px); transition-delay:0.5s, 1s, 1s;}



/* 전체메뉴 */
.allMenu											{ display:inline-block; *display:inline; }
.allMenu .depth								{ position:absolute; top:90px; right:0; width:100%; height:auto; padding:1.8% 0 2.5%; text-align:left; box-sizing:border-box; background:#f8f8f8; z-index:999}
.allMenu .depth>ul>li						{ float:left; width:19%; box-sizing:border-box;}
.allMenu .depth>ul>li + li					{ margin-left:1.2%}
.allMenu .depth>ul>li>a						{ display:block; padding-bottom:.1em; font-size:19px; color:#347746; font-family:'Noto Sans KR'; font-weight:500; letter-spacing:-.075em; box-sizing:border-box; border-bottom:1px solid #347746; box-sizing:border-box; }
.allMenu .depth .all_sub a					{ display:block; margin-bottom:.2em; font-size:15.5px; color:#333; font-family:'Noto Sans KR'; letter-spacing:-.08em;}
.allMenu .depth .all_sub a:hover,
.allMenu .depth .all_sub a:focus			{ color:#000}
.allMenu .depth .all_sub li:first-child a	{ margin-top:10px;}


/* Footer */
.footer .con_inner							{ position:relative; }
.footer .footer_btn						{ margin-bottom:.5em;}
.footer .footer_btn li						{ display:inline-block; *display:inline; }
.footer .footer_btn li + li a::before	{ content:"|"; display:inline-block; *display:inline; margin:.07em .5em 0 0; font-size:.8em; vertical-align:top; }
.footer .footer_btn li a					{ display:block; padding:0 .3em; font-size:16px; color:#a8a8a8}
.footer .footer_btn li:first-child a		{ padding-left:0;}
.footer .footer_add address				{ font-style:normal;}
.footer .footer_add address div *		{ display:inline-block; *display:inline; margin:0 }
.footer .footer_add dl + dl				{ margin-left:1em}
.footer .footer_add .copy				{ display:block; margin-top:.7em; font-size:15px; opacity:.5}
.footer .footer_sns							{ position:absolute; top:-.5em; right:0; font-size:15px;}
.footer .footer_sns .sns a				{ position:relative; display:inline-block; padding-bottom:.4em; line-height:1;}
.footer .footer_sns .sns a::after			{ position:absolute; bottom:0; left:0; width:100%; height:2px; background:#9c9c9c; content:""}
.footer .footer_sns .top a				{ position:relative; display:block; width:51px; height:51px; margin:1.5em auto 0; border:1px solid}
.footer .footer_sns .top a:before		{ position:absolute; top:27%; left:50%; width:2px; height:46%; background:#a0a0a0; content:"";}
.footer .footer_sns .top a::after			{ position:absolute; top:27%; left:42%; width:8px; height:8px; border:solid #a0a0a0; border-width:2px 2px 0 0; transform:rotate(-45deg); content:"";}