

:root {
  --emoji-base-color: #ffda6a;
  --emoji-like-color: #548dff;
  --emoji-love-color: #f55064;
  --emoji-angry-color: #d5234c;
  --emoji-white-color: #ffffff;
  --emoji-black-color: #000000;
  --emoji-text-color: #8a8a8a;
  --event_point_color: #FDFF91;
  --event_box_shadow: 12px 14px 40px 0px rgba(50, 170, 115, 0.10), 47px 56px 73px 0px rgba(50, 170, 115, 0.09), 106px 127px 99px 0px rgba(50, 170, 115, 0.05), 188px 226px 118px 0px rgba(50, 170, 115, 0.01), 294px 353px 129px 0px rgba(50, 170, 115, 0.00);
}
/* desktop */
@media (min-width: 961px) {
  :root {
    --event_padding: 48px;
  }
  .hidden_pc {
    display: none !important;
  }
}
/* mobile */
@media (max-width: 960px) {
  :root {
    --event_padding: 20px;
  }
  .hidden_mo {
    display: none !important;
  }
}
ul {
  list-style: none;
}
.event_24upgrade .event_inner {
  position: relative;
  width: 100%;
  margin: 0 auto;
  z-index: 2;
}
.event_24upgrade ._noise {
  position: relative;
  overflow: hidden;
}
.event_24upgrade ._noise::before {
  position: absolute;
  top: 50%;
  left: 50%;
  width: 100%;
  height: 100%;
  transform: translate(-50%, -50%);
  mix-blend-mode: soft-light;
  display: block;
  content: '';
  z-index: 1;
}
.event_24upgrade .event_title {
  letter-spacing: -1px;
  font-weight: 700;
}
.event_24upgrade .bt_base {
  height: 56px;
  color: #fff;
  line-height: 170%;
  font-weight: 600;
  border-radius: 8px;
  background-color: #222;
  display: inline-flex;
  align-items: center;
}
.event_24upgrade .bt_base::after {
  width: 24px;
  height: 24px;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='25' height='24' viewBox='0 0 25 24' fill='none'%3E%3Cmask id='mask0_376_83' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='25' height='24'%3E%3Crect x='0.5' width='24' height='24' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_376_83)'%3E%3Cpath d='M13.1 12L8.5 7.4L9.9 6L15.9 12L9.9 18L8.5 16.6L13.1 12Z' fill='%23ffffff'/%3E%3C/g%3E%3C/svg%3E");
  display: block;
  content: '';
}
.event_24upgrade .swiper-pagination {
  position: relative;
  bottom: auto;
  font-size: 0;
}
.event_24upgrade .swiper-pagination .swiper-pagination-bullet {
  margin: 0 4px;
  background-color: #fff;
  opacity: .2;
}
.event_24upgrade .swiper-pagination .swiper-pagination-bullet.swiper-pagination-bullet-active {
  opacity: 1;
}

.required-check-box > ul > li > label.for-round-check-box {
  top: -10px;
}
.required-check-box > ul > li > label.for-round-check-box:after {
  width: 4px;
  height: 8px;
}
.closeBtn {
  cursor: pointer;
}

/* contents */
.upgrade_visual {
  position: relative;
  overflow: hidden;
}
.upgrade_visual::after {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  display: block;
  content: '';
}
.upgrade_visual b {
  color: #FEF675;
}
.upgrade_visual .event_inner {
  position: relative;
}
.visual_content {
  color: #fff;
}
.visual_content > sup {
  line-height: 170%;
  font-weight: 600;
}
.visual_content > h2 {
  color: inherit;
}
.visual_content > p {
  line-height: 140%;
  font-weight: 500;
  letter-spacing: -1px;
}
.visual_content > p b {
  font-weight: 500;
}
.visual_content > dl {
  line-height: 170%;
  font-weight: 400;
  display: flex;
  flex-wrap:  wrap;
}
.visual_content dt {
  font-weight: 700;
}

.visual_animate {
  display: flex;
  flex: 0 1 auto;
  align-items: center;
  /* gap: 0 min(10.72%, 72px); */
}
.visual_animate .icon_arrow {
  height: 40px;
  display: flex;
  justify-content: center;
  flex: 1;
}
.visual_animate .icon_arrow > span,
.visual_animate .icon_arrow::before,
.visual_animate .icon_arrow::after {
  width: 15px; 
  height: 40px;
  background: url('/wp-content/themes/fastfive/assets/event/240226_upgrade/img/visual_arrow.svg') center center no-repeat;
  background-size: contain;
  display: inline-block;
  opacity: 0;
  animation: process_arr 2s ease-in-out infinite;
}
.visual_animate .icon_arrow::before,
.visual_animate .icon_arrow::after {
  content: '';  
}
.visual_animate .icon_arrow::before {animation-delay: -.6s;}
.visual_animate .icon_arrow > span {animation-delay: -.3s; }
@keyframes process_arr {
  0% {opacity: 0;}
  20% {opacity: 1;}
  60% {opacity: 1;}
  80% {opacity: 0;}
}

.visual_animate .emoji {
  position: absolute;
  top: 0;
  left: 50%;
  transform: translateX(-50%) translateY(-50%) scale(.8);
  z-index: 2;
}
.visual_animate figure {
  position: relative;
  border-radius: 4px;
  display: block;
  overflow: hidden;
  -webkit-backface-visibility: hidden;
  -moz-backface-visibility: hidden;
  -webkit-transform: translate3d(0, 0, 0);
  -moz-transform: translate3d(0, 0, 0);
}
.visual_animate .img_floor {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 1;
  animation: imageFade 6s ease infinite;
}
.visual_animate .before,
.visual_animate .after {
  position: relative;
  width: min(44.64%, 300px);
}

.upgrade_benefit .event_inner {
  display: flex;
}
.upgrade_benefit h3 {
  line-height: 140%;
  letter-spacing: -1px;
  font-weight: 700;
  color: #222;
}
.upgrade_benefit h3 > b {
  color: #37B27E;
}
.upgrade_benefit ul {
  display: flex;
  flex-direction: column;
}
.upgrade_benefit li {
  position: relative;
  width: 100%;
  border-radius: 4px;
  box-shadow: var(--event_box_shadow);
  overflow: hidden;
}
.upgrade_benefit li::after {
  position: absolute;
  background-size: contain !important;
  display: block;
  content: '';
}
.upgrade_benefit li div {
  position: relative;
  line-height: 140%;
  letter-spacing: -1px;
  font-weight: 700;
  color: #222;
}
.upgrade_benefit li h4 {
  line-height: 140%;
  font-weight: 700;
  color: #37B27E;
}
.upgrade_benefit li p {
  line-height: 170%;
  font-weight: 500;
  color: #222;
  opacity: .5;
}
.upgrade_benefit li.card_1 {
  background: var(--event_point_color);
}
.upgrade_benefit li.card_2 {
  background-color: #fff;
}
.upgrade_benefit li.card_3 {
  background-color: #37B27E;
}
.upgrade_benefit li.card_1::after {
  background: url('/wp-content/themes/fastfive/assets/event/240226_upgrade/img/benefit_icon_1.png') center center no-repeat;
}
.upgrade_benefit li.card_3::after {
  background: url('/wp-content/themes/fastfive/assets/event/240226_upgrade/img/benefit_icon_3.png') center center no-repeat;

}
.upgrade_benefit li.card_3 div,
.upgrade_benefit li.card_3 p {
  color: #fff;
}
.upgrade_benefit li.card_3 h4 {
  color: var(--event_point_color);
}
.upgrade_benefit li.card_1::after {
  background: url('/wp-content/themes/fastfive/assets/event/240226_upgrade/img/benefit_icon_1.png') center center no-repeat;
}
.upgrade_benefit li.card_3::after {
  background: url('/wp-content/themes/fastfive/assets/event/240226_upgrade/img/benefit_icon_3.png') center center no-repeat;
}

.upgrade_benefit_photo {
  color: #fff;
  text-align: center;
  background-color: #222;
}
.upgrade_benefit_photo h3, 
.upgrade_benefit_photo h4 {
  color: #fff;
}
.upgrade_benefit_photo h3 > b {
  color: var(--event_point_color);
}
.upgrade_photo {
  position: relative;
  width: 100%;
  display: flex;
  flex-direction: column;
  align-items: center;
}
.upgrade_photo .upgrade_swiper {
  position: relative;
  width: 100%;
  overflow: hidden;
}
.upgrade_photo .upgrade_swiper figcaption {
  color: #fff;
}
.upgrade_photo .upgrade_swiper figcaption h4 {
  line-height: 170%;
  font-weight: 700;
  display: flex;
  justify-content: center;
  align-items: center;
}
.upgrade_photo .upgrade_swiper figcaption h4::before,
.upgrade_photo .upgrade_swiper figcaption h4::after {
  width: 22px;
  height: 22px;
  background: url('/wp-content/themes/fastfive/assets/event/240226_upgrade/img/icon_flower.svg') center center no-repeat;
  background-size: contain;
  display: inline-block;
  content: '';
}
.upgrade_photo .upgrade_swiper figcaption p {
  margin-top: 8px;
  line-height: 170%;
  font-weight: 400;
}
.upgrade_photo .upgrade_swiper img {
  border-radius: 4px;
  overflow: hidden;
}

.upgrade_example {
  position: relative;
  text-align: center;
  overflow: hidden;
}
.upgrade_example._noise::before {
  z-index: 3;
}
.upgrade_example::after {
  position: absolute;
  left: 50%;
  display: block;
  content: '';
  /* 이미지 용량 때문에 1배수 */
}
.upgrade_example .event_title {
  color: #fff;
}
.upgrade_example .event_title > b {
  color: var(--event_point_color);
}
.upgrade_example img {
  width: 100%;
}
.example_content {
  display: flex;
}
.example_content figcaption > b {
  color: #37B27E;
}
.ex_upgrade,
.ex_sale {
  line-height: 140%;
  letter-spacing: -1px;
  font-weight: 700;
  border-radius: 4px;
  box-shadow: 0px 23px 51px 0px rgba(0, 0, 0, 0.10), 0px 92px 92px 0px rgba(0, 0, 0, 0.09), 0px 208px 125px 0px rgba(0, 0, 0, 0.05), 0px 370px 148px 0px rgba(0, 0, 0, 0.01), 0px 578px 162px 0px rgba(0, 0, 0, 0.00);
  display: flex;
  align-items: center;
  overflow: hidden;
}
.ex_upgrade {
  width: 100%;
  text-align: center;
  background-color: #fff;
}
.ex_upgrade img {
  width: 100%;
}
.ex_sale {
  position: relative;
  background-color: #222;
}
.ex_sale img {
  width: 100%;
}
.ex_sale figcaption {
  color: #fff;
}
.ex_plus {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='52' height='52' viewBox='0 0 52 52' fill='none'%3E%3Cmask id='mask0_270_1701' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='52' height='52'%3E%3Crect width='52' height='52' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_270_1701)'%3E%3Cpath d='M24.3743 27.625H13.541C13.0806 27.625 12.6947 27.4692 12.3832 27.1576C12.0717 26.846 11.916 26.4599 11.916 25.9993C11.916 25.5387 12.0717 25.1528 12.3832 24.8417C12.6947 24.5306 13.0806 24.3751 13.541 24.3751H24.3743V13.5417C24.3743 13.0813 24.5301 12.6954 24.8417 12.3839C25.1533 12.0725 25.5394 11.9167 26 11.9167C26.4606 11.9167 26.8465 12.0725 27.1576 12.3839C27.4687 12.6954 27.6242 13.0813 27.6242 13.5417V24.3751H38.4576C38.918 24.3751 39.3039 24.5309 39.6154 24.8424C39.9268 25.154 40.0826 25.5401 40.0826 26.0007C40.0826 26.4614 39.9268 26.8472 39.6154 27.1583C39.3039 27.4694 38.918 27.625 38.4576 27.625H27.6242V38.4583C27.6242 38.9187 27.4685 39.3047 27.1569 39.6161C26.8453 39.9276 26.4592 40.0833 25.9986 40.0833C25.538 40.0833 25.1521 39.9276 24.841 39.6161C24.5299 39.3047 24.3743 38.9187 24.3743 38.4583V27.625Z' fill='%231C1B1F'/%3E%3C/g%3E%3C/svg%3E");
  background-repeat: no-repeat;
}
.example_etc {
  width: 100%;
  line-height: 170%;
  font-weight: 400;
  color: #222;
}

.upgrade_recommend {
  text-align: center;
  background-color: var(--event_point_color);
}
.upgrade_recommend ul {
  display: flex;
  flex-direction: column;
}
.upgrade_recommend li {
  background-color: #fff;
  box-shadow: var(--event_box_shadow);
  display: flex;
}
.upgrade_recommend dl {
  position: relative;
  width: 100%;
  line-height: 140%;
  display: flex;
  flex-direction: column;
}
.upgrade_recommend dt {
  font-weight: 700;
  color: #222;
}
.upgrade_recommend dd {
  position: relative;
  font-weight: 500;
  color: #37B27E;
}
.upgrade_recommend dd > p {
  box-shadow: inset 0 -12px 0 var(--event_point_color);
  display: inline;
}
.upgrade_recommend dd::before {
  position: absolute;
  display: block;
  content: '';
}

.upgrade_save {
  text-align: center;
  background-color: #FBFFEB;
}
.upgrade_save .event_title > b {
  color: #37B27E;
}
.save_content {
  display: flex;
}
.save_content figure {
  position: relative;
  background-color: #fff;
  border-radius: 4px;
  overflow: hidden;
  box-shadow: var(--event_box_shadow);
}
.save_content figure::after {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  mix-blend-mode: soft-light;
  display: block;
  content: '';
  z-index: 1;
}
.save_content figcaption {
  line-height: 140%;
  font-weight: 700;
  color: #222;
}
.save_content figcaption > b {
  color: #37B27E;
}

.upgrade_review {
  background-color: #37B27E;
}
.upgrade_review .event_title {
  color: #fff;
  text-align: center;
}
.review_content {
  position: relative;
  margin: 0 auto;
}
.review_swiper {
  position: relative;
  width: 100%;
  background-color: #fff;
  border-radius: 8px;
  overflow: hidden;
  box-shadow: 0px 23px 51px 0px rgba(0, 0, 0, 0.10), 0px 92px 92px 0px rgba(0, 0, 0, 0.09), 0px 208px 125px 0px rgba(0, 0, 0, 0.05), 0px 370px 148px 0px rgba(0, 0, 0, 0.01), 0px 578px 162px 0px rgba(0, 0, 0, 0.00);
  display: flex;
}
.upgrade_review .swiper-wrapper {
  flex: 1;
}
.upgrade_review .swiper-slide {
  height: auto;
  display: flex;
}
.upgrade_review .swiper-slide figure {
  display: flex;
  flex-direction: column;
  justify-content: center;
}
.upgrade_review .swiper-slide figcaption {
  line-height: 170%;
  font-weight: 400;
  color: #6D757C;
  display: flex;
  justify-content: center;
  align-items: center;
}
.upgrade_review .swiper-slide figcaption strong {
  font-weight: 700;
  color: #222;
  display: inline-flex;
  background-color: #f1f4f8;
  border-radius: 4px;
  align-items: center;
}
.upgrade_review .swiper-slide dl {
  width: 100%;
  display: flex;
  flex-direction: column;
}
.upgrade_review .swiper-slide dt {
  line-height: 140%;
  font-weight: 700;
  color: #222;
}
.upgrade_review .swiper-slide dd {
  line-height: 170%;
  font-weight: 400;
  color: #222;
  display: flex;
  flex-direction: column;
}
.upgrade_review .swiper-slide dd > p {
  font-size: inherit;
  line-height: inherit;
  font-weight: inherit ;
  color: inherit;
}

.upgrade_special {
  background-color: #222;
}
.upgrade_special .event_inner {
  display: flex;
  flex-direction: column;
  align-items: center;
}
.upgrade_special .event_title {
  color: #fff;
}
.upgrade_special .btn_group {
  margin-top: 0 !important;
}
.upgrade_special .bt_base {
  color: #222;
  background-color: #37B27E;
}
.upgrade_special .bt_base::after {
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='25' height='24' viewBox='0 0 25 24' fill='none'%3E%3Cmask id='mask0_376_83' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='25' height='24'%3E%3Crect x='0.5' width='24' height='24' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_376_83)'%3E%3Cpath d='M13.1 12L8.5 7.4L9.9 6L15.9 12L9.9 18L8.5 16.6L13.1 12Z' fill='%23222222'/%3E%3C/g%3E%3C/svg%3E");
}

.emoji {
  position: relative;
  width: 120px;
  height: 120px;
  background: var(--emoji-base-color);
  display: inline-block;
  border-radius: 50%;
}
.emoji:after {
  position: absolute;
  bottom: -40px;
  font-size: 18px;
  width: 60px;
  left: calc(50% - 30px);
  color: var(--emoji-text-color);
}
.emoji__face,
.emoji__eyebrows,
.emoji__eyes,
.emoji__mouth,
.emoji__tongue {
  position: absolute;
}
.emoji__face:before,
.emoji__face:after,
.emoji__eyebrows:before,
.emoji__eyebrows:after,
.emoji__eyes:before,
.emoji__eyes:after,
.emoji__mouth:before,
.emoji__mouth:after,
.emoji__tongue:before,
.emoji__tongue:after {
  position: absolute;
  content: '';
}
.emoji__face {
  width: inherit;
  height: inherit;
}
.emoji--haha .emoji__face {
  animation: haha-face 2s linear infinite;
}
.emoji--haha .emoji__eyes {
  width: 26px;
  height: 6px;
  border-radius: 2px;
  left: calc(50% - 13px);
  top: 35px;
  transform: rotate(20deg);
  background: transparent;
  box-shadow: -25px 5px 0 0 var(--emoji-black-color), 25px -5px 0 0 var(--emoji-black-color);
}
.emoji--haha .emoji__eyes:after {
  left: 0;
  top: 0;
  width: 26px;
  height: 6px;
  border-radius: 2px;
  transform: rotate(-40deg);
  background: transparent;
  box-shadow: -25px -5px 0 0 var(--emoji-black-color), 25px 5px 0 0 var(--emoji-black-color);
}
.emoji--haha .emoji__mouth {
  width: 80px;
  height: 40px;
  left: calc(50% - 40px);
  top: 50%;
  background: var(--emoji-black-color);
  border-radius: 0 0 40px 40px;
  overflow: hidden;
  z-index: 1;
  animation: haha-mouth 2s linear infinite;
}
.emoji--haha .emoji__tongue {
  width: 70px;
  height: 30px;
  background: var(--emoji-love-color);
  left: calc(50% - 35px);
  bottom: -10px;
  border-radius: 50%;
}
.emoji--sad .emoji__face {
  animation: sad-face 2s ease-in infinite;
}
.emoji--sad .emoji__eyebrows {
  left: calc(50% - 3px);
  top: 35px;
  height: 6px;
  width: 6px;
  border-radius: 50%;
  background: transparent;
  box-shadow: -40px 9px 0 0 var(--emoji-black-color), -25px 0 0 0 var(--emoji-black-color), 25px 0 0 0 var(--emoji-black-color), 40px 9px 0 0 var(--emoji-black-color);
}
.emoji--sad .emoji__eyebrows:before,
.emoji--sad .emoji__eyebrows:after {
  width: 30px;
  height: 20px;
  border: 6px solid var(--emoji-black-color);
  box-sizing: border-box;
  border-radius: 50%;
  border-bottom-color: transparent;
  border-left-color: transparent;
  border-right-color: transparent;
  top: 2px;
  left: calc(50% - 15px);
}
.emoji--sad .emoji__eyebrows:before {
  margin-left: -30px;
  transform: rotate(-30deg);
}
.emoji--sad .emoji__eyebrows:after {
  margin-left: 30px;
  transform: rotate(30deg);
}
.emoji--sad .emoji__eyes {
  width: 14px;
  height: 16px;
  left: calc(50% - 7px);
  top: 50px;
  border-radius: 50%;
  background: transparent;
  box-shadow: 25px 0 0 0 var(--emoji-black-color), -25px 0 0 0 var(--emoji-black-color);
}
.emoji--sad .emoji__eyes:after {
  background: var(--emoji-like-color);
  width: 12px;
  height: 12px;
  margin-left: 6px;
  border-radius: 0 100% 40% 50% / 0 50% 40% 100%;
  transform-origin: 0% 0%;
  animation: tear-drop 2s ease-in infinite;
}
.emoji--sad .emoji__mouth {
  width: 60px;
  height: 80px;
  left: calc(50% - 30px);
  top: 80px;
  box-sizing: border-box;
  border: 6px solid var(--emoji-black-color);
  border-radius: 50%;
  border-bottom-color: transparent;
  border-left-color: transparent;
  border-right-color: transparent;
  background: transparent;
  animation: sad-mouth 2s ease-in infinite;
}
.emoji--sad .emoji__mouth:after {
  width: 6px;
  height: 6px;
  background: transparent;
  border-radius: 50%;
  top: 4px;
  left: calc(50% - 3px);
  box-shadow: -18px 0 0 0 var(--emoji-black-color), 18px 0 0 0 var(--emoji-black-color);
}


/* desktop */
@media (min-width: 961px) {
  .event_24upgrade .event_inner {
    max-width: 1376px;
    padding: 180px var(--event_padding);
  }
  .event_24upgrade ._noise::before {
    background: url('/wp-content/themes/fastfive/assets/event/240226_upgrade/img/noise_bg.png') center center no-repeat;
    background-size: cover;
  }
  .event_24upgrade .event_title {
    font-size: 40px;
    line-height: 140%;
  }
  .event_24upgrade .btn_group {
    margin-top: 60px;
  }
  .event_24upgrade .bt_base {
    padding: 0 48px;
    font-size: 18px;
  }

  .upgrade_visual::after {
    width: 3204px;
    height: 1994px;
    margin: 95px 0 0 40px;
    background: url('/wp-content/themes/fastfive/assets/event/240226_upgrade/img/visual_bg.svg') center center no-repeat;
    background-size: 3204px auto;
  }
  .upgrade_visual .btn_group {
    margin-top: 36px;
  }
  .upgrade_visual .event_inner {
    padding: 130px 48px 122px;
    display: flex;
    gap: 0 min(7.8%, 72px);
  }
  .visual_content {
    width: 430px;
  }
  .visual_content > sup {
    font-size: 20px;
  }
  .visual_content > h2 {
    margin-top: 8px;
    font-size: 60px;
    line-height: 130%;
    font-weight: 800;
  }
  .visual_content > p {
    margin-top: 8px;
    font-size: 34px;
  }
  .visual_content > dl {
    margin-top: 33px;
    font-size: 16px;
    gap: 4px 0;
  }
  .visual_content dt {
    width: 36px;
  }
  .visual_content dd {
    width: calc(100% - 36px);
  }
  .visual_animate {
    width: min(52.5%, 672px);
    margin-top: 46px;
    
  }
  .visual_animate .icon_arrow {
    width: min(10.72%, 72px);
    padding: 0 min(7.2%, 10px);
  }

  .upgrade_benefit {
    background: #FBFFEB url('/wp-content/themes/fastfive/assets/event/240226_upgrade/img/benefit_bg.svg') center center no-repeat;
    background-size: 2604px 2037px;
  }
  .upgrade_benefit h3 {
    padding-right: 30px;
    font-size: 52px;
  }
  .upgrade_benefit ul {
    width: 628px;
    margin-top: 24px;
    margin-left: auto;
    gap: 24px 0;
  }
  .upgrade_benefit li {
    padding: 56px 48px;
  }
  .upgrade_benefit li::after {
    right: 32px;
    bottom: 32px;
    width: 84px;
    height: 84px;
  }
  .upgrade_benefit li div {
    padding-left: 94px;
    font-size: 34px;
  }
  .upgrade_benefit li h4 {
    position: absolute;
    top: 0;
    left: 0;
    font-size: 24px;
  }
  .upgrade_benefit li p {
    margin-top: 28px;
    font-size: 16px;
  }

  .upgrade_photo {
    max-width: 1062px;
    margin: 60px auto 0;
  }
  .upgrade_photo .upgrade_swiper figcaption {
    padding-bottom: 32px;
  }
  .upgrade_photo .upgrade_swiper figcaption h4 {
    font-size: 24px;
    gap: 0 8px;
  }
  .upgrade_photo .upgrade_swiper figcaption p {
    font-size: 18px;
  }
  .upgrade_photo .swiper-pagination {
    margin-top: 32px;
  }
  .upgrade_photo .swiper-pagination .swiper-pagination-bullet {
    width: 10px; 
    height: 10px;
  }

  .upgrade_photo .swiper-button-next, 
  .upgrade_photo .swiper-button-prev {
    width: 40px;
    height: 40px;
    margin-top: 10px;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='40' height='40' viewBox='0 0 40 40' fill='none'%3E%3Cg opacity='0.2'%3E%3Cmask id='mask0_270_1659' style='mask-type:alpha' maskUnits='userSpaceOnUse' x='0' y='0' width='40' height='40'%3E%3Crect width='40' height='40' fill='%23D9D9D9'/%3E%3C/mask%3E%3Cg mask='url(%23mask0_270_1659)'%3E%3Cpath d='M26.6666 36.0897L10.5769 20L26.6666 3.91028L29.0319 6.27561L15.3076 20L29.0319 33.7244L26.6666 36.0897Z' fill='white'/%3E%3C/g%3E%3C/g%3E%3C/svg%3E");
  }
  .upgrade_photo .swiper-button-prev {
    left: -104px;
  }
  .upgrade_photo .swiper-button-next {
    right: -104px;
    transform: rotate(180deg);
  }
  .upgrade_photo .swiper-button-next:after, 
  .upgrade_photo .swiper-button-prev:after {
    width: 40px;
    font-size: 0;
    display: none;
  }

  .upgrade_example::after {
    top: 50%;
    width: 3019px;
    height: 2301px;
    margin: -80px 0 0 -40px;
    background: url('/wp-content/themes/fastfive/assets/event/240226_upgrade/img/example_bg.jpg') center center no-repeat;
    background-size: 3019px auto;
    transform: translate(-50%, -50%);
  }
  .example_content {
    margin-top: 60px;
  }
  .ex_upgrade,
  .ex_sale {
    font-size: 34px;
    flex-direction: column;
  }
  .ex_upgrade {
    max-width: min(65.6%, 840px);
    padding: min(5%, 60px) min(14.21%, 111px) 53px;
  }
  .ex_upgrade img {
    max-width: 618px;
  }
  .ex_upgrade figcaption {
    margin-top: 47px;
  }
  .ex_sale {
    max-width: min(28.12%, 360px);
    padding: 20px 20px 53px;
  }
  .ex_sale figcaption {
    margin-top: auto;
  }
  .ex_sale img {
    max-width: 320px;
  }
  .ex_plus {
    width: min(6.25%, 80px);
    background-position: top min(53%, 275px) center;
  }
  .example_etc {
    margin-top: 16px;
    font-size: 18px;
    text-align: right;
  }

  .upgrade_recommend ul {
    max-width: 900px;
    margin: 60px auto 0;
    gap: 24px 0;
  }
  .upgrade_recommend li > img {
    width: min(28.88%, 259px)
  }
  .upgrade_recommend dl {
    padding: 30px 40px;
    font-size: 24px;
    text-align: left;
    justify-content: center;
    gap: 12px 0;
  }
  .upgrade_recommend dl::before {
    position: absolute;
    top: 30px;
    left: -1px;
    width: 1px;
    height: calc(100% - 60px);
    background-color: #D9D9D9;
    display: block;
    content: '';
  }
  .upgrade_recommend dd {
    margin-left: 34px;
  }
  .upgrade_recommend dd::before {
    top: 0;
    left: 0;
    width: 34px;
    height: 34px;
    background: url('/wp-content/themes/fastfive/assets/event/240226_upgrade/img/recommend_icon_add.png') center center no-repeat;
    background-size: 100% auto;
    transform: translateX(-100%);
  }

  .save_content {
    margin-top: 60px;
    gap: 0 24px;
    flex: 1 1 auto;
  }
  .save_content figure::after {
    background: url('/wp-content/themes/fastfive/assets/event/240226_upgrade/img/noise_bg.png') center center no-repeat;
    background-size: 1920px auto;
  }
  .save_content figcaption {
    padding: 48px 8px;
    font-size: 24px;
  }

  .review_content {
    max-width: 1063px;
    margin-top: 60px;
  }
  .review_content .swiper-button-prev,
  .review_content .swiper-button-next {
    width: 40px;
    height: 40px;
  }
  .review_content .swiper-button-prev::after,
  .review_content .swiper-button-next::after {
    display: none;
  }
  .review_content .swiper-button-prev {
    left: -64px;
    background: url('/wp-content/themes/fastfive/assets/event/240226_upgrade/img/review_icon_arr_prev.png') center center no-repeat;
    background-size: 100% auto;
  }
  .review_content .swiper-button-next {
    right: -64px;
    background: url('/wp-content/themes/fastfive/assets/event/240226_upgrade/img/review_icon_arr_next.png') center center no-repeat;
    background-size: 100% auto;
  }
  .review_content .swiper-pagination {
    display: none;
  }
  .upgrade_review .swiper-slide {
    padding: 48px min(8.12%, 80px);
    gap: 0 min(8.12%, 80px);
  }
  .upgrade_review .swiper-slide figure {
    max-width: 297px;
    gap: 16px 0;
  }
  .upgrade_review .swiper-slide figcaption {
    font-size: 16px;
    flex-wrap: wrap;
    gap: 16px;
  }
  .upgrade_review .swiper-slide figcaption strong {
    height: 34px;
    padding: 0 12px;
  }
  .upgrade_review .swiper-slide dl {
    gap: 32px 0;
    flex: 1 0 528px;
  }
  .upgrade_review .swiper-slide dt {
    font-size: 24px;
  }
  .upgrade_review .swiper-slide dd {
    font-size: 18px;
    gap: 16px 0;
  }

  .upgrade_special .event_inner {
    gap: 80px 0;
  }
  .upgrade_special .special_img {
    max-width: 1066px;
  }
}
/* mobile */
@media (max-width: 960px) {
  .event_24upgrade .event_inner {
    max-width: 375px;
    padding: 130px var(--event_padding);
  }
  .event_24upgrade ._noise::before {
    background: url('/wp-content/themes/fastfive/assets/event/240226_upgrade/img/noise_bg_m.png') center center no-repeat;
    background-size: cover;
  }
  .event_24upgrade .event_title {
    padding-left: 0;
    font-size: 28px;
    line-height: 140%;
  }
  .event_24upgrade .btn_group {
    margin-top: 40px;
  }
  .event_24upgrade .bt_base {
    padding: 0 32px;
    font-size: 16px;
  }
  .event_24upgrade .swiper-pagination {
    margin-top: 16px;
  }
  .event_24upgrade .swiper-pagination .swiper-pagination-bullet {
    width: 8px; 
    height: 8px;
  }

  .upgrade_visual::after {
    width: 1278px;
    height: 1274px;
    margin: 5px 0 0 -118px;
    background: url('/wp-content/themes/fastfive/assets/event/240226_upgrade/img/visual_bg_m.jpg') center center no-repeat;
    background-size: 1278px auto;
  }
  .upgrade_visual .btn_group {
    margin-top: 20px;
  }
  .upgrade_visual .event_inner {
    padding: 48px 20px 60px;
    display: flex;
    flex-direction: column;
    align-items: center;
  }
  .visual_content {
    max-width: 336px;
  }
  .visual_content > sup {
    font-size: 18px;
  }
  .visual_content > h2 {
    font-size: 42px;
    line-height: 130%;
    font-weight: 700;
    letter-spacing: -1px;
  }
  .visual_content > p {
    font-size: 24px;
  }
  .visual_content > dl {
    margin-top: 20px;
    font-size: 14px;
  }
  .visual_content dt {
    width: 33px;
  }
  .visual_content dd {
    width: calc(100% - 33px);
  }
  .visual_animate {
    margin-top: 54px;
    max-width: 336px;
  }
  .visual_animate .icon_arrow {
    width: 36px;
    padding: 0 5px;
  }
  .visual_animate .emoji {
    transform: translateX(-50%) translateY(-50%) scale(.5);
  }

  .upgrade_benefit {
    overflow: hidden;
    background-color: #FBFFEB;
  }
  .upgrade_benefit::after {
    position: absolute;
    top: 0;
    left: 50%;
    width: 755px;
    height: 1795px;
    margin: -274px 0 0 -85px;
    background: #FBFFEB url('/wp-content/themes/fastfive/assets/event/240226_upgrade/img/benefit_bg_m.svg') center center no-repeat;
    background-size: 755px auto;
    display: block;
    content: '';
    transform: translateX(-50%);
  }
  .upgrade_benefit .event_inner {
    flex-direction: column;
    align-items: center;
  }
  .upgrade_benefit h3 {
    font-size: 34px;
    text-align: center;
  }
  .upgrade_benefit ul {
    width: 100%;
    margin-top: 40px;
    gap: 16px 0;
  }
  .upgrade_benefit li {
    padding: 40px 30px 40px 40px;
  }
  .upgrade_benefit li::after {
    right: 16px;
    top: 16px;
    width: 56px;
    height: 56px;
  }
  .upgrade_benefit li div {
    font-size: 24px;
  }
  .upgrade_benefit li h4 {
    padding-bottom: 16px;
    font-size: 22px;
  }
  .upgrade_benefit li p {
    margin-top: 12px;
    font-size: 14px;
  }

  .upgrade_photo {
    margin: 40px auto 0;
    max-width: 335px;
  }
  .upgrade_photo .upgrade_swiper figcaption {
    padding-bottom: 20px;
  }
  .upgrade_photo .upgrade_swiper figcaption h4 {
    font-size: 22px;
  }
  .upgrade_photo .upgrade_swiper figcaption p {
    font-size: 16px;
  }
  .upgrade_photo .swiper-button-next, 
  .upgrade_photo .swiper-button-prev {
    display: none;
  }

  .upgrade_example::after {
    top: 0;
    width: 1268px;
    height: 1762px;
    margin: -499px 0 0 0;
    background: url('/wp-content/themes/fastfive/assets/event/240226_upgrade/img/example_bg_m.jpg') center center no-repeat;
    background-size: 1268px auto;
    transform: translateX(-50%);
  }
  .example_content {
    max-width: 335px;
    margin: 0 auto;
    margin-top: 40px;
    flex-direction: column;
  }
  .ex_upgrade,
  .ex_sale {
    font-size: 24px;
  }
  .ex_upgrade {
    padding: 32px 27px;
    flex-direction: column;
  }
  .ex_upgrade figcaption {
    margin-top: 16px;
  }
  .ex_sale {
    padding: 20px;
    align-items: center;
    gap: 0 30px;
  }
  .ex_sale img {
    max-width: 160px;
    flex: 0 0 auto;
  }
  .ex_plus {
    width: 36px;
    height: 36px;
    margin: 8px auto;
    background-size: 36px auto;;
  }
  .example_etc {
    margin-top: 12px;
    font-size: 16px;
    text-align: center;
  }

  .upgrade_recommend ul {
    max-width: 900px;
    margin: 88px auto 0;
    gap: 68px 0;
  }
  .upgrade_recommend li {
    position: relative;
    flex-direction: column;
    border-radius: 4px;
  }
  .upgrade_recommend li > img {
    position: absolute;
    top: -48px;
    left: 50%;
    width: 335px;
    transform: translateX(-50%);
    z-index: 1;
  }
  .upgrade_recommend dl {
    padding: 32px 20px;
    font-size: 22px;
    text-align: center;
    gap: 35px 0;
  }
  .upgrade_recommend dd {
    position: relative;
    font-size: inherit;
  }
  .upgrade_recommend dd::before {
    top: -26px;
    left: 50%;
    width: 20px;
    height: 20px;
    background: url('/wp-content/themes/fastfive/assets/event/240226_upgrade/img/recommend_icon_add_m.png') center center no-repeat;
    background-size: 100% auto;
    transform: translateX(-50%);
  }
  
  .save_content {
    margin-top: 40px;
    gap: 24px 0;
    flex-direction: column;
  }
  .save_content figure::after {
    background: url('/wp-content/themes/fastfive/assets/event/240226_upgrade/img/noise_bg_m.png') center center no-repeat;
    background-size: cover;
  }
  .save_content figcaption {
    padding: 24px 8px;
    font-size: 22px;
  }

  .review_content {
    max-width: 335px;
    margin-top: 40px;
  }
  .review_content .swiper-button-prev,
  .review_content .swiper-button-next {
    display: none;
  }
  .review_content .swiper-pagination .swiper-pagination-bullet {
    background-color: #222;
  }
  .upgrade_review .swiper-slide {
    padding: 40px 32px;
    flex-direction: column;
  }
  .upgrade_review .swiper-slide figure {
    position: relative;
    margin-top: -8px;
    padding-bottom: 40px;
    gap: 8px 0;
  }
  .upgrade_review .swiper-slide figure::after {
    position: absolute;
    bottom: -1px;
    left: -8px;
    width: calc(100% + 16px);
    height: 1px;
    background-color: #d9d9d9;
    display: block;
    content: '';
  }
  .upgrade_review .swiper-slide figcaption {
    font-size: 14px;
    gap: 0 16px;
  }
  .upgrade_review .swiper-slide figcaption strong {
    height: 28px;
    padding: 0 10px;
    white-space: nowrap;
  }
  .upgrade_review .swiper-slide dl {
    margin-top: 40px;
    gap: 16px 0;
  }
  .upgrade_review .swiper-slide dt {
    font-size: 20px;
  }
  .upgrade_review .swiper-slide dd {
    font-size: 16px;
    gap: 8px 0;
  }

  .upgrade_special .event_inner {
    text-align: center;
    gap: 40px 0;
  }
  .upgrade_special .special_img {
    max-width: 324px;
  }
}


@keyframes haha-face {
  10% {transform: translateY(25px);}
  20% {transform: translateY(15px);}
  30% {transform: translateY(25px);}
  40% {transform: translateY(15px);}
  50% {transform: translateY(25px);}
  60% {transform: translateY(0);}
  70% {transform: translateY(-10px);}
  80% {transform: translateY(0);}
  90% {transform: translateY(-10px);}
}

@keyframes haha-mouth {
  10% {transform: scale(0.6); top: 45%;}
  20% {transform: scale(0.8); top: 45%;}
  30% {transform: scale(0.6); top: 45%;}
  40% {transform: scale(0.8); top: 45%;}
  50% {transform: scale(0.6); top: 45%;}
  60% {transform: scale(1); top: 50%;}
  70% {transform: scale(1.2); top: 50%;}
  80% {transform: scale(1); top: 50%;}
  90% {transform: scale(1.1); top: 50%;}
}
@keyframes sad-face {
  25%,
  35% {top: -15px;}
  55%,
  95% {top: 10px;}
  100%,
  0% {top: 0;}
}
@keyframes sad-mouth {
  25%,
  35% {transform: scale(0.85); top: 70px;}
  55%,
  100%,
  0% {transform: scale(1); top: 80px;}
}

@keyframes tear-drop {
  0%,
  100% {
    display: block;
    left: 35px;
    top: 15px;
    transform: rotate(45deg) scale(0);
  }
  25% {
    display: block;
    left: 35px;
    transform: rotate(45deg) scale(2);
  }
  49.9% {
    display: block;
    left: 35px;
    top: 65px;
    transform: rotate(45deg) scale(0);
  }
  50% {
    display: block;
    left: -35px;
    top: 15px;
    transform: rotate(45deg) scale(0);
  }
  75% {
    display: block;
    left: -35px;
    transform: rotate(45deg) scale(2);
  }
  99.9% {
    display: block;
    left: -35px;
    top: 65px;
    transform: rotate(45deg) scale(0);
  }
}
@keyframes imageFade {
  0% {opacity: 1;}
  8% {opacity: 0;}
  50% {opacity: 0;}
  65% {opacity: 1;}
  100% {opacity: 1;}
}

