@import url("https://cdn.jsdelivr.net/gh/orioncactus/pretendard@v1.3.8/dist/web/variable/pretendardvariable.css");
.cover {
  position: relative;
}
.cover .cintro{
  color: rgb(44, 44, 44);
  font-family: 'Pretendard Variable';
  font-size: 2em;
  min-width: 1000px;
  font-weight: 700;
  position: absolute;
  top: 45%;
  bottom: 45%;
  left: 45%;
  right: 45%;
  z-index: 100;
}
.cover .bg {
  background-image: url('/product/prod_image.jpg');
  filter: opacity(.9) drop-shadow(0 0 0 rgb(0, 0, 0));
  width: 100%;
  height: 30vh;
  background-size: cover;
  background-position: 20% 40%;
  color: rgb(255, 255, 255);
  display: flex;
  align-items: center;
  justify-content: center;

}
.outer {
  font-family: 'Pretendard Variable';
  font-size: 1.1em;
  font-weight: 300;
  text-align: center;
  display: flex;
  align-items: center;
  justify-content: center;
  height: 60px;
  border-bottom: 0.09em solid gray;
}
.outer .prod1,
.outer .prod2,
.outer .prod3,
.outer .prod4{
  max-width: 120px;
  width: 20%;
  height: 100%;
  display: flex;
  align-items: center; /* This vertically aligns the text */
  justify-content: center;
}

.outer .prod2,
.outer .prod3,
.outer .prod4 {
  margin-left: 5%;
}

.outer .prod1 a,
.outer .prod2 a,
.outer .prod3 a,
.outer .prod4 a {
  text-decoration: none;
  color: black;
}