﻿@charset "UTF-8";


/*********************************************************************
CSSリセット   共通
**********************************************************************/
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, textarea, p, blockquote, th, td {
	margin: 0;
	padding: 0;
}

table {
	border-collapse: collapse;
	border-spacing: 0;
}

fieldset, img {
	border: 0;
	vertical-align: middle;
}

address, caption, cite, code, dfn, em, strong, th, var {
	font-style: normal;
	font-weight: normal;
}

ol, ul {list-style: none;}

h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	font-weight: normal;
}

html{
	width:100%;
}

body{
	width:100%;
	font-size:0.9em;
	line-height:1.5em;
	font-family: "ＭＳ Ｐ明朝","MS PMincho","HGS明朝E","ＭＳ Ｐ明朝","MS PMincho",serif;

}


h1{
	
}

h2{
	font-weight:bold; font-size:200%; margin:30px 0; letter-spacing: 0.2em; text-align:center;
}


h3{
	
}

img{
	max-width: 100%;
	height: auto;
	width /***/:auto;
}

table{
	border-left:1px solid #BFBFBF;
	border-top:1px solid #BFBFBF;
	border-bottom:1px solid #BFBFBF;
	width:100%;
	margin-bottom:20px;
}

th{
	background-position:right bottom;
	border-bottom:1px dotted #BFBFBF;
	border-right:none;
	padding:5px;
	text-align:center;
	font-weight:bold;

}

td{
	border-bottom:1px dotted #BFBFBF;
	border-right:1px solid #BFBFBF;
	border-left:1px dotted #BFBFBF;
	padding:5px;
	background:#FFF;
}



a{
	text-decoration:none;
	color:#666;
}

a:hover{
	color:#000;
	opacity:0.5;
	text-decoration:none;
}


section{ margin:20px 0; }

/*----------------------------
nav
----------------------------*/



/*----------------------------
△nav△
----------------------------*/


/*----------------------------
▼footer▼
----------------------------*/
#footer{
	
}


/*----------------------------
△footer△
----------------------------*/

/*********************************************************************
Main  ▼▼▼▼▼▼▼  メインコンテンツ
**********************************************************************/
/*----------------------------
▼汎用▼
----------------------------*/
#img_main h1 {
	width:100%;
    left: 50%;
    position: absolute;
    top: 50%;
	margin:0;
}


#img_main h1 {
/*
    margin: -100px 0 0 -94px;
    width: 185px;
*/
    margin: -210px 0 0 -150px;
    width: 300px;

}

#img_main {
    background-position: center center;
    background-size: cover;
    height: 300px;
    margin-bottom: 0;
}

#contents{
	padding:0 1%;
}

#contents .btn_booking{
	position:absolute;
	top:0;
	right:0;
}

#contents .btn_booking a{
	background:#000;
	color:#FFF;
	display:block;
	padding:7px; 
	margin:10px;
	border-radius:5px;
}

header,
#main{
	margin:0 auto;
	width:100%;
	position:relative;
}

#bottom{
	border-top:solid 1px #CCC;
	padding-top:30px;
	font-weight:bold;
	font-size:110%;
	line-height:1.2em;
}

footer{ background:#626262;
	font-family: "ヒラギノ角ゴ Pro W3","Hiragino Kaku Gothic Pro","ＭＳ Ｐゴシック",sans-serif;
	color:#FFF;
	padding:20px;
}

footer a{ color:#FFF; }

p{ text-align:center; line-height:1.8em; }

footer br{ display:block; }

/* 新着 ---------------*/
.news{
	border-bottom:dotted 1px #8F8F8F;
	padding:20px 0;
	width:100%;
}

.newstit{
	padding-left:20px;
	border-left:solid 5px #8F8F8F;
	margin-bottom:20px;
}

.btnpast{ 
	border:none;
	padding:2% 1%;
	width:80%;
	float:left;
	background:#EFEFEF;
	border-radius:5px;
}

.sns{
	padding:1%;
	width:16%;
	float:left;
}

.newstit p{ text-align:left; }
.newscomt p{ text-align:left; }

/* イントロ ---------------*/
.h1{ font-weight:bold; font-size:160%; margin:20px 0; letter-spacing: 0.5em; }

.h2{ font-weight:bold; font-size:120%; margin:20px 0; letter-spacing: 0.2em; }

.intro1,
.intro2{ margin:20px 0; font-weight:bold; }

/* 客室 ---------------*/

.column2_l,
.column2_r{
	width:100%;
	float:none;
	margin-bottom:10px;

}

.column2_room_r p{ text-align:left; }

#room dl dt{
	font-weight:bold;
}

#room dl dd{
	margin-bottom:15px;
}

.roomtype table{ margin:30px 0 0 0px; }

#room th{
	background:#EBD7AE;
	text-align:center;
	border-right:1px solid #666;
	border-bottom:1px solid #666;
}

#room td{
	text-align:center;
	border-right:1px solid #666;
	border-bottom:1px solid #666;

}

#room .typename{
	background:#F4EFD5;
	text-align:left;
}

.service dl:nth-child(2n){
	background:#F7F5F5;
	border-top:dashed 1px #DDD;
	border-bottom:dashed 1px #DDD;
}

.service dl{
	padding:5px;
}

.ex{
	
}

/* アクセス ---------------*/
.column2{
	width:100%;
}

.column2_in{
	width:100%;
	float:none;
	margin-bottom:10px;

}

.wrap_table{
	display:table;
}

.wrap1_3{ display:table-cell;  width:30%; vertical-align:middle; }

.wrap2_3{ display:table-cell;  width:58%; vertical-align:top; padding:0 1%; }

.tit_access a{
	background:url(../images/arw_f.jpg) no-repeat left center;
	padding:5px 0 5px 40px;
	font-weight:bold;
	font-size:120%;
	letter-spacing: 0.2em;
	text-align:left;
	display:block;
}

#access ul li:before{
	content:"●";
	color:#8F8F8F;
}

.map{
	margin:20px 0;
}

/* フォントに関する記述 ---------------*/

strong{
	color:#FB0021;

}
.align_r{
	text-align:right;
	padding-right:5px;
}

.atn{
	font-size:85%;
}

.hugetit{
	font-weight:bold;
	font-size:120%;
	color:#666;
	padding:5px;
	margin:10px 0;
}

.top_reserve{
	width:98%;
	margin: 30px auto 10px;
}
.newscomt .reserve_button{ 
	border:none;
	padding:10px;
	text-align:center;
	background:#018EAA;
	color:#FFFFFF;
	border-radius:5px;
	font-size:130%;
	font-weight:bold;
}

.reserve_button a{
	color:#FFFFFF; 
}

.cancel_button{ 
	border:none;
	margin-top:5px;
	padding:10px;
	text-align:center;
	background:#497254;
	color:#FFFFFF;
	border-radius:5px;
	font-size:110%;
	font-weight:bold;
}

.cancel_button a{
	color:#FFFFFF; 
}

.next_reserve{
	width:96%;
	margin: 20px 0 20px;
}

.room_button{ 
	width:150px;
	border:none;
	padding:3px 10px;
	margin:10px 5px;
	text-align:center;
	background:#018EAA;
	color:#FFFFFF;
	border-radius:5px;
	font-size:100%;
	font-weight:bold;
}

.room_button a{
	color:#FFFFFF; 
}


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

/*----------------------------
▼side▼サイドバー
----------------------------*/

/*----------------------------
△aside△サイドバー
----------------------------*/


/*----------------------------
▼次階層▼
----------------------------*/
#btn_back{
	position:fix;
	top:0;
	left:0;
	width:15%;
	padding:20px;
}

#access p{
	margin:30px 0;

}

.tplink,
.tplink3{
	margin:20px 0;
	padding:10px 20px;
	box-shadow:0px 0px 5px #DDD;
}

.tplink ul li{
	width:48%;
	float:left;
	padding:5px 0;
}

.tplink3 ul li{
	width:32%;
	float:left;
	padding:5px 0;
}

#access .tit_tp{
	margin:0 0 10px 0;
	background:#EFEFEF;
	font-weight:bold;
	padding:10px;
}

.ankbtn{
	margin:20px 0;
	text-align:center;
}

.ankbtn p{
	
}

.ankbtn a{
	display:inline-block;
	background:none;
	padding:10px 10px;
	font-size:100%;
	font-weight:bold;
}

/* 予約  */
#reserve_form p{
	margin:30px 0;

}

#reserve_form p.info {
	color: #3366CC;
	font-weight:bold;
	font-size: 120%;
}

#reserve_form div.note {
	background-color:#FFDFDF;
	border:1px solid #FF0000;
	padding: 3px;
	width:90%;
	margin:0 auto;
	text-align:center;
}

.req_note {
	color: #BC0019;
}

#inquiry {
	padding: 20px 0px;
}

.hissu {
	color: #BC0019;
}

#inquiry .req_note {
	color:#000;
}
#inquiry .btn{
	color: #333;
	display: block;
	text-align:center;
	background:none;
}

#inquiry table{
	border-top:#ddd solid 1px;
	border-right:#ddd solid 1px;
	padding:0;
	width:100%;
}
#inquiry table tr{
	max-width:100%;
}
#inquiry table th,
#inquiry table td{
	border-bottom:#ddd solid 1px;
	border-left:#ddd solid 1px;
	padding:3px;
	font-size: 95%;
	display: block;
	max-width:100%;
}

#inquiry table th{
	background-color:#f5f5f5;
	text-align: left;
}
#inquiry table td input[type="text"],#inquiry table td textarea{
	max-width:98%;
	width:98%;
}

#inquiry table td input{
	margin:5px;
	padding: 2px;
}

#inquiry table td span.pre_note,
#inquiry table td span.note {
	color:#6F6F6F;
}
#inquiry table td span.relation {
	color:#456E9F;
	font-size:97%;
}

#inquiry table th span.comment{
	font-weight:normal;
	font-size:95%;
}

#inquiry table td.class2 input[type="text"]{
	max-width:40%;
	width:40%;
}

#inquiry table th.index1,
#inquiry table th.index2{
	text-align:center;
	background-color:#DFF1FF;
}


#inquiry button {
	border:none;
	background-color:#ffffff;
}

#inquiry p.inquiry_note {
	text-align:left;
	font-weight:bold;
	margin: 0 20px 10px;
}

ul.err_navi {
	margin: 0 0 5px 0;
	padding: 10px;
	color: #BC0019;
	font-size: 90%;
	border:solid 1px #BC0019;
}

#reserve_form ul li:before{
	content:"●";
	color:#BC0019;
}

/* 新着情報 */

.newscomt{
	padding-left:10px;
	border:solid 1px #8F8F8F;
	margin:0 20px 40px;
}

.newscomt .images{
	margin:10px;
}
.newscomt .images li{
	list-style:none inside;
	margin:0 auto 10px;
}
.newscomt .images img{
	text-align:center;
}
.news_link ul {
	padding: 10px;
	font-size: 90%;
}
.news_link ul li{
    list-style: none outside none;
	font-size:110%;
	background: url("../images/common/arw.gif") no-repeat scroll 0 center;
	padding-left: 15px;
}
p.ichiran a{
	background:url("../images/common/arw.gif") no-repeat 10px center;
	float: right;
	font-size: 100%;
	padding: 10px 10px 10px 35px;
	color:#000000;
	display:block;
}


/* pagenavi----- ページ切り替え */

.pagenavi {
	padding:10px 20px 0;
	text-align: right;
}

.pagenavi ul {
	list-style: none outside none;
	margin: 0;
	padding: 0;
}
.pagenavi ul li a:hover, .pagenavi ul li.cur {
	background: none repeat scroll 0 0 #CFCFCF;
	color: #FFFFFF;
}
.pagenavi ul li.cur,
.pagenavi ul li a {
	padding: 3px 6px;
}
.pagenavi ul li a {
	background: none repeat scroll 0 0 #246DA3;
	color: #FFFFFF;
	text-decoration: none;
}

.pagenavi ul li {
	display: inline;
	line-height: 1em;
	margin: 0 2px 0 0;
	padding: 0;
}



/*----------------------------
△次階層△
----------------------------*/
#footer:after,
.cf:after{
	content: ".";
	height: 0;
	clear: both;
	display: block;
	visibility: hidden;
	font-size: 0;
	line-height: 0;
}

/*----------------------------
△汎用△
----------------------------*/


/*********************************************************************
▼▼▼▼▼▼▼  タブレット用
**********************************************************************/
@media screen and (min-width: 640px) {
	header,
	#main{
		margin:0 auto;
		width:100%;
		position:relative;
	}
	#btn_back{ width:70px; }
	#img_main {
	    background-position: center center;
	    background-size: cover;
	    height: 460px;
	    margin-bottom: 0;
	}
	#img_main h1 {
/*
		margin: -160px 0 0 -244px;
*/
		margin: -200px 0 0 -244px;
		width: 485px;
	}
	#contents{
		padding:0;
	}
	#main{
		margin:0 auto;
		width:100%;
		position:relative;
	}
	.column2{
		width:100%;
	}
	.column2_in{
		width:50%;
		float:left;

	}
	.column2_room{
		width:100%;
	}
	.wrap_table{
		display:table;
	}

	.wrap1_3{ display:table-cell; width:30%; vertical-align:middle; }

	.wrap2_3{ display:table-cell; width:60%; vertical-align:top; }
	#bottom{
		letter-spacing: 0.2em;
		font-size:120%;
		line-height:1.5em;
	}
	.ankbtn a{
		font-size:140%;
		background:url(../images/arw_down.gif) no-repeat 0.5em center;
		padding:10px 30px 10px 65px;
	}
	.top_reserve{
		width:400px;
		margin: 30px auto 10px;
	}
	.next_reserve{
		width:400px;
		margin: 20px 0 20px;
	}
}


/*********************************************************************
▼▼▼▼▼▼▼  PC用
**********************************************************************/
@media screen and (min-width: 900px) {
	header{
		width:100%;
	}
	
	#img_main h1 {
	    height: 257px;
/*	    margin: -178px 0 0 -284px; */
	    margin: -290px 0 0 -284px;
	    width: 563px;
	}
	.news,
	#main{
		margin:0 auto;
		width:1024px !important;
		position:relative;
	}
	
	.h1{ font-weight:bold; font-size:200%; margin:20px 0; letter-spacing: 0.5em; }

	.h2{ font-weight:bold; font-size:160%; margin:20px 0; letter-spacing: 0.2em; }
	.news{
		display:table;
		width:100%;
	}
	#contents .btn_booking a{
		font-size:130%;
		display:block;
		padding:15px; 
		margin:20px;
		border-radius:5px;
	}
	.newstit{
/*		display:table-cell; */
		width:80%;
		vertical-align:middle;
		padding-left:20px;
		margin-bottom:20px;
	}

	.newslist{
		display:table-cell;
		width:20%;
	}
	.newscomt .comment{
		float:left;
		width:52%;
		margin-right:2%;
	}
	.newscomt .images{
		float:right;
		width:43%;
		margin:1%;
	}

	.btnpast{ 
		border-left:solid 1px #8F8F8F;
		border-right:solid 1px #8F8F8F;
		padding:5px;
		width:60%;
		float:left;
		background:none;
		border-radius:0px;
	}
	.column2_r{
		width:50%;
		float:right;
	}
	.column2_l{
		width:50%;
		float:left;
	}
	.sns{
		padding:1%;
		width:28%;
		float:left;
	}
	footer br{ display:none; }


	/* 予約  */
	#inquiry table td input[type="text"],#inquiry table td textarea{
		width:auto;
	}
	#inquiry table th,
	#inquiry table td{
		border-bottom:#ddd solid 1px;
		border-left:#ddd solid 1px;
		padding:3px;
		font-size: 95%;
		display: table-cell;
	}
	#inquiry table td.class2 input[type="text"]{
		width:auto;
	}
	/* 客室 */
	.column2_room_r{
		width:55%;
		float:right;
	}
	.column2_room_l{
		width:45%;
		float:left;
	}

}
-->