@charset "utf-8";

/* ==========================================
 Layout
============================================*/

/* デザイン幅に対する比率計算用 */
[style*="--w"] {
  width: calc(100% * var(--w) / 1100);
}

/* ==========================================
 Layer
============================================*/

.layer--1 {
  top: 75%;
  left: 18%;
}

.layer--2 {
  top: 41%;
}

.layer--3 {
  top: 22%;
}

.layer--4 {
  top: 86%;
  left: 17.5%;
}

.layer--5 {
  top: 29%;
}

.layer--6 {
  top: 76%;
  left: 16.8%;
}

.layer--7 {
  top: 29%;
}

/* ==========================================
 Contents
============================================*/

/* form */
.form-control {
  font-size: var(--sz-26);
  text-align: center;
  padding: 1em 1em;
  margin-bottom: 1em;
  --bs-border-radius: 0;
}

.today {
  text-align: center;
  color: var(--bs-white);
  line-height: 1;
  font-size: var(--sz-45);
}

/* ==========================================
 メール補完入力のドロップダウンのスタイル
============================================*/

.dropdown-list {
  border: 1px solid #ccc;
  font-size: 40%;
  max-height: 300px;
  overflow-y: auto;
  position: absolute;
  background-color: white;
  width: 92.36%;
  z-index: 1000;
}
.dropdown-list div {
  padding: 8px;
  cursor: pointer;
}
.dropdown-list div:hover {
  background-color: #f0f0f0;
}