@CHARSET "UTF-8";

body {
	font-size: 14px;
}

/*********************** placeholder 영역 ***********************/
input:-ms-input-placeholder { color: #9b825f; } /*Internet Explorer 10 이상에 적용 */
input::-webkit-input-placeholder { color: #9b825f; } /* Webkit, Blink, Edge에 적용 */
input::-moz-placeholder { color: #9b825f; } /* Mozilla Firefox 4 부터 18에 적용 */
input::-moz-placeholder { color: #9b825f; } /* Mozilla Firefox 19 이상에 적용 */

/*********************** 공통 영역 ***********************/
.top_logo > .top_logo_inner, 
.search_area > .search_box, 
.menu_bar > .menu_bar_inner,
.main_content_search,
.bottom > .bottom_menu_bar {
	margin: 0 auto;
	max-width: 92%; 	
}

/*********************** 로고 영역 ***********************/
.top_logo {
	position: fixed;
	width: 100%;
	height: 44px; /* .top_logo > .top_logo_inner의 background-size height + background-position Y의 2배 */
	background-color: #9b825f;	
	z-index: 2;	
}

.top_logo > .top_logo_inner {
	height: 100%;
	background-image: url(/images/portal/casabelle/logo_casabelle.png);
	background-repeat: no-repeat;
	background-position: 50% 10px;
	background-size: 150px 24px; /* 원본 이미지는 200px 32px인데 25% 줄임 */	
}

/*********************** 검색 영역 ***********************/
.search_area {
	position: relative;
	display: block;	
	width: 100%;	
	height: 100%;
	padding: 20px 0;	
	
	background-color: #503e29;
	border: none;	
}

.search_area > .search_box {
	display: table;
		
	width: 100%;	
	/* height: 40px; */
	border: 2px solid #9b825f;
}

.search_area > .search_box > .left {
	display: none;
	
	padding: 0 10px;	
	vertical-align: middle;
	
	/*
	width: 152px;
	background: url(/images/portal/bar15.png) 162px 50% no-repeat;
	*/
	
	width: 80px;
	color: #fff;
	background-color: #9b825f;
}

.search_area > .search_box > .left > img {
	padding-bottom: 3px; /* 이유는 모르겠지만 이미지 상단에 간격이있어서 설정한다. */
}

.search_area > .search_box > .search {
	display: table;
	width: 100%;
	height: 44px;	
}

.search_area > .search_box > .search > .input_keyword {
	/*
	color: #fff;
	background-color: rgba(0,0,0,0);
	*/
	
	color: #503e29;
	background-color: #fff;
}

.search_area > .search_box > .search > .btn_search {
	background-color: #fff;
	background-image: url(/images/portal/casabelle/search.png);
	background-repeat: no-repeat;
	background-position: center;		
}


/*********************** 메뉴 영역 ***********************/
.menu_bar {
	position: relative;
	display: block;	
	width: 100%;	
	height: 100%;
	
	background-color: #503e29;
	border-top: 1px solid #9b825f;	
}

.menu_bar > .menu_bar_inner {
	position: relative;
	display: table;
	padding: 15px 0;	
	text-align: center;	
}

.menu_bar > .menu_bar_inner > li {
	position: relative;
	display: table-cell;
	padding: 0 10px;
	text-align: center;	
	background: url(/images/portal/bar15.png) 100% 50% no-repeat;
}	

.menu_bar > .menu_bar_inner > li:last-child {
	background: none;
}

.menu_bar > .menu_bar_inner > li > a {
	display: block;
	color: #fff;
	/* font-size: .95em; */
}


/*********************** main_content 영역 ***********************/
.main_content {
	position: relative;
	display: block;	
	width: 100%;	
	height: 100%;
	/* background-color: #9b825f; */
}

.main_content > .main_line1 {
	position: relative;
	display: table;
	width: 100%;	
	height: 100%;	
	text-align: center;	
}

.main_content > .main_line1 > img {
	display: table-cell;
	width: 100%;	
	float: left;
}


.main_content > .main_line2 {
	position: relative;
	/*
	display: table;
	width: 100%;	
	height: 100%;
	*/	
	margin: auto;
	text-align: center;	
	padding: 20px 0;
	
	background-color: #292018;
}

.main_content > .main_line2 > img {
	/*
	display: table-cell;
	width: 50%;	 
	*/
	margin: auto;
	
	width: 50%;
}


/*********************** 검색결과 영역 ***********************/
.main_content_search {
	position: relative;
	max-width: 80%;
}


/*********************** bottom 영역 ***********************/
.bottom {
	position: relative;
	display: block;	
	width: 100%;	
	height: 100%;
	background-color: #9b825f;
	font-size: .8em;
}

.bottom_menu_bar {
	position: relative;
	display: table;	
	padding: 15px 0;	
	text-align: center;	
}


.bottom_menu_bar > li {
	position: relative;
	display: table-cell;
	padding: 0 10px;
	text-align: center;	
	background: url(/images/portal/bar15.png) 100% 50% no-repeat;
	float: left;
}	

.bottom_menu_bar > li:last-child {
	background: none;
}

.bottom_menu_bar > li > a {
	display: block;
	color: #fff;
	/* font-size: .95em; */
}


.bottom_content {
	position: relative;
	display: block;		
	text-align: center;		
	color: #d6ccbf;
	font-size: .95em;
}

.bottom_content a {
	color: #d6ccbf;
}

.bottom_content div {
	padding-bottom: 2px;
}


.bottom_visitor {
	position: relative;
	display: block;	
	padding: 15px 0;	
	text-align: center;		
	color: #fff;
}



/*********************** 게시판 영역 ***********************/
div.top_banner {
	background-position-y: 0;
	height: 150px;
	background-color: #9b825f;
}

.btn_board {
	background-color: #9b825f;
}
	
ul.paging_area > li.sel {
	color: #9b825f;	
}	


/* Web */
@media all and (min-width: 1024px) {	

	/*********************** 공통 영역 ***********************/
	.top_logo > .top_logo_inner, 
	.search_area > .search_box, 
	.menu_bar > .menu_bar_inner,
	.main_content_search,
	.bottom > .bottom_menu_bar {
		margin: 0 auto;
		max-width: 75%; 	
	}
	
	/*********************** 검색 영역 ***********************/
	.search_area > .search_box {	
		width: 30%;	
	}
	
	.search_area > .search_box > .left {
		display: table-cell;
	}
	
	
	/*********************** 메뉴 영역 ***********************/
	.menu_bar > .menu_bar_inner > li {
		padding: 0 50px;
	}			
	
	
	/*********************** main_content 영역 ***********************/
	.main_content > .main_line1 > img {
		width: 50%;	
	}	

	.main_content > .main_line2 {
		padding: 65px 0;
	}
		
	.main_content > .main_line2 > img {
		width: auto;
	}
	

	/*********************** bottom 영역 ***********************/
	.bottom_menu_bar > li {
		padding: 0 20px;
	}		
}
