@import url("/css/bootstrap5/bootstrap.css");
@import url("/css/bootstrap5/bootstrap-icons.css");
@import url("/css/lightbox.css");

.item p {
  text-align: justify;
}

:root {
  --stlnav-color-rgb:    231,  53, 111;
  --stlshot-color-rgb:     0, 157, 226;
  --stlimg-color-rgb:     71, 176,  54;
  --hoshinavi-color-rgb: 186, 132, 184;
}

.stlnav.item h2 {
  background-color: rgba(var(--stlnav-color-rgb), 0.25);
}

.stlnav.item h3 {
  background: linear-gradient(to bottom left, rgba(var(--stlnav-color-rgb), 0.1), white);
}

.stlshot.item h2 {
  background-color: rgba(var(--stlshot-color-rgb), 0.25);
}

.stlshot.item h3 {
  background: linear-gradient(to bottom left, rgba(var(--stlshot-color-rgb), 0.1), white);
}

.stlimg.item h2 {
  background-color: rgba(var(--stlimg-color-rgb), 0.25);
}

.stlimg.item h3 {
  background: linear-gradient(to bottom left, rgba(var(--stlimg-color-rgb), 0.1), white);
}

.hoshinavi.item h2 {
  background-color: rgba(var(--hoshinavi-color-rgb), 0.25);
}

.item .expln {
  min-height: 4.5rem;
}

.item dl {
  margin-left: 1rem; margin-right: 1rem; /* mx-3 */
  margin-bottom: 3rem; /* mb-5 */
}

.item dl dt {
  text-indent: -2rem;
  margin-left: 1rem; /* ms-3 */
  margin-top: 1rem; /* mt-3 */
}

.item dl dd {
  white-space: nowrap;
  margin-left: 0; /* ms-0 */
}

.item span strong {
  color: var(--bs-red);
}

.item dl dd a {
  font-size: 1rem !important; /* fs-6 */
}

footer {
  color: var(--bs-gray-600);;
  font-size: .9rem;
  text-align: center;
  padding-top: .5rem; /* pt-2 */
  border-top: 1px solid var(--bs-gray-400);
  margin-top: 1.5rem; margin-bottom: 1.5rem; /* my-4 */
}