@charset "UTF-8";

header {
		position: fixed;
		top: 0;
		left: 0;
		z-index: 20;
		width: 100%;
		padding:0 0;
		transition: .5s;
	}

header:hover{
		background: #2F305A;
}

.is-animation {
		background: #2F305A;
		-webkit-box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.2);
		box-shadow: 0 0 4px 0 rgba(0, 0, 0, 0.2);
	}

/* header #logo */

header #logo{
	width:238px;
	height:60px;
	margin:18px 0;
	float:left;
	background-image: url(../../images/common/logo.png);
	background-size:auto 60px;
	background-repeat: no-repeat;
	transition: .1s;
}

header:hover #logo{
	width:238px;
	height:60px;
	background-image: url(../../images/common/logow.png);
}

.is-animation #logo{
	width:238px;
	height:60px;
	background-image: url(../../images/common/logow.png);
}

header #logo a{
	width:238px;
	height:60px;
	text-decoration:none;
	display: block;
	text-indent:-9999px;
	}

@media only screen and  (max-width: 800px) {
header #logo{
	width:178px;
	height:45px;
	background-size:auto 45px;
	margin:8px 0 8px;
}

header:hover #logo{
	width:178px;
	height:45px;
}

.is-animation #logo{
	width:178px;
	height:45px;
}

header #logo a{
	width:178px;
	height:45px;
	text-decoration:none;
	display: block;
	text-indent:-9999px;
	}
}

/*topimg
---------------------------------------------------------------------------*/
.topimg {
  position: relative;
  width: 100%;
  height: 100vh;
  min-height: 400px;
  z-index:1;
  box-shadow:inset 0 1px 5px rgba(96,51,11,.6);
  background-color: #0A51A1;
}
		
#slider {
  overflow: hidden;
  width: 100%;
  min-height: 400px;
  height: 100vh;
}

@media screen and (max-width: 568px) {
.topimg {
  background-image: url(../../images/slider.jpg);
  background-position: center center;
  background-repeat: no-repeat;
  background-attachment: scroll;
  background-size: cover;
  height: 90vh;
  margin-bottom:10px;
}

#slider {
  display:none;
}
}

@media screen and (max-width: 400px) {
.topimg {
  background-position: 35% center;
}
}

#top_row {
	width: 100%;
	height:75%;
	position:absolute;
	top:25%;
	z-index:1;
}

/* top_info
================================================== */
#top_info  {
  color: #fff;
  position: relative;
  width:100%;
  max-width:1000px;
  height:100%;
  margin:0 auto;
  box-sizing: border-box;
  text-align: center;
}

#top_info h2 {
  font-size: 2.8em;
  letter-spacing:0.05em;
  color: #FFF;
  font-weight: 600;
  text-shadow:1px 1px 1px #0A51A1;
  font-family : "Times New Roman", "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "メイリオ", Meiryo, serif;
}

@media screen and (max-width: 800px) {
#top_info h2  {
  font-size: 30px;
  line-height: 40px;
}
}

@media screen and (max-width: 568px) {
#top_info h2  {
  font-size: 24px;
  line-height: 34px;
}
}

#top_info .top_text {
  font-size: 1.2em;
  font-weight: 600;
  line-height: 1.2;
  color: #FFF;
  text-shadow:0.05em 0.05em 1px #0A51A1;
  margin:10px auto 0;
}

@media screen and (max-width: 568px) {
#top_info .top_text {
  font-size: 0.9em;
  letter-spacing:0em;
}
}

#top_info .catch {
  font-size: 1em;
  line-height: 1.8;
  color: #FFF;
  text-shadow:1px 1px 1px #0A51A1;
  position:absolute;
  bottom:140px;
  width:100%;
  text-align: center;
}

@media screen and (max-width: 800px) {
#top_info .catch {
  display:none;
}
}

.scr {
  position: absolute;
  width: 83px;
  height: 61px;
  margin-left:-41px;
  bottom:25px;
  left:50%;
  z-index:1;
}

.scr img{
  width: 83px;
  height: 61px;
}


@media screen and (max-width: 800px) {
.scr {
  bottom:5%;
}
}

/* hotel_info
--------------------------------------------------*/
.hotel_info {
    width: 100%;
	margin: 5% auto 2%;
}

.sh_logo {
    width: 240px;
	text-align: center;
	margin: 0 auto 2%;
}

.sh_logo img{
    width: 100%;
	height:auto;
}

.sh_text {
	line-height:1.8;
	text-align: center;
}

@media screen and (max-width: 800px) {
.hotel_info {
    width: 96%;
	margin: 5% 2% 2%;
}
}

@media screen and (max-width: 568px) {
.sh_text {
  line-height:1.6;
  font-size:0.9em;
  text-align: left;
}
}

/* sisetu_box
---------------------------------------------------------------------------*/
.sisetu_box {
  position: relative;
  margin: 0;
  padding: 2% 0;
  float:left;
}

@media screen and (max-width: 800px) {
.sisetu_box {
  width:96%;
  margin: 0 2%;
}
}

@media screen and (max-width: 568px) {
.sisetu_box {
  width:98%;
  margin: 0 1%;
}
}


.sisetu_box .w33{
	width:33.3333%;
	box-sizing: border-box;
	padding:0 2%;
	float:left;
}

@media screen and (max-width: 1280px) {
.sisetu_box .w33{
  padding:0 1%;
}
}

@media screen and (max-width: 800px) {
.sisetu_box .w33{
  width:50%;
}
}

@media screen and (max-width: 568px) {
.sisetu_box .w33{
  width:100%;
  float:none;
}
}

#lb{
	background-image: url(../../images/top/bg_lb.gif) ;
	}
	
#bl{
	background-image: url(../../images/top/bg_bl.gif) ;
	}

#dbl{
	background-image: url(../../images/top/bg_dbl.gif) ;
	}

.sisetu_list {
    width:100%;
	height: auto;
	margin: 0;
	position: relative;
	-moz-box-shadow: 0 1px 3px #C2C2C2;
	-webkit-box-shadow: 0 1px 3px #C2C2C2;
	box-shadow: 0 1px 3px #C2C2C2;
	background-size:100% auto;
	background-position: top left;
	background-repeat: repeat-y;
	padding:3% 3%;
	box-sizing: border-box;
}

@media screen and (max-width: 800px) {
.sisetu_list {
  margin-bottom:15px;
}
}

@media screen and (max-width: 568px) {
.sisetu_list {
  margin-bottom:15px;
}
}

.st_name {
    width:100%;
	height: auto;
	margin: 0 auto 2%;
	text-align	: center;
	line-height:1.4;
	color:#FFF;
}

.st_name .ena{
    font-weight:500;
	font-size:1.2em;
	letter-spacing:0em;
}

@media screen and (max-width: 1280px) {
.st_name .ena{
  font-size:1em;
}
}

@media screen and (max-width: 800px) {
.st_name .ena{
  font-size:1.2em;
}
}

.st_name h3{
    font-weight:500;
	font-size:0.9em;
	font-family: 'Noto Sans Japanese', sans-serif;
}

.sisetu_list .photo{
	width:98%;
	height: auto;
	display:block;
	position: relative;
	overflow: hidden;
	margin:1%;
	}

.sisetu_list .photo img{
	width:100%;
	height: auto;
}

.sisetu_box figure img {
  -webkit-transform: scale3d(1, 1, 1);
  transform: scale3d(1, 1, 1);
  -webkit-transition: -webkit-transform 300ms;
  transition: transform 300ms;
}
.sisetu_box figure:hover img {
  -webkit-transform: scale3d(1.1, 1.1, 1);
  transform: scale3d(1.1, 1.1, 1);
}

.st_text{
	padding:1% 2%;
	font-size:0.9em;
	color:#FFF;
	letter-spacing:0.05em;
}

.st_bt{
	letter-spacing	: 0.05em;
	margin:5px auto 8px;
	text-align: center;
}

@media screen and (max-width: 568px) {
.st_bt{
	font-size:14px;
}
}
.st_bt a{font-size:13px;color:#FFF;text-decoration:none;background-color:#2F305A;padding:4px 10px;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px;}
.st_bt a:hover{color:#FFF;text-decoration:none;background-color:#5456A5;}

@media screen and (max-width: 568px) {
.st_bt:hover{
	margin-bottom:0;
	font-size:14px;
}
}

/* info_box
--------------------------------------------------*/
.info_box {
    width: 92%;
	margin: 2% 4% 7%;
	float:left;
}

@media screen and (max-width: 1280px) {
.info_box {
	width: 96%;
	margin: 2% 2% 7%;
	}
}

@media screen and (max-width: 800px) {
.info_box {
	width: 94%;
	margin: 2% 3% 7%;
	}
}

@media screen and (max-width: 568px) {
.info_box {
	width: 96%;
	margin: 2% 2% 7%;
	}
}

.info_box h5 {
  margin-bottom: 25px;
  width: 100%;
  font-size:2.4em;
  font-weight:500;
  text-align: center;
  font-family : "Times New Roman", "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "メイリオ", Meiryo, serif;
}


/* map
--------------------------------------- */
.map{
	width:43%;
	margin:2% 0 20px;
	float:left;
}

.map img{
	width:100%;
	height:auto;
	max-width:516px;
	margin:0 auto 10px;
}

@media screen and (max-width: 800px) {
.map{
	width:50%;
	margin:0 0 20px;
}
}

@media screen and (max-width: 568px) {
.map{
	width:94%;
	float:none;
	margin:0 2%;
}
}

/* map_text
--------------------------------------- */
.map_text{
	width: 50%;
	margin:1% 0 1%;
	float:right;
}

@media screen and (max-width: 800px) {
.map_text{
	width: 45%;
}
}

@media screen and (max-width: 568px) {
.map_text{
	width: 98%;
	margin:0 1% 20px;
	float:none;
}
}

.map_text p{
	margin-bottom: 5px;
	font-size: 0.9em;
}

@media screen and (max-width: 800px) {
.map_text p{
	margin-bottom: 10px;
}
}

@media screen and (max-width: 568px) {
.map_text p{
	margin-bottom: 5px;
}
}

.map_text strong{
	color:#17A0D3;
	font-size: 1.4em;
}

/* topic_left
--------------------------------------- */
.topic_left{
	width: 50%;
	margin:0 0 2% 0;
	float:right;
}


@media screen and (max-width: 800px) {
.topic_left{
	width: 100%;
	margin:0 0 0;
	clear:both;
	float:none;
}
}

.top_menu{
	width:100%;
	margin:0 0 4%;
	
}

@media screen and (max-width: 800px) {
.top_menu{
	margin:0 0 2%;
	
}
}

@media screen and (max-width: 568px) {
.top_menu{
	margin:0 0 0;
}
}

.top_menu a {   
	color		: #FFF;
	text-decoration	: none;
	}  

a:hover .top_menu { opacity: 0.7!important; }

.top_menu .f_photo{
	width: 100%;
	margin:0!important;
	position: relative;
}

.top_menu .f_photo img{
	width: 100%;
	height:auto;
	margin:0!important;
}

.f_photo .f_title{
	position: absolute;
	bottom: 3%;
	left: 0;
	margin: 0 !important;
	font-size: 16px;
	background:#000;
	background: rgba(0, 0, 0, 0.6);
	padding: 2% 0 1.5% 0 ;
	font-weight:400;
	display:inline-block;
	line-height:1;
	letter-spacing	: 0.05em;
	width:100%;
	text-align: center;
	color: #FFF;
}

.top_menu .f_text{
	margin: 10px 5px 0;
	font-size: 0.9em;
}

.link_box{
	width: 100%;
	margin:0 0;
	float:left;
}

.link_box img{
	width: 100%;
	height:auto;
}

.link_box li{
	float:left;
}

@media screen and (max-width: 568px) {
.link_box li{
	float:none;
}
}

.link_box .tabi{
	width: 67%;
	height:auto;
	max-width:380px;
	margin:0 3% 0 0;
}

@media screen and (max-width: 568px) {
.link_box .tabi{
	width: 100%;
	margin:0 auto 15px;
}
}

.link_box .tpm{
	width: 30%;
	height:auto;
	max-width:190px;
	margin:0 0;
}

@media screen and (max-width: 568px) {
.link_box .tpm{
	width: 100%;
	margin:0 auto 10px;
}
}

.req_bn{
	width: 100%;
	max-width:780px;
	margin:2% auto;
	clear:both;
}

@media screen and (max-width: 568px) {
.req_bn{
	margin:0 auto 2%;
}
}


.req_bn img{
	width: 100%;
	height:auto;
	margin:0 auto;
	max-width:780px;
}


/* レストランページ
---------------------------------------------------------------------------*/
.restaurant_topimg {
  position: relative;
  width: 100%;
  height: 100vh;
  min-height: 400px;
  z-index:1;
  box-shadow:inset 0 1px 5px rgba(96,51,11,.6);
  background-color: #0A51A1;
}

@media only screen and  (max-width: 568px) {
.restaurant_topimg {
	height: 90vh;
	margin-bottom:10px;
}
}

.rest_info {
	width: 100%;
	position:absolute;
	top:50%;
	margin-top:-75px;
	text-align: center;
}

.rest_info .catch {
  font-size: 1.2em;
  font-weight: 600;
  color: #FFF;
  text-shadow:1px 1px 1px #0A51A1;
}

@media screen and (max-width: 568px) {
.rest_info .catch {
  font-size: 0.9em;
  letter-spacing:0em;
}
}

.rest_info h2 {
  font-size: 1.2em;
  letter-spacing:0.05em;
  color: #FFF;
  font-weight: 600;
  text-shadow:1px 1px 1px #0A51A1;
}

.rest_info .rest_text {
  font-size: 3em;
  font-weight: 600;
  line-height: 1.4;
  color: #FFF;
  letter-spacing:0.05em;
  text-shadow:0.05em 0.05em 1px #0A51A1;
  margin:0 auto 5px;
  font-family : "Times New Roman", "游明朝", "Yu Mincho", "游明朝体", "YuMincho", "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HiraMinProN-W3", "HGS明朝E", "メイリオ", Meiryo, serif;
}

@media only screen and  (max-width: 568px) {
.rest_info .rest_text {
	font-size:2.2em;
}
}

#bg {
  /* 画像ファイルの指定 */
  /* 画像を常に天地左右の中央に配置 */
  background-position: center center;
   
  /* 画像をタイル状に繰り返し表示しない */
  background-repeat: no-repeat;
   
  /* コンテンツの高さが画像の高さより大きい時、動かないように固定 */
  background-attachment: scroll;
   
  /* 表示するコンテナの大きさに基づいて、背景画像を調整 */
  background-size: cover;
   
  /* 背景画像が読み込まれる前に表示される背景のカラー */
 background-color: #0A51A1;
}

.sub_text{
  font-size: 0.9em;
  text-align: left;
  padding:5px;
  margin-bottom:3%;
  line-height:1.6;
}

@media only screen and  (max-width: 568px) {
.sub_text{
	font-size: 13px;
	margin-bottom:5px;
}
}

/* room_box
================================================== */
#room_box {
	width:100%;
    margin:0 auto;
}

@media only screen and  (max-width: 800px) {
#room_box {
	width:96%;
}
}

@media only screen and  (max-width: 568px) {
#room_box {
	width:100%;
}
}

/* .room_photo
--------------------------------------------------*/
.room_photo {
  width:54%;
  float:left;
  margin:1% 0 2% 0;
}

@media only screen and  (max-width: 1280px) {
.room_photo {
  width:47%;
  margin:0 1% 3% 0;
}
}

@media only screen and  (max-width: 800px) {
.room_photo {
	width:98%;
	margin:3% auto;
	padding-bottom:5%;
	float:none;
	clear:both;
	box-sizing: border-box;
}
}

/* room_info
--------------------------------------------------*/
.room_info{
	width:41%;
	float:right;
	margin:2% 0 0 3%;
}

@media only screen and  (max-width: 1280px) {
.room_info{
	width:49%;
	margin:0 0 0 1%;
}
}

@media only screen and  (max-width: 800px) {
.room_info{
	width:98%;
	float:none;
	margin:1% 1% 0;
	clear:both;
}
}


.room_info p {
	line-height:1.6;
	padding:0;
	color:#333;
}

.tor_text {
	margin-top:0;
	margin-bottom:10px;
}

@media only screen and  (max-width: 1280px) {
.tor_text {
	margin-bottom:0;
	font-size:0.9em;
}
}

@media only screen and  (max-width: 568px) {
.tor_text {
	margin-bottom:5px;
}
}

.room_info .red{color:#EF7000;font-weight:bold;}


.room_bihin{
	width:41%;
	float:right;
	margin:0 0 0 3%;
	font-size:14px;
}

@media only screen and  (max-width: 1280px) {
.room_bihin{
	width:49%;
	margin:0 0 0 1%;
}
}

@media only screen and  (max-width: 800px) {
.room_bihin{
	width:98%;
	float:none;
	margin:0 1% 2%;
	clear:both;
}
}

.room_bihin h4{
	margin-top:20px;
	font-size:110%;
	font-family: 'Roboto', sans-serif;
	width:94%;
	padding:5px 3% 5px 3%;
	font-weight:normal;
	background:#336699;
	color:#FFF;
}

.bihin_text{
	width:96%;
    margin:0 0 10px 0;
	padding:0 2% 0;
	font-size:14px;
	background:#EEF6FE;
}

.bihin_text li{
	padding:2% 2% 1.2%;
	border-bottom:0.05em dotted #726626;
}

.bihin_text li:last-child {
	border-bottom:none;
	padding:2% 2% 2%;
}

.bihin_text strong{
	color:#FF6565;
	font-size:16px;
	font-weight:400;
	font-family: 'Noto Sans Japanese', sans-serif;
}

.res33{
	width:33.3333%;
	padding:2% 1.5%;
	float:left;
	box-sizing: border-box;
}

@media only screen and  (max-width: 800px) {
.res33{
	width:50%;
}
}

@media only screen and  (max-width: 568px) {
.res33{
	width:100%;
	float:none;
}
}


.res33 img{
	width:100%;
	height:auto;
	margin:0 0 5px;
}

.res33 h3{
	font-size:130%;
	padding:5px 0;
	color:#336699;
	box-sizing: border-box;
	text-align	: center;
	line-height:1.2;
}

.res33 h3 span{
	font-family: 'Roboto', sans-serif;
	font-weight:400;
	font-size:80%;
	font-weight:normal;
	}

.res33 p{
	font-size:14px;
	}

.res_movie{
	width:100%;
	max-width:500px;
	height:auto;
	margin:3% auto 5%;
}