/* -------------------------------------------------- */
/* コンテナ */
/* -------------------------------------------------- */
.ls-container{
	background-color: #000;
  font-family: "ヒラギノ明朝 ProN","Hiragino Mincho ProN","Yu Mincho","MS PMincho",sans-serif;
}
/* -------------------------------------------------- */
/* パンくずリスト */
/* -------------------------------------------------- */
.ls-breadcrumb-ctm
 {
	background-color: #000;
	margin: 0;
	padding: 0;
	list-style: none;
  }
  .ls-breadcrumb-ctm li,
  .ls-breadcrumb-ctm li a
  {
	font-size: 0.9rem;
	color: #957141;
  }
  .breadcrumb-item + .breadcrumb-item::before 
  {  
	content: "\f105" !important; 
	font-family: "Font Awesome 5 Free";
	font-weight: 900;
	color: #957141;
  }
/* -------------------------------------------------- */
/* ヘッダーメニュー */
/* -------------------------------------------------- */
  .nav-item{
	background: #957141;
  }
/* -------------------------------------------------- */
/* トップイメージ */
/* -------------------------------------------------- */
.ls-topImg {
	position: relative;
	display: block;
	text-align: center;
  }
  
  .ls-logo {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	width: 60%;
	max-width: 100%;
  }
  
  .ls-background {
	width: 100%;
	height: auto;
	box-sizing: border-box;
	object-fit: cover;
	/* opacity: 0.8; */
  }
/* -------------------------------------------------- */
/* ユーティリティ */
/* -------------------------------------------------- */
.ls-color1 {
    color: #957141;
}
/* -------------------------------------------------- */
/* タイトル */
/* -------------------------------------------------- */
.ls-h1 {
    display: inline-block;
    font-size: 1.2rem;
    color: #957141;
    padding: 0.5em 0;
    border-top: solid 3px #957141;
    border-bottom: solid 3px #957141;
    display: table; /* テーブルとして要素を扱う */
    margin: 0 auto; /* 中央寄せ */
}
.ls-h2 {
    display: inline-block;
    font-size: 1.2rem;
    color: #957141;
    padding: 0.5em 0;
    border-bottom: solid 3px #957141;
    display: table; /* テーブルとして要素を扱う */
    margin: 0 auto; /* 中央寄せ */
}
/* -------------------------------------------------- */
/* リード文 */
/* -------------------------------------------------- */
.ls-lead p{
	text-align: center;
}
.ls-lead p{
    font-size: 1.1rem;
    color: #fff;
    padding: 10px 0;
}
/* -------------------------------------------------- */
/* ピックアップ */
/* -------------------------------------------------- */
.card{
	background-color: #000;
	padding: 5px;
	margin-bottom: 5px;
	font-family: "Helvetica Neue",Arial,"Hiragino Kaku Gothic ProN","Hiragino Sans",Meiryo,sans-serif;  
}
.card-body{
	background-color: #fff;
	padding: 0;
  height:auto;
  padding-bottom: 20px;  
}
.ls-card-img-top img {
	width: 100%;
	height: 260px;
	object-fit: cover; /* 画像のアスペクト比を維持しつつ、要素にフィットさせる */
  }
.ls-area{
	color: #957141;
	margin: 5px 10px;
	font-size: 0.9rem;
}
.ls-stay-title{
	color: #000;
	margin: 10px;
	font-size: 1.1rem;
}
.ls-comment{
	color: #555;
	margin: 10px;
	font-size: 0.8rem;
}
.ls-button1 {
    background: #957141;
    position: relative;
    display: inline-block; /* displayをinline-blockに変更 */
    margin: 0.5rem 0; /* 不要なマージンを削除 */
    padding: 10px 30px 10px 15px;
    color: #fff;
    transition: 0.3s ease-in-out;
    text-align: left; /* 左寄せに変更 */
    width: auto; /* テキストの自然幅に合わせる */
    max-width: none; /* 不要な最大幅を削除 */
}
.ls-button1:after {
    content: '';
    width: 8px;
    height: 8px;
    border-top: 3px solid #fff;
    border-right: 3px solid #fff;
    transform: rotate(45deg) translateY(-50%);
    position: absolute;
    top: 50%;
    right: 20px;
    border-radius: 1px;
    transition: 0.3s ease-in-out;
}
.ls-button1:hover {
    color: #FFF;
}
/* -------------------------------------------------- */
/* エリア */
/* -------------------------------------------------- */
.ls-area-img {
	position: relative;
	padding: 5px;
  }
  
  .image-link {
	display: block;
	position: relative;
	height: 150px; /* イメージの高さ */
	width: 100%;
  }
  
  .linked-image {
	height: 100%; /* .image-link の高さに合わせる */
	width: 100%; /* .image-link の幅に合わせる */
	object-fit: cover; /* イメージを枠内に収める */
	opacity: 0.5;
  }
  
  .image-text,
  .image-text-theme {
	position: absolute;
	top: 50%;
	left: 50%;
	transform: translate(-50%, -50%);
	font-size: 1.8rem;
	color: white;
	text-align: center;
  width: 100%;
  height: auto;
}
  .image-text-theme {
    font-size: 1.5rem;
    }
  
/* -------------------------------------------------- */
/* レスポンシブ */
/* -------------------------------------------------- */
/* md 中デバイス（タブレット, 768px 以上） */
@media (min-width: 768px) {	
  /* -------------------------------------------------- */
  /* トップイメージ */
  /* -------------------------------------------------- */
  .ls-topImg .ls-logo {
    width: 40%;
  }
  .ls-topImg .ls-background {
    height: 550px;
  }
  .ls-lead p{
    font-size: 1.2rem;
  }
  .card-body{
    height:450px;
  }
}

/* md 中デバイス（タブレット, 768px〜992px） */
@media (min-width: 768px) and (max-width: 992px) {
  /* -------------------------------------------------- */
  /* ピックアップ */
  /* -------------------------------------------------- */
  .card-body{
    height:auto;
    padding-bottom: 20px;
  }
  .ls-card-img-top img {
    height: 50vh;
   }

}