@media screen and (max-width: 680px) {
  body {
    min-width: 360px;
  }

  * {
    letter-spacing: -0.5px;
  }

  /* ------------------------------------------------------------------------------- */

  /* 픽스 버튼 */
  .fix-btn {
    height: 81px;
  }
  .fix-btn .inner-wrap {
    box-shadow: 4px 4px 8px 0px #00000040;
  }
  .fix-btn .inner-wrap .con {
    width: 360px;
    padding: 0 24px;
  }
  .fix-btn .inner-wrap .text-img-box {
    width: 164px;
  }
  .fix-btn .inner-wrap .min-btn {
    width: 95px;
    height: 38px;
    border-radius: 2px;
  }
  .fix-btn .inner-wrap .min-btn > .img-box {
    width: 67px;
  }

  /* ------------------------------------------------------------------------------- */

  /* 메인 비주얼 영역 */
  .main-visual-area {
    height: 649px;
    padding-top: 81px;
  }

  .main-visual-area .con {
    max-width: 360px;
  }

  .main-visual-area .bg-box {
    width: 492px;
  }

  .main-visual-area .ef-box-1 {
    width: 154px;
    top: -13px;
    left: -66px;
  }
  .main-visual-area .ef-box-2 {
    width: 183px;
    top: 300px;
    right: -97px;
  }

  .main-visual-area .frame-box {
    width: 348px;
    top: 50px;
  }

  .main-visual-area .cnt-area {
    top: 80px;
    width: 238px;
  }

  .main-visual-area .cnt-area .stamp-1 {
    width: 52px;
  }
  .main-visual-area .cnt-area .main-title {
    margin-bottom: 4px;
  }

  .main-visual-area .cnt-area .line {
    height: 0.4px;
    margin: 12px 0;
  }

  /* 3. 컨텐츠 박스 및 내부 레이아웃 */
  .main-visual-area .cnt-area .cont-title-1 {
    width: 124px;
  }

  /* 4. 카드 상세 흰색 테두리 박스 */
  .main-visual-area .cnt-area .card-detail-white {
    background-color: #ffffff;
    padding: 20px 18px 16px 18px;
    box-shadow: 1px 1px 1px 0px #00000040 inset;
    margin-top: 7px;
  }

  .main-visual-area .cnt-area .cont-title-2 {
    width: 71px;
  }

  .main-visual-area .cnt-area .card-happy {
    width: 116px;
    margin-top: 14px;
  }

  /* 5. 텍스트 스타일링 */
  .main-visual-area .cnt-area .card-benefit-list {
    margin-top: 14px;
    gap: 2px;
  }
  .main-visual-area .cnt-area .card-benefit-list li {
    font-size: 11px;
    line-height: 15px;
    letter-spacing: -0.7px;
    padding-left: 6px;
  }
  .main-visual-area .cnt-area .card-benefit-list li::before {
    width: 2px;
    height: 2px;
    left: 0;
    top: 6.5px;
  }
  .main-visual-area .cnt-area .txt-green {
    letter-spacing: -0.7px;
  }

  .main-visual-area .cnt-area .card-condition-txt {
    font-size: 10px;
    line-height: 14px;
    margin-top: 6px;
  }

  /* 6. 보기 버튼 스타일 */
  .main-visual-area .cnt-area button {
    width: 68px;
    height: 32px;
    border-radius: 2px;
    margin-top: 14px;
  }
  .main-visual-area .cnt-area button > .img-box {
    width: 40px;
  }

  /* 7. 최하단 안내 문구 */
  .main-visual-area .cnt-area .bottom-notice-txt {
    grid-template-columns: 10px 1fr;
    margin-top: 12px;
  }
  .main-visual-area .cnt-area .bottom-notice-txt > span {
    font-size: 10px;
    line-height: 14px;
  }

  /* ------------------------------------------------------------------------------- */

  /* 컨텐츠 영역-1 */
  .cnt-area-1 {
    padding: 44px 0;
  }
  .cnt-area-1 .con {
    max-width: 360px;
    padding: 0 22px;
  }

  .cnt-area-1 .event-detail-card {
    box-shadow: 0px 4px 7px 0px #00000040;
    padding: 26px 24px;
  }

  .cnt-area-1 .event-section {
    margin-bottom: 20px;
  }

  .cnt-area-1 .section-title {
    width: 124px;
    margin-bottom: 8px;
  }

  .cnt-area-1 .main-desc {
    font-size: 14px;
    line-height: 18px;
  }
  .cnt-area-1 .main-desc > span.mini {
    font-size: 13px;
    line-height: 18px;
  }

  .cnt-area-1 .important-list {
    gap: 2px;
  }
  .cnt-area-1 .important-list > li {
    font-size: 11px;
    line-height: 16px;
    padding-left: 13px;
  }
  .cnt-area-1 .important-list > li::before {
    font-size: 11px;
    line-height: 16px;
  }

  .cnt-area-1 .sub-list {
    gap: 4px;
  }
  .cnt-area-1 .sub-list > li {
    font-size: 11px;
    line-height: 16px;
    padding-left: 7px;
  }
  .cnt-area-1 .sub-list > li::before {
    top: 2px;
    font-size: 11px;
    line-height: 16px;
  }

  .cnt-area-1 .notice-list {
    gap: 2px;
  }
  .cnt-area-1 .notice-list > li {
    font-size: 11px;
    line-height: 1.3;
    padding-left: 7px;
  }
  .cnt-area-1 .notice-list > li::before {
    font-size: 11px;
    line-height: 1.3;
  }
  .cnt-area-1 .notice-list .notice-sub-list {
    margin-top: 2px;
  }
  .cnt-area-1 .notice-list .notice-sub-list > li {
    gap: 1px;
    font-size: 10px;
    line-height: 14px;
  }
  .cnt-area-1 .notice-list .notice-sub-list > li > .text-1 {
    min-width: 13px;
  }

  .cnt-area-1 .method-item {
    margin-bottom: 8px;
  }
  .cnt-area-1 .method-item .item-title {
    gap: 4px;
  }
  .cnt-area-1 .method-item .item-title .num {
    min-width: 14px;
    font-size: 14px;
    line-height: 18px;
  }
  .cnt-area-1 .method-item .item-list {
    padding: 0 0 0 18px;
    margin-top: 6px;
  }

  .cnt-area-1 .num-list {
    gap: 2px;
  }
  .cnt-area-1 .num-list > li {
    gap: 2px;
  }
  .cnt-area-1 .num-list > li > img {
    width: 14px;
    height: 15px;
  }

  .cnt-area-1 .img-area {
    row-gap: 6px;
  }

  .cnt-area-1 button {
    width: 131px;
    height: 32px;
    border-radius: 2px;
  }
  .cnt-area-1 button > .img-box {
    width: 103px;
  }

  .cnt-area-1 .drop-down-box {
    border-radius: 4px;
  }
  .cnt-area-1 .drop-down-box .top-box {
    padding-top: 14px;
    padding-right: 16px;
    padding-bottom: 12px;
    padding-left: 12px;
  }
  .cnt-area-1 .drop-down-box .top-box > h5 {
    font-size: 11px;
    line-height: 1.3;
  }
  .cnt-area-1 .drop-down-box .top-box > .img-box {
    width: 16px;
  }
  .cnt-area-1 .drop-down-box .bottom-box {
    padding-top: 12px;
    padding-right: 14px;
    padding-bottom: 16px;
    padding-left: 8px;
  }
  .cnt-area-1 .drop-down-box .bottom-box > ul > li {
    font-size: 10px;
    line-height: 14px;  
    padding-left: 14px;
  }
  .cnt-area-1 .drop-down-box .bottom-box > ul > li::before {
    left: 5.5px;
    top: 5.5px;
    width: 3px;
    height: 3px;
  }

  /* 이미지 영역 */
  .cnt-area-1 .event-hero-image-1 {
    padding: 0 39px 22px 39px;
  }
  .cnt-area-1 .event-hero-image-1 > .img-box-1 {
    width: 54px;
  }
  .cnt-area-1 .event-hero-image-1 > .img-box-2 {
    margin-top: 10px;
  }
  .cnt-area-1 .event-hero-image-1 > .img-box-3 {
    width: 189.49px;
    margin-top: 8px;
  }

  .cnt-area-1 .event-hero-image-2 {
    padding: 0 26px 22px 26px;
    margin-top: 38px;
  }
  .cnt-area-1 .event-hero-image-2 > .img-box-1 {
    width: 54px;
  }
  .cnt-area-1 .event-hero-image-2 > .img-box-2 {
    width: 162.49px;
    margin-top: 10px;
  }
  .cnt-area-1 .event-hero-image-2 > .img-box-3 {
    width: 264px;
    margin-top: 8px;
  }

  /* 참여대상 */
  .cnt-area-1 .event-detail-card-1 .event-section-1 .important-list {
    margin-top: 6px;
  }

  /* 참여방법 */
  .cnt-area-1 .event-detail-card-1 .event-section-2 .method-item-2 .num-list {
    margin-top: 6px;
  }
  .cnt-area-1 .event-detail-card-1 .event-section-2 .method-item-3 .section-title-2 {
    margin-top: 8px;
  }
  .cnt-area-1 .event-detail-card-1 .event-section-2 .method-item-3 .img-area {
    padding-right: 18px;
    margin-top: 18px;
  }
  .cnt-area-1 .event-detail-card-1 .event-section-2 .method-item-3 button {
    margin-top: 18px;
  }

  /* 캐시백 혜택지급 필수 유의사항 */
  .cnt-area-1 .event-detail-card-1 .event-section-3 .drop-down-box {
    margin-top: 6px;
  }

  /* 혜택지급 롯데카드에서 지급 */
  .cnt-area-1 .event-detail-card-1 .event-section-4 .method-item {
    margin-bottom: 2px;
  }

  /* 쿠폰 번호 제공 */
  .cnt-area-1 .event-detail-card-2 .event-section-1 .important-list {
    margin-top: 2px;
  }

  /* 제공 쿠폰 유의사항 */
  .cnt-area-1 .event-detail-card-2 .event-section-2 .sub-list {
    gap: 2px;
  }

  /* ------------------------------------------------------------------------------- */

  /* 컨텐츠 영역-3 */
  .cnt-area-3 {
    padding: 32px 0 64px 0;
  }
  .cnt-area-3 .con {
    padding: 0 12px;
  }
  .cnt-area-3 .title-box {
    gap: 6px;
    margin-top: 25px;
    margin-bottom: 25px;
  }
  .cnt-area-3 .title-box .img-box {
    width: 22px;
  }
  .cnt-area-3 .title-box h1 {
    font-size: 16px;
    line-height: 20px;
  }
  .cnt-area-3 .text-area {
    gap: 24px;
  }
  .cnt-area-3 .text-area > li > h2 {
    font-size: 13px;
    line-height: 18px;
  }
  .cnt-area-3 .text-area > li .text-box > li {
    padding-left: 20px;
    font-size: 13px;
    line-height: 18px;
  }
  .cnt-area-3 .text-area > li .text-box > li > br {
    display: block;
  }
  .cnt-area-3 .text-area > li .text-box > li:not(.text-ef-1):after {
    width: 3px;
    height: 3px;
    top: 7.5px;
    left: 8.5px;
  }
  .cnt-area-3 .text-area > li .text-box > li.text-ef-1::after {
    font-size: 13px;
    line-height: 18px;
    left: 4px;
  }
  .cnt-area-3 .text-area > li .text-box > li .sub-text-box > li {
    padding-left: 12px;
  }
}