/*
 * https://colormagic.app/ja/palette/68df63e12677126f2849e644
 * https://colormagic.app/ja/palette/684d4aeaa1f3618a008a98f1
 */

/* CSS */
.color-1 {
  color: #2a4a9d;
}
.color-2 {
  color: #4c6eb8;
}
.color-3 {
  color: #f1c40e;
}
.color-4 {
  color: #e77e23;
}
.color-5 {
  color: #e74d3c;
}

/* CSS Variables */
:root {
  --color-1: #2a4a9d;
  --color-2: #4c6eb8;
  --color-3: #f1c40e;
  --color-4: #e77e23;
  --color-5: #e74d3c;
}

body {
  /*background-color: #f8f9fa;*/
  /*
  font-family: "Noto Sans JP";
  font-family: "M PLUS Rounded 1c", sans-serif;
  font-family: "Zen Maru Gothic", sans-serif;
  */
  font-family: "Kosugi Maru", sans-serif;
}
.sidebar {
  background-color: #2a4a9d;
  color: white;
  height: 100vh;
}
.sidebar a {
  color: white;
  text-decoration: none;
}
.sidebar a:hover {
  color: white;
  text-decoration: underline;
}
.header {
  /*background-color: #343a40;*/
  background-color: #2a4a9d;
  color: white;
  padding: 0.75rem 1rem;
}
.progress-bar-label {
  font-size: 0.75rem;
  margin-top: 0.25rem;
}
.offcanvas-header {
  background-color: #2a4a9d;
  color: white;
}
.offcanvas-body {
  background-color: #2a4a9d;
  color: white;
}

main {
  padding-bottom: 100px; /* フッターボタン分の余白 */
}

ul {
  margin-bottom: 0px;
}

.box-img {
  overflow: hidden;
}

.box-img .img-thumbnail {
 transition: .3s all;
}

.box-img .img-thumbnail:hover {
  transform: scale(1.3, 1.3);
  /*transform-origin: center top;*/
}

.tooltip {
  font-size: 8pt;
}

.driver-popover.driverjs-theme {
  background-color: #f6d860;
  color: #000;
}

.modal {
  backdrop-filter: blur(5px);
}

/*
.table th {
  width: 150px;
}
*/

/* 20等分 */
.col-w1 {
  width:5%;
}
.col-w2 {
  width:10%;
}
.col-w3 {
  width:15%;
}
.col-w4 {
  width:20%;
}
.col-w5 {
  width:25%;
}
.col-w6 {
  width:30%;
}
.col-w7 {
  width:35%;
}
.col-w8 {
  width:40%;
}
.col-w9 {
  width:45%;
}
.col-w10 {
  width:50%;
}
.col-w11 {
  width:55%;
}
.col-w12 {
  width:60%;
}
.col-w13 {
  width:65%;
}
.col-w14 {
  width:70%;
}
.col-w15 {
  width:75%;
}
.col-w16 {
  width:80%;
}
.col-w17 {
  width:85%;
}
.col-w18 {
  width:90%;
}
.col-w19 {
  width:95%;
}
.col-w20 {
  width:100%;
}

