/*! Writen  by SCSS */
main .b-mv {
  width: 100%;
  position: relative;
  padding-bottom: calc(900%/16);
  background-image: url("../images/top/mv.png");
  background-position: center;
  background-repeat: no-repeat;
  background-size: cover; }
  @media screen and (max-width: 768px) {
    main .b-mv {
      padding-bottom: 0;
      height: calc(100svh - 80px);
      background-image: url("../images/top/mv_sp.png"); } }
  main .b-mv-logo {
    width: calc(600%/16);
    position: absolute;
    left: 0;
    right: 0;
    top: calc(289%/9);
    margin: auto; }
    @media screen and (max-width: 768px) {
      main .b-mv-logo {
        max-width: 340px;
        width: calc(100% - 40px); } }
  main .b-mv-txt {
    width: fit-content;
    padding: 15px 70px;
    position: absolute;
    left: 0;
    right: 0;
    bottom: calc(40%/9);
    margin: auto; }
    @media screen and (max-width: 768px) {
      main .b-mv-txt {
        text-align: center;
        padding: 15px 10px;
        line-height: 1.8; } }
    @media screen and (max-width: 600px) {
      main .b-mv-txt {
        width: 100%; } }
    main .b-mv-txt::before {
      content: "";
      position: absolute;
      inset: 0;
      margin: auto;
      opacity: 0.7;
      background: linear-gradient(90deg, rgba(255, 255, 255, 0) 0%, white 20%, white 80%, rgba(255, 255, 255, 0) 100%); }
    main .b-mv-txt h5 {
      color: #0f2c4b;
      position: relative;
      z-index: 2; }
main .b-reason {
  padding: 150px 0;
  background: #F4F9FE; }
  @media screen and (max-width: 768px) {
    main .b-reason {
      padding: 100px 0; } }
  main .b-reason .e-item01 {
    position: relative; }
    main .b-reason .e-item01-image {
      width: calc(1080%/16);
      margin-left: auto; }
      @media screen and (max-width: 1400px) {
        main .b-reason .e-item01-image {
          width: 80%; } }
      @media screen and (max-width: 1000px) {
        main .b-reason .e-item01-image {
          width: 100%; } }
    main .b-reason .e-item01-txt {
      width: calc(460%/16);
      height: fit-content;
      position: absolute;
      top: 0;
      bottom: 0;
      left: calc(150%/16);
      margin: auto;
      padding: calc(50%/16);
      background: rgba(255, 255, 255, 0.8); }
      @media screen and (max-width: 1400px) {
        main .b-reason .e-item01-txt {
          left: 0;
          width: 400px;
          padding: 50px; } }
      @media screen and (max-width: 1000px) {
        main .b-reason .e-item01-txt {
          position: relative;
          width: calc(100% - 100px);
          margin: -35px auto 0;
          inset: auto; } }
      @media screen and (max-width: 480px) {
        main .b-reason .e-item01-txt {
          width: calc(100% - 40px); } }
      main .b-reason .e-item01-txt .-l-bold {
        text-align: justify;
        line-height: 1.6; }
      main .b-reason .e-item01-txt .button {
        display: block;
        margin-top: 40px;
        width: calc(286%/3.6);
        margin-left: auto;
        color: #ffffff;
        background: #0f2c4b;
        text-align: center;
        border-radius: 40px;
        padding: calc(16%/3.6) 10px;
        position: relative; }
        @media screen and (max-width: 1000px) {
          main .b-reason .e-item01-txt .button {
            width: 100%;
            max-width: 286px;
            margin: 40px auto 0; } }
        main .b-reason .e-item01-txt .button::after {
          content: "";
          position: absolute;
          top: 0;
          bottom: 0;
          right: calc(24.5%/2.86);
          margin: auto;
          width: 10px;
          height: 10px;
          background-image: url("../images/common/arrow01_w.svg");
          background-position: center;
          background-repeat: no-repeat;
          background-size: contain; }
          @media screen and (min-width: 1000px) and (max-width: 1250px) {
            main .b-reason .e-item01-txt .button::after {
              right: 20px; } }
main .b-renovation {
  padding: 150px 0; }
  @media screen and (max-width: 768px) {
    main .b-renovation {
      padding: 100px 0; } }
  main .b-renovation .e-item01 {
    max-width: 1300px;
    margin: 0 auto;
    display: flex;
    justify-content: center;
    align-items: stretch; }
    @media screen and (max-width: 600px) {
      main .b-renovation .e-item01 {
        width: calc(100% - 4vw);
        flex-direction: column;
        gap: 40px 0; } }
    main .b-renovation .e-item01 > a {
      width: calc(625%/13); }
      @media screen and (max-width: 600px) {
        main .b-renovation .e-item01 > a {
          width: 100%; } }
main .b-renovationmenu {
  padding: 50px 0 150px;
  background: linear-gradient(180deg, rgba(145, 192, 247, 0.5) 0%, rgba(145, 192, 247, 0) 100%); }
  @media screen and (max-width: 768px) {
    main .b-renovationmenu {
      padding-bottom: 100px; } }
  main .b-renovationmenu > .e-inner > .e-edu {
    opacity: 0.4;
    color: #fff;
    font-weight: 400;
    text-align: center; }
  main .b-renovationmenu > .e-inner > .-l-bold {
    margin-bottom: 50px; }
    @media screen and (max-width: 1400px) {
      main .b-renovationmenu > .e-inner > .-l-bold {
        line-height: 1.78; } }
  main .b-renovationmenu > .e-inner .e-list {
    display: flex;
    justify-content: center;
    align-items: stretch;
    gap: 20px; }
    @media screen and (max-width: 1400px) {
      main .b-renovationmenu > .e-inner .e-list {
        flex-wrap: wrap;
        max-width: 700px;
        width: calc(100% - 40px);
        margin: auto; } }
    @media screen and (max-width: 600px) {
      main .b-renovationmenu > .e-inner .e-list {
        max-width: 400px; } }
    main .b-renovationmenu > .e-inner .e-list li {
      width: 200px;
      height: 200px;
      text-align: center;
      border-radius: 100px;
      position: relative;
      overflow: hidden;
      padding: 4px;
      display: flex;
      flex-direction: column; }
      @media screen and (max-width: 600px) {
        main .b-renovationmenu > .e-inner .e-list li {
          width: calc(50% - 10px);
          height: auto;
          aspect-ratio: 1;
          border-radius: 50%; } }
      main .b-renovationmenu > .e-inner .e-list li::before {
        content: "";
        position: absolute;
        inset: 0;
        margin: auto;
        z-index: -1;
        display: block;
        border-radius: 100px;
        background: linear-gradient(145deg, #0053A4 0%, #016EBB 20%, #41AC3B 80%, #8BC11F 100%); }
        @media screen and (max-width: 600px) {
          main .b-renovationmenu > .e-inner .e-list li::before {
            border-radius: 50%; } }
      main .b-renovationmenu > .e-inner .e-list li::after {
        content: "";
        border-radius: 100px;
        position: absolute;
        inset: 2px;
        margin: auto;
        z-index: 1;
        display: block;
        background: #f0f7fe; }
        @media screen and (max-width: 600px) {
          main .b-renovationmenu > .e-inner .e-list li::after {
            border-radius: 50%; } }
      main .b-renovationmenu > .e-inner .e-list li .e-edu {
        margin-top: calc(45%/2);
        position: relative;
        padding-bottom: 10px;
        line-height: 1;
        position: relative;
        color: #2365B1;
        margin-bottom: 15px;
        z-index: 2; }
        main .b-renovationmenu > .e-inner .e-list li .e-edu::after {
          content: "";
          position: absolute;
          left: 0;
          right: 0;
          bottom: 0;
          width: 22px;
          margin: auto;
          height: 1px;
          background: #2365B1; }
      main .b-renovationmenu > .e-inner .e-list li h4 {
        position: relative;
        z-index: 2;
        display: inline-block;
        line-height: 1.6;
        color: #2365B1; }
        main .b-renovationmenu > .e-inner .e-list li h4.ls1 {
          line-height: 1; }
main .b-renovationexamples {
  padding: 150px 0; }
  @media screen and (max-width: 768px) {
    main .b-renovationexamples {
      padding: 100px 0; } }
  main .b-renovationexamples h2.border {
    margin-bottom: 80px; }
  main .b-renovationexamples .e-inner {
    max-width: 1300px;
    width: calc(100% - 40px);
    margin: 0 auto; }
    @media screen and (max-width: 768px) {
      main .b-renovationexamples .e-inner {
        width: 100%; } }
  main .b-renovationexamples .e-slidewrap {
    position: relative;
    padding-bottom: calc(195%/13);
    margin-bottom: 80px; }
    @media screen and (max-width: 768px) {
      main .b-renovationexamples .e-slidewrap {
        margin-bottom: 50px; } }
    @media screen and (max-width: 480px) {
      main .b-renovationexamples .e-slidewrap {
        padding-bottom: 0;
        margin-bottom: 0; } }
    main .b-renovationexamples .e-slidewrap .b-renovation-slide {
      position: relative;
      margin-bottom: 10px; }
      main .b-renovationexamples .e-slidewrap .b-renovation-slide-txt {
        width: calc(410%/13);
        width: 410px;
        background: rgba(255, 255, 255, 0.8);
        position: absolute;
        right: 0;
        bottom: calc(100%/8);
        padding: 30px 0; }
        @media screen and (max-width: 768px) {
          main .b-renovationexamples .e-slidewrap .b-renovation-slide-txt {
            padding: 30px 0 0;
            position: static;
            width: 100%; } }
        main .b-renovationexamples .e-slidewrap .b-renovation-slide-txt > .-bold {
          width: fit-content;
          padding: 0 15px 12px 30px;
          border-bottom: 1px solid #000;
          line-height: 1;
          margin-bottom: 20px; }
          main .b-renovationexamples .e-slidewrap .b-renovation-slide-txt > .-bold > span {
            line-height: 1; }
            main .b-renovationexamples .e-slidewrap .b-renovation-slide-txt > .-bold > span:nth-child(1) {
              border-right: 1px solid #000;
              padding-right: 10px;
              margin-right: 10px; }
        main .b-renovationexamples .e-slidewrap .b-renovation-slide-txt > h4 {
          padding: 0 30px;
          margin-bottom: 50px;
          font-feature-settings: "palt";
          letter-spacing: -0.05em; }
        main .b-renovationexamples .e-slidewrap .b-renovation-slide-txt > a {
          width: calc(200%/4);
          border-radius: 25px;
          display: flex;
          justify-content: center;
          align-items: center;
          background: #fff;
          margin: 0 30px 0 auto;
          padding: 12px 10px;
          position: relative; }
          @media screen and (max-width: 768px) {
            main .b-renovationexamples .e-slidewrap .b-renovation-slide-txt > a {
              margin: 30px auto 0;
              max-width: 200px;
              width: 100%; } }
          main .b-renovationexamples .e-slidewrap .b-renovation-slide-txt > a::after {
            content: "";
            position: absolute;
            top: 0;
            bottom: 0;
            right: calc(24.5% / 2.86);
            margin: auto;
            width: 8px;
            height: 8px;
            background-image: url(../images/common/arrow01.svg);
            background-position: center;
            background-repeat: no-repeat;
            background-size: contain; }
    main .b-renovationexamples .e-slidewrap .b-renovation-thumb {
      width: 100%;
      position: absolute;
      left: 0;
      bottom: 0; }
      @media screen and (max-width: 768px) {
        main .b-renovationexamples .e-slidewrap .b-renovation-thumb {
          position: static;
          margin-bottom: 10px; } }
      main .b-renovationexamples .e-slidewrap .b-renovation-thumb .swiper-wrapper {
        justify-content: space-between; }
      main .b-renovationexamples .e-slidewrap .b-renovation-thumb .swiper-slide {
        width: calc(317.5%/13) !important;
        cursor: pointer; }
  main .b-renovationexamples .button {
    max-width: 420px;
    width: 100%;
    margin: 0 auto;
    display: block;
    color: #ffffff;
    background: #0f2c4b;
    text-align: center;
    border-radius: 40px;
    padding: 22px 10px;
    position: relative; }
    @media screen and (max-width: 1000px) {
      main .b-renovationexamples .button {
        width: 100%;
        max-width: 320px;
        margin: 40px auto 0; } }
    main .b-renovationexamples .button::after {
      content: "";
      position: absolute;
      top: 0;
      bottom: 0;
      right: calc(24.5%/2.86);
      margin: auto;
      width: 10px;
      height: 10px;
      background-image: url("../images/common/arrow01_w.svg");
      background-position: center;
      background-repeat: no-repeat;
      background-size: contain; }
      @media screen and (min-width: 1000px) and (max-width: 1250px) {
        main .b-renovationexamples .button::after {
          right: 20px; } }
main .b-news {
  padding: 150px 0;
  background: #F4F4F4; }
  @media screen and (max-width: 768px) {
    main .b-news {
      padding: 100px 0; } }

.e-center {
  text-align: center; }

/*# sourceMappingURL=top.css.map */
