.has_tree {
  position: relative;
  isolation: isolate;
  overflow: hidden;
}

.has_tree .tree_bg {
  position: absolute;
  aspect-ratio: 1443 / 863;
  height: 90%;
  z-index: -1;
}

.has_tree.tree_x_l .tree_bg {
  left: 0;
}

.has_tree.tree_x_c .tree_bg {
  left: 50%;
}

.has_tree.tree_x_r .tree_bg {
  right: 0;
}

.has_tree.tree_y_t .tree_bg {
  top: 0;
}

.has_tree.tree_y_c .tree_bg {
  top: 50%;
}

.has_tree.tree_y_b .tree_bg {
  bottom: 0;
}

.has_tree.tree_x_l.has_tree.tree_y_t .tree_bg {
  transform: translate(-50%, -50%);
}

.has_tree.tree_x_c.has_tree.tree_y_t .tree_bg {
  transform: translate(-50%, -50%);
}

.has_tree.tree_x_r.has_tree.tree_y_t .tree_bg {
  transform: translate(50%, -50%);
}

.has_tree.tree_x_l.has_tree.tree_y_c .tree_bg {
  transform: translate(-50%, -50%);
}

.has_tree.tree_x_c.has_tree.tree_y_c .tree_bg {
  transform: translate(-50%, -50%);
}

.has_tree.tree_x_r.has_tree.tree_y_c .tree_bg {
  transform: translate(50%, -50%);
}

.has_tree.tree_x_l.has_tree.tree_y_b .tree_bg {
  transform: translate(-50%, 50%);
}

.has_tree.tree_x_c.has_tree.tree_y_b .tree_bg {
  transform: translate(-50%, 50%);
}

.has_tree.tree_x_r.has_tree.tree_y_b .tree_bg {
  transform: translate(50%, 50%);
}

.has_tree .tree_bg svg {
  object-fit: cover;
  height: 100%;
  width: 100%;
  color: #a9ac99;
  opacity: 0.1;
}
