.event24{
  margin: 0 auto;
  background: #FFF;
}

.event24 a{
  display: block;
}
.event24 img{
  object-fit: cover;
  width: 100%;
  height: 100%;
}

.event24 [class^="banner"]:not(.banner7) ul{
  position: absolute;
  left: 50%;
  transform: translateX(-50%);
}

.banner1, .banner3, .banner5, .banner6, .banner7{
  position: relative;
}

/* PC */ 
@media (min-width: 1160px) {
  main{
    padding-top: 0;
  }
  .event24{
    max-width: 1160px;
    padding-top: 90px;
  }

  .banner1 [class^="btn"]{
    width: 114px;
    height: 40px;
    border-radius: 999px;
    position: absolute;
  }
  .banner1 .btn-haven{
    top: 987px;
    left: 51.2%;
  }
  .banner1 .btn-urban{
    top: 1467px;
    left: 39.1%;
  }

  .banner3 ul{
    display: flex;
    column-gap: 14px;
    bottom: 178px;
  }
  .banner3 ul li a{
    border-radius: 26px;
    box-shadow: 8px 8px 8px 0 rgba(0, 0, 0, .08);
  }
  .banner3 ul li:nth-child(1) a{
    width: 202px;
    height: 245px;
  }
  .banner3 ul li:not(:nth-child(1)) a{
    width: 204px;
    height: 248px;
  }

  .banner5 video{
    width: 436px;
    height: 775px;
    border-radius: 36px;
    position: absolute;
    top: 117px;
    left: 96px;
  }

  .banner6 ul{
    display: flex;
    column-gap: 43px;
    bottom: 112px;
  }
  .banner6 ul li{
    width: 462px;
    height: 716px;
    position: relative;
  }
  .banner6 ul li .img-info{
    border-radius: 999px 999px 80px 80px;
    box-shadow: 26px 26px 26px 0 rgba(0, 0, 0, .12);
  }
  .banner6 ul li .img-prod{
    position: absolute;
    top: -90px;
    left: 50%;
    transform: translateX(-50%);
  }
  .banner6 ul li:nth-child(1) .img-prod{
    width: 341px;
    height: 371px;
  }
  .banner6 ul li:nth-child(2) .img-prod{
    width: 86px;
    height: 399px;
  }

  .banner7 .list-group{
    width: 1012px;
    display: flex;
    column-gap: 21px;
    position: absolute;
    top: 503px;
    left: 50%;
    transform: translateX(-50%);
  }
  .banner7 .list-group ul{
    display: flex;
    flex-direction: column;
    row-gap: 36px;
  }
}


/* MO */
@media (max-width: 1159px) {
  .event24{
    max-width: 720px;
    min-width: 280px;
  }

  .banner1 [class^="btn"]{
    width: 17.77778%;
    height: 4%;
    border-radius: 999px;
    position: absolute;
  }
  .banner1 .btn-haven{
    top: 55.99042%;
    left: 51.9%;
  }
  .banner1 .btn-urban{
    top: 83.26%;
    left: 31%;
  }

  .banner3 ul{
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: min(3.61111vw, 26px);
    bottom: min(16.66667vw, 120px);
  }
  .banner3 ul li a{
    width: min(37.22223vw, 268px);
    height: min(42.91667vw, 309px);
    border-radius: min(3.61111vw, 26px);
    box-shadow: min(2.22223vw, 16px) min(2.22223vw, 16px) min(1.11112vw, 8px) 0 rgba(88, 30, 0, 0.16);
  }

  .banner5 video{
    width: min(72.77778vw, 524px);
    height: min(129.30556vw, 931px);
    border-radius: min(6.66667vw, 48px);
    position: absolute;
    top: min(5.97223vw, 43px);
    left: 50%;
    transform: translateX(-50%);
  }

  .banner6 ul{
    width: 100%;
    padding: 0 4.6%;
    display: flex;
    align-items: flex-end;
    justify-content: space-between;
    bottom: 7.53065%;
  }
  .banner6 ul li{
    width: 45.735%;
    position: relative;
  }
  .banner6 ul li .img-info{
    border-radius: 999px 999px 80px 80px;
    box-shadow: 16px 16px 16px 0 rgba(0, 0, 0, .12);
  }
  .banner6 ul li .img-prod{
    position: absolute;
  }
  .banner6 ul li:nth-child(1) .img-prod{
    width: 91%;
    height: 54.89834%;
    top: -35.12015%;
    left: 9%;
  }
  .banner6 ul li:nth-child(2) .img-prod{
    width: 96.66667%;
    height: 58.22551%;
    top: -37.15342%;
    left: 2%;
  }

  .banner7 .list-group{
    width: 100%;
    padding: 0 5.13889%;
    display: flex;
    flex-direction: column;
    position: absolute;
    top: 9.1587%;
    left: 50%;
    transform: translateX(-50%);
  }
  .banner7 .list-group ul{
    padding: 20.12384% 0 9.03174%;
    display: flex;
    flex-direction: column;
  }
  .banner7 .list-group ul + ul{
    margin-top: 12.38391%;
  }
  .banner7 .list-group ul li + li{
    margin-top: 6.81115%;
  }

  .event-share{
    margin: 80px 0;
  }
}