/*! Writen  by SCSS */
.inner_main .main_bg {
  background-image: url("../images/plan/main.jpg"); }

.plan_detail {
  padding-bottom: 0; }
  .plan_detail .detail_in {
    display: grid;
    align-items: flex-start;
    justify-content: space-between;
    grid-template-columns: 28.34% 66.67%; }
    @media screen and (max-width: 820px) {
      .plan_detail .detail_in {
        grid-template-columns: 30% 66.67%; } }
    @media screen and (max-width: 480px) {
      .plan_detail .detail_in {
        grid-template-columns: 100%;
        row-gap: 30px; } }
    .plan_detail .detail_in .type_group {
      justify-content: flex-start;
      flex-direction: column;
      row-gap: clamp(20px, 3.077vw, 40px); }
      @media screen and (max-width: 480px) {
        .plan_detail .detail_in .type_group {
          row-gap: 30px; } }
      .plan_detail .detail_in .type_group .type_box {
        position: relative;
        padding: 20px 0 clamp(20px, 3.077vw, 40px);
        text-align: center;
        color: #FFF; }
        .plan_detail .detail_in .type_group .type_box:before {
          content: "";
          position: absolute;
          inset: 0;
          background: #3caec8;
          mix-blend-mode: multiply;
          border-radius: 5px;
          z-index: -1; }
        .plan_detail .detail_in .type_group .type_box .type_name {
          font-size: clamp(30px, 4.308vw, 56px);
          line-height: 1; }
          @media screen and (max-width: 480px) {
            .plan_detail .detail_in .type_group .type_box .type_name {
              font-size: 10vw; } }
          .plan_detail .detail_in .type_group .type_box .type_name .small {
            font-size: 60%; }
        .plan_detail .detail_in .type_group .type_box .ldk {
          font-size: clamp(20px, 2.308vw, 30px);
          line-height: 1;
          background: #0c658c;
          margin: 20px 0 clamp(20px, 2.308vw, 30px);
          padding: 10px 5px; }
          @media screen and (max-width: 480px) {
            .plan_detail .detail_in .type_group .type_box .ldk {
              font-size: 7vw;
              margin: 10px 0; } }
          .plan_detail .detail_in .type_group .type_box .ldk .big {
            font-size: 130%; }
        .plan_detail .detail_in .type_group .type_box .area_group {
          width: fit-content;
          margin: 0 auto clamp(15px, 2.308vw, 30px);
          display: flex;
          flex-direction: column;
          align-items: flex-end;
          letter-spacing: 0.1em;
          row-gap: 5px; }
          .plan_detail .detail_in .type_group .type_box .area_group .area {
            font-size: clamp(11px, 1.231vw, 16px);
            line-height: 1.2; }
            @media screen and (max-width: 480px) {
              .plan_detail .detail_in .type_group .type_box .area_group .area {
                font-size: 3.6vw; } }
            .plan_detail .detail_in .type_group .type_box .area_group .area span {
              line-height: 1; }
              .plan_detail .detail_in .type_group .type_box .area_group .area span.big {
                font-size: 250%; }
              .plan_detail .detail_in .type_group .type_box .area_group .area span.big02 {
                font-size: 175%; }
        .plan_detail .detail_in .type_group .type_box .area02_group {
          width: fit-content;
          margin: 0 auto;
          flex-direction: column; }
          .plan_detail .detail_in .type_group .type_box .area02_group .group_in {
            justify-content: flex-start;
            column-gap: 10px;
            font-size: clamp(11px, 1.231vw, 16px);
            color: #FFF; }
            @media screen and (max-width: 480px) {
              .plan_detail .detail_in .type_group .type_box .area02_group .group_in {
                font-size: 3.5vw; } }
            .plan_detail .detail_in .type_group .type_box .area02_group .group_in dd {
              flex-grow: 1;
              text-align: right; }
      .plan_detail .detail_in .type_group .copy_box {
        position: relative;
        border-top: 1px solid #a5864d;
        border-bottom: 1px solid #a5864d;
        padding: 30px 15px;
        padding-right: 0; }
        @media screen and (max-width: 480px) {
          .plan_detail .detail_in .type_group .copy_box {
            padding: 20px 10px; } }
        .plan_detail .detail_in .type_group .copy_box:before, .plan_detail .detail_in .type_group .copy_box:after {
          content: "";
          position: absolute;
          inset: 0;
          height: 1px;
          background: rgba(165, 134, 77, 0.4); }
        .plan_detail .detail_in .type_group .copy_box:before {
          top: 3px;
          bottom: auto; }
        .plan_detail .detail_in .type_group .copy_box:after {
          bottom: 3px;
          top: auto; }
        .plan_detail .detail_in .type_group .copy_box .copy {
          font-size: clamp(11px, 1.385vw, 18px);
          color: #a5864d;
          line-height: 2.2;
          padding-bottom: 15px;
          margin-bottom: 15px;
          border-bottom: 1px solid #ccc; }
          @media screen and (max-width: 480px) {
            .plan_detail .detail_in .type_group .copy_box .copy {
              font-size: 4vw; } }
          .plan_detail .detail_in .type_group .copy_box .copy.last {
            padding-bottom: 0px;
            margin-bottom: 0px;
            border-bottom: none; }
    .plan_detail .detail_in .draw_group {
      grid-column: 2/3;
      grid-row: 1/4;
      flex-direction: column;
      row-gap: clamp(30px, 3.077vw, 40px); }
      @media screen and (max-width: 480px) {
        .plan_detail .detail_in .draw_group {
          grid-column: auto;
          grid-row: auto; } }
      .plan_detail .detail_in .draw_group .draw_box {
        border: 1px solid #39a6c1;
        background: #FFF;
        padding: 25px;
        text-align: center; }
        @media screen and (max-width: 480px) {
          .plan_detail .detail_in .draw_group .draw_box {
            padding: 15px; } }
    .plan_detail .detail_in .hanrei_box {
      margin-top: clamp(40px, 5.385vw, 70px);
      background: #FFF;
      padding: 10px;
      box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.1); }
      @media screen and (max-width: 480px) {
        .plan_detail .detail_in .hanrei_box {
          margin-top: 0;
          padding: 10px 15px; } }
      .plan_detail .detail_in .hanrei_box .hanrei_txt {
        font-size: clamp(10px, 0.924vw, 12px);
        margin-bottom: 5px; }
        @media screen and (max-width: 480px) {
          .plan_detail .detail_in .hanrei_box .hanrei_txt {
            font-size: 12px; } }
      .plan_detail .detail_in .hanrei_box .hanrei_img {
        line-height: 1;
        text-align: center; }
    .plan_detail .detail_in .draw_button {
      grid-column: 2/3;
      grid-row: 4/5;
      max-width: 630px;
      width: 100%;
      margin: clamp(30px, 3.334vw, 40px) auto 0; }
      @media screen and (max-width: 480px) {
        .plan_detail .detail_in .draw_button {
          grid-column: auto;
          grid-row: auto;
          max-width: 300px;
          margin: 0 auto;
          flex-direction: column;
          row-gap: 20px; } }
      .plan_detail .detail_in .draw_button li {
        width: 47.62%; }
        @media screen and (max-width: 480px) {
          .plan_detail .detail_in .draw_button li {
            width: 100%; } }
        .plan_detail .detail_in .draw_button li a {
          width: 100%;
          height: 100%;
          border: 1px solid #3caec8;
          padding: 10px 5px;
          font-size: clamp(12px, 1.231vw, 16px);
          color: #3caec8;
          display: flex;
          justify-content: center;
          align-items: center;
          column-gap: 15px;
          background: rgba(255, 255, 255, 0);
          transition: 0.3s all ease-in-out 0s; }
          @media screen and (max-width: 480px) {
            .plan_detail .detail_in .draw_button li a {
              font-size: 14px; } }
          body:not(.mobile) .plan_detail .detail_in .draw_button li a:hover {
            background: #FFF; }

@media print {
  .inner_main .main_bg {
    height: 120px; }
  .inner_main .page_title {
    top: auto;
    bottom: 0; }

  .section_cont.first_sec {
    padding: 40px 0 !important; }

  .plan_detail .detail_in {
    max-width: 100%;
    width: 100%; }
    .plan_detail .detail_in .draw_group .draw_button {
      display: none; }

  .caption_area {
    display: none; } }