@charset "UTF-8";


/* 서브공용 수정사항 */

.main-visual img{
  width: 100%;
}

.slick-list{
  margin: 0 -5px;
}
.slick-slide{
  margin: 0 5px;
}
.progress{
  margin-top: 20px;
  margin-bottom: 80px;
}


/* 캐러셀 */
.handler-carousel,
.auto-carousel {
  overflow: hidden;
}
.auto-carousel {
  margin-bottom: 55px;  /* 수정 */
}

/* product-title */

.product-title {
  font-family: 'Nanum Gothic';
  margin-bottom: 40px;
}
.product-title h2 {
  font-size: 30px;
  margin-bottom: 8px;
}
.product-title h2.eng {
  font-family: ProximaNova;
}

/* product-wrap */
.product-wrap {
  margin-bottom: 100px;
}
.product-wrap.trending{
  margin-bottom: 0;
}


.product-wrap .col-md-4 img {
  object-fit: cover;
  object-position: center;
  padding-right: 12px;
  padding-right: calc(var(--bs-gutter-x) / 2);
}
@media screen and (-ms-high-contrast: active), (-ms-high-contrast: none) { 
  .product-wrap .col-md-4 img {
    position: absolute;
    transform: translateX(-50%) translateY(-50%);
    top: 50%;
    left: 50%;
    min-width: 100%;
    min-height: 100%;
    width: auto;
    height: auto;
  }
}
.product-wrap:last-child {
  margin-bottom: 140px;
}

/* 수정 */
.product-wrap .col-md-4{
  position: relative;
}
.product-wrap .col-md-4 .img-info{
  position: absolute;
  top: 95px;
  left: 50%;
  text-align: center;
  transform: translateX(-50%);
  color: #fff;
}
.product-wrap .col-md-4 .img-info strong{
  font-weight: 700;
  font-size: 2.25rem;
  letter-spacing: 10px;
  margin-bottom: 5px;
}

.product-wrap .col-md-8 {
  display: flex;
  flex-wrap: wrap;
}
.product-wrap .col{
  width: calc(25% - 1%);
  flex: inherit;
  -ms-flex: inherit;
}   
.product-wrap .col:not(:nth-child(4n+1)){
  margin-left: 1.33333%;
}


.product-img {
  position: relative;
  overflow: hidden;
}
.product-img button {
  background-image: url(../img/main-ico.png);
  background-position: -99px 0;
  width: 43px;
  height: 43px;
  border-radius: 50%;
  position: absolute;
  bottom: 15px;
  right: 13px;
}
.trending-wrap .product-info h3{
  margin-top: 20px;
  margin-bottom: 6px;
  font-family: ProximaNova;
  font-size: 15px;

}
.trending-wrap .product-info h4{
  font-family: 'Nanum Gothic';
  font-size: 15px;
}
.trending-wrap .price-hover {
  width: 100%;
  height: 100%;
  padding: 5%;
  text-align: center;
  position: absolute;
  top: 100%;
  background-color: #e5e4e3;
  transition: 0.3s;
}
.trending-wrap .price-hover p {
  font-family: 'Nanum Gothic';
  font-size: 15px;
  font-weight: bold;
  text-overflow: ellipsis;
  white-space: nowrap;
  overflow: hidden;
}
.trending-wrap .price-hover span {
  font-family: ProximaNova;
  font-size: 13px;
}
.trending-wrap .product-img:hover .price-hover {
  top: 85%;
}


.pagenation {
  margin-top: 30px;
  margin-bottom: 150px;
}
.pagenation .page-link {
  color: #333;
  border-radius: 0 !important;
}