@charset "utf-8";

/* **************************************************** 0 to 479px ******************* */

.top-banner{
	margin:3px auto;
	width:100%;
	
}

/*//////////////////////////////////////////////////////////////////////////////////blog*/

#bf-box{
	width:100%;
}

#blog-box{
	width:99%;
	margin:3px auto 5px;
/*	line-height:1.2;*/
	background-color:#FFE8C0;
/*	padding-bottom:5px;*/
}

li.blog-title a:link{
	margin-left:0.5em;
	background:url(../img/common/blog-mark.png); 
	background-repeat:no-repeat;
	background-position:center left;
	padding-left:12px;
}

li.blog-date{
	margin:0 0 0 0.5em;
	font-size:80%;
	color:#999999;
	padding-left:12px;
	padding-bottom:0.5em;
	line-height:1.2;
}

div.title-bl{
	width:100%;
	color: #FFFFFF;
	background: #966731;
	background:-moz-linear-gradient(rgba(150,103,49,0.7), rgba(150,103,49,0.9) 50%);
	background:-webkit-gradient(linear, 100% 0%, 100% 50%, from(rgba(150,103,49,0.7)), to(rgba(150,103,49,0.9)));
	font-weight: normal;
	text-shadow:0 -1px 0 rgba(106,58,13,0.9);
	box-shadow: 0px 1px 1px rgba(255,255,255,0.3) inset;
	border:1px solid #6A3A0D;
	text-align:center;
	padding:5px 0;
	font-size:110%;
	letter-spacing:1em;
	text-indent:1em;
	margin-bottom:5px;
}


/*//////////////////////////////////////////////////////////////////////////////////facebook*/

#facebook-box{
	width:99%;
	margin:3px auto 5px;
	text-align:center;
	background-color:#E1E1F9;
	padding-bottom:0.5em;
}

div.fb-page{
	width:98%;
	margin:5px auto;
	padding-top:5px;
}

div.title-fb{
	width:100%;
	color: #FFFFFF;
	background: #305097;
	background:-moz-linear-gradient(rgba(30, 50, 97,0.7), rgba(30, 50, 97,0.9) 50%);
	background:-webkit-gradient(linear, 100% 0%, 100% 50%, from(rgba(30, 50, 97,0.7)), to(rgba(30, 50, 97,0.9)));
	font-weight: normal;
	text-shadow:0 -1px 0 rgba(106,58,13,0.9);
	box-shadow: 0px 1px 1px rgba(255,255,255,0.3) inset;
	border:1px solid #305097;
	text-align:center;
	padding:5px 0;
	font-size:110%;
	letter-spacing:1em;
	text-indent:1em;
	margin-bottom:5px;
}



@media only screen and (min-width: 600px) { /* *************************************** */



/* ** */}

@media only screen and (min-width: 960px) { /* *************************************** */

#bf-box{
	display:table;
	table-layout:fixed;
	width:100%;
}

#facebook-box,
#blog-box{
	display:table-cell;
	width:50%;
}





/* ** */}