@charset "utf-8";

/*===============================================
 スマホ：画面の横幅が767pxまで
===============================================*/
@media only screen and (max-width:767px){

	
	/*common 
	---------------------------------------------------------------------------*/
	.only-sp{
		display: block !important;;
	}
	.only-pc{
		display: none !important;;
	}
	html,body{ 
		width: 100%;
		min-width: 300px;
	}
	body { 
		width: 100%;
		overflow-x: hidden;
	}
	img { max-width: 100%; -ms-interpolation-mode: bicubic; }

	/* mean menu */
	.mean-container > a { background:none; /*line-height:0;*/ padding:0; margin:0; }
	.mean-container .mean-bar { 
	    background: #FFF;
	    position:absolute;
	    top:5px; left:0;
	    z-index: 9999;
	}
	.mean-container .mean-bar a.meanmenu-reveal span { background: #00693E; }
	.mean-container .mean-bar a.meanmenu-reveal {
	    padding: 10px 20px; margin-top: 4px;
	    background: #EFEFEF; color: #00693E;
	    border:2px solid rgba(222, 222, 222, 1); border-radius: 6px;
	    font-size:18px; text-indent: 0; text-align:center;
	    width:16%;
	}
	.mean-container .mean-nav ul li a { background: #00693E; line-height:0.6em; }

	/* 非表示要素 */
	#sideArea{ display: none; }

	div#container { min-width: 100%; }
	div#contentsInner { width: 90%; }
	div#mainContents { width: 100%; }
	.contentsInfo { width: 100%; }
	.contactBox { width: 100%; }

	/* ヘッダ */
	div#header { 
		height: 80px; 
		width: 100%;
		position: fixed;
		top: 0px;
		left: 0px;
		z-index: 10;
		transition: .3s;
		min-width: 100%;
	}
	div#header .headText{
		display: none;
	}
	div#header .headerRight{
		display: none;
	}
	.headerLeft { text-align: left; width:60%; height: 80px; padding:0; }
	.headerLeft a { background: #FFF !important; }
	.logo a img { 
		width: 200px;
		height:auto;
		margin-top:20px;
		margin-left:1em;
	}
	div#header .logo {
		display: block;
		position: relative;
		top: 14px;
		left: 0;
		z-index: 1;
		width: 60%;
		height: 42px;
		padding: 0;
		opacity: 1 !important;
		margin: 0;	
	}
	.headContact { padding:4px 1.6%; float:none !important; text-align:center !important; }
	.headContact img { width:auto !important; height:auto !important; max-width:46%; padding:0 2%; vertical-align:middle; }
	.headRightText { display:inline-block; vertical-align:middle; }
	div#headerInner{
		padding: 0;
		width: 100%;
	}
	#nav{
		height: auto;
	}
	#nav ul{
		width: 100%;
	}

	div#contents { width:100%; text-align:center; margin-top: 80px; }
	div#contents.toppage{ margin-top: 0; }
	
	/*  menu-sp-btn
	---------------------------------------------------------------------------*/
	.menu-sp-btn {
		display: none;
		position: absolute;
		z-index: 9999;
		top: 38px;
		right: 20px;
		width: 25px;
		height: 20px;
	}
	.menu-sp-btn span {
		background-color: #00693e;
		display: block;
		height: 3px;
		border-radius: 3px;
		width: 100%;
		margin-bottom: 6px;
		transition: transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s, opacity 0.1s ease-in-out 0.1s, -webkit-transform 0.3s cubic-bezier(0.175, 0.885, 0.32, 1.275) 0.1s;
		-webkit-transform: translateZ(0);
						transform: translateZ(0);
	}
	.menu-sp-btn span:last-child {
		margin-bottom: 0;
	}
	.menu-sp-btn.is-clicked span:first-child {
		-webkit-transform: translateY(9px) rotateZ(-135deg);
				-ms-transform: translateY(9px) rotate(-135deg);
						transform: translateY(9px) rotateZ(-135deg);
	}
	.menu-sp-btn.is-clicked span:nth-child(2) {
		opacity: 0;
	}
	.menu-sp-btn.is-clicked span:last-child {
		-webkit-transform: translateY(-9px) rotateZ(135deg);
				-ms-transform: translateY(-9px) rotate(135deg);
						transform: translateY(-9px) rotateZ(135deg);
	}
	

	/* sp-nav
	---------------------------------------------------------------------------*/
	#sp-nav.sp-menu{
		position: fixed;
		width: 100%;
		top: 80px;
		left: 100%;
		z-index: 99999;
		padding: 0;
		background-color: #00326F;
		-webkit-box-shadow: 0 5px 5px rgb(0 0 0 / 15%);
		box-shadow: 0 5px 5px rgb(0 0 0 / 15%);
		-webkit-backface-visibility: hidden;
		-webkit-transition: all .3s ease;
		-o-transition: all .3s ease;
		transition: all .3s ease;
		background-color: rgba( 0, 0, 0, 0.7 );
	}
	#sp-nav.sp-menu.is-displayed {
		left: 0;
		-webkit-backface-visibility: hidden;
		-webkit-transition: all .3s ease;
		-o-transition: all .3s ease;
		transition: all .3s ease;
	}
	#sp-nav.sp-menu li{
		text-align: center;
		border-bottom: 1px solid white;
		    float: none;
	}
	#sp-nav.sp-menu li a{
		color: white;
		display:block;
		padding: 12px 0;
	}
	#sp-nav.sp-menu li a span{
		display: block;
		font-size: 70%;
		line-height: 1;
	}
	#sp-nav.sp-menu li:last-child{
		border: 0;
	}

	#mainVisual {
		margin-top: 80px;
	}
	.pika-stage{
		top: 5px !important;
	}
	/* フッター */
	div#footer { margin-top: 100px; }
	div#footerInner, div#footer .copy { display: none; }

	/*メニューをページ下部に固定*/
	#sp-fixed-menu{
		position: fixed;
		width: 100%;
		bottom: 0px;
		font-size: 0;
		opacity: 0.9;
		z-index: 99;
	}

	/*メニューを横並びにする*/
	#sp-fixed-menu ul{
		display: flex;
		list-style: none;
		padding:0;
		margin:0;
		width:100%;
	}

	#sp-fixed-menu li{
		justify-content: center;
		align-items: center;
		width: 50%;
		padding:0;
		margin:0;
		font-size: 14px;
		border-right: 1px solid #fff;
	}

	/*左側メニューを緑色に*/
	#sp-fixed-menu li:first-child{
		background: #38b435;
	}

	/*左側メニューをオレンジ色に*/
	#sp-fixed-menu li:last-child{
		background: #f3a324;
	}

	/*ボタンを調整*/
	#sp-fixed-menu li a{
		color: #fff;
		text-align: center;
		display:block;
		width: 100%;
		padding:10px;
		box-sizing: border-box;
		text-decoration: none;
	}

	.contentsInfo { margin: 20px 0; }
	.topBox1 { width: 100%; }
	table.tableType1 { width:100%; }
	table.tableType1 td { width:auto　; padding:2%; }
	table.tableType1 td.calbutton img { width:auto; }
	table.tableType1 td img { width:100%; padding: 5px; box-sizing: border-box;}
	table.tableType2 { width:100%; }
	table.tableType2 td { width:50%; }
	table.tableType2 td img { width:100%; }
	table.tableType2.selectRoom.smphonetable3 { width:100%; }
	table.tableType2.selectRoom.smphonetable3 td { width:33%;bottom: 100%;}
	table.tableType2.selectRoom.smphonetable3 td:first-child { width:16%; }
	table.tableType2.selectRoom.smphonetable3 td:last-child { width:16%; }
	table.tableType2.selectRoom.smphonetable3 td img { width:100%; }
	table.tableType2.selectRoom.smphonetable3 td img[src*="logo.png"] { width:100%; }
	table.tableType2.selectedRoom.smphonetable3 { width:100%; }
	table.tableType2.selectedRoom.smphonetable3 td { width:33%;bottom: 100%;}
	table.tableType2.selectedRoom.smphonetable3 td:first-child { width:16%; }
	table.tableType2.selectedRoom.smphonetable3 td img { width:100%; }
	table.tableType2.selectedRoom.smphonetable3 td img[src*="logo.png"] { width:100%; }
	/* responsive table */
	table.responsive td, table.responsive th { white-space:normal !important;}
	.pinned { width: 0% !important; border:none !important; }
	div.table-wrapper { border:none !important; }
	div.table-wrapper div.scrollable { margin-left: 0% !important; }

	table.tableType2.selectRoom td:nth-child(odd) { width:25%; }
	table.tableType2.selectRoom td { width:50%; max-width:100%; padding:5px !important; }
	table.tableType2.selectRoom td img { width:auto; display:inline-block; }
	table.tableType2.selectRoom td img[src*="logo.png"] { width:auto; }
	table.tableType2.selectRoom tr td span { margin:0 !important; display:inline-block; }
	table.tableType2.selectedRoom td { width:50%; max-width:100%; padding:5px !important; }
	table.tableType2.selectedRoom td img { width:auto; display:inline-block; }
	table.tableType2.selectedRoom td img[src*="logo.png"] { width:auto; }
	table.tableType2.selectedRoom tr td span { margin:0 !important; display:inline-block; }

	#mainContentsInner h2 { width:auto; text-align:center; }
	#mainContentsInner h2 img { width:auto !important; height:auto !important; }

	.boxflex1 .topBox1 { width:100%; text-align:left; }
	.boxflex1 .topBox1 img { width:40%; height:auto; text-align:left; }

	div#mainContentsInner div p img[src*="/line.png"] { width:100%; }
	div#mainContentsInner div p.fll { width:96%; height:auto; margin:0 !important; padding:2% !important; float:none; }
	div#mainContentsInner div p.fll img { width:96%; height:auto; padding:2% !important; float:none; }

	div.contentsInfo div.contentsInfoInner { width: 41%; margin:2% !important; padding:2% !important; }
	div.contentsInfo div.contentsInfoInner p { width:100%; }
	div.contentsInfo div.contentsInfoInner.fll p img, div.contentsInfo div.contentsInfoInner.flr p img {
	    width:100%; height:auto;
	}

	div.contentsInfo div.box { padding:10px 0 !important; }
	div.contentsInfo div.box p { padding:0 2% !important; }
	div.contentsInfo div.box .gazo { width:46%; }
	div.contentsInfo div.box p { width:100%; margin:0px !important; }
	div.contentsInfo div.box p.gazo img { width:96%; padding:2% !important; }
	div.contentsInfo p.gazo { width:100%; }
	div.contentsInfo p.gazo img { width:96%; height:100%; padding:2% !important; }


	/* top */
	#mainVisualInner { width: 100% !important; height:auto !important; padding:0 0 16px; }
	.tgk_style{ width:100% !important; height:auto !important; }
	.bx-wrapper{ height:auto !important; }
	.bx-wrapper img{ width: 100% !important; height: auto !important; }
	div#mainContentsInner.top div.box1 p { width:45%; height:auto; padding:2% !important; margin:0 !important; float:none; display:inline-block; }
	div#mainContentsInner.top div.box1 p img { width:96%; height:auto; padding:2% !important; float:none; }
	div#mainContentsInner.top div.box2 img[src*="/line.png"] { width:100%; }
	div#mainContentsInner.top div.box2 p { width:auto; height:auto; padding:2% !important; margin:0 !important; }
	div#mainContentsInner.top div.box2 img { width:36%; height:auto; padding:2% !important; }
	div#mainContentsInner.top div.box4 p.elem1 { width:36%; height:auto; padding:2% !important; margin:0 !important; float:left; }
	div#mainContentsInner.top div.box4 p.elem1 img { width:96%; height:auto; padding:2% !important; }
	div#mainContentsInner.top div.box4 p.elem2 { width:46%; height:auto; padding:2% !important; margin:0 !important; float:right; }
	div#mainContentsInner.top div.box4 p.elem2 img { width:96%; height:auto; padding:2% !important; }
	div#mainContentsInner.top div.box4 p.elem3 img { min-width:58%; max-width:96%; height:auto; padding:2% !important; }
	div#mainContentsInner.top div.box4 p.elem4 { width:96%; height:auto; padding:2% !important; margin:0 !important; }
	div#mainContentsInner.top div.box4 p.elem5 img { width:96%; height:auto; padding:2% !important; }
	div#mainContentsInner.top .buildingimage{ display: none; }
	div#mainContents h2{ display: none; }

	/* お知らせ */
	div#mainContentsInner.top ul.localNav { margin:0 0 10px 0; padding:0 ; list-style:none; border:1px solid #dcdcdc; }
	div#mainContentsInner.top ul.localNav li { margin: 10px; padding:0; list-style:none; background:#fff; font-size:90%;  text-align:left; line-height:18px; }
	div#mainContentsInner.top ul.localNav li p.date { color:#00693e; border-bottom:1px dotted #ccc; margin-bottom: 5px; padding: 2px 0;}
	div#mainContentsInner.top ul.localNav li.index { margin: 0 0 0 0; padding: 10px ; list-style:none; background:#00693e; border:1px solid #dcdcdc; font-weight:bold; font-size:100%; text-align:left; color:#ffffff; }

	/* 備品 */
	div#mainContentsInner div .tableType1.equip .text { width:46%; padding:2%; font-size:86%; }
	div#mainContentsInner div .tableType1.equip .text strong { font-size:86%; }
	div#mainContentsInner div .tableType1.equip .img { width:46%; padding:2%; float:left; }
	div#mainContentsInner div .tableType1.equip .img img { width:96%; padding:2%; float:left; }

	/* アクセス */
	div.contentsInfo table.tableType1.access tbody tr td span { display:none;}
	div.contentsInfo table.tableType1.access tbody tr td img { width:96%; height:auto; padding:2%; }
	div.contentsInfo table.tableType1.access tbody tr td img[src*="logo.png"] { width:56%; }
	div.contentsInfo table.tableType1.access tbody tr td iframe { width:96%; padding:2%; }

	/* お問い合わせ */
	div.contentsInfo table.tableType2.contact tbody tr td .smphone_moji { font-size: 100% !important; }
	div.contentsInfo table.tableType2.contact tbody tr td { width:auto; }
	div.contentsInfo .mailForm table.tableType1.contactform tbody tr th { width:20%; }
	div.contentsInfo .mailForm table.tableType1.contactform tbody tr td input[type="text"] { width:98%; }
	div.contentsInfo .mailForm table.tableType1.contactform tbody tr td textarea { width:98%; }

	/* 予約申し込みフォーム */
	div.contentsInfo .mailForm table.tableType1.entry tbody tr th { width:100%; }
	div.contentsInfo .mailForm table.tableType1.entry tbody tr td input[type="text"] { width:98%; }
	div.contentsInfo .mailForm table.tableType1.entry tbody tr td span { display:inline-block; }
	div.contentsInfo .mailForm table.tableType1.entry tbody tr td div.purposeLeft { width: 50%; }
	div.contentsInfo .mailForm table.tableType1.entry tbody tr td div.enquateLeft { width: 50%; }

	/* カレンダー */
	div.contentsInfo .table-scroll { overflow: scroll; }
	table.tableCalendar td {padding: 8px;} 

	/* 1番町会議室倶楽部 */
	div.contentsInfo table.tableType1.ichibancho tbody tr th { width:10%; }
	div.contentsInfo table.tableType1.ichibancho tbody tr td input[type="text"] { width:98%; }
	div.contentsInfo table.tableType1.ichibancho tbody tr td span { display:inline-block; }
	div.contentsInfo table.tableType1.ichibancho tbody tr td iframe { width:100% !important; }

	/* サイドバナー類 */
	#kaigishitu-club { width:80%; margin:0 auto; margin-top:-20px !important; }
	#kaigishitu-club img { width:100%; }
	.humosblog { width:80%; margin:0 auto; margin-top:20px !important;}
	.humosblog img { width:100%; height:auto; }


	table.tableType1 th,
	table.tableType1 td {
		float: left;
		width: 100%;
		box-sizing: border-box;
	}

	/* TOP バナー群 */
	.banners { width:100%; margin:0; }
	.banners .banners_ind {
	    width: 100%;
	     box-shadow: none; 
	}
	.banners .banners_ind .image .imgover { left:6%;}


	.pika-stage{
	    height:115px !important;
	}

	.pika-stage img{	/* メイン画像の縮小拡大の設定 */
		height: auto !important;
	}

	.toppage .room-index ul li{
		width: 100%;
		margin-right: 0;
		margin-bottom: 20px;
	}
}