@charset "UTF-8";
.hima-wrap {
  width: 90%;
  max-width: 600px;
  height: 200px;
  margin: 20px auto 40px;
  border: 1px solid #ccc;
  display: flex;
  justify-content: center;
  align-items: center;
}

.hima-button-blue1 {
  display: block;
  width: 80%;
  margin: 30px auto;
  padding: 12px 24px;
  font-size: 20px;
  border-radius: 5px;
  transition: all 0.2s;
  background-color: #1565c0; /* メインの青 */
  border: 1px solid #1565c0;
  color: #fff; /* 白文字 */
}
.hima-button-blue1:hover, .hima-button-blue1:focus {
  background-color: #1e88e5; /* 明るい青 */
  border-color: #1e88e5;
}
.hima-button-blue1:active {
  background-color: #0d47a1; /* 濃い青 */
  border-color: #0d47a1;
}
.hima-button-blue1:disabled {
  opacity: 0.65;
  pointer-events: none;
}

.hima-button-blue2 {
  display: block;
  width: 80%;
  margin: 30px auto;
  padding: 12px 24px;
  font-size: 20px;
  border-radius: 5px;
  transition: all 0.2s;
  background-color: #1a237e; /* メインの紺 */
  border: 1px solid #1a237e;
  color: #fff;
}
.hima-button-blue2:hover, .hima-button-blue2:focus {
  background-color: #283593; /* 少し明るい紺 */
  border-color: #283593;
}
.hima-button-blue2:active {
  background-color: #0d1656; /* 濃い紺 */
  border-color: #0d1656;
}
.hima-button-blue2:disabled {
  opacity: 0.65;
  pointer-events: none;
}

.hima-button-blue3 {
  display: block;
  width: 80%;
  margin: 30px auto;
  padding: 12px 24px;
  font-size: 20px;
  border-radius: 5px;
  transition: all 0.2s;
  background-color: #007c91; /* メインの青緑 */
  border: 1px solid #007c91;
  color: #fff;
}
.hima-button-blue3:hover, .hima-button-blue3:focus {
  background-color: #00acc1; /* 明るい青緑 */
  border-color: #00acc1;
}
.hima-button-blue3:active {
  background-color: #006064; /* 濃い青緑 */
  border-color: #006064;
}
.hima-button-blue3:disabled {
  opacity: 0.65;
  pointer-events: none;
}

.hima-button-blue4 {
  display: block;
  width: 80%;
  margin: 30px auto;
  padding: 12px 24px;
  font-size: 20px;
  border-radius: 5px;
  transition: all 0.2s;
  background-color: #bbdefb; /* 明るい青 */
  border: 1px solid #64b5f6;
  color: #0d47a1; /* 紺文字 */
}
.hima-button-blue4:hover, .hima-button-blue4:focus {
  background-color: #90caf9; /* 少し濃い青 */
  border-color: #42a5f5;
}
.hima-button-blue4:active {
  background-color: #64b5f6; /* 濃い青 */
  border-color: #1e88e5;
}
.hima-button-blue4:disabled {
  opacity: 0.65;
  pointer-events: none;
}