@charset "utf-8";

body {
margin: 0;
background-image: url("images/canvas01.jpg");
font-family: 'メイリオ', 'Hiragino Kaku Gothic Pro', sans-serif
}


/* top h */
.site h1 a	{color: #000000;
	text-decoration: none}

.site h1	{margin: 0;
	font-size: 30px}

.site img	{border: none}

/* nabi*/
.nabi {
	margin-top: 15px;}

.nabi ul	{margin: 0;
	padding: 0;
	list-style: none}

.nabi li a	{display: block;
	padding: 10px 15px;
	color: #7b5544;
	font-size: 14px;
	text-decoration: none;
	font-weight: bold;}

.nabi li a:hover	{background-color: #fffff0;}

.nabi ul:after	{content: "";
	display: block;
	clear: both;}

.nabi li	{float: left;
	width: auto;}


/*info*/
.news	{padding: 20px;
	border: solid 2px #ffffff;
	background-color: #fffff0;
	opacity: 0.6;}

.news h1	{margin-top: 0;
	margin-bottom: 5px;
	font-size: 18px;
	color: #7b5544;}

.news ul	{margin: 0;
	padding: 0;
	list-style: none;}

.news li a	{display: block;
	padding: 5px;
	border-bottom: dotted 2px #dddddd;
	color: #000000;
	font-size: 14px;
	text-decoration: none;}

.news li a:hover	{background: #deb887;}

.news time	{color: #000000;
	font-weight: bold}

.news a:after	{content: "";
	display: block;
	clear: both;}

.news time	{float: left;
	width: 60px;}

.news .text	{float: none;
	width: auto;
	margin-left: 60px;}

/*SHARE*/
.share ul{
	margin: 0;
	padding: 0;
	list-style: none;}

.share li a{
	display: block;
	margin-bottom: 10px;
	padding: 10px;
	border-radius: 4px;
	color: #ffffff;
	font-size: 14px;
	text-decoration: none;}

.share li a:hover {
	opacity: 0.8;}

.share p {
	font-size: 18px;
	color: #7b5544;
	font-weight: bold;}

.share-tw{
	background-color: #63bafb;}

.share-fb{
	background-color: #5228f7;}

.share i {
	margin-right: 10px;
	font-size: 24px;
	vertical-align: middle;}

/*copyright*/

.copyright p {
	margin: 0;
	color: #666666;
	font-size: 14px;}

/* BOX6 */
.box6	{padding-top: 15px;
	padding-bottom: 15px;
	background-color: #deb887;
	opacity: 0.8;}



.boxA, .box4, .box5, .box6
	{padding-left: 15px;
	padding-right: 15px}



.boxA	{padding-top: 20px;
	padding-bottom: 10px}

.box4	{padding-top: 20px;
	padding-bottom: 20px}

.box4-1	{padding-bottom: 20px}


/*menu*/
.box5	{padding-top: 20px;
		padding-bottom: 20px}

.mn {text-align: center;}

.mn li{display: inline;
		list-style: none;
		background: #deb887;
		padding: 5px;
		margin-right: 5px;}

.menu ul a{color: #666666;
			font-size: 14px;
			text-decoration: none;
			border-radius: 4px;}

.menu li a:hover {opacity: 0.5;}

.menu-dr{
	background-color:#deb887;}

.menu-dr img{border-radius: 50%;
				height: 300px;
				width: 300px;}

.menu-fd img{border-radius: 50%;
				height: 300px;
				width: 300px;}

.menu-dt img{border-radius: 50%;
				height: 300px;
				width: 300px;}

.menu h1	{margin-top: 0;
	margin-bottom: 5px;
	font-size: 18px;
	color: #cd853f;}

.menu i {
	margin-right: 10px;
	font-size: 24px;
	vertical-align: middle;}
/* 768px */
@media (min-width: 768px) {

/* BOX1BOX2 */
.boxA:after	{content: "";
	display: block;
	clear: both}

.box1	{float: left;
	width: auto}

.box2	{float: right;
	width: auto}

/* BOX4-1BOX4-2 */
.box4:after	{content: "";
	display: block;
	clear: both}

.box4-1{float: left;
	width: 70%;
	padding-right: 35px;
	-moz-box-sizing: border-box;
	-webkit-box-sizing: border-box;
	box-sizing: border-box}

.box4-2	{float: left;
	width: 30%}



/* BOX6*/
.box6:after	{content: "";
	display: block;
	clear: both}



/* 1190px*/
@media (min-width: 1190px) {

/**/
.box3, .box4, .boxA-inner, .box5, .box6
	{width: 1140px;
	margin-left: auto;
	margin-right: auto}

/* BOX A*/
.boxA	{margin-bottom: 20px;
	border-bottom: solid 1px #deb887;}

}