@media screen and (max-width: 1474px) {
  .step01_slide {
    width: 456px;
    overflow: hidden;
  }
  .step01_button_wrap {
    padding: 0px 24px;
  }
  #go_apply {
    max-width: 100%;
  }
}

@media screen and (max-width: 934px) {
  .step02_slide {
    width: 456px;
    overflow: hidden;
  }
}

@media screen and (max-width: 680px) {
  .only_pc {
    display: none;
  }
  .only_mo {
    display: block;
  }

  body,
  button,
  p,
  span {
    letter-spacing: -0.04em;
  }

  /* typography */
  .h1 {
    font-size: 17px;
    line-height: 22px;
  }
  .h2 {
    font-size: 16px;
    line-height: 22px;
  }
  .h3 {
    font-size: 14px;
    line-height: 22px;
  }
  .h4 {
    font-size: 13px;
  }
  .caption1 {
    font-size: 12px;
    line-height: 15px;
  }
  .caption2 {
    font-size: 11px;
    line-height: 14px;
  }
  .caption {
    padding: 12px 8px;
  }

  /* main */
  .main {
    height: 680px;
  }
  .main > .h2 {
    width: 167px;
    top: 78px;
    left: calc(50% - 19px);
  }
  .img_window {
    width: 260px;
    height: 334px;
    top: 153px;
  }
  .img_cloud {
    width: 210px;
    height: 127px;
    top: 184px;
  }
  .flip_card {
    width: 96px;
    height: 152px;
    top: 270px;
  }
  .flip_card_inner {
    border-radius: 6px;
    box-shadow: 0px 4px 8px 0px #00000040;
  }
  .flip_card_inner img {
    width: 96px;
    height: 152px;
    border-radius: 6px;
  }
  .img_stamp {
    width: 85px;
    height: 85px;
    top: 382px;
    left: calc(50% + 64px);
  }
  .logo {
    width: 56px;
    height: 13px;
    top: 30.48px;
    left: calc(50% + 92px);
  }
  .img_plane {
    width: 170px;
    height: 163px;
    top: 242px;
    left: calc(50% - 202px);
  }
  .main_txt_wrap {
    width: 325px;
    height: 48px;
    gap: 7px;
    top: 507.51px;
  }
  .main_txt_1 {
    width: 122px;
    height: 48px;
  }
  .main_txt_2 {
    width: 157px;
    height: 48px;
  }
  .main_txt_wrap .img_arrow {
    width: 32px;
    height: 25px;
  }
  .main_title {
    width: 156px;
    height: 106px;
    top: 104.68px;
    left: calc(50% - 8px);
  }
  .img_line {
    width: 224px;
    height: 157px;
    left: calc(50% - 247px);
  }
  .img_star {
    width: 42px;
    height: 56px;
    top: 49px;
    left: calc(50% - 61px);
  }
  .main_desc_tag {
    width: 268px;
    height: 30px;
    top: 579px;
    padding: 4px 8px;
    border-radius: 9999px;
  }

  /* common */
  .step_wrap {
    width: 360px;
    padding: 56px 24px 0px;
  }
  .step_wrap::before {
    width: 44px;
    height: 97px;
    left: 163px;
  }
  .step_head {
    gap: 9px;
    padding-top: 42px;
    padding-bottom: 20px;
    border-top-left-radius: 32px;
    border-top-right-radius: 32px;
    box-shadow: 0px -0.5px 2px 0px #0C494E80 inset, 0px 0.5px 2px 0px #FFFFFF40 inset;
  }
  .step_tag {
    padding: 2px 8px;
    border-radius: 99px;
  }
  .step_title {
    padding: 12px 0px 4px;
  }
  .step_title .h2 {
    line-height: 28px;
  }
  .step_title .h3 {
    line-height: 17px;
  }
  .step_title .h2 > b {
    font-size: 24px;
  }
  .step_body {
    gap: 12px;
    padding-top: 48px;
    padding-bottom: 32px;
    border-bottom-right-radius: 32px;
    border-bottom-left-radius: 32px;
  }
  .highlight::before {
    height: 10px;
  }
  .hole {
    width: 344px;
    height: 32px;
    top: 139px;
    left: -16px;
  }
  .step_cont_title {
    margin: 32px 0px 17px;
  }
  .step_cont_title > b {
    font-size: 24px;
  }

  /* step01 */
  .step01_img {
    width: 184px;
    height: 184px;
  }
  .step01_slide {
    width: 360px;
    height: 307px;
    padding: 0px 24px;
    overflow: hidden;
  }
  .step01_swiper_container .swiper-slide {
    width: 252px;
    height: 307px;
  }
  .benefit_info_box {
    gap: 12px;
    padding: 32px 0px 32px 32px;
  }
  .benefit_img {
    width: 94px;
    height: 80px;
  }
  .step01_button_wrap {
    width: 312px;
    margin: 17px 0px 48px;
  }
  #go_apply {
    height: 52px;
    max-width: 312px;
  }
  /* step02 */
  #step02 .step_title .h2 {
    line-height: 28px;
  }
  #step02 .step_title .h3 {
    line-height: 22px;
  }
  #step02 .hole {
    top: 143px;
  }
  .step02_img {
    width: 160px;
    height: 160px;
  }
  .step02_slide {
    width: 360px;
    height: 580px;
    padding: 0px 24px;
    margin-bottom: 48px;
    overflow: hidden;
  }
  .step02_swiper_container {
    width: 310px;
    max-width: 550px;
  }
  .step02_swiper_container .swiper-wrapper {
    align-items: flex-end;
  }
  .step02_swiper_container .swiper-slide {
    width: 310px;
    height: 580px;
  }
  .card_info_box {
    gap: 12px;
    padding: 32px 20px 24px;
  }
  .card_img {
    width: 80px;
    height: 126.6px;
    margin: 8px auto;
  }
  .card_info_box > .flex_row {
    gap: 6px;
  }
  .card_info_tag {
    padding: 2px 4px;
  }
  .card_info_box > .flex_row > .flex_col {
    gap: 4px;
  }
  .go_detail {
    min-height: 52px;
    height: 52px;
  }

  /* footer */
  .footer_wrap {
    padding: 32px 24px 64px 18px;
    gap: 12px;
  }
  .footer_title {
    gap: 6px;
    padding-left: 8px;
  }
  .alert {
    width: 22px;
  }
  .footer ul p {
    padding-left: 20px;
    margin-bottom: 4px;
  }
  .footer ul li {
    position: relative;
  }
  .footer .li_txt {
    padding-left: 12px;
  }
  .footer ul li.default {
    padding-left: 8px;
  }
  .footer ul li.default::before {
    width: 4px;
    height: 4px;
    top: 6px;
  }
  .footer ul li.default.important {
    margin-bottom: 4px;
  }
  .footer .dashed_wrap {
    padding-left: 24px;
  }

  ul.list_wrap li {
    position: relative;
  }
  .list_wrap .li_txt {
    padding-left: 8px;
  }
  ul.list_wrap li.default {
    padding-left: 3px;
  }
  ul.list_wrap li.default::before {
    width: 3px;
    height: 3px;
    top: 7px;
  }
  .list_wrap .dashed_wrap {
    padding-left: 24px;
  }
  ul li.star.default::before {
    top: 0px;
  }
}