h1,h2,h3,h4,h5,h6,strong,b,em,th,legend,label,caption,dt {
  font-family: "Shippori Mincho", serif;
}

.text_underline {
    text-decoration: underline 10px;
    text-decoration-color: #D8EEF6;;
    text-underline-offset: -3px;
}

.text_dot {
  background-image: radial-gradient(circle at center, #009DD6 4px, transparent 4px);
  background-position: top right;
  background-repeat: repeat-x;
  background-size: 1em 0.3em;
  padding-top: 8px;
}

.bgfff_text {
  position: relative;

  &>span {
    display: block;
    background: #fff;
    position: absolute;
    left: 0;
    font-size: 28px;
    font-weight: 700;
    line-height: 1.1;
    letter-spacing: 0.56px;

    &:first-child {
      bottom: 42px;
    }

    &:last-child {
      bottom: 4px;
    }
  }
}

.text_red {
  color: #C90606;
  font-weight: 500;
  letter-spacing: 0.32px;
  text-decoration: underline;
}

.text_box {
  background: #EDFAFF;
  border-radius: 8px;
  border: 1px solid #009DD6;
  display: flex;
  justify-content: center;
  align-items: center;
  margin-top: 48px;
  padding: 40px 0;

  &.bgwhite {
    background: #FFF;
  }

  p {
    text-align: center;
    font-size: 20px;
    margin: 0;

    span {
      background: linear-gradient(to bottom, transparent 75%, #FFFEDB 25%);
      background-position-y: -3px;
    }
  }
}

ul.blu_dot {
  font-family: "Noto Sans JP";
  font-size: 17px;
  font-weight: 500;
  letter-spacing: 0.34px;
  line-height: 1;
  text-indent: -0.5em;

  &>li {
    &::marker {
      color: #009DD6;
      font-size: 200%;
      line-height: 1;
    }
    &>span {
      vertical-align: 0.4em;
    }
  }
}

h2.star {
  position: relative;

  &::before {
    content: url(star.png);
    position: absolute;
    display: block;
    top: -50px;
    left: 0;
    right: 0;
  }
}

.access_map  {
  display: flex;
  flex-wrap: wrap;

  &.yokohama>div {
    &:nth-child(1) {
      order: 4;
    }
    &:nth-child(2) {
      order: 5;
    }
    &:nth-child(3) {
      order: 6;
    }
    &:nth-child(4) {
      order: 7;
    }
    &:nth-child(5) {
      order: 2;
    }
    &:nth-child(6) {
      order: 3;
    }
    &:nth-child(7) {
      order: 1;
    }
  }

  &.shibuya>div {
    &:nth-child(1) {
      order: 4;
    }
    &:nth-child(2) {
      order: 5;
    }
    &:nth-child(3) {
      order: 6;
    }
    &:nth-child(4) {
      order: 7;
    }
    &:nth-child(5) {
      order: 1;
    }
    &:nth-child(6) {
      order: 3;
    }
    &:nth-child(7) {
      order: 2;
    }
  }

  &.kitasenju>div {
    &:nth-child(1) {
      order: 4;
    }
    &:nth-child(2) {
      order: 5;
    }
    &:nth-child(3) {
      order: 6;
    }
    &:nth-child(4) {
      order: 7;
    }
    &:nth-child(5) {
      order: 2;
    }
    &:nth-child(6) {
      order: 1;
    }
    &:nth-child(7) {
      order: 3;
    }
  }
}

.access_intro {
  background: url(access_map.png) no-repeat 100% 0;

  &.ibaraki {
    background-image: url(access_map_ibaraki.png);
  }

  &.yokohama {
    background-image: url(access_map_kanagawa.png);
  }

  &.shibuya {
    background-image: url(access_map_tokyo.png);
  }

  &.kitasenju {
    background-image: url(access_map_tokyo.png);
  }
}

@media print, screen and (min-width:751px) {

  .heading_text {
    p {
      text-align: center;
      font-size: 18px;
      font-weight: 600;
      line-height: 32px;
    }
  }

  section {
    padding:50px 0;

    .wrapper {
      width: 1080px;
    }

    h2 {
      font-size: 40px;
      text-align: center;
      font-weight: 600;
      letter-spacing: 0.8px;
    }
  }

  #home-onayami {

    .onayami {
      display: grid;
      grid-template-columns: repeat(6, 1fr);
      gap: 1rem;

      h2 {
        text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
      }

      &>div {
        grid-column: span 3;

        &:nth-child(-n+3) {
          grid-column: span 2;
        }

        &>div {
          height: 192px;
        }

        &:nth-child(1) {
          background: url(onayami_01.jpg) no-repeat;
        }
        &:nth-child(2) {
          background: url(onayami_02.jpg) no-repeat;
        }
        &:nth-child(3) {
          background: url(onayami_03.jpg) no-repeat;
        }
        &:nth-child(4) {
          background: url(onayami_04.jpg) no-repeat;
        }
        &:nth-child(5) {
          background: url(onayami_05.jpg) no-repeat;
        }
      }

    }
  }

  #home-reason {
    .reason_three {
      display: flex;

      .reason_img {
        position: relative;

        .line1 {
          position: absolute;
          top: 148px;
          left: 208px;
          width: 664px;
          height: 7px;
          background: linear-gradient(270deg, rgba(255, 255, 255, 0.00) 0%, #FFF 100%), rgba(0, 45, 91, 0.10);
        }

        .line2 {
          position: absolute;
          top: 304px;
          left: 100px;
          width: 980px;
          height: 7px;
          background: linear-gradient(270deg, rgba(255, 255, 255, 0.00) 0%, #FFF 100%), rgba(0, 45, 91, 0.10);
        }
      }
      .reason_text {
        display: flex;
        flex-wrap: wrap;
        align-items: center;

        &>div {

          &:first-child {
            margin-left: -200px;
          }

          &:nth-child(2) {
            margin-left: -100px;
          }

        }

        h3 {
          font-size: 28px;
          font-weight: 700;
          line-height: 40px;
          letter-spacing: 0.56px;
           margin: 0;
        }

        p {
          color: #4A4A4A;
          font-size: 15px;
          font-style: normal;
          font-weight: 500;
          line-height: 24px;
          letter-spacing: 0.3px;
          text-indent: -1em;
          margin: 8px 0 0 1em;
        }
      }

    }

  }

  #home-compare {
    background: #EDFAFF;

    table {
      text-align: center;
      font-size: 20px;

      tr {
        th,td {
          border: solid 1px #fff;
          padding: 16px 0;
        }

        th {
          color: #fff;

          &:first-child {
            width: 236px;
            background: #002D5B;
          }
          &:nth-child(2) {
            width: 278px;
            background: #009DD6;
          }
          &:nth-child(3) {
            width: 278px;
            background: #565656;
          }
          &:nth-child(4) {
            width: 278px;
            background: #B00D0D;
          }
        }

        td {
          border: solid 1px #fff;

          &:nth-child(2) {
            background: #D8F5FF;
          }
          &:nth-child(3) {
            background: #F5F5F5;
          }
          &:nth-child(4) {
            background: #FFF5F5;
          }

        }
      }
    }
  }

  #home-merit {
    background: url(merit_bg.jpg) no-repeat 50% 0 / contain;

    .merit {
      background: #FFF;
      box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.25);
      margin: 40px auto 0;
      padding-top: 45px;

      .merit_text {
        h3 {
          font-size: 28px;
          font-weight: 700;
          line-height: 40px;
          letter-spacing: 0.56px;
          margin: 0;
        }

        p {
          color: #4A4A4A;
          font-family: "Noto Sans JP";
          font-size: 16px;
          font-weight: 500;
          line-height: 28px;
          letter-spacing: 0.32px;
          margin: 8px 0 0;

          span {
            color: #C90606;
            text-decoration: underline;
            text-underline-position: from-font;
          }
        }
      }
      .text_box {
        width: 950px;
        margin: 48px auto 0;
      }
    }

    .seiri_merit {
      padding-bottom: 80px;
      margin-top: 300px;

      .seiri {
        display: flex;

        .seiri_img {
          width: 256px;
          text-align: center;
        }

        .seiri_text {
          display: flex;
          flex-wrap: wrap;
          width: 800px;

          &>div {
            height: 128px;
          }
        }
      }
    }

    .hasan_merit {
      padding-bottom: 80px;

      .hasan {
        margin-top: 60px;

        &>div {
          display: flex;
          margin-top: 32px;

          .hasan_img {
            width: 388px;
            text-align: center;
          }

          .hasan_text {
            width: 690px;
          }
        }
      }
    }

    .saisei_merit {
      padding-bottom: 80px;

      .saisei {
        margin-top: 60px;

        &>div {
          display: flex;
          margin-top: 32px;

          .saisei_img {
            width: 256px;
            text-align: center;
          }

          .saisei_text {
            width: 800px;
          }
        }
      }
    }

    .kabarai_merit {
      padding-bottom: 80px;

      .kabarai {
        position: relative;
        width: 950px;
        margin: 0 auto;

        .kabarai_img {
          position: absolute;
          left: 0;
          right: 0;
          width: 336px;
          margin: 0 auto;
        }

        .kabarai_text {
          display: grid;
          grid-template-columns: 1fr 1fr;
          gap: 16px;

          &>div {
            height: 136px;
            padding-top: 24px;
            border-radius: 8px;
            display: flex;
            flex-wrap: wrap;

            &:first-child {
              background: rgba(0, 45, 91, 0.10);
              width: 451px;
              padding-left: 24px;
            }
            &:nth-child(2) {
              background: rgba(1, 116, 162, 0.10);
              width: 298px;
              padding-left: 177px;
            }
            &:nth-child(3) {
              background: rgba(103, 195, 229, 0.10);
              width: 451px;
              padding-left: 24px;
            }
            &:nth-child(4) {
              background: rgba(0, 157, 214, 0.10);
              width: 298px;
              padding-left: 177px;
            }

            h3 {
              font-size: 22px;
              letter-spacing: 0.44px;
            }

            p {
              font-size: 15px;
              line-height: 24px;
            }
          }
        }
      }
    }
  }

  #home-voice {
    .voice_title {
      .title_add {
        width: 300px;
        height: 51px;
        border-radius: 28.5px;
        background: #009DD6;
        color: #FFF;
        font-size: 24px;
        font-weight: 600;
        letter-spacing: 0.48px;
        text-align: center;
        line-height: 1.8;
        margin: 0 auto;
        position: relative;

        &::after {
          content: '';
          display: block;
          width: 24px;
          height: 12px;
          background: #009DD6;
          clip-path: polygon(0 0, 100% 0, 50% 100%);
          position: absolute;
          bottom: -11px;
          left: 0;
          right: 0;
          margin: 0 auto;
        }
      }
      h2 {
        margin-top: 12px;
      }
    }
    .voice {

      &>div {
        border-radius: 8px;
        background: #EDFAFF;
        padding: 24px;
        margin-top: 40px;
        display: flex;

        .voice_img {
          width: 200px;


        }

        .voice_text {
          width: 880px;
          font-family: "Noto Sans JP";
          font-weight: 500;

          .voice_tag {
            color: #009DD6;
            font-size: 20px;
            letter-spacing: 0.4px;
          }

          .voice_tag2 {
            display: inline-block;
            border-radius: 4px;
            border: 1px solid #009DD6;
            background: #FFF;
            color: #009DD6;
            font-size: 16px;
            letter-spacing: 0.32px;
            text-align: center;
            padding: 0 12px;
            margin-left: 10px;
          }

          p {
            font-family: "Noto Sans JP";
            font-size: 18px;
            font-weight: 500;
            line-height: 32px;
            letter-spacing: 0.36px;
          }
        }
      }
    }
  }

  #home-lawer {
    background: url(lawer_bg.jpg) no-repeat 50% 0 / cover;

    .lawer {
      width: 700px;
      margin-left: 400px;

      h2 {
        font-size: 48px;
        font-weight: 600;
        letter-spacing: 0.96px;
        text-align: left;

        .corp {
          display: block;
          font-size: 24px;
          letter-spacing: 0.48px;
        }

        .kana {
          font-size: 18px;
          letter-spacing: 0.36px;
          margin-left: 16px;
        }
      }

      .lawer_profile, .lawer_message {
        width: 697px;
        background: #FFF;
        padding: 5px 20px;
        position: relative;
        margin-top: 36px;

        h3 {
          position: absolute;
          top: -18px;
          left: 36px;
          margin: 0;
          font-size: 20px;
          font-weight: 600;
          letter-spacing: 0.4px;
        }

        ul {
          color: #4A4A4A;
          font-family: "Noto Sans JP";
          font-size: 18px;
          font-weight: 500;
          letter-spacing: 0.36px;
          margin-left: 3em;

          &>li::marker {
            color: #009DD6;
          }
        }

        p {
          color: #4A4A4A;
          font-family: "Noto Sans JP";
          font-size: 15px;
          font-weight: 500;
          line-height: 22px;
        }
      }
    }
  }

  #home-flow {
    background: url(flow_bg.jpg) no-repeat 50% 0 / contain;

    .flow_safe {
      background: #FFF;
      box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.25);
      margin: 40px auto 0;
      padding-top: 45px;
      margin-top: 300px;
      padding-bottom: 64px;

      .safe {
        display: flex;

        .flow_img {
          width: 256px;
          text-align: center;
        }

        .flow_text {
          display: flex;
          flex-wrap: wrap;
          width: 800px;
  
          h3 {
            font-size: 28px;
            font-weight: 700;
            line-height: 40px;
            letter-spacing: 0.56px;
            margin: 0;
          }
  
          p {
            color: #4A4A4A;
            font-family: "Noto Sans JP";
            font-size: 16px;
            font-weight: 500;
            line-height: 28px;
            letter-spacing: 0.32px;
            margin: 8px 0 0;
  
            span {
              color: #C90606;
              text-decoration: underline;
              text-underline-position: from-font;
            }
          }
  
          &>div {
            height: 128px;
          }
        }
      }

      .text_box {
        width: 950px;
        margin: 48px auto 0;
      }
    }
  }

  #home-qa {

    .qa_text>div {
      margin: 24px auto 0;
      border: 1px solid #009DD6;
      background: #EDFAFF;

      .qa_q {
        font-size: 20px;
        font-weight: 700;
        padding: 24px 32px;
        position: relative;
        cursor: pointer;

        &::after {
          content: '';
          position: absolute;
          top: 36px;
          right: 32px;
          width: 20px;
          height: 12px;
          background: #009DD6;
          clip-path: polygon(100% 13%, 50% 100%, 0 13%, 8% 0, 50% 73%, 92% 0);
        }

        &::-webkit-details-marker {
          display:none;
        }
      }

      .qa_a {
        padding: 0 32px 24px;

        &>p {
          color: #4A4A4A;
          font-family: "Noto Sans JP";
          font-size: 16px;
          font-weight: 500;
          line-height: 24px;
          padding-top: 16px;
          margin: 0;
          border-top: 1px solid #009DD6;
        }
      }

      details[open] .qa_q::after {
        clip-path: polygon(100% 87%, 50% 0, 0 87%, 8% 100%, 50% 27%, 92% 100%);
      }
    }
  }


  #home-fee {
    background: #EDFAFF;

    table {
      text-align: center;
      font-size: 20px;
      font-weight: 600;
      margin: 0 auto;

      tr {
        th,td {
          padding: 16px 32px;
          border: solid 1px #F2F2F2;
        }

        th {
          background: #BFEDFF;
        }

        td {
          background: #FFF;
        }

        &:first-child th {
          border: solid 1px #fff;
          background: #009DD6;
          color: #fff;

          &:first-child {
            width: 236px;
          }
        }
      }
    }
  }

  #home-procedure {

    .procedure_intro {
      .intro_text {
        display: grid;
        grid-template-columns: repeat(3, 1fr);
        gap: 1rem;

        &>div {
          grid-column: span 1;

          &>div {
            height: 240px;
          }

          &:nth-child(1) {
            background: url(procedure_01.jpg) no-repeat;
          }
          &:nth-child(2) {
            background: url(procedure_02.jpg) no-repeat;
          }
          &:nth-child(3) {
            background: url(procedure_03.jpg) no-repeat;
          }

          ul {
            font-size: 16px;
          }
        }
      }
    }

    .procedure_reconstruction {
      padding: 60px 0;
      margin-top: 80px;
      background: #FFF;
      box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.25);

      .reconstruction_text {
        display: grid;
        grid-template-columns: repeat(7, 1fr);
        width: 920px;
        margin: 0 auto;

        &>div {
          width: 200px;
          display: flex;
          flex-wrap: wrap;
          text-align: center;

          &>* {
            width: 100%;
          }

          .reconstruction_img {
            order: 2;
          }
          h3 {
            font-size: 20px;
            font-weight: 600;
            letter-spacing: 0.4px;
            height: 4em;
            display: flex;
            justify-content: center;
            align-items: end;
            order: 1;
          }
          p {
            color: #4A4A4A;
            font-size: 16px;
            font-weight: 600;
            letter-spacing: 0.32px;
            order: 3;
          }

          &:nth-child(2n) {
            width: 40px;
            display: flex;
            align-items: center;
            justify-content: center;

            &::after {
              content: '';
              display: block;
              width: 18px;
              height: 32px;
              background: #009DD6;
              clip-path: polygon(0 0, 100% 50%, 0 100%);
            }
          }
        }
      }
      .text_box {
        width: 950px;
        margin: 48px auto 0;
      }
    }

    .procedure_doc {
      padding: 40px 0;
      margin-top: 80px;
      background: #FFF;
      box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.25);

      .doc_content {
        display: grid;
        grid-template-columns: 1fr 1fr;
        gap: 40px;
        width: 920px;
        margin: 48px auto 0;

        .doc_text {
          border-left: 4px solid #002D5B;
          padding-left: 24px;
          margin-top: 20px;

          h3 {
            font-size: 24px;
            font-weight: 700;
            letter-spacing: 0.48px;
            margin: 0;
          }

          p {
            color: #4A4A4A;
            font-family: "Noto Sans JP";
            font-size: 16px;
            font-weight: 500;
            line-height: 24px;
            margin: 8px 0 0;
          }
        }
      }
    }

    .procedure_online {
      padding: 40px 0;
      margin-top: 80px;
      background: #FFF;
      box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.25);

      .online_content {
        width: 952px;
        margin: 0 auto;

        &>div {
          display: flex;
          flex-wrap: wrap;
          justify-content: space-between;

          .online_img {
            width: 300px;
          }

          .online_text {
            width: 612px;
            padding-top: 24px;

            h3 {
              font-size: 24px;
              font-weight: 700;
              letter-spacing: 0.48px;
              margin: 0;
            }

            p {
              color: #4A4A4A;
              font-size: 16px;
              font-weight: 500;
              line-height: 24px;
              margin: 8px 0 0;
            }
          }
        }
      }
    }
  }

  #home-access {
    background: #EDFAFF;

    .access_intro {
      padding: 40px 0 50px;

      .heading_text {
        &>* {
          text-align: left;
        }

        h3 {
          margin-bottom: 0;
        }
      }

    }

    .access_info {
      display: flex;
      justify-content: space-between;

      &>div {
        width: 340px;
      }

      h3 {
        font-size: 28px;
        font-weight: 700;
        line-height: 40px;
        letter-spacing: 0.56px;
        text-align: center;
      }

      p {
        color: #4A4A4A;
        font-family: "Noto Sans JP";
        font-size: 17px;
        font-weight: 500;
        line-height: 28px;
      }
    }

    .access_map {
      margin-top: 80px;

      &>div {
        width: 100%;
        background: #FFF;
        box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.25);
        display: flex;
        justify-content: space-between;
        padding: 40px;
        margin-top: 24px;

        .gmap {
          width: 400px;
          height: 230px;
          margin: 0;
        }

        .access_office {
          width: 560px;

          h3 {
            font-size: 20px;
            font-weight: 700;
            letter-spacing: 0.4px;
            margin: 0;
            border-bottom: 1px solid rgba(0, 89, 128, 0.30);
          }

          p {
            color: #4A4A4A;
            font-family: "Noto Sans JP";
            font-size: 16px;
            font-weight: 500;
            letter-spacing: 0.32px;
            margin: 21px 0 0;
          }

          .gmap_btn {
            width: 220px;
            height: 40px;
            border-radius: 2px;
            border: 1px solid #B3CED9;

            a {
              display: block;
              width: 100%;
              height: 100%;
              color: #002D5B;
              font-size: 14px;
              font-weight: 600;
              text-align: center;
              text-decoration: none;
              line-height: 40px;
              position: relative;

              &::after {
                content: '';
                position: absolute;
                display: block;
                width: 5px;
                height: 10px;
                top: 15px;
                right: 15px;
                background: #002D5B;;
                clip-path: polygon(13% 0, 100% 50%, 13% 100%, 0 92%, 73% 50%, 0 8%);
              }
            }
          }
        }
      }
    }
  }
}
@media screen and (max-width:750px) {

  .bgfff_text {
    span {
      font-size: min(7vw,27px);
    }
  }

  .text_box {
    margin-top: 32px;
    padding: 20px;

    p {
      text-align: left;
    }
  }

  .heading_text {
    p {
      text-align: left;
      font-size: 16px;
      font-weight: 600;
      line-height: 28px;
    }
  }

  section {
    padding:50px 0;

    .wrapper {
      padding: 0 24px;
    }

    h2 {
      font-size: 32px;
      text-align: center;
      font-weight: 600;
      letter-spacing: 0.8px;
      line-height: 1.4;
    }
  }

  #contents {
    margin-top: 0;
  }

  #home-onayami {
    padding:0 0 50px;

    .onayami {
      display: block;

      h2 {
        text-shadow: 0 4px 4px rgba(0, 0, 0, 0.25);
      }

      &>div {

        &>div {
          width: 345px;
          height: 192px;
          margin: 0 auto;
        }

        &:nth-child(1) {
          background: url(onayami_01.jpg) no-repeat 50% 0;
        }
        &:nth-child(2) {
          background: url(onayami_02.jpg) no-repeat 50% 0;
        }
        &:nth-child(3) {
          background: url(onayami_03.jpg) no-repeat 50% 0;
        }
        &:nth-child(4) {
          background: url(onayami_04_sp.jpg) no-repeat 50% 0;
        }
        &:nth-child(5) {
          background: url(onayami_05_sp.jpg) no-repeat 50% 0;
        }
      }

    }
  }

  #home-reason {
    .reason_three {
      .reason_text {

        &>div {
          margin-top: 20px;
          padding-left: 64px;
          position: relative;

          &::before {
            content: '';
            display: block;
            width: 40px;
            height: 40px;
            position: absolute;
            left: 0;
          }

          &:nth-child(1)::before  {
            background: url(reason_icon_01.png) no-repeat center center / contain;
          }
          &:nth-child(2)::before {
            background: url(reason_icon_02.png) no-repeat center center / contain;
          }
          &:nth-child(3)::before {
            background: url(reason_icon_03.png) no-repeat center center / contain;
          }

        }

        h3 {
          font-size: 24px;
          font-weight: 700;
          letter-spacing: 0.48px;
           margin: 0;
        }

        p {
          color: #4A4A4A;
          font-size: 15px;
          font-weight: 500;
          line-height: 24px;
          letter-spacing: 0.3px;
          margin: 8px 0 0;
        }
      }

    }

  }

  #home-compare {
    background: #EDFAFF;

    table {
      text-align: center;
      font-size: 20px;
      width: 1075px;

      tr {
        th,td {
          border: solid 1px #fff;
          padding: 16px 0;
        }

        th {
          color: #fff;

          &:first-child {
            width: 236px;
            background: #002D5B;
          }
          &:nth-child(2) {
            width: 278px;
            background: #009DD6;
          }
          &:nth-child(3) {
            width: 278px;
            background: #565656;
          }
          &:nth-child(4) {
            width: 278px;
            background: #B00D0D;
          }
        }

        td {
          border: solid 1px #fff;

          &:nth-child(2) {
            background: #D8F5FF;
          }
          &:nth-child(3) {
            background: #F5F5F5;
          }
          &:nth-child(4) {
            background: #FFF5F5;
          }

        }
      }
    }
  }

  #home-merit {
    background: url(merit_bg_sp.jpg) no-repeat 50% 0 / contain;

    .merit {
      background: #FFF;
      box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.25);
      margin: 40px auto 0;
      padding-top: 45px;

      .merit_text {
        padding: 0 24px;

        h3 {
          font-size: 20px;
          font-weight: 700;
          letter-spacing: 0.4px;
          margin: 8px 0 0;
        }

        p {
          color: #4A4A4A;
          font-family: "Noto Sans JP";
          font-size: 15px;
          font-weight: 500;
          line-height: 28px;
          letter-spacing: 0.3px;
          margin: 8px 0 0;

          span {
            color: #C90606;
            text-decoration: underline;
            text-underline-position: from-font;
          }
        }
      }
      .text_box {
        margin: 48px 24px;
      }
    }

    .seiri_merit {
      margin-top: 80px;
      padding-bottom: 24px;

      .seiri {
        display: flex;

        .seiri_img {
          width: 25%;
          max-width: 56px;
          margin-left: 24px;
        }

        .seiri_text {
          display: flex;
          flex-wrap: wrap;
          width: 75%;
        }
      }
    }

    .hasan_merit {
      padding-bottom: 24px;

      .hasan {
        margin-top: 60px;

        &>div {
          margin-top: 32px;

          .hasan_img {
            text-align: center;
          }

          .hasan_text {
          }
        }
      }
    }

    .saisei_merit {
      padding-bottom: 24px;

      .saisei {
        margin-top: 60px;

        &>div {
          margin-top: 32px;

          .saisei_img {
            text-align: center;

            img {
              width: 64px;
              height: 64px;
            }
          }

          .saisei_text {
            h3 {
             text-align: center;
            }
          }
        }
      }
    }

    .kabarai_merit {
      padding-bottom: 24px;

      .kabarai {

        .kabarai_img {
          width: 336px;
          margin: 0 auto;
        }

        .kabarai_text {

          &>div {
            height: 136px;
            border-radius: 8px;
            display: flex;
            flex-wrap: wrap;
            padding: 36px 24px 0;
            margin-top: 40px;
            position: relative;

            &:first-child {
              background: rgba(0, 45, 91, 0.10);
            }
            &:nth-child(2) {
              background: rgba(1, 116, 162, 0.10);
            }
            &:nth-child(3) {
              background: rgba(103, 195, 229, 0.10);
            }
            &:nth-child(4) {
              background: rgba(0, 157, 214, 0.10);
            }

            &::before {
              content: '';
              display: block;
              width: 64px;
              height: 64px;
              position: absolute;
              top: -30px;
              left: 0;
              right: 0;
              margin: 0 auto;
            }
            &:nth-child(1)::before  {
              background: url(kabarai_icon_01.png) no-repeat center center / contain;
            }
            &:nth-child(2)::before {
              background: url(kabarai_icon_02.png) no-repeat center center / contain;
            }
            &:nth-child(3)::before {
              background: url(kabarai_icon_03.png) no-repeat center center / contain;
            }
            &:nth-child(4)::before {
              background: url(kabarai_icon_04.png) no-repeat center center / contain;
            }

            h3 {
              font-size: 20px;
              font-weight: 700;
              letter-spacing: 0.4px;
              text-align: center;
            }

            p {
              font-size: 15px;
              line-height: 24px;
            }
          }
        }
      }
    }
  }

  #home-voice {
    .voice_title {
      .title_add {
        width: 195px;
        height: 39px;
        border-radius: 28.5px;
        background: #009DD6;
        color: #FFF;
        font-size: 16px;
        font-weight: 600;
        letter-spacing: 0.32px;
        text-align: center;
        line-height: 2.3;
        margin: 0 auto;
        position: relative;

        &::after {
          content: '';
          display: block;
          width: 20px;
          height: 8px;
          background: #009DD6;
          clip-path: polygon(0 0, 100% 0, 50% 100%);
          position: absolute;
          bottom: -7px;
          left: 0;
          right: 0;
          margin: 0 auto;
        }
      }
      h2 {
        margin-top: 12px;
      }
    }
    .voice {

      &>div {
        border-radius: 8px;
        background: #EDFAFF;
        padding: 64px 24px 16px;
        margin-top: 64px;
        position: relative;

        .voice_img {
          width: 96px;
          height: 96px;
          position: absolute;
          top: -48px;
          left: 0;
          right: 0;
          margin: 0 auto;

        }

        .voice_text {
          font-family: "Noto Sans JP";
          font-weight: 500;

          &>div {
            text-align: center;

            .voice_tag {
              color: #009DD6;
              font-size: 20px;
              font-weight: 500;
              letter-spacing: 0.4px;
            }

            .voice_tag2 {
              display: block;
              border-radius: 4px;
              border: 1px solid #009DD6;
              background: #FFF;
              color: #009DD6;
              font-size: 16px;
              letter-spacing: 0.32px;
              width: 100px;
              margin: 10px auto;
            }
          }

          p {
            font-size: 15px;
            line-height: 24px;
            letter-spacing: 0.3px;
          }
        }
      }
    }
  }

  #home-lawer {
    background: url(lawer_bg_sp.jpg) no-repeat 50% 0 / cover;

    .lawer {

      h2 {
        width: 300px;
        margin: 0 auto;
        font-size: 40px;
        font-weight: 600;
        letter-spacing: 0.8px;
        text-align: left;

        .corp {
          display: block;
          font-size: 20px;
          letter-spacing: 0.4px;
        }

        .kana {
          font-size: 18px;
          letter-spacing: 0.36px;
          margin-left: 12px;
        }
      }

      .lawer_profile, .lawer_message {
        background: #FFF;
        padding: 5px 20px;
        position: relative;

        h3 {
          position: absolute;
          top: -18px;
          left: 0;
          right: 0;
          margin: 0 auto;
          font-size: 20px;
          font-weight: 600;
          letter-spacing: 0.4px;
          text-align: center;
        }

        ul {
          color: #4A4A4A;
          font-family: "Noto Sans JP";
          font-size: 16px;
          font-weight: 500;
          letter-spacing: 0.32px;
          margin-left: 3em;

          &>li::marker {
            color: #009DD6;
          }
        }

        p {
          color: #4A4A4A;
          font-family: "Noto Sans JP";
          font-size: 15px;
          font-weight: 500;
          line-height: 22px;
        }
      }

      .lawer_profile {
        margin-top: 117vw;
      }

      .lawer_message {
        margin-top: 40px;
      }
    }
  }

  #home-flow {
    background: url(flow_bg_sp.jpg) no-repeat 50% 0 / contain;

    .flow_safe {
      background: #FFF;
      box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.25);
      margin: 80px auto 0;
      padding-top: 45px;
      padding-bottom: 24px;

      .safe {
        display: flex;

        .flow_img {
          width: 25%;
          max-width: 56px;
          margin-left: 24px;
        }

        .flow_text {
          display: flex;
          flex-wrap: wrap;
          width: 75%;
          padding: 0 24px;
  
          h3 {
            font-size: 24px;
            font-weight: 700;
            line-height: 40px;
            letter-spacing: 0.48px;
            margin: 0;
          }
  
          p {
            color: #4A4A4A;
            font-family: "Noto Sans JP";
            font-size: 15px;
            font-weight: 500;
            line-height: 24px;
            letter-spacing: 0.3px;
            margin: 8px 0 0;
  
            span {
              color: #C90606;
              text-decoration: underline;
              text-underline-position: from-font;
            }
          }
  
        }
      }

      .text_box {
        margin: 48px 24px;
      }
    }
  }

  #home-qa {
    padding-top: 0;

    .qa_text>div {
      margin: 24px auto 0;
      border: 1px solid #009DD6;
      background: #EDFAFF;

      .qa_q {
        font-size: 20px;
        font-weight: 700;
        text-indent: -1.3em;
        margin-left: 1.3em;
        padding: 24px 48px 24px 32px;
        position: relative;
        cursor: pointer;

        &::after {
          content: '';
          position: absolute;
          top: 36px;
          right: 32px;
          width: 20px;
          height: 12px;
          background: #009DD6;
          clip-path: polygon(100% 13%, 50% 100%, 0 13%, 8% 0, 50% 73%, 92% 0);
        }

        &::-webkit-details-marker {
          display:none;
        }
      }

      .qa_a {
        padding: 0 32px 24px;

        &>p {
          color: #4A4A4A;
          font-family: "Noto Sans JP";
          font-size: 16px;
          font-weight: 500;
          line-height: 24px;
          padding-top: 16px;
          margin: 0;
          border-top: 1px solid #009DD6;
        }
      }

      details[open] .qa_q::after {
        clip-path: polygon(100% 87%, 50% 0, 0 87%, 8% 100%, 50% 27%, 92% 100%);
      }
    }
  }


  #home-fee {
    background: #EDFAFF;

    table {
      width: 845px;
      text-align: center;
      font-size: 20px;
      font-weight: 600;
      margin: 0 auto;

      tr {
        th,td {
          padding: 16px 32px;
          border: solid 1px #F2F2F2;
        }

        th {
          background: #BFEDFF;
        }

        td {
          background: #FFF;
        }

        &:first-child th {
          border: solid 1px #fff;
          background: #009DD6;
          color: #fff;

          &:first-child {
            width: 236px;
          }
        }
      }
    }
  }

  #home-procedure {

    .procedure_intro {

      h2 {
        text-align: left;
      }

      .intro_text {

        &>div {
          grid-column: span 1;

          &>div {
            width: 340px;
            height: 240px;
            margin: 0 auto;
          }

          &:nth-child(1) {
            background: url(procedure_01.jpg) no-repeat 50% 0;
          }
          &:nth-child(2) {
            background: url(procedure_02.jpg) no-repeat 50% 0;
          }
          &:nth-child(3) {
            background: url(procedure_03.jpg) no-repeat 50% 0;
          }

          ul {
            font-size: 16px;
          }
        }
      }
    }

    .procedure_reconstruction {
      padding: 32px 24px;
      margin-top: 40px;
      background: #FFF;
      box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.25);

      .reconstruction_text {

        &>div {
          display: grid;
          grid-template-columns: 80px 1fr;

          .reconstruction_img {
            grid-row: 1 / 3;
            grid-column: 1 / 2;
          }
          h3 {
            font-size: 20px;
            font-weight: 600;
            letter-spacing: 0.4px;
            margin: 0 16px;
          }
          p {
            color: #4A4A4A;
            font-size: 16px;
            font-weight: 600;
            letter-spacing: 0.32px;
            margin: 0 16px;
          }

          &:nth-child(2n) {
            width: 100%;
            display: flex;
            align-items: center;
            justify-content: center;
            padding: 20px 0;

            &::after {
              content: '';
              display: block;
              width: 24px;
              height: 16px;
              background: #009DD6;
              clip-path: polygon(0 0, 100% 0, 50% 100%);
            }
          }
        }
      }
      .text_box {
        margin: 48px 0 24px;
      }
    }

    .procedure_doc {
      padding: 32px 24px;
      margin-top: 40px;
      background: #FFF;
      box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.25);

      .doc_content {
        display: grid;

        &>div {
          margin-top: 32px;
        }

        .doc_text {
          border-left: 4px solid #002D5B;
          padding-left: 16px;
          margin-top: 16px;

          h3 {
            font-size: 20px;
            font-weight: 700;
            letter-spacing: 0.4px;
            margin: 0;
          }

          p {
            color: #4A4A4A;
            font-family: "Noto Sans JP";
            font-size: 15px;
            font-weight: 500;
            line-height: 24px;
            margin: 8px 0 0;
          }
        }
      }
    }

    .procedure_online {
      padding: 32px 24px;
      margin-top: 40px;
      background: #FFF;
      box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.25);

      .online_content {
        margin: 0 auto;

        &>div {
          margin-top: 32px;

          .online_img img {
            width: 100%;
          }

          .online_text {
            padding-top: 16px;

            h3 {
              font-size: 20px;
              font-weight: 700;
              letter-spacing: 0.4px;
              margin: 0;
            }

            p {
              color: #4A4A4A;
              font-size: 15px;
              font-weight: 500;
              line-height: 24px;
              margin: 8px 0 0;
            }
          }
        }
      }
    }
  }

  #home-access {
    background: #EDFAFF;

    .access_intro {
      background: url(access_map.png) no-repeat 50% 140%;
      padding: 0 0 100%;

      .heading_text {
        h2 {
          font-size: 30px;
          margin: 0;
        }
        p {
          text-align: left;
          margin: 20px 0 0;
        }
      }

    }

    .access_info {

      &>div {
        width: 340px;
        margin: 0 auto;
      }

      h3 {
        font-size: 20px;
        font-weight: 700;
        line-height: 40px;
        letter-spacing: 0.4px;
        text-align: center;
        margin: 20px 0 0 0;
      }

      p {
        color: #4A4A4A;
        font-family: "Noto Sans JP";
        font-size: 15px;
        font-weight: 500;
        line-height: 24px;
        margin: 8px 0 0 0;
      }
    }

    .access_map {
      margin-top: 32px;

      &>div {
        background: #FFF;
        box-shadow: 0 0 8px 0 rgba(0, 0, 0, 0.25);
        padding: 24px;
        margin-top: 24px;

        .gmap {
          width: 100%;
          height: 180px;
        }

        .access_office {

          h3 {
            font-size: 18px;
            font-weight: 700;
            letter-spacing: 0.36px;
            margin: 0;
            padding-bottom: 8px;
            border-bottom: 1px solid rgba(0, 89, 128, 0.30);
          }

          p {
            color: #4A4A4A;
            font-family: "Noto Sans JP";
            font-size: 15px;
            font-weight: 500;
            letter-spacing: 0.3px;
            margin: 12px 0 0;
          }

          ul {
            margin-top: 12px;
          }

          .gmap_btn {
            height: 40px;
            border-radius: 2px;
            border: 1px solid #B3CED9;

            a {
              display: block;
              width: 100%;
              height: 100%;
              color: #002D5B;
              font-size: 14px;
              font-weight: 600;
              text-align: center;
              text-decoration: none;
              line-height: 40px;
              position: relative;

              &::after {
                content: '';
                position: absolute;
                display: block;
                width: 5px;
                height: 10px;
                top: 15px;
                right: 15px;
                background: #002D5B;;
                clip-path: polygon(13% 0, 100% 50%, 13% 100%, 0 92%, 73% 50%, 0 8%);
              }
            }
          }
        }
      }
    }
  }
}