/*! Writen  by SCSS */
.pre-inc .inner_main .main_bg {
  aspect-ratio: 19.2/8;
  background-image: url("../images/plan/main.jpg"); }
  @media screen and (max-width: 480px) {
    .pre-inc .inner_main .main_bg {
      aspect-ratio: 7.5/8;
      background-image: url("../images/plan/main_sp.jpg"); } }
.pre-inc .plan_area {
  padding: clamp(50px, 4.167vw, 50px) 0 clamp(80px, 15vw, 180px);
  background: #f2f2f2; }
  @media screen and (max-width: 480px) {
    .pre-inc .plan_area {
      padding: 40px 0 60px; } }
  .pre-inc .plan_area .en_ttl.en_ttl01 {
    width: 23.17%; }
    @media screen and (max-width: 480px) {
      .pre-inc .plan_area .en_ttl.en_ttl01 {
        width: 36%; } }
  .pre-inc .plan_area .sec_ttl {
    margin-bottom: clamp(40px, 5.834vw, 70px); }
  .pre-inc .plan_area .thum_group {
    justify-content: flex-start;
    flex-wrap: wrap;
    gap: clamp(25px, 3.334vw, 40px) 3.32%; }
    @media screen and (max-width: 480px) {
      .pre-inc .plan_area .thum_group {
        flex-direction: column;
        gap: 20px 0; } }
    .pre-inc .plan_area .thum_group .thum_in {
      width: 48.34%;
      background: #FFF;
      cursor: pointer;
      transition: 0.3s box-shadow ease-in-out 0s;
      box-shadow: 0 0 10px 0 rgba(0, 0, 0, 0); }
      @media screen and (max-width: 480px) {
        .pre-inc .plan_area .thum_group .thum_in {
          width: 100%; } }
      .pre-inc .plan_area .thum_group .thum_in a {
        position: relative;
        padding: clamp(20px, 2.5vw, 30px); }
        @media screen and (max-width: 480px) {
          .pre-inc .plan_area .thum_group .thum_in a {
            padding-right: 20px; } }
        .pre-inc .plan_area .thum_group .thum_in a .thum_img_group {
          width: 59.62%;
          text-align: center;
          position: relative; }
          @media screen and (max-width: 480px) {
            .pre-inc .plan_area .thum_group .thum_in a .thum_img_group {
              width: 55%; } }
          .pre-inc .plan_area .thum_group .thum_in a .thum_img_group .thum_img.blur img {
            filter: blur(4px); }
          .pre-inc .plan_area .thum_group .thum_in a .thum_img_group .limited_only {
            position: absolute;
            inset: 0;
            margin: auto;
            display: flex;
            justify-content: center;
            align-items: center;
            font-size: clamp(10px, 1.334vw, 16px);
            color: #FFF;
            line-height: 1;
            padding: 15px 5px 18px;
            height: max-content;
            background: #600; }
            @media screen and (max-width: 480px) {
              .pre-inc .plan_area .thum_group .thum_in a .thum_img_group .limited_only {
                padding: 10px;
                font-size: 12px;
                line-height: 1.4; } }
        .pre-inc .plan_area .thum_group .thum_in a .value_group {
          flex-direction: column;
          width: 34.62%; }
          @media screen and (max-width: 820px) {
            .pre-inc .plan_area .thum_group .thum_in a .value_group {
              width: 37%; } }
          @media screen and (max-width: 480px) {
            .pre-inc .plan_area .thum_group .thum_in a .value_group {
              row-gap: 15px; } }
          .pre-inc .plan_area .thum_group .thum_in a .value_group .value_over {
            flex-direction: column;
            row-gap: 15px; }
            @media screen and (max-width: 820px) {
              .pre-inc .plan_area .thum_group .thum_in a .value_group .value_over {
                row-gap: 12px; } }
            .pre-inc .plan_area .thum_group .thum_in a .value_group .value_over .type_name {
              display: flex;
              justify-content: center;
              align-items: baseline;
              font-size: clamp(10px, 1.231vw, 16px);
              color: #FFF;
              padding: 10px 5px;
              background: #0c3579; }
              @media screen and (max-width: 820px) {
                .pre-inc .plan_area .thum_group .thum_in a .value_group .value_over .type_name {
                  font-size: 1.5vw; } }
              @media screen and (max-width: 480px) {
                .pre-inc .plan_area .thum_group .thum_in a .value_group .value_over .type_name {
                  padding: 5px;
                  font-size: 3.2vw; } }
              .pre-inc .plan_area .thum_group .thum_in a .value_group .value_over .type_name .big {
                font-size: 250%;
                line-height: 1; }
              .pre-inc .plan_area .thum_group .thum_in a .value_group .value_over .type_name .menutype {
                background: #FFF;
                color: #0c3579;
                line-height: 1;
                font-size: 80%;
                padding: 5px;
                margin-left: 5px; }
            .pre-inc .plan_area .thum_group .thum_in a .value_group .value_over .ldk {
              font-size: clamp(12px, 1.385vw, 18px);
              line-height: 1.3;
              padding-bottom: 15px;
              border-bottom: 1px solid rgba(0, 0, 0, 0.2); }
              @media screen and (max-width: 820px) {
                .pre-inc .plan_area .thum_group .thum_in a .value_group .value_over .ldk {
                  font-size: 2vw; } }
              @media screen and (max-width: 480px) {
                .pre-inc .plan_area .thum_group .thum_in a .value_group .value_over .ldk {
                  padding-bottom: 12px;
                  font-size: 5vw;
                  line-height: 1.2; } }
              .pre-inc .plan_area .thum_group .thum_in a .value_group .value_over .ldk .big {
                font-size: 166%; }
            .pre-inc .plan_area .thum_group .thum_in a .value_group .value_over .area {
              font-size: clamp(10px, 1.231vw, 16px);
              line-height: 1.5; }
              @media screen and (max-width: 820px) {
                .pre-inc .plan_area .thum_group .thum_in a .value_group .value_over .area {
                  font-size: 1.4vw; } }
              @media screen and (max-width: 480px) {
                .pre-inc .plan_area .thum_group .thum_in a .value_group .value_over .area {
                  font-size: 3.3vw; } }
              .pre-inc .plan_area .thum_group .thum_in a .value_group .value_over .area .sub {
                display: block;
                font-size: 75%; }
              .pre-inc .plan_area .thum_group .thum_in a .value_group .value_over .area .big {
                display: inline-block;
                font-size: 187%;
                line-height: 1; }
            .pre-inc .plan_area .thum_group .thum_in a .value_group .value_over .repay {
              font-size: clamp(13px, 1.385vw, 18px);
              color: #FFF;
              text-align: center;
              padding: 5px 10px;
              background: #e79588; }
            .pre-inc .plan_area .thum_group .thum_in a .value_group .value_over .limited_type {
              background: linear-gradient(to right, #dfc48d 0%, #fffdd6 50%, #dfc48d 100%);
              font-size: clamp(14px, 1.667vw, 20px);
              color: #000;
              line-height: 1;
              padding: 10px 5px;
              text-align: center; }
          .pre-inc .plan_area .thum_group .thum_in a .value_group .viewmore {
            font-size: clamp(10px, 0.924vw, 12px);
            letter-spacing: normal;
            color: #0c3579;
            display: flex;
            align-items: center;
            column-gap: 10px;
            padding-bottom: 15px;
            border-bottom: 1px solid #0c3579; }
            @media screen and (max-width: 480px) {
              .pre-inc .plan_area .thum_group .thum_in a .value_group .viewmore {
                padding-bottom: 8px; } }
            .pre-inc .plan_area .thum_group .thum_in a .value_group .viewmore .more_icon {
              line-height: 0;
              transition: 0.2s transform cubic-bezier(0.75, 0, 0.25, 1) 0s; }
.pre-inc:not(.mobile) .plan_area .thum_group .thum_in:hover {
  box-shadow: 0 0 15px 0 rgba(0, 0, 0, 0.25); }
  .pre-inc:not(.mobile) .plan_area .thum_group .thum_in:hover a .viewmore .more_icon {
    transform: translateX(5px); }

/*# sourceMappingURL=plan.css.map */