@charset "utf-8";

.popup {
  width: 30%;
  position: fixed;
  bottom: 24px;
  right: 24px;
  z-index: 999;
}

.popup.disable {
  display: none;
}

.popup_link {
  display: block;
  box-shadow: rgb(0 0 0 / 40%) 2px 2px 6px;
  transition: .4s;
}

.popup_link:hover {
  box-shadow: rgb(0 0 0 / 10%) 2px 2px 6px;
}

.popup_img {
  width: 100%;
  display: block;
}

.popupClose {
  width: 30px;
  height: 30px;
  background: #fff;
  border-radius: 50%;
  position: absolute;
  top: -15px;
  right: -15px;
  box-shadow: rgb(0 0 0 / 40%) 2px 2px 6px;
  cursor: pointer;
  transition: .4s;
}

.popupClose:hover {
  box-shadow: rgb(0 0 0 / 10%) 2px 2px 6px;
}

.popupClose::before,
.popupClose::after {
  content: "";
  background: #000;
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) rotate(45deg);
}

.popupClose::before {
  width: 18px;
  height: 1px;
}

.popupClose::after {
  width: 1px;
  height: 18px;
}