@charset "utf-8";
.no-gutter > [class*='col-'] {
  padding-right: 0;
  padding-left: 0;
}
.bg-lightgreen {
  background-color: #e6ede9;
}
.jumbotron {
  background-image: url('../img/top.jpg');
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  height: 600px;
  transition: background-image 1s ease; /* 背景画像の変化を1秒かけてスムーズにする */
  position: relative;
}
.jumbotron p .fs11rem {
  font-size: 1.1rem;
}
.preload-images {
  display: none; /* プリロード用の要素を非表示にします */
}
/* スマホデバイス用のスタイル */
@media screen and (max-width: 768px) {
  .jumbotron {
    background-image: url('../img/top02.jpg');
  }
  .jumbotron h2 {
    font-size: 1.35rem;
  }
  .jumbotron p .fs11rem {
    font-size: 0.9rem;
  }
}
.heading {
  border-left: 6px solid #aaa;
  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;
}
/* 大デバイス（デスクトップ, 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;
  }
}
.txt-ff {
  color: white; /* デフォルトのテキスト色を白に設定 */
  transition: color 0.3s ease; /* スムーズな色変化のためのトランジションを追加 */
}
.txt-ff:hover {
  color: rgba(255, 255, 255, 0.8); /* マウスオーバー時に80％透過する */
}
.fee-container {
  display: flex;
  margin-left: -50px;
  align-items: center;
}
.fee-item {
  flex: 1;
  padding-right: 10px;
}
.title-wrapper {
  border: 1px solid #0800d3;
  padding: 20px;
  border-radius: 5px;
  margin-bottom: 20px;
  position: relative; /* 親要素に対して相対的な位置を指定 */
}
.title-wrapper h4 {
  position: absolute; /* 絶対位置を指定 */
  top: -15px; /* 上部の位置を調整 */
  left: 20px; /* 左側の位置を調整 */
  background: #F8F9FA; /* 背景を白に設定 */
  padding: 0 10px; /* 内側の余白を設定 */
  margin: 0; /* 余白をリセット */
  color: rgba(8, 0, 211, 1.00); /* テキストの色を設定 */
}
.title-wrapper h4::before {
  content: "1"; /* 表示する数字 */
  display: inline-block; /* インラインブロックに設定 */
  border: 1px solid #0800d3; /* 四角のボーダー */
  padding: 5px 10px; /* 内側の余白 */
  border-radius: 5px; /* 角を丸める（必要に応じて） */
  font-size: 14px; /* フォントサイズ */
  margin-right: 10px; /* 右側の余白 */
  background-color: #0800d3; /* 背景色 */
  color: #ffffff; /* テキスト色 */
  vertical-align: middle; /* 垂直位置の調整 */
}
.title-wrapper .card-body h3 {
  font-size: 1.25rem;
  font-weight: bold;
}



.title-wrapper02 {
  border: 1px solid #FF004F;
  padding: 20px;
  border-radius: 5px;
  margin-bottom: 20px;
  margin-top: 20px;
  position: relative; /* 親要素に対して相対的な位置を指定 */
}
.title-wrapper02 h4 {
  position: absolute; /* 絶対位置を指定 */
  top: -15px; /* 上部の位置を調整 */
  left: 20px; /* 左側の位置を調整 */
  background: #F8F9FA; /* 背景を白に設定 */
  padding: 0 10px; /* 内側の余白を設定 */
  margin: 0; /* 余白をリセット */
  color: #FF004F; /* テキストの色を設定 */
}
.title-wrapper02 h4::before {
  content: "2"; /* 表示する数字 */
  display: inline-block; /* インラインブロックに設定 */
  border: 1px solid #FF004F; /* 四角のボーダー */
  padding: 5px 10px; /* 内側の余白 */
  border-radius: 5px; /* 角を丸める（必要に応じて） */
  font-size: 14px; /* フォントサイズ */
  margin-right: 10px; /* 右側の余白 */
  background-color: #FF004F; /* 背景色 */
  color: #ffffff; /* テキスト色 */
  vertical-align: middle; /* 垂直位置の調整 */
}
.title-wrapper02 .card-body h3 {
  font-size: 1.25rem;
  font-weight: bold;
}
@media only screen and (max-width: 768px) {
  .title-wrapper02 h4 {
    font-size: 1.2rem;
  }
  .title-wrapper02 h4 span {
    font-size: 90%;
    padding-left: 40px;
    padding-top: 10px;
  }
}
/* スマホのみで表示 */
@media only screen and (max-width: 768px) {
  .disp-pc {
    display: none !important;
  }
  .disp-sp {
    display: block !important;
  }
}
/* PCのみで表示02*/
@media only screen and (min-width: 768px) {
  .disp-sp {
    display: none !important;
  }
  .disp-pc {
    display: block !important;
  }
}
a.btn_01 {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  text-align: center;
  text-decoration: none;
  width: 90%;
  margin: auto;
  padding: 0.85rem;
  font-weight: bold;
  background: #fffaff;
  color: rgba(249, 72, 166, 1.00);
  border-radius: 100vh;
  position: relative;
  transition: 0.5s;
  border: 1px solid rgba(249, 72, 166, 1.00);
}
a.btn_01:hover {
  background: rgba(255, 67, 189, 0.7);
  color: #fff;
}
a.btn_02 {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  text-align: center;
  text-decoration: none;
  width: 90%;
  margin: auto;
  padding: 0.85rem;
  font-weight: bold;
  background: #faffff;
  color: rgba(61, 105, 247, 1.00);
  border-radius: 100vh;
  position: relative;
  transition: 0.5s;
  border: 1px solid rgba(61, 105, 247, 1.00);
}
a.btn_02:hover {
  background: rgba(61, 105, 247, 0.7);
  color: #fff;
}
a.btn_keiro {
  display: flex;
  justify-content: space-evenly;
  align-items: center;
  text-align: center;
  text-decoration: none;
  width: 90%;
  margin: 20px auto 15px auto;
  padding: 0.75rem;
  font-weight: bold;
  background: linear-gradient(to bottom, #f8f9fa, #e9ecef);
  color: #000000;
  border-radius: 100vh;
  position: relative;
  transition: 0.5s;
  border: 1px solid #787878;
}
a.btn_keiro:hover {
  background: rgba(166, 166, 166, 0.35);
  color: #4B4B4B;
  transform: translateY(2px); /* テキストを少し上に移動 */
}
#page-top {
  position: fixed;
  bottom: 20px;
  right: 20px;
  font-size: 15px;
  line-height: 1;
  z-index: 99;
}
#page-top a {
  background: rgba(11, 130, 255, 0.75);
  text-decoration: none;
  color: #fff;
  width: 60px;
  height: 60px;
  padding: 28px 5px;
  text-align: center;
  display: block;
  border-radius: 100%;
  opacity: 0.9;
  transition: all .3s ease;
  position: relative;
}
#page-top a:hover {
  text-decoration: none;
  opacity: .5;
}
#page-top a .triangle {
  position: absolute;
  font-size: 20px;
  top: 10px;
  transform: rotate(45deg);
  text-align: center;
  left: 38%;
}

/* スマホだけリアルタイム情報のアイコン */
#sp-dai {
  position: fixed;
  top: 400px;
  left: 0;
  font-size: 15px;
  line-height: 1;
  z-index: 100; /* ハンバーガーメニューの z-index よりも高く設定 */
  background-image: url("../img/dai-ico.png");
  display: none; /* 初期は非表示 */
}

#sp-dai a {
  text-decoration: none;
  width: 110px;
  height: 50px;
  color: #fff;
  text-align: center;
  display: block;
  transition: all .3s ease;
  position: relative;
}

#sp-dai a:hover {
  text-decoration: none;
  opacity: .5;
}



/*　Googleカレンダー埋め込み　*/
.google-cal {
  margin: auto;
  text-align: center;
}
.google-cal iframe {
  width: 100%;
  max-width: 800px;
  height: 400px;
}
@media (min-width: 750px) {
  .google-cal iframe {
    height: 600px;
  }
}
/* PCではinlin-block　スマホでは無効 */
.pc-inblo {
  display: inline-block;
  padding: 10px 20px;
}
@media (max-width: 798px) {
  .pc-inblo {
    display: block;
    width: 100%;
    margin: auto;
    text-align: center;
  }
}
/* リストマークの下に改行しても回り込まない */
ul.custom-list {
  list-style: none;
  padding: 0;
  margin: 0;
}
ul.custom-list li {
  padding-left: 20px;
  line-height: 1.5;
  position: relative;
	padding-bottom: 5px;
}
ul.custom-list li::before {
  content: "・";
  color: #000;
  position: absolute;
  top: 0;
  left: 0;
}

@media (max-width: 798px) {
	ul.custom-list li {
  font-size: 0.9rem;
}

}


.keikou {
  background: linear-gradient(transparent 60%, #ff6 60%);
}
.tit-res {}
@media (max-width: 798px) {
  .tit-res {
    font-size: 27px;
  }
}
.tit-res02 {}
@media (max-width: 798px) {
  .tit-res02 {
    font-size: 10px;
  }
}

/* 一般利用のお客様用 */
.tb-res {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  border: 1px solid #0800d3;
  padding: 10px;
  position: relative;
	border-radius: 5px;
}

.tb-res h4 {
  position: absolute; /* 絶対位置を指定 */
  top: -15px; /* 上部の位置を調整 */
  left: 20px; /* 左側の位置を調整 */
  background: #ffffff; /* 背景を白に設定 */
  padding: 0 10px; /* 内側の余白を設定 */
  margin: 0; /* 余白をリセット */
  color: rgba(8, 0, 211, 1.00); /* テキストの色を設定 */
}
.tb-res h4::before {
  content: "1"; /* 表示する数字 */
  display: inline-block; /* インラインブロックに設定 */
  border: 1px solid #0800d3; /* 四角のボーダー */
  padding: 5px 10px; /* 内側の余白 */
  border-radius: 5px; /* 角を丸める（必要に応じて） */
  font-size: 14px; /* フォントサイズ */
  margin-right: 10px; /* 右側の余白 */
  background-color: #0800d3; /* 背景色 */
  color: #ffffff; /* テキスト色 */
  vertical-align: middle; /* 垂直位置の調整 */
}


.tb-res > div {
  flex-basis: 100%; /* 画面幅の100%を占有 */
  box-sizing: border-box; /* borderとpaddingも含める */
  padding: 5px; /* 適宜調整 */
  text-align: center;
  margin: 0 auto;
}

@media screen and (min-width: 798px) {
  .tb-res > div:nth-child(1) {
    flex-basis: calc(35% - 10px); /* PCデバイスでは35%の幅を持つ */
    /* 10px は padding の合計 */
  }
  .tb-res > div:nth-child(2) {
    flex-basis: calc(65% - 10px); /* PCデバイスでは65%の幅を持つ */
    /* 10px は padding の合計 */
  }
}

@media screen and (max-width: 798px) {
  .tb-res h4 {
    width: 90%; /* 幅を90%に設定 */
    left: 50%; /* 左端を中央に */
    transform: translateX(-50%); /* 中央寄せのためにX方向に平行移動 */
    text-align: center; /* テキストを中央寄せ */
    box-sizing: border-box; /* パディングを含めて幅を計算 */
	  	  font-size: 1.25rem;
  }
}

/* ホテルのお客様用 */
.tb-res02 {
  display: flex;
  flex-wrap: wrap;
  width: 100%;
  border: 1px solid #FF004F;
  padding: 10px;
  position: relative;
	margin-top: 10px;
	border-radius: 5px;
	margin-bottom: 15px;
}

.tb-res02 h4 {
  position: absolute; /* 絶対位置を指定 */
  top: -15px; /* 上部の位置を調整 */
  left: 20px; /* 左側の位置を調整 */
  background: #ffffff; /* 背景を白に設定 */
  padding: 0 10px; /* 内側の余白を設定 */
  margin: 0; /* 余白をリセット */
  color: #FF004F; /* テキストの色を設定 */
}
.tb-res02 h4::before {
  content: "2"; /* 表示する数字 */
  display: inline-block; /* インラインブロックに設定 */
  border: 1px solid #FF004F; /* 四角のボーダー */
  padding: 5px 10px; /* 内側の余白 */
  border-radius: 5px; /* 角を丸める（必要に応じて） */
  font-size: 14px; /* フォントサイズ */
  margin-right: 10px; /* 右側の余白 */
  background-color: #FF004F; /* 背景色 */
  color: #ffffff; /* テキスト色 */
  vertical-align: middle; /* 垂直位置の調整 */
}


.tb-res02 > div {
  flex-basis: 100%; /* 画面幅の100%を占有 */
  box-sizing: border-box; /* borderとpaddingも含める */
  padding: 5px; /* 適宜調整 */
  text-align: center;
  margin: 0 auto;
}

@media screen and (min-width: 798px) {
  .tb-res02 > div:nth-child(1) {
    flex-basis: calc(35% - 10px); /* PCデバイスでは35%の幅を持つ */
    /* 10px は padding の合計 */
  }
  .tb-res02 > div:nth-child(2) {
    flex-basis: calc(65% - 10px); /* PCデバイスでは65%の幅を持つ */
    /* 10px は padding の合計 */
  }
}

@media screen and (max-width: 798px) {
  .tb-res02 h4 {
    width: 90%; /* 幅を90%に設定 */
    left: 50%; /* 左端を中央に */
    transform: translateX(-50%); /* 中央寄せのためにX方向に平行移動 */
    text-align: center; /* テキストを中央寄せ */
    box-sizing: border-box; /* パディングを含めて幅を計算 */
	  font-size: 1.25rem;
	  top: -35px;
  }
}


/* 料金表01 */
.table-container {
  border: 1px solid #BDBDBD;
  border-collapse: collapse;
  width: 100%;
  margin: 0 auto;
}
.table-header {
  background-color: rgba(255,242,158,0.25);
  text-align: center;
  padding: 8px;
  font-weight: bold;
  border-bottom: 1px solid #BDBDBD;
  font-size: 1.1rem;
}
.table-row {
  display: flex;
}
.table-cell {
  flex: 1;
  padding: 8px;
  text-align: center;
  border-right: 1px dotted #C5C2C2;
	display: flex; /* フレックスボックスを使用 */
  align-items: center; /* 縦中央揃え */
  justify-content: center; /* 横中央揃え */
}
.table-cell:last-child {
  border-right: none;
  font-size: 1.2rem;
  /* color: rgba(255, 0, 126, 1.00);*/
}

/* PC2列スマホ1列デフォルト */
.oya2r {
            width: 100%;
        }

        .ko2r {
            width: 100%;
        }

        /* PCデバイス向けのスタイル */
        @media (min-width: 799px) {
            .oya2r {
                display: flex;
            }
            .ko2r {
                width: auto; /* 子要素が均等に並ぶように調整 */
            }
			.ko2r:last-child {
                margin: 30px;
				padding: 0 10px;
            }
        }

        /* スマホデバイス向けのスタイル */
        @media (max-width: 798px) {
            .ko2r {
                width: 100%;
            }
		.ko2r:last-child {
                margin: 10px 0;

            }

        }


/* リストマークの下にテキストが回り込まないリスト */
.cus-list {
            list-style-position: outside; /* リストマークを外側に設定 */
            padding-left: 1.5em; /* 左側のパディングを調整してマークを内側に配置 */
        }

        .cus-list-item {
            margin-left: -1.5em; /* リストマークの幅を考慮して左マージンを調整 */
            padding-left: 1.5em; /* テキストのインデントを調整 */
            text-indent: -1.5em; /* 最初の行のテキストをリストマークの幅分インデント */
			padding-bottom: 10px;
        }

 @media (max-width: 798px) {
            .cus-list-item {
                margin-left: 0; /* マージンをリセット */
                padding-left: 0; /* パディングをリセット */
                text-indent: 0; /* インデントをリセット */
				line-height: 1.35;
				font-size: 0.9rem;
				padding-top: 10px;
				padding-bottom: 0;
            }
}

 @media (max-width: 798px) {
.font-def{
	font-size: 0.9rem;
}
}

 @media (max-width: 798px) {
.font-def02{
	font-size: 85%;
display: inline-block;
}
}


/* 改行させない */
.nobreak{
	display: inline-block;
	 }

/* 改行させないスマホだけ */
 @media (max-width: 798px) {
.nobreaksp{
	display: inline-block;
	 }
}

/* スマホだけテキスト中央 */
 @media (max-width: 798px) {
.sp-textc{
	text-align: center;
	 }
}