@import url(http://fonts.googleapis.com/earlyaccess/nanumgothic.css);
@import url(css/kopubdotum.css);
@import url(http://fonts.googleapis.com/earlyaccess/nanummyeongjo.css);


@media screen and (max-width:320px) {
     body {zoom:50%;}
 }
 @media screen and (min-width:321px) and (max-width:359px) {
     body {zoom:50%;}
 }
 @media screen and (min-width:360px) and (max-width:374px) {
     body {zoom:55.5%;}
 }
 @media screen and (min-width:375px) and (max-width:375px) {
     body {zoom:58.5%;}
 }
 @media screen and (min-width:376px) and (max-width:479px) {
     body {zoom:64.6%;}
 }
 @media screen and (min-width:480px) and (max-width:639px) {
     body {zoom:75%;}
 }
  /* 아이패드(1024X768)보다 큰 스크린 사이즈와 해상도를 갖는 모든 기기에서의 해상도 설정
 @media all and (min-width: 640px) {
     body {width:640px; margin:0 auto;}
  */
  @media all and (min-width: 640px) {
     body {zoom:100%; margin:0 auto;}
 }


*{margin:0; padding:0; color:inherit; box-sizing:border-box; letter-spacing:-0.03em;}
img {border:0;vertical-align:top;}
a {border:0; text-decoration:none; color:inherit;}
ul, li {list-style:none;}
div {display:block;}
body {font-family: 'Nanum Gothic', san-serif; width:100%;max-width:640px;color:#505050;}
h1,h2,h3,h4 {font-family: 'KoPub Dotum';font-weight:normal;line-height:130%}
h1 {font-size:46px;}
h2 {font-size:38px;}
h3 {font-size:26px;}
h4 {font-size:21px;}
p {line-height:180%}
.inner {width:600px;margin:auto;}
.center {text-align:center !important}
.left {float:left;}
.right {float:right;}
.c_white {color:#fff !important;}
.c_red {color:#c80008 !important;}
.c_gray {color:#808080 !important}
.bg_gray {background:#f5f5f5;}
.mj {font-family: 'Nanum Myeongjo' !important; letter-spacing:-0.1em !important}
.img100 {width:100%;height:auto}


.inner {width:600px;margin:auto}

/* 마진,패딩 설정 */
.mt10 {margin-top:10px;}
.mt20 {margin-top:20px;}
.mt30 {margin-top:30px;}
.mt40 {margin-top:40px;}
.mt50 {margin-top:50px;}
.mt60 {margin-top:60px;}
.mt70 {margin-top:70px;}
.mt80 {margin-top:80px;}

.mb10 {margin-bottom:10px;}
.mb20 {margin-bottom:20px;}
.mb30 {margin-bottom:30px;}
.mb40 {margin-bottom:40px;}
.mb50 {margin-bottom:50px;}
.mb60 {margin-bottom:60px;}
.mb70 {margin-bottom:70px;}
.mb80 {margin-bottom:80px;}

.pd0 {padding-left:0 !important;padding-right:0 !important;}

.pl10 {padding-left:10%;}
.pl20 {padding-left:20%;}
.pl30 {padding-left:30%;}
.pl40 {padding-left:40%;}
.pl50 {padding-left:50%;}
.pl60 {padding-left:60%;}
.pl70 {padding-left:70%;}
.pl80 {padding-left:80%;}

.pr10 {padding-right:10%;}
.pr20 {padding-right:20%;}
.pr30 {padding-right:30%;}
.pr40 {padding-right:40%;}
.pr50 {padding-right:50%;}
.pr60 {padding-right:60%;}
.pr70 {padding-right:70%;}
.pr80 {padding-right:80%;}

.ml0 {margin-left:0 !important;}
.mr0 {margin-right:0 !important;}

/* 보더 설정 */
.bd_t {border-top:1px #e0e0e0 solid;}
.bd_b {border-bottom:1px #e0e0e0 solid;}
.bd_l {border-left:1px #e0e0e0 solid;}
.bd_r {border-right:1px #e0e0e0 solid;}



#wrap {width:100%;  margin:0 auto; background:#fff;}
#header {width:100%;position:absolute !important; z-index:9999; color:#fff; height:94px;line-height:0;border-bottom-color:rgba(255,255,255,0.5);border-bottom-width:1px;border-bottom-style:solid;top:0;display:inline-block;}
#header .inner {position:relative}
#header .header_logo {float:left;margin-top:27px;}
#header .menu_btn {float:right; margin-top:34px;}




#main {width:100%;position:relative;margin:auto;line-height:0;display:inline-block;}

#main .flexslider {position:relative;width:100%;}
#main .flexslider .slide_txt {width:100%;text-align:center;position:absolute;z-index:99;top:438px;}
#main .flexslider #go_down {width:100%;text-align:center;position:absolute;z-index:99;bottom:70px;cursor:pointer}
#main .flexslider .slide1 {width:100%; background:url(images/main_sl1.jpg) center;height:100%;min-height:900px;background:cover;}
#main .flexslider .slide2 {width:100%; background:url(images/main_sl2.jpg) 15%;height:100%;min-height:900px;background:cover;}
#main .flexslider .slide3 {width:100%; background:url(images/main_sl3.jpg) 65%;height:100%;min-height:900px;background:cover;}


#main .section {width:100%;padding:60px 0;position:relative;display:inline-block}
#main .section h1 {font-size:46px;}
#main .section p {font-size:18px;color:#808080;}
#main .section p.small {font-size:15px;}
#main span.btn_go {color:#fff;height:51px;line-height:51px;background:url(images/arrow_right.png) right center no-repeat;display:inline-block;cursor:pointer}
#main span.btn_go.gray {color:#808080;background:url(images/arrow_right_b.png) right center no-repeat;}
#main span.btn_go a {display:block;padding-right:60px;}
#main span.btn_go.icon a {text-indent:-3333px;padding-right:38px}

#main .section.sec2 {background:url(images/section2_bg.png) top center no-repeat;min-height:580px;}
#main .section.sec2 h1 {padding-top:270px;color:#fefee0;}
#main .section.sec3 {background:url(images/section3_bg.png) top center no-repeat;min-height:649px;}
#main .section.sec3 h1 {padding-top:200px;}
#main .section.sec4 .flexslider ul li > div {width:100%;height:486px;}
#main .section.sec4 .event1 .left {background:url(images/m_section4_1left.png) no-repeat;}
#main .section.sec4 .event1 .right {background:url(images/m_section4_1right.png) no-repeat;}
#main .section.sec4 .left,#main .section.sec4 .right {width:50%;height:486px;}
#main .section.sec5 .sec5_box {width:100%;height:486px;}
#main .section.sec5 .sec5_box .left {width:50%;background:url(images/section5_left.png) right top;}
#main .section.sec5 .sec5_box .left a {float:right}
#main .section.sec5 .sec5_box .right {width:50%;background:url(images/section5_right.png) left top;}
#main .section.sec5 .sec5_box .box {width:100%;height:486px;color:#fff;padding:25px 25px}
#main .section.sec5 .sec5_box .left .box {float:right}
#main .section.sec5 .sec5_box .right .box {float:left;}
#main .section.sec5 .sec5_box .box h2 {margin-bottom:20px;padding-top:230px;text-shadow:1px 1px 1px #505050}



#footer {width:100%; margin:auto;position:relative;text-align:center;color:#fff;background:#000;}
#footer .txt_area {display:inline-block;padding:20px;width:100%;}
#footer .txt_area span {padding:0 6px;line-height:150%;font-size:13px;}
#footer .txt_area span a {font-size:18px;font-weight:bold}





#sub {width:100%;  display:inline-block; position:relative; background:#fff}
#sub .top {width:100%;  text-align:center;color:#fff;height:285px}
#sub .top h1 {padding-top:160px;}
#sub .top.top_about1 {background:url(images/about1_top.jpg) top center;}
#sub .top.top_about2 {background:url(images/about2_top.jpg) top center;}
#sub .top.top_about3 {background:url(images/about3_top.jpg) top center;}
#sub .top.top_about4 {background:url(images/about4_top.jpg) top center;}
#sub .top.top_about5 {background:url(images/about5_top.jpg) top center;}
#sub .top.top_about6 {background:url(images/about6_top.jpg) top center;}
#sub .top.top_about7 {background:url(images/about7_top.jpg) top center;}
#sub .top.top_about8 {background:url(images/about8_top.jpg) top center;}
#sub .top.top_about9 {background:url(images/about9_top.jpg) top center;}
#sub .top.top_product {background:url(images/product_top.jpg) top center;}
#sub .top.top_event {background:url(images/event_top.jpg) top center;}
#sub .top.top_promotion {background:url(images/promotion_top.jpg) top center;}
#sub .top.top_nature {background:url(images/nature_top.jpg) top center;}
#sub .top.top_community {background:url(images/community_top.jpg) top center;}
#sub .top.top_partner {background:url(images/partner_top.jpg) top center;}
#sub .top.top_cs {background:url(images/cs_top.jpg) top center;}
#sub .top.top_edition {background:url(images/edition_top.jpg) top center;}



#sub .top.top_info {height:285px;}
#sub .top.product1 {background:url(images/product1_top.jpg) top center;background-size:cover;}
#sub .top.product2 {background:url(images/product2_top.jpg) top center;background-size:cover;}
#sub .top.product3 {background:url(images/product3_top.jpg) top center;background-size:cover;}
#sub .top.product4 {background:url(images/product4_top.jpg) top center;background-size:cover;}
#sub .top.product5 {background:url(images/product5_top.jpg) top center;background-size:cover;}
#sub .top.product6 {background:url(images/product6_top.jpg) top center;background-size:cover;}
#sub .top.product7 {background:url(images/product7_top.jpg) top center;background-size:cover;}
#sub .top.product8 {background:url(images/product8_top.jpg) top center;background-size:cover;}
#sub .top.product9 {background:url(images/product9_top.jpg) top center;background-size:cover;}
#sub .top.product10 {background:url(images/product10_top.jpg) top center;background-size:cover;}
#sub .top.top_info h1 {padding-top:160px;}

#sub .snb {width:100%; height:56px; line-height:55px; border-bottom:1px #d0d0d0 solid;}
#sub .snb .inner {width:560px}
#sub .snb li {float:left;text-align:center}
#sub .snb li.at {font-size:22px;}
#sub .snb li.list {float:right;}
#sub .snb li.list img {margin-top:23px}
#sub .snb .subnav { margin:auto;
width:100%;
 background:#f5f5f5;
 clear:both;
 display: none;
 position: absolute;
  z-index:10;
  text-align:center;
  top:340px;
  left:0;
  font-size:18px;
  line-height:18px;
  border-bottom:2px #d0d0d0 solid
 }
#sub .snb .subnav dl {text-align:left;display:block;margin:auto;width:100%;}
#sub .snb .subnav dd {border-bottom:1px #e0e0e0 solid}
#sub .snb .subnav dd a {display:block;padding:15px 40px;}
#sub .snb .subnav dd a.on {font-weight:bold;font-size:20px;line-height:20px;background:#ee2e30;color:#fff}


#sub #content {width:100%;  display:inline-block;}
#sub #content .content_box {width:100%;  display:inline-block;}
#sub #content .content_box .paragraph {width:100%;display:inline-block;padding:60px 0;}

#sub #content .about1_bg {background:url(images/about1_bg.png) right bottom no-repeat; min-height:1070px; }
#sub #content .about4_2_bg {background:url(images/about4_2_bg.jpg) top center; min-height:610px; }
#sub #content .about4_4_bg {background:url(images/about4_4_bg.jpg) top center; min-height:800px; }
#sub #content .about4_5_bg {background:url(images/about4_5_bg.jpg) top center; min-height:690px; }
#sub #content .about4_5_bg p {width:48%;}
#sub #content .about4_9_bg {background:url(images/about4_9_bg.jpg) top center; min-height:920px; }
#sub #content .about4_11_bg {background:url(images/about4_11_bg.jpg) top center; min-height:2000px;padding-bottom:100px }
#sub #content .about6_2_bg {background:url(images/about6_2_bg.jpg) top center; min-height:850px; }
#sub #content .about7_bg {background:url(images/about7_bg.jpg) top center; min-height:1360px; padding-top:90px}

#sub #content .bd_b {border-bottom:1px #d0d0d0 solid}

#sub #content .content_box .table {font-size:15px}
#sub #content .content_box .table .red {color:#c80008; font-size:17px}
#sub #content .content_box .table th {border-top:4px #aaaaaa solid; font-weight:normal}
#sub #content .content_box .table th.red {border-top:4px #c80008 solid}
#sub #content .content_box .table th,#sub #content .content_box .table td {padding:8px 10px;border-bottom:1px #d0d0d0 solid;border-left:1px #d0d0d0 solid;}
#sub #content .content_box .table .head {border-left:0}



/** 제품 **/
#sub #content .part_name {width:100%;  height:160px; color:#fff}
#sub #content .part_name.product1 {background:url(images/product1_top.jpg) center;background-size:cover;}
#sub #content .part_name.product2 {background:url(images/product2_top.jpg) center;background-size:cover;}
#sub #content .part_name.product3 {background:url(images/product3_top.jpg) center;background-size:cover;}
#sub #content .part_name.product4 {background:url(images/product4_top.jpg) center;background-size:cover;}
#sub #content .part_name.product5 {background:url(images/product5_top.jpg) center;background-size:cover;}
#sub #content .part_name.product6 {background:url(images/product6_top.jpg) center;background-size:cover;}
#sub #content .part_name.product7 {background:url(images/product7_top.jpg) center;background-size:cover;}
#sub #content .part_name.product8 {background:url(images/product8_top.jpg) center;background-size:cover;}
#sub #content .part_name.product9 {background:url(images/product9_top.jpg) center;background-size:cover;}
#sub #content .part_name h2 {line-height:160px;padding-left:20px}
#sub #content .product_list,#sub #content .product_info {background:url(images/product_bg.png);width:100%;  display:inline-block;}
#sub #content .product_list {padding:40px 0}
#sub #content .product_list h3 {text-align:center;width:100%}
#sub #content .product_list .box {width:46%;margin:30px 2%;text-align:center;float:left}
#sub #content .product_list .box .img {width:100%;height:265px; overflow:hidden; position:relative}
#sub #content .product_list .box .img img {height:100%;width:auto;margin-left:-55px;}
#sub #content .product_list .box p {background:#fff;line-height:50px;font-size:18px;}

/** 제품상세페이지 **/
#sub #content .product_info {padding:50px 0;}
#sub #content .product_info .flexslider {width:550px;margin:0 auto}
#sub #content .product_info .right {width:100%;padding:30px 30px 0;position:relative;}
#sub #content .product_info .right h3 {margin-bottom:10px}
#sub #content .product_info .right .info {}
#sub #content .product_info .right .info table {border-bottom:1px #e0e0e0 solid;}
#sub #content .product_info .right .info table .red {background:#c80008;width:20%}
#sub #content .product_info .right .info table .gray {background:#aaaaaa;}
#sub #content .product_info .right .info table ul {width:100%;padding:10px 5px;display:inline-block}
#sub #content .product_info .right .info table ul li {float:left}
#sub #content .product_info .right .info table ul li.title {width:20%;font-weight:bold;background:url(images/li_bullet.gif) left center no-repeat;padding-left:10px}
#sub #content .product_info .right .info table ul li.txt {width:80%;}
#sub #content .product_info #carousel {/*position:absolute;bottom:0;width:470px*/ margin-top:10px}
#sub #content .product_info #carousel ul {margin:0 !important; padding:0 !important;}
#sub #content .product_info #carousel li {width:150px !important; margin-left:5px;}
#sub #content .product_info #carousel li:first-child {margin-left:0;}
#sub #content .product_info #carousel img {width:100% !important; display: block; opacity: 0.5; filter:alpha(opacity=50);  cursor: pointer;}
#sub #content .product_info #carousel img:hover {opacity: 1; filter:alpha(opacity=100); }
#sub #content .product_info #carousel .flex-active-slide img {opacity: 1; cursor: default;border:1px #e0e0e0 solid}
#sub #content .product_detail {width:100%;text-align:center;padding:60px 0}
#sub #content .product_detail h4 {margin-bottom:10px;}
#sub #content .product_detail h4 span {color:#808080;font-size:15px;margin-left:10px}
#sub #content .product_detail table.product {border:1px #e0e0e0 solid;font-size:14px;width:90%;margin:auto;text-align:justify;line-height:160%}
#sub #content .product_detail table.product .title {font-weight:bold;}
#sub #content .product_detail table.product td {padding:4px 10px}
#sub #content .product_detail table.product > tbody > tr > td {border-bottom:1px #e0e0e0 solid}
#sub #content .product_detail table.product > tbody > tr > td.title {border-right:1px #e0e0e0 solid}
#sub #content .product_common {width:100%; margin:auto;text-align:center;}
#sub #content .product_common .common1 {background:url(images/product_common1_bg.jpg) top center no-repeat;}
#sub #content .product_common .common2 {background:url(images/product_common2_bg.jpg) top center no-repeat;}
#sub #content .product_common .common3 {background:url(images/product_common3_bg.jpg) top center no-repeat;}
#sub #content .product_common .common4 {background:url(images/product_common4_bg.jpg) top center no-repeat;}
#sub #content .product_common .common5 {background:url(images/product_common5_bg.jpg) top center no-repeat;}


/* 자연보감(효능) */
#sub #content .nature1_2_bg {background:url(images/nature1_2_bg.jpg) top center; min-height:760px; }
#sub #content .nature3_top {width:100%; background:url(images/nature3.png) top center; min-height:160px;background-size:cover;}

#sub #content .board_box {width:600px;margin:90px auto;font-size:13px;min-height:500px}