@charset "UTF-8";

	#spNavHeader {
	
	background-color: #ffffff;
	}
	
	#spNavHeader h1 {
		margin: 0 auto;
		
		line-height: 0;
		text-align:center;
	}
	
	#spNavHeader img {
		width: 80%;
		
		height: auto;
	}
	#spNavHeader p img {
		width: 100%;
		
		height: auto;
	}
	
		
	#spMenuBtn {
		width: 17%;
		max-width: 110px;
		cursor: pointer;
		position: absolute;
		top: 15px;
		right: 2%;
		z-index: 2;
	}
	
	#spMenuBtn img {
		width: 100%;
		height: auto;
	}
	#black {
		display: none;
		width: 100%;
		height: 100%;
		background-color: #000000;
		opacity: 0.5;
		position: fixed;
		top: 0;
		z-index: 1;
	}
	
	#spNav {
		display: none;
		width: 96%;
		position: absolute;
		left: 2%;
		z-index: 2;
	}
	
	#spNavBtn {
		width: 100%;
		background-color: #C2C0B1;
		padding: 8px 0;
		position: relative;
	}
	
	#triangle {
		line-height: 0;
		position: absolute;
		top: -17px;
		right: 10px;
	}
	
	#spNavBtnInner {
		width: 96%;
		background-color: #ffffff;
		margin: 0 auto;
	}
	
	#spNavBtn ul {
		display: block;
		width: 100%;
		margin: 0 auto;
		padding-top: 10px;
	}
	
	#spNavBtn ul li {
		width: 95%;
		margin: 0 2% 10px;
		line-height: 0;
		float: left;
	}
	
	#spNavBtn ul li img {
		width: 100%;
		height: auto;
	}
	
	/*ボックス全体*/
	.accbox {
		margin: 2em 0;
		padding: 0;
	}
	
	/*ラベル*/
	.accbox label {
		display: block;
		margin: 1.5px 0;
		color :#ddd;
		transition: all 0.5s;

	}
	.accbox label img {
		width: 100%;
		height: auto;
	}
	
	.accbox label:hover {
		background :#ddd;
	}
	
	/*チェックは隠す*/
	.accbox input {
		display: none;
	}
	
	/*中身を非表示にしておく*/
	.accbox .accshow {
		height: 0;
		padding: 0;
		overflow: hidden;
		opacity: 0;
		transition: 0.8s;
	}
	
	/*クリックで中身表示*/
	.cssacc:checked + .accshow {
		height: auto;
		padding: 5px;
		opacity: 1;
	}
	.cssacc:checked + .accshow p{
		padding: 8px 8px;
		background-color:#ffff00;

		
	}	
	.cssacc:checked + .accshow p a{
		border-bottom:dotted 1px;
		
	}	
	

@media screen and (min-width: 769px) and (max-width: 979px) {


	
	#subNav {
		min-width: 360px;
		padding-top: 40px;
		float: right;
	}
	
	#subNav li {
		margin-left: 20px;
		line-height: 0;
		float: left;
	}
	


	#gloNav {
		display: block;
		position: absolute;
		top: 100px;
		left: 0;
		z-index: 100;
	}
	

	#spmainImg{
		display:none;
	}
	#mainTtl {
		width: 40%;
		max-width: 450px;
		line-height: 0;
		position: absolute;
		bottom:-30px;
		right: 17%;
	}
	


	
/*{　menu　}*/
	.menu {
	   margin: 0;
	   padding: 0;  
	}
	.menu li {
	   list-style: none;
	   font-weight:bold;
	   width: 100px;
	}
	.menu li a {
	   display: table;
	   margin-top: 1px;
	   width: 100%;
	   background: #fff;
	   text-decoration: none;
	   text-align: left;
	   color:#5B6F25;
	   overflow: hidden;
	}
	.menu li ul {
	   margin: 0;
	   padding: 0;
	}
	.menu li li a {
	   display: block;
	   margin-top: 0;
	   padding: 0 10px;
	   height: 0;
	   background: #ddd;
	   color: #333;
	}
	.menu > li:hover li a {
	   display: table;
	   margin-top: 1px;
	   padding: 20px 5px;
	   width: 100%;
	}
	.menu * {
	   -moz-transition: .5s;
	   -webkit-transition: .5s;
	   -o-transition: .5s;
	   -ms-transition: .5s;
	   transition: .5s;
	}
	
	/*サイドコンテンツ*/
	#contentsRight {
		float: right;
		height:550px;
		padding-right:5px;
		width: 10%;
		min-width:250px;
}

	
}
/*{　スマートフォン用CSS記述　}*/

@media screen and (max-width:768px)

{
	body{font-size: 3.5vw;}
	h1{ font-size::7.2vw;float:none;}
	h2{ font-size:6vw;}
	#header{display: none;}
	#contentsArea {
		width:95%;
		
	}
	#topic-path,#gloNav,#subMain,#banner02,#tabcontentsArea {
		display: none;
	}

	#spBanner {
		width: 96%;
		
		margin: 0 auto 10px;
		line-height: 0;
	}
	
	#spBanner img {
		width: 100%;
		height: auto;
	}
	
	.spNavClose {
		width: 96%;
		
		margin: 0 auto;
		padding-bottom: 10px;
		line-height: 0;
	}
	
	.spNavClose img {
		width: 100%;
		height: auto;
	}
	#main {
		width: 100%;
		height: auto;
		position: relative;
	}

	#mainContents {
	width: 100%;
	position: relative;
}
	#spmainImg img{
		max-width: 100%;

	}
	#main ul{
		display:none;
	}
	#mainTtl {
		position: absolute;left:-60px;
		bottom: 5%;
		height: auto;
		max-width:70%;

	}
	.topPage {
		background-color: #ffffff;
		padding-bottom: 85px;
	}
	
	.subPage {
		background-color: #faf7ee;
		padding-bottom: 100px;
	}

}