@charset "UTF-8";
/* CSS Document */

/*
================================================= ALL Layout
*/
body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,p,
pre,form,fieldset,input,textarea,blockquote,th,td
{
	margin: 0;
	padding: 0;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
}

h1,h2,h3,h4,h5,ul,li,p,address {
	font-style: normal;
	font-weight: normal;
	font-size: 100%;
}

img {
	border: 0;
}

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

body {
	font-size: 62.5%;
	background-image:url(../main_e/bg_e.gif);
	background-color: #FFFFFF;
	text-align: left;
	line-height: 1.6em; /*--全体用に追加--*/
}

a:link {color: #000000;}
a:active {color: #ff0000;}
a:visited {
		color: #000000;
		text-decoration: none;
}
a:hover {color: #ff0000; text-decoration:underline;}



/*
================================================== Wrapper
*/
div#wrapper {
		font-size: 1.1em;
		text-align: center;
		border: 1px solid #CCC;
		width: 780px;
		background-color: #FFF;
}



/*
================================================== header
*/
div#header {
		width: 780px;
		height: 154px;
		text-align: left;
}


/* ▼ヘッダ　メニュー上部と下部　帯　会社名　帯　部分
　------------------------------ */

div#header h1 {
		width: 780px;
		height: 17px;
		background:url(../main_e/head_line.gif) repeat-x;
}

div#header h1 span,
div#header h3 span,
div#header h4 span {
		display: none;
}

div#header h2 {
		width: 780px;
		height: 101px;
		margin-top:-2px;/*-----  上部にできるスペース調整で追加 --------*/
}

div#header h3 {
		width: 780px;
		height: 4px;
		background: url(../main_e/head_obi_shita_line_bg.gif) repeat-x;
}

div#header h4 {
		width: 780px;
		height: 12px;
		background: url(../main_e/menu_shita_obi.gif) repeat-x;
}


/* ▼各メニュー　　ボタン　部分
　------------------------------ */

div#header ul {
		width: 780px;
		height: 21px;
		text-align: left;
}

div#header ul li {
		float: left;
		list-style-type: none;
}

div#header ul li a span {
		display: none;
}

div#header ul li a {
		float: left;
		display: block;
		width: 100px;
		height: 21px;
		border-left: 1px solid #666;
}
div#header ul li.menu_long a {
		float: left;
		display: block;
		width: 172px;
		height: 21px;
		border-left: 1px solid #666;
}

div#header ul li.right_border a {
		border-right: 1px solid #666;
}


/* ▼メニュー　01ホーム　現在　ボタン　差し替え部分
　------------------------------ */

div#header ul li.home_now {
		float: left;
		display: block;
		width: 100px;
		height: 21px;
		border-left: 1px solid #666;
		background:url(../main_e/menu_bt/menu_bt_homeC.gif) no-repeat left bottom;
}

div#header ul li.home_now span {
		display: none;
}


/* ▼メニュー　02アクセス・地図　現在　ボタン　差し替え部分
　------------------------------ */

div#header ul li.access_now {
		float: left;
		display: block;
		width: 100px;
		height: 21px;
		border-left: 1px solid #666;
		background:url(../main_e/menu_bt/menu_bt_accesC.gif) no-repeat left bottom;
}

div#header ul li.access_now span {
		display: none;
}


/* ▼メニュー　03ホテル設備　現在　ボタン　差し替え部分
　------------------------------ */

div#header ul li.setubi_now {
		float: left;
		display: block;
		width: 100px;
		height: 21px;
		border-left: 1px solid #666;
		background:url(../main_e/menu_bt/menu_bt_setubiC.gif) no-repeat left bottom;
}

div#header ul li.setubi_now span {
		display: none;
}


/* ▼メニュー　07お食事　現在　ボタン　差し替え部分
　------------------------------ */

div#header ul li.shokuji_now {
		float: left;
		display: block;
		width: 100px;
		height: 21px;
		border-left: 1px solid #666;
		border-right: 1px solid #666;
		background:url(../main_e/menu_bt/menu_bt_shokujiC.gif) no-repeat left bottom;
}

div#header ul li.shokuji_now span {
		display: none;
}



/* ▼メニュー　リンク時　ボタン
　------------------------------ */

div#header ul li a.navi_home:link,
div#header ul li a.navi_home:visited {
		background:url(../main_e/menu_bt/menu_bt_homeA.gif) no-repeat left bottom;
}

div#header ul li a.navi_home:hover,
div#header ul li a.navi_home:active {
		background:url(../main_e/menu_bt/menu_bt_homeB.gif) no-repeat left bottom;
}

div#header ul li a.navi_access:link,
div#header ul li a.navi_access:visited {
		background:url(../main_e/menu_bt/menu_bt_accesA.gif) no-repeat left bottom;
}

div#header ul li a.navi_access:hover,
div#header ul li a.navi_access:active {
		background:url(../main_e/menu_bt/menu_bt_accesB.gif) no-repeat left bottom;
}

div#header ul li a.navi_setubi:link,
div#header ul li a.navi_setubi:visited {
		background:url(../main_e/menu_bt/menu_bt_setubiA.gif) no-repeat left bottom;
}

div#header ul li a.navi_setubi:hover,
div#header ul li a.navi_setubi:active {
		background:url(../main_e/menu_bt/menu_bt_setubiB.gif) no-repeat left bottom;
}

div#header ul li a.navi_plan:link,
div#header ul li a.navi_plan:visited {
		background:url(../main_e/menu_bt/menu_bt3_planYoyakuA.gif) no-repeat left bottom;
}

div#header ul li a.navi_plan:hover,
div#header ul li a.navi_plan:active {
		background:url(../main_e/menu_bt/menu_bt3_planYoyakuB.gif) no-repeat left bottom;
}

div#header ul li a.navi_kakunin:link,
div#header ul li a.navi_kakunin:visited {
		background:url(../main_e/menu_bt/menu_bt_kakuninA.gif) no-repeat left bottom;
}

div#header ul li a.navi_kakunin:hover,
div#header ul li a.navi_kakunin:active {
		background:url(../main_e/menu_bt/menu_bt_kakuninB.gif) no-repeat left bottom;
}

div#header ul li a.navi_toiawase:link,
div#header ul li a.navi_toiawase:visited {
		background:url(../main_e/menu_bt/menu_bt_toiawaseA.gif) no-repeat left bottom;
}

div#header ul li a.navi_toiawase:hover,
div#header ul li a.navi_toiawase:active {
		background:url(../main_e/menu_bt/menu_bt_toiawaseB.gif) no-repeat left bottom;
}

div#header ul li a.navi_shokuji:link,
div#header ul li a.navi_shokuji:visited {
		background:url(../main_e/menu_bt/menu_bt_shokujiA.gif) no-repeat left bottom;
}

div#header ul li a.navi_shokuji:hover,
div#header ul li a.navi_shokuji:active {
		background:url(../main_e/menu_bt/menu_bt_shokujiB.gif) no-repeat left bottom;
}



/*
================================================== main
*/


div#main {
		width: 780px;
		height: auto;
		background:url(../main_e/bg_left201.gif) repeat-y 0 0;
}

div#main #left_pop {
		width: 201px;
		height: auto;
		text-align: center;
		float: left;
}

div#main #rigth_contenst {
		width: 579px;
		height: auto;
		text-align: center;
		float: right;
		background-color: #FFF;
}

/* div#main　に対するフロート指定を解除するcssハックの始まり
　------------------------------ */

div#main:after {
		content: ".";
		display: block;
		height: 0;
		clear: both;
		visibility: hidden;
}
div#main {
		display: inline-table;
}
/* MacIE begin \*/
* html div#main {
		height: 1%;
}
div#main {
		display: block;
}
/* MacIE end */

/* div#main　に対するフロート指定を解除するcssハックの終わり
　------------------------------ */


/* ページ左部　whast' new　などのPOP　部分
　================================================ */

/* ▼ページ左部01　whast' new　部分
　------------------------------ */

#left_pop #what {
		width: 188px;
		height: auto;
		margin: 3px auto 0;
		text-align: center;
		border: 1px solid #6F9;
		background-color: #FFF;
}

#left_pop #what #yobikomi {
		width: 180px;
		height: auto;
		margin: 5px auto 5px;
		text-align: left;
		font-size: 1.1em;
		line-height: 1.3em;
}


/* ▼ページ左部02　オプション　瀬戸内国際芸術祭パスポートチケット（2010.08.03設置）　部分
　------------------------------ */

#left_pop #option_pop {
		width: 188px;
		height: auto;
		margin: 10px auto 0;
		text-align: center;
		border: 1px solid #CCC;
		background-color: #FFF;
}

#left_pop #option_pop p.seto_title {
		width: 180px;
		height: auto;
		margin: 5px auto 5px;
		text-align: center;
		font-size: 1.3em;
		font-weight: 600;
		color: #F60;
}

#left_pop #option_pop p.seto_naiyou {
		width: 180px;
		height: auto;
		margin: 5px auto 5px;
		text-align: left;
}



/* ▼ページ左部02　携帯QRコード　部分
　------------------------------ */

#left_pop #qr {
		width: 188px;
		height: auto;
		margin: 10px auto 0;
		text-align: center;
		border: 1px solid #CCC;
		background-color: #FFF;
}

#left_pop #qr p {
		width: 180px;
		height: auto;
		margin: 5px auto 5px;
		text-align: left;
		font-size: 1.3em;
		font-weight: 600;
}


/* ▼ページ左部03　メンバーカード会員募集POP　部分
　------------------------------ */

#left_pop #member {
		width: 192px;
		height: auto;
		margin: 15px auto 0;
		text-align: center;
}

#left_pop #member p {
		width: 180px;
		height: auto;
		margin: 5px auto 0px;
		text-align: left;
		font-size: 1.2em;
}


/* ▼ページ左部04〜07　POP　部分
　------------------------------ */

#left_pop .popWaku {
		width: 192px;
		height: auto;
		margin: 0px auto 10px;
		text-align: center;
}









/*
================================================== footer
*/


/* ▼フッター　mail_info部分
　------------------------------ */

#mail_info {
		width: 780px;
		height: 30px;
		background-color: #FC9;
		text-align: center;
}


#mail_info .mail {
		width: 720px;
		height: 20px;
		margin: 0 auto;
		padding-top: 7px;
		text-align: right;
}

/*\*/
* html #kaisha address {height: 27px; padding-top: 7px;}
/* For Win IE */
/* */


#mail_info .mail a,
#mail_info .mail a:link,
#mail_info .mail a:visited,
#mail_info .mail a:active {
		text-decoration: none;
}

#mail_info .mail a:hover {
		text-decoration: underline;
		color: #FF0000;
}




/* #kaisha部分
　------------------------------ */
#kaisha {
		width: 780px;
		height: 40px;
		clear: both;
		background-color: #C30;
		text-align: center;
}

#kaisha address {
		width: 720px;
		height: 37px;
		text-align: left;
		padding-top: 3px;
		color: #FFFFFF;
		margin: 0 auto;
}


/*\*/
* html #kaisha address {height: 40px; padding-top: 3px;}
/* For Win IE */
/* */





/*
 =================== 各ページ共通 =======================
*/


/* ▼ページ右部　アクセス・地図、ホテル設備、お食事ページ
　　ページタイトル　部分
　------------------------------ */

#pageTilte {
		width: 579px;
		height: 35px;
		text-align: left;
		background:url(../main_e/title_migi_bar.gif) no-repeat right top;
}



/* ▼ページ右部　index、アクセス・地図、ホテル設備、お食事ページ
	#contents00　の内側　.con_inner　部分
　------------------------------ */

.con_inner {
		width: 556px;
		height: auto;
		margin: 0 auto;
		text-align: center;
}


/* ▼ページ右部　アクセス・地図、ホテル設備、お食事ページ
	サブタイトル　部分
　------------------------------ */

.sub_title_long {
		width: 556px;
		height: 23px;
		text-align: left;
		border-bottom: 1px solid #7C682B;
}





/* ▼ページ右部　ホテル設備、お食事ページ
	写真紹介　黄色べたグレー枠　.soto_waku　部分
　------------------------------ */

.soto_waku {
		width: 556px;
		height: auto;
		margin: 10px auto 10px;
		text-align: center;
		background-color: #FFC;
		border: 1px solid #CCC;
}


/* ▼ページ右部　ホテル設備、お食事ページ
	写真紹介　横2枚並びのフローと設定　部分
　------------------------------ */

.photoLeftRight {
		width: 556px;
		height: auto;
		margin: 10px auto 10px;
}

.photoLeft {
		width: 278px;
		height: auto;
		text-align: center;
		float: left;
}

.photoRight {
		width: 278px;
		height: auto;
		text-align: center;
		float: right;
}

/* .photoLeftRight　に対するフロート指定を解除するcssハックの始まり
　------------------------------ */

.photoLeftRight:after {
		content: ".";
		display: block;
		height: 0;
		clear: both;
		visibility: hidden;
}
.photoLeftRight {
		display: inline-table;
}
/* MacIE begin \*/
* html .photoLeftRight {
		height: 1%;
}
.photoLeftRight {
		display: block;
}
/* MacIE end */

/* .photoLeftRight　に対するフロート指定を解除するcssハックの終わり
　------------------------------ */



/* ▼ページ右部　ホテル設備、お食事ページ
	写真紹介　写真枠グレー線　説明文字周辺設定　部分
　------------------------------ */

.photo {
		border: 1px solid #333;
}

.photoBig {
		margin-top: 10px;
}

.setumeiBig {
		text-align: left;
		margin-left: 10px;
}

.setumeiSmall {
		text-align: left;
		margin-left: 10px;
}

/* ホテル設備 部屋の　m2平方メートル　部分
　------------------------------ */
.uetukimoji {
		font-size: 0.6em;
		vertical-align:super;
}



/* ▼indexページのコインランドリー、ホテル設備ページの専用家族風呂付　部分
	リンク　文字設定　
　------------------------------ */


.popup a:visited {
		text-decoration: underline;
}







/* 赤の線190px
　------------------------------ */

.red_line190 {
		width: 190px;
		height: 20px;
		clear: both;
		background: url(../main_e/10_1_bfb011.gif) repeat-x 50% 50%;
		margin: 0 auto;
}

.red_line190 span {
		display: none;
}


/* 赤の線275px
　------------------------------ */

.red_line275 {
		width: 275px;
		height: 10px;
		clear: both;
		background: url(../main_e/10_1_bfb011.gif) repeat-x 50% 50%;
		margin: 0 auto;
}

.red_line275 span {
		display: none;
}

/* 赤の線556px
　------------------------------ */

.red_line556 {
		width: 556px;
		height: 20px;
		clear: both;
		background: url(../main_e/10_1_bfb011.gif) repeat-x 50% 50%;
		margin: 0 auto;
}

.red_line556 span {
		display: none;
}




/* 共通各「Topへもどる」
　------------------------------ */

.go_top {
		clear: both;
		width: 556px;
		height: 15px;
		margin: 0 auto 20px;
		padding-top: 5px;
		text-align: right;
}

/*\*/
* html #go_top {width: 556px; height: 20px; padding-top: 5px;}
/* For Win IE */
/* */

.go_top a {
		width: 150px;
		text-align: right;
}

.go_top a:link,
.go_top a:visited,
.go_top a:active {
		text-decoration: none;
}

.go_top a:hover {
		text-decoration: underline;
		color: #FF0000;
}



/* 共通各　文字（フォント） 色
　------------------------------ */

.font_red {
		color: #F00;
}

.font_blue {
		color: #03F;
}