/* CSS Document */

/* 共通
------------------------------------------------------------*/
/* --- kv ---------*/
.l-roomCommon.l-roomPlus .l-wrap_kv {
  background-image: url(/images/room/plus/kv.jpg);
}
.l-roomCommon.l-roomPlus .l-wrap_kv_mock-image {
  position: absolute;
  right: 0;
  top: 50px;
}

/* --- こんなことでお困りではありませんか ---------*/
.l-roomCommon.l-roomPlus .roomPlus_block03 .common_h2 {
  color: #0f37ff;
}
.l-roomCommon.l-roomPlus .roomPlus_block03 .common_h2:before,
.l-roomCommon.l-roomPlus .roomPlus_block03 .common_h2:after {
  background-color: #0f37ff;
}
.l-roomCommon.l-roomPlus .roomPlus_block03 .l-trouble_upper {
  height: 444px;
}
.l-roomCommon.l-roomPlus .roomPlus_block03 .l-trouble_upper::after {
  content: '';
  display: block;
  width: 28px;
  height: 28px;
  background: url(/images/room/plus/arrow.png) 0% / contain no-repeat;
  position: absolute;
  bottom: -16px;
  left: 50%;
  transform: translateX(-50%);
}
.l-roomCommon.l-roomPlus .roomPlus_block03 .l-trouble_upper h4 span {
  border-top: 2px solid #0f37ff;
  border-bottom: 2px solid #0f37ff;
  padding: 0 4px;
}
.l-roomCommon.l-roomPlus .roomPlus_block03 .l-trouble_lower h4 {
  background-color: #23252a;
  border-top-left-radius: 10px;
  border-top-right-radius: 10px;
  padding: 12px 0;
}
.l-roomCommon.l-roomPlus .roomPlus_block03 .l-trouble_lower p {
  padding-top: 24px;
  padding-bottom: 28px;
  height: 196px;
}

/* --- 料金案内 ---------*/
.l-roomCommon.l-roomPlus .roomPlus_block06 table th {
  width: 50%;
}
.l-roomCommon.l-roomPlus .roomPlus_block06 .l-fee_illust {
  position: absolute;
  right: 0;
  bottom: -154px;
}

/* --- 資料請求フォーム ---------*/
.l-roomCommon.l-roomPlus .roomPlus_block08 {
  border-top: 1px solid #ccc;
}

@media screen and (min-width: 768px) {
  /* --- 機能紹介 ---------*/
  .l-roomCommon.l-roomPlus .roomPlus_block04 .mock-pc {
    margin-left: -40px;
  }
  /* --- 資料請求フォーム ---------*/
  .l-roomCommon.l-roomPlus .roomPlus_block08 {
    width: 1120px;
    margin: 100px auto;
  }
  .l-roomCommon.l-roomPlus .roomPlus_block08 .common_inner2 {
    width: 585px;
  }
}

@media screen and (max-width: 767.98px) {
  .inner .sp_header_btn_room.roomplus {
    width: 11.579vw;
  }

  /* --- kv ---------*/
  .l-roomCommon.l-roomPlus .l-wrap_kv {
    background-image: url(/images/room/plus/kv_sp.jpg);
  }
  .l-roomCommon.l-roomPlus .l-wrap_kv_mock-image {
    width: 76vw;
    left: 50%;
    top: -56vw;
    transform: translateX(-50%);
  }

  /* --- 概要 ---------*/
  .l-roomCommon.l-roomPlus .roomPlus_block01 p.text-lg-end {
    text-align: right;
  }
  .l-roomCommon.l-roomPlus .roomPlus_block01 img.sp {
    max-width: 335px;
  }

  /* --- 利用イメージ ---------*/
  .l-roomCommon.l-roomPlus .roomPlus_block02 img.sp {
    width: 80%;
    max-width: 335px;
  }

  /* --- こんなことでお困りではありませんか ---------*/
  .l-roomCommon.l-roomPlus .roomPlus_block03 .l-trouble_upper {
    height: auto;
  }
  .l-roomCommon.l-roomPlus .roomPlus_block03 .l-trouble_upper img {
    display: block;
    max-width: 335px;
    margin: 0 auto;
  }
  .l-roomCommon.l-roomPlus .roomPlus_block03 .l-trouble_lower p {
    height: auto;
  }

  /* --- 機能紹介 ---------*/
  .l-roomCommon.l-roomPlus .roomPlus_block04 .mock-mobile {
    width: 45%;
  }

  /* --- 資料請求フォーム ---------*/
  .l-roomCommon.l-roomPlus .roomPlus_block08 {
    width: 90%;
    margin: 0 auto;
    padding: 3.5rem 0.8rem;
  }
}
