/*	Less Framework 4
	http://lessframework.com
	by Joni Korpi
	License: http://opensource.org/licenses/mit-license.php	*/

/* 共通のCSSここから */

body{
	width: 100%;
	background: #ebe6e1;
	color: #323232;
	font-family:"ＭＳ Ｐ明朝", "MS PMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", serif;
}

.h_bk{
	background: url(../img/header/img_bk_01.jpg) repeat-x top left;
	height: 0;
	padding-top: 1.25%;
	width: 100%;
}

a, a:visited{
	color: #323232;
}

/* 共通のCSSここまで */



/* 画面ワイド別CSS設定ここから */

/*		Default Layout: 880px.     */

@media only screen and (min-width: 769px) {
	body {
		width: 100%;
		color: rgb(60,60,60);
		-webkit-text-size-adjust: 100%; /* Stops Mobile Safari from auto-adjusting font-sizes */
	}
	
	header{
		background-color: #fff;
		padding-bottom: 32px;
	}

	#h_box{
		width: 770px;
		margin: 16px auto;
	}
	
	#h_box h1{
		text-align: center;
	}
	
	.menu_btn, .nav_close{
		display: none;
	}
	
	nav{
		width: 770px;
		margin: 22px auto;
		position: static !important;
		font-size: 1.4rem;
		overflow: visible !important;
		display: block !important;	
	}
	
	.nav_ul{
		height: 32px;
	}
		
	
	.nav_ul .menu_li{
		float: left;
		width: 152px;
		text-align: center;
	}

	.menu_li a{
		width: 100%;
	}
	
	.nav_ul .menu_li+ .menu_li{
		border-left: #349800 dashed 2px;
		
	}
	
	.menu_li_delete{
		border-left: transparent !important;
		padding-left: 2px;
	}
	
	.menu_li_left{
		border-left: #349800 dashed 2px;
	}
	
	.nav_ul .menu_li a{
		display: inline-block;
		padding: 2px 0;
	}
	
	.nav_ul .menu_li:hover{
		border: #349800 dashed 2px;
		border-radius: 4px;
		margin-top: -2px;
		padding-left: 2px;
	}
	
	.nav_ul .menu_li:hover:first-child{
		padding-right: 2px;
	}
	
	.nav_ul .menu_li_other{
		float: left;
		width: 152px;
		text-align: center;
		border-right: #349800 dashed 2px;
		padding-top: 2px;
		height:20px;
	}	
	
	.blog_access_menu, .menu_close{
		display: none;
	}
	
	.pc_menu_btn{
		overflow: hidden;
		width: 256px;
		margin: 0 auto;
	}
	
	.menu_btn_l, .menu_btn_r{
		width: 120px;
		float: left;
		margin-right: 16px;
	}
	
	.menu_btn_r{
		margin-right: 0;
	}
	
	/* footer CSSここから */
	
	footer{
		width: 100%;
		background-color: #fff;
		margin-top: 3rem;
		font-size: 1.2rem;
	}
	
	.top_back{
		width: 880px;
		margin: 0 auto;	
		text-align: right;	
	}
	
	.back_btn{
		cursor: pointer;
		width: 72px;
		height: 72px;
		margin-top: -40px !important;
	}
	
	#f_box{
		width: 880px;
		margin: 0 auto 3rem auto;
	}
	
	.f_box_in_01{
		padding-bottom: 1rem;
		overflow: hidden;
		border-bottom: #323232 dotted 2px;
	}
	
	.f_box_in_l{
		float: left;
	}
	
	.f_box_in_l img{
		width: 80%;
		padding-top: 10px;
	}
	
	.f_box_in_r{
		float: right;
		width: 350px;
		padding-top: 50px;
	}
	
	.f_box_in_r dd{
		float: left;
	}
	
	.f_box_in_r a{
		display: inline;
	}
	
	.f_box_in_02{
		margin: 1rem auto 0 auto;
		width: 880px;
		overflow: hidden;
	}
	
	.f_box_in_l{
		float: left;
	}
	
	.f_box_in_copyright{
		text-align: right;
		float: right;
	}
	
	.f_box_in_l br{
		display: none;
	}
	
	.f_bk{
		background: url(../img/header/img_bk_01.jpg) repeat-x top left;
		height: 8px;
		width: 100%;
	}
	
}



/*  Mobile Layout: 320px  */

@media only screen and (orientation : landscape) and (max-width: 768px) { /*横向きの際に適用*/
	
	nav{
		position: absolute;
		overflow: auto;
	}
	
	.toggle{
		display: none;
	}
	
}

@media only screen and (orientation : portrait) and (max-width: 768px) { /*縦向きの際に適用*/
	
	img{
		width: 100%;
	}
	
	.menu_portrait{
		height: 100%;
		overflow: hidden;
	}
	
	nav{
		position: absolute;
		overflow: hidden;
		background-color: rgba(0,0,0,0.3);
		height: 100%;
	}
	
}

@media only screen and (max-width: 768px) {
	
	header{
		background-color: #fff;
	}
	
	#h_box{
		width: 92.5%;
		margin: 0 auto;
		padding: 1rem 0 1rem 0;
		overflow: hidden;
		position: relative;
	}
	
	h1{
		width:60%;
		float: left;
	}
	.menu_btn, .nav_close{
		width:13%;
		float: right;
		cursor: pointer;
	}
	
	nav{
		display: none;
		font-size: 1.2rem;
		width: 100%;
	}
	
	nav > ul{
		background-color: #fff;
		width:100%;
	}
	
	nav ul .menu_li, .nav_close:nth-of-type(2), .menu_li_over, .menu_li_other{
		width: 70%;
		text-align: center;
		margin: 0 auto;
		padding: 1.2rem 0;
		border-bottom: #1b7d1b solid 1px;
		clear:both;
	}
	
	nav ul .menu_li:nth-child(5), nav ul .menu_li:nth-child(7){
		border-bottom: none;
	}

	nav ul .menu_li:nth-child(7) {
		cursor: pointer;
	}
	
	ul.blog_access_menu{
		overflow: hidden;
	}
	
	#blog_menu{
		float: left;
		width: 50%;
		padding:1.2rem 0;
		background-color: #e1a01e;
		color: #fff;
		text-align: center;
	}
	
	#access_menu{
		float: right;
		width: 50%;
		padding:1.2rem 0;
		background-color: #64aa32;
		color: #fff;
		text-align: center;
	}
	
	ul.blog_access_menu a:visited{
		color: #fff !important;
	}
	
	/* footer CSSここから */
	
	footer{
		width: 100%;
		background-color: #fff;
		margin-top: 6rem;
	}
	
	.top_back{
		width: 12.2%;
		margin: 0 auto;
		
	}
	
	#f_box{
		margin: 2rem 0;
	}
	
	.f_box_in_01{
		width: 70%;
		margin: 1rem auto 1rem auto;
	}
	
	.f_box_in_r{
		display: none;
	}
	
	.f_box_in_02{
		margin: 1rem auto;
		width: 92.5%;
	}
	
	.f_box_in_l, .f_box_in_copyright{
		text-align: center;
	}
	
	.f_bk{
		background: url(../img/header/img_bk_01.jpg) repeat-x top left;
		height: 0;
		padding-bottom: 1.25%;
	}
	
}
/* 画面ワイド別CSS設定ここまで */
