@charset "UTF-8";
/* ===================================================================
CSS information

 file name  : homepage.css
 author     : Ability Consultant
 style info : トップページ
=================================================================== */
/*Animate */
.mg_t--10 {
  margin-top: 10px !important;
}

.mg_t--20 {
  margin-top: 20px !important;
}

.mg_t--30 {
  margin-top: 30px !important;
}

.mg_t--40 {
  margin-top: 40px !important;
}

.mg_t--50 {
  margin-top: 50px !important;
}

.mg_t--60 {
  margin-top: 60px !important;
}

.mg_t--70 {
  margin-top: 70px !important;
}

.mg_t--80 {
  margin-top: 80px !important;
}

.mg_t--90 {
  margin-top: 90px !important;
}

.mg_t--100 {
  margin-top: 100px !important;
}

.mg_t--110 {
  margin-top: 110px !important;
}

.mg_t--120 {
  margin-top: 120px !important;
}

.mg_t--130 {
  margin-top: 130px !important;
}

.mg_t--140 {
  margin-top: 140px !important;
}

.mg_t--150 {
  margin-top: 150px !important;
}

.mg_t--160 {
  margin-top: 160px !important;
}

.mg_t--170 {
  margin-top: 170px !important;
}

.mg_t--180 {
  margin-top: 180px !important;
}

.mg_t--190 {
  margin-top: 190px !important;
}

.mg_t--200 {
  margin-top: 200px !important;
}

.mg_t--210 {
  margin-top: 210px !important;
}

.mg_t--220 {
  margin-top: 220px !important;
}

.mg_t--230 {
  margin-top: 230px !important;
}

.mg_t--240 {
  margin-top: 240px !important;
}

.mg_t--250 {
  margin-top: 250px !important;
}

.center {
  text-align: center;
  margin-right: auto;
  margin-left: auto;
}

#htlSide-A {
  position: absolute !important;
  top: 13.5% !important;
}
@media only screen and (min-width: 1200px) and (max-width: 1430px) {
  #htlSide-A {
    top: 13% !important;
  }
}
@media only screen and (min-width: 767px) and (max-width: 1200px) {
  #htlSide-A {
    top: 15.5% !important;
  }
}

.fv_mainimg {
  width: 100%;
}
.fv_mainimg img {
  width: 100%;
  height: 600px;
  object-fit: cover;
}

.con_rooms {
  margin: 170px auto 260px;
}
@media screen and (max-width: 1370px) {
  .con_rooms {
    margin-left: calc(4% + 210px);
  }
}

.con_anchor2 {
  width: 100%;
  margin: 0 auto 164px;
}
@media screen and (max-width: 1370px) {
  .con_anchor2 {
    width: calc(96% - 210px);
    margin-left: calc(4% + 210px);
  }
}
.con_anchor2 ul {
  display: flex;
  justify-content: center;
  flex-wrap: wrap;
}
.con_anchor2 ul li {
  border-bottom: 5px solid #1e40ba;
  text-align: center;
  line-height: 1.5;
  align-self: flex-end;
  margin: 0 35px;
  width: clamp(180px, 100%, 200px);
}
.con_anchor2 ul li:first-child {
  margin-left: 0;
}
.con_anchor2 ul li:last-child {
  margin-right: 0;
}
.con_anchor2 ul li a {
  font-family: "Noto Serif JP", "游明朝", "Yu Mincho", YuMincho, "ヒラギノ明朝 Pro W3", "Hiragino Mincho Pro", "HGS明朝E", "ＭＳ Ｐ明朝", "MS PMincho", "Times New Roman", Times, Garamond, Georgia, serif;
  display: block;
  padding: 0.7em 0;
  position: relative;
  font-size: 112%;
  color: #000 !important;
}
@media screen and (max-width: 1229px) {
  .con_anchor2 ul li a {
    font-size: 90%;
  }
}
.con_anchor2 ul li a::before {
  content: "";
  width: 1px;
  height: 0;
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
  top: calc(100% + 8px);
  background: #474747;
  -webkit-transition: 0.5s;
  -moz-transition: 0.5s;
  -ms-transition: 0.5s;
  -o-transition: 0.5s;
  transition: 0.5s;
}
.con_anchor2 ul li a:hover {
  color: #000 !important;
}
.con_anchor2 ul li a:hover::before {
  height: 40px;
}

@media only screen and (min-width: 767px) and (max-width: 1880px) {
  .con_anchor2 ul {
    display: flex;
    flex-wrap: wrap;
  }
  .con_anchor2 ul li {
    border-bottom: 5px solid #1e40ba;
    text-align: center;
    line-height: 1.5;
    align-self: flex-end;
    margin: 0 6px;
  }
  .con_anchor2 ul li a {
    font-size: 90%;
  }
  .con_anchor2 ul li a:hover {
    color: #000 !important;
  }
}
@media screen and (max-width: 1229px) {
  .con_anchor2 {
    margin-left: calc(4% + 210px);
  }
}

.wrp_rooms1 {
  width: 100%;
  position: relative;
  margin-bottom: 130px;
}
.wrp_rooms1 .txt {
  display: block;
  text-align: center;
}

.wrp_rooms2 {
  width: 100%;
  position: relative;
  margin-bottom: 130px;
}

.wrp_rooms3 {
  width: 100%;
  position: relative;
  margin-bottom: 130px;
}

.wrp_rooms4 {
  width: 100%;
  position: relative;
  margin-bottom: 130px;
}
.wrp_rooms4 .img {
  margin-bottom: 5em;
}
@media only screen and (min-width: 767px) and (max-width: 1280px) {
  .wrp_rooms4 .img {
    margin-bottom: 3em;
  }
}

.wrp_rooms1,
.wrp_rooms2,
.wrp_rooms3,
.wrp_rooms4 {
  margin-bottom: 214px !important;
}
.wrp_rooms1 > .txt,
.wrp_rooms2 > .txt,
.wrp_rooms3 > .txt,
.wrp_rooms4 > .txt {
  margin-bottom: 2em;
}
.wrp_rooms1 .iframe_wrp,
.wrp_rooms2 .iframe_wrp,
.wrp_rooms3 .iframe_wrp,
.wrp_rooms4 .iframe_wrp {
  position: relative;
  width: 100%;
  padding-top: 35.25%;
  overflow: auto;
  -webkit-overflow-scrolling: touch;
}
@media only screen and (min-width: 980px) and (max-width: 1200px) {
  .wrp_rooms1 .iframe_wrp,
  .wrp_rooms2 .iframe_wrp,
  .wrp_rooms3 .iframe_wrp,
  .wrp_rooms4 .iframe_wrp {
    padding-top: 56.25%;
  }
}
.wrp_rooms1 .iframe_wrp iframe,
.wrp_rooms2 .iframe_wrp iframe,
.wrp_rooms3 .iframe_wrp iframe,
.wrp_rooms4 .iframe_wrp iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: none;
  display: block;
  box-sizing: border-box !important;
}
.wrp_rooms1 .txt2,
.wrp_rooms2 .txt2,
.wrp_rooms3 .txt2,
.wrp_rooms4 .txt2 {
  position: relative;
  width: 95%;
  text-align: center;
  max-width: 1187px;
}
.wrp_rooms1 .txt2 span,
.wrp_rooms2 .txt2 span,
.wrp_rooms3 .txt2 span,
.wrp_rooms4 .txt2 span {
  position: absolute;
  bottom: 0;
  left: 12.13142%;
}
@media only screen and (min-width: 767px) and (max-width: 1600px) {
  .wrp_rooms1 .txt2,
  .wrp_rooms2 .txt2,
  .wrp_rooms3 .txt2,
  .wrp_rooms4 .txt2 {
    margin-top: 3em;
  }
}
.wrp_rooms1 .btn_pt4,
.wrp_rooms2 .btn_pt4,
.wrp_rooms3 .btn_pt4,
.wrp_rooms4 .btn_pt4 {
  text-align: center;
  margin: 0 auto;
}

.slider_rooms2 .arr_l,
.slider_rooms2 .arr_r {
  display: block;
  cursor: pointer;
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  z-index: 2;
  width: 70px;
  height: 70px;
}
.slider_rooms2 .arr_l {
  background: url(../images/common/arr_left.png) no-repeat;
  left: 25%;
}
.slider_rooms2 .arr_r {
  background: url(../images/common/arr_right.png) no-repeat;
  right: 25%;
}
.slider_rooms2 .slick-slide {
  margin: 0 1.5em;
}
.slider_rooms2 .slick-slide img {
  height: 100%;
  width: 100%;
}

.con_roomslider .txt {
  margin-bottom: 4em;
}
