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

/*------------------------------------------------------------
	banner
------------------------------------------------------------*/
#banner{
	clear:left;
	width:100%;
	height:180px;
}

#banner section{
	clear:left;
	margin:0 auto;
	padding-top:50px;
	width:930px;
	height:180px;
}

#banner #banner01 a{
	display:block;
	width:930px;
	height:80px;
	text-decoration:none;
	-webkit-transition:0.4s;
	transition:0.4s;
}

#banner #banner01 a:hover{
	background-image:none;
}

#banner #banner02 a{
	clear:left;
	display:none;
	margin:0 auto;
	width:95%;
	height:70px;
	text-align:center;
	text-decoration:none;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:17px;
	font-weight:bold;
	color:#390;
	background:#FFF;
	line-height:70px;
	border:#390 5px solid;
	-webkit-transition:0.4s;
	transition:0.4s;
}

#banner #banner02 a:hover{
	background:#FFF;
}

#banner #banner03{
	display:none;
}

/*------------------------------------------------------------
	空室検索
------------------------------------------------------------*/
#index1{
	clear:left;
	width:100%;
	height:200px;
}

#index1 section{
	clear:left;
	margin:0 auto;
	width:1300px;
}

#index1 h1{
	margin-bottom:20px;
	text-align:center;
	font-family:serif;
	font-size:28px;
	color:#000;
}

#index1 #search{
	margin-bottom:20px;
	width:1300px;
	height:100px;
	background:#d3b9a6;
}

#index1 #title{
	float:left;
	margin-top:20px;
	margin-left:30px;
	margin-right:20px;
	width:100px;
	height:50px;
	font-family:serif;
	font-size:14px;
	text-align:center;
	line-height:50px;
	border:#44443f 1px dotted;
}

#index1 #search #box{
	float:left;
	margin-top:22px;
}

#index1 #search .btn01{
	float:left;
	margin-top:30px;
	margin-left:30px;
	padding:7px 28px 6px 28px;
	color:#FFF;
	text-decoration:none;
	background:#421e04;
	border:0;
}

#index1 #search .btn02 a{
	float:left;
    display:block;
    overflow:hidden;
	margin-top:30px;
	margin-left:10px;
	padding:5px 28px;
	text-align:center;
	text-decoration:none;
	color:#FFF;
	background:#900;
	-webkit-transition:0.4s;
	transition:0.4s;
}

#index1 #search .btn02 a:hover{
	background:#421e04;
}

/*------------------------------------------------------------
	おすすめプラン
------------------------------------------------------------*/
#index2{
	clear:left;
	width:100%;
	height:auto;
	text-align:center;
}

#index2 section{
	clear:left;
	margin:0 auto;
	width:95%;
	height:auto;
}

#index2 #img{
	clear:left;
	display:flex;
}

#index2 #img .pic{
	flex:1;
	margin-left:10px;
	padding-bottom:100px;
}

#index2 #img ul{
	margin-top:10px;
	font-size:14px;
	line-height:2em;
}

#index2 #img h1{
	clear:left;
	padding:10px 0;
	text-align:center;
	font-weight:bold;
	font-family:serif;
	font-size:17px;
	background:#d3b9a6;
}

#index2 .btn01 a{
	clear:left;
    display:block;
    overflow:hidden;
	margin:0 auto;
	margin-top:10px;
	width:400px;
	height:50px;
	line-height:50px;
	text-align:center;
	text-decoration:none;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:14px;
	color:#FFF;
	background:#421e04;
	-webkit-transition:0.4s;
	transition:0.4s;
}

#index2 .btn01 a:hover{
	color:#FFF;
	background:#de6e00;
}

/*------------------------------------------------------------
	紹介
------------------------------------------------------------*/
#index3{
	clear:left;
	width:100%;
	height:700px;
	background:url(../index/index7_pic3.png) no-repeat bottom left;
}

#index3 section{
	clear:left;
	margin:0 auto;
	padding-top:50px;
	width:95%;
	height:auto;
}

#index3 #img1{
	float:left;
	text-align:center;
	width:50%;
	height:500px;
}

#index3 #img1 h1{
	float:left;
	width:15%;
	height:500px;
	font-family:serif;
	font-size:50px;
	color:#333;
	-ms-writing-mode:tb-rl;
	writing-mode:vertical-rl;
	border-right:#333 1px dotted;
}

#index3 #img1 h1 span{
	font-size:26px;
}

#index3 #img1 ul{
	float:left;
	padding-top:30px;
	width:80%;
	font-family:serif;
	font-size:17px;
	line-height:2em;
}

#index3 #img1 .pic{
	margin-top:30px;
}

#index3 #img2{
	float:right;
	width:50%;
	height:auto;
}

#index3 a{
	display:block;
	margin:0 auto;
	margin-top:30px;
	padding:10px 0;
	width:350px;
	color:#000;
	font-family:serif;
	font-size:16px;
	text-decoration:none;
	border:#333 1px dotted;
	-webkit-transition:0.4s;
	transition:0.4s;
}

#index3 a:hover{
	color:#FFF;
	background:#966;
	border:#663333 1px dotted;
}

/*------------------------------------------------------------
	ホテルグループ相互リンク #421e04
------------------------------------------------------------*/
#index4{
	clear:left;
	margin:0 auto;
	width:100%;
	height:1120px;
	background:url(../index/index7_pic1.png) no-repeat top left,url(../index/index7_pic2.png) no-repeat top right, url(../common/main_footer_bg1.jpg);
}

#index4 section{
	clear:left;
	margin:0 auto;
	padding-top:70px;
	width:1200px;
	height:1010px;
}

#index4 #box1{
	float:left;
	width:250px;
}

#index4 #box1 img{
	margin-bottom:10px;
}

#index4 #box2{
	float:left;
	margin-left:20px;
	padding-bottom:50px;
	width:930px;
}

#index4 #box2 h1{
	padding-top:30px;
	margin-bottom:20px;
	text-align:center;
	font-family:serif;
	font-size:28px;
	color:#CC9;
}

#index4 #box3{
	clear:left;
	width:1200px;
	height:210px;
}

#index4 #box3 p{
	float:left;
	width:225px;
	width:150px;
}

#index4 #box3 #tominoko{
	float:left;
	display:block;
	width:588px;
	height:150px;
	background:#018cba;
	border:#000 1px solid;
}

#index4 #box3 #jiragon{
	float:left;
	display:block;
	margin-left:20px;
	width:588px;
	height:150px;
	background:#006666;
	border:#000 1px solid;
}

#index4 #box3 ul{
	float:right;
	padding:20px;
	width:325px;
	height:110px;
}

#index4 #box3 ul img{
	margin-bottom:15px;
}

#index4 h2{
	clear:left;
	font-size:13px;
	color:#FFF;
	font-weight:normal;
	line-height:50px;
}

#index4 #box3 a{
	color:#FFF;
	-webkit-transition:0.4s;
	transition:0.4s;
}
 
#index4 #box3 a:hover{
	color:#FFF;
}

#index4 #box3 h2 a{
	color:#C96;
	-webkit-transition:0.4s;
	transition:0.4s;
}
 
#index4 #box3 h2 a:hover{
	color:#C63;
}


/*------------------------------------------------------------
	スマホ　768px 960
------------------------------------------------------------*/
@media only screen and (max-width:1200px) {
/*------------------------------------------------------------
	banner
------------------------------------------------------------*/
#banner{
	clear:left;
	width:100%;
	height:auto;
}

#banner section{
	clear:left;
	margin:0 auto;
	padding-top:30px;
	padding-bottom:30px;
	width:95%;
	height:auto;
}

#banner #banner01 a{
	display:none;
	width:930px;
	height:80px;
	text-decoration:none;
	-webkit-transition:0.4s;
	transition:0.4s;
}

#banner #banner01 a:hover{
	background-image:none;
}

#banner #banner02 a{
	clear:left;
	display:block;
	margin:0 auto;
	width:95%;
	height:70px;
	text-align:center;
	text-decoration:none;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:17px;
	font-weight:bold;
	color:#390;
	background:#FFF;
	line-height:70px;
	border:#390 5px solid;
	-webkit-transition:0.4s;
	transition:0.4s;
}

#banner #banner02 a:hover{
	background:#FFF;
}

#banner #banner03{
	display:block;
	margin-top:20px;
	text-align:center;
}

/*------------------------------------------------------------
	空室検索
------------------------------------------------------------*/
#index1{
	clear:left;
	display:none;
	width:100%;
	height:200px;
}

#index1 section{
	clear:left;
	margin:0 auto;
	width:1300px;
}

#index1 h1{
	margin-bottom:20px;
	text-align:center;
	font-family:serif;
	font-size:28px;
	color:#000;
}

#index1 #search{
	margin-bottom:20px;
	width:1300px;
	height:100px;
	background:#d3b9a6;
}

#index1 #title{
	float:left;
	margin-top:20px;
	margin-left:30px;
	margin-right:20px;
	width:100px;
	height:50px;
	font-family:serif;
	font-size:14px;
	text-align:center;
	line-height:50px;
	border:#44443f 1px dotted;
}

#index1 #search #box{
	float:left;
	margin-top:22px;
}

#index1 #search .btn01{
	float:left;
	margin-top:30px;
	margin-left:30px;
	padding:7px 28px 6px 28px;
	color:#FFF;
	text-decoration:none;
	background:#421e04;
	border:0;
}

#index1 #search .btn02 a{
	float:left;
    display:block;
    overflow:hidden;
	margin-top:30px;
	margin-left:10px;
	padding:5px 28px;
	text-align:center;
	text-decoration:none;
	color:#FFF;
	background:#900;
	-webkit-transition:0.4s;
	transition:0.4s;
}

#index1 #search .btn02 a:hover{
	background:#421e04;
}

/*------------------------------------------------------------
	おすすめプラン
------------------------------------------------------------*/
#index2{
	clear:left;
	display:none;
	width:100%;
	height:auto;
	text-align:center;
}

#index2 section{
	clear:left;
	margin:0 auto;
	width:95%;
	height:auto;
}

#index2 #img{
	clear:left;
	display:flex;
}

#index2 #img .pic{
	flex:1;
	margin-left:10px;
	padding-bottom:100px;
}

#index2 #img ul{
	margin-top:10px;
	font-size:14px;
	line-height:2em;
}

#index2 #img h1{
	clear:left;
	padding:10px 0;
	text-align:center;
	font-weight:bold;
	font-family:serif;
	font-size:17px;
	background:#d3b9a6;
}

#index2 .btn01 a{
	clear:left;
    display:block;
    overflow:hidden;
	margin:0 auto;
	margin-top:10px;
	width:400px;
	height:50px;
	line-height:50px;
	text-align:center;
	text-decoration:none;
	font-family:"ヒラギノ角ゴ Pro W3", "Hiragino Kaku Gothic Pro", "メイリオ", Meiryo, Osaka, "ＭＳ Ｐゴシック", "MS PGothic", sans-serif;
	font-size:14px;
	color:#FFF;
	background:#421e04;
	-webkit-transition:0.4s;
	transition:0.4s;
}

#index2 .btn01 a:hover{
	color:#FFF;
	background:#de6e00;
}

/*------------------------------------------------------------
	紹介
------------------------------------------------------------*/
#index3{
	clear:left;
	width:100%;
	height:auto;
	background:none;
}

#index3 section{
	clear:left;
	margin:0 auto;
	padding-top:30px;
	width:95%;
	height:auto;
}

#index3 #img1{
	float:none;
	padding-bottom:20px;
	text-align:center;
	width:100%;
	height:auto;
}

#index3 #img1 h1{
	float:none;
	width:100%;
	height:auto;
	font-family:serif;
	font-size:30px;
	color:#333;
	writing-mode:horizontal-tb;
	border-right:none;
}

#index3 #img1 h1 span{
	font-size:20px;
}

#index3 #img1 ul{
	float:none;
	padding-top:30px;
	width:auto;
	text-align:left;
	font-family:serif;
	font-size:15px;
	line-height:2em;
}


#index3 #img1 .pic{
	margin-top:30px;
	display:none;
}

#index3 #img2{
	float:none;
	padding-bottom:50px;
	width:100%;
	height:auto;
}

#index3 a{
	display:block;
	margin:0 auto;
	margin-top:30px;
	padding:10px 0;
	width:350px;
	color:#000;
	font-family:serif;
	font-size:16px;
	text-align:center;
	text-decoration:none;
	border:#333 1px dotted;
	-webkit-transition:0.4s;
	transition:0.4s;
}

#index3 a:hover{
	color:#FFF;
	background:#966;
	border:#663333 1px dotted;
}

/*------------------------------------------------------------
	ホテルグループ相互リンク #421e04
------------------------------------------------------------*/
#index4{
	clear:left;
	margin:0 auto;
	width:100%;
	height:auto;
	background:url(../index/index7_bg.jpg);
}

#index4 section{
	clear:left;
	margin:0 auto;
	padding-top:50px;
	width:95%;
	height:auto;
}

#index4 #box1{
	float:left;
	display:none;
	width:250px;
}

#index4 #box1 img{
	margin-bottom:10px;
}

#index4 #box2{
	float:none;
	margin-left:0;
	width:100%;
}

#index4 #box2 h1{
	padding-top:0;
	margin-bottom:20px;
	text-align:center;
	font-family:serif;
	font-size:24px;
	color:#CC9;
}

#index4 #box3{
	clear:left;
	display:none;
	width:100%;
	height:auto;
}

#index4 #box3 p{
	float:left;
	width:225px;
	width:150px;
}

#index4 #box3 #tominoko{
	float:left;
	display:block;
	width:588px;
	height:150px;
	background:#018cba;
	border:#000 1px solid;
}

#index4 #box3 #jiragon{
	float:left;
	display:block;
	margin-left:20px;
	width:588px;
	height:150px;
	background:#006666;
	border:#000 1px solid;
}

#index4 #box3 ul{
	float:right;
	padding:20px;
	width:325px;
	height:110px;
}

#index4 #box3 ul img{
	margin-bottom:15px;
}

#index4 h2{
	clear:left;
	font-size:13px;
	color:#FFF;
	font-weight:normal;
	line-height:50px;
}

#index4 #box3 a{
	color:#FFF;
	-webkit-transition:0.4s;
	transition:0.4s;
}
 
#index4 #box3 a:hover{
	color:#FFF;
}

#index4 #box3 h2 a{
	color:#C96;
	-webkit-transition:0.4s;
	transition:0.4s;
}
 
#index4 #box3 h2 a:hover{
	color:#C63;
}

}