@charset "utf-8";

/* 공통및 절대적인... */
.none {display:none;}
.blind {display: block;overflow: hidden;position: absolute;top: 0;left: 0;width: 0;height: 0;border: 0;background: none;font-size: 0;line-height: 0;}

/* 기본구조 */
#wrap {position:relative; }

.subtop {margin:0 auto; width:100%; position: fixed; top: 0px; left: 0px; z-index:2000;}

#headWrap {margin:0 auto; width:100%;height:115px; position: fixed; top: 0px; left: 0px; background:url(/images/top_bg.png) repeat-x center top; border-bottom:1px solid #fff; z-index:1000;}
#headWrap:after{display:block;visibility:hidden;clear:both;height:0;content:'.'}
.head {position:relative;margin:0 auto;width:1200px;}
.head .logo {float:left;margin:53px 0 0 0;}
.head .util {position:absolute;top:10px;right:0;}
.head .util li {float:left;margin:0 0 0 10px;padding-left:10px;background:url(/images/util_bar.png) no-repeat 0 50%; font-size:12px;}
.head .util li:first-child {background:none;}
.head .util li a {color:#888;}





.nav {float:right;position:relative;margin:30px 0 0;}
.nav:after{display:block;visibility:hidden;clear:both;height:0;content:'.'}
.nav .dep1 {float:left;margin-left:20px;}
.nav .dep1:first-child {background:none;}
.nav .dep1>a {display:block;padding:33px 30px 33px 30px;font-size:16px;color:#222;font-weight:600;text-transform: uppercase;}
.nav .dep1:hover>a, .nav .dep1.current>a {color:#133e8d;}
.nav .dep1:hover .dep2 {display:block;}
.nav .dep2 {display:none;z-index:1000;position:absolute;top:70px;left:auto; border:1px solid #222; background:#fff; background:#fff; box-shadow: 3px 3px 3px rgba(0,0,0,.2);}
.nav .dep2 li {width:150px;}
.nav .dep2 li a {display:block;font-size:13px;line-height:18px;color:#333; font-weight:600; padding:10px 20px;}
.nav .dep2 li a:hover {color:#333; background:#efefef;}





/* 메인비주얼 */
#flickingList {position:relative;overflow:hidden; margin:0 auto; text-align:center;width:100%; height:631px; top:0px; left:0px;z-index:10; padding-top:0px;}
#flickingList .cont {position:relative; overflow:hidden; top:0px; width:100%; vertical-align:top;text-align:center; }
#flickingList .layerWrap {position:relative; overflow:hidden; top:0px;width:12000px;  white-space:nowrap;  vertical-align:top;}
#flickingList .layerWrap:after{content:""; display:block; clear:both; }
#flickingList .layer {float:left; width:100%;  text-align:center;  }
#flickingList .bg1 {background:url("/images/main_visual1.jpg") no-repeat top center;height:631px;}
#flickingList .bg2 {background:url("/images/main_visual2.jpg") no-repeat top center;height:631px;}
#flickingList .bg3 {background:url("/images/main_visual3.jpg") no-repeat top center;height:631px;}
#flickingList .bg4 {background:url("/images/main_visual4.jpg") no-repeat top center;height:631px;}
#flickingList .bg5 {background:url("/images/main_visual5.jpg") no-repeat top center;height:631px;}

#flickingList .tabWrap {position:absolute;bottom:-20px; left:47%; text-align:center;z-index:200; }
#flickingList .tabWrap li {display:inline; padding:0 2px;}
#flickingList .tabWrap li a {display:inline-block; width:16px; height:16px; background:url("/images/btn_off.png") no-repeat;}
#flickingList .tabWrap li a.current {background:url("/images/btn_on.png") no-repeat;}
#flickingList .tabWrap li a.btn_play {display:inline-block; width:20px; height:20px; background:url("/images/play.png") no-repeat;}
#flickingList .tabWrap li a.btn_stop {display:inline-block; width:20px; height:20px; background:url("/images/stop.png") no-repeat;}
#flickingList .tabWrap li a.current.btn_play {display:inline-block; width:20px; height:20px; background:url("/images/play_on.png") no-repeat;}
#flickingList .tabWrap li a.current.btn_stop  {display:inline-block; width:20px; height:20px; background:url("/images/stop_on.png") no-repeat;}

#flickingList .prevNext {position:absolute;top:300px; width:100%;height:75px;z-index:200;border:0px solid red;}
#flickingList button {overflow:visible; margin:0; padding:0; border:none; background:none; cursor:pointer;}
#flickingList button.prev {position:absolute; top:0px; left:20px; width:75px; height:75px; z-index:10;}
#flickingList button.next {position:absolute; top:0px; right:20px; width:75px; height:75px; z-index:10;}

#flickingList .v_wrap{width:1200px; position:relative; top:265px;  left:0; margin:0 auto;}
#flickingList .view{border:0px solid red; text-align:left;}
#flickingList .view .t_txt {font-size:30px; line-height:1.2em; font-weight:700; color:#fff; }
/*#flickingList .view .t_s_txt {color:#fff;  font-size:34px; line-height:1.2em; }*/
#flickingList .visual_btn {position:relative; top:55px; text-align:left;}
#flickingList .visual_btn a {font-size:14px; font-weight:400; color:#2c2c2c; 
border:1px solid #2c2c2c; padding:13px 45px; }
#flickingList .visual_btn a:hover {background-color:rgba(0,0,0,.7); border:1px solid #2c2c2c; color:#fff;}


.m_con {overflow:hidden; padding-top:75px;}


/*con1*/
/*제품 리스트 롤링*/
.big_text {font-size:24px; color:#3b3b3b; font-weight:900; letter-spacing:8px;  text-align:center;}

.banner_thumb {float:left; width:100%;min-width:1200px; border:0px solid red;}
.bannerthumb {width:1200px;margin:0 auto;padding-top:40px; }

.bannerthumb #banner_wrap{width:1130px; margin:0 auto; position:relative; border-top:1px solid #dbdbdb; border-bottom:1px solid #dbdbdb; border-left:1px solid #dbdbdb;}
.bannerthumb #banner_wrap li {width:283px; height:395px; border-right:1px solid #dbdbdb; text-align:center;}
.bannerthumb #banner_wrap li:first-child {border-left:1px solid #dbdbdb;}
.bannerthumb #banner_wrap li img {padding:50px 30px 10px 30px;  text-align:center;}

.bannerthumb #banner_wrap li .banner_tit {color:#666; font-size:18px; font-weight:300; padding:0px 3px 10px 3px;}
.bannerthumb #banner_wrap li .banner_txt {color:#888; font-size:14px; padding:10px 10px; line-height:230%;}
.bannerthumb #banner_wrap li .btn {position:relative; top:25px;}
.bannerthumb #banner_wrap li .btn a {padding:5px 15px; color:#7686c2; background:#fff; border:1px solid #7686c2; font-size:12px;}
.bannerthumb #banner_wrap li .btn a:hover {color:#fff; background:#7686c2; border:1px solid #7686c2;}

#prevBtn{position:absolute; left:-30px; top:180px; z-index: 2;}
#nextBtn{position:absolute; right:-30px; top:180px; z-index: 2;}
.bannerthumb .best{float:left; width:1200px;}




/*contents2*/
.main_center {clear:both; overflow:hidden; position:relative; margin:0 auto; width:100%; height:308px; background:url(/images/m_con2_bg.jpg) repeat-x center top;}
.m_center {overflow:hidden; margin:0 auto; width:1200px;}

.brand_txt {float:left; padding-left:35px;}
.brand_txt li:first-child {color:#174a4e; font-size:16px; font-weight:600; padding-top:60px;}
.brand_txt li {color:#fff; font-size:30px; font-weight:700; padding-top:20px;}
.brand_txt li:last-child {padding-top:80px;}
.brand_txt li a {font-size:13px; color:#555;padding:10px 0;}

.brand_img {float:right; padding-top:13px; padding-right:70px;}



/*con3*/
.main_banner {overflow:hidden; left:0; top:0; width:1200px;padding-top:20px;}
.main_banner li {float:left; position:relative; padding-left:20px;}
.main_banner li:first-child {padding-left:0px;}
.main_banner li dl {position:absolute; top:88px; left:55px;}
.main_banner li dl dt {font-size:30px; color:#333; letter-spacing:3px; font-family:'Nanum Barun Gothic', serif; font-weight:300;}
.main_banner li dl dd {font-size:14px; color:#555; padding-top:20px; line-height:160%;}
.main_banner li p.btn a {position:absolute; bottom:50px; left:55px; padding:5px 15px; color:#2f2c1b; border:1px solid #2f2c1b; font-size:12px;}
.main_banner li p.btn a:hover {background-color:rgba(0,0,0,.7); border:1px solid #2f2c1b; color:#fff;}

.main_banner_top {position:relative;}
.main_banner_top dl {position:absolute; top:88px; left:395px;}
.main_banner_top dl dt {font-size:30px; color:#333; letter-spacing:3px; font-family:'Nanum Barun Gothic', serif; font-weight:300;}
.main_banner_top dl dd {font-size:14px; color:#555; padding-top:20px; line-height:160%;}
.main_banner_top p.btn a {position:absolute; bottom:50px; left:395px; padding:5px 15px; color:#2f2c1b; border:1px solid #2f2c1b; font-size:12px;}
.main_banner_top p.btn a:hover {background-color:rgba(0,0,0,.7); border:1px solid #2f2c1b; color:#fff;}







/*foot sitemap*/
.navi_wrap {background:#363636;}
.navi {overflow:hidden;margin:0 auto; width:1200px;}
.navi > li {
	float:left;
	width:19.8%;
	min-height:140px;
	background:#363636;
	border-right:1px solid #4e4e4e;
	padding:20px 0;
}
.navi > li:first-child {border-left:1px solid #4e4e4e;}


.navi > li > dl a:hover {text-decoration:underline;}
.navi > li > dl > dt {margin-bottom:20px; border-bottom:1px solid #4e4e4e; }
.navi > li > dl > dt > a {
	display:block;
	font-size:16px;
	line-height:24px;
	color:#c8c8c8;
	font-weight:bold;
	padding:0 0px 10px 30px;
}
.navi > li > dl > dd > a {
	display:block;
	font-size:14px;
	line-height:20px;
	color:#8c8c8c;
	padding:0 10px 5px 30px;
}

/*copyright*/
#footer_wrap {background:#fff;}
#footer {overflow:hidden;margin:0 auto;padding:30px 0; width:1200px; }
#footer .f_logo {float:left;}
#footer .foot_info {float:left;color:#555;line-height:18px;font-size:13px; padding-left:50px;}
#footer .foot_info .copy {}
#footer .gobiz {float:right; padding-top:0px;}



/*top*/
a#MOVE_TOP_BTN {
    position: fixed;
    right: 2%;
    bottom: 50px;
    display: none;
    z-index: 2000;
	padding:10px 10px;
	width:30px; height:30px;
	background-color:rgba(0,0,0,.7);
	color:#fff;
	font-size:12px;
	text-align:center;
	border-radius:50%;
}





/********************************* sub layout *************************************/

.sub_visual {position:relative;overflow:hidden; margin:0 auto; width:100%; top:0px; left:0px;z-index:10; padding-top:0px;}
.sub_visual .product_visual1 {min-width:1200px; height:402px; background:#ccc url(/images/sub_visual1.jpg) no-repeat center top;}
.sub_visual .product_visual2_1 {min-width:1200px; height:402px; background:#ccc url(/images/sub_visual2_1.jpg) no-repeat center top;}
.sub_visual .product_visual2_2 {min-width:1200px; height:402px; background:#ccc url(/images/sub_visual2_2.jpg) no-repeat center top;}
.sub_visual .product_visual2_3 {min-width:1200px; height:402px; background:#ccc url(/images/sub_visual2_3.jpg) no-repeat center top;}
.sub_visual .product_visual3 {min-width:1200px; height:402px; background:#ccc url(/images/sub_visual3.jpg) no-repeat center top;}
.sub_visual .product_visual4 {min-width:1200px; height:402px; background:#ccc url(/images/sub_visual4.jpg) no-repeat center top;}
.sub_visual .sub_txt {width:1200px; margin:0 auto;}
.sub_visual .sub_txt p {padding-left:135px; padding-top:200px;text-align:left;font-family:'Nanum Barun Gothic', serif; color:#2f2c1d; font-size:54px; font-weight:300; letter-spacing:3px;}
.sub_visual .sub_txt p span {color:#2f2c1d; font-size:28px; line-height:150%; font-weight:200;}



.container {margin:65px auto; width:1130px; min-height:400px;}
.container:after {display:block;visibility:hidden;clear:both;height:0;content:'.'} 


.titleArea {text-align:center; font-size:30px; color:#2f2c1b; font-weight:700; background:url(/images/tit_util_bar.jpg) no-repeat center bottom; padding-bottom:25px; margin-bottom:40px;}

/*tab*/
.tab {overflow:hidden;width:1130px; text-align: center; margin-bottom:60px;}
.tab li {display:inline-block; margin-left:10px; min-width:150px;}
.tab li:first-child {margin-left:0;}
.tab li a {display:block;padding:12px 35px;text-align:center;color:#2f2c1b; font-size:15px; font-weight:400; background:#fff; border:1px solid #2f2c1b;}
.tab li.on a {background:#2f2c1b; border:1px solid #2f2c1b; color:#fff;}
.tab li a:hover {background:#2f2c1b; border:1px solid #2f2c1b; color:#fff;}

/*tab2*/
.tab2 {overflow:hidden;width:840px; text-align: center; margin-bottom:50px;}
.tab2 li {display:inline-block; margin-left:5px; min-width:120px;}
.tab2 li:first-child {margin-left:0;}
.tab2 li a {display:block;padding:10px 20px;text-align:center;color:#fff; font-size:12px; font-weight:600; background:#8c8c8c;}
.tab2 li.on a {background:#404040;}
.tab2 li a:hover {background:#404040;}





/* sub contents */
.contents {overflow:hidden;font-size:15px; color:#555; line-height:150%; border:0px solid red;}


/*제품 리스트*/
.product_list {overflow:hidden;}
.product_list li {float:left; padding:0 10px; margin-bottom:50px; text-align:center;}
.product_list li p {font-size:18px; padding-top:10px;}
.product_list li p .tname {font-size:13px; color:#ccc; font-weight:600; }
.product_list li img {border:1px solid #f0f0f0;}

.product_list li .text-overlay {
    opacity: 0;
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=0);
    -MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
    height: 260px;
    position: absolute;
    text-decoration: none;
    width: 260px;
    z-index: 100;
    /* padding: 50px; */
    background: #222;
    background: rgba(255,255,255,0.75);
    -webkit-transition: all 0.4s;
    -moz-transition: all 0.4s;
    -o-transition: all 0.4s;
    transition: all 0.4s;
}
.product_list li:hover .text-overlay {
    opacity: 1;
    filter: progid:DXImageTransform.Microsoft.Alpha(Opacity=100);
    -MS-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
}

.product_list li .text-overlay::before,
.product_list li .text-overlay::after {
    position: absolute;
    top: 10px;
    right: 10px;
    bottom: 10px;
    left: 10px;
    content: '';
    opacity: 0;
    -webkit-transition: opacity 0.5s, -webkit-transform 0.5s;
    transition: opacity 0.5s, transform 0.5s;
}
.product_list li .text-overlay::before {
    border-top: 1px solid rgba(255,255,255,0.22);
    border-bottom: 1px solid rgba(255,255,255,0.22);
    -webkit-transform: scale(0,1);
    transform: scale(0,1);
}
.product_list li .text-overlay::after {
    border-right: 1px solid rgba(255,255,255,0.22);
    border-left: 1px solid rgba(255,255,255,0.22);
    -webkit-transform: scale(1,0);
    transform: scale(1,0);
}
.product_list li:hover .text-overlay::before,
.product_list li:hover .text-overlay::after {
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}




/*product*/
#image_gallery {float:left;}
.gallery{
  position: relative;
  overflow: hidden;
  height: 497px;
}
.galleryBar {
  position: absolute;
  left: 0;
  margin: 0;
  padding: 0 7px;
  display:none;
}

.galleryBar li {
  position: relative;
  margin: 0 7px 1px 0;
  padding: 0;
  overflow: hidden;
  float: left;
  list-style: none;
}


#page_1{float:right; width:530px;}

.page_title {font-size:36px; font-weight:900; color:#2f2c1b; padding-bottom:25px; border-bottom:1px solid #c6c6c6; margin-bottom:25px;}
.page_title p {font-size:24px; font-weight:200; color:#dadada; padding-bottom:25px;}

.page_txt dt {background:#f9f9f9 url(/images/list_icon.png) no-repeat 10px 17px; padding:10px 25px; border-bottom:1px solid #dfdfdf;  color:#222; font-weight:700;}
.page_txt dd {padding:10px 25px; border-bottom:1px solid #dfdfdf;}


#page_2 {margin-top:65px; padding-top:70px; border-top:1px solid #c6c6c6;}

.pro_tit {font-size:30px; font-weight:900; color:#2f2c1b; line-height:1.2em;}

.pro_won {overflow:hidden; margin:0 auto; padding-top:55px; background:url(/images/pro_won_bg.jpg) repeat-x left bottom; border:0px solid red;}
.pro_won li {float:left; border-radius:50%; width:175px; height:175px; background:#03bdd2; text-align:center; margin:0px 40px;}
.pro_won li p {color:#fff; font-size:18px; font-weight:600; height:50px; /*margin:65px 0px 0px 0px;*/ border:0px solid red;}

.pro_num li {position:relative; padding:3px 0px 20px 40px;}
.pro_num li p.num {position:absolute; top:0; left:0; color:#fff; background:#333; /*border-radius:50%;*/ padding:3px 10px;}

.pro_list li {background:url(/images/list_icon.png) no-repeat left 13px; padding:5px 15px;}

.pro_list2 li {padding:5px 0px;}

.pro_txt {font-size:15px; line-height:160%;}
.pro_txt_tit {font-size:24px; font-weight:900; color:#2f2c1b; text-transform: uppercase;}

.step {font-size:16px; font-weight:600; color:#222;}
.box {padding:3px 10px; border:1px solid #222; margin-right:10px;}



/*table*/
table{border-collapse:collapse;}
.t_norm{margin-top:60px;}
.t_norm table{border-top:2px solid #c6c6c6;}
.t_norm table th{background:#f1f1f1; font-weight:bold; font-size:15px; color:#353535; text-align:left;}
.t_norm table th, .t_norm table td{border-bottom:1px solid #ddd; padding:10px 30px; }
.t_norm table td{text-align: left; vertical-align:middle; padding:10px 40px;}
.t_norm table td:first-child {background:#fcfcfc; font-weight:700; }



/*company*/
.com_txt {text-align:center; line-height:200%; color:#333; margin-bottom:70px;}
.com_tit {font-size:20px; font-weight:700;}

.com_center {padding:30px 0 100px 0; margin:0 auto;}
.com_list {overflow:hidden; margin:0 auto; width:840px;}
.com_list li {float:left; padding:10px 10px; font-size:18px; width:220px; height:220px; background-color:rgba(111,154,72,.4); border-radius:50%; margin:0 20px;}
.com_bg {background:url(/images/com_bg.jpg) no-repeat center top;}

.com_logo {overflow:hidden; margin:0 auto;}
.com_logo li {display:inline-block; margin:0 5px; border:1px solid #dfdfdf;}


.cen_line {background:url(/images/cen_line.jpg) no-repeat center; height:1px;}
.contact_line {background:url(/images/contact_tit_bg.jpg) no-repeat center; height:1px;}

.company {text-align:center;}
.company dt {padding:50px 0 25px 0; color:#333; font-size:24px; font-weight:800;line-height:1.2em;}
.company dd {padding-bottom:50px;}


/*brand*/
.product_line {overflow:hidden; border:0px solid #dfdfdf; padding:70px 20px; margin-bottom:70px; }
.product_line_bg {float:left; background:url(/images/brand_line.jpg) repeat-x center 0px;}
.product_line_bg li {float:left; background:url(/images/brand_won.png) no-repeat center top; padding-top:50px; margin:0 15px; width:150px; text-align:center; font-size:16px; font-weight:600;}

.gray_bg_brand {background:url(/images/brand_bg.jpg) no-repeat center top;}



/*history*/
.history {position:relative; width:100%; height: auto; overflow:hidden; margin-top:50px; background:url(/images/util_bar.png) repeat-y center top;}
.history .left {float:left; width:50%; text-align:right;}
.history .right {float:left; width:50%; text-align:left;}

.his {padding-bottom:30px;}
.his dt {font-size:26px; font-weight:700; color:#7686c2; }
.his dd .month {font-size:16px; font-weight:600; padding:20px 0 10px 0;}

.his_img {padding:20px 30px 20px 30px;}

.history .his_won2020 {position:absolute; left:49.3%; top:5;}
.history .his_won2019 {position:absolute; left:49.3%; top:285px;}
.history .his_won2018 {position:absolute; left:49.3%; top:520px;}
.history .his_won2017 {position:absolute; left:49.3%; top:935px;}
.history .his_won2016 {position:absolute; left:49.3%; top:1295px;}
.history .his_won2015 {position:absolute; left:49.3%; top:1465px;}




/*contact*/
.contact_top {overflow:hidden; position:relative; height:301px;}
.contact_time {float:right; width:1070px; height:301px; background:url(/images/contact_bg.jpg) no-repeat right bottom;}
.contact_time li {float:left;}
.contact_tit {padding-bottom:30px; padding-top:35px; margin-bottom:20px; font-size:22px; background:url(/images/contact_tit_bg.jpg) no-repeat left bottom;}
.contact_tit {padding-bottom:30px; padding-top:35px; margin-bottom:20px; font-size:20px; background:url(/images/contact_tit_bg.jpg) no-repeat left bottom;}
.contact_txt {margin-left:100px; width:730px; text-align:center; color:#fff; font-size:20px;}
.contact_txt p {padding-top:35px; line-height:1.2em;}

.l_comma {position:absolute; top:0; left:55px;}
.r_comma {position:absolute; bottom:35px; right:35px;}
.contact_name {position:absolute; bottom:10px; left:200px; font-size:60px; color:#cfcfcf; font-weight:900; font-family:'Nanum Barun Gothic', serif;}




.contact_map {float:left; margin-top:100px; width:100%;}
.map_txt {float:left;}
.map_txt li {float:left;}


.contact_list {float:left; margin-top:50px; width:100%;}
.contact_list dl {float:left; margin:0 5px; border:1px solid #dfdfdf; width:330px; height:280px; padding:30px 15px;}
.contact_list dl dt {font-size:16px; font-weight:700; padding-bottom:10px;}
.contact_list dl dd {padding:3px 0;}





/*준비중페이지*/

.ing {/*background:url(/images/ing.png) no-repeat center;*/ text-align:center; padding:50px 0 150px 0;}
.ing_txt {/*font-family:'Nanum Barun Gothic', serif;*/ font-size:48px; color:#888; line-height:90%; font-weight:200; padding-top:20px;}






/*ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ sitemap 사이트맵  ㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡㅡ*/
.sitemap {width:100%;}
.map_dl {
	float:left;
	width:31%;
	margin:0 1%;
	padding-bottom:15px;
	margin-bottom:25px;
	background-color:#f5f5f5;
}
.map_dl.margin_right_none {margin-right:0;}
.map_dl > dt {
	width:80%;
	padding:20px 10%;
	/*height:45px;*/
	font-size:20px;
	font-weight:600;
}
.map_dl > dd {
	width:80%;
	padding:3px 10%;
}
.map_dl > dd > a {
	display:block;
	font-size:14px;
	line-height:15px;
	padding:7px;
	background-color:#ffffff;
	border:1px solid #bcbcbc;
}
.map_dl > dd > a:hover {
	color:#ffffff;
	background-color:#7686c2;
}