@charset "utf-8";
/* ===================================================================

 file name  :responsive.css
 style info :共通のレスポンシブスタイル指定（ストラクチャ、ヘッダー、フッター）

=================================================================== */

/* ==========================================================================
   smartPhone
   ========================================================================== */
@media screen and (max-width: 640px){


	/* ---------------------------------------------------------------------------
	
			structure
				ストラクチャ：基本設定、リンクカラーなど
	
	--------------------------------------------------------------------------- */






	/* ---------------------------------------------------------------------------
			#wrapper
				全体
	--------------------------------------------------------------------------- */
	#wrapper{
		min-width:100%;
	}
	#wrapper img{
		width:100%;
		height:auto;
	}

	
	/* ---------------------------------------------------------------------------
			#header	
				ヘッダー
	--------------------------------------------------------------------------- */
	#header{
		border-top:solid 11px #614c3f;
	}
	#header .head-inner{
		width:100%;
		height:56px;
		margin:0 auto;
		padding:0 10px;
		position:relative;
	}
	/*#header .head-inner:before{
		content:"";
		display:block;
		width:111px;
		height:82px;
		background:url(../../images/common/img_head_sp.png);
		background-size:100% auto;
		position:absolute;
		top:-11px;
		left:0;
	}*/
#header .tonarie-group{
        left: 84px;
    }
#header .tonarie-group li{
        width: 80px;
        height: 13px;
        box-shadow:0 0 1px rgba(97, 76, 63, 0.4);
    }
#header .tonarie-group li + li{
        margin: 1px 0 0;
    }
#header .tonarie-group li:first-child{
        font-size: 10px;
        line-height: 13px;
    }
#header .tonarie-group li a{
        height: 13px;
    }
#header .tonarie-group li a img{
        width: auto;
        height: 8px;
        vertical-align: 3px;
    }

	#header #logo{
		width:69px;
		padding:6px 0 15px;
		position:absolute;
		top:-11px;
		left:15px;
	}
	#header #logo img{
		width:55px;
	}
	
	/* gnav */
	.gnav-wrap{
		width:100%;
		position:absolute;
		top:56px;
		left:0;
		background:#f7f5f0;
		z-index:1000;
		-webkit-box-sizing:border-box;
		box-sizing:border-box;
		max-height:0;
		overflow:hidden;
		-webkit-transition:all ease 0.3s;
		-moz-transition:all ease 0.3s;
		transition:all ease 0.3s;
	}
	.dialogIsOpen .gnav-wrap{
		max-height:410px;
	}
	#gnav {
		position:static;
		width:auto;
		padding:30px 15px 0;
	}
	#gnav ul{
		margin:0 0 9px;
		border-top:dashed 2px #d8d3c6;
	}
	#gnav li{
		float:left;
		width:50%;
		position:relative;
		padding:0;
		-webkit-box-sizing:border-box;
		box-sizing:border-box;
		border-bottom:dashed 2px #d8d3c6;
		border-right:dashed 2px #d8d3c6;
		background:#fff;
	}
	#gnav li:nth-child(odd){
		border-left:dashed 2px #d8d3c6;
	}
	#gnav li:before{
		content:none;
	}
	#gnav li:first-child:before{
		content:none;
	}
	#gnav li a{
		padding:7px 0;
	}
	#gnav li a img{
		width:auto;
		height:13px;
	}
	#gnav li a .gnav-txt{
		margin:4px 0 2px;
		font-size: 109%;
	}
	#gnav li a .gnav-cap{
		font-size:75%;
	}
	
	#header .pnav{
		position:static;
	}
	#header .pnav li{
		float:none;
		border-top:solid 1px #d8d3c6;
		text-align:center;
	}
	#header .pnav li:first-child{
		border:none;
	}
	#header .pnav li:before{
		content:none;
	}
	#header .pnav li a{
		display:block;
		padding:9px 0;
	}
	#header .pnav li a:hover{
		text-decoration:none;
	}
	#header .pnav #close{
		margin:0 -15px;
		padding:7px 0;
		background:#614c3f;
		color:#fff;
		border:none;
	}
	
	
	#header .facebook{
		width:29px;
		position:absolute;
		top:-11px;
		right:56px;
	}
	
	#menuBtn {
		position:absolute;
		top:17px;
		right:15px;
		display:block;
	}
	#menuBtn .menu-trigger,
	#menuBtn .menu-trigger span {
		display: inline-block;
		transition: all .4s;
		box-sizing: border-box;
	}
	#menuBtn .menu-trigger {
		position: relative;
		width: 25px;
		height: 19px;
	}
	#menuBtn .menu-trigger span {
		position: absolute;
		left: 0;
		width: 100%;
		height: 3px;
		background-color: #614c3f;
	}
	#menuBtn .menu-trigger span:nth-of-type(1) {
		top: 0;
	}
	#menuBtn .menu-trigger span:nth-of-type(2) {
		top: 8px;
	}
	#menuBtn .menu-trigger span:nth-of-type(3) {
		bottom: 0;
	}
	
	.dialogIsOpen #menuBtn .menu-trigger span:nth-of-type(1) {
		-webkit-transform: translateY(10px) rotate(-45deg);
		transform: translateY(8px) rotate(-45deg);
	}
	.dialogIsOpen #menuBtn .menu-trigger span:nth-of-type(2) {
		opacity: 0;
	}
	.dialogIsOpen #menuBtn .menu-trigger span:nth-of-type(3) {
		-webkit-transform: translateY(-10px) rotate(45deg);
		transform: translateY(-8px) rotate(45deg);
	}
	
	
	
	
	
	
	/* ---------------------------------------------------------------------------
			#content		
				コンテンツ
	--------------------------------------------------------------------------- */
	#content #pageHeader .pageInner{
		height:129px;
		background-size:auto 100%;
	}
	#content #pageHeader .pageInner h1{
		padding:36px 0 0;
		font-size:150%;
		color:#614c3f;
		text-align:center;
	}
	#content #pageHeader .pageInner h1 span{
		font-size:12px;
	}
	#content #pageHeader .pageInner h1 span:before{
		width:35px;
		height:1px;
		margin:6px auto 4px;
	}
	#content #pageHeader .pankuzu{
		width:auto;
		margin:0 auto 30px;
		padding:5px 15px 0;
		text-align:left;
		font-size:84%;
	}
	
	
	.cmnsec{
		margin:23px 0 0;
		padding:0 0 8%;
		background:url(../../images/common/bg_foot.png) no-repeat 50% bottom;
		background-size:150% auto;
	}
	.cmnsec h3{
		width:144px;
		height:0;
		position:absolute;
		top:10px;
		left:10px;
		right:auto;
		margin:0 auto;
	}
	.cmnsec #gmap{
		height:294px;
	}
	
	
	

	/* ---------------------------------------------------------------------------
			#main
				メイン
	--------------------------------------------------------------------------- */



	/* ---------------------------------------------------------------------------
			#footer
				フッター
	--------------------------------------------------------------------------- */
	#footer{
		padding:0;
		background:#fff;
	}
	#footer .foot-inner{
		width:100%;
		margin:0 auto;
		padding:0;
		position:relative;
	}
	#fnav{
		width:100%;
		margin:0 0 32px;
		position:static;
		right:0;
		border-top:solid 1px #d6d1c4;
	}
	#fnav li{
		width:50%;
		float:left;
		background:none;
		border-bottom:solid 1px #d6d1c4;
		-webkit-box-sizing:border-box;
		box-sizing:border-box;
	}
	#fnav li:nth-child(odd){
		border-right:solid 1px #d6d1c4;
	}
	#fnav li a{
		display:block;
		padding:1em 15px;
		font-size:107%;
	}
	
	#footer .foot-info{
		width:290px;
		margin:0 auto 7px;
	}
	#footer .foot-info .flogo{
		width:87px;
		float:left;
		margin:0 0 0 9px;
		padding:0 17px 0 0;
		border-right:solid 1px #cac4c0;
	}
	#footer .foot-info .address{
		width:174px;
		float:left;
		margin:0 0 0 17px;
		padding:3px 0 0;
		font-size:75%;
		color:#614c3f;
	}
	#footer .foot-info .address .info-txt{
		margin:0 0 5px;
		font-weight:bold;
	}
	#footer .foot-info .address dl dt{
		float:left;
	}
	#footer .foot-info .address dl a{
		color:#614c3f;
		text-decoration:none;
	}
	
	#footer .fpnav{
		position:static;
		margin:0 0 12px;
		text-align:center;
	}
	#footer .fpnav li{
		float:none;
		display:inline;
	}
	#footer .fpnav li:first-child:before{
		content:none;
	}
	#footer .fpnav li a{
		padding:0 10px;
		font-size:75%;
	}
	#footer .fpnav li a:hover{
		text-decoration:underline;
	}
	#footer .f-facebook{
		width:23px;
		margin:0 0 26px 22px;
	}
	
	#pagetop{
		width:36px;
		position:fixed;
		right:2%;
		bottom:50px;
	}
	
	#copyright{
		color:#fff;
		background:#614c3f;
	}
	#copyright small{
		width:100%;
		padding:5px;
		font-size:75%;
		text-align:center;
	}
	
	
	
	
}