@charset "UTF-8";
/* CSS Document */

body {
  padding-top:54px;
  
  background-color: #ffffff;
  color: #000000;
}

.navbar {
    background-color: #006687;
    color: #D8DEDC
}

/* .navbar内のリンクに適用するスタイル */
.navbar a:link { 
    color: #D8DEDC; /* 通常時のリンク色 */
}
.navbar a:visited { 
    color: #D8DEDC; /* 訪問済みリンク色 */
}
.navbar a:hover { 
    color: #cccccc; /* ホバー時のリンク色 */
}
.navbar a:active { 
    color: #ff8000; /* アクティブ時のリンク色 */
}


.bg-img {
  background-image: url("../images/toprogo.png");
  background-size: cover;
  background-position: center 60%;
}



a:link { color: #006687; }
a:visited { color: #006687; }
a:hover { color: #cccccc; }
a:active { color: #006687; }


h1 {
  position: relative;
  color: #ffffff;
  padding: 2px 0;
  text-align: left;
}
.display{
    color: #ffffff;
}
.lead{
  color: #ffffff;
  font-size: 20px;
  padding: 0px 0;
  text-align: left;
}

h2 {
  align-items: center; /* 横線を上下中央 */
  display: flex; /* 文字と横線を横並び */
}

h2:before, h2:after {
  background-color: #000000; /* 横線の色 */
  border-radius: 5px; /* 横線の両端を丸く */
  content: "";
  flex-grow: 1; /* 横幅いっぱい */
  height: 1px; /* 横線の高さ */
}

h2:before {
  margin-right: 40px; /* 文字との余白 */
}

h2:after {
  margin-left: 40px; /* 文字との余白 */
}


h3 {
  padding: 0.5em;/*文字周りの余白*/
  color: #494949;/*文字色*/
  background: #D8DEDC;/*背景色*/
  border-left: solid 5px #006687;/*左線（実線 太さ 色）*/
}

h4 {
  position: relative;
  padding: 0.25em 0;
}
h4:after {
  content: "";
  display: block;
  height: 4px;
  background: -webkit-linear-gradient(to right, rgb(230, 90, 90), transparent);
  background: linear-gradient(to right, rgb(230, 90, 90), transparent);
}

h5 {
  position: relative;
  color: #FFFFFF;
  padding: 2px 0;
  text-align: center;
}



.swiper-container .swiper-slide img {
    max-width: 80%;
    height: auto;
}
  
.swiper-button-prev,
.swiper-button-next {
    --swiper-navigation-color: #ffffff; //ここに変更する色を指定
    position: absolute;
    top: 50%;
    width: 40px;
    height: 0px;
    margin-top: -40px;
    z-index: 10;
    background-position: center;
    background-image: none;　/* 背景画像なし */
}

/* ページネーションのサイズと色 */
.swiper-pagination-bullet {
  background-color: #bbb;
  height: 12px;
  width: 12px;
}
/* ページネーションがアクティブな時の色 */
.swiper-pagination-bullet.swiper-pagination-bullet-active {
  background-color: #ffffff !important;
}