@charset "UTF-8";
/* CSS Document */
#wrap img {
  vertical-align: bottom;
}
ul.movieContainer {
  list-style: none;
  margin: 20px auto;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
ul.movieContainer li {
  width: 100%;
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
}
.compo {
  width: 980px;
  margin: 100px auto 100px;
  padding: 5em 1em 0em;
  position: relative;
  box-sizing: border-box;
  border: 1px solid #ccc;
  border-radius: 15px;
}
div#other {
  margin-top: 100px;
  padding-top: 4em;
}
div#movie::after {
  position: absolute;
  top: -58px;
  left: 50%;
  display: block;
  content: "";
  width: 431px;
  height: 116px;
  transform: translateX(-50%);
  background-image: url("../img/head_movie.png");
}
div#other::after {
  position: absolute;
  top: -64px;
  left: 50%;
  display: block;
  content: "";
  width: 431px;
  aspect-ratio: 522/125;
  background-image: url("../img/teamKawasaki.png");
  transform: translateX(-50%);
  background-size: contain;
  background-repeat: no-repeat;
}
div#treasure::after {
  position: absolute;
  top: -64px;
  left: 50%;
  display: block;
  content: "";
  width: 431px;
  transform: translateX(-50%);
  aspect-ratio: 444/122;
  background-image: url("../img/head_treasure.png");
  background-size: contain;
  background-repeat: no-repeat;
}
.flexible {
  list-style: none;
  display: flex;
  flex-direction: row;
  justify-content: space-around;
  align-items: center;
  margin-bottom: 40px;
}
.senmuComment {
  width: 100%;
  margin: 10px auto;
  display: flex;
  justify-content: flex-start;
  gap: 10px;
}
.fukidashi {
  position: relative;
  box-sizing: border-box;
  width: calc(100% - 60px);
  min-height: 63px;
  display: flex;
  justify-content: flex-start;
  font-size: 1.2em;
  line-height: 1.4em;
  font-weight: bold;
  text-align: left;
  padding: 0.5em 1.5em;
  background-color: #FFE995;
  border-radius: 15px;
}
.fukidashi::before {
  position: absolute;
  content: "　";
  box-sizing: border-box;
  border: 8px solid transparent;
  border-right-color: #FFE995;
  width: 15px;
  height: 15px;
  left: -15px;
  top: 50%;
  transform: translateY(-50%);
  transform-origin: center;
  z-index: 5;
}
.fukidashi_r {
  position: relative;
  box-sizing: border-box;
  width: 560px;
  margin: 25px auto;
  min-height: 63px;
  display: flex;
  justify-content: center;
  font-size: 1.2em;
  line-height: 1.4em;
  padding: 0.5em 1.5em;
  background-color: #C3FFFA;
  border-radius: 15px;
}
.shokai {
  position: relative;
  padding: 2em 15px;
  background: #FFE8DC;
  border-radius: 20px;
  margin: 20px auto 5px;
  display: flex;
  gap: 20px;
}
.fukidashi_r::before {
  content: " ";
  position: absolute;
  width: 80px;
  height: 100px;
  bottom: 0;
  left: -60px;
  background-size: contain;
  background-image: url("../img/plaza_A/icon_senmu_l.png");
  background-repeat: no-repeat;
}
.fukidashi_r::after {
  content: " ";
  position: absolute;
  width: 80px;
  height: 100px;
  bottom: 0;
  right: -80px;
  background-size: contain;
  background-image: url("../img/plaza_A/icon_boss.png");
  background-repeat: no-repeat;
}
#treasure .cap-wrap {
  width: 460px;
  height: 90px;
  display: flex;
  flex-direction: center;
  align-items: center;
  box-sizing: border-box;
  vertical-align: middle;
  margin: 10px auto 0px;
  padding: 0em 0.5em;
  font-size: 1.2em;
  line-height: 1.4em;
  font-weight: bold;
  border: 3px double #5F5741;
  background: #F1EEEE;
  z-index: 9999;
}
/* --- スライドショーコンテナ --- */
.pictContainer {
  list-style: none;
  padding: 0;
  margin: 20px auto;
  position: relative;
  width: 100%;
  height: 540px;
}
/* --- 各スライド（li） --- */
.pictContainer li {
  position: absolute;
  inset: 0;
  opacity: 0;
  transition: opacity 0s;
  clip-path: circle(100% at 50% 50%); /* 初期は全体を表示可能な大きさ */
}
/* 表示されているスライド */
.pictContainer li.show {
  opacity: 1;
}
/* アイリスイン開始前の「小さな円」状態 */
.pictContainer li.iris-start {
  clip-path: circle(0% at 50% 50%);
}
/* アイリスインのアニメ適用 */
.pictContainer li.iris {
  animation: irisIn 0.8s ease-out forwards;
}
/* --- アイリスイン（円が広がる） --- */
@keyframes irisIn {
  0% {
    clip-path: circle(0% at 50% 50%);
  }
  100% {
    clip-path: circle(100% at 50% 50%);
  }
}
#plazaview .cap-wrap {
  width: 660px;
  height: 96px;
  margin: 10px auto;
  display: flex;
  justify-content: space-between;
  align-items: center;
  gap: 10px;
}
#plazaview .cap-wrap .fukidashi {
  margin-right: 10px;
  width: calc(100% - 80px);
  text-align: left !important;
}
#garreryView {
  width: 100%;
  margin: 10px auto;
  background-image: url("../img/background_museum.png");
  background-size: 100% 100%;
  aspect-ratio: 980/753;
  box-sizing: border-box;
  border: #2D2723 1px solid;
  position: relative;
}
#wrap {}
.slider-wrap {
  overflow: hidden;
  position: relative;
  margin: 40px auto;
}
.slider {
  display: flex;
  width: 9999px;
  transition: transform 0.6s ease;
}
.slide {
  flex-shrink: 0;
}
.slide img {
  width: 100%;
  display: block;
}
.caption-area {
  margin-top: 10px;
  font-size: 1.1em;
  text-align: center;
}
.caption-area.guidetext {
  font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
  margin: 0px auto !important;
  font-size: 1.2em;
  font-weight: bold;
  line-height: 1.4em;
  display: block;
  text-align: center !important;
}
.controls {
  text-align: center;
  margin-top: 10px;
}
.controls button {
  margin: 0 5px;
  padding: 5px 10px;
}
.dots {
  text-align: center;
  margin-top: 5px;
}
.dots span {
  display: inline-block;
  width: 12px;
  height: 12px;
  margin: 0 4px;
  background: #dedede;
  border-radius: 50%;
  cursor: pointer;
}
.dots .active {
  background: #333;
}
#innerSlider {
  position: absolute;
  top: 70px;
  left: 50%;
  transform: translateX(-50%);
  z-index: 333;
}
.js-modal {
  position: fixed;
  inset: 0;
  display: none;
  z-index: 9999;
}
.js-modal.active {
  display: block;
}
.js-modal-bg {
  position: absolute;
  inset: 0;
  background: rgba(0, 0, 0, .7);
}
.js-modal-img {
  position: absolute;
  inset: 0;
  margin: auto;
  max-width: 90%;
  max-height: 90%;
}
#opening {
	margin:40px auto;
	
	p{
		font-family: YuMincho, "Yu Mincho", "Hiragino Mincho ProN", "serif";
		font-weight: bolder;
		font-size: 14pt;
		line-height:20pt;
		vertical-align: middle;
		color:#000;
	}
}