/*
메인 css
Site : "농식품신유통연구원"
Author : "김주연"
Version : "2018.07"
*/

/* 비주얼영역 */
.visualWrap { position:relative; width:100%; height:500px; background:url("../images/content/img_visual.jpg") 50% 50% no-repeat;}
.visualTit { width:100%; height:203px; padding-top:109px; text-indent:-99999px; font-size:0; background:url("../images/content/bg_visualTit.png") 50% 100% no-repeat; background-size:800px;  }
.visualTit span { text-indent:-99999px; font-size:0; }
.snsList { position:absolute; width:100%; text-align:center; }
.snsList li { display:inline-block; width:42px; height:42px; margin-right:10px;  }
.snsList li a { display:block; width:100%; height:100%; text-indent:-99999; font-size:0; }
.snsList li:last-child { margin-right:0;  }
.snsList .facebook { background:url("../images/btn/icon_facebook.png") 0 0 no-repeat; }
.snsList .band {  background:url("../images/btn/icon_band.png") 0 0 no-repeat; }
.snsList .youtube { /* width:113px; */ background:url("../images/btn/icon_youtube.png") 0 0 no-repeat; }

/* 웹진 연구원소식 */
.section01 { overflow:hidden; padding-bottom:60px; }
.webzinWrap { float:left; width:48%; margin-right:4%; }
.webzinArea { width:100%; height:200px; background:url("../images/content/main_webzine02.png") 0 0 no-repeat; background-size:100% 100%; }
.webzinArea a { display:block; width:100%; height:100%; }
.webzinArea .tit { display:block; margin-left:30px; margin-bottom: 20px; padding-top:55px;  font-size:30px; font-weight:800; color:#202020; }
.webzinArea .txt { display:block; margin-left:30px; padding-top:3px; padding-bottom:15px; font-size:20px; color:#fff; font-weight:600; } 
.webzinArea .btn_wzView { width:98px; height:38px; margin-left:30px;  color:#fff; font-size:18px; font-weight:600; background-color:#23356d; }

.issueWrap { float:left; width:48%;  }
.issueList { width:100%; }
.issueList li {}
.issueList li a {overflow:hidden; display:block; width:100%; height:100%; }
.issueList .tit { float:left; display:block;  width:80%;  line-height:40px; white-space:nowrap; overflow:hidden; text-overflow: ellipsis; text-indent: 15px; background: url(../images/btn/bg_dotList01Li.png) 0px 17px no-repeat; }
.issueList .day { float:left; display:block; width:20%; line-height:40px; text-align:right; color:#808080; }

.tit_main { position:relative; overflow:hidden; width:100%; margin-top:22px; margin-bottom:20px; line-height:60px; box-sizing:border-box;  border-bottom:2px solid #2a2a2a;  font-size:26px; color:#2a2a2a; font-weight:bold; }
.tit_main .more { position:absolute; right:0; top:20px; overflow:hidden; width:20px; height:20px; background:url("../images/btn/main_more.png") 0 0  no-repeat; }
.tit_main .more a { display:block; width:100%; height:100%; text-indent:-99999px; font-size:0;  }

/* 신유통 사업소개 바로가기 */
.section02 { display:none; width:100%; background-color:#1e3e79; padding-bottom:60px; }
.section02 > .tit { width:100%; padding-top:30px; padding-bottom:30px; font-size:36px; font-weight:600; color:#fff; text-align:center; }
.subGnbList { overflow:hidden; width: 1060px; margin: 0 auto; }
.subGnbList li { float:left; width:14%; height:170px;  margin-right:7.5%; background:url("../images/btn/bg_subGnbList.png") 0 0 no-repeat; background-size:100%; }
.subGnbList li:last-child { margin-right:0%; }
.subGnbList li a { display:block; width:100%; height:100%; color:#1e3e79; font-size:20px; font-weight:600; text-align:center; line-height:220px; }
.subGnbList .li01 a { background:url("../images/btn/subGnbList01.png") 50% 23% no-repeat;  background-size: 32%; }
.subGnbList .li02 a { background:url("../images/btn/subGnbList02.png") 50% 23% no-repeat;  background-size: 50%; }
.subGnbList .li03 a { background:url("../images/btn/subGnbList03.png") 50% 23% no-repeat;  background-size: 42%; }
.subGnbList .li04 a { background:url("../images/btn/subGnbList04.png") 50% 23% no-repeat;  background-size: 39%; }
.subGnbList .li05 a { background:url("../images/btn/subGnbList05.png") 50% 23% no-repeat;  background-size: 32%; }

/* 신유통 라이브러리 */
.section03 {  width:100%; height:584px; 
background-color:#ddd;
background-image:url("../images/content/bg_section03_01.png"),url("../images/content/bg_section03_02.png");
background-position:-44px 0, 103% 50%;
background-repeat:no-repeat, no-repeat;

}

.section03 > .tit { width:100%; padding-top:30px; padding-bottom:30px; font-size:36px; font-weight:600; color:#2a2a2a; text-align:center; }
.libraryArea { width:100%; }
.libraryWrapList { overflow:hidden; text-align: center;}
.libraryWrapList > li {overflow:hidden; position: relative; /*  float:left; */ display:inline-block; width:16%; max-width: 168px; margin-right:4.5%;}
.libraryWrapList > li:last-child { margin-right:0%; }
.libraryWrapList li > .tit { position: absolute; top: 250px; width:100%; text-align:left;  }
.libraryWrapList li > .tit a {  font-size:19px; font-weight:800;}
.libraryList { width:100%; }
.libraryList li a { display:block; width:100%; height:100%; }
.libraryList .img a img { width:100%; box-sizing:border-box;  border:1px solid #c3c3c3; }
.libraryList .tit { width:100%; padding:20px 0 55px; }
.libraryList .tit a {  font-size:19px; font-weight:800; }
.libraryList .txt { width:100%; padding-top: 96px; padding-bottom:10px; }
.libraryList .txt a {  font-size:16px; font-weight:600; }
.libraryList .subTxt { width:100%; }
.libraryList .subTxt a {  font-size:15px; color:#808080; }
.train { width:300%; height:409px; }
.train > li { float:left; height:409px; }
.train_controller { overflow:hidden; position: absolute; top: 290px;}
.train_controller li { float:left; width:11px; height:11px; margin-right:10px; border-radius:50%; text-indent:-99999px; font-size:0; background-color:#a9a9a9; cursor: pointer; }
.train_controller li:hover, .train_controller li:focus, .train_controller li:active, .train_controller li.on { background-color:#25a125; }
.libraryList { float:left; width:168px; }
.libraryList li {text-align:left; }
.libraryList li.img { height:231px; }
.libraryList li.img img { height:100%; }

/* 관련사이트 */
.famliysite {overflow:hidden;  position:relative; border-top: 1px solid #a9a9a9; }
.famliysite .container { position:relative; }
.tunnel {overflow:hidden; width:1140px; margin: 0 auto;  padding:5px 0;  }
.siteList {overflow:hidden;  width:2400px; }
.siteList li { float:left; width:228px; height:57px; z-index:100;}
.siteList li a {display:block; text-align:center; }
.siteList li a img{ width:100%; }
.btnBannerPrev { position:absolute; top:5px; left:0; width:30px; height:60px; text-indent:-9999px; background:url("../images/btn/btn_banner_prev.png") 0 0 no-repeat; z-index:200; cursor:pointer; }
.btnBannerNext { position:absolute; top:5px; right:0; width:30px; height:60px; text-indent:-9999px; background:url("../images/btn/btn_banner_next.png") 0 0 no-repeat; z-index:200; cursor:pointer; }
	

@media ( max-width:1199px ){ 
	
	.container { width:96%; }
	.visualTit { background: url("../images/content/bg_visualTit.png") 50% 100% no-repeat; background-size: 600px;}
	.tit_main {margin-top: 16px; line-height: 55px; font-size: 22px;}
	.issueList .tit { width: 75%; font-weight: 600; }
	.issueList .day { width: 25%; font-size: 14px; }
	.section02 { display:block;}
	.section02 > .tit { font-size: 28px;}
	
	.section03 { background-size:450px, 300px; }
	
	.subGnbList li { width: 19%; height: 140px; margin-right: 1.25%; background: url("../images/btn/bg_subGnbList.png") 50% 50% no-repeat; background-size: 137px;}
	.subGnbList li a { font-size: 20px; line-height: 210px; }
	.subGnbList .li01 a { background: url("../images/btn/subGnbList01.png") 50% 29% no-repeat; background-size: 47px; }
	.subGnbList .li02 a { background: url("../images/btn/subGnbList02.png") 50% 29% no-repeat; background-size: 75px; }
	.subGnbList .li03 a { background: url("../images/btn/subGnbList03.png") 50% 29% no-repeat; background-size: 75px; }
	.subGnbList .li04 a { background: url("../images/btn/subGnbList04.png") 50% 29% no-repeat; background-size: 60px; }
	.subGnbList .li05 a { background: url("../images/btn/subGnbList05.png") 50% 29% no-repeat; background-size: 50px; }
	.section03 > .tit { font-size: 28px;}
	.libraryWrapList > li { width: 18.4%; max-width: 133px; margin-right: 1%; }
	.train > li { width: 33.333%; max-width: 133px; }
	.libraryList { width:100%; }
	.libraryWrapList li > .tit { top:200px; }
	.libraryWrapList li > .tit a { font-size: 16px; }
	.train_controller { top:235px; }
	.libraryList .txt { padding-top: 82px; }
	.libraryList .txt a { font-size: 14px; }
	.libraryList .subTxt a {font-size: 13px; }
	.subGnbList { width: 730px; }
	.libraryList li.img { height:182px; } 
	
	.tunnel { width:90%; }	
	.btnBannerPrev {  left:2%; }
	.btnBannerNext { right:2%; }
	
	
}
@media ( max-width:767px ){ 
	
	.visualWrap {height: 205px;background-size: 800px; }
	.visualTit { padding-top: 0px; background: url("../images/content/bg_visualTit.png") 50% 50% no-repeat; background-size: 90%; }
	.snsList { top:136px; } 
	.container { width: 92%; }
	.section01 { padding-bottom: 30px; }
	.section03 { background-position:-44px 0, 103% 70%; }
	.webzinWrap { width:100%; margin-right:0;  }
	.tit_main { margin-top: 5px; margin-bottom: 10px; line-height: 45px; font-size: 18px; }
	.tit_main .more { top:13px; }
	.issueWrap { width:100%; }
	.issueList .tit { font-size: 14px; line-height: 30px; background: url(../images/btn/bg_dotList01Li.png) 0px 13px no-repeat; }
	.issueList .day { font-size: 14px; line-height: 30px;}
	.section02 { padding-bottom: 30px; }
	.section02 > .tit { padding-top: 20px; padding-bottom: 20px; font-size: 18px; }
	.subGnbList { width: 80%; margin: 0 auto; }
	.subGnbList li { float:unset; width:100%; height: 75px; margin-right:0; margin-bottom:10px; background-color: #fff;}
	.subGnbList li a { line-height: 75px; text-indent: 33px;  }
	.subGnbList .li01 a { background: url("../images/btn/subGnbList01_mb.png") 25px 8px no-repeat; background-size: 60px; }
	.subGnbList .li02 a { background: url("../images/btn/subGnbList02_mb.png") 25px 8px no-repeat; background-size: 60px; }
	.subGnbList .li03 a { background: url("../images/btn/subGnbList03_mb.png") 25px 8px no-repeat; background-size: 60px; }
	.subGnbList .li04 a { background: url("../images/btn/subGnbList04_mb.png") 25px 8px no-repeat; background-size: 60px; }
	.subGnbList .li05 a { background: url("../images/btn/subGnbList05_mb.png") 25px 8px no-repeat; background-size: 60px; }
	.section03 { height:auto; padding-bottom: 0; }
	.section03 > .tit { padding-top: 20px; padding-bottom: 20px; font-size: 18px; }
	.section03 .container { width:95%; }
	.libraryWrapList > li { width: 49%; margin-right: 1%;}
	.train { height:370px; }
	.train > li { height:370px; }
	.webzinArea { position:relative; height:100px; }
	.webzinArea .tit { padding-top:20px; margin-left:20px; font-size:20px; }
	.webzinArea .btn_wzView { position: absolute; right: 20px; bottom: 20px; width: 80px; }
	
	.tunnel { width: 85%; }
}

@media ( max-width:530px ){
	
	.section03 { 
		background-image:url("../images/content/bg_section03_01.png"), url("../images/content/bg_section03_02.png"), url("../images/content/bg_section03_01.png");
		background-position:-44px 0, 103% 48%, -44px 100%;
		background-repeat:no-repeat, no-repeat, no-repeat;
		background-size: 290px, 248px, 320px;
		
		}
	.visualTit { background: url("../images/content/mb_bg_visualTit.png") 50% 36% no-repeat; background-size: 100%; }
	.snsList { top: 122px; }
	.tunnel { width: 71%; }
	
	.subGnbList li a { line-height: 75px; text-indent: 42%; text-align: left; }
	
	
}