@charset "utf-8";
@import url('font.css');

/* HTML Reset --------------------------------------------------------------------------------------- */
* {box-sizing:border-box; -webkit-box-sizing:border-box; -moz-box-sizing:border-box}
html, body, div, ul, ol, li, dl, dt, dd, h1, h2, h3, h4, h5, h6, pre, form, p, blockquote, fieldset, input, 
abbr, article, aside, command, details, figcaption, figure, footer, header, hgroup, mark, meter, nav, 
output, progress, section, summary, time, table, th, td {margin: 0;padding: 0;font-size: 14px;font-family: 'Nanum Gothic', sans-serif;line-height:1.5em;color:#333;-webkit-text-size-adjust:none;}
body {background:#fff;}
table {border-collapse: collapse;border-spacing: 0;}
img {border:0;vertical-align:middle;}
a {color: #333;text-decoration: none;}
a:link, a:visited, a:active {text-decoration: none;}
a:hover {text-decoration: none;}
nav, ul {list-style: none outside none;}
hr{display:none}
form {margin:0;padding:0;border:none;}
fieldset {margin:0;padding:0;border:none;}
caption {position:absolute;top:0;left:-1000em;width:0;height:0;line-height:0; display:none;}
legend {position:absolute;top:0;left:-1000em;width:0;height:0;line-height:0; display:none;}

input {vertical-align:middle; border:none; font-size:12px;}
input.radio { width:13px; height:13px; vertical-align:middle}
select { vertical-align:middle; font-size:12px;}
textarea {border-color: #b6b6b6 #ddd #ddd #b6b6b6; border-style: solid; border-width: 1px; background-color:#fff; font-size:12px;}
input[type=text], input[type=password] {border:1px solid #b6b6b6; background-color:#fff; padding:2px; height:20px;}
input.none {border:none !important; border-color:#fff; padding:2px;}
input.bg {background:#f2f8ff;}

.hidden {display:none;}
.commingsoon {text-align:center; width:100%; height:100%; padding-top:300px;}
audio, canvas, video {display: inline-block; *display: inline; *zoom: 1}
audio:not([controls]) {display: none }

/* Layout --------------------------------------------------------------------------------------- */
.wrap {background:#f2f2f2;}
header {position:relative; margin:0 auto; z-index:10; background:#496b13; border-top:35px solid #f2f2f2;}
header .headArea {width:100%; max-width:1200px; margin:0 auto; height:70px; }

header h1 {position:absolute; left:50%;width:220px; margin-left:-600px; line-height:70px;}
header .menuBtn {position:absolute; top:15px; left:15px; background:url('../img/bullet.png') no-repeat -44px 8px; width:0px; height:0px; padding:40px 40px 0 0; text-align:center; overflow:hidden; cursor:pointer; display:none; z-index:10;}
header .menuBtn.menuClose {background-position:-94px 8px}
header .gnb {position:absolute; top:-25px; width:100%; max-width:1200px; margin:0 auto; text-align:right;}
header .gnb a {display:inline-block; padding-left:10px; margin-left:10px; border-left:1px solid #999; line-height:1;}
header .gnb a:first-child {border-left:0;}

header .snb_bg {display:none; position:absolute; width:100%; height:62px; background:#fff; border-bottom:1px solid #ddd; z-index:10; left:0; top:70px;}
header .tnb {margin-left:500px; overflow:hidden; }
header .tnb li {float:left; width:25%}
header .tnb li a {display:block; height:70px; padding:26px 0;}
header .tnb li a span {display:block; color:#fff; text-align:center; font-size:18px; font-weight:600; line-height:20px; border-left:1px solid #9eaf83;}
header .tnb li:first-child a span {border-left:0;}
header .tnb li a:hover,
header .tnb li.on a {background:url('../img/tnb_arrow.png') no-repeat center bottom;}
header .tnb .snb { position:absolute; display:none; top:70px; text-align:center; padding:20px 0; z-index:11;}
header .tnb li:nth-child(1) .snb {min-width:470px; margin-left:-140px;}
header .tnb li:nth-child(2) .snb {min-width:642px; margin-left:-226px;}
header .tnb li:nth-child(3) .snb {min-width:90px; margin-left:42px;}
header .tnb li:nth-child(4) .snb {min-width:180px; margin-left:-3px;}
header .tnb .snb a {display:inline-block; text-align:center; height:auto; padding:0 20px; font-size:16px; line-height:1; font-weight:600; border-left:1px solid #ddd;}
header .tnb .snb a:first-child {border-left:none;}
header .tnb .snb a span {display:block; font-size:16px; font-weight:600; color:#333; border:0;}
header .tnb .snb a .ico {display:none; padding:64px 64px 0 0; background:#da9b35 url('../img/snb_ico.png') no-repeat 15px 13px; border-radius:3px; margin-bottom:5px;}
header .tnb .snb a .ico_0101 {background-position:15px 13px;}
header .tnb .snb a .ico_0102 {background-position:-85px 13px;}
header .tnb .snb a .ico_0103 {background-position:-185px 13px;}
header .tnb .snb a .ico_0104 {background-position:-285px 13px;}
header .tnb .snb a .ico_0105 {background-position:-385px 13px;}
header .tnb .snb a .ico_0201 {background-position:15px -87px;}
header .tnb .snb a .ico_0202 {background-position:-85px -87px;}
header .tnb .snb a .ico_0203 {background-position:-185px -87px;}
header .tnb .snb a .ico_0204 {background-position:-285px -87px;}
header .tnb .snb a .ico_0205 {background-position:-385px -87px;}
header .tnb .snb a .ico_0206 {background-position:-485px -87px;}
header .tnb .snb a .ico_0207 {background-position:-585px -87px;}
header .tnb .snb a .ico_0301 {background-position:15px -187px;}
header .tnb .snb a .ico_0401 {background-position:-85px -187px;}
header .tnb .snb a .ico_0402 {background-position:-185px -187px;}
header .tnb .snb a:hover .ico,
header .tnb .snb a.on .ico {background-color:#9d9a52;}
header .tnb .snb a:hover span,
header .tnb .snb a.on span { color:#4f770f}
header .tnb li.on .snb a {background:none;}
header .tnb li.on .snb {display:block;}


.container {width:100%;padding-bottom:50px; background:#fff;}
.container .navigation {max-width:1000px; margin:0 auto; text-align:center; padding-top:20px;}
.container .navigation a.home {background:url('../img/bullet.png') no-repeat 20px 9px; padding:33px 33px 0 0; min-width:0; width:0; height:0; overflow:hidden;}
.container .navigation a,
.container .navigation span {display:inline-block; line-height:33px; vertical-align:middle; padding:0 3px; font-size:15px; color:#999;}
.container .contentsArea {min-height:300px;}

.btn_top {position:absolute;text-align:center; opacity:0; display:none; width:0; height:0; padding:50px 50px 0 0; overflow:hidden; top:-70px; left:50%; margin-left:600px; background:#999 url('../img/btn_top.png') no-repeat center center;}
.btn_top.fixed {position:fixed; top:auto; bottom:20px;}

footer {background:#525252; position:relative;}
footer .fnb {background:#434343; padding:15px 0;}
footer .fnb ul {max-width:1200px; margin:0 auto; overflow:hidden;}
footer .fnb ul li {float:left;}
footer .fnb ul li a {display:inline-block; line-height:1; border-left:1px solid #fff; color:#fff; font-weight:600; padding:0 20px;}
footer .fnb ul li:first-child a {border-left:none; padding-left:0;}
footer .footArea {position:relative; max-width:1200px; margin:0 auto; padding:30px 0;}
footer .footArea h1 {position:absolute; right:0; top:30px;}
footer .footArea .footTxt {padding:0 80px 0 0;}
footer .footArea .footTxt p { color:#d5d5d5;}
footer .footArea .footTxt p span {display:inline-block; line-height:1; padding-right:10px; margin-right:7px; border-right:1px solid #adadad; margin-bottom:5px; font-size:12px; color:#d5d5d5;}
footer .footArea .footTxt p span:last-child {border-right:0;}

.bgBlack {background:#000; opacity:0; position:fixed; width:100%; height:100%; z-index:5; top:0; display:none; }

/* ���� ------------------------------------------------------------------------------------- */ 
.main_container {width:100%; margin:20px auto; max-width:1200px; overflow:hidden;}
.main_container .visual {position:absolute; width:480px; height:690px; overflow:hidden;}
.main_container .products {margin-left:480px; height:690px; overflow:hidden;}
.main_container .main_bottom {clear:both; overflow:hidden;}

.main_container .products section {position:relative; float:left; border-right:1px solid #ddd; border-bottom:1px solid #ddd;background:#fff; width:33.3333%; height:230px; cursor:pointer;}
.main_container .products .products1, 
.main_container .products .products7 {width:66.6666%}
.main_container .products .products1, 
.main_container .products .products2 {border-top:1px solid #ddd;}

.main_container .products .products1 {background-image:url('../img/product1.png'); background-repeat:no-repeat; background-position:right bottom;}
.main_container .products .products2 {background-image:url('../img/product2.png'); background-repeat:no-repeat; background-position:right bottom;}
.main_container .products .products3 {background-image:url('../img/product3.png'); background-repeat:no-repeat; background-position:right bottom;}
.main_container .products .products4 {background-image:url('../img/product4.png'); background-repeat:no-repeat; background-position:right bottom;}
.main_container .products .products5 {background-image:url('../img/product5.png'); background-repeat:no-repeat; background-position:right bottom;}
.main_container .products .products6 {background-image:url('../img/product6.png'); background-repeat:no-repeat; background-position:right bottom;}
.main_container .products .products7 {background-image:url('../img/product7.png'); background-repeat:no-repeat; background-position:right bottom;}

.main_container .products section a {display:block; position:relative; padding:20px; height:100%; transition:background .5s; -webkit-transition:background .5s; -moz-transition:background .5s; -o-transition:background .5s;}
.main_container .products section a h2 {font-size:17px; margin-bottom:5px;}
.main_container .products section a .ico_plus {display:none; padding:40px 40px 0 0; background:url('../img/ico_plus.png') no-repeat center center; width:0; height:0; overflow:hidden;}
.main_container .products section a:hover {background:url('../img/product1_over.png') no-repeat; text-align:center; background-size:100% 100%; transition:background .5s; -webkit-transition:background .1s; -moz-transition:background .5s; -o-transition:background .5s;}
.main_container .products section a:hover h2 {color:#fff; font-size:24px; text-align:center; margin-top:30px;}
.main_container .products section a:hover p {color:#fff; text-align:center; margin-bottom:10px;}
.main_container .products section a:hover .ico_plus {display:inline-block;}

.main_container .products .products1 a:hover {background-image:url('../img/product1_over.png'); }
.main_container .products .products2 a:hover {background-image:url('../img/product2_over.png'); }
.main_container .products .products3 a:hover {background-image:url('../img/product3_over.png'); }
.main_container .products .products4 a:hover {background-image:url('../img/product4_over.png'); }
.main_container .products .products5 a:hover {background-image:url('../img/product5_over.png'); }
.main_container .products .products6 a:hover {background-image:url('../img/product6_over.png'); }
.main_container .products .products7 a:hover {background-image:url('../img/product7_over.png'); }

.main_bottom {clear:both; overflow:hidden; display:block; margin:10px 0;}
.main_bottom section {position:relative; float:left; width:33.3333%; padding:20px;}
.main_bottom section h2 {font-size:20px; font-weight:600;}
.main_bottom section p {padding-bottom:10px;}
.main_bottom section .btn_more {display:inline-block; background:#da9b35; color:#fff; padding:0 10px; border-radius:30px; line-height:20px;}
.main_bottom section .icon {position:absolute; right:50px; top:38px; width:100px; height:100px; background:url('../img/main_ico3.png') no-repeat 5px center;}
.main_bottom .intro .icon {background-position:5px center;}
.main_bottom .map .icon {background-position:-85px center;}
.main_bottom .customer .icon {background-position:-195px center;}
.main_bottom .customer p {font-size:26px; padding-bottom:0; vertical-align:top; letter-spacing:-1px; line-height:1.3;}
.main_bottom .customer p span {display:inline-block; font-size:13px; background:#da9b35; color:#fff; padding:0; border-radius:30px; line-height:20px; vertical-align:middle; letter-spacing:0; width:50px; text-align:center;}

/* ���� ------------------------------------------------------------------------------------- */

.img100 {text-align:center;}
.img100 img {width:100%; max-width:1000px;}
.img1400 {text-align:center; margin-top:30px;}
.img1400 img {width:100%; max-width:1200px;}

/* �Ǹ޴�1 */
.tabMenu {overflow:hidden; border-bottom:1px solid #496b13; margin-bottom:20px;}
.tabMenu li {float:left;}
.tabMenu li a {display:block; text-align:center; font-size:15px; color:#666; font-weight:600; line-height:50px; background:#ebebeb; border-left:2px solid #fff;}
.tabMenu li:first-child a {border-left:0;}
.tabMenu li a:hover {color:#f15c13;}
.tabMenu li a.on {color:#fff; background:#496b13;}
.tabMenu.menu6 li {width:16.66%;}
.tabMenu.menu5 li {width:20%;}
.tabMenu.menu4 li {width:25%;}
.tabMenu.menu3 li {width:33.33%;}
.tabMenu.menu2 li {width:50%;}

/* ���̺� */
.tblBasic {width:100%; border-top:2px solid #6d6d6d; border-bottom:2px solid #cdcdcd;}
.tblBasic thead tr th {text-align:center; padding:15px 10px; font-weight:600; color:#333; border-bottom:1px solid #cdcdcd; background:#f4f8fc;}
.tblBasic tbody tr th {text-align:center; padding:10px; font-weight:600; color:#333; border-bottom:1px solid #cdcdcd; background:;}
.tblBasic tbody tr td {text-align:center; padding:10px; font-weight:400; color:#666; border-bottom:1px solid #cdcdcd;  }
.tblBasic .left {text-align:left;}
.tblBasic .right {text-align:right;}

.tblWrap {margin:50px 0; overflow-x: auto; overflow-y: hidden;}
.tblContent {border-top:3px solid #496b14; border-bottom:1px solid #999; width:100%; min-width: 650px;}
.tblContent thead tr {background:#fbf5ea;}
.tblContent tr td, .tblContent tr th {padding:5px; text-align:center; border-right:1px solid #e0e0e0; border-bottom:1px solid #e0e0e0; font-size:16px;}
.tblContent tr th {padding:7px;}

.tblContent  thead tr th:last-child , .tblContent td:last-child {border-right:none;}

/*����*/
.container .contentsArea h3 {text-align:center; color:#012147; font-size:32px; font-weight:600; line-height:50px; font-family:'Nanum Square'; margin:10px 0 30px;}

/* ��ư */
.btn {display:inline-block;line-height:25px; background:#fff; border:1px solid #c9c9c9; text-align:center; font-weight:600; text-decoration:none !important; padding:0 10px; vertical-align:middle; border-radius:3px; margin:2px;}
.btn.primary {background:#d9d9d9;}


/* Contents --------------------------------------------------------------------------------------- */

.subVisual {display:table; width:100%; background:url('../img/subVisual_0101.png') no-repeat center top; height: 61px; border-bottom:1px solid #ccc;}
.subVisual h2 {display:table-cell; text-align:center; vertical-align:middle; font-size:36px; color:#fff; line-height:1.2; font-family:'Nanum Square';}

.map {width:100%; max-width:1000px; margin:0 auto;}
.map .mapBox {border:1px solid #ccc; height:400px; overflow:hidden;}
.map .mapAdd {border-top:2px solid #003471; margin-top:30px;}
.map .mapAdd dl {overflow:hidden;}
.map .mapAdd dl dt {width:15%; float:left; border-bottom:1px solid #ddd; padding:10px 0; text-align:center; font-weight:600; color:#003471;}
.map .mapAdd dl dd {width:85%; float:left; border-bottom:1px solid #ddd; padding:10px 0;}

.bbs_wrap {width:100%; max-width:1000px; margin:0 auto;}

.product_wrap {width:100%; max-width:1040px; margin:0 auto; padding:0 20px;}
.product_search {position:relative; border-top:1px solid #ddd; padding-top:20px;}
.product_search .total {position:absolute; left:0; line-height:30px;}
.product_search .total strong {font-weight:600; color:#fd4d00}
.product_search .search {text-align:right;}
.btn_search {display:inline-block; background:#999; color:#fff; padding:0 10px; line-height:30px;}
.product_wrap .product_list {margin:10px -10px; overflow:hidden;}
.product_wrap .product_list .item {float:left; width:25%; padding:10px;}
.product_wrap .product_list .item a {display:block; padding:20px; border:1px solid #ddd;}
.product_wrap .product_list .item a .img,
.product_wrap .product_list .item a .title,
.product_wrap .product_list .item a .btn_wrap {display:block; text-align:center;}
.product_wrap .product_list .item a .img img {width:100%; max-width:250px;}
.product_wrap .product_list .item a .title {font-size:16px; font-weight:600; margin:10px 0;}

.product_info {overflow:hidden}
.product_info .img_wrap {float:left; width:50%; border:1px solid #ddd; text-align:center;}
.product_info .img_wrap img {width:100%; max-width:450px;}
.product_info .info_wrap {float:left; width:50%; padding-left:30px;}
.product_info .info_wrap .title {border-top:3px solid #888; padding:30px 20px; font-size:30px; color:#496b13}
.product_info .info_wrap .subscript {border-top:1px dashed #ccc; padding:30px 20px; font-size:16px;}
.product_info .info_wrap .detail {border-top:1px dashed #ccc; border-bottom:1px solid #333; margin-bottom:30px;}
.product_info .info_wrap dl {overflow:hidden;}
.product_info .info_wrap dl dt {float:left; background:#f7f7f7; width:30%; padding:10px 20px;}
.product_info .info_wrap dl dd {float:left; width:70%; padding:10px 20px;}
.product_info .btn_wrap {text-align:right;}
.product_info .btn_wrap .btn {display:inline-block; background:#8c8c8c; color:#fff; font-size:18px; text-align:center; width:30%; max-width:170px; min-width:100px; padding:10px 0; border:0; border-radius:0;}
.product_info .btn_wrap .btn.buy {background:#fe791b}
.product_info .btn_wrap .btn:hover {background:#777}
.product_info .btn_wrap .buy:hover {background:#f35e0d}

.product_contents {padding-top:30px;}
.product_contents .contents {text-align:center; padding:30px 0 50px;}
.product_contents .contents img {max-width:1000px}


/* introduce */
.introduce {width:100%; max-width: 1200px;  margin:0 auto; position:relative;}
.introduce h4 {font-size:32px; color:#333; font-weight:normal;}
.introduce h4 span {font-weight: bold;}

/* introduce-intro */
.introduce.intro {overflow:hidden;}
.introduce.intro .textContent {width:50%; display:inline-block; float:left; padding-right:30px;}
.introduce.intro .imgContent {display: inline-block; width:50%;}
.introduce.intro p { font-size:16px; margin-bottom:30px; color:#111;}
.introduce.intro p.title {font-weight: bold;}
.introduce.intro span.ico_bar {background:url("../img/ico_bar.png") bottom left no-repeat; display:inline-block; width:42px; height: 5px; margin:20px 0;}

/* introduce-organization */
.introduce.organization {text-align: center;}
.introduce.organization .imgWrap {margin-bottom:50px; padding-right: 20px;}
.introduce.organization .imgWrap img {width:100%;max-width: 982px;}

/* introduce-history*/
.introduce.history .year {display: inline-block; width:60px; height:60px; font-size: 19px; font-weight: bold; color:#fff; text-align: center; line-height: 60px; border-radius: 35px;}
.introduce.history .year.orange {background:#da9b35;}
.introduce.history .year.green {background:#496b13;}
.introduce.history dl{display:inline-block; width:50%;}
.introduce.history .mainList li {overflow: hidden;}
.introduce.history .mainList li dl {position:relative; min-height:60px;  padding:40px 0;}

.introduce.history .mainList li dl dt {position:absolute;}
.introduce.history .mainList li:nth-child(2n) dl {float:left; border-right:3px solid #e7e7e7;}
.introduce.history .mainList li:nth-child(2n) dl dt {top:0; right:-35px;}
.introduce.history .mainList li:nth-child(2n) dl dd {text-align: right; margin-right:35px;}
.introduce.history .mainList li:nth-child(2n+1) dl {float:right; border-left:3px solid #e7e7e7;}
.introduce.history .mainList li:nth-child(2n+1) dl dt {top:0; left:-30px;}
.introduce.history .mainList li:nth-child(2n+1) dl  dd {text-align: left; margin-left:35px;}
.introduce.history .mainList li dl  dd .subList li {padding:0 0; text-indent:-7px; padding-left:7px; font-size:16px;}
.introduce.history .mainList li:last-child dl{border:none;}
.introduce.history .mainList li:nth-child(2n+1) dl dd .subList li:before {list-style:none; content:"-";}
.introduce.history .mainList li:nth-child(2n) dl dd .subList li:after{list-style:none;  content:"-";}