@charset "utf-8";

	html, body, div, span, iframe, h1, h2, h3, h4, h5, h6, p,a, dl, dt, dd, ol, ul, li, tr, th, td{
		border:0;
		font-family:inherit;
		font-style:inherit;
		font-weight:inherit;
		margin:0;
		outline:0;
		padding:0;
		vertical-align:baseline;
	}

	*, *:before, *:after {
		-moz-box-sizing: border-box;
		-webkit-box-sizing: border-box;
		box-sizing: border-box;
	}

	:focus{
		outline:0;
	}


	table{
		border: none;
	}


	/*== 利用規約・宿泊約款  ======================== */

	ol{
		margin-left: 30px;
	}

	ol.list_parentheses{
		padding:0 0 0 2em;
		margin:0;
	}

	ol.list_parentheses li{
		list-style-type:none;
		list-style-position:inside;
		counter-increment: cnt;
	}

	ol.list_parentheses li:before{
		display: marker;
		content: "(" counter(cnt) ") ";
	}

	li.rules{
		margin-bottom: 15px;
	}

/* ----------------------------*/

	ul{
		list-style:none;
	}

	a img{
		border:0;
	}

	.center{
		text-align: center;
		display: block;
		margin: 0 auto;
	}

	.left{
		text-align: left;
	}

	.right{
		text-align: right;
	}

	.f10{
		font-size:10px;
	}

	.clear{
		clear: both;
	}


/* -------------------------------------------------------------- */

	body{
		position    : relative;
	/*	background-image: url("../../img/mokume.jpg");*/
		background: #e0ffef; /*#f4ffff;*/ /*#E0FFFF;*/ /*#BBFFFF;*/ /*#62B0F0;*/ /*#f4efd7;*/

	/*	background-position: center center;
		background-repeat: repeat-x;
		background-size: cover;
	/*	background: #e0ffef;*/ /*#f4ffff;*/
		width: 100%;
		color:#555;
		font-size:18px;
		font-family: 'Noto Sans Japanese';
	/*	font-family:verdana,"ヒラギノ丸ゴ ProN W4","Hiragino Maru Gothic ProN","メイリオ","Meiryo","ＭＳ Ｐゴシック","MS PGothic",Sans-Serif;*/
		line-height:1.5;
		-webkit-text-size-adjust:100%;
	}


	/* リンク設定 ------------------------------------------------------------*/
	a{
		color:#6caefe;
		text-decoration:none;
	}

	a:hover{
		color:#488fdd;
	}

	a:active, a:focus {
		outline:0;
	}

	/* hタグ --------------------------------------------------------------*/

	h1 {
		margin: 0 auto;
	}



	h2 {
		font-size: 35px;
		font-weight: bold;
		color: #25B292;
		text-align: center;
		margin-bottom: 15px;
	}



	/* 全体------------------------------------------------------------*/
	/* ヘッダー --------------------------------------*/

	header{
		width: 100%;
		height: auto;
		margin: 0 auto;
		padding: 0;
		background: #e0ffef; /*#f4ffff;*/ /*#E0FFFF;*/ /*#BBFFFF;*/ /*#62B0F0;*/ /*#f4efd7;*/
/*		border-bottom: solid 3px #25B292; */
/*		-webkit-box-shadow: 0px 0px 20px rgba(0,0,0,0.2);*/	/*影の設定。右・下・ぼかし幅・色(rgba)の設定。rgba値は左３つが色指定(この場合は黒)で最後の小数点が透明度。*/
		box-shadow: 0px 7px 8px -10px rgba(59,67,59,0.6) inset;
	}

	.head{
		width: 100%;
		height: auto;
		background: #25B292; /*#00FFFF;*/ /*#62B0F0;*/
	}

	.headInner{
		max-width: 1200px;
		margin: 0 auto;
		color: #000;
		padding: 0px 10px;
	}

	.language{
		width: 100%;
/*		background: #25B292;*/
		text-align: right;
	}

	.language p{
		margin-right: 10px;
		margin-top: 3px;
	}

	.head_inner{
		max-width: 1200px;
/*		background: #fff; /*#e0ffef; /*#f4ffff;*/ /*#E0FFFF; /*#BBFFFF; /*#62B0F0;*/ /*#f4efd7;*/
		margin: 0 auto;
		padding: 0;
	}


	/* PCロゴ ----------------------*/
	p.logo{
		display: block;
		float: left;
		margin: 20px 0;
	}

	p.logo img{
		width: 380px;
	}


	/* スマホロゴ ------------------*/
	p.logo_s img{
		width: 380px;
	}

	p.logo_s{
		display: none;
	}

	img.logo_s2{
		display: none;
	}

	/* 電話番号 ------------------------------------*/

	.sub{
		display: block;
		margin-top: 20px;
		float: right;
		max-width: 260px;
		background: #e0ffef; /*#fff;*/
	}

	p.tel{
		margin-top: 10px;
		font-size: 18px;
	}

	p.tel span{
		float: right;
		font-size: 14px;
	}

	p.tel img{
		display: block;
		margin-top: -8px;
		float: right;
		width: 85%;
	}

	/* トップ上部ナビ ---------------------------------- */
/*
	.nav_inner{
		width: 100%;
		background: #000; /*#f4efd7;*/
/*	}
*/
	.navi{
		font-size: 14px;
		width: 100%;
		height: auto;
/*		box-shadow: 0px 0px 30px -20px rgba(0,0,0,0.6);	*/
		background: #e0ffef; /*#25B292;*/
	}



/* ==== トップイメージ ====================================== */

	.topImg{
		width: 100%;
		margin: 0 auto;
		padding: 0;
		background: #e0ffef;
	}

	.topImg img{
		width: 100%;
		padding: 0;
		margin: 0 auto;
	}

	.slider {
		max-width: 1200px;
		text-align: center;
		margin: 0 auto;
		color: #419be0;
	}

	.inImg{
		max-width: 1200px;
		height: auto;
		margin: 0 auto;
	}

/* ======== ホテルについて ===================== */

	.hotel{
		background: #fff;
		max-width: 1200px;
		padding: 15px 30px;
		margin: 0 auto 30px;
		border: solid 1px #25B292;
		border-radius: 20px;
	}

	.box14{
		width: 100%;
		padding: 10px;
		margin: 0px auto;
		background: #d6ebff;
/*	    box-shadow: 0px 0px 0px 10px #d6ebff;*/
		border-radius: 20px;
		box-shadow: 4px 4px 4px rgba(0, 0, 0, 0.15);
	}

	.box14 p {
		margin: 0;
		padding: 10px;
		border: dashed 2px white;
		border-radius: 20px;
	}



/* ======== 予約 ============================ */

	p.center{
		text-align: center;
	}

	p.center img{
		text-align: center;
		width: 40%;
	}

	p.center img:hover{
		opacity: 0.8;
	}

.pMark{
  margin-top: 1rem;
  text-align: center;
}

/* ========= メインコンテンツ  ====================*/



	#contents{
		max-width: 1200px;
		margin: 30px auto 20px;
	}

	.main {
		max-width: 1200px;
		padding: 25px;
		background: #fff;
		margin: 10px auto 50px;
		border-radius: 20px;
	}

	.corner{
		max-width: 1200px;
		margin: 0 auto 50px;
	}


/* ========= ポイント ==========================*/

	.gridWrapper{
		clear: both;
		width: 100%;
		overflow: hidden;
		margin: 0px auto;
		display: flex;
		justify-content:center;
	}

	.grid{
		width: 33%;
		background: #25B292;
		color: #fff;
		background-size: contain;
		border-radius: 20px;
		overflow:hidden;
		align-items:stretch;
	}

	.grid:nth-child(2){
		margin: 0 20px;
	}



/* ========= grid内 ==========================*/

	.box{

	/*	background: #fff; */
		padding:8px;
		margin: 5px;
		align-items: stretch;
		border-radius: 20px;
		overflow: hidden;
	}

	.grid img{
		width:100%;
		display: block;
		margin: 0 auto;
		border-radius-top-left: 20px;
		border-radius-bottom-right: 20px;
	}

	.box h3{
		font-size:16px;
		padding:10px 0 15px;
	}

	.box h3, .box p{
		text-align:left;
	}

	.box p.readmore{
		padding:10px 10px 5px;
		text-align:right;
	}

	.box p.readmore a{
		padding:3px 7px;
		border-radius:3px;
	}


	/* トップページ地図
	------------------------------------------*/
	#map{
		background: #fff;
		text-align: center;
	}

	#map p{
		text-align: left;
		margin-left: 10px;
	}


/* ======== 各ページのタイトル ================================== */

	img.title{
		width: 15%;
	}



/* ======== 宿泊案内 部屋スペック ===============================
 ===========================================================*/

	p.c{
		margin-top: 80px;
	}

	.mainImg{
		width: 100%;
		vertical-align: top;
	}

	#rooms {
		clear: both;
		background: #fff;
		width: 90%;
		margin: 0 auto;
	}

	#rooms p{
		text-align: left;
	}

	#rooms span {
		font-size: 11px;
		float: none;
		width: auto;
	}

	table.room {
		width:100%;
		margin: 50px auto 100px;
		border-collapse: collapse;
		border-spacing: 0;
		border-solid: 1px;
	}

	table.room th{
		padding-right: 10px;
		width: 45%;
		vertical-align: middle;
	}

	table.room td.room_t{
		background: #25B292;
		font-size: 18px;
		vertical-align: middle;
		padding-left: 15px;
		color: #fff;
	}

	table.room td{
		border: solid 1px #ddd;
		padding-left: 15px;
		vertical-align: middle;
	}

	img.reserve{
		width: 50%;

	}



/* ======== 設備案内 Facility ===============================
 ===========================================================*/

	.table01 {
		width: 100%;
		margin: 10px auto 50px;
		border-collapse: collapse;
		text-align: left;
		line-height: 40px;
	}

	.table01 th{
		border: solid 1px #777;
		width: 30%;
		padding: 20px;
		font-weight: bold;
	    vertical-align: middle;
		color: #fff;
		background: #25B292;
		line-height: 1.5;
	}

	.table01 td {
		width: 70%;
		padding: 20px;
		vertical-align: middle;
		line-height: 1.5;
		border: solid 1px #999;
	}


	.lh25{
		margin-left: 15px;
		line-height: 22px;
	}

	.card{
		width: 100%;

	}

	.card img{
		width: 90%;
	}


/* ======== 東京マップ   Tokyomap ===============================
 ===========================================================*/

	img.tokyomap{
		width: 100%;
		margin: 20px auto;
	}


/* ======== アクセス  Access ===============================
 ===========================================================*/

	table.walk{
		width: 100%;
	}

	table.walk th{
		border: solid 1px #bbb;
		width: 33%;
		padding: 10px;
		font-weight: normal;
	    vertical-align: middle;
		color: #333;
		background: #f5deb3;
		line-height: 1.5;
	}

	table.walk td {
		    width: 33%;
		    font-size: 17px;
		    padding: 5px;
		    vertical-align: top;
			line-height: 1.5;
	}

	img.map{
		width: 100%;
		margin-bottom: 50px;
	}

	img.access{
		width: 100%;
	}



/*PAGE TOP設定
---------------------------------------------------------------------------*/

	#page-top {
	    position: fixed;
	    bottom: 20px;
	    right: 20px;
	    font-size: 14px;
	}
	#page-top a {
		opacity: 0.7;
	    background: #666;
	    text-decoration: none;
	    color: #fff;
	    width: 50px;
	    padding: 10px 0px;
	    text-align: center;
	    display: block;
	    border-radius: 5px;
	}
	#page-top a:hover {
	    text-decoration: none;
	    background: #999;
	}


/*フッター
---------------------------------------------------------------------------*/
	footer {
		width: 100%;
		color: #000;
		background: #f4ffff;
		border-top: solid #25B292 3px;
		padding-top: 10px;
		margin: 0 auto;
	}

	footer a {
		text-decoration: none;
		color: #000;
	}
	footer a:hover {
		color: #777;
	}


/*フッターメニュー設定
---------------------------------------------------------------------------*/
	div.fwrap{
		max-width: 1200px;
		margin: 15px auto;
	}
	div.address{
		width:23%;
		height: 100%;
		float: left;
		display: inline-block;
		padding-top: 20px;
		padding-left: 10px;
	/*	background: #000;*/
	}


	/* リスト横 フッター上部 */

	div.fmenu{
		width:100%;
		text-align: center;
		border-bottom: dotted 1px #999;
		padding-bottom: 25px;
	}

	div.fmenu li{
		height: 20px;
		display: -moz-inline-box;
		display: inline-block;
		*display: inline;
		*zoom: 1;
		border-right: solid 1px #000;
		padding: 0 8px;
	}
	div.fmenu li a{
		display: block;
		font-size: 13px;
	}

	div.fmenu li:last-child{
		border: none;
	}

	/* フッターロゴ ----------------------------------- */

	footer img.f_logo{
		width: 45%;
		display: block;
		margin: 15px auto 0;
	}

	footer p.address{
		font-size: 65%;
		text-align: center;
		margin-top: 15px;
		margin-left: 10px;
	}

	/* リスト縦 フッター下部 --------------------------*/
	div.fmenu1{
		width:26%;
	/*	background: #777;*/
		padding-top: 35px;
		text-align: left;
		float: right;
	}

	div.fmenu1 li a{
		margin-left: 5px;
		font-size: 10px;
	}

	.f_hr{
		border: solid 1px #fff;
	}

	/* リスト縦 ------------------------------------*/
	/* 系列店舗欄 ----------------------------------*/

	div.fmenu2{
		width:24%;
	/*	background: #777;*/
		padding-top: 35px;
		text-align: left;
		float: right;
	}
	div.fmenu2 li a{
		font-size: 10px;
	}
	.f_hr{
		border: solid 1px #fff;
	}

	.clear{
		clear: both;
	}

	/* コピーライト -------------------------------------*/
	div.copy{
		color: #fff;
		background: #25B292;
		font-size: 10px;
		text-align: center;
	}



/* ========== レスポンシブ ==================================
 =======================================================*/

/* === 1280px以下設定 ==================*/
@media only screen and (max-width:1280px){

	/* == ロゴ ================= */
	p.logo{
		display: none;
	}

	p.logo_s{
		display: block;
		float: left;
		margin-top: -10px;
		margin-left: 20px;
		margin-bottom: 25px;
	}

	p.logo_s img{
		margin-top: 40px;
	}

	div.sub{
		margin-top: 20px;
		margin-right: 20px;
	}
}

/* === 1200px以下設定 ==================*/
@media only screen and (max-width:1200px){
	#contents{
		padding: 15px;
	}
}


/* === 1039px以下設定 ================== */
@media only screen and (max-width:1039px){


/* トップページのコンテンツ -------------------------------------------------------*/

	.topImg{
		width: 100%;
	}

	#contents{
		width: 100%;
	}



	/* 予約 */


	/*-----------*/

	p.head img{
		margin-top: 20px;
	}

	div.fwrap{
		max-width: 1200px;
		margin: 20px auto;
	}
	div.address{
		width:100%;
		height: 100%;
	}

	/* フッターロゴ */
	footer img.f_logo{
		display: block;
		width: 18%;
		margin: 0 auto;
	}

	footer p.address{
		font-size: 68%;
		text-align: center;
		margin-top: 15px;
		margin-left: 10px;
	}

	.fmenu1{
		display: none;
	}

	.fmenu2{
		display: none;
	}

	.topInfo{
	display: none;
	}


/* 960px以下の設定 -------------------------------------*/

@media only screen and (max-width:960px){

	h2{
		font-size: 28px;
	}

	/* === ロゴ =============== */

	p.logo_s img{
		width: 330px;
	}

	p.tel{
		margin-bottom: -5px;
	}

	/* === Facility ======================== */

	#main {
		width: 100%;
		margin: 0 auto;
	}

	/* === 予約サイト ======================== */


	p.center img{
		width: 50%;
	}

	/* === フッターロゴ ======================== */

	footer img.f_logo{
		display: block;
		width: 17%;
		margin: 0 auto;
	}

	p.access img{
		width: 30%;
	}
}

/* 640px以下の設定 -------------------------------------*/

@media only screen and (max-width:640px){

	body{
		font-size: 14px;
	}

	#header{
		height:auto;
		padding-bottom:20px;
	}

/* === ロゴ ==================*/

	p.logo_s{
		display: none;
	}

	img.logo_s2{
		width: 100px;
		display: block;
		float: left;
		margin: 5px 0 0 10px;
	}


	/* === 翻訳 ================= */

	div.sub{
		margin-top: 10px;
		margin-right: 15px;
	}






/* 電話バナー ------------------------------------*/

	img.telbnr{
		width: 90%;
		display: block;
		margin: 50px auto;
		border: solid 1px #ddd;
	}


	p.welcome{
		font-size: 12px;
		line-height: 20px;
	}

	p.welcome img{
		width: 80%;
	}

	.box img{
		float:left;
		margin-right:5px;
	}

	.box h3{
		padding-top:0;
	}

	/* 予約 */

	p.center img{
		width: 80%;
	}



	/* === rooms ======================= */

	td.room_t{
		margin-top: 10px;
	}

	table.room {
		width:100%;
		margin: 15px auto 50px;
	}

	table.room td, th {
		display: block;
		width:100%;
		border: solid 1px #ddd;
		border-top: none;
		border-collapse: collapse;
	}

	table.room th{
		padding: 0;
		width:100%;
	}


	/* === facility ======================= */

	.table01 {
		border-collapse: collapse;
		width: 100%;
	}

	td img{
		width: 70%;
		display: block;
		margin: 0 auto;
	}

	.table01 th{
		display: block;
		border: solid 1px #ddd;
		border-bottom: none;
		width: 100%;
		padding: 10px;
		font-weight: bold;
		vertical-align: top;
		text-align: center;
	}

	.table01 td {
		display: block;
		border: solid 1px #ddd;
		border-bottom: none;
		width: 100%;
	    padding: 10px;
	    vertical-align: top;
		text-align: center;
	}

	.table01 td:last-child{
		border: solid 1px #ddd;
	}

	p.head img{
		width:55%;
	}

	.card img{
		display: block;
		margin: 0 auto;
	}


	/* access ------------------------*/

	table.walk{
		width: 100%;
	}

	table.walk th{
		border: solid 1px #bbb;
		width: 100%;
		display: block;
		padding: 10px;
		font-weight: bold;
		vertical-align: middle;
		color: #333;
		background: #f5deb3;
		line-height: 1.5;
	}

	table.walk td {
		width: 100%;
		display: block;
	    padding: 10px;
	    vertical-align: top;
		line-height: 1.5;
	}


}

/* 480px以下の設定 -------------------------------------*/

@media only screen and (max-width:480px){

	h2{
		font-size: 26px;
	}


	div.sub{
		max-width: 180px;
		margin-top: 7px;
		margin-right: 5px;
	}

	p.tel span{
		font-size: 11px;
	}

	p.tel span img{
		width: 80px;
	}

	img.logo_s2{
		width: 90px;
		margin: 5px 0 0 5px;
	}

	.main{
		border-radius: 0;
	}


	.grid{
		width:100%;
		margin:10px 0;
	/*	border: solid 1px #ccc;*/
	}

	.box img{
		width: 100%;
		clear: both;
	}


	/* ==== grid ======================== */

	.gridWrapper{
		width: 100%;
		display: block;
		padding: 15px;
	}

	.grid{
		width: 100%;
	}

	.grid:nth-child(2){
		margin: 20px 0px;
	}

	footer img.f_logo{
		display: block;
		width: 20%;
		margin: 0 auto;
	}

}