@charset "utf-8";
/*********************************************************************
*
*  </j/common/css/gallery.css>
*
*  ※</j/common/js/gallery.js> とともに使用を想定。
*
*********************************************************************/

/* ----- #gallery ----- */
#gallery {
  position: relative;
  top: -5px;
  height: 440px; /* KV (見えている領域) の高さ */
  overflow: hidden;
  text-align: center;
}
#gallery .inner {
  position: relative;
  top: -440px;   /* 画像の実際の高さ */
  width: 920px;
  height: 440px; /* KV (見えている領域) の高さ */
  margin: 0 auto;
  overflow: hidden;
}
#gallery h1 {
  position: absolute;
  top: 168px;
  z-index: 10;
}
#gallery p.lead {
  position: absolute;
  top: 216px;
  z-index: 10;
}
/* .slider_area */
#gallery {
  width: 100% !important;
}
#gallery .caroufredsel_wrapper {
  width: 100% !important;
}
#gallery .keyvisual ul {
  width: 100%;
}
#gallery .keyvisual li {
  position: absolute;
  top: 0;
  width: 100%;
  height: 440px; /* 画像の実際の高さ */
  background-position: 50% 0;
  background-repeat: no-repeat;
  z-index: 1;
}
#gallery .keyvisual li:first-child {
  z-index: 10;
}
/* .slide_thumbnail */
#gallery .slide_thumbnail {
  position: absolute;
  bottom: 0;
  right: 1px;
  padding: 9px 0 0 0;
  background: url(/j/common/img/nav_gallery_bg.png) no-repeat 0 0;
  z-index: 11;
}
#gallery .slide_thumbnail .slide_thumbnail_inner {
  display: none;
  padding: 0 10px 10px 10px;
  background: #fff;
}
#gallery .slide_thumbnail ul li {
  position: relative;
  height: 50px;
  padding: 0 0 10px 0;
}
#gallery .slide_thumbnail ul li img {
  height: 50px;
}
#gallery .slide_thumbnail ul li img:hover {
  filter: alpha(opacity=80);
  opacity: 0.8;
  cursor: pointer;
}
#gallery .slide_thumbnail ul li span {
  display: none;
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 50px;
  /* 画像の指定は各ホテル毎のCSSに記述 */
}
#gallery .slide_thumbnail ul li.current span {
  display: block;
}
#gallery .slide_thumbnail .trigger {
  width: 90px;
  height: 14px;
  overflow: hidden;
  background: #fff url(/j/common/img/nav_gallery.png) no-repeat 0 0;
  text-indent: -999px;
  cursor: pointer;
}
#gallery .slide_thumbnail .trigger:hover {
  background-position: 0 -14px;
}
#gallery .slide_thumbnail.open .trigger {
  background-position: 0 -28px;
}
#gallery .slide_thumbnail.open .trigger:hover {
  background-position: 0 100%;
}
#gallery .slide_thumbnail .prev,
#gallery .slide_thumbnail .next {
  width: 70px;
  height: 15px;
  overflow: hidden;
  margin: 0 auto;
  background: #fff url(/j/common/img/nav_gallery_thum.png) no-repeat 0 0;
  text-indent: -999px;
  cursor: pointer;
}
#gallery .slide_thumbnail .prev {
  margin: 0 0 10px 0;
}
#gallery .slide_thumbnail .next {
  background-position: 100% 0;
}
#gallery .slide_thumbnail .prev:hover {
  background-position: 0 -15px;
}
#gallery .slide_thumbnail .next:hover {
  background-position: 100% -15px;
}
/* ナビゲーション非活性 */
#gallery .slide_thumbnail.nav_disabled .prev,
#gallery .slide_thumbnail.stopPrev .prev {
  background-position: 0 -30px;
  cursor: default;
}
#gallery .slide_thumbnail.stopNext .next,
#gallery .slide_thumbnail.nav_disabled .next {
  background-position: 100% -30px;
  cursor: default;
}
/* 5個より多い */
#gallery .slide_thumbnail.carousel .carousel {
  height: 300px;
  overflow: hidden;
  position: relative;
}
#gallery .slide_thumbnail.carousel .carousel ul{
  position: absolute;
  top: 0;
}
/* .slider_page */
#gallery .slider_page {
  position: absolute;
  top: auto;
  bottom: 20px;
  right: 104px;
  overflow: hidden;
  float: none;
  z-index: 11;
  *zoom: 1;
}
#gallery .slider_page a {
  margin-right: 8px;
}