@charset "utf-8";

@import url(../../common/css/_variable.css);

/* agreement */
/* ============================================ */

.clause_box {
  max-width: 1300px;
  margin: auto;
  padding: 3vw 20px;
  h2 {
    text-align: center;
    font-size: clamp(2.2rem, 2vw, 3.2rem);
    font-weight: 400;
    line-height: 1em;
    margin-bottom:1.6vw;
  }
  h3 {
    color: #D0531B;
    font-size: 2.2rem;
    line-height: 1.4em;
    font-family: "Zen Old Mincho", serif;
    font-weight: 400;
    margin-bottom:1vw;
    @media (width < 480px) {
      font-size: 1.8rem;
    }
  }
}

.clause_copy {
  font-size: 1.5rem;
  line-height: 1.6em;
  margin: 0 0 20px;
}

.c_box {
  padding: 0 0 30px;
  h4 {
    padding: 0 0 0 20px;
    line-height: 1.4em;
    font-size: 2rem;
    font-weight: 400;
  }
  p {
    padding: 4px 0 0 20px;
    font-size: 1.5rem;
    line-height: 1.6em;
  }
  ol {
    padding: 0 0 0 44px;
    li {
      list-style-type: decimal;
      font-size: 1.5rem;
      line-height: 1.6em;
      padding: 4px 0;
    }
  }

  ul {
    padding: 0 0 0 20px;

    li {
      font-size: 1.5rem;
      line-height: 1.6em;
      padding: 4px 0;

      ol.kakko {
        padding: 5px 0 5px 22px;
      }
    }
  }

  ol li ol.kakko {
    padding: 5px 0 5px 0px;
  }
  ul li ol.kakko li, ol li ol.kakko li {
    list-style-type: none;
    list-style-position: inside;
    font-size: 1.5rem;
    line-height: 1.6em;
    counter-increment: cnt;
		text-indent:-2em;
  }
  ul li ol.kakko li:before {
    display: marker;
    content: "(" counter(cnt) ")";
  }
  ol li ol {
    &.kakko li:before {
      display: marker;
      content: "(" counter(cnt) ")";
    }
    &.iroha {
      padding: 5px 0 5px 24px;
      li {
        list-style-type: lower-latin;
        font-size: 1.5rem;
        line-height: 1.6em;
      }
    }
    &.kakko li ol.iroha {
      padding: 0 0 0 30px;
      li {
        counter-increment: none;
        font-size: 1.5rem;
        line-height: 1.6em;
        list-style-position: inside;
        &:before {
          content: none;
        }
      }
    }
  }

  table {
    text-align: center;
    border: #666 solid 1px;
    margin: 0 0 0 20px;
    font-size: 1.5rem;
    line-height: 1.6em;
  }
  th {
    background-color: #444;
    color: #FFF;
    padding: 5px 20px;
    border-right: #666 solid 1px;

    &:last-child {
      border-right: none;
    }
  }
  td {
    padding: 8px;
    border-right: #666 solid 1px;
    border-top: #666 solid 1px;
    background-color: #FFF;
    vertical-align: middle;
    &.gray {
      background-color: #ededed;
    }
  }
}

/** notation **/
.notation_area {
  padding: 0 20px;
}

.notation_block {
  max-width: 1200px;
  margin: 0 auto;
}
.notation_box {
  margin: 5px 0 0;
  padding: 50px 0;
}
.notation_box table {
  border-top: #666 dotted 1px;
  font-size: 1.5rem;
  line-height: 1.6em;
}
.notation_box th,.notation_box td {
  border-bottom: #666 dotted 1px;
  padding: 16px 5px;
  text-align: left;
  @media (width < 480px) {
    display: inline-block;
    width: 100%;
    box-sizing: border-box;
  }
}
.notation_box th {
  white-space: nowrap;
}
.notation_box th::after {
  content: "：";
}
.notation_box td a {
  color: #000;
}

.p_box {
  padding: 20px 0;
  p {
  font-size: 1.5rem;
  line-height: 1.6em;
  padding: 3px 0 3px 1.5em;
  @media (width < 480px) {
    padding: 3px 0 3px 12px;
  }
  }
  h4 {
    font-size: 2rem;;
    line-height: 1.4em;
    padding: 12px 0 8px 1.5em;
    font-weight: 400;
    @media (width < 480px) {
    padding: 12px 0 3px 12px;
  }
  }

  ol {
    font-size: 1.5rem;
    line-height: 1.6em;
    padding: 0 0 0 4em;

    li {
      list-style: decimal;
      padding: 3px 0;
    }
  }
}

/** privacy **/

.pp_box {
  padding: 10px 0 10px 3.5em;
  @media (width < 480px) {
    padding: 10px 0 10px 12px;
  }
  h5 {
    font-size: 1.8rem;
    line-height: 1.4em;
  }

  p {
    font-size: 1.5rem;
    line-height: 1.6em;
    padding: 3px 0 3px 2em;
    @media (width < 480px) {
    padding: 3px 0 3px 12px;
  }
  }

  ul {
    font-size: 1.5rem;
    line-height: 1.6em;
    padding: 3px 0 3px 3.5em;

    li {
      padding: 3px 0;
      list-style: disc;
    }
  }
}

.p_signature p {
    font-size: 1.5rem;
    line-height: 1.6em;

  a {
    color: #333;
  }
}