body{
  height: 100vh
}

body>.container .content {
  margin-left: -1.5rem;
}
body>.form-control+.form-control {
  margin-top: .5rem;
}
body>.nav+.nav,
body>.alert+.alert,
body>.card+.card,
body>.navbar+.navbar,
body>.progress+.progress,
 {
  margin-top: 1rem
}
body>svg+svg,
body>img+img {
  margin-top: 1rem;
  margin-left: 0.5rem
}
body>.btn,
body>.btn-group {
  margin: .25rem .125rem;
}
body>.btn-toolbar+.btn-toolbar {
  margin-top: .5rem;
}

.bd-placeholder-img {
  font-size: 1.125rem;
  text-anchor: middle;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
  user-select: none;
}

.bd-placeholder-img-lg {
  font-size: 3.5rem;
}

@media (max-width:1200px) {
  .bd-placeholder-img-lg {
    font-size: calc(1.475rem + 2.7vw);
  }
}

/* (不透明トースト背景画像) */
.bg-toast {
  background-color: #007bff;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='80' height='80' viewBox='0 0 80 80'%3E%3Cg fill='%23ffc107' fill-opacity='0.94'%3E%3Cpath fill-rule='evenodd' d='M0 0h40v40H0V0zm40 40h40v40H40V40zm0-40h2l-2 2V0zm0 4l4-4h2l-6 6V4zm0 4l8-8h2L40 10V8zm0 4L52 0h2L40 14v-2zm0 4L56 0h2L40 18v-2zm0 4L60 0h2L40 22v-2zm0 4L64 0h2L40 26v-2zm0 4L68 0h2L40 30v-2zm0 4L72 0h2L40 34v-2zm0 4L76 0h2L40 38v-2zm0 4L80 0v2L42 40h-2zm4 0L80 4v2L46 40h-2zm4 0L80 8v2L50 40h-2zm4 0l28-28v2L54 40h-2zm4 0l24-24v2L58 40h-2zm4 0l20-20v2L62 40h-2zm4 0l16-16v2L66 40h-2zm4 0l12-12v2L70 40h-2zm4 0l8-8v2l-6 6h-2zm4 0l4-4v2l-2 2h-2z'/%3E%3C/g%3E%3C/svg%3E");
}

/* (透過用背景画像) */
.bg-transparent-img {
  background-color: #55595c;
  background-image: url("data:image/svg+xml,%3Csvg width='30' height='30' viewBox='0 0 40 40' xmlns='http://www.w3.org/2000/svg'%3E%3Cpath d='M20 20.5V18H0v-2h20v-2H0v-2h20v-2H0V8h20V6H0V4h20V2H0V0h22v20h2V0h2v20h2V0h2v20h2V0h2v20h2V0h2v20h2v2H20v-1.5zM0 20h2v20H0V20zm4 0h2v20H4V20zm4 0h2v20H8V20zm4 0h2v20h-2V20zm4 0h2v20h-2V20zm4 4h20v2H20v-2zm0 4h20v2H20v-2zm0 4h20v2H20v-2zm0 4h20v2H20v-2z' fill='%23373a3c' fill-rule='evenodd'/%3E%3C/svg%3E");
}

.border-utils {
  display: inline-block;
  width: 5rem;
  height: 5rem;
  margin: .25rem;
  background-color: #f5f5f5;
}
svg[class*="rounded"] {
  margin: 0.25rem
}

body .ratio {
  display: inline-block;
  width: 10rem;
  color: var(--bs-gray);
  background-color: var(--bs-light);
  border: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color);
}
body .ratio>div {
  display: flex;
  align-items: center;
  justify-content: center;
}