.label-image {
    position: fixed;
    top: 0px;  /* 화면 상단에서 100px 아래 */
    right: 0px;   /* 화면 우측에서 0px 왼쪽 */
    width: 250px;  /* 이미지 크기 */
    height: auto;  /* 가로 비율 유지 */
    z-index: 1000; /* 다른 요소 위에 표시 */
    opacity: 0.5;  /* 기본 투명도 */  
    transition: opacity 0.5s cubic-bezier(0.25, 0.8, 0.25, 1), 
                transform 1.3s cubic-bezier(0.25, 0.8, 0.25, 1);
    transform-origin: right top; /* 오른쪽 기준으로 확대 */
  }
/* 마우스를 올리면 밝아지고 확대 */
.label-image:hover {
  opacity: 1;
  transform: scale(2.1); /* 2.1배 확대 */
  background-color: rgba(0, 0, 0, 0.291);
  backdrop-filter: blur(10px); /* Glass effect */
}

/* 화면 가로폭이 1024px 미만일 때 */
@media (max-width: 1024px) {
  .label-image {
    top: auto;     /* 상단 위치 해제 */
    bottom: 10px;  /* 화면 하단에서 20px 위 */
    right: 0px;   /* 화면 우측에서 20px 왼쪽 */
    transform-origin: right bottom; /* 오른쪽 기준으로 확대 */    
  }
  .label-image:hover {
    opacity: 1;
    transform: scale(2.1); /* 10% 확대 */
  }
}

@media screen and (min-width: 1920px) {
  .label-image {   
    position: fixed;
  top: 0px;  /* 화면 하단에서 20px 위 */
  right: 0px;   /* 화면 우측에서 20px 왼쪽 */
  width: 400px;  /* 이미지 크기 */
  height: auto;  /* 가로 비율 유지 */
  z-index: 1000; /* 다른 요소 위에 표시 */
  opacity: 0.5;  /* 투명도 조절 */
  transition: opacity 0.5s cubic-bezier(0.25, 0.8, 0.25, 1), 
              transform 1.3s cubic-bezier(0.25, 0.8, 0.25, 1);
  }
}

@media (max-width: 600px) {
  .label-image {   
    display: none;
  }
}