@charset "UTF-8";
/*! Writen  by SCSS */
/*下層ページ最初のセクション上部余白を統一する際は使用してみて下さい*/
.contents_wrap {
  background: #01785c;
  color: #fff; }

.sec01 {
  padding-top: clamp(50px, 10vw, 120px);
  background-image: url("../images/position/bg.png");
  background-position: top left;
  background-repeat: no-repeat;
  margin-bottom: clamp(60px, 9.167vw, 110px); }
  .sec01 .img01 {
    margin-top: clamp(-110px, -9.16%, -55px);
    margin-bottom: clamp(-100px, -8.33%, -50px);
    text-align: center;
    margin-inline: auto;
    width: calc(100% - 40px);
    position: relative; }
    @media screen and (max-width: 480px) {
      .sec01 .img01 {
        width: calc(100% + 90px); } }
    .sec01 .img01 .txt1 {
      position: absolute;
      inset: 0;
      margin: auto;
      mix-blend-mode: multiply; }
    .sec01 .img01 .txt2 {
      position: absolute;
      inset: 0;
      margin: auto; }
  .sec01 .img02 {
    text-align: center;
    max-width: 1062px;
    margin-inline: auto; }

.sec02 {
  margin-bottom: clamp(60px, 8.334vw, 100px); }
  .sec02 .sec02_wrap {
    display: flex;
    flex-wrap: wrap;
    justify-content: center;
    row-gap: clamp(30px, 4.167vw, 50px);
    column-gap: 4.17%; }
    .sec02 .sec02_wrap .text_wrap {
      margin-inline: auto;
      text-align: center;
      max-width: 711px;
      margin-inline: 10%; }
      @media screen and (max-width: 480px) {
        .sec02 .sec02_wrap .text_wrap {
          margin-inline: auto; } }
      .sec02 .sec02_wrap .text_wrap .img {
        margin-bottom: clamp(10px, 1.667vw, 20px); }
    .sec02 .sec02_wrap .item {
      width: 30.34%;
      display: flex;
      flex-direction: column;
      row-gap: 10px; }
      @media screen and (max-width: 480px) {
        .sec02 .sec02_wrap .item {
          width: 100%; } }
    .sec02 .sec02_wrap .img02 {
      width: 45%; }
      @media screen and (max-width: 480px) {
        .sec02 .sec02_wrap .img02 {
          width: 100%; } }

.sec03 {
  margin-bottom: 190px; }
  @media screen and (max-width: 480px) {
    .sec03 {
      margin-bottom: 80px;
      margin-bottom: 20px; } }
  .sec03 .inner {
    max-width: 948px; }
  .sec03 .sec03_wrap {
    display: flex;
    flex-direction: column;
    row-gap: clamp(30px, 4.167vw, 50px); }
    @media screen and (max-width: 480px) {
      .sec03 .sec03_wrap .img01 {
        margin-inline: -20px; } }
  .sec03 .text_wrap {
    position: relative;
    text-align: center; }
    .sec03 .text_wrap .obi {
      position: absolute;
      top: 15%;
      right: 0; }
      @media screen and (max-width: 480px) {
        .sec03 .text_wrap .obi {
          display: none; } }
  .sec03 .item_wrap {
    row-gap: clamp(15px, 1.667vw, 20px);
    flex-wrap: wrap; }
    .sec03 .item_wrap .item {
      width: 23.21%;
      position: relative;
      max-width: 220px; }
      .sec03 .item_wrap .item::after {
        content: '';
        position: absolute;
        inset: 0;
        background: linear-gradient(0deg, #898989 0%, #ffffff 100%);
        mix-blend-mode: multiply; }
      @media screen and (max-width: 480px) {
        .sec03 .item_wrap .item {
          width: 48%; } }
      .sec03 .item_wrap .item .txt {
        font-size: clamp(14px, 1.834vw, 22px);
        line-height: 1.1;
        text-align: center;
        position: absolute;
        top: 50%;
        font-weight: 300;
        left: 50%;
        z-index: 1;
        transform: translate(-50%, -50%); }
        .sec03 .item_wrap .item .txt .big {
          font-size: 200%; }
        .sec03 .item_wrap .item .txt .min {
          font-size: 80%;
          font-weight: 200;
          margin-right: 0.5em; }

.img05_1 {
  max-width: 899px;
  margin: 40px auto 0; }
  @media screen and (max-width: 480px) {
    .img05_1 {
      margin-top: 25px; } }

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