/* BASIC css start */
#copythat{position:realtive;}

#copythat .map-link{position:absolute}

#copythat .link-pc-01 {
    top: 25.7%;
    left: 31.3%;
    width: 19%;
    height: 20.5%;
}
#copythat .link-pc-02 {
    top: 25.7%;
    right: 31.3%;
    width: 17%;
    height: 20.5%;
}

/* -----------------------------------------
   [Mobile 버전] 브레이크포인트 대응
-------------------------------------------- */
@media (max-width: 1024px) {
  #copythat .link-mo-01 {
        bottom: 72.8%;
        left: 26%;
        width: 48%;
        height: 13.8%;
  }
  
  #copythat .link-mo-02 {
        bottom: 50.2%;
        left: 26%;
        width: 48.2%;
        height: 13.9%;
  }
}
  
  
  
/* ── PICTURE BANNER ── */
.responsive-banner:not(.copythat) {
    display: block;
    width: 100%;
    line-height: 0;
}

.responsive-banner:not(.copythat) img {
    max-width: 100%;
    height: auto;
    display: block;
    margin: auto;
}
  
  
@media (max-width: 1024px) {
    .responsive-banner:not(.copythat) img {max-width: unset; width:100%}
}




/* 이미지맵을 포함하는 배너 컨테이너 */
.responsive-banner:not(.copythat).has-imagemap {
  position: relative;
  display: block;
  width: 100%;
  margin-bottom: 150px;
}

/* 투명 링크 공통 스타일 */
.responsive-banner:not(.copythat) .map-link {
  position: absolute;
  display: block;
  text-indent: -9999px;
  background: rgba(255, 0, 0, 0);
  z-index: 5;
}


/* -----------------------------------------
   [PC 버전] 좌표 설정 (기본 노출, 모바일 숨김)
-------------------------------------------- */
.responsive-banner:not(.copythat) .pc-only { display: block; }
.responsive-banner:not(.copythat) .mo-only { display: none; }

/* 1번 링크 좌표 예시 (PC 이미지 기준 비율) */
.responsive-banner:not(.copythat) .link-pc-01 {
    top: 23.7%;
    left: 31.8%;
    width: 18.2%;
    height: 12.5%;
}

/* 2번 링크 좌표 예시 */
.responsive-banner:not(.copythat) .link-pc-02 {
    top: 23.7%;
    right: 31.5%;
    width: 16.5%;
    height: 12.5%;
}

/* -----------------------------------------
   [Mobile 버전] 브레이크포인트 대응
-------------------------------------------- */
@media (max-width: 1024px) {
  /* PC 링크 숨기고 모바일 링크 켜기 */
  .responsive-banner:not(.copythat) .pc-only { display: none; }
  .responsive-banner:not(.copythat) .mo-only { display: block; }

  /* 모바일 이미지 기준 비율로 1번 링크 좌표 설정 */
  .responsive-banner:not(.copythat) .link-mo-01 {
        bottom: 18.8%;
        left: 26%;
        width: 48%;
        height: 2.8%;
  }
  
  /* 모바일 이미지 기준 비율로 2번 링크 좌표 설정 */
  .responsive-banner:not(.copythat) .link-mo-02 {
        bottom: 14.2%;
        left: 26%;
        width: 48.2%;
        height: 2.9%;
  }
}

/* BASIC css end */