@charset "utf-8";
.no-gutter > [class*='col-'] {
	padding-right: 0;
	padding-left: 0;
}
.bg-lightgreen {
	background-color: #bbddf4;
}
.jumbotron {
	background-image: url('../img2/m2.jpg');
	background-repeat: no-repeat;
	background-size: cover;
	background-position: center;
	height: 700px;
}
.heading {
	border-left: 6px solid #4839eb;
	padding: 0 0 0 10px;
}
.breadcrumb-item + .breadcrumb-item::before {
	content: ">"
}
.footer-copyright {
	width: 100%;
	height: 60px;
	line-height: 60px;
	background-color: #f5f5f5;
}
.map iframe {
	width: 100%;
	height: 450px;
}
.lightbox ul{
	display: flex;
	position: relative;
	height: auto;
	padding: 20px 0;
	margin: 20px auto;
	list-style-type: none
	
}
img{
	max-width:100%;
	
}
.effect {
padding: 11px;
background-color: #FFFFFF;
box-shadow: 0 3px 18px -4px rgba(0, 0, 0, 0.8);
}
.pa{
	margin-bottom: 180px;
}
.pa::after {
	content:"";
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: url(../img/bk1.jpg) no-repeat center/cover;
	z-index: -1;
}
.pa2{
	margin-bottom:100px;
}
.pa2::after {
	content:"";
	position: fixed;
	left: 0;
	top: 0;
	width: 100%;
	height: 100%;
	background: url(../img/bk2.jpg) no-repeat center/cover;
	z-index: -1;
}
.timeline {
  width: 100%;
  max-width: 800px;
  margin: 0 auto;
}

.event {
  margin-bottom: 8px; /* 行間調整 */
  text-align: left;   /* 左寄せ */
  padding-left: 10px; /* 少し余白を入れて見やすく */
}

.year {
  font-weight: bold;
  margin-right: 10px;
  display: inline-block;
  width: 80px; /* 年の桁を揃える */
}

/* 全体の横並びスライダー構造 */
.slider {
  display: flex;
  overflow-x: auto;
  white-space: nowrap;
  gap: 0;
  padding: 10px 0;
}

.slider li {
  flex-shrink: 0;
  list-style: none;
}

/* 画像の基本設定 */
.slide-image {
  width: auto;
  max-width: 300px; /* PC時の最大サイズ */
  height: auto;
  display: block;
}

/* 隙間 */
.gap {
  width: 5px;
}

table {
            border-collapse: collapse;
            width: 100%;
        }
        table, th, td {
            border: 1px solid black;
        }
        th, td {
            padding: 8px;
            text-align: left;
        }

.price {
            font-weight: bold;
            color: #ff0000;
        }
        .heading {
            font-size: 1.8em;
            margin-bottom: 20px;
        }
        ul {
            list-style-type: disc;
            margin-left: 20px;
        }
        section {
            margin-bottom: 40px;
        }
        img {
            max-width: 100%;
            height: auto;
            margin-top: 20px;
        }
        hr.my-4 {
            border: 1px solid #ccc;
            margin: 30px 0;
        }	
        
  .parallax-section {
    background-image: url('background.jpg'); /* ←背景画像を差し替え */
    background-attachment: fixed;
    background-size: cover;
    background-position: center;
    padding: 0; /* 無駄な上下余白を削除 */
  }

  /* 各ブロックのスタイル */
  .photo-block {
    padding: 30px 20px;
    color: #0f0101;
  }

  /* 背景色の例（必要に応じて色変更） */
  .bg-intro { background: rgba(245, 216, 224, 0.4); }
  .bg-wasou { background: rgb(247, 240, 242, 0.2); }
  .bg-studio { background: rgb(247, 240, 242, 0.2); }
  .bg-stage { background: rgb(247, 240, 242, 0.2); }
  .bg-product { background: rgb(247, 240, 242, 0.2); }
  /* 項目間の透明エリア */
  .transparent-gap {
    height: 15px; /* 間隔の高さ */
    background: transparent;
  }

  h2, h4 {
    margin-bottom: 2px;
  }        


/* 大デバイス（デスクトップ, 992px 未満）
============================================== */
@media screen and (max-width: 991.98px) {
.footer-logo {
	width: 100%;
}
} /* END */

/* 中デバイス（タブレット, 768px 未満）
============================================== */
@media screen and (max-width: 767.98px) {
.gnav-item {
	display: block;
	width: 100%;
	border: none;
}
.gnav-item+ .gnav-item {
	border: none;
}
table th, table td {
	padding: .25rem !important;
}
table th:first-child {
	width: 25%;
}
} /* END */

/* 小デバイス（縦向きモバイル, 576px 以上 デスクトップ, 992px 未満）
============================================== */
@media screen and (min-width: 576px) and (max-width: 991.98px) {
 #sec2  {
     height: 500px;
 } 
} /* END */

/* 小デバイス（縦向きモバイル, 576px 以上）
============================================== */
@media screen and (min-width: 576px) {
 #sec2 .message {
    position: absolute;
     left: 0;
 } 
} /* END */

/* タブレット以下：画面幅 991px 以下 */
@media (max-width: 991px) {
  .slide-image {
    max-width: 200px;
  }
  .gap {
    width: 30px;
  }
}

/* スマホ以下：画面幅 576px 以下 */
@media (max-width: 576px) {
  .slide-image {
    max-width: 150px;
  }
  .gap {
    width: 20px;
  }
}