@charset "utf-8";
/* ==========================================================

title : ホテル多度温泉
scope : 客室アップグレードのご案内

last modify : 2017/04/10 041_ooba
memo  : 

========================================================== */
#main{
	padding:0 0 8px!important;
}

#main .siteroute {
    float: none;
    display: block;
}

#maincolumn {
	width:962px;
	margin:0 auto;
}

#maincolumn h1 {
	width: 944px;
	margin: 0 auto 13px;
	padding: 15px 0 6px 14px;
	font-size: 18px;
	font-weight: normal;
	border-bottom: 1px dotted #000;
}

#maincolumn .main_image{
	margin:13px auto 0;
	width:882px;
}

#maincolumn .first_lead{
	width:735px;
	margin:22px auto 21px;
	font-size: 16px;
	line-height: 1.5;
}

#main section p {
	font-size: 16px;
	line-height: 1.5;
}


/* -------------------------------------------------------
 #note_box
-------------------------------------------------------- */
#note_box {
	background: #f0edd8;
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	margin:0 auto 40px;
	overflow: hidden;
	padding: 15px 0;
	width: 502px;
}

#note_box ul {
	font-size: 16px;
	margin: 0 20px;
}

#note_box li {
	color: #494000;
	margin: 5px 0;
}

#note_box li img {
	margin: 0 3px 0 0;
	vertical-align: middle;
}

/* -------------------------------------------------------
 #btn_list
-------------------------------------------------------- */
#btn_list {
	margin: 0 auto 30px;
	overflow: hidden;
	width: 732px;
}

#btn_list li {
	-webkit-box-shadow:0px 3px 5px 2px #999999;
	-moz-box-shadow:0px 3px 5px 2px #999999;
	box-shadow:0px 3px 5px 2px #999999;
	float: left;
	margin: 0 10px 10px;
	width: 224px;
}

/* -------------------------------------------------------
 [id$="_area"]
-------------------------------------------------------- */
#main section[id$="_area"] {
	margin: 0 auto 30px;
	overflow: hidden;
	width: 842px;
}

#main section[id$="_area"] h2{
	margin: 0 0 20px;
	text-align: left;
}

[class^="room_"]{
	margin: 0 auto 20px;
	overflow: hidden;
	width: 822px;
}

[class^="room_"] li{
	border-bottom: #666666 solid 1px;
	margin: 0 0 30px;
	padding: 0 0 30px;
}

[class^="room_"] li:last-of-type{
	border-bottom: none;
	margin: 0;
	padding: 0;
}

/* --------------------------------------
 予約した客室 
--------------------------------------- */

[class^="room_"] .grade {
	-webkit-border-radius: 5px;
	-moz-border-radius: 5px;
	border-radius: 5px;
	overflow: hidden;
	margin: 0 auto;
	width: 800px;
}

[class^="room_"] .reserve {
	position: relative;
	width: 800px;
}

[class^="room_"] .reserve dt {
	position: absolute;
	top: 5px;
	left: 27px;
}

[class^="room_"] .reserve dt.line2 {
	top: 55px;
}

[class^="room_"] .reserve dt.line4 {
	top: 155px;
}

[class^="room_"] .btn_room {
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-box-shadow:0px 2px 5px 1px #999999;
	-moz-box-shadow:0px 2px 5px 1px #999999;
	box-shadow:0px 2px 5px 1px #999999;
	float: left;
	margin: 47px 0 0 33px;
}

[class^="room_"] .photo {
	float: left;
	margin: 19px 0 19px 175px;
	overflow: hidden;
}

[class^="room_"] .photo li {
	float: left;
	border-bottom: none;
	margin: 0 8px 0 0;
	padding: 0;
}

[class^="room_"] .photo img {
	border: #ffffff solid 1px;
}

/* お部屋リスト */
[class^="room_"] .roomlist {
	margin-left: 175px;
	padding: 19px 0 9px;
	overflow: hidden;
}

[class^="room_"] .roomlist li {
	float: left;
	border-bottom: none;
	margin: 0 24px 10px 0;
	overflow: hidden;
	padding: 0;
	width: 290px;
}

[class^="room_"] .roomlist li:nth-of-type(2n) {
	margin: 0 0px 10px 0;
}

[class^="room_"] .roomlist figure {
	float: left;
}

[class^="room_"] .roomlist figure img {
	border: #ffffff solid 1px;
}

[class^="room_"] .roomlist .btn_room {
	margin: 28px 0 0 10px;
}

/* アイコン付き */
[class^="room_"] .ico_room {
	float: left;
	margin: 32px 0 0 0;
}

[class^="room_"] .ico_room .ico_specialroom {
	margin-left: 62px;
}

[class^="room_"] .ico_room .btn_room {
	float: left;
	margin-top: 6px;
}

/* 予約客室複数 */
[class^="room_"] .reservelist {
	margin: 0 auto;
	width: 762px;
}

[class^="room_"] .reservelist li {
	border-bottom: #eee7e7 solid 1px;
	margin: 0;
	padding: 0 0 20px;
	overflow: hidden;
}

[class^="room_"] .reservelist .reserve {
	float: left;
	width: 762px;
}

[class^="room_"] .reservelist .reserve dt {
	left: 8px;
}

#main section [class^="room_"] .reservelist .reserve p.note {
	font-size: 15px;
	margin: -12px 0 0 156px;
}

[class^="room_"] .reservelist .roomlist {
	border-bottom: #eee7e7 solid 1px;
	margin-left: 156px;
}

[class^="room_"] .reservelist .roomlist:last-of-type {
	border-bottom: none;
}

[class^="room_"] .reservelist .roomlist li {
	border-bottom: none;
	margin: 0 24px 10px 0;
	padding: 0px;
}

[class^="room_"] .reservelist .roomlist li:nth-of-type(2n) {
	margin: 0 0 10px 0;
}

/* --------------------------------------
 グレードアップ後
--------------------------------------- */
[class^="room_"] [class^="gradeup_"] {
	clear: both;
	margin: 0 auto;
	padding: 39px 0 0;
	width: 804px;
}

[class^="room_"] [class^="gradeup_"] ul {
	margin: 0 ;
	overflow: hidden;
	padding: 0px;
}

[class^="room_"] [class^="gradeup_"] li {
	border-bottom: none;
	float: left;
	padding: 0px;
}

[class^="room_"] [class^="gradeup_"] li:last-of-type {
	margin: 0px;
}

[class^="room_"] [class^="gradeup_"] dl {
	height: 117px;
	position: static;
}

[class^="room_"] [class^="gradeup_"] dt {
	padding: 17px 0 13px;
	position: relative;
	text-align: center;
	top: auto;
	left: auto;
}

[class^="room_"] [class^="gradeup_"] dt img.mrk_onsen {
	position: absolute;
	top: 11px;
	right: 10px;
}

[class^="room_"] [class^="gradeup_"] .btn_gradeup {
	-webkit-border-radius: 3px;
	-moz-border-radius: 3px;
	border-radius: 3px;
	-webkit-box-shadow:0px 2px 5px 1px #333333;
	-moz-box-shadow:0px 2px 5px 1px #333333;
	box-shadow:0px 2px 5px 1px #333333;
	height: 34px;
	margin: 0 auto;
	width: 220px;
}

/* 1部屋 */
[class^="room_"] [class^="gradeup_1"] {
	background: url(../image/arrow_gradeup_1.png) no-repeat center 0;
	margin: 0 auto;
	width: 401px;
}

[class^="room_"] [class^="gradeup_1"] .bekkan {
	background: url(../image/bg_gradeup_bekkan_1.png) no-repeat 0 0;
}

[class^="room_"] [class^="gradeup_1"] .residence {
	background: url(../image/bg_gradeup_residence_1.png) no-repeat 0 0;
}

/* 2部屋 */
[class^="room_"] [class^="gradeup_2"] {
	background: url(../image/arrow_gradeup_2.png) no-repeat center 0;
}

[class^="room_"] [class^="gradeup_2"] ul {
	width: 803px;
}

[class^="room_"] [class^="gradeup_2"] li {
	margin: 0 13px 0 0;
	width: 395px;
}

[class^="room_"] [class^="gradeup_2"] li .honkan {
	background: url(../image/bg_gradeup_honkan_2.png) no-repeat 0 0;
}

[class^="room_"] [class^="gradeup_2"] li .residence {
	background: url(../image/bg_gradeup_residence_2.png) no-repeat 0 0;
}

/* 3部屋 */
[class^="room_"] [class^="gradeup_3"] {
	background: url(../image/arrow_gradeup_3.png) no-repeat center 0;
}

[class^="room_"] [class^="gradeup_3"] ul {
	width: 803px;
}

[class^="room_"] [class^="gradeup_3"] li {
	margin: 0 13px 0 0;
	width: 259px;
}

[class^="room_"]  [class^="gradeup_3"] li .honkan {
	background: url(../image/bg_gradeup_honkan_3.png) no-repeat 0 0;
}

[class^="room_"]  [class^="gradeup_3"] li .residence {
	background: url(../image/bg_gradeup_residence_3.png) no-repeat 0 0;
}



/* -------------------------------------------------------
 #honkan_area
-------------------------------------------------------- */

/* 予約客室 */
[class^="room_honkan"] .grade {
	border: #7ca27f solid 1px;
	background: #d0d9d1 url(../image/bg_grade_honkan.png) no-repeat right bottom;
}

/* -------------------------------------------------------
 #bekkan_area
-------------------------------------------------------- */

/* 予約客室 */
[class^="room_bekkan"] .grade {
	border: #9f6868 solid 1px;
	background: #ddcece url(../image/bg_grade_bekkan.png) no-repeat right bottom;;
}

[class^="room_bekkan"] .reserve dt.room1 {
	top: 18px;
}

[class^="room_bekkan"] .reserve dt.room2 {
	top: 86px;
}

/* -------------------------------------------------------
 #honkan_area
-------------------------------------------------------- */

/* 予約客室 */
[class^="room_residence"] .grade {
	border: #a8a171 solid 1px;
	background: #dcd8cc url(../image/bg_grade_residence.png) no-repeat right bottom;;
}


/* -------------------------------------------------------
 #bnr_box
-------------------------------------------------------- */
#bnr_box{
	border-top: #ccc solid 1px;
	clear: both;
	margin:0 auto 40px;
	padding: 35px 0 0;
	width: 862px;
}

#bnr_box ul{
	letter-spacing: -0.5em;
	margin:0 auto 45px;
	overflow: hidden;
	text-align: center;
	width: 840px;
}

#bnr_box ul li{
	display: inline-block;
	letter-spacing: normal;
	margin:0 10px 25px;
}

#bnr_box ul li figcaption{
	font-size: 14px;
	line-height: 1.3;
	margin: 10px 0 0;
	text-align: center;
}

