@charset "UTF-8";
.miuru-card-area .box-title {
  background-color: #1B783C;
}

.pendant-img {
  width: 80%;
  position: relative;
  left: 2%;
}

.miuru-message-container {
  width: 55%;
  text-align: center;
}

.miuru-message-width {
  max-width: 90%;
  position: relative;
  right: -10%;
}

.ar-camera-area {
  text-align: center;
  margin: 20px 0;
}

.ar-camera-link {
  background-color: #f0AC30;
  color: black;
  font-size: 20px;
  font-weight: 500;
  border-radius: 30px;
  padding: 10px 25px;
}

.single-text-area {
  text-align: center;
}

.home-other-area {
  text-align: center;
  margin: 20px 0;
}

.get-num-box {
  background-color: #f0AC30;
  color: black;
  font-size: 20px;
  font-weight: 500;
  border-radius: 15px;
  padding: 10px 25px;
}

.home-map {
  margin: 40px 0;
}

.home-map .ar-camera-link {
  padding: 10px 70px;
}

.home-top-area {
  text-align: center;
  font-weight: bold;
}

.miuru-room {
  position: fixed; /* 画面中央に固定表示 */
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 1200; /* オーバーレイより手前に表示 */
  width: 90%;
  max-width: 600px;
}

/* モーダルのオーバーレイ */
.modal-overlay {
  display: none;
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  background: rgba(0, 0, 0, 0.5);
  z-index: 1000; /* 1000 以上あれば大抵、他の要素より前面に出る */
}

/* 閉じるボタン */
.miuru-room .modal-close {
  position: absolute;
  top: 8px;
  right: 8px;
  background: transparent;
  border: none;
  font-size: 1.2em;
  cursor: pointer;
  color: #333;
}

.miuru-story-area {
  text-align: center;
}

.miuru-message-container-room {
  max-width: 100%;
  /*text-align: center;*/
  margin-top: 8px;
}

.miuru-message-width-room {
  max-width: 100%;
  display: flex;
}

.miuru-message-area-room {
  position: relative;
  display: inline-block;
  background: #fff;
  border: 2px solid #c1c1c1;
  border-radius: 15px;
  padding: 15px 10px;
  font-size: 1rem;
  color: black;
  display: table-cell;
  vertical-align: middle;
  width: 85%;
}
@media (max-width: 768px) {
  .miuru-message-area-room {
    width: 100%;
  }
}

/* しっぽの枠線（上向き） */
.miuru-message-area-room::before {
  content: "";
  position: absolute;
  top: -11px; /* 本体の上にずらす */
  right: 43px;
  border-width: 0 10px 11px 10px; /* 上辺0、下辺を三角形に */
  border-style: solid;
  border-color: transparent transparent #c1c1c1 transparent;
}

/* しっぽの背景（上向き） */
.miuru-message-area-room::after {
  content: "";
  position: absolute;
  top: -10px; /* ::before より 1px 下に */
  right: 45px;
  border-width: 0 9px 10px 9px;
  border-style: solid;
  border-color: transparent transparent #fff transparent;
}

.story-text-area {
  background-color: #F7F8D2;
  padding: 7px 5%;
}

.story-text-area p {
  margin: auto;
  font-size: 13px;
  font-weight: 400;
  line-height: 1.8;
}

/* ベース文字＋ルビを一塊で扱う */
[data-ruby] {
  display: inline-block;
  position: relative;
  white-space: nowrap; /* 要素内で改行させない */
  vertical-align: baseline; /* ベース文字のベースラインを維持 */
}

/* ルビ部分 */
[data-ruby]::before {
  content: attr(data-ruby);
  position: absolute;
  top: 0; /* ベース文字の上端 */
  left: 50%; /* 要素の中央 */
  transform: translate(-50%, -40%); /* 横中央、縦に自身の高さ分だけ上へ */
  white-space: nowrap; /* ルビ文字も折り返さない */
  font-size: 0.5em; /* お好みで調整 */
  line-height: 1; /* きっちり１行分 */
  pointer-events: none;
}

.miuru-mori-slider {
  position: relative;
  overflow: hidden;
}

.mori-slides {
  white-space: nowrap;
  transition: transform 0.3s ease;
}

.mori-slide {
  display: none;
  text-align: center;
}

.mori-slide.active {
  display: block;
}

.mori-arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  background: rgba(0, 0, 0, 0.5);
  color: #fff;
  border: none;
  width: 30px;
  height: 30px;
  cursor: pointer;
}

.mori-arrow.prev {
  left: 10px;
}

.mori-arrow.next {
  right: 10px;
}

.mori-dots {
  text-align: center;
  margin-top: 8px;
}

.mori-dot {
  display: inline-block;
  width: 8px;
  height: 8px;
  background: #ccc;
  border-radius: 50%;
  margin: 0 4px;
  cursor: pointer;
}

.mori-dot.active {
  background: #333;
}

.mori-nav {
  text-align: center;
}

/* 矢印ナビの表示位置調整 */
.mori-nav .mori-arrow {
  position: static;
  transform: none;
  margin: 0px 8px;
  background: white;
  padding: 4px 3px;
  cursor: pointer;
  display: inline-block;
}

/* ついでに、スライダー内の .mori-arrow は不要なら隠す */
.miuru-mori-slider .mori-arrow {
  display: none;
}

/* テキストスライダー共通 */
.room-text-slider {
  position: relative;
  overflow: hidden;
}

.text-slide {
  display: none;
}

.text-slide p {
  margin: 0;
}

/* ナビボタン */
.room-nav {
  text-align: center;
  margin-top: 8px;
}

.room-nav img {
  width: 100%;
  max-width: 60px;
}

.room-arrow {
  display: inline-block;
  margin: 0 8px;
  background: #fff;
  color: #fff;
  border: none;
  border-radius: 4px;
  padding: 6px 12px;
  cursor: pointer;
  width: 15%;
}

.miuru-message-area-room {
  position: relative;
  display: inline-block;
  overflow: visible;
  background: #fff;
  border: 2px solid #c1c1c1;
  border-radius: 15px;
  padding: 15px 10px;
  font-size: 1rem;
  color: black;
  vertical-align: middle;
  width: 100%;
}

/* テキストスライダー周りの overflow を可視に */
.room-text-slider {
  position: relative;
  overflow: visible;
}

/* しっぽの枠線（上向き） */
.miuru-message-area-room::before {
  content: "";
  position: absolute;
  top: -11px;
  right: 43px;
  border-width: 0 10px 11px 10px;
  border-style: solid;
  border-color: transparent transparent #c1c1c1 transparent;
}

/* しっぽの背景（上向き） */
.miuru-message-area-room::after {
  content: "";
  position: absolute;
  top: -10px;
  right: 45px;
  border-width: 0 9px 10px 9px;
  border-style: solid;
  border-color: transparent transparent #fff transparent;
}

.coment-style {
  font-weight: bold;
  color: #1B783C;
}

.uniform-img {
  width: 12%;
  position: absolute;
  left: 6%;
  top: 18%;
}

.miuru-message-area p {
  font-size: 15px;
}

/* 初期ジャンプ時だけトランジションをオフにするためのクラス */
.miuru-photo-list .slides.no-transition {
  transition: none !important;
}/*# sourceMappingURL=home.css.map */