@charset "UTF-8";
/** div.form */
/**************************************/
div.form {
  overflow: hidden;
  box-sizing: border-box;
  /* ==========================================================================
	モジュール
	========================================================================== */
  /*
* === ラジオ・チェックボタン ===
*/
  /*
* === プルダウン ===
*/
  /* ==========================================================================
	パーツ
	========================================================================== */
  /*
* === 姓名 ===
*/
  /*
* === tel ===
*/
  /*
* === 住所 ===
*/
  /*
* === 年月日 ===
*/
  /*
* === 短いinputと単位 ===
*/
  /*
* === middle_unit ===
*/ }
  div.form > table {
    border-top: 1px solid #e5e5e5;
    width: 100%;
    margin-bottom: 30px;
    box-sizing: border-box; }
    div.form > table > tbody > tr > th {
      border-bottom: 1px solid #e5e5e5;
      background: #f2f2f2;
      font-size: 13px;
      font-weight: bold;
      width: 200px;
      padding: 20px;
      box-sizing: border-box; }
      div.form > table > tbody > tr > th > label {
        position: relative;
        top: 0px;
        left: 0px;
        display: block;
        cursor: auto; }
        div.form > table > tbody > tr > th > label > em {
          position: absolute;
          top: 50%;
          right: 0px;
          background: #ea0044;
          display: inline-block;
          color: #ffffff;
          font-size: 12px;
          font-style: normal;
          font-weight: normal;
          padding: 1px 3px;
          -webkit-transform: translateY(-50%);
                  transform: translateY(-50%); }
    div.form > table > tbody > tr > td {
      border-bottom: 1px solid #e5e5e5;
      font-size: 13px;
      padding: 20px;
      box-sizing: border-box; }
      div.form > table > tbody > tr > td span,
      div.form > table > tbody > tr > td label {
        display: inline-block;
        vertical-align: middle; }
  div.form input[type=text] {
    border: 1px solid #d9d9d9;
    border-radius: 3px;
    display: inline-block;
    vertical-align: middle;
    font-size: 15px;
    width: 100%;
    height: 35px;
    padding: 5px;
    outline: none;
    box-sizing: border-box;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none; }
    div.form input[type=text].r {
      background: #fef2f2; }
    div.form input[type=text].r_is_clear {
      background: #ffffff !important; }
    div.form input[type=text].error {
      border-color: #e90044; }
  div.form input[type=radio],
  div.form input[type=checkbox] {
    outline: none; }
    div.form input[type=radio].r,
    div.form input[type=checkbox].r {
      background: #fef2f2; }
    div.form input[type=radio].r_is_clear,
    div.form input[type=checkbox].r_is_clear {
      background: #ffffff !important; }
    div.form input[type=radio].error,
    div.form input[type=checkbox].error {
      border-color: #e90044; }
  div.form select {
    display: inline-block;
    width: 100%;
    outline: none;
    box-sizing: border-box;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none; }
    div.form select.r {
      background: #fef2f2; }
    div.form select.r_is_clear {
      background: #ffffff !important; }
    div.form select.error {
      border-color: #e90044; }
  div.form textarea {
    border: 1px solid #d9d9d9;
    border-radius: 3px;
    font-size: 15px;
    width: 100%;
    height: 200px;
    padding: 10px;
    outline: none;
    resize: none;
    box-sizing: border-box;
    -webkit-appearance: none;
       -moz-appearance: none;
            appearance: none; }
    div.form textarea.r {
      background: #fef2f2; }
    div.form textarea.r_is_clear {
      background: #ffffff !important; }
    div.form textarea.error {
      border-color: #e90044; }
  div.form div.radios > div,
  div.form div.checkboxs > div {
    width: 20%;
    margin-bottom: 10px;
    float: left; }
  div.form div.pulldown {
    position: relative; }
    div.form div.pulldown.r {
      background: #fef2f2; }
    div.form div.pulldown:after {
      position: absolute;
      top: 0px;
      right: 0px;
      content: '▼';
      line-height: 1;
      display: block;
      font-size: 12px;
      line-height: 34px;
      width: 36px;
      height: 34px;
      text-align: center;
      z-index: 0; }
    div.form div.pulldown.is_date {
      display: inline-block;
      width: 100px; }
      div.form div.pulldown.is_date:last-of-type {
        margin-right: 0; }
    div.form div.pulldown > select {
      position: relative;
      top: 0px;
      left: 0px;
      border: 1px solid #d9d9d9;
      border-radius: 3px;
      background: transparent;
      font-size: 12px;
      height: 34px;
      padding: 0 30px 0 5px;
      z-index: 1; }
  div.form p.error {
    color: #e90044;
    font-size: 12px;
    font-weight: bold; }
  div.form td.name > label {
    width: 210px; }
    div.form td.name > label:first-of-type {
      margin-right: 20px; }
    div.form td.name > label > span {
      width: 20%; }
    div.form td.name > label > input[type=text] {
      width: 80%; }
  div.form td.tel > span {
    text-align: center;
    width: 10%; }
  div.form td.tel > input[type=text] {
    width: 30%; }
    div.form td.tel > input[type=text]:first-of-type {
      width: 20%; }
  div.form td.address > div > span {
    text-align: center;
    width: 10%; }
  div.form td.address > div > input {
    width: 20%; }
    div.form td.address > div > input.full {
      width: 100%; }
  div.form td.date > div.pulldown {
    display: inline-block;
    width: 23.3333333333%; }
  div.form td.date > span {
    text-align: center;
    width: 10%; }
  div.form td.short_unit > input {
    width: 20%;
    margin-right: 4.347826087%; }
  div.form td.short_unit > span {
    width: 10%; }
  div.form td.middle_unit > input {
    width: 40%; }
  div.form td.middle_unit > span {
    text-align: center;
    width: 10%; }

/* ==========================================================================
	SP
	========================================================================== */
@media only screen and (max-width: 768px) {
  div.form {
    /* ==========================================================================
	パーツ
	========================================================================== */
    /*
* === 姓名 ===
*/ }
    div.form > div {
      margin: 0 4%; }
    div.form > table {
      width: 100%;
      margin-bottom: 15px;
      box-sizing: border-box; }
      div.form > table > tbody > tr > th {
        border-bottom: none;
        background: #e7e7e7;
        font-size: 13px;
        width: 100%;
        padding: 4px 10px 6px;
        display: block; }
        div.form > table > tbody > tr > th > label > br {
          display: none; }
        div.form > table > tbody > tr > th > label > em {
          position: relative;
          top: -1px;
          right: auto;
          vertical-align: middle;
          font-size: 9px;
          padding: 1px 3px;
          margin: 0 0 0 10px;
          -webkit-transform: translateY(0%);
                  transform: translateY(0%); }
      div.form > table > tbody > tr > td {
        border-bottom: none;
        display: block;
        width: 100%;
        padding: 10px 4%; }
    div.form td.name > label {
      width: 47.8260869565%; }
      div.form td.name > label:first-of-type {
        margin-right: 4.347826087%; }
      div.form td.name > label > span {
        width: 20%; }
      div.form td.name > label > input[type=text] {
        width: 80%; } }