@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{
		padding:12px 0;
		height:57px;
		background:rgba(255,255,255,1);
	}
	
	#header.fixed{
		width:100%;
		padding:12px 0;
		height:57px;
		background:rgba(255,255,255,1);
	}

	#header .head-inner{
		position:relative;
		width:auto;
		margin:0 auto;
		padding:0 10px;
	}
	#header .head-inner #logo{
		width:180px;
		height:33px;
	}
	
	#gnav{
		position:absolute;
		width:100%;
		max-height:0;
		left:0;
		right:0;
		top:45px;
		z-index:10000;
		overflow:hidden;
		-webkit-transition:all ease 0.3s;
		-moz-transition:all ease 0.3s;
		transition:all ease 0.3s;
	}
	.dialogIsOpen #gnav{
		max-height:500px;
		background-color:rgba(255,255,255,0.7);
}
	#gnav ul{
		border-top:solid 1px #bebebe;
	}
	#gnav li{
		width:50%;
		float:left;
		border-bottom:solid 1px #bebebe;
		box-sizing:border-box;
	}
	#gnav li:nth-child(odd){
		border-left:solid 1px #bebebe;
	}
	#gnav li.gnav-contact{
		border-right:none;
	}
	#gnav li a div{
		padding:15px 0 15px;
		font-size:18px;
		background:#fff;
	}
	#gnav li span{
		padding:0;
		font-size:14px;
	}
	#gnav li.gnav-top a div{
		padding:15px 0;
	}
	#gnav li.gnav-top,
	#gnav li.gnav-contact{
		width:100%;
		clear:both;
		padding:0;
	}
	.index #gnav ul li.gnav-top a div,
	.index #gnav ul li.gnav-top a div span,
	.vision #gnav ul li.gnav-vision a div,
	.vision #gnav ul li.gnav-vision a div span,
	.restaurant #gnav ul li.gnav-restaurant a div,
	.restaurant #gnav ul li.gnav-restaurant a div span,
	.estate #gnav ul li.gnav-estate a div,
	.estate #gnav ul li.gnav-estate a div span,
	.care #gnav ul li.gnav-care a div,
	.care #gnav ul li.gnav-care a div span,
	.company #gnav ul li.gnav-company a div,
	.company #gnav ul li.gnav-company a div span,
	.recruit #gnav ul li.gnav-recruit a div,
	.recruit #gnav ul li.gnav-recruit a div span,
	.contact #gnav ul li.gnav-contact a div,
	.contact #gnav ul li.gnav-contact a div span,
	#gnav ul li a div:hover,
	#gnav ul li a div span:hover{
		color: #111;
	}

	#menuBtn{
		width:30px;
		position:absolute;
		top:5px;
		right:15px;
		background:url(../../images/common/btn_close.png) no-repeat;
		background-size:100% auto;
	}
	.dialogIsOpen #header #menuBtn img{
		opacity:0;
	}


	
	/* ---------------------------------------------------------------------------
			#content		
				コンテンツ
	--------------------------------------------------------------------------- */
	
	#pageHeader{
		position:relative;
		width:100%;
		height:auto;
		margin:0 auto;
		padding:0;
		overflow:hidden;
	}
	#pageHeader .pagehead-inner{
		height:180px;
		background-size:auto 100% !important;
	}
	#pageHeader .pagehead-inner h2{
		top:50%;
		font-size:32px;
	}
	#pageHeader .pagehead-inner figure img{
	position:absolute;
  left:0;
  width:auto;
	height:170px;
  margin:0 auto;
	z-index:5;
}
	#pageHeader .pankuzu {
		width:100%;
		height:26px;
		margin:0 auto;
		background-color:rgba(245,245,245,1);
	}
	#pageHeader .pankuzu ul {
		width:100%;
		margin:0 auto;
		padding:0 10px;
		box-sizing:border-box;
	}
	#pageHeader .pankuzu ul li,
	#pageHeader .pankuzu ul li a{
		font-size:10px;
		line-height:26px;
	}
	#pageHeader .pankuzu ul li a:hover{
		color:#111;
	}
	
	
	

	#bnrs{
		margin:0 auto;
		padding:25px 0;
	}
	#bnrs ul{
		width:90%;
		margin:0 auto;
		padding:0 10px;
		box-sizing:border-box;
	}
	#bnrs ul li{
		width:49%;
		margin: 0 2% 2% 0;
	}
	#bnrs ul li:nth-child(n+5){
		margin-top: 0;
	}
	#bnrs ul li:nth-child(2n){
		margin-right:0;
	}
	
	
	
	/* ---------------------------------------------------------------------------
			#main
				メイン
	--------------------------------------------------------------------------- */
	#main{
		margin:40px auto 0;
	}


/*　キャッチ　*/
	#main .title{
		padding:0 10px;
	}
	#main .title h1{
		font-size:20px;
	}
	#main .title h2{
		padding:10px 0 25px;
		font-size:18px;
	}
	#main .title p{
		line-height:1.8;
		font-size:12px;
	}

	#main .title h1.en{
		font-size:24px;
	}
	#main .title h1.en span{
		font-size:12px;
	}

	

	/* ---------------------------------------------------------------------------
			#footer
				フッター
	--------------------------------------------------------------------------- */
	#pagetop{
		position:fixed;
		bottom:64px;
	}



	#footer .foot-inner{
		width:100%;
		padding:0 0 20px;
		border-top:solid 1px #bebebe;
	}

	#footer .foot-inner ul.fnav{
		position:static;
		overflow:hidden;
	}
	#footer .foot-inner ul.fnav li{
		width:50%;
		float:left;
		border-bottom:solid 1px #bebebe;
		box-sizing:border-box;
	}
	#footer .foot-inner ul.fnav li:after{
		content:none;
	}
	#footer .foot-inner ul.fnav li:first-child:before{
		content:none;
	}
	#footer .foot-inner ul.fnav li:nth-child(odd){
		border-left:solid 1px #bebebe;
	}
	#footer .foot-inner ul.fnav li a{
		display:block;
		padding:12px 0;
		font-size:14px;
		text-align:center;
		color:#111;
	}
	#footer .foot-inner ul.fnav li:first-child/*,
	#footer .foot-inner ul.fnav li:last-child*/{
		width:100%;
		border-right:none;
	}
	#footer .foot-inner ul.fnav li a:hover{
		color:#111;
		text-decoration:none;
	}

	
	
	#footer .foot-inner .foot-company{
		width:100%;
		padding:0 10px;
		box-sizing:border-box;
	}
	#footer .foot-inner .foot-company ul li{
		float:none;
		width:100%;
		margin:0 auto;
		padding:0 0 10px;
		border-right:none;
	}
	#footer .foot-inner .foot-company ul li img{
		width:50%;
		height:auto;
	}
	#footer .foot-inner .foot-company ul li:last-child{
		margin:0 auto;
		padding:10px 0 0;
		text-align:center;
		line-height:1.6;
		font-size:11px;
		border-top:solid 1px #bebebe;
	}

	
	
	#footer .foot-copys{
		height:64px;
		padding:10px 0;
	}
	#footer .foot-copys ul.copys{
		width:100%;
		margin:0 auto;
	}
	#footer .foot-copys ul.copys li{
		float:none;
		width:100%;
		padding-top:5px;
		text-align:center;
	}
	#footer .foot-copys ul.copys li a:hover{
		color:#fff;
	}
	#footer .foot-copys ul.copys li.copyright{
		float:none;
		padding-top:10px;
		font-size:9px;
		text-align:center;
	}

	
}


