<%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding="UTF-8"%>
<link href="/css/style.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="/css/style.min.css">
<script type="text/javascript" src="/js/tab.js"></script>
<link href="/js/font-awesome/css/font-awesome.min.css" rel="stylesheet">
<link href="/css/page.css?ver=1" rel="stylesheet">
<link href="/css/prettydropdowns.css" rel="stylesheet" type="text/css"><!-- sub navi select -->
<link href="/css/board_basic.css" rel="stylesheet"><!-- 게시판 -->
<link rel="icon" href="data:;base64,iVBORw0KGgo=">
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<%@ taglib uri="http://java.sun.com/jsp/jstl/functions" prefix="fn" %>
<!DOCTYPE html>
<html lang="ko">
<head>
<title>한국공예·디자인문화진흥원</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
<meta name="description" content="한국공예·디자인문화진흥원에 대한 정보를 제공합니다.">
<meta name="keywords" content="한국공예·디자인문화진흥원">
<meta name="viewport" content="width=device-width, initial-scale=1">
<script type="text/javascript" src="/js/tab.js"></script>
<link href="/css/style.css" rel="stylesheet">
<link rel="stylesheet" type="text/css" href="/css/style.min.css">
<link href="/js/font-awesome/css/font-awesome.min.css" rel="stylesheet">
<link href="/css/page.css" rel="stylesheet">

<link rel="stylesheet" href="/css/flexslider.css" type="text/css" media="screen" /><!-- 이미지슬라이드 -->
<script defer src="/js/jquery.flexslider.js"></script>
<link href="/css/index.css" rel="stylesheet">
<script type="text/javascript">
</script>
<style>
.btn{ background: none;}
.btn:hover {background:none;}
</style>
</head>
<body>
<section class="main">
		<!-- 메인비주얼 -->
		<!-- <div class="visual_txt"><img src="/img/index/visual_txt.png" alt="KCDF Korea Craft & Design Foundation"></div> -->
		<div id="slides" class="visual">
			<c:forEach var="result" items="${mainzoneList}" varStatus="status">
				<img alt="${result.content}" onerror="this.src='/images/no_img.jpg'" src='<c:url value='/cmm/fms/getImage.do'/>?atchFileId=<c:out value="${result.mainzoneImageFile}"/>'  />
			</c:forEach>
			<!-- <img src="/img/index/visual01.jpg" alt="main_img1">
			<img src="/img/index/visual02.jpg" alt="main_img2">
			<img src="/img/index/visual03.jpg" alt="main_img3"> -->
		</div>
		<script src="/js/jquery.slides.min.js"></script>
		<script type="text/javascript">
			document.body.style.background = "#323232";
			$('#slides').slidesjs({
				play: {
					active: true,
					auto: true,
					interval: 5000,
					navigation:false,
					swap: true,
					effect : "slide"
				},
				navigation: {
					active: true
				},
			});
		</script>
	</section>
</body>
</html>
