{{ block title }}
調査
{{ endblock }}
{{ block content }}

<p><strong>あなたの普段のお買い物についてお尋ねします。<br>
  以下の(1)~(5)の項目について、普段どのくらい購入していますか？
  </strong></p>
  <p>(1) 嗜好品（ゲーム、本・漫画、映画等）</p>
    <table >
          <tr>
              {{ form.ne1_1 }}
          </tr>
  </table>
  <br>
  <p>(2) ファッション・アクセサリー</p>
    <table >
          <tr>
              {{ form.ne2_1 }}
          </tr>
  </table>
  <br>
  <p>(3) 食料品</p>
    <table >
          <tr>
              {{ form.ne3_1 }}
          </tr>
  </table>
  <br>
  <p>(4) 家電製品</p>
    <table >
          <tr>
              {{ form.ne4_1 }}
          </tr>
  </table>
  <br>
  <p>(5) 日用品</p>
    <table >
          <tr>
              {{ form.ne5_1 }}
          </tr>
  </table>
  <br>
  <p><strong>
  普段、以下の(6)~(10)の項目について、どのくらい<mark>インターネット通販を通じて</mark>購入していますか？
</strong></p>
<p>(6) 嗜好品（ゲーム、本・漫画、映画等）</p>
    <table >
          <tr>
              {{ form.ne1 }}
          </tr>
  </table>
  <br>
  <p>(7) ファッション・アクセサリー</p>
    <table >
          <tr>
              {{ form.ne2 }}
          </tr>
  </table>
  <br>
  <p>(8) 食料品</p>
    <table >
          <tr>
              {{ form.ne3 }}
          </tr>
  </table>
  <br>
  <p>(9) 家電製品</p>
    <table >
          <tr>
              {{ form.ne4 }}
          </tr>
  </table>
  <br>
  <p>(10) 日用品</p>
    <table >
          <tr>
              {{ form.ne5 }}
          </tr>
  </table>
  <br>

<p><strong>
  普段、以下の(11)~(15)の項目について、<mark>インターネット通販サイト・アプリ上の情報</mark>はどの程度信頼できると思いますか。
</strong></p>
<p>(11) 嗜好品（ゲーム、本・漫画、映画等）</p>
    <table >
          <tr>
              {{ form.ne1_2 }}
          </tr>
  </table>
  <br>
  <p>(12) ファッション・アクセサリー</p>
    <table >
          <tr>
              {{ form.ne2_2 }}
          </tr>
  </table>
  <br>
  <p>(13) 食料品</p>
    <table >
          <tr>
              {{ form.ne3_2 }}
          </tr>
  </table>
  <br>
  <p>(14) 家電製品</p>
    <table >
          <tr>
              {{ form.ne4_2 }}
          </tr>
  </table>
  <br>
  <p>(15) 日用品</p>
    <table >
          <tr>
              {{ form.ne5_2 }}
          </tr>
  </table>
  <br>

<table>
    <tr>
        <td colspan="7">
            <p>(16) 普段インターネット通販で買い物をする際に利用しているサイトやアプリについて、当てはまるものをすべて選んでください。</p>
        </td>
    </tr>
    <tr>
         <td>
        <input type="checkbox"  name="ne6_1" id="ne6_1" />
        <label for="ne6_1">Amazon</label>
      </td>
      <td>
        <input type="checkbox"  name="ne6_2" id="ne6_2" >
        <label for="ne6_2">楽天</label>
      </td>
      <td>
        <input type="checkbox"  name="ne6_3" id="ne6_3" >
        <label for="ne6_3">メルカリ</label>
      </td>
      <td>
        <input type="checkbox"  name="ne6_4" id="ne6_4" />
        <label for="ne6_4">ジモティー</label>
      </td>
      <td>
        <input type="checkbox"  name="ne6_5" id="ne6_5" >
        <label for="ne6_5">ヤフオク</label>
      </td>
      <td>
        <input type="checkbox"  name="ne6_6" id="ne6_6" >
        <label for="ne6_6">ZOZOTOWN</label>
      </td>
      <td>
        <input type="checkbox"  name="ne6_7" id="ne6_7" />
        <label for="ne6_7">その他</label>
      </td>
    </tr>
</table>
</div>
<br>
<p>(16-1) 「その他」を選んだ方：利用しているインターネット通販サイト・アプリをお答えください。</p>
    <input name="ne6_e" type="text" size="40" placeholder="回答を入力" />
    <br>
    <br>

    {{ next_button }}

    <style>
        body {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-pack: center;
              -ms-flex-pack: center;
                  justify-content: center;
          -webkit-box-align: center;
              -ms-flex-align: center;
                  align-items: center;
          min-height: 100vh;
          color: black;
        }
        
        h1 {
          margin: 0 0 1em;
        }
        
        .group {
          display: -webkit-box;
          display: -ms-flexbox;
          display: flex;
          -webkit-box-align: center;
              -ms-flex-align: center;
                  align-items: center;
          margin-bottom: 2em;
        }
        
        input[type="checkbox"],
        input[type="radio"] {
          position: absolute;
          opacity: 0;
          z-index: -1;
        }
        
        label {
          position: relative;
          margin-right: 1em;
          padding-left: 2em;
          padding-right: 1em;
          line-height: 2;
          cursor: pointer;
        }
        
        label:before {
          -webkit-box-sizing: border-box;
                  box-sizing: border-box;
          content: " ";
          position: absolute;
          top: 0.3em;
          left: 0;
          display: block;
          width: 1.4em;
          height: 1.4em;
          border: 2px solid black;
          border-radius: .25em;
          z-index: -1;
        }
        
        input[type="radio"] + label::before {
          border-radius: 1em;
        }
        
        /* Checked */
        input[type="checkbox"]:checked + label,
        input[type="radio"]:checked + label {
          padding-left: 1em;
          color: white;
        }
        
        input[type="checkbox"]:checked + label:before,
        input[type="radio"]:checked + label:before {
          top: 0;
          width: 100%;
          height: 2em;
          background: black;
        }
        
        /* Transition */
        label,
        label::before {
          -webkit-transition: .25s all ease;
          transition: .25s all ease;
        }
        /*# sourceMappingURL=main.css.map */
        </style>

{{ endblock }}