/* BASIC css start */
                #contentWrap {
                    width: 100%;
                    zoom: 1;
                    position: relative;
                    margin: 0 auto 150PX;
                }

                #contentWrap:after {
                    content: "";
                    display: block;
                    clear: both;
                }

                #contentWrap #contents {
                    width: auto !important;
                    max-width: 90%;
                    margin: 0 auto;
                    float: none;

                }

                .gridCampaign {
                    width: 100%;
                    display: flex;
                    flex-wrap: wrap;
                    justify-content: space-between;
                }

                .gridCampaign li img {
                    width: 100%
                }

                .gridCampaign li {
                    width: calc((100% - 30px * 2) / 4);
                    margin-bottom: 20px;
                }


                .gridCampaign li:nth-child(3) {
                    width: calc((100% - 10px * 2) / 2);
                }

                .gridCampaign li:nth-child(20) {
                    width: calc((100% - 10px * 2) / 2);
                }

                .mainTextWrapper {
                    position: relative;
                    height: 300px;
                    display: flex;
                    align-items: center;
                    justify-content: space-evenly;
                    text-align: center;
                    margin: 0 auto;
                    width: 100%;
                }

                .topText {
                    display: flex;
                    flex-direction: column;
                    justify-content: center;
                    width: 100%;
                    max-width: 900px;
                }

                .topText .topTextInner:nth-child(2) {
                    padding-top: 60px;
                }


                .topText .topTextInner .title {
                    font-size: 19px;

                    padding-bottom: 20px;
                    position: relative;
                    display: inline-block;
                    line-height: 1.2;
                    font-family: 'Roboto', sans-serif;
                    font-weight: 600;
                }

                .topText .topTextInner .desc {
                    word-break: break-all;
                    font-size: 13px;
                    font-family: 'Roboto', sans-serif;
                    font-weight: 400;
                    font-style: normal;
                    padding-left: 4px;
                }

                .topText .topTextInner:nth-child(2) .title {
                    transform: translateX(-8px);
                }

                .topText .topTextInner .desc {
                    word-break: break-all;
                    font-size: 13px;
                    font-family: 'Roboto', sans-serif;
                    font-weight: 400;
                    font-style: normal;
                    padding-left: 4px;
                }

                .bottomCamImg img {
                    width: 100%;
                }

                .fadeInUp {
                    transition: all 1s ease;
                    opacity: 0;
                    transform: translateY(30px)
                }

                .animate {
                    transform: translateY(0px);
                    transform: translateX(0px);
                    opacity: 1;
                }
                




.zoom-img {
  cursor: pointer;
   width: 100% !important;  /* gridCampaign ·¹À̾ƿô À¯Áö */
  height: auto;
}

.modal {
  display: none;
  position: fixed;
  z-index: 9999;
  padding-top: 70px;
  left: 0; top: 0;
  width: 100%; height: 100%;
  background: rgba(0,0,0,0.6);
  backdrop-filter: blur(10px);
}

.modal-content {
  display: block;
  margin: auto;
  max-width: 95%;
  max-height: 85%;
}

.close {
  position: absolute;
  top: 20px;
  right: 35px;
  font-size: 40px;
  color: #fff;
  cursor: pointer;
}


.arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  width: 22px;
  height: 22px;
  cursor: pointer;
  font-size: 0;       
  color: transparent; 
}

/* ¿À¸¥ÂÊ (> ) */
.arrow.next {
  right: 50px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: translateY(-50%) rotate(-45deg);
}

/* ¿ÞÂÊ (< ) */
.arrow.prev {
  left: 50px;
  border-right: 2px solid #fff;
  border-bottom: 2px solid #fff;
  transform: translateY(-50%) rotate(135deg);
}

/* BASIC css end */