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

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

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

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


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


	#wrapper img{
		width:100%;
		height:auto;
	}



	/* ---------------------------------------------------------------------------
			#wrapper
				全体
	--------------------------------------------------------------------------- */
	#wrapper{
		min-width:320px;
	}

	
	/* ---------------------------------------------------------------------------
			#header	
				ヘッダー
	--------------------------------------------------------------------------- */
	#header{
		border-bottom:none;
		min-width:100%;
	}
	#header .head-inner{
		width:100%;
		height:auto;
		padding:0;
	}
	#header .head-inner h1{
		display:none;
	}

	#header #hnav{
		position:static;
	}
	#header #hnav ul{
		display:table;
		width:100%;
	}
	#header #hnav ul li{
		display:table-cell;
		table-layout:fixed;
		float:none;
		text-align:center;
	}
	#header #hnav ul li img{
		max-width:64px;
	}
	#header #hnav ul li a{
		display:block;
	}
	#header #hnav ul .hnav-access a{
		background:#e9e9e9;
	}
	#header #hnav ul .hnav-request a{
		background:#deb4b4;
	}
	#header #hnav ul .hnav-reserve a{
		background:#dfd8b8;
	}
	#header #hnav ul .hnav-tel a{
		background:#c3f2d1;
	}
	#header #hnav ul #menubtn{
		background:#e9e9e9;
		display:block;
		cursor:pointer;
	}
	#header .head-inner .phone{
		display:none;
	}


	
	/* ---------------------------------------------------------------------------
			#content		
				コンテンツ
	--------------------------------------------------------------------------- */
	.content-wrap{
		width:100%;
	}
	
	#content{
		width:100%;
		padding:0;
		float:none;
	}

	#pageHeader{
		margin-bottom:24px;
	}
	#pageHeader .pankuzu{
		display:none;
	}
	.cmn-area {
		padding-top:30px;
	}
	.cmn-area ul{
		display:table;
		width:100%;
	}
	.cmn-area ul li{
		display:table-cell;
		table-layout:fixed;
		float:none;
	}
	.cmn-area ul li img{
		margin:-1px 0;
	}
	.page-caption{
		font-size:9px;
	}
	.content-pager{
		display:none !important;
	}



	/* ---------------------------------------------------------------------------
			#side		
				サイド
	--------------------------------------------------------------------------- */
	#side{
		width:100%;
		float:none;
		margin-right:0;
		position:relative;
	}
	#side #logo{
		width:225px;
		margin:0 auto;
		padding:25px 0;
	}
	#side #logo a{
		display:table;
		width:100%;
		color:#2b2b2b;
		text-decoration:none;
	}
	#side #logo img{
		display:table-cell;
		width:40px;
		vertical-align:middle;
	}
	#side #logo span{
		display:table-cell;
		font-size:16px;
		padding-left:22px;
		vertical-align:middle;
		text-indent:-0.5em;
	}
	
	
	
	#side h2{
		display:none;
	}
	#side #gnav{
		background:#FFF;
		position:absolute;
		top:0;
		width:100%;
		margin-bottom:0;
		z-index:999;
		display:none;
	}
	.dialogIsOpen #side #gnav{
		display:block;
		overflow:hidden;
		border-bottom:1px solid #a4a4a4;
	}
	#side #gnav ul{
		margin-left:-1px;
	}
	#side #gnav ul li{
		width:50%;
		float:left;
		border-left:1px solid #a4a4a4;
		border-top:1px solid #a4a4a4;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
	}
	#side #gnav ul li img{
		max-width:160px;
	}
	#side #gnav ul li a,
	#side #gnav ul li a:hover{
		background:#FFF;
		-webkit-transition:none;
		-moz-transition:none;
		transition:none;
	}
	#side #gnav ul li a{
		background:#FFF;
	}
	.index #side #gnav ul li.gnav-top a,
	.concept #side #gnav ul li.gnav-concept a,
	.landscape #side #gnav ul li.gnav-landscape a,
	.lifestyle #side #gnav ul li.gnav-lifestyle a,
	.model #side #gnav ul li.gnav-model a,
	.environment #side #gnav ul li.gnav-environment a,
	.security #side #gnav ul li.gnav-security a,
	.structure #side #gnav ul li.gnav-structure a,
	.maintenance #side #gnav ul li.gnav-maintenance a,
	.outline #side #gnav ul li.gnav-outline a{
		background:#f9ee3a;
	}


	#side .bnrs{
		display:none;
	}



	/* ---------------------------------------------------------------------------
			#main
				メイン
	--------------------------------------------------------------------------- */
	#main{
		padding:0 10px;
	}




	/* ---------------------------------------------------------------------------
			#footer
				フッター
	--------------------------------------------------------------------------- */
	#footer{
		padding:26px 0 0 0;
		font-size:10px;
	}
	#footer #pagetop{
		display:none !important;
	}
	#footer .foot-outer{
		min-width:100%;
		border-top:none;
	}
	#footer .foot-inner{
		width:100%;
		padding-left:0;
	}

	#footer .phone{
		width:192px;
		margin:0 auto;
	}
	#footer .toplink{
		margin:1.2em auto 2em;
		padding-right:6px;
	}
	#footer .toplink a:after{
		background-position:0 -10px;
		background-size:400px;
		width:3px;
		height:3px;
		margin-top:-2px;
	}
	#footer .toplink a:hover{
		text-decoration:none;
	}


	#footer #fnav{
		width:100%;
		font-size:10px;
		line-height:1.3;
		margin:0 0 15px 0;
		overflow:hidden;
		border-bottom:1px solid #d8d8d8;
	}
	#footer #fnav ul{
		margin-left:-1px;
	}

	#footer #fnav li{
		background:#f6f6f6;
		display:block;
		width:50%;
		float:left;
		border-top:1px solid #d8d8d8;
		border-left:1px solid #d8d8d8;
		-webkit-box-sizing:border-box;
		-moz-box-sizing:border-box;
		box-sizing:border-box;
	}
	#footer #fnav li:before,
	#footer #fnav li:last-child:after{
		content:none;
	}
	#footer #fnav li span{
		background:#f6f6f6;
		display:block;
		padding:1em 0;
	}
	#footer #fnav li a,
	#footer #fnav li a:hover{
		display:block;
		padding:1em 0;
		background:#f6f6f6;
		color:#010101;
		text-decoration:none;
	}
	
	#footer #fnav li.blank a{
		position:relative;
	}
	#footer #fnav li.blank a:after{
		content:'';
		background:url(../../images/common/icon.png) no-repeat 0 0;
		background-size:400px;
		width:10px;
		height:9px;
		display:inline-block;
		margin-left:0.5em;
	}
	
	.index #footer #fnav li.fnav-top a,
	.concept #footer #fnav li.fnav-concept a,
	.lifestyle #footer #fnav li.fnav-lifestyle a,
	.landscape #footer #fnav li.fnav-landscape a,
	.model #footer #fnav li.fnav-model a,
	.environment #footer #fnav li.fnav-environment a,
	.security #footer #fnav li.fnav-security a,
	.maintenance #footer #fnav li.fnav-maintenance a,
	.outline #footer #fnav li.fnav-outline a,
	.map #footer #fnav li.fnav-map a{
		background:#e8e8e8;
	}

	#footer .info{
		margin-bottom:0;
		line-height:1.5;
		font-size:10px;
	}
	#footer .info p{
			display:block;
			margin:0;
	}
	#footer .info .official{
		width:192px;
		margin:15px auto 24px;
	}

	#footer #copyright{
		min-width:100%;
	}

	#footer #copyright small{
		width:100%;
		padding:0.4em 0;
		font-size:10px;
	}
	
	
	
	
	
}


