@import url('https://fonts.googleapis.com/css?family=Lato');
@import url(https://cdn.rawgit.com/openhiun/hangul/14c0f6faa2941116bb53001d6a7dcd5e82300c3f/nanumbarungothic.css);

*{margin:0; padding:0;}
body{font-size:14px; line-height:150%;
	 font-family: "Nanum Barun Gothic";
	 height:auto;}

a{text-decoration:none; color:#0c5640;}
li{list-style:none;}
img{border:0; vertical-align:middle;}
.fl{float:left;}
.fr{float:right;}
.cb:after{content:""; display:block; clear:both;}


.lato{font-family: 'Lato', sans-serif;}
.sectionOneGreen{color:#377b36;}

/* 시각장애인을 위한 웹 접근성 향상: 각 영역 소개 */
.forYou{margin-left:-99999px; height:0px;}


/* header 영역 스타일 시작 */
header{width:100%; height:290px; /*background:#0c5640purple;*/
background:url(../images/sub2_hd_bg.jpg) center center no-repeat;
background-size:cover;
margin:0 auto; position:relative;}
#headerWrap{width:100%; height:76px;
			margin:0 auto; position:fixed;
			z-index:10000;}
.headerBg{width:100%; height:76px;
					  background:rgba(12,86,64,0.9);
					  box-shadow:0px 1px 3px rgba(49,49,49,0.6);
					  margin-top:-70px;}
#headerWrap .wholeMenu{padding-right:16px; float:right; padding-top:22px;}
#headerWrap .exit{float:right; padding-top:13px; padding-right:1px;}
#headerWrap .perrierLogo{float:left; padding-top:10px; padding-left:10px;}
					   
/* nav 영역 스타일 시작 */
nav{width:100%; height:390px;
	background:rgba(12,86,64,0.9);
	text-align:center;
	position:fixed; /*top:70px;*/
	z-index:2;}
nav ul{padding-top:110px;}
nav ul li{color:#8ebd8e;}
nav ul li:nth-child(1){margin-bottom:28px;}
nav ul li:nth-child(2){margin-bottom:28px;}
nav ul li:nth-child(3){margin-bottom:28px;}
nav ul li a{color:#fff; font-family: 'Lato', sans-serif;
			font-size:1.8em; box-sizing:border-box;
			-webkit-box-sizing:border-box;
			-moz-box-sizing:border-box;}	
nav .navSub{display:none; color:#8ebd8e;}
nav .navSub a{font-family: "Nanum Barun Gothic";
			  font-size:1em;
			  color:#fff;}				   
nav hr{width:32px; border-top:2px solid #d7ede1;
			border-left:0; border-right:0; border-bottom:0;
			margin:0 auto; margin-bottom:10px;}	



#section_two h2.lato,#section_three h2.lato{font-size:1.9em;}

/* aside 영역 스타일 시작 */
aside{width:100%; text-align:center;
padding-top:90px;} /*padding-top값을 headerWrap 높이와 동일하게!*/
#asideWrap{width:92%; margin:0 auto;}
#asideWrap .asideText{color:#fff; padding-top:8px;
					  text-shadow:1px 1px 6px #444;}									
	.asideText h1{font-size:2em; padding:15px 0;}											
												
/* section 영역 스타일 시작 */
section{width:100%; height:/*600px*/auto;
		padding-top:12px;}

#sectionTitle{}
#sectionTitle p{padding-left:1.5%;}
#sectionTitle>hr{border-top:4px dotted #8ebd8e;
				 border-left:0px; border-right:0px;
				 border-bottom:0px;
				 width:97%; margin:0 auto;}
select{font-family: "Nanum Barun Gothic";
		width:168px; height:38px;
		font-weight:bold;
		font-size:0.9em;
		padding:8px 6px;
		border:1px solid #8ebd8e;
		color:#0c5640;
		margin-bottom:50px;
		margin-left:2%;}
.titleImage{margin-top:14px; padding-bottom:3px;}
.pageWay{font-size:0.85em; padding-bottom:10px;}
.pageWay,.pageWay a{color:#878a8f; }
.pageWay img{margin-top:-3px; margin-left:4px;
			 margin-right:4px;}
			 
#sectionTitle>hr{margin-top:6px; margin-bottom:6px;}
#sectionCon1,#sectionCon2,#sectionCon3,#sectionCon4,#sectionCon5{width:100%;
margin:0 auto; color:#474c55;}
.conWrap{text-align:center;}
#sectionCon5 .conWrap{padding-bottom:38px;}
#sectionCon5 .conWrap>img{margin:30px 0;}
#sectionCon5 .conWrap>.warning{margin-bottom:10px;}

.prodImg{margin-bottom:-6px;}

.prodNav{margin:0 auto;}

.prodNav>ul{width:90%; margin:0 auto;}
.prodNav2>ul,.prodNav3>ul,.prodNav4>ul{width:100%; margin:0 auto;}

.prodNav #menu li{width:33.33%; height:45px;
								line-height:45px; margin-bottom:16px;
								overflow:hidden; margin-left:0px;}
.prodNav #menu li:nth-child(1){margin-left:0%;}
.prodNav #menu li:nth-child(2){margin-left:-2%;}
.prodNav #menu li a{width:100%; height:45px; padding:11px;
								  color:#333;}
.prodNav #menu li a.on{background:#e4e5e6; font-weight:bold;}
.prodNav #menu li a:hover{cursor:pointer;}

.prodNav2,.prodNav3,.prodNav4{width:68%; margin:0 auto;}
.prodNav2 #menu li,.prodNav3 #menu li,.prodNav4 #menu li{width:50%;
height:45px; line-height:45px; margin-bottom:16px; overflow:hidden;}
.prodNav2 #menu li:nth-child(2){margin-left:-24px;}
.prodNav3 #menu li:nth-child(2){margin-left:-24px;}
.prodNav4 #menu li:nth-child(2){margin-left:-24px;}
.prodNav2 #menu li a{width:100%; height:45px; padding:11px;
								  color:#333;}
.prodNav3 #menu li a{width:100%; height:45px; padding:11px;
								  color:#333;}
.prodNav4 #menu li a{width:100%; height:45px; padding:11px;
								  color:#333;}								  
.prodNav2 #menu li a.on{background:#e4e5e6; font-weight:bold;}
.prodNav3 #menu li a.on{background:#e4e5e6; font-weight:bold;}
.prodNav4 #menu li a.on{background:#e4e5e6; font-weight:bold;}
.prodNav2 #menu li a:hover{cursor:pointer;}
.prodNav3 #menu li a:hover{cursor:pointer;}
.prodNav4 #menu li a:hover{cursor:pointer;}


.conWrap>.prodExp{width:90%; margin:0 auto;}
.prodInfo{width:100%; font-size:0.95em; text-align:left; 
				margin:16px 0; margin-top:28px; line-height:19px;}


#sectionCon1 ul,#sectionCon2 ul{text-align:center; padding-top:40px;}
#sectionCon3 ul,#sectionCon4 ul{text-align:center; padding-top:40px;}
#sectionCon1 ul li,#sectionCon2 ul li{margin-bottom:50px;}
#sectionCon3 ul li,#sectionCon4 ul li{margin-bottom:50px;}
#sectionCon1 ul li h2,#sectionCon2 ul li h2{margin:10px 0; color:#0c5640;}
#sectionCon3 ul li h2,#sectionCon4 ul li h2{margin:10px 0; color:#0c5640;}


#nutCheck{font-family: "Nanum Barun Gothic";
				  background-color:#0c5640;
				  padding:10px 10px;
				  color:#fff; font-weight:bold; border:none;
				  font-size:1em; letter-spacing:2px;
				  margin:22px 0; margin-bottom:5px;}
.nutFact{width:90%; margin:0 auto; font-size:0.9em; display:none;}
.nutFact .size{text-align:right; font-size:0.92em; padding-top:22px;
					  margin-bottom:-4px;}
.nutFact p{margin:2.5px 0;}

#nutCheck2,#nutCheck3,#nutCheck4{font-family: "Nanum Barun Gothic";
				  background-color:#0c5640;
				  padding:10px 10px;
				  color:#fff; font-weight:bold; border:none;
				  font-size:1em; letter-spacing:2px;
				  margin:22px 0; margin-bottom:5px;}
.nutFact2,.nutFact3,.nutFact4{width:90%; margin:0 auto; font-size:0.9em;}
.nutFact2 .size{text-align:right; font-size:0.92em; padding-top:22px;
					  margin-bottom:-4px;}
.nutFact3 .size	{text-align:right; font-size:0.92em; padding-top:22px;
					  margin-bottom:-4px;}
.nutFact4 .size	{text-align:right; font-size:0.92em; padding-top:22px;
					  margin-bottom:-4px;}						  
.nutFact2 p,.nutFact3 p,.nutFact4 p{margin:2.5px 0;}


.nutGreen{border-top:2px solid #0c5640;
				  border-left:none; border-right:none; border-bottom:none;
				  margin:6px 0;}

.nutTitle{}
.nutTitle{margin-bottom:10px;}
.nutGreen+.nutDetail{margin-top:10px;}
.nutDetail{text-align:left;}
.nutDetail~hr{border:0.5px solid lightgray;}

.according{font-size:0.95em; text-align:justify; padding-top:15px;}
				  
.globalCon{width:100%; height:auto; background:#ededed;
				  margin-top:40px; padding:30px 0; padding-bottom:0px;}
.globalCon h3{color:#0c5640;}
.globalCon ul{width:100%; margin:-18px 0;}
.globalCon ul li{width:50%;
						  padding:4px 8px; box-sizing:border-box;
						  -moz-box-sizing:border-box;
						  -webkit-box-sizing:border-box;}
.globalCon ul li h3{color:#0c5640; padding:6px 0;}
.globalCon ul li h3+p{font-size:0.9em; line-height:20px;}
.globalCon ul li a{color:#555;}
.globalCon ul li h5{color:#377b36;}						  

/* footer 영역 스타일 시작 */
footer{width:100%; text-align:center;
	   height:300px; background:purple;
	   padding-top:100px;
	   padding-bottom:20px;
	   box-sizing:border-box;
	   -webkit-box-sizing:border-box;
	   -moz-box-sizing:border-box;
	   background:url("../images/footerbg2.jpg") no-repeat center -30px;
	   background-size:cover;}
#footerWrap{width:93%; height:186px;
			background:rgba(12,86,64,0.7);
			margin:0 auto;
			box-sizing:border-box;
			-webkit-box-sizing:border-box;
			-moz-box-sizing:border-box;
			padding-top:20px;}
.footerSns{padding-bottom:10px;}
.footerSns p a:nth-child(1){margin-right:6px;}
.footerSns p a:nth-child(2){margin-right:6px;}
.footerSns p a:nth-child(3){margin-right:6px;}
span.footerGreen{color:#8ebd8e;}
#footerWrap p{color:#d7ede1; font-size:0.9em;}
#footerWrap p>a{color:#d7ede1; font-size:0.95em;}
#footerWrap p.copy{padding-top:26px;}


/* top버튼 스타일 시작 */
#topBtn{position:fixed; bottom:10px; right:10px;
		width:50px; height:50px; z-index:1000;}
#topBtn a{width:100%; height:100%;border-radius:25px;
		  background:rgba(12,86,64,0.9);
		  display:block; line-height:50px;
		  box-shadow:0px 1px 1px #444;}
#topBtn a:hover{background:rgba(12,86,64,1);}
#topBtn img{padding-left:11px; width:28px;}