.room1-item-header h2 { font-size:1.2em; margin: 0; padding: 10px 0; position: relative;}
.room1-item-title h4 { font-size: 0.95em; line-height: 35px; padding:50px 0;}

.r_kamakura_room1-container {
  position: relative;
  width: 100%;
  overflow: hidden;
  margin-bottom: 15px;
}

.responsive-image {
  display: block;
  width: 100%;
  height: auto;
  object-fit: cover;
}

@media (min-width: 600px) { /* 600pxをブレークポイントとして設定していますが、必要に応じて変更できます */
  .r_kamakura_room1-container {
    padding-top: 40%; /* 高さを画像の幅の40%に設定 */
  }
  .responsive-image {
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
  }
}
.room1-item-header{
  position: relative;
  text-align: center;
  margin: 0;
  padding:40px 0 60px 0;
  width: 100%;
}

.room1-item-header h2 {
    position: relative;
    margin: 0;
    padding: 10px 0 10px 0;
}

.room1-item-header h2::before,
.room1-item-header h2::after {
    content: '';
    position: absolute; /* 絶対位置を指定 */
    height: 1px;
    width: 100px; /* 線の長さを固定 */
    background-color: #1a1a1a;
    top: 50%;
    transform: translateY(-50%);
}

.room1-item-header h2::before {
    left: calc(50% - 150px - 100px); /* センターから左側に150px + 線の長さ分移動 */
}

.room1-item-header h2::after {
    right: calc(50% - 150px - 100px); /* センターから右側に150px + 線の長さ分移動 */
}

.room1-item-title {
    text-align: center;
}

.room1-item-title-text {
    margin: 0;
    padding: 0;
}


@media (max-width: 579px) {
  .room1-item-title { padding: 0 30px; margin-bottom: 50px;}
  .room1-item-title h4 { font-size: 0.85em;}
}

@media (max-width: 479px) {
  .room1-item-title { padding: 0 10px;}
}
