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

 file name  :style.css
 author     :yourName (admin)
 style info :コンテンツエリア関係 他
 
このスタイルシートの構成
 基本設定、リンクカラー、レイアウト、横幅設定など
 汎用class
 #navSkip
 #page
  #contents
   #main
   #sub
 
=================================================================== */

/*----------------------------------------------------
	基本設定、リンクカラー、レイアウト、横幅設定など
----------------------------------------------------*/
body {
}

a:link{
	color: #5D5D5D;
	text-decoration:none;
}

a:visited{
	color: #5D5D5D;
	text-decoration:none;
}

a:hover{
	color: #000;
	text-decoration:underline;
}

a:active{
	color: #000;
}


#wrapper{
	width: 960px;
	margin: 0 auto;
	padding: 0;
    background:#000;

}

#contents {
	width:960px;
	float: left;
	background-image:url(../img/contentsbg.gif);
	background-repeat:repeat-y;
	background-color:#EEEADF;
	padding-bottom:20px;
}


#main {
	width: 640px;
	float:right;
}
#main #main-in {
	margin-right: 45px;
}

#sidebar {
	width: 267px;
	float: left;
	margin-right:px;/*ここで指定するとIEで2倍バグ*/
	margin-left: px;

}
#sidebar #sidebar-in {
	/*margin-right:23px;/*IEで2倍バグ対処*/
	margin-left: 15px;
	padding-right: 2px;
	padding-left: 2px;
	padding-bottom:15px;
	background-image: url(../img/saidbar/sidrbar-bg.jpg) no-repeat ;
	}


/*----------------------------------------------------
	#navSkip (NavigationSkip)
----------------------------------------------------*/
span#navSkip {
	position: absolute;
	top: 0;
	left: 0;
}


/*----------------------------------------------------
	#page
----------------------------------------------------*/
#page {
	margin: 0 auto;
	text-align: left;
}


/*----------------------------------------------------
	#ページの上部に戻る
----------------------------------------------------*/
#Topcontents #main .pageTop ,
#contents #main .pageTop {
	margin:10px 10px 0 0;
	clear:both;
	padding:0px;
	font-size:10px;
	line-height:10px;
	text-align:right;
}
#Topcontents .pageTop a,
#contents .pageTop a {
	text-align:right;

}

/*----------------------------------------------------
	#パンくずリスト
----------------------------------------------------*/

#pan-navi {
position: relative;/*親要素横幅指定の際マイナスマージンだとIE6で幅を超えた分が表示されないバグを回避するため*/
width:620px;
text-align:left;
font-size:10px;
border-bottom:#CCCCCC solid 1px;
margin:20px 20px 20px -20px;/*マイナスマージン使用*/
}

#pan-navi a {
color: #666666;
background:url(../img/arrow-pan-navi.gif) no-repeat;
background-position:0px 0px;
padding-left:16px;
}

#pan-navi a:link {
color: #666666;
background:url(../img/arrow-pan-navi.gif) no-repeat;
background-position:0px 0px;
}
#pan-navi a:visited { 
color: #666666;
background:url(../img/arrow-pan-navi.gif) no-repeat;
background-position:0px 0px;
}
#pan-navi a:hover { 
color: #999999;
background:url(../img/arrow-pan-navi.gif) no-repeat;
background-position:0px 0px;
}

/* -----------------------------------------------------------
	#smap
		サイトマップ
----------------------------------------------------------- */
#smap {
	margin-top:20px;
}
#smap ul li {
	margin: 5px 0 0 20px;
	padding: 0 0 0 30px;
	background: url(../img/smap/house.png) no-repeat 0 4px;
	line-height: 160%;
}
#smap ul li ul {
	background: url(../img/smap/ic_bk.png) repeat-y 20px 0;　// ul の背景に点線の画像を設定
}
#smap ul li ul.category li {
	background: url(../img/smap/folder.png) no-repeat 1px -283px;　// 長さ 300px あるのでマイナスで位置調整
}
#smap ul li ul.page li {
	background: url(../img/smap/page.png) no-repeat 1px -283px;
}
#smap ul li ul li.last {
	background-color: #EEEADF; // 点線の表示を消すため、背景と同じ色にします。
}


/*----------------------------------------------------
	TOPページ用CSS
----------------------------------------------------*/
#Topcontents {
	float: left;
	background-color:#EEEADF;
	padding-bottom:20px;
	width:960px;
}
#topmain {
	width: 650px;
	float: left;
	padding: 0 13px 0 15px;
}

/* -----------------------------------------------------------
	#Topsidebar
		トップサイドバー
----------------------------------------------------------- */
#topsidebar {
	width: 267px;
	float: left;
	/*margin-right:px;ここで指定するとIEで2倍バグ*/
}
#topsidebar #topsidebar-in {
	padding-right: 2px;
	padding-left: 2px;
	margin-top:9px;
	padding-bottom:15px;
	background-image:url(../img/saidbar/sidrbar-bg.jpg) no-repeat;
	background-position:bottom;
	}





/* -----------------------------------------------------------
	#Topmain
		TOPメイン
----------------------------------------------------------- */

/*ようこそ*/

#topmain #mainflash{
	margin-top:15px;
	margin-bottom: 10px;
	float: left;
	width: 647px;
}


#topmain #welcomeguide {
	padding-left: 3px;
	margin-bottom: 5px;
	float: left;
	width: 647px;
}
#topmain #welcomeguide .infomation{
margin-bottom:10px;
}

/*4つガイド*/

#topmain #welcomeguide #guide4box{
}

#topmain #welcomeguide .guide4,
#topmain #welcomeguide .guide4-end {
	float: left;
	width: 158px;
	margin-right: 5px;
	background-image: url(../index/4guide/guide4-bg.gif);
	background-position: bottom;
}
#topmain #welcomeguide .guide4-end {
	width: 158px;
	margin-right: 0px;
}
#topmain #welcomeguide #guide4box .guide4 dd ,
#topmain #welcomeguide  #guide4box .guide4-end dd{
	padding: 0 5px 5px 5px;
}
#topmain #welcomeguide #guide4box .guide4 p,
#topmain #welcomeguide  #guide4box .guide4-end p  {
	margin: 0px;
	padding-bottom:8px;
	line-height: 1.2em;
	background-image: url(../index/4guide/p_bg.jpg);
	padding-left:12px;
	font-weight:bold;
}
#topmain #welcomeguide #guide4box .guide4 p,
#topmain #welcomeguide  #guide4box .guide4-end p  {
text-decoration:underline;
}
#topmain #welcomeguide #guide4box .guide4 .day {
	font-weight: bold;
	color: #663300;
	margin: 0px;
	padding: 0px;
}

/*おすすめプラン*/
#topmain #plan-info {
	padding-left: 2px;
	margin-bottom: 10px;
	/*float: left;←必要ないからいいんだけど、ここにこれを入れていたらIEのみ.planinfoのFloatが効かなくなった。*/
}
/*プラン一覧ボタン*/
#topmain #plan-info #planindexbtn {
	position:absolute;
}
#topmain #plan-info #planindexbtn a {
}









/*おすすめプラン4つ並び*/

#topmain #plan-info .planinfo {
	width: 316px;
	float: left;
	padding-left: 7px;
	margin-bottom: 10px;
}
#topmain #plan-info .planinfo a {
	width:220px;
	text-decoration:underline;
	font-weight:bold;
	color:#CC0000;
}
#topmain #plan-info div.planinfo img {
	float:left;
	margin-right:10px;
	border:#E0E0E0 solid 1px;
	}
#topmain #plan-info .planinfo dd {
	width: 220px;
	/*dtの横に隣り合う部分がIEで3px右にずれる という意味不明のバグ？対処　http://www.d-spica.com/try/dt-float.html*/
	zoom:1;
	float:right;
}


/*新着情報*/
#topmain #infomation {
	padding-left: 3px;
	float: left;
	width: 647px;
	margin-bottom: 10px;
}
#topmain #infomation #planindexbtn {
	position:absolute;
}
#topmain #infomation #planindexbtn a {
position:relative;
top:-45px;
left:455px;
display:block;
width:180px;
height:35px;
}
/*更新リストを疑似インラインフレーム化*/
#topmain #infomation dl {
width: 635px;/*スクロールバー分-10px。下でパディング1pxしているので上#infomation横幅647pxより-2px*/
height: 80px;
padding: 1px;
overflow: auto;/*これで疑似インラインフレーム*/
overflow-x: hidden/*IEで下スクロールバーが出るのを回避*/

}
/*dtをfloatしてddと高さを合わせる。ddはマージンレフトで開始位置設定。これでdtの高さ以上のddでも左余白が続く*/
#topmain #infomation dt {
float:left;
margin-left:3px;
margin-right:15px;
padding:5px 0;
padding-left:20px;
background:url(../img/maru.gif) no-repeat 2px .4em;
}
#topmain #infomation dd {
margin-left:115px;
padding:5px 0 ;
border-bottom:1px dotted #CCCCCC;
}
#topmain #infomation dd a {
color:#990000;
}
#topmain #link {
	width: 647px;
	clear: both;
}
#topmain #link ul {
	padding-left: 6px;
}
#topmain #link li {
	float: left;
	margin-right: 2px;
}

/* -----------------------------------------------------------
	#sidebar-Navi
		下位ページサイドバー
----------------------------------------------------------- */

#sidebar #sidebar-in .maincontentnavi-title {
}

#sidebar #sidebar-in #maincontentsnavi ul {
margin-left:11px;
font-size:100%;
width:px;
height:auto;
    }
/*下位サイドバーのメニュー＆TOPサイドバー下部の宿泊種類リスト*/
#topsidebar #topsidebar-in .reservsearchlist li,
#sidebar #sidebar-in #maincontentsnavi li {
margin:0px;
padding:0 ;
background:#EEEADF url(../img/saidbar/navi_line.gif) repeat-x 0 100%;
     }
	 
#topsidebar #topsidebar-in .reservsearchlist li a ,
#sidebar #sidebar-in #maincontentsnavi li a {
/*padding:8px 10px 10px 35px;*/
padding:5px 10px 5px 35px;
display:block;
line-height:1.2;
width:215px;
background:url(../img/saidbar/navi_icon.gif) no-repeat 10px 8px;
}

/*TOPサイドバー下部の宿泊種類リストのタイトル*/
#topsidebar #topsidebar-in .reservsearchlist-ti{
	padding:8px 5px 10px 5px;
	display:block;
	line-height:1.2;
	width:253px;
	font-size:1.2em;
	font-weight:bold;
	background:url(../index/reservsearchlist-tibg.gif) repeat-x top left;
	}
	
/*宿泊予約検索：TOPサイドバー・下位Pサイドバー共通*/
#topsidebar #topsidebar-in #reservesearch-day,
#sidebar #sidebar-in #reservesearch-day{
	padding-right: 10px;
	padding-left: 10px;
	background-position: bottom;
	padding-bottom: 10px;
	}

/* -----------------------------------------------------------
	#main
		下位ページコンテンツメイン
----------------------------------------------------------- */
#main #main-in #data1 h2 {
	margin-bottom:10px;
}

#main #main-in #data1 table {
	width:590px;
	font-size:12px;
	border-color:#CCCCCC;
	border-style:solid;
	border-width:0px 0px 1px 0px;
	margin-bottom:10px;
}

#main #main-in #data1 td {
	font-size:12px;
	padding:8px 10px 8px 10px;
	border-color:#CCCCCC;
	border-style:solid;
	border-width:1px 0px 0px 0px;
}
#main #main-in #data1 th {
	font-size:10px;
	font-weight:normal;
	padding:8px 10px 8px 10px;
	border-color:#CCCCCC;
	border-style:solid;
	border-width:1px 0px 0px 0px;
	background-color:#DDD9CC;
}
#main #main-in #data1 .notes {
	font-size: 10px;
	line-height: 140%;
	font-weight: normal;
	margin-bottom: 10px;
}

/*特典レイアウト*/
#main #main-in #tokuten {
	width:530px;
	font-size:px;
	border-color:#A28960;
	border-style:solid;
	border-width:2px 0px 2px 0px;
	margin-bottom:10px;
	background-image: ;
	background-repeat:no-repeat;
	background-position:0px 7px;
	padding:5px 0px 5px 70px;
}
#main #main-in #tokuten {
	width:520px;
	font-size:px;
	border-color:#A28960;
	border-style:solid;
	border-width:2px 0px 2px 0px;
	margin-bottom:10px;
	background-image:url(../img/bg_tokuten.gif);
	background-repeat:no-repeat;
	background-position:0px 7px;
	padding:5px 0px 5px 70px;
}



/*右画像レイアウト*/
#main #main-in #Rimg h1 {
padding:0px 0px 10px 0px;
clear:both;
}
#main #main-in #Rimg p {
padding:0px;
font-size:em;
width:410px;
float:right;
}

#main #main-in #Rimg p a {
color: #333333;
background:url(img/arrow_text.gif) no-repeat;
background-position:0px 1px;
padding-left:16px;
font-size:1em;
line-height:150%;
}

#main #main-in #Rimg p a:link {
color: #333333;
background:url(img/arrow_text.gif) no-repeat;
background-position:0px 1px;
}
#main #main-in #Rimg p a:visited { 
color: #333333;
background:url(img/arrow_text.gif) no-repeat;
background-position:0px 1px;
}
#main #main-in #Rimg p a:hover { 
color: #999999;
background:url(img/arrow_text2.gif) no-repeat;
background-position:0px 1px;
}

.Rimg {
padding:4px 4px 4px 4px;
border:#DDDDDD solid 1px;
width:150px;
float:left;
margin-bottom:20px;
}

/*画像のみ横並び３つ : ID */

#main #main-in #imglist3 {
padding:10px 0px 10px 10px;
clear:both;

}

#main #main-in #imglist3 h2 {
padding:4px 0px 0px 0px;
margin-bottom:15px;
clear:both;
}
#main #main-in #imglist3 h3 {
padding:4px 0px 10px 0px;
clear:both;
}

#main #main-in #imglist3 ul {
margin:0;
padding:0px 0px 0px 0px;
list-style:none;
clear:both;
}

#main #main-in #imglist3 li {
	width:180px;
	float:left;
	margin:0px 10px 30px 0px;
}
#main #main-in #imglist3 li img {
width:170px;
display:block;
color: #333333;
padding:4px;
border:#CCCCCC solid 1px;
margin-bottom:6px;
}


/*画像のみ横並び３つ : class */

#main #main-in .imglist3 {
padding:10px 0px 10px 10px;
clear:both;

}

#main #main-in .imglist3 h2 {
padding:4px 0px 0px 0px;
margin-bottom:15px;
clear:both;
}
#main #main-in .imglist3 h3 {
padding:4px 0px 10px 0px;
clear:both;
}

#main #main-in .imglist3 ul {
margin:0;
padding:0px 0px 0px 0px;
list-style:none;
clear:both;
}

#main #main-in .imglist3 li {
	width:180px;
	float:left;
	margin:0px 10px 20px 0px;
}
#main #main-in .imglist3 li img {
width:170px;
display:block;
color: #333333;
padding:4px;
border:#CCCCCC solid 1px;
margin-bottom:6px;
}



/*----------------------------------------------------
	宿泊プランリスト用
----------------------------------------------------*/
#main .planlistbox{
	margin-bottom:25px;
	width:580px;
	background: url(../plan/plan-index/planlistbox_bg.gif) no-repeat bottom left;
}
#main .planlistbox P {
margin:0px;
}
#main .planlisttitle {
font-size:1.2em;
font-weight:bold;
}
#main .planlistbox .infotitle {
	padding:3px 5px;
	/*border-top: 1px solid #ccc;
	border-bottom: 1px solid #ccc;*/
	background-color:#75664B;
	margin-bottom:0px;
	color: #FFF;
	font-size:1.1em;
	font-weight:bold;
}
#main .planlistbox .infotitle a{
	color:#FFf;
}
#main .planlistbox .infotitle a:hover{
	color:#FFf;
	text-decoration:underline;
}
#main #main-in .planlistbox table {
	margin-top:0px;
	padding:0px;
}
#main #main-in .planlistbox table td {
	padding:0.3em 0.5em;
}
#main .planlistbox .subtitle {
	margin-bottom:5px;
	color: #333;  border-bottom:#CCC solid 1px;
	font-weight:bold;
}
#main .planlistbox .koumoku {
	font-weight:bold;
}
#main .planlistbox .stred {
	font-weight:bold;
	color:#CC0000;
}
#main .planlistbox .infoimg {
	padding:5px;
	border:#75664B solid 1px;
}



/*----------------------------------------------------
	汎用class
----------------------------------------------------*/
.borderimg{
padding:4px;
border:#DDDDDD solid 1px;
}

.mb10{margin-bottom:10px}
.mb15{margin-bottom:15px}
.mb20{margin-bottom:20px}
.mb25{margin-bottom:25px}
.imgR {
	float: right;
	margin: 0 0 10px 10px;
}

.imgL {
	float: left;
	margin: 0 10px 10px 0;
}

.btn {
	text-align: center;
}
.font-w{
	font-weight:bold;
	}



/*
	clearfix
*/
#hoge:after,
#sidebar:after,
#main:after,
#contents:after,
#topmain:after,
#topsidebar:after,
.imgR:after,
.imgL:after,
#contents .pageTop:after,
#topmain #welcomeguide:after,
#topmain #welcomeguide .guide4:after,
#topmain #welcomeguide .guide4-end:after,
#topmain #plan-info:after,
#topmain #plan-info .planinfo:after,
#topmain #infomation:after,
#topmain #infomation dt:after,
#topmain #link li:after,
#main:after,
#sidebar:after,
#list3 :after,
#imglist3 li:after,
.Rimg:after,
#main #main-in #imglist3 li:after,

{

	content: "."; display: block; visibility: hidden; height: 0.1px; font-size: 0.1em; line-height: 0px; clear: both;
}


.fontred {
	color: #FF0000;
}
.fontred a {
	color: #FF0000;
	font-weight: bold;
	text-decoration: underline;
}

.clear:after
{
	content: "."; display: block; visibility: hidden; height: 0.1px; font-size: 0.1em; line-height: 0; clear: both;
}

/*
	newclearfix
*/

.clearfix:after,
.planinfo:after {
  content: ".";  /* 新しい要素を作る */
  display: block;  /* ブロックレベル要素に */
  clear: both;
  height: 0;
  visibility: hidden;
}

.clearfix,
.planinfo {
  min-height: 1px;
}

* html .clearfix,
* html .planinfo {
  height: 1px;
  /*\*//*/
  height: auto;
  overflow: hidden;
  /**/
}
.clear {
	clear:both;
	}
	
/*　レイアウト処理 */

/*　<br class="cb" /> */

.cb{	clear:both; height:1%; font-size:1%;	}