﻿@charset "utf-8";

.col-1		{float:left;width:calc(33.333% - 40px);margin:20px;}
.col-2		{float:left;width:calc(66.66667% - 40px);margin:20px;}
.col-wrap {margin:0 -20px;}

section	{padding:50px 0;}
section .mtit-wrap .tit	{font-family:'TitilliumWeb';font-size:80px;font-weight:900;color:#ccc;line-height:1;margin-bottom:20px}
section .mtit-wrap .txt	{font-size:19px;color:#666;line-height:1.5;}
section .bx .tit	{font-size:27px;line-height:1.5;}
section .bx .txt	{font-size:17px;line-height:1.6;}

/* 메인 */
#main-visual			{position:relative;padding-top:250px;background:url(../img/mvbg.jpg) no-repeat 50% 100%;background-size:cover;height:880px;}
#main-visual .mv-pattern	{position:absolute;left:0;top:0;width:100%;height:100%;background-repeat:repeat;background-image:url(/resources/homepage/main/img/mvpattern02.png);}
#main-visual:before	{content:"";display:block;width:100%;height:50%;position:absolute;top:0;background:linear-gradient(rgba(0,0,0,0.4) 0%, transparent 100%);}
#main-visual:after	{content:"";display:block;width:100%;height:50%;position:absolute;bottom:0;background:linear-gradient(transparent 0%, rgba(0,0,0,0.2) 100%);}
#main-visual .mv-cont	{z-index:1;}
#main-visual .mtit .en	{font-family:'TitilliumWeb';color:#fff;font-size:50px;line-height:1.5;display:block;line-height:0.8;text-align:justify;width:500px;position:relative;}
#main-visual .mtit .txt	{color:#fff;font-size:19px;line-height:1.6;margin:20px 0 130px;}
#main-visual .mtit .en:after	{content:"";display:inline-block;width:100%;}

.mv-notice	{border-bottom:10px solid #FFCC00;border-right:10px solid #FFCC00;border-left:10px solid #FFCC00;padding:0 40px 20px;margin-top:130px;}
.mv-notice .tit	{float:left;width:180px;color:#FFCC00;font-size:26px;font-weight:500;}
.mv-notice ul	{float:left;width:calc(100% - 180px);height:34px;overflow:hidden;}
.mv-notice ul li	{position:relative;}
.mv-notice ul li a	{font-size:19px;color:#fff;line-height:45px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;}
.mv-notice ul .date	{font-size:13px;color:#fff;position:absolute;right:0;top:50%;transform:translateY(-50%);}

@media only screen and (max-width:1256px){/*960*/
	#main-visual			{padding-top:200px;height:750px;}
	#main-visual.natural-visual,
	#main-visual.bio-visual			{height:790px;}
	#main-visual .mtit .en	{font-size:44px;}
	.mv-notice		{margin-top:90px;}
	.mv-notice .tit	{width:140px;font-size:24px;}
	.mv-notice ul	{width:calc(100% - 140px);}
}
@media only screen and (max-width:1023px){/*720*/
	#main-visual	{padding:100px 0;height:auto;}
	#main-visual.natural-visual,
	#main-visual.bio-visual			{padding:70px 0 50px;height:auto;margin-top:0 !important;}
	#main-visual .mtit .en	{font-size:40px;width:450px;}
	#main-visual .mtit .txt	{font-size:18px;margin:20px 0 50px;}
	.mv-notice				{margin-top:70px;border-width:8px;}
	.mv-notice .tit			{width:100px;font-size:20px;}
	.mv-notice ul			{width:calc(100% - 100px);}
	.mv-notice ul li a		{line-height:unset;}
}
@media only screen and (max-width:767px){/*mobile-l*/
	#main-visual	{padding:60px 0;}	
	#main-visual.natural-visual,
	#main-visual.bio-visual			{padding:60px 0 30px;}
	#main-visual .mtit .en	{width:auto;font-size:34px;line-height:1.5;}
	#main-visual .mtit .en:after	{content:none;}
	#main-visual .mtit .txt	{margin-top:20px;font-size:16px;}
	.mv-cont	{padding:0 20px;}
	.mv-notice	{margin-top:50px;padding:0 15px 10px;}	
	.mv-notice .tit,
	.mv-notice ul li a	{font-size:17px;}
	.mv-notice ul .date	{display:none;}
}
@media only screen and (max-width:576px){/*mobile-s*/
	
}

#main-about	{background:url(../img/maimg.png) no-repeat -100px 10%;}
#main-about .mtit-wrap	{margin-top:60px;}

#main-about .bx	{margin:35px 0;}
#main-about .bx .txt-wrap	{position:relative;z-index:2;}
#main-about .bx .stit	{font-size:14px;color:#fff;margin-bottom:10px;}
#main-about .bx .tit	{color:#fff;font-weight:600;line-height:1.5;margin-bottom:20px;}
#main-about .bx .txt	{color:#fff;line-height:1.5;}
#main-about .mabx-wrap	{margin:-20px;}
#main-about .txt-wrap	{position:relative;z-index:2;}
#main-about .ma-bx1	{position:relative;height:auto;padding:0;margin:0;}

#main-about .ma-bx2	{position:relative;}
#main-about .ma-bx2:before	{content:"";display:block;width:475px;height:485px;position:absolute;bottom:0;right:0;background:url(../img/ma2_img.png) no-repeat;background-size:contain;z-index:1;}
#main-about .ma-bx3,
#main-about .ma-bx4	{float:left;width:calc(50% - 40px);margin:20px;}
#main-about .ma-bx1 .tit	{color:#fFFFCC;}

.ma-bx1 .bg1 a {display:block;background:url(../img/mabx_bg1.png) no-repeat;background-size:cover;padding:160px 40px 40px;}
.ma-bx1 .bg2 a {display:block;background:url(../img/business_field2.jpg) no-repeat;background-size:cover;padding:160px 40px 40px;}
.ma-bx1 .bg3 a {display:block;background:url(../img/business_field3.jpg) no-repeat;background-size:cover;padding:160px 40px 40px;}
.ma-bx1 .bg4 a {display:block;background:url(../img/business_field4.jpg) no-repeat;background-size:cover;padding:160px 40px 40px;}
.ma-bx1 .bg5 a {display:block;background:url(../img/business_field5.jpg) no-repeat;background-size:cover;padding:160px 40px 40px;}
.ma-bx2 a {display:block;background:url(../img/ma2_bg.png) repeat-x 100% 100%;padding:350px 40px 40px;height:563px;margin-bottom: 40px;}
.ma-bx3 a {display:block;background:url(../img/mabx_bg2.png) no-repeat;background-size:cover;height:200px;padding:40px;position:relative;-webkit-transform: perspective(1px) translateZ(0);transform: perspective(1px) translateZ(0);box-shadow: 0 0 1px rgba(0, 0, 0, 0);-webkit-transition-property: color;transition-property: color;-webkit-transition-duration: 0.3s;transition-duration: 0.3s;}
.ma-bx4 a {display:block;background:url(../img/mabx_bg3.png) no-repeat;background-size:cover;height:200px;padding:40px;position:relative;-webkit-transform: perspective(1px) translateZ(0);transform: perspective(1px) translateZ(0);box-shadow: 0 0 1px rgba(0, 0, 0, 0);-webkit-transition-property: color;transition-property: color;-webkit-transition-duration: 0.3s;transition-duration: 0.3s;}

.ma-bx3 a:before, .ma-bx4 a:before {content: "";position: absolute;z-index: -1;top: 0;left: 0;right: 0;bottom: 0;background: rgba(0,0,0,0.1);-webkit-transform: scaleX(0);transform: scaleX(0);-webkit-transform-origin: 0 50%;transform-origin: 0 50%;-webkit-transition-property: transform;transition-property: transform;-webkit-transition-duration: 0.3s;transition-duration: 0.3s;-webkit-transition-timing-function: ease-out;transition-timing-function: ease-out;}
.ma-bx3 a:hover:before, .ma-bx4 a:hover:before, 
.ma-bx3 a:focus:before, .ma-bx4 a:hover:before, 
.ma-bx3 a:active:before, .ma-bx4 a:hover:before  {-webkit-transform: scaleX(1);transform: scaleX(1);}

#main-about .ma-slide	{margin-top:80px;height:460px;position:relative;}
#main-about .slide-cont a {display:block;height:460px;position:relative;padding: 160px 40px 40px;}
#main-about .slide-cont a:before	{content:"";display:block;width:100%;height:50%;position:absolute;bottom:0;right:0;background:linear-gradient(transparent 0%, rgba(0,0,0,0.3) 100%);}
#main-about .ma-slide .control	{position:absolute;bottom:0;left:0;width:108px;height:54px;background:rgba(0,0,0,0.3);z-index:99;}
#main-about .ma-slide .control a	{position:relative;display:block;width:54px;height:54px;float:left;}
#main-about .ma-slide .control .prev:before,
#main-about .ma-slide .control .next:before	{content:"";position:absolute;left:50%;top:50%;display:block;width:12px;height:12px;border-right:2px solid #fff;border-bottom:2px solid #fff;}
#main-about .ma-slide .control .prev:before	{transform:translate(-50%, -50%) rotate(135deg);}
#main-about .ma-slide .control .next:before	{transform:translate(-50%, -50%) rotate(-45deg);}

#main-business	{background:url(../img/mb_bg.png);background-size:cover;padding:90px 20px;}
#main-business .mtit-wrap .tit	{color:#fff;text-align:center;}
#main-business .mtit-wrap .txt	{color:#fff;text-align:center;margin-bottom:40px;}
#main-business .bx	{display:block;text-align:center;padding:70px 50px;box-shadow:2px 2px 15px rgba(0,0,0,0.2);position:relative;}
#main-business .bx .ico	{display:block;width:160px;height:160px;margin:0 auto;}
#main-business .bx.mb-bx1 .ico	{background:url(../img/mbbx_ico1.png) no-repeat;background-size:contain;}
#main-business .bx.mb-bx2 .ico	{background:url(../img/mbbx_ico2.png) no-repeat;background-size:contain;}
#main-business .bx.mb-bx3 .ico	{background:url(../img/mbbx_ico3.png) no-repeat;background-size:contain;}
#main-business .bx .tit	{color:#fff;font-weight:600;margin:40px 0 20px;}
#main-business .bx .txt	{color:#fff;}
#main-business .mb-bx1	{background:url(../img/mbbx_bg1.png) no-repeat;background-size:cover;height:480px;}
#main-business .mb-bx2	{background:url(../img/mbbx_bg2.png) no-repeat;background-size:cover;height:480px;}
#main-business .mb-bx3	{background:url(../img/mbbx_bg3.png) no-repeat;background-size:cover;height:480px;}
#main-business .bx:hover	{transform:translate(-10px,-10px);transition:all 0.2s;}

#main-community	{background:url(../img/mc_img.png) no-repeat 95% -250px;}
#main-community .mtit-wrap 	{margin:50px 0 80px;}
#main-community .mc-news .tit	{font-size:31px;color:#333;line-height:1.5;margin-bottom:40px;}
#main-community .mc-news .point	{position:relative;}
#main-community .mc-news .point:after	{content:"";position:absolute;left:0;bottom:2px;height:20px;width:100%;background:rgba(68,153,178,0.2);}
.mc-news	{position:relative;}
.mc-news ul	{border-top:1px solid #333;border-bottom:1px solid #333;}
.mc-news ul li	{padding:20px 0;border-bottom:1px dashed #ccc;position:relative;color:#ccc;}
.mc-news ul li a	{font-size:19px;color:#333;line-height:1.5;padding-right:70px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:1;-webkit-box-orient:vertical;}
.mc-news ul li:last-child	{border:none;}
.mc-news ul li .date	{position:absolute;right:0;top:50%;transform:translateY(-50%);font-size:12px;color:#999;}
.mc-news .more	{position:absolute;top:70px;right:0;color:#4499B2;font-size:14px;}

/* .mc-sns	{position:relative;margin-top:50px;border:1px solid #ccc;}
.mc-sns a	{display:block;}
.mc-sns .thumb{position:relative;height:290px;z-index:1;overflow:unset;}
.mc-sns .thumb img{width:100%;height:290px;}
.mc-sns .sns-badge	{position:absolute;right:20px;top:270px;display:block;width:40px;height:40px;line-height:40px;border-radius:50%;text-align:center;z-index:4;}
.mc-sns .txt		{position:relative;line-height:1.5em;height:4.5em;overflow:hidden;text-overflow: ellipsis;margin-bottom:15px;color:#333;}
.mc-sns .date		{font-size:13px;color:#3F5C9A;position:relative;z-index:2;}
.mc-sns .subject	{position:relative;z-index:2;margin-top:10px;height:56px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;}
.mc-sns .desc		{position:relative;padding:30px;height:180px;overflow:hidden;}
.mc-sns .desc:after			{content:"";transform: translateY(180px);position:absolute;z-index:1;left:0;bottom:0;width:100%;height:100%;background:#0B3D91;transition: transform 0.3s cubic-bezier(0.165, 0.84, 0.44, 1)}
.mc-sns:hover .desc:after	{transform: translateY(0)}
.mc-sns a:hover .date,
.mc-sns a:hover .subject {color:#fff;} */

#mc-popup	{position:relative;height:470px;margin-top:115px;border:1px solid #ccc;overflow:hidden;}
#mc-popup a	{display:block;}
#mc-popup img	{height:470px;width:100%;}
#mc-popup li	{height:470px;}
#mc-popup li.noimg	{background:rgba(0,0,0,0.3);width:100%;height:470px;line-height:470px;text-align:center;}
#mc-popup li.noimg:before{content:"등록된 알림이 없습니다.";color:#fff}
#mc-popup .control	{position:absolute;bottom:0;right:0;background:rgba(0,0,0,0.4);}
#mc-popup .control a.prev,
#mc-popup .control a.next		{position:relative;float:left;display:block;width:54px;height:54px;line-height:54px;text-align:center;color:#fff;}
#mc-popup .control a.prev:before	{content:"\f104";font-family:FontAwesome;font-weight:900;}
#mc-popup .control a.next:before	{content:"\f105";font-family:FontAwesome;font-weight:900;}
#mc-popup .control a.prev:after	{content:"";position:absolute;top:50%;right:0;transform:translateY(-50%);display:inline-block;width:1px;height:10px;background:rgba(255,255,255,0.4);}
#mc-popup	.bx-controls	{display:none;}

.sns-badge:before		{content:"";font-family:FontAwesome;color:#fff;font-size:20px;font-weight:normal;vertical-align:top}
.sns-badge.ico-facebook	{background:#3F5C9A}
.sns-badge.ico-blog		{background:#3EB834}
.sns-badge.ico-instagram	{background:#B9368C}
.sns-badge.ico-youtube	{background:#ff0000}
.sns-badge.ico-facebook:before	{content:"f";font-family:Lato;font-weight:700;}
.sns-badge.ico-blog:before		{content:"b";font-family:Lato;font-weight:700;}
.sns-badge.ico-instagram:before	{content:"\f16d"}
.sns-badge.ico-youtube:before	{content:"\f16a"}

#main-community .mc-bnr	{padding:30px;background:#EFEFEF;position:relative;margin-top:40px;}
#main-community .mc-bnr .tit	{float:left;font-size:17px;color:#666;}
.mc-bnr .img-wrap	{float:right;width:250px;}
.mc-bnr .bnr-img a	{display:block;width:250px;height:70px;border:1px solid #ccc;background:#fff;position:relative;}
.mc-bnr .bnr-img a img	{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);height:40px;}
.mc-bnr .bx-controls	{position:absolute;bottom:30px;left:30px;}
.mc-bnr .bx-controls a {text-indent: -9999px;z-index: 9999;font-size: 0;}
.mc-bnr .bx-prev:before		{content:"\f104";font-family:FontAwesome;color:#999;font-size:20px;font-weight:900;vertical-align:middle;padding-right:15px;}
.mc-bnr .bx-prev:after	{content:"";display:inline-block;width:1px;height:13px;background:#ccc;vertical-align:middle;}
.mc-bnr .bx-next:before		{content:"\f105";font-family:FontAwesome;color:#999;font-size:20px;font-weight:900;vertical-align:middle;margin-left:15px;}


@media only screen and (max-width:1440px){ /*1200*/
	#main-about .col-1,
	#main-about .col-2	{float:none;width:100%;margin:0;}
	#main-about .mtit-wrap	{margin-top:0;}
	#main-about .mtit-wrap .va-pc	{display:none;}
	#main-about .ma-slide	{height:auto;}
	#main-about .slide-cont a	{height:auto;padding:40px 40px 100px;margin-top:40px;}
	#main-about .ma-bx2 a	{padding:40px 40px 100px;height:auto;margin:0;}
	#main-about .ma-bx2:before	{width:300px;height:306px;}
	.col-wrap	{margin:0;}

	#main-community .col-wrap	{margin:0 -20px;}
	#main-community .mc-bnr	{margin-top:20px;padding:20px 30px;}
	#main-community .mc-bnr .tit	{float:none;width:100%;margin-bottom:10px;}
	#main-community .mc-bnr .img-wrap	{float:none;width:100%;}
	.mc-bnr .bx-controls	{bottom:90px;left:280px;}
	.mc-bnr .bnr-img a	{width:100%;}
	
	#mc-popup	{margin-top:120px;}
}
@media only screen and (max-width:1256px){ /*960*/
	#main-business .col-1	{width:calc(33.333% - 20px);margin:10px;}
	#main-business .col-wrap	{margin:-10px;}
	#main-business .bx	{padding:40px;height:auto;min-height:400px;}
	#main-business .bx .ico	{width:120px;height:120px;}
	#main-business .bx .tit	{margin:20px 0 10px;}

	.mc-bnr .bx-controls	{display:none;}
}

@media only screen and (max-width:1023px){/*720*/
	section .mtit-wrap .tit	{font-size:60px;}
	section .mtit-wrap .txt	{font-size:17px;}
	#main-about .bx,
	#main-about .ma-slide	{margin:20px 0;}
	#main-about .mabx-wrap	{margin:-10px;}
	#main-about .ma-bx3, #main-about .ma-bx4	{width:calc(50% - 20px);margin:10px;}
	#main-about .ma-bx2:before	{width:250px;height:255px;}

	#main-business .col-wrap	{margin:0;}
	#main-business .col-1	{float:none;width:100%;margin:20px 0;}
	#main-business .bx		{min-height:auto;}
	#main-business .bx .ico	{position:absolute;top:50%;left:30px;transform:translateY(-50%);}
	#main-business .bx .tit,
	#main-business .bx .txt	{text-align:left;padding-left:150px;margin-top:0;}

	#main-community .col-1,
	#main-community .col-2	{float:none;width:100%;margin:0;}
	#main-community .mtit-wrap	{margin:0;}
	#main-community .mc-news .tit	{font-size:28px;margin-bottom:20px;}
	#mc-popup	{margin-top:20px;height:300px;}
	#mc-popup li	{height:300px;}
	#mc-popup li img	{height:300px;}
	#mc-popup li.noimg	{background:rgba(0,0,0,0.3);width:100%;height:300px;line-height:300px;text-align:center;}
	#mc-popup li.noimg:before{content:"등록된 알림이 없습니다.";color:#fff}
	.mc-news ul li	{padding:10px 0;}
	.mc-news ul li a	{font-size:17px;}
	.mc-news .more	{top:60px;}
	.mc-sns	{margin-top:20px;}
	.mc-sns .thumb	{float:left;width:290px;height:180px;}
	.mc-sns .thumb img	{height:180px;}
	.mc-sns .desc	{float:left;width:calc(100% - 290px);}
	.mc-sns:after	{content:"";display:block;width:100%;clear:both;float:none;}
	.mc-sns .sns-badge	{right:0;top:0;border-radius:0;}
	
}
@media only screen and (max-width:767px){/*mobile-l*/
	section	{padding:30px 20px;}
	section .mtit-wrap .tit	{font-size:50px;}
	section .bx .tit	{font-size:23px;}
	#main-about .bx .tit	{font-size:23px;margin-bottom:10px;}
	#main-about .slide-cont a,
	#main-about .ma-bx2 a	{padding:30px 30px 100px;}
	#main-about .ma-bx2:before	{width:200px;height:205px;}
	.mabx-wrap .bx a	{padding:30px;}

	#main-business	{padding:30px 20px;}
	#main-business .bx	{padding:30px;}
	#main-business .bx .ico	{width:80px;height:80px;}
	#main-business .bx .tit,
	#main-business .bx .txt	{padding-left:100px;}

	#main-community .col-wrap	{margin:0;}
	#main-community .mc-news .tit	{font-size:24px;}
	.mc-news .more	{top:10px;}
	
}
@media only screen and (max-width:576px){/*mobile-s*/
	#main-about .ma-bx2:before	{width:100px;height:102px;}
	.mc-news ul li a	{padding-right:0;}
	.mc-news ul li .date	{position:relative;transform:none;display:block;width:100%;}
	.mc-news .more	{position:relative;display:block;top:0;right:0;width:100%;text-align:center;background:#4499B2;color:#fff;padding:10px 0;margin-top:10px;}

	
	.mc-sns .thumb	{float:none;width:100%;}
	.mc-sns .desc	{float:none;width:100%;height:auto;}
}

@media only screen and (max-width:415px){/*mobile-xs*/
	section .mtit-wrap .tit	{font-size:40px;margin:10px 0 20px;}
	section .bx .txt	{font-size:16px;}
	#main-about .slide-cont a	{height:390px;}
	#main-about .ma-bx2	{margin-top:-10px;}
	#main-about .ma-bx3, #main-about .ma-bx4	{float:none;width:calc(100% - 20px);}

	#main-business	{padding:30px 20px;}
	#main-business .bx .ico	{display:none;}
	#main-business .bx .tit,
	#main-business .bx .txt	{padding-left:0;}
	
	.mabx-wrap .bx a	{height:auto;}
}


/* 천연물질, 바이오 공통 */
#main-visual .nv-cont	{margin:0 -20px;position:relative;z-index:1;}
#main-visual .top-left	{float:left;width:calc(66.666% - 40px);margin:20px;}
#main-visual .top-right	{float:left;width:calc(33.333% - 40px);margin:20px;}

.search-wrap	{border:5px solid #4F7128;background:rgba(0,0,0,0.2);position:relative;}
.search-wrap .search-category	{float:left;width:180px;position:relative;cursor:pointer;}
.search-wrap .search-category ul	{position:absolute;top:80px;width:100%;background:#fff;border-radius:5px;border:1px solid #4f7128;overflow:hidden;z-index: 9;}
.search-wrap .search-category .tit	{color:#fff;font-size:19px;text-align:center;position:relative;line-height:80px;}
.search-wrap .search-category li	{color:#333;font-size:16px;text-align:center;position:relative;padding:5px 0;}
.search-wrap .search-category li:hover	{background:#f7f7f7;}
.search-wrap .search-category .tit:after	{content:"\f107";font-family:FontAwesome;font-size:20px;color:#fff;font-weight:900;margin-left:25px;}
.search-wrap input	{width:calc(100% - 180px);height:80px;padding-right:80px;border:none;background:none;color:#fff;}
.search-wrap .ico_search		{display:block;position:absolute;right:0; text-align:center; font-size:20px;color:#fff; top:50%;right:30px;transform:translateY(-50%);}

#main-popup	{}
#main-popup	.bx		{position:absolute;bottom:0;right:0;width:calc(33.333% - 40px);margin:20px;height:250px;}
#main-popup li a	{display:block;width:100%;height:250px;}
#main-popup li img	{width:100%;height:250px;}
#main-popup li.noimg	{background:rgba(0,0,0,0.5);width:100%;height:250px;line-height:250px;text-align:center;}
#main-popup li.noimg:before{content:"등록된 알림이 없습니다.";color:#fff}
#main-popup .control	{position:absolute;bottom:0;background:rgba(0,0,0,0.4);}
#main-popup .control a.prev,
#main-popup .control a.next		{position:relative;float:left;display:block;width:54px;height:54px;line-height:54px;text-align:center;color:#fff;}
#main-popup .control a.prev:before	{content:"\f104";font-family:FontAwesome;font-weight:900;}
#main-popup .control a.next:before	{content:"\f105";font-family:FontAwesome;font-weight:900;}
#main-popup .control a.prev:after	{content:"";position:absolute;top:50%;right:0;transform:translateY(-50%);display:inline-block;width:1px;height:10px;background:rgba(255,255,255,0.4);}
/* #main-popup .control a.pause:before	{content:"\f04c";font-family:FontAwesome;font-weight:900;font-size:12px;}
#main-popup .control a.play:before	{content:"\f04b";font-family:FontAwesome;font-weight:900;font-size:12px;} */
#main-popup	.bx-controls	{display:none;}

.bank-cont .col-1		{height:300px;padding:40px;position:relative;}
.bank-cont .col-1 .tit	{font-size:27px;color:#fff;font-weight:600;margin-bottom:20px;line-height:1.4;}
.bank-cont .col-1 .txt	{font-size:16px;color:#fff;font-weight:300;line-height:1.6;}
.bank-cont .col-1 .mbtn	{display:inline-block;padding:10px 30px;font-size:15px;margin-top:50px;text-align:center;}

.bank-info	{padding:80px 0;}
.bank-info .stit	{font-size:13px;color:#80A2C5;letter-spacing:10px;}
.bank-info .tit	{font-size:32px;color:#fff;font-weight:600;margin-bottom:40px;line-height:1.2;}
.bank-info .txt	{font-size:17px;color:#fff;}

.main-banner		{position:relative;padding:50px 0;}
.main-banner ul		{height:60px;overflow:hidden;position:relative;z-index:2;}
.main-banner li		{float:left;width:20%;}
.main-banner li a	{display:block;margin:0 5px;border:1px solid #E7E7E7;position:relative;overflow:hidden;height:60px;}
.main-banner li a img	{max-width:90%;max-height:80%;position:absolute;top:50%;left:50%;transform:translate(-50%, -50%);}

#banner-control	{position:absolute;width:100%;height:100%;bottom:0;right:0;z-index:1;}
#banner-control a	{position:absolute;display:block;width:60px;height:60px;line-height:60px;text-align:center;color:#ccc;margin-left:1px;font-size:24px;}
#banner-control a.prev	{left:-60px;}
#banner-control a.next	{right:-60px;}
#banner-control a.prev:before	{content:"\f104";font-family:FontAwesome;font-weight:900;}
#banner-control a.next:before	{content:"\f105";font-family:FontAwesome;font-weight:900;}
/* #banner-control a.pause:before	{content:"\f04c";font-family:FontAwesome;font-weight:900;font-size:12px;}
#banner-control a.play:before	{content:"\f04b";font-family:FontAwesome;font-weight:900;font-size:12px;} */
#natural-bnr	.bx-controls	{display:none;}


/* 천연물질 메인 */
#main-visual.natural-visual			{background:url(../img/natural_mvbg.jpg) no-repeat 50% 0;background-size: cover;}
#main-visual.natural-visual .mtit .en:first-child:before	{content:"";background:url(../img/natural_mvimg.png) no-repeat;width:122px;height:110px;position:absolute;top:0;right:-90px;top:-60px;}
#natural-cont .col-1 .mbtn	{background:rgba(0,0,0,0.2);border:1px solid #BAB0AC;color:#fff;}
#natural-cont .col-1 .mbtn:hover	{background:rgba(0,0,0,0.3);color:#fff;transition:0.2s;}
/* #natural-cont .nature-bx1.col-1	a	{display:block;padding:40px;height:300px;background:url(../img/natural_mabg1.jpg) no-repeat;background-size:cover;} */
#natural-cont .nature-bx1	{background:url(../img/natural_mabg1.jpg) no-repeat;background-size:cover;}
#natural-cont .nature-bx1 .mbtn	{border-color:#C7D89E;color:#C9DBA0;}
#natural-cont .nature-bx2 {background:url(../img/natural_mabg2.jpg) no-repeat;background-size:cover;}
#natural-cont .nature-bx2 ul	{margin:-10px;}
#natural-cont .nature-bx2 ul li	{float:left;width:calc(50% - 20px);margin:10px;}
#natural-cont .nature-bx2 .mbtn	{display:block;padding:10px;}
#natural-cont .nature-bx3	{border:5px solid #ff9900;}
#natural-cont .nature-bx3 .tit	{color:#ff9900;}
#natural-cont .nature-bx3 .tit:nth-child(2)	{margin-bottom:0;}
#natural-cont .nature-bx3 .txt	{font-size:15px;color:#333;}
#natural-cont .nature-bx3:after	{content:"";display:block;width:280px;height:302px;position:absolute;bottom:-5px;right:-5px;background:url(../img/naturebx3_img.png) no-repeat;background-size:contain;z-index:1;}

#natural-info	{background:url(../img/natural_minfo_bg.jpg) no-repeat 50% 50%;background-size:cover;text-align:center;}
#natural-info li	{float:left;width:25%;}
#natural-info li .ltit	{font-size:27px;color:#fff;font-weight:500;}
#natural-info li .num	{font-size:30px;color:#FFCC00;line-height:1.2;}
#natural-info li .num span	{font-size:46px;color:#FFCC00;font-weight:600;}

/* 바이오 메인 */
#main-visual.bio-visual			{background:url(../img/bio_mvbg.jpg) no-repeat 50% 0;background-size: cover;}
#main-visual.bio-visual .mtit .en:first-child:before	{content:"";background:url(../img/bio_mvimg.png) no-repeat;width:122px;height:110px;position:absolute;top:0;right:-90px;top:-60px;}

.bio-visual .search-wrap			{border:5px solid #ff6600;background:rgba(0,0,0,0.2);position:relative;}
.bio-visual .search-wrap input	{width:100%;padding-left:10px;height:80px;border:none;background:none;color:#fff;}
.bio-visual .search-wrap input::placeholder	{color:rgba(255,255,255,0.7);font-size:18px;}

.bio-count	{background:rgba(32,43,53,0.4) url(../img/bio_ico_count.png) no-repeat 30px 50%;color:#fff;padding:30px 30px 30px 95px;position:relative;}
.bio-count .tit	{display:block;color:#fff;font-size:18px;width:120px;line-height:1.5;}
.bio-count .num	{color:#9B9EA3;font-size:30px;font-weight:700;position:absolute;right:30px;top:50%;transform:translateY(-50%);}
.bio-count em	{color:#FF9900;font-size:34px;font-weight:900;margin-left:5px;}

#bio-info	{background:url(../img/bio_minfo_bg.jpg) no-repeat 50% 50%;background-size:cover;text-align:center;padding:0;}
#bio-info a	{display:block;padding:80px 0;}

#bio-cont .col-1 .mbtn	{background:rgba(0,0,0,0.5);border:1px solid #9B9EA2;color:#fff;}
#bio-cont .col-1 .mbtn:hover	{background:rgba(0,0,0,0.7);color:#fff;transition:0.2s;}
#bio-cont .bio-bx1	{background:url(../img/bio_mabg1.jpg) no-repeat;background-size:cover;}
#bio-cont .bio-bx1 .mbtn	{border-color:#FEC47F;}
#bio-cont .bio-bx2 {background:url(../img/bio_mabg2.jpg) no-repeat;background-size:cover;}
#bio-cont .bio-bx2 .tit,
#bio-cont .bio-bx2 .txt	{color:#333;}
#bio-cont .bio-bx2 ul	{margin:-10px;}
#bio-cont .bio-bx2 ul li	{float:left;width:calc(50% - 20px);margin:10px;}
#bio-cont .bio-bx2 .mbtn	{display:block;padding:10px;}
#bio-cont .bio-bx3	{border:5px solid #367819;}
#bio-cont .bio-bx3 .tit	{color:#367819;}
#bio-cont .bio-bx3 .tit:nth-child(2)	{margin-bottom:0;}
#bio-cont .bio-bx3 .txt	{color:#333;font-size:15px;line-height:1.7;}
#bio-cont .bio-bx3:after	{content:"";display:block;width:175px;height:250px;position:absolute;bottom:-5px;right:10px;background:url(../img/biobx3_img.png) no-repeat;background-size:contain;z-index:1;}


@media only screen and (max-width:1440px){ /*1200*/
	.bank-cont .mbtn	{width:100%;}
	#natural-cont .nature-bx3:after	{width:240px;height:260px;z-index:-1;}	
	#natural-cont .nature-bx2 ul li, #bio-cont .bio-bx2 ul li	{width:100%;margin:0;}
	#natural-cont .nature-bx2 ul li:nth-child(2) .mbtn, #bio-cont .bio-bx2 ul li:nth-child(2) .mbtn	{margin-top:5px;}
	
	.bio-count .tit	{width:100%;}
	.bio-count .num	{position:relative;top:0;right:0;transform:none;}
	#bio-cont .bio-bx3:after	{width:130px;height:186px;z-index:-1;}	
	
	

	
}
@media only screen and (max-width:1256px){ /*960*/
	.bank-cont .col-1	{width:calc(33.333% - 20px);margin:10px;padding:30px;height:auto;min-height:290px;}
	.bank-cont .col-1 .mbtn	{margin-top:30px;}	
	#natural-cont .nature-bx3 .tit,
	#bio-cont .bio-bx3 .tit	{margin-bottom:10px;}
	#natural-cont .nature-bx3:after	{width:150px;height:162px;}
	#natural-info li .ltit	{font-size:24px;}
	#natural-info li .num span	{font-size:42px;}
	#bio-cont .bio-bx3:after	{right:0;width:110px;height:157px;}
}
@media only screen and (max-width:1023px){/*720*/
	#main-visual .nv-cont	{margin:0;}
	#main-visual .top-left	{float:none;width:100%;margin:0;}
	#main-visual .top-right	{float:none;width:100%;margin:0;}
	#main-popup .bx	{position:relative;width:100%;margin:20px 0 0;}

	.bank-cont .col-1	{float:none;width:100%;margin:0 0 20px 0;min-height:auto;}
	.bank-cont .col-1 .tit	{margin-bottom:5px;}
	.bank-cont .col-1 .txt	{padding-right:200px;}
	.bank-cont .col-1 .mbtn	{position:absolute;right:30px;top:50%;transform:translateY(-50%);margin:0;}
	.bank-cont .va-pc	{display:none;}
	.bank-cont .mbtn	{width:auto;}
	.col-wrap .col-1:last-child	{margin-bottom:0;}
	
	#natural-cont .nature-bx1.col-1	a	{min-height:auto;}
	#natural-cont .nature-bx3 .tit	{display:inline-block;margin:0 15px 10px 0;}
	#natural-cont .nature-bx3 .tit:nth-child(2)	{margin-right:0;}

	.bio-count	{margin-top:20px;}
	.bio-count .tit	{width:120px;}
	.bio-count .num	{position:absolute;right:30px;top:50%;transform:translateY(-50%);}

	#natural-cont .nature-bx2 ul, #bio-cont .bio-bx2 ul	{position:absolute;right:30px;top:50%;transform:translateY(-50%);margin:0;}
	#natural-cont .nature-bx2 ul li, #bio-cont .bio-bx2 ul li	{float:none;}
	#natural-cont .nature-bx2 ul li .mbtn, #bio-cont .bio-bx2 ul li .mbtn	{position:relative;right:0;top:0;transform:none;}

	#bio-cont .bio-bx3 .tit	{display:inline-block;margin:0 15px 10px 0;}
	#bio-cont .bio-bx3 .tit:nth-child(2)	{margin-right:0;}
	#bio-cont .bio-bx3:after	{right:30px;}
}
@media only screen and (max-width:767px){/*mobile-l*/	
	.search-wrap .search-category	{width:140px;}
	.search-wrap input	{width:calc(100% - 140px);height:65px;padding-right:70px;}
	.search-wrap .search-category .tit	{line-height:65px;}
	.bio-visual .search-wrap input	{height:65px;}
	
	#main-visual .mtit .en:first-child:before	{left:200px !important;top:-40px !important;}

	#main-visual .nv-cont	{padding:0 20px;}
	.bank-info,	#bio-info a{padding:50px 20px;}
	.bank-info .stit	{letter-spacing:2px;}
	.bank-info .tit	{font-size:28px;margin-bottom:20px;}

	#natural-info li	{width:50%;}
	#natural-info li:nth-child(1),
	#natural-info li:nth-child(2){margin-bottom:20px;}
	#natural-info li .ltit	{font-size:20px;}
	#natural-info li .num 	{font-size:28px;}
	#natural-info li .num span	{font-size:40px;}

	.main-banner	{padding:30px 20px;}
	.main-banner li	{width:50%;}
}
@media only screen and (max-width:576px){/*mobile-s*/
	.search-wrap .search-category	{width:120px;}
	.search-wrap input	{width:calc(100% - 120px);padding-right:60px;}
	.search-wrap .ico_search	{right:20px;}
	.bank-cont .col-1	{text-align:center;}
	.bank-cont .col-1 .txt	{padding-right:0;}
	.bank-cont .col-1 .mbtn	{position:relative;width:100%;right:0;top:0;transform:none;margin-top:10px;}
	
	.main-banner li	{width:100%;}	

	.bio-count	{padding:20px 20px 20px 85px;background-position:20px 50%;}

	#bio-cont .col-1	{min-height:auto;}
	#bio-cont .mbtn	{width:auto;}
	#natural-cont .nature-bx2 ul li .mbtn, #bio-cont .bio-bx2 ul li .mbtn	{padding:10px 15px;}
	#natural-cont .nature-bx2 ul, #bio-cont .bio-bx2 ul	{position:relative;right:0;top:0;transform:none;}
	#natural-cont .nature-bx2 ul li, #bio-cont .bio-bx2 ul li	{float:left;width:calc(50% - 10px);margin:5px;}
	#natural-cont .nature-bx2 ul li:nth-child(2) .mbtn,	#bio-cont .bio-bx2 ul li:nth-child(2) .mbtn	{margin-top:10px;}
	#bio-cont .bio-bx3:after	{display:none;}
}
@media only screen and (max-width:415px){/*mobile-xs*/
	.search-wrap .search-category	{width:100px;}
	.search-wrap .search-category .tit	{font-size:17px;}
	.search-wrap .search-category .tit:after	{margin-left:10px;}
	.search-wrap input	{width:calc(100% - 100px);}	
	
	#natural-cont .nature-bx3 .tit,	#bio-cont .bio-bx3 .tit	{display:block;margin:0;}
	#natural-cont .nature-bx3 .tit:nth-child(2), #bio-cont .bio-bx3 .tit:nth-child(2){margin-bottom:10px;}
	#natural-cont .nature-bx3:after	{display:none;}
	#natural-info li .ltit	{font-size:18px;}
	#natural-info li .num 	{font-size:24px;}
	#natural-info li .num span	{font-size:36px;}

	.bio-count	{padding:20px 20px 20px 90px;position:relative;}
	.bio-count .tit	{width:100%;}
	.bio-count .num	{position:relative;top:0;right:0;transform:none;}

	#bio-cont .bio-bx3 .va-pc	{display:block;}
}

@media only screen and (max-width:320px){/*mobile-xxs*/
	.search-wrap .search-category	{width:70px;}
	.search-wrap .search-category .tit	{font-size:16px;}
	.search-wrap input	{width:calc(100% - 70px);}
	
}
