/* BASIC css start */
body #footer {margin-top:0;}

/* ¸ÞÀιè³Ê */
.mainBanner {margin-bottom:60px;}
.mainBanner .inner ul li a img {width:100%;}
.mainBanner .swiper-button-prev {width:96px; height:96px; left: 8.6%; top: 50%; margin-top: -48px; opacity:0; transition:all .3s ease;}
.mainBanner .swiper-button-next {width:96px; height:96px; right: 8.6%; top: 50%; margin-top: -48px; opacity:0; transition:all .3s ease;}
.mainBanner:hover .swiper-button-prev,
.mainBanner:hover .swiper-button-next {opacity:1;}
.mainBanner .swiper-button-prev:after {font-size:0; background:url(//skin.makeshop.co.kr/skin/fragrance/pc/img/main-left.png)no-repeat center; width:100%; height:100%; background-size:cover; }
.mainBanner .swiper-button-next:after {font-size:0; background:url(//skin.makeshop.co.kr/skin/fragrance/pc/img/main-right.png)no-repeat center; width:100%; height:100%; background-size:cover; }

/* ¸ÞÀÎ ÄÁÅÙÃ÷ */
.main-cont {width:1400px; margin:0 auto;}
.main-cont > div {margin-bottom:100px;}

/* °øÅë */
.sec_title {display:flex; justify-content: space-between; height:24px; align-items:center; margin-bottom:16px;}
.sec_title h2 {font-size:20px; font-weight:500;}
.sec_title a {}
.sec_title a img {margin-left:4px;}

/* sec01 */
.sec01 .prdList ul li .imgWrap img {max-width:220px;}
.sec01 .swiper-button-prev {width:52px; height:52px; left:0; top:35%;}
.sec01 .swiper-button-next {width:52px; height:52px; top: 35%; right: 0;}
.sec01 .swiper-button-prev:after {font-size:0; background:url(//skin.makeshop.co.kr/skin/fragrance/pc/img/slide-left.png)no-repeat center; width:100%; height:100%; background-size:cover; }
.sec01 .swiper-button-next:after {font-size:0; background:url(//skin.makeshop.co.kr/skin/fragrance/pc/img/slide-right.png)no-repeat center; width:100%; height:100%; background-size:cover; }

/* sec02 */
.sec02 .prdList.basic ul {gap:60px 16px;}
.sec02 .prdList.basic ul li {width:338px;}


/* sec03 ¹é±×¶ó¿îµå */
.sec03 {position: relative; padding: 50px 0;}
.sec03::before {content: ""; position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 100vw; height: 100%; background: #f9f9f9; z-index: -1; }


/* sec03 */
.sec03 .keywordTabBtn {margin-bottom:20px;}
.sec03 .keywordTabBtn ul li {display: block; width: auto; font-size: 13px; line-height: 28px; padding: 0 14px; border: 1px solid #ededed; color: var(--txt); border-radius: 40px; cursor:pointer;}
.sec03 .keywordTabBtn ul li.swiper-slide-thumb-active {background: var(--point_color); border: 1px solid var(--point_color); color: #fff; font-weight:600}
.sec03 .swiper-button-prev {width:36px; height:36px; left:0; top:40%;}
.sec03 .swiper-button-next {width:36px; height:36px; top: 40%; right: 0;}
.sec03 .swiper-button-prev:after {font-size:0; background:url(//skin.makeshop.co.kr/skin/fragrance/pc/img/slide-left.png)no-repeat center; width:100%; height:100%; background-size:cover; }
.sec03 .swiper-button-next:after {font-size:0; background:url(//skin.makeshop.co.kr/skin/fragrance/pc/img/slide-right.png)no-repeat center; width:100%; height:100%; background-size:cover; }

/* sec04 */
.sec04 .inner_list{
  display:flex;
  gap:16px;
  align-items:flex-start; /* Ä÷³ À§ÂÊ ±âÁØ Á¤·Ä */
}

/*  3°³ Ä÷³ ÆøÀ» µ¿ÀÏÇÏ°Ô °­Á¦ */
.sec04 .inner_list > div{
  flex: 1 1 0;   /* ÇÙ½É: basis 0À¸·Î µ¿ÀÏ ºÐ¹è */
  min-width: 0;  /* ÅؽºÆ®/À̹ÌÁö ¶§¹®¿¡ Ä÷³ÀÌ Æ¢¾î³ª¿À´Â °Í ¹æÁö */
}

/*  »ó´Ü ¹è³Ê(Å« À̹ÌÁö) ³ôÀ̸¦ ÅëÀÏ (¿øÇÏ´Â ºñÀ²·Î Á¶Àý) */
.sec04 .inner_list .chanceBan{
  border-radius:10px;
  overflow:hidden;
  aspect-ratio: 16 / 9; /* ÇÊ¿äÇϸé 4/3, 1/1 µîÀ¸·Î ¹Ù²ã */
}

.sec04 .inner_list .chanceBan img{
  width:100%;
  height:100%;
  object-fit:cover;
  display:block; /* À̹ÌÁö ¾Æ·¡ ¿©¹é ¹æÁö */
}

/* ±âÁ¸ ³× ÄÚµå À¯Áö + ¾à°£¸¸ ¾ÈÀüÀåÄ¡ */
.sec04 .prdList ul li {margin-top:12px; position:relative;}
.sec04 .prdList ul li a {display:flex; align-items:flex-start;}
.sec04 .prdList ul li a .imgWrap {width:92px; margin-right:20px; flex:0 0 92px;}
.sec04 .prdList ul li a .textWrap {min-width:0;} /* ±ä »óÇ°¸í ÁÙ¹Ù²Þ ¾ÈÁ¤ */
.sec04 .prdList ul li .imgWrap img {border-radius:10px;}


/* ¹è³Ê ÀÚü¸¦ ½ºÅà ±âÁØÀ¸·Î °íÁ¤ */
.sec04 .inner_list .chanceBan{
  position: relative;
  overflow: hidden;
  border-radius: 10px;
  isolation: isolate;          /* <-- ÀÌ°Ô ÇÙ½É: z-index ²¿ÀÓ ¹æÁö */
}

/* À̹ÌÁö: °¡Àå ¾Æ·¡ */
.sec04 .inner_list .chanceBan > img{
  position: relative;
  z-index: 0;
  width:100%;
  height:100%;
  object-fit: cover;
  display:block;
}

/* ±×¶óµ¥À̼Ç: À̹ÌÁö À§, ÅؽºÆ® ¾Æ·¡ */
.sec04 .inner_list .chanceBan::before{
  content:"";
  position:absolute;
  left:0; right:0; bottom:0;
  height:60%;
  background: linear-gradient(to top,
    rgba(0,0,0,0.55),
    rgba(0,0,0,0)
  );
  z-index: 1;
  pointer-events:none;
}

/* ÅؽºÆ®: ¸Ç À§ */
.sec04 .inner_list .chanceBan .chanceTxt{
  position:absolute;
  left:28px;
  bottom:28px;
  z-index: 2;
  color:#fff;
  pointer-events:none;
}

.sec04 .inner_list .chanceBan .chanceTxt strong,
.sec04 .inner_list .chanceBan .chanceTxt span{
  display:block;
  font-size:22px;
  text-shadow: 0 2px 10px rgba(0,0,0,0.35);
}

/* BASIC css end */