@charset "utf-8";
/* CSS Document */

/*レイアウト*/
#container2{
	background:url(../img/a3.png);
	margin:0 auto;
	font-family:"はんなり明朝";
/*	font-family: mplus-1p-regular;*/
	}
#container{
	background:url(../img/background960-7.png) repeat;
	width:960px;
	margin:0 auto;
}
#contents{
	width:960px;
}
/*フォント*/
h1,h2,h3{
	color:#376a00;
	font-family:"はんなり明朝","ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
}
body{
	color:#808080;
	font-family: 'Philosopher', sans-serif;

}
/*トップ*/
#container #top{
	margin:0 40px 0 25px;
}

#top p{
	font-size:10px;
	color:#376a00;
	padding:0 0 10px 0;
}
#top p img{
	padding:0 0 70px 0;
}
#top .top_log{
	float:left;
}
#top .top_tel{
	float:right;
}
/*ナビ*/
#nav{
	padding-bottom:40px;
}
#nav ul{
	width:765px;
	margin:0 auto;
}
#nav ul li{
	height:40px;
	list-style:none;
	float:left;
	width:150px;
	text-align:center;
	border-right:dashed 2px #376a00;
	padding-top:10px;
}
#nav ul li:first-child{
	border-left:dashed 2px #376a00;
}
#nav ul li a{
	text-decoration:none;
	font-family: 'Philosopher', sans-serif;
	letter-spacing: 0.2em;
	color:#666;
	}
#nav ul a:hover{
	color:#309;
}
#nav ul .nav_1:hover,
#nav ul .nav_2:hover,
#nav ul .nav_3:hover,
#nav ul .nav_4:hover,
#nav ul .nav_5:hover{
	background:url(../img/navback.png);
}
/*l-side*/

#l_side .l_top{
	padding:0 0 0 50px;
}
#l_side{
	float:left;
	width:200px;
}
#l_side ul{
	padding:0 0 0 40px;
}
#l_side ul li{
	list-style:none;
	text-indent:-9999px;
	padding:15px 0 0 0;
	position:relative;
	s
}
#l_side ul li a{
	width:200px;
	height:100px;
}
#l_side ul .l_home{
	background:url(../img/hoem.png) no-repeat;
	height:30px;
	display:block;
}
#l_side ul .l_concept{
	background:url(../img/bar_concept.jpg) no-repeat;
	display:block;
}
#l_side ul .l_menu{
	background:url(../img/bar_menu.jpg) no-repeat;
	display:block;
}
#l_side ul .l_access{
	background:url(../img/bar_access.jpg) no-repeat;
	display:block;
}
#l_side ul .l_about{
	background:url(../img/bar_about.jpg) no-repeat;
	display:block;
}
#l_side ul .l_contact{
	background:url(../img/bar_contact.jpg) no-repeat;
	display:block;
}
#l_side ul .l_blog{
	background:url(../img/logo_diary.jpg) no-repeat;
	background-size:90% auto;
	width:170px;
	height:170px;
	margin:10px 0 0 20px;	
	display:block;
}
.archive{
/*    background:#369;
	   color:#FFF;
	  padding:5px 10px;
	 border-bottom:1px solid #FFF;*/
    cursor:pointer;
	width:200px;
	height:100px;
}
.subMenu li{
	width:100px;
	height:25px;
/* 	background-color:#fc0;	*/
/* 	padding:5px 10px;*/ 
/* 	border-bottom:1px solid #FFF;*/	
}
.subMenu .concept{
	background:url(../img/bar_concept_mini1.jpg) no-repeat;
	display:block;
}
.subMenu .kodawari{
	background:url(../img/bar_concept_mini.jpg) no-repeat;
	display:block;
}
.subMenu .tre{
	background:url(../img/bar_menu_tre.jpg) no-repeat;
	display:block;
}
.subMenu .less{
	background:url(../img/bar_menu_les.jpg) no-repeat;
	display:block;
}
.subMenu .cau{
	background:url(../img/bar_menu_cau.jpg) no-repeat;
	display:block;
}
.subMenu .room{
	background:url(../img/bar_access_room.jpg)no-repeat;
	display:block;
}
.subMenu .koutu{
	background:url(../img/bar_access_acc.jpg) no-repeat;
	display:block;
}
.subMenu .me{
	background:url(../img/bar_about_me.jpg) no-repeat;
	display:block;
}
.subMenu .kei{
	background:url(../img/bar_about_kei.jpg) no-repeat;
	display:block;
}
.subMenu .toi{
	background:url(../img/bar_contact_toi.jpg) no-repeat;
	display:block;
}
.subMenu .res{
	background:url(../img/bar_contact_res.jpg) no-repeat;
	display:block;
}

/*r-side*/
#r_side{
	float:right;
	width:700px;
	padding:40px 0 0 0;
	}
/*footer*/
#footer{
	width:960px;
	text-align:center;
	clear:both;
}
#footer .footer{
	margin:0 260px;
	padding:30px 0 0 0;
	font-size:12px;
	color:#235631;
	}
#footer .footer li {
	float:left;
	list-style:none;
	border-right:2px solid #033;
	padding:2px 10px 0;
	height:15px;
	
}
#footer .footer li:last-child{
	border-right:none;
}
#footer .footer a{
	text-decoration:none;
	color:#060;
}
#footer .footer a:hover{
	opacity:0.4;
}
#footer address{
	padding:5px 0 0 0;
	text-align:center;
}
.rt_top{
	float:right;
	margin:0 100px 0 0;
}
#top2{
	display:none;
}

/*===============================================
●smart.css  画面の横幅が640pxまで
===============================================*/
@media screen and (max-width:640px){
#container2{
	width:100%;				/*どのサイズでも横幅いっぱい,paddingする意味がないので削除*/
	}
#r_side{
	padding:0;
	margin:0;
}
#footer{
	width:100%;
	}
#footer .footer{
	width:100%;
	padding:10px 0 0 0;
	margin:0 50px;
}
#footer .footer li {
	padding:0 5px;
	margin:0;
	border-right:solid 1px;
}
#container{
	width:95%;	
	margin:0 auto;
	}
.scroll{
	display:none;
}
#top2{
	width:100%;
	display:block;
}
#top2 p{
	font-size:9px;
}
#top2 img{
	width:100%;
	height:auto;
}
#top{
	display:none;
}
#nav{
	padding:0 0 10px 0;
}
#nav ul{
	width:100%;
}
#nav ul li{
	float:left;
	width:30%;
	margin:10px 30px;
	border:none;
}
#nav ul li:first-child{
	border:none;
}
#nav ul .nav_1:hover,
#nav ul .nav_2:hover,
#nav ul .nav_3:hover,
#nav ul .nav_4:hover,
#nav ul .nav_5:hover{
	background:url(../img/navback.png) no-repeat;
	background-size:100%;
	background-position:bottom;
}
#l_side{
	display:none;
	clear:both;
}
#r_side{
	clear:both;
	width:100%;
	padding:0;
	margin:0;
}
#r_side h1{
	padding:0 ;
	width:80%;
}
#r_side dl{
	width:80%;
	padding:0;
	background:none;
}
#r_side dl dt,
#r_side dl dd{
	width:80%;
}
}
@media screen and (max-width:320px){
#top2{
	width:100%;
	display:block;
}
#top2 p{
	font-size:9px;
}
#top2 img{
	width:100%;
	height:auto;
}
#top{
	display:none;
}
#nav{
	padding:0 0 10px 0;
}
#nav ul{
	width:100%;
}
#nav ul li{
	float:left;
	width:20%;
	margin:5px 40px;
	border:none;
}
#nav ul li:first-child{
	border:none;
}
#nav ul .nav_1:hover,
#nav ul .nav_2:hover,
#nav ul .nav_3:hover,
#nav ul .nav_4:hover,
#nav ul .nav_5:hover{
	background:url(../img/navback.png) no-repeat;
	background-size:100%;
	background-position:center;
}
#l_side{
	display:none;
	clear:both;
}
#r_side{
	clear:both;
	width:100%;
	padding:0;
	margin:0;
}
#r_side h1{
	padding:0 ;
	width:80%;
}
#r_side dl{
	width:80%;
	padding:0;
	background:none;
}
#r_side dl dt,
#r_side dl dd{
	width:80%;
}
}
