/*!
 * Start Bootstrap - Small Business HTML Template (http://startbootstrap.com)
 * Code licensed under the Apache License v2.0.
 * For details, see http://www.apache.org/licenses/LICENSE-2.0.
 */

body {
    padding-top: 70px; /* Required padding for .navbar-fixed-top. Change if height of navigation changes. */
}

.navbar-fixed-top .nav {
    padding: 20px 0;
}

.navbar-fixed-top .navbar-brand {
    padding: 0 15px;
}

footer {
  text-align: center;
  padding: 5px;
  background: #101010;
  color: #808080;
}

@media(min-width:768px) {
    body {
        padding-top: 93px; /* Required padding for .navbar-fixed-top. Change if height of navigation changes. */
    }

    .navbar-fixed-top .navbar-brand {
        padding: 15px 0;
    }}

    /* 画面幅が991px以下になった場合に適用されるスタイル */
@media (max-width: 991.98px) {
  
  /* ボタンを囲む親要素(col-md-2)をFlexboxコンテナにする */
  .col-md-2 {
    display: flex;
    flex-wrap: wrap; /* 子要素（ボタン）がはみ出たら折り返す */
    justify-content: flex-start; /* ボタンを左詰めで配置 */
    margin-bottom: 20px; /* 下のコンテンツとの間に余白を確保 */
  }

  /* btn-blockクラスのスタイルを上書きする */
  .col-md-2 .btn-block {
    width: auto; /* 幅をコンテンツに合わせて自動調整 */
    margin: 3px; /* ボタン同士の間に少し余白を持たせる */
  }
}