@charset "utf-8";
/* CSS Document */
/* -----------------------------------------------------------
	RMC
----------------------------------------------------------- */
@import url('https://fonts.googleapis.com/css2?family=Whisper&display=swap');
@import url('https://fonts.googleapis.com/css?family=Noto+Sans+JP');
.s-txt {
  font-size: 80%;
}
.m-txt {
  font-size: 90%;
}
.font_noto {
  font-family: 'Noto Sans JP', sans-serif;
}
.rmc {
  margin: 0 0 2em;
  padding: 2rem 0;
}
.rmc .rmc_mb {
  margin: 0 auto 4em
}
@media (max-width: 768px) {
  .rmc {
    padding: 0;
    letter-spacing: 0.1rem
  }
  .rmc_hotels .first_colum {
    order: -1;
  }
}
.rmc_contents {
  margin: 0 2em 1em;
  font-size: 1rem;
}
.rmc_contents p {
  margin: 0;
}
.rmc_contents p:last-child {
  margin: 0 0 1em;
}
.rmc_contents li {
  list-style: none;
}
.rmc_contents li p {
  text-indent: 1em;
}
.rmc_contents p.mar0a {
  margin: 0 auto 1em;
}
/* -----------------------------------------------------------
	board
----------------------------------------------------------- */
.rmc_board {
  position: relative;
  margin: 2em auto;
  padding: 3em 1em 1em;
  background-color: #fff; /* ボックス背景色 */
  border: 5px solid #c6c6c6; /* 枠線 */
  box-shadow: 0 0 8px #333, 0 0 2px #555 inset;
}
.rmc_board::before, .rmc_board::after {
  position: absolute;
  content: '';
  bottom: 4px;
  width: 25px;
  border-radius: 2px;
  box-shadow: 1px 1px 3px #666;
}
.rmc_board::before {
  right: 60px;
  border: solid 3px #333; /*飾ペン黒 */
  transform: rotate(2deg); /*飾ペン角度 */
}
.rmc_board::after {
  right: 22px;
  border: solid 3px #ff0000; /*飾ペン赤 */
  transform: rotate(9deg); /*飾ペン角度 */
}
@media (max-width: 768px) {
  .rmc_board ul {
    padding: 4rem 0 1rem 1rem
  }
}
/* -----------------------------------------------------------
	recording bnr
----------------------------------------------------------- */
.rmc_record {
  margin: 0 auto;
  width: 85%;
  padding: 10% 0
}
.recording_bnr {
  width: 35%;
  margin: 0 auto
}
.recording_bnr {
  position: relative;
  margin: 0 auto;
  cursor: pointer;
}
.recording_bnr a.rr_button {
  position: relative;
  display: block;
  margin: 0 auto
}
.recording_bnr img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 100%;
  display: block;
  -webkit-transition: .4s ease-in-out;
  transition: .4s ease-in-out;
}
.recording_bnr:hover img:nth-of-type(2) {
  -webkit-transform: translate(-50%, -50%) scale(1.15) !important;
  transform: translate(-50%, -50%) scale(1.15) !important;
  opacity: 0;
}
@media (max-width: 767px) {
  .recording_bnr {
    width: 100%
  }
}
/* -----------------------------------------------------------
	mailmagazine_news
----------------------------------------------------------- */
.mailmagazine_news {
  position: relative;
  width: 45%;
  margin: 0 auto;
  padding: 10% 0;
}
.mailmagazine_news .mailmagazine_news_img img {
  position: absolute;
  top: 50%;
  left: 50%;
  -webkit-transform: translate(-50%, -50%);
  transform: translate(-50%, -50%);
  width: 100%;
  display: block;
  -webkit-transition: .4s ease-in-out;
  transition: .4s ease-in-out;
}
.mailmagazine_news .mailmagazine_news_img:hover img:nth-of-type(2) {
  -webkit-transform: translate(-50%, -50%) scale(1.15) !important;
  transform: translate(-50%, -50%) scale(1.15) !important;
  opacity: 0;
}
@media (max-width: 768px) {
  .mailmagazine_news {
    width: 90%;
    padding: 30% 0;
  }
}
/* -----------------------------------------------------------
	フレックス
----------------------------------------------------------- */
.rr_flexsw3-1 .rmc_contents {
  border: 1px solid rgba(0, 0, 0, 1.00);
  border-radius: 1%;
}
.rr_flexsw3-1 .rmc_contents h3 {
  font-size: 1.6rem;
  text-align: center;
}
.rr_flexsw2-1 {
  flex-wrap: wrap;
}
.rr_flexsw2-1 .rmc_contents {
  border: 1px solid rgba(0, 0, 0, 1.00);
  border-radius: 1%;
  padding: 1em;
}
.rmc_contents p.rmc_astrop {
  width: 80%;
  font-size: 0.9rem;
  letter-spacing: 1px;
  margin: 0 auto;
  max-width: 1200px
}
.rmc_info {
  margin: 0 auto 2em;
}
.rmc_info .rmc_contents {
  width: 90%;
  margin: 0 auto 1em;
}
.btn_link {
  background: rgba(201, 178, 124, 1.00);
  text-align: center;
  padding: 10px;
  margin: 0 auto 1em;
  max-width: 400px;
}
.btn_link a {
  color: rgba(255, 255, 255, 1.00);
}
.btn_link a:hover {
  text-decoration: none;
}
[class^='rr_flexs'] {
  max-width: 1200px;
  margin: 0 auto;
}
@keyframes delay_flowAnime {
  from {
    opacity: 0;
    transform: translateY(100px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}
@media (min-width: 768px) {
  .rmc .rr_flexsw2-1 > * {
    width: 42%;
    box-sizing: border-box
  }
  .rmc_w90pc {
    width: 90%;
    margin: 0 auto 1em
  }
}
@media (max-width: 767px) {
  .rmc .rmc_contents {
    margin: 0 auto 1em;
    padding: 1%;
    max-width: 95%
  }
  .rmc_bookinglink {
    width: 90%;
    max-width: 400px;
    margin: 0 auto 2em
  }
}
/* -----------------------------------------------------------
	hタグ
----------------------------------------------------------- */
.rmc h2 {
  text-align: center;
  font-size: 2rem;
}
.rmc h3 {
  text-align: center;
  font-size: 1.5rem;
}
.rmc h4 {
  font-size: 1.05rem;
}
h3.h3_ttlg {
  background: rgba(201, 178, 124, 1.00);
  color: rgba(255, 0, 60, 1.00);
  width: 80%;
  margin: 0 auto;
}
.rmc h3.h3_ttl2 {
  padding: 0 0 0 1.2em;
  position: relative;
  font-size: 1.2em;
  border-radius: 0 10px 10px 0;
  text-align: left;
}
.rmc h3.h3_ttl2:before {
  content: "";
  display: inline-block;
  line-height: 2em;
  position: absolute;
  padding: 0em;
  color: white;
  background: rgb(201 178 124);
  font-weight: 900;
  width: 1.5em;
  height: 1.5em;
  text-align: left;
  left: -1.35em;
  top: 50%;
  -webkit-transform: translateY(-50%);
  transform: translateY(-50%);
  border-radius: 50%;
  box-shadow: 1px 1px 2px rgba(0, 0, 0, 0.29);
}
.rmc_h2title2 {
  background: rgba(0, 0, 0, 1.00);
  color: rgba(255, 255, 255, 1.00);
  font-size: 1.3rem;
}
.rmc_info h3 {
  font-size: 1.2em;
  text-align: left;
}
.rmc_contents h3.rmc_h3ttl2 {
  font-size: 1.2rem;
  text-align: center;
}
.rmc_board .h3_title {
  position: absolute;
  left: 1em;
  top: .5em;
  font-weight: bold;
  font-size: 1.1em; /* 文字サイズ */
  color: #2ba0f3; /* タイトル文字色 */
  border-style: none none solid;
  border-color: #2ba0f3; /*タイトル下線 */
  border-width: 3px;
}
@media (max-width: 767px) {
  h3.h3_ttlg {
    width: 90%;
  }
  .rmc h2 {
    font-size: 1.4rem;
  }
  .rmc h3 {
    font-size: 1.2rem;
  }
}
/* -----------------------------------------------------------
	hexagon
----------------------------------------------------------- */
.rewards h2.ttl_hexagon {
  width: 4em;
  height: 5.7em;
  background: #000;
  font-size: 1.6rem;
  position: relative;
  margin: 0 auto 2em;
  padding: 1.6em 0.2em 0.4em;
}
.rewards h2.ttl_hexagon::before, .rewards h2.ttl_hexagon::after {
  content: "";
  width: 100%;
  height: 100%;
  position: absolute;
  top: 0;
  left: 0;
  background: #000;
  z-index: 0;
}
.rewards h2.ttl_hexagon::before {
  transform: rotate(60deg);
}
.rewards h2.ttl_hexagon::after {
  transform: rotate(-60deg);
}
.ttl_hexagon_inclu {
  height: 100%;
  width: 100%;
  font-weight: bold;
  color: #fff;
  padding: 0.2em 0.2em 0.2em 0;
  justify-content: center;
  align-items: center;
  position: relative;
  z-index: 1;
}
.ttl_hexagon_inclu span.br {
  display: block;
}
/* -----------------------------------------------------------
	octagon
----------------------------------------------------------- */
h2.ttl_octagon .ttl_octagon_inclu {
  padding: 0 0 0 4rem;
  display: inline-block;
  background-image: url(/upload/tenant_1/rmc_icon01.png);
  background-repeat: no-repeat;
  background-size: contain
}
.rewards h2.ttl_octagon .ttl_octagon_inclu:hover {
  padding: 0 0 0 4rem;
  display: inline-block;
  background-image: url(/upload/tenant_1/rmc_icon02.png);
  background-repeat: no-repeat;
  background-size: contain
}
/* -----------------------------------------------------------
	table
----------------------------------------------------------- */
.rmc_rewards {
  display: table;
  max-width: 1200px;
  margin: 0 auto 1em;
}
.rmc_row {
  border-bottom: 1px solid rgba(207, 207, 207, 1.00);
}
.rmc_row:first-child {
  border-top: 1px solid rgba(207, 207, 207, 1.00);
}
.rmc_row ul {
  display: table;
  width: 100%;
  table-layout: fixed;
  padding: 0;
  margin: 0;
}
.rmc_row li {
  display: table-cell;
  width: 20%;
  text-align: center;
  list-style: none;
  padding: 15px 10px;
  vertical-align: middle;
}
.rmc_row li:not(:last-child) {
  border-right: 1px solid rgba(207, 207, 207, 1.00);
}
.rmc_rewards .rmc_row:first-child li {
  background: rgba(237, 234, 234, 0.69);
}
@media (max-width: 767px) {
  .row_title {
    font-size: 1.2em;
    font-weight: bold;
    text-align: center
  }
  .rmc_row li.spno {
    display: none;
  }
  .rmc_row li:not(:last-child) {
    border-right: none;
    position: relative
  }
  .rmc_row li:not(:last-child)::after {
    content: "";
    position: absolute;
    top: 30%;
    right: 0;
    width: 1px;
    height: 30%;
    background: #A3A3A3;
  }
}
/* -----------------------------------------------------------
	kain login
----------------------------------------------------------- */
.rmc_hotels .login {
  text-align: center;
  margin: 1rem auto 1rem
}
.rmc_hotels .login a {
  position: relative;
  display: flex;
  justify-content: space-around;
  align-items: center;
  margin: 0 auto;
  max-width: 250px;
  padding: 10px 25px;
  transition: 0.3s ease-in-out;
  font-weight: 600
}
.rmc_hotels .login a:before, .rmc_hotels .login a:after {
  content: '';
  width: 18px;
  height: 18px;
  border-color: rgba(251, 179, 76, 1.00);
  box-sizing: border-box;
  border-style: solid;
  display: block;
  position: absolute;
  transition: all 0.3s ease-in-out
}
.rmc_hotels .login a:before {
  top: -6px;
  left: -6px;
  border-width: 2px 0 0 2px;
  z-index: 5
}
.rmc_hotels .login a:after {
  bottom: -6px;
  right: -6px;
  border-width: 0 2px 2px 0
}
.rmc_hotels .login a:hover:before, .rmc_hotels .login a:hover:after {
  width: calc(100% + 12px);
  height: calc(100% + 12px);
  border-color: rgba(251, 179, 76, 1.00)
}
.rmc_hotels .login a:hover {
  color: rgba(255, 255, 255, 1.00);
  background-color: rgba(251, 179, 76, 1.00);
  border-color: rgba(251, 179, 76, 1.00)
}
.rmc_hotels .kain a {
  position: relative;
  display: flex;
  justify-content: space-around;
  align-items: center;
  margin: 0 auto;
  max-width: 250px;
  padding: 10px 25px;
  transition: 0.3s ease-in-out;
  font-weight: 600
}
.rmc_hotels .kain a:before, .rmc_hotels .kain a:after {
  content: '';
  width: 18px;
  height: 18px;
  border-color: rgba(38, 196, 221, 1.00);
  box-sizing: border-box;
  border-style: solid;
  display: block;
  position: absolute;
  transition: all 0.3s ease-in-out
}
.rmc_hotels .kain a:before {
  top: -6px;
  left: -6px;
  border-width: 2px 0 0 2px;
  z-index: 5
}
.rmc_hotels .kain a:after {
  bottom: -6px;
  right: -6px;
  border-width: 0 2px 2px 0
}
.rmc_hotels .kain a:hover:before, .rmc_hotels .kain a:hover:after {
  width: calc(100% + 12px);
  height: calc(100% + 12px);
  border-color: rgba(38, 196, 221, 1.00)
}
.rmc_hotels .kain a:hover {
  color: rgba(255, 255, 255, 1.00);
  background-color: rgba(38, 196, 221, 1.00);
  border-color: rgba(38, 196, 221, 1.00)
}
/* -----------------------------------------------------------
	agreement
----------------------------------------------------------- */
.rmc_ag ul li {
  list-style: none;
}
/* -----------------------------------------------------------
	アクセス
----------------------------------------------------------- */
.access_info {
  margin: auto;
}
.rmc_hotels {
  margin: 0 auto 2rem
}
@media (max-width: 766px) {
  .rmc_hotels {
    margin: 0 auto 4rem
  }
}
/* -----------------------------------------------------------
	hotel
----------------------------------------------------------- */
.rmc_mb {
  margin: 0 0 80px
}
.rmc {
  padding: 40px 0;
  box-sizing: border-box
}
#rmc h2 {
  text-align: center;
  font-size: 2.5rem;
  color: rgb(14, 16, 127)
}
.rmc_rank {
  display: flex;
  align-items: baseline;
  justify-content: center
}
.rmc_rankimg {
  margin: 0
}
.rmc_rank ul {
  width: 85%
}
.rmc_rankimg .rankimg {
  width: 100px
}
.rmc_exp {
  margin: 0 auto;
  width: 80%;
  font-size: 1.25rem
}
ul.rmc_exp {
  display: flex;
  display: -webkit-flex;
  justify-content: center;
  width: 90%;
  margin: 0 auto 20px
}
ul.rmc_exp li {
  width: 20%;
  margin: 0 1em;
  padding: 5px;
  background-color: rgb(201 173 23);
  color: rgba(255, 255, 255, 1.00);
  text-align: center;
  list-style: none
}
.rmc_astro {
  width: 80%;
  font-size: 0.9rem;
  margin: 0 auto;
  letter-spacing: 1px
}
.rmc_rankupimg {
  width: 80%;
  text-align: center;
  margin: 0 auto
}
.rmc_flow {
  width: 70%;
  margin: 0 auto;
  padding: 0;
  max-width: 800px
}
.rmc_flow li:not(:last-child) {
  position: relative
}
.rmc_flow li:not(:last-child)::before, .rmc_flow li:not(:last-child)::after {
  content: "";
  border: solid transparent;
  position: absolute;
  top: 100%;
  left: 15%;
  -webkit-transform: translateX(-50%);
  transform: translateX(-50%)
}
.rmc_flow li:not(:last-child)::before {
  border-width: 22px;
  border-top-color: rgb(14, 16, 127)
}
.rmc_flow li:not(:last-child)::after {
  border-width: 18px
}
.rmc_flow li {
  margin: 0;
  padding: 30px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  border: 3px solid rgb(14, 16, 127);
  border-bottom: 0px
}
.rmc_flow li:last-child {
  border-bottom: 3px solid rgb(14, 16, 127)
}
.rmc_flow li .flow_ttl {
  font-size: 20px;
  font-weight: 600;
  color: rgb(107, 144, 219);
  -ms-flex-preferred-size: 20%;
  flex-basis: 20%;
  margin-right: 1vw;
  text-align: center
}
#member_btn {
  position: fixed;
  bottom: 1em;
  right: 1em;
  z-index: 100
}
.btn, a.btn {
  font-weight: 700;
  line-height: 1.5;
  display: inline-block;
  padding: 1rem 4rem;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  -webkit-transition: all 0.3s;
  transition: all 0.3s;
  text-align: center;
  text-decoration: none;
  letter-spacing: 0.1em;
  color: rgba(255, 255, 255, 1.00);
  border-radius: 0.5rem
}
a.btn_fix_radius {
  border-radius: 50%;
  line-height: 80px;
  width: 80px;
  height: 80px;
  padding: 5px;
  background: rgba(0, 29, 195, 1.00);
  -webkit-box-shadow: 0 5px 0 rgb(14, 16, 127);
  box-shadow: 0 5px 0 rgb(14, 16, 127)
}
a.btn_fix_radius:hover {
  -webkit-transform: translate(0, 3px);
  transform: translate(0, 3px);
  -webkit-box-shadow: 0 2px 0 rgb(14, 16, 127);
  box-shadow: 0 2px 0 rgb(14, 16, 127)
}
.delay_flow {
  animation-name: delay_flowAnime;
  animation-duration: 0.5s;
  animation-fill-mode: forwards;
  opacity: 0
}
#login {
  margin: 2em auto;
  width: 90%;
  font-size: 1.25rem
}
.login_coupon {
  list-style: none;
  display: flex;
  justify-content: center;
  margin: 0 0 2em
}
.login_coupon li {
  width: 30%;
  padding: 10px;
  background-color: rgb(201 173 23);
  margin: 0 0.5em;
  text-align: center;
  color: rgba(255, 255, 255, 1.00)
}
#login .login_ps {
  display: block;
  width: 50%;
  margin: 0 auto;
  border-bottom: 5px solid rgb(14, 16, 127);
  border-radius: 100vh;
  background: rgb(14 16 127 / 88%)
}
#login .login_ps:hover {
  margin-top: 3px;
  border-bottom: 2px solid rgb(14, 16, 127)
}
.btn_m {
  margin: 0 auto 2em
}
@media (max-width: 599px) {
  #rmc h2 {
    font-size: 2rem;
    width: 95%;
    margin: 0 auto 1em
  }
  .rmc_exp {
    width: 95%;
    display: block
  }
  ul {
    padding: 0
  }
  ul.rmc_exp {
    display: block;
    width: 100%;
    padding: 0
  }
  ul.rmc_exp li {
    width: 90%;
    margin: 0 auto 1em
  }
  .rmc_flow {
    width: 95%
  }
  .rmc_flow li {
    padding: 15px 10px 10px
  }
  .rmc_flow li .flow_ttl {
    font-size: 1.2rem
  }
  .rmc_rank_cardsp {
    width: 50%
  }
  .rmc_rankupimg {
    width: 95%
  }
  #member_btn {
    bottom: 14em
  }
  #login .login_ps {
    width: 90%;
    padding: 1em
  }
  .login_coupon {
    display: block
  }
  .login_coupon li {
    width: 90%;
    margin: 0 auto 1em
  }
}
/* -----------------------------------------------------------
	FAQ
----------------------------------------------------------- */
#qa h2 {
  font-size: 2.8rem
}
#qa h2 span {
  display: block
}
.qa_cardcontents {
  display: flex;
  flex-wrap: wrap;
  align-items: stretch;
  justify-content: center;
  list-style: none
}
.qa_cardcontents::after {
  content: "";
  display: block;
  width: 30%;
  margin: 0 auto 2rem
}
.qa_cardcontents .qa_card {
  box-sizing: border-box;
  width: 30%;
  margin: 0 auto 2rem;
  padding: 1.5rem;
  border-radius: 3%;
  border: 1px solid rgba(76, 118, 192, 0.81);
  box-shadow: 0 5px 15px rgb(0 0 0 / 8%)
}
.qa_card .qaq::first-letter {
  font-size: 2rem;
  color: rgba(212, 54, 83, 0.95)
}
.qa_card .qaa::first-letter {
  font-size: 2rem;
  color: rgba(53, 81, 212, 0.95)
}
@media (max-width: 766px) {
  #qa h2 {
    font-size: 1.2rem
  }
  .qa_cardcontents .qa_card {
    width: 90%;
  }
}
/* -----------------------------------------------------------
	クーポンページ
----------------------------------------------------------- */
.coupon_mv {
  display: block
}
.coupon_mv_sp {
  display: none
}
.rmc-coupon img {
  width: 100%
}
.rmc_logo {
  text-align: center;
  position: relative;
  z-index: 1
}
.rmc_logo img {
  width: 30%;
  margin-bottom: 50px;
  min-width: 350px
}
.rmc_coupon_h {
  font-size: 55px;
  text-align: center;
  font-weight: bold;
  text-shadow: 1px 1px #7e7e7e;
  line-height: 1;
  margin: 0 0 80px
}
.rmc_coupon_h_ll {
  font-size: 300%
}
.rmc_coupon_h_l {
  font-size: 200%
}
.rmc_coupon_h_m {
  font-size: 150%
}
.rmc_deco_txt {
  font-size: 10vw;
  position: absolute;
  font-family: 'Whisper', cursive;
  top: 0;
  right: 2%;
  transform: rotate(-22deg);
  border-bottom: 1px solid;
  line-height: 0.8;
  color: #c2c2c2;
  z-index: 10
}
@media (max-width: 766px) {
  .rmc_coupon_h {
    font-size: 30px
  }
  .coupon_mv {
    display: none
  }
  .coupon_mv_sp {
    display: block
  }
}
/* クーポンリスト */
#rmc_coupontop {
  padding: 2rem 0 1rem;
  background: #F7F5D1;
  font-feature-settings: "palt";
  -webkit-font-feature-settings: "palt";
  position: relative
}
#coupon_list {
  padding: 100px 0;
  background: #e9e4da;
  font-feature-settings: "palt";
  -webkit-font-feature-settings: "palt";
  position: relative
}
#coupon_list .rmc_coupon_h {
  color: #2d7091
}
#official_coupon {
  padding: 100px 0;
  background: #F7F5D1;
  font-feature-settings: "palt";
  -webkit-font-feature-settings: "palt";
  position: relative
}
#official_coupon .rmc_coupon_h {
  color: #03930B
}
.rmc_coupon h3 {
  text-align: center;
  font-size: 2.5rem;
  margin: 0 auto 2rem;
  text-shadow: -1px -1px rgba(247, 222, 121, 0.5), 1px 1px 3px rgba(0, 0, 0, 0.5)
}
.rmc_coupon_block {
  display: flex;
  justify-content: space-around;
  flex-wrap: wrap;
  box-sizing: border-box;
  max-width: 1600px;
  margin: 50px auto 0
}
.rmc_coupon_box {
  width: 30%;
  margin-bottom: 30px;
  border-radius: 10px;
  box-shadow: 2px 2px 4px #000;
  overflow: hidden;
  background: #fff;
  position: relative
}
.rmc_coupon_box2 {
  width: 50%;
  margin: 0 auto 3rem;
  border-radius: 10px;
  box-shadow: 2px 2px 4px #000;
  overflow: hidden;
  background: #fff;
  position: relative
}
.coupon_img {
  padding: 5px
}
.coupon_img img {
  width: 100%
}
.coupon_txt {
  padding: 5px 20px 10px;
  background: #fff
}
.coupon_txt p {
  margin: 0;
  line-height: 1.7;
  font-size: 20px;
  font-weight: bold
}
.mail_magazine {
  font-size: 120%;
  border-bottom: 1px solid
}
.ex_coupon {
  position: absolute;
  height: 100%;
  width: 100%;
  top: 0;
  right: 0;
  background: rgb(0 0 0 / 50%);
  text-align: center
}
.ex_coupon p {
  color: #fff;
  font-size: 23px;
  font-weight: bold;
  margin-top: 150px
}
.ex_coupon_img img {
  -webkit-filter: grayscale(100%);
  -moz-filter: grayscale(100%);
  -ms-filter: grayscale(100%);
  -o-filter: grayscale(100%);
  filter: grayscale(100%)
}
.member_link {
  text-align: center
}
.member_link p {
  font-size: 23px;
  margin: 30px 0 20px;
  font-weight: bold
}
.member_link a {
  background: #3a4861;
  margin: 0 auto;
  display: inline-block;
  padding: 15px;
  font-size: 21px;
  color: #fff;
  border-radius: 5px;
  box-shadow: 2px 2px 4px #000
}
.member_link a:hover {
  opacity: 0.7;
  text-decoration: none;
  color: #fff;
  box-shadow: none
}
@media (max-width: 900px) {
  .rmc_coupon_box {
    width: 45%
  }
  .rmc_coupon_box2 {
    width: 75%
  }
}
@media (max-width: 766px) {
  #rmc_coupontop {
    padding: 4rem 0 1rem
  }
  .rmc_coupon_box, .rmc_coupon_box2 {
    width: 90%
  }
  .member_link p {
    font-size: 18px
  }
  .rmc_coupon h3 {
    font-size: 1.5rem
  }
}
/* -----------------------------------------------------------
	ホテルリスト
----------------------------------------------------------- */
#hotel_list {
  background: #3A4861;
  padding: 100px 20px;
  font-feature-settings: "palt";
  -webkit-font-feature-settings: "palt";
  position: relative;
}
#hotel_list .rmc_coupon_h {
  color: #fff
}
.rmc_hotel_list_box {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
  background: #fff;
  border-radius: 1px;
  overflow: hidden;
  box-shadow: 10px 10px #ddd;
  max-width: 1600px;
  margin: 0 auto 50px
}
.hotel_list_img {
  width: 25%
}
.hotel_list_img img {
  width: 100%;
  height: 100%;
  object-fit: cover
}
.hotel_list_txt {
  width: 75%;
  padding: 15px;
  box-sizing: border-box;
  position: relative
}
.hotel_list_deco {
  font-size: 85px;
  position: absolute;
  font-family: 'Whisper', cursive;
  top: 10%;
  right: 1%;
  transform: rotate(-5deg);
  line-height: 0.8;
  color: #f1f1f1
}
.hotel_list_btn {
  text-align: center;
  width: 100%;
  padding: 20px 0;
  z-index: 1;
  position: relative
}
.hotel_list_name {
  font-size: 25px;
  text-align: center;
  font-weight: bold;
  color: #3a4861;
  margin: 20px 0 25px;
  position: relative;
  z-index: 1
}
.hotel_list_p {
  font-size: 18px;
  width: 85%;
  margin: 0 auto;
  font-weight: 600;
  z-index: 1;
  position: relative
}
.hotel_list_btn a {
  display: inline-block;
  background: #fff;
  padding: 3px 0;
  border-radius: 2px;
  color: #3a4861;
  border: 1px solid;
  font-weight: bold;
  font-size: 18px;
  width: 25%;
  margin: 0 20px;
  box-shadow: 3px 3px 0 #333333
}
.hotel_list_btn a:nth-child(2) {
  background: #3a4861;
  color: #fff
}
.hotel_list_btn a:hover {
  text-decoration: none;
  opacity: 0.7
}
@media (max-width: 900px) {
  .hotel_list_img {
    width: 100%
  }
  .hotel_list_txt {
    width: 100%
  }
}
@media (max-width: 766px) {
  .hotel_list_btn a {
    width: 70%;
    margin: 0 auto 1.5rem
  }
  .hotel_list_btn a span {
    margin: auto 0;
    display: inline-block;
    padding: 10px;
    box-sizing: border-box
  }
}
/* 特典 */
#rmc_special {
  padding: 100px 0;
  background: #cadde5;
  position: relative
}
#rmc_special .rmc_coupon_h {
  color: #fff
}
.rmc_special_block {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  margin: 30px 0;
  font-feature-settings: "palt";
  -webkit-font-feature-settings: "palt"
}
.rmc_special_box {
  width: 20%;
  padding: 0 10px 15px;
  border: 1px solid #000;
  margin: 0 10px;
  box-shadow: 1px 1px 6px;
  background: #fff;
  border-radius: 5px
}
.lottie_box {
  width: 70%;
  margin: 0 auto
}
.rmc_special_box h3 {
  font-size: 35px;
  text-align: center;
  margin: 0
}
.rmc_special_box p {
  font-size: 20px;
  text-align: center;
  margin: 0
}
.rmc_bnr {
  text-align: center;
  margin-top: 50px
}
.rmc_bnr a {
  display: inline-block
}
.rmc_bnr_pc {
  display: block
}
.rmc_bnr_sp {
  display: none
}
@media (max-width: 1700px) {
  .rmc_special_box {
    width: 25%;
    font-size: 18px
  }
}
@media (max-width: 1200px) {
  .rmc_special_box {
    width: 40%;
    margin-bottom: 20px
  }
}
@media (max-width: 766px) {
  .rmc_special_box {
    width: 85%
  }
  .lottie_box {
    width: 60%
  }
  .rmc_bnr_pc {
    display: none
  }
  .rmc_bnr_sp {
    display: block
  }
}
/* -----------------------------------------------------------
	roomsbox
----------------------------------------------------------- */
h2.ttl {
  font-family: 'Rampart One', cursive;
  font-size: 2.5rem
}
.roomsbox {
  display: flex;
  position: relative;
  min-height: 800px;
  height: 100vh
}
.roomsbox > * {
  width: 50%
}
.roomsbox:last-child {
  margin: 0 0 5rem;
  padding: 0 0 5rem
}
.imgbox {
  position: relative
}
.imgrooms {
  position: absolute;
  top: 10%;
  left: 0;
  width: 100%;
  height: 100%
}
.imgrooms ul {
  padding-left: 0;
  position: relative;
  height: 100%
}
.imgrooms li:first-child {
  position: absolute;
  top: 0;
  left: 0;
}
.imgrooms li:nth-child(2) {
  position: absolute;
  top: 25%;
  left: 25%;
}
.imgrooms li:last-child {
  position: absolute;
  top: 50%;
  left: 50%;
}
.imgrooms li.mar0a {
  margin: 0 auto
}
.roomstxt {
  display: flex;
  text-align: left;
  justify-content: center;
  align-content: center
}
.roomstxt > * {
  width: 48%;
  padding: 1rem 0 1rem 1.5rem
}
.roomstxt > div:nth-child(2) {
  background-color: rgb(231 205 162);
  border-radius: 12% 0 0 12%
}
@media (max-width: 766px) {
  .roomsbox {
    display: block;
    height: 100vh
  }
  .roomsbox > * {
    width: 100%
  }
  .imgbox {
    height: 60%
  }
  .imgrooms {
    position: relative;
    top: 0;
    left: 0;
    bottom: 0
  }
}
