/* 共通
----------------------------------------------------------------------------------------------- */
/* ! ほぼすべてのモーダルに影響があるため注意 */
/* ! 固有のCSSは「固有」以下に記載 */
.modal-open {
  position: static;
  overflow: visible;
}
.modal-background-area {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 22;
  width: 100%;
  height: 100%;
  opacity: 0.6;
}
.modal-area {
  position: fixed;
  left: 0;
  z-index: 22;
  width: 100%;
  height: 100%;
  .modal-box {
    position: relative;
    top: 50%;
    width: 700px;
    margin: 0 auto;
    background-color: #ffffff;
    border: none;
    border-top: #14b4b4 12px solid;
    border-radius: 10px;
    box-shadow: 0 0 2px 2px rgb(100 100 100 / 19%);
    transform: translateY(-50%);
    @media screen and (width <= 940px) {
      width: 90%;
      max-width: 650px;
      margin-top: 0 !important;
    }
    &.wide {
      width: 930px;
    }
    &.w750 {
      width: 750px;
    }
    &.sp-w570 {
      @media screen and (width <= 670px) {
        max-width: 570px !important;
      }
    }
    .modal-close-button {
      position: absolute;
      top: 3px;
      right: 20px;
      z-index: 2;
      width: 21px;
      height: 21px;
      cursor: pointer;
      background: #ffffff;
      background-image: none;
      border-radius: 50%;
      @media screen and (width <= 940px) {
        width: 24px;
        height: 24px;
      }
      &:hover {
        background-color: #c3ecec;
      }
      &::before,
      &::after {
        position: absolute;
        top: 4px;
        left: 9px;
        display: inline-block;
        width: 2px;
        height: 13px;
        content: "";
        background: #14b4b4;
        @media screen and (width <= 940px) {
          top: 5px;
          left: 11px;
          height: 14px;
        }
      }
      &::before {
        transform: rotate(45deg);
      }
      &::after {
        transform: rotate(-45deg);
      }
    }
    .title-area {
      position: relative;
      padding: 17px 40px 11px 20px;
      margin-top: -12px;
      font-size: 20px;
      font-weight: 600;
      color: #ffffff;
      text-align: center;
      background: #14b4b4;
      border: none;
      border-radius: 10px 10px 0 0;
      @media screen and (width <= 940px) {
        padding: 17px 40px 11px;
        font-size: 16px;
      }
    }
    .inner-area {
      max-height: 600px; /* !取引先情報・プラン変更で微妙にスクロールが発生するので650にしたい */
      padding: 0;
      overflow: hidden auto;
      overscroll-behavior: contain;
      border-radius: 0 0 10px 10px;
      .modal-main-wrap {
        padding: 35px 50px 25px;
        margin-bottom: 10px;
        &.wide {
          padding: 38px 0 0;
          margin-bottom: 0;
        }
        > .h2-wrap {
          margin-bottom: 25px;
        }
        > p {
          margin-bottom: 10px;
          &:last-child {
            margin-bottom: 0;

            /* line-height: calc(100% + 10px); */
          }
        }
        .list-table {
          margin-bottom: 15px;
        }
        .co-b {
          &.dsply-inblk {
            &.co-mr15 {
              @media screen and (width <= 940px) {
                font-size: 13px !important;
                text-align: center;
              }
            }
          }
        }
        .font-cred {
          font-weight: 600;
          color: #f5646e;
        }
      }
      .modal-btn-wrap {
        padding: 18px 20px;
        text-align: center;
        background: #e9f8f8;
        border-radius: 0 0 10px 10px;
        @media screen and (width <= 670px) {
          display: flex;
          justify-content: center;
        }
        .co-btn-new {
          margin-right: 10px;
          vertical-align: bottom;
          &:last-child {
            margin-right: 0;
          }
        }
      }
      input {
        vertical-align: middle;
      }
    }
    .modal-notes {
      font-size: 13px;
      color: #666666;
    }
    .co-fcred {
      position: relative;
      .f-edit {
        position: absolute;
        top: 12px;
        right: 5px;
        display: block;
      }
      .wording {
        position: absolute;
        top: 43px;
        right: -9px;
        z-index: 1;
        display: none;
        padding: 5px 10px;
        font-size: 13px;
        font-weight: bold;
        color: #ffffff;
        background-color: #3c3c3c;
        border-radius: 5px;
      }
    }
    &:not(.first-login, .last-slide) {
      @media screen and (width <= 670px) {
        width: 90%;
        max-width: 650px;
        margin-top: 0 !important;
        transform: translateY(-50%);
      }
    }

    /*** バツボタン ***/
    .peke-btn {
      position: absolute;
      top: 10px;
      right: 10px;
      display: inline-block;
      width: 24px;
      height: 23px;
      padding: 0;
      text-align: center;
      background: #ffffff;
      border: #d6d6d6 solid 1px;
      border-radius: 50%;
      &::before,
      &::after {
        position: absolute;
        top: 4px;
        left: 10px;
        display: inline-block;
        width: 2px;
        height: 13px;
        content: "";
        background: #707070;
      }
      &::before {
        transform: rotate(45deg);
      }
      &::after {
        transform: rotate(-45deg);
      }
      &:hover {
        background: #9a9a9a;
        border: #9a9a9a solid 1px;
      }
      &:hover::after,
      &:hover::before {
        background: #ffffff;
      }
    }

    /*** newボタン ***/
    .co-btn-new {
      transition:
        0.2s box-shadow,
        0.13s top,
        0.2s background-color;
    }
  }
}

/** 完了モーダル **/
.modal-area.complete-modal {
  .modal-box {
    @media screen and (width <= 670px) {
      width: 83%;
    }
    .inner-area {
      max-height: 500px;
      line-height: 1.9;
      @media screen and (width <= 940px) {
        max-height: fit-content !important;
      }
      .modal-main-wrap {
        padding-top: 35px;
        text-align: center;
        @media screen and (width <= 940px) {
          padding: 16px 36px 10px;
        }
        @media screen and (width <= 670px) {
          justify-content: center;
          padding: 16px 22px 10px;
        }
        > p:nth-child(3) {
          > .sentence03 {
            @media screen and (width <= 670px) {
              margin-top: 0.75rem;
              word-break: keep-all;
              overflow-wrap: break-word;
            }
          }
        }
        .complete-title {
          font-size: 21px;
          font-weight: bold;
          span {
            @media screen and (width <= 940px) {
              font-size: 19px !important;
            }
            @media screen and (width <= 670px) {
              font-size: 17px !important;
            }
          }
        }
        img {
          width: 50px;
          height: 50px;
          margin-bottom: 2px;
          @media screen and (width <= 940px) {
            width: 40px;
            height: 40px;
          }
        }
        > p:nth-child(3) {
          > div {
            @media screen and (width <= 940px) {
              flex-direction: column;
              align-items: center;
            }
          }
          > picture {
            > img {
              @media screen and (width <= 940px) {
                width: 100% !important;
                max-width: 270px;
                height: auto !important;
              }
            }
          }
        }
      }
      .modal-btn-wrap {
        @media screen and (width <= 940px) {
          padding: 13px 20px;
        }
        .btn-loggedin.co-btn-new.co-nbtn-s {
          @media screen and (width <= 670px) {
            width: 144px;
            padding: 10px 0 9px;
          }
        }
      }
    }
  }
  p.co-b {
    font-size: 19px;
    span {
      display: block;
      font-size: 21px;
      line-height: 1.5;
    }
  }
}

/* ポップアップ系
----------------------------------------------------------------------------------------------- */
/* ! popupモーダルに固有のクラスを追加する場合は modal-box と同じ階層に追加する */
.modal-area.popup {
  .modal-box {
    width: 570px;
    padding: 42px 25px 17px;
    background-color: #ffffff;
    border: none;
    border-top: #14b4b4 12px solid;
    @media screen and (width <= 670px) {
      width: 90% !important;
      max-width: 650px;
      margin-top: 0 !important;
      transform: translateY(-50%);
    }
    .inner-area {
      position: relative;
      height: 301px;
      &::after {
        position: absolute;
        top: auto;
        bottom: 15px;
        left: 0;
        width: 100%;
        height: 48px;
        content: "";
        background: url(/web/img/common/footer/Buildings.png) no-repeat top;
        background-size: auto 47px;
        opacity: 0.25;
      }
      .modal-main-wrap {
        position: relative;
        z-index: 1;
        display: flex;
        flex-flow: column nowrap;
        height: 100%;
        padding: 0 30px 15px;
        margin: 0;
        > .co-b {
          font-size: 28px;
        }
        > .h2-wrap {
          padding-bottom: 9px;
          margin-bottom: 15px;
          font-size: 23px;
          font-weight: 600;
        }
        > p:first-of-type {
          flex-grow: 0;
          line-height: 1.2;
        }
        > p:not(.h2-wrap, .co-b) {
          display: flex;
          flex-grow: 2;
          flex-wrap: nowrap;
          align-items: center;
          justify-content: center;
          font-size: 17px;
          line-height: 1.8;
        }
        .popup-col2 {
          > img {
            margin-left: 10px;
          }
        }
        .popup-col2:not(.h2-wrap, .co-b) {
          justify-content: space-between;
          padding: 0 30px;
          text-align: left;
        }
        .font-cred {
          font-weight: 600;
          color: #f5646e;
        }
        .popup-img-1 {
          width: 480px;
        }
        .popup-img-2 {
          width: 490px;
        }
        .modal-btn-wrap {
          display: flex;
          flex-grow: 0;
          align-items: end;
          justify-content: center;
          padding: 0;
          background: none;
        }
        > dl {
          padding: 15px 22px 10px;
          margin-bottom: 30px;
          border: #cccccc solid 1px;
          border-radius: 3px;
          > dt {
            margin-top: -27px;
            span {
              display: inline-block;
              padding: 4px;
              font-size: 15px;
              font-weight: 600;
              background: #ffffff;
            }
          }
          > dd > ul {
            display: flex;
            flex-flow: row wrap;
            justify-content: space-between;
            > li {
              margin: 5px;
              @media screen and (width <= 670px) {
                margin: 0;
              }
            }
          }
        }
      }
    }
    &.slide-1 {
      &::after {
        @media screen and (width <= 670px) {
          position: absolute;
          bottom: 65px;
          left: 50%;
          width: 100%;
          height: 60px;
          content: "";
          background: url(/web/img/common/footer/Buildings.png) no-repeat top;
          background-size: cover;
          opacity: 0.25;
          transform: translateX(-50%);
        }
      }
      .inner-area {
        .modal-main-wrap {
          padding-top: 65px;
          > p:nth-of-type(2) {
            align-items: flex-start;
            padding-top: 10px;
            font-size: 15px;
          }
        }
      }
    }
    &:not(.slide-1) {
      .inner-area {
        .modal-main-wrap {
          padding: 0 15px 15px;
        }
      }
    }
    &.first-login {
      @media screen and (width <= 670px) {
        padding: 36px 25px 24px;
      }
      &:not(.slide-1) {
        .inner-area {
          @media screen and (width <= 670px) {
            height: 342px;
          }
        }
      }
      .inner-area {
        &::after {
          @media screen and (width <= 670px) {
            display: none;
          }
        }
        .modal-main-wrap {
          > p {
            &.h2-wrap {
              @media screen and (width <= 670px) {
                padding: 0 15px 16px;
                margin-bottom: 24px;
                font-size: 24px !important;
              }
            }
            &:not(.h2-wrap, .co-b) {
              @media screen and (width <= 670px) {
                flex-grow: 0;
              }
            }
          }
          .btn-loggedin.co-btn-new.co-nbtn-ss {
            @media screen and (width <= 670px) {
              height: fit-content;
              margin-right: 15px !important;
              margin-bottom: 4px;
            }
          }
          .popup-col1 {
            @media screen and (width <= 670px) {
              font-size: 15px !important;
            }
          }
          .popup-col2 {
            &img {
              @media screen and (width <= 670px) {
                margin-left: 0;
              }
            }
          }
          > dl {
            @media screen and (width <= 670px) {
              width: 100%;
              max-width: 380px;
              padding: 15px 4px 10px;
              margin: 0 auto 54px;
            }
            > dd {
              > ul {
                @media screen and (width <= 670px) {
                  display: flex;
                  flex-flow: column wrap;
                  column-gap: 8px;
                  align-content: space-around;
                  height: 90px;
                  margin-top: 8px;
                  text-align: left;
                }
                > li {
                  @media screen and (width <= 670px) {
                    margin: 0;
                  }
                }
              }
            }
          }
        }
      }
    }
    &.last-slide {
      @media screen and (width <= 670px) {
        padding: 44px 25px 9px;
      }
      &::after {
        @media screen and (width <= 670px) {
          position: absolute;
          bottom: 65px;
          left: 50%;
          width: 100%;
          height: 60px;
          content: "";
          background: url(/web/img/common/footer/Buildings.png) no-repeat top;
          background-size: cover;
          opacity: 0.25;
          transform: translateX(-50%);
        }
      }
      .inner-area {
        @media screen and (width <= 670px) {
          height: fit-content;
        }
        &::after {
          @media screen and (width <= 670px) {
            display: none;
          }
        }
        .modal-main-wrap {
          @media screen and (width <= 670px) {
            row-gap: 45px;
          }
          .btn-loggedin.co-btn-new.co-nbtn-ss {
            @media screen and (width <= 670px) {
              height: fit-content;
              margin-right: 15px !important;
              margin-bottom: 4px;
            }
          }
          .popup-col2 {
            @media screen and (width <= 670px) {
              flex-direction: column;
              row-gap: 24px;
              padding: 0 12px !important;
            }
            > span {
              font-size: 20px;
              font-weight: 600;
              @media screen and (width <= 670px) {
                line-height: 30px;
                text-align: center;
              }
            }
            > img {
              flex-shrink: 0;
              width: 167px;
              @media screen and (width <= 670px) {
                width: auto !important;
                height: 120px;
              }
            }
          }
        }
      }
    }
    &.first-login.slide-1 {
      @media screen and (width <= 670px) {
        padding: 34px 0 24px;
      }
      &::after {
        @media screen and (width <= 670px) {
          position: absolute;
          bottom: 84px;
          left: 50%;
          width: 100%;
          height: 70px;
          content: "";
          background: url(/web/img/modal/popup/popup_human_sp.png) no-repeat
            top;
          background-size: cover;
          opacity: 1;
          transform: translateX(-50%);
        }
      }
      .inner-area {
        @media screen and (width <= 670px) {
          height: fit-content;
        }
        &::before {
          position: absolute;
          top: 0;
          left: 0;
          width: 100%;
          height: 100px;
          content: "";
          background: url(/web/img/modal/popup/popup_back.jpg) no-repeat top;
          background-size: auto 100px;
          @media screen and (width <= 670px) {
            background: url(/web/img/modal/popup/popup_back_sp.jpg) no-repeat
              top;
            background-size: contain;
          }
        }
        .modal-main-wrap {
          padding-top: 45px;
          background: url(/web/img/modal/popup/popup_human.png) no-repeat
            bottom center;
          background-size: 480px auto;
          @media screen and (width <= 670px) {
            padding: 56px 16px 0;
            background: none;
          }
          > p:nth-child(2) {
            @media screen and (width <= 670px) {
              padding-top: 14px;
              margin-bottom: 25px;
              font-size: 14px !important;
            }
          }
          .co-b {
            @media screen and (width <= 670px) {
              font-size: 24px !important;
            }
          }
          .modal-btn-wrap {
            @media screen and (width <= 670px) {
              margin-top: 90px;
            }
          }
        }
      }
    }
    &.first-login:not(.slide-1) {
      &::after {
        @media screen and (width <= 670px) {
          position: absolute;
          bottom: 65px;
          left: 50%;
          width: 100%;
          height: 60px;
          content: "";
          background: url(/web/img/common/footer/Buildings.png) no-repeat top;
          background-size: cover;
          opacity: 0.25;
          transform: translateX(-50%);
        }
      }
      .inner-area {
        .modal-main-wrap {
          @media screen and (width <= 670px) {
            justify-content: space-between;
            padding: 0;
          }
          .popup-col2 {
            @media screen and (width <= 670px) {
              flex-direction: column;
              row-gap: 12px;
              padding: 0 !important;
              margin-bottom: 44px;
              text-align: center !important;
            }
            & span {
              @media screen and (width <= 670px) {
                font-size: 16px;
                line-height: 1.5;
                letter-spacing: 0.64px;
              }
            }
            & img {
              @media screen and (width <= 670px) {
                width: auto !important;
                height: 92px;
                margin-left: 0;
              }
            }
          }
        }
      }
    }
    &.first-login.last-slide {
      @media screen and (width <= 670px) {
        padding: 36px 25px 24px;
      }
      .inner-area {
        .modal-main-wrap {
          > .h2-wrap {
            @media screen and (width <= 670px) {
              padding: 0 15px 16px;
              margin-bottom: 24px;
              font-size: 24px !important;
            }
          }
          .modal-btn-wrap {
            .co-btn-new {
              width: 196px;
            }
          }
        }
      }
    }

    /* 保証対象の債権について　about_assure_target_slide.html / opt_agreement_conclusion_modal.html */
    &.about-assure-target {
      &.slide-1 {
        .inner-area {
          @media screen and (width <= 670px) {
            height: 380px;
          }
          &::after {
            @media screen and (width <= 670px) {
              display: none;
            }
          }
          .modal-main-wrap {
            padding-top: 0;
            > p:nth-of-type(2) {
              @media screen and (width <= 670px) {
                padding-top: 0;
              }
            }
            > p:not(.h2-wrap, .co-b) {
              @media screen and (width <= 670px) {
                margin-bottom: 30px;
              }
            }
          }
        }
      }
      &.slide-4 {
        .modal-main-wrap {
          > .h2-wrap {
            @media screen and (width <= 670px) {
              margin-bottom: 4px !important;
            }
          }
          .popup-img-1 {
            @media screen and (width <= 670px) {
              width: 100% !important;
            }
          }
        }
      }
      &.last-slide {
        @media screen and (width <= 670px) {
          padding: 36px 25px 24px;
        }
      }
      &.first-login {
        .modal-main-wrap {
          dl {
            @media screen and (width <= 670px) {
              padding: 15px 8px 10px;
            }
          }
        }
      }
      .inner-area {
        @media screen and (width <= 670px) {
          height: 380px !important;
        }
        .modal-main-wrap {
          @media screen and (width <= 670px) {
            padding: 0;
          }
          .popup-img-1 {
            @media screen and (width <= 670px) {
              width: 240px;
            }
          }
        }
      }
    }

    /* 「支払い遅延・倒産」について　after_assuring_follow_slide.html */
    &.after-assuring-follow {
      @media screen and (width <= 670px) {
        padding: 36px 25px 24px;
      }
      &.slide-1 {
        .inner-area {
          @media screen and (width <= 670px) {
            height: 240px;
          }
          &::after {
            @media screen and (width <= 670px) {
              background: none;
            }
          }
          .modal-main-wrap {
            > p:nth-of-type(2) {
              @media screen and (width <= 670px) {
                align-items: center;
              }
            }
          }
        }
      }
      &.slide-3 {
        &::after {
          @media screen and (width <= 670px) {
            position: absolute;
            bottom: 65px;
            left: 50%;
            width: 100%;
            height: 60px;
            content: "";
            background: url(/web/img/common/footer/Buildings.png) no-repeat
              top;
            background-size: cover;
            opacity: 0.25;
            transform: translateX(-50%);
          }
        }
        .inner-area {
          &::after {
            @media screen and (width <= 670px) {
              content: none;
            }
          }
        }
      }
      &.slide-4 {
        .inner-area {
          .modal-main-wrap {
            @media screen and (width <= 670px) {
              row-gap: 12px;
            }
            .popup-col1 {
              @media screen and (width <= 670px) {
                width: 100%;
              }
            }
          }
        }
      }
      &.last-slide {
        .inner-area {
          .modal-main-wrap {
            @media screen and (width <= 670px) {
              row-gap: 15px;
            }
            .popup-col2 {
              > img {
                @media screen and (width <= 670px) {
                  width: 106px !important;
                  height: auto;
                  margin: 0 10px 0 0;
                }
              }
            }
          }
        }
      }
      .inner-area {
        .modal-main-wrap {
          @media screen and (width <= 670px) {
            padding: 0;
          }
          p {
            &:nth-child(2) {
              @media screen and (width <= 670px) {
                word-break: keep-all;
                overflow-wrap: break-word;
              }
            }
          }
          .co-b {
            @media screen and (width <= 940px) {
              font-size: 28px !important;
            }
            @media screen and (width <= 670px) {
              font-size: 24px !important;
            }
          }
          .popup-col2 {
            @media screen and (width <= 670px) {
              row-gap: 20px;
              padding: 0 3px;
              margin-bottom: 34px;
            }
          }
          .popup-img-1 {
            @media screen and (width <= 670px) {
              width: 100%;
              max-height: 96px;
            }
          }
          .popup-img-2 {
            @media screen and (width <= 670px) {
              width: 100%;
            }
          }
        }
      }
    }

    /* 「取引先の登録」に関する注意　per_year_slide.html */
    &.per-year-slide {
      @media screen and (width <= 670px) {
        padding: 36px 25px 24px;
      }
      &.slide-1 {
        .inner-area {
          @media screen and (width <= 670px) {
            height: 240px;
          }
          &::after {
            @media screen and (width <= 670px) {
              background: none;
            }
          }
          .modal-main-wrap {
            > p:nth-of-type(2) {
              @media screen and (width <= 670px) {
                align-items: center;
              }
            }
          }
        }
      }
      &:not(.slide-1) {
        .inner-area {
          @media screen and (width <= 670px) {
            height: 342px;
          }
        }
      }
      &:not(.slide-4) {
        .inner-area {
          .modal-main-wrap {
            .co-b {
              @media screen and (width <= 940px) {
                font-size: 28px !important;
              }
              @media screen and (width <= 670px) {
                font-size: 24px !important;
              }
            }
          }
        }
      }
      &.slide-4 {
        .inner-area {
          .modal-main-wrap {
            .popup-col2 {
              @media screen and (width <= 670px) {
                flex-direction: row;
                justify-content: space-around;
                margin-bottom: 0 !important;
                text-align: left !important;
              }
              .co-b {
                > span {
                  @media screen and (width <= 670px) {
                    font-size: 14px !important;
                  }
                }
              }
            }
          }
        }
      }
      &.last-slide {
        .inner-area {
          .modal-main-wrap {
            @media screen and (width <= 670px) {
              row-gap: 15px;
            }
            .popup-col2 {
              > img {
                @media screen and (width <= 670px) {
                  width: 106px !important;
                  height: auto;
                  margin: 0 10px 0 0;
                }
              }
            }
          }
        }
      }
      .inner-area {
        .modal-main-wrap {
          @media screen and (width <= 670px) {
            padding: 0;
          }
          .btn-loggedin.co-btn-new.co-nbtn-ss {
            @media screen and (width <= 670px) {
              height: fit-content;
              margin-right: 15px !important;
              margin-bottom: 4px;
            }
          }
          .popup-col2 {
            @media screen and (width <= 670px) {
              row-gap: 20px !important;
              padding: 0 3px;
              margin-bottom: 34px !important;
            }
            &img {
              @media screen and (width <= 670px) {
                width: 106px;
              }
            }
          }
          .popup-img-1 {
            @media screen and (width <= 670px) {
              width: 240px;
            }
          }
          .co-b {
            &span {
              @media screen and (width <= 670px) {
                font-size: 14px !important;
              }
            }
          }
        }
      }
    }

    /* 保証開始　start_assuring_slide.html */
    &.start-assuring {
      @media screen and (width <= 670px) {
        padding: 36px 25px 24px;
      }
      &.slide-1 {
        &::after {
          @media screen and (width <= 670px) {
            position: absolute;
            bottom: 65px;
            left: 50%;
            width: 100%;
            height: 60px;
            content: "";
            background: url(/web/img/common/footer/Buildings.png) no-repeat
              top;
            background-size: cover;
            opacity: 0.25;
            transform: translateX(-50%);
          }
        }
        .inner-area {
          &::after {
            @media screen and (width <= 670px) {
              background: none;
            }
          }
          .modal-main-wrap {
            > p:nth-of-type(2) {
              font-size: 17px;
            }
            p:has(span.co-b) {
              @media screen and (width <= 670px) {
                display: block;
                margin-top: -60px;
              }
            }
          }
        }
      }
      &.slide-3 {
        .inner-area {
          .modal-main-wrap {
            .popup-col2 {
              @media screen and (width <= 670px) {
                flex-direction: row;
                justify-content: space-around;
                margin-bottom: 0;
                text-align: left !important;
              }
            }
            .co-b {
              > span {
                @media screen and (width <= 670px) {
                  font-size: 14px !important;
                }
              }
            }
          }
        }
      }
      &.last-slide {
        .inner-area {
          .modal-main-wrap {
            @media screen and (width <= 670px) {
              row-gap: 15px;
            }
            .popup-col2 {
              flex-grow: 1 !important;
              > img {
                @media screen and (width <= 670px) {
                  width: 106px !important;
                  height: auto;
                  margin: 0 10px 0 0;
                }
              }
            }
          }
        }
      }
      .inner-area {
        .modal-main-wrap {
          justify-content: space-between;
          @media screen and (width <= 670px) {
            padding: 0;
          }
          > p:not(.h2-wrap, .co-b) {
            flex-grow: 0;
          }
          .popup-img-1 {
            @media screen and (width <= 670px) {
              width: 240px;
            }
          }
          .popup-col2 {
            @media screen and (width <= 670px) {
              row-gap: 20px;
              padding: 0 3px;
              margin-bottom: 34px;
            }
          }
          .co-b {
            &span {
              @media screen and (width <= 670px) {
                font-size: 14px !important;
              }
            }
          }
        }
      }
    }

    /* 見積もり用アカウント登録　estimate_welcome_slide.html */
    &.estimate-welcome {
      .title-col2 {
        margin-top: -20px;
        line-height: 1.5;
      }
      &.first-login {
        .inner-area {
          .modal-main-wrap {
            > p {
              &.popup-col2 {
                @media screen and (width <= 670px) {
                  margin-bottom: 20px;
                }
              }
            }
          }
        }
      }
      &.first-login.slide-1 {
        .inner-area {
          .modal-main-wrap {
            .co-b {
              @media screen and (width <= 670px) {
                font-size: 23px !important;
              }
            }
            > p {
              &:not(.co-b) {
                @media screen and (width <= 670px) {
                  display: block;
                  word-break: keep-all;
                  overflow-wrap: break-word;
                }
              }
            }
          }
        }
      }
      &.last-slide {
        .inner-area {
          .modal-main-wrap {
            .co-btn-new {
              &:not(.back-btn) {
                &::after {
                  content: none;
                }
              }
            }
          }
        }
      }
    }

    /* URIHOへようこそ　welcome_slide.html */
    &.welcome {
      &.last-slide {
        .inner-area {
          .modal-main-wrap {
            .co-btn-new {
              &:not(.back-btn) {
                &::after {
                  content: none;
                }
              }
            }
          }
        }
      }
    }
  }
  * {
    box-sizing: border-box;
  }
}

@-moz-document url-prefix() {
  .modal-area.popup
    .modal-box.slide-1:is(.estimate-welcome, .after-assuring-follow)
    .modal-main-wrap
    > p:not(.co-b) {
    display: block;
  }
}

/* その他固有
----------------------------------------------------------------------------------------------- */
/* ! モーダル固有のクラスを追加する場合は modal-main-wrap と同じ階層に追加する */
.modal-area .modal-box .inner-area .modal-main-wrap {
  /* 取引先の情報　assurance_company_modal.html / assurance_registration_input_from_estimates.html */
  &.modal-company-info {
    @media screen and (width <= 670px) {
      max-height: 80%;
      padding: 28px 24px 0 !important;
    }
    .modal-table-outline {
      padding: 0 !important;
      margin: 20px auto;
      background-color: #ffffff;
      border: unset;
      border-radius: 5px;
      .modal-table {
        display: table;
        width: 100%;
        border-collapse: collapse;
        .tr {
          display: table-row;
          border-bottom: 1px #d3d3d3 solid;
        }
        .th {
          display: table-cell;
          width: 28%;
          padding: 10px 0;
          font-weight: bold;
          @media screen and (width <= 670px) {
            width: 35%;
          }
        }
        .td {
          display: table-cell;
          width: 72%;
          padding: 10px 0;
          @media screen and (width <= 670px) {
            width: 65%;
            padding: 10px 0 10px 12px;
          }
        }
      }
      .loggedin-btn-s {
        @media screen and (width <= 670px) {
          margin-bottom: 0;
        }
      }
      > .co-fcred {
        height: 30px;
      }
    }
  }

  /* 特約内容の確認　opt_agreement_conclusion_modal.html */
  &.opt-agreement-modal {
    @media screen and (width <= 670px) {
      row-gap: 8px;
      height: fit-content !important;
    }
    > p {
      &.popup-col2 {
        @media screen and (width <= 670px) {
          flex-direction: column;
          row-gap: 6px;
          padding: 0 3px !important;
        }
        img {
          @media screen and (width <= 670px) {
            width: 118px !important;
          }
        }
      }
    }
  }

  /* 特約内容の拒否　opt_agreement_rejection.html */
  &.opt-agreement-rejection {
    .textarea-in-modal,
    .textarea-in-modal-confirm {
      box-sizing: border-box;
      display: inline-block;
      width: 580px;
      height: 110px;
      padding: 15px;
      @media screen and (width <= 940px) {
        width: 100%;
      }
    }
    .textarea-in-modal-confirm {
      overflow-y: auto;
      white-space: pre-wrap;
      background: #ffffff;
      border: 1px solid #c3c3c3;
      border-radius: 5px;
      @media screen and (width <= 940px) {
        width: 100%;
      }
    }
    > textarea {
      @media screen and (width <= 940px) {
        width: 100%;
      }
    }
  }

  /* プラン変更　accept_suggest_pattern_modal.html */
  /* 入力 */
  &.modal-change-plan {
    padding: 40px 70px 0 !important;
    margin-bottom: 0 !important;
    @media screen and (width <= 940px) {
      padding: 40px 24px 0 !important;
    }
    .simple-col-table {
      width: 710px;
    }
    .co-question-mark > span {
      width: 17px;
      height: 17px;
    }
    .plan-change {
      padding-bottom: 5px !important;
      margin-bottom: 40px;
      border-bottom: 1px solid #d3d3d3;
      .box-wrap {
        align-items: center;
        width: 730px;
        margin-bottom: 30px;
        @media screen and (width <= 940px) {
          width: auto;
        }
        @media screen and (width <= 670px) {
          flex-direction: column;
        }
        &.input-form {
          @media screen and (width <= 940px) {
            column-gap: 20px;
            width: auto;
          }
          @media screen and (width <= 670px) {
            row-gap: 20px;
          }
        }
        .form-in-form {
          width: 340px;
          padding: 24px 42px !important;
          margin-bottom: 0 !important;
          @media screen and (width <= 940px) {
            padding: 22px 19px !important;
          }
          @media screen and (width <= 670px) {
            width: 100% !important;
          }
          &:first-child {
            @media screen and (width <= 670px) {
              margin: 0;
            }
          }
        }
        .arrow {
          display: block;
          width: 20px;
          height: 26px;
          background-color: #9c9c9c;
          clip-path: polygon(0 0, 0% 100%, 100% 50%);
          @media screen and (width <= 670px) {
            transform: rotateZ(90deg);
          }
          &::before {
            left: 108.3%;
          }
        }
        .data-table {
          .tr:last-child {
            border-bottom: 1px #d3d3d3 solid !important;
          }
          .th,
          .td {
            height: 40px;
          }
        }
        .flex-table {
          width: 710px;
          margin: 0 auto 15px;
          @media screen and (width <= 940px) {
            width: auto;
          }
          .td-upper {
            display: flex;
            flex-direction: column;
            border-right: 1px solid #d3d3d3;
            border-left: 1px solid #d3d3d3;
            border-radius: 5px 5px 0 0;
            @media screen and (width <= 670px) {
              border-top: 1px solid #d3d3d3;
              border-radius: 0;
            }
            .tr {
              display: flex;
              border-bottom: 1px solid #d3d3d3;
              @media screen and (width <= 670px) {
                flex-direction: column;
                padding: 10px 14px 24px;
              }
              &:first-child {
                .td-wrap {
                  &:first-child {
                    .th {
                      border-top-left-radius: 5px;
                    }
                  }
                  &:last-child {
                    .th {
                      border-top-right-radius: 5px;
                    }
                  }
                  &:not(:first-child) {
                    .th {
                      border-left: 1px solid #ffffff;
                      @media screen and (width <= 670px) {
                        border-left: none;
                      }
                    }
                  }
                  .th {
                    color: #ffffff;
                    background-color: #33414e;
                    @media screen and (width <= 670px) {
                      color: #3c3c3c;
                      background-color: #ffffff;
                    }
                  }
                }
              }
              &:last-child {
                border-bottom: 2px solid #d3d3d3;
                .td {
                  span {
                    &.co-b {
                      @media screen and (width <= 940px) {
                        font-size: 14px !important;
                      }
                    }
                  }
                }
              }
              &:not(:first-child) {
                .td-wrap {
                  .th {
                    display: none;
                    @media screen and (width <= 670px) {
                      display: block;
                    }
                  }
                }
              }
              .td-wrap {
                display: flex;
                flex-direction: column;
                @media screen and (width <= 670px) {
                  box-sizing: border-box;
                  flex-direction: row;
                  align-items: baseline;
                  width: 100% !important;
                  border-bottom: 1px solid #d3d3d3;
                }
                &:nth-child(1) {
                  width: 33%;
                  @media screen and (width <= 940px) {
                    width: 29%;
                  }
                }
                &:nth-child(2) {
                  width: 16%;
                  @media screen and (width <= 940px) {
                    width: 18%;
                    min-width: 106px;
                  }
                  .td {
                    @media screen and (width <= 940px) {
                      justify-content: flex-end;
                      white-space: nowrap;
                    }
                  }
                }
                &:nth-child(3) {
                  width: 16%;
                  @media screen and (width <= 940px) {
                    width: 18%;
                    min-width: 106px;
                  }
                  .td {
                    @media screen and (width <= 940px) {
                      justify-content: flex-end;
                      white-space: nowrap;
                    }
                  }
                }
                &:nth-child(4) {
                  width: 35%;
                  @media screen and (width <= 940px) {
                    width: 35%;
                  }
                }
                &:last-child {
                  .td {
                    padding: 14px 12px 14px 0;
                    @media screen and (width <= 670px) {
                      display: flex;
                      flex-flow: row wrap;
                      align-items: baseline;
                      justify-content: flex-start;
                      width: calc(100% - 107px);
                      padding: 14px 12px;
                      input {
                        @media screen and (width <= 670px) {
                          width: 96px;
                        }
                      }
                      > div {
                        &:has(form-errmsg) {
                          @media screen and (width <= 670px) {
                            flex-grow: 1;
                            width: 100%;
                            text-align: left;
                            transform: translateY(5px);
                          }
                        }
                      }
                    }
                    div {
                      span {
                        &.form-errmsg {
                          @media screen and (width <= 940px) {
                            display: inline-block;
                            margin-left: 0;
                            text-align: left;
                            white-space: wrap;
                          }
                        }
                      }
                    }
                  }
                }
                &:not(:last-child) {
                  .td {
                    display: flex;
                    flex-wrap: wrap;
                    align-content: center;
                    height: 100%;
                  }
                }
                .th {
                  padding: 10px;
                  text-align: center;
                  @media screen and (width <= 670px) {
                    width: 90px;
                    padding: 14px 0;
                    text-align: left;
                  }
                }
                .td {
                  padding: 14px 12px;
                }
              }
            }
          }
          .td-lower {
            .tr {
              display: flex;
              justify-content: flex-end;
              &:last-child {
                .td {
                  &:last-child {
                    > div {
                      > span {
                        display: inline-block;
                        text-align: left;
                      }
                    }
                  }
                }
              }
              .td {
                border-bottom: 1px solid #d3d3d3;
                &.co-tal {
                  width: calc(28% - 41px);
                  min-width: 130px;
                  padding: 12px 16px 12px 25px;
                  background-color: #f1f1f1;
                  border-left: 1px solid #d3d3d3;
                  @media screen and (width <= 670px) {
                    padding: 14px 7px 14px 9px;
                  }
                  .co-question-mark {
                    @media screen and (width <= 670px) {
                      margin-left: 0;
                    }
                  }
                }
                &.co-tar {
                  width: calc(35% - 32px);
                  padding: 12px 16px;
                  border-right: 1px solid #d3d3d3;
                }
                &:is(.co-tal, .co-tar) {
                  width: 50%;
                }
              }
            }
            .total-amount {
              .last {
                span {
                  &form-errmsg {
                    @media screen and (width <= 670px) {
                      margin-left: 0 !important;
                    }
                  }
                }
              }
            }
            span {
              &.form-errmsg {
                @media screen and (width <= 670px) {
                  white-space: wrap;
                }
              }
            }
          }
        }
      }
      .contract-detail {
        width: 710px;
        margin: 0 auto;
        font-size: 13px;
        line-height: 25px;
        @media screen and (width <= 940px) {
          width: auto;
        }
        .form-content-consent-box {
          &.opt-agreement-conclusion {
            @media screen and (width <= 940px) {
              padding: 20px;
            }
          }
        }
      }
    }
    .flex-table {
      width: 710px;
      margin: 0 auto 15px;
      @media screen and (width <= 940px) {
        width: auto;
      }
      .td-upper {
        display: flex;
        flex-direction: column;
        border-right: 1px solid #d3d3d3;
        border-left: 1px solid #d3d3d3;
        border-radius: 5px 5px 0 0;
        @media screen and (width <= 670px) {
          border-top: 1px solid #d3d3d3;
          border-radius: 0;
        }
        .tr {
          display: flex;
          border-bottom: 1px solid #d3d3d3;
          @media screen and (width <= 670px) {
            flex-direction: column;
            padding: 10px 14px 24px;
          }
          &:first-child {
            .td-wrap {
              &:first-child {
                .th {
                  border-top-left-radius: 5px;
                }
              }
              &:last-child {
                .th {
                  border-top-right-radius: 5px;
                }
              }
              &:not(:first-child) {
                .th {
                  border-left: 1px solid #ffffff;
                  @media screen and (width <= 670px) {
                    border-left: none;
                  }
                }
              }
              .th {
                color: #ffffff;
                background-color: #33414e;
                @media screen and (width <= 670px) {
                  color: #3c3c3c;
                  background-color: #ffffff;
                }
              }
            }
          }
          &:not(:first-child) {
            .td-wrap {
              .th {
                display: none;
                @media screen and (width <= 670px) {
                  display: block;
                }
              }
            }
          }
          &:last-child {
            border-bottom: 2px solid #d3d3d3;
            .td {
              &:last-child {
                > div {
                  > span {
                    @media screen and (width <= 940px) {
                      display: inline-block;
                      text-align: left;
                    }
                  }
                }
              }
            }
          }
          .td-wrap {
            display: flex;
            flex-direction: column;
            @media screen and (width <= 670px) {
              box-sizing: border-box;
              flex-direction: row;
              align-items: baseline;
              width: 100% !important;
              border-bottom: 1px solid #d3d3d3;
            }
            &:nth-child(1) {
              width: 33%;
              @media screen and (width <= 940px) {
                width: 29%;
              }
            }
            &:nth-child(2) {
              width: 16%;
              @media screen and (width <= 940px) {
                width: 18%;
              }
            }
            &:nth-child(3) {
              width: 16%;
              @media screen and (width <= 940px) {
                width: 18%;
              }
            }
            &:nth-child(4) {
              width: 35%;
              @media screen and (width <= 940px) {
                width: 35%;
              }
            }
            &:not(:last-child) {
              .td {
                display: flex;
                flex-wrap: wrap;
                align-content: center;
                height: 100%;
              }
            }
            &:last-child {
              .td {
                padding: 14px 12px 14px 0;
                @media screen and (width <= 670px) {
                  display: flex;
                  flex-flow: row wrap;
                  align-items: baseline;
                  justify-content: flex-start;
                  width: calc(100% - 107px);
                  padding: 14px 12px;
                }
                & input {
                  @media screen and (width <= 670px) {
                    width: 96px;
                  }
                }
                & div {
                  & span {
                    &.form-errmsg {
                      @media screen and (width <= 940px) {
                        display: inline-block;
                        margin-left: 0;
                        text-align: left;
                        white-space: wrap;
                      }
                    }
                  }
                }
                > div {
                  &:has(.form-errmsg) {
                    @media screen and (width <= 670px) {
                      flex-grow: 1;
                      width: 100%;
                      text-align: left;
                      transform: translateY(5px);
                    }
                  }
                }
              }
            }
            &:nth-child(n + 2):nth-child(-n + 3) {
              @media screen and (width <= 940px) {
                min-width: 106px;
              }
              .td {
                @media screen and (width <= 940px) {
                  justify-content: flex-end;
                  white-space: nowrap;
                }
              }
            }
            .th {
              padding: 10px;
              text-align: center;
              @media screen and (width <= 670px) {
                width: 90px;
                padding: 14px 0;
                text-align: left;
              }
            }
            .td {
              padding: 14px 12px;
            }
          }
        }
      }
      .td-lower {
        .tr {
          display: flex;
          justify-content: flex-end;
          &:last-child {
            .td {
              & span {
                &.co-b {
                  @media screen and (width <= 940px) {
                    font-size: 14px !important;
                  }
                }
              }
            }
          }
          .td {
            border-bottom: 1px solid #d3d3d3;
            &.co-tal {
              width: calc(28% - 41px);
              min-width: 130px;
              padding: 12px 16px 12px 25px;
              background-color: #f1f1f1;
              border-left: 1px solid #d3d3d3;
              @media screen and (width <= 670px) {
                padding: 14px 7px 14px 9px;
              }
              .co-question-mark {
                @media screen and (width <= 670px) {
                  margin-left: 0;
                }
              }
            }
            &.co-tar {
              width: calc(35% - 32px);
              padding: 12px 16px;
              border-right: 1px solid #d3d3d3;
            }
            &:is(.co-tal, .co-tar) {
              @media screen and (width <= 670px) {
                width: 50%;
              }
            }
          }
        }
        .total-amount {
          &.last {
            & span {
              &.form-errmsg {
                @media screen and (width <= 670px) {
                  margin-left: 0 !important;
                }
              }
            }
          }
        }
        & span {
          &.form-errmsg {
            @media screen and (width <= 670px) {
              white-space: wrap;
            }
          }
        }
      }
    }
    .consent-check-area {
      margin: 40px auto !important;
    }
    .border-wrap {
      box-sizing: border-box;
      padding: 20px;
      margin-top: 5px;
      border: 1px solid #d3d3d3;
    }
    .list {
      li:not(:last-child) {
        margin-bottom: 10px;
      }
    }
    .plan-change-list-asuarance-amount {
      bottom: 100%;
      width: 185px;
      text-align: left;
      transform: translateX(-45%);
    }
  }

  /* 確認 */
  &.confirm-modal-change-plan {
    padding: 38px 70px 28px;
    @media screen and (width <= 940px) {
      padding: 40px 24px 30px !important;
    }
    @media screen and (width <= 670px) {
      padding: 40px 20px !important;
      margin-bottom: 0 !important;
    }
    section {
      &:nth-child(2) {
        .co-dl-btm-border {
          &.total {
            &:nth-child(3) {
              @media screen and (width <= 670px) {
                border-top: 1px solid #d5d5d5;
              }
            }
          }
        }
      }
      > p {
        &.co-b {
          font-size: 16px !important;
        }
      }
      > div {
        padding: 0 2rem;
        @media screen and (width <= 940px) {
          padding: 0;
        }
        > .co-dl-btm-border {
          justify-content: flex-start;
          padding: 14px 0;
          &.column {
            padding: 30px 0 5px;
            > :is(dt, dd) {
              padding-left: 0;
            }
          }
          dt {
            width: 50%;
            padding-left: 0;
            font-size: 14px !important;
          }
          dd {
            padding-right: 0;
          }
          .form-content-consent-box {
            &.opt-agreement-conclusion {
              padding: 35px;
              margin-bottom: 35px;
            }
          }
        }
      }
      .co-dl-btm-border {
        &.total {
          justify-content: flex-start;
          width: 66%;
          padding: 0;
          margin-right: 2rem;
          @media screen and (width <= 940px) {
            justify-content: flex-start;
            margin-right: 0;
          }
          @media screen and (width <= 670px) {
            width: 100%;
          }
          dt {
            width: 37%;
            padding: 14px 0 14px 20px;
            background-color: #f5f5f5;
            @media screen and (width <= 670px) {
              width: 50%;
              padding: 14px 0 14px 15px;
            }
          }
          dd {
            width: 63%;
            padding: 14px 1rem 14px 0;
            @media screen and (width <= 670px) {
              width: 50%;
              padding: 14px 1rem 14px 0;
            }
          }
        }
      }
      .dl-wrap {
        display: flex;
        @media screen and (width <= 670px) {
          flex-direction: column;
          row-gap: 8px;
          padding: 14px 0;
          border-top: 1px solid #d5d5d5;
          border-bottom: 1px solid #d5d5d5;
        }
        &:nth-child(n + 3) {
          .co-dl-btm-border {
            dt {
              display: none;
              @media screen and (width <= 670px) {
                display: block;
              }
            }
          }
        }
        .co-dl-btm-border {
          display: flex;
          flex-direction: column;
          width: 100%;
          padding: 0;
          @media screen and (width <= 670px) {
            flex-direction: row;
            align-items: center;
            border-bottom: none;
          }
          &:first-child {
            & :is(dt, dd) {
              padding-left: 1rem;
            }
          }
          &:nth-child(2) {
            dt {
              text-indent: 0.8rem;
              @media screen and (width <= 670px) {
                text-indent: 0 !important;
              }
            }
          }
          &:not(:first-child) {
            dd {
              width: 35%;
              @media screen and (width <= 940px) {
                width: 35%;
              }
            }
          }
          dt {
            width: 100%;
            padding-bottom: 9px;
            border-bottom: 1px solid #d3d3d3;
            @media screen and (width <= 670px) {
              width: 5rem !important;
              padding-bottom: 0;
              padding-left: 1rem;
              font-weight: normal !important;
              text-align: left !important;
              border-bottom: none;
            }
          }
          dd {
            width: 100%;
            padding: 14px;
            text-align: left;
            @media screen and (width <= 670px) {
              flex-grow: 1;
              width: auto;
              padding: 0 !important;
              text-align: left !important;
            }
          }
        }
      }
    }
  }

  /* 保存されている下書き　assurance_registration_form_draft_modal.html */
  &.company-registration-draft {
    height: auto;
    max-height: auto;
    padding: 40px 60px;
    margin-bottom: 0;
    overflow-y: auto;
    background: #ffffff;
    border: #c3c3c3 1px solid;
    border: none;
    border-radius: 0 0 10px 10px;
    @media screen and (width <= 940px) {
      max-height: 258px;
      padding: 32px 9px 22px !important;
    }
    ul {
      margin-bottom: 30px;
      border-top: #c3c3c3 1px solid;
      border-bottom: #c3c3c3 1px solid;
      li {
        padding: 8px 5px;
        border-bottom: #c3c3c3 1px solid;
        @media screen and (width <= 940px) {
          padding: 16px 10px 16px 12px !important;
        }
        &:last-child {
          border-bottom: none;
        }
        &.delete-on {
          background-color: #f9f9f9;
          div {
            .delete-btn * {
              display: none;
            }
          }
          > div {
            &:nth-child(2) {
              > div {
                @media screen and (width <= 940px) {
                  display: flex;
                  justify-content: space-evenly;
                  margin-top: 10px;
                }
              }
            }
          }
        }
        > div:first-child {
          display: flex;
          flex-wrap: nowrap;
          align-items: center;
          overflow: visible;
          > a,
          > a:visited,
          > a:hover,
          > a:active {
            display: inline-block;
            flex-grow: 2;
            color: #3296d2;
            @media screen and (width <= 940px) {
              width: 65%;
            }
          }
        }
        div:nth-of-type(2) {
          display: flex;
          visibility: hidden;
          align-items: baseline;
          margin-top: -23px;
          opacity: 0;
          transition:
            margin-top 0.3s,
            opacity 0.15s,
            visibility 0.3s;
          @media screen and (width <= 940px) {
            flex-direction: column;
            align-items: normal;
            height: 16px;
            margin-top: -20px;
          }
          .delete-on & {
            visibility: visible;
            padding-bottom: 4px;
            margin-top: 6px;
            opacity: 1;
            @media screen and (width <= 940px) {
              height: fit-content;
            }
          }
        }
        .save-delete-wrap {
          display: flex;
          width: 135px;
          @media screen and (width <= 940px) {
            width: 115px;
          }
        }
        .save-date {
          flex-grow: 0;
          width: 85px;
          margin-top: 1px;
          font-size: 13px;
          @media screen and (width <= 940px) {
            font-size: 14px;
          }
        }
        .delete-btn {
          flex-grow: 0;
          width: 50px;
          height: 24px;
          text-align: right;
          transform: translateY(-4px);
          @media screen and (width <= 940px) {
            width: 34px;
          }
        }
        .float-on {
          display: inline-block;
          width: 24px;
          height: 23px;
          padding: 0;
          text-align: center;
          background: #ffffff;
          border: #d6d6d6 solid 1px;
          border-radius: 50%;
          @media screen and (width <= 940px) {
            width: 22px;
            height: 22px;
            border: #d6d6d6 solid 2px;
            transform: translateY(0);
          }
          &::before,
          &::after {
            position: absolute;
            top: 5px;
            left: 11px;
            display: inline-block;
            width: 2px;
            height: 13px;
            content: "";
            background: #707070;
            @media screen and (width <= 940px) {
              top: 4px;
              left: 10px;
              height: 14px;
            }
          }
          &::before {
            transform: rotate(45deg);
          }
          &::after {
            transform: rotate(-45deg);
          }
          &:hover {
            background: #9a9a9a;
            border: #9a9a9a solid 1px;
            &::after,
            &::before {
              background: #ffffff;
            }
          }
          .wording {
            top: auto;
            right: -50%;
            bottom: calc(100% + 0.8em);
            width: 2em;
            &::before {
              top: auto;
              bottom: -0.8em;
              content: "▼";
            }
          }
        }
        .loggedin-btn-s {
          width: 60px;
          @media screen and (width <= 940px) {
            width: 80px;
            padding: 5px 12px;
            font-size: 13px;
          }
          &:nth-of-type(2),
          &:nth-of-type(2):visited,
          &:nth-of-type(2):active {
            color: #ffffff;
            background-color: #0aa8a8;
            border: #0aa8a8 1px solid;
          }
          &:nth-of-type(2):hover {
            background-color: #009494;
          }
        }
      }
    }
  }

  /* 保証の終了　assurance_quit_modal.html */
  /* 審査取消　assurance_cancel_modal.html */
  /* 報告した支払い遅延一覧　delay_reports_modal.html */
  &.assurance-delay {
    @media screen and (width <= 670px) {
      padding: 36px 20px 30px !important;
    }
    .flex-table {
      margin-bottom: 15px;
      border: 1px solid #d3d3d3;
      border-radius: 5px;
      .tr {
        display: grid;
        grid-template-columns: 28% 30% 42%;
        @media screen and (width <= 670px) {
          grid-template: "date state" auto "btn btn" auto / 45% 55%;
          border-bottom: unset;
        }
        &.headline {
          .th:first-child {
            border-radius: 5px 0 0;
          }
          .th:last-child {
            border-radius: 0 5px 0 0;
          }
          .th:nth-child(2) {
            box-sizing: border-box !important;
            border-right: 1px #d3d3d3 solid;
            border-left: 1px #d3d3d3 solid;
            @media screen and (width <= 670px) {
              padding: 21px 0;
              border-right: unset !important;
              border-radius: 0 5px 0 0;
            }
          }
          .th:nth-child(3) {
            @media screen and (width <= 670px) {
              display: none;
            }
          }
        }
        &:nth-child(odd) {
          background-color: #f5fafa;
        }
        &:not(:last-child) {
          border-bottom: 1px #d3d3d3 solid;
        }
        &:last-child {
          border-radius: 0 0 5px 5px;
        }
        &:nth-child(n + 2) .th {
          display: none;
        }
        .th {
          width: 100%;
          padding: 10px 0;
          color: #ffffff;
          text-align: center;
          background-color: #33414e;
          &:nth-child(2) {
            @media screen and (width <= 670px) {
              grid-area: state;
              align-self: center;
            }
          }
        }
        .td {
          display: flex;
          flex-direction: column;
          align-items: center;
          justify-content: center;
          width: 100%;
          padding: 12px 0;
          text-align: center;
          &:nth-child(1) {
            @media screen and (width <= 670px) {
              grid-area: date;
            }
            > span {
              display: block;
              @media screen and (width <= 670px) {
                padding-left: 21px;
              }
            }
          }
          &:nth-child(2) {
            @media screen and (width <= 670px) {
              grid-area: state;
              align-self: center;
            }
          }
          &:nth-child(3) {
            @media screen and (width <= 670px) {
              padding: 0;
            }
            &:has(button) {
              display: flex;
              flex-direction: column;
              align-items: center;
              @media screen and (width <= 670px) {
                flex-direction: row;
                grid-area: btn;
                justify-content: space-between;
                width: 88%;
                padding: 16px 0;
                margin: 0 auto;
                border-top: 1px solid #d3d3d3;
              }
            }
            > button {
              @media screen and (width <= 670px) {
                width: 48%;
                margin: 0 !important;
              }
              &::after {
                @media screen and (width <= 670px) {
                  right: 13px;
                  margin-top: -3px;
                }
              }
            }
          }
        }
      }
    }
    .float-on.co-btn-dblue {
      .wording {
        display: none;
      }
    }
    > p.h2-wrap {
      @media screen and (width <= 940px) {
        padding-bottom: 5px;
        font-size: 14px !important;
      }
    }
  }

  /* 支払い遅延・倒産の報告について　no_delay_reports_modal.html */
  &.delay-reports-modal {
    margin-bottom: 0 !important;
    @media screen and (width <= 670px) {
      padding: 38px 20px 28px;
    }
    p {
      &:nth-child(1) {
        @media screen and (width <= 670px) {
          word-break: keep-all;
          overflow-wrap: break-word;
        }
      }
    }
    > p {
      @media screen and (width <= 940px) {
        font-size: 13px;
      }
      > .co-fcred {
        &.co-b {
          @media screen and (width <= 940px) {
            font-size: 13px;
          }
        }
      }
    }
    .modal-img-1 {
      width: 560px;
      margin-top: 15px;
      @media screen and (width <= 670px) {
        width: 100%;
      }
    }
    .co-question-mark {
      .delay-reports-question {
        left: -60px;
        width: 248px;
        @media screen and (width <= 940px) {
          left: -90px;
          width: 260px;
        }
        @media screen and (width <= 670px) {
          left: -83px;
        }
        .co-b {
          @media screen and (width <= 940px) {
            font-size: 14px !important;
          }
        }
      }
    }
  }

  /* URIHOアラート通知一覧　assurances.html */
  &.alert-list-modal {
    @media screen and (width <= 670px) {
      padding: 24px 20px 25px;
    }
    > .caution-box {
      padding: 15px;
      font-size: 13px;
      line-height: 1.6em;
      border: 1px #d3d3d3 solid;
      border-radius: 5px;
    }
    .list-table {
      table {
        .headline {
          .explain-modal-uriho-alert {
            @media screen and (width <= 940px) {
              font-size: 12px !important;
            }
            @media screen and (width <= 670px) {
              width: 26em;
              padding: 13px 8px 15px;
              transform: translate(-101%, 32%);
            }
            @media screen and (width <= 480px) {
              width: 20em;
              padding: 10px 8px 12px;
              transform: translate(-101%, 30%);
            }
            .alert-icon {
              @media screen and (width <= 480px) {
                width: 18px;
              }
            }
            .attention {
              @media screen and (width <= 940px) {
                font-size: 12px !important;
              }
            }
          }
        }
      }
    }
  }

  /* 閉じるボタンなし */
  &.without-close-button {
    max-height: 500px;
    overflow-y: hidden;
    line-height: 1.9;
  }

  /* URIHO診断モーダル */
  &.assurance-form-detail {
    padding: 15px 40px 20px;
    font-family: "Noto Sans JP", sans-serif;
    @media screen and (width <= 670px) {
      padding: 10px 10px 15px;
      margin-bottom: 0;
    }
    .assessment-company-name {
      display: flex;
      align-items: center;
      justify-content: left;
      height: 60px;
      border-bottom: #333333 solid 1px;
      p {
        font-size: 14px;
        font-weight: bold;
        line-height: 1.55;
        text-align: left;
        @media screen and (width <= 670px) {
          font-size: 12px;
        }
      }
    }
    .result-block {
      display: flex;
      align-items: center;
      margin: 25px 0 20px;
      @media screen and (width <= 670px) {
        flex-direction: column;
        margin-top: 20px;
        margin-bottom: 15px;
      }
      span {
        display: block;
        width: 66px;
        height: 66px;
        font-size: 20px;
        font-weight: bold;
        line-height: 65px;
        color: #ffffff;
        border-radius: 50%;
      }
      .result-approval {
        background-color: #00a5a5;
      }
      .result-reduction {
        width: auto;
        height: auto;
        padding: 9px 15px 11px;
        font-size: 18px;
        line-height: 1.28;
        background-color: #cc9900;
      }
      .result-rejection {
        background-color: #e46c0b;
      }
      p {
        display: inline-block;
        width: 400px;
        margin-left: 15px;
        font-size: 17px;
        line-height: 1.5;
        text-align: left;
        @media screen and (width <= 940px) {
          font-size: 17px;
        }
        @media screen and (width <= 670px) {
          display: flex;
          align-items: center;
          justify-content: center;
          width: 90%;
          height: 60px;
          margin: 10px 0 0;
          font-size: 14px;
          text-align: center;
        }
      }
    }
    .comment-block {
      display: flex;
      align-items: end;
      justify-content: space-between;
      @media screen and (width <= 670px) {
        justify-content: center;
      }
      .comment {
        position: relative;
        box-sizing: border-box;
        display: flex;
        align-items: center;
        width: 400px;
        height: 110px;
        padding: 0 15px;
        line-height: 1.8;
        text-align: left;
        background-color: #d0ebfa;
        border-radius: 5px;
        @media screen and (width <= 940px) {
          width: 82%;
        }
        @media screen and (width <= 670px) {
          width: 400px;
          height: 105px;
          padding: 0 20px;
          font-size: 12px;
        }
        &::before {
          position: absolute;
          top: 31%;
          right: -22px;
          margin-left: -10px;
          content: "";
          border: 15px solid transparent;
          border-top: 25px solid #d0ebfa;
          transform: rotate(-90deg);
          @media screen and (width <= 670px) {
            display: none;
          }
        }
      }
      img {
        width: 70px;
        @media screen and (width <= 670px) {
          display: none;
        }
      }
    }
    + .modal-btn-wrap {
      position: relative;
      padding: 0 0 40px;
      background-color: unset;
      @media screen and (width <= 670px) {
        padding-bottom: 35px;
      }
      img {
        position: absolute;
        bottom: 0;
        left: 35px;
        z-index: -1;
        width: 500px;
        @media screen and (width <= 670px) {
          left: 0;
          width: 100%;
        }
      }
      .assessment-modal-btn {
        position: relative;
        box-sizing: border-box;
        width: 132px;
        height: 34px;
        padding-bottom: 3px;
        font-family: "Noto Sans JP", sans-serif;
        font-size: 14px;
        color: #3296d2;
        background-color: #ffffff;
        border: #3296d2 solid 1px;
        border-radius: 5px;
        &:nth-child(2) {
          margin-left: 20px;
          @media screen and (width <= 670px) {
            margin-left: 10px;
          }
        }
        &:hover {
          color: #ffffff;
          background-color: #3296d2;
          &.pre-btn::before {
            border-top: 2px solid #ffffff;
            border-right: 2px solid #ffffff;
          }
          &.next-btn::before {
            border-top: 2px solid #ffffff;
            border-right: 2px solid #ffffff;
          }
        }
        &.pre-btn {
          span {
            padding-left: 5px;
          }
          &::before {
            position: absolute;
            top: 0;
            bottom: 0;
            left: 13px;
            box-sizing: border-box;
            width: 8px;
            height: 8px;
            margin: auto;
            content: "";
            border-top: 2px solid #3296d2;
            border-right: 2px solid #3296d2;
            transform: rotate(-135deg);
          }
        }
        &.next-btn {
          span {
            padding-right: 5px;
          }
          &::before {
            position: absolute;
            top: 0;
            right: 13px;
            bottom: 0;
            box-sizing: border-box;
            width: 8px;
            height: 8px;
            margin: auto;
            content: "";
            border-top: 2px solid #3296d2;
            border-right: 2px solid #3296d2;
            transform: rotate(45deg);
          }
        }
        &.close-btn {
          color: #ffffff;
          background-color: #3296d2;
        }
      }
    }
  }

  /* モーダル固有のクラス名称ではない */
  /* 取引先の登録を受け付けました　assurance_registration_confirm.component.ts */
  .popup-object01 {
    width: 480px !important;
    height: 126px !important;
  }
}

/* modal-main-wrapよりも上の要素 */
.modal-area .modal-box {
  /* 特約内容の確認　opt_agreement_conclusion_modal.html */
  .inner-area:has(.opt-agreement-modal) {
    @media screen and (width <= 670px) {
      height: fit-content !important;
    }
    .modal-main-wrap {
      @media screen and (width <= 670px) {
        row-gap: 8px;
      }
    }
  }

  /* URIHOアラート通知一覧　assurances.html */
  .inner-area:has(.alert-list-modal) {
    padding-top: 50px;
    margin-top: -50px;
  }

  /* URIHO診断モーダル */
  &:has(.assurance-form-detail) {
    width: 570px;
    @media screen and (width <= 670px) {
      width: 90%;
    }
  }
}

/* 対応要検討
----------------------------------------------------------------------------------------------- */
@media screen and (width <= 940px) {
  .modal-area
    .modal-box:not(
      .first-login,
      .last-slide,
      .per-year-slide,
      .start-assuring,
      .after-assuring-follow,
      .about-assure-target
    )
    .inner-area
    .modal-main-wrap:not(
      .opt-agreement-modal,
      .modal-change-plan,
      .confirm-modal-change-plan,
      .assurance-form-detail
    )
    p,
  .modal-area
    .modal-box:not(
      .first-login,
      .last-slide,
      .per-year-slide,
      .start-assuring,
      .after-assuring-follow
    )
    .inner-area
    .modal-main-wrap:not(
      .opt-agreement-modal,
      .modal-change-plan,
      .confirm-modal-change-plan
    )
    p
    > .co-fcred.co-b {
    font-size: 13px !important;
  }
  .modal-area
    .modal-box:not(
      .first-login,
      .per-year-slide,
      .start-assuring,
      .after-assuring-follow
    )
    .modal-main-wrap:not(.modal-change-plan, .confirm-modal-change-plan)
    .co-b {
    font-size: 19px !important;
  }
  .modal-area
    .modal-box:not(.per-year-slide, .start-assuring)
    .modal-main-wrap:not(.modal-change-plan, .confirm-modal-change-plan)
    .co-b
    span {
    font-size: 16px !important;
  }
}
@media screen and (width <= 670px) {
  /* 支払い遅延・倒産の報告について(通常:delay-reports-modalと強制表示:after-assuring-follow) */
  ::-webkit-full-page-media,
  :future,
  :root
    .modal-area.popup:not(.slide-1)
    .modal-box.after-assuring-follow
    .inner-area
    .modal-main-wrap
    p:nth-child(2) {
    word-break: break-all;
  }
}

html {
  height: 100%;
  background: #ffffff;
}
main {
  display: block;
}
body {
  width: 100%;
  height: 100%;
  font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
  font-size: 14px;
  line-height: 155%;
  color: #3c3c3c;
  background: #ffffff;
  -webkit-text-size-adjust: none;
}
* {
  word-break: break-all;
}
label {
  cursor: pointer;
}
a {
  overflow: hidden;
  outline: none;
}
a:link {
  color: #3296d2;
  text-decoration: none;
}
a:visited {
  color: #3296d2;
  text-decoration: none;
}
a:hover {
  color: #3296d2;
  text-decoration: underline;
}
a:active {
  color: #3296d2;
}
::-webkit-input-placeholder {
  color: #9c9c9c;
}
:-ms-input-placeholder {
  color: #9c9c9c !important;
}
:-moz-placeholder {
  color: #9c9c9c;
}

/* input,textarea,select要素
----------------------------------------------------------------------------------------------- */
/*** 各width ***/
input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="search"],
textarea {
  padding: 4px 5px;
  font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
  font-size: 14px;
  color: #3c3c3c;
  -webkit-appearance: none;
  -moz-appearance: none;
  appearance: none;
  background-color: #fcfcfc;
  border: 1px #c3c3c3 solid;
  border-radius: 3px;
}
input[type="text"]:not(:target) {
  padding: 2px 0\9;
}
input[type="text"],
input[type="password"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="search"] {
  min-height: 1.6em;
}
input[type="text"]:hover,
input[type="password"]:hover,
input[type="email"]:hover,
input[type="tel"]:hover,
input[type="number"]:hover,
input[type="search"]:hover,
.slct-pldwn > .slct-area:hover,
textarea:hover {
  outline: medium none;
  background-color: #ffffff;
}
input[type="text"]:focus,
input[type="password"]:focus,
input[type="email"]:focus,
input[type="tel"]:focus,
input[type="number"]:focus,
input[type="search"]:focus,
textarea:focus {
  color: #222222;
  outline: medium none;
  background-color: #ffffff;
  border: 1px #14b4b4 solid;
}
input[type="checkbox"] {
  margin: 0 8px 1px 0;
  vertical-align: middle;
  cursor: pointer;
}
input[type="radio"] {
  margin: 0 5px 0 3px;
}
.v-long {
  width: 98%;
}
.m-long {
  width: 81%;
}
.long {
  width: 70%;
}
.s-long {
  width: 60%;
}
.middle {
  width: 38.2%;
}
.short {
  width: 26.5%;
}
.v-short {
  width: 18.65%;
}
.vv-short {
  width: 4em;
}
.vvv-short {
  width: 17px;
}
select.error,
input.error[type="text"],
input.error[type="password"],
input.error[type="email"],
input.error[type="tel"],
input.error[type="number"],
input.error[type="search"],
textarea.error,
input.error[type="text"]:hover,
.input.error[type="password"]:hover,
input.error[type="tel"]:hover,
.input.error[type="number"]:hover,
input.error[type="search"]:hover,
.error textarea:hover,
input.error[type="text"]:focus,
.input.error[type="password"]:focus,
input.error[type="tel"]:focus,
.input.error[type="number"]:focus,
input.error[type="search"]:focus,
.error textarea:focus,
.slct-pldwn.error .slct-area,
.slct-pldwn.error .slct-area-on,
.slct-pldwn.error ul {
  border-color: #f5646e;
}
input[type="submit"]:focus {
  outline: none;
}
textarea:disabled,
input:disabled,
text:disabled {
  background-color: #ececec !important;
}
select {
  font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
  font-size: 14px;
  color: #3c3c3c;
  border: 1px solid #cccccc;
  border-radius: 3px;
}
select.slt-small {
  padding: 2px 0 0 4px;
}
select.slt-medium {
  padding: 5px 5px 3px 4px;
}

/* IEの×ボタン無効化 */
input::-ms-clear {
  display: none;
}
figure {
  margin: 0;
}
pre {
  font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
}

body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
form,
fieldset,
input,
p,
blockquote,
th,
td {
  padding: 0;
  margin: 0;
  vertical-align: baseline;
}
html {
  overflow-y: scroll;
}
h1,
h2,
h3,
h4,
h5,
h6 {
  font-size: 100%;
  font-weight: normal;
}
ol,
ul {
  list-style: none;
}
img {
  border: 0;
}
table {
  border-spacing: 0;
  border-collapse: collapse;
}
th {
  text-align: left;
}
strong,
th {
  font-style: normal;
  font-weight: normal;
}

html,
body {
  width: 100%;
  height: 100%;
  margin: 0;
}
body,
div,
dl,
dt,
dd,
ul,
ol,
li,
h1,
h2,
h3,
h4,
h5,
h6,
pre,
form,
fieldset,
input,
p,
blockquote,
th,
td {
  padding: 0;
  margin: 0;
  vertical-align: baseline;
}
form {
  margin: 0;
}
img {
  border: 0;
}
.no-border {
  border: 0 !important;
}
button {
  box-sizing: content-box;
  cursor: pointer;
}
button:focus {
  outline: 0;
}

/* リンク
----------------------------------------------------------------------------------------------- */
/* ロールオーバー */
a:hover.co-onmouse,
a:active.co-onmouse {
  _width: auto; /* IEのバグ対策 */

  /* IEはA:hoverやA:activeにサイズ指定しないと画像が切換らない */
  text-decoration: none;
}
.co-onmouseover,
a:visited .co-onmouseover {
  display: none;
}
a:hover .co-onmouseover,
a:active .co-onmouseover {
  display: inline;
}
a:link .co-onmouseout,
a:visited .co-onmouseout {
  display: inline;
}
a:hover .co-onmouseout,
a:active .co-onmouseout {
  display: none;
}

/* 文中リンク */
.co-writing-link {
  vertical-align: middle !important;
}
.co-writing-link:link,
.co-writing-link:active,
.co-writing-link:visited {
  display: inline-block;
  margin: 0 4px;
  text-decoration: underline;
}
.co-writing-link:hover {
  text-decoration: none !important;
}

/* 三角テキストリンク */
a.co-arrow-link {
  padding-top: 4px;
  padding-right: 18px;
  letter-spacing: 0.5px;
  background: url(/web/img/pre/icon/img_icon_arrow.gif) center right no-repeat;
  background-size: 7px 12px;
}

/* 白字テキストリンク */
a.co-white-link {
  position: relative;
  z-index: 1;
  display: inline-block;
  padding: 18px 10px 0;
  font-size: 14px;
  line-height: 85%;
  color: #ffffff;
  border: none;
}
.co-white-link::after {
  position: absolute;
  top: 62%;
  z-index: 10;
  display: inline-block;
  width: 7px;
  height: 7px;
  content: "";
  border-top: solid 1px #ffffff;
  border-right: solid 1px #ffffff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}

@media screen and (width <= 940px) and (width >= 476px) {
  a.co-white-link {
    padding-bottom: 16px;
  }
  .co-white-link::after {
    top: 41%;
  }
}

/* 別窓 */
.co-win-link {
  padding-left: 21px;
  background: url(/web/img/common/icon/link_window_00.png) no-repeat;
  background-position: 0 50%;
  background-size: 15px;
}

/* 装飾、余白、その他
----------------------------------------------------------------------------------------------- */

/* display */
.dsply-none {
  display: none !important;
}
.dsply-in {
  display: inline !important;
}
.dsply-blk {
  display: block !important;
}
.dsply-inblk {
  display: inline-block !important;
}
.dsply-flex {
  display: flex !important;
}
.flex-jc-start {
  justify-content: start !important;
}
.flex-jc-center {
  justify-content: center !important;
}
.flex-jc-end {
  justify-content: end !important;
}
.flex-align-center {
  align-items: center !important;
}

/* rwd時デバイス別で非表示 */
/* PC */
@media screen and (width >= 941px) {
  .co-ts-only,
  .co-tb-only,
  .co-sp-only {
    display: none !important;
  }
}

/* TAB */
@media screen and (width <= 940px) and (width >= 671px) {
  .co-pc-only,
  .co-sp-only {
    display: none !important;
  }
}
@media screen and (width >= 671px) {
  .co-pt-only {
    display: block !important;
  }
}

/* SP */
@media screen and (width <= 670px) {
  .co-pc-only,
  .co-tb-only,
  .co-pt-only {
    display: none !important;
  }
}

/* margin */
.co-m0 {
  margin: 0 !important;
}
.co-m2 {
  margin: 2px !important;
}
.co-m3 {
  margin: 3px !important;
}
.co-m5 {
  margin: 5px !important;
}
.co-m10 {
  margin: 10px !important;
}
.co-m15 {
  margin: 15px !important;
}
.co-m20 {
  margin: 20px !important;
}
.co-m25 {
  margin: 25px !important;
}
.co-m30 {
  margin: 30px !important;
}
.co-m35 {
  margin: 35px !important;
}
.co-m40 {
  margin: 40px !important;
}
.co-m50 {
  margin: 50px !important;
}

/* margin-top */
.co-mt0 {
  margin-top: 0 !important;
}
.co-mt2 {
  margin-top: 2px !important;
}
.co-mt3 {
  margin-top: 3px !important;
}
.co-mt5 {
  margin-top: 5px !important;
}
.co-mt8 {
  margin-top: 8px !important;
}
.co-mt10 {
  margin-top: 10px !important;
}
.co-mt15 {
  margin-top: 15px !important;
}
.co-mt20 {
  margin-top: 20px !important;
}
.co-mt25 {
  margin-top: 25px !important;
}
.co-mt30 {
  margin-top: 30px !important;
}
.co-mt35 {
  margin-top: 35px !important;
}
.co-mt40 {
  margin-top: 40px !important;
}
.co-mt50 {
  margin-top: 50px !important;
}

/* margin-bottom */
.co-mb0 {
  margin-bottom: 0 !important;
}
.co-mb2 {
  margin-bottom: 2px !important;
}
.co-mb3 {
  margin-bottom: 3px !important;
}
.co-mb5 {
  margin-bottom: 5px !important;
}
.co-mb10 {
  margin-bottom: 10px !important;
}
.co-mb15 {
  margin-bottom: 15px !important;
}
.co-mb20 {
  margin-bottom: 20px !important;
}
.co-mb25 {
  margin-bottom: 25px !important;
}
.co-mb30 {
  margin-bottom: 30px !important;
}
.co-mb35 {
  margin-bottom: 35px !important;
}
.co-mb40 {
  margin-bottom: 40px !important;
}
.co-mb50 {
  margin-bottom: 50px !important;
}
.co-mb60 {
  margin-bottom: 60px !important;
}

/* margin-left */
.co-ml0 {
  margin-left: 0 !important;
}
.co-ml2 {
  margin-left: 2px !important;
}
.co-ml3 {
  margin-left: 3px !important;
}
.co-ml5 {
  margin-left: 5px !important;
}
.co-ml10 {
  margin-left: 10px !important;
}
.co-ml15 {
  margin-left: 15px !important;
}
.co-ml20 {
  margin-left: 20px !important;
}
.co-ml25 {
  margin-left: 25px !important;
}
.co-ml30 {
  margin-left: 30px !important;
}
.co-ml35 {
  margin-left: 35px !important;
}
.co-ml40 {
  margin-left: 40px !important;
}
.co-ml50 {
  margin-left: 50px !important;
}
.co-ml-auto {
  margin-left: auto !important;
}

/* margin-right */
.co-mr0 {
  margin-right: 0 !important;
}
.co-mr2 {
  margin-right: 2px !important;
}
.co-mr3 {
  margin-right: 3px !important;
}
.co-mr5 {
  margin-right: 5px !important;
}
.co-mr10 {
  margin-right: 10px !important;
}
.co-mr15 {
  margin-right: 15px !important;
}
.co-mr20 {
  margin-right: 20px !important;
}
.co-mr25 {
  margin-right: 25px !important;
}
.co-mr30 {
  margin-right: 30px !important;
}
.co-mr35 {
  margin-right: 35px !important;
}
.co-mr40 {
  margin-right: 40px !important;
}
.co-mr50 {
  margin-right: 50px !important;
}

/* padding */
.co-p0 {
  padding: 0 !important;
}
.co-p2 {
  padding: 2px !important;
}
.co-p3 {
  padding: 3px !important;
}
.co-p5 {
  padding: 5px !important;
}
.co-p10 {
  padding: 10px !important;
}
.co-p15 {
  padding: 15px !important;
}
.co-p20 {
  padding: 20px !important;
}
.co-p25 {
  padding: 25px !important;
}
.co-p30 {
  padding: 30px !important;
}
.co-p35 {
  padding: 35px !important;
}
.co-p40 {
  padding: 40px !important;
}
.co-p50 {
  padding: 50px !important;
}

/* padding-top */
.co-pt0 {
  padding-top: 0 !important;
}
.co-pt2 {
  padding-top: 2px !important;
}
.co-pt3 {
  padding-top: 3px !important;
}
.co-pt5 {
  padding-top: 5px !important;
}
.co-pt10 {
  padding-top: 10px !important;
}
.co-pt15 {
  padding-top: 15px !important;
}
.co-pt20 {
  padding-top: 20px !important;
}
.co-pt25 {
  padding-top: 25px !important;
}
.co-pt30 {
  padding-top: 30px !important;
}
.co-pt35 {
  padding-top: 35px !important;
}
.co-pt40 {
  padding-top: 40px !important;
}
.co-pt50 {
  padding-top: 50px !important;
}

/* padding-bottom */
.co-pb0 {
  padding-bottom: 0 !important;
}
.co-pb2 {
  padding-bottom: 2px !important;
}
.co-pb3 {
  padding-bottom: 3px !important;
}
.co-pb5 {
  padding-bottom: 5px !important;
}
.co-pb10 {
  padding-bottom: 10px !important;
}
.co-pb15 {
  padding-bottom: 15px !important;
}
.co-pb20 {
  padding-bottom: 20px !important;
}
.co-pb25 {
  padding-bottom: 25px !important;
}
.co-pb30 {
  padding-bottom: 30px !important;
}
.co-pb35 {
  padding-bottom: 35px !important;
}
.co-pb40 {
  padding-bottom: 40px !important;
}
.co-pb50 {
  padding-bottom: 50px !important;
}

/* padding-left */
.co-pl0 {
  padding-left: 0 !important;
}
.co-pl2 {
  padding-left: 2px !important;
}
.co-pl3 {
  padding-left: 3px !important;
}
.co-pl5 {
  padding-left: 5px !important;
}
.co-pl10 {
  padding-left: 10px !important;
}
.co-pl15 {
  padding-left: 15px !important;
}
.co-pl20 {
  padding-left: 20px !important;
}
.co-pl25 {
  padding-left: 25px !important;
}
.co-pl30 {
  padding-left: 30px !important;
}
.co-pl35 {
  padding-left: 35px !important;
}
.co-pl40 {
  padding-left: 40px !important;
}
.co-pl50 {
  padding-left: 50px !important;
}

/* padding-right */
.co-pr0 {
  padding-right: 0 !important;
}
.co-pr2 {
  padding-right: 2px !important;
}
.co-pr3 {
  padding-right: 3px !important;
}
.co-pr5 {
  padding-right: 5px !important;
}
.co-pr10 {
  padding-right: 10px !important;
}
.co-pr15 {
  padding-right: 15px !important;
}
.co-pr20 {
  padding-right: 20px !important;
}
.co-pr25 {
  padding-right: 25px !important;
}
.co-pr30 {
  padding-right: 30px !important;
}
.co-pr35 {
  padding-right: 35px !important;
}
.co-pr40 {
  padding-right: 40px !important;
}
.co-pr50 {
  padding-right: 50px !important;
}

/* text-align */
.co-tal {
  text-align: left !important;
}
.co-tar {
  text-align: right !important;
}
.co-tac {
  text-align: center !important;
}

/* vertical-align */
.co-vabase {
  vertical-align: baseline !important;
}
.co-vatop {
  vertical-align: top !important;
}
.co-vamid {
  vertical-align: middle !important;
}
.co-vabot {
  vertical-align: bottom !important;
}

/* font-weight */
.co-fnr {
  font-weight: normal !important;
}
.co-b {
  font-weight: bold !important;
}

/* font-size */
.co-fs10 {
  font-size: 10px !important;
}
.co-fs11 {
  font-size: 11px !important;
}
.co-fs12 {
  font-size: 12px !important;
}
.co-fs13 {
  font-size: 13px !important;
}
.co-fs14 {
  font-size: 14px !important;
}
.co-fs15 {
  font-size: 15px !important;
}
.co-fs16 {
  font-size: 16px !important;
}
.co-fs17 {
  font-size: 17px !important;
}
.co-fs18 {
  font-size: 18px !important;
}
.co-fs19 {
  font-size: 19px !important;
}
.co-fs20 {
  font-size: 20px !important;
}
.co-fs21 {
  font-size: 21px !important;
}
.co-fs22 {
  font-size: 22px !important;
}
.co-fs23 {
  font-size: 23px !important;
}
.co-fs24 {
  font-size: 24px !important;
}
.co-fs25 {
  font-size: 25px !important;
}
.co-fs26 {
  font-size: 26px !important;
}

/* font-color */
.co-fcblack {
  color: #3c3c3c !important;
}
.co-fcred {
  color: #f5646e !important;
}
.co-fcred02 {
  color: #e90000 !important;
}
.co-fcwhite {
  color: #ffffff !important;
}
.co-fcgray {
  color: #9c9c9c !important;
}

/* font-color with bold */
.co-fcblack-b {
  font-weight: bold;
  color: #3c3c3c !important;
}
.co-fcblack-red {
  font-weight: bold;
  color: #f5646e !important;
}
.co-fcwhite-b {
  font-weight: bold;
  color: #ffffff !important;
}
.co-fcgray-b {
  font-weight: bold;
  color: #9c9c9c !important;
}

/* background */
.co-bgwhite {
  background-color: #ffffff !important;
}
.co-bgblk {
  background-color: #000000 !important;
}
.co-bggray {
  background-color: #f6f6f6 !important;
}
.co-bgdisable {
  background-color: #ececec !important;
}

/* text-shadow */
.co-shadow-blk {
  color: #ffffff !important;
  text-shadow: -1px -1px 0 #3c3c3c;
}
.co-shadow-wht {
  text-shadow: 1px 1px 0 #ffffff !important;
}

/* float */
.co-fl {
  float: left !important;
}
.co-fr {
  float: right !important;
}

/* cursor */
.co-cp {
  cursor: pointer !important;
}

/* white-space */
.co-wsn {
  white-space: nowrap !important;
}

/* ぶら下げインデント */
.co-hang-indent08 {
  padding-left: 0.8em !important;
  text-indent: -0.8em !important;
}
.co-hang-indent10 {
  padding-left: 1em !important;
  text-indent: -1em !important;
}
.co-hang-indent15 {
  padding-left: 1.5em !important;
  text-indent: -1.5em !important;
}

/* clearfix */
.co-clf::after {
  clear: both;
  display: block;
  visibility: hidden;
  height: 0;
  font-size: 0;
  content: ".";
}
.co-clf {
  display: inline-block;
}

/* Hides from IE-mac \ */
* html .co-clf {
  height: 1%;
}
.co-clf {
  display: block;
}

/* End hide from IE-mac */

/* positon */
.co-pos-r {
  position: relative !important;
}
.co-pos-a {
  position: absolute !important;
}

/* border */
.co-bdr-top {
  border-top: 1px solid #d3d3d3 !important;
}
.co-bdr-none {
  border: none !important;
}
.co-delimiter-border-top {
  padding-top: 30px;
  margin-top: 40px;
  border-top: 1px solid #cccccc;
}

/* width */
.co-width-reset {
  width: auto !important;
}
.co-width-100per {
  width: 100% !important;
}
.co-width-80per {
  width: 80% !important;
}
.co-width-20per {
  width: 20% !important;
}
.co-width-150px {
  width: 150px !important;
}

/* scroll-hidden */
.co-overflow-h {
  overflow: hidden;
}

/* flex系 */
.jstfy-cntnt-center {
  justify-content: center;
}

/* list-style */
.co-ul-desc {
  margin-left: 1.5em;
  list-style-type: disc;
}

/* シンプルヘッダー
----------------------------------------------------------------------------------------------- */
#simple-header {
  position: absolute;
  top: 0;
  z-index: 20;
  width: 100%;
  min-height: 56px;
  background: #ffffff;
  box-shadow: 0 -4px 7px 0 #000000;
}
#simple-header.simple-header-fixed {
  position: fixed;
}
#simple-header .header-inner {
  width: 96%;
  max-width: 1440px;
  margin: 0 auto;
}
#simple-header .header-inner h1 {
  float: left;
  font-size: 35px;
  font-weight: bold;
  line-height: 0.8;
}
#simple-header .header-inner h1 > a {
  display: block;
  padding: 12px 0 8px;
}
#simple-header .header-inner h1 > a:hover {
  text-decoration: none;
}
#simple-header .header-inner h1 > a:link,
#simple-header .header-inner h1 > a:visited {
  color: #3c3c3c;
}
#simple-header .header-inner h1 > a > img {
  width: 148px;
}

@media screen and (width <= 670px) {
  #simple-header .header-inner h1 > a > img {
    width: 120px;
  }
}

/* シンプルフッター
----------------------------------------------------------------------------------------------- */
#simple-footer {
  position: absolute;
  bottom: 0;
  width: 100%;
  padding: 20px 0 18px;
  font-size: 12px;
  font-weight: bold;
  color: #ffffff;
  text-align: center;
  background-color: #3c4646;
}

/* シンプルフッター02
----------------------------------------------------------------------------------------------- */
#simple-footer-02 {
  position: absolute;
  width: 100%;
  min-width: 1024px;
  color: #ffffff;
  text-align: center;
  background-color: #3c4646;
}
#simple-footer-02 .inner {
  padding: 28px 0 14px;
}
#simple-footer-02 .inner a {
  display: inline-block;
  margin-right: 50px;
  color: #ffffff;
}
#simple-footer-02 .inner span {
  display: none;
  vertical-align: top;
}
#simple-footer-02 .inner a:last-child {
  margin-right: 0;
}
#simple-footer-02 .copyright {
  padding-bottom: 14px;
  font-size: 11px;
  font-weight: bold;
}

/* ぱんくず
----------------------------------------------------------------------------------------------- */
.co-topicpath {
  display: flex;
  align-items: center;
  font-size: 12px;
}
.co-topicpath li:not(:last-child)::after {
  display: inline-block;
  width: 6px;
  height: 6px;
  margin: 0 7px 2px 4px;
  vertical-align: middle;
  content: "";
  border-top: 1px #333333 solid;
  border-right: 1px #333333 solid;
  transform: rotate(45deg);
}
main .co-topicpath {
  margin: 20px auto 0;
}

/* ページャー
----------------------------------------------------------------------------------------------- */
.co-pager {
  font-size: 14px;
  font-weight: bold;
  color: #9c9c9c;
  text-align: center;
}
.co-pager > ul > li {
  display: inline-block;
  padding: 0 8px;
  line-height: 0.8;
  list-style: none;
}
.co-pager > ul > li:last-child {
  padding-right: 0;
}
.co-pager .back {
  padding: 2px 12px 0 0;
  border-right: 1px solid #9c9c9c;
}
.co-pager .next {
  padding: 2px 0 0 12px;
  border-left: 1px solid #9c9c9c;
}
.co-pager .on,
.co-pager .pager-overflow {
  color: #3c3c3c;
}

/* ボーダー
----------------------------------------------------------------------------------------------- */
.co-dl-btm-border {
  display: flex;
  justify-content: space-between;
  padding: 10px 0;
  border-bottom: 1px solid #d3d3d3;
}
.co-dl-btm-border dt {
  box-sizing: border-box;
  width: 70%;
  padding-left: 20px;
  text-align: left;
}
.co-dl-btm-border dd {
  box-sizing: border-box;
  width: 30%;
  padding-right: 20px;
  text-align: right;
}
.co-dl-btm-border.column {
  flex-direction: column;
}
.co-dl-btm-border.column > dt,
.co-dl-btm-border.column > dd {
  width: 100%;
  padding-left: 20px;
  text-align: left;
}
.co-dl-btm-border.column dd {
  font-size: 13px;
}
.co-dl-btm-border.total {
  width: 300px;
  margin-left: auto;
}
.co-dl-btm-border.total dt {
  width: 45%;
}
.co-dl-btm-border.total dd {
  width: 55%;
}

/* アイコン
----------------------------------------------------------------------------------------------- */
.co-icon-information {
  display: inline-block;
  padding-left: 22px;
  vertical-align: bottom;
  background: url(/web/img/common/icon/information_00.png) no-repeat scroll;
  background-position: 2px 1px;
  background-size: 16px;
}
.co-icon-link {
  display: inline-block;
  padding-left: 16px;
  vertical-align: bottom;
  background: url(/web/img/common/icon/link_arrow_00.png) no-repeat scroll;
  background-position: 2px 3px;
  background-size: 8px 13px;
}
.co-icon-link2 {
  display: inline-block;
  padding-left: 23px;
  vertical-align: bottom;
  background: url(/web/img/common/icon/link_window_00.png) no-repeat scroll;
  background-position: 2px 3px;
  background-size: 16px 14px;
}

/* カレンダー */
.co-cld-txt {
  position: absolute;
  width: 15px;
  height: 7px;
  padding: 4px 6px 4px 4px;
  cursor: pointer;
  background: url(/web/img/common/icon/calendar_00.png) no-repeat;
  background-position: top;
}
.co-cld-txt:hover {
  background-position: bottom;
}

/* 削除ボタン */
.co-dlt-txt {
  position: absolute;
  width: 16px;
  height: 16px;
  cursor: pointer;
  background: url(/web/img/common/icon/delete_00.png) no-repeat;
  background-position: top;
}
.co-dlt-txt:hover {
  background-position: bottom;
}

/*** ？マーク ***/
.co-question-mark {
  position: relative;
}
.co-question-mark > span {
  display: block;
  width: 19px;
  height: 19px;
  cursor: pointer;
  background: url(/web/img/common/icon/question_00.png);
  background-size: cover;
}
.co-question-mark > span:hover {
  background-position: bottom;
}
.co-question-mark > p {
  position: absolute;
  z-index: 20;
  display: none;
  width: 201px;
  padding: 13px 12px 12px 15px;
  margin-top: 5px;
  font-weight: normal;
  color: #6c6c6c;
  background: #fffff0;
  border: 1px solid #d3d3d3;
  border-radius: 5px;
  box-shadow: 0 0 2px 1px rgb(150 150 150 / 40%);
}
.co-question-mark > span:hover + p {
  display: block;
}

/*** !マーク ***/
.co-exclamation-mark {
  position: relative;
  margin-left: 3px;
}
.co-exclamation-mark > span {
  display: block;
  width: 19px;
  height: 19px;
  cursor: pointer;
  background: url(/web/img/common/icon/exclamation_00.png) top center / cover;
}
.co-exclamation-mark > span:hover {
  background-position: bottom;
}
.co-exclamation-mark > p {
  position: absolute;
  z-index: 20;
  display: none;
  width: 201px;
  padding: 13px 12px 12px 15px;
  margin-top: 5px;
  font-weight: normal;
  color: #6c6c6c;
  background: #fffff0;
  border: 1px solid #d3d3d3;
  border-radius: 5px;
  box-shadow: 0 0 2px 1px rgb(150 150 150 / 40%);
}
.co-exclamation-mark > span:hover + p {
  display: block;
}

/*** !イエローマーク ***/
.co-yellow-exclamation-mark {
  position: relative;
  margin-left: auto;
}
.co-yellow-exclamation-mark > span {
  position: relative;
  z-index: 1;
  display: block;
  width: 27px;
  height: 23px;
  cursor: pointer;
  background: url(/web/img/common/icon/yellow_alert.png) top center / cover;
}
.co-yellow-exclamation-mark > span:hover {
  filter: brightness(0.9);
}
.co-yellow-exclamation-mark > span::before {
  position: absolute;
  top: -5px;
  right: 0;
  left: 0;
  width: 81px;
  height: 30px;
  margin: auto;
  content: "";
  transform: translateX(-27px);
}
.co-yellow-exclamation-mark > p {
  position: absolute;
  bottom: 2.6em;
  left: 100%;
  z-index: 20;
  display: none;
  width: 105px;
  padding: 10px 12px;
  font-weight: normal;
  line-height: 1.6em;
  color: #6c6c6c;
  text-align: center;
  background: #fffff0;
  border: 1px solid #d3d3d3;
  border-radius: 5px;
  box-shadow: 0 0 2px 1px rgb(150 150 150 / 40%);
  transform: translateX(-60%) translateY(13px);
}
.co-yellow-exclamation-mark > span:hover + p,
.co-yellow-exclamation-mark > p:hover {
  display: block;
}

/*** iマーク ***/
.co-information-mark {
  position: relative;
}
.co-information-mark > span {
  display: block;
  width: 16px;
  height: 16px;
  cursor: pointer;
  background: url(/web/img/common/icon/information_00.png);
  background-size: cover;
}
.co-information-mark > span:hover {
  background: url(/web/img/common/icon/information_on_00.png);
}
.co-information-mark > p {
  position: absolute;
  z-index: 101;
  display: none;
  padding: 10px 15px 8px;
  margin-top: 5px;
  font-weight: bold;
  color: #f5646e;
  text-align: left;
  background: #ffffff;
  border: 1px solid #d3d3d3;
  border-radius: 5px;
  box-shadow: 0 0 2px 1px rgb(150 150 150 / 40%);
}
.co-information-mark > span:hover + p {
  display: block;
}

/*** pdf ***/
.co-pdf-link {
  padding-left: 25px;
  background: url(/web/img/common/icon/pdf_icon_00.png) left center/contain
    no-repeat;
}

/* ボタン
----------------------------------------------------------------------------------------------- */
/*** デフォルト ***/
.co-btn {
  display: inline-block;
  margin: 0 auto;
  font-weight: bold;
  vertical-align: bottom;
  white-space: nowrap;
  zoom: 1;
}
.co-btn input {
  font-family: "メイリオ", Meiryo, "ＭＳ Ｐゴシック", sans-serif;
  cursor: pointer;
  border: none;
}
.co-btn input:focus {
  outline: none;
}
.co-btn input,
.co-btn input::-moz-focus-inner {
  outline: none;
  border: 0;
}
.co-btn > span {
  position: relative;
  display: block;
  text-align: center;
  -moz-border-radius: 5px;
  -webkit-border-radius: 5px;
  border-radius: 5px;
}
.co-btn > span > a,
.co-btn input {
  font-size: 13px;
  font-weight: bold;
  line-height: 1;
  -moz-border-radius: 3px;
  -webkit-border-radius: 3px;
  border-radius: 5px;
}
.co-btn:hover {
  cursor: pointer;
}
.co-btn:hover a,
.co-btn:hover input {
  text-decoration: none;
}
.container .co-title .co-title-r {
  float: right;
  min-width: 20px;
}

/*** サイズ ***/
/* MIN */
.co-btn-min {
  min-width: 30px;
  vertical-align: middle;
}
.co-btn-min > span > a,
.co-btn-min > span > span {
  min-width: 30px;
  padding: 9px 9px 8px;
}
.co-btn-min input {
  min-width: 45px;
  padding: 9px 9px 8px;
}
.co-btn-min:hover > span > a,
.co-btn-min:hover input {
  padding: 10px 9px 7px;
}

/* SS */
.co-btn-ss {
  min-width: 35px;
}
.co-btn-ss > span > a,
.co-btn-ss > span > span {
  min-width: 35px;
  padding: 11px 12px 9px;
}
.co-btn-ss input {
  min-width: 60px;
  padding: 11px 12px 9px;
}
.co-btn-ss:hover > span > a,
.co-btn-ss:hover input {
  padding: 12px 12px 8px;
}

/* S */
.co-btn-s {
  min-width: 50px;
}
.co-btn-s > span > a,
.co-btn-s > span > span {
  min-width: 50px;
  padding: 11px 12px 9px;
}
.co-btn-s input {
  min-width: 75px;
  padding: 11px 12px 9px;
}
.co-btn-s:hover > span > a,
.co-btn-s:hover input {
  padding: 12px 12px 8px;
}

/* M */
.co-btn-m {
  min-width: 110px;
}
.co-btn-m > span > a,
.co-btn-m > span > span {
  min-width: 110px;
  padding: 11px 12px 9px;
}
.co-btn-m input {
  min-width: 130px;
  padding: 11px 12px 9px;
}
.co-btn-m:hover > span > a,
.co-btn-m:hover input {
  padding: 12px 12px 8px;
}

/* L */
.co-btn-l {
  min-width: 134px;
}
.co-btn-l > span > a,
.co-btn-l > span > span {
  min-width: 134px;
  padding: 14px 12px 13px;
  font-size: 14px;
}
.co-btn-l input {
  min-width: 134px;
  padding: 14px 12px 13px;
  font-size: 14px;
}
.co-btn-l:hover > span > a,
.co-btn-l:hover input {
  padding: 15px 12px 12px;
}

/* LL */
.co-btn-ll {
  min-width: 174px;
}
.co-btn-ll > span > a,
.co-btn-ll > span > span {
  min-width: 174px;
  padding: 16px 12px 14px;
  font-size: 14px;
}
.co-btn-ll input {
  min-width: 174px;
  padding: 16px 12px 14px;
  font-size: 14px;
}
.co-btn-ll:hover > span > a,
.co-btn-ll:hover input {
  padding: 17px 12px 13px;
}

/* LLL */
.co-btn-lll {
  min-width: 250px;
}
.co-btn-lll > span > a,
.co-btn-lll > span > span {
  min-width: 250px;
  padding: 21px 12px 19px;
  font-size: 16px;
}
.co-btn-lll input {
  min-width: 250px;
  padding: 21px 12px 19px;
  font-size: 16px;
}
.co-btn-lll:hover > span > a,
.co-btn-lll:hover input {
  padding: 22px 12px 18px;
}

/*** 色 ***/
/* ホワイト */
.co-btn-wht {
  background-color: #fafafa;
  border-radius: 5px;
}
.co-btn-wht > span {
  border-color: #c3c3c3 #c3c3c3 #9c9c9c;
  border-style: solid;
  border-width: 1px;
}
.co-btn-wht:hover > span {
  border-color: #9c9c9c #c3c3c3 #c3c3c3;
}
.co-btn-wht > span > a,
.co-btn-wht span input {
  position: relative;
  display: block;
  color: #6c6c6c;
  background-color: #fafafa;
  background-image: -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0, #fafafa),
    color-stop(1, #fafafa)
  );
}
.co-btn-wht:hover > span > a,
.co-btn-wht:hover span input {
  background-color: #ffffff;
  background-image: -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0, #ffffff),
    color-stop(1, #ffffff)
  );
}

/* 水色 */
.co-btn-blu {
  background-color: #14b4b4;
  border-radius: 5px;
}
.co-btn-blu > span {
  border-color: #14b4b4 #14b4b4 #0c6c6c;
  border-style: solid;
  border-width: 1px;
}
.co-btn-blu:hover > span {
  border-color: #0e8282 #18c3c3 #18c3c3;
}
.co-btn-blu > span > a,
.co-btn-blu input {
  position: relative;
  display: block;
  color: #ffffff;
  background-color: #14b4b4;
  background-image: -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0, #14b4b4),
    color-stop(1, #14b4b4)
  );
}
.co-btn-blu:hover > span > a,
.co-btn-blu:hover span input {
  background-color: #18c3c3;
  background-image: -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0, #18c3c3),
    color-stop(1, #18c3c3)
  );
}

/* 黄色 */
.co-btn-yel {
  background-color: #faeb00;
  border-radius: 5px;
}
.co-btn-yel > span {
  border-color: #faeb00 #faeb00 #4b412d;
  border-style: solid;
  border-width: 1px;
}
.co-btn-yel:hover > span {
  border-color: #4b412d #fff050 #fff050;
}
.co-btn-yel > span > a,
.co-btn-yel input {
  position: relative;
  display: block;
  color: #4b412d;
  background-color: #faeb00;
  background-image: -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0, #faeb00),
    color-stop(1, #faeb00)
  );
}
.co-btn-yel:hover > span > a,
.co-btn-yel:hover span input {
  background-color: #fff050;
  background-image: -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0, #fff050),
    color-stop(1, #fff050)
  );
}

/* 黄色（グラデ） */
.co-btn-yelg {
  border-color: #c89a00;
  border-radius: 5px;
}
.co-btn-yelg > span {
  border-color: #f6ee69 #e2ae00 #754602;
  border-style: solid;
  border-width: 1px;
}
.co-btn-yelg > span > a,
.co-btn-yelg input {
  position: relative;
  display: block;
  color: #ffffff;
  background: -ms-linear-gradient(top, #fdc500 0%, #c89a00 100%);
  background: linear-gradient(top, #fdc500 0%, #c89a00 100%);
  background-color: #c89a00;
  background-image: -moz-linear-gradient(center top, #fdc500, #c89a00);
  background-image: -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0, #c89a00),
    color-stop(1, #fdc500)
  );
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#fdc500', endColorstr='#c89a00');
}
.co-btn-yelg:hover > span > a,
.co-btn-yelg:hover span input {
  background: -ms-linear-gradient(top, #c89a00 0%, #c89a00 100%);
  background: linear-gradient(top, #c89a00 0%, #c89a00 100%);
  background-color: #c89a00;
  background-image: -moz-linear-gradient(center top, #c89a00, #c89a00);
  background-image: -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0, #c89a00),
    color-stop(1, #c89a00)
  );
  filter: progid:DXImageTransform.Microsoft.gradient(GradientType=0,startColorstr='#c89a00', endColorstr='#c89a00');
}

/*** 新ボタン共通 ***/
.co-btn-new,
a:visited.co-btn-new,
a:link.co-btn-new,
a:hover.co-btn-new,
.co-btn-new:visited,
.co-btn-new:link,
.co-btn-new:hover {
  position: relative;
  top: 0;
  display: inline-block;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
  color: #ffffff;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  border: none;
  border-radius: 50px;
  transition:
    0.2s box-shadow,
    0.2s top,
    0.2s background-color;
}
.co-btn-new:not(.co-btn-disabled):hover {
  top: 2px;
}
.co-btn-new::after {
  position: absolute;
  top: 50%;
  right: 28px;
  z-index: 10;
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-top: -4px;
  content: "";
  border-top: solid 2px #ffffff;
  border-right: solid 2px #ffffff;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.co-btn-new.btn-loggedin.co-nbtn-ss::after {
  right: 16px;
}
.co-btn-new.no-arrow::after {
  content: none;
}

@media screen and (width <= 670px) {
  .menu-2 .co-btn-new::after {
    margin-top: -5px;
  }
}

/*** 新サイズ ***/
.co-nbtn-ss {
  width: 160px;
  padding: 9px 0 7px;
  margin-bottom: 2px;
}
.co-nbtn-s {
  width: 180px;
  padding: 15px 0 16px;
  margin-bottom: 2px;
}
.co-nbtn-m {
  width: 220px;
  padding: 16px 0 15px;
  margin-bottom: 2px;
}
.co-nbtn-l {
  width: 295px;
  padding: 18px 0 19px;
  font-size: 17px;
}
.co-nbtn-ll {
  width: 378px;
  padding: 34px 0 33px;
  font-size: 23px;
}
.co-nbtn-ll::after {
  right: 30px;
  width: 10px;
  height: 10px;
  margin-top: -6px;
  border-top: solid 3px #ffffff;
  border-right: solid 3px #ffffff;
}

@media screen and (width <= 940px) {
  .co-nbtn-ll {
    width: 355px;
    padding: 28px 0 30px;
    font-size: 21px;
  }
}
@media screen and (width <= 670px) {
  .co-nbtn-s {
    width: 120px;
  }
  .co-nbtn-ll {
    width: 288px;
    padding: 20px 0 19px;
    font-size: 19px;
  }
}

/* 反対の矢印 */
.co-opposition-arrow::after {
  right: auto;
  left: 20px;
  -webkit-transform: rotate(225deg);
  transform: rotate(225deg);
}

/*** 新色 ***/
/* オレンジ */
.co-btn-org {
  background-color: #fc8b28;
  box-shadow: 0 4px #c76612;
}
.co-btn-org:hover {
  background-color: #f38423;
  box-shadow: 0 1px #c76612;
}

/* 濃い水色 */
.co-btn-dblue {
  font-size: 15px;
  background-color: #0387df;
  box-shadow: 0 4px #095eb4;
}
.co-btn-dblue:hover {
  background-color: #007bcc;
  box-shadow: 0 1px #095eb4;
}

/* グリーン */
.co-btn-green {
  background-color: #0aa8a8;
  box-shadow: 0 4px #017777;
}
.co-btn-green:hover {
  background-color: #05a1a1;
  box-shadow: 0 1px #017777;
}

/* ピンク */
.co-btn-pink {
  background-color: #f5646e;
  box-shadow: 0 4px #c1464f;
}
.co-btn-pink:hover {
  background-color: #e95862;
  box-shadow: 0 1px #c1464f;
}

/* グレー */
.co-btn-gray,
a:visited.co-btn-gray {
  font-size: 15px;
  color: #333333 !important;
  background-color: #dddddd;
  box-shadow: 0 4px #8f8f8f;
}
.co-btn-gray:hover {
  background-color: #d1d1d1;
  box-shadow: 0 1px #363636;
}
.co-btn-gray::after {
  border-top: solid 2px #333333;
  border-right: solid 2px #333333;
}

/* グレー2/disable色 */
.co-btn-disabled,
.co-btn-gray2 {
  background-color: #acacac;
  box-shadow: 0 4px #8a8a8a;
}
.co-btn-gray2:hover {
  background-color: #a1a1a1;
  box-shadow: 0 1px #8a8a8a;
}
.co-btn-disabled::after {
  content: none;
}

/* 非立体ボタン用のdisable色 */
.co-btn-disabled-02 {
  color: #ffffff !important;
  cursor: default;
  background-color: #cccccc !important;
  border: #cccccc 1px solid !important;
}

/*** アイコン付き ***/
.co-btn-min .btn-icon {
  padding: 6px 10px 2px 7px;
}
.co-btn-min:hover .btn-icon {
  padding: 7px 10px 1px 7px;
}
.co-btn-ss .btn-icon,
.co-btn-s .btn-icon,
.co-btn-m .btn-icon {
  padding: 10px 16px 4px;
}
.co-btn-ss:hover .btn-icon,
.co-btn-s:hover .btn-icon,
.co-btn-m:hover .btn-icon {
  padding: 11px 16px 3px;
}
.co-btn .btn-icon > span {
  display: inline-block;
  min-height: 20px;
  padding-top: 1px;
  padding-left: 18px;
  background-repeat: no-repeat;
  background-position: left 0;
}

/* 編集アイコン */
.co-btn .btn-icon .procedure {
  background-image: url(/web/img/common/icon/procedure_00.png);
}

/*** disableボタン ***/
.co-btn-dsbl-l,
.co-btn-dsbl-ll,
.co-btn-dsbl-lll {
  line-height: 1;
  color: #ffffff;
  cursor: default !important;
  background-color: #acacac;
  border-bottom: 1px solid #8a8a8a;
  border-radius: 5px;
}
.co-btn-dsbl-l > span,
.co-btn-dsbl-ll span {
  padding: 15px 13px 13px;
  font-size: 14px;
}
.co-btn-dsbl-lll {
  padding: 22px 12px 19px;
  font-size: 16px;
}
.co-btn-dsbl-ll span {
  padding: 17px 13px 14px;
}
.co-btn-dsbl-l > span {
  min-width: 134px;
}
.co-btn-dsbl-ll span {
  min-width: 174px;
}
.co-btn-dsbl-lll span {
  min-width: 252px;
}

/*** 郵便番号ボタン ***/
.co-btn-postalcode > span > span {
  display: block;
  min-width: 30px;
  padding: 4px 9px;
  font-size: 13px;
  color: #6c6c6c;
}
.co-btn-postalcode:hover > span > span {
  padding: 5px 9px 3px;
  background: #ffffff;
  border-radius: 5px;
}

/* hoverを付ける場合 */
.co-btn .hover-important:hover {
  text-decoration: underline !important;
}

/*** 他 ***/
.co-btn-hover-floaty {
  padding: 4px 12px 2px 9px;
  font-size: 13px;
  font-weight: bold;
  vertical-align: middle;
  color: #14b4b4 !important;
  text-decoration: none !important;
  cursor: pointer;
  background: #ffffff;
  border: 2px solid #14b4b4;
  border-radius: 20px;
  transition: all 0.2s;
}
.co-btn-hover-floaty:hover {
  color: #ffffff !important;
  background: #14b4b4;
  border: 2px solid #14b4b4;
}

/*** ダウンロードアイコン ***/
.co-btn-download::after {
  position: static;
  width: 21px;
  height: 20px;
  margin-top: auto;
  margin-left: 7px;
  vertical-align: top;
  content: "";
  background: url(/web/img/common/icon/download_icon_00.png) center / contain
    no-repeat;
  border: none;
  transform: none;
}

/* ローディング
----------------------------------------------------------------------------------------------- */
.co-loading-area {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 1001;
  width: 64px;
  height: 64px;
  margin: -32px 0 0 -32px;
  background: #14b4b4;
  border-radius: 5px;
}
.co-loading-area img {
  border-radius: 5px;
}

/* プルダウン
----------------------------------------------------------------------------------------------- */
.slct-pldwn {
  position: relative;
  display: inline-block;
  vertical-align: middle;
}
.slct-pldwn-value {
  color: #ffffff;
  background-color: #14b4b4;
}
.slct-area {
  position: relative;
  z-index: 3;
  padding: 4px 0.4em 3px;
  cursor: pointer;
  background-color: #fcfcfc;
  border: 1px solid #cccccc;
  border-radius: 3px;
}
.slct-area-on {
  border-top: 1px solid #14b4b4;
  border-right: 1px solid #14b4b4;
  border-left: 1px solid #14b4b4;
}
.slct-txt {
  float: left;
  line-height: 1.6em;
}
.slct-btn {
  float: right;
  width: 12px;
  font-size: 10px;
  color: #999999;
}
.slct-area:active .slct-btn,
.slct-area-on .slct-btn {
  color: #6c6c6c;
}

/*** プルダウンの中身 ***/
.slct-pldwn ul {
  position: absolute;
  top: 29px;
  z-index: 4;
  display: none;
  max-height: 200px;
  overflow-y: auto;
  background: none repeat scroll 0 0 #ffffff;
  border-right: 1px solid #14b4b4;
  border-bottom: 1px solid #14b4b4;
  border-left: 1px solid #14b4b4;
  box-shadow: 1px 1px 3px 0 rgb(150 150 150 / 30%);
}
.slct-pldwn ul li {
  padding: 4px 5px 3px;
  text-align: left;
  border-bottom: 1px dotted #cccccc;
}
.slct-pldwn ul li:last-child {
  border-bottom: none;
}
.slct-pldwn ul li:hover {
  color: #ffffff;
  cursor: pointer;
  background-color: #14b4b4;
}
.upper-number-area .slct-btn {
  margin-top: 1px;
}

/*** プルダウンサイズ ***/
.slct-pldwn-s .slct-area {
  width: 5em;
}
.slct-pldwn-s ul {
  min-width: 5.8em;
}
.slct-pldwn-m .slct-area {
  width: 12em;
}
.slct-pldwn-m ul {
  min-width: 12.8em;
}
.slct-pldwn-l .slct-area {
  width: 13.1em;
}
.slct-pldwn-l ul {
  min-width: 13.9em;
}
.slct-pldwn-ll .slct-area {
  width: 22.1em;
}
.slct-pldwn-ll ul {
  min-width: 22.9em;
}

/*** IE9対応 placeholder ***/
.placeholder {
  color: #bab5b5 !important;
}

/* ui bootstrap Modalの表示位置調整
----------------------------------------------------------------------------------------------- */
.center-modal .modal-dialog {
  margin-top: 10%;
}

/* .ui-datepicker調整
----------------------------------------------------------------------------------------------- */
.ui-datepicker {
  z-index: 1000 !important;
}

/* 全角制御
----------------------------------------------------------------------------------------------- */
.co-ime-disabled {
  ime-mode: disabled;
}

/* disable系
----------------------------------------------------------------------------------------------- */
.co-error-disabled {
  cursor: default;
  opacity: 0.5;
}

/* ファイルアップロードボタン
----------------------------------------------------------------------------------------------- */
.co-file-uploder {
  position: relative;
  width: 60%;
  margin: 0 auto;
  text-align: center;
}
.co-file-uploder > input {
  box-sizing: border-box;
  width: 80%;
  height: 32px;
  background-color: #fcfcfc !important;
  border-right: none;
  border-radius: 3px 0 0 3px;
}
.co-file-uploder .btn {
  position: relative;
  box-sizing: border-box;
  display: inline-block;
  width: 20%;
  height: 32px;
  padding: 0.45em 0;
  vertical-align: top;
  cursor: pointer;
  background-color: #fafafa;
  border: 1px solid #c3c3c3;
  border-radius: 0 3px 3px 0;
}
.co-file-uploder:hover .btn {
  background-color: #ffffff;
}
.co-file-uploder input[type="file"] {
  position: absolute;
  top: 0;
  right: 0;
  display: inline-block;
  width: 100%;
  height: 100%;
  overflow: hidden;
  text-indent: -260px;
  cursor: pointer;
  opacity: 0;
}
.co-file-uploder input[type="text"]:hover,
.co-file-uploder input[type="text"]:focus {
  border: 1px solid #c3c3c3 !important;
  border-right: none !important;
}

/* inview
----------------------------------------------------------------------------------------------- */
@media screen and (width >= 670px) {
  .inview-x-top,
  .inview-x-bottom,
  .inview-y-left,
  .inview-y-right,
  .inview-fadein {
    opacity: 0;
  }
  .inview-x-top {
    -webkit-transform: translate(0, 50px);
    transform: translate(0, 50px);
  }
  .inview-x-bottom {
    -webkit-transform: translate(0, -50px);
    transform: translate(0, -50px);
  }
  .inview-y-left {
    -webkit-transform: translate(-50px, 0);
    transform: translate(-50px, 0);
  }
  .inview-y-right {
    -webkit-transform: translate(50px, 0);
    transform: translate(50px, 0);
  }
  .inview-o {
    opacity: 1;
    -webkit-transform: translate(0, 0);
    transform: translate(0, 0);
    transition:
      transform 0.6s,
      opacity 0.6s;
  }
  .inview-o.inview-fadein {
    transition: opacity 1s;
  }
  .inview-o.no2 {
    transition-delay: 0.3s;
  }
  .inview-o.no3 {
    transition-delay: 0.6s;
  }
  .inview-o.no4 {
    transition-delay: 0.9s;
  }
}

/* webfont
----------------------------------------------------------------------------------------------- */
.co-HiraginoUDSansStdN-W3,
.co-HiraginoUDSansStdN-W4,
.co-HiraginoUDSansStdN-W5,
.co-HiraginoUDSansStdN-W6 {
  font-family: "Noto Sans JP", sans-serif;
}
.co-HiraginoUDSansStdN-W3 {
  font-weight: 300;
}
.co-HiraginoUDSansStdN-W4 {
  font-weight: 400;
}
.co-HiraginoUDSansStdN-W5 {
  font-weight: 500;
}
.co-HiraginoUDSansStdN-W6 {
  font-weight: 700;
}

/* よくある質問
----------------------------------------------------------------------------------------------- */
#faq-guide .co-topicpath,
#faq-guide .help-inner {
  width: calc(100% - 40px);
  max-width: 940px;
}
#faq-guide .help-inner {
  display: flex;
  align-items: flex-start;
  justify-content: space-between;
  margin: 40px auto 90px;
}
#faq-guide img {
  max-width: 100%;
}
#faq-guide .help-contents .contents-title {
  margin-bottom: 30px;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 24px;
  font-weight: 700;
}
#faq-guide .help-contents .help-triangle {
  display: inline-block;
  width: 0;
  height: 0;
  vertical-align: middle;
  border-color: transparent transparent transparent #cccccc;
  border-style: solid;
  border-width: 7px 0 7px 10px;
}

/* ヘルプトップ */
#faq-guide.help-index .help-inner {
  display: block;
  margin-top: 90px;
}
#faq-guide.help-index .help-index-title {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 31px;
  font-weight: 700;
  text-align: center;
}
#faq-guide.help-index .contents-title {
  padding-bottom: 18px;
  border-bottom: 1px #dfdfdf solid;
}

/* SP */
@media screen and (width <= 670px) {
  #faq-guide .co-topicpath,
  #faq-guide .help-inner {
    width: calc(100% - 26px);
  }
  #faq-guide .help-inner {
    flex-wrap: wrap;
    margin-bottom: 30px;
  }
  #faq-guide .help-contents .contents-title {
    padding-bottom: 8px;
    margin-bottom: 25px;
    font-size: 20px;
  }

  /* ヘルプトップ */
  #faq-guide.help-index .help-inner {
    margin-top: 30px;
  }
  #faq-guide.help-index .help-index-title {
    font-size: 20px;
  }
  #faq-guide.help-index .help-contents .contents-title {
    font-size: 17px;
  }
}

/*** メニュー ***/
#faq-guide .category-list {
  flex-basis: 240px;
  overflow: hidden;
  font-size: 15px;
  border: 1px solid #dddddd;
  border-radius: 5px;
}
#faq-guide .category-list li a {
  position: relative;
  display: block;
  padding: 15px 30px 13px;
  color: #333333;
  text-decoration: none;
  background: #ffffff;
  transition:
    background-color 0.2s,
    color 0.2s;
}
#faq-guide .category-list li:not(:first-child) a {
  border-top: 1px solid #cccccc;
}
#faq-guide .category-list li a::after {
  position: absolute;
  top: calc(50% - 4px);
  right: 17px;
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-left: 10px;
  content: "";
  border-top: 2px #aaaaaa solid;
  border-right: 2px #aaaaaa solid;
  transform: rotate(45deg);
  transition: border-color 0.2s;
}
#faq-guide .category-list li a:hover,
#faq-guide .category-list .btn-func a {
  background-color: #f7f7f7;
}
#faq-guide .category-list .btn-func a {
  font-weight: bold;
}

/* ヘルプトップ */
#faq-guide .category-list.cat-list-index {
  display: flex;
  flex-wrap: wrap;
  margin: 30px auto 70px;
  border: 0;
}
#faq-guide .category-list.cat-list-index li {
  width: calc(25% - 15px);
}
#faq-guide .category-list.cat-list-index li:not(:nth-child(4n + 1)) {
  margin-left: 20px;
}
#faq-guide .category-list.cat-list-index li a {
  padding-top: 16px;
  padding-bottom: 16px;
  margin-top: 30px;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 14px;
  font-weight: 700;
  color: #3296d2;
  text-align: center;
  text-decoration: none;
  background: #ffffff;
  border: 2px #3296d2 solid;
  border-radius: 5px;
  transition:
    background-color 0.5s,
    color 0.5s;
}
#faq-guide .category-list.cat-list-index li a::after {
  border-color: #3296d2;
  transition: border-color 0.5s;
}
#faq-guide .category-list.cat-list-index li a:hover {
  color: #ffffff;
  background-color: #3296d2;
}
#faq-guide .category-list.cat-list-index li a:hover::after {
  border-color: #ffffff;
}

/* TAB */
@media screen and (width <= 940px) and (width >= 671px) {
  #faq-guide .category-list {
    flex-basis: 190px;
    font-size: 15px;
  }
  #faq-guide .category-list li a::after {
    top: calc(50% - 3px);
  }
  #faq-guide .category-list.cat-list-index li a {
    font-size: 13px;
  }
  #faq-guide .category-list li a {
    padding-right: 20px;
    padding-left: 3px;
  }
  #faq-guide .category-list li a::after {
    right: 13px;
  }

  /* ヘルプトップ */
  #faq-guide .category-list.cat-list-index li {
    width: calc(25% - 8px);
  }
  #faq-guide .category-list.cat-list-index li:not(:nth-child(4n + 1)) {
    margin-left: 10px;
  }
  #faq-guide .category-list.cat-list-index li a {
    margin-top: 12px;
  }
}

/* SP */
@media screen and (width <= 670px) {
  #faq-guide .category-list li a::after {
    width: 5px;
    height: 5px;
  }

  /* SP用下部メニュー */
  #faq-guide .category-list.cat-list-menu,
  #faq-guide .cat-list-menu-ttl {
    order: 1;
  }
  #faq-guide .cat-list-menu-ttl {
    width: 100%;
    margin: 70px 0 10px;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 14px;
    font-weight: 300;
  }
  #faq-guide .category-list.cat-list-menu {
    flex-basis: calc(100% + 26px);
    margin: 0 -13px;
    font-size: 14px;
    background-color: #f5f5f5;
    border-width: 1px 0;
    border-radius: 0;
  }
  #faq-guide .category-list.cat-list-menu li {
    margin: 0 15px;
  }
  #faq-guide .category-list.cat-list-menu li a {
    padding: 12px 8px 11px;
    border-color: #e0e0e0;
  }

  /* ヘルプトップ */
  #faq-guide .category-list.cat-list-index {
    max-width: 450px;
    margin: 20px auto 45px;
    font-size: 14px;
  }
  #faq-guide .category-list.cat-list-index li {
    width: 49.2%;
  }
  #faq-guide .category-list.cat-list-index li:not(:nth-child(4n + 1)) {
    margin-left: 0;
  }
  #faq-guide .category-list.cat-list-index li:not(:nth-child(2n + 1)) {
    margin-left: 1.6%;
  }
  #faq-guide .category-list.cat-list-index li a {
    padding: 10px 22px 10px 15px;
    margin-top: 4px;
    font-size: 12px;
    border-width: 1px;
  }
  #faq-guide .category-list.cat-list-index li a::after {
    top: calc(50% - 3px);
    right: 10px;
  }
}

/*** コンテンツ ***/
#faq-guide .help-contents {
  flex-basis: calc(100% - 280px);
}

/* Q&A */
#faq-guide .help-contents .txt-Q {
  padding-left: 1.3em;
  margin-bottom: 6px;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 17px;
  font-weight: 700;
  color: #14b4b4;
  text-indent: -1.3em;
}
#faq-guide .help-contents .txt-Q:not(:first-of-type) {
  padding-top: 22px;
  margin-top: 20px;
  border-top: 1px #dfdfdf solid;
}
#faq-guide .help-contents .txt-A {
  margin: 15px 0 0 28px;
  font-size: 14px;
  line-height: 1.7em;
}

/* 中身 */
#faq-guide .help-contents ul {
  margin-top: 10px;
  list-style-type: none;
}
#faq-guide .help-contents ul li {
  margin-bottom: 5px;
}
#faq-guide .help-contents ul:not([class*="list-txt"]) li {
  padding-left: 14px;
  text-indent: -14px;
}
#faq-guide .help-contents ul:not([class*="list-txt"]) > li::before {
  display: inline-block;
  flex-grow: 0;
  flex-shrink: 0;
  width: 4px;
  height: 4px;
  margin: 9px 7px 0 3px;
  vertical-align: 2px;
  content: "";
  background-color: #333333;
  border-radius: 50%;
}
#faq-guide .help-contents ul li *,
#faq-guide .help-contents ul li::before {
  text-indent: 0;
}
#faq-guide .help-contents .txt {
  font-size: 14px;
  line-height: 1.8em;
}
#faq-guide .help-contents .txt-arw {
  font-size: 15px;
  font-weight: bold;
}
#faq-guide .help-contents .txt-arw::after {
  display: inline-block;
  width: 0;
  height: 0;
  margin: 0 2px 0 4px;
  vertical-align: -2px;
  content: "";
  border-color: transparent #cccccc;
  border-style: solid;
  border-width: 7px 0 7px 9px;
}
#faq-guide .list-txt > li:not(:first-child) {
  margin-top: 15px;
}
#faq-guide .list-txt li .list-txt-r {
  padding-left: 18px;
  font-weight: bold;
  color: #f5646e;
  text-indent: -18px;
}
#faq-guide .list-txt li .list-txt-ex {
  margin: 10px 0 0 20px;
}
#faq-guide .list-txt > li ul {
  margin-left: 20px;
}
#faq-guide .help-contents .list-txt > li ul li::before {
  display: none;
}
#faq-guide .help-contents .inline-list-txt {
  display: flex;
  flex-wrap: wrap;
  margin: 0;
}
#faq-guide .inline-list-txt li {
  margin-top: 0;
}
#faq-guide .inline-list-txt li:not(:last-child)::after {
  content: "、";
}

/* アカウントフロー図 */
#faq-guide .three-box-wrap {
  display: flex;
  align-items: center;
  justify-content: space-between;
  max-width: 640px;
  margin: 30px 0 35px;
}
#faq-guide .three-box-wrap .three-box {
  position: relative;
  width: 20%;
  padding: 20px 20px 15px;
  text-align: center;
  background: #f6f6f6;
  border: 1px solid #d4d4d4;
  border-radius: 5px;
}
#faq-guide .three-box-wrap .three-box:not(:last-child)::before {
  position: absolute;
  top: 50%;
  right: -74%;
  z-index: 2;
  margin-top: -10px;
  margin-right: 80px;
  font-size: 14px;
  color: #ffffff;
  content: "審査";
}
#faq-guide .three-box-wrap .three-box:not(:last-child)::after {
  position: absolute;
  top: 50%;
  right: -50%;
  z-index: 1;
  display: inline-block;
  width: 50px;
  height: 70px;
  margin-top: -35px;
  margin-right: 25px;
  content: "";
  background: url(/web/img/pre/flow/arrow_00.png) center/contain no-repeat;
}
#faq-guide .three-box-wrap .title {
  margin: 18px auto 15px;
  font-size: 15px;
  line-height: 1.4;
}
#faq-guide .three-box-wrap .img {
  display: flex;
  align-items: flex-end;
  justify-content: center;
  height: 60px;
  margin: 0 auto;
}
#faq-guide .three-box-wrap .img > img {
  vertical-align: middle;
}
#faq-guide .three-box-wrap .img-1 {
  width: 80px;
}
#faq-guide .three-box-wrap .sentence {
  font-size: 13px;
  line-height: 1.7;
}
#faq-guide .three-box-wrap .three-box .balloon {
  position: absolute;
  top: -5px;
  right: 0;
  left: 0;
  z-index: 1;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 135px;
  height: 35px;
  margin: 0 auto;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 15px;
  font-weight: bold;
  color: #ffffff;
  background-color: #14b3b3;
  border-radius: 5px;
}
#faq-guide .three-box-wrap .three-box .human-image {
  position: relative;
  width: 200px;
  height: 200px;
  overflow: hidden;
  background-color: #ffffff;
  border: 1px solid #dcdcdc;
  border-radius: 100%;
}
#faq-guide .three-box-wrap .three-box .human-image img {
  position: absolute;
  right: -13px;
  bottom: 0;
  left: 0;
  width: 100%;
  max-width: 165px;
  margin: 0 auto;
}
#faq-guide .three-box-wrap .human-box-inner {
  position: relative;
  width: 200px;
  transform: translateX(-15px);
}
#faq-guide .three-box-wrap .three-box:last-child {
  background: none;
  border: none;
}

@media screen and (width <= 940px) {
  #faq-guide .three-box-wrap {
    flex-direction: column;
    max-width: 355px;
  }
  #faq-guide .three-box-wrap .three-box {
    box-sizing: border-box;
    width: 100%;
  }
  #faq-guide .three-box-wrap .three-box:not(:last-child) {
    margin-bottom: 100px;
  }
  #faq-guide .three-box-wrap .three-box:not(:last-child)::before {
    top: auto;
    right: 50%;
    bottom: -55px;
    margin-right: -13px;
  }
  #faq-guide .three-box-wrap .three-box:not(:last-child)::after {
    top: auto;
    right: 50%;
    bottom: -85px;
    width: 79px;
    height: 70px;
    margin-right: -39px;
    transform: rotate(90deg);
  }
  #faq-guide .three-box-wrap .human-box-inner {
    width: 200px;
    margin: 0 auto;
    transform: translateX(0);
  }
  #faq-guide .three-box-wrap .three-box:last-child {
    padding-top: 10px;
    padding-bottom: 0;
  }
  #faq-guide .three-box-wrap .three-box .human-image {
    width: 200px;
    height: 200px;
  }
  #faq-guide .three-box-wrap .three-box .human-image img {
    max-width: 175px;
  }
  #faq-guide .three-box-wrap .three-box .balloon {
    width: 115px;
    height: 30px;
    font-size: 13px;
  }
}
@media screen and (width <= 670px) {
  #faq-guide .three-box-wrap {
    margin: 30px auto 40px;
  }
}

/* 料金表 */
#faq-guide .help-price-list {
  margin-top: 15px;
}
#faq-guide .help-price-list * {
  box-sizing: border-box;
}
#faq-guide .help-price-list,
#faq-guide .help-price-list tr,
#faq-guide .help-price-list tbody {
  display: flex;
}
#faq-guide .help-price-list tr {
  flex-direction: column;
}
#faq-guide .help-price-list th,
#faq-guide .help-price-list td {
  margin: -1px 0 0 -1px;
}
#faq-guide .help-price-list th:not(.none),
#faq-guide .help-price-list td {
  border: 1px solid #d3d3d3;
}
#faq-guide .help-price-list thead th,
#faq-guide .help-price-list td {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  height: 47px;
}
#faq-guide .help-price-list th:not(.none) {
  font-weight: bold;
  text-align: center;
  background-color: #e3e3e3;
}
#faq-guide .help-price-list th:first-child {
  height: 35px;
}
#faq-guide .help-price-list thead th {
  padding: 0 10px;
}
#faq-guide .help-price-list tbody th {
  display: block;
  padding: 5px 10px;
  font-size: 12px;
}
#faq-guide .help-price-list td {
  padding: 0 15px;
}
#faq-guide .help-price-list-notice {
  margin-top: 5px;
  font-size: 13px;
}

/* TAB/SP */
@media screen and (width <= 940px) {
  #faq-guide .help-contents .txt-A {
    margin-left: 0;
  }
}

/* TAB */
@media screen and (width <= 940px) and (width >= 671px) {
  #faq-guide .help-contents {
    flex-basis: calc(100% - 220px);
  }
  #faq-guide .help-price-list td {
    padding: 0 10px;
  }
  #faq-guide .help-price-list thead th {
    font-size: 13px;
  }
}

/* SP */
@media screen and (width <= 670px) {
  #faq-guide .help-contents {
    flex-basis: 100%;
  }
  #faq-guide .help-contents .txt-Q:not(:first-of-type) {
    padding-top: 18px;
    margin-top: 17px;
  }

  /*** 料金表 ***/
  #faq-guide .help-price-list,
  #faq-guide .help-price-list tbody {
    display: block;
  }
  #faq-guide .help-price-list tbody tr {
    padding: 5px 5px 0;
    border: 1px #cccccc solid;
  }
  #faq-guide .help-price-list tbody tr:not(:first-child) {
    margin-top: 5px;
  }
  #faq-guide .help-price-list th:not(.none),
  #faq-guide .help-price-list td:last-child {
    border-width: 0;
  }
  #faq-guide .help-price-list tbody th {
    font-size: 14px;
  }
  #faq-guide .help-price-list td {
    display: flex;
    justify-content: space-between;
    height: auto;
    padding: 5px 11px;
    border-width: 0 0 1px;
  }
  #faq-guide .help-price-list td::before {
    font-weight: bold;
  }
  #faq-guide .help-price-list td:nth-of-type(1)::before {
    content: "月額料金";
  }
  #faq-guide .help-price-list td:nth-of-type(2)::before {
    content: "保証額合計";
  }
  #faq-guide .help-price-list td:nth-of-type(3)::before {
    content: "1社あたりの保証額";
  }
  #faq-guide .help-price-list-notice {
    font-size: 12px;
  }
}

/* ログイン後ご利用ガイド・FAQ
----------------------------------------------------------------------------------------------- */
#loggedin-help .guarantee-inner {
  max-width: 940px;
  margin: 0 auto;
}
#loggedin-help .category-menu {
  float: left;
  width: 230px;
  margin-right: 50px;
}
#loggedin-help .category-menu ul {
  background-color: #ffffff;
  border: 1px solid #cccccc;
  border-radius: 5px;
}
#loggedin-help .category-menu li {
  font-size: 15px;
  cursor: pointer;
  border-bottom: 1px solid #cccccc;
}
#loggedin-help .category-menu li:first-child {
  border-radius: 5px 5px 0 0;
}
#loggedin-help .category-menu li:last-child {
  border-bottom: none;
  border-radius: 0 0 5px 5px;
}
#loggedin-help .category-menu li:hover {
  background-color: #eeeeee;
}
#loggedin-help .category-menu li a {
  position: relative;
  display: block;
  padding: 15px 20px 13px 17px;
  color: #333333;
  text-decoration: none;
}
#loggedin-help .btn-func {
  font-weight: bold;
}
#loggedin-help .content_area {
  position: relative;
  overflow: hidden;
}
#loggedin-help .fix-area {
  box-sizing: border-box;
  width: 100%;
  padding: 0 20px;
}
#loggedin-help .main-title {
  margin-top: 40px;
}
#loggedin-help .fix-area .content-block {
  margin-bottom: 50px;
}
#loggedin-help .fix-area .contents-title {
  padding-bottom: 6px;
  margin-bottom: 20px;
  font-size: 22px;
  font-weight: bold;
  border-bottom: 1px solid #cccccc;
}
#loggedin-help .fix-area .contents-subtitle {
  font-size: 16px;
  font-weight: bold;
}
#loggedin-help .fix-area .txt {
  font-size: 14px;
  line-height: 1.8em;
}
#loggedin-help .fix-area .txt .img01 {
  max-width: 500px;
}
#loggedin-help .fix-area .txt .img02 {
  max-width: 580px;
}
#loggedin-help .fix-area .txt-b {
  font-size: 15px;
  font-weight: bold;
}
#loggedin-help .fix-area .txt-Q {
  padding: 3px 0 4px 29px;
  margin-bottom: 6px;
  font-size: 16px;
  font-weight: bold;
  background: url(/web/img/common/icon/faq_question_00.png) no-repeat scroll
    left center;
  background-position-y: 2px;
  background-size: 23px 23px;
}
#loggedin-help .fix-area .txt-A {
  padding-top: 12px;
  margin-bottom: 35px;
  font-size: 14px;
  line-height: 1.7em;
  border-top: 1px dotted #cccccc;
}
#loggedin-help .fix-area .flow {
  float: left;
  display: inline-block;
  width: 120px;
  padding: 6px 0;
  margin-right: 15px;
  color: #3c3c3c;
  text-align: center;
  background-color: #ffffff;
  border: 1px solid #00b2b2;
}
#loggedin-help .fix-area .flow-txt {
  float: left;
  width: 510px;
  padding: 4px 0;
}
#loggedin-help .fix-area .flow-arrow {
  display: block;
  margin: 15px 0 15px 57px;
}
#loggedin-help
  .fix-area
  .content_area_inner
  .content-block
  .registration-explain {
  position: absolute;
  top: 3px;
  right: -25px;
  padding-left: 0;
  margin-top: 0;
  list-style-type: none;
}
#loggedin-help
  .fix-area
  .content_area_inner
  .content-block
  .registration-explain
  .icon {
  width: 22px;
  margin: -4px 5px 0;
  vertical-align: middle;
}
#loggedin-help .fix-area .content_area_inner .content-block .yen-icon {
  width: 22px;
  margin: 0 3px;
  vertical-align: bottom;
}
#loggedin-help
  .fix-area
  .content_area_inner
  .content-block
  .registration-explain
  .co-btn-hover-floaty {
  display: inline-block;
  padding: 2px 10px 0 7px;
  margin: -2px 5px 0;
  font-size: 11px;
  line-height: 1.2;
  vertical-align: middle;
  cursor: default;
}
#loggedin-help
  .fix-area
  .content_area_inner
  .content-block
  .registration-explain
  .co-btn-hover-floaty:hover {
  color: #14b4b4 !important;
  background: #ffffff;
}
#loggedin-help
  .fix-area
  .content_area_inner
  .content-block
  .registration-explain
  li {
  margin-bottom: 2px;
}
#loggedin-help
  .fix-area
  .content_area_inner
  .content-block
  .registration-explain
  li:first-child {
  margin-bottom: 4px;
}

/* ログイン後ご利用ガイド・FAQのタブ */
#loggedin-help .tab-area {
  position: relative;
  z-index: 2;
  width: 95%;
  max-width: 1300px;
  margin: 0 auto -1px;
}
#loggedin-help .tab-area .tab {
  position: relative;
  float: left;
  padding: 12px 25px;
  margin-left: 20px;
  font-size: 17px;
  color: #333333;
  border: 1px solid #cccccc;
  border-bottom-color: #f6f6f6;
  border-radius: 10px 10px 0 0;
}
#loggedin-help .tab-area .tab.off {
  color: #0066cc;
  background: #eeeeee;
  border-bottom: none;
}
#loggedin-help .tab-area .tab:last-child {
  margin-right: 0;
}
#loggedin-help .tab-contents {
  position: relative;
  z-index: 1;
  width: 95%;
  margin: 0 auto;
}

@media screen and (width >= 671px) {
  #loggedin-help .btn-func {
    background-color: #eeeeee;
  }
}
@media screen and (width <= 670px) {
  #loggedin-wrap .list-tab {
    padding-left: 0;
  }
  #loggedin-wrap .list-tab > ul {
    display: flex;
    justify-content: flex-start;
  }
  #loggedin-help .fix-area {
    padding: 0;
  }
  #loggedin-help .fix-area .contents-title {
    font-size: 20px;
  }
  #loggedin-help .tab-contents {
    width: 100%;
  }
}

/* ログイン後ヘルプ */
#loggedin-wrap #faq-guide:not(.help-index) .list-tab {
  margin-bottom: 20px;
}
#loggedin-wrap #faq-guide:not(.help-index) .co-topicpath {
  margin: 0 auto;
}

@media screen and (width <= 940px) and (width >= 671px) {
  #loggedin-wrap #faq-guide .category-list li a {
    padding-right: 20px;
    padding-left: 10px;
  }
  #loggedin-wrap #faq-guide .category-list li a::after {
    right: 10px;
  }
}
@media screen and (width <= 670px) {
  #loggedin-wrap #faq-guide .category-list.cat-list-menu {
    flex-basis: auto;
    width: 111%;
    margin-left: -11%;
    background-color: #f9f9f9;
    transform: translateX(5%);
  }
  #loggedin-wrap #faq-guide .category-list.cat-list-index {
    width: 300px;
    margin-left: calc(50% - 150px);
  }
  #loggedin-wrap #faq-guide .category-list.cat-list-menu li a {
    color: #3c3c3c;
    background: none;
  }
  #loggedin-wrap #faq-guide .co-topicpath,
  #loggedin-wrap #faq-guide .help-inner {
    width: 100%;
  }
  #loggedin-wrap #faq-guide .help-contents .txt-Q {
    padding-left: 1.45em;
    text-indent: -1.45em;
  }
  #loggedin-wrap #faq-guide .category-list:not(.cat-list-index) li a::after {
    border-color: #adadad;
  }
  #loggedin-wrap #faq-guide .category-list,
  #loggedin-wrap #faq-guide .category-list.cat-list-menu li a {
    border-color: #d3d3d3;
  }
}

/* ログイン後＞保証申し込み＞特約オプションテーブル */
#loggedin-help .help-t-option {
  margin-top: 15px;
}
#loggedin-help .help-t-option * {
  box-sizing: border-box;
}
#loggedin-help .help-t-option,
#loggedin-help .help-t-option tr,
#loggedin-help .help-t-option tbody {
  display: flex;
}
#loggedin-help .help-t-option tr {
  flex-direction: column;
}
#loggedin-help .help-t-option tbody tr {
  width: 50%;
}
#loggedin-help .help-t-option thead th {
  min-width: 80px;
}
#loggedin-help .help-t-option th,
#loggedin-help .help-t-option td {
  margin: -1px 0 0 -1px;
}
#loggedin-help .help-t-option th:not(.none),
#loggedin-help .help-t-option td {
  border: 1px solid #d3d3d3;
}
#loggedin-help .help-t-option thead th,
#loggedin-help .help-t-option td {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: center;
  height: 44px;
}
#loggedin-help .help-t-option thead th:nth-of-type(2),
#loggedin-help .help-t-option td:nth-of-type(1) {
  height: 160px;
}
#loggedin-help .help-t-option th:not(.none) {
  font-weight: bold;
  text-align: center;
  background-color: #e3e3e3;
}
#loggedin-help .help-t-option th:first-child {
  height: 35px;
}
#loggedin-help .help-t-option thead th {
  padding: 0 10px;
}
#loggedin-help .help-t-option tbody th {
  display: block;
  padding: 5px 10px;
}
#loggedin-help .help-t-option td {
  padding: 0 15px;
}
#loggedin-help .help-t-option-notice {
  margin-top: 5px;
  font-size: 13px;
}

/* TAB/SP */
@media screen and (width <= 940px) {
  #loggedin-help .help-contents .txt-A {
    margin-left: 0;
  }
}

/* TAB */
@media screen and (width <= 940px) and (width >= 671px) {
  #loggedin-help .help-contents {
    flex-basis: calc(100% - 220px);
  }
  #loggedin-help .help-t-option td {
    padding: 0 10px;
  }
  #loggedin-help .help-t-option thead th {
    font-size: 13px;
  }
  #loggedin-help .help-t-option thead th:nth-of-type(2),
  #loggedin-help .help-t-option td:nth-of-type(1) {
    min-height: 260px;
  }
}

/* SP */
@media screen and (width <= 670px) {
  #loggedin-help .help-t-option,
  #loggedin-help .help-t-option tbody {
    display: block;
  }
  #loggedin-help .help-t-option tbody tr {
    width: auto;
  }
  #loggedin-help .help-t-option tbody tr {
    padding: 5px 5px 0;
    border: 1px #cccccc solid;
  }
  #loggedin-help .help-t-option tbody tr:not(:first-child) {
    margin-top: 5px;
  }
  #loggedin-help .help-t-option th:not(.none),
  #loggedin-help .help-t-option td:last-child {
    border-width: 0;
  }
  #loggedin-help .help-t-option tbody th {
    font-size: 14px;
  }
  #loggedin-help .help-t-option td {
    display: flex;
    justify-content: space-between;
    height: auto;
    padding: 5px 11px;
    border-width: 0 0 1px;
  }
  #loggedin-help .help-t-option thead th:nth-of-type(2),
  #loggedin-help .help-t-option td:nth-of-type(1) {
    height: auto;
  }
  #loggedin-help .help-t-option td::before {
    font-weight: bold;
  }
  #loggedin-help .help-t-option td:nth-of-type(1)::before {
    content: "内容";
  }
  #loggedin-help .help-t-option td:nth-of-type(2)::before {
    content: "期間";
  }
  #loggedin-help .help-t-option td:nth-of-type(3)::before {
    content: "追加料金";
  }
  #loggedin-help .help-t-option-notice {
    font-size: 12px;
  }
}

/* ログイン後マニュアル・注意事項＞マニュアル枠 */
#loggedin-help .page-documents ul {
  padding: 0;
  padding-inline-start: 0;
}
#loggedin-help .page-documents li {
  margin-top: 10px;
  background-color: #ffffff;
  border-radius: 4px;
}
#loggedin-help .page-documents li:first-child {
  margin-top: 0;
}
#loggedin-help .page-documents li a {
  display: flex;
  height: 100%;
  color: #3c3c3c;
  background-color: #ffffff;
  background-size: 140px;
  border: #dddddd 1px solid;
  border-radius: 4px;
}
#loggedin-help .page-documents li a:hover {
  text-decoration: none;
  opacity: 0.7;
}
#loggedin-help .page-documents img {
  width: 100%;
  max-width: 260px;
  vertical-align: top;
}
#loggedin-help .page-documents h4 {
  margin: 1.25em 0 0.25em;
  font-size: 18px;
  font-weight: bold;
}
#loggedin-help .page-documents .img {
  display: block;
  padding: 0 30px;
  background-color: #dddddd;
}
#loggedin-help .page-documents .text {
  padding: 20px;
}
#loggedin-help .page-documents .text span {
  font-size: 12px;
}
#loggedin-help .page-documents .contents-subtitle {
  margin: 30px 0 10px;
}
#loggedin-help .page-documents .doc .icon-pdf::after {
  padding: 30px;
  content: "";
  background: url(/web/img/common/icon/pdf_icon_00.png) no-repeat 5px 49%;
  background-size: 24px;
}

/* TAB/SP */
@media screen and (width <= 940px) {
  #loggedin-help .page-documents .img {
    padding: 5px 10px;
  }
  #loggedin-help .page-documents img {
    max-width: 200px;
  }
  #loggedin-help .page-documents h4 {
    margin: 0.75em 0 0.25em;
  }
}

/* SP */
@media screen and (width <= 670px) {
  #loggedin-help .page-documents li a {
    display: block;
  }
  #loggedin-help .page-documents img {
    display: block;
    margin: 0 auto;
  }
  #loggedin-help .page-documents .text {
    display: block;
  }
  #loggedin-help .page-documents h4 {
    margin: 0 0 0.25em;
    font-size: 16px;
  }
  #loggedin-help .page-documents .text span {
    line-height: 1;
  }
  #loggedin-help .page-documents .text {
    padding: 15px;
  }
}

/* 動画 */
#loggedin-help .page-documents .video {
  display: flex;
  flex-wrap: wrap;
  justify-content: space-between;
}
#loggedin-help .page-documents .video li {
  flex-basis: 49%;
  margin: 10px 0 0 1%;
}
#loggedin-help .page-documents .video li:nth-child(odd) {
  margin-left: 0;
}
#loggedin-help .page-documents .video img {
  max-width: 140px;
  border: 1px solid #dddddd;
}
#loggedin-help .page-documents .video .img {
  position: relative;
  padding: 10px 14px 10px 10px;
  background-color: #ffffff;
}
#loggedin-help .page-documents .video .img::before {
  position: absolute;
  top: 38%;
  left: 38%;
  display: inline-block;
  width: 40px;
  height: 28px;
  content: "";
  background: url(/web/img/loggedin/documents/icon_video_00.png) no-repeat
    scroll;
  background-size: 40px;
}
#loggedin-help .page-documents .video .text {
  padding: 10px 0;
}
#loggedin-help .page-documents .video h4 {
  position: relative;
  padding-right: 1.75em;
  font-size: 17px;
}
#loggedin-help .page-documents .video h4::after {
  position: absolute;
  top: -3px;
  right: 0.75em;
  bottom: 0;
  display: inline-block;
  width: 0.5em;
  height: 0.5em;
  margin: auto;
  content: "";
  border-top: 2px solid #3c3c3c;
  border-right: 2px solid #3c3c3c;
  transform: rotate(45deg);
}

/* TAB/SP */
@media screen and (width <= 940px) {
  #loggedin-help .page-documents .video {
    display: block;
  }
  #loggedin-help .page-documents .video li {
    margin-left: 0;
  }
  #loggedin-help .page-documents .video .text {
    padding: 15px 0;
  }
}

/* SP */
@media screen and (width <= 670px) {
  #loggedin-help .page-documents .video .text {
    padding: 10px 5px 5px 15px;
  }
  #loggedin-help .page-documents .video img {
    width: 80px;
  }
  #loggedin-help .page-documents .video .img::before {
    top: 18px;
    left: 34%;
    width: 35px;
    background-size: 35px;
  }
  #loggedin-help .page-documents .video li a {
    display: flex;
  }
  #loggedin-help .page-documents .video h4 {
    margin: 0;
    font-size: 14px;
    line-height: 1.4;
  }
  #loggedin-help .page-documents .video .img {
    padding: 5px 0 5px 5px;
  }
  #loggedin-help .page-documents .video .text span {
    font-size: 11px;
  }
  #loggedin-help .page-documents .video h4::after {
    border-top: 2px solid #999999;
    border-right: 2px solid #999999;
  }
}

/* /ログイン後マニュアル・注意事項＞マニュアル枠 */

/* 小さめテーブル
----------------------------------------------------------------------------------------------- */
.post-in-tableLayout01 {
  margin-top: 15px;
  border: 1px solid #d3d3d3;
}
.post-in-tableLayout01 tr {
  border-bottom: 1px solid #d3d3d3;
}
.post-in-tableLayout01 th {
  padding: 10px;
  font-weight: bold;
  vertical-align: middle;
  text-align: center;
  background-color: #e3e3e3;
}
.post-in-tableLayout01 td {
  padding: 10px 15px;
  vertical-align: middle;
  text-align: center;
  background-color: #ffffff;
  border-left: 1px solid #d3d3d3;
}
.post-in-tableLayout01-txt {
  margin-top: -17px;
  font-size: 13px;
}
.post-in-tableLayout02 {
  margin-top: 15px;
}
.post-in-tableLayout02 th {
  padding: 10px;
  font-weight: bold;
  vertical-align: middle;
  text-align: center;
  background-color: #e3e3e3;
  border: 1px solid #d3d3d3;
}
.post-in-tableLayout02 tr:nth-child(1) th {
  padding: 4px 10px;
  font-size: 12px;
}
.post-in-tableLayout02 td {
  padding: 10px 15px;
  vertical-align: middle;
  text-align: center;
  background-color: #ffffff;
  border: 1px solid #d3d3d3;
}
.post-in-tableLayout02 .none {
  background: none;
  border: none;
}

/* ページトップボタン
----------------------------------------------------------------------------------------------- */
.co-scroll-btn-wrap {
  position: fixed;
  right: 50%;
  bottom: 185px;
  z-index: 11;
  display: block;
  width: 94%;
  max-width: 1050px;
  transform: translate(50%);
  transition: bottom 0.5s;
}
#pre-form-wrap ~ .co-scroll-btn-wrap,
.lp-comic .co-scroll-btn-wrap {
  bottom: 85px;
}
#seminar-detail + .co-scroll-btn-wrap {
  bottom: 105px;
}
.co-scroll-btn-wrap .co-scroll-btn {
  position: absolute;
  right: 0;
  color: #14b4b4;
  letter-spacing: 0.1em;
  text-decoration: none;
  cursor: pointer;
  transition: opacity 0.3s;
}
.co-scroll-btn-wrap .co-scroll-btn:hover {
  opacity: 0.6;
}
.co-scroll-btn-wrap .co-scroll-btn span {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 50px;
  height: 50px;
  background: #14b4b4;
  border: 1px #ffffff solid;
  border-radius: 100%;
  opacity: 0.8;
}
.co-scroll-btn-wrap .co-scroll-btn span::after {
  width: 13px;
  height: 13px;
  margin-bottom: -5px;
  content: "";
  border-bottom: 3px solid #ffffff;
  border-left: 3px solid #ffffff;
  border-radius: 3px;
  transform: rotate(135deg);
}
.co-scroll-btn-wrap.take-height {
  bottom: 85px;
  display: block;
}
.co-scroll-btn-wrap.take-height02 {
  bottom: 145px;
  display: none;
}

@media screen and (width >= 941px) {
  .co-scroll-btn-wrap {
    display: none !important;
  }
}
@media screen and (width <= 940px) {
  .co-scroll-btn-wrap .co-scroll-btn span {
    width: 45px;
    height: 45px;
  }
  .co-scroll-btn-wrap .co-scroll-btn span::after {
    top: 18px;
    left: 16px;
    width: 11px;
    height: 11px;
  }
}

/* 動画要素
----------------------------------------------------------------------------------------------- */
.black-opacity-element {
  position: fixed;
  top: 0;
  left: 0;
  z-index: 10000;
  display: none;
  width: 100%;
  height: 100%;
  padding: 0;
  margin: 0;
  cursor: default;
  background-color: rgb(0 0 0);
  border: none;
  opacity: 0.6;
}
.youtube-movie-modal {
  position: fixed;
  top: 50%;
  left: 50%;
  z-index: 10001;
  box-sizing: border-box;
  display: none;
  width: 90%;
  max-width: 900px;
  transform: translateX(-50%) translateY(-50%);
}
.youtube-movie-modal .youtube-movie-inner {
  position: relative;
  width: 100%;
  padding-top: 56.25%;
}
.youtube-movie-modal .youtube-movie-inner iframe {
  position: absolute;
  top: 0;
  right: 0;
  width: 100% !important;
  height: 100% !important;
  border: none;
}
.youtube-mclose {
  position: absolute;
  top: -52px;
  right: 0;
  z-index: 2;
  width: 36px;
  height: 36px;
  padding: 0;
  cursor: pointer;
  background: #ffffff;
  background-image: none;
  border: none;
  border-radius: 50%;
}
.youtube-mclose::before,
.youtube-mclose::after {
  position: absolute;
  top: 20%;
  left: 45%;
  display: inline-block;
  width: 4px;
  height: 21px;
  content: "";
  background: #707070;
  transform: rotate(45deg);
}
.youtube-mclose::after {
  transform: rotate(-45deg);
}

@media screen and (width <= 941px) {
  .youtube-movie-modal .youtube-movie-inner .close-btn {
    display: none;
  }
}
@media screen and (width <= 670px) {
  .youtube-movie-modal {
    padding: 5px;
  }
}

/* 保証リスト＞審査結果一覧＞取引先の審査結果を確認した方へ */
#assurance_result .doc a {
  display: inline-flex;
  height: 100%;
  margin-bottom: 25px;
  color: #3c3c3c;
  background-color: #ffffff;
  background-size: 140px;
  border: #dddddd 1px solid;
  border-radius: 4px;
}
#assurance_result .doc a:hover {
  text-decoration: none;
  opacity: 0.7;
}
#assurance_result .doc a img {
  width: 65px;
  padding: 10px 20px 15px 25px;
  border-left: 7px solid #00a0a0;
}
#assurance_result .doc p {
  font-size: 16px;
  font-weight: bold;
}
#assurance_result .doc .text {
  padding-top: 25px;
}
#assurance_result .doc .text span {
  font-size: 12px;
}
#assurance_result .doc p::after {
  padding: 30px;
  content: "";
  background: url(/web/img/common/icon/pdf_icon_00.png) no-repeat 5px 49%;
  background-size: 22px;
}


/* 基本
----------------------------------------------------------------------------------------------- */
.input-form h4,
.confirm-form h4 {
  width: 85%;
  padding-bottom: 10px;
  margin: 0 auto;
  font-size: 16px;
  font-weight: bold;
  border-bottom: 1px solid #d3d3d3;
}
.input-form h4:first-child,
.confirm-form h4:first-child {
  padding-top: 15px;
}
.confirm-form .wrap-framework {
  margin: 20px 0 35px;
}
.simple-form .simple-form-explain {
  margin-bottom: 25px;
}
.simple-form .input-area {
  width: 95%;
  max-width: 500px;
  margin: 20px auto 40px;
}
.simple-form .required-mark-02 {
  display: inline-block;
  padding: 0 2px;
  margin: -1px 3px 0 0;
  font-size: 11px;
  font-weight: normal;
  line-height: 1.4;
  vertical-align: middle;
  color: #ffffff;
  background-color: #f5646e;
  border-radius: 3px;
}
#pre-form-wrap {
  position: relative;
  box-sizing: border-box;
  min-height: 100%;
  padding-bottom: 125px;
  background: #f6f6f6;
}
#pre-form-wrap .container {
  width: 94%;
  max-width: 1440px;
  padding: 100px 0;
  margin: 0 auto;
}
#pre-form-wrap .container > h2 {
  font-family: initial;
  font-size: 24px;
  font-weight: normal;
}

@media screen and (width <= 670px) {
  #pre-form-wrap {
    padding-top: 50px;
  }
  #pre-form-wrap .container {
    width: 83%;
    padding: 44px 0 40px;
  }
  #pre-form-wrap .container > h2 {
    line-height: 1.4;
  }
}
#pre-form-wrap .w700,
#pre-form-wrap .w960 {
  margin: 0 auto;
}
#pre-form-wrap .w700 {
  max-width: 700px;
}
#pre-form-wrap .w960 {
  max-width: 960px;
}
#pre-form-wrap .container .wrap-framework {
  height: 1.5;
  padding-top: 20px;
  margin: 20px 0 30px;
  border-top: 1px solid #d3d3d3;
  border-bottom: 1px solid #d3d3d3;
}
#pre-form-wrap .container .wrap-framework .page-explain {
  margin-bottom: 36px;
}
#pre-form-wrap .container .wrap-framework-02 {
  padding: 40px 0;
  margin-top: 20px;
  border-top: 1px solid #d3d3d3;
}

@media screen and (width <= 670px) {
  #pre-form-wrap .container .wrap-framework {
    padding-top: 20px;
  }
  #pre-form-wrap .simple-form .wrap-framework {
    padding-top: 15px;
  }
  #pre-form-wrap .input-form .wrap-framework,
  #pre-form-wrap .confirm-form .wrap-framework {
    border-bottom: none;
  }
}
.confirm-textarea {
  white-space: pre-line;
}

/* テーブル
----------------------------------------------------------------------------------------------- */
.data-table {
  display: table;
  width: 85%;
  margin: 0 auto 30px;
  border-collapse: collapse;
}
.new_delay_report .data-table {
  margin: 0 auto 20px;
}
.confirm-form .data-table {
  margin: 0 auto 40px;
}
.data-table .tr {
  display: table-row;
  border-bottom: 1px #d3d3d3 solid;
}
.data-table .tr2 {
  display: table-row;
}
.data-table .tr .th,
.data-table .tr2 .th {
  display: table-cell;
  width: 27%;
  padding-left: 35px;
  font-weight: bold;
  vertical-align: middle;
}
#pre-form-wrap .input-form .data-table .tr .th,
#pre-form-wrap .input-form .data-table .tr2 .th {
  box-sizing: border-box;
  padding-left: 35px;
}
.data-table .td,
.data-table .td2 {
  display: table-cell;
  width: 75%;
}
.data-table .payment-check {
  line-height: 0;
}
.data-table .payment-check * {
  line-height: 155%;
}
#pre-form-wrap .input-form .data-table .td {
  width: 100%;
}
.data-table .td {
  padding: 15px 0;
}
.data-table .td2 {
  padding-top: 20px;
}
.data-table .td3 {
  padding: 15px 0 20px;
}
.data-table .td .bank-input-title {
  margin: 0 5px 5px 0;
  font-weight: bold;
}
.data-table .td .inputarea-s {
  width: 100px;
  margin-right: 5px;
}
.data-table .td .inputarea-m {
  width: 140px;
  margin-right: 5px;
}
.data-table .td .inputarea-l {
  width: 190px;
}
.data-table .td textarea {
  width: 98%;
}
.data-table .td3.hidden-td {
  padding-top: 0;
  margin-top: -10px;
}
.confirm-form .data-table .th,
.confirm-form .data-table .td {
  padding: 13px 0 10px;
}
.confirm-form .data-table .td {
  vertical-align: middle;
}
.confirm-form .data-table .td ul {
  line-height: 2em;
}
.confirm-form .data-table .one-row {
  font-weight: bold;
  vertical-align: middle;
}
.confirm-form .data-table .one-row .confirm-pay-method-paid-attention {
  margin-left: 20px;
  font-weight: normal;
}

/*** アイコン位置 ***/
.data-table .icon-position1 {
  position: relative;
}
.data-table .f-edit {
  position: absolute;
  top: 21px;
  right: 5px;
  display: block;
}
.data-table .icon-position1 .wording {
  position: absolute;
  top: 50px;
  right: -9px;
  z-index: 1;
  display: none;
  padding: 5px 10px;
  font-size: 13px;
  font-weight: bold;
  color: #ffffff;
  background: #3c3c3c;
  border-radius: 5px;
}
.data-table .required-mark {
  position: absolute;
  margin-left: -1.3em;
  font-weight: normal;
  color: #f5646e;
}
.data-table .optional-mark,
.data-table .required-mark-02 {
  position: absolute;
  display: inline-block;
  padding: 0 2px;
  margin-top: 0.2em;
  margin-left: -3em;
  font-size: 11px;
  font-weight: normal;
  line-height: 1.4;
  color: #ffffff;
  border-radius: 3px;
}
.data-table .required-mark-02 {
  background-color: #f5646e;
}
.data-table .optional-mark {
  background-color: #23b8d6;
}
.data-table .same-as-checkbox {
  position: relative;
  height: 30px;
  white-space: nowrap;
}
.data-table .same-as-checkbox > div {
  position: absolute;
  top: 15px;
  left: 2px;
}
.data-table .td-add-border {
  padding-bottom: 15px;
  border-bottom: 1px solid #d3d3d3;
}

/*** データテーブルカレンダー ***/
.data-table .date-calender {
  position: relative;
  display: inline-block;
}
.data-table .date-calender input {
  width: 104px;
}
.data-table .date-calender .co-cld-txt {
  top: 8px;
  right: 2px;
}

/*** シンプル縦テーブル ***/
.simple-col-table {
  width: 100%;
  margin: 0 auto;
  border-bottom: 1px solid #d3d3d3;
}
.simple-col-table .w50 {
  width: 50%;
}
.simple-col-table .w30 {
  width: 30%;
}
.simple-col-table .w20 {
  width: 20%;
}
.simple-col-table th {
  font-weight: bold;
}
.simple-col-table td {
  border-top: 1px solid #d3d3d3;
}
.simple-col-table th,
.simple-col-table td {
  padding: 10px 20px;
  vertical-align: middle;
}

/* フォーム.内容同意
----------------------------------------------------------------------------------------------- */
.terms-of-agreement-section {
  padding-top: 30px;
  border-top: 1px solid #d3d3d3;
}
.form-content-consent-box,
.form-content-consent-box2 {
  max-width: 800px;
  max-height: 100%;
  padding: 20px;
  margin: 0 auto 20px;
  color: #3c3c3c;
  background: #ffffff;
  border: 1px solid #d3d3d3;
  border-radius: 5px;

  /* android文字拡大対策 */
}
.form-content-consent-box2 {
  box-sizing: border-box;
  max-width: 725px;
  margin: 0 auto 20px;
  text-align: center;
}
.form-content-consent-box2 .slash {
  display: inline-block;
  margin: 0 5px;
}
.form-content-consent-box ul {
  padding-left: 20px;
}
.form-content-consent-box ul li {
  line-height: 1.6;
  list-style-type: disc;
}
.consent-check-area {
  max-width: 700px;
  padding: 15px 0;
  margin: 0 auto 20px;
  text-align: center;
  border-top: 1px solid #d3d3d3;
  border-bottom: 1px solid #d3d3d3;
}
.consent-check-area:hover > label > .sentence {
  text-decoration: underline;
  text-decoration-color: #3c3c3c;
}
.consent-check-area .sentence {
  font-weight: bold;
}

/* ボタン-button
----------------------------------------------------------------------------------------------- */
/**** 外枠 ****/
.form-btn {
  display: flex;
  justify-content: center;
  margin: 30px auto 0;
  text-align: center;
}

/* 告知枠
----------------------------------------------------------------------------------------------- */
.form-info-box {
  max-width: 800px;
  max-height: 100%;
  padding: 10px;
  margin: 0 auto 50px;
  color: #3c3c3c;
  background: #ffffff;
  border: 1px solid #d3d3d3;
  border-radius: 5px;

  /* android文字拡大対策 */
}
.form-info-box p {
  max-width: 520px;
  padding-left: 18px;
  margin: 0 auto;
  font-size: 13px;
}
.form-info-box .form-info-text {
  margin-top: 5px;
  background: url(/web/img/common/icon/error_01.png) no-repeat;
  background-position: left 2px;
  background-size: 14px;
}
.form-info-box .form-info-text span {
  font-weight: bold;
  color: #f5646e;
}

/* SP */
@media screen and (width <= 670px) {
  .form-info-box p {
    font-size: 10px;
    line-height: 1.8;
  }
  .form-info-box .form-info-text br {
    display: none;
  }
}

/* エラー系
----------------------------------------------------------------------------------------------- */
.form-error-box00 {
  position: relative;
  width: 69%;
  padding: 8px 20px 4px;
  margin: 20px auto 35px;
  font-weight: bold;
  color: #ffffff;
  text-align: center;
  background: #f5646e;
  border-radius: 5px;
}
.page-explain + .w960 > .form-error-box00 {
  margin: 20px auto 35px;
}
.pre-form-wrap .page-explain + .w960 > .form-error-box00 {
  margin-top: -16px;
}
.form-error-box00 span::before {
  position: absolute;
  right: 0;
  bottom: -0.8em;
  left: 0;
  font-size: 20px;
  color: #f5646e;
  content: "▼";
}
p.form-errmsg,
span.form-errmsg {
  padding-left: 18px;
  margin-top: 5px;
  color: #f5646e;
  background: url(/web/img/common/icon/error_01.png) no-repeat;
  background-position: left 2px;
  background-size: 14px;
}
span.form-errmsg {
  background-position: left 3px;
}
.form-errmark00 {
  display: inline-block;
  padding-left: 19px;
  background: url(/web/img/common/icon/error_00.png) no-repeat;
  background-position: left 3px;
  background-size: 14px;
}
.form-errmark01 {
  display: inline-block;
  padding-left: 19px;
  background: url(/web/img/common/icon/error_01.png) no-repeat;
  background-position: left 3px;
  background-size: 14px;
}

/* 完了画面（NotModal）
----------------------------------------------------------- */
.normal-complete .w960 {
  text-align: center;
}
.normal-complete .img-area {
  margin: 10px 0 16px;
  line-height: 0;
}
.normal-complete .img-area img {
  width: 26px;
}
.normal-complete .sentence01 {
  margin-bottom: 20px;
  font-size: 18px;
  font-weight: bold;
  line-height: 1.5;
}
.normal-complete .sentence02 {
  margin-bottom: 12px;
}
.normal-complete .sentence03 {
  margin-bottom: 35px;
  line-height: 1.4;
  color: #6c6c6c;
}
.normal-complete .sentence04 {
  margin-bottom: 35px;
}

/* 支払い方法エリア
----------------------------------------------------------- */
.data-table .pay-method-paid {
  padding-top: 18px;
  font-weight: bold;
}
.data-table .pay-method-credit {
  padding: 10px 0 16px;
  font-weight: bold;
  border-bottom: 1px solid #d3d3d3;
}
.data-table .pay-method-credit .credit-input {
  display: table;
  margin-top: 10px;
  border-collapse: collapse;
  background: #eeeeee;
  border-radius: 5px;
}
.data-table .pay-method-credit .credit-input .credit-padding-area {
  padding: 20px;
}
.data-table .pay-method-credit .credit-input .ci-tr {
  display: table-row;
}
.data-table .pay-method-credit .credit-input .ci-tr .ci-th {
  display: table-cell;
  width: 7em;
  font-weight: bold;
}
.data-table .pay-method-credit .credit-input .ci-tr .ci-td {
  display: table-cell;
  padding-left: 65px;
  font-weight: normal;
}
.data-table .pay-method-credit .credit-input .ci-tr .ci-td .credit-img {
  margin-top: 7px;
  vertical-align: middle;
}
.data-table .pay-method-credit .credit-input .ci-tr .ci-td .credit-img img {
  vertical-align: middle;
}
.data-table .pay-method-credit .credit-input .credit-num-input {
  box-sizing: border-box;
  width: 70px;
  ime-mode: disabled;
}
.data-table .pay-method-credit .padding-adjustable {
  padding-top: 15px;
}
.data-table .pay-method-paid .supplemental {
  font-weight: normal;
}
.data-table .pay-method-credit .credit-input .required-mark-02 {
  margin-left: -1em;
}
.data-table .pay-method-credit .credit-input .input-name {
  margin-left: 22px;
}
.data-table .pay-method-bank-transfer {
  padding: 10px 0;
  font-weight: bold;
}

/* 支払い方法変更フォーム
----------------------------------------------------------- */
.pay-method-form .data-table {
  width: auto;
}
.pay-method-form .data-table .pay-method-credit {
  padding-bottom: 0;
  border: none;
}
.pay-method-form .data-table .pay-method-credit .credit-input .ci-td {
  padding-left: 40px;
}
.pay-method-form .data-table .pay-method-paid .paid-input {
  display: table;
  margin-top: 10px;
  border-collapse: collapse;
  background: #eeeeee;
  border-radius: 5px;
}
.pay-method-form .data-table .pay-method-paid .paid-input .paid-padding-area {
  padding: 20px;
}
.pay-method-form .data-table .pay-method-paid .paid-input .ci-tr {
  display: table-row;
}
.pay-method-form .data-table .pay-method-paid .paid-input .ci-tr .ci-th {
  display: table-cell;
  width: 6em;
  padding-right: 40px;
  font-weight: bold;
  vertical-align: middle;
  border-right: 2px solid #d3d3d3;
}
.pay-method-form .data-table .pay-method-paid .paid-input .ci-tr .ci-td {
  display: table-cell;
  padding-left: 1em;
  font-weight: normal;
  vertical-align: middle;
}
.pay-method-form .consent-check-area {
  max-width: 740px;
}
.pay-method-form .form-btn {
  column-gap: 15px;
  max-width: 395px;
}
.pay-method-form .form-btn > * {
  width: 190px !important;
}
.pay-method-form .form-btn p > .co-btn-new.co-nbtn-m {
  width: 100%;
}

/* css版ステップ
----------------------------------------------------------- */
.step-info {
  position: relative;
  max-width: 700px;
  margin: 16px auto 35px;
  color: #9c9c9c;
  text-align: center;
}
.normal-complete .step-info {
  margin: 16px auto 47px;
}
.step-info .step-txt p {
  position: relative;
  display: inline-block;
  width: 16.66%;
  margin: 0;
  vertical-align: bottom;
}

/*** ステップ文言 ***/
.step-info .step-txt {
  font-size: 13px;
}

/*** 点● ***/
.step-info .step-txt p::after {
  position: absolute;
  bottom: -0.9em;
  left: 46%;
  z-index: 1;
  width: 0.6em;
  height: 0.6em;
  text-align: center;
  content: " ";
  background: #ffffff;
  border: 1px solid #25b9d3;
  border-radius: 15px;
}

/*** ステップ間の線 ***/
.step-info::after {
  position: absolute;
  bottom: -0.55em;
  left: 0;
  z-index: 0;
  height: 0;
  content: "";
  border-top: 2px #25b9d3 solid;
}

/*** ステップ数に応じた調整 ***/
/* 2段階ステップ */
.step-info.step2::after {
  width: 16%;
  margin: 0 42%;
}

/* 3段階ステップ */
.step-info.step3::after {
  width: 34%;
  margin: 0 33%;
}

/* 4段階ステップ */
.step-info.step4::after {
  width: 51%;
  margin: 0 24.5%;
}

/* 5段階ステップ */
.step-info.step5::after {
  width: 65%;
  margin: 0 17.5%;
}

/* 6段階ステップ */
.step-info.step6::after {
  width: 82%;
  margin: 0 9%;
}

/*** 現在地 ***/
.step-info .now-step {
  font-weight: bold;
  color: #25b9d3;
}
.step-info p.now-step::after {
  color: #25b9d3;
  background: #25b9d3;
  border: 1px solid #25b9d3;
}

/* ボタン付近のSSL関連
----------------------------------------------------------- */
.basis-of-privacy-statement {
  margin: 0 auto;
  text-align: center;
}
.basis-of-privacy-statement a {
  display: inline-block;
  vertical-align: middle;
}

/*** SSL証明書 ***/
.ssl-certificate {
  margin-top: 40px;
  text-align: center;
}
.ssl-certificate > table {
  margin: 0 auto;
}
.ssl-certificate .ssl-explain {
  margin-top: 17px;
  font-size: 12px;
  line-height: 2;
  color: #6c6c6c;
}

/* 資料請求フォームの完了ページ SNSリンクボタン
----------------------------------------------------------------------------------------------- */
.form-snslink-wrap {
  box-sizing: border-box;
  width: 600px;
  padding: 35px 40px;
  margin: 0 auto;
  background-color: #ffffff;
  border: 1px solid #eeeeee;
}
.form-snslink-wrap p {
  font-size: 14px;
  text-align: center;
}
.form-snslink {
  text-align: center;
}
.form-snslink a {
  display: inline-block;
  width: 146px;
  padding: 9px 0 8px;
  margin-top: 18px;
  font-size: 12px;
  vertical-align: middle;
  text-decoration: none;
  border: 1px solid #3296d2;
  border-radius: 5px;
  transition: 0.2s;
}
.form-snslink a::after {
  display: inline-block;
  width: 8px;
  height: 8px;
  margin: -2px 0 0 11px;
  vertical-align: middle;
  content: "";
  border-top: solid 1px #3296d2;
  border-right: solid 1px #3296d2;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  transition: 0.2s;
}
.form-snslink .link-fb {
  margin-right: 20px;
}
.form-snslink a > span {
  padding: 5px 0 5px 30px;
}
.form-snslink .link-fb > span {
  background: url(/web/img/common/icon/facebook_icon00.png) left center/20px
    no-repeat;
}
.form-snslink .link-tw > span {
  background: url(/web/img/common/icon/twitter_icon00.png) left center/20px
    no-repeat;
}
.form-snslink a:hover {
  color: #ffffff;
  background: #3296d2;
}
.form-snslink a:hover::after {
  border-color: #ffffff;
}
.form-snslink a.link-fb:hover > span {
  background-image: url(/web/img/common/icon/facebook_hover_icon00.png);
}
.form-snslink a.link-tw:hover > span {
  background-image: url(/web/img/common/icon/twitter_hover_icon00.png);
}

/* SP */
@media screen and (width <= 670px) {
  .form-snslink-wrap p {
    font-size: 13px;
  }
  .form-snslink-wrap {
    box-sizing: border-box;
    width: 100%;
    min-width: 200px;
    padding: 35px 10px;
    border-radius: 5px;
  }
  .form-snslink .link-fb {
    margin-right: auto;
  }
  .form-snslink a {
    display: block;
    margin: 14px auto 0;
  }
}

/* 資料請求フォームの完了ページ セミナーバナー
----------------------------------------------------------------------------------------------- */
.form-banner-wrap {
  max-width: 346px;
  margin: 0 auto;
  background: #ffffff;
  border: 1px solid #c6c6c6;
}
.form-banner-wrap .seminar-banner-a {
  display: flex;
  justify-content: space-between;
  height: 87px;
  padding: 0;
  overflow: visible;
  background: #00a7a7;
  transition: opacity 0.3s;
}
.form-banner-wrap .seminar-banner-a:hover {
  text-decoration: none;
  opacity: 0.5;
}
.form-banner-wrap .seminar-banner-a .b-left {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 28px;
  margin: 2px;
  font-weight: bold;
  color: #00a7a7;
  background: #ffffff;
  -ms-writing-mode: tb-rl;
  writing-mode: vertical-rl;
}
.form-banner-wrap .seminar-banner-a .b-middle {
  display: flex;
  flex-grow: 2;
  flex-direction: column;
  justify-content: center;
  max-width: 170px;
  margin: 15px;
  text-align: center;
}
.form-banner-wrap .seminar-banner-a .up {
  padding: 7px 0;
  margin-bottom: 9px;
  font-size: 15px;
  color: #ffffff;
  border-top: 1px solid #ffffff;
  border-bottom: 1px solid #ffffff;
}
.form-banner-wrap .seminar-banner-a .down {
  font-size: 20px;
  font-weight: bold;
  color: #ffffff;
}
.form-banner-wrap .seminar-banner-a .banner-image > img {
  max-width: 105px;
  height: 87px;
  object-fit: cover;
  object-position: 70% 0;
}

/* SP */
@media screen and (width <= 670px) {
  .form-banner-wrap .seminar-banner-a .b-middle {
    max-width: 162px;
    margin: 3px 0 3px 5px;
  }
  .form-banner-wrap .seminar-banner-a .up {
    font-size: 14px;
  }
  .form-banner-wrap .seminar-banner-a .down {
    font-size: 19px;
  }
  .form-banner-wrap .seminar-banner-a .banner-image > img {
    max-width: 65px;
    object-position: 10% 0;
  }
}

/* 請求手続きの振込口座情報
----------------------------------------------------------------------------------------------- */
#new_perform_form .dsply-flex {
  max-width: 420px;
}

/* プラン変更フォーム
----------------------------------------------------------------------------------------------- */
.plan-change .co-question-mark {
  display: inline-block;
  margin-top: -3px;
  vertical-align: middle;
}
.plan-change .co-question-mark > p {
  width: 340px;
  font-weight: normal;
}
.plan-change .co-question-mark > p > .indent {
  margin-left: 1.4em;
}
.plan-change .box-wrap {
  display: flex;
  justify-content: space-between;
  width: 800px;
  margin: 30px auto 0;
}
.plan-change .box-wrap .form-in-form {
  position: relative;
  box-sizing: border-box;
  width: 370px;
  padding: 23px 30px 15px !important;
}
.plan-change .box-wrap .form-in-form.arrow::before {
  position: absolute;
  top: 50%;
  left: 109%;
  display: block;
  width: 0;
  height: 0;
  content: "";
  border-color: transparent transparent transparent #9c9c9c;
  border-style: solid;
  border-width: 15px 0 15px 20px;
  transform: translate(-50%, -50%);
}
.plan-change .box-wrap .data-table {
  margin: 0;
}
.plan-change .box-wrap .data-table h4 {
  padding-bottom: 0;
  font-size: 13px;
}
.plan-change .box-wrap .data-table .th {
  width: 57%;
  height: 50px;
  padding-left: 0;
  white-space: nowrap;
}
.plan-change .box-wrap .data-table .td {
  height: 50px;
  padding: 0;
  padding-right: 10px;
  vertical-align: middle;
  text-align: right;
  white-space: nowrap;
}
.plan-change .data-table .td .radio-disabled {
  color: #888888;
  cursor: default;
}

/* 資料請求フォーム
----------------------------------------------------------------------------------------------- */
#document-request-form .document-easy-explain {
  position: relative;
  box-sizing: border-box;
  max-width: 900px;
  padding: 30px 23px 0 30px;
  margin: 20px auto 36px;
  overflow: hidden;
  color: #ffffff;
  background-color: #23b9d2;
  border-radius: 5px;
}
#document-request-form .document-easy-explain .background-img {
  position: absolute;
  right: -6px;
  bottom: 0;
  width: 409px;
  height: 160px;
  background: url(/web/img/pre/document_request/document_explain_04.png)
    center bottom no-repeat;
  background-size: contain;
}
#document-request-form .document-easy-explain h3 {
  margin-bottom: 27px;
  font-size: 23px;
  text-align: center;
}
#document-request-form .document-easy-explain .table-contents {
  display: flex;
  align-items: flex-start;
  justify-content: center;
  width: fit-content;
  margin: 27px 30px 22px;
  font-size: 16px;
}
#document-request-form .document-easy-explain ul {
  float: left;
  line-height: 1.8;
  letter-spacing: 0.19px;
}
#document-request-form .document-easy-explain ul > li > span {
  font-weight: bold;
}
#document-request-form .optional-mark.row2 {
  margin-top: 1em;
}
#document-request-form .sentence03 {
  margin-bottom: 20px;
}
#document-request-form .co-btn-download {
  margin-bottom: 45px;
  vertical-align: middle;
}

@media screen and (width <= 940px) {
  #document-request-form .document-easy-explain,
  #document-request-form .document-easy-explain .background-img {
    position: static;
  }
}
@media screen and (width <= 940px) and (width >= 671px) {
  #document-request-form .document-easy-explain .background-img {
    width: auto;
  }
  #document-request-form .document-easy-explain .table-contents {
    width: auto;
    font-size: 14px;
  }
}
@media screen and (width <= 670px) {
  #document-request-form .document-easy-explain {
    padding: 20px 0 0;
    overflow: visible;
  }
  #document-request-form .document-easy-explain h3 {
    margin-bottom: 15px;
    font-size: 19px;
    line-height: 1.6;
  }
  #document-request-form .document-easy-explain ul {
    display: none;
  }
  #document-request-form .document-easy-explain .background-img {
    width: 100%;
    height: 82px;
    background-position: center bottom;
    background-size: auto 84px;
  }
  #document-request-form .optional-mark.row2 {
    margin-top: 0.2em;
  }
  #document-request-form .co-btn-download {
    width: 265px;
  }
}

/* ログインフォームからアカウント登録フォームへの導線
------------------------------------------------------------- */
.login-to-new-account-form {
  box-sizing: border-box;
  display: flex;
  flex-flow: column nowrap;
  align-items: center;
  justify-content: center;
  max-width: 500px;
  padding: 40px;
  margin: 40px auto 0;
  background: #ffffff;
  border-radius: 5px;
}
.login-to-new-account-form .to-new-form-explain {
  margin-bottom: 20px;
  font-size: 15px;
  text-align: center;
}

@media screen and (width <= 670px) {
  .login-to-new-account-form .co-nbtn-l {
    width: 245px;
    font-size: 16px;
  }
}

/* ログインフォーム
------------------------------------------------------------- */
#pre-form-wrap.login-form .container .wrap-framework {
  margin-top: 0;
  border: none;
}
#pre-form-wrap.login-form .container > h2 {
  display: block;
  width: 95%;
  max-width: 500px;
  margin: 0 auto;
}

/* 特約同意フォーム
------------------------------------------------------------- */
.opt-agreement {
  margin-bottom: 15px;
  line-height: 1.8em;
}
.opt-agreement pre {
  max-width: 830px;
  margin: 0 auto;
  white-space: pre-line;
}
.form-content-consent-box.opt-agreement-conclusion {
  padding: 35px;
  margin-bottom: 35px;
}
.form-content-consent-box.opt-agreement-conclusion pre {
  white-space: pre-line;
}

/* アカウント登録フォーム
------------------------------------------------------------- */
.application-form .address-two-line {
  display: flex;
  margin-top: 15px;
}
.application-form .address-two-line .address-detail {
  margin-left: 15px;
}

@media screen and (width <= 670px) {
  .application-form .address-two-line {
    flex-direction: column;
    align-items: flex-start;
    margin-top: 10px;
  }
  .application-form .address-two-line .address-detail {
    margin: 10px 0 0;
  }
}
.entry-recaptcha-v2 {
  display: flex;
  justify-content: center;
  margin: 30px auto;
}


/* base.css
----------------------------------------------------------------------------------------------- */
@media screen and (width <= 670px) {
  /*** 各width ***/
  input[type="text"],
  input[type="password"],
  input[type="email"],
  input[type="tel"],
  input[type="number"],
  input[type="search"],
  textarea {
    padding: 4px 1.5%;
  }

  /*** input,textarea要素 各width ***/
  .v-long {
    width: 96.5%;
  }
}

/* form.css
----------------------------------------------------------------------------------------------- */
/*** 基本 ***/
@media screen and (width <= 670px) {
  .input-form h4,
  .confirm-form h4 {
    width: 100%;
  }
  .simple-form .simple-form-explain {
    margin-bottom: 20px;
  }
  .simple-form .input-area {
    width: 100%;
    margin: 0 auto 20px;
  }
}

/*** シンプルヘッダー ***/
@media screen and (width <= 670px) {
  #simple-header .header-inner h1 {
    font-size: 30px;
  }
  #simple-header {
    min-height: 50px;
  }
}
@media screen and (width <= 670px) {
  .data-table {
    width: 100%;
  }
  .data-table:last-child {
    margin-bottom: 0;
  }
  .data-table .tr,
  .data-table .tr2,
  .data-table .tr .th,
  .data-table .tr2 .th,
  .data-table .td,
  .data-table .td2,
  #pre-form-wrap .input-form .data-table .td {
    display: block;
    width: 100%;
    padding: 0;
  }
  .data-table .tr,
  .data-table .tr2 {
    padding-top: 15px;
  }
  .data-table .tr .th,
  .data-table .tr2 .th {
    padding-bottom: 5px;
  }
  .data-table .td,
  #pre-form-wrap .input-form .data-table .td {
    padding-bottom: 20px;
  }
  .data-table .required-mark {
    position: static;
    margin-right: 5px;
    margin-left: 0;
  }
  .data-table .td3 {
    padding: 0 0 20px;
  }
  .confirm-form .data-table .td {
    padding: 4px 0 10px;
  }
}

/*** フォーム.内容同意 ***/
@media screen and (width <= 670px) {
  .form-content-consent-box2 {
    width: 100%;
    padding: 15px 0 15px 5%;
    text-align: left;
  }
  .form-content-consent-box2 .slash {
    display: none !important;
  }
  .form-content-consent-box2 .br-box {
    display: block;
  }
  .form-content-consent-box2 .br-box:first-child {
    padding-bottom: 3px;
  }
  .consent-check-area .chk-b {
    width: 40px;
  }
  .consent-check-area .sentence {
    display: inline-block;
    width: 80%;
    vertical-align: top;
    text-align: left;
  }
}

/*** (半角数字)などのwindow幅による出し分け ***/
.note-format-pc {
  display: inline-block;
}
.note-format-sp {
  display: none;
}

@media screen and (width <= 670px) {
  .note-format-pc {
    display: none;
  }
  .note-format-sp {
    display: inline-block;
  }
}

/*** window幅により改行指定 ***/
.form-pc-br {
  display: block;
}
.form-sp-br {
  display: inline-block;
}

@media screen and (width <= 670px) {
  .form-pc-br {
    display: inline-block;
  }
  .form-sp-br {
    display: block;
  }
}

/*** エラー系 ***/
@media screen and (width <= 670px) {
  .form-error-box00 {
    width: 100%;
    padding: 8px 0 4px;
    margin-top: 0;
  }
  .page-explain + .w960 > .form-error-box00 {
    margin-top: -24px;
  }
}

/*** 完了画面（notModal） ***/
@media screen and (width <= 670px) {
  .normal-complete .img-area {
    margin-top: 0;
  }
  .normal-complete .sentence03,
  .normal-complete .sentence04 {
    margin-bottom: 15px;
  }
}

/*** 汎用的なエラー画面 ***/
.error-pattern-br01 {
  display: inline;
}
.error-pattern-br02 {
  display: block;
}

@media screen and (width <= 670px) {
  .error-pattern {
    padding-top: 14px !important;
  }
  .error-pattern .img-area {
    margin-top: 0;
  }
  .error-pattern .h2-margin {
    margin-top: 5px !important;
  }
  .error-pattern-br01 {
    display: block;
  }
  .error-pattern-br02 {
    display: inline;
  }
}

/*** css版ステップ ***/
@media screen and (width <= 670px) {
  /* 3段階 */
  .step-info.step3::after {
    width: 66%;
    margin: 0 17%;
  }
  .step-info.step3 .step-txt p {
    width: 33%;
  }
}

/*** ボタン付近のSSL関連 ***/
@media screen and (width <= 940px) {
  .basis-of-privacy-statement {
    width: 73%;
  }
}
@media screen and (width <= 670px) {
  .basis-of-privacy-statement {
    width: 100%;
  }
}

/* common.css
----------------------------------------------------------------------------------------------- */
/*** ボタン ***/
@media screen and (width <= 670px) {
  .co-btn-l,
  .co-btn-l > span > a,
  .co-btn-l > span > span,
  .co-btn-dsbl-l > span {
    min-width: 95px;
  }
}

/* 支払い方法エリア
----------------------------------------------------------- */
@media screen and (width <= 940px) {
  .data-table .pay-method-credit .credit-input .ci-tr .ci-td {
    padding-left: 30px;
  }
  .data-table .pay-method-paid .supplemental {
    display: block;
    margin-left: 18px;
  }
}
@media screen and (width <= 670px) {
  .data-table .pay-method-credit .credit-input .credit-padding-area {
    padding: 15px;
  }
  .data-table .pay-method-credit .credit-input .ci-tr,
  .data-table .pay-method-credit .credit-input .ci-tr .ci-th,
  .data-table .pay-method-credit .credit-input .ci-tr .ci-td {
    display: block;
  }
  .data-table .pay-method-credit .credit-input .ci-tr .ci-td {
    padding-left: 0;
  }
  .data-table .pay-method-credit .credit-input .credit-num-input {
    width: 45px;
  }
  .data-table .pay-method-credit .credit-input .ci-tr .ci-td .credit-img img {
    display: block;
  }
  .data-table .pay-method-credit .padding-adjustable {
    padding-top: 0;
  }
  .data-table .pay-method-credit .margin-adjustable {
    margin-bottom: 15px;
  }
  .credit-terms01 {
    margin-top: 3px;
  }
  .confirm-form .data-table .one-row .confirm-pay-method-paid-attention {
    display: block;
    margin-left: 0;
  }
  .confirm-form .data-table .one-row {
    padding-bottom: 12px;
  }
  .data-table .pay-method-credit .credit-input .required-mark-02 {
    margin-left: 0;
  }
  .data-table .pay-method-credit .credit-input .input-name {
    margin-left: 33px;
  }
}


/* header
------------------------------------------------------------- */
.pre-header {
  position: fixed;
  z-index: 20;
  width: 100%;
  background: #ffffff;
  box-shadow: 0 -4px 7px 0 #000000;
  transition:
    background 0.2s,
    box-shadow 0.2s,
    color 0.2s;
}
.pre-header a {
  color: #333333;
  text-decoration: none;
}
.pre-header .header-inner-wrap {
  box-sizing: border-box;
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  max-width: 1300px;
  height: 60px;
  padding: 0 1.5%;
  margin: 0 auto;
}
.pre-header .header-inner-wrap > :last-child {
  margin-left: auto;
}
.pre-header .logo {
  width: 148px;
  margin: 0 35px -5px 0;
}
.pre-header .logo > img {
  width: 100%;
}
.pre-header nav {
  display: flex;
  align-items: center;
  width: calc(100% - 148px);
  min-width: 767px;
}
.pre-header .menu-1 {
  display: flex;
  flex-wrap: nowrap;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
}
.pre-header .menu-1 > li > a {
  padding: 5px 12px;
}
.pre-header .menu-1 > li:first-child > a {
  padding-left: 0;
}
.pre-header .menu-1 > li:last-child > a {
  padding-right: 0;
}
.pre-header .menu-2 {
  display: flex;
  align-items: center;
  margin-left: auto;
}
.pre-header .login {
  padding: 10px 0;
  margin-right: 15px;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 15px;
  font-weight: 500;
}
.pre-header .login > span {
  padding: 0 0 0 20px;
  background: url(/web/img/common/header/login_black_00.png) no-repeat left
    center/14px 14px;
  transition: background 0.2s;
}
.pre-header .tel {
  display: flex;
  flex-direction: column;
  margin-left: 8px;
  font-family: "Noto Sans JP", sans-serif;
  font-weight: bold;
  line-height: 1.25;
  text-align: end;
}
.pre-header .tel .num {
  display: flex;
  gap: 4px;
  align-items: center;
  font-size: 18px;
}
.pre-header .tel .num img {
  width: 16px;
  height: 16px;
  padding-top: 3px;
}
.pre-header .tel .day {
  font-size: 11px;
  font-weight: normal;
}
.pre-header .menu-1 > li > a {
  display: block;
}
.pre-header .menu-1 .contact {
  display: none;
}
.pre-header .underbar-wrap .underbar {
  position: relative;
  display: block;
}
.pre-header .underbar-wrap .underbar::before,
.pre-header .underbar-wrap .underbar::after {
  position: absolute;
  bottom: -3px;
  display: block;
  width: 0;
  height: 2px;
  overflow: hidden;
  content: "";
  -webkit-transition: 0.2s;
  transition: 0.2s;
}
.pre-header .underbar-wrap .underbar::before {
  right: 50%;
}
.pre-header .underbar-wrap .underbar::after {
  left: 50%;
}
.pre-header .underbar-wrap:hover .underbar::before,
.pre-header .underbar-wrap:hover .underbar::after,
.pre-header .underbar-wrap .underbar.active::before,
.pre-header .underbar-wrap .underbar.active::after {
  z-index: 1;
  width: 50.5%;
  background-color: #0aa8a8;
  -webkit-transition: 0.2s;
  transition: 0.2s;
}
.pre-header .account-registration,
.sp-fixed-to-form {
  padding: 10px 23px 9px;
  margin-bottom: 2px;
  font-size: 15px;
}
.pre-header .account-registration::after,
.sp-fixed-to-form .account-registration::after {
  right: 23px;
}
.pre-header .account-registration .nagative-margin,
.sp-fixed-to-form .account-registration .nagative-margin {
  margin-left: -5px;
}
#nav-switch-chk,
.pre-header .nav-switch,
.nav-open-bg {
  display: none;
}
.pre-header .sp {
  display: none;
}
.pre-header .menu-2 .account-registration {
  margin-left: 5px;
}

@media (width >= 940px) and (width <= 1199px) {
  .pre-header .logo {
    margin-right: 18px;
  }
  .pre-header .menu-1 > li > a {
    padding: 5px 8px;
  }
  .pre-header .login {
    margin-right: 4px;
  }
  .pre-header .tel {
    margin-left: 8px;
  }
  .pre-header .menu-2 .nagative-margin {
    display: none;
  }
  .pre-header .menu-2 .account-registration {
    padding-right: 21px;
    padding-left: 16px;
    margin-left: 5px;
    font-size: 13px;
  }
  .pre-header .menu-2 .account-registration::after {
    right: 15px;
  }
}
@media screen and (width <= 1079px) {
  .pre-header .tel {
    display: none;
  }
}
@media screen and (width <= 940px) {
  .pre-header a {
    color: #ffffff;
  }
  .pre-header .header-inner-wrap {
    padding: 0;
  }
  .pre-header .logo {
    margin-left: 10px;
  }
  .pre-header nav {
    position: fixed;
    top: 60px;
    left: -100%;
    z-index: 1;
    box-sizing: border-box;
    display: block;
    align-items: normal;
    width: 100%;
    min-width: auto;
    height: 100%;
    padding: 10px 15px 40px;
    overflow-y: scroll;
    background: #3e4847;
    opacity: 0;
    transition-duration: 0.7s, 0.7s;
    transition-property: opacity, left;
  }
  .pre-header .account-registration .nagative-margin,
  .sp-fixed-to-form .nagative-margin {
    margin-left: 10px;
  }
  .pre-header .menu-1,
  .pre-header .menu-1 .contact {
    display: block;
  }
  .pre-header .menu-1 .contact > a {
    padding-left: 40px;
    background: url(/web/img/common/header/contact_00.png) no-repeat 10px/22px
      14px;
  }
  .pre-header .menu-1 .contact .underbar {
    margin-bottom: -1px;
  }
  .pre-header .menu-1 > li {
    width: 100%;
  }
  .pre-header .menu-1 > li > a {
    position: relative;
    left: -100%;
    padding: 20px 10px;
    border-bottom: 1px solid #666666;
  }
  .pre-header .menu-1 > li:first-child > a {
    padding-left: 10px;
    transition: left 0.2s;
  }
  .pre-header .menu-1 > li:nth-child(2) > a {
    transition: left 0.3s;
  }
  .pre-header .menu-1 > li:nth-child(3) > a {
    transition: left 0.4s;
  }
  .pre-header .menu-1 > li:nth-child(4) > a {
    transition: left 0.5s;
  }
  .pre-header .menu-1 > li:nth-child(5) > a {
    transition: left 0.6s;
  }
  .pre-header .menu-1 > li:nth-child(6) > a {
    transition: left 0.7s;
  }
  .pre-header .menu-1 > li:nth-child(7) > a {
    transition: left 0.8s;
  }
  .pre-header .menu-1 > li > a::after {
    position: absolute;
    right: 20px;
    bottom: 50%;
    display: inline-block;
    width: 7px;
    height: 7px;
    margin-bottom: -4px;
    vertical-align: middle;
    content: "";
    border-top: solid 2px #ffffff;
    border-right: solid 2px #ffffff;
    -webkit-transform: rotate(45deg);
    transform: rotate(45deg);
  }
  .pre-header .menu-2 {
    flex-direction: column;
  }
  .pre-header .menu-2 > * {
    margin-right: auto;
  }
  .pre-header .underbar-wrap .underbar::before,
  .pre-header .underbar-wrap .underbar::after {
    content: none;
  }
  .pre-header .account-registration,
  .sp-fixed-to-form .account-registration {
    order: 1;
    padding: 14px 40px 15px;
    margin: 20px auto 10px 0;
  }
  .pre-header .login {
    order: 2;
  }
  .pre-header .login > span {
    background-image: url(/web/img/common/header/login_white_00.png);
  }
  .pre-header .nav-switch {
    position: relative;
    display: block;
    align-self: center;
    width: 35px;
    height: 26px;
    margin-right: 15px;
    cursor: pointer;
  }
  .pre-header .nav-switch span,
  .pre-header .nav-switch::before,
  .pre-header .nav-switch::after {
    display: block;
    width: 100%;
    height: 3px;
    background-color: #14b4b4;
    border-radius: 3px;
  }
  .pre-header .nav-switch span {
    margin-top: 12px;
  }
  .pre-header .nav-switch::before,
  .pre-header .nav-switch::after {
    position: absolute;
    content: "";
    -webkit-transition: 0.2s;
    transition: 0.2s;
  }
  .pre-header .nav-switch::before {
    bottom: 0;
  }
  .pre-header .nav-switch::after {
    top: 0;
  }
  .pre-header #nav-switch-chk:checked ~ nav {
    left: 0;
    overflow: hidden;
    opacity: 1;
  }
  .pre-header #nav-switch-chk:checked ~ nav .menu-1 > li > a {
    left: 0;
  }
  .pre-header #nav-switch-chk:checked ~ .nav-switch span {
    width: 0;
  }
  .pre-header #nav-switch-chk:checked ~ .nav-switch::before,
  .pre-header #nav-switch-chk:checked ~ .nav-switch::after {
    top: 14px;
    -ms-transform-origin: 50% 50%;
    -webkit-transform-origin: 50% 50%;
    transform-origin: 50% 50%;
    -webkit-transition: 0.3s;
    transition: 0.3s;
  }
  .pre-header #nav-switch-chk:checked ~ .nav-switch::before {
    -ms-transform: rotate(135deg);
    -webkit-transform: rotate(135deg);
    transform: rotate(135deg);
  }
  .pre-header #nav-switch-chk:checked ~ .nav-switch::after {
    -ms-transform: rotate(-135deg);
    -webkit-transform: rotate(-135deg);
    transform: rotate(-135deg);
  }
  .pre-header .pc {
    display: none;
  }
  .pre-header .sp {
    position: absolute;
    top: 11px;
    right: -150%;
    display: inline-block;
    order: 0;
    margin-left: auto;
    opacity: 0;
    transition: opacity 0.2s;
  }
  .pre-header .sp.login > span {
    color: #333333;
    background-image: url(/web/img/common/header/login_black_00.png);
  }
  .pre-header .sp.tel {
    top: 0;
    right: 64px;
    display: flex;
    flex-direction: column;
    justify-content: center;
    order: 0;
    height: 60px;
    opacity: 1;
  }
  .pre-header .sp.tel a {
    color: #333333;
  }
  .pre-header #nav-switch-chk:checked ~ .sp.login {
    right: 45px;
    opacity: 1;
  }
  .pre-header #nav-switch-chk:checked ~ .sp.tel {
    opacity: 0;
  }
}
@media screen and (width <= 670px) {
  .pre-header .logo {
    width: 120px;
  }
  .pre-header .menu-1 > li > a {
    padding: 11px 10px;
  }
  .pre-header .menu-2 .account-registration {
    min-width: 180px;
    margin-bottom: 0;
  }
  .pre-header .sp.tel {
    right: 60px;
  }
  .pre-header .sp.tel .num {
    font-size: 15px;
  }
  .pre-header .sp.tel .num img {
    width: 12px;
    height: 12px;
    padding-top: 3px;
  }
}

/* footer
------------------------------------------------------------- */
.pre-footer {
  line-height: 1.4;
  text-align: left;
}
.pre-footer a:hover > .dsply-inblk {
  text-decoration: underline;
}
.pre-footer .up {
  box-sizing: border-box;
  padding: 25px 0 0;
  background-color: #3e4847;
}
.pre-footer .up a:not(.co-btn-gray) {
  color: #ffffff;
}
.pre-footer .bookmarking {
  display: flex;
  justify-content: center;
}
.pre-footer .bookmarking .fb-twitter {
  display: flex;
}
.pre-footer .bookmarking > div:not(:first-child) {
  margin-left: 10px;
}
.pre-footer .bookmarking .wsbl_twitter {
  margin: 0 10px;
}
.pre-footer .menu-wrap {
  display: flex;
  max-width: 1000px;
  padding: 0 20px;
  margin: 0 auto;
  font-size: 12px;
}
.pre-footer .menu-wrap .menu {
  position: relative;
  box-sizing: border-box;
  padding-top: 10px;
  padding-bottom: 2px;
}
.pre-footer .menu-wrap .menu:not(:first-child) {
  padding-left: 30px;
  border-left: 1px solid #5e7482;
}
.pre-footer .menu-wrap .menu:nth-child(1) {
  flex-basis: 15%;
  order: 1;
}
.pre-footer .menu-wrap .menu:nth-child(2) {
  flex-basis: 37%;
  order: 3;
}
.pre-footer .menu-wrap .menu:nth-child(3) {
  flex-basis: 28%;
  order: 2;
}
.pre-footer .menu-wrap .menu:nth-child(4) {
  order: 4;
}
.pre-footer .menu > li:not(:last-child) {
  margin-bottom: 10px;
}
.pre-footer .menu-wrap .menu > li.shoutorihiki-link,
.pre-footer .menu-wrap .menu > li.seminar-link {
  margin-bottom: 13px;
  font-size: 17px;
  transition: opacity 0.2s;
}
.pre-footer .menu-wrap .shoutorihiki-link img {
  width: 16px;
  margin-right: 7px;
}
.pre-footer .menu-wrap .seminar-link img {
  width: 20px;
  margin-right: 7px;
  vertical-align: sub;
}
.pre-footer .menu-wrap .shoutorihiki-link span,
.pre-footer .menu-wrap .seminar-link span {
  font-size: 12px;
}
.pre-footer .menu-wrap .partner {
  margin-top: 15px;
  line-height: 1.7;
}
.pre-footer .menu-wrap .x,
.pre-footer .menu-wrap .facebook {
  margin-right: 14px;
}
.pre-footer .menu-wrap .x,
.pre-footer .menu-wrap .facebook,
.pre-footer .menu-wrap .youtube {
  display: inline-block;
  transition: opacity 0.2s;
}
.pre-footer .menu-wrap .x img {
  width: 18px;
}
.pre-footer .menu-wrap .facebook img {
  width: 19px;
}
.pre-footer .menu-wrap .youtube img {
  width: 24px;
}
.pre-footer .menu-wrap .x:hover,
.pre-footer .menu-wrap .facebook:hover,
.pre-footer .menu-wrap .youtube:hover,
.pre-footer .menu-wrap .shoutorihiki-link:hover,
.pre-footer .menu-wrap .seminar-link:hover {
  opacity: 0.8;
}
.pre-footer .menu-wrap .co-btn-dblue.button {
  margin-bottom: 5px;
}
.pre-footer .submenu-wrap {
  width: 100%;
  margin-top: 20px;
  border-top: 1px solid #5e7482;
}
.pre-footer .submenu-wrap .submenu {
  display: flex;
  justify-content: space-between;
  max-width: 1040px;
  margin: 0 auto;
}
.pre-footer .submenu-wrap .submenu li {
  border-left: 1px solid #5e7482;
}
.pre-footer .submenu-wrap .submenu li:nth-child(1) {
  flex-basis: 55%;
}
.pre-footer .submenu-wrap .submenu li:nth-child(2) {
  flex-basis: 45%;
  border-right: 1px solid #5e7482;
}
.pre-footer .submenu-wrap .submenu a {
  position: relative;
  display: block;
  padding: 20px 40px 15px 25px;
  font-size: 18px;
  transition: 0.5s;
}
.pre-footer .submenu-wrap .submenu a:hover {
  text-decoration: none;
  background-color: #586665;
  opacity: 0.8;
}
.pre-footer .submenu-wrap .submenu a::after {
  position: absolute;
  top: 45%;
  right: 20px;
  display: inline-block;
  width: 7px;
  height: 7px;
  vertical-align: middle;
  content: "";
  border-top: solid 2px #ffffff;
  border-right: solid 2px #ffffff;
  transform: rotate(45deg);
  transition: 0.5s;
}
.pre-footer .submenu-wrap .submenu li:nth-child(1) a {
  padding-left: 80px;
}
.pre-footer .submenu-wrap .submenu li:nth-child(1) a::before {
  position: absolute;
  top: 30%;
  width: 42px;
  height: 42px;
  margin: 0 0 0 -55px;
  content: "";
  background: url(/web/img/pre/footer/handshake_whi_00.svg) 0 0 / contain
    no-repeat;
  border: none;
  transform: none;
}
.pre-footer .submenu-wrap .submenu span {
  display: block;
  margin-top: 5px;
  font-size: 12px;
}
.pre-footer .down {
  padding: 45px 0 15px;
  font-size: 13px;
  color: #cccccc;
  text-align: left;
  background: #222222;
}
.pre-footer .down .main-title {
  max-width: 850px;
  margin: 0 auto 20px;
}
.pre-footer .down .wrap {
  max-width: 780px;
  margin: 0 auto 20px;
}
.pre-footer .down .title {
  padding-bottom: 2px;
  margin-bottom: 18px;
  border-bottom: 1px solid #575757;
}
.pre-footer .down .wrap .space {
  width: 5%;
}
.pre-footer .down .wrap a {
  color: #cccccc;
}
.pre-footer .down .wrap .domain {
  margin-bottom: 15px;
}
.pre-footer .down .wrap .domain > a {
  display: inline-block;
  line-height: 1.2;
  text-decoration: none;
}
.pre-footer .down .wrap .domain .name {
  padding: 0;
  font-weight: bold;
  border: none;
}
.pre-footer .down .wrap .domain a:hover .name {
  text-decoration: underline;
}
.pre-footer .down .wrap .domain .explain {
  font-size: 11px;
}
.pre-footer .down .wrap .sub {
  padding-left: 48px;
  margin-top: 7px;
}
.pre-footer .down .wrap .sub li {
  margin-bottom: 3px;
  font-weight: bold;
  list-style-type: disc;
}
.pre-footer .down .wrap .domain > a {
  padding-left: 33px;
}
.pre-footer .down .wrap .left-column,
.pre-footer .down .wrap .right-wrap-column {
  float: left;
}
.pre-footer .down .wrap .left-column {
  box-sizing: border-box;
  width: 33%;
  margin-right: 3%;
}
.pre-footer .down .wrap .left-column a.sd-link {
  background: url(/web/img/pre/footer/sd_icon01.svg) left center / 23px
    no-repeat;
}
.pre-footer .down .wrap .left-column a.sdfactory-link {
  background: url(/web/img/pre/footer/sdfactory_icon01.svg) left center / 23px
    no-repeat;
}
.pre-footer .down .wrap .left-column a.corec-link {
  background: url(/web/img/pre/footer/corec_icon01.svg) left center / 23px
    no-repeat;
}
.pre-footer .down .wrap .right-wrap-column {
  width: 64%;
}
.pre-footer .down .wrap .right-wrap-column .center-column a.paid-link {
  background: url(/web/img/pre/footer/paid_icon01.svg) left center / 23px
    no-repeat;
}
.pre-footer .down .wrap .right-wrap-column .right-column a.tg-link {
  background: url(/web/img/pre/footer/tg_icon01.svg) left center / 25px
    no-repeat;
}
.pre-footer .down .wrap .right-wrap-column .right-column a.uri-link {
  background: url(/web/img/pre/footer/uri_icon00.svg) left center / 23px
    no-repeat;
}
.pre-footer .down .wrap .right-wrap-column .right-column a.rent-link {
  background: url(/web/img/pre/footer/rent_icon00.svg) left center / 23px
    no-repeat;
}
.pre-footer .down .wrap .right-wrap-column .center-column,
.pre-footer .down .wrap .right-wrap-column .right-column {
  float: left;
}
.pre-footer .down .wrap .right-wrap-column .center-column {
  width: 50%;
  margin-right: 5%;
}
.pre-footer .down .wrap .right-wrap-column .right-column {
  width: 45%;
}
.pre-footer .down .copyright {
  margin: 0;
  font-size: 12px;
  font-weight: bold;
  line-height: 1;
  text-align: center;
}
.pre-footer .down .copyright .under {
  font-size: 10px;
}

@media screen and (width <= 940px) {
  .pre-footer .menu-wrap {
    flex-wrap: wrap;
    max-width: 560px;
  }
  .pre-footer .menu-wrap .menu:not(:first-child) {
    padding-left: 59px;
  }
  .pre-footer .menu-wrap .menu:nth-child(1),
  .pre-footer .menu-wrap .menu:nth-child(2),
  .pre-footer .menu-wrap .menu:nth-child(3),
  .pre-footer .menu-wrap .menu:nth-child(4) {
    flex-basis: 50%;
    max-width: 50%;
  }
  .pre-footer .menu-wrap .menu:nth-child(1) {
    order: 1;
  }
  .pre-footer .menu-wrap .menu:nth-child(2) {
    display: flex;
    flex-direction: column;
    justify-content: flex-end;
    order: 4;
  }
  .pre-footer .menu-wrap .menu:nth-child(3) {
    order: 3;
    padding-left: 0;
    border-left: none;
  }
  .pre-footer .menu-wrap .menu:nth-child(3)::before {
    display: block;
    width: 210px;
    padding-top: 20px;
    margin-top: 15px;
    content: "";
    border-top: 1px solid #5e7482;
  }
  .pre-footer .menu-wrap .menu:nth-child(4) {
    order: 2;
  }
  .pre-footer .menu-wrap .menu > li.shoutorihiki-link,
  .pre-footer .menu-wrap .menu > li.seminar-link {
    margin-bottom: 18px;
  }
  .pre-footer .down {
    padding: 30px 0 15px;
  }
  .pre-footer .down .wrap {
    max-width: 555px;
    margin: 0 auto 50px;
  }
  .pre-footer .down .wrap .left-column {
    width: 45%;
    margin-right: 10%;
  }
  .pre-footer .down .main-title {
    max-width: 555px;
  }
  .pre-footer .down .wrap .right-wrap-column {
    width: 45%;
  }
  .pre-footer .down .wrap .right-wrap-column .center-column {
    margin: 0 0 35px;
  }
  .pre-footer .down .wrap .right-wrap-column .center-column,
  .pre-footer .down .wrap .right-wrap-column .right-column {
    float: none;
    width: 100%;
  }
}
@media screen and (width <= 670px) {
  .pre-footer .up {
    padding: 20px 0;
  }
  .pre-footer .bookmarking {
    flex-wrap: wrap;
    padding-bottom: 15px;
    border-bottom: 1px solid #5e7482;
  }
  .pre-footer .bookmarking .fb-twitter {
    justify-content: center;
    width: 100%;
    margin-bottom: 5px;
  }
  .pre-footer .menu-wrap {
    flex-direction: column;
    padding: 0 20px;
    margin: 0 auto;
    border-top: none;
  }
  .pre-footer .menu-wrap .menu:nth-child(1),
  .pre-footer .menu-wrap .menu:nth-child(2),
  .pre-footer .menu-wrap .menu:nth-child(3),
  .pre-footer .menu-wrap .menu:nth-child(4) {
    flex-basis: auto;
    max-width: 100%;
    padding: 20px 0;
    border-top: 1px solid #5e7482;
    border-left: none;
  }
  .pre-footer .menu-wrap .menu:nth-child(1) {
    order: 2;
  }
  .pre-footer .menu-wrap .menu:nth-child(2) {
    order: 4;
  }
  .pre-footer .menu-wrap .menu:nth-child(3) {
    order: 3;
  }
  .pre-footer .menu-wrap .menu:nth-child(3)::before {
    content: none;
  }
  .pre-footer .menu-wrap .menu:nth-child(4) {
    order: 1;
    text-align: center;
    border-top: none;
  }
  .pre-footer .menu-wrap .menu > li.shoutorihiki-link,
  .pre-footer .menu-wrap .menu > li.seminar-link {
    margin-bottom: 17px;
  }
  .pre-footer .menu-wrap .partner {
    margin-top: 20px;
  }
  .pre-footer .menu-wrap .button {
    box-sizing: border-box;
    min-width: 280px;
  }
  .pre-footer .submenu-wrap {
    border: 0;
  }
  .pre-footer .submenu-wrap .submenu {
    display: block;
  }
  .pre-footer .submenu-wrap .submenu li:nth-child(1) {
    margin: 20px;
    border: 1px solid #5e7482;
  }
  .pre-footer .submenu-wrap .submenu li:nth-child(2) {
    margin: 20px;
    border: 1px solid #5e7482;
  }
  .pre-footer .submenu-wrap .submenu li:nth-child(1) a {
    padding-left: 25px;
  }
  .pre-footer .submenu-wrap .submenu li:nth-child(1) a::before {
    content: none;
  }
  .pre-footer .submenu-wrap .submenu a {
    font-size: 16px;
  }
  .pre-footer .down {
    padding: 20px 0 15px;
  }
  .pre-footer .down .main-title {
    margin: 0 auto 15px;
  }
  .pre-footer .down .main-title,
  .pre-footer .down .wrap {
    box-sizing: border-box;
    max-width: 100%;
    padding: 0 20px;
  }
  .pre-footer .down .wrap .left-column,
  .pre-footer .down .wrap .right-wrap-column {
    float: none;
    width: 100%;
  }
  .pre-footer .down .wrap .domain .name,
  .pre-footer .down .wrap .sub li {
    font-weight: normal;
  }
  .pre-footer .down .wrap .domain .name {
    font-size: 14px;
  }
  .pre-footer .down .copyright {
    padding: 0 20px;
    font-size: 11px;
    line-height: 1.2;
    text-align: center;
  }
  .pre-footer .down .copyright .under {
    display: block;
    margin-top: 3px;
    font-size: 10px;
  }
}

/* parts
------------------------------------------------------------- */
h1 {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 700;
}
h2,
h3 {
  font-family: "Noto Sans JP", sans-serif;
  font-weight: 500;
}
h2.title {
  font-size: 31px;
  line-height: 1.8;
  text-align: center;
}
.pre-wrap > section {
  padding: 80px 20px;
}
.h2title-sentence {
  margin: 20px 0 60px;
  font-size: 17px;
  line-height: 2;
  text-align: center;
}
.pre-wrap {
  padding-top: 60px;
}
.pre-page-title {
  padding: 52px 20px 47px;
  font-size: 30px;
  color: #ffffff;
  text-align: center;
  background: #14b4b4 url(/web/img/common/bg/title_bg_00.png) center/1280px
    120px no-repeat;
}

@media screen and (width <= 940px) {
  h2.title {
    font-size: 24px;
  }
  .pre-wrap > section {
    padding: 60px 20px;
  }
  .h2title-sentence {
    margin: 20px 0 40px;
    font-size: 15px;
    line-height: 2;
  }
}
@media screen and (width <= 670px) {
  h2.title {
    font-size: 18px;
  }
  .h2title-sentence {
    margin: 30px 0;
    font-size: 14px;
  }
  .h2title-sentence br {
    display: none;
  }
  .pre-wrap > section {
    padding: 50px 20px;
  }
  .pre-page-title {
    padding: 32px 20px 27px;
    font-size: 22px;
    background: #14b4b4 url(/web/img/common/bg/title_bg_sp_00.png)
      center/320px 80px no-repeat;
  }
}
.pre-account-registration-area {
  padding: 90px 20px 75px;
  color: #ffffff;
  text-align: center;
  background: #14b4b4
    url(/web/img/common/bg/pre_account_registration_area_bg_00.png)
    center/1330px no-repeat;
}
.pre-account-registration-area .mini-sentence {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 21px;
  font-weight: bold;
  font-weight: 500;
  text-shadow: 1px 1px 4px #037d7d;
}
.pre-account-registration-area h2.title {
  margin: 25px 0 45px;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 33px;
  font-weight: bold;
  font-weight: 500;
  line-height: 1;
  text-shadow: 1px 1px 4px #037d7d;
}
.pre-account-registration-area .mini-sentence .yellow {
  color: #ffdd00;
}

@media screen and (width <= 940px) {
  .pre-account-registration-area {
    padding: 85px 20px 80px;
  }
}
@media screen and (width <= 670px) {
  .pre-account-registration-area {
    padding: 60px 16px;
  }
  .pre-account-registration-area h2.title {
    margin: 5px 0 25px;
    font-size: 18px;
    line-height: 1.7;
  }
  .pre-account-registration-area .mini-sentence {
    font-size: 15px;
    line-height: 1.4;
  }
}
section.pre-next-contents-area {
  position: relative;
  padding: 70px 20px;
  overflow: hidden;
  text-align: center;
  background: #ffffff url(/web/img/common/bg/to_nextpage_bg_00.png) bottom
    82px center/1416px 80px repeat-x;
}
.pre-next-contents-area h2.title {
  position: relative;
  z-index: 1;
  font-size: 21px;
  font-weight: normal;
}
.pre-next-contents-area .next-link {
  position: relative;
  z-index: 1;
  display: inline-block;
  width: 260px;
  padding: 16px 0;
  margin-top: 30px;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 17px;
  font-weight: bold;
  font-weight: 400;
  text-decoration: none;
  background: #ffffff;
  border: 2px solid #3296d2;
  border-radius: 5px;
  transition: 0.5s;
}
.pre-next-contents-area .next-link:hover {
  color: #ffffff;
  background: #3296d2;
}
.pre-next-contents-area .next-link:hover::after {
  border-top: solid 2px #ffffff;
  border-right: solid 2px #ffffff;
}
.pre-next-contents-area .next-link::after {
  position: absolute;
  top: 50%;
  right: 20px;
  display: inline-block;
  width: 7px;
  height: 7px;
  margin-top: -2px;
  vertical-align: middle;
  content: "";
  border-top: solid 2px #3296d2;
  border-right: solid 2px #3296d2;
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
  transition: 0.5s;
}
.pre-next-contents-area figure[class^="human"] {
  position: absolute;
}
.pre-next-contents-area figure[class^="human"] > img {
  width: 50%;
  vertical-align: middle;
}
.pre-next-contents-area .human-wrap {
  position: absolute;
  top: 0;
  width: calc(100% - 40px);
  height: 100%;
}
.pre-next-contents-area .human-1 {
  bottom: 60px;
  left: calc(50% - 540px);
}
.pre-next-contents-area .human-2 {
  bottom: 41px;
  left: calc(50% - 340px);
}
.pre-next-contents-area .human-3 {
  right: calc(50% - 270px);
  bottom: 41px;
}
.pre-next-contents-area .human-4 {
  right: calc(50% - 540px);
  bottom: 60px;
}

@media screen and (width >= 670px) {
  .pre-next-contents-area .inview-o.no2 {
    transition-delay: 0.2s;
  }
  .pre-next-contents-area .inview-o.no3 {
    transition-delay: 0.4s;
  }
  .pre-next-contents-area .inview-o.no4 {
    transition-delay: 0.6s;
  }
}
@media screen and (width <= 940px) {
  section.pre-next-contents-area {
    padding: 54px 20px;
    background-position: bottom 60px center;
  }
  .pre-next-contents-area figure[class^="human"] > img {
    width: 40%;
  }
  .pre-next-contents-area h2.title {
    font-size: 19px;
  }
  .pre-next-contents-area .human-1 {
    bottom: 50px;
    left: calc(50% - 350px);
  }
  .pre-next-contents-area .human-2 {
    bottom: 31px;
    left: calc(50% - 250px);
  }
  .pre-next-contents-area .human-3 {
    right: calc(50% - 220px);
    bottom: 31px;
  }
  .pre-next-contents-area .human-4 {
    right: calc(50% - 370px);
    bottom: 50px;
  }
}
@media screen and (width <= 670px) {
  section.pre-next-contents-area {
    background: none;
  }
  .pre-next-contents-area::after {
    display: block;
    width: 280px;
    height: 38px;
    margin: 18px auto 0;
    content: "";
    background: url(/web/img/common/bg/to_nextpage_bg_sp_00.png)
      center/contain no-repeat;
  }
  .pre-next-contents-area .next-link::after {
    margin-top: -4px;
  }
  .pre-next-contents-area .human-1 {
    bottom: 30px;
    left: calc(50% - 170px);
  }
  .pre-next-contents-area .human-2 {
    bottom: 21px;
    left: calc(50% - 70px);
  }
  .pre-next-contents-area .human-3 {
    right: calc(50% - 62px);
    bottom: 21px;
  }
  .pre-next-contents-area .human-4 {
    right: calc(50% - 200px);
    bottom: 30px;
  }
  .pre-next-contents-area figure[class^="human"] > img {
    width: 30%;
  }
  .pre-next-contents-area h2.title {
    font-size: 17px;
  }
  .pre-next-contents-area .next-link {
    width: 235px;
    padding: 15px 0;
    font-size: 14px;
  }
}

/*** pre-pricelist ***/
.pre-pricelist {
  width: 100%;
  max-width: 1020px;
  margin: 40px auto 0;
  font-size: 15px;
}
.pre-pricelist .plana {
  color: #0aa8a8;
}
.pre-pricelist .with-bg {
  box-sizing: border-box;
  display: inline;
  padding: 3px 13px 1px;
  border-radius: 14px;
}
.pre-pricelist .plana .with-bg {
  background-color: #e5f5f5;
}
.pre-pricelist .planb {
  color: #3c9600;
}
.pre-pricelist .planb .with-bg {
  background-color: #ebf4e5;
}
.pre-pricelist .planc {
  color: #2869a0;
}
.pre-pricelist .planc .with-bg {
  background-color: #e9f0f5;
}
.pre-pricelist .listtable {
  width: 100%;
  font-weight: bold;
  line-height: 1.6;
  text-align: center;
}
.pre-pricelist .listtable th {
  font-weight: bold;
  vertical-align: middle;
  text-align: center;
}
.pre-pricelist .listtable td {
  background-color: #ffffff;
}
.pre-pricelist .listtable .title p {
  font-size: 13px;
  font-weight: normal;
}
.pre-pricelist .listtable .box1 th,
.pre-pricelist .listtable .box2 th {
  color: #ffffff;
  background-color: #666666;
}
.pre-pricelist .listtable .box1 th {
  border-radius: 10px 0 0;
}
.pre-pricelist .listtable .box1 td {
  position: relative;
  width: 26%;
  padding: 25px 0 10px;
  color: #ffffff;
}
.pre-pricelist .listtable .box1 td::before {
  position: absolute;
  bottom: -6px;
  left: 46%;
  z-index: 10;
  display: inline-block;
  width: 7%;
  height: 16%;
  content: "";
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.pre-pricelist .listtable .box1 .plana,
.pre-pricelist .listtable .box1 .plana::before {
  background-color: #0aa8a8;
}
.pre-pricelist .listtable .box1 .planb,
.pre-pricelist .listtable .box1 .planb::before {
  background-color: #3c9600;
}
.pre-pricelist .listtable .box1 .planc,
.pre-pricelist .listtable .box1 .planc::before {
  background-color: #2869a0;
}
.pre-pricelist .listtable .box1 .name {
  padding: 3px 1.5em 1px;
  border-radius: 20px;
}
.pre-pricelist .listtable .box1 .plana .name {
  background-color: #13888e;
}
.pre-pricelist .listtable .box1 .planb .name {
  background-color: #2a6800;
}
.pre-pricelist .listtable .box1 .planc .name {
  background-color: #002f57;
}
.pre-pricelist .listtable .box1 .price {
  margin: 10px 0 0;
  font-size: 30px;
}
.pre-pricelist .listtable .box1 .price span {
  font-size: 15px;
}
.pre-pricelist .listtable .box2 th {
  padding: 20px 0;
}
.pre-pricelist .listtable .box2 td {
  padding: 16px 0 12px;
  font-size: 16px;
  vertical-align: middle;
  border-right: 1px solid #cccccc;
  border-bottom: 1px solid #cccccc;
}
.pre-pricelist .listtable .box2 td .price {
  font-size: 30px;
}
.pre-pricelist .listtable .op {
  position: absolute;
  font-size: 11px;
}
.pre-pricelist .listtable .box2 .title {
  border-top: 1px solid #cccccc;
}
.pre-pricelist .listtable .box2 .title span {
  display: block;
}
.pre-pricelist .listtable .box3 th {
  padding: 10px;
  color: #666666;
  background-color: #e5e5e5;
  border-top: 1px solid #cccccc;
  border-left: 1px solid #cccccc;
}
.pre-pricelist .listtable .box3 td {
  line-height: 1.2;
  vertical-align: middle;
  background-color: #f6f6f6;
  border-top: 1px solid #cccccc;
  border-right: 1px solid #cccccc;
}
.pre-pricelist .listtable .last td {
  border-bottom: 1px solid #cccccc;
}
.pre-pricelist .listtable tr:last-child > * {
  border-bottom: 1px solid #cccccc;
}
.pre-pricelist .etc {
  margin: 10px 0;
  font-size: 11px;
}
.pre-pricelist .etc p.left {
  margin-right: auto;
}
.pre-pricelist .listtable td.star {
  font-size: 25px;
  line-height: 1;
  color: #eb9e00;
}

/*** 2021/12/2 無料期間リボン ***/
.uriho-minimum-charge .yellow-ribbon {
  position: relative;
  box-sizing: border-box;
  width: 370px;
  height: 60px;
  padding: 4px 0;
  margin: 30px auto 0;
  font-size: 22px;
  line-height: 60px;
  color: #3c3c3c;
  text-align: center;
  background: #ffe041;
}
.uriho-minimum-charge .yellow-ribbon h3 {
  padding: 0 30px;
  margin: 0;
  font-weight: bold;
  line-height: 48px;
  vertical-align: middle;
  border-top: solid 2px #f9b700;
  border-bottom: solid 2px #f9b700;
}
.uriho-minimum-charge .yellow-ribbon .ribbon-st {
  font-size: 18px;
  vertical-align: bottom;
}
.uriho-minimum-charge .yellow-ribbon::before,
.uriho-minimum-charge .yellow-ribbon::after {
  position: absolute;
  z-index: 1;
  width: 0;
  height: 0;
  content: "";
}
.uriho-minimum-charge .yellow-ribbon::before {
  top: 0;
  left: 0;
  border-color: transparent transparent transparent #ffffff;
  border-style: solid;
  border-width: 30px 0 30px 15px;
}
.uriho-minimum-charge .yellow-ribbon::after {
  top: 0;
  right: 0;
  border-color: transparent #ffffff transparent transparent;
  border-style: solid;
  border-width: 30px 15px 30px 0;
}

/* tab/m */
@media screen and (width <= 940px) {
  .pre-pricelist .listtable .op {
    position: static;
  }
}

/* SP */
@media screen and (width <= 670px) {
  .pre-pricelist {
    font-size: 12px;
  }
  .pre-pricelist .listtable th {
    font-size: 12px;
    font-weight: normal;
  }
  .pre-pricelist .listtable .title p {
    margin: 0.5em 0 0;
    font-size: 11px;
  }
  .pre-pricelist .listtable .box1 td {
    width: 28%;
  }
  .pre-pricelist .listtable .box1 .name {
    padding: 0;
    border-radius: 0;
  }
  .pre-pricelist .listtable .box1 .price {
    font-size: 15px;
  }
  .pre-pricelist .listtable .box1 .price span {
    font-size: 11px;
  }
  .pre-pricelist .listtable .box2 td {
    padding: 0 0.3em;
    font-size: 12px;
  }
  .pre-pricelist .listtable .box1 td::before {
    display: none;
  }
  .pre-pricelist .listtable .box2 td .price {
    font-size: 16px;
  }
  .pre-pricelist .listtable .box2.sp-p10 th {
    padding: 10px 0;
  }
  .pre-pricelist .listtable .box3 th {
    padding: 20px 0;
  }
  .pre-pricelist .etc {
    text-align: left;
  }
  .pre-pricelist .pre-pricelist .etc {
    font-size: 12px;
  }
  .pre-pricelist .with-bg {
    padding: 0;
    font-size: 11px;
    border-radius: 0;
  }
  .pre-pricelist .listtable td.star {
    font-size: 18px;
  }
  .pre-pricelist .sp-font10 {
    font-size: 10px;
  }
  .pre-pricelist .listtable .op {
    position: static;
  }
  .pre-pricelist .pt-only {
    display: none;
  }
  .pre-pricelist .etc {
    display: inline-block;
  }

  /*** 2021/12/2 無料期間リボン ***/
  .uriho-minimum-charge .yellow-ribbon {
    width: 70%;
    height: 50px;
    margin: 20px auto -10px;
    font-size: 16px;
  }
  .uriho-minimum-charge .yellow-ribbon h3 {
    font-size: 14px;
    line-height: 38px;
  }
  .uriho-minimum-charge .yellow-ribbon .ribbon-st {
    font-size: 12px;
  }
}

/*** /pre-pricelist ***/

/* price
------------------------------------------------------------- */
.uriho-minimum-charge {
  padding: 90px 10px 65px;
}
.uriho-minimum-charge .padding-wrap {
  padding: 0 10px;
}
.uriho-minimum-charge .pre-price-list {
  margin-top: 30px;
}
.uriho-minimum-charge .subscription-ribbon {
  position: relative;
  max-width: 580px;
  padding: 11px 0 8px;
  margin: 40px auto 0;
  text-align: center;
  background: #f16c68;
}
.uriho-minimum-charge .subscription-ribbon::after {
  position: absolute;
  top: 0;
  right: 0;
  width: calc(100% - 30px);
  height: 0;
  content: "";
  border-color: transparent #ffffff;
  border-style: solid;
  border-width: 20px 15px;
}
.subscription-ribbon .ribbon-font {
  padding-left: 15px;
  font-size: 18px;
  color: #ffffff;
}
.uriho-minimum-charge .price-limit {
  box-sizing: border-box;
  display: flex;
  align-items: center;
  justify-content: space-around;
  max-width: 1000px;
  padding: 35px 45px;
  margin: 50px auto 0;
  background: #f2f9fa;
  border: 1px solid #dddddd;
  border-radius: 5px;
}
.uriho-minimum-charge .price-limit .plan-title {
  max-width: 140px;
  padding: 4px 6px 2px 0;
  margin: 0 0 15px;
  font-size: 14px;
  font-weight: bold;
  color: #ffffff;
  text-align: center;
  background-color: #0aa8a8;
}
.uriho-minimum-charge .price-limit .plan-title span {
  font-size: 18px;
}
.uriho-minimum-charge .price-limit .sentence-title {
  margin: 10px 0 25px;
  font-size: 25px;
}
.uriho-minimum-charge .price-limit .sentence {
  padding-left: 30px;
  font-size: 16px;
  line-height: 2;
  background: url(/web/img/pre/price/check_00.png) top 5px left/21px 20px
    no-repeat;
}
.uriho-minimum-charge .price-limit > .right {
  width: 50%;
}
.uriho-minimum-charge .price-limit .price-limit-img {
  min-width: 435px;
  height: 240px;
  background-image: url(/web/img/pre/price/price_limit_02.png);
  background-repeat: no-repeat;
  background-size: contain;
  -webkit-backface-visibility: hidden;
}
.uriho-minimum-charge .two-box-contents {
  box-sizing: border-box;
  max-width: 1000px;
  padding: 35px 40px;
  margin: 35px auto 0;
  background: #f6f6f6;
  border: 1px solid #dddddd;
  border-radius: 5px;
}
.uriho-minimum-charge .two-box-contents .sentence {
  line-height: 1.6;
}
.uriho-minimum-charge .two-box-contents .box1 {
  box-sizing: border-box;
}
.uriho-minimum-charge .two-box-contents .box1 .sentence br {
  display: none;
}
.uriho-minimum-charge .two-box-contents .box1 .box-contents-right {
  padding-left: 20px;
}
.uriho-minimum-charge .two-box-contents .box1 .box-contents-right img {
  width: 410px;
}
.uriho-minimum-charge .two-box-contents .box2,
.uriho-minimum-charge .two-box-contents .box3 {
  box-sizing: border-box;
  padding-top: 25px;
  margin-top: 25px;
  border-top: 1px solid #dddddd;
}
.uriho-minimum-charge .two-box-contents .title {
  display: inline-block;
  padding-bottom: 10px;
  font-size: 20px;
  line-height: 1.5;
  vertical-align: top;
}
.uriho-minimum-charge .two-box-contents .title .br {
  display: inline-block;
}
.uriho-minimum-charge .two-box-contents .point-ribbon {
  position: relative;
  box-sizing: border-box;
  display: inline-block;
  width: 90px;
  height: 34px;
  padding: 3px 0;
  margin: 0 5px 15px 0;
  background: #ffe041;
}
.uriho-minimum-charge .two-box-contents .point-ribbon p {
  padding: 2px 0 0 10px;
  font-size: 14px;
  font-weight: bold;
  vertical-align: middle;
  color: #3c3c3c;
  border-top: solid 2px #f9b700;
  border-bottom: solid 2px #f9b700;
}
.uriho-minimum-charge .two-box-contents .point-ribbon::after {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1;
  width: 0;
  height: 0;
  content: "";
  border-color: transparent #f6f6f6 transparent transparent;
  border-style: solid;
  border-width: 17px 10px 17px 0;
}
.uriho-minimum-charge .two-box-contents .in-wrap {
  display: flex;
}
.uriho-minimum-charge .two-box-contents .in-wrap .left {
  display: flex;
  align-items: center;
  margin-right: 30px;
  text-align: center;
}
.uriho-minimum-charge .two-box-contents .in-wrap .img-1 {
  width: 81px;
}
.uriho-minimum-charge .two-box-contents .in-wrap .img-2 {
  width: 81px;
}
#price .reasonable-and-h-quality {
  background: url(/web/img/pre/price/reasonable_and_h_quality_bg_00.jpg)
    center/cover no-repeat;
}
#price .reasonable-and-h-quality .title {
  font-size: 28px;
}
#price .reasonable-and-h-quality .white-wrap {
  padding: 60px 60px 40px;
}
#price .reasonable-and-h-quality .graph {
  position: relative;
  width: 100%;
  max-width: 700px;
  margin: 45px auto 0;
}
#price .reasonable-and-h-quality .graph picture img {
  width: 100%;
}
#price .reasonable-and-h-quality .graph .supply {
  position: absolute;
  top: 10px;
  left: 5px;
  padding: 5px 10px 3px;
  font-size: 16px;
  font-weight: bold;
  color: #ffffff;
  background-color: #14b3b3;
}
#price .price-movie-wrap {
  padding: 80px 20px 20px;
}
#price .price-movie-wrap .price-movie-box {
  display: flex;
  align-items: center;
  justify-content: center;
  max-width: 1000px;
  padding: 20px 0;
  margin: 0 auto;
  background: #f6f6f6;
  border-radius: 5px;
}
#price .price-movie-wrap .price-movie-box .right {
  margin-right: 20px;
}
#price .price-movie-wrap .price-movie-box .right .price-movie-ttl {
  padding-left: 45px;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 20px;
  font-weight: bold;
  line-height: 2;
  color: #0aa8a8;
  background: url(/web/img/pre/price/icon_movie.png) top 6px left/30px 30px
    no-repeat;
}
#price .price-movie-wrap .price-movie-box .right .price-movie-txt {
  margin-top: 5px;
  font-size: 16px;
  line-height: 1.7;
}
#price .price-movie-wrap .price-movie-box .left a {
  transition: opacity 0.3s;
}
#price .price-movie-wrap .price-movie-box .left a:hover {
  opacity: 0.7;
}
#price .price-movie-wrap .price-movie-box .left img {
  max-width: 240px;
}

@media screen and (width <= 940px) and (width >= 670px) {
  .uriho-minimum-charge .pre-price-list {
    margin-top: 20px;
  }
  .uriho-minimum-charge .subscription-ribbon {
    margin: 30px auto 0;
  }
  #price .price-movie-wrap {
    padding: 50px 50px 10px;
  }
}
@media screen and (width <= 940px) {
  .uriho-minimum-charge {
    padding: 60px 10px;
  }
  .uriho-minimum-charge .price-limit {
    position: relative;
    justify-content: flex-end;
    padding: 35px 30px;
    margin: 35px auto 0;
  }
  .uriho-minimum-charge .price-limit .left {
    margin-right: 20px;
  }
  .uriho-minimum-charge .subscription-ribbon {
    max-width: 450px;
  }
  .uriho-minimum-charge .price-limit .sentence-title {
    font-size: 20px;
  }
  .uriho-minimum-charge .price-limit .price-limit-img {
    min-width: 285px;
    height: 170px;
    margin-left: 10px;
  }
  .uriho-minimum-charge .two-box-contents {
    margin: 30px auto 0;
    text-align: center;
  }
  .uriho-minimum-charge .two-box-contents .title {
    vertical-align: initial;
  }
  .uriho-minimum-charge .two-box-contents .point-ribbon p {
    padding: 2px 0 0 13px;
    text-align: initial;
  }
  .uriho-minimum-charge .two-box-contents .in-wrap {
    flex-direction: column;
  }
  .uriho-minimum-charge .two-box-contents .in-wrap .left {
    justify-content: center;
    margin: 0 0 20px;
  }
  .uriho-minimum-charge .two-box-contents .title {
    padding-left: 5px;
    font-size: 17px;
    text-align: center;
  }
  .uriho-minimum-charge .two-box-contents .title .br {
    display: block;
  }
  .uriho-minimum-charge .two-box-contents .in-wrap .left > img {
    padding-left: 11px;
  }
  .uriho-minimum-charge .two-box-contents .point-ribbon {
    margin: 0 auto 10px;
  }
  .uriho-minimum-charge .two-box-contents .box1 .sentence br {
    display: inline;
  }
  .uriho-minimum-charge .two-box-contents .box1 .box-contents-right img {
    width: 100%;
    max-width: 500px;
    text-align: center;
  }
  #price .reasonable-and-h-quality .title {
    font-size: 20px;
  }
  #price .reasonable-and-h-quality .graph {
    margin-top: 95px;
  }
  #price .reasonable-and-h-quality .graph .supply {
    top: -60px;
    right: 0;
    left: 0;
    display: inline-block;
    width: 140px;
    margin: 0 auto;
    font-size: 12px;
  }
  #price .price-movie-wrap .price-movie-box {
    padding: 20px 40px;
  }
}
@media screen and (width <= 670px) {
  .uriho-minimum-charge {
    padding: 50px 6px;
  }
  .uriho-minimum-charge .pre-price-list {
    margin-top: 20px;
  }
  .uriho-minimum-charge .subscription-ribbon {
    width: 75%;
    min-width: 285px;
    padding: 7px 0;
    margin: 30px auto 0;
  }
  .uriho-minimum-charge .subscription-ribbon::after {
    width: calc(100% - 20px);
    border-width: 18px 10px;
  }
  .subscription-ribbon .ribbon-font {
    padding-left: 5px;
    font-size: 13px;
  }
  .uriho-minimum-charge .padding-wrap {
    padding: 0 4px;
  }
  .uriho-minimum-charge .price-limit {
    display: block;
    padding: 30px 20px;
    margin: 30px auto 0;
    text-align: center;
  }
  .uriho-minimum-charge .price-limit > .right {
    display: flex;
    justify-content: center;
    width: 100%;
    margin: 0 auto;
  }
  .uriho-minimum-charge .price-limit > .left {
    margin-bottom: 30px;
  }
  .uriho-minimum-charge .price-limit .left {
    margin-right: initial;
  }
  .uriho-minimum-charge .price-limit .plan-title {
    max-width: 130px;
    padding: 3px 6px 0 0;
    margin: 0 auto 20px;
    font-size: 13px;
  }
  .uriho-minimum-charge .price-limit .sentence-title {
    margin: 10px 0 15px;
    font-size: 17px;
  }
  .uriho-minimum-charge .price-limit .sentence {
    max-width: 200px;
    margin: 0 auto;
    font-size: 14px;
  }
  .uriho-minimum-charge .price-limit .sentence {
    padding-left: 25px;
    background: url(/web/img/pre/price/check_00.png) top 4px left/19px 18px
      no-repeat;
  }
  .uriho-minimum-charge .price-limit .price-limit-img {
    min-width: 240px;
    height: 170px;
    background-image: url(/web/img/pre/price/price_limit_sp_02.png);
    -webkit-backface-visibility: hidden;
  }
  .uriho-minimum-charge .two-box-contents {
    flex-direction: column;
    padding: 30px;
    margin: 25px auto 0;
  }
  .uriho-minimum-charge .two-box-contents .box1 {
    border-right: none;
  }
  .uriho-minimum-charge .two-box-contents .box1 .box-contents-right {
    max-width: initial;
    padding: 10px 0 0;
    padding: 0;
    margin: 0 auto;
  }
  .uriho-minimum-charge .two-box-contents .box1 .sentence br {
    display: none;
  }
  .uriho-minimum-charge .sp-none {
    display: none;
  }
  .uriho-minimum-charge .pc-block {
    display: block;
  }
  #price .reasonable-and-h-quality {
    background: url(/web/img/pre/price/reasonable_and_h_quality_bg_sp_00.jpg)
      center/cover no-repeat;
    background-position: center right -70px;
  }
  #price .reasonable-and-h-quality .title {
    font-size: 17px;
  }
  #price .reasonable-and-h-quality .white-wrap {
    padding: 40px 40px 30px;
  }
  #price .price-movie-wrap .price-movie-box {
    display: block;
    padding: 20px;
    text-align: center;
  }
  #price .price-movie-wrap {
    padding: 50px 20px 0;
  }
  #price .price-movie-wrap .price-movie-box .right {
    margin-right: 0;
  }
  #price .price-movie-wrap .price-movie-box .right .price-movie-ttl {
    display: inline-block;
    padding-left: 38px;
    margin-bottom: 4px;
    font-size: 18px;
  }
  #price .price-movie-wrap .price-movie-box .right .price-movie-txt {
    margin: 5px 0 20px;
    font-size: 15px;
  }
}
#price section.center-white-content {
  padding: 70px 20px;
}
#price .center-white-content .white-wrap {
  box-sizing: border-box;
  max-width: 1000px;
  padding: 40px;
  margin: 0 auto;
  text-align: center;
  background: #ffffff;
  border-radius: 5px;
  box-shadow: 2px 13px 63px -39px #666666;
}
#price .center-white-content .sentence {
  margin-top: 25px;
  font-size: 15px;
  line-height: 2;
}

@media screen and (width <= 960px) {
  #price section.center-white-content {
    padding: 50px;
  }
  #price .center-white-content .white-wrap {
    padding: 70px 60px;
  }
  #price .center-white-content .sentence {
    margin-top: 20px;
    font-size: 14px;
    line-height: 1.8;
  }
}
@media screen and (width <= 670px) {
  #price section.center-white-content {
    padding: 50px 20px;
  }
  #price .center-white-content .white-wrap {
    padding: 45px 30px 40px;
  }
  #price .center-white-content .sentence {
    margin-top: 30px;
  }
}

/* タクシー広告02:ad-taxi02（20220131）
----------------------------------------------------------------------------------------------- */
/*** CTA ***/
.ad-taxi02-cta {
  color: #ffffff;
  background: #14b4b4
    url(/web/img/common/bg/pre_account_registration_area_bg_00.png)
    center/1330px no-repeat;
}
.ad-taxi02-cta-wrap {
  display: flex;
  align-items: flex-end;
  justify-content: space-around;
  max-width: 800px;
  padding: 20px 15px 0;
  margin: 0 auto;
}
.ad-taxi02-cta .text {
  padding: 0 5% 40px 3%;
  text-align: left;
}
.ad-taxi02-cta .mini-sentence {
  font-family: "Noto Sans JP", sans-serif;
  font-size: 21px;
  font-weight: bold;
  font-weight: 500;
  text-shadow: 1px 1px 4px #037d7d;
}
.ad-taxi02-cta .mini-sentence .yellow {
  color: #ffdd00;
}
.ad-taxi02-cta .title {
  margin: 20px 0 30px;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 36px;
  font-weight: bold;
  font-weight: 500;
  line-height: 1.3;
  text-align: left;
  text-shadow: 1px 1px 4px #037d7d;
}
.ad-taxi02-cta .title span {
  display: block;
}
.ad-taxi02-cta figure {
  line-height: 0;
}
.ad-taxi02-cta img {
  width: 100%;
  max-width: 340px;
}

@media screen and (width <= 940px) {
  .ad-taxi02-cta .text {
    padding: 30px 15px 30px 5%;
  }
  .ad-taxi02-cta img {
    max-width: 300px;
  }
}
@media screen and (width <= 670px) {
  .ad-taxi02-cta-wrap {
    display: block;
  }
  .ad-taxi02-cta .text {
    padding: 30px 0 15px;
    text-align: center;
  }
  .ad-taxi02-cta .title {
    margin: 5px 0 20px;
    font-size: 18px;
    line-height: 1.7;
    text-align: center;
  }
  .ad-taxi02-cta .title span {
    display: inline;
  }
  .ad-taxi02-cta .mini-sentence {
    font-size: 15px;
    line-height: 1.4;
  }
  .ad-taxi02-cta img {
    display: block;
    max-width: 150px;
    margin: 0 auto;
    text-align: center;
  }
}

/* スマホ向けフォームへの固定ボタン
------------------------------------------------------------- */
@media screen and (width >= 941px) {
  .sp-fixed-to-form {
    display: none !important;
  }
}
@media screen and (width <= 940px) {
  .sp-fixed-to-form {
    position: fixed;
    bottom: 0;
    z-index: 19;
    display: none;
    width: 100%;
    padding: 15px 0;
    margin: 0;
    text-align: center;
  }
  .sp-fixed-to-form::before {
    position: absolute;
    top: 0;
    right: 0;
    z-index: 1;
    width: 100%;
    height: 100%;
    content: "";
    background: #3e4847;
    opacity: 0.9;
  }
  .sp-fixed-to-form .account-registration {
    z-index: 2;
    margin: 0;
  }
}

/* 資料請求バナー
------------------------------------------------------------- */
.banner-contents-wrap {
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 20px 0 0;
  background-image: url(/web/img/pre/subject/img_10.png);
  background-size: cover;
}
.banner-contents-wrap img {
  width: 100%;
  max-width: 300px;
  margin-right: 50px;
}
.banner-contents-wrap .in-banner .title {
  margin: 0 0 20px !important;
  font-family: "Noto Sans JP", sans-serif;
  font-size: 20px !important;
  font-weight: 500;
  line-height: 1.3;
  color: #ffffff;
  text-shadow: 1px 1px 4px #037d7d;
}

/*** ページ別のバナー調整 ***/
#price .banner-contents-wrap {
  max-width: 1000px;
  margin: 60px auto 0;
}
#feature .banner-contents-wrap {
  max-width: 1050px;
  margin: 60px auto 0;
}
#price .banner-contents-wrap img,
#feature .banner-contents-wrap img {
  margin-bottom: -7px;
}

@media screen and (width <= 670px) {
  /*** バナー ***/
  .banner-contents-wrap {
    display: none;
  }
}

/* PC時ログイン画面分割レイアウト
------------------------------------------------------------- */
#pre-form-wrap .login-sub {
  display: none;
}

@media screen and (width >= 1080px) {
  #sign_in_form {
    height: 100%;
  }
  #pre-form-wrap.login-form {
    height: 100%;
    min-height: 1020px;
    padding-bottom: 60px;
  }
  #pre-form-wrap .login-split {
    display: flex;
    height: 100%;
  }
  #pre-form-wrap .login-split .container {
    padding: 130px 40px 60px;
  }
  #pre-form-wrap .login-sub {
    position: relative;
    display: block;
    text-align: center;
    background-color: #ffffff;
  }
  #pre-form-wrap .login-sub.login-plan-up {
    background-color: #efe5d2;
  }
  #pre-form-wrap .login-sub.login-support {
    background: linear-gradient(to bottom, #2fb5b5, #0aa8a8);
  }
  #pre-form-wrap .login-sub .login-sub-title {
    font-size: 30px;
    font-weight: 700;
    color: #0aa8a8;
  }
  #pre-form-wrap .login-sub.login-plan-up .login-sub-title {
    color: #3c3c3c;
  }
  #pre-form-wrap .login-sub.login-support .login-sub-title {
    font-size: 24px;
    line-height: 1.4;
    color: #ffffff;
  }
  #pre-form-wrap .login-sub.login-support .login-sub-title span {
    font-size: 15px;
    line-height: 0;
  }
  #pre-form-wrap .login-sub p {
    position: relative;
    z-index: 1;
    margin: 30px 0;
    font-size: 15px;
    line-height: 2;
  }
  #pre-form-wrap .login-sub.login-support p {
    margin-top: 25px;
    font-size: 13px;
    line-height: 1.5;
    color: #ffffff;
  }
  #pre-form-wrap .login-sub p span {
    font-weight: bold;
    color: #0aa8a8;
  }
  #pre-form-wrap .login-sub .img img {
    position: relative;
    z-index: 1;
    width: 100%;
    max-width: 650px;
    margin: 0 auto;
  }
  #pre-form-wrap .login-sub.login-plan-up .recommend-box-contents {
    position: relative;
    max-width: 500px;
    margin: 60px auto 0;
    background: #ffffff;
    border-radius: 5px;
  }
  #pre-form-wrap .login-sub.login-plan-up .recommend-box-contents .ttl-img img {
    position: absolute;
    top: -25px;
    left: 25%;
    width: 50%;
  }
  #pre-form-wrap
    .login-sub.login-plan-up
    .recommend-box-contents
    .recommend-list {
    position: relative;
    padding: 45px 0 22px;
  }
  #pre-form-wrap
    .login-sub.login-plan-up
    .recommend-box-contents
    .recommend-list
    img {
    position: absolute;
    bottom: 0;
    width: 92px;
    margin-left: 3px;
  }
  #pre-form-wrap .login-sub.login-plan-up .recommend-box-contents ul {
    display: inline-block;
    margin-left: 130px;
    font-size: 15px;
    text-align: left;
  }
  #pre-form-wrap .login-sub.login-plan-up .recommend-box-contents ul li {
    position: relative;
    margin-bottom: 8px;
  }
  #pre-form-wrap
    .login-sub.login-plan-up
    .recommend-box-contents
    ul
    li::before {
    position: absolute;
    top: 0.2em;
    left: -1.8em;
    display: block;
    width: 16px;
    height: 7px;
    content: "";
    border-bottom: 2px solid #0aa8a8;
    border-left: 2px solid #0aa8a8;
    -webkit-transform: rotate(-45deg);
    transform: rotate(-45deg);
  }
  #pre-form-wrap .login-sub.login-support .support-box-contents {
    max-width: 500px;
    padding: 20px;
    margin: 0 auto 20px;
    background: #ffffff;
  }
  #pre-form-wrap .login-sub.login-support .support-box-contents h3 {
    font-size: 15px;
    font-weight: bold;
    color: #0aa8a8;
  }
  #pre-form-wrap .login-sub.login-support .support-box-contents p {
    margin-top: 0;
    margin-bottom: 0;
    color: #3c3c3c;
  }
  #pre-form-wrap
    .login-sub.login-support
    .support-box-contents
    .support-number {
    position: relative;
    margin-left: 25px;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 28px;
    font-weight: bold;
  }
  #pre-form-wrap
    .login-sub.login-support
    .support-box-contents
    .support-number::before {
    position: absolute;
    top: 12px;
    width: 20px;
    height: 22px;
    margin-left: -20px;
    content: "";
    background: url(/web/img/pre/signin/login_sup_tell.png);
    background-repeat: no-repeat;
    background-size: contain;
  }
  #pre-form-wrap
    .login-sub.login-support
    .support-box-contents
    .support-detail {
    display: flex;
    justify-content: center;
    margin-top: 5px;
  }
  #pre-form-wrap
    .login-sub.login-support
    .support-box-contents
    .support-detail
    li {
    margin: 0 16px;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: bold;
    color: #0aa8a8;
  }
  #pre-form-wrap
    .login-sub.login-support
    .support-box-contents
    .support-detail
    li::before {
    display: block;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 13px;
    font-weight: bold;
    content: "✓";
  }
  #pre-form-wrap .login-sub.login-support .support-box-contents .support-plan {
    display: flex;
    justify-content: center;
    margin-top: 15px;
  }
  #pre-form-wrap
    .login-sub.login-support
    .support-box-contents
    .support-plan
    li {
    padding: 8px 16px;
    font-family: "Noto Sans JP", sans-serif;
    font-weight: bold;
    color: #ffffff;
    background-color: #0aa8a8;
    border-radius: 2px;
  }
  #pre-form-wrap
    .login-sub.login-support
    .support-box-contents
    .support-plan
    li:first-child {
    margin-right: 10px;
  }
  #pre-form-wrap
    .login-sub.login-support
    .support-box-contents
    .support-plan
    li
    span {
    font-size: 10px;
  }
  #pre-form-wrap .login-sub .login-sub-inquiry {
    position: relative;
    z-index: 1;
    box-sizing: border-box;
    max-width: 500px;
    padding: 40px;
    margin: 20px auto 0;
    background-color: #f2e5d0;
    border-radius: 5px;
  }
  #pre-form-wrap .login-sub .login-sub-inquiry p {
    margin: 0 0 20px;
  }
  #pre-form-wrap .login-sub.login-plan-up .login-sub-inquiry {
    padding: 0;
    margin-top: 40px;
    background-color: unset;
  }
  #pre-form-wrap .login-sub .login-sub-inquiry .co-nbtn-ss span {
    position: relative;
    top: -1.5px;
    margin-right: 4px;
  }
  #pre-form-wrap .login-sub .login-sub-bgimg {
    position: absolute;
    right: 0;
    bottom: 0;
    width: 90%;
    max-width: 900px;
  }
  #pre-form-wrap .login-sub .login-sub-bgimg2 {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 100%;
  }
  #pre-form-wrap .login-sub .login-sub-bgimg3 {
    width: 160px;
    height: 125px;
    margin-top: 25px;
  }
  #pre-form-wrap .login-sub .login-sub-bgimg4 {
    position: absolute;
    bottom: 0;
    left: 0;
    width: 85%;
    min-width: 700px;
  }
  #pre-form-wrap .login-sub.login-blog {
    background-color: #0aa8a8;
  }
  #pre-form-wrap .login-sub.login-blog .blog-keyword {
    display: flex;
    justify-content: center;
    margin-top: 25px;
  }
  #pre-form-wrap .login-sub.login-blog .blog-keyword div {
    position: relative;
    z-index: 2;
    padding: 11px 25px 14px;
    font-family: "Noto Sans JP", sans-serif;
    font-size: 26px;
    font-weight: bold;
    background-color: #ffffff;
    border-radius: 3px;
  }
  #pre-form-wrap .login-sub.login-blog .blog-keyword div:nth-child(-n + 2) {
    margin-right: 15px;
  }
  #pre-form-wrap .login-sub.login-blog .blog-keyword div::after {
    position: absolute;
    z-index: -1;
    width: 90%;
    height: 26px;
    content: "";
    background: url(/web/img/pre/signin/under-line.png);
    background-repeat: no-repeat;
    background-size: contain;
  }
  #pre-form-wrap .login-sub.login-blog .blog-keyword div:nth-child(1)::after {
    bottom: -6px;
    left: 10px;
  }
  #pre-form-wrap .login-sub.login-blog .blog-keyword div:nth-child(2)::after {
    bottom: -10px;
    left: 7px;
  }
  #pre-form-wrap .login-sub.login-blog .blog-keyword div:nth-child(3)::after {
    bottom: -6px;
    left: 20px;
    width: 164px;
  }
  #pre-form-wrap .login-sub.login-blog p {
    color: #ffffff;
  }
  #pre-form-wrap .login-sub.login-blog p span {
    color: #ffffff;
  }
  #pre-form-wrap .login-sub.login-blog .blog-pcimg {
    position: relative;
    z-index: 1;
    display: block;
    width: 500px;
    margin: 0 auto 40px;
  }
  #pre-form-wrap .login-sub.login-blog .co-btn-dblue {
    z-index: 1;
  }
  #pre-form-wrap .login-sub.login-blog .blog-bgimg {
    position: absolute;
    top: 200px;
    left: -200px;
  }
}

/* フローティングバナー
------------------------------------------------------------- */
.pre-floating-banner {
  position: fixed;
  right: 25px;
  bottom: 25px;
  z-index: 99;
  display: none;
}
.pre-floating-banner .floating-banner-a {
  position: relative;
  display: block;
  max-width: 250px;
  height: 250px;
  padding: 0;
  overflow: visible;
  line-height: 0;
  border-radius: 6px;
}
.pre-floating-banner .floating-banner-a img {
  width: 100%;
  height: auto;
  filter: drop-shadow(0 0 4px #d5e5da);
  transition: opacity 0.3s;
}
.pre-floating-banner .floating-banner-a:hover img {
  opacity: 0.7;
}

/* 閉じるボタン */
.pre-floating-banner #pre-floating-banner-close {
  position: absolute;
  top: 0;
  right: 0;
  z-index: 1000;
  display: flex;
  align-items: center;
  justify-content: center;
  cursor: pointer;
}
.pre-floating-banner #pre-floating-banner-close span {
  position: relative;
  width: 30px;
  height: 30px;
  background: #666666;
  border-radius: 100%;
}
.pre-floating-banner #pre-floating-banner-close span::after,
.pre-floating-banner #pre-floating-banner-close span::before {
  position: absolute;
  top: 50%;
  right: 0;
  left: 0;
  display: block;
  width: 11px;
  margin: auto;
  text-align: center;
  content: "";
  border-top: 2px solid #ffffff;
}
.pre-floating-banner #pre-floating-banner-close span::after {
  transform: skewY(45deg);
}
.pre-floating-banner #pre-floating-banner-close span::before {
  transform: skewY(-45deg);
}

/* tab/m */
@media screen and (width <= 940px) {
  .pre-floating-banner {
    display: none !important;
  }
}
/*!
 * jQuery UI CSS Framework 1.13.0
 * http://jqueryui.com
 *
 * Copyright jQuery Foundation and other contributors
 * Released under the MIT license.
 * http://jquery.org/license
 *
 * http://api.jqueryui.com/category/theming/
 *
 * To view and modify this theme, visit http://jqueryui.com/themeroller/
 */

/*






 */



/* Component containers
----------------------------------*/
.ui-widget {
	font-family: Arial,Helvetica,sans-serif/*{ffDefault}*/;
	font-size: 1em/*{fsDefault}*/;
}
.ui-widget .ui-widget {
	font-size: 1em;
}
.ui-widget input,
.ui-widget select,
.ui-widget textarea,
.ui-widget button {
	font-family: Arial,Helvetica,sans-serif/*{ffDefault}*/;
	font-size: 1em;
}
.ui-widget.ui-widget-content {
	border: 1px solid #c5c5c5/*{borderColorDefault}*/;
}
.ui-widget-content {
	border: 1px solid #dddddd/*{borderColorContent}*/;
	background: #ffffff/*{bgColorContent}*/ /*{bgImgUrlContent}*/ /*{bgContentXPos}*/ /*{bgContentYPos}*/ /*{bgContentRepeat}*/;
	color: #333333/*{fcContent}*/;
}
.ui-widget-content a {
	color: #333333/*{fcContent}*/;
}
.ui-widget-header {
	border: 1px solid #dddddd/*{borderColorHeader}*/;
	background: #e9e9e9/*{bgColorHeader}*/ /*{bgImgUrlHeader}*/ /*{bgHeaderXPos}*/ /*{bgHeaderYPos}*/ /*{bgHeaderRepeat}*/;
	color: #333333/*{fcHeader}*/;
	font-weight: bold;
}
.ui-widget-header a {
	color: #333333/*{fcHeader}*/;
}

/* Interaction states
----------------------------------*/
.ui-state-default,
.ui-widget-content .ui-state-default,
.ui-widget-header .ui-state-default,
.ui-button,

/* We use html here because we need a greater specificity to make sure disabled
works properly when clicked or hovered */
html .ui-button.ui-state-disabled:hover,
html .ui-button.ui-state-disabled:active {
	border: 1px solid #c5c5c5/*{borderColorDefault}*/;
	background: #f6f6f6/*{bgColorDefault}*/ /*{bgImgUrlDefault}*/ /*{bgDefaultXPos}*/ /*{bgDefaultYPos}*/ /*{bgDefaultRepeat}*/;
	font-weight: normal/*{fwDefault}*/;
	color: #454545/*{fcDefault}*/;
}
.ui-state-default a,
.ui-state-default a:link,
.ui-state-default a:visited,
a.ui-button,
a:link.ui-button,
a:visited.ui-button,
.ui-button {
	color: #454545/*{fcDefault}*/;
	text-decoration: none;
}
.ui-state-hover,
.ui-widget-content .ui-state-hover,
.ui-widget-header .ui-state-hover,
.ui-state-focus,
.ui-widget-content .ui-state-focus,
.ui-widget-header .ui-state-focus,
.ui-button:hover,
.ui-button:focus {
	border: 1px solid #cccccc/*{borderColorHover}*/;
	background: #ededed/*{bgColorHover}*/ /*{bgImgUrlHover}*/ /*{bgHoverXPos}*/ /*{bgHoverYPos}*/ /*{bgHoverRepeat}*/;
	font-weight: normal/*{fwDefault}*/;
	color: #2b2b2b/*{fcHover}*/;
}
.ui-state-hover a,
.ui-state-hover a:hover,
.ui-state-hover a:link,
.ui-state-hover a:visited,
.ui-state-focus a,
.ui-state-focus a:hover,
.ui-state-focus a:link,
.ui-state-focus a:visited,
a.ui-button:hover,
a.ui-button:focus {
	color: #2b2b2b/*{fcHover}*/;
	text-decoration: none;
}

.ui-visual-focus {
	box-shadow: 0 0 3px 1px rgb(94, 158, 214);
}
.ui-state-active,
.ui-widget-content .ui-state-active,
.ui-widget-header .ui-state-active,
a.ui-button:active,
.ui-button:active,
.ui-button.ui-state-active:hover {
	border: 1px solid #003eff/*{borderColorActive}*/;
	background: #007fff/*{bgColorActive}*/ /*{bgImgUrlActive}*/ /*{bgActiveXPos}*/ /*{bgActiveYPos}*/ /*{bgActiveRepeat}*/;
	font-weight: normal/*{fwDefault}*/;
	color: #ffffff/*{fcActive}*/;
}
.ui-icon-background,
.ui-state-active .ui-icon-background {
	border: #003eff/*{borderColorActive}*/;
	background-color: #ffffff/*{fcActive}*/;
}
.ui-state-active a,
.ui-state-active a:link,
.ui-state-active a:visited {
	color: #ffffff/*{fcActive}*/;
	text-decoration: none;
}

/* Interaction Cues
----------------------------------*/
.ui-state-highlight,
.ui-widget-content .ui-state-highlight,
.ui-widget-header .ui-state-highlight {
	border: 1px solid #dad55e/*{borderColorHighlight}*/;
	background: #fffa90/*{bgColorHighlight}*/ /*{bgImgUrlHighlight}*/ /*{bgHighlightXPos}*/ /*{bgHighlightYPos}*/ /*{bgHighlightRepeat}*/;
	color: #777620/*{fcHighlight}*/;
}
.ui-state-checked {
	border: 1px solid #dad55e/*{borderColorHighlight}*/;
	background: #fffa90/*{bgColorHighlight}*/;
}
.ui-state-highlight a,
.ui-widget-content .ui-state-highlight a,
.ui-widget-header .ui-state-highlight a {
	color: #777620/*{fcHighlight}*/;
}
.ui-state-error,
.ui-widget-content .ui-state-error,
.ui-widget-header .ui-state-error {
	border: 1px solid #f1a899/*{borderColorError}*/;
	background: #fddfdf/*{bgColorError}*/ /*{bgImgUrlError}*/ /*{bgErrorXPos}*/ /*{bgErrorYPos}*/ /*{bgErrorRepeat}*/;
	color: #5f3f3f/*{fcError}*/;
}
.ui-state-error a,
.ui-widget-content .ui-state-error a,
.ui-widget-header .ui-state-error a {
	color: #5f3f3f/*{fcError}*/;
}
.ui-state-error-text,
.ui-widget-content .ui-state-error-text,
.ui-widget-header .ui-state-error-text {
	color: #5f3f3f/*{fcError}*/;
}
.ui-priority-primary,
.ui-widget-content .ui-priority-primary,
.ui-widget-header .ui-priority-primary {
	font-weight: bold;
}
.ui-priority-secondary,
.ui-widget-content .ui-priority-secondary,
.ui-widget-header .ui-priority-secondary {
	opacity: .7;
	-ms-filter: "alpha(opacity=70)"; /* support: IE8 */
	font-weight: normal;
}
.ui-state-disabled,
.ui-widget-content .ui-state-disabled,
.ui-widget-header .ui-state-disabled {
	opacity: .35;
	-ms-filter: "alpha(opacity=35)"; /* support: IE8 */
	background-image: none;
}
.ui-state-disabled .ui-icon {
	-ms-filter: "alpha(opacity=35)"; /* support: IE8 - See #6059 */
}

/* Icons
----------------------------------*/

/* states and images */
.ui-icon {
	width: 16px;
	height: 16px;
}
.ui-icon,
.ui-widget-content .ui-icon {
	background-image: url(/assets/jquery-ui/ui-icons_444444_256x240-b71a8ee2c52d123df6e7cfbd39fd42ef7286f01dbcc30a8e560ca445a02906b5.png)/*{iconsContent}*/;
}
.ui-widget-header .ui-icon {
	background-image: url(/assets/jquery-ui/ui-icons_444444_256x240-b71a8ee2c52d123df6e7cfbd39fd42ef7286f01dbcc30a8e560ca445a02906b5.png)/*{iconsHeader}*/;
}
.ui-state-hover .ui-icon,
.ui-state-focus .ui-icon,
.ui-button:hover .ui-icon,
.ui-button:focus .ui-icon {
	background-image: url(/assets/jquery-ui/ui-icons_555555_256x240-4c52fd5e0a9a8d4b2ffbb58ee4fed1b1609acf0c1a8313b2900bc80e535a94a2.png)/*{iconsHover}*/;
}
.ui-state-active .ui-icon,
.ui-button:active .ui-icon {
	background-image: url(/assets/jquery-ui/ui-icons_ffffff_256x240-1c099578334302a7104e5e7179edb6ecec6f95498772bcf21e6b8654853b7634.png)/*{iconsActive}*/;
}
.ui-state-highlight .ui-icon,
.ui-button .ui-state-highlight.ui-icon {
	background-image: url(/assets/jquery-ui/ui-icons_777620_256x240-61d09df13bf7e23c85865bd76b02c5a0c401cfb7a8ba6894397f1e42213f91a9.png)/*{iconsHighlight}*/;
}
.ui-state-error .ui-icon,
.ui-state-error-text .ui-icon {
	background-image: url(/assets/jquery-ui/ui-icons_cc0000_256x240-96c99c5d6006618455bf32e8da8900b0494195fbf4372f9da59a572bfd1b6ee5.png)/*{iconsError}*/;
}
.ui-button .ui-icon {
	background-image: url(/assets/jquery-ui/ui-icons_777777_256x240-4d5db2c0b3dbe462e4f3a94384c24728b262196fa17a5555134947af2d367e1c.png)/*{iconsDefault}*/;
}

/* positioning */
/* Three classes needed to override `.ui-button:hover .ui-icon` */
.ui-icon-blank.ui-icon-blank.ui-icon-blank {
	background-image: none;
}
.ui-icon-caret-1-n { background-position: 0 0; }
.ui-icon-caret-1-ne { background-position: -16px 0; }
.ui-icon-caret-1-e { background-position: -32px 0; }
.ui-icon-caret-1-se { background-position: -48px 0; }
.ui-icon-caret-1-s { background-position: -65px 0; }
.ui-icon-caret-1-sw { background-position: -80px 0; }
.ui-icon-caret-1-w { background-position: -96px 0; }
.ui-icon-caret-1-nw { background-position: -112px 0; }
.ui-icon-caret-2-n-s { background-position: -128px 0; }
.ui-icon-caret-2-e-w { background-position: -144px 0; }
.ui-icon-triangle-1-n { background-position: 0 -16px; }
.ui-icon-triangle-1-ne { background-position: -16px -16px; }
.ui-icon-triangle-1-e { background-position: -32px -16px; }
.ui-icon-triangle-1-se { background-position: -48px -16px; }
.ui-icon-triangle-1-s { background-position: -65px -16px; }
.ui-icon-triangle-1-sw { background-position: -80px -16px; }
.ui-icon-triangle-1-w { background-position: -96px -16px; }
.ui-icon-triangle-1-nw { background-position: -112px -16px; }
.ui-icon-triangle-2-n-s { background-position: -128px -16px; }
.ui-icon-triangle-2-e-w { background-position: -144px -16px; }
.ui-icon-arrow-1-n { background-position: 0 -32px; }
.ui-icon-arrow-1-ne { background-position: -16px -32px; }
.ui-icon-arrow-1-e { background-position: -32px -32px; }
.ui-icon-arrow-1-se { background-position: -48px -32px; }
.ui-icon-arrow-1-s { background-position: -65px -32px; }
.ui-icon-arrow-1-sw { background-position: -80px -32px; }
.ui-icon-arrow-1-w { background-position: -96px -32px; }
.ui-icon-arrow-1-nw { background-position: -112px -32px; }
.ui-icon-arrow-2-n-s { background-position: -128px -32px; }
.ui-icon-arrow-2-ne-sw { background-position: -144px -32px; }
.ui-icon-arrow-2-e-w { background-position: -160px -32px; }
.ui-icon-arrow-2-se-nw { background-position: -176px -32px; }
.ui-icon-arrowstop-1-n { background-position: -192px -32px; }
.ui-icon-arrowstop-1-e { background-position: -208px -32px; }
.ui-icon-arrowstop-1-s { background-position: -224px -32px; }
.ui-icon-arrowstop-1-w { background-position: -240px -32px; }
.ui-icon-arrowthick-1-n { background-position: 1px -48px; }
.ui-icon-arrowthick-1-ne { background-position: -16px -48px; }
.ui-icon-arrowthick-1-e { background-position: -32px -48px; }
.ui-icon-arrowthick-1-se { background-position: -48px -48px; }
.ui-icon-arrowthick-1-s { background-position: -64px -48px; }
.ui-icon-arrowthick-1-sw { background-position: -80px -48px; }
.ui-icon-arrowthick-1-w { background-position: -96px -48px; }
.ui-icon-arrowthick-1-nw { background-position: -112px -48px; }
.ui-icon-arrowthick-2-n-s { background-position: -128px -48px; }
.ui-icon-arrowthick-2-ne-sw { background-position: -144px -48px; }
.ui-icon-arrowthick-2-e-w { background-position: -160px -48px; }
.ui-icon-arrowthick-2-se-nw { background-position: -176px -48px; }
.ui-icon-arrowthickstop-1-n { background-position: -192px -48px; }
.ui-icon-arrowthickstop-1-e { background-position: -208px -48px; }
.ui-icon-arrowthickstop-1-s { background-position: -224px -48px; }
.ui-icon-arrowthickstop-1-w { background-position: -240px -48px; }
.ui-icon-arrowreturnthick-1-w { background-position: 0 -64px; }
.ui-icon-arrowreturnthick-1-n { background-position: -16px -64px; }
.ui-icon-arrowreturnthick-1-e { background-position: -32px -64px; }
.ui-icon-arrowreturnthick-1-s { background-position: -48px -64px; }
.ui-icon-arrowreturn-1-w { background-position: -64px -64px; }
.ui-icon-arrowreturn-1-n { background-position: -80px -64px; }
.ui-icon-arrowreturn-1-e { background-position: -96px -64px; }
.ui-icon-arrowreturn-1-s { background-position: -112px -64px; }
.ui-icon-arrowrefresh-1-w { background-position: -128px -64px; }
.ui-icon-arrowrefresh-1-n { background-position: -144px -64px; }
.ui-icon-arrowrefresh-1-e { background-position: -160px -64px; }
.ui-icon-arrowrefresh-1-s { background-position: -176px -64px; }
.ui-icon-arrow-4 { background-position: 0 -80px; }
.ui-icon-arrow-4-diag { background-position: -16px -80px; }
.ui-icon-extlink { background-position: -32px -80px; }
.ui-icon-newwin { background-position: -48px -80px; }
.ui-icon-refresh { background-position: -64px -80px; }
.ui-icon-shuffle { background-position: -80px -80px; }
.ui-icon-transfer-e-w { background-position: -96px -80px; }
.ui-icon-transferthick-e-w { background-position: -112px -80px; }
.ui-icon-folder-collapsed { background-position: 0 -96px; }
.ui-icon-folder-open { background-position: -16px -96px; }
.ui-icon-document { background-position: -32px -96px; }
.ui-icon-document-b { background-position: -48px -96px; }
.ui-icon-note { background-position: -64px -96px; }
.ui-icon-mail-closed { background-position: -80px -96px; }
.ui-icon-mail-open { background-position: -96px -96px; }
.ui-icon-suitcase { background-position: -112px -96px; }
.ui-icon-comment { background-position: -128px -96px; }
.ui-icon-person { background-position: -144px -96px; }
.ui-icon-print { background-position: -160px -96px; }
.ui-icon-trash { background-position: -176px -96px; }
.ui-icon-locked { background-position: -192px -96px; }
.ui-icon-unlocked { background-position: -208px -96px; }
.ui-icon-bookmark { background-position: -224px -96px; }
.ui-icon-tag { background-position: -240px -96px; }
.ui-icon-home { background-position: 0 -112px; }
.ui-icon-flag { background-position: -16px -112px; }
.ui-icon-calendar { background-position: -32px -112px; }
.ui-icon-cart { background-position: -48px -112px; }
.ui-icon-pencil { background-position: -64px -112px; }
.ui-icon-clock { background-position: -80px -112px; }
.ui-icon-disk { background-position: -96px -112px; }
.ui-icon-calculator { background-position: -112px -112px; }
.ui-icon-zoomin { background-position: -128px -112px; }
.ui-icon-zoomout { background-position: -144px -112px; }
.ui-icon-search { background-position: -160px -112px; }
.ui-icon-wrench { background-position: -176px -112px; }
.ui-icon-gear { background-position: -192px -112px; }
.ui-icon-heart { background-position: -208px -112px; }
.ui-icon-star { background-position: -224px -112px; }
.ui-icon-link { background-position: -240px -112px; }
.ui-icon-cancel { background-position: 0 -128px; }
.ui-icon-plus { background-position: -16px -128px; }
.ui-icon-plusthick { background-position: -32px -128px; }
.ui-icon-minus { background-position: -48px -128px; }
.ui-icon-minusthick { background-position: -64px -128px; }
.ui-icon-close { background-position: -80px -128px; }
.ui-icon-closethick { background-position: -96px -128px; }
.ui-icon-key { background-position: -112px -128px; }
.ui-icon-lightbulb { background-position: -128px -128px; }
.ui-icon-scissors { background-position: -144px -128px; }
.ui-icon-clipboard { background-position: -160px -128px; }
.ui-icon-copy { background-position: -176px -128px; }
.ui-icon-contact { background-position: -192px -128px; }
.ui-icon-image { background-position: -208px -128px; }
.ui-icon-video { background-position: -224px -128px; }
.ui-icon-script { background-position: -240px -128px; }
.ui-icon-alert { background-position: 0 -144px; }
.ui-icon-info { background-position: -16px -144px; }
.ui-icon-notice { background-position: -32px -144px; }
.ui-icon-help { background-position: -48px -144px; }
.ui-icon-check { background-position: -64px -144px; }
.ui-icon-bullet { background-position: -80px -144px; }
.ui-icon-radio-on { background-position: -96px -144px; }
.ui-icon-radio-off { background-position: -112px -144px; }
.ui-icon-pin-w { background-position: -128px -144px; }
.ui-icon-pin-s { background-position: -144px -144px; }
.ui-icon-play { background-position: 0 -160px; }
.ui-icon-pause { background-position: -16px -160px; }
.ui-icon-seek-next { background-position: -32px -160px; }
.ui-icon-seek-prev { background-position: -48px -160px; }
.ui-icon-seek-end { background-position: -64px -160px; }
.ui-icon-seek-start { background-position: -80px -160px; }
/* ui-icon-seek-first is deprecated, use ui-icon-seek-start instead */
.ui-icon-seek-first { background-position: -80px -160px; }
.ui-icon-stop { background-position: -96px -160px; }
.ui-icon-eject { background-position: -112px -160px; }
.ui-icon-volume-off { background-position: -128px -160px; }
.ui-icon-volume-on { background-position: -144px -160px; }
.ui-icon-power { background-position: 0 -176px; }
.ui-icon-signal-diag { background-position: -16px -176px; }
.ui-icon-signal { background-position: -32px -176px; }
.ui-icon-battery-0 { background-position: -48px -176px; }
.ui-icon-battery-1 { background-position: -64px -176px; }
.ui-icon-battery-2 { background-position: -80px -176px; }
.ui-icon-battery-3 { background-position: -96px -176px; }
.ui-icon-circle-plus { background-position: 0 -192px; }
.ui-icon-circle-minus { background-position: -16px -192px; }
.ui-icon-circle-close { background-position: -32px -192px; }
.ui-icon-circle-triangle-e { background-position: -48px -192px; }
.ui-icon-circle-triangle-s { background-position: -64px -192px; }
.ui-icon-circle-triangle-w { background-position: -80px -192px; }
.ui-icon-circle-triangle-n { background-position: -96px -192px; }
.ui-icon-circle-arrow-e { background-position: -112px -192px; }
.ui-icon-circle-arrow-s { background-position: -128px -192px; }
.ui-icon-circle-arrow-w { background-position: -144px -192px; }
.ui-icon-circle-arrow-n { background-position: -160px -192px; }
.ui-icon-circle-zoomin { background-position: -176px -192px; }
.ui-icon-circle-zoomout { background-position: -192px -192px; }
.ui-icon-circle-check { background-position: -208px -192px; }
.ui-icon-circlesmall-plus { background-position: 0 -208px; }
.ui-icon-circlesmall-minus { background-position: -16px -208px; }
.ui-icon-circlesmall-close { background-position: -32px -208px; }
.ui-icon-squaresmall-plus { background-position: -48px -208px; }
.ui-icon-squaresmall-minus { background-position: -64px -208px; }
.ui-icon-squaresmall-close { background-position: -80px -208px; }
.ui-icon-grip-dotted-vertical { background-position: 0 -224px; }
.ui-icon-grip-dotted-horizontal { background-position: -16px -224px; }
.ui-icon-grip-solid-vertical { background-position: -32px -224px; }
.ui-icon-grip-solid-horizontal { background-position: -48px -224px; }
.ui-icon-gripsmall-diagonal-se { background-position: -64px -224px; }
.ui-icon-grip-diagonal-se { background-position: -80px -224px; }


/* Misc visuals
----------------------------------*/

/* Corner radius */
.ui-corner-all,
.ui-corner-top,
.ui-corner-left,
.ui-corner-tl {
	border-top-left-radius: 3px/*{cornerRadius}*/;
}
.ui-corner-all,
.ui-corner-top,
.ui-corner-right,
.ui-corner-tr {
	border-top-right-radius: 3px/*{cornerRadius}*/;
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-left,
.ui-corner-bl {
	border-bottom-left-radius: 3px/*{cornerRadius}*/;
}
.ui-corner-all,
.ui-corner-bottom,
.ui-corner-right,
.ui-corner-br {
	border-bottom-right-radius: 3px/*{cornerRadius}*/;
}

/* Overlays */
.ui-widget-overlay {
	background: #aaaaaa/*{bgColorOverlay}*/ /*{bgImgUrlOverlay}*/ /*{bgOverlayXPos}*/ /*{bgOverlayYPos}*/ /*{bgOverlayRepeat}*/;
	opacity: .3/*{opacityOverlay}*/;
	-ms-filter: "alpha(opacity=30)"/*{opacityFilterOverlay}*/; /* support: IE8 */
}
.ui-widget-shadow {
	-webkit-box-shadow: 0/*{offsetLeftShadow}*/ 0/*{offsetTopShadow}*/ 5px/*{thicknessShadow}*/ #666666/*{bgColorShadow}*/;
	box-shadow: 0/*{offsetLeftShadow}*/ 0/*{offsetTopShadow}*/ 5px/*{thicknessShadow}*/ #666666/*{bgColorShadow}*/;
}
/*!
 * jQuery UI Datepicker 1.13.0
 * http://jqueryui.com
 *
 * Copyright jQuery Foundation and other contributors
 * Released under the MIT license.
 * http://jquery.org/license
 *
 * http://api.jqueryui.com/datepicker/#theming
 */
/*

 */
.ui-datepicker {
	width: 17em;
	padding: .2em .2em 0;
	display: none;
}
.ui-datepicker .ui-datepicker-header {
	position: relative;
	padding: .2em 0;
}
.ui-datepicker .ui-datepicker-prev,
.ui-datepicker .ui-datepicker-next {
	position: absolute;
	top: 2px;
	width: 1.8em;
	height: 1.8em;
}
.ui-datepicker .ui-datepicker-prev-hover,
.ui-datepicker .ui-datepicker-next-hover {
	top: 1px;
}
.ui-datepicker .ui-datepicker-prev {
	left: 2px;
}
.ui-datepicker .ui-datepicker-next {
	right: 2px;
}
.ui-datepicker .ui-datepicker-prev-hover {
	left: 1px;
}
.ui-datepicker .ui-datepicker-next-hover {
	right: 1px;
}
.ui-datepicker .ui-datepicker-prev span,
.ui-datepicker .ui-datepicker-next span {
	display: block;
	position: absolute;
	left: 50%;
	margin-left: -8px;
	top: 50%;
	margin-top: -8px;
}
.ui-datepicker .ui-datepicker-title {
	margin: 0 2.3em;
	line-height: 1.8em;
	text-align: center;
}
.ui-datepicker .ui-datepicker-title select {
	font-size: 1em;
	margin: 1px 0;
}
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
	width: 45%;
}
.ui-datepicker table {
	width: 100%;
	font-size: .9em;
	border-collapse: collapse;
	margin: 0 0 .4em;
}
.ui-datepicker th {
	padding: .7em .3em;
	text-align: center;
	font-weight: bold;
	border: 0;
}
.ui-datepicker td {
	border: 0;
	padding: 1px;
}
.ui-datepicker td span,
.ui-datepicker td a {
	display: block;
	padding: .2em;
	text-align: right;
	text-decoration: none;
}
.ui-datepicker .ui-datepicker-buttonpane {
	background-image: none;
	margin: .7em 0 0 0;
	padding: 0 .2em;
	border-left: 0;
	border-right: 0;
	border-bottom: 0;
}
.ui-datepicker .ui-datepicker-buttonpane button {
	float: right;
	margin: .5em .2em .4em;
	cursor: pointer;
	padding: .2em .6em .3em .6em;
	width: auto;
	overflow: visible;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
	float: left;
}

/* with multiple calendars */
.ui-datepicker.ui-datepicker-multi {
	width: auto;
}
.ui-datepicker-multi .ui-datepicker-group {
	float: left;
}
.ui-datepicker-multi .ui-datepicker-group table {
	width: 95%;
	margin: 0 auto .4em;
}
.ui-datepicker-multi-2 .ui-datepicker-group {
	width: 50%;
}
.ui-datepicker-multi-3 .ui-datepicker-group {
	width: 33.3%;
}
.ui-datepicker-multi-4 .ui-datepicker-group {
	width: 25%;
}
.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
	border-left-width: 0;
}
.ui-datepicker-multi .ui-datepicker-buttonpane {
	clear: left;
}
.ui-datepicker-row-break {
	clear: both;
	width: 100%;
	font-size: 0;
}

/* RTL support */
.ui-datepicker-rtl {
	direction: rtl;
}
.ui-datepicker-rtl .ui-datepicker-prev {
	right: 2px;
	left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next {
	left: 2px;
	right: auto;
}
.ui-datepicker-rtl .ui-datepicker-prev:hover {
	right: 1px;
	left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next:hover {
	left: 1px;
	right: auto;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane {
	clear: right;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button {
	float: left;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current,
.ui-datepicker-rtl .ui-datepicker-group {
	float: right;
}
.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header {
	border-right-width: 0;
	border-left-width: 1px;
}

/* Icons */
.ui-datepicker .ui-icon {
	display: block;
	text-indent: -99999px;
	overflow: hidden;
	background-repeat: no-repeat;
	left: .5em;
	top: .3em;
}
#ng-view {
  position: relative;
  padding-top: 65px;
}
.overlayContainer {
  display: none;
}
.overlayBackground {
  position: absolute;
  top: 0;
  left: 0;
  z-index: 9999;
  width: 100%;
  height: 100%;
  padding-left: 100px;
  opacity: 0.3;
}
.overlayContent {
  position: absolute;
  width: 300px;
  height: 100px;
  font-weight: bold;
  text-align: center;
}

/* spinner */
.loader {
  z-index: 1001;
  background: url(/web/img/modal/load_00.gif);
}
/* Slider */
.slick-slider
{
    position: relative;

    display: block;
    box-sizing: border-box;

    -webkit-user-select: none;
       -moz-user-select: none;
        -ms-user-select: none;
            user-select: none;

    -webkit-touch-callout: none;
    -khtml-user-select: none;
    -ms-touch-action: pan-y;
        touch-action: pan-y;
    -webkit-tap-highlight-color: transparent;
}

.slick-list
{
    position: relative;

    display: block;
    overflow: hidden;
    box-shadow: 0 0 3px 0 #999999;

    margin: 0;
    padding: 0;
}
.slider-nav .slick-list {
	box-shadow: none;
}
.slick-list:focus
{
    outline: none;
}
.slick-list.dragging
{
    cursor: pointer;
    cursor: hand;
}

.slick-track
{
    position: relative;
    top: 0;
    left: 0;

    display: block;
    margin-left: auto;
    margin-right: auto;
}
.slick-track:before,
.slick-track:after
{
    display: table;

    content: '';
}
.slick-track:after
{
    clear: both;
}
.slick-loading .slick-track
{
    visibility: hidden;
}

.slick-slide
{
    display: none;
    float: left;

    height: 100%;
    min-height: 1px;
}
[dir='rtl'] .slick-slide
{
    float: right;
}
.slick-slide img
{
    display: block;
}
.slick-slide.slick-loading img
{
    display: none;
}
.slick-slide.dragging img
{
    pointer-events: none;
}
.slick-initialized .slick-slide
{
    display: block;
}
.slick-loading .slick-slide
{
    visibility: hidden;
}
.slick-vertical .slick-slide
{
    display: block;

    height: auto;

    border: 1px solid transparent;
}
.slick-arrow.slick-hidden {
    display: none;
}

/****** 導入事例スライドショー ******/
/* インナー部分
-------------------------------------------------- */
.voice .inner-voice {
	margin: 0 auto;
	max-width: 900px;
	padding: 90px 0 100px;
}
/* SP */
@media screen and (max-width: 670px) {
	.voice .inner-voice {
		padding: 40px 0 35px;
	}
}

/* 枠組み
-------------------------------------------------- */
.slick-slider,
.slick-slider * {
	box-sizing: border-box;
	-webkit-tap-highlight-color: rgba(0,0,0,0);
	outline: none;
}
.slick-slider {
	position: relative;
	display: block;
}
.slider-for {
	max-width: 1000px;
	margin: 0 auto;
}
.slider-for .slick-list,
.slider-nav {
	max-width: 960px;
	width: 96%;
}
.slider-for .slick-list {
	border-radius: 5px;
	margin: 0 auto;
	position: relative;
	display: block;
	overflow: hidden;
	padding: 0;
	z-index: 3;
	background-color: #ffffff;
}
.slider-nav {
	overflow: hidden;
	margin: 0 auto 30px;
}
/* SP */
@media screen and (max-width: 670px) {
	.slider-for .slick-list {
		border-radius: 5px;
	}
	.slider-nav {
		width: 100%;
		border-radius: 0;
		border: 0;
		margin: 0;
	}
	.slider-nav .thum-box {
		margin: 13px 3px 0;
	}
}

/* メインのスライド
-------------------------------------------------- */
.slider-for .slick-list.dragging {
	cursor: pointer;
	cursor: hand;
}
.slick-track {
	position: relative;
	top: 0;
	left: 0;
	display: block;
}
.slick-track:before,
.slick-track:after {
	display: table;
	content: '';
}
.slick-track:after { clear: both; }
.slick-loading .slick-track { visibility: hidden; }
.slick-slide {
	display: none;
	float: left;
	height: 100%;
	min-height: 1px;
}
[dir='rtl'] .slick-slid { float: right; }
.slick-slide.slick-loading img { display: none; }
.slick-slide.dragging img { pointer-events: none; }
.slick-initialized .slick-slide { display: block; }
.slick-loading .slick-slide { visibility: hidden; }
.slick-vertical .slick-slide {
	display: block;
	height: auto;
	border: 1px solid transparent;
}
.slick-arrow.slick-hidden { display: none; }
/* SP */
@media screen and (max-width: 670px) {
	.slider-for .slick-list:hover {
		opacity: 1;
		filter: alpha(opacity=100);
	}
}

/* 導入事例の画像とテキスト（共通）
-------------------------------------------------- */
.slider-for .slick-track {
	display: flex;
}
.slick-slider .slick-slide > div {
	width: 100%;
	height: auto!important;
}
.slider-for .link-area {
	box-sizing:border-box;
	border-radius: 5px;
	display: flex;
	transition: background-color 0.3s;
	height: auto;
	float: none;
	border: 1px #BDBDBD solid;
}
.slider-for .link-area:hover {
	background-color: #ebf5f5;
	border: 1px #25adad solid;
	border-radius: 5px;
	text-decoration: none;
}
.link-area span { display: block; }
.link-area .co-001g { display: inline; }
.link-area .ph-image,
.link-area .di-txt-box {
	width: 50%;
}
.link-area .ph-image {
	line-height: 0;
	overflow: hidden;
	background-repeat: no-repeat;
	background-position: center;
	background-size: auto 100%;
}
.link-area .ph-image img { display: none; }
.link-area .di-txt-box {
	padding: 30px 85px 30px 50px;
	position: relative;
}
.link-area .di-industry {
	float: left;
	border: 1px #25adad solid;
	color: #25adad;
	font-size: 15px;
	border-radius: 3px;
	padding: 6px 8px 5px;
	line-height: 1;
	max-width: 50%;
}
.link-area .di-txt {
	font-weight: bold;
	font-size: 24px;
	line-height: 1.5;
	margin-top: 25px;
	color: #25adad;
	text-align: left;
}
.link-area .di-name {
	color: #3d3b3c;
	margin-top: 20px;
	font-size: 14px;
	font-weight: bold;
	text-align: left;
}
.link-area .di-cont {
	margin: 15px 0 35px;
	font-size: 15px;
	color: #3d3b3c;
	text-align: left;
	line-height: 1.5;
}
.link-area .di-link {
	position: absolute;
	bottom: 30px;
	left: 36%;
}
.link-area .di-link span {
	font-size: 15px;
	color: #32a2dd;
	background: url(/web/img/pre/icon/img_icon_arrow.gif) center left no-repeat;
	padding-left: 10px;
	background-size: 7px 12px;
}
/* TABLET */
@media screen and (min-width: 641px) and (max-width: 940px) {
	.link-area .di-txt { font-size: 17px; }
	.link-area .di-txt-box { padding: 30px 65px 30px 30px; }
	.link-area .di-link { margin-top: 20px; }
}
/* SP */
@media screen and (max-width: 670px) {
	.slider-for .link-area { display: block; }
	.link-area .ph-image,
	.link-area .di-txt-box {
		display: block;
		padding: 30px;
	}
	.link-area .ph-image,
	.link-area .di-txt-box {
		float: none;
		width: auto;
		text-align: center;
	}
	.link-area .ph-image {
		min-height: 135px;
		height: calc(94vw * 0.5);
		background-size: 100% auto;
	}
	.link-area .di-txt {
		font-size: 19px;
		margin: 0 auto;
		line-height: 1.5;
		display: inline-block;
	}
	.link-area .di-industry { display: none; }
	.link-area .di-name {
		margin: 10px 0 0;
		font-size: 14px;
		color: #3c3c3c;
		font-weight: normal;
		text-align:center;
	}
	.link-area .di-cont { display: none; }
	.link-area .di-link {
		position: static;
		text-align: center;
		bottom: 0;
		left: 0;
		margin-top: 10px;
	}
	.link-area .di-link span { font-size: 14px; }
}

/* 導入事例の画像とテキスト（個別）
-------------------------------------------------- */
.slide01 .ph-image { background-image: url(/web/img/pre/voice/voice001.jpg); }
.slide02 .ph-image { background-image: url(/web/img/pre/voice/voice002.jpg); }
.slide03 .ph-image { background-image: url(/web/img/pre/voice/voice003.jpg); }
.slide04 .ph-image { background-image: url(/web/img/pre/voice/voice004.jpg); }
.slide05 .ph-image { background-image: url(/web/img/pre/voice/voice005.jpg); }
.slide06 .ph-image { background-image: url(/web/img/pre/voice/voice006.jpg); }
/* SP */
@media screen and (max-width: 670px) {
	.slide01 .ph-image { background-image: url(/web/img/pre/voice/voice001.jpg); }
	.slide02 .ph-image { background-image: url(/web/img/pre/voice/voice002.jpg); }
	.slide03 .ph-image { background-image: url(/web/img/pre/voice/voice003.jpg); }
	.slide04 .ph-image { background-image: url(/web/img/pre/voice/voice004.jpg); }
	.slide05 .ph-image { background-image: url(/web/img/pre/voice/voice005.jpg); }
	.slide06 .ph-image { background-image: url(/web/img/pre/voice/voice006.jpg); }
	.slide01 .ph-image,
	.slide02 .ph-image,
	.slide03 .ph-image,
	.slide04 .ph-image,
	.slide05 .ph-image,
	.slide06 .ph-image {
		border-radius: 5px 5px 0 0;
		background-position: center top;
	}
}

/* サムネイル
-------------------------------------------------- */
.slider-nav .slick-track { margin-left: -50.5%; }
.slider-nav .thum-box {
	display: block;
	margin: 20px 20px 1px 0;
	min-width: 70px;
	max-width: 140px;
	height: auto;
	background-color: #ffffff;
	border: 1px solid #cccccc;
	padding: 0;
	cursor: pointer;
	text-align: center;
}
.slider-nav .thum-box .thumbnail {
	width: 100%;
	height: auto;
}
.slider-nav .slick-current .thum-box {
	opacity: 1;
	filter: alpha(opacity=100);
	border: 1px solid #25adad;
}
.slider-nav .slick-current .thum-box img {
	opacity: 0.4;
}

/* SP */
@media screen and (max-width: 670px) {
	.slider-nav .slick-track { margin: 15px 0 0 -30%; }
	.slider-nav .thum-box {
		margin: 13px 3px;
		padding: 2px 0 1px;
		min-width: 17px;
		max-width: 17px;
		height: 17px;
		border-radius: 10px;
		background-color: #d2d2d2;
		border: none;
		display: inline-block;
	}
	.slider-nav .thum-box:hover {
		opacity: 0.8;
		filter: alpha(opacity=80);
	}
	.slider-nav .slick-current .thum-box {
		opacity: 1;
		background-color: #25adad;
		filter: alpha(opacity=100);
		border: none;
	}
	.slider-nav .slick-current .thum-box img { display: none; }
	.slider-nav .thum-box img { display: none; }
	.slider-nav .slick-slide {
		width: 15%!important;
		margin: 0 auto;
		text-align: center;
	}
}

/* スライドショー矢印
-------------------------------------------------- */
.slick-prev,
.slick-next {
	background-color: #959595;
	border: 0 none;
	color: transparent;
	cursor: pointer;
	opacity: 0.85;
	filter: alpha(opacity=85);
	overflow: hidden;
	position: absolute;
	top: 0;
	white-space: nowrap;
	width: 0;
	height: 100%;
	font-size: 0;
	z-index: 5;
}
.slick-prev:hover,
.slick-next:hover { background-color: #707070; }
.slick-prev,
[dir='rtl'] .slick-prev {
	right: auto;
	left: 2%;
	border-radius: 5px 0 0 5px;
	padding: 0 22px 0 13px;
}
.slick-prev:before,
[dir='rtl'] .slick-prev:before {
	content: url('https://paid.jp/img/pre/index/instance_slide/slide_arw_r_00.png');
}
.slick-next,
[dir='rtl'] .slick-next {
	right: 2%;
	left: auto;
	border-radius: 0 5px 5px 0;
	padding: 0 20px 0 15px;
}
.slick-next:before,
[dir='rtl'] .slick-next:before {
	content: url('https://paid.jp/img/pre/index/instance_slide/slide_arw_l_00.png');
}
@media screen and (max-width: 670px) {
	.slick-prev,
	.slick-next { height: 60px; }
	.slick-prev,
	[dir='rtl'] .slick-prev {
		left: 0;
		border-radius: 0 15px 15px 0;
		padding: 0 23px 0 12px;
	}
	.slick-next,
	[dir='rtl'] .slick-next {
		right: 0;
		border-radius: 15px 0 0 15px;
		padding: 0 18px 0 17px;
	}
	.slick-disabled { display: none !important; }
}

/*
 * This is a manifest file that'll be compiled into web/application.css, which will include all the files
 * listed below.
 *
 * WEB/CSS










 */