@charset "utf-8";
/*------------------------------------*
    RESET
 *------------------------------------*/
html { font-family: sans-serif; -webkit-text-size-adjust: 100%; -ms-text-size-adjust: 100% }
body { margin: 0 }
article, aside, details, figcaption, figure, footer, header, hgroup, main, menu, nav, section, summary { display: block }
audio, canvas, progress, video { display: inline-block; vertical-align: baseline }
audio:not([controls]) { display: none; height: 0 }
[hidden], template {
display: none
}
a { background-color: transparent }
a:active, a:hover { outline: 0 }
abbr[title] { border-bottom: 1px dotted }
b, strong { font-weight: 700 }
dfn { font-style: italic }
h1 { margin: .67em 0; font-size: 2em }
mark { color: #000; background: #ff0 }
small { font-size: 80% }
sub, sup { position: relative; font-size: 75%; line-height: 0; vertical-align: baseline }
sup { top: -.5em }
sub { bottom: -.25em }
img { border: 0 }
svg:not(:root) { overflow: hidden }
figure { margin: 1em 40px }
hr { height: 0; -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box }
pre { overflow: auto }
code, kbd, pre, samp { font-family: monospace, monospace; font-size: 1em }
button, input, optgroup, select, textarea { margin: 0; font: inherit; color: inherit }
button { overflow: visible }
button, select { text-transform: none }
button, html input[type=button], input[type=reset], input[type=submit] { -webkit-appearance: button; cursor: pointer }
button[disabled], html input[disabled] { cursor: default }
button::-moz-focus-inner, input::-moz-focus-inner {
padding: 0;
border: 0
}
input { line-height: normal }
input[type=checkbox], input[type=radio] { -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box; padding: 0 }
input[type=number]::-webkit-inner-spin-button, input[type=number]::-webkit-outer-spin-button {
height: auto
}
input[type=search] { -webkit-box-sizing: content-box; -moz-box-sizing: content-box; box-sizing: content-box; -webkit-appearance: textfield }
input[type=search]::-webkit-search-cancel-button, input[type=search]::-webkit-search-decoration {
-webkit-appearance: none
}
fieldset { padding: .35em .625em .75em; margin: 0 2px; border: 1px solid silver }
legend { padding: 0; border: 0 }
textarea { overflow: auto }
optgroup { font-weight: 700 }
table { border-spacing: 0; border-collapse: collapse }
td, th { padding: 0 }
/*------------------------------------*
     General & Basic
 *------------------------------------*/
html { overflow-x: hidden; font-size: 75%; }
html, body { height: 100% }
html, body, pre, h1, h2, h3, h4, h5, h6, dl, dt, dd, ul, li, ol, th, td, p, blockquote, form, fieldset, legend, menu, nav, section, hgroup, article, header, aside, footer, input, select, textarea, button { margin: 0; padding: 0; }
body, button, input, select, textarea { font: 1em/1.45 '나눔고딕', 'NanumGothic', '맑은 고딕', 'Malgun Gothic', '애플 SD 산돌고딕 Neo', 'Apple SD Gothic Neo', 돋움, sans-serif; color: #535353; }
h1, h2, h3, h4, h5, h6, strong, b { font-size: inherit; font-weight: 700; }
a { color: inherit; text-decoration: none }
a:active, a:hover { outline: 0; }
img, fieldset, button { border: 0 none; }
img { vertical-align: top; max-width: 100%; }
ul, ol { list-style: none; }
:focus { outline: 0; }
hr, caption, legend { display: none; }
button { overflow: hidden; cursor: pointer; }
button span { visibility: hidden; }
address, em { font-style: normal; }
button, input, select, textarea, a {/* vertical-align: middle; */ }
select, input[type=text], input[type=password], input[type=file], textarea { box-sizing: border-box; border: 1px solid #bfbfbf; }
input[type=text], input[type=password] { padding: 0 5px; height: 22px; line-height: 20px; }
input[type=file] { padding: 0 2px; background-color: #f9f9f9 }
select { height: 22px; padding: 0 0 0 5px; line-height: 20px }
input:focus { outline: none; }
textarea { overflow: auto; padding: 10px; }
table { width: 100%; table-layout: fixed; word-wrap: break-word; word-break: keep-all; }
::-webkit-input-placeholder, ::-moz-placeholder, :-ms-input-placeholder, :-moz-placeholder, ::placeholder, :placeholder-shown {
color: #aaa;
}
/* Layout */
.container { margin: 0 auto; padding: 0 15px; }
@media (min-width: 768px) {
.container { width: 750px }
}
 @media (min-width: 992px) {
.container { width: 970px }
}
 @media (min-width: 1200px) {
.container { width: 1170px }
}
/* Util */
.container:after, .clearfix:after, .row:after, .nav:after { content: ''; display: block; clear: both; }
.clear { display: block; clear: both; visibility: hidden; line-height: 0; height: 0; }
.nav > li { float: left }
.col { float: left }
.hide-text { position: absolute; overflow: hidden; width: 0; height: 0; font-size: 0; line-height: 0; text-indent: -9999px; }
.sr-only, .visually-hidden, .skip-navigation a { position: absolute; overflow: hidden; display: block; width: 1px; height: 1px; margin: -1px; clip: rect(0,0,0,0); }
.skip-navigation a:focus, .skip-navigation a:hover, .skip-navigation a:active { position: static; overflow: visible; width: 100%; height: auto; padding: 5px 0; margin: 0; clip: auto; color: #fff; text-align: center; background-color: #3c8200; }
/* Buttons */
.button { box-sizing: border-box; display: inline-block; border: 1px solid #484848; background-color: #fff; color: #484848; line-height: 1; }
/* Grid*/
.grid { font-size: 0 }
.grid > li { box-sizing: border-box; display: inline-block; vertical-align: top; font-size: 12px }
/*------------------------------------*
    Header & Navigation
 *------------------------------------*/
.site-header { position: relative; z-index: 3; height: 52px; background-color: #fff; border-bottom: 2px solid #0aa14d; }
.sticky .site-header { position: fixed; z-index: 96; top: 0; left: 0; width: 100%; }
.site-header .site-logo { position: absolute; top: 50%; left: 50%; display: inline-block; height: 50%; transform: translate(-50%, -50%) }
.site-header .site-logo img { max-height: 100%; width: auto }
/* 검색 */
.site-header .search { position: relative; float: left; margin: 0 20px }
.site-header .search .search-button { font-size: 20px; color: #0aa14d; line-height: 52px; }
.site-header .search-box { position: absolute; left: 0; z-index: 20; float: right; display: none; top: 45px; }
.site-header .search-box:before { background-color: #0aa14d; top: -2px; content: ''; display: block; height: 4px; width: 4px; z-index: 20; left: 15px; -webkit-transform: rotate(45deg); -moz-transform: rotate(45deg); -ms-transform: rotate(45deg); -o-transform: rotate(45deg); transform: rotate(45deg); position: absolute; }
.site-header .search-box form { box-sizing: border-box; position: absolute; left: 0; top: 0; z-index: 20; }
.site-header .search-box input[type="text"] { padding: 6px 14px 5px; width: 200px; height: auto; border: 2px solid #0aa14d; border-radius: 3px; -webkit-border-radius: 3px; -moz-border-radius: 3px; -o-border-radius: 3px; box-shadow: none; -o-box-shadow: none; -moz-box-shadow: none; -webkit-box-shadow: none; outline: none; box-shadow: none; }
/*------------------------------------*
    Content
 *------------------------------------*/
#main { position: relative; z-index: 0; padding-bottom: 60px; }
/* 현재위치 */
.breadcrumb { position: relative; z-index: 2; width: 100%; height: 49px; background: #fafafa; border-bottom: 1px solid #dedede; margin: 0 auto }
.sticky .breadcrumb { position: fixed; z-index: 998; top: 75px; left: 0; width: 100%; }
.breadcrumb .breadcrumb-container { height: 49px; margin: 0; float: left }
.breadcrumb .breadcrumb-container>li { box-sizing: border-box; position: relative; float: left; height: 49px; line-height: 49px; }
.breadcrumb .breadcrumb-container>li:before { content: ""; width: 1px; height: 15px; background: #e1e1e1; position: absolute; top: 17px; left: 0px }
.breadcrumb .breadcrumb-container>li:first-child a { text-align: left; background: none; padding-right: 30px }
.breadcrumb .breadcrumb-container>li:first-child:before { content: ""; display: none }
.breadcrumb .breadcrumb-container>li:first-child img { padding-top: 16px }
.breadcrumb .breadcrumb-container>li > span { display: block; padding: 0 30px }
.breadcrumb .breadcrumb-container>li.dropdown span:after { content: ''; display: inline-block; margin-left: 20px; width: 9px; height: 5px; background: url(../images/common/arrow_down2.png) no-repeat right center; vertical-align: middle }
.breadcrumb .breadcrumb-container>li>a>span { margin-left: 0 }
.breadcrumb ul ul { display: none; z-index: 7; left: -1px; top: 49px; width: 100%; height: auto; overflow: hidden; border: 1px solid #dedede; background: #fff }
.breadcrumb ul li:hover ul { display: block }
.breadcrumb ul ul li { background: none; text-align: left; height: 42px; line-height: 42px; border-top: 1px solid #e1e1e1 }
.breadcrumb ul ul li:first-child { border-top: 0; border-left: 0 }
.breadcrumb ul ul li a { background: #fff; margin: 0; display: block; padding: 0 20px; }
.breadcrumb ul ul li a:hover, .breadcrumb ul ul li a.current { background: #fafafa; color: #0aa14d }
/*상단*/
.page-header, .page-content { margin: 0 auto; }
.page-header { position: relative; padding: 15px 0; border-bottom: 1px solid #dedede; background-color: #f8f8f8 }
.page-header h1 { padding: 0 50px; font-size: 24px; color: #2a2a2a; text-align: center }
.page-header .link { position: absolute; top: 50%; transform: translateY(-50%) }
.page-header .link i { font-size: 38px; color: #adadad; }
.page-header .prev { left: 20px }
.page-header .next { right: 20px }
/*본문*/
.page-content { padding-top: 25px }
/* nav tabs */
.nav-tabs { display: block; width: 100%; text-align: left; font-size: 0; line-height: 0; border: none; }
.nav-tabs li { position: relative; margin: -1px 0 0 -1px; text-align: center; display: inline-block; vertical-align: top; }
.nav-tabs li a { display: block; background: none; font-size: 12px; color: #666; line-height: 34px; background-color: #fff; border: 1px solid #e2e2e2 }
.nav-tabs li:hover a, .nav-tabs li.active a { background-color: #0aa14d; color: #fff }
/* product grid */
.product-grid { font-size: 0; }
.product-grid li { display: inline-block; }
.product-grid li .product-box { margin: 0 8px; text-align: center; }
.product-grid li .product-box a { display:block }
.product-grid li .thumb { overflow:hidden; box-sizing: border-box; position: relative; border: 1px solid #e1e2e2 }
.product-grid li .thumb img { webkit-object-fit: cover; -moz-object-fit: cover; -ms-object-fit: cover; object-fit: cover; -webkit-transition: 0.3s ease all; -moz-transition: 0.3s ease all; -ms-transition: 0.3s ease all; transition: 0.3s ease all; -webkit-backface-visibility: hidden; -moz-backface-visibility: hidden; -ms-backface-visibility: hidden; backface-visibility: hidden; }
.product-grid li:hover .thumb img { transform: scale(1.0); }
.product-grid li .thumb i { position:absolute; bottom:-1px; right:-1px; width:45px; font-size:25px; color:#ddd; line-height:45px; }
.product-grid li .overlay span { position: absolute; top: 50%; display: block; margin-top: -38px; width: 100%; font-size: 13px; color: #fff }
.product-grid li h3 { margin-top: 10px; padding: 0 10px; font-size: 13px; }
/*------------------------------------*
    FOOTER
 *------------------------------------*/
.footer { background-color: #444547; text-align: center; color: #898989 }
.footer .container { position: relative; }
.footer .footer-top { border-bottom: 1px solid #565759; padding: 10px 0 9px; }
.footer .footer-top .footer-links { font-size: 0; }
.footer .footer-top .footer-links li { display: inline-block }
.footer .footer-top .footer-links li:before { content: '|'; margin: 0 8px; font-size: 10px; }
.footer .footer-top .footer-links li:first-child:before { content: ''; margin: 0; vertical-align: middle; }
.footer .footer-top .footer-links li a { font-size: 12px; text-transform: uppercase;/* display: inline-block; */ }
.footer .footer-top .footer-links li a b { color: #cbcbcb }
.footer .footer-bottom { position: relative; padding: 15px 0 18px; border-top: 1px solid #3b3b3c; text-transform: uppercase; }
.footer .footer-bottom .footer-info { }
.footer .footer-bottom .footer-info p.copyright { margin-top: 8px; }
.footer .footer-bottom .footer-info p span { margin: 0 5px }
.footer .contact { margin-bottom: 15px }
.footer .contact p { overflow: hidden; color: #d6d5d5 }
.footer .contact p strong { font-size: 15px; font-weight: 400; color: #d8d8d8; }
.scroll-to-top { display: none; position: fixed; bottom: 18px; right: 15px; -webkit-transition: all 0.3s ease-in-out 0s; -moz-transition: all 0.3s ease-in-out 0s; -ms-transition: all 0.3s ease-in-out 0s; transition: all 0.3s ease-in-out 0s; }
.scroll-to-top i { display: block; width: 36px; height: 36px; line-height: 36px; color: #fff; border-radius: 2px; -webkit-border-radius: 2px; -moz-border-radius: 2px; -o-border-radius: 2px; text-align: center; background-color: #0aa14d; }
.scroll-to-top:hover { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=50)"; filter: alpha(opacity=50); -moz-opacity: 0.5; -khtml-opacity: 0.5; opacity: 0.5; }
/*------------------------------------*
    Slidebar
 *------------------------------------*/
body.sidebar-open { overflow: hidden }
/* toggle-button */
.toggle-button { position: fixed; z-index: 99; top: 6px; right: 8px; height: 40px; width: 40px; border-radius: 50%; background-color: rgba(256, 256, 256, 0.8); cursor: pointer; -webkit-transition: background 0.2s; -moz-transition: background 0.2s; transition: background 0.2s; }
.toggle-button .icon, .toggle-button .icon::before, .toggle-button .icon::after { /* menu icon created in CSS */ position: absolute; background-color: #057a39; border-radius: 2px; /* Force Hardware Acceleration in WebKit */ -webkit-transform: translateZ(0); -moz-transform: translateZ(0); -ms-transform: translateZ(0); -o-transform: translateZ(0); transform: translateZ(0); -webkit-backface-visibility: hidden; backface-visibility: hidden; }
.no-touch .toggle-button:hover { background-color: black; }
.toggle-button .icon { /* middle line of the menu icon */ display: inline-block; width: 18px; height: 2px; left: 50%; top: 50%; bottom: auto; right: auto; -webkit-transform: translateX(-50%) translateY(-50%); -moz-transform: translateX(-50%) translateY(-50%); -ms-transform: translateX(-50%) translateY(-50%); -o-transform: translateX(-50%) translateY(-50%); transform: translateX(-50%) translateY(-50%); -webkit-transition: -webkit-transform 0.3s, background-color 0.3s; -moz-transition: -moz-transform 0.3s, background-color 0.3s; transition: transform 0.3s, background-color 0.3s; }
.toggle-button .icon::before, .toggle-button .icon::after { /* upper and lower lines of the menu icon */ content: ''; top: 0; right: 0; width: 100%; height: 100%; -webkit-transition: -webkit-transform 0.3s; -moz-transition: -moz-transform 0.3s; transition: transform 0.3s; }
.toggle-button .icon::before { -webkit-transform: translateY(-6px); -moz-transform: translateY(-6px); -ms-transform: translateY(-6px); -o-transform: translateY(-6px); transform: translateY(-6px); }
.toggle-button .icon::after { -webkit-transform: translateY(6px); -moz-transform: translateY(6px); -ms-transform: translateY(6px); -o-transform: translateY(6px); transform: translateY(6px); }
.sidebar-open .toggle-button { background-color: rgba(5,122,57,0.8) }
.sidebar-open .toggle-button .icon { /* user selects a projects - transform the icon into a 'X' */ background-color: rgba(256, 256, 256, 0); }
.sidebar-open .toggle-button .icon::before, .sidebar-open .toggle-button .icon::after { background-color: #fff; }
.sidebar-open .toggle-button .icon::before { -webkit-transform: translateY(0) rotate(45deg); -moz-transform: translateY(0) rotate(45deg); -ms-transform: translateY(0) rotate(45deg); -o-transform: translateY(0) rotate(45deg); transform: translateY(0) rotate(45deg); }
.sidebar-open .toggle-button .icon::after { -webkit-transform: translateY(0) rotate(-45deg); -moz-transform: translateY(0) rotate(-45deg); -ms-transform: translateY(0) rotate(-45deg); -o-transform: translateY(0) rotate(-45deg); transform: translateY(0) rotate(-45deg); }
/* sidebar */
.site-sidebar { overflow-y: auto; position: fixed; top: 0; right: 0; z-index: 98; height: 100%; height: calc(100% + 60px); height: -moz-calc(100%); padding-bottom: 60px; width: 30%; background-color: #fff; -webkit-transform: translateX(100%); -ms-transform: translateX(100%); transform: translateX(100%); -webkit-transition: all 0.3s ease; -moz-transition: all 0.3s ease; -o-transition: all 0.3s ease; transition: all 0.3s ease; }
.sidebar-open .site-sidebar { -webkit-transform: translateX(0); -ms-transform: translateX(0); transform: translateX(0); }
 @media(max-width: 480px) {
.site-sidebar { width: 70% }
}
 @media(min-width: 481px) {
.site-sidebar { width: 55% }
}
 @media(min-width: 768px) {
.site-sidebar { width: 40% }
}
 @media(min-width: 992px) {
.site-sidebar { width: 30% }
}
 @media(min-width: 1200px) {
.site-sidebar { width: 20% }
}
/* sidebar overlay */
.sidebar-overlay { overflow: hidden; position: fixed; top: 0; bottom: 0; right: 0; width: 100%; height: 100%; -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=40)"; -moz-opacity: 0.4; -khtml-opacity: 0.4; opacity: 0.4; background-color: #000; z-index: 97; }
/*.sidebar-open .sidebar-overlay { width: 100%; height: 100%; opacity: 1;  }*/
/* Main Menu */
.site-sidebar nav { position: relative; min-height:100%; }
.site-sidebar nav:before { content: ''; position: absolute; top: 0; left: 0; display: block; width: 25%; min-height: 100%; background-color: #0aa14d; }
.site-sidebar .menu {padding-bottom:60px;}
.site-sidebar .menu > li { position: relative; padding-left: 25%; border-bottom: 1px solid #069143; line-height: 52px; min-height: 52px; font-size: 15px; color: #262626; }
.site-sidebar .menu li .fa { position: absolute; top: 0; left: 0; width: 25%; border-bottom: 1px solid #069143; font-size: 18px; color: #fff; line-height: 52px; text-align: center; }
.site-sidebar .menu li .total { border: 1px solid #fff; background-color:#0aa14d; color: #fff; width: 15px; height: 15px; line-height: 16px; position: absolute; top: 23px; left: 14%; display: block; text-align: center; -webkit-border-radius: 100%; border-radius: 100%; font-size: 10px; letter-spacing: -.08em; }
.site-sidebar .menu li a { display: block; padding-left: 25px; }
.site-sidebar .menu li .caret { position: absolute; top: 0; right: 0; display: inline-block; width: 52px; text-align: center; cursor: pointer; -webkit-transition: all 150ms ease-in 0s; -moz-transition: all 150ms ease-in 0s; -o-transition: all 150ms ease-in 0s; transition: all 150ms ease-in 0s; }
.site-sidebar .menu li .caret:before { content: '\f107'; font-family: FontAwesome; font-size: 18px; color: #0aa14d; }
.site-sidebar .menu li.active .caret { -webkit-transform: rotate(180deg); -moz-transform: rotate(180deg); -ms-transform: rotate(180deg); -o-transform: rotate(180deg); transform: rotate(180deg); }
/* Submenus */
.site-sidebar .submenu { display: none; padding: 0; margin: 0; border-top: 1px solid #dadada; background-color: rgba(255, 255, 255, 0.05); }
.site-sidebar .submenu li { position: relative; }
.site-sidebar .submenu li a { font-size: 13px; color: #737373; line-height: 38px; }
.site-sidebar .submenu li.active a { color: #0aa14d }
.site-sidebar .submenu li a:after { position: absolute; top: 0; right: 0; display: inline-block; width: 52px; font-family: FontAwesome; text-align: center; }
.site-sidebar .submenu li a:after { content: '\f105'; }
/*------------------------------------*
    Plugins
 *------------------------------------*/
/* Slick Slider */
.slick-slider { position: relative; display: block; -moz-box-sizing: border-box; box-sizing: border-box; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; -webkit-touch-callout: none; -khtml-user-select: none; -ms-touch-action: pan-y; touch-action: pan-y; -webkit-tap-highlight-color: transparent; }
.slick-list { position: relative; display: block; overflow: hidden; margin: 0; padding: 0; }
.slick-list:focus { outline: none; }
.slick-list.dragging { cursor: pointer; cursor: hand; }
.slick-slider .slick-track, .slick-slider .slick-list { -webkit-transform: translate3d(0, 0, 0); -moz-transform: translate3d(0, 0, 0); -ms-transform: translate3d(0, 0, 0); -o-transform: translate3d(0, 0, 0); transform: translate3d(0, 0, 0); }
.slick-track { position: relative; top: 0; left: 0; display: block; margin: 0 auto; }
.slick-track:before, .slick-track:after { display: table; content: ''; }
.slick-track:after { clear: both; }
.slick-loading .slick-track { visibility: hidden; }
.slick-slide { display: none; float: left; height: 100%; min-height: 1px; }
.slick-slide img { display: block; margin: 0 auto; }
.slick-slide.slick-loading img { display: none; }
.slick-slide.dragging img { pointer-events: none; }
.slick-initialized .slick-slide { display: block; }
.slick-loading .slick-slide { visibility: hidden; }
.slick-vertical .slick-slide { display: block; height: auto; border: 1px solid transparent; }
.slick-arrow.slick-hidden { display: none; }
.slick-prev, .slick-next { position: absolute; z-index: 99; display: block; background: none; cursor: pointer; transition: opacity .5s ease-in-out; -moz-transition: opacity .5s ease-in-out; -webkit-transition: opacity .5s ease-in-out; font-size: 0 }
.slick-prev:hover, .slick-next:hover { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; }
.slick-arrow.slick-disabled { display: none !important }
.slider.single-item .slide { display: none; }
.slider.single-item .slide:first-child { display: block; }
.slider.single-item.slick-initialized .slide { display: block; }
/* Animate.css */
@-webkit-keyframes fadeInUp-animated { 0% {
 opacity:0;
 -webkit-transform:translate3d(0, 100%, 0);
 -ms-transform:translate3d(0, 100%, 0);
 transform:translate3d(0, 100%, 0)
}
 100% {
 opacity:1;
 -webkit-transform:none;
 -ms-transform:none;
 transform:none
}
}

/* Animate.css */
@keyframes fadeInUp-animated { 0% {
 opacity:0;
 -webkit-transform:translate3d(0, 100%, 0);
 -ms-transform:translate3d(0, 100%, 0);
 transform:translate3d(0, 100%, 0)
}
 100% {
 opacity:1;
 -webkit-transform:none;
 -ms-transform:none;
 transform:none
}
}

/* Animate.css */
@-webkit-keyframes fadeOutRight-animated { 0% {
 opacity:1
}
 100% {
 opacity:0;
 -webkit-transform:translate3d(80%, 0, 0);
 -ms-transform:translate3d(80%, 0, 0);
 transform:translate3d(80%, 0, 0)
}
}

/* Animate.css */
@keyframes fadeOutRight-animated { 0% {
 opacity:1
}
 100% {
 opacity:0;
 -webkit-transform:translate3d(80%, 0, 0);
 -ms-transform:translate3d(80%, 0, 0);
 transform:translate3d(80%, 0, 0)
}
}
/*------------------------------------*
    Homepage 
 *------------------------------------*/
.home #main { padding: 0 }
.home section { margin-bottom: 55px }
.home section h2 { margin-bottom: 15px; font-size: 20px; color: #2a2a2a; text-align: center }
/* 상단 슬라이더 */
.home .hero { overflow: hidden; z-index: 1; width: 100%;  }
.home .hero .slide { width: 100%; text-align: center; line-height: 1.65 }
.home .hero .slide h2 { padding-top: 160px; margin-bottom: 55px; font-size: 56px; font-weight: 400; color: #fff; opacity: 0; opacity: 1\9 }
.home .hero .slide p { font-size: 13px; color: #f2f2f2; text-transform: uppercase; opacity: 0; opacity: 1\9 }
.home .hero .slick-slide h2 { -webkit-animation: fadeOutRight-animated 5s both; animation: fadeOutRight-animated 5s both }
.home .hero .slick-slide p { -webkit-animation: fadeOutRight-animated 8s both; animation: fadeOutRight-animated 8s both }
.home .hero .slick-slide img {width:100%; max-width:none}
.home .hero .slick-slide.slick-active h2 { -webkit-animation: fadeInUp-animated 1s both .5s; animation: fadeInUp-animated 1s both .5s }
.home .hero .slick-slide.slick-active p { -webkit-animation: fadeInUp-animated 1s both .8s; animation: fadeInUp-animated 1s both .8s }
.home .hero .slick-dots { position: absolute; z-index: 9999; bottom: 30px; display: block; width: 100%; text-align: center; }
.home .hero .slick-dots li { position: relative; display: inline-block; margin: 0 5px; padding: 0; cursor: pointer; }
.home .hero .slick-dots li button { font-size: 0; line-height: 0; display: block; width: 13px; height: 13px; cursor: pointer; color: transparent; border: 0; outline: none; background: url(../images/home/slider_controls.png) -20px 0 transparent no-repeat; }
.home .hero .slick-dots li button:hover, .home .hero .slick-dots li button:focus, .home .hero .slick-dots li.slick-active button { background-position: -20px -20px; outline: none; }
/* 제품목록 */
.home .product { text-align: center; }
.home .product .nav-tabs { margin-bottom: 35px; text-align: left; }
.home .product .nav-tabs li { width: 33.33333%; }
@media (min-width: 768px) {
.home .product .nav-tabs li { width: 20%; }
}
.home .product .nav-tabs li a { display: block; background: none; font-size: 12px; color: #666; line-height: 34px; background-color: #fff; border: 1px solid #e2e2e2 }
.home .product .nav-tabs li:hover a, .home .product .nav-tabs li.active a { background-color: #0aa14d; color: #fff }
.home .product .product-grid {margin:0 -12px}
.home .product .product-grid li { margin-bottom:35px; width: 50%; } 
.home .product .product-grid li .product-box { margin: 0 12px; text-align: center; }
.home .product .product-grid li img {display:block; margin:0 auto;}
.home .product .button { padding: 12px 50px 10px; font-size: 13px; }
/* Best Product */
.home .bestseller .bestseller-inner { position: relative; margin:0 auto; max-width:780px}
.home .bestseller .caption { float: left; width: 45% }
.home .bestseller h3 {margin-top: 20px;padding: 8% 0 18%;font-size: 13px;color: #000;line-height: 1.25;}
.home .bestseller h3 small {display: block;margin-bottom: 5px;font-size: 10px;font-weight: 400;}
.home .bestseller p {margin-bottom: 10%;font-size: 10px;font-weight: 300;}
.home .bestseller p:before {content:''; display:block; margin-bottom:8px; width:10%; max-width:45px; border-top:1px solid #000}
.home .bestseller a.button { padding: 7px 10px 5px; font-size: 10px; color: #535353; border: 1px solid #aaa; background-color: transparent }
.home .bestseller a.button:hover { background-color: #656768; border-color::#656768;color: #fff }
@media only screen and (min-width: 480px) {
.home .bestseller h3 {font-size: 21px;}
.home .bestseller h3 small {font-size: 16px;}
.home .bestseller p {font-size: 13px;line-height: 1.65;}
.home .bestseller p:before {width:35px; }
.home .bestseller a.button { padding: 7px 10px 5px; font-size: 12px;  }
 }
.home .bestseller .image { float: right; width: 50%; text-align: center }
.home .bestseller .slider-control { float: right }
.home .bestseller .slider-control span { position: relative; float: left; margin: 0 2px; width: 30px; height: 30px; background-position: 50% 50%; background-repeat: no-repeat; background-color: #c8c8c8; cursor: pointer; -webkit-transition: all ease-in-out .2s; -moz-transition: all ease-in-out .2s; -o-transition: all ease-in-out .2s; transition: all ease-in-out .2s; }
.home .bestseller .slider-control span:hover { background-color: #0aa14d }
.home .bestseller .slider { clear: both }
.home .bestseller .slick-prev { background-image: url(../images/home/slider_prev.png); }
.home .bestseller .slick-next { background-image: url(../images/home/slider_next.png); }
.home .bestseller .slick-play-pause { background-image: url(../images/home/slider_pause.png); }
.home .bestseller .slick-play-pause.paused { background-image: url(../images/home/slider_play.png); }
.home .bestseller .slick-dots { position: absolute; top: 0; left: 0; }
.home .bestseller .slick-dots li { position: relative; display: inline-block; margin: 0 5px; padding: 0; cursor: pointer; }
.home .bestseller .slick-dots li button { font-size: 0; line-height: 0; display: block; width: 10px; height: 10px; cursor: pointer; color: transparent; border: 0; outline: none; background: url(../images/home/slider_controls.png) 0px 0 transparent no-repeat; }
.home .bestseller .slick-dots li button:hover, .home .bestseller .slick-dots li button:focus, .home .bestseller .slick-dots li.slick-active button { background-position: 0 -20px; outline: none; }
/* 인증현황 */
.home .certificates { }
.home .certificates .slider { margin: 0 50px; }
.home .certificates .slide { float: left; padding: 0 5px; text-align: center }
.home .certificates .slide img { margin-bottom: 8px }
.home .certificates .slick-prev, .home .certificates .slick-next { top: 50%; margin-top: -20px; }
.home .certificates .slick-prev { left: -40px; }
.home .certificates .slick-next { right: -40px; }
.home .certificates .slick-prev:before, .home .certificates .slick-next:before { content: ''; display: block; width: 29px; height: 40px; background-image: url(../images/home/slider_controls.png); background-repeat: no-repeat; }
.home .certificates .slick-prev:before { background-position: -40px 0 }
.home .certificates .slick-next:before { background-position: 100% 0 }
.home .certificates .slick-arrow { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)"; filter: alpha(opacity=100); -moz-opacity: 1; -khtml-opacity: 1; opacity: 1; -webkit-transition: all ease-in-out .2s; -moz-transition: all ease-in-out .2s; -o-transition: all ease-in-out .2s; transition: all ease-in-out .2s; }
.home .certificates .slick-prev:hover, .home .certificates .slick-next:hover { -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=45)"; filter: alpha(opacity=45); -moz-opacity: 0.45; -khtml-opacity: 0.45; opacity: 0.45; }
/* 다운로드 자료실*/
.home .resource { }
.home .resource ul { margin: 0 -3px; }
.home .resource ul li { float: left; margin-bottom: 6px; width: 33.33333%; text-align: center }
.home .resource ul li .box { position: relative; margin: 0 3px; height: 95px; border: 1px solid #ddd }
.home .resource ul li:hover .box { border-color: #0aa14d }
.home .resource ul li a { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; }
.home .resource ul li a img { margin-bottom: 8px; }
.home .resource ul li a span { display: block; color: #2a2a2a; line-height: 1.2 }
.home .resource ul li:hover a span { color: #0aa14d }


/* 다운로드 자료실*/
/*.slide .resource_new { }
.slide .resource_new ul { }
.slide .resource_new ul li { float: left; margin-bottom: 6px; width: 25%; text-align: center }
.slide .resource_new ul li .box { position: relative; margin: 0 3px; height: 95px; border: 1px solid #ddd }
.slide .resource_new ul li:hover .box { border-color: #0aa14d }
.slide .resource_new ul li a { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); display: block; }
.slide .resource_new ul li a img { margin-bottom: 8px; }
.slide .resource_new ul li a span { display: block; color: #2a2a2a; line-height: 1.2 }
.slide .resource_new ul li:hover a span { color: #0aa14d }*/

.slide{ position:relative;}
.slide .resource_new { position:absolute; bottom:-45px; width:100%;} 
.slide .resource_new ul { width:100%; margin:0 auto; text-align:center;  }
.slide .resource_new ul li { float: left; margin-bottom: 6px; width: 25%; text-align: center }
.slide .resource_new ul li a { margin: 0 2px; display: block; height:55px; border: 1px solid #ddd; background:rgba(0,0,0,0.70); }
.slide .resource_new ul li:hover a { border-color: #0aa14d }
.slide .resource_new ul li a img { margin-top:5px; width:inherit !important;}
/*.slide .resource_new ul li a span.one_line { margin-top:32px;}*/
.slide .resource_new ul li a span { display: block; font-size: 9px; color: #fff; line-height: 1.2; margin-top:5px; }
.slide .resource_new ul li:hover a span { color: #0aa14d }
.slide .resource_new ul li:hover a{ background:rgba(0,0,0,0.7);}


/*------------------------------------*
    제품목록
 *------------------------------------*/
.shop .page-content { padding-top: 0 }
.shop .product-nav li { width: 33.33333% }
 @media (min-width: 768px) {
.shop .product-nav li { width: 25%; }
}
.shop .product-nav li a { font-size: 13px; line-height: 45px }
.shop .product-grid { margin: 0 -8px; }
.shop .product-grid li { margin: 35px 0; width: 50%; }
 @media (min-width: 768px) {
.shop .product-grid li { width: 25%; }
}
/* load more */
.shop .load-more { margin-top: 25px; text-align: center }
.shop .load-more .button { width: 70%; padding: 13px 0 12px; font-size: 15px; }
 @media (min-width: 768px) {
.shop .load-more .button { width: 50%; }
}
/*------------------------------------*
    제품상세
 *------------------------------------*/
.product-detail h3 { margin-bottom: 12px; font-size: 20px; text-transform: uppercase }
.product-detail h3:before { content: ''; display: block; margin-bottom: 5px; width: 20px; height: 2px; background-color: #0ea14c }
.product-detail .product-image { margin-bottom: 25px; text-align: center }
.product-detail .product-links { margin-bottom: 55px; text-align: center; }
.product-detail .product-links a { margin: 0 5px 5px; padding: 12px 15px 11px; width: 160px; font-size: 14px; border: none; color: #fff; background-color: #0ea14c; }
.product-detail .product-links a:after { content: "\f105"; display: inline-block; margin-left: 7px; l normal normal 14px/1 FontAwesome;
font: normal normal normal 14px/1 FontAwesome; }
.product-detail .product-links .download { background-color: #3f3f3f }
.product-detail .product-info .info-box { margin-bottom: 55px; }
.product-detail .product-info h2 { margin-bottom: 25px; font-size: 24px; }
.product-detail .product-info ul.list li { margin-bottom: 7px; color: #696868; text-indent: -12px; padding-left: 12px; }
.product-detail .product-info ul.list li:before { content: '•'; margin: 0 3px 0 -3px; }
.product-detail .product-spec { }
.product-detail .product-spec .nav-tabs { border-bottom: 2px solid #7e7e7e; }
.product-detail .product-spec .nav-tabs li { width: 25%; min-width: 90px; max-width: 150px }
.product-detail .product-spec .nav-tabs li a { font-size: 13px; line-height: 36px; border-bottom: none }
.product-detail .product-spec .nav-tabs li.active a, .product-detail .product-spec .nav-tabs li:hover a { background-color: #444 }
.product-detail .product-spec th, .product-detail .product-spec td { padding: 10px; text-align: left; vertical-align: middle; border-bottom: 1px solid #dbdbdb; border-left: 1px solid #dbdbdb; }
.product-detail .product-spec th { background-color: #f9f9f9; font-size: 13px; }
.product-detail .product-spec tr th:first-child, .product-detail .product-spec tr td { padding-left: 15px }
.product-detail .product-spec tr th[colspan], .product-detail .product-spec tr th[rowspan] { border-left: none }
/*------------------------------------*
    회장 인사말
 *------------------------------------*/
.ceo-message .ceo-image { margin-bottom: 35px; text-align: center; }
.ceo-message h2 { margin: 0 auto 50px; width: 70%; font-size: 18px; color: #3a3a3a; text-align: center; }
.ceo-message .message { margin-bottom: 35px; }
.ceo-message .message p { margin-bottom: 15px; font-size: 14px; line-height: 1.65 }
.ceo-message .sign { font-size: 13px; text-align: right; }
.ceo-message .sign img { vertical-align: middle }
/*------------------------------------*
    CEO 인사말
 *------------------------------------*/
.ceo_txt{font-family:'나눔바른고딕'; font-size:24px; color:#357530; font-weight:normal;text-align:center;}
.ceo_txt1{font-family:'나눔바른고딕'; font-size:24px; color:#c81818; font-weight:bold;}
.ceo_txt2{line-height:80px;text-align:center;font-family:"나눔바른고딕"; font-size:24px; color:#357530; font-weight:bold;}
.ceo_txt3{font-family:'나눔바른고딕'; font-size:18px; color:#3a3a3a;text-align:center;}

/*------------------------------------*
    기업이념
 *------------------------------------*/
.about-idea .idea-image { margin-bottom: 35px; text-align: center; }
.about-idea h2 { margin: 0 auto 50px; width: 70%; font-size: 20px; color: #252525; text-align: center;}
.about-idea .message { margin-bottom: 35px; text-align:left}
.about-idea .message p { margin-bottom: 15px; font-size:14px; line-height: 1.65;}
.about-idea .title {margint-bottom:35px;font-family:"나눔바른고딕"; font-size:20px; color:#252525;font-weight:bold;text-align:left}
.about-idea .sign { font-size: 13px; text-align: right; }
.about-idea .sign img { vertical-align: middle }
.icon1{width:40px; height:30px;}


.wrap_map .tit{font-size:15px;padding:0 0 10px;}
.wrap_map .map_t{padding:5px;background:#f3f3f3;}
.wrap_map .txt_addres{padding:20px 35px 45px;overflow:hidden;}
.wrap_map .txt_addres.txt_addres_b{padding:20px 0px 0px;}
.wrap_map .txt_addres li{box-sizing:border-box;position:relative;padding:0 0 17px 35px;width:50%;float:left;}
.wrap_map .txt_addres li a{color:#000;}
.wrap_map .txt_addres li:first-child{width:100%;}
.wrap_map .txt_addres li .icon{width:28px;position:absolute;left:0;top:0;}
.wrap_map .txt_addres li strong{display:block;padding:0;color:#2a2a2a;font-size:12px;}
.wrap_map .txt_addres li{font-size:12px;}
.wrap_map .tabcontent {
    position: absolute;
    top: -10000px;
    left: -10000px;
    background: none !important;
    padding: 17px 0;
    color: #000;
}
.wrap_map .tab li{width:25%;box-sizing:border-box;background:#fff;border:1px solid #bfbfbf;color:#000;font-size:11px;border-left:0;line-height: 26px;height:26px;letter-spacing: -1px;}
.wrap_map .tab li:first-child{border-left:1px solid #bfbfbf;}
.wrap_map ul.tab li.current {
    background-color: #037435;
    border: 1px solid #CCC;
        border-left-width: 0px;
        border-left-style: solid;
        border-left-color: rgb(204, 204, 204);
    color: #fff;
    font-size: 11px;
    font-weight: 600;
}

.c-timeline { position: relative; margin-left:5px;margin-right:5px;}
.c-timeline:nth-child(2) {margin-bottom:80px;}
.c-timeline-tt {font-size:34px;padding-left:32px;margin-bottom:20px;}
.c-timeline:before { content: ''; position: absolute; top: 0; left: 3px; height: 100%; width: 4px; background: #d7e4ed; }
.c-timeline li { position: relative; margin: 2em 0;padding-top:30px;}
.c-timeline li:after { content: ""; display: table; clear: both; }
.c-timeline li:first-child { margin-top: 0; }
.c-timeline li:last-child { margin-bottom: 0; }
.c-timeline li span {position: absolute; top: -4px; left: -6px; font-size: 18px; color: #0ea24c;font-weight:bold;}
.c-timeline li span:before { content: ''; display: inline-block; margin-right: 12px; width: 12px; height: 12px; border-radius: 50%; background: #ffffff;border: 4px solid #0ea24c; vertical-align: middle }
.c-timeline li dl {margin-left: 26px; font-size: 15px; position:relative;font-weight:bold;color: #777777;}
.c-timeline li dl > dt {position:absolute;left:0;}
.c-timeline li dl > dd {padding-left:40px;margin-bottom:5px;}