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

 file name  :index.css
 author     :Ability Consultant
style info  :トップページ設定ハックは最下部に記述
=================================================================== */


/* -----------------------------------------------------------
	各ページ専用指定
----------------------------------------------------------- */

/* swf
----------------------------------------------------------- */
#page {
	/*border-top: none;*/
	background: none;
}


/* swf
----------------------------------------------------------- */
#index #con_swf {
	width: 100%;
	height: 467px;
	background-color: #ebc9c9;
	background-image: url(../images/top/bg_flash.jpg), url(../images/bg_swf.gif);
	background-repeat: no-repeat, repeat-x;
	background-position: center, center;
	z-index: 1;
}
#index #con_swf .box_swf {
	width: 1280px;
	margin: auto;
	background: #f6efee;
}

/* header
----------------------------------------------------------- */
#index #header {
	margin: -469px auto 0 auto;
	position: relative;
	z-index: 5;
}



/* #contents
----------------------------------------------------------- */
#index #contents {
	width: 100%;
	margin: 10px auto 0 auto;
	background: url(../images/bg_contents_flow.gif) no-repeat center 298px;
	position: relative;
	z-index: 10;
}

.bnr_plan {
	width: 1280px;
	margin: 0 auto;
	overflow: hidden;
}
.bnr_plan ul {
	position: absolute;
	width: 290px;
	/*width: 368px;*/
	top: 152px;
	left: 73%;
	/*left: 48%; 2つの場合*/
	overflow: hidden;
}
.bnr_plan ul li {
	float: left;
	margin-right: 10px;
}
.bnr_plan ul li:last-child {
	margin-right: 0;
}
.bnr_plan ul li a img {
	width: 100%;
}


/* main
----------------------------------------------------------- */
#index #main {
	margin: 320px 0 0 0;
	padding: 0; /* common指定の上書き */
	min-height: 600px;
	background: none;
}

#index #main .line {
	width: 711px;
	height: 2px;
	margin: 10px auto;
	background: url(../images/top/ic_line_main.gif) no-repeat 0 0;
}


/*---------------------------------------------------
	top slick
--------------------------------------------------*/
.box_swf{
	height: 469px;
}

#con_swf .box_swf .slide-top .slick-prev {
  display: inline-block;
  top: 46%;
  left: 30px;
   z-index: 99;
}

#con_swf .box_swf .slide-top .slick-prev::before{
  content: '';
  width: 20px;
  height: 20px;
  border: 0px;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  -ms-transform: rotate(-135deg);
  -webkit-transform: rotate(-135deg);
  transform: rotate(-135deg);
  position: absolute;
  margin-top: -4px;
}

#con_swf .box_swf .slide-top .slick-next {
  display: inline-block;
  right: 50px;
  top: 46%;
  z-index: 99;
}

#con_swf .box_swf .slide-top .slick-next::before{
  content: '';
  width: 20px;
  height: 20px;
  border: 0px;
  border-top: solid 2px #fff;
  border-right: solid 2px #fff;
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  position: absolute;
  margin-top: -4px;
}

#con_swf .box_swf .slide-top .slick-dots {
	bottom: 160px;
	text-align: center;
}

#con_swf .box_swf .slide-top .slick-dots li {
	z-index: 99;
	display: inline-block;
	width: 16px;
	height: 17px;
	margin: 0 5px;
	float: none;
}

#con_swf .box_swf .slide-top .slick-dots li button {
	height: 17px;
	width: 16px;
	background: #fff;
	border-radius: 50%;
}

#con_swf .box_swf  .slide-top .slick-dots li button:before {
	content: '';
}

#con_swf .box_swf .slide-top .slick-dots li.slick-active button {
	background: #c17979;
}

/* -----------------------------------------------------------
	top予約ボタン
----------------------------------------------------------- */
.wrp_reservations {
	width: 1280px;
	margin: auto;
	position: relative;

}

.box_reservations {
	/* margin-top: -40px; */
	position: absolute;
	right: 10px;
	top: -160px;
}

.box_reservations .img_fuki {
	animation: cloud ease-in-out 1.5s infinite alternate;
	/* position: absolute;
	right: 5px;
	top: -105px; */
}

.box_reservations .btn_res {
	animation: flower ease-in-out 2s infinite alternate;
	position: absolute;
	left: 60px;
	bottom: -105px;
	z-index: 999;
}

.box_reservations .btn_res a:hover {
	opacity: 0.85;
}

@keyframes cloud {
	0% { transform: translate(0%, 0%); }
	100% { transform: translate(0%, -8px); }
}

/* @-ms-keyframes cloud {
	100% {
		margin-top: -8px;
	}
} */

@keyframes flower {
	0% { transform: rotate(-7deg); }
	100% { transform: rotate(7deg); }
}

/* -----------------------------------------------------------
	topバナー
----------------------------------------------------------- */
#index #main .bn_news {
	margin-bottom: 15px;
}

#index #main .bn_news img {
	width: 100%;
}

/*#index #main .box_movie {
	width: 80%;
	margin: 0 auto 30px;
}
#index #main .box_movie iframe {
	width: 100%;
	height: 380px;
}*/

#index #main .box_bn {
	width: 740px;
	overflow: hidden;
}

#index #main .box_bn p {
	float: left;
}

#index #main .box_bn p.last {
	margin: 0 0 0 19px;
}

#index #main .box_goto p a:hover {
	opacity: .8;
}

#index #main .box_bestrate {
	margin-bottom: 30px;
}

#index #main .box_bestrate p a:hover {
	opacity: .8;
}


/* -----------------------------------------------------------
	震災メッセージ
----------------------------------------------------------- */


#index #main .oshirase {
	text-align: center;
	border: 1px solid #fff;
	padding-top: 10px;
	padding-right: 10px;
	padding-bottom: 10px;
	padding-left: 10px;
	margin-bottom: 10px;
}

#index #main .oshirase .tit {
	text-align: left;
	font-size: 100%;
	font-weight: bold;
	margin-bottom: 3px;
}

#main .oshirase p {
	font-size: 97%;
	line-height:1.3;
	text-align:left;
}


#index #main .oshirase .shomei {
	font-weight: bold;
	margin-right:10px;
	text-align: right;
}



/* -----------------------------------------------------------
	バナー部分
----------------------------------------------------------- */
#index h2 {
	margin: 0 0 10px 0;
}

#index .con_mainbn {
	width: 740px;
	margin: 0 0 20px 0;
	overflow: hidden;
}

/* -----------------------------------------------------------
	ボタン部分
----------------------------------------------------------- */
#index ul.con_btn{
	width:730px;
	margin:0 0 20px 10px;
	overflow:hidden;
}

#index ul.con_btn li{
	float:left;
	padding-right:15px;
	padding-bottom:5px;
}

#index ul.con_btn li.last{
	padding-right:0px;
}

#con_info{
	width:730px;
	margin:0 0 30px 10px;
	clear: both;
	overflow: hidden;
}

#con_info .con_room{
	float:left;
	margin-right:15px;
}

#con_blog {
	width: 217px;
	height: 175px;
	overflow: hidden;
	float: left;
}

#con_blog .box_img{
	width: 217px;
	height: 113px;
	overflow:hidden;
	position:relative;
}
#con_blog .box_img img{
	width: 217px;
}

#con_blog .box_img .frame{
	position:absolute;
	top:0;
	left:0;
}
#con_blog .st{
	margin: 5px 0 0 0;
}
#con_blog p.blogtitle{
	font-weight: bold;
	margin:0;
	font-size: 14px;
}

#con_blog p.blogtext {
	font-size: 13px;
}

#con_blog a{
	text-decoration:none;
	color:#643c3b;
}
#con_blog a:hover{
	color: #b96500;
}


/*#con_news {
	background-color: #e1bdbd;
	padding: 10px;
	width: 340px;
	float: right;
}

#con_news ul#newslist {
	margin-top: 15px;
	border-top: 1px solid #b97575;
}

#con_news ul#newslist li{
	width: 330px;
	border-bottom: 1px dotted #b18787;
	overflow:hidden;
	padding: 5px 0 5px 10px;
}
#con_news ul#newslist li p.date{
	width: 80px;
	float: left;
	margin-right: 20px;
}
#con_news ul#newslist li p{
	margin-bottom:0;
}
#con_news ul#newslist li a:link{
	text-decoration:none;
	color:#333333;
}
#con_news ul#newslist li a:hover{
	color: #b96500;
}*/


/* -----------------------------------------------------------
	プラン表示部分
----------------------------------------------------------- */
#index #main h3{
	padding: 0 0 10px 0;
}

#index #con_plan {
	width: 740px;
	background-color: #faeaea;
}

#index #con_plan h3 {
	width: 740px;
	height: 48px;
	background: url(../images/top/bg_plan_top.gif) no-repeat left bottom;
}

#index #con_plan #plan_list {
	width: 740px;
	min-height: 370px;
	/*margin: 10px 0 0 0;*/
	padding: 15px 0;
}

/* tabnav タブメニュー
----------------------------------------------------------- */
#index #con_plan ul.tabnav {
	width: 711px;
	height: 30px;
	margin: 0 auto;
	background: url(../images/top/tab_plan.gif) no-repeat 0 0;
	border-bottom: 8px #dabfbf solid;
	text-indent: -9998px;
	overflow: hidden;
}

#index #con_plan ul.tabnav li {
	width: 160px;
	height: 30px;
	float: left;
}

#index #con_plan ul.tabnav li a {
	width: 100%;
	height: 100%;
	display: block;
	overflow: hidden;
}

#index #con_plan ul.tabnav li.tab_plan01 a:hover,
#index #con_plan ul.tabnav li.tab_plan01 a.active {
	background: url(../images/top/tab_plan.gif) no-repeat 0 -30px;
}

#index #con_plan ul.tabnav li.tab_plan02 a:hover,
#index #con_plan ul.tabnav li.tab_plan02 a.active {
	background: url(../images/top/tab_plan.gif) no-repeat -160px -30px;
}

#index #con_plan ul.tabnav li.tab_plan03 a:hover,
#index #con_plan ul.tabnav li.tab_plan03 a.active {
	background: url(../images/top/tab_plan.gif) no-repeat -320px -30px;
}

#index #con_plan ul.tabnav li.tab_plan04 a:hover,
#index #con_plan ul.tabnav li.tab_plan04 a.active {
	background: url(../images/top/tab_plan.gif) no-repeat -480px -30px;
}


/* タブ表示部分 */
#index #con_plan #plan_list .box_tab {
	width: 691px;
	margin: 0 auto;
	padding: 10px 0 10px 20px;
	background: url(../images/top/bg_plan_main.gif) no-repeat right bottom #fff;
	overflow: hidden;
}

#index #con_plan #plan_list .box_tab .list_plan {
	width: 320px;
	margin: -1px 0 0 -1px;
	padding: 0 10px 0 0;
	border: 1px #e6cfcf solid;
	overflow: hidden;
	float: left;
}

#index #con_plan #plan_list .box_tab .list_plan .photo {
	padding: 10px;
	float: left;
}

#index #con_plan #plan_list .box_tab .list_plan .photo img {
	border: 3px #d8ceb4 solid;
}

#index #con_plan #plan_list .box_tab .list_plan .txt {
	padding: 10px 0 0 0;
	overflow: hidden;
	zoom: 1;
}

#index #con_plan #plan_list .box_tab .txtnav {
	clear: both;
	text-align: right;
	padding: 10px 30px 0 0;
}



/* con_pickup ピックアップ
----------------------------------------------------------- */
#index .con_pickup {
	width: 711px;
	margin: 0 auto;
	padding: 0 0 20px 0;
	clear: both;
}

#index .con_pickup h5 {
	margin: 0 0 10px 0;
}

/* con_news 新着情報
----------------------------------------------------------- */
#index .con_news {
	font-size: 13px;
	width: 700px;
	background: #E1BDBD;
	margin: 22px 0 38px 0;
	padding: 10px 20px;
	overflow: hidden;
}

#index .con_news .box_news {
	width: 340px;
	float: left;
	overflow: hidden;
	padding: 10px 0;
	border-top: #b97575 1px solid;
	border-bottom: #b97575 1px solid;
	position: relative;
}

#index .con_news .box_news .img {
	max-width: 143px;
	max-height: 114px;
	background: #fff;
	margin: 0;
	padding: 3px;
	border: #C9C7B8 1px solid;
	float: left;
}

#index .con_news .box_news .img img {
	max-height: 107px;
}

#index .con_news .box_news .box_detail {
	float: left;
	overflow: hidden;
	width: 173px;
	margin: 0 0 0 10px;
}

#index .con_news .box_news .box_detail span {
	color: #fff;
	background: #b1523c;
	padding: 3px;
}

#index .con_news .box_news .box_detail p {
	margin: 5px 0 0 0;
}

#index .con_news .box_news .box_detail p a:link {
	color: #333;
	text-decoration: none;
}

#index .con_news .box_news .box_detail p a:hover {
	color: #b96500;
}

#index .con_news .box_news .box_detail p a:visited {
	color: #c67474;
}

#index .con_news .right {
	margin: 0 0 0 20px;
}

/* box_best プランベスト3
----------------------------------------------------------- */
#index .box_best {
	width: 720px;
	padding: 10px;
	background: #fff;
	overflow: hidden;
	margin: 0 0 38px 0;
	font-size: 15px;
	position: relative;
}

#index .box_best .txt_ttl {
	font-weight: bold;
}

#index .box_best .txt_prc {
	text-align: right;
	font-size: 14px;
	font-weight: bold;
}

#index .box_best .box_plan {
	width: 313px;
	position: relative;
	overflow: hidden;
	float: left;
}

#index .box_best .box_plan .icn {
	margin: 0;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 99;
}

#index .box_best .box_plan .img {
	width: 301px;
	padding: 5px;
	border: #C9C7B8 1px solid;
}

#index .box_best .box_right {
	width: 380px;
	float: left;
	margin: 0 0 0 27px;
	overflow: hidden;
}

#index .box_best .box_right .box_plan_sec {
	overflow: hidden;
	margin: 0 0 15px 0;
	position: relative;
}

#index .box_best .box_right .thd {
	margin: 0;
}

#index .box_best .box_right .box_plan_sec .icn {
	margin: 0;
	position: absolute;
	top: 0;
	left: 0;
	z-index: 100;
}

#index .box_best .box_right .box_plan_sec .img {
	width: 96%;
	padding: 5px;
	border: #C9C7B8 1px solid;
	position: relative;
	text-align: center;
}

#index .box_best .box_right .box_plan_sec .img img {
	width: 60%;
	height: 60%;
}

#index .box_best .box_right .box_plan_sec .txt_ttl {
	/*float: left;*/
	width: 96%;
	margin: 0 0 0 10px;
}

#index .box_best .box_right .box_plan_sec .txt_prc {
	/*float: left;*/
	width: 96%;
	margin: 0 0 0 10px;
}

#index .box_best .btn_plan {
	position: absolute;
	bottom: 10px;
	/* right: 10px; */
	margin: 0;
}

/* box_scene 宿泊目的から選ぶ
----------------------------------------------------------- */
#index .box_scene .lst_scene {
	overflow: hidden;
	width: 740px;
}

#index .box_scene .lst_scene li {
	float: left;
	margin: 0 4px 4px 0;
}

#index .box_scene .lst_scene li.last {
	margin: 0 0 4px 0;
}

#index .box_scene .btn_plan {
	text-align: right;
	margin: 0 0 38px 0;
}

/* con_pckup ピックアップ
----------------------------------------------------------- */
#index .con_pckup {
	overflow: hidden;
	margin: 0 0 38px 0;
}

#index .con_pckup .box_bnn {
	/*width: 477px;
	float: left;*/
	overflow: hidden;
	/*margin: 13px 0 0 0;*/
}

#index .con_pckup .box_bnn ul {
	overflow: hidden;
}

#index .con_pckup .box_bnn ul li {
	float: left;
	margin: 0 20px 13px 0;
}

#index .con_pckup .box_bnn ul li.last {
	margin-right: 0;
}

#index .con_pckup .box_movie {
	float: left;
	width: 253px;
	margin: 27px 0 0 10px;
}

#index .con_pckup .box_movie iframe {
	width: 100%;
	height: 158px;
}

/*#index .con_pckup .box_blog {
	float: left;
	width: 217px;
	margin: 0 0 0 23px;
}*/

/* con_sns フェイスブック・インスタグラム
----------------------------------------------------------- */
.con_sns {
	overflow: hidden;
	margin-bottom: 50px;
}
.con_sns .box_fb {
	float: left;
	width: 433px;
}
.con_sns .box_fb iframe {
	width: 100%;
}
.con_sns .box_ig {
	float: right;
	width: 264px;
}
.con_sns .box_ig ul {
	overflow: hidden;
	margin: -8px 0 10px;
}
.con_sns .box_ig ul li {
	float: left;
	width: 128px;
	margin: 8px 8px 0 0;
}
.con_sns .box_ig ul li:nth-child(2n) {
	margin-right: 0;
}
.con_sns .box_ig ul li a {
	display: block;
}
.con_sns .box_ig ul li img {
	width: 100%;
}

/* facebook button
----------------------------------------------------------- */
/*#header .con_social{
	width:100px;
	float:left;
	padding:27px 0 0 60px;
}

#header .con_social .fb-like.fb_edge_widget_with_comment.fb_iframe_widget {
	width:100px;
	position:absolute;
	left:260px;
	top:27px;
	height:20px;
}*/

/* facebook like box
----------------------------------------------------------- */
/*.con_sns{
	width: 186px;
	margin: 10px auto;
	text-align:center;
	background:#ffffff;
}*/

/*======================================

	hack - 各種cssハック - for IE7

=======================================*/
*:first-child+html #header .con_social .pluginSkinLight{
	letter-spacing:1em;
	text-indent:1.5em;
	}
*:first-child+html .pluginButton {
	padding-left:15px !important;
}

/*======================================

	hack - 各種cssハック - for IE6

=======================================*/

/* 背景色表示のための高さバグ対策 */
* html #index #main {height: 600px;}
* html #index .con_plan .plan_list {height: 500px;}

#header #hnav {
	margin: 0;
	float: none;
	position: absolute;
	right: 100px;
	top: 20px;
}