body {
	font-family: 'Barlow', 'BIZ UDPGothic', 'Noto Sans JP', 'M PLUS 1p', sans-serif;
  font-size: 90%;
}

/* リンク色の指定 ///////////////////////////////// */
a { color: #000000; text-decoration: underline;}
a:hover { color: #000000; }

/* 長いアドレスを改行させるCSS ///////////////// */
.break-all {
  word-break: break-all;
}

/* 文字の終端を合わせる為の記述 ///////////////// */
.text-container-justfit {
  text-align: justify;
}
.text-container-justfit p {
  display: inline-block; /* 必要に応じてブロック要素に変更 */
  width: 100%;
}




/* フォントサイズの追加 ////////////////////////// */
.fs-7 {font-size: 0.9rem;}
.fs-8 {font-size: 0.8rem;}
.fs-9 {font-size: 0.7rem;}
.fs-10 {font-size: 0.6rem;}




/* 文字の背景に薄い黄色のマーカー色 */
.mark-yellow {
  background:linear-gradient(transparent 60%, #ff6 60%);
}

/* 半透明の背景色を持つカスタムクラス */
.bg-dark-opacity {
  background-color: rgba(0, 0, 0, 0.6); /* rgba(赤, 緑, 青, 透明度) */
}

.bg-info-opacity {
  background-color: rgba(38, 150, 160, 0.6); /* rgba(赤, 緑, 青, 透明度) */
}


 /* ホバー時に少し拡大 */
.img-hover-zoom {
  transition: transform 0.3s ease; /* 変化のスピード */
}
.img-hover-zoom:hover {
  transform: scale(1.01); /* ホバー時に少し拡大 */
}








/* adminLTEを打ち消し */
.sidebar-dark-dark {
  background-color: #212222 !important;
}
.btn-group-toggle > .btn input[type="radio"],
.btn-group-toggle > .btn-group > .btn input[type="radio"] {
  position: static;
  clip: auto;
  pointer-events: auto;
}
.table-number {
  font-family: 'Noto Sans JP', sans-serif;
}

.font_barlow {
  font-family: 'Barlow', sans-serif;
}

@media (min-width: 1600px) {
  .wrapper {
    max-width: 1600px; /* 例として1600pxに固定 */
    margin-left: auto;
    margin-right: auto;
  }
}




/* サイドメニュー（ナビ）の装飾 ///////////////// 

.sidebar .nav-link {
    padding: .7rem 1rem;
	background-color: #212222;
	border-bottom: solid;
	border-bottom-color: #191c1c;
    color: #939393!important;
}
.sidebar .nav-link.active {
    color: #cecece!important;
}
.sidebar .nav-link.active {
	background-color: #131313;
}
.sidebar .nav-link:hover {
	background-color: #2b2a2a;
}
.bg-sidebar {
    background-color: #232626 !important;
}
*/


.form-control:disabled, .form-control[readonly] {
    background-color: #FFFFFF;
}



/* アコーディオンの装飾 その１ ///////////////// */
details {
  border: 1px solid #ccc;
  border-radius: 5px;
}
details:not(:last-child) {
  margin-bottom: 3px;
}
details summary {
  list-style: none;
  cursor: pointer;
  padding: 10px;
  background: #FFFFFF;
  border-radius: 5px;
  font-weight: bold;
}
details summary::-webkit-details-marker {
  display: none; /* Chrome用のデフォルト三角削除 */
}
details summary::before {
  font-family: "Font Awesome 5 Free";
  content: '\f067';
  margin-right: 10px;
  color: #ccc;
}
details[open] summary::before {
  content: '\f068';
}

details > p {
  margin: 0;
  padding: 20px;
  background: #f9f9f9;
  border-radius: 0 0 5px 5px;
}
/* アコーディオンの装飾 その１ ///////////////// */




/* アコーディオンの装飾 その２ ///////////////// */
.acc-container {
	width:100%;
	margin:10px auto 0 auto;
	-webkit-border-radius:4px;
	-moz-border-radius:4px;
	-o-border-radius:4px;
	border-radius:4px;
	overflow: hidden;
}

.acc-btn { 
	width:100%;
	margin:0 auto;
	padding:15px 15px 0;
	cursor:pointer;
	border:1px solid #dfdfdf;
}

.acc-content {
	width:100%;
	margin:0 auto;
	display: none;
	background: #f8f9fa;
	padding:15px;
	height: auto;
	border:1px solid #dfdfdf;
}
/* アコーディオンの装飾 その２ ///////////////// */



/* datatablesのデザイン変更する場合
table.dataTable.row-border tbody th, table.dataTable.row-border tbody td, table.dataTable.display tbody th, table.dataTable.display tbody td {
    border: 1px solid #ddd;
}

table.dataTable thead .sorting, table.dataTable thead .sorting_asc, table.dataTable thead .sorting_desc, table.dataTable thead .sorting_asc_disabled, table.dataTable thead .sorting_desc_disabled {
    cursor: pointer;
    *cursor: hand;
    background-repeat: no-repeat;
    background-position: center right;
	border: 1px solid #ddd;
}
*/







/*画像に文字を載せる*/
.img-up-text {
	position: relative;/*相対配置*/
}

.img-up-text .up-c {
	position: absolute;/*絶対配置*/
	top: 50%;
	left: 50%;
	-ms-transform: translate(-50%,-50%);
	-webkit-transform: translate(-50%,-50%);
	transform: translate(-50%,-50%);
	margin:0;
	padding:0;
}

.img-up-text .up-t {
	position: absolute;/*絶対配置*/
	top: 0;
	left: 0;
}

.img-up-text .up-b {
	position: absolute;/*絶対配置*/
	bottom: 0;
	left: 0;
}

.up-black {
	position: relative;/*相対配置*/
}
.up-black::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
  /* background-image: linear-gradient(方向, 色1 位置1, 色2 位置2); */
  background-image: linear-gradient(90deg, rgba(0, 0, 0, 0.44), rgba(255, 255, 255, 0) 60%);
}
.up-black2 {
	position: relative;/*相対配置*/
}
.up-black2::after {
	content: '';
	position: absolute;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background-image: linear-gradient(180deg, transparent 0 60%, #000000 100%);
	border-radius: 10px;
}






/* テーブルの装飾 table-kk1 */
.table-kk1{
	width: 100%;
	border-collapse:separate;
	border-spacing: 0;
}

.table-kk1 th{
	text-align: center;
	padding: 10px 0;
}

.table-kk1 td{
	text-align: center;
	background-color: #F5F5F5;
	border-left: 1px solid #FFFFFF;
	border-bottom: 5px solid #FFFFFF;
	border-top:none;
	padding: 10px 0;
}

.table-kk1 td:last-child{
	border-right: 1px solid #FFFFFF;
}


/* メッセージの装飾 ///////////////// */
.toast-container {
  position: fixed;
  top: 4rem;
  right: 1rem;
  z-index: 999;
}
.toast-custom {
  /* 少し透過できる */
  opacity: 0.9;
  background-color: beige;
  color: darkgoldenrod;
}
/* メッセージの装飾 ///////////////// */





/* ---------- スクロールでふわっと表示 ---------- */
/* 画面外 */
.fade-block1 {
  opacity: .1;
  transition: all 1.5s;
}
/* 画面に入った時の動き */
.fade-block1.blockIn {
  opacity: 1;
}
/*画像にロールオーバー時に色薄くする*/
.img_wrap img{
  cursor: pointer;
  transition-duration: 0.3s;
}
.img_wrap:hover img{
  opacity: 0.9;
  transition-duration: 0.3s;
}



/* ---------- 右下浮遊バナー ---------- */
.floating-image {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 1050; /* Bootstrapのmodalなどより下にしたいなら調整 */
}

.floating-image img {
  width: 300px;   /* お好みで調整可能 */
  height: auto;
  transition: transform 0.3s ease;
}

.floating-image:hover img {
  transform: scale(1.05); /* ホバー時に少し拡大 */
}




/* スマートフォン以下の場合のスタイル */
@media (min-width: 576px) {
  .w-sm-0 { width: 0 !important; }
  .w-sm-25  { width: 25% !important; }
  .w-sm-50  { width: 50% !important; }
  .w-sm-75  { width: 75% !important; }
  .w-sm-100  { width: 100% !important; }
}


/* スマートフォンの場合のスタイル */
@media (max-width: 576px) {
  .content-wrapper > .content {
    padding: 0px;
  }
  .card-body {
    padding: 10px;
  }
  .card-header {
    padding: 10px;
  }
}


/* スマホフッターの装飾 ///////////////// */
/* メニューをページ下部に固定 */
#fixed-footer-menu {
  position: fixed;
  width: 100%;
  bottom: 0px;
  opacity: 1;
  z-index: 100;
}

/* メニューを横並びにする */
#fixed-footer-menu ul {
  display: flex;
  list-style: none;
  padding: 0;
  margin: 0;
  width: 100%;
  background: #ffffff;
  border-top: 1px solid #e6e5e5;
}

/* メニューの要素 */
#fixed-footer-menu li {
  justify-content: center;
  align-items: center;
  width: 25%; /* 要素が5つの場合（100/5） */
  padding: 0;
  margin: 0;
}

/* メニューのボタン */
#fixed-footer-menu li a {
  color: #282828;
  text-align: center;
  display: block;
  width: 100%;
  padding: 10px 0px 0px 0px;
  font-size: 8px;
  text-decoration: none;
}

/* メニュータイトル */
#fixed-footer-menu li p {
  font-size: 10px; /* メニュータイトルのフォントサイズ */
}

/* アイコンのサイズを調整 */
.footer-icon {
  font-size: 25px;
}
/* スマホフッターの装飾 ///////////////// */