@charset "utf-8";

body{
  background: none;
  font-size: 1.7rem;
  width: 100%;
	min-width: 1000px;
}

/*--flex骨子--*/
.born{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}

.born_c{
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}

.born_l{
  display: flex;
  flex-wrap: wrap;
}

a:hover img{
	opacity: 0.8;
}

/*--font-size--*/
.f_size_26x{
  font-size: 2.6rem;
}

.f_weight_b{
  font-weight: 600;
}

/*--pc非表示--*/
.no_pc{
  display: none;
}

#hotel_header{
  margin: 0 auto;
  position: relative;
  width: 1000px;
}

/*----------------------------------------
タイトル背景画像スライドショー slickslider ver
------------------------------------------*/
.img_main_box{
  height: 570px;
  margin: 0 auto;
  position: relative;
  width: 1000px;
  overflow: hidden;
}
.top_slider{
  height: 570px;
  overflow: hidden;
  width: 1000px;
}
.top_slider li {
  height: 570px;
}
.top_slider img {
  height: auto;
  width: auto;
  max-width: initial !important;
  position: absolute;
}
.top_slider .vw_img{
  display: block;
  height: 570px;
  overflow: hidden;
  position: relative;
  width: 1000px;
}
/* 初期表示の遅延処理 */
.top_slider li img {
  opacity: 0;
  transition: opacity .3s linear;
}
.top_slider li.slick-slide img,
.top_slider li:first-child img {
  opacity: 1;
}
/* アニメーション設定 */
@keyframes slider01 {
  0% { transform: translateY(200px); }
  100% { transform: translateY(0); }
}
.top_slider .slick-active.vw01 .vw_img img{
  animation-name: slider01;
  animation-duration: 6s;
  animation-timing-function: ease;
  bottom: 0;
}
.top_slider .vw01 .vw_img img{
  bottom: -200px;
  z-index: 7;
}
.top_slider .vw01.slick-slide.slick-continue .vw_img img{
  bottom: 0;
}

@keyframes slider02_01 {
  0% { transform: translateY(200px); }
  100% { transform: translateY(0); }
}
.top_slider .slick-active .vw02_img01 img{
  animation-name: slider02_01;
  animation-duration: 6.5s;
  animation-timing-function: ease;
  bottom: 0;
}
.top_slider .vw02_img01 img{
  bottom: 0;
  right: 0;
  z-index: 5;
}

@keyframes slider02_02 {
  0% { transform: translateX(-200px); }
  100% { transform: translateX(0); }
}
.top_slider .slick-active .vw02_img02 img{
  animation-name: slider02_02;
  animation-duration: 6.5s;
  animation-timing-function: ease;
}
.top_slider .vw02_img02 img{
  left: 0;
}
.top_slider .vw02_img02 {
  overflow: hidden;
  position: absolute;
  left: 0;
  top: 0;
  width: 1000px;
}

@keyframes slider03 {
  0% { transform: translateX(200px); }
  100% { transform: translateX(0); }
}
.top_slider .slick-active.vw03 .vw_img img{
  animation-name: slider03;
  animation-duration: 6.5s;
  animation-timing-function: ease;
  right: 0;
}
.top_slider .vw03 .vw_img img{
  right: 0;
}

@keyframes slider04_01 {
  0% { transform: translateY(-200px); }
  100% { transform: translateY(0); }
}
.top_slider .slick-active .vw04_img01 img{
  animation-name: slider04_01;
  animation-duration: 6.5s;
  animation-timing-function: ease;
  top: 0;
}
.top_slider .vw04_img01 img{
  top: 0;
  z-index: 6;
}

@keyframes slider04_02 {
  0% { transform: translateY(200px); }
  100% { transform: translateY(0); }
}
.top_slider .slick-active.vw04 .vw04_img02 img{
  animation-name: slider04_02;
  animation-duration: 6.5s;
  animation-timing-function: ease;
  bottom: 0;
}
.top_slider .vw04_img02 img{
  bottom: 0;
}
.top_slider .vw04_img02 {
  overflow: hidden;
  position: absolute;
  left: 0;
  top: 0;
  width: 1000px;
}

@keyframes slider05 {
  0% { transform: translateX(-200px); }
  100% { transform: translateX(0); }
}
.top_slider .slick-active.vw05 img{
  animation-name: slider05;
  animation-duration: 8.5s;
  animation-timing-function: ease;
}
.top_slider .vw05 img{
  left: 0;
}

.vw_catch {
  bottom: 26px;
  display: block;
  height: 100px;
  left: 50%;
  position: absolute;
  transform: translate(-50%, -50%);
  z-index: 100;
  width: 540px;
}

/*--headerのnav--*/
.nav_head_box{
  height: 58px;
  position: absolute;
  right: 226px;
  top: 0;
}

.join_box{
  background: #c33927;
  border-bottom: 1px solid #f2b510;
  margin-right: 30px;
  min-width: 180px;
  position: relative;
  text-align: center;
}

.join_box.join_on:hover{
  background: #e8533f;
}

.join_box::before{
  content: "";
  background: url("/hotel/image/top/bg_header_join_prev.png") no-repeat left 0;
  height: 58px;
  left: -10px;
  position: absolute;
  width: 10px;
}

.join_box::after{
  content: "";
  background: url("/hotel/image/top/bg_header_join_next.png") no-repeat right 0;
  height: 58px;
  position: absolute;
  top: 0;
  right: -10px;
  width: 10px;
}

.join_on:hover::before{
  content: "";
  background: url("/hotel/image/top/bg_header_join_prev_ov.png") no-repeat left 0;
}

.join_on:hover::after{
  content: "";
  background: url("/hotel/image/top/bg_header_join_next_ov.png") no-repeat right 0;
}

.join_on a{
  display: block;
  height: 100%;
  line-height: 38px;
  width: 100%;
}

.already_box{
  clear: both;
  display: block;
  font-size: 1.5rem;
  margin: 4px 5px 0 5px;
  overflow: hidden;
}

.already_box figure{
  background: #fff;
  border: 1px solid #b9beb7;
  display: block;
  float: left;
  height: 50px;
  width: 50px;
}

.already_box figure img{
  height: 100%;
  width: 100%;
}

.already_box_inner{
  float: left;
  margin: 0 0 0 5px;
}

.already_box_user{
  color: #fff;
  line-height: 2.3rem;
  margin: 0;
  overflow: hidden;
	text-align: left;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.already_box_user.staff:before{
  background: #931909;
  content: "社員";
  color: #fff;
  display: inline-block;
  margin-right: 5px;
  padding: 0 5px;
  text-align: center;
}

.already_logout{
  background: linear-gradient(to bottom, #ffffff 48%,#f2f1e8 50%,#f2f1e8 100%);
  border: 1px solid #ce9d1a;
  color: #c33927;
  display: block;
	height: 24px;
  line-height: 24px;
  margin-top: 2px;
	padding-left: 12px;
  position: relative;
	text-align: left;
  width: 105px;
}

.already_logout:hover{
  background: #c33927;
  color: #fff;
}

.arr_logout{
  display: block;
  fill: #c33927;
  height: 16px;
  position: absolute;
  right: 3px;
  top: 3px;
  width: 16px;
}

.already_logout:hover .arr_logout{
  fill: #fff;
}

.login_box{
  background: #b68604;
  border-bottom: 1px solid #f2b510;
  cursor: pointer;
  margin: 0 20px 0 0;
  position: relative;
  text-align: center;
  width: 139px;
}

.login_box_gr{
  background: #9f9f9f;
  border-bottom: 1px solid #b4b4b4;
  margin: 0 20px 0 0;
  position: relative;
  text-align: center;
  width: 139px;
}

.login_box::before{
  content: url("/hotel/image/top/btn_header_login01.png");
  position: absolute;
  top: 0;
  left: -10px;
}

.login_box::after{
  content: url("/hotel/image/top/btn_header_login02.png");
  position: absolute;
  top: 0;
  right: -10px;
}

.login_box_gr::before{
  content: url("/hotel/image/top/btn_header_login01_gr.png");
  position: absolute;
  top: 0;
  left: -10px;
}

.login_box_gr::after{
  content: url("/hotel/image/top/btn_header_login02_gr.png");
  position: absolute;
  top: 0;
  right: -10px;
}

.login_box:hover{
  background: #dea707;
}

.login_box:hover::before{
  content: url("/hotel/image/top/btn_header_login01_ov.png");
}

.login_box:hover::after{
 content: url("/hotel/image/top/btn_header_login02_ov.png");
}

.login_box a,
.login_box_gr span{
  display: block;
  height: 100%;
  line-height: 38px;
  width: 100%;
}

.font_change_box{
  background: url("/hotel/image/top/bg_font_change.png") no-repeat 0 0/100% 56px;
  color: #fff;
  font-size: 1.5rem;
  height: 56px;
  margin: 0;
  padding: 10px;
  position: absolute;
  right: 20px;
  top: 0;
  width: 205px;
}

.font_change_box dt{
  line-height: 43px;
  width: 85px;
}

.font_change_box dd{
  letter-spacing: -.4em;
  margin: 0;
  width: 100px;
}

.font_change_box p{
  background: #fff;
  border: 1px solid #f2b510;
  box-sizing: border-box;
  color: #9c7201;
  cursor: pointer;
  display: inline-block;
  letter-spacing: normal;
  margin: 0;
  padding: 5px;
  text-align: center;
  vertical-align: bottom;
}

.font_change_box p:hover{
  background: #c33927;
  border: 1px solid #f2b510;
  color: #fff;
}

.font_change_box .btn_small{
  font-size: 15px;
  margin-right: 7px;
}

.font_change_box .btn_middle{
  font-size: 15px;
  margin-right: 7px;
}

.font_change_box .btn_large{
  font-size: 18px;
}

.font_change_box p.active{
  background: #c33927;
  color: #fff;
  cursor: default;
}

/*--h1見出し--*/
.ttl_main_box{
  background: url("/hotel/image/top/bg_ttl_main_center.png") repeat 0 0;
  left: 50%;
  position: absolute;
  text-align: center;
  top: 45%;
  transform: translate(-50%, -50%);
  width: 464px;
  z-index: 2;
}

.ttl_main_box::before{
  content: url("/hotel/image/top/bg_ttl_main_top.png");
  left: 0;
  margin: 0;
  padding: 0;
  position: absolute;
  top: -29px;
}

.ttl_main_box::after{
  content: url("/hotel/image/top/bg_ttl_main_bottom.png");
  left: 0;
  margin: 0;
  padding: 0;
  position: absolute;
  bottom: -30px;
}

.ttl_main_box h1{
  margin: 0;
  position: relative;
  top: -10px;
}

.ttl_main_sub{
  display: block;
  text-align: center;
}

.ttl_main_fac_number{
  height: 40px;
  margin: 12px auto 5px;
  width: 377px;
}

.ttl_main_fac_number dt{
  background: #c33927;
  color: #fff;
  font-size: 1.7rem;
  line-height: 4rem;
  width: 50%;
}

.ttl_main_fac_number dd{
  background: #fff;
  line-height: 4rem;
  margin: 0;
  width: 50%;
}

a .ttl_main_fac_number dd{
  color: #000;
}

/*--bgはmainから--*/
.main_bg {
  background: url("/hotel/image/top/bg_body.jpg") repeat 0 0;
  background-size: 10%;
}

/*--検索メニューtop--*/
#nav_hotel_search {
  margin: 0 auto 0;
  min-height: 475px;
  position: relative;
  width: 850px;
}

.nav_tab_box {
  margin: 0;
  padding: 0;
  position: absolute;
  top: -60px;
  width: 850px;
}

.nav_tab_box li{
  cursor: pointer;
  height: 60px;
  text-align: center;
  width: 420px;
}

.nav_tab_box li.active{
  cursor: default;
}

.ttl_nav_area_box{
  background: url("/hotel/image/top/btn-nav-area.png") no-repeat 0 0/cover;
}

.ttl_nav_hotel_box{
  background: url("/hotel/image/top/btn_nav_name.png") no-repeat 0 0/cover;
}

.nav_tab_box li:hover img{
  opacity: 0;
}

.nav_tab_box li.active img{
  opacity: 0;
}

/*--地域から探す--*/
.nav_area_box {
  background: url("/hotel/image/top/bg_nav_area.jpg") no-repeat 0 0/100%;
  border-top: 5px solid #c33927;
  box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.8);
  display: inline-block;
  height: 100%;
  margin:0;
  width: 100%;
}

.nav_area_box .acrive{
  display: block;
}

.nav_area_list{
  margin: 0 auto;
  padding: 26px 0 0;
  width: 762px;
}

.base_list_nationwide {
  align-items: center;
  display: flex;
  flex-direction: row-reverse;
  justify-content: flex-end;
  padding: 5px;
  width: 100%;
}

.base_list_nationwide p {
  letter-spacing: .1px;
  margin: 0;
}

.base_list_nationwide .base_list_link {
  background: linear-gradient(#b68604, #9a7000);
  border: 1px solid #9a7000;
  border-radius: 20px;
  box-shadow: 0 2px 0 #674a12;
  box-sizing: border-box;
  color: #fff;
  display: inline-block;
  height: 40px;
  letter-spacing: 1px;
  line-height: 42px;
  margin-right: 23px;
  padding-left: 47px;
  padding-right: 35px;
  position: relative;
  text-align: center;
  width: auto;
}

.base_list_nationwide .base_list_link:hover {
  opacity: .8;
}

.base_list_nationwide .base_list_link:before {
  background: url("/image/base-list-nationwide.png") no-repeat 0 0/100%;
  content: "";
  height: 17px;
  left: 15px;
  position: absolute;
  top: calc(50% - 9px);
  width: 24px;
}

.base_list_nationwide .base_list_link:after {
  border-bottom: 5px solid transparent;
  border-left: 9px solid #fff;
  border-top: 5px solid transparent;
  content: "";
  position: absolute;
  right: 12px;
  top: calc(50% - 5px);
}

.nav_area_list a{
  display: block;
  font-weight: 600;
  height: 30px;
  letter-spacing: 1rem;
	line-height: 30px;
  padding-left: 10px;
  text-align: center;
  width: 70px;
}

.nav_area_list a.non_spc{
  letter-spacing: 0;
  padding: 0;
}

.nav_area_list dt{
  color: #fff;
  height: 30px;
  letter-spacing: 1rem;
  line-height: 30px;
  padding-left: 10px;
  margin: 10px 8px 0 0;
  position: relative;
  text-align: center;
  width: 115px;
}

.nav_area_list dt.non_spc{
  letter-spacing: 0.1rem;
  padding-left: 5px;
}

.nav_area_list dd{
  height: 30px;
  line-height: 30px;
  margin: 10px 0 0;
  width: 630px;
}

.nav_area_list ul{
  display: flex;
  display: -webki-tflex;
  margin: 0 0 0 15px;
  padding: 0;
}

.nav_area_list li{
  margin: 0 10px 0 0;
  padding: 0;
}

.nav_area_list_ttl01{
  background: #7a5f90;
}

.nav_area_list_ttl01:after{
  left: 100%;
  top: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-left-color: #7a5f90;
  border-width: 15px;
  margin-top: -15px;
}

.nav_area_list_ttl02{
  background: #616a8e;
}

.nav_area_list_ttl02:after{
  left: 100%;
  top: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-left-color: #616a8e;
  border-width: 15px;
  margin-top: -15px;
}


.nav_area_list_ttl03{
  background: #447c73;
}

.nav_area_list_ttl03:after{
  left: 100%;
  top: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-left-color: #447c73;
  border-width: 15px;
  margin-top: -15px;
}


.nav_area_list_ttl04{
  background: #5f8033;
}

.nav_area_list_ttl04:after{
  left: 100%;
  top: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-left-color: #5f8033;
  border-width: 15px;
  margin-top: -15px;
}


.nav_area_list_ttl05{
  background: #ce841a;
}

.nav_area_list_ttl05:after{
  left: 100%;
  top: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-left-color: #ce841a;
  border-width: 15px;
  margin-top: -15px;
}


.nav_area_list_ttl06{
  background: #c33927;
}

.nav_area_list_ttl06:after{
  left: 100%;
  top: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-left-color: #c33927;
  border-width: 15px;
  margin-top: -15px;
}

.nav_area_list_ttl07{
  background: #c72562;
}

.nav_area_list_ttl07:after{
  left: 100%;
  top: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-left-color: #c72562;
  border-width: 15px;
  margin-top: -15px;
}

.nav_area_list_ttl08{
  background: #9f3fad;
}

.nav_area_list_ttl08:after{
  left: 100%;
  top: 50%;
  border: solid transparent;
  content: " ";
  height: 0;
  width: 0;
  position: absolute;
  pointer-events: none;
  border-left-color: #9f3fad;
  border-width: 15px;
  margin-top: -15px;
}

.nav_area_touhoku a{
  background: linear-gradient(to bottom, #ffffff 48%,#f1eff4 50%,#f1eff4 100%);
  border: 1px solid #7a5f90;
  color: #7a5f90;
}

.nav_area_touhoku a:hover{
  background: #7a5f90;
  color: #fff;
  font-weight: 100;
}

.nav_area_kanto a{
  background: linear-gradient(to bottom, #ffffff 48%,#eff0f3 50%,#eff0f3 100%);
  border: 1px solid #616a8e;
  color: #616a8e;
}

.nav_area_kanto a:hover{
  background: #616a8e;
  color: #fff;
  font-weight: 100;
}

.nav_area_hokuriku a{
  background: linear-gradient(to bottom, #ffffff 48%,#ecf2f1 50%,#ecf2f1 100%);
  border: 1px solid #447c73;
  color: #447c73;
}

.nav_area_hokuriku a:hover{
  background: #447c73;
  color: #fff;
  font-weight: 100;
}

.nav_area_tokai a{
  background: linear-gradient(to bottom, #ffffff 48%,#ecf2f1 50%,#ecf2f1 100%);
  border: 1px solid #5f8033;
  color: #5f8033;
}

.nav_area_tokai a:hover{
  background: #5f8033;
  color: #fff;
  font-weight: 100;
}

.nav_area_kansai a{
  background: linear-gradient(to bottom, #ffffff 48%,#faf2e8 50%,#faf2e8 100%);
  border: 1px solid #ce841a;
  color: #ce841a;
}

.nav_area_kansai a:hover{
  background: #ce841a;
  color: #fff;
  font-weight: 100;
}

.nav_area_shikoku a{
  background: linear-gradient(to bottom, #ffffff 48%,#f9e9ef 50%,#f9e9ef 100%);
  border: 1px solid #c72562;
  color: #c72562;
}

.nav_area_shikoku a:hover{
  background: #c72562;
  color: #fff;
  font-weight: 100;
}

.nav_area_chugoku a{
  background: linear-gradient(to bottom, #ffffff 48%,#f9ebe9 50%,#f9ebe9 100%);
  border: 1px solid #c33927;
  color: #c33927;
}

.nav_area_chugoku a:hover{
  background: #c33927;
  color: #fff;
  font-weight: 100;
}

.nav_area_kyushyu a{
  background: linear-gradient(to bottom, #ffffff 48%,#f5ebf7 50%,#f5ebf7 100%);
  border: 1px solid #9f3fad;
  color: #9f3fad;
}

.nav_area_kyushyu a:hover{
  background: #9f3fad;
  color: #fff;
  font-weight: 100;
}

/*--名称検索--*/
.srch_name_box {
  height: 44px;
  margin: 50px auto 20px;
  width: 760px;
}

.srch_name_box dt{
  background: url("/hotel/image/top/bg-search-name.png") no-repeat 0 0/cover;
  color: #fff;
  height: 44px;
  line-height: 44px;
  position: relative;
  text-align: center;
  text-indent: 15px;
  width: 310px;
}

.srch_name_box dt::before {
  background: url("/hotel/image/top/ico-search-name.png") no-repeat 0 0/cover;
  bottom: 0;
  content: "";
  height: 22px;
  left: 82px;
  margin: auto;
  position: absolute;
  top: 0;
  width: 17px;
}

.srch_name_box dd{
  clear: both;
  overflow: hidden;
  margin: 0 0 0 10px;
  position: relative;
  width: 440px;
}

.srch_name_input{
  background: #fff;
  border: 1px solid #53732b;
  float: left;
  height: 40px;
  width: 343px;
}

.srch_name_button{
  background: linear-gradient(to bottom, #5f8033 48%,#53732b 50%,#53732b 100%);
  border: none;
  color: #fff;
  font-size: 2rem;
  font-weight: 600;
  height: 42px;
  line-height: 44px;
  width: 93px;
}

.srch_name_button:hover,
.srch_name_button:active{
  background: #8dbc4d;
  border: 1px solid #5f8033;
  line-height: 43px;
}


/*--有名ホテル--*/
.nav_hotel_box{
  background: url("/hotel/image/top/bg_nav_hotel.jpg") repeat 0 0;
  border-top: 5px solid #44502b;
  box-shadow: 0px 5px 10px 0px rgba(0, 0, 0, 0.8);
  display: none;
  height: auto;
  margin:0;
  padding: 30px 0 20px 0;
  width: 100%;
}

.nav_hotel_list{
  height: 420px;
  overflow: hidden;
  margin: 0 auto 10px;
  padding: 0;
  transition: all 0.5s;
  width: 760px;
}

.nav_hotel_list li{
  display: table;
  height: 55px;
  margin: 0 5px 5px 0;
  width: 250px;
}

.nav_hotel_list li:nth-child(3n){
  margin-right: 0;
}

.nav_hotel_list a{
  border: 2px solid #aba88a;
  background: linear-gradient(to bottom, #ffffff 48%,#f2f1e8 50%,#f2f1e8 100%);
  color: #86591f;
  display: table-cell;
  font-size: 1.7rem;
  font-weight: 600;
  height: 100%;
  letter-spacing: 0;
  line-height: 1.3;
  padding: 5px 0;
  position: relative;
  text-align: center;
  vertical-align: middle;
  width: 100%;
}

.nav_hotel_list a:hover{
  background: linear-gradient(to bottom, #adc889 48%,#8fa670 50%,#8fa670 100%);
  color: #fff;
}

.nav_hotel_list a.long{
  font-size: 1.5rem;
  letter-spacing: -0.2rem;
}

/*--svg arrow--*/
.arr_hotel{
  display: block;
  height: 23px;
  position: absolute;
  right: -1px;
  top: 12px;
  width: 23px;
}

.arr_hotel use{
  fill: #86591f;
}

.nav_hotel_list a:hover .arr_hotel use{
  fill: #fff;
}

/*--svg arrow--*/

.nav_hotel_list span{
  color: #26241f;
  display: block;
  font-size: 1.5rem;
}

.toggle_box{
	height: 50px;
  margin: 0 auto;
	position: relative;
  overflow: hidden;
  width: 760px;
}

.css_toggle{
  display: none;
}

.css_toggle:checked + .nav_hotel_list{
  height: 1020px;
}

.btn_toggle_box{
	bottom: 0;
  cursor: pointer;
  display: block;
	height: 50px;
	position: absolute;
	right: 0;
  text-align: center;
	width: 150px;
}

.btn_toggle_box.off{
	display: none;
}

/*--リード--*/
.ttl_read_main{
  margin: 30px 0 20px;
  text-align: center;
}

.read_main_txt{
  letter-spacing: .04em;
  line-height: 2.5rem;
  margin: 0 auto;
  width: 650px;
}

/*--サブナビゲーション--*/
.nav_sub_inner{
  background: #9a7000;
  border-bottom: 3px solid #e9aa00;
  border-top: 3px solid #e9aa00;
  margin: 30px auto 0;
  padding: 0;
  height: 86px;
  width: 860px;
}

.nav_sub_box{
  margin: 0 auto;
  padding: 0;
}

.nav_sub_box li{
  border-right: 1px solid #e9aa00;
  text-align: center;
  width: 172px;
}

.nav_sub_box li:nth-child(-n+2){
  padding-left: 1px;
}

.nav_sub_box li:last-child{
  border-right: none;
  padding-right: 1px;
}

.nav_sub_box a{
  background: linear-gradient(to bottom, #b68604 48%,#b07e03 50%,#b07e03 100%);
  display: block;
  height: 100%;
  margin: 0 auto;
  transition: all 100ms 0s ease;
  width: 98%;
}

.nav_sub_box a:hover{
  background: #e9aa00;
  opacity: 0.9;
}

.nav_rank_box{
  margin: 30px auto;
  padding: 0;
  width: 610px;
}

.nav_rank_box .lead{
  font-size: 1.6rem;
  margin-top: 8px;
  text-align: center;
}

.nav_rank_box a:hover img,
.nav_rank_box a:active img{
  opacity: 0.7;
}

.post_slick_inner{
  margin: 0 auto;
  padding: 0;
  position: relative;
  width: 900px;
}

/* ---------------------------------------
 最近投稿された 口コミ／写真／動画 共通   mod_latest_post
---------------------------------------- */
/*--背景--*/
.main_bg .post_bg_box{
  background: rgba(171,170,144,0.2);
  padding: 1px 0 20px;
  width: 100%;
}

.main_bg .post_bg_box:nth-of-type(2){
  background: none;
  padding: 0 0 20px;
  width: 100%;
}

/* ボタン */
.mod_latest_post .btn_css_toggle,
.mod_latest_post .btn_css_toggle_off{
	bottom: 0;
}

.btn_css_toggle.close{/*--閉じるときに--*/
  display: none;
}

/*--すべて見る--*/
.btn_all_link{
  bottom: 0;
}

.mod_latest_post {
  margin-top: 20px;
 padding: 0 0 45px;
}

.mod_latest_post .slick-dots{
  bottom: -45px;
}
/* ---------------------------------------
 最近投稿された口コミ   mod_latest_post _review
---------------------------------------- */
/* slickJS Dots */
.mod_latest_post._review .slick-dots li.slick-active button:before,
.mod_latest_post._review .slick-dots li button:hover:before {
  background: #c64332;
}

/* ---------------------------------------
 最近投稿された写真   mod_latest_post _photo
---------------------------------------- */
/* slickJS Dots */
.mod_latest_post._photo .slick-dots li.slick-active button:before,
.mod_latest_post._photo .slick-dots li button:hover:before {
  background: #697193;
}

/* ---------------------------------------
 最近投稿された動画   mod_latest_post _movie
---------------------------------------- */
/* slickJS Dots */
.mod_latest_post._movie .slick-dots li.slick-active button:before,
.mod_latest_post._movie .slick-dots li button:hover:before {
  background: #66853b;
}

/*--刀剣ワールドバナー追加 ##12651--*/
.bnr_box_touken{
	background: #f9efdd;
	border: 1px solid #b7af9f;
	height: 340px;
	margin: 60px auto 70px;
	padding: 4px;
	position: relative;
	width: 1000px;
}

.bnr_box_touken h3{
	position: absolute;
	top: -35px;
	transform: translate(-50%, 0);
	left: 50%;
	z-index: 1;
}

.bnr_box_touken .bg_img{
	display: block;
	height: 18px;
	position: absolute;
	width: 18px;
	z-index: 1;
}

.bnr_box_touken .bg_img.bottom_l{
	bottom: 5px;
	left: 4px;
	transform: rotate(90deg);
}

.bnr_box_touken .bg_img.bottom_r{
	bottom: 5px;
	right: 4px;
	transform: rotate(0deg);
}

.bnr_box_touken .bg_img.top_l{
	left: 4px;
	top: 4px;
	transform: rotate(180deg);
}

.bnr_box_touken .bg_img.top_r{
	top: 4px;
	right: 4px;
	transform: rotate(-90deg);
}

.bnr_box_touken_inner{
	border: 1px dashed #86745d;
	padding: 55px 20px 20px;
	width: 100%;
}

.bnr_box_touken_inner li{
	width: 300px;
}

.bnr_box_touken_inner li:first-child,
.bnr_box_touken_inner li:nth-child(2){
	margin: 0 0 35px;
}

.bnr_box_touken_inner a:hover img{
	opacity: 0.8;
}

.bnr_box_touken_inner p{
	color: #333;
	font-size: 1.5rem;
	letter-spacing: 0;
	line-height: 1.5;
	margin: 5px 0 0;
	text-align: left;
}

/*--カラムレイアウト骨子--*/
.research_support_box{
  margin: 30px auto;
  width: 1000px;
}

.support_box_main{
  width: 675px;
}

.support_ad_box{
  width: 300px;
}
/* ==== メインカラム === */
/*--お役立ち共通--*/
.support_box_main h2{
  border-bottom: 2px solid #86591f;
  margin: 30px auto 20px;
  text-align: center;
  width: 100%;
}

#support_main00 h2{
  margin: 0 auto 20px;
}

.bnr_osusume_box{
	text-align: center;
}

#support_main01 h2{
  margin: 20px auto;
}

.support_box_main .read{
  font-size: 1.6rem;
  line-height: 1.3;
  margin-bottom: 15px;
  margin-top: 7px;
  text-align: center;
}

.support_dic_chk{
  display: none;
}

.dic_box{
  transition: all 0.5s;
  opacity: 0;
  height: 0;
  overflow: hidden;
  padding: 0 30px;
}

.dic_box > .btn_css_toggle{
  bottom: 25px;
	cursor: pointer;
  left: 430px;
  position: relative;
}

.dic_main{
  background: #f6f5ec;
  border: 2px solid #aba88a;
  box-shadow: 0px 1px 5px 0px rgba(0, 0, 0, 0.8);
  margin: 15px auto 0;
  padding: 0;
  transition: all 5s ease-in;
  width: 644px;
}

.dic_main h3{
	background: #adc889;
  margin: 0;
  position: relative;
}

.dic_main h3:hover img,
.dic_main h3:active img{
  opacity: 0.7;
}

.ttl_dic{
  cursor: pointer;
}

.ttl_dic::after{
  background: url("/hotel/image/top/ico_dic_ttl_open.png") no-repeat center;
  content: "";
  display: inline-block;
  height: 96px;
  position: absolute;
  right: 0;
  top: 0;
  width: 46px;
}

.ttl_dic.active::after{
  transform: rotate(180deg);
}

.btn_css_toggle:hover{
  opacity: 0.7;
}

.dic_box_inner{
  margin: 0 0 32px;
  width: 580px;
}

.dic_box_inner dt{
  color: #c33927;
  font-size: 2rem;
  margin: 0 auto 20px;
}

.dic_box_inner dt::before{
  content: url("/hotel/image/top/ico_ttl_jiten.png");
  margin-right: 5px;
  position: relative;
  top: 2px;
}

.dic_box_inner dd{
  margin: 0;
}

.dic_box_list {
  overflow: hidden;
  margin: 0 auto 10px;
  padding: 0;
}

.dic_box_list li{
  margin: 0 0 10px;
  padding: 0;
  width: 280px;
}

.dic_box_list li > a,
.dic_box_list li > span{
  border: 2px solid #aba88a;
  background: linear-gradient(to bottom, #ffffff 48%,#f2f1e8 50%,#f2f1e8 100%);
  color: #86591f;
  display: flex;
  align-items: center;
  justify-content: flex-start;
  font-size: 1.6rem;
  height: 45px;
  padding: 0 10px;
  position: relative;
  text-align: left;
  width: 100%;
}

.dic_box_list li > a:hover{
  background: linear-gradient(to bottom, #adc889 48%,#8fa670 50%,#8fa670 100%);
  color: #fff;
}

.dic_box_list li > span{
  border: 2px solid #bfbfbf;
  background: #eeeeee;
  color: #737373;
}

/*--svg arrow--*/
.arr_dic {
  display: block;
  height: 20px;
  position: absolute;
  right: 3px;
  top: 11px;
  width: 20px;
}

.arr_dic use{
  fill: #86591f;
}

.arr_dic.disable use{
  fill: #737373;
}

.dic_box_list li > a:hover .arr_dic use{
  fill: #fff;
}


/*--お役立ち事典01--*/
#support_dic_01:checked+.dic_box{
  margin-top: 30px;
  height: auto;
  opacity:1;
  height: auto;
}

#support_dic_01:checked~.ttl_dic:after{
  content: url("/hotel/image/top/ico_dic_ttl_open.png");
}

/*--お役立ち事典02--*/
#support_dic_02:checked+.dic_box{
  margin-top: 30px;
  height: auto;
  opacity:1;
  height: auto;
}

#support_dic_02:checked~.ttl_dic:after{
  content: url("/hotel/image/top/ico_dic_ttl_open.png");
}

/*--お役立ち事典03--*/
#support_dic_03:checked+.dic_box{
  margin-top: 30px;
  height: auto;
  opacity:1;
  height: auto;
}

#support_dic_03:checked~.ttl_dic:after{
  content: url("/hotel/image/top/ico_dic_ttl_open.png");
}

/*--用語集--*/
.glo_box{
  margin: 15px auto 0;
  padding: 0;
  width: 650px;
}

.glo_box li{
  border: 2px solid #aba88a;
  height: 44px;
  margin-bottom: 10px;
  width: 210px;
}

.glo_box li:nth-child(2),
.glo_box li:nth-child(5),
.glo_box li:nth-child(8),
.glo_box li:last-child{
  margin: 0 10px;
}

.glo_box a:hover img{
  opacity: 0.7;
}

/*--関連施設--*/
.srch_fac_box{
  margin: 0 auto;
  padding: 0;
  width: 630px;
}

.srch_fac_box a:hover > img{
  opacity: 0.7;
}

/*--官公庁リンク--*/
.aut_link{
  background: rgba(194,192,129,0.2);
  margin: 30px auto 0;
  padding: 20px 30px;
  width: 675px;
}

.aut_link h3{
  margin: 0;
  text-align: center;
}

.aut_link_box{
  margin: 0 auto;
  padding: 0;
  width: 615px;
}

.aut_link_box li:first-child,
.aut_link_box li:nth-child(2){
  margin-bottom: 15px;
}

.aut_link_box li{
  margin-bottom: 10px;
  width: 300px;
}

.aut_link_box a > img:hover{
  opacity: 0.7;
}

.aut_link_inner{
  background: linear-gradient(to bottom, #e0e8d5 48%,#d2dcc4 50%,#d2dcc4 100%);
  border: 2px solid #aba88a;
  color: #59792f;
  display: block;
  font-size: 1.5rem;
  font-weight: 600;
  padding: 10px 15px;
  position: relative;
  width: 100%;
}

.aut_link_inner.long{
  letter-spacing: 0rem;
}

.aut_link_inner:hover{
  background: #8fa670;
  color: #fff;
}

.aut_link_inner span{
  display: block;
  font-size: 1.4rem;
  font-weight: 100;
  margin-top: 5px;
  text-indent: -1rem;
}

.aut_link_inner::after{
  content: url("/hotel/image/top/ico_authorities_link.png");
  position: absolute;
  right: 10px;
  top: 14px;
}

/*-- 募集バナー --*/
.mod_bnr_box {
  margin: 30px auto 0;
  width: 620px;
}

/*--賃貸検索--*/
/* ---------------------------------------
 賃貸物件を探す mod_srch_bkn
---------------------------------------- */

.mod_srch_bkn {
  background: #fcf3f6;
  border: 2px solid #e84274;
  margin: 30px auto 0;
  width: 630px;
}

.mod_srch_bkn .h_ttl {
  background: #fff;
  border-bottom: 1px solid #e84274;
  margin: 0;
  overflow: hidden;
  padding: 1px;
  position: relative;
  width: 100%;
}

.mod_srch_bkn .read {
  line-height: 1.2;
  margin: 20px auto;
  text-align: center;
}

.mod_srch_bkn .lst {
  display: flex;
  margin: 0 auto 10px;
  padding: 0;
  flex-flow: row wrap;
  justify-content: center;
}

.mod_srch_bkn .lnk {
  margin: 0 8px 10px;
}

.mod_srch_bkn .lnk a,
.mod_srch_bkn .lnk span{
  display: block;
}

.mod_srch_bkn .lnk a:hover img{
  opacity: 0.7;
}

/* タブレット表示　PC非表示  */

.mod_srch_bkn .lnk.is_pc_hide {
  display: none;
}

.mod_srch_bkn .lnk.is_tab_hide {
  display: block;
}


/* ---------------------------------------
 hmr  キャンペーン
---------------------------------------- */
.hmr_cam_slick{
  margin: 0 auto;
  padding: 0;
}

.hmr_cam_slick a:hover img{
	opacity: 0.7;
}

.hmr_cam_slick.slick-slider{
  width: 880px;
}

.hmr_cam_slick li{
  margin: 0 10px;
  position: relative;
  width: 280px;
}

.hmr_cam_slick_txt{
  font-size: 1.6rem;
  line-height: 1.3;
  margin: 10px 0 0;
  text-align: left;
}

.hmr_bunner_box{
  background: #fff;
	margin: 0 auto;
  overflow: hidden;
	position: relative;
  width: 100%;
}

.hmr_bunner_box.last{
  border-bottom: 1px solid #ad7d03;
  padding-bottom: 30px;
}

.hmr_bunner_box.last::after{
  border-bottom: 1px solid #ad7d03;
  content: "";
  display: block;
  position: absolute;
  bottom: -5px;
  width: 100%;
}

.hmr_bunner_box h2{
  border-top: 2px solid #ad7d03;
  margin:0 0 15px 0;
  text-align: center;
  width: 100%;
}

/*--ピカ写メコンテスト優秀作品--*/
.cam_album_box{
  background:
  url("/hotel/image/top/bg_pika_contest01.jpg") no-repeat top,
  url("/hotel/image/top/bg_pika_contest03.jpg") no-repeat bottom,
  url("/hotel/image/top/bg_pika_contest02.jpg") repeat-y center;
  border: 5px solid #aba88a;
  display: block;
  margin: 30px auto;
  text-align: center;
  width: 563px;
}

.cam_album_txt{
  color: #fff;
  line-height: 2.5rem;
}

.cam_alubum_nav{
  margin: 0 auto 20px;
  padding: 0;
  width: 455px;
}

.cam_alubum_nav li{
  background: #fff;
  border: 2px solid #ce9d1a;
  width: 220px;
}

.btn_pikashame_album03{
  margin: 15px auto 0;
}


.cam_alubum_nav a:hover{
  opacity: 0.7;
}

.pika_all_box .cap{
  font-size: 1.7rem;
  line-height: 1.5;
}

/*----------------------------------------
hmrお楽しみ
-----------------------------------------*/
.hmr_fun_slick{
  margin: 0 auto 26px;
  padding: 0;
  position: relative;
  width: 915px;
}

.hmr_fun_slick a:hover img{
  opacity: 0.7;
}

.hmr_fun_slick a:hover .l_ttl{
	color: #c30;
}

.hmr_fun_slick > .post_slick_inner{
  width: 880px;
}


#js-hmr_fun .hmr_fun_slick_box{
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 0 auto;
  padding: 0;
  width: 880px;
}

.hmr_fun_slick_box li{
  background: #fff;
  border: 1px solid #86591f;
  clear: both;
  font-size: 1.5rem;
  height: 128px;
  margin: 0 10px 20px;
  overflow: hidden;
  padding: 0;
  text-align: left;
  width: 420px;
}

.img_fun_slick {
  float: left;
  width: 222px;
}

.txt_fun_slick{
  float: right;
  height: 100%;
  padding: 10px 6px;
  width: 46%;
}

.hmr_fun_slick > .btn_css_toggle {
  bottom: -25px;
  right: 26px;
}

.hmr_fun_slick .l_ttl {
  color: #003987;
  font-size: 1.5rem;
  font-weight: 600;
  margin: 0 0 5px 0;
}

.hmr_fun_slick .cap {
  color: #333;
  font-size: 1.5rem;
  margin: 0;
}

/*--ばな--*/
.mod_officialbnr {
  margin: 20px auto 0;
	padding: 0 0 25px;
  position: relative;
  width: 100%;
}

.mod_officialbnr .post_slick_inner {
	width: 920px;
}

.post_slick_inner > .mod_slick_bnr {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  margin: 0 auto 20px;
  width: 930px;
}

.mod_slick_bnr li {
  margin: 10px 10px 0 0;
  width: 300px;
}

.mod_slick_bnr .slick-dots{
	bottom: -45px;
	position: absolute;
}

.mod_officialbnr .btn_css_toggle {
  bottom: -45px;
}


/* ---------------------------------------
 公式アプリ  official_app_box
---------------------------------------- */
.official_app_box {
  padding-bottom: 30px;
}

.official_app_box .h_ttl {
  border-top: 2px solid #ad7d03;
  margin: 0 0 20px 0;
  text-align: center;
  width: 100%;
}

/* ---------------------------------------
 歴史にふれる2日間の旅バナー bnr_history_tour
---------------------------------------- */
.bnr_history_tour{
  margin: 50px auto 0;
  width: 700px;
}
.bnr_history_tour a{
  display: block;
}
.bnr_history_tour a:hover img{
  opacity: 0.8;
}
.bnr_history_tour figcaption{
  padding-top: 10px;
  text-align: center;
}

/* ---------------------------------------
 広告イメージ他
---------------------------------------- */
/*--seo--*/
.mod_prtxt{
  background: rgba(194,192,129,0.2);
  font-size: 1.5rem;
  line-height: 2.3rem;
  margin: 60px auto 0;
  padding: 30px 50px;
  position: relative;
  text-align: left;
  width: 790px;
}

.mod_prtxt p{
  margin: 0;
}

.mod_prtxt::before{
  content: url("/hotel/image/top/icn_bg_seo.png");
  display: block;
  left: -8px;
  position: absolute;
  top: -18px;
}

.mod_prtxt::after{
  content: url("/hotel/image/top/icn_bg_seo.png");
  display: block;
  position: absolute;
  right: -8px;
  transform: rotate(180deg);
  bottom: -18px;
}

/*--イメージキャラ--*/
.mod_chara_img{
  margin-top: 50px;
  padding-bottom: 20px;
  text-align: center;
}

/*----------------------------------------
footer
------------------------------------------*/

.hotel_footer_box{
  background: url("/hotel/image/top/bg_footer.png") repeat 0 0;
  color: #fff;
  font-size: 1.5rem;
  padding-top: 30px;
  text-align: center;
  width: 100%;
}

.hotel_footer_inner{
	margin: 0 auto;
	width: 1000px;
}

.hotel_footer_box .logo {
  margin: 0 auto;
}

.hotel_footer_box .menu {
  margin: 30px auto 15px;
  padding: 0;
  position: relative;
  width: 1000px;
}

.hotel_footer_box .menu {
  margin: 30px auto 15px;
  padding: 0;
  position: relative;
  width: 1000px;
}

.hotel_footer_box .menu::before{
  bottom: -87px;
  background: url("/hotel/image/top/img_footer_left.png") no-repeat 0 0;
  background-size: 95%;
  opacity: 0.6;
  content: "";
  display: block;
  height: 180px;
  left: 0;
  position: absolute;
  width: 130px;
}

.hotel_footer_box .menu::after{
  bottom: -109px;
  background: url("/hotel/image/top/img_footer_right.png") no-repeat 0 0;
  background-size: 110%;
  opacity: 0.6;
  content: "";
  display: block;
  height: 180px;
  right: 0;
  position: absolute;
  width: 130px;
}

.hotel_footer_box .menu li{
  margin-right: 40px;
  padding-left: 5px;
  position: relative;
}

.hotel_footer_box .menu li::after{
  background-color: #ce9d1a;
  content: '';
  display: block;
  height: 8px;
  left: -1.5rem;
  position: absolute;
  top: 0.2rem;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
  width: 8px;
}

.hotel_footer_box .menu li:last-child{
  margin-right: 0;
}

.hotel_footer_box .product{
  margin: 0 auto 30px;
  width: 685px;
}

.hotel_footer_box .product dd{
  margin: 0;
}

.copy_box{
  background: #ad2716;
  color: #fff;
  font-size: 1.2rem;
  line-height: 3rem;
  margin: 0;
  padding: 0;
  text-align: center;
}

.copy_box_inner{
	display: block;
	margin: 0 auto;
	width: 1000px;
}

.hotel_footer_box a,
.copy_box a{
  color: #fff;
}

/*-------------------------------------
page top
---------------------------------------------*/
.mod_pagetop {
	background: url("/hotel/image/top/bg_btn_go_top.png") no-repeat 0 0;
  bottom: 0;
  cursor: pointer;
  display: none;
  height: 100px;
  position: fixed;
  right: 30px;
  z-index: 1;
  width: 100px;
}

.mod_pagetop:hover img{
  opacity: 0.7;
}

/*-------------------------------------------
ログインモーダル
--------------------------------------------*/
/* ---------------------------------------
 モーダル ユーザーログイン　mod_usr_login
---------------------------------------- */

.mod_usr_login {
  background: url("/hotel/image/top/bg_login_middle.png") repeat-y 0 0;
  border: none;
  color: #fff;
  display: none;
  margin: 0 auto;
  min-height: 450px;
  padding: 0;
  position: absolute;
  text-align: center;
  width: 364px;
}

.mod_usr_login::before{
  content: url("/hotel/image/top/bg_login_top.png");
  position: absolute;
  left: 0;
  top: -35px;
}

.mod_usr_login h4{
  margin: 0 auto 25px;
}

.mod_usr_login_inner{
  padding: 0 25px;
  position: relative;
}

.mod_usr_login_inner::after{
  bottom: -40px;
  content: url("/hotel/image/top/bg_login_bottom.png");
  left: 0;
  position: absolute;
}

/* 入力フォーム */

.login_input{
  padding:0;
}

.login_input input[type="text"],
.login_input input[type="password"] {
  background: #fff;
  border: 1px solid #ce9d1a;
  box-shadow: 2px 2px 8px rgba(0,0,0,.2) inset;
  color: #444;
  line-height: 2.4rem;
  margin: 0;
  padding: 6px 6px 6px 0;
  vertical-align: middle;
  width: 270px;
}

/* アイコン */

.login_input li{
  margin-bottom: 10px;
  position: relative;
  text-align: right;
}

.login_input .pw_btn {
  padding-bottom: 60px;
}

.login_input .id::before {
  background: url("/hotel/image/top/icn_login_mail.png") no-repeat 0 0;
  content: "";
  display: inline-block;
  height: 19px;
  left: 0;
  position: absolute;
  top: 10px;
  width: 27px;
}

.login_input .pw_btn::before {
  background: url("/hotel/image/top/icn_login_pass.png") no-repeat 0 0;
  content: "";
  display: inline-block;
  height: 19px;
  left: 0;
  position: absolute;
  top: 10px;
  width: 27px;
}

.mod_usr_login .login{
  height: 40px;
	left: 0;
  margin: 5px auto 10px;
	position: absolute;
	right: 0;
	top: 45px;
  width: 200px;
}

.mod_usr_login .login:hover{
  opacity: 0.7;
}

.regist .btn_login{
	background: #fff;
	display: block;
	height: 42px;
	overflow: hidden;
  margin: 10px auto;
  text-align: center;
  width: 300px;
}

.regist .btn_login:hover img{
	opacity: 0.7;
}


/* エラー表示 */

.mod_usr_login .err {
  background: #fefbf6;
  border: 2px solid #cf3a3b;
  color: #cf3a3b;
  display: none;
  font-weight: 600;
  line-height: 1.4;
  margin: 15px auto 5px;
  padding: 5px 10px 3px;
  text-align: center;
}

/* 自動ログインチェック */

.mod_usr_login .chkbox input[type="checkbox"] {
  background: #fff;
  border: 1px solid #ce9d1a;
  height: 20px;
  margin: 0 4px 4px 0;
  position: relative;
  vertical-align: middle;
  width: 20px;
  -webkit-appearance: none;
  -moz-appearance: none;
}

.mod_usr_login .chkbox input[type="checkbox"]:checked::after {
  border-bottom: 4px solid #333;
  border-left: 4px solid #333;
  content: "";
  display: block;
  height: 9px;
  left: 3px;
  position: absolute;
  top: 2px;
  transform: rotate(-45deg);
  width: 15px;
}

.mod_usr_login .chkbox label {
  font-size: 1.5rem;
}

/* PW忘れた方 */

.mod_usr_login .remind {
  letter-spacing: 0;
  line-height: 2.4rem;
  margin: 0 0 10px;
}

.mod_usr_login .remind a {
  color: #fff;
  font-weight: 600;
}

/* はじめての方 */

.mod_usr_login .howto {
  margin: 20px auto;
  position: relative;
  text-align: left;
}

.mod_usr_login .howto a {
  color: #fff;
  display: block;
	margin: 0 auto;
  padding: 0 4px;
  position: relative;
	text-decoration: underline;
	width: 185px;
}

.mod_usr_login .howto a:hover {
  color: #ea2020;
}

.mod_usr_login use {
  fill: #fff;
}

.mod_usr_login .howto a:hover svg use{
  fill: #ea2020;
}

.arr_login_howto{
  display: block;
  height: 17px;
  position: absolute;
  right: 0;
  top: 0;
  width: 17px;
}

/* 閉じるボタン */

.mod_usr_login .close {
  bottom: -95px;
  left: 0;
  margin: 0;
  position: absolute;
  right: 0;
}

.mod_usr_login .clsbtn {
  background: #fff;
  display: block;
  height: 40px;
  margin: 0 auto;
  overflow: hidden;
  position: relative;
  right: auto;
  top: 0;
  width: 200px;
}

.mod_usr_login .close_btn img {
  left: 0;
  position: absolute;
  top: 0;
}

.mod_usr_login .close_btn:hover img {
	opacity: 0.7;
}

/*   ローディング　GIF */

.mod_usr_login .loading {
  background: url("/hotel/image/top/bg_login_middle.png") no-repeat 0 0;
  display: none;
  height: 100%;
  left: 0;
  margin: auto;
  position: absolute;
  top: 0;
  width: 100%;
  z-index: 102;
}

.mod_usr_login .loading img {
  bottom: 0;
  display: inline-block;
  height: 38px;
  left: 0;
  margin: auto;
  position: absolute;
  right: 0;
  top: 0;
  width: 38px;
}

/*ログイン注意文*/
.box_login_caution_modal {
  margin: 30px auto 10px;
  padding: 10px 4%;
  background: #fff;
}

.box_login_caution_modal .ttl {
  position: relative;
  top: 0;
  width: 100%;
  background: #fff;
  color: #000;
}
.box_login_caution_modal .read {
  color: #000;
}

/*------------------------------------------
50音モーダル
------------------------------------------*/
.modal-overlay {
  background: rgba(0,0,0,1);
}

/* モーダル全体 */

.mod_srch_50on {
  background: url("/hotel/image/top/bg_modal_50on.png") no-repeat 0 0;
  display: none;
  height: 351px;
  padding: 40px 0 30px;
  position: absolute;
  width: 644px;
}

.mod_srch_50on .ttl {
  margin: 0 auto 30px;
  text-align: center;
}

.mod_50on_box{
  margin: 0 auto;
  width: 545px;
}

.mod_50on_box_inner{
  margin: 0;
  padding: 0;
  width: 48%;
}

.mod_50on_box_inner li{
  margin: 0 0 10px 0;
  padding: 0;
  width: 45px;
}

.mod_50on_box_inner li > a,
.mod_50on_box_inner li > span{
  display: block;
  font-weight: 600;
  height: 36px;
  line-height: 3.6rem;
  text-align: center;
  padding: 0;
  width: 45px;
}

.mod_50on_box_inner li > span{
  background: #eee;
  color: #999;
}

.l_a a{
  background: linear-gradient(to bottom, #ffffff 48%,#f1eff4 50%,#f1eff4 100%);
  border: 1px solid #7a5f90;
  color: #7a5f90;
}

.l_a  a:hover{
  background: #7a5f90;
  color: #fff;
  font-weight: 100;
}

.l_ka a{
  background: linear-gradient(to bottom, #ffffff 48%,#eff0f3 50%,#eff0f3 100%);
  border: 1px solid #616a8e;
  color: #616a8e;
}

.l_ka a:hover{
  background: #616a8e;
  color: #fff;
  font-weight: 100;
}

.l_sa a{
  background: linear-gradient(to bottom, #ffffff 48%,#ecf2f1 50%,#ecf2f1 100%);
  border: 1px solid #447c73;
  color: #447c73;
}

.l_sa a:hover{
  background: #447c73;
  color: #fff;
  font-weight: 100;
}

.l_ta a{
  background: linear-gradient(to bottom, #ffffff 48%,#ecf2f1 50%,#ecf2f1 100%);
  border: 1px solid #5f8033;
  color: #5f8033;
}

.l_ta a:hover{
  background: #5f8033;
  color: #fff;
  font-weight: 100;
}

.l_na a{
  background: linear-gradient(to bottom, #ffffff 48%,#faf2e8 50%,#faf2e8 100%);
  border: 1px solid #ce841a;
  color: #ce841a;
}

.l_na a:hover{
  background: #ce841a;
  color: #fff;
  font-weight: 100;
}

.l_ha a{
  background: linear-gradient(to bottom, #ffffff 48%,#f9ebe9 50%,#f9ebe9 100%);
  border: 1px solid #c33927;
  color: #c33927;
}

.l_ha a:hover{
  background: #c33927;
  color: #fff;
  font-weight: 100;
}

.l_ma a{
  background: linear-gradient(to bottom, #ffffff 48%,#f9e9ef 50%,#f9e9ef 100%);
  border: 1px solid #c72562;
  color: #c72562;
}

.l_ma a:hover{
  background: #c72562;
  color: #fff;
  font-weight: 100;
}

.l_ya a{
  background: linear-gradient(to bottom, #ffffff 48%,#f5ebf7 50%,#f5ebf7 100%);
  border: 1px solid #9f3fad;
  color: #9f3fad;
}

.l_ya a:hover{
  background: #9f3fad;
  color: #fff;
  font-weight: 100;
}

.l_ra a{
  background: linear-gradient(to bottom, #ffffff 48%,#f1ecf5 50%,#f1ecf5 100%);
  border: 1px solid #78489d;
  color: #78489d;
}

.l_ra a:hover{
  background: #78489d;
  color: #fff;
  font-weight: 100;
}

.l_wa a{
  background: linear-gradient(to bottom, #ffffff 48%,#f3eee8 50%,#f3eee8 100%);
  border: 1px solid #86591f;
  color: #86591f;
}

.l_wa a:hover{
  background: #86591f;
  border: 1px solid #fff;
  color: #fff;
  font-weight: 100;
}

.mod_srch_50on .close_btn {
  bottom: -60px;
  cursor: pointer;
  height: 40px;
  left: 0;
  margin: 0 auto;
  overflow: hidden;
  position: absolute;
  top: initial;
  right: 0;
  width: 200px;
}

.mod_srch_50on .close_btn img {
  left: 0;
  position: absolute;
  top: 0;
}

.mod_srch_50on .close_btn:hover img {
  bottom: 0;
  top: auto;
}


/* ---------------------------------------
 slick共通
---------------------------------------- */
.slick-dots {
  display: block;
  height: 20px;
  left: 0;
  list-style: none;
  margin: 0;
  padding: 0;
  position: absolute;
  text-align: center;
  width: 100%;
}

.post_review_slick > .slick-dots,
.post_photo_slick > .slick-dots,
.post_movie_slick > .slick-dots{
  bottom: -45px
}

.hmr_fun_slick .slick-dots{
  bottom: -25px;
}

.hmr_bnr_slick .slick-dots{
  bottom: -35px;
}

.slick-dots li {
  cursor: pointer;
  display: inline-block;
  height: 20px;
  line-height: 20px;
  margin: 0 24px;
  padding: 0;
  position: relative;
  width: 0;
}

.slick-dots li button {
  background: transparent;
  border: 0;
  color: transparent;
  cursor: pointer;
  display: block;
  height: 30px;
  outline: none;
  padding: 5px;
  position: relative;
}

.slick-dots li button:hover,
.slick-dots li button:focus {
  outline: none;
}

.slick-dots li button:hover:before,
.slick-dots li button:focus:before {
  opacity: 1;
}

.slick-dots li button:before {
  display: block;
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 10px;
  height: 10px;
  background-color: #86591f;
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

.slick-prev, .slick-next {
  background: #c33927;
  border: 1px solid #ce9d1a;
  cursor: pointer;
  display: block;
  font-size: 0;
  height: 70px;
  padding: 0;
  position: absolute;
  width: 35px;
}


.slick-next::after{
  background: url("/hotel/image/top/ico_nav_hmr_camp.png") no-repeat 0 0/cover;
  content: "";
  display: block;
  margin: 0 10px;
  transform: rotate(-180deg);
  height: 22px;
  width: 10px;
}


.slick-prev::after{
  background: url("/hotel/image/top/ico_nav_hmr_camp.png") no-repeat 0 0/cover;
  content: "";
  display: block;
  height: 22px;
  margin: 0 10px;
  width: 10px;
}

#hmr_cam .slick-prev{
  left: -55px;
  top: 45px;
}


#hmr_cam .slick-next{
  right: -54px;
  top: 45px;
}

#hmr_fun .slick-prev{
  left: -50px;
  top: 105px;
}


#hmr_fun .slick-next{
  right: -50px;
  top: 105px;
}

#hmr_bnr .slick-prev{
  left: -45px;
  top: 12px;
}


#hmr_bnr .slick-next{
  right: -35px;
  top: 12px;
}

#js-post_carousel_review .slick-dots li.slick-active button:before {
  background: #c4402c;
}

#js-post_carousel_photo .slick-dots li.slick-active button:before {
  background: #697193;
}

#js-post_carousel_movie .slick-dots li.slick-active button:before {
  background: #658337;
}

#js-carousel_hmr_camp .slick-dots li.slick-active button:before,
#hmr_fun .slick-dots li.slick-active button:before,
#hmr_bnr .slick-dots li.slick-active button:before{
  background: #d25b07;
}

/*--player--*/
.audio_box{
  margin: 0;
}

/*--ボタンリセット--*/
[role=button], [type=button], [type=reset], [type=submit], button {
  cursor: pointer;
}
button,
input,
select,
textarea {
  background-color: transparent;
  border-style: none;
  color: inherit;
  padding: 0;
}

input[type=text],input[type=password]{
  font-weight: 100;
  text-indent: 1.2rem;
}

/* placeholder文字 */
input::-webkit-input-placeholder { color: #000; opacity:1; }
input::-moz-placeholder { color: #000; opacity:1;}
input::-ms-input-placeholder { color: #000; opacity:1;}
input:focus::-webkit-input-placeholder { color: transparent;}
input:focus::-moz-placeholder { color: transparent;}
input:focus::-ms-placeholder { color: transparent;}
/*--svg親非表示--*/
.arr_parent{
  display: none;
}

/*----------------------------------------
アンカーナビゲーション #13172 #nav_anchor
-----------------------------------------*/
.nav_anchor_box{
  top: 75px;
}

/*-----------------------------------
　新しいお部屋探しのご提案リード
-----------------------------------*/
#rent_pr_search .rent_pr_inner {
  margin-top: 55px;
  width: 320px;
}

#rent_pr_search .rent_pr_inner p{
  font-size: 1.7rem;
}

.show_more #rent_pr_search .rent_pr_inner .btn_read_more{
  display: block;
  margin: 10px 0 0;
}

#rent_pr_search .rent_pr_inner .btn_read_more a{
  font-size: 1.7rem;
}

/*-- キャプション上書き --*/
.mod_bnr_special li p {
  font-size: 1.6rem;
  line-height: 1.3;
}

@media only screen and (min-device-width: 481px) and (max-device-width: 1024px) {
body{
  width:1024px;
}

.no_pc{
  display: block;
}

.join_box::after {
  right: -8px;
}

.nav_area_list_ttl01:after,
.nav_area_list_ttl02:after,
.nav_area_list_ttl03:after,
.nav_area_list_ttl04:after,
.nav_area_list_ttl05:after,
.nav_area_list_ttl06:after,
.nav_area_list_ttl07:after,
.nav_area_list_ttl08:after {
  left: 99.6%;
}

.nav_area_list a {
  line-height: 28px;
}

.srch_name_input {
  border-radius: 0;
  height: 40px;
  line-height: 2.4rem;
}

.mod_srch_bkn .lnk.is_pc_hide {
  display: block;
}

.mod_srch_bkn .lnk.is_tab_hide {
  display: none;
}


.hotel_footer_box .menu::before{
  bottom: -68px;
  left: -10px;
}

.hotel_footer_box .menu::after{
  bottom: -90px;
  right: -10px;
}

a[class^="btn_all_link_"]:hover{
  opacity: 1;
}
.mod_officialbnr .btn_css_toggle {
  bottom: -45px;
}
}

.facility_research {
  display: flex;
  justify-content: center;
  margin: 30px auto 35px;
  text-align: center;
}

.facility_research figure a {
  display: block;
}

.facility_research figure a:hover {
  opacity: .7;
}

.facility_research figure figcaption{
  font-size: 16px;
  line-height: 1.5;
  margin-top: 16px;
}