@charset "UTF-8";

.px-5 {
  padding-right: 1rem !important;
  padding-left: 1rem !important;
}

.my-5_min {
  margin-top: 1.5rem !important;
  margin-bottom: 1.5rem !important;
}

.py-5_min {
  padding-top: 1rem !important;
  padding-bottom: 1rem !important;
}


/*メイン画面のテキスト*/
.justify-topmain-left {
  justify-content: left !important;
}
/*
.align-topmain-left {
  align-items: left !important;
}*/

.text-topmain {
  text-align: left !important;
}
.display-4 {
  font-size: calc(1.475rem + 2.7vw);
  font-weight: 300;
  line-height: 1.2;
}
.mb-2 {
  margin-bottom: 0.5rem !important;
}

/*--アイコン--*/

.bi-camera-fill{
	font-size:2rem;
    color:#191970;
}

.bi-book-half{
	font-size:2rem;
    color:#191970;
}

.bi-chat-dots-fill{
	font-size:2rem;
    color:#191970;
}

.bi-people-fill{
	font-size:2rem;
    color:#191970;
}




/*メイン画面の写真*/

.top_big-bg {
	background-size: cover;
	background-position: right top;
/*	background-image: url(../images/background_005.jpg);*/
	background-image: url(../images/kabe2025_001.jpg);
	max-width: 100%;
	height: 768px;
	/*height: ;*/
}

#home1 {
	background-image: url(background_005.jpg);
	min-height: 500vh;
}

/**コンテンツのタイトル文字**/
.top_contents {
/*	font-size: 1.25rem;	*/
    font-family: 'Noto Serif JP', serif; /* タイトルは明朝体で重厚に */
	font-size: 1.80rem;	
	padding: 0.2em;/*文字周りの余白*/
	color: #000000;/*文字色*/
	border-bottom: solid 2px #191970;/*下線*/
}

/*コンテンツ*/
.cont_description {
  font-size: 1.2em;
  color: #666;
  margin-bottom: 20px;


/*更新履歴*/
.change_rireki {
  color: #505050;/*文字色*/
  padding: 0.5em;/*文字周りの余白*/
  display: inline-block;/*おまじない*/
  line-height: 1.3;/*行高*/
  background: #dbebf8;/*背景色*/
  vertical-align: middle;
  border-radius: 25px 0px 0px 25px;/*左側の角を丸く*/
}

.change_rireki:before {
  content: '●';
  color: white;
  margin-right: 15px;
}

.rireki-bold {	
	font-size: 1.2rem;
	list-style:  none;   
}

/*About*/
.description {
/*  font-size: 1.0em;*/
  font-size: 0.8em;
  color: #666;
  margin-bottom: 20px;
}

/*歴史小説 画面*/
.left_menu {
	font-size: 0.9rem;
	list-style:  none;   
}

.left_menu_font1 {
	font-size: 0.9rem;
	list-style:  none;   
}

.accordion {
  --bs-accordion-color: #212529;
  --bs-accordion-bg: #fff;
  --bs-accordion-transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out, border-radius 0.15s ease;
  --bs-accordion-border-color: var(--bs-border-color);
  --bs-accordion-border-width: 1px;
  --bs-accordion-border-radius: 0.375rem;
  --bs-accordion-inner-border-radius: calc(0.375rem - 1px);
  --bs-accordion-btn-padding-x: 0.25rem; 
  --bs-accordion-btn-padding-y: 0.75rem; 
  --bs-accordion-btn-color: #212529;
  --bs-accordion-btn-bg: var(--bs-accordion-bg);
  --bs-accordion-btn-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23212529'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
  --bs-accordion-btn-icon-width: 1.25rem;
  --bs-accordion-btn-icon-transform: rotate(-180deg);
  --bs-accordion-btn-icon-transition: transform 0.2s ease-in-out;
  --bs-accordion-btn-active-icon: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%230c63e4'%3e%3cpath fill-rule='evenodd' d='M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z'/%3e%3c/svg%3e");
  --bs-accordion-btn-focus-border-color: #86b7fe;
  --bs-accordion-btn-focus-box-shadow: 0 0 0 0.25rem rgba(13, 110, 253, 0.25);
  --bs-accordion-body-padding-x: 0.7rem;
  --bs-accordion-body-padding-y: 1rem;
  --bs-accordion-active-color: #0c63e4;
  --bs-accordion-active-bg: #e7f1ff;
}

/*--大きな題名 -->*/
.card-title {
	font-size: 1.0rem;
}

/* 書籍表紙の表示と脇の情報 */
.flex {
  display: flex; /*横並び*/
}
.flex .image {
/*  width: 640px; 画像サイズ指定*/
  margin: 0;
  padding: 0;
　overflow: auto;
  position: relative;
}
.flex .right {
  margin: 0 0 0 20px;
  padding: 0;
}


<!--紹介文の文字フォント-->
.card-text {
	font-size: 0.8rem;
}


/*史跡巡り 画面*/

.side-sc {
  position: sticky;
  top: 0;
}


.mi-midashi {
	font-weight:  bold;
}
.image-with-caption {
  display: flex; /* float の代わりに flexbox を使うこともできます (後述) */
  align-items: flex-start;
  margin-bottom: 1em;
}

.image-with-caption img {
  width: 50%;
  height: auto;
  margin-left: 1em; /* 写真を右に配置するため、左側に余白を設定 */
  float: right; /* 写真を右に寄せる */
}

.image-with-caption .caption {
  overflow: hidden; /* float 解除のハック */
}

/* float を解除するためのclearfix (必要に応じて) */
.clearfix::after {
  content: "";
  display: table;
  clear: both;
}

.yohaku {
  justify-content:space-between;
}

.img_container {
    display: flex;
    justify-content: space-around; /* 画像の間に均等に余白を設定 */
}
.img_container img {
    width: 46%; /* 画像が3つ並ぶように設定 */
    height: auto;
}



	
/*トップページの説明文*/
.shiseki_description {
  font-size: 1.0em;
  color: #666;
  margin-bottom: 20px;
}



/*史跡巡り メニュー　タブ20250702　*/


/*史跡巡り メニュー*/
/* Google Fontsのインポート（必要であればHTMLの<head>セクションに<link>タグで追加してもOKです）
@import url('https://fonts.googleapis.com/css2?family=Montserrat:wght@400;600&family=Roboto:wght@400;500&display=swap'); */

/* PCやタブレット（768pxより大きい画面）のスタイル */
/* メディアクエリの外側に記述することで、デフォルトのスタイルとして適用されます */



/* --- font --- */

.noto-sans-jp-<uniquifier> {
  font-family: "Noto Sans JP", sans-serif;
  font-optical-sizing: auto;
  font-weight: <weight>;
  font-style: normal;
}
<!--武将紹介文の文字フォント-->
.kosugi-maru-regular {
  font-family: "Kosugi Maru", sans-serif;
  font-weight: 400;
  font-style: normal;
}

.card-text00 {
	font-size: 0.9rem;
  font-family: "Kosugi Maru", sans-serif;
}


/**物語**/
.monogatari-image {
  /* 背景画像を指定 */
  background-image: url("../images/photo06.png"); 
  
  /* 画像が要素全体を覆うように設定 */
  background-size: cover; 
  
  /* 画像の位置を中央に設定 */
/*  background-position: center; */
  background-position: center;
  
  /* 要素の高さ（必要に応じて調整） */
  height: 360px; 
/*  height: 500px; */
  
  /* テキストを中央に配置するための設定 */
  display: flex;
  justify-content: left; /* 水平方向の中央揃え */
/*  align-items: top;     /* 垂直方向の中央揃え */
  align-items: flex-start; /* 垂直方向の最上部に配置 */
  
  /* 重ねたテキストの色や影を調整し、読みやすくする */
  color: white;
  text-shadow: 2px 2px 4px rgba(0,0,0,0.5);
}

.monogatari-txt {
  text-align: left;
  margin-top: 30px; /* ここで文字を上から50px下にずらす */
}

.monogatari-txt h3 {
  font-size: 1.7em;
  margin: 0;
}

.monogatari-txt p {
  font-size: 1.3em;
  color: white;
}