.title {
    color: white;
    font-size: clamp(1.5rem, 3.25vh, 3rem);
    position: absolute;
    top: 18vh;
    left: 5vw;
}


.blank, .roginButton {
    width: 90vw;
    height: 7vh;
    color: white;
    box-sizing: border-box;
    border: 1px solid greenyellow;
    border-radius: 15px;
    font-size: clamp(1rem, 2.25vh, 2rem);
    background: transparent;
    position: absolute;
    left: 5vw;
}

#class_id, #password {
    padding-left: 5%;
}

#class_id {
    top: 28vh;
}

#password {
    top: 37vh;
}

.roginButton {
    height: 5vh;
    top: 51vh;
}

.error {
    color: white;
    font: clamp(1rem, 2vh, 1.5rem);
    position: absolute;
    top: 44.5vh;
    left: 50%;
    transform: translateX(-50%);
    white-space: nowrap;
}

.no {
      color: red;
  font-weight: bold;
  margin-top: 10px;
  display: none; /* 기본은 숨김 */
}

/* iPad Pro 세로 기준(예시) */
@media (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {
    .error {
        top: 45vh;  /* iPad Pro에서는 조금 더 아래로 */
    }
}

/* 자동완성 방지 */
input:-webkit-autofill {
    box-shadow: 0 0 0px 1000px white inset;
    -webkit-text-fill-color: black;
    transition: background-color 5000s ease-in-out 0s;
}

input:focus {
    outline: none;
    box-shadow: none;  /* 필요시 추가 */
}

input::placeholder {
    color: white;  /* 원하는 색상으로 변경 */
    opacity: 1;        /* 투명도 조절 (기본 0.5~0.7 정도) */
}