@charset "utf-8";
/*
 * Nanum Gothic (Korean) http://www.google.com/fonts/earlyaccess
 */
@import url('http://fonts.googleapis.com/earlyaccess/notosanskr.css');

/* HTML Reset */
header,footer,section,article,aside,nav,menu,details,figure,figcaption,hgroup{display:block;}
body,table,input,select,textarea,button,li,th,td{ font-size:100%; color:#515151;}
body {
	font-family: 'Noto Sans KR', sans-serif;
}
html, body {width:100%; max-width:640px; margin:0 auto; padding:0; position:relative; -webkit-text-size-adjust:none}
img,fieldset,iframe{border:0 none;}
body{margin:0 auto; padding:0; width:100%; position:relative; max-width:640px; -webkit-text-size-adjust}
*{-webkit-text-size-adjust}
a:link,a:visited {color:#515151; text-decoration:none;}
a:active,a:hover,a:focus {color:#515151; text-decoration:none;}
li{list-style:none;}
a, img { outline:none; temp:expression(this.hideFocus=true); border:none;}


.main_con{
	position:relative; 
	margin:0 auto; 
	padding:0; 
	width:100%; 
	clear:both; 
	max-width:640px;
}

/***************************
       로고
***************************/

.logo-box {
	background:#e0ddd4;
	height:76px;
	text-align:center;
}
.logo-box img {
	margin-top:9px;
}

/***************************
       메뉴
***************************/
.menu {
	border:1px solid #564c43;
	background:#564c43;
}
.menu ul {
	margin-left:4.5%;
}
.menu li {
	display:inline-block;
	padding:1% 5% 1% 5%;
}
.menu a {
	color:#fff;
	font-size:18px;
}


/***************************
       메인 컨텐츠
***************************/
.contents {
	text-align:center;
	background:#0e0a09;
}
.imgbox {
	text-align:center;
	margin-top:10px;
}
.img-pro {margin-right:32px;}



/** 하위 카테고리 - 서브메뉴 **/
.sub-menu ul {
	margin-left:-4%;
}
.sub-menu li {
	display:inline-block;
	padding:5px 0;
	text-align:center;
}
.sub-menu a {
	padding:1px 3px 1px 3px;
	border:1px solid #333;
}
.sub-menu a:hover {
	background:#333;
	color:#fff;
}

li.active a, li.active a:hover {
	background:#333333;
	color:#fff;
}


/** 인사말 **/
.sub-con {
	background:#0e0a09;
	border:1px solid #0e0a09;
	padding:20px;
}
.con-box {
	background:#fff;
	padding:20px;
}
.con-title {}
.con-title h1 {
	padding-left:20px;
	font-size:30px;
	color:#0e0a09;
	letter-spacing:-1.5px;
	font-weight:400;
}
span.font {
	font-size:14px;
	color:#564c43;
	letter-spacing:0px;
}
.con-title p {
	border-bottom:1px solid #564c43;
	margin-top:-25px;
}
.font02 {
	font-size:14px;
	letter-spacing:-1px;
	width:383px;
	display:inline-block;
	margin-bottom:40px;
}
.img01 {
	display:inline-block;
}

/** 오시는길 **/
.location img {
	width:100%;
}


/*********************************
          게시판 공통
*********************************/
.pagination {
	text-align:center;
	margin-top:30px;
}
.pagination ul {
    display: inline-block;
    padding: 0;
    margin: 0;
}

.pagination li {display: inline;}

.pagination li a {
    color: black;
	display: inline-block;
    padding: 8px 16px;
    text-decoration: none;
}

.pagination li a.active {
    background-color: #0e0a09;
    color: white;
}

.pagination li a:hover:not(.active) {background-color: #ddd;}


/* 게시판 버튼 */
.board-btn ul {
	width:100%;
	margin:0;
	padding:0;
	clear:both;
}
.board-btn li {
	margin:10px 0;
}
li.prev {
	width:50%;
	float:left;
}
.prev a {
	display:inline-block;
	border:1px solid #bbb;
	padding:5px 15px;
	background:#fff;
}
.prev a:hover, .next a:hover,
.del a:hover, .modi a:hover, .list a:hover {
	background:#bbb;
	color:#fff;
}
li.next {
	width:50%;
	float:left;
	text-align:right;
}
.next a {
	margin:0;
	display:inline-block;
	border:1px solid #bbb;
	padding:5px 15px;
	background:#fff;
}

.btn01 li {
	width:15%;
	float:right;
	text-align:right;
}

.del a {
	display:inline-block;
	border:1px solid #bbb;
	padding:5px 15px;
	background:#fff;
}
.modi a {
	display:inline-block;
	border:1px solid #bbb;
	padding:5px 15px;
	background:#fff;
}
.list a {
	display:inline-block;
	border:1px solid #bbb;
	padding:5px 15px;
	background:#fff;
}

/* write button */
.write a {
	display:inline;
	padding:1% 3%;
	background:#fff;
	border:1px solid #bbb;
}
.write a:hover {
	background:#bbb;
	color:#fff;
}


/***************************
       일반 게시판
***************************/

/* 리스트 페이지 */
.normal-board {
	margin:10% 0 5% 0;
	border-top:2px solid #333;
	border-bottom:2px solid #bbb;
	overflow:hidden;
}
.normal-board ul {
	margin:0;
	padding:0;
	overflow:hidden;
	position:relative;
}
.normal-board li {
	text-align:center;
	font-size:15px;
	border-bottom:1px dotted #bbb;
}
.board-head {
	border-bottom:1px solid #bbb !important;
}
.normal-board div {
	display:inline-block;
	padding:2% 0;
}
.col-nom {
	width:10%;
	overflow:hidden;
}
.col-title {
	width:43%;
	margin-left:1%;
	text-overflow:ellipsis;
	overflow:hidden;
	white-space:nowrap;
	word-wrap:break-word;
	-webkit-line-clamp:1;
	-webkit-box-orient:vertical;
}
.col-per {
	width:20%;
	overflow:hidden;
}
.col-date {
	width:20%;
	overflow:hidden;
}

.col-title a {
	max-width:55%;	
}

/* 답변 아이콘 */
span.reply {
	font-size:13px;
	margin:0 10px;
	color:crimson;
	font-weight:bold;
}

/* 뷰페이지 */
.bd-font {
	font-size:30px;
	border-bottom:1px solid #bbb;
	padding:10px 0;
	font-weight:bold;
}
.bd-con {
	margin:10% 0;
}


/***************************
       갤러리 게시판
***************************/
.gallery-list {
	margin:10% 0 5%;
}
.board {
	width:49%;
	border:1px solid #bbb;
	display:inline-block;
	vertical-align:top;
	margin:10px 0;
}
.gallery ul {
	list-style:none;
	padding:0;
	margin:0;
}
/*
.gallery img {
	width:100%;
	height:250px;
}
*/
.gallery li {
	background:#eee;
	font-size:15px;
}
li.gal-title {
	text-align:center;
	background:#fff;
	padding:10px;
	border-bottom:1px dotted #bbb;
	font-weight:bold;
}
li.gal-font {
	padding:5px 15px;
}

/* 뷰 페이지 */
.gallery-view, .board-view {
	border:1px dotted #bbb;	
}
.gallery-view ul, .board-view ul {
	list-style:none;
	padding:0;
	width:90%;
	margin:0 auto;
	font-size:15px;
}
.gallery-view img {
	width:100%;
}
.gallery-view li {
	margin-top:5%;
}
p.left {
	border:0;
	display:inline-block;
	width:20%;
	vertical-align:top;
}
p.right {
	border:0;
	display:inline-block;
	width:75%;
	vertical-align:top;
}
span.point {font-weight:bold;}



/* 글쓰기 페이지 */
.board-write, .board-delete {
	border:1px solid #bbb;
	padding:25px 10px 10px 10px;
}
.board-write ul {
	width:100%;
	margin:0;
	padding:0;
}

.board-write p {border:0;}
p.left2 {
	width:20%;
	text-align:right;
	display:inline-block;
	margin-right:1%;
	padding:5px;
	font-size:15px;
}
p.right2 {
	display:inline-block;
}

.board-write, .board-delete input {
	padding:5px;
}
.board-write textarea {
	width:400px;
	height:300px;
	vertical-align:top;
}

.write-btn {
	text-align:right;
	margin:0 auto;
	clear:both;
	width:50%;
	overflow:hidden;
	display:inline-block;
}
.write-btn2 {
	text-align:left;
	margin:0 auto;
	clear:both;
	width:45%;
	overflow:hidden;
	display:inline-block;
}
.board-write a, .board-delete a {
	margin:10px 0;
	font-size:13px;
	padding:5px 20px;
	display:inline-block;
	border:1px solid #bbb;
}
.board-write a:hover, .board-delete a:hover {
	background:#bbb;
	color:#fff;
}

/* 삭제 페이지 */
.board-delete ul {
	margin:0;
	padding:0;
}
.board-delete li {
	text-align:center;
}

li.test {
	text-align:right;
	margin:0 auto;
	clear:both;
	width:50%;
	overflow:hidden;
	display:inline-block;
}
li.test2 {
	text-align:left;
	margin:0 auto;
	clear:both;
	width:45%;
	overflow:hidden;
	display:inline-block;
}

/***************************
       푸터
***************************/
.ft-box {
	background:#564c43;
	padding:5px;
}
.ft-box p {
	text-align:center;
	color:#fff;
	font-weight:300;
}
.ft-box img {
	margin-top:20px;
	margin-right:15px;
}
.ft-box a {color:#fff;}



/***************************
       반응형 css
***************************/

@media only screen and (max-width: 640px) {
	.contents img {
		width:100%;
	}
    .ft-box img {
		margin-top:20px;
		margin-right:15px;
		width:15%;
	}
	/* menu */
	.menu {
		border:1px solid #564c43;
		background:#564c43;
	}
	.menu ul {
		margin-left:0%;
	}
	.menu li {
		display:inline-block;
		padding:0% 5% 0% 1%;
	}
	.menu a {
		color:#fff;
		font-size:13px;
	}
	.font02 {
		font-size:14px;
		letter-spacing:-1px;
		width:100%;
		display:inline-block;
		margin-bottom:40px;
	}
	/* sub */
	.sub-menu ul {
		margin-left:-10%;
	}
	.sub-menu a {
		font-size:10px;
	}
	.board {
		width:100%;
	}
	.pagination li a {
		color: black;
		display: inline-block;
		padding: 3px 5px;
		text-decoration: none;
		font-size:10px;
	}
	.btn01 li {
		width:25%;
		float:right;
		text-align:right;
	}
	.board-write textarea {
		width:220px;
		height:200px;
		vertical-align:top;
	}	
	.board-write input {width:200px;}
	.normal-board li {
		font-size:12px;
	}
	.normal-board .col-per {
		display:none;
	}
	/* 답변 아이콘 */
	span.reply {
		font-size:10px;
		margin:0 5px;
		color:crimson;
		font-weight:bold;
	}
	.bd-font {
		font-size:20px;
	}
	.board-btn {
		font-size:13px;
	}
	.col-nom {
		width:20%;
	}
	.col-title {
		width:50%;
	}
	.col-date {
		width:24%;
	}
}

@media only screen and (max-width: 400px) {
	.board-write textarea {
		width:200px;
		height:150px;
		vertical-align:top;
	}
}

@media only screen and (max-width: 375px) {
	/* sub */
	.sub-menu ul {
		margin-left:-14%;
	}
	.menu a {
		color:#fff;
		font-size:13px;
	}
	p.left {
		border:0;
		display:inline-block;
		width:30%;
		vertical-align:top;
	}
	p.right {
		width:65%;
	}
	.btn01 li {
		width:32%;
		float:right;
		text-align:right;
	}
	.board-write textarea {
		width:100%;
		height:200px;
		vertical-align:top;
	}
	.board-write input {width:130px;}

}